@agentscope-ai/design 1.0.7 → 1.0.9

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

@@ -0,0 +1,13 @@
+import { Button, Popconfirm } from "../../../..";
+import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+var App = function App() {
+  return /*#__PURE__*/_jsx(Popconfirm, {
+    title: "Title here",
+    description: "Descriptive content explaining the action or outcome.",
+    children: /*#__PURE__*/_jsx(Button, {
+      children: "Open Popconfirm"
+    })
+  });
+};
+export default App;

package/lib/components/commonComponents/Popconfirm/demo/demo2.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const App: React.FC;
+export default App;

package/lib/components/commonComponents/Popconfirm/demo/demo2.js

@@ -0,0 +1,49 @@
+import { Button, Popconfirm } from "../../../..";
+import { Flex } from 'antd';
+import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var App = function App() {
+  return /*#__PURE__*/_jsxs(Flex, {
+    vertical: true,
+    gap: 24,
+    children: [/*#__PURE__*/_jsx(Popconfirm, {
+      title: "Title here",
+      description: "Descriptive content explaining the action or outcome.",
+      type: "info",
+      children: /*#__PURE__*/_jsx(Button, {
+        children: "Info"
+      })
+    }), /*#__PURE__*/_jsx(Popconfirm, {
+      title: "Title here",
+      description: "Descriptive content explaining the action or outcome.",
+      type: "success",
+      children: /*#__PURE__*/_jsx(Button, {
+        children: "Success"
+      })
+    }), /*#__PURE__*/_jsx(Popconfirm, {
+      title: "Title here",
+      description: "Descriptive content explaining the action or outcome.",
+      type: "warning",
+      okText: "Primary Danger",
+      children: /*#__PURE__*/_jsx(Button, {
+        children: "Warning"
+      })
+    }), /*#__PURE__*/_jsx(Popconfirm, {
+      title: "Title here",
+      description: "Descriptive content explaining the action or outcome.",
+      type: "error",
+      okText: "Primary Danger",
+      children: /*#__PURE__*/_jsx(Button, {
+        children: "Error"
+      })
+    }), /*#__PURE__*/_jsx(Popconfirm, {
+      title: "Title here",
+      description: "Descriptive content explaining the action or outcome.",
+      children: /*#__PURE__*/_jsx(Button, {
+        children: "Confirm"
+      })
+    })]
+  });
+};
+export default App;

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

@@ -1,5 +1,12 @@
 import { PopconfirmProps } from 'antd';
 import React from 'react';
-declare const SparkPopconfirm: React.ForwardRefExoticComponent<PopconfirmProps & React.RefAttributes<any>>;
+export interface SparkPopconfirmProps extends PopconfirmProps {
+    /**
+     * @description 类型
+     * @descriptionEn type of the popconfirm
+     * @default 'confirm'
+     */
+    type?: 'info' | 'warning' | 'error' | 'success' | 'confirm';
+}
+declare const SparkPopconfirm: React.ForwardRefExoticComponent<SparkPopconfirmProps & React.RefAttributes<any>>;
 export default SparkPopconfirm;
-export type SparkPopconfirmProps = PopconfirmProps;

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

@@ -1,5 +1,5 @@
 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 _excluded = ["icon"];
+var _excluded = ["icon", "type", "okButtonProps"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 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; }
@@ -8,22 +8,64 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { getCommonConfig } from "../../..";
-import { ExclamationCircleOutlined } from "@agentscope-ai/icons-override-antd";
+import { CheckCircleOutlined, CloseCircleOutlined, ExclamationCircleOutlined, InfoCircleOutlined } from '@agentscope-ai/icons-override-antd';
 import { Popconfirm } from 'antd';
 import React from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 var SparkPopconfirm = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var commonConfig = getCommonConfig();
-  var antPrefix = commonConfig.antPrefix;
   var icon = props.icon,
+    _props$type = props.type,
+    type = _props$type === void 0 ? 'confirm' : _props$type,
+    okButtonProps = props.okButtonProps,
     rest = _objectWithoutProperties(props, _excluded);
-  return /*#__PURE__*/_jsx(Popconfirm, _objectSpread(_objectSpread({}, rest), {}, {
-    ref: ref,
-    icon: icon || /*#__PURE__*/_jsx(ExclamationCircleOutlined, {
+  var _getCommonConfig = getCommonConfig(),
+    antPrefix = _getCommonConfig.antPrefix;
+  var getMergedIcon = function getMergedIcon() {
+    if (icon) return icon;
+    if (type === 'confirm') return /*#__PURE__*/_jsx(ExclamationCircleOutlined, {
+      style: {
+        color: "var(--".concat(antPrefix, "-color-warning)")
+      }
+    });
+    if (type === 'info') return /*#__PURE__*/_jsx(InfoCircleOutlined, {
+      style: {
+        color: "var(--".concat(antPrefix, "-color-info)")
+      }
+    });
+    if (type === 'warning') return /*#__PURE__*/_jsx(ExclamationCircleOutlined, {
+      style: {
+        color: "var(--".concat(antPrefix, "-color-warning)")
+      }
+    });
+    if (type === 'error') return /*#__PURE__*/_jsx(CloseCircleOutlined, {
+      style: {
+        color: "var(--".concat(antPrefix, "-color-error)")
+      }
+    });
+    if (type === 'success') return /*#__PURE__*/_jsx(CheckCircleOutlined, {
+      style: {
+        color: "var(--".concat(antPrefix, "-color-success)")
+      }
+    });
+    return /*#__PURE__*/_jsx(ExclamationCircleOutlined, {
       style: {
         color: "var(--".concat(antPrefix, "-color-warning)")
       }
-    })
+    });
+  };
+  var getMergedOkButtonProps = function getMergedOkButtonProps() {
+    var innerOkButtonProps = {};
+    if (['warning', 'error'].includes(type)) {
+      innerOkButtonProps.danger = true;
+    }
+    return _objectSpread(_objectSpread({}, innerOkButtonProps), okButtonProps || {});
+  };
+  return /*#__PURE__*/_jsx(Popconfirm, _objectSpread(_objectSpread({}, rest), {}, {
+    ref: ref,
+    icon: getMergedIcon()
+    // @ts-ignore
+    ,
+    okButtonProps: getMergedOkButtonProps()
   }));
 });
 export default SparkPopconfirm;

package/lib/components/commonComponents/PromptsEditor/VarRender.d.ts

@@ -0,0 +1,6 @@
+import { DecorationSet, ViewPlugin, ViewUpdate } from '@codemirror/view';
+declare const _default: ViewPlugin<{
+    placeholders: DecorationSet;
+    update(update: ViewUpdate): void;
+}>[];
+export default _default;

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

@@ -0,0 +1,84 @@
+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 _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';
+
+// 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 匹配器
+var placeholderMatcher = new MatchDecorator({
+  regexp: /\$\{(\w+)\}/g,
+  decoration: function decoration(match) {
+    return Decoration.replace({
+      widget: new PlaceholderWidget(match[1])
+    });
+  }
+});
+
+// Placeholder 插件
+var placeholders = ViewPlugin.fromClass( /*#__PURE__*/function () {
+  function _class2(view) {
+    _classCallCheck(this, _class2);
+    _defineProperty(this, "placeholders", void 0);
+    this.placeholders = placeholderMatcher.createDeco(view);
+  }
+  _createClass(_class2, [{
+    key: "update",
+    value: function update(_update) {
+      this.placeholders = placeholderMatcher.updateDeco(_update, this.placeholders);
+    }
+  }]);
+  return _class2;
+}(), {
+  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;
+    });
+  }
+});
+export default [placeholders];

package/lib/components/commonComponents/PromptsEditor/VarSelectInput.d.ts

@@ -0,0 +1,6 @@
+import { Completion } from '@codemirror/autocomplete';
+import { Extension } from '@codemirror/state';
+export default function (data: Completion[], config: {
+    onCreate?: () => void;
+    createBtnText?: string;
+}): Extension;

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

@@ -0,0 +1,60 @@
+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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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 _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 _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 _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 _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; }
+import { autocompletion } from '@codemirror/autocomplete';
+export default function () {
+  var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var config = arguments.length > 1 ? arguments[1] : undefined;
+  var onCreate = config.onCreate,
+    createBtnText = config.createBtnText;
+  return autocompletion({
+    override: [function (context) {
+      var word = context.matchBefore(/\/(\w+)?/);
+      if (!word) return null;
+      if (word && word.from == word.to && !context.explicit) {
+        return null;
+      }
+      return {
+        from: word === null || word === void 0 ? void 0 : word.from,
+        options: (onCreate ? [].concat(_toConsumableArray(data), [{
+          label: '/NEW_VAR',
+          boost: -99
+        }]) : data).map(function (item) {
+          return _objectSpread(_objectSpread({}, item), {}, {
+            displayLabel: item.label === '/NEW_VAR' ? createBtnText : item.label.slice(1),
+            apply: function apply(view, completion, from, to) {
+              if (completion.label === '/NEW_VAR') {
+                view.dispatch({
+                  changes: {
+                    from: from,
+                    to: to,
+                    insert: ''
+                  }
+                });
+                return onCreate === null || onCreate === void 0 ? void 0 : onCreate();
+              }
+              var variableName = completion.label.slice(1);
+              var variableText = "${".concat(variableName, "}");
+              view.dispatch({
+                changes: {
+                  from: from,
+                  to: to,
+                  insert: variableText
+                }
+              });
+            }
+          });
+        })
+      };
+    }]
+  });
+}

package/lib/components/commonComponents/PromptsEditor/demo/basic.d.ts

@@ -0,0 +1 @@
+export default function Basic(): import("react/jsx-runtime").JSX.Element;

package/lib/components/commonComponents/PromptsEditor/demo/basic.js

@@ -0,0 +1,30 @@
+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 { PromptsEditor } from "../../../..";
+import { useState } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function Basic() {
+  var _useState = useState("# \u89D2\u8272\n\u4F60\u662F\u4E00\u4E2A\u4E13\u4E1A\u7684Prompt\u7F16\u5199\u5DE5\u7A0B\u5E08\uFF0C\u64C5\u957F\u7F16\u5199\u5404\u79CD\u7C7B\u578B\u7684Prompt\u3002\n\n# \u6280\u80FD\n1. \u4F60\u64C5\u957F\u7F16\u5199\u5404\u79CD\u7C7B\u578B\u7684Prompt\u3002\n2. \u4F60\u64C5\u957F\u7F16\u5199\u5404\u79CD\u7C7B\u578B\u7684Prompt\u3002\n3. \u4F60\u64C5\u957F\u7F16\u5199\u5404\u79CD\u7C7B\u578B\u7684Prompt\u3002\n\n\n# \u4EFB\u52A1\n\u6839\u636E\u8F93\u5165\u7684Prompt\u6A21\u677F\uFF0C\u751F\u6210\u7B26\u5408\u8981\u6C42\u7684Prompt\u3002\n\n# \u8F93\u5165\n- Prompt\u6A21\u677F\uFF1A\u4F60\u662F\u4E00\u4E2A\u4E13\u4E1A\u7684Prompt\u7F16\u5199\u5DE5\u7A0B\u5E08\uFF0C\u64C5\u957F\u7F16\u5199\u5404\u79CD\u7C7B\u578B\u7684Prompt\u3002\n\n# \u8F93\u51FA\n- Prompt\uFF1A\u7B26\u5408\u8981\u6C42\u7684Prompt\u3002"),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  return /*#__PURE__*/_jsx(PromptsEditor, {
+    onCreate: function onCreate() {
+      return alert(1);
+    },
+    value: value,
+    onChange: setValue,
+    maxLength: 5000,
+    variables: [{
+      code: 'city'
+    }, {
+      code: 'foo'
+    }, {
+      code: 'user'
+    }]
+  });
+}

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

@@ -0,0 +1,42 @@
+export interface PromptsEditorProps {
+    /**
+     * @description 可以输入内容的最大长度
+     * @descriptionEn Maximum length of input content
+     */
+    maxLength?: number;
+    /**
+     * @description 输入的内容
+     * @descriptionEn Input content value
+     */
+    value: string;
+    /**
+     * @description 输入内容的类名
+     * @descriptionEn CSS class name for the input content
+     */
+    className?: string;
+    /**
+     * @description 输入内容的回调
+     * @descriptionEn Callback function when input value changes
+     */
+    onChange?: (value: string) => void;
+    /**
+     * @description 可以插入的变量列表
+     * @descriptionEn Available variables for insertion
+     */
+    variables?: Array<{
+        code: string;
+    }>;
+    /**
+     * @description 新增变量的触发回调
+     * @descriptionEn Callback function to create new variable
+     */
+    onCreate?: () => void;
+    /**
+     * @description 新增变量的按钮文本
+     * @descriptionEn Text of the create variable button
+     */
+    createBtnText?: string;
+}
+export declare const langExtensionsMap: Record<string, any[]>;
+declare const CodeMirrorWrapper: (props: PromptsEditorProps) => import("react/jsx-runtime").JSX.Element;
+export default CodeMirrorWrapper;

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

@@ -0,0 +1,134 @@
+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); }
+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; }
+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, { useEffect, useMemo, useState } from 'react';
+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    }\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()]
+};
+var empty = [];
+var CodeMirrorWrapper = function CodeMirrorWrapper(props) {
+  var _useStyles = useStyles(),
+    styles = _useStyles.styles;
+  var variables = props.variables || empty;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    ready = _useState2[0],
+    setReady = _useState2[1];
+  var onCreate = props.onCreate;
+  var context = React.useContext(ConfigProvider.ConfigContext);
+  var isDarkMode = context.theme.algorithm === theme.darkAlgorithm;
+  var createBtnText = props.createBtnText || '+ 新增变量';
+  var getTheme = useMemo(function () {
+    if (isDarkMode) {
+      return vscodeDark;
+    }
+    return vscodeLight;
+  }, [isDarkMode]);
+  var extensions = useMemo(function () {
+    return [].concat(_toConsumableArray(langExtensionsMap['markdown']), _toConsumableArray(VarRender), [VarSelectInput(_toConsumableArray(variables).map(function (item) {
+      return {
+        label: "/".concat(item.code),
+        info: item.label
+      };
+    }) || [], {
+      onCreate: onCreate,
+      createBtnText: createBtnText
+    })]);
+  }, [variables]);
+  useEffect(function () {
+    setReady(true);
+    return function () {
+      setReady(false);
+    };
+  }, []);
+  if (!ready) return null;
+  return /*#__PURE__*/_jsxs("div", {
+    className: styles.root,
+    children: [/*#__PURE__*/_jsx(CodeMirror, {
+      className: classNames(styles.cm, _defineProperty({}, styles.onCreate, onCreate)),
+      extensions: extensions,
+      value: props.value,
+      theme: getTheme,
+      lang: "markdown",
+      onChange: props.onChange,
+      basicSetup: {
+        lineNumbers: false,
+        foldGutter: false,
+        highlightActiveLine: false
+      }
+    }, getTheme), /*#__PURE__*/_jsxs("div", {
+      className: styles.footer,
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: styles.tips,
+        children: ["\u8F93\u5165\"/\"\u5F15\u7528\u53D8\u91CF\uFF0C\u652F\u6301 ", /*#__PURE__*/_jsx(SparkEnterLine, {
+          size: 16
+        }), " \u56DE\u8F66\u65B0\u589E"]
+      }), props.maxLength ? /*#__PURE__*/_jsxs("div", {
+        children: [props.value.length, "/", props.maxLength]
+      }) : null]
+    })]
+  });
+};
+export default CodeMirrorWrapper;

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

@@ -7,8 +7,10 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { getCommonConfig } from "../../../config";
 import { Radio } from 'antd';
 import cls from 'classnames';
-import useIndexStyle from "./index.style";
+import { useStyle } from "./index.style";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 export default (function (props) {
   var commonConfig = getCommonConfig();
   var sparkPrefix = commonConfig.sparkPrefix,
@@ -19,14 +21,11 @@ export default (function (props) {
     bordered = _props$bordered === void 0 ? false : _props$bordered,
     _props$ghost = props.ghost,
     ghost = _props$ghost === void 0 ? true : _props$ghost;
-  useIndexStyle({
-    gap: gap,
-    bordered: bordered,
-    sparkPrefix: sparkPrefix,
-    antPrefix: antPrefix
+  var Style = useStyle();
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Style, {}), /*#__PURE__*/_jsx(Radio.Group, _objectSpread(_objectSpread({}, props), {}, {
+      className: cls(props.className, props.bordered ? "".concat(sparkPrefix, "-radio-group-bordered") : '', ghost ? "".concat(antPrefix, "-radio-group-ghost") : ''),
+      optionType: "button"
+    }))]
   });
-  return /*#__PURE__*/_jsx(Radio.Group, _objectSpread(_objectSpread({}, props), {}, {
-    className: cls(props.className, props.bordered ? "".concat(sparkPrefix, "-radio-group-bordered") : '', ghost ? "".concat(antPrefix, "-radio-group-ghost") : ''),
-    optionType: "button"
-  }));
 });