@nmorph/nmorph-ui-kit 1.0.8 → 1.0.10

package/dist/index.es.js

@@ -1,9 +1,9 @@
 import { createI18n as ft, useI18n as ke } from "vue-i18n";
 import { ref as y, reactive as ce, watch as q, readonly as De, inject as N, onMounted as ae, onUnmounted as he, nextTick as me, defineComponent as H, computed as c, openBlock as i, createElementBlock as d, normalizeClass as T, createElementVNode as f, createBlock as R, unref as v, renderSlot as B, toDisplayString as U, createCommentVNode as E, useCssVars as I, normalizeStyle as te, resolveDynamicComponent as _t, createTextVNode as oe, createVNode as S, withCtx as j, Fragment as K, renderList as X, provide as ee, Teleport as ge, withModifiers as re, mergeProps as ye, withDirectives as Oe, vShow as Ve, useSlots as Ee, TransitionGroup as be, withKeys as ve, resolveComponent as Pe } from "vue";
 const Se = (e) => {
-  const { inputValue: l, rules: t } = e, a = y([]), n = y(!1), r = y(!1);
+  const { inputValue: l, rules: t } = e, a = y([]), n = y(!1), s = y(!1);
   return {
-    touched: r,
+    touched: s,
     valid: n,
     errors: a,
     validate: () => {
@@ -19,7 +19,7 @@ const Se = (e) => {
         console.warn("The input value and the provided rules do not match");
         return;
       }
-      if (r.value || (r.value = !0), w) {
+      if (s.value || (s.value = !0), w) {
         const b = t;
         a.value = b.reduce((x, h) => (u.match(h.pattern) || x.push(h.error), x), []);
       }
@@ -94,10 +94,10 @@ const Se = (e) => {
 }, gt = (e, l) => {
   console.log(`%c ${l} `, `background: ${Ze[e].bg}; color: ${Ze[e].text}`);
 }, yt = (e, l = !1) => {
-  const t = ce({}), a = ce({}), n = ce(Je(e)), r = y(!1), s = y(!1), o = () => {
+  const t = ce({}), a = ce({}), n = ce(Je(e)), s = y(!1), r = y(!1), o = () => {
     Object.entries(e).forEach(([C, m]) => {
       a[C] = Se({ inputValue: m.value, rules: m.rules }), a[C].validate();
-    }), r.value = Object.entries(a).every(([C, m]) => m.valid);
+    }), s.value = Object.entries(a).every(([C, m]) => m.valid);
   }, u = () => {
     Object.entries(e).forEach(([C, m]) => {
       t[C] = Se({ inputValue: m.value, rules: m.rules }), t[C].validate();
@@ -110,14 +110,14 @@ const Se = (e) => {
     p(n, C).forEach((g) => {
       const _ = C[g];
       t[g] = Se({ inputValue: _.value, rules: _.rules }), t[g].validate();
-    }), Object.assign(n, Je(C)), o(), s.value = !0;
+    }), Object.assign(n, Je(C)), o(), r.value = !0;
   }, { deep: !0 }), l && u(), {
     fields: t,
-    isFormValid: De(r),
-    isAnyTouched: De(s)
+    isFormValid: De(s),
+    isAnyTouched: De(r)
   };
 }, nt = (e) => {
-  const { initialPlacement: l, relativeElement: t, contentDOMElement: a, yOffset: n = 0, xOffset: r = 0 } = e, s = y(l), o = y({ x: "0px", y: "0px" }), u = N("nmorph"), p = y(null);
+  const { initialPlacement: l, relativeElement: t, contentDOMElement: a, yOffset: n = 0, xOffset: s = 0 } = e, r = y(l), o = y({ x: "0px", y: "0px" }), u = N("nmorph"), p = y(null);
   q(
     () => u.browser,
     () => {
@@ -155,11 +155,11 @@ const Se = (e) => {
         return;
       }
       const k = h.getBoundingClientRect(), { x: M, y: A } = k, P = k.width, $ = k.height, O = window.innerWidth, D = window.innerHeight;
-      s.value === "top" && A - x < 0 && (s.value = "bottom"), s.value === "bottom" && A + $ + x > D && (s.value = "top"), s.value === "left" && M - b < 0 && (s.value = "right"), s.value === "right" && M + P + b > O && (s.value = "left"), s.value === "top" && (o.value = { x: `${M + r}px`, y: `${A - x + n}px` }), s.value === "bottom" && (o.value = { x: `${M + r}px`, y: `${A + $ + n}px` }), s.value === "right" && (o.value = { x: `${M + P + r}px`, y: `${A + n}px` }), s.value === "left" && (o.value = { x: `${M - b + r}px`, y: `${A + n}px` });
+      r.value === "top" && A - x < 0 && (r.value = "bottom"), r.value === "bottom" && A + $ + x > D && (r.value = "top"), r.value === "left" && M - b < 0 && (r.value = "right"), r.value === "right" && M + P + b > O && (r.value = "left"), r.value === "top" && (o.value = { x: `${M + s}px`, y: `${A - x + n}px` }), r.value === "bottom" && (o.value = { x: `${M + s}px`, y: `${A + $ + n}px` }), r.value === "right" && (o.value = { x: `${M + P + s}px`, y: `${A + n}px` }), r.value === "left" && (o.value = { x: `${M - b + s}px`, y: `${A + n}px` });
     });
   };
-  return { placement: s, placementCoords: o };
-}, bt = "@nmorph/nmorph-ui-kit", kt = "module", $t = "1.0.8", xt = "MIT", wt = {
+  return { placement: r, placementCoords: o };
+}, bt = "@nmorph/nmorph-ui-kit", kt = "module", $t = "1.0.10", xt = "MIT", wt = {
   node: "18.13.0",
   npm: "8.19.3"
 }, Ct = "./dist/index.d.ts", Mt = "./dist/index.umd.js", St = "./dist/index.es.js", Tt = "./dist/style.css", Bt = [
@@ -311,8 +311,8 @@ const Se = (e) => {
 }, Ie = (e, l) => {
   let t = parseInt(e.substring(1, 3), 16), a = parseInt(e.substring(3, 5), 16), n = parseInt(e.substring(5, 7), 16);
   t = Math.round(t * (1 + l / 100)), a = Math.round(a * (1 + l / 100)), n = Math.round(n * (1 + l / 100)), t = Math.min(255, Math.max(0, t)), a = Math.min(255, Math.max(0, a)), n = Math.min(255, Math.max(0, n));
-  const r = t.toString(16).padStart(2, "0"), s = a.toString(16).padStart(2, "0"), o = n.toString(16).padStart(2, "0");
-  return `#${r}${s}${o}`;
+  const s = t.toString(16).padStart(2, "0"), r = a.toString(16).padStart(2, "0"), o = n.toString(16).padStart(2, "0");
+  return `#${s}${r}${o}`;
 }, qt = (e) => {
   gt("warn", `NMORPH(v${Pt.version})`);
   const l = { ...jt, ...e }, t = (g) => {
@@ -347,17 +347,17 @@ const Se = (e) => {
         ${x}
       }
     `;
-  }, r = {};
+  }, s = {};
   Object.entries(l.themes).forEach(([g, _]) => {
-    r[g] = [];
+    s[g] = [];
     const b = !!_.darkShade, x = !!_.lightShade;
-    !!_.main && !b && !x && (r[g] = t(_.main)), r[g] = [...r[g], ...a(_)];
+    !!_.main && !b && !x && (s[g] = t(_.main)), s[g] = [...s[g], ...a(_)];
   });
-  const s = document.createElement("style");
-  s.type = "text/css", s.innerHTML = n(r, l.other), document.head.appendChild(s);
+  const r = document.createElement("style");
+  r.type = "text/css", r.innerHTML = n(s, l.other), document.head.appendChild(r);
   const o = (g) => {
     u.value = g, p.setAttribute(pe, u.value), l.saveCurrentThemeToLS ? localStorage.setItem(pe, g) : localStorage.removeItem(pe);
-  }, u = y(l.defaultTheme), p = document.querySelector("html"), w = localStorage.getItem(pe), C = r[w];
+  }, u = y(l.defaultTheme), p = document.querySelector("html"), w = localStorage.getItem(pe), C = s[w];
   l.saveCurrentThemeToLS && C && (u.value = localStorage.getItem(pe)), o(u.value);
   const m = l;
   return { setTheme: o, currentTheme: De(u), data: m, getDynamicColorVariables: t };
@@ -518,13 +518,13 @@ const Ae = {
     clearTimeout(t), t = setTimeout(() => {
       e.value.width = window.innerWidth, e.value.height = window.innerHeight;
     }, 400);
-  }, r = () => {
+  }, s = () => {
     clearTimeout(a), a = setTimeout(() => {
       l.value = window.scrollY;
     }, 400);
   };
-  return window && (window.addEventListener("resize", n), window.addEventListener("scroll", r)), he(() => {
-    window.removeEventListener("resize", n), window.removeEventListener("scroll", r);
+  return window && (window.addEventListener("resize", n), window.addEventListener("scroll", s)), he(() => {
+    window.removeEventListener("resize", n), window.removeEventListener("scroll", s);
   }), {
     dimensions: e,
     scrollTop: l
@@ -536,16 +536,16 @@ const Ae = {
     fill: !0,
     width: "330px"
   }, t = (n) => {
-    const r = {
+    const s = {
       id: String(Date.now()),
       ...l
-    }, s = ce({
-      ...r,
+    }, r = ce({
+      ...s,
       ...n
     });
-    e.value.push(s), s.duration !== 0 && setTimeout(() => a(s.id), s.duration);
+    e.value.push(r), r.duration !== 0 && setTimeout(() => a(r.id), r.duration);
   }, a = (n) => {
-    e.value = e.value.filter((r) => r.id !== n);
+    e.value = e.value.filter((s) => s.id !== n);
   };
   return {
     notifications: e,
@@ -581,11 +581,11 @@ const Ae = {
           `${t.icon && "icon"}`
         ]
       })
-    ), n = y(null), r = {
+    ), n = y(null), s = {
       thin: "small",
       default: "medium",
       thick: "large"
-    }, s = c(() => r[t.height]);
+    }, r = c(() => s[t.height]);
     return l({ buttonDOMElement: n }), (o, u) => (i(), d("div", {
       class: T(a.value)
     }, [
@@ -607,7 +607,7 @@ const Ae = {
           t.loading ? (i(), R(v(z), {
             key: 1,
             name: "loader",
-            size: s.value
+            size: r.value
           }, null, 8, ["size"])) : E("", !0),
           B(o.$slots, "append")
         ]))
@@ -630,8 +630,8 @@ const ra = {
     path: { default: "" }
   },
   setup(e) {
-    I((s) => ({
-      "803f23de": r.value
+    I((o) => ({
+      "367223c6": s.value
     }));
     const l = e, t = c(
       () => V({
@@ -642,28 +642,29 @@ const ra = {
         ]
       })
     ), a = y(null), n = c(() => {
-      const s = {};
-      return l.width && (s["--width"] = l.width), l.height && (s["--height"] = l.height), s;
-    }), r = c(() => l.color);
+      const o = {};
+      return l.width && (o["--width"] = l.width), l.height && (o["--height"] = l.height), o;
+    }), s = c(() => l.color), r = {
+      audio: import("./audio-d94a2612.js")
+    };
     return q(
       () => l.name,
-      async (s) => {
-        if (s)
+      async (o) => {
+        if (o)
           try {
-            const o = "./";
-            a.value = (await import(`${o}assets/icons/${s}.svg`)).default;
-          } catch (o) {
-            console.error(`Icon ${s} could not be loaded`, o), a.value = null;
+            a.value = await r.audio;
+          } catch (u) {
+            console.error(`Icon ${o} could not be loaded`, u), a.value = null;
           }
       },
       { immediate: !0 }
-    ), (s, o) => (i(), d("div", {
+    ), (o, u) => (i(), d("div", {
       class: T(t.value),
       style: te(n.value)
     }, [
       l.name ? (i(), d("div", ra, [
         (i(), R(_t(a.value)))
-      ])) : B(s.$slots, "default", { key: 1 })
+      ])) : B(o.$slots, "default", { key: 1 })
     ], 6));
   }
 });
@@ -736,13 +737,13 @@ const Ro = /* @__PURE__ */ H({
       "6ab0c31b": Q.value,
       e0c171ca: m.value,
       "4956b50c": g.value,
-      73570806: s.value,
-      73570807: r.value,
+      73570806: r.value,
+      73570807: s.value,
       "14ef4acf": Y.value,
       "6253ec03": _.value,
       "634acaec": b.value
     }));
-    const a = e, n = y(null), r = c(() => a.scrollYProp), s = c(() => a.scrollXProp), o = y(!1), u = y(!1), p = () => {
+    const a = e, n = y(null), s = c(() => a.scrollYProp), r = c(() => a.scrollXProp), o = y(!1), u = y(!1), p = () => {
       o.value = n.value?.scrollHeight > n.value?.clientHeight, u.value = n.value?.scrollWidth > n.value?.clientWidth;
     }, w = c(() => a.yBarWidthInPx + a.yGapInPx), C = c(() => a.xBarWidthInPx + a.xGapInPx), m = c(
       () => a.scrollYProp === "hidden" || !o.value ? "0" : `${w.value}px`
@@ -830,18 +831,18 @@ const va = /* @__PURE__ */ H({
       "11d2c240": u.value,
       "75c6801c": C.value
     }));
-    const t = e, a = l, n = y(!1), r = c(
+    const t = e, a = l, n = y(!1), s = c(
       () => V({
         nmorph: [`${t.frameBorder > 0 && "shadow-combined"}`],
         "nmorph-avatar": [t.shape]
       })
-    ), s = (g) => {
+    ), r = (g) => {
       a("error", g), n.value = !0;
     }, o = (g) => {
       a("load", g), n.value = !1;
     }, u = c(() => `${t.imagePadding}px`), p = c(() => ` ${t.size}px`), w = c(() => `${t.size / 100 * 60}px`), C = c(() => t.shape === "circle" ? "50%" : "4px"), m = c(() => `${t.frameBorder}px`);
     return (g, _) => (i(), d("div", {
-      class: T(r.value)
+      class: T(s.value)
     }, [
       S(v(He), {
         fit: t.fit,
@@ -850,7 +851,7 @@ const va = /* @__PURE__ */ H({
         alt: t.alt,
         "frame-border": 0,
         onLoad: o,
-        onError: s
+        onError: r
       }, {
         error: j(() => [
           S(v(z), {
@@ -898,15 +899,15 @@ const $e = (e, l) => {
       () => V({
         "nmorph-badge__container": [`${l.hidden && "hidden"}`]
       })
-    ), n = c(() => typeof Number(l.value) == "number" && Number(l.value) > l.max ? `${l.max}+` : l.value), r = c(() => {
+    ), n = c(() => typeof Number(l.value) == "number" && Number(l.value) > l.max ? `${l.max}+` : l.value), s = c(() => {
       const p = `${(o?.value / 2 + l.offsetX) * -1}px`, w = `${(u?.value / 2 + l.offsetY) * -1}px`;
       return {
         x: p,
         y: w
       };
-    }), s = y(null), o = y(0), u = y(0);
+    }), r = y(null), o = y(0), u = y(0);
     return ae(() => {
-      s.value && (o.value = s.value.clientWidth, u.value = s.value.clientHeight);
+      r.value && (o.value = r.value.clientWidth, u.value = r.value.clientHeight);
     }), (p, w) => l.disabled ? B(p.$slots, "default", { key: 1 }) : (i(), d("div", {
       key: 0,
       class: T(t.value)
@@ -914,9 +915,9 @@ const $e = (e, l) => {
       B(p.$slots, "default"),
       f("div", {
         ref_key: "badge",
-        ref: s,
+        ref: r,
         class: T(a.value),
-        style: te({ right: r.value.x, top: r.value.y })
+        style: te({ right: s.value.x, top: s.value.y })
       }, [
         l.isDot ? (i(), d("div", ma)) : (i(), d("div", ha, [
           B(p.$slots, "value", {}, () => [
@@ -943,32 +944,32 @@ const fa = { class: "nmorph-calendar-header__text" }, _a = { class: "nmorph-cale
         "nmorph-calendar-header": []
       })
     );
-    return (r, s) => (i(), d("div", {
+    return (s, r) => (i(), d("div", {
       class: T(n.value)
     }, [
-      B(r.$slots, "default", {}, () => [
+      B(s.$slots, "default", {}, () => [
         f("div", fa, U(t.year) + " " + U(v(it)(t.month)), 1),
         f("div", _a, [
-          r.showPreviousMonthButton ? (i(), R(v(G), {
+          s.showPreviousMonthButton ? (i(), R(v(G), {
             key: 0,
             class: "nmorph-calendar-header__action",
-            onClick: s[0] || (s[0] = (o) => a("click-previous-month"))
+            onClick: r[0] || (r[0] = (o) => a("click-previous-month"))
           }, {
             default: j(() => [
               S(v(z), { name: "arrow-left" })
             ]),
             _: 1
           })) : E("", !0),
-          r.showTodayButton ? (i(), R(v(G), {
+          s.showTodayButton ? (i(), R(v(G), {
             key: 1,
             class: "nmorph-calendar-header__action",
             text: "Today",
-            onClick: s[1] || (s[1] = (o) => a("click-today"))
+            onClick: r[1] || (r[1] = (o) => a("click-today"))
           })) : E("", !0),
-          r.showNextMonthButton ? (i(), R(v(G), {
+          s.showNextMonthButton ? (i(), R(v(G), {
             key: 2,
             class: "nmorph-calendar-header__action",
-            onClick: s[2] || (s[2] = (o) => a("click-next-month"))
+            onClick: r[2] || (r[2] = (o) => a("click-next-month"))
           }, {
             default: j(() => [
               S(v(z), { name: "arrow-right" })
@@ -997,9 +998,9 @@ const ya = ["jan", "feb", "mar", "apr", "may", "jun", "jul", "aug", "sep", "oct"
   },
   emits: ["update:model-value", "update-initial-date"],
   setup(e, { emit: l }) {
-    const t = e, a = l, { days: n } = Ye(), r = () => {
+    const t = e, a = l, { days: n } = Ye(), s = () => {
       g.value = h.value;
-    }, s = () => {
+    }, r = () => {
       g.value = /* @__PURE__ */ new Date();
     }, o = () => {
       g.value = k.value;
@@ -1030,7 +1031,7 @@ const ya = ["jan", "feb", "mar", "apr", "may", "jun", "jul", "aug", "sep", "oct"
       const { monthType: O, hidden: D } = $;
       if (D)
         return;
-      O === "next" && o(), O === "previous" && r();
+      O === "next" && o(), O === "previous" && s();
       const { date: Y } = $;
       if (t.type === "date" && (_.value = Y, a("update:model-value", _.value)), t.type === "dates") {
         if (!Array.isArray(_.value))
@@ -1108,8 +1109,8 @@ const ya = ["jan", "feb", "mar", "apr", "may", "jun", "jul", "aug", "sep", "oct"
           "show-today-button": M.value.showTodayButton,
           "show-next-month-button": M.value.showNextMonthButton,
           onClickNextMonth: o,
-          onClickPreviousMonth: r,
-          onClickToday: s
+          onClickPreviousMonth: s,
+          onClickToday: r
         }, null, 8, ["year", "month", "show-previous-month-button", "show-today-button", "show-next-month-button"])
       ]),
       B($.$slots, "content", {}, () => [
@@ -1191,7 +1192,7 @@ const xa = (e) => {
   const { months: l } = Ye();
   return l[e];
 }, Sa = (e) => e % 4 === 0 && e % 100 !== 0 || e % 400 === 0, tt = (e, l) => [0, 2, 4, 6, 7, 9, 11].includes(l) ? 31 : [3, 5, 8, 10].includes(l) ? 30 : Sa(e) ? 29 : 28, ue = (e) => new Date(e.getFullYear(), e.getMonth(), e.getDate()), Ta = (e, l) => {
-  const t = (F) => l ? F < ue(l[0]) || F > ue(l[1]) : !1, a = e.value.getFullYear(), n = e.value.getMonth(), s = new Date(a, n, 1).getDay() + 1, o = tt(a, n), u = 7 + s - 8;
+  const t = (F) => l ? F < ue(l[0]) || F > ue(l[1]) : !1, a = e.value.getFullYear(), n = e.value.getMonth(), r = new Date(a, n, 1).getDay() + 1, o = tt(a, n), u = 7 + r - 8;
   let C = 7 - (new Date(a, n, o).getDay() + 1);
   const m = /* @__PURE__ */ new Date(), g = m.getDate(), _ = m.getMonth(), b = n - 1, x = tt(a, b);
   let h = x - u;
@@ -1256,7 +1257,7 @@ const xa = (e) => {
         "nmorph-card": [l.shadowType]
       })
     ), a = c(() => `${l.combinedShadowBorderWidth}px`);
-    return (n, r) => (i(), d("div", {
+    return (n, s) => (i(), d("div", {
       class: T(t.value)
     }, [
       f("div", Ba, [
@@ -1282,7 +1283,7 @@ const Wo = /* @__PURE__ */ $e(Va, [["__scopeId", "data-v-e3cb136f"]]), Ha = ["id
       t.value = t.value + 1;
     }, n = () => {
       t.value = t.value - 1;
-    }, r = e, s = l, o = c(
+    }, s = e, r = l, o = c(
       () => V({
         "nmorph-carousel": []
       })
@@ -1295,9 +1296,9 @@ const Wo = /* @__PURE__ */ $e(Va, [["__scopeId", "data-v-e3cb136f"]]), Ha = ["id
       t.value === 0 && (t.value = Object.keys(C).length, x.value = !1), t.value > Object.keys(C).length && (t.value = 1, x.value = !1);
     };
     ae(() => {
-      r.loop && t.value === 0 && (me(() => m()), w.value?.addEventListener("transitionend", g));
+      s.loop && t.value === 0 && (me(() => m()), w.value?.addEventListener("transitionend", g));
     }), q(t, (M) => {
-      s("change", t.value), (M === 1 || M === Object.keys(C).length) && setTimeout(() => {
+      r("change", t.value), (M === 1 || M === Object.keys(C).length) && setTimeout(() => {
         x.value = !0;
       });
     });
@@ -1364,14 +1365,14 @@ const Uo = /* @__PURE__ */ H({
     ), a = N("carousel-data", void 0), n = y(!1);
     return ae(() => {
       n.value = !0, a && a.data.value.push(l.name);
-    }), (r, s) => n.value ? (i(), d("div", {
+    }), (s, r) => n.value ? (i(), d("div", {
       key: 0,
       class: T(t.value)
     }, [
       (i(), R(ge, {
         to: `#nmorph-carousel-item-${v(a)?.carouselId}-${l.name}`
       }, [
-        B(r.$slots, "default")
+        B(s.$slots, "default")
       ], 8, ["to"]))
     ], 2)) : E("", !0);
   }
@@ -1399,16 +1400,16 @@ const Uo = /* @__PURE__ */ H({
         const p = a.value.indexOf(o);
         u && p === -1 && a.value.push(o), !u && p !== -1 && a.value.splice(p, 1);
       }
-      r("update:model-value", a.value);
+      s("update:model-value", a.value);
     };
     ee("collapse-data", a), ee("update-model", n);
-    const r = l, s = c(
+    const s = l, r = c(
       () => V({
         "nmorph-collapse": []
       })
     );
     return (o, u) => (i(), d("div", {
-      class: T(s.value)
+      class: T(r.value)
     }, [
       B(o.$slots, "default")
     ], 2));
@@ -1424,11 +1425,11 @@ const Uo = /* @__PURE__ */ H({
   },
   emits: ["click-item"],
   setup(e, { emit: l }) {
-    const t = e, a = l, n = y(!1), r = c(
+    const t = e, a = l, n = y(!1), s = c(
       () => V({
         "nmorph-collapse-item": [`${t.disabled && "disabled"}`, `${n.value && "is-open"}`]
       })
-    ), s = c(
+    ), r = c(
       () => V({
         nmorph: [se[t.height]]
       })
@@ -1446,11 +1447,11 @@ const Uo = /* @__PURE__ */ H({
     ), q(n, () => {
       w.value = n.value && p.value ? p.value?.clientHeight : 0;
     }), (m, g) => (i(), d("div", {
-      class: T(r.value),
+      class: T(s.value),
       onClick: re(C, ["stop"])
     }, [
       f("div", {
-        class: T(["nmorph-collapse-item__title", s.value])
+        class: T(["nmorph-collapse-item__title", r.value])
       }, [
         B(m.$slots, "title", {}, () => [
           oe(U(t.title), 1)
@@ -1494,16 +1495,16 @@ const Aa = ["src", "alt", "srcset"], Fa = {
       "038c8bec": _.value,
       "6b4fbaa3": g.value
     }));
-    const { t } = ke(), a = e, n = c(() => a.loadingText ? a.loadingText : t("NmorphImage.loadingText")), r = c(
+    const { t } = ke(), a = e, n = c(() => a.loadingText ? a.loadingText : t("NmorphImage.loadingText")), s = c(
       () => a.loadFailedText ? a.loadFailedText : t("NmorphImage.loadFailedText")
-    ), s = y(!1), o = y(!1), u = l, p = (b) => {
-      s.value = !0, o.value = !1, u("load", b);
+    ), r = y(!1), o = y(!1), u = l, p = (b) => {
+      r.value = !0, o.value = !1, u("load", b);
     }, w = (b) => {
-      s.value = !0, o.value = !0, u("error", b);
-    }, C = c(() => s.value && o.value), m = c(
+      r.value = !0, o.value = !0, u("error", b);
+    }, C = c(() => r.value && o.value), m = c(
       () => V({
         nmorph: [`${a.frameBorder > 0 && "shadow-combined"}`],
-        "nmorph-image": [`${(C.value || !s.value) && "hide"}`]
+        "nmorph-image": [`${(C.value || !r.value) && "hide"}`]
       })
     ), g = c(() => a.fit), _ = c(() => `${a.frameBorder}px`);
     return (b, x) => a.src ? (i(), d("div", {
@@ -1519,9 +1520,9 @@ const Aa = ["src", "alt", "srcset"], Fa = {
       }, null, 40, Aa),
       C.value ? (i(), d("div", Fa, [
         B(b.$slots, "error", {}, () => [
-          oe(U(r.value), 1)
+          oe(U(s.value), 1)
         ], !0)
-      ])) : s.value ? E("", !0) : (i(), d("div", Ra, [
+      ])) : r.value ? E("", !0) : (i(), d("div", Ra, [
         B(b.$slots, "loading", {}, () => [
           oe(U(n.value), 1)
         ], !0)
@@ -1557,7 +1558,7 @@ const He = /* @__PURE__ */ $e(za, [["__scopeId", "data-v-4c8df10c"]]), ja = { cl
       () => V({
         "nmorph-image-preview": [`${a.value && "opened"}`]
       })
-    ), r = y(t.initialIndex), s = c(() => typeof t.src == "string" ? t.src : t.src[r.value]), o = y(1), u = () => {
+    ), s = y(t.initialIndex), r = c(() => typeof t.src == "string" ? t.src : t.src[s.value]), o = y(1), u = () => {
       a.value = !0, $("update:model-value", a.value);
     }, p = () => {
       a.value = !1, $("update:model-value", a.value);
@@ -1574,11 +1575,11 @@ const He = /* @__PURE__ */ $e(za, [["__scopeId", "data-v-4c8df10c"]]), ja = { cl
     }, x = () => {
       o.value = 1;
     }, h = y(0), k = () => {
-      const D = t.src.length - 1, Y = r.value - 1;
-      Y < 0 ? r.value = D : r.value = Y;
+      const D = t.src.length - 1, Y = s.value - 1;
+      Y < 0 ? s.value = D : s.value = Y;
     }, M = () => {
-      const D = t.src.length - 1, Y = r.value + 1;
-      Y > D ? r.value = 0 : r.value = Y;
+      const D = t.src.length - 1, Y = s.value + 1;
+      Y > D ? s.value = 0 : s.value = Y;
     }, A = c(() => {
       let D = {
         icon: "shrink",
@@ -1614,7 +1615,7 @@ const He = /* @__PURE__ */ $e(za, [["__scopeId", "data-v-4c8df10c"]]), ja = { cl
         onClick: u
       }, [
         S(v(He), {
-          src: s.value,
+          src: r.value,
           alt: t.alt,
           fit: "cover"
         }, null, 8, ["src", "alt"])
@@ -1626,7 +1627,7 @@ const He = /* @__PURE__ */ $e(za, [["__scopeId", "data-v-4c8df10c"]]), ja = { cl
         default: j(() => [
           f("div", ja, [
             S(v(He), {
-              src: s.value,
+              src: r.value,
               alt: t.alt,
               fit: "cover",
               style: te({ transform: `rotate(${h.value}deg) scale(${o.value})` })
@@ -1701,9 +1702,9 @@ const Qo = /* @__PURE__ */ H({
       () => V({
         "nmorph-pagination": [`${t.disabled && "disabled"}`]
       })
-    ), r = () => {
+    ), s = () => {
       o.value = String(Number(o.value) - 1);
-    }, s = () => {
+    }, r = () => {
       o.value = String(Number(o.value) + 1);
     }, o = y(String(t.modelValue)), u = c(() => {
       const b = t.totalElementsQuantity / t.elementsQuantityOnPage + 1, x = b % 1 === 0 ? -1 : 0;
@@ -1738,7 +1739,7 @@ const Qo = /* @__PURE__ */ H({
       S(v(G), {
         class: "nmorph-pagination__btn nmorph-pagination__prev-btn",
         disabled: C.value || t.disabled,
-        onClick: r
+        onClick: s
       }, {
         default: j(() => [
           S(v(z), {
@@ -1779,7 +1780,7 @@ const Qo = /* @__PURE__ */ H({
       S(v(G), {
         class: "nmorph-pagination__btn nmorph-pagination__next-btn",
         disabled: m.value || t.disabled,
-        onClick: s
+        onClick: r
       }, {
         default: j(() => [
           S(v(z), {
@@ -1819,16 +1820,16 @@ const Qa = {
     I((m) => ({
       "1ae927c9": a.value,
       "588931e9": n.value,
-      "781c6b0a": r.value,
+      "781c6b0a": s.value,
       "58c45d38": w.value
     }));
     const l = e, t = c(
       () => V({
         "nmorph-progress": []
       })
-    ), a = c(() => `${l.percentage}%`), n = c(() => Array.isArray(l.color) ? l.color.find((m) => m.percentage <= l.percentage)?.color : typeof l.color == "function" ? l.color(l.percentage) : l.color), r = c(() => l.indeterminate ? "var(--animation)" : "none"), s = y(null), o = y(1), u = c(() => `${o.value} ${o.value}`), p = c(() => o.value - l.percentage / 100 * o.value);
+    ), a = c(() => `${l.percentage}%`), n = c(() => Array.isArray(l.color) ? l.color.find((m) => m.percentage <= l.percentage)?.color : typeof l.color == "function" ? l.color(l.percentage) : l.color), s = c(() => l.indeterminate ? "var(--animation)" : "none"), r = y(null), o = y(1), u = c(() => `${o.value} ${o.value}`), p = c(() => o.value - l.percentage / 100 * o.value);
     ae(() => {
-      s.value && (o.value = 2 * Math.PI * s.value.r.baseVal.value);
+      r.value && (o.value = 2 * Math.PI * r.value.r.baseVal.value);
     });
     const w = c(() => `${l.circleSize}px`), C = c(() => `${l.percentage}%`);
     return (m, g) => (i(), d("div", {
@@ -1862,7 +1863,7 @@ const Qa = {
         }, [
           f("circle", {
             ref_key: "circle",
-            ref: s,
+            ref: r,
             class: "nmorph-progress__circle-ring",
             cx: l.circleSize / 2,
             cy: l.circleSize / 2,
@@ -1895,8 +1896,8 @@ const tl = {
       class: T(t.value)
     }, [
       l.rows && l.loading ? (i(), d("div", tl, [
-        (i(!0), d(K, null, X(l.rows, (r) => (i(), R(v(sl), {
-          key: r,
+        (i(!0), d(K, null, X(l.rows, (s) => (i(), R(v(sl), {
+          key: s,
           width: "100%",
           height: "14px",
           variant: "rect"
@@ -1925,7 +1926,7 @@ const ol = { class: "nmorph-skeleton-item__element" }, sl = /* @__PURE__ */ H({
     design: { default: "nmorph" }
   },
   setup(e) {
-    I((r) => ({
+    I((s) => ({
       "085cc1bc": a.value,
       "2d27081e": n.value
     }));
@@ -1934,7 +1935,7 @@ const ol = { class: "nmorph-skeleton-item__element" }, sl = /* @__PURE__ */ H({
         "nmorph-skeleton-item": [l.variant, `${l.design === "nmorph" ? "nmorph-design" : ""}`]
       })
     ), a = c(() => l.width), n = c(() => l.height);
-    return (r, s) => (i(), d("div", {
+    return (s, r) => (i(), d("div", {
       class: T(t.value)
     }, [
       f("div", ol, [
@@ -1959,17 +1960,17 @@ const we = "10px", rl = /* @__PURE__ */ H({
       () => V({
         "nmorph-sort-button": [`${t.value}`]
       })
-    ), r = () => {
-      const s = t.value === "ascending" ? "descending" : "ascending";
-      a("sort", s);
+    ), s = () => {
+      const r = t.value === "ascending" ? "descending" : "ascending";
+      a("sort", r);
     };
-    return (s, o) => (i(), d("div", {
+    return (r, o) => (i(), d("div", {
       class: T(n.value)
     }, [
       S(v(G), {
         height: "thin",
         "style-type": "transparent",
-        onClick: r
+        onClick: s
       }, {
         default: j(() => [
           S(v(z), {
@@ -2004,7 +2005,7 @@ const il = { class: "nmorph-table__wrapper" }, ul = { class: "nmorph-table__head
       () => V({
         "nmorph-table": [`${l.design}`]
       })
-    ), a = y(l.data), n = y(l.sort), r = (g, _) => {
+    ), a = y(l.data), n = y(l.sort), s = (g, _) => {
       n.value && (n.value[_] = g, a.value.sort((b, x) => {
         const h = String(b[_]).toLowerCase(), k = String(x[_]).toLowerCase();
         if (!n.value)
@@ -2012,11 +2013,11 @@ const il = { class: "nmorph-table__wrapper" }, ul = { class: "nmorph-table__head
         const M = n.value[_];
         return M === "ascending" ? h.localeCompare(k) : M === "descending" ? k.localeCompare(h) : 0;
       }));
-    }, s = y(null), o = y([]);
+    }, r = y(null), o = y([]);
     ee("table-data", { rows: a, columns: o });
     const u = c(() => {
       const g = o.value.map((k) => k.width).filter((k) => !!k), _ = g.length, b = g.reduce((k, M) => (k += Number(M), k), 0), x = o.value.length - _;
-      return s.value?.clientWidth ? (s.value?.clientWidth - b) / x : 0;
+      return r.value?.clientWidth ? (r.value?.clientWidth - b) / x : 0;
     }), p = (g) => g !== "" ? g : u.value, w = y(0);
     q(
       () => l.data,
@@ -2030,7 +2031,7 @@ const il = { class: "nmorph-table__wrapper" }, ul = { class: "nmorph-table__head
     const C = (g) => typeof g == "object" ? "" : g, m = de();
     return ee("table-identifier", m), (g, _) => (i(), d("div", {
       ref_key: "nmorphDOMTable",
-      ref: s,
+      ref: r,
       key: w.value,
       class: T(t.value)
     }, [
@@ -2059,7 +2060,7 @@ const il = { class: "nmorph-table__wrapper" }, ul = { class: "nmorph-table__head
                       key: 0,
                       class: "nmorph-table__button-wrapper",
                       value: n.value[b.prop],
-                      onSort: (h) => r(h, b.prop)
+                      onSort: (h) => s(h, b.prop)
                     }, null, 8, ["value", "onSort"])) : E("", !0)
                   ], 4)
                 ])
@@ -2119,16 +2120,16 @@ const _l = /* @__PURE__ */ H({
       () => V({
         "nmorph-table-cell": []
       })
-    ), r = c(() => `#table-cell-${t}-${a.row}-${l}`), s = y(!1);
+    ), s = c(() => `#table-cell-${t}-${a.row}-${l}`), r = y(!1);
     return ae(async () => {
       await me();
-      const o = document.querySelector(r.value);
-      o && (o.innerHTML = ""), s.value = !0;
-    }), (o, u) => s.value ? (i(), d("div", {
+      const o = document.querySelector(s.value);
+      o && (o.innerHTML = ""), r.value = !0;
+    }), (o, u) => r.value ? (i(), d("div", {
       key: 0,
       class: T(n.value)
     }, [
-      (i(), R(ge, { to: r.value }, [
+      (i(), R(ge, { to: s.value }, [
         B(o.$slots, "default")
       ], 8, ["to"]))
     ], 2)) : E("", !0);
@@ -2146,20 +2147,20 @@ const _l = /* @__PURE__ */ H({
       () => V({
         "nmorph-table-column": []
       })
-    ), r = y(0);
+    ), s = y(0);
     ee("column-property", a.prop), ee("table-identifier", t), ae(() => {
-      s();
+      r();
     });
-    const s = () => {
+    const r = () => {
       if (!l?.columns.value)
         return;
       const { columns: u } = l;
-      r.value = u.value.length + 1, l.columns.value = [...u.value, { ...a, id: r.value }];
+      s.value = u.value.length + 1, l.columns.value = [...u.value, { ...a, id: s.value }];
     }, o = y(null);
     return (u, p) => (i(), d("div", {
       ref_key: "columnDOMEl",
       ref: o,
-      "data-id": r.value,
+      "data-id": s.value,
       class: T(n.value)
     }, [
       B(u.$slots, "default", {
@@ -2179,17 +2180,17 @@ const _l = /* @__PURE__ */ H({
         "nmorph-list": []
       })
     );
-    let r = y(t.modelValue);
-    const s = (o) => {
-      r.value = r.value.filter((u) => u.value !== o), a("close", o), a("update:model-value", r.value);
+    let s = y(t.modelValue);
+    const r = (o) => {
+      s.value = s.value.filter((u) => u.value !== o), a("close", o), a("update:model-value", s.value);
     };
     return (o, u) => (i(), d("div", {
       class: T(n.value)
     }, [
-      (i(!0), d(K, null, X(v(r), (p) => (i(), R(v(ut), ye({
+      (i(!0), d(K, null, X(v(s), (p) => (i(), R(v(ut), ye({
         key: p.value,
         ref_for: !0
-      }, p, { onClose: s }), null, 16))), 128))
+      }, p, { onClose: r }), null, 16))), 128))
     ], 2));
   }
 }), bl = { class: "nmorph-tag-item__content" }, ut = /* @__PURE__ */ H({
@@ -2208,19 +2209,19 @@ const _l = /* @__PURE__ */ H({
         nmorph: [se[t.height]],
         "nmorph-tag-item": [`${t.design === "nmorph" ? "nmorph-design" : ""}`]
       })
-    ), n = l, r = () => {
+    ), n = l, s = () => {
       n("close", t.value);
     };
-    return (s, o) => (i(), d("div", {
+    return (r, o) => (i(), d("div", {
       class: T(a.value)
     }, [
       f("div", bl, [
-        f("span", null, U(s.text), 1),
+        f("span", null, U(r.text), 1),
         t.removable ? (i(), R(v(z), {
           key: 0,
           class: "nmorph-tag-item__close-icon",
           name: "error",
-          onClick: re(r, ["stop"])
+          onClick: re(s, ["stop"])
         })) : E("", !0)
       ])
     ], 2));
@@ -2255,9 +2256,9 @@ const kl = ["innerHTML"], $l = {
       () => V({
         "nmorph-alert": [t.type, `${t.bordered && "bordered"}`, `${t.fill && "fill"}`]
       })
-    ), r = () => {
+    ), s = () => {
       a("close");
-    }, s = {
+    }, r = {
       [_e.success]: "success-filled",
       [_e.warning]: "warn-triangle-filled",
       [_e.info]: "info-filled",
@@ -2276,7 +2277,7 @@ const kl = ["innerHTML"], $l = {
           t.showIcon ? (i(), d("div", wl, [
             B(p.$slots, "icon", {}, () => [
               S(v(z), {
-                name: s[t.type],
+                name: r[t.type],
                 size: "medium"
               }, null, 8, ["name"])
             ])
@@ -2297,7 +2298,7 @@ const kl = ["innerHTML"], $l = {
         t.closable ? (i(), d("div", {
           key: 0,
           class: "nmorph-alert__close",
-          onClick: r
+          onClick: s
         }, [
           S(v(z), {
             name: "cross",
@@ -2326,14 +2327,14 @@ const Bl = { class: "nmorph-dialog__header" }, Dl = { class: "nmorph-dialog__tit
   emits: ["on-close", "update:model-value"],
   setup(e, { emit: l }) {
     I((m) => ({
-      "097fcdea": r.value,
-      "4478cc6c": s.value
+      "097fcdea": s.value,
+      "4478cc6c": r.value
     }));
     const t = e, a = l, n = c(
       () => V({
         "nmorph-dialog": []
       })
-    ), r = c(() => t.width), s = c(() => t.zIndex), o = y(t.modelValue);
+    ), s = c(() => t.width), r = c(() => t.zIndex), o = y(t.modelValue);
     let u = null, p = null;
     q(
       () => t.modelValue,
@@ -2400,14 +2401,14 @@ const Vl = { class: "nmorph-tooltip__shadow-content" }, Hl = {
     I((m) => ({
       "6d1447a0": w.value
     }));
-    const t = e, a = y(t.forceShow), n = y(null), r = y(null), { placement: s } = nt({
+    const t = e, a = y(t.forceShow), n = y(null), s = y(null), { placement: r } = nt({
       initialPlacement: t.position,
       contentDOMElement: n,
-      relativeElement: r
+      relativeElement: s
     }), o = c(
       () => V({
         "nmorph-tooltip": [
-          s.value,
+          r.value,
           `${!!t.forceCoordinate?.x && !!t.forceCoordinate?.y && "force-coords"}`
         ]
       })
@@ -2428,7 +2429,7 @@ const Vl = { class: "nmorph-tooltip__shadow-content" }, Hl = {
       }, [
         f("div", {
           ref_key: "slotDOMRef",
-          ref: r
+          ref: s
         }, [
           B(m.$slots, "default")
         ], 512),
@@ -2509,42 +2510,42 @@ const Rl = {
     ), n = N(
       "change-checkbox-value-handler",
       void 0
-    ), r = e;
+    ), s = e;
     q(
-      () => r.modelValue,
+      () => s.modelValue,
       (g) => {
         u.value = g;
       }
     );
-    const s = y(null);
-    l({ inputDOMRef: s });
-    const o = a !== void 0, u = o ? y(a.value) : y(r.modelValue), p = c(() => o ? a.value.includes(r.id) : r.modelValue), w = t, C = () => {
-      if (!r.disabled) {
+    const r = y(null);
+    l({ inputDOMRef: r });
+    const o = a !== void 0, u = o ? y(a.value) : y(s.modelValue), p = c(() => o ? a.value.includes(s.id) : s.modelValue), w = t, C = () => {
+      if (!s.disabled) {
         if (!o) {
           u.value = !u.value, w("update:model-value", u.value);
           return;
         }
-        n && Array.isArray(u.value) && n(r.id, u.value);
+        n && Array.isArray(u.value) && n(s.id, u.value);
       }
     }, m = c(
       () => V({
         "nmorph-checkbox": [
           `${p.value && "checked"}`,
-          `${r.disabled && "disabled"}`,
-          `${r.design === "button" && "button"}`
+          `${s.disabled && "disabled"}`,
+          `${s.design === "button" && "button"}`
         ]
       })
     );
     return (g, _) => (i(), d("label", {
       class: T(m.value)
     }, [
-      r.design === "checkbox" ? (i(), d("div", Rl, [
+      s.design === "checkbox" ? (i(), d("div", Rl, [
         f("div", zl, [
           f("input", {
             ref_key: "inputDOMRef",
-            ref: s,
+            ref: r,
             type: "checkbox",
-            disabled: r.disabled,
+            disabled: s.disabled,
             checked: p.value,
             class: "nmorph-native-input",
             onChange: C
@@ -2552,23 +2553,23 @@ const Rl = {
           _[0] || (_[0] = f("div", { class: "nmorph-checkbox__fake" }, null, -1)),
           p.value ? (i(), d("div", Wl)) : E("", !0)
         ]),
-        r.label ? (i(), d("div", Yl, [
-          f("span", null, U(r.label), 1)
+        s.label ? (i(), d("div", Yl, [
+          f("span", null, U(s.label), 1)
         ])) : (i(), d("div", Ul, [
           B(g.$slots, "default")
         ]))
       ])) : E("", !0),
-      r.design === "button" ? (i(), d("div", ql, [
+      s.design === "button" ? (i(), d("div", ql, [
         f("input", {
           ref_key: "inputDOMRef",
-          ref: s,
+          ref: r,
           type: "checkbox",
-          disabled: r.disabled,
+          disabled: s.disabled,
           checked: p.value,
           onChange: C
         }, null, 40, Gl),
-        r.label ? (i(), d("div", Ql, [
-          f("span", null, U(r.label), 1)
+        s.label ? (i(), d("div", Ql, [
+          f("span", null, U(s.label), 1)
         ])) : (i(), d("div", Kl, [
           B(g.$slots, "label")
         ]))
@@ -2588,15 +2589,15 @@ const Jl = { class: "nmorph-checkbox-group__wrapper" }, Zl = { class: "nmorph-ch
   },
   emits: ["update:model-value"],
   setup(e, { emit: l }) {
-    const t = e, a = y(t.modelValue), n = l, r = (o) => {
+    const t = e, a = y(t.modelValue), n = l, s = (o) => {
       a.value.includes(o) ? a.value = a.value.filter((u) => u !== o) : a.value.push(o), n("update:model-value", a.value);
-    }, s = c(
+    }, r = c(
       () => V({
         "nmorph-checkbox-group": [t.design, t.direction]
       })
     );
-    return ee("checkbox-group-selected-value", a), ee("change-checkbox-value-handler", r), (o, u) => (i(), d("div", {
-      class: T(s.value)
+    return ee("checkbox-group-selected-value", a), ee("change-checkbox-value-handler", s), (o, u) => (i(), d("div", {
+      class: T(r.value)
     }, [
       f("div", Jl, [
         f("div", Zl, [
@@ -2633,11 +2634,11 @@ const Nl = { class: "nmorph-autocomplete__input-content" }, Il = {
   },
   emits: ["update:model-value", "select"],
   setup(e, { emit: l }) {
-    const t = e, a = y(t.modelValue), n = l, r = c(
+    const t = e, a = y(t.modelValue), n = l, s = c(
       () => V({
         "nmorph-autocomplete": []
       })
-    ), s = (_) => {
+    ), r = (_) => {
       a.value = _, n("update:model-value", a.value);
     }, o = y(!1), u = y(null), p = () => {
       o.value = !1;
@@ -2657,7 +2658,7 @@ const Nl = { class: "nmorph-autocomplete__input-content" }, Il = {
     }), q(g, (_) => {
       _ && (o.value = !0);
     }), (_, b) => (i(), d("div", {
-      class: T(r.value)
+      class: T(s.value)
     }, [
       f("div", Nl, [
         f("div", {
@@ -2672,7 +2673,7 @@ const Nl = { class: "nmorph-autocomplete__input-content" }, Il = {
             placeholder: t.placeholder,
             clearable: t.clearable,
             onFocus: m,
-            "onUpdate:modelValue": s
+            "onUpdate:modelValue": r
           }, null, 8, ["height", "disabled", "model-value", "placeholder", "clearable"])
         ], 512)
       ]),
@@ -2717,12 +2718,12 @@ const tn = /* @__PURE__ */ H({
         "nmorph-input-clear-button": []
       })
     );
-    return (n, r) => (i(), d("div", {
+    return (n, s) => (i(), d("div", {
       class: T(a.value)
     }, [
       S(v(z), {
         name: "error",
-        onClick: r[0] || (r[0] = re((s) => t("clear"), ["stop"]))
+        onClick: s[0] || (s[0] = re((r) => t("clear"), ["stop"]))
       })
     ], 2));
   }
@@ -2739,14 +2740,14 @@ const tn = /* @__PURE__ */ H({
         "nmorph-date-picker-header": []
       })
     );
-    return (r, s) => (i(), d("div", {
+    return (s, r) => (i(), d("div", {
       class: T(n.value)
     }, [
       f("div", an, [
         S(v(G), {
           class: "nmorph-date-picker-header__action-btn",
           "style-type": "transparent",
-          onClick: s[0] || (s[0] = (o) => a("prev-year")),
+          onClick: r[0] || (r[0] = (o) => a("prev-year")),
           tabindex: -1
         }, {
           default: j(() => [
@@ -2760,7 +2761,7 @@ const tn = /* @__PURE__ */ H({
         S(v(G), {
           class: "nmorph-date-picker-header__action-btn",
           "style-type": "transparent",
-          onClick: s[1] || (s[1] = (o) => a("prev-month")),
+          onClick: r[1] || (r[1] = (o) => a("prev-month")),
           tabindex: -1
         }, {
           default: j(() => [
@@ -2777,14 +2778,14 @@ const tn = /* @__PURE__ */ H({
           text: t.year,
           "style-type": "transparent",
           fill: "",
-          onClick: s[2] || (s[2] = (o) => a("change-year")),
+          onClick: r[2] || (r[2] = (o) => a("change-year")),
           tabindex: -1
         }, null, 8, ["text"]),
         S(v(G), {
           text: v(it)(t.month),
           "style-type": "transparent",
           fill: "",
-          onClick: s[3] || (s[3] = (o) => a("change-month")),
+          onClick: r[3] || (r[3] = (o) => a("change-month")),
           tabindex: -1
         }, null, 8, ["text"])
       ]),
@@ -2792,7 +2793,7 @@ const tn = /* @__PURE__ */ H({
         S(v(G), {
           class: "nmorph-date-picker-header__action-btn",
           "style-type": "transparent",
-          onClick: s[4] || (s[4] = (o) => a("next-month")),
+          onClick: r[4] || (r[4] = (o) => a("next-month")),
           tabindex: -1
         }, {
           default: j(() => [
@@ -2806,7 +2807,7 @@ const tn = /* @__PURE__ */ H({
         S(v(G), {
           class: "nmorph-date-picker-header__action-btn",
           "style-type": "transparent",
-          onClick: s[5] || (s[5] = (o) => a("next-year")),
+          onClick: r[5] || (r[5] = (o) => a("next-year")),
           tabindex: -1
         }, {
           default: j(() => [
@@ -2833,14 +2834,14 @@ const sn = { class: "nmorph-year-month-picker__header" }, rn = { class: "nmorph-
       label: h.substring(0, 3),
       value: String(k),
       tabindex: -1
-    })), n = e, r = y(a), s = y(String(n.currentDate.getMonth())), o = y(n.currentDate.getFullYear()), u = () => {
+    })), n = e, s = y(a), r = y(String(n.currentDate.getMonth())), o = y(n.currentDate.getFullYear()), u = () => {
       const h = n.currentDate.getFullYear(), k = xa(h).map((M) => ({ label: String(M), value: String(M) }));
-      r.value = k;
+      s.value = k;
     };
     q(
       () => n.currentDate,
       () => {
-        n.type === "year" && (u(), s.value = String(n.currentDate.getFullYear()));
+        n.type === "year" && (u(), r.value = String(n.currentDate.getFullYear()));
       },
       {
         immediate: !0,
@@ -2852,9 +2853,9 @@ const sn = { class: "nmorph-year-month-picker__header" }, rn = { class: "nmorph-
         "nmorph-year-month-picker": []
       })
     ), C = (h) => {
-      s.value = h, n.type === "month" ? p("update-month", s.value) : p("update-year", s.value);
+      r.value = h, n.type === "month" ? p("update-month", r.value) : p("update-year", r.value);
     }, m = (h) => {
-      r.value = r.value.map((k) => {
+      s.value = s.value.map((k) => {
         const M = String(h === "decrease" ? Number(k.value) - 10 : Number(k.value) + 10);
         return {
           label: M,
@@ -2865,7 +2866,7 @@ const sn = { class: "nmorph-year-month-picker__header" }, rn = { class: "nmorph-
       h === "decrease" ? o.value = o.value - 1 : o.value = o.value + 1, p("update-year", String(o.value));
     }, _ = (h) => {
       h === "decrease" ? n.type === "year" ? m("decrease") : g("decrease") : n.type === "year" ? m("increase") : g("increase");
-    }, b = c(() => n.type === "year" ? `${r.value[0].label} - ${r.value[r.value.length - 1].label}` : String(o.value)), x = () => {
+    }, b = c(() => n.type === "year" ? `${s.value[0].label} - ${s.value[s.value.length - 1].label}` : String(o.value)), x = () => {
       n.type === "month" && p("back-to-years");
     };
     return (h, k) => (i(), d("div", {
@@ -2910,8 +2911,8 @@ const sn = { class: "nmorph-year-month-picker__header" }, rn = { class: "nmorph-
       S(v(So)),
       f("div", un, [
         S(v(dt), {
-          "model-value": s.value,
-          options: r.value,
+          "model-value": r.value,
+          options: s.value,
           "onUpdate:modelValue": C
         }, null, 8, ["model-value", "options"])
       ])
@@ -2931,46 +2932,46 @@ const cn = /* @__PURE__ */ H({
       () => V({
         "nmorph-date-picker-content": []
       })
-    ), r = y(t.initialDate), s = y("calendar"), o = c(() => new Date(r.value.setMonth(r.value.getMonth() - 1))), u = c(() => new Date(r.value.setMonth(r.value.getMonth() + 1))), p = c(() => new Date(r.value.setFullYear(r.value.getFullYear() - 1))), w = c(() => new Date(r.value.setFullYear(r.value.getFullYear() + 1))), C = () => {
-      r.value = o.value;
+    ), s = y(t.initialDate), r = y("calendar"), o = c(() => new Date(s.value.setMonth(s.value.getMonth() - 1))), u = c(() => new Date(s.value.setMonth(s.value.getMonth() + 1))), p = c(() => new Date(s.value.setFullYear(s.value.getFullYear() - 1))), w = c(() => new Date(s.value.setFullYear(s.value.getFullYear() + 1))), C = () => {
+      s.value = o.value;
     }, m = () => {
-      r.value = u.value;
+      s.value = u.value;
     }, g = () => {
-      r.value = p.value;
+      s.value = p.value;
     }, _ = () => {
-      r.value = w.value;
+      s.value = w.value;
     }, b = () => {
-      s.value = "year";
+      r.value = "year";
     }, x = () => {
-      s.value = "month";
+      r.value = "month";
     }, h = ($) => {
-      const O = new Date(r.value.setFullYear(Number($)));
-      r.value = O, s.value = "month";
+      const O = new Date(s.value.setFullYear(Number($)));
+      s.value = O, r.value = "month";
     }, k = ($) => {
-      const O = new Date(r.value.setMonth(Number($)));
-      r.value = O, s.value = "calendar";
+      const O = new Date(s.value.setMonth(Number($)));
+      s.value = O, r.value = "calendar";
     }, M = () => {
-      s.value = "year";
+      r.value = "year";
     }, A = ($) => {
       a("update-selected-value", $);
     }, P = ($) => {
-      r.value = $;
+      s.value = $;
     };
     return ($, O) => (i(), d("div", {
       class: T(n.value)
     }, [
-      s.value === "calendar" ? (i(), R(v($a), {
+      r.value === "calendar" ? (i(), R(v($a), {
         key: 0,
         type: t.type,
-        "initial-date": r.value,
+        "initial-date": s.value,
         "model-value": t.selectedValues,
         "onUpdate:modelValue": A,
         onUpdateInitialDate: P
       }, {
         header: j(() => [
           S(on, {
-            year: r.value.getFullYear(),
-            month: r.value.getMonth(),
+            year: s.value.getFullYear(),
+            month: s.value.getMonth(),
             onPrevMonth: C,
             onNextMonth: m,
             onPrevYear: g,
@@ -2981,16 +2982,16 @@ const cn = /* @__PURE__ */ H({
         ]),
         _: 1
       }, 8, ["type", "initial-date", "model-value"])) : E("", !0),
-      s.value === "year" ? (i(), R(at, {
+      r.value === "year" ? (i(), R(at, {
         key: 1,
         type: "year",
-        "current-date": r.value,
+        "current-date": s.value,
         onUpdateYear: h
       }, null, 8, ["current-date"])) : E("", !0),
-      s.value === "month" ? (i(), R(at, {
+      r.value === "month" ? (i(), R(at, {
         key: 2,
         type: "month",
-        "current-date": r.value,
+        "current-date": s.value,
         onUpdateYear: h,
         onUpdateMonth: k,
         onBackToYears: M
@@ -3010,7 +3011,7 @@ const cn = /* @__PURE__ */ H({
   },
   emits: ["update:model-value"],
   setup(e, { emit: l }) {
-    const { t, messages: a } = ke(), n = e, r = c(() => n.placeholder ? n.placeholder : t("NmorphDatePicker.pickADate")), s = y(n.modelValue), o = l, u = y(!1), p = () => {
+    const { t, messages: a } = ke(), n = e, s = c(() => n.placeholder ? n.placeholder : t("NmorphDatePicker.pickADate")), r = y(n.modelValue), o = l, u = y(!1), p = () => {
       u.value = !0;
     }, w = () => {
       u.value = !1;
@@ -3024,21 +3025,21 @@ const cn = /* @__PURE__ */ H({
     }, b = () => {
       m.value = !m.value;
     }, x = c(() => {
-      if (!s.value)
-        return r.value;
-      if (Array.isArray(s.value)) {
-        if (s.value.length === 0)
-          return r.value;
-        const A = et(s.value), P = n.type === "daterange" ? " - " : ", ";
+      if (!r.value)
+        return s.value;
+      if (Array.isArray(r.value)) {
+        if (r.value.length === 0)
+          return s.value;
+        const A = et(r.value), P = n.type === "daterange" ? " - " : ", ";
         return A.join(P);
       } else
-        return et(s.value);
+        return et(r.value);
     }), h = () => {
-      const A = Array.isArray(s.value) ? [] : null;
-      s.value = A, o("update:model-value", s.value);
+      const A = Array.isArray(r.value) ? [] : null;
+      r.value = A, o("update:model-value", r.value);
     }, k = (A) => {
-      s.value = A, o("update:model-value", s.value);
-    }, M = c(() => Array.isArray(s.value) ? s.value.length > 0 : !!s.value);
+      r.value = A, o("update:model-value", r.value);
+    }, M = c(() => Array.isArray(r.value) ? r.value.length > 0 : !!r.value);
     return (A, P) => (i(), d("div", {
       class: T(C.value)
     }, [
@@ -3079,7 +3080,7 @@ const cn = /* @__PURE__ */ H({
           }, {
             default: j(() => [
               S(cn, {
-                "selected-values": s.value,
+                "selected-values": r.value,
                 "initial-date": n.initialDate,
                 type: A.type,
                 onUpdateSelectedValue: k
@@ -3107,8 +3108,8 @@ const fn = { class: "nmorph-file-upload__trigger" }, _n = ["multiple"], gn = {
   },
   emits: ["update:model-value", "on-unsupported-file-type-error"],
   setup(e, { expose: l, emit: t }) {
-    const { t: a } = ke(), n = e, r = c(() => n.buttonText ? n.buttonText : a("NmorphFileUpload.selectFile")), s = (x) => x.split("/")[1], o = (x) => {
-      const h = s(x);
+    const { t: a } = ke(), n = e, s = c(() => n.buttonText ? n.buttonText : a("NmorphFileUpload.selectFile")), r = (x) => x.split("/")[1], o = (x) => {
+      const h = r(x);
       let k = "doc";
       return h in Ue && (k = "image"), h in Ge && (k = "audio"), h in qe && (k = "video"), h in Qe && (k = "archive"), k;
     };
@@ -3119,7 +3120,7 @@ const fn = { class: "nmorph-file-upload__trigger" }, _n = ["multiple"], gn = {
       const h = x.target;
       if (h.files) {
         if (Array.from(h.files).forEach((k) => {
-          const M = s(k.type);
+          const M = r(k.type);
           if (!n.allowedTypes.includes(M))
             return _("on-unsupported-file-type-error", k.type);
           const A = URL.createObjectURL(k), P = { data: k, previewUrl: A };
@@ -3157,7 +3158,7 @@ const fn = { class: "nmorph-file-upload__trigger" }, _n = ["multiple"], gn = {
         }, null, 40, _n),
         B(x.$slots, "trigger", {}, () => [
           S(v(G), {
-            text: r.value,
+            text: s.value,
             fill: "",
             onClick: w,
             disabled: n.disabled
@@ -3222,11 +3223,11 @@ const ts = {
         "nmorph-form": []
       })
     ), n = yt(t.value, t.validateImmediately);
-    return l({ formData: n }), ee("form-data", n), (r, s) => (i(), d("form", {
+    return l({ formData: n }), ee("form-data", n), (s, r) => (i(), d("form", {
       class: T(a.value)
     }, [
       f("div", $n, [
-        B(r.$slots, "default")
+        B(s.$slots, "default")
       ])
     ], 2));
   }
@@ -3244,7 +3245,7 @@ const ts = {
         "nmorph-error-box": [`${l.staticHeight && "static-height"}`, `${t.value.length === 0 && "empty"}`]
       })
     );
-    return (n, r) => (i(), d("div", {
+    return (n, s) => (i(), d("div", {
       class: T(a.value)
     }, [
       S(be, {
@@ -3252,10 +3253,10 @@ const ts = {
         tag: "div"
       }, {
         default: j(() => [
-          (i(!0), d(K, null, X(t.value, (s) => (i(), d("p", {
-            key: s,
+          (i(!0), d(K, null, X(t.value, (r) => (i(), d("p", {
+            key: r,
             class: "nmorph-error-box__error"
-          }, U(s), 1))), 128))
+          }, U(r), 1))), 128))
         ]),
         _: 1
       })
@@ -3277,7 +3278,7 @@ const Te = "18px", wn = /* @__PURE__ */ H({
         "nmorph-validation-icon": [l.valid ? "valid" : "invalid"]
       })
     ), a = c(() => l.valid ? "success" : "error");
-    return (n, r) => (i(), d("div", {
+    return (n, s) => (i(), d("div", {
       class: T(t.value)
     }, [
       n.show ? (i(), R(v(z), {
@@ -3300,13 +3301,13 @@ const Cn = { key: 0 }, Mn = { class: "nmorph-form-item__content" }, ls = /* @__P
     staticErrorBoxSpace: { type: Boolean, default: !1 }
   },
   setup(e) {
-    const l = e, t = N("form-data", void 0), a = c(() => t?.fields[l.id]), n = c(() => a.value), r = c(
+    const l = e, t = N("form-data", void 0), a = c(() => t?.fields[l.id]), n = c(() => a.value), s = c(
       () => !!n.value && !!a?.value?.touched && l.showValidationIcon
-    ), s = c(() => n.value && a.value?.touched), o = c(
+    ), r = c(() => n.value && a.value?.touched), o = c(
       () => V({
         "nmorph-form-item": [
           `${l.label && "labeled"}`,
-          `${s.value && (a.value?.valid ? "valid" : "invalid")}`
+          `${r.value && (a.value?.valid ? "valid" : "invalid")}`
         ]
       })
     );
@@ -3319,7 +3320,7 @@ const Cn = { key: 0 }, Mn = { class: "nmorph-form-item__content" }, ls = /* @__P
         l.showValidationIcon ? (i(), R(v(wn), {
           key: 0,
           valid: !!a.value?.valid,
-          show: r.value
+          show: s.value
         }, null, 8, ["valid", "show"])) : E("", !0)
       ]),
       S(v(xn), {
@@ -3363,11 +3364,11 @@ const Sn = { class: "nmorph-number-input__content" }, Tn = { class: "nmorph-numb
           `${a.actionBtnPositionRight && "action-btn-position-right"}`
         ]
       })
-    ), r = y(a.modelValue), s = () => {
-      r.value += a.step;
+    ), s = y(a.modelValue), r = () => {
+      s.value += a.step;
     }, o = () => {
-      r.value -= a.step;
-    }, u = c(() => r.value <= a.min), p = c(() => r.value >= a.max), w = c(() => a.height === "thick" ? "16px" : "12px"), C = {
+      s.value -= a.step;
+    }, u = c(() => s.value <= a.min), p = c(() => s.value >= a.max), w = c(() => a.height === "thick" ? "16px" : "12px"), C = {
       thick: {
         default: "12px",
         right: "8px"
@@ -3386,10 +3387,10 @@ const Sn = { class: "nmorph-number-input__content" }, Tn = { class: "nmorph-numb
     }), g = t, _ = (x) => {
       const h = x.target;
       let k = Number(h.value);
-      r.value = k;
+      s.value = k;
     };
-    q(r, (x) => {
-      x > a.max && (r.value = a.max, b.value?.blur()), r.value < a.min && (r.value = a.min, b.value?.blur()), g("update:model-value", x);
+    q(s, (x) => {
+      x > a.max && (s.value = a.max, b.value?.blur()), s.value < a.min && (s.value = a.min, b.value?.blur()), g("update:model-value", x);
     });
     const b = y(null);
     return l({ inputDOMRef: b }), (x, h) => (i(), d("div", {
@@ -3418,7 +3419,7 @@ const Sn = { class: "nmorph-number-input__content" }, Tn = { class: "nmorph-numb
             ref_key: "inputDOMRef",
             ref: b,
             class: "nmorph-native-input",
-            value: r.value,
+            value: s.value,
             type: "number",
             min: a.min,
             max: a.max,
@@ -3445,7 +3446,7 @@ const Sn = { class: "nmorph-number-input__content" }, Tn = { class: "nmorph-numb
               S(v(G), {
                 "style-type": "transparent",
                 disabled: p.value,
-                onClick: s
+                onClick: r
               }, {
                 default: j(() => [
                   S(v(z), {
@@ -3462,7 +3463,7 @@ const Sn = { class: "nmorph-number-input__content" }, Tn = { class: "nmorph-numb
               "style-type": "transparent",
               disabled: p.value,
               height: a.height,
-              onClick: s
+              onClick: r
             }, {
               default: j(() => [
                 S(v(z), {
@@ -3507,15 +3508,15 @@ const Pn = { class: "nmorph-select__content" }, An = ["id", "name"], Fn = ["valu
   setup(e, { emit: l }) {
     const { t } = ke(), a = e, n = c(
       () => a.noElementPlaceholder ? a.noElementPlaceholder : t("NmorphSelect.noElementPlaceholder")
-    ), r = l, s = y(a.modelValue), o = y(a.open), u = y(null), p = y(null), w = y(!0), C = a.id ? a.id : de(), m = a.name ? a.name : de(), g = (J) => {
+    ), s = l, r = y(a.modelValue), o = y(a.open), u = y(null), p = y(null), w = y(!0), C = a.id ? a.id : de(), m = a.name ? a.name : de(), g = (J) => {
       if (!a.disabled) {
-        if (o.value = !1, typeof s.value == "string" && (!a.valueRequired && s.value === J ? s.value = "" : s.value = J, r("update:model-value", s.value)), Array.isArray(s.value)) {
-          const Z = s.value.includes(J), ne = s.value.length === 1 && Z;
+        if (o.value = !1, typeof r.value == "string" && (!a.valueRequired && r.value === J ? r.value = "" : r.value = J, s("update:model-value", r.value)), Array.isArray(r.value)) {
+          const Z = r.value.includes(J), ne = r.value.length === 1 && Z;
           if (a.valueRequired && ne)
             return;
-          Z ? s.value = s.value.filter((xe) => xe !== J) : s.value = [...s.value, J];
+          Z ? r.value = r.value.filter((xe) => xe !== J) : r.value = [...r.value, J];
         }
-        r("update:model-value", s.value);
+        s("update:model-value", r.value);
       }
     }, _ = y(!1), b = () => {
       _.value = !0;
@@ -3559,8 +3560,8 @@ const Pn = { class: "nmorph-select__content" }, An = ["id", "name"], Fn = ["valu
     }), he(() => {
       document.removeEventListener("click", M);
     });
-    const D = c(() => typeof s.value == "string" ? s.value === "" ? n.value : a.options.find((J) => J.value === s.value)?.label : a.options.find((J) => J.value === s.value)?.label), Y = c(() => a.options.length > 0 ? a.options : a.optionsMap), F = c(() => Y.value.length > 0 ? Y.value.filter((Z) => s.value.includes(Z.value)).map((Z) => ({ text: Z.label, value: Z.value })) : Array.isArray(s.value) ? s.value.map((Z) => ({ text: Z, value: Z })) : [{ text: s.value, value: s.value }]);
-    ee("select-selected-value", s), ee("select-change-selected-value", g);
+    const D = c(() => typeof r.value == "string" ? r.value === "" ? n.value : a.options.find((J) => J.value === r.value)?.label : a.options.find((J) => J.value === r.value)?.label), Y = c(() => a.options.length > 0 ? a.options : a.optionsMap), F = c(() => Y.value.length > 0 ? Y.value.filter((Z) => r.value.includes(Z.value)).map((Z) => ({ text: Z.label, value: Z.value })) : Array.isArray(r.value) ? r.value.map((Z) => ({ text: Z, value: Z })) : [{ text: r.value, value: r.value }]);
+    ee("select-selected-value", r), ee("select-change-selected-value", g);
     const Q = y(null), le = () => {
       o.value = !o.value;
     }, fe = () => {
@@ -3597,7 +3598,7 @@ const Pn = { class: "nmorph-select__content" }, An = ["id", "name"], Fn = ["valu
           class: "nmorph-select__selected-values-line",
           onClick: re(k, ["stop"])
         }, [
-          typeof s.value == "string" ? (i(), d("div", Rn, U(D.value), 1)) : s.value.length === 0 ? (i(), d("div", zn, U(n.value), 1)) : (i(), d("div", jn, [
+          typeof r.value == "string" ? (i(), d("div", Rn, U(D.value), 1)) : r.value.length === 0 ? (i(), d("div", zn, U(n.value), 1)) : (i(), d("div", jn, [
             (i(!0), d(K, null, X(F.value, (ne) => (i(), R(v(ut), ye({
               key: ne.value,
               ref_for: !0
@@ -3655,8 +3656,8 @@ const Wn = ["value"], Yn = { class: "nmorph-select-option__content" }, Un = /* @
   },
   emits: ["change-value"],
   setup(e, { emit: l }) {
-    const t = N("select-selected-value", void 0), a = N("select-change-selected-value", void 0), n = e, r = l, s = () => {
-      n.disabled || (r("change-value", n.value), a && a(n.value));
+    const t = N("select-selected-value", void 0), a = N("select-change-selected-value", void 0), n = e, s = l, r = () => {
+      n.disabled || (s("change-value", n.value), a && a(n.value));
     }, o = c(() => typeof t?.value == "string" ? t.value === n.value : Array.isArray(t?.value) ? t.value.some((p) => p === n.value) : !1), u = c(
       () => V({
         nmorph: [se[n.height]],
@@ -3669,7 +3670,7 @@ const Wn = ["value"], Yn = { class: "nmorph-select-option__content" }, Un = /* @
     );
     return (p, w) => (i(), d("div", {
       class: T(u.value),
-      onClick: s,
+      onClick: r,
       value: n.value
     }, [
       f("div", Yn, [
@@ -3704,9 +3705,9 @@ const qn = { class: "nmorph-slider__content" }, Gn = { class: "nmorph-slider__in
         nmorph: [],
         "nmorph-slider": [`${t.disabled && "disabled"}`]
       })
-    ), n = `${Be}px`, r = y(t.showTooltip), s = l, o = y(t.modelValue), u = y(null);
+    ), n = `${Be}px`, s = y(t.showTooltip), r = l, o = y(t.modelValue), u = y(null);
     q(o, () => {
-      s("update:model-value", o.value);
+      r("update:model-value", o.value);
     }), q(
       () => t.modelValue,
       ($) => {
@@ -3743,9 +3744,9 @@ const qn = { class: "nmorph-slider__content" }, Gn = { class: "nmorph-slider__in
     }, x = () => {
       t.disabled || (document.addEventListener("mousemove", _), document.addEventListener("mouseup", b));
     }, h = y(null), k = () => {
-      t.showTooltip && (r.value = !0);
+      t.showTooltip && (s.value = !0);
     }, M = () => {
-      t.showTooltip && (r.value = !1);
+      t.showTooltip && (s.value = !1);
     }, A = ($) => {
       const O = $.target;
       o.value = Number(O.value);
@@ -3760,7 +3761,7 @@ const qn = { class: "nmorph-slider__content" }, Gn = { class: "nmorph-slider__in
             ref: u,
             class: "nmorph-slider__input-container"
           }, [
-            r.value && !t.disabled ? (i(), R(v(Fl), {
+            s.value && !t.disabled ? (i(), R(v(Fl), {
               key: 0,
               ref_key: "tooltipRootRef",
               ref: p,
@@ -3805,17 +3806,17 @@ const Kn = ["value", "disabled"], Xn = { class: "nmorph-switch-thumb" }, rs = /*
   },
   emits: ["update:model-value"],
   setup(e, { expose: l, emit: t }) {
-    const a = e, n = t, r = y(!1), s = () => {
-      r.value = !0;
+    const a = e, n = t, s = y(!1), r = () => {
+      s.value = !0;
     }, o = () => {
-      r.value = !1;
+      s.value = !1;
     }, u = c(
       () => V({
         "nmorph-switch": [
           `${a.disabled && "disabled"}`,
           `${p.value ? "on" : "off"}`,
           `${a.loading && "loading"}`,
-          `${r.value && "focus"}`
+          `${s.value && "focus"}`
         ]
       })
     ), p = y(a.modelValue === a.activeValue), w = () => {
@@ -3844,7 +3845,7 @@ const Kn = ["value", "disabled"], Xn = { class: "nmorph-switch-thumb" }, rs = /*
           value: p.value,
           disabled: a.disabled,
           class: "nmorph-native-input",
-          onFocus: s,
+          onFocus: r,
           onBlur: o
         }, null, 40, Kn),
         f("div", {
@@ -3882,12 +3883,12 @@ const Jn = { class: "nmorph-text-input__input-side" }, Zn = {
     I((h) => ({
       "6c6d90c2": x.value
     }));
-    const a = Ee(), n = e, r = c(
+    const a = Ee(), n = e, s = c(
       () => V({
         nmorph: [se[n.height], `${w.value && "focused"}`],
         "nmorph-text-input": [`${n.typePassword && "password"}`]
       })
-    ), s = (h) => {
+    ), r = (h) => {
       const k = h.target;
       _("update:model-value", k.value);
     }, o = y(!1), u = () => {
@@ -3900,7 +3901,7 @@ const Jn = { class: "nmorph-text-input__input-side" }, Zn = {
     l({ inputDOMRef: g });
     const _ = t, b = c(() => n.clearable ? "error" : o.value ? "eye-blocked" : "eye"), x = c(() => a["prepend-icon"] ? "28px" : "8px");
     return (h, k) => (i(), d("div", {
-      class: T(r.value)
+      class: T(s.value)
     }, [
       f("div", Jn, [
         v(a)["prepend-icon"] ? (i(), d("div", Zn, [
@@ -3914,7 +3915,7 @@ const Jn = { class: "nmorph-text-input__input-side" }, Zn = {
           placeholder: n.placeholder,
           disabled: n.disabled,
           value: n.modelValue,
-          onInput: s,
+          onInput: r,
           onFocus: C,
           onBlur: m,
           onKeyup: k[0] || (k[0] = ve((M) => _("on-enter"), ["enter"]))
@@ -3954,8 +3955,8 @@ const Ln = { class: "nmorph-time-picker__content" }, eo = { class: "nmorph-time-
     I(($) => ({
       "50fc8a59": A.value
     }));
-    const a = e, n = t, r = y(null), s = y(null);
-    l({ inputDOMRef: s });
+    const a = e, n = t, s = y(null), r = y(null);
+    l({ inputDOMRef: r });
     const o = y(a.open), u = y([0, 0, 0]), p = y(a.initWithoutValue), w = () => {
       o.value = !o.value;
     }, C = c(
@@ -3990,7 +3991,7 @@ const Ln = { class: "nmorph-time-picker__content" }, eo = { class: "nmorph-time-
       const D = Pe("NmorphTimeRoller");
       return i(), d("div", {
         ref_key: "timepickerDOMRef",
-        ref: r,
+        ref: s,
         class: T(C.value),
         onClick: w
       }, [
@@ -4002,7 +4003,7 @@ const Ln = { class: "nmorph-time-picker__content" }, eo = { class: "nmorph-time-
             }),
             f("input", {
               ref_key: "inputDOMRef",
-              ref: s,
+              ref: r,
               type: "time",
               value: u.value,
               step: "1",
@@ -4010,10 +4011,10 @@ const Ln = { class: "nmorph-time-picker__content" }, eo = { class: "nmorph-time-
             }, null, 8, to),
             f("span", null, U(P.value), 1)
           ]),
-          r.value ? (i(), R(v(Me), {
+          s.value ? (i(), R(v(Me), {
             key: 0,
             open: o.value,
-            "relative-element": r.value,
+            "relative-element": s.value,
             onOnOutsideClick: k
           }, {
             default: j(() => [
@@ -4089,16 +4090,16 @@ const lt = (e) => {
     const t = N("radio-group-selected-value", void 0), a = N(
       "change-radio-button-value-handler",
       void 0
-    ), n = e, r = () => {
+    ), n = e, s = () => {
       a && !n.disabled && a(n.value);
-    }, s = c(() => t?.value === n.value || n.checked), o = c(
+    }, r = c(() => t?.value === n.value || n.checked), o = c(
       () => V({
-        "nmorph-radio": [`${n.disabled && "disabled"}`, `${s.value && "checked"}`, n.styleType]
+        "nmorph-radio": [`${n.disabled && "disabled"}`, `${r.value && "checked"}`, n.styleType]
       })
     ), u = y(null);
     return l({ inputDOMRef: u }), (p, w) => (i(), d("label", {
       class: T(o.value),
-      onClick: re(r, ["prevent"])
+      onClick: re(s, ["prevent"])
     }, [
       n.styleType === "radio-style" ? (i(), d("div", no, [
         f("div", oo, [
@@ -4108,12 +4109,12 @@ const lt = (e) => {
             type: "radio",
             name: n.label,
             value: n.value,
-            checked: s.value,
+            checked: r.value,
             tabindex: n.tabindex,
             class: "nmorph-native-input"
           }, null, 8, so),
           w[0] || (w[0] = f("div", { class: "nmorph-radio__fake" }, null, -1)),
-          s.value ? (i(), d("div", ro)) : E("", !0)
+          r.value ? (i(), d("div", ro)) : E("", !0)
         ]),
         n.label ? (i(), d("span", io, U(n.label), 1)) : B(p.$slots, "label", { key: 1 }, void 0, !0)
       ])) : E("", !0),
@@ -4125,7 +4126,7 @@ const lt = (e) => {
           disabled: n.disabled,
           name: n.label,
           value: n.value,
-          checked: s.value,
+          checked: r.value,
           tabindex: n.tabindex,
           class: "nmorph-native-input"
         }, null, 8, co),
@@ -4157,13 +4158,13 @@ const ho = /* @__PURE__ */ $e(mo, [["__scopeId", "data-v-e1360c2e"]]), fo = { cl
         a.value = o;
       }
     );
-    const n = l, r = (o) => {
+    const n = l, s = (o) => {
       a.value = o, n("update:model-value", a.value);
-    }, s = c(() => V({ "nmorph-radio-group": [t.styleType, t.direction] }));
-    return ee("radio-group-selected-value", a), ee("change-radio-button-value-handler", r), (o, u) => {
+    }, r = c(() => V({ "nmorph-radio-group": [t.styleType, t.direction] }));
+    return ee("radio-group-selected-value", a), ee("change-radio-button-value-handler", s), (o, u) => {
       const p = Pe("NmorphRadio");
       return i(), d("div", {
-        class: T(s.value)
+        class: T(r.value)
       }, [
         f("div", fo, [
           f("div", _o, [
@@ -4194,9 +4195,9 @@ const us = /* @__PURE__ */ H({
   setup(e, { emit: l }) {
     I((m) => ({
       "13d4e1c7": n.value,
-      "4bd46fe0": r.value
+      "4bd46fe0": s.value
     }));
-    const t = e, a = l, n = c(() => `${t.right}px`), r = c(() => `${t.bottom}px`), s = c(
+    const t = e, a = l, n = c(() => `${t.right}px`), s = c(() => `${t.bottom}px`), r = c(
       () => V({
         "nmorph-backtop": [`${p.value && "show"}`, t.design]
       })
@@ -4219,7 +4220,7 @@ const us = /* @__PURE__ */ H({
     }), (m, g) => (i(), d("div", {
       ref_key: "selfDOMEl",
       ref: u,
-      class: T(s.value)
+      class: T(r.value)
     }, [
       f("div", {
         onClick: re(C, ["stop"])
@@ -4258,10 +4259,10 @@ const go = ["id"], yo = {
         "nmorph-breadcrumb": []
       })
     );
-    return (r, s) => (i(), d("div", {
+    return (s, r) => (i(), d("div", {
       class: T(n.value)
     }, [
-      B(r.$slots, "default"),
+      B(s.$slots, "default"),
       (i(!0), d(K, null, X(t.value, (o, u) => (i(), d("div", {
         key: u,
         class: "nmorph-breadcrumb__content"
@@ -4286,25 +4287,25 @@ const ds = /* @__PURE__ */ H({
       () => V({
         "nmorph-breadcrumb-item": []
       })
-    ), a = N("breadcrumb-data", void 0), n = y(!1), r = de();
+    ), a = N("breadcrumb-data", void 0), n = y(!1), s = de();
     return ae(() => {
       n.value = !0;
-    }), a.breadcrumbs.value.push({ ...l, itemId: r }), (s, o) => {
+    }), a.breadcrumbs.value.push({ ...l, itemId: s }), (r, o) => {
       const u = Pe("router-link");
-      return n.value && v(r) ? (i(), d("div", {
+      return n.value && v(s) ? (i(), d("div", {
         key: 0,
         class: T(t.value)
       }, [
         (i(), R(ge, {
-          to: `#nmorph-breadcrumb-${v(a)?.breadcrumbId}-${v(r)}-element`
+          to: `#nmorph-breadcrumb-${v(a)?.breadcrumbId}-${v(s)}-element`
         }, [
           S(u, {
-            to: s.to,
-            replace: s.replace,
+            to: r.to,
+            replace: r.replace,
             class: "fill-height"
           }, {
             default: j(() => [
-              B(s.$slots, "default")
+              B(r.$slots, "default")
             ]),
             _: 3
           }, 8, ["to", "replace"])
@@ -4327,13 +4328,13 @@ const ds = /* @__PURE__ */ H({
     I((p) => ({
       f609801e: o.value
     }));
-    const t = e, a = l, n = y(null), { placementCoords: r } = nt({
+    const t = e, a = l, n = y(null), { placementCoords: s } = nt({
       initialPlacement: "bottom",
       contentDOMElement: n,
       relativeElement: t.relativeElement,
       yOffset: t.yOffset,
       xOffset: t.xOffset
-    }), s = c(
+    }), r = c(
       () => V({
         "nmorph-dropdown": [`${!t.open && "closed"}`]
       })
@@ -4349,8 +4350,8 @@ const ds = /* @__PURE__ */ H({
         f("div", {
           ref_key: "dropdownDOMRef",
           ref: n,
-          class: T(s.value),
-          style: te({ left: `${v(r).x}`, top: `${v(r).y}` })
+          class: T(r.value),
+          style: te({ left: `${v(s).x}`, top: `${v(s).y}` })
         }, [
           B(p.$slots, "default")
         ], 6)
@@ -4372,17 +4373,17 @@ const bo = { class: "nmorph-tabs__label-list" }, ko = ["id", "onClick", "custom"
       () => V({
         "nmorph-tabs": [`${t.stretch && "stretch"}`]
       })
-    ), r = (w) => {
+    ), s = (w) => {
       if (w.disabled)
         return;
       const { name: C } = w;
       a("update:model-value", C), a("tab-change", C);
-    }, s = y([]), o = de();
+    }, r = y([]), o = de();
     ee("nmorph-tabs-data", {
-      tabsData: s,
+      tabsData: r,
       tabsIdentifier: o
     });
-    const u = c(() => t.panes.length > 0 ? t.panes : s.value), p = Ee();
+    const u = c(() => t.panes.length > 0 ? t.panes : r.value), p = Ee();
     return (w, C) => (i(), d("div", {
       class: T(n.value)
     }, [
@@ -4395,7 +4396,7 @@ const bo = { class: "nmorph-tabs__label-list" }, ko = ["id", "onClick", "custom"
             { "nmorph-tabs__label--selected": m.name === t.modelValue },
             { "nmorph-tabs__label--disabled": m.disabled }
           ]]),
-          onClick: (g) => r(m),
+          onClick: (g) => s(m),
           custom: m.disabled
         }, [
           v(p).default ? E("", !0) : (i(), d("div", $o, U(m.label), 1))
@@ -4439,20 +4440,20 @@ const pt = (e, l) => {
     ae(() => {
       n.value = !0;
     }), a.tabsData.value.push(l);
-    const r = l;
-    return (s, o) => n.value ? (i(), d("div", {
+    const s = l;
+    return (r, o) => n.value ? (i(), d("div", {
       key: 0,
       class: T(t.value)
     }, [
       (i(), R(ge, {
         to: `#${v(pt)(v(a)?.tabsIdentifier, l.name)}`
       }, [
-        B(s.$slots, "label", { scope: v(r) })
+        B(r.$slots, "label", { scope: v(s) })
       ], 8, ["to"])),
       (i(), R(ge, {
         to: `#${v(vt)(v(a)?.tabsIdentifier, l.name)}`
       }, [
-        B(s.$slots, "default", { scope: v(r) })
+        B(r.$slots, "default", { scope: v(s) })
       ], 8, ["to"]))
     ], 2)) : E("", !0);
   }
@@ -4485,9 +4486,9 @@ const Ke = /* @__PURE__ */ H({
         "nmorph-overlay": [`${t.show && "show"}`, `${t.transparent && "transparent"}`]
       })
     ), n = () => {
-      r("on-outside-click");
-    }, r = l;
-    return (s, o) => (i(), d("div", {
+      s("on-outside-click");
+    }, s = l;
+    return (r, o) => (i(), d("div", {
       class: T(a.value),
       onClick: re(n, ["stop"])
     }, [
@@ -4496,7 +4497,7 @@ const Ke = /* @__PURE__ */ H({
         onClick: o[0] || (o[0] = re(() => {
         }, ["stop"]))
       }, [
-        B(s.$slots, "default")
+        B(r.$slots, "default")
       ])
     ], 2));
   }
@@ -4510,15 +4511,15 @@ const To = /* @__PURE__ */ H({
     quantity: { default: 100 }
   },
   setup(e) {
-    const l = y([]), t = c(() => r.notifications.filter((o) => !l.value.includes(o.id))), a = c(() => {
-      const o = Math.max(t.value.length - r.quantity, 0);
+    const l = y([]), t = c(() => s.notifications.filter((o) => !l.value.includes(o.id))), a = c(() => {
+      const o = Math.max(t.value.length - s.quantity, 0);
       return t.value.slice(o);
     }), n = (o) => {
       l.value = [...l.value, o];
-    }, r = e, s = c(() => r.zIndex);
+    }, s = e, r = c(() => s.zIndex);
     return (o, u) => (i(), d("div", {
-      class: T(`nmorph-notification-provider nmorph-notification-provider--${r.placement}`),
-      style: te({ zIndex: s.value })
+      class: T(`nmorph-notification-provider nmorph-notification-provider--${s.placement}`),
+      style: te({ zIndex: r.value })
     }, [
       S(be, {
         name: "nmorph-notification",
@@ -4545,10 +4546,10 @@ var Bo = /* @__PURE__ */ ((e) => (e["top-left"] = "top-left", e["top-center"] =
 const hs = {
   install(e, l = {}) {
     if (!l?.i18n?.outsideMessagesMerge) {
-      const r = Lt(l.i18n), s = e.__VUE_I18N__;
-      s ? (r.global.messages && Object.entries(r.global.messages).forEach(([o, u]) => {
-        s.global.mergeLocaleMessage(o, u);
-      }), r.global.locale && (s.global.locale.value = r.global.locale)) : e.use(r);
+      const s = Lt(l.i18n), r = e.__VUE_I18N__;
+      r ? (s.global.messages && Object.entries(s.global.messages).forEach(([o, u]) => {
+        r.global.mergeLocaleMessage(o, u);
+      }), s.global.locale && (r.global.locale.value = s.global.locale)) : e.use(s);
     }
     const t = qt(l.theme), a = ea(), n = { theme: t, browser: a };
     return e.provide("nmorph", n), e;