@antv/dumi-theme-antv 0.3.0-beta.1 → 0.3.0-beta.11

package/dist/slots/ExampleSider/index.d.ts

@@ -1,52 +1,18 @@
 import React from 'react';
-export interface PlayGroundItemProps {
-    source: string;
-    examples: PlayGroundItemProps[];
-    babeledSource: string;
-    absolutePath?: string;
-    relativePath?: string;
-    screenshot?: string;
-    recommended?: boolean;
-    filename: string;
-    title?: string;
-    location?: Location;
-    playground?: {
-        container?: string;
-        playgroundDidMount?: string;
-        playgroundWillUnmount?: string;
-        dependencies?: {
-            [key: string]: string;
-        };
-        devDependencies?: {
-            [key: string]: string;
-        };
-        htmlCodeTemplate?: string;
-    };
-}
-export interface TreeItem {
-    title?: string;
-    value?: string;
-    key?: string;
-    children?: any;
-    icon?: string;
-    relativePath?: string;
-    filename?: string;
-    screenshot?: string;
-    node?: any;
-}
+import { Demo, ExampleTopic } from '../../types';
 export interface ExampleSiderProps {
     /**
      * 当前 Example (受控)
      */
-    currentDemo: ExamplesPage.Demo;
+    currentDemo: Demo;
     /**
      * 当选中的 Demo 被改变时做些什么
      */
-    onDemoClicked: (demo: ExamplesPage.Demo) => void;
+    onDemoClicked: (demo: Demo) => void;
     /**
      * 所有的案例主题
      */
-    exampleTopics: ExamplesPage.ExampleTopic[];
+    exampleTopics: ExampleTopic[];
     showExampleDemoTitle: boolean;
 }
 /**

package/dist/slots/ExampleSider/index.js

@@ -4,14 +4,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -24,15 +16,15 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import { Input, Menu, Tooltip } from 'antd';
 import React, { useEffect, useRef, useState } from 'react';
+import { Input, Menu, Tooltip } from 'antd';
 import { useLocale } from 'dumi';
 import { createFromIconfontCN, SearchOutlined, VerticalAlignTopOutlined } from '@ant-design/icons';
 import classNames from 'classnames';
-import { reduce, size } from 'lodash-es';
 import { useT } from "../hooks";
-import styles from "./index.module.less";
-// menu icon
+import { filterTreeNode } from "../utils";
+import styles from "./index.module.less"; // menu icon
+
 var MenuIcon = createFromIconfontCN({
   scriptUrl: '//at.alicdn.com/t/font_470089_1lnym745udm.js' // generated by iconfont.cn
 
@@ -64,37 +56,23 @@ export var ExampleSider = function ExampleSider(props) {
       searchValue = _useState6[0],
       setSearchValue = _useState6[1];
 
-  var locale = useLocale(); // 查找符合条件的数据 从title和 searchValue 可以匹配 就返回 否自返回[]
-
-  var findSearchTreeData = function findSearchTreeData(data) {
-    return reduce(data, function (value, item) {
-      var _item$title;
-
-      if ((_item$title = item.title) !== null && _item$title !== void 0 && _item$title.match(searchValue)) {
-        return [].concat(_toConsumableArray(value), [item]);
-      }
-
-      if (item.children) {
-        var searchData = findSearchTreeData(item.children);
-        return size(searchData) ? [].concat(_toConsumableArray(value), [_objectSpread(_objectSpread({}, item), {}, {
-          children: searchData
-        })]) : value;
-      }
-
-      return value;
-    }, []);
-  }; // 获取默认展开的keys数组 传入treeData 和 底层的 key  返回符合条件的 keys
-
-
-  var getDefaultOpenKeys = function getDefaultOpenKeys(data, key) {
-    return reduce(data, function (value, item) {
-      if (item.children) {
-        var keys = getDefaultOpenKeys(item.children, key);
-        return keys.length ? [].concat(_toConsumableArray(value), [item.value], _toConsumableArray(keys)) : value;
-      }
+  var locale = useLocale();
+
+  var getCurrentTopics = function getCurrentTopics() {
+    if (searchValue) {
+      var res = filterTreeNode({
+        id: 'FAKE_ID',
+        childrenKey: 'exampleTopics',
+        title: {
+          'zh': 'FAKE_TITLE',
+          'en': 'FAKE_TITLE'
+        },
+        exampleTopics: exampleTopics
+      }, searchValue, locale.id);
+      return (res === null || res === void 0 ? void 0 : res.exampleTopics) || [];
+    }
 
-      return key === item.value ? [item.value] : value;
-    }, []);
+    return exampleTopics;
   }; // 初始化菜单栏展开keys
 
 
@@ -142,7 +120,7 @@ export var ExampleSider = function ExampleSider(props) {
   };
 
   var renderSubMenu = function renderSubMenu() {
-    return exampleTopics.map(function (topic) {
+    return getCurrentTopics().map(function (topic) {
       return /*#__PURE__*/React.createElement(Menu.SubMenu, {
         key: "TOPIC-".concat(topic.id),
         title: /*#__PURE__*/React.createElement("div", null, topic.icon && /*#__PURE__*/React.createElement(MenuIcon, {
@@ -208,7 +186,7 @@ export var ExampleSider = function ExampleSider(props) {
     style: {
       width: '100%'
     },
-    className: styles.siderbarMenu,
+    className: styles.sideBarMenu,
     openKeys: openKeys,
     selectedKeys: ["DEMO-".concat(currentDemo.id)],
     onOpenChange: function onOpenChange(keys) {

package/dist/slots/ExampleSider/index.module.less

@@ -122,7 +122,7 @@
   font-weight: 500;
 }
 
-.siderbarMenu {
+.sideBarMenu {
   border: none;
 
   .menuTitleContent {

package/dist/slots/Features/FeatureCard.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { IC } from '../../types';
 interface FeatureProps {
     icon: string;
     title: IC;

package/dist/slots/Features/index.js

@@ -3,6 +3,7 @@ import { Row, Col } from 'antd';
 import cx from 'classnames';
 import FeatureCard from "./FeatureCard";
 import styles from "./index.module.less";
+import { ic } from "../hooks";
 export var Features = function Features(_ref) {
   var title = _ref.title,
       _ref$features = _ref.features,
@@ -15,7 +16,7 @@ export var Features = function Features(_ref) {
     var children = features.map(function (card) {
       return /*#__PURE__*/React.createElement(Col, {
         className: styles.cardWrapper,
-        key: card.title,
+        key: ic(card.title),
         md: 8,
         xs: 24
       }, /*#__PURE__*/React.createElement(FeatureCard, card));

package/dist/slots/Footer/index.js

@@ -1,4 +1,4 @@
-var _excluded = ["columns", "bottom", "theme", "language", "isDynamicFooter", "rootDomain"];
+var _excluded = ["columns", "bottom", "theme", "language", "isDynamicFooter", "rootDomain", "className"];
 
 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); }
 
@@ -31,6 +31,7 @@ export var Footer = function Footer(props) {
       isDynamicFooter = props.isDynamicFooter,
       _props$rootDomain = props.rootDomain,
       rootDomain = _props$rootDomain === void 0 ? '' : _props$rootDomain,
+      className = props.className,
       restProps = _objectWithoutProperties(props, _excluded);
 
   var locale = useLocale();
@@ -163,7 +164,7 @@ export var Footer = function Footer(props) {
     maxColumnsPerRow: 5,
     theme: theme,
     columns: columns || getColumns(),
-    className: classnames(styles.footer, _defineProperty({}, styles.withMenu, isDynamicFooter)),
+    className: classnames(styles.footer, className, _defineProperty({}, styles.withMenu, isDynamicFooter)),
     bottom: bottom || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
       className: styles.bottom
     }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("a", {

package/dist/slots/Header/Navs.d.ts

@@ -1,11 +1,19 @@
 import React from 'react';
+declare type dropdownItem = {
+    name: {
+        [key: string]: string;
+    };
+    url: string;
+};
 export declare type INav = {
-    slug: string;
+    slug?: string;
     order: number;
     title: {
         [key: string]: string;
     };
     target?: '_blank';
+    notPage?: boolean;
+    dropdownItems?: dropdownItem[];
 };
 export declare type NavProps = {
     navs: INav[];
@@ -15,3 +23,4 @@ export declare type NavProps = {
  * Header 中的导航菜单
  */
 export declare const Navs: React.FC<NavProps>;
+export {};

package/dist/slots/Header/Navs.js

@@ -2,43 +2,60 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 import React from 'react';
 import cx from 'classnames';
-import { isEqual } from 'lodash-es';
-import { LinkOutlined } from '@ant-design/icons';
+import { isEqual, size } from 'lodash-es';
 import { Link, useLocale } from 'dumi';
+import { Dropdown, Menu } from 'antd';
+import { DownOutlined, LinkOutlined } from '@ant-design/icons';
 import styles from "./index.module.less";
 
-var getDocument = function getDocument(navs) {
-  var slug = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-  return navs.find(function (doc) {
-    return doc.slug === slug;
-  }) || {
-    title: {}
-  };
-};
 /**
  * Header 中的导航菜单
  */
-
-
 export var Navs = function Navs(_ref) {
   var navs = _ref.navs,
       path = _ref.path;
   var locale = useLocale();
   return /*#__PURE__*/React.createElement(React.Fragment, null, navs.map(function (nav) {
-    var href = nav.slug.startsWith('http') ? nav.slug : "/".concat(nav.slug);
-    var title = getDocument(navs, nav.slug).title[locale.id];
+    var title = nav.title[locale.id];
+    var href = '';
+    var className = '';
+
+    if (nav.slug) {
+      href = nav.slug.startsWith('http') ? nav.slug : "/".concat(nav.slug);
+
+      if (locale.id == 'en' && !href.startsWith('http')) {
+        href = "/en".concat(href);
+      } // 去除 docs  防止二次点击相同nav跳转出现04
 
-    if (window.location.pathname.includes('en')) {
-      href = "/en".concat(href);
+
+      href = href.replace('/docs/', '/');
+      className = cx('header-menu-item-active', _defineProperty({}, styles.activeItem, path.startsWith(href) || isEqual(path.split('/').slice(0, 4), href.split('/').slice(0, 4))));
     }
 
-    var className = cx('header-menu-item-active', _defineProperty({}, styles.activeItem, path.startsWith(href) || isEqual(path.split('/').slice(0, 4), href.split('/').slice(0, 4))));
-    return /*#__PURE__*/React.createElement("li", {
+    return size(nav.dropdownItems) ? /*#__PURE__*/React.createElement("li", {
+      key: title,
+      className: className
+    }, /*#__PURE__*/React.createElement(Dropdown, {
+      className: styles.ecoSystems,
+      placement: "bottom",
+      overlay: /*#__PURE__*/React.createElement(Menu, null, nav.dropdownItems.map(function (_ref2) {
+        var name = _ref2.name,
+            url = _ref2.url;
+        return /*#__PURE__*/React.createElement(Menu.Item, {
+          key: url
+        }, /*#__PURE__*/React.createElement("a", {
+          target: "_blank",
+          rel: "noreferrer",
+          href: url
+        }, name[locale.id], " ", /*#__PURE__*/React.createElement(LinkOutlined, null)));
+      }))
+    }, /*#__PURE__*/React.createElement("span", null, title, /*#__PURE__*/React.createElement(DownOutlined, null)))) : /*#__PURE__*/React.createElement("li", {
       key: title,
       className: className
     }, nav.target === '_blank' || href.startsWith('http') ? /*#__PURE__*/React.createElement("a", {
       href: href,
-      target: "_blank"
+      target: "_blank",
+      rel: "noreferrer"
     }, title, /*#__PURE__*/React.createElement(LinkOutlined, null)) : /*#__PURE__*/React.createElement(Link, {
       to: href
     }, title));

package/dist/slots/Header/index.js

@@ -22,7 +22,7 @@ import { useMedia } from 'react-use';
 import { useNavigate } from "react-router-dom";
 import cx from 'classnames';
 import { useSiteData, useLocale } from 'dumi';
-import { GithubOutlined, MenuOutlined, CaretDownFilled, DownOutlined, WechatOutlined, LikeOutlined, CheckOutlined } from '@ant-design/icons';
+import { GithubOutlined, MenuOutlined, CaretDownFilled, DownOutlined, WechatOutlined, LinkOutlined, CheckOutlined } from '@ant-design/icons';
 import { Popover, Menu, Dropdown, Select } from 'antd';
 import { map, size } from 'lodash-es';
 import { Search } from "./Search";
@@ -173,12 +173,12 @@ var HeaderComponent = function HeaderComponent(_ref) {
     className: cx(styles.menu, (_cx = {}, _defineProperty(_cx, styles.popup, !isWide), _defineProperty(_cx, styles.popupHidden, !popupMenuVisible), _cx))
   },
   /** 最左侧的菜单，一般是 教程、API、示例，或者其他自定义，有配置文件中的 `navs` 决定 */
-  size(navs) && /*#__PURE__*/React.createElement(Navs, {
+  size(navs) ? /*#__PURE__*/React.createElement(Navs, {
     navs: navs,
     path: window.location.pathname
-  }),
+  }) : null,
   /** 生态产品 */
-  size(ecosystems) && /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Dropdown, {
+  size(ecosystems) ? /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Dropdown, {
     className: styles.ecoSystems,
     overlay: /*#__PURE__*/React.createElement(Menu, null, map(ecosystems, function (_ref2) {
       var url = _ref2.url,
@@ -189,13 +189,13 @@ var HeaderComponent = function HeaderComponent(_ref) {
         target: "_blank",
         rel: "noreferrer",
         href: url
-      }, ecosystemName === null || ecosystemName === void 0 ? void 0 : ecosystemName[lang], " ", /*#__PURE__*/React.createElement(LikeOutlined, null)));
+      }, ecosystemName === null || ecosystemName === void 0 ? void 0 : ecosystemName[lang], " ", /*#__PURE__*/React.createElement(LinkOutlined, null)));
     }))
   }, /*#__PURE__*/React.createElement("span", null, useT('周边生态'), /*#__PURE__*/React.createElement(DownOutlined, {
     style: {
       marginLeft: '6px'
     }
-  })))),
+  })))) : null,
   /** 产品列表 */
   showAntVProductsCard && /*#__PURE__*/React.createElement("li", productItemProps, /*#__PURE__*/React.createElement("a", null, useT('所有产品'), !isAntVHome ? /*#__PURE__*/React.createElement("img", {
     src: "https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png",
@@ -312,7 +312,8 @@ var HeaderComponent = function HeaderComponent(_ref) {
     className: styles.githubCorner
   }, /*#__PURE__*/React.createElement("a", {
     href: githubUrl,
-    target: "_blank"
+    target: "_blank",
+    rel: "noreferrer"
   }, /*#__PURE__*/React.createElement(GithubOutlined, null))));
   return /*#__PURE__*/React.createElement("header", {
     className: cx(styles.header, (_cx4 = {}, _defineProperty(_cx4, styles.transparent, !!transparent && !productMenuVisible), _defineProperty(_cx4, styles.isHomePage, !!isHomePage && !isAntVHome), _defineProperty(_cx4, styles.lightTheme, !!isAntVHome && !productMenuVisible && isWide), _defineProperty(_cx4, styles.fixed, popupMenuVisible), _cx4))

package/dist/slots/Loading/index.d.ts

@@ -1,2 +1,7 @@
 import React from 'react';
-export declare const Loading: React.FC;
+/**
+ * Loading
+ */
+declare const Loading: React.FC;
+declare const PageLoading: React.FC;
+export { Loading, PageLoading };

package/dist/slots/Loading/index.js

@@ -1,17 +1,21 @@
 import React from 'react';
-export var Loading = function Loading() {
+import styles from "./index.module.less";
+/**
+ * Loading
+ */
+
+var Loading = function Loading() {
   return /*#__PURE__*/React.createElement("div", {
-    style: {
-      height: '100vh'
-    }
-  }, /*#__PURE__*/React.createElement("div", {
     style: {
       position: 'relative',
-      height: '100%'
+      height: '100%',
+      width: '100%'
     }
   }, /*#__PURE__*/React.createElement("div", {
-    className: "code-loading"
-  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+    className: styles.loading
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "container"
+  }, /*#__PURE__*/React.createElement("div", {
     className: "loader"
   }, /*#__PURE__*/React.createElement("svg", {
     viewBox: "0 0 80 80"
@@ -61,5 +65,15 @@ export var Loading = function Loading() {
     stroke: "url(#gradient)"
   }))), /*#__PURE__*/React.createElement("div", {
     className: "loading-text"
-  }, /*#__PURE__*/React.createElement("p", null, "Loading..."))))));
-};
+  }, /*#__PURE__*/React.createElement("p", null, "Loading...")))));
+};
+
+var PageLoading = function PageLoading() {
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: '100vh'
+    }
+  }, /*#__PURE__*/React.createElement(Loading, null));
+};
+
+export { Loading, PageLoading };