@nmorph/nmorph-ui-kit 3.0.16 → 3.0.18

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

@@ -1,5 +1,5 @@
 import './NmorphButton.css';
-import { defineComponent as N, useSlots as x, computed as l, ref as _, Fragment as I, Comment as k, Text as c } from "vue";
+import { defineComponent as N, useSlots as x, computed as l, ref as _, Fragment as I, Comment as k, Text as f } from "vue";
 import { useModifiers as O } from "../../../utils/create-modifiers.js";
 import { NmorphComponentThickness as C } from "../../../types/common.types.js";
 import M from "../../../assets/icons/loading.svg.js";
@@ -9,7 +9,7 @@ const E = /* @__PURE__ */ N({
   props: {
     design: { type: null, required: !1, default: "nmorph" },
     borderless: { type: Boolean, required: !1, default: !1 },
-    color: { type: String, required: !1, default: void 0 },
+    color: { type: String, required: !1 },
     loading: { type: Boolean, required: !1, default: !1 },
     ripple: { type: Boolean, required: !1, default: !0 },
     type: { type: null, required: !1, default: "button" },
@@ -32,9 +32,9 @@ const E = /* @__PURE__ */ N({
   setup(m, { expose: y, emit: h }) {
     const e = m, n = h, r = x(), g = l(() => !!r.icon), i = l(() => !!r["icon-only"]), s = l(() => e.active || !!e.modelValue), a = (t) => t.flatMap(
       (o) => o.type === I && Array.isArray(o.children) ? a(o.children) : o
-    ), u = (t) => t.type === k || t.type === c && typeof t.children == "string" && t.children.trim() === "", b = () => {
+    ), u = (t) => t.type === k || t.type === f && typeof t.children == "string" && t.children.trim() === "", b = () => {
       const t = a(r.default?.() ?? []).filter((o) => !u(o));
-      return t.length > 0 && t.every((o) => o.type === c);
+      return t.length > 0 && t.every((o) => o.type === f);
     }, v = l(
       () => O({
         nmorph: [C[e.thickness], e.fill && "fill"],
@@ -63,12 +63,12 @@ const E = /* @__PURE__ */ N({
       !e.toggle || e.disabled || e.loading || n("update:model-value", !e.modelValue);
     };
     y({ buttonDOMElement: d });
-    const f = { props: e, emit: n, slots: r, hasIconSlot: g, hasIconOnlySlot: i, active: s, flattenSlotNodes: a, isEmptySlotNode: u, hasTextOnlyDefaultSlot: b, modifiers: v, buttonDOMElement: d, loadingIconSizeMap: p, loadingIconSize: q, buttonColorStyles: B, toggleClickHandler: S, get NmorphIcon() {
+    const c = { props: e, emit: n, slots: r, hasIconSlot: g, hasIconOnlySlot: i, active: s, flattenSlotNodes: a, isEmptySlotNode: u, hasTextOnlyDefaultSlot: b, modifiers: v, buttonDOMElement: d, loadingIconSizeMap: p, loadingIconSize: q, buttonColorStyles: B, toggleClickHandler: S, get NmorphIcon() {
       return H;
     }, get NmorphIconLoader() {
       return M;
     } };
-    return Object.defineProperty(f, "__isScriptSetup", { enumerable: !1, value: !0 }), f;
+    return Object.defineProperty(c, "__isScriptSetup", { enumerable: !1, value: !0 }), c;
   }
 });
 export {

package/dist/components/basic/nmorph-layout/NmorphLayout.vue.js

@@ -1,12 +1,12 @@
 import './NmorphLayout.css';
-import l from "./NmorphLayout.vue2.js";
-import { openBlock as s, createBlock as n, resolveDynamicComponent as d, normalizeStyle as m, normalizeClass as _, withCtx as c, createElementBlock as r, renderSlot as t, createCommentVNode as a, createElementVNode as i } from "vue";
+import n from "./NmorphLayout.vue2.js";
+import { openBlock as s, createBlock as l, resolveDynamicComponent as d, normalizeProps as m, guardReactiveProps as _, withCtx as c, createElementBlock as t, renderSlot as r, createCommentVNode as a, createElementVNode as i } from "vue";
 /* empty css                  */
 import h from "../../../_virtual/_plugin-vue_export-helper.js";
-const f = {
+const p = {
   key: 0,
   class: "nmorph-layout__header"
-}, p = { class: "nmorph-layout__body" }, y = {
+}, f = { class: "nmorph-layout__body" }, y = {
   key: 0,
   class: "nmorph-layout__aside"
 }, u = { class: "nmorph-layout__main" }, k = {
@@ -16,35 +16,38 @@ const f = {
   key: 1,
   class: "nmorph-layout__footer"
 };
-function C(e, N, b, o, B, g) {
-  return s(), n(d(o.props.tag), {
-    class: _(o.modifiers),
-    style: m(o.styles)
-  }, {
-    default: c(() => [
-      o.slots.header ? (s(), r("header", f, [
-        t(e.$slots, "header")
-      ])) : a("v-if", !0),
-      i("div", p, [
-        o.slots.aside && o.props.asidePosition === "left" ? (s(), r("aside", y, [
-          t(e.$slots, "aside")
+function N(e, P, b, o, g, B) {
+  return s(), l(
+    d(o.props.tag),
+    m(_(o.rootAttrs)),
+    {
+      default: c(() => [
+        o.slots.header ? (s(), t("header", p, [
+          r(e.$slots, "header")
         ])) : a("v-if", !0),
-        i("main", u, [
-          t(e.$slots, "default")
+        i("div", f, [
+          o.slots.aside && o.props.asidePosition === "left" ? (s(), t("aside", y, [
+            r(e.$slots, "aside")
+          ])) : a("v-if", !0),
+          i("main", u, [
+            r(e.$slots, "default")
+          ]),
+          o.slots.aside && o.props.asidePosition === "right" ? (s(), t("aside", k, [
+            r(e.$slots, "aside")
+          ])) : a("v-if", !0)
         ]),
-        o.slots.aside && o.props.asidePosition === "right" ? (s(), r("aside", k, [
-          t(e.$slots, "aside")
+        o.slots.footer ? (s(), t("footer", v, [
+          r(e.$slots, "footer")
         ])) : a("v-if", !0)
       ]),
-      o.slots.footer ? (s(), r("footer", v, [
-        t(e.$slots, "footer")
-      ])) : a("v-if", !0)
-    ]),
-    _: 3
-    /* FORWARDED */
-  }, 8, ["class", "style"]);
+      _: 3
+      /* FORWARDED */
+    },
+    16
+    /* FULL_PROPS */
+  );
 }
-const P = /* @__PURE__ */ h(l, [["render", C], ["__file", "/home/runner/work/nmorph/nmorph/library/src/components/basic/nmorph-layout/NmorphLayout.vue"]]);
+const V = /* @__PURE__ */ h(n, [["render", N], ["__file", "/home/runner/work/nmorph/nmorph/library/src/components/basic/nmorph-layout/NmorphLayout.vue"]]);
 export {
-  P as default
+  V as default
 };

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

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

package/dist/components/basic/nmorph-link/NmorphLink.css

@@ -1 +1 @@
-.nmorph-link{--nmorph-private-link-color: var(--nmorph-accent-color);display:inline-block}.nmorph-link a{display:flex;align-items:center;color:var(--nmorph-private-link-color);text-decoration:none}.nmorph-link .nmorph-link__icon{margin:0 var(--indentation-02);--nmorph-private-icon-color: var(--nmorph-private-link-color)}.nmorph-link:hover{filter:brightness(85%)}.nmorph-link.nmorph-link--underline{position:relative}.nmorph-link.nmorph-link--underline:not(.nmorph-link--disabled):hover:before{position:absolute;right:0;bottom:0;left:0;height:0;border-bottom:1px solid var(--nmorph-private-link-color);content:""}.nmorph-link.nmorph-link--disabled{cursor:not-allowed;opacity:.6}.nmorph-link.nmorph-link--disabled a{pointer-events:none}.nmorph-link.nmorph-link--success{--nmorph-private-link-color: var(--nmorph-success-color)}.nmorph-link.nmorph-link--warning{--nmorph-private-link-color: var(--nmorph-warn-color)}.nmorph-link.nmorph-link--error{--nmorph-private-link-color: var(--nmorph-error-color)}
+.nmorph-link{--nmorph-private-link-color: var(--nmorph-accent-color);display:inline-block}.nmorph-link a{display:flex;align-items:center;color:var(--nmorph-private-link-color);text-decoration:none}.nmorph-link .nmorph-link__icon{margin:0 var(--indentation-02);--nmorph-private-icon-color: var(--nmorph-private-link-color)}.nmorph-link:hover{filter:brightness(85%)}.nmorph-link.nmorph-link--underline{position:relative}.nmorph-link.nmorph-link--underline:not(.nmorph-link--disabled):hover:before{position:absolute;right:0;bottom:0;left:0;height:0;border-bottom:1px solid var(--nmorph-private-link-color);content:""}.nmorph-link.nmorph-link--disabled{cursor:not-allowed;opacity:.6}.nmorph-link.nmorph-link--disabled a{pointer-events:none}.nmorph-link.nmorph-link--success{--nmorph-private-link-color: var(--nmorph-success-text-color)}.nmorph-link.nmorph-link--warning{--nmorph-private-link-color: var(--nmorph-warn-text-color)}.nmorph-link.nmorph-link--error{--nmorph-private-link-color: var(--nmorph-error-text-color)}

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

@@ -1,8 +1,8 @@
 import './NmorphLink.css';
 import { defineComponent as y, useSlots as g, computed as r } from "vue";
-import { useModifiers as v } from "../../../utils/create-modifiers.js";
-import { createCssVariables as h } from "../../../utils/common.js";
-import * as q from "../nmorph-icon/NmorphIcons.js";
+import { useModifiers as h } from "../../../utils/create-modifiers.js";
+import { createCssVariables as q } from "../../../utils/common.js";
+import * as v from "../nmorph-icon/NmorphIcons.js";
 import { NmorphLinkTarget as S } from "./types.js";
 import { NmorphColor as N } from "../../../types/common.types.js";
 import _ from "../nmorph-icon/NmorphIcon.vue.js";
@@ -21,20 +21,20 @@ const L = /* @__PURE__ */ y({
     ariaLabel: { type: String, required: !1, default: void 0 },
     title: { type: String, required: !1, default: void 0 },
     disabled: { type: Boolean, required: !1, default: !1 },
-    color: { type: String, required: !1, default: void 0 },
+    color: { type: String, required: !1 },
     iconName: { type: String, required: !1, default: void 0 }
   },
   setup(n, { expose: d }) {
     d();
-    const e = n, s = g(), t = q, o = (m) => m.split(/[-_\s]+/).filter(Boolean).map((a) => `${a.charAt(0).toUpperCase()}${a.slice(1)}`).join(""), f = r(() => {
+    const e = n, s = g(), t = v, o = (m) => m.split(/[-_\s]+/).filter(Boolean).map((a) => `${a.charAt(0).toUpperCase()}${a.slice(1)}`).join(""), f = r(() => {
       if (e.iconName)
         return e.iconName in t ? t[e.iconName] : t[`NmorphIcon${o(e.iconName)}`];
     }), p = r(
-      () => v({
+      () => h({
         "nmorph-link": [e.type, e.underline && "underline", e.disabled && "disabled"]
       })
     ), u = r(
-      () => h({
+      () => q({
         "--nmorph-private-link-color": e.color
       })
     ), l = r(() => S[e.target] ?? e.target), c = r(() => ({

package/dist/components/basic/nmorph-space/NmorphSpace.vue.js

@@ -1,21 +1,24 @@
 import './NmorphSpace.css';
 import e from "./NmorphSpace.vue2.js";
-import { openBlock as s, createBlock as t, resolveDynamicComponent as n, normalizeStyle as a, normalizeClass as m, withCtx as p, renderSlot as c } from "vue";
+import { openBlock as t, createBlock as p, resolveDynamicComponent as n, normalizeProps as a, guardReactiveProps as c, withCtx as m, renderSlot as s } from "vue";
 /* empty css                 */
-import l from "../../../_virtual/_plugin-vue_export-helper.js";
-function i(r, f, _, o, d, h) {
-  return s(), t(n(o.props.tag), {
-    class: m(o.modifiers),
-    style: a(o.styles)
-  }, {
-    default: p(() => [
-      c(r.$slots, "default")
-    ]),
-    _: 3
-    /* FORWARDED */
-  }, 8, ["class", "style"]);
+import i from "../../../_virtual/_plugin-vue_export-helper.js";
+function f(o, l, _, r, d, h) {
+  return t(), p(
+    n(r.props.tag),
+    a(c(r.rootAttrs)),
+    {
+      default: m(() => [
+        s(o.$slots, "default")
+      ]),
+      _: 3
+      /* FORWARDED */
+    },
+    16
+    /* FULL_PROPS */
+  );
 }
-const x = /* @__PURE__ */ l(e, [["render", i], ["__file", "/home/runner/work/nmorph/nmorph/library/src/components/basic/nmorph-space/NmorphSpace.vue"]]);
+const S = /* @__PURE__ */ i(e, [["render", f], ["__file", "/home/runner/work/nmorph/nmorph/library/src/components/basic/nmorph-space/NmorphSpace.vue"]]);
 export {
-  x as default
+  S as default
 };

package/dist/components/basic/nmorph-space/NmorphSpace.vue2.js

@@ -1,8 +1,10 @@
 import './NmorphSpace.css';
-import { defineComponent as d, computed as t } from "vue";
-import { useModifiers as m } from "../../../utils/create-modifiers.js";
-import { toCssSize as c } from "../../../utils/common.js";
-const _ = /* @__PURE__ */ d({
+import { defineComponent as m, computed as t } from "vue";
+import { useModifiers as c } from "../../../utils/create-modifiers.js";
+import { toCssSize as y } from "../../../utils/common.js";
+import { useMergedAttrs as g } from "../../../utils/attrs.js";
+const v = /* @__PURE__ */ m({
+  inheritAttrs: !1,
   __name: "NmorphSpace",
   props: {
     tag: { type: String, required: !1, default: "div" },
@@ -14,28 +16,28 @@ const _ = /* @__PURE__ */ d({
     inline: { type: Boolean, required: !1, default: !1 },
     fill: { type: Boolean, required: !1, default: !1 }
   },
-  setup(p, { expose: o }) {
-    o();
-    const e = p, r = {
+  setup(f, { expose: u }) {
+    u();
+    const e = f, r = {
       small: "4px",
       medium: "8px",
       large: "16px"
-    }, f = t(
-      () => m({
+    }, i = t(
+      () => c({
         "nmorph-space": [e.direction, e.wrap && "wrap", e.inline && "inline", e.fill && "fill"]
       })
-    ), i = (n) => c(r[n] || n), a = t(
+    ), s = (p) => y(r[p] || p), a = t(
       () => e.align === "start" || e.align === "end" ? `flex-${e.align}` : e.align
-    ), s = t(
+    ), n = t(
       () => e.justify === "start" || e.justify === "end" ? `flex-${e.justify}` : e.justify
-    ), u = t(() => ({
-      "--nmorph-private-space-gap": i(e.size),
+    ), l = t(() => ({
+      "--nmorph-private-space-gap": s(e.size),
       "--nmorph-private-space-align": a.value,
-      "--nmorph-private-space-justify": s.value
-    })), l = { props: e, sizeMap: r, modifiers: f, resolveSpaceSize: i, alignItems: a, justifyContent: s, styles: u };
-    return Object.defineProperty(l, "__isScriptSetup", { enumerable: !1, value: !0 }), l;
+      "--nmorph-private-space-justify": n.value
+    })), d = g(i, l), o = { props: e, sizeMap: r, modifiers: i, resolveSpaceSize: s, alignItems: a, justifyContent: n, styles: l, rootAttrs: d };
+    return Object.defineProperty(o, "__isScriptSetup", { enumerable: !1, value: !0 }), o;
   }
 });
 export {
-  _ as default
+  v as default
 };

package/dist/components/basic/nmorph-text/NmorphText.vue.js

@@ -1,23 +1,26 @@
 import e from "./NmorphText.vue2.js";
-import { openBlock as t, createBlock as s, resolveDynamicComponent as n, normalizeStyle as a, normalizeClass as l, withCtx as m, renderSlot as p, createTextVNode as c, toDisplayString as i } from "vue";
+import { openBlock as t, createBlock as n, resolveDynamicComponent as p, normalizeProps as a, guardReactiveProps as s, withCtx as m, renderSlot as c, createTextVNode as i, toDisplayString as l } from "vue";
 import f from "../../../_virtual/_plugin-vue_export-helper.js";
-function _(r, d, h, o, x, y) {
-  return t(), s(n(o.props.as), {
-    class: l(o.modifiers),
-    style: a(o.styles)
-  }, {
-    default: m(() => [
-      p(r.$slots, "default", {}, () => [
-        c(
-          i(o.props.text),
-          1
-          /* TEXT */
-        )
-      ])
-    ]),
-    _: 3
-    /* FORWARDED */
-  }, 8, ["class", "style"]);
+function _(o, d, h, r, x, u) {
+  return t(), n(
+    p(r.props.as),
+    a(s(r.rootAttrs)),
+    {
+      default: m(() => [
+        c(o.$slots, "default", {}, () => [
+          i(
+            l(r.props.text),
+            1
+            /* TEXT */
+          )
+        ])
+      ]),
+      _: 3
+      /* FORWARDED */
+    },
+    16
+    /* FULL_PROPS */
+  );
 }
 const N = /* @__PURE__ */ f(e, [["render", _], ["__file", "/home/runner/work/nmorph/nmorph/library/src/components/basic/nmorph-text/NmorphText.vue"]]);
 export {

package/dist/components/basic/nmorph-text/NmorphText.vue2.js

@@ -1,7 +1,9 @@
-import { defineComponent as i, computed as o } from "vue";
-import { useModifiers as s } from "../../../utils/create-modifiers.js";
-import { createCssVariables as c } from "../../../utils/common.js";
-const f = /* @__PURE__ */ i({
+import { defineComponent as p, computed as l } from "vue";
+import { useModifiers as c } from "../../../utils/create-modifiers.js";
+import { createCssVariables as u } from "../../../utils/common.js";
+import { useMergedAttrs as f } from "../../../utils/attrs.js";
+const x = /* @__PURE__ */ p({
+  inheritAttrs: !1,
   __name: "NmorphText",
   props: {
     as: { type: String, required: !1, default: "span" },
@@ -10,13 +12,16 @@ const f = /* @__PURE__ */ i({
     weight: { type: null, required: !1, default: void 0 },
     color: { type: null, required: !1, default: "text" },
     align: { type: null, required: !1, default: "inherit" },
+    selectable: { type: Boolean, required: !1, default: !0 },
+    italic: { type: Boolean, required: !1, default: !1 },
+    noLineHeight: { type: Boolean, required: !1, default: !1 },
     truncate: { type: Boolean, required: !1, default: !1 },
     nowrap: { type: Boolean, required: !1, default: !1 },
     lineClamp: { type: Number, required: !1, default: void 0 }
   },
-  setup(a, { expose: l }) {
-    l();
-    const e = a, r = {
+  setup(n, { expose: i }) {
+    i();
+    const e = n, r = {
       text: "var(--nmorph-text-color)",
       contrast: "var(--nmorph-contrast-text-color)",
       "semi-contrast": "var(--nmorph-semi-contrast-text-color)",
@@ -24,29 +29,32 @@ const f = /* @__PURE__ */ i({
       focus: "var(--nmorph-focus-text-color)",
       accent: "var(--nmorph-accent-color)",
       success: "var(--nmorph-success-text-color)",
-      warning: "var(--nmorph-warning-text-color)",
+      warning: "var(--nmorph-warn-text-color)",
       error: "var(--nmorph-error-text-color)",
       white: "var(--nmorph-white-color)"
-    }, n = o(
-      () => s({
+    }, t = l(
+      () => c({
         "nmorph-typography": [
           e.variant,
           e.weight,
+          !e.selectable && "not-selectable",
+          e.italic && "italic",
+          e.noLineHeight && "no-line-height",
           e.truncate && "truncate",
           e.nowrap && "nowrap",
           e.lineClamp && "line-clamp"
         ]
       })
-    ), p = o(
-      () => c({
+    ), o = l(
+      () => u({
         "--nmorph-private-text-color": r[e.color] || e.color,
         "--nmorph-private-text-align": e.align === "inherit" ? void 0 : e.align,
         "--nmorph-private-text-line-clamp": e.lineClamp
       })
-    ), t = { props: e, colorMap: r, modifiers: n, styles: p };
-    return Object.defineProperty(t, "__isScriptSetup", { enumerable: !1, value: !0 }), t;
+    ), s = f(t, o), a = { props: e, colorMap: r, modifiers: t, styles: o, rootAttrs: s };
+    return Object.defineProperty(a, "__isScriptSetup", { enumerable: !1, value: !0 }), a;
   }
 });
 export {
-  f as default
+  x as default
 };

package/dist/components/data/nmorph-audio-meter/NmorphAudioMeter.css

@@ -1 +1 @@
-.nmorph-audio-meter{--nmorph-private-audio-meter-color: var(--nmorph-success-color);--nmorph-private-audio-meter-warn-color: var(--nmorph-warn-color);--nmorph-private-audio-meter-error-color: var(--nmorph-error-color);--nmorph-private-audio-meter-track-color: color-mix(in srgb, var(--nmorph-text-color) 16%, transparent);--nmorph-private-audio-meter-percent: 0%;display:inline-flex;align-items:end}.nmorph-audio-meter.nmorph-audio-meter--warn{--nmorph-private-audio-meter-color: var(--nmorph-private-audio-meter-warn-color)}.nmorph-audio-meter.nmorph-audio-meter--error{--nmorph-private-audio-meter-color: var(--nmorph-private-audio-meter-error-color)}.nmorph-audio-meter.nmorph-audio-meter--bars{gap:2px;width:max-content;height:20px}.nmorph-audio-meter .nmorph-audio-meter__bar{width:4px;height:100%;background:var(--nmorph-private-audio-meter-track-color);border-radius:var(--border-radius-40);opacity:.7}.nmorph-audio-meter .nmorph-audio-meter__bar--active{background:var(--nmorph-private-audio-meter-color);opacity:1}.nmorph-audio-meter.nmorph-audio-meter--line{width:72px;height:6px;overflow:hidden;background:var(--nmorph-private-audio-meter-track-color);border-radius:var(--border-radius-40)}.nmorph-audio-meter .nmorph-audio-meter__line{display:block;width:var(--nmorph-private-audio-meter-percent);height:100%;background:var(--nmorph-private-audio-meter-color)}.nmorph-audio-meter.nmorph-audio-meter--ring{width:28px;height:28px}.nmorph-audio-meter .nmorph-audio-meter__ring{display:block;width:100%;height:100%;background:radial-gradient(circle at center,var(--nmorph-main-color) 56%,transparent 58%),conic-gradient(var(--nmorph-private-audio-meter-color) var(--nmorph-private-audio-meter-percent),var(--nmorph-private-audio-meter-track-color) 0);border-radius:var(--border-radius-circular)}
+.nmorph-audio-meter{--nmorph-private-audio-meter-color: var(--nmorph-success-text-color);--nmorph-private-audio-meter-warn-color: var(--nmorph-warn-text-color);--nmorph-private-audio-meter-error-color: var(--nmorph-error-text-color);--nmorph-private-audio-meter-track-color: color-mix(in srgb, var(--nmorph-text-color) 16%, transparent);--nmorph-private-audio-meter-percent: 0%;display:inline-flex;align-items:end}.nmorph-audio-meter.nmorph-audio-meter--warn{--nmorph-private-audio-meter-color: var(--nmorph-private-audio-meter-warn-color)}.nmorph-audio-meter.nmorph-audio-meter--error{--nmorph-private-audio-meter-color: var(--nmorph-private-audio-meter-error-color)}.nmorph-audio-meter.nmorph-audio-meter--bars{gap:2px;width:max-content;height:20px}.nmorph-audio-meter .nmorph-audio-meter__bar{width:4px;height:100%;background:var(--nmorph-private-audio-meter-track-color);border-radius:var(--border-radius-40);opacity:.7}.nmorph-audio-meter .nmorph-audio-meter__bar--active{background:var(--nmorph-private-audio-meter-color);opacity:1}.nmorph-audio-meter.nmorph-audio-meter--line{width:72px;height:6px;overflow:hidden;background:var(--nmorph-private-audio-meter-track-color);border-radius:var(--border-radius-40)}.nmorph-audio-meter .nmorph-audio-meter__line{display:block;width:var(--nmorph-private-audio-meter-percent);height:100%;background:var(--nmorph-private-audio-meter-color)}.nmorph-audio-meter.nmorph-audio-meter--ring{width:28px;height:28px}.nmorph-audio-meter .nmorph-audio-meter__ring{display:block;width:100%;height:100%;background:radial-gradient(circle at center,var(--nmorph-main-color) 56%,transparent 58%),conic-gradient(var(--nmorph-private-audio-meter-color) var(--nmorph-private-audio-meter-percent),var(--nmorph-private-audio-meter-track-color) 0);border-radius:var(--border-radius-circular)}

package/dist/components/data/nmorph-audio-meter/NmorphAudioMeter.vue2.js

@@ -1,37 +1,37 @@
 import './NmorphAudioMeter.css';
 import { defineComponent as f, computed as t } from "vue";
-import { useModifiers as v } from "../../../utils/create-modifiers.js";
-import { createCssVariables as c } from "../../../utils/common.js";
+import { useModifiers as c } from "../../../utils/create-modifiers.js";
+import { createCssVariables as v } from "../../../utils/common.js";
 const _ = /* @__PURE__ */ f({
   __name: "NmorphAudioMeter",
   props: {
-    value: { type: Number, required: !1, default: void 0 },
-    volumeDb: { type: Number, required: !1, default: void 0 },
+    value: { type: Number, required: !1 },
+    volumeDb: { type: Number, required: !1 },
     variant: { type: String, required: !1, default: "bars" },
     bars: { type: Number, required: !1, default: 12 },
     warnThreshold: { type: Number, required: !1, default: 0.7 },
     errorThreshold: { type: Number, required: !1, default: 0.9 },
-    color: { type: String, required: !1, default: void 0 },
-    warnColor: { type: String, required: !1, default: void 0 },
-    errorColor: { type: String, required: !1, default: void 0 },
-    trackColor: { type: String, required: !1, default: void 0 },
+    color: { type: String, required: !1 },
+    warnColor: { type: String, required: !1 },
+    errorColor: { type: String, required: !1 },
+    trackColor: { type: String, required: !1 },
     label: { type: String, required: !1, default: "Audio level" }
   },
-  setup(n, { expose: d }) {
-    d();
-    const e = n, a = (o) => Math.min(Math.max(o, 0), 1), r = t(() => typeof e.value == "number" ? a(e.value) : typeof e.volumeDb == "number" ? a((e.volumeDb + 60) / 60) : 0), l = t(() => Array.from({ length: Math.max(e.bars, 1) }, (o, m) => m)), u = t(() => r.value >= e.errorThreshold ? "error" : r.value >= e.warnThreshold ? "warn" : "normal"), s = t(
-      () => v({
+  setup(n, { expose: s }) {
+    s();
+    const e = n, a = (o) => Math.min(Math.max(o, 0), 1), r = t(() => typeof e.value == "number" ? a(e.value) : typeof e.volumeDb == "number" ? a((e.volumeDb + 60) / 60) : 0), l = t(() => Array.from({ length: Math.max(e.bars, 1) }, (o, d) => d)), u = t(() => r.value >= e.errorThreshold ? "error" : r.value >= e.warnThreshold ? "warn" : "normal"), p = t(
+      () => c({
         "nmorph-audio-meter": [e.variant, u.value]
       })
-    ), p = t(() => ({
+    ), m = t(() => ({
       "--nmorph-private-audio-meter-percent": `${Math.round(r.value * 100)}%`,
-      ...c({
+      ...v({
         "--nmorph-private-audio-meter-color": e.color,
         "--nmorph-private-audio-meter-warn-color": e.warnColor,
         "--nmorph-private-audio-meter-error-color": e.errorColor,
         "--nmorph-private-audio-meter-track-color": e.trackColor
       })
-    })), i = { props: e, clamp: a, level: r, barIndexes: l, state: u, modifiers: s, styles: p, isBarActive: (o) => (o + 1) / l.value.length <= r.value };
+    })), i = { props: e, clamp: a, level: r, barIndexes: l, state: u, modifiers: p, styles: m, isBarActive: (o) => (o + 1) / l.value.length <= r.value };
     return Object.defineProperty(i, "__isScriptSetup", { enumerable: !1, value: !0 }), i;
   }
 });

package/dist/components/data/nmorph-audio-preview/NmorphAudioPreview.css

@@ -1 +1 @@
-.nmorph-audio-preview{display:flex;gap:var(--indentation-02);align-items:center;box-sizing:border-box;width:var(--nmorph-private-audio-preview-width, 360px);min-width:0;max-width:100%;min-height:64px;padding:var(--indentation-03);color:var(--nmorph-text-color);background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-inset)}.nmorph-audio-preview audio{display:none}.nmorph-audio-preview .nmorph-audio-preview__icon{position:relative;display:flex;flex:0 0 auto;justify-content:center;align-items:center;width:36px;height:36px;padding:0;color:var(--nmorph-text-color);background:color-mix(in srgb,var(--nmorph-text-color) 10%,transparent);border:0;border-radius:var(--default-border-radius);cursor:default;--nmorph-private-icon-color: currentColor}.nmorph-audio-preview button.nmorph-audio-preview__icon{cursor:pointer}.nmorph-audio-preview button.nmorph-audio-preview__icon:disabled{cursor:default}.nmorph-audio-preview .nmorph-audio-preview__play-button{display:inline-flex;flex:0 0 auto;justify-content:center;align-items:center;width:20px;height:20px;padding:0;color:var(--nmorph-contrast-text-color);background:var(--nmorph-black-color);border:0;border-radius:var(--border-radius-circular);cursor:pointer}.nmorph-audio-preview .nmorph-audio-preview__play-button:hover{background:var(--nmorph-accent-color)}.nmorph-audio-preview .nmorph-audio-preview__play-button .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-contrast-text-color)}.nmorph-audio-preview .nmorph-audio-preview__play-indicator{position:absolute;right:-4px;bottom:-4px;display:inline-flex;justify-content:center;align-items:center;width:18px;height:18px;color:var(--nmorph-contrast-text-color);background:var(--nmorph-black-color);border-radius:var(--border-radius-circular)}.nmorph-audio-preview .nmorph-audio-preview__play-indicator .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-contrast-text-color)}.nmorph-audio-preview .nmorph-audio-preview__body{display:flex;flex:1 1 0;flex-direction:column;gap:var(--indentation-02);box-sizing:border-box;min-width:0}.nmorph-audio-preview .nmorph-audio-preview__header{display:flex;gap:var(--indentation-02);justify-content:space-between;align-items:center;min-width:0}.nmorph-audio-preview .nmorph-audio-preview__control{display:flex;gap:var(--indentation-02);align-items:center;width:100%;min-width:0}.nmorph-audio-preview .nmorph-audio-preview__name,.nmorph-audio-preview .nmorph-audio-preview__time,.nmorph-audio-preview .nmorph-audio-preview__error{min-width:0;overflow:hidden;font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height);white-space:nowrap;text-overflow:ellipsis}.nmorph-audio-preview .nmorph-audio-preview__name{flex:1 1 auto;font-weight:var(--font-weight-semibold)}.nmorph-audio-preview .nmorph-audio-preview__time{flex:0 0 auto;color:var(--nmorph-semi-contrast-text-color);font-variant-numeric:tabular-nums}.nmorph-audio-preview .nmorph-audio-preview__error{flex:0 1 auto;color:var(--nmorph-error-text-color)}.nmorph-audio-preview .nmorph-audio-preview__range{flex:1 1 0;width:100%;min-width:0;height:6px;padding:0;background:linear-gradient(to right,var(--nmorph-accent-color) var(--nmorph-private-audio-preview-progress, 0%),color-mix(in srgb,var(--nmorph-text-color) 16%,transparent) 0);border-radius:var(--border-radius-100);outline:0;cursor:pointer;appearance:none}.nmorph-audio-preview .nmorph-audio-preview__range:disabled{cursor:default;opacity:.6}.nmorph-audio-preview .nmorph-audio-preview__range::-webkit-slider-thumb{width:14px;height:14px;background:var(--nmorph-accent-color);border:2px solid var(--nmorph-main-color);border-radius:var(--border-radius-circular);box-shadow:var(--nmorph-shadow-outset);appearance:none}.nmorph-audio-preview .nmorph-audio-preview__range::-moz-range-thumb{width:14px;height:14px;background:var(--nmorph-accent-color);border:2px solid var(--nmorph-main-color);border-radius:var(--border-radius-circular);box-shadow:var(--nmorph-shadow-outset)}.nmorph-audio-preview .nmorph-audio-preview__actions{display:flex;flex:0 0 auto;gap:var(--indentation-01);align-items:center}.nmorph-audio-preview .nmorph-audio-preview__action-link{display:inline-flex;justify-content:center;align-items:center;width:22px;height:22px;color:inherit;text-decoration:none;border-radius:var(--default-border-radius)}.nmorph-audio-preview .nmorph-audio-preview__action-link:hover{color:var(--nmorph-accent-color);background:color-mix(in srgb,var(--nmorph-accent-color) 10%,transparent)}.nmorph-audio-preview .nmorph-audio-preview__action-link .nmorph-icon{--nmorph-private-icon-color: currentColor}.nmorph-audio-preview.nmorph-audio-preview--compact{min-height:52px;padding:var(--indentation-02)}.nmorph-audio-preview.nmorph-audio-preview--compact .nmorph-audio-preview__icon{width:30px;height:30px}.nmorph-audio-preview.nmorph-audio-preview--no-actions .nmorph-audio-preview__body{padding-inline-end:var(--indentation-02)}.nmorph-audio-preview.nmorph-audio-preview--embedded{width:var(--nmorph-private-audio-preview-width, 100%);min-height:auto;padding:0;background:transparent;border-radius:0;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__body{gap:0;padding-inline-end:0}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__range{height:5px}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__range::-webkit-slider-thumb{width:11px;height:11px;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__range::-moz-range-thumb{width:11px;height:11px;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__play-indicator{box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--no-header .nmorph-audio-preview__time{flex:0 0 auto}.nmorph-audio-preview.nmorph-audio-preview--soft{background:color-mix(in srgb,var(--nmorph-accent-color) 6%,transparent);box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--plain{background:transparent;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--error{outline:1px solid var(--nmorph-error-color)}
+.nmorph-audio-preview{display:flex;gap:var(--indentation-02);align-items:center;box-sizing:border-box;width:var(--nmorph-private-audio-preview-width, 360px);min-width:0;max-width:100%;min-height:64px;padding:var(--indentation-03);color:var(--nmorph-text-color);background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-inset)}.nmorph-audio-preview audio{display:none}.nmorph-audio-preview .nmorph-audio-preview__icon{position:relative;display:flex;flex:0 0 auto;justify-content:center;align-items:center;width:36px;height:36px;padding:0;color:var(--nmorph-text-color);background:color-mix(in srgb,var(--nmorph-text-color) 10%,transparent);border:0;border-radius:var(--default-border-radius);cursor:default;--nmorph-private-icon-color: currentColor}.nmorph-audio-preview button.nmorph-audio-preview__icon{cursor:pointer}.nmorph-audio-preview button.nmorph-audio-preview__icon:disabled{cursor:default}.nmorph-audio-preview .nmorph-audio-preview__play-button{display:inline-flex;flex:0 0 auto;justify-content:center;align-items:center;width:20px;height:20px;padding:0;color:var(--nmorph-white-color);background:var(--nmorph-black-color);border:0;border-radius:var(--border-radius-circular);cursor:pointer}.nmorph-audio-preview .nmorph-audio-preview__play-button:hover{background:var(--nmorph-accent-color)}.nmorph-audio-preview .nmorph-audio-preview__play-button .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-white-color)}.nmorph-audio-preview .nmorph-audio-preview__play-indicator{position:absolute;right:-4px;bottom:-4px;display:inline-flex;justify-content:center;align-items:center;width:18px;height:18px;color:var(--nmorph-white-color);background:var(--nmorph-black-color);border-radius:var(--border-radius-circular)}.nmorph-audio-preview .nmorph-audio-preview__play-indicator .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-white-color)}.nmorph-audio-preview .nmorph-audio-preview__body{display:flex;flex:1 1 0;flex-direction:column;gap:var(--indentation-02);box-sizing:border-box;min-width:0}.nmorph-audio-preview .nmorph-audio-preview__header{display:flex;gap:var(--indentation-02);justify-content:space-between;align-items:center;min-width:0}.nmorph-audio-preview .nmorph-audio-preview__control{display:flex;gap:var(--indentation-02);align-items:center;width:100%;min-width:0}.nmorph-audio-preview .nmorph-audio-preview__name,.nmorph-audio-preview .nmorph-audio-preview__time,.nmorph-audio-preview .nmorph-audio-preview__error{min-width:0;overflow:hidden;font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height);white-space:nowrap;text-overflow:ellipsis}.nmorph-audio-preview .nmorph-audio-preview__name{flex:1 1 auto;font-weight:var(--font-weight-semibold)}.nmorph-audio-preview .nmorph-audio-preview__time{flex:0 0 auto;color:var(--nmorph-semi-contrast-text-color);font-variant-numeric:tabular-nums}.nmorph-audio-preview .nmorph-audio-preview__error{flex:0 1 auto;color:var(--nmorph-error-text-color)}.nmorph-audio-preview .nmorph-audio-preview__range{flex:1 1 0;width:100%;min-width:0;height:6px;padding:0;background:linear-gradient(to right,var(--nmorph-accent-color) var(--nmorph-private-audio-preview-progress, 0%),color-mix(in srgb,var(--nmorph-text-color) 16%,transparent) 0);border-radius:var(--border-radius-100);outline:0;cursor:pointer;appearance:none}.nmorph-audio-preview .nmorph-audio-preview__range:disabled{cursor:default;opacity:.6}.nmorph-audio-preview .nmorph-audio-preview__range::-webkit-slider-thumb{width:14px;height:14px;background:var(--nmorph-accent-color);border:2px solid var(--nmorph-main-color);border-radius:var(--border-radius-circular);box-shadow:var(--nmorph-shadow-outset);appearance:none}.nmorph-audio-preview .nmorph-audio-preview__range::-moz-range-thumb{width:14px;height:14px;background:var(--nmorph-accent-color);border:2px solid var(--nmorph-main-color);border-radius:var(--border-radius-circular);box-shadow:var(--nmorph-shadow-outset)}.nmorph-audio-preview .nmorph-audio-preview__actions{display:flex;flex:0 0 auto;gap:var(--indentation-01);align-items:center}.nmorph-audio-preview .nmorph-audio-preview__action-link{display:inline-flex;justify-content:center;align-items:center;width:22px;height:22px;color:inherit;text-decoration:none;border-radius:var(--default-border-radius)}.nmorph-audio-preview .nmorph-audio-preview__action-link:hover{color:var(--nmorph-accent-color);background:color-mix(in srgb,var(--nmorph-accent-color) 10%,transparent)}.nmorph-audio-preview .nmorph-audio-preview__action-link .nmorph-icon{--nmorph-private-icon-color: currentColor}.nmorph-audio-preview.nmorph-audio-preview--compact{min-height:52px;padding:var(--indentation-02)}.nmorph-audio-preview.nmorph-audio-preview--compact .nmorph-audio-preview__icon{width:30px;height:30px}.nmorph-audio-preview.nmorph-audio-preview--no-actions .nmorph-audio-preview__body{padding-inline-end:var(--indentation-02)}.nmorph-audio-preview.nmorph-audio-preview--embedded{width:var(--nmorph-private-audio-preview-width, 100%);min-height:auto;padding:0;background:transparent;border-radius:0;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__body{gap:0;padding-inline-end:0}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__range{height:5px}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__range::-webkit-slider-thumb{width:11px;height:11px;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__range::-moz-range-thumb{width:11px;height:11px;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--embedded .nmorph-audio-preview__play-indicator{box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--no-header .nmorph-audio-preview__time{flex:0 0 auto}.nmorph-audio-preview.nmorph-audio-preview--soft{background:color-mix(in srgb,var(--nmorph-accent-color) 6%,transparent);box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--plain{background:transparent;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--error{outline:1px solid var(--nmorph-error-text-color)}

package/dist/components/data/nmorph-audio-preview/NmorphAudioPreview.vue2.js

@@ -9,7 +9,7 @@ import F from "../../../assets/icons/download.svg.js";
 import U from "../../../assets/icons/audio.svg.js";
 import V from "../../basic/nmorph-icon/NmorphIcon.vue.js";
 import G from "../../../assets/icons/loading.svg.js";
-const J = "var(--nmorph-contrast-text-color)", te = /* @__PURE__ */ C({
+const J = "var(--nmorph-white-color)", te = /* @__PURE__ */ C({
   __name: "NmorphAudioPreview",
   props: {
     src: { type: String, required: !0 },
@@ -31,22 +31,22 @@ const J = "var(--nmorph-contrast-text-color)", te = /* @__PURE__ */ C({
   },
   emits: ["play", "pause", "open", "download", "error"],
   setup(h, { expose: y, emit: g }) {
-    const e = h, n = g, c = D(), o = d(null), a = d(!1), u = d(0), s = d(e.durationMs ? e.durationMs / 1e3 : 0);
+    const e = h, n = g, p = D(), o = d(null), a = d(!1), u = d(0), s = d(e.durationMs ? e.durationMs / 1e3 : 0);
     O(
       () => e.durationMs,
       (r) => {
         s.value = r ? r / 1e3 : s.value;
       }
     );
-    const l = t(() => s.value || 0), p = t({
+    const l = t(() => s.value || 0), c = t({
       get: () => l.value > 0 ? u.value / l.value * 100 : 0,
       set: (r) => {
         !o.value || l.value <= 0 || (o.value.currentTime = r / 100 * l.value, u.value = o.value.currentTime);
       }
     }), w = t(() => ({
-      "--nmorph-private-audio-preview-progress": `${p.value}%`
+      "--nmorph-private-audio-preview-progress": `${c.value}%`
     })), f = t(
-      () => !!c.actions || e.showDefaultActions && (e.src || e.downloadHref)
+      () => !!p.actions || e.showDefaultActions && (e.src || e.downloadHref)
     ), N = t(
       () => R({
         "nmorph-audio-preview": [
@@ -67,8 +67,8 @@ const J = "var(--nmorph-contrast-text-color)", te = /* @__PURE__ */ C({
       })
     ), i = (r) => {
       if (!Number.isFinite(r) || r < 0) return "0:00";
-      const v = Math.floor(r), x = Math.floor(v / 60), k = v % 60;
-      return `${x}:${k.toString().padStart(2, "0")}`;
+      const v = Math.floor(r), k = Math.floor(v / 60), x = v % 60;
+      return `${k}:${x.toString().padStart(2, "0")}`;
     }, I = t(() => i(u.value)), q = t(() => i(l.value)), b = async () => {
       if (!(!o.value || !e.showPlaybackButton || e.loading || e.error)) {
         if (a.value) {
@@ -95,7 +95,7 @@ const J = "var(--nmorph-contrast-text-color)", te = /* @__PURE__ */ C({
       a.value = !1, n("error", r);
     }, L = () => n("open"), M = () => n("download");
     y({ audioRef: o });
-    const m = { CONTRAST_ICON_COLOR: J, props: e, emit: n, slots: c, audioRef: o, playing: a, currentTime: u, durationSeconds: s, resolvedDuration: l, progress: p, progressStyle: w, hasActions: f, modifiers: N, styles: S, formatTime: i, currentTimeLabel: I, durationLabel: q, togglePlayback: b, loadedMetadataHandler: H, timeUpdateHandler: _, playHandler: B, pauseHandler: P, endedHandler: T, errorHandler: A, openHandler: L, downloadHandler: M, get NmorphIcon() {
+    const m = { CONTRAST_ICON_COLOR: J, props: e, emit: n, slots: p, audioRef: o, playing: a, currentTime: u, durationSeconds: s, resolvedDuration: l, progress: c, progressStyle: w, hasActions: f, modifiers: N, styles: S, formatTime: i, currentTimeLabel: I, durationLabel: q, togglePlayback: b, loadedMetadataHandler: H, timeUpdateHandler: _, playHandler: B, pauseHandler: P, endedHandler: T, errorHandler: A, openHandler: L, downloadHandler: M, get NmorphIcon() {
       return V;
     }, get NmorphIconAudio() {
       return U;

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

@@ -5,7 +5,7 @@ import { createCssSizeVariables as F, createCssVariables as H } from "../../../u
 const X = /* @__PURE__ */ B({
   __name: "NmorphBadge",
   props: {
-    value: { type: [Number, String], required: !1, default: void 0 },
+    value: { type: [Number, String], required: !1 },
     max: { type: Number, required: !1, default: 99 },
     type: { type: String, required: !1, default: "default" },
     ribbonCorner: { type: String, required: !1, default: "top-right" },