bitboss-ui 2.0.38 → 2.0.40

package/dist/index110.js

@@ -1,113 +1,409 @@
-import { defineComponent as w, ref as y, computed as v, openBlock as B, createBlock as g, withCtx as r, renderSlot as a, normalizeProps as d, guardReactiveProps as p, createVNode as $, mergeProps as k } from "vue";
-import V from "./index25.js";
+import { defineComponent as oe, ref as x, computed as y, toRef as B, watch as ne, openBlock as n, createBlock as de, resolveDynamicComponent as ce, normalizeClass as r, unref as u, withCtx as ie, createElementBlock as d, toDisplayString as p, createCommentVNode as _, createElementVNode as o, renderSlot as f, createVNode as I, Fragment as w, renderList as T, createTextVNode as be, mergeProps as re } from "vue";
+import { add as ue } from "./index294.js";
+import { clamp as pe } from "./index204.js";
+import { isNil as M } from "./index129.js";
+import { useId as fe } from "./index8.js";
+import { useItemValue as me } from "./index256.js";
+import { when as ye } from "./index213.js";
+import J from "./index17.js";
 /* empty css        */
-import P from "./index45.js";
+import he from "./index31.js";
 /* empty css        */
-const M = /* @__PURE__ */ w({
-  __name: "BbTextarea",
+import { useOptions as ke } from "./index207.js";
+const _e = {
+  key: 0,
+  class: "sr-only"
+}, ve = { class: "bb-table-header-row" }, Ce = { class: "bb-table-header__content" }, ge = { class: "bb-table-check__label-text sr-only" }, we = {
+  key: 1,
+  class: "bb-table-radio__label-text sr-only"
+}, Te = { class: "bb-table-header__content" }, Ve = { class: "bb-table-header__content sr-only" }, $e = { class: "bb-table-loading__row" }, Ae = ["colspan"], Be = { class: "bb-table-loading__text sr-only" }, Ne = {
+  class: "bb-table-skeleton__container",
+  role: "status"
+}, Se = { class: "bb-table-no-data__row" }, De = ["colspan"], Le = { class: "bb-table-no-data__text" }, Re = ["onClick", "onContextmenu", "onDblclick"], Ie = { class: "bb-table-check__label-text sr-only" }, ze = { class: "bb-table-radio__label-text sr-only" }, We = /* @__PURE__ */ oe({
+  __name: "BbTable",
   props: {
-    "append:icon": {},
-    autocomplete: {},
-    autofocus: {},
-    autoGrow: { type: Boolean },
-    direction: {},
+    accessibleLabel: { type: Function, default: (N) => ["Seleziona"].concat(N.map((S) => S.content)).join(" ") },
+    actions: { type: Boolean },
+    actionsText: { default: "Azioni" },
+    align: { default: "left" },
+    allowSelectAll: { type: Boolean, default: !0 },
+    caption: {},
+    columns: { default: () => [] },
+    compact: { type: Boolean },
+    dependencies: { default: () => [] },
+    depsDebounceTime: { default: 0 },
     disabled: { type: Boolean },
-    errors: {},
-    hasErrors: { type: Boolean },
-    hideLabel: { type: Boolean },
-    hint: {},
-    id: {},
-    label: {},
-    labelPosition: {},
+    displayCaption: { type: Boolean },
+    fixed: { type: Boolean },
+    fixedColumns: { default: () => [] },
+    fixedHeaders: { type: Boolean },
+    items: { type: [Array, Function], default: () => [] },
+    itemValue: {},
+    legend: {},
     loading: { type: Boolean },
-    modelValue: {},
+    loadingText: { default: "Caricamento" },
+    modelValue: { default: () => [] },
+    multiple: { type: Boolean, default: !0 },
     name: {},
-    persistentHint: { type: Boolean },
-    placeholder: {},
-    "prepend:icon": {},
+    noDataText: { default: "Non ci sono elementi da visualizzare" },
     readonly: {},
-    required: { type: Boolean },
-    reverse: { type: Boolean },
-    rows: {}
+    selectable: { type: [Boolean, Function] },
+    selectAll: { type: Boolean },
+    selectAllLabel: { default: "Seleziona tutti gli elementi di questa pagina" },
+    selectText: { default: "Seleziona un elemento" },
+    tdClass: {},
+    thClass: {}
   },
-  emits: ["blur", "change", "click", "focus", "input", "keydown", "mousedown", "mouseup", "update:modelValue"],
-  setup(t, { emit: u }) {
-    const n = t, o = u, l = y(!1), m = v(() => n.persistentHint || l.value), h = {
-      onBlur: (e) => {
-        l.value = !1, o("blur", e);
+  emits: ["click:row", "contextmenu:row", "dblclick:row", "update:modelValue", "update:selectAll"],
+  setup(N, { emit: S }) {
+    const { getItemValue: P } = me(), D = fe().id.value, a = N, v = S, V = x(), Q = a.accessibleLabel, U = a.loadingText, W = a.noDataText, z = a.selectText, G = y(() => a.selectable ? "fieldset" : "div"), K = x(!1), O = y(() => a.loading || K.value), H = y(() => [!!a.selectable, !!a.actions].reduce(
+      (e, s) => e + +!!s,
+      a.columns.length
+    )), q = y(
+      () => a.columns.reduce(
+        (e, s) => {
+          const l = s.key.split(/\W+/g).join("_");
+          return e[s.key] = l, e;
+        },
+        {}
+      )
+    ), { options: $, selectOption: X, unselectOption: Y, internalItems: E } = ke({
+      emit: v,
+      itemText: void 0,
+      itemValue: a.itemValue,
+      modelValue: B(a, "modelValue"),
+      multiple: a.multiple,
+      resetQueryOnOptionSelected: !1,
+      stash: !1,
+      items: B(a, "items"),
+      enforceCoherence: !0,
+      prefill: !0,
+      modelValueDebounceTime: 0,
+      dependencies: B(a, "dependencies"),
+      depsDebounceTime: a.depsDebounceTime,
+      queryDebounceTime: 0,
+      disabled: B(a, "disabled")
+    }), Z = y(
+      () => a.columns.map((e) => {
+        const s = e.align || "left", { label: l, key: c } = e, g = `header:${q.value[e.key]}`;
+        let t = [`bb-table-header--${s}`];
+        return a.thClass && (t = t.concat(a.thClass)), e.thClass && (t = t.concat(e.thClass)), {
+          align: s,
+          key: c,
+          label: l,
+          slotName: g,
+          classes: t
+        };
+      })
+    ), C = y(() => $.value.map((e) => {
+      let s = !a.selectable;
+      typeof a.selectable == "function" && (s = !a.selectable(e)), s = s || !!e.disabled;
+      const l = a.columns.map((t) => {
+        const i = q.value[t.key], h = t.align || "left", { label: A, key: L } = t;
+        let m = P(e.item, t.key);
+        t.formatter && // By default the formatter runs anyway
+        (!M(m) || t.formatOnNull !== !1) && (m = t.formatter(m, t.key, e.item)), t.placeholder && M(m) && (m = t.placeholder);
+        let b = [`bb-table-data__cell--${h}`];
+        if (a.tdClass)
+          if (typeof a.tdClass == "function") {
+            let k = a.tdClass(m, t.key, e.item);
+            k && (b = b.concat(k));
+          } else b = b.concat(a.tdClass);
+        if (t.tdClass)
+          if (typeof t.tdClass == "function") {
+            let k = t.tdClass(m, t.key, e.item);
+            k && (b = b.concat(k));
+          } else b = b.concat(t.tdClass);
+        return {
+          align: h,
+          classes: b,
+          content: m,
+          key: L,
+          label: A,
+          slotName: i
+        };
+      });
+      return {
+        accessibleLabel: Q(l, e.item),
+        cols: l,
+        onRowClick: (t) => v("click:row", t, e, !!e.selected),
+        onRowContextMenu: (t) => v("contextmenu:row", t, e, !!e.selected),
+        onRowDblClick: (t) => v("dblclick:row", t, e, !!e.selected),
+        item: e.item,
+        text: e.text,
+        valueHash: e.valueHash,
+        value: e.value,
+        selected: e.selected,
+        disabled: s
+      };
+    })), ee = (e) => {
+      let s = e, l = [];
+      s && (l = C.value.reduce((c, g) => (g.disabled || c.push(g.value), c), [])), v("update:modelValue", l), v("update:selectAll", e);
+    }, F = y(
+      () => !!(C.value.length && C.value.filter((e) => !e.disabled).every((e) => e.selected))
+    ), le = y(
+      () => {
+        var e;
+        return C.value.some((s) => !s.selected) && !!((e = a.modelValue) != null && e.length);
+      }
+    ), j = (e) => {
+      e.selected ? Y(e) : X(e);
+    }, te = ye(
+      (e) => typeof e != "string",
+      JSON.stringify
+    ), ae = y(() => [].concat(a.modelValue).map((e) => {
+      const s = te(e);
+      return {
+        disabled: a.disabled,
+        name: a.name,
+        type: "hidden",
+        value: s
+      };
+    })), se = y(() => pe($.value.length, 4, 10));
+    return ne(
+      () => C.value,
+      () => {
+        var e;
+        if (a.fixedColumns.length && a.items && V.value) {
+          const s = Array.from(
+            V.value.querySelectorAll("thead th")
+          ), l = a.fixedColumns.reduce((t, i) => {
+            const h = typeof i == "number" ? i : i.index, A = typeof i == "number" ? "left" : i.position, L = s[h].getBoundingClientRect(), m = Math.floor(L.width), b = t.filter((R) => R.position === A).map((R) => R.width).reduce(ue, 0), k = {
+              index: h,
+              position: A,
+              width: m,
+              offset: b
+            };
+            return t.push(k), t;
+          }, []);
+          Array.from((e = V.value) == null ? void 0 : e.querySelectorAll("tr")).map(
+            (t) => Array.from(
+              t.querySelectorAll(
+                l.map((i) => `:scope > :nth-child(${i.index + 1})`).join(", ")
+              )
+            )
+          ).forEach((t) => {
+            t.forEach((i, h) => {
+              i.style.position = "sticky", l[h].position === "left" ? i.style.left = `${l[h].offset}px` : i.style.right = `${l[h].offset}px`;
+            });
+          });
+        }
       },
-      onChange: (e) => o("change", e),
-      onClick: (e) => o("click", e),
-      onFocus: (e) => {
-        l.value = !0, o("focus", e);
-      },
-      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, q) => (B(), g(V, {
-      id: e.id,
-      class: "bb-textarea",
-      direction: e.direction,
-      errors: e.errors,
-      "has-errors": e.hasErrors,
-      "hide-label": e.hideLabel,
-      hint: e.hint,
-      label: e.label,
-      "label-position": e.labelPosition,
-      "model-value": e.modelValue,
-      name: e.name,
-      reverse: e.reverse,
-      "show-hint": m.value
+      {
+        flush: "post"
+      }
+    ), (e, s) => (n(), de(ce(G.value), {
+      ref_key: "container",
+      ref: V,
+      class: r({
+        "bb-table": !0,
+        [`bb-table--align-${e.align}`]: !0,
+        "bb-table--compact": e.compact,
+        "bb-table--fixed": e.fixed,
+        "bb-table--fixed-header": e.fixedHeaders,
+        "bb-table--loading": O.value,
+        "bb-table--empty": !u($).length,
+        "bb-table--selectable": e.selectable
+      })
     }, {
-      label: r((s) => [
-        a(e.$slots, "label", d(p(s)))
-      ]),
-      input: r(({ id: s, name: b, hasErrors: c, ariaDescribedby: f }) => [
-        $(P, k({
-          id: s,
-          "append:icon": n["append:icon"],
-          "aria-describedby": f,
-          "auto-grow": e.autoGrow,
-          autofocus: e.autofocus,
-          disabled: e.disabled,
-          "has-errors": c,
-          loading: e.loading,
-          "model-value": e.modelValue,
-          name: b,
-          placeholder: e.placeholder,
-          "prepend:icon": n["prepend:icon"],
-          readonly: e.readonly,
-          required: e.required,
-          rows: e.rows
-        }, h), {
-          "append-outer": r(() => [
-            a(e.$slots, "append-outer")
-          ]),
-          append: r(() => [
-            a(e.$slots, "append")
-          ]),
-          prepend: r(() => [
-            a(e.$slots, "prepend")
-          ]),
-          "prepend-outer": r(() => [
-            a(e.$slots, "prepend-outer")
-          ]),
-          prefix: r((i) => [
-            a(e.$slots, "prefix", d(p(i)))
+      default: ie(() => [
+        e.selectable ? (n(), d("legend", _e, p(e.legend), 1)) : _("", !0),
+        o("table", null, [
+          e.caption ? (n(), d("caption", {
+            key: 0,
+            class: r({
+              "bb-table-caption": !0,
+              "sr-only": !e.displayCaption
+            })
+          }, p(e.caption), 3)) : _("", !0),
+          o("thead", null, [
+            f(e.$slots, "thead", {}, () => [
+              o("tr", ve, [
+                e.selectable ? (n(), d("th", {
+                  key: 0,
+                  class: r(["bb-table-header bb-table-header--select", e.thClass]),
+                  scope: "col"
+                }, [
+                  f(e.$slots, "header:select", {
+                    multiple: e.multiple,
+                    selectAll: !!e.selectAll,
+                    text: u(z)
+                  }, () => [
+                    o("span", Ce, [
+                      e.allowSelectAll && e.multiple ? (n(), d("label", {
+                        key: 0,
+                        class: r(["bb-table-check__label", {
+                          "bb-table-check__label--disabled": e.disabled
+                        }])
+                      }, [
+                        I(J, {
+                          class: "bb-table-check",
+                          disabled: e.disabled,
+                          indeterminate: le.value,
+                          "model-value": F.value,
+                          name: `select_all_${e.name || ""}`,
+                          readonly: e.readonly,
+                          "onUpdate:modelValue": ee
+                        }, null, 8, ["disabled", "indeterminate", "model-value", "name", "readonly"]),
+                        o("span", ge, p(e.selectAllLabel), 1)
+                      ], 2)) : e.multiple ? _("", !0) : (n(), d("span", we, p(u(z)), 1))
+                    ])
+                  ])
+                ], 2)) : _("", !0),
+                (n(!0), d(w, null, T(Z.value, (l) => (n(), d("th", {
+                  key: l.key,
+                  class: r(["bb-table-header", l.classes]),
+                  scope: "col"
+                }, [
+                  f(e.$slots, l.slotName, {
+                    classes: l.classes,
+                    item: void 0,
+                    items: u(E),
+                    label: l.label
+                  }, () => [
+                    o("span", Te, p(l.label), 1)
+                  ])
+                ], 2))), 128)),
+                e.actions ? (n(), d("th", {
+                  key: 1,
+                  class: r(["bb-table-header bb-table-header--actions", e.thClass]),
+                  scope: "col"
+                }, [
+                  f(e.$slots, "header:actions", { text: e.actionsText }, () => [
+                    o("span", Ve, p(e.actionsText), 1)
+                  ])
+                ], 2)) : _("", !0)
+              ])
+            ])
           ]),
-          suffix: r((i) => [
-            a(e.$slots, "suffix", d(p(i)))
+          o("tbody", null, [
+            O.value ? f(e.$slots, "loading", {
+              key: 0,
+              items: u(E)
+            }, () => [
+              o("tr", $e, [
+                o("td", {
+                  class: "bb-table-loading__cell",
+                  colspan: H.value
+                }, [
+                  o("span", Be, p(u(U)), 1),
+                  o("div", Ne, [
+                    (n(!0), d(w, null, T(se.value, (l) => (n(), d("div", {
+                      key: l,
+                      class: "bb-table-skeleton-item"
+                    }, s[0] || (s[0] = [
+                      o("div", { class: "bb-table-skeleton-item__avatar-container" }, [
+                        o("div", { class: "bb-table-skeleton-item__avatar" })
+                      ], -1),
+                      o("div", { class: "bb-table-skeleton-item__text" }, [
+                        o("div", { class: "bb-table-skeleton-item__line" }),
+                        o("div", { class: "bb-table-skeleton-item__line" })
+                      ], -1)
+                    ])))), 128))
+                  ])
+                ], 8, Ae)
+              ])
+            ]) : u($).length ? f(e.$slots, "tbody", { key: 2 }, () => [
+              (n(!0), d(w, null, T(C.value, (l) => (n(), d("tr", {
+                key: l.valueHash,
+                class: "bb-table-data__row",
+                onClick: l.onRowClick,
+                onContextmenu: l.onRowContextMenu,
+                onDblclick: l.onRowDblClick
+              }, [
+                e.selectable ? (n(), d("td", {
+                  key: 0,
+                  class: r(["bb-table-data__cell bb-table-data__cell--select", e.tdClass])
+                }, [
+                  f(e.$slots, "select", {
+                    checked: !!l.selected,
+                    disabled: !!l.disabled,
+                    inputName: u(D),
+                    item: l.item,
+                    readonly: !!e.readonly,
+                    value: l.value
+                  }, () => [
+                    e.multiple ? (n(), d("label", {
+                      key: 0,
+                      class: r(["bb-table-check__label", {
+                        "bb-table-check__label--disabled": l.disabled
+                      }])
+                    }, [
+                      I(J, {
+                        checked: l.selected || F.value,
+                        class: "bb-table-check",
+                        disabled: l.disabled,
+                        name: u(D),
+                        readonly: e.readonly,
+                        onChange: () => j(l)
+                      }, null, 8, ["checked", "disabled", "name", "readonly", "onChange"]),
+                      o("span", Ie, p(l.accessibleLabel), 1)
+                    ], 2)) : (n(), d("label", {
+                      key: 1,
+                      class: r(["bb-table-radio__label", {
+                        "bb-table-radio__label--disabled": l.disabled
+                      }])
+                    }, [
+                      I(he, {
+                        checked: l.selected,
+                        class: "bb-table-radio",
+                        disabled: l.disabled,
+                        name: u(D),
+                        readonly: e.readonly,
+                        value: l.value,
+                        onChange: () => j(l)
+                      }, null, 8, ["checked", "disabled", "name", "readonly", "value", "onChange"]),
+                      o("span", ze, p(l.accessibleLabel), 1)
+                    ], 2))
+                  ])
+                ], 2)) : _("", !0),
+                (n(!0), d(w, null, T(l.cols, (c) => (n(), d("td", {
+                  key: c.key,
+                  class: r(["bb-table-data__cell", c.classes])
+                }, [
+                  f(e.$slots, c.slotName, {
+                    classes: c.classes,
+                    content: c.content,
+                    item: l.item,
+                    value: l.value
+                  }, () => [
+                    be(p(c.content), 1)
+                  ])
+                ], 2))), 128)),
+                e.actions ? (n(), d("td", {
+                  key: 1,
+                  class: r(["bb-table__cell bb-table__cell--actions", e.tdClass])
+                }, [
+                  f(e.$slots, "actions", {
+                    item: l.item,
+                    value: l.value
+                  })
+                ], 2)) : _("", !0)
+              ], 40, Re))), 128))
+            ]) : f(e.$slots, "no-data", { key: 1 }, () => [
+              o("tr", Se, [
+                o("td", {
+                  class: "bb-table-no-data__cell",
+                  colspan: H.value
+                }, [
+                  o("span", Le, p(u(W)), 1)
+                ], 8, De)
+              ])
+            ])
           ]),
-          _: 2
-        }, 1040, ["id", "append:icon", "aria-describedby", "auto-grow", "autofocus", "disabled", "has-errors", "loading", "model-value", "name", "placeholder", "prepend:icon", "readonly", "required", "rows"])
+          o("tfoot", null, [
+            f(e.$slots, "tfoot")
+          ])
+        ]),
+        (n(!0), d(w, null, T(ae.value, (l) => (n(), d("input", re({
+          key: l.value,
+          ref_for: !0
+        }, l), null, 16))), 128))
       ]),
       _: 3
-    }, 8, ["id", "direction", "errors", "has-errors", "hide-label", "hint", "label", "label-position", "model-value", "name", "reverse", "show-hint"]));
+    }, 8, ["class"]));
   }
 });
 export {
-  M as default
+  We as default
 };