docs: update all docs to default to using the named export (#1813)

Author: johnf

MIGRATION.md

@@ -53,7 +53,7 @@ Update your import statements to use the new library names
 import Fontisto from "react-native-vector-icons";
 
 // New
-import Fontisto from "@react-native-vector-icons/fontisto";
+import { Fontisto } from "@react-native-vector-icons/fontisto";
 ```
 
 ### Move to new props for Fontawesome 5 and 6

README.md

@@ -106,9 +106,9 @@ For fonts like fontawesome6-pro, fontello and icomoon where you provide the font
 You can either use one of the bundled icons above or roll your own custom font.
 
 ```js
-import Icon from "@react-native-vector-icons/fontawesome";
+import { FontAwesome } from "@react-native-vector-icons/fontawesome";
 
-<Icon name="rocket" size={30} color="#900" />;
+<FontAwesome name="rocket" size={30} color="#900" />;
 ```
 
 ### Props
@@ -144,13 +144,13 @@ By combining some of these you can create for example :
 Some fonts today use multiple styles, FontAwesome 6 for example, which is supported by this library. The usage is pretty much the same as the standard `Icon` component:
 
 ```jsx
-import Icon from "@react-native-vector-icons/fontawesome5";
+import { FontAwesome5 } from "@react-native-vector-icons/fontawesome5";
 
-<Icon name="comments" size={30} color="#900" />; // Defaults to regular
+<FontAwesome5 name="comments" size={30} color="#900" />; // Defaults to regular
 
-<Icon name="comments" size={30} color="#900" iconType="solid" />
+<FontAwesome5 name="comments" size={30} color="#900" iconType="solid" />
 
-<Icon name="comments" size={30} color="#900" iconType="light" />
+<FontAwesome5 name="comments" size={30} color="#900" iconType="light" />
 ```
 
 ## Usage as PNG Image/Source Object
@@ -243,20 +243,22 @@ Try the `IconExplorer` project in `Examples/IconExplorer` folder, there you can
 ### Basic Example
 
 ```js
-import Icon from "@react-native-vector-icons/ionicons";
+import { IonIcons } from "@react-native-vector-icons/ionicons";
 
-const ExampleView = () => <Icon name="ios-person" size={30} color="#4F8EF7" />;
+const ExampleView = () => (
+  <IonIcon name="ios-person" size={30} color="#4F8EF7" />
+);
 ```
 
 ### Inline Icons
 
 ```js
 import { Text } from "react-native";
-import Icon from "@react-native-vector-icons/ionicons";
+import { IonIcons } from "@react-native-vector-icons/ionicons";
 
 const ExampleView = (props) => (
   <Text>
-    Lorem <Icon name="ios-book" color="#4F8EF7" /> Ipsum
+    Lorem <IonIcon name="ios-book" color="#4F8EF7" /> Ipsum
   </Text>
 );
 ```

packages/ant-design/README.md

@@ -12,8 +12,8 @@ npm install @react-native-vector-icons/ant-design
 
 ## Usage
 
-```js
-import AntDesign from '@react-native-vector-icons/ant-design';
+```jsx
+import { AntDesign } from '@react-native-vector-icons/ant-design';
 
 // ...
 

packages/entypo/README.md

@@ -12,8 +12,8 @@ npm install @react-native-vector-icons/entypo
 
 ## Usage
 
-```js
-import Entypo from '@react-native-vector-icons/entypo';
+```jsx
+import { Entypo } from '@react-native-vector-icons/entypo';
 
 // ...
 

packages/evil-icons/README.md

@@ -12,8 +12,8 @@ npm install @react-native-vector-icons/evil-icons
 
 ## Usage
 
-```js
-import EvilIcons from '@react-native-vector-icons/evil-icons';
+```jsx
+import { EvilIcons } from '@react-native-vector-icons/evil-icons';
 
 // ...
 

packages/feather/README.md

@@ -12,8 +12,8 @@ npm install @react-native-vector-icons/feather
 
 ## Usage
 
-```js
-import Feather from '@react-native-vector-icons/feather';
+```jsx
+import { Feather } from '@react-native-vector-icons/feather';
 
 // ...
 

packages/fontawesome/README.md

@@ -12,8 +12,8 @@ npm install @react-native-vector-icons/fontawesome
 
 ## Usage
 
-```js
-import FontAwesome from '@react-native-vector-icons/fontawesome';
+```jsx
+import { FontAwesome } from '@react-native-vector-icons/fontawesome';
 
 // ...
 

packages/fontawesome5-pro/README.md

@@ -20,7 +20,7 @@ All you really need to do is adding the Pro fonts to the `rnvi-fonts/fontawesome
 Using the standard icons works just like the standard icons in this library.
 
 ```javascript
-import FontAwesome5Pro from "@react-native-vector-icons/fontawesome5-pro";
+import { FontAwesome5Pro } from "@react-native-vector-icons/fontawesome5-pro";
 
 const icon = <FontAwesome5Pro name="comments" />;
 ```
@@ -29,7 +29,7 @@ Something special about the FontAwesome5Pro class is that you can also pass prop
 to change the style of the icon:
 
 ```javascript
-import FontAwesome5Pro from "@react-native-vector-icons/fontawesome5-pro";
+import { FontAwesome5Pro } from "@react-native-vector-icons/fontawesome5-pro";
 
 const icon = <FontAwesome5Pro name="comments" iconStyle="solid" />;
 const icon = <FontAwesome5Pro name="git" iconStyle="brand" />;
@@ -56,7 +56,7 @@ style is required.
 Use this to select which style the generated image should have:
 
 ```javascript
-import FontAwesome5Pro from "@react-native-vector-icons/fontawesome5-pro";
+import { FontAwesome5Pro } from "@react-native-vector-icons/fontawesome5-pro";
 
 FontAwesome5Pro.getImageSource("solid", "comments", 30, "#000").then((source) =>
   this.setState({ image: source }),

packages/fontawesome5/README.md

@@ -10,7 +10,7 @@
 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 = <FontAwesome5 name="comments" />;
 ```
@@ -19,15 +19,15 @@ 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 = <FontAwesome5 name="comments" iconStyle="solid" />;
 const icon = <FontAwesome5 name="git" iconStyle="brand" />;
 ```
 
 **Valid types**
 
-| Type        | Description            |
+| Type        | Description           |
 | ----------- | --------------------- |
 | **regular** | Uses the Regular font |
 | **brand**   | Uses the Brands font  |
@@ -44,10 +44,10 @@ style is required.
 Use this to select which style the generated image should have:
 
 ```javascript
-import FontAwesome5 from '@react-native-vector-icons/fontawesome5';
+import { FontAwesome5 } from "@react-native-vector-icons/fontawesome5";
 
-FontAwesome5.getImageSource('solid', 'comments', 30, '#000').then(
-  (source) => this.setState({ image: source })
+FontAwesome5.getImageSource("solid", "comments", 30, "#000").then((source) =>
+  this.setState({ image: source }),
 );
 ```
 

packages/fontawesome6-pro/README.md

@@ -20,7 +20,7 @@ All you really need to do is adding the Pro fonts to the `rnvi-fonts/fontawesome
 Using the standard icons works just like the standard icons in this library.
 
 ```javascript
-import FontAwesome6Pro from "@react-native-vector-icons/fontawesome6-pro";
+import { FontAwesome6Pro } from "@react-native-vector-icons/fontawesome6-pro";
 
 const icon = <FontAwesome6Pro name="comments" />;
 ```
@@ -29,7 +29,7 @@ Something special about the FontAwesome6Pro class is that you can also pass prop
 to change the style of the icon:
 
 ```javascript
-import FontAwesome6Pro from "@react-native-vector-icons/fontawesome6-pro";
+import { FontAwesome6Pro } from "@react-native-vector-icons/fontawesome6-pro";
 
 const icon = <FontAwesome6Pro name="comments" iconStyle="solid" />;
 const icon = <FontAwesome6Pro name="git" iconStyle="brand" />;
@@ -60,7 +60,7 @@ style is required.
 Use this to select which style the generated image should have:
 
 ```javascript
-import FontAwesome6Pro from "@react-native-vector-icons/fontawesome6-pro";
+import { FontAwesome6Pro } from "@react-native-vector-icons/fontawesome6-pro";
 
 FontAwesome6Pro.getImageSource("solid", "comments", 30, "#000").then((source) =>
   this.setState({ image: source }),