@nmorph/nmorph-ui-kit 2.2.36 → 2.2.37

package/dist/components/form/nmorph-switch/NmorphSwitch.vue2.js

@@ -1,10 +1,11 @@
 import './NmorphSwitch.css';
 import { defineComponent as q, ref as i, computed as n, watch as N } from "vue";
 import { useModifiers as V } from "../../../utils/create-modifiers.js";
+import { toCssSize as a } from "../../../utils/common.js";
 import { useFormItemInput as _ } from "../nmorph-form/use-form-item-input.js";
 import w from "../../basic/nmorph-icon/NmorphIcon.vue.js";
 import H from "../../../assets/icons/loader.svg.js";
-const C = /* @__PURE__ */ q({
+const M = /* @__PURE__ */ q({
   __name: "NmorphSwitch",
   props: {
     modelValue: { type: [Boolean, String, Number], required: !1, default: !1 },
@@ -23,39 +24,39 @@ const C = /* @__PURE__ */ q({
   },
   emits: ["update:model-value"],
   setup(s, { expose: f, emit: m }) {
-    const e = s, { id: p, name: c, tabindex: h } = _(e), u = m, a = i(!1), g = () => {
-      a.value = !0;
-    }, v = () => {
-      a.value = !1;
+    const e = s, { id: p, name: c, tabindex: h } = _(e), u = m, r = i(!1), v = () => {
+      r.value = !0;
+    }, g = () => {
+      r.value = !1;
     }, b = n(
       () => V({
         "nmorph-switch": [
-          `${e.disabled && "disabled"}`,
-          `${r.value ? "on" : "off"}`,
-          `${e.loading && "loading"}`,
-          `${a.value && "focus"}`
+          e.disabled && "disabled",
+          t.value ? "on" : "off",
+          e.loading && "loading",
+          r.value && "focus"
         ]
       })
-    ), r = i(e.modelValue === e.activeValue), y = () => {
+    ), t = i(e.modelValue === e.activeValue), y = () => {
       if (e.disabled) return;
-      r.value = !r.value;
-      const t = r.value ? e.activeValue : e.inactiveValue;
-      u("update:model-value", t);
+      t.value = !t.value;
+      const o = t.value ? e.activeValue : e.inactiveValue;
+      u("update:model-value", o);
     }, l = i(null);
     f({ inputDOMRef: l });
-    const o = (t) => typeof t == "number" ? `${t}px` : t, S = n(() => ({
-      ...e.width !== void 0 && { "--width": o(e.width) },
-      ...e.height !== void 0 && { "--height": o(e.height) },
-      ...e.offset !== void 0 && { "--offset": o(e.offset) },
-      ...e.thumbHeight !== void 0 && { "--thumb-height": o(e.thumbHeight) }
+    const S = n(() => ({
+      ...e.width !== void 0 && { "--width": a(e.width) },
+      ...e.height !== void 0 && { "--height": a(e.height) },
+      ...e.offset !== void 0 && { "--offset": a(e.offset) },
+      ...e.thumbHeight !== void 0 && { "--thumb-height": a(e.thumbHeight) }
     }));
     N(
       () => e.modelValue,
-      (t) => {
-        r.value = t === e.activeValue;
+      (o) => {
+        t.value = o === e.activeValue;
       }
     );
-    const d = { props: e, id: p, name: c, tabindex: h, emit: u, focus: a, focusHandler: g, blurHandler: v, modifiers: b, initialValue: r, changeHandler: y, inputDOMRef: l, getCssSize: o, styles: S, get NmorphIcon() {
+    const d = { props: e, id: p, name: c, tabindex: h, emit: u, focus: r, focusHandler: v, blurHandler: g, modifiers: b, initialValue: t, changeHandler: y, inputDOMRef: l, styles: S, get NmorphIcon() {
       return w;
     }, get NmorphIconLoaderDots() {
       return H;
@@ -64,5 +65,5 @@ const C = /* @__PURE__ */ q({
   }
 });
 export {
-  C as default
+  M as default
 };

package/dist/components/form/nmorph-text-input/NmorphTextInput.css

@@ -0,0 +1 @@
+.nmorph-text-input{--prepend-icon-indent: 8px;--prepend-icon-size: 14px;display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;min-width:0}.nmorph-text-input__input-side{position:relative;display:flex;justify-content:flex-end;align-items:center;width:100%}.nmorph-text-input__prepend-icon{position:absolute;left:0;z-index:1;display:flex;justify-content:center;align-items:center;width:var(--prepend-icon-size);min-width:var(--prepend-icon-size);height:var(--prepend-icon-size);min-height:var(--prepend-icon-size);margin-left:var(--prepend-icon-indent);pointer-events:none}.nmorph-text-input__prepend-icon svg,.nmorph-text-input__prepend-icon .nmorph-icon,.nmorph-text-input__prepend-icon .nmorph-icon__content{width:100%;min-width:100%;height:100%;min-height:100%}.nmorph-text-input__prepend-icon svg{fill:var(--nmorph-text-color);stroke-width:0}.nmorph-text-input__prepend-icon path{stroke:var(--nmorph-text-color)}.nmorph-text-input input{width:100%;height:var(--height);text-indent:var(--nmorph-text-input-indentation);border:none;border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-inset)}.nmorph-text-input--with-action input{padding-right:calc(var(--height) + var(--indentation-03))}.nmorph-text-input input:focus{background:var(--nmorph-accent-color);outline:none;box-shadow:var(--nmorph-shadow-outset)}.nmorph-text-input.nmorph--focused .nmorph-text-input__prepend-icon svg{fill:var(--nmorph-focus-text-color)}.nmorph-text-input.nmorph--focused .nmorph-text-input__prepend-icon path{stroke:var(--nmorph-focus-text-color)}.nmorph-text-input input:-webkit-autofill,.nmorph-text-input input:-webkit-autofill:hover,.nmorph-text-input input:-webkit-autofill:active{caret-color:var(--nmorph-text-color);box-shadow:var(--nmorph-shadow-inset),inset 0 0 0 1000px var(--nmorph-main-color);-webkit-text-fill-color:var(--nmorph-text-color)}.nmorph-text-input input:-webkit-autofill:focus{caret-color:var(--nmorph-focus-text-color);outline:none;box-shadow:var(--nmorph-shadow-outset),inset 0 0 0 1000px var(--nmorph-accent-color);-webkit-text-fill-color:var(--nmorph-focus-text-color)}.nmorph-text-input input:disabled{cursor:not-allowed;opacity:.6}.nmorph-text-input__password-btn{position:absolute;right:0;height:100%}.nmorph-text-input__password-btn .nmorph-button__content{padding:var(--indentation-03)}.nmorph-text-input.nmorph-button.nmorph--thin-component .nmorph-text-input__password-btn{margin-top:var(--indentation-00)}.nmorph-text-input.nmorph-button.nmorph--thin-component .nmorph-text-input__password-btn .nmorph-button{--height: var(--thin-component)}.nmorph-text-input.nmorph-button.nmorph--focused .nmorph-text-input__password-btn .nmorph-icon{--color: var(--nmorph-white-color)}.nmorph-text-input.nmorph-button.nmorph--focused .nmorph-text-input__password-btn .nmorph-button:not(:disabled,[loading=true]):hover .nmorph-icon{--color: var(--nmorph-white-color)}

package/dist/components/form/nmorph-text-input/NmorphTextInput.vue.js

@@ -1,5 +1,7 @@
+import './NmorphTextInput.css';
 import s from "./NmorphTextInput.vue2.js";
 import { openBlock as n, createElementBlock as r, normalizeStyle as m, normalizeClass as c, createElementVNode as i, renderSlot as h, createCommentVNode as l, mergeProps as f, withKeys as y, createBlock as d, withModifiers as _, withCtx as a, createVNode as u, resolveDynamicComponent as b } from "vue";
+/* empty css                     */
 import x from "../../../_virtual/_plugin-vue_export-helper.js";
 const v = { class: "nmorph-text-input__input-side" }, k = {
   key: 0,
@@ -64,7 +66,7 @@ function B(p, o, N, e, C, I) {
     /* CLASS, STYLE */
   );
 }
-const M = /* @__PURE__ */ x(s, [["render", B], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-text-input/NmorphTextInput.vue"]]);
+const z = /* @__PURE__ */ x(s, [["render", B], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-text-input/NmorphTextInput.vue"]]);
 export {
-  M as default
+  z as default
 };

package/dist/components/form/nmorph-text-input/NmorphTextInput.vue2.js

@@ -1,13 +1,14 @@
+import './NmorphTextInput.css';
 import { defineComponent as C, useSlots as E, computed as n, ref as l } from "vue";
 import { NmorphComponentHeight as O } from "../../../types/index.js";
-import { useModifiers as $ } from "../../../utils/create-modifiers.js";
-import { useFormItemInput as j } from "../nmorph-form/use-form-item-input.js";
-import F from "../../../assets/icons/eye-blocked.svg.js";
-import H from "../../../assets/icons/eye.svg.js";
-import M from "../../basic/nmorph-button/NmorphButton.vue.js";
-import A from "../../basic/nmorph-icon/NmorphIcon.vue.js";
-import D from "../../../assets/icons/error.svg.js";
-const U = /* @__PURE__ */ C({
+import { useModifiers as j } from "../../../utils/create-modifiers.js";
+import { useFormItemInput as F } from "../nmorph-form/use-form-item-input.js";
+import H from "../../../assets/icons/eye-blocked.svg.js";
+import M from "../../../assets/icons/eye.svg.js";
+import A from "../../basic/nmorph-button/NmorphButton.vue.js";
+import D from "../../basic/nmorph-icon/NmorphIcon.vue.js";
+import R from "../../../assets/icons/error.svg.js";
+const W = /* @__PURE__ */ C({
   __name: "NmorphTextInput",
   props: {
     placeholder: { type: String, required: !1, default: "" },
@@ -25,13 +26,10 @@ const U = /* @__PURE__ */ C({
   },
   emits: ["update:model-value", "focus", "blur", "on-enter", "keydown"],
   setup(f, { expose: m, emit: h }) {
-    const s = E(), e = f, { id: y, name: b, autocomplete: v, tabindex: g } = j(e), q = n(
-      () => $({
-        nmorph: [O[e.height], `${a.value && "focused"}`],
-        "nmorph-text-input": [
-          `${e.typePassword && "password"}`,
-          `${(e.typePassword || e.clearable) && "with-action"}`
-        ]
+    const s = E(), e = f, { id: y, name: b, autocomplete: v, tabindex: g } = F(e), q = n(
+      () => j({
+        nmorph: [O[e.height], a.value && "focused"],
+        "nmorph-text-input": [e.typePassword && "password", (e.typePassword || e.clearable) && "with-action"]
       })
     ), w = (P) => {
       const k = P.target;
@@ -50,14 +48,14 @@ const U = /* @__PURE__ */ C({
       o.value?.select();
     };
     m({ inputDOMRef: o, focus: u, blur: p, select: i });
-    const r = h, S = n(() => e.clearable ? D : t.value ? F : H), d = n(() => e.indentation || (s["prepend-icon"] ? "28px" : "8px")), B = n(() => ({ "--nmorph-text-input-indentation": d.value })), c = { slots: s, props: e, id: y, name: b, autocomplete: v, tabindex: g, modifiers: q, handleInput: w, showPassword: t, actionButtonClickHandler: x, type: I, focused: a, handleFocus: N, handleBlur: _, inputDOMRef: o, focus: u, blur: p, select: i, emit: r, actionIcon: S, indentation: d, styles: B, get NmorphIcon() {
-      return A;
+    const r = h, S = n(() => e.clearable ? R : t.value ? H : M), d = n(() => e.indentation || (s["prepend-icon"] ? "28px" : "8px")), B = n(() => ({ "--nmorph-text-input-indentation": d.value })), c = { slots: s, props: e, id: y, name: b, autocomplete: v, tabindex: g, modifiers: q, handleInput: w, showPassword: t, actionButtonClickHandler: x, type: I, focused: a, handleFocus: N, handleBlur: _, inputDOMRef: o, focus: u, blur: p, select: i, emit: r, actionIcon: S, indentation: d, styles: B, get NmorphIcon() {
+      return D;
     }, get NmorphButton() {
-      return M;
+      return A;
     } };
     return Object.defineProperty(c, "__isScriptSetup", { enumerable: !1, value: !0 }), c;
   }
 });
 export {
-  U as default
+  W as default
 };

package/dist/components/form/nmorph-textarea/NmorphTextarea.vue2.js

@@ -1,9 +1,9 @@
 import './NmorphTextarea.css';
 import { defineComponent as F, ref as h, computed as l, watch as B, onMounted as I, nextTick as T } from "vue";
-import { NmorphComponentHeight as $ } from "../../../types/index.js";
-import { useModifiers as O } from "../../../utils/create-modifiers.js";
-import { useFormItemInput as V } from "../nmorph-form/use-form-item-input.js";
-const D = /* @__PURE__ */ F({
+import { NmorphComponentHeight as O } from "../../../types/index.js";
+import { useModifiers as V } from "../../../utils/create-modifiers.js";
+import { useFormItemInput as j } from "../nmorph-form/use-form-item-input.js";
+const Y = /* @__PURE__ */ F({
   __name: "NmorphTextarea",
   props: {
     placeholder: { type: String, required: !1, default: "" },
@@ -24,10 +24,10 @@ const D = /* @__PURE__ */ F({
   },
   emits: ["update:model-value", "focus", "blur", "on-enter", "keydown"],
   setup(y, { expose: g, emit: x }) {
-    const e = y, n = x, { id: b, name: w, autocomplete: q, tabindex: v } = V(e), a = h(null), s = h(!1), S = l(
-      () => O({
-        nmorph: [$[e.height], `${s.value && "focused"}`],
-        "nmorph-textarea": [`${e.disabled && "disabled"}`, `${e.autoSize && "auto-size"}`]
+    const e = y, n = x, { id: b, name: w, autocomplete: q, tabindex: v } = j(e), a = h(null), s = h(!1), S = l(
+      () => V({
+        nmorph: [O[e.height], s.value && "focused"],
+        "nmorph-textarea": [e.disabled && "disabled", e.autoSize && "auto-size"]
       })
     ), i = (t) => {
       const o = window.getComputedStyle(t);
@@ -63,5 +63,5 @@ const D = /* @__PURE__ */ F({
   }
 });
 export {
-  D as default
+  Y as default
 };

package/dist/components/form/nmorph-time-picker/NmorphTimePicker.vue2.js

@@ -1,14 +1,15 @@
 import './NmorphTimePicker.css';
-import { defineComponent as ee, ref as g, computed as n, watch as te } from "vue";
-import { NmorphComponentHeight as _ } from "../../../types/index.js";
-import { useI18n as oe } from "vue-i18n";
-import { useModifiers as $ } from "../../../utils/create-modifiers.js";
+import { defineComponent as Z, ref as v, computed as n, watch as ee } from "vue";
+import { NmorphComponentHeight as C } from "../../../types/index.js";
+import { useI18n as te } from "vue-i18n";
+import { useModifiers as _ } from "../../../utils/create-modifiers.js";
+import { toCssSize as oe } from "../../../utils/common.js";
 import { useFormItemInput as re } from "../nmorph-form/use-form-item-input.js";
 import ne from "../../../assets/icons/clock.svg.js";
 import le from "../../../assets/icons/circle-close.svg.js";
 import ue from "../../basic/nmorph-icon/NmorphIcon.vue.js";
-import se from "../../navigation/nmorph-dropdown/NmorphDropdown.vue.js";
-const Se = /* @__PURE__ */ ee({
+import ae from "../../navigation/nmorph-dropdown/NmorphDropdown.vue.js";
+const ve = /* @__PURE__ */ Z({
   __name: "NmorphTimePicker",
   props: {
     modelValue: { type: [String, null], required: !1, default: null },
@@ -31,17 +32,17 @@ const Se = /* @__PURE__ */ ee({
   },
   emits: ["update:model-value", "focus", "blur"],
   setup(O, { expose: H, emit: k }) {
-    const t = O, s = k, { t: T } = oe(), { id: B, name: M, autocomplete: P, tabindex: z } = re(t), a = g(!1), c = g(!1), w = g(null), m = (e) => String(e).padStart(2, "0"), p = (e) => Math.max(1, Math.floor(Number.isFinite(e) ? e : 1)), i = (e) => {
+    const t = O, a = k, { t: T } = te(), { id: B, name: M, autocomplete: P, tabindex: $ } = re(t), s = v(!1), c = v(!1), w = v(null), m = (e) => String(e).padStart(2, "0"), p = (e) => Math.max(1, Math.floor(Number.isFinite(e) ? e : 1)), i = (e) => {
       if (!e) return null;
       const o = e.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?$/);
       if (!o) return null;
-      const r = Number(o[1]), S = Number(o[2]), d = Number(o[3] || 0);
-      return r > 23 || S > 59 || d > 59 ? null : { hour: r, minute: S, second: d };
-    }, v = (e) => {
+      const r = Number(o[1]), b = Number(o[2]), d = Number(o[3] || 0);
+      return r > 23 || b > 59 || d > 59 ? null : { hour: r, minute: b, second: d };
+    }, g = (e) => {
       const o = `${m(e.hour)}:${m(e.minute)}`;
       return t.showSeconds ? `${o}:${m(e.second)}` : o;
-    }, f = (e) => e.hour * 3600 + e.minute * 60 + e.second, y = n(() => i(t.minTime)), N = n(() => i(t.maxTime)), x = n(() => i(t.modelValue)), u = g(x.value || { hour: 0, minute: 0, second: 0 }), V = n(() => t.placeholder || T("pickATime"));
-    te(
+    }, f = (e) => e.hour * 3600 + e.minute * 60 + e.second, y = n(() => i(t.minTime)), N = n(() => i(t.maxTime)), V = n(() => i(t.modelValue)), u = v(V.value || { hour: 0, minute: 0, second: 0 }), x = n(() => t.placeholder || T("pickATime"));
+    ee(
       () => t.modelValue,
       (e) => {
         const o = i(e);
@@ -51,9 +52,9 @@ const Se = /* @__PURE__ */ ee({
     const h = (e) => {
       const o = f(e);
       return !!(y.value && o < f(y.value) || N.value && o > f(N.value));
-    }, b = (e, o, r) => {
-      const S = p(r), d = /* @__PURE__ */ new Set();
-      for (let l = 0; l <= o; l += S) d.add(l);
+    }, S = (e, o, r) => {
+      const b = p(r), d = /* @__PURE__ */ new Set();
+      for (let l = 0; l <= o; l += b) d.add(l);
       return d.add(u.value[e]), Array.from(d).filter((l) => l >= 0 && l <= o).sort((l, q) => l - q).map((l) => {
         const q = { ...u.value, [e]: l };
         return {
@@ -62,44 +63,44 @@ const Se = /* @__PURE__ */ ee({
           disabled: h(q)
         };
       });
-    }, D = n(() => b("hour", 23, t.hourStep)), A = n(() => b("minute", 59, t.minuteStep)), F = n(() => b("second", 59, t.secondStep)), R = (e, o) => {
+    }, z = n(() => S("hour", 23, t.hourStep)), D = n(() => S("minute", 59, t.minuteStep)), A = n(() => S("second", 59, t.secondStep)), F = (e, o) => {
       const r = { ...u.value, [e]: o };
-      h(r) || (u.value = r, s("update:model-value", v(r)));
+      h(r) || (u.value = r, a("update:model-value", g(r)));
+    }, R = () => {
+      a("update:model-value", null), s.value = !1;
     }, U = () => {
-      s("update:model-value", null), a.value = !1;
+      s.value = !1;
     }, j = () => {
-      a.value = !1;
+      t.disabled || (s.value = !s.value);
     }, E = () => {
-      t.disabled || (a.value = !a.value);
+      c.value = !0, a("focus");
     }, G = () => {
-      c.value = !0, s("focus");
-    }, J = () => {
-      c.value = !1, s("blur");
-    }, K = (e) => {
+      c.value = !1, a("blur");
+    }, J = (e) => {
       const o = e.target, r = i(o.value);
-      !r || h(r) || (u.value = r, s("update:model-value", v(r)));
-    }, L = n(() => t.modelValue || V.value), Q = n(
+      !r || h(r) || (u.value = r, a("update:model-value", g(r)));
+    }, K = n(() => t.modelValue || x.value), L = n(
       () => t.showSeconds ? p(t.secondStep) : p(t.minuteStep) * 60
-    ), W = n(() => t.clearable && !!t.modelValue && !t.disabled), X = n(
-      () => $({
-        nmorph: [_[t.height]],
+    ), Q = n(() => t.clearable && !!t.modelValue && !t.disabled), W = n(
+      () => _({
+        nmorph: [C[t.height]],
         "nmorph-time-picker": [
-          `${t.disabled && "disabled"}`,
-          `${a.value && "open"}`,
-          `${c.value && "focus"}`,
-          `${!t.modelValue && "placeholder"}`
+          t.disabled && "disabled",
+          s.value && "open",
+          c.value && "focus",
+          !t.modelValue && "placeholder"
         ]
       })
-    ), Y = n(
-      () => $({
-        nmorph: [_[t.height]]
+    ), X = n(
+      () => _({
+        nmorph: [C[t.height]]
       })
-    ), I = (e) => typeof e == "number" ? `${e}px` : e, Z = n(() => ({
-      ...t.width !== void 0 && { "--width": I(t.width) }
+    ), Y = n(() => ({
+      ...t.width !== void 0 && { "--width": oe(t.width) }
     }));
     H({ inputDOMRef: w });
-    const C = { props: t, emit: s, t: T, id: B, name: M, autocomplete: P, tabindex: z, open: a, focused: c, inputDOMRef: w, pad: m, normalizeStep: p, parseTime: i, formatTime: v, timeToSeconds: f, minTimeParts: y, maxTimeParts: N, modelTimeParts: x, pickerValue: u, placeholderText: V, isOutsideRange: h, getUnitOptions: b, hourOptions: D, minuteOptions: A, secondOptions: F, selectUnit: R, clearHandler: U, closeHandler: j, toggleOpen: E, focusHandler: G, blurHandler: J, nativeInputHandler: K, displayValue: L, inputStep: Q, showClearButton: W, modifiers: X, optionHeightModifiers: Y, getCssSize: I, styles: Z, get NmorphDropdown() {
-      return se;
+    const I = { props: t, emit: a, t: T, id: B, name: M, autocomplete: P, tabindex: $, open: s, focused: c, inputDOMRef: w, pad: m, normalizeStep: p, parseTime: i, formatTime: g, timeToSeconds: f, minTimeParts: y, maxTimeParts: N, modelTimeParts: V, pickerValue: u, placeholderText: x, isOutsideRange: h, getUnitOptions: S, hourOptions: z, minuteOptions: D, secondOptions: A, selectUnit: F, clearHandler: R, closeHandler: U, toggleOpen: j, focusHandler: E, blurHandler: G, nativeInputHandler: J, displayValue: K, inputStep: L, showClearButton: Q, modifiers: W, optionHeightModifiers: X, styles: Y, get NmorphDropdown() {
+      return ae;
     }, get NmorphIcon() {
       return ue;
     }, get NmorphIconCircleClose() {
@@ -107,9 +108,9 @@ const Se = /* @__PURE__ */ ee({
     }, get NmorphIconClock() {
       return ne;
     } };
-    return Object.defineProperty(C, "__isScriptSetup", { enumerable: !1, value: !0 }), C;
+    return Object.defineProperty(I, "__isScriptSetup", { enumerable: !1, value: !0 }), I;
   }
 });
 export {
-  Se as default
+  ve as default
 };

package/dist/components/navigation/nmorph-backtop/NmorphBacktop.vue2.js

@@ -20,7 +20,7 @@ const Y = /* @__PURE__ */ E({
     w();
     const t = b, s = y, g = v(
       () => q({
-        "nmorph-backtop": [`${n.value && "show"}`, t.design]
+        "nmorph-backtop": [n.value && "show", t.design]
       })
     ), N = v(() => ({
       "--nmorph-backtop-right": `${t.right}px`,

package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.vue2.js

@@ -1,9 +1,10 @@
 import './NmorphDropdown.css';
-import { defineComponent as w, ref as q, toRef as r, computed as n, watch as b } from "vue";
-import { useModifiers as v } from "../../../utils/create-modifiers.js";
+import { defineComponent as w, ref as q, toRef as t, computed as l, watch as v } from "vue";
+import { useModifiers as b } from "../../../utils/create-modifiers.js";
+import { toCssSize as d } from "../../../utils/common.js";
 import { usePlacement as x } from "../../../hooks/use-placement.js";
 import O from "../../others/nmorph-overlay/NmorphOverlay.vue.js";
-const k = /* @__PURE__ */ w({
+const B = /* @__PURE__ */ w({
   __name: "NmorphDropdown",
   props: {
     open: { type: Boolean, required: !0 },
@@ -25,46 +26,46 @@ const k = /* @__PURE__ */ w({
     hideShadow: { type: Boolean, required: !1, default: !1 }
   },
   emits: ["on-outside-click", "on-escape-keydown"],
-  setup(f, { expose: m, emit: c }) {
-    m();
-    const e = f, l = c, i = q(null), { placementCoords: d, placementReady: a, adjustPlacement: s } = x({
-      initialPlacement: r(e, "placement"),
+  setup(p, { expose: f, emit: m }) {
+    f();
+    const e = p, r = m, i = q(null), { placementCoords: o, placementReady: n, adjustPlacement: a } = x({
+      initialPlacement: t(e, "placement"),
       contentDOMElement: i,
-      relativeElement: r(e, "relativeElement"),
-      yOffset: r(e, "yOffset"),
-      xOffset: r(e, "xOffset"),
-      enabled: r(e, "open")
-    }), y = n(
-      () => v({
-        "nmorph-dropdown": [`${!e.open && "closed"}`, `${e.hideShadow && "hide-shadow"}`]
+      relativeElement: t(e, "relativeElement"),
+      yOffset: t(e, "yOffset"),
+      xOffset: t(e, "xOffset"),
+      enabled: t(e, "open")
+    }), c = l(
+      () => b({
+        "nmorph-dropdown": [!e.open && "closed", e.hideShadow && "hide-shadow"]
       })
-    ), o = (t) => typeof t == "number" ? `${t}px` : t, u = n(
-      () => e.fillWidth && e.relativeElement ? `${e.relativeElement.clientWidth}px` : o(e.width)
-    ), h = n(() => ({
-      "--nmorph-dropdown-width": u.value,
-      "--nmorph-dropdown-min-width": o(e.minWidth) || "auto",
-      "--nmorph-dropdown-max-width": o(e.maxWidth) || "none",
-      left: d.value.x,
-      top: d.value.y,
-      visibility: e.open && a.value ? "visible" : "hidden"
+    ), s = l(
+      () => e.fillWidth && e.relativeElement ? `${e.relativeElement.clientWidth}px` : d(e.width)
+    ), h = l(() => ({
+      "--nmorph-dropdown-width": s.value,
+      "--nmorph-dropdown-min-width": d(e.minWidth) || "auto",
+      "--nmorph-dropdown-max-width": d(e.maxWidth) || "none",
+      left: o.value.x,
+      top: o.value.y,
+      visibility: e.open && n.value ? "visible" : "hidden"
     }));
-    b(
+    v(
       () => e.open,
-      (t) => {
-        t && s();
+      (y) => {
+        y && a();
       },
       { flush: "post" }
     );
-    const p = { props: e, emit: l, dropdownDOMRef: i, placementCoords: d, placementReady: a, adjustPlacement: s, modifiers: y, getCssSize: o, width: u, dropdownStyle: h, outsideClickHandler: () => {
-      l("on-outside-click");
+    const u = { props: e, emit: r, dropdownDOMRef: i, placementCoords: o, placementReady: n, adjustPlacement: a, modifiers: c, width: s, dropdownStyle: h, outsideClickHandler: () => {
+      r("on-outside-click");
     }, escapeHandler: () => {
-      l("on-escape-keydown");
+      r("on-escape-keydown");
     }, get NmorphOverlay() {
       return O;
     } };
-    return Object.defineProperty(p, "__isScriptSetup", { enumerable: !1, value: !0 }), p;
+    return Object.defineProperty(u, "__isScriptSetup", { enumerable: !1, value: !0 }), u;
   }
 });
 export {
-  k as default
+  B as default
 };

package/dist/components/navigation/nmorph-tabs/NmorphTabs.vue2.js

@@ -15,7 +15,7 @@ const D = /* @__PURE__ */ b({
     d();
     const e = u, t = i, l = p(
       () => I({
-        "nmorph-tabs": [`${e.stretch && "stretch"}`]
+        "nmorph-tabs": [e.stretch && "stretch"]
       })
     ), m = (n) => {
       if (n.disabled) return;

package/dist/components/others/nmorph-overlay/NmorphOverlay.vue2.js

@@ -22,7 +22,7 @@ const L = /* @__PURE__ */ _({
       () => t.zIndex
     ), w = i(
       () => F({
-        "nmorph-overlay": [`${t.show && "show"}`, `${t.transparent && "transparent"}`]
+        "nmorph-overlay": [t.show && "show", t.transparent && "transparent"]
       })
     ), k = i(() => t.disabledTeleport || !t.show || typeof document > "u"), x = () => {
       s("on-outside-click");