dumi 2.0.0-beta.5 → 2.0.0-beta.7

package/dist/client/theme-api/DumiDemo.js

@@ -11,6 +11,7 @@ export var DumiDemo = function DumiDemo(props) {
   var _demos$props$demo$id = demos[props.demo.id],
       component = _demos$props$demo$id.component,
       asset = _demos$props$demo$id.asset;
+  if (props.demo.inline) return /*#__PURE__*/createElement(component);
   return /*#__PURE__*/React.createElement(Previewer, _extends({
     asset: asset,
     demoUrl: // allow user override demoUrl by frontmatter

package/dist/client/theme-api/context.d.ts

@@ -1,7 +1,9 @@
+import type { PICKED_PKG_FIELDS } from "../../constants";
 import type { AtomComponentAsset } from 'dumi-assets-types';
 import { type ComponentType } from 'react';
 import type { ILocalesConfig, IPreviewerProps, IThemeConfig } from './types';
 interface ISiteContext {
+    pkg: Partial<Record<keyof typeof PICKED_PKG_FIELDS, any>>;
     demos: Record<string, {
         component: ComponentType;
         asset: IPreviewerProps['asset'];

package/dist/client/theme-api/context.js

@@ -1,5 +1,6 @@
 import { createContext, useContext } from 'react';
 export var SiteContext = /*#__PURE__*/createContext({
+  pkg: {},
   demos: {},
   components: {},
   locales: [],

package/dist/constants.d.ts

@@ -1,3 +1,12 @@
 export declare const LOCAL_THEME_DIR = ".dumi/theme";
 export declare const THEME_PREFIX = "dumi-theme-";
 export declare const SP_ROUTE_PREFIX = "~";
+export declare const PICKED_PKG_FIELDS: {
+    name: string;
+    description: string;
+    version: string;
+    license: string;
+    repository: string;
+    author: string;
+    authors: string;
+};

package/dist/constants.js

@@ -20,6 +20,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var constants_exports = {};
 __export(constants_exports, {
   LOCAL_THEME_DIR: () => LOCAL_THEME_DIR,
+  PICKED_PKG_FIELDS: () => PICKED_PKG_FIELDS,
   SP_ROUTE_PREFIX: () => SP_ROUTE_PREFIX,
   THEME_PREFIX: () => THEME_PREFIX
 });
@@ -27,9 +28,19 @@ module.exports = __toCommonJS(constants_exports);
 var LOCAL_THEME_DIR = ".dumi/theme";
 var THEME_PREFIX = "dumi-theme-";
 var SP_ROUTE_PREFIX = "~";
+var PICKED_PKG_FIELDS = {
+  name: "",
+  description: "",
+  version: "",
+  license: "",
+  repository: "",
+  author: "",
+  authors: ""
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   LOCAL_THEME_DIR,
+  PICKED_PKG_FIELDS,
   SP_ROUTE_PREFIX,
   THEME_PREFIX
 });

package/dist/features/assets.d.ts

@@ -0,0 +1,12 @@
+import type { IApi } from "../types";
+import type { ExampleAsset } from 'dumi-assets-types';
+declare const examples: ExampleAsset[];
+/**
+ * internal function to add example assets
+ */
+export declare function addExampleAssets(data: typeof examples): void;
+/**
+ * plugin for generate assets.json
+ */
+declare const _default: (api: IApi) => void;
+export default _default;

package/dist/features/assets.js

@@ -0,0 +1,67 @@
+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)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__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: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/features/assets.ts
+var assets_exports = {};
+__export(assets_exports, {
+  addExampleAssets: () => addExampleAssets,
+  default: () => assets_default
+});
+module.exports = __toCommonJS(assets_exports);
+var import_fs = __toESM(require("fs"));
+var import_path = __toESM(require("path"));
+var import_plugin_utils = require("umi/plugin-utils");
+var examples = [];
+function addExampleAssets(data) {
+  examples.push(...data);
+}
+var assets_default = (api) => {
+  api.describe({
+    config: {
+      schema: (Joi) => Joi.object()
+    },
+    enableBy: ({ env }) => env === "production" && Boolean(api.args.assets)
+  });
+  api.onBuildComplete(async () => {
+    const { components } = await api.service.atomParser.parse();
+    const assets = await api.applyPlugins({
+      key: "modifyAssetsMetadata",
+      initialValue: {
+        name: api.config.themeConfig.title || api.pkg.name,
+        npmPackageName: api.pkg.name,
+        version: api.pkg.version,
+        description: api.pkg.description,
+        logo: api.config.themeConfig.logo,
+        homepage: api.pkg.homepage,
+        repository: api.pkg.repository,
+        assets: {
+          atoms: Object.values(components),
+          examples: import_plugin_utils.lodash.uniqBy(examples, "id")
+        }
+      }
+    });
+    import_fs.default.writeFileSync(import_path.default.join(api.cwd, "assets.json"), JSON.stringify(assets, null, 2), "utf-8");
+  });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  addExampleAssets
+});

package/dist/features/compile.js

@@ -26,6 +26,7 @@ __export(compile_exports, {
 });
 module.exports = __toCommonJS(compile_exports);
 var import_react = __toESM(require("../techStacks/react"));
+var import_assets = require("./assets");
 var compile_default = (api) => {
   api.register({
     key: "registerTechStack",
@@ -52,7 +53,15 @@ var compile_default = (api) => {
     };
     memo.module.rule("dumi-md").type("javascript/auto").test(/\.md$/).oneOf("md-meta").resourceQuery(/meta$/).use("babel-loader").loader(babelInUmi.loader).options(babelInUmi.options).end().use("md-meta-loader").loader(loaderPath).options({
       ...loaderBaseOpts,
-      mode: "meta"
+      mode: "meta",
+      onResolveDemos(demos) {
+        const assets = demos.reduce((ret, demo) => {
+          if ("asset" in demo)
+            ret.push(demo.asset);
+          return ret;
+        }, []);
+        (0, import_assets.addExampleAssets)(assets);
+      }
     }).end().end().oneOf("md").use("babel-loader").loader(babelInUmi.loader).options(babelInUmi.options).end().use("md-loader").loader(loaderPath).options({
       ...loaderBaseOpts,
       builtins: api.service.themeData.builtins

package/dist/features/parser.js

@@ -25,7 +25,7 @@ __export(parser_exports, {
   default: () => parser_default
 });
 module.exports = __toCommonJS(parser_exports);
-var import_atom = __toESM(require("../assetParsers/atom"));
+var import_assert = __toESM(require("assert"));
 var import_meta = require("./meta");
 var parser_default = (api) => {
   const writeAtomsMetaFile = (data) => {
@@ -43,24 +43,28 @@ var parser_default = (api) => {
     }
   });
   api.modifyDefaultConfig((memo) => {
-    var _a;
-    if (!((_a = api.userConfig.resolve) == null ? void 0 : _a.entryFile)) {
-      api.logger.error("`resolve.entryFile` must be configured when `apiParser` enable");
-      process.exit(1);
-    }
+    var _a, _b;
+    (0, import_assert.default)((_a = api.userConfig.resolve) == null ? void 0 : _a.entryFile, "`resolve.entryFile` must be configured when `apiParser` enable");
+    (0, import_assert.default)((_b = api.pkg.devDependencies) == null ? void 0 : _b["typescript"], "typescript must be installed when `apiParser` enable");
     return memo;
   });
-  api.onStart(() => {
-    api.service.atomParser = new import_atom.default({
+  api.onStart(async () => {
+    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

@@ -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,7 +129,7 @@ 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;
       });
@@ -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.d.ts

@@ -1,5 +1,14 @@
 import type { IApi } from "../types";
+export interface IContentTab {
+    key: string;
+    id?: string;
+    test?: RegExp;
+    component: string;
+}
 export declare function isTabRouteFile(file: string): boolean;
 export declare function getTabKeyFromFile(file: string): string;
+/**
+ * plugin for add conventional tab and plugin tab into page content
+ */
 declare const _default: (api: IApi) => void;
 export default _default;

package/dist/features/tabs.js

@@ -38,8 +38,19 @@ function getTabKeyFromFile(file) {
   return file.match(/\$tab-([^.]+)/)[1];
 }
 var tabs_default = (api) => {
+  let tabsFromPlugins;
+  const routesTabMapping = {};
   const tabs = [];
   api.describe({ key: void 0 });
+  api.modifyConfig(async (memo) => {
+    tabsFromPlugins = await api.applyPlugins({
+      key: "addContentTab"
+    });
+    tabsFromPlugins.forEach((tab) => {
+      tab.id ?? (tab.id = `plugin-tab${tab.test ? `-${tab.test}` : ""}-${tab.key}`);
+    });
+    return memo;
+  });
   api.modifyRoutes((routes) => {
     tabs.length = 0;
     Object.values(routes).forEach((route) => {
@@ -52,24 +63,35 @@ var tabs_default = (api) => {
         tabs.push({
           index: tabs.length,
           key: tabKey,
-          id: `${routeId}`,
-          file: route.file,
-          parentFile
+          id: routeId,
+          file: route.file
+        });
+        routesTabMapping[parentFile] ?? (routesTabMapping[parentFile] = []);
+        routesTabMapping[parentFile].push(routeId);
+      } else {
+        tabsFromPlugins.forEach((tab) => {
+          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);
+          }
         });
       }
     });
+    tabs.push(...tabsFromPlugins.map((tab) => ({
+      index: tabs.length,
+      key: tab.key,
+      id: tab.id,
+      file: tab.component
+    })));
     return routes;
   });
   api.register({
     key: "dumi.modifyMetaFiles",
     fn: (metaFiles) => {
-      const tabsMapping = tabs.reduce((ret, tab) => ({
-        ...ret,
-        [tab.parentFile]: [...ret[tab.parentFile] || [], tab]
-      }), {});
       Object.values(metaFiles).forEach((metaFile) => {
-        if (tabsMapping[metaFile.file]) {
-          metaFile.tabs = JSON.stringify(tabsMapping[metaFile.file].map(({ id }) => id));
+        if (routesTabMapping[metaFile.file]) {
+          metaFile.tabs = JSON.stringify(routesTabMapping[metaFile.file]);
         }
       });
       tabs.forEach((tab) => {

package/dist/features/theme/index.js

@@ -123,6 +123,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

@@ -1,11 +1,12 @@
 import type { IThemeLoadResult } from "../../features/theme/loader";
-import { type IMdTransformerOptions } from './transformer';
+import { type IMdTransformerOptions, type IMdTransformerResult } from './transformer';
 interface IMdLoaderDefaultModeOptions extends Omit<IMdTransformerOptions, 'fileAbsPath'> {
     mode?: 'markdown';
     builtins: IThemeLoadResult['builtins'];
 }
 interface IMdLoaderDemosModeOptions extends Omit<IMdLoaderDefaultModeOptions, 'builtins' | 'mode'> {
     mode: 'meta';
+    onResolveDemos?: (demos: IMdTransformerResult['meta']['demos']) => void;
 }
 export declare type IMdLoaderOptions = IMdLoaderDefaultModeOptions | IMdLoaderDemosModeOptions;
 export default function mdLoader(this: any, raw: string): void;

package/dist/loaders/markdown/index.js

@@ -47,6 +47,9 @@ function mdLoader(raw) {
     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';
 
 export const demos = {
@@ -64,10 +67,15 @@ export const toc = {{{toc}}}
         frontmatter: JSON.stringify(frontmatter),
         toc: JSON.stringify(toc),
         renderAsset: function renderAsset() {
+          if (!("asset" in this))
+            return "null";
+          let { asset } = this;
+          const { sources } = this;
           Object.keys(this.sources).forEach((file) => {
-            this.asset.dependencies[file].value = `{{{require('!!raw-loader!${this.sources[file]}?raw').default}}}`;
+            asset = import_plugin_utils.lodash.cloneDeep(asset);
+            asset.dependencies[file].value = `{{{require('!!raw-loader!${sources[file]}?raw').default}}}`;
           });
-          return JSON.stringify(this.asset, null, 2).replace(/"{{{|}}}"/g, "");
+          return JSON.stringify(asset, null, 2).replace(/"{{{|}}}"/g, "");
         }
       }));
     } else {

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

@@ -16,12 +16,15 @@ declare module 'hast' {
 }
 declare module 'vfile' {
     interface DataMap {
-        demos: {
+        demos: ({
             id: string;
             component: string;
             asset: IParsedBlockAsset['asset'];
             sources: IParsedBlockAsset['sources'];
-        }[];
+        } | {
+            id: string;
+            component: string;
+        })[];
         frontmatter: IRouteMeta['frontmatter'];
         toc: IRouteMeta['toc'];
         embeds?: string[];

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

@@ -150,18 +150,32 @@ 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 || {};
-              if (restAttrs.title) {
-                asset.title = String(restAttrs.title);
-              }
+              const validAssetAttrs = [
+                "title",
+                "snapshot",
+                "keywords"
+              ];
               Object.keys(restAttrs).forEach((key) => {
                 if (restAttrs[key] === "")
                   restAttrs[key] = true;
               });
               const originalProps = Object.assign({}, frontmatter, restAttrs);
-              Object.assign(previewerProps, await ((_a3 = techStack.generatePreviewerProps) == null ? void 0 : _a3.call(techStack, originalProps, {
+              validAssetAttrs.forEach((key) => {
+                if (originalProps[key])
+                  asset[key] = originalProps[key];
+              });
+              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,
@@ -188,7 +202,7 @@ function rehypeDemo(opts) {
               };
             }));
             demosPropData.push({
-              demo: { id: parseOpts.id },
+              demo: propDemo,
               previewerProps
             });
           }

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

@@ -27,6 +27,7 @@ __export(rehypeEmbed_exports, {
 });
 module.exports = __toCommonJS(rehypeEmbed_exports);
 var import_path = __toESM(require("path"));
+var import_plugin_utils = require("umi/plugin-utils");
 var import_url = __toESM(require("url"));
 var visit;
 (async () => {
@@ -40,7 +41,7 @@ function rehypeEmbed(opts) {
       if (node.tagName === EMBED_TAG && ((_a = node.properties) == null ? void 0 : _a.hasOwnProperty("src"))) {
         const { src } = node.properties;
         const parsed = import_url.default.parse((src == null ? void 0 : src.toString()) || "");
-        const absPath = import_path.default.resolve(import_path.default.parse(opts.fileAbsPath).dir, parsed.pathname);
+        const absPath = (0, import_plugin_utils.winPath)(import_path.default.resolve(import_path.default.parse(opts.fileAbsPath).dir, parsed.pathname));
         if (absPath) {
           const hash = decodeURIComponent(parsed.hash || "").replace("#", "");
           const query = new URLSearchParams();

package/dist/preset.js

@@ -39,7 +39,8 @@ var preset_default = (api) => {
       require.resolve("./features/tabs"),
       require.resolve("./features/theme"),
       require.resolve("./features/locales"),
-      require.resolve("./features/parser")
+      require.resolve("./features/parser"),
+      require.resolve("./features/assets")
     ]
   };
 };

package/dist/registerMethods.js

@@ -24,7 +24,12 @@ __export(registerMethods_exports, {
 module.exports = __toCommonJS(registerMethods_exports);
 var registerMethods_default = (api) => {
   api.describe({ key: "dumi:registerMethods" });
-  ["registerTechStack"].forEach((name) => {
+  [
+    "registerTechStack",
+    "addContentTab",
+    "modifyAssetsMetadata",
+    "modifyTheme"
+  ].forEach((name) => {
     api.registerMethod({ name });
   });
 };

package/dist/types.d.ts

@@ -1,9 +1,10 @@
 import type AtomAssetsParser from "./assetParsers/atom";
 import type { IDumiDemoProps } from "./client/theme-api/DumiDemo";
 import type { ILocalesConfig, IThemeConfig } from "./client/theme-api/types";
+import type { IContentTab } from "./features/tabs";
 import type { IThemeLoadResult } from "./features/theme/loader";
 import type { IModify } from '@umijs/core';
-import type { ExampleBlockAsset } from 'dumi-assets-types';
+import type { AssetsPackage, ExampleBlockAsset } from 'dumi-assets-types';
 import type { Element } from 'hast';
 import type { IApi as IUmiApi } from 'umi';
 declare type IUmiConfig = IUmiApi['config'];
@@ -77,5 +78,13 @@ export declare type IApi = IUmiApi & {
      * modify original theme data
      */
     modifyTheme: IModify<IThemeLoadResult, null>;
+    /**
+     * add content tab
+     */
+    addContentTab: (fn: () => IContentTab) => void;
+    /**
+     * modify assets metadata
+     */
+    modifyAssetsMetadata: IModify<AssetsPackage, null>;
 };
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dumi",
-  "version": "2.0.0-beta.5",
+  "version": "2.0.0-beta.7",
   "description": "Framework for developing UI components",
   "keywords": [],
   "license": "MIT",