maz-ui 3.50.1 → 4.0.0-alpha.2

package/dist/chunks/MazPickerShortcuts.BB98CX9u.js

@@ -0,0 +1,62 @@
+import { defineComponent as h, ref as f, watch as i, openBlock as l, createElementBlock as n, Fragment as v, renderList as y, createBlock as _, normalizeClass as k, withModifiers as S, withCtx as b, createTextVNode as z, toDisplayString as B } from "vue";
+import g from "../components/MazBtn.js";
+import { _ as x } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import '../assets/MazPickerShortcuts.B1ASAi7L.css';const C = { class: "maz-picker-shortcuts" }, q = /* @__PURE__ */ h({
+  __name: "MazPickerShortcuts",
+  props: {
+    color: { type: String, required: !0 },
+    modelValue: {
+      type: [String, Object],
+      default: void 0
+    },
+    shortcuts: {
+      type: Array,
+      required: !0
+    },
+    double: { type: Boolean, required: !0 },
+    shortcut: { type: String, default: void 0 },
+    disabled: { type: Boolean, required: !0 }
+  },
+  emits: ["update:model-value"],
+  setup(c, { emit: d }) {
+    const r = c, m = d, s = f(r.shortcut);
+    function u(o, e) {
+      s.value = e, m("update:model-value", o);
+    }
+    return i(
+      () => r.modelValue,
+      (o) => {
+        const e = o;
+        e != null && e.end || (s.value = void 0);
+      }
+    ), i(
+      () => r.shortcut,
+      (o) => {
+        const e = r.shortcuts.find(({ identifier: t }) => o === t);
+        if (e) {
+          const { value: t, identifier: a } = e;
+          u(t, a);
+        }
+      },
+      { immediate: !0 }
+    ), (o, e) => (l(), n("div", C, [
+      (l(!0), n(v, null, y(c.shortcuts, ({ identifier: t, label: a, value: p }) => (l(), _(g, {
+        key: t,
+        type: "button",
+        size: "sm",
+        disabled: c.disabled,
+        color: t === s.value ? r.color : "transparent",
+        class: k({ "--is-selected": t === s.value }),
+        onClick: S((w) => u(p, t), ["stop"])
+      }, {
+        default: b(() => [
+          z(B(a), 1)
+        ]),
+        _: 2
+      }, 1032, ["disabled", "color", "class", "onClick"]))), 128))
+    ]));
+  }
+}), j = /* @__PURE__ */ x(q, [["__scopeId", "data-v-f132e466"]]);
+export {
+  j as default
+};

package/dist/chunks/MazPickerTime.wPLppaUp.js

@@ -0,0 +1,189 @@
+import { defineComponent as W, computed as l, ref as x, watch as B, nextTick as h, openBlock as d, createElementBlock as _, normalizeClass as g, Fragment as w, renderList as M, createElementVNode as b, normalizeStyle as S, createBlock as E, withModifiers as G, withCtx as J, createTextVNode as K, toDisplayString as Q } from "vue";
+import R from "../components/MazBtn.js";
+import { f as $, s as U } from "./MazPicker.qrjLr1LC.js";
+import s from "dayjs";
+import { _ as X } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import '../assets/MazPickerTime.5J3qaKGo.css';const Y = { class: "m-picker-time__column__items" }, Z = /* @__PURE__ */ W({
+  __name: "MazPickerTime",
+  props: {
+    modelValue: {
+      type: [String, Object],
+      default: void 0
+    },
+    calendarDate: { type: String, required: !0 },
+    formatterOptions: {
+      type: Object,
+      required: !0
+    },
+    locale: { type: String, required: !0 },
+    color: { type: String, required: !0 },
+    isOpen: { type: Boolean, required: !0 },
+    hasDate: { type: Boolean, required: !0 },
+    minuteInterval: { type: Number, required: !0 },
+    disabledHours: { type: Array, default: void 0 },
+    format: { type: String, required: !0 },
+    isHour12: { type: Boolean, required: !0 },
+    minDate: { type: String, default: void 0 },
+    maxDate: { type: String, default: void 0 },
+    disabled: { type: Boolean, required: !0 }
+  },
+  emits: ["update:model-value"],
+  setup(f, { emit: P }) {
+    const a = f, T = P, o = l({
+      get: () => a.modelValue,
+      set: (e) => {
+        T("update:model-value", e);
+      }
+    }), z = l(() => Array.from({ length: a.isHour12 ? 12 : 24 }, (e, t) => t).map((e) => {
+      const t = e + (a.isHour12 ? 1 : 0), r = j(t), u = s(o.value).set("hour", r), i = I(r) || (a.minDate && o.value ? s(a.minDate).isAfter(u, "hour") : !1) || (a.maxDate && o.value ? s(a.maxDate).isBefore(u, "hour") : !1);
+      return {
+        label: `${t < 10 ? "0" : ""}${t}`,
+        value: s(o.value).set("hour", r),
+        isDisabled: i
+      };
+    })), H = l(() => {
+      const e = Math.floor(60 / a.minuteInterval) - 0;
+      return Array.from({ length: e }, (t, r) => r * a.minuteInterval).map((t) => {
+        const r = s(o.value).set("minute", t), u = (a.minDate && o.value ? s(a.minDate).isAfter(r, "minute") : !1) || (a.maxDate && o.value ? s(a.maxDate).isBefore(r, "minute") : !1);
+        return {
+          label: `${t < 10 ? "0" : ""}${t}`,
+          value: r,
+          isDisabled: u
+        };
+      });
+    }), v = l(() => typeof o.value == "string" ? V(s(o.value).get("hour")) : void 0), A = l(
+      () => typeof o.value == "string" ? $(
+        H.value.map(({ value: e }) => e.get("minute")),
+        s(o.value).get("minute")
+      ) : void 0
+    ), y = l(() => typeof v.value == "number" ? v.value >= 12 ? "pm" : "am" : void 0), C = l(
+      () => a.isHour12 ? [
+        { label: "AM", value: "am" },
+        { label: "PM", value: "pm" }
+      ] : []
+    ), N = l(() => {
+      const e = [
+        {
+          identifier: "hour",
+          values: z.value
+        },
+        {
+          identifier: "minute",
+          values: H.value
+        }
+      ];
+      return a.isHour12 && e.push({
+        identifier: "ampm",
+        values: C.value
+      }), e;
+    });
+    function V(e) {
+      if (!a.disabledHours)
+        return e;
+      const t = Array.from({ length: 24 }, (u, i) => i).filter(
+        (u) => {
+          var i;
+          return !((i = a.disabledHours) != null && i.includes(u)) || !0;
+        }
+      ), r = $(t, e);
+      return r !== e && q("hour", s(o.value).set("hour", r)), r;
+    }
+    const n = x(), m = x();
+    function j(e) {
+      if (a.isHour12) {
+        const r = y.value === "pm" ? e + 12 : e;
+        return r === 12 ? 0 : r === 24 ? 12 : r;
+      } else
+        return e;
+    }
+    B(
+      () => a.isOpen,
+      async (e) => {
+        var t;
+        if (e) {
+          if (await h(), n.value) {
+            const r = n.value.querySelector(
+              ".m-picker-time__column .m-btn"
+            ), u = r == null ? void 0 : r.offsetHeight, c = ((t = n.value) == null ? void 0 : t.offsetHeight) / 2 - u / 2;
+            m.value = c / 16;
+          }
+          k(!1);
+        }
+      },
+      { immediate: !0 }
+    ), B(
+      () => a.modelValue,
+      async (e, t) => {
+        e !== t && (await h(), k(!0));
+      },
+      { immediate: !0 }
+    );
+    function k(e) {
+      p("hour", e), p("minute", e), a.isHour12 && p("ampm", e);
+    }
+    function I(e) {
+      return (a.disabledHours && a.disabledHours.includes(e)) ?? !1;
+    }
+    function D(e, t) {
+      return t === "am" || t === "pm" ? y.value === t : e === "hour" ? v.value === t.get(e) : e === "minute" ? A.value === t.get(e) : !1;
+    }
+    async function p(e, t = !0) {
+      if (n.value) {
+        const r = n.value.querySelector(`.m-picker-time__column__${e}`), u = n.value.querySelector(
+          `.m-picker-time__column__${e} .--is-selected`
+        );
+        m.value && r && u && n.value && (await h(), U(r, u, m.value * 16, t));
+      }
+    }
+    async function q(e, t) {
+      const r = s(o.value);
+      if (e === "hour" && typeof t == "object" && (o.value = r.set("hour", t.get("hour")).format()), e === "minute" && typeof t == "object") {
+        const u = r.set("minute", t.get("minute"));
+        o.value = u.format();
+      }
+      if (e === "ampm" && (y.value !== t || !v.value) && (t === "am" && (o.value = r.set("hour", r.get("hour")).subtract(12, "hour").format()), t === "pm")) {
+        const u = r.get("hour"), i = u + 12 > 12 && u + 12 < 24 ? u + 12 : u === 0 ? 12 : u;
+        o.value = r.set("hour", i).format();
+      }
+      await h(), p(e);
+    }
+    return (e, t) => (d(), _("div", {
+      ref_key: "MazPickerTime",
+      ref: n,
+      class: g(["m-picker-time", { "--has-date": f.hasDate }])
+    }, [
+      (d(!0), _(w, null, M(N.value, ({ values: r, identifier: u }, i) => (d(), _("div", {
+        key: i,
+        class: g(["m-picker-time__column", [`m-picker-time__column__${u}`]])
+      }, [
+        b("div", {
+          style: S({ height: `${m.value}rem` }),
+          class: "m-picker-time__column__divider"
+        }, null, 4),
+        b("div", Y, [
+          (d(!0), _(w, null, M(r, ({ value: c, label: O, isDisabled: L }, F) => (d(), E(R, {
+            key: F,
+            size: "xs",
+            color: D(u, c) ? f.color : "transparent",
+            class: g({ "--is-selected": D(u, c) }),
+            disabled: L || f.disabled,
+            type: "button",
+            onClick: G((ee) => q(u, c), ["stop"])
+          }, {
+            default: J(() => [
+              K(Q(O), 1)
+            ]),
+            _: 2
+          }, 1032, ["color", "class", "disabled", "onClick"]))), 128))
+        ]),
+        b("div", {
+          style: S({ height: `${m.value}rem` }),
+          class: "m-picker-time__column__divider"
+        }, null, 4)
+      ], 2))), 128))
+    ], 2));
+  }
+}), ie = /* @__PURE__ */ X(Z, [["__scopeId", "data-v-498c1952"]]);
+export {
+  ie as default
+};

package/dist/chunks/MazPickerYearSwitcher.DEZEMpA9.js

@@ -0,0 +1,96 @@
+import { defineComponent as b, ref as C, computed as w, openBlock as d, createElementBlock as _, createElementVNode as u, createVNode as o, withModifiers as l, withCtx as i, unref as s, Fragment as D, renderList as S, createBlock as Y, normalizeClass as B, createTextVNode as M, toDisplayString as q } from "vue";
+import m from "../components/MazBtn.js";
+import { i as y } from "./MazPicker.qrjLr1LC.js";
+import { date as I } from "../filters/date.js";
+import z from "./chevron-left.njfuF_Vt.js";
+import N from "./x-mark.DTWA3lfG.js";
+import c from "dayjs";
+import { _ as V } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import '../assets/MazPickerYearSwitcher.Bt0efux6.css';const E = { class: "maz-picker-year-switcher" }, L = { class: "maz-picker-year-switcher__header" }, P = { class: "maz-flex maz-space-x-2" }, T = { class: "maz-picker-year-switcher__main" }, $ = /* @__PURE__ */ b({
+  __name: "MazPickerYearSwitcher",
+  props: {
+    color: { type: String, required: !0 },
+    locale: { type: String, required: !0 },
+    calendarDate: { type: String, required: !0 }
+  },
+  emits: ["update:calendar-date", "close"],
+  setup(n, { emit: v }) {
+    const p = n, f = v, t = C(p.calendarDate), k = w(() => Array.from({ length: 15 }, (a, r) => r - 7).map((a) => {
+      const r = c(t.value).get("year"), e = c(t.value).set("year", r + a);
+      return {
+        label: I(e.format(), p.locale, {
+          year: "numeric"
+        }),
+        date: e
+      };
+    }));
+    function h(a) {
+      f("update:calendar-date", c(a).format()), f("close");
+    }
+    function x() {
+      t.value = c(t.value).subtract(7, "year").format();
+    }
+    function g() {
+      t.value = c(t.value).add(7, "year").format();
+    }
+    return (a, r) => (d(), _("div", E, [
+      u("div", L, [
+        u("div", P, [
+          o(m, {
+            size: "xs",
+            color: "transparent",
+            type: "button",
+            onClick: l(x, ["stop"])
+          }, {
+            default: i(() => [
+              o(s(z), { class: "maz-text-lg" })
+            ]),
+            _: 1
+          }),
+          o(m, {
+            size: "xs",
+            color: "transparent",
+            type: "button",
+            onClick: l(g, ["stop"])
+          }, {
+            default: i(() => [
+              o(s(z), { class: "maz-rotate-180 maz-text-lg" })
+            ]),
+            _: 1
+          })
+        ]),
+        o(m, {
+          size: "xs",
+          color: "transparent",
+          type: "button",
+          onClick: r[0] || (r[0] = l((e) => a.$emit("close", e), ["stop"]))
+        }, {
+          default: i(() => [
+            o(s(N), { class: "maz-text-lg" })
+          ]),
+          _: 1
+        })
+      ]),
+      u("div", T, [
+        (d(!0), _(D, null, S(k.value, (e) => (d(), Y(m, {
+          key: e.label,
+          size: "sm",
+          type: "button",
+          class: B({
+            "--is-selected": s(y)(e.date, n.calendarDate, "year")
+          }),
+          color: s(y)(e.date, n.calendarDate, "year") ? n.color : "transparent",
+          onClick: l((j) => h(e.date), ["stop"])
+        }, {
+          default: i(() => [
+            M(q(e.label), 1)
+          ]),
+          _: 2
+        }, 1032, ["class", "color", "onClick"]))), 128))
+      ])
+    ]));
+  }
+}), Q = /* @__PURE__ */ V($, [["__scopeId", "data-v-ff5a67bf"]]);
+export {
+  Q as default
+};

package/dist/chunks/MazSwitch.vue_vue_type_style_index_0_lang.C0cqQKJt.js

@@ -0,0 +1,86 @@
+import { defineComponent as g, computed as k, ref as V, openBlock as s, createElementBlock as t, unref as d, normalizeClass as u, normalizeStyle as B, createElementVNode as c, mergeProps as z, renderSlot as C, createTextVNode as E, toDisplayString as m, createCommentVNode as p } from "vue";
+import { useInstanceUniqId as S } from "../composables/useInstanceUniqId.js";
+import '../assets/MazSwitch.DMLND-p2.css';const I = ["for", "aria-checked"], N = ["id", "name", "checked", "aria-label", "disabled"], $ = {
+  key: 0,
+  class: "m-switch__text"
+}, R = /* @__PURE__ */ g({
+  inheritAttrs: !1,
+  __name: "MazSwitch",
+  props: {
+    style: { default: void 0 },
+    class: { default: void 0 },
+    modelValue: { type: Boolean, default: !1 },
+    id: { default: void 0 },
+    disabled: { type: Boolean, default: !1 },
+    name: { default: void 0 },
+    label: {},
+    color: { default: "primary" },
+    error: { type: Boolean },
+    success: { type: Boolean },
+    warning: { type: Boolean },
+    hint: {}
+  },
+  emits: ["update:model-value", "change", "blur", "focus"],
+  setup(f, { emit: h }) {
+    const l = f, o = h, r = S({
+      componentName: "MazSwitch",
+      providedId: l.id
+    }), b = k(() => l.color === "theme" ? "var(--maz-color-bg-theme)" : `var(--maz-color-${l.color}-alpha)`);
+    function i() {
+      o("update:model-value", !l.modelValue), o("change", !l.modelValue);
+    }
+    const n = V();
+    function v(e) {
+      ["Space"].includes(e.code) && (e.preventDefault(), i());
+    }
+    function y(e) {
+      var a;
+      (a = n.value) == null || a.dispatchEvent(new Event("blur")), o("blur", e);
+    }
+    function w(e) {
+      var a;
+      (a = n.value) == null || a.dispatchEvent(new Event("focus")), o("focus", e);
+    }
+    return (e, a) => (s(), t("label", {
+      for: d(r),
+      class: u(["m-switch m-reset-css", [{ "--is-disabled": e.disabled }, l.class]]),
+      role: "switch",
+      style: B([e.style, { "--switch-color": b.value }]),
+      "aria-checked": e.modelValue,
+      tabindex: "0",
+      onBlur: y,
+      onFocus: w,
+      onKeydown: v
+    }, [
+      c("input", z({ id: d(r) }, e.$attrs, {
+        ref_key: "inputRef",
+        ref: n,
+        type: "checkbox",
+        name: e.name,
+        tabindex: "-1",
+        checked: e.modelValue,
+        "aria-label": e.label,
+        disabled: e.disabled,
+        class: "m-switch__input",
+        onChange: i
+      }), null, 16, N),
+      a[0] || (a[0] = c("span", { class: "m-switch__toggle" }, null, -1)),
+      e.$slots.default || e.label || e.hint ? (s(), t("span", $, [
+        C(e.$slots, "default", { value: e.modelValue }, () => [
+          E(m(e.label), 1)
+        ]),
+        e.hint ? (s(), t("span", {
+          key: 0,
+          class: u(["m-switch__hint", {
+            "--error": e.error,
+            "--success": e.success,
+            "--warning": e.warning
+          }])
+        }, m(e.hint), 3)) : p("", !0)
+      ])) : p("", !0)
+    ], 46, I));
+  }
+});
+export {
+  R as _
+};