dumi 2.2.7 → 2.3.0-alpha.1

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

@@ -0,0 +1,43 @@
+// This will bundle all the site demos and meta data into one file
+// which should only async load on search
+const filesMetaTabs = {
+  {{#metaFiles}}
+  {{#tabs}}
+  '{{{id}}}': {{{tabs}}},
+  {{/tabs}}
+  {{/metaFiles}}
+}
+
+// generate demos data in runtime, for reuse route.id to reduce bundle size
+export const demos = {};
+
+/** @private Internal usage. Safe to refactor. */
+export async function loadFilesMeta() {
+  const metaMap: Record<string, any> = {};
+  const idList = [
+    {{#metaFiles}}
+    '{{{id}}}',
+    {{/metaFiles}}
+  ];
+
+  {{#metaFiles}}
+  metaMap['{{{id}}}'] = import('{{{file}}}?type=meta');
+  {{/metaFiles}}
+
+  // Wait for all meta data to be loaded
+  const metaList = await Promise.all(idList.map(id => metaMap[id]));
+
+  // Merge into filesMeta
+  const filesMeta = {};
+
+  idList.forEach((id, index) => {
+    const meta = metaList[index];
+
+    filesMeta[id] = {
+      ...meta,
+      tabs: filesMetaTabs[id],
+    };
+  });
+
+  return filesMeta;
+}

package/index.d.ts

@@ -9,3 +9,6 @@ export * from './dist';
 export { defineConfig } from './dist';
 export * from './dist/client/theme-api';
 export { IApi } from './dist/types';
+export function getRouteMetaById(id: string): Promise<any>;
+/** @private Internal usage. Safe to remove */
+export function loadFilesMeta(): Promise<any>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dumi",
-  "version": "2.2.7",
+  "version": "2.3.0-alpha.1",
   "description": "📖 Documentation Generator of React Component",
   "keywords": [
     "generator",
@@ -117,6 +117,7 @@
     "rc-motion": "^2.7.3",
     "rc-tabs": "^12.10.0",
     "rc-tree": "^5.7.9",
+    "rc-util": "^5.37.0",
     "react-copy-to-clipboard": "^5.1.0",
     "react-error-boundary": "^4.0.10",
     "react-intl": "^6.4.4",

package/theme-default/locales/en-US.json

@@ -38,5 +38,6 @@
   "content.footer.actions.previous": "PREV",
   "content.footer.actions.next": "NEXT",
   "search.not.found": "No content was found",
+  "search.loading": "Loading...",
   "layout.sidebar.btn": "Sidebar"
 }

package/theme-default/locales/zh-CN.json

@@ -37,5 +37,6 @@
   "content.footer.actions.previous": "上一篇",
   "content.footer.actions.next": "下一篇",
   "search.not.found": "未找到相关内容",
+  "search.loading": "加载中...",
   "layout.sidebar.btn": "侧边菜单"
 }

package/theme-default/slots/ContentTabs/index.js

@@ -8,7 +8,6 @@ var ContentTabs = function ContentTabs(_ref) {
   var intl = useIntl();
 
   // TODO: tab.Extra & tab.Action render
-
   return Boolean(tabs === null || tabs === void 0 ? void 0 : tabs.length) ? /*#__PURE__*/React.createElement("ul", {
     className: "dumi-default-content-tabs"
   }, /*#__PURE__*/React.createElement("li", {

package/theme-default/slots/SearchBar/index.js

@@ -9,11 +9,11 @@ import { ReactComponent as IconArrowDown } from '@ant-design/icons-svg/inline-sv
 import { ReactComponent as IconArrowUp } from '@ant-design/icons-svg/inline-svg/outlined/arrow-up.svg';
 import { ReactComponent as IconSearch } from '@ant-design/icons-svg/inline-svg/outlined/search.svg';
 import { useSiteSearch } from 'dumi';
-import React, { useEffect, useRef, useState } from 'react';
 import SearchResult from 'dumi/theme/slots/SearchResult';
-import "./index.less";
+import React, { useEffect, useRef, useState } from 'react';
 import { Input } from "./Input";
 import { Mask } from "./Mask";
+import "./index.less";
 export { Input as SearchInput } from "./Input";
 export { Mask as SearchMask } from "./Mask";
 var isAppleDevice = /(mac|iphone|ipod|ipad)/i.test(typeof navigator !== 'undefined' ? (_navigator = navigator) === null || _navigator === void 0 ? void 0 : _navigator.platform : '');
@@ -100,7 +100,7 @@ var SearchBar = function SearchBar() {
     ref: inputRef
   }), /*#__PURE__*/React.createElement("span", {
     className: "dumi-default-search-shortcut"
-  }, symbol, " K"), keywords.trim() && focusing && (result.length || !loading) && !modalVisible && /*#__PURE__*/React.createElement("div", {
+  }, symbol, " K"), keywords.trim() && focusing && !modalVisible && /*#__PURE__*/React.createElement("div", {
     className: "dumi-default-search-popover"
   }, /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement(SearchResult, {
     data: result,

package/theme-default/slots/SearchResult/index.js

@@ -123,6 +123,39 @@ var SearchResult = function SearchResult(props) {
       return document.removeEventListener('keydown', handler);
     };
   });
+  var returnNode = null;
+  if (props.loading) {
+    returnNode = /*#__PURE__*/React.createElement("div", {
+      className: "dumi-default-search-empty"
+    }, /*#__PURE__*/React.createElement(IconInbox, null), /*#__PURE__*/React.createElement(FormattedMessage, {
+      id: "search.loading"
+    }));
+  } else if (props.data.length) {
+    returnNode = /*#__PURE__*/React.createElement("dl", null, data.map(function (item, i) {
+      return item.type === 'title' ? /*#__PURE__*/React.createElement("dt", {
+        key: String(i)
+      }, item.value.title) : /*#__PURE__*/React.createElement("dd", {
+        key: String(i)
+      }, /*#__PURE__*/React.createElement(Link, {
+        to: item.value.link,
+        "data-active": activeIndex === item.activeIndex || undefined,
+        onClick: function onClick() {
+          var _props$onItemSelect2;
+          return (_props$onItemSelect2 = props.onItemSelect) === null || _props$onItemSelect2 === void 0 ? void 0 : _props$onItemSelect2.call(props, item.value);
+        }
+      }, /*#__PURE__*/React.createElement(ICONS_MAPPING[item.value.type]), /*#__PURE__*/React.createElement("h4", null, /*#__PURE__*/React.createElement(Highlight, {
+        texts: item.value.highlightTitleTexts
+      })), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement(Highlight, {
+        texts: item.value.highlightTexts
+      }))));
+    }));
+  } else {
+    returnNode = /*#__PURE__*/React.createElement("div", {
+      className: "dumi-default-search-empty"
+    }, /*#__PURE__*/React.createElement(IconInbox, null), /*#__PURE__*/React.createElement(FormattedMessage, {
+      id: "search.not.found"
+    }));
+  }
   return /*#__PURE__*/React.createElement("div", {
     className: "dumi-default-search-result",
     onMouseEnter: function onMouseEnter() {
@@ -136,27 +169,6 @@ var SearchResult = function SearchResult(props) {
     onMouseUpCapture: function onMouseUpCapture() {
       document.activeElement.blur();
     }
-  }, Boolean(props.data.length || props.loading) ? /*#__PURE__*/React.createElement("dl", null, data.map(function (item, i) {
-    return item.type === 'title' ? /*#__PURE__*/React.createElement("dt", {
-      key: String(i)
-    }, item.value.title) : /*#__PURE__*/React.createElement("dd", {
-      key: String(i)
-    }, /*#__PURE__*/React.createElement(Link, {
-      to: item.value.link,
-      "data-active": activeIndex === item.activeIndex || undefined,
-      onClick: function onClick() {
-        var _props$onItemSelect2;
-        return (_props$onItemSelect2 = props.onItemSelect) === null || _props$onItemSelect2 === void 0 ? void 0 : _props$onItemSelect2.call(props, item.value);
-      }
-    }, /*#__PURE__*/React.createElement(ICONS_MAPPING[item.value.type]), /*#__PURE__*/React.createElement("h4", null, /*#__PURE__*/React.createElement(Highlight, {
-      texts: item.value.highlightTitleTexts
-    })), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement(Highlight, {
-      texts: item.value.highlightTexts
-    }))));
-  })) : /*#__PURE__*/React.createElement("div", {
-    className: "dumi-default-search-empty"
-  }, /*#__PURE__*/React.createElement(IconInbox, null), /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "search.not.found"
-  })));
+  }, returnNode);
 };
 export default SearchResult;

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

@@ -1,46 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import { SP_ROUTE_PREFIX } from "../../constants";
-import { useAppData, useSiteData } from 'dumi';
-import Container from 'dumi/theme/builtins/Container';
-import Previewer from 'dumi/theme/builtins/Previewer';
-import React, { createElement } from 'react';
-import { ErrorBoundary } from 'react-error-boundary';
-var DemoErrorBoundary = function DemoErrorBoundary(props) {
-  return /*#__PURE__*/React.createElement(ErrorBoundary, {
-    fallbackRender: function fallbackRender(_ref) {
-      var error = _ref.error;
-      return /*#__PURE__*/React.createElement(Container, {
-        type: "error"
-      }, /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("strong", null, error.message || 'This demo has been crashed.')), error.stack && /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("details", {
-        open: true
-      }, /*#__PURE__*/React.createElement("summary", null, "Error stack"), /*#__PURE__*/React.createElement("pre", null, error.stack))));
-    }
-  }, props.children);
-};
-export var DumiDemo = /*#__PURE__*/React.memo(function (props) {
-  var _useSiteData = useSiteData(),
-    demos = _useSiteData.demos,
-    historyType = _useSiteData.historyType;
-  var _useAppData = useAppData(),
-    basename = _useAppData.basename;
-  var _demos$props$demo$id = demos[props.demo.id],
-    component = _demos$props$demo$id.component,
-    asset = _demos$props$demo$id.asset;
-
-  // hide debug demo in production
-  if (process.env.NODE_ENV === 'production' && props.previewerProps.debug) return null;
-  if (props.demo.inline) {
-    return /*#__PURE__*/React.createElement(DemoErrorBoundary, null, /*#__PURE__*/createElement(component));
-  }
-  var isHashRoute = historyType === 'hash';
-  return /*#__PURE__*/React.createElement(Previewer, _extends({
-    asset: asset,
-    demoUrl:
-    // allow user override demoUrl by frontmatter
-    props.previewerProps.demoUrl || // when use hash route, browser can automatically handle relative paths starting with #
-    "".concat(isHashRoute ? "#" : '').concat(basename).concat(SP_ROUTE_PREFIX, "demos/").concat(props.demo.id)
-  }, props.previewerProps), props.previewerProps.iframe ? null : /*#__PURE__*/React.createElement(DemoErrorBoundary, null, /*#__PURE__*/createElement(component)));
-}, function (prev, next) {
-  // compare length for performance
-  return JSON.stringify(prev).length === JSON.stringify(next).length;
-});

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

@@ -1,16 +0,0 @@
-import { createContext, useContext } from 'react';
-export var SiteContext = /*#__PURE__*/createContext({
-  pkg: {},
-  historyType: 'browser',
-  entryExports: {},
-  demos: {},
-  components: {},
-  locales: [],
-  themeConfig: {},
-  loading: false,
-  setLoading: function setLoading() {},
-  _2_level_nav_available: true
-});
-export var useSiteData = function useSiteData() {
-  return useContext(SiteContext);
-};