@nmorph/nmorph-ui-kit 3.0.4 → 3.0.6

package/dist/assets/icons/chevron-right.svg.js

@@ -14,8 +14,8 @@ function l(c, e) {
     )
   ])]);
 }
-const d = { render: l };
+const s = { render: l };
 export {
-  d as default,
+  s as default,
   l as render
 };

package/dist/assets/icons/hand.svg.js

@@ -1,33 +1,15 @@
-import { openBlock as n, createElementBlock as r, createElementVNode as o } from "vue";
-const t = {
+import { openBlock as t, createElementBlock as o, createElementVNode as r } from "vue";
+const n = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 1024 1024"
 };
-function l(s, e) {
-  return n(), r("svg", t, [...e[0] || (e[0] = [
-    o(
+function c(l, e) {
+  return t(), o("svg", n, [...e[0] || (e[0] = [
+    r(
       "path",
       {
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round",
-        "stroke-width": "56",
-        d: "M320 704V320a64 64 0 0 1 128 0v200M448 520V192a64 64 0 0 1 128 0v288M576 480V288a64 64 0 0 1 128 0v224"
-      },
-      null,
-      -1
-      /* CACHED */
-    ),
-    o(
-      "path",
-      {
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round",
-        "stroke-width": "56",
-        d: "M704 512V384a64 64 0 0 1 128 0v280c0 159.04-128.96 288-288 288h-88c-84.544 0-164.8-37.12-219.52-101.504L106.24 697.344a64 64 0 0 1 97.52-82.88L320 751.104M448 520v88M576 480v128M704 512v112"
+        fill: "currentColor",
+        d: "M360 140c0-36.45 29.55-66 66-66s66 29.55 66 66v420h32V86c0-36.45 29.55-66 66-66s66 29.55 66 66v474h32V160c0-36.45 29.55-66 66-66s66 29.55 66 66v424h30V256c0-36.45 29.55-66 66-66s66 29.55 66 66v444c0 167.9-136.1 304-304 304h-82c-98.69 0-190.2-51.5-241.34-135.92l-244.93-233.2a70 70 0 0 1 120.06-71.76L360 780z"
       },
       null,
       -1
@@ -35,8 +17,8 @@ function l(s, e) {
     )
   ])]);
 }
-const i = { render: l };
+const d = { render: c };
 export {
-  i as default,
-  l as render
+  d as default,
+  c as render
 };

package/dist/assets/icons/mic.svg.js

@@ -1,10 +1,10 @@
-import { openBlock as a, createElementBlock as e, createElementVNode as t } from "vue";
+import { openBlock as h, createElementBlock as e, createElementVNode as t } from "vue";
 const o = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 1024 1024"
 };
-function n(r, h) {
-  return a(), e("svg", o, [...h[0] || (h[0] = [
+function v(n, a) {
+  return h(), e("svg", o, [...a[0] || (a[0] = [
     t(
       "path",
       { d: "M480 704h160a64 64 0 0 0 64-64v-32h-96a32 32 0 0 1 0-64h96v-96h-96a32 32 0 0 1 0-64h96v-96h-96a32 32 0 0 1 0-64h96v-32a64 64 0 0 0-64-64H384a64 64 0 0 0-64 64v32h96a32 32 0 0 1 0 64h-96v96h96a32 32 0 0 1 0 64h-96v96h96a32 32 0 0 1 0 64h-96v32a64 64 0 0 0 64 64zm64 64v128h192a32 32 0 1 1 0 64H288a32 32 0 1 1 0-64h192V768h-96a128 128 0 0 1-128-128V192A128 128 0 0 1 384 64h256a128 128 0 0 1 128 128v448a128 128 0 0 1-128 128z" },
@@ -14,8 +14,8 @@ function n(r, h) {
     )
   ])]);
 }
-const c = { render: n };
+const l = { render: v };
 export {
-  c as default,
-  n as render
+  l as default,
+  v as render
 };

package/dist/assets/icons/mute.svg.js

@@ -1,10 +1,10 @@
-import { openBlock as a, createElementBlock as l, createElementVNode as t } from "vue";
-const n = {
+import { openBlock as a, createElementBlock as o, createElementVNode as t } from "vue";
+const l = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 1024 1024"
 };
-function o(r, e) {
-  return a(), l("svg", n, [...e[0] || (e[0] = [
+function n(r, e) {
+  return a(), o("svg", l, [...e[0] || (e[0] = [
     t(
       "path",
       { d: "m412.16 592.128-45.44 45.44A191.23 191.23 0 0 1 320 512V256a192 192 0 1 1 384 0v44.352l-64 64V256a128 128 0 1 0-256 0v256c0 30.336 10.56 58.24 28.16 80.128m51.968 38.592A128 128 0 0 0 640 512v-57.152l64-64V512a192 192 0 0 1-287.68 166.528zM314.88 779.968l46.144-46.08A223 223 0 0 0 480 768h64a224 224 0 0 0 224-224v-32a32 32 0 1 1 64 0v32a288 288 0 0 1-288 288v64h64a32 32 0 1 1 0 64H416a32 32 0 1 1 0-64h64v-64c-61.44 0-118.4-19.2-165.12-52.032M266.752 737.6A286.98 286.98 0 0 1 192 544v-32a32 32 0 0 1 64 0v32c0 56.832 21.184 108.8 56.064 148.288z" },
@@ -21,8 +21,8 @@ function o(r, e) {
     )
   ])]);
 }
-const c = { render: o };
+const c = { render: n };
 export {
   c as default,
-  o as render
+  n as render
 };

package/dist/assets/icons/pin.svg.js

@@ -1,11 +1,11 @@
-import { openBlock as t, createElementBlock as o, createElementVNode as n } from "vue";
+import { openBlock as t, createElementBlock as n, createElementVNode as o } from "vue";
 const r = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 24 24"
 };
 function l(a, e) {
-  return t(), o("svg", r, [...e[0] || (e[0] = [
-    n(
+  return t(), n("svg", r, [...e[0] || (e[0] = [
+    o(
       "path",
       { d: "M16 2H8a1 1 0 0 0 0 2h1v5.59l-2.71 2.7A1 1 0 0 0 7 14h4v7a1 1 0 1 0 2 0v-7h4a1 1 0 0 0 .71-1.71L15 9.59V4h1a1 1 0 1 0 0-2m-2.71 8.71 1.3 1.29H9.41l1.3-1.29A1 1 0 0 0 11 10V4h2v6a1 1 0 0 0 .29.71" },
       null,
@@ -14,8 +14,8 @@ function l(a, e) {
     )
   ])]);
 }
-const c = { render: l };
+const s = { render: l };
 export {
-  c as default,
+  s as default,
   l as render
 };

package/dist/assets/icons/video-camera-off.svg.js

@@ -1,10 +1,10 @@
-import { openBlock as o, createElementBlock as a, createElementVNode as t } from "vue";
-const l = {
+import { openBlock as o, createElementBlock as n, createElementVNode as t } from "vue";
+const r = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 1024 1024"
 };
-function n(r, e) {
-  return o(), a("svg", l, [...e[0] || (e[0] = [
+function a(l, e) {
+  return o(), n("svg", r, [...e[0] || (e[0] = [
     t(
       "path",
       { d: "M704 768V256H128v512zm64-416 192-96v512l-192-96v128a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V224a32 32 0 0 1 32-32h640a32 32 0 0 1 32 32zm0 71.552v176.896l128 64V359.552zM192 320h192v64H192z" },
@@ -21,8 +21,8 @@ function n(r, e) {
     )
   ])]);
 }
-const d = { render: n };
+const d = { render: a };
 export {
   d as default,
-  n as render
+  a as render
 };

package/dist/components/basic/nmorph-icon/NmorphIcon.vue2.js

@@ -1,25 +1,25 @@
 import './NmorphIcon.css';
-import { defineComponent as p, computed as o } from "vue";
-import { useModifiers as d } from "../../../utils/create-modifiers.js";
+import { defineComponent as p, computed as r } from "vue";
+import { useModifiers as c } from "../../../utils/create-modifiers.js";
 const l = /* @__PURE__ */ p({
   __name: "NmorphIcon",
   props: {
     size: { type: null, required: !1, default: "small" },
-    width: { type: String, required: !1, default: void 0 },
-    height: { type: String, required: !1, default: void 0 },
-    color: { type: String, required: !1, default: void 0 }
+    width: { type: String, required: !1 },
+    height: { type: String, required: !1 },
+    color: { type: String, required: !1 }
   },
-  setup(r, { expose: s }) {
+  setup(o, { expose: s }) {
     s();
-    const e = r, n = o(
-      () => d({
+    const e = o, n = r(
+      () => c({
         "nmorph-icon": [
           !e.width && !e.height && e.size,
           e.width && "custom-width",
           e.height && "custom-height"
         ]
       })
-    ), h = o(() => {
+    ), h = r(() => {
       const t = {};
       return e.width && (t["--nmorph-private-icon-width"] = e.width), e.height && (t["--nmorph-private-icon-height"] = e.height), e.color && (t["--nmorph-private-icon-color"] = e.color), t;
     }), i = { props: e, modifiers: n, customStyles: h };

package/dist/components/basic/nmorph-scroll/NmorphScroll.css

@@ -1 +1 @@
-.nmorph-scroll{--nmorph-private-scroll-thumb-color: var(--nmorph-scroll-thumb-color, var(--nmorph-text-color));position:relative;overflow:hidden;color-scheme:var(--nmorph-scroll-color-scheme, light)}.nmorph-scroll__viewport{display:inherit;flex-direction:inherit;flex-wrap:inherit;grid-auto-flow:inherit;grid-template-columns:inherit;grid-template-rows:inherit;gap:inherit;justify-content:inherit;align-content:inherit;align-items:inherit;box-sizing:border-box;width:100%;height:100%;color-scheme:inherit;scrollbar-width:none;-ms-overflow-style:none}.nmorph-scroll__viewport::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.nmorph-scroll__bar{position:absolute;z-index:1;background:transparent;border-radius:var(--border-radius-40);box-shadow:var(--nmorph-shadow-inset);opacity:.78;transition:opacity ease-in-out .16s,background-color ease-in-out .16s;touch-action:none}.nmorph-scroll__bar--vertical{top:0;right:0;width:var(--nmorph-private-scroll-bar-width)}.nmorph-scroll__bar--horizontal{right:0;bottom:0;left:0;height:var(--nmorph-private-scroll-bar-height)}.nmorph-scroll__thumb{position:absolute;top:0;left:0;background-color:var(--nmorph-private-scroll-thumb-color);border-radius:var(--border-radius-40);cursor:pointer;transition:background-color ease-in-out .16s;touch-action:none}.nmorph-scroll__thumb--vertical{width:100%}.nmorph-scroll__thumb--horizontal{height:100%}.nmorph-scroll--show-bars .nmorph-scroll__bar,.nmorph-scroll__bar:hover{opacity:1}.nmorph-scroll--dragging .nmorph-scroll__thumb{cursor:grabbing}.nmorph-scroll::-webkit-scrollbar{width:var(--nmorph-private-scroll-bar-width);height:var(--nmorph-private-scroll-bar-height);background-color:transparent;cursor:pointer;transition:width ease-in-out .2s}.nmorph-scroll::-webkit-scrollbar-button,.nmorph-scroll::-webkit-scrollbar-button:single-button,.nmorph-scroll::-webkit-scrollbar-button:double-button,.nmorph-scroll::-webkit-scrollbar-button:vertical:start:decrement,.nmorph-scroll::-webkit-scrollbar-button:vertical:end:increment,.nmorph-scroll::-webkit-scrollbar-button:horizontal:start:decrement,.nmorph-scroll::-webkit-scrollbar-button:horizontal:end:increment{display:none!important;width:0!important;min-width:0!important;max-width:0!important;height:0!important;min-height:0!important;max-height:0!important;background:transparent!important;background-image:none!important;border:0!important;appearance:none}.nmorph-scroll::-webkit-scrollbar-track{background:transparent;border-radius:var(--border-radius-40);box-shadow:var(--nmorph-shadow-inset)}.nmorph-scroll::-webkit-scrollbar-thumb{background-color:var(--nmorph-private-scroll-thumb-color);border-radius:var(--border-radius-40)}.nmorph-scroll::-webkit-scrollbar-corner{background-color:transparent}
+.nmorph-scroll{--nmorph-private-scroll-thumb-color: var(--nmorph-scroll-thumb-color, var(--nmorph-text-color));position:relative;overflow:hidden;color-scheme:var(--nmorph-scroll-color-scheme, light)}.nmorph-scroll__viewport{display:inherit;flex-direction:inherit;flex-wrap:inherit;grid-auto-flow:inherit;grid-template-columns:inherit;grid-template-rows:inherit;gap:var(--nmorph-private-scroll-gap, inherit);justify-content:inherit;align-content:inherit;align-items:inherit;box-sizing:border-box;width:100%;height:100%;color-scheme:inherit;scrollbar-width:none;-ms-overflow-style:none}.nmorph-scroll__viewport::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.nmorph-scroll__bar{position:absolute;z-index:1;background:transparent;border-radius:var(--border-radius-40);box-shadow:var(--nmorph-shadow-inset);opacity:.78;transition:opacity ease-in-out .16s,background-color ease-in-out .16s;touch-action:none}.nmorph-scroll__bar--vertical{top:0;right:0;width:var(--nmorph-private-scroll-bar-width)}.nmorph-scroll__bar--horizontal{right:0;bottom:0;left:0;height:var(--nmorph-private-scroll-bar-height)}.nmorph-scroll__thumb{position:absolute;top:0;left:0;background-color:var(--nmorph-private-scroll-thumb-color);border-radius:var(--border-radius-40);cursor:pointer;transition:background-color ease-in-out .16s;touch-action:none}.nmorph-scroll__thumb--vertical{width:100%}.nmorph-scroll__thumb--horizontal{height:100%}.nmorph-scroll--show-bars .nmorph-scroll__bar,.nmorph-scroll__bar:hover{opacity:1}.nmorph-scroll--dragging .nmorph-scroll__thumb{cursor:grabbing}.nmorph-scroll::-webkit-scrollbar{width:var(--nmorph-private-scroll-bar-width);height:var(--nmorph-private-scroll-bar-height);background-color:transparent;cursor:pointer;transition:width ease-in-out .2s}.nmorph-scroll::-webkit-scrollbar-button,.nmorph-scroll::-webkit-scrollbar-button:single-button,.nmorph-scroll::-webkit-scrollbar-button:double-button,.nmorph-scroll::-webkit-scrollbar-button:vertical:start:decrement,.nmorph-scroll::-webkit-scrollbar-button:vertical:end:increment,.nmorph-scroll::-webkit-scrollbar-button:horizontal:start:decrement,.nmorph-scroll::-webkit-scrollbar-button:horizontal:end:increment{display:none!important;width:0!important;min-width:0!important;max-width:0!important;height:0!important;min-height:0!important;max-height:0!important;background:transparent!important;background-image:none!important;border:0!important;appearance:none}.nmorph-scroll::-webkit-scrollbar-track{background:transparent;border-radius:var(--border-radius-40);box-shadow:var(--nmorph-shadow-inset)}.nmorph-scroll::-webkit-scrollbar-thumb{background-color:var(--nmorph-private-scroll-thumb-color);border-radius:var(--border-radius-40)}.nmorph-scroll::-webkit-scrollbar-corner{background-color:transparent}

package/dist/components/basic/nmorph-scroll/NmorphScroll.vue2.js

@@ -1,11 +1,13 @@
 import './NmorphScroll.css';
 import { defineComponent as Te, ref as p, computed as n, inject as Me, onUnmounted as We, onMounted as Ee, watch as de, nextTick as Oe } from "vue";
 import { useModifiers as Le } from "../../../utils/create-modifiers.js";
-const qe = /* @__PURE__ */ Te({
+import { createCssSizeVariables as Re } from "../../../utils/common.js";
+const Ce = /* @__PURE__ */ Te({
   __name: "NmorphScroll",
   props: {
     height: { type: String, required: !1, default: "100%" },
     maxHeight: { type: String, required: !1, default: "none" },
+    gap: { type: [Number, String], required: !1, default: void 0 },
     modelValue: { type: Object, required: !1, default: () => ({
       x: 0,
       y: 0
@@ -22,7 +24,7 @@ const qe = /* @__PURE__ */ Te({
   },
   emits: ["on-scroll", "update:model-value", "on-scroll-end"],
   setup(he, { expose: pe, emit: fe }) {
-    const o = he, O = p(null), a = p(null), N = n(() => o.scrollYProp), U = n(() => o.scrollXProp), f = p(!1), m = p(!1), s = p({
+    const o = he, O = p(null), a = p(null), $ = n(() => o.scrollYProp), U = n(() => o.scrollXProp), f = p(!1), m = p(!1), s = p({
       clientWidth: 0,
       clientHeight: 0,
       scrollWidth: 0,
@@ -79,9 +81,9 @@ const qe = /* @__PURE__ */ Te({
       () => o.scrollYProp === "hidden" || !f.value ? "0" : `${j.value}px`
     ), J = n(
       () => o.scrollXProp === "hidden" || !m.value ? "0" : `${A.value}px`
-    ), R = n(() => `${o.yBarWidthInPx}px`), D = n(() => `${o.xBarWidthInPx}px`), me = n(() => q.value ? D.value : "0px"), ve = n(() => _.value ? R.value : "0px"), K = Me("nmorph");
+    ), R = n(() => `${o.yBarWidthInPx}px`), D = n(() => `${o.xBarWidthInPx}px`), me = n(() => _.value ? D.value : "0px"), ve = n(() => I.value ? R.value : "0px"), K = Me("nmorph");
     let d;
-    const H = fe, I = () => {
+    const H = fe, q = () => {
       const e = a.value;
       if (!e) return;
       const t = Math.trunc(e.scrollLeft), r = Math.trunc(e.scrollTop);
@@ -89,8 +91,8 @@ const qe = /* @__PURE__ */ Te({
     }, Q = () => {
       H("on-scroll-end");
     }, ge = (e) => {
-      w(), H("on-scroll", e), a.value && (o.updateOnlyOnScrollEnd || I(), d !== void 0 && clearTimeout(d), d = setTimeout(() => {
-        o.updateOnlyOnScrollEnd && I(), Q();
+      w(), H("on-scroll", e), a.value && (o.updateOnlyOnScrollEnd || q(), d !== void 0 && clearTimeout(d), d = setTimeout(() => {
+        o.updateOnlyOnScrollEnd && q(), Q();
       }, o.scrollEndDelay));
     }, Z = (e) => e.deltaMode === 1 ? 16 : e.deltaMode === 2 ? Math.max(s.value.clientWidth, 1) : 1, ee = (e) => {
       if (o.scrollYProp === "hidden" || !f.value || !e) return !1;
@@ -161,6 +163,9 @@ const qe = /* @__PURE__ */ Te({
     const le = n(() => o.cssScrollBehavior), ne = n(() => o.height), ae = n(() => o.maxHeight), ye = n(() => ({
       "--nmorph-private-scroll-bar-width": R.value,
       "--nmorph-private-scroll-bar-height": D.value,
+      ...Re({
+        "--nmorph-private-scroll-gap": o.gap
+      }),
       boxSizing: "border-box",
       minWidth: "0",
       minHeight: "0",
@@ -170,18 +175,18 @@ const qe = /* @__PURE__ */ Te({
       paddingRight: F.value,
       paddingBottom: J.value,
       overflowX: U.value,
-      overflowY: N.value,
+      overflowY: $.value,
       scrollBehavior: le.value
-    })), _ = n(() => o.scrollYProp !== "hidden" && f.value), q = n(() => o.scrollXProp !== "hidden" && m.value), se = n(
-      () => Math.max(0, s.value.clientHeight - (q.value ? o.xBarWidthInPx : 0))
+    })), I = n(() => o.scrollYProp !== "hidden" && f.value), _ = n(() => o.scrollXProp !== "hidden" && m.value), se = n(
+      () => Math.max(0, s.value.clientHeight - (_.value ? o.xBarWidthInPx : 0))
     ), ie = n(
-      () => Math.max(0, s.value.clientWidth - (_.value ? o.yBarWidthInPx : 0))
-    ), b = (e) => e === "y" ? se.value : ie.value, X = (e) => e === "y" ? s.value.clientHeight : s.value.clientWidth, k = (e) => e === "y" ? s.value.scrollHeight : s.value.scrollWidth, C = (e) => e === "y" ? s.value.scrollTop : s.value.scrollLeft, ce = (e) => Math.min(b(e), Math.max(18, e === "y" ? o.yBarWidthInPx * 3 : o.xBarWidthInPx * 3)), S = (e) => Math.max(0, k(e) - X(e)), h = (e) => {
-      const t = b(e), r = k(e), l = X(e);
+      () => Math.max(0, s.value.clientWidth - (I.value ? o.yBarWidthInPx : 0))
+    ), b = (e) => e === "y" ? se.value : ie.value, X = (e) => e === "y" ? s.value.clientHeight : s.value.clientWidth, C = (e) => e === "y" ? s.value.scrollHeight : s.value.scrollWidth, k = (e) => e === "y" ? s.value.scrollTop : s.value.scrollLeft, ce = (e) => Math.min(b(e), Math.max(18, e === "y" ? o.yBarWidthInPx * 3 : o.xBarWidthInPx * 3)), S = (e) => Math.max(0, C(e) - X(e)), h = (e) => {
+      const t = b(e), r = C(e), l = X(e);
       return t <= 0 || r <= l ? 0 : Math.min(t, Math.max(ce(e), l / r * t));
     }, Y = (e) => {
       const t = S(e), r = Math.max(0, b(e) - h(e));
-      return !t || !r ? 0 : C(e) / t * r;
+      return !t || !r ? 0 : k(e) / t * r;
     }, Pe = n(() => ({
       height: `${h("y")}px`,
       transform: `translate3d(0, ${Y("y")}px, 0)`
@@ -194,8 +199,8 @@ const qe = /* @__PURE__ */ Te({
       const l = Math.max(0, Math.min(S(e), t));
       e === "y" ? r.scrollTop = l : r.scrollLeft = l, w();
     }, V = () => {
-      i && (window.removeEventListener("pointermove", $), window.removeEventListener("pointerup", z), window.removeEventListener("pointercancel", z), i = void 0, y.value = !1, document.body && (document.body.style.userSelect = B));
-    }, $ = (e) => {
+      i && (window.removeEventListener("pointermove", N), window.removeEventListener("pointerup", z), window.removeEventListener("pointercancel", z), i = void 0, y.value = !1, document.body && (document.body.style.userSelect = B));
+    }, N = (e) => {
       if (!i) return;
       const r = (i.axis === "y" ? e.clientY : e.clientX) - i.pointerStart, l = Math.max(1, i.trackSize - i.thumbSize), c = r / l * i.maxScroll;
       W(i.axis, i.scrollStart + c);
@@ -207,18 +212,18 @@ const qe = /* @__PURE__ */ Te({
       !r || !l || !c || (i = {
         axis: e,
         pointerStart: e === "y" ? t.clientY : t.clientX,
-        scrollStart: C(e),
+        scrollStart: k(e),
         trackSize: r,
         thumbSize: l,
         maxScroll: c
-      }, y.value = !0, B = document.body?.style.userSelect ?? "", document.body && (document.body.style.userSelect = "none"), window.addEventListener("pointermove", $), window.addEventListener("pointerup", z), window.addEventListener("pointercancel", z));
+      }, y.value = !0, B = document.body?.style.userSelect ?? "", document.body && (document.body.style.userSelect = "none"), window.addEventListener("pointermove", N), window.addEventListener("pointerup", z), window.addEventListener("pointercancel", z));
     }, Be = (e, t) => {
       if (t.target.closest(".nmorph-scroll__thumb")) return;
       const l = t.currentTarget.getBoundingClientRect(), c = e === "y" ? t.clientY - l.top : t.clientX - l.left, E = Math.max(1, b(e) - h(e)), He = (c - h(e) / 2) / E * S(e);
       W(e, He);
     };
     pe({ scrollDOMContainer: a, moveTo: M });
-    const ue = { props: o, scrollRoot: O, scrollDOMContainer: a, overflowY: N, overflowX: U, hasVerticalScroll: f, hasHorizontalScroll: m, metrics: s, isDragging: y, get viewportResizeObserver() {
+    const ue = { props: o, scrollRoot: O, scrollDOMContainer: a, overflowY: $, overflowX: U, hasVerticalScroll: f, hasHorizontalScroll: m, metrics: s, isDragging: y, get viewportResizeObserver() {
       return x;
     }, set viewportResizeObserver(e) {
       x = e;
@@ -242,7 +247,7 @@ const qe = /* @__PURE__ */ Te({
       return d;
     }, set scrollEndTimeout(e) {
       d = e;
-    }, emit: H, updateValue: I, handleScrollEnd: Q, scrollHandler: ge, getWheelDeltaMultiplier: Z, canConsumeVerticalWheel: ee, isNestedScrollEvent: te, isCurrentHorizontalBarEvent: re, wheelHandler: be, show: T, modifiers: Se, getProgrammaticScrollBehavior: oe, moveTo: M, scrollBehavior: le, scrollHeight: ne, maxHeight: ae, rootStyle: ye, viewportStyle: xe, visibleVerticalBar: _, visibleHorizontalBar: q, verticalTrackSize: se, horizontalTrackSize: ie, getTrackSize: b, getClientSize: X, getScrollSize: k, getScrollPosition: C, getMinThumbSize: ce, getMaxScroll: S, getThumbSize: h, getThumbOffset: Y, verticalThumbStyle: Pe, horizontalThumbStyle: we, setScrollPosition: W, stopThumbDrag: V, thumbPointerMoveHandler: $, thumbPointerUpHandler: z, thumbPointerDownHandler: ze, trackPointerDownHandler: Be, mouseEnterHandler: () => {
+    }, emit: H, updateValue: q, handleScrollEnd: Q, scrollHandler: ge, getWheelDeltaMultiplier: Z, canConsumeVerticalWheel: ee, isNestedScrollEvent: te, isCurrentHorizontalBarEvent: re, wheelHandler: be, show: T, modifiers: Se, getProgrammaticScrollBehavior: oe, moveTo: M, scrollBehavior: le, scrollHeight: ne, maxHeight: ae, rootStyle: ye, viewportStyle: xe, visibleVerticalBar: I, visibleHorizontalBar: _, verticalTrackSize: se, horizontalTrackSize: ie, getTrackSize: b, getClientSize: X, getScrollSize: C, getScrollPosition: k, getMinThumbSize: ce, getMaxScroll: S, getThumbSize: h, getThumbOffset: Y, verticalThumbStyle: Pe, horizontalThumbStyle: we, setScrollPosition: W, stopThumbDrag: V, thumbPointerMoveHandler: N, thumbPointerUpHandler: z, thumbPointerDownHandler: ze, trackPointerDownHandler: Be, mouseEnterHandler: () => {
       T.value = !0;
     }, mouseLeaveHandler: () => {
       T.value = !1;
@@ -251,5 +256,5 @@ const qe = /* @__PURE__ */ Te({
   }
 });
 export {
-  qe as default
+  Ce as default
 };

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);box-shadow:var(--nmorph-shadow-outset)}.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--soft .nmorph-audio-preview__play-indicator{box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--plain{background:transparent;box-shadow:none}.nmorph-audio-preview.nmorph-audio-preview--plain .nmorph-audio-preview__play-indicator{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-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)}

package/dist/components/data/nmorph-card/NmorphCard.css

@@ -1 +1 @@
-.nmorph-card{--nmorph-private-card-padding: var(--indentation-04);--nmorph-private-card-background: var(--nmorph-main-color);--nmorph-private-card-border: none;--nmorph-private-card-shadow: none;position:relative;display:flex;flex-direction:column;box-sizing:border-box;width:fit-content;max-width:100%;padding:var(--nmorph-private-card-padding);background:var(--nmorph-private-card-background);border:var(--nmorph-private-card-border);border-radius:var(--nmorph-private-card-radius, var(--default-border-radius));box-shadow:var(--nmorph-private-card-shadow)}.nmorph-card.nmorph-card--fill{width:100%}.nmorph-card .nmorph-card__content{height:100%;padding:var(--nmorph-private-card-content-padding, 0)}.nmorph-card .nmorph-card__header{font-weight:var(--nmorph-typography-title-font-weight);font-size:var(--nmorph-typography-title-font-size);line-height:var(--nmorph-typography-title-line-height)}.nmorph-card .nmorph-card__footer{height:fit-content;margin-top:4px;font-weight:var(--nmorph-typography-body-small-font-weight);font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height)}.nmorph-card.nmorph-card--nmorph{--nmorph-private-card-background: var(--nmorph-main-color)}.nmorph-card:not(.nmorph-card--plain).nmorph-card--outset{--nmorph-private-card-shadow: var(--nmorph-shadow-outset)}.nmorph-card:not(.nmorph-card--plain).nmorph-card--inset{--nmorph-private-card-shadow: var(--nmorph-shadow-inset)}.nmorph-card:not(.nmorph-card--plain).nmorph-card--combined{--nmorph-private-card-border: var(--nmorph-private-card-combined-border-width) solid var(--nmorph-main-color);--nmorph-private-card-shadow: var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color), calc(-1 * var(--base-shadow-width)) calc(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color), inset var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color), inset calc(-1 * var(--base-shadow-width)) calc(-.5 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color)}.nmorph-card.nmorph-card--plain{--nmorph-private-card-background: var(--nmorph-main-color);--nmorph-private-card-border: var(--nmorph-plain-border);--nmorph-private-card-shadow: none}
+.nmorph-card{--nmorph-private-card-padding: var(--indentation-04);--nmorph-private-card-background: var(--nmorph-main-color);--nmorph-private-card-border: none;--nmorph-private-card-shadow: none;--nmorph-private-card-paper-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.72' filter='url(%23n)'/%3E%3C/svg%3E");--nmorph-private-card-paper-light-opacity: 0;--nmorph-private-card-paper-dark-opacity: 0;--nmorph-private-card-paper-opacity: var(--nmorph-private-card-paper-light-opacity);--nmorph-private-card-paper-shadow-color: color-mix(in srgb, var(--nmorph-dark-shade-color) 82%, transparent);--nmorph-private-card-paper-light-color: color-mix(in srgb, var(--nmorph-light-shade-color) 76%, transparent);position:relative;isolation:isolate;display:flex;flex-direction:column;box-sizing:border-box;width:fit-content;max-width:100%;padding:var(--nmorph-private-card-padding);background:var(--nmorph-private-card-background);border:var(--nmorph-private-card-border);border-radius:var(--nmorph-private-card-radius, var(--default-border-radius));box-shadow:var(--nmorph-private-card-shadow)}.nmorph-card:before{position:absolute;z-index:0;background-image:var(--nmorph-private-card-paper-noise),radial-gradient(circle at 1px 1px,var(--nmorph-private-card-paper-shadow-color) 0 1px,transparent 1.7px),radial-gradient(circle at 6px 4px,var(--nmorph-private-card-paper-light-color) 0 1px,transparent 1.8px);background-size:72px 72px,11px 11px,16px 16px;border-radius:inherit;opacity:var(--nmorph-private-card-paper-opacity);pointer-events:none;content:"";inset:0}.nmorph-card.nmorph-card--fill{width:100%}.nmorph-card .nmorph-card__header,.nmorph-card .nmorph-card__content{position:relative;z-index:1}.nmorph-card .nmorph-card__content{height:100%;padding:var(--nmorph-private-card-content-padding, 0)}.nmorph-card .nmorph-card__header{font-weight:var(--nmorph-typography-title-font-weight);font-size:var(--nmorph-typography-title-font-size);line-height:var(--nmorph-typography-title-line-height)}.nmorph-card .nmorph-card__footer{position:relative;z-index:1;height:fit-content;margin-top:4px;font-weight:var(--nmorph-typography-body-small-font-weight);font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height)}.nmorph-card.nmorph-card--nmorph{--nmorph-private-card-background: var(--nmorph-main-color)}.nmorph-card:not(.nmorph-card--plain).nmorph-card--outset{--nmorph-private-card-shadow: var(--nmorph-shadow-outset)}.nmorph-card:not(.nmorph-card--plain).nmorph-card--inset{--nmorph-private-card-shadow: var(--nmorph-shadow-inset)}.nmorph-card:not(.nmorph-card--plain).nmorph-card--combined{--nmorph-private-card-border: var(--nmorph-private-card-combined-border-width) solid var(--nmorph-main-color);--nmorph-private-card-shadow: var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color), calc(-1 * var(--base-shadow-width)) calc(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color), inset var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color), inset calc(-1 * var(--base-shadow-width)) calc(-.5 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color)}.nmorph-card.nmorph-card--plain{--nmorph-private-card-background: var(--nmorph-main-color);--nmorph-private-card-border: var(--nmorph-plain-border);--nmorph-private-card-shadow: none}:root[nmorph-data-theme=dark] .nmorph-card{--nmorph-private-card-paper-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.36' filter='url(%23n)'/%3E%3C/svg%3E");--nmorph-private-card-paper-opacity: var(--nmorph-private-card-paper-dark-opacity);--nmorph-private-card-paper-shadow-color: color-mix(in srgb, var(--nmorph-black-color) 54%, transparent);--nmorph-private-card-paper-light-color: color-mix(in srgb, var(--nmorph-white-color) 18%, transparent)}

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

@@ -1,9 +1,9 @@
 import './NmorphCard.css';
-import { defineComponent as m, useSlots as c, computed as o } from "vue";
-import { useModifiers as g } from "../../../utils/create-modifiers.js";
-import { toCssSize as d } from "../../../utils/common.js";
-import { NmorphShadowType as h } from "../../../types/common.types.js";
-const q = /* @__PURE__ */ m({
+import { defineComponent as g, useSlots as y, computed as i } from "vue";
+import { useModifiers as v } from "../../../utils/create-modifiers.js";
+import { toCssSize as r } from "../../../utils/common.js";
+import { NmorphShadowType as S } from "../../../types/common.types.js";
+const w = /* @__PURE__ */ g({
   __name: "NmorphCard",
   props: {
     design: { type: null, required: !1, default: "nmorph" },
@@ -14,30 +14,35 @@ const q = /* @__PURE__ */ m({
     radius: { type: [Number, String], required: !1, default: void 0 },
     contentPadding: { type: [Number, String], required: !1, default: void 0 },
     contentClass: { type: String, required: !1, default: "" },
+    paper: { type: Number, required: !1, default: 0 },
     fill: { type: Boolean, required: !1, default: !0 },
     tag: { type: String, required: !1, default: "div" }
   },
-  setup(s, { expose: p }) {
-    p();
-    const e = s, u = c(), r = o(() => e.design || "nmorph"), l = o(
-      () => g({
-        nmorph: [r.value === "nmorph" ? h[e.shadowType] : ""],
-        "nmorph-card": [r.value, e.shadowType, e.fill ? "fill" : "fit-content"]
+  setup(s, { expose: u }) {
+    u();
+    const e = s, l = y(), d = i(() => e.design || "nmorph"), c = i(
+      () => v({
+        nmorph: [d.value === "nmorph" ? S[e.shadowType] : ""],
+        "nmorph-card": [d.value, e.shadowType, e.fill ? "fill" : "fit-content"]
       })
-    ), f = o(() => {
-      const t = e.padding !== void 0 ? d(e.padding) : d(e.cardPadding), a = d(e.radius), n = d(e.contentPadding);
+    ), m = i(() => {
+      const t = e.padding !== void 0 ? r(e.padding) : r(e.cardPadding), n = r(e.radius), p = r(e.contentPadding), a = Math.max(0, Number(e.paper) || 0), f = Math.min(a * 0.08, 0.48), h = Math.min(a * 0.04, 0.2);
       return {
         ...e.shadowType === "combined" && {
           "--nmorph-private-card-combined-border-width": `${e.combinedShadowBorderWidth}px`
         },
         ...t !== void 0 && { "--nmorph-private-card-padding": t, padding: t },
-        ...a !== void 0 && { "--nmorph-private-card-radius": a },
-        ...n !== void 0 && { "--nmorph-private-card-content-padding": n }
+        ...n !== void 0 && { "--nmorph-private-card-radius": n },
+        ...p !== void 0 && { "--nmorph-private-card-content-padding": p },
+        ...a > 0 && {
+          "--nmorph-private-card-paper-light-opacity": String(f),
+          "--nmorph-private-card-paper-dark-opacity": String(h)
+        }
       };
-    }), i = { props: e, slots: u, resolvedDesign: r, modifiers: l, styles: f };
-    return Object.defineProperty(i, "__isScriptSetup", { enumerable: !1, value: !0 }), i;
+    }), o = { props: e, slots: l, resolvedDesign: d, modifiers: c, styles: m };
+    return Object.defineProperty(o, "__isScriptSetup", { enumerable: !1, value: !0 }), o;
   }
 });
 export {
-  q as default
+  w as default
 };

package/dist/components/data/nmorph-carousel/NmorphCarousel.css

@@ -1 +1 @@
-.nmorph-carousel{--nmorph-private-carousel-height: 500px;--nmorph-private-carousel-frame-border: 10px;position:relative;box-sizing:border-box;height:var(--nmorph-private-carousel-height);overflow:hidden;border-radius:var(--default-border-radius)}.nmorph-carousel .nmorph-carousel__wrapper{display:flex;height:100%}.nmorph-carousel .transition-enabled{transition:transform .4s ease}.nmorph-carousel .nmorph-carousel__element-indicator-wrapper{padding:4px;cursor:pointer}.nmorph-carousel .nmorph-carousel__elements-indicator{position:absolute;bottom:16px;display:flex;justify-content:center;width:100%}.nmorph-carousel .nmorph-carousel__element-indicator{width:30px;height:2px;margin-right:var(--indentation-02);background:var(--nmorph-gray-color)}.nmorph-carousel .nmorph-carousel__element-indicator--active{background:var(--nmorph-white-color)}.nmorph-carousel .nmorph-carousel__action-btn{position:absolute;top:50%;padding:var(--indentation-03);background:var(--nmorph-info-color);border-radius:var(--default-border-radius);transform:translateY(-50%);cursor:pointer}.nmorph-carousel .nmorph-carousel__action-btn:hover{background:var(--nmorph-info-color)}.nmorph-carousel .nmorph-carousel__action-btn .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-white-color)}.nmorph-carousel .nmorph-carousel__prev{right:var(--indentation-02);rotate:-90deg}.nmorph-carousel .nmorph-carousel__next{left:var(--indentation-02);rotate:90deg}.nmorph-carousel .nmorph-carousel__item{flex-shrink:0;width:100%;height:100%}.nmorph-carousel--nmorph{background:var(--nmorph-main-color);border:var(--nmorph-private-carousel-frame-border) solid var(--nmorph-main-color)}.nmorph-carousel--plain{background:var(--nmorph-main-color);border:var(--nmorph-plain-border);box-shadow:none}.nmorph-carousel--plain .nmorph-carousel__action-btn{color:var(--nmorph-text-color);background:var(--nmorph-main-color);border:var(--nmorph-plain-border);box-shadow:none}.nmorph-carousel--plain .nmorph-carousel__action-btn .nmorph-icon{--nmorph-private-icon-color: currentColor}.nmorph-carousel--plain .nmorph-carousel__action-btn:hover{color:var(--nmorph-accent-color);background:var(--nmorph-main-color);border-color:var(--nmorph-accent-color)}
+.nmorph-carousel{--nmorph-private-carousel-height: 500px;--nmorph-private-carousel-frame-border: 10px;--nmorph-private-carousel-action-size: 36px;--nmorph-private-carousel-action-offset: var(--indentation-02);position:relative;box-sizing:border-box;height:var(--nmorph-private-carousel-height);overflow:hidden;border-radius:var(--default-border-radius)}.nmorph-carousel .nmorph-carousel__wrapper{display:flex;height:100%}.nmorph-carousel .transition-enabled{transition:transform .4s ease}.nmorph-carousel .nmorph-carousel__element-indicator-wrapper{padding:4px;cursor:pointer}.nmorph-carousel .nmorph-carousel__elements-indicator{position:absolute;bottom:16px;display:flex;justify-content:center;width:100%}.nmorph-carousel .nmorph-carousel__element-indicator{width:30px;height:2px;margin-right:var(--indentation-02);background:var(--nmorph-gray-color)}.nmorph-carousel .nmorph-carousel__element-indicator--active{background:var(--nmorph-white-color)}.nmorph-carousel .nmorph-carousel__action-btn{position:absolute;top:50%;display:flex;justify-content:center;align-items:center;box-sizing:border-box;width:var(--nmorph-private-carousel-action-size);height:var(--nmorph-private-carousel-action-size);padding:0;background:var(--nmorph-info-color);border-radius:var(--default-border-radius);transform:translateY(-50%);cursor:pointer}.nmorph-carousel .nmorph-carousel__action-btn:hover{background:var(--nmorph-info-color)}.nmorph-carousel .nmorph-carousel__action-btn .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-white-color)}.nmorph-carousel .nmorph-carousel__prev{right:var(--nmorph-private-carousel-action-offset)}.nmorph-carousel .nmorph-carousel__next{left:var(--nmorph-private-carousel-action-offset)}.nmorph-carousel .nmorph-carousel__item{flex-shrink:0;width:100%;height:100%}.nmorph-carousel--nmorph{background:var(--nmorph-main-color);border:var(--nmorph-private-carousel-frame-border) solid var(--nmorph-main-color)}.nmorph-carousel--plain{background:var(--nmorph-main-color);border:var(--nmorph-plain-border);box-shadow:none}.nmorph-carousel--plain .nmorph-carousel__action-btn{color:var(--nmorph-text-color);background:var(--nmorph-main-color);border:var(--nmorph-plain-border);box-shadow:none}.nmorph-carousel--plain .nmorph-carousel__action-btn .nmorph-icon{--nmorph-private-icon-color: currentColor}.nmorph-carousel--plain .nmorph-carousel__action-btn:hover{color:var(--nmorph-accent-color);background:var(--nmorph-main-color);border-color:var(--nmorph-accent-color)}

package/dist/components/data/nmorph-carousel/NmorphCarousel.vue.js

@@ -1,11 +1,11 @@
 import './NmorphCarousel.css';
 import d from "./NmorphCarousel.vue2.js";
-import { openBlock as o, createElementBlock as e, normalizeClass as c, createElementVNode as n, normalizeStyle as h, Fragment as i, renderList as s, createVNode as l, withCtx as m, renderSlot as p } from "vue";
+import { openBlock as e, createElementBlock as o, normalizeClass as c, createElementVNode as n, normalizeStyle as h, Fragment as i, renderList as s, createVNode as l, withCtx as m, renderSlot as p } from "vue";
 /* empty css                    */
 import u from "../../../_virtual/_plugin-vue_export-helper.js";
 const v = ["id"], f = { class: "nmorph-carousel__elements-indicator" }, C = ["onClick"];
-function k(_, N, I, r, b, w) {
-  return o(), e(
+function k(_, N, I, r, b, y) {
+  return e(), o(
     "div",
     {
       class: c(r.modifiers)
@@ -18,10 +18,10 @@ function k(_, N, I, r, b, w) {
           style: h({ transform: r.translateX })
         },
         [
-          (o(!0), e(
+          (e(!0), o(
             i,
             null,
-            s(r.carouselData, (a) => (o(), e("div", {
+            s(r.carouselData, (a) => (e(), o("div", {
               id: `nmorph-carousel-item-${r.carouselId}-${a}`,
               key: a,
               class: "nmorph-carousel__item"
@@ -34,13 +34,13 @@ function k(_, N, I, r, b, w) {
         /* STYLE */
       ),
       n("div", f, [
-        (o(!0), e(
+        (e(!0), o(
           i,
           null,
-          s(r.carouselData, (a, t) => (o(), e("div", {
+          s(r.carouselData, (a, t) => (e(), o("div", {
             key: t,
             class: "nmorph-carousel__element-indicator-wrapper",
-            onClick: (y) => r.elementIndicator(t)
+            onClick: (S) => r.elementIndicator(t)
           }, [
             n(
               "div",
@@ -62,7 +62,7 @@ function k(_, N, I, r, b, w) {
       }, [
         l(r.NmorphIcon, null, {
           default: m(() => [
-            l(r.NmorphIconChevronDown)
+            l(r.NmorphIconChevronRight)
           ]),
           _: 1
           /* STABLE */
@@ -74,7 +74,7 @@ function k(_, N, I, r, b, w) {
       }, [
         l(r.NmorphIcon, null, {
           default: m(() => [
-            l(r.NmorphIconChevronDown)
+            l(r.NmorphIconChevronLeft)
           ]),
           _: 1
           /* STABLE */

package/dist/components/data/nmorph-carousel/NmorphCarousel.vue2.js

@@ -1,29 +1,30 @@
 import './NmorphCarousel.css';
-import { defineComponent as N, ref as p, computed as u, provide as w, watch as d } from "vue";
-import { useModifiers as D } from "../../../utils/create-modifiers.js";
-import { generateUUID as M } from "../../../utils/common.js";
-import y from "../../basic/nmorph-icon/NmorphIcon.vue.js";
-import b from "../../../assets/icons/chevron-down.svg.js";
-const A = /* @__PURE__ */ N({
+import { defineComponent as x, ref as p, computed as u, provide as M, watch as d } from "vue";
+import { useModifiers as y } from "../../../utils/create-modifiers.js";
+import { generateUUID as b } from "../../../utils/common.js";
+import q from "../../../assets/icons/chevron-right.svg.js";
+import w from "../../../assets/icons/chevron-left.svg.js";
+import D from "../../basic/nmorph-icon/NmorphIcon.vue.js";
+const A = /* @__PURE__ */ x({
   __name: "NmorphCarousel",
   props: {
     design: { type: null, required: !1, default: "nmorph" },
     loop: { type: Boolean, required: !1, default: !0 }
   },
   emits: ["change"],
-  setup(f, { expose: v, emit: h }) {
-    v();
-    const e = p(0), o = f, l = h, g = u(
-      () => D({
+  setup(h, { expose: f, emit: v }) {
+    f();
+    const e = p(0), o = h, l = v, g = u(
+      () => y({
         nmorph: [o.design === "nmorph" ? "shadow-outset" : ""],
         "nmorph-carousel": [o.design]
       })
-    ), a = p([]), s = M();
-    w("carousel-data", { data: a, carouselId: s });
+    ), a = p([]), s = b();
+    M("carousel-data", { data: a, carouselId: s });
     const r = u(() => a.value.length), i = (t) => r.value ? o.loop ? (t + r.value) % r.value : Math.min(Math.max(t, 0), r.value - 1) : 0, n = (t) => {
-      const m = i(t);
-      m !== e.value && (e.value = m);
-    }, _ = () => n(e.value - 1), I = () => n(e.value + 1), S = u(() => `translateX(-${e.value * 100}%)`), x = (t) => t === e.value, C = (t) => {
+      const c = i(t);
+      c !== e.value && (e.value = c);
+    }, I = () => n(e.value - 1), _ = () => n(e.value + 1), C = u(() => `translateX(-${e.value * 100}%)`), S = (t) => t === e.value, N = (t) => {
       n(t);
     };
     d(r, (t) => {
@@ -31,12 +32,14 @@ const A = /* @__PURE__ */ N({
     }), d(e, () => {
       l("change", e.value);
     });
-    const c = { currentSlide: e, props: o, emit: l, modifiers: g, carouselData: a, carouselId: s, slideCount: r, normalizeSlideIndex: i, goToSlide: n, prevSlide: _, nextSlide: I, translateX: S, isCurrentElementActive: x, elementIndicator: C, get NmorphIcon() {
-      return y;
-    }, get NmorphIconChevronDown() {
-      return b;
+    const m = { currentSlide: e, props: o, emit: l, modifiers: g, carouselData: a, carouselId: s, slideCount: r, normalizeSlideIndex: i, goToSlide: n, prevSlide: I, nextSlide: _, translateX: C, isCurrentElementActive: S, elementIndicator: N, get NmorphIcon() {
+      return D;
+    }, get NmorphIconChevronLeft() {
+      return w;
+    }, get NmorphIconChevronRight() {
+      return q;
     } };
-    return Object.defineProperty(c, "__isScriptSetup", { enumerable: !1, value: !0 }), c;
+    return Object.defineProperty(m, "__isScriptSetup", { enumerable: !1, value: !0 }), m;
   }
 });
 export {