@nmorph/nmorph-ui-kit 2.2.53 → 2.2.55

package/dist/components/data/nmorph-preview-portal/NmorphPreviewPortal.vue.js

@@ -1,114 +1,110 @@
 import './NmorphPreviewPortal.css';
-import v from "./NmorphPreviewPortal.vue2.js";
-import { openBlock as l, createBlock as c, Teleport as f, createElementVNode as m, normalizeStyle as h, normalizeClass as n, createVNode as e, withCtx as t, renderSlot as d, createElementBlock as s, createCommentVNode as i } from "vue";
-/* empty css                         */
-import w from "../../../_virtual/_plugin-vue_export-helper.js";
-function N(p, r, C, o, _, k) {
-  return o.props.show ? (l(), c(f, {
-    key: 0,
-    to: "body"
-  }, [
-    m(
-      "div",
-      {
-        class: n(o.rootClasses),
-        style: h(o.portalStyle)
-      },
-      [
-        e(o.NmorphOverlay, {
-          show: o.props.show,
-          "z-index": o.props.zIndex,
+import { defineComponent as k, computed as u, openBlock as r, createBlock as B, Teleport as $, createElementVNode as f, normalizeStyle as N, normalizeClass as a, createVNode as o, unref as s, withCtx as l, renderSlot as v, createElementBlock as m, createCommentVNode as i } from "vue";
+import { createCssSizeVariables as x } from "../../../utils/common.js";
+import z from "../../others/nmorph-overlay/NmorphOverlay.vue.js";
+/* empty css                                             */
+import c from "../../basic/nmorph-button/NmorphButton.vue.js";
+/* empty css                                          */
+import w from "../../basic/nmorph-icon/NmorphIcon.vue.js";
+/* empty css                                      */
+import C from "../../../assets/icons/chevron-down.svg.js";
+const D = /* @__PURE__ */ k({
+  __name: "NmorphPreviewPortal",
+  props: {
+    show: { type: Boolean },
+    zIndex: { default: void 0 },
+    rootClass: { default: "" },
+    stateClass: { default: "" },
+    contentClass: { default: "" },
+    leftClass: { default: "" },
+    rightClass: { default: "" },
+    actionsClass: { default: "" },
+    navigationButtonMargin: { default: void 0 },
+    showNavigation: { type: Boolean, default: !1 },
+    showActionBar: { type: Boolean, default: !1 }
+  },
+  emits: ["close", "previous", "next"],
+  setup(h, { emit: _ }) {
+    const e = h, n = _, y = u(() => [
+      "nmorph-preview-portal",
+      e.rootClass,
+      e.stateClass,
+      e.show && "nmorph-preview-portal--opened"
+    ]), g = u(
+      () => x({
+        "--nmorph-preview-portal-btn-margin": e.navigationButtonMargin
+      })
+    );
+    return (d, t) => e.show ? (r(), B($, {
+      key: 0,
+      to: "body"
+    }, [
+      f("div", {
+        class: a(y.value),
+        style: N(g.value)
+      }, [
+        o(s(z), {
+          show: e.show,
+          "z-index": e.zIndex,
           "disabled-teleport": "",
-          onOnOutsideClick: r[2] || (r[2] = (a) => o.emit("close")),
-          onOnEscapeKeydown: r[3] || (r[3] = (a) => o.emit("close"))
+          onOnOutsideClick: t[2] || (t[2] = (p) => n("close")),
+          onOnEscapeKeydown: t[3] || (t[3] = (p) => n("close"))
         }, {
-          default: t(() => [
-            m(
-              "div",
-              {
-                class: n(["nmorph-preview-portal__content", o.props.contentClass])
-              },
-              [
-                d(p.$slots, "default")
-              ],
-              2
-              /* CLASS */
-            ),
-            o.props.showNavigation ? (l(), s(
-              "div",
-              {
-                key: 0,
-                class: n(["nmorph-preview-portal__left", o.props.leftClass])
-              },
-              [
-                e(o.NmorphButton, {
-                  onClick: r[0] || (r[0] = (a) => o.emit("previous"))
-                }, {
-                  default: t(() => [
-                    e(o.NmorphIcon, null, {
-                      default: t(() => [
-                        e(o.NmorphIconChevronDown)
-                      ]),
-                      _: 1
-                      /* STABLE */
-                    })
-                  ]),
-                  _: 1
-                  /* STABLE */
-                })
-              ],
-              2
-              /* CLASS */
-            )) : i("v-if", !0),
-            o.props.showNavigation ? (l(), s(
-              "div",
-              {
-                key: 1,
-                class: n(["nmorph-preview-portal__right", o.props.rightClass])
-              },
-              [
-                e(o.NmorphButton, {
-                  onClick: r[1] || (r[1] = (a) => o.emit("next"))
-                }, {
-                  default: t(() => [
-                    e(o.NmorphIcon, null, {
-                      default: t(() => [
-                        e(o.NmorphIconChevronDown)
-                      ]),
-                      _: 1
-                      /* STABLE */
-                    })
-                  ]),
-                  _: 1
-                  /* STABLE */
-                })
-              ],
-              2
-              /* CLASS */
-            )) : i("v-if", !0),
-            o.props.showActionBar ? (l(), s(
-              "div",
-              {
-                key: 2,
-                class: n(["nmorph-preview-portal__actions", o.props.actionsClass])
-              },
-              [
-                d(p.$slots, "actions")
-              ],
-              2
-              /* CLASS */
-            )) : i("v-if", !0)
+          default: l(() => [
+            f("div", {
+              class: a(["nmorph-preview-portal__content", e.contentClass])
+            }, [
+              v(d.$slots, "default")
+            ], 2),
+            e.showNavigation ? (r(), m("div", {
+              key: 0,
+              class: a(["nmorph-preview-portal__left", e.leftClass])
+            }, [
+              o(s(c), {
+                onClick: t[0] || (t[0] = (p) => n("previous"))
+              }, {
+                default: l(() => [
+                  o(s(w), null, {
+                    default: l(() => [
+                      o(s(C))
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ], 2)) : i("", !0),
+            e.showNavigation ? (r(), m("div", {
+              key: 1,
+              class: a(["nmorph-preview-portal__right", e.rightClass])
+            }, [
+              o(s(c), {
+                onClick: t[1] || (t[1] = (p) => n("next"))
+              }, {
+                default: l(() => [
+                  o(s(w), null, {
+                    default: l(() => [
+                      o(s(C))
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ], 2)) : i("", !0),
+            e.showActionBar ? (r(), m("div", {
+              key: 2,
+              class: a(["nmorph-preview-portal__actions", e.actionsClass])
+            }, [
+              v(d.$slots, "actions")
+            ], 2)) : i("", !0)
           ]),
           _: 3
-          /* FORWARDED */
         }, 8, ["show", "z-index"])
-      ],
-      6
-      /* CLASS, STYLE */
-    )
-  ])) : i("v-if", !0);
-}
-const I = /* @__PURE__ */ w(v, [["render", N], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-preview-portal/NmorphPreviewPortal.vue"]]);
+      ], 6)
+    ])) : i("", !0);
+  }
+});
 export {
-  I as default
+  D as default
 };

package/dist/components/data/nmorph-preview-portal/NmorphPreviewPortal.vue3.js

@@ -0,0 +1,6 @@
+import './NmorphPreviewPortal.css';
+import o from "./NmorphPreviewPortal.vue.js";
+/* empty css                         */
+export {
+  o as default
+};

package/dist/components/data/nmorph-progress/NmorphProgress.vue.js

@@ -1,84 +1,100 @@
 import './NmorphProgress.css';
-import _ from "./NmorphProgress.vue2.js";
-import { openBlock as e, createElementBlock as s, normalizeStyle as d, normalizeClass as p, createElementVNode as o, renderSlot as c, createTextVNode as n, toDisplayString as a, createCommentVNode as i } from "vue";
-/* empty css                    */
-import h from "../../../_virtual/_plugin-vue_export-helper.js";
-const m = {
+import { defineComponent as z, computed as r, ref as m, onMounted as $, openBlock as t, createElementBlock as o, normalizeStyle as C, normalizeClass as V, createElementVNode as a, renderSlot as p, createTextVNode as u, toDisplayString as h, createCommentVNode as c } from "vue";
+import { useModifiers as w } from "../../../utils/create-modifiers.js";
+import { createCssSizeVariables as x, createCssVariables as A } from "../../../utils/common.js";
+const B = {
   key: 0,
   class: "nmorph-progress__linear"
-}, g = { class: "nmorph-progress__outer" }, f = { class: "nmorph-progress__inner" }, y = {
+}, N = { class: "nmorph-progress__outer" }, b = { class: "nmorph-progress__inner" }, D = {
   key: 0,
   class: "nmorph-progress__inner-text"
-}, v = {
+}, I = {
   key: 0,
   class: "nmorph-progress__percentage"
-}, k = {
+}, M = {
   key: 1,
   class: "nmorph-progress__circle"
-}, S = { class: "nmorph-progress__circle-inner-part" }, z = ["width", "height"], x = ["cx", "cy", "r", "stroke-dasharray", "stroke-dashoffset"];
-function N(t, P, l, r, D, V) {
-  return e(), s(
-    "div",
-    {
-      class: p(r.modifiers),
-      style: d(r.styles)
-    },
-    [
-      r.props.type === "linear" ? (e(), s("div", m, [
-        o("div", g, [
-          o("div", f, [
-            l.valueInside ? (e(), s("div", y, [
-              c(t.$slots, "inner-text", {}, () => [
-                n(
-                  a(r.displayPercentage),
-                  1
-                  /* TEXT */
-                )
+}, P = { class: "nmorph-progress__circle-inner-part" }, T = ["width", "height"], E = ["cx", "cy", "r", "stroke-dasharray", "stroke-dashoffset"], G = /* @__PURE__ */ z({
+  __name: "NmorphProgress",
+  props: {
+    type: { default: "linear" },
+    color: { type: [String, Array, Function], default: "var(--nmorph-accent-color)" },
+    percentage: {},
+    valueInside: { type: Boolean, default: !1 },
+    valueRightSide: { type: Boolean, default: !0 },
+    indeterminate: { type: Boolean, default: !1 },
+    circleSize: { default: 120 },
+    height: { default: void 0 },
+    widthTransition: { default: void 0 },
+    indeterminateAnimation: { default: void 0 }
+  },
+  setup(l) {
+    const e = l, v = r(
+      () => w({
+        "nmorph-progress": []
+      })
+    ), f = r(() => Array.isArray(e.color) ? e.color.find((i) => i.percentage <= e.percentage)?.color : typeof e.color == "function" ? e.color(e.percentage) : e.color), g = r(() => e.indeterminate ? "var(--animation)" : "none"), d = m(null), s = m(1), _ = r(() => `${s.value} ${s.value}`), y = r(() => s.value - e.percentage / 100 * s.value);
+    $(() => {
+      d.value && (s.value = 2 * Math.PI * d.value.r.baseVal.value);
+    });
+    const S = r(() => `${e.circleSize}px`), n = r(() => `${e.percentage}%`), k = r(() => ({
+      ...A({
+        "--nmorph-progress-percentage": n.value,
+        "--nmorph-progress-color": f.value,
+        "--nmorph-progress-animation": g.value,
+        "--nmorph-progress-circle-size": S.value,
+        "--width-transition": e.widthTransition,
+        "--animation": e.indeterminateAnimation
+      }),
+      ...x({
+        "--height": e.height
+      })
+    }));
+    return (i, R) => (t(), o("div", {
+      class: V(v.value),
+      style: C(k.value)
+    }, [
+      e.type === "linear" ? (t(), o("div", B, [
+        a("div", N, [
+          a("div", b, [
+            l.valueInside ? (t(), o("div", D, [
+              p(i.$slots, "inner-text", {}, () => [
+                u(h(n.value), 1)
               ])
-            ])) : i("v-if", !0)
+            ])) : c("", !0)
           ])
         ]),
-        l.valueRightSide ? (e(), s("div", v, [
-          c(t.$slots, "right-side", {}, () => [
-            n(
-              a(r.displayPercentage),
-              1
-              /* TEXT */
-            )
+        l.valueRightSide ? (t(), o("div", I, [
+          p(i.$slots, "right-side", {}, () => [
+            u(h(n.value), 1)
           ])
-        ])) : i("v-if", !0)
-      ])) : i("v-if", !0),
-      r.props.type === "circle" ? (e(), s("div", k, [
-        o("div", S, [
-          c(t.$slots, "circle-inner-part", {}, () => [
-            n(
-              a(r.displayPercentage),
-              1
-              /* TEXT */
-            )
+        ])) : c("", !0)
+      ])) : c("", !0),
+      e.type === "circle" ? (t(), o("div", M, [
+        a("div", P, [
+          p(i.$slots, "circle-inner-part", {}, () => [
+            u(h(n.value), 1)
           ])
         ]),
-        (e(), s("svg", {
-          width: r.props.circleSize,
-          height: r.props.circleSize
+        (t(), o("svg", {
+          width: e.circleSize,
+          height: e.circleSize
         }, [
-          o("circle", {
-            ref: "circle",
+          a("circle", {
+            ref_key: "circle",
+            ref: d,
             class: "nmorph-progress__circle-ring",
-            cx: r.props.circleSize / 2,
-            cy: r.props.circleSize / 2,
-            r: r.props.circleSize / 2 - 2,
-            "stroke-dasharray": r.strokeDasharray,
-            "stroke-dashoffset": r.strokeDashoffset
-          }, null, 8, x)
-        ], 8, z))
-      ])) : i("v-if", !0)
-    ],
-    6
-    /* CLASS, STYLE */
-  );
-}
-const E = /* @__PURE__ */ h(_, [["render", N], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-progress/NmorphProgress.vue"]]);
+            cx: e.circleSize / 2,
+            cy: e.circleSize / 2,
+            r: e.circleSize / 2 - 2,
+            "stroke-dasharray": _.value,
+            "stroke-dashoffset": y.value
+          }, null, 8, E)
+        ], 8, T))
+      ])) : c("", !0)
+    ], 6));
+  }
+});
 export {
-  E as default
+  G as default
 };

package/dist/components/data/nmorph-progress/NmorphProgress.vue3.js

@@ -0,0 +1,6 @@
+import './NmorphProgress.css';
+import o from "./NmorphProgress.vue.js";
+/* empty css                    */
+export {
+  o as default
+};

package/dist/components/data/nmorph-qr-code/NmorphQRCode.vue.js

@@ -1,59 +1,84 @@
 import './NmorphQRCode.css';
-import l from "./NmorphQRCode.vue2.js";
-import { openBlock as o, createElementBlock as r, normalizeStyle as n, normalizeClass as c, toDisplayString as t, createCommentVNode as d, createElementVNode as i, renderSlot as a, createTextVNode as m } from "vue";
-/* empty css                  */
-import _ from "../../../_virtual/_plugin-vue_export-helper.js";
-const p = ["viewBox"], h = { key: 0 }, f = ["fill"], g = ["d", "fill"], v = {
+import { defineComponent as _, computed as o, openBlock as n, createElementBlock as a, normalizeStyle as V, normalizeClass as x, toDisplayString as c, createCommentVNode as C, createElementVNode as m, renderSlot as k, createTextVNode as z } from "vue";
+import { useModifiers as w } from "../../../utils/create-modifiers.js";
+import { createCssVariables as y, createCssSizeVariables as b } from "../../../utils/common.js";
+import { createNmorphQRCode as u } from "./qr-code.js";
+const q = ["viewBox"], S = { key: 0 }, B = ["fill"], N = ["d", "fill"], $ = {
   key: 1,
   class: "nmorph-qr-code__error"
-};
-function w(s, x, y, e, k, B) {
-  return o(), r(
-    "div",
-    {
-      class: c(e.modifiers),
-      style: n(e.styles)
-    },
-    [
-      e.qrCode ? (o(), r("svg", {
+}, L = /* @__PURE__ */ _({
+  __name: "NmorphQRCode",
+  props: {
+    value: { default: "" },
+    size: { default: 160 },
+    margin: { default: 4 },
+    color: { default: "var(--nmorph-text-color)" },
+    background: { default: "var(--nmorph-main-color)" },
+    level: { default: "medium" },
+    minVersion: { default: 1 },
+    maxVersion: { default: 40 },
+    title: { default: "" }
+  },
+  setup(d) {
+    const e = d, l = o(() => {
+      try {
+        return u(String(e.value), {
+          errorCorrectionLevel: e.level,
+          minVersion: e.minVersion,
+          maxVersion: e.maxVersion
+        }), "";
+      } catch (r) {
+        return r instanceof Error ? r.message : "Unable to create QR code.";
+      }
+    }), t = o(() => l.value ? null : u(String(e.value), {
+      errorCorrectionLevel: e.level,
+      minVersion: e.minVersion,
+      maxVersion: e.maxVersion
+    })), i = o(() => t.value ? t.value.size + e.margin * 2 : 1), v = o(() => t.value ? t.value.modules.flatMap(
+      (r, s) => r.map((h, g) => h ? `M${g + e.margin} ${s + e.margin}h1v1h-1z` : "").filter(Boolean)
+    ).join("") : ""), p = o(() => ({
+      ...b({
+        "--nmorph-qr-code-size": e.size
+      }),
+      ...y({
+        "--nmorph-qr-code-color": e.color,
+        "--nmorph-qr-code-background": e.background
+      })
+    })), f = o(
+      () => w({
+        "nmorph-qr-code": [l.value && "error"]
+      })
+    );
+    return (r, s) => (n(), a("div", {
+      class: x(f.value),
+      style: V(p.value)
+    }, [
+      t.value ? (n(), a("svg", {
         key: 0,
         class: "nmorph-qr-code__svg",
         xmlns: "http://www.w3.org/2000/svg",
-        viewBox: `0 0 ${e.viewBoxSize} ${e.viewBoxSize}`,
+        viewBox: `0 0 ${i.value} ${i.value}`,
         role: "img",
         "shape-rendering": "crispEdges"
       }, [
-        e.props.title ? (o(), r(
-          "title",
-          h,
-          t(e.props.title),
-          1
-          /* TEXT */
-        )) : d("v-if", !0),
-        i("rect", {
+        e.title ? (n(), a("title", S, c(e.title), 1)) : C("", !0),
+        m("rect", {
           width: "100%",
           height: "100%",
-          fill: e.props.background
-        }, null, 8, f),
-        i("path", {
-          d: e.path,
-          fill: e.props.color
-        }, null, 8, g)
-      ], 8, p)) : (o(), r("div", v, [
-        a(s.$slots, "error", { message: e.errorMessage }, () => [
-          m(
-            t(e.errorMessage),
-            1
-            /* TEXT */
-          )
+          fill: e.background
+        }, null, 8, B),
+        m("path", {
+          d: v.value,
+          fill: e.color
+        }, null, 8, N)
+      ], 8, q)) : (n(), a("div", $, [
+        k(r.$slots, "error", { message: l.value }, () => [
+          z(c(l.value), 1)
         ])
       ]))
-    ],
-    6
-    /* CLASS, STYLE */
-  );
-}
-const z = /* @__PURE__ */ _(l, [["render", w], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-qr-code/NmorphQRCode.vue"]]);
+    ], 6));
+  }
+});
 export {
-  z as default
+  L as default
 };

package/dist/components/data/nmorph-qr-code/NmorphQRCode.vue3.js

@@ -0,0 +1,6 @@
+import './NmorphQRCode.css';
+import o from "./NmorphQRCode.vue.js";
+/* empty css                  */
+export {
+  o as default
+};

package/dist/components/data/nmorph-skeleton/NmorphSkeleton.vue.js

@@ -1,62 +1,55 @@
 import './NmorphSkeleton.css';
-import m from "./NmorphSkeleton.vue2.js";
-import { openBlock as o, createElementBlock as r, normalizeStyle as p, normalizeClass as c, Fragment as d, renderList as _, createBlock as h, createCommentVNode as f, withDirectives as s, createElementVNode as n, renderSlot as l, vShow as i } from "vue";
-/* empty css                    */
-import k from "../../../_virtual/_plugin-vue_export-helper.js";
-const v = {
+import { defineComponent as u, computed as n, openBlock as t, createElementBlock as o, normalizeStyle as _, normalizeClass as f, Fragment as h, renderList as g, createBlock as k, unref as v, createCommentVNode as w, withDirectives as a, createElementVNode as s, renderSlot as l, vShow as i } from "vue";
+import { useModifiers as y } from "../../../utils/create-modifiers.js";
+import { createCssVariables as B } from "../../../utils/common.js";
+import C from "./components/NmorphSkeletonItem.vue.js";
+/* empty css                                   */
+const S = {
   key: 0,
   class: "nmorph-skeleton__rows"
-}, w = { class: "nmorph-skeleton__template" }, y = { class: "nmorph-skeleton__default" };
-function S(t, g, N, e, u, B) {
-  return o(), r(
-    "div",
-    {
-      class: c(e.modifiers),
-      style: p(e.styles)
-    },
-    [
-      e.props.rows && e.props.loading ? (o(), r("div", v, [
-        (o(!0), r(
-          d,
-          null,
-          _(e.props.rows, (a) => (o(), h(e.NmorphSkeletonItem, {
-            key: a,
-            width: "100%",
-            height: "14px",
-            variant: "rect"
-          }))),
-          128
-          /* KEYED_FRAGMENT */
-        ))
-      ])) : f("v-if", !0),
-      s(n(
-        "div",
-        w,
-        [
-          l(t.$slots, "template")
-        ],
-        512
-        /* NEED_PATCH */
-      ), [
-        [i, !e.props.rows && e.props.loading]
+}, N = { class: "nmorph-skeleton__template" }, V = { class: "nmorph-skeleton__default" }, D = /* @__PURE__ */ u({
+  __name: "NmorphSkeleton",
+  props: {
+    animated: { type: Boolean, default: !0 },
+    loading: { type: Boolean, default: !0 },
+    rows: { default: 0 },
+    loadingGradient: { default: void 0 }
+  },
+  setup(d) {
+    const e = d, m = n(
+      () => y({
+        "nmorph-skeleton": [e.animated && e.loading && "loading"]
+      })
+    ), c = n(
+      () => B({
+        "--loading-gradient": e.loadingGradient
+      })
+    );
+    return (r, $) => (t(), o("div", {
+      class: f(m.value),
+      style: _(c.value)
+    }, [
+      e.rows && e.loading ? (t(), o("div", S, [
+        (t(!0), o(h, null, g(e.rows, (p) => (t(), k(v(C), {
+          key: p,
+          width: "100%",
+          height: "14px",
+          variant: "rect"
+        }))), 128))
+      ])) : w("", !0),
+      a(s("div", N, [
+        l(r.$slots, "template")
+      ], 512), [
+        [i, !e.rows && e.loading]
       ]),
-      s(n(
-        "div",
-        y,
-        [
-          l(t.$slots, "default")
-        ],
-        512
-        /* NEED_PATCH */
-      ), [
-        [i, !e.props.loading]
+      a(s("div", V, [
+        l(r.$slots, "default")
+      ], 512), [
+        [i, !e.loading]
       ])
-    ],
-    6
-    /* CLASS, STYLE */
-  );
-}
-const E = /* @__PURE__ */ k(m, [["render", S], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-skeleton/NmorphSkeleton.vue"]]);
+    ], 6));
+  }
+});
 export {
-  E as default
+  D as default
 };