dumi 2.0.0-beta.6 → 2.0.0-beta.8

package/dist/features/exports.d.ts

@@ -1,3 +1,8 @@
 import type { IApi } from "../types";
+/**
+ * exclude pre-compiling modules in mfsu mode
+ * and make sure there has no multiple instances problem (such as react)
+ */
+export declare function safeExcludeInMFSU(api: IApi, excludes: RegExp[]): void;
 declare const _default: (api: IApi) => void;
 export default _default;

package/dist/features/exports.js

@@ -22,12 +22,31 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/features/exports.ts
 var exports_exports = {};
 __export(exports_exports, {
-  default: () => exports_default
+  default: () => exports_default,
+  safeExcludeInMFSU: () => safeExcludeInMFSU
 });
 module.exports = __toCommonJS(exports_exports);
 var import_plugin_utils = require("umi/plugin-utils");
+function safeExcludeInMFSU(api, excludes) {
+  if (api.userConfig.mfsu !== false) {
+    api.modifyDefaultConfig((memo) => {
+      memo.mfsu ?? (memo.mfsu = {});
+      memo.mfsu.exclude = (0, import_plugin_utils.deepmerge)(memo.mfsu.exclude || [], excludes);
+      memo.extraBabelIncludes ?? (memo.extraBabelIncludes = []);
+      memo.extraBabelIncludes.push(...excludes);
+      return memo;
+    });
+  }
+}
 var exports_default = (api) => {
   api.describe({ key: void 0 });
+  safeExcludeInMFSU(api, [new RegExp("dumi/dist/client")]);
+  api.modifyDefaultConfig((memo) => {
+    if (api.userConfig.mfsu !== false) {
+      memo.mfsu = { strategy: "normal" };
+    }
+    return memo;
+  });
   api.modifyConfig((memo) => {
     memo.alias["dumi$"] = "@@/dumi/exports";
     return memo;
@@ -42,4 +61,6 @@ export * from '${(0, import_plugin_utils.winPath)(require.resolve("../client/the
   });
 };
 // Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});
+0 && (module.exports = {
+  safeExcludeInMFSU
+});

package/dist/features/meta.js

@@ -1,6 +1,8 @@
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -14,6 +16,7 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/features/meta.ts
@@ -24,24 +27,29 @@ __export(meta_exports, {
   default: () => meta_default
 });
 module.exports = __toCommonJS(meta_exports);
+var import_path = __toESM(require("path"));
 var import_plugin_utils = require("umi/plugin-utils");
 var import_tabs = require("./tabs");
 var TABS_META_PATH = "dumi/meta/tabs.ts";
 var ATOMS_META_PATH = "dumi/meta/atoms.ts";
 var meta_default = (api) => {
   const metaFiles = [];
-  api.modifyRoutes((routes) => {
-    metaFiles.length = 0;
-    Object.values(routes).forEach((route) => {
-      if (!route.isLayout && !/\*|:/.test(route.path) && !(0, import_tabs.isTabRouteFile)(route.file)) {
-        metaFiles.push({
-          index: metaFiles.length,
-          file: route.file,
-          id: route.id
-        });
-      }
-    });
-    return routes;
+  api.register({
+    key: "modifyRoutes",
+    stage: Infinity,
+    fn: (routes) => {
+      metaFiles.length = 0;
+      Object.values(routes).forEach((route) => {
+        if (!route.isLayout && !/\*|:/.test(route.path) && !(0, import_tabs.isTabRouteFile)(route.file)) {
+          metaFiles.push({
+            index: metaFiles.length,
+            file: route.file,
+            id: route.id
+          });
+        }
+      });
+      return routes;
+    }
   });
   api.onGenerateFiles(async () => {
     api.writeTmpFile({
@@ -53,29 +61,41 @@ var meta_default = (api) => {
       noPluginDir: true,
       path: "dumi/meta/index.ts",
       content: import_plugin_utils.Mustache.render(`{{#metaFiles}}
-import { demos as d{{{index}}}, frontmatter as fm{{{index}}}, toc as toc{{{index}}} } from '{{{file}}}?type=meta';
+import { demos as dm{{{index}}}, frontmatter as fm{{{index}}}, toc as toc{{{index}}}, texts as txt{{{index}}} } from '{{{file}}}?type=meta';
 {{/metaFiles}}
 
 export { components } from './atoms';
 export { tabs } from './tabs';
 
-export const demos = {
-  {{#metaFiles}}
-  ...d{{{index}}},
-  {{/metaFiles}}
-};
-
 export const filesMeta = {
   {{#metaFiles}}
   '{{{id}}}': {
     frontmatter: fm{{{index}}},
     toc: toc{{{index}}},
+    texts: txt{{{index}}},
+    demos: dm{{{index}}},
     {{#tabs}}
     tabs: {{{tabs}}},
     {{/tabs}}
   },
   {{/metaFiles}}
-}`, {
+}
+
+// generate demos data in runtime, for reuse route.id to reduce bundle size
+export const demos = Object.entries(filesMeta).reduce((acc, [id, meta]) => {
+  // append route id to demo
+  Object.values(meta.demos).forEach((demo) => {
+    demo.routeId = id;
+  });
+  // merge demos
+  Object.assign(acc, meta.demos);
+
+  // remove demos from meta, to avoid deep clone demos in umi routes/children compatible logic
+  delete meta.demos;
+
+  return acc;
+}, {});
+`, {
         metaFiles: await api.applyPlugins({
           type: api.ApplyPluginsType.modify,
           key: "dumi.modifyMetaFiles",
@@ -87,15 +107,16 @@ export const filesMeta = {
       noPluginDir: true,
       path: "dumi/meta/runtime.ts",
       content: `import { filesMeta, tabs } from '.';
+import deepmerge from '${(0, import_plugin_utils.winPath)(import_path.default.dirname(require.resolve("deepmerge/package")))}';
 export const patchRoutes = ({ routes }) => {
   Object.values(routes).forEach((route) => {
     if (filesMeta[route.id]) {
-      route.meta = { ...route.meta, ...filesMeta[route.id] };
+      route.meta = deepmerge(route.meta, filesMeta[route.id]);
 
       // apply real tab data from id
       route.meta.tabs = route.meta.tabs?.map(id => ({
         ...tabs[id],
-        ...filesMeta[id],
+        meta: filesMeta[id],
       }));
     }
   });

package/dist/features/parser.js

@@ -49,17 +49,22 @@ var parser_default = (api) => {
     return memo;
   });
   api.onStart(async () => {
-    const { default: AtomAssetsParser } = await import("../assetParsers/atom");
+    const {
+      default: AtomAssetsParser
+    } = require("../assetParsers/atom");
     api.service.atomParser = new AtomAssetsParser({
       entryFile: api.config.resolve.entryFile,
       resolveDir: api.cwd
     });
-    if (api.env === "production") {
-      api.service.atomParser.parse().then(writeAtomsMetaFile);
-    } else {
+    if (api.env === "development") {
       api.service.atomParser.watch(writeAtomsMetaFile);
     }
   });
+  if (api.env === "production") {
+    api.onGenerateFiles(async () => {
+      writeAtomsMetaFile(await api.service.atomParser.parse());
+    });
+  }
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {});

package/dist/features/routes.js

@@ -47,7 +47,7 @@ function localizeUmiRoute(route, locales) {
 var routes_default = (api) => {
   var _a, _b, _c;
   const extraWatchPaths = [
-    ...((_a = api.userConfig.resolve) == null ? void 0 : _a.entityDirs) || [],
+    ...((_a = api.userConfig.resolve) == null ? void 0 : _a.atomDirs) || [],
     ...((_c = (_b = api.userConfig.resolve) == null ? void 0 : _b.docDirs) == null ? void 0 : _c.map(normalizeDocDir)) || [
       { dir: "docs" }
     ]
@@ -63,7 +63,7 @@ var routes_default = (api) => {
   });
   api.modifyDefaultConfig((memo) => {
     if (api.userConfig.resolve) {
-      const keys = ["docDirs", "entityDirs"];
+      const keys = ["docDirs", "atomDirs"];
       keys.forEach((key) => {
         var _a2;
         if (((_a2 = api.userConfig.resolve[key]) == null ? void 0 : _a2.length) === 0)
@@ -83,7 +83,7 @@ var routes_default = (api) => {
       return ret;
     }, {});
     const { DocLayout, DemoLayout } = api.service.themeData.layouts;
-    const { docDirs, entityDirs } = api.config.resolve;
+    const { docDirs, atomDirs } = api.config.resolve;
     const layoutRouteValues = Object.values(routes);
     const lastLayoutId = layoutRouteValues.find(({ id }) => layoutRouteValues.every(({ parentId }) => id !== parentId)).id;
     let docLayoutId = lastLayoutId;
@@ -112,7 +112,7 @@ var routes_default = (api) => {
     }
     Object.entries(pages).forEach(([, route]) => {
       route.parentId = docLayoutId;
-      route.file = import_path.default.resolve(pagesDir, route.file);
+      route.file = (0, import_plugin_utils.winPath)(import_path.default.resolve(pagesDir, route.file));
       routes[route.id] = route;
     });
     docDirs.map(normalizeDocDir).forEach(({ type, dir }) => {
@@ -129,15 +129,15 @@ var routes_default = (api) => {
           route.path = `${pluralType}/${route.path}`.replace(/\/+$/, "/");
           route.absPath = `/${route.path}`;
         }
-        route.file = import_path.default.resolve(base, route.file);
+        route.file = (0, import_plugin_utils.winPath)(import_path.default.resolve(base, route.file));
         localizeUmiRoute(route, api.config.locales);
         routes[route.id] = route;
       });
     });
-    entityDirs.forEach(({ type, dir }) => {
+    atomDirs.forEach(({ type, dir }) => {
       const base = import_path.default.join(api.cwd, dir);
-      const entityFiles = import_plugin_utils.glob.sync("{*,*/index,*/index.*,*/README,*/README.*}.md", { cwd: base });
-      entityFiles.forEach((file) => {
+      const atomFiles = import_plugin_utils.glob.sync("{*,*/index,*/index.*,*/README,*/README.*}.md", { cwd: base });
+      atomFiles.forEach((file) => {
         const routePath = (0, import_plugin_utils.winPath)(import_path.default.join((0, import_pluralize.plural)(type), file)).replace(/(\/index|\/README)?\.md$/, "").replace(/\./g, "/");
         const routeId = (0, import_utils.createRouteId)(file);
         routes[routeId] = {
@@ -145,7 +145,7 @@ var routes_default = (api) => {
           path: routePath,
           absPath: `/${routePath}`,
           parentId: docLayoutId,
-          file: import_path.default.resolve(base, file)
+          file: (0, import_plugin_utils.winPath)(import_path.default.resolve(base, file))
         };
         localizeUmiRoute(routes[routeId], api.config.locales);
       });

package/dist/features/tabs.js

@@ -70,9 +70,9 @@ var tabs_default = (api) => {
         routesTabMapping[parentFile].push(routeId);
       } else {
         tabsFromPlugins.forEach((tab) => {
-          var _a;
-          if (!tab.test || route.absPath.match(tab.test)) {
-            routesTabMapping[_a = route.file] ?? (routesTabMapping[_a] = []);
+          var _a, _b;
+          if ((!tab.test || route.absPath.match(tab.test)) && !((_a = routesTabMapping[route.file]) == null ? void 0 : _a.includes(tab.id))) {
+            routesTabMapping[_b = route.file] ?? (routesTabMapping[_b] = []);
             routesTabMapping[route.file].push(tab.id);
           }
         });

package/dist/features/theme/index.js

@@ -29,11 +29,16 @@ var import_constants = require("../../constants");
 var import_fs = __toESM(require("fs"));
 var import_path = __toESM(require("path"));
 var import_plugin_utils = require("umi/plugin-utils");
+var import_exports = require("../exports");
 var import_loader = __toESM(require("./loader"));
 var DEFAULT_THEME_PATH = import_path.default.join(__dirname, "../../../theme-default");
-function getPkgThemePath(api) {
+function getPkgThemeName(api) {
   const validDeps = Object.assign({}, api.pkg.dependencies, api.pkg.devDependencies);
   const pkgThemeName = Object.keys(validDeps).find((pkg) => pkg.split("/").pop().startsWith(import_constants.THEME_PREFIX));
+  return pkgThemeName;
+}
+function getPkgThemePath(api) {
+  const pkgThemeName = getPkgThemeName(api);
   return pkgThemeName && import_path.default.basename(require.resolve(`${pkgThemeName}/package.json`, { paths: [api.cwd] }));
 }
 var theme_default = (api) => {
@@ -46,6 +51,7 @@ var theme_default = (api) => {
   ];
   let originalThemeData;
   api.describe({ key: "dumi:theme" });
+  (0, import_exports.safeExcludeInMFSU)(api, ["dumi/theme-default", "@ant-design/icons-svg", getPkgThemeName(api)].filter(Boolean).map((pkg) => new RegExp(pkg)));
   api.register({
     key: "modifyAppData",
     before: "appData",
@@ -77,7 +83,6 @@ var theme_default = (api) => {
     }
   });
   api.modifyConfig((memo) => {
-    memo.alias["dumi/theme$"] = require.resolve("../../client/theme-api");
     if (localThemeData) {
       themeMapKeys.forEach((key) => {
         Object.values(localThemeData[key] || {}).forEach((item) => {
@@ -123,6 +128,7 @@ export default function DumiContextWrapper() {
 
   return (
     <SiteContext.Provider value={{
+      pkg: ${JSON.stringify(import_plugin_utils.lodash.pick(api.pkg, ...Object.keys(import_constants.PICKED_PKG_FIELDS)))},
       demos,
       components,
       locales,

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

@@ -9,5 +9,5 @@ interface IMdLoaderDemosModeOptions extends Omit<IMdLoaderDefaultModeOptions, 'b
     onResolveDemos?: (demos: IMdTransformerResult['meta']['demos']) => void;
 }
 export declare type IMdLoaderOptions = IMdLoaderDefaultModeOptions | IMdLoaderDemosModeOptions;
-export default function mdLoader(this: any, raw: string): void;
+export default function mdLoader(this: any, content: string): void;
 export {};

package/dist/loaders/markdown/index.js

@@ -25,32 +25,20 @@ __export(markdown_exports, {
   default: () => mdLoader
 });
 module.exports = __toCommonJS(markdown_exports);
+var import_tabs = require("../../features/tabs");
 var import_utils = require("../../utils");
+var import_fs = __toESM(require("fs"));
 var import_plugin_utils = require("umi/plugin-utils");
 var import_transformer = __toESM(require("./transformer"));
-function mdLoader(raw) {
-  const opts = this.getOptions();
-  const cb = this.async();
-  let content = raw;
-  const params = new URLSearchParams(this.resourceQuery);
-  const range = params.get("range");
-  const regexp = params.get("regexp");
-  if (range) {
-    content = (0, import_utils.getFileRangeLines)(content, range);
-  } else if (regexp) {
-    content = (0, import_utils.getFileContentByRegExp)(content, regexp, this.resourcePath);
-  }
-  (0, import_transformer.default)(content, {
-    ...import_plugin_utils.lodash.omit(opts, ["mode", "builtins"]),
-    fileAbsPath: this.resourcePath
-  }).then((ret) => {
-    if (opts.mode === "meta") {
-      const { demos, frontmatter, toc, embeds = [] } = ret.meta;
-      embeds.forEach((file) => this.addDependency(file));
-      if (demos && opts.onResolveDemos) {
-        opts.onResolveDemos(demos);
-      }
-      cb(null, import_plugin_utils.Mustache.render(`import React from 'react';
+var import_rehypeText = require("./transformer/rehypeText");
+function emit(opts, ret) {
+  if (opts.mode === "meta") {
+    const { demos, frontmatter, toc, texts, embeds = [] } = ret.meta;
+    embeds.forEach((file) => this.addDependency(file));
+    if (demos && opts.onResolveDemos) {
+      opts.onResolveDemos(demos);
+    }
+    return import_plugin_utils.Mustache.render(`import React from 'react';
 
 export const demos = {
   {{#demos}}
@@ -61,35 +49,71 @@ export const demos = {
   {{/demos}}
 };
 export const frontmatter = {{{frontmatter}}};
-export const toc = {{{toc}}}
+export const toc = {{{toc}}};
+export const texts = {{{texts}}};
 `, {
-        demos,
-        frontmatter: JSON.stringify(frontmatter),
-        toc: JSON.stringify(toc),
-        renderAsset: function renderAsset() {
-          let asset = this.asset;
-          Object.keys(this.sources).forEach((file) => {
-            asset = import_plugin_utils.lodash.cloneDeep(this.asset);
-            asset.dependencies[file].value = `{{{require('!!raw-loader!${this.sources[file]}?raw').default}}}`;
-          });
-          return JSON.stringify(asset, null, 2).replace(/"{{{|}}}"/g, "");
-        }
-      }));
-    } else {
-      const isFragment = Boolean(this.resourcePath.includes("$tab-") || this.resourceQuery);
-      cb(null, `${Object.values(opts.builtins).map((item) => `import ${item.specifier} from '${item.source}';`).join("\n")}
-import React from 'react';${isFragment ? "" : `
-import { DumiPage } from 'dumi'`}
+      demos,
+      frontmatter: JSON.stringify(frontmatter),
+      toc: JSON.stringify(toc),
+      texts: JSON.stringify(texts),
+      renderAsset: function renderAsset() {
+        if (!("asset" in this))
+          return "null";
+        let { asset } = this;
+        const { sources } = this;
+        Object.keys(this.sources).forEach((file) => {
+          asset = import_plugin_utils.lodash.cloneDeep(asset);
+          asset.dependencies[file].value = `{{{require('!!raw-loader!${sources[file]}?raw').default}}}`;
+        });
+        return JSON.stringify(asset, null, 2).replace(/"{{{|}}}"/g, "");
+      }
+    });
+  } else {
+    const isTabContent = (0, import_tabs.isTabRouteFile)(this.resourcePath);
+    return `${Object.values(opts.builtins).map((item) => `import ${item.specifier} from '${item.source}';`).join("\n")}
+import React from 'react';
+${isTabContent ? `import { useTabMeta } from 'dumi';` : `import { DumiPage, useRouteMeta } from 'dumi';`}
 
 // 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
 function DumiMarkdownContent() {
-  return ${isFragment ? ret.content : `<DumiPage>${ret.content}</DumiPage>`};
+  const { texts: ${import_rehypeText.CONTENT_TEXTS_OBJ_NAME} } = use${isTabContent ? "TabMeta" : "RouteMeta"}();
+  return ${isTabContent ? ret.content : `<DumiPage>${ret.content}</DumiPage>`};
 }
 
-export default DumiMarkdownContent;`);
-    }
-  }, cb);
+export default DumiMarkdownContent;`;
+  }
+}
+var deferrer = {};
+function mdLoader(content) {
+  const opts = this.getOptions();
+  const cb = this.async();
+  const cache = (0, import_utils.getCache)("md-loader");
+  const cacheKey = [
+    this.resourcePath,
+    import_fs.default.statSync(this.resourcePath).mtimeMs,
+    JSON.stringify(import_plugin_utils.lodash.omit(opts, ["mode", "builtins", "onResolveDemos"]))
+  ].join(":");
+  const cacheRet = cache.getSync(cacheKey, "");
+  if (cacheRet) {
+    cb(null, emit.call(this, opts, cacheRet));
+    return;
+  } else if (cacheKey in deferrer) {
+    deferrer[cacheKey].then((res) => {
+      cb(null, emit.call(this, opts, res));
+    });
+    return;
+  }
+  deferrer[cacheKey] = new Promise((resolve) => {
+    (0, import_transformer.default)(content, {
+      ...import_plugin_utils.lodash.omit(opts, ["mode", "builtins", "onResolveDemos"]),
+      fileAbsPath: this.resourcePath
+    }).then((ret) => {
+      cache.setSync(cacheKey, ret);
+      resolve(ret);
+      cb(null, emit.call(this, opts, ret));
+    }, cb);
+  });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {});

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

@@ -1,7 +1,7 @@
 import type { IParsedBlockAsset } from "../../../assetParsers/block";
 import type { IRouteMeta } from "../../../client/theme-api/types";
 import type { IDumiConfig, IDumiTechStack } from "../../../types";
-import type { DataMap } from 'vfile';
+import type { Data } from 'vfile';
 declare module 'hast' {
     interface Element {
         JSXAttributes?: Array<{
@@ -16,12 +16,16 @@ declare module 'hast' {
 }
 declare module 'vfile' {
     interface DataMap {
-        demos: {
+        demos: ({
             id: string;
             component: string;
             asset: IParsedBlockAsset['asset'];
             sources: IParsedBlockAsset['sources'];
-        }[];
+        } | {
+            id: string;
+            component: string;
+        })[];
+        texts: IRouteMeta['texts'];
         frontmatter: IRouteMeta['frontmatter'];
         toc: IRouteMeta['toc'];
         embeds?: string[];
@@ -38,10 +42,10 @@ export interface IMdTransformerOptions {
 }
 export interface IMdTransformerResult {
     content: string;
-    meta: DataMap;
+    meta: Data;
 }
 declare const _default: (raw: string, opts: IMdTransformerOptions) => Promise<{
     content: string;
-    meta: import("vfile").Data;
+    meta: Data;
 }>;
 export default _default;

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

@@ -26,13 +26,15 @@ __export(transformer_exports, {
 });
 module.exports = __toCommonJS(transformer_exports);
 var import_rehypeDemo = __toESM(require("./rehypeDemo"));
-var import_rehypeEmbed = __toESM(require("./rehypeEmbed"));
 var import_rehypeEnhancedTag = __toESM(require("./rehypeEnhancedTag"));
+var import_rehypeImg = __toESM(require("./rehypeImg"));
 var import_rehypeIsolation = __toESM(require("./rehypeIsolation"));
 var import_rehypeJsxify = __toESM(require("./rehypeJsxify"));
 var import_rehypeRaw = __toESM(require("./rehypeRaw"));
 var import_rehypeSlug = __toESM(require("./rehypeSlug"));
 var import_rehypeStrip = __toESM(require("./rehypeStrip"));
+var import_rehypeText = __toESM(require("./rehypeText"));
+var import_remarkEmbed = __toESM(require("./remarkEmbed"));
 var import_remarkMeta = __toESM(require("./remarkMeta"));
 function applyUnifiedPlugin(opts) {
   const [plugin, options] = Array.isArray(opts.plugin) ? opts.plugin : [opts.plugin];
@@ -49,20 +51,18 @@ var transformer_default = async (raw, opts) => {
   const { default: remarkGfm } = await import("remark-gfm");
   const { default: remarkRehype } = await import("remark-rehype");
   const { default: rehypeAutolinkHeadings } = await import("rehype-autolink-headings");
-  const processor = unified().use(remarkParse).use(remarkFrontmatter).use(import_remarkMeta.default, { fileAbsPath: opts.fileAbsPath }).use(remarkBreaks).use(remarkGfm);
+  const processor = unified().use(remarkParse).use(import_remarkEmbed.default, { fileAbsPath: opts.fileAbsPath }).use(remarkFrontmatter).use(import_remarkMeta.default, { fileAbsPath: opts.fileAbsPath }).use(remarkBreaks).use(remarkGfm);
   (_a = opts.extraRemarkPlugins) == null ? void 0 : _a.forEach((plugin) => applyUnifiedPlugin({
     plugin,
     processor,
     cwd: opts.cwd
   }));
-  processor.use(remarkRehype, { allowDangerousHtml: true }).use(import_rehypeRaw.default).use(import_rehypeStrip.default).use(import_rehypeEmbed.default, {
-    fileAbsPath: opts.fileAbsPath
-  }).use(import_rehypeDemo.default, {
+  processor.use(remarkRehype, { allowDangerousHtml: true }).use(import_rehypeRaw.default).use(import_rehypeStrip.default).use(import_rehypeImg.default).use(import_rehypeDemo.default, {
     techStacks: opts.techStacks,
     cwd: opts.cwd,
     fileAbsPath: opts.fileAbsPath,
     codeBlockMode: opts.codeBlockMode
-  }).use(import_rehypeSlug.default, opts).use(rehypeAutolinkHeadings).use(import_rehypeIsolation.default).use(import_rehypeEnhancedTag.default);
+  }).use(import_rehypeSlug.default).use(rehypeAutolinkHeadings).use(import_rehypeIsolation.default).use(import_rehypeEnhancedTag.default).use(import_rehypeText.default);
   (_b = opts.extraRehypePlugins) == null ? void 0 : _b.forEach((plugin) => applyUnifiedPlugin({
     plugin,
     processor,

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

@@ -55,8 +55,8 @@ function getCodeLang(node, opts) {
   }
   return lang;
 }
-function getCodeId(cwd, fileAbsPath, localId, entityName) {
-  const prefix = entityName || (0, import_utils.getRoutePathFromFsPath)(import_path.default.relative(cwd, fileAbsPath)).replace(/\//g, "-");
+function getCodeId(cwd, fileAbsPath, localId, atomId) {
+  const prefix = atomId || (0, import_utils.getRoutePathFromFsPath)(import_path.default.relative(cwd, fileAbsPath)).replace(/\//g, "-");
   return [prefix, "demo", localId].filter(Boolean).join("-");
 }
 function tryMarkDemoNode(node, opts) {
@@ -150,8 +150,9 @@ function rehypeDemo(opts) {
                 fileAbsPath: opts.fileAbsPath
               });
             }
+            const propDemo = { id: parseOpts.id };
             deferrers.push((0, import_block.default)(parseOpts).then(async ({ asset, sources, frontmatter }) => {
-              var _a3;
+              var _a3, _b;
               const { src, className, ...restAttrs } = codeNode.properties || {};
               const validAssetAttrs = [
                 "title",
@@ -167,7 +168,14 @@ function rehypeDemo(opts) {
                 if (originalProps[key])
                   asset[key] = originalProps[key];
               });
-              Object.assign(previewerProps, await ((_a3 = techStack.generatePreviewerProps) == null ? void 0 : _a3.call(techStack, originalProps, {
+              if (/ inline/.test(String((_a3 = codeNode.data) == null ? void 0 : _a3.meta)) || originalProps.inline) {
+                propDemo.inline = true;
+                return {
+                  id: asset.id,
+                  component
+                };
+              }
+              Object.assign(previewerProps, await ((_b = techStack.generatePreviewerProps) == null ? void 0 : _b.call(techStack, originalProps, {
                 type: codeType,
                 mdAbsPath: opts.fileAbsPath,
                 fileAbsPath: codeType === "external" ? parseOpts.fileAbsPath : void 0,
@@ -194,7 +202,7 @@ function rehypeDemo(opts) {
               };
             }));
             demosPropData.push({
-              demo: { id: parseOpts.id },
+              demo: propDemo,
               previewerProps
             });
           }

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

@@ -44,7 +44,12 @@ function rehypeEnhancedTag() {
           type: "element",
           tagName: "SourceCode",
           properties: { lang },
-          children: [{ type: "text", value: toString(node.children[0]) }]
+          children: [
+            {
+              type: "text",
+              value: toString(node.children[0])
+            }
+          ]
         });
       }
     });

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

@@ -0,0 +1,6 @@
+import type { Root } from 'hast';
+import type { Transformer } from 'unified';
+/**
+ * rehype plugin to handle img source from local
+ */
+export default function rehypeImg(): Transformer<Root>;