diff --git a/packages/fontawesome-common/README.md b/packages/fontawesome-common/README.md
index 57ac53fa0..28b6696a9 100644
--- a/packages/fontawesome-common/README.md
+++ b/packages/fontawesome-common/README.md
@@ -1,73 +1 @@
-# FontAwesome 5 Pro
-
-## Installing the Pro Fonts
-
-You need your FontAwesome npm token which can be obtained by logging into your
-account and then access the `Services` tab.
-
-Run `yarn fa5-upgrade` and enter the token
-when asked to in order to upgrade to the Pro version. It will install the fonts
-in your repo in the `rnvi-fonts` directory but the folder can be customized by
-setting it when executing the command: `yarn fa5-upgrade [destination]`.
-
-### Manually
-
-If the shell script does not work you can install the Pro version manually.
-All you really need to do is adding the Pro fonts to the `rnvi-fonts` directory
-
-## Usage
-
-Using the standard icons works just like the standard icons in this library.
-
-```javascript
-import FontAwesome5Pro from 'react-native-vector-icons/FontAwesome5Pro';
-
-const icon = ;
-```
-
-Something special about the FontAwesome5Pro class is that you can also pass props
-to change the style of the icon:
-
-```javascript
-import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
-
-const icon = ;
-const icon = ;
-```
-
-**Valid types**
-
-| Type | Description |
-| --------- | ------------------------------------------- |
-| **brand** | Uses the Brands font |
-| **light** | Uses the Light font (pro) or Regular (Free) |
-| **solid** | Uses the Solid font |
-
-No specified type indicates Regular font.
-
-### getImageSource
-
-`getImageSource` works a little different due to its native backend and how
-the font is separated into different files. Therefore, the enum FA5Style is
-defined to help setting the style of the font:
-
-```javascript
-const FA5Style = {
- regular: 0,
- light: 1,
- solid: 2,
- brand: 3,
-};
-```
-
-Use this to select which style the generated image should have:
-
-```javascript
-import FontAwesome5, { FA5Style } from 'react-native-vector-icons/FontAwesome5';
-
-FontAwesome5.getImageSource('comments', 30, '#000', FA5Style.solid).then(
- (source) => this.setState({ image: source })
-);
-```
-
-Not passing a style will result in Regular style.
+# FontAwesome Common
diff --git a/packages/fontawesome-common/generators/app/templates/src/index.tsx b/packages/fontawesome-common/generators/app/templates/src/index.tsx
index 966b2c70e..c62746712 100644
--- a/packages/fontawesome-common/generators/app/templates/src/index.tsx
+++ b/packages/fontawesome-common/generators/app/templates/src/index.tsx
@@ -97,23 +97,18 @@ const Icon = (props: Props) => {
type GetImageSourceFunc = {
<% meta.styleNames.forEach((styleName) => { -%>
(
- name: keyof typeof <%= styleName %>GM,
- size: number,
- color: TextStyle['color'],
iconStyle: '<%= styleName %>',
+ name: keyof typeof <%= styleName %>GM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.<%= styleName %>)['getImageSource']>;
<% }) -%>
- (
- name: keyof typeof <%= meta.defaultStyleName %>GM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.<%= meta.defaultStyleName %>)['getImageSource']>;
};
const getImageSource: GetImageSourceFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = '<%= meta.defaultStyleName %>',
) => {
switch (iconStyle) {
<% meta.styleNames.forEach((styleName) => { -%>
@@ -130,23 +125,18 @@ Icon.getImageSource = getImageSource;
type GetImageSourceSyncFunc = {
<% meta.styleNames.forEach((styleName) => { -%>
(
- name: keyof typeof <%= styleName %>GM,
- size: number,
- color: TextStyle['color'],
iconStyle: '<%= styleName %>',
+ name: keyof typeof <%= styleName %>GM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.<%= styleName %>)['getImageSourceSync']>;
<% }) -%>
- (
- name: keyof typeof <%= meta.defaultStyleName %>GM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.<%= meta.defaultStyleName %>)['getImageSourceSync']>;
};
const getImageSourceSync: GetImageSourceSyncFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
<% meta.styleNames.forEach((styleName) => { -%>
diff --git a/packages/fontawesome5-pro/README.md b/packages/fontawesome5-pro/README.md
index 8043dcc86..a1c3b3b68 100644
--- a/packages/fontawesome5-pro/README.md
+++ b/packages/fontawesome5-pro/README.md
@@ -31,45 +31,34 @@ to change the style of the icon:
```javascript
import FontAwesome5Pro from '@react-native-vector-icons/fontawesome5-pro';
-const icon = ;
-const icon = ;
+const icon = ;
+const icon = ;
```
**Valid types**
-| Type | Description |
-| -------------- | ------------------------- |
-| **brand** | Uses the Brands font |
-| **solid** | Uses the Solid font |
-| **light** | Uses the Light font |
-| **duotone** | Uses the Duotone font |
+| Type | Description |
+| ------------ | --------------------- |
+| **regular** | Uses the Regular font |
+| **brand** | Uses the Brands font |
+| **solid** | Uses the Solid font |
+| **light** | Uses the Light font |
+| **duotone** | Uses the Duotone font |
No specified type indicates Regular font.
### getImageSource
-`getImageSource` works a little different due to its native backend and how
-the font is separated into different files. Therefore, the enum FA5Style is
-defined to help setting the style of the font:
-
-```javascript
-const FA5Style = {
- regular: 'regular',
- light: 'light',
- solid: 'solid',
- brand: 'brand',
- duotone: 'duotone',
-};
-```
+`getImageSource` works a little different due to its native backend and how the
+font is separated into different files. An extra argument to specify the font
+style is required.
Use this to select which style the generated image should have:
```javascript
-import FontAwesome5, { FA5Style } from 'react-native-vector-icons/FontAwesome5';
+import FontAwesome5Pro from '@react-native-vector-icons/fontawesome5-pro';
-FontAwesome5.getImageSource('comments', 30, '#000', FA5Style.solid).then(
+FontAwesome5Pro.getImageSource('solid', 'comments', 30, '#000').then(
(source) => this.setState({ image: source })
);
```
-
-Not passing a style will result in Regular style.
diff --git a/packages/fontawesome5-pro/src/index.tsx b/packages/fontawesome5-pro/src/index.tsx
index 3b452813a..b2d07dc0a 100644
--- a/packages/fontawesome5-pro/src/index.tsx
+++ b/packages/fontawesome5-pro/src/index.tsx
@@ -148,46 +148,41 @@ const Icon = (props: Props) => {
type GetImageSourceFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSource']>;
(
- name: keyof typeof duotoneGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'duotone',
+ name: keyof typeof duotoneGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.duotone)['getImageSource']>;
(
- name: keyof typeof lightGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'light',
+ name: keyof typeof lightGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.light)['getImageSource']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSource']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSource']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSource']>;
};
const getImageSource: GetImageSourceFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
@@ -209,46 +204,41 @@ Icon.getImageSource = getImageSource;
type GetImageSourceSyncFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSourceSync']>;
(
- name: keyof typeof duotoneGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'duotone',
+ name: keyof typeof duotoneGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.duotone)['getImageSourceSync']>;
(
- name: keyof typeof lightGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'light',
+ name: keyof typeof lightGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.light)['getImageSourceSync']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSourceSync']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
};
const getImageSourceSync: GetImageSourceSyncFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
diff --git a/packages/fontawesome5/README.md b/packages/fontawesome5/README.md
index 6b82f6d84..9c2c98b0f 100644
--- a/packages/fontawesome5/README.md
+++ b/packages/fontawesome5/README.md
@@ -10,58 +10,47 @@
Using the standard icons works just like the standard icons in this library.
```javascript
-import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
+import FontAwesome5 from '@react-native-vector-icons/fontawesome5';
-const icon = ;
+const icon = ;
```
Something special about the FontAwesome5 class is that you can also pass props
to change the style of the icon:
```javascript
-import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
+import FontAwesome5 from '@react-native-vector-icons/fontawesome5';
-const icon = ;
-const icon = ;
+const icon = ;
+const icon = ;
```
**Valid types**
-| Type | Description |
-| --------- | ------------------------------------------- |
-| **brand** | Uses the Brands font |
-| **light** | Uses the Light font (pro) or Regular (Free) |
-| **solid** | Uses the Solid font |
+| Type | Description |
+| ----------- | --------------------- |
+| **regular** | Uses the Regular font |
+| **brand** | Uses the Brands font |
+| **solid** | Uses the Solid font |
No specified type indicates Regular font.
## getImageSource
-`getImageSource` works a little different due to its native backend and how
-the font is separated into different files. Therefore, the enum FA5Style is
-defined to help setting the style of the font:
-
-```javascript
-const FA5Style = {
- regular: 0,
- light: 1,
- solid: 2,
- brand: 3,
-};
-```
+`getImageSource` works a little different due to its native backend and how the
+font is separated into different files. An extra argument to specify the font
+style is required.
Use this to select which style the generated image should have:
```javascript
-import FontAwesome5, { FA5Style } from 'react-native-vector-icons/FontAwesome5';
+import FontAwesome5 from '@react-native-vector-icons/fontawesome5';
-FontAwesome5.getImageSource('comments', 30, '#000', FA5Style.solid).then(
+FontAwesome5.getImageSource('solid', 'comments', 30, '#000').then(
(source) => this.setState({ image: source })
);
```
-Not passing a style will result in Regular style.
-
# Upgrading to Pro
Use the `@react-native-vector-icons/fontawesome5-pro` package instead.
diff --git a/packages/fontawesome5/src/index.tsx b/packages/fontawesome5/src/index.tsx
index 4537c1fc7..b2f075d38 100644
--- a/packages/fontawesome5/src/index.tsx
+++ b/packages/fontawesome5/src/index.tsx
@@ -116,34 +116,29 @@ const Icon = (props: Props) => {
type GetImageSourceFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSource']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSource']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSource']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSource']>;
};
const getImageSource: GetImageSourceFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
@@ -161,34 +156,29 @@ Icon.getImageSource = getImageSource;
type GetImageSourceSyncFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSourceSync']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSourceSync']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
};
const getImageSourceSync: GetImageSourceSyncFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
diff --git a/packages/fontawesome6-pro/README.md b/packages/fontawesome6-pro/README.md
index 792a9f299..f8e971d24 100644
--- a/packages/fontawesome6-pro/README.md
+++ b/packages/fontawesome6-pro/README.md
@@ -31,8 +31,8 @@ to change the style of the icon:
```javascript
import FontAwesome6Pro from '@react-native-vector-icons/fontawesome6-pro';
-const icon = ;
-const icon = ;
+const icon = ;
+const icon = ;
```
**Valid types**
@@ -53,33 +53,14 @@ No specified type indicates Regular font.
### getImageSource
-`getImageSource` works a little different due to its native backend and how
-the font is separated into different files. Therefore, the enum FA6Style is
-defined to help setting the style of the font:
+`getImageSource` works a little different due to its native backend and how the
+font is separated into different files. An extra argument to specify the font
+style is required.
```javascript
-const FA6Style = {
- regular: 'regular',
- light: 'light',
- solid: 'solid',
- brand: 'brand',
- sharp: 'sharp',
- sharpThin: 'sharpThin',
- sharpLight: 'sharpLight',
- sharpSolif: 'sharpSolid',
- duotone: 'duotone',
- thin: 'thin',
-};
-```
-
-Use this to select which style the generated image should have:
-
-```javascript
-import FontAwesome6, { FA6Style } from 'react-native-vector-icons/FontAwesome6';
+import FontAwesome6Pro from '@react-native-vector-icons/fontawesome6-pro';
-FontAwesome6.getImageSource('comments', 30, '#000', FA6Style.solid).then(
+FontAwesome6Pro.getImageSource('solid', 'comments', 30, '#000').then(
(source) => this.setState({ image: source })
);
```
-
-Not passing a style will result in Regular style.
diff --git a/packages/fontawesome6-pro/src/index.tsx b/packages/fontawesome6-pro/src/index.tsx
index 6200ff7e1..a6643aeda 100644
--- a/packages/fontawesome6-pro/src/index.tsx
+++ b/packages/fontawesome6-pro/src/index.tsx
@@ -228,76 +228,71 @@ const Icon = (props: Props) => {
type GetImageSourceFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSource']>;
(
- name: keyof typeof duotoneGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'duotone',
+ name: keyof typeof duotoneGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.duotone)['getImageSource']>;
(
- name: keyof typeof lightGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'light',
+ name: keyof typeof lightGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.light)['getImageSource']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSource']>;
(
- name: keyof typeof sharpGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharp',
+ name: keyof typeof sharpGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharp)['getImageSource']>;
(
- name: keyof typeof sharpLightGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharpLight',
+ name: keyof typeof sharpLightGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharpLight)['getImageSource']>;
(
- name: keyof typeof sharpSolidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharpSolid',
+ name: keyof typeof sharpSolidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharpSolid)['getImageSource']>;
(
- name: keyof typeof sharpThinGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharpThin',
+ name: keyof typeof sharpThinGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharpThin)['getImageSource']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSource']>;
(
- name: keyof typeof thinGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'thin',
+ name: keyof typeof thinGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.thin)['getImageSource']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSource']>;
};
const getImageSource: GetImageSourceFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
@@ -329,76 +324,71 @@ Icon.getImageSource = getImageSource;
type GetImageSourceSyncFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSourceSync']>;
(
- name: keyof typeof duotoneGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'duotone',
+ name: keyof typeof duotoneGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.duotone)['getImageSourceSync']>;
(
- name: keyof typeof lightGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'light',
+ name: keyof typeof lightGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.light)['getImageSourceSync']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
(
- name: keyof typeof sharpGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharp',
+ name: keyof typeof sharpGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharp)['getImageSourceSync']>;
(
- name: keyof typeof sharpLightGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharpLight',
+ name: keyof typeof sharpLightGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharpLight)['getImageSourceSync']>;
(
- name: keyof typeof sharpSolidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharpSolid',
+ name: keyof typeof sharpSolidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharpSolid)['getImageSourceSync']>;
(
- name: keyof typeof sharpThinGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'sharpThin',
+ name: keyof typeof sharpThinGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.sharpThin)['getImageSourceSync']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSourceSync']>;
(
- name: keyof typeof thinGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'thin',
+ name: keyof typeof thinGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.thin)['getImageSourceSync']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
};
const getImageSourceSync: GetImageSourceSyncFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
diff --git a/packages/fontawesome6/README.md b/packages/fontawesome6/README.md
index 28f8cb79c..8b51325b4 100644
--- a/packages/fontawesome6/README.md
+++ b/packages/fontawesome6/README.md
@@ -10,70 +10,47 @@
Using the standard icons works just like the standard icons in this library.
```javascript
-import FontAwesome6 from 'react-native-vector-icons/FontAwesome6';
+import FontAwesome6 from '@react-native-vector-icons/fontawesome6';
-const icon = ;
+const icon = ;
```
Something special about the FontAwesome6 class is that you can also pass props
to change the style of the icon:
```javascript
-import FontAwesome6 from 'react-native-vector-icons/FontAwesome6';
+import FontAwesome6 from '@react-native-vector-icons/fontawesome6';
-const icon = ;
-const icon = ;
+const icon = ;
+const icon = ;
```
**Valid types**
-| Type | Description |
-| -------------- | ------------------------------------------------- |
-| **brand** | Uses the Brands font |
-| **solid** | Uses the Solid font |
-| **light** | Uses the Light font (pro) or Regular (Free) |
-| **thin** | Uses the Thin font (pro) or Regular (Free) |
-| **duotone** | Uses the Duotone font (pro) or Regular (Free) |
-| **sharpSolid** | Uses the Sharp Solid font (pro) or Regular (Free) |
-| **sharpThin** | Uses the Sharp Thin font (pro) or Regular (Free) |
-| **sharpLight** | Uses the Sharp Light font (pro) or Regular (Free) |
-| **sharp** | Uses the Sharp font (pro) or Regular (Free) |
+| Type | Description |
+| ----------- | --------------------- |
+| **regular** | Uses the Regular font |
+| **brand** | Uses the Brands font |
+| **solid** | Uses the Solid font |
No specified type indicates Regular font.
## getImageSource
-`getImageSource` works a little different due to its native backend and how
-the font is separated into different files. Therefore, the enum FA6Style is
-defined to help setting the style of the font:
-
-```javascript
-const FA6Style = {
- regular: 'regular',
- light: 'light',
- solid: 'solid',
- brand: 'brand',
- sharp: 'sharp',
- sharpThin: 'sharpThin',
- sharpLight: 'sharpLight',
- sharpSolif: 'sharpSolid',
- duotone: 'duotone',
- thin: 'thin',
-};
-```
+`getImageSource` works a little different due to its native backend and how the
+font is separated into different files. An extra argument to specify the font
+style is required.
Use this to select which style the generated image should have:
```javascript
-import FontAwesome6, { FA6Style } from 'react-native-vector-icons/FontAwesome6';
+import FontAwesome6 from '@react-native-vector-icons/fontawesome6';
-FontAwesome6.getImageSource('comments', 30, '#000', FA6Style.solid).then(
+FontAwesome6.getImageSource('solid', 'comments', 30, '#000').then(
(source) => this.setState({ image: source })
);
```
-Not passing a style will result in Regular style.
-
# Upgrading to Pro
Use the `@react-native-vector-icons/fontawesome6-pro` package instead.
diff --git a/packages/fontawesome6/src/index.tsx b/packages/fontawesome6/src/index.tsx
index 7f4f1e7f1..4c1b2cf8a 100644
--- a/packages/fontawesome6/src/index.tsx
+++ b/packages/fontawesome6/src/index.tsx
@@ -116,34 +116,29 @@ const Icon = (props: Props) => {
type GetImageSourceFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSource']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSource']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSource']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSource']>;
};
const getImageSource: GetImageSourceFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
@@ -161,34 +156,29 @@ Icon.getImageSource = getImageSource;
type GetImageSourceSyncFunc = {
(
- name: keyof typeof brandGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'brand',
+ name: keyof typeof brandGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.brand)['getImageSourceSync']>;
(
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'regular',
+ name: keyof typeof regularGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
(
- name: keyof typeof solidGM,
- size: number,
- color: TextStyle['color'],
iconStyle: 'solid',
+ name: keyof typeof solidGM,
+ size?: number,
+ color?: TextStyle['color'],
): ReturnType<(typeof Icons.solid)['getImageSourceSync']>;
- (
- name: keyof typeof regularGM,
- size: number,
- color: TextStyle['color'],
- ): ReturnType<(typeof Icons.regular)['getImageSourceSync']>;
};
const getImageSourceSync: GetImageSourceSyncFunc = (
+ iconStyle,
name,
size = DEFAULT_ICON_SIZE,
color = DEFAULT_ICON_COLOR,
- iconStyle = 'regular',
) => {
switch (iconStyle) {
case 'brand':
diff --git a/scripts/build.sh b/scripts/build.sh
index 0ebd3eb44..dea8a30b2 100755
--- a/scripts/build.sh
+++ b/scripts/build.sh
@@ -4,7 +4,9 @@ set -e
cd packages
-for package in *; do
+PACKAGES=${@:-$(ls -d */)}
+
+for package in $PACKAGES; do
if [ ! -f "$package/.yo-rc.json" ]; then
continue
fi