bitboss-ui 2.1.10 → 2.1.12

package/dist/index260.js

@@ -1,199 +1,252 @@
-import { defineComponent as j, ref as c, onMounted as J, watch as Q, createElementBlock as S, openBlock as _, createElementVNode as w, createTextVNode as A, createCommentVNode as E, toDisplayString as C, unref as x } from "vue";
-import { hexToRgb as B } from "./index335.js";
-import { getHueFromRGB as K } from "./index336.js";
-import { hslToHex as y } from "./index337.js";
-import { useLocale as Z } from "./index219.js";
-const ee = {
-  id: "mainCanvasDesc",
-  "aria-live": "polite",
-  class: "sr-only"
-}, te = { key: 0 }, ae = {
-  id: "hueCanvasDesc",
-  "aria-live": "polite",
-  class: "sr-only"
-}, ne = { key: 0 }, ce = /* @__PURE__ */ j({
-  __name: "ColorPallette",
+import { defineComponent as le, ref as A, computed as _, watch as ce, createElementBlock as c, openBlock as u, withKeys as f, normalizeClass as k, withModifiers as p, createVNode as ue, withCtx as fe, createElementVNode as M, Fragment as O, renderList as S, toDisplayString as C, renderSlot as L, nextTick as pe } from "vue";
+import { chunk as be } from "./index337.js";
+import { identity as T } from "./index215.js";
+import { isNotNil as me } from "./index140.js";
+import { last as ge } from "./index217.js";
+import { sort as E } from "./index338.js";
+import b from "./index209.js";
+import he from "./index263.js";
+const ye = ["onKeydown"], _e = { class: "bb-base-date-picker__header-container" }, ke = ["abbr"], Oe = ["id", "disabled", "tabindex"], Ce = /* @__PURE__ */ le({
+  __name: "BaseDatePickerInputDaySelector",
   props: {
-    modelValue: {}
+    cursor: {},
+    current: { type: Boolean },
+    disabled: { type: Boolean },
+    firstDayOfWeek: {},
+    id: {},
+    modelValue: {},
+    max: {},
+    min: {},
+    selectable: { type: Function },
+    range: { type: Boolean },
+    multiple: { type: Boolean },
+    readonly: { type: Boolean }
   },
-  emits: ["update:modelValue"],
-  setup(F, { emit: N }) {
-    const R = F, f = N, { t: h } = Z(), o = c(R.modelValue), d = c(
-      y(K(...B(o.value ?? "#ff0000")), 100, 50)
-    ), O = c(null), s = c(null), r = c(null), l = c({ x: 0, y: 0 }), u = c({ x: 0 }), b = c(!1), k = c(!1), T = () => {
-      const e = s.value, t = r.value;
-      !e || !t || (e.width = e.offsetWidth, e.height = e.offsetHeight, t.width = t.offsetWidth, t.height = t.offsetHeight, v(), m());
-    }, D = () => {
-      const e = s.value;
-      return e ? e.getContext("2d", { willReadFrequently: !0 }) : null;
-    }, v = () => {
-      const e = s.value;
-      if (!e) return;
-      const t = D();
-      if (!t) return;
-      t.clearRect(0, 0, e.width, e.height);
-      const a = t.createLinearGradient(0, 0, e.width, 0);
-      a.addColorStop(0, d.value), a.addColorStop(1, "#ffffff");
-      const n = t.createLinearGradient(0, 0, 0, e.height);
-      n.addColorStop(0, "transparent"), n.addColorStop(1, "#000000"), t.fillStyle = a, t.fillRect(0, 0, e.width, e.height), t.fillStyle = n, t.globalCompositeOperation = "multiply", t.fillRect(0, 0, e.width, e.height), t.globalCompositeOperation = "source-over", t.fillStyle = "#000000", t.strokeStyle = "#000000", t.lineWidth = 1;
-    }, p = () => {
-      const e = D();
-      e && (e.beginPath(), e.arc(
-        l.value.x,
-        l.value.y,
-        8,
-        0,
-        2 * Math.PI
-      ), e.strokeStyle = "#ffffff", e.lineWidth = 2, e.stroke(), e.beginPath(), e.arc(
-        l.value.x,
-        l.value.y,
-        7,
-        0,
-        2 * Math.PI
-      ), e.strokeStyle = "#000000", e.lineWidth = 1, e.stroke(), e.globalCompositeOperation = "source-over");
-    }, P = () => {
-      const e = r.value;
-      return e ? e.getContext("2d", { willReadFrequently: !0 }) : null;
-    }, m = () => {
-      const e = r.value;
-      if (!e) return;
-      const t = P();
-      if (!t) return;
-      const a = t.createLinearGradient(0, 0, e.width, 0);
-      for (let n = 0; n <= 360; n += 60)
-        a.addColorStop(n / 360, `hsl(${n}, 100%, 50%)`);
-      a.addColorStop(1, "hsl(360, 100%, 50%)"), t.fillStyle = a, t.fillRect(0, 0, e.width, e.height), H(), t.fillStyle = "#000000", t.strokeStyle = "#000000", t.lineWidth = 1;
-    }, H = () => {
-      const e = r.value;
-      if (!e) return;
-      const t = P();
-      if (!t) return;
-      const a = 10, n = 16, i = u.value.x - a / 2, M = e.height / 2 - n / 2;
-      t.beginPath(), t.roundRect(i, M, a, n, 2), t.strokeStyle = "lightgray", t.stroke(), t.fillStyle = "#ffffff", t.fill();
-    }, q = (e) => {
-      s.value && (window.addEventListener("pointermove", L), window.addEventListener("pointerup", G), b.value = !0, I(e));
+  emits: ["update:modelValue", "update:cursor"],
+  setup(N, { emit: x }) {
+    const a = N, s = x, g = A(null), R = b().startOf("day"), m = _(() => {
+      let e = 1 / 0, r = -1 / 0, o = {};
+      return a.modelValue && [].concat(a.modelValue).filter(T).map((i) => b(i).startOf("day")).map((i) => i.valueOf()).forEach((i, h) => {
+        i < e && (e = i), i > r && (r = i), o[i] = h;
+      }), {
+        min: e,
+        max: r,
+        index: (t) => o[t.valueOf()],
+        selected: (t) => me(o[t.valueOf()]),
+        isFirstOfRange: (t) => t.valueOf() === e,
+        isLastOfRange: (t) => t.valueOf() === r,
+        isBetween: (t) => t.valueOf() > e && t.valueOf() < r
+      };
+    }), K = _(() => new Array(7).fill("").map((e, r) => b().day((r + a.firstDayOfWeek) % 7)).map((e) => ({
+      accessibleLabel: e.format("dddd"),
+      label: e.format("dd").slice(0, 1).toUpperCase(),
+      id: e.toISOString(),
+      original: e
+    }))), v = _(() => {
+      const e = a.cursor.year().toString(), r = a.cursor.month().toString();
+      let t = a.cursor.clone().startOf("month").clone().startOf("week"), h = a.cursor.clone().endOf("month").clone().endOf("week"), Z = b(a.cursor).startOf("day"), D = [];
+      for (let n = t; n.isBefore(h); n = n.add(1, "day"))
+        D.push(n.clone());
+      const ee = D.map((n) => {
+        const y = n.toISOString(), te = n.week().toString();
+        let re = m.value.selected(n);
+        const B = a.range && m.value.isFirstOfRange(n), I = a.range && m.value.isLastOfRange(n), ae = a.range && !B && !I && m.value.isBetween(n), oe = n.month().toString() === r && n.year().toString() === e, ne = n.isSame(R), se = n.isSame(Z), ie = d(n), de = n.get("D").toString();
+        return {
+          buttonId: [a.id, y].filter(T).join("_"),
+          current: se,
+          disabled: ie,
+          first: B,
+          highlighted: oe,
+          id: y,
+          label: de,
+          last: I,
+          middle: ae,
+          original: n,
+          selected: re,
+          slotName: y,
+          today: ne,
+          week: te
+        };
+      });
+      return be(ee, 7);
+    }), d = (e) => {
+      let r = !0;
+      return a.min && r && (r = e.isSameOrAfter(b(a.min).startOf("day"))), a.max && r && (r = e.isSameOrBefore(b(a.max).startOf("day"))), typeof a.selectable == "function" && r && (r = a.selectable(e.toDate())), !r;
+    }, w = A("left"), F = (e, r) => {
+      e && r && (w.value = e.isBefore(r) ? "left" : "right");
+    };
+    ce(
+      () => a.cursor,
+      (e, r) => {
+        F(e, r);
+      }
+    );
+    const V = (e) => s("update:cursor", e), l = async () => {
+      if (!g.value) return;
+      await pe();
+      const e = ge([
+        ...g.value.querySelectorAll(
+          ".bb-base-date-picker__date--current button"
+        )
+      ]);
+      e instanceof HTMLElement && e.focus();
+    }, H = (e) => {
+      if (!a.readonly && e.target instanceof HTMLButtonElement) {
+        const [, r] = e.target.id.split("_"), o = b(r);
+        if (a.cursor.month() !== o.month()) {
+          V(o);
+          return;
+        }
+        const t = v.value.flat().find((i) => i.id === r);
+        if (t.disabled) return;
+        V(o), P(t);
+      }
+    }, P = (e) => {
+      a.range ? U(e) : a.multiple ? j(e) : W(e);
     }, U = (e) => {
-      r.value && (window.addEventListener("pointermove", L), window.addEventListener("pointerup", G), k.value = !0, V(e));
-    }, I = (e) => {
-      const t = s.value;
-      if (!t) return;
-      const a = t.getBoundingClientRect(), n = Math.max(0, Math.min(t.width, e.clientX - a.left)), i = Math.max(0, Math.min(t.height, e.clientY - a.top));
-      l.value = { x: n, y: i }, v(), p(), o.value = g(), f("update:modelValue", o.value);
-    }, V = (e) => {
-      const t = r.value;
-      if (!t) return;
-      const a = t.getBoundingClientRect(), n = Math.max(0, Math.min(t.width, e.clientX - a.left));
-      u.value = { x: n };
-      const i = n / t.width * 360;
-      d.value = y(i, 100, 50), m(), v(), p(), o.value = g(), f("update:modelValue", o.value);
-    }, L = (e) => {
-      b.value ? I(e) : k.value && V(e);
+      if (!Array.isArray(a.modelValue)) return;
+      const r = e.original.toISOString();
+      if (a.modelValue.length !== 1) s("update:modelValue", [r]);
+      else {
+        const o = E([a.modelValue[0], e.original.toISOString()]);
+        s("update:modelValue", o);
+      }
+    }, j = (e) => {
+      if (Array.isArray(a.modelValue))
+        if (e.selected) {
+          const r = e.original.toISOString(), o = a.modelValue.filter((t) => t !== r);
+          s("update:modelValue", o);
+        } else {
+          const r = E([...a.modelValue, e.original.toISOString()]);
+          s("update:modelValue", r);
+        }
+    }, W = (e) => {
+      e.selected ? s("update:modelValue", null) : s("update:modelValue", e.original.toISOString());
+    }, $ = () => {
+      const e = a.cursor.clone().add(1, "day");
+      d(e) || (s("update:cursor", e), l());
+    }, q = () => {
+      const e = a.cursor.clone().subtract(1, "day");
+      d(e) || (s("update:cursor", e), l());
+    }, z = () => {
+      const e = a.cursor.clone().subtract(1, "week");
+      d(e) || (s("update:cursor", e), l());
     }, G = () => {
-      b.value = !1, k.value = !1;
+      const e = a.cursor.clone().add(1, "week");
+      d(e) || (s("update:cursor", e), l());
+    }, J = () => {
+      const e = a.cursor.clone().endOf("week");
+      d(e) || (s("update:cursor", e), l());
+    }, Q = () => {
+      const e = a.cursor.clone().startOf("week");
+      d(e) || (s("update:cursor", e), l());
     }, X = (e) => {
-      var a, n;
-      switch (e.key) {
-        case "ArrowUp":
-          l.value.y = Math.max(0, l.value.y - 5);
-          break;
-        case "ArrowDown":
-          l.value.y = Math.min(
-            ((a = s.value) == null ? void 0 : a.height) ?? 0,
-            l.value.y + 5
-          );
-          break;
-        case "ArrowLeft":
-          l.value.x = Math.max(0, l.value.x - 5);
-          break;
-        case "ArrowRight":
-          l.value.x = Math.min(
-            ((n = s.value) == null ? void 0 : n.width) ?? 0,
-            l.value.x + 5
-          );
-          break;
-        default:
-          return;
+      if (e.shiftKey) {
+        const r = a.cursor.clone().subtract(1, "year");
+        if (d(r)) return;
+        s("update:cursor", r);
+      } else {
+        const r = a.cursor.clone().subtract(1, "month");
+        if (d(r)) return;
+        s("update:cursor", r);
       }
-      v(), p(), o.value = g(), f("update:modelValue", o.value), e.preventDefault();
-    }, $ = (e) => {
-      var n, i;
-      switch (e.key) {
-        case "ArrowLeft":
-          u.value.x = Math.max(0, u.value.x - 5);
-          break;
-        case "ArrowRight":
-          u.value.x = Math.min(
-            ((n = r.value) == null ? void 0 : n.width) ?? 0,
-            u.value.x + 5
-          );
-          break;
-        default:
-          return;
+      l();
+    }, Y = (e) => {
+      if (e.shiftKey) {
+        const r = a.cursor.clone().add(1, "year");
+        if (d(r)) return;
+        s("update:cursor", r);
+      } else {
+        const r = a.cursor.clone().add(1, "month");
+        if (d(r)) return;
+        s("update:cursor", r);
       }
-      const a = u.value.x / (((i = r.value) == null ? void 0 : i.width) ?? 1) * 360;
-      d.value = y(a, 100, 50), m(), H(), v(), p(), o.value = g(), f("update:modelValue", o.value), e.preventDefault();
-    };
-    J(() => {
-      T(), W(o.value ?? "#ff0000");
-    }), Q(
-      () => R.modelValue,
-      (e) => {
-        !e || e === o.value || (o.value = e, W(e), m(), v());
-      }
-    );
-    const g = () => {
-      const e = s.value;
-      if (!e) return "#ffffff";
-      const t = e.getContext("2d");
-      if (!t) return "#ffffff";
-      const { x: a, y: n } = l.value, i = t.getImageData(a, n, 1, 1).data, [M, z, Y] = i;
-      return `#${((1 << 24) + (M << 16) + (z << 8) + Y).toString(16).slice(1)}`;
+      l();
     };
-    function W(e) {
-      var a;
-      const t = K(...B(e));
-      d.value = y(t, 100, 50), u.value.x = t / 360 * (((a = r.value) == null ? void 0 : a.width) ?? 0);
-    }
-    return (e, t) => (_(), S("div", {
-      ref_key: "paletteRef",
-      ref: O,
-      "aria-label": "Color Picker",
-      class: "bb-color-palette",
-      role: "application"
+    return (e, r) => (u(), c("div", {
+      ref_key: "calendar",
+      ref: g,
+      class: k(["bb-base-date-picker__days-selector", { "bb-base-date-picker__days-selector--hidden": !e.current }]),
+      onKeydown: [
+        f(p(G, ["prevent"]), ["down"]),
+        f(p(J, ["prevent"]), ["end"]),
+        f(p(Q, ["prevent"]), ["home"]),
+        f(p(q, ["prevent"]), ["left"]),
+        f(p(Y, ["prevent"]), ["page-down"]),
+        f(p(X, ["prevent"]), ["page-up"]),
+        f(p($, ["prevent"]), ["right"]),
+        f(p(z, ["prevent"]), ["up"])
+      ]
     }, [
-      w("canvas", {
-        ref_key: "mainCanvasRef",
-        ref: s,
-        "aria-describedby": "mainCanvasDesc",
-        "aria-label": "Main Color Selection",
-        class: "bb-color-palette__canvas",
-        role: "application",
-        tabindex: "0",
-        onKeydown: X,
-        onPointerdown: q
-      }, null, 544),
-      w("p", ee, [
-        A(C(x(h)("colorInput.mainCanvasDesc")) + " ", 1),
-        o.value ? (_(), S("span", te, C(x(h)("colorInput.mainCanvasSelectedColor", o.value)), 1)) : E("", !0)
-      ]),
-      w("canvas", {
-        ref_key: "hueCanvasRef",
-        ref: r,
-        "aria-describedby": "hueCanvasDesc",
-        "aria-label": "Hue Selection",
-        class: "bb-color-palette__hue-canvas",
-        role: "application",
-        tabindex: "0",
-        onKeydown: $,
-        onPointerdown: U
-      }, null, 544),
-      w("p", ae, [
-        A(C(x(h)("colorInput.hueCanvasDesc")) + " ", 1),
-        d.value ? (_(), S("span", ne, C(x(h)("colorInput.hueCanvasSelectedHue", d.value)), 1)) : E("", !0)
-      ])
-    ], 512));
+      ue(he, {
+        direction: w.value,
+        gap: 30
+      }, {
+        default: fe(() => [
+          (u(), c("div", {
+            key: e.cursor.month().toString(),
+            class: "bb-base-date-picker__month"
+          }, [
+            M("div", _e, [
+              (u(!0), c(O, null, S(K.value, (o) => (u(), c("div", {
+                key: o.id,
+                abbr: o.accessibleLabel,
+                class: "bb-base-date-picker__header-cell"
+              }, C(o.label), 9, ke))), 128))
+            ]),
+            (u(!0), c(O, null, S(v.value, (o) => (u(), c("div", {
+              key: o[0].id,
+              class: "bb-base-date-picker__week"
+            }, [
+              (u(!0), c(O, null, S(o, (t) => (u(), c("div", {
+                key: t.id,
+                class: k({
+                  "bb-base-date-picker__date--current": t.current,
+                  "bb-base-date-picker__date--disabled": e.disabled || t.disabled,
+                  "bb-base-date-picker__date--first": t.first,
+                  "bb-base-date-picker__date--highlighted": t.highlighted,
+                  "bb-base-date-picker__date--last": t.last,
+                  "bb-base-date-picker__date--middle": t.middle,
+                  "bb-base-date-picker__date--selected": t.selected,
+                  "bb-base-date-picker__date--today": t.today,
+                  "bb-base-date-picker__date": !0
+                })
+              }, [
+                M("button", {
+                  id: t.buttonId,
+                  class: k("bb-base-date-picker__date-button"),
+                  disabled: e.disabled || t.disabled,
+                  tabindex: Number(t.current) - 1,
+                  type: "button",
+                  onClick: H
+                }, C(t.label), 9, Oe),
+                L(e.$slots, "day", {
+                  first: t.first,
+                  highlighted: t.highlighted,
+                  item: t.original,
+                  label: t.label,
+                  last: t.last,
+                  middle: t.middle,
+                  selected: t.selected
+                }),
+                L(e.$slots, t.slotName, {
+                  first: t.first,
+                  highlighted: t.highlighted,
+                  item: t.original,
+                  label: t.label,
+                  last: t.last,
+                  middle: t.middle,
+                  selected: t.selected
+                })
+              ], 2))), 128))
+            ]))), 128))
+          ]))
+        ]),
+        _: 3
+      }, 8, ["direction"])
+    ], 42, ye));
   }
 });
 export {
-  ce as default
+  Ce as default
 };

package/dist/index261.js

@@ -0,0 +1,54 @@
+import { defineComponent as p, ref as b, watch as _, computed as m, createElementBlock as d, openBlock as c, normalizeClass as u, createElementVNode as t, createVNode as h, withCtx as f, toDisplayString as o } from "vue";
+import k from "./index263.js";
+const y = { class: "bb-base-date-picker__year-container" }, v = {
+  "aria-live": "polite",
+  class: "bb-base-date-picker__selected-day-label"
+}, B = { class: "bb-base-date-picker__weekday" }, D = { class: "bb-base-date-picker__monthday" }, M = { class: "bb-base-date-picker__month-button" }, C = /* @__PURE__ */ p({
+  __name: "BaseDatePickerHeader",
+  props: {
+    cursor: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  emits: ["mode:year", "mode:month"],
+  setup(n) {
+    const s = n, r = b("top"), l = (e, a) => {
+      e && a && (r.value = e.isBefore(a) ? "top" : "bottom");
+    };
+    _(
+      () => s.cursor,
+      (e, a) => {
+        l(e, a);
+      }
+    );
+    const i = m(() => s.cursor.format("YYYY"));
+    return (e, a) => (c(), d("div", {
+      class: u(["bb-base-date-picker__header", { "bb-base-date-picker__header--hidden": e.hidden }])
+    }, [
+      t("div", y, [
+        h(k, {
+          direction: r.value,
+          duration: 500,
+          gap: 30
+        }, {
+          default: f(() => [
+            (c(), d("span", {
+              key: i.value,
+              "aria-live": "polite",
+              class: "bb-base-date-picker__year-button"
+            }, o(i.value), 1))
+          ]),
+          _: 1
+        }, 8, ["direction"])
+      ]),
+      t("div", v, [
+        t("span", B, o(e.cursor.format("ddd")) + ", ", 1),
+        t("span", D, o(e.cursor.format("DD")), 1),
+        t("span", M, o(e.cursor.format("MMMM")), 1)
+      ])
+    ], 2));
+  }
+});
+export {
+  C as default
+};

package/dist/index262.js

@@ -1,5 +1,46 @@
-import r from "./index319.js";
-const t = r;
+import { defineComponent as _, computed as a, createElementBlock as c, openBlock as o, createElementVNode as p, Fragment as b, renderList as h, createBlock as k, normalizeClass as f, withCtx as y, createTextVNode as x, toDisplayString as B } from "vue";
+import C from "./index13.js";
+/* empty css        */
+const M = { class: "bb-base-date-picker__button-menu bb-base-date-picker__month-selector" }, v = { class: "content" }, E = /* @__PURE__ */ _({
+  __name: "BaseDatePickerMonthSelector",
+  props: {
+    cursor: {},
+    disabled: { type: Boolean }
+  },
+  emits: ["update:month"],
+  setup(l, { emit: d }) {
+    const s = l, m = d, i = a(() => s.cursor.month()), u = a(
+      () => new Array(12).fill(0).map((r, t) => {
+        const n = s.cursor.clone().startOf("year").add(t, "month");
+        return {
+          text: n.format("MMMM"),
+          key: n.unix(),
+          selected: n.month() === i.value,
+          handler: () => m("update:month", t)
+        };
+      })
+    );
+    return (r, t) => (o(), c("div", M, [
+      p("div", v, [
+        (o(!0), c(b, null, h(u.value, (e) => (o(), k(C, {
+          key: e.key,
+          class: f({
+            content__btn: !0,
+            "content__btn--selected": e.selected
+          }),
+          disabled: r.disabled,
+          type: "button",
+          onClick: e.handler
+        }, {
+          default: y(() => [
+            x(B(e.text), 1)
+          ]),
+          _: 2
+        }, 1032, ["class", "disabled", "onClick"]))), 128))
+      ])
+    ]));
+  }
+});
 export {
-  t as deburr
+  E as default
 };

package/dist/index263.js

@@ -1,15 +1,7 @@
-const c = (t, r) => {
-  if (typeof t == "string") {
-    const e = /^(\d+)([a-zA-Z%]+)?$/, n = t.match(e);
-    if (n) {
-      const [, o, a] = n;
-      return a ? t : o + "px";
-    } else if (t in r)
-      return r[t] + "px";
-    throw new Error(`Invalid size: ${t}`);
-  }
-  return t + "px";
-};
+import o from "./index318.js";
+/* empty css         */
+import t from "./index294.js";
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-8c6b13bd"]]);
 export {
-  c as parseSize
+  m as default
 };