bitboss-ui 2.0.115 → 2.0.117

package/dist/index37.js

@@ -1,39 +1,40 @@
-import { defineComponent as Re, defineAsyncComponent as Ge, ref as f, computed as y, toRef as T, openBlock as h, createBlock as x, normalizeClass as Z, withCtx as i, renderSlot as c, createVNode as K, unref as V, createElementVNode as H, createElementBlock as A, Fragment as ee, toDisplayString as je, createCommentVNode as te, withDirectives as Je, withModifiers as p, withKeys as g, vModelDynamic as Qe, renderList as Xe, mergeProps as oe, normalizeStyle as Ye, nextTick as _ } from "vue";
+import { defineComponent as je, defineAsyncComponent as Je, ref as f, computed as y, toRef as L, openBlock as h, createBlock as T, normalizeClass as Z, withCtx as u, renderSlot as c, createVNode as K, unref as g, createElementVNode as F, createElementBlock as H, Fragment as ee, toDisplayString as Qe, createCommentVNode as te, withDirectives as _e, withModifiers as p, withKeys as w, vModelDynamic as Xe, renderList as Ye, mergeProps as le, normalizeStyle as Ze, nextTick as U } from "vue";
 /* empty css       */
 /* empty css       */
-import { useId as Ze } from "./index8.js";
-import { useMobile as et } from "./index9.js";
-import tt from "./index128.js";
+import { useId as et } from "./index8.js";
+import { useMobile as tt } from "./index9.js";
+import lt from "./index128.js";
 /* empty css         */
-import { last as ot } from "./index223.js";
-import { matchAnyKey as le } from "./index253.js";
-import { useFloating as lt } from "./index245.js";
-import { useIntersectionObserver as at } from "./index132.js";
-import { wait as L } from "./index130.js";
-import { when as nt } from "./index232.js";
-import it from "./index254.js";
+import { last as at } from "./index222.js";
+import { matchAnyKey as ae } from "./index254.js";
+import { useFloating as ot } from "./index214.js";
+import { useIntersectionObserver as nt } from "./index132.js";
+import { wait as x } from "./index130.js";
+import { when as it } from "./index239.js";
+import ut from "./index255.js";
 /* empty css         */
-import ut from "./index256.js";
+import rt from "./index257.js";
 /* empty css         */
-import rt from "./index234.js";
+import st from "./index207.js";
 /* empty css         */
-import st from "./index236.js";
-import { waitFor as dt } from "./index241.js";
-import ct from "./index243.js";
-import { useItemsGetter as pt } from "./index209.js";
-import { usePrefill as mt } from "./index215.js";
-import { useArray as ft } from "./index258.js";
-import { useBaseOptions as vt } from "./index211.js";
-import { useIndexById as ae } from "./index210.js";
-import { useCoherence as yt } from "./index212.js";
-import { hash as ht } from "./index213.js";
-import { useHashedWatcher as ne } from "./index214.js";
-import { useLocale as bt } from "./index230.js";
-import { autoUpdate as gt, flip as wt, offset as Bt, shift as Vt } from "./index249.js";
-const It = { class: "bb-base-select__input-container" }, kt = {
+import dt from "./index209.js";
+import { waitFor as ct } from "./index224.js";
+import pt from "./index225.js";
+import { useItemsGetter as mt } from "./index231.js";
+import { usePrefill as ft } from "./index237.js";
+import { useArray as vt } from "./index259.js";
+import { useBaseOptions as yt } from "./index233.js";
+import { useIndexById as oe } from "./index232.js";
+import { useCoherence as ht } from "./index234.js";
+import { hash as bt } from "./index235.js";
+import { useHashedWatcher as ne } from "./index236.js";
+import { useLocale as gt } from "./index212.js";
+import { isEmpty as wt } from "./index227.js";
+import { autoUpdate as Bt, flip as Vt, offset as It, shift as kt } from "./index228.js";
+const Ct = { class: "bb-base-select__input-container" }, St = {
   key: 1,
   class: "bb-base-select__max-reached"
-}, St = ["id", "aria-controls", "aria-describedby", "aria-expanded", "autocomplete", "autofocus", "disabled", "inputmode", "placeholder", "readonly", "required", "onKeydown"], ao = /* @__PURE__ */ Re({
+}, Dt = ["id", "aria-controls", "aria-describedby", "aria-expanded", "autocomplete", "autofocus", "disabled", "inputmode", "placeholder", "readonly", "required", "onKeydown"], ul = /* @__PURE__ */ je({
   __name: "BaseSelect",
   props: {
     allowWriting: { type: [Boolean, String], default: !0 },
@@ -41,6 +42,7 @@ const It = { class: "bb-base-select__input-container" }, kt = {
     ariaDescribedby: {},
     autocomplete: { default: "off" },
     autofocus: {},
+    clearable: { type: Boolean },
     comma: { type: Boolean },
     compact: { type: Boolean },
     dependencies: { default: () => [] },
@@ -69,171 +71,175 @@ const It = { class: "bb-base-select__input-container" }, kt = {
     readonly: { type: Boolean },
     required: { type: Boolean },
     stash: { type: Boolean },
+    selectedLabelsFn: {},
     teleportTarget: {},
     transitionDuration: { default: 300 },
     updateOnAnimationFrame: { type: Boolean, default: !1 }
   },
   emits: ["blur", "change", "click", "focus", "inactive", "input", "update:modelValue", "option:add"],
   setup(ie, { emit: ue }) {
-    const t = ie, u = ue;
+    const t = ie, i = ue;
     if (t.multiple && !Array.isArray(t.modelValue))
       throw new Error('Multiple is set to "true" but modelValue is not an array.');
-    const { t: re } = bt(), se = Ge(() => import("./index252.js")), E = f(null), I = f(null), n = f(null), U = f(null), R = f(null), r = y(
-      () => t.comma ? U.value : R.value
-    ), { isMobile: de } = et(), ce = y(
+    const { t: re } = gt(), se = Je(() => import("./index253.js")), A = f(null), I = f(null), n = f(null), R = f(null), G = f(null), s = y(
+      () => t.comma ? R.value : G.value
+    ), { isMobile: de } = tt(), ce = y(
       () => t.allowWriting === "not-mobile" && de.value ? "none" : void 0
-    ), G = t.id || Ze().id.value;
-    at(
+    ), j = t.id || et().id.value;
+    nt(
+      // @ts-expect-error - wrong inferred type
       I,
       ([{ intersectionRatio: e }]) => {
-        e !== 1 && S();
+        e !== 1 && C();
       },
       { threshold: [0, 1] }
     );
-    const { floatingStyles: pe } = lt(
+    const { floatingStyles: pe } = ot(
+      // @ts-expect-error - wrong inferred type
       I,
       n,
       {
         placement: "bottom",
-        whileElementsMounted: gt,
-        middleware: [wt(), Bt(5), Vt()]
+        whileElementsMounted: Bt,
+        middleware: [Vt(), It(5), kt()]
       }
     ), me = y(() => {
-      var o;
+      var l;
       const e = {
         ...pe.value,
         zIndex: "10"
       };
-      return I.value && (e.width = `${(o = I.value) == null ? void 0 : o.$el.clientWidth}px`), e;
-    }), F = f(null), q = () => {
-      F.value instanceof HTMLInputElement && F.value.focus();
+      return I.value && (e.width = `${(l = I.value) == null ? void 0 : l.$el.clientWidth}px`), e;
+    }), E = f(null), q = () => {
+      E.value instanceof HTMLInputElement && E.value.focus();
     }, fe = async (e) => {
-      u("focus", e), We(), document.addEventListener("click", D), document.addEventListener("focusin", D);
+      i("focus", e), We(), document.addEventListener("click", D), document.addEventListener("focusin", D);
     }, ve = () => {
-      t.prefill === "focus" && !$e.value && !J.value && Oe();
+      t.prefill === "focus" && !$e.value && !Q.value && Oe();
     }, ye = async (e) => {
-      u("blur", e);
-    }, he = (e) => u("change", e), be = (e) => {
-      var o;
-      u("input", e), l.value === "" && (t.multiple || u("update:modelValue", null)), (o = r.value) == null || o.blur(), N.value && k(), Ce(l.value, !1, t.modelValue);
+      i("blur", e);
+    }, he = (e) => i("change", e), be = (e) => {
+      var l;
+      i("input", e), a.value === "" && (t.multiple || i("update:modelValue", null)), (l = s.value) == null || l.blur(), N.value && k(), Se(a.value, !1, t.modelValue);
     }, D = async (e) => {
-      if (e.target instanceof Node && E.value && n.value && !E.value.$el.contains(e.target) && !n.value.$el.contains(e.target)) {
-        S(), ze(), document.removeEventListener("click", D), document.removeEventListener("focusin", D), await L(t.transitionDuration), b();
+      var l, o;
+      if (e.target instanceof Node && A.value && !A.value.$el.contains(e.target) && !((o = (l = n.value) == null ? void 0 : l.$el) != null && o.contains(e.target))) {
+        C(), ze(), document.removeEventListener("click", D), document.removeEventListener("focusin", D), await x(t.transitionDuration), b();
         return;
       }
-    }, w = y(() => !(t.readonly || t.disabled || O.value || !r.value && t.multiple)), ge = async () => {
-      var e, o, a;
-      w.value && ((e = r.value) == null || e.blur(), m.value ? (o = n.value) == null || o.focusPrevious() : (await k(), await L(t.transitionDuration), (a = n.value) == null || a.focusLastSelected()));
+    }, B = y(() => !(t.readonly || t.disabled || O.value || !s.value && t.multiple && r.value.length <= t.maxSelectedLabels)), ge = async () => {
+      var e, l, o;
+      B.value && ((e = s.value) == null || e.blur(), m.value ? (l = n.value) == null || l.focusPrevious() : (await k(), await x(t.transitionDuration), (o = n.value) == null || o.focusLastSelected()));
     }, we = async () => {
-      var e, o, a;
-      w.value && ((e = r.value) == null || e.blur(), m.value ? (o = n.value) == null || o.focusNext() : (await k(), await L(t.transitionDuration), (a = n.value) == null || a.focusFirstSelected()));
+      var e, l, o;
+      B.value && ((e = s.value) == null || e.blur(), m.value ? (l = n.value) == null || l.focusNext() : (await k(), await x(t.transitionDuration), (o = n.value) == null || o.focusFirstSelected()));
     }, Be = (e) => {
-      var a, d, v, C;
-      if (!w.value || !t.multiple || l.value || (e.preventDefault(), (a = n.value) == null || a.blur(), !s.value.length)) return;
-      (d = r.value) == null || d.focusPrevious();
-      const o = (v = r.value) == null ? void 0 : v.getHighlighted();
-      o && ((C = n.value) == null || C.focusByHash(o.valueHash));
+      var o, d, v, S;
+      if (!B.value || !t.multiple || a.value || (e.preventDefault(), (o = n.value) == null || o.blur(), !r.value.length)) return;
+      (d = s.value) == null || d.focusPrevious();
+      const l = (v = s.value) == null ? void 0 : v.getHighlighted();
+      l && ((S = n.value) == null || S.focusByHash(l.valueHash));
     }, Ve = (e) => {
-      var a, d, v, C;
-      if (!w.value || !t.multiple || l.value || (e.preventDefault(), (a = n.value) == null || a.blur(), !s.value.length)) return;
-      (d = r.value) == null || d.focusNext();
-      const o = (v = r.value) == null ? void 0 : v.getHighlighted();
-      o && ((C = n.value) == null || C.focusByHash(o.valueHash));
+      var o, d, v, S;
+      if (!B.value || !t.multiple || a.value || (e.preventDefault(), (o = n.value) == null || o.blur(), !r.value.length)) return;
+      (d = s.value) == null || d.focusNext();
+      const l = (v = s.value) == null ? void 0 : v.getHighlighted();
+      l && ((S = n.value) == null || S.focusByHash(l.valueHash));
     }, Ie = async () => {
-      var o, a;
-      if (!w.value)
+      var l, o;
+      if (!B.value)
         return;
       if (m.value) {
-        if ((a = n.value) != null && a.getHighlighted()) {
+        if ((o = n.value) != null && o.getHighlighted()) {
           n.value.confirmOption();
           return;
         }
       } else {
-        await k(), await L(t.transitionDuration), s.value.length && ((o = n.value) == null || o.focusFirstSelected());
+        await k(), await x(t.transitionDuration), r.value.length && ((l = n.value) == null || l.focusFirstSelected());
         return;
       }
-      const e = l.value.trim();
-      Ee(e) || (u("option:add", e), l.value = "");
+      const e = a.value.trim();
+      Ae(e) || (i("option:add", e), a.value = "");
     }, ke = async () => {
-      m.value && await S();
-    }, Se = async () => {
-      var e, o;
-      !w.value || l.value || !s.value.length || ((e = r.value) != null && e.getHighlighted() && r.value.confirmOption(), await _(), (o = r.value) == null || o.focusPrevious());
-    }, l = f(""), {
+      m.value && await C();
+    }, Ce = async () => {
+      var e, l;
+      !B.value || a.value || !r.value.length || ((e = s.value) != null && e.getHighlighted() && s.value.confirmOption(), await U(), (l = s.value) == null || l.focusPrevious());
+    }, a = f(""), {
       getter: M,
-      debouncedGetter: Ce,
+      debouncedGetter: Se,
       items: De,
-      loading: j
-    } = pt({
-      items: T(t, "items"),
+      loading: J
+    } = mt({
+      items: L(t, "items"),
       debounce: t.queryDebounceTime
     }), P = () => {
-      var e, o;
-      t.enforceCoherence && !Y.value && (t.multiple ? u("update:modelValue", Pe.value.coherent) : u("update:modelValue", null), (e = r.value) == null || e.blur(), (o = n.value) == null || o.blur());
+      var e, l;
+      t.enforceCoherence && !Y.value && (t.multiple ? i("update:modelValue", Pe.value.coherent) : i("update:modelValue", null), (e = s.value) == null || e.blur(), (l = n.value) == null || l.blur());
     }, {
-      hasPrefilled: J,
+      hasPrefilled: Q,
       isPrefilling: $e,
       prefill: Oe
-    } = mt({
+    } = ft({
       onStart: t.prefill === !0,
       currentValue: t.modelValue,
       multiple: t.multiple,
       fn: async ({ prefill: e }) => {
-        await M(l.value, e, t.modelValue), P(), b();
+        await M(a.value, e, t.modelValue), P(), b();
       }
     }), {
-      array: Te,
-      add: xe,
-      remove: He,
-      set: Ae
-    } = ft(), s = y(() => $.value.filter((e) => e.selected)), Le = y(() => s.value.length ? "" : t.placeholder), { data: Q, get: Ee } = ae({
-      items: T(t, "modelValue")
-    }), { options: $ } = vt({
-      disabled: T(t, "disabled"),
-      items: y(() => [...De.value, ...Te.value]),
+      array: Le,
+      add: Te,
+      remove: Fe,
+      set: He
+    } = vt(), r = y(() => $.value.filter((e) => e.selected)), xe = y(() => r.value.length ? "" : t.placeholder), { data: _, get: Ae } = oe({
+      items: L(t, "modelValue")
+    }), { options: $ } = yt({
+      disabled: L(t, "disabled"),
+      items: y(() => [...De.value, ...Le.value]),
       itemText: t.itemText,
       itemValue: t.itemValue,
       max: t.max,
       selectable: !0,
-      selectedIndexedByHash: Q
-    }), O = y(() => !!(j.value || t.loading)), Fe = y(() => {
+      selectedIndexedByHash: _
+    }), O = y(() => !!(J.value || t.loading)), Ee = y(() => {
       let e = [];
-      const o = s.value.some(
-        (d) => d.text === l.value
+      const l = r.value.some(
+        (d) => d.text === a.value
       );
-      return (t.multiple && l.value || l.value && !o && !t.multiple) && t.filterBy ? e = $.value.filter((d) => {
+      return (t.multiple && a.value || a.value && !l && !t.multiple) && t.filterBy ? e = $.value.filter((d) => {
         let v = !1;
-        return typeof t.filterBy == "function" ? v = t.filterBy(d.value, d.item) : Array.isArray(t.filterBy) && t.filterBy.length && (v = v || le(d.item, t.filterBy, l.value.trim())), v || le(d, ["text"], l.value.trim());
+        return typeof t.filterBy == "function" ? v = t.filterBy(d.value, d.item) : Array.isArray(t.filterBy) && t.filterBy.length && (v = v || ae(d.item, t.filterBy, a.value.trim())), v || ae(d, ["text"], a.value.trim());
       }) : e = $.value, e;
     }), b = () => {
       if (t.multiple) {
-        l.value = "";
+        a.value = "";
         return;
       }
       let e;
-      s.value && (e = ot(s.value)), l.value = (e == null ? void 0 : e.text) || "";
+      r.value && (e = at(r.value)), a.value = (e == null ? void 0 : e.text) || "";
     }, qe = async (e) => {
-      t.multiple ? (u("update:modelValue", t.modelValue.concat(e.value)), t.stash && xe(e.item), b()) : (t.stash && Ae(e.item), u("update:modelValue", e.value), await _(), b()), q(), t.multiple || S();
+      t.multiple ? (i("update:modelValue", t.modelValue.concat(e.value)), t.stash && Te(e.item), b()) : (t.stash && He(e.item), i("update:modelValue", e.value), await U(), b()), q(), t.multiple || C();
     }, X = async (e) => {
-      if (He((o) => o.valueHash !== e.valueHash), t.multiple) {
-        const o = { ...Q.value };
-        delete o[e.valueHash], u("update:modelValue", Object.values(o));
+      if (Fe((l) => l.valueHash !== e.valueHash), t.multiple) {
+        const l = { ..._.value };
+        delete l[e.valueHash], i("update:modelValue", Object.values(l));
       } else
-        u("update:modelValue", null), await _(), b();
+        i("update:modelValue", null), await U(), b();
       q();
-    }, { data: Me } = ae({
+    }, { data: Me } = oe({
       items: $,
       key: "valueHash"
-    }), { coherent: Y, status: Pe } = yt({
-      modelValue: T(t, "modelValue"),
+    }), { coherent: Y, status: Pe } = ht({
+      modelValue: L(t, "modelValue"),
       multiple: t.multiple,
-      iteratee: (e) => !!Me.value[ht(e)]
+      iteratee: (e) => !!Me.value[bt(e)]
     });
-    let B = 0;
+    let V = 0;
     ne(
       () => t.modelValue,
       async () => {
-        B++, Y.value || (await M(l.value, !1, t.modelValue), P()), B === 1 && b(), B--;
+        V++, Y.value || (await M(a.value, !1, t.modelValue), P()), V === 1 && b(), V--;
       },
       {
         debounce: t.modelValueDebounceTime
@@ -241,38 +247,41 @@ const It = { class: "bb-base-select__input-container" }, kt = {
     ), ne(
       () => [t.dependencies, t.items],
       async () => {
-        J.value && (B++, await M(l.value, !1, t.modelValue), B === 1 && (P(), b()), B--);
+        Q.value && (V++, await M(a.value, !1, t.modelValue), V === 1 && (P(), b()), V--);
       },
       {
         debounce: t.depsDebounceTime
       }
     );
     const m = f(!1), N = f(!0), W = f(!1), k = async () => {
-      W.value = !0, await dt(() => !!n.value), N.value = !1, m.value = !0;
-    }, S = async () => {
+      W.value = !0, await ct(() => !!n.value), N.value = !1, m.value = !0;
+    }, C = async () => {
       var e;
-      m.value = !1, N.value = !0, (e = r.value) == null || e.blur();
-    }, Ne = () => m.value ? S() : k(), z = f(!1), We = () => {
+      m.value = !1, N.value = !0, (e = s.value) == null || e.blur();
+    }, Ne = () => m.value ? C() : k(), z = f(!1), We = () => {
       z.value = !0;
     }, ze = () => {
-      z.value = !1, u("inactive");
+      z.value = !1, i("inactive");
     }, Ke = (e) => {
-      e.preventDefault(), u("click", e), !(t.disabled || t.readonly) && (q(), Ne());
-    }, _e = nt(
+      e.preventDefault(), i("click", e), !(t.disabled || t.readonly) && (q(), Ne());
+    }, Ue = it(
       (e) => typeof e != "string",
       JSON.stringify
-    ), Ue = y(() => [].concat(t.modelValue).map((e) => {
-      const o = _e(e);
+    ), Re = y(() => [].concat(t.modelValue).map((e) => {
+      const l = Ue(e);
       return {
         disabled: t.disabled,
         name: t.name,
         type: "hidden",
-        value: o
+        value: l
       };
-    }));
-    return (e, o) => (h(), x(st, {
+    })), Ge = () => {
+      let e = null;
+      t.multiple && (e = []), i("update:modelValue", e);
+    };
+    return (e, l) => (h(), T(dt, {
       ref_key: "outerContainer",
-      ref: E,
+      ref: A,
       class: Z({
         "bb-base-select": !0,
         "bb-base-select--active": z.value,
@@ -285,57 +294,59 @@ const It = { class: "bb-base-select__input-container" }, kt = {
       }),
       onClick: Ke
     }, {
-      "prepend-outer": i(() => [
-        c(e.$slots, "prepend-outer", { query: l.value })
+      "prepend-outer": u(() => [
+        c(e.$slots, "prepend-outer", { query: a.value })
       ]),
-      "append-outer": i(() => [
-        c(e.$slots, "append-outer", { query: l.value })
+      "append-outer": u(() => [
+        c(e.$slots, "append-outer", { query: a.value })
       ]),
-      default: i(() => [
-        K(rt, {
+      default: u(() => [
+        K(st, {
           ref_key: "innerContainer",
           ref: I,
           "append:icon": t["append:icon"],
+          clearable: e.clearable && !g(wt)(e.modelValue),
           "prepend:icon": t["prepend:icon"],
-          "prevent-focus": !0
+          "prevent-focus": !0,
+          "onClick:clear": Ge
         }, {
-          prepend: i(() => [
-            c(e.$slots, "prepend", { query: l.value })
+          prepend: u(() => [
+            c(e.$slots, "prepend", { query: a.value })
           ]),
-          prefix: i(() => [
+          prefix: u(() => [
             c(e.$slots, "prefix")
           ]),
-          append: i(() => [
-            c(e.$slots, "append", { query: l.value })
+          append: u(() => [
+            c(e.$slots, "append", { query: a.value })
           ]),
-          suffix: i(() => [
+          suffix: u(() => [
             c(e.$slots, "suffix")
           ]),
-          default: i(() => [
-            K(V(tt), { tag: "span" }, {
-              default: i(() => [
-                H("span", It, [
-                  e.multiple && s.value.length <= e.maxSelectedLabels ? (h(), A(ee, { key: 0 }, [
-                    e.comma ? (h(), x(ut, {
+          default: u(() => [
+            K(g(lt), { tag: "span" }, {
+              default: u(() => [
+                F("span", Ct, [
+                  e.multiple && r.value.length <= e.maxSelectedLabels ? (h(), H(ee, { key: 0 }, [
+                    e.comma ? (h(), T(rt, {
                       key: 0,
                       ref_key: "commaBox",
-                      ref: U,
-                      options: s.value
-                    }, null, 8, ["options"])) : (h(), x(it, {
+                      ref: R,
+                      options: r.value
+                    }, null, 8, ["options"])) : (h(), T(ut, {
                       key: 1,
                       ref_key: "chipsBox",
-                      ref: R,
-                      options: s.value,
+                      ref: G,
+                      options: r.value,
                       "onOption:unselected": X
                     }, null, 8, ["options"]))
-                  ], 64)) : e.multiple ? (h(), A("span", kt, je(V(re)("select.multipleMaxReached", s.value.length)), 1)) : te("", !0),
-                  Je(H("input", {
-                    id: V(G),
+                  ], 64)) : e.multiple ? (h(), H("span", St, Qe(e.selectedLabelsFn ? e.selectedLabelsFn(r.value.length) : g(re)("select.multipleMaxReached", r.value.length)), 1)) : te("", !0),
+                  _e(F("input", {
+                    id: g(j),
                     ref_key: "input",
-                    ref: F,
-                    "onUpdate:modelValue": o[0] || (o[0] = (a) => l.value = a),
+                    ref: E,
+                    "onUpdate:modelValue": l[0] || (l[0] = (o) => a.value = o),
                     "aria-autocomplete": "list",
-                    "aria-controls": W.value ? `${V(G)}_listbox` : void 0,
+                    "aria-controls": W.value ? `${g(j)}_listbox` : void 0,
                     "aria-describedby": e.ariaDescribedby,
                     "aria-expanded": m.value,
                     autocomplete: e.autocomplete,
@@ -343,7 +354,7 @@ const It = { class: "bb-base-select__input-container" }, kt = {
                     class: Z("bb-base-select__text-input"),
                     disabled: e.disabled,
                     inputmode: ce.value,
-                    placeholder: Le.value,
+                    placeholder: xe.value,
                     readonly: e.readonly || !e.allowWriting,
                     required: e.required && (!e.multiple || !e.modelValue.length),
                     role: "combobox",
@@ -355,31 +366,31 @@ const It = { class: "bb-base-select__input-container" }, kt = {
                     onFocus: p(fe, ["stop"]),
                     onInput: p(be, ["stop"]),
                     onKeydown: [
-                      g(p(Se, ["stop"]), ["delete"]),
-                      g(p(Be, ["stop"]), ["left"]),
-                      g(p(we, ["stop", "prevent"]), ["down"]),
-                      g(p(Ie, ["stop", "prevent"]), ["enter"]),
-                      g(p(ke, ["stop", "prevent"]), ["esc"]),
-                      g(p(ge, ["stop", "prevent"]), ["up"]),
-                      g(p(Ve, ["stop"]), ["right"])
+                      w(p(Ce, ["stop"]), ["delete"]),
+                      w(p(Be, ["stop"]), ["left"]),
+                      w(p(we, ["stop", "prevent"]), ["down"]),
+                      w(p(Ie, ["stop", "prevent"]), ["enter"]),
+                      w(p(ke, ["stop", "prevent"]), ["esc"]),
+                      w(p(ge, ["stop", "prevent"]), ["up"]),
+                      w(p(Ve, ["stop"]), ["right"])
                     ]
-                  }, null, 40, St), [
-                    [Qe, l.value]
+                  }, null, 40, Dt), [
+                    [Xe, a.value]
                   ])
                 ])
               ]),
               _: 1
             }),
             c(e.$slots, "chevron", {
-              loading: !!V(j),
+              loading: !!g(J),
               shown: m.value
             }, () => [
-              o[1] || (o[1] = H("svg", {
+              l[1] || (l[1] = F("svg", {
                 class: "bb-base-select__chevron",
                 viewBox: "0 0 24 24",
                 xmlns: "http://www.w3.org/2000/svg"
               }, [
-                H("path", {
+                F("path", {
                   d: "M7.41 8.58L12 13.17l4.59-4.59L18 10l-6 6l-6-6z",
                   fill: "currentColor"
                 })
@@ -387,17 +398,17 @@ const It = { class: "bb-base-select__input-container" }, kt = {
             ])
           ]),
           _: 3
-        }, 8, ["append:icon", "prepend:icon"]),
-        (h(!0), A(ee, null, Xe(Ue.value, (a) => (h(), A("input", oe({
-          key: a.value,
+        }, 8, ["append:icon", "clearable", "prepend:icon"]),
+        (h(!0), H(ee, null, Ye(Re.value, (o) => (h(), H("input", le({
+          key: o.value,
           ref_for: !0
-        }, a), null, 16))), 128)),
-        W.value ? (h(), x(ct, {
+        }, o), null, 16))), 128)),
+        W.value ? (h(), T(pt, {
           key: 0,
           target: e.teleportTarget
         }, {
-          default: i(() => [
-            K(V(se), {
+          default: u(() => [
+            K(g(se), {
               ref_key: "optionsContainer",
               ref: n,
               compact: e.compact,
@@ -405,28 +416,28 @@ const It = { class: "bb-base-select__input-container" }, kt = {
               "loading-text": e.loadingText,
               "no-data-text": e.noDataText,
               open: m.value,
-              options: Fe.value,
-              style: Ye(me.value),
+              options: Ee.value,
+              style: Ze(me.value),
               "onOption:selected": qe,
               "onOption:unselected": X
             }, {
-              "options:prepend": i(() => [
+              "options:prepend": u(() => [
                 c(e.$slots, "options:prepend")
               ]),
-              loading: i(() => [
-                c(e.$slots, "loading", { query: l.value })
+              loading: u(() => [
+                c(e.$slots, "loading", { query: a.value })
               ]),
-              "no-data": i(() => [
-                c(e.$slots, "no-data", { query: l.value })
+              "no-data": u(() => [
+                c(e.$slots, "no-data", { query: a.value })
               ]),
-              "options:append": i(() => [
+              "options:append": u(() => [
                 c(e.$slots, "options:append")
               ]),
-              option: i((a) => [
-                c(e.$slots, "option", oe({
+              option: u((o) => [
+                c(e.$slots, "option", le({
                   hasErrors: e.hasErrors,
                   loading: O.value
-                }, a))
+                }, o))
               ]),
               _: 3
             }, 8, ["compact", "loading", "loading-text", "no-data-text", "open", "options", "style"])
@@ -439,5 +450,5 @@ const It = { class: "bb-base-select__input-container" }, kt = {
   }
 });
 export {
-  ao as default
+  ul as default
 };

package/dist/index39.js

@@ -1,11 +1,11 @@
 import { defineComponent as U, ref as d, computed as h, onMounted as W, watch as Z, openBlock as g, createElementBlock as w, mergeProps as T, renderSlot as f, createElementVNode as c, Fragment as ee, renderList as ae, createCommentVNode as H, normalizeProps as re, guardReactiveProps as te, unref as b, normalizeClass as F, normalizeStyle as I } from "vue";
 import { clamp as le } from "./index206.js";
-import { head as O } from "./index250.js";
-import { isCssColor as Y } from "./index231.js";
-import { isNil as P } from "./index251.js";
+import { head as O } from "./index251.js";
+import { isCssColor as Y } from "./index238.js";
+import { isNil as P } from "./index252.js";
 import { isNotNil as ne } from "./index134.js";
 import { transposeValue as y } from "./index131.js";
-import { hash as J } from "./index213.js";
+import { hash as J } from "./index235.js";
 const oe = { class: "bb-base-slider__slider-container" }, ie = {
   key: 0,
   class: "bb-base-slider__ticks-container"

package/dist/index41.js

@@ -1,6 +1,6 @@
 import { defineComponent as I, ref as f, computed as n, watch as S, openBlock as h, createElementBlock as y, normalizeProps as r, guardReactiveProps as d, mergeProps as V, createCommentVNode as A, createElementVNode as l, renderSlot as F } from "vue";
-import { isCssColor as b } from "./index231.js";
-import { when as N } from "./index232.js";
+import { isCssColor as b } from "./index238.js";
+import { when as N } from "./index239.js";
 const x = { class: "bb-base-switch-container" }, $ = /* @__PURE__ */ I({
   __name: "BaseSwitch",
   props: {