@nmorph/nmorph-ui-kit 2.2.15 → 2.2.17

package/README.md

@@ -11,14 +11,6 @@ Neumorphism is a design trend that blends elements of flat design and skeuomorph
 tactile interfaces with raised or inset effects, subtle gradients, and delicate shadows. This style aims to make UI
 components feel tangible and visually engaging.
 
-## Status: Testing
-
-The library is currently in its **testing phase**. As the sole developer behind this project, I am working on improving
-its stability, fixing bugs, and ensuring high-quality components.
-
-If you encounter any issues, please don't hesitate to report them. Your feedback is highly appreciated and will help
-enhance the library.
-
 **Documentation:** For detailed instructions and examples, visit the [official documentation site](https://nmorph.dev).
 
 ---

package/dist/components/basic/nmorph-button/NmorphButton.css

@@ -1 +1 @@
-.nmorph-button{display:inline-block;width:auto}.nmorph-button.nmorph--fill{width:100%}.nmorph-button .nmorph-button__content{display:flex;gap:var(--indentation-02);justify-content:center;align-items:center;box-sizing:border-box;width:100%;height:var(--height);padding:var(--indentation-00) var(--indentation-04);line-height:0;background:var(--nmorph-main-color);border:none;border-radius:var(--default-border-radius);box-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);cursor:pointer}.nmorph-button .nmorph-button__content span{--color: var(--nmorph-white-color)}.nmorph-button .nmorph-button__content>.nmorph-icon{flex-shrink:0}.nmorph-button .nmorph-button__content:disabled{pointer-events:none}.nmorph-button .nmorph-button__content[loading=true]{cursor:default}.nmorph-button.nmorph-button--ripple .nmorph-button__content{position:relative;overflow:hidden}.nmorph-button.nmorph-button--ripple .nmorph-button__content:after{position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle,var(--nmorph-main-color) 10%,transparent 10.01%);background-repeat:no-repeat;background-position:50%;transform:scale(10);opacity:0;transition:transform .3s,opacity 1s;content:""}.nmorph-button.nmorph-button--ripple .nmorph-button__content:active:after{transform:scale(0);opacity:.3;transition:0s}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover{background:var(--nmorph-accent-color);box-shadow:none}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--color: var(--nmorph-white-color)}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-white-color)}.nmorph-button.nmorph-button--round .nmorph-button__content{border-radius:var(--border-radius-200)}.nmorph-button.nmorph-button--circle{width:var(--height)}.nmorph-button.nmorph-button--circle .nmorph-button__content{border-radius:var(--border-radius-circular)}.nmorph-button.nmorph-button--transparent{padding:var(--indentation-00)}.nmorph-button.nmorph-button--transparent .nmorph-button__content:not(:disabled,[loading=true]):hover{color:var(--nmorph-accent-color);background:transparent;box-shadow:none}.nmorph-button.nmorph-button--transparent .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-accent-color)}.nmorph-button.nmorph-button--transparent .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--color: var(--nmorph-accent-color)}.nmorph-button.nmorph-button--transparent .nmorph-button__content{color:var(--transparent-button-color, var(--nmorph-text-color));background:transparent;box-shadow:none}.nmorph-button.nmorph-button--transparent .nmorph-button__content .nmorph-icon{--color: var(--transparent-button-color, var(--nmorph-text-color))}.nmorph-button.nmorph-button--square,.nmorph-button.nmorph-button--icon-only{width:var(--height);height:var(--height)}.nmorph-button.nmorph-button--icon-only .nmorph-button__content{padding:0}.nmorph-button.nmorph-button.nmorph--thin-component{font-weight:400;font-size:var(--font-size-extra-small);line-height:var(--line-height-regular)}.nmorph-button.nmorph-button--disabled{cursor:not-allowed;opacity:.6}
+.nmorph-button{display:inline-block;width:auto}.nmorph-button.nmorph--fill{width:100%}.nmorph-button .nmorph-button__content{display:flex;gap:var(--indentation-02);justify-content:center;align-items:center;box-sizing:border-box;width:100%;height:var(--height);padding:var(--indentation-00) var(--indentation-04);line-height:0;background:var(--nmorph-main-color);border:none;border-radius:var(--default-border-radius);box-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);color:var(--nmorph-button-color, var(--nmorph-text-color));cursor:pointer}.nmorph-button .nmorph-button__content span{color:var(--nmorph-button-color, var(--nmorph-text-color));--color: var(--nmorph-button-color, var(--nmorph-text-color))}.nmorph-button .nmorph-button__content>.nmorph-icon{flex-shrink:0;--color: var(--nmorph-button-color, var(--nmorph-text-color))}.nmorph-button .nmorph-button__content:disabled{pointer-events:none}.nmorph-button .nmorph-button__content[loading=true]{cursor:default}.nmorph-button.nmorph-button--ripple .nmorph-button__content{position:relative;overflow:hidden}.nmorph-button.nmorph-button--ripple .nmorph-button__content:after{position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle,var(--nmorph-main-color) 10%,transparent 10.01%);background-repeat:no-repeat;background-position:50%;transform:scale(10);opacity:0;transition:transform .3s,opacity 1s;content:""}.nmorph-button.nmorph-button--ripple .nmorph-button__content:active:after{transform:scale(0);opacity:.3;transition:0s}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover{background:var(--nmorph-accent-color);color:var(--nmorph-white-color);box-shadow:none}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--color: var(--nmorph-white-color)}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-white-color)}.nmorph-button.nmorph-button--round .nmorph-button__content{border-radius:var(--border-radius-200)}.nmorph-button.nmorph-button--circle{width:var(--height)}.nmorph-button.nmorph-button--circle .nmorph-button__content{border-radius:var(--border-radius-circular)}.nmorph-button.nmorph-button--transparent{padding:var(--indentation-00)}.nmorph-button.nmorph-button--transparent .nmorph-button__content:not(:disabled,[loading=true]):hover{color:var(--nmorph-accent-color);background:transparent;box-shadow:none}.nmorph-button.nmorph-button--transparent.nmorph-button--custom-color .nmorph-button__content:not(:disabled,[loading=true]):hover{color:var(--nmorph-button-hover-color)}.nmorph-button.nmorph-button--transparent .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-accent-color)}.nmorph-button.nmorph-button--transparent.nmorph-button--custom-color .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-button-hover-color);--color: var(--nmorph-button-hover-color)}.nmorph-button.nmorph-button--transparent .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--color: var(--nmorph-accent-color)}.nmorph-button.nmorph-button--transparent.nmorph-button--custom-color .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--color: var(--nmorph-button-hover-color)}.nmorph-button.nmorph-button--transparent .nmorph-button__content{color:var(--nmorph-button-color, var(--transparent-button-color, var(--nmorph-text-color)));background:transparent;box-shadow:none}.nmorph-button.nmorph-button--transparent .nmorph-button__content span{color:var(--nmorph-button-color, var(--transparent-button-color, var(--nmorph-text-color)));--color: var(--nmorph-button-color, var(--transparent-button-color, var(--nmorph-text-color)))}.nmorph-button.nmorph-button--transparent .nmorph-button__content .nmorph-icon{--color: var(--nmorph-button-color, var(--transparent-button-color, var(--nmorph-text-color)))}.nmorph-button.nmorph-button--square,.nmorph-button.nmorph-button--icon-only{width:var(--height);height:var(--height)}.nmorph-button.nmorph-button--icon-only .nmorph-button__content{padding:0}.nmorph-button.nmorph-button.nmorph--thin-component{font-weight:400;font-size:var(--font-size-extra-small);line-height:var(--line-height-regular)}.nmorph-button.nmorph-button--disabled{cursor:not-allowed;opacity:.6}

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

@@ -1,6 +1,6 @@
 import './NmorphButton.css';
 import d from "./NmorphButton.vue2.js";
-import { openBlock as e, createElementBlock as r, normalizeStyle as s, normalizeClass as c, createElementVNode as m, createBlock as a, withCtx as i, createVNode as p, renderSlot as n, Fragment as f, createCommentVNode as l, toDisplayString as h } from "vue";
+import { openBlock as e, createElementBlock as r, normalizeStyle as s, normalizeClass as c, createElementVNode as m, createBlock as i, withCtx as l, createVNode as p, renderSlot as n, Fragment as f, createCommentVNode as a, toDisplayString as h } from "vue";
 /* empty css                  */
 import y from "../../../_virtual/_plugin-vue_export-helper.js";
 const _ = ["disabled", "loading", "type", "tabindex"], b = { key: 1 };
@@ -9,7 +9,7 @@ function k(t, N, g, o, S, B) {
     "div",
     {
       class: c(o.modifiers),
-      style: s(o.transparentColorStyles)
+      style: s(o.buttonColorStyles)
     },
     [
       m("button", {
@@ -20,17 +20,17 @@ function k(t, N, g, o, S, B) {
         type: o.props.type,
         tabindex: o.props.tabindex
       }, [
-        o.props.loading ? (e(), a(o.NmorphIcon, {
+        o.props.loading ? (e(), i(o.NmorphIcon, {
           key: 0,
           size: o.loadingButtonSize
         }, {
-          default: i(() => [
+          default: l(() => [
             p(o.NmorphIconLoading)
           ]),
           _: 1
           /* STABLE */
-        }, 8, ["size"])) : o.hasIconOnlySlot ? (e(), a(o.NmorphIcon, { key: 1 }, {
-          default: i(() => [
+        }, 8, ["size"])) : o.hasIconOnlySlot ? (e(), i(o.NmorphIcon, { key: 1 }, {
+          default: l(() => [
             n(t.$slots, "icon-only")
           ]),
           _: 3
@@ -39,13 +39,13 @@ function k(t, N, g, o, S, B) {
           f,
           { key: 2 },
           [
-            o.hasIconSlot ? (e(), a(o.NmorphIcon, { key: 0 }, {
-              default: i(() => [
+            o.hasIconSlot ? (e(), i(o.NmorphIcon, { key: 0 }, {
+              default: l(() => [
                 n(t.$slots, "icon")
               ]),
               _: 3
               /* FORWARDED */
-            })) : l("v-if", !0),
+            })) : a("v-if", !0),
             n(t.$slots, "default"),
             o.props.text !== void 0 ? (e(), r(
               "span",
@@ -53,7 +53,7 @@ function k(t, N, g, o, S, B) {
               h(o.props.text),
               1
               /* TEXT */
-            )) : l("v-if", !0),
+            )) : a("v-if", !0),
             n(t.$slots, "append")
           ],
           64
@@ -65,7 +65,7 @@ function k(t, N, g, o, S, B) {
     /* CLASS, STYLE */
   );
 }
-const C = /* @__PURE__ */ y(d, [["render", k], ["__file", "/builds/ketjo/nmorph/library/src/components/basic/nmorph-button/NmorphButton.vue"]]);
+const u = /* @__PURE__ */ y(d, [["render", k], ["__file", "/builds/ketjo/nmorph/library/src/components/basic/nmorph-button/NmorphButton.vue"]]);
 export {
-  C as default
+  u as default
 };

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

@@ -1,10 +1,10 @@
 import './NmorphButton.css';
-import { defineComponent as c, useSlots as m, computed as t, ref as y } from "vue";
-import { NmorphComponentHeight as h } from "../../../types/index.js";
+import { defineComponent as c, useSlots as m, computed as o, ref as h } from "vue";
+import { NmorphComponentHeight as y } from "../../../types/index.js";
 import { useModifiers as g } from "../../../utils/create-modifiers.js";
 import b from "../../../assets/icons/loading.svg.js";
 import q from "../nmorph-icon/NmorphIcon.vue.js";
-const I = /* @__PURE__ */ c({
+const $ = /* @__PURE__ */ c({
   __name: "NmorphButton",
   props: {
     styleType: { type: null, required: !1, default: "default" },
@@ -23,28 +23,31 @@ const I = /* @__PURE__ */ c({
     height: { type: null, required: !1, default: "basic" },
     disabled: { type: Boolean, required: !1, default: !1 }
   },
-  setup(i, { expose: s }) {
-    const e = i, o = m(), u = t(() => !!o.icon), r = t(() => !!o["icon-only"]), p = t(
+  setup(i, { expose: u }) {
+    const e = i, t = m(), s = o(() => !!t.icon), r = o(() => !!t["icon-only"]), p = o(
       () => g({
-        nmorph: [h[e.height], `${e.fill && "fill"}`],
+        nmorph: [y[e.height], `${e.fill && "fill"}`],
         "nmorph-button": [
           e.styleType,
           e.shape,
           `${e.disabled && "disabled"}`,
           `${e.accentBgOnHover && "accent-bg-on-hover"}`,
           `${e.ripple && "ripple"}`,
-          `${r.value && "icon-only"}`
+          `${r.value && "icon-only"}`,
+          `${e.color && "custom-color"}`
         ]
       })
-    ), l = y(null), n = {
+    ), l = h(null), n = {
       thin: "small",
       basic: "medium",
       thick: "large"
-    }, d = t(() => n[e.height]), f = t(
-      () => e.styleType === "transparent" && e.color ? { "--transparent-button-color": e.color } : {}
-    );
-    s({ buttonDOMElement: l });
-    const a = { props: e, slots: o, hasIconSlot: u, hasIconOnlySlot: r, modifiers: p, buttonDOMElement: l, iconSizeMap: n, loadingButtonSize: d, transparentColorStyles: f, get NmorphIcon() {
+    }, d = o(() => n[e.height]), f = o(() => e.color ? {
+      "--nmorph-button-color": e.color,
+      "--transparent-button-color": e.color,
+      "--nmorph-button-hover-color": `color-mix(in srgb, ${e.color} 75%, var(--nmorph-white-color))`
+    } : {});
+    u({ buttonDOMElement: l });
+    const a = { props: e, slots: t, hasIconSlot: s, hasIconOnlySlot: r, modifiers: p, buttonDOMElement: l, iconSizeMap: n, loadingButtonSize: d, buttonColorStyles: f, get NmorphIcon() {
       return q;
     }, get NmorphIconLoading() {
       return b;
@@ -53,5 +56,5 @@ const I = /* @__PURE__ */ c({
   }
 });
 export {
-  I as default
+  $ as default
 };

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

@@ -1 +1 @@
-.nmorph-badge{position:relative;display:inline-block;height:fit-content;--dot-size: 4px}.nmorph-badge .nmorph-badge__container{position:absolute;display:inline-flex;justify-content:center;align-items:center;background:var(--nmorph-badge-color);border-radius:var(--default-border-radius);opacity:1}.nmorph-badge.nmorph-badge--tag{position:static;display:inline-flex}.nmorph-badge .nmorph-badge__container--tag{position:static}.nmorph-badge .nmorph-badge__content{padding:2px 4px;color:var(--nmorph-light-shade-color);font-size:var(--font-size-base);line-height:var(--line-height-regular)}.nmorph-badge.nmorph-badge--tiny .nmorph-badge__content{font-size:var(--font-size-tiny)}.nmorph-badge.nmorph-badge--extra-small .nmorph-badge__content{font-size:var(--font-size-extra-small)}.nmorph-badge .nmorph-badge__container--hidden{opacity:0}.nmorph-badge .nmorph-badge__dot{width:var(--dot-size);height:var(--dot-size);border-radius:var(--border-radius-circular)}
+.nmorph-badge{position:relative;display:inline-block;height:fit-content;--dot-size: 4px}.nmorph-badge .nmorph-badge__container{position:absolute;display:inline-flex;justify-content:center;align-items:center;background:var(--nmorph-badge-color);border-radius:var(--default-border-radius);opacity:1}.nmorph-badge.nmorph-badge--tag{position:static;display:inline-flex}.nmorph-badge .nmorph-badge__container--tag{position:static}.nmorph-badge .nmorph-badge__content{box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;min-width:calc(1em * var(--line-height-regular) + 4px);padding:2px 4px;color:var(--nmorph-light-shade-color);font-size:var(--font-size-base);line-height:var(--line-height-regular);text-align:center}.nmorph-badge.nmorph-badge--tiny .nmorph-badge__content{font-size:var(--font-size-tiny)}.nmorph-badge.nmorph-badge--extra-small .nmorph-badge__content{font-size:var(--font-size-extra-small)}.nmorph-badge .nmorph-badge__container--hidden{opacity:0}.nmorph-badge .nmorph-badge__dot{width:var(--dot-size);height:var(--dot-size);border-radius:var(--border-radius-circular)}

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

@@ -14,7 +14,7 @@ const ne = /* @__PURE__ */ R({
     initialDate: { type: Date, required: !1, default: () => /* @__PURE__ */ new Date() },
     range: { type: null, required: !1, default: void 0 },
     type: { type: null, required: !1, default: "date" },
-    modelValue: { type: [Date, Array], required: !1, default: () => /* @__PURE__ */ new Date() }
+    modelValue: { type: [Date, Array, null], required: !1, default: () => /* @__PURE__ */ new Date() }
   },
   emits: ["update:model-value", "update-initial-date"],
   setup(N, { expose: _, emit: b }) {

package/dist/components/data/nmorph-calendar/utils.js

@@ -1,83 +1,96 @@
-import { useCalendarTexts as C } from "./hooks/use-calendar-texts.js";
-const P = (t) => {
+import { useCalendarTexts as F } from "./hooks/use-calendar-texts.js";
+const H = (t) => {
   const e = t - t % 10, a = [];
   for (let n = 0; n < 10; n++)
     a.push(e + n);
   return a;
-}, Q = (t) => {
-  if (!t) return;
-  const e = "en-CA", a = {
-    year: "numeric",
-    month: "2-digit",
-    day: "2-digit"
+}, W = {
+  year: "numeric",
+  month: "2-digit",
+  day: "2-digit"
+}, T = (t) => String(t).padStart(2, "0"), C = (t, e) => {
+  const a = {
+    YYYY: String(t.getFullYear()),
+    YY: String(t.getFullYear()).slice(-2),
+    MM: T(t.getMonth() + 1),
+    M: String(t.getMonth() + 1),
+    DD: T(t.getDate()),
+    D: String(t.getDate())
   };
-  return Array.isArray(t) ? t.map((n) => n ? new Intl.DateTimeFormat(e, a).format(n) : null) : new Intl.DateTimeFormat(e, a).format(t);
-}, L = (t, e) => t.getMonth() > e.getMonth(), B = (t, e) => t.getMonth() < e.getMonth(), H = (t) => {
+  return e.replace(/YYYY|YY|MM|M|DD|D/g, (n) => a[n]);
+}, P = (t, e = {}) => {
+  if (!t) return;
+  const a = (n) => e.formatter ? e.formatter(n) : e.format ? C(n, e.format) : new Intl.DateTimeFormat(e.locale || "en-CA", e.options || W).format(
+    n
+  );
+  return Array.isArray(t) ? t.map((n) => n ? a(n) : null) : a(t);
+}, Z = (t) => P(t), b = (t, e) => t.getMonth() > e.getMonth(), j = (t, e) => t.getMonth() < e.getMonth(), q = (t) => {
   const e = /* @__PURE__ */ new Date();
   if (!t) return !0;
   const a = t && t[0], n = t && t[1];
   return e >= a && e <= n;
-}, Z = (t) => {
-  const { months: e } = C();
+}, z = (t) => {
+  const { months: e } = F();
   return e[t];
-}, R = (t) => t % 4 === 0 && t % 100 !== 0 || t % 400 === 0, x = (t, e) => [0, 2, 4, 6, 7, 9, 11].includes(e) ? 31 : [3, 5, 8, 10].includes(e) ? 30 : R(t) ? 29 : 28, k = (t) => new Date(t.getFullYear(), t.getMonth(), t.getDate()), b = (t, e) => {
-  const a = (o) => e ? o < k(e[0]) || o > k(e[1]) : !1, n = t.value.getFullYear(), r = t.value.getMonth(), A = new Date(n, r, 1).getDay() + 1, y = x(n, r), W = 7 + A - 8;
-  let l = 7 - (new Date(n, r, y).getDay() + 1);
-  const i = /* @__PURE__ */ new Date(), M = i.getDate(), D = i.getMonth(), d = r - 1, g = x(n, d);
-  let c = g - W;
-  const m = [];
+}, R = (t) => t % 4 === 0 && t % 100 !== 0 || t % 400 === 0, x = (t, e) => [0, 2, 4, 6, 7, 9, 11].includes(e) ? 31 : [3, 5, 8, 10].includes(e) ? 30 : R(t) ? 29 : 28, k = (t) => new Date(t.getFullYear(), t.getMonth(), t.getDate()), E = (t, e) => {
+  const a = (o) => e ? o < k(e[0]) || o > k(e[1]) : !1, n = t.value.getFullYear(), s = t.value.getMonth(), S = new Date(n, s, 1).getDay() + 1, y = x(n, s), A = 7 + S - 8;
+  let d = 7 - (new Date(n, s, y).getDay() + 1);
+  const h = /* @__PURE__ */ new Date(), M = h.getDate(), i = h.getMonth(), l = s - 1, g = x(n, l);
+  let c = g - A;
+  const f = [];
   for (; c < g; ) {
     c++;
-    const o = D === d && M === c, s = new Date(n, d, c);
-    m.push({
+    const o = i === l && M === c, r = new Date(n, l, c);
+    f.push({
       value: c,
       monthType: "previous",
       isToday: o,
-      date: s,
-      hidden: a(s)
+      date: r,
+      hidden: a(r)
     });
   }
-  const f = r + 1, p = [];
+  const m = s + 1, Y = [];
   let u = 0;
-  for (; l; ) {
-    u++, l--;
-    const o = D === f && M === u, s = new Date(n, f, u);
-    p.push({
+  for (; d; ) {
+    u++, d--;
+    const o = i === m && M === u, r = new Date(n, m, u);
+    Y.push({
       value: u,
       monthType: "next",
       isToday: o,
-      date: s,
-      hidden: a(s)
+      date: r,
+      hidden: a(r)
     });
   }
-  let h = 0;
-  const I = [];
-  for (; h < y; ) {
-    const o = i.getDate();
-    h++;
-    const s = D === r && o === h, T = new Date(n, r, h);
-    I.push({
-      value: h,
+  let D = 0;
+  const p = [];
+  for (; D < y; ) {
+    const o = h.getDate();
+    D++;
+    const r = i === s && o === D, v = new Date(n, s, D);
+    p.push({
+      value: D,
       monthType: "current",
-      isToday: s,
-      date: T,
-      hidden: a(T)
+      isToday: r,
+      date: v,
+      hidden: a(v)
     });
   }
-  const w = [...m, ...I, ...p], v = [];
-  for (let o = 0; o < w.length; o += 7) {
-    const s = w.slice(o, o + 7);
-    v.push(s);
+  const I = [...f, ...p, ...Y], w = [];
+  for (let o = 0; o < I.length; o += 7) {
+    const r = I.slice(o, o + 7);
+    w.push(r);
   }
-  return v.filter((o) => !o.every((s) => s.hidden));
+  return w.filter((o) => !o.every((r) => r.hidden));
 };
 export {
-  Q as formatDateIntl,
-  P as getDecadeYears,
-  b as getMonthDaysByWeek,
-  Z as getMonthName,
-  B as hasAnyRangeDateInNextMonth,
-  L as hasAnyRangeDateInPrevMonth,
-  H as isTodayInMonthRange,
+  P as formatDate,
+  Z as formatDateIntl,
+  H as getDecadeYears,
+  E as getMonthDaysByWeek,
+  z as getMonthName,
+  j as hasAnyRangeDateInNextMonth,
+  b as hasAnyRangeDateInPrevMonth,
+  q as isTodayInMonthRange,
   k as resetTimeToZero
 };

package/dist/components/data/nmorph-image-preview/NmorphImagePreview.vue.js

@@ -1,8 +1,8 @@
 import './NmorphImagePreview.css';
 import g from "./NmorphImagePreview.vue2.js";
-import { openBlock as l, createElementBlock as a, Fragment as s, normalizeClass as h, createElementVNode as i, createVNode as o, createSlots as _, withCtx as r, renderSlot as m, createCommentVNode as t, createBlock as c, Teleport as p, normalizeStyle as k, renderList as N, resolveDynamicComponent as v } from "vue";
+import { openBlock as l, createElementBlock as a, Fragment as s, normalizeClass as h, createElementVNode as i, createVNode as e, createSlots as _, withCtx as r, renderSlot as m, createCommentVNode as t, createBlock as c, Teleport as p, normalizeStyle as k, renderList as w, resolveDynamicComponent as v } from "vue";
 /* empty css                        */
-import w from "../../../_virtual/_plugin-vue_export-helper.js";
+import N from "../../../_virtual/_plugin-vue_export-helper.js";
 const y = { class: "nmorph-image-preview__content" }, C = {
   key: 0,
   class: "nmorph-image-preview__left"
@@ -10,25 +10,25 @@ const y = { class: "nmorph-image-preview__content" }, C = {
   key: 1,
   class: "nmorph-image-preview__right"
 }, S = { class: "nmorph-image-preview__actions" }, b = { class: "nmorph-image-preview__action-element" };
-function B(n, z, D, e, H, L) {
+function B(n, z, D, o, H, L) {
   return l(), a(
     s,
     null,
     [
-      e.props.showTrigger ? (l(), a(
+      o.props.showTrigger ? (l(), a(
         "div",
         {
           key: 0,
-          class: h(e.modifiers)
+          class: h(o.modifiers)
         },
         [
           i("div", {
             class: "nmorph-image-preview__trigger",
-            onClick: e.clickHandler
+            onClick: o.clickHandler
           }, [
-            o(e.NmorphImage, {
-              src: e.triggerSource,
-              alt: e.props.alt,
+            e(o.NmorphImage, {
+              src: o.triggerSource,
+              alt: o.props.alt,
               fit: "cover",
               "frame-border": 0
             }, _({
@@ -59,22 +59,24 @@ function B(n, z, D, e, H, L) {
         i(
           "div",
           {
-            class: h(["nmorph-image-preview__portal", e.modifiers])
+            class: h(["nmorph-image-preview__portal", o.modifiers])
           },
           [
-            o(e.NmorphOverlay, {
-              show: e.open,
-              "z-index": e.props.zIndex,
-              onOnOutsideClick: e.closeHandler
+            e(o.NmorphOverlay, {
+              show: o.open,
+              "z-index": o.props.zIndex,
+              "trap-focus": "",
+              onOnOutsideClick: o.closeHandler,
+              onOnEscapeKeydown: o.closeHandler
             }, {
               default: r(() => [
                 i("div", y, [
-                  o(e.NmorphImage, {
-                    src: e.triggerSource,
-                    alt: e.props.alt,
+                  e(o.NmorphImage, {
+                    src: o.triggerSource,
+                    alt: o.props.alt,
                     fit: "cover",
                     "frame-border": 0,
-                    style: k({ transform: `rotate(${e.rotateLevel}deg) scale(${e.scaleLevel})` })
+                    style: k({ transform: `rotate(${o.rotateLevel}deg) scale(${o.scaleLevel})` })
                   }, _({
                     _: 2
                     /* DYNAMIC */
@@ -95,12 +97,12 @@ function B(n, z, D, e, H, L) {
                     } : void 0
                   ]), 1032, ["src", "alt", "style"])
                 ]),
-                e.multipleSources ? (l(), a("div", C, [
-                  o(e.NmorphButton, { onClick: e.previousHandler }, {
+                o.multipleSources ? (l(), a("div", C, [
+                  e(o.NmorphButton, { onClick: o.previousHandler }, {
                     default: r(() => [
-                      o(e.NmorphIcon, null, {
+                      e(o.NmorphIcon, null, {
                         default: r(() => [
-                          o(e.NmorphIconChevronDown)
+                          e(o.NmorphIconChevronDown)
                         ]),
                         _: 1
                         /* STABLE */
@@ -110,12 +112,12 @@ function B(n, z, D, e, H, L) {
                     /* STABLE */
                   })
                 ])) : t("v-if", !0),
-                e.multipleSources ? (l(), a("div", I, [
-                  o(e.NmorphButton, { onClick: e.nextHandler }, {
+                o.multipleSources ? (l(), a("div", I, [
+                  e(o.NmorphButton, { onClick: o.nextHandler }, {
                     default: r(() => [
-                      o(e.NmorphIcon, null, {
+                      e(o.NmorphIcon, null, {
                         default: r(() => [
-                          o(e.NmorphIconChevronDown)
+                          e(o.NmorphIconChevronDown)
                         ]),
                         _: 1
                         /* STABLE */
@@ -129,16 +131,16 @@ function B(n, z, D, e, H, L) {
                   (l(), a(
                     s,
                     null,
-                    N(e.actions, (d, f) => i("div", {
+                    w(o.actions, (d, f) => i("div", {
                       key: f,
                       class: "nmorph-image-preview__action-element"
                     }, [
-                      o(e.NmorphButton, {
+                      e(o.NmorphButton, {
                         onClick: d.handler
                       }, {
                         default: r(() => [
-                          o(
-                            e.NmorphIcon,
+                          e(
+                            o.NmorphIcon,
                             null,
                             {
                               default: r(() => [
@@ -159,14 +161,14 @@ function B(n, z, D, e, H, L) {
                     /* STABLE_FRAGMENT */
                   )),
                   i("div", b, [
-                    o(e.NmorphButton, {
-                      disabled: e.scaleLevel === 1,
-                      onClick: e.enlargeShrinkActionData.handler
+                    e(o.NmorphButton, {
+                      disabled: o.scaleLevel === 1,
+                      onClick: o.enlargeShrinkActionData.handler
                     }, {
                       default: r(() => [
-                        o(e.NmorphIcon, null, {
+                        e(o.NmorphIcon, null, {
                           default: r(() => [
-                            (l(), c(v(e.enlargeShrinkActionData.icon)))
+                            (l(), c(v(o.enlargeShrinkActionData.icon)))
                           ]),
                           _: 1
                           /* STABLE */
@@ -191,7 +193,7 @@ function B(n, z, D, e, H, L) {
     /* STABLE_FRAGMENT */
   );
 }
-const E = /* @__PURE__ */ w(g, [["render", B], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-image-preview/NmorphImagePreview.vue"]]);
+const A = /* @__PURE__ */ N(g, [["render", B], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-image-preview/NmorphImagePreview.vue"]]);
 export {
-  E as default
+  A as default
 };

package/dist/components/data/nmorph-table/NmorphTable.css

@@ -1 +1 @@
-.nmorph-table{--border-color: var(--nmorph-info-text-color);--table-cell-height: auto;--table-background-row-hover: var(--nmorph-info-color)}.nmorph-table .nmorph-table__header th{border-bottom:0}.nmorph-table .nmorph-table__button-wrapper{display:flex;align-items:center;margin-left:var(--indentation-03)}.nmorph-table table{width:calc(100% - 2px);margin-left:1px;border-collapse:collapse;border-spacing:0}.nmorph-table .nmorph-table__table-data{padding:var(--indentation-03) 0;border-bottom:1px solid var(--border-color)}.nmorph-table .nmorph-table__table-data--bordered{border:1px solid var(--border-color)}.nmorph-table .nmorph-table__cell{padding:0 var(--indentation-03)}.nmorph-table .nmorph-table__cell-content{display:flex;align-items:center}.nmorph-table .nmorph-table__cell--data{height:var(--table-cell-height)}.nmorph-table .nmorph-table__body{position:relative}.nmorph-table .nmorph-table__body--virtual{overflow-x:hidden}.nmorph-table .nmorph-table__body--virtual .nmorph-table__table-data{height:var(--table-virtual-row-height);padding-top:0;padding-bottom:0}.nmorph-table .nmorph-table__virtual-spacer{position:relative;min-width:100%}.nmorph-table .nmorph-table__virtual-content{position:absolute;top:0;right:0;left:0}.nmorph-table .nmorph-table__table-data-row--row-hover:hover{background:var(--table-background-row-hover)}.nmorph-table--nmorph{overflow:hidden;background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-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);--border-color: transparent}.nmorph-table--nmorph .nmorph-table__button-wrapper{padding:var(--indentation-02)}.nmorph-table--nmorph .nmorph-table__table-row{background:var(--nmorph-main-color);box-shadow: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(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color)}
+.nmorph-table{--border-color: var(--nmorph-info-text-color);--table-cell-height: auto;--table-background-row-hover: var(--nmorph-info-color)}.nmorph-table .nmorph-table__header th{border-bottom:0}.nmorph-table .nmorph-table__button-wrapper{display:flex;align-items:center;margin-left:var(--indentation-03)}.nmorph-table table{width:calc(100% - 2px);margin-left:1px;border-collapse:collapse;border-spacing:0}.nmorph-table .nmorph-table__table-data{padding:var(--indentation-03) 0;border-bottom:1px solid var(--border-color)}.nmorph-table .nmorph-table__table-data--bordered{border:1px solid var(--border-color)}.nmorph-table .nmorph-table__cell{padding:0 var(--indentation-03)}.nmorph-table .nmorph-table__cell-content{display:flex;align-items:center}.nmorph-table .nmorph-table__cell--data{height:var(--table-cell-height)}.nmorph-table .nmorph-table__body{position:relative}.nmorph-table .nmorph-table__body--virtual{overflow-x:hidden}.nmorph-table .nmorph-table__body--virtual .nmorph-table__table-data{height:var(--table-virtual-row-height);padding-top:0;padding-bottom:0}.nmorph-table .nmorph-table__body--virtual.nmorph-table__body--dynamic .nmorph-table__table-data{height:auto}.nmorph-table .nmorph-table__virtual-spacer{position:relative;min-width:100%}.nmorph-table .nmorph-table__virtual-content{position:absolute;top:0;right:0;left:0}.nmorph-table .nmorph-table__table-data-row--row-hover:hover,.nmorph-table .nmorph-table__table-data-row--active{background:var(--table-background-row-hover)}.nmorph-table--nmorph{overflow:hidden;background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-outset);--border-color: transparent}.nmorph-table--nmorph .nmorph-table__button-wrapper{padding:var(--indentation-02)}.nmorph-table--nmorph .nmorph-table__table-row{background:var(--nmorph-main-color);box-shadow:var(--nmorph-shadow-inset)}