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

package/dist/pages/AIPlayground/components/MsgBox/index.js

@@ -1,21 +1,27 @@
+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."); }
 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); }
 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; }
 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 { CheckOutlined, CopyOutlined, DislikeOutlined, LikeOutlined, PlusSquareOutlined, SyncOutlined } from '@ant-design/icons';
+import { Bubble } from '@ant-design/x';
+import { Button, Flex, Space, Tooltip } from 'antd';
+import { history, useSiteData, useIntl } from 'dumi';
+import { findLast } from 'lodash-es';
 import React, { useEffect, useState } from 'react';
+import { useCopyToClipboard } from 'react-use';
+import { useSnapshot } from 'valtio';
 import { PromptTextarea } from "../../../../components/AI/HomeDialog/PromptTextarea";
-import { Flex, Space } from 'antd';
-import { Bubble } from '@ant-design/x';
-import { history } from 'dumi';
 import { useStreamingText } from "../../../../hooks/useStreamingText";
-import { PlusSquareOutlined } from "@ant-design/icons";
-import styles from "./index.module.less";
-import { useSnapshot } from 'valtio';
-import { AIChatStore, createNewSession, derivedState } from "../../../../model/AIChat";
-import { findLast } from "lodash-es";
+import { AIChatStore, clearEmptySession, createPureNewSession, derivedState } from "../../../../model/AIChat";
+import { getCodeFromMarkdown, isPreviewable } from "../../../../utils/code";
 import { MarkdownComponent } from "../MarkdownComponent";
+import styles from "./index.module.less";
 var avatar = {
   icon: /*#__PURE__*/React.createElement("img", {
     draggable: false,
@@ -24,47 +30,78 @@ var avatar = {
   }),
   style: {
     borderRadius: 0,
-    backgroundColor: "transparent"
+    backgroundColor: 'transparent'
   }
 };
 var chatScrollIntoView = function chatScrollIntoView() {
   setTimeout(function () {
-    var nodeList = document.querySelectorAll(".ant-bubble");
+    var nodeList = document.querySelectorAll('.ant-bubble');
     nodeList[nodeList.length - 1].scrollIntoView({
-      behavior: "smooth",
-      block: "center"
+      behavior: 'smooth'
     });
   });
 };
 function MsgBox(props) {
-  var _derivedSnap$activeSe, _findLast, _derivedSnap$activeSe2, _ref, _props$messages, _derivedSnap$activeSe3;
-  var _useState = useState(''),
+  var _derivedSnap$activeSe, _derivedSnap$activeSe2, _derivedSnap$activeSe3;
+  var _props$messages = props.messages,
+    messages = _props$messages === void 0 ? [] : _props$messages,
+    _props$simple = props.simple,
+    simple = _props$simple === void 0 ? false : _props$simple,
+    _props$context = props.context,
+    context = _props$context === void 0 ? '' : _props$context,
+    onCodegen = props.onCodegen,
+    title = props.title;
+  var _useSiteData = useSiteData(),
+    themeConfig = _useSiteData.themeConfig;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var _useState = useState(!themeConfig.isAntVSite ? themeConfig.title : undefined),
     _useState2 = _slicedToArray(_useState, 2),
-    promptText = _useState2[0],
-    setPromptText = _useState2[1];
-  var _useState3 = useState(false),
+    lib = _useState2[0],
+    setLib = _useState2[1];
+  var _useState3 = useState(''),
     _useState4 = _slicedToArray(_useState3, 2),
-    isStreaming = _useState4[0],
-    setIsStreaming = _useState4[1]; // trigger
+    promptText = _useState4[0],
+    setPromptText = _useState4[1];
   var _useState5 = useState(false),
     _useState6 = _slicedToArray(_useState5, 2),
-    loading = _useState6[0],
-    setLoading = _useState6[1];
+    isStreaming = _useState6[0],
+    setIsStreaming = _useState6[1]; // trigger
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    loading = _useState8[0],
+    setLoading = _useState8[1];
   var snap = useSnapshot(AIChatStore);
   var derivedSnap = useSnapshot(derivedState);
+  var _useCopyToClipboard = useCopyToClipboard(),
+    _useCopyToClipboard2 = _slicedToArray(_useCopyToClipboard, 2),
+    copyState = _useCopyToClipboard2[0],
+    copyToClipboard = _useCopyToClipboard2[1];
+  var latestUserMessage = findLast((_derivedSnap$activeSe = derivedSnap.activeSession) === null || _derivedSnap$activeSe === void 0 ? void 0 : _derivedSnap$activeSe.messages, function (msg) {
+    return msg.role === 'user';
+  });
+  var _useState9 = useState(''),
+    _useState10 = _slicedToArray(_useState9, 2),
+    fileSummary = _useState10[0],
+    setFileSummary = _useState10[1];
   var streamingText = useStreamingText({
-    url: 'http://127.0.0.1:7001/ai/chat',
+    url: 'https://webgw-pre.alipay.com/visqaservice/external/chat',
     method: 'POST',
     body: {
-      "gptConversationId": (_derivedSnap$activeSe = derivedSnap.activeSession) === null || _derivedSnap$activeSe === void 0 ? void 0 : _derivedSnap$activeSe.id,
-      "query": (_findLast = findLast((_derivedSnap$activeSe2 = derivedSnap.activeSession) === null || _derivedSnap$activeSe2 === void 0 ? void 0 : _derivedSnap$activeSe2.messages, function (msg) {
-        return msg.role === 'user';
-      })) === null || _findLast === void 0 ? void 0 : _findLast.content
+      gptConversationId: (_derivedSnap$activeSe2 = derivedSnap.activeSession) === null || _derivedSnap$activeSe2 === void 0 ? void 0 : _derivedSnap$activeSe2.id,
+      query: latestUserMessage === null || latestUserMessage === void 0 ? void 0 : latestUserMessage.content,
+      library: (latestUserMessage === null || latestUserMessage === void 0 ? void 0 : latestUserMessage.lib) || lib,
+      mode: latestUserMessage === null || latestUserMessage === void 0 ? void 0 : latestUserMessage.mode,
+      anonymousUserId: snap.anonymousUserId,
+      context: (latestUserMessage === null || latestUserMessage === void 0 ? void 0 : latestUserMessage.context) || context,
+      mountId: "container"
     },
     trigger: isStreaming,
     // 将 isStreaming 状态作为 trigger
     headers: {
-      'Content-Type': 'application/json'
+      'Content-Type': 'application/json',
+      'x-webgw-version': '2.0',
+      'x-webgw-appid': '180020010001210065'
     },
     beforeStart: function beforeStart() {
       setLoading(true);
@@ -81,6 +118,11 @@ function MsgBox(props) {
           // mode,
           // lib,
         });
+        if (isPreviewable(finalJSON.content)) {
+          var codeBlock = getCodeFromMarkdown(finalJSON.content).code;
+          AIChatStore.codeBlock = codeBlock;
+          onCodegen === null || onCodegen === void 0 || onCodegen(codeBlock);
+        }
       } catch (e) {
         // 说明不是JSON格式
       } finally {
@@ -91,34 +133,36 @@ function MsgBox(props) {
       }
     },
     onError: function onError(error) {
+      var _derivedState$activeS2;
+      console.log('回答失败', error);
       // 处理错误
-      console.error("AI stream failed:", error);
-      // setMessages(prev => [
-      //   ...prev,
-      //   { id: Date.now(), role: 'assistant', content: `Sorry, an error occurred: ${error.message}` }
-      // ]);
-      setIsStreaming(false); // **关键：出错后，也要关闭 trigger**
+      (_derivedState$activeS2 = derivedState.activeSession) === null || _derivedState$activeS2 === void 0 || (_derivedState$activeS2 = _derivedState$activeS2.messages) === null || _derivedState$activeS2 === void 0 || _derivedState$activeS2.push({
+        id: crypto.randomUUID(),
+        role: 'assistant',
+        content: formatMessage({
+          id: 'ai.msgbox.error.response'
+        }),
+        createdAt: Date.now()
+        // mode,
+        // lib,
+      });
+      setIsStreaming(false);
+      setLoading(false);
     }
   });
 
   // 3. 处理用户提交
   var handleSubmit = function handleSubmit() {
-    var _derivedState$activeS2;
-    if (props.simple) {
-      createNewSession({
-        promptText: promptText
-      });
-      return;
-    }
+    var _derivedState$activeS3;
     if (!promptText.trim() || isStreaming) return; // 如果正在流式输出，则不允许发送
     setPromptText('');
-    (_derivedState$activeS2 = derivedState.activeSession) === null || _derivedState$activeS2 === void 0 || (_derivedState$activeS2 = _derivedState$activeS2.messages) === null || _derivedState$activeS2 === void 0 || _derivedState$activeS2.push({
+    (_derivedState$activeS3 = derivedState.activeSession) === null || _derivedState$activeS3 === void 0 || (_derivedState$activeS3 = _derivedState$activeS3.messages) === null || _derivedState$activeS3 === void 0 || _derivedState$activeS3.push({
       id: crypto.randomUUID(),
       role: 'user',
       content: promptText,
-      createdAt: Date.now()
-      // mode,
-      // lib,
+      createdAt: Date.now(),
+      context: fileSummary,
+      lib: lib
     });
     // **关键：开启 trigger，开始请求**
     setIsStreaming(true);
@@ -135,6 +179,12 @@ function MsgBox(props) {
         AIChatStore.tempMessage = null;
       }
     }
+    if (simple) {
+      createPureNewSession(title);
+    }
+    return function () {
+      clearEmptySession();
+    };
   }, []);
   useEffect(function () {
     if (derivedState.activeSession && Date.now() - derivedState.activeSession.createdAt > 5000) {
@@ -142,17 +192,64 @@ function MsgBox(props) {
       setIsStreaming(false);
     }
   }, [snap.activeSessionId]);
+  var showMessages = [].concat(_toConsumableArray(messages), _toConsumableArray(((_derivedSnap$activeSe3 = derivedSnap.activeSession) === null || _derivedSnap$activeSe3 === void 0 ? void 0 : _derivedSnap$activeSe3.messages) || []));
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Flex, {
     gap: "middle",
     vertical: true,
     className: styles.chatContainer
-  }, (_ref = (_props$messages = props.messages) !== null && _props$messages !== void 0 ? _props$messages : (_derivedSnap$activeSe3 = derivedSnap.activeSession) === null || _derivedSnap$activeSe3 === void 0 ? void 0 : _derivedSnap$activeSe3.messages) === null || _ref === void 0 ? void 0 : _ref.map(function (msg, index) {
+  }, showMessages === null || showMessages === void 0 ? void 0 : showMessages.map(function (msg, index) {
     return /*#__PURE__*/React.createElement(Bubble, {
       key: index,
       content: /*#__PURE__*/React.createElement(MarkdownComponent, {
         content: msg.content
       }),
       avatar: msg.role === 'assistant' ? avatar : null,
+      footer: msg.role === 'assistant' && index > 0 ? /*#__PURE__*/React.createElement(Space, {
+        size: "small"
+      }, /*#__PURE__*/React.createElement(Tooltip, {
+        title: formatMessage({
+          id: 'ai.msgbox.like'
+        })
+      }, /*#__PURE__*/React.createElement(Button, {
+        color: "default",
+        variant: "text",
+        size: "small",
+        icon: /*#__PURE__*/React.createElement(LikeOutlined, null)
+      })), /*#__PURE__*/React.createElement(Tooltip, {
+        title: formatMessage({
+          id: 'ai.msgbox.dislike'
+        })
+      }, /*#__PURE__*/React.createElement(Button, {
+        color: "default",
+        variant: "text",
+        size: "small",
+        icon: /*#__PURE__*/React.createElement(DislikeOutlined, null)
+      })), index === showMessages.length - 1 && /*#__PURE__*/React.createElement(Tooltip, {
+        title: formatMessage({
+          id: 'ai.msgbox.retry'
+        })
+      }, /*#__PURE__*/React.createElement(Button, {
+        onClick: function onClick() {
+          derivedState.activeSession.messages.pop();
+          setIsStreaming(true);
+        },
+        color: "default",
+        variant: "text",
+        size: "small",
+        icon: /*#__PURE__*/React.createElement(SyncOutlined, null)
+      })), /*#__PURE__*/React.createElement(Tooltip, {
+        title: formatMessage({
+          id: 'ai.msgbox.copy'
+        })
+      }, /*#__PURE__*/React.createElement(Button, {
+        color: "default",
+        variant: "text",
+        size: "small",
+        onClick: function onClick() {
+          return copyToClipboard(msg.content);
+        },
+        icon: copyState.value === msg.content ? /*#__PURE__*/React.createElement(CheckOutlined, null) : /*#__PURE__*/React.createElement(CopyOutlined, null)
+      }))) : null,
       placement: msg.role === 'user' ? 'end' : 'start'
     });
   }), loading && /*#__PURE__*/React.createElement(Bubble, {
@@ -167,7 +264,9 @@ function MsgBox(props) {
       return history.push('/');
     },
     className: styles.newButton
-  }, /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(PlusSquareOutlined, null), "\u5F00\u59CB\u65B0\u5BF9\u8BDD"))), /*#__PURE__*/React.createElement(PromptTextarea, {
+  }, /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(PlusSquareOutlined, null), formatMessage({
+    id: 'ai.msgbox.start.new.chat'
+  })))), /*#__PURE__*/React.createElement(PromptTextarea, {
     size: "compact",
     mode: "implement",
     value: promptText,
@@ -181,7 +280,10 @@ function MsgBox(props) {
     style: {
       marginBottom: 0
     },
-    onConfirm: handleSubmit
+    onConfirm: handleSubmit,
+    lib: lib,
+    onLibChange: setLib,
+    onDataSummaryChange: setFileSummary
   })));
 }
 export default MsgBox;

package/dist/pages/AIPlayground/components/SessionLayout/index.js

@@ -1,13 +1,10 @@
-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); }
-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; }
-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); }
 import React from 'react';
 import styles from "./index.module.less";
 import { ConversationsMenu } from "../ConversationsMenu";
 import { AIChatStore } from "../../../../model/AIChat";
-import { useSnapshot } from "valtio";
-import classnames from "classnames";
+import { useSnapshot } from 'valtio';
+import classnames from 'classnames';
+import SplitPane from 'react-split-pane';
 function SessionLayout(props) {
   var children = props.children;
   var snap = useSnapshot(AIChatStore);
@@ -16,10 +13,21 @@ function SessionLayout(props) {
   }
   return /*#__PURE__*/React.createElement("div", {
     className: styles.container
-  }, /*#__PURE__*/React.createElement(ConversationsMenu, null), /*#__PURE__*/React.createElement("div", {
-    className: classnames(styles.msgBox, _defineProperty(_defineProperty({}, styles.msgBoxHalf, snap.codeBlock), styles.msgBoxFull, !snap.codeBlock))
-  }, children[0]), snap.codeBlock && /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(ConversationsMenu, null),
+  // @ts-ignore
+  snap.codeBlock ? /*#__PURE__*/React.createElement(SplitPane, {
+    split: "vertical",
+    defaultSize: "50vw",
+    primary: "second",
+    style: {
+      position: "unset"
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classnames(styles.msgBox)
+  }, children[0]), /*#__PURE__*/React.createElement("div", {
     className: styles.taskBox
-  }, children[1]));
+  }, children[1])) : /*#__PURE__*/React.createElement("div", {
+    className: classnames(styles.msgBox, styles.msgBoxFull)
+  }, children[0]));
 }
 export { SessionLayout };

package/dist/pages/AIPlayground/components/SessionLayout/index.module.less

@@ -14,6 +14,7 @@
 }
 
 .msgBox {
+  height: 100%;
   padding: 16px;
   min-width: 400px;
   justify-content: space-between;
@@ -28,7 +29,9 @@
 }
 
 .taskBox {
+  height: calc(100% - 32px);
   margin: 16px;
+  padding: 16px;
   flex-grow: 1;
   background: #ffffff;
 }

package/dist/pages/AIPlayground/components/TaskBox/generateCode.js

@@ -97,14 +97,13 @@ export function wrap2Sandpack() {
   // if (match) {
   return {
     "/package.json": {
-      code: "{\n      \"name\": \"AntV-AI-Code\",\n      \"version\": \"1.0.0\",\n      \"main\": \"/index.js\",\n      \"dependencies\": ".concat(JSON.stringify(generateDependencies(codeBlock), null, 2), "\n    }")
+      code: "{\n      \"name\": \"AntV-AI-Code\",\n      \"version\": \"1.0.0\",\n      \"main\": \"/index.tsx\",\n      \"dependencies\": ".concat(JSON.stringify(generateDependencies(codeBlock), null, 2), "\n    }")
     },
-    "/index.js": {
-      // 入口文件是纯 JS
+    "/index.tsx": {
       code: codeBlock
     },
     "/index.html": {
-      code: "<!DOCTYPE html>\n<html>\n<head>\n  <title>Vanilla JS Example</title>\n</head>\n<body>\n  <div id=\"root\"></div>\n  <div id=\"container\"></div>\n  <script src=\"index.js\"></script>\n</body>\n</html>"
+      code: "<!DOCTYPE html>\n<html>\n<head>\n  <title>Vanilla JS Example</title>\n</head>\n<body>\n  <div id=\"root\"></div>\n  <div id=\"container\"></div>\n  <script src=\"index.tsx\"></script>\n</body>\n</html>"
     }
   };
 }

package/dist/pages/AIPlayground/components/TaskBox/index.js

@@ -46,6 +46,7 @@ function TaskBox() {
     theme: "light" // 主题：dark, light, auto
     ,
     customSetup: {
+      entry: "/index.tsx",
       npmRegistries: [{
         limitToScopes: false,
         // 设为 false 使所有包都从自定义 registry 获取

package/dist/plugin/index.js

@@ -168,8 +168,8 @@ export default function ThemeAntVContextWrapper() {
       },
       {
         id: "dumi-theme-antv-ai-playground-lang",
-        absPath: "/:language/ai-playground/:id",
-        path: ":language/ai-playground/:id",
+        absPath: "/:language/ai-playground",
+        path: ":language/ai-playground",
         file: `${PAGES_DIR}/AIPlayground`
       }
     ];

package/dist/slots/CodeEditor/Toolbar.js

@@ -10,7 +10,7 @@ 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, ThunderboltOutlined } from '@ant-design/icons';
+import { CodeSandboxOutlined, PlayCircleOutlined, ReloadOutlined, ThunderboltOutlined } from '@ant-design/icons';
 import stackblitzSdk from '@stackblitz/sdk';
 import { Tooltip, Typography } from 'antd';
 import { getParameters } from 'codesandbox/lib/api/define';
@@ -43,7 +43,8 @@ export var Toolbar = function Toolbar(_ref) {
     _ref$onToggleFullscre = _ref.onToggleFullscreen,
     onToggleFullscreen = _ref$onToggleFullscre === void 0 ? null : _ref$onToggleFullscre,
     onExecuteCode = _ref.onExecuteCode,
-    onClickAI = _ref.onClickAI;
+    onClickAI = _ref.onClickAI,
+    onReload = _ref.onReload;
   var locale = useLocale();
   var exampleTitle = _typeof(title) === 'object' ? title[locale.id] : title;
 
@@ -82,7 +83,16 @@ export var Toolbar = function Toolbar(_ref) {
   })), /*#__PURE__*/React.createElement("a", {
     className: styles.ai,
     onClick: onClickAI
-  }, "AI \u52A9\u624B"), riddleVisible ? /*#__PURE__*/React.createElement("form", {
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    id: "ai.toolbar.assistant"
+  })), /*#__PURE__*/React.createElement(Tooltip, {
+    title: /*#__PURE__*/React.createElement(FormattedMessage, {
+      id: "ai.toolbar.restore"
+    })
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles.ai,
+    onClick: onReload
+  }, /*#__PURE__*/React.createElement(ReloadOutlined, null))), riddleVisible ? /*#__PURE__*/React.createElement("form", {
     action: "//riddle.alibaba-inc.com/riddles/define",
     method: "POST",
     target: "_blank"
@@ -92,7 +102,7 @@ export var Toolbar = function Toolbar(_ref) {
     value: JSON.stringify(riddlePrefillConfig)
   }), /*#__PURE__*/React.createElement(Tooltip, {
     title: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "\u5728 Riddle \u4E2D\u6253\u5F00"
+      id: "ai.toolbar.open.riddle"
     })
   }, /*#__PURE__*/React.createElement("input", {
     type: "submit",
@@ -100,7 +110,7 @@ export var Toolbar = function Toolbar(_ref) {
     className: styles.riddle
   }))) : null, /*#__PURE__*/React.createElement(Tooltip, {
     title: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "\u5728 StackBlitz \u4E2D\u6253\u5F00"
+      id: "ai.toolbar.open.stackblitz"
     })
   }, /*#__PURE__*/React.createElement(ThunderboltOutlined, {
     className: styles.stackblitz,
@@ -109,7 +119,7 @@ export var Toolbar = function Toolbar(_ref) {
     }
   })), /*#__PURE__*/React.createElement(Tooltip, {
     title: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "\u5728 CodeSandbox \u4E2D\u6253\u5F00"
+      id: "ai.toolbar.open.codesandbox"
     })
   }, /*#__PURE__*/React.createElement("form", {
     action: "https://codesandbox.io/api/v1/sandboxes/define",
@@ -135,7 +145,7 @@ export var Toolbar = function Toolbar(_ref) {
     }
   }), /*#__PURE__*/React.createElement(Tooltip, {
     title: /*#__PURE__*/React.createElement(FormattedMessage, {
-      id: "\u6267\u884C\u4EE3\u7801"
+      id: "ai.toolbar.execute"
     })
   }, /*#__PURE__*/React.createElement(PlayCircleOutlined, {
     onClick: onExecuteCode,

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

@@ -83,6 +83,7 @@
 
 
 .ai {
+  cursor: pointer;
   margin-right: 10px;
   font-size: 12px;
 }

package/dist/slots/CodeEditor/index.js

@@ -15,7 +15,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import MonacoEditor, { loader } from '@monaco-editor/react';
 import { Drawer, Switch } from 'antd';
 import { autoType as d3AutoType, dsvFormat } from 'd3-dsv';
-import { useLocale, useSiteData } from 'dumi';
+import { useLocale, useSiteData, useIntl } from 'dumi';
 import { debounce, noop } from 'lodash-es';
 import { format } from 'prettier';
 import parserBabel from 'prettier/parser-babel';
@@ -61,6 +61,7 @@ var CodeEditor = function CodeEditor(_ref) {
   var locale = useLocale();
   var _useSiteData = useSiteData(),
     themeConfig = _useSiteData.themeConfig;
+  var intl = useIntl();
   var _themeConfig$es = themeConfig.es5,
     es5 = _themeConfig$es === void 0 ? true : _themeConfig$es,
     _themeConfig$showSpec = themeConfig.showSpecTab,
@@ -280,6 +281,7 @@ var CodeEditor = function CodeEditor(_ref) {
   // 用于更新当前 example 的 spec 和 data
   useEffect(function () {
     setCurrentEditorTab(EDITOR_TABS.JAVASCRIPT);
+    setShowAI(false);
   }, [exampleId]);
 
   // hook 用户的数据
@@ -385,6 +387,9 @@ var CodeEditor = function CodeEditor(_ref) {
   var onClickAI = function onClickAI() {
     setShowAI(true);
   };
+  var onReload = function onReload() {
+    setCode(source);
+  };
   return /*#__PURE__*/React.createElement("div", {
     className: styles.editor
   }, /*#__PURE__*/React.createElement(Toolbar, {
@@ -402,6 +407,7 @@ var CodeEditor = function CodeEditor(_ref) {
     onEditorTabChange: onTabChange,
     onToggleFullscreen: onFullscreen,
     onClickAI: onClickAI,
+    onReload: onReload,
     slots: {
       Spec: /*#__PURE__*/React.createElement("span", {
         style: {
@@ -461,15 +467,23 @@ var CodeEditor = function CodeEditor(_ref) {
       onClose: function onClose() {
         return setShowAI(false);
       },
-      rootClassName: styles.drawer
+      rootClassName: styles.drawer,
+      width: '90%'
     }, /*#__PURE__*/React.createElement(MsgBox, {
       simple: true,
       messages: [{
         id: crypto.randomUUID(),
         role: 'assistant',
-        content: "\u6211\u662FAntV AI\u52A9\u624B\u3002\u60A8\u53EF\u4EE5\u968F\u65F6\u5411\u6211\u63D0\u95EE\uFF0C\u8BA9\u6211\u4E3A\u60A8\uFF1A\n              \n1\u3001\u89E3\u8BFB\u5F53\u524D\u56FE\u8868\u7684\u4EE3\u7801\u914D\u7F6E\u3002\n              \n2\u3001\u901A\u8FC7\u81EA\u7136\u8BED\u8A00\u5BF9\u8BDD\uFF0C\u57FA\u4E8E\u5F53\u524D\u6848\u4F8B\u751F\u6210\u65B0\u4EE3\u7801\u4EE5\u5B9A\u5236\u56FE\u8868\u3002",
+        content: intl.formatMessage({
+          id: 'ai.assistant.editor.intro'
+        }),
         createdAt: Date.now()
-      }]
+      }],
+      context: valueOf(tab),
+      onCodegen: function onCodegen(codeBlock) {
+        setCode(codeBlock);
+      },
+      title: title
     })));
   }));
 };

package/dist/slots/CodeRunner/index.js

@@ -79,7 +79,8 @@ var CodeRunner = function CodeRunner(_ref) {
     onFullscreen: setFullscreen,
     onDestroy: noop,
     onReady: noop,
-    playground: playground
+    playground: playground,
+    title: ic(title)
   }))));
 };
 export default CodeRunner;

package/dist/slots/Header/Search/SearchResult.js

@@ -38,16 +38,22 @@ export var SearchResult = function SearchResult(_ref) {
       createNewSession({
         promptText: keywords,
         mode: "solve",
-        lib: !themeConfig.isAntVSite ? themeConfig.title : undefined
+        lib: !themeConfig.isAntVSite ? themeConfig.title : undefined,
+        jump: true,
+        lang: intl.locale === 'zh' ? 'zh' : 'en'
       });
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: classnames(styles.title, styles.highlighted)
   }, keywords), /*#__PURE__*/React.createElement("div", {
     className: styles.description
-  }, "\u8BD5\u8BD5\xA0", /*#__PURE__*/React.createElement("span", {
+  }, intl.formatMessage({
+    id: 'ai.search.try'
+  }), "\xA0", /*#__PURE__*/React.createElement("span", {
     className: styles.highlighted
-  }, "AI"), "\xA0\u53EF\u89C6\u5316\u7B54\u7591"))), results !== null && results !== void 0 && results.length ? results.map(function (r, index) {
+  }, "AI"), "\xA0", intl.formatMessage({
+    id: 'ai.search.visualization'
+  })))), results !== null && results !== void 0 && results.length ? results.map(function (r, index) {
     return /*#__PURE__*/React.createElement("div", {
       className: styles.item,
       key: index