@agentscope-ai/design 1.0.28 → 2.0.0-beta.1770111685133

package/lib/antd/styles/button.style.js

@@ -1,7 +1,13 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../libs/createStyle";
-export var useButtonStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n/* \u53D6\u6D88\u6240\u6709button\u7684boxShadow */\nbutton[type=\"button\"].", "-btn {\n  font-weight: 500;\n  padding-inline: 11px;\n  \n  span[data-spark-icon] {\n    /* @agentscope-ai/icons\u7684\u7279\u6B8A\u903B\u8F91 */\n    font-size: 20px;\n  }\n  \n  &.", "-btn-sm {\n    padding-inline: 7px;\n    \n    span[data-spark-icon] {\n      /* @agentscope-ai/icons\u7684\u7279\u6B8A\u903B\u8F91 */\n      font-size: 16px;\n    }\n  }\n  \n  &.", "-btn-lg {\n    span[data-spark-icon] {\n      /* @agentscope-ai/icons\u7684\u7279\u6B8A\u903B\u8F91 */\n      font-size: 24px;\n    }\n  }\n}\n\n.", "-btn-default {\n  border-color: var(--", "-color-border-secondary);\n}\n\n.", "-btn-textCompact:hover {\n  color: var(--", "-color-text-tertiary) !important;\n}\n\n.", "-btn.", "-btn-default.", "-btn-dangerous:not(:disabled):not(.", "-btn-disabled) {\n  border-color: transparent;\n  background-color: var(--", "-color-error-bg);\n  color: var(--", "-color-error);\n  \n  &:hover {\n    background-color: var(--", "-color-error-bg-hover);\n    border-color: transparent;\n    color: var(--", "-color-error-hover);\n  }\n}\n\n.", "-btn-color-dangerous.", "-btn-variant-solid:disabled,\n.", "-btn-color-dangerous.", "-btn-variant-solid.", "-btn-disabled {\n  border-color: transparent;\n  background-color: var(--", "-color-fill-disable);\n  color: var(--", "-color-text-white);\n}\n\n.", "-btn-primary {\n  color: var(--", "-color-text-on-primary);\n}\n.", "-btn-primary.", "-btn-variant-solid:not(:disabled):not(.", "-btn-background-ghost):not(.", "-btn-disabled):hover {\n  color: var(--", "-color-text-on-primary);\n}\n\n.", "-btn-primary:disabled {\n  background: var(--", "-color-fill-disable);\n  color: var(--", "-color-text-white);\n  border-color: transparent;\n}\n\n.", "-btn-default:disabled {\n  background: var(--", "-color-bg-base);\n  color: var(--", "-color-text-tertiary);\n  border-color: var(--", "-color-border-secondary);\n}\n\n/* Keep white text color for primaryLess buttons */\n.spark-button-primaryLess.", "-btn-primary {\n  color: var(--", "-color-text-white);\n}\n.spark-button-primaryLess.", "-btn-primary.", "-btn-variant-solid:not(:disabled):not(.", "-btn-disabled):hover {\n  color: var(--", "-color-text-white);\n}\n"])), function (p) {
+export var useButtonStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n/* \u53D6\u6D88\u6240\u6709button\u7684boxShadow */\nbutton[type=\"button\"].", "-btn {\n  font-weight: 500;\n  padding-inline: 11px;\n  \n  span[data-spark-icon] {\n    /* @agentscope-ai/icons\u7684\u7279\u6B8A\u903B\u8F91 */\n    font-size: 20px;\n  }\n  \n  &.", "-btn-sm {\n    padding-inline: 7px;\n    \n    span[data-spark-icon] {\n      /* @agentscope-ai/icons\u7684\u7279\u6B8A\u903B\u8F91 */\n      font-size: 16px;\n    }\n  }\n  \n  &.", "-btn-lg {\n    span[data-spark-icon] {\n      /* @agentscope-ai/icons\u7684\u7279\u6B8A\u903B\u8F91 */\n      font-size: 24px;\n    }\n  }\n}\n\n.", "-btn-default {\n  border-color: var(--", "-color-border-secondary);\n  &.", "-btn:not(:disabled):not(.", "-btn-disabled):hover {\n    color: var(--", "-color-text);\n  }\n}\n\n.", "-btn-textCompact:hover {\n  color: var(--", "-color-text-tertiary) !important;\n}\n\n.", "-btn.", "-btn-default.", "-btn-dangerous:not(:disabled):not(.", "-btn-disabled) {\n  border-color: transparent;\n  background-color: var(--", "-color-error-bg);\n  color: var(--", "-color-error);\n  \n  &:hover {\n    background-color: var(--", "-color-error-bg-hover);\n    border-color: transparent;\n    color: var(--", "-color-error-hover);\n  }\n}\n\n.", "-btn-color-dangerous.", "-btn-variant-solid:disabled,\n.", "-btn-color-dangerous.", "-btn-variant-solid.", "-btn-disabled {\n  border-color: transparent;\n  background-color: var(--", "-color-fill-disable);\n  color: var(--", "-color-text-white);\n}\n\n.", "-btn-primary {\n  color: var(--", "-color-text-on-primary);\n}\n.", "-btn-primary.", "-btn-variant-solid:not(:disabled):not(.", "-btn-background-ghost):not(.", "-btn-disabled):hover {\n  color: var(--", "-color-text-on-primary);\n}\n\n.", "-btn-primary:disabled {\n  background: var(--", "-color-fill-disable);\n  color: var(--", "-color-text-white);\n  border-color: transparent;\n}\n\n.", "-btn-default:disabled {\n  background: var(--", "-color-bg-base);\n  color: var(--", "-color-text-tertiary);\n  border-color: var(--", "-color-border-secondary);\n}\n\n/* Keep white text color for primaryLess buttons */\n.spark-button-primaryLess.", "-btn-primary {\n  color: var(--", "-color-text-white);\n}\n.spark-button-primaryLess.", "-btn-primary.", "-btn-variant-solid:not(:disabled):not(.", "-btn-disabled):hover {\n  color: var(--", "-color-text-white);\n}\n"])), function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
   return p.antPrefix;
 }, function (p) {
   return p.antPrefix;

package/lib/antd/themes/generateThemeByToken.js

@@ -4,6 +4,8 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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); }
+// @ts-nocheck
+
 var INVISIBLE_COLOR = 'rgba(0,0,0,0)';
 
 // border

package/lib/components/commonComponents/Breadcrumb/index.style.js

@@ -1,7 +1,7 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../../libs/createStyle";
-export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-breadcrumb {\n  cursor: default;\n  \n  .", "-breadcrumb-link {\n    cursor: pointer;\n  }\n  \n  li:last-child {\n    .", "-breadcrumb-link {\n      color: var(--", "-color-text);\n      display: flex;\n      align-items: center;\n    }\n  }\n  \n  a {\n    color: var(--", "-color-text-secondary);\n    height: auto;\n    \n    &:hover {\n      background-color: transparent;\n    }\n  }\n  \n  .", "-breadcrumb-separator {\n    color: var(--", "-color-text);\n  }\n  \n  .", "-breadcrumb-overlay-link {\n    display: flex;\n    align-items: center;\n  }\n  \n  .", "-breadcrumb-dropdown {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    \n    .", "-avatar > img {\n      width: 20px;\n      height: 20px;\n    }\n  }\n  \n  .", "-breadcrumb-item-content {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n  \n  .", "-breadcrumb-dropdown-title {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    height: 100%;\n    \n    .", "-breadcrumb-dropdown-icon {\n      font-size: 16px !important;\n    }\n  }\n  \n  .", "-breadcrumb-dropdown-overlay {\n    display: flex;\n    justify-content: center;\n  }\n}\n"])), function (p) {
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-breadcrumb {\n  cursor: default;\n  \n  .", "-breadcrumb-link {\n    cursor: pointer;\n  }\n  \n  li:last-child {\n    .", "-breadcrumb-link {\n      color: var(--", "-color-text);\n      display: flex;\n      align-items: center;\n    }\n  }\n  \n  a {\n    color: var(--", "-color-text-secondary);\n    height: auto;\n    \n    &:hover {\n      background-color: transparent;\n    }\n  }\n  \n  .", "-breadcrumb-separator {\n    color: var(--", "-color-text);\n  }\n  \n  .", "-breadcrumb-overlay-link {\n    display: flex;\n    align-items: center;\n  }\n  \n  .", "-breadcrumb-dropdown,\n  .", "-dropdown-trigger {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    \n    .", "-avatar > img {\n      width: 20px;\n      height: 20px;\n    }\n  }\n  \n  .", "-breadcrumb-item-content {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n  \n  .", "-breadcrumb-dropdown-title {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    height: 100%;\n    \n    .", "-breadcrumb-dropdown-icon {\n      font-size: 16px !important;\n    }\n  }\n  \n  .", "-breadcrumb-dropdown-overlay {\n    display: flex;\n    justify-content: center;\n  }\n}\n"])), function (p) {
   return p.sparkPrefix;
 }, function (p) {
   return p.antPrefix;
@@ -21,6 +21,8 @@ export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _t
   return p.sparkPrefix;
 }, function (p) {
   return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
 }, function (p) {
   return p.sparkPrefix;
 }, function (p) {

package/lib/components/commonComponents/Collapse/index.style.js

@@ -1,7 +1,11 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../../libs/createStyle";
-export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-collapse {\n  background-color: var(--", "-color-fill-tertiary);\n  border: 1px solid var(--", "-color-border-secondary);\n  border-radius: var(--", "-border-radius);\n  \n  .", "-collapse-content {\n    color: var(--", "-color-text);\n    background-color: var(--", "-color-bg-base);\n    border-top: 1px solid var(--", "-color-border-secondary);\n  }\n  \n  & > .", "-collapse-item {\n    border-bottom: 1px solid var(--", "-color-border-secondary);\n    \n    & > .", "-collapse-header {\n      color: var(--", "-color-text);\n      font-weight: 500;\n      line-height: 24px;\n      align-items: center;\n      \n      .", "-collapse-expand-icon {\n        width: 32px;\n        height: 32px;\n        padding: 0;\n        justify-content: center;\n        margin-right: 8px;\n      }\n      \n      .", "-collapse-arrow {\n        font-size: 15px;\n      }\n      \n      .", "-collapse-extra {\n        height: 32px;\n        display: flex;\n        align-items: center;\n        margin-left: 8px;\n      }\n    }\n  }\n}\n"])), function (p) {
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-collapse {\n  background-color: var(--", "-color-fill-tertiary);\n  border: 1px solid var(--", "-color-border-secondary);\n  border-radius: var(--", "-border-radius);\n  \n  .", "-collapse-content {\n    color: var(--", "-color-text);\n    background-color: var(--", "-color-bg-base);\n    border-top: 1px solid var(--", "-color-border-secondary);\n  }\n  \n  & > .", "-collapse-item {\n    border-bottom: 1px solid var(--", "-color-border-secondary);\n    \n    & > .", "-collapse-header {\n      color: var(--", "-color-text);\n      font-weight: 500;\n      line-height: 24px;\n      align-items: center;\n      \n      .", "-collapse-expand-icon {\n        width: 32px;\n        height: 32px;\n        padding: 0;\n        justify-content: center;\n        margin-right: 8px;\n      }\n      \n      .", "-collapse-arrow {\n        font-size: 15px;\n      }\n      \n      .", "-collapse-extra {\n        height: 32px;\n        display: flex;\n        align-items: center;\n        margin-left: 8px;\n      }\n    }\n    & > .", "-collapse-panel {\n      border-top: 1px solid var(--", "-color-border-secondary);\n    }\n  }\n}\n"])), function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
   return p.antPrefix;
 }, function (p) {
   return p.antPrefix;

package/lib/components/commonComponents/FileIcon/demo/demo.js

@@ -1,17 +1,19 @@
 import { Button, FileCard, FileIcon } from "../../../..";
-import { Space } from 'antd';
+import { Flex, Space } from 'antd';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export default function () {
   var list = ['common', 'epub', 'excel', 'html', 'image', 'md', 'mobi', 'pdf', 'ppt', 'txt', 'web', 'word'];
-  return /*#__PURE__*/_jsxs("div", {
+  return /*#__PURE__*/_jsxs(Flex, {
+    vertical: true,
+    gap: "16px",
     children: [/*#__PURE__*/_jsx(Space, {
       children: list.map(function (t) {
         return /*#__PURE__*/_jsx(FileIcon, {
           type: t
         }, t);
       })
-    }), /*#__PURE__*/_jsx("div", {}), /*#__PURE__*/_jsx(Space, {
+    }), /*#__PURE__*/_jsx(Space, {
       wrap: true,
       children: list.map(function (t) {
         return /*#__PURE__*/_jsx(FileCard, {
@@ -20,7 +22,7 @@ export default function () {
           type: t
         }, t);
       })
-    }), /*#__PURE__*/_jsx("div", {}), /*#__PURE__*/_jsx(FileCard, {
+    }), /*#__PURE__*/_jsx(FileCard, {
       name: 'pdf',
       size: 1000,
       type: 'pdf',

package/lib/components/commonComponents/Image/index.js

@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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); }
+// @ts-nocheck
 import $18n from "../../../i18n";
 import { getCommonConfig } from "../../../config";
 import { SparkVisibleLine } from '@agentscope-ai/icons';

package/lib/components/commonComponents/MediaPreview/index.style.js

@@ -1,7 +1,7 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../../libs/createStyle";
-export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-media-preview-container {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 9999;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--", "-color-bg-mask);\n}\n\n.", "-media-preview-main-content {\n  border-radius: var(--", "-border-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  transition: transform 0.3s ease, opacity 0.15s ease;\n  opacity: 1;\n\n  &.transitioning {\n    opacity: 0;\n  }\n}\n\n.", "-media-preview-main-media {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n\n.", "-media-preview-nav-left {\n  position: absolute;\n  left: 48px;\n  top: 50%;\n  transform: translateY(-50%);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: none;\n  padding: 0;\n}\n\n.", "-media-preview-nav-right {\n  position: absolute;\n  right: 48px;\n  top: 50%;\n  transform: translateY(-50%);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: none;\n  padding: 0;\n}\n\n.", "-media-preview-nav-icon {\n  font-size: 48px;\n  color: var(--", "-color-bg-base);\n}\n\n.", "-media-preview-toolbar {\n  position: absolute;\n  top: 36px;\n  right: 36px;\n  display: flex;\n  flex-direction: row;\n  gap: 16px;\n}\n\n.", "-media-preview-zoom-controls {\n  display: flex;\n  flex-direction: row;\n  border-radius: 8px;\n  background: var(--", "-color-bg-mask);\n}\n\n.", "-media-preview-close-button {\n  display: flex;\n  flex-direction: row;\n  padding: 8px;\n  border-radius: 8px;\n  cursor: pointer;\n  border: none;\n}\n\n.", "-media-preview-tool-button {\n  background: transparent;\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.", "-media-preview-tool-icon {\n  font-size: 24px;\n  color: var(--", "-color-bg-base);\n  cursor: pointer;\n\n  &:hover {\n    opacity: 0.8;\n  }\n}\n\n.", "-media-preview-thumbnail-carousel {\n  position: absolute;\n  bottom: 42px;\n  left: 50%;\n  transform: translateX(-50%);\n  padding: 8px;\n  border-radius: 8px;\n  background: var(--", "-color-bg-mask);\n}\n\n.", "-media-preview-thumbnail-wrapper {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 8px;\n}\n\n.", "-media-preview-thumbnail-nav-icon {\n  font-size: 16px;\n  color: var(--", "-color-bg-base);\n  cursor: pointer;\n  flex-shrink: 0;\n\n  &:hover {\n    color: var(--", "-color-bg-base) !important;\n    opacity: 0.8;\n  }\n}\n\n.", "-media-preview-thumbnail-list {\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  overflow-x: auto;\n  scroll-behavior: smooth;\n  max-width: 720px;\n\n  &::-webkit-scrollbar {\n    display: none;\n  }\n}\n\n.", "-media-preview-thumbnail-item {\n  width: 56px;\n  height: 56px;\n  border-radius: 8px;\n  overflow: hidden;\n  cursor: pointer;\n  flex-shrink: 0;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n\n  &.active {\n    border-color: var(--", "-color-bg-base);\n  }\n\n  img,\n  video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n}\n"])), function (p) {
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-media-preview-container {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 9999;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--", "-color-bg-mask);\n}\n\n.", "-media-preview-main-content {\n  border-radius: var(--", "-border-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  transition: transform 0.3s ease, opacity 0.15s ease;\n  opacity: 1;\n\n  &.transitioning {\n    opacity: 0;\n  }\n}\n\n.", "-media-preview-main-media {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n\n.", "-media-preview-nav-left {\n  position: absolute;\n  left: 48px;\n  top: 50%;\n  transform: translateY(-50%);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: none;\n  padding: 0;\n}\n\n.", "-media-preview-nav-right {\n  position: absolute;\n  right: 48px;\n  top: 50%;\n  transform: translateY(-50%);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: none;\n  padding: 0;\n}\n\n.", "-media-preview-nav-icon {\n  font-size: 48px;\n  color: var(--", "-color-text-on-primary);\n}\n\n.", "-media-preview-toolbar {\n  position: absolute;\n  top: 36px;\n  right: 36px;\n  display: flex;\n  flex-direction: row;\n  gap: 16px;\n}\n\n.", "-media-preview-zoom-controls {\n  display: flex;\n  flex-direction: row;\n  border-radius: 8px;\n  background: var(--", "-color-bg-mask);\n}\n\n.", "-media-preview-close-button {\n  display: flex;\n  flex-direction: row;\n  padding: 8px;\n  border-radius: 8px;\n  cursor: pointer;\n  border: none;\n}\n\n.", "-media-preview-tool-button {\n  background: transparent;\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.", "-media-preview-tool-icon {\n  font-size: 24px;\n  color: var(--", "-color-text-on-primary);\n  cursor: pointer;\n\n  &:hover {\n    opacity: 0.8;\n  }\n}\n\n.", "-media-preview-thumbnail-carousel {\n  position: absolute;\n  bottom: 42px;\n  left: 50%;\n  transform: translateX(-50%);\n  padding: 8px;\n  border-radius: 8px;\n  background: var(--", "-color-bg-mask);\n}\n\n.", "-media-preview-thumbnail-wrapper {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 8px;\n}\n\n.", "-media-preview-thumbnail-nav-icon {\n  font-size: 16px;\n  color: var(--", "-color-text-on-primary);\n  cursor: pointer;\n  flex-shrink: 0;\n\n  &:hover {\n    color: var(--", "-color-text-on-primary);\n    opacity: 0.8;\n  }\n}\n\n.", "-media-preview-thumbnail-list {\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  overflow-x: auto;\n  scroll-behavior: smooth;\n  max-width: 720px;\n\n  &::-webkit-scrollbar {\n    display: none;\n  }\n}\n\n.", "-media-preview-thumbnail-item {\n  width: 56px;\n  height: 56px;\n  border-radius: 8px;\n  overflow: hidden;\n  cursor: pointer;\n  flex-shrink: 0;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n\n  &.active {\n    border-color: var(--", "-color-text-on-primary);\n  }\n\n  img,\n  video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n}\n"])), function (p) {
   return p.sparkPrefix;
 }, function (p) {
   return p.antPrefix;

package/lib/components/commonComponents/Modal/index.style.js

@@ -1,7 +1,7 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../../libs/createStyle";
-export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-modal {\n  .", "-modal-title {\n    min-height: 24px;\n  }\n  \n  .", "-modal-content {\n    padding: 0;\n    border: 1px solid var(--", "-color-border-secondary);\n    \n    .", "-modal-header {\n      padding: 18px 20px;\n      margin-bottom: 0;\n      \n      .", "-modal-title {\n        line-height: 28px;\n        \n        .", "-modal-title-wrapper {\n          display: flex;\n          justify-content: space-between;\n          align-items: center;\n          gap: 12px;\n          \n          .", "-modal-title {\n            flex: 1;\n          }\n          \n          .", "-modal-title-close {\n            cursor: pointer;\n          }\n        }\n      }\n    }\n    \n    .", "-modal-body {\n      padding: 20px;\n      color: var(--", "-color-text-secondary);\n    }\n    \n    .", "-modal-footer {\n      padding: 16px 20px;\n      margin-top: 0;\n      \n      .", "-modal-footer-wrapper {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        \n        .", "-modal-footer-info {\n          font-size: 14px;\n          font-weight: normal;\n          line-height: 24px;\n          color: var(--", "-color-text-tertiary);\n        }\n        \n        .", "-modal-footer-origin-node {\n          display: flex;\n          gap: 12px;\n        }\n      }\n    }\n    \n    .", "-modal-close {\n      width: 32px;\n      height: 32px;\n      top: 16px;\n      right: 16px;\n      \n      .", "-modal-close-icon {\n        color: var(--", "-color-text);\n      }\n      \n      &:hover {\n        background: none;\n      }\n    }\n  }\n}\n\n.", "-show-divider {\n  .", "-modal-content {\n    .", "-modal-header {\n      border-bottom: 1px solid var(--", "-color-border-secondary);\n    }\n    \n    .", "-modal-footer {\n      border-top: 1px solid var(--", "-color-border-secondary);\n    }\n  }\n}\n"])), function (p) {
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-modal {\n  .", "-modal-title {\n    min-height: 24px;\n  }\n  \n  .", "-modal-container {\n    padding: 0;\n    border: 1px solid var(--", "-color-border-secondary);\n    \n    .", "-modal-header {\n      padding: 18px 20px;\n      margin-bottom: 0;\n      \n      .", "-modal-title {\n        line-height: 28px;\n        \n        .", "-modal-title-wrapper {\n          display: flex;\n          justify-content: space-between;\n          align-items: center;\n          gap: 12px;\n          \n          .", "-modal-title {\n            flex: 1;\n          }\n          \n          .", "-modal-title-close {\n            cursor: pointer;\n          }\n        }\n      }\n    }\n    \n    .", "-modal-body {\n      padding: 20px;\n      color: var(--", "-color-text-secondary);\n    }\n    \n    .", "-modal-footer {\n      padding: 16px 20px;\n      margin-top: 0;\n      \n      .", "-modal-footer-wrapper {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        \n        .", "-modal-footer-info {\n          font-size: 14px;\n          font-weight: normal;\n          line-height: 24px;\n          color: var(--", "-color-text-tertiary);\n        }\n        \n        .", "-modal-footer-origin-node {\n          display: flex;\n          gap: 12px;\n        }\n      }\n    }\n    \n    .", "-modal-close {\n      width: 32px;\n      height: 32px;\n      top: 16px;\n      right: 16px;\n      \n      .", "-modal-close-icon {\n        color: var(--", "-color-text);\n      }\n      \n      &:hover {\n        background: none;\n      }\n    }\n  }\n}\n\n.", "-show-divider {\n  .", "-modal-container {\n    .", "-modal-header {\n      border-bottom: 1px solid var(--", "-color-border-secondary);\n    }\n    \n    .", "-modal-footer {\n      border-top: 1px solid var(--", "-color-border-secondary);\n    }\n  }\n}\n"])), function (p) {
   return p.sparkPrefix;
 }, function (p) {
   return p.antPrefix;

package/lib/components/commonComponents/Pagination/index.style.js

@@ -1,7 +1,7 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../../libs/createStyle";
-export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-pagination {\n  color: var(--", "-color-text) !important;\n  font-weight: 500 !important;\n  \n  .", "-pagination-total-text {\n    font-weight: 500;\n  }\n  \n  .", "-select-selection-item {\n    font-weight: 500;\n  }\n  \n  .", "-pagination-item-active {\n    border-color: var(--", "-color-border-secondary);\n    border-radius: 8px;\n    font-weight: \n    \n    a {\n      color: var(--", "-color-text) !important;\n    }\n  }\n  \n  a {\n    color: var(--", "-color-text) !important;\n    font-weight: 500 !important;\n  }\n  \n  .", "-pagination-jump-next {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  \n  .", "-pagination-jump-prev {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n}\n\n.", "-pagination {\n  .", "-pagination-prev,\n  .", "-pagination-next,\n  .", "-pagination-jump-prev,\n  .", "-pagination-jump-next {\n    font-family: Montserrat;\n    display: inline-block !important;\n  }\n}\n"])), function (p) {
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-pagination {\n  color: var(--", "-color-text) !important;\n  font-weight: 500 !important;\n  \n  .", "-pagination-total-text {\n    font-weight: 500;\n  }\n  \n  .", "-select-selection-item {\n    font-weight: 500;\n  }\n  \n  .", "-pagination-item-active {\n    border-color: var(--", "-color-border-secondary);\n    border-radius: 8px;\n    font-weight: \n    \n    a {\n      color: var(--", "-color-text) !important;\n    }\n  }\n  \n  a {\n    color: var(--", "-color-text) !important;\n    font-weight: 500 !important;\n  }\n  \n  .", "-pagination-jump-next {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  \n  .", "-pagination-jump-prev {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n}\n\n.", "-pagination \n.", "-pagination-jump-next \n.", "-pagination-item-container \n.", "-pagination-item-ellipsis {\n  color: var(--", "-color-text);\n  left: -4px;\n  font-family: serif;\n}\n"])), function (p) {
   return p.antPrefix;
 }, function (p) {
   return p.antPrefix;

package/lib/components/commonComponents/PromptsEditor/VarRender.js

@@ -1,52 +1,14 @@
 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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+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); }
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-import { Decoration, EditorView, MatchDecorator, ViewPlugin, WidgetType } from '@codemirror/view';
+import { Decoration, MatchDecorator, ViewPlugin } from '@codemirror/view';
 
-// Placeholder Widget 类
-var PlaceholderWidget = /*#__PURE__*/function (_WidgetType) {
-  _inherits(PlaceholderWidget, _WidgetType);
-  var _super = _createSuper(PlaceholderWidget);
-  function PlaceholderWidget(name) {
-    var _this;
-    _classCallCheck(this, PlaceholderWidget);
-    _this = _super.call(this);
-    _this.name = name;
-    return _this;
-  }
-  _createClass(PlaceholderWidget, [{
-    key: "eq",
-    value: function eq(other) {
-      return other.name === this.name;
-    }
-  }, {
-    key: "toDOM",
-    value: function toDOM() {
-      var wrap = document.createElement('span');
-      wrap.setAttribute('aria-hidden', 'true');
-      wrap.className = 'cm-prompt-var';
-      wrap.textContent = "${".concat(this.name, "}");
-      return wrap;
-    }
-  }, {
-    key: "ignoreEvent",
-    value: function ignoreEvent() {
-      return false;
-    }
-  }]);
-  return PlaceholderWidget;
-}(WidgetType); // Placeholder 匹配器
+// 使用 Mark Decoration 而不是 Replace Decoration
+// 这样文本保持可编辑，只添加样式高亮
 var placeholderMatcher = new MatchDecorator({
   // 该正则用于匹配形如 ${变量名} 的占位符，变量名允许为中文、字母、数字、下划线
   // \${         匹配字符 "${"
@@ -54,9 +16,9 @@ var placeholderMatcher = new MatchDecorator({
   // \}          匹配字符 "}"
   // g           全局匹配
   regexp: /\$\{([\w\u4e00-\u9fa5]+)\}/g,
-  decoration: function decoration(match) {
-    return Decoration.replace({
-      widget: new PlaceholderWidget(match[1])
+  decoration: function decoration() {
+    return Decoration.mark({
+      class: 'cm-prompt-var'
     });
   }
 });
@@ -78,12 +40,7 @@ var placeholders = ViewPlugin.fromClass( /*#__PURE__*/function () {
 }(), {
   decorations: function decorations(instance) {
     return instance.placeholders;
-  },
-  provide: function provide(plugin) {
-    return EditorView.atomicRanges.of(function (view) {
-      var _view$plugin;
-      return ((_view$plugin = view.plugin(plugin)) === null || _view$plugin === void 0 ? void 0 : _view$plugin.placeholders) || Decoration.none;
-    });
   }
+  // 移除 atomicRanges，允许用户在变量内部编辑
 });
 export default [placeholders];

package/lib/components/commonComponents/PromptsEditor/index.js

@@ -1,5 +1,4 @@
 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); }
-var _templateObject, _templateObject2;
 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); }
@@ -13,57 +12,19 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 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; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 // @ts-nocheck
 import { SparkEnterLine } from '@agentscope-ai/icons';
 import { markdown } from '@codemirror/lang-markdown';
 import { vscodeDark, vscodeLight } from '@uiw/codemirror-theme-vscode';
 import CodeMirror from '@uiw/react-codemirror';
 import { ConfigProvider, theme } from 'antd';
-import { createStyles } from 'antd-style';
 import classNames from 'classnames';
 import React, { memo, useEffect, useMemo, useState } from 'react';
+import { useStyles } from "./index.style";
 import VarRender from "./VarRender";
 import VarSelectInput from "./VarSelectInput";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var useStyles = createStyles(function (_ref) {
-  var css = _ref.css,
-    token = _ref.token;
-  return {
-    onCreate: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    .cm-tooltip li:last-of-type {\n      position: absolute;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      height: 40px;\n      border-top: 1px solid ", ";\n      border-radius: 0 !important;\n      background-color: ", " !important;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      margin: 0 !important;\n    }\n\n    .cm-tooltip ul {\n      margin-bottom: 40px !important;\n    }\n\n    .cm-tooltip li:first-of-type {\n      border-top: none !important;\n    }\n  "])), token.colorBorderSecondary, token.colorBgContainer),
-    cm: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    .cm-line {\n      color: ", ";\n    }\n    .cm-line span {\n      color: ", ";\n    }\n\n    .cm-editor {\n      position: absolute !important;\n      background-color: transparent !important;\n\n      top: 0;\n      left: 8px;\n      right: 0;\n      bottom: 30px;\n    }\n    .cm-focused {\n      outline: none;\n    }\n\n    .cm-content {\n      width: 100%;\n      padding: 8px 0;\n      white-space: break-spaces;\n    }\n\n    .cm-line {\n      line-height: 24px;\n      height: auto !important;\n    }\n\n    .cm-prompt-var {\n      font-size: inherit;\n      color: ", " !important;\n      background-color: ", " !important;\n      line-height: 1.7;\n      font-weight: 500;\n      margin: 0 2px;\n      height: 24px;\n      display: inline-flex;\n      padding: 0 4px;\n      border-radius: 4px;\n    }\n\n    .cm-tooltip {\n      position: relative;\n      background-color: ", ";\n      border: 0;\n      border-radius: 4px;\n      overflow: hidden;\n      box-shadow: 0px 3px 12px 0px rgba(47, 49, 51, 0.12);\n    }\n\n    .cm-tooltip ul {\n      max-height: 17em !important;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .cm-tooltip li {\n      margin: 4px 8px;\n      height: 32px;\n      padding: 0 12px !important;\n      flex: 0 0 32px;\n      display: flex;\n      align-items: center;\n    }\n\n    .cm-tooltip-autocomplete ul li[aria-selected] {\n      border-radius: 6px;\n      font-weight: 600;\n      color: ", ";\n      background-color: ", ";\n    }\n\n    .cm-completionInfo-right {\n      display: none;\n    }\n\n    .cm-completionIcon {\n      display: none;\n    }\n  "])), token.colorTextSecondary, token.colorBlue, token.colorPurple, token.colorPurpleBg, token.colorBgContainer, token.colorText, token.colorFillSecondary),
-    root: {
-      position: 'relative',
-      minHeight: 300,
-      backgroundColor: token.colorBgBase,
-      border: "1px solid ".concat(token.colorBorderSecondary),
-      borderRadius: 6,
-      overflow: 'hidden',
-      padding: '4px 12px',
-      resize: 'vertical'
-    },
-    footer: {
-      position: 'absolute',
-      bottom: 0,
-      left: 0,
-      right: 0,
-      padding: '0 12px',
-      height: 30,
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'space-between',
-      fontSize: 12,
-      color: token.colorTextTertiary,
-      backgroundColor: token.colorBgBase
-    },
-    tips: {
-      display: 'flex',
-      alignItems: 'center',
-      gap: 4
-    }
-  };
-});
 export var langExtensionsMap = {
   markdown: [markdown()]
 };
@@ -119,7 +80,7 @@ var Editor = function Editor(props) {
   return /*#__PURE__*/_jsxs("div", {
     className: styles.root,
     children: [/*#__PURE__*/_jsx(CodeMirror, {
-      className: classNames(styles.cm, _defineProperty({}, styles.onCreate, onCreate)),
+      className: classNames(props.className, styles.cm, _defineProperty({}, styles.onCreate, onCreate)),
       extensions: extensions,
       value: props.value,
       theme: getTheme,
@@ -130,7 +91,8 @@ var Editor = function Editor(props) {
         foldGutter: false,
         highlightActiveLine: false
       },
-      readOnly: props.readOnly
+      readOnly: props.readOnly,
+      editable: !props.readOnly
     }, getTheme), /*#__PURE__*/_jsxs("div", {
       className: styles.footer,
       children: [tips, props.maxLength ? /*#__PURE__*/_jsxs("div", {

package/lib/components/commonComponents/PromptsEditor/index.style.d.ts

@@ -0,0 +1,51 @@
+/**
+ * PromptsEditor 组件样式
+ */
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    /**
+     * 新增变量按钮相关样式
+     */
+    onCreate: import("antd-style").SerializedStyles;
+    /**
+     * CodeMirror 编辑器样式
+     */
+    cm: import("antd-style").SerializedStyles;
+    /**
+     * 根容器样式
+     */
+    root: {
+        position: "relative";
+        minHeight: number;
+        backgroundColor: any;
+        border: string;
+        borderRadius: number;
+        overflow: "hidden";
+        padding: string;
+        resize: "vertical";
+    };
+    /**
+     * 底部栏样式
+     */
+    footer: {
+        position: "absolute";
+        bottom: number;
+        left: number;
+        right: number;
+        padding: string;
+        height: number;
+        display: "flex";
+        alignItems: "center";
+        justifyContent: "space-between";
+        fontSize: number;
+        color: any;
+        backgroundColor: any;
+    };
+    /**
+     * 提示文本样式
+     */
+    tips: {
+        display: "flex";
+        alignItems: "center";
+        gap: number;
+    };
+}>;

package/lib/components/commonComponents/PromptsEditor/index.style.js

@@ -0,0 +1,60 @@
+var _templateObject, _templateObject2;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+// @ts-nocheck
+import { createStyles } from 'antd-style';
+
+/**
+ * PromptsEditor 组件样式
+ */
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token;
+  return {
+    /**
+     * 新增变量按钮相关样式
+     */
+    onCreate: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    .cm-tooltip li:last-of-type {\n      position: absolute;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      height: 40px;\n      border-top: 1px solid ", ";\n      border-radius: 0 !important;\n      background-color: ", " !important;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      margin: 0 !important;\n    }\n\n    .cm-tooltip ul {\n      margin-bottom: 40px !important;\n    }\n\n    .cm-tooltip li:first-of-type {\n      border-top: none !important;\n    }\n  "])), token.colorBorderSecondary, token.colorBgContainer),
+    /**
+     * CodeMirror 编辑器样式
+     */
+    cm: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    .cm-line {\n      color: ", ";\n    }\n    .cm-line span {\n      color: ", ";\n    }\n\n    .cm-editor {\n      position: absolute !important;\n      background-color: transparent !important;\n\n      top: 0;\n      left: 8px;\n      right: 0;\n      bottom: 30px;\n    }\n    .cm-focused {\n      outline: none;\n    }\n\n    .cm-content {\n      width: 100%;\n      padding: 8px 0;\n      white-space: break-spaces;\n    }\n\n    .cm-line {\n      line-height: 24px;\n      height: auto !important;\n    }\n\n    /* \u53D8\u91CF\u9AD8\u4EAE\u6837\u5F0F */\n    .cm-prompt-var {\n      font-size: inherit;\n      color: ", " !important;\n      background-color: ", " !important;\n      line-height: 1.7;\n      font-weight: 500;\n      margin: 0 2px;\n      height: 24px;\n      display: inline-flex;\n      padding: 0 4px;\n      border-radius: 4px;\n    }\n\n    /* \u81EA\u52A8\u8865\u5168\u63D0\u793A\u6846\u6837\u5F0F */\n    .cm-tooltip {\n      position: relative;\n      background-color: ", ";\n      border: 0;\n      border-radius: 4px;\n      overflow: hidden;\n      box-shadow: 0px 3px 12px 0px rgba(47, 49, 51, 0.12);\n    }\n\n    .cm-tooltip ul {\n      max-height: 17em !important;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .cm-tooltip li {\n      margin: 4px 8px;\n      height: 32px;\n      padding: 0 12px !important;\n      flex: 0 0 32px;\n      display: flex;\n      align-items: center;\n    }\n\n    .cm-tooltip-autocomplete ul li[aria-selected] {\n      border-radius: 6px;\n      font-weight: 600;\n      color: ", ";\n      background-color: ", ";\n    }\n\n    .cm-completionInfo-right {\n      display: none;\n    }\n\n    .cm-completionIcon {\n      display: none;\n    }\n  "])), token.colorTextSecondary, token.colorBlue, token.colorPurple, token.colorPurpleBg, token.colorBgContainer, token.colorText, token.colorFillSecondary),
+    /**
+     * 根容器样式
+     */
+    root: {
+      position: 'relative',
+      minHeight: 300,
+      backgroundColor: token.colorBgBase,
+      border: "1px solid ".concat(token.colorBorderSecondary),
+      borderRadius: 6,
+      overflow: 'hidden',
+      padding: '4px 12px',
+      resize: 'vertical'
+    },
+    /**
+     * 底部栏样式
+     */
+    footer: {
+      position: 'absolute',
+      bottom: 0,
+      left: 0,
+      right: 0,
+      padding: '0 12px',
+      height: 30,
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      fontSize: 12,
+      color: token.colorTextTertiary,
+      backgroundColor: token.colorBgBase
+    },
+    /**
+     * 提示文本样式
+     */
+    tips: {
+      display: 'flex',
+      alignItems: 'center',
+      gap: 4
+    }
+  };
+});

package/lib/components/commonComponents/RadioButton/demo/demo4.js

@@ -12,8 +12,7 @@ var App = function App() {
     children: /*#__PURE__*/_jsx(RadioButton, {
       onChange: onChange,
       defaultValue: "a",
-      buttonStyle: "solid",
-      ghost: false,
+      bordered: true,
       options: [{
         value: 'a',
         label: 'Qwen-Max'

package/lib/components/commonComponents/RadioButton/index.style.js

@@ -1,7 +1,7 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../../libs/createStyle";
-export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-radio-button-wrapper {\n  border: none;\n  background-color: transparent;\n  border-radius: 6px;\n  \n  &:first-child {\n    border-inline-start: initial;\n  }\n  \n  &::before {\n    display: none !important;\n  }\n  \n  &:not(:last-child) {\n    margin-right: 12px;\n  }\n}\n\n.", "-radio-group-ghost {\n  .", "-radio-button-wrapper-checked {\n    &:not(.", "-radio-button-wrapper-disabled) {\n      color: var(--", "-color-primary);\n      background-color: var(--", "-color-primary-bg);\n      \n      .", "-radio-button-wrapper-checked {\n        background-color: var(--", "-color-primary-bg);\n      }\n    }\n    \n    &.", "-radio-button-wrapper-disabled {\n      &:hover {\n        background-color: var(--", "-color-fill-tertiary);\n      }\n    }\n  }\n}\n\n.", "-radio-group-bordered {\n  .", "-radio-button-wrapper {\n    border: var(--", "-line-width) var(--", "-line-type) var(--", "-color-border);\n    \n    &:not(:first-child) {\n      border-inline-start-width: 1px;\n    }\n  }\n}\n\n.", "-radio-button-wrapper-disabled {\n  color: var(--", "-color-text-tertiary);\n  background-color: transparent;\n  \n  &:hover {\n    color: var(--", "-color-text-tertiary);\n    background-color: transparent;\n  }\n}\n\n.", "-radio-button-wrapper-checked.", "-radio-button-wrapper-disabled {\n  color: var(--", "-color-text-tertiary);\n  background-color: var(--", "-color-fill-tertiary);\n  \n  &:hover {\n    color: var(--", "-color-text-tertiary);\n    background-color: var(--", "-color-fill-tertiary);\n  }\n}\n"])), function (p) {
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-radio-button-wrapper {\n  border: none;\n  background-color: transparent;\n  border-radius: 6px;\n  \n  &:first-child {\n    border-inline-start: initial;\n  }\n  \n  &::before {\n    display: none !important;\n  }\n  \n  &:not(:last-child) {\n    margin-right: 12px;\n  }\n}\n\n.", "-radio-group-ghost {\n  .", "-radio-button-wrapper-checked {\n    &:not(.", "-radio-button-wrapper-disabled) {\n      color: var(--", "-color-primary);\n      background-color: var(--", "-color-primary-bg);\n      \n      .", "-radio-button-wrapper-checked {\n        background-color: var(--", "-color-primary-bg);\n      }\n    }\n    \n    &.", "-radio-button-wrapper-disabled {\n      &:hover {\n        background-color: var(--", "-color-fill-tertiary);\n      }\n    }\n  }\n}\n\n.", "-radio-group-bordered {\n  .", "-radio-button-wrapper {\n    border: var(--", "-line-width) var(--", "-line-type) var(--", "-color-border);\n    \n    &:not(:first-child) {\n      border-inline-start-width: 1px;\n    }\n  }\n\n  .", "-radio-button-wrapper-checked.", "-radio-button-wrapper {\n    border-color: var(--", "-color-primary);\n  }\n}\n\n.", "-radio-button-wrapper-disabled {\n  color: var(--", "-color-text-tertiary);\n  background-color: transparent;\n  \n  &:hover {\n    color: var(--", "-color-text-tertiary);\n    background-color: transparent;\n  }\n}\n\n.", "-radio-button-wrapper-checked.", "-radio-button-wrapper-disabled {\n  color: var(--", "-color-text-tertiary);\n  background-color: var(--", "-color-fill-tertiary);\n  \n  &:hover {\n    color: var(--", "-color-text-tertiary);\n    background-color: var(--", "-color-fill-tertiary);\n  }\n}\n"])), function (p) {
   return p.antPrefix;
 }, function (p) {
   return p.antPrefix;
@@ -49,4 +49,10 @@ export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _t
   return p.antPrefix;
 }, function (p) {
   return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
 });

package/lib/components/commonComponents/Table/demo/demo1.js

@@ -94,7 +94,7 @@ var App = function App() {
       });
     }
   }];
-  var data = new Array(3).fill(0).map(function (_, index) {
+  var data = new Array(100).fill(0).map(function (_, index) {
     return {
       key: index.toString(),
       title: "First Column Row ".concat(index + 1),

package/lib/components/commonComponents/Tooltip/demo/demo3.js

@@ -1,13 +1,14 @@
 import { Button, Tooltip } from "../../../..";
+import { Flex } from 'antd';
 import React from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var title = new Array(100).fill(1).map(function (_, index) {
   return "".concat(index + 1, " \u6D4B\u8BD5maxHeight\u5C5E\u6027\u7684\u573A\u666F");
 }).join('');
 var App = function App() {
-  return /*#__PURE__*/_jsxs(_Fragment, {
+  return /*#__PURE__*/_jsxs(Flex, {
+    gap: "16px",
     children: [/*#__PURE__*/_jsx(Tooltip, {
       title: title,
       maxHeight: 400,

package/lib/components/commonComponents/Tooltip/index.d.ts

@@ -10,9 +10,9 @@ export interface SparkTooltipProps {
     /**
      * @description 最大高度
      * @descriptionEn max height
-     * @default '90vh'
+     * @default '60vh'
      */
     maxHeight?: number | string;
 }
-declare const SparkTooltip: import("react").ForwardRefExoticComponent<(SparkTooltipProps & TooltipProps) & import("react").RefAttributes<any>>;
+declare const SparkTooltip: import("react").ForwardRefExoticComponent<SparkTooltipProps & TooltipProps & import("react").RefAttributes<any>>;
 export default SparkTooltip;

package/lib/components/commonComponents/Tooltip/index.js

@@ -21,9 +21,8 @@ var SparkTooltip = /*#__PURE__*/forwardRef(function (props, ref) {
   var _props$mode = props.mode,
     mode = _props$mode === void 0 ? 'dark' : _props$mode,
     _props$maxHeight = props.maxHeight,
-    maxHeight = _props$maxHeight === void 0 ? '90vh' : _props$maxHeight,
-    _props$styles = props.styles,
-    styles = _props$styles === void 0 ? {} : _props$styles,
+    maxHeight = _props$maxHeight === void 0 ? '60vh' : _props$maxHeight,
+    styles = props.styles,
     arrow = props.arrow,
     overlayClassName = props.overlayClassName,
     getPopupContainer = props.getPopupContainer,
@@ -32,14 +31,19 @@ var SparkTooltip = /*#__PURE__*/forwardRef(function (props, ref) {
   var _getCommonConfig = getCommonConfig(),
     sparkPrefix = _getCommonConfig.sparkPrefix,
     antPrefix = _getCommonConfig.antPrefix;
+
+  // 处理 styles 可能是函数的情况
+  var stylesObj = typeof styles === 'function' ? {} : styles !== null && styles !== void 0 ? styles : {};
+  var mergedStyles = _objectSpread(_objectSpread({}, stylesObj), {}, {
+    container: _objectSpread(_objectSpread({
+      overflow: 'auto'
+    }, stylesObj.container), {}, {
+      maxHeight: maxHeight // maxHeight 放最后，确保优先级最高
+    })
+  });
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsx(Tooltip, _objectSpread(_objectSpread({}, restProps), {}, {
-      styles: _objectSpread(_objectSpread({}, styles), {}, {
-        body: _objectSpread({
-          maxHeight: maxHeight,
-          overflow: 'auto'
-        }, styles.body)
-      }),
+      styles: mergedStyles,
       arrow: arrow !== null && arrow !== void 0 ? arrow : false,
       overlayClassName: classNames(overlayClassName, mode === 'light' && "".concat(sparkPrefix, "-tooltip-light")),
       getPopupContainer: getPopupContainer || function (triggerNode) {

package/lib/components/commonComponents/Video/index.style.js

@@ -1,7 +1,7 @@
 var _templateObject;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import createGlobalStyle from "../../../libs/createStyle";
-export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n// Video \u4E3B\u5BB9\u5668\u6837\u5F0F\n.", "-video-container {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  background: #000;\n\n  button {\n    --", "-color-text-disabled: rgba(231, 231, 237, 0.25) !important;\n    --", "-button-text-text-color: rgba(231, 231, 237, 0.88) !important;\n    --", "-button-text-text-hover-color: rgba(231, 231, 237, 0.88) !important;\n    --", "-button-text-hover-bg: rgba(231, 231, 237, 0.08) !important;\n  }\n\n  .", "-media-time-text {\n    color: var(--", "-color-text-white);\n  }\n\n  // \u8FDB\u5EA6\u6761\u6837\u5F0F\n  .", "-media-progress-bar {\n    .", "-progress-inner {\n      --", "-progress-remaining-color: var(--", "-color-fill);\n    }\n    \n    .", "-progress-bg {\n      background: var(--", "-color-text-white) !important;\n    }\n  }\n}\n\n.", "-video-content {\n  position: relative;\n  width: 100%;\n  height: 100%;\n}\n\n.", "-video-element {\n  position: relative;\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.", "-video-poster {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.", "-video-controller-wrapper {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: linear-gradient(0deg, #000000 2%, rgba(0, 0, 0, 0) 94%);\n  transition: opacity 0.3s;\n}\n"])), function (p) {
+export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n// Video \u4E3B\u5BB9\u5668\u6837\u5F0F\n.", "-video-container {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  background: #000;\n\n  button {\n    --", "-color-text-disabled: rgba(231, 231, 237, 0.25) !important;\n    --", "-button-text-text-color: rgba(231, 231, 237, 0.88) !important;\n    --", "-button-text-text-hover-color: rgba(231, 231, 237, 0.88) !important;\n    --", "-button-text-hover-bg: rgba(231, 231, 237, 0.08) !important;\n  }\n\n  .", "-btn {\n    color: var(--", "-button-text-text-color);\n  }\n\n  .", "-media-time-text {\n    color: var(--", "-color-text-white);\n  }\n\n  // \u8FDB\u5EA6\u6761\u5BB9\u5668\u6837\u5F0F\n  .", "-progress {\n    .", "-progress-body {\n      .", "-progress-rail {\n        background: var(--", "-color-fill) !important;\n      }\n      .", "-progress-track {\n        background: var(--", "-color-text-white) !important;\n      }\n    }\n  }\n}\n\n.", "-video-content {\n  position: relative;\n  width: 100%;\n  height: 100%;\n}\n\n.", "-video-element {\n  position: relative;\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.", "-video-poster {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.", "-video-controller-wrapper {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: linear-gradient(0deg, #000000 2%, rgba(0, 0, 0, 0) 94%);\n  transition: opacity 0.3s;\n}\n"])), function (p) {
   return p.sparkPrefix;
 }, function (p) {
   return p.antPrefix;
@@ -12,7 +12,7 @@ export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _t
 }, function (p) {
   return p.antPrefix;
 }, function (p) {
-  return p.sparkPrefix;
+  return p.antPrefix;
 }, function (p) {
   return p.antPrefix;
 }, function (p) {
@@ -27,6 +27,10 @@ export var useStyle = createGlobalStyle(_templateObject || (_templateObject = _t
   return p.antPrefix;
 }, function (p) {
   return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
+}, function (p) {
+  return p.antPrefix;
 }, function (p) {
   return p.sparkPrefix;
 }, function (p) {