maz-ui 3.22.4 → 3.23.1

package/components/chunks/MazInput-8a217995.mjs

@@ -0,0 +1,271 @@
+import "../assets/MazInput.css";
+import { computed as n, defineComponent as K, defineAsyncComponent as c, ref as p, getCurrentInstance as Q, onMounted as W, useSlots as X, openBlock as o, createElementBlock as f, normalizeClass as h, normalizeStyle as Y, createElementVNode as z, renderSlot as B, createVNode as b, unref as r, createCommentVNode as i, withDirectives as Z, mergeProps as _, toHandlers as ee, vModelDynamic as te, createTextVNode as ae, toDisplayString as le, createBlock as w, withModifiers as ne, withCtx as V } from "vue";
+import { d as oe } from "./debounce-19c516b6.mjs";
+import { _ as re } from "./MazPicker-e4620d8b.mjs";
+const ie = ({
+  componentName: e,
+  instance: d,
+  providedId: m
+}) => n(() => m ?? `${e}-${d == null ? void 0 : d.uid}`), de = {
+  key: 0,
+  class: "m-input-wrapper-left"
+}, ue = { class: "m-input-wrapper-input" }, se = ["id", "type", "name", "placeholder", "aria-label", "disabled", "readonly", "required"], ce = { key: 0 }, fe = {
+  key: 1,
+  class: "m-input-wrapper-right"
+}, me = /* @__PURE__ */ K({
+  inheritAttrs: !1,
+  __name: "MazInput",
+  props: {
+    style: { type: [String, Array, Object], default: void 0 },
+    class: { type: String, default: void 0 },
+    modelValue: {
+      type: [String, Number, Boolean],
+      default: void 0
+    },
+    placeholder: { type: String, default: void 0 },
+    color: {
+      type: String,
+      default: "primary"
+    },
+    label: { type: String, default: void 0 },
+    name: { type: String, default: "input" },
+    type: {
+      type: String,
+      default: "text",
+      validator: (e) => [
+        "text",
+        "date",
+        "number",
+        "tel",
+        "search",
+        "url",
+        "password",
+        "month",
+        "time",
+        "week",
+        "email"
+      ].includes(e)
+    },
+    required: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
+    id: { type: String, default: void 0 },
+    error: { type: Boolean, default: !1 },
+    success: { type: Boolean, default: !1 },
+    warning: { type: Boolean, default: !1 },
+    hint: { type: String, default: void 0 },
+    inputClasses: { type: String, default: void 0 },
+    noBorder: { type: Boolean, default: !1 },
+    noRadius: { type: Boolean, default: !1 },
+    size: {
+      type: String,
+      default: "md",
+      validator: (e) => ["mini", "xs", "sm", "md", "lg", "xl"].includes(e)
+    },
+    debounce: { type: Boolean, default: !1 },
+    debounceDelay: { type: Number, default: 500 },
+    validButton: { type: Boolean, default: !1 },
+    validButtonLoading: { type: Boolean, default: !1 },
+    autoFocus: { type: Boolean, default: !1 },
+    borderActive: { type: Boolean, default: !1 },
+    leftIcon: { type: String, default: void 0 },
+    rightIcon: { type: String, default: void 0 }
+  },
+  emits: ["focus", "blur", "update:model-value", "click", "change", "update"],
+  setup(e, { emit: d }) {
+    const m = c(() => import("./MazBtn-683effc1.mjs")), k = c(() => import("./MazIcon-52a76873.mjs")), $ = c(() => import("./eye-slash-fa42a017.mjs")), C = c(() => import("./eye-dc12ce09.mjs")), M = c(() => import("./check-c9b483c0.mjs")), t = e, u = d, y = p(!1), s = p(!1), x = p(), q = Q(), N = ie({
+      componentName: "MazInput",
+      instance: q,
+      providedId: t.id
+    });
+    W(() => {
+      var a;
+      t.autoFocus && ((a = x.value) == null || a.focus());
+    });
+    const A = n(() => t.class), I = n(() => t.type === "password"), P = n(() => y.value ? "text" : t.type), D = n(() => {
+      if (!t.noBorder) {
+        if (t.error)
+          return "maz-border-danger";
+        if (t.success)
+          return "maz-border-success";
+        if (t.warning)
+          return "maz-border-warning";
+        if (s.value || t.borderActive) {
+          if (t.color === "black")
+            return "maz-border-black";
+          if (t.color === "danger")
+            return "maz-border-danger";
+          if (t.color === "info")
+            return "maz-border-info";
+          if (t.color === "primary")
+            return "maz-border-primary";
+          if (t.color === "secondary")
+            return "maz-border-secondary";
+          if (t.color === "success")
+            return "maz-border-success";
+          if (t.color === "warning")
+            return "maz-border-warning";
+          if (t.color === "white")
+            return "maz-border-white";
+        }
+        return "--default-border";
+      }
+    }), g = X(), E = n(() => {
+      const { required: a, placeholder: l } = t;
+      if (l)
+        return a ? `${l} *` : l;
+    }), L = n(() => t.modelValue !== void 0 && t.modelValue !== ""), S = n({
+      get: () => t.modelValue,
+      set: (a) => J(a)
+    }), F = n(() => (!!t.label || !!t.hint) && (s.value || !!L.value || !!t.placeholder || ["date", "month", "week"].includes(t.type))), R = n(() => !!t.label || !!t.hint), T = () => !!g["right-icon"] || I.value || !!g["valid-button"] || t.validButton || !!t.rightIcon, U = () => !!g["left-icon"] || !!t.leftIcon, O = (a) => {
+      u("focus", a), s.value = !0;
+    }, j = (a) => {
+      u("blur", a), s.value = !1;
+    }, H = (a) => u("change", a), G = oe((a) => {
+      u("update:model-value", a);
+    }, t.debounceDelay), J = (a) => {
+      if (t.debounce)
+        return G(a);
+      u("update:model-value", a);
+    };
+    return (a, l) => (o(), f(
+      "div",
+      {
+        class: h(["m-input", [
+          {
+            "--is-focused": s.value || e.borderActive,
+            "--should-up": F.value,
+            "--has-label": R.value,
+            "--is-disabled": e.disabled,
+            "--is-readonly": e.readonly,
+            "--has-z-2": e.error || e.warning || e.success,
+            "--has-state": e.error || e.warning || e.success
+          },
+          A.value,
+          `--${e.color}`,
+          `--${e.size}`
+        ]]),
+        style: Y(e.style)
+      },
+      [
+        z(
+          "div",
+          {
+            class: h(["m-input-wrapper", [e.inputClasses, D.value, { "maz-rounded": !e.noRadius }]])
+          },
+          [
+            U() ? (o(), f("div", de, [
+              a.$slots["left-icon"] || e.leftIcon ? B(a.$slots, "left-icon", { key: 0 }, () => [
+                b(r(k), {
+                  name: e.leftIcon,
+                  class: "maz-text-xl maz-text-muted"
+                }, null, 8, ["name"])
+              ], !0) : i("v-if", !0)
+            ])) : i("v-if", !0),
+            z("div", ue, [
+              Z(z("input", _({
+                id: r(N),
+                ref_key: "input",
+                ref: x,
+                "onUpdate:modelValue": l[0] || (l[0] = (v) => S.value = v),
+                type: P.value,
+                name: e.name
+              }, a.$attrs, {
+                placeholder: E.value,
+                "aria-label": e.label || e.placeholder,
+                disabled: e.disabled,
+                readonly: e.readonly,
+                required: e.required,
+                class: "m-input-input"
+              }, ee({
+                blur: j,
+                focus: O,
+                change: H
+              }, !0), {
+                onClick: l[1] || (l[1] = (v) => a.$emit("click", v))
+              }), null, 16, se), [
+                [te, S.value]
+              ]),
+              e.label || e.hint ? (o(), f(
+                "span",
+                {
+                  key: 0,
+                  ref: "label",
+                  class: h(["m-input-label", [
+                    {
+                      "maz-text-danger-600": e.error,
+                      "maz-text-success-600": e.success,
+                      "maz-text-warning-600": e.warning
+                    }
+                  ]])
+                },
+                [
+                  ae(
+                    le(e.hint || e.label) + " ",
+                    1
+                    /* TEXT */
+                  ),
+                  e.required ? (o(), f("sup", ce, "*")) : i("v-if", !0)
+                ],
+                2
+                /* CLASS */
+              )) : i("v-if", !0)
+            ]),
+            T() ? (o(), f("div", fe, [
+              a.$slots["right-icon"] || e.rightIcon ? B(a.$slots, "right-icon", { key: 0 }, () => [
+                b(r(k), {
+                  name: e.rightIcon,
+                  class: "maz-text-xl maz-text-muted"
+                }, null, 8, ["name"])
+              ], !0) : i("v-if", !0),
+              I.value ? (o(), w(r(m), {
+                key: 1,
+                color: "transparent",
+                tabindex: "-1",
+                size: "mini",
+                onClick: l[2] || (l[2] = ne((v) => y.value = !y.value, ["stop"]))
+              }, {
+                default: V(() => [
+                  y.value ? (o(), w(r($), {
+                    key: 0,
+                    class: "maz-text-xl maz-text-muted"
+                  })) : (o(), w(r(C), {
+                    key: 1,
+                    class: "maz-text-xl maz-text-muted"
+                  }))
+                ]),
+                _: 1
+                /* STABLE */
+              })) : i("v-if", !0),
+              a.$slots["valid-button"] || e.validButton ? B(a.$slots, "valid-button", { key: 2 }, () => [
+                b(r(m), {
+                  color: "transparent",
+                  disabled: e.disabled,
+                  tabindex: "-1",
+                  loading: e.validButtonLoading,
+                  class: "m-input-valid-button",
+                  size: "mini",
+                  type: "submit"
+                }, {
+                  default: V(() => [
+                    b(r(M), { class: "maz-text-2xl maz-text-normal" })
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["disabled", "loading"])
+              ], !0) : i("v-if", !0)
+            ])) : i("v-if", !0)
+          ],
+          2
+          /* CLASS */
+        )
+      ],
+      6
+      /* CLASS, STYLE */
+    ));
+  }
+});
+const pe = /* @__PURE__ */ re(me, [["__scopeId", "data-v-32fa5093"]]);
+export {
+  pe as default
+};

package/components/chunks/MazInput-c51881ea.mjs

@@ -0,0 +1,278 @@
+import "../assets/MazInput.css";
+import { computed as n, defineComponent as K, defineAsyncComponent as f, ref as h, getCurrentInstance as Q, onMounted as W, useSlots as X, openBlock as o, createElementBlock as m, normalizeClass as z, normalizeStyle as Y, createElementVNode as B, renderSlot as w, createVNode as g, unref as r, createCommentVNode as i, withDirectives as Z, mergeProps as _, toHandlers as ee, vModelDynamic as te, createTextVNode as ae, toDisplayString as le, createBlock as k, withModifiers as ne, withCtx as V } from "vue";
+import { _ as oe } from "./_plugin-vue_export-helper-dad06003.mjs";
+function re(e, u) {
+  let d;
+  return function(...y) {
+    clearTimeout(d), d = setTimeout(() => {
+      e.apply(this, y);
+    }, u);
+  };
+}
+const ie = ({
+  componentName: e,
+  instance: u,
+  providedId: d
+}) => n(() => d ?? `${e}-${u == null ? void 0 : u.uid}`), ue = {
+  key: 0,
+  class: "m-input-wrapper-left"
+}, de = { class: "m-input-wrapper-input" }, se = ["id", "type", "name", "placeholder", "aria-label", "disabled", "readonly", "required"], ce = { key: 0 }, fe = {
+  key: 1,
+  class: "m-input-wrapper-right"
+}, me = /* @__PURE__ */ K({
+  inheritAttrs: !1,
+  __name: "MazInput",
+  props: {
+    style: { type: [String, Array, Object], default: void 0 },
+    class: { type: String, default: void 0 },
+    modelValue: {
+      type: [String, Number, Boolean],
+      default: void 0
+    },
+    placeholder: { type: String, default: void 0 },
+    color: {
+      type: String,
+      default: "primary"
+    },
+    label: { type: String, default: void 0 },
+    name: { type: String, default: "input" },
+    type: {
+      type: String,
+      default: "text",
+      validator: (e) => [
+        "text",
+        "date",
+        "number",
+        "tel",
+        "search",
+        "url",
+        "password",
+        "month",
+        "time",
+        "week",
+        "email"
+      ].includes(e)
+    },
+    required: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
+    id: { type: String, default: void 0 },
+    error: { type: Boolean, default: !1 },
+    success: { type: Boolean, default: !1 },
+    warning: { type: Boolean, default: !1 },
+    hint: { type: String, default: void 0 },
+    inputClasses: { type: String, default: void 0 },
+    noBorder: { type: Boolean, default: !1 },
+    noRadius: { type: Boolean, default: !1 },
+    size: {
+      type: String,
+      default: "md",
+      validator: (e) => ["mini", "xs", "sm", "md", "lg", "xl"].includes(e)
+    },
+    debounce: { type: Boolean, default: !1 },
+    debounceDelay: { type: Number, default: 500 },
+    validButton: { type: Boolean, default: !1 },
+    validButtonLoading: { type: Boolean, default: !1 },
+    autoFocus: { type: Boolean, default: !1 },
+    borderActive: { type: Boolean, default: !1 },
+    leftIcon: { type: String, default: void 0 },
+    rightIcon: { type: String, default: void 0 }
+  },
+  emits: ["focus", "blur", "update:model-value", "click", "change", "update"],
+  setup(e, { emit: u }) {
+    const d = f(() => import("./MazBtn-6ce4cfd3.mjs")), y = f(() => import("./MazIcon-52a76873.mjs")), $ = f(() => import("./eye-slash-fa42a017.mjs")), C = f(() => import("./eye-dc12ce09.mjs")), M = f(() => import("./check-c9b483c0.mjs")), t = e, s = u, v = h(!1), c = h(!1), x = h(), q = Q(), N = ie({
+      componentName: "MazInput",
+      instance: q,
+      providedId: t.id
+    });
+    W(() => {
+      var a;
+      t.autoFocus && ((a = x.value) == null || a.focus());
+    });
+    const A = n(() => t.class), I = n(() => t.type === "password"), P = n(() => v.value ? "text" : t.type), D = n(() => {
+      if (!t.noBorder) {
+        if (t.error)
+          return "maz-border-danger";
+        if (t.success)
+          return "maz-border-success";
+        if (t.warning)
+          return "maz-border-warning";
+        if (c.value || t.borderActive) {
+          if (t.color === "black")
+            return "maz-border-black";
+          if (t.color === "danger")
+            return "maz-border-danger";
+          if (t.color === "info")
+            return "maz-border-info";
+          if (t.color === "primary")
+            return "maz-border-primary";
+          if (t.color === "secondary")
+            return "maz-border-secondary";
+          if (t.color === "success")
+            return "maz-border-success";
+          if (t.color === "warning")
+            return "maz-border-warning";
+          if (t.color === "white")
+            return "maz-border-white";
+        }
+        return "--default-border";
+      }
+    }), p = X(), E = n(() => {
+      const { required: a, placeholder: l } = t;
+      if (l)
+        return a ? `${l} *` : l;
+    }), T = n(() => t.modelValue !== void 0 && t.modelValue !== ""), S = n({
+      get: () => t.modelValue,
+      set: (a) => J(a)
+    }), L = n(() => (!!t.label || !!t.hint) && (c.value || !!T.value || !!t.placeholder || ["date", "month", "week"].includes(t.type))), F = n(() => !!t.label || !!t.hint), R = () => !!p["right-icon"] || I.value || !!p["valid-button"] || t.validButton || !!t.rightIcon, U = () => !!p["left-icon"] || !!t.leftIcon, O = (a) => {
+      s("focus", a), c.value = !0;
+    }, j = (a) => {
+      s("blur", a), c.value = !1;
+    }, H = (a) => s("change", a), G = re((a) => {
+      s("update:model-value", a);
+    }, t.debounceDelay), J = (a) => {
+      if (t.debounce)
+        return G(a);
+      s("update:model-value", a);
+    };
+    return (a, l) => (o(), m(
+      "div",
+      {
+        class: z(["m-input", [
+          {
+            "--is-focused": c.value || e.borderActive,
+            "--should-up": L.value,
+            "--has-label": F.value,
+            "--is-disabled": e.disabled,
+            "--is-readonly": e.readonly,
+            "--has-z-2": e.error || e.warning || e.success,
+            "--has-state": e.error || e.warning || e.success
+          },
+          A.value,
+          `--${e.color}`,
+          `--${e.size}`
+        ]]),
+        style: Y(e.style)
+      },
+      [
+        B(
+          "div",
+          {
+            class: z(["m-input-wrapper", [e.inputClasses, D.value, { "maz-rounded": !e.noRadius }]])
+          },
+          [
+            U() ? (o(), m("div", ue, [
+              a.$slots["left-icon"] || e.leftIcon ? w(a.$slots, "left-icon", { key: 0 }, () => [
+                g(r(y), {
+                  name: e.leftIcon,
+                  class: "maz-text-xl maz-text-muted"
+                }, null, 8, ["name"])
+              ], !0) : i("v-if", !0)
+            ])) : i("v-if", !0),
+            B("div", de, [
+              Z(B("input", _({
+                id: r(N),
+                ref_key: "input",
+                ref: x,
+                "onUpdate:modelValue": l[0] || (l[0] = (b) => S.value = b),
+                type: P.value,
+                name: e.name
+              }, a.$attrs, {
+                placeholder: E.value,
+                "aria-label": e.label || e.placeholder,
+                disabled: e.disabled,
+                readonly: e.readonly,
+                required: e.required,
+                class: "m-input-input"
+              }, ee({
+                blur: j,
+                focus: O,
+                change: H
+              }, !0), {
+                onClick: l[1] || (l[1] = (b) => a.$emit("click", b))
+              }), null, 16, se), [
+                [te, S.value]
+              ]),
+              e.label || e.hint ? (o(), m(
+                "span",
+                {
+                  key: 0,
+                  ref: "label",
+                  class: z(["m-input-label", [
+                    {
+                      "maz-text-danger-600": e.error,
+                      "maz-text-success-600": e.success,
+                      "maz-text-warning-600": e.warning
+                    }
+                  ]])
+                },
+                [
+                  ae(
+                    le(e.hint || e.label) + " ",
+                    1
+                    /* TEXT */
+                  ),
+                  e.required ? (o(), m("sup", ce, "*")) : i("v-if", !0)
+                ],
+                2
+                /* CLASS */
+              )) : i("v-if", !0)
+            ]),
+            R() ? (o(), m("div", fe, [
+              a.$slots["right-icon"] || e.rightIcon ? w(a.$slots, "right-icon", { key: 0 }, () => [
+                g(r(y), {
+                  name: e.rightIcon,
+                  class: "maz-text-xl maz-text-muted"
+                }, null, 8, ["name"])
+              ], !0) : i("v-if", !0),
+              I.value ? (o(), k(r(d), {
+                key: 1,
+                color: "transparent",
+                tabindex: "-1",
+                size: "mini",
+                onClick: l[2] || (l[2] = ne((b) => v.value = !v.value, ["stop"]))
+              }, {
+                default: V(() => [
+                  v.value ? (o(), k(r($), {
+                    key: 0,
+                    class: "maz-text-xl maz-text-muted"
+                  })) : (o(), k(r(C), {
+                    key: 1,
+                    class: "maz-text-xl maz-text-muted"
+                  }))
+                ]),
+                _: 1
+                /* STABLE */
+              })) : i("v-if", !0),
+              a.$slots["valid-button"] || e.validButton ? w(a.$slots, "valid-button", { key: 2 }, () => [
+                g(r(d), {
+                  color: "transparent",
+                  disabled: e.disabled,
+                  tabindex: "-1",
+                  loading: e.validButtonLoading,
+                  class: "m-input-valid-button",
+                  size: "mini",
+                  type: "submit"
+                }, {
+                  default: V(() => [
+                    g(r(M), { class: "maz-text-2xl maz-text-normal" })
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["disabled", "loading"])
+              ], !0) : i("v-if", !0)
+            ])) : i("v-if", !0)
+          ],
+          2
+          /* CLASS */
+        )
+      ],
+      6
+      /* CLASS, STYLE */
+    ));
+  }
+});
+const ge = /* @__PURE__ */ oe(me, [["__scopeId", "data-v-32fa5093"]]);
+export {
+  ge as default
+};