maz-ui 3.47.2-beta.2 → 3.47.2-beta.20

package/components/chunks/MazSelect-CyWAOXo4.mjs

@@ -0,0 +1,867 @@
+import { computed as p, useId as Me, defineComponent as be, defineAsyncComponent as $, ref as V, onMounted as Te, useSlots as Ee, openBlock as m, createElementBlock as k, normalizeClass as B, normalizeStyle as ee, unref as h, toDisplayString as G, createCommentVNode as b, createElementVNode as O, renderSlot as U, createBlock as A, resolveDynamicComponent as me, withDirectives as he, mergeProps as ge, toHandlers as Oe, vModelDynamic as De, createTextVNode as Ne, withModifiers as H, withCtx as te, createVNode as q, onBeforeMount as Pe, nextTick as ue, Transition as Fe, Fragment as ve, renderList as He } from "vue";
+import '../assets/MazSelect.css';function ze({
+  componentName: u,
+  providedId: r
+}) {
+  return p(() => r ?? `${u}-${Me().replace(/:/g, "")}`);
+}
+const qe = {
+  removeAccents: !0,
+  caseSensitive: !1,
+  replaceSpaces: !0,
+  removeSpecialCharacters: !1,
+  trim: !0,
+  normalizeSpaces: !0,
+  removeNumbers: !1,
+  customNormalizationForms: ["NFC", "NFKD"]
+};
+function oe(u, r) {
+  const l = { ...qe, ...r }, t = {
+    À: "A",
+    Á: "A",
+    Â: "A",
+    Ã: "A",
+    Ä: "A",
+    Å: "A",
+    à: "a",
+    á: "a",
+    â: "a",
+    ã: "a",
+    ä: "a",
+    å: "a",
+    È: "E",
+    É: "E",
+    Ê: "E",
+    Ë: "E",
+    è: "e",
+    é: "e",
+    ê: "e",
+    ë: "e",
+    Î: "I",
+    Ï: "I",
+    í: "I",
+    î: "i",
+    ï: "i",
+    Ô: "O",
+    Õ: "O",
+    Ö: "O",
+    Ø: "O",
+    ô: "o",
+    õ: "o",
+    ö: "o",
+    ø: "o",
+    Ù: "U",
+    Ú: "U",
+    Û: "U",
+    Ü: "U",
+    ù: "u",
+    ú: "u",
+    û: "u",
+    ü: "u",
+    Ç: "C",
+    ç: "c",
+    ÿ: "y",
+    Ñ: "N",
+    ñ: "n",
+    ó: "o"
+  };
+  let s = u.toString();
+  if (l.trim && (s = s.trim()), l.normalizeSpaces && (s = s.replaceAll(/\s+/g, " ")), l.replaceSpaces && (s = s.replaceAll(" ", "-")), l.removeNumbers && (s = s.replaceAll(/\d/g, "")), l.removeAccents && (s = s.replaceAll(/[ÀÁÂÃÄÅÇÈÉÊËÎÏÑÔÕÖØÙÚÛÜàáâãäåçèéêëíîïñóôõöøùúûüÿ]/g, (d) => t[d] || d), s = s.replaceAll(/[\u0300-\u036F]/g, "")), l.caseSensitive === !1 && (s = s.toLowerCase()), l.removeSpecialCharacters && (s = s.replaceAll(/[^\dA-Z-]/gi, "")), l.trim && (s = s.trim()), l.customNormalizationForms)
+    for (const d of l.customNormalizationForms)
+      s = s.normalize(d);
+  return s;
+}
+function Ue(u, r) {
+  const l = u.length, t = r.length, s = [];
+  for (let d = 0; d <= l; d++)
+    s[d] = [d];
+  for (let d = 0; d <= t; d++)
+    s[0][d] = d;
+  for (let d = 1; d <= l; d++)
+    for (let v = 1; v <= t; v++) {
+      const S = u[d - 1] === r[v - 1] ? 0 : 1;
+      s[d][v] = Math.min(
+        s[d - 1][v] + 1,
+        s[d][v - 1] + 1,
+        s[d - 1][v - 1] + S
+      );
+    }
+  return s[l][t];
+}
+function ke(u, r) {
+  const l = Ue(u, r), t = Math.max(u.length, r.length);
+  return 1 - l / t;
+}
+function We(u, r, l = 0.75) {
+  return ke(u, r) >= l;
+}
+function re(u, r, l = 0.75) {
+  const t = p(
+    () => oe(typeof u == "string" ? u : u.value)
+  ), s = p(
+    () => oe(typeof r == "string" ? r : r.value)
+  ), d = p(() => typeof l == "number" ? l : l.value), v = p(() => ke(t.value, s.value));
+  return {
+    isMatching: p(
+      () => We(t.value, s.value, d.value)
+    ),
+    score: v
+  };
+}
+function Ve(u, r, l) {
+  var v, S;
+  u.stopPropagation();
+  const t = typeof l.value == "function" ? l.value : l.value.handler, s = typeof l.value == "object" ? l.value.exclude : void 0;
+  let d = !1;
+  if (s && s.length > 0) {
+    for (const D of s)
+      if (!d && u.target instanceof HTMLElement) {
+        const z = (v = document.querySelector(D)) == null ? void 0 : v.getAttribute("id");
+        d = (u.target.getAttribute("id") === z || ((S = document.querySelector(D)) == null ? void 0 : S.contains(u.target))) ?? !1;
+      }
+  }
+  !r.contains(u.target) && !d && (t == null || t(u));
+}
+function Ie() {
+  return document.ontouchstart === null ? "touchstart" : "click";
+}
+function je(u, r) {
+  const l = Ie();
+  document.removeEventListener(l, (t) => Ve(t, u, r));
+}
+function Qe(u, r) {
+  if (typeof r.value != "function" && typeof r.value == "object" && typeof r.value.handler != "function") {
+    console.error("[maz-ui](vClosable) v-closable directive requires a handler function");
+    return;
+  }
+  const l = Ie();
+  document.addEventListener(l, (t) => Ve(t, u, r));
+}
+const Re = {
+  mounted: Qe,
+  unmounted: je
+};
+let de = null;
+function Ge(u, r) {
+  de && clearTimeout(de), de = setTimeout(u, r);
+}
+function Ze(u, r) {
+  let l;
+  return function(...t) {
+    clearTimeout(l), l = setTimeout(() => {
+      u.apply(this, t);
+    }, r);
+  };
+}
+const Je = ["for"], Xe = {
+  key: 0,
+  class: "m-input-wrapper-left"
+}, Ye = ["id", "type", "name", "inputmode", "placeholder", "aria-label", "disabled", "readonly", "required"], xe = { key: 0 }, _e = {
+  key: 1,
+  class: "m-input-wrapper-right"
+}, et = /* @__PURE__ */ be({
+  inheritAttrs: !1,
+  __name: "MazInput",
+  props: {
+    style: { default: void 0 },
+    class: { default: void 0 },
+    modelValue: { default: void 0 },
+    placeholder: { default: void 0 },
+    label: { default: void 0 },
+    topLabel: {},
+    assistiveText: {},
+    name: { default: void 0 },
+    color: { default: "primary" },
+    type: { default: "text" },
+    required: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
+    id: { default: void 0 },
+    error: { type: Boolean, default: !1 },
+    success: { type: Boolean, default: !1 },
+    warning: { type: Boolean, default: !1 },
+    hint: { default: void 0 },
+    inputClasses: { default: void 0 },
+    noBorder: { type: Boolean, default: !1 },
+    noRadius: { type: Boolean, default: !1 },
+    inputmode: { default: "text" },
+    size: { default: "md" },
+    debounce: { type: [Boolean, Number], default: !1 },
+    debounceDelay: { 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, Function, Object], default: void 0 },
+    rightIcon: { type: [String, Function, Object], default: void 0 },
+    roundedSize: { default: void 0 },
+    block: { type: Boolean }
+  },
+  emits: ["update:model-value", "focus", "blur", "click", "change", "input"],
+  setup(u, { emit: r }) {
+    const l = u, t = r, s = $(() => import("./MazBtn-B5ioqwkK.mjs")), d = $(() => import("./MazIcon-_hN-Kivn.mjs")), v = $(() => import("./eye-slash-BoO00xzs.mjs")), S = $(() => import("./eye-f8zAUc30.mjs")), D = $(() => import("./check-C9Q_W85g.mjs")), z = V(!1), f = V(!1), N = V(), Z = ze({
+      componentName: "MazInput",
+      providedId: l.id
+    });
+    Te(() => {
+      var o;
+      l.autoFocus && ((o = N.value) == null || o.focus());
+    });
+    const J = p(() => l.type === "password"), le = p(() => z.value ? "text" : l.type), I = p(() => {
+      if (!l.noBorder) {
+        if (l.error)
+          return "maz-border-danger";
+        if (l.success)
+          return "maz-border-success";
+        if (l.warning)
+          return "maz-border-warning";
+        if (f.value || l.borderActive) {
+          if (l.color === "black")
+            return "maz-border-black";
+          if (l.color === "danger")
+            return "maz-border-danger";
+          if (l.color === "info")
+            return "maz-border-info";
+          if (l.color === "primary")
+            return "maz-border-primary";
+          if (l.color === "secondary")
+            return "maz-border-secondary";
+          if (l.color === "success")
+            return "maz-border-success";
+          if (l.color === "warning")
+            return "maz-border-warning";
+          if (l.color === "white")
+            return "maz-border-white";
+        }
+        return "--default-border";
+      }
+    }), W = Ee(), X = p(() => {
+      const { required: o, placeholder: g } = l;
+      if (g)
+        return o ? `${g} *` : g;
+    }), Y = p(() => M.value !== void 0 && M.value !== ""), C = Ze(
+      (o) => {
+        t("update:model-value", o);
+      },
+      typeof l.debounce == "number" ? l.debounce : l.debounceDelay ?? 500
+    );
+    function P(o) {
+      if (l.debounce)
+        return C(o);
+      t("update:model-value", o);
+    }
+    const M = p({
+      get: () => l.modelValue,
+      set: (o) => P(o)
+    }), j = p(() => (!!l.label || !!l.hint) && (f.value || !!Y.value || !!l.placeholder || ["date", "month", "week"].includes(l.type))), x = p(() => !!l.label || !!l.hint);
+    function _() {
+      return !!W["right-icon"] || J.value || !!W["valid-button"] || l.validButton || !!l.rightIcon;
+    }
+    function L() {
+      return !!W["left-icon"] || !!l.leftIcon;
+    }
+    function Q(o) {
+      t("focus", o), f.value = !0;
+    }
+    function ae(o) {
+      t("blur", o), f.value = !1;
+    }
+    function ne(o) {
+      return t("change", o);
+    }
+    function T(o) {
+      return t("input", o);
+    }
+    return (o, g) => (m(), k(
+      "div",
+      {
+        class: B(["m-input", [
+          {
+            "--is-focused": f.value || o.borderActive,
+            "--should-up": j.value,
+            "--has-label": x.value,
+            "--is-disabled": o.disabled,
+            "--is-readonly": o.readonly,
+            "--has-z-2": o.error || o.warning || o.success,
+            "--has-state": o.error || o.warning || o.success,
+            "--block": o.block
+          },
+          l.class,
+          `--${o.color}`
+        ]]),
+        style: ee(o.style)
+      },
+      [
+        o.topLabel ? (m(), k("label", {
+          key: 0,
+          for: h(Z),
+          class: "m-input-top-label"
+        }, G(o.topLabel), 9, Je)) : b("v-if", !0),
+        O(
+          "div",
+          {
+            class: B(["m-input-wrapper", [
+              o.inputClasses,
+              I.value,
+              o.roundedSize ? `--rounded-${o.roundedSize}` : { "maz-rounded": !o.noRadius },
+              { "--block": o.block }
+            ]])
+          },
+          [
+            L() ? (m(), k("div", Xe, [
+              o.$slots["left-icon"] || o.leftIcon ? U(o.$slots, "left-icon", { key: 0 }, () => [
+                typeof o.leftIcon == "string" ? (m(), A(h(d), {
+                  key: 0,
+                  name: o.leftIcon,
+                  class: "maz-text-xl maz-text-muted"
+                }, null, 8, ["name"])) : o.leftIcon ? (m(), A(me(o.leftIcon), {
+                  key: 1,
+                  class: "maz-text-xl maz-text-muted"
+                })) : b("v-if", !0)
+              ], !0) : b("v-if", !0)
+            ])) : b("v-if", !0),
+            O(
+              "div",
+              {
+                class: B(["m-input-wrapper-input", [`--${o.size}`, { "--top-label": !!o.topLabel }]])
+              },
+              [
+                he(O("input", ge({
+                  id: h(Z),
+                  ref_key: "input",
+                  ref: N,
+                  "onUpdate:modelValue": g[0] || (g[0] = (E) => M.value = E),
+                  type: le.value,
+                  name: o.name
+                }, o.$attrs, {
+                  inputmode: o.inputmode,
+                  placeholder: X.value,
+                  "aria-label": o.label || o.placeholder,
+                  disabled: o.disabled,
+                  readonly: o.readonly,
+                  required: o.required,
+                  class: "m-input-input"
+                }, Oe({
+                  blur: ae,
+                  focus: Q,
+                  change: ne,
+                  input: T
+                }, !0), {
+                  onClick: g[1] || (g[1] = (E) => o.$emit("click", E))
+                }), null, 16, Ye), [
+                  [De, M.value]
+                ]),
+                o.label || o.hint ? (m(), k(
+                  "span",
+                  {
+                    key: 0,
+                    class: B(["m-input-label", [
+                      {
+                        "maz-text-danger-600": o.error,
+                        "maz-text-success-600": o.success,
+                        "maz-text-warning-600": o.warning
+                      }
+                    ]])
+                  },
+                  [
+                    Ne(
+                      G(o.hint || o.label) + " ",
+                      1
+                      /* TEXT */
+                    ),
+                    o.required ? (m(), k("sup", xe, "*")) : b("v-if", !0)
+                  ],
+                  2
+                  /* CLASS */
+                )) : b("v-if", !0)
+              ],
+              2
+              /* CLASS */
+            ),
+            _() ? (m(), k("div", _e, [
+              o.$slots["right-icon"] || o.rightIcon ? U(o.$slots, "right-icon", { key: 0 }, () => [
+                typeof o.rightIcon == "string" ? (m(), A(h(d), {
+                  key: 0,
+                  name: o.rightIcon,
+                  class: "maz-text-xl maz-text-muted"
+                }, null, 8, ["name"])) : o.rightIcon ? (m(), A(me(o.rightIcon), {
+                  key: 1,
+                  class: "maz-text-xl maz-text-muted"
+                })) : b("v-if", !0)
+              ], !0) : b("v-if", !0),
+              J.value ? (m(), A(h(s), {
+                key: 1,
+                color: "transparent",
+                tabindex: "-1",
+                size: "mini",
+                onClick: g[2] || (g[2] = H((E) => z.value = !z.value, ["stop"]))
+              }, {
+                default: te(() => [
+                  z.value ? (m(), A(h(v), {
+                    key: 0,
+                    class: "maz-text-xl maz-text-muted"
+                  })) : (m(), A(h(S), {
+                    key: 1,
+                    class: "maz-text-xl maz-text-muted"
+                  }))
+                ]),
+                _: 1
+                /* STABLE */
+              })) : b("v-if", !0),
+              o.$slots["valid-button"] || o.validButton ? U(o.$slots, "valid-button", { key: 2 }, () => [
+                q(h(s), {
+                  color: "transparent",
+                  disabled: o.disabled,
+                  tabindex: "-1",
+                  loading: o.validButtonLoading,
+                  class: "m-input-valid-button",
+                  size: "mini",
+                  type: "submit"
+                }, {
+                  default: te(() => [
+                    q(h(D), { class: "maz-text-2xl maz-text-normal" })
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["disabled", "loading"])
+              ], !0) : b("v-if", !0)
+            ])) : b("v-if", !0)
+          ],
+          2
+          /* CLASS */
+        ),
+        o.assistiveText ? (m(), k(
+          "div",
+          {
+            key: 1,
+            class: B(["m-input-bottom-text", [
+              {
+                "maz-text-danger-600": o.error,
+                "maz-text-success-600": o.success,
+                "maz-text-warning-600": o.warning,
+                "maz-text-muted": !o.error && !o.success && !o.warning
+              }
+            ]])
+          },
+          G(o.assistiveText),
+          3
+          /* TEXT, CLASS */
+        )) : b("v-if", !0)
+      ],
+      6
+      /* CLASS, STYLE */
+    ));
+  }
+}), we = (u, r) => {
+  const l = u.__vccOpts || u;
+  for (const [t, s] of r)
+    l[t] = s;
+  return l;
+}, ye = /* @__PURE__ */ we(et, [["__scopeId", "data-v-2cfe0ca2"]]), tt = ["aria-label"], ot = { class: "m-select-list__no-results" }, lt = {
+  key: 2,
+  class: "m-select-list__scroll-wrapper",
+  tabindex: "-1"
+}, at = { class: "m-select-list-optgroup" }, nt = ["onClick"], st = /* @__PURE__ */ be({
+  inheritAttrs: !1,
+  __name: "MazSelect",
+  props: {
+    style: { default: void 0 },
+    class: { default: void 0 },
+    id: { default: void 0 },
+    modelValue: { default: void 0 },
+    options: { default: void 0 },
+    optionValueKey: { default: "value" },
+    optionLabelKey: { default: "label" },
+    optionInputValueKey: { default: "label" },
+    listPosition: { default: "bottom left" },
+    itemHeight: { default: void 0 },
+    maxListHeight: { default: 240 },
+    maxListWidth: { default: void 0 },
+    minListHeight: { default: void 0 },
+    minListWidth: { default: void 0 },
+    size: { default: "md" },
+    color: { default: "primary" },
+    search: { type: Boolean },
+    searchPlaceholder: { default: "Search in options" },
+    searchThreshold: { default: 0.75 },
+    open: { type: Boolean },
+    multiple: { type: Boolean, default: void 0 },
+    required: { type: Boolean },
+    disabled: { type: Boolean },
+    block: { type: Boolean },
+    excludeSelectors: { default: void 0 },
+    autocomplete: { default: "off" }
+  },
+  emits: ["close", "open", "blur", "focus", "change", "input", "update:model-value", "selected-option"],
+  setup(u, { expose: r, emit: l }) {
+    const t = u, s = l, d = $(() => import("./MazCheckbox-BDPgDiU3.mjs")), v = $(() => import("./magnifying-glass--nBiyXot.mjs")), S = $(() => import("./chevron-down-BkvtON3b.mjs")), D = $(() => import("./no-symbol-CIgKzsrB.mjs"));
+    r({
+      /** Method to open the option list */
+      openList: R,
+      /** Method to close the option list */
+      closeList: F
+    });
+    const z = V(!1), f = V(), N = p(
+      () => ["black", "transparent", "white"].includes(t.color)
+    ), Z = p(
+      () => N.value ? "var(--maz-color-black)" : `var(--maz-color-${t.color}-800)`
+    ), J = p(
+      () => N.value ? "var(--maz-color-muted)" : `var(--maz-color-${t.color}-100)`
+    ), le = p(
+      () => N.value ? "var(--maz-color-muted)" : `var(--maz-color-${t.color}-200)`
+    ), I = p(() => z.value || t.open), W = ze({
+      componentName: "MazSelect",
+      providedId: t.id
+    });
+    function X(e) {
+      return {
+        [t.optionValueKey]: e,
+        [t.optionLabelKey]: e,
+        [t.optionInputValueKey]: e
+      };
+    }
+    function Y(e) {
+      return {
+        ...e,
+        [t.optionValueKey]: e[t.optionValueKey],
+        [t.optionLabelKey]: e[t.optionLabelKey],
+        [t.optionInputValueKey]: e[t.optionInputValueKey]
+      };
+    }
+    const C = p(() => {
+      var n;
+      const e = [];
+      if (!((n = t.options) != null && n.length))
+        return [];
+      for (const a of t.options)
+        typeof a == "string" || typeof a == "number" || typeof a == "boolean" ? e.push(X(a)) : typeof a == "object" && "options" in a && Array.isArray(a.options) ? e.push(
+          { label: a.label, isOptGroup: !0 },
+          ...a.options.map(
+            (i) => typeof i == "string" || typeof i == "number" || typeof i == "boolean" ? X(i) : Y(i)
+          )
+        ) : e.push(Y(a));
+      return e;
+    }), P = p(
+      () => {
+        var e;
+        return ((e = C.value) == null ? void 0 : e.filter((n) => t.multiple ? Array.isArray(t.modelValue) ? t.modelValue.includes(n[t.optionValueKey]) && !L(n[t.optionValueKey]) : !1 : t.modelValue === n[t.optionValueKey] && !L(n[t.optionValueKey]))) ?? [];
+      }
+    );
+    Pe(() => {
+      var e;
+      (e = t.options) != null && e.length || console.warn("[maz-ui](MazSelect) you must provide options"), ie();
+    });
+    const M = V(), j = V(), x = V(), _ = V();
+    function L(e) {
+      return e == null;
+    }
+    function Q(e) {
+      var a;
+      return (((a = P.value) == null ? void 0 : a.some(
+        (i) => i[t.optionValueKey] === e[t.optionValueKey]
+      )) ?? !1) && !L(e[t.optionValueKey]);
+    }
+    const ae = p(() => {
+      var n;
+      if (t.multiple && t.modelValue && Array.isArray(t.modelValue))
+        return t.modelValue.map(
+          (a) => {
+            var i, c;
+            return (c = (i = C.value) == null ? void 0 : i.find((y) => y[t.optionValueKey] === a)) == null ? void 0 : c[t.optionInputValueKey];
+          }
+        ).join(", ");
+      const e = (n = C.value) == null ? void 0 : n.find(
+        (a) => a[t.optionValueKey] === t.modelValue
+      );
+      return L(t.modelValue) || e == null ? void 0 : e[t.optionInputValueKey];
+    }), ne = p(
+      () => t.listPosition.includes("bottom") ? "maz-slide" : "maz-slideinvert"
+    ), T = V(""), o = V("");
+    function g(e, n) {
+      return n && e && oe(e).includes(oe(n));
+    }
+    function E(e) {
+      var n;
+      return e ? (n = C.value) == null ? void 0 : n.filter((a) => {
+        const i = a[t.optionLabelKey], c = a[t.optionValueKey], y = a[t.optionInputValueKey], w = t.searchThreshold;
+        return g(i, e) || g(y, e) || g(c, e) || typeof i == "string" && re(i, e, w).isMatching.value || typeof y == "string" && re(y, e, w).isMatching.value || typeof c == "string" && re(c, e, w).isMatching.value;
+      }) : C.value;
+    }
+    const K = p(() => E(T.value));
+    async function F(e) {
+      var a, i;
+      if (!I.value)
+        return;
+      if (e && ("relatedTarget" in e && ((a = M.value) != null && a.contains(e.relatedTarget)) || e.type === "keydown"))
+        return e.preventDefault();
+      const n = e && "relatedTarget" in e && e.relatedTarget instanceof HTMLElement && e.relatedTarget.getAttribute("id");
+      if ((i = t.excludeSelectors) != null && i.includes(`#${n}`))
+        return e == null ? void 0 : e.preventDefault();
+      await ue(), z.value = !1, f.value = 0, s("close", e);
+    }
+    async function R(e) {
+      t.disabled || I.value || (e == null || e.preventDefault(), z.value = !0, await se(), s("focus", e), s("open", z.value));
+    }
+    function ce() {
+      var e, n;
+      (n = ((e = j.value) == null ? void 0 : e.$el).querySelector("input")) == null || n.focus();
+    }
+    function Se() {
+      var e, n;
+      (n = ((e = j.value) == null ? void 0 : e.$el).querySelector("input")) == null || n.dispatchEvent(new Event("input"));
+    }
+    function Ke(e) {
+      z.value ? F(e) : ce();
+    }
+    function Ae(e) {
+      var n, a;
+      T.value = e, (a = ((n = x.value) == null ? void 0 : n.$el).querySelector("input")) == null || a.focus();
+    }
+    function $e(e) {
+      var a;
+      e === "Backspace" && o.value.length > 0 ? o.value = o.value.slice(0, -1) : o.value += e;
+      const n = E(o.value);
+      n != null && n.length && (f.value = (a = K.value) == null ? void 0 : a.findIndex(
+        (i) => i[t.optionValueKey] === n[0][t.optionValueKey]
+      ), typeof f.value == "number" && f.value >= 0 && se(f.value)), Ge(() => {
+        o.value = "";
+      }, 1e3);
+    }
+    function Le(e) {
+      const n = e.key;
+      /^[\dA-Za-z\u0400-\u04FF]$/.test(n) ? (e.preventDefault(), R(e), t.search ? Ae(n) : $e(n)) : pe(e);
+    }
+    function pe(e, n = !0) {
+      const a = e.code, i = ["ArrowUp", "ArrowDown"].includes(a), c = (n ? ["Enter", "Space"] : ["Enter"]).includes(a), y = a === "Escape" && I.value;
+      i ? Be(e, f.value) : c ? Ce(e, f.value) : y && F(e);
+    }
+    function Be(e, n) {
+      var c;
+      e.preventDefault();
+      const a = e.code;
+      I.value || R(e);
+      const i = (c = K.value) == null ? void 0 : c.length;
+      i && (typeof n == "number" ? n === i - 1 && a === "ArrowDown" ? f.value = 0 : n === 0 && a === "ArrowUp" ? f.value = i - 1 : f.value = a === "ArrowDown" ? n + 1 : n - 1 : f.value = a === "ArrowDown" ? 0 : i - 1, se(f.value));
+    }
+    function Ce(e, n) {
+      var i, c, y;
+      if (!I.value)
+        return;
+      e.preventDefault();
+      const a = n ? ((i = K.value) == null ? void 0 : i[n]) ?? ((c = K.value) == null ? void 0 : c[0]) : (y = K.value) == null ? void 0 : y[0];
+      L(a) || fe(a);
+    }
+    async function se(e) {
+      var a, i;
+      await ue(), typeof e != "number" && ie();
+      const n = e ?? f.value;
+      if (typeof n == "number" && n >= 0) {
+        const c = (a = _.value) == null ? void 0 : a.querySelectorAll(".m-select-list-item");
+        (i = c == null ? void 0 : c[n]) == null || i.scrollIntoView({
+          behavior: "auto",
+          block: "nearest",
+          inline: "start"
+        });
+      }
+    }
+    function ie(e) {
+      var a;
+      const n = (a = K.value) == null ? void 0 : a.findIndex((i) => {
+        var c, y;
+        return t.multiple && Array.isArray(t.modelValue) ? e ? e[t.optionValueKey] === i[t.optionValueKey] : [...t.modelValue].reverse()[0] === i[t.optionValueKey] : ((y = (c = P.value) == null ? void 0 : c[0]) == null ? void 0 : y[t.optionValueKey]) === i[t.optionValueKey];
+      });
+      f.value = n && n >= 0 ? n : 0;
+    }
+    function fe(e, n = !0) {
+      var y;
+      n && !t.multiple && ue(() => F()), T.value = "";
+      const a = (y = P.value) == null ? void 0 : y.some(
+        (w) => w[t.optionValueKey] === e[t.optionValueKey]
+      );
+      let i = P.value;
+      a && t.multiple ? i = i == null ? void 0 : i.filter(
+        (w) => w[t.optionValueKey] !== e[t.optionValueKey]
+      ) : t.multiple ? i.push(e) : i = [e];
+      const c = i.map((w) => w[t.optionValueKey]);
+      s("update:model-value", t.multiple ? c : c[0]), s("selected-option", e), Se(), ie(e), ce();
+    }
+    return (e, n) => he((m(), k(
+      "div",
+      {
+        ref_key: "mazSelectElement",
+        ref: M,
+        class: B(["m-select", [
+          { "--is-open": I.value, "--disabled": e.disabled, "--block": e.block },
+          t.class,
+          `--${e.size}`
+        ]]),
+        style: ee([e.style, { "--keyboard-selected-bg-color": le.value, "--selected-bg-color": J.value, "--selected-text-color": Z.value }])
+      },
+      [
+        q(ye, ge({
+          id: h(W),
+          ref_key: "mazInputComponent",
+          ref: j,
+          class: "m-select-input"
+        }, e.$attrs, {
+          required: e.required,
+          "border-active": z.value,
+          color: e.color,
+          "model-value": ae.value,
+          size: e.size,
+          block: "",
+          autocomplete: e.autocomplete,
+          disabled: e.disabled,
+          onFocus: H(R, ["prevent", "stop"]),
+          onBlur: H(F, ["prevent", "stop"]),
+          onClick: H(R, ["prevent", "stop"]),
+          onChange: n[0] || (n[0] = (a) => s("change", a)),
+          onInput: n[1] || (n[1] = (a) => s("input", a)),
+          onKeydown: Le
+        }), {
+          "right-icon": te(() => [
+            O("button", {
+              tabindex: "-1",
+              type: "button",
+              class: "m-select-input__toggle-button maz-custom",
+              "aria-label": `${I.value ? "collapse" : "expand"} list of options`,
+              onClick: H(Ke, ["stop"])
+            }, [
+              q(h(S), { class: "m-select-chevron maz-text-xl" })
+            ], 8, tt)
+          ]),
+          _: 1
+          /* STABLE */
+        }, 16, ["id", "required", "border-active", "color", "model-value", "size", "autocomplete", "disabled"]),
+        q(Fe, { name: ne.value }, {
+          default: te(() => [
+            I.value ? (m(), k(
+              "div",
+              {
+                key: 0,
+                ref_key: "optionsListElement",
+                ref: _,
+                class: B(["m-select-list", {
+                  "--top": e.listPosition.includes("top"),
+                  "--left": e.listPosition.includes("left"),
+                  "--right": e.listPosition.includes("right"),
+                  "--bottom": e.listPosition.includes("bottom")
+                }]),
+                style: ee({
+                  maxHeight: `${e.maxListHeight}px`,
+                  maxWidth: `${e.maxListWidth}px`,
+                  minHeight: `${e.minListHeight}px`,
+                  minWidth: `${e.minListWidth}px`
+                })
+              },
+              [
+                e.search ? (m(), A(ye, {
+                  key: 0,
+                  ref_key: "searchInputComponent",
+                  ref: x,
+                  modelValue: T.value,
+                  "onUpdate:modelValue": [
+                    n[2] || (n[2] = (a) => T.value = a),
+                    n[4] || (n[4] = (a) => f.value = 0)
+                  ],
+                  size: "sm",
+                  color: e.color,
+                  placeholder: e.searchPlaceholder,
+                  name: "search",
+                  inputmode: "search",
+                  block: "",
+                  autocomplete: "off",
+                  tabindex: "-1",
+                  class: "m-select-list__search-input maz-flex-none",
+                  "left-icon": h(v),
+                  onKeydown: n[3] || (n[3] = (a) => pe(a, !1))
+                }, null, 8, ["modelValue", "color", "placeholder", "left-icon"])) : b("v-if", !0),
+                !K.value || K.value.length <= 0 ? U(e.$slots, "no-results", { key: 1 }, () => [
+                  O("span", ot, [
+                    q(h(D), { class: "maz-h-6 maz-w-6 maz-text-normal" })
+                  ])
+                ], !0) : (m(), k("div", lt, [
+                  (m(!0), k(
+                    ve,
+                    null,
+                    He(K.value, (a, i) => (m(), k(
+                      ve,
+                      { key: i },
+                      [
+                        a.label && a.isOptGroup ? U(e.$slots, "optgroup", {
+                          key: 0,
+                          label: a.label
+                        }, () => [
+                          O(
+                            "span",
+                            at,
+                            G(a.label),
+                            1
+                            /* TEXT */
+                          )
+                        ], !0) : (m(), k("button", {
+                          key: 1,
+                          tabindex: "-1",
+                          type: "button",
+                          class: B(["m-select-list-item maz-custom maz-flex-none", [
+                            {
+                              "--is-keyboard-selected": f.value === i,
+                              "--is-selected": Q(a),
+                              "--is-none-value": L(a[e.optionValueKey])
+                            }
+                          ]]),
+                          style: ee(e.itemHeight ? { height: `${e.itemHeight}px` } : void 0),
+                          onClick: H((c) => fe(a), ["prevent", "stop"])
+                        }, [
+                          e.multiple ? (m(), A(h(d), {
+                            key: 0,
+                            tabindex: "-1",
+                            "model-value": Q(a),
+                            size: "sm",
+                            color: e.color
+                          }, null, 8, ["model-value", "color"])) : b("v-if", !0),
+                          U(e.$slots, "default", {
+                            option: a,
+                            isSelected: Q(a)
+                          }, () => [
+                            O(
+                              "span",
+                              null,
+                              G(a[e.optionLabelKey]),
+                              1
+                              /* TEXT */
+                            )
+                          ], !0)
+                        ], 14, nt))
+                      ],
+                      64
+                      /* STABLE_FRAGMENT */
+                    ))),
+                    128
+                    /* KEYED_FRAGMENT */
+                  ))
+                ]))
+              ],
+              6
+              /* CLASS, STYLE */
+            )) : b("v-if", !0)
+          ]),
+          _: 3
+          /* FORWARDED */
+        }, 8, ["name"])
+      ],
+      6
+      /* CLASS, STYLE */
+    )), [
+      [h(Re), {
+        exclude: e.excludeSelectors,
+        handler: F
+      }]
+    ]);
+  }
+}), ut = /* @__PURE__ */ we(st, [["__scopeId", "data-v-07cbef8c"]]);
+export {
+  ut as M,
+  we as _,
+  ze as u
+};