@pantograph/vue 0.29.1 → 0.29.2

package/dist/Combobox/index.js

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