docs: update guides

Author: lukewalczak

docs/docs/guides/01-getting-started.md

@@ -32,11 +32,17 @@ Specifically `MaterialDesignIcons` icon pack needs to be included in the project
 npm install @react-native-vector-icons/common @react-native-vector-icons/material-design-icons
 ```
 
-The library has specified dedicated steps for each platform. Please follow their [installation guide](https://github.com/oblador/react-native-vector-icons#installation) in order to properly use icon fonts.
+:::note
+The `react-native-vector-icons` library requires some additional setup steps for each platform. To ensure proper use of icon fonts, please follow their [installation guide](https://github.com/oblador/react-native-vector-icons?tab=readme-ov-file#setup).
+:::
 
+If you use Expo, you don't need to install vector icons - those are the part of the expo package. However, if you have a `babel.config.js` or `.babelrc` file, make sure that it includes `babel-preset-expo`.
+
+:::info
 If you don't want to install vector icons, you can use [babel-plugin-optional-require](https://github.com/satya164/babel-plugin-optional-require) to opt-out.
+:::note
 
-If you use Expo, you don't need to install vector icons. But if you have a `babel.config.js` or `.babelrc` file, make sure that it includes `babel-preset-expo`.
+### Bundle size optimization
 
 To get smaller bundle size by excluding modules you don't use, you can use our optional babel plugin. The plugin automatically rewrites the import statements so that only the modules you use are imported instead of the whole library. Add `react-native-paper/babel` to the `plugins` section in your `babel.config.js` for production environment. It should look like this:
 

docs/docs/guides/03-icons.mdx

@@ -2,15 +2,15 @@
 title: Icons
 ---
 
-import IconsList from '@site/src/components/IconsList.tsx';
-
 # Icons
 
 ## Configuring icons
 
-Many of the components require the [react-native-vector-icons](https://github.com/oblador/react-native-vector-icons) library to render correctly. If you're using Expo, you don't need to do anything extra, but if it's a vanilla React Native project, you need to link the library as described in the getting started guide.
+Many of the components require the [react-native-vector-icons](https://github.com/oblador/react-native-vector-icons) library to render correctly. If you're using Expo, you don't need to do anything extra, but if it's a vanilla React Native project, you need to link the library as described in the [getting started guide](./01-getting-started.md).
 
+:::note
 If you opted out of vector icons support using [babel-plugin-optional-require](https://github.com/satya164/babel-plugin-optional-require), you won't be able to use icon names for the icon prop. Some components may not look correct without vector icons and might need extra configuration.
+:::
 
 ## Using the `icon` prop
 
@@ -28,7 +28,6 @@ Example:
 
 <details>
   <summary>See the list of supported icons</summary>
-  <IconsList />
 </details>
 
 ### 2. An image source

docs/plugins/docusaurus-react-native-plugin.js

@@ -11,7 +11,7 @@ module.exports = function () {
             react: path.resolve('node_modules/react'),
             'react-native$': 'react-native-web',
             'react-native-paper': path.resolve('../src'),
-            '@react-native-vector-icons/material-design-icons': path.resolve(
+            'react-native-vector-icons/MaterialCommunityIcons': path.resolve(
               'node_modules/@react-native-vector-icons/material-design-icons'
             ),
           },

src/components/MaterialCommunityIcon.tsx

@@ -31,12 +31,8 @@ const loadIconModule = () => {
       return require('@react-native-vector-icons/material-design-icons')
         .default;
     } catch (e) {
-      try {
-        return require('react-native-vector-icons/MaterialCommunityIcons')
-          .default;
-      } catch (e) {
-        return null;
-      }
+      return require('react-native-vector-icons/MaterialCommunityIcons')
+        .default;
     }
   }
 };