chore: update storybook

.eslintrc.js

@@ -22,7 +22,11 @@ module.exports = {
     },
     ecmaVersion: 12,
     sourceType: 'module',
-    project: ['./packages/*/tsconfig.json', './apps/*/tsconfig.json'],
+    project: [
+      './packages/*/tsconfig.json',
+      './packages/*/*.tsconfig.json',
+      './apps/*/tsconfig.json',
+    ],
     tsconfigRootDir: __dirname,
   },
   rules: {

.github/workflows/previews.yml

@@ -19,7 +19,7 @@ env:
 jobs:
   build-for-android:
     name: Build for Android
-    runs-on: macos-13-large
+    runs-on: macos-14-large
     concurrency:
       group: preview-android-${{ github.ref }}
       cancel-in-progress: true
@@ -152,7 +152,7 @@ jobs:
 
   build-for-ios:
     name: Build for iOS
-    runs-on: macos-13-xlarge
+    runs-on: macos-14-xlarge
     concurrency:
       group: preview-ios-${{ github.ref }}
       cancel-in-progress: true
@@ -194,7 +194,7 @@ jobs:
         uses: maxim-lobanov/setup-xcode@v1
         if: steps.check_skip.outputs.skip == 'false'
         with:
-          xcode-version: '15.2.0'
+          xcode-version: '16.1.0'
 
       - name: 🔧 Setup EAS
         uses: expo/expo-github-action@v8

apps/native-ui-storybook/.ondevice/index.tsx → apps/native-ui-storybook/.storybook/index.tsx

@@ -1,5 +1,5 @@
-import AsyncStorage from "@react-native-async-storage/async-storage";
-import { view } from "./storybook.requires";
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { view } from './storybook.requires';
 
 const StorybookUIRoot = view.getStorybookUI({
   storage: {

apps/native-ui-storybook/.storybook/main.ts

@@ -1,98 +1,8 @@
-import { dirname, join } from 'path';
-/** @type{import("@storybook/react-webpack5").StorybookConfig} */
+/** @type{import("@storybook/react-native").StorybookConfig} */
 module.exports = {
   stories: [
-    '../docs/**/*.mdx',
-    '../components/**/*.mdx',
-    '../components/**/*.stories.@(js|jsx|ts|tsx)',
+    '../stories/**/*.stories.?(ts|tsx|js|jsx)',
+    '../../../packages/native-ui/**/*.stories.?(ts|tsx|js|jsx)',
   ],
-  addons: [
-    getAbsolutePath('@storybook/addon-links'),
-    getAbsolutePath('@storybook/addon-essentials'),
-    getAbsolutePath('@storybook/addon-react-native-web'),
-    getAbsolutePath('@storybook/addon-mdx-gfm'),
-    getAbsolutePath('storybook-dark-mode'),
-    getAbsolutePath('@a110/storybook-expand-all'),
-    getAbsolutePath('@storybook/addon-a11y'),
-    {
-      name: '@storybook/addon-react-native-web',
-      options: {
-        modulesToTranspile: [
-          'react-native-reanimated',
-          'react-native-unistyles',
-          '@utilitywarehouse/native-ui',
-        ],
-        babelPlugins: [
-          [
-            'react-native-unistyles/plugin',
-            {
-              autoProcessImports: ['@utilitywarehouse/native-ui'],
-            },
-          ],
-          '@babel/plugin-proposal-export-namespace-from',
-          'react-native-reanimated/plugin',
-        ],
-      },
-    },
-  ],
-  staticDirs: ['../assets'],
-  framework: {
-    name: getAbsolutePath('@storybook/react-webpack5'),
-    options: { builder: { useSWC: true } },
-  },
-  docs: {
-    autodocs: false,
-  },
-  refs: {
-    // Add any external Storybook refs if needed
-  },
-  typescript: {
-    reactDocgen: 'react-docgen',
-  },
-  webpackFinal: async config => {
-    config.resolve.alias = {
-      ...config.resolve.alias,
-      '@utilitywarehouse/react-native-icons': '@utilitywarehouse/react-icons',
-    };
-
-    // Remove the previous rule that excludes `node_modules` entirely
-    // and replace it with a rule that allows @gluestack-ui transpilation.
-    config.module.rules.push({
-      test: /\.(js|jsx)$/,
-      // Transpile files in node_modules only if they are from @gluestack-ui
-      exclude: /node_modules\/(?!(@gluestack-ui)\/)/,
-      use: {
-        loader: 'babel-loader',
-        options: {
-          presets: [
-            ['@babel/preset-env', { loose: true }], // Ensure loose: true is consistent
-            '@babel/preset-react',
-          ],
-          plugins: [
-            ['@babel/plugin-transform-private-property-in-object', { loose: true }],
-            ['@babel/plugin-transform-private-methods', { loose: true }],
-            ['@babel/plugin-proposal-class-properties', { loose: true }],
-          ],
-        },
-      },
-    });
-
-    // If you need TypeScript handling:
-    // config.module.rules.push({
-    //   test: /\.(ts|tsx)$/,
-    //   exclude: /node_modules/,
-    //   use: [
-    //     {
-    //       loader: require.resolve('ts-loader'),
-    //     },
-    //   ],
-    // });
-    // config.resolve.extensions.push('.ts', '.tsx');
-
-    return config;
-  },
+  addons: ['@storybook/addon-ondevice-controls', '@storybook/addon-ondevice-actions'],
 };
-
-function getAbsolutePath(value: string): any {
-  return dirname(require.resolve(join(value, 'package.json')));
-}