@pantograph/vue 0.23.4 → 0.23.6

package/dist/Combobox.vue_vue_type_style_index_0_lang-DIXSNQlS.js

@@ -0,0 +1,924 @@
+import { computed as f, unref as w, defineComponent as Z, createBlock as he, openBlock as re, mergeProps as De, withCtx as ce, createElementBlock as Me, createVNode as we, h as s, normalizeClass as Ge, renderSlot as Le, ref as ve, 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 Ee, ComboboxInput as Xe, ComboboxAnchor as Ze, injectComboboxRootContext as et, useFilter as tt, ComboboxPortal as ot, ComboboxContent as nt, useEmitAsProps as rt, ComboboxRoot as at } from "reka-ui";
+import { g as lt, h as X, o as st, f as Oe, j as it } from "./FormItem.vue_vue_type_style_index_0_lang-DbMENNc4.js";
+import { a as ye, g as pt } from "./options-D4et5euX.js";
+import { getBemBlock as ut, getBemElement as x, generateVariantClassList as Y } from "@pantograph/utils";
+import { a as de, i as H, b as be, u as ct, d as Pe } from "./index-jwkhq8oW.js";
+import { cva as Ce } from "class-variance-authority";
+import { a as dt, l as gt, o as Te } 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 W, 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-Bzs7T9xb.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-BGRXQmj3.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-DBDkYw9s.js";
+import { u as ze } from "./uniq-BeFmBpYC.js";
+import { i as J } from "./isEmpty-wdqPTIXx.js";
+import { _ as Pt } from "./Chip.vue_vue_type_style_index_0_lang-Cr1_L0Lz.js";
+import { _ as Tt } from "./ChipGroup.vue_vue_type_style_index_0_lang-j6Reg1S9.js";
+import { _ as _e } from "./Icon.vue_vue_type_style_index_0_lang-CbLL-Ngi.js";
+import { d as It, _ as Ke } from "./Avatar.vue_vue_type_style_index_0_lang-Dj-jkrYp.js";
+import { _ as zt } from "./GraphicalObjectGroup.vue_vue_type_style_index_0_lang-CB9Q1b9r.js";
+import { _ as Re } from "./GraphicalObject.vue_vue_type_script_setup_true_lang-C4i8C-dP.js";
+import { _ as kt } from "./Input.vue_vue_type_style_index_0_lang-Ccow0nkI.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-C8ofBbNv.js";
+import "@iconify/vue";
+import { _ as Et } from "./Checkbox.vue_vue_type_style_index_0_lang-Dhn_dWz7.js";
+import "@pantograph/tokens";
+const [Ve, Kt] = Ee("Combobox"), [Rt, $t] = Ee("_Combobox"), R = ut("combobox");
+var At = 1 / 0;
+function Nt(d) {
+  var o = d == null ? 0 : d.length;
+  return o ? dt(d, At) : [];
+}
+const ue = (d) => lt(d) || de(d);
+function Ft({
+  getValue: d,
+  arr: o,
+  getChildren: t
+}) {
+  const e = [], g = (u, B) => {
+    u.forEach((S) => {
+      const y = d(S);
+      if (ue(y)) {
+        e.push({ ...S, _parentKeys: B, _key: y });
+        const C = t(S);
+        C != null && C.length && g(C, [...B ?? [], y]);
+      }
+    });
+  };
+  return g(o), e;
+}
+const Wt = ({
+  getData: d,
+  getModel: o,
+  getValue: t,
+  getChildren: e
+}) => {
+  const g = f(
+    () => Ft({ arr: w(d()), getChildren: e, getValue: t })
+  ), u = (r, m = !1) => {
+    const l = t(r);
+    return g.value.filter((i) => {
+      var _;
+      if (m) {
+        const I = gt(i._parentKeys ?? []);
+        return I && I === l;
+      }
+      return (_ = i._parentKeys) == null ? void 0 : _.includes(l);
+    });
+  }, B = (r) => {
+    if (r && H(r))
+      return X(r);
+    const m = w(o());
+    return m && H(m) ? X(m) : [];
+  }, S = (r, m) => {
+    const l = B(m), i = u(r);
+    if (i != null && i.length)
+      return i.some((_) => {
+        var p;
+        const I = _._key;
+        return I && ((p = l == null ? void 0 : l.includes) == null ? void 0 : p.call(l, I));
+      });
+  }, y = (r, m) => {
+    const l = B(m), i = u(r);
+    if (i != null && i.length)
+      return i.every((_) => {
+        var p;
+        const I = _._key;
+        return I && ((p = l == null ? void 0 : l.includes) == null ? void 0 : p.call(l, I));
+      });
+  }, C = (r, m) => {
+    const l = B(m), i = u(r), _ = t(r);
+    return i != null && i.length ? y(r) ? !0 : S(r) ? "intermediate" : !1 : l.includes(_);
+  }, N = (r) => ue(r) ? g.value.find((m) => m._key === r) : void 0;
+  return {
+    flattenData: g,
+    getNodeChildren: u,
+    isSomeChildrenSelected: S,
+    isAllChildrenSelected: y,
+    isSelected: C,
+    selectValues: (r, m) => {
+      if (r.length) {
+        let l = B();
+        const i = r.filter(ue);
+        m ? l.push(...i) : l = l.filter((P) => !i.includes(P));
+        const _ = l.map(N).filter((P) => P && P._parentKeys), p = ze(Nt(_.map((P) => P._parentKeys))).filter(ue).map(N).filter(Boolean), O = [], E = [];
+        return p.forEach((P) => {
+          const F = t(P);
+          y(P, l) ? O.push(F) : E.push(F);
+        }), l.push(...O), ze(l.filter((P) => !E.includes(P)));
+      }
+    }
+  };
+}, $e = ["sm", "md", "lg"], Gt = ["error", "warning", "success"], jt = { key: 1 }, Ae = /* @__PURE__ */ Z({
+  __name: "ComboboxInput",
+  setup(d) {
+    const o = Ve();
+    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), g = (S) => {
+      if (S.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 y = setTimeout(() => {
+          o.focusOnInput(), clearTimeout(y);
+        }, 2);
+      }
+    }, u = x(R, "input"), B = Ce(u, {
+      variants: {
+        valuePlaceholder: Y("value-placeholder", u)
+      }
+    });
+    return (S, y) => (re(), he(w(Xe), De(w(o).comboboxInputBinding.value, {
+      disabled: w(o).getDisabled.value,
+      placeholder: e.value,
+      "as-child": "",
+      modelValue: w(o).searchModel.value,
+      "onUpdate:modelValue": y[0] || (y[0] = (C) => w(o).searchModel.value = C),
+      onKeydown: g,
+      class: w(B)({
+        valuePlaceholder: t.value
+      }),
+      displayValue: () => ""
+    }), {
+      default: ce(() => [
+        w(o).props.headerSearch ? (re(), he(kt, {
+          key: 0,
+          ref: w(o).headerInputElement,
+          placeholder: w(o).props.placeholder
+        }, {
+          leading: ce(({ iconSize: C }) => [
+            we(_e, {
+              size: C,
+              icon: "tabler:search",
+              flipOnDir: "rtl"
+            }, null, 8, ["size"])
+          ]),
+          _: 1
+        }, 8, ["placeholder"])) : (re(), Me("input", jt))
+      ]),
+      _: 1
+    }, 16, ["disabled", "placeholder", "modelValue", "class"]));
+  }
+}), Ut = /* @__PURE__ */ Z({
+  name: ye("ComboboxTrigger"),
+  props: {},
+  setup(d, {
+    slots: o,
+    attrs: t
+  }) {
+    const e = Ve(), g = ({
+      value: p
+    }, O) => {
+      if (O.stopPropagation(), p && H(e.modelValue.value) && !e.getDisabled.value) {
+        const E = e.modelValue.value.filter((P) => P !== p);
+        e.setModelValue(E);
+      }
+    }, u = x(R, "trigger"), B = Ce(u, {
+      variants: {
+        size: Y($e, 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)
+      }
+    }), S = f(() => {
+      switch (e.getSize.value) {
+        case "sm":
+          return "2xsm";
+        case "md":
+        default:
+          return "xsm";
+      }
+    }), y = f(() => {
+      if (!e.props.multiple && de(e.modelValue.value) && !J(e.modelValue.value))
+        return e.getOptionByValue(e.modelValue.value);
+    }), C = (p = y.value) => {
+      if (e.props.selectedItemIconAsTrailingIcon && be(p) && "icon" in p)
+        return p.icon;
+    }, N = f(() => C()), G = f(() => {
+      if (!e.props.noTrailing)
+        return e.props.trailingIcon;
+    }), r = f(() => ({
+      modelValue: X(e.modelValue.value),
+      open: X(e.open.value)
+    })), m = () => {
+      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: [B({
+        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, O = S.value) => s(_e, {
+      icon: p,
+      size: O
+    }), I = () => {
+      var E;
+      let p;
+      const O = (E = o.triggerTrailing) == null ? void 0 : E.call(o, r.value);
+      if (W(O) ? G.value && (p = _(G.value)) : p = O, p)
+        return s("div", {
+          class: [x(u, "trailing"), e.props.triggerTrailingCls]
+        }, p);
+    };
+    return () => {
+      var P;
+      const p = (P = o.trigger) == null ? void 0 : P.call(o, r.value), E = (() => {
+        if (W(p)) return !1;
+        const F = vt(p) ?? null, D = F.length === 1 ? F[0] : F;
+        return D ? ht(D) && !bt(D) : !0;
+      })();
+      return s(Ze, {
+        ...i.value,
+        ...e.comboboxTriggerBinding.value,
+        asChild: E,
+        as: E ? "template" : "button",
+        key: String(E),
+        onKeyUp: l,
+        onClick: m
+      }, () => {
+        if (!W(p))
+          return p;
+        const F = (z) => {
+          var j, $;
+          const L = e.getOptionByValue(z);
+          return s(Ke, {
+            ...L ? (($ = (j = e.props).getTagProps) == null ? void 0 : $.call(j, L)) ?? {} : {},
+            size: e.getTagSize.value
+          });
+        }, D = (z) => {
+          var j, $;
+          const L = e.getOptionByValue(z);
+          return s(Re, {
+            ...L ? (($ = (j = e.props).getTagProps) == null ? void 0 : $.call(j, L)) ?? {} : {},
+            size: e.getTagSize.value
+          });
+        }, ae = () => {
+          if (!e.props.multiple && !H(e.modelValue.value) && e.modelValue.value && (e.props.tagRenderMode && ["avatar", "go"].includes(e.props.tagRenderMode) || N.value || e.props.leadingIcon)) {
+            let z;
+            if (e.props.tagRenderMode === "avatar" ? z = F(e.modelValue.value) : e.props.tagRenderMode === "go" ? z = D(e.modelValue.value) : N.value ? z = _(N.value) : e.props.leadingIcon && (z = _(e.props.leadingIcon)), !W(z))
+              return s("div", {
+                class: [x(u, "leading"), e.props.triggerLeadingCls]
+              }, z);
+          }
+        }, ge = () => {
+          const z = [], L = [x(u, "content"), e.props.triggerContentCls, J(e.modelValue.value) ? e.props.triggerContentPlaceholderCls : e.props.triggerContentValueCls], $ = (() => {
+            if (e.props.multiple && H(e.modelValue.value)) {
+              if (e.props.tagRenderMode === "avatar")
+                return s(It, {
+                  maxCount: e.props.maxCount,
+                  size: e.getTagSize.value,
+                  closeable: !e.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !e.props.wrapped,
+                  class: L
+                }, () => e.modelValue.value.map(F));
+              if (e.props.tagRenderMode === "go")
+                return s(zt, {
+                  maxCount: e.props.maxCount,
+                  size: e.getTagSize.value,
+                  closeable: !e.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !e.props.wrapped,
+                  class: L
+                }, () => e.modelValue.value.map(D));
+              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: L,
+                  onClose: g
+                }, () => e.modelValue.value.map((ee) => {
+                  const ie = () => e.getLabelByValue(ee), me = ({
+                    size: te
+                  }) => {
+                    const pe = C(e.getOptionByValue(ee)) ?? e.props.leadingIcon;
+                    return pe ? _(pe, te) : null;
+                  };
+                  return s(Pt, {
+                    value: ee,
+                    class: [x(u, "tag"), e.props.tagCls],
+                    closeIconCls: x(u, "tag__close")
+                  }, {
+                    text: ie,
+                    leading: me
+                  });
+                }));
+            }
+          })();
+          return $ ? z.push($) : e.props.headerSearch && z.push(s("div", {
+            class: [...L, x(u, "content--empty")]
+          })), e.props.headerSearch || z.push(s(Ae)), z;
+        }, q = [], le = ae();
+        W(le) || q.push(le), q.push(ge());
+        const se = I();
+        return W(se) || q.push(se), q;
+      });
+    };
+  }
+}), Ht = /* @__PURE__ */ Z({
+  __name: "ComboboxLabel",
+  setup(d) {
+    return (o, t) => (re(), Me("div", {
+      class: Ge(w(x)(w(R), "label"))
+    }, [
+      Le(o.$slots, "default")
+    ], 2));
+  }
+}), ke = /* @__PURE__ */ Z({
+  name: ye("SelectOption"),
+  props: {
+    option: {
+      type: [Object, String],
+      required: !0
+    }
+  },
+  slots: Object,
+  setup(d, {
+    slots: o
+  }) {
+    const t = Ve(), e = f(() => {
+      switch (t.getSize.value) {
+        case "sm":
+          return "2xsm";
+        case "lg":
+          return "sm";
+        case "md":
+        default:
+          return "xsm";
+      }
+    }), g = f(() => t.getOptionValue(d.option)), u = f(() => t.getOptionLabel(d.option)), B = f(() => t.getOptionIcon(d.option)), S = f(() => t.props.tree ? void 0 : t.getOptionDescription(d.option)), y = f(() => t.getOptionDisabled(d.option)), C = f(() => Array.isArray(t.modelValue.value) ? !!(g.value && t.modelValue.value.includes(g.value)) : t.modelValue.value === g.value), N = x(R, "option"), G = () => {
+      if (!(t.props.tree || !g.value || y.value))
+        if (t.props.multiple) {
+          const r = H(t.modelValue.value) ? t.modelValue.value : [];
+          r.includes(g.value) ? t.setModelValue(r.filter((l) => l !== g.value)) : t.setModelValue([...r, g.value]);
+        } else
+          t.setModelValue(g.value);
+    };
+    if (!d.option) throw new Error("option is required");
+    return () => {
+      const r = (l) => {
+        var _, I, p, O;
+        const i = [];
+        return !t.props.tree && t.props.multiple && i.push(s(Et, {
+          modelValue: C.value,
+          size: l.checkboxSize,
+          disabled: y.value
+        })), t.props.tagRenderMode === "avatar" ? i.push(s(Ke, {
+          ...((I = (_ = t.props).getTagProps) == null ? void 0 : I.call(_, d.option)) ?? {},
+          size: t.getTagSize.value
+        })) : t.props.tagRenderMode === "go" ? i.push(s(Re, {
+          ...((O = (p = t.props).getTagProps) == null ? void 0 : O.call(p, d.option)) ?? {},
+          size: t.getTagSize.value
+        })) : B.value && i.push(s(_e, {
+          icon: B.value,
+          size: e.value
+        })), W(i) ? null : i;
+      };
+      return (() => {
+        const l = !!S.value;
+        return s(Lt, {
+          class: N,
+          description: S.value,
+          title: u.value,
+          key: g.value,
+          selected: C.value,
+          unFocusable: !0,
+          leadingCenter: !l,
+          size: t.getSize.value,
+          disabled: y.value,
+          onClick: G
+        }, {
+          leading: r,
+          trailing: () => {
+            var i;
+            return (i = o.trailing) == null ? void 0 : i.call(o, {
+              option: d.option
+            });
+          }
+        });
+      })();
+    };
+  }
+}), qt = /* @__PURE__ */ Z({
+  name: ye("ComboboxWrapper"),
+  setup(d, {
+    slots: o
+  }) {
+    const t = Rt(), e = et(), g = ve();
+    Vt({
+      target: g
+    });
+    const u = ve(), B = xt({
+      triggerRef: u,
+      props: t.props
+    }), {
+      getFlipOnDir: S,
+      getDir: y
+    } = ct(), C = S("reversePlacementOnDir"), N = y(), G = Bt({
+      props: t.props,
+      flip: C,
+      emitsAsProps: t.emitsAsProps,
+      _dir: N,
+      controlAutoFocus: !1,
+      extraPropNames: ["bodyLock", "position"]
+    }), r = ({
+      key: n,
+      getterKey: V,
+      defaultValue: h,
+      noReturnOption: c
+    }) => (v) => {
+      const T = Pe(h) ? h(v) : h;
+      if (be(v)) {
+        const M = v[n] ?? T, A = V && t.props[V];
+        if (A) {
+          if (de(A))
+            return v[A] ?? M;
+          if (Pe(A)) return A(v) ?? M;
+        }
+        return M;
+      }
+      return de(v) && !c ? v ?? T : T;
+    }, m = r({
+      getterKey: "getValue",
+      key: "value"
+    }), l = r({
+      getterKey: "getLabel",
+      key: "label",
+      defaultValue: m
+    }), i = r({
+      getterKey: "getIcon",
+      key: "icon",
+      noReturnOption: !0
+    }), _ = r({
+      getterKey: "getDescription",
+      key: "description",
+      noReturnOption: !0
+    }), I = r({
+      getterKey: "getDisabled",
+      key: "disabled",
+      defaultValue: !1,
+      noReturnOption: !0
+    }), p = r({
+      getterKey: "getGroupLabel",
+      key: "label",
+      noReturnOption: !0
+    }), O = r({
+      getterKey: "getGroupOptions",
+      key: "options",
+      noReturnOption: !0
+    }), E = (n) => {
+      var V;
+      if ((V = t.props.options) != null && V.length)
+        for (const h of t.props.options) {
+          if (m(h) === n) return h;
+          const c = O(h);
+          if (c != null && c.length) {
+            for (const v of c)
+              if (m(v) === n) return v;
+          }
+        }
+      return n;
+    }, P = (n) => {
+      const V = E(n);
+      return V ? l(V) ?? n : n;
+    }, {
+      contains: F
+    } = tt({
+      sensitivity: "base"
+    });
+    f(() => {
+      const n = [], V = (h, c) => {
+        h.forEach((v) => {
+          const T = m(v), M = O(v);
+          if (T) {
+            const A = [...c ?? [], T];
+            n.push(A), M && V(M, A);
+          }
+        });
+      };
+      return t.props.options && V(t.props.options), n;
+    });
+    const D = f(() => {
+      const n = (V) => V == null ? void 0 : V.map((h) => {
+        const c = l(h), v = m(h), T = I(h), M = p(h), A = !t.searchModel.value || c && F(c, t.searchModel.value), oe = O(h), ne = !t.props.tree || v;
+        if (oe && ne) {
+          const a = n(oe);
+          if (a != null && a.length || A)
+            return {
+              groupLabel: M,
+              title: c,
+              key: v,
+              disabled: T,
+              children: a,
+              _option: h
+            };
+        }
+        return A && ne ? {
+          title: c,
+          key: v,
+          disabled: T,
+          _option: h
+        } : null;
+      }).filter(Boolean);
+      if (t.props.options)
+        return n(t.props.options);
+    }), {
+      getDisabled: ae,
+      getStatus: ge,
+      getSize: q
+    } = Ct({
+      getDisabled: () => t.props.disabled,
+      getSize: () => t.props.size,
+      getStatus: () => t.props.status
+    }), le = f(() => {
+      switch (q.value) {
+        case "sm":
+          return "xsm";
+        case "lg":
+          return "md";
+        case "md":
+        default:
+          return "sm";
+      }
+    }), {
+      inputBindings: se,
+      rootBindings: z
+    } = _t({
+      getDisabled: () => ae.value
+    }), L = ve(), j = () => {
+      var n, V, h, c, v, T, M;
+      e.open.value && e.inputElement.value && (t.props.headerSearch && ((n = L.value) != null && n.input) ? document.activeElement !== ((V = L.value) == null ? void 0 : V.input) && ((v = (c = (h = L.value) == null ? void 0 : h.input) == null ? void 0 : c.focus) == null || v.call(c)) : document.activeElement !== e.inputElement.value && ((M = (T = e.inputElement.value) == null ? void 0 : T.focus) == null || M.call(T)));
+    }, $ = (n) => {
+      e.modelValue.value = n, t.emit("update:modelValue", n);
+    };
+    Kt({
+      ...t,
+      getOptionValue: m,
+      getOptionLabel: l,
+      getOptionDescription: _,
+      getOptionDisabled: I,
+      getOptionIcon: i,
+      getOptionByValue: E,
+      getLabelByValue: P,
+      focusOnInput: j,
+      setModelValue: $,
+      headerInputElement: L,
+      getDisabled: ae,
+      getStatus: ge,
+      getSize: q,
+      getTagSize: le,
+      comboboxInputBinding: se,
+      comboboxTriggerBinding: z,
+      ...e,
+      modelValue: e.modelValue
+    }), je(() => [t.props.clearOnChangeMultiple, t.props.multiple], () => {
+      t.props.clearOnChangeMultiple && $(void 0);
+    });
+    const ee = f(() => {
+      const n = t.props.scrollContainerProps ?? {};
+      return {
+        ...n,
+        areaCls: [x(R, "scroll_area"), n == null ? void 0 : n.class, n == null ? void 0 : n.areaCls]
+      };
+    }), ie = x(R, "popup"), me = Ce(ie, {
+      variants: {
+        size: Y($e, ie)
+      }
+    }), te = (n) => {
+      if (Number(n) > 0)
+        return `${n}px`;
+      if (typeof n == "string")
+        return n;
+    }, pe = f(() => te(t.props.popupWidth)), Ne = f(() => te(t.props.popupHeight)), xe = f(() => te(t.props.minWidth)), Be = f(() => ({
+      type: q.value === "sm" ? "simple" : "advance",
+      ...Te(t.props.emptyProps ?? {}, "class")
+    })), Fe = f(() => Te(t.props.skeletonProps ?? {}, "class")), {
+      selectValues: We
+    } = Wt({
+      getValue: (n) => n == null ? void 0 : n.key,
+      getChildren: (n) => n == null ? void 0 : n.children,
+      getModel: () => X(e.modelValue.value),
+      getData: () => X(D.value ?? [])
+    });
+    return () => {
+      var oe, ne;
+      const n = (a) => {
+        var b;
+        if ((b = D.value) != null && b.length && a > 0)
+          return !!D.value[a - 1];
+      }, V = (a) => {
+        var b, K;
+        if ((b = D.value) != null && b.length && a > 0) {
+          const k = D.value[a - 1];
+          return !!(k && ((K = O(k)) != null && K.length));
+        }
+      }, h = (a) => s(ke, {
+        option: a
+      }, {
+        trailing: () => {
+          var b;
+          return (b = o.optionTrailing) == null ? void 0 : b.call(o, {
+            option: a
+          });
+        }
+      }), c = [];
+      let v;
+      if (t.props.tree) {
+        const b = H(e.modelValue.value) ? e.modelValue.value : e.modelValue.value ? [e.modelValue.value] : [];
+        v = s(Ot, {
+          data: D.value ?? [],
+          selectable: !0,
+          checkbox: t.props.multiple,
+          multiple: t.props.multiple,
+          defaultExpandAll: !0,
+          syncCheckboxAndSelect: t.props.multiple,
+          showLine: !0,
+          modelValue: b,
+          checkedKeys: b,
+          onExpand: j,
+          onSelect: (K, k, U) => {
+            if (t.props.multiple) {
+              const Q = H(U) ? U : [U];
+              $(We(Q, k));
+            } else
+              $(U);
+          },
+          class: "w-full"
+        }, {
+          title: (K) => h(K._option)
+        }), c.push(v);
+      } else
+        (D.value ?? []).forEach((a, b) => {
+          var K;
+          (K = a.children) != null && K.length ? (n(b) && c.push(s(Ie)), a.groupLabel && c.push(s(Ht, {
+            class: t.props.labelCls
+          }, () => a.groupLabel)), a.children.forEach((k) => {
+            c.push(h(k._option));
+          })) : V(b) ? c.push(s(Ie)) : c.push(h(a._option));
+        });
+      const T = yt(v ? [v] : c, ke).filter((a) => {
+        var b;
+        return be(a == null ? void 0 : a.props) && ((b = a == null ? void 0 : a.props) == null ? void 0 : b.option);
+      }), M = !!(t.props.tree && ((oe = D.value) != null && oe.length) || T != null && T.length), A = () => {
+        var b, K;
+        const a = [];
+        if (M || t.props.loading) {
+          const k = [];
+          if (M && k.push(...c), t.props.loading) {
+            const U = (b = o.loading) == null ? void 0 : b.call(o, {});
+            if (!W(U)) k.push(U);
+            else {
+              const Q = new Array(M ? 2 : t.props.loadingRowCount).fill(1);
+              k.push(...Q.map(() => s(ft, {
+                size: q.value,
+                class: [x(R, "skeleton"), t.props.skeletonCls],
+                ...Fe.value
+              })));
+            }
+          }
+          a.push(s("div", {
+            class: [x(R, "options"), t.props.optionsCls]
+          }, k));
+        } else if (!M) {
+          const k = (K = o.empty) == null ? void 0 : K.call(o, Be.value);
+          W(k) ? a.push(s(mt, {
+            class: [x(R, "empty"), t.props.emptyCls],
+            ...Be.value
+          }, {
+            title: o.emptyTitle,
+            description: o.emptyDescription,
+            actions: o.emptyActions,
+            image: o.emptyImage
+          })) : a.push(k);
+        }
+        return t.props.lazyLoading && a.push(s("div", {
+          class: x(R, "lazy_loading")
+        }, s("div", {
+          class: x(R, "lazy_loading_trigger"),
+          ref: g
+        }))), a;
+      };
+      return [s(Ut, {
+        ref: u,
+        ...t.attrs,
+        style: {
+          ...((ne = t.attrs) == null ? void 0 : ne.style) ?? {},
+          "--ptc-combobox-trigger-min-w": xe.value
+        }
+      }, {
+        trigger: o.trigger,
+        triggerTrailing: o.triggerTrailing
+      }), s(ot, B.value, () => s(nt, {
+        ...G.value,
+        vShow: e.open.value,
+        class: [me(t.props), t.props.popupCls],
+        style: {
+          "--ptc-combobox-popup-width": t.props.samePopupWidth ? void 0 : pe.value,
+          "--ptc-combobox-popup-height": Ne.value,
+          "--ptc-combobox-trigger-min-w": xe.value
+        },
+        onClick: j
+      }, () => {
+        var U, Q, Se;
+        const a = [], b = (U = o.header) == null ? void 0 : U.call(o), K = !W(b);
+        if (t.props.headerSearch || K) {
+          const fe = [];
+          K && fe.push(b), fe.push(s(Ae)), a.push(s("div", {
+            class: x(R, "header")
+          }, fe));
+        }
+        a.push(s(St, ee.value, A));
+        const k = (Se = o.footer) == null ? void 0 : Se.call(o, {
+          isEmpty: !((Q = D.value) != null && Q.length),
+          search: t.searchModel.value
+        });
+        return W(k) || a.push(s("div", {
+          class: x(R, "footer")
+        }, k)), a;
+      }))];
+    };
+  }
+}), To = /* @__PURE__ */ Z({
+  ...pt("Combobox"),
+  __name: "Combobox",
+  props: {
+    size: { default: "md" },
+    status: {},
+    multiple: { type: Boolean, default: void 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(d, { emit: o }) {
+    const t = d, e = o, g = rt(e), u = f(
+      () => st(
+        {
+          ...Oe(
+            t,
+            "open",
+            "defaultOpen",
+            "defaultValue",
+            "modelValue",
+            "by",
+            "dir",
+            "multiple",
+            "disabled"
+          ),
+          ...Oe(
+            g,
+            "onUpdate:modelValue",
+            "onUpdate:open"
+          ),
+          ignoreFilter: !0
+        },
+        it
+      )
+    ), B = Mt(t, "search", e, {
+      passive: t.search === void 0
+    }), S = Ue(), y = He();
+    return $t({
+      attrs: y,
+      props: t,
+      emit: e,
+      searchModel: B,
+      emitsAsProps: g
+    }), (C, N) => (re(), he(w(at), De(u.value, { class: w(R) }), {
+      default: ce(() => [
+        we(w(qt), null, qe({ _: 2 }, [
+          Ye(Object.keys(S), (G) => ({
+            name: G,
+            fn: ce((r) => [
+              Le(C.$slots, G, Je(Qe(r)))
+            ])
+          }))
+        ]), 1024)
+      ]),
+      _: 3
+    }, 16, ["class"]));
+  }
+});
+export {
+  $e as C,
+  To as _,
+  Gt as a,
+  Ve as i,
+  Kt as p
+};