@nmorph/nmorph-ui-kit 2.2.37 → 2.2.38

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

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

package/dist/hooks/use-field-validation.js

@@ -1,74 +1,103 @@
-import { ref as p } from "vue";
-const I = (b) => {
-  const { inputValue: h, rules: a } = b, c = p([]), f = p(!1), d = p(!1);
+import { resolution as L } from "../components/form/nmorph-file-upload/types.js";
+import { ref as h } from "vue";
+const S = Object.entries(L), z = (t) => t.split("/")[1]?.toLowerCase() || "", B = (t) => {
+  const o = t.split(".").pop()?.toLowerCase();
+  return o && o !== t.toLowerCase() ? o : "";
+}, I = (t) => S.find(([, o]) => o.toLowerCase() === t.toLowerCase())?.[0] || "", M = (t) => Array.from(
+  new Set(
+    [
+      t.type.toLowerCase(),
+      I(t.type),
+      B(t.name),
+      z(t.type)
+    ].filter(Boolean).map((o) => o.toLowerCase())
+  )
+), w = (t) => typeof File < "u" && t instanceof File, q = (t) => !!t && typeof t == "object" && "data" in t && w(t.data), E = (t) => {
+  if (w(t)) return [t];
+  if (!Array.isArray(t)) return null;
+  const o = t;
+  return o.length === 0 ? [] : o.every(w) ? o : o.every(q) ? o.map((s) => s.data) : null;
+}, j = (t, o) => {
+  if (o.length === 0) return !0;
+  const s = M(t);
+  return o.some((c) => s.includes(String(c).toLowerCase()));
+}, P = (t) => {
+  const { inputValue: o, rules: s } = t, c = h([]), y = h(!1), m = h(!1);
   return {
-    touched: d,
-    valid: f,
+    touched: m,
+    valid: y,
     errors: c,
     validate: () => {
-      const y = a?.length > 0;
-      if (!y) {
-        f.value = !0;
+      const g = s?.length > 0;
+      if (c.value = [], !g) {
+        y.value = !0;
         return;
       }
-      if (h === null) return;
-      const t = h, u = (n) => y && n in a[0], m = typeof t == "string" && u("pattern"), v = typeof t == "number" && u("numberCompareType"), g = (typeof t == "string" || typeof t == "boolean") && u("booleanCompareType"), T = Array.isArray(t) && u("arrayCompareType");
-      if (!v && !m && !g && !T) {
+      if (o === null) return;
+      const i = o, u = (a) => g && s.some((r) => a in r), C = typeof i == "string" && u("pattern"), F = typeof i == "number" && u("numberCompareType"), T = (typeof i == "string" || typeof i == "boolean") && u("booleanCompareType"), v = Array.isArray(i) && u("arrayCompareType"), x = u("fileMaxSize") || u("maxFileSize") || u("fileAllowedTypes") || u("allowedTypes") || u("fileMaxCount") || u("maxFiles"), b = x ? E(i) : null, A = x && b !== null;
+      if (!F && !C && !T && !v && !A) {
         console.warn("The input value and the provided rules do not match");
         return;
       }
-      if (d.value || (d.value = !0), m) {
-        const n = a;
-        c.value = n.reduce((o, r) => (t.match(r.pattern) || o.push(r.error), o), []);
+      if (m.value || (m.value = !0), C) {
+        const a = s;
+        c.value = a.reduce((r, n) => (i.match(n.pattern) || r.push(n.error), r), []);
       }
-      if (v) {
-        const n = (r, e, s) => {
-          switch (s) {
+      if (F) {
+        const a = (n, e, l) => {
+          switch (l) {
             case "eq":
-              return r === e;
+              return n === e;
             case "gt":
-              return r > e;
+              return n > e;
             case "lt":
-              return r < e;
+              return n < e;
             case "lte":
-              return r <= e;
+              return n <= e;
             case "gte":
-              return r >= e;
+              return n >= e;
           }
-        }, o = a;
-        c.value = o.reduce((r, e) => (n(t, e.compareValue, e.numberCompareType) && r.push(e.error), r), []);
+        }, r = s;
+        c.value = r.reduce((n, e) => (a(i, e.compareValue, e.numberCompareType) && n.push(e.error), n), []);
       }
-      if (g) {
-        const n = a;
-        c.value = n.reduce((o, r) => {
+      if (T) {
+        const a = s;
+        c.value = a.reduce((r, n) => {
           let e = !1;
-          const { compareValue: s, booleanCompareType: i } = r;
-          return i === "not-eq" && (e = t === s), i === "eq" && (e = t !== s), e || o.push(r.error), o;
+          const { compareValue: l, booleanCompareType: f } = n;
+          return f === "not-eq" && (e = i === l), f === "eq" && (e = i !== l), e || r.push(n.error), r;
         }, []);
       }
-      if (T) {
-        const n = a, o = (r, e, s) => {
-          switch (s) {
+      if (v) {
+        const a = s, r = (n, e, l) => {
+          switch (l) {
             case "contains-one":
-              return r.some((l) => e.includes(l));
+              return n.some((p) => e.includes(p));
             case "full-eq":
-              if (r.length !== e.length) return !1;
-              const i = [...r].sort(), C = [...e].sort();
-              return i.every((l, w) => l === C[w]);
+              if (n.length !== e.length) return !1;
+              const f = [...n].sort(), d = [...e].sort();
+              return f.every((p, R) => p === d[R]);
             case "not-contains":
-              return !r.some((l) => e.includes(l));
+              return !n.some((p) => e.includes(p));
           }
         };
-        c.value = n.reduce((r, e) => (o(
-          t.map((i) => String(i)),
+        c.value = a.reduce((n, e) => (r(
+          i.map((f) => String(f)),
           e.compareValue,
           e.arrayCompareType
-        ) || r.push(e.error), r), []);
+        ) || n.push(e.error), n), []);
+      }
+      if (A) {
+        const a = s, r = b || [];
+        c.value = a.reduce((n, e) => {
+          const l = e.fileMaxSize ?? e.maxFileSize, f = e.fileAllowedTypes ?? e.allowedTypes, d = e.fileMaxCount ?? e.maxFiles;
+          return typeof l == "number" && r.some((p) => p.size > l) && n.push(e.error), f && r.some((p) => !j(p, f)) && n.push(e.error), typeof d == "number" && r.length > d && n.push(e.error), n;
+        }, []);
       }
-      f.value = c.value.length === 0;
+      y.value = c.value.length === 0;
     }
   };
 };
 export {
-  I as useFieldValidation
+  P as useFieldValidation
 };

package/dist/hooks/use-form-validation.js

@@ -1,30 +1,68 @@
-import { reactive as i, ref as p, watch as b, readonly as v } from "vue";
-import { deepClone as F } from "../utils/common.js";
+import { reactive as f, ref as h, watch as w, readonly as b } from "vue";
 import { useFieldValidation as c } from "./use-field-validation.js";
-const T = (n, f = !1) => {
-  const t = i({}), o = i({}), u = i(F(n)), a = p(!1), d = p(!1), h = () => {
-    Object.entries(n).forEach(([e, s]) => {
-      o[e] = c({ inputValue: s.value, rules: s.rules }), o[e].validate();
-    }), a.value = Object.values(o).every((e) => e.valid);
-  }, V = () => {
-    Object.entries(n).forEach(([e, s]) => {
-      t[e] = c({ inputValue: s.value, rules: s.rules }), t[e].validate();
+const z = (e) => typeof File < "u" && e instanceof File, p = (e) => z(e) ? {
+  name: e.name,
+  size: e.size,
+  type: e.type,
+  lastModified: e.lastModified
+} : e instanceof Date ? e.toISOString() : e instanceof RegExp ? e.toString() : typeof e == "function" ? String(e) : Array.isArray(e) ? e.map(p) : e && typeof e == "object" ? Object.fromEntries(
+  Object.entries(e).map(([s, i]) => [
+    s,
+    p(i)
+  ])
+) : e, m = (e) => Object.fromEntries(
+  Object.entries(e).map(([s, i]) => [
+    s,
+    JSON.stringify(p(i))
+  ])
+), O = (e) => {
+  const s = e.valid;
+  return typeof s == "boolean" ? s : s.value;
+}, H = (e, s = !1) => {
+  const i = f({}), a = f({}), F = f(m(e)), V = h(!1), d = h(!1), j = () => {
+    const t = Object.values(a).every(O), n = Object.values(i).every(O);
+    V.value = t && n;
+  }, u = () => {
+    Object.entries(e).forEach(([t, n]) => {
+      a[t] = c({ inputValue: n.value, rules: n.rules }), a[t].validate();
+    }), j();
+  }, g = () => {
+    Object.entries(e).forEach(([t, n]) => {
+      i[t] = c({ inputValue: n.value, rules: n.rules }), i[t].validate();
+    }), u();
+  }, y = (t, n) => {
+    const r = e[t];
+    if (!r) return;
+    const o = c({
+      inputValue: n ?? r.value,
+      rules: r.rules
     });
-  }, m = (e, s) => Object.keys(s).filter((l) => {
-    const g = e[l] ? JSON.stringify(e[l]) : null, O = JSON.stringify(s[l]);
-    return g !== O;
-  });
-  return b(n, (e) => {
-    m(u, e).forEach((r) => {
-      const l = e[r];
-      t[r] = c({ inputValue: l.value, rules: l.rules }), t[r].validate();
-    }), Object.assign(u, F(e)), h(), d.value = !0;
-  }, { deep: !0 }), f && V(), {
-    fields: t,
-    isFormValid: v(a),
-    isAnyTouched: v(d)
+    return o.validate(), i[t] = o, u(), d.value = !0, o;
+  }, S = (t, n) => {
+    const r = e[t];
+    r && (r.value = n, y(t, n));
+  }, v = (t, n) => {
+    const r = m(n);
+    return { changedFields: Object.keys(n).filter((l) => {
+      const E = t[l] ?? null, A = r[l];
+      return E !== A;
+    }), newSnapshot: r };
+  };
+  return w(e, (t) => {
+    const { changedFields: n, newSnapshot: r } = v(F, t);
+    n.forEach((o) => {
+      const l = t[o];
+      i[o] = c({ inputValue: l.value, rules: l.rules }), i[o].validate();
+    }), Object.assign(F, r), u(), d.value = !0;
+  }, { deep: !0 }), s && g(), {
+    formValue: e,
+    fields: i,
+    updateFieldValue: S,
+    validateField: y,
+    isFormValid: b(V),
+    isAnyTouched: b(d)
   };
 };
 export {
-  T as useFormValidation
+  H as useFormValidation
 };