@nmorph/nmorph-ui-kit 3.0.4 → 3.0.6

package/dist/components/form/nmorph-time-picker/NmorphTimePicker.vue2.js

@@ -1,16 +1,18 @@
 import './NmorphTimePicker.css';
-import { defineComponent as te, ref as V, computed as n, watch as re } from "vue";
-import { useI18n as oe } from "vue-i18n";
-import { useModifiers as _ } from "../../../utils/create-modifiers.js";
-import { createCssSizeVariables as ne } from "../../../utils/common.js";
-import { useFocusableInput as ue } from "../../../hooks/use-focusable-input.js";
-import { useFormItemInput as le, useFormItemModel as se } from "../nmorph-form/use-form-item-input.js";
-import { NmorphComponentThickness as O } from "../../../types/common.types.js";
+import { defineComponent as Y, ref as V, computed as u, watch as Z } from "vue";
+import { useI18n as ee } from "vue-i18n";
+import { useModifiers as te } from "../../../utils/create-modifiers.js";
+import { createCssSizeVariables as re } from "../../../utils/common.js";
+import { useFocusableInput as oe } from "../../../hooks/use-focusable-input.js";
+import { useFormItemInput as ne, useFormItemModel as ue } from "../nmorph-form/use-form-item-input.js";
+import { NmorphComponentThickness as le } from "../../../types/common.types.js";
+import se from "../../basic/nmorph-scroll/NmorphScroll.vue.js";
 import ae from "../../../assets/icons/clock.svg.js";
 import ie from "../../../assets/icons/circle-close.svg.js";
-import de from "../../basic/nmorph-icon/NmorphIcon.vue.js";
-import ce from "../../navigation/nmorph-dropdown/NmorphDropdown.vue.js";
-const Te = /* @__PURE__ */ te({
+import me from "../../basic/nmorph-icon/NmorphIcon.vue.js";
+import de from "../../navigation/nmorph-dropdown/NmorphDropdown.vue.js";
+import ce from "../../basic/nmorph-button/NmorphButton.vue.js";
+const xe = /* @__PURE__ */ Y({
   __name: "NmorphTimePicker",
   props: {
     modelValue: { type: [String, null], required: !1, default: null },
@@ -32,93 +34,93 @@ const Te = /* @__PURE__ */ te({
     tabindex: { type: Number, required: !1 }
   },
   emits: ["update:model-value", "focus", "blur"],
-  setup(B, { expose: M, emit: F }) {
-    const t = B, m = F, { t: T } = oe(), { id: H, name: P, autocomplete: $, tabindex: z } = le(t), { modelValue: s, updateModelValue: p } = se(
-      t,
-      (e) => m("update:model-value", e),
+  setup(_, { expose: B, emit: O }) {
+    const r = _, c = O, { t: T } = ee(), { id: F, name: M, autocomplete: H, tabindex: P } = ne(r), { modelValue: s, updateModelValue: p } = ue(
+      r,
+      (e) => c("update:model-value", e),
       null
     ), a = V(!1), {
       elementRef: I,
-      focused: k,
-      handleFocus: D,
-      handleBlur: R
-    } = ue({
-      onFocus: () => m("focus"),
-      onBlur: () => m("blur")
-    }), c = (e) => String(e).padStart(2, "0"), f = (e) => Math.max(1, Math.floor(Number.isFinite(e) ? e : 1)), i = (e) => {
+      focused: w,
+      handleFocus: $,
+      handleBlur: z
+    } = oe({
+      onFocus: () => c("focus"),
+      onBlur: () => c("blur")
+    }), d = (e) => String(e).padStart(2, "0"), f = (e) => Math.max(1, Math.floor(Number.isFinite(e) ? e : 1)), i = (e) => {
       if (!e) return null;
-      const r = e.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?$/);
-      if (!r) return null;
-      const o = Number(r[1]), v = Number(r[2]), d = Number(r[3] || 0);
-      return o > 23 || v > 59 || d > 59 ? null : { hour: o, minute: v, second: d };
-    }, y = (e) => {
-      const r = `${c(e.hour)}:${c(e.minute)}`;
-      return t.showSeconds ? `${r}:${c(e.second)}` : r;
-    }, h = (e) => e.hour * 3600 + e.minute * 60 + e.second, g = n(() => i(t.minTime)), N = n(() => i(t.maxTime)), w = n(() => i(s.value)), l = V(w.value || { hour: 0, minute: 0, second: 0 }), x = n(() => t.placeholder || T("pickATime"));
-    re(s, (e) => {
-      const r = i(e);
-      r && (l.value = r);
+      const t = e.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?$/);
+      if (!t) return null;
+      const o = Number(t[1]), v = Number(t[2]), m = Number(t[3] || 0);
+      return o > 23 || v > 59 || m > 59 ? null : { hour: o, minute: v, second: m };
+    }, N = (e) => {
+      const t = `${d(e.hour)}:${d(e.minute)}`;
+      return r.showSeconds ? `${t}:${d(e.second)}` : t;
+    }, h = (e) => e.hour * 3600 + e.minute * 60 + e.second, g = u(() => i(r.minTime)), y = u(() => i(r.maxTime)), x = u(() => i(s.value)), l = V(x.value || { hour: 0, minute: 0, second: 0 }), k = u(() => r.placeholder || T("pickATime"));
+    Z(s, (e) => {
+      const t = i(e);
+      t && (l.value = t);
     });
-    const b = (e) => {
-      const r = h(e);
-      return !!(g.value && r < h(g.value) || N.value && r > h(N.value));
-    }, S = (e, r, o) => {
-      const v = f(o), d = /* @__PURE__ */ new Set();
-      for (let u = 0; u <= r; u += v) d.add(u);
-      return d.add(l.value[e]), Array.from(d).filter((u) => u >= 0 && u <= r).sort((u, q) => u - q).map((u) => {
-        const q = { ...l.value, [e]: u };
+    const S = (e) => {
+      const t = h(e);
+      return !!(g.value && t < h(g.value) || y.value && t > h(y.value));
+    }, b = (e, t, o) => {
+      const v = f(o), m = /* @__PURE__ */ new Set();
+      for (let n = 0; n <= t; n += v) m.add(n);
+      return m.add(l.value[e]), Array.from(m).filter((n) => n >= 0 && n <= t).sort((n, q) => n - q).map((n) => {
+        const q = { ...l.value, [e]: n };
         return {
-          label: c(u),
-          value: u,
-          disabled: b(q)
+          label: d(n),
+          value: n,
+          disabled: S(q)
         };
       });
-    }, A = n(() => S("hour", 23, t.hourStep)), U = n(() => S("minute", 59, t.minuteStep)), j = n(() => S("second", 59, t.secondStep)), E = (e, r) => {
-      const o = { ...l.value, [e]: r };
-      b(o) || (l.value = o, p(y(o)));
-    }, G = () => {
+    }, D = u(() => b("hour", 23, r.hourStep)), R = u(() => b("minute", 59, r.minuteStep)), A = u(() => b("second", 59, r.secondStep)), U = (e, t) => {
+      const o = { ...l.value, [e]: t };
+      S(o) || (l.value = o, p(N(o)));
+    }, j = () => {
       p(null), a.value = !1;
-    }, J = () => {
+    }, E = () => {
       a.value = !1;
-    }, K = () => {
-      t.disabled || (a.value = !a.value);
-    }, L = (e) => {
-      const r = e.target, o = i(r.value);
-      !o || b(o) || (l.value = o, p(y(o)));
-    }, Q = n(() => s.value || x.value), W = n(
-      () => t.showSeconds ? f(t.secondStep) : f(t.minuteStep) * 60
-    ), X = n(() => t.clearable && !!s.value && !t.disabled), Y = n(
-      () => _({
-        nmorph: [O[t.thickness]],
+    }, G = () => {
+      r.disabled || (a.value = !a.value);
+    }, J = (e) => {
+      const t = e.target, o = i(t.value);
+      !o || S(o) || (l.value = o, p(N(o)));
+    }, K = u(() => s.value || k.value), L = u(
+      () => r.showSeconds ? f(r.secondStep) : f(r.minuteStep) * 60
+    ), Q = u(() => r.clearable && !!s.value && !r.disabled), W = u(
+      () => te({
+        nmorph: [le[r.thickness]],
         "nmorph-time-picker": [
-          t.disabled && "disabled",
+          r.disabled && "disabled",
           a.value && "open",
-          k.value && "focus",
+          w.value && "focus",
           !s.value && "placeholder"
         ]
       })
-    ), Z = n(
-      () => _({
-        nmorph: [O[t.thickness]]
-      })
-    ), ee = n(
-      () => ne({
-        "--nmorph-private-time-picker-width": t.width
+    ), X = u(
+      () => re({
+        "--nmorph-private-time-picker-width": r.width
       })
     );
-    M({ inputDOMRef: I });
-    const C = { props: t, emit: m, t: T, id: H, name: P, autocomplete: $, tabindex: z, modelValue: s, updateModelValue: p, open: a, inputDOMRef: I, focused: k, focusHandler: D, blurHandler: R, pad: c, normalizeStep: f, parseTime: i, formatTime: y, timeToSeconds: h, minTimeParts: g, maxTimeParts: N, modelTimeParts: w, pickerValue: l, placeholderText: x, isOutsideRange: b, getUnitOptions: S, hourOptions: A, minuteOptions: U, secondOptions: j, selectUnit: E, clearHandler: G, closeHandler: J, toggleOpen: K, nativeInputHandler: L, displayValue: Q, inputStep: W, showClearButton: X, modifiers: Y, optionHeightModifiers: Z, styles: ee, get NmorphDropdown() {
+    B({ inputDOMRef: I });
+    const C = { props: r, emit: c, t: T, id: F, name: M, autocomplete: H, tabindex: P, modelValue: s, updateModelValue: p, open: a, inputDOMRef: I, focused: w, focusHandler: $, blurHandler: z, pad: d, normalizeStep: f, parseTime: i, formatTime: N, timeToSeconds: h, minTimeParts: g, maxTimeParts: y, modelTimeParts: x, pickerValue: l, placeholderText: k, isOutsideRange: S, getUnitOptions: b, hourOptions: D, minuteOptions: R, secondOptions: A, selectUnit: U, clearHandler: j, closeHandler: E, toggleOpen: G, nativeInputHandler: J, displayValue: K, inputStep: L, showClearButton: Q, modifiers: W, styles: X, get NmorphButton() {
       return ce;
-    }, get NmorphIcon() {
+    }, get NmorphDropdown() {
       return de;
+    }, get NmorphIcon() {
+      return me;
     }, get NmorphIconCircleClose() {
       return ie;
     }, get NmorphIconClock() {
       return ae;
+    }, get NmorphScroll() {
+      return se;
     } };
     return Object.defineProperty(C, "__isScriptSetup", { enumerable: !1, value: !0 }), C;
   }
 });
 export {
-  Te as default
+  xe as default
 };

package/dist/components/navigation/nmorph-stepper/NmorphStepper.css

@@ -1 +1 @@
-.nmorph-stepper{width:100%;border-radius:var(--default-border-radius)}.nmorph-stepper.nmorph-stepper--interactive{cursor:grab}.nmorph-stepper.nmorph-stepper--disabled{cursor:not-allowed;opacity:.6}.nmorph-stepper:focus-visible{outline:2px solid var(--nmorph-accent-color);outline-offset:2px}.nmorph-stepper__viewport{width:100%;overflow:hidden;border-radius:inherit;touch-action:pan-y}.nmorph-stepper__track{display:flex;width:100%;min-width:0;transition:transform .24s ease;will-change:transform}.nmorph-stepper__track>*{flex:0 0 100%;width:100%;min-width:100%;max-width:100%}
+.nmorph-stepper{width:100%;border-radius:var(--default-border-radius)}.nmorph-stepper.nmorph-stepper--interactive{cursor:grab}.nmorph-stepper.nmorph-stepper--disabled{cursor:not-allowed;opacity:.6}.nmorph-stepper:focus-visible{outline:2px solid var(--nmorph-accent-color);outline-offset:2px}.nmorph-stepper__viewport{width:100%;overflow:hidden;border-radius:inherit;touch-action:pan-y}.nmorph-stepper__track{display:flex;width:100%;min-width:0;transition:transform .24s ease;will-change:transform}.nmorph-stepper__track>*{flex:0 0 100%;width:100%;min-width:100%;max-width:100%}.nmorph-stepper__indicator{width:100%}

package/dist/components/navigation/nmorph-stepper/NmorphStepper.vue.js

@@ -1,48 +1,71 @@
 import './NmorphStepper.css';
-import n from "./NmorphStepper.vue2.js";
-import { openBlock as i, createElementBlock as l, normalizeClass as t, createElementVNode as r, normalizeStyle as d, renderSlot as a, normalizeProps as c, guardReactiveProps as p } from "vue";
+import d from "./NmorphStepper.vue2.js";
+import { openBlock as i, createElementBlock as t, normalizeClass as p, createElementVNode as a, normalizeStyle as s, renderSlot as l, withModifiers as r, normalizeProps as m, guardReactiveProps as P, createCommentVNode as v } from "vue";
 /* empty css                   */
-import s from "../../../_virtual/_plugin-vue_export-helper.js";
-const m = ["aria-label", "aria-disabled", "tabindex"], h = {
+import f from "../../../_virtual/_plugin-vue_export-helper.js";
+const b = ["aria-label", "aria-disabled", "tabindex"], c = {
   class: "nmorph-stepper__viewport",
   "aria-live": "polite",
   "aria-atomic": "true"
 };
-function _(o, P, v, e, b, f) {
-  return i(), l("div", {
-    class: t(e.modifiers),
+function h(n, e, k, o, w, y) {
+  return i(), t("div", {
+    class: p(o.modifiers),
     role: "group",
     "aria-roledescription": "stepper",
-    "aria-label": e.props.ariaLabel,
-    "aria-disabled": e.props.disabled || void 0,
-    tabindex: e.tabIndex,
-    onWheel: e.handleWheel,
-    onKeydown: e.handleKeydown,
-    onPointerdown: e.handlePointerDown,
-    onPointermove: e.handlePointerMove,
-    onPointerup: e.handlePointerEnd,
-    onPointercancel: e.clearPointer,
-    onPointerleave: e.clearPointer,
-    onClickCapture: e.handleClickCapture
+    "aria-label": o.props.ariaLabel,
+    "aria-disabled": o.props.disabled || void 0,
+    tabindex: o.tabIndex,
+    onWheel: o.handleWheel,
+    onKeydown: o.handleKeydown,
+    onPointerdown: o.handlePointerDown,
+    onPointermove: o.handlePointerMove,
+    onPointerup: o.handlePointerEnd,
+    onPointercancel: o.clearPointer,
+    onPointerleave: o.clearPointer,
+    onClickCapture: o.handleClickCapture
   }, [
-    r("div", h, [
-      r(
+    a("div", c, [
+      a(
         "div",
         {
           class: "nmorph-stepper__track",
-          style: d(e.trackStyle)
+          style: s(o.trackStyle)
         },
         [
-          a(o.$slots, "default")
+          l(n.$slots, "default")
         ],
         4
         /* STYLE */
       )
     ]),
-    a(o.$slots, "indicator", c(p(e.indicatorSlotProps)))
-  ], 42, m);
+    n.$slots.indicator ? (i(), t(
+      "div",
+      {
+        key: 0,
+        class: "nmorph-stepper__indicator",
+        onPointerdown: e[0] || (e[0] = r(() => {
+        }, ["stop"])),
+        onPointermove: e[1] || (e[1] = r(() => {
+        }, ["stop"])),
+        onPointerup: e[2] || (e[2] = r(() => {
+        }, ["stop"])),
+        onPointercancel: e[3] || (e[3] = r(() => {
+        }, ["stop"])),
+        onPointerleave: e[4] || (e[4] = r(() => {
+        }, ["stop"])),
+        onWheel: e[5] || (e[5] = r(() => {
+        }, ["stop"]))
+      },
+      [
+        l(n.$slots, "indicator", m(P(o.indicatorSlotProps)))
+      ],
+      32
+      /* NEED_HYDRATION */
+    )) : v("v-if", !0)
+  ], 42, b);
 }
-const C = /* @__PURE__ */ s(n, [["render", _], ["__file", "/builds/ketjo/nmorph/library/src/components/navigation/nmorph-stepper/NmorphStepper.vue"]]);
+const g = /* @__PURE__ */ f(d, [["render", h], ["__file", "/builds/ketjo/nmorph/library/src/components/navigation/nmorph-stepper/NmorphStepper.vue"]]);
 export {
-  C as default
+  g as default
 };