@pantograph/vue 0.23.7 → 0.23.9

package/dist/Combobox.vue_vue_type_style_index_0_lang-yow5XVz6.js

@@ -0,0 +1,914 @@
+import { computed as f, unref as D, defineComponent as te, createBlock as Ce, openBlock as ae, mergeProps as Me, withCtx as me, createElementBlock as we, createVNode as Le, h as s, normalizeClass as Ge, renderSlot as Ee, ref as ye, watch as je, useSlots as Ue, useAttrs as He, createSlots as qe, renderList as Ye, normalizeProps as Je, guardReactiveProps as Qe } from "vue";
+import { createContext as Ke, ComboboxInput as Xe, ComboboxAnchor as Ze, injectComboboxRootContext as et, useFilter as tt, ComboboxPortal as ot, ComboboxContent as rt, useEmitAsProps as nt, ComboboxRoot as at } from "reka-ui";
+import { g as lt, h as ee, o as st, f as Pe, j as it } from "./FormItem.vue_vue_type_style_index_0_lang-BpgRONei.js";
+import { a as Ve, g as pt } from "./options-D4et5euX.js";
+import { getBemBlock as ut, getBemElement as V, generateVariantClassList as Y } from "@pantograph/utils";
+import { a as fe, i as H, b as _e, u as ct, d as Te } from "./index-jwkhq8oW.js";
+import { cva as xe } from "class-variance-authority";
+import { a as dt, l as gt, o as ze } from "./omit-BuBwx_M2.js";
+import { _ as mt } from "./Empty.vue_vue_type_style_index_0_lang-jfObDGf0.js";
+import { _ as ft } from "./Skeleton.vue_vue_type_style_index_0_lang-Xi8CteLp.js";
+import { _ as Ie } from "./Divider.vue_vue_type_style_index_0_lang-B6fQsp1Y.js";
+import { b as F, f as vt, a as ht, i as bt, d as yt } from "./element-BfQuKSll.js";
+import { u as Ct, U as _t } from "./useInputDataStates-0nK-AuOK.js";
+import { u as Vt } from "./useLazyLoading-Zo-PEp2E.js";
+import { g as xt, b as Bt } from "./Popover.vue_vue_type_style_index_0_lang-Yli31kJD.js";
+import { _ as St } from "./ScrollContainer.vue_vue_type_style_index_0_lang-DfMU1mTu.js";
+import { _ as Ot } from "./Tree.vue_vue_type_style_index_0_lang-D-ct8_9s.js";
+import { u as ke } from "./uniq-Cxafs-eV.js";
+import { i as J } from "./isEmpty-wdqPTIXx.js";
+import { _ as Pt } from "./Chip.vue_vue_type_style_index_0_lang-qncbXz02.js";
+import { _ as Tt } from "./ChipGroup.vue_vue_type_style_index_0_lang-BFKwogR0.js";
+import { _ as Be } from "./Icon.vue_vue_type_style_index_0_lang-CbLL-Ngi.js";
+import { d as zt, _ as Re } from "./Avatar.vue_vue_type_style_index_0_lang-CyJGai1W.js";
+import { _ as It } from "./GraphicalObjectGroup.vue_vue_type_style_index_0_lang-C3Vv_V38.js";
+import { _ as $e } from "./GraphicalObject.vue_vue_type_script_setup_true_lang-DLtfk2Qg.js";
+import { _ as kt } from "./Input.vue_vue_type_style_index_0_lang-oEQu3uIk.js";
+import { whenever as Dt, useVModel as Mt } from "@vueuse/core";
+import { last as wt } from "lodash-es";
+import { a as Lt } from "./MenuItem.vue_vue_type_style_index_0_lang-DPbtkHtq.js";
+import "@iconify/vue";
+import { _ as Et } from "./Checkbox.vue_vue_type_style_index_0_lang-aDK0Pvm-.js";
+import "@pantograph/tokens";
+const [Se, Kt] = Ke("Combobox"), [Rt, $t] = Ke("_Combobox"), K = ut("combobox");
+var At = 1 / 0;
+function Nt(c) {
+  var o = c == null ? 0 : c.length;
+  return o ? dt(c, At) : [];
+}
+const ge = (c) => lt(c) || fe(c);
+function Ft({
+  getValue: c,
+  arr: o,
+  getChildren: t
+}) {
+  const e = [], d = (u, x) => {
+    u.forEach((B) => {
+      const h = c(B);
+      if (ge(h)) {
+        e.push({ ...B, _parentKeys: x, _key: h });
+        const C = t(B);
+        C != null && C.length && d(C, [...x ?? [], h]);
+      }
+    });
+  };
+  return d(o), e;
+}
+const Wt = ({
+  getData: c,
+  getModel: o,
+  getValue: t,
+  getChildren: e
+}) => {
+  const d = f(
+    () => Ft({ arr: D(c()), getChildren: e, getValue: t })
+  ), u = (n, g = !1) => {
+    const l = t(n);
+    return d.value.filter((i) => {
+      var _;
+      if (g) {
+        const O = gt(i._parentKeys ?? []);
+        return O && O === l;
+      }
+      return (_ = i._parentKeys) == null ? void 0 : _.includes(l);
+    });
+  }, x = (n) => {
+    if (n && H(n))
+      return ee(n);
+    const g = D(o());
+    return g && H(g) ? ee(g) : [];
+  }, B = (n, g) => {
+    const l = x(g), i = u(n);
+    if (i != null && i.length)
+      return i.some((_) => {
+        var p;
+        const O = _._key;
+        return O && ((p = l == null ? void 0 : l.includes) == null ? void 0 : p.call(l, O));
+      });
+  }, h = (n, g) => {
+    const l = x(g), i = u(n);
+    if (i != null && i.length)
+      return i.every((_) => {
+        var p;
+        const O = _._key;
+        return O && ((p = l == null ? void 0 : l.includes) == null ? void 0 : p.call(l, O));
+      });
+  }, C = (n, g) => {
+    const l = x(g), i = u(n), _ = t(n);
+    return i != null && i.length ? h(n) ? !0 : B(n) ? "intermediate" : !1 : l.includes(_);
+  }, A = (n) => ge(n) ? d.value.find((g) => g._key === n) : void 0;
+  return {
+    flattenData: d,
+    getNodeChildren: u,
+    isSomeChildrenSelected: B,
+    isAllChildrenSelected: h,
+    isSelected: C,
+    selectValues: (n, g) => {
+      if (n.length) {
+        let l = x();
+        const i = n.filter(ge);
+        g ? l.push(...i) : l = l.filter((S) => !i.includes(S));
+        const _ = l.map(A).filter((S) => S && S._parentKeys), p = ke(Nt(_.map((S) => S._parentKeys))).filter(ge).map(A).filter(Boolean), P = [], L = [];
+        return p.forEach((S) => {
+          const N = t(S);
+          h(S, l) ? P.push(N) : L.push(N);
+        }), l.push(...P), ke(l.filter((S) => !L.includes(S)));
+      }
+    }
+  };
+}, Ae = ["sm", "md", "lg"], Gt = ["error", "warning", "success"], jt = { key: 1 }, Ne = /* @__PURE__ */ te({
+  __name: "ComboboxInput",
+  setup(c) {
+    const o = Se();
+    Dt(
+      () => o.open.value && o.headerInputElement.value,
+      () => {
+        o.headerInputElement.value && o.open.value && o.focusOnInput();
+      }
+    );
+    const t = f(() => !J(o.modelValue.value)), e = f(() => t.value ? H(o.modelValue.value) ? o.getLabelByValue(wt(o.modelValue.value)) : o.getLabelByValue(o.modelValue.value) : o.props.placeholder), d = (B) => {
+      if (B.key === "Backspace" && o.props.multiple && H(o.modelValue.value) && J(o.searchModel.value) && (o.setModelValue(o.modelValue.value.slice(0, -1)), J(o.modelValue.value))) {
+        const h = setTimeout(() => {
+          o.focusOnInput(), clearTimeout(h);
+        }, 2);
+      }
+    }, u = V(K, "input"), x = xe(u, {
+      variants: {
+        valuePlaceholder: Y("value-placeholder", u)
+      }
+    });
+    return (B, h) => (ae(), Ce(D(Xe), Me(D(o).comboboxInputBinding.value, {
+      disabled: D(o).getDisabled.value,
+      placeholder: e.value,
+      "as-child": "",
+      modelValue: D(o).searchModel.value,
+      "onUpdate:modelValue": h[0] || (h[0] = (C) => D(o).searchModel.value = C),
+      onKeydown: d,
+      class: D(x)({
+        valuePlaceholder: t.value
+      }),
+      displayValue: () => ""
+    }), {
+      default: me(() => [
+        D(o).props.headerSearch ? (ae(), Ce(kt, {
+          key: 0,
+          ref: D(o).headerInputElement,
+          placeholder: D(o).props.placeholder
+        }, {
+          leading: me(({ iconSize: C }) => [
+            Le(Be, {
+              size: C,
+              icon: "tabler:search",
+              flipOnDir: "rtl"
+            }, null, 8, ["size"])
+          ]),
+          _: 1
+        }, 8, ["placeholder"])) : (ae(), we("input", jt))
+      ]),
+      _: 1
+    }, 16, ["disabled", "placeholder", "modelValue", "class"]));
+  }
+}), Ut = /* @__PURE__ */ te({
+  name: Ve("ComboboxTrigger"),
+  props: {},
+  setup(c, {
+    slots: o,
+    attrs: t
+  }) {
+    const e = Se(), d = ({
+      value: p
+    }, P) => {
+      if (P.stopPropagation(), p && H(e.modelValue.value) && !e.getDisabled.value) {
+        const L = e.modelValue.value.filter((S) => S !== p);
+        e.setModelValue(L);
+      }
+    }, u = V(K, "trigger"), x = xe(u, {
+      variants: {
+        size: Y(Ae, u),
+        status: Y(Gt, u),
+        bordered: Y("bordered", u),
+        multiple: Y("multiple", u),
+        contentFit: Y("content-fit", u),
+        wrapped: Y("wrapped", u),
+        filled: Y("filled", u)
+      }
+    }), B = f(() => {
+      switch (e.getSize.value) {
+        case "sm":
+          return "2xsm";
+        case "md":
+        default:
+          return "xsm";
+      }
+    }), h = f(() => {
+      if (!e.props.multiple && fe(e.modelValue.value) && !J(e.modelValue.value))
+        return e.getOptionByValue(e.modelValue.value);
+    }), C = (p = h.value) => {
+      if (e.props.selectedItemIconAsTrailingIcon && _e(p) && "icon" in p)
+        return p.icon;
+    }, A = f(() => C()), W = f(() => {
+      if (!e.props.noTrailing)
+        return e.props.trailingIcon;
+    }), n = f(() => ({
+      modelValue: ee(e.modelValue.value),
+      open: ee(e.open.value)
+    })), g = () => {
+      e.onOpenChange(!e.open.value);
+    }, l = (p) => {
+      console.log("event ===>", p), e.props.headerSearch;
+    }, i = f(() => ({
+      disabled: e.getDisabled.value,
+      tabindex: e.getDisabled.value || !e.props.headerSearch ? -1 : 0,
+      reference: e.props.reference,
+      "data-disabled": e.getDisabled.value ? "" : void 0,
+      "aria-disabled": e.getDisabled.value ?? void 0,
+      "aria-label": "Show popup",
+      "aria-haspopup": "listbox",
+      "aria-expanded": e.open.value,
+      "aria-controls": e.contentId,
+      "data-state": e.open.value ? "open" : "closed",
+      class: [x({
+        size: e.getSize.value,
+        status: e.getStatus.value === "success" && J(e.modelValue.value) ? void 0 : e.getStatus.value,
+        bordered: e.props.bordered,
+        multiple: e.props.multiple,
+        contentFit: e.props.contentFit,
+        wrapped: e.props.wrapped,
+        filled: !J(e.modelValue.value)
+      }), e.props.triggerCls],
+      ...t
+    })), _ = (p, P = B.value) => s(Be, {
+      icon: p,
+      size: P
+    }), O = () => {
+      var L;
+      let p;
+      const P = (L = o.triggerTrailing) == null ? void 0 : L.call(o, n.value);
+      if (F(P) ? W.value && (p = _(W.value)) : p = P, p)
+        return s("div", {
+          class: [V(u, "trailing"), e.props.triggerTrailingCls]
+        }, p);
+    };
+    return () => {
+      var S;
+      const p = (S = o.trigger) == null ? void 0 : S.call(o, n.value), L = (() => {
+        if (F(p)) return !1;
+        const N = vt(p) ?? null, k = N.length === 1 ? N[0] : N;
+        return k ? ht(k) && !bt(k) : !0;
+      })();
+      return s(Ze, {
+        ...i.value,
+        ...e.comboboxTriggerBinding.value,
+        asChild: L,
+        as: L ? "template" : "button",
+        key: String(L),
+        onKeyUp: l,
+        onClick: g
+      }, () => {
+        if (!F(p))
+          return p;
+        const N = (T) => {
+          var G, R;
+          const M = e.getOptionByValue(T);
+          return s(Re, {
+            ...M ? ((R = (G = e.props).getTagProps) == null ? void 0 : R.call(G, M)) ?? {} : {},
+            size: e.getTagSize.value
+          });
+        }, k = (T) => {
+          var G, R;
+          const M = e.getOptionByValue(T);
+          return s($e, {
+            ...M ? ((R = (G = e.props).getTagProps) == null ? void 0 : R.call(G, M)) ?? {} : {},
+            size: e.getTagSize.value
+          });
+        }, le = () => {
+          if (!e.props.multiple && !H(e.modelValue.value) && e.modelValue.value && (e.props.tagRenderMode && ["avatar", "go"].includes(e.props.tagRenderMode) || A.value || e.props.leadingIcon)) {
+            let T;
+            if (e.props.tagRenderMode === "avatar" ? T = N(e.modelValue.value) : e.props.tagRenderMode === "go" ? T = k(e.modelValue.value) : A.value ? T = _(A.value) : e.props.leadingIcon && (T = _(e.props.leadingIcon)), !F(T))
+              return s("div", {
+                class: [V(u, "leading"), e.props.triggerLeadingCls]
+              }, T);
+          }
+        }, ve = () => {
+          const T = [], M = [V(u, "content"), e.props.triggerContentCls, J(e.modelValue.value) ? e.props.triggerContentPlaceholderCls : e.props.triggerContentValueCls], R = (() => {
+            if (e.props.multiple && H(e.modelValue.value)) {
+              if (e.props.tagRenderMode === "avatar")
+                return s(zt, {
+                  maxCount: e.props.maxCount,
+                  size: e.getTagSize.value,
+                  closeable: !e.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !e.props.wrapped,
+                  class: M
+                }, () => e.modelValue.value.map(N));
+              if (e.props.tagRenderMode === "go")
+                return s(It, {
+                  maxCount: e.props.maxCount,
+                  size: e.getTagSize.value,
+                  closeable: !e.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !e.props.wrapped,
+                  class: M
+                }, () => e.modelValue.value.map(k));
+              if (e.props.tagRenderMode === "chip")
+                return s(Tt, {
+                  maxCount: e.props.maxCount,
+                  size: e.getTagSize.value,
+                  color: "primary",
+                  closeable: !e.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !e.props.wrapped,
+                  class: M,
+                  onClose: d
+                }, () => e.modelValue.value.map((Q) => {
+                  var ue, ce;
+                  const pe = () => e.getLabelByValue(Q), he = ({
+                    size: de
+                  }) => {
+                    const oe = C(e.getOptionByValue(Q)) ?? e.props.leadingIcon;
+                    return oe ? _(oe, de) : null;
+                  }, X = e.getOptionByValue(Q);
+                  return s(Pt, {
+                    ...X ? ((ce = (ue = e.props).getTagProps) == null ? void 0 : ce.call(ue, X)) ?? {} : {},
+                    value: Q,
+                    class: [V(u, "tag"), e.props.tagCls],
+                    closeIconCls: V(u, "tag__close")
+                  }, {
+                    text: pe,
+                    leading: he
+                  });
+                }));
+            }
+          })();
+          return R ? T.push(R) : e.props.headerSearch && T.push(s("div", {
+            class: [...M, V(u, "content--empty")]
+          })), e.props.headerSearch || T.push(s(Ne)), T;
+        }, q = [], se = le();
+        F(se) || q.push(se), q.push(ve());
+        const ie = O();
+        return F(ie) || q.push(ie), q;
+      });
+    };
+  }
+}), Ht = /* @__PURE__ */ te({
+  __name: "ComboboxLabel",
+  setup(c) {
+    return (o, t) => (ae(), we("div", {
+      class: Ge(D(V)(D(K), "label"))
+    }, [
+      Ee(o.$slots, "default")
+    ], 2));
+  }
+}), De = /* @__PURE__ */ te({
+  name: Ve("SelectOption"),
+  props: {
+    option: {
+      type: [Object, String],
+      required: !0
+    }
+  },
+  slots: Object,
+  setup(c, {
+    slots: o
+  }) {
+    const t = Se(), e = f(() => {
+      switch (t.getSize.value) {
+        case "sm":
+          return "2xsm";
+        case "lg":
+          return "sm";
+        case "md":
+        default:
+          return "xsm";
+      }
+    }), d = f(() => t.getOptionValue(c.option)), u = f(() => t.getOptionLabel(c.option)), x = f(() => t.getOptionIcon(c.option)), B = f(() => t.props.tree ? void 0 : t.getOptionDescription(c.option)), h = f(() => t.getOptionDisabled(c.option)), C = f(() => Array.isArray(t.modelValue.value) ? !!(d.value && t.modelValue.value.includes(d.value)) : t.modelValue.value === d.value), A = V(K, "option"), W = () => {
+      if (!(t.props.tree || !d.value || h.value))
+        if (t.props.multiple) {
+          const n = H(t.modelValue.value) ? t.modelValue.value : [];
+          n.includes(d.value) ? t.setModelValue(n.filter((l) => l !== d.value)) : t.setModelValue([...n, d.value]);
+        } else
+          t.setModelValue(d.value);
+    };
+    if (!c.option) throw new Error("option is required");
+    return () => {
+      const n = (l) => {
+        var _, O, p, P;
+        const i = [];
+        return !t.props.tree && t.props.multiple && t.props.checkbox && i.push(s(Et, {
+          modelValue: C.value,
+          size: l.checkboxSize,
+          disabled: h.value
+        })), t.props.tagRenderMode === "avatar" ? i.push(s(Re, {
+          ...((O = (_ = t.props).getTagProps) == null ? void 0 : O.call(_, c.option)) ?? {},
+          size: t.getTagSize.value
+        })) : t.props.tagRenderMode === "go" ? i.push(s($e, {
+          ...((P = (p = t.props).getTagProps) == null ? void 0 : P.call(p, c.option)) ?? {},
+          size: t.getTagSize.value
+        })) : x.value && i.push(s(Be, {
+          icon: x.value,
+          size: e.value
+        })), F(i) ? null : i;
+      };
+      return (() => {
+        const l = !!B.value;
+        return s(Lt, {
+          class: A,
+          description: B.value,
+          title: u.value,
+          key: d.value,
+          selected: C.value,
+          unFocusable: !0,
+          leadingCenter: !l,
+          size: t.getSize.value,
+          disabled: h.value,
+          onClick: W
+        }, {
+          leading: n,
+          trailing: () => {
+            var i;
+            return (i = o.trailing) == null ? void 0 : i.call(o, {
+              option: c.option
+            });
+          }
+        });
+      })();
+    };
+  }
+}), qt = /* @__PURE__ */ te({
+  name: Ve("ComboboxWrapper"),
+  setup(c, {
+    slots: o
+  }) {
+    const t = Rt(), e = et(), d = ye();
+    Vt({
+      target: d
+    });
+    const u = ye(), x = xt({
+      triggerRef: u,
+      props: t.props
+    }), {
+      getFlipOnDir: B,
+      getDir: h
+    } = ct(), C = B("reversePlacementOnDir"), A = h(), W = Bt({
+      props: t.props,
+      flip: C,
+      emitsAsProps: t.emitsAsProps,
+      _dir: A,
+      controlAutoFocus: !1,
+      extraPropNames: ["bodyLock", "position"]
+    }), n = ({
+      key: r,
+      getterKey: z,
+      defaultValue: b,
+      noReturnOption: m
+    }) => (y) => {
+      const w = Te(b) ? b(y) : b;
+      if (_e(y)) {
+        const $ = y[r] ?? w, j = z && t.props[z];
+        if (j) {
+          if (fe(j))
+            return y[j] ?? $;
+          if (Te(j)) return j(y) ?? $;
+        }
+        return $;
+      }
+      return fe(y) && !m ? y ?? w : w;
+    }, g = n({
+      getterKey: "getValue",
+      key: "value"
+    }), l = n({
+      getterKey: "getLabel",
+      key: "label",
+      defaultValue: g
+    }), i = n({
+      getterKey: "getIcon",
+      key: "icon",
+      noReturnOption: !0
+    }), _ = n({
+      getterKey: "getDescription",
+      key: "description",
+      noReturnOption: !0
+    }), O = n({
+      getterKey: "getDisabled",
+      key: "disabled",
+      defaultValue: !1,
+      noReturnOption: !0
+    }), p = n({
+      getterKey: "getGroupLabel",
+      key: "label",
+      noReturnOption: !0
+    }), P = n({
+      getterKey: "getGroupOptions",
+      key: "options",
+      noReturnOption: !0
+    }), L = (r) => {
+      var z;
+      if ((z = t.props.options) != null && z.length)
+        for (const b of t.props.options) {
+          if (g(b) === r) return b;
+          const m = P(b);
+          if (m != null && m.length) {
+            for (const y of m)
+              if (g(y) === r) return y;
+          }
+        }
+      return r;
+    }, S = (r) => {
+      const z = L(r);
+      return z ? l(z) ?? r : r;
+    }, {
+      contains: N
+    } = tt({
+      sensitivity: "base"
+    }), k = f(() => {
+      const r = (z) => z == null ? void 0 : z.map((b) => {
+        const m = l(b), y = g(b), w = O(b), $ = p(b), j = !t.searchModel.value || m && N(m, t.searchModel.value), re = P(b), ne = !t.props.tree || y;
+        if (re && ne) {
+          const a = r(re);
+          if (a != null && a.length || j)
+            return {
+              groupLabel: $,
+              title: m,
+              key: y,
+              disabled: w,
+              children: a,
+              _option: b
+            };
+        }
+        return j && ne ? {
+          title: m,
+          key: y,
+          disabled: w,
+          _option: b
+        } : null;
+      }).filter(Boolean);
+      if (t.props.options)
+        return r(t.props.options);
+    }), {
+      getDisabled: le,
+      getStatus: ve,
+      getSize: q
+    } = Ct({
+      getDisabled: () => t.props.disabled,
+      getSize: () => t.props.size,
+      getStatus: () => t.props.status
+    }), se = f(() => {
+      switch (q.value) {
+        case "sm":
+          return "xsm";
+        case "lg":
+          return "md";
+        case "md":
+        default:
+          return "sm";
+      }
+    }), {
+      inputBindings: ie,
+      rootBindings: T
+    } = _t({
+      getDisabled: () => le.value
+    }), M = ye(), G = () => {
+      var r, z, b, m, y, w, $;
+      e.open.value && e.inputElement.value && (t.props.headerSearch && ((r = M.value) != null && r.input) ? document.activeElement !== ((z = M.value) == null ? void 0 : z.input) && ((y = (m = (b = M.value) == null ? void 0 : b.input) == null ? void 0 : m.focus) == null || y.call(m)) : document.activeElement !== e.inputElement.value && (($ = (w = e.inputElement.value) == null ? void 0 : w.focus) == null || $.call(w)));
+    }, R = (r) => {
+      e.modelValue.value = r, t.emit("update:modelValue", r);
+    };
+    Kt({
+      ...t,
+      getOptionValue: g,
+      getOptionLabel: l,
+      getOptionDescription: _,
+      getOptionDisabled: O,
+      getOptionIcon: i,
+      getOptionByValue: L,
+      getLabelByValue: S,
+      focusOnInput: G,
+      setModelValue: R,
+      headerInputElement: M,
+      getDisabled: le,
+      getStatus: ve,
+      getSize: q,
+      getTagSize: se,
+      comboboxInputBinding: ie,
+      comboboxTriggerBinding: T,
+      ...e,
+      modelValue: e.modelValue
+    }), je(() => [t.props.clearOnChangeMultiple, t.props.multiple], () => {
+      t.props.clearOnChangeMultiple && R(void 0);
+    });
+    const Q = f(() => {
+      const r = t.props.scrollContainerProps ?? {};
+      return {
+        ...r,
+        areaCls: [V(K, "scroll_area"), r == null ? void 0 : r.class, r == null ? void 0 : r.areaCls]
+      };
+    }), pe = V(K, "popup"), he = xe(pe, {
+      variants: {
+        size: Y(Ae, pe)
+      }
+    }), X = (r) => {
+      if (Number(r) > 0)
+        return `${r}px`;
+      if (typeof r == "string")
+        return r;
+    }, ue = f(() => X(t.props.popupWidth)), ce = f(() => X(t.props.popupHeight)), de = f(() => X(t.props.minWidth)), oe = f(() => ({
+      type: q.value === "sm" ? "simple" : "advance",
+      ...ze(t.props.emptyProps ?? {}, "class")
+    })), Fe = f(() => ze(t.props.skeletonProps ?? {}, "class")), {
+      selectValues: We
+    } = Wt({
+      getValue: (r) => r == null ? void 0 : r.key,
+      getChildren: (r) => r == null ? void 0 : r.children,
+      getModel: () => ee(e.modelValue.value),
+      getData: () => ee(k.value ?? [])
+    });
+    return () => {
+      var re, ne;
+      const r = (a) => {
+        var v;
+        if ((v = k.value) != null && v.length && a > 0)
+          return !!k.value[a - 1];
+      }, z = (a) => {
+        var v, E;
+        if ((v = k.value) != null && v.length && a > 0) {
+          const I = k.value[a - 1];
+          return !!(I && ((E = P(I)) != null && E.length));
+        }
+      }, b = (a) => s(De, {
+        option: a
+      }, {
+        trailing: () => {
+          var v;
+          return (v = o.optionTrailing) == null ? void 0 : v.call(o, {
+            option: a
+          });
+        }
+      }), m = [];
+      let y;
+      if (t.props.tree) {
+        const v = H(e.modelValue.value) ? e.modelValue.value : e.modelValue.value ? [e.modelValue.value] : [];
+        y = s(Ot, {
+          data: k.value ?? [],
+          selectable: !0,
+          checkbox: t.props.multiple && t.props.checkbox,
+          multiple: t.props.multiple,
+          defaultExpandAll: !0,
+          syncCheckboxAndSelect: t.props.multiple,
+          showLine: !0,
+          modelValue: v,
+          checkedKeys: v,
+          onExpand: G,
+          onSelect: (E, I, U) => {
+            if (t.props.multiple) {
+              const Z = H(U) ? U : [U];
+              R(We(Z, I));
+            } else
+              R(U);
+          },
+          class: "w-full"
+        }, {
+          title: (E) => b(E._option)
+        }), m.push(y);
+      } else
+        (k.value ?? []).forEach((a, v) => {
+          var E;
+          (E = a.children) != null && E.length ? (r(v) && m.push(s(Ie)), a.groupLabel && m.push(s(Ht, {
+            class: t.props.labelCls
+          }, () => a.groupLabel)), a.children.forEach((I) => {
+            m.push(b(I._option));
+          })) : z(v) ? m.push(s(Ie)) : m.push(b(a._option));
+        });
+      const w = yt(y ? [y] : m, De).filter((a) => {
+        var v;
+        return _e(a == null ? void 0 : a.props) && ((v = a == null ? void 0 : a.props) == null ? void 0 : v.option);
+      }), $ = !!(t.props.tree && ((re = k.value) != null && re.length) || w != null && w.length), j = () => {
+        var v, E;
+        const a = [];
+        if ($ || t.props.loading) {
+          const I = [];
+          if ($ && I.push(...m), t.props.loading) {
+            const U = (v = o.loading) == null ? void 0 : v.call(o, {});
+            if (!F(U)) I.push(U);
+            else {
+              const Z = new Array($ ? 2 : t.props.loadingRowCount).fill(1);
+              I.push(...Z.map(() => s(ft, {
+                size: q.value,
+                class: [V(K, "skeleton"), t.props.skeletonCls],
+                ...Fe.value
+              })));
+            }
+          }
+          a.push(s("div", {
+            class: [V(K, "options"), t.props.optionsCls]
+          }, I));
+        } else if (!$) {
+          const I = (E = o.empty) == null ? void 0 : E.call(o, oe.value);
+          F(I) ? a.push(s(mt, {
+            class: [V(K, "empty"), t.props.emptyCls],
+            ...oe.value
+          }, {
+            title: o.emptyTitle,
+            description: o.emptyDescription,
+            actions: o.emptyActions,
+            image: o.emptyImage
+          })) : a.push(I);
+        }
+        return t.props.lazyLoading && a.push(s("div", {
+          class: V(K, "lazy_loading")
+        }, s("div", {
+          class: V(K, "lazy_loading_trigger"),
+          ref: d
+        }))), a;
+      };
+      return [s(Ut, {
+        ref: u,
+        ...t.attrs,
+        style: {
+          ...((ne = t.attrs) == null ? void 0 : ne.style) ?? {},
+          "--ptc-combobox-trigger-min-w": de.value
+        }
+      }, {
+        trigger: o.trigger,
+        triggerTrailing: o.triggerTrailing
+      }), s(ot, x.value, () => s(rt, {
+        ...W.value,
+        vShow: e.open.value,
+        class: [he(t.props), t.props.popupCls],
+        style: {
+          "--ptc-combobox-popup-width": t.props.samePopupWidth ? void 0 : ue.value,
+          "--ptc-combobox-popup-height": ce.value,
+          "--ptc-combobox-trigger-min-w": de.value
+        },
+        onClick: G
+      }, () => {
+        var U, Z, Oe;
+        const a = [], v = (U = o.header) == null ? void 0 : U.call(o, {}), E = !F(v);
+        if (t.props.headerSearch || E) {
+          const be = [];
+          E && be.push(v), t.props.headerSearch && be.push(s(Ne)), a.push(s("div", {
+            class: V(K, "header")
+          }, be));
+        }
+        a.push(s(St, Q.value, j));
+        const I = (Oe = o.footer) == null ? void 0 : Oe.call(o, {
+          isEmpty: !((Z = k.value) != null && Z.length),
+          search: t.searchModel.value
+        });
+        return F(I) || a.push(s("div", {
+          class: V(K, "footer")
+        }, I)), a;
+      }))];
+    };
+  }
+}), To = /* @__PURE__ */ te({
+  ...pt("Combobox"),
+  __name: "Combobox",
+  props: {
+    size: { default: "md" },
+    status: {},
+    multiple: { type: Boolean, default: void 0 },
+    checkbox: { type: Boolean, default: !0 },
+    tagRenderMode: { default: "chip" },
+    getTagProps: {},
+    tree: { type: Boolean },
+    contentFit: { type: Boolean },
+    wrapped: { type: Boolean },
+    noTrailing: { type: Boolean },
+    leadingIcon: {},
+    trailingIcon: { default: "tabler:chevron-down" },
+    selectedItemIconAsTrailingIcon: { type: Boolean, default: !0 },
+    maxCount: {},
+    to: {},
+    placeholder: {},
+    indicatorIcon: { default: "tabler:check" },
+    options: {},
+    getDisabled: {},
+    getLabel: {},
+    getDescription: {},
+    getValue: {},
+    getGroupOptions: {},
+    getGroupLabel: {},
+    getIcon: {},
+    placement: { default: "bottom-start" },
+    reversePlacementOnDir: {},
+    loading: { type: Boolean },
+    skeletonProps: {},
+    loadingRowCount: { default: 10 },
+    lazyLoading: { type: Boolean },
+    bordered: { type: Boolean, default: !0 },
+    clearOnChangeMultiple: { type: Boolean, default: !0 },
+    triggerCls: {},
+    triggerLeadingCls: {},
+    triggerContentCls: {},
+    triggerContentPlaceholderCls: {},
+    triggerContentValueCls: {},
+    triggerTrailingCls: {},
+    itemLeadingCls: {},
+    optionCls: {},
+    tagCls: {},
+    popupCls: {},
+    labelCls: {},
+    optionsCls: {},
+    optionTextCls: {},
+    optionContentCls: {},
+    emptyCls: {},
+    skeletonCls: {},
+    scrollContainerProps: {},
+    emptyProps: {},
+    samePopupWidth: { type: Boolean, default: !0 },
+    popupHeight: { default: 384 },
+    popupWidth: {},
+    minWidth: {},
+    headerSearch: { type: Boolean },
+    search: {},
+    open: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: void 0 },
+    resetSearchTermOnBlur: { type: Boolean, default: !0 },
+    resetSearchTermOnSelect: { type: Boolean, default: !0 },
+    modelValue: {},
+    defaultValue: {},
+    dir: {},
+    disabled: { type: Boolean, default: void 0 },
+    highlightOnHover: { type: Boolean },
+    by: {},
+    asChild: { type: Boolean },
+    as: {},
+    name: {},
+    required: { type: Boolean },
+    reference: {},
+    forceMount: { type: Boolean, default: void 0 },
+    position: { default: "popper" },
+    bodyLock: { type: Boolean },
+    side: {},
+    sideOffset: { default: 4 },
+    align: {},
+    alignOffset: {},
+    avoidCollisions: { type: Boolean, default: void 0 },
+    collisionBoundary: {},
+    collisionPadding: { default: 4 },
+    arrowPadding: {},
+    sticky: {},
+    hideWhenDetached: { type: Boolean, default: void 0 },
+    positionStrategy: { default: "fixed" },
+    updatePositionStrategy: {},
+    disableUpdateOnLayoutShift: { type: Boolean, default: void 0 },
+    prioritizePosition: { type: Boolean, default: void 0 },
+    disableOutsidePointerEvents: { type: Boolean },
+    defer: { type: Boolean }
+  },
+  emits: ["update:search", "update:modelValue", "highlight", "update:open", "escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside"],
+  setup(c, { emit: o }) {
+    const t = c, e = o, d = nt(e), u = f(
+      () => st(
+        {
+          ...Pe(
+            t,
+            "open",
+            "defaultOpen",
+            "defaultValue",
+            "modelValue",
+            "by",
+            "dir",
+            "multiple",
+            "disabled"
+          ),
+          ...Pe(
+            d,
+            "onUpdate:modelValue",
+            "onUpdate:open"
+          ),
+          ignoreFilter: !0
+        },
+        it
+      )
+    ), x = Mt(t, "search", e, {
+      passive: t.search === void 0
+    }), B = Ue(), h = He();
+    return $t({
+      attrs: h,
+      props: t,
+      emit: e,
+      searchModel: x,
+      emitsAsProps: d
+    }), (C, A) => (ae(), Ce(D(at), Me(u.value, { class: D(K) }), {
+      default: me(() => [
+        Le(D(qt), null, qe({ _: 2 }, [
+          Ye(Object.keys(B), (W) => ({
+            name: W,
+            fn: me((n) => [
+              Ee(C.$slots, W, Je(Qe(n)))
+            ])
+          }))
+        ]), 1024)
+      ]),
+      _: 3
+    }, 16, ["class"]));
+  }
+});
+export {
+  Ae as C,
+  To as _,
+  Gt as a,
+  Se as i,
+  Kt as p
+};