@farris/ui-vue 1.2.7 → 1.2.9

package/components/response-toolbar/index.esm.js

@@ -1,40 +1,40 @@
-var ke = Object.defineProperty;
-var Pe = (r, e, n) => e in r ? ke(r, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : r[e] = n;
-var F = (r, e, n) => Pe(r, typeof e != "symbol" ? e + "" : e, n);
-import { computed as z, getCurrentInstance as de, createVNode as w, ref as j, defineComponent as Y, onMounted as H, onUnmounted as ne, watch as Q, inject as $, createTextVNode as ue, provide as Re, onBeforeUnmount as Ee, withModifiers as je } from "vue";
-import { cloneDeep as Be } from "lodash-es";
-import { useDesignerInnerComponent as fe } from "@farris/ui-vue/components/designer-canvas/src/composition/function/use-designer-inner-component";
-import { withInstall as Ae } from "@farris/ui-vue/components/common";
+var Pe = Object.defineProperty;
+var Re = (s, e, o) => e in s ? Pe(s, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : s[e] = o;
+var B = (s, e, o) => Re(s, typeof e != "symbol" ? e + "" : e, o);
+import { computed as W, getCurrentInstance as ue, createVNode as w, ref as S, defineComponent as X, onMounted as z, onUnmounted as ne, watch as H, inject as L, createTextVNode as fe, provide as Ee, onBeforeUnmount as Se, withModifiers as Me } from "vue";
+import { cloneDeep as ke } from "lodash-es";
+import { getCustomClass as J, withInstall as Ae } from "../common/index.esm.js";
+import { useDesignerInnerComponent as ge } from "../designer-canvas/index.esm.js";
 class me {
   constructor(e) {
     /** 工具栏项标识 */
-    F(this, "id", "");
+    B(this, "id", "");
     /** 工具栏项自定义样式 */
-    F(this, "class", "btn-secondary");
+    B(this, "class", "btn-secondary");
     /** 图标 */
-    F(this, "icon", "");
+    B(this, "icon", "");
     /** 所属分组 */
-    F(this, "groupId", "");
+    B(this, "groupId", "");
     /** 收藏顺序 */
-    F(this, "order", -1);
+    B(this, "order", -1);
     /** 是否作为下拉菜单的顶层按钮 */
-    F(this, "asDropDownTop", !1);
+    B(this, "asDropDownTop", !1);
     /** 文本 */
-    F(this, "text", "");
+    B(this, "text", "");
     /** 是否可见 */
-    F(this, "visible", !0);
-    F(this, "responsed", !1);
+    B(this, "visible", !0);
+    B(this, "responsed", !1);
     /** 是否启用提示消息 */
-    F(this, "tipsEnable", !1);
+    B(this, "tipsEnable", !1);
     /** 提示消息内容 */
-    F(this, "tipsText", "");
+    B(this, "tipsText", "");
     /** 记录宽度 */
-    F(this, "width", 0);
-    F(this, "onClick", () => {
+    B(this, "width", 0);
+    B(this, "onClick", () => {
     });
-    F(this, "options");
+    B(this, "options");
     this.options = e;
-    const n = [
+    const o = [
       "id",
       "class",
       "icon",
@@ -50,13 +50,13 @@ class me {
       "tipsText",
       "onClick"
     ];
-    Object.keys(e).filter((c) => n.indexOf(c) > -1).forEach((c) => {
-      this[c] = e[c];
+    Object.keys(e).filter((p) => o.indexOf(p) > -1).forEach((p) => {
+      this[p] = e[p];
     });
   }
   /** 是否可用 */
   get enable() {
-    return Object.keys(this.options).indexOf("enable") > -1 ? this.options.enable : z(() => !0);
+    return Object.keys(this.options).indexOf("enable") > -1 ? this.options.enable : W(() => !0);
   }
   /** 设置宽度 */
   setWidth(e) {
@@ -67,49 +67,49 @@ class me {
     return this.visible ? this.width : !1;
   }
 }
-class Fe extends me {
+class Be extends me {
   constructor(e) {
     super(e);
   }
 }
-function ge() {
-  function r(e) {
-    const n = [];
-    return e.reduce((c, u) => (u.children && u.children.length > 0 ? c.push(new G(u)) : c.push(new Fe(u)), c), n), n;
+function he() {
+  function s(e) {
+    const o = [];
+    return e.reduce((p, u) => (u.children && u.children.length > 0 ? p.push(new G(u)) : p.push(new Be(u)), p), o), o;
   }
-  return { buildResponseToolbarItems: r };
+  return { buildResponseToolbarItems: s };
 }
-const { buildResponseToolbarItems: Oe } = ge();
+const { buildResponseToolbarItems: Oe } = he();
 class G extends me {
-  constructor(n) {
-    super(n);
-    F(this, "placement", "");
+  constructor(o) {
+    super(o);
+    B(this, "placement", "");
     // 下拉位置
     /** 下拉class */
-    F(this, "dropdownClass", "");
+    B(this, "dropdownClass", "");
     /** 下拉菜单class */
-    F(this, "menuClass", "");
+    B(this, "menuClass", "");
     /** 是否用分开的下拉按钮 */
-    F(this, "split", !1);
-    F(this, "children", []);
-    F(this, "expanded", !1);
-    const c = ["isDP", "class", "dropdownClass", "menuClass", "placement", "split", "expanded"];
-    Object.keys(n).filter((u) => c.indexOf(u) > -1).forEach((u) => {
-      this[u] = n[u];
-    }), n.children && n.children.length && (this.children = Oe(n.children));
+    B(this, "split", !1);
+    B(this, "children", []);
+    B(this, "expanded", !1);
+    const p = ["isDP", "class", "dropdownClass", "menuClass", "placement", "split", "expanded"];
+    Object.keys(o).filter((u) => p.indexOf(u) > -1).forEach((u) => {
+      this[u] = o[u];
+    }), o.children && o.children.length && (this.children = Oe(o.children));
   }
 }
-class Nt {
-  constructor(e, n) {
-    F(this, "id");
-    F(this, "name");
+class Lt {
+  constructor(e, o) {
+    B(this, "id");
+    B(this, "name");
     /** 记录元素的Id */
-    F(this, "presetId", []);
+    B(this, "presetId", []);
     /** 记录转变为下拉时元素的位置 */
-    F(this, "responsedIndex", []);
+    B(this, "responsedIndex", []);
     /** 记录宽度 */
-    F(this, "width");
-    this.id = e, this.name = n, this.width = 0;
+    B(this, "width");
+    this.id = e, this.name = o, this.width = 0;
   }
   // 设置宽度
   setWidth(e) {
@@ -144,104 +144,102 @@ class Nt {
     return this.presetId.length === this.responsedIndex.length;
   }
 }
-const oe = {}, ye = {};
-function re(r) {
-  const { properties: e, title: n } = r, c = Object.keys(e).reduce((u, m) => (u[m] = e[m].type === "object" && e[m].properties ? re(e[m]) : Be(e[m].default), u), {});
-  return c.id = `${n}-${Date.now()}`, c;
+const oe = {}, be = {};
+function se(s) {
+  const { properties: e, title: o, ignore: p } = s, u = p && Array.isArray(p), v = Object.keys(e).reduce((h, D) => ((!u || !p.find((I) => I == D)) && (h[D] = e[D].type === "object" && e[D].properties ? se(e[D]) : ke(e[D].default)), h), {});
+  return (!u || !p.find((h) => h == "id")) && (v.id = `${o}-${Date.now()}`), v;
 }
-function q(r, e = {}) {
-  const n = oe[r];
-  if (n) {
-    let c = re(n);
-    const u = ye[r];
-    return c = u ? u({ getSchemaByType: q }, c, e) : c, c;
+function q(s, e = {}, o) {
+  const p = oe[s];
+  if (p) {
+    let u = se(p);
+    const v = be[s];
+    return u = v ? v({ getSchemaByType: q }, u, e, o) : u, u;
   }
   return null;
 }
-function Le(r, e) {
-  const n = re(e);
-  return Object.keys(r).reduce((c, u) => (c[u] = r[u], c), n), n;
+function _e(s, e) {
+  const o = se(e);
+  return Object.keys(s).reduce((p, u) => (p[u] && typeof p[u] == "object" ? Object.assign(p[u], s[u]) : p[u] = s[u], p), o), o;
 }
-function Ne(r, e) {
-  return Object.keys(r).filter((c) => r[c] != null).reduce((c, u) => {
+function Ne(s, e) {
+  return Object.keys(s).filter((p) => s[p] != null).reduce((p, u) => {
     if (e.has(u)) {
-      const m = e.get(u);
-      if (typeof m == "string")
-        c[m] = r[u];
+      const v = e.get(u);
+      if (typeof v == "string")
+        p[v] = s[u];
       else {
-        const v = m(u, r[u], r);
-        Object.assign(c, v);
+        const h = v(u, s[u], s);
+        Object.assign(p, h);
       }
     } else
-      c[u] = r[u];
-    return c;
+      p[u] = s[u];
+    return p;
   }, {});
 }
-function Ve(r, e, n = /* @__PURE__ */ new Map()) {
-  const c = Le(r, e);
-  return Ne(c, n);
+function $e(s, e, o = /* @__PURE__ */ new Map()) {
+  const p = _e(s, e);
+  return Ne(p, o);
 }
-function _e(r = {}) {
-  function e(g, C, p, a) {
-    if (typeof p == "number")
-      return a[g].length === p;
-    if (typeof p == "object") {
-      const d = Object.keys(p)[0], s = p[d];
-      if (d === "not")
-        return Number(a[g].length) !== Number(s);
-      if (d === "moreThan")
-        return Number(a[g].length) >= Number(s);
-      if (d === "lessThan")
-        return Number(a[g].length) <= Number(s);
+function Fe(s = {}) {
+  function e(g, C, l, i) {
+    if (typeof l == "number")
+      return i[g].length === l;
+    if (typeof l == "object") {
+      const f = Object.keys(l)[0], c = l[f];
+      if (f === "not")
+        return Number(i[g].length) !== Number(c);
+      if (f === "moreThan")
+        return Number(i[g].length) >= Number(c);
+      if (f === "lessThan")
+        return Number(i[g].length) <= Number(c);
     }
     return !1;
   }
-  function n(g, C, p, a) {
-    return a[g] && a[g].propertyValue && String(a[g].propertyValue.value) === String(p);
+  function o(g, C, l, i) {
+    return i[g] && i[g].propertyValue && String(i[g].propertyValue.value) === String(l);
   }
-  const c = /* @__PURE__ */ new Map([
+  const p = /* @__PURE__ */ new Map([
     ["length", e],
-    ["getProperty", n]
+    ["getProperty", o]
   ]);
-  Object.keys(r).reduce((g, C) => (g.set(C, r[C]), g), c);
+  Object.keys(s).reduce((g, C) => (g.set(C, s[C]), g), p);
   function u(g, C) {
-    const p = g;
-    return typeof C == "number" ? [{ target: p, operator: "length", param: null, value: Number(C) }] : typeof C == "boolean" ? [{ target: p, operator: "getProperty", param: g, value: !!C }] : typeof C == "object" ? Object.keys(C).map((a) => {
-      if (a === "length")
-        return { target: p, operator: "length", param: null, value: C[a] };
-      const d = a, s = C[a];
-      return { target: p, operator: "getProperty", param: d, value: s };
+    const l = g;
+    return typeof C == "number" ? [{ target: l, operator: "length", param: null, value: Number(C) }] : typeof C == "boolean" ? [{ target: l, operator: "getProperty", param: g, value: !!C }] : typeof C == "object" ? Object.keys(C).map((i) => {
+      if (i === "length")
+        return { target: l, operator: "length", param: null, value: C[i] };
+      const f = i, c = C[i];
+      return { target: l, operator: "getProperty", param: f, value: c };
     }) : [];
   }
-  function m(g) {
-    return Object.keys(g).reduce((p, a) => {
-      const d = u(a, g[a]);
-      return p.push(...d), p;
+  function v(g) {
+    return Object.keys(g).reduce((l, i) => {
+      const f = u(i, g[i]);
+      return l.push(...f), l;
     }, []);
   }
-  function v(g, C) {
-    if (c.has(g.operator)) {
-      const p = c.get(g.operator);
-      return p && p(g.target, g.param, g.value, C) || !1;
+  function h(g, C) {
+    if (p.has(g.operator)) {
+      const l = p.get(g.operator);
+      return l && l(g.target, g.param, g.value, C) || !1;
     }
     return !1;
   }
-  function M(g, C) {
-    return m(g).reduce((d, s) => d && v(s, C), !0);
+  function D(g, C) {
+    return v(g).reduce((f, c) => f && h(c, C), !0);
   }
-  function S(g, C) {
-    const p = Object.keys(g), a = p.includes("allOf"), d = p.includes("anyOf"), s = a || d, x = (s ? g[s ? a ? "allOf" : "anyOf" : "allOf"] : [g]).map((P) => M(P, C));
-    return a ? !x.includes(!1) : x.includes(!0);
+  function I(g, C) {
+    const l = Object.keys(g), i = l.includes("allOf"), f = l.includes("anyOf"), c = i || f, T = (c ? g[c ? i ? "allOf" : "anyOf" : "allOf"] : [g]).map((P) => D(P, C));
+    return i ? !T.includes(!1) : T.includes(!0);
   }
-  return { parseValueSchema: S };
+  return { parseValueSchema: I };
 }
-const I = {
-  Button: { type: "Button", name: "按钮", icon: "Button" },
-  ButtonGroup: { type: "ButtonGroup", name: "按钮组", icon: "ButtonGroup" },
+const re = {
+  button: { type: "button", name: "按钮", icon: "Button" },
   "response-toolbar": { type: "response-toolbar", name: "工具栏", icon: "ButtonGroup" },
-  "response-toolbar-item": { type: "response-toolbar-item", name: "工具栏项", icon: "Button" },
+  "response-toolbar-item": { type: "response-toolbar-item", name: "按钮", icon: "Button" },
   "content-container": { type: "content-container", name: "容器", icon: "ContentContainer" },
-  DisplayField: { type: "DisplayField", name: "标签", icon: "DisplayField" },
   "input-group": { type: "input-group", name: "文本", icon: "TextBox" },
   textarea: { type: "textarea", name: "多行文本", icon: "MultiTextBox" },
   lookup: { type: "lookup", name: "帮助", icon: "LookupEdit" },
@@ -252,115 +250,53 @@ const I = {
   "check-box": { type: "check-box", name: "复选框", icon: "CheckBox" },
   "check-group": { type: "check-group", name: "复选框组", icon: "CheckGroup" },
   "combo-list": { type: "combo-list", name: "下拉列表", icon: "EnumField" },
-  /** 暂时没用 */
-  FlexLayout: { type: "FlexLayout", name: "弹性布局" },
-  /** 暂时没用 */
-  FlowLayout: { type: "FlowLayout", name: "流布局" },
-  ResponseLayout: { type: "ResponseLayout", name: "布局容器", icon: "ResponseLayout3" },
-  ResponseLayoutItem: { type: "ResponseLayoutItem", name: "布局", icon: "ResponseLayout1" },
+  "response-form": { type: "response-form", name: "卡片面板", icon: "Form" },
+  "response-layout": { type: "response-layout", name: "布局容器", icon: "ResponseLayout3" },
+  "response-layout-item": { type: "response-layout-item", name: "布局", icon: "ResponseLayout1" },
   "tree-grid": { type: "tree-grid", name: "树表格", icon: "TreeGrid" },
-  TreeGridField: { type: "TreeGridField", name: "树表格列" },
-  FieldSet: { type: "FieldSet", name: "分组", icon: "FieldSet" },
-  Form: { type: "Form", name: "卡片面板", icon: "Form" },
-  QueryForm: { type: "QueryForm", name: "查询面板", icon: "Form" },
+  "tree-grid-column": { type: "tree-grid-column", name: "树表格列" },
   "data-grid": { type: "data-grid", name: "表格", icon: "DataGrid" },
   "data-grid-column": { type: "data-grid-column", name: "表格列" },
-  Panel: { type: "Panel", name: "面板", icon: "ContentContainer" },
-  Module: { type: "Module", name: "模块", icon: "Module" },
+  module: { type: "Module", name: "模块", icon: "Module" },
   component: { type: "component", name: "组件", icon: "Component" },
-  ExternalContainer: { type: "ExternalContainer", name: "外部容器", icon: "ContentContainer" },
-  Image: { type: "Image", name: "图像", icon: "Image" },
-  ImageUpload: { type: "ImageUpload", name: "图片上传", icon: "imageupload" },
-  HiddenContainer: { type: "HiddenContainer", name: "隐藏区域", icon: "ContentContainer" },
-  ModalContainer: { type: "ModalContainer", name: "弹窗容器", icon: "ContentContainer" },
-  RouteContainer: { type: "RouteContainer", name: "路由区域", icon: "ContentContainer" },
   tabs: { type: "tabs", name: "标签页", icon: "Tab" },
   "tab-page": { type: "tab-page", name: "标签页项", dependentParentControl: "Tab" },
   "tab-toolbar-item": { type: "tab-toolbar-item", name: "标签页工具栏按钮", icon: "Button" },
-  Tag: { type: "Tag", name: "Tag", icon: "Tag" },
-  Sidebar: { type: "Sidebar", name: "侧边栏", icon: "Sidebar" },
-  HtmlTemplate: { type: "HtmlTemplate", name: "模版容器", icon: "HtmlTemplate" },
-  ListView: { type: "ListView", name: "列表", icon: "ListView" },
-  RichTextBox: { type: "RichTextBox", name: "富文本", icon: "RichTextBox" },
-  TimeSpinner: { type: "TimeSpinner", name: "时间调节器", icon: "TimePicker" },
-  TimePicker: { type: "TimePicker", name: "时间选择", icon: "TimePicker" },
+  "time-picker": { type: "time-picker", name: "时间选择", icon: "TimePicker" },
   section: { type: "section", name: "分组面板", icon: "Section" },
-  SectionToolbar: { type: "SectionToolbar", name: "分组面板工具栏" },
-  SectionToolbarItem: { type: "SectionToolbarItem", name: "分组面板按钮" },
-  QueryScheme: { type: "QueryScheme", name: "筛选方案", icon: "QueryScheme" },
-  FormHeader: { type: "FormHeader", name: "翻页" },
-  Splitter: { type: "Splitter", name: "分栏面板", icon: "Splitter" },
-  SplitterPane: { type: "SplitterPane", name: "分栏面板项", dependentParentControl: "Splitter" },
-  WizardDetail: { type: "WizardDetail", name: "向导详情页" },
-  WizardDetailContainer: { type: "WizardDetailContainer", name: "向导详情容器" },
-  Wizard: { type: "Wizard", name: "向导", icon: "Wizard" },
-  MultiSelect: { type: "MultiSelect", name: "数据分配", icon: "MultiSelect" },
-  Steps: { type: "Steps", name: "步骤条", icon: "Steps" },
-  avatar: { type: "avatar", name: "头像", icon: "Avatar" },
-  ListFilter: { type: "ListFilter", name: "筛选条", icon: "ListFilter" },
-  ListNav: { type: "ListNav", name: "列表导航", icon: "ListNav" },
-  NumberRange: { type: "NumberRange", name: "数字区间选择", icon: "NumericBox" },
-  Scrollspy: { type: "Scrollspy", name: "滚动监听", icon: "Scrollspy" },
-  LanguageTextBox: { type: "LanguageTextBox", name: "多语言输入框", icon: "LanguageTextBox" },
-  ComponentRef: { type: "ComponentRef", name: "组件引用节点" },
-  FileUpload: { type: "FileUpload", name: "附件上传", icon: "FileUpload" },
-  FilePreview: { type: "FilePreview", name: "附件预览", icon: "FilePreview" },
-  ViewChange: { type: "ViewChange", name: "多视图切换", icon: "Button" },
-  MultiViewContainer: { type: "MultiViewContainer", name: "多视图", icon: "MultiViewContainer" },
-  MultiViewItem: { type: "MultiViewItem", name: "多视图项", dependentParentControl: "MultiViewContainer" },
-  Footer: { type: "Footer", name: "页脚" },
-  DiscussionEditor: { type: "DiscussionEditor", name: "评论编辑区", icon: "DiscussionEditor" },
-  DiscussionList: { type: "DiscussionList", name: "评论列表", icon: "DiscussionList" },
-  NavTab: { type: "NavTab", name: "标签类导航", icon: "NavTab" },
-  Tags: { type: "Tags", name: "标记组", icon: "Tags" },
-  Portlet: { type: "Portlet", name: "小部件", icon: "dingzhi" },
+  "section-toolbar": { type: "section-toolbar", name: "分组面板工具栏" },
+  "section-toolbar-item": { type: "section-toolbar-item", name: "分组面板按钮" },
+  splitter: { type: "splitter", name: "分栏面板", icon: "Splitter" },
+  "splitter-pane": { type: "splitter-pane", name: "分栏面板项", dependentParentControl: "Splitter" },
+  "component-ref": { type: "component-ref", name: "组件引用节点" },
+  uploader: { type: "uploader", name: "附件上传", icon: "FileUpload" },
   "page-header": { type: "page-header", name: "页头", icon: "Header" },
-  ModalFooter: { type: "ModalFooter", name: "弹窗页脚", icon: "ModalFooter" },
-  ScrollCollapsibleArea: { type: "ScrollCollapsibleArea", name: "滚动收折区域", icon: "ScrollCollapsibleArea" },
-  PersonnelSelector: { type: "PersonnelSelector", name: "人员选择", icon: "PersonnelSelector" },
-  Table: { type: "Table", name: "表格", icon: "DataGrid" },
-  LoopContainer: { type: "LoopContainer", name: "循环容器", icon: "ContentContainer" },
-  FileUploadPreview: { type: "FileUploadPreview", name: "附件上传预览", icon: "FileUpload" },
-  DynamicArea: { type: "DynamicArea", name: "动态区域", icon: "ContentContainer" },
-  DynamicAreaItem: { type: "DynamicAreaItem", name: "动态区域项", icon: "ContentContainer" },
-  TabToolbar: { type: "TabToolbar", name: "标签页工具栏", icon: "TabToolbar" },
-  HeaderToolBar: { type: "HeaderToolBar", name: "头部组件工具栏", icon: "HeaderToolBar" },
-  ModalFooterToolBar: { type: "ModalFooterToolBar", name: "底部组件工具栏", icon: "ModalFooterToolBar" },
-  HeaderToolBarItem: { type: "HeaderToolBarItem", name: "头部组件工具栏按钮", icon: "HeaderToolBarItem" },
-  ModalFooterToolBarItem: { type: "ModalFooterToolBarItem", name: "底部组件工具栏按钮", icon: "ModalFooterToolBarItem" },
-  OrganizationSelector: { type: "OrganizationSelector", name: "组织选择", icon: "OrganizationSelector" },
-  AdminOrganizationSelector: { type: "AdminOrganizationSelector", name: "组织选择", icon: "OrganizationSelector" },
-  EmployeeSelector: { type: "EmployeeSelector", name: "人员选择", icon: "PersonnelSelector" },
-  OaRelation: { type: "OaRelation", name: "关联行政审批", icon: "TextBox" },
-  CitySelector: { type: "CitySelector", name: "城市选择", icon: "CitySelector" },
-  ExtIntergration: { type: "ExtIntergration", name: "外部服务集成", icon: "ViewModel" },
-  AppointmentCalendar: { type: "AppointmentCalendar", name: "预约日历", icon: "DateBox" },
-  /** 查询类 start */
-  Charts: { type: "Charts", name: "图表", icon: "Charts" },
-  QdpFramework: { type: "QdpFramework", name: "查询结果工具栏", icon: "QdpFramework" },
-  SpreadSheet: { type: "SpreadSheet", name: "查询表格控件", icon: "Charts" },
-  QdpConditionDialog: { type: "QdpConditionDialog", name: "查询筛选对话框", icon: "ContentContainer" },
-  QdpConditionDialogTab: { type: "QdpConditionDialogTab", name: "查询筛选标签页", icon: "Tab" },
-  /** 查询类 end */
-  /** 审批类 start */
-  ApprovalLogs: { type: "ApprovalLogs", name: "审批记录", icon: "ApprovalLogs" },
-  ApprovalComments: { type: "ApprovalComments", name: "审批意见", icon: "shenpiyijian" }
-  /** 审批类 end */
-}, he = {}, $e = {};
-_e();
-function be(r, e, n = /* @__PURE__ */ new Map(), c = (v, M, S) => M, u = {}, m = (v) => v) {
-  return oe[e.title] = e, ye[e.title] = c, he[e.title] = u, $e[e.title] = m, (v = {}) => {
-    const M = Ve(v, e, n), S = Object.keys(r).reduce((g, C) => (g[C] = r[C].default, g), {});
-    return Object.assign(S, M);
+  "page-footer": { type: "page-footer", name: "页脚", icon: "ModalFooter" },
+  "tab-toolbar": { type: "tab-toolbar", name: "标签页工具栏", icon: "TabToolbar" }
+}, ye = {}, Le = {};
+Fe();
+function ve(s, e, o = /* @__PURE__ */ new Map(), p = (h, D, I) => D, u = {}, v = (h) => h) {
+  return oe[e.title] = e, be[e.title] = p, ye[e.title] = u, Le[e.title] = v, (h = {}) => {
+    const D = $e(h, e, o), I = Object.keys(s).reduce((g, C) => (g[C] = s[C].default, g), {});
+    return Object.assign(I, D);
   };
 }
-const ve = /* @__PURE__ */ new Map([
-  ["buttons", "items"]
+function Ve(s, e) {
+  return { customClass: e.class, customStyle: e.style };
+}
+const We = /* @__PURE__ */ new Map([
+  ["buttons", "items"],
+  ["appearance", Ve]
+]), Ue = /* @__PURE__ */ new Map([
+  ["appearance", qe]
 ]);
-function Ce(r, e, n) {
+function qe(s, e) {
+  return { class: e.class, style: e.style };
+}
+function Ce(s, e, o) {
   return e;
 }
-const We = "https://json-schema.org/draft/2020-12/schema", ze = "https://farris-design.gitee.io/response-toolbar.schema.json", Ue = "response-toolbar", qe = "A Farris Toolbar Component", He = "object", Ge = {
+const ze = "https://json-schema.org/draft/2020-12/schema", Ge = "https://farris-design.gitee.io/response-toolbar.schema.json", He = "response-toolbar", Je = "A Farris Toolbar Component", Qe = "object", Xe = {
   id: {
     description: "The unique identifier for a Response Toolbar",
     type: "string"
@@ -393,19 +329,19 @@ const We = "https://json-schema.org/draft/2020-12/schema", ze = "https://farris-
     type: "array",
     default: []
   }
-}, Qe = [
+}, Ye = [
   "id",
   "type",
   "buttons"
-], Xe = {
-  $schema: We,
-  $id: ze,
-  title: Ue,
-  description: qe,
-  type: He,
-  properties: Ge,
-  required: Qe
-}, Ye = "https://json-schema.org/draft/2020-12/schema", Ze = "https://farris-design.gitee.io/response-toolbar-item.schema.json", Ke = "response-toolbar-item", Je = "A Farris Toolbar Item Component", et = "object", tt = {
+], Ze = {
+  $schema: ze,
+  $id: Ge,
+  title: He,
+  description: Je,
+  type: Qe,
+  properties: Xe,
+  required: Ye
+}, Ke = "https://json-schema.org/draft/2020-12/schema", et = "https://farris-design.gitee.io/response-toolbar-item.schema.json", tt = "response-toolbar-item", nt = "A Farris Toolbar Item Component", ot = "object", st = {
   id: {
     description: "The unique identifier for a Response Toolbar",
     type: "string"
@@ -420,7 +356,8 @@ const We = "https://json-schema.org/draft/2020-12/schema", ze = "https://farris-
     type: "object",
     properties: {
       class: {
-        type: "string"
+        type: "string",
+        default: "btn-primary"
       },
       style: {
         type: "string"
@@ -428,6 +365,11 @@ const We = "https://json-schema.org/draft/2020-12/schema", ze = "https://farris-
     },
     default: {}
   },
+  alignment: {
+    description: "The alignment of Response Toolbar Button.",
+    type: "string",
+    default: "right"
+  },
   text: {
     description: "The items of Response Toolbar.",
     type: "string",
@@ -443,19 +385,19 @@ const We = "https://json-schema.org/draft/2020-12/schema", ze = "https://farris-
     type: "string",
     default: ""
   }
-}, nt = [
+}, rt = [
   "id",
   "type",
   "text"
 ], te = {
-  $schema: Ye,
-  $id: Ze,
-  title: Ke,
-  description: Je,
-  type: et,
-  properties: tt,
-  required: nt
-}, ot = "response-toolbar-item", rt = "A Farris Container Component", st = "object", it = {
+  $schema: Ke,
+  $id: et,
+  title: tt,
+  description: nt,
+  type: ot,
+  properties: st,
+  required: rt
+}, it = "response-toolbar-item", ct = "A Farris Container Component", at = "object", lt = {
   basic: {
     title: "基本信息",
     description: "Basic Infomation",
@@ -488,12 +430,12 @@ const We = "https://json-schema.org/draft/2020-12/schema", ze = "https://farris-
       }
     }
   }
-}, le = {
-  title: ot,
-  description: rt,
-  type: st,
-  categories: it
-}, se = {
+}, pe = {
+  title: it,
+  description: ct,
+  type: at,
+  categories: lt
+}, ie = {
   /**  组件自定义样式 */
   customClass: { type: String, default: "" },
   alignment: { Type: String, default: "right" },
@@ -503,489 +445,484 @@ const We = "https://json-schema.org/draft/2020-12/schema", ze = "https://farris-
   }
 };
 oe[te.title] = te;
-he[le.title] = le;
-const at = Object.assign({}, se, {
+ye[pe.title] = pe;
+const pt = Object.assign({}, ie, {
   componentId: { type: String, default: "" }
-}), ie = be(
-  se,
-  Xe,
-  ve,
+}), ce = ve(
+  ie,
+  Ze,
+  We,
   Ce
 ), we = {
   id: { type: String, default: "" },
   items: { type: Object, default: {} },
+  class: { type: String, default: "" },
   text: { type: String, default: "" },
   disabled: { type: Boolean, default: !1 },
   icon: { type: String, default: "" },
-  componentId: { type: String, default: "" }
-}, ct = be(
+  componentId: { type: String, default: "" },
+  alignment: { Type: String, default: "right" }
+}, dt = ve(
   we,
   te,
-  ve,
+  Ue,
   Ce
 );
-function Te() {
-  function r(n) {
-    const c = {
+function xe() {
+  function s(o) {
+    const p = {
       "f-icon": !0
     };
-    if (n.icon) {
-      const u = n.icon.trim().split(" ");
-      u && u.length && u.reduce((m, v) => (m[v] = !0, m), c);
+    if (o.icon) {
+      const u = o.icon.trim().split(" ");
+      u && u.length && u.reduce((v, h) => (v[h] = !0, v), p);
     }
-    return c;
+    return p;
   }
-  function e(n) {
-    return !!(n.icon && n.icon.trim());
+  function e(o) {
+    return !!(o.icon && o.icon.trim());
   }
-  return { iconClass: r, shouldShowIcon: e };
+  return { iconClass: s, shouldShowIcon: e };
 }
-function lt(r) {
-  function e(p) {
-    const a = {
+function ut(s) {
+  function e(l) {
+    const i = {
       "dropdown-menu": !0
     };
-    if (p.class) {
-      const d = p.menuClass.split(" ");
-      d && d.length && d.reduce((s, y) => (s[y] = !0, s), a);
+    if (l.class) {
+      const f = l.menuClass.split(" ");
+      f && f.length && f.reduce((c, b) => (c[b] = !0, c), i);
     }
-    return a;
+    return i;
   }
-  function n(p) {
-    const a = {
-      disabled: !p.enable,
+  function o(l) {
+    const i = {
+      disabled: !l.enable,
       "dropdown-submenu": !0,
       "f-rt-dropdown": !0
-    }, d = p.dropdownClass.split(" ");
-    return d && d.length && d.reduce((s, y) => (s[y] = !0, s), a), a;
+    }, f = l.dropdownClass.split(" ");
+    return f && f.length && f.reduce((c, b) => (c[b] = !0, c), i), i;
   }
-  function c(p) {
-    const a = {
-      disabled: !p.enable,
+  function p(l) {
+    const i = {
+      disabled: !l.enable,
       "dropdown-item": !0,
       "f-rt-btn": !0
-    }, d = p.class.split(" ");
-    return d && d.length && d.reduce((s, y) => (s[y] = !0, s), a), a;
+    }, f = l.class.split(" ");
+    return f && f.length && f.reduce((c, b) => (c[b] = !0, c), i), i;
   }
   let u;
-  const m = /* @__PURE__ */ new Map();
-  function v(p, a, d) {
-    var y;
-    ((y = p.target) == null ? void 0 : y.id) === a.id && p.stopPropagation();
-    const s = d ? d.id : "__top_item__";
-    if (a.children && a.children.length && (a.expanded = !a.expanded, a.expanded ? m.set(s, a) : m.delete(s)), m.has(s) && m.get(s) !== a) {
-      const h = m.get(s);
-      h && (h.expanded = !1);
+  const v = /* @__PURE__ */ new Map();
+  function h(l, i, f) {
+    var b;
+    ((b = l.target) == null ? void 0 : b.id) === i.id && l.stopPropagation();
+    const c = f ? f.id : "__top_item__";
+    if (i.children && i.children.length && (i.expanded = !i.expanded, i.expanded ? v.set(c, i) : v.delete(c)), v.has(c) && v.get(c) !== i) {
+      const y = v.get(c);
+      y && (y.expanded = !1);
     }
   }
-  function M(p, a) {
-    document.body.click(), a.enable && a.onClick(p, a.id);
+  function D(l, i) {
+    document.body.click(), i.enable && i.onClick(l, i.id);
   }
-  function S(p) {
-    return p.children.map((a) => a.children && a.children.length ? w("li", {
-      class: n(a),
-      id: a.id,
-      onClick: (d) => a.enable && v(d, a, p)
+  function I(l) {
+    return l.children.map((i) => i.children && i.children.length ? w("li", {
+      class: o(i),
+      id: i.id,
+      onClick: (f) => i.enable && h(f, i, l)
     }, [w("span", {
-      id: a.id,
-      class: c(a),
-      onMouseover: (d) => a.enable && v(d, a, p)
-    }, [a.text, w("i", {
+      id: i.id,
+      class: p(i),
+      onMouseover: (f) => i.enable && h(f, i, l)
+    }, [i.text, w("i", {
       class: "f-icon f-icon-arrow-chevron-right",
       style: "display: inline-block;float: right;line-height: 1.25rem;"
-    }, null)]), u(a, a)]) : w("li", {
-      class: c(a),
-      id: a.id,
-      onClick: (d) => M(d, a),
-      onMouseover: (d) => a.enable && v(d, a, p)
-    }, [r.shouldShowIcon(a) && w("i", {
-      class: r.iconClass(a)
-    }, null), a.text]));
-  }
-  function g(p, a, d) {
-    const s = {
-      display: p.expanded ? "block" : "none",
+    }, null)]), u(i, i)]) : w("li", {
+      class: p(i),
+      id: i.id,
+      onClick: (f) => D(f, i),
+      onMouseover: (f) => i.enable && h(f, i, l)
+    }, [s.shouldShowIcon(i) && w("i", {
+      class: s.iconClass(i)
+    }, null), i.text]));
+  }
+  function g(l, i, f) {
+    const c = {
+      display: l.expanded ? "block" : "none",
       position: "fixed",
       maxWidth: "300px",
       width: "auto",
       minWidth: "120px"
-    }, y = document.getElementsByTagName("body")[0].getClientRects()[0].width, h = a, x = h == null ? void 0 : h.getClientRects();
-    if (h && x && x.length) {
+    }, b = document.getElementsByTagName("body")[0].getClientRects()[0].width, y = i, T = y == null ? void 0 : y.getClientRects();
+    if (y && T && T.length) {
       const {
         top: O,
         width: P,
-        left: A,
+        left: k,
         right: N,
-        height: D
-      } = x[0], b = Math.ceil(D + O);
-      s.top = `${b}px`, s.left = `${A}px`;
-      const k = p.id + "_menu", E = a ? a.querySelector("#" + k) : null;
-      if (E) {
-        s.display === "block" && (E.style.display = "block");
-        const l = E.getBoundingClientRect();
-        if (d) {
-          s.top = `${O - 6}px`;
-          const o = Math.ceil(P + A);
-          s.left = `${o}px`;
+        height: j
+      } = T[0], m = Math.ceil(j + O);
+      c.top = `${m}px`, c.left = `${k}px`;
+      const R = l.id + "_menu", A = i ? i.querySelector("#" + R) : null;
+      if (A) {
+        c.display === "block" && (A.style.display = "block");
+        const a = A.getBoundingClientRect();
+        if (f) {
+          c.top = `${O - 6}px`;
+          const n = Math.ceil(P + k);
+          c.left = `${n}px`;
         }
-        y - A - P < l.width && (s.left = `${(d ? A : N) - l.width}px`);
+        b - k - P < a.width && (c.left = `${(f ? k : N) - a.width}px`);
       }
     }
-    return s;
+    return c;
   }
-  u = function(p, a) {
-    var h, x;
-    const d = de(), s = a ? a.id : p.id, y = (x = (h = d == null ? void 0 : d.exposed) == null ? void 0 : h.elementRef.value) == null ? void 0 : x.querySelector("#" + s);
+  u = function(l, i) {
+    var y, T;
+    const f = ue(), c = i ? i.id : l.id, b = (T = (y = f == null ? void 0 : f.exposed) == null ? void 0 : y.elementRef.value) == null ? void 0 : T.querySelector("#" + c);
     return w("ul", {
-      class: e(p),
-      style: g(p, y, a),
-      id: p.id + "_menu"
-    }, [S(p)]);
+      class: e(l),
+      style: g(l, b, i),
+      id: l.id + "_menu"
+    }, [I(l)]);
   };
   function C() {
-    m.forEach((p) => {
-      p.expanded = !1;
-    }), m.clear();
+    v.forEach((l) => {
+      l.expanded = !1;
+    }), v.clear();
   }
   return {
     renderDropdownMenu: u,
     clearAllDropDownMenu: C
   };
 }
-function pt(r, e) {
-  const n = j(r.alignment), {
-    renderDropdownMenu: c,
+function ft(s, e) {
+  const o = S(s.alignment), {
+    renderDropdownMenu: p,
     clearAllDropDownMenu: u
-  } = lt(e);
-  function m(C) {
-    const p = {
+  } = ut(e);
+  function v(C) {
+    const l = {
       "btn-group": !0,
       "f-rt-dropdown": !0,
-      "f-btn-ml": n.value === "right",
-      "f-btn-mr": n.value === "left"
-    }, a = C.dropdownClass.split(" ");
-    return a && a.length && a.reduce((d, s) => (d[s] = !0, d), p), p;
+      "f-btn-ml": o.value === "right",
+      "f-btn-mr": o.value === "left"
+    }, i = C.dropdownClass.split(" ");
+    return i && i.length && i.reduce((f, c) => (f[c] = !0, f), l), l;
   }
-  function v(C) {
-    const p = {
+  function h(C) {
+    const l = {
       btn: !0,
       disabled: !C.enable,
       "f-rt-btn": !0,
       "btn-icontext": !!(C.icon && C.icon.trim())
     };
     if (C.class) {
-      const a = C.class.split(" ");
-      a && a.length && a.reduce((d, s) => (d[s] = !0, d), p);
+      const i = C.class.split(" ");
+      i && i.length && i.reduce((f, c) => (f[c] = !0, f), l);
     }
-    return p;
+    return l;
   }
-  function M(C, p) {
+  function D(C, l) {
     C.stopPropagation();
-    const a = p.expanded;
-    document.body.click(), p.expanded = !a;
+    const i = l.expanded;
+    document.body.click(), l.expanded = !i;
   }
-  function S(C) {
+  function I(C) {
     return w("div", {
       id: C.id,
-      class: m(C)
+      class: v(C)
     }, [w("div", {
-      class: v(C),
+      class: h(C),
       style: "display: flex;padding-right: 0.1rem;border-top-right-radius: 6px;border-bottom-right-radius: 6px",
-      onClick: (p) => C.enable && M(p, C)
+      onClick: (l) => C.enable && D(l, C)
     }, [e.shouldShowIcon(C) && w("i", {
       class: e.iconClass(C)
     }, null), w("span", null, [C.text]), w("i", {
       class: "f-icon f-icon-arrow-chevron-down",
       style: "display: inline-block;float: right;line-height: 1.25rem;margin-left: .25rem;margin-right: .25rem;"
-    }, null)]), c(C)]);
+    }, null)]), p(C)]);
   }
   function g() {
     u();
   }
   return {
-    renderToolbarDropdown: S,
+    renderToolbarDropdown: I,
     clearAllDropDown: g
   };
 }
 const {
-  buildResponseToolbarItems: pe
-} = ge(), X = /* @__PURE__ */ Y({
+  buildResponseToolbarItems: de
+} = he(), Q = /* @__PURE__ */ X({
   name: "FResponseToolbar",
-  props: se,
+  props: ie,
   emits: ["click"],
-  setup(r, e) {
-    const n = j(pe(r.items)), c = j(), u = j(), m = j(), v = j(r.alignment), M = {
+  setup(s, e) {
+    const o = S(de(s.items)), p = S(), u = S(), v = S(), h = S(s.alignment), D = {
       id: "__more_buttons__",
       text: "更多"
-    }, S = j(new G(M)), g = Te(), C = z(() => S.value.children.length > 0), p = z(() => {
-      const b = {
-        "f-toolbar": !0,
-        "f-response-toolbar": !0,
-        "position-relative": !0
-      };
-      if (r.customClass) {
-        const k = r.customClass.split(" ");
-        k && k.length && k.reduce((E, l) => (E[l] = !0, E), b);
-      }
-      return b;
-    }), a = z(() => ({
+    }, I = S(new G(D)), g = xe(), C = W(() => I.value.children.length > 0), l = W(() => J({
+      "f-toolbar": !0,
+      "f-response-toolbar": !0,
+      "position-relative": !0
+    }, s.customClass)), i = W(() => ({
       "d-flex": !0,
       "flex-nowrap": !0,
-      "justify-content-end": v.value === "right",
-      "justify-content-start": v.value === "left"
+      "justify-content-end": h.value === "right",
+      "justify-content-start": h.value === "left"
     })), {
-      renderToolbarDropdown: d,
-      clearAllDropDown: s
-    } = pt(r, g);
-    function y() {
-      n.value.filter((b) => b.children && b.children.length > 0).forEach((b) => {
-        b.expanded = !1;
-      }), S.value.expanded = !1, s();
+      renderToolbarDropdown: f,
+      clearAllDropDown: c
+    } = ft(s, g);
+    function b() {
+      o.value.filter((m) => m.children && m.children.length > 0).forEach((m) => {
+        m.expanded = !1;
+      }), I.value.expanded = !1, c();
     }
-    function h(b) {
-      const k = {
+    function y(m) {
+      const R = {
         btn: !0,
         "f-rt-btn": !0,
-        "f-btn-ml": v.value === "right",
-        "f-btn-mr": v.value === "left",
-        "btn-icontext": !!(b.icon && b.icon.trim())
+        "f-btn-ml": h.value === "right",
+        "f-btn-mr": h.value === "left",
+        "btn-icontext": !!(m.icon && m.icon.trim())
       };
-      if (b.class) {
-        const E = b.class.split(" ");
-        E && E.length && E.reduce((l, o) => (l[o] = !0, l), k);
+      if (m.class) {
+        const A = m.class.split(" ");
+        A && A.length && A.reduce((a, n) => (a[n] = !0, a), R);
       }
-      return k;
+      return R;
     }
-    function x(b, k) {
-      document.body.click(), k.onClick(b, k.id), e.emit("click", b, k.id);
+    function T(m, R) {
+      document.body.click(), R.onClick(m, R.id), e.emit("click", m, R.id);
     }
-    function O(b) {
+    function O(m) {
       return w("button", {
         type: "button",
-        class: h(b),
-        id: b.id,
-        disabled: !b.enable,
-        onClick: (k) => x(k, b)
-      }, [g.shouldShowIcon(b) && w("i", {
-        class: g.iconClass(b)
-      }, null), b.text]);
+        class: y(m),
+        id: m.id,
+        disabled: !m.enable,
+        onClick: (R) => T(R, m)
+      }, [g.shouldShowIcon(m) && w("i", {
+        class: g.iconClass(m)
+      }, null), m.text]);
     }
-    const P = /* @__PURE__ */ new Map(), A = [];
-    function N(b) {
-      const k = m.value;
-      let E = b;
-      const l = Array.from(k.children), o = l[l.length - 1].id === "__more_buttons__" ? l[l.length - 1] : null;
-      if (o) {
-        const T = o.computedStyleMap().get("margin-left"), B = o.computedStyleMap().get("margin-right"), _ = (T ? T.value : 0) + o.getBoundingClientRect().width + (B ? B.value : 0);
-        E -= _;
+    const P = /* @__PURE__ */ new Map(), k = [];
+    function N(m) {
+      const R = v.value;
+      let A = m;
+      const a = Array.from(R.children), n = a[a.length - 1].id === "__more_buttons__" ? a[a.length - 1] : null;
+      if (n) {
+        const x = n.computedStyleMap().get("margin-left"), M = n.computedStyleMap().get("margin-right"), F = (x ? x.value : 0) + n.getBoundingClientRect().width + (M ? M.value : 0);
+        A -= F;
       }
-      const t = l.filter((T) => T.id !== "__more_buttons__");
-      for (const T of t) {
-        const B = T.computedStyleMap().get("margin-left"), _ = T.computedStyleMap().get("margin-right"), L = (B ? B.value : 0) + T.getBoundingClientRect().width + (_ ? _.value : 0);
-        E < L ? (P.set(T.id, !0), A.push({
-          id: T.id,
-          width: L
-        })) : E -= L;
+      const t = a.filter((x) => x.id !== "__more_buttons__");
+      for (const x of t) {
+        const M = x.computedStyleMap().get("margin-left"), F = x.computedStyleMap().get("margin-right"), _ = (M ? M.value : 0) + x.getBoundingClientRect().width + (F ? F.value : 0);
+        A < _ ? (P.set(x.id, !0), k.push({
+          id: x.id,
+          width: _
+        })) : A -= _;
       }
-      if (A.length)
-        for (let T = A.length - 1; T >= 0; T--) {
-          const B = A[T].width;
-          if (E >= B)
-            E -= B, P.delete(A[T].id), A.pop();
+      if (k.length)
+        for (let x = k.length - 1; x >= 0; x--) {
+          const M = k[x].width;
+          if (A >= M)
+            A -= M, P.delete(k[x].id), k.pop();
           else
             break;
         }
-      const i = Object.assign({}, S.value);
-      i.children = [];
-      const f = new G(i), R = n.value.reduce((T, B) => (P.has(B.id) && f.children.push(B), B.visible = !P.has(B.id), T.push(B), T), []);
-      S.value = f, n.value = R;
+      const r = Object.assign({}, I.value);
+      r.children = [];
+      const d = new G(r), E = o.value.reduce((x, M) => (P.has(M.id) && d.children.push(M), M.visible = !P.has(M.id), x.push(M), x), []);
+      I.value = d, o.value = E;
     }
-    const D = new ResizeObserver((b) => {
-      if (b.length) {
-        const E = b[0].contentRect.width, o = m.value.getBoundingClientRect().width;
-        (E < o || A.length) && (N(E), y());
+    const j = new ResizeObserver((m) => {
+      if (m.length) {
+        const A = m[0].contentRect.width, n = v.value.getBoundingClientRect().width;
+        (A < n || k.length) && (N(A), b());
       }
     });
-    return H(() => {
-      const b = u.value;
-      D.observe(b), document.body.addEventListener("click", y), document.body.addEventListener("wheel", y);
+    return z(() => {
+      const m = u.value;
+      j.observe(m), document.body.addEventListener("click", b), document.body.addEventListener("wheel", b);
     }), ne(() => {
-      D.disconnect(), document.body.removeEventListener("click", y), document.body.removeEventListener("wheel", y);
-    }), Q(() => r.items, () => {
-      n.value = pe(r.items);
+      j.disconnect(), document.body.removeEventListener("click", b), document.body.removeEventListener("wheel", b);
+    }), H(() => s.items, () => {
+      o.value = de(s.items);
     }, {
       deep: !0
     }), e.expose({
-      elementRef: c
+      elementRef: p
     }), () => w("div", {
-      class: p.value,
-      ref: c
+      class: l.value,
+      ref: p
     }, [w("div", {
       ref: u,
-      class: a.value
+      class: i.value
     }, [w("div", {
-      ref: m,
+      ref: v,
       class: "d-inline-block f-response-content",
       style: "white-space: nowrap;"
-    }, [n.value.filter((b) => b.visible).map((b) => b.children && b.children.length > 0 ? d(b) : O(b)), C.value && d(S.value)])])]);
+    }, [o.value.filter((m) => m.visible).map((m) => m.children && m.children.length > 0 ? f(m) : O(m)), C.value && f(I.value)])])]);
   }
 });
-function dt(r, e) {
-  const n = $("design-item-context"), c = $("toolbar-item-handler", () => {
+function gt(s, e) {
+  const o = L("design-item-context"), p = L("toolbar-item-handler", () => {
   });
   function u() {
-    c && c();
+    p && p();
   }
-  function m(o) {
+  function v(n) {
     const t = {
       "dropdown-menu": !0
     };
-    if (o.class) {
-      const i = o.menuClass.split(" ");
-      i && i.length && i.reduce((f, R) => (f[R] = !0, f), t);
+    if (n.class) {
+      const r = n.menuClass.split(" ");
+      r && r.length && r.reduce((d, E) => (d[E] = !0, d), t);
     }
     return t;
   }
-  function v(o) {
+  function h(n) {
     const t = {
-      disabled: !o.enable,
+      disabled: !n.enable,
       "dropdown-submenu": !0,
       "f-rt-dropdown": !0
-    }, i = o.dropdownClass.split(" ");
-    return i && i.length && i.reduce((f, R) => (f[R] = !0, f), t), t;
+    }, r = n.dropdownClass.split(" ");
+    return r && r.length && r.reduce((d, E) => (d[E] = !0, d), t), t;
   }
-  function M(o) {
+  function D(n) {
     const t = {
-      disabled: !o.enable,
+      disabled: !n.enable,
       "dropdown-item": !0,
       "f-rt-btn": !0,
       "position-relative": !0,
       "farris-component": !0
-    }, i = o.class.split(" ");
-    return i && i.length && i.reduce((f, R) => (f[R] = !0, f), t), t;
+    }, r = n.class.split(" ");
+    return r && r.length && r.reduce((d, E) => (d[E] = !0, d), t), t;
   }
-  let S;
+  let I;
   const g = /* @__PURE__ */ new Map();
-  function C(o, t, i) {
-    var R;
-    ((R = o.target) == null ? void 0 : R.id) === t.id && o.stopPropagation();
-    const f = i ? i.id : "__top_item__";
-    if (t.children && t.children.length && (t.expanded = !t.expanded, t.expanded ? g.set(f, t) : g.delete(f)), g.has(f) && g.get(f) !== t) {
-      const T = g.get(f);
-      T && (T.expanded = !1);
+  function C(n, t, r) {
+    var E;
+    ((E = n.target) == null ? void 0 : E.id) === t.id && n.stopPropagation();
+    const d = r ? r.id : "__top_item__";
+    if (t.children && t.children.length && (t.expanded = !t.expanded, t.expanded ? g.set(d, t) : g.delete(d)), g.has(d) && g.get(d) !== t) {
+      const x = g.get(d);
+      x && (x.expanded = !1);
     }
   }
-  function p(o) {
-    o && (o.stopPropagation(), o.preventDefault());
+  function l(n) {
+    n && (n.stopPropagation(), n.preventDefault());
   }
-  function a() {
+  function i() {
     Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((t) => t.classList.remove("dgComponentFocused"));
-    const o = document.getElementsByClassName("dgComponentSelected");
-    Array.from(o).forEach((t) => t.classList.remove("dgComponentSelected"));
+    const n = document.getElementsByClassName("dgComponentSelected");
+    Array.from(n).forEach((t) => t.classList.remove("dgComponentSelected"));
   }
-  function d(o) {
-    o.currentTarget.classList.add("dgComponentFocused", "dgComponentSelected");
+  function f(n) {
+    n.currentTarget.classList.add("dgComponentFocused", "dgComponentSelected");
   }
-  function s(o) {
+  function c(n) {
     const {
       buttons: t = []
-    } = n.schema;
-    let i = [];
-    t.forEach((T) => {
-      i = i.concat(T.children || []);
+    } = o.schema;
+    let r = [];
+    t.forEach((x) => {
+      r = r.concat(x.children || []);
     });
-    const f = i.findIndex((T) => T.id === o), R = f === -1 ? null : i[f];
+    const d = r.findIndex((x) => x.id === n), E = d === -1 ? null : r[d];
     return {
-      index: f,
-      item: R
+      index: d,
+      item: E
     };
   }
-  function y(o) {
+  function b(n) {
     const {
       buttons: t = []
-    } = n.schema, i = t.findIndex((R) => R.id === o), f = i === -1 ? null : t[i];
+    } = o.schema, r = t.findIndex((E) => E.id === n), d = r === -1 ? null : t[r];
     return {
-      index: i,
-      item: f
+      index: r,
+      item: d
     };
   }
-  function h(o) {
-    var f;
-    n.schema;
+  function y(n) {
+    var d;
+    o.schema;
     const {
       index: t,
-      item: i
-    } = s(o);
-    (f = n == null ? void 0 : n.setupContext) == null || f.emit("selectionChange", i == null ? void 0 : i.type, i);
+      item: r
+    } = c(n);
+    (d = o == null ? void 0 : o.setupContext) == null || d.emit("selectionChange", r == null ? void 0 : r.type, r);
   }
-  const x = function(o) {
+  const T = function(n) {
     const {
       componentType: t
-    } = o, i = q(t, o), f = t.toLowerCase().replace("-", "_");
-    return i && !i.id && i.type === t && (i.id = `${f}_${Math.random().toString().slice(2, 6)}`), i;
+    } = n, r = q(t, n), d = t.toLowerCase().replace("-", "_");
+    return r && !r.id && r.type === t && (r.id = `${d}_${Math.random().toString().slice(2, 6)}`), r;
   }, O = function() {
-    const o = {
+    const n = {
       componentType: "response-toolbar-item",
       parentComponentInstance: e.value,
       targetPosition: -1
     };
-    return x(o);
+    return T(n);
   };
-  function P(o, t) {
-    p(o), a(), d(o), h(t.id);
-  }
-  function A(o, t, i) {
-    p(o);
-    const f = t.id, R = i && i.id, {
-      buttons: T = []
-    } = n.schema;
-    if (!R)
+  function P(n, t) {
+    l(n), i(), f(n), y(t.id);
+  }
+  function k(n, t, r) {
+    l(n);
+    const d = t.id, E = r && r.id, {
+      buttons: x = []
+    } = o.schema;
+    if (!E)
       return;
     const {
-      index: B
-    } = y(R);
-    if (B === -1)
+      index: M
+    } = b(E);
+    if (M === -1)
       return;
     const {
-      index: _
-    } = s(f);
-    _ !== -1 && (T[B].children.splice(_, 1), u());
-  }
-  function N(o, t, i) {
-    p(o);
-    const f = i && i.id, {
-      buttons: R = []
-    } = n.schema;
-    if (!f)
+      index: F
+    } = c(d);
+    F !== -1 && (x[M].children.splice(F, 1), u());
+  }
+  function N(n, t, r) {
+    l(n);
+    const d = r && r.id, {
+      buttons: E = []
+    } = o.schema;
+    if (!d)
       return;
     const {
-      index: T
-    } = y(f);
-    if (T === -1)
+      index: x
+    } = b(d);
+    if (x === -1)
       return;
-    const B = O(), _ = Object.assign({}, B, {
+    const M = O(), F = Object.assign({}, M, {
       text: t.text
     });
-    R[T].children.push(_), u();
-  }
-  function D(o, t, i) {
-    p(o);
-    const f = i && i.id, {
-      buttons: R = []
-    } = n.schema;
-    if (!f)
+    E[x].children.push(F), u();
+  }
+  function j(n, t, r) {
+    l(n);
+    const d = r && r.id, {
+      buttons: E = []
+    } = o.schema;
+    if (!d)
       return;
     const {
-      index: T
-    } = y(f);
-    if (T === -1)
+      index: x
+    } = b(d);
+    if (x === -1)
       return;
-    const B = O(), _ = Object.assign({}, B, {
+    const M = O(), F = Object.assign({}, M, {
       text: "按钮"
     });
-    R[T].children.push(_), u();
+    E[x].children.push(F), u();
   }
-  function b(o, t) {
+  function m(n, t) {
     return w("div", {
       class: "component-btn-group"
     }, [w("div", null, [w("div", {
@@ -994,7 +931,7 @@ function dt(r, e) {
       title: "删除",
       ref: "removeButton",
       style: "position:static;",
-      onClick: (i) => A(i, o, t)
+      onClick: (r) => k(r, n, t)
     }, [w("i", {
       class: "f-icon f-icon-yxs_delete"
     }, null)]), w("div", {
@@ -1003,7 +940,7 @@ function dt(r, e) {
       title: "复制",
       ref: "copyButton",
       style: "position:static;",
-      onClick: (i) => N(i, o, t)
+      onClick: (r) => N(r, n, t)
     }, [w("i", {
       class: "f-icon f-icon-yxs_copy"
     }, null)]), w("div", {
@@ -1012,174 +949,174 @@ function dt(r, e) {
       title: "新增同级",
       ref: "appendSame",
       style: "width:85px!important;padding:0 5px;position:static;",
-      onClick: (i) => D(i, o, t)
+      onClick: (r) => j(r, n, t)
     }, [w("i", {
       class: "f-icon f-icon-plus-circle text-white mr-1"
     }, null), w("span", {
       style: "font-size:13px;margin:auto"
-    }, [ue("新增同级")])])])]);
+    }, [fe("新增同级")])])])]);
   }
-  function k(o) {
-    return o.children.map((t) => t.children && t.children.length ? w("li", {
-      class: v(t),
+  function R(n) {
+    return n.children.map((t) => t.children && t.children.length ? w("li", {
+      class: h(t),
       id: t.id,
-      onClick: (i) => t.enable && C(i, t, o)
+      onClick: (r) => t.enable && C(r, t, n)
     }, [w("span", {
       id: t.id,
-      class: M(t),
-      onMouseover: (i) => t.enable && C(i, t, o)
+      class: D(t),
+      onMouseover: (r) => t.enable && C(r, t, n)
     }, [t.text, w("i", {
       class: "f-icon f-icon-arrow-chevron-right",
       style: "display: inline-block;float: right;line-height: 1.25rem;"
-    }, null)]), S(t, t)]) : w("li", {
-      class: M(t),
+    }, null)]), I(t, t)]) : w("li", {
+      class: D(t),
       id: t.id,
-      onClick: (i) => P(i, t)
-    }, [b(t, o), r.shouldShowIcon(t) && w("i", {
-      class: r.iconClass(t)
+      onClick: (r) => P(r, t)
+    }, [m(t, n), s.shouldShowIcon(t) && w("i", {
+      class: s.iconClass(t)
     }, null), t.text]));
   }
-  function E(o, t, i) {
-    const f = {
-      display: o.expanded ? "block" : "none",
+  function A(n, t, r) {
+    const d = {
+      display: n.expanded ? "block" : "none",
       position: "fixed",
       maxWidth: "300px",
       width: "auto",
       minWidth: "120px"
-    }, R = document.getElementsByTagName("body")[0].getClientRects()[0].width, T = t, B = T == null ? void 0 : T.getClientRects();
-    if (T && B && B.length) {
+    }, E = document.getElementsByTagName("body")[0].getClientRects()[0].width, x = t, M = x == null ? void 0 : x.getClientRects();
+    if (x && M && M.length) {
       const {
-        top: _,
-        width: L,
-        left: V,
-        right: W,
+        top: F,
+        width: _,
+        left: $,
+        right: V,
         height: U
-      } = B[0], Z = Math.ceil(U + _);
-      f.top = `${Z}px`, f.left = `${V}px`;
-      const Ie = o.id + "_menu", K = t ? t.querySelector("#" + Ie) : null;
-      if (K) {
-        f.display === "block" && (K.style.display = "block");
-        const ce = K.getBoundingClientRect();
-        if (i) {
-          f.top = `${_ - 6}px`;
-          const Me = Math.ceil(L + V);
-          f.left = `${Me}px`;
+      } = M[0], Y = Math.ceil(U + F);
+      d.top = `${Y}px`, d.left = `${$}px`;
+      const Ie = n.id + "_menu", Z = t ? t.querySelector("#" + Ie) : null;
+      if (Z) {
+        d.display === "block" && (Z.style.display = "block");
+        const le = Z.getBoundingClientRect();
+        if (r) {
+          d.top = `${F - 6}px`;
+          const De = Math.ceil(_ + $);
+          d.left = `${De}px`;
         }
-        R - V - L < ce.width && (f.left = `${(i ? V : W) - ce.width}px`);
+        E - $ - _ < le.width && (d.left = `${(r ? $ : V) - le.width}px`);
       }
     }
-    return f;
+    return d;
   }
-  S = function(o, t) {
-    var T, B;
-    const i = de(), f = t ? t.id : o.id, R = (B = (T = i == null ? void 0 : i.exposed) == null ? void 0 : T.elementRef.value) == null ? void 0 : B.querySelector("#" + f);
+  I = function(n, t) {
+    var x, M;
+    const r = ue(), d = t ? t.id : n.id, E = (M = (x = r == null ? void 0 : r.exposed) == null ? void 0 : x.elementRef.value) == null ? void 0 : M.querySelector("#" + d);
     return w("ul", {
-      class: m(o),
-      style: E(o, R, t),
-      id: o.id + "_menu"
-    }, [k(o)]);
+      class: v(n),
+      style: A(n, E, t),
+      id: n.id + "_menu"
+    }, [R(n)]);
   };
-  function l() {
-    g.forEach((o) => {
-      o.expanded = !1;
+  function a() {
+    g.forEach((n) => {
+      n.expanded = !1;
     }), g.clear();
   }
   return {
-    renderDropdownMenu: S,
-    clearAllDropDownMenu: l
+    renderDropdownMenu: I,
+    clearAllDropDownMenu: a
   };
 }
-function ut(r, e, n) {
-  const c = j(r.alignment), {
+function mt(s, e, o) {
+  const p = S(s.alignment), {
     renderDropdownMenu: u,
-    clearAllDropDownMenu: m
-  } = dt(e, n), v = $("design-item-context"), M = $("toolbar-item-handler", () => {
+    clearAllDropDownMenu: v
+  } = gt(e, o), h = L("design-item-context"), D = L("toolbar-item-handler", () => {
   });
-  function S() {
-    M && M();
+  function I() {
+    D && D();
   }
-  function g(l) {
-    const o = {
+  function g(a) {
+    const n = {
       "btn-group": !0,
       "f-rt-dropdown": !0,
-      "f-btn-ml": c.value === "right",
-      "f-btn-mr": c.value === "left"
-    }, t = l.dropdownClass.split(" ");
-    return t && t.length && t.reduce((i, f) => (i[f] = !0, i), o), o;
+      "f-btn-ml": p.value === "right",
+      "f-btn-mr": p.value === "left"
+    }, t = a.dropdownClass.split(" ");
+    return t && t.length && t.reduce((r, d) => (r[d] = !0, r), n), n;
   }
-  function C(l) {
-    const o = {
+  function C(a) {
+    const n = {
       btn: !0,
-      disabled: !l.enable,
+      disabled: !a.enable,
       "position-relative": !0,
       "farris-component": !0,
       "f-rt-btn": !0,
-      "btn-icontext": !!(l.icon && l.icon.trim())
+      "btn-icontext": !!(a.icon && a.icon.trim())
     };
-    if (l.class) {
-      const t = l.class.split(" ");
-      t && t.length && t.reduce((i, f) => (i[f] = !0, i), o);
+    if (a.class) {
+      const t = a.class.split(" ");
+      t && t.length && t.reduce((r, d) => (r[d] = !0, r), n);
     }
-    return o;
+    return n;
   }
-  function p(l) {
-    l && (l.stopPropagation(), l.preventDefault());
+  function l(a) {
+    a && (a.stopPropagation(), a.preventDefault());
   }
-  function a(l, o) {
-    p(l);
-    const t = o.expanded;
-    document.body.click(), o.expanded = !t;
+  function i(a, n) {
+    l(a);
+    const t = n.expanded;
+    document.body.click(), n.expanded = !t;
   }
-  const d = function(l) {
+  const f = function(a) {
     const {
-      componentType: o
-    } = l, t = q(o, l), i = o.toLowerCase().replace("-", "_");
-    return t && !t.id && t.type === o && (t.id = `${i}_${Math.random().toString().slice(2, 6)}`), t;
-  }, s = function() {
-    const l = {
+      componentType: n
+    } = a, t = q(n, a), r = n.toLowerCase().replace("-", "_");
+    return t && !t.id && t.type === n && (t.id = `${r}_${Math.random().toString().slice(2, 6)}`), t;
+  }, c = function() {
+    const a = {
       componentType: "response-toolbar-item",
-      parentComponentInstance: n.value,
+      parentComponentInstance: o.value,
       targetPosition: -1
     };
-    return d(l);
+    return f(a);
   };
-  function y(l) {
-    const o = v.schema.buttons || v.schema.contents, t = o == null ? void 0 : o.findIndex((f) => f.id === l), i = t === -1 ? null : o[t];
+  function b(a) {
+    const n = h.schema.buttons || h.schema.contents, t = n == null ? void 0 : n.findIndex((d) => d.id === a), r = t === -1 ? null : n[t];
     return {
       index: t,
-      toolbarItem: i
+      toolbarItem: r
     };
   }
-  function h(l, o) {
-    var B;
+  function y(a, n) {
+    var M;
     const {
       index: t,
-      toolbarItem: i
-    } = y(o);
+      toolbarItem: r
+    } = b(n);
     if (t === -1)
       return;
-    const f = i.text || "按钮", R = s(), T = Object.assign({}, R, {
-      text: f
+    const d = r.text || "按钮", E = c(), x = Object.assign({}, E, {
+      text: d
     });
-    (B = v.schema.buttons) == null || B.push(T), S();
+    (M = h.schema.buttons) == null || M.push(x), I();
   }
-  function x(l, o) {
+  function T(a, n) {
     const {
       index: t,
-      toolbarItem: i
-    } = y(o);
+      toolbarItem: r
+    } = b(n);
     if (t === -1)
       return;
-    const f = i.text || "按钮", R = s(), T = Object.assign({}, R, {
-      text: f
-    }), B = v.schema.buttons[t].children || [];
-    B.push(T), v.schema.buttons[t].children = B, S();
+    const d = r.text || "按钮", E = c(), x = Object.assign({}, E, {
+      text: d
+    }), M = h.schema.buttons[t].children || [];
+    M.push(x), h.schema.buttons[t].children = M, I();
   }
-  function O(l, o) {
-    const t = v.schema.buttons || v.schema.contents, i = t == null ? void 0 : t.findIndex((f) => f.id === o);
-    i !== -1 && (t.splice(i, 1), S());
+  function O(a, n) {
+    const t = h.schema.buttons || h.schema.contents, r = t == null ? void 0 : t.findIndex((d) => d.id === n);
+    r !== -1 && (t.splice(r, 1), I());
   }
-  function P(l) {
+  function P(a) {
     return w("div", {
       class: "component-btn-group"
     }, [w("div", null, [w("div", {
@@ -1188,7 +1125,7 @@ function ut(r, e, n) {
       title: "删除",
       ref: "removeButton",
       style: "position:static;",
-      onClick: (o) => O(o, l)
+      onClick: (n) => O(n, a)
     }, [w("i", {
       class: "f-icon f-icon-yxs_delete"
     }, null)]), w("div", {
@@ -1197,7 +1134,7 @@ function ut(r, e, n) {
       title: "复制",
       ref: "copyButton",
       style: "position:static;",
-      onClick: (o) => h(o, l)
+      onClick: (n) => y(n, a)
     }, [w("i", {
       class: "f-icon f-icon-yxs_copy"
     }, null)]), w("div", {
@@ -1206,76 +1143,76 @@ function ut(r, e, n) {
       title: "新增子级",
       ref: "appendChildButton",
       style: "width:85px!important;padding:0 5px;position:static;",
-      onClick: (o) => x(o, l)
+      onClick: (n) => T(n, a)
     }, [w("i", {
       class: "f-icon f-icon-plus-circle text-white mr-1"
     }, null), w("span", {
       style: "font-size:13px;margin:auto"
-    }, [ue("新增子级")])])])]);
+    }, [fe("新增子级")])])])]);
   }
-  function A() {
-    Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((o) => o.classList.remove("dgComponentFocused"));
-    const l = document.getElementsByClassName("dgComponentSelected");
-    Array.from(l).forEach((o) => o.classList.remove("dgComponentSelected"));
+  function k() {
+    Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((n) => n.classList.remove("dgComponentFocused"));
+    const a = document.getElementsByClassName("dgComponentSelected");
+    Array.from(a).forEach((n) => n.classList.remove("dgComponentSelected"));
   }
-  function N(l) {
-    l.currentTarget.classList.add("dgComponentFocused", "dgComponentSelected");
+  function N(a) {
+    a.currentTarget.classList.add("dgComponentFocused", "dgComponentSelected");
   }
-  function D(l) {
-    var f;
-    const o = v.schema.buttons || v.schema.contents, t = o == null ? void 0 : o.findIndex((R) => R.id === l);
+  function j(a) {
+    var d;
+    const n = h.schema.buttons || h.schema.contents, t = n == null ? void 0 : n.findIndex((E) => E.id === a);
     if (t === -1)
       return;
-    const i = o[t];
-    (f = v == null ? void 0 : v.setupContext) == null || f.emit("selectionChange", "response-toolbar-item", i);
+    const r = n[t];
+    (d = h == null ? void 0 : h.setupContext) == null || d.emit("selectionChange", "response-toolbar-item", r);
   }
-  function b(l, o) {
-    p(l), A(), N(l), p(l), a(l, o), D(o.id);
+  function m(a, n) {
+    l(a), k(), N(a), l(a), i(a, n), j(n.id);
   }
-  function k(l) {
+  function R(a) {
     return w("div", {
-      id: l.id,
-      class: g(l)
+      id: a.id,
+      class: g(a)
     }, [w("div", {
-      class: C(l),
+      class: C(a),
       style: "display: flex;padding-right: 0.1rem;",
-      onClick: (o) => l.enable && b(o, l)
-    }, [P(l.id), e.shouldShowIcon(l) && w("i", {
-      class: e.iconClass(l)
-    }, null), w("span", null, [l.text]), w("i", {
+      onClick: (n) => a.enable && m(n, a)
+    }, [P(a.id), e.shouldShowIcon(a) && w("i", {
+      class: e.iconClass(a)
+    }, null), w("span", null, [a.text]), w("i", {
       class: "f-icon f-icon-arrow-chevron-down",
       style: "display: inline-block;float: right;line-height: 1.25rem;margin-left: .25rem;margin-right: .25rem;"
-    }, null)]), u(l)]);
+    }, null)]), u(a)]);
   }
-  function E() {
-    m();
+  function A() {
+    v();
   }
   return {
-    renderToolbarDropdown: k,
-    clearAllDropDown: E
+    renderToolbarDropdown: R,
+    clearAllDropDown: A
   };
 }
-function ft() {
-  function r(e) {
-    var u, m;
+function ht() {
+  function s(e) {
+    var u, v;
     if (!e)
       return !1;
-    const n = ((u = e.targetContainer) == null ? void 0 : u.componentInstance) && e.targetContainer.componentInstance.value;
-    if (!n)
+    const o = ((u = e.targetContainer) == null ? void 0 : u.componentInstance) && e.targetContainer.componentInstance.value;
+    if (!o)
       return !1;
-    const c = (m = n.schema.appearance) == null ? void 0 : m.class;
+    const p = (v = o.schema.appearance) == null ? void 0 : v.class;
     if (e.controlCategory === "input" || e.controlType === "form-group") {
-      const v = n.schema.type, M = (v === "response-form" || v === "content-container") && c && c.includes("farris-form");
-      if (n.schema.type !== "response-layout-item" && !M)
+      const h = o.schema.type, D = (h === "response-form" || h === "content-container") && p && p.includes("farris-form");
+      if (o.schema.type !== "response-layout-item" && !D)
         return !1;
     }
     return e.controlType !== "field-set";
   }
   return {
-    basalDragulaRuleForContainer: r
+    basalDragulaRuleForContainer: s
   };
 }
-const mt = "https://json-schema.org/draft/2020-12/schema", gt = "https://farris-design.gitee.io/dragging-rules.schema.json", yt = "Dragging Rules", ht = "The rules of designer canvas", bt = "object", vt = {
+const bt = "https://json-schema.org/draft/2020-12/schema", yt = "https://farris-design.gitee.io/dragging-rules.schema.json", vt = "Dragging Rules", Ct = "The rules of designer canvas", wt = "object", xt = {
   "f-page": {
     description: "The root class of page designed by farris.",
     type: "object",
@@ -1694,6 +1631,80 @@ const mt = "https://json-schema.org/draft/2020-12/schema", gt = "https://farris-
                                   "f-list-nav-left": {
                                     description: "",
                                     type: "object"
+                                  },
+                                  "f-struct-data-grid-in-nav": {
+                                    description: "",
+                                    type: "object",
+                                    properties: {
+                                      contents: {
+                                        type: "object",
+                                        properties: {
+                                          "f-section-form": {
+                                            description: "",
+                                            type: "object",
+                                            properties: {
+                                              rules: {
+                                                type: "object",
+                                                properties: {
+                                                  canAccept: {
+                                                    type: "boolean",
+                                                    const: !1
+                                                  },
+                                                  fixed: {
+                                                    type: "boolean",
+                                                    const: !0
+                                                  },
+                                                  hidePadding: {
+                                                    type: "boolean",
+                                                    const: !0
+                                                  }
+                                                }
+                                              }
+                                            }
+                                          },
+                                          "f-section-grid": {
+                                            description: "",
+                                            type: "object",
+                                            properties: {
+                                              rules: {
+                                                type: "object",
+                                                properties: {
+                                                  canAccept: {
+                                                    type: "boolean",
+                                                    const: !1
+                                                  },
+                                                  fixed: {
+                                                    type: "boolean",
+                                                    const: !0
+                                                  },
+                                                  hidePadding: {
+                                                    type: "boolean",
+                                                    const: !0
+                                                  }
+                                                }
+                                              }
+                                            }
+                                          }
+                                        }
+                                      },
+                                      rules: {
+                                        type: "object",
+                                        properties: {
+                                          canAccept: {
+                                            type: "boolean",
+                                            const: !1
+                                          },
+                                          fixed: {
+                                            type: "boolean",
+                                            const: !0
+                                          },
+                                          hidePadding: {
+                                            type: "boolean",
+                                            const: !0
+                                          }
+                                        }
+                                      }
+                                    }
                                   }
                                 }
                               }
@@ -1839,209 +1850,142 @@ const mt = "https://json-schema.org/draft/2020-12/schema", gt = "https://farris-
     description: "",
     type: "object"
   }
-}, Ct = [], wt = {
-  $schema: mt,
-  $id: gt,
-  title: yt,
-  description: ht,
-  type: bt,
-  properties: vt,
-  required: Ct
-}, J = /* @__PURE__ */ new Map();
-function xe() {
-  function r(s, y, h, x) {
+}, Tt = {
+  $schema: bt,
+  $id: yt,
+  title: vt,
+  description: Ct,
+  type: wt,
+  properties: xt
+}, K = /* @__PURE__ */ new Map();
+function Te() {
+  function s(c, b, y, T) {
     var O;
-    if (typeof h == "number")
-      return ((O = x[s]) == null ? void 0 : O.length) === h;
-    if (typeof h == "object") {
-      const P = Object.keys(h)[0], A = h[P];
+    if (typeof y == "number")
+      return ((O = T[c]) == null ? void 0 : O.length) === y;
+    if (typeof y == "object") {
+      const P = Object.keys(y)[0], k = y[P];
       if (P === "not")
-        return Number(x[s].length) !== Number(A);
+        return Number(T[c].length) !== Number(k);
       if (P === "moreThan")
-        return Number(x[s].length) >= Number(A);
+        return Number(T[c].length) >= Number(k);
       if (P === "lessThan")
-        return Number(x[s].length) <= Number(A);
+        return Number(T[c].length) <= Number(k);
     }
     return !1;
   }
-  function e(s, y, h, x) {
-    return typeof h == "boolean" ? x.childrenClassList.includes(y) === !!h : !1;
+  function e(c, b, y, T) {
+    return typeof y == "boolean" ? T.childrenClassList.includes(b) === !!y : !1;
   }
-  function n(s, y, h, x) {
-    return typeof h == "boolean" ? x.parentClassList.includes(y) === !!h : !1;
+  function o(c, b, y, T) {
+    return typeof y == "boolean" ? T.parentClassList.includes(b) === !!y : !1;
   }
-  function c(s, y, h, x) {
-    return typeof h == "boolean" ? x.parentClassList.includes(y) === !!h : !1;
+  function p(c, b, y, T) {
+    return typeof y == "boolean" ? T.parentClassList.includes(b) === !!y : !1;
   }
   const u = /* @__PURE__ */ new Map([
-    ["length", r],
+    ["length", s],
     ["hasChildren", e],
-    ["hasSibling", c],
-    ["hasParent", n]
+    ["hasSibling", p],
+    ["hasParent", o]
   ]);
-  function m(s, y) {
-    const h = s;
-    return typeof y == "number" ? [{ target: h, operator: "length", param: null, value: Number(y) }] : typeof y == "object" ? Object.keys(y).map((x) => {
-      if (x === "length")
-        return { target: h, operator: "length", param: null, value: y[x] };
-      const O = x, P = y[x];
-      return { target: h, operator: s === "children" ? "hasChildren" : s === "parent" ? "hasParent" : "hasSibling", param: O, value: P };
+  function v(c, b) {
+    const y = c;
+    return typeof b == "number" ? [{ target: y, operator: "length", param: null, value: Number(b) }] : typeof b == "object" ? Object.keys(b).map((T) => {
+      if (T === "length")
+        return { target: y, operator: "length", param: null, value: b[T] };
+      const O = T, P = b[T];
+      return { target: y, operator: c === "children" ? "hasChildren" : c === "parent" ? "hasParent" : "hasSibling", param: O, value: P };
     }) : [];
   }
-  function v(s, y) {
-    if (u.has(s.operator)) {
-      const h = u.get(s.operator);
-      return h && h(s.target, s.param, s.value, y) || !1;
+  function h(c, b) {
+    if (u.has(c.operator)) {
+      const y = u.get(c.operator);
+      return y && y(c.target, c.param, c.value, b) || !1;
     }
     return !1;
   }
-  function M(s, y) {
-    return Object.keys(s).reduce((P, A) => {
-      const N = m(A, s[A]);
+  function D(c, b) {
+    return Object.keys(c).reduce((P, k) => {
+      const N = v(k, c[k]);
       return P.push(...N), P;
-    }, []).reduce((P, A) => P && v(A, y), !0);
-  }
-  function S(s, y) {
-    const h = Object.keys(s), x = h.includes("allOf"), O = h.includes("anyOf"), P = x || O, D = (P ? s[P ? x ? "allOf" : "anyOf" : "allOf"] : [s]).map((k) => M(k, y));
-    return x ? !D.includes(!1) : D.includes(!0);
-  }
-  function g(s, y) {
-    const h = s.const;
-    return h ? typeof h == "boolean" ? h : typeof h == "object" ? S(h, y) : !1 : !1;
-  }
-  function C(s) {
-    return (y) => {
-      const h = { canAccept: !0, fixed: !1, hidePadding: !1 };
-      return s && s.properties && Object.keys(s.properties).reduce((x, O) => {
-        const P = s.properties[O];
-        return x[O] = g(P, y), x;
-      }, h), h;
+    }, []).reduce((P, k) => P && h(k, b), !0);
+  }
+  function I(c, b) {
+    const y = Object.keys(c), T = y.includes("allOf"), O = y.includes("anyOf"), P = T || O, j = (P ? c[P ? T ? "allOf" : "anyOf" : "allOf"] : [c]).map((R) => D(R, b));
+    return T ? !j.includes(!1) : j.includes(!0);
+  }
+  function g(c, b) {
+    const y = c.const;
+    return y ? typeof y == "boolean" ? y : typeof y == "object" ? I(y, b) : !1 : !1;
+  }
+  function C(c) {
+    return (b) => {
+      const y = { canAccept: !0, fixed: !1, hidePadding: !1 };
+      return c && c.properties && Object.keys(c.properties).reduce((T, O) => {
+        const P = c.properties[O];
+        return T[O] = g(P, b), T;
+      }, y), y;
     };
   }
-  function p(s, y, h) {
-    if (y.type === "object" && y.properties) {
-      const { rules: x, contents: O } = y.properties;
-      h.set(s, C(x)), O && Object.keys(O.properties).forEach(
-        (P) => p(P, O.properties[P], h)
+  function l(c, b, y) {
+    if (b.type === "object" && b.properties) {
+      const { rules: T, contents: O } = b.properties;
+      y.set(c, C(T)), O && Object.keys(O.properties).forEach(
+        (P) => l(P, O.properties[P], y)
       );
     }
   }
-  function a() {
-    const { properties: s } = wt;
-    Object.keys(s).forEach((y) => {
-      p(y, s[y], J);
+  function i() {
+    const { properties: c } = Tt;
+    Object.keys(c).forEach((b) => {
+      l(b, c[b], K);
     });
   }
-  function d(s, y) {
-    const h = { canAccept: !0, fixed: !1, hidePadding: !0 };
-    return J.has(s) ? J.get(s)(y) : h;
-  }
-  return a(), { getRuleValue: d };
-}
-class Se {
-  static getEditorTypesByMDataType(e) {
-    const n = this.fieldControlTypeMapping[e];
-    return n || [{ key: "", value: "" }];
+  function f(c, b) {
+    const y = { canAccept: !0, fixed: !1, hidePadding: !0 };
+    return K.has(c) ? K.get(c)(b) : y;
   }
+  return i(), { getRuleValue: f };
 }
-/**
- * <字段类型,可配置的控件类型列表>的映射
- */
-F(Se, "fieldControlTypeMapping", {
-  String: [
-    { key: I["input-group"].type, value: I["input-group"].name },
-    { key: I.lookup.type, value: I.lookup.name },
-    { key: I.Image.type, value: I.Image.name },
-    { key: I["date-picker"].type, value: I["date-picker"].name },
-    { key: I["check-box"].type, value: I["check-box"].name },
-    { key: I["radio-group"].type, value: I["radio-group"].name },
-    { key: I["combo-list"].type, value: I["combo-list"].name },
-    { key: I.textarea.type, value: I.textarea.name }
-    // { key: DgControl.Tags.type, value: DgControl.Tags.name },
-  ],
-  Text: [
-    { key: I.textarea.type, value: I.textarea.name },
-    { key: I.avatar.type, value: I.avatar.name },
-    { key: I.lookup.type, value: I.lookup.name }
-  ],
-  Decimal: [
-    { key: I["number-spinner"].type, value: I["number-spinner"].name }
-  ],
-  Integer: [
-    { key: I["number-spinner"].type, value: I["number-spinner"].name }
-  ],
-  Number: [
-    { key: I["number-spinner"].type, value: I["number-spinner"].name }
-  ],
-  BigNumber: [
-    { key: I["number-spinner"].type, value: I["number-spinner"].name }
-  ],
-  Date: [
-    { key: I["date-picker"].type, value: I["date-picker"].name }
-  ],
-  DateTime: [
-    { key: I["date-picker"].type, value: I["date-picker"].name }
-  ],
-  Boolean: [
-    { key: I.switch.type, value: I.switch.name },
-    { key: I["check-box"].type, value: I["check-box"].name }
-  ],
-  Enum: [
-    { key: I["combo-list"].type, value: I["combo-list"].name },
-    { key: I["radio-group"].type, value: I["radio-group"].name }
-  ],
-  Object: [
-    { key: I.lookup.type, value: I.lookup.name },
-    { key: I["combo-list"].type, value: I["combo-list"].name },
-    { key: I["radio-group"].type, value: I["radio-group"].name }
-  ],
-  EmployeeSelector: [
-    { key: I.EmployeeSelector.type, value: I.EmployeeSelector.name }
-  ],
-  AdminOrganizationSelector: [
-    { key: I.AdminOrganizationSelector.type, value: I.AdminOrganizationSelector.name }
-  ]
-});
 class ae {
-  constructor(e, n) {
-    F(this, "componentId");
-    F(this, "viewModelId");
-    F(this, "eventsEditorUtils");
-    F(this, "formSchemaUtils");
-    F(this, "formMetadataConverter");
-    F(this, "designViewModelUtils");
-    F(this, "designViewModelField");
-    F(this, "controlCreatorUtils");
-    F(this, "designerHostService");
-    F(this, "schemaService", null);
-    F(this, "metadataService", null);
-    F(this, "propertyConfig", {
+  constructor(e, o) {
+    B(this, "componentId");
+    B(this, "viewModelId");
+    B(this, "eventsEditorUtils");
+    B(this, "formSchemaUtils");
+    B(this, "formMetadataConverter");
+    B(this, "designViewModelUtils");
+    B(this, "designViewModelField");
+    B(this, "controlCreatorUtils");
+    B(this, "designerHostService");
+    B(this, "schemaService", null);
+    B(this, "metadataService", null);
+    B(this, "propertyConfig", {
       type: "object",
       categories: {}
     });
-    var c;
-    this.componentId = e, this.designerHostService = n, this.eventsEditorUtils = n.eventsEditorUtils, this.formSchemaUtils = n.formSchemaUtils, this.formMetadataConverter = n.formMetadataConverter, this.viewModelId = ((c = this.formSchemaUtils) == null ? void 0 : c.getViewModelIdByComponentId(e)) || "", this.designViewModelUtils = n.designViewModelUtils, this.controlCreatorUtils = n.controlCreatorUtils, this.metadataService = n.metadataService, this.schemaService = n.schemaService;
+    var p;
+    this.componentId = e, this.designerHostService = o, this.eventsEditorUtils = o.eventsEditorUtils, this.formSchemaUtils = o.formSchemaUtils, this.formMetadataConverter = o.formMetadataConverter, this.viewModelId = ((p = this.formSchemaUtils) == null ? void 0 : p.getViewModelIdByComponentId(e)) || "", this.designViewModelUtils = o.designViewModelUtils, this.controlCreatorUtils = o.controlCreatorUtils, this.metadataService = o.metadataService, this.schemaService = o.schemaService;
   }
   getTableInfo() {
     var e;
     return (e = this.schemaService) == null ? void 0 : e.getTableInfoByViewModelId(this.viewModelId);
   }
   setDesignViewModelField(e) {
-    const n = e.binding && e.binding.type === "Form" && e.binding.field;
-    if (n) {
+    const o = e.binding && e.binding.type === "Form" && e.binding.field;
+    if (o) {
       if (!this.designViewModelField) {
-        const c = this.designViewModelUtils.getDgViewModel(this.viewModelId);
-        this.designViewModelField = c.fields.find((u) => u.id === n);
+        const p = this.designViewModelUtils.getDgViewModel(this.viewModelId);
+        this.designViewModelField = p.fields.find((u) => u.id === o);
       }
       e.updateOn = this.designViewModelField.updateOn;
     }
   }
-  changeFieldEditorType(e, n) {
+  changeFieldEditorType(e, o) {
   }
   getBasicPropConfig(e) {
-    var c, u;
-    var n = this;
-    return this.setDesignViewModelField(e), {
+    return {
       description: "Basic Information",
       title: "基本信息",
       properties: {
@@ -2054,69 +1998,17 @@ class ae {
         type: {
           description: "组件类型",
           title: "控件类型",
-          type: "string",
-          refreshPanelAfterChanged: !0,
-          $converter: "/converter/change-editor.converter",
+          type: "select",
           editor: {
             type: "combo-list",
-            textField: "value",
-            valueField: "key",
-            data: Se.getEditorTypesByMDataType(((u = (c = n.designViewModelField) == null ? void 0 : c.type) == null ? void 0 : u.name) || ""),
-            editable: !1
+            textField: "name",
+            valueField: "value",
+            data: [{ value: e.type, name: re[e.type].name }]
           }
-        },
-        label: {
-          title: "标签",
-          type: "string",
-          $converter: "/converter/form-group-label.converter"
         }
-      },
-      setPropertyRelates(m, v) {
-        if (m)
-          switch (m && m.propertyID) {
-            case "type": {
-              n.changeControlType(e, m);
-              break;
-            }
-          }
       }
     };
   }
-  /**
-  * 卡片控件：切换控件类型后事件
-  * @param propertyData 控件DOM属性
-  * @param newControlType 新控件类型
-  */
-  changeControlType(e, n) {
-    var g, C, p, a, d;
-    const c = n.propertyValue, u = this.formSchemaUtils.getComponentById(this.componentId);
-    let m = this.getControlParentContainer(e.id, u);
-    if (!m)
-      return;
-    const v = m.contents.findIndex((s) => s.id === e.id), M = m.contents[v];
-    let S;
-    this.designViewModelField && (this.designViewModelUtils.getDgViewModel(this.viewModelId).changeField(this.designViewModelField.id, {
-      editor: {
-        $type: c
-      },
-      name: this.designViewModelField.name,
-      require: this.designViewModelField.require,
-      readonly: this.designViewModelField.readonly
-    }, !1), S = this.controlCreatorUtils.setFormFieldProperty("Form", this.designViewModelField, null, c)), Object.assign(S, {
-      id: M.id,
-      appearance: M.appearance,
-      size: M.size,
-      label: M.label
-    }), Object.assign(S.editor, {
-      isTextArea: S.isTextArea && M.isTextArea,
-      type: c || "",
-      placeHolder: (g = M.editor) == null ? void 0 : g.placeHolder,
-      holdPlace: (C = M.editor) == null ? void 0 : C.holdPlace,
-      readonly: (p = M.editor) == null ? void 0 : p.readonly,
-      require: (a = M.editor) == null ? void 0 : a.require,
-      visible: (d = M.editor) == null ? void 0 : d.visible
-    }), m.contents.splice(v, 1, S);
-  }
   getAppearanceConfig(e = null) {
     return {
       title: "样式",
@@ -2133,40 +2025,14 @@ class ae {
           type: "string",
           description: "组件的样式",
           $converter: "/converter/appearance.converter"
-        },
-        responseLayout: {
-          description: "响应式列宽",
-          title: "响应式列宽",
-          type: "boolean",
-          visible: !1,
-          editor: {
-            type: "response-layout-editor-setting"
-          },
-          $converter: "/converter/response-form-layout.converter"
         }
       }
     };
   }
-  /**
-  * 获取控件：以contents为节点进行定位
-  * @param controlId 控件ID
-  * @param domJson 容器
-  */
-  getControlParentContainer(e, n) {
-    let c;
-    if (!n || !n.contents || n.contents.length === 0)
-      return null;
-    for (const u of n.contents) {
-      if (u.id === e)
-        return c = n, n;
-      if (c = this.getControlParentContainer(e, u), c)
-        return c;
-    }
-  }
 }
-class Tt extends ae {
-  constructor(e, n) {
-    super(e, n);
+class jt extends ae {
+  constructor(e, o) {
+    super(e, o);
   }
   getPropertyConfig(e) {
     return this.getBasicPropConfig(e), this.getBehaviorProperties(e), this.propertyConfig;
@@ -2190,7 +2056,7 @@ class Tt extends ae {
             type: "combo-list",
             textField: "value",
             valueField: "key",
-            data: [{ key: "response-toolbar", value: I["response-toolbar"].name }]
+            data: [{ key: "response-toolbar", value: re["response-toolbar"].name }]
           }
         }
       }
@@ -2233,54 +2099,54 @@ class Tt extends ae {
     };
   }
 }
-function xt(r, e, n, c) {
-  const u = xe(), m = j(!1), v = j(!1);
-  let M = !0, S = !1, g;
-  function C(D) {
-    return g && g.componentClassList && g.componentClassList.includes("f-form-layout") && g.componentClassList.includes("farris-form") ? D.sourceType === "control" && D.controlCategory === "input" || D.sourceType === "move" && D.controlType === "form-group" : !0;
-  }
-  function p(D) {
-    return !ft().basalDragulaRuleForContainer(D) || !M || !C(D), !1;
-  }
-  function a() {
-    m.value = !1, v.value = !1;
-    const D = r, b = D.appearance && D.appearance.class || "", k = b.split(" "), E = D.buttons || [], l = E.length ? E[0] : null, o = l && l.appearance ? l.appearance.class : "", t = o ? o.split(" ") : [], i = E.length ? E.reduce((V, W) => {
-      const U = W && W.appearance ? W.appearance.class : "", Z = U ? U.split(" ") : [];
-      return V.push(...Z), V;
-    }, []) : [], f = n == null ? void 0 : n.schema, R = f && f.appearance && f.appearance.class || "", T = R ? R.split(" ") : [];
+function It(s, e, o, p) {
+  const u = Te(), v = S(!1), h = S(!1);
+  let D = !0, I = !1, g;
+  function C(j) {
+    return g && g.componentClassList && g.componentClassList.includes("f-form-layout") && g.componentClassList.includes("farris-form") ? j.sourceType === "control" && j.controlCategory === "input" || j.sourceType === "move" && j.controlType === "form-group" : !0;
+  }
+  function l(j) {
+    return !ht().basalDragulaRuleForContainer(j) || !D || !C(j), !1;
+  }
+  function i() {
+    v.value = !1, h.value = !1;
+    const j = s, m = j.appearance && j.appearance.class || "", R = m.split(" "), A = j.buttons || [], a = A.length ? A[0] : null, n = a && a.appearance ? a.appearance.class : "", t = n ? n.split(" ") : [], r = A.length ? A.reduce(($, V) => {
+      const U = V && V.appearance ? V.appearance.class : "", Y = U ? U.split(" ") : [];
+      return $.push(...Y), $;
+    }, []) : [], d = o == null ? void 0 : o.schema, E = d && d.appearance && d.appearance.class || "", x = E ? E.split(" ") : [];
     g = {
-      componentClass: b,
-      componentClassList: k,
-      childContents: E,
-      firstChildContent: l,
-      firstChildClass: o,
+      componentClass: m,
+      componentClassList: R,
+      childContents: A,
+      firstChildContent: a,
+      firstChildClass: n,
       firstChildClassList: t,
-      parent: f,
-      parentClass: R,
-      parentClassList: T,
-      children: E,
-      childrenClassList: i
+      parent: d,
+      parentClass: E,
+      parentClassList: x,
+      children: A,
+      childrenClassList: r
     };
-    const { canAccept: B, fixed: _, hidePadding: L } = u.getRuleValue(k[0], g);
-    return M = B, S = L, !0;
+    const { canAccept: M, fixed: F, hidePadding: _ } = u.getRuleValue(R[0], g);
+    return D = M, I = _, !0;
   }
-  function d(D) {
+  function f(j) {
   }
-  function s() {
-    return r.componentType ? "display:inherit;flex-direction:inherit;margin-bottom:10px" : "";
+  function c() {
+    return s.componentType ? "display:inherit;flex-direction:inherit;margin-bottom:10px" : "";
   }
-  function y(D, b) {
-    return b.text = D.label, b;
+  function b(j, m) {
+    return m.text = j.label, m;
   }
-  function h(D, b, k) {
-    const E = r;
-    if ((E.appearance && E.appearance.class || "").split(" ").includes("f-form-layout")) {
-      const t = String(D.innerText), i = q("form-group");
-      return i.editor = k, i.label = t, i;
+  function y(j, m, R) {
+    const A = s;
+    if ((A.appearance && A.appearance.class || "").split(" ").includes("f-form-layout")) {
+      const t = String(j.innerText), r = q("form-group");
+      return r.editor = R, r.label = t, r;
     }
-    return k;
+    return R;
   }
-  function x() {
+  function T() {
     return !1;
   }
   function O() {
@@ -2289,29 +2155,29 @@ function xt(r, e, n, c) {
   function P() {
     return !0;
   }
-  function A() {
-    return S;
+  function k() {
+    return I;
   }
-  function N(D) {
-    return new Tt(D, e).getPropertyConfig(r);
+  function N(j) {
+    return new jt(j, e).getPropertyConfig(s);
   }
   return {
-    canAccepts: p,
+    canAccepts: l,
     checkCanAddComponent: P,
     checkCanDeleteComponent: O,
-    checkCanMoveComponent: x,
-    getStyles: s,
-    hideNestedPaddingInDesginerView: A,
-    onAcceptNewChildElement: h,
-    onAcceptMovedChildElement: d,
-    onResolveNewComponentSchema: y,
-    resolveComponentContext: a,
+    checkCanMoveComponent: T,
+    getStyles: c,
+    hideNestedPaddingInDesginerView: k,
+    onAcceptNewChildElement: y,
+    onAcceptMovedChildElement: f,
+    onResolveNewComponentSchema: b,
+    resolveComponentContext: i,
     getPropsConfig: N,
-    triggerBelongedComponentToMoveWhenMoved: m,
-    triggerBelongedComponentToDeleteWhenDeleted: v
+    triggerBelongedComponentToMoveWhenMoved: v,
+    triggerBelongedComponentToDeleteWhenDeleted: h
   };
 }
-const St = {
+const Dt = {
   id: { type: String, default: "" },
   componentId: { type: String, default: "" },
   canAdd: { type: Boolean, default: !1 },
@@ -2324,46 +2190,46 @@ const St = {
    * 组件值
    */
   modelValue: { type: Object }
-}, ee = j(0);
-function Dt(r, e) {
-  const n = e.getBoundingClientRect(), c = r.getBoundingClientRect(), u = c.top >= n.top, m = c.top <= n.bottom;
-  return u && m;
+}, ee = S(0);
+function Pt(s, e) {
+  const o = e.getBoundingClientRect(), p = s.getBoundingClientRect(), u = p.top >= o.top, v = p.top <= o.bottom;
+  return u && v;
 }
-function It(r) {
-  if (!r)
+function Rt(s) {
+  if (!s)
     return;
   let e;
-  if (r.className.includes("dgComponentSelected") ? e = r : e = r.querySelector(".dgComponentSelected"), !e)
+  if (s.className.includes("dgComponentSelected") ? e = s : e = s.querySelector(".dgComponentSelected"), !e)
     return;
-  const n = e.getBoundingClientRect();
-  if (n.width === 0 && n.height === 0)
+  const o = e.getBoundingClientRect();
+  if (o.width === 0 && o.height === 0)
     return;
-  const c = e.querySelector(".component-btn-group");
-  if (c) {
-    if (!Dt(e, r)) {
-      c.style.display = "none";
+  const p = e.querySelector(".component-btn-group");
+  if (p) {
+    if (!Pt(e, s)) {
+      p.style.display = "none";
       return;
     }
-    c.style.display = "";
-    const m = c.getBoundingClientRect(), v = c.querySelector("div");
-    if (v) {
-      const M = v.getBoundingClientRect();
-      v.style.top = m.top + "px", v.style.left = m.left - M.width + "px";
+    p.style.display = "";
+    const v = p.getBoundingClientRect(), h = p.querySelector("div");
+    if (h) {
+      const D = h.getBoundingClientRect();
+      h.style.top = v.top + "px", h.style.left = v.left - D.width + "px";
     }
   }
 }
-function Mt(r, e, n) {
+function Et(s, e, o) {
   var N;
-  function c() {
+  function p() {
   }
-  const u = "", m = j();
-  function v() {
+  const u = "", v = S();
+  function h() {
     return !0;
   }
-  function M() {
+  function D() {
     return !1;
   }
-  function S() {
+  function I() {
     return !0;
   }
   function g() {
@@ -2372,120 +2238,120 @@ function Mt(r, e, n) {
   function C() {
     return !0;
   }
-  function p(D) {
-    if (!D || !D.value)
+  function l(j) {
+    if (!j || !j.value)
       return null;
-    const b = j(D == null ? void 0 : D.value.parent), k = p(b);
-    return k || null;
+    const m = S(j == null ? void 0 : j.value.parent), R = l(m);
+    return R || null;
   }
-  function a(D = e) {
-    const { componentInstance: b, designerItemElementRef: k } = D;
-    return !b || !b.value ? null : b.value.canMove || b.value.canAdd || b.value.canDelete ? k : a(D.parent);
+  function i(j = e) {
+    const { componentInstance: m, designerItemElementRef: R } = j;
+    return !m || !m.value ? null : m.value.canMove || m.value.canAdd || m.value.canDelete ? R : i(j.parent);
   }
-  function d(D) {
-    return !!n;
+  function f(j) {
+    return !!o;
   }
-  function s() {
+  function c() {
     return (e == null ? void 0 : e.schema.label) || (e == null ? void 0 : e.schema.title) || (e == null ? void 0 : e.schema.name);
   }
-  function y() {
+  function b() {
   }
-  function h(D, b) {
+  function y(j, m) {
   }
-  function x(D) {
-    const { componentType: b } = D;
-    let k = q(b, D);
-    const E = b.toLowerCase().replace("-", "_");
-    return k && !k.id && k.type === b && (k.id = `${E}_${Math.random().toString().slice(2, 6)}`), k;
+  function T(j) {
+    const { componentType: m } = j;
+    let R = q(m, j);
+    const A = m.toLowerCase().replace("-", "_");
+    return R && !R.id && R.type === m && (R.id = `${A}_${Math.random().toString().slice(2, 6)}`), R;
   }
-  function O(D, b) {
-    const k = String(D.getAttribute("data-controltype")), E = D.getAttribute("data-feature"), l = E ? JSON.parse(E) : {};
-    l.parentComponentInstance = m.value;
-    let o = q(k, l);
-    const t = k.toLowerCase().replace("-", "_");
-    return o && !o.id && o.type === k && (o.id = `${t}_${Math.random().toString().slice(2, 6)}`), o;
+  function O(j, m) {
+    const R = String(j.getAttribute("data-controltype")), A = j.getAttribute("data-feature"), a = A ? JSON.parse(A) : {};
+    a.parentComponentInstance = v.value;
+    let n = q(R, a);
+    const t = R.toLowerCase().replace("-", "_");
+    return n && !n.id && n.type === R && (n.id = `${t}_${Math.random().toString().slice(2, 6)}`), n;
   }
-  function P(D) {
+  function P(j) {
   }
-  function A(...D) {
+  function k(...j) {
     return [];
   }
-  return m.value = {
-    canMove: v(),
-    canSelectParent: M(),
+  return v.value = {
+    canMove: h(),
+    canSelectParent: D(),
     canAdd: g(),
-    canDelete: S(),
+    canDelete: I(),
     canNested: !C(),
     contents: [],
-    elementRef: r,
+    elementRef: s,
     parent: (N = e.parent) == null ? void 0 : N.componentInstance,
     schema: e.schema,
     styles: u,
-    canAccepts: d,
-    getBelongedComponentInstance: p,
-    getDraggableDesignItemElement: a,
-    getDraggingDisplayText: s,
-    getPropConfig: A,
-    getDragScopeElement: y,
-    onAcceptMovedChildElement: h,
+    canAccepts: f,
+    getBelongedComponentInstance: l,
+    getDraggableDesignItemElement: i,
+    getDraggingDisplayText: c,
+    getPropConfig: k,
+    getDragScopeElement: b,
+    onAcceptMovedChildElement: y,
     onAcceptNewChildElement: O,
     onChildElementMovedOut: P,
-    addNewChildComponentSchema: x,
-    updateDragAndDropRules: c,
-    triggerBelongedComponentToMoveWhenMoved: j(!1),
-    triggerBelongedComponentToDeleteWhenDeleted: j(!1)
-  }, m;
+    addNewChildComponentSchema: T,
+    updateDragAndDropRules: p,
+    triggerBelongedComponentToMoveWhenMoved: S(!1),
+    triggerBelongedComponentToDeleteWhenDeleted: S(!1)
+  }, v;
 }
-const kt = /* @__PURE__ */ Y({
+const St = /* @__PURE__ */ X({
   name: "FDesignerInnerItem",
-  props: St,
+  props: Dt,
   emits: ["selectionChange", "addComponent", "removeComponent"],
-  setup(r, e) {
-    const n = j(r.canMove), c = j(r.canAdd), u = j(r.canDelete), m = j(!1), v = j(r.contentKey), M = j(r.childType), S = j(r.childLabel), g = j(r.modelValue), C = j(""), p = j(), a = $("canvas-dragula"), d = j(), s = $("design-item-context"), y = {
-      designerItemElementRef: p,
-      componentInstance: d,
+  setup(s, e) {
+    const o = S(s.canMove), p = S(s.canAdd), u = S(s.canDelete), v = S(!1), h = S(s.contentKey), D = S(s.childType), I = S(s.childLabel), g = S(s.modelValue), C = S(""), l = S(), i = L("canvas-dragula"), f = S(), c = L("design-item-context"), b = {
+      designerItemElementRef: l,
+      componentInstance: f,
       schema: g.value,
-      parent: s,
+      parent: c,
       setupContext: e
     };
-    Re("design-item-context", y);
-    const h = z(() => ({
+    Ee("design-item-context", b);
+    const y = W(() => ({
       "farris-component": !0,
       // 受position-relative影响，整个容器的高度不能被撑起
-      "flex-fill": r.id == "root-component",
-      "position-relative": n.value || u.value,
-      "farris-nested": m.value,
-      "can-move": n.value,
-      "d-none": p.value && p.value.classList.contains("d-none")
-    })), x = z(() => {
+      "flex-fill": s.id == "root-component",
+      "position-relative": o.value || u.value,
+      "farris-nested": v.value,
+      "can-move": o.value,
+      "d-none": l.value && l.value.classList.contains("d-none")
+    })), T = W(() => {
       const t = {};
-      return C.value && C.value.split(";").reduce((i, f) => {
-        const [R, T] = f.split(":");
-        return R && (i[R] = T), i;
+      return C.value && C.value.split(";").reduce((r, d) => {
+        const [E, x] = d.split(":");
+        return E && (r[E] = x), r;
       }, t), t;
     });
-    function O(t, i) {
-      if (s && s.schema[v.value]) {
-        const f = s.schema[v.value].findIndex((R) => R.id === i.id);
-        if (f > -1) {
-          const R = s.schema[v.value].length, T = s.schema[v.value][f % R];
-          s.designerItemElementRef.value.querySelector(`#${T.id}-design-item`), s.schema[v.value].splice(f, 1), s.componentInstance.value.updateDragAndDropRules(), ee.value++, e.emit("removeComponent");
+    function O(t, r) {
+      if (c && c.schema[h.value]) {
+        const d = c.schema[h.value].findIndex((E) => E.id === r.id);
+        if (d > -1) {
+          const E = c.schema[h.value].length, x = c.schema[h.value][d % E];
+          c.designerItemElementRef.value.querySelector(`#${x.id}-design-item`), c.schema[h.value].splice(d, 1), c.componentInstance.value.updateDragAndDropRules(), ee.value++, e.emit("removeComponent");
         }
       }
     }
     function P(t) {
-      if (d.value.addNewChildComponentSchema) {
-        const i = {
-          componentType: M.value,
-          label: S.value,
-          parentComponentInstance: d.value,
+      if (f.value.addNewChildComponentSchema) {
+        const r = {
+          componentType: D.value,
+          label: I.value,
+          parentComponentInstance: f.value,
           targetPosition: -1
-        }, f = d.value.addNewChildComponentSchema(i);
-        g.value[v.value].push(f), e.emit("addComponent");
+        }, d = f.value.addNewChildComponentSchema(r);
+        g.value[h.value].push(d), e.emit("addComponent");
       }
     }
-    function A() {
-      return c.value && w("div", {
+    function k() {
+      return p.value && w("div", {
         role: "button",
         class: "btn component-settings-button",
         title: "新增",
@@ -2503,13 +2369,13 @@ const kt = /* @__PURE__ */ Y({
         class: "btn component-settings-button",
         title: "删除",
         ref: "removeComponent",
-        onClick: je((i) => O(i, t), ["stop"])
+        onClick: Me((r) => O(r, t), ["stop"])
       }, [w("i", {
         class: "f-icon f-icon-yxs_delete"
       }, null)]);
     }
-    function D() {
-      return n.value && w("div", {
+    function j() {
+      return o.value && w("div", {
         role: "button",
         class: "btn component-settings-button",
         title: "移动",
@@ -2519,61 +2385,61 @@ const kt = /* @__PURE__ */ Y({
         class: "cmp_move f-icon f-icon-yxs_move"
       }, null)]);
     }
-    function b(t) {
+    function m(t) {
       return w("div", {
         class: "component-btn-group",
         "data-noattach": "true"
-      }, [w("div", null, [A(), D(), N(t)])]);
+      }, [w("div", null, [k(), j(), N(t)])]);
     }
-    Q(() => r.modelValue, (t) => {
-      g.value = t, y.schema = t;
+    H(() => s.modelValue, (t) => {
+      g.value = t, b.schema = t;
     });
-    function k(t) {
-      const i = t.target;
-      It(i);
+    function R(t) {
+      const r = t.target;
+      Rt(r);
     }
-    function E() {
-      var t, i;
-      (i = (t = g.value) == null ? void 0 : t.contents) != null && i.length && p.value && p.value.addEventListener("scroll", k);
+    function A() {
+      var t, r;
+      (r = (t = g.value) == null ? void 0 : t.contents) != null && r.length && l.value && l.value.addEventListener("scroll", R);
     }
-    function l() {
-      const t = p.value, i = j(t.children[1]);
-      return Mt(i, y).value;
+    function a() {
+      const t = l.value, r = S(t.children[1]);
+      return Et(r, b).value;
     }
-    H(() => {
-      if (p.value) {
-        const t = p.value.querySelector(`[data-dragref='${g.value.id}-container']`);
-        d.value = t && t.componentInstance ? t.componentInstance.value : l(), a && t && a.attachComponents(t, g.value), m.value = d.value.canNested !== void 0 ? d.value.canNested : m.value, c.value = d.value.canAdd !== void 0 ? d.value.canAdd : c.value, u.value = d.value.canDelete !== void 0 ? d.value.canDelete : u.value, n.value = d.value.canMove !== void 0 ? d.value.canMove : n.value, C.value = d.value.styles || "", p.value && (p.value.componentInstance = d, p.value.designItemContext = y);
+    z(() => {
+      if (l.value) {
+        const t = l.value.querySelector(`[data-dragref='${g.value.id}-container']`);
+        f.value = t && t.componentInstance ? t.componentInstance.value : a(), i && t && i.attachComponents(t, g.value), v.value = f.value.canNested !== void 0 ? f.value.canNested : v.value, p.value = f.value.canAdd !== void 0 ? f.value.canAdd : p.value, u.value = f.value.canDelete !== void 0 ? f.value.canDelete : u.value, o.value = f.value.canMove !== void 0 ? f.value.canMove : o.value, C.value = f.value.styles || "", l.value && (l.value.componentInstance = f, l.value.designItemContext = b);
       }
-      E(), ee.value++;
-    }), Ee(() => {
-      p.value && p.value.removeEventListener("scroll", k);
+      A(), ee.value++;
+    }), Se(() => {
+      l.value && l.value.removeEventListener("scroll", R);
     });
-    function o(t) {
-      Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((f) => f.classList.remove("dgComponentFocused")), t && (t.preventDefault(), t.stopPropagation());
-      const i = p.value;
-      if (i) {
-        const f = document.getElementsByClassName("dgComponentSelected");
-        if (!(f && f.length === 1 && f[0] === p.value)) {
-          Array.from(f).forEach((B) => B.classList.remove("dgComponentSelected")), i.classList.add("dgComponentFocused"), e.emit("selectionChange", g.value.type, g.value, r.componentId, d.value);
-          const T = d.value.getDraggableDesignItemElement(y);
-          T && T.value && T.value.classList.add("dgComponentSelected");
+    function n(t) {
+      Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((d) => d.classList.remove("dgComponentFocused")), t && (t.preventDefault(), t.stopPropagation());
+      const r = l.value;
+      if (r) {
+        const d = document.getElementsByClassName("dgComponentSelected");
+        if (!(d && d.length === 1 && d[0] === l.value)) {
+          Array.from(d).forEach((M) => M.classList.remove("dgComponentSelected")), r.classList.add("dgComponentFocused"), e.emit("selectionChange", g.value.type, g.value, s.componentId, f.value);
+          const x = f.value.getDraggableDesignItemElement(b);
+          x && x.value && x.value.classList.add("dgComponentSelected");
         }
       }
       ee.value++;
     }
     return () => w("div", {
-      id: `${r.id}-design-item`,
-      ref: p,
-      class: h.value,
-      style: x.value,
-      onClick: o
-    }, [b(g.value), e.slots.default && e.slots.default()]);
+      id: `${s.id}-design-item`,
+      ref: l,
+      class: y.value,
+      style: T.value,
+      onClick: n
+    }, [m(g.value), e.slots.default && e.slots.default()]);
   }
 });
-class Pt extends ae {
-  constructor(e, n) {
-    super(e, n);
+class Mt extends ae {
+  constructor(e, o) {
+    super(e, o);
   }
   getPropertyConfig(e) {
     return this.getBasicPropConfig(e), this.getAppearanceProperties(e), this.getEventPropConfig(e), this.propertyConfig;
@@ -2622,20 +2488,20 @@ class Pt extends ae {
           title: "style样式"
         }
       },
-      setPropertyRelates(n, c) {
+      setPropertyRelates(o, p) {
       }
     };
   }
   getEventPropConfig(e) {
-    const n = [
+    const o = [
       {
         label: "click",
         name: "点击事件"
       }
     ];
-    var c = this;
-    const u = c.eventsEditorUtils.formProperties(e, c.viewModelId, n), m = {};
-    m[c.viewModelId] = {
+    var p = this;
+    const u = p.eventsEditorUtils.formProperties(e, p.viewModelId, o), v = {};
+    v[p.viewModelId] = {
       type: "events-editor",
       editor: {
         initialData: u
@@ -2643,21 +2509,21 @@ class Pt extends ae {
     }, this.propertyConfig.categories.eventsEditor = {
       title: "事件",
       hideTitle: !0,
-      properties: m,
+      properties: v,
       // 这个属性，标记当属性变更得时候触发重新更新属性
       refreshPanelAfterChanged: !0,
       tabId: "commands",
       tabName: "交互",
-      setPropertyRelates(v, M) {
-        const S = v.propertyValue;
-        delete e[c.viewModelId], S && (S.setPropertyRelates = this.setPropertyRelates, c.eventsEditorUtils.saveRelatedParameters(e, c.viewModelId, S.events, S));
+      setPropertyRelates(h, D) {
+        const I = h.propertyValue;
+        delete e[p.viewModelId], I && (I.setPropertyRelates = this.setPropertyRelates, p.eventsEditorUtils.saveRelatedParameters(e, p.viewModelId, I.events, I));
       }
     };
   }
 }
-class Rt extends ae {
-  constructor(e, n) {
-    super(e, n);
+class kt extends ae {
+  constructor(e, o) {
+    super(e, o);
   }
   getPropertyConfig(e) {
     return this.getBasicPropConfig(), this.getAppearanceProperties(e), this.getEventPropConfig(e), this.propertyConfig;
@@ -2681,7 +2547,7 @@ class Rt extends ae {
             type: "combo-list",
             textField: "value",
             valueField: "key",
-            data: [{ key: "response-toolbar-item", value: I["response-toolbar-item"].name }]
+            data: [{ key: "response-toolbar-item", value: re["response-toolbar-item"].name }]
           }
         },
         text: {
@@ -2699,15 +2565,31 @@ class Rt extends ae {
     };
   }
   getAppearanceProperties(e) {
+    this.propertyConfig.categories.appearance = {
+      title: "样式",
+      description: "Appearance",
+      properties: {
+        class: {
+          title: "class",
+          type: "string",
+          description: ""
+        },
+        style: {
+          title: "style",
+          type: "string",
+          description: ""
+        }
+      }
+    };
   }
   getEventPropConfig(e) {
-    const n = [
+    const o = [
       {
         label: "click",
         name: "点击事件"
       }
-    ], c = this, u = c.eventsEditorUtils.formProperties(e, c.viewModelId, n), m = {};
-    m[c.viewModelId] = {
+    ], p = this, u = p.eventsEditorUtils.formProperties(e, p.viewModelId, o), v = {};
+    v[p.viewModelId] = {
       type: "events-editor",
       editor: {
         initialData: u
@@ -2715,275 +2597,272 @@ class Rt extends ae {
     }, this.propertyConfig.categories.eventsEditor = {
       title: "事件",
       hideTitle: !0,
-      properties: m,
+      properties: v,
       // 这个属性，标记当属性变更得时候触发重新更新属性
       refreshPanelAfterChanged: !0,
       tabId: "commands",
       tabName: "交互",
-      setPropertyRelates(v, M) {
-        const S = v.propertyValue;
-        delete e[c.viewModelId], S && (S.setPropertyRelates = this.setPropertyRelates, c.eventsEditorUtils.saveRelatedParameters(e, c.viewModelId, S.events, S));
+      setPropertyRelates(h, D) {
+        const I = h.propertyValue;
+        delete e[p.viewModelId], I && (I.setPropertyRelates = this.setPropertyRelates, p.eventsEditorUtils.saveRelatedParameters(e, p.viewModelId, I.events, I));
       }
     };
   }
 }
-function Et(r, e) {
-  xe();
-  const n = j(!1), c = j(!1);
-  let u = !1, m = !1;
-  function v(h) {
+function At(s, e) {
+  Te();
+  const o = S(!1), p = S(!1);
+  let u = !1, v = !1;
+  function h(y) {
     return !1;
   }
-  function M(h) {
+  function D(y) {
   }
-  function S() {
+  function I() {
     return "";
   }
-  function g(h, x) {
-    return x.text = h.label, x;
+  function g(y, T) {
+    return T.text = y.label, T;
   }
-  function C(h, x, O) {
-    const P = r.schema;
+  function C(y, T, O) {
+    const P = s.schema;
     if ((P.appearance && P.appearance.class || "").split(" ").includes("f-form-layout")) {
-      const D = String(h.innerText), b = q("form-group");
-      return b.editor = O, b.label = D, b;
+      const j = String(y.innerText), m = q("form-group");
+      return m.editor = O, m.label = j, m;
     }
     return O;
   }
-  function p() {
+  function l() {
     return !1;
   }
-  function a() {
-    return !m;
+  function i() {
+    return !v;
   }
-  function d() {
+  function f() {
     return !1;
   }
-  function s() {
+  function c() {
     return u;
   }
-  function y(h) {
-    let x;
-    switch (r.schema.type) {
+  function b(y) {
+    let T;
+    switch (s.schema.type) {
       case "tab-toolbar-item":
-        x = new Pt(h, e);
+        T = new Mt(y, e);
         break;
       default:
-        x = new Rt(h, e);
+        T = new kt(y, e);
     }
-    return x.getPropertyConfig(r.schema);
+    return T.getPropertyConfig(s.schema);
   }
   return {
-    canAccepts: v,
-    checkCanAddComponent: d,
-    checkCanDeleteComponent: a,
-    checkCanMoveComponent: p,
-    getStyles: S,
-    hideNestedPaddingInDesginerView: s,
+    canAccepts: h,
+    checkCanAddComponent: f,
+    checkCanDeleteComponent: i,
+    checkCanMoveComponent: l,
+    getStyles: I,
+    hideNestedPaddingInDesginerView: c,
     onAcceptNewChildElement: C,
-    onAcceptMovedChildElement: M,
+    onAcceptMovedChildElement: D,
     onResolveNewComponentSchema: g,
-    getPropsConfig: y,
-    triggerBelongedComponentToMoveWhenMoved: n,
-    triggerBelongedComponentToDeleteWhenDeleted: c
+    getPropsConfig: b,
+    triggerBelongedComponentToMoveWhenMoved: o,
+    triggerBelongedComponentToDeleteWhenDeleted: p
   };
 }
-const De = /* @__PURE__ */ Y({
+const je = /* @__PURE__ */ X({
   name: "FResponseToolbarItemDesign",
   props: we,
   emits: ["Click"],
-  setup(r, e) {
-    j(), j();
-    const n = j(r.alignment), c = {
+  setup(s, e) {
+    S(), S();
+    const o = S(s.alignment), p = {
       id: "__more_buttons__",
       text: "More"
-    }, u = j(new G(c));
-    z(() => u.value.children.length > 0);
-    const m = j(), v = $("designer-host-service"), M = $("design-item-context"), S = Et(M, v), g = fe(m, M, S);
-    $("toolbar-item-handler", () => {
-    }), H(() => {
-      m.value.componentInstance = g;
+    }, u = S(new G(p));
+    W(() => u.value.children.length > 0);
+    const v = S(), h = L("designer-host-service"), D = L("design-item-context"), I = At(D, h), g = ge(v, D, I);
+    L("toolbar-item-handler", () => {
+    }), z(() => {
+      v.value.componentInstance = g;
     }), e.expose(g.value);
     function C() {
-      const d = {
+      const f = {
         "f-icon": !0
-      };
-      if (r.icon) {
-        const s = r.icon.trim().split(" ");
-        s && s.length && s.reduce((y, h) => (y[h] = !0, y), d);
-      }
-      return d;
+      }, c = s.icon ? s.icon.trim() : "";
+      return J(f, c);
     }
-    function p() {
-      return !!(r.icon && r.icon.trim());
+    function l() {
+      return !!(s.icon && s.icon.trim());
     }
-    function a() {
-      const d = {
+    function i() {
+      const f = {
         btn: !0,
         "f-rt-btn": !0,
-        "f-btn-ml": n.value === "right",
-        "f-btn-mr": n.value === "left",
-        "btn-icontext": !!(r.icon && r.icon.trim())
+        "f-btn-ml": o.value === "right",
+        "f-btn-mr": o.value === "left",
+        "btn-icontext": !!(s.icon && s.icon.trim())
       };
-      if (r.class) {
-        const s = r.class.split(" ");
-        s && s.length && s.reduce((y, h) => (y[h] = !0, y), d);
-      }
-      return d;
+      return J(f, s.class);
     }
-    return H(() => {
+    return z(() => {
     }), ne(() => {
     }), () => w("div", {
-      ref: m,
-      "data-dragref": `${M.schema.id}-container`,
+      ref: v,
+      "data-dragref": `${D.schema.id}-container`,
       class: "farris-component position-relative",
       style: "display:inline-block!important;"
     }, [w("button", {
       type: "button",
-      class: a(),
-      id: r.id
-    }, [p() && w("i", {
+      class: i(),
+      id: s.id
+    }, [l() && w("i", {
       class: C()
-    }, null), r.text])]);
+    }, null), s.text])]);
   }
-}), jt = /* @__PURE__ */ Y({
+}), Bt = /* @__PURE__ */ X({
   name: "FResponseToolbarDesign",
-  props: at,
+  props: pt,
   emits: ["Click"],
-  setup(r, e) {
-    const n = j(r.items);
-    let c = new Array(n.value.length).fill(j());
-    const u = j(), m = j(), v = j(r.alignment), M = {
+  setup(s, e) {
+    const o = S(s.items);
+    let p = new Array(o.value.length).fill(S());
+    const u = S(), v = S(), h = S(s.alignment), D = {
       id: "__more_buttons__",
       text: "More"
-    }, S = j(new G(M)), g = Te();
-    z(() => S.value.children.length > 0);
-    const C = j(), p = $("designer-host-service"), a = $("design-item-context"), d = xt(a.schema, p, a), s = fe(C, a, d);
-    $("toolbar-item-handler", () => {
-    }), H(() => {
-      C.value.componentInstance = s;
-    }), e.expose(s.value);
-    const y = z(() => ({
+    }, I = S(new G(D)), g = xe();
+    W(() => I.value.children.length > 0);
+    const C = S(), l = L("designer-host-service"), i = L("design-item-context"), f = It(i.schema, l, i), c = ge(C, i, f);
+    L("toolbar-item-handler", () => {
+    }), z(() => {
+      C.value.componentInstance = c;
+    }), e.expose(c.value);
+    const b = W(() => J({
       "f-toolbar": !0,
       "f-response-toolbar": !0,
       "position-relative": !0
-    })), h = z(() => ({
+    }, s.customClass)), y = W(() => ({
       "d-flex": !0,
       "flex-nowrap": !0,
-      "justify-content-end": v.value === "right",
-      "justify-content-start": v.value === "left"
+      "justify-content-end": h.value === "right",
+      "justify-content-start": h.value === "left"
     })), {
-      renderToolbarDropdown: x,
+      renderToolbarDropdown: T,
       clearAllDropDown: O
-    } = ut(r, g, s);
+    } = mt(s, g, c);
     function P() {
-      n.value.filter((l) => l.children && l.children.length > 0).forEach((l) => {
-        l.expanded = !1;
-      }), S.value.expanded = !1, O();
+      o.value.filter((a) => a.children && a.children.length > 0).forEach((a) => {
+        a.expanded = !1;
+      }), I.value.expanded = !1, O();
     }
-    const A = /* @__PURE__ */ new Map(), N = [];
-    function D(l) {
-      const o = m.value;
-      let t = l;
-      const i = Array.from(o.children), f = i[i.length - 1].id === "__more_buttons__" ? i[i.length - 1] : null;
-      if (f) {
-        const L = f.computedStyleMap().get("margin-left"), V = f.computedStyleMap().get("margin-right"), W = (L ? L.value : 0) + f.getBoundingClientRect().width + (V ? V.value : 0);
-        t -= W;
+    const k = /* @__PURE__ */ new Map(), N = [];
+    function j(a) {
+      const n = v.value;
+      let t = a;
+      const r = Array.from(n.children), d = r[r.length - 1].id === "__more_buttons__" ? r[r.length - 1] : null;
+      if (d) {
+        const _ = d.computedStyleMap().get("margin-left"), $ = d.computedStyleMap().get("margin-right"), V = (_ ? _.value : 0) + d.getBoundingClientRect().width + ($ ? $.value : 0);
+        t -= V;
       }
-      const R = i.filter((L) => L.id !== "__more_buttons__");
-      for (const L of R) {
-        const V = L.computedStyleMap().get("margin-left"), W = L.computedStyleMap().get("margin-right"), U = (V ? V.value : 0) + L.getBoundingClientRect().width + (W ? W.value : 0);
-        t < U ? (A.set(L.id, !0), N.push({
-          id: L.id,
+      const E = r.filter((_) => _.id !== "__more_buttons__");
+      for (const _ of E) {
+        const $ = _.computedStyleMap().get("margin-left"), V = _.computedStyleMap().get("margin-right"), U = ($ ? $.value : 0) + _.getBoundingClientRect().width + (V ? V.value : 0);
+        t < U ? (k.set(_.id, !0), N.push({
+          id: _.id,
           width: U
         })) : t -= U;
       }
       if (N.length)
-        for (let L = N.length - 1; L >= 0; L--) {
-          const V = N[L].width;
-          if (t >= V)
-            t -= V, A.delete(N[L].id), N.pop();
+        for (let _ = N.length - 1; _ >= 0; _--) {
+          const $ = N[_].width;
+          if (t >= $)
+            t -= $, k.delete(N[_].id), N.pop();
           else
             break;
         }
-      const T = Object.assign({}, S.value);
-      T.children = [];
-      const B = new G(T), _ = n.value.reduce((L, V) => (A.has(V.id) && B.children.push(V), V.visible = !A.has(V.id), L.push(V), L), []);
-      S.value = B, n.value = _;
+      const x = Object.assign({}, I.value);
+      x.children = [];
+      const M = new G(x), F = o.value.reduce((_, $) => (k.has($.id) && M.children.push($), $.visible = !k.has($.id), _.push($), _), []);
+      I.value = M, o.value = F;
     }
-    const b = new ResizeObserver((l) => {
-      if (l.length) {
-        const t = l[0].contentRect.width, f = m.value.getBoundingClientRect().width;
-        (t < f || N.length) && D(t);
+    const m = new ResizeObserver((a) => {
+      if (a.length) {
+        const t = a[0].contentRect.width, d = v.value.getBoundingClientRect().width;
+        (t < d || N.length) && j(t);
       }
     });
-    H(() => {
-      const l = u.value;
-      b.observe(l), document.body.addEventListener("click", P);
+    z(() => {
+      const a = u.value;
+      m.observe(a), document.body.addEventListener("click", P);
     }), ne(() => {
-      b.disconnect(), document.body.removeEventListener("click", P);
-    }), Q(() => r.items, () => {
-      n.value = r.items;
+      m.disconnect(), document.body.removeEventListener("click", P);
+    }), H(() => s.items, () => {
+      o.value = s.items;
     }, {
       deep: !0
-    }), Q(n, (l) => {
-      c = new Array(n.value.length).fill(j());
+    }), H(o, (a) => {
+      p = new Array(o.value.length).fill(S());
     });
-    function k(l, o, t, i) {
-      a && a.setupContext && a.setupContext.emit("selectionChange", l, o, t, i);
+    function R(a, n, t, r) {
+      i && i.setupContext && i.setupContext.emit("selectionChange", a, n, t, r);
     }
-    function E() {
-      const l = m.value.querySelector(".dgComponentFocused.dgComponentSelected");
-      l == null || l.classList.remove("dgComponentSelected"), l == null || l.classList.remove("dgComponentFocused");
+    function A() {
+      const a = v.value.querySelector(".dgComponentFocused.dgComponentSelected");
+      a == null || a.classList.remove("dgComponentSelected"), a == null || a.classList.remove("dgComponentFocused");
     }
     return () => w("div", {
       ref: C,
-      "data-dragref": `${a.schema.id}-container`,
-      class: y.value
+      "data-dragref": `${i.schema.id}-container`,
+      class: b.value
     }, [w("div", {
       ref: u,
-      class: h.value
+      class: y.value
     }, [w("div", {
-      ref: m,
+      ref: v,
       class: "d-inline-block f-response-content",
       style: "white-space: nowrap;"
-    }, [n.value.map((l, o) => w(kt, {
-      ref: c[o],
+    }, [o.value.map((a, n) => w(St, {
+      ref: p[n],
       class: "p-0 display-inline-block",
-      modelValue: l,
-      "onUpdate:modelValue": (t) => l = t,
+      modelValue: a,
+      "onUpdate:modelValue": (t) => a = t,
       canMove: !0,
       childType: "response-toolbar-item",
       childLabel: "按钮",
       contentKey: "buttons",
-      componentId: r.componentId,
-      id: l.id,
+      componentId: s.componentId,
+      id: a.id,
       style: "padding:0 !important;display:inline-block",
-      onSelectionChange: k,
-      onRemoveComponent: E
+      onSelectionChange: R,
+      onRemoveComponent: A
     }, {
-      default: () => [w(De, {
-        id: l.id,
-        disable: l.disable,
-        text: l.text,
-        icon: l.icon,
-        componentId: r.componentId
-      }, null)]
+      default: () => {
+        var t;
+        return [w(je, {
+          id: a.id,
+          disable: a.disable,
+          text: a.text,
+          icon: a.icon,
+          class: ((t = a.appearance) == null ? void 0 : t.class) || "btn-secondary",
+          alignment: s.alignment || "right",
+          componentId: s.componentId
+        }, null)];
+      }
     }))])])]);
   }
-}), Vt = ie;
-X.register = (r, e, n) => {
-  r["response-toolbar"] = X, e["response-toolbar"] = ie;
+}), Vt = ce;
+Q.register = (s, e, o) => {
+  s["response-toolbar"] = Q, e["response-toolbar"] = ce;
 };
-X.registerDesigner = (r, e, n) => {
-  r["response-toolbar"] = jt, e["response-toolbar"] = ie, r["response-toolbar-item"] = De, e["response-toolbar-item"] = ct;
+Q.registerDesigner = (s, e, o) => {
+  s["response-toolbar"] = Bt, e["response-toolbar"] = ce, s["response-toolbar-item"] = je, e["response-toolbar-item"] = dt;
 };
-const _t = Ae(X);
+const Wt = Ae(Q);
 export {
-  X as FResponseToolbar,
+  Q as FResponseToolbar,
   G as ResponseToolbarDropDownItem,
-  Nt as ResponseToolbarGroup,
-  Fe as ResponseToolbarItem,
-  _t as default,
+  Lt as ResponseToolbarGroup,
+  Be as ResponseToolbarItem,
+  Wt as default,
   Vt as responseToolbarResolver
 };