@storybook/react-dom-shim 9.2.0-alpha.3 → 10.0.0-beta.0

package/README.md

@@ -1,3 +1,5 @@
 # React Dom Shim
 
 A shim for `react-dom` that provides a single API that will work whether the user is on `react-dom@17` or `react-dom@18`, as well as webpack/vite config necessary to make that work.
+
+Learn more about Storybook at [storybook.js.org](https://storybook.js.org/?ref=readme).

package/dist/_browser-chunks/chunk-JK72E6FR.js

@@ -0,0 +1,6 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+export {
+  __name
+};

package/dist/preset.js

@@ -1 +1,221 @@
-"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var preset_exports={};__export(preset_exports,{viteFinal:()=>viteFinal,webpackFinal:()=>webpackFinal});module.exports=__toCommonJS(preset_exports);var import_promises=require("fs/promises"),import_node_path=require("path"),getIsReactVersion18or19=async options=>{let{legacyRootApi}=await options.presets.apply("frameworkOptions")||{};if(legacyRootApi)return!1;let reactDom=(await options.presets.apply("resolvedReact",{})).reactDom||(0,import_node_path.dirname)(require.resolve("react-dom/package.json"));if(!(0,import_node_path.isAbsolute)(reactDom))return!1;let{version}=JSON.parse(await(0,import_promises.readFile)((0,import_node_path.join)(reactDom,"package.json"),"utf-8"));return version.startsWith("18")||version.startsWith("19")||version.startsWith("0.0.0")},webpackFinal=async(config,options)=>await getIsReactVersion18or19(options)?config:{...config,resolve:{...config.resolve,alias:{...config.resolve?.alias,"@storybook/react-dom-shim":"@storybook/react-dom-shim/dist/react-16"}}},viteFinal=async(config,options)=>{if(await getIsReactVersion18or19(options))return config;let alias=Array.isArray(config.resolve?.alias)?config.resolve.alias.concat({find:/^@storybook\/react-dom-shim$/,replacement:"@storybook/react-dom-shim/dist/react-16"}):{...config.resolve?.alias,"@storybook/react-dom-shim":"@storybook/react-dom-shim/dist/react-16"};return{...config,resolve:{...config.resolve,alias}}};0&&(module.exports={viteFinal,webpackFinal});
+import CJS_COMPAT_NODE_URL_rwxqpo2vsur from 'node:url';
+import CJS_COMPAT_NODE_PATH_rwxqpo2vsur from 'node:path';
+import CJS_COMPAT_NODE_MODULE_rwxqpo2vsur from "node:module";
+
+var __filename = CJS_COMPAT_NODE_URL_rwxqpo2vsur.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_rwxqpo2vsur.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_rwxqpo2vsur.createRequire(import.meta.url);
+
+// ------------------------------------------------------------
+// end of CJS compatibility banner, injected by Storybook's esbuild configuration
+// ------------------------------------------------------------
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// src/preset.ts
+import { readFile } from "node:fs/promises";
+import { isAbsolute as isAbsolute2, join as join2 } from "node:path";
+
+// ../../core/src/shared/utils/module.ts
+import { fileURLToPath, pathToFileURL } from "node:url";
+
+// ../../node_modules/pathe/dist/shared/pathe.ff20891b.mjs
+var _DRIVE_LETTER_START_RE = /^[A-Za-z]:\//;
+function normalizeWindowsPath(input = "") {
+  if (!input) {
+    return input;
+  }
+  return input.replace(/\\/g, "/").replace(_DRIVE_LETTER_START_RE, (r) => r.toUpperCase());
+}
+__name(normalizeWindowsPath, "normalizeWindowsPath");
+var _UNC_REGEX = /^[/\\]{2}/;
+var _IS_ABSOLUTE_RE = /^[/\\](?![/\\])|^[/\\]{2}(?!\.)|^[A-Za-z]:[/\\]/;
+var _DRIVE_LETTER_RE = /^[A-Za-z]:$/;
+var normalize = /* @__PURE__ */ __name(function(path2) {
+  if (path2.length === 0) {
+    return ".";
+  }
+  path2 = normalizeWindowsPath(path2);
+  const isUNCPath = path2.match(_UNC_REGEX);
+  const isPathAbsolute = isAbsolute(path2);
+  const trailingSeparator = path2[path2.length - 1] === "/";
+  path2 = normalizeString(path2, !isPathAbsolute);
+  if (path2.length === 0) {
+    if (isPathAbsolute) {
+      return "/";
+    }
+    return trailingSeparator ? "./" : ".";
+  }
+  if (trailingSeparator) {
+    path2 += "/";
+  }
+  if (_DRIVE_LETTER_RE.test(path2)) {
+    path2 += "/";
+  }
+  if (isUNCPath) {
+    if (!isPathAbsolute) {
+      return `//./${path2}`;
+    }
+    return `//${path2}`;
+  }
+  return isPathAbsolute && !isAbsolute(path2) ? `/${path2}` : path2;
+}, "normalize");
+var join = /* @__PURE__ */ __name(function(...arguments_) {
+  if (arguments_.length === 0) {
+    return ".";
+  }
+  let joined;
+  for (const argument of arguments_) {
+    if (argument && argument.length > 0) {
+      if (joined === void 0) {
+        joined = argument;
+      } else {
+        joined += `/${argument}`;
+      }
+    }
+  }
+  if (joined === void 0) {
+    return ".";
+  }
+  return normalize(joined.replace(/\/\/+/g, "/"));
+}, "join");
+function normalizeString(path2, allowAboveRoot) {
+  let res = "";
+  let lastSegmentLength = 0;
+  let lastSlash = -1;
+  let dots = 0;
+  let char = null;
+  for (let index = 0; index <= path2.length; ++index) {
+    if (index < path2.length) {
+      char = path2[index];
+    } else if (char === "/") {
+      break;
+    } else {
+      char = "/";
+    }
+    if (char === "/") {
+      if (lastSlash === index - 1 || dots === 1) ;
+      else if (dots === 2) {
+        if (res.length < 2 || lastSegmentLength !== 2 || res[res.length - 1] !== "." || res[res.length - 2] !== ".") {
+          if (res.length > 2) {
+            const lastSlashIndex = res.lastIndexOf("/");
+            if (lastSlashIndex === -1) {
+              res = "";
+              lastSegmentLength = 0;
+            } else {
+              res = res.slice(0, lastSlashIndex);
+              lastSegmentLength = res.length - 1 - res.lastIndexOf("/");
+            }
+            lastSlash = index;
+            dots = 0;
+            continue;
+          } else if (res.length > 0) {
+            res = "";
+            lastSegmentLength = 0;
+            lastSlash = index;
+            dots = 0;
+            continue;
+          }
+        }
+        if (allowAboveRoot) {
+          res += res.length > 0 ? "/.." : "..";
+          lastSegmentLength = 2;
+        }
+      } else {
+        if (res.length > 0) {
+          res += `/${path2.slice(lastSlash + 1, index)}`;
+        } else {
+          res = path2.slice(lastSlash + 1, index);
+        }
+        lastSegmentLength = index - lastSlash - 1;
+      }
+      lastSlash = index;
+      dots = 0;
+    } else if (char === "." && dots !== -1) {
+      ++dots;
+    } else {
+      dots = -1;
+    }
+  }
+  return res;
+}
+__name(normalizeString, "normalizeString");
+var isAbsolute = /* @__PURE__ */ __name(function(p) {
+  return _IS_ABSOLUTE_RE.test(p);
+}, "isAbsolute");
+var dirname = /* @__PURE__ */ __name(function(p) {
+  const segments = normalizeWindowsPath(p).replace(/\/$/, "").split("/").slice(0, -1);
+  if (segments.length === 1 && _DRIVE_LETTER_RE.test(segments[0])) {
+    segments[0] += "/";
+  }
+  return segments.join("/") || (isAbsolute(p) ? "/" : ".");
+}, "dirname");
+
+// ../../core/src/shared/utils/module.ts
+var importMetaResolve = /* @__PURE__ */ __name((...args) => {
+  if (typeof import.meta.resolve !== "function" && process.env.VITEST === "true") {
+    console.warn(
+      "importMetaResolve from within Storybook is being used in a Vitest test, but it shouldn't be. Please report this at https://github.com/storybookjs/storybook/issues/new?template=bug_report.yml"
+    );
+    return pathToFileURL(args[0]).href;
+  }
+  return import.meta.resolve(...args);
+}, "importMetaResolve");
+var resolvePackageDir = /* @__PURE__ */ __name((pkg, parent) => {
+  return dirname(fileURLToPath(importMetaResolve(join(pkg, "package.json"), parent)));
+}, "resolvePackageDir");
+
+// src/preset.ts
+var getIsReactVersion18or19 = /* @__PURE__ */ __name(async (options) => {
+  const { legacyRootApi } = await options.presets.apply("frameworkOptions") || {};
+  if (legacyRootApi) {
+    return false;
+  }
+  const resolvedReact = await options.presets.apply("resolvedReact", {});
+  const reactDom = resolvedReact.reactDom || resolvePackageDir("react-dom");
+  if (!isAbsolute2(reactDom)) {
+    return false;
+  }
+  const { version } = JSON.parse(await readFile(join2(reactDom, "package.json"), "utf-8"));
+  return version.startsWith("18") || version.startsWith("19") || version.startsWith("0.0.0");
+}, "getIsReactVersion18or19");
+var webpackFinal = /* @__PURE__ */ __name(async (config, options) => {
+  const isReactVersion18 = await getIsReactVersion18or19(options);
+  if (isReactVersion18) {
+    return config;
+  }
+  return {
+    ...config,
+    resolve: {
+      ...config.resolve,
+      alias: {
+        ...config.resolve?.alias,
+        "@storybook/react-dom-shim": "@storybook/react-dom-shim/react-16"
+      }
+    }
+  };
+}, "webpackFinal");
+var viteFinal = /* @__PURE__ */ __name(async (config, options) => {
+  const isReactVersion18 = await getIsReactVersion18or19(options);
+  if (isReactVersion18) {
+    return config;
+  }
+  const alias = Array.isArray(config.resolve?.alias) ? config.resolve.alias.concat({
+    find: /^@storybook\/react-dom-shim$/,
+    replacement: "@storybook/react-dom-shim/react-16"
+  }) : {
+    ...config.resolve?.alias,
+    "@storybook/react-dom-shim": "@storybook/react-dom-shim/react-16"
+  };
+  return {
+    ...config,
+    resolve: {
+      ...config.resolve,
+      alias
+    }
+  };
+}, "viteFinal");
+export {
+  viteFinal,
+  webpackFinal
+};

package/dist/react-16.js

@@ -1 +1,18 @@
-"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var react_16_exports={};__export(react_16_exports,{renderElement:()=>renderElement,unmountElement:()=>unmountElement});module.exports=__toCommonJS(react_16_exports);var ReactDOM=__toESM(require("react-dom")),renderElement=async(node,el)=>new Promise(resolve=>{ReactDOM.render(node,el,()=>resolve(null))}),unmountElement=el=>{ReactDOM.unmountComponentAtNode(el)};0&&(module.exports={renderElement,unmountElement});
+import {
+  __name
+} from "./_browser-chunks/chunk-JK72E6FR.js";
+
+// src/react-16.tsx
+import * as ReactDOM from "react-dom";
+var renderElement = /* @__PURE__ */ __name(async (node, el) => {
+  return new Promise((resolve) => {
+    ReactDOM.render(node, el, () => resolve(null));
+  });
+}, "renderElement");
+var unmountElement = /* @__PURE__ */ __name((el) => {
+  ReactDOM.unmountComponentAtNode(el);
+}, "unmountElement");
+export {
+  renderElement,
+  unmountElement
+};

package/dist/react-18.d.ts

@@ -1,7 +1,3 @@
-import { ReactElement } from 'react';
-import { RootOptions } from 'react-dom/client';
-
-declare const renderElement: (node: ReactElement, el: Element, rootOptions?: RootOptions) => Promise<void>;
-declare const unmountElement: (el: Element, shouldUseNewRootApi?: boolean) => void;
-
-export { renderElement, unmountElement };
+// auto generated file from file:///home/runner/work/storybook/storybook/scripts/build/utils/generate-type-mappers.ts, do not edit
+export * from '../src/react-18.tsx';
+export type * from '../src/react-18.tsx';

package/dist/react-18.d.tsx

@@ -0,0 +1,7 @@
+import { ReactElement } from 'react';
+import { RootOptions } from 'react-dom/client';
+
+declare const renderElement: (node: ReactElement, el: Element, rootOptions?: RootOptions) => Promise<void>;
+declare const unmountElement: (el: Element, shouldUseNewRootApi?: boolean) => void;
+
+export { renderElement, unmountElement };

package/dist/react-18.js

@@ -1 +1,66 @@
-"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var react_18_exports={};__export(react_18_exports,{renderElement:()=>renderElement,unmountElement:()=>unmountElement});module.exports=__toCommonJS(react_18_exports);var React=__toESM(require("react")),ReactDOM=__toESM(require("react-dom/client")),nodes=new Map;function getIsReactActEnvironment(){return globalThis.IS_REACT_ACT_ENVIRONMENT}var WithCallback=({callback,children})=>{let once=React.useRef();return React.useLayoutEffect(()=>{once.current!==callback&&(once.current=callback,callback())},[callback]),children};typeof Promise.withResolvers>"u"&&(Promise.withResolvers=()=>{let resolve=null,reject=null;return{promise:new Promise((res,rej)=>{resolve=res,reject=rej}),resolve,reject}});var renderElement=async(node,el,rootOptions)=>{let root=await getReactRoot(el,rootOptions);if(getIsReactActEnvironment()){root.render(node);return}let{promise,resolve}=Promise.withResolvers();return root.render(React.createElement(WithCallback,{callback:resolve},node)),promise},unmountElement=(el,shouldUseNewRootApi)=>{let root=nodes.get(el);root&&(root.unmount(),nodes.delete(el))},getReactRoot=async(el,rootOptions)=>{let root=nodes.get(el);return root||(root=ReactDOM.createRoot(el,rootOptions),nodes.set(el,root)),root};0&&(module.exports={renderElement,unmountElement});
+import {
+  __name
+} from "./_browser-chunks/chunk-JK72E6FR.js";
+
+// src/react-18.tsx
+import * as React from "react";
+import * as ReactDOM from "react-dom/client";
+var nodes = /* @__PURE__ */ new Map();
+function getIsReactActEnvironment() {
+  return globalThis.IS_REACT_ACT_ENVIRONMENT;
+}
+__name(getIsReactActEnvironment, "getIsReactActEnvironment");
+var WithCallback = /* @__PURE__ */ __name(({
+  callback,
+  children
+}) => {
+  const once = React.useRef();
+  React.useLayoutEffect(() => {
+    if (once.current === callback) {
+      return;
+    }
+    once.current = callback;
+    callback();
+  }, [callback]);
+  return children;
+}, "WithCallback");
+if (typeof Promise.withResolvers === "undefined") {
+  Promise.withResolvers = () => {
+    let resolve = null;
+    let reject = null;
+    const promise = new Promise((res, rej) => {
+      resolve = res;
+      reject = rej;
+    });
+    return { promise, resolve, reject };
+  };
+}
+var renderElement = /* @__PURE__ */ __name(async (node, el, rootOptions) => {
+  const root = await getReactRoot(el, rootOptions);
+  if (getIsReactActEnvironment()) {
+    root.render(node);
+    return;
+  }
+  const { promise, resolve } = Promise.withResolvers();
+  root.render(React.createElement(WithCallback, { callback: resolve }, node));
+  return promise;
+}, "renderElement");
+var unmountElement = /* @__PURE__ */ __name((el, shouldUseNewRootApi) => {
+  const root = nodes.get(el);
+  if (root) {
+    root.unmount();
+    nodes.delete(el);
+  }
+}, "unmountElement");
+var getReactRoot = /* @__PURE__ */ __name(async (el, rootOptions) => {
+  let root = nodes.get(el);
+  if (!root) {
+    root = ReactDOM.createRoot(el, rootOptions);
+    nodes.set(el, root);
+  }
+  return root;
+}, "getReactRoot");
+export {
+  renderElement,
+  unmountElement
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-dom-shim",
-  "version": "9.2.0-alpha.3",
+  "version": "10.0.0-beta.0",
   "description": "",
   "keywords": [
     "storybook"
@@ -20,28 +20,16 @@
   },
   "license": "MIT",
   "sideEffects": false,
+  "type": "module",
   "exports": {
     ".": {
       "types": "./dist/react-18.d.ts",
-      "import": "./dist/react-18.mjs",
-      "require": "./dist/react-18.js",
-      "node": "./dist/react-18.js"
+      "default": "./dist/react-18.js"
     },
-    "./dist/react-16": {
-      "types": "./dist/react-16.d.ts",
-      "import": "./dist/react-16.mjs",
-      "require": "./dist/react-16.js",
-      "node": "./dist/react-16.js"
-    },
-    "./dist/preset": {
-      "types": "./dist/preset.d.ts",
-      "require": "./dist/preset.js"
-    },
-    "./package.json": "./package.json"
+    "./package.json": "./package.json",
+    "./preset": "./dist/preset.js",
+    "./react-16": "./dist/react-16.js"
   },
-  "main": "dist/react-18.js",
-  "module": "dist/react-18.mjs",
-  "types": "dist/react-18.d.ts",
   "files": [
     "dist/**/*",
     "README.md",
@@ -50,26 +38,19 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "jiti ../../../scripts/prepare/check.ts",
-    "prep": "jiti ../../../scripts/prepare/bundle.ts"
+    "check": "jiti ../../../scripts/check/check-package.ts",
+    "prep": "jiti ../../../scripts/build/build-package.ts"
   },
   "devDependencies": {
     "typescript": "^5.8.3"
   },
   "peerDependencies": {
-    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-    "storybook": "^9.2.0-alpha.3"
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "storybook": "^10.0.0-beta.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "bundler": {
-    "entries": [
-      "./src/preset.ts",
-      "./src/react-16.tsx",
-      "./src/react-18.tsx"
-    ]
-  },
-  "gitHead": "ce6a1e4a8d5ad69c699021a0b183df89cfc7b684"
+  "gitHead": "a8e7fd8a655c69780bc20b9749d2699e45beae16"
 }

package/dist/preset.d.ts

@@ -1,6 +0,0 @@
-import { Options } from 'storybook/internal/types';
-
-declare const webpackFinal: (config: any, options: Options) => Promise<any>;
-declare const viteFinal: (config: any, options: Options) => Promise<any>;
-
-export { viteFinal, webpackFinal };

package/dist/react-16.d.ts

@@ -1,6 +0,0 @@
-import { ReactElement } from 'react';
-
-declare const renderElement: (node: ReactElement, el: Element) => Promise<null>;
-declare const unmountElement: (el: Element) => void;
-
-export { renderElement, unmountElement };

package/dist/react-16.mjs

@@ -1,5 +0,0 @@
-import * as ReactDOM from 'react-dom';
-
-var renderElement=async(node,el)=>new Promise(resolve=>{ReactDOM.render(node,el,()=>resolve(null));}),unmountElement=el=>{ReactDOM.unmountComponentAtNode(el);};
-
-export { renderElement, unmountElement };

package/dist/react-18.mjs

@@ -1,6 +0,0 @@
-import * as React from 'react';
-import * as ReactDOM from 'react-dom/client';
-
-var nodes=new Map;function getIsReactActEnvironment(){return globalThis.IS_REACT_ACT_ENVIRONMENT}var WithCallback=({callback,children})=>{let once=React.useRef();return React.useLayoutEffect(()=>{once.current!==callback&&(once.current=callback,callback());},[callback]),children};typeof Promise.withResolvers>"u"&&(Promise.withResolvers=()=>{let resolve=null,reject=null;return {promise:new Promise((res,rej)=>{resolve=res,reject=rej;}),resolve,reject}});var renderElement=async(node,el,rootOptions)=>{let root=await getReactRoot(el,rootOptions);if(getIsReactActEnvironment()){root.render(node);return}let{promise,resolve}=Promise.withResolvers();return root.render(React.createElement(WithCallback,{callback:resolve},node)),promise},unmountElement=(el,shouldUseNewRootApi)=>{let root=nodes.get(el);root&&(root.unmount(),nodes.delete(el));},getReactRoot=async(el,rootOptions)=>{let root=nodes.get(el);return root||(root=ReactDOM.createRoot(el,rootOptions),nodes.set(el,root)),root};
-
-export { renderElement, unmountElement };