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

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 (67) hide show
  1. package/dist/builtins/Playground/index.d.ts +2 -5
  2. package/dist/builtins/Playground/index.js +25 -6
  3. package/dist/context.d.ts +2 -1
  4. package/dist/layouts/DocLayout.js +25 -16
  5. package/dist/layouts/entry/Index.js +10 -2
  6. package/dist/layouts/entry/Manual.js +3 -1
  7. package/dist/pages/404.js +5 -1
  8. package/dist/pages/Example/index.js +28 -52
  9. package/dist/pages/Example/index.module.less +50 -8
  10. package/dist/pages/Example/utils.d.ts +1 -0
  11. package/dist/pages/Example/utils.js +9 -0
  12. package/dist/pages/Examples/components/GalleryPageContent/DemoCard/index.js +8 -5
  13. package/dist/pages/Examples/index.js +22 -2
  14. package/dist/pages/Examples/index.module.less +2 -0
  15. package/dist/pages/Examples/types.d.ts +7 -6
  16. package/dist/plugin/examples.d.ts +16 -2
  17. package/dist/plugin/examples.js +32 -10
  18. package/dist/plugin/index.js +31 -20
  19. package/dist/plugin/utils.d.ts +5 -0
  20. package/dist/plugin/utils.js +46 -0
  21. package/dist/slots/Cases/index.d.ts +1 -0
  22. package/dist/slots/Cases/index.js +1 -1
  23. package/dist/slots/Cases/index.module.less +2 -1
  24. package/dist/slots/CodeEditor/Toolbar.js +4 -16
  25. package/dist/slots/CodeEditor/index.d.ts +4 -0
  26. package/dist/slots/CodeEditor/index.js +48 -16
  27. package/dist/slots/CodeEditor/utils.js +2 -2
  28. package/dist/slots/CodePreview/CodeHeader.js +15 -14
  29. package/dist/slots/CodePreview/index.d.ts +8 -0
  30. package/dist/slots/CodePreview/index.js +6 -4
  31. package/dist/slots/CodePreview/index.module.less +17 -7
  32. package/dist/slots/CodeRunner/index.d.ts +5 -2
  33. package/dist/slots/CodeRunner/index.js +18 -4
  34. package/dist/slots/CodeRunner/utils.d.ts +3 -2
  35. package/dist/slots/CodeRunner/utils.js +1 -1
  36. package/dist/slots/Detail/News.d.ts +1 -0
  37. package/dist/slots/Detail/index.d.ts +1 -0
  38. package/dist/slots/Detail/index.js +1 -1
  39. package/dist/slots/ExampleSider/index.d.ts +4 -38
  40. package/dist/slots/ExampleSider/index.js +22 -44
  41. package/dist/slots/ExampleSider/index.module.less +1 -1
  42. package/dist/slots/Features/FeatureCard.d.ts +1 -0
  43. package/dist/slots/Features/index.js +2 -1
  44. package/dist/slots/Footer/index.js +3 -2
  45. package/dist/slots/Header/Navs.d.ts +10 -1
  46. package/dist/slots/Header/Navs.js +36 -19
  47. package/dist/slots/Header/index.js +8 -7
  48. package/dist/slots/Loading/index.d.ts +6 -1
  49. package/dist/slots/Loading/index.js +24 -10
  50. package/dist/slots/Loading/index.module.less +276 -9
  51. package/dist/slots/ManualContent/index.js +138 -113
  52. package/dist/slots/ManualContent/index.module.less +40 -33
  53. package/dist/slots/ManualContent/utils.d.ts +18 -0
  54. package/dist/slots/ManualContent/utils.js +64 -0
  55. package/dist/slots/SEO.d.ts +10 -0
  56. package/dist/slots/SEO.js +59 -0
  57. package/dist/slots/{TOC.d.ts → TOC/index.d.ts} +1 -0
  58. package/dist/slots/{TOC.js → TOC/index.js} +1 -0
  59. package/dist/slots/TOC/index.module.less +11 -0
  60. package/dist/slots/hooks.d.ts +3 -3
  61. package/dist/slots/utils.d.ts +4 -19
  62. package/dist/slots/utils.js +77 -119
  63. package/dist/types.d.ts +83 -0
  64. package/dist/typings.d.ts +0 -113
  65. package/package.json +7 -4
  66. package/dist/slots/Loading.d.ts +0 -5
  67. package/dist/slots/Loading.js +0 -8
@@ -17,8 +17,5 @@ export declare type PlaygroundProps = {
17
17
  */
18
18
  height?: number;
19
19
  };
20
- /**
21
- * Markdown 标签插件 Playground
22
- */
23
- declare const Playground: React.FC<PlaygroundProps>;
24
- export default Playground;
20
+ declare const _default: React.FC<PlaygroundProps>;
21
+ export default _default;
@@ -10,7 +10,10 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
10
10
 
11
11
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
12
12
 
13
+ import { useSiteData } from 'dumi';
14
+ import { get } from 'lodash-es';
13
15
  import React, { useContext } from 'react';
16
+ import { ErrorBoundary } from 'react-error-boundary';
14
17
  import { ThemeAntVContext } from "../../context";
15
18
  import { CodeRunner } from "../../slots/CodeRunner";
16
19
  import styles from "./index.module.less";
@@ -21,8 +24,7 @@ import styles from "./index.module.less";
21
24
  var Playground = function Playground(_ref) {
22
25
  var rid = _ref.rid,
23
26
  path = _ref.path,
24
- _ref$ratio = _ref.ratio,
25
- ratio = _ref$ratio === void 0 ? 0.62 : _ref$ratio,
27
+ ratio = _ref.ratio,
26
28
  _ref$height = _ref.height,
27
29
  height = _ref$height === void 0 ? 400 : _ref$height;
28
30
 
@@ -30,26 +32,43 @@ var Playground = function Playground(_ref) {
30
32
  var _useContext = useContext(ThemeAntVContext),
31
33
  meta = _useContext.meta;
32
34
 
33
- var exampleTopics = meta.exampleTopics; // '/case/area/demo/area5.ts'
35
+ var exampleTopics = meta.exampleTopics; // 'case/area/demo/area5.ts'
34
36
 
35
- var _ref2 = path.match(/\/([\w-]+)\/([\w-]+)\/demo\/([\w-]+)/i),
37
+ var _ref2 = path.match(/([\w-]+)\/([\w-]+)\/demo\/([\w-]+)/i),
36
38
  _ref3 = _slicedToArray(_ref2, 4),
37
39
  _ = _ref3[0],
38
40
  topic = _ref3[1],
39
41
  example = _ref3[2],
40
42
  demo = _ref3[3];
41
43
 
44
+ var themeConfig = useSiteData();
45
+ var defaultSize = get(themeConfig, 'editor.playgroundSize', 0.38);
42
46
  return /*#__PURE__*/React.createElement("div", {
43
47
  className: styles.container,
44
48
  style: {
45
49
  height: height
46
50
  }
47
51
  }, /*#__PURE__*/React.createElement(CodeRunner, {
52
+ isPlayground: true,
48
53
  exampleTopics: exampleTopics,
49
54
  topic: topic,
50
55
  example: example,
51
- demo: demo
56
+ demo: demo,
57
+ size: ratio || defaultSize,
58
+ replaceId: rid
52
59
  }));
53
60
  };
54
61
 
55
- export default Playground;
62
+ function ErrorFallback(_ref4) {
63
+ var error = _ref4.error;
64
+ console.log(error);
65
+ return /*#__PURE__*/React.createElement("div", {
66
+ role: "alert"
67
+ }, /*#__PURE__*/React.createElement("p", null, "Something went wrong:"), /*#__PURE__*/React.createElement("pre", null, error.message));
68
+ }
69
+
70
+ export default (function (props) {
71
+ return /*#__PURE__*/React.createElement(ErrorBoundary, {
72
+ FallbackComponent: ErrorFallback
73
+ }, /*#__PURE__*/React.createElement(Playground, props));
74
+ });
package/dist/context.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  /// <reference types="react" />
2
+ import { ExampleTopic } from './types';
2
3
  export declare type IThemeAntVContext = {
3
- exampleTopics?: ExamplesPage.ExampleTopic[];
4
+ exampleTopics?: ExampleTopic[];
4
5
  };
5
6
  export declare const ThemeAntVContext: import("react").Context<IThemeAntVContext>;
@@ -1,7 +1,6 @@
1
- import React from 'react';
2
- import { useOutlet, useLocation } from 'dumi';
1
+ import React, { useEffect } from 'react';
2
+ import { useOutlet, useLocation, useSiteData } from 'dumi';
3
3
  import { Index } from "./entry/Index";
4
- import { API } from "./entry/API";
5
4
  import { Manual } from "./entry/Manual"; // 用户手动添加自己的
6
5
 
7
6
  import "../slots/global";
@@ -11,28 +10,38 @@ import "../slots/_.less";
11
10
  */
12
11
 
13
12
  export default (function () {
13
+ var _useSiteData = useSiteData(),
14
+ themeConfig = _useSiteData.themeConfig;
15
+
16
+ var navs = themeConfig.navs; // 打印控制台文案
17
+
18
+ useEffect(function () {
19
+ console.log("%cAntV 让数据栩栩如生", "color:#5B7102; font-size: 20px;"), console.log("%c新一代数据可视化解决方案", "color:#5B7102;"), console.log("--------------------------"), console.log("%c关注我们的微信公众号 %c“数据可视化 AntV”%c,获取我们团队最新的进展、动态、分享,也欢迎加入我们!", "color: red", "color: pink", "color: red");
20
+ }, []);
14
21
  var outlet = useOutlet();
15
22
 
16
23
  var _useLocation = useLocation(),
17
24
  pathname = _useLocation.pathname;
18
25
 
19
- var p = pathname.toLowerCase(); // @todo 南洋
20
- // 做一些跳转,比如:/zh/examples/xxx -> /examples/xxx
21
- // 首页
22
-
23
- if (p === '/' || p === '/en' || p === '/en/') return /*#__PURE__*/React.createElement(Index, null); // API 页面
26
+ var path = pathname; // 统一去掉中英文前缀
24
27
 
25
- if (p.startsWith('/api') || p.startsWith('/en/api') || // 这两个是兼容之前的
26
- p.startsWith('/zh/docs/api') || p.startsWith('/en/docs/api')) {
27
- return /*#__PURE__*/React.createElement(API, null, " ", outlet, " ");
28
- } // 教程页面
28
+ var p = path.replace('/zh/', '/').replace('/en/', '/'); // 首页
29
29
 
30
+ if (p === '/' || p === '/zh' || p === '/en' || p === '/en/') return /*#__PURE__*/React.createElement(Index, null); // 匹配 navs 中的 docs 路由
30
31
 
31
- if (p.startsWith('/manual') || p.startsWith('/en/manual') || // 这两个是兼容之前的
32
- p.startsWith('/zh/docs/manual/') || p.startsWith('/en/docs/manual/')) {
33
- return /*#__PURE__*/React.createElement(Manual, null, " ", outlet, " ");
34
- } // More router, add here...
32
+ var docsRoutes = navs.filter(function (nav) {
33
+ return nav.slug && nav.slug.startsWith('docs/');
34
+ }).map(function (nav) {
35
+ return nav.slug && nav.slug.split('/').find(function (item) {
36
+ return item !== 'docs';
37
+ });
38
+ });
35
39
 
40
+ if (docsRoutes.some(function (route) {
41
+ return p.startsWith("/".concat(route)) || p.startsWith("/docs/".concat(route));
42
+ })) {
43
+ return /*#__PURE__*/React.createElement(Manual, null, outlet);
44
+ }
36
45
 
37
46
  return outlet;
38
47
  });
@@ -5,7 +5,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
5
5
  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; }
6
6
 
7
7
  import React from 'react';
8
- import { useSiteData } from 'dumi';
8
+ import { useLocale, useSiteData } from 'dumi';
9
+ import { SEO } from "../../slots/SEO";
9
10
  import { Header } from "../../slots/Header";
10
11
  import { Detail } from "../../slots/Detail";
11
12
  import { Features } from "../../slots/Features";
@@ -20,6 +21,8 @@ import { useT } from "../../slots/hooks";
20
21
  */
21
22
 
22
23
  export var Index = function Index() {
24
+ var locale = useLocale();
25
+
23
26
  var _useSiteData = useSiteData(),
24
27
  themeConfig = _useSiteData.themeConfig;
25
28
 
@@ -64,7 +67,12 @@ export var Index = function Index() {
64
67
  style: style,
65
68
  className: className
66
69
  };
67
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement(Detail, detailProps), /*#__PURE__*/React.createElement(Features, featuresProps), /*#__PURE__*/React.createElement(Cases, casesProps), /*#__PURE__*/React.createElement(Companies, {
70
+ var metaTitle = detailProps.title;
71
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SEO, {
72
+ title: "".concat(metaTitle[locale.id]),
73
+ titleSuffix: "AntV",
74
+ lang: locale.id
75
+ }), /*#__PURE__*/React.createElement(Header, null), detail && /*#__PURE__*/React.createElement(Detail, detailProps), features && /*#__PURE__*/React.createElement(Features, featuresProps), cases && /*#__PURE__*/React.createElement(Cases, casesProps), /*#__PURE__*/React.createElement(Companies, {
68
76
  title: useT("感谢信赖"),
69
77
  companies: companies
70
78
  }), /*#__PURE__*/React.createElement(Footer, null));
@@ -10,5 +10,7 @@ export var Manual = function Manual(_ref) {
10
10
  var children = _ref.children;
11
11
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
12
12
  isHomePage: false
13
- }), /*#__PURE__*/React.createElement(ManualContent, null, " ", children, " "), /*#__PURE__*/React.createElement(Footer, null));
13
+ }), /*#__PURE__*/React.createElement(ManualContent, null, " ", children, " "), /*#__PURE__*/React.createElement(Footer, {
14
+ isDynamicFooter: true
15
+ }));
14
16
  };
package/dist/pages/404.js CHANGED
@@ -1,3 +1,5 @@
1
+ import React from 'react';
2
+ import { SEO } from "../slots/SEO";
1
3
  import { Header } from "../slots/Header";
2
4
  import { NotFound as NotFoundPage } from "../slots/404";
3
5
  import { Footer } from "../slots/Footer";
@@ -6,7 +8,9 @@ import { Footer } from "../slots/Footer";
6
8
  */
7
9
 
8
10
  var NotFound = function NotFound() {
9
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
11
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SEO, {
12
+ title: "404: Not found"
13
+ }), /*#__PURE__*/React.createElement(Header, {
10
14
  isHomePage: false
11
15
  }), /*#__PURE__*/React.createElement(NotFoundPage, null), /*#__PURE__*/React.createElement(Footer, null));
12
16
  };
@@ -1,9 +1,3 @@
1
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
2
-
3
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
-
5
- 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; }
6
-
7
1
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
8
2
 
9
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."); }
@@ -18,14 +12,17 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
18
12
 
19
13
  import React, { useContext, useEffect, useState } from 'react';
20
14
  import { useParams, useLocation, useNavigate } from 'react-router-dom';
15
+ import { get } from 'lodash-es';
21
16
  import { Layout } from 'antd';
22
- import { useLocale } from 'dumi';
17
+ import { useLocale, useSiteData } from 'dumi';
18
+ import { SEO } from "../../slots/SEO";
23
19
  import { Header } from "../../slots/Header";
24
20
  import { ExampleSider } from "../../slots/ExampleSider";
25
21
  import { CodeRunner } from "../../slots/CodeRunner";
26
22
  import { getDemoInfo } from "../../slots/CodeRunner/utils";
27
23
  import { ThemeAntVContext } from "../../context";
28
24
  import styles from "./index.module.less";
25
+ import { getCurrentTitle } from "./utils";
29
26
  var Sider = Layout.Sider,
30
27
  Content = Layout.Content;
31
28
 
@@ -39,8 +36,6 @@ var Example = function Example() {
39
36
  var nav = useNavigate();
40
37
 
41
38
  var _useParams = useParams(),
42
- _useParams$language = _useParams.language,
43
- language = _useParams$language === void 0 ? 'zh' : _useParams$language,
44
39
  topic = _useParams.topic,
45
40
  example = _useParams.example;
46
41
  /** 示例页面的元数据信息 */
@@ -48,6 +43,10 @@ var Example = function Example() {
48
43
 
49
44
  var metaData = useContext(ThemeAntVContext);
50
45
  var locale = useLocale();
46
+
47
+ var _useSiteData = useSiteData(),
48
+ themeConfig = _useSiteData.themeConfig;
49
+
51
50
  var exampleTopics = metaData.meta.exampleTopics;
52
51
  var demo = hash.slice(1);
53
52
 
@@ -56,54 +55,29 @@ var Example = function Example() {
56
55
  currentDemo = _useState2[0],
57
56
  setCurrentDemo = _useState2[1];
58
57
 
58
+ var _useState3 = useState(false),
59
+ _useState4 = _slicedToArray(_useState3, 2),
60
+ isCollapsed = _useState4[0],
61
+ setIsCollapsed = _useState4[1];
62
+
63
+ var _useState5 = useState({}),
64
+ _useState6 = _slicedToArray(_useState5, 2),
65
+ title = _useState6[0],
66
+ setTitle = _useState6[1];
67
+
59
68
  useEffect(function () {
60
69
  if (topic && example && demo) {
61
70
  var targetDemoInfo = getDemoInfo(exampleTopics, topic, example, demo);
62
71
  setCurrentDemo(targetDemoInfo);
72
+ setTitle(getCurrentTitle(exampleTopics, topic, example));
63
73
  }
64
- }, [topic, example, hash]); // 提取出来获取 唯一value值的 方法
65
-
66
- var getPath = function getPath(item) {
67
- var _item$relativePath;
68
-
69
- if (!item) {// @todo 怀策
70
- // debugger
71
- }
72
-
73
- var demoSlug = (_item$relativePath = item.relativePath) === null || _item$relativePath === void 0 ? void 0 : _item$relativePath.replace(/\/demo\/(.*)\..*/, function (_, filename) {
74
- return "#".concat(filename);
75
- });
76
- return "/".concat(locale.id, "/examples/").concat(demoSlug);
77
- }; // 一级菜单,二级菜单 数据 treeData + 二级菜单,示例 数据 result 写成一个 一级,二级,示例的三层树结构 数据
78
-
79
-
80
- var transformNode = function transformNode(data, result) {
81
- return data.map(function (item) {
82
- var _result$find;
83
-
84
- if (item.children && !item.node) {
85
- return _objectSpread(_objectSpread({}, item), {}, {
86
- children: transformNode(item.children, result)
87
- });
88
- }
89
-
90
- var _item$node = item.node,
91
- frontmatter = _item$node.frontmatter,
92
- fields = _item$node.fields;
93
- return _objectSpread(_objectSpread({}, frontmatter), {}, {
94
- // 提前给二级菜单的key值加入 特殊值 好辨别
95
- value: "secondaryKey-".concat(fields === null || fields === void 0 ? void 0 : fields.slug),
96
- children: (_result$find = result.find(function (_ref) {
97
- var k = _ref.title;
98
- return k === frontmatter.title;
99
- })) === null || _result$find === void 0 ? void 0 : _result$find.children
100
- });
101
- });
102
- };
103
-
74
+ }, [topic, example, hash]);
104
75
  return /*#__PURE__*/React.createElement("div", {
105
76
  className: styles.example
106
- }, /*#__PURE__*/React.createElement(Header, {
77
+ }, /*#__PURE__*/React.createElement(SEO, {
78
+ title: title[locale.id],
79
+ lang: locale.id
80
+ }), /*#__PURE__*/React.createElement(Header, {
107
81
  isHomePage: false
108
82
  }), /*#__PURE__*/React.createElement(Layout, {
109
83
  className: styles.container
@@ -112,7 +86,8 @@ var Example = function Example() {
112
86
  width: 250,
113
87
  trigger: null,
114
88
  collapsible: true,
115
- className: styles.sider,
89
+ collapsed: isCollapsed,
90
+ className: styles.menuSider,
116
91
  theme: "light"
117
92
  }, currentDemo && /*#__PURE__*/React.createElement(ExampleSider, {
118
93
  showExampleDemoTitle: true,
@@ -132,7 +107,8 @@ var Example = function Example() {
132
107
  exampleTopics: exampleTopics,
133
108
  topic: topic,
134
109
  example: example,
135
- demo: demo
110
+ demo: demo,
111
+ size: get(themeConfig, 'editor.size', 0.38)
136
112
  }))));
137
113
  };
138
114
 
@@ -16,14 +16,6 @@
16
16
  flex: 1;
17
17
  background-color: #fff;
18
18
 
19
- .sider {
20
- height: 100%;
21
-
22
- .exampleList {
23
-
24
- }
25
- }
26
-
27
19
  .content {
28
20
  position: relative;
29
21
  height: 100%;
@@ -38,3 +30,53 @@
38
30
  }
39
31
  }
40
32
  }
33
+
34
+ .menuSider {
35
+ background-color: #f8f9fc;
36
+ border-right: 1px solid #ececec;
37
+
38
+ :global {
39
+ .ant-layout-sider-children {
40
+ overflow-y: hidden;
41
+ overflow-x: hidden;
42
+
43
+ &:hover {
44
+ overflow-y: auto;
45
+ }
46
+ }
47
+ }
48
+ }
49
+
50
+ .trigger {
51
+ font-size: 12px;
52
+ position: relative;
53
+ margin: auto;
54
+ color: #6c7f90;
55
+ left: -1px;
56
+ z-index: 4;
57
+ width: 22px;
58
+ cursor: pointer;
59
+ transition: color 0.3s;
60
+ border: 1px solid #ececec;
61
+ border-left: none;
62
+ background-color: #fff;
63
+ height: 66px;
64
+ box-sizing: border-box;
65
+ border-bottom-right-radius: 4px;
66
+ border-top-right-radius: 4px;
67
+ text-align: center;
68
+
69
+ &[type='menu-unfold'] {
70
+ background-color: #f8f9fc;
71
+ }
72
+
73
+ svg {
74
+ position: absolute;
75
+ left: 3px;
76
+ top: 25px;
77
+ }
78
+ }
79
+
80
+ .trigger:hover {
81
+ color: @primary-color;
82
+ }
@@ -0,0 +1 @@
1
+ export declare function getCurrentTitle(exampleTopics: any, topic: any, example: any): any;
@@ -0,0 +1,9 @@
1
+ export function getCurrentTitle(exampleTopics, topic, example) {
2
+ var topicItem = exampleTopics.find(function (item) {
3
+ return item.id === topic;
4
+ });
5
+ var exmapleItem = topicItem.examples.find(function (item) {
6
+ return item.id === example;
7
+ });
8
+ return exmapleItem.title;
9
+ }
@@ -17,15 +17,18 @@ export var DemoCard = function DemoCard(props) {
17
17
  var locale = useLocale();
18
18
 
19
19
  var renderCardInternal = function renderCardInternal() {
20
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("img", {
21
- src: demo.screenshot || 'https://gw.alipayobjects.com/os/s/prod/antv/assets/image/screenshot-placeholder-b8e70.png',
22
- alt: demo.title[locale.id]
23
- })));
20
+ var img = demo.screenshot || 'https://gw.alipayobjects.com/os/s/prod/antv/assets/image/screenshot-placeholder-b8e70.png';
21
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
22
+ style: {
23
+ backgroundImage: "url(\"".concat(img, "\")"),
24
+ backgroundSize: 'cover'
25
+ }
26
+ }));
24
27
  };
25
28
 
26
29
  return /*#__PURE__*/React.createElement(Link, {
27
30
  className: styles.galleryCardLink,
28
- to: "/".concat(locale.id, "/examples/").concat(topicId, "/").concat(exampleId, "/#").concat(demo.id)
31
+ to: "".concat(locale.id == 'zh' ? '' : '/en', "/examples/").concat(topicId, "/").concat(exampleId, "/#").concat(demo.id)
29
32
  }, demo.isNew ? /*#__PURE__*/React.createElement(Badge.Ribbon, {
30
33
  text: "new",
31
34
  className: styles.customRibbon
@@ -11,8 +11,11 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
11
11
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
12
12
 
13
13
  import React from 'react';
14
- import { useContext } from 'react';
14
+ import { useContext, useEffect } from 'react';
15
+ import { useNavigate } from 'react-router-dom';
15
16
  import { BackTop, Layout as AntLayout } from 'antd';
17
+ import { useLocale } from 'dumi';
18
+ import { SEO } from "../../slots/SEO";
16
19
  import { Header } from "../../slots/Header";
17
20
  import { Footer } from "../../slots/Footer";
18
21
  import NavigatorBanner from "../../slots/Header/Products/NavigatorBanner";
@@ -30,7 +33,10 @@ import styles from "./index.module.less";
30
33
  */
31
34
 
32
35
  var Example = function Example() {
36
+ var nav = useNavigate();
37
+ var locale = useLocale();
33
38
  /** 示例页面的元数据信息 */
39
+
34
40
  var metaData = useContext(ThemeAntVContext);
35
41
  var exampleTopics = metaData.meta.exampleTopics;
36
42
 
@@ -39,7 +45,21 @@ var Example = function Example() {
39
45
  prev = _usePrevAndNext2[0],
40
46
  next = _usePrevAndNext2[1];
41
47
 
42
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
48
+ var title = {
49
+ zh: '所有图表',
50
+ en: "Gallery"
51
+ }; // 为 zh 做兜底
52
+
53
+ useEffect(function () {
54
+ var p = window.location.pathname;
55
+
56
+ if (p.includes('/zh/')) {
57
+ nav(p.replace('/zh/', '/'));
58
+ }
59
+ }, []);
60
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SEO, {
61
+ title: title[locale.id]
62
+ }), /*#__PURE__*/React.createElement(Header, {
43
63
  isHomePage: false
44
64
  }), /*#__PURE__*/React.createElement(AntLayout, {
45
65
  hasSider: true,
@@ -268,6 +268,7 @@
268
268
  .sider {
269
269
  width: 280px !important;
270
270
  height: inherit;
271
+ background-color: #fff;
271
272
 
272
273
  // menu 滚动
273
274
  :global {
@@ -282,6 +283,7 @@
282
283
  }
283
284
 
284
285
  .affix {
286
+ background-color: #fff;
285
287
  & > div {
286
288
  height: 100%;
287
289
  }
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
+ import { ExampleTopic, Example, Demo } from '../../types';
2
3
  export interface AnnouncementProps {
3
4
  message: React.ReactNode;
4
5
  localStorageId: string;
@@ -9,19 +10,19 @@ export interface GalleryPageContentProps {
9
10
  /**
10
11
  * 案例主题列表
11
12
  */
12
- exampleTopics: ExamplesPage.ExampleTopic[];
13
+ exampleTopics: ExampleTopic[];
13
14
  }
14
15
  export interface LeftMenuProps {
15
16
  /**
16
17
  * 案例主题列表
17
18
  */
18
- exampleTopics: ExamplesPage.ExampleTopic[];
19
+ exampleTopics: ExampleTopic[];
19
20
  }
20
- export interface ExampleWithTopic extends ExamplesPage.Example {
21
- targetTopic: ExamplesPage.ExampleTopic;
21
+ export interface ExampleWithTopic extends Example {
22
+ targetTopic: ExampleTopic;
22
23
  }
23
24
  export interface DemoCardProps {
24
- demo: ExamplesPage.Demo;
25
+ demo: Demo;
25
26
  topicId: string;
26
27
  exampleId: string;
27
28
  }
@@ -29,5 +30,5 @@ export interface LeftMenuProps {
29
30
  /**
30
31
  * 案例主题列表
31
32
  */
32
- exampleTopics: ExamplesPage.ExampleTopic[];
33
+ exampleTopics: ExampleTopic[];
33
34
  }
@@ -1,7 +1,21 @@
1
+ import { Example, ExampleTopic } from '../types';
1
2
  /**
2
3
  * 获取案例页面的所有主题
3
4
  *
4
- * @returns {ExamplesPage.ExampleTopic[]} 案例主题列表
5
+ * @returns {ExampleTopic[]} 案例主题列表
5
6
  * @author YuZhanglong <loveyzl1123@gmail.com>
6
7
  */
7
- export declare const getExamplesPageTopics: () => ExamplesPage.ExampleTopic[];
8
+ export declare const getExamplesPageTopics: (exampleTopics: ExampleTopic[]) => {
9
+ id: string;
10
+ title: {
11
+ zh: string;
12
+ en: string;
13
+ };
14
+ icon: string;
15
+ examples: Example[];
16
+ childrenKey: string;
17
+ }[];
18
+ /**
19
+ * 根据目录结构返回,所有的 example 页面,用于 buiild static
20
+ */
21
+ export declare function getExamplePaths(): string[];
@@ -22,6 +22,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
22
22
  // src/plugin/examples.ts
23
23
  var examples_exports = {};
24
24
  __export(examples_exports, {
25
+ getExamplePaths: () => getExamplePaths,
25
26
  getExamplesPageTopics: () => getExamplesPageTopics
26
27
  });
27
28
  module.exports = __toCommonJS(examples_exports);
@@ -35,7 +36,7 @@ var getExampleDemos = (exampleDir) => {
35
36
  const demoMeta = JSON.parse(demoMetaJSON).demos;
36
37
  const demos = demoMeta.map((item) => {
37
38
  const { title, screenshot, filename, new: isNew } = item;
38
- const id = filename.replace(/\.tsx?$/, "");
39
+ const id = filename.replace(/\.tsx?$/, "").replace(/\.ts?$/, "").replace(/\.jsx?$/, "").replace(/\.js?$/, "");
39
40
  return {
40
41
  id,
41
42
  screenshot,
@@ -63,21 +64,42 @@ var getTopicExamples = (topicPath) => {
63
64
  title: {
64
65
  en: exampleMetaEnContent.attributes.title,
65
66
  zh: exampleMetaZhContent.attributes.title
66
- }
67
+ },
68
+ childrenKey: "demos",
69
+ order: exampleMetaZhContent.attributes.order || 0
67
70
  };
68
71
  return example;
69
- });
72
+ }).sort((a, b) => a.order - b.order);
70
73
  };
71
- var getExamplesPageTopics = () => {
72
- const exampleTopicPaths = glob.sync(`${examplesBaseDir}/*`);
73
- return exampleTopicPaths.map((topicPath) => {
74
- const topicMetaPath = path.resolve(topicPath, "meta.js");
75
- const topicMeta = require(topicMetaPath);
76
- topicMeta.examples = getTopicExamples(topicPath);
77
- return topicMeta;
74
+ var getExamplesPageTopics = (exampleTopics) => {
75
+ return exampleTopics.map(({ id, slug, title, icon }) => {
76
+ const nid = id || slug;
77
+ let examples = [];
78
+ try {
79
+ examples = getTopicExamples(path.join(examplesBaseDir, nid));
80
+ } catch (e) {
81
+ console.warn(e);
82
+ }
83
+ return {
84
+ id: nid,
85
+ title,
86
+ icon,
87
+ examples,
88
+ childrenKey: "examples"
89
+ };
78
90
  });
79
91
  };
92
+ function getExamplePaths() {
93
+ const exampleTopicPaths = glob.sync(`${examplesBaseDir}/*/*`);
94
+ const paths = exampleTopicPaths.map((p) => p.replace(process.cwd(), ""));
95
+ return [
96
+ ...paths,
97
+ ...paths.map((p) => `/zh${p}`),
98
+ ...paths.map((p) => `/en${p}`)
99
+ ];
100
+ }
80
101
  // Annotate the CommonJS export names for ESM import in node:
81
102
  0 && (module.exports = {
103
+ getExamplePaths,
82
104
  getExamplesPageTopics
83
105
  });