bitboss-ui 2.0.38 → 2.0.39

package/dist/index88.js

@@ -1,94 +1,187 @@
-import { defineComponent as f, ref as v, computed as y, openBlock as k, createBlock as w, withCtx as l, renderSlot as i, normalizeProps as B, guardReactiveProps as g, createVNode as P, mergeProps as n } from "vue";
-import V from "./index25.js";
+import { defineComponent as F, defineAsyncComponent as S, ref as n, computed as h, openBlock as v, createElementBlock as H, mergeProps as q, createElementVNode as p, renderSlot as k, normalizeProps as A, guardReactiveProps as I, createBlock as y, unref as V, withCtx as C, createCommentVNode as $, nextTick as W } from "vue";
+import { useFocusTrap as z } from "./index223.js";
+import { useId as R } from "./index8.js";
+import { useIntersectionObserver as j } from "./index132.js";
+import { waitFor as G } from "./index225.js";
+import J from "./index13.js";
 /* empty css        */
-import q from "./index29.js";
-/* empty css        */
-const R = /* @__PURE__ */ f({
-  __name: "BbRadio",
+const ee = /* @__PURE__ */ F({
+  __name: "BbPopover",
   props: {
-    autofocus: {},
-    checked: {},
-    color: {},
-    direction: { default: "auto" },
+    arrowPadding: { default: 10 },
+    block: { type: Boolean },
     disabled: { type: Boolean },
-    errors: {},
-    hasErrors: { type: Boolean },
-    hideLabel: { type: Boolean },
-    hint: {},
-    id: {},
-    inputPosition: {},
-    label: {},
-    labelPosition: {},
-    modelValue: {},
-    name: {},
-    persistentHint: { type: Boolean },
-    readonly: {},
-    required: { type: Boolean },
-    reverse: { type: Boolean, default: !0 },
-    value: {}
+    eager: { type: Boolean },
+    offset: { default: 3 },
+    padding: { default: 10 },
+    placement: { default: "bottom" },
+    showClose: { type: Boolean, default: !0 },
+    theme: { default: "default" },
+    transitionDuration: { default: 150 },
+    focusTarget: {},
+    width: {}
   },
-  emits: ["blur", "change", "click", "focus", "input", "keydown", "mousedown", "mouseup", "update:modelValue"],
-  setup(s, { emit: t }) {
-    const d = s, o = t, r = v(!1), u = y(() => d.persistentHint || r.value), p = {
-      onBlur: (e) => {
-        r.value = !1, o("blur", e);
+  emits: ["shown", "hidden"],
+  setup(T, { emit: B }) {
+    const P = S(
+      () => import("./index282.js")
+    ), t = T, s = B, { id: _ } = R(), c = `bbp_${_.value}`, r = n(), i = n(), { activate: N, deactivate: D } = z(i, {
+      /**
+       * This traps all clicks outside so we are pressing
+       * the trigger we just allow and process that in its
+       * own click handler.
+       * If we are pressing anything random on the page
+       * close the popover and be done
+       */
+      clickOutsideDeactivates: (e) => {
+        var w;
+        const o = e.target;
+        return o instanceof HTMLElement && (w = r.value) != null && w.contains(o) || (l(), s("hidden")), !0;
       },
-      onChange: (e) => o("change", e),
-      onClick: (e) => o("click", e),
-      onFocus: (e) => {
-        r.value = !0, o("focus", e);
+      escapeDeactivates: () => (W(async () => {
+        await l(), f(), s("hidden");
+      }), !0),
+      /* We don't return focus so that when
+       * we press a button on tyhe page we can focus
+       * THAT button and not the current trigger
+       */
+      returnFocusOnDeactivate: !1
+    });
+    j(
+      r,
+      ([{ intersectionRatio: e }]) => {
+        e !== 1 && a.value && l();
       },
-      onInput: (e) => o("input", e),
-      onKeydown: (e) => o("keydown", e),
-      onMousedown: (e) => o("mousedown", e),
-      onMouseup: (e) => o("mouseup", e),
-      "onUpdate:modelValue": (e) => o("update:modelValue", e)
-    };
-    return (e, C) => (k(), w(V, {
-      id: e.id,
-      class: "bb-radio",
-      direction: e.direction,
-      errors: e.errors,
-      "has-errors": e.hasErrors,
-      "hide-label": e.hideLabel,
-      hint: e.hint,
-      "input-position": e.inputPosition,
-      label: e.label,
-      "label-position": e.labelPosition,
-      "label-tag": "span",
-      name: e.name,
-      reverse: e.reverse,
-      "show-hint": u.value,
-      tag: "label"
-    }, {
-      label: l((a) => [
-        i(e.$slots, "label", B(g(a)))
-      ]),
-      input: l(({ id: a, name: m, hasErrors: c, ariaDescribedby: b }) => [
-        P(q, n({
-          id: a,
-          "aria-describedby": b,
-          autofocus: e.autofocus,
-          checked: e.checked,
-          color: e.color,
-          disabled: e.disabled,
-          "has-errors": c,
-          "model-value": e.modelValue,
-          name: m,
-          readonly: e.readonly,
-          required: e.required,
-          value: e.value
-        }, p), {
-          icon: l((h) => [
-            i(e.$slots, "icon", n(h, { text: e.label }))
-          ]),
-          _: 2
-        }, 1040, ["id", "aria-describedby", "autofocus", "checked", "color", "disabled", "has-errors", "model-value", "name", "readonly", "required", "value"])
-      ]),
-      _: 3
-    }, 8, ["id", "direction", "errors", "has-errors", "hide-label", "hint", "input-position", "label", "label-position", "name", "reverse", "show-hint"]));
+      { threshold: [0, 1] }
+    );
+    const E = h(() => ({
+      class: {
+        "bb-popover--block": t.block,
+        [`bb-popover--${t.theme}`]: !0
+      }
+    })), d = n(!1), u = n(!1), a = n(!1), m = n(!1), b = n(!0), L = async () => {
+      d.value = !0, await G(() => !!i.value), a.value = !0;
+    }, l = async () => {
+      a.value = !1;
+    }, M = async () => {
+      if (a.value) {
+        await l(), f(), s("hidden");
+        return;
+      }
+      if (u.value || t.disabled) return;
+      d.value = !0, await L();
+      let e = t.focusTarget ?? ".bb-popover__close";
+      N({
+        onPostActivate: () => {
+          if (i.value) {
+            const o = i.value.querySelector(e);
+            o instanceof HTMLElement && (o.focus(), s("shown"));
+          }
+        }
+      });
+    }, f = () => {
+      var o;
+      const e = (o = r.value) == null ? void 0 : o.querySelector(`[aria-controls=popover_${c}]`);
+      e instanceof HTMLElement && e.focus({ preventScroll: !0 });
+    }, g = async () => {
+      D(), await l(), f(), s("hidden");
+    }, O = h(() => {
+      if (t.width) {
+        let e;
+        if (typeof t.width == "string" && Number.isNaN(Number(t.width)))
+          if (t.width.includes("%")) {
+            if (!r.value) return;
+            e = `${r.value.clientWidth * (+t.width.replace("%", "") / 100)}`;
+          } else
+            e = t.width;
+        else
+          e = `${t.width}`;
+        return `${e}px`;
+      }
+    });
+    return (e, o) => (v(), H("span", q({ class: "bb-popover" }, E.value), [
+      p("span", {
+        ref_key: "wrapper",
+        ref: r,
+        class: "bb-popover__wrapper"
+      }, [
+        k(e.$slots, "activator", A(I({
+          props: {
+            "aria-controls": `popover_${c}`,
+            "aria-expanded": a.value,
+            onClick: M,
+            id: c,
+            disabled: !!e.disabled
+          },
+          closed: b.value,
+          closing: m.value,
+          disabled: !!e.disabled,
+          open: a.value,
+          opening: u.value,
+          placement: e.placement
+        })))
+      ], 512),
+      d.value || e.eager ? (v(), y(V(P), {
+        key: 0,
+        "arrow-padding": e.arrowPadding,
+        "base-class": "bb-popover",
+        "container-attributes": {
+          id: `popover_${c}`,
+          style: { width: O.value }
+        },
+        eager: e.eager,
+        offset: e.offset,
+        open: a.value,
+        padding: e.padding,
+        placement: e.placement,
+        theme: e.theme,
+        "transition-duration": e.transitionDuration,
+        wrapper: r.value
+      }, {
+        default: C(() => [
+          p("div", {
+            ref_key: "content",
+            ref: i,
+            class: "bb-popover__content"
+          }, [
+            e.showClose ? (v(), y(J, {
+              key: 0,
+              class: "bb-popover__close",
+              onClick: g
+            }, {
+              default: C(() => o[0] || (o[0] = [
+                p("span", { class: "bb-popover__close-label sr-only" }, "Chiudi", -1),
+                p("svg", {
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  xmlns: "http://www.w3.org/2000/svg"
+                }, [
+                  p("path", {
+                    d: "M23 23L1 1M23 1L1 23",
+                    stroke: "currentColor",
+                    "stroke-linecap": "round",
+                    "stroke-width": "2"
+                  })
+                ], -1)
+              ])),
+              _: 1
+            })) : $("", !0),
+            k(e.$slots, "default", {
+              close: g,
+              closed: b.value,
+              closing: m.value,
+              disabled: !!e.disabled,
+              open: a.value,
+              opening: u.value,
+              placement: e.placement
+            })
+          ], 512)
+        ]),
+        _: 3
+      }, 8, ["arrow-padding", "container-attributes", "eager", "offset", "open", "padding", "placement", "theme", "transition-duration", "wrapper"])) : $("", !0)
+    ], 16));
   }
 });
 export {
-  R as default
+  ee as default
 };

package/dist/index9.js

@@ -1,4 +1,4 @@
-import { useWindowSize as i } from "./index128.js";
+import { useWindowSize as i } from "./index132.js";
 import { computed as e } from "vue";
 import { _config as t } from "./index4.js";
 const c = () => {

package/dist/index90.js

@@ -1,129 +1,33 @@
-import { defineComponent as v, ref as g, computed as y, openBlock as B, createBlock as $, withCtx as a, renderSlot as i, normalizeProps as r, guardReactiveProps as l, createVNode as w, mergeProps as T } from "vue";
-import V from "./index25.js";
-/* empty css        */
-import D from "./index31.js";
-/* empty css        */
-const E = /* @__PURE__ */ v({
-  __name: "BbRadioGroup",
+import { defineComponent as r, computed as a, openBlock as l, createElementBlock as s, normalizeClass as m, createElementVNode as n, normalizeStyle as c } from "vue";
+import { clamp as p } from "./index204.js";
+import { getAsPercentageBetween as i } from "./index130.js";
+const _ = /* @__PURE__ */ r({
+  __name: "BbProgress",
   props: {
-    autofocus: {},
-    color: {},
-    dependencies: {},
-    depsDebounceTime: {},
-    disabled: { type: Boolean },
-    enforceCoherence: { type: Boolean },
-    errors: {},
-    hasErrors: { type: Boolean },
-    hideLabel: { type: Boolean },
-    hideLegend: { type: Boolean },
-    hint: {},
-    id: {},
-    inputDirection: {},
-    items: { type: [Array, Function] },
-    itemText: {},
-    itemValue: {},
-    legend: {},
-    loadingText: {},
-    modelValue: {},
-    modelValueDebounceTime: {},
-    name: {},
-    noDataText: {},
-    persistentHint: { type: Boolean },
-    readonly: {},
-    required: { type: Boolean },
-    reverse: { type: Boolean }
+    modelValue: { default: 0 },
+    min: { default: 0 },
+    max: { default: 100 }
   },
-  emits: ["blur", "change", "click", "focus", "inactive", "input", "keydown", "mousedown", "mouseup", "update:modelValue"],
-  setup(t, { emit: u }) {
-    const p = t, n = u, d = g(!1), m = y(() => p.persistentHint || d.value), c = {
-      onBlur: (e) => n("blur", e),
-      onChange: (e) => n("change", e),
-      onClick: (e) => n("click", e),
-      onFocus: (e) => {
-        d.value = !0, n("focus", e);
-      },
-      onInactive: () => {
-        d.value = !1, n("inactive");
-      },
-      onInput: (e) => n("input", e),
-      onKeydown: (e) => n("keydown", e),
-      onMousedown: (e) => n("mousedown", e),
-      onMouseup: (e) => n("mouseup", e),
-      "onUpdate:modelValue": (e) => n("update:modelValue", e)
-    };
-    return (e, k) => (B(), $(V, {
-      id: e.id,
-      class: "bb-radio-group",
-      direction: "vertical",
-      errors: e.errors,
-      "has-errors": e.hasErrors,
-      "hide-label": e.hideLegend,
-      hint: e.hint,
-      label: e.legend,
-      "label-tag": "legend",
-      name: e.name,
-      reverse: e.reverse,
-      "show-hint": m.value,
-      tag: "fieldset"
-    }, {
-      label: a((s) => [
-        i(e.$slots, "legend", r(l(s)))
-      ]),
-      input: a(({ id: s, name: b, hasErrors: h, ariaDescribedby: f }) => [
-        w(D, T({
-          id: s,
-          "aria-describedby": f,
-          autofocus: e.autofocus,
-          color: e.color,
-          dependencies: e.dependencies,
-          "deps-debounce-time": e.depsDebounceTime,
-          direction: e.inputDirection,
-          disabled: e.disabled,
-          "enforce-coherence": e.enforceCoherence,
-          "has-errors": h,
-          "hide-label": e.hideLabel,
-          "item-text": e.itemText,
-          "item-value": e.itemValue,
-          items: e.items,
-          "loading-text": e.loadingText,
-          "model-value": e.modelValue,
-          "model-value-debounce-time": e.modelValueDebounceTime,
-          name: b,
-          "no-data-text": e.noDataText,
-          readonly: e.readonly,
-          required: e.required
-        }, c), {
-          prepend: a((o) => [
-            i(e.$slots, "prepend", r(l(o)))
-          ]),
-          loading: a((o) => [
-            i(e.$slots, "loading", r(l(o)))
-          ]),
-          "no-data": a((o) => [
-            i(e.$slots, "no-data", r(l(o)))
-          ]),
-          "option:prepend": a((o) => [
-            i(e.$slots, "option:prepend", r(l(o)))
-          ]),
-          icon: a((o) => [
-            i(e.$slots, "icon", r(l(o)))
-          ]),
-          label: a((o) => [
-            i(e.$slots, "label", r(l(o)))
-          ]),
-          "option:append": a((o) => [
-            i(e.$slots, "option:append", r(l(o)))
-          ]),
-          append: a((o) => [
-            i(e.$slots, "append", r(l(o)))
-          ]),
-          _: 2
-        }, 1040, ["id", "aria-describedby", "autofocus", "color", "dependencies", "deps-debounce-time", "direction", "disabled", "enforce-coherence", "has-errors", "hide-label", "item-text", "item-value", "items", "loading-text", "model-value", "model-value-debounce-time", "name", "no-data-text", "readonly", "required"])
-      ]),
-      _: 3
-    }, 8, ["id", "errors", "has-errors", "hide-label", "hint", "label", "name", "reverse", "show-hint"]));
+  setup(t) {
+    const e = t, o = a(
+      () => p(
+        i(e.modelValue || e.min, e.min, e.max),
+        0,
+        100
+      )
+    );
+    return (d, u) => (l(), s("div", {
+      class: m(["bb-progress", {
+        "bb-progress--horizontal": !0
+      }])
+    }, [
+      n("div", {
+        class: "bb-progress-bar",
+        style: c({ width: o.value + "%" })
+      }, null, 4)
+    ]));
   }
 });
 export {
-  E as default
+  _ as default
 };

package/dist/index92.js

@@ -1,41 +1,42 @@
-import { defineComponent as g, ref as v, computed as y, openBlock as w, createBlock as B, withCtx as s, renderSlot as r, normalizeProps as a, guardReactiveProps as i, createVNode as k, mergeProps as P } from "vue";
-import V from "./index25.js";
+import { defineComponent as f, ref as v, computed as y, openBlock as k, createBlock as w, withCtx as l, renderSlot as i, normalizeProps as B, guardReactiveProps as g, createVNode as P, mergeProps as n } from "vue";
+import V from "./index27.js";
 /* empty css        */
-import $ from "./index33.js";
+import q from "./index31.js";
 /* empty css        */
-const M = /* @__PURE__ */ g({
-  __name: "BbRating",
+const R = /* @__PURE__ */ f({
+  __name: "BbRadio",
   props: {
     autofocus: {},
+    checked: {},
     color: {},
+    direction: { default: "auto" },
     disabled: { type: Boolean },
     errors: {},
     hasErrors: { type: Boolean },
-    hideLegend: { type: Boolean },
+    hideLabel: { type: Boolean },
     hint: {},
     id: {},
-    inputPosition: { default: "left" },
-    legend: {},
-    legendPosition: {},
+    inputPosition: {},
+    label: {},
+    labelPosition: {},
     modelValue: {},
     name: {},
     persistentHint: { type: Boolean },
     readonly: {},
-    reverse: { type: Boolean },
-    stars: {},
-    size: {}
+    required: { type: Boolean },
+    reverse: { type: Boolean, default: !0 },
+    value: {}
   },
-  emits: ["blur", "change", "click", "focus", "inactive", "input", "keydown", "mousedown", "mouseup", "update:modelValue"],
-  setup(d, { emit: u }) {
-    const p = d, o = u, l = v(!1), m = y(() => p.persistentHint || l.value), c = {
-      onBlur: (e) => o("blur", e),
+  emits: ["blur", "change", "click", "focus", "input", "keydown", "mousedown", "mouseup", "update:modelValue"],
+  setup(s, { emit: t }) {
+    const d = s, o = t, r = v(!1), u = y(() => d.persistentHint || r.value), p = {
+      onBlur: (e) => {
+        r.value = !1, o("blur", e);
+      },
       onChange: (e) => o("change", e),
       onClick: (e) => o("click", e),
       onFocus: (e) => {
-        l.value = !0, o("focus", e);
-      },
-      onInactive: () => {
-        l.value = !1, o("inactive");
+        r.value = !0, o("focus", e);
       },
       onInput: (e) => o("input", e),
       onKeydown: (e) => o("keydown", e),
@@ -43,56 +44,51 @@ const M = /* @__PURE__ */ g({
       onMouseup: (e) => o("mouseup", e),
       "onUpdate:modelValue": (e) => o("update:modelValue", e)
     };
-    return (e, z) => (w(), B(V, {
+    return (e, C) => (k(), w(V, {
       id: e.id,
-      class: "bb-rating",
-      direction: "vertical",
+      class: "bb-radio",
+      direction: e.direction,
       errors: e.errors,
       "has-errors": e.hasErrors,
-      "hide-label": e.hideLegend,
+      "hide-label": e.hideLabel,
       hint: e.hint,
       "input-position": e.inputPosition,
-      label: e.legend,
-      "label-position": e.legendPosition,
-      "label-tag": "legend",
+      label: e.label,
+      "label-position": e.labelPosition,
+      "label-tag": "span",
       name: e.name,
       reverse: e.reverse,
-      "show-hint": m.value,
-      tag: "fieldset"
+      "show-hint": u.value,
+      tag: "label"
     }, {
-      label: s((t) => [
-        r(e.$slots, "legend", a(i(t)))
+      label: l((a) => [
+        i(e.$slots, "label", B(g(a)))
       ]),
-      input: s(({ id: t, name: h, hasErrors: b, ariaDescribedby: f }) => [
-        k($, P({
-          id: t,
-          "aria-describedby": f,
+      input: l(({ id: a, name: m, hasErrors: c, ariaDescribedby: b }) => [
+        P(q, n({
+          id: a,
+          "aria-describedby": b,
           autofocus: e.autofocus,
+          checked: e.checked,
           color: e.color,
           disabled: e.disabled,
-          "has-errors": b,
+          "has-errors": c,
           "model-value": e.modelValue,
-          name: h,
+          name: m,
           readonly: e.readonly,
-          size: e.size,
-          stars: e.stars
-        }, c), {
-          prepend: s((n) => [
-            r(e.$slots, "prepend", a(i(n)))
-          ]),
-          append: s((n) => [
-            r(e.$slots, "append", a(i(n)))
-          ]),
-          icon: s((n) => [
-            r(e.$slots, "icon", a(i(n)))
+          required: e.required,
+          value: e.value
+        }, p), {
+          icon: l((h) => [
+            i(e.$slots, "icon", n(h, { text: e.label }))
           ]),
           _: 2
-        }, 1040, ["id", "aria-describedby", "autofocus", "color", "disabled", "has-errors", "model-value", "name", "readonly", "size", "stars"])
+        }, 1040, ["id", "aria-describedby", "autofocus", "checked", "color", "disabled", "has-errors", "model-value", "name", "readonly", "required", "value"])
       ]),
       _: 3
-    }, 8, ["id", "errors", "has-errors", "hide-label", "hint", "input-position", "label", "label-position", "name", "reverse", "show-hint"]));
+    }, 8, ["id", "direction", "errors", "has-errors", "hide-label", "hint", "input-position", "label", "label-position", "name", "reverse", "show-hint"]));
   }
 });
 export {
-  M as default
+  R as default
 };