bitboss-ui 2.1.95 → 2.1.97

package/dist/index38.js

@@ -1,39 +1,41 @@
-import { defineComponent as Qe, ref as f, computed as m, toRef as z, createBlock as K, openBlock as h, normalizeClass as ee, withCtx as u, createElementVNode as L, createVNode as T, createElementBlock as I, unref as g, renderSlot as d, createCommentVNode as te, withDirectives as Xe, Fragment as ae, toDisplayString as Ye, withKeys as w, withModifiers as c, normalizeStyle as le, vModelDynamic as Ze, mergeProps as oe, renderList as et, nextTick as U } from "vue";
-import tt from "./index113.js";
+import { defineComponent as tt, ref as h, computed as c, toRef as W, createBlock as K, openBlock as g, normalizeClass as te, withCtx as n, createElementVNode as L, createVNode as T, createElementBlock as C, unref as B, renderSlot as d, createCommentVNode as oe, withDirectives as ot, Fragment as ae, toDisplayString as at, withKeys as w, withModifiers as m, normalizeStyle as le, vModelDynamic as lt, normalizeProps as nt, guardReactiveProps as ut, mergeProps as ne, renderList as rt, nextTick as U } from "vue";
+import st from "./index113.js";
 /* empty css         */
-import { hash as at } from "./index231.js";
-import { isEmpty as lt } from "./index246.js";
-import { last as ot } from "./index225.js";
-import { matchAnyKey as ne } from "./index289.js";
-import { useArray as nt } from "./index290.js";
-import { useBaseOptions as ut } from "./index240.js";
-import { useCoherence as it } from "./index279.js";
-import { useHashedWatcher as ue } from "./index257.js";
-import { useId as st } from "./index8.js";
-import { useIndexById as ie } from "./index241.js";
-import { useMounted as rt, useElementSize as dt, useIntersectionObserver as ct } from "./index142.js";
-import { useItemsGetter as pt } from "./index255.js";
-import { useLocale as mt } from "./index239.js";
-import { useMobile as ft } from "./index9.js";
-import { usePrefill as vt } from "./index256.js";
+import { hash as ue } from "./index254.js";
+import { isEmpty as it } from "./index248.js";
+import { last as pt } from "./index241.js";
+import { matchAnyKey as re } from "./index275.js";
+import { useArray as dt } from "./index276.js";
+import { useBaseOptions as ct } from "./index242.js";
+import { useCoherence as mt } from "./index253.js";
+import { useHashedWatcher as se } from "./index255.js";
+import { useId as ft } from "./index8.js";
+import { useIndexById as ie } from "./index243.js";
+import { useMounted as vt, useElementSize as ht, useIntersectionObserver as yt } from "./index142.js";
+import { useItemsGetter as gt } from "./index251.js";
+import { useLocale as bt } from "./index230.js";
+import { useMobile as Bt } from "./index9.js";
+import { usePrefill as wt } from "./index252.js";
 import { wait as E } from "./index141.js";
-import { when as ht } from "./index253.js";
-import yt from "./index242.js";
+import { when as Vt } from "./index225.js";
+import St from "./index244.js";
 /* empty css         */
-import bt from "./index244.js";
+import It from "./index246.js";
 /* empty css         */
-import gt from "./index137.js";
+import kt from "./index137.js";
 /* empty css         */
-import wt from "./index139.js";
-import Bt from "./index275.js";
+import Ct from "./index139.js";
+import Dt from "./index239.js";
 /* empty css         */
-import Vt from "./index291.js";
-import { useUntil as St } from "./index260.js";
-import { mapValues as kt } from "./index147.js";
-const Ct = { class: "bb-base-select__input-container" }, It = {
+import Ot from "./index277.js";
+import { useUntil as $t } from "./index256.js";
+import { mapValues as Ht } from "./index147.js";
+import { isNil as Lt } from "./index260.js";
+import { get as Tt } from "./index278.js";
+const Et = { class: "bb-base-select__input-container" }, Ft = {
   key: 1,
   class: "bb-base-select__max-reached"
-}, Dt = ["id", "aria-controls", "aria-describedby", "aria-expanded", "autocomplete", "autofocus", "disabled", "inputmode", "placeholder", "readonly", "required", "onKeydown"], ia = /* @__PURE__ */ Qe({
+}, At = ["id", "aria-controls", "aria-describedby", "aria-expanded", "autocomplete", "autofocus", "disabled", "inputmode", "placeholder", "readonly", "required", "onKeydown"], yo = /* @__PURE__ */ tt({
   __name: "BaseSelect",
   props: {
     allowWriting: { type: [Boolean, String], default: !0 },
@@ -49,6 +51,8 @@ const Ct = { class: "bb-base-select__input-container" }, It = {
     disabled: { type: Boolean },
     enforceCoherence: { type: Boolean },
     filterBy: { type: [String, Array, Boolean, Function, null], default: () => [] },
+    groupBy: {},
+    headerHeight: {},
     hasErrors: { type: Boolean },
     id: {},
     items: {},
@@ -77,294 +81,305 @@ const Ct = { class: "bb-base-select__input-container" }, It = {
     updateOnAnimationFrame: { type: Boolean, default: !1 }
   },
   emits: ["blur", "change", "click", "focus", "inactive", "input", "update:modelValue", "option:add"],
-  setup(se, { emit: re }) {
-    const t = se, o = re;
+  setup(pe, { emit: de }) {
+    const t = pe, u = de;
     if (t.multiple && !Array.isArray(t.modelValue))
       throw new Error('Multiple is set to "true" but modelValue is not an array.');
-    const { t: de } = mt(), ce = rt(), F = f(null), D = f(null), i = f(null), R = f(null), _ = f(null), r = m(
-      () => t.comma ? R.value : _.value
-    ), { width: pe } = dt(D), { isMobile: me } = ft(), fe = m(
-      () => t.allowWriting === "not-mobile" && me.value ? "none" : void 0
-    ), j = t.id || st().id.value, { resume: ve, pause: he } = ct(
+    const { t: ce } = bt(), me = vt(), F = h(null), D = h(null), s = h(null), G = h(null), R = h(null), p = c(
+      () => t.comma ? G.value : R.value
+    ), { width: fe } = ht(D), { isMobile: ve } = Bt(), he = c(
+      () => t.allowWriting === "not-mobile" && ve.value ? "none" : void 0
+    ), j = t.id || ft().id.value, { resume: ye, pause: ge } = yt(
       D,
       async ([{ intersectionRatio: e }]) => {
-        e !== 1 && n.value && await k();
+        e !== 1 && r.value && await k();
       },
       { threshold: [0, 1], immediate: !1 }
-    ), ye = m(() => ({
-      width: `${pe.value ?? 0}px`
-    })), A = f(null), v = () => {
+    ), be = c(() => ({
+      width: `${fe.value ?? 0}px`
+    })), A = h(null), y = () => {
       A.value instanceof HTMLInputElement && A.value.focus();
-    }, be = async (e) => {
-      o("focus", e), Ke(), document.addEventListener("click", O), document.addEventListener("focusin", O);
-    }, ge = () => {
-      t.prefill === "focus" && !Te.value && !J.value && Ee();
-    }, we = async (e) => {
-      o("blur", e);
-    }, Be = (e) => o("change", e), Ve = (e) => {
-      o("input", e), a.value === "" && (t.multiple || o("update:modelValue", null)), r.value?.blur(), N.value && S(), He(a.value, !1, t.modelValue);
+    }, Be = async (e) => {
+      u("focus", e), je(), document.addEventListener("click", O), document.addEventListener("focusin", O);
+    }, we = () => {
+      t.prefill === "focus" && !Fe.value && !Q.value && Ae();
+    }, Ve = async (e) => {
+      u("blur", e);
+    }, Se = (e) => u("change", e), Ie = (e) => {
+      u("input", e), o.value === "" && (t.multiple || u("update:modelValue", null)), p.value?.blur(), N.value && I(), Te(o.value, !1, t.modelValue);
     }, O = async (e) => {
-      if (e.target instanceof Node && F.value && !F.value.$el.contains(e.target) && !i.value?.$el?.contains(e.target)) {
-        k(), Ue(), document.removeEventListener("click", O), document.removeEventListener("focusin", O), await E(t.transitionDuration), y();
+      if (e.target instanceof Node && F.value && !F.value.$el.contains(e.target) && !s.value?.$el?.contains(e.target)) {
+        k(), Je(), document.removeEventListener("click", O), document.removeEventListener("focusin", O), await E(t.transitionDuration), b();
         return;
       }
-    }, B = m(() => !(t.readonly || t.disabled || H.value || !r.value && t.multiple && s.value.length <= t.maxSelectedLabels)), Se = async () => {
-      B.value && (r.value?.blur(), n.value ? i.value?.focusPrevious() : (await S(), await E(t.transitionDuration), i.value?.focusLastSelected()));
-    }, ke = async () => {
-      B.value && (r.value?.blur(), n.value ? i.value?.focusNext() : (await S(), await E(t.transitionDuration), i.value?.focusFirstSelected()));
-    }, Ce = (e) => {
-      if (!B.value || !t.multiple || a.value || (e.preventDefault(), i.value?.blur(), !s.value.length)) return;
-      r.value?.focusPrevious();
-      const l = r.value?.getHighlighted();
-      l && i.value?.focusByHash(l.valueHash);
-    }, Ie = (e) => {
-      if (!B.value || !t.multiple || a.value || (e.preventDefault(), i.value?.blur(), !s.value.length)) return;
-      r.value?.focusNext();
-      const l = r.value?.getHighlighted();
-      l && i.value?.focusByHash(l.valueHash);
-    }, De = async () => {
-      if (!B.value)
+    }, V = c(() => !(t.readonly || t.disabled || H.value || !p.value && t.multiple && i.value.length <= t.maxSelectedLabels)), ke = async () => {
+      V.value && (p.value?.blur(), r.value ? s.value?.focusPrevious() : (await I(), await E(t.transitionDuration), s.value?.focusLastSelected()));
+    }, Ce = async () => {
+      V.value && (p.value?.blur(), r.value ? s.value?.focusNext() : (await I(), await E(t.transitionDuration), s.value?.focusFirstSelected()));
+    }, De = (e) => {
+      if (!V.value || !t.multiple || o.value || (e.preventDefault(), s.value?.blur(), !i.value.length)) return;
+      p.value?.focusPrevious();
+      const a = p.value?.getHighlighted();
+      a && s.value?.focusByHash(a.valueHash);
+    }, Oe = (e) => {
+      if (!V.value || !t.multiple || o.value || (e.preventDefault(), s.value?.blur(), !i.value.length)) return;
+      p.value?.focusNext();
+      const a = p.value?.getHighlighted();
+      a && s.value?.focusByHash(a.valueHash);
+    }, $e = async () => {
+      if (!V.value)
         return;
-      if (n.value) {
-        if (i.value?.getHighlighted()) {
-          i.value.confirmOption();
+      if (r.value) {
+        if (s.value?.getHighlighted()) {
+          s.value.confirmOption();
           return;
         }
       } else {
-        await S(), await E(t.transitionDuration), s.value.length && i.value?.focusFirstSelected();
+        await I(), await E(t.transitionDuration), i.value.length && s.value?.focusFirstSelected();
         return;
       }
-      const e = a.value.trim();
-      xe(e) || (o("option:add", e), a.value = "");
-    }, Oe = async () => {
-      n.value && await k();
-    }, $e = async () => {
-      !B.value || a.value || !s.value.length || (r.value?.getHighlighted() && r.value.confirmOption(), await U(), r.value?.focusPrevious());
-    }, a = f(""), {
+      const e = o.value.trim();
+      xe(e) || (u("option:add", e), o.value = "");
+    }, He = async () => {
+      r.value && await k();
+    }, Le = async () => {
+      !V.value || o.value || !i.value.length || (p.value?.getHighlighted() && p.value.confirmOption(), await U(), p.value?.focusPrevious());
+    }, o = h(""), {
       getter: q,
-      debouncedGetter: He,
-      items: Le,
-      loading: G
-    } = pt({
-      items: z(t, "items"),
+      debouncedGetter: Te,
+      items: Ee,
+      loading: J
+    } = gt({
+      items: W(t, "items"),
       debounce: t.queryDebounceTime
-    }), x = () => {
-      t.enforceCoherence && !Z.value && (t.multiple ? o("update:modelValue", Ne.value.coherent) : o("update:modelValue", null), r.value?.blur(), i.value?.blur());
+    }), M = () => {
+      t.enforceCoherence && !ee.value && (t.multiple ? u("update:modelValue", Ue.value.coherent) : u("update:modelValue", null), p.value?.blur(), s.value?.blur());
     }, {
-      hasPrefilled: J,
-      isPrefilling: Te,
-      prefill: Ee
-    } = vt({
+      hasPrefilled: Q,
+      isPrefilling: Fe,
+      prefill: Ae
+    } = wt({
       onStart: t.prefill === !0,
       currentValue: t.modelValue,
       multiple: t.multiple,
       fn: async ({ prefill: e }) => {
-        await q(a.value, e, t.modelValue), t.stash && X(...$.value.map((l) => l.item)), x(), y();
+        await q(o.value, e, t.modelValue), t.stash && Y(...$.value.map((a) => a.item)), M(), b();
       }
     }), {
-      array: Q,
-      add: X,
-      remove: Fe,
-      set: Ae
-    } = nt(), s = m(() => {
-      const e = kt(M.value, (l, p) => Y.value[p]);
+      array: X,
+      add: Y,
+      remove: qe,
+      set: Me
+    } = dt(), i = c(() => {
+      const e = Ht(P.value, (a, l) => _.value[l]);
       return Object.values(e).filter(Boolean);
-    }), qe = m(() => s.value.length ? "" : t.placeholder), { data: M, get: xe } = ie({
+    }), Pe = c(() => i.value.length ? "" : t.placeholder), { data: P, get: xe } = ie({
       // Force model value to be an array
-      items: m(() => [].concat(t.modelValue))
-    }), { options: $ } = ut({
-      disabled: z(t, "disabled"),
-      items: m(() => [...Le.value, ...Q.value]),
+      items: c(() => [].concat(t.modelValue))
+    }), { options: $ } = ct({
+      disabled: W(t, "disabled"),
+      items: c(() => [...Ee.value, ...X.value]),
       itemText: t.itemText,
       itemValue: t.itemValue,
       max: t.max,
       selectable: !0,
-      selectedIndexedByHash: M
-    }), H = m(() => !!(G.value || t.loading)), Me = m(() => {
+      selectedIndexedByHash: P
+    }), H = c(() => !!(J.value || t.loading)), Z = c(() => {
       let e = [];
-      const l = s.value.some(
-        (b) => b.text === a.value
+      const a = i.value.some(
+        (f) => f.text === o.value
       );
-      return (t.multiple && a.value || t.filterBy === "not_stashed" && a.value || a.value && !l && !t.multiple) && t.filterBy ? e = $.value.filter((b) => {
-        let C = !1;
-        return typeof t.filterBy == "function" ? C = t.filterBy(b.value, b.item, a.value) : t.filterBy === "not_stashed" && a.value ? C = !new Set(Q.value.map((Je) => Je.valueHash)).has(b.valueHash) : Array.isArray(t.filterBy) && t.filterBy.length && (C = C || ne(b.item, t.filterBy, a.value.trim())), C || ne(b, ["text"], a.value.trim());
+      return (t.multiple && o.value || t.filterBy === "not_stashed" && o.value || o.value && !a && !t.multiple) && t.filterBy ? e = $.value.filter((f) => {
+        let v = !1;
+        return typeof t.filterBy == "function" ? v = t.filterBy(f.value, f.item, o.value) : t.filterBy === "not_stashed" && o.value ? v = !new Set(X.value.map((et) => et.valueHash)).has(f.valueHash) : Array.isArray(t.filterBy) && t.filterBy.length && (v = v || re(f.item, t.filterBy, o.value.trim())), v || re(f, ["text"], o.value.trim());
       }) : e = $.value, e;
-    }), y = () => {
+    }), Ne = Symbol("default"), ze = (e) => Lt(t.groupBy) ? Ne : typeof t.groupBy == "function" ? t.groupBy(e.item) : Tt(e.item, t.groupBy), We = c(() => {
+      const e = {};
+      for (const l of Z.value) {
+        const f = ze(l), v = ue(f);
+        e[v] || (e[v] = {
+          id: v,
+          data: f ?? null,
+          options: []
+        }), e[v].options.push(l);
+      }
+      return Object.values(e).filter((l) => l.options.length);
+    }), b = () => {
       if (t.multiple) {
-        a.value = "";
+        o.value = "";
         return;
       }
       let e;
-      s.value && (e = ot(s.value)), a.value = e?.text || "";
-    }, Pe = async (e) => {
-      t.multiple ? (o("update:modelValue", t.modelValue.concat(e.value)), t.stash && X(e.item), y()) : (t.stash && Ae(e.item), o("update:modelValue", e.value), await U(), y()), v(), t.multiple || k();
-    }, P = async (e) => {
-      if (Fe((l) => l.valueHash !== e.valueHash), t.multiple) {
-        const l = { ...M.value };
-        delete l[e.valueHash], o("update:modelValue", Object.values(l));
+      i.value && (e = pt(i.value)), o.value = e?.text || "";
+    }, Ke = async (e) => {
+      t.multiple ? (u("update:modelValue", t.modelValue.concat(e.value)), t.stash && Y(e.item), b()) : (t.stash && Me(e.item), u("update:modelValue", e.value), await U(), b()), y(), t.multiple || k();
+    }, x = async (e) => {
+      if (qe((a) => a.valueHash !== e.valueHash), t.multiple) {
+        const a = { ...P.value };
+        delete a[e.valueHash], u("update:modelValue", Object.values(a));
       } else
-        o("update:modelValue", null), await U(), y();
-      v();
-    }, { data: Y } = ie({
+        u("update:modelValue", null), await U(), b();
+      y();
+    }, { data: _ } = ie({
       items: $,
       key: "valueHash"
-    }), { coherent: Z, status: Ne } = it({
-      modelValue: z(t, "modelValue"),
+    }), { coherent: ee, status: Ue } = mt({
+      modelValue: W(t, "modelValue"),
       multiple: t.multiple,
-      iteratee: (e) => !!Y.value[at(e)]
+      iteratee: (e) => !!_.value[ue(e)]
     });
-    let V = 0;
-    ue(
+    let S = 0;
+    se(
       () => t.modelValue,
       async () => {
-        V++, Z.value || (await q(a.value, !0, t.modelValue), x()), V === 1 && y(), V--;
+        S++, ee.value || (await q(o.value, !0, t.modelValue), M()), S === 1 && b(), S--;
       },
       {
         debounce: t.modelValueDebounceTime
       }
-    ), ue(
+    ), se(
       () => [t.dependencies, t.items],
       async () => {
-        J.value && (V++, await q(a.value, !0, t.modelValue), V === 1 && (x(), y()), V--);
+        Q.value && (S++, await q(o.value, !0, t.modelValue), S === 1 && (M(), b()), S--);
       },
       {
         debounce: t.depsDebounceTime
       }
     );
-    const n = f(!1), N = f(!0), We = St(n), S = async () => {
-      ve(), N.value = !1, n.value = !0;
+    const r = h(!1), N = h(!0), Ge = $t(r), I = async () => {
+      ye(), N.value = !1, r.value = !0;
     }, k = async () => {
-      n.value = !1, N.value = !0, r.value?.blur(), he();
-    }, ze = () => n.value ? k() : S(), W = f(!1), Ke = () => {
-      W.value = !0;
-    }, Ue = () => {
-      W.value = !1, o("inactive");
-    }, Re = (e) => {
-      e.preventDefault(), o("click", e), !(t.disabled || t.readonly) && (v(), ze());
-    }, _e = ht(
+      r.value = !1, N.value = !0, p.value?.blur(), ge();
+    }, Re = () => r.value ? k() : I(), z = h(!1), je = () => {
+      z.value = !0;
+    }, Je = () => {
+      z.value = !1, u("inactive");
+    }, Qe = (e) => {
+      e.preventDefault(), u("click", e), !(t.disabled || t.readonly) && (y(), Re());
+    }, Xe = Vt(
       (e) => typeof e != "string",
       JSON.stringify
-    ), je = m(() => [].concat(t.modelValue).map((e) => {
-      const l = _e(e);
+    ), Ye = c(() => [].concat(t.modelValue).map((e) => {
+      const a = Xe(e);
       return {
         disabled: t.disabled,
         name: t.name,
         type: "hidden",
-        value: l
+        value: a
       };
-    })), Ge = () => {
+    })), Ze = () => {
       let e = null;
-      t.multiple && (e = []), o("update:modelValue", e);
+      t.multiple && (e = []), u("update:modelValue", e);
     };
-    return (e, l) => (h(), K(wt, {
+    return (e, a) => (g(), K(Ct, {
       ref_key: "outerContainer",
       ref: F,
-      class: ee({
+      class: te({
         "bb-base-select": !0,
-        "bb-base-select--active": W.value,
-        "bb-base-select--shown": n.value,
+        "bb-base-select--active": z.value,
+        "bb-base-select--shown": r.value,
         "bb-base-select--loading": H.value,
         "bb-base-select--disabled": e.disabled,
         "bb-base-select--errors": e.hasErrors,
         "bb-base-select--readonly": e.readonly,
         "bb-base-select--compact": e.compact
       }),
-      onClick: Re
+      onClick: Qe
     }, {
-      "prepend-outer": u(() => [
-        d(e.$slots, "prepend-outer", { query: a.value })
+      "prepend-outer": n(() => [
+        d(e.$slots, "prepend-outer", { query: o.value })
       ]),
-      "append-outer": u(() => [
-        d(e.$slots, "append-outer", { query: a.value })
+      "append-outer": n(() => [
+        d(e.$slots, "append-outer", { query: o.value })
       ]),
-      default: u(() => [
+      default: n(() => [
         L("span", {
           ref_key: "innerContainer",
           ref: D,
           class: "bb-base-select__inner-wrapper"
         }, [
-          T(gt, {
+          T(kt, {
             "append:icon": t["append:icon"],
-            clearable: e.clearable && !g(lt)(e.modelValue),
+            clearable: e.clearable && !B(it)(e.modelValue),
             "prepend:icon": t["prepend:icon"],
             "prevent-focus": !0,
-            "onClick:clear": Ge
+            "onClick:clear": Ze
           }, {
-            prepend: u(() => [
+            prepend: n(() => [
               d(e.$slots, "prepend", {
-                query: a.value,
-                focus: v
+                query: o.value,
+                focus: y
               })
             ]),
-            prefix: u(() => [
+            prefix: n(() => [
               d(e.$slots, "prefix")
             ]),
-            append: u(() => [
+            append: n(() => [
               d(e.$slots, "append", {
-                query: a.value,
-                focus: v
+                query: o.value,
+                focus: y
               })
             ]),
-            suffix: u(() => [
+            suffix: n(() => [
               d(e.$slots, "suffix")
             ]),
-            default: u(() => [
-              T(tt, { tag: "span" }, {
-                default: u(() => [
-                  L("span", Ct, [
-                    e.multiple && s.value.length <= e.maxSelectedLabels ? (h(), I(ae, { key: 0 }, [
-                      e.comma ? (h(), K(bt, {
+            default: n(() => [
+              T(st, { tag: "span" }, {
+                default: n(() => [
+                  L("span", Et, [
+                    e.multiple && i.value.length <= e.maxSelectedLabels ? (g(), C(ae, { key: 0 }, [
+                      e.comma ? (g(), K(It, {
                         key: 0,
                         ref_key: "commaBox",
-                        ref: R,
-                        options: s.value,
-                        "onOption:unselected": P
-                      }, null, 8, ["options"])) : (h(), K(yt, {
+                        ref: G,
+                        options: i.value,
+                        "onOption:unselected": x
+                      }, null, 8, ["options"])) : (g(), K(St, {
                         key: 1,
                         ref_key: "chipsBox",
-                        ref: _,
-                        options: s.value,
-                        "onOption:unselected": P
+                        ref: R,
+                        options: i.value,
+                        "onOption:unselected": x
                       }, null, 8, ["options"]))
-                    ], 64)) : e.multiple ? (h(), I("span", It, Ye(e.selectedLabelsFn ? e.selectedLabelsFn(s.value.length) : g(de)("select.multipleMaxReached", s.value.length)), 1)) : te("", !0),
-                    Xe((h(), I("input", {
-                      id: g(j),
-                      key: `${g(ce)}`,
+                    ], 64)) : e.multiple ? (g(), C("span", Ft, at(e.selectedLabelsFn ? e.selectedLabelsFn(i.value.length) : B(ce)("select.multipleMaxReached", i.value.length)), 1)) : oe("", !0),
+                    ot((g(), C("input", {
+                      id: B(j),
+                      key: `${B(me)}`,
                       ref_key: "input",
                       ref: A,
-                      "onUpdate:modelValue": l[0] || (l[0] = (p) => a.value = p),
+                      "onUpdate:modelValue": a[0] || (a[0] = (l) => o.value = l),
                       "aria-autocomplete": "list",
-                      "aria-controls": g(We) ? `${g(j)}_listbox` : void 0,
+                      "aria-controls": B(Ge) ? `${B(j)}_listbox` : void 0,
                       "aria-describedby": e.ariaDescribedby,
-                      "aria-expanded": n.value,
+                      "aria-expanded": r.value,
                       autocomplete: e.autocomplete,
                       autofocus: e.autofocus,
-                      class: ee("bb-base-select__text-input"),
+                      class: te("bb-base-select__text-input"),
                       disabled: e.disabled,
-                      inputmode: fe.value,
-                      placeholder: qe.value,
+                      inputmode: he.value,
+                      placeholder: Pe.value,
                       readonly: e.readonly || !e.allowWriting,
                       required: e.required && (!e.multiple || !e.modelValue.length),
                       role: "combobox",
                       size: "1",
-                      style: le({ "--characters": a.value.length }),
+                      style: le({ "--characters": o.value.length }),
                       type: "text",
-                      onBlur: c(we, ["stop"]),
-                      onChange: c(Be, ["stop"]),
-                      onFocusOnce: c(ge, ["stop"]),
-                      onFocus: c(be, ["stop"]),
-                      onInput: c(Ve, ["stop"]),
+                      onBlur: m(Ve, ["stop"]),
+                      onChange: m(Se, ["stop"]),
+                      onFocusOnce: m(we, ["stop"]),
+                      onFocus: m(Be, ["stop"]),
+                      onInput: m(Ie, ["stop"]),
                       onKeydown: [
-                        w(c($e, ["stop"]), ["delete"]),
-                        w(c(Ce, ["stop"]), ["left"]),
-                        w(c(ke, ["stop", "prevent"]), ["down"]),
-                        w(c(De, ["stop", "prevent"]), ["enter"]),
-                        w(c(Oe, ["stop", "prevent"]), ["esc"]),
-                        w(c(Se, ["stop", "prevent"]), ["up"]),
-                        w(c(Ie, ["stop"]), ["right"])
+                        w(m(Le, ["stop"]), ["delete"]),
+                        w(m(De, ["stop"]), ["left"]),
+                        w(m(Ce, ["stop", "prevent"]), ["down"]),
+                        w(m($e, ["stop", "prevent"]), ["enter"]),
+                        w(m(He, ["stop", "prevent"]), ["esc"]),
+                        w(m(ke, ["stop", "prevent"]), ["up"]),
+                        w(m(Oe, ["stop"]), ["right"])
                       ]
-                    }, null, 44, Dt)), [
-                      [Ze, a.value]
+                    }, null, 44, At)), [
+                      [lt, o.value]
                     ])
                   ])
                 ]),
@@ -372,10 +387,10 @@ const Ct = { class: "bb-base-select__input-container" }, It = {
               }),
               e.showChevron ? d(e.$slots, "chevron", {
                 key: 0,
-                loading: !!g(G),
-                shown: n.value
+                loading: !!B(J),
+                shown: r.value
               }, () => [
-                l[2] || (l[2] = L("svg", {
+                a[2] || (a[2] = L("svg", {
                   class: "bb-base-select__chevron",
                   viewBox: "0 0 24 24",
                   xmlns: "http://www.w3.org/2000/svg"
@@ -385,69 +400,74 @@ const Ct = { class: "bb-base-select__input-container" }, It = {
                     fill: "currentColor"
                   })
                 ], -1))
-              ]) : te("", !0)
+              ]) : oe("", !0)
             ]),
             _: 3
           }, 8, ["append:icon", "clearable", "prepend:icon"])
         ], 512),
-        T(Bt, {
-          modelValue: n.value,
-          "onUpdate:modelValue": l[1] || (l[1] = (p) => n.value = p),
+        T(Dt, {
+          modelValue: r.value,
+          "onUpdate:modelValue": a[1] || (a[1] = (l) => r.value = l),
           anchor: D.value,
           offset: 4,
           "transition-duration": e.transitionDuration
         }, {
-          default: u(() => [
-            T(Vt, {
+          default: n(() => [
+            T(Ot, {
               ref_key: "optionsContainer",
-              ref: i,
+              ref: s,
               compact: e.compact,
               loading: H.value,
               "loading-text": e.loadingText,
               multiple: e.multiple,
               "no-data-text": e.noDataText,
-              open: n.value,
-              options: Me.value,
-              style: le(ye.value),
+              open: r.value,
+              options: e.groupBy ? void 0 : Z.value,
+              groups: e.groupBy ? We.value : void 0,
+              "header-height": e.headerHeight,
+              style: le(be.value),
               "option-height": e.itemHeight,
-              "onOption:selected": Pe,
-              "onOption:unselected": P
+              "onOption:selected": Ke,
+              "onOption:unselected": x
             }, {
-              "options:prepend": u(() => [
-                d(e.$slots, "options:prepend", { focus: v })
+              "options:prepend": n(() => [
+                d(e.$slots, "options:prepend", { focus: y })
               ]),
-              loading: u(() => [
-                d(e.$slots, "loading", { query: a.value })
+              loading: n(() => [
+                d(e.$slots, "loading", { query: o.value })
               ]),
-              "no-data": u(() => [
+              "no-data": n(() => [
                 d(e.$slots, "no-data", {
-                  query: a.value,
-                  focus: v
+                  query: o.value,
+                  focus: y
                 })
               ]),
-              "options:append": u(() => [
-                d(e.$slots, "options:append", { focus: v })
+              "options:append": n(() => [
+                d(e.$slots, "options:append", { focus: y })
               ]),
-              option: u((p) => [
-                d(e.$slots, "option", oe({
+              option: n((l) => [
+                d(e.$slots, "option", ne({
                   hasErrors: e.hasErrors,
                   loading: H.value
-                }, p))
+                }, l))
+              ]),
+              group: n((l) => [
+                d(e.$slots, "group", nt(ut(l)))
               ]),
               _: 3
-            }, 8, ["compact", "loading", "loading-text", "multiple", "no-data-text", "open", "options", "style", "option-height"])
+            }, 8, ["compact", "loading", "loading-text", "multiple", "no-data-text", "open", "options", "groups", "header-height", "style", "option-height"])
           ]),
           _: 3
         }, 8, ["modelValue", "anchor", "transition-duration"]),
-        (h(!0), I(ae, null, et(je.value, (p) => (h(), I("input", oe({
-          key: p.value,
+        (g(!0), C(ae, null, rt(Ye.value, (l) => (g(), C("input", ne({
+          key: l.value,
           ref_for: !0
-        }, p), null, 16))), 128))
+        }, l), null, 16))), 128))
       ]),
       _: 3
     }, 8, ["class"]));
   }
 });
 export {
-  ia as default
+  yo as default
 };