@storybook/react-native-web-vite 0.0.0

package/README.md

@@ -0,0 +1 @@
+# @storybook/react-native-web-vite

package/dist/index.cjs

@@ -0,0 +1,4 @@
+'use strict';
+
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs"}

package/dist/index.d.cts

@@ -0,0 +1,52 @@
+import { StorybookConfig as StorybookConfig$1, TypescriptOptions as TypescriptOptions$1, CompatibleString } from 'storybook/internal/types';
+import { Options, BabelOptions } from '@vitejs/plugin-react';
+import { BuilderOptions, StorybookConfigVite } from '@storybook/builder-vite';
+import docgenTypescript from '@joshwooding/vite-plugin-react-docgen-typescript';
+
+type FrameworkName = CompatibleString<"@storybook/react-native-web-vite">;
+type BuilderName = CompatibleString<"@storybook/builder-vite">;
+type FrameworkOptions = {
+    builder?: BuilderOptions;
+    strictMode?: boolean;
+    /**
+     * Use React's legacy root API to mount components
+     *
+     * React has introduced a new root API with React 18.x to enable a whole set of new features (e.g.
+     * concurrent features) If this flag is true, the legacy Root API is used to mount components to
+     * make it easier to migrate step by step to React 18.
+     *
+     * @default false
+     */
+    legacyRootApi?: boolean;
+    pluginReactOptions?: Omit<Options, "babel"> & {
+        babel?: BabelOptions;
+    };
+};
+type StorybookConfigFramework = {
+    framework: FrameworkName | {
+        name: FrameworkName;
+        options: FrameworkOptions;
+    };
+    core?: StorybookConfig$1["core"] & {
+        builder?: BuilderName | {
+            name: BuilderName;
+            options: BuilderOptions;
+        };
+    };
+};
+type TypescriptOptions = TypescriptOptions$1 & {
+    /**
+     * Sets the type of Docgen when working with React and TypeScript
+     *
+     * @default `'react-docgen'`
+     */
+    reactDocgen: "react-docgen-typescript" | "react-docgen" | false;
+    /** Configures `@joshwooding/vite-plugin-react-docgen-typescript` */
+    reactDocgenTypescriptOptions: Parameters<typeof docgenTypescript>[0];
+};
+/** The interface for Storybook configuration in `main.ts` files. */
+type StorybookConfig = Omit<StorybookConfig$1, keyof StorybookConfigVite | keyof StorybookConfigFramework | "typescript"> & StorybookConfigVite & StorybookConfigFramework & {
+    typescript?: Partial<TypescriptOptions>;
+};
+
+export type { FrameworkOptions, StorybookConfig };

package/dist/index.d.ts

@@ -0,0 +1,52 @@
+import { StorybookConfig as StorybookConfig$1, TypescriptOptions as TypescriptOptions$1, CompatibleString } from 'storybook/internal/types';
+import { Options, BabelOptions } from '@vitejs/plugin-react';
+import { BuilderOptions, StorybookConfigVite } from '@storybook/builder-vite';
+import docgenTypescript from '@joshwooding/vite-plugin-react-docgen-typescript';
+
+type FrameworkName = CompatibleString<"@storybook/react-native-web-vite">;
+type BuilderName = CompatibleString<"@storybook/builder-vite">;
+type FrameworkOptions = {
+    builder?: BuilderOptions;
+    strictMode?: boolean;
+    /**
+     * Use React's legacy root API to mount components
+     *
+     * React has introduced a new root API with React 18.x to enable a whole set of new features (e.g.
+     * concurrent features) If this flag is true, the legacy Root API is used to mount components to
+     * make it easier to migrate step by step to React 18.
+     *
+     * @default false
+     */
+    legacyRootApi?: boolean;
+    pluginReactOptions?: Omit<Options, "babel"> & {
+        babel?: BabelOptions;
+    };
+};
+type StorybookConfigFramework = {
+    framework: FrameworkName | {
+        name: FrameworkName;
+        options: FrameworkOptions;
+    };
+    core?: StorybookConfig$1["core"] & {
+        builder?: BuilderName | {
+            name: BuilderName;
+            options: BuilderOptions;
+        };
+    };
+};
+type TypescriptOptions = TypescriptOptions$1 & {
+    /**
+     * Sets the type of Docgen when working with React and TypeScript
+     *
+     * @default `'react-docgen'`
+     */
+    reactDocgen: "react-docgen-typescript" | "react-docgen" | false;
+    /** Configures `@joshwooding/vite-plugin-react-docgen-typescript` */
+    reactDocgenTypescriptOptions: Parameters<typeof docgenTypescript>[0];
+};
+/** The interface for Storybook configuration in `main.ts` files. */
+type StorybookConfig = Omit<StorybookConfig$1, keyof StorybookConfigVite | keyof StorybookConfigFramework | "typescript"> & StorybookConfigVite & StorybookConfigFramework & {
+    typescript?: Partial<TypescriptOptions>;
+};
+
+export type { FrameworkOptions, StorybookConfig };

package/dist/index.js

@@ -0,0 +1,3 @@
+
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/preset.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+var builderVite = require('@storybook/builder-vite');
+var n = require('@vitejs/plugin-react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var n__default = /*#__PURE__*/_interopDefault(n);
+
+function r(t){return {name:"vite:react-native-web",enforce:"pre",config(o,e){return {plugins:[n__default.default(t)],define:{"global.__x":{},_frameTimestamp:void 0,_WORKLET:!1,__DEV__:`${e.mode==="development"}`,"process.env.NODE_ENV":JSON.stringify(process.env.NODE_ENV||e.mode)},optimizeDeps:{include:[],esbuildOptions:{jsx:"transform",resolveExtensions:[".web.js",".web.ts",".web.tsx",".js",".jsx",".json",".ts",".tsx",".mjs"],loader:{".js":"jsx"}}},resolve:{extensions:[".web.js",".web.ts",".web.tsx",".js",".jsx",".json",".ts",".tsx",".mjs"],alias:{"react-native":"react-native-web"}}}}}}var m=async(t,s)=>{let{pluginReactOptions:o={}}=await s.presets.apply("frameworkOptions"),{plugins:e=[]}=t;return await builderVite.hasVitePlugins(e,["vite:react-native-web"])||e.push(r(o)),t},c={builder:"@storybook/builder-vite",renderer:"@storybook/react"};
+
+exports.core = c;
+exports.viteFinal = m;
+//# sourceMappingURL=preset.cjs.map
+//# sourceMappingURL=preset.cjs.map

package/dist/preset.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/preset.ts"],"names":["reactNativeWeb","reactOptions","_userConfig","env","react","viteFinal","config","options","pluginReactOptions","plugins","hasVitePlugins","core"],"mappings":";;;;;;;;;AAQA,SAASA,CACPC,CAAAA,CAAAA,CACQ,CA2DR,OA1DuB,CACrB,IAAM,CAAA,uBAAA,CACN,QAAS,KACT,CAAA,MAAA,CAAOC,CAAaC,CAAAA,CAAAA,CAAK,CACvB,OAAO,CACL,OAAS,CAAA,CAACC,mBAAMH,CAAY,CAAC,CAC7B,CAAA,MAAA,CAAQ,CAEN,YAAc,CAAA,EACd,CAAA,eAAA,CAAiB,OACjB,QAAU,CAAA,CAAA,CAAA,CACV,OAAS,CAAA,CAAA,EAAGE,CAAI,CAAA,IAAA,GAAS,aAAa,CAAA,CAAA,CACtC,uBAAwB,IAAK,CAAA,SAAA,CAC3B,OAAQ,CAAA,GAAA,CAAI,UAAYA,CAAI,CAAA,IAC9B,CACF,CAAA,CACA,aAAc,CACZ,OAAA,CAAS,EAET,CACA,eAAgB,CACd,GAAA,CAAK,WACL,CAAA,iBAAA,CAAmB,CACjB,SACA,CAAA,SAAA,CACA,UACA,CAAA,KAAA,CACA,OACA,OACA,CAAA,KAAA,CACA,MACA,CAAA,MACF,EACA,MAAQ,CAAA,CACN,KAAO,CAAA,KACT,CACF,CACF,CACA,CAAA,OAAA,CAAS,CACP,UAAY,CAAA,CACV,SACA,CAAA,SAAA,CACA,WACA,KACA,CAAA,MAAA,CACA,OACA,CAAA,KAAA,CACA,OACA,MACF,CAAA,CACA,KAAO,CAAA,CACL,eAAgB,kBAClB,CACF,CACF,CACF,CACF,CAGF,CAEaE,IAAAA,CAAAA,CAA0C,MACrDC,CACAC,CAAAA,CAAAA,GACG,CACH,GAAM,CAAE,kBAAAC,CAAAA,CAAAA,CAAqB,EAAG,CAC9B,CAAA,MAAMD,CAAQ,CAAA,OAAA,CAAQ,MAAwB,kBAAkB,CAAA,CAE5D,CAAE,OAAA,CAAAE,EAAU,EAAG,CAAIH,CAAAA,CAAAA,CAEzB,OAAM,MAAMI,0BAAAA,CAAeD,CAAS,CAAA,CAAC,uBAAuB,CAAC,CAAA,EAC3DA,CAAQ,CAAA,IAAA,CAAKT,EAAeQ,CAAkB,CAAC,CAG1CF,CAAAA,CACT,EAEaK,CAAO,CAAA,CAClB,OAAS,CAAA,yBAAA,CACT,SAAU,kBACZ","file":"preset.cjs","sourcesContent":["import { hasVitePlugins } from \"@storybook/builder-vite\";\nimport react, {\n  BabelOptions,\n  Options as ReactOptions,\n} from \"@vitejs/plugin-react\";\nimport { Plugin } from \"vite\";\nimport { FrameworkOptions, StorybookConfig } from \"./types\";\n\nfunction reactNativeWeb(\n  reactOptions: Omit<ReactOptions, \"babel\"> & { babel?: BabelOptions },\n): Plugin {\n  const plugin: Plugin = {\n    name: \"vite:react-native-web\",\n    enforce: \"pre\",\n    config(_userConfig, env) {\n      return {\n        plugins: [react(reactOptions)],\n        define: {\n          // reanimated support\n          \"global.__x\": {},\n          _frameTimestamp: undefined,\n          _WORKLET: false,\n          __DEV__: `${env.mode === \"development\"}`,\n          \"process.env.NODE_ENV\": JSON.stringify(\n            process.env.NODE_ENV || env.mode,\n          ),\n        },\n        optimizeDeps: {\n          include: [\n            /* 'react-native-reanimated',  */\n          ],\n          esbuildOptions: {\n            jsx: \"transform\",\n            resolveExtensions: [\n              \".web.js\",\n              \".web.ts\",\n              \".web.tsx\",\n              \".js\",\n              \".jsx\",\n              \".json\",\n              \".ts\",\n              \".tsx\",\n              \".mjs\",\n            ],\n            loader: {\n              \".js\": \"jsx\",\n            },\n          },\n        },\n        resolve: {\n          extensions: [\n            \".web.js\",\n            \".web.ts\",\n            \".web.tsx\",\n            \".js\",\n            \".jsx\",\n            \".json\",\n            \".ts\",\n            \".tsx\",\n            \".mjs\",\n          ],\n          alias: {\n            \"react-native\": \"react-native-web\",\n          },\n        },\n      };\n    },\n  };\n\n  return plugin;\n}\n\nexport const viteFinal: StorybookConfig[\"viteFinal\"] = async (\n  config,\n  options,\n) => {\n  const { pluginReactOptions = {} } =\n    await options.presets.apply<FrameworkOptions>(\"frameworkOptions\");\n\n  const { plugins = [] } = config;\n\n  if (!(await hasVitePlugins(plugins, [\"vite:react-native-web\"]))) {\n    plugins.push(reactNativeWeb(pluginReactOptions));\n  }\n\n  return config;\n};\n\nexport const core = {\n  builder: \"@storybook/builder-vite\",\n  renderer: \"@storybook/react\",\n};\n"]}

package/package.json

@@ -0,0 +1,90 @@
+{
+  "name": "@storybook/react-native-web-vite",
+  "version": "0.0.0",
+  "description": "Sets up react native web with vite",
+  "keywords": [
+    "react-native-web",
+    "storybook-frameworks"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/storybookjs/react-native-web-vite"
+  },
+  "type": "module",
+  "license": "MIT",
+  "author": "Daniel Williams <dannyhyunsoowilliams@gmail.com>",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./preset": "./dist/preset.cjs",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist/**/*",
+    "README.md",
+    "*.js",
+    "*.d.ts"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "build:watch": "npm run build -- --watch",
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "start": "run-p build:watch \"storybook --quiet\"",
+    "prerelease": "zx scripts/prepublish-checks.js",
+    "release": "npm run build && auto shipit",
+    "eject-ts": "zx scripts/eject-typescript.js",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "dependencies": {
+    "@storybook/react": "^8.3.5",
+    "@storybook/builder-vite": "^8.3.5",
+    "@vitejs/plugin-react": "^4.3.2"
+  },
+  "devDependencies": {
+    "@storybook/addon-essentials": "^8.3.5",
+    "@storybook/addon-interactions": "^8.3.5",
+    "@storybook/addon-links": "^8.3.5",
+    "@storybook/blocks": "^8.3.5",
+    "@storybook/react-vite": "^8.3.5",
+    "@storybook/test": "^8.3.5",
+    "@types/node": "^18.15.0",
+    "@types/react": "^18.2.65",
+    "@types/react-dom": "^18.2.21",
+    "@vitejs/plugin-react": "^4.2.1",
+    "auto": "^11.1.1",
+    "boxen": "^7.1.1",
+    "dedent": "^1.5.1",
+    "prettier": "^3.3.3",
+    "prompts": "^2.4.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "storybook": "^8.3.5",
+    "tsup": "^8.2.4",
+    "typescript": "^5.5.4",
+    "vite": "^5.3.5",
+    "zx": "^7.2.3",
+    "react-native": "^0.75.4",
+    "react-native-web": "^0.19.12"
+  },
+  "peerDependencies": {
+    "storybook": ">8",
+    "react-native": "^0.75.4",
+    "react-native-web": "^0.19.12",
+    "vite": "^4.0.0 || ^5.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "bundler": {
+    "exportEntries": [
+      "src/index.ts"
+    ],
+    "nodeEntries": [
+      "src/preset.ts"
+    ]
+  }
+}

package/preset.js

@@ -0,0 +1,4 @@
+// this file is slightly misleading. It needs to be CJS, and thus in this "type": "module" package it should be named preset.cjs
+// but Storybook won't pick that filename up so we have to name it preset.js instead
+
+module.exports = require('./dist/preset.cjs');