@pantograph/vue 0.26.0 → 0.27.1

package/dist/Combobox.vue_vue_type_script_setup_true_lang-CSN9cqZh.js

@@ -0,0 +1,1120 @@
+import { defineComponent as ge, useSlots as nt, computed as m, createBlock as E, openBlock as O, unref as c, mergeProps as se, createSlots as rt, renderList as $e, withCtx as K, renderSlot as Le, normalizeProps as De, guardReactiveProps as Ee, createVNode as Z, h as f, useAttrs as wt, createElementBlock as de, normalizeClass as Pe, toDisplayString as Mt, ref as ce, watch as Lt, isRef as Je, createCommentVNode as Re, createElementVNode as Qe, normalizeStyle as Dt, Fragment as Ae } from "vue";
+import { createContext as Et, useEmitAsProps as Rt } from "reka-ui";
+import { omit as Be, isString as Xe, cloneDeep as ae, isFunction as At, debounce as Ye, pick as $t, last as Ze } from "es-toolkit";
+import { e as Ke, y as Y, g as A, u as Kt, w as Ft } from "./Icon.vue_vue_type_script_setup_true_lang-DJv20Efl.js";
+import { a as me } from "./options-J8HfRMSU.js";
+import { a as Nt, i as R } from "./isEmpty-CgVXdsCr.js";
+import { u as Wt } from "./bodyLock-DBGsJvTg.js";
+import { u as Ut, U as Ht } from "./useInputDataStates-DCxDvkM-.js";
+import { a as Gt } from "./collection-DUgtxIW2.js";
+import { u as Oe } from "./useVmodel-DlyNieM5.js";
+import { u as jt } from "./useVirtualScroll-CXkmR_v2.js";
+import { getBemBlock as qt, getBemModifier as Jt, getBemElement as h, normCls as U, generateVariantClassList as X, createOptionGetterFunc as Q, usePCId as et } from "@pantograph/utils";
+import { _ as Qt } from "./Popover.vue_vue_type_script_setup_true_lang-D-Jebwr9.js";
+import "@pantograph/tokens";
+import { whenever as Xt } from "@vueuse/core";
+import "@tanstack/vue-virtual";
+import { cva as st } from "class-variance-authority";
+import { d as Yt, _ as it } from "./Avatar.vue_vue_type_script_setup_true_lang-CH_6o8dq.js";
+import { _ as ut } from "./GraphicalObject.vue_vue_type_script_setup_true_lang-Dwf4A9T3.js";
+import { _ as Zt } from "./GraphicalObjectGroup.vue_vue_type_script_setup_true_lang-CAvd-28M.js";
+import { b as eo, _ as to } from "./Chip.vue_vue_type_script_setup_true_lang-DOIPsHk_.js";
+import { _ as oo } from "./Input.vue_vue_type_script_setup_true_lang-BBOWLata.js";
+import { g as lo, a as ao } from "./MenuItem.vue_vue_type_script_setup_true_lang-BhAWfw04.js";
+import { u as no } from "./useLazyLoading-Zo-PEp2E.js";
+import { _ as ro } from "./ScrollContainer.vue_vue_type_script_setup_true_lang-BU7qU1LR.js";
+import { _ as so } from "./Empty.vue_vue_type_script_setup_true_lang-CnJOScIi.js";
+import { f as io, s as tt, _ as uo, a as po } from "./Tree.vue_vue_type_script_setup_true_lang-B5khp8Fw.js";
+import { _ as co } from "./Checkbox.vue_vue_type_script_setup_true_lang-DiG3cLmy.js";
+import { _ as go } from "./Skeleton.vue_vue_type_script_setup_true_lang-BPGtJ7m9.js";
+import { _ as mo } from "./Divider.vue_vue_type_script_setup_true_lang-BHkXVZCN.js";
+import fo from "@pantograph/style/combobox.css?raw";
+function vo(B) {
+  return Array.isArray(B) ? B : Array.from(B);
+}
+function ho(B) {
+  return B[0];
+}
+function ot(B) {
+  if (Nt(B))
+    return ho(vo(B));
+}
+const [Fe, yo] = Et("Combobox"), P = qt("combobox"), pt = Jt(P, "value-placeholder"), lt = h(P, "option"), ct = ["sm", "md", "lg"], _o = ["error", "warning", "success"], dt = /* @__PURE__ */ ge({
+  ...me("ComboboxInput"),
+  __name: "ComboboxInput",
+  props: {
+    id: {},
+    maxlength: {},
+    type: {},
+    placeholder: {},
+    disabled: { type: Boolean, default: void 0 },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    modelValue: {},
+    defaultValue: {},
+    leading: {},
+    trailing: {},
+    clearIcon: {},
+    trailingCls: {},
+    clearIconCls: {},
+    dividerCls: {},
+    leadingCls: {},
+    class: {},
+    allowClear: { type: Boolean },
+    bordered: { type: Boolean, default: void 0 },
+    simple: { type: Boolean },
+    size: {},
+    status: {},
+    steps: { type: Boolean }
+  },
+  setup(B) {
+    const t = B, o = nt(), r = Fe();
+    Xt(() => r.openModel.value && r.inputRef.value, r.focusOnInput);
+    const ee = m(() => r.placeholder.value ?? t.placeholder ?? r.props.placeholder ?? ""), M = (n) => {
+      var g, b;
+      if (r.props.headerSearch || n.stopPropagation(), n.key === "Backspace" && r.props.multiple && Y(r.model.value) && R(r.searchModel.value))
+        r.model.value = r.model.value.slice(0, -1);
+      else if (!r.openModel.value)
+        (n.key === "ArrowDown" || n.key === "Enter") && (r.openModel.value = !0);
+      else if (r.openModel.value)
+        if (n.key === "Escape") r.openModel.value = !1;
+        else if (n.key === "Tab" && !r.props.headerSearch) r.openModel.value = !1;
+        else if (["ArrowDown", "ArrowUp"].includes(n.key)) {
+          const s = r.getItems();
+          if (s.length) {
+            const H = s.findIndex(
+              (C) => r.highlightedOptionKey.value && C.value && C.value === r.highlightedOptionKey.value
+            );
+            if (n.key === "ArrowDown") {
+              const C = s[H + 1];
+              r.highlightedOptionKey.value = (C == null ? void 0 : C.value) ?? r.highlightedOptionKey.value ?? s[0].value;
+            } else if (n.key === "ArrowUp") {
+              const C = s[H - 1];
+              r.highlightedOptionKey.value = (C == null ? void 0 : C.value) ?? s[0].value;
+            }
+            (b = (g = s.find(
+              (C) => r.highlightedOptionKey.value && C.value && C.value === r.highlightedOptionKey.value
+            )) == null ? void 0 : g.ref) == null || b.scrollIntoView();
+          }
+        } else n.key === "Enter" && r.highlightedOptionKey.value && r.selectOption(r.getOptionByValue(r.highlightedOptionKey.value), !0);
+    }, y = h(P, "input");
+    return (n, g) => (O(), E(c(oo), se({ ...c(r).comboboxInputBinding.value, ...t }, {
+      placeholder: ee.value,
+      onKeydown: M,
+      ref: c(r).inputRef,
+      class: c(U)(c(y), { [c(pt)]: c(r).valuePlaceholder.value }, t.class),
+      modelValue: c(r).searchModel.value,
+      "onUpdate:modelValue": g[0] || (g[0] = (b) => c(r).searchModel.value = b)
+    }), rt({ _: 2 }, [
+      $e(Object.keys(c(Be)(o, ["leading"])), (b) => ({
+        name: b,
+        fn: K((s) => [
+          Le(n.$slots, b, De(Ee(s)))
+        ])
+      })),
+      c(r).props.headerSearch ? {
+        name: "leading",
+        fn: K((b) => [
+          Le(n.$slots, "leading", De(Ee(b)), () => [
+            Z(c(Ke), {
+              size: b.iconSize,
+              icon: "tabler:search",
+              flipOnDir: "rtl"
+            }, null, 8, ["size"])
+          ])
+        ]),
+        key: "0"
+      } : {
+        name: "leading",
+        fn: K((b) => [
+          Le(n.$slots, "leading", De(Ee(b)))
+        ]),
+        key: "1"
+      }
+    ]), 1040, ["placeholder", "class", "modelValue"]));
+  }
+}), bo = /* @__PURE__ */ ge({
+  ...me("ComboboxTrigger"),
+  __name: "ComboboxTrigger",
+  setup(B) {
+    const t = Fe(), o = ({ value: i }) => {
+      i && Y(t.model.value) && !t.getDisabled.value && (t.model.value = t.model.value.filter((d) => d !== i));
+    }, r = m(() => {
+      switch (t.getSize.value) {
+        case "sm":
+          return "2xsm";
+        case "md":
+        default:
+          return "xsm";
+      }
+    }), ee = m(() => {
+      if (!t.props.multiple && Xe(t.model.value) && !R(t.model.value))
+        return t.getOptionByValue(t.model.value);
+    }), M = (i = ee.value) => {
+      if (t.props.selectedItemIconAsTrailingIcon && (i != null && i._icon))
+        return i._icon;
+    }, y = m(() => M()), n = m(() => {
+      if (!t.props.noTrailing)
+        return t.props.trailingIcon;
+    }), g = m(() => {
+      var _, v;
+      const i = ae(t.model.value), d = Y(t.model.value);
+      return {
+        modelValue: i,
+        open: ae(t.openModel.value),
+        option: d ? void 0 : t.getOptionByValue(t.model.value),
+        options: d ? (v = (_ = t.model.value).map) == null ? void 0 : v.call(_, t.getOptionByValue).filter(Boolean) : void 0
+      };
+    }), b = (i) => ({
+      ...g.value,
+      option: t.getOptionByValue(i)
+    }), s = h(P, "trigger"), H = st(s, {
+      variants: {
+        size: X(ct, s),
+        headerSearch: X("header-search", s),
+        status: X(_o, s),
+        bordered: X("bordered", s),
+        multiple: X("multiple", s),
+        contentFit: X("content-fit", s),
+        wrapped: X("wrapped", s),
+        filled: X("filled", s)
+      }
+    }), C = m(() => ({
+      type: "button",
+      disabled: t.getDisabled.value,
+      tabindex: t.getDisabled.value || !t.props.headerSearch ? -1 : 0,
+      reference: t.props.reference,
+      "data-disabled": t.getDisabled.value ? "" : void 0,
+      "aria-disabled": t.getDisabled.value ?? void 0,
+      "aria-label": "Show popup",
+      "aria-haspopup": "listbox",
+      "aria-expanded": t.openModel.value,
+      "data-state": t.openModel.value ? "open" : "closed",
+      class: U(
+        H({
+          size: t.getSize.value,
+          status: t.getStatus.value === "success" && R(t.model.value) ? void 0 : t.getStatus.value,
+          bordered: t.props.bordered,
+          multiple: t.props.multiple,
+          contentFit: t.props.contentFit,
+          wrapped: t.props.wrapped,
+          filled: !R(t.model.value),
+          headerSearch: t.props.headerSearch
+        }),
+        t.props.triggerCls
+      ),
+      ...t.comboboxTriggerBinding.value
+    })), F = (i, d = r.value) => f(Ke, { icon: i, size: d }), te = () => {
+      var _, v;
+      let i;
+      const d = (v = (_ = t.slots).triggerTrailing) == null ? void 0 : v.call(
+        _,
+        g.value
+      );
+      if (A(d) ? n.value && (i = F(n.value)) : i = d, i)
+        return f(
+          "div",
+          { class: U(h(s, "trailing"), t.props.triggerTrailingCls) },
+          i
+        );
+    }, G = (i) => {
+      var _, v;
+      const d = t.getOptionByValue(i) ?? { _key: i };
+      return f(it, {
+        size: t.getTagSize.value,
+        ...d ? ((v = (_ = t.props).getTagProps) == null ? void 0 : v.call(_, d)) ?? {} : {}
+      });
+    }, L = (i) => {
+      var _, v;
+      const d = t.getOptionByValue(i) ?? { _key: i };
+      return f(ut, {
+        ...d ? ((v = (_ = t.props).getTagProps) == null ? void 0 : v.call(_, d)) ?? {} : {},
+        size: t.getTagSize.value
+      });
+    }, fe = () => {
+      var i, d;
+      if (!t.props.multiple && !Y(t.model.value) && t.model.value) {
+        let _;
+        Xe(t.model.value) && !R(t.model.value) && (_ = t.model.value);
+        const v = _ ? (d = (i = t.slots).optionLeading) == null ? void 0 : d.call(
+          i,
+          lo(
+            t.props.size,
+            b(_)
+          )
+        ) : null, q = !A(v);
+        if (q || t.props.tagRenderMode && ["avatar", "go"].includes(t.props.tagRenderMode) || y.value || t.props.leadingIcon) {
+          let k;
+          if (q ? k = v : t.props.tagRenderMode === "avatar" ? k = G(t.model.value) : t.props.tagRenderMode === "go" ? k = L(t.model.value) : y.value ? k = F(y.value) : t.props.leadingIcon && (k = F(t.props.leadingIcon)), !A(k))
+            return f(
+              "div",
+              {
+                class: U(h(s, "leading"), t.props.triggerLeadingCls)
+              },
+              k
+            );
+        }
+      }
+    }, j = () => {
+      var ie, ve;
+      const i = (ve = (ie = t.slots).trigger) == null ? void 0 : ve.call(ie, g.value);
+      if (!A(i))
+        return i;
+      const _ = () => {
+        const I = [], ue = [
+          h(s, "tags"),
+          t.props.triggerContentCls,
+          t.props.triggerContentValueCls
+        ], pe = (() => {
+          if (t.props.multiple && Y(t.model.value)) {
+            if (t.props.tagRenderMode === "avatar")
+              return f(
+                Yt,
+                {
+                  maxCount: t.props.maxCount,
+                  size: t.getTagSize.value,
+                  closeable: !t.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !t.props.wrapped,
+                  class: ue
+                },
+                () => t.model.value.map(G)
+              );
+            if (t.props.tagRenderMode === "go")
+              return f(
+                Zt,
+                {
+                  maxCount: t.props.maxCount,
+                  size: t.getTagSize.value,
+                  closeable: !t.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !t.props.wrapped,
+                  class: ue
+                },
+                () => t.model.value.map(L)
+              );
+            if (t.props.tagRenderMode === "chip")
+              return f(
+                eo,
+                {
+                  maxCount: t.props.maxCount,
+                  size: t.getTagSize.value,
+                  color: "primary",
+                  closeable: !t.getDisabled.value,
+                  noPopover: !0,
+                  noWrap: !t.props.wrapped,
+                  class: ue,
+                  onClose: o
+                },
+                () => t.model.value.map((ne) => {
+                  var V, N;
+                  const he = () => t.getLabelByValue(ne), ye = ({ size: Ie }) => {
+                    const be = M(t.getOptionByValue(ne)) ?? t.props.leadingIcon;
+                    return be ? F(be, Ie) : null;
+                  }, _e = t.getOptionByValue(ne);
+                  return f(
+                    to,
+                    {
+                      ..._e ? ((N = (V = t.props).getTagProps) == null ? void 0 : N.call(V, _e)) ?? {} : {},
+                      value: ne,
+                      class: U(h(s, "tag"), t.props.tagCls),
+                      closeIconCls: h(s, "tag__close")
+                    },
+                    {
+                      text: he,
+                      leading: ye
+                    }
+                  );
+                })
+              );
+          }
+        })();
+        return pe && I.push(pe), t.props.headerSearch ? (!t.props.noValueOnPlaceholder || t.props.placeholder) && I.push(
+          f(
+            "div",
+            {
+              class: U(h(s, "content__value"), {
+                [pt]: t.valuePlaceholder.value
+              })
+            },
+            t.placeholder.value ?? t.props.placeholder
+          )
+        ) : I.push(
+          f(dt, {
+            noValueOnPlaceholder: t.props.noValueOnPlaceholder,
+            searchIcon: !1,
+            bordered: !1,
+            simple: !0
+          })
+        ), f("div", { class: h(s, "content") }, I);
+      }, v = [], q = fe();
+      A(q) || v.push(q), v.push(_());
+      const k = te();
+      return A(k) || v.push(k), f("button", C.value, v);
+    };
+    return (i, d) => (O(), E(j));
+  }
+}), at = /* @__PURE__ */ ge({
+  ...me("ComboboxOption"),
+  __name: "ComboboxOption",
+  props: {
+    option: {}
+  },
+  setup(B) {
+    const t = B, o = Fe(), r = m(() => o.isOptionSelected(t.option._key)), ee = (n) => {
+      var s, H, C, F, te, G;
+      const g = [];
+      !o.props.tree && o.props.multiple && o.props.checkbox && !t.option._noCheckbox && g.push(
+        f(co, {
+          modelValue: r.value,
+          size: n.checkboxSize,
+          disabled: t.option._disabled
+        })
+      );
+      const b = (H = (s = o.slots).optionLeading) == null ? void 0 : H.call(s, { ...n, option: t.option });
+      return A(b) ? o.props.tagRenderMode === "avatar" && o.props.showTriggerTagOnOption ? g.push(
+        f(it, {
+          size: n.avatarSize,
+          ...((F = (C = o.props).getTagProps) == null ? void 0 : F.call(C, t.option)) ?? {}
+        })
+      ) : o.props.tagRenderMode === "go" && o.props.showTriggerTagOnOption ? g.push(
+        f(ut, {
+          size: n.iconSize,
+          ...((G = (te = o.props).getTagProps) == null ? void 0 : G.call(te, t.option)) ?? {}
+        })
+      ) : t.option._icon && g.push(f(Ke, { icon: t.option._icon, size: o.getIconSize.value })) : g.push(b), A(g) ? null : g;
+    }, M = wt(), y = () => {
+      const n = o.props.tree ? void 0 : t.option._description, g = (At(o.props.getMenuItemProps) ? o.props.getMenuItemProps(t.option) : o.props.getMenuItemProps) ?? {};
+      return f(
+        ao,
+        {
+          class: h(P, "option"),
+          unFocusable: !0,
+          staticStyle: o.props.tree,
+          description: n,
+          title: t.option._label,
+          key: t.option._key,
+          selected: r.value,
+          leadingCenter: !!n,
+          size: o.getSize.value,
+          disabled: o.props.tree ? !1 : t.option._disabled,
+          onClick: () => o.selectOption(t.option),
+          slotProps: t,
+          ...g,
+          ...M
+        },
+        {
+          leading: ee,
+          trailing: o.slots.optionTrailing,
+          title: o.slots.optionTitle,
+          description: o.slots.optionDescription
+        }
+      );
+    };
+    return (n, g) => (O(), E(y));
+  }
+}), Co = /* @__PURE__ */ ge({
+  ...me("ComboboxLabel"),
+  __name: "ComboboxLabel",
+  props: {
+    label: {}
+  },
+  setup(B) {
+    return (t, o) => (O(), de("div", {
+      class: Pe(c(h)(c(P), "label"))
+    }, Mt(t.label), 3));
+  }
+}), el = /* @__PURE__ */ ge({
+  ...me("Combobox"),
+  __name: "Combobox",
+  props: {
+    modelValue: {},
+    defaultValue: {},
+    multiple: { type: Boolean, default: void 0 },
+    disabled: { type: Boolean, default: void 0 },
+    highlightOnHover: { type: Boolean },
+    resetSearchTermOnBlur: { type: Boolean, default: !0 },
+    resetSearchTermOnSelect: { type: Boolean, default: !0 },
+    size: { default: "md" },
+    status: {},
+    noValueOnPlaceholder: { type: Boolean },
+    zIndex: {},
+    checkbox: { type: Boolean, default: !0 },
+    tagRenderMode: { default: "chip" },
+    getTagProps: {},
+    tree: { type: Boolean },
+    treeProps: {},
+    contentFit: { type: Boolean },
+    wrapped: { type: Boolean },
+    sortSelectedItems: { 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: {},
+    getNoCheckbox: {},
+    getSingle: {},
+    getClear: {},
+    getOptions: {},
+    getIcon: {},
+    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: {},
+    search: {},
+    filterOptions: {},
+    expandedKeys: {},
+    noTrigger: { type: Boolean },
+    headerSearch: { type: Boolean },
+    headerSearchInputProps: {},
+    virtual: { type: Boolean },
+    showTriggerTagOnOption: { type: Boolean },
+    disableOutsidePointerEvents: { type: Boolean, default: !0 },
+    getMenuItemProps: {},
+    placement: { default: "bottom-start" },
+    containerProps: {},
+    reversePlacementOnDir: {},
+    open: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: void 0 },
+    sideOffset: { default: 4 },
+    alignOffset: {},
+    reference: {},
+    prioritizePosition: { type: Boolean, default: !1 },
+    avoidCollisions: { type: Boolean, default: void 0 },
+    dir: {}
+  },
+  emits: ["update:modelValue", "update:expandedKeys", "update:search", "fetch", "search", "select", "update:open", "escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside", "openAutoFocus", "closeAutoFocus"],
+  setup(B, { emit: t }) {
+    Kt("combobox", fo);
+    const o = B, r = t, ee = Ye((e) => {
+      r("search", e);
+    }, 500), M = Oe(o, "search", r, {
+      passive: o.search === void 0,
+      onChange: ee
+    }), y = Oe(o, "open", r, {
+      defaultValue: o.defaultOpen,
+      passive: o.open === void 0,
+      onChange(e) {
+        !e && o.resetSearchTermOnBlur && (M.value = void 0);
+      }
+    }), n = Oe(
+      o,
+      "modelValue",
+      r,
+      {
+        passive: o.modelValue === void 0,
+        onChange: (e) => {
+          var l, a;
+          y.value && !o.multiple && (y.value = !1), typeof V !== void 0 && (V != null && V.value) && o.sortSelectedItems && ((a = (l = V == null ? void 0 : V.value) == null ? void 0 : l.measure) == null || a.call(l));
+        }
+      }
+    ), g = Oe(
+      o,
+      "expandedKeys",
+      r,
+      {
+        passive: o.expandedKeys === void 0
+      }
+    ), b = Ye((e) => {
+      g.value = e;
+    }, 500), s = nt(), H = Rt(r), C = m(() => ({
+      ...Be(H, ["update:modelValue", "update:search", "select"]),
+      ...$t(o, [
+        "placement",
+        "reversePlacementOnDir",
+        "zIndex",
+        "to",
+        "dir",
+        "size",
+        "sideOffset",
+        "alignOffset",
+        "prioritizePosition",
+        "avoidCollisions"
+      ])
+      // modal: true,
+    })), F = ce();
+    no({ target: F });
+    const te = Q({
+      key: "value",
+      getter: o.getValue
+    }), G = {
+      getDisabled: Q({
+        key: "disabled",
+        getter: o.getDisabled,
+        noReturnOption: !0,
+        defaultValue: !1
+      }),
+      getDescription: Q({
+        key: "description",
+        getter: o.getDescription,
+        noReturnOption: !0
+      }),
+      getValue: te,
+      getLabel: Q({
+        key: "label",
+        getter: o.getLabel,
+        noReturnOption: !0,
+        defaultValue: te
+      }),
+      getNoCheckbox: Q({
+        key: "noCheckbox",
+        getter: o.getNoCheckbox,
+        noReturnOption: !0,
+        defaultValue: !1
+      }),
+      getSingle: Q({
+        key: "single",
+        getter: o.getSingle,
+        noReturnOption: !0,
+        defaultValue: !1
+      }),
+      getClear: Q({
+        key: "clear",
+        getter: o.getClear,
+        noReturnOption: !0,
+        defaultValue: !1
+      }),
+      getOptions: Q({
+        key: "options",
+        getter: o.getOptions,
+        noReturnOption: !0
+      }),
+      getIcon: Q({
+        key: "icon",
+        getter: o.getIcon,
+        noReturnOption: !0
+      })
+    }, L = (e, l) => {
+      var p;
+      const a = `get${l[0].toUpperCase() + l.slice(1)}`;
+      return (p = G[a]) == null ? void 0 : p.call(G, e);
+    }, fe = (e, l, a) => !!(!o.tree && !(l != null && l.length) && (a != null && a.length)), j = m(
+      () => io({
+        getValue: (e, l, a) => {
+          const p = L(e, "value");
+          return R(p) && fe(e, l, a) ? et(lt) : p;
+        },
+        getDisabled: (e) => L(e, "disabled"),
+        arr: o.options ?? [],
+        getChildren: (e, l) => {
+          if (!(l != null && l.length && !o.tree))
+            return L(e, "options");
+        },
+        getExtra: (e) => {
+          if (e) {
+            let l = L(e, "label");
+            return R(l) || (l = String(l)), {
+              _description: L(e, "description"),
+              _label: l,
+              _title: o.tree ? l : void 0,
+              _noCheckbox: L(e, "noCheckbox"),
+              _single: L(e, "single"),
+              _clear: L(e, "clear"),
+              _icon: L(e, "icon")
+            };
+          }
+        },
+        allowNoValidKey: fe
+      })
+    ), i = (e, l = !1) => e ? j.value.filter((a) => {
+      var p;
+      if (l) {
+        const T = Ze(a._parentKeys ?? []);
+        return T && T === e;
+      }
+      return (p = a._parentKeys) == null ? void 0 : p.includes(e);
+    }) : [], d = (e) => {
+      var l;
+      if ((l = j.value) != null && l.length && !R(e))
+        return j.value.find((a) => a._key === e);
+    }, _ = (e) => {
+      const l = d(e);
+      return l && (l._label || l._key) || e;
+    }, v = (e) => {
+      const l = d(e);
+      return l ? l._single ?? !1 : !1;
+    }, q = (e) => e === void 0 ? !1 : Array.isArray(n.value) ? !!(e && n.value.includes(e)) : n.value === e, k = m(() => {
+      var p, T, Ce, ke;
+      let e = [];
+      const l = /* @__PURE__ */ new Set(), a = (u) => {
+        u != null && u._key && !l.has(u._key) && (e.push(ae(u)), l.add(u._key));
+      };
+      if (M.value ? (j.value.forEach((u) => {
+        var D, J;
+        if (u._label && u._label.toLowerCase().includes(M.value.toLowerCase()) && !l.has(u._key)) {
+          if (a(u), u._hasChildren && i(u._key).forEach(a), (D = o.filterOptions) != null && D.strictNode)
+            u._parentKeys && u._parentKeys.forEach((z) => {
+              if (!l.has(z)) {
+                const oe = d(z);
+                a(oe);
+              }
+            });
+          else if ((J = u._parentKeys) != null && J.length) {
+            const z = ot(u._parentKeys);
+            if (!R(z)) {
+              if (!l.has(z)) {
+                const le = d(z);
+                a(le);
+              }
+              i(z).forEach(a);
+            }
+          }
+        }
+      }), e = e.sort(
+        (u, $) => j.value.findIndex((D) => D._key === u._key) - j.value.findIndex((D) => D._key === $._key)
+      )) : e = ae(j.value), o.sortSelectedItems && !o.tree && !R(n.value)) {
+        let u = ae(e);
+        const $ = u.filter((S) => q(S._key)), D = Symbol("root"), J = Symbol("rootGroup"), z = {}, oe = (S, w, x = 1) => {
+          const W = u.splice(S, x);
+          u.splice(w, 0, ...W);
+        }, le = (S) => S ? u.findIndex((w) => w._key === S) : -1, Se = (S) => {
+          const w = z[S], x = le(w == null ? void 0 : w.key);
+          return w != null && w.length ? x + w.length + 1 : x + 1;
+        };
+        $.forEach((S) => {
+          var w;
+          if ((w = S._parentKeys) != null && w.length) {
+            const x = ot(S._parentKeys);
+            let W = le(x);
+            const qe = Math.max(
+              Se(D),
+              Se(J)
+            );
+            if (W > qe) {
+              const xe = i(x).length;
+              oe(W, qe, xe + 1);
+            }
+            if (z[J] = {
+              key: x,
+              length: i(x).length
+            }, W = le(x), x && W > -1) {
+              const xe = le(S._key);
+              if (z[x] === void 0)
+                oe(xe, W + 1);
+              else {
+                const zt = Se(x);
+                oe(xe, zt);
+              }
+              z[x] = {
+                length: void 0,
+                key: S._key
+              };
+            }
+          } else {
+            const x = le(S._key), W = Se(D);
+            x > W && oe(x, W), z[D] = {
+              key: S._key,
+              length: S._hasChildren ? i(S._key).length : void 0
+            };
+          }
+          u = ae(u);
+        }), e = u;
+      }
+      if (o.tree)
+        ((p = o.filterOptions) == null ? void 0 : p.expandParent) === "collapse" ? b([]) : ((T = o.filterOptions) == null ? void 0 : T.expandParent) === "expand" && b(e.filter((u) => u._hasChildren).map((u) => u._key));
+      else {
+        let u = ae(e);
+        for (let $ = 0; $ < u.length - 1; $++) {
+          const D = u[$], J = u[$ + 1];
+          !J._divider && (J._hasChildren || (Ce = D._parentKeys) != null && Ce.length && !((ke = J._parentKeys) != null && ke.length)) && (u.splice($ + 1, 0, { _key: et(lt), _divider: !0 }), $++);
+        }
+        e = u;
+      }
+      return e;
+    }), { getDisabled: ie, getStatus: ve, getSize: I } = Ut(), ue = m(() => {
+      switch (I.value) {
+        case "sm":
+          return "xsm";
+        case "lg":
+          return "md";
+        case "md":
+        default:
+          return "sm";
+      }
+    }), Ne = m(() => {
+      switch (I.value) {
+        case "sm":
+          return "2xsm";
+        case "lg":
+          return "sm";
+        case "md":
+        default:
+          return "xsm";
+      }
+    }), pe = ce(), ne = {
+      sm: 4,
+      md: 6,
+      lg: 8
+    }, he = {
+      sm: 14,
+      md: 16
+    }, ye = {
+      sm: 32,
+      md: 50,
+      lg: 54
+    }, _e = m(() => ({
+      get count() {
+        return k.value.length;
+      },
+      getScrollElement: () => {
+        var e;
+        return (e = pe.value) == null ? void 0 : e.container.viewportElement;
+      },
+      estimateSize: (e) => {
+        const l = k.value[e];
+        if (!o.tree && l) {
+          if (l._divider)
+            return 1;
+          if (l._label && l._hasChildren)
+            return 8 + (he[I.value] ?? he.md);
+          if (l._description)
+            return ye[I.value] ?? ye.md;
+        }
+        return tt[I.value] ?? tt.md;
+      },
+      overscan: 5,
+      get gap() {
+        return ne[I.value] ?? 0;
+      }
+    }));
+    let V, N;
+    if (o.virtual) {
+      const { virtualizer: e, ...l } = jt(
+        _e
+      );
+      V = e, N = l;
+    }
+    const Ie = m(
+      () => {
+        var e;
+        return o.virtual ? (((e = V == null ? void 0 : V.value) == null ? void 0 : e.getVirtualItems()) ?? []).map((l) => k.value[l.index]) : k.value;
+      }
+    ), be = m(() => (N == null ? void 0 : N.containerStyles.value) ?? {}), { inputBindings: gt, rootBindings: mt } = Ht({
+      getDisabled: () => ie.value
+    }), re = ce(), Te = () => {
+      var e;
+      if (y.value && re.value && document.activeElement !== ((e = re.value) == null ? void 0 : e.input)) {
+        re.value.input.style.pointerEvents = "auto";
+        const l = setTimeout(() => {
+          var a, p;
+          (p = (a = re.value) == null ? void 0 : a.focus) == null || p.call(a), clearTimeout(l);
+        }, 100);
+        re.value.input.style.pointerEvents = "";
+      }
+    }, We = m(
+      () => !o.noValueOnPlaceholder && (Y(n.value) ? n.value.length === 1 && !R(n.value[0]) : !R(n.value))
+    ), ft = m(() => {
+      if (We.value) {
+        if (o.multiple && Y(n.value))
+          return _(Ze(n.value));
+        if (!o.multiple && !Y(n.value))
+          return _(n.value);
+      }
+    }), { CollectionSlot: vt, CollectionItem: Ue, itemMap: ht, getItems: yt } = Gt({
+      isProvider: !0,
+      key: P
+    }), He = () => n.value ? Array.isArray(n.value) ? n.value : [n.value] : [], Ve = ce(), ze = (e) => {
+      Ve.value = e;
+    }, Ge = (e) => ({
+      "data-disabled": e._disabled ? "" : void 0,
+      "data-highlighted": Ve.value === e._key ? "" : void 0
+    }), we = ce();
+    yo({
+      props: o,
+      emit: r,
+      searchModel: M,
+      openModel: y,
+      model: n,
+      slots: s,
+      valuePlaceholder: We,
+      placeholder: ft,
+      getOptionByValue: d,
+      isOptionSelected: q,
+      getLabelByValue: _,
+      getSingleByValue: v,
+      inputRef: re,
+      focusOnInput: Te,
+      getDisabled: ie,
+      getStatus: ve,
+      getSize: I,
+      getTagSize: ue,
+      getIconSize: Ne,
+      comboboxInputBinding: gt,
+      comboboxTriggerBinding: mt,
+      selectOption: (e, l) => {
+        var a, p;
+        if (l && ((a = we.value) != null && a.onSelect) && o.tree && ((p = we.value) == null || p.onSelect(e, !q(e == null ? void 0 : e._key))), !(o.tree || !e || !e._key || e._disabled))
+          if (o.multiple)
+            if (e._clear)
+              n.value = [], r("select", void 0, !1);
+            else if (e._single)
+              n.value = [e._key], r("select", e._key, !0, e);
+            else {
+              let T = Y(n.value) ? n.value : [];
+              const Ce = T.includes(e._key);
+              T.length === 1 && v(T[0]) && e._key !== T[0] && (T = []), Ce ? (n.value = T.filter((ke) => ke !== e._key), r("select", e._key, !0, e)) : (n.value = [...T, e._key], r("select", e._key, !1, e));
+            }
+          else e._clear ? (n.value = void 0, r("select", void 0, !1)) : (n.value = e._key, r("select", e._key, !0, e));
+      },
+      itemMap: ht,
+      getItems: yt,
+      highlightedOptionKey: Ve
+    }), Lt(
+      () => [o.clearOnChangeMultiple, o.multiple],
+      () => {
+        o.clearOnChangeMultiple && (n.value = void 0);
+      }
+    );
+    const _t = m(() => ({
+      defaultExpandAll: !0,
+      showLine: !0,
+      selectionBehavior: "replace",
+      ...o.treeProps ?? {},
+      size: I.value,
+      flattenData: !0,
+      outerVirtualScroll: !0,
+      selectable: !0,
+      focusable: !1,
+      multiple: o.multiple,
+      checkable: o.multiple && o.checkbox,
+      virtual: V,
+      syncCheckboxAndSelect: o.multiple,
+      data: k.value,
+      modelValue: He(),
+      checkedKeys: He(),
+      class: h(P, "tree")
+    })), bt = m(() => {
+      const e = o.scrollContainerProps ?? {};
+      return {
+        ...e,
+        areaCls: [
+          h(P, "scroll_area"),
+          e == null ? void 0 : e.class,
+          e == null ? void 0 : e.areaCls
+        ],
+        wrapProps: {
+          ...(e == null ? void 0 : e.wrapProps) ?? {},
+          style: (N == null ? void 0 : N.scrollWrapperStyles.value) ?? {}
+        }
+      };
+    }), je = h(P, "popup"), Ct = st(je, {
+      variants: {
+        size: X(ct, je)
+      }
+    }), Me = (e) => {
+      if (Ft(e))
+        return `${e}px`;
+      if (typeof e == "string")
+        return e;
+    }, kt = m(() => Me(o.popupWidth)), St = m(() => Me(o.popupHeight)), xt = m(() => Me(o.minWidth)), Ot = () => {
+      var a, p;
+      const e = (p = s.header) == null ? void 0 : p.call(s, {
+        isEmpty: !((a = k.value) != null && a.length),
+        search: M.value
+      }), l = !A(e);
+      if (l || o.headerSearch)
+        return f(
+          "div",
+          { class: h(P, "header") },
+          l ? e : f(dt, o.headerSearchInputProps || {})
+        );
+    }, Pt = () => {
+      var a, p;
+      const e = (p = s.footer) == null ? void 0 : p.call(s, {
+        isEmpty: !((a = k.value) != null && a.length),
+        search: M.value
+      });
+      if (!A(e))
+        return f("div", { class: h(P, "footer") }, e);
+    }, Bt = () => {
+      var a;
+      const e = {
+        type: I.value === "sm" ? "simple" : "advance",
+        ...Be(o.emptyProps ?? {}, ["class"]),
+        class: U(h(P, "empty"), o.emptyCls)
+      }, l = (a = s.empty) == null ? void 0 : a.call(s, e);
+      return A(l) ? f(so, e, {
+        title: s.emptyTitle,
+        description: s.emptyDescription,
+        actions: s.emptyActions,
+        image: s.emptyImage
+      }) : l;
+    }, It = () => {
+      var l;
+      const e = (l = s.loading) == null ? void 0 : l.call(s, {});
+      return A(e) ? new Array(k.value.length ? 2 : o.loadingRowCount).fill(1).map(
+        () => f(go, {
+          size: I.value,
+          class: U(h(P, "skeleton"), o.skeletonCls),
+          ...Be(o.skeletonProps ?? {}, ["class"])
+        })
+      ) : e;
+    }, Tt = (e, l, a) => {
+      const p = e._clear;
+      if (o.multiple) {
+        const T = e._single;
+        p ? n.value = [] : T ? n.value = [e._key] : n.value = a;
+      } else
+        p || !l ? n.value = void 0 : n.value = e._key;
+      r(
+        "select",
+        e._key,
+        l,
+        e
+      );
+    }, Vt = (e) => {
+      e.key === "ArrowDown" && !y.value ? y.value = !0 : e.key === "Tab" && y.value && (y.value = !1);
+    };
+    return o.disableOutsidePointerEvents && Wt(y), (e, l) => (O(), E(c(Qt), se({
+      open: c(y),
+      "onUpdate:open": l[2] || (l[2] = (a) => Je(y) ? y.value = a : null)
+    }, C.value, {
+      containerProps: {
+        ...e.containerProps ?? {},
+        onClick: Te
+      },
+      noPadding: !0,
+      size: c(I),
+      containerStyle: {
+        pointerEvents: "auto",
+        display: c(y) ? void 0 : "none",
+        zIndex: e.zIndex,
+        "--ptc-combobox-popup-width": e.samePopupWidth ? void 0 : kt.value,
+        "--ptc-combobox-popup-height": St.value,
+        "--ptc-combobox-trigger-min-w": xt.value
+      },
+      containerCls: c(U)(c(Ct)(o), e.popupCls),
+      onKeydown: Vt
+    }), rt({
+      content: K(() => [
+        Z(Ot),
+        Z(c(ro), se({
+          ref_key: "scrollContainerRef",
+          ref: pe
+        }, bt.value), {
+          default: K(() => [
+            k.value.length || e.loading ? (O(), E(c(vt), { key: 0 }, {
+              default: K(() => [
+                Qe("div", {
+                  class: Pe(c(U)(c(h)(c(P), "options"), e.optionsCls)),
+                  style: Dt(e.virtual ? be.value : {}),
+                  onPointerleave: l[1] || (l[1] = (a) => ze(void 0))
+                }, [
+                  e.tree ? (O(), E(c(uo), se({
+                    key: 0,
+                    ref_key: "treeRef",
+                    ref: we
+                  }, _t.value, {
+                    expandedKeys: c(g),
+                    "onUpdate:expandedKeys": l[0] || (l[0] = (a) => Je(g) ? g.value = a : null),
+                    onExpand: Te,
+                    onSelect: Tt
+                  }), {
+                    default: K(({ items: a }) => [
+                      (O(!0), de(Ae, null, $e(a, (p) => (O(), E(c(Ue), {
+                        key: p._key,
+                        value: p._key
+                      }, {
+                        default: K(() => [
+                          Z(c(po), se({ node: p }, { ref_for: !0 }, Ge(p), {
+                            onPointermove: (T) => ze(p._key)
+                          }), {
+                            default: K(() => [
+                              Z(at, { option: p }, null, 8, ["option"])
+                            ]),
+                            _: 2
+                          }, 1040, ["node", "onPointermove"])
+                        ]),
+                        _: 2
+                      }, 1032, ["value"]))), 128))
+                    ]),
+                    _: 1
+                  }, 16, ["expandedKeys"])) : (O(!0), de(Ae, { key: 1 }, $e(Ie.value, (a) => (O(), de(Ae, {
+                    key: a._key
+                  }, [
+                    a._divider ? (O(), E(mo, { key: 0 })) : a._label && a._hasChildren ? (O(), E(Co, {
+                      key: 1,
+                      label: a._label
+                    }, null, 8, ["label"])) : a._hasChildren ? Re("", !0) : (O(), E(c(Ue), {
+                      key: 2,
+                      value: a._key
+                    }, {
+                      default: K(() => [
+                        Z(at, se({ option: a }, { ref_for: !0 }, Ge(a), {
+                          onPointermove: (p) => ze(a._key)
+                        }), null, 16, ["option", "onPointermove"])
+                      ]),
+                      _: 2
+                    }, 1032, ["value"]))
+                  ], 64))), 128)),
+                  e.loading ? (O(), E(It, { key: 2 })) : Re("", !0)
+                ], 38)
+              ]),
+              _: 1
+            })) : (O(), E(Bt, { key: 1 })),
+            e.lazyLoading ? (O(), de("div", {
+              key: 2,
+              class: Pe(c(h)(c(P), "lazy_loading"))
+            }, [
+              Qe("div", {
+                class: Pe(c(h)(c(P), "lazy_loading_trigger")),
+                ref_key: "target",
+                ref: F
+              }, null, 2)
+            ], 2)) : Re("", !0)
+          ]),
+          _: 1
+        }, 16),
+        Z(Pt)
+      ]),
+      _: 2
+    }, [
+      e.noTrigger ? void 0 : {
+        name: "default",
+        fn: K(() => [
+          Z(bo)
+        ]),
+        key: "0"
+      }
+    ]), 1040, ["open", "containerProps", "size", "containerStyle", "containerCls"]));
+  }
+});
+export {
+  ct as C,
+  el as _,
+  _o as a,
+  Fe as i,
+  yo as p
+};