@ant-design/agentic-ui 2.29.37 → 2.29.39

package/dist/Hooks/useLanguage.d.ts

@@ -406,6 +406,27 @@ export declare function useLanguage(): {
         'comment.jumpTo': string;
         'chart.renderFailed': string;
         'chart.renderFailedSubTitle': string;
+        'chart.legend.show': string;
+        'chart.legend.hide': string;
+        'chart.legend.prevPage': string;
+        'chart.legend.nextPage': string;
+        'chart.legend.remaining': string;
+        'refine.loading': string;
+        'refine.oneClickOptimize': string;
+        'refine.optimizePrompt': string;
+        'jinja.panel.title': string;
+        'jinja.panel.docLink': string;
+        'jinja.panel.noTemplates': string;
+        'jinja.template.variableInterpolation.title': string;
+        'jinja.template.variableInterpolation.description': string;
+        'jinja.template.condition.title': string;
+        'jinja.template.condition.description': string;
+        'jinja.template.loop.title': string;
+        'jinja.template.loop.description': string;
+        'jinja.template.filter.title': string;
+        'jinja.template.filter.description': string;
+        'jinja.template.setVariable.title': string;
+        'jinja.template.setVariable.description': string;
     };
     setLanguage: ((language: "zh-CN" | "en-US") => void) | undefined;
     toggleLanguage: () => void;

package/dist/I18n/locales.d.ts

@@ -1,9 +1,7 @@
 /**
  * 中文标签映射对象
  *
- * 包含所有界面文本的中文翻译，用于国际化  dataTime: '数据时间',
-  columns: '列',
-  all: '全部',
+ * 包含所有界面文本的中文翻译，用于国际化
  * 提供完整的用户界面文本本地化。
  */
 export declare const cnLabels: {
@@ -370,6 +368,27 @@ export declare const cnLabels: {
     'comment.jumpTo': string;
     'chart.renderFailed': string;
     'chart.renderFailedSubTitle': string;
+    'chart.legend.show': string;
+    'chart.legend.hide': string;
+    'chart.legend.prevPage': string;
+    'chart.legend.nextPage': string;
+    'chart.legend.remaining': string;
+    'refine.loading': string;
+    'refine.oneClickOptimize': string;
+    'refine.optimizePrompt': string;
+    'jinja.panel.title': string;
+    'jinja.panel.docLink': string;
+    'jinja.panel.noTemplates': string;
+    'jinja.template.variableInterpolation.title': string;
+    'jinja.template.variableInterpolation.description': string;
+    'jinja.template.condition.title': string;
+    'jinja.template.condition.description': string;
+    'jinja.template.loop.title': string;
+    'jinja.template.loop.description': string;
+    'jinja.template.filter.title': string;
+    'jinja.template.filter.description': string;
+    'jinja.template.setVariable.title': string;
+    'jinja.template.setVariable.description': string;
 };
 /**
  * 英文标签映射对象

package/dist/I18n/locales.js

@@ -1,9 +1,7 @@
 /**
  * 中文标签映射对象
  *
- * 包含所有界面文本的中文翻译，用于国际化  dataTime: '数据时间',
-  columns: '列',
-  all: '全部',
+ * 包含所有界面文本的中文翻译，用于国际化
  * 提供完整的用户界面文本本地化。
  */ export var cnLabels = {
     attachmentSingleMax: '单个最大',
@@ -394,7 +392,31 @@
     'comment.jumpTo': '跳转到评论位置',
     // 图表错误相关
     'chart.renderFailed': '图表渲染失败',
-    'chart.renderFailedSubTitle': '图表组件遇到了一个错误，请稍后重试'
+    'chart.renderFailedSubTitle': '图表组件遇到了一个错误，请稍后重试',
+    // DonutChart 图例相关
+    'chart.legend.show': '显示',
+    'chart.legend.hide': '隐藏',
+    'chart.legend.prevPage': '上一页',
+    'chart.legend.nextPage': '下一页',
+    'chart.legend.remaining': '剩余',
+    // RefinePromptButton 相关
+    'refine.loading': '优化中',
+    'refine.oneClickOptimize': '一键优化提示词',
+    'refine.optimizePrompt': '优化提示词',
+    // Jinja 模板面板相关
+    'jinja.panel.title': 'Jinja 模板',
+    'jinja.panel.docLink': '使用说明',
+    'jinja.panel.noTemplates': '暂无模板',
+    'jinja.template.variableInterpolation.title': '变量插值',
+    'jinja.template.variableInterpolation.description': '{{ variable }}',
+    'jinja.template.condition.title': '条件语句',
+    'jinja.template.condition.description': '{% if condition %}...{% endif %}',
+    'jinja.template.loop.title': '循环遍历',
+    'jinja.template.loop.description': '{% for item in list %}...{% endfor %}',
+    'jinja.template.filter.title': '过滤器',
+    'jinja.template.filter.description': '{{ value | filter }}',
+    'jinja.template.setVariable.title': '设置变量',
+    'jinja.template.setVariable.description': '{% set name = value %}'
 };
 /**
  * 英文标签映射对象
@@ -790,5 +812,29 @@
     'comment.jumpTo': 'Jump to Comment',
     // Chart error related
     'chart.renderFailed': 'Chart Rendering Failed',
-    'chart.renderFailedSubTitle': 'The chart component encountered an error, please try again later'
+    'chart.renderFailedSubTitle': 'The chart component encountered an error, please try again later',
+    // DonutChart legend related
+    'chart.legend.show': 'Show',
+    'chart.legend.hide': 'Hide',
+    'chart.legend.prevPage': 'Previous page',
+    'chart.legend.nextPage': 'Next page',
+    'chart.legend.remaining': 'Remaining',
+    // RefinePromptButton related
+    'refine.loading': 'Optimizing',
+    'refine.oneClickOptimize': 'One-click optimize prompt',
+    'refine.optimizePrompt': 'Optimize prompt',
+    // Jinja template panel related
+    'jinja.panel.title': 'Jinja Templates',
+    'jinja.panel.docLink': 'Documentation',
+    'jinja.panel.noTemplates': 'No templates',
+    'jinja.template.variableInterpolation.title': 'Variable interpolation',
+    'jinja.template.variableInterpolation.description': '{{ variable }}',
+    'jinja.template.condition.title': 'Conditional',
+    'jinja.template.condition.description': '{% if condition %}...{% endif %}',
+    'jinja.template.loop.title': 'Loop',
+    'jinja.template.loop.description': '{% for item in list %}...{% endfor %}',
+    'jinja.template.filter.title': 'Filter',
+    'jinja.template.filter.description': '{{ value | filter }}',
+    'jinja.template.setVariable.title': 'Set variable',
+    'jinja.template.setVariable.description': '{% set name = value %}'
 };

package/dist/MarkdownEditor/editor/elements/index.js

@@ -132,9 +132,23 @@ import { Paragraph } from "./Paragraph";
 import { ReadonlyParagraph } from "./Paragraph/ReadonlyParagraph";
 import { Schema } from "./Schema";
 import { ReadonlySchema } from "./Schema/ReadonlySchema";
+import { JINJA_DOLLAR_PLACEHOLDER } from "../parser/constants";
 import { tableRenderElement } from "./Table";
 import { ReadonlyTableComponent } from "./Table/ReadonlyTableComponent";
 import { TagPopup } from "./TagPopup";
+/** 递归将 Jinja 占位符还原为 $ 显示 */ var restoreJinjaDollarInChildren = function restoreJinjaDollarInChildren1(children) {
+    return React.Children.map(children, function(child) {
+        if (typeof child === 'string') {
+            return child.split(JINJA_DOLLAR_PLACEHOLDER).join('$');
+        }
+        if (/*#__PURE__*/ React.isValidElement(child) && child.props.children !== undefined && child.props.children !== null) {
+            return /*#__PURE__*/ React.cloneElement(child, {
+                children: restoreJinjaDollarInChildren(child.props.children)
+            });
+        }
+        return child;
+    });
+};
 /**
  * 性能优化说明：
  *
@@ -481,7 +495,7 @@ var MLeafComponent = function MLeafComponent(props) {
         "data-url": leaf.url ? 'url' : undefined,
         style: style,
         className: (prefixClassName === null || prefixClassName === void 0 ? void 0 : prefixClassName.trim()) ? prefixClassName === null || prefixClassName === void 0 ? void 0 : prefixClassName.trim() : undefined
-    }), children);
+    }), restoreJinjaDollarInChildren(children));
     // 如果有评论，使用 CommentLeaf 包裹普通 DOM
     if (hasComment) {
         return /*#__PURE__*/ React.createElement(CommentLeaf, {

package/dist/MarkdownEditor/editor/parser/constants.d.ts

@@ -0,0 +1,5 @@
+/**
+ * 占位符：保护 Jinja 块内 $ 不被 remark-math 解析为数学公式。
+ * 在 markdown 解析前替换，渲染与序列化时还原为 $。
+ */
+export declare const JINJA_DOLLAR_PLACEHOLDER = "\uE01A";

package/dist/MarkdownEditor/editor/parser/constants.js

@@ -0,0 +1,4 @@
+/**
+ * 占位符：保护 Jinja 块内 $ 不被 remark-math 解析为数学公式。
+ * 在 markdown 解析前替换，渲染与序列化时还原为 $。
+ */ export var JINJA_DOLLAR_PLACEHOLDER = '\uE01A';

package/dist/MarkdownEditor/editor/parser/parserSlateNodeToMarkdown.js

@@ -82,6 +82,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 /* eslint-disable @typescript-eslint/no-loop-func */ /* eslint-disable no-case-declarations */ /* eslint-disable no-param-reassign */ /* eslint-disable @typescript-eslint/no-use-before-define */ import { Node } from "slate";
 import stringWidth from "string-width";
 import { debugInfo } from "../../../Utils/debugUtils";
+import { JINJA_DOLLAR_PLACEHOLDER } from "./constants";
 import { getMediaType } from "../utils/dom";
 var inlineNode = new Set([
     'break'
@@ -718,7 +719,7 @@ export var isMix = function isMix(t) {
  * - `<del>` if `strikethrough` is true.
  * - `<a href="{url}">` if `url` is defined.
  */ var textHtml = function textHtml(t) {
-    var str = t.text || '';
+    var str = (t.text || '').split(JINJA_DOLLAR_PLACEHOLDER).join('$');
     if (t.highColor) str = '<span style="color:'.concat(t.highColor, '">').concat(str, "</span>");
     if (t.code) str = "<code>".concat(str, "</code>");
     if (t.italic) str = "<i>".concat(str, "</i>");
@@ -745,9 +746,9 @@ export var isMix = function isMix(t) {
  * - 将换行符转换为 Markdown 换行符
  * - 保留文本前后的空白字符
  */ var textStyle = function textStyle(t) {
-    var _t_text;
+    var _split_join;
     if (!t.text && !t.tag) return '';
-    var str = (t === null || t === void 0 ? void 0 : (_t_text = t.text) === null || _t_text === void 0 ? void 0 : _t_text.replace(RegExp("(?<!\\\\)\\\\", "g"), '\\').replace(/\n/g, '  \n')) || '';
+    var str = ((_split_join = ((t === null || t === void 0 ? void 0 : t.text) || '').split(JINJA_DOLLAR_PLACEHOLDER).join('$')) === null || _split_join === void 0 ? void 0 : _split_join.replace(RegExp("(?<!\\\\)\\\\", "g"), '\\').replace(/\n/g, '  \n')) || '';
     var preStr = '', afterStr = '';
     // Apply formats in a consistent order:
     // 1. Code (most specific)
@@ -834,7 +835,7 @@ export var isMix = function isMix(t) {
     });
     var str = textStyle(t);
     if (t === null || t === void 0 ? void 0 : t.url) {
-        str = "[".concat(t.text, "](").concat(encodeURI(t === null || t === void 0 ? void 0 : t.url), ")");
+        str = "[".concat((t.text || '').split(JINJA_DOLLAR_PLACEHOLDER).join('$'), "](").concat(encodeURI(t === null || t === void 0 ? void 0 : t.url), ")");
     } else if (isMix(t) && index !== -1) {
         var next = siblings[index + 1];
         if (!str.endsWith(' ') && next && !Node.string(next).startsWith(' ')) {

package/dist/MarkdownEditor/editor/parser/remarkParse.d.ts

@@ -15,5 +15,10 @@ export declare function convertParagraphToImage(): (tree: any) => void;
  *   Transformer function.
  */
 export declare function fixStrongWithSpecialChars(): (tree: any) => void;
+/**
+ * 保护 Jinja 块内的 $，防止被 remark-math 误解析为行内数学（如 {{ $var }}）
+ * 须在 remark-math 之前运行
+ */
+export declare function protectJinjaDollarInText(): (tree: any) => void;
 declare const markdownParser: import("unified").Processor<import("mdast").Root, undefined, undefined, import("mdast").Root, string>;
 export default markdownParser;

package/dist/MarkdownEditor/editor/parser/remarkParse.js

@@ -30,6 +30,7 @@ import remarkMath from "remark-math";
 import remarkParse from "remark-parse";
 import { unified } from "unified";
 import { visit } from "unist-util-visit";
+import { JINJA_DOLLAR_PLACEHOLDER } from "./constants";
 /**
  * 提取段落节点的文本内容
  * @param paragraphNode - 段落节点
@@ -344,6 +345,20 @@ import { visit } from "unist-util-visit";
         });
     };
 }
+/**
+ * 保护 Jinja 块内的 $，防止被 remark-math 误解析为行内数学（如 {{ $var }}）
+ * 须在 remark-math 之前运行
+ */ export function protectJinjaDollarInText() {
+    return function(tree) {
+        visit(tree, 'text', function(node) {
+            if (!node.value || typeof node.value !== 'string') return;
+            var replaceInBlock = function replaceInBlock(str) {
+                return str.replace(/\$/g, JINJA_DOLLAR_PLACEHOLDER);
+            };
+            node.value = node.value.replace(/\{\{[^}]*\}\}/g, replaceInBlock).replace(/\{%[^%]*%\}/g, replaceInBlock).replace(/\{#[\s\S]*?#\}/g, replaceInBlock);
+        });
+    };
+}
 // Markdown 解析器（用于解析 Markdown 为 mdast AST）
 // 注意：这个解析器只用于解析，不包含 HTML 渲染相关的插件
 var markdownParser = unified().use(remarkParse) // 解析 Markdown
@@ -355,6 +370,7 @@ var markdownParser = unified().use(remarkParse) // 解析 Markdown
 }) // GFM 插件，禁用单波浪线删除线
 .use(fixStrongWithSpecialChars) // 修复包含特殊字符的加粗文本
 .use(convertParagraphToImage) // 将以 ! 开头的段落转换为图片,将 | 开头的段落转换为表格
+.use(protectJinjaDollarInText) // 保护 Jinja 块内 $，避免被 remark-math 误解析
 .use(remarkMath, {
     singleDollarTextMath: true
 });

package/dist/MarkdownEditor/editor/plugins/useHighlight.js

@@ -134,6 +134,45 @@ var createRange = function createRange(path, childIndex, offset, length) {
         }
     }, props);
 };
+/** 创建可跨子节点的 range（用于 Jinja 等可能被 inline code 分割的匹配） */ var createRangeSpanningChildren = function createRangeSpanningChildren(path, children, globalStart, globalEnd) {
+    var props = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : {};
+    var offset = 0;
+    var anchorPath = null;
+    var anchorOffset = 0;
+    var focusPath = null;
+    var focusOffset = 0;
+    for(var i = 0; i < children.length; i++){
+        var _ref;
+        var _children_i;
+        var text = (_ref = (_children_i = children[i]) === null || _children_i === void 0 ? void 0 : _children_i.text) !== null && _ref !== void 0 ? _ref : '';
+        var len = text.length;
+        var childStart = offset;
+        var childEnd = offset + len;
+        if (globalStart < childEnd && anchorPath === null) {
+            anchorPath = path.concat(i);
+            anchorOffset = Math.max(0, globalStart - childStart);
+        }
+        if (globalEnd <= childEnd && focusPath === null) {
+            focusPath = path.concat(i);
+            focusOffset = Math.min(len, globalEnd - childStart);
+            break;
+        }
+        offset = childEnd;
+    }
+    if (anchorPath && focusPath) {
+        return _object_spread({
+            anchor: {
+                path: anchorPath,
+                offset: anchorOffset
+            },
+            focus: {
+                path: focusPath,
+                offset: focusOffset
+            }
+        }, props);
+    }
+    return null;
+};
 // 处理文本节点的匹配逻辑
 var processTextMatches = function processTextMatches(text, path, childIndex) {
     var ranges = [];
@@ -176,16 +215,18 @@ var processLinkMatches = function processLinkMatches(text, path, childIndex) {
     }
     return ranges;
 };
-var processJinjaMatches = function processJinjaMatches(text, path, childIndex) {
+/** 在整段文本上匹配 Jinja，支持被 inline code 分割的语法（如 {% if `x` %}） */ var processJinjaMatchesOnFullText = function processJinjaMatchesOnFullText(fullText, path, children) {
     var ranges = [];
     var collect = function collect(reg, prop) {
         reg.lastIndex = 0;
         var match;
-        while((match = reg.exec(text)) !== null){
-            var index = match.index;
-            if (typeof index === 'number') {
-                ranges.push(createRange(path, childIndex, index, match[0].length, _define_property({}, prop, true)));
-            }
+        while((match = reg.exec(fullText)) !== null){
+            var start = match.index;
+            var matched = match[0];
+            if (typeof start !== 'number' || !matched) continue;
+            var end = start + matched.length;
+            var range = createRangeSpanningChildren(path, children, start, end, _define_property({}, prop, true));
+            if (range) ranges.push(range);
         }
     };
     collect(JINJA_VARIABLE_REG, 'jinjaVariable');
@@ -213,6 +254,7 @@ export function useHighlight(store, jinjaEnabled) {
                 var allTextRanges = [];
                 var children = node.children;
                 var childrenLength = children.length;
+                var fullText = Node.string(node);
                 for(var i = 0; i < childrenLength; i++){
                     var child = children[i];
                     // 处理 footnote 和 HTML
@@ -225,10 +267,11 @@ export function useHighlight(store, jinjaEnabled) {
                         var _allTextRanges1;
                         (_allTextRanges1 = allTextRanges).push.apply(_allTextRanges1, _to_consumable_array(processLinkMatches(child.text, path, i)));
                     }
-                    if (jinjaEnabled && child.text && !EditorUtils.isDirtLeaf(child)) {
-                        var _allTextRanges2;
-                        (_allTextRanges2 = allTextRanges).push.apply(_allTextRanges2, _to_consumable_array(processJinjaMatches(child.text, path, i)));
-                    }
+                }
+                // Jinja 在整段文本上匹配，支持 {% if `x` %} 等被 inline code 分割的语法
+                if (jinjaEnabled && fullText) {
+                    var _allTextRanges2;
+                    (_allTextRanges2 = allTextRanges).push.apply(_allTextRanges2, _to_consumable_array(processJinjaMatchesOnFullText(fullText, path, children)));
                 }
                 // 统一缓存
                 cacheTextNode.set(node, {

package/dist/MarkdownEditor/editor/plugins/useKeyboard.js

@@ -257,8 +257,8 @@ import { useEditorStore } from "../store";
                     var codeMatch = str.match(/^```([\w+\-#]+)$/i);
                     if (codeMatch) {} else {
                         var strAfterKey = str + (e.key.length === 1 ? e.key : '');
-                        // 仅在实际输入一个字符且刚好补全 trigger 时打开面板，避免 Backspace 等导致误打开
-                        if (jinjaTemplatePanelEnabled && e.key.length === 1 && strAfterKey === jinjaTrigger && setOpenJinjaTemplate && setJinjaAnchorPath) {
+                        // 在实际输入一个字符且补全 trigger 时打开面板，支持在文本后输入（如 "hello {}"）
+                        if (jinjaTemplatePanelEnabled && e.key.length === 1 && strAfterKey.endsWith(jinjaTrigger) && setOpenJinjaTemplate && setJinjaAnchorPath) {
                             setJinjaAnchorPath(node3[1]);
                             setTimeout(function() {
                                 return setOpenJinjaTemplate(true);

package/dist/MarkdownEditor/editor/style.js

@@ -498,7 +498,7 @@ var genStyle = function genStyle(token) {
             marginTop: '0.5em',
             marginBottom: '0.5em'
         },
-        '& &-inline-code': {
+        '& code&-inline-code': {
             display: 'inline',
             fontFamily: "'Roboto,Mono SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace",
             margin: '1px 3px',

package/dist/MarkdownEditor/editor/tools/JinjaTemplatePanel/index.js

@@ -61,18 +61,20 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
 }
-import { ConfigProvider, Typography } from "antd";
+import { Info } from "@sofa-design/icons";
+import { ConfigProvider } from "antd";
 import classNames from "clsx";
 import isHotkey from "is-hotkey";
-import React, { useCallback, useEffect, useRef, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import ReactDOM from "react-dom";
 import { Editor, Transforms } from "slate";
 import { ReactEditor } from "slate-react";
+import { useLocale } from "../../../../I18n";
 import { useEditorStore } from "../../store";
 import { getOffsetLeft } from "../../utils/dom";
 import { EditorUtils } from "../../utils/editorUtils";
 import { JINJA_PANEL_PREFIX_CLS, useJinjaTemplatePanelStyle } from "./style";
-import { JINJA_DOC_LINK, JINJA_TEMPLATE_DATA } from "./templates";
+import { getJinjaTemplateData, JINJA_DOC_LINK } from "./templates";
 var PANEL_MAX_HEIGHT = 320;
 function getPosition(nodeEl) {
     var rect = nodeEl.getBoundingClientRect();
@@ -101,7 +103,13 @@ export var JinjaTemplatePanel = function JinjaTemplatePanel() {
     var docLink = (_ref1 = jinjaConfig === null || jinjaConfig === void 0 ? void 0 : jinjaConfig.docLink) !== null && _ref1 !== void 0 ? _ref1 : JINJA_DOC_LINK;
     var notFoundContent = (_ref2 = templatePanelConfig === null || templatePanelConfig === void 0 ? void 0 : templatePanelConfig.notFoundContent) !== null && _ref2 !== void 0 ? _ref2 : null;
     var itemsConfig = templatePanelConfig === null || templatePanelConfig === void 0 ? void 0 : templatePanelConfig.items;
-    var _useState = _sliced_to_array(useState(JINJA_TEMPLATE_DATA), 2), items = _useState[0], setItems = _useState[1];
+    var locale = useLocale();
+    var defaultItems = useMemo(function() {
+        return getJinjaTemplateData(locale);
+    }, [
+        locale
+    ]);
+    var _useState = _sliced_to_array(useState(defaultItems), 2), items = _useState[0], setItems = _useState[1];
     var _useState1 = _sliced_to_array(useState(false), 2), loading = _useState1[0], setLoading = _useState1[1];
     var _useState2 = _sliced_to_array(useState(0), 2), activeIndex = _useState2[0], setActiveIndex = _useState2[1];
     var _useState3 = _sliced_to_array(useState({
@@ -135,9 +143,9 @@ export var JinjaTemplatePanel = function JinjaTemplatePanel() {
             itemsConfig({
                 editor: editor
             }).then(function(list) {
-                setItems(Array.isArray(list) ? list : JINJA_TEMPLATE_DATA);
+                setItems(Array.isArray(list) ? list : defaultItems);
             }).catch(function(err) {
-                setItems(JINJA_TEMPLATE_DATA);
+                setItems(defaultItems);
                 if (process.env.NODE_ENV !== 'production') {
                     console.error('[JinjaTemplatePanel] Failed to load template items:', err);
                 }
@@ -147,12 +155,13 @@ export var JinjaTemplatePanel = function JinjaTemplatePanel() {
         } else if (Array.isArray(itemsConfig)) {
             setItems(itemsConfig);
         } else {
-            setItems(JINJA_TEMPLATE_DATA);
+            setItems(defaultItems);
         }
     }, [
         openJinjaTemplate,
         itemsConfig,
-        markdownEditorRef
+        markdownEditorRef,
+        defaultItems
     ]);
     useEffect(function() {
         if (!openJinjaTemplate || !jinjaAnchorPath || !(markdownEditorRef === null || markdownEditorRef === void 0 ? void 0 : markdownEditorRef.current)) return;
@@ -284,32 +293,35 @@ export var JinjaTemplatePanel = function JinjaTemplatePanel() {
             return e.preventDefault();
         }
     }, /*#__PURE__*/ React.createElement("div", {
-        className: "".concat(prefixCls, "__content")
-    }, docLink ? /*#__PURE__*/ React.createElement("div", {
-        className: "".concat(prefixCls, "__doc-link")
-    }, /*#__PURE__*/ React.createElement(Typography.Link, {
-        href: docLink,
-        target: "_blank",
-        rel: "noopener noreferrer",
-        "aria-label": "打开 Jinja 使用说明（新窗口）"
-    }, "使用说明")) : null, /*#__PURE__*/ React.createElement("div", {
-        className: "".concat(prefixCls, "__list-box")
+        className: "".concat(prefixCls, "-content")
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(prefixCls, "-header")
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(prefixCls, "-title")
+    }, locale['jinja.panel.title']), docLink ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(prefixCls, "-doc-link"),
+        onClick: function onClick(e) {
+            e.preventDefault();
+            window.open(docLink, '_blank');
+        }
+    }, /*#__PURE__*/ React.createElement(Info, null), locale['jinja.panel.docLink']) : null), /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(prefixCls, "-list-box")
     }, loading ? /*#__PURE__*/ React.createElement("div", {
         style: {
             padding: 12,
             color: 'var(--color-text-secondary)'
         }
-    }, "加载中...") : items.length === 0 ? notFoundContent !== null && notFoundContent !== void 0 ? notFoundContent : /*#__PURE__*/ React.createElement("div", {
+    }, locale.loading) : items.length === 0 ? notFoundContent !== null && notFoundContent !== void 0 ? notFoundContent : /*#__PURE__*/ React.createElement("div", {
         style: {
             padding: 12,
             color: 'var(--color-text-secondary)'
         }
-    }, "暂无模板") : items.map(function(item, i) {
+    }, locale['jinja.panel.noTemplates']) : items.map(function(item, i) {
         return /*#__PURE__*/ React.createElement("div", {
             key: i,
             role: "option",
             "aria-selected": i === activeIndex,
-            className: classNames("".concat(prefixCls, "__item"), _define_property({}, "".concat(prefixCls, "__item--active"), i === activeIndex)),
+            className: classNames("".concat(prefixCls, "-item"), _define_property({}, "".concat(prefixCls, "-item-active"), i === activeIndex)),
             onMouseDown: function onMouseDown(e) {
                 e.preventDefault();
                 insertTemplate(item);
@@ -318,9 +330,9 @@ export var JinjaTemplatePanel = function JinjaTemplatePanel() {
                 return setActiveIndex(i);
             }
         }, /*#__PURE__*/ React.createElement("span", {
-            className: "".concat(prefixCls, "__item-title")
+            className: "".concat(prefixCls, "-item-title")
         }, item.title), item.description ? /*#__PURE__*/ React.createElement("span", {
-            className: "".concat(prefixCls, "__item-desc")
+            className: "".concat(prefixCls, "-item-desc")
         }, item.description) : null);
     })))));
     return /*#__PURE__*/ ReactDOM.createPortal(panel, document.body);

package/dist/MarkdownEditor/editor/tools/JinjaTemplatePanel/style.js

@@ -57,63 +57,73 @@ var genJinjaPanelStyle = function genJinjaPanelStyle(token) {
         boxSizing: 'border-box',
         display: 'flex',
         flexDirection: 'column',
+        width: 360,
+        height: 200,
         maxHeight: 320,
         minWidth: 240,
         overflow: 'hidden',
-        borderRadius: token.borderRadius,
-        backgroundColor: token.colorBgContainer,
-        boxShadow: token.boxShadowSecondary,
-        border: "1px solid ".concat(token.colorBorder),
-        '&__content': {
+        borderRadius: 'var(--radius-control-sm, var(--ant-border-radius-sm))',
+        backgroundColor: 'var(--color-gray-bg-page-light, var(--ant-color-bg-container))',
+        boxShadow: 'var(--shadow-control-lg, var(--ant-box-shadow))',
+        '&-content': {
             display: 'flex',
             flexDirection: 'column',
             flex: 1,
-            overflow: 'hidden'
+            overflow: 'hidden',
+            padding: 4
         },
-        '&__doc-link': {
-            padding: '8px 12px',
-            fontSize: token.fontSizeSM,
-            color: token.colorLink,
-            borderBottom: "1px solid ".concat(token.colorBorder),
-            a: {
-                color: 'inherit',
-                textDecoration: 'none',
-                '&:hover': {
-                    textDecoration: 'underline'
-                },
-                '&:focus-visible': {
-                    outline: "2px solid ".concat(token.colorPrimary),
-                    outlineOffset: 2,
-                    borderRadius: token.borderRadiusSM
-                }
-            }
+        '&-header': {
+            padding: '6px 12px',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between'
+        },
+        '&-title': {
+            font: 'var(--font-text-body-emphasized-sm)',
+            letterSpacing: 'var(--letter-spacing-body-emphasized-sm, normal)',
+            color: 'var(--color-gray-text-light, var(--ant-color-text-secondary))'
+        },
+        '&-doc-link': {
+            display: 'flex',
+            cursor: 'pointer',
+            alignItems: 'center',
+            gap: 4,
+            font: 'var(--font-text-body-emphasized-sm)',
+            letterSpacing: 'var(--letter-spacing-body-emphasized-sm, normal)',
+            color: 'var(--color-primary-text-default, var(--ant-color-link))'
         },
-        '&__list-box': {
+        '&-list-box': {
             flex: 1,
             overflowY: 'auto',
             padding: '4px 0'
         },
-        '&__item': {
+        '&-item': {
             display: 'flex',
-            flexDirection: 'column',
-            gap: 2,
+            borderRadius: token.borderRadiusSM,
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: 8,
             padding: '8px 12px',
             cursor: 'pointer',
             '&:hover': {
                 backgroundColor: token.colorFillTertiary
-            },
-            '&--active': {
-                backgroundColor: token.controlItemBgHover
             }
         },
-        '&__item-title': {
-            fontSize: token.fontSize,
-            fontWeight: token.fontWeightStrong,
-            color: token.colorText
+        '&-item-active': {
+            backgroundColor: token.controlItemBgHover
         },
-        '&__item-desc': {
-            fontSize: token.fontSizeSM,
-            color: token.colorTextSecondary
+        '&-item-title': {
+            flexShrink: 0,
+            font: 'var(--font-text-body-base)',
+            letterSpacing: 'var(--letter-spacing-body-base, normal)',
+            color: 'var(--color-gray-text-default, var(--ant-color-text))'
+        },
+        '&-item-desc': {
+            flex: 1,
+            minWidth: 0,
+            font: 'var(--font-text-body-sm)',
+            letterSpacing: 'var(--letter-spacing-body-sm, normal)',
+            color: 'var(--color-gray-text-light, var(--ant-color-text-secondary))'
         }
     });
 };