@farris/ui-vue 1.0.1 → 1.0.2

package/combo-list/index.esm.js

@@ -1,4 +1,4 @@
-import { ref as a, computed as I, watch as W, defineComponent as G, createVNode as p, withDirectives as Q, vModelCheckbox as Me, Fragment as re, withModifiers as Fe, vModelText as Oe, Teleport as de, createApp as Ve, onUnmounted as fe, nextTick as K, vShow as ve, onMounted as ne, mergeProps as Le, inject as De } from "vue";
+import { ref as a, computed as B, watch as W, defineComponent as G, createVNode as v, withDirectives as Q, vModelCheckbox as Me, Fragment as re, withModifiers as Fe, vModelText as Oe, Teleport as de, createApp as Le, onUnmounted as fe, nextTick as K, vShow as ve, onMounted as ne, mergeProps as Ve, inject as De } from "vue";
 const pe = {};
 function oe(e) {
   const { properties: t } = e;
@@ -15,11 +15,11 @@ function Re(e, t) {
 function Ae(e, t) {
   return Object.keys(e).filter((l) => e[l] != null).reduce((l, n) => {
     if (t.has(n)) {
-      const i = t.get(n);
-      if (typeof i == "string")
-        l[i] = e[n];
+      const s = t.get(n);
+      if (typeof s == "string")
+        l[s] = e[n];
       else {
-        const u = i(n, e[n]);
+        const u = s(n, e[n]);
         Object.assign(l, u);
       }
     } else
@@ -33,8 +33,8 @@ function Ee(e, t, o = /* @__PURE__ */ new Map()) {
 }
 function ge(e, t, o = /* @__PURE__ */ new Map()) {
   return pe[t.title] = t, (l) => {
-    const n = Ee(l, t, o), i = Object.keys(e).reduce((u, c) => (u[c] = e[c].default, u), {});
-    return Object.assign(i, n);
+    const n = Ee(l, t, o), s = Object.keys(e).reduce((u, r) => (u[r] = e[r].default, u), {});
+    return Object.assign(s, n);
   };
 }
 function me(e, t) {
@@ -287,7 +287,8 @@ const ae = {
   selectedValues: { type: String, default: "" },
   separator: { type: String, default: "," },
   textField: { type: String, default: "name" },
-  width: { type: Number, default: 300 },
+  width: { type: Number },
+  height: { type: Number },
   valueField: { type: String, default: "id" }
 }, Qe = {
   data: { type: Array, default: [] },
@@ -308,99 +309,99 @@ const ae = {
   disableField: { type: String, default: "disabled" }
 };
 function Ye(e, t, o, l, n) {
-  const i = a(e.idField), u = a(e.disableField), c = a(e.draggable), h = a(e.itemClass), s = a(e.multiSelect), r = a(e.multiSelectMode);
+  const s = a(e.idField), u = a(e.disableField), r = a(e.draggable), y = a(e.itemClass), d = a(e.multiSelect), f = a(e.multiSelectMode);
   a(!0);
-  const { isDragging: d } = o, { activeIndex: f, focusedItemId: C, hoverIndex: m } = l, { clearSelection: y, selectedItems: O, toggleSelectItem: P } = n;
-  function x(w, j) {
-    const V = {
+  const { isDragging: i } = o, { activeIndex: c, focusedItemId: m, hoverIndex: p } = l, { clearSelection: b, selectedItems: M, toggleSelectItem: P } = n;
+  function S(C, j) {
+    const L = {
       "f-list-view-group-item": !0,
-      "f-list-view-draggable-item": c.value,
-      "f-un-click": !!w.unClick,
-      "f-un-select": !!w[u.value],
-      "f-listview-active": w.__fv_index__ === f.value,
-      "f-listview-hover": !d.value && j === m.value,
-      moving: !!w.moving
+      "f-list-view-draggable-item": r.value,
+      "f-un-click": !!C.unClick,
+      "f-un-select": !!C[u.value],
+      "f-listview-active": C.__fv_index__ === c.value,
+      "f-listview-hover": !i.value && j === p.value,
+      moving: !!C.moving
     };
-    return h.value.split(" ").reduce((z, D) => (z[D] = !0, z), V), V;
+    return y.value.split(" ").reduce((z, D) => (z[D] = !0, z), L), L;
   }
-  function v(w, j) {
-    return w[i.value] || "";
+  function h(C, j) {
+    return C[s.value] || "";
   }
-  const b = I(() => !s.value);
-  function B(w, j) {
-    w.unClick || w[u.value] || (b.value && (C.value = w[i.value]), P(w, j));
+  const T = B(() => !d.value);
+  function k(C, j) {
+    C.unClick || C[u.value] || (T.value && (m.value = C[s.value]), P(C, j));
   }
-  const k = I(() => s.value && r.value === "OnCheckClearByClick"), E = I(() => !s.value || s.value && (r.value === "OnCheckAndClick" || r.value === "OnClick"));
-  function L(w, j, V) {
+  const x = B(() => d.value && f.value === "OnCheckClearByClick"), E = B(() => !d.value || d.value && (f.value === "OnCheckAndClick" || f.value === "OnClick"));
+  function V(C, j, L) {
     if (j.unClick || j[u.value]) {
-      w.preventDefault(), w.stopPropagation();
+      C.preventDefault(), C.stopPropagation();
       return;
     }
-    C.value = j[i.value], f.value = V, k.value && y(), E.value && P(j, V), t.emit("clickItem", { data: O.value, index: V });
+    m.value = j[s.value], c.value = L, x.value && b(), E.value && P(j, L), t.emit("clickItem", { data: M.value, index: L });
   }
   return {
-    getKey: v,
-    listViewItemClass: x,
-    onCheckItem: B,
-    onClickItem: L
+    getKey: h,
+    listViewItemClass: S,
+    onCheckItem: k,
+    onClickItem: V
   };
 }
 function Ze(e, t, o) {
   const l = a(e.idField), n = a(e.multiSelect);
   a(e.multiSelectMode);
-  const { getSelectionItems: i } = o, u = a(i(e.selectionValues));
-  W(() => e.selectionValues, (f) => {
-    u.value = a(i(f)).value;
+  const { getSelectionItems: s } = o, u = a(s(e.selectionValues));
+  W(() => e.selectionValues, (c) => {
+    u.value = a(s(c)).value;
   });
-  const c = I(() => !n.value);
-  function h(f) {
-    return f[l.value] || "";
+  const r = B(() => !n.value);
+  function y(c) {
+    return c[l.value] || "";
   }
-  function s(f) {
-    return u.value.findIndex((m) => h(m) === h(f));
+  function d(c) {
+    return u.value.findIndex((p) => y(p) === y(c));
   }
-  function r() {
-    u.value.forEach((f) => {
-      f.checked = !1;
+  function f() {
+    u.value.forEach((c) => {
+      c.checked = !1;
     }), u.value = [];
   }
-  function d(f, C) {
-    c.value && r();
-    const m = s(f);
-    m > -1 ? (u.value.splice(m, 1), f.checked = !1) : (u.value.push(f), f.checked = !0), t.emit("selectionChange", u.value);
+  function i(c, m) {
+    r.value && f();
+    const p = d(c);
+    p > -1 ? (u.value.splice(p, 1), c.checked = !1) : (u.value.push(c), c.checked = !0), t.emit("selectionChange", u.value);
   }
-  return { clearSelection: r, findIndexInSelectedItems: s, selectedItems: u, toggleSelectItem: d };
+  return { clearSelection: f, findIndexInSelectedItems: d, selectedItems: u, toggleSelectItem: i };
 }
 function et(e, t) {
-  function o(i) {
+  function o(s) {
     const u = [];
-    let c = i.nextNode();
-    for (; c; )
-      u.push(c), c = i.nextNode();
+    let r = s.nextNode();
+    for (; r; )
+      u.push(r), r = s.nextNode();
     return u;
   }
-  function l(i, u) {
-    const c = document.createTreeWalker(i, NodeFilter.SHOW_TEXT);
-    return o(c).map((d) => ({ textNode: d, text: (d.textContent || "").toLocaleLowerCase() })).map(({ textNode: d, text: f }) => {
-      const C = [];
-      let m = 0;
-      for (; m < f.length; ) {
-        const y = f.indexOf(u, m);
-        if (y === -1)
+  function l(s, u) {
+    const r = document.createTreeWalker(s, NodeFilter.SHOW_TEXT);
+    return o(r).map((i) => ({ textNode: i, text: (i.textContent || "").toLocaleLowerCase() })).map(({ textNode: i, text: c }) => {
+      const m = [];
+      let p = 0;
+      for (; p < c.length; ) {
+        const b = c.indexOf(u, p);
+        if (b === -1)
           break;
-        C.push(y), m = y + u.length;
+        m.push(b), p = b + u.length;
       }
-      return C.map((y) => {
-        const O = new Range();
-        return O.setStart(d, y), O.setEnd(d, y + u.length), O;
+      return m.map((b) => {
+        const M = new Range();
+        return M.setStart(i, b), M.setEnd(i, b + u.length), M;
       });
     }).flat();
   }
-  function n(i) {
-    if (!CSS.highlights || (CSS.highlights.clear(), !i || !t))
+  function n(s) {
+    if (!CSS.highlights || (CSS.highlights.clear(), !s || !t))
       return;
-    const u = l(t.value, i.toLocaleLowerCase()), c = new Highlight(...u);
-    CSS.highlights.set("search-result", c);
+    const u = l(t.value, s.toLocaleLowerCase()), r = new Highlight(...u);
+    CSS.highlights.set("search-result", r);
   }
   return { search: n };
 }
@@ -418,7 +419,7 @@ const tt = {
   emits: ["change", "update:modelValue"],
   setup(e, t) {
     const o = a(e.checked), l = a(e.disabled), n = a(e.id);
-    function i(u) {
+    function s(u) {
       u.stopPropagation(), u.preventDefault(), l.value || (o.value = !o.value, t.emit("change", {
         originalEvent: u,
         checked: o.value
@@ -426,170 +427,170 @@ const tt = {
     }
     return W(() => e.checked, (u) => {
       o.value = u;
-    }), () => p("div", {
+    }), () => v("div", {
       class: "custom-control custom-checkbox  custom-control-inline listview-checkbox"
-    }, [Q(p("input", {
+    }, [Q(v("input", {
       id: n.value,
       title: n.value,
       type: "checkbox",
       class: "custom-control-input",
       "onUpdate:modelValue": (u) => o.value = u,
       onChange: (u) => console.log(u)
-    }, null), [[Me, o.value]]), p("label", {
+    }, null), [[Me, o.value]]), v("label", {
       for: n.value,
       class: "custom-control-label",
-      onClick: (u) => i(u)
+      onClick: (u) => s(u)
     }, null)]);
   }
 });
-function se(e, t, o, l, n, i, u, c) {
-  const h = a(e.size), s = a(e.textField), r = a(e.multiSelect), d = a(e.disableField), {
-    onMouseenterItem: f,
-    onMouseoverItem: C,
-    onMouseoutItem: m
+function se(e, t, o, l, n, s, u, r) {
+  const y = a(e.size), d = a(e.textField), f = a(e.multiSelect), i = a(e.disableField), {
+    onMouseenterItem: c,
+    onMouseoverItem: m,
+    onMouseoutItem: p
   } = n, {
-    getKey: y,
-    listViewItemClass: O,
+    getKey: b,
+    listViewItemClass: M,
     onCheckItem: P,
-    onClickItem: x
-  } = i, v = I(() => ({
-    margin: h.value === "small" ? "0.25rem 0" : "10px 0"
+    onClickItem: S
+  } = s, h = B(() => ({
+    margin: y.value === "small" ? "0.25rem 0" : "10px 0"
   }));
-  function b(B, k, E) {
-    return B.checked = u.findIndexInSelectedItems(B) > -1, p("li", {
-      class: O(B, k),
-      id: y(B, k),
-      key: y(B, k),
-      onClick: (L) => x(L, B, k),
-      onMouseenter: (L) => f(L, B, k),
-      onMouseover: (L) => C(L, B, k),
-      onMouseout: (L) => m(L, B, k)
-    }, [r.value && p("div", {
+  function T(k, x, E) {
+    return k.checked = u.findIndexInSelectedItems(k) > -1, v("li", {
+      class: M(k, x),
+      id: b(k, x),
+      key: b(k, x),
+      onClick: (V) => S(V, k, x),
+      onMouseenter: (V) => c(V, k, x),
+      onMouseover: (V) => m(V, k, x),
+      onMouseout: (V) => p(V, k, x)
+    }, [f.value && v("div", {
       class: "f-list-select",
-      onClick: (L) => L.stopPropagation()
-    }, [p(le, {
-      id: "list-" + y(B, k),
-      disabled: B[d.value] || B.unClick,
-      checked: B.checked,
-      onChange: (L) => P(B, k)
-    }, null)]), p("div", {
+      onClick: (V) => V.stopPropagation()
+    }, [v(le, {
+      id: "list-" + b(k, x),
+      disabled: k[i.value] || k.unClick,
+      checked: k.checked,
+      onChange: (V) => P(k, x)
+    }, null)]), v("div", {
       class: "f-list-content"
-    }, [p("div", {
-      style: v.value
-    }, [B[s.value]])])]);
+    }, [v("div", {
+      style: h.value
+    }, [k[d.value]])])]);
   }
   return {
-    renderItem: b
+    renderItem: T
   };
 }
-function nt(e, t, o, l, n, i, u, c) {
-  const h = a(e.multiSelect), s = a(e.disableField), {
-    onMouseenterItem: r,
-    onMouseoverItem: d,
-    onMouseoutItem: f
+function nt(e, t, o, l, n, s, u, r) {
+  const y = a(e.multiSelect), d = a(e.disableField), {
+    onMouseenterItem: f,
+    onMouseoverItem: i,
+    onMouseoutItem: c
   } = n, {
-    getKey: C,
-    listViewItemClass: m,
-    onCheckItem: y,
-    onClickItem: O
-  } = i;
-  function P(v, b, B) {
-    return t.slots.content ? p(re, null, [t.slots.content && t.slots.content({
-      item: v,
-      index: b,
-      selectedItem: B
-    })]) : p("div", {
+    getKey: m,
+    listViewItemClass: p,
+    onCheckItem: b,
+    onClickItem: M
+  } = s;
+  function P(h, T, k) {
+    return t.slots.content ? v(re, null, [t.slots.content && t.slots.content({
+      item: h,
+      index: T,
+      selectedItem: k
+    })]) : v("div", {
       style: "margin: 10px 0;"
-    }, [v.name]);
-  }
-  function x(v, b, B) {
-    return p("li", {
-      class: m(v, b),
-      id: C(v, b),
-      key: C(v, b),
-      onClick: (k) => O(k, v, b),
-      onMouseenter: (k) => r(k, v, b),
-      onMouseover: (k) => d(k, v, b),
-      onMouseout: (k) => f(k, v, b)
-    }, [h.value && p("div", {
+    }, [h.name]);
+  }
+  function S(h, T, k) {
+    return v("li", {
+      class: p(h, T),
+      id: m(h, T),
+      key: m(h, T),
+      onClick: (x) => M(x, h, T),
+      onMouseenter: (x) => f(x, h, T),
+      onMouseover: (x) => i(x, h, T),
+      onMouseout: (x) => c(x, h, T)
+    }, [y.value && v("div", {
       class: "f-list-select",
-      onClick: (k) => k.stopPropagation()
-    }, [p(le, {
-      id: "list-" + C(v, b),
-      disabled: v[s.value] || v.unClick,
-      checked: v.checked,
-      onChange: (k) => y(v, b)
-    }, null)]), p("div", {
+      onClick: (x) => x.stopPropagation()
+    }, [v(le, {
+      id: "list-" + m(h, T),
+      disabled: h[d.value] || h.unClick,
+      checked: h.checked,
+      onChange: (x) => b(h, T)
+    }, null)]), v("div", {
       class: "f-list-content"
-    }, [P(v, b, B)])]);
+    }, [P(h, T, k)])]);
   }
   return {
-    renderItem: x
+    renderItem: S
   };
 }
-function ot(e, t, o, l, n, i, u, c) {
-  const h = a(e.multiSelect), s = a(e.disableField), {
-    onMouseenterItem: r,
-    onMouseoverItem: d,
-    onMouseoutItem: f
+function ot(e, t, o, l, n, s, u, r) {
+  const y = a(e.multiSelect), d = a(e.disableField), {
+    onMouseenterItem: f,
+    onMouseoverItem: i,
+    onMouseoutItem: c
   } = n, {
-    getKey: C,
-    listViewItemClass: m,
-    onCheckItem: y,
-    onClickItem: O
-  } = i, {
+    getKey: m,
+    listViewItemClass: p,
+    onCheckItem: b,
+    onClickItem: M
+  } = s, {
     dragstart: P,
-    dragenter: x,
-    dragover: v,
-    dragend: b
+    dragenter: S,
+    dragover: h,
+    dragend: T
   } = l, {
-    removeItem: B
-  } = c, k = I(() => ({
-    margin: h.value ? "10px 0" : "10px 0px 10px 14px"
+    removeItem: k
+  } = r, x = B(() => ({
+    margin: y.value ? "10px 0" : "10px 0px 10px 14px"
   }));
-  function E(V) {
-    return p("div", {
-      style: k.value
-    }, [V.name]);
+  function E(L) {
+    return v("div", {
+      style: x.value
+    }, [L.name]);
   }
-  function L() {
+  function V() {
     return t.slots.itemContent ? t.slots.itemContent : E;
   }
-  const w = L();
-  function j(V, R, z) {
-    return p("li", {
-      class: m(V, R),
-      id: C(V, R),
-      key: C(V, R),
-      onClick: (D) => O(D, V, R),
-      onMouseenter: (D) => r(D, V, R),
-      onMouseover: (D) => d(D, V, R),
-      onMouseout: (D) => f(D, V, R),
+  const C = V();
+  function j(L, R, z) {
+    return v("li", {
+      class: p(L, R),
+      id: m(L, R),
+      key: m(L, R),
+      onClick: (D) => M(D, L, R),
+      onMouseenter: (D) => f(D, L, R),
+      onMouseover: (D) => i(D, L, R),
+      onMouseout: (D) => c(D, L, R),
       draggable: "true",
-      onDragstart: (D) => P(D, V, R),
-      onDragenter: (D) => x(D, R),
-      onDragend: (D) => b(D, V),
-      onDragover: (D) => v(D, R)
-    }, [h.value && p("div", {
+      onDragstart: (D) => P(D, L, R),
+      onDragenter: (D) => S(D, R),
+      onDragend: (D) => T(D, L),
+      onDragover: (D) => h(D, R)
+    }, [y.value && v("div", {
       class: "f-list-select",
       onClick: (D) => D.stopPropagation()
-    }, [p(le, {
-      id: "list-" + C(V, R),
-      disabled: V[s.value] || V.unClick,
-      checked: V.checked,
-      onChange: (D) => y(V, R)
-    }, null)]), p("div", {
+    }, [v(le, {
+      id: "list-" + m(L, R),
+      disabled: L[d.value] || L.unClick,
+      checked: L.checked,
+      onChange: (D) => b(L, R)
+    }, null)]), v("div", {
       class: "f-list-content"
-    }, [w(V)]), p("div", {
+    }, [C(L)]), v("div", {
       class: "f-list-remove",
-      onClick: (D) => B(R)
-    }, [p("div", {
+      onClick: (D) => k(R)
+    }, [v("div", {
       class: "f-list-remove-icon"
-    }, [p("i", {
+    }, [v("i", {
       class: "f-icon f-icon-remove_face"
-    }, null)])]), p("div", {
+    }, null)])]), v("div", {
       class: "f-list-handle"
-    }, [p("div", null, [p("i", {
+    }, [v("div", null, [v("i", {
       class: "f-icon f-icon-drag-vertical"
     }, null)])])]);
   }
@@ -599,7 +600,7 @@ function ot(e, t, o, l, n, i, u, c) {
 }
 function at(e, t, o) {
   function l() {
-    return t.slots.header && p("div", {
+    return t.slots.header && v("div", {
       class: "f-list-view-header"
     }, [t.slots.header()]);
   }
@@ -608,121 +609,121 @@ function at(e, t, o) {
   };
 }
 function ce(e, t, o) {
-  const l = a(e.headerClass), n = a(e.placeholder), i = a(""), u = I(() => !i.value), c = I(() => !!i.value);
-  function h(f) {
-    i.value = "";
+  const l = a(e.headerClass), n = a(e.placeholder), s = a(""), u = B(() => !s.value), r = B(() => !!s.value);
+  function y(c) {
+    s.value = "";
   }
-  W(i, (f) => {
-    o.search(f);
+  W(s, (c) => {
+    o.search(c);
   });
-  const s = I(() => {
-    const f = {
+  const d = B(() => {
+    const c = {
       "form-group": !0,
       "farris-form-group": !0
     };
-    return l.value && l.value.split(" ").reduce((m, y) => (m[y] = !0, m), f), f;
+    return l.value && l.value.split(" ").reduce((p, b) => (p[b] = !0, p), c), c;
   });
-  function r(f) {
+  function f(c) {
   }
-  function d() {
-    return p("div", {
+  function i() {
+    return v("div", {
       class: "f-list-view-header",
-      onClick: Fe(r, ["prevent", "stop"])
-    }, [p("div", {
-      class: s.value
-    }, [p("div", {
+      onClick: Fe(f, ["prevent", "stop"])
+    }, [v("div", {
+      class: d.value
+    }, [v("div", {
       class: "farris-input-wrap"
-    }, [p("div", {
+    }, [v("div", {
       class: "f-cmp-inputgroup"
-    }, [p("div", {
+    }, [v("div", {
       class: "input-group f-state-editable"
-    }, [Q(p("input", {
+    }, [Q(v("input", {
       class: "form-control f-utils-fill text-left",
-      "onUpdate:modelValue": (f) => i.value = f,
+      "onUpdate:modelValue": (c) => s.value = c,
       name: "input-group-value",
       type: "text",
       placeholder: n.value,
       autocomplete: "off"
-    }, null), [[Oe, i.value]]), p("div", {
+    }, null), [[Oe, s.value]]), v("div", {
       class: "input-group-append"
-    }, [c.value && p("span", {
+    }, [r.value && v("span", {
       class: "input-group-text input-group-clear",
-      onClick: (f) => h()
-    }, [p("i", {
+      onClick: (c) => y()
+    }, [v("i", {
       class: "f-icon f-icon-close-circle"
-    }, null)]), u.value && p("span", {
+    }, null)]), u.value && v("span", {
       class: "input-group-text"
-    }, [p("span", {
+    }, [v("span", {
       class: "f-icon f-icon-search"
     }, null)])])])])])])]);
   }
   return {
-    renderHeader: d
+    renderHeader: i
   };
 }
 function lt(e, t) {
-  const o = a(e.idField), l = a(e.data), n = a(e.data), i = a(e.keepOrder);
+  const o = a(e.idField), l = a(e.data), n = a(e.data), s = a(e.keepOrder);
   function u() {
-    const s = l.value.map((r, d) => typeof r != "object" ? { __fv_index__: d, name: r } : (r.__fv_index__ = d, r));
-    return n.value = s, s;
+    const d = l.value.map((f, i) => typeof f != "object" ? { __fv_index__: i, name: f } : (f.__fv_index__ = i, f));
+    return n.value = d, d;
   }
-  const c = a(u());
+  const r = a(u());
   W(
     () => e.data,
-    (s) => {
-      if (i.value) {
-        const r = s.reduce((m, y) => (m.set(y.id, !0), m), /* @__PURE__ */ new Map()), d = l.value.reduce((m, y) => (m.set(y.id, !0), m), /* @__PURE__ */ new Map()), f = c.value.filter((m) => r.has(m.id)), C = s.filter((m) => !d.has(m.id));
-        l.value = [...f, ...C];
+    (d) => {
+      if (s.value) {
+        const f = d.reduce((p, b) => (p.set(b.id, !0), p), /* @__PURE__ */ new Map()), i = l.value.reduce((p, b) => (p.set(b.id, !0), p), /* @__PURE__ */ new Map()), c = r.value.filter((p) => f.has(p.id)), m = d.filter((p) => !i.has(p.id));
+        l.value = [...c, ...m];
       } else
-        l.value = s;
-      c.value = u();
+        l.value = d;
+      r.value = u();
     }
   );
-  function h(s) {
-    return s.map((d) => {
-      const f = n.value.findIndex((C) => C[o.value] === d);
-      return f > -1 ? n.value[f] : null;
-    }).filter((d) => d != null);
+  function y(d) {
+    return d.map((i) => {
+      const c = n.value.findIndex((m) => m[o.value] === i);
+      return c > -1 ? n.value[c] : null;
+    }).filter((i) => i != null);
   }
   return {
-    dataView: c,
-    getSelectionItems: h
+    dataView: r,
+    getSelectionItems: y
   };
 }
 function ut(e, t, o, l) {
-  const n = a(e.idField), { dataView: i } = o, u = a(-1), c = a(!1), { activeIndex: h, focusedItemId: s, hoverIndex: r, resumeHover: d, suspendHover: f } = l;
-  function C(P, x, v) {
-    P.stopPropagation(), f(), x && setTimeout(() => {
-      u.value = v, c.value = !0, x.moving = !0;
+  const n = a(e.idField), { dataView: s } = o, u = a(-1), r = a(!1), { activeIndex: y, focusedItemId: d, hoverIndex: f, resumeHover: i, suspendHover: c } = l;
+  function m(P, S, h) {
+    P.stopPropagation(), c(), S && setTimeout(() => {
+      u.value = h, r.value = !0, S.moving = !0;
     });
   }
-  function m(P, x) {
-    if (P.preventDefault(), u.value !== x) {
-      const v = i.value[u.value], b = i.value;
-      b.splice(u.value, 1), b.splice(x, 0, v), u.value = x;
+  function p(P, S) {
+    if (P.preventDefault(), u.value !== S) {
+      const h = s.value[u.value], T = s.value;
+      T.splice(u.value, 1), T.splice(S, 0, h), u.value = S;
     }
   }
-  function y(P, x) {
+  function b(P, S) {
     P.preventDefault(), P.dataTransfer && (P.dataTransfer.dropEffect = "move");
   }
-  function O(P, x) {
-    x && (x.moving = !1), i.value.forEach((v, b) => {
-      v.__fv_index__ = b;
-    }), c.value = !1, d(), r.value = x.__fv_index__, h.value = x.__fv_index__, s.value = x[n.value], t.emit("change", i.value);
+  function M(P, S) {
+    S && (S.moving = !1), s.value.forEach((h, T) => {
+      h.__fv_index__ = T;
+    }), r.value = !1, i(), f.value = S.__fv_index__, y.value = S.__fv_index__, d.value = S[n.value], t.emit("change", s.value);
   }
   return {
-    dragstart: C,
-    dragenter: m,
-    dragover: y,
-    dragend: O,
-    isDragging: c
+    dragstart: m,
+    dragenter: p,
+    dragover: b,
+    dragend: M,
+    isDragging: r
   };
 }
 function it(e, t, o) {
   const { dataView: l } = o;
-  function n(i) {
-    if (i > -1 && i < l.value.length) {
-      const u = l.value.splice(i, 1);
+  function n(s) {
+    if (s > -1 && s < l.value.length) {
+      const u = l.value.splice(s, 1);
       t.emit("removeItem", u[0]);
     }
   }
@@ -730,19 +731,19 @@ function it(e, t, o) {
 }
 function st() {
   const e = a(-1), t = a(""), o = a(-1), l = a(!1);
-  function n(s, r, d) {
-    o.value = d;
+  function n(d, f, i) {
+    o.value = i;
   }
-  function i(s, r, d) {
-    l.value || (o.value = d);
+  function s(d, f, i) {
+    l.value || (o.value = i);
   }
-  function u(s, r, d) {
+  function u(d, f, i) {
     o.value = -1;
   }
-  function c() {
+  function r() {
     l.value = !0;
   }
-  function h() {
+  function y() {
     l.value = !1;
   }
   return {
@@ -750,10 +751,10 @@ function st() {
     focusedItemId: t,
     hoverIndex: o,
     onMouseenterItem: n,
-    onMouseoverItem: i,
+    onMouseoverItem: s,
     onMouseoutItem: u,
-    resumeHover: h,
-    suspendHover: c
+    resumeHover: y,
+    suspendHover: r
   };
 }
 const ct = /* @__PURE__ */ G({
@@ -761,56 +762,56 @@ const ct = /* @__PURE__ */ G({
   props: Qe,
   emits: ["checkValuesChange", "clickItem", "selectionChange", "removeItem", "change"],
   setup(e, t) {
-    const o = a(), l = a(e.view), n = a(e.header), i = a(e.multiSelect), u = a(e.view === "CardView"), c = a(!0), h = a({}), s = a("暂无数据");
+    const o = a(), l = a(e.view), n = a(e.header), s = a(e.multiSelect), u = a(e.view === "CardView"), r = a(!0), y = a({}), d = a("暂无数据");
     a(!0), a(!1), a("id");
-    const r = lt(e), {
-      dataView: d
-    } = r, f = I(() => {
-      const M = {
+    const f = lt(e), {
+      dataView: i
+    } = f, c = B(() => {
+      const F = {
         "f-list-view": !0,
-        "f-list-view-multiple": i.value
+        "f-list-view-multiple": s.value
       };
-      return e.size !== "default" && (M[`${e.size}-item`] = !0), M;
-    }), C = I(() => ({
+      return e.size !== "default" && (F[`${e.size}-item`] = !0), F;
+    }), m = B(() => ({
       "f-list-view-group": !0,
       "d-flex": u.value,
       "flex-wrap": u.value
-    })), m = I(() => !!d.value && d.value.length > 0), y = st(), O = Ze(e, t, r), P = ut(e, t, r, y), x = it(e, t, r), v = Ye(e, t, P, y, O), b = et(e, o), B = I(() => d.value.length === 0), k = I(() => B.value && !t.slots.empty), E = I(() => !!t.slots.footer || c.value);
-    function L() {
+    })), p = B(() => !!i.value && i.value.length > 0), b = st(), M = Ze(e, t, f), P = ut(e, t, f, b), S = it(e, t, f), h = Ye(e, t, P, b, M), T = et(e, o), k = B(() => i.value.length === 0), x = B(() => k.value && !t.slots.empty), E = B(() => !!t.slots.footer || r.value);
+    function V() {
       return l.value === "SingleView" ? se : l.value === "DraggableView" ? ot : l.value === "ContentView" && t.slots.content ? nt : se;
     }
-    const w = L(), {
+    const C = V(), {
       renderItem: j
-    } = w(e, t, r, P, y, v, O, x);
-    function V() {
+    } = C(e, t, f, P, b, h, M, S);
+    function L() {
       return n.value === "SearchBar" ? ce : n.value === "ContentHeader" ? at : ce;
     }
-    const R = V(), {
+    const R = L(), {
       renderHeader: z
-    } = R(e, t, b);
-    function D(M) {
-      b.search(M);
+    } = R(e, t, T);
+    function D(F) {
+      T.search(F);
     }
     t.expose({
       search: D
     });
-    function F(M) {
-      i.value && (M.preventDefault(), M.stopPropagation());
+    function O(F) {
+      s.value && (F.preventDefault(), F.stopPropagation());
     }
-    return () => p("div", {
-      class: f.value,
-      onClick: F
-    }, [z(), p("div", {
+    return () => v("div", {
+      class: c.value,
+      onClick: O
+    }, [z(), v("div", {
       ref: o,
       class: "f-list-view-content"
-    }, [p("ul", {
-      class: C.value,
+    }, [v("ul", {
+      class: m.value,
       style: "list-style: none;"
-    }, [m.value && d.value.map((M, A) => j(M, A, h)), k.value && p("div", {
+    }, [p.value && i.value.map((F, A) => j(F, A, y)), x.value && v("div", {
       class: "f-list-view-emptydata"
-    }, [p("p", {
+    }, [v("p", {
       class: "f-empty-title"
-    }, [s.value])]), t.slots.empty && t.slots.empty()])]), E.value && p("div", {
+    }, [d.value])]), t.slots.empty && t.slots.empty()])]), E.value && v("div", {
       class: "f-list-view-footer"
     }, [t.slots.footer && t.slots.footer()])]);
   }
@@ -819,28 +820,32 @@ const ct = /* @__PURE__ */ G({
   props: Je,
   emits: ["selectionChange"],
   setup(e, t) {
-    const o = a(e.dataSource), l = a([]), n = a(e.separator), i = a(e.selectedValues.split(n.value));
+    const o = a(e.dataSource), l = a([]), n = a(e.separator), s = a(e.width), u = a(e.height), r = a(e.selectedValues.split(n.value));
     W(e.dataSource, () => {
       o.value = e.dataSource;
     });
-    const u = I(() => e.enableSearch ? "SearchBar" : "ContentHeader");
-    function c(h) {
-      l.value = h.map((s) => Object.assign({}, s)), i.value = h.map((s) => s[e.idField]), t.emit("selectionChange", l.value);
+    const y = B(() => e.enableSearch ? "SearchBar" : "ContentHeader"), d = B(() => {
+      const i = {};
+      return s.value !== void 0 && (i.width = `${s.value}px`), u.value !== void 0 && (i.height = `${u.value}px`), i;
+    });
+    function f(i) {
+      l.value = i.map((c) => Object.assign({}, c)), r.value = i.map((c) => c[e.idField]), t.emit("selectionChange", l.value);
     }
-    return () => p("div", {
-      class: "f-combo-list-container"
-    }, [p(ct, {
+    return () => v("div", {
+      class: "f-combo-list-container",
+      style: d.value
+    }, [v(ct, {
       size: "small",
       itemClass: "f-combo-list-item",
-      header: u.value,
+      header: y.value,
       headerClass: "f-combo-list-search-box",
       data: o.value,
       idField: e.idField,
       textField: e.textField,
       multiSelect: e.multiSelect,
       multiSelectMode: "OnCheckAndClick",
-      "selection-values": i.value,
-      onSelectionChange: c
+      "selection-values": r.value,
+      onSelectionChange: f
     }, null)]);
   }
 }), dt = /* @__PURE__ */ new Map([
@@ -1142,40 +1147,40 @@ const Ct = {
   emits: ["click"],
   setup(e, t) {
     const o = a(e.popupContentPosition), l = a(e.host);
-    function n(c) {
-      t.emit("click"), c.preventDefault(), c.stopPropagation();
+    function n(r) {
+      t.emit("click"), r.preventDefault(), r.stopPropagation();
     }
-    const i = I(() => {
-      const c = l.value;
-      if (c) {
-        const h = c.getBoundingClientRect(), {
-          left: s,
-          top: r,
-          height: d
-        } = h;
+    const s = B(() => {
+      const r = l.value;
+      if (r) {
+        const y = r.getBoundingClientRect(), {
+          left: d,
+          top: f,
+          height: i
+        } = y;
         return {
-          left: s,
-          top: r + d
+          left: d,
+          top: f + i
         };
       }
       return o.value;
-    }), u = I(() => ({
+    }), u = B(() => ({
       position: "relative",
-      left: `${i.value.left}px`,
-      top: `${i.value.top}px`
+      left: `${s.value.left}px`,
+      top: `${s.value.top}px`
     }));
-    return () => p(de, {
+    return () => v(de, {
       to: "body"
     }, {
       default: () => {
-        var c, h;
-        return [p("div", {
+        var r, y;
+        return [v("div", {
           class: "overlay-container",
           style: "pointer-events: auto;",
-          onClick: (s) => n(s)
-        }, [p("div", {
+          onClick: (d) => n(d)
+        }, [v("div", {
           style: u.value
-        }, [(h = (c = t.slots).default) == null ? void 0 : h.call(c)])])];
+        }, [(y = (r = t.slots).default) == null ? void 0 : y.call(r)])])];
       }
     });
   }
@@ -1194,225 +1199,225 @@ function Tt(e) {
   }), n = () => {
     l(), o && o.unmount();
   };
-  return o = Ve({
+  return o = Le({
     setup() {
       fe(() => {
         document.body.removeChild(t);
       });
-      const i = St(e);
-      return () => p(wt, {
+      const s = St(e);
+      return () => v(wt, {
         "popup-content-position": e.popupPosition,
         host: e.host,
         onClick: n
       }, {
-        default: () => [i && i()]
+        default: () => [s && s()]
       });
     }
   }), document.body.appendChild(t), o.mount(t), o;
 }
-class Bt {
+class It {
   static show(t) {
     return Tt(t);
   }
 }
-function It(e, t, o, l) {
-  const n = a(e.buttonBehavior), i = a(e.popupOnInput), u = I(() => ({
+function Bt(e, t, o, l) {
+  const n = a(e.buttonBehavior), s = a(e.popupOnInput), u = B(() => ({
     "input-group-append": !0,
     "append-force-show": e.showButtonWhenDisabled && (e.readonly || e.disable)
-  })), c = I(() => e.showButtonWhenDisabled || (!e.editable || !e.readonly) && !e.disable);
-  async function h(f) {
-    if (c.value) {
-      const C = !!t.slots.default;
-      n.value === "Overlay" && Bt.show({
+  })), r = B(() => e.showButtonWhenDisabled || (!e.editable || !e.readonly) && !e.disable);
+  async function y(c) {
+    if (r.value) {
+      const m = !!t.slots.default;
+      n.value === "Overlay" && It.show({
         host: o.value,
         render: () => {
           if (t.slots.default)
             return t.slots.default();
         }
-      }), C && n.value === "Popup" && l.togglePopup(), C && i.value && l.hidePopup(), t.emit("clickButton", { origin: f, value: e.modelValue });
+      }), m && n.value === "Popup" && l.togglePopup(), m && s.value && l.hidePopup(), t.emit("clickButton", { origin: c, value: e.modelValue });
     }
-    f.stopPropagation();
+    c.stopPropagation();
   }
-  function s(f) {
-    t.emit("mouseEnterIcon", f);
+  function d(c) {
+    t.emit("mouseEnterIcon", c);
   }
-  function r(f) {
-    t.emit("mouseLeaveIcon", f);
+  function f(c) {
+    t.emit("mouseLeaveIcon", c);
   }
-  function d() {
+  function i() {
     t.emit("mouseOverButton");
   }
   return {
     buttonClass: u,
-    onClickButton: h,
-    onMouseEnterButton: s,
-    onMouseLeaveButton: r,
-    onMouseOverButton: d
+    onClickButton: y,
+    onMouseEnterButton: d,
+    onMouseLeaveButton: f,
+    onMouseOverButton: i
   };
 }
-function kt(e, t, o, l, n, i) {
-  const u = a(!1), c = I(() => e.enableClear && !e.readonly && !e.disable), { changeTextBoxValue: h } = i;
-  function s(C) {
-    u.value = C;
+function kt(e, t, o, l, n, s) {
+  const u = a(!1), r = B(() => e.enableClear && !e.readonly && !e.disable), { changeTextBoxValue: y } = s;
+  function d(m) {
+    u.value = m;
   }
   W(n, () => {
-    l.value ? s(!!n.value) : s(!1);
+    l.value ? d(!!n.value) : d(!1);
   });
-  function r(C) {
-    const m = !e.readonly && !e.disable && e.editable, y = !e.editable;
-    C.stopPropagation(), (m || y) && (h("", !1), s(!u.value), t.emit("clear"));
+  function f(m) {
+    const p = !e.readonly && !e.disable && e.editable, b = !e.editable;
+    m.stopPropagation(), (p || b) && (y("", !1), d(!u.value), t.emit("clear"));
   }
-  function d(C) {
-    if (c.value) {
+  function i(m) {
+    if (r.value) {
       if (!o.value) {
-        s(!1);
+        d(!1);
         return;
       }
-      (!e.editable || !e.readonly) && !e.disable && s(!0);
+      (!e.editable || !e.readonly) && !e.disable && d(!0);
     }
   }
-  function f(C) {
-    c.value && s(!1);
+  function c(m) {
+    r.value && d(!1);
   }
   return {
-    enableClearButton: c,
+    enableClearButton: r,
     showClearButton: u,
-    onClearValue: r,
-    onMouseEnterTextBox: d,
-    onMouseLeaveTextBox: f
+    onClearValue: f,
+    onMouseEnterTextBox: i,
+    onMouseLeaveTextBox: c
   };
 }
 function xt(e, t, o, l, n) {
-  const i = a(e.popupOnInput), u = a(e.popupOnFocus), { shouldPopupContent: c } = n, h = I(() => e.enableTitle ? o.value : ""), s = I(() => (e.disable || e.readonly) && !e.forcePlaceholder ? "" : e.placeholder), r = I(() => e.readonly || !e.editable);
-  let d = !1;
-  const f = I(() => !e.disable && d), C = I(() => ({
+  const s = a(e.popupOnInput), u = a(e.popupOnFocus), { shouldPopupContent: r } = n, y = B(() => e.enableTitle ? o.value : ""), d = B(() => (e.disable || e.readonly) && !e.forcePlaceholder ? "" : e.placeholder), f = B(() => e.readonly || !e.editable);
+  let i = !1;
+  const c = B(() => !e.disable && i), m = B(() => ({
     "text-left": e.textAlign === "left",
     "text-center": e.textAlign === "center",
     "text-right": e.textAlign === "right",
     "form-control": !0,
     "f-utils-fill": !0
-  })), m = I(() => ({
+  })), p = B(() => ({
     "input-group": !0,
     "f-state-disable": e.disable,
     "f-state-editable": e.editable && !e.disable && !e.readonly,
     "f-state-readonly": e.readonly && !e.disable,
-    "f-state-focus": f.value
+    "f-state-focus": c.value
   }));
-  function y(w, j = !0) {
-    o.value !== w && (o.value = w, j && t.emit("change", w), t.emit("update:modelValue", w));
+  function b(C, j = !0) {
+    o.value !== C && (o.value = C, j && t.emit("change", C), t.emit("update:modelValue", C));
   }
-  function O(w) {
-    c.value = !1, y(w, !0);
+  function M(C) {
+    r.value = !1, b(C, !0);
   }
   W(
     () => e.modelValue,
-    (w) => {
-      o.value = w, t.emit("change", w);
+    (C) => {
+      o.value = C, t.emit("change", C);
     }
   );
-  function P(w) {
-    d = !1, t.emit("blur", w), w.stopPropagation();
+  function P(C) {
+    i = !1, t.emit("blur", C), C.stopPropagation();
   }
-  function x(w) {
-    t.emit("click", w);
+  function S(C) {
+    t.emit("click", C);
   }
-  function v(w) {
+  function h(C) {
     if (e.disable) {
-      d = !0;
+      i = !0;
       return;
     }
-    d = !0, r.value || (t.emit("focus", w), u.value && !c.value && n.popup());
+    i = !0, f.value || (t.emit("focus", C), u.value && !r.value && n.popup());
   }
-  function b(w) {
-    t.emit("input", w.target.value);
-    const j = w.target.value;
-    l.value = j, o.value !== j && y(j, !1), i.value && !c.value && n.popup();
+  function T(C) {
+    t.emit("input", C.target.value);
+    const j = C.target.value;
+    l.value = j, o.value !== j && b(j, !1), s.value && !r.value && n.popup();
   }
-  function B(w) {
-    w.target.tagName !== "INPUT" && w.preventDefault(), w.stopPropagation();
+  function k(C) {
+    C.target.tagName !== "INPUT" && C.preventDefault(), C.stopPropagation();
   }
-  function k(w) {
-    t.emit("keydown", w);
+  function x(C) {
+    t.emit("keydown", C);
   }
-  function E(w) {
-    w.key === "Enter" && (i.value || u.value) && n.hidePopup(), t.emit("keyup", w);
+  function E(C) {
+    C.key === "Enter" && (s.value || u.value) && n.hidePopup(), t.emit("keyup", C);
   }
-  function L(w) {
-    const j = w.target.value;
-    w.stopPropagation(), y(j);
+  function V(C) {
+    const j = C.target.value;
+    C.stopPropagation(), b(j);
   }
   return {
-    hasFocusedTextBox: f,
-    isTextBoxReadonly: r,
-    textBoxClass: C,
-    textBoxPlaceholder: s,
-    textBoxTitle: h,
-    inputGroupClass: m,
-    changeTextBoxValue: y,
-    commitValue: O,
+    hasFocusedTextBox: c,
+    isTextBoxReadonly: f,
+    textBoxClass: m,
+    textBoxPlaceholder: d,
+    textBoxTitle: y,
+    inputGroupClass: p,
+    changeTextBoxValue: b,
+    commitValue: M,
     onBlurTextBox: P,
-    onClickTextBox: x,
-    onFocusTextBox: v,
-    onInput: b,
-    onKeyDownTextBox: k,
+    onClickTextBox: S,
+    onFocusTextBox: h,
+    onInput: T,
+    onKeyDownTextBox: x,
     onKeyUpTextBox: E,
-    onMouseDownTextBox: B,
-    onTextBoxValueChange: L
+    onMouseDownTextBox: k,
+    onTextBoxValueChange: V
   };
 }
 function Pt(e, t, o) {
   const l = a(), n = a(!1);
-  function i() {
-    const s = l.value;
-    s && s.show(o.value);
+  function s() {
+    const d = l.value;
+    d && d.show(o.value);
   }
   async function u() {
-    !!t.slots.default && (n.value = !n.value, await K(), i());
+    !!t.slots.default && (n.value = !n.value, await K(), s());
   }
-  async function c() {
-    !!t.slots.default && (n.value = !0, await K(), i());
+  async function r() {
+    !!t.slots.default && (n.value = !0, await K(), s());
   }
-  function h() {
+  function y() {
     n.value = !1;
   }
-  return { hidePopup: h, popup: c, shouldPopupContent: n, togglePopup: u, popoverRef: l };
+  return { hidePopup: y, popup: r, shouldPopupContent: n, togglePopup: u, popoverRef: l };
 }
 function Mt(e, t, o) {
   const {
     isTextBoxReadonly: l,
     textBoxClass: n,
-    textBoxPlaceholder: i,
+    textBoxPlaceholder: s,
     textBoxTitle: u,
-    onBlurTextBox: c,
-    onClickTextBox: h,
-    onFocusTextBox: s,
-    onInput: r,
-    onKeyDownTextBox: d,
-    onKeyUpTextBox: f,
-    onMouseDownTextBox: C,
-    onTextBoxValueChange: m
+    onBlurTextBox: r,
+    onClickTextBox: y,
+    onFocusTextBox: d,
+    onInput: f,
+    onKeyDownTextBox: i,
+    onKeyUpTextBox: c,
+    onMouseDownTextBox: m,
+    onTextBoxValueChange: p
   } = o;
-  return () => p("input", {
+  return () => v("input", {
     name: "input-group-value",
     autocomplete: e.autoComplete ? "on" : "off",
     class: n.value,
     disabled: e.disable,
     maxlength: e.maxLength,
     minlength: e.minLength,
-    placeholder: i.value,
+    placeholder: s.value,
     readonly: l.value,
     tabindex: e.tabIndex,
     title: u.value,
     type: e.inputType,
     value: t.value,
-    onBlur: c,
-    onChange: m,
-    onClick: h,
-    onFocus: s,
-    onInput: r,
-    onKeydown: d,
-    onKeyup: f,
-    onMousedown: C
+    onBlur: r,
+    onChange: p,
+    onClick: y,
+    onFocus: d,
+    onInput: f,
+    onKeydown: i,
+    onKeyup: c,
+    onMousedown: m
   }, null);
 }
 const Ft = {
@@ -1434,157 +1439,157 @@ const Ft = {
   draggable: { Type: Boolean, default: !1 }
 };
 function Ot(e, t, o, l) {
-  const n = a(-1), i = a(!1);
-  function u(r, d, f) {
-    r.stopPropagation(), d && setTimeout(() => {
-      n.value = f, i.value = !0, d.moving = !0;
+  const n = a(-1), s = a(!1);
+  function u(f, i, c) {
+    f.stopPropagation(), i && setTimeout(() => {
+      n.value = c, s.value = !0, i.moving = !0;
     });
   }
-  function c(r, d) {
-    if (r.preventDefault(), n.value !== d) {
-      const f = l.value[n.value], C = l.value;
-      C.splice(n.value, 1), C.splice(d, 0, f), n.value = d;
+  function r(f, i) {
+    if (f.preventDefault(), n.value !== i) {
+      const c = l.value[n.value], m = l.value;
+      m.splice(n.value, 1), m.splice(i, 0, c), n.value = i;
     }
   }
-  function h(r, d) {
-    r.preventDefault(), r.dataTransfer && (r.dataTransfer.dropEffect = "move");
+  function y(f, i) {
+    f.preventDefault(), f.dataTransfer && (f.dataTransfer.dropEffect = "move");
   }
-  function s(r, d) {
-    d && (d.moving = !1), o.value = l.value.filter((f) => f.type === "Tag").map((f) => f.payload), i.value = !1, t.emit("change", o.value);
+  function d(f, i) {
+    i && (i.moving = !1), o.value = l.value.filter((c) => c.type === "Tag").map((c) => c.payload), s.value = !1, t.emit("change", o.value);
   }
   return {
     dragstart: u,
-    dragenter: c,
-    dragover: h,
-    dragend: s,
-    isDragging: i
+    dragenter: r,
+    dragover: y,
+    dragend: d,
+    isDragging: s
   };
 }
-const Vt = /* @__PURE__ */ G({
+const Lt = /* @__PURE__ */ G({
   name: "FTags",
   props: Ft,
   emits: ["remove", "selectionChange", "change"],
   setup(e, t) {
-    const o = a(e.selectable), l = a(e.customClass), n = a(e.data), i = a(e.tagType), u = a(e.tagStyle), c = a(e.showColor), h = a(e.activeTag), s = a(e.customStyle), r = a(e.showClose), d = a(e.showAddButton), f = a(e.showInput), C = a(e.addButtonText), m = a(e.enableAddButton);
+    const o = a(e.selectable), l = a(e.customClass), n = a(e.data), s = a(e.tagType), u = a(e.tagStyle), r = a(e.showColor), y = a(e.activeTag), d = a(e.customStyle), f = a(e.showClose), i = a(e.showAddButton), c = a(e.showInput), m = a(e.addButtonText), p = a(e.enableAddButton);
     a(e.placeholder), a(""), a();
-    const y = a(), O = a(e.wrapText), P = a();
-    function x() {
-      const g = n.value.map((S) => ({
+    const b = a(), M = a(e.wrapText), P = a();
+    function S() {
+      const g = n.value.map((w) => ({
         type: "Tag",
-        payload: S
+        payload: w
       }));
-      return d.value && g.push({
+      return i.value && g.push({
         type: "AddButton"
       }), g;
     }
-    const v = a(x());
-    function b(g) {
-      n.value = g, v.value = x();
+    const h = a(S());
+    function T(g) {
+      n.value = g, h.value = S();
     }
-    const B = I(() => v.value.findIndex((g) => g.type === "Input")), k = Ot(e, t, n, v), {
+    const k = B(() => h.value.findIndex((g) => g.type === "Input")), x = Ot(e, t, n, h), {
       dragstart: E,
-      dragenter: L,
-      dragover: w,
+      dragenter: V,
+      dragover: C,
       dragend: j
-    } = k;
-    W(() => e.data, (g) => b(g));
-    const V = I(() => {
+    } = x;
+    W(() => e.data, (g) => T(g));
+    const L = B(() => {
       const g = {
         "farris-tags": !0,
         "farris-tags-checkable": o.value,
-        "farris-tags-nowrap": !O.value
+        "farris-tags-nowrap": !M.value
       };
-      return l.value.split(" ").reduce((S, T) => (S[T] = !0, S), g), g;
+      return l.value.split(" ").reduce((w, I) => (w[I] = !0, w), g), g;
     });
     function R(g) {
-      const S = {
+      const w = {
         "farris-tag-item": !0,
         "farris-tag-item-checked": o.value && g.checked,
         "farris-tag-item-checkable": o.value,
-        "farris-tag-item-has-color": c.value,
-        "farris-tag-item-actived": h.value === g.name
+        "farris-tag-item-has-color": r.value,
+        "farris-tag-item-actived": y.value === g.name
       };
-      if (i.value) {
-        const T = `farris-tag-item-${i.value}`;
-        S[T] = !0;
+      if (s.value) {
+        const I = `farris-tag-item-${s.value}`;
+        w[I] = !0;
       }
-      return S;
+      return w;
     }
-    const z = I(() => {
+    const z = B(() => {
       const g = {};
-      return s.value && s.value.split(";").reduce((S, T) => {
-        const H = T.split(":");
-        return S[H[0]] = H[1], S;
+      return d.value && d.value.split(";").reduce((w, I) => {
+        const H = I.split(":");
+        return w[H[0]] = H[1], w;
       }, g), g;
     });
-    function D(g, S) {
-      o.value && S.selectable && (S.checked = !S.checked, h.value = S.checked ? S.name : "", S.checked && n.value.filter((T) => T.name !== S.name).forEach((T) => {
-        T.checked = !S.checked;
-      }), t.emit("change", n.value), t.emit("selectionChange", S));
+    function D(g, w) {
+      o.value && w.selectable && (w.checked = !w.checked, y.value = w.checked ? w.name : "", w.checked && n.value.filter((I) => I.name !== w.name).forEach((I) => {
+        I.checked = !w.checked;
+      }), t.emit("change", n.value), t.emit("selectionChange", w));
     }
-    function F(g, S) {
-      let T;
+    function O(g, w) {
+      let I;
       switch (g.key) {
         case "Backspace":
-          n.value = n.value.filter((H) => H.name !== S.name), t.emit("change", n.value);
+          n.value = n.value.filter((H) => H.name !== w.name), t.emit("change", n.value);
           break;
         case "ArrowLeft":
-          T = Math.max(y.value.scrollLeft + 20, 0), y.value.scrollLeft = T;
+          I = Math.max(b.value.scrollLeft + 20, 0), b.value.scrollLeft = I;
           break;
         case "ArrowRight":
-          T = Math.max(y.value.scrollLeft - 20, 0), y.value.scrollLeft = T;
+          I = Math.max(b.value.scrollLeft - 20, 0), b.value.scrollLeft = I;
       }
     }
-    function M(g, S) {
-      const T = n.value.findIndex((H) => H.name === S.name);
-      if (T > -1) {
-        const [H] = n.value.splice(T, 1);
-        v.value = x(), t.emit("change", n.value), t.emit("remove", n.value, H, T);
+    function F(g, w) {
+      const I = n.value.findIndex((H) => H.name === w.name);
+      if (I > -1) {
+        const [H] = n.value.splice(I, 1);
+        h.value = S(), t.emit("change", n.value), t.emit("remove", n.value, H, I);
       }
       g.stopPropagation();
     }
-    const A = I(() => ({
+    const A = B(() => ({
       "farris-tag-item": !0,
       "farris-tag-add-button": !0,
-      "farris-tag-add-button-disabled": !m.value
+      "farris-tag-add-button-disabled": !p.value
     }));
     function $(g) {
     }
     function _() {
-      return p("li", {
+      return v("li", {
         class: A.value,
         onClick: (g) => void 0
-      }, [p("span", {
+      }, [v("span", {
         class: "f-icon f-icon-amplification"
-      }, null), p("span", {
+      }, null), v("span", {
         class: "farris-tag-add-text"
-      }, [C.value])]);
+      }, [m.value])]);
     }
     function N(g) {
       if (g && !g.innerText) {
-        const S = B.value;
-        if (S > 0) {
-          const [T] = n.value.splice(S - 1, 1);
-          v.value.splice(S - 1, 1), t.emit("remove", n.value, T, S - 1);
+        const w = k.value;
+        if (w > 0) {
+          const [I] = n.value.splice(w - 1, 1);
+          h.value.splice(w - 1, 1), t.emit("remove", n.value, I, w - 1);
         }
       }
     }
-    function U(g, S, T) {
+    function U(g, w, I) {
       g > -1 && (n.value.splice(g, 0, {
-        name: S,
-        value: T,
+        name: w,
+        value: I,
         selectable: o.value
-      }), v.value = x(), t.emit("change", n.value));
+      }), h.value = S(), t.emit("change", n.value));
     }
     function J(g) {
       if (g && g.innerText) {
-        const S = g.innerText, T = B.value;
-        U(T, S, S), g.innerText = "";
+        const w = g.innerText, I = k.value;
+        U(I, w, w), g.innerText = "";
       }
     }
     function Y(g) {
-      const S = g.target;
-      S && (S.innerText ? J(S) : t.emit("change", n.value));
+      const w = g.target;
+      w && (w.innerText ? J(w) : t.emit("change", n.value));
     }
     function be(g) {
       g.key === "Enter" && J(g.target), g.key === "Backspace" && (N(g.target), K(() => {
@@ -1592,9 +1597,9 @@ const Vt = /* @__PURE__ */ G({
       }));
     }
     function Ce() {
-      return p("li", {
+      return v("li", {
         class: "farris-tag-input-box"
-      }, [p("div", {
+      }, [v("div", {
         ref: P,
         class: "form-control",
         contenteditable: "true",
@@ -1602,35 +1607,35 @@ const Vt = /* @__PURE__ */ G({
         onBlur: Y
       }, null)]);
     }
-    function we(g, S) {
-      return p("li", {
+    function we(g, w) {
+      return v("li", {
         class: R(g),
         style: z.value,
         tabindex: 0,
         id: g.name,
         key: g.name,
-        onClick: (T) => D(T, g),
-        onKeydown: (T) => F(T, g),
+        onClick: (I) => D(I, g),
+        onKeydown: (I) => O(I, g),
         draggable: "true",
-        onDragstart: (T) => E(T, g, S),
-        onDragenter: (T) => L(T, S),
-        onDragend: (T) => j(T, g),
-        onDragover: (T) => w(T, S)
-      }, [p("div", {
+        onDragstart: (I) => E(I, g, w),
+        onDragenter: (I) => V(I, w),
+        onDragend: (I) => j(I, g),
+        onDragover: (I) => C(I, w)
+      }, [v("div", {
         title: g.name,
         class: "tag-box"
-      }, [g.name]), r.value && p("span", {
+      }, [g.name]), f.value && v("span", {
         class: "tag-delete"
-      }, [p("i", {
+      }, [v("i", {
         class: "f-icon f-icon-close",
-        onClick: (T) => M(T, g)
+        onClick: (I) => F(I, g)
       }, null)])]);
     }
     function Se() {
-      return v.value.map((g, S) => {
+      return h.value.map((g, w) => {
         switch (g.type) {
           case "Tag":
-            return we(g.payload, S);
+            return we(g.payload, w);
           case "AddButton":
             return _();
           case "Input":
@@ -1638,73 +1643,73 @@ const Vt = /* @__PURE__ */ G({
         }
       });
     }
-    const Te = I(() => ({
+    const Te = B(() => ({
       "farris-tags-item-container": !0,
       "farris-tag-item-capsule": u.value === "capsule"
     }));
-    function Be(g) {
-      const S = Math.max(y.value.scrollLeft - g.deltaX, 0);
-      y.value.scrollLeft = S;
-    }
     function Ie(g) {
-      const S = y.value, T = n.value.length - 1;
-      if (S) {
-        const H = Array.from(S.children).filter((X) => X.className.indexOf("farris-tag-item") > -1).findIndex((X) => {
+      const w = Math.max(b.value.scrollLeft - g.deltaX, 0);
+      b.value.scrollLeft = w;
+    }
+    function Be(g) {
+      const w = b.value, I = n.value.length - 1;
+      if (w) {
+        const H = Array.from(w.children).filter((X) => X.className.indexOf("farris-tag-item") > -1).findIndex((X) => {
           const q = X.getBoundingClientRect(), Z = window.getComputedStyle(X), ue = parseInt(Z["margin-left"], 10) + q.width + parseInt(Z["margin-right"], 10);
           return q.left + ue > g;
         });
         if (H > -1)
           return H;
       }
-      return T;
+      return I;
     }
     function ke(g) {
-      if (f.value) {
-        const T = Ie(g.clientX) + 1, X = v.value.filter((q) => q.type !== "Input");
-        X.splice(T, 0, {
+      if (c.value) {
+        const I = Be(g.clientX) + 1, X = h.value.filter((q) => q.type !== "Input");
+        X.splice(I, 0, {
           type: "Input"
-        }), v.value = X, K(() => {
+        }), h.value = X, K(() => {
           P.value && P.value.focus();
         });
       }
     }
     function xe(g) {
-      var T;
+      var I;
       g.preventDefault(), g.stopPropagation();
-      const S = (T = g.dataTransfer) == null ? void 0 : T.getData("Text");
-      if (S) {
-        const H = S.split(":"), X = H[0], q = H[1];
+      const w = (I = g.dataTransfer) == null ? void 0 : I.getData("Text");
+      if (w) {
+        const H = w.split(":"), X = H[0], q = H[1];
         [...n.value].findIndex((ee) => (console.log(`${ee.value} === ${q} is ${ee.value === q}`), ee.value === q)) > -1 || U(n.value.length, X, q);
       }
     }
     function Pe(g) {
       g.preventDefault();
     }
-    return () => p("div", {
-      class: V.value,
+    return () => v("div", {
+      class: L.value,
       onClick: ke,
       onDrop: xe,
       onDragover: Pe
-    }, [p("ul", {
-      ref: y,
+    }, [v("ul", {
+      ref: b,
       class: Te.value,
-      onWheel: (g) => Be(g)
+      onWheel: (g) => Ie(g)
     }, [Se()])]);
   }
 });
-function Lt(e, t, o) {
+function Vt(e, t, o) {
   const l = a(e.separator), {
     changeTextBoxValue: n
-  } = o, i = I(() => t.value ? t.value.split(l.value).map((c) => ({
-    name: c,
+  } = o, s = B(() => t.value ? t.value.split(l.value).map((r) => ({
+    name: r,
     selectable: !0
   })) : []);
-  function u(c) {
-    n(c.map((h) => h.name).join(l.value), !0);
+  function u(r) {
+    n(r.map((y) => y.name).join(l.value), !0);
   }
-  return () => p(Vt, {
+  return () => v(Lt, {
     class: "form-control",
-    data: i.value,
+    data: s.value,
     showClose: !0,
     showInput: !0,
     onChange: u
@@ -1714,25 +1719,25 @@ function Dt(e, t, o) {
   const {
     buttonClass: l,
     onClickButton: n,
-    onMouseEnterButton: i,
+    onMouseEnterButton: s,
     onMouseLeaveButton: u
   } = t, {
-    enableClearButton: c,
-    showClearButton: h,
-    onClearValue: s
+    enableClearButton: r,
+    showClearButton: y,
+    onClearValue: d
   } = o;
-  return () => p("div", {
+  return () => v("div", {
     class: l.value
-  }, [c.value && Q(p("span", {
+  }, [r.value && Q(v("span", {
     class: "input-group-text input-group-clear",
-    onClick: s
-  }, [p("i", {
+    onClick: d
+  }, [v("i", {
     class: "f-icon modal_close"
-  }, null)]), [[ve, h.value]]), e.buttonContent && p("span", {
+  }, null)]), [[ve, y.value]]), e.buttonContent && v("span", {
     class: "input-group-text input-group-append-button",
     innerHTML: e.buttonContent,
     onClick: n,
-    onMouseenter: i,
+    onMouseenter: s,
     onMouseleave: u
   }, null)]);
 }
@@ -1760,170 +1765,170 @@ const jt = {
   minWidth: { type: Number, default: -1 }
 };
 function Rt(e) {
-  const t = e.host ? e.host : "body", o = I(() => t === "body" ? 0 : t ? t.getBoundingClientRect().top : 0), l = I(() => t === "body" ? 0 : t ? t.getBoundingClientRect().left : 0), n = I(() => t === "body" ? document.body.getBoundingClientRect().width : t ? t.getBoundingClientRect().width - (e.rightBoundary ? e.rightBoundary.getBoundingClientRect().width : 0) : document.body.getBoundingClientRect().width);
+  const t = e.host ? e.host : "body", o = B(() => t === "body" ? 0 : t ? t.getBoundingClientRect().top : 0), l = B(() => t === "body" ? 0 : t ? t.getBoundingClientRect().left : 0), n = B(() => t === "body" ? document.body.getBoundingClientRect().width : t ? t.getBoundingClientRect().width - (e.rightBoundary ? e.rightBoundary.getBoundingClientRect().width : 0) : document.body.getBoundingClientRect().width);
   return { host: t, hostLeft: l, hostTop: o, hostWidth: n };
 }
 function At(e, t, o, l) {
   var D;
-  const n = a(0), i = a(((D = e.offsetX) == null ? void 0 : D.value) || 0), u = a(-1), c = a(-1), h = a(-1), s = a(e.placement), r = a(0), d = a(0), f = a(0), C = a(document.documentElement.scrollLeft), m = a(document.documentElement.scrollTop), { hostLeft: y, hostTop: O, hostWidth: P } = l;
-  W(e.offsetX, (F) => {
-    n.value = F - i.value;
+  const n = a(0), s = a(((D = e.offsetX) == null ? void 0 : D.value) || 0), u = a(-1), r = a(-1), y = a(-1), d = a(e.placement), f = a(0), i = a(0), c = a(0), m = a(document.documentElement.scrollLeft), p = a(document.documentElement.scrollTop), { hostLeft: b, hostTop: M, hostWidth: P } = l;
+  W(e.offsetX, (O) => {
+    n.value = O - s.value;
   });
-  const x = I(() => {
-    const F = {
-      left: `${d.value}px`,
-      top: `${f.value}px`,
+  const S = B(() => {
+    const O = {
+      left: `${i.value}px`,
+      top: `${c.value}px`,
       transform: `translateX(${n.value}px)`
     };
-    return e.zIndex !== -1 && (F["z-index"] = e.zIndex), u.value !== -1 && (F.width = `${u.value}px`), F;
-  }), v = I(() => ({
-    left: `${r.value}px`
+    return e.zIndex !== -1 && (O["z-index"] = e.zIndex), u.value !== -1 && (O.width = `${u.value}px`), O;
+  }), h = B(() => ({
+    left: `${f.value}px`
   }));
-  function b(F) {
-    if (F && e.keepWidthWithReference) {
-      const M = F.getBoundingClientRect();
-      u.value = Math.max(e.minWidth, M.width);
+  function T(O) {
+    if (O && e.keepWidthWithReference) {
+      const F = O.getBoundingClientRect();
+      u.value = Math.max(e.minWidth, F.width);
     }
   }
-  function B(F, M) {
-    const A = P.value - F.width - 4;
-    return A > 0 ? A : M;
+  function k(O, F) {
+    const A = P.value - O.width - 4;
+    return A > 0 ? A : F;
   }
-  function k(F, M, A) {
-    const $ = r.value, _ = M.left - y.value + M.width / 2 + C.value, N = M.top - O.value - (F.height + A.height) + m.value;
+  function x(O, F, A) {
+    const $ = f.value, _ = F.left - b.value + F.width / 2 + m.value, N = F.top - M.value - (O.height + A.height) + p.value;
     return { popoverLeft: _, popoverTop: N, arrowLeft: $ };
   }
-  function E(F, M, A) {
-    return M.top - O.value + (M.height + A.height) + m.value;
+  function E(O, F, A) {
+    return F.top - M.value + (F.height + A.height) + p.value;
   }
-  function L(F, M) {
-    const A = B(M, F), $ = F <= A ? r.value : F - A;
-    return { popoverLeft: Math.min(F, A), arrowLeft: $ };
+  function V(O, F) {
+    const A = k(F, O), $ = O <= A ? f.value : O - A;
+    return { popoverLeft: Math.min(O, A), arrowLeft: $ };
   }
-  function w(F, M, A) {
-    const $ = M.left - y.value + M.width / 2 - (A.width / 2 - (F.left - y.value)) + C.value, { arrowLeft: _, popoverLeft: N } = L($, F), U = E(F, M, A);
+  function C(O, F, A) {
+    const $ = F.left - b.value + F.width / 2 - (A.width / 2 - (O.left - b.value)) + m.value, { arrowLeft: _, popoverLeft: N } = V($, O), U = E(O, F, A);
     return { popoverLeft: N, popoverTop: U, arrowLeft: _ };
   }
-  function j(F, M, A) {
-    const $ = M.left - y.value + C.value, { arrowLeft: _, popoverLeft: N } = L($, F), U = E(F, M, A);
+  function j(O, F, A) {
+    const $ = F.left - b.value + m.value, { arrowLeft: _, popoverLeft: N } = V($, O), U = E(O, F, A);
     return { popoverLeft: N, popoverTop: U, arrowLeft: _ };
   }
-  const V = /* @__PURE__ */ new Map([
-    ["top", k],
-    ["bottom", w],
+  const L = /* @__PURE__ */ new Map([
+    ["top", x],
+    ["bottom", C],
     ["bottom-left", j]
   ]);
-  function R(F) {
+  function R(O) {
     var N;
-    const M = F.getBoundingClientRect();
-    c.value = M.top, h.value = M.left;
-    const A = t.value.getBoundingClientRect(), $ = (N = o.value) == null ? void 0 : N.getBoundingClientRect(), _ = V.get(s.value);
+    const F = O.getBoundingClientRect();
+    r.value = F.top, y.value = F.left;
+    const A = t.value.getBoundingClientRect(), $ = (N = o.value) == null ? void 0 : N.getBoundingClientRect(), _ = L.get(d.value);
     if (_) {
-      const { arrowLeft: U, popoverLeft: J, popoverTop: Y } = _($, M, A);
-      r.value = U, d.value = J, f.value = Y;
+      const { arrowLeft: U, popoverLeft: J, popoverTop: Y } = _($, F, A);
+      f.value = U, i.value = J, c.value = Y;
     }
-    e.keepWidthWithReference && b(F);
+    e.keepWidthWithReference && T(O);
   }
-  function z(F) {
-    if (F) {
-      const M = F.getBoundingClientRect();
-      (M.left !== h.value || M.top !== c.value) && R(F);
+  function z(O) {
+    if (O) {
+      const F = O.getBoundingClientRect();
+      (F.left !== y.value || F.top !== r.value) && R(O);
     }
   }
   return {
-    arrowStyle: v,
-    popoverStyle: x,
-    position: s,
+    arrowStyle: h,
+    popoverStyle: S,
+    position: d,
     popoverWidth: u,
-    fitToReference: b,
+    fitToReference: T,
     followToReferencePosition: z,
     locateToReference: R
   };
 }
-function Et(e, t, o, l, n, i, u) {
-  const c = a(e.visible), h = I(() => c.value), { fitToReference: s, locateToReference: r } = u;
-  let d;
-  function f() {
-    c.value = !1, document.body.removeEventListener("click", d), t.emit("hidden");
+function Et(e, t, o, l, n, s, u) {
+  const r = a(e.visible), y = B(() => r.value), { fitToReference: d, locateToReference: f } = u;
+  let i;
+  function c() {
+    r.value = !1, document.body.removeEventListener("click", i), t.emit("hidden");
   }
-  d = (m) => {
-    if (!n.value.contains(m.target)) {
-      const y = n.value.closest(".popover");
-      y && y.removeEventListener("click", d), f();
+  i = (p) => {
+    if (!n.value.contains(p.target)) {
+      const b = n.value.closest(".popover");
+      b && b.removeEventListener("click", i), c();
     }
   };
-  async function C(m) {
-    if (l.value && o.value && m) {
-      c.value = !0, n.value = m, await K(), r(m), i.value && s(m), document.body.addEventListener("click", d);
-      const y = m.closest(".popover");
-      y && y.addEventListener("click", d), t.emit("shown");
+  async function m(p) {
+    if (l.value && o.value && p) {
+      r.value = !0, n.value = p, await K(), f(p), s.value && d(p), document.body.addEventListener("click", i);
+      const b = p.closest(".popover");
+      b && b.addEventListener("click", i), t.emit("shown");
     }
   }
-  return t.expose({ hide: f, show: C, shown: h }), { showPopover: c, hidePopverOnClickBodyHandler: d };
+  return t.expose({ hide: c, show: m, shown: y }), { showPopover: r, hidePopverOnClickBodyHandler: i };
 }
 function Ht(e, t, o, l, n) {
-  const { popoverWidth: i, fitToReference: u, followToReferencePosition: c } = n;
-  function h() {
+  const { popoverWidth: s, fitToReference: u, followToReferencePosition: r } = n;
+  function y() {
     if (o.value) {
-      c(o.value);
-      const s = o.value.getBoundingClientRect();
-      l.value && s.width !== i.value && u(o.value);
+      r(o.value);
+      const d = o.value.getBoundingClientRect();
+      l.value && d.width !== s.value && u(o.value);
     }
   }
-  return { onResize: h };
+  return { onResize: y };
 }
 const Wt = /* @__PURE__ */ G({
   name: "FPopover",
   props: jt,
   emits: ["shown", "hidden"],
   setup(e, t) {
-    const o = a(), l = a(), n = a(e.reference), i = a(e.keepWidthWithReference), u = I(() => !!e.title), c = Rt(e), {
-      host: h
-    } = c, s = At(e, o, l, c), {
-      position: r,
-      arrowStyle: d,
-      popoverStyle: f,
-      fitToReference: C,
-      locateToReference: m
-    } = s, {
-      showPopover: y,
-      hidePopverOnClickBodyHandler: O
-    } = Et(e, t, o, l, n, i, s), {
+    const o = a(), l = a(), n = a(e.reference), s = a(e.keepWidthWithReference), u = B(() => !!e.title), r = Rt(e), {
+      host: y
+    } = r, d = At(e, o, l, r), {
+      position: f,
+      arrowStyle: i,
+      popoverStyle: c,
+      fitToReference: m,
+      locateToReference: p
+    } = d, {
+      showPopover: b,
+      hidePopverOnClickBodyHandler: M
+    } = Et(e, t, o, l, n, s, d), {
       onResize: P
-    } = Ht(e, t, n, i, s), x = I(() => {
-      const b = `popover in popover-${r.value}`, B = `bs-popover-${r.value}`, k = {
+    } = Ht(e, t, n, s, d), S = B(() => {
+      const T = `popover in popover-${f.value}`, k = `bs-popover-${f.value}`, x = {
         "popover-fitcontent": e.fitContent
       };
-      return k[b] = !0, k[B] = !0, (e.class || "").split(" ").reduce((L, w) => (L[w] = !0, L), k), k;
-    }), v = I(() => ({
+      return x[T] = !0, x[k] = !0, (e.class || "").split(" ").reduce((V, C) => (V[C] = !0, V), x), x;
+    }), h = B(() => ({
       "popover-content": !0,
       "popover-body": !0
     }));
     return ne(() => {
-      e.reference && m(n.value), i.value && C(n.value), window.addEventListener("resize", P);
+      e.reference && p(n.value), s.value && m(n.value), window.addEventListener("resize", P);
     }), fe(() => {
-      document.body.removeEventListener("click", O), window.removeEventListener("resize", P);
-    }), () => p(de, {
-      to: h
+      document.body.removeEventListener("click", M), window.removeEventListener("resize", P);
+    }), () => v(de, {
+      to: y
     }, {
       default: () => {
-        var b;
-        return [Q(p("div", {
+        var T;
+        return [Q(v("div", {
           ref: l,
-          class: x.value,
-          style: f.value,
-          onClick: (B) => {
-            B.stopPropagation();
+          class: S.value,
+          style: c.value,
+          onClick: (k) => {
+            k.stopPropagation();
           }
-        }, [p("div", {
+        }, [v("div", {
           ref: o,
           class: "popover-arrow arrow",
-          style: d.value
-        }, null), u.value && p("h3", {
+          style: i.value
+        }, null), u.value && v("h3", {
           class: "popover-title popover-header"
-        }, [e.title]), p("div", {
-          class: v.value
-        }, [t.slots.default && ((b = t.slots) == null ? void 0 : b.default())])]), [[ve, y.value]])];
+        }, [e.title]), v("div", {
+          class: h.value
+        }, [t.slots.default && ((T = t.slots) == null ? void 0 : T.default())])]), [[ve, b.value]])];
       }
     });
   }
@@ -1931,10 +1936,10 @@ const Wt = /* @__PURE__ */ G({
 function _t(e, t, o) {
   const l = a(e.popupMinWidth), {
     hidePopup: n,
-    popoverRef: i
+    popoverRef: s
   } = o;
-  return () => p(Wt, {
-    ref: i,
+  return () => v(Wt, {
+    ref: s,
     visible: !0,
     placement: "bottom-left",
     host: e.popupHost,
@@ -1946,8 +1951,8 @@ function _t(e, t, o) {
     onHidden: n
   }, {
     default: () => {
-      var u, c;
-      return [(c = (u = t.slots).default) == null ? void 0 : c.call(u)];
+      var u, r;
+      return [(r = (u = t.slots).default) == null ? void 0 : r.call(u)];
     }
   });
 }
@@ -1956,134 +1961,134 @@ const ye = /* @__PURE__ */ G({
   props: he,
   emits: ["updateExtendInfo", "clear", "change", "click", "clickButton", "blur", "focus", "mouseEnterIcon", "mouseLeaveIcon", "keyup", "keydown", "inputClick", "input", "update:modelValue"],
   setup(e, t) {
-    const o = a(), l = a(e.customClass), n = a(e.modelValue), i = Pt(e, t, o), {
+    const o = a(), l = a(e.customClass), n = a(e.modelValue), s = Pt(e, t, o), {
       shouldPopupContent: u,
-      hidePopup: c
-    } = i, h = It(e, t, o, i), s = a(""), r = xt(e, t, n, s, i), {
-      hasFocusedTextBox: d,
-      commitValue: f,
-      inputGroupClass: C
-    } = r, m = kt(e, t, n, d, s, r), {
-      onMouseEnterTextBox: y,
-      onMouseLeaveTextBox: O
-    } = m, P = I(() => {
+      hidePopup: r
+    } = s, y = Bt(e, t, o, s), d = a(""), f = xt(e, t, n, d, s), {
+      hasFocusedTextBox: i,
+      commitValue: c,
+      inputGroupClass: m
+    } = f, p = kt(e, t, n, i, d, f), {
+      onMouseEnterTextBox: b,
+      onMouseLeaveTextBox: M
+    } = p, P = B(() => {
       const E = {
         "f-button-edit": !0,
         "f-cmp-inputgroup": !0,
         "f-button-edit-nowrap": !e.wrapText
       };
-      return l.value && l.value.split(" ").reduce((L, w) => (L[w] = !0, L), E), E;
+      return l.value && l.value.split(" ").reduce((V, C) => (V[C] = !0, V), E), E;
     });
-    function x() {
-      return e.multiSelect && e.inputType === "tag" ? Lt(e, n, r) : Mt(e, n, r);
+    function S() {
+      return e.multiSelect && e.inputType === "tag" ? Vt(e, n, f) : Mt(e, n, f);
     }
-    let v = x();
+    let h = S();
     W([() => e.multiSelect, () => e.inputType], () => {
-      v = x();
+      h = S();
     });
-    const b = Dt(e, h, m), B = _t(e, t, i), k = {
-      commitValue: f,
+    const T = Dt(e, y, p), k = _t(e, t, s), x = {
+      commitValue: c,
       elementRef: o,
-      hidePopup: c
+      hidePopup: r
     };
     return ne(() => {
-      o.value.componentInstance = k;
-    }), t.expose(k), () => p(re, null, [p("div", Le(t.attrs, {
+      o.value.componentInstance = x;
+    }), t.expose(x), () => v(re, null, [v("div", Ve(t.attrs, {
       ref: o,
       class: P.value,
       id: e.id
-    }), [p("div", {
-      class: C.value,
-      onMouseenter: y,
-      onMouseleave: O
-    }, [v(), b()])]), u.value && B()]);
+    }), [v("div", {
+      class: m.value,
+      onMouseenter: b,
+      onMouseleave: M
+    }, [h(), T()])]), u.value && k()]);
   }
 });
 function $t(e) {
   const t = a(""), o = a(e.modelValue), l = a(e.data || []), n = a(e.editable);
-  function i(s) {
-    const r = s.split(e.separator).map((f) => [f, !0]), d = new Map(r);
-    return l.value.filter((f) => d.has(f[e.valueField]));
-  }
-  function u(s) {
-    const r = i(s).map((d) => d[e.textField]).join(e.separator);
-    t.value = n.value ? r || s : r;
-  }
-  function c(s) {
-    const r = s.split(e.separator).map((f) => [f, !0]), d = new Map(r);
-    return l.value.filter((f) => d.has(f[e.textField]));
-  }
-  function h() {
-    const { url: s, method: r = "GET", headers: d = {}, body: f = null } = e.remote;
-    fetch(s, { method: r, headers: d, body: f }).then((m) => {
-      if (m.status === 200)
-        return m.json();
-      throw new Error(m.statusText);
-    }).then((m) => {
-      l.value = m;
-    }).catch((m) => {
-      console.error(m);
+  function s(i) {
+    const c = i.split(e.separator).map((p) => [p, !0]), m = new Map(c);
+    return l.value.filter((p) => m.has(p[e.valueField]));
+  }
+  function u(i) {
+    const c = s(i).map((m) => m[e.textField]).join(e.separator);
+    t.value = n.value ? c || i : c;
+  }
+  function r(i) {
+    const c = i.split(e.separator).map((p) => [p, !0]), m = new Map(c);
+    return l.value.filter((p) => m.has(p[e.textField]));
+  }
+  function y(i) {
+    const c = {};
+    return c[e.idField] = i, c[e.textField] = i, [c];
+  }
+  function d(i) {
+    let c = r(i);
+    const m = c && c.length > 0;
+    return n.value && !m && (c = y(i)), c;
+  }
+  function f() {
+    const { url: i, method: c = "GET", headers: m = {}, body: p = null } = e.remote;
+    fetch(i, { method: c, headers: m, body: p }).then((M) => {
+      if (M.status === 200)
+        return M.json();
+      throw new Error(M.statusText);
+    }).then((M) => {
+      l.value = M;
+    }).catch((M) => {
+      console.error(M);
     });
   }
-  return e.remote && h(), W(() => e.data, () => {
+  return e.remote && f(), W(() => e.data, () => {
     l.value = e.data;
-  }), W([l], ([s]) => {
+  }), W([l], ([i]) => {
     if (e.modelValue) {
-      const r = s.find((d) => d[e.valueField] === e.modelValue);
-      r && (t.value = r[e.textField]);
+      const c = i.find((m) => m[e.valueField] === e.modelValue);
+      c && (t.value = c[e.textField]);
     }
-  }), W(() => e.modelValue, (s) => {
-    o.value = s, u(s);
-  }), u(e.modelValue), { dataSource: l, displayText: t, editable: n, modelValue: o, getItemsByDisplayText: c, getItemsByValue: i };
+  }), W(() => e.modelValue, (i) => {
+    o.value = i, u(i);
+  }), u(e.modelValue), { dataSource: l, displayText: t, editable: n, modelValue: o, getItemsByDisplayText: r, getItemsByValue: s, getSelectedItemsByDisplayText: d };
 }
 const te = /* @__PURE__ */ G({
   name: "FComboList",
   props: ae,
   emits: ["clear", "update:modelValue", "change"],
   setup(e, t) {
-    const o = a(), l = a(e.disabled), n = a(e.enableClear), i = a(e.enableSearch), u = a(e.readonly), {
-      dataSource: c,
-      displayText: h,
-      editable: s,
-      modelValue: r,
-      getItemsByDisplayText: d
-    } = $t(e), f = I(() => e.multiSelect);
-    function C() {
-      !f.value && o.value && o.value.hidePopup();
-    }
-    function m(v) {
-      h.value = v.map((b) => b[e.textField]).join(e.separator), r.value = v.map((b) => b[e.valueField]).join(e.separator), t.emit("update:modelValue", r.value), t.emit("change", v), C();
+    const o = a(), l = a(e.disabled), n = a(e.enableClear), s = a(e.enableSearch), u = a(e.readonly), {
+      dataSource: r,
+      displayText: y,
+      editable: d,
+      modelValue: f,
+      getSelectedItemsByDisplayText: i
+    } = $t(e), c = B(() => e.multiSelect);
+    function m() {
+      !c.value && o.value && o.value.hidePopup();
     }
-    function y(v) {
-      r.value = "", t.emit("update:modelValue", ""), t.emit("clear");
+    function p(S) {
+      y.value = S.map((h) => h[e.textField]).join(e.separator), f.value = S.map((h) => h[e.valueField]).join(e.separator), t.emit("update:modelValue", f.value), t.emit("change", S), m();
     }
-    function O(v) {
-      r.value = v, t.emit("update:modelValue", r.value);
-      const b = {};
-      b[e.idField] = v, b[e.textField] = v, t.emit("change", [b]);
+    function b(S) {
+      f.value = "", t.emit("update:modelValue", ""), t.emit("clear");
     }
-    function P(v) {
-      if (s.value) {
-        O(v);
-        return;
-      }
-      const b = d(v);
-      m(b);
+    function M(S) {
+      const h = i(S);
+      p(h);
     }
-    function x() {
-      return h.value;
+    function P() {
+      return y.value;
     }
     return t.expose({
-      getDisplayText: x
-    }), W([() => e.disabled, () => e.editable, () => e.enableClear, () => e.enableSearch, () => e.readonly], ([v, b, B, k, E]) => {
-      l.value = v, s.value = b, n.value = B, i.value = k, u.value = E;
-    }), () => p(ye, {
+      getDisplayText: P
+    }), W([() => e.disabled, () => e.editable, () => e.enableClear, () => e.enableSearch, () => e.readonly], ([S, h, T, k, x]) => {
+      l.value = S, d.value = h, n.value = T, s.value = k, u.value = x;
+    }), () => v(ye, {
       ref: o,
       id: e.id,
       disable: l.value,
       readonly: u.value,
       forcePlaceholder: e.forcePlaceholder,
-      editable: s.value,
+      editable: d.value,
       buttonContent: e.dropDownIcon,
       placeholder: e.placeholder,
       enableClear: n.value,
@@ -2092,85 +2097,86 @@ const te = /* @__PURE__ */ G({
       enableTitle: e.enableTitle,
       multiSelect: e.multiSelect,
       inputType: e.multiSelect ? "tag" : "text",
-      modelValue: h.value,
-      "onUpdate:modelValue": (v) => h.value = v,
-      onClear: y,
-      onChange: P
+      modelValue: y.value,
+      "onUpdate:modelValue": (S) => y.value = S,
+      onClear: b,
+      onChange: M
     }, {
-      default: () => [p(rt, {
+      default: () => [v(rt, {
         idField: e.idField,
         valueField: e.valueField,
         textField: e.textField,
-        dataSource: c.value,
-        selectedValues: r.value,
+        dataSource: r.value,
+        selectedValues: f.value,
         multiSelect: e.multiSelect,
-        enableSearch: i.value,
-        onSelectionChange: m
+        enableSearch: s.value,
+        height: e.maxHeight,
+        onSelectionChange: p
       }, null)]
     });
   }
 });
 function Nt(e, t, o) {
-  var x;
+  var S;
   const l = o == null ? void 0 : o.checkIsInFixedContextRules(), n = o && o.getStyles && o.getStyles() || "";
-  function i() {
+  function s() {
     return !(t.schema.componentType || l);
   }
   function u() {
     return !1;
   }
-  function c() {
+  function r() {
     return !(t.schema.componentType || l);
   }
-  function h() {
+  function y() {
     return !!l;
   }
-  function s(v) {
-    if (!v)
+  function d(h) {
+    if (!h)
       return null;
-    if (v.schema.type === "Component")
-      return v;
-    const b = s(v.parent);
-    return b || null;
+    if (h.schema.type === "Component")
+      return h;
+    const T = d(h.parent);
+    return T || null;
   }
-  function r(v, b, B) {
+  function f(h, T, k) {
     return !!o && o.canAccepts();
   }
-  function d() {
+  function i() {
     return t.schema.label || t.schema.title || t.schema.name;
   }
-  function f() {
+  function c() {
   }
-  function C(v, b) {
-    b && (o == null || o.onAcceptMovedChildElement(b));
+  function m(h, T) {
+    T && (o == null || o.onAcceptMovedChildElement(T));
   }
-  function m(v, b) {
-    const B = String(v.getAttribute("data-controltype"));
-    return je(B);
+  function p(h, T) {
+    const k = String(h.getAttribute("data-controltype"));
+    return je(k);
   }
-  function y(v) {
-    return v.contents ? v.contents.length : -1;
+  function b(h) {
+    return h.contents ? h.contents.length : -1;
   }
-  function O(v) {
+  function M(h) {
   }
   const P = {
-    canMove: i(),
+    canMove: s(),
     canSelectParent: u(),
-    canDelete: c(),
-    canNested: !h(),
+    canDelete: r(),
+    canNested: !y(),
     contents: t.schema.contents,
     elementRef: e,
-    parent: (x = t.parent) == null ? void 0 : x.componentInstance.value,
+    parent: (S = t.parent) == null ? void 0 : S.componentInstance.value,
     schema: t.schema,
     styles: n,
-    canAccepts: r,
-    getBelongedComponentInstance: s,
-    getDraggingDisplayText: d,
-    getDragScopeElement: f,
-    onAcceptMovedChildElement: C,
-    onAcceptNewChildElement: m,
-    onAddNewChildElement: y,
-    onChildElementMovedOut: O,
+    canAccepts: f,
+    getBelongedComponentInstance: d,
+    getDraggingDisplayText: i,
+    getDragScopeElement: c,
+    onAcceptMovedChildElement: m,
+    onAcceptNewChildElement: p,
+    onAddNewChildElement: b,
+    onChildElementMovedOut: M,
     triggerBelongedComponentToMoveWhenMoved: !!o && o.triggerBelongedComponentToMoveWhenMoved
   };
   return a(P);
@@ -2183,7 +2189,7 @@ const zt = /* @__PURE__ */ G({
     const o = a(), l = De("design-item-context"), n = Nt(o, l);
     return ne(() => {
       o.value.componentInstance = n;
-    }), t.expose(n.value), () => p(ye, {
+    }), t.expose(n.value), () => v(ye, {
       ref: o,
       id: e.id,
       disable: e.disabled,