@nmorph/nmorph-ui-kit 2.2.59 → 3.0.0

package/dist/components/form/nmorph-date-picker/inner-components/nmorph-year-month-picker/NmorphYearMonthPicker.vue.js

@@ -1,74 +1,65 @@
 import './NmorphYearMonthPicker.css';
-import l from "./NmorphYearMonthPicker.vue2.js";
-import { openBlock as i, createElementBlock as m, normalizeClass as c, createElementVNode as a, createVNode as e, withCtx as n } from "vue";
+import i from "./NmorphYearMonthPicker.vue2.js";
+import { openBlock as l, createElementBlock as m, createElementVNode as a, createVNode as e, withCtx as n } from "vue";
 /* empty css                           */
-import d from "../../../../../_virtual/_plugin-vue_export-helper.js";
-const h = { class: "nmorph-year-month-picker__header" }, p = { class: "nmorph-year-month-picker__value" }, s = { class: "nmorph-year-month-picker__values" };
-function _(k, r, f, o, v, N) {
-  return i(), m(
-    "div",
-    {
-      class: c(o.modifiers)
-    },
-    [
-      a("div", h, [
-        e(o.NmorphButton, {
-          class: "nmorph-year-month-picker__action-btn",
-          tabindex: -1,
-          onClick: r[0] || (r[0] = (t) => o.buttonClickHandler("decrease"))
-        }, {
-          default: n(() => [
-            e(o.NmorphIcon, { class: "nmorph-year-month-picker__chevron-left" }, {
-              default: n(() => [
-                e(o.NmorphIconChevronDown)
-              ]),
-              _: 1
-              /* STABLE */
-            })
-          ]),
-          _: 1
-          /* STABLE */
-        }),
-        a("div", p, [
-          e(o.NmorphButton, {
-            text: o.value,
-            tabindex: -1,
-            "style-type": "transparent",
-            onClick: o.goToYearsHandler
-          }, null, 8, ["text"])
+import c from "../../../../../_virtual/_plugin-vue_export-helper.js";
+const h = { class: "nmorph-year-month-picker" }, d = { class: "nmorph-year-month-picker__header" }, p = { class: "nmorph-year-month-picker__value" }, _ = { class: "nmorph-year-month-picker__values" };
+function s(k, r, v, o, f, N) {
+  return l(), m("div", h, [
+    a("div", d, [
+      e(o.NmorphButton, {
+        class: "nmorph-year-month-picker__action-btn",
+        tabindex: -1,
+        onClick: r[0] || (r[0] = (t) => o.buttonClickHandler("decrease"))
+      }, {
+        default: n(() => [
+          e(o.NmorphIcon, { class: "nmorph-year-month-picker__chevron-left" }, {
+            default: n(() => [
+              e(o.NmorphIconChevronDown)
+            ]),
+            _: 1
+            /* STABLE */
+          })
         ]),
+        _: 1
+        /* STABLE */
+      }),
+      a("div", p, [
         e(o.NmorphButton, {
-          class: "nmorph-year-month-picker__action-btn",
+          text: o.value,
           tabindex: -1,
-          onClick: r[1] || (r[1] = (t) => o.buttonClickHandler("increase"))
-        }, {
-          default: n(() => [
-            e(o.NmorphIcon, { class: "nmorph-year-month-picker__chevron-right" }, {
-              default: n(() => [
-                e(o.NmorphIconChevronDown)
-              ]),
-              _: 1
-              /* STABLE */
-            })
-          ]),
-          _: 1
-          /* STABLE */
-        })
+          onClick: o.goToYearsHandler
+        }, null, 8, ["text"])
       ]),
-      e(o.NmorphDivider),
-      a("div", s, [
-        e(o.NmorphRadioGroup, {
-          modelValue: o.selectedValueModel,
-          "onUpdate:modelValue": r[2] || (r[2] = (t) => o.selectedValueModel = t),
-          options: o.values
-        }, null, 8, ["modelValue", "options"])
-      ])
-    ],
-    2
-    /* CLASS */
-  );
+      e(o.NmorphButton, {
+        class: "nmorph-year-month-picker__action-btn",
+        tabindex: -1,
+        onClick: r[1] || (r[1] = (t) => o.buttonClickHandler("increase"))
+      }, {
+        default: n(() => [
+          e(o.NmorphIcon, { class: "nmorph-year-month-picker__chevron-right" }, {
+            default: n(() => [
+              e(o.NmorphIconChevronDown)
+            ]),
+            _: 1
+            /* STABLE */
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      })
+    ]),
+    e(o.NmorphDivider),
+    a("div", _, [
+      e(o.NmorphRadioGroup, {
+        modelValue: o.selectedValueModel,
+        "onUpdate:modelValue": r[2] || (r[2] = (t) => o.selectedValueModel = t),
+        options: o.values
+      }, null, 8, ["modelValue", "options"])
+    ])
+  ]);
 }
-const C = /* @__PURE__ */ d(l, [["render", _], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-date-picker/inner-components/nmorph-year-month-picker/NmorphYearMonthPicker.vue"]]);
+const C = /* @__PURE__ */ c(i, [["render", s], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-date-picker/inner-components/nmorph-year-month-picker/NmorphYearMonthPicker.vue"]]);
 export {
   C as default
 };

package/dist/components/form/nmorph-date-picker/inner-components/nmorph-year-month-picker/NmorphYearMonthPicker.vue2.js

@@ -1,52 +1,47 @@
 import './NmorphYearMonthPicker.css';
-import { defineComponent as Y, ref as p, watch as _, computed as c } from "vue";
-import { useModifiers as k } from "../../../../../utils/create-modifiers.js";
-import { useCalendarTexts as C } from "../../../../data/nmorph-calendar/hooks/use-calendar-texts.js";
-import { getDecadeYears as I } from "../../../../data/nmorph-calendar/utils.js";
-import M from "../../../../others/nmorph-divider/NmorphDivider.vue.js";
-import x from "../../../nmorph-radio-group/NmorphRadioGroup.vue.js";
-import w from "../../../../basic/nmorph-icon/NmorphIcon.vue.js";
-import F from "../../../../basic/nmorph-button/NmorphButton.vue.js";
-import H from "../../../../../assets/icons/chevron-down.svg.js";
-const z = /* @__PURE__ */ Y({
+import { defineComponent as S, ref as p, watch as Y, computed as g } from "vue";
+import { useCalendarTexts as _ } from "../../../../data/nmorph-calendar/hooks/use-calendar-texts.js";
+import { getDecadeYears as C } from "../../../../data/nmorph-calendar/utils.js";
+import I from "../../../../others/nmorph-divider/NmorphDivider.vue.js";
+import k from "../../../nmorph-radio-group/NmorphRadioGroup.vue.js";
+import x from "../../../../basic/nmorph-icon/NmorphIcon.vue.js";
+import M from "../../../../basic/nmorph-button/NmorphButton.vue.js";
+import w from "../../../../../assets/icons/chevron-down.svg.js";
+const $ = /* @__PURE__ */ S({
   __name: "NmorphYearMonthPicker",
   props: {
     currentDate: { type: Date, required: !0 },
     type: { type: String, required: !1, default: "month" }
   },
   emits: ["update-year", "update-month", "back-to-years"],
-  setup(f, { expose: g, emit: y }) {
-    g();
-    const { months: m } = C(), d = m.map((t, n) => ({
+  setup(h, { expose: f, emit: y }) {
+    f();
+    const { months: c } = _(), m = c.map((t, o) => ({
       label: t.substring(0, 3),
-      value: String(n),
+      value: String(o),
       tabindex: -1
-    })), e = f, r = p(d), o = p(String(e.currentDate.getMonth())), a = p(e.currentDate.getFullYear()), v = () => {
-      const t = e.currentDate.getFullYear(), n = I(t).map((u) => ({ label: String(u), value: String(u) }));
-      r.value = n;
+    })), e = h, r = p(m), n = p(String(e.currentDate.getMonth())), a = p(e.currentDate.getFullYear()), d = () => {
+      const t = e.currentDate.getFullYear(), o = C(t).map((u) => ({ label: String(u), value: String(u) }));
+      r.value = o;
     };
-    _(
+    Y(
       () => e.currentDate,
       () => {
-        e.type === "year" && (v(), o.value = String(e.currentDate.getFullYear()));
+        e.type === "year" && (d(), n.value = String(e.currentDate.getFullYear()));
       },
       {
         immediate: !0,
         deep: !0
       }
     );
-    const l = y, b = c(
-      () => k({
-        "nmorph-year-month-picker": []
-      })
-    ), D = c({
-      get: () => o.value,
+    const l = y, b = g({
+      get: () => n.value,
       set: (t) => {
-        o.value = t, e.type === "month" ? l("update-month", o.value) : l("update-year", o.value);
+        n.value = t, e.type === "month" ? l("update-month", n.value) : l("update-year", n.value);
       }
     }), s = (t) => {
-      r.value = r.value.map((n) => {
-        const u = String(t === "decrease" ? Number(n.value) - 10 : Number(n.value) + 10);
+      r.value = r.value.map((o) => {
+        const u = String(t === "decrease" ? Number(o.value) - 10 : Number(o.value) + 10);
         return {
           label: u,
           value: u
@@ -54,24 +49,24 @@ const z = /* @__PURE__ */ Y({
       });
     }, i = (t) => {
       t === "decrease" ? a.value = a.value - 1 : a.value = a.value + 1, l("update-year", String(a.value));
-    }, N = (t) => {
+    }, D = (t) => {
       t === "decrease" ? e.type === "year" ? s("decrease") : i("decrease") : e.type === "year" ? s("increase") : i("increase");
-    }, S = c(() => e.type === "year" ? `${r.value[0].label} - ${r.value[r.value.length - 1].label}` : String(a.value)), h = { months: m, initialMonthData: d, props: e, values: r, selectedValue: o, selectedYear: a, setInitialYearsData: v, emit: l, modifiers: b, selectedValueModel: D, updateYearValues: s, updateYear: i, buttonClickHandler: N, value: S, goToYearsHandler: () => {
+    }, N = g(() => e.type === "year" ? `${r.value[0].label} - ${r.value[r.value.length - 1].label}` : String(a.value)), v = { months: c, initialMonthData: m, props: e, values: r, selectedValue: n, selectedYear: a, setInitialYearsData: d, emit: l, selectedValueModel: b, updateYearValues: s, updateYear: i, buttonClickHandler: D, value: N, goToYearsHandler: () => {
       e.type === "month" && l("back-to-years");
     }, get NmorphButton() {
-      return F;
+      return M;
     }, get NmorphIcon() {
-      return w;
-    }, get NmorphRadioGroup() {
       return x;
+    }, get NmorphRadioGroup() {
+      return k;
     }, get NmorphDivider() {
-      return M;
+      return I;
     }, get NmorphIconChevronDown() {
-      return H;
+      return w;
     } };
-    return Object.defineProperty(h, "__isScriptSetup", { enumerable: !1, value: !0 }), h;
+    return Object.defineProperty(v, "__isScriptSetup", { enumerable: !1, value: !0 }), v;
   }
 });
 export {
-  z as default
+  $ as default
 };

package/dist/components/form/nmorph-file-upload/NmorphFileUpload.css

@@ -1 +1 @@
-.nmorph-file-upload{box-sizing:border-box;width:100%;min-width:0}.nmorph-file-upload .nmorph-file-upload__trigger{position:relative;width:100%;min-width:0}.nmorph-file-upload input{display:none}.nmorph-file-upload .nmorph-file-upload__list{width:100%;min-width:0;margin-top:var(--indentation-03)}.nmorph-file-upload .nmorph-file-upload__list>div{box-sizing:border-box;width:100%;min-width:0}.nmorph-file-upload .nmorph-file-upload__file{display:flex;gap:var(--indentation-02);align-items:center;box-sizing:border-box;width:100%;min-width:0;max-width:100%;margin-bottom:var(--indentation-02);padding:var(--indentation-02) var(--indentation-03);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)}.nmorph-file-upload.nmorph-file-upload--compact .nmorph-file-upload__file{padding:var(--indentation-01) var(--indentation-02)}.nmorph-file-upload.nmorph-file-upload--layout-grid .nmorph-file-upload__list>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--indentation-02)}.nmorph-file-upload.nmorph-file-upload--layout-grid .nmorph-file-upload__file{margin-bottom:0}.nmorph-file-upload.nmorph-file-upload--layout-inline .nmorph-file-upload__list>div{display:flex;flex-wrap:wrap;gap:var(--indentation-02)}.nmorph-file-upload.nmorph-file-upload--layout-inline .nmorph-file-upload__file{width:auto;margin-bottom:0}.nmorph-file-upload .nmorph-file-upload__file>.nmorph-image-preview{flex:0 0 auto}.nmorph-file-upload .nmorph-file-upload__file>.nmorph-video-preview,.nmorph-file-upload .nmorph-file-upload__file>.nmorph-audio-preview,.nmorph-file-upload .nmorph-file-upload__file>.nmorph-file-card{flex:1 1 0;min-width:0}.nmorph-file-upload .nmorph-file-upload__file-info{display:flex;flex:1 1 0;gap:var(--indentation-02);align-items:center;min-width:0;max-width:100%;overflow:hidden}.nmorph-file-upload .nmorph-file-upload__file-info>.nmorph-icon{flex:0 0 auto}.nmorph-file-upload .nmorph-file-upload__file-name{display:block;flex:1 1 0;width:var(--nmorph-file-upload-name-width, auto);min-width:0;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.nmorph-file-upload .nmorph-file-upload__remove-file{flex:0 0 auto}
+.nmorph-file-upload{box-sizing:border-box;width:100%;min-width:0}.nmorph-file-upload .nmorph-file-upload__trigger{position:relative;width:100%;min-width:0}.nmorph-file-upload input{display:none}.nmorph-file-upload .nmorph-file-upload__list{width:100%;min-width:0;margin-top:var(--indentation-03)}.nmorph-file-upload .nmorph-file-upload__list>div{box-sizing:border-box;width:100%;min-width:0}.nmorph-file-upload .nmorph-file-upload__file{display:flex;gap:var(--indentation-02);align-items:center;box-sizing:border-box;width:100%;min-width:0;max-width:100%;margin-bottom:var(--indentation-02);padding:var(--indentation-02) var(--indentation-03);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)}.nmorph-file-upload.nmorph-file-upload--compact .nmorph-file-upload__file{padding:var(--indentation-01) var(--indentation-02)}.nmorph-file-upload.nmorph-file-upload--layout-grid .nmorph-file-upload__list>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--indentation-02)}.nmorph-file-upload.nmorph-file-upload--layout-grid .nmorph-file-upload__file{margin-bottom:0}.nmorph-file-upload.nmorph-file-upload--layout-inline .nmorph-file-upload__list>div{display:flex;flex-wrap:wrap;gap:var(--indentation-02)}.nmorph-file-upload.nmorph-file-upload--layout-inline .nmorph-file-upload__file{width:auto;margin-bottom:0}.nmorph-file-upload .nmorph-file-upload__file>.nmorph-image-preview{flex:0 0 auto}.nmorph-file-upload .nmorph-file-upload__file>.nmorph-video-preview,.nmorph-file-upload .nmorph-file-upload__file>.nmorph-audio-preview,.nmorph-file-upload .nmorph-file-upload__file>.nmorph-file-card{flex:1 1 0;min-width:0}.nmorph-file-upload .nmorph-file-upload__file-info{display:flex;flex:1 1 0;gap:var(--indentation-02);align-items:center;min-width:0;max-width:100%;overflow:hidden}.nmorph-file-upload .nmorph-file-upload__file-info>.nmorph-icon{flex:0 0 auto}.nmorph-file-upload .nmorph-file-upload__file-name{display:block;flex:1 1 0;width:var(--nmorph-private-file-upload-name-width, auto);min-width:0;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.nmorph-file-upload .nmorph-file-upload__remove-file{flex:0 0 auto}

package/dist/components/form/nmorph-file-upload/NmorphFileUpload.vue.js

@@ -1,6 +1,6 @@
 import './NmorphFileUpload.css';
 import h from "./NmorphFileUpload.vue2.js";
-import { openBlock as i, createElementBlock as r, normalizeStyle as p, normalizeClass as _, createElementVNode as m, renderSlot as f, createVNode as n, TransitionGroup as y, withCtx as a, Fragment as c, renderList as g, toDisplayString as d, createBlock as t, createCommentVNode as x } from "vue";
+import { openBlock as i, createElementBlock as r, normalizeStyle as p, normalizeClass as _, createElementVNode as m, renderSlot as f, createVNode as n, TransitionGroup as g, withCtx as a, Fragment as t, renderList as y, toDisplayString as d, createBlock as c, createCommentVNode as x } from "vue";
 /* empty css                      */
 import N from "../../../_virtual/_plugin-vue_export-helper.js";
 const k = { class: "nmorph-file-upload__trigger" }, v = ["id", "name", "autocomplete", "tabindex", "multiple", "disabled", "accept"], u = {
@@ -42,20 +42,20 @@ function B(s, z, V, e, P, S) {
         ])
       ]),
       e.files.length > 0 ? (i(), r("div", u, [
-        n(y, {
+        n(g, {
           name: "list",
           tag: "div"
         }, {
           default: a(() => [
             (i(!0), r(
-              c,
+              t,
               null,
-              g(e.files, ({ data: o, previewUrl: l }) => (i(), r("div", {
+              y(e.files, ({ data: o, previewUrl: l }) => (i(), r("div", {
                 key: o.name,
                 class: "nmorph-file-upload__file"
               }, [
                 e.showImagePreview(o) ? (i(), r(
-                  c,
+                  t,
                   { key: 0 },
                   [
                     n(e.NmorphImagePreview, { src: l }, null, 8, ["src"]),
@@ -99,20 +99,20 @@ function B(s, z, V, e, P, S) {
                     1
                     /* TEXT */
                   )
-                ])) : e.isVideoFile(o) ? (i(), t(e.NmorphVideoPreview, {
+                ])) : e.isVideoFile(o) ? (i(), c(e.NmorphVideoPreview, {
                   key: 2,
                   src: l,
                   name: o.name,
                   "download-href": l,
                   compact: "",
                   controls: ""
-                }, null, 8, ["src", "name", "download-href"])) : e.isAudioFile(o) ? (i(), t(e.NmorphAudioPreview, {
+                }, null, 8, ["src", "name", "download-href"])) : e.isAudioFile(o) ? (i(), c(e.NmorphAudioPreview, {
                   key: 3,
                   src: l,
                   name: o.name,
                   "download-href": l,
                   compact: ""
-                }, null, 8, ["src", "name", "download-href"])) : (i(), t(e.NmorphFileCard, {
+                }, null, 8, ["src", "name", "download-href"])) : (i(), c(e.NmorphFileCard, {
                   key: 4,
                   name: o.name,
                   "mime-type": o.type,
@@ -124,8 +124,8 @@ function B(s, z, V, e, P, S) {
                 }, null, 8, ["name", "mime-type", "size", "extension", "preview-src", "download-href"])),
                 m("div", C, [
                   n(e.NmorphButton, {
-                    height: "thin",
-                    "style-type": "transparent",
+                    design: "plain",
+                    thickness: "thin",
                     onClick: (A) => e.removeFile(o.name)
                   }, {
                     "icon-only": a(() => [

package/dist/components/form/nmorph-file-upload/NmorphFileUpload.vue2.js

@@ -104,7 +104,7 @@ const xe = /* @__PURE__ */ D({
       })
     ), W = y(
       () => J({
-        "--nmorph-file-upload-name-width": t.fileNameWidth
+        "--nmorph-private-file-upload-name-width": t.fileNameWidth
       })
     ), P = { t: I, props: t, emit: m, computedButtonText: B, id: p, name: R, autocomplete: T, tabindex: C, modelValue: F, updateModelValue: b, formData: c, inputAccept: E, showImagePreview: j, inputDOMRef: n, files: a, createdPreviewUrls: l, resetInputValue: f, revokePreviewUrl: v, revokeRemovedPreviewUrls: w, filesChanged: N, getFormValidationResult: x, openFileSelector: k, handleFileUpload: L, removeFile: M, modifiers: O, styles: W, get NmorphAudioPreview() {
       return ne;

package/dist/components/form/nmorph-file-upload/types.js

@@ -1,26 +1,44 @@
-var p = /* @__PURE__ */ ((a) => (a.jpeg = "image/jpeg", a.jpg = "image/jpg", a.png = "image/png", a.gif = "image/gif", a["svg-xml"] = "image/svg+xml", a.webp = "image/webp", a))(p || {});
-const g = {
+const o = {
+  jpeg: "image/jpeg",
+  jpg: "image/jpg",
+  png: "image/png",
+  gif: "image/gif",
+  "svg-xml": "image/svg+xml",
+  webp: "image/webp"
+}, p = {
   mp4: "video/mp4",
   webm: "video/webm",
-  "video-ogg": "video/ogg",
-  /**
-   * @deprecated Use `video-ogg` instead.
-   */
-  "wideo-ogg": "video/ogg"
-};
-var i = /* @__PURE__ */ ((a) => (a.mpeg = "audio/mpeg", a["audio-ogg"] = "audio/ogg", a.wav = "audio/wav", a))(i || {}), e = /* @__PURE__ */ ((a) => (a.pdf = "application/pdf", a.msword = "application/msword", a.docx = "application/vnd.openxmlformats-officedocument.wordprocessingml.document", a.xls = "application/vnd.ms-excel", a.xlsx = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", a.ppt = "application/vnd.ms-powerpoint", a.pptx = "application/vnd.openxmlformats-officedocument.presentationml.presentation", a.json = "application/json", a.xml = "application/xml", a))(e || {}), d = /* @__PURE__ */ ((a) => (a.zip = "application/zip", a.rar = "application/x-rar-compressed", a["7z"] = "application/x-7z-compressed", a))(d || {});
-const n = {
+  "video-ogg": "video/ogg"
+}, i = {
+  mpeg: "audio/mpeg",
+  "audio-ogg": "audio/ogg",
+  wav: "audio/wav"
+}, e = {
+  pdf: "application/pdf",
+  msword: "application/msword",
+  docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+  xls: "application/vnd.ms-excel",
+  xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+  ppt: "application/vnd.ms-powerpoint",
+  pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
+  json: "application/json",
+  xml: "application/xml"
+}, n = {
+  zip: "application/zip",
+  rar: "application/x-rar-compressed",
+  "7z": "application/x-7z-compressed"
+}, a = {
+  ...o,
   ...p,
-  ...g,
   ...i,
   ...e,
-  ...d
+  ...n
 };
 export {
-  d as NmorphArchiveResolution,
+  n as NmorphArchiveResolution,
   i as NmorphAudioResolution,
   e as NmorphDocResolution,
-  p as NmorphImageResolution,
-  g as NmorphVideoResolution,
-  n as resolution
+  o as NmorphImageResolution,
+  p as NmorphVideoResolution,
+  a as resolution
 };

package/dist/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.css

@@ -1 +1 @@
-.nmorph-form-item{min-width:0;max-width:100%;margin:var(--indentation-04) var(--indentation-00)}.nmorph-form-item label{font-weight:600;font-size:var(--font-size-small);line-height:var(--line-height-loose)}.nmorph-form-item .nmorph-form-item__content{position:relative;display:flex;align-items:center;width:100%;min-width:0;max-width:100%}.nmorph-form-item.nmorph-form-item--labeled .nmorph-form-item__content{margin-top:var(--indentation-02)}.nmorph-form-item.nmorph-form-item--valid .nmorph-native-input:focus{background:var(--nmorph-success-color)}.nmorph-form-item.nmorph-form-item--invalid .nmorph-native-input:focus{background:var(--nmorph-error-text-color)}
+.nmorph-form-item{min-width:0;max-width:100%;margin:var(--indentation-04) var(--indentation-00)}.nmorph-form-item label{font-weight:var(--nmorph-typography-label-font-weight);font-size:var(--nmorph-typography-label-font-size);line-height:var(--nmorph-typography-label-line-height)}.nmorph-form-item .nmorph-form-item__content{position:relative;display:flex;align-items:center;width:100%;min-width:0;max-width:100%}.nmorph-form-item.nmorph-form-item--labeled .nmorph-form-item__content{margin-top:var(--indentation-02)}.nmorph-form-item.nmorph-form-item--valid .nmorph-native-input:focus{background:var(--nmorph-success-color)}.nmorph-form-item.nmorph-form-item--invalid .nmorph-native-input:focus{background:var(--nmorph-error-text-color)}

package/dist/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue.js

@@ -1,39 +1,39 @@
 import './NmorphFormItem.css';
 import n from "./NmorphFormItem.vue2.js";
-import { openBlock as r, createElementBlock as e, normalizeClass as l, toDisplayString as m, createCommentVNode as t, createElementVNode as c, renderSlot as s, createBlock as h, createVNode as d } from "vue";
+import { openBlock as r, createElementBlock as e, normalizeClass as s, toDisplayString as l, createCommentVNode as t, createElementVNode as m, renderSlot as c, createBlock as d, createVNode as h } from "vue";
 /* empty css                    */
 import p from "../../../../../_virtual/_plugin-vue_export-helper.js";
 const f = ["for"], _ = { class: "nmorph-form-item__content" };
-function v(i, N, a, o, g, k) {
+function v(i, k, a, o, N, B) {
   return r(), e(
     "div",
     {
-      class: l(o.modifiers)
+      class: s(o.modifiers)
     },
     [
       o.props.label ? (r(), e("label", {
         key: 0,
         for: o.props.id
-      }, m(o.props.label), 9, f)) : t("v-if", !0),
-      c("div", _, [
-        s(i.$slots, "default"),
-        o.props.showValidationIcon ? (r(), h(o.NmorphValidationIcon, {
+      }, l(o.props.label), 9, f)) : t("v-if", !0),
+      m("div", _, [
+        c(i.$slots, "default"),
+        o.props.showValidationIcon ? (r(), d(o.NmorphValidationIcon, {
           key: 0,
           valid: !!o.validationData?.valid,
           show: o.showStatusIcon
         }, null, 8, ["valid", "show"])) : t("v-if", !0)
       ]),
-      d(o.NmorphErrorBox, {
+      h(o.NmorphErrorBox, {
         errors: o.validationData?.errors,
-        height: o.props.height,
+        thickness: o.props.thickness,
         "static-height": a.staticErrorBoxSpace
-      }, null, 8, ["errors", "height", "static-height"])
+      }, null, 8, ["errors", "thickness", "static-height"])
     ],
     2
     /* CLASS */
   );
 }
-const w = /* @__PURE__ */ p(n, [["render", v], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue"]]);
+const x = /* @__PURE__ */ p(n, [["render", v], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue"]]);
 export {
-  w as default
+  x as default
 };

package/dist/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue2.js

@@ -1,8 +1,8 @@
 import './NmorphFormItem.css';
 import { defineComponent as y, inject as S, computed as e, unref as d, provide as b, toRef as I } from "vue";
-import { useModifiers as g } from "../../../../../utils/create-modifiers.js";
-import q from "./inner-components/nmorph-error-box/NmorphErrorBox.vue.js";
-import B from "./inner-components/nmorph-validation-icon/NmorphValidationIcon.vue.js";
+import { useModifiers as q } from "../../../../../utils/create-modifiers.js";
+import B from "./inner-components/nmorph-error-box/NmorphErrorBox.vue.js";
+import g from "./inner-components/nmorph-validation-icon/NmorphValidationIcon.vue.js";
 import { nmorphFormItemInputDataKey as x } from "../../use-form-item-input.js";
 const T = /* @__PURE__ */ y({
   __name: "NmorphFormItem",
@@ -10,7 +10,7 @@ const T = /* @__PURE__ */ y({
     id: { type: String, required: !0 },
     name: { type: String, required: !1, default: "" },
     autocomplete: { type: String, required: !1, default: "" },
-    height: { type: null, required: !1, default: "basic" },
+    thickness: { type: null, required: !1, default: "basic" },
     label: { type: String, required: !1, default: "" },
     showValidationIcon: { type: Boolean, required: !1, default: !0 },
     staticErrorBoxSpace: { type: Boolean, required: !1, default: !1 }
@@ -35,16 +35,16 @@ const T = /* @__PURE__ */ y({
       }
     });
     const _ = e(
-      () => g({
+      () => q({
         "nmorph-form-item": [
           o.label && "labeled",
           m.value && (a.value?.valid ? "valid" : "invalid")
         ]
       })
     ), c = { props: o, formData: t, validationData: a, fieldData: r, fieldValue: u, fieldRules: n, fieldErrors: s, fieldValid: f, fieldTouched: p, ableToShowValidation: l, showStatusIcon: V, ableToAddValidationModifiers: m, modifiers: _, get NmorphValidationIcon() {
-      return B;
+      return g;
     }, get NmorphErrorBox() {
-      return q;
+      return B;
     } };
     return Object.defineProperty(c, "__isScriptSetup", { enumerable: !1, value: !0 }), c;
   }

package/dist/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-error-box/NmorphErrorBox.vue2.js

@@ -1,22 +1,22 @@
 import './NmorphErrorBox.css';
 import { defineComponent as p, computed as s } from "vue";
 import { useModifiers as u } from "../../../../../../../utils/create-modifiers.js";
-import { NmorphComponentHeight as l } from "../../../../../../../types/common.types.js";
+import { NmorphComponentThickness as c } from "../../../../../../../types/common.types.js";
 const h = /* @__PURE__ */ p({
   __name: "NmorphErrorBox",
   props: {
-    height: { type: null, required: !1, default: "basic" },
+    thickness: { type: null, required: !1, default: "basic" },
     errors: { type: [Array, Object], required: !1, default: () => [] },
     staticHeight: { type: Boolean, required: !1, default: !1 }
   },
-  setup(i, { expose: n }) {
-    n();
-    const e = i, t = s(() => {
+  setup(n, { expose: i }) {
+    i();
+    const e = n, t = s(() => {
       const r = Array.isArray(e.errors) ? e.errors : e.errors.value;
       return r.length ? [r[r.length - 1]] : [];
     }), a = s(
       () => u({
-        nmorph: [l[e.height]],
+        nmorph: [c[e.thickness]],
         "nmorph-error-box": [e.staticHeight && "static-height", t.value.length === 0 && "empty"]
       })
     ), o = { props: e, currentError: t, modifiers: a };

package/dist/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-validation-icon/NmorphValidationIcon.css

@@ -1 +1 @@
-.nmorph-validation-icon{width:var(--nmorph-validation-icon-size);margin-left:var(--indentation-03)}.nmorph-validation-icon.nmorph-validation-icon--valid .nmorph-validation-icon__content{--color: var(--nmorph-success-color)}.nmorph-validation-icon.nmorph-validation-icon--invalid .nmorph-validation-icon__content{--color: var(--nmorph-error-text-color)}
+.nmorph-validation-icon{width:18px;margin-left:var(--indentation-03)}.nmorph-validation-icon.nmorph-validation-icon--valid .nmorph-validation-icon__content{--nmorph-private-icon-color: var(--nmorph-success-color)}.nmorph-validation-icon.nmorph-validation-icon--invalid .nmorph-validation-icon__content{--nmorph-private-icon-color: var(--nmorph-error-text-color)}

package/dist/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-validation-icon/NmorphValidationIcon.vue.js

@@ -1,34 +1,33 @@
 import './NmorphValidationIcon.css';
 import r from "./NmorphValidationIcon.vue2.js";
-import { openBlock as n, createElementBlock as t, normalizeStyle as a, normalizeClass as c, createBlock as i, withCtx as m, resolveDynamicComponent as l, createCommentVNode as d } from "vue";
+import { openBlock as n, createElementBlock as t, normalizeClass as a, createBlock as e, withCtx as c, resolveDynamicComponent as m, createCommentVNode as l } from "vue";
 /* empty css                          */
-import s from "../../../../../../../_virtual/_plugin-vue_export-helper.js";
-function p(f, h, e, o, _, v) {
+import d from "../../../../../../../_virtual/_plugin-vue_export-helper.js";
+function p(s, f, i, o, h, _) {
   return n(), t(
     "div",
     {
-      class: c(o.modifiers),
-      style: a({ "--nmorph-validation-icon-size": o.validateIconSize })
+      class: a(o.modifiers)
     },
     [
-      e.show ? (n(), i(o.NmorphIcon, {
+      i.show ? (n(), e(o.NmorphIcon, {
         key: 0,
         class: "nmorph-validation-icon__content",
         width: o.validateIconSize,
         height: o.validateIconSize
       }, {
-        default: m(() => [
-          (n(), i(l(o.validationIcon)))
+        default: c(() => [
+          (n(), e(m(o.validationIcon)))
         ]),
         _: 1
         /* STABLE */
-      })) : d("v-if", !0)
+      })) : l("v-if", !0)
     ],
-    6
-    /* CLASS, STYLE */
+    2
+    /* CLASS */
   );
 }
-const x = /* @__PURE__ */ s(r, [["render", p], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-validation-icon/NmorphValidationIcon.vue"]]);
+const C = /* @__PURE__ */ d(r, [["render", p], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-validation-icon/NmorphValidationIcon.vue"]]);
 export {
-  x as default
+  C as default
 };

package/dist/components/form/nmorph-number-input/NmorphNumberInput.css

@@ -1 +1 @@
-.nmorph-number-input{display:inline-flex;flex-direction:column;align-items:flex-start}.nmorph-number-input .nmorph-number-input__content{display:flex;align-items:center;width:100%}.nmorph-number-input .nmorph-number-input__input-content{display:flex;width:100%;height:var(--height);height:100%;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)}.nmorph-number-input .nmorph-number-input__decrease .nmorph-button__content{border-top-right-radius:0;border-bottom-right-radius:0}.nmorph-number-input .nmorph-number-input__increase .nmorph-button__content{border-top-left-radius:0;border-bottom-left-radius:0}.nmorph-number-input input{width:auto;width:100%;padding:var(--indentation-00) var(--default-indentation-input);text-align:center;background:var(--nmorph-main-color);border:none;border-top:1px solid var(--nmorph-main-color);border-bottom:1px solid 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);transition:ease-in-out var(--transition-01) background;transition:background 0s;appearance:textfield}.nmorph-number-input input:focus{background:var(--nmorph-accent-color);outline:none}.nmorph-number-input input::-webkit-inner-spin-button,.nmorph-number-input input::-webkit-outer-spin-button{margin:0;appearance:none}.nmorph-number-input .nmorph-number-input__action-btns{display:flex;flex-direction:column}.nmorph-number-input.nmorph-number-input--disabled{cursor:not-allowed;opacity:.6}.nmorph-number-input.nmorph-number-input--disabled .nmorph-number-input__input-content{pointer-events:none}.nmorph-number-input.nmorph-number-input--action-btn-position-right input{border-top-left-radius:var(--default-border-radius);border-bottom-left-radius:var(--default-border-radius)}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__decrease,.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__increase{display:flex;justify-content:center;width:100%}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__increase .nmorph-button__content{border-radius:0;border-top-right-radius:var(--default-border-radius)}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__decrease .nmorph-button__content{border-radius:0;border-bottom-right-radius:var(--default-border-radius)}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-button{--height: var(--nmorph-number-input-right-action-height);width:100%}
+.nmorph-number-input{display:inline-flex;flex-direction:column;align-items:flex-start}.nmorph-number-input .nmorph-number-input__content{display:flex;align-items:center;width:100%}.nmorph-number-input .nmorph-number-input__input-content{display:flex;width:100%;height:var(--nmorph-private-control-height);height:100%;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)}.nmorph-number-input .nmorph-number-input__decrease .nmorph-button__content{border-top-right-radius:0;border-bottom-right-radius:0}.nmorph-number-input .nmorph-number-input__increase .nmorph-button__content{border-top-left-radius:0;border-bottom-left-radius:0}.nmorph-number-input .nmorph-button.nmorph-button--plain .nmorph-button__content{background:transparent;border:none;outline:none;box-shadow:none}.nmorph-number-input .nmorph-button.nmorph-button--plain .nmorph-button__content:not(:disabled,[loading=true]):hover,.nmorph-number-input .nmorph-button.nmorph-button--plain .nmorph-button__content:focus,.nmorph-number-input .nmorph-button.nmorph-button--plain .nmorph-button__content:focus-visible{background:transparent;border:none;outline:none;box-shadow:none}.nmorph-number-input input{width:auto;width:100%;padding:var(--nmorph-private-control-text-offset-y) var(--default-indentation-input) 0;line-height:calc(var(--nmorph-private-control-height) - var(--nmorph-private-control-text-offset-y));text-align:center;background:var(--nmorph-main-color);border:none;border-top:1px solid var(--nmorph-main-color);border-bottom:1px solid 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);transition:ease-in-out var(--transition-01) background;transition:background 0s;appearance:textfield}.nmorph-number-input input:focus{background:var(--nmorph-accent-color);outline:none}.nmorph-number-input input::-webkit-inner-spin-button,.nmorph-number-input input::-webkit-outer-spin-button{margin:0;appearance:none}.nmorph-number-input .nmorph-number-input__action-btns{display:flex;flex-direction:column;align-self:stretch;width:var(--nmorph-private-control-height);min-width:var(--nmorph-private-control-height);overflow:hidden;border-top-right-radius:var(--default-border-radius);border-bottom-right-radius:var(--default-border-radius)}.nmorph-number-input .nmorph-number-input__plus-icon{transform:translateY(1px)}.nmorph-number-input.nmorph-number-input--disabled{cursor:not-allowed;opacity:.6}.nmorph-number-input.nmorph-number-input--disabled .nmorph-number-input__input-content{pointer-events:none}.nmorph-number-input.nmorph-number-input--action-btn-position-right input{border-top-left-radius:var(--default-border-radius);border-bottom-left-radius:var(--default-border-radius)}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__decrease,.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__increase{display:flex;flex:1 1 0;justify-content:center;align-items:center;width:100%;min-height:0}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__increase .nmorph-button__content{border-radius:0;border-top-right-radius:var(--default-border-radius)}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__decrease .nmorph-button__content{border-radius:0;border-bottom-right-radius:var(--default-border-radius)}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-button{--nmorph-private-control-height: var(--nmorph-private-number-input-right-action-height);display:flex;width:100%;height:100%;min-height:0}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-button__content{width:100%;height:100%;min-height:0;padding:0}.nmorph-number-input.nmorph-number-input--action-btn-position-right .nmorph-number-input__plus-icon{transform:translateY(2px)}