npm - @nmorph/nmorph-ui-kit - Versions diffs - 2.2.37 → 2.2.39 - Mend

@nmorph/nmorph-ui-kit 2.2.37 → 2.2.39

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (239) hide show

package/dist/components/basic/nmorph-button/NmorphButton.vue2.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import './NmorphButton.css';
 import { defineComponent as c, useSlots as m, computed as o, ref as h } from "vue";
-import { NmorphComponentHeight as y } from "../../../types/index.js";
-import { useModifiers as b } from "../../../utils/create-modifiers.js";
+import { useModifiers as y } from "../../../utils/create-modifiers.js";
+import { NmorphComponentHeight as b } from "../../../types/common.types.js";
 import g from "../../../assets/icons/loading.svg.js";
 import q from "../nmorph-icon/NmorphIcon.vue.js";
 const x = /* @__PURE__ */ c({
@@ -25,8 +25,8 @@ const x = /* @__PURE__ */ c({
   },
   setup(i, { expose: u }) {
     const e = i, t = m(), s = o(() => !!t.icon), r = o(() => !!t["icon-only"]), p = o(
-      () => b({
-        nmorph: [y[e.height], e.fill && "fill"],
+      () => y({
+        nmorph: [b[e.height], e.fill && "fill"],
         "nmorph-button": [
           e.styleType,
           e.shape,

package/dist/components/basic/nmorph-layout/NmorphLayout.vue2.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import './NmorphLayout.css';
-import { defineComponent as p, useSlots as d, computed as o } from "vue";
-import { useModifiers as n } from "../../../utils/create-modifiers.js";
-import { toCssSize as r } from "../../../utils/common.js";
-const g = /* @__PURE__ */ p({
+import { defineComponent as u, useSlots as p, computed as r } from "vue";
+import { useModifiers as d } from "../../../utils/create-modifiers.js";
+import { createCssSizeVariables as n } from "../../../utils/common.js";
+const g = /* @__PURE__ */ u({
   __name: "NmorphLayout",
   props: {
     tag: { type: String, required: !1, default: "section" },
@@ -13,14 +13,16 @@ const g = /* @__PURE__ */ p({
   },
   setup(s, { expose: i }) {
     i();
-    const e = s, a = d(), u = o(
-      () => n({
+    const e = s, o = p(), a = r(
+      () => d({
         "nmorph-layout": [`aside-${e.asidePosition}`, e.fullHeight && "full-height"]
       })
-    ), l = o(() => ({
-      "--nmorph-layout-gap": r(e.gap),
-      "--nmorph-layout-aside-width": r(e.asideWidth)
-    })), t = { props: e, slots: a, modifiers: u, styles: l };
+    ), l = r(
+      () => n({
+        "--nmorph-layout-gap": e.gap,
+        "--nmorph-layout-aside-width": e.asideWidth
+      })
+    ), t = { props: e, slots: o, modifiers: a, styles: l };
     return Object.defineProperty(t, "__isScriptSetup", { enumerable: !1, value: !0 }), t;
   }
 });

package/dist/components/basic/nmorph-link/NmorphLink.vue2.js CHANGED Viewed

@@ -1,13 +1,14 @@
 import './NmorphLink.css';
-import { defineComponent as c, useSlots as m, computed as r } from "vue";
+import { defineComponent as c, useSlots as m, computed as o } from "vue";
 import { useModifiers as y } from "../../../utils/create-modifiers.js";
-import * as N from "../nmorph-icon/NmorphIcons.js";
-import { NmorphColor as _ } from "../../../types/index.js";
-import h from "../nmorph-icon/NmorphIcon.vue.js";
-const b = /* @__PURE__ */ c({
+import { createCssVariables as N } from "../../../utils/common.js";
+import * as _ from "../nmorph-icon/NmorphIcons.js";
+import { NmorphColor as h } from "../../../types/common.types.js";
+import q from "../nmorph-icon/NmorphIcon.vue.js";
+const I = /* @__PURE__ */ c({
   __name: "NmorphLink",
   props: {
-    type: { type: null, required: !1, default: _.accent },
+    type: { type: null, required: !1, default: h.accent },
     underline: { type: Boolean, required: !1, default: !1 },
     href: { type: String, required: !1, default: "" },
     text: { type: String, required: !1, default: "" },
@@ -16,23 +17,25 @@ const b = /* @__PURE__ */ c({
     color: { type: String, required: !1, default: void 0 },
     iconName: { type: String, required: !1, default: void 0 }
   },
-  setup(l, { expose: s }) {
-    s();
-    const e = l, a = m(), o = N, t = (f) => f.split(/[-_\s]+/).filter(Boolean).map((i) => `${i.charAt(0).toUpperCase()}${i.slice(1)}`).join(""), p = r(() => {
+  setup(s, { expose: l }) {
+    l();
+    const e = s, a = m(), r = _, t = (u) => u.split(/[-_\s]+/).filter(Boolean).map((i) => `${i.charAt(0).toUpperCase()}${i.slice(1)}`).join(""), p = o(() => {
       if (e.iconName)
-        return e.iconName in o ? o[e.iconName] : o[`NmorphIcon${t(e.iconName)}`];
-    }), d = r(
+        return e.iconName in r ? r[e.iconName] : r[`NmorphIcon${t(e.iconName)}`];
+    }), d = o(
       () => y({
         "nmorph-link": [e.type, e.underline && "underline", e.disabled && "disabled"]
       })
-    ), u = r(() => ({
-      ...e.color !== void 0 && { "--link-color": e.color }
-    })), n = { props: e, slots: a, iconMap: o, toPascalCase: t, resolvedIcon: p, modifiers: d, styles: u, get NmorphIcon() {
-      return h;
+    ), f = o(
+      () => N({
+        "--link-color": e.color
+      })
+    ), n = { props: e, slots: a, iconMap: r, toPascalCase: t, resolvedIcon: p, modifiers: d, styles: f, get NmorphIcon() {
+      return q;
     } };
     return Object.defineProperty(n, "__isScriptSetup", { enumerable: !1, value: !0 }), n;
   }
 });
 export {
-  b as default
+  I as default
 };

package/dist/components/data/nmorph-badge/NmorphBadge.css CHANGED Viewed

	@@ -1 +1 @@
1	- .nmorph-badge{position:relative;display:inline-block;height:fit-content;--nmorph-badge-dot-size: 4px;--nmorph-badge-ribbon-height: 24px;--nmorph-badge-ribbon-corner-size: 62px;--nmorph-badge-ribbon-width: 116px;--nmorph-badge-ribbon-offset-x: 0px;--nmorph-badge-ribbon-offset-y: 0px}.nmorph-badge .nmorph-badge__container{position:absolute;display:inline-flex;justify-content:center;align-items:center;background:var(--nmorph-badge-color);border-radius:var(--default-border-radius);opacity:1}.nmorph-badge.nmorph-badge--tag{position:static;display:inline-flex}.nmorph-badge .nmorph-badge__container--tag{position:static}.nmorph-badge .nmorph-badge__content{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;min-width:calc(1em * var(--line-height-regular) + 4px);padding:2px 4px;color:var(--nmorph-light-shade-color);font-size:var(--font-size-base);line-height:var(--line-height-regular);text-align:center}.nmorph-badge.nmorph-badge--tiny .nmorph-badge__content{font-size:var(--font-size-tiny)}.nmorph-badge.nmorph-badge--extra-small .nmorph-badge__content{font-size:var(--font-size-extra-small)}.nmorph-badge .nmorph-badge__container--hidden{opacity:0}.nmorph-badge .nmorph-badge__ribbon-frame{position:absolute;inset:0;overflow:hidden;border-radius:var(--default-border-radius);pointer-events:none}.nmorph-badge .nmorph-badge__ribbon-corner{position:absolute;width:var(--nmorph-badge-ribbon-corner-size);height:var(--nmorph-badge-ribbon-corner-size)}.nmorph-badge .nmorph-badge__container--ribbon{top:50%;left:50%;width:var(--nmorph-badge-ribbon-width);height:var(--nmorph-badge-ribbon-height);border-radius:0;box-shadow:var(--nmorph-shadow-outset)}.nmorph-badge .nmorph-badge__container--ribbon .nmorph-badge__content{width:100%;min-width:0;height:100%;padding:0 var(--indentation-03);overflow:hidden;font-weight:600;font-size:var(--font-size-extra-small);line-height:1;white-space:nowrap;text-overflow:ellipsis}.nmorph-badge .nmorph-badge__ribbon-corner--top-left{top:var(--nmorph-badge-ribbon-offset-y);left:var(--nmorph-badge-ribbon-offset-x)}.nmorph-badge .nmorph-badge__ribbon-corner--top-left .nmorph-badge__container--ribbon{border-bottom-right-radius:var(--border-radius-40);border-bottom-left-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(-45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--top-right{top:var(--nmorph-badge-ribbon-offset-y);right:var(--nmorph-badge-ribbon-offset-x)}.nmorph-badge .nmorph-badge__ribbon-corner--top-right .nmorph-badge__container--ribbon{border-bottom-right-radius:var(--border-radius-40);border-bottom-left-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-left{bottom:var(--nmorph-badge-ribbon-offset-y);left:var(--nmorph-badge-ribbon-offset-x)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-left .nmorph-badge__container--ribbon{border-top-left-radius:var(--border-radius-40);border-top-right-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-right{right:var(--nmorph-badge-ribbon-offset-x);bottom:var(--nmorph-badge-ribbon-offset-y)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-right .nmorph-badge__container--ribbon{border-top-left-radius:var(--border-radius-40);border-top-right-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(-45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--flat{width:var(--nmorph-badge-ribbon-width);height:var(--nmorph-badge-ribbon-height)}.nmorph-badge .nmorph-badge__ribbon-corner--flat .nmorph-badge__container--ribbon{position:relative;top:auto;left:auto;border-radius:0;transform:none}.nmorph-badge.nmorph-badge--tiny .nmorph-badge__container--ribbon .nmorph-badge__content{font-weight:400;font-size:var(--font-size-tiny)}.nmorph-badge .nmorph-badge__dot{width:var(--nmorph-badge-dot-size);height:var(--nmorph-badge-dot-size);border-radius:var(--border-radius-circular)}.nmorph-badge.nmorph-badge--tiny{--nmorph-badge-dot-size: 3px;--nmorph-badge-ribbon-height: 18px;--nmorph-badge-ribbon-corner-size: 50px;--nmorph-badge-ribbon-width: 92px}.nmorph-badge.nmorph-badge--extra-small{--nmorph-badge-dot-size: 4px;--nmorph-badge-ribbon-height: 20px;--nmorph-badge-ribbon-corner-size: 56px;--nmorph-badge-ribbon-width: 104px}
1	+ .nmorph-badge{position:relative;display:inline-block;height:fit-content;--nmorph-badge-dot-size: 4px;--nmorph-badge-ribbon-height: 24px;--nmorph-badge-ribbon-corner-size: 62px;--nmorph-badge-ribbon-width: 116px;--nmorph-badge-ribbon-offset-x: 0px;--nmorph-badge-ribbon-offset-y: 0px}.nmorph-badge .nmorph-badge__container{position:absolute;display:inline-flex;justify-content:center;align-items:center;background:var(--nmorph-badge-color);border-radius:var(--default-border-radius);opacity:1}.nmorph-badge.nmorph-badge--tag{position:static;display:inline-flex}.nmorph-badge .nmorph-badge__container--tag{position:static}.nmorph-badge .nmorph-badge__content{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;min-width:calc(1em * var(--line-height-regular) + 4px);padding:2px 4px;color:var(--nmorph-light-shade-color);font-size:var(--font-size-base);line-height:var(--line-height-regular);text-align:center}.nmorph-badge.nmorph-badge--tiny .nmorph-badge__content{font-size:var(--font-size-tiny)}.nmorph-badge.nmorph-badge--extra-small .nmorph-badge__content{font-size:var(--font-size-extra-small)}.nmorph-badge.nmorph-badge--medium .nmorph-badge__content{font-size:var(--font-size-medium)}.nmorph-badge.nmorph-badge--large .nmorph-badge__content{font-size:var(--font-size-large)}.nmorph-badge.nmorph-badge--extra-large .nmorph-badge__content{font-size:var(--font-size-extra-large)}.nmorph-badge .nmorph-badge__container--hidden{opacity:0}.nmorph-badge .nmorph-badge__ribbon-frame{position:absolute;inset:0;overflow:hidden;border-radius:var(--default-border-radius);pointer-events:none}.nmorph-badge .nmorph-badge__ribbon-corner{position:absolute;width:var(--nmorph-badge-ribbon-corner-size);height:var(--nmorph-badge-ribbon-corner-size)}.nmorph-badge .nmorph-badge__container--ribbon{top:50%;left:50%;width:var(--nmorph-badge-ribbon-width);height:var(--nmorph-badge-ribbon-height);border-radius:0;box-shadow:var(--nmorph-shadow-outset)}.nmorph-badge .nmorph-badge__container--ribbon .nmorph-badge__content{width:100%;min-width:0;height:100%;padding:0 var(--indentation-03);overflow:hidden;font-weight:600;font-size:var(--font-size-extra-small);line-height:1;white-space:nowrap;text-overflow:ellipsis}.nmorph-badge .nmorph-badge__ribbon-corner--top-left{top:var(--nmorph-badge-ribbon-offset-y);left:var(--nmorph-badge-ribbon-offset-x)}.nmorph-badge .nmorph-badge__ribbon-corner--top-left .nmorph-badge__container--ribbon{border-bottom-right-radius:var(--border-radius-40);border-bottom-left-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(-45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--top-right{top:var(--nmorph-badge-ribbon-offset-y);right:var(--nmorph-badge-ribbon-offset-x)}.nmorph-badge .nmorph-badge__ribbon-corner--top-right .nmorph-badge__container--ribbon{border-bottom-right-radius:var(--border-radius-40);border-bottom-left-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-left{bottom:var(--nmorph-badge-ribbon-offset-y);left:var(--nmorph-badge-ribbon-offset-x)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-left .nmorph-badge__container--ribbon{border-top-left-radius:var(--border-radius-40);border-top-right-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-right{right:var(--nmorph-badge-ribbon-offset-x);bottom:var(--nmorph-badge-ribbon-offset-y)}.nmorph-badge .nmorph-badge__ribbon-corner--bottom-right .nmorph-badge__container--ribbon{border-top-left-radius:var(--border-radius-40);border-top-right-radius:var(--border-radius-40);transform:translate(-50%,-50%) rotate(-45deg)}.nmorph-badge .nmorph-badge__ribbon-corner--flat{width:var(--nmorph-badge-ribbon-width);height:var(--nmorph-badge-ribbon-height)}.nmorph-badge .nmorph-badge__ribbon-corner--flat .nmorph-badge__container--ribbon{position:relative;top:auto;left:auto;border-radius:0;transform:none}.nmorph-badge.nmorph-badge--tiny .nmorph-badge__container--ribbon .nmorph-badge__content{font-weight:400;font-size:var(--font-size-tiny)}.nmorph-badge.nmorph-badge--medium .nmorph-badge__container--ribbon .nmorph-badge__content{font-size:var(--font-size-medium)}.nmorph-badge.nmorph-badge--large .nmorph-badge__container--ribbon .nmorph-badge__content{font-size:var(--font-size-large)}.nmorph-badge.nmorph-badge--extra-large .nmorph-badge__container--ribbon .nmorph-badge__content{font-size:var(--font-size-extra-large)}.nmorph-badge .nmorph-badge__dot{width:var(--nmorph-badge-dot-size);height:var(--nmorph-badge-dot-size);border-radius:var(--border-radius-circular)}.nmorph-badge.nmorph-badge--tiny{--nmorph-badge-dot-size: 3px;--nmorph-badge-ribbon-height: 18px;--nmorph-badge-ribbon-corner-size: 50px;--nmorph-badge-ribbon-width: 92px}.nmorph-badge.nmorph-badge--extra-small{--nmorph-badge-dot-size: 4px;--nmorph-badge-ribbon-height: 20px;--nmorph-badge-ribbon-corner-size: 56px;--nmorph-badge-ribbon-width: 104px}.nmorph-badge.nmorph-badge--medium{--nmorph-badge-dot-size: 5px;--nmorph-badge-ribbon-height: 28px;--nmorph-badge-ribbon-corner-size: 68px;--nmorph-badge-ribbon-width: 128px}.nmorph-badge.nmorph-badge--large{--nmorph-badge-dot-size: 6px;--nmorph-badge-ribbon-height: 32px;--nmorph-badge-ribbon-corner-size: 76px;--nmorph-badge-ribbon-width: 144px}.nmorph-badge.nmorph-badge--extra-large{--nmorph-badge-dot-size: 8px;--nmorph-badge-ribbon-height: 36px;--nmorph-badge-ribbon-corner-size: 84px;--nmorph-badge-ribbon-width: 160px}

package/dist/components/data/nmorph-badge/NmorphBadge.vue2.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import './NmorphBadge.css';
-import { defineComponent as N, computed as t, ref as d, onMounted as I, watch as V, nextTick as M } from "vue";
+import { defineComponent as C, computed as a, ref as d, onMounted as V, watch as N, nextTick as I } from "vue";
 import { useModifiers as f } from "../../../utils/create-modifiers.js";
-import { toCssSize as y } from "../../../utils/common.js";
-const $ = /* @__PURE__ */ N({
+import { createCssSizeVariables as M, createCssVariables as O } from "../../../utils/common.js";
+const X = /* @__PURE__ */ C({
   __name: "NmorphBadge",
   props: {
     value: { type: [Number, String], required: !1, default: void 0 },
@@ -21,57 +21,61 @@ const $ = /* @__PURE__ */ N({
     zIndex: { type: Number, required: !1, default: 1 },
     disabled: { type: Boolean, required: !1, default: !1 }
   },
-  setup(m, { expose: g }) {
-    g();
-    const e = m, r = t(() => e.type !== "default" ? e.type : e.isDot ? "dot" : e.isTag ? "tag" : "default"), b = t(() => r.value === "dot"), o = t(() => r.value === "tag"), a = t(() => r.value === "ribbon"), h = t(
+  setup(y, { expose: m }) {
+    m();
+    const e = y, t = a(() => e.type !== "default" ? e.type : e.isDot ? "dot" : e.isTag ? "tag" : "default"), b = a(() => t.value === "dot"), o = a(() => t.value === "tag"), r = a(() => t.value === "ribbon"), g = a(
       () => f({
         "nmorph-badge": [
           e.hidden && "hidden",
           o.value && "tag",
-          a.value && "ribbon",
-          a.value && `ribbon-${e.ribbonCorner}`,
+          r.value && "ribbon",
+          r.value && `ribbon-${e.ribbonCorner}`,
           e.size
         ]
       })
-    ), x = t(
+    ), h = a(
       () => f({
         "nmorph-badge__container": [
           e.hidden && "hidden",
           o.value && "tag",
-          a.value && "ribbon",
-          a.value && `ribbon-${e.ribbonCorner}`
+          r.value && "ribbon",
+          r.value && `ribbon-${e.ribbonCorner}`
         ]
       })
-    ), q = t(
+    ), x = a(
       () => f({
         "nmorph-badge__ribbon-corner": [e.ribbonCorner, !e.ribbonTilt && "flat"]
       })
-    ), _ = t(() => typeof Number(e.value) == "number" && Number(e.value) > e.max ? `${e.max}+` : e.value), p = t(() => e.hideOnFalsyValue && !e.value), z = t(() => (b.value || e.value !== void 0) && !p.value), l = t(() => {
-      const v = `${(u?.value / 2 + e.offsetX) * -1}px`, C = `${(i?.value / 2 + e.offsetY) * -1}px`;
+    ), q = a(() => typeof Number(e.value) == "number" && Number(e.value) > e.max ? `${e.max}+` : e.value), p = a(() => e.hideOnFalsyValue && !e.value), _ = a(() => (b.value || e.value !== void 0) && !p.value), l = a(() => {
+      const v = `${(i?.value / 2 + e.offsetX) * -1}px`, B = `${(u?.value / 2 + e.offsetY) * -1}px`;
       return {
         x: v,
-        y: C
+        y: B
       };
-    }), S = t(() => o.value || a.value ? {
+    }), z = a(() => o.value || r.value ? {
       zIndex: e.zIndex
     } : {
       right: l.value.x,
       top: l.value.y,
       zIndex: e.zIndex
-    }), n = d(null), u = d(0), i = d(0), T = t(() => ({
-      "--nmorph-badge-color": e.color,
-      ...e.offsetX !== 0 && { "--nmorph-badge-ribbon-offset-x": y(e.offsetX) },
-      ...e.offsetY !== 0 && { "--nmorph-badge-ribbon-offset-y": y(e.offsetY) }
+    }), n = d(null), i = d(0), u = d(0), S = a(() => ({
+      ...O({
+        "--nmorph-badge-color": e.color
+      }),
+      ...M({
+        "--nmorph-badge-ribbon-offset-x": e.offsetX !== 0 && e.offsetX,
+        "--nmorph-badge-ribbon-offset-y": e.offsetY !== 0 && e.offsetY
+      })
     })), s = async () => {
-      await M(), !(!n.value || o.value || a.value) && (u.value = n.value.clientWidth, i.value = n.value.clientHeight);
-    }, B = t(() => ({
+      await I(), !(!n.value || o.value || r.value) && (i.value = n.value.clientWidth, u.value = n.value.clientHeight);
+    }, T = a(() => ({
       zIndex: e.zIndex
     }));
-    I(s), V(
+    V(s), N(
       () => [
         e.value,
         e.max,
-        r.value,
+        t.value,
         e.ribbonCorner,
         e.ribbonTilt,
         e.size,
@@ -79,10 +83,10 @@ const $ = /* @__PURE__ */ N({
       ],
       s
     );
-    const c = { props: e, resolvedType: r, isDotType: b, isTagType: o, isRibbon: a, modifiers: h, containerModifiers: x, ribbonCornerModifiers: q, displayValue: _, shouldHideOnFalsyValue: p, shouldShowBadge: z, appliedOffset: l, containerStyle: S, badge: n, badgeWidth: u, badgeHeight: i, styles: T, updateBadgeSize: s, ribbonFrameStyle: B };
+    const c = { props: e, resolvedType: t, isDotType: b, isTagType: o, isRibbon: r, modifiers: g, containerModifiers: h, ribbonCornerModifiers: x, displayValue: q, shouldHideOnFalsyValue: p, shouldShowBadge: _, appliedOffset: l, containerStyle: z, badge: n, badgeWidth: i, badgeHeight: u, styles: S, updateBadgeSize: s, ribbonFrameStyle: T };
     return Object.defineProperty(c, "__isScriptSetup", { enumerable: !1, value: !0 }), c;
   }
 });
 export {
-  $ as default
+  X as default
 };

package/dist/components/data/nmorph-calendar/NmorphCalendar.vue2.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import './NmorphCalendar.css';
-import { defineComponent as R, ref as x, onMounted as O, reactive as k, watch as v, computed as s } from "vue";
+import { defineComponent as R, ref as x, onMounted as O, reactive as k, watch as v, computed as i } from "vue";
 import { useModifiers as j } from "../../../utils/create-modifiers.js";
-import { toCssSize as z } from "../../../utils/common.js";
+import { createCssSizeVariables as z } from "../../../utils/common.js";
 import W from "./inner-components/nmorph-calendar-header/NmorphCalendarHeader.vue.js";
 import { useCalendarTexts as Z } from "./hooks/use-calendar-texts.js";
 import { hasAnyRangeDateInPrevMonth as F, hasAnyRangeDateInNextMonth as G, isTodayInMonthRange as J, resetTimeToZero as d, getMonthDaysByWeek as K } from "./utils.js";
@@ -21,7 +21,7 @@ const ue = /* @__PURE__ */ R({
   emits: ["update:model-value", "update-initial-date"],
   setup(N, { expose: b, emit: _ }) {
     b();
-    const a = N, i = _, { days: h } = Z(), y = () => {
+    const r = N, s = _, { days: h } = Z(), y = () => {
       o.value = M.value;
     }, C = () => {
       o.value = /* @__PURE__ */ new Date();
@@ -31,64 +31,64 @@ const ue = /* @__PURE__ */ R({
       throw new Error("model value and type prop not matched");
     }, c = (e) => {
       if (e === null) return null;
-      if (a.type === "date") {
+      if (r.type === "date") {
         if (e instanceof Date)
           return d(e);
         u();
       }
-      const l = Array.isArray(e) && e.every((r) => r instanceof Date);
-      if (a.type === "dates") {
+      const l = Array.isArray(e) && e.every((a) => a instanceof Date);
+      if (r.type === "dates") {
         if (l)
-          return e.map((r) => d(r));
+          return e.map((a) => d(a));
         u();
       }
-      if (a.type === "daterange") {
+      if (r.type === "daterange") {
         if (l)
-          return e.map((r) => d(r)).slice(0, 2);
+          return e.map((a) => d(a)).slice(0, 2);
         u();
       }
     }, B = (e) => {
       if (t.value === null) return;
-      const { monthType: l, hidden: r } = e;
-      if (r) return;
+      const { monthType: l, hidden: a } = e;
+      if (a) return;
       l === "next" && g(), l === "previous" && y();
       const { date: n } = e;
-      if (a.type === "date" && (t.value = n, i("update:model-value", t.value)), a.type === "dates") {
+      if (r.type === "date" && (t.value = n, s("update:model-value", t.value)), r.type === "dates") {
         if (!Array.isArray(t.value)) return u();
         const m = n.toDateString(), w = t.value.map((P) => P.toDateString()).indexOf(m);
-        w !== -1 ? t.value.splice(w, 1) : t.value.push(n), i("update:model-value", t.value);
+        w !== -1 ? t.value.splice(w, 1) : t.value.push(n), s("update:model-value", t.value);
       }
-      if (a.type === "daterange") {
+      if (r.type === "daterange") {
         if (!Array.isArray(t.value)) return u();
-        t.value.length === 0 ? t.value.push(n) : t.value.length === 1 ? n < t.value[0] ? t.value = [n, t.value[0]] : t.value.push(n) : t.value = [n], i("update:model-value", t.value.slice(0, 2));
+        t.value.length === 0 ? t.value.push(n) : t.value.length === 1 ? n < t.value[0] ? t.value = [n, t.value[0]] : t.value.push(n) : t.value = [n], s("update:model-value", t.value.slice(0, 2));
       }
     }, D = (e, l) => {
-      const [r, n] = l;
-      return l.length === 1 ? e.toDateString() === r.toDateString() : r && n ? e >= d(r) && e <= d(n) : !1;
-    }, q = (e) => {
+      const [a, n] = l;
+      return l.length === 1 ? e.toDateString() === a.toDateString() : a && n ? e >= d(a) && e <= d(n) : !1;
+    }, V = (e) => {
       if (t.value === null) return !1;
-      if (a.type === "date")
+      if (r.type === "date")
         return Array.isArray(t.value) ? u() : t.value.toDateString() === e.toDateString();
-      if (a.type === "dates")
-        return Array.isArray(t.value) ? !!t.value.find((r) => r.toDateString() === e.toDateString()) : u();
-      if (a.type === "daterange")
+      if (r.type === "dates")
+        return Array.isArray(t.value) ? !!t.value.find((a) => a.toDateString() === e.toDateString()) : u();
+      if (r.type === "daterange")
         return Array.isArray(t.value) ? D(e, t.value) : u();
-    }, o = x(a.initialDate), t = x(c(a.modelValue));
+    }, o = x(r.initialDate), t = x(c(r.modelValue));
     O(() => {
-      i("update:model-value", t.value);
+      s("update:model-value", t.value);
     });
     let p = k([]);
     const f = () => {
-      p = [], K(o, a.range).forEach((l) => {
-        const r = {};
+      p = [], K(o, r.range).forEach((l) => {
+        const a = {};
         l.forEach((n, m) => {
           const T = h[m];
-          r[T] = n;
-        }), p.push(r);
+          a[T] = n;
+        }), p.push(a);
       });
     };
     v(
-      () => a.initialDate,
+      () => r.initialDate,
       (e) => {
         o.value = e;
       },
@@ -96,33 +96,35 @@ const ue = /* @__PURE__ */ R({
         deep: !0
       }
     ), v(o, () => {
-      f(), i("update-initial-date", o.value);
+      f(), s("update-initial-date", o.value);
     }), v(
-      () => a.modelValue,
+      () => r.modelValue,
       (e) => {
         t.value = c(e);
       }
     );
-    const M = s(() => new Date(o.value.setMonth(o.value.getMonth() - 1))), A = s(() => new Date(o.value.setMonth(o.value.getMonth() + 1))), V = s(() => {
-      const { range: e } = a, l = e ? F(o.value, e[0]) : !0, r = e ? G(o.value, e[1]) : !0, n = J(e);
+    const M = i(() => new Date(o.value.setMonth(o.value.getMonth() - 1))), A = i(() => new Date(o.value.setMonth(o.value.getMonth() + 1))), q = i(() => {
+      const { range: e } = r, l = e ? F(o.value, e[0]) : !0, a = e ? G(o.value, e[1]) : !0, n = J(e);
       return {
         showPreviousMonthButton: l,
-        showNextMonthButton: r,
+        showNextMonthButton: a,
         showTodayButton: n
       };
-    }), E = s(
+    }), E = i(
       () => j({
         "nmorph-calendar": []
       })
-    ), H = s(() => ({
-      ...a.cellHeight !== void 0 && { "--table-data-cell-height": z(a.cellHeight) }
-    })), I = (e) => e;
+    ), H = i(
+      () => z({
+        "--table-data-cell-height": r.cellHeight
+      })
+    ), I = (e) => e;
     f();
-    const S = { props: a, emit: i, days: h, setPreviousMonth: y, setTodayMonth: C, setNextMonth: g, wrongType: u, convertValue: c, clickDate: B, isDateInRange: D, isValueSelected: q, initialDate: o, selectedValue: t, get calendar() {
+    const S = { props: r, emit: s, days: h, setPreviousMonth: y, setTodayMonth: C, setNextMonth: g, wrongType: u, convertValue: c, clickDate: B, isDateInRange: D, isValueSelected: V, initialDate: o, selectedValue: t, get calendar() {
       return p;
     }, set calendar(e) {
       p = e;
-    }, updateCalendar: f, prevMonth: M, nextMonth: A, showHeaderButtons: V, modifiers: E, styles: H, dateData: I, get NmorphTable() {
+    }, updateCalendar: f, prevMonth: M, nextMonth: A, showHeaderButtons: q, modifiers: E, styles: H, dateData: I, get NmorphTable() {
       return U;
     }, get NmorphTableColumn() {
       return Q;

package/dist/components/data/nmorph-card/NmorphCard.vue2.js CHANGED Viewed

@@ -1,9 +1,9 @@
 import './NmorphCard.css';
-import { defineComponent as n, useSlots as p, computed as d } from "vue";
-import { NmorphShadowType as l } from "../../../types/index.js";
+import { defineComponent as p, useSlots as l, computed as o } from "vue";
 import { useModifiers as u } from "../../../utils/create-modifiers.js";
 import { toCssSize as f } from "../../../utils/common.js";
-const S = /* @__PURE__ */ n({
+import { NmorphShadowType as m } from "../../../types/common.types.js";
+const S = /* @__PURE__ */ p({
   __name: "NmorphCard",
   props: {
     shadowType: { type: null, required: !1, default: "outset" },
@@ -13,19 +13,22 @@ const S = /* @__PURE__ */ n({
     fill: { type: Boolean, required: !1, default: !0 },
     tag: { type: String, required: !1, default: "div" }
   },
-  setup(o, { expose: t }) {
-    t();
-    const e = o, i = p(), a = d(
+  setup(t, { expose: i }) {
+    i();
+    const e = t, a = l(), n = o(
       () => u({
-        nmorph: [l[e.shadowType]],
+        nmorph: [m[e.shadowType]],
         "nmorph-card": [e.shadowType, e.fill ? "fill" : "fit-content"]
       })
-    ), s = d(() => ({
-      ...e.shadowType === "combined" && {
-        "--nmorph-card-combined-border-width": `${e.combinedShadowBorderWidth}px`
-      },
-      ...e.cardPadding !== void 0 && { "--card-padding": f(e.cardPadding) }
-    })), r = { props: e, slots: i, modifiers: a, styles: s };
+    ), s = o(() => {
+      const d = e.cardPadding !== void 0 ? f(e.cardPadding) : void 0;
+      return {
+        ...e.shadowType === "combined" && {
+          "--nmorph-card-combined-border-width": `${e.combinedShadowBorderWidth}px`
+        },
+        ...d !== void 0 && { "--card-padding": d, padding: d }
+      };
+    }), r = { props: e, slots: a, modifiers: n, styles: s };
     return Object.defineProperty(r, "__isScriptSetup", { enumerable: !1, value: !0 }), r;
   }
 });

package/dist/components/data/nmorph-collapse/components/nmorph-collapse-item/NmorphCollapseItem.vue2.js CHANGED Viewed

@@ -1,8 +1,9 @@
 import './NmorphCollapseItem.css';
-import { defineComponent as H, ref as u, computed as d, inject as b, onMounted as z, onBeforeUnmount as M, watch as h, nextTick as w } from "vue";
+import { defineComponent as H, ref as u, computed as d, inject as v, onMounted as z, onBeforeUnmount as M, watch as h, nextTick as w } from "vue";
 import { useModifiers as g } from "../../../../../utils/create-modifiers.js";
-import { NmorphComponentHeight as x } from "../../../../../types/index.js";
-const N = /* @__PURE__ */ H({
+import { createCssVariables as x } from "../../../../../utils/common.js";
+import { NmorphComponentHeight as A } from "../../../../../types/common.types.js";
+const j = /* @__PURE__ */ H({
   __name: "NmorphCollapseItem",
   props: {
     height: { type: null, required: !1, default: "basic" },
@@ -15,42 +16,44 @@ const N = /* @__PURE__ */ H({
   emits: ["click-item"],
   setup(y, { expose: O, emit: _ }) {
     O();
-    const e = y, p = _, n = u(!1), k = d(
+    const e = y, c = _, r = u(!1), k = d(
       () => g({
-        "nmorph-collapse-item": [e.disabled && "disabled", e.block && "block", n.value && "is-open"]
+        "nmorph-collapse-item": [e.disabled && "disabled", e.block && "block", r.value && "is-open"]
       })
-    ), S = d(
+    ), C = d(
       () => g({
-        nmorph: [x[e.height]]
+        nmorph: [A[e.height]]
       })
-    ), c = (t) => typeof t == "number" ? `${t}ms` : t, C = d(() => ({
-      ...e.transitionSpeed !== void 0 && { "--transition-speed": c(e.transitionSpeed) }
-    })), o = b("collapse-data"), m = b("update-model"), r = u(null), f = u(0);
+    ), p = (t) => typeof t == "number" ? `${t}ms` : t, S = d(
+      () => x({
+        "--transition-speed": p(e.transitionSpeed)
+      })
+    ), i = v("collapse-data"), m = v("update-model"), n = u(null), f = u(0);
     let s = null;
     const l = (t) => Array.isArray(t) ? t.includes(e.name) : t === e.name, a = () => {
-      f.value = n.value && r.value ? r.value.scrollHeight : 0;
-    }, i = () => w(a), q = () => {
-      e.disabled || e.block || (n.value = !n.value, m?.(e.name, n.value), p("click-item", { id: e.name, isOpen: n.value }));
+      f.value = r.value && n.value ? n.value.scrollHeight : 0;
+    }, o = () => w(a), q = () => {
+      e.disabled || e.block || (r.value = !r.value, m?.(e.name, r.value), c("click-item", { id: e.name, isOpen: r.value }));
     };
     z(() => {
-      n.value = l(o?.value), i(), "ResizeObserver" in window && r.value && (s = new ResizeObserver(a), s.observe(r.value));
+      r.value = l(i?.value), o(), "ResizeObserver" in window && n.value && (s = new ResizeObserver(a), s.observe(n.value));
     }), M(() => {
       s?.disconnect();
     }), h(
-      () => o?.value,
+      () => i?.value,
       (t) => {
-        n.value = l(t), i();
+        r.value = l(t), o();
       },
       { deep: !0 }
-    ), h(n, i);
-    const v = { props: e, emit: p, isOpen: n, modifiers: k, titleModifiers: S, getCssDuration: c, styles: C, collapseData: o, updateModel: m, collapseItemDOMElContent: r, contentHeight: f, get resizeObserver() {
+    ), h(r, o);
+    const b = { props: e, emit: c, isOpen: r, modifiers: k, titleModifiers: C, getCssDuration: p, styles: S, collapseData: i, updateModel: m, collapseItemDOMElContent: n, contentHeight: f, get resizeObserver() {
       return s;
     }, set resizeObserver(t) {
       s = t;
-    }, isValueOpen: l, updateContentHeight: a, updateContentHeightAfterRender: i, clickHandler: q };
-    return Object.defineProperty(v, "__isScriptSetup", { enumerable: !1, value: !0 }), v;
+    }, isValueOpen: l, updateContentHeight: a, updateContentHeightAfterRender: o, clickHandler: q };
+    return Object.defineProperty(b, "__isScriptSetup", { enumerable: !1, value: !0 }), b;
   }
 });
 export {
-  N as default
+  j as default
 };

package/dist/components/data/nmorph-empty/NmorphEmpty.vue2.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import './NmorphEmpty.css';
-import { defineComponent as u, useSlots as f, computed as t } from "vue";
-import { NmorphShadowType as c } from "../../../types/index.js";
-import { useModifiers as h } from "../../../utils/create-modifiers.js";
-import { toCssSize as r } from "../../../utils/common.js";
-import g from "../../../assets/icons/folder-opened.svg.js";
-import y from "../../basic/nmorph-icon/NmorphIcon.vue.js";
-const z = /* @__PURE__ */ u({
+import { defineComponent as m, useSlots as u, computed as t } from "vue";
+import { useModifiers as f } from "../../../utils/create-modifiers.js";
+import { createCssSizeVariables as c, toCssSize as h } from "../../../utils/common.js";
+import { NmorphShadowType as g } from "../../../types/common.types.js";
+import y from "../../../assets/icons/folder-opened.svg.js";
+import S from "../../basic/nmorph-icon/NmorphIcon.vue.js";
+const v = /* @__PURE__ */ m({
   __name: "NmorphEmpty",
   props: {
     title: { type: String, required: !1, default: "No data" },
@@ -20,27 +20,29 @@ const z = /* @__PURE__ */ u({
     ariaLabel: { type: String, required: !1, default: void 0 },
     ariaOrientation: { type: String, required: !1, default: void 0 }
   },
-  setup(n, { expose: p }) {
-    p();
-    const e = n, o = f(), s = t(() => !e.hideIcon || !!o.icon), a = t(() => !!(e.description || o.description)), d = t(() => e.ariaLabel || e.title), l = t(
-      () => h({
-        nmorph: [e.design === "nmorph" ? c[e.shadowType] : ""],
+  setup(o, { expose: n }) {
+    n();
+    const e = o, r = u(), s = t(() => !e.hideIcon || !!r.icon), a = t(() => !!(e.description || r.description)), p = t(() => e.ariaLabel || e.title), d = t(
+      () => f({
+        nmorph: [e.design === "nmorph" ? g[e.shadowType] : ""],
         "nmorph-empty": [e.design]
       })
-    ), m = t(() => ({
-      "--nmorph-empty-icon-size": r(e.iconSize),
-      "--nmorph-empty-min-height": r(e.minHeight),
-      "--nmorph-empty-padding": r(e.padding)
-    })), i = { props: e, slots: o, hasIcon: s, hasDescription: a, label: d, modifiers: l, styles: m, get NmorphIcon() {
-      return y;
+    ), l = t(
+      () => c({
+        "--nmorph-empty-icon-size": e.iconSize,
+        "--nmorph-empty-min-height": e.minHeight,
+        "--nmorph-empty-padding": e.padding
+      })
+    ), i = { props: e, slots: r, hasIcon: s, hasDescription: a, label: p, modifiers: d, styles: l, get NmorphIcon() {
+      return S;
     }, get NmorphIconFolderOpened() {
-      return g;
+      return y;
     }, get toCssSize() {
-      return r;
+      return h;
     } };
     return Object.defineProperty(i, "__isScriptSetup", { enumerable: !1, value: !0 }), i;
   }
 });
 export {
-  z as default
+  v as default
 };