dumi 2.4.49-alpha.0 → 2.4.49-alpha.2

package/dist/loaders/markdown/index.js

@@ -95,6 +95,7 @@ function getRouteId(opts, fileAbsPath) {
 }
 function emitDefault(opts, ret) {
   const { frontmatter, demos } = ret.meta;
+  const sharedDemoProps = ret.meta.demoSharedProps ?? [];
   const isTabContent = (0, import_tabs.isTabRouteFile)(this.resourcePath);
   const wrapper = isTabContent ? "" : "DumiPage";
   const textMode = import_utoopackLoaders.UTOOPACK_LOADER_CTX_KEY in opts && process.env.NODE_ENV !== "production" ? "text-render" : "text";
@@ -131,6 +132,7 @@ import { DumiPage } from 'dumi';
 import { texts as ${import_rehypeText.CONTENT_TEXTS_OBJ_NAME} } from '${(0, import_plugin_utils.winPath)(
     this.resourcePath
   )}?type=${textMode}';
+${sharedDemoProps.length ? `const __dumi_demo_shared_props__ = ${JSON.stringify(sharedDemoProps)};` : ""}
 
 // export named function for fastRefresh
 // ref: https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/main/docs/TROUBLESHOOTING.md#edits-always-lead-to-full-reload

package/dist/loaders/markdown/transformer/index.d.ts

@@ -43,6 +43,7 @@ declare module 'vfile' {
         frontmatter: IRouteMeta['frontmatter'];
         toc: IRouteMeta['toc'];
         embeds: string[];
+        demoSharedProps?: unknown[];
     }
 }
 export interface IMdTransformerOptions {

package/dist/loaders/markdown/transformer/rehypeDemo.js

@@ -49,6 +49,8 @@ var DEMO_NODE_CONTAINER = "$demo-container";
 var DEMO_PROP_VALUE_KEY = "$demo-prop-value-key";
 var DEMO_LOADER_PLACEHOLDER = "__DUMI_DEMO_LOADER__";
 var DEMO_LOADER_PLACEHOLDER_VALUE = DEMO_LOADER_PLACEHOLDER;
+var DEMO_SHARED_PROP_PLACEHOLDER_PREFIX = "__DUMI_DEMO_SHARED_PROP_";
+var MIN_SHARED_PREVIEWER_PROP_SIZE = 1024;
 var DUMI_DEMO_TAG = "DumiDemo";
 var DUMI_DEMO_GRID_TAG = "DumiDemoGrid";
 var SKIP_DEMO_PARSE = "pure";
@@ -66,6 +68,55 @@ var alwaysDemoRE = new RegExp(
   ({ toString } = await import("hast-util-to-string"));
   ({ isElement } = await import("hast-util-is-element"));
 })();
+function getDemoPropsFromNode(node) {
+  var _a;
+  return [].concat(
+    (_a = node.data) == null ? void 0 : _a[DEMO_PROP_VALUE_KEY]
+  );
+}
+function hoistSharedPreviewerProps(nodes) {
+  const candidates = /* @__PURE__ */ new Map();
+  nodes.forEach((node) => {
+    getDemoPropsFromNode(node).forEach(({ previewerProps }) => {
+      Object.values(previewerProps).forEach((value) => {
+        if (!value || typeof value !== "object")
+          return;
+        const serialized = JSON.stringify(value);
+        if (serialized.length < MIN_SHARED_PREVIEWER_PROP_SIZE)
+          return;
+        const candidate = candidates.get(serialized);
+        if (candidate) {
+          candidate.count += 1;
+        } else {
+          candidates.set(serialized, { count: 1, value });
+        }
+      });
+    });
+  });
+  const sharedValues = [];
+  const sharedIndexes = /* @__PURE__ */ new Map();
+  candidates.forEach(({ count, value }, serialized) => {
+    if (count > 1) {
+      sharedIndexes.set(serialized, sharedValues.length);
+      sharedValues.push(value);
+    }
+  });
+  if (!sharedValues.length)
+    return sharedValues;
+  nodes.forEach((node) => {
+    getDemoPropsFromNode(node).forEach(({ previewerProps }) => {
+      Object.entries(previewerProps).forEach(([key, value]) => {
+        if (!value || typeof value !== "object")
+          return;
+        const index = sharedIndexes.get(JSON.stringify(value));
+        if (index !== void 0) {
+          previewerProps[key] = `${DEMO_SHARED_PROP_PLACEHOLDER_PREFIX}${index}__`;
+        }
+      });
+    });
+  });
+  return sharedValues;
+}
 function getCodeLang(node, opts) {
   var _a, _b, _c, _d;
   let lang = "";
@@ -380,6 +431,10 @@ function rehypeDemo(opts) {
     });
     await Promise.all(deferrers).then((demos) => {
       vFile.data.demos = demos;
+      const sharedPreviewerProps = opts.useUtoopackDemoHMR ? hoistSharedPreviewerProps(replaceNodes) : [];
+      if (sharedPreviewerProps.length) {
+        vFile.data.demoSharedProps = sharedPreviewerProps;
+      }
       replaceNodes.forEach((node) => {
         const demoLoader = `() => import('${(0, import_plugin_utils.winPath)(
           opts.fileAbsPath
@@ -390,6 +445,9 @@ function rehypeDemo(opts) {
             new RegExp(`"${DEMO_LOADER_PLACEHOLDER}"`, "g"),
             demoLoader
           );
+          sharedPreviewerProps.forEach((_, index2) => {
+            value = value.split(`"${DEMO_SHARED_PROP_PLACEHOLDER_PREFIX}${index2}__"`).join(`__dumi_demo_shared_props__[${index2}]`);
+          });
         }
         if (node.JSXAttributes[0].type === "JSXAttribute") {
           node.JSXAttributes[0].value = value;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dumi",
-  "version": "2.4.49-alpha.0",
+  "version": "2.4.49-alpha.2",
   "description": "📖 Documentation Generator of React Component",
   "keywords": [
     "generator",
@@ -69,9 +69,9 @@
     "@swc/core": "1.9.2",
     "@types/hast": "^2.3.5",
     "@types/mdast": "^3.0.12",
-    "@umijs/bundler-utils": "^4.7.3",
-    "@umijs/core": "^4.7.3",
-    "@umijs/utils": "^4.7.3",
+    "@umijs/bundler-utils": "^4.7.4",
+    "@umijs/core": "^4.7.4",
+    "@umijs/utils": "^4.7.4",
     "animated-scroll-to": "^2.3.0",
     "classnames": "2.3.2",
     "codesandbox-import-utils": "^2.2.3",
@@ -123,7 +123,7 @@
     "sass": "^1.64.1",
     "sitemap": "^7.1.1",
     "sucrase": "^3.34.0",
-    "umi": "^4.7.3",
+    "umi": "^4.7.4",
     "unified": "^10.1.2",
     "unist-util-visit": "^4.1.2",
     "unist-util-visit-parents": "^5.1.3",
@@ -147,8 +147,8 @@
     "@types/react-copy-to-clipboard": "^5.0.4",
     "@types/react-dom": "^18.2.7",
     "@typescript/native-preview": "7.0.0-dev.20260623.1",
-    "@umijs/lint": "^4.7.3",
-    "@umijs/plugins": "4.7.3",
+    "@umijs/lint": "^4.7.4",
+    "@umijs/plugins": "4.7.4",
     "eslint": "^8.46.0",
     "esno": "^4.7.0",
     "fast-glob": "^3.3.1",