@antv/dumi-theme-antv 0.8.0-beta.2 → 0.8.0-beta.21

package/dist/pages/Index/components/Features/FeatureCard.module.less

@@ -17,7 +17,6 @@
 
     .title {
       font-size: 1.714em;
-      color: #000;
       margin-top: 28px;
       margin-bottom: 11px;
       font-family: AlibabaPuHuiTiM;
@@ -29,7 +28,7 @@
     .description {
       opacity: 0.6;
       width: 100%;
-      color: rgba(105, 123, 140, 1);
+      color: rgba(105, 123, 140, 100%);
       font-size: 1em;
       line-height: 1.8em;
       margin-top: 11px;
@@ -42,7 +41,7 @@
   .cards {
     .cardWrapper {
       .card {
-        margin: 84px 19px 80px 19px;
+        margin: 84px 19px 80px;
 
         .content {
           .icon {
@@ -56,8 +55,8 @@
 
           .description {
             font-size: 1em;
-            padding-bottom: 0px;
-            padding-top: 0px;
+            padding-bottom: 0;
+            padding-top: 0;
             margin-top: 12px;
           }
         }

package/dist/pages/Index/components/Features/index.module.less

@@ -21,7 +21,7 @@
 
   .title {
     font-weight: 500;
-    margin: 17px 0 0 0;
+    margin: 17px 0 0;
     position: relative;
     font-family: AlibabaPuHuiTiB;
     font-size: 40px;
@@ -52,9 +52,9 @@
     display: flex;
     justify-content: center;
     width: 100%;
-    background-color: #ffffff;
+    background-color: #fff;
     border: 1px solid #e5e8ef;
-    box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.03);
+    box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 3%);
     border-radius: 16px;
     overflow: hidden;
   }
@@ -77,12 +77,12 @@
 
           .cardWrapper {
             flex: none;
-            margin: 0 0 28px 0;
+            margin: 0 0 28px;
             width: 100%;
             max-width: 100%;
 
             &:last-child {
-              margin: 0 0 30px 0;
+              margin: 0 0 30px;
             }
           }
         }

package/dist/pages/Index/components/_.less

@@ -81,30 +81,30 @@ h6 {
       width: 100%;
       height: 11px;
       margin: -5px 0;
-      border-top: 5px solid rgba(255, 255, 255, 0);
-      border-bottom: 5px solid rgba(255, 255, 255, 0);
+      border-top: 5px solid rgba(255, 255, 255, 0%);
+      border-bottom: 5px solid rgba(255, 255, 255, 0%);
       cursor: row-resize;
 
       &:hover {
-        border-top: 5px solid rgba(0, 0, 0, 0.5);
-        border-bottom: 5px solid rgba(0, 0, 0, 0.5);
+        border-top: 5px solid rgba(0, 0, 0, 50%);
+        border-bottom: 5px solid rgba(0, 0, 0, 50%);
       }
     }
 
     &.vertical {
       width: 11px;
       margin: 0 -5px;
-      border-right: 5px solid rgba(255, 255, 255, 0);
-      border-left: 5px solid rgba(255, 255, 255, 0);
+      border-right: 5px solid rgba(255, 255, 255, 0%);
+      border-left: 5px solid rgba(255, 255, 255, 0%);
       cursor: col-resize;
 
-      Pane2 {
+      pane2 {
         border-left: 1px solid #e6e6e6;
       }
 
       &:hover {
-        border-right: 5px solid rgba(0, 0, 0, 0.5);
-        border-left: 5px solid rgba(0, 0, 0, 0.5);
+        border-right: 5px solid rgba(0, 0, 0, 50%);
+        border-left: 5px solid rgba(0, 0, 0, 50%);
       }
     }
 

package/dist/slots/Banner/Notification.module.less

@@ -17,7 +17,7 @@
 
     .content {
       padding-left: 20px;
-      color: rgba(49, 70, 89, 1);
+      color: rgba(49, 70, 89, 100%);
       text-align: left;
 
       .description {
@@ -28,7 +28,7 @@
       }
 
       .date {
-        color: rgba(216, 203, 249, 1);
+        color: rgba(216, 203, 249, 100%);
         bottom: 0;
         font-size: 1em;
         margin-top: 4px;
@@ -38,7 +38,7 @@
   }
 
   &:hover .description {
-    color: rgba(89, 126, 247, 1);
+    color: rgba(89, 126, 247, 100%);
   }
 }
 
@@ -67,12 +67,12 @@
 @keyframes showAndHide0 {
   0% {
     opacity: 1;
-    top: 0px;
+    top: 0;
   }
 
   33.3% {
     opacity: 1;
-    top: 0px;
+    top: 0;
   }
 
   50% {
@@ -87,7 +87,7 @@
 
   100% {
     opacity: 1;
-    top: 0px;
+    top: 0;
   }
 }
 
@@ -105,12 +105,12 @@
 
   50% {
     opacity: 1;
-    top: 0px;
+    top: 0;
   }
 
   83.3% {
     opacity: 1;
-    top: 0px;
+    top: 0;
   }
 
   100% {

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

@@ -3,13 +3,14 @@
 .wrapper {
   min-height: 650px;
   max-height: 803px;
-  background: linear-gradient(225deg, #ffffff, #f0f5ff);
+  background: linear-gradient(225deg, #fff, #f0f5ff);
   height: calc(94vh);
   position: relative;
   overflow: hidden;
 
   .content {
     .container1440();
+
     height: 100%;
     position: relative;
   }
@@ -23,14 +24,14 @@
     .title {
       font-size: 3.4em; //2.875em;
       font-weight: 800;
-      color: rgba(0, 0, 0, 1);
+      color: rgba(0, 0, 0, 100%);
       position: relative;
     }
 
     .description {
       margin-top: 0.83%; //12px;
-      margin-bottom: 0px;
-      color: rgba(106, 123, 140, 1);
+      margin-bottom: 0;
+      color: rgba(106, 123, 140, 100%);
       font-size: 1.14em;
       font-weight: 200;
       position: relative;
@@ -162,6 +163,7 @@
           .gh-count {
             position: relative;
             display: none;
+
             /* hidden to start */
             margin-left: 52px;
             margin-top: 7px;
@@ -183,8 +185,8 @@
             color: #4183c4;
           }
 
-          .gh-count:before,
-          .gh-count:after {
+          .gh-count::before,
+          .gh-count::after {
             content: '';
             position: absolute;
             display: inline-block;
@@ -194,7 +196,7 @@
             border-style: solid;
           }
 
-          .gh-count:before {
+          .gh-count::before {
             top: 50%;
             left: -3px;
             margin-top: -5px;
@@ -202,7 +204,7 @@
             border-right-color: #fafafa;
           }
 
-          .gh-count:after {
+          .gh-count::after {
             top: 50%;
             border-width: 5px 5px 5px 0;
             border-right-color: #d4d4d4;
@@ -228,7 +230,6 @@
     display: flex;
     position: absolute;
     right: 0;
-    margin-top: -300px;
     width: 52%;
     max-width: 598px;
     height: 324px;

package/dist/slots/CodeEditor/Toolbar.js

@@ -10,10 +10,9 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 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); }
 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); }
-import { CodeSandboxOutlined, PlayCircleOutlined, ReloadOutlined, ThunderboltOutlined } from '@ant-design/icons';
+import { PlayCircleOutlined, ReloadOutlined, ThunderboltOutlined } from '@ant-design/icons';
 import stackblitzSdk from '@stackblitz/sdk';
 import { Tooltip, Typography } from 'antd';
-import { getParameters } from 'codesandbox/lib/api/define';
 import { FormattedMessage, useLocale } from 'dumi';
 import React, { useEffect, useState } from 'react';
 import { ping } from "../utils";
@@ -44,7 +43,9 @@ export var Toolbar = function Toolbar(_ref) {
     onToggleFullscreen = _ref$onToggleFullscre === void 0 ? null : _ref$onToggleFullscre,
     onExecuteCode = _ref.onExecuteCode,
     onClickAI = _ref.onClickAI,
-    onReload = _ref.onReload;
+    onReload = _ref.onReload,
+    _ref$showAI = _ref.showAI,
+    showAI = _ref$showAI === void 0 ? true : _ref$showAI;
   var locale = useLocale();
   var exampleTitle = _typeof(title) === 'object' ? title[locale.id] : title;
 
@@ -80,7 +81,7 @@ export var Toolbar = function Toolbar(_ref) {
         return onEditorTabChange(tab);
       }
     }, tab, " ", slot && slot);
-  })), /*#__PURE__*/React.createElement("a", {
+  })), showAI ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("a", {
     className: styles.ai,
     onClick: onClickAI
   }, /*#__PURE__*/React.createElement(FormattedMessage, {
@@ -92,7 +93,7 @@ export var Toolbar = function Toolbar(_ref) {
   }, /*#__PURE__*/React.createElement("span", {
     className: styles.ai,
     onClick: onReload
-  }, /*#__PURE__*/React.createElement(ReloadOutlined, null))), riddleVisible ? /*#__PURE__*/React.createElement("form", {
+  }, /*#__PURE__*/React.createElement(ReloadOutlined, null)))) : null, riddleVisible ? /*#__PURE__*/React.createElement("form", {
     action: "//riddle.alibaba-inc.com/riddles/define",
     method: "POST",
     target: "_blank"
@@ -117,26 +118,7 @@ export var Toolbar = function Toolbar(_ref) {
     onClick: function onClick() {
       stackblitzSdk.openProject(stackblitzPrefillConfig);
     }
-  })), /*#__PURE__*/React.createElement(Tooltip, {
-    title: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "ai.toolbar.open.codesandbox"
-    })
-  }, /*#__PURE__*/React.createElement("form", {
-    action: "https://codesandbox.io/api/v1/sandboxes/define",
-    method: "POST",
-    target: "_blank"
-  }, /*#__PURE__*/React.createElement("input", {
-    type: "hidden",
-    name: "parameters",
-    value: getParameters(codeSandboxConfig)
-  }), /*#__PURE__*/React.createElement("button", {
-    type: "submit",
-    className: styles.codesandbox
-  }, /*#__PURE__*/React.createElement(CodeSandboxOutlined, {
-    style: {
-      marginLeft: 8
-    }
-  })))), /*#__PURE__*/React.createElement(Paragraph, {
+  })), /*#__PURE__*/React.createElement(Paragraph, {
     copyable: {
       text: sourceCode
     },

package/dist/slots/CodeEditor/index.js

@@ -13,9 +13,9 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 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; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import MonacoEditor, { loader } from '@monaco-editor/react';
-import { Drawer, Switch } from 'antd';
+import { Button, Drawer, Switch, Tooltip } from 'antd';
 import { autoType as d3AutoType, dsvFormat } from 'd3-dsv';
-import { useLocale, useSiteData, useIntl } from 'dumi';
+import { useIntl, useLocale, useLocation, useSiteData } from 'dumi';
 import { debounce, noop } from 'lodash-es';
 import { format } from 'prettier';
 import parserBabel from 'prettier/parser-babel';
@@ -26,6 +26,7 @@ import styles from "./index.module.less";
 import { EDITOR_TABS, Toolbar } from "./Toolbar";
 import { compile, execute, replaceInsertCss } from "./utils";
 import MsgBox from "../../pages/AIPlayground/components/MsgBox";
+import { ClearOutlined } from '@ant-design/icons';
 loader.config({
   'vs/nls': {
     availableLanguages: {
@@ -57,7 +58,11 @@ var CodeEditor = function CodeEditor(_ref) {
     _ref$onError = _ref.onError,
     onError = _ref$onError === void 0 ? noop : _ref$onError,
     _ref$onFullscreen = _ref.onFullscreen,
-    onFullscreen = _ref$onFullscreen === void 0 ? noop : _ref$onFullscreen;
+    onFullscreen = _ref$onFullscreen === void 0 ? noop : _ref$onFullscreen,
+    _ref$showAI = _ref.showAI,
+    showAI = _ref$showAI === void 0 ? true : _ref$showAI,
+    style = _ref.style;
+  var umiLocation = useLocation();
   var locale = useLocale();
   var _useSiteData = useSiteData(),
     themeConfig = _useSiteData.themeConfig;
@@ -104,8 +109,12 @@ var CodeEditor = function CodeEditor(_ref) {
     setCurrentEditorTab = _useState12[1];
   var _useState13 = useState(false),
     _useState14 = _slicedToArray(_useState13, 2),
-    showAI = _useState14[0],
-    setShowAI = _useState14[1];
+    showAIDrawer = _useState14[0],
+    setShowAIDrawer = _useState14[1];
+  var _useState15 = useState("_"),
+    _useState16 = _slicedToArray(_useState15, 2),
+    msgBoxKey = _useState16[0],
+    setMsgBoxKey = _useState16[1];
   var containerId = "playgroundScriptContainer_".concat(exampleId);
 
   // 出发 auto resize
@@ -281,7 +290,7 @@ var CodeEditor = function CodeEditor(_ref) {
   // 用于更新当前 example 的 spec 和 data
   useEffect(function () {
     setCurrentEditorTab(EDITOR_TABS.JAVASCRIPT);
-    setShowAI(false);
+    setShowAIDrawer(false);
   }, [exampleId]);
 
   // hook 用户的数据
@@ -385,13 +394,14 @@ var CodeEditor = function CodeEditor(_ref) {
     }
   };
   var onClickAI = function onClickAI() {
-    setShowAI(true);
+    setShowAIDrawer(true);
   };
   var onReload = function onReload() {
     setCode(source);
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: styles.editor
+    className: styles.editor,
+    style: style
   }, /*#__PURE__*/React.createElement(Toolbar, {
     fileExtension: fileExtension,
     sourceCode: code,
@@ -407,6 +417,7 @@ var CodeEditor = function CodeEditor(_ref) {
     onEditorTabChange: onTabChange,
     onToggleFullscreen: onFullscreen,
     onClickAI: onClickAI,
+    showAI: showAI,
     onReload: onReload,
     slots: {
       Spec: /*#__PURE__*/React.createElement("span", {
@@ -460,16 +471,27 @@ var CodeEditor = function CodeEditor(_ref) {
         monacoRef.current = editor;
       }
     }), /*#__PURE__*/React.createElement(Drawer, {
-      placement: "right",
       closable: true,
-      open: showAI,
+      open: showAIDrawer,
       getContainer: false,
       onClose: function onClose() {
-        return setShowAI(false);
+        return setShowAIDrawer(false);
       },
       rootClassName: styles.drawer,
-      width: '90%'
+      width: '80%',
+      key: "".concat(umiLocation.hash, "_").concat(umiLocation.key),
+      extra: /*#__PURE__*/React.createElement(Tooltip, {
+        title: intl.formatMessage({
+          id: 'ai.toolbar.clear.conversation'
+        })
+      }, /*#__PURE__*/React.createElement(Button, {
+        type: "link",
+        onClick: function onClick() {
+          return setMsgBoxKey(crypto.randomUUID());
+        }
+      }, /*#__PURE__*/React.createElement(ClearOutlined, null)))
     }, /*#__PURE__*/React.createElement(MsgBox, {
+      key: "".concat(umiLocation.hash, "_").concat(umiLocation.key, "_").concat(msgBoxKey),
       simple: true,
       messages: [{
         id: crypto.randomUUID(),

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

@@ -12,18 +12,20 @@
 
 .drawer{
   margin-top: 36px;
+
   :global {
     .ant-drawer-content {
       background: #f8f9fc;
+
       div.ant-drawer-header {
         padding-bottom: unset;
         border-bottom: unset;
-        flex-direction: row-reverse;
 
         .ant-drawer-header-title {
           flex: unset;
         }
       }
+
       .ant-drawer-body{
         display: flex;
         flex-direction: column;

package/dist/slots/CodeEditor/utils.js

@@ -75,7 +75,8 @@ export function getStackblitzConfig(title, sourceCode, fileExtension, deps, devD
   return {
     title: title || '',
     description: '',
-    template: 'create-react-app',
+    // https://developer.stackblitz.com/platform/api/javascript-sdk-options#projecttemplate
+    template: playground.template || 'typescript',
     dependencies: deps,
     files: _defineProperty(_defineProperty({}, "index.".concat(fileExtension.startsWith('ts') ? 'ts' : 'js'), sourceCode), 'index.html', playground.container || '<div id="container" />')
   };

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

@@ -2,10 +2,8 @@
   width: 100%;
   height: 100%;
   position: relative;
-
   padding: 24px;
   overflow: auto;
-
   display: flex;
   flex-direction: column;
 
@@ -46,7 +44,6 @@
       position: absolute;
       top: 0;
       left: 0;
-
       background: #fff;
     }
   }

package/dist/slots/CodeRunner/index.js

@@ -32,7 +32,11 @@ var CodeRunner = function CodeRunner(_ref) {
     replaceId = _ref.replaceId,
     isPlayground = _ref.isPlayground,
     _ref$notFound = _ref.notFound,
-    notFound = _ref$notFound === void 0 ? /*#__PURE__*/React.createElement(NotFound, null) : _ref$notFound;
+    notFound = _ref$notFound === void 0 ? /*#__PURE__*/React.createElement(NotFound, null) : _ref$notFound,
+    _ref$showAI = _ref.showAI,
+    showAI = _ref$showAI === void 0 ? true : _ref$showAI,
+    _ref$showEditor = _ref.showEditor,
+    showEditor = _ref$showEditor === void 0 ? true : _ref$showEditor;
   var demoInfo = getDemoInfo(exampleTopics, topic, example, demo);
 
   // 找不到，啥也别干了，404 页面
@@ -59,18 +63,13 @@ var CodeRunner = function CodeRunner(_ref) {
     githubUrl: githubUrl
   });
   var exampleId = "".concat(topic, "_").concat(example, "_").concat(demo);
-  return /*#__PURE__*/React.createElement(InViewSuspense, {
-    fallback: null
-  }, /*#__PURE__*/React.createElement(SplitPane, {
-    split: "vertical",
-    defaultSize: "".concat((1 - size) * 100, "%"),
-    minSize: 100
-  }, /*#__PURE__*/React.createElement(CodePreview, {
+  var codePreview = /*#__PURE__*/React.createElement(CodePreview, {
     exampleId: exampleId,
     error: error,
     header: header,
     isPlayground: isPlayground
-  }), /*#__PURE__*/React.createElement(ClientOnly, null, /*#__PURE__*/React.createElement(CodeEditor, {
+  });
+  var codeEditor = /*#__PURE__*/React.createElement(ClientOnly, null, /*#__PURE__*/React.createElement(CodeEditor, {
     exampleId: exampleId,
     source: source,
     relativePath: relativePath,
@@ -80,7 +79,20 @@ var CodeRunner = function CodeRunner(_ref) {
     onDestroy: noop,
     onReady: noop,
     playground: playground,
-    title: ic(title)
-  }))));
+    title: ic(title),
+    showAI: showAI,
+    style: {
+      display: showEditor ? 'block' : 'none'
+    }
+  }));
+  return /*#__PURE__*/React.createElement(InViewSuspense, {
+    fallback: null
+  },
+  // @ts-ignore
+  showEditor ? /*#__PURE__*/React.createElement(SplitPane, {
+    split: "vertical",
+    defaultSize: "".concat((1 - size) * 100, "%"),
+    minSize: 100
+  }, codePreview, codeEditor) : /*#__PURE__*/React.createElement(React.Fragment, null, codePreview, codeEditor));
 };
 export default CodeRunner;

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

@@ -1,8 +1,9 @@
 :global {
   ul.dumi-default-toc {
     > li {
-      margin-left: 0px !important;
+      margin-left: 0 !important;
     }
+
     .active {
       color: #873bf4 !important;
       border-left: 3px solid #873bf4 !important;

package/dist/slots/Detail/News.module.less

@@ -1,9 +1,9 @@
 .news {
   width: 50%;
   margin-right: 2%;
-  background-color: #ffffff;
+  background-color: #fff;
   border: 1px solid #e5e8ef;
-  box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 5%);
   border-radius: 16px;
   height: 100%;
   font-size: 14px;
@@ -91,13 +91,13 @@
 @keyframes showAndHide0 {
   0% {
     opacity: 1;
-    top: 0px;
+    top: 0;
     z-index: 1;
   }
 
   33.3% {
     opacity: 0;
-    top: 0px;
+    top: 0;
     z-index: 0;
   }
 
@@ -109,7 +109,7 @@
 
   100% {
     opacity: 1;
-    top: 0px;
+    top: 0;
     z-index: 1;
   }
 }
@@ -123,13 +123,13 @@
 
   33.3% {
     opacity: 1;
-    top: 0px;
+    top: 0;
     z-index: 1;
   }
 
   66.6% {
     opacity: 0;
-    top: 0px;
+    top: 0;
     z-index: 0;
   }
 
@@ -155,13 +155,13 @@
 
   66.6% {
     opacity: 1;
-    top: 0px;
+    top: 0;
     z-index: 1;
   }
 
   100% {
     opacity: 0;
-    top: 0px;
+    top: 0;
     z-index: 0;
   }
 }

package/dist/slots/Detail/index.js

@@ -23,6 +23,7 @@ import { News } from "./News";
 import { ic } from "../hooks";
 import styles from "./index.module.less";
 import { HomeDialog } from "../../components/AI/HomeDialog";
+import { getBaseSiteDataUrl } from "../../utils/env";
 /**
  * Index.技术栈的描述区域！
  * 各自配置
@@ -48,7 +49,7 @@ export var Detail = function Detail(_ref) {
     setRemoteNews = _useState2[1];
   var lang = useLocale().id;
   useEffect(function () {
-    fetch('https://assets.antv.antgroup.com/antv/banner-messages.json' // 生产环境
+    fetch("".concat(getBaseSiteDataUrl(), "/antv/banner-messages.json") // 生产环境
     // 'https://site-data-pre.alipay.com/antv/banner-messages.json', // 预发测试
     ).then(function (res) {
       return res.json();