dumi 2.3.0-beta.8 → 2.3.0-rc.0

package/dist/assetParsers/block.d.ts

@@ -15,6 +15,7 @@ export interface IParsedBlockAsset {
 }
 declare function parseBlockAsset(opts: {
     fileAbsPath: string;
+    fileLocale?: string;
     id: string;
     refAtomIds: string[];
     entryPointCode?: string;

package/dist/assetParsers/block.js

@@ -136,12 +136,16 @@ async function parseBlockAsset(opts) {
                 asset.entry = filename;
                 if (frontmatter) {
                   file.value = code;
-                  result.frontmatter = frontmatter;
+                  asset.dependencies[filename].value = code;
                   ["description", "title", "snapshot", "keywords"].forEach(
                     (key) => {
                       asset[key] = frontmatter == null ? void 0 : frontmatter[key];
                     }
                   );
+                  ["description", "title"].forEach((key) => {
+                    frontmatter[key] || (frontmatter[key] = frontmatter[`${key}.${opts.fileLocale}`]);
+                  });
+                  result.frontmatter = frontmatter;
                 }
               }
               if (!isEntryPoint || !opts.entryPointCode) {

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

@@ -49,6 +49,10 @@ export interface IPreviewerProps {
      * react node of current demo
      */
     children: ReactNode;
+    /**
+     * private field, do not use it in your code
+     */
+    _live_in_iframe: boolean;
     [key: string]: any;
 }
 export interface IRouteMeta {
@@ -208,6 +212,7 @@ export interface IThemeConfig {
         [key in SocialTypes]?: string;
     };
     editLink?: boolean | string;
+    sourceLink?: boolean | string;
     lastUpdated?: boolean;
     [key: string]: any;
 }

package/dist/features/locales.js

@@ -151,6 +151,10 @@ const LocalesContainer: FC<{ children: ReactNode }> = (props) => {
         api.config.themeConfig.editLink
       )};
 
+    localeMessages['$internal.api.sourceLink'] = ${JSON.stringify(
+        api.config.themeConfig.sourceLink
+      )};
+
     return createIntl({ locale, messages: localeMessages }, cache);
   }, []);
   const [intl, setIntl] = useState(() => getIntl());

package/dist/features/theme/index.js

@@ -161,7 +161,7 @@ var theme_default = (api) => {
     return memo;
   });
   api.modifyConfig((memo) => {
-    var _a, _b;
+    var _a, _b, _c;
     if (localThemeData) {
       themeMapKeys.forEach((key) => {
         Object.values(localThemeData[key] || {}).forEach((item) => {
@@ -180,7 +180,9 @@ var theme_default = (api) => {
       import_path.default.resolve(__dirname, "../../client/theme-api")
     );
     const repoUrl = ((_a = api.pkg.repository) == null ? void 0 : _a.url) || api.pkg.repository;
-    if (((_b = memo.themeConfig) == null ? void 0 : _b.editLink) !== false && typeof repoUrl === "string") {
+    const autoEditLink = (((_b = memo.themeConfig) == null ? void 0 : _b.editLink) ?? true) === true;
+    const autoSourceLink = (((_c = memo.themeConfig) == null ? void 0 : _c.sourceLink) ?? true) === true;
+    if ((autoEditLink || autoSourceLink) && typeof repoUrl === "string") {
       const hostedGitIns = import_hosted_git_info.default.fromUrl(repoUrl);
       let branch = "";
       try {
@@ -192,10 +194,24 @@ var theme_default = (api) => {
       }
       if (hostedGitIns) {
         memo.themeConfig ?? (memo.themeConfig = {});
-        memo.themeConfig.editLink = `${hostedGitIns.edit(
-          `${api.pkg.repository.directory || ""}/{filename}`,
-          { committish: branch }
-        )}`;
+        const directory = api.pkg.repository.directory || "";
+        if (autoSourceLink) {
+          let anchorPrefix = "L";
+          if (hostedGitIns.type.includes("bitbucket")) {
+            anchorPrefix = "lines-";
+          }
+          const sourceLinkTemplate = hostedGitIns.browse(
+            `${directory}/{fileName}#${anchorPrefix}{line}`,
+            { committish: branch }
+          );
+          memo.themeConfig.sourceLink = sourceLinkTemplate;
+        }
+        if (autoEditLink) {
+          memo.themeConfig.editLink = `${hostedGitIns.edit(
+            `${directory}/{filename}`,
+            { committish: branch }
+          )}`;
+        }
       }
     }
     return memo;

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

@@ -1,6 +1,7 @@
 import type { IParsedBlockAsset } from "../../../assetParsers/block";
 import type { ILocalesConfig, IRouteMeta } from "../../../client/theme-api/types";
 import type { IApi, IDumiConfig, IDumiTechStack } from "../../../types";
+import { type ResolveOptions } from 'enhanced-resolve';
 import type { IRoute } from 'umi';
 import type { Data } from 'vfile';
 declare module 'hast' {
@@ -45,7 +46,7 @@ declare module 'vfile' {
 export interface IMdTransformerOptions {
     cwd: string;
     fileAbsPath: string;
-    alias: object;
+    alias: ResolveOptions['alias'];
     parentAbsPath?: string;
     techStacks: IDumiTechStack[];
     resolve: IDumiConfig['resolve'];

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

@@ -5,6 +5,7 @@ import type { IMdTransformerOptions } from '.';
 export declare const DEMO_PROP_VALUE_KEY = "$demo-prop-value-key";
 export declare const DUMI_DEMO_TAG = "DumiDemo";
 export declare const DUMI_DEMO_GRID_TAG = "DumiDemoGrid";
+export declare const SKIP_DEMO_PARSE = "pure";
 type IRehypeDemoOptions = Pick<IMdTransformerOptions, 'techStacks' | 'cwd' | 'fileAbsPath' | 'resolve'> & {
     resolver: typeof sync;
     fileLocaleLessPath: string;

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

@@ -32,6 +32,7 @@ __export(rehypeDemo_exports, {
   DEMO_PROP_VALUE_KEY: () => DEMO_PROP_VALUE_KEY,
   DUMI_DEMO_GRID_TAG: () => DUMI_DEMO_GRID_TAG,
   DUMI_DEMO_TAG: () => DUMI_DEMO_TAG,
+  SKIP_DEMO_PARSE: () => SKIP_DEMO_PARSE,
   default: () => rehypeDemo
 });
 module.exports = __toCommonJS(rehypeDemo_exports);
@@ -48,6 +49,16 @@ var DEMO_NODE_CONTAINER = "$demo-container";
 var DEMO_PROP_VALUE_KEY = "$demo-prop-value-key";
 var DUMI_DEMO_TAG = "DumiDemo";
 var DUMI_DEMO_GRID_TAG = "DumiDemoGrid";
+var SKIP_DEMO_PARSE = "pure";
+var ALWAYS_DEMO_PARSE = "demo";
+var skipDemoRE = new RegExp(
+  /** 注意前面有空格 ==> */
+  ` ${SKIP_DEMO_PARSE}`
+);
+var alwaysDemoRE = new RegExp(
+  /** 注意前面有空格 ==> */
+  ` ${ALWAYS_DEMO_PARSE}`
+);
 (async () => {
   ({ visit, SKIP, EXIT } = await import("unist-util-visit"));
   ({ toString } = await import("hast-util-to-string"));
@@ -62,14 +73,18 @@ function getCodeLang(node, opts) {
       node.properties.src
     );
     lang = import_path.default.extname(node.properties.src).slice(1);
-  } else if (Array.isArray((_b = node.properties) == null ? void 0 : _b.className) && (opts.resolve.codeBlockMode === "passive" ? (
-    // passive mode
-    / demo/.test(String((_c = node.data) == null ? void 0 : _c.meta))
-  ) : (
+  } else if ([
+    // 插件开发者可配置 [SKIP_DEMO_PARSE_SIGN] 表示不解析 demo (优先级最高)
+    !Object.prototype.hasOwnProperty.call(node.data ?? {}, SKIP_DEMO_PARSE),
+    Array.isArray((_b = node.properties) == null ? void 0 : _b.className),
+    // 根据用户配置判断 pure 或者 demo
+    opts.resolve.codeBlockMode === "passive" ? alwaysDemoRE.test(String((_c = node.data) == null ? void 0 : _c.meta)) : !skipDemoRE.test(String((_d = node.data) == null ? void 0 : _d.meta))
     // active mode (default)
-    !/ pure/.test(String((_d = node.data) == null ? void 0 : _d.meta))
-  ))) {
-    lang = String(node.properties.className[0]).replace("language-", "");
+  ].every(Boolean)) {
+    lang = String(node.properties.className[0]).replace(
+      "language-",
+      ""
+    );
   }
   return lang;
 }
@@ -181,6 +196,7 @@ function rehypeDemo(opts) {
               refAtomIds: vFile.data.frontmatter.atomId ? [vFile.data.frontmatter.atomId] : [],
               fileAbsPath: "",
               lang: codeNode.data.lang,
+              fileLocale: opts.fileLocale,
               entryPointCode: codeType === "external" ? void 0 : codeValue,
               resolver: opts.resolver,
               techStack
@@ -364,5 +380,6 @@ function rehypeDemo(opts) {
 0 && (module.exports = {
   DEMO_PROP_VALUE_KEY,
   DUMI_DEMO_GRID_TAG,
-  DUMI_DEMO_TAG
+  DUMI_DEMO_TAG,
+  SKIP_DEMO_PARSE
 });

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

@@ -40,10 +40,17 @@ var toString;
   ({ isElement } = await import("hast-util-is-element"));
   ({ toString } = await import("hast-util-to-string"));
 })();
+var rawMetaRE = /\[(.+)\]/;
+function rehypeCodeMeta(meta) {
+  if (typeof meta !== "string")
+    return {};
+  const [title] = (rawMetaRE.exec(meta.trim()) || []).slice(1);
+  return { title };
+}
 function rehypeEnhancedTag() {
   return async (tree) => {
     visit(tree, "element", (node, i, parent) => {
-      var _a, _b, _c, _d;
+      var _a, _b, _c, _d, _e;
       if (node.tagName === "pre" && isElement((_a = node.children) == null ? void 0 : _a[0]) && node.children[0].tagName === "code") {
         const className = ((_b = node.children[0].properties) == null ? void 0 : _b.className) || [];
         const lang = (_c = className.join("").match(/language-(\w+)(?:$| )/)) == null ? void 0 : _c[1];
@@ -51,7 +58,10 @@ function rehypeEnhancedTag() {
         parent.children.splice(i, 1, {
           type: "element",
           tagName: "SourceCode",
-          properties: { lang },
+          properties: {
+            ...rehypeCodeMeta((_e = node.children[0].data) == null ? void 0 : _e.meta),
+            lang
+          },
           data: node.children[0].data,
           JSXAttributes: [
             {

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

@@ -32,12 +32,19 @@ __export(remarkContainer_exports, {
   default: () => remarkContainer
 });
 module.exports = __toCommonJS(remarkContainer_exports);
+var import_rehypeDemo = require("./rehypeDemo");
 var visit;
 var SKIP;
+var CONTINUE;
 var VALID_CONTAINER_TYPES = ["info", "warning", "success", "error"];
+var CODE_GROUP_SPECIFIER = "code-group";
 (async () => {
-  ({ visit, SKIP } = await import("unist-util-visit"));
+  ({ visit, SKIP, CONTINUE } = await import("unist-util-visit"));
 })();
+var transformAttributes = (attributes) => Object.entries(attributes ?? {}).reduce(
+  (ret, [name, value]) => `${ret} ${value ? `${name}="${value}"` : name}`,
+  ""
+);
 function remarkContainer() {
   const data = this.data();
   const micromarkExtensions = data.micromarkExtensions.find(
@@ -47,11 +54,10 @@ function remarkContainer() {
   micromarkExtensions.flow["58"].splice(1, 1);
   return (tree) => {
     visit(tree, (node, i, parent) => {
-      if (node.type === "containerDirective" && VALID_CONTAINER_TYPES.includes(node.name)) {
-        const attrs = Object.entries(node.attributes || {}).reduce(
-          (ret, [name, value]) => `${ret} ${value ? `${name}="${value}"` : name}`,
-          ""
-        );
+      if (node.type !== "containerDirective")
+        return CONTINUE;
+      if (VALID_CONTAINER_TYPES.includes(node.name)) {
+        const attrs = transformAttributes(node.attributes);
         parent.children.splice(
           i,
           1,
@@ -67,6 +73,31 @@ function remarkContainer() {
         );
         return SKIP;
       }
+      if (node.name === CODE_GROUP_SPECIFIER) {
+        const codeChildren = node.children.filter(({ type }) => type === "code").map((child) => ({
+          ...child,
+          data: {
+            ...child.data,
+            //  dumi 默认会编译有关联技术栈的代码块, 标记为不需要编译
+            [import_rehypeDemo.SKIP_DEMO_PARSE]: true
+          }
+        }));
+        parent.children.splice(
+          i,
+          1,
+          {
+            type: "html",
+            value: `<CodeGroup>`,
+            position: node.position
+          },
+          ...codeChildren,
+          {
+            type: "html",
+            value: "</CodeGroup>"
+          }
+        );
+        return SKIP;
+      }
     });
   };
 }

package/dist/techStacks/utils.d.ts

@@ -1,4 +1,5 @@
 import type { ParserConfig } from '@swc/core';
+import { IDumiTechStack } from '../types';
 export { IDumiTechStack, IDumiTechStackOnBlockLoadArgs, IDumiTechStackOnBlockLoadResult, IDumiTechStackRuntimeOpts, } from '../types';
 /**
  * for frameworks like vue , we need to extract the JS fragments in their scripts
@@ -16,3 +17,24 @@ export interface IWrapDemoWithFnOptions {
  * https://github.com/umijs/dumi/blob/master/crates/swc_plugin_react_demo/src/lib.rs#L126
  */
 export declare function wrapDemoWithFn(code: string, opts: IWrapDemoWithFnOptions): string;
+export type IDefineTechStackOptions = IDumiTechStack;
+/**
+ * Define a tech stack
+ * @param options techstack options
+ * @returns function that returns {@link IDumiTechStack}, can be used to register a techstack
+ *
+ * @example
+ * const ReactTechStack = defineTechStack({
+ *   name: 'jsx',
+ *   isSupported(_, lang) {
+ *     return ['jsx', 'tsx'].includes(lang);
+ *   },
+ *   transformCode() {
+ *     // ...
+ *     return '';
+ *   },
+ * });
+ *
+ * api.registerTechStack(() => ReactTechStack);
+ */
+export declare function defineTechStack(options: IDefineTechStackOptions): IDumiTechStack;

package/dist/techStacks/utils.js

@@ -33,6 +33,7 @@ __export(utils_exports, {
   IDumiTechStackOnBlockLoadArgs: () => import_types.IDumiTechStackOnBlockLoadArgs,
   IDumiTechStackOnBlockLoadResult: () => import_types.IDumiTechStackOnBlockLoadResult,
   IDumiTechStackRuntimeOpts: () => import_types.IDumiTechStackRuntimeOpts,
+  defineTechStack: () => defineTechStack,
   extractScript: () => extractScript,
   wrapDemoWithFn: () => wrapDemoWithFn
 });
@@ -74,12 +75,16 @@ function wrapDemoWithFn(code, opts) {
   ${result.code}
 }`;
 }
+function defineTechStack(options) {
+  return options;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   IDumiTechStack,
   IDumiTechStackOnBlockLoadArgs,
   IDumiTechStackOnBlockLoadResult,
   IDumiTechStackRuntimeOpts,
+  defineTechStack,
   extractScript,
   wrapDemoWithFn
 });

package/dist/types.d.ts

@@ -82,7 +82,9 @@ export declare abstract class IDumiTechStack {
      */
     abstract runtimeOpts?: IDumiTechStackRuntimeOpts;
     /**
-     * transform code
+     * Is the lang supported by the current tech stack?
+     * @param lang
+     * @param node hast Element https://github.com/syntax-tree/hast?tab=readme-ov-file#element
      */
     abstract isSupported(node: Element, lang: string): boolean;
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dumi",
-  "version": "2.3.0-beta.8",
+  "version": "2.3.0-rc.0",
   "description": "📖 Documentation Generator of React Component",
   "keywords": [
     "generator",
@@ -36,25 +36,6 @@
     "tech-stack-utils.js",
     "tech-stack-utils.d.ts"
   ],
-  "scripts": {
-    "build": "father build && npm run build:crates",
-    "build:crates": "cargo build --target wasm32-wasi -r --out-dir compiled/crates -Z unstable-options",
-    "build:deps": "node scripts/pre-bundle-worker.js && father prebundle",
-    "build:suites": "pnpm run --filter=\"./suites/**\" build",
-    "dev": "father dev",
-    "docs:build": "node ./bin/dumi.js build",
-    "docs:dev": "node ./bin/dumi.js dev",
-    "docs:sync": "node ./scripts/sync-from-umi.js",
-    "format": "prettier --cache --write .",
-    "lint": "npm run lint:es && npm run lint:css",
-    "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
-    "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
-    "prepare": "husky install && npm run build && npm run build:suites && node ./bin/dumi.js setup && npm run docs:sync",
-    "prepublishOnly": "npm run build",
-    "test": "vitest",
-    "vercel:build": "npm run docs:build",
-    "vercel:install": "./scripts/vercel-install.sh"
-  },
   "commitlint": {
     "extends": [
       "@commitlint/config-conventional"
@@ -120,8 +101,9 @@
     "raw-loader": "^4.0.2",
     "rc-motion": "^2.7.3",
     "rc-tabs": "^12.10.0",
+    "rc-tooltip": "^6.1.3",
     "rc-tree": "^5.7.9",
-    "rc-util": "^5.37.0",
+    "rc-util": "^5.38.0",
     "react-copy-to-clipboard": "^5.1.0",
     "react-error-boundary": "^4.0.10",
     "react-intl": "^6.4.4",
@@ -163,10 +145,11 @@
     "@umijs/lint": "^4.0.84",
     "@umijs/plugins": "4.0.32",
     "codesandbox-import-utils": "^2.2.3",
-    "dumi-theme-mobile": "workspace:*",
     "eslint": "^8.46.0",
+    "esno": "^4.7.0",
     "fast-glob": "^3.3.1",
     "father": "^4.3.0",
+    "git-repo-info": "^2.1.1",
     "highlight-words-core": "^1.2.2",
     "husky": "^8.0.3",
     "lint-staged": "^13.2.3",
@@ -178,7 +161,9 @@
     "stylelint": "^15.10.2",
     "ts-node": "^10.9.1",
     "typescript": "~5.0.4",
-    "vitest": "^0.33.0"
+    "vitest": "^0.33.0",
+    "zx": "^7.2.3",
+    "dumi-theme-mobile": "2.3.0-rc.0"
   },
   "peerDependencies": {
     "react": ">=16.8",
@@ -190,5 +175,23 @@
   },
   "authors": [
     "Peach <scdzwyxst@gmail.com>"
-  ]
-}
+  ],
+  "scripts": {
+    "build": "father build && npm run build:crates",
+    "build:crates": "cargo build --target wasm32-wasi -r --out-dir compiled/crates -Z unstable-options",
+    "build:deps": "node scripts/pre-bundle-worker.js && father prebundle",
+    "build:suites": "pnpm run --filter=\"./suites/**\" build",
+    "dev": "father dev",
+    "docs:build": "node ./bin/dumi.js build",
+    "docs:dev": "node ./bin/dumi.js dev",
+    "docs:sync": "node ./scripts/sync-from-umi.js",
+    "format": "prettier --cache --write .",
+    "lint": "npm run lint:es && npm run lint:css",
+    "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
+    "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
+    "release": "esno scripts/release.ts",
+    "test": "vitest",
+    "vercel:build": "npm run docs:build",
+    "vercel:install": "./scripts/vercel-install.sh"
+  }
+}

package/tech-stack-utils.d.ts

@@ -1,10 +1,12 @@
 import type * as BabelCore from '@umijs/bundler-utils/compiled/@babel/core';
 export {
-  IBaseApiParserOptions,
   ILanguageMetaParser,
   IPatchFile,
 } from './dist/assetParsers/BaseParser';
-export { createApiParser } from './dist/assetParsers/utils';
+export {
+  IBaseApiParserOptions,
+  createApiParser,
+} from './dist/assetParsers/utils';
 export * from './dist/techStacks/utils';
 export { BabelCore };
 export const babelCore: () => typeof import('@umijs/bundler-utils/compiled/@babel/core');

package/theme-default/builtins/API/index.d.ts

@@ -1,6 +1,7 @@
 import { type FC } from 'react';
+import './index.less';
 declare const API: FC<{
     id?: string;
-    type?: 'props' | 'events' | 'slots' | 'methods';
+    type?: 'props' | 'events' | 'slots' | 'imperative';
 }>;
 export default API;