bitboss-ui 2.1.87 → 2.1.88

package/dist/index250.js

@@ -1,18 +1,102 @@
-import { isNotNil as n } from "./index144.js";
-import { ref as t, onServerPrefetch as u, onBeforeMount as c } from "vue";
-const h = ({
-  fn: i,
-  onStart: s,
-  multiple: f,
-  currentValue: o
-}) => {
-  const a = s || !f && n(o) || f && !!o.length, e = t(!1), l = t(!1), r = async () => {
-    e.value = !0, await i({ prefill: !0 }), e.value = !1, l.value = !0;
-  };
-  return a && (u(r), c(async () => {
-    l.value || await r();
-  })), { isPrefilling: e, hasPrefilled: l, prefill: r };
-};
+import { defineComponent as F, ref as H, computed as L, watch as N, createElementBlock as d, openBlock as v, Fragment as S, renderList as A, withModifiers as O, normalizeClass as P, toDisplayString as V } from "vue";
+import { hash as f } from "./index237.js";
+import { isNil as i } from "./index275.js";
+const z = ["text", "onClick:clear"], j = /* @__PURE__ */ F({
+  __name: "CommaBox",
+  props: {
+    options: {}
+  },
+  emits: ["option:unselected"],
+  setup(m, { expose: h, emit: x }) {
+    const t = m, a = x, n = H(null), l = L(() => t.options.some((e) => !e.disabled)), u = (e = 1) => {
+      const s = i(n.value) ? -1 : n.value;
+      let o = (s + e) % t.options.length;
+      for (; t.options[o].disabled && o !== s; )
+        o = u(e + 1);
+      return o;
+    }, b = () => {
+      if (!l.value) return;
+      const e = u();
+      n.value = e;
+    }, c = (e = 1) => {
+      const s = i(n.value) ? 0 : n.value;
+      let o = (s - e + t.options.length) % t.options.length;
+      for (; t.options[o].disabled && o !== s; )
+        o = c(e + 1);
+      return o;
+    }, w = async () => {
+      if (!l.value) return;
+      const e = c();
+      n.value = e;
+    }, I = () => {
+      if (!l.value) return;
+      let e = 0;
+      for (; t.options[e].disabled; )
+        e++;
+      n.value = e;
+    }, g = () => {
+      if (!l.value) return;
+      let e = t.options.length - 1;
+      for (; t.options[e].disabled && e !== 0; )
+        e--;
+      n.value = e;
+    }, k = () => {
+      if (!l.value) return;
+      let e = 0;
+      for (; !t.options[e].selected && t.options.length !== e; )
+        e++;
+      n.value = e;
+    }, _ = () => {
+      if (!l.value) return;
+      let e = t.options.length - 1;
+      for (; t.options[e].selected && e !== 0; )
+        e--;
+      n.value = e;
+    }, C = (e) => {
+      if (!l.value) return;
+      const s = t.options.findIndex(
+        (o) => o.valueHash === e
+      );
+      s >= 0 && (n.value = s);
+    }, r = () => {
+      n.value = null;
+    }, y = () => {
+      if (i(n.value)) return;
+      const e = t.options[n.value];
+      e.selected && a("option:unselected", e);
+    }, B = () => i(n.value) ? void 0 : t.options[n.value];
+    return N(
+      () => t.options,
+      (e, s) => {
+        f(e) !== f(s) && r();
+      },
+      {
+        flush: "post"
+      }
+    ), h({
+      focusNext: b,
+      focusPrevious: w,
+      focusFirst: I,
+      focusFirstSelected: k,
+      focusLast: g,
+      focusLastSelected: _,
+      blur: r,
+      confirmOption: y,
+      focusByHash: C,
+      getHighlighted: B
+    }), (e, s) => (v(!0), d(S, null, A(e.options, (o, p) => (v(), d("span", {
+      key: o.valueHash,
+      class: P({
+        "bb-commabox-item": !0,
+        "bb-commabox-item--focused": p === n.value,
+        "bb-commabox-item--has-comma": p !== e.options.length - 1
+      }),
+      clearable: !0,
+      text: o.text,
+      "onClick:clear": O((D) => a("option:unselected", o), ["stop"])
+    }, V(o.text), 43, z))), 128));
+  }
+});
 export {
-  h as usePrefill
+  j as default
 };

package/dist/index252.js

@@ -1,137 +1,231 @@
-import { defineComponent as A, mergeModels as L, useModel as T, ref as c, computed as a, watch as F, onMounted as S, createBlock as N, openBlock as w, resolveDynamicComponent as U, mergeProps as g, unref as y, withModifiers as h, withCtx as j, createElementVNode as q, createElementBlock as I, createCommentVNode as R, renderSlot as X, nextTick as z } from "vue";
-import { useCancelableFunction as G } from "./index334.js";
-import { useUntil as H } from "./index237.js";
-import { extractDomContainer as x } from "./index242.js";
-import { waitFor as J } from "./index335.js";
-import { arrow as K, useFloating as O } from "./index336.js";
-import { flip as Q, offset as W, shift as Y, hide as Z, autoUpdate as ee } from "./index337.js";
-const oe = {
+import { defineComponent as Z, useTemplateRef as $, computed as c, ref as w, watch as E, createElementBlock as r, openBlock as p, withModifiers as ee, normalizeStyle as h, normalizeClass as z, createElementVNode as v, renderSlot as m, createTextVNode as D, toDisplayString as g, unref as L, Fragment as te, renderList as oe } from "vue";
+import { isNil as b } from "./index275.js";
+import { useVirtualizer as ne } from "./index349.js";
+import { isNotNil as le } from "./index144.js";
+import { hash as N } from "./index237.js";
+import { useLocale as ie } from "./index223.js";
+const se = { class: "bb-listbox__outer-container scrollbar-border" }, ae = {
+  ref: "inner",
+  class: "bb-listbox__inner-container",
+  tabindex: "-1"
+}, ue = {
   key: 0,
-  class: "bb-common-popover__bubble"
-}, ue = /* @__PURE__ */ A({
-  __name: "CommonPopover",
-  props: /* @__PURE__ */ L({
-    arrowPadding: {},
-    eager: { type: Boolean },
-    offset: {},
-    padding: { default: 0 },
-    placement: {},
+  class: "bb-listbox__loading"
+}, re = {
+  key: 1,
+  class: "bb-listbox__no-data"
+}, pe = ["aria-selected", "data-index"], de = { class: "autocomplete-option__label" }, he = /* @__PURE__ */ Z({
+  __name: "ListBox",
+  props: {
+    compact: { type: Boolean },
+    options: {},
+    open: { type: Boolean },
+    loading: { type: Boolean },
+    multiple: { type: Boolean },
     transitionDuration: { default: 250 },
-    anchor: {},
-    boundary: {},
-    dialog: { type: Boolean },
-    hideArrow: { type: Boolean },
-    tag: { default: "span" },
-    flip: { type: Boolean, default: !0 }
-  }, {
-    modelValue: { type: Boolean, default: !1 },
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(m) {
-    const o = m, r = T(m, "modelValue"), s = c(r.value), C = a(() => o.dialog ? "dialog" : "span"), t = c(), f = c(), _ = a(() => {
-      const e = o.anchor;
-      return e && typeof e == "object" && "getBoundingClientRect" in e && !(e instanceof Element) ? e : x(e);
-    }), B = H(r, { initialValue: o.eager }), P = a(() => {
-      if (o.boundary)
-        return typeof o.boundary == "string" ? document.querySelector(o.boundary) ?? void 0 : x(o.boundary) ?? void 0;
-    }), k = a(() => {
-      const e = P.value;
-      return [
-        ...o.flip ? [Q(e ? { boundary: e } : void 0)] : [],
-        W(o.offset),
-        Y({ padding: o.padding, ...e ? { boundary: e } : {} }),
-        Z(),
-        ...o.hideArrow ? [] : [
-          K({
-            element: f,
-            padding: o.arrowPadding
-          })
-        ]
-      ];
-    }), { floatingStyles: E, placement: M, middlewareData: u, update: v } = O(
-      _,
-      t,
-      {
-        placement: o.placement,
-        whileElementsMounted: ee,
-        middleware: k,
-        strategy: "fixed"
+    loadingText: {},
+    noDataText: {},
+    optionHeight: {}
+  },
+  emits: ["option:selected", "option:unselected"],
+  setup(V, { expose: R, emit: F }) {
+    const o = V, _ = F, { t: y } = ie(), u = $("inner"), O = $("listbox"), C = (e) => "option_" + JSON.stringify(e).replace(/\W/g, "_"), i = c(
+      () => o.options.map((e) => ({ ...e, id: C(e.value) }))
+    ), x = c(() => o.optionHeight ? o.optionHeight : o.compact ? 32 : 40), d = ne({
+      get count() {
+        return o.options.length;
+      },
+      getScrollElement: () => u.value ? u.value : null,
+      estimateSize: () => x.value,
+      overscan: 5,
+      measureElement: () => x.value,
+      useAnimationFrameWithResizeObserver: !0
+    }), A = (e) => {
+      e && d.value.measureElement(e);
+    }, M = c(() => d.value.getVirtualItems()), P = c(() => d.value.getTotalSize()), n = w(null), s = c(
+      () => o.open && o.options.some((e) => !e.disabled)
+    ), I = (e = 1) => {
+      const l = b(n.value) ? -1 : n.value;
+      let t = (l + e) % o.options.length;
+      for (; o.options[t].disabled && t !== l; )
+        t = I(e + 1);
+      return t;
+    }, W = () => {
+      if (!s.value) return;
+      const e = I();
+      n.value = e, a();
+    }, S = (e = 1) => {
+      const l = b(n.value) ? 0 : n.value;
+      let t = (l - e + o.options.length) % o.options.length;
+      for (; o.options[t].disabled && t !== l; )
+        t = S(e + 1);
+      return t;
+    }, J = async () => {
+      if (!s.value) return;
+      const e = S();
+      n.value = e, a();
+    }, Y = () => {
+      if (!s.value) return;
+      let e = 0;
+      for (; o.options[e].disabled; )
+        e++;
+      n.value = e, a();
+    }, j = () => {
+      if (!s.value) return;
+      let e = o.options.length - 1;
+      for (; o.options[e].disabled && e !== 0; )
+        e--;
+      n.value = e, a();
+    }, q = () => {
+      if (!s.value) return;
+      let e = 0;
+      for (; o.options[e] && !o.options[e].selected && o.options.length !== e; )
+        e++;
+      n.value = e % o.options.length, a();
+    }, G = () => {
+      if (!s.value) return;
+      let e = o.options.length - 1;
+      for (; o.options[e].selected && e > 0; )
+        e--;
+      n.value = e === -1 ? o.options.length - 1 : e, a();
+    }, K = (e) => {
+      if (!s.value) return;
+      const l = o.options.findIndex(
+        (t) => t.valueHash === e
+      );
+      l >= 0 && (n.value = l), a();
+    }, k = () => {
+      n.value = null;
+    }, a = () => {
+      u.value && le(n.value) && d.value.scrollToIndex(n.value, {
+        align: "center",
+        behavior: "smooth"
+      });
+    }, H = () => {
+      if (b(n.value) || !o.open) return;
+      const e = o.options[n.value];
+      e.selected ? _("option:unselected", e) : _("option:selected", e);
+    }, T = w(0), B = () => {
+      u.value && (T.value = u.value.scrollHeight);
+    }, Q = (e) => !e.disabled, U = (e) => {
+      if (e.preventDefault(), u.value && e.target && e.target instanceof HTMLElement && O.value) {
+        let l = e.target, t = l.dataset.index;
+        for (; b(t) && l.parentElement; )
+          l = l.parentElement, t = l.dataset.index;
+        if (t) {
+          const f = o.options[+t];
+          f && Q(f) && (n.value = +t, H());
+        }
       }
-    ), { execute: b } = G(
-      ({ signal: e }, n) => new Promise((l) => {
-        let i;
-        const p = () => {
-          i && clearTimeout(i);
-        };
-        e.addEventListener("abort", p), n ? ($(), v(), J(() => !!t.value).then(() => {
-          s.value = !0, e.removeEventListener("abort", p), l(void 0);
-        })) : (s.value = !1, i = setTimeout(() => {
-          z(() => {
-            t.value && (o.dialog ? t.value.close() : t.value.hidePopover()), e.removeEventListener("abort", p), v(), l(void 0);
-          });
-        }, o.transitionDuration));
-      })
-    ), $ = () => {
-      if (!t.value) return;
-      if (!o.dialog) return t.value.showPopover();
-      t.value.showModal();
-    };
-    F(r, b), S(() => {
-      r.value && b(r.value);
-    });
-    const D = a(() => {
-      const e = r.value ? void 0 : -1, n = Math.round(u.value.arrow?.x ?? 0), l = o.dialog ? void 0 : "manual";
-      return {
-        style: {
-          ...E.value,
-          "--transition-duration": `${o.transitionDuration}ms`,
-          "--page-padding": `${o.padding}px`,
-          "--arrow-offset-x": `${n}px`
-        },
-        popover: l,
-        tabindex: e
-      };
-    }), V = a(() => {
-      if (u.value.arrow) {
-        const { x: e, y: n } = u.value.arrow;
-        return {
-          style: {
-            left: `${e}px`,
-            top: `${n}px`
-          }
-        };
+    }, X = () => b(n.value) ? void 0 : o.options[n.value];
+    return E(
+      () => o.open,
+      () => {
+        B();
+      },
+      { flush: "post" }
+    ), E(
+      () => o.options,
+      (e, l) => {
+        N(e.map((t) => t.valueHash)) !== N(l.map((t) => t.valueHash)) && (d.value.calculateRange(), B(), k());
+      },
+      {
+        flush: "post"
       }
-    }), d = () => {
-      r.value = !1;
-    };
-    return (e, n) => (w(), N(U(C.value), g({
-      ref_key: "wrapper",
-      ref: t,
-      class: ["bb-common-popover", {
-        "bb-common-popover--open": s.value,
-        "bb-common-popover--no-arrow": e.hideArrow,
-        [`bb-common-popover--${y(M)}`]: !0
-      }]
-    }, D.value, {
-      onClick: h(d, ["self", "stop"]),
-      onContextmenu: h(d, ["self", "stop", "prevent"]),
-      onClose: d
-    }), {
-      default: j(() => [
-        q("span", g({
-          ref_key: "bubblearrow",
-          ref: f,
-          class: "bb-common-popover__arrow"
-        }, V.value), null, 16),
-        y(B) ? (w(), I("span", oe, [
-          X(e.$slots, "default")
-        ])) : R("", !0)
-      ]),
-      _: 3
-    }, 16, ["class"]));
+    ), R({
+      focusNext: W,
+      focusPrevious: J,
+      focusFirst: Y,
+      focusFirstSelected: q,
+      focusLast: j,
+      focusLastSelected: G,
+      blur: k,
+      confirmOption: H,
+      focusByHash: K,
+      getHighlighted: X
+    }), (e, l) => (p(), r("span", {
+      class: z(["bb-listbox", {
+        "bb-listbox--compact": e.compact,
+        "bb-listbox--loading": e.loading,
+        "bb-listbox--multiple": e.multiple,
+        "bb-listbox--no-data": !i.value.length,
+        "bb-listbox--open": e.open
+      }]),
+      style: h({
+        "--transition-duration": `${e.transitionDuration}ms`,
+        "--overlay-min-height": `${T.value}px`,
+        "--option-height": `${x.value}px`
+      }),
+      onClick: ee(U, ["stop"])
+    }, [
+      v("span", se, [
+        v("span", ae, [
+          m(e.$slots, "options:prepend"),
+          e.loading && !e.options.length ? (p(), r("span", ue, [
+            m(e.$slots, "loading", {}, () => [
+              D(g(e.loadingText || L(y)("common.loadingText").value), 1)
+            ])
+          ])) : e.options.length ? (p(), r("span", {
+            key: 2,
+            role: "listbox",
+            ref: "listbox",
+            style: h({
+              height: `${P.value}px`
+            }),
+            tabindex: "-1"
+          }, [
+            (p(!0), r(te, null, oe(M.value, (t, f) => (p(), r("span", {
+              key: i.value[t.index].value,
+              ref_for: !0,
+              ref: A,
+              "aria-selected": n.value === f ? !0 : void 0,
+              class: z({
+                "bb-listbox__option autocomplete-option": !0,
+                "autocomplete-option--focused": n.value === t.index,
+                "autocomplete-option--selected": i.value[t.index].selected,
+                "autocomplete-option--disabled": i.value[t.index].disabled
+              }),
+              "data-index": t.index,
+              role: "option",
+              style: h({
+                transform: `translateY(${t.start}px)`
+              })
+            }, [
+              m(e.$slots, "option", {
+                disabled: !!i.value[t.index].disabled,
+                focused: n.value === t.index,
+                index: t.index,
+                item: i.value[t.index].item,
+                selected: !!i.value[t.index].selected,
+                text: i.value[t.index].text,
+                value: i.value[t.index].value
+              }, () => [
+                l[0] || (l[0] = v("svg", {
+                  class: "autocomplete-option__checkbox",
+                  role: "presentation",
+                  viewBox: "276.411 158.834 114.971 114.97"
+                }, [
+                  v("path", {
+                    d: "M 297.574 224.786 L 318.309 243.134 L 371.568 189.232",
+                    fill: "none",
+                    "stroke-linecap": "round",
+                    "stroke-width": "14px"
+                  })
+                ], -1)),
+                v("span", de, g(i.value[t.index].text), 1)
+              ])
+            ], 14, pe))), 128))
+          ], 4)) : (p(), r("span", re, [
+            m(e.$slots, "no-data", {}, () => [
+              D(g(e.noDataText || L(y)("common.noDataText").value), 1)
+            ])
+          ])),
+          m(e.$slots, "options:append")
+        ], 512)
+      ])
+    ], 6));
   }
 });
 export {
-  ue as default
+  he as default
 };

package/dist/index253.js

@@ -0,0 +1,15 @@
+import { ref as c, watch as f, toValue as u } from "vue";
+const p = (e, { initialValue: r = !1, nextValue: o = !0 } = {}) => {
+  const t = c(r);
+  if (r) return t;
+  const n = f(
+    () => u(e),
+    (s) => {
+      s && (t.value = o, n());
+    }
+  );
+  return t;
+};
+export {
+  p as useUntil
+};

package/dist/index254.js

@@ -1,25 +1,36 @@
-const e = {
-  inert: ":not([inert]):not([inert] *)",
-  negTabIndex: ':not([tabindex^="-"])',
-  disabled: ":not(:disabled)"
-}, n = [
-  `a[href]${e.inert}${e.negTabIndex}`,
-  `area[href]${e.inert}${e.negTabIndex}`,
-  `input:not([type="hidden"]):not([type="radio"])${e.inert}${e.negTabIndex}${e.disabled}`,
-  `input[type="radio"]${e.inert}${e.negTabIndex}${e.disabled}`,
-  `select${e.inert}${e.negTabIndex}${e.disabled}`,
-  `textarea${e.inert}${e.negTabIndex}${e.disabled}`,
-  `button${e.inert}${e.negTabIndex}${e.disabled}`,
-  `details${e.inert} > summary:first-of-type${e.negTabIndex}`,
-  // Discard until Firefox supports `:has()`
-  // See: https://github.com/KittyGiraudel/focusable-selectors/issues/12
-  // `details:not(:has(> summary))${not.inert}${not.negTabIndex}`,
-  `iframe${e.inert}${e.negTabIndex}`,
-  `audio[controls]${e.inert}${e.negTabIndex}`,
-  `video[controls]${e.inert}${e.negTabIndex}`,
-  `[contenteditable]${e.inert}${e.negTabIndex}`,
-  `[tabindex]${e.inert}${e.negTabIndex}`
-];
+import { defineComponent as a, resolveComponent as o, createBlock as u, openBlock as l, resolveDynamicComponent as m, unref as c, withCtx as p, renderSlot as f } from "vue";
+import { _config as e } from "./index4.js";
+import { useLogger as i } from "./index261.js";
+import { useFrameworkDetection as k } from "./index255.js";
+const y = /* @__PURE__ */ a({
+  __name: "RouterComponent",
+  setup(g) {
+    const { isInertia: r, isNuxt: s } = k();
+    let t;
+    if (r) {
+      if (t = o(e.inertiaLinkName), typeof t == "string") {
+        const { warn: n } = i();
+        n(
+          `Inertia link component "${e.inertiaLinkName}" could not be resolved. Ensure you app registers a link component with the name "${e.inertiaLinkName}" or set bitboss-ui config key "inertiaLinkName" to the correct value globally. Please visit ${e.documentationURL}/getting-started to resolve setup issues in bitboss-ui.`
+        );
+      }
+    } else if (s) {
+      if (t = o(e.nuxtLinkName), typeof t == "string") {
+        const { warn: n } = i();
+        n(
+          `Nuxt link component "${e.nuxtLinkName}" could not be resolved. Ensure you app registers a link component with the name "${e.nuxtLinkName}" or set bitboss-ui config key "nuxtLinkName" to the correct value globally. Please visit ${e.documentationURL}/getting-started to resolve setup issues in bitboss-ui.`
+        );
+      }
+    } else
+      t = "router-link";
+    return (n, d) => (l(), u(m(c(t)), null, {
+      default: p(() => [
+        f(n.$slots, "default")
+      ]),
+      _: 3
+    }));
+  }
+});
 export {
-  n as default
+  y as default
 };

package/dist/index255.js

@@ -1,25 +1,11 @@
-const i = (t) => {
-  const n = t.toString().replace(/\.0+$/, "").replace(/\.$/, "");
-  return parseFloat(n) || 0;
+import { getCurrentInstance as e } from "vue";
+const s = () => {
+  const t = e(), n = !!t?.proxy?.$inertia, r = !!t?.proxy?.$nuxt;
+  return {
+    isInertia: n,
+    isNuxt: r
+  };
 };
-function s(t) {
-  if (typeof t == "number")
-    return {
-      value: i(t),
-      unit: "px"
-    };
-  if (typeof t == "string") {
-    const r = /^(-?\d*\.?\d+)([a-zA-Z%]*)?$/, e = t.match(r);
-    if (e) {
-      const [, n, o = "px"] = e, a = parseFloat(n);
-      return {
-        value: i(a),
-        unit: o
-      };
-    }
-  }
-  throw new Error(`Invalid width: ${t}`);
-}
 export {
-  s as parseWidthString
+  s as useFrameworkDetection
 };