@farris/ui-vue 1.3.1 → 1.3.3

package/components/page-header/index.esm.js

@@ -1,103 +1,107 @@
-var je = Object.defineProperty;
-var $e = (n, e, t) => e in n ? je(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
-var R = (n, e, t) => $e(n, typeof e != "symbol" ? e + "" : e, t);
-import { defineComponent as U, ref as S, computed as N, watch as q, createVNode as g, createTextVNode as J, getCurrentInstance as be, onMounted as H, onUnmounted as ye, inject as V, provide as _e, onBeforeUnmount as Ne, withModifiers as Fe } from "vue";
-import { isPlainObject as ue, cloneDeep as ve } from "lodash-es";
-import Le from "../response-toolbar/index.esm.js";
-import { getCustomClass as Y, withInstall as Ve } from "../common/index.esm.js";
-import { useDesignerInnerComponent as Ce } from "../designer-canvas/index.esm.js";
-const se = {}, we = {};
-function re(n) {
-  const { properties: e, title: t, ignore: s } = n, i = s && Array.isArray(s), p = Object.keys(e).reduce((u, y) => ((!i || !s.find((w) => w == y)) && (u[y] = e[y].type === "object" && e[y].properties ? re(e[y]) : ve(e[y].default)), u), {});
-  return t && (!i || !s.find((u) => u == "id")) && (p.id = `${t}-${Date.now()}`), p;
+var Ie = Object.defineProperty;
+var Ae = (o, e, t) => e in o ? Ie(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var R = (o, e, t) => Ae(o, typeof e != "symbol" ? e + "" : e, t);
+import { defineComponent as W, ref as M, computed as F, watch as z, createVNode as m, createTextVNode as X, getCurrentInstance as he, onMounted as G, onUnmounted as be, inject as V, provide as Oe, onBeforeUnmount as je, withModifiers as _e } from "vue";
+import { isPlainObject as ue, cloneDeep as ye } from "lodash-es";
+import $e from "../response-toolbar/index.esm.js";
+import { getCustomClass as Z, withInstall as Fe } from "../common/index.esm.js";
+import { useDesignerInnerComponent as ve } from "../designer-canvas/index.esm.js";
+const Ce = {}, we = {};
+function re(o) {
+  const { properties: e, title: t, ignore: s } = o, i = s && Array.isArray(s), u = Object.keys(e).reduce((d, g) => ((!i || !s.find((w) => w === g)) && (d[g] = e[g].type === "object" && e[g].properties ? re(e[g]) : ye(e[g].default)), d), {});
+  if (t && (!i || !s.find((d) => d === "id"))) {
+    const d = t.toLowerCase().replace(/-/g, "_");
+    u.id = `${d}_${Math.random().toString().slice(2, 6)}`;
+  }
+  return u;
 }
-function Q(n, e = {}, t) {
-  const s = se[n];
+function Y(o, e = {}, t) {
+  const s = Ce[o];
   if (s) {
     let i = re(s);
-    const p = we[n];
-    return i = p ? p({ getSchemaByType: Q }, i, e, t) : i, i;
+    const u = we[o];
+    return i = u ? u({ getSchemaByType: Y }, i, e, t) : i, i;
   }
   return null;
 }
-function Ue(n, e) {
+function Ne(o, e) {
   const t = re(e);
-  return Object.keys(n).reduce((s, i) => (s[i] && ue(s[i]) && ue(n[i]) ? Object.assign(s[i], n[i]) : s[i] = n[i], s), t), t;
+  return Object.keys(t).reduce((s, i) => (s[i] && ue(s[i]) && ue(o[i] || !o[i]) ? Object.assign(s[i], o[i] || {}) : s[i] = o[i], s), t), t;
 }
-function We(n, e) {
-  return Object.keys(n).filter((s) => n[s] != null).reduce((s, i) => {
+function Le(o, e) {
+  return Object.keys(o).filter((s) => o[s] != null).reduce((s, i) => {
     if (e.has(i)) {
-      const p = e.get(i);
-      if (typeof p == "string")
-        s[p] = n[i];
+      const u = e.get(i);
+      if (typeof u == "string")
+        s[u] = o[i];
       else {
-        const u = p(i, n[i], n);
-        Object.assign(s, u);
+        const d = u(i, o[i], o);
+        Object.assign(s, d);
       }
     } else
-      s[i] = n[i];
+      s[i] = o[i];
     return s;
   }, {});
 }
-function qe(n, e, t = /* @__PURE__ */ new Map()) {
-  const s = Ue(n, e);
-  return We(s, t);
+function Ve(o, e, t = /* @__PURE__ */ new Map()) {
+  const s = Ne(o, e);
+  return Le(s, t);
 }
-function He(n = {}) {
-  function e(h, b, l, c) {
-    if (typeof l == "number")
-      return c[h].length === l;
-    if (typeof l == "object") {
-      const f = Object.keys(l)[0], v = l[f];
+function Ue(o = {}) {
+  function e(h, b, c, l) {
+    if (typeof c == "number")
+      return l[h].length === c;
+    if (typeof c == "object") {
+      const f = Object.keys(c)[0], v = c[f];
       if (f === "not")
-        return Number(c[h].length) !== Number(v);
+        return Number(l[h].length) !== Number(v);
       if (f === "moreThan")
-        return Number(c[h].length) >= Number(v);
+        return Number(l[h].length) >= Number(v);
       if (f === "lessThan")
-        return Number(c[h].length) <= Number(v);
+        return Number(l[h].length) <= Number(v);
     }
     return !1;
   }
-  function t(h, b, l, c) {
-    return c[h] && c[h].propertyValue && String(c[h].propertyValue.value) === String(l);
+  function t(h, b, c, l) {
+    return l[h] && l[h].propertyValue && String(l[h].propertyValue.value) === String(c);
   }
   const s = /* @__PURE__ */ new Map([
     ["length", e],
     ["getProperty", t]
   ]);
-  Object.keys(n).reduce((h, b) => (h.set(b, n[b]), h), s);
+  Object.keys(o).reduce((h, b) => (h.set(b, o[b]), h), s);
   function i(h, b) {
-    const l = h;
-    return typeof b == "number" ? [{ target: l, operator: "length", param: null, value: Number(b) }] : typeof b == "boolean" ? [{ target: l, operator: "getProperty", param: h, value: !!b }] : typeof b == "object" ? Object.keys(b).map((c) => {
-      if (c === "length")
-        return { target: l, operator: "length", param: null, value: b[c] };
-      const f = c, v = b[c];
-      return { target: l, operator: "getProperty", param: f, value: v };
+    const c = h;
+    return typeof b == "number" ? [{ target: c, operator: "length", param: null, value: Number(b) }] : typeof b == "boolean" ? [{ target: c, operator: "getProperty", param: h, value: !!b }] : typeof b == "object" ? Object.keys(b).map((l) => {
+      if (l === "length")
+        return { target: c, operator: "length", param: null, value: b[l] };
+      const f = l, v = b[l];
+      return { target: c, operator: "getProperty", param: f, value: v };
     }) : [];
   }
-  function p(h) {
-    return Object.keys(h).reduce((l, c) => {
-      const f = i(c, h[c]);
-      return l.push(...f), l;
+  function u(h) {
+    return Object.keys(h).reduce((c, l) => {
+      const f = i(l, h[l]);
+      return c.push(...f), c;
     }, []);
   }
-  function u(h, b) {
+  function d(h, b) {
     if (s.has(h.operator)) {
-      const l = s.get(h.operator);
-      return l && l(h.target, h.param, h.value, b) || !1;
+      const c = s.get(h.operator);
+      return c && c(h.target, h.param, h.value, b) || !1;
     }
     return !1;
   }
-  function y(h, b) {
-    return p(h).reduce((f, v) => f && u(v, b), !0);
+  function g(h, b) {
+    return u(h).reduce((f, v) => f && d(v, b), !0);
   }
   function w(h, b) {
-    const l = Object.keys(h), c = l.includes("allOf"), f = l.includes("anyOf"), v = c || f, $ = (v ? h[v ? c ? "allOf" : "anyOf" : "allOf"] : [h]).map((T) => y(T, b));
-    return c ? !$.includes(!1) : $.includes(!0);
+    const c = Object.keys(h), l = c.includes("allOf"), f = c.includes("anyOf"), v = l || f, j = (v ? h[v ? l ? "allOf" : "anyOf" : "allOf"] : [h]).map((D) => g(D, b));
+    return l ? !j.includes(!1) : j.includes(!0);
   }
   return { parseValueSchema: w };
 }
-const K = {
+const ee = {
   button: { type: "button", name: "按钮", icon: "Button" },
   "response-toolbar": { type: "response-toolbar", name: "工具栏", icon: "ButtonGroup" },
   "response-toolbar-item": { type: "response-toolbar-item", name: "按钮", icon: "Button" },
@@ -135,45 +139,47 @@ const K = {
   "page-header": { type: "page-header", name: "页头", icon: "Header" },
   "page-footer": { type: "page-footer", name: "页脚", icon: "ModalFooter" },
   "tab-toolbar": { type: "tab-toolbar", name: "标签页工具栏", icon: "TabToolbar" },
-  fieldset: { type: "fieldset", name: "分组", icon: "fieldset" }
-}, Pe = {}, ze = {};
-He();
-function ie(n, e, t = /* @__PURE__ */ new Map(), s = (u, y, w) => y, i = {}, p = (u) => u) {
-  return se[e.title] = e, we[e.title] = s, Pe[e.title] = i, ze[e.title] = p, (u = {}) => {
-    const y = qe(u, e, t), w = Object.keys(n).reduce((h, b) => (h[b] = n[b].default, h), {});
-    return Object.assign(w, y);
+  fieldset: { type: "fieldset", name: "分组", icon: "fieldset" },
+  "query-solution": { type: "query-solution", name: "筛选方案", icon: "QueryScheme" }
+}, We = {}, qe = {};
+Ue();
+function ie(o, e, t = /* @__PURE__ */ new Map(), s = (d, g, w, h) => g, i = {}, u = (d) => d) {
+  return Ce[e.title] = e, we[e.title] = s, We[e.title] = i, qe[e.title] = u, (d = {}) => {
+    const g = Ve(d, e, t), w = Object.keys(o).reduce((h, b) => (h[b] = o[b].default, h), {});
+    return Object.assign(w, g);
   };
 }
-function De(n, e) {
+function Pe(o, e) {
   return { customClass: e.class, customStyle: e.style };
 }
-function Ge(n, e) {
+function He(o, e) {
+  var s, i;
   const t = [];
-  return e == null || e.buttons.map((s) => {
-    const i = {};
-    Object.keys(s).map((p) => {
-      var u;
-      p == "appearance" ? i.class = ((u = s[p]) == null ? void 0 : u.class) || "" : i[p] = s[p];
-    }), t.push(i);
-  }), { buttons: t };
+  return e == null || e.buttons.map((u) => {
+    const d = {};
+    Object.keys(u).map((g) => {
+      var w;
+      g === "appearance" ? d.class = ((w = u[g]) == null ? void 0 : w.class) || "" : d[g] = u[g];
+    }), t.push(d);
+  }), (s = e.appearance) != null && s.class ? { buttons: t, buttonClass: (i = e.appearance) == null ? void 0 : i.class } : { buttons: t };
 }
-function Je() {
-  function n(e, t) {
-    var y;
-    const s = (y = e.toolbar) == null ? void 0 : y.buttons;
+function ze() {
+  function o(e, t) {
+    var g;
+    const s = (g = e.toolbar) == null ? void 0 : g.buttons;
     if (!s || s.length < 1)
       return null;
-    const [i, p] = t.payloads, u = s.find((w) => w.id === p);
-    return u ? u.onClick || u.click : null;
+    const [i, u] = t.payloads, d = s.find((w) => w.id === u);
+    return d ? d.onClick || d.click : null;
   }
   return {
-    resolve: n
+    resolve: o
   };
 }
-const Qe = /* @__PURE__ */ new Map([
-  ["appearance", De],
-  ["toolbar", Ge]
-]), Xe = "https://json-schema.org/draft/2020-12/schema", Ye = "https://farris-design.gitee.io/page-header.schema.json", Ze = "page-header", Ke = "A Farris Container Component", et = "object", tt = {
+const Ge = /* @__PURE__ */ new Map([
+  ["appearance", Pe],
+  ["toolbar", He]
+]), Qe = "https://json-schema.org/draft/2020-12/schema", Je = "https://farris-design.gitee.io/page-header.schema.json", Xe = "page-header", Ye = "A Farris Container Component", Ze = "object", Ke = {
   id: {
     description: "The unique identifier for a Page Header",
     type: "string"
@@ -225,12 +231,22 @@ const Qe = /* @__PURE__ */ new Map([
     description: "",
     type: "object",
     properties: {
+      appearance: {
+        description: "",
+        type: "object",
+        properties: {
+          class: {
+            type: "string",
+            default: "col-6"
+          }
+        }
+      },
       id: {
-        description: "The unique identifier for a Response Toolbar",
+        description: "",
         type: "string"
       },
       type: {
-        description: "The type string of Response Toolbar",
+        description: "",
         type: "string",
         default: "response-toolbar"
       },
@@ -281,15 +297,15 @@ const Qe = /* @__PURE__ */ new Map([
     type: "boolean",
     default: !1
   }
-}, nt = {
-  $schema: Xe,
-  $id: Ye,
-  title: Ze,
-  description: Ke,
-  type: et,
-  properties: tt
+}, et = {
+  $schema: Qe,
+  $id: Je,
+  title: Xe,
+  description: Ye,
+  type: Ze,
+  properties: Ke
 };
-function ot(n, e, t) {
+function tt(o, e, t) {
   return e.title = "标题", e;
 }
 const ae = {
@@ -321,195 +337,200 @@ const ae = {
   prePaginationDisabled: { type: Boolean, default: !0 },
   /** 向后翻页是否禁用 */
   nextPaginationDisabled: { type: Boolean, default: !1 }
-}, st = Object.assign({}, ae, {
+}, nt = Object.assign({}, ae, {
   componentId: { type: String, default: "" }
-}), pe = ie(ae, nt, Qe, ot), rt = Je(), ne = /* @__PURE__ */ U({
+}), pe = ie(ae, et, Ge, tt), ot = ze(), oe = /* @__PURE__ */ W({
   name: "FPageHeader",
   props: ae,
-  emits: ["Click", "PrePaginationClick", "NextPaginationClick"],
-  setup(n, e) {
-    const t = S(n.buttons), s = (T, B) => {
-      e.emit("Click", T, B);
+  emits: ["click", "prePaginationClick", "nextPaginationClick"],
+  setup(o, e) {
+    const t = M(o.buttons), s = (D, I) => {
+      e.emit("click", D, I);
     };
-    function i(T, B) {
-      T && B && B.split(" ").reduce((x, C) => (x[C] = !0, x), T);
+    function i(D, I) {
+      D && I && I.split(" ").reduce((k, y) => (k[y] = !0, k), D);
     }
-    const p = N(() => {
-      const T = {
+    const u = F(() => {
+      const D = {
         "f-page-header": !0
       };
-      return i(T, n.customClass), T;
-    }), u = N(() => {
-      const T = {
+      return i(D, o.customClass), D;
+    }), d = F(() => {
+      const D = {
         "f-title-icon": !0
       };
-      return i(T, n.iconClass), T;
-    }), y = N(() => {
-      const T = {
+      return i(D, o.iconClass), D;
+    }), g = F(() => {
+      const D = {
         "f-icon": !0
       };
-      return i(T, n.icon), T;
-    }), w = N(() => {
-      const T = {
+      return i(D, o.icon), D;
+    }), w = F(() => {
+      const D = {
         "f-title": !0
       };
-      return i(T, n.titleContentClass), T;
-    }), h = N(() => {
-      const T = {
+      return i(D, o.titleContentClass), D;
+    }), h = F(() => {
+      const D = {
         "f-content": !0
       };
-      return i(T, n.contentClass), T;
-    }), b = N(() => {
-      const T = {
+      return i(D, o.contentClass), D;
+    }), b = F(() => {
+      const D = {
         "f-content": !0
       };
-      return i(T, n.downContentClass), T;
-    }), l = N(() => ({
+      return i(D, o.downContentClass), D;
+    }), c = F(() => ({
       "f-icon f-icon-arrow-w": !0,
-      "f-state-disabled": n.prePaginationDisabled
-    })), c = N(() => ({
+      "f-state-disabled": o.prePaginationDisabled
+    })), l = F(() => ({
       "f-icon f-icon-arrow-e": !0,
-      "f-state-disabled": n.nextPaginationDisabled
+      "f-state-disabled": o.nextPaginationDisabled
     }));
-    function f(T) {
-      n.prePaginationDisabled || e.emit("PrePaginationClick", T);
+    function f(D) {
+      o.prePaginationDisabled || e.emit("prePaginationClick", D);
     }
-    function v(T) {
-      n.nextPaginationDisabled || e.emit("NextPaginationClick", T);
+    function v(D) {
+      o.nextPaginationDisabled || e.emit("nextPaginationClick", D);
     }
-    function k() {
-      return e.slots.titleContent ? g("div", {
+    function E() {
+      return e.slots.titleContent ? m("div", {
         class: w.value
-      }, [J(" "), e.slots.titleContent()]) : g("div", {
+      }, [X(" "), e.slots.titleContent()]) : m("div", {
         class: "f-title"
-      }, [n.showIcon && n.icon ? g("span", {
-        class: u.value
-      }, [g("i", {
-        class: y.value
-      }, null)]) : "", g("h4", {
+      }, [o.showIcon && o.icon ? m("span", {
+        class: d.value
+      }, [m("i", {
+        class: g.value
+      }, null)]) : "", m("h4", {
         class: "f-title-text"
-      }, [n.title]), n.subTitle ? g("h5", {
+      }, [o.title]), o.subTitle ? m("h5", {
         class: "f-title-subtitle"
-      }, [n.subTitle]) : "", n.showPagination ? g("div", {
+      }, [o.subTitle]) : "", o.showPagination ? m("div", {
         class: "f-title-pagination"
-      }, [g("span", {
-        class: l.value,
-        onClick: f
-      }, null), g("span", {
+      }, [m("span", {
         class: c.value,
+        onClick: f
+      }, null), m("span", {
+        class: l.value,
         onClick: v
       }, null)]) : ""]);
     }
-    function A() {
-      return e.slots.content ? g("div", {
+    function O() {
+      return e.slots.content ? m("div", {
         class: h.value
-      }, [J(" "), e.slots.content()]) : "";
+      }, [X(" "), e.slots.content()]) : "";
     }
-    function $() {
-      if (n.buttons && n.buttons.length > 0)
-        return g(Le, {
-          customClass: n.buttonClass,
+    function j() {
+      if (o.buttons && o.buttons.length > 0)
+        return m($e, {
+          customClass: o.buttonClass,
           items: t.value,
           onClick: s
         }, null);
     }
     function _() {
-      return e.slots.downContent ? g("div", {
+      return e.slots.downContent ? m("div", {
         class: b.value
-      }, [J(" "), e.slots.downContent()]) : "";
+      }, [X(" "), e.slots.downContent()]) : "";
     }
-    return q(() => n.buttons, (T) => {
-      t.value = T;
+    return z(() => o.buttons, (D) => {
+      t.value = D;
     }, {
       deep: !0
-    }), () => g("div", {
-      class: p.value
-    }, [g("nav", {
+    }), () => m("div", {
+      class: u.value
+    }, [m("nav", {
       class: "f-page-header-base"
-    }, [k(), A(), $()]), _()]);
+    }, [E(), O(), j()]), _()]);
   }
 });
-function it(n, e, t) {
-  var B;
-  function s() {
-    t != null && t.resolveComponentContext && t.resolveComponentContext();
-  }
-  s();
-  const i = t && t.getStyles && t.getStyles() || "", p = t && t.getDesignerClass && t.getDesignerClass() || "", u = S();
-  function y() {
+function st(o, e, t) {
+  var I;
+  const s = t && t.getStyles && t.getStyles() || "", i = t && t.getDesignerClass && t.getDesignerClass() || "", u = M();
+  function d() {
     return (e == null ? void 0 : e.schema.componentType) === "frame" ? !1 : t && t.checkCanMoveComponent ? t.checkCanMoveComponent() : !0;
   }
-  function w() {
+  function g() {
     return !1;
   }
-  function h() {
+  function w() {
     return (e == null ? void 0 : e.schema.componentType) === "frame" ? !1 : t && t.checkCanDeleteComponent ? t.checkCanDeleteComponent() : !0;
   }
-  function b() {
+  function h() {
     return (e == null ? void 0 : e.schema.componentType) === "frame" ? !0 : t && t.hideNestedPaddingInDesginerView ? t.hideNestedPaddingInDesginerView() : !1;
   }
-  function l(P) {
-    if (!P || !P.value)
+  function b(S) {
+    if (!S || !S.value)
       return null;
-    if (P.value.schema && P.value.schema.type === "component")
-      return P.value;
-    const x = S(P == null ? void 0 : P.value.parent), C = l(x);
-    return C || null;
+    if (S.value.schema && S.value.schema.type === "component")
+      return S.value;
+    const k = M(S == null ? void 0 : S.value.parent), y = b(k);
+    return y || null;
   }
-  function c(P = e) {
-    const { componentInstance: x, designerItemElementRef: C } = P;
-    return !x || !x.value ? null : x.value.canMove ? C : c(P.parent);
+  function c(S = e) {
+    const { componentInstance: k, designerItemElementRef: y } = S;
+    return !k || !k.value ? null : k.value.canMove ? y : c(S.parent);
   }
-  function f(P) {
-    return !!t && t.canAccepts(P);
+  function l(S) {
+    return !!t && t.canAccepts(S);
   }
-  function v() {
+  function f() {
     return (e == null ? void 0 : e.schema.label) || (e == null ? void 0 : e.schema.title) || (e == null ? void 0 : e.schema.name);
   }
-  function k() {
+  function v() {
   }
-  function A(P, x) {
-    x && t != null && t.onAcceptMovedChildElement && t.onAcceptMovedChildElement(x);
+  function E(S, k) {
+    k && t != null && t.onAcceptMovedChildElement && t.onAcceptMovedChildElement(k);
   }
-  function $(P, x) {
-    const { componentType: C } = P;
-    let I = Q(C, P, x);
-    t && t.onResolveNewComponentSchema && (I = t.onResolveNewComponentSchema(P, I));
-    const O = C.toLowerCase().replace("-", "_");
-    return I && !I.id && I.type === C && (I.id = `${O}_${Math.random().toString().slice(2, 6)}`), I;
+  function O(S, k) {
+    const { componentType: y } = S;
+    let x = Y(y, S, k);
+    t && t.onResolveNewComponentSchema && (x = t.onResolveNewComponentSchema(S, x));
+    const A = y.toLowerCase().replace(/-/g, "_");
+    return x && !x.id && x.type === y && (x.id = `${A}_${Math.random().toString().slice(2, 6)}`), x;
   }
-  function _(P) {
+  function j(S) {
   }
-  function T(...P) {
+  function _(...S) {
     if (t && t.getPropsConfig)
-      return t.getPropsConfig(...P);
+      return t.getPropsConfig(...S);
+  }
+  function D() {
+    t && t.onRemoveComponent && t.onRemoveComponent(), e != null && e.schema.contents && e.schema.contents.map((S) => {
+      var x;
+      let k = S.id;
+      S.type === "component-ref" && (k = S.component);
+      const y = o.value.querySelector(`#${k}-design-item`);
+      (x = y == null ? void 0 : y.componentInstance) != null && x.value.onRemoveComponent && y.componentInstance.value.onRemoveComponent();
+    });
   }
   return u.value = {
-    canMove: y(),
-    canSelectParent: w(),
-    canDelete: h(),
-    canNested: !b(),
+    canMove: d(),
+    canSelectParent: g(),
+    canDelete: w(),
+    canNested: !h(),
     contents: e == null ? void 0 : e.schema.contents,
-    elementRef: n,
-    parent: (B = e == null ? void 0 : e.parent) == null ? void 0 : B.componentInstance,
+    elementRef: o,
+    parent: (I = e == null ? void 0 : e.parent) == null ? void 0 : I.componentInstance,
     schema: e == null ? void 0 : e.schema,
-    styles: i,
-    designerClass: p,
-    canAccepts: f,
-    getBelongedComponentInstance: l,
+    styles: s,
+    designerClass: i,
+    canAccepts: l,
+    getBelongedComponentInstance: b,
     getDraggableDesignItemElement: c,
-    getDraggingDisplayText: v,
-    getPropConfig: T,
-    getDragScopeElement: k,
-    onAcceptMovedChildElement: A,
-    onChildElementMovedOut: _,
-    addNewChildComponentSchema: $,
-    updateDragAndDropRules: s,
-    triggerBelongedComponentToMoveWhenMoved: !!t && t.triggerBelongedComponentToMoveWhenMoved || S(!1),
-    triggerBelongedComponentToDeleteWhenDeleted: !!t && t.triggerBelongedComponentToDeleteWhenDeleted || S(!1)
+    getDraggingDisplayText: f,
+    getPropConfig: _,
+    getDragScopeElement: v,
+    onAcceptMovedChildElement: E,
+    onChildElementMovedOut: j,
+    addNewChildComponentSchema: O,
+    triggerBelongedComponentToMoveWhenMoved: !!t && t.triggerBelongedComponentToMoveWhenMoved || M(!1),
+    triggerBelongedComponentToDeleteWhenDeleted: !!t && t.triggerBelongedComponentToDeleteWhenDeleted || M(!1),
+    onRemoveComponent: D
   }, u;
 }
-class ee {
+class te {
   constructor(e, t) {
     R(this, "componentId");
     R(this, "viewModelId");
@@ -534,13 +555,14 @@ class ee {
     return (e = this.schemaService) == null ? void 0 : e.getTableInfoByViewModelId(this.viewModelId);
   }
   setDesignViewModelField(e) {
+    var s;
     const t = e.binding && e.binding.type === "Form" && e.binding.field;
     if (t) {
       if (!this.designViewModelField) {
-        const s = this.designViewModelUtils.getDgViewModel(this.viewModelId);
-        this.designViewModelField = s.fields.find((i) => i.id === t);
+        const i = this.designViewModelUtils.getDgViewModel(this.viewModelId);
+        this.designViewModelField = i.fields.find((u) => u.id === t);
       }
-      e.updateOn = this.designViewModelField.updateOn;
+      e.updateOn = (s = this.designViewModelField) == null ? void 0 : s.updateOn;
     }
   }
   changeFieldEditorType(e, t) {
@@ -564,7 +586,7 @@ class ee {
             type: "combo-list",
             textField: "name",
             valueField: "value",
-            data: [{ value: e.type, name: K[e.type].name }]
+            data: [{ value: e.type, name: ee[e.type].name }]
           }
         }
       }
@@ -600,11 +622,11 @@ class ee {
     const s = t && t.parent && t.parent.schema;
     if (!s)
       return;
-    const i = s.contents.findIndex((u) => u.id === e), p = ve(s.contents[i]);
-    s.contents.splice(i, 1), s.contents.splice(i, 0, p);
+    const i = s.contents.findIndex((d) => d.id === e), u = ye(s.contents[i]);
+    s.contents.splice(i, 1), s.contents.splice(i, 0, u);
   }
 }
-class at extends ee {
+class rt extends te {
   constructor(e, t) {
     super(e, t);
   }
@@ -630,7 +652,7 @@ class at extends ee {
             type: "combo-list",
             textField: "value",
             valueField: "key",
-            data: [{ key: "page-header", value: K["page-header"].name }]
+            data: [{ key: "page-header", value: ee["page-header"].name }]
           }
         },
         icon: {
@@ -661,12 +683,7 @@ class at extends ee {
       description: "Appearance",
       properties: {
         class: {
-          title: "class",
-          type: "string",
-          description: ""
-        },
-        style: {
-          title: "style",
+          title: "class样式",
           type: "string",
           description: ""
         }
@@ -695,15 +712,15 @@ class at extends ee {
       refreshPanelAfterChanged: !0,
       tabId: "commands",
       tabName: "交互",
-      setPropertyRelates(p, u) {
-        const y = p.propertyValue;
-        delete e[s.viewModelId], y && (y.setPropertyRelates = this.setPropertyRelates, s.eventsEditorUtils.saveRelatedParameters(e, s.viewModelId, y.events, y));
+      setPropertyRelates(u, d) {
+        const g = u.propertyValue;
+        delete e[s.viewModelId], g && (g.setPropertyRelates = this.setPropertyRelates, s.eventsEditorUtils.saveRelatedParameters(e, s.viewModelId, g.events, g));
       }
     };
   }
 }
-function lt(n, e) {
-  function t(y) {
+function it(o, e) {
+  function t(g) {
     return !1;
   }
   function s() {
@@ -712,21 +729,21 @@ function lt(n, e) {
   function i() {
     return !1;
   }
-  function p() {
+  function u() {
     return !0;
   }
-  function u(y) {
-    return new at(y, e).getPropertyConfig(n);
+  function d(g) {
+    return new rt(g, e).getPropertyConfig(o);
   }
   return {
     canAccepts: t,
-    hideNestedPaddingInDesginerView: p,
-    getPropsConfig: u,
+    hideNestedPaddingInDesginerView: u,
+    getPropsConfig: d,
     checkCanDeleteComponent: s,
     checkCanMoveComponent: i
   };
 }
-class Te {
+class Se {
   constructor(e) {
     /** 工具栏项标识 */
     R(this, "id", "");
@@ -777,7 +794,7 @@ class Te {
   }
   /** 是否可用 */
   get enable() {
-    return Object.keys(this.options).indexOf("disabled") > -1 ? !this.options.disabled : N(() => !0);
+    return Object.keys(this.options).indexOf("disabled") > -1 ? !this.options.disabled : F(() => !0);
   }
   /** 设置宽度 */
   setWidth(e) {
@@ -788,20 +805,20 @@ class Te {
     return this.visible ? this.width : !1;
   }
 }
-class ct extends Te {
+class at extends Se {
   constructor(e) {
     super(e);
   }
 }
-function Se() {
-  function n(e) {
+function Te() {
+  function o(e) {
     const t = [];
-    return e.reduce((s, i) => (i.children && i.children.length > 0 ? s.push(new z(i)) : s.push(new ct(i)), s), t), t;
+    return e.reduce((s, i) => (i.children && i.children.length > 0 ? s.push(new Q(i)) : s.push(new at(i)), s), t), t;
   }
-  return { buildResponseToolbarItems: n };
+  return { buildResponseToolbarItems: o };
 }
-const { buildResponseToolbarItems: dt } = Se();
-class z extends Te {
+const { buildResponseToolbarItems: ct } = Te();
+class Q extends Se {
   constructor(t) {
     super(t);
     R(this, "placement", "");
@@ -817,22 +834,23 @@ class z extends Te {
     const s = ["isDP", "class", "dropdownClass", "menuClass", "placement", "split", "expanded"];
     Object.keys(t).filter((i) => s.indexOf(i) > -1).forEach((i) => {
       this[i] = t[i];
-    }), t.children && t.children.length && (this.children = dt(t.children));
+    }), t.children && t.children.length && (this.children = ct(t.children));
   }
 }
-const ut = /* @__PURE__ */ new Map([
+const lt = /* @__PURE__ */ new Map([
   ["buttons", "items"],
-  ["appearance", De]
-]), pt = /* @__PURE__ */ new Map([
-  ["appearance", ft]
+  ["appearance", Pe]
 ]);
-function ft(n, e) {
+function dt(o, e) {
   return { class: e.class, style: e.style };
 }
-function ke(n, e, t) {
+const ut = /* @__PURE__ */ new Map([
+  ["appearance", dt]
+]);
+function De(o, e, t) {
   return e;
 }
-const gt = "https://json-schema.org/draft/2020-12/schema", mt = "https://farris-design.gitee.io/response-toolbar.schema.json", ht = "response-toolbar", bt = "A Farris Toolbar Component", yt = "object", vt = {
+const pt = "https://json-schema.org/draft/2020-12/schema", ft = "https://farris-design.gitee.io/response-toolbar.schema.json", mt = "response-toolbar", gt = "A Farris Toolbar Component", ht = "object", bt = {
   id: {
     description: "The unique identifier for a Response Toolbar",
     type: "string"
@@ -847,10 +865,10 @@ const gt = "https://json-schema.org/draft/2020-12/schema", mt = "https://farris-
     type: "object",
     properties: {
       class: {
-        type: "string"
+        type: "string",
+        default: ""
       }
-    },
-    default: {}
+    }
   },
   alignment: {
     description: "The alignment of Response Toolbar Button.",
@@ -862,19 +880,19 @@ const gt = "https://json-schema.org/draft/2020-12/schema", mt = "https://farris-
     type: "array",
     default: []
   }
-}, Ct = [
+}, yt = [
   "id",
   "type",
   "buttons"
-], wt = {
-  $schema: gt,
-  $id: mt,
-  title: ht,
-  description: bt,
-  type: yt,
-  properties: vt,
-  required: Ct
-}, Pt = "https://json-schema.org/draft/2020-12/schema", Dt = "https://farris-design.gitee.io/response-toolbar-item.schema.json", Tt = "response-toolbar-item", St = "A Farris Toolbar Item Component", kt = "object", Mt = {
+], vt = {
+  $schema: pt,
+  $id: ft,
+  title: mt,
+  description: gt,
+  type: ht,
+  properties: bt,
+  required: yt
+}, Ct = "https://json-schema.org/draft/2020-12/schema", wt = "https://farris-design.gitee.io/response-toolbar-item.schema.json", Pt = "response-toolbar-item", St = "A Farris Toolbar Item Component", Tt = "object", Dt = {
   id: {
     description: "The unique identifier for a Response Toolbar",
     type: "string"
@@ -892,8 +910,7 @@ const gt = "https://json-schema.org/draft/2020-12/schema", mt = "https://farris-
         type: "string",
         default: "btn-secondary"
       }
-    },
-    default: {}
+    }
   },
   alignment: {
     description: "对齐",
@@ -920,57 +937,19 @@ const gt = "https://json-schema.org/draft/2020-12/schema", mt = "https://farris-
     type: "string",
     default: ""
   }
-}, xt = [
+}, Mt = [
   "id",
   "type",
   "text"
-], oe = {
-  $schema: Pt,
-  $id: Dt,
-  title: Tt,
+], kt = {
+  $schema: Ct,
+  $id: wt,
+  title: Pt,
   description: St,
-  type: kt,
-  properties: Mt,
-  required: xt
-}, Et = "response-toolbar-item", Bt = "A Farris Container Component", It = "object", Rt = {
-  basic: {
-    title: "基本信息",
-    description: "Basic Infomation",
-    properties: {
-      id: {
-        title: "标识",
-        type: "string",
-        description: "The identifier of a component.",
-        readonly: !0
-      },
-      type: {
-        title: "类型",
-        type: "enum",
-        description: "The type of a component.",
-        editor: {
-          type: "combo-list",
-          data: []
-        }
-      },
-      text: {
-        title: "文本",
-        type: "string",
-        description: "",
-        refreshPanelAfterChanged: !0
-      },
-      icon: {
-        title: "图标",
-        type: "string",
-        description: ""
-      }
-    }
-  }
-}, fe = {
-  title: Et,
-  description: Bt,
-  type: It,
-  categories: Rt
-}, le = {
+  type: Tt,
+  properties: Dt,
+  required: Mt
+}, ce = {
   /**  组件自定义样式 */
   customClass: { type: String, default: "" },
   alignment: { Type: String, default: "right" },
@@ -978,16 +957,13 @@ const gt = "https://json-schema.org/draft/2020-12/schema", mt = "https://farris-
     Type: Array,
     default: []
   }
-};
-se[oe.title] = oe;
-Pe[fe.title] = fe;
-const At = Object.assign({}, le, {
+}, Et = Object.assign({}, ce, {
   componentId: { type: String, default: "" }
-}), ce = ie(
-  le,
-  wt,
-  ut,
-  ke
+}), le = ie(
+  ce,
+  vt,
+  lt,
+  De
 ), Me = {
   id: { type: String, default: "" },
   items: { type: Object, default: {} },
@@ -997,183 +973,183 @@ const At = Object.assign({}, le, {
   icon: { type: String, default: "" },
   componentId: { type: String, default: "" },
   alignment: { Type: String, default: "right" }
-}, Ot = ie(
+}, xt = ie(
   Me,
-  oe,
-  pt,
-  ke
+  kt,
+  ut,
+  De
 );
-function xe() {
-  function n(t) {
+function ke() {
+  function o(t) {
     const s = {
       "f-icon": !0
     };
     if (t.icon) {
       const i = t.icon.trim().split(" ");
-      i && i.length && i.reduce((p, u) => (p[u] = !0, p), s);
+      i && i.length && i.reduce((u, d) => (u[d] = !0, u), s);
     }
     return s;
   }
   function e(t) {
     return !!(t.icon && t.icon.trim());
   }
-  return { iconClass: n, shouldShowIcon: e };
+  return { iconClass: o, shouldShowIcon: e };
 }
-function jt(n) {
-  function e(l) {
-    const c = {
+function Bt(o) {
+  function e(c) {
+    const l = {
       "dropdown-menu": !0
     };
-    if (l.class) {
-      const f = l.menuClass.split(" ");
-      f && f.length && f.reduce((v, k) => (v[k] = !0, v), c);
+    if (c.class) {
+      const f = c.menuClass.split(" ");
+      f && f.length && f.reduce((v, E) => (v[E] = !0, v), l);
     }
-    return c;
+    return l;
   }
-  function t(l) {
-    const c = {
-      disabled: !l.enable,
+  function t(c) {
+    const l = {
+      disabled: !c.enable,
       "dropdown-submenu": !0,
       "f-rt-dropdown": !0
-    }, f = l.dropdownClass.split(" ");
-    return f && f.length && f.reduce((v, k) => (v[k] = !0, v), c), c;
+    }, f = c.dropdownClass.split(" ");
+    return f && f.length && f.reduce((v, E) => (v[E] = !0, v), l), l;
   }
-  function s(l) {
-    const c = {
-      disabled: !l.enable,
+  function s(c) {
+    const l = {
+      disabled: !c.enable,
       "dropdown-item": !0,
       "f-rt-btn": !0
-    }, f = l.class.split(" ");
-    return f && f.length && f.reduce((v, k) => (v[k] = !0, v), c), c;
+    }, f = c.class.split(" ");
+    return f && f.length && f.reduce((v, E) => (v[E] = !0, v), l), l;
   }
   let i;
-  const p = /* @__PURE__ */ new Map();
-  function u(l, c, f) {
-    var k;
-    ((k = l.target) == null ? void 0 : k.id) === c.id && l.stopPropagation();
+  const u = /* @__PURE__ */ new Map();
+  function d(c, l, f) {
+    var E;
+    ((E = c.target) == null ? void 0 : E.id) === l.id && c.stopPropagation();
     const v = f ? f.id : "__top_item__";
-    if (c.children && c.children.length && (c.expanded = !c.expanded, c.expanded ? p.set(v, c) : p.delete(v)), p.has(v) && p.get(v) !== c) {
-      const A = p.get(v);
-      A && (A.expanded = !1);
+    if (l.children && l.children.length && (l.expanded = !l.expanded, l.expanded ? u.set(v, l) : u.delete(v)), u.has(v) && u.get(v) !== l) {
+      const O = u.get(v);
+      O && (O.expanded = !1);
     }
   }
-  function y(l, c) {
-    document.body.click(), c.enable && c.onClick(l, c.id);
-  }
-  function w(l) {
-    return l.children.map((c) => c.children && c.children.length ? g("li", {
-      class: t(c),
-      id: c.id,
-      onClick: (f) => c.enable && u(f, c, l)
-    }, [g("span", {
-      id: c.id,
-      class: s(c),
-      onMouseover: (f) => c.enable && u(f, c, l)
-    }, [c.text, g("i", {
+  function g(c, l) {
+    document.body.click(), l.enable && l.onClick(c, l.id);
+  }
+  function w(c) {
+    return c.children.map((l) => l.children && l.children.length ? m("li", {
+      class: t(l),
+      id: l.id,
+      onClick: (f) => l.enable && d(f, l, c)
+    }, [m("span", {
+      id: l.id,
+      class: s(l),
+      onMouseover: (f) => l.enable && d(f, l, c)
+    }, [l.text, m("i", {
       class: "f-icon f-icon-arrow-chevron-right",
       style: "display: inline-block;float: right;line-height: 1.25rem;"
-    }, null)]), i(c, c)]) : g("li", {
-      class: s(c),
-      id: c.id,
-      onClick: (f) => y(f, c),
-      onMouseover: (f) => c.enable && u(f, c, l)
-    }, [n.shouldShowIcon(c) && g("i", {
-      class: n.iconClass(c)
-    }, null), c.text]));
-  }
-  function h(l, c, f) {
+    }, null)]), i(l, l)]) : m("li", {
+      class: s(l),
+      id: l.id,
+      onClick: (f) => g(f, l),
+      onMouseover: (f) => l.enable && d(f, l, c)
+    }, [o.shouldShowIcon(l) && m("i", {
+      class: o.iconClass(l)
+    }, null), l.text]));
+  }
+  function h(c, l, f) {
     const v = {
-      display: l.expanded ? "block" : "none",
+      display: c.expanded ? "block" : "none",
       position: "fixed",
       maxWidth: "300px",
       width: "auto",
       minWidth: "120px"
-    }, k = document.getElementsByTagName("body")[0].getClientRects()[0].width, A = c, $ = A == null ? void 0 : A.getClientRects();
-    if (A && $ && $.length) {
+    }, E = document.getElementsByTagName("body")[0].getClientRects()[0].width, O = l, j = O == null ? void 0 : O.getClientRects();
+    if (O && j && j.length) {
       const {
         top: _,
-        width: T,
-        left: B,
-        right: P,
-        height: x
-      } = $[0], C = Math.ceil(x + _);
-      v.top = `${C}px`, v.left = `${B}px`;
-      const I = l.id + "_menu", O = c ? c.querySelector("#" + I) : null;
-      if (O) {
-        v.display === "block" && (O.style.display = "block");
-        const d = O.getBoundingClientRect();
+        width: D,
+        left: I,
+        right: S,
+        height: k
+      } = j[0], y = Math.ceil(k + _);
+      v.top = `${y}px`, v.left = `${I}px`;
+      const x = c.id + "_menu", A = l ? l.querySelector("#" + x) : null;
+      if (A) {
+        v.display === "block" && (A.style.display = "block");
+        const C = A.getBoundingClientRect();
         if (f) {
           v.top = `${_ - 6}px`;
-          const r = Math.ceil(T + B);
+          const r = Math.ceil(D + I);
           v.left = `${r}px`;
         }
-        k - B - T < d.width && (v.left = `${(f ? B : P) - d.width}px`);
+        E - I - D < C.width && (v.left = `${(f ? I : S) - C.width}px`);
       }
     }
     return v;
   }
-  i = function(l, c) {
-    var A, $;
-    const f = be(), v = c ? c.id : l.id, k = ($ = (A = f == null ? void 0 : f.exposed) == null ? void 0 : A.elementRef.value) == null ? void 0 : $.querySelector("#" + v);
-    return g("ul", {
-      class: e(l),
-      style: h(l, k, c),
-      id: l.id + "_menu"
-    }, [w(l)]);
+  i = function(c, l) {
+    var O, j;
+    const f = he(), v = l ? l.id : c.id, E = (j = (O = f == null ? void 0 : f.exposed) == null ? void 0 : O.elementRef.value) == null ? void 0 : j.querySelector("#" + v);
+    return m("ul", {
+      class: e(c),
+      style: h(c, E, l),
+      id: c.id + "_menu"
+    }, [w(c)]);
   };
   function b() {
-    p.forEach((l) => {
-      l.expanded = !1;
-    }), p.clear();
+    u.forEach((c) => {
+      c.expanded = !1;
+    }), u.clear();
   }
   return {
     renderDropdownMenu: i,
     clearAllDropDownMenu: b
   };
 }
-function $t(n, e) {
-  const t = S(n.alignment), {
+function Rt(o, e) {
+  const t = M(o.alignment), {
     renderDropdownMenu: s,
     clearAllDropDownMenu: i
-  } = jt(e);
-  function p(b) {
-    const l = {
+  } = Bt(e);
+  function u(b) {
+    const c = {
       "btn-group": !0,
       "f-rt-dropdown": !0,
       "f-btn-ml": t.value === "right",
       "f-btn-mr": t.value === "left"
-    }, c = b.dropdownClass.split(" ");
-    return c && c.length && c.reduce((f, v) => (f[v] = !0, f), l), l;
+    }, l = b.dropdownClass.split(" ");
+    return l && l.length && l.reduce((f, v) => (f[v] = !0, f), c), c;
   }
-  function u(b) {
-    const l = {
+  function d(b) {
+    const c = {
       btn: !0,
       disabled: !b.enable,
       "f-rt-btn": !0,
       "btn-icontext": !!(b.icon && b.icon.trim())
     };
     if (b.class) {
-      const c = b.class.split(" ");
-      c && c.length && c.reduce((f, v) => (f[v] = !0, f), l);
+      const l = b.class.split(" ");
+      l && l.length && l.reduce((f, v) => (f[v] = !0, f), c);
     }
-    return l;
+    return c;
   }
-  function y(b, l) {
+  function g(b, c) {
     b.stopPropagation();
-    const c = l.expanded;
-    document.body.click(), l.expanded = !c;
+    const l = c.expanded;
+    document.body.click(), c.expanded = !l;
   }
   function w(b) {
-    return g("div", {
+    return m("div", {
       id: b.id,
-      class: p(b)
-    }, [g("div", {
-      class: u(b),
+      class: u(b)
+    }, [m("div", {
+      class: d(b),
       style: "display: flex;padding-right: 0.1rem;border-top-right-radius: 6px;border-bottom-right-radius: 6px",
-      onClick: (l) => b.enable && y(l, b)
-    }, [e.shouldShowIcon(b) && g("i", {
+      onClick: (c) => b.enable && g(c, b)
+    }, [e.shouldShowIcon(b) && m("i", {
       class: e.iconClass(b)
-    }, null), g("span", null, [b.text]), g("i", {
+    }, null), m("span", null, [b.text]), m("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)]), s(b)]);
@@ -1187,553 +1163,567 @@ function $t(n, e) {
   };
 }
 const {
-  buildResponseToolbarItems: ge
-} = Se(), Z = /* @__PURE__ */ U({
+  buildResponseToolbarItems: fe
+} = Te(), K = /* @__PURE__ */ W({
   name: "FResponseToolbar",
-  props: le,
+  props: ce,
   emits: ["click"],
-  setup(n, e) {
-    const t = S(ge(n.items)), s = S(), i = S(), p = S(), u = S(n.alignment), y = {
+  setup(o, e) {
+    const t = M(fe(o.items)), s = M(), i = M(), u = M(), d = M(o.alignment), g = {
       id: "__more_buttons__",
       text: "更多"
-    }, w = S(new z(y)), h = xe(), b = N(() => w.value.children.length > 0), l = N(() => Y({
+    }, w = M(new Q(g)), h = ke(), b = F(() => w.value.children.length > 0), c = F(() => Z({
       "f-toolbar": !0,
       "f-response-toolbar": !0,
       "position-relative": !0
-    }, n.customClass)), c = N(() => ({
+    }, o.customClass)), l = F(() => ({
       "w-100": !0,
       "d-flex": !0,
       "flex-nowrap": !0,
-      "justify-content-end": u.value === "right",
-      "justify-content-start": u.value === "left"
+      "justify-content-end": d.value === "right",
+      "justify-content-start": d.value === "left"
     })), {
       renderToolbarDropdown: f,
       clearAllDropDown: v
-    } = $t(n, h);
-    function k() {
-      t.value.filter((C) => C.children && C.children.length > 0).forEach((C) => {
-        C.expanded = !1;
+    } = Rt(o, h);
+    function E() {
+      t.value.filter((y) => y.children && y.children.length > 0).forEach((y) => {
+        y.expanded = !1;
       }), w.value.expanded = !1, v();
     }
-    function A(C) {
-      const I = {
+    function O(y) {
+      const x = {
         btn: !0,
         "f-rt-btn": !0,
-        "f-btn-ml": u.value === "right",
-        "f-btn-mr": u.value === "left",
-        "btn-icontext": !!(C.icon && C.icon.trim())
+        "f-btn-ml": d.value === "right",
+        "f-btn-mr": d.value === "left",
+        "btn-icontext": !!(y.icon && y.icon.trim())
       };
-      if (C.class) {
-        const O = C.class.split(" ");
-        O && O.length && O.reduce((d, r) => (d[r] = !0, d), I);
+      if (y.class) {
+        const A = y.class.split(" ");
+        A && A.length && A.reduce((C, r) => (C[r] = !0, C), x);
       }
-      return I;
+      return x;
     }
-    function $(C, I) {
-      document.body.click(), typeof I.onClick == "function" && I.onClick(C, I.id), e.emit("click", C, I.id);
+    function j(y, x) {
+      document.body.click(), typeof x.onClick == "function" && x.onClick(y, x.id), e.emit("click", y, x.id);
     }
-    function _(C) {
-      return g("button", {
+    function _(y) {
+      return m("button", {
         type: "button",
-        class: A(C),
-        id: C.id,
-        disabled: !C.enable,
-        onClick: (I) => $(I, C)
-      }, [h.shouldShowIcon(C) && g("i", {
-        class: h.iconClass(C)
-      }, null), C.text]);
+        class: O(y),
+        id: y.id,
+        disabled: !y.enable,
+        onClick: (x) => j(x, y)
+      }, [h.shouldShowIcon(y) && m("i", {
+        class: h.iconClass(y)
+      }, null), y.text]);
     }
-    const T = /* @__PURE__ */ new Map(), B = [];
-    function P(C) {
-      const I = p.value;
-      let O = C;
-      const d = Array.from(I.children), r = d[d.length - 1].id === "__more_buttons__" ? d[d.length - 1] : null;
+    const D = /* @__PURE__ */ new Map(), I = [];
+    function S(y) {
+      const x = u.value;
+      let A = y;
+      const C = Array.from(x.children), r = C[C.length - 1].id === "__more_buttons__" ? C[C.length - 1] : null;
       if (r) {
-        const D = r.computedStyleMap().get("margin-left"), E = r.computedStyleMap().get("margin-right"), L = (D ? D.value : 0) + r.getBoundingClientRect().width + (E ? E.value : 0);
-        O -= L;
+        const P = r.computedStyleMap().get("margin-left"), B = r.computedStyleMap().get("margin-right"), N = (P ? P.value : 0) + r.getBoundingClientRect().width + (B ? B.value : 0);
+        A -= N;
       }
-      const o = d.filter((D) => D.id !== "__more_buttons__");
-      for (const D of o) {
-        const E = D.computedStyleMap().get("margin-left"), L = D.computedStyleMap().get("margin-right"), j = (E ? E.value : 0) + D.getBoundingClientRect().width + (L ? L.value : 0);
-        O < j ? (T.set(D.id, !0), B.push({
-          id: D.id,
-          width: j
-        })) : O -= j;
+      const n = C.filter((P) => P.id !== "__more_buttons__");
+      for (const P of n) {
+        const B = P.computedStyleMap().get("margin-left"), N = P.computedStyleMap().get("margin-right"), U = (B ? B.value : 0) + P.getBoundingClientRect().width + (N ? N.value : 0);
+        A < U ? (D.set(P.id, !0), I.push({
+          id: P.id,
+          width: U
+        })) : A -= U;
       }
-      if (B.length)
-        for (let D = B.length - 1; D >= 0; D--) {
-          const E = B[D].width;
-          if (O >= E)
-            O -= E, T.delete(B[D].id), B.pop();
+      if (I.length)
+        for (let P = I.length - 1; P >= 0; P--) {
+          const B = I[P].width;
+          if (A >= B)
+            A -= B, D.delete(I[P].id), I.pop();
           else
             break;
         }
       const a = Object.assign({}, w.value);
       a.children = [];
-      const m = new z(a), M = t.value.reduce((D, E) => (T.has(E.id) && m.children.push(E), E.visible = !T.has(E.id), D.push(E), D), []);
-      w.value = m, t.value = M;
+      const p = new Q(a), T = t.value.reduce((P, B) => (D.has(B.id) && p.children.push(B), B.visible = !D.has(B.id), P.push(B), P), []);
+      w.value = p, t.value = T;
     }
-    const x = new ResizeObserver((C) => {
-      if (C.length) {
-        const O = C[0].contentRect.width, r = p.value.getBoundingClientRect().width;
-        (O < r || B.length) && (P(O), k());
+    const k = new ResizeObserver((y) => {
+      if (y.length) {
+        const A = y[0].contentRect.width, r = u.value.getBoundingClientRect().width;
+        (A < r || I.length) && (S(A), E());
       }
     });
-    return H(() => {
-      const C = i.value;
-      x.observe(C), document.body.addEventListener("click", k), document.body.addEventListener("wheel", k);
-    }), ye(() => {
-      x.disconnect(), document.body.removeEventListener("click", k), document.body.removeEventListener("wheel", k);
-    }), q(() => n.items, () => {
-      t.value = ge(n.items);
+    return G(() => {
+      const y = i.value;
+      k.observe(y), document.body.addEventListener("click", E), document.body.addEventListener("wheel", E);
+    }), be(() => {
+      k.disconnect(), document.body.removeEventListener("click", E), document.body.removeEventListener("wheel", E);
+    }), z(() => o.items, () => {
+      t.value = fe(o.items);
     }, {
       deep: !0
     }), e.expose({
       elementRef: s
-    }), () => g("div", {
-      class: l.value,
+    }), () => m("div", {
+      class: c.value,
       ref: s
-    }, [g("div", {
+    }, [m("div", {
       ref: i,
-      class: c.value
-    }, [g("div", {
-      ref: p,
+      class: l.value
+    }, [m("div", {
+      ref: u,
       class: "d-inline-block f-response-content",
       style: "white-space: nowrap;"
-    }, [t.value.filter((C) => C.visible).map((C) => C.children && C.children.length > 0 ? f(C) : _(C)), b.value && f(w.value)])])]);
+    }, [t.value.filter((y) => y.visible).map((y) => y.children && y.children.length > 0 ? f(y) : _(y)), b.value && f(w.value)])])]);
   }
 });
-function _t(n, e) {
+function It(o, e) {
   const t = V("design-item-context"), s = V("toolbar-item-handler", () => {
   });
   function i() {
     s && s();
   }
-  function p(r) {
-    const o = {
+  function u(r) {
+    const n = {
       "dropdown-menu": !0
     };
     if (r.class) {
       const a = r.menuClass.split(" ");
-      a && a.length && a.reduce((m, M) => (m[M] = !0, m), o);
+      a && a.length && a.reduce((p, T) => (p[T] = !0, p), n);
     }
-    return o;
+    return n;
   }
-  function u(r) {
-    const o = {
+  function d(r) {
+    const n = {
       disabled: !r.enable,
       "dropdown-submenu": !0,
       "f-rt-dropdown": !0
     }, a = r.dropdownClass.split(" ");
-    return a && a.length && a.reduce((m, M) => (m[M] = !0, m), o), o;
+    return a && a.length && a.reduce((p, T) => (p[T] = !0, p), n), n;
   }
-  function y(r) {
-    const o = {
+  function g(r) {
+    const n = {
       disabled: !r.enable,
       "dropdown-item": !0,
       "f-rt-btn": !0,
       "position-relative": !0,
       "farris-component": !0
     }, a = r.class.split(" ");
-    return a && a.length && a.reduce((m, M) => (m[M] = !0, m), o), o;
+    return a && a.length && a.reduce((p, T) => (p[T] = !0, p), n), n;
   }
   let w;
   const h = /* @__PURE__ */ new Map();
-  function b(r, o, a) {
-    var M;
-    ((M = r.target) == null ? void 0 : M.id) === o.id && r.stopPropagation();
-    const m = a ? a.id : "__top_item__";
-    if (o.children && o.children.length && (o.expanded = !o.expanded, o.expanded ? h.set(m, o) : h.delete(m)), h.has(m) && h.get(m) !== o) {
-      const D = h.get(m);
-      D && (D.expanded = !1);
+  function b(r, n, a) {
+    var T;
+    ((T = r.target) == null ? void 0 : T.id) === n.id && r.stopPropagation();
+    const p = a ? a.id : "__top_item__";
+    if (n.children && n.children.length && (n.expanded = !n.expanded, n.expanded ? h.set(p, n) : h.delete(p)), h.has(p) && h.get(p) !== n) {
+      const P = h.get(p);
+      P && (P.expanded = !1);
     }
   }
-  function l(r) {
+  function c(r) {
     r && (r.stopPropagation(), r.preventDefault());
   }
-  function c() {
-    Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((o) => o.classList.remove("dgComponentFocused"));
+  function l() {
+    Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((n) => n.classList.remove("dgComponentFocused"));
     const r = document.getElementsByClassName("dgComponentSelected");
-    Array.from(r).forEach((o) => o.classList.remove("dgComponentSelected"));
+    Array.from(r).forEach((n) => n.classList.remove("dgComponentSelected"));
   }
   function f(r) {
     r.currentTarget.classList.add("dgComponentFocused", "dgComponentSelected");
   }
   function v(r) {
     const {
-      buttons: o = []
+      buttons: n = []
     } = t.schema;
     let a = [];
-    o.forEach((D) => {
-      a = a.concat(D.children || []);
+    n.forEach((P) => {
+      a = a.concat(P.children || []);
     });
-    const m = a.findIndex((D) => D.id === r), M = m === -1 ? null : a[m];
+    const p = a.findIndex((P) => P.id === r), T = p === -1 ? null : a[p];
     return {
-      index: m,
-      item: M
+      index: p,
+      item: T
     };
   }
-  function k(r) {
+  function E(r) {
     const {
-      buttons: o = []
-    } = t.schema, a = o.findIndex((M) => M.id === r), m = a === -1 ? null : o[a];
+      buttons: n = []
+    } = t.schema, a = n.findIndex((T) => T.id === r), p = a === -1 ? null : n[a];
     return {
       index: a,
-      item: m
+      item: p
     };
   }
-  function A(r) {
-    var m;
+  function O(r) {
+    var p;
     t.schema;
     const {
-      index: o,
+      index: n,
       item: a
     } = v(r);
-    (m = t == null ? void 0 : t.setupContext) == null || m.emit("selectionChange", a == null ? void 0 : a.type, a);
+    (p = t == null ? void 0 : t.setupContext) == null || p.emit("selectionChange", a == null ? void 0 : a.type, a);
   }
-  const $ = function(r) {
+  const j = function(r) {
     const {
-      componentType: o
-    } = r, a = Q(o, r), m = o.toLowerCase().replace("-", "_");
-    return a && !a.id && a.type === o && (a.id = `${m}_${Math.random().toString().slice(2, 6)}`), a;
+      componentType: n
+    } = r, a = Y(n, r), p = n.toLowerCase().replace("-", "_");
+    return a && !a.id && a.type === n && (a.id = `${p}_${Math.random().toString().slice(2, 6)}`), a;
   }, _ = function() {
     const r = {
       componentType: "response-toolbar-item",
       parentComponentInstance: e.value,
       targetPosition: -1
     };
-    return $(r);
+    return j(r);
   };
-  function T(r, o) {
-    l(r), c(), f(r), A(o.id);
+  function D(r, n) {
+    c(r), l(), f(r), O(n.id);
   }
-  function B(r, o, a) {
-    l(r);
-    const m = o.id, M = a && a.id, {
-      buttons: D = []
+  function I(r, n, a) {
+    c(r);
+    const p = n.id, T = a && a.id, {
+      buttons: P = []
     } = t.schema;
-    if (!M)
+    if (!T)
       return;
     const {
-      index: E
-    } = k(M);
-    if (E === -1)
+      index: B
+    } = E(T);
+    if (B === -1)
       return;
     const {
-      index: L
-    } = v(m);
-    L !== -1 && (D[E].children.splice(L, 1), i());
-  }
-  function P(r, o, a) {
-    l(r);
-    const m = a && a.id, {
-      buttons: M = []
+      index: N
+    } = v(p);
+    N !== -1 && (P[B].children.splice(N, 1), i());
+  }
+  function S(r, n, a) {
+    c(r);
+    const p = a && a.id, {
+      buttons: T = []
     } = t.schema;
-    if (!m)
+    if (!p)
       return;
     const {
-      index: D
-    } = k(m);
-    if (D === -1)
+      index: P
+    } = E(p);
+    if (P === -1)
       return;
-    const E = _(), L = Object.assign({}, E, {
-      text: o.text
+    const B = _(), N = Object.assign({}, B, {
+      text: n.text
     });
-    M[D].children.push(L), i();
+    T[P].children.push(N), i();
   }
-  function x(r, o, a) {
-    l(r);
-    const m = a && a.id, {
-      buttons: M = []
+  function k(r, n, a) {
+    c(r);
+    const p = a && a.id, {
+      buttons: T = []
     } = t.schema;
-    if (!m)
+    if (!p)
       return;
     const {
-      index: D
-    } = k(m);
-    if (D === -1)
+      index: P
+    } = E(p);
+    if (P === -1)
       return;
-    const E = _(), L = Object.assign({}, E, {
+    const B = _(), N = Object.assign({}, B, {
       text: "按钮"
     });
-    M[D].children.push(L), i();
+    T[P].children.push(N), i();
   }
-  function C(r, o) {
-    return g("div", {
+  function y(r, n) {
+    return m("div", {
       class: "component-btn-group"
-    }, [g("div", null, [g("div", {
+    }, [m("div", null, [m("div", {
       role: "button",
       class: "btn component-settings-button",
       title: "删除",
       ref: "removeButton",
       style: "position:static;",
-      onClick: (a) => B(a, r, o)
-    }, [g("i", {
+      onClick: (a) => I(a, r, n)
+    }, [m("i", {
       class: "f-icon f-icon-yxs_delete"
-    }, null)]), g("div", {
+    }, null)]), m("div", {
       role: "button",
       class: "btn component-settings-button",
       title: "复制",
       ref: "copyButton",
       style: "position:static;",
-      onClick: (a) => P(a, r, o)
-    }, [g("i", {
+      onClick: (a) => S(a, r, n)
+    }, [m("i", {
       class: "f-icon f-icon-yxs_copy"
-    }, null)]), g("div", {
+    }, null)]), m("div", {
       role: "button",
       class: "btn component-settings-button",
       title: "新增同级",
       ref: "appendSame",
       style: "width:85px!important;padding:0 5px;position:static;",
-      onClick: (a) => x(a, r, o)
-    }, [g("i", {
+      onClick: (a) => k(a, r, n)
+    }, [m("i", {
       class: "f-icon f-icon-plus-circle text-white mr-1"
-    }, null), g("span", {
+    }, null), m("span", {
       style: "font-size:13px;margin:auto"
-    }, [J("新增同级")])])])]);
-  }
-  function I(r) {
-    return r.children.map((o) => o.children && o.children.length ? g("li", {
-      class: u(o),
-      id: o.id,
-      onClick: (a) => o.enable && b(a, o, r)
-    }, [g("span", {
-      id: o.id,
-      class: y(o),
-      onMouseover: (a) => o.enable && b(a, o, r)
-    }, [o.text, g("i", {
+    }, [X("新增同级")])])])]);
+  }
+  function x(r) {
+    return r.children.map((n) => n.children && n.children.length ? m("li", {
+      class: d(n),
+      id: n.id,
+      onClick: (a) => n.enable && b(a, n, r)
+    }, [m("span", {
+      id: n.id,
+      class: g(n),
+      onMouseover: (a) => n.enable && b(a, n, r)
+    }, [n.text, m("i", {
       class: "f-icon f-icon-arrow-chevron-right",
       style: "display: inline-block;float: right;line-height: 1.25rem;"
-    }, null)]), w(o, o)]) : g("li", {
-      class: y(o),
-      id: o.id,
-      onClick: (a) => T(a, o)
-    }, [C(o, r), n.shouldShowIcon(o) && g("i", {
-      class: n.iconClass(o)
-    }, null), o.text]));
-  }
-  function O(r, o, a) {
-    const m = {
+    }, null)]), w(n, n)]) : m("li", {
+      class: g(n),
+      id: n.id,
+      onClick: (a) => D(a, n)
+    }, [y(n, r), o.shouldShowIcon(n) && m("i", {
+      class: o.iconClass(n)
+    }, null), n.text]));
+  }
+  function A(r, n, a) {
+    const p = {
       display: r.expanded ? "block" : "none",
       position: "fixed",
       maxWidth: "300px",
       width: "auto",
       minWidth: "120px"
-    }, M = document.getElementsByTagName("body")[0].getClientRects()[0].width, D = o, E = D == null ? void 0 : D.getClientRects();
-    if (D && E && E.length) {
+    }, T = document.getElementsByTagName("body")[0].getClientRects()[0].width, P = n, B = P == null ? void 0 : P.getClientRects();
+    if (P && B && B.length) {
       const {
-        top: L,
-        width: j,
-        left: F,
-        right: W,
-        height: G
-      } = E[0], Re = Math.ceil(G + L);
-      m.top = `${Re}px`, m.left = `${F}px`;
-      const Ae = r.id + "_menu", te = o ? o.querySelector("#" + Ae) : null;
-      if (te) {
-        m.display === "block" && (te.style.display = "block");
-        const de = te.getBoundingClientRect();
+        top: N,
+        width: U,
+        left: q,
+        right: $,
+        height: L
+      } = B[0], H = Math.ceil(L + N);
+      p.top = `${H}px`, p.left = `${q}px`;
+      const J = r.id + "_menu", ne = n ? n.querySelector("#" + J) : null;
+      if (ne) {
+        p.display === "block" && (ne.style.display = "block");
+        const de = ne.getBoundingClientRect();
         if (a) {
-          m.top = `${L - 6}px`;
-          const Oe = Math.ceil(j + F);
-          m.left = `${Oe}px`;
+          p.top = `${N - 6}px`;
+          const Re = Math.ceil(U + q);
+          p.left = `${Re}px`;
         }
-        M - F - j < de.width && (m.left = `${(a ? F : W) - de.width}px`);
+        T - q - U < de.width && (p.left = `${(a ? q : $) - de.width}px`);
       }
     }
-    return m;
-  }
-  w = function(r, o) {
-    var D, E;
-    const a = be(), m = o ? o.id : r.id, M = (E = (D = a == null ? void 0 : a.exposed) == null ? void 0 : D.elementRef.value) == null ? void 0 : E.querySelector("#" + m);
-    return g("ul", {
-      class: p(r),
-      style: O(r, M, o),
+    return p;
+  }
+  w = function(r, n) {
+    var P, B;
+    const a = he(), p = n ? n.id : r.id, T = (B = (P = a == null ? void 0 : a.exposed) == null ? void 0 : P.elementRef.value) == null ? void 0 : B.querySelector("#" + p);
+    return m("ul", {
+      class: u(r),
+      style: A(r, T, n),
       id: r.id + "_menu"
-    }, [I(r)]);
+    }, [x(r)]);
   };
-  function d() {
+  function C() {
     h.forEach((r) => {
       r.expanded = !1;
     }), h.clear();
   }
   return {
     renderDropdownMenu: w,
-    clearAllDropDownMenu: d
+    clearAllDropDownMenu: C
   };
 }
-function Nt(n, e, t) {
-  const s = S(n.alignment), {
+function At(o, e, t) {
+  const s = M(o.alignment), {
     renderDropdownMenu: i,
-    clearAllDropDownMenu: p
-  } = _t(e, t), u = V("design-item-context"), y = V("toolbar-item-handler", () => {
+    clearAllDropDownMenu: u
+  } = It(e, t), d = V("design-item-context"), g = V("toolbar-item-handler", () => {
   });
   function w() {
-    y && y();
+    g && g();
   }
-  function h(d) {
+  function h(C) {
     const r = {
       "btn-group": !0,
       "f-rt-dropdown": !0,
       "f-btn-ml": s.value === "right",
       "f-btn-mr": s.value === "left"
-    }, o = d.dropdownClass.split(" ");
-    return o && o.length && o.reduce((a, m) => (a[m] = !0, a), r), r;
+    }, n = C.dropdownClass.split(" ");
+    return n && n.length && n.reduce((a, p) => (a[p] = !0, a), r), r;
   }
-  function b(d) {
+  function b(C) {
     const r = {
       btn: !0,
-      disabled: !d.enable,
+      disabled: !C.enable,
       "position-relative": !0,
       "farris-component": !0,
       "f-rt-btn": !0,
-      "btn-icontext": !!(d.icon && d.icon.trim())
+      "btn-icontext": !!(C.icon && C.icon.trim())
     };
-    if (d.class) {
-      const o = d.class.split(" ");
-      o && o.length && o.reduce((a, m) => (a[m] = !0, a), r);
+    if (C.class) {
+      const n = C.class.split(" ");
+      n && n.length && n.reduce((a, p) => (a[p] = !0, a), r);
     }
     return r;
   }
-  function l(d) {
-    d && (d.stopPropagation(), d.preventDefault());
+  function c(C) {
+    C && (C.stopPropagation(), C.preventDefault());
   }
-  function c(d, r) {
-    l(d);
-    const o = r.expanded;
-    document.body.click(), r.expanded = !o;
+  function l(C, r) {
+    c(C);
+    const n = r.expanded;
+    document.body.click(), r.expanded = !n;
   }
-  const f = function(d) {
+  const f = function(C) {
     const {
       componentType: r
-    } = d, o = Q(r, d), a = r.toLowerCase().replace("-", "_");
-    return o && !o.id && o.type === r && (o.id = `${a}_${Math.random().toString().slice(2, 6)}`), o;
+    } = C, n = Y(r, C), a = r.toLowerCase().replace("-", "_");
+    return n && !n.id && n.type === r && (n.id = `${a}_${Math.random().toString().slice(2, 6)}`), n;
   }, v = function() {
-    const d = {
+    const C = {
       componentType: "response-toolbar-item",
       parentComponentInstance: t.value,
       targetPosition: -1
     };
-    return f(d);
+    return f(C);
   };
-  function k(d) {
-    const r = u.schema.buttons || u.schema.contents, o = r == null ? void 0 : r.findIndex((m) => m.id === d), a = o === -1 ? null : r[o];
+  function E(C) {
+    const r = d.schema.buttons || d.schema.contents, n = r == null ? void 0 : r.findIndex((p) => p.id === C), a = n === -1 ? null : r[n];
     return {
-      index: o,
+      index: n,
       toolbarItem: a
     };
   }
-  function A(d, r) {
-    var E;
+  function O(C, r) {
+    var B;
     const {
-      index: o,
+      index: n,
       toolbarItem: a
-    } = k(r);
-    if (o === -1)
+    } = E(r);
+    if (n === -1)
       return;
-    const m = a.text || "按钮", M = v(), D = Object.assign({}, M, {
-      text: m
+    const p = a.text || "按钮", T = v(), P = Object.assign({}, T, {
+      text: p
     });
-    (E = u.schema.buttons) == null || E.push(D), w();
+    (B = d.schema.buttons) == null || B.push(P), w();
   }
-  function $(d, r) {
+  function j(C, r) {
     const {
-      index: o,
+      index: n,
       toolbarItem: a
-    } = k(r);
-    if (o === -1)
+    } = E(r);
+    if (n === -1)
       return;
-    const m = a.text || "按钮", M = v(), D = Object.assign({}, M, {
-      text: m
-    }), E = u.schema.buttons[o].children || [];
-    E.push(D), u.schema.buttons[o].children = E, w();
+    const p = a.text || "按钮", T = v(), P = Object.assign({}, T, {
+      text: p
+    }), B = d.schema.buttons[n].children || [];
+    B.push(P), d.schema.buttons[n].children = B, w();
   }
-  function _(d, r) {
-    const o = u.schema.buttons || u.schema.contents, a = o == null ? void 0 : o.findIndex((m) => m.id === r);
-    a !== -1 && (o.splice(a, 1), w());
+  function _(C, r) {
+    const n = d.schema.buttons || d.schema.contents, a = n == null ? void 0 : n.findIndex((p) => p.id === r);
+    a !== -1 && (n.splice(a, 1), w());
   }
-  function T(d) {
-    return g("div", {
+  function D(C) {
+    return m("div", {
       class: "component-btn-group"
-    }, [g("div", null, [g("div", {
+    }, [m("div", null, [m("div", {
       role: "button",
       class: "btn component-settings-button",
       title: "删除",
       ref: "removeButton",
       style: "position:static;",
-      onClick: (r) => _(r, d)
-    }, [g("i", {
+      onClick: (r) => _(r, C)
+    }, [m("i", {
       class: "f-icon f-icon-yxs_delete"
-    }, null)]), g("div", {
+    }, null)]), m("div", {
       role: "button",
       class: "btn component-settings-button",
       title: "复制",
       ref: "copyButton",
       style: "position:static;",
-      onClick: (r) => A(r, d)
-    }, [g("i", {
+      onClick: (r) => O(r, C)
+    }, [m("i", {
       class: "f-icon f-icon-yxs_copy"
-    }, null)]), g("div", {
+    }, null)]), m("div", {
       role: "button",
       class: "btn component-settings-button",
       title: "新增子级",
       ref: "appendChildButton",
       style: "width:85px!important;padding:0 5px;position:static;",
-      onClick: (r) => $(r, d)
-    }, [g("i", {
+      onClick: (r) => j(r, C)
+    }, [m("i", {
       class: "f-icon f-icon-plus-circle text-white mr-1"
-    }, null), g("span", {
+    }, null), m("span", {
       style: "font-size:13px;margin:auto"
-    }, [J("新增子级")])])])]);
+    }, [X("新增子级")])])])]);
   }
-  function B() {
+  function I() {
     Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((r) => r.classList.remove("dgComponentFocused"));
-    const d = document.getElementsByClassName("dgComponentSelected");
-    Array.from(d).forEach((r) => r.classList.remove("dgComponentSelected"));
+    const C = document.getElementsByClassName("dgComponentSelected");
+    Array.from(C).forEach((r) => r.classList.remove("dgComponentSelected"));
   }
-  function P(d) {
-    d.currentTarget.classList.add("dgComponentFocused", "dgComponentSelected");
+  function S(C) {
+    C.currentTarget.classList.add("dgComponentFocused", "dgComponentSelected");
   }
-  function x(d) {
-    var m;
-    const r = u.schema.buttons || u.schema.contents, o = r == null ? void 0 : r.findIndex((M) => M.id === d);
-    if (o === -1)
+  function k(C) {
+    var p;
+    const r = d.schema.buttons || d.schema.contents, n = r == null ? void 0 : r.findIndex((T) => T.id === C);
+    if (n === -1)
       return;
-    const a = r[o];
-    (m = u == null ? void 0 : u.setupContext) == null || m.emit("selectionChange", "response-toolbar-item", a);
-  }
-  function C(d, r) {
-    l(d), B(), P(d), l(d), c(d, r), x(r.id);
-  }
-  function I(d) {
-    return g("div", {
-      id: d.id,
-      class: h(d)
-    }, [g("div", {
-      class: b(d),
+    const a = r[n];
+    (p = d == null ? void 0 : d.setupContext) == null || p.emit("selectionChange", "response-toolbar-item", a);
+  }
+  function y(C, r) {
+    c(C), I(), S(C), c(C), l(C, r), k(r.id);
+  }
+  function x(C) {
+    return m("div", {
+      id: C.id,
+      class: h(C)
+    }, [m("div", {
+      class: b(C),
       style: "display: flex;padding-right: 0.1rem;",
-      onClick: (r) => d.enable && C(r, d)
-    }, [T(d.id), e.shouldShowIcon(d) && g("i", {
-      class: e.iconClass(d)
-    }, null), g("span", null, [d.text]), g("i", {
+      onClick: (r) => C.enable && y(r, C)
+    }, [D(C.id), e.shouldShowIcon(C) && m("i", {
+      class: e.iconClass(C)
+    }, null), m("span", null, [C.text]), m("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)]), i(d)]);
+    }, null)]), i(C)]);
   }
-  function O() {
-    p();
+  function A() {
+    u();
   }
   return {
-    renderToolbarDropdown: I,
-    clearAllDropDown: O
+    renderToolbarDropdown: x,
+    clearAllDropDown: A
   };
 }
-class Ft extends ee {
+class Ot extends te {
   constructor(e, t) {
     super(e, t);
   }
   getPropertyConfig(e) {
-    return this.getBasicPropConfig(e), this.getBehaviorProperties(e), this.propertyConfig;
+    return this.getBasicPropConfig(e), this.getAppearancePropConfig(e), this.getBehaviorProperties(e), this.propertyConfig;
+  }
+  getAppearancePropConfig(e) {
+    this.propertyConfig.categories.appearance = {
+      title: "样式",
+      description: "Appearance",
+      properties: {
+        class: {
+          title: "class样式",
+          type: "string",
+          description: "组件的CSS样式",
+          $converter: "/converter/appearance.converter"
+        }
+      }
+    };
   }
   getBasicPropConfig(e) {
     this.propertyConfig.categories.basic = {
@@ -1754,7 +1744,7 @@ class Ft extends ee {
             type: "combo-list",
             textField: "value",
             valueField: "key",
-            data: [{ key: "response-toolbar", value: K["response-toolbar"].name }]
+            data: [{ key: "response-toolbar", value: ee["response-toolbar"].name }]
           }
         }
       }
@@ -1785,7 +1775,7 @@ class Ft extends ee {
             ]
           }
         },
-        buttons: {
+        items: {
           title: "按钮",
           description: "The items of Response Toolbar.",
           type: "array",
@@ -1797,40 +1787,40 @@ class Ft extends ee {
     };
   }
 }
-function Lt(n, e) {
-  const t = n.schema;
+function jt(o, e) {
+  const t = o.schema;
   function s(b) {
     return !1;
   }
-  function i(b, l) {
-    return l.text = b.label, l;
+  function i(b, c) {
+    return c.text = b.label, c;
   }
-  function p() {
+  function u() {
     return !1;
   }
-  function u() {
+  function d() {
     return !1;
   }
-  function y() {
+  function g() {
     return !0;
   }
   function w() {
     return !0;
   }
   function h(b) {
-    return new Ft(b, e).getPropertyConfig(t);
+    return new Ot(b, e).getPropertyConfig(t);
   }
   return {
     canAccepts: s,
-    checkCanAddComponent: y,
-    checkCanDeleteComponent: u,
-    checkCanMoveComponent: p,
+    checkCanAddComponent: g,
+    checkCanDeleteComponent: d,
+    checkCanMoveComponent: u,
     hideNestedPaddingInDesginerView: w,
     onResolveNewComponentSchema: i,
     getPropsConfig: h
   };
 }
-const Vt = {
+const _t = {
   id: { type: String, default: "" },
   componentId: { type: String, default: "" },
   canAdd: { type: Boolean, default: !1 },
@@ -1843,246 +1833,245 @@ const Vt = {
    * 组件值
    */
   modelValue: { type: Object }
-}, X = S(0);
-function Ut(n, e) {
-  const t = e.getBoundingClientRect(), s = n.getBoundingClientRect(), i = s.top >= t.top, p = s.top <= t.bottom;
-  return i && p;
+}, se = M(0);
+function $t(o, e) {
+  const t = e.getBoundingClientRect(), s = o.getBoundingClientRect(), i = s.top >= t.top, u = s.top <= t.bottom;
+  return i && u;
 }
-function Wt(n) {
-  if (!n)
+function Ft(o) {
+  if (!o)
     return;
   let e;
-  if (n.className.includes("dgComponentSelected") ? e = n : e = n.querySelector(".dgComponentSelected"), !e)
+  if (o.className.includes("dgComponentSelected") ? e = o : e = o.querySelector(".dgComponentSelected"), !e)
     return;
   const t = e.getBoundingClientRect();
   if (t.width === 0 && t.height === 0)
     return;
   const s = e.querySelector(".component-btn-group");
   if (s) {
-    if (!Ut(e, n)) {
+    if (!$t(e, o)) {
       s.style.display = "none";
       return;
     }
     s.style.display = "";
-    const p = s.getBoundingClientRect(), u = s.querySelector("div");
-    if (u) {
-      const y = u.getBoundingClientRect();
-      u.style.top = p.top + "px", u.style.left = p.left - y.width + "px";
+    const u = s.getBoundingClientRect(), d = s.querySelector("div");
+    if (d) {
+      const g = d.getBoundingClientRect();
+      d.style.top = u.top + "px", d.style.left = u.left - g.width + "px";
     }
   }
 }
-function qt(n, e, t) {
-  var B;
-  function s() {
-  }
-  const i = "", p = S();
+function Nt(o, e, t) {
+  var I;
+  const s = "", i = M();
   function u() {
     return !0;
   }
-  function y() {
+  function d() {
     return !1;
   }
-  function w() {
+  function g() {
     return !0;
   }
-  function h() {
+  function w() {
     return !0;
   }
-  function b() {
+  function h() {
     return !0;
   }
-  function l(P) {
-    if (!P || !P.value)
+  function b(S) {
+    if (!S || !S.value)
       return null;
-    const x = S(P == null ? void 0 : P.value.parent), C = l(x);
-    return C || null;
+    const k = M(S == null ? void 0 : S.value.parent), y = b(k);
+    return y || null;
   }
-  function c(P = e) {
-    const { componentInstance: x, designerItemElementRef: C } = P;
-    return !x || !x.value ? null : x.value.canMove || x.value.canAdd || x.value.canDelete ? C : c(P.parent);
+  function c(S = e) {
+    const { componentInstance: k, designerItemElementRef: y } = S;
+    return !k || !k.value ? null : k.value.canMove || k.value.canAdd || k.value.canDelete ? y : c(S.parent);
   }
-  function f(P) {
+  function l(S) {
     return !!t;
   }
-  function v() {
+  function f() {
     return (e == null ? void 0 : e.schema.label) || (e == null ? void 0 : e.schema.title) || (e == null ? void 0 : e.schema.name);
   }
-  function k() {
+  function v() {
   }
-  function A(P, x) {
+  function E(S, k) {
   }
-  function $(P) {
-    const { componentType: x } = P;
-    let C = Q(x, P);
-    const I = x.toLowerCase().replace("-", "_");
-    return C && !C.id && C.type === x && (C.id = `${I}_${Math.random().toString().slice(2, 6)}`), C;
+  function O(S) {
+    const { componentType: k } = S, y = V("designer-host-service");
+    let x = Y(k, S, y);
+    const A = k.toLowerCase().replace(/-/g, "_");
+    return x && !x.id && x.type === k && (x.id = `${A}_${Math.random().toString().slice(2, 6)}`), x;
   }
-  function _(P) {
+  function j(S) {
   }
-  function T(...P) {
+  function _(...S) {
     return [];
   }
-  return p.value = {
+  function D() {
+  }
+  return i.value = {
     canMove: u(),
-    canSelectParent: y(),
-    canAdd: h(),
-    canDelete: w(),
-    canNested: !b(),
+    canSelectParent: d(),
+    canAdd: w(),
+    canDelete: g(),
+    canNested: !h(),
     contents: [],
-    elementRef: n,
-    parent: (B = e.parent) == null ? void 0 : B.componentInstance,
+    elementRef: o,
+    parent: (I = e.parent) == null ? void 0 : I.componentInstance,
     schema: e.schema,
-    styles: i,
-    canAccepts: f,
-    getBelongedComponentInstance: l,
+    styles: s,
+    canAccepts: l,
+    getBelongedComponentInstance: b,
     getDraggableDesignItemElement: c,
-    getDraggingDisplayText: v,
-    getPropConfig: T,
-    getDragScopeElement: k,
-    onAcceptMovedChildElement: A,
-    onChildElementMovedOut: _,
-    addNewChildComponentSchema: $,
-    updateDragAndDropRules: s,
-    triggerBelongedComponentToMoveWhenMoved: S(!1),
-    triggerBelongedComponentToDeleteWhenDeleted: S(!1)
-  }, p;
+    getDraggingDisplayText: f,
+    getPropConfig: _,
+    getDragScopeElement: v,
+    onAcceptMovedChildElement: E,
+    onChildElementMovedOut: j,
+    addNewChildComponentSchema: O,
+    onRemoveComponent: D,
+    triggerBelongedComponentToMoveWhenMoved: M(!1),
+    triggerBelongedComponentToDeleteWhenDeleted: M(!1)
+  }, i;
 }
-const Ee = /* @__PURE__ */ U({
+const Ee = /* @__PURE__ */ W({
   name: "FDesignerInnerItem",
-  props: Vt,
+  props: _t,
   emits: ["selectionChange", "addComponent", "removeComponent"],
-  setup(n, e) {
-    const t = S(n.canMove), s = S(n.canAdd), i = S(n.canDelete), p = S(!1), u = S(n.contentKey), y = S(n.childType), w = S(n.childLabel), h = S(n.modelValue), b = S(""), l = S(), c = V("canvas-dragula"), f = S(), v = V("design-item-context"), k = {
-      designerItemElementRef: l,
+  setup(o, e) {
+    const t = M(o.canMove), s = M(o.canAdd), i = M(o.canDelete), u = M(!1), d = M(o.contentKey), g = M(o.childType), w = M(o.childLabel), h = M(o.modelValue), b = M(""), c = M(), l = V("canvas-dragula"), f = M(), v = V("design-item-context"), E = {
+      designerItemElementRef: c,
       componentInstance: f,
       schema: h.value,
       parent: v,
       setupContext: e
     };
-    _e("design-item-context", k);
-    const A = N(() => ({
+    Oe("design-item-context", E);
+    const O = F(() => ({
       "farris-component": !0,
       // 受position-relative影响，整个容器的高度不能被撑起
-      "flex-fill": n.id == "root-component",
+      "flex-fill": o.id === "root-component",
       "position-relative": t.value || i.value,
-      "farris-nested": p.value,
+      "farris-nested": u.value,
       "can-move": t.value,
-      "d-none": l.value && l.value.classList.contains("d-none")
-    })), $ = N(() => {
-      const o = {};
-      return b.value && b.value.split(";").reduce((a, m) => {
-        const [M, D] = m.split(":");
-        return M && (a[M] = D), a;
-      }, o), o;
+      "d-none": c.value && c.value.classList.contains("d-none")
+    })), j = F(() => {
+      const n = {};
+      return b.value && b.value.split(";").reduce((a, p) => {
+        const [T, P] = p.split(":");
+        return T && (a[T] = P), a;
+      }, n), n;
     });
-    function _(o, a) {
-      if (v && v.schema[u.value]) {
-        const m = v.schema[u.value].findIndex((M) => M.id === a.id);
-        if (m > -1) {
-          const M = v.schema[u.value].length, D = v.schema[u.value][m % M];
-          v.designerItemElementRef.value.querySelector(`#${D.id}-design-item`), v.schema[u.value].splice(m, 1), v.componentInstance.value.updateDragAndDropRules(), X.value++, e.emit("removeComponent");
+    function _(n, a) {
+      if (v && v.schema[d.value]) {
+        const p = v.schema[d.value].findIndex((T) => T.id === a.id);
+        if (p > -1) {
+          const T = v.schema[d.value].length, P = v.schema[d.value][p % T];
+          v.designerItemElementRef.value.querySelector(`#${P.id}-design-item`), v.schema[d.value].splice(p, 1), se.value++, e.emit("removeComponent");
         }
       }
     }
-    function T(o) {
+    function D(n) {
       if (f.value.addNewChildComponentSchema) {
         const a = {
-          componentType: y.value,
+          componentType: g.value,
           label: w.value,
           parentComponentInstance: f.value,
           targetPosition: -1
-        }, m = f.value.addNewChildComponentSchema(a);
-        h.value[u.value].push(m), e.emit("addComponent");
+        }, p = f.value.addNewChildComponentSchema(a);
+        h.value[d.value].push(p), e.emit("addComponent");
       }
     }
-    function B() {
-      return s.value && g("div", {
+    function I() {
+      return s.value && m("div", {
         role: "button",
         class: "btn component-settings-button",
         title: "新增",
         ref: "removeComponent",
-        onClick: (o) => {
-          T();
+        onClick: (n) => {
+          D();
         }
-      }, [g("i", {
+      }, [m("i", {
         class: "f-icon f-icon-plus-circle"
       }, null)]);
     }
-    function P(o) {
-      return i.value && g("div", {
+    function S(n) {
+      return i.value && m("div", {
         role: "button",
         class: "btn component-settings-button",
         title: "删除",
         ref: "removeComponent",
-        onClick: Fe((a) => _(a, o), ["stop"])
-      }, [g("i", {
+        onClick: _e((a) => _(a, n), ["stop"])
+      }, [m("i", {
         class: "f-icon f-icon-yxs_delete"
       }, null)]);
     }
-    function x() {
-      return t.value && g("div", {
+    function k() {
+      return t.value && m("div", {
         role: "button",
         class: "btn component-settings-button",
         title: "移动",
         ref: "moveComponent"
-      }, [g("i", {
+      }, [m("i", {
         "data-dragging-icon": "true",
         class: "cmp_move f-icon f-icon-yxs_move"
       }, null)]);
     }
-    function C(o) {
-      return g("div", {
+    function y(n) {
+      return m("div", {
         class: "component-btn-group",
         "data-noattach": "true"
-      }, [g("div", null, [B(), x(), P(o)])]);
+      }, [m("div", null, [I(), k(), S(n)])]);
     }
-    q(() => n.modelValue, (o) => {
-      h.value = o, k.schema = o;
+    z(() => o.modelValue, (n) => {
+      h.value = n, E.schema = n;
     });
-    function I(o) {
-      const a = o.target;
-      Wt(a);
+    function x(n) {
+      const a = n.target;
+      Ft(a);
     }
-    function O() {
-      var o, a;
-      (a = (o = h.value) == null ? void 0 : o.contents) != null && a.length && l.value && l.value.addEventListener("scroll", I);
+    function A() {
+      var n, a;
+      (a = (n = h.value) == null ? void 0 : n.contents) != null && a.length && c.value && c.value.addEventListener("scroll", x);
     }
-    function d() {
-      const o = l.value, a = S(o.children[1]);
-      return qt(a, k).value;
+    function C() {
+      const n = c.value, a = M(n.children[1]);
+      return Nt(a, E).value;
     }
-    H(() => {
-      if (l.value) {
-        const o = l.value.querySelector(`[data-dragref='${h.value.id}-container']`);
-        f.value = o && o.componentInstance ? o.componentInstance.value : d(), c && o && c.attachComponents(o, h.value), p.value = f.value.canNested !== void 0 ? f.value.canNested : p.value, s.value = f.value.canAdd !== void 0 ? f.value.canAdd : s.value, i.value = f.value.canDelete !== void 0 ? f.value.canDelete : i.value, t.value = f.value.canMove !== void 0 ? f.value.canMove : t.value, b.value = f.value.styles || "", l.value && (l.value.componentInstance = f, l.value.designItemContext = k);
+    G(() => {
+      if (c.value) {
+        const n = c.value.querySelector(`[data-dragref='${h.value.id}-container']`);
+        f.value = n && n.componentInstance ? n.componentInstance.value : C(), l && n && l.attachComponents(n, h.value), u.value = f.value.canNested !== void 0 ? f.value.canNested : u.value, s.value = f.value.canAdd !== void 0 ? f.value.canAdd : s.value, i.value = f.value.canDelete !== void 0 ? f.value.canDelete : i.value, t.value = f.value.canMove !== void 0 ? f.value.canMove : t.value, b.value = f.value.styles || "", c.value && (c.value.componentInstance = f, c.value.designItemContext = E);
       }
-      O(), X.value++;
-    }), Ne(() => {
-      l.value && l.value.removeEventListener("scroll", I);
+      A(), se.value++;
+    }), je(() => {
+      c.value && c.value.removeEventListener("scroll", x);
     });
-    function r(o) {
-      Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((m) => m.classList.remove("dgComponentFocused")), o && (o.preventDefault(), o.stopPropagation());
-      const a = l.value;
-      if (a) {
-        const m = document.getElementsByClassName("dgComponentSelected");
-        if (!(m && m.length === 1 && m[0] === l.value)) {
-          Array.from(m).forEach((E) => E.classList.remove("dgComponentSelected")), a.classList.add("dgComponentFocused"), e.emit("selectionChange", h.value.type, h.value, n.componentId, f.value);
-          const D = f.value.getDraggableDesignItemElement(k);
-          D && D.value && D.value.classList.add("dgComponentSelected");
-        }
+    function r(n) {
+      Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((T) => T.classList.remove("dgComponentFocused")), n && (n.preventDefault(), n.stopPropagation());
+      let a = E.designerItemElementRef;
+      const p = c.value;
+      if (p) {
+        const T = document.getElementsByClassName("dgComponentSelected");
+        T && T.length === 1 && T[0] === c.value || (Array.from(T).forEach((B) => B.classList.remove("dgComponentSelected")), p.classList.add("dgComponentFocused"), e.emit("selectionChange", h.value.type, h.value, o.componentId, f.value), a = f.value.getDraggableDesignItemElement(E), a && a.value && a.value.classList.add("dgComponentSelected"));
       }
-      X.value++;
+      x({
+        target: a == null ? void 0 : a.value
+      });
     }
-    return () => g("div", {
-      id: `${n.id}-design-item`,
-      ref: l,
-      class: A.value,
-      style: $.value,
+    return () => m("div", {
+      id: `${o.id}-design-item`,
+      ref: c,
+      class: O.value,
+      style: j.value,
       onClick: r
-    }, [C(h.value), e.slots.default && e.slots.default()]);
+    }, [y(h.value), e.slots.default && e.slots.default()]);
   }
 });
-class Ht extends ee {
+class Lt extends te {
   constructor(e, t) {
     super(e, t);
   }
@@ -2143,10 +2132,8 @@ class Ht extends ee {
         label: "onClick",
         name: "点击事件"
       }
-    ];
-    var s = this;
-    const i = s.eventsEditorUtils.formProperties(e, s.viewModelId, t), p = {};
-    p[s.viewModelId] = {
+    ], s = this, i = s.eventsEditorUtils.formProperties(e, s.viewModelId, t), u = {};
+    u[s.viewModelId] = {
       type: "events-editor",
       editor: {
         initialData: i
@@ -2154,19 +2141,19 @@ class Ht extends ee {
     }, this.propertyConfig.categories.eventsEditor = {
       title: "事件",
       hideTitle: !0,
-      properties: p,
+      properties: u,
       // 这个属性，标记当属性变更得时候触发重新更新属性
       refreshPanelAfterChanged: !0,
       tabId: "commands",
       tabName: "交互",
-      setPropertyRelates(u, y) {
-        const w = u.propertyValue;
+      setPropertyRelates(d, g) {
+        const w = d.propertyValue;
         delete e[s.viewModelId], w && (w.setPropertyRelates = this.setPropertyRelates, s.eventsEditorUtils.saveRelatedParameters(e, s.viewModelId, w.events, w));
       }
     };
   }
 }
-class zt extends ee {
+class Vt extends te {
   constructor(e, t) {
     super(e, t);
   }
@@ -2192,7 +2179,7 @@ class zt extends ee {
             type: "combo-list",
             textField: "value",
             valueField: "key",
-            data: [{ key: "response-toolbar-item", value: K["response-toolbar-item"].name }]
+            data: [{ key: "response-toolbar-item", value: ee["response-toolbar-item"].name }]
           }
         },
         text: {
@@ -2215,7 +2202,7 @@ class zt extends ee {
       description: "Behavior",
       properties: {
         disabled: {
-          title: "禁用状态",
+          title: "禁用",
           type: "boolean",
           description: "按钮禁用状态",
           refreshPanelAfterChanged: !0
@@ -2229,7 +2216,7 @@ class zt extends ee {
       description: "Appearance",
       properties: {
         class: {
-          title: "class",
+          title: "class样式",
           type: "string",
           description: "",
           $converter: "/converter/appearance.converter"
@@ -2243,8 +2230,8 @@ class zt extends ee {
         label: "onClick",
         name: "点击事件"
       }
-    ], s = this, i = s.eventsEditorUtils.formProperties(e, s.viewModelId, t), p = {};
-    p[s.viewModelId] = {
+    ], s = this, i = s.eventsEditorUtils.formProperties(e, s.viewModelId, t), u = {};
+    u[s.viewModelId] = {
       type: "events-editor",
       editor: {
         initialData: i
@@ -2252,20 +2239,20 @@ class zt extends ee {
     }, this.propertyConfig.categories.eventsEditor = {
       title: "事件",
       hideTitle: !0,
-      properties: p,
+      properties: u,
       // 这个属性，标记当属性变更得时候触发重新更新属性
       refreshPanelAfterChanged: !0,
       tabId: "commands",
       tabName: "交互",
-      setPropertyRelates(u, y) {
-        const w = u.propertyValue;
+      setPropertyRelates(d, g) {
+        const w = d.propertyValue;
         delete e[s.viewModelId], w && (w.setPropertyRelates = this.setPropertyRelates, s.eventsEditorUtils.saveRelatedParameters(e, s.viewModelId, w.events, w));
       }
     };
   }
 }
-function Gt(n, e) {
-  function t(y) {
+function Ut(o, e) {
+  function t(g) {
     return !1;
   }
   function s() {
@@ -2274,216 +2261,219 @@ function Gt(n, e) {
   function i() {
     return !0;
   }
-  function p() {
+  function u() {
     return !1;
   }
-  function u(y) {
+  function d(g) {
     let w;
-    switch (n.schema.type) {
+    switch (o.schema.type) {
       case "tab-toolbar-item":
-        w = new Ht(y, e);
+        w = new Lt(g, e);
         break;
       default:
-        w = new zt(y, e);
+        w = new Vt(g, e);
     }
-    return w.getPropertyConfig(n.schema);
+    return w.getPropertyConfig(o.schema);
   }
   return {
     canAccepts: t,
     checkCanMoveComponent: s,
     checkCanDeleteComponent: i,
-    checkCanAddComponent: p,
-    getPropsConfig: u
+    checkCanAddComponent: u,
+    getPropsConfig: d
   };
 }
-const Be = /* @__PURE__ */ U({
+const xe = /* @__PURE__ */ W({
   name: "FResponseToolbarItemDesign",
   props: Me,
   emits: ["Click"],
-  setup(n, e) {
-    S(), S();
-    const t = S(n.alignment), s = {
+  setup(o, e) {
+    M(), M();
+    const t = M(o.alignment), s = {
       id: "__more_buttons__",
       text: "More"
-    }, i = S(new z(s));
-    N(() => i.value.children.length > 0);
-    const p = S(), u = V("designer-host-service"), y = V("design-item-context"), w = Gt(y, u), h = Ce(p, y, w);
+    }, i = M(new Q(s));
+    F(() => i.value.children.length > 0);
+    const u = M(), d = V("designer-host-service"), g = V("design-item-context"), w = Ut(g, d), h = ve(u, g, w);
     V("toolbar-item-handler", () => {
-    }), H(() => {
-      p.value.componentInstance = h;
+    }), G(() => {
+      u.value.componentInstance = h;
     }), e.expose(h.value);
     function b() {
       const f = {
         "f-icon": !0
-      }, v = n.icon ? n.icon.trim() : "";
-      return Y(f, v);
-    }
-    function l() {
-      return !!(n.icon && n.icon.trim());
+      }, v = o.icon ? o.icon.trim() : "";
+      return Z(f, v);
     }
     function c() {
+      return !!(o.icon && o.icon.trim());
+    }
+    function l() {
       const f = {
         btn: !0,
         "f-rt-btn": !0,
         "f-btn-ml": t.value === "right",
         "f-btn-mr": t.value === "left",
-        "btn-icontext": !!(n.icon && n.icon.trim()),
-        disabled: n.disabled === !0
+        "btn-icontext": !!(o.icon && o.icon.trim()),
+        disabled: o.disabled === !0
       };
-      return Y(f, n.class);
+      return Z(f, o.class);
     }
-    return () => g("div", {
-      ref: p,
-      "data-dragref": `${y.schema.id}-container`,
+    return () => m("div", {
+      ref: u,
+      "data-dragref": `${g.schema.id}-container`,
       class: "farris-component position-relative",
       style: "display:inline-block!important;"
-    }, [g("button", {
+    }, [m("button", {
       type: "button",
-      class: c(),
-      id: n.id
-    }, [l() && g("i", {
+      class: l(),
+      id: o.id
+    }, [c() && m("i", {
       class: b()
-    }, null), n.text])]);
+    }, null), o.text])]);
   }
-}), Ie = /* @__PURE__ */ U({
+}), Be = /* @__PURE__ */ W({
   name: "FResponseToolbarDesign",
-  props: At,
+  props: Et,
   emits: ["Click"],
-  setup(n, e) {
-    const t = S(n.items);
-    let s = new Array(t.value.length).fill(S());
-    const i = S(), p = S(), u = S(n.alignment), y = {
+  setup(o, e) {
+    const t = M(o.items);
+    let s = new Array(t.value.length).fill(M());
+    const i = M(), u = M(), d = M(o.alignment), g = {
       id: "__more_buttons__",
       text: "More"
-    }, w = S(new z(y)), h = xe();
-    N(() => w.value.children.length > 0);
-    const b = S(), l = V("designer-host-service"), c = V("design-item-context"), f = Lt(c, l), v = Ce(b, c, f);
-    V("toolbar-item-handler", () => {
-    }), H(() => {
+    }, w = M(new Q(g)), h = ke();
+    F(() => w.value.children.length > 0);
+    const b = M(), c = V("designer-host-service"), l = V("design-item-context"), f = jt(l, c), v = ve(b, l, f), E = V("toolbar-item-handler", () => {
+    });
+    G(() => {
       b.value.componentInstance = v;
     }), e.expose(v.value);
-    const k = N(() => Y({
+    function O() {
+      E && E();
+    }
+    const j = F(() => Z({
       "f-toolbar": !0,
       "f-response-toolbar": !0,
       "position-relative": !0
-    }, n.customClass)), A = N(() => ({
+    }, o.customClass)), _ = F(() => ({
       "d-flex": !0,
       "flex-nowrap": !0,
-      "justify-content-end": u.value === "right",
-      "justify-content-start": u.value === "left"
+      "justify-content-end": d.value === "right",
+      "justify-content-start": d.value === "left"
     })), {
-      renderToolbarDropdown: $,
-      clearAllDropDown: _
-    } = Nt(n, h, v);
-    function T() {
-      t.value.filter((d) => d.children && d.children.length > 0).forEach((d) => {
-        d.expanded = !1;
-      }), w.value.expanded = !1, _();
+      renderToolbarDropdown: D,
+      clearAllDropDown: I
+    } = At(o, h, v);
+    function S() {
+      t.value.filter((n) => n.children && n.children.length > 0).forEach((n) => {
+        n.expanded = !1;
+      }), w.value.expanded = !1, I();
     }
-    const B = /* @__PURE__ */ new Map(), P = [];
-    function x(d) {
-      const r = p.value;
-      let o = d;
-      const a = Array.from(r.children), m = a[a.length - 1].id === "__more_buttons__" ? a[a.length - 1] : null;
-      if (m) {
-        const j = m.computedStyleMap().get("margin-left"), F = m.computedStyleMap().get("margin-right"), W = (j ? j.value : 0) + m.getBoundingClientRect().width + (F ? F.value : 0);
-        o -= W;
+    const k = /* @__PURE__ */ new Map(), y = [];
+    function x(n) {
+      const a = u.value;
+      let p = n;
+      const T = Array.from(a.children), P = T[T.length - 1].id === "__more_buttons__" ? T[T.length - 1] : null;
+      if (P) {
+        const $ = P.computedStyleMap().get("margin-left"), L = P.computedStyleMap().get("margin-right"), H = ($ ? $.value : 0) + P.getBoundingClientRect().width + (L ? L.value : 0);
+        p -= H;
       }
-      const M = a.filter((j) => j.id !== "__more_buttons__");
-      for (const j of M) {
-        const F = j.computedStyleMap().get("margin-left"), W = j.computedStyleMap().get("margin-right"), G = (F ? F.value : 0) + j.getBoundingClientRect().width + (W ? W.value : 0);
-        o < G ? (B.set(j.id, !0), P.push({
-          id: j.id,
-          width: G
-        })) : o -= G;
+      const B = T.filter(($) => $.id !== "__more_buttons__");
+      for (const $ of B) {
+        const L = $.computedStyleMap().get("margin-left"), H = $.computedStyleMap().get("margin-right"), J = (L ? L.value : 0) + $.getBoundingClientRect().width + (H ? H.value : 0);
+        p < J ? (k.set($.id, !0), y.push({
+          id: $.id,
+          width: J
+        })) : p -= J;
       }
-      if (P.length)
-        for (let j = P.length - 1; j >= 0; j--) {
-          const F = P[j].width;
-          if (o >= F)
-            o -= F, B.delete(P[j].id), P.pop();
+      if (y.length)
+        for (let $ = y.length - 1; $ >= 0; $--) {
+          const L = y[$].width;
+          if (p >= L)
+            p -= L, k.delete(y[$].id), y.pop();
           else
             break;
         }
-      const D = Object.assign({}, w.value);
-      D.children = [];
-      const E = new z(D), L = t.value.reduce((j, F) => (B.has(F.id) && E.children.push(F), F.visible = !B.has(F.id), j.push(F), j), []);
-      w.value = E, t.value = L;
+      const N = Object.assign({}, w.value);
+      N.children = [];
+      const U = new Q(N), q = t.value.reduce(($, L) => (k.has(L.id) && U.children.push(L), L.visible = !k.has(L.id), $.push(L), $), []);
+      w.value = U, t.value = q;
     }
-    const C = new ResizeObserver((d) => {
-      if (d.length) {
-        const o = d[0].contentRect.width, m = p.value.getBoundingClientRect().width;
-        (o < m || P.length) && x(o);
+    const A = new ResizeObserver((n) => {
+      if (n.length) {
+        const p = n[0].contentRect.width, P = u.value.getBoundingClientRect().width;
+        (p < P || y.length) && x(p);
       }
     });
-    H(() => {
-      const d = i.value;
-      C.observe(d), document.body.addEventListener("click", T);
-    }), ye(() => {
-      C.disconnect(), document.body.removeEventListener("click", T);
-    }), q(() => n.items, () => {
-      t.value = n.items;
+    G(() => {
+      const n = i.value;
+      A.observe(n), document.body.addEventListener("click", S);
+    }), be(() => {
+      A.disconnect(), document.body.removeEventListener("click", S);
+    }), z(() => o.items, () => {
+      t.value = o.items;
     }, {
       deep: !0
-    }), q(t, (d) => {
-      s = new Array(t.value.length).fill(S());
+    }), z(t, (n) => {
+      s = new Array(t.value.length).fill(M());
     });
-    function I(d, r, o, a) {
-      c && c.setupContext && c.setupContext.emit("selectionChange", d, r, o, a);
+    function C(n, a, p, T) {
+      l && l.setupContext && l.setupContext.emit("selectionChange", n, a, p, T);
     }
-    function O() {
-      const d = p.value.querySelector(".dgComponentFocused.dgComponentSelected");
-      d == null || d.classList.remove("dgComponentSelected"), d == null || d.classList.remove("dgComponentFocused");
+    function r() {
+      const n = u.value.querySelector(".dgComponentFocused.dgComponentSelected");
+      n == null || n.classList.remove("dgComponentSelected"), n == null || n.classList.remove("dgComponentFocused"), O();
     }
-    return () => g("div", {
+    return () => m("div", {
       ref: b,
-      "data-dragref": `${c.schema.id}-container`,
-      class: k.value
-    }, [g("div", {
+      "data-dragref": `${l.schema.id}-container`,
+      class: j.value
+    }, [m("div", {
       ref: i,
-      class: A.value
-    }, [g("div", {
-      ref: p,
+      class: _.value
+    }, [m("div", {
+      ref: u,
       class: "d-inline-block f-response-content",
       style: "white-space: nowrap;"
-    }, [t.value.map((d, r) => g(Ee, {
-      ref: s[r],
+    }, [t.value.map((n, a) => m(Ee, {
+      ref: s[a],
       class: "p-0 display-inline-block",
-      modelValue: d,
-      "onUpdate:modelValue": (o) => d = o,
+      modelValue: n,
+      "onUpdate:modelValue": (p) => n = p,
       canMove: !0,
       childType: "response-toolbar-item",
       childLabel: "按钮",
       contentKey: "buttons",
-      componentId: n.componentId,
-      id: d.id,
+      componentId: o.componentId,
+      id: n.id,
       style: "padding:0 !important;display:inline-block",
-      onSelectionChange: I,
-      onRemoveComponent: O
+      onSelectionChange: C,
+      onRemoveComponent: r
     }, {
       default: () => {
-        var o;
-        return [g(Be, {
-          id: d.id,
-          disabled: d.disabled,
-          text: d.text,
-          icon: d.icon,
-          class: ((o = d.appearance) == null ? void 0 : o.class) || "btn-secondary",
-          alignment: n.alignment || "right",
-          componentId: n.componentId
+        var p;
+        return [m(xe, {
+          id: n.id,
+          disabled: n.disabled,
+          text: n.text,
+          icon: n.icon,
+          class: ((p = n.appearance) == null ? void 0 : p.class) || "btn-secondary",
+          alignment: o.alignment || "right",
+          componentId: o.componentId
         }, null)];
       }
     }))])])]);
   }
-}), me = ce;
-Z.register = (n, e, t) => {
-  n["response-toolbar"] = Z, e["response-toolbar"] = ce;
+}), me = le;
+K.register = (o, e, t) => {
+  o["response-toolbar"] = K, e["response-toolbar"] = le;
 };
-Z.registerDesigner = (n, e, t) => {
-  n["response-toolbar"] = Ie, e["response-toolbar"] = ce, n["response-toolbar-item"] = Be, e["response-toolbar-item"] = Ot;
+K.registerDesigner = (o, e, t) => {
+  o["response-toolbar"] = Be, e["response-toolbar"] = le, o["response-toolbar-item"] = xe, e["response-toolbar-item"] = xt;
 };
-Ve(Z);
-const Jt = {
+Fe(K);
+const Wt = {
   id: { type: String, default: "" },
   componentId: { type: String, default: "" },
   type: { type: String, default: "" },
@@ -2498,104 +2488,104 @@ const Jt = {
    */
   modelValue: { type: Object },
   ignore: { type: Boolean, default: !1 }
-}, he = /* @__PURE__ */ U({
+}, ge = /* @__PURE__ */ W({
   name: "FDesignerTemplateItem",
-  props: Jt,
+  props: Wt,
   emits: ["selectionChange"],
-  setup(n, e) {
-    const t = S(), s = N(() => ({
+  setup(o, e) {
+    const t = M(), s = F(() => ({
       "farris-component": !0
     }));
-    function i(p) {
-      Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((y) => y.classList.remove("dgComponentFocused")), p && (p.preventDefault(), p.stopPropagation());
-      const u = t.value;
-      if (u) {
-        const y = document.getElementsByClassName("dgComponentSelected");
-        y && y.length === 1 && y[0] === t.value || (Array.from(y).forEach((h) => h.classList.remove("dgComponentSelected")), u.classList.add("dgComponentFocused"));
+    function i(u) {
+      Array.from(document.getElementsByClassName("dgComponentFocused")).forEach((g) => g.classList.remove("dgComponentFocused")), u && (u.preventDefault(), u.stopPropagation());
+      const d = t.value;
+      if (d) {
+        const g = document.getElementsByClassName("dgComponentSelected");
+        g && g.length === 1 && g[0] === t.value || (Array.from(g).forEach((h) => h.classList.remove("dgComponentSelected")), d.classList.add("dgComponentFocused"));
       }
-      X.value++;
+      se.value++;
     }
-    return () => g("div", {
-      id: `${n.id}-design-item`,
+    return () => m("div", {
+      id: `${o.id}-design-item`,
       ref: t,
       class: s.value,
       onClick: i
     }, [e.slots.default && e.slots.default()]);
   }
-}), Qt = /* @__PURE__ */ U({
+}), qt = /* @__PURE__ */ W({
   name: "FPageHeaderDesign",
-  props: st,
-  emits: ["Click"],
-  setup(n, e) {
-    const t = S(), s = V("designer-host-service"), i = V("design-item-context"), p = lt(i.schema, s), u = it(t, i, p), y = S(i.schema.toolbar || {
+  props: nt,
+  emits: ["click"],
+  setup(o, e) {
+    const t = M(), s = V("designer-host-service"), i = V("design-item-context"), u = it(i.schema, s), d = st(t, i, u), g = M(i.schema.toolbar || {
       type: "response-toolbar",
       buttons: []
-    }), w = S(me(y.value));
-    H(() => {
-      t.value.componentInstance = u;
-    }), q(() => i.schema.toolbar, () => {
-      y.value = i.schema.toolbar || {
+    }), w = M(me(g.value));
+    G(() => {
+      t.value.componentInstance = d;
+    }), z(() => i.schema.toolbar, () => {
+      g.value = i.schema.toolbar || {
         type: "response-toolbar",
         buttons: []
-      }, w.value = me(y.value);
+      }, w.value = me(g.value);
     }, {
       deep: !0
     });
-    const h = N(() => [...w.value.items]);
-    function b(l, c, f, v) {
-      i && i.setupContext && i.setupContext.emit("selectionChange", l, c, f, v);
+    const h = F(() => [...w.value.items]);
+    function b(c, l, f, v) {
+      i && i.setupContext && i.setupContext.emit("selectionChange", c, l, f, v);
     }
-    return e.expose(u.value), () => g("div", {
+    return e.expose(d.value), () => m("div", {
       ref: t
-    }, [g("nav", {
+    }, [m("nav", {
       class: "f-page-header-base"
-    }, [g("div", {
+    }, [m("div", {
       class: "f-title"
-    }, [g(he, null, {
-      default: () => [g("span", {
+    }, [m(ge, null, {
+      default: () => [m("span", {
         class: "f-title-icon f-text-orna-manage"
-      }, [g("i", {
-        class: n.icon
+      }, [m("i", {
+        class: o.icon
       }, null)])]
-    }), g(he, null, {
-      default: () => [g("h4", {
+    }), m(ge, null, {
+      default: () => [m("h4", {
         class: "f-title-text"
-      }, [n.title])]
-    })]), g(Ee, {
+      }, [o.title])]
+    })]), m(Ee, {
       class: "col-6 text-right",
-      modelValue: y.value,
-      "onUpdate:modelValue": (l) => y.value = l,
+      modelValue: g.value,
+      "onUpdate:modelValue": (c) => g.value = c,
       canAdd: !0,
       childType: "response-toolbar-item",
       childLabel: "按钮",
       contentKey: "buttons",
-      id: y.value.id,
-      componentId: n.componentId,
+      id: g.value.id,
+      componentId: o.componentId,
       onSelectionChange: b
     }, {
-      default: () => [g(Ie, {
+      default: () => [m(Be, {
         customClass: "w-100",
         items: h.value,
-        componentId: n.componentId
+        componentId: o.componentId
       }, null)]
     })])]);
   }
-}), nn = {
-  install(n) {
-    n.component(ne.name, ne);
+}), Yt = {
+  install(o) {
+    o.component(oe.name, oe);
   },
-  register(n, e, t, s) {
-    n["page-header"] = ne, e["page-header"] = pe, s["page-header"] = { eventHandlerResolver: rt };
+  register(o, e, t, s) {
+    o["page-header"] = oe, e["page-header"] = pe, s["page-header"] = { eventHandlerResolver: ot };
   },
-  registerDesigner(n, e, t) {
-    n["page-header"] = Qt, e["page-header"] = pe;
+  registerDesigner(o, e, t) {
+    o["page-header"] = qt, e["page-header"] = pe;
   }
 };
 export {
-  ne as PageHeader,
-  nn as default,
-  rt as eventHandlerResolver,
-  st as pageHeaderDesignerProps,
+  oe as PageHeader,
+  Yt as default,
+  ot as eventHandlerResolver,
+  nt as pageHeaderDesignerProps,
   ae as pageHeaderProps,
   pe as propsResolver
 };