From ceba217a86e4d6c0a71c1bcf330150f5ce84f50c Mon Sep 17 00:00:00 2001
From: Adrian Cotfas <adrcotfas@gmail.com>
Date: Thu, 28 May 2026 16:42:32 +0300
Subject: [PATCH] fix(docs): resolve SSR crash and webpack warnings in docs
 build

- Inject polyfills/dev.js via getClientModules to define globalThis.__DEV__ for both client and SSR bundles; needed because the new Switch pulls in react-native-reanimated which assumes this global exists
- Alias @expo/vector-icons/MaterialCommunityIcons to material-design-icons (already present) and @react-native-vector-icons/get-image to false
- Flatten CSS nesting in custom.css to fix CSS minimizer warnings about unsupported & selector syntax
- Add isDynamicColorSupported = false to the non-Android DynamicTheme fallback, which was missing the re-exported symbol
- Fix TypescaleKey re-export to use the type keyword
---
 .../plugins/docusaurus-react-native-plugin.js |  7 ++++++
 docs/plugins/polyfills/dev.js                 |  1 +
 docs/src/css/custom.css                       | 24 ++++++++++---------
 src/index.tsx                                 |  2 +-
 src/theme/schemes/DynamicTheme.tsx            |  2 ++
 5 files changed, 24 insertions(+), 12 deletions(-)
 create mode 100644 docs/plugins/polyfills/dev.js

diff --git a/docs/plugins/docusaurus-react-native-plugin.js b/docs/plugins/docusaurus-react-native-plugin.js
index 3a05c223bc..a988c758c1 100644
--- a/docs/plugins/docusaurus-react-native-plugin.js
+++ b/docs/plugins/docusaurus-react-native-plugin.js
@@ -14,10 +14,17 @@ module.exports = function () {
             'react-native-vector-icons/MaterialCommunityIcons': path.resolve(
               'node_modules/@react-native-vector-icons/material-design-icons'
             ),
+            '@expo/vector-icons/MaterialCommunityIcons': path.resolve(
+              'node_modules/@react-native-vector-icons/material-design-icons'
+            ),
+            '@react-native-vector-icons/get-image': false,
           },
           extensions: ['.web.js'],
         },
       };
     },
+    getClientModules() {
+      return [path.resolve(__dirname, 'polyfills/dev.js')];
+    },
   };
 };
diff --git a/docs/plugins/polyfills/dev.js b/docs/plugins/polyfills/dev.js
new file mode 100644
index 0000000000..858d361278
--- /dev/null
+++ b/docs/plugins/polyfills/dev.js
@@ -0,0 +1 @@
+globalThis.__DEV__ = process.env.NODE_ENV !== 'production';
diff --git a/docs/src/css/custom.css b/docs/src/css/custom.css
index 6594e61fb7..a382d6268e 100644
--- a/docs/src/css/custom.css
+++ b/docs/src/css/custom.css
@@ -128,8 +128,10 @@ html[data-theme='light'] .gallery-dark {
   height: 124px;
   align-items: center;
   text-align: center;
+}
 
-  @media (max-width: 680px) {
+@media (max-width: 680px) {
+  .icons-list-icon-container {
     width: 96px;
   }
 }
@@ -153,10 +155,10 @@ html[data-theme='light'] .gallery-dark {
   flex-wrap: wrap;
   justify-content: center;
   margin: 24px 0;
+}
 
-  &:last-child {
-    justify-content: flex-start;
-  }
+.icons-list-results:last-child {
+  justify-content: flex-start;
 }
 
 .icons-list-searchbar {
@@ -171,15 +173,15 @@ html[data-theme='light'] .gallery-dark {
   border-radius: 3px;
   transition: background-color 0.3s;
   outline: 0;
+}
 
-  &:focus,
-  &:hover {
-    background-color: #e7e7e7;
-  }
+.icons-list-searchbar:focus,
+.icons-list-searchbar:hover {
+  background-color: #e7e7e7;
+}
 
-  *:focus-visible {
-    outline: auto;
-  }
+.icons-list-searchbar:focus-visible {
+  outline: auto;
 }
 
 @font-face {
diff --git a/src/index.tsx b/src/index.tsx
index b5ecadea41..71f105295e 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -137,4 +137,4 @@ export type { Props as SegmentedButtonsProps } from './components/SegmentedButto
 export type { Props as ListImageProps } from './components/List/ListImage';
 export type { Props as TooltipProps } from './components/Tooltip/Tooltip';
 
-export { TypescaleKey, type Theme, type Elevation } from './types';
+export { type TypescaleKey, type Theme, type Elevation } from './types';
diff --git a/src/theme/schemes/DynamicTheme.tsx b/src/theme/schemes/DynamicTheme.tsx
index d932f5a624..a9049b86bf 100644
--- a/src/theme/schemes/DynamicTheme.tsx
+++ b/src/theme/schemes/DynamicTheme.tsx
@@ -1,2 +1,4 @@
 export { DarkTheme as DynamicDarkTheme } from './DarkTheme';
 export { LightTheme as DynamicLightTheme } from './LightTheme';
+
+export const isDynamicColorSupported = false;