dumi 2.2.7 → 2.3.0-alpha.1

package/dist/features/meta.js

@@ -34,6 +34,7 @@ __export(meta_exports, {
   default: () => meta_default
 });
 module.exports = __toCommonJS(meta_exports);
+var import_constants = require("../constants");
 var import_path = __toESM(require("path"));
 var import_plugin_utils = require("umi/plugin-utils");
 var import_tabs = require("./tabs");
@@ -65,89 +66,53 @@ var meta_default = (api) => {
       path: ATOMS_META_PATH,
       content: "export const components = null;"
     });
+    const parsedMetaFiles = await api.applyPlugins({
+      type: api.ApplyPluginsType.modify,
+      key: "dumi.modifyMetaFiles",
+      initialValue: JSON.parse(JSON.stringify(metaFiles))
+    });
     api.writeTmpFile({
       noPluginDir: true,
-      path: "dumi/meta/index.ts",
-      content: import_plugin_utils.Mustache.render(
-        `{{#metaFiles}}
-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 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",
-            initialValue: metaFiles
-          })
-        }
-      )
+      path: "dumi/meta/search.ts",
+      tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(import_constants.TEMPLATES_DIR, "meta-search.ts.tpl")),
+      context: {
+        metaFiles: parsedMetaFiles
+      }
+    });
+    api.writeTmpFile({
+      noPluginDir: true,
+      path: "dumi/meta/frontmatter.ts",
+      tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(import_constants.TEMPLATES_DIR, "meta-frontmatter.ts.tpl")),
+      context: {
+        metaFiles: parsedMetaFiles
+      }
+    });
+    const mdFiles = parsedMetaFiles.filter(
+      (metaFile) => metaFile.file.endsWith(".md")
+    );
+    api.writeTmpFile({
+      noPluginDir: true,
+      path: "dumi/meta/demos.ts",
+      tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(import_constants.TEMPLATES_DIR, "meta-demos.ts.tpl")),
+      context: {
+        metaFiles: mdFiles
+      }
+    });
+    api.writeTmpFile({
+      noPluginDir: true,
+      path: "dumi/meta/route-meta.ts",
+      tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(import_constants.TEMPLATES_DIR, "meta-route.ts.tpl")),
+      context: {
+        metaFiles: mdFiles
+      }
     });
     api.writeTmpFile({
       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]) {
-      if (process.env.NODE_ENV === 'production' && (route.meta?.frontmatter?.debug || filesMeta[route.id].frontmatter.debug)) {
-        // hide route in production which set hide frontmatter
-        delete routes[route.id];
-      } else {
-        // merge meta to route object
-        route.meta = deepmerge(route.meta, filesMeta[route.id]);
-
-        // apply real tab data from id
-        route.meta.tabs = route.meta.tabs?.map((id) => {
-          const meta = {
-            frontmatter: { title: tabs[id].title },
-            toc: [],
-            texts: [],
-          }
-          return {
-            ...tabs[id],
-            meta: filesMeta[id] || meta,
-          }
-        });
+      tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(import_constants.TEMPLATES_DIR, "meta-runtime.ts.tpl")),
+      context: {
+        deepmerge: (0, import_plugin_utils.winPath)(import_path.default.dirname(require.resolve("deepmerge/package")))
       }
-    }
-  });
-}
-`
     });
   });
   api.addRuntimePlugin(() => "@@/dumi/meta/runtime.ts");

package/dist/features/theme/index.js

@@ -279,63 +279,27 @@ export default DumiLoading;
     api.writeTmpFile({
       noPluginDir: true,
       path: "dumi/theme/ContextWrapper.tsx",
-      content: `import React, { useState, useEffect, useRef } from 'react';
-import { useOutlet, history } from 'dumi';
-import { SiteContext } from '${(0, import_plugin_utils.winPath)(
-        require.resolve("../../client/theme-api/context")
-      )}';
-import { demos, components } from '../meta';
-import { locales } from '../locales/config';${hasDefaultExport ? `
-import entryDefaultExport from '${(0, import_plugin_utils.winPath)(entryFile)}';` : ""}${hasNamedExport ? `
-import * as entryMemberExports from '${(0, import_plugin_utils.winPath)(entryFile)}';` : ""}
-
-const entryExports = {
-  ${hasDefaultExport ? "default: entryDefaultExport," : ""}
-  ${hasNamedExport ? "...entryMemberExports," : ""}
-};
-
-export default function DumiContextWrapper() {
-  const outlet = useOutlet();
-  const [loading, setLoading] = useState(false);
-  const prev = useRef(history.location.pathname);
-
-  useEffect(() => {
-    return history.listen((next) => {
-      if (next.location.pathname !== prev.current) {
-        prev.current = next.location.pathname;
-
-        // scroll to top when route changed
-        document.documentElement.scrollTo(0, 0);
+      tplPath: (0, import_plugin_utils.winPath)((0, import_path.join)(import_constants.TEMPLATES_DIR, "ContextWrapper.ts.tpl")),
+      context: {
+        contextPath: (0, import_plugin_utils.winPath)(require.resolve("../../client/theme-api/context")),
+        defaultExport: hasDefaultExport ? `import entryDefaultExport from '${(0, import_plugin_utils.winPath)(entryFile)}';` : "",
+        namedExport: hasNamedExport ? `import * as entryMemberExports from '${(0, import_plugin_utils.winPath)(entryFile)}';` : "",
+        hasDefaultExport,
+        hasNamedExport,
+        pkg: JSON.stringify(
+          import_plugin_utils.lodash.pick(api.pkg, ...Object.keys(import_constants.PICKED_PKG_FIELDS))
+        ),
+        historyType: ((_a = api.config.history) == null ? void 0 : _a.type) || "browser",
+        hostname: String(JSON.stringify((_b = api.config.sitemap) == null ? void 0 : _b.hostname)),
+        themeConfig: JSON.stringify(
+          Object.assign(
+            import_plugin_utils.lodash.pick(api.config, "logo", "description", "title"),
+            api.config.themeConfig
+          )
+        ),
+        _2_level_nav_available: api.appData._2LevelNavAvailable
       }
     });
-  }, []);
-
-  return (
-    <SiteContext.Provider value={{
-      pkg: ${JSON.stringify(
-        import_plugin_utils.lodash.pick(api.pkg, ...Object.keys(import_constants.PICKED_PKG_FIELDS))
-      )},
-      historyType: "${((_a = api.config.history) == null ? void 0 : _a.type) || "browser"}",
-      entryExports,
-      demos,
-      components,
-      locales,
-      loading,
-      setLoading,
-      hostname: ${JSON.stringify((_b = api.config.sitemap) == null ? void 0 : _b.hostname)},
-      themeConfig: ${JSON.stringify(
-        Object.assign(
-          import_plugin_utils.lodash.pick(api.config, "logo", "description", "title"),
-          api.config.themeConfig
-        )
-      )},
-      _2_level_nav_available: ${api.appData._2LevelNavAvailable},
-    }}>
-      {outlet}
-    </SiteContext.Provider>
-  );
-}`
-    });
     const primaryColor = typeof ((_c = api.config) == null ? void 0 : _c.theme) === "object" ? (_e = (_d = api.config) == null ? void 0 : _d.theme) == null ? void 0 : _e["@c-primary"] : "#1677ff";
     api.writeTmpFile({
       noPluginDir: true,

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

@@ -3,12 +3,24 @@ import { type IMdTransformerOptions, type IMdTransformerResult } from './transfo
 interface IMdLoaderDefaultModeOptions extends Omit<IMdTransformerOptions, 'fileAbsPath'> {
     mode?: 'markdown';
     builtins: IThemeLoadResult['builtins'];
+    onResolveDemos?: (demos: NonNullable<IMdTransformerResult['meta']['demos']>) => void;
+    onResolveAtomMeta?: (atomId: string, meta: IMdTransformerResult['meta']['frontmatter']) => void;
 }
 interface IMdLoaderDemosModeOptions extends Omit<IMdLoaderDefaultModeOptions, 'builtins' | 'mode'> {
     mode: 'meta';
-    onResolveDemos?: (demos: NonNullable<IMdTransformerResult['meta']['demos']>) => void;
-    onResolveAtomMeta?: (atomId: string, meta: IMdTransformerResult['meta']['frontmatter']) => void;
 }
-export type IMdLoaderOptions = IMdLoaderDefaultModeOptions | IMdLoaderDemosModeOptions;
+interface IMdLoaderDemoModeOptions extends Omit<IMdLoaderDefaultModeOptions, 'builtins' | 'mode'> {
+    mode: 'demo';
+}
+interface IMdLoaderDemoIndexModeOptions extends Omit<IMdLoaderDefaultModeOptions, 'builtins' | 'mode'> {
+    mode: 'demo-index';
+}
+interface IMdLoaderFrontmatterModeOptions extends Omit<IMdLoaderDefaultModeOptions, 'builtins' | 'mode'> {
+    mode: 'frontmatter';
+}
+interface IMdLoaderTextModeOptions extends Omit<IMdLoaderDefaultModeOptions, 'builtins' | 'mode'> {
+    mode: 'text';
+}
+export type IMdLoaderOptions = IMdLoaderDefaultModeOptions | IMdLoaderDemosModeOptions | IMdLoaderDemoModeOptions | IMdLoaderFrontmatterModeOptions | IMdLoaderTextModeOptions | IMdLoaderDemoIndexModeOptions;
 export default function mdLoader(this: any, content: string): void;
 export {};

package/dist/loaders/markdown/index.js

@@ -46,20 +46,10 @@ function getDemoSourceFiles(demos = []) {
     return ret;
   }, []);
 }
-function emit(opts, ret) {
-  const { demos, embeds } = ret.meta;
-  embeds.forEach((file) => this.addDependency(file));
-  getDemoSourceFiles(demos).forEach((file) => this.addDependency(file));
-  if (opts.mode === "meta") {
-    const { frontmatter, toc, texts } = ret.meta;
-    if (demos && opts.onResolveDemos) {
-      opts.onResolveDemos(demos);
-    }
-    if (frontmatter.atomId && opts.onResolveAtomMeta) {
-      opts.onResolveAtomMeta(frontmatter.atomId, frontmatter);
-    }
-    return import_plugin_utils.Mustache.render(
-      `import React from 'react';
+function emitMeta(opts, ret) {
+  const { frontmatter, toc, texts, demos } = ret.meta;
+  return import_plugin_utils.Mustache.render(
+    `import React from 'react';
 
 export const demos = {
   {{#demos}}
@@ -73,40 +63,129 @@ export const frontmatter = {{{frontmatter}}};
 export const toc = {{{toc}}};
 export const texts = {{{texts}}};
 `,
-      {
-        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) => {
-            if (!asset.dependencies[file])
-              return;
-            asset = import_plugin_utils.lodash.cloneDeep(asset);
-            asset.dependencies[file].value = `{{{require('-!${sources[file]}?dumi-raw').default}}}`;
-          });
-          return JSON.stringify(asset, null, 2).replace(/"{{{|}}}"/g, "");
-        }
+    {
+      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) => {
+          if (!asset.dependencies[file])
+            return;
+          asset = import_plugin_utils.lodash.cloneDeep(asset);
+          asset.dependencies[file].value = `{{{require('-!${sources[file]}?dumi-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")}
+    }
+  );
+}
+function emitDefault(opts, ret) {
+  const { frontmatter, demos } = ret.meta;
+  const isTabContent = (0, import_tabs.isTabRouteFile)(this.resourcePath);
+  if (demos && opts.onResolveDemos) {
+    opts.onResolveDemos(demos);
+  }
+  if (frontmatter.atomId && opts.onResolveAtomMeta) {
+    opts.onResolveAtomMeta(frontmatter.atomId, frontmatter);
+  }
+  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';`}
+${isTabContent ? `` : `import { DumiPage } from 'dumi';`}
+import { texts as ${import_rehypeText.CONTENT_TEXTS_OBJ_NAME} } from '${(0, import_plugin_utils.winPath)(
+    this.resourcePath
+  )}?type=text';
 
 // 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() {
-  const { texts: ${import_rehypeText.CONTENT_TEXTS_OBJ_NAME} } = use${isTabContent ? "TabMeta" : "RouteMeta"}();
   return ${isTabContent ? ret.content : `<DumiPage>${ret.content}</DumiPage>`};
 }
 
 export default DumiMarkdownContent;`;
+}
+function emitDemo(opts, ret) {
+  const { demos } = ret.meta;
+  return import_plugin_utils.Mustache.render(
+    `import React from 'react';
+
+export const demos = {
+  {{#demos}}
+  '{{{id}}}': {
+    component: {{{component}}},
+    asset: {{{renderAsset}}}
+  },
+  {{/demos}}
+};`,
+    {
+      demos,
+      renderAsset: function renderAsset() {
+        if (!("asset" in this))
+          return "null";
+        let { asset } = this;
+        const { sources } = this;
+        Object.keys(this.sources).forEach((file) => {
+          if (!asset.dependencies[file])
+            return;
+          asset = import_plugin_utils.lodash.cloneDeep(asset);
+          asset.dependencies[file].value = `{{{require('-!${sources[file]}?dumi-raw').default}}}`;
+        });
+        return JSON.stringify(asset, null, 2).replace(/"{{{|}}}"/g, "");
+      }
+    }
+  );
+}
+function emitDemoIndex(opts, ret) {
+  const { demos } = ret.meta;
+  return import_plugin_utils.Mustache.render(
+    `export const demoIndex = {
+  ids: {{{ids}}},
+  getter: {{{getter}}}
+};`,
+    {
+      ids: JSON.stringify(demos == null ? void 0 : demos.map((demo) => demo.id)),
+      getter: `() => import('${(0, import_plugin_utils.winPath)(this.resourcePath)}?type=demo')`
+    }
+  );
+}
+function emitFrontmatter(opts, ret) {
+  const { frontmatter } = ret.meta;
+  return import_plugin_utils.Mustache.render(`export const frontmatter = {{{frontmatter}}};`, {
+    frontmatter: JSON.stringify(frontmatter)
+  });
+}
+function emitText(opts, ret) {
+  const { texts, toc } = ret.meta;
+  return import_plugin_utils.Mustache.render(
+    `export const toc = {{{toc}}};
+export const texts = {{{texts}}};`,
+    {
+      toc: JSON.stringify(toc),
+      texts: JSON.stringify(texts)
+    }
+  );
+}
+function emit(opts, ret) {
+  const { demos, embeds } = ret.meta;
+  embeds.forEach((file) => this.addDependency(file));
+  getDemoSourceFiles(demos).forEach((file) => this.addDependency(file));
+  switch (opts.mode) {
+    case "meta":
+      return emitMeta.call(this, opts, ret);
+    case "demo":
+      return emitDemo.call(this, opts, ret);
+    case "demo-index":
+      return emitDemoIndex.call(this, opts, ret);
+    case "frontmatter":
+      return emitFrontmatter.call(this, opts, ret);
+    case "text":
+      return emitText.call(this, opts, ret);
+    default:
+      return emitDefault.call(this, opts, ret);
   }
 }
 function getDepsCacheKey(deps = []) {

package/dist/templates/ContextWrapper.ts.tpl

@@ -0,0 +1,92 @@
+import React, { useState, useEffect, useRef } from 'react';
+import { useOutlet, history } from 'dumi';
+import { warning } from 'rc-util';
+import { SiteContext, type ISiteContext } from '{{{contextPath}}}';
+import { components } from '../meta/atoms';
+import { tabs } from '../meta/tabs';
+import { getDemoById } from '../meta/demos';
+import { locales } from '../locales/config';
+{{{defaultExport}}}
+{{{namedExport}}}
+
+const entryExports = {
+  {{#hasDefaultExport}}
+    default: entryDefaultExport,
+  {{/hasDefaultExport}}
+  {{#hasNamedExport}}
+    ...entryMemberExports,
+  {{/hasNamedExport}}
+};
+
+// Static content
+const pkg = {{{pkg}}};
+const historyType = "{{{historyType}}}";
+const hostname = {{{hostname}}};
+const themeConfig = {{{themeConfig}}};
+const _2_level_nav_available = {{{_2_level_nav_available}}};
+
+export default function DumiContextWrapper() {
+  const outlet = useOutlet();
+  const [loading, setLoading] = useState(false);
+  const prev = useRef(history.location.pathname);
+
+  useEffect(() => {
+    return history.listen((next) => {
+      if (next.location.pathname !== prev.current) {
+        prev.current = next.location.pathname;
+
+        // scroll to top when route changed
+        document.documentElement.scrollTo(0, 0);
+      }
+    });
+  }, []);
+
+  const context: ISiteContext = React.useMemo(() => {
+    const ctx = {
+      pkg,
+      historyType,
+      entryExports,
+      demos: null,
+      components,
+      tabs,
+      locales,
+      loading,
+      setLoading,
+      hostname,
+      themeConfig,
+      _2_level_nav_available,
+      getDemoById,
+    };
+
+    // Proxy do not warning since `Object.keys` will get nothing to loop
+    Object.defineProperty(ctx, 'demos', {
+      get: () => {
+        warning(false, '`demos` return empty in latest version.');
+        return {};
+      },
+    });
+
+    return ctx;
+  }, [
+    pkg,
+    historyType,
+    entryExports,
+    components,
+    tabs,
+    locales,
+    loading,
+    setLoading,
+    hostname,
+    themeConfig,
+    _2_level_nav_available,
+    getDemoById,
+  ]);
+
+
+
+  return (
+    <SiteContext.Provider value={context}>
+      {outlet}
+    </SiteContext.Provider>
+  );
+}

package/dist/templates/meta-demos.ts.tpl

@@ -0,0 +1,34 @@
+{{#metaFiles}}
+import { demoIndex as dmi{{{index}}} } from '{{{file}}}?type=demo-index';
+{{/metaFiles}}
+
+const demoIndexes: Record<string, { ids: string[], getter: () => Promise<any> }> = {
+  {{#metaFiles}}
+  '{{{id}}}': dmi{{{index}}},
+  {{/metaFiles}}
+};
+
+// Convert the demoIndex to a key-value pairs: <demoId, getter>
+const demoIdMap = Object.keys(demoIndexes).reduce((total, current) => {
+  const demoIndex = demoIndexes[current];
+  const { ids, getter } = demoIndex;
+
+  ids.forEach((id) => {
+    total[id] = getter;
+  });
+
+  return total;
+}, {});
+
+/** Async to load demo by id */
+export const getDemoById = async (id: string) => {
+  const getter = demoIdMap[id];
+
+  if (!getter) {
+    return null;
+  }
+
+  const { demos }: any = await getter() || {};
+
+  return demos?.[id];
+};

package/dist/templates/meta-frontmatter.ts.tpl

@@ -0,0 +1,9 @@
+{{#metaFiles}}
+import { frontmatter as fm{{{index}}} } from '{{{file}}}?type=frontmatter';
+{{/metaFiles}}
+
+export const filesFrontmatter = {
+  {{#metaFiles}}
+  '{{{id}}}': fm{{{index}}},
+  {{/metaFiles}}
+}

package/dist/templates/meta-route.ts.tpl

@@ -0,0 +1,43 @@
+import { tabs } from './tabs';
+import { filesFrontmatter } from './frontmatter';
+
+const files = {
+{{#metaFiles}}
+  '{{{id}}}': {
+    textGetter: () => import('{{{file}}}?type=text'),
+    {{#tabs}}
+    tabs: {{{tabs}}},
+    {{/tabs}}
+  },
+{{/metaFiles}}
+};
+
+export const getRouteMetaById = async (id: string) => {
+  const file = files[id];
+
+  if (!file) {
+    return null;
+  }
+
+  const text = await file.textGetter();
+  const frontmatter = filesFrontmatter[id];
+
+  const tabsMeta = file.tabs && await Promise.all(file.tabs.map(async (tab) => {
+    const meta = await getRouteMetaById(tab) ?? {
+      frontmatter: { title: tabs[tab].title },
+      toc: [],
+      texts: [],
+    };
+    return {
+      ...tabs[tab],
+      meta,
+    }
+  }));
+
+  return {
+    texts: text?.texts,
+    toc: text?.toc,
+    frontmatter,
+    tabs: tabsMeta,
+  };
+}

package/dist/templates/meta-runtime.ts.tpl

@@ -0,0 +1,48 @@
+import { warning } from 'rc-util';
+import { tabs } from './tabs';
+import { filesFrontmatter } from './frontmatter';
+import deepmerge from '{{{deepmerge}}}';
+
+// Proxy do not warning since `Object.keys` will get nothing to loop
+function wrapEmpty(meta, fieldName, defaultValue) {
+  Object.defineProperty(meta, fieldName, {
+    get: () => {
+      warning(false, `'${fieldName}' return empty in latest version.`);
+      return defaultValue;
+    },
+  });
+}
+
+export const patchRoutes = ({ routes }) => {
+  Object.values(routes).forEach((route) => {
+    if (filesFrontmatter[route.id]) {
+      if (process.env.NODE_ENV === 'production' && (route.meta?.frontmatter?.debug || filesFrontmatter[route.id].debug)) {
+        // hide route in production which set hide frontmatter
+        delete routes[route.id];
+      } else {
+        // merge meta to route object
+        route.meta = deepmerge(route.meta, { frontmatter: filesFrontmatter[route.id] });
+
+        wrapEmpty(route.meta, 'demos', {});
+        wrapEmpty(route.meta, 'texts', []);
+
+        // apply real tab data from id
+        route.meta.tabs = route.meta.tabs?.map((id) => {
+          const meta = {
+            frontmatter: filesFrontmatter[id] || { title: tabs[id].title },
+            toc: [],
+            texts: [],
+          }
+
+          wrapEmpty(meta, 'demos', {});
+          wrapEmpty(meta, 'texts', []);
+
+          return {
+            ...tabs[id],
+            meta,
+          }
+        });
+      }
+    }
+  });
+}