@antv/dumi-theme-antv 0.6.4-alpha.3 → 0.6.4-alpha.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/common/CommonHelmet.js +62 -45
  2. package/dist/hooks/useMenu.js +68 -85
  3. package/dist/layouts/DocLayout.js +24 -19
  4. package/dist/pages/Example/index.js +1 -1
  5. package/dist/slots/Header/Navs.js +66 -6
  6. package/dist/slots/Header/index.js +31 -72
  7. package/dist/slots/ManualContent/index.js +9 -1
  8. package/package.json +1 -1
package/dist/common/CommonHelmet.js CHANGED
@@ -4,64 +4,81 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
4
4
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
5
5
  function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
6
6
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
7
- import { Helmet, useLocale, useRouteMeta, useSiteData } from 'dumi';
8
- import React, { useLayoutEffect } from 'react';
7
+ import { Helmet, useLocale, useSiteData } from 'dumi';
8
+ import { isEqual } from 'lodash-es';
9
+ import React, { useEffect } from 'react';
9
10
  var CommonHelmet = function CommonHelmet(_ref) {
10
11
  var titleSuffix = _ref.titleSuffix,
11
12
  propTitle = _ref.title,
12
13
  propDescription = _ref.description,
13
- _ref$meta = _ref.meta,
14
- propMeta = _ref$meta === void 0 ? [] : _ref$meta;
15
- var meta = useRouteMeta();
14
+ propMeta = _ref.meta;
16
15
  var locale = useLocale();
17
16
  var lang = locale.id;
18
17
  var _useSiteData = useSiteData(),
19
18
  themeConfig = _useSiteData.themeConfig;
20
19
  var defaultTitle = themeConfig.title,
21
20
  defaultDescription = themeConfig.defaultDescription;
22
- var title = propTitle || meta.frontmatter.title;
23
- var description = propDescription || meta.frontmatter.description || defaultDescription;
24
- var fullTitle = "".concat(title, " | ").concat(titleSuffix || defaultTitle);
25
- var defaultMeta = [{
26
- name: "description",
27
- content: description
28
- },
29
- // "og" 全称为 Open Graph，用于指定页面在社交媒体上的展示效果
30
- {
31
- property: "og:title",
32
- content: title
33
- }, {
34
- property: "og:description",
35
- content: description
36
- }, {
37
- property: "og:image",
38
- content: 'https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png'
39
- }, {
40
- property: "og:type",
41
- content: "website"
42
- }, {
43
- name: "twitter:card",
44
- content: "summary"
45
- }, {
46
- name: "twitter:title",
47
- content: title
48
- }, {
49
- name: "twitter:description",
50
- content: description
51
- }, {
52
- property: "twitter:image",
53
- content: 'https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png'
54
- }];
55
- useLayoutEffect(function () {
56
- // 直接设置 document.title 作为备份机制
57
- document.title = fullTitle;
58
- }, [fullTitle]);
21
+ var helmetData = React.useMemo(function () {
22
+ var title = propTitle || '';
23
+ var fullTitle = "".concat(title, " | ").concat(titleSuffix || defaultTitle);
24
+ var description = propDescription || defaultDescription;
25
+ var defaultMeta = [{
26
+ name: "description",
27
+ content: description
28
+ },
29
+ // Open Graph 标签，指定页面在社交媒体上的展示效果
30
+ {
31
+ property: "og:title",
32
+ content: title
33
+ }, {
34
+ property: "og:description",
35
+ content: description
36
+ }, {
37
+ property: "og:image",
38
+ content: 'https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png'
39
+ }, {
40
+ property: "og:type",
41
+ content: "website"
42
+ },
43
+ // Twitter 卡片
44
+ {
45
+ name: "twitter:card",
46
+ content: "summary"
47
+ }, {
48
+ name: "twitter:title",
49
+ content: title
50
+ }, {
51
+ name: "twitter:description",
52
+ content: description
53
+ }, {
54
+ property: "twitter:image",
55
+ content: 'https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png'
56
+ }];
57
+ return {
58
+ title: title,
59
+ description: description,
60
+ fullTitle: fullTitle,
61
+ defaultMeta: defaultMeta,
62
+ meta: [].concat(defaultMeta, _toConsumableArray(propMeta || []))
63
+ };
64
+ }, [propTitle, propDescription, defaultDescription, titleSuffix, defaultTitle, propMeta]);
65
+ useEffect(function () {
66
+ // 延迟 document.title 设置标题作为备份机制
67
+ var timer = setTimeout(function () {
68
+ document.title = helmetData.fullTitle;
69
+ }, 100);
70
+ return function () {
71
+ return clearTimeout(timer);
72
+ };
73
+ }, [helmetData.fullTitle]);
59
74
  return /*#__PURE__*/React.createElement(Helmet, {
60
75
  htmlAttributes: {
61
76
  lang: lang
62
77
  },
63
- title: fullTitle,
64
- meta: [].concat(defaultMeta, _toConsumableArray(propMeta))
78
+ title: helmetData.fullTitle,
79
+ meta: helmetData.meta
65
80
  });
66
81
  };
67
- export default CommonHelmet;
82
+ export default /*#__PURE__*/React.memo(CommonHelmet, function (prevProps, nextProps) {
83
+ return prevProps.title === nextProps.title && prevProps.description === nextProps.description && prevProps.titleSuffix === nextProps.titleSuffix && isEqual(prevProps.meta, nextProps.meta);
84
+ });
package/dist/hooks/useMenu.js CHANGED
@@ -1,8 +1,4 @@
1
1
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
3
- 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."); }
4
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
5
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
6
2
  function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
7
3
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
8
4
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
@@ -11,26 +7,20 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
11
7
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
12
8
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
13
9
  function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
14
- import { useFullSidebarData, useLocale, useLocation, useNavigate, useSiteData } from 'dumi';
10
+ import { useFullSidebarData, useLocale, useLocation, useSiteData } from 'dumi';
15
11
  import { get } from 'lodash-es';
16
- import React, { useEffect, useMemo, useState } from 'react';
12
+ import React, { useCallback, useMemo } from 'react';
17
13
  import Link from "../common/Link";
14
+ import { icWithLocale } from "../slots/hooks";
18
15
  import styles from "../slots/ManualContent/index.module.less";
19
16
  import { getBaseRoute } from "../slots/ManualContent/utils";
20
17
  import { flattenMenu } from "../utils/menu";
21
- export var useMenu = function useMenu() {
22
- var fullData = useFullSidebarData();
23
- var _useLocation = useLocation(),
24
- pathname = _useLocation.pathname;
25
- var _useSiteData = useSiteData(),
26
- _useSiteData$themeCon = _useSiteData.themeConfig,
27
- docs = _useSiteData$themeCon.docs,
28
- navs = _useSiteData$themeCon.navs;
29
- var baseRoute = getBaseRoute(pathname);
30
- var navigate = useNavigate();
31
- var locale = useLocale();
32
- var currentLocale = locale.id;
33
- var getMenuData = function getMenuData(fullData, rootList, hrefId) {
18
+
19
+ /**
20
+ * 根据 baseRoute 获取特定的菜单数据（纯函数）
21
+ */
22
+ export var getMenuData = function getMenuData(fullData, rootList, baseRoute, locale) {
23
+ var getMenuDataInternal = function getMenuDataInternal(fullData, rootList, hrefId) {
34
24
  var fullSidebarDataToMenuData = function fullSidebarDataToMenuData(rootList, hrefId, list) {
35
25
  // 递归
36
26
  rootList.forEach(function (item) {
@@ -40,7 +30,7 @@ export var useMenu = function useMenu() {
40
30
  if (id === hrefId) {
41
31
  list.push(_objectSpread(_objectSpread({}, item), {}, {
42
32
  key: href,
43
- label: item.title[currentLocale]
33
+ label: icWithLocale(item.title, locale)
44
34
  }));
45
35
  }
46
36
  }
@@ -49,32 +39,34 @@ export var useMenu = function useMenu() {
49
39
  _step;
50
40
  try {
51
41
  var _loop = function _loop() {
52
- var _fullData$item$key$0$;
53
42
  var item = _step.value;
54
43
  item.children = [];
55
44
  fullSidebarDataToMenuData(rootList, item.key, item.children);
56
- fullData[item.key] && ((_fullData$item$key$0$ = fullData[item.key][0].children) === null || _fullData$item$key$0$ === void 0 ? void 0 : _fullData$item$key$0$.forEach(function (itemChild) {
57
- var label = itemChild.title;
58
- var key = itemChild.link;
59
- var tag = get(itemChild, ['frontmatter', 'tag']);
60
- item.children.push(_objectSpread(_objectSpread({}, itemChild), {}, {
61
- label: tag ? /*#__PURE__*/React.createElement(Link, {
62
- to: key
63
- }, /*#__PURE__*/React.createElement("div", {
64
- className: styles.memuLabel
65
- }, label, /*#__PURE__*/React.createElement("div", {
66
- className: styles.tag
67
- }, tag))) : /*#__PURE__*/React.createElement(Link, {
68
- to: key
69
- }, label),
70
- key: key
71
- }));
72
- }));
45
+ if (fullData[item.key]) {
46
+ var _fullData$item$key$0$;
47
+ (_fullData$item$key$0$ = fullData[item.key][0].children) === null || _fullData$item$key$0$ === void 0 || _fullData$item$key$0$.forEach(function (itemChild) {
48
+ var label = itemChild.title;
49
+ var key = itemChild.link;
50
+ var tag = get(itemChild, ['frontmatter', 'tag']);
51
+ item.children.push(_objectSpread(_objectSpread({}, itemChild), {}, {
52
+ label: tag ? /*#__PURE__*/React.createElement(Link, {
53
+ to: key
54
+ }, /*#__PURE__*/React.createElement("div", {
55
+ className: styles.memuLabel
56
+ }, label, /*#__PURE__*/React.createElement("div", {
57
+ className: styles.tag
58
+ }, tag))) : /*#__PURE__*/React.createElement(Link, {
59
+ to: key
60
+ }, label),
61
+ key: key
62
+ }));
63
+ });
64
+ }
73
65
  // children 的 order 排序
74
66
  item.children.sort(function (a, b) {
75
67
  return a.order - b.order;
76
68
  });
77
- if (item.children.length == 0) delete item.children;
69
+ if (item.children.length === 0) delete item.children;
78
70
  };
79
71
  for (_iterator.s(); !(_step = _iterator.n()).done;) {
80
72
  _loop();
@@ -85,17 +77,19 @@ export var useMenu = function useMenu() {
85
77
  _iterator.f();
86
78
  }
87
79
  if (hrefId === baseRoute) {
88
- var _fullData$baseRoute$;
89
- fullData[baseRoute] && ((_fullData$baseRoute$ = fullData[baseRoute][0].children) === null || _fullData$baseRoute$ === void 0 ? void 0 : _fullData$baseRoute$.forEach(function (itemChild) {
90
- var key = itemChild.link;
91
- var label = itemChild.title;
92
- list.push(_objectSpread(_objectSpread({}, itemChild), {}, {
93
- label: /*#__PURE__*/React.createElement(Link, {
94
- to: key
95
- }, label),
96
- key: key
97
- }));
98
- }));
80
+ if (fullData[baseRoute]) {
81
+ var _fullData$baseRoute$;
82
+ (_fullData$baseRoute$ = fullData[baseRoute][0].children) === null || _fullData$baseRoute$ === void 0 || _fullData$baseRoute$.forEach(function (itemChild) {
83
+ var key = itemChild.link;
84
+ var label = itemChild.title;
85
+ list.push(_objectSpread(_objectSpread({}, itemChild), {}, {
86
+ label: /*#__PURE__*/React.createElement(Link, {
87
+ to: key
88
+ }, label),
89
+ key: key
90
+ }));
91
+ });
92
+ }
99
93
  list.sort(function (a, b) {
100
94
  return a.order - b.order;
101
95
  });
@@ -104,45 +98,34 @@ export var useMenu = function useMenu() {
104
98
  };
105
99
  return fullSidebarDataToMenuData(rootList, hrefId, []);
106
100
  };
101
+ return getMenuDataInternal(fullData, rootList, baseRoute);
102
+ };
103
+
104
+ /**
105
+ * 通过 hooks 包装的 getMenuData
106
+ */
107
+ export var useMenuData = function useMenuData() {
108
+ var fullData = useFullSidebarData();
109
+ var _useSiteData = useSiteData(),
110
+ docs = _useSiteData.themeConfig.docs;
111
+ var locale = useLocale();
112
+ var getter = useCallback(function (baseRoute) {
113
+ return getMenuData(fullData, docs, baseRoute, locale.id);
114
+ }, [fullData, docs, locale.id]);
115
+ return getter;
116
+ };
117
+ export var useMenu = function useMenu() {
118
+ var _useLocation = useLocation(),
119
+ pathname = _useLocation.pathname;
120
+ var baseRoute = getBaseRoute(pathname);
121
+ var getMenuDataFn = useMenuData();
107
122
  var menuData = useMemo(function () {
108
- return getMenuData(fullData, docs, baseRoute);
109
- }, [docs, baseRoute, fullData]);
123
+ return getMenuDataFn(baseRoute);
124
+ }, [getMenuDataFn, baseRoute]);
110
125
 
111
126
  // 将菜单数据扁平化
112
127
  var flattedMenuData = useMemo(function () {
113
128
  return flattenMenu(menuData);
114
129
  }, [menuData]);
115
-
116
- // 添加本地状态来存储选中的key
117
- var _useState = useState(pathname),
118
- _useState2 = _slicedToArray(_useState, 2),
119
- selectedKey = _useState2[0],
120
- setSelectedKey = _useState2[1];
121
- useEffect(function () {
122
- var _navOf;
123
- // Nav 跳转但不在菜单中，则选中第一个菜单项
124
- var navOf = function navOf(navs) {
125
- return navs.some(function (nav) {
126
- var _nav$slug;
127
- return (nav === null || nav === void 0 || (_nav$slug = nav.slug) === null || _nav$slug === void 0 ? void 0 : _nav$slug.replace('docs/', '/')) === pathname;
128
- });
129
- };
130
- var isNavLink = !!navOf(navs);
131
- var isExactLink = (_navOf = navOf(navs)) === null || _navOf === void 0 ? void 0 : _navOf.exact;
132
- var isLinkInMenu = flattedMenuData === null || flattedMenuData === void 0 ? void 0 : flattedMenuData.some(function (item) {
133
- return item.link === pathname;
134
- });
135
- if (isNavLink && !isExactLink && !isLinkInMenu) {
136
- var firstValidMenuItem = flattedMenuData === null || flattedMenuData === void 0 ? void 0 : flattedMenuData.find(function (item) {
137
- return item.link;
138
- });
139
- if (firstValidMenuItem) {
140
- navigate(firstValidMenuItem.link);
141
- setSelectedKey(firstValidMenuItem.link);
142
- }
143
- } else {
144
- setSelectedKey(pathname);
145
- }
146
- }, [pathname, flattedMenuData, navs, navigate]);
147
- return [menuData, selectedKey, flattedMenuData];
130
+ return [menuData, pathname, flattedMenuData];
148
131
  };
package/dist/layouts/DocLayout.js CHANGED
@@ -1,4 +1,4 @@
1
- import { useLocation, useOutlet, useSiteData } from 'dumi';
1
+ import { Helmet, useLocation, useOutlet, useSiteData } from 'dumi';
2
2
  import React, { useEffect } from 'react';
3
3
  import { getPurePathname } from "../utils/location";
4
4
  import IndexLayout from "./IndexLayout";
@@ -36,24 +36,29 @@ export default (function () {
36
36
  if (elm) document.documentElement.scrollTo(0, elm.offsetTop - 80);
37
37
  }
38
38
  }, [loading, hash]);
39
+ var content = React.useMemo(function () {
40
+ // 首页
41
+ if (['/', ''].includes(purePathname)) {
42
+ return /*#__PURE__*/React.createElement(IndexLayout, null, outlet);
43
+ }
39
44
 
40
- // 首页
41
- if (['/', ''].includes(purePathname)) {
42
- return /*#__PURE__*/React.createElement(IndexLayout, null, outlet);
43
- }
44
-
45
- // 匹配 navs 中的 docs 路由
46
- var docsRoutes = navs.filter(function (nav) {
47
- return nav.slug && nav.slug.startsWith('docs/');
48
- }).map(function (nav) {
49
- return nav.slug && nav.slug.split('/').find(function (item) {
50
- return item !== 'docs';
45
+ // 匹配 navs 中的 docs 路由
46
+ var docsRoutes = navs.filter(function (nav) {
47
+ return nav.slug && nav.slug.startsWith('docs/');
48
+ }).map(function (nav) {
49
+ return nav.slug && nav.slug.split('/').find(function (item) {
50
+ return item !== 'docs';
51
+ });
51
52
  });
52
- });
53
- if (docsRoutes.some(function (slug) {
54
- return purePathname.startsWith("/".concat(slug)) || purePathname.startsWith("/docs/".concat(slug));
55
- })) {
56
- return /*#__PURE__*/React.createElement(ManualLayout, null, outlet);
57
- }
58
- return outlet;
53
+ if (docsRoutes.some(function (slug) {
54
+ return purePathname.startsWith("/".concat(slug)) || purePathname.startsWith("/docs/".concat(slug));
55
+ })) {
56
+ return /*#__PURE__*/React.createElement(ManualLayout, null, outlet);
57
+ }
58
+ return outlet;
59
+ }, [purePathname]);
60
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Helmet, null, /*#__PURE__*/React.createElement("link", {
61
+ rel: "shortcut icon",
62
+ href: "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*7svFR6wkPMoAAAAAAAAAAAAADmJ7AQ/original"
63
+ })), content);
59
64
  });
package/dist/pages/Example/index.js CHANGED
@@ -90,7 +90,7 @@ var Example = function Example() {
90
90
  return /*#__PURE__*/React.createElement("div", {
91
91
  className: styles.example
92
92
  }, /*#__PURE__*/React.createElement(CommonHelmet, {
93
- title: "".concat(demoTitle, "\xB7").concat(exampleTitle),
93
+ title: exampleTitle,
94
94
  description: demoTitle
95
95
  }), /*#__PURE__*/React.createElement(InViewSuspense, null, /*#__PURE__*/React.createElement(Header, {
96
96
  isHomePage: false
package/dist/slots/Header/Navs.js CHANGED
@@ -2,14 +2,70 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
2
2
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
3
3
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
4
4
  function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
5
+ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
6
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
7
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
8
  import { DownOutlined, LinkOutlined } from '@ant-design/icons';
6
9
  import { Dropdown, Menu } from 'antd';
7
10
  import cx from 'classnames';
8
11
  import { Link, useLocale } from 'dumi';
9
12
  import { size } from 'lodash-es';
10
13
  import React from 'react';
14
+ import { useMenuData } from "../../hooks/useMenu";
11
15
  import styles from "./index.module.less";
12
16
  import { getNavCategory } from "./utils";
17
+ function getNavMeta(pathname, navs) {
18
+ return navs.find(function (nav) {
19
+ var _nav$slug;
20
+ return (nav === null || nav === void 0 || (_nav$slug = nav.slug) === null || _nav$slug === void 0 ? void 0 : _nav$slug.replace('docs/', '/')) === pathname;
21
+ });
22
+ }
23
+ function isExactNavLink(pathname, navs) {
24
+ var meta = getNavMeta(pathname, navs);
25
+ return !!meta && meta.exact;
26
+ }
27
+
28
+ /**
29
+ * 查找与路径匹配的第一个菜单项
30
+ */
31
+ function findMatchingMenuItem(pathname, menuData) {
32
+ if (!menuData || !Array.isArray(menuData) || menuData.length === 0) {
33
+ return null;
34
+ }
35
+ var _iterator = _createForOfIteratorHelper(menuData),
36
+ _step;
37
+ try {
38
+ for (_iterator.s(); !(_step = _iterator.n()).done;) {
39
+ var menuItem = _step.value;
40
+ if (menuItem.link) {
41
+ var normalizedLink = menuItem.link.startsWith('/') ? menuItem.link : "/".concat(menuItem.link);
42
+ if (normalizedLink === pathname || normalizedLink.startsWith(pathname)) {
43
+ return menuItem;
44
+ }
45
+ }
46
+ if (menuItem.children && menuItem.children.length > 0) {
47
+ var matchedChild = findMatchingMenuItem(pathname, menuItem.children);
48
+ if (matchedChild) return matchedChild;
49
+ }
50
+ }
51
+ } catch (err) {
52
+ _iterator.e(err);
53
+ } finally {
54
+ _iterator.f();
55
+ }
56
+ return null;
57
+ }
58
+ function getNavLink(pathname, navs, menuData) {
59
+ if (isExactNavLink(pathname, navs)) {
60
+ return pathname;
61
+ }
62
+ var matchingMenuItem = findMatchingMenuItem(pathname, menuData);
63
+ if (matchingMenuItem) {
64
+ return matchingMenuItem.link;
65
+ }
66
+ return pathname;
67
+ }
68
+
13
69
  /**
14
70
  * Header 中的导航菜单
15
71
  */
@@ -17,17 +73,21 @@ export var Navs = function Navs(_ref) {
17
73
  var navs = _ref.navs,
18
74
  path = _ref.path;
19
75
  var locale = useLocale();
76
+ var getMenuData = useMenuData();
20
77
  return /*#__PURE__*/React.createElement(React.Fragment, null, navs.map(function (nav) {
21
78
  var title = nav.title[locale.id];
22
79
  var href = '';
23
80
  var className = '';
24
81
  if (nav.slug) {
25
- href = nav.slug.startsWith('http') ? nav.slug : "/".concat(nav.slug);
26
-
27
- // 去除 docs 防止新页面 404 和 本页重新刷新。
28
- href = href.replace(/^\/docs(?=\/)/, '');
29
- if (locale.id == 'en' && !href.startsWith('http')) {
30
- href = "/en".concat(href);
82
+ if (nav.slug.startsWith('http')) {
83
+ href = nav.slug;
84
+ } else {
85
+ // 去除 docs 防止新页面 404 和 本页重新刷新。
86
+ href = "/".concat(nav.slug).replace(/^\/docs(?=\/)/, '');
87
+ if (locale.id === 'en') {
88
+ href = "/en".concat(href);
89
+ }
90
+ href = getNavLink(href, navs, getMenuData(href));
31
91
  }
32
92
  className = cx('header-menu-item-active', _defineProperty({}, styles.activeItem, getNavCategory(path) === getNavCategory(href)));
33
93
  }
package/dist/slots/Header/index.js CHANGED
@@ -13,20 +13,19 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
13
13
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
14
14
  function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
15
15
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
16
- import { CaretDownFilled, CheckOutlined, DownOutlined, GithubOutlined, LinkOutlined, MenuOutlined, WechatOutlined } from '@ant-design/icons';
16
+ import { CaretDownFilled, DownOutlined, GithubOutlined, LinkOutlined, MenuOutlined, WechatOutlined } from '@ant-design/icons';
17
17
  import { Alert, Button, Dropdown, Menu, Modal, Popover, Select } from 'antd';
18
18
  import cx from 'classnames';
19
- import { FormattedMessage, useLocale, useSiteData } from 'dumi';
19
+ import { FormattedMessage, Link, useLocale, useSiteData } from 'dumi';
20
20
  import { get, map, size } from 'lodash-es';
21
- import React, { useEffect, useMemo, useState } from 'react';
22
- import { useNavigate } from 'react-router-dom';
21
+ import React, { useEffect, useState } from 'react';
23
22
  import { useMedia } from 'react-use';
24
23
  import { getPurePathname } from "../../utils/location";
25
- import { ic } from "../hooks";
24
+ import { ic, icWithLocale } from "../hooks";
26
25
  import { Navs } from "./Navs";
27
26
  import { Products } from "./Products";
28
27
  import { Search } from "./Search";
29
- import { findVersion, getLangUrl } from "./utils";
28
+ import { findVersion } from "./utils";
30
29
  import { Assistant } from '@petercatai/assistant';
31
30
  import '@petercatai/assistant/style';
32
31
  import { useLocation } from 'react-router-dom';
@@ -41,6 +40,7 @@ var ANNOUNCEMENT_LOCALSTORAGE_ID = 'ANNOUNCEMENT_LOCALSTORAGE_ID';
41
40
  * 头部菜单
42
41
  */
43
42
  var HeaderComponent = function HeaderComponent(_ref) {
43
+ var _announcement$link;
44
44
  var _ref$subTitle = _ref.subTitle,
45
45
  subTitle = _ref$subTitle === void 0 ? '' : _ref$subTitle,
46
46
  _ref$navs = _ref.navs,
@@ -84,6 +84,8 @@ var HeaderComponent = function HeaderComponent(_ref) {
84
84
  _useState4 = _slicedToArray(_useState3, 2),
85
85
  chinaMirrorHintVisible = _useState4[0],
86
86
  updateChinaMirrorHintVisible = _useState4[1];
87
+ var locale = useLocale();
88
+ var lang = locale.id;
87
89
  useEffect(function () {
88
90
  var timeout = setTimeout(function () {
89
91
  if (showChinaMirror && lang === 'zh' && !localStorage.getItem('china-mirror-no-more-hint') && window.location.host.includes('antv.vision')) {
@@ -94,18 +96,8 @@ var HeaderComponent = function HeaderComponent(_ref) {
94
96
  clearTimeout(timeout);
95
97
  };
96
98
  });
97
- var locale = useLocale();
98
- var nav = useNavigate();
99
- var _useState5 = useState(locale.id),
100
- _useState6 = _slicedToArray(_useState5, 2),
101
- lang = _useState6[0],
102
- setLang = _useState6[1];
103
- var announcementTitle = useMemo(function () {
104
- return get(announcement, ['title', lang]);
105
- }, [announcement, lang]);
106
- var announcementLinkTitle = useMemo(function () {
107
- return get(announcement, ['link', 'text', lang]);
108
- }, [announcement, lang]);
99
+ var announcementTitle = icWithLocale(announcement === null || announcement === void 0 ? void 0 : announcement.title, lang);
100
+ var announcementLinkTitle = icWithLocale(announcement === null || announcement === void 0 || (_announcement$link = announcement.link) === null || _announcement$link === void 0 ? void 0 : _announcement$link.text, lang);
109
101
  useEffect(function () {
110
102
  setBannerVisible(!!announcementTitle && localStorage.getItem(ANNOUNCEMENT_LOCALSTORAGE_ID) !== 'true');
111
103
  }, [announcementTitle]);
@@ -113,10 +105,10 @@ var HeaderComponent = function HeaderComponent(_ref) {
113
105
  localStorage.setItem(ANNOUNCEMENT_LOCALSTORAGE_ID, 'true');
114
106
  setBannerVisible(false);
115
107
  }
116
- var _useState7 = useState(false),
117
- _useState8 = _slicedToArray(_useState7, 2),
118
- productMenuVisible = _useState8[0],
119
- setProductMenuVisible = _useState8[1];
108
+ var _useState5 = useState(false),
109
+ _useState6 = _slicedToArray(_useState5, 2),
110
+ productMenuVisible = _useState6[0],
111
+ setProductMenuVisible = _useState6[1];
120
112
  var productMenuHovering = false;
121
113
  var onProductMouseEnter = function onProductMouseEnter(e) {
122
114
  productMenuHovering = true;
@@ -140,10 +132,10 @@ var HeaderComponent = function HeaderComponent(_ref) {
140
132
  var onToggleProductMenuVisible = function onToggleProductMenuVisible() {
141
133
  setProductMenuVisible(!productMenuVisible);
142
134
  };
143
- var _useState9 = useState(false),
144
- _useState10 = _slicedToArray(_useState9, 2),
145
- popupMenuVisible = _useState10[0],
146
- setPopupMenuVisible = _useState10[1];
135
+ var _useState7 = useState(false),
136
+ _useState8 = _slicedToArray(_useState7, 2),
137
+ popupMenuVisible = _useState8[0],
138
+ setPopupMenuVisible = _useState8[1];
147
139
  var onTogglePopupMenuVisible = function onTogglePopupMenuVisible() {
148
140
  setPopupMenuVisible(!popupMenuVisible);
149
141
  };
@@ -187,6 +179,9 @@ var HeaderComponent = function HeaderComponent(_ref) {
187
179
  } : {
188
180
  onClick: onToggleProductMenuVisible
189
181
  };
182
+ var handleSwitchLanguage = function handleSwitchLanguage() {
183
+ onLanguageChange === null || onLanguageChange === void 0 || onLanguageChange(lang);
184
+ };
190
185
  var menu = /*#__PURE__*/React.createElement("ul", {
191
186
  className: cx(styles.menu, _defineProperty(_defineProperty({}, styles.popup, !isWide), styles.popupHidden, !popupMenuVisible))
192
187
  }, /** 最左侧的菜单，一般是 教程、API、示例，或者其他自定义，有配置文件中的 `navs` 决定 */
@@ -336,45 +331,9 @@ var HeaderComponent = function HeaderComponent(_ref) {
336
331
  }))), /** 切换网站语言 */
337
332
  showLanguageSwitcher && /*#__PURE__*/React.createElement("li", {
338
333
  className: cx(styles.navIcon, styles.languageSwitcher)
339
- }, /*#__PURE__*/React.createElement(Dropdown, {
340
- placement: "bottomRight",
341
- overlay: /*#__PURE__*/React.createElement(Menu, {
342
- defaultSelectedKeys: [lang],
343
- selectable: true,
344
- onSelect: function onSelect(_ref3) {
345
- var key = _ref3.key;
346
- if (key === lang) {
347
- return;
348
- }
349
- setLang(key);
350
- if (onLanguageChange) {
351
- onLanguageChange(key.toString());
352
- return;
353
- }
354
- var newUrl = getLangUrl(window.location.href, key);
355
- nav(newUrl.replace(window.location.origin, ''));
356
- }
357
- }, /*#__PURE__*/React.createElement(Menu.Item, {
358
- key: "en"
359
- }, /*#__PURE__*/React.createElement(CheckOutlined, {
360
- style: {
361
- visibility: lang === 'en' ? 'visible' : 'hidden',
362
- color: '#52c41a'
363
- }
364
- }), "English"), /*#__PURE__*/React.createElement(Menu.Item, {
365
- key: "zh"
366
- }, /*#__PURE__*/React.createElement(CheckOutlined, {
367
- style: {
368
- visibility: lang === 'zh' ? 'visible' : 'hidden',
369
- color: '#52c41a'
370
- }
371
- }), "\u7B80\u4F53\u4E2D\u6587")),
372
- className: styles.translation
373
- }, /*#__PURE__*/React.createElement("a", {
374
- className: "ant-dropdown-link",
375
- onClick: function onClick(e) {
376
- return e.preventDefault();
377
- }
334
+ }, /*#__PURE__*/React.createElement(Link, {
335
+ to: lang === 'zh' ? '/en' : '/',
336
+ onClick: handleSwitchLanguage
378
337
  }, /*#__PURE__*/React.createElement("svg", {
379
338
  className: styles.translation,
380
339
  xmlns: "http://www.w3.org/2000/svg",
@@ -383,7 +342,7 @@ var HeaderComponent = function HeaderComponent(_ref) {
383
342
  viewBox: "0 0 24 24"
384
343
  }, /*#__PURE__*/React.createElement("path", {
385
344
  d: "M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"
386
- }))))), /** 微信公众号 */
345
+ })))), /** 微信公众号 */
387
346
  showWxQrcode && /*#__PURE__*/React.createElement("li", {
388
347
  className: cx(styles.navIcon, styles.wxQrcode)
389
348
  }, /*#__PURE__*/React.createElement(Popover, {
@@ -496,14 +455,14 @@ var Header = function Header(props) {
496
455
  announcement: announcement,
497
456
  petercat: petercat
498
457
  };
499
- var _useState11 = useState(undefined),
500
- _useState12 = _slicedToArray(_useState11, 2),
501
- isInternalUser = _useState12[0],
502
- setIsInternalUser = _useState12[1];
458
+ var _useState9 = useState(undefined),
459
+ _useState10 = _slicedToArray(_useState9, 2),
460
+ isInternalUser = _useState10[0],
461
+ setIsInternalUser = _useState10[1];
503
462
  var isPetercatShow = petercat === null || petercat === void 0 ? void 0 : petercat.show;
504
463
  useEffect(function () {
505
464
  var checkUserType = /*#__PURE__*/function () {
506
- var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
465
+ var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
507
466
  var result;
508
467
  return _regeneratorRuntime().wrap(function _callee$(_context) {
509
468
  while (1) switch (_context.prev = _context.next) {
@@ -520,7 +479,7 @@ var Header = function Header(props) {
520
479
  }, _callee);
521
480
  }));
522
481
  return function checkUserType() {
523
- return _ref4.apply(this, arguments);
482
+ return _ref3.apply(this, arguments);
524
483
  };
525
484
  }();
526
485
  checkUserType();
package/dist/slots/ManualContent/index.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import { Layout } from 'antd';
2
+ import { useRouteMeta } from 'dumi';
2
3
  import React from 'react';
3
4
  import CommonHelmet from "../../common/CommonHelmet";
4
5
  import styles from "./index.module.less";
@@ -6,8 +7,15 @@ import { Main } from "./Main";
6
7
  import { Sidebar } from "./Sidebar";
7
8
  export var ManualContent = function ManualContent(_ref) {
8
9
  var children = _ref.children;
10
+ var meta = useRouteMeta();
11
+ var _meta$frontmatter = meta.frontmatter,
12
+ title = _meta$frontmatter.title,
13
+ description = _meta$frontmatter.description;
9
14
  return /*#__PURE__*/React.createElement(Layout, {
10
15
  hasSider: true,
11
16
  className: styles.layout
12
- }, /*#__PURE__*/React.createElement(CommonHelmet, null), /*#__PURE__*/React.createElement(Sidebar, null), /*#__PURE__*/React.createElement(Main, null, children));
17
+ }, /*#__PURE__*/React.createElement(CommonHelmet, {
18
+ title: title,
19
+ description: description
20
+ }), /*#__PURE__*/React.createElement(Sidebar, null), /*#__PURE__*/React.createElement(Main, null, children));
13
21
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antv/dumi-theme-antv",
3
- "version": "0.6.4-alpha.3",
3
+ "version": "0.6.4-alpha.5",
4
4
  "description": "AntV website theme based on dumi2.",
5
5
  "keywords": [
6
6
  "dumi",