@nmorph/nmorph-ui-kit 2.2.36 → 2.2.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (114) hide show
  1. package/dist/components/basic/nmorph-button/NmorphButton.vue2.js +8 -8
  2. package/dist/components/basic/nmorph-icon/NmorphIcon.vue2.js +3 -3
  3. package/dist/components/basic/nmorph-layout/NmorphLayout.vue2.js +14 -13
  4. package/dist/components/basic/nmorph-link/NmorphLink.vue2.js +1 -1
  5. package/dist/components/basic/nmorph-scroll/NmorphScroll.css +1 -0
  6. package/dist/components/basic/nmorph-scroll/NmorphScroll.vue.js +6 -4
  7. package/dist/components/basic/nmorph-scroll/NmorphScroll.vue2.js +1 -0
  8. package/dist/components/basic/nmorph-space/NmorphSpace.vue2.js +15 -19
  9. package/dist/components/data/nmorph-avatar/NmorphAvatar.css +1 -1
  10. package/dist/components/data/nmorph-avatar/NmorphAvatar.vue2.js +5 -5
  11. package/dist/components/data/nmorph-badge/NmorphBadge.vue2.js +37 -36
  12. package/dist/components/data/nmorph-calendar/NmorphCalendar.vue2.js +41 -40
  13. package/dist/components/data/nmorph-card/NmorphCard.vue2.js +19 -15
  14. package/dist/components/data/nmorph-collapse/components/nmorph-collapse-item/NmorphCollapseItem.vue2.js +5 -9
  15. package/dist/components/data/nmorph-empty/NmorphEmpty.vue.js +3 -3
  16. package/dist/components/data/nmorph-empty/NmorphEmpty.vue2.js +17 -14
  17. package/dist/components/data/nmorph-image/NmorphImage.css +1 -0
  18. package/dist/components/data/nmorph-image/NmorphImage.vue.js +14 -12
  19. package/dist/components/data/nmorph-image/NmorphImage.vue2.js +3 -2
  20. package/dist/components/data/nmorph-image-preview/NmorphImagePreview.vue2.js +36 -35
  21. package/dist/components/data/nmorph-pagination/NmorphPagination.vue2.js +1 -1
  22. package/dist/components/data/nmorph-progress/NmorphProgress.vue2.js +19 -18
  23. package/dist/components/data/nmorph-qr-code/NmorphQRCode.vue2.js +20 -19
  24. package/dist/components/data/nmorph-skeleton/NmorphSkeleton.vue2.js +1 -1
  25. package/dist/components/data/nmorph-table/NmorphTable.vue2.js +39 -43
  26. package/dist/components/data/nmorph-virtual-list/NmorphVirtualList.vue2.js +34 -33
  27. package/dist/components/feedback/nmorph-alert/NmorphAlert.vue2.js +1 -1
  28. package/dist/components/feedback/nmorph-callout/NmorphCallout.vue2.js +7 -6
  29. package/dist/components/feedback/nmorph-dialog/NmorphDialog.css +1 -1
  30. package/dist/components/feedback/nmorph-dialog/NmorphDialog.vue.js +25 -20
  31. package/dist/components/feedback/nmorph-dialog/NmorphDialog.vue2.js +37 -37
  32. package/dist/components/feedback/nmorph-drawer/NmorphDrawer.vue2.js +22 -21
  33. package/dist/components/feedback/nmorph-tooltip/NmorphTooltip.vue2.js +26 -25
  34. package/dist/components/form/nmorph-autocomplete/NmorphAutocomplete.vue2.js +65 -71
  35. package/dist/components/form/nmorph-checkbox/NmorphCheckbox.css +1 -1
  36. package/dist/components/form/nmorph-checkbox/NmorphCheckbox.vue2.js +30 -28
  37. package/dist/components/form/nmorph-checkbox-group/NmorphCheckboxGroup.vue2.js +25 -20
  38. package/dist/components/form/nmorph-color-picker/NmorphColorPicker.vue2.js +43 -42
  39. package/dist/components/form/nmorph-date-picker/NmorphDatePicker.vue2.js +53 -40
  40. package/dist/components/form/nmorph-file-upload/NmorphFileUpload.vue.js +20 -16
  41. package/dist/components/form/nmorph-file-upload/NmorphFileUpload.vue2.js +113 -86
  42. package/dist/components/form/nmorph-form/NmorphForm.vue2.js +9 -9
  43. package/dist/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue2.js +33 -24
  44. package/dist/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-error-box/NmorphErrorBox.vue2.js +1 -1
  45. package/dist/components/form/nmorph-form/use-form-item-input.js +29 -8
  46. package/dist/components/form/nmorph-number-input/NmorphNumberInput.vue2.js +42 -39
  47. package/dist/components/form/nmorph-otp-input/NmorphOTPInput.vue2.js +66 -62
  48. package/dist/components/form/nmorph-radio/NmorphRadio.css +1 -1
  49. package/dist/components/form/nmorph-radio/NmorphRadio.vue2.js +1 -1
  50. package/dist/components/form/nmorph-radio-group/NmorphRadioGroup.vue2.js +24 -22
  51. package/dist/components/form/nmorph-select/NmorphSelect.css +1 -1
  52. package/dist/components/form/nmorph-select/NmorphSelect.vue2.js +83 -81
  53. package/dist/components/form/nmorph-select/components/nmorph-select-option/NmorphSelectOption.vue2.js +4 -4
  54. package/dist/components/form/nmorph-select-button/NmorphSelectButton.vue2.js +28 -25
  55. package/dist/components/form/nmorph-select-button/components/nmorph-select-button-item/NmorphSelectButtonItem.vue2.js +1 -1
  56. package/dist/components/form/nmorph-slider/NmorphSlider.vue2.js +51 -49
  57. package/dist/components/form/nmorph-switch/NmorphSwitch.vue2.js +35 -33
  58. package/dist/components/form/nmorph-text-input/NmorphTextInput.css +1 -0
  59. package/dist/components/form/nmorph-text-input/NmorphTextInput.vue.js +5 -3
  60. package/dist/components/form/nmorph-text-input/NmorphTextInput.vue2.js +37 -35
  61. package/dist/components/form/nmorph-textarea/NmorphTextarea.vue.js +1 -1
  62. package/dist/components/form/nmorph-textarea/NmorphTextarea.vue2.js +30 -26
  63. package/dist/components/form/nmorph-time-picker/NmorphTimePicker.vue.js +1 -1
  64. package/dist/components/form/nmorph-time-picker/NmorphTimePicker.vue2.js +68 -66
  65. package/dist/components/navigation/nmorph-backtop/NmorphBacktop.vue2.js +1 -1
  66. package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.vue2.js +32 -31
  67. package/dist/components/navigation/nmorph-tabs/NmorphTabs.vue2.js +1 -1
  68. package/dist/components/others/nmorph-overlay/NmorphOverlay.vue2.js +1 -1
  69. package/dist/hooks/use-common-styles.js +18 -278
  70. package/dist/hooks/use-field-validation.js +71 -42
  71. package/dist/hooks/use-form-validation.js +62 -24
  72. package/dist/hooks/use-virtual-list.js +38 -32
  73. package/dist/index.umd.js +26 -286
  74. package/dist/package.json.js +1 -1
  75. package/dist/src/components/basic/nmorph-button/NmorphButton.vue.d.ts +2 -2
  76. package/dist/src/components/basic/nmorph-link/NmorphLink.vue.d.ts +1 -1
  77. package/dist/src/components/data/nmorph-avatar/NmorphAvatar.vue.d.ts +1 -1
  78. package/dist/src/components/data/nmorph-badge/NmorphBadge.vue.d.ts +1 -1
  79. package/dist/src/components/data/nmorph-collapse/components/nmorph-collapse-item/NmorphCollapseItem.vue.d.ts +1 -1
  80. package/dist/src/components/data/nmorph-empty/NmorphEmpty.vue.d.ts +1 -1
  81. package/dist/src/components/data/nmorph-pagination/NmorphPagination.vue.d.ts +1 -1
  82. package/dist/src/components/data/nmorph-progress/NmorphProgress.vue.d.ts +1 -1
  83. package/dist/src/components/data/nmorph-table/NmorphTable.vue.d.ts +1 -1
  84. package/dist/src/components/data/nmorph-tag-list/components/nmorph-tag-item/NmorphTagItem.vue.d.ts +1 -1
  85. package/dist/src/components/feedback/nmorph-callout/NmorphCallout.vue.d.ts +1 -1
  86. package/dist/src/components/feedback/nmorph-dialog/NmorphDialog.vue.d.ts +4 -4
  87. package/dist/src/components/form/nmorph-autocomplete/NmorphAutocomplete.vue.d.ts +1 -1
  88. package/dist/src/components/form/nmorph-checkbox-group/NmorphCheckboxGroup.vue.d.ts +3 -3
  89. package/dist/src/components/form/nmorph-color-picker/NmorphColorPicker.vue.d.ts +1 -1
  90. package/dist/src/components/form/nmorph-date-picker/NmorphDatePicker.vue.d.ts +3 -3
  91. package/dist/src/components/form/nmorph-file-upload/NmorphFileUpload.vue.d.ts +6 -3
  92. package/dist/src/components/form/nmorph-file-upload/types.d.ts +4 -0
  93. package/dist/src/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue.d.ts +1 -1
  94. package/dist/src/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-error-box/NmorphErrorBox.vue.d.ts +1 -1
  95. package/dist/src/components/form/nmorph-form/types.d.ts +15 -5
  96. package/dist/src/components/form/nmorph-form/use-form-item-input.d.ts +10 -0
  97. package/dist/src/components/form/nmorph-number-input/NmorphNumberInput.vue.d.ts +1 -1
  98. package/dist/src/components/form/nmorph-otp-input/NmorphOTPInput.vue.d.ts +1 -1
  99. package/dist/src/components/form/nmorph-radio-group/NmorphRadioGroup.vue.d.ts +3 -3
  100. package/dist/src/components/form/nmorph-select/NmorphSelect.vue.d.ts +1 -1
  101. package/dist/src/components/form/nmorph-select-button/NmorphSelectButton.vue.d.ts +1 -1
  102. package/dist/src/components/form/nmorph-text-input/NmorphTextInput.vue.d.ts +1 -1
  103. package/dist/src/components/form/nmorph-textarea/NmorphTextarea.vue.d.ts +1 -1
  104. package/dist/src/components/form/nmorph-time-picker/NmorphTimePicker.vue.d.ts +1 -1
  105. package/dist/src/hooks/use-field-validation.d.ts +15 -0
  106. package/dist/src/hooks/use-form-validation.d.ts +5 -0
  107. package/dist/src/hooks/use-virtual-list.d.ts +6 -0
  108. package/dist/src/types/index.d.ts +2 -1
  109. package/dist/src/utils/common.d.ts +5 -0
  110. package/dist/src/utils/create-modifiers.d.ts +4 -2
  111. package/dist/style.css +1 -1
  112. package/dist/utils/common.js +9 -3
  113. package/dist/utils/create-modifiers.js +6 -6
  114. package/package.json +1 -1
@@ -1,18 +1,19 @@
1
1
  import './NmorphFileUpload.css';
2
- import { defineComponent as M, computed as y, ref as F, watch as E, onBeforeUnmount as W } from "vue";
3
- import { useModifiers as $ } from "../../../utils/create-modifiers.js";
4
- import { useI18n as D } from "vue-i18n";
5
- import { resolution as T, NmorphImageResolution as A, NmorphAudioResolution as K, NmorphVideoResolution as z, NmorphArchiveResolution as G } from "./types.js";
6
- import H from "../../../assets/icons/doc.svg.js";
7
- import J from "../../data/nmorph-image-preview/NmorphImagePreview.vue.js";
8
- import Q from "../../basic/nmorph-icon/NmorphIcon.vue.js";
9
- import X from "../../basic/nmorph-button/NmorphButton.vue.js";
10
- import Y from "../../../assets/icons/audio.svg.js";
11
- import Z from "../../../assets/icons/video.svg.js";
12
- import ee from "../../../assets/icons/archive.svg.js";
13
- import oe from "../../../assets/icons/cross.svg.js";
14
- import te from "../../../assets/icons/image.svg.js";
15
- const ye = /* @__PURE__ */ M({
2
+ import { defineComponent as X, computed as C, inject as Y, ref as q, watch as Z, onBeforeUnmount as ee } from "vue";
3
+ import { useModifiers as te } from "../../../utils/create-modifiers.js";
4
+ import { useI18n as oe } from "vue-i18n";
5
+ import { useFormItemInput as re, useFormItemModel as ne } from "../nmorph-form/use-form-item-input.js";
6
+ import { resolution as B, NmorphImageResolution as V, NmorphAudioResolution as se, NmorphVideoResolution as ae, NmorphArchiveResolution as ie } from "./types.js";
7
+ import le from "../../../assets/icons/doc.svg.js";
8
+ import ue from "../../data/nmorph-image-preview/NmorphImagePreview.vue.js";
9
+ import de from "../../basic/nmorph-icon/NmorphIcon.vue.js";
10
+ import pe from "../../basic/nmorph-button/NmorphButton.vue.js";
11
+ import me from "../../../assets/icons/audio.svg.js";
12
+ import ce from "../../../assets/icons/video.svg.js";
13
+ import fe from "../../../assets/icons/archive.svg.js";
14
+ import ve from "../../../assets/icons/cross.svg.js";
15
+ import ye from "../../../assets/icons/image.svg.js";
16
+ const Pe = /* @__PURE__ */ X({
16
17
  __name: "NmorphFileUpload",
17
18
  props: {
18
19
  modelValue: { type: Array, required: !1, default: () => [] },
@@ -20,107 +21,133 @@ const ye = /* @__PURE__ */ M({
20
21
  multiple: { type: Boolean, required: !1, default: !1 },
21
22
  allowedTypes: { type: Array, required: !1, default: () => [] },
22
23
  photoWithPreview: { type: Boolean, required: !1, default: !0 },
23
- buttonText: { type: String, required: !1, default: "" }
24
+ buttonText: { type: String, required: !1, default: "" },
25
+ id: { type: String, required: !1 },
26
+ name: { type: String, required: !1 },
27
+ autocomplete: { type: String, required: !1 },
28
+ tabindex: { type: Number, required: !1 }
24
29
  },
25
- emits: ["update:model-value", "on-unsupported-file-type-error"],
26
- setup(R, { expose: U, emit: _ }) {
27
- const { t: w } = D(), n = R, d = _, B = y(() => n.buttonText ? n.buttonText : w("selectFile")), g = Object.entries(T), v = {
30
+ emits: ["update:model-value", "on-unsupported-file-type-error", "on-file-validation-error"],
31
+ setup(M, { expose: j, emit: O }) {
32
+ const { t: N } = oe(), r = M, c = O, k = C(() => r.buttonText ? r.buttonText : N("selectFile")), { id: f, name: E, autocomplete: W, tabindex: D } = re(r), { modelValue: F, updateModelValue: L } = ne(
33
+ r,
34
+ (e) => c("update:model-value", e),
35
+ []
36
+ ), v = Y("form-data", void 0), R = Object.entries(B), T = {
28
37
  "svg-xml": "svg",
29
38
  "audio-ogg": "ogg",
30
39
  "wideo-ogg": "ogg"
31
- }, C = (e) => e.split("/")[1]?.toLowerCase() || "", f = (e) => {
32
- const o = e.split(".").pop()?.toLowerCase();
33
- return o && o !== e.toLowerCase() ? o : "";
34
- }, I = (e) => g.find(([, o]) => o.toLowerCase() === e.toLowerCase())?.[0] || "", u = (e) => Array.from(
40
+ }, A = (e) => e.split("/")[1]?.toLowerCase() || "", I = (e) => {
41
+ const t = e.split(".").pop()?.toLowerCase();
42
+ return t && t !== e.toLowerCase() ? t : "";
43
+ }, S = (e) => R.find(([, t]) => t.toLowerCase() === e.toLowerCase())?.[0] || "", y = (e) => Array.from(
35
44
  new Set(
36
45
  [
37
46
  e.type.toLowerCase(),
38
- I(e.type),
39
- f(e.name),
40
- C(e.type)
41
- ].filter(Boolean).map((o) => o.toLowerCase())
47
+ S(e.type),
48
+ I(e.name),
49
+ A(e.type)
50
+ ].filter(Boolean).map((t) => t.toLowerCase())
42
51
  )
43
- ), i = (e, o) => Object.prototype.hasOwnProperty.call(o, e), P = (e) => {
44
- const o = u(e);
45
- return e.type.toLowerCase().startsWith("image/") || o.some((t) => i(t, A));
46
- }, L = (e) => {
47
- if (n.allowedTypes.length === 0) return !0;
48
- const o = u(e);
49
- return n.allowedTypes.some((t) => o.includes(String(t).toLowerCase()));
50
- }, S = y(() => {
51
- if (n.allowedTypes.length !== 0)
52
+ ), i = (e, t) => Object.prototype.hasOwnProperty.call(t, e), K = (e) => {
53
+ const t = y(e);
54
+ return e.type.toLowerCase().startsWith("image/") || t.some((o) => i(o, V));
55
+ }, P = (e) => {
56
+ if (r.allowedTypes.length === 0) return !0;
57
+ const t = y(e);
58
+ return r.allowedTypes.some((o) => t.includes(String(o).toLowerCase()));
59
+ }, $ = C(() => {
60
+ if (r.allowedTypes.length !== 0)
52
61
  return Array.from(
53
62
  new Set(
54
- n.allowedTypes.flatMap((e) => {
55
- const o = String(e).toLowerCase(), t = T[o], r = v[o] || o;
56
- return o.includes("/") ? o : t ? [`.${r}`, t] : `.${r}`;
63
+ r.allowedTypes.flatMap((e) => {
64
+ const t = String(e).toLowerCase(), o = B[t], n = T[t] || t;
65
+ return t.includes("/") ? t : o ? [`.${n}`, o] : `.${n}`;
57
66
  })
58
67
  )
59
68
  ).join(",");
60
- }), V = (e) => {
61
- const o = u(e);
62
- let t = H;
63
- return (e.type.toLowerCase().startsWith("image/") || o.some((r) => i(r, A))) && (t = te), (e.type.toLowerCase().startsWith("audio/") || o.some((r) => i(r, K))) && (t = Y), (e.type.toLowerCase().startsWith("video/") || o.some((r) => i(r, z))) && (t = Z), o.some((r) => i(r, G)) && (t = ee), t;
64
- }, p = F(null), a = F([...n.modelValue]), l = /* @__PURE__ */ new Set(), m = () => {
65
- const e = p.value;
69
+ }), z = (e) => {
70
+ const t = y(e);
71
+ let o = le;
72
+ return (e.type.toLowerCase().startsWith("image/") || t.some((n) => i(n, V))) && (o = ye), (e.type.toLowerCase().startsWith("audio/") || t.some((n) => i(n, se))) && (o = me), (e.type.toLowerCase().startsWith("video/") || t.some((n) => i(n, ae))) && (o = ce), t.some((n) => i(n, ie)) && (o = fe), o;
73
+ }, u = q(null), a = q([...F.value]), l = /* @__PURE__ */ new Set(), h = () => {
74
+ const e = u.value;
66
75
  e && (e.value = "");
67
- }, c = (e) => {
76
+ }, g = (e) => {
68
77
  l.has(e) && (URL.revokeObjectURL(e), l.delete(e));
69
- }, N = (e) => {
70
- const o = new Set(e.map((t) => t.previewUrl));
71
- Array.from(l).forEach((t) => {
72
- o.has(t) || c(t);
78
+ }, x = (e) => {
79
+ const t = new Set(e.map((o) => o.previewUrl));
80
+ Array.from(l).forEach((o) => {
81
+ t.has(o) || g(o);
73
82
  });
74
- }, h = (e) => {
75
- const o = [...e];
76
- a.value = o, d("update:model-value", o);
77
- }, O = () => {
78
- n.disabled || !p.value || p.value.click();
79
- }, j = (e) => {
80
- if (n.disabled) return;
81
- const o = e.target, t = Array.from(o.files || []), r = [];
82
- t.forEach((s) => {
83
- if (!L(s)) {
84
- d("on-unsupported-file-type-error", s.type || f(s.name) || s.name);
83
+ }, b = (e) => {
84
+ const t = [...e];
85
+ a.value = t, L(t);
86
+ }, U = (e) => {
87
+ const t = v?.validateField(f.value, e);
88
+ return {
89
+ valid: t?.valid.value ?? !0,
90
+ errors: t?.errors.value ?? []
91
+ };
92
+ }, G = () => {
93
+ r.disabled || !u.value || u.value.click();
94
+ }, H = (e) => {
95
+ if (r.disabled) return;
96
+ const t = e.target, o = Array.from(t.files || []), n = r.multiple ? o : o.slice(0, 1), d = [];
97
+ if (n.forEach((s) => {
98
+ if (!P(s)) {
99
+ c("on-unsupported-file-type-error", s.type || I(s.name) || s.name);
85
100
  return;
86
101
  }
87
- const b = URL.createObjectURL(s);
88
- l.add(b), r.push({ data: s, previewUrl: b });
89
- }), m(), r.length > 0 && h([...a.value, ...r]);
90
- }, k = (e) => {
91
- if (n.disabled) return;
92
- const o = a.value.findIndex((t) => t.data.name === e);
93
- if (o !== -1) {
94
- const t = a.value[o];
95
- c(t.previewUrl), m(), h(a.value.filter((r, s) => s !== o));
102
+ const p = r.multiple ? [...a.value.map((w) => w.data), ...d, s] : [s], m = U(p);
103
+ if (!m.valid) {
104
+ c("on-file-validation-error", { file: s, errors: m.errors });
105
+ return;
106
+ }
107
+ d.push(s);
108
+ }), h(), d.length > 0) {
109
+ const s = d.map((m) => {
110
+ const w = URL.createObjectURL(m);
111
+ return l.add(w), { data: m, previewUrl: w };
112
+ }), p = r.multiple ? [...a.value, ...s] : s;
113
+ x(p), b(p), v?.validateField(f.value, p);
114
+ }
115
+ }, J = (e) => {
116
+ if (r.disabled) return;
117
+ const t = a.value.findIndex((o) => o.data.name === e);
118
+ if (t !== -1) {
119
+ const o = a.value[t];
120
+ g(o.previewUrl), h();
121
+ const n = a.value.filter((d, s) => s !== t);
122
+ b(n), v?.validateField(f.value, n);
96
123
  }
97
124
  };
98
- E(
99
- () => n.modelValue,
125
+ Z(
126
+ F,
100
127
  (e) => {
101
- const o = [...e];
102
- N(o), a.value = o, o.length === 0 && m();
128
+ const t = [...e];
129
+ x(t), a.value = t, t.length === 0 && h();
103
130
  },
104
131
  { deep: !0 }
105
- ), W(() => {
106
- Array.from(l).forEach((e) => c(e));
107
- }), U({ inputDOMRef: p });
108
- const q = y(
109
- () => $({
110
- "nmorph-file-upload": [`${n.disabled && "disabled"}`]
132
+ ), ee(() => {
133
+ Array.from(l).forEach((e) => g(e));
134
+ }), j({ inputDOMRef: u });
135
+ const Q = C(
136
+ () => te({
137
+ "nmorph-file-upload": [r.disabled && "disabled"]
111
138
  })
112
- ), x = { t: w, props: n, emit: d, computedButtonText: B, knownResolutionEntries: g, extensionByResolution: v, getPlainType: C, getFileExtension: f, getKnownResolutionByMime: I, getFileTypeCandidates: u, isKnownFileType: i, isImageFile: P, isFileAllowed: L, inputAccept: S, typeFileIconMap: V, inputDOMRef: p, files: a, createdPreviewUrls: l, resetInputValue: m, revokePreviewUrl: c, revokeRemovedPreviewUrls: N, filesChanged: h, openFileSelector: O, handleFileUpload: j, removeFile: k, modifiers: q, get NmorphButton() {
113
- return X;
139
+ ), _ = { t: N, props: r, emit: c, computedButtonText: k, id: f, name: E, autocomplete: W, tabindex: D, modelValue: F, updateModelValue: L, formData: v, knownResolutionEntries: R, extensionByResolution: T, getPlainType: A, getFileExtension: I, getKnownResolutionByMime: S, getFileTypeCandidates: y, isKnownFileType: i, isImageFile: K, isFileAllowed: P, inputAccept: $, typeFileIconMap: z, inputDOMRef: u, files: a, createdPreviewUrls: l, resetInputValue: h, revokePreviewUrl: g, revokeRemovedPreviewUrls: x, filesChanged: b, getFormValidationResult: U, openFileSelector: G, handleFileUpload: H, removeFile: J, modifiers: Q, get NmorphButton() {
140
+ return pe;
114
141
  }, get NmorphIcon() {
115
- return Q;
142
+ return de;
116
143
  }, get NmorphImagePreview() {
117
- return J;
144
+ return ue;
118
145
  }, get NmorphIconCross() {
119
- return oe;
146
+ return ve;
120
147
  } };
121
- return Object.defineProperty(x, "__isScriptSetup", { enumerable: !1, value: !0 }), x;
148
+ return Object.defineProperty(_, "__isScriptSetup", { enumerable: !1, value: !0 }), _;
122
149
  }
123
150
  });
124
151
  export {
125
- ye as default
152
+ Pe as default
126
153
  };
@@ -1,23 +1,23 @@
1
- import { defineComponent as i, computed as p, provide as s } from "vue";
2
- import { useModifiers as d } from "../../../utils/create-modifiers.js";
3
- import { useFormValidation as n } from "../../../hooks/use-form-validation.js";
4
- const c = /* @__PURE__ */ i({
1
+ import { defineComponent as i, computed as p, provide as n } from "vue";
2
+ import { useModifiers as s } from "../../../utils/create-modifiers.js";
3
+ import { useFormValidation as d } from "../../../hooks/use-form-validation.js";
4
+ const _ = /* @__PURE__ */ i({
5
5
  __name: "NmorphForm",
6
6
  props: {
7
- value: { type: Object, required: !0 },
7
+ value: { type: null, required: !0 },
8
8
  validateImmediately: { type: Boolean, required: !1, default: !1 }
9
9
  },
10
10
  setup(t, { expose: a }) {
11
11
  const e = t, m = p(
12
- () => d({
12
+ () => s({
13
13
  "nmorph-form": []
14
14
  })
15
- ), o = n(e.value, e.validateImmediately);
16
- a({ formData: o }), s("form-data", o);
15
+ ), o = d(e.value, e.validateImmediately);
16
+ a({ formData: o }), n("form-data", o);
17
17
  const r = { props: e, modifiers: m, formValidationData: o };
18
18
  return Object.defineProperty(r, "__isScriptSetup", { enumerable: !1, value: !0 }), r;
19
19
  }
20
20
  });
21
21
  export {
22
- c as default
22
+ _ as default
23
23
  };
@@ -1,10 +1,10 @@
1
1
  import './NmorphFormItem.css';
2
- import { defineComponent as p, inject as s, computed as o, provide as f, toRef as c } from "vue";
3
- import { useModifiers as h } from "../../../../../utils/create-modifiers.js";
4
- import v from "./inner-components/nmorph-error-box/NmorphErrorBox.vue.js";
5
- import _ from "./inner-components/nmorph-validation-icon/NmorphValidationIcon.vue.js";
6
- import { nmorphFormItemInputDataKey as y } from "../../use-form-item-input.js";
7
- const B = /* @__PURE__ */ p({
2
+ import { defineComponent as y, inject as S, computed as e, unref as d, provide as b, toRef as I } from "vue";
3
+ import { useModifiers as g } from "../../../../../utils/create-modifiers.js";
4
+ import q from "./inner-components/nmorph-error-box/NmorphErrorBox.vue.js";
5
+ import B from "./inner-components/nmorph-validation-icon/NmorphValidationIcon.vue.js";
6
+ import { nmorphFormItemInputDataKey as x } from "../../use-form-item-input.js";
7
+ const T = /* @__PURE__ */ y({
8
8
  __name: "NmorphFormItem",
9
9
  props: {
10
10
  id: { type: String, required: !0 },
@@ -15,31 +15,40 @@ const B = /* @__PURE__ */ p({
15
15
  showValidationIcon: { type: Boolean, required: !1, default: !0 },
16
16
  staticErrorBoxSpace: { type: Boolean, required: !1, default: !1 }
17
17
  },
18
- setup(n, { expose: d }) {
19
- d();
20
- const e = n, r = s("form-data"), t = o(() => r?.fields[e.id]), a = o(() => t.value), u = o(
21
- () => !!a.value && !!t?.value?.touched && e.showValidationIcon
22
- ), i = o(() => a.value && t.value?.touched);
23
- f(y, {
24
- id: c(e, "id"),
25
- name: o(() => e.name || e.id),
26
- autocomplete: o(() => e.autocomplete || void 0)
18
+ setup(v, { expose: h }) {
19
+ h();
20
+ const o = v, t = S("form-data"), a = e(() => t?.fields[o.id]), r = e(() => t?.formValue[o.id]), u = e(() => r.value?.value), n = e(() => r.value?.rules || []), s = e(() => d(a.value?.errors) || []), f = e(() => d(a.value?.valid) ?? !0), p = e(() => d(a.value?.touched) ?? !1), l = e(() => a.value), V = e(
21
+ () => !!l.value && !!a?.value?.touched && o.showValidationIcon
22
+ ), m = e(() => l.value && a.value?.touched);
23
+ b(x, {
24
+ id: I(o, "id"),
25
+ name: e(() => o.name || o.id),
26
+ autocomplete: e(() => o.autocomplete || void 0),
27
+ value: u,
28
+ rules: n,
29
+ errors: s,
30
+ valid: f,
31
+ touched: p,
32
+ updateValue: (i) => t?.updateFieldValue(o.id, i),
33
+ validate: (i) => {
34
+ t?.validateField(o.id, i);
35
+ }
27
36
  });
28
- const m = o(
29
- () => h({
37
+ const _ = e(
38
+ () => g({
30
39
  "nmorph-form-item": [
31
- `${e.label && "labeled"}`,
32
- `${i.value && (t.value?.valid ? "valid" : "invalid")}`
40
+ o.label && "labeled",
41
+ m.value && (a.value?.valid ? "valid" : "invalid")
33
42
  ]
34
43
  })
35
- ), l = { props: e, formData: r, validationData: t, ableToShowValidation: a, showStatusIcon: u, ableToAddValidationModifiers: i, modifiers: m, get NmorphValidationIcon() {
36
- return _;
44
+ ), 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() {
45
+ return B;
37
46
  }, get NmorphErrorBox() {
38
- return v;
47
+ return q;
39
48
  } };
40
- return Object.defineProperty(l, "__isScriptSetup", { enumerable: !1, value: !0 }), l;
49
+ return Object.defineProperty(c, "__isScriptSetup", { enumerable: !1, value: !0 }), c;
41
50
  }
42
51
  });
43
52
  export {
44
- B as default
53
+ T as default
45
54
  };
@@ -17,7 +17,7 @@ const h = /* @__PURE__ */ p({
17
17
  }), a = s(
18
18
  () => l({
19
19
  nmorph: [u[e.height]],
20
- "nmorph-error-box": [`${e.staticHeight && "static-height"}`, `${t.value.length === 0 && "empty"}`]
20
+ "nmorph-error-box": [e.staticHeight && "static-height", t.value.length === 0 && "empty"]
21
21
  })
22
22
  ), o = { props: e, currentError: t, modifiers: a };
23
23
  return Object.defineProperty(o, "__isScriptSetup", { enumerable: !1, value: !0 }), o;
@@ -1,14 +1,35 @@
1
- import { inject as d, useId as i, computed as e } from "vue";
2
- const l = "nmorph-form-item-input-data", I = (t) => {
3
- const o = d(l, void 0), a = `nmorph-${i()}`, n = e(() => t.id || o?.id.value || a), m = e(() => t.name || o?.name.value || n.value), u = e(() => t.autocomplete || o?.autocomplete.value || void 0), c = e(() => t.tabindex ?? 0);
1
+ import { inject as r, getCurrentInstance as s, computed as n, useId as v } from "vue";
2
+ const i = "nmorph-form-item-input-data", f = (e) => {
3
+ const o = r(i, void 0), u = `nmorph-${v()}`, a = n(() => e.id || o?.id.value || u), m = n(() => e.name || o?.name.value || a.value), l = n(() => e.autocomplete || o?.autocomplete.value || void 0), d = n(() => e.tabindex ?? 0);
4
4
  return {
5
- id: n,
5
+ id: a,
6
6
  name: m,
7
- autocomplete: u,
8
- tabindex: c
7
+ autocomplete: l,
8
+ tabindex: d
9
+ };
10
+ }, c = (e, o) => Object.prototype.hasOwnProperty.call(e, o), h = (e, o, u) => {
11
+ const a = r(i, void 0), m = s(), l = n(() => {
12
+ const t = m?.vnode.props || {};
13
+ return c(t, "modelValue") || c(t, "model-value");
14
+ }), d = n(() => {
15
+ if (l.value) return e.modelValue !== void 0 ? e.modelValue : u;
16
+ const t = a?.value.value;
17
+ return t !== void 0 ? t : e.modelValue !== void 0 ? e.modelValue : u;
18
+ });
19
+ return {
20
+ formItemInputData: a,
21
+ modelValue: d,
22
+ modelValueIsControlled: l,
23
+ updateModelValue: (t) => {
24
+ l.value || a?.updateValue(t), o(t);
25
+ },
26
+ validateModelValue: (t = d.value) => {
27
+ a?.validate(t);
28
+ }
9
29
  };
10
30
  };
11
31
  export {
12
- l as nmorphFormItemInputDataKey,
13
- I as useFormItemInput
32
+ i as nmorphFormItemInputDataKey,
33
+ f as useFormItemInput,
34
+ h as useFormItemModel
14
35
  };
@@ -1,13 +1,13 @@
1
1
  import './NmorphNumberInput.css';
2
- import { defineComponent as S, computed as n, ref as l, watch as P } from "vue";
3
- import { NmorphComponentHeight as H } from "../../../types/index.js";
4
- import { useModifiers as M } from "../../../utils/create-modifiers.js";
5
- import { useFormItemInput as R } from "../nmorph-form/use-form-item-input.js";
6
- import T from "../../../assets/icons/plus-thin.svg.js";
7
- import D from "../../../assets/icons/minus-thin.svg.js";
8
- import k from "../../basic/nmorph-icon/NmorphIcon.vue.js";
9
- import z from "../../basic/nmorph-button/NmorphButton.vue.js";
10
- const K = /* @__PURE__ */ S({
2
+ import { defineComponent as H, computed as n, ref as s, watch as p } from "vue";
3
+ import { NmorphComponentHeight as R } from "../../../types/index.js";
4
+ import { useModifiers as T } from "../../../utils/create-modifiers.js";
5
+ import { useFormItemInput as D, useFormItemModel as V } from "../nmorph-form/use-form-item-input.js";
6
+ import k from "../../../assets/icons/plus-thin.svg.js";
7
+ import z from "../../../assets/icons/minus-thin.svg.js";
8
+ import C from "../../basic/nmorph-icon/NmorphIcon.vue.js";
9
+ import F from "../../basic/nmorph-button/NmorphButton.vue.js";
10
+ const L = /* @__PURE__ */ H({
11
11
  __name: "NmorphNumberInput",
12
12
  props: {
13
13
  modelValue: { type: Number, required: !1, default: 0 },
@@ -23,20 +23,13 @@ const K = /* @__PURE__ */ S({
23
23
  tabindex: { type: Number, required: !1 }
24
24
  },
25
25
  emits: ["update:model-value"],
26
- setup(m, { expose: p, emit: s }) {
27
- const e = m, { id: d, name: c, autocomplete: f, tabindex: h } = R(e), g = n(
28
- () => M({
29
- nmorph: [H[e.height]],
30
- "nmorph-number-input": [
31
- `${e.disabled && "disabled"}`,
32
- `${e.actionBtnPositionRight && "action-btn-position-right"}`
33
- ]
26
+ setup(d, { expose: c, emit: f }) {
27
+ const e = d, { id: h, name: g, autocomplete: b, tabindex: x } = D(e), N = n(
28
+ () => T({
29
+ nmorph: [R[e.height]],
30
+ "nmorph-number-input": [e.disabled && "disabled", e.actionBtnPositionRight && "action-btn-position-right"]
34
31
  })
35
- ), t = l(e.modelValue), b = () => {
36
- t.value += e.step;
37
- }, x = () => {
38
- t.value -= e.step;
39
- }, N = n(() => t.value <= e.min), y = n(() => t.value >= e.max), v = n(() => e.height === "thick" ? "16px" : "12px"), o = {
32
+ ), a = {
40
33
  thick: {
41
34
  default: "12px",
42
35
  right: "8px"
@@ -49,31 +42,41 @@ const K = /* @__PURE__ */ S({
49
42
  default: "8px",
50
43
  right: "5px"
51
44
  }
52
- }, I = n(() => {
45
+ }, v = n(() => {
53
46
  const i = e.actionBtnPositionRight ? "right" : "default";
54
- return o[e.height][i];
55
- }), a = s, q = (i) => {
56
- const B = i.target;
57
- let _ = Number(B.value);
58
- t.value = _;
47
+ return a[e.height][i];
48
+ }), u = f, { modelValue: o, updateModelValue: l } = V(
49
+ e,
50
+ (i) => u("update:model-value", i),
51
+ 0
52
+ ), t = s(o.value), y = () => {
53
+ t.value += e.step;
54
+ }, I = () => {
55
+ t.value -= e.step;
56
+ }, q = n(() => t.value <= e.min), B = n(() => t.value >= e.max), _ = n(() => e.height === "thick" ? "16px" : "12px"), M = (i) => {
57
+ const S = i.target;
58
+ let P = Number(S.value);
59
+ t.value = P;
59
60
  };
60
- P(t, (i) => {
61
- i > e.max && (t.value = e.max, r.value?.blur()), t.value < e.min && (t.value = e.min, r.value?.blur()), a("update:model-value", i);
61
+ p(t, (i) => {
62
+ i > e.max && (t.value = e.max, r.value?.blur()), t.value < e.min && (t.value = e.min, r.value?.blur()), l(i);
63
+ }), p(o, (i) => {
64
+ t.value = i;
62
65
  });
63
- const r = l(null);
64
- p({ inputDOMRef: r });
65
- const u = { props: e, id: d, name: c, autocomplete: f, tabindex: h, modifiers: g, initialValue: t, increaseHandler: b, decreaseHandler: x, minBtnDisabled: N, maxBtnDisabled: y, rightActionBtnHeight: v, iconSizeMap: o, actionBtnIconSize: I, emit: a, inputHandler: q, inputDOMRef: r, get NmorphButton() {
66
- return z;
66
+ const r = s(null);
67
+ c({ inputDOMRef: r });
68
+ const m = { props: e, id: h, name: g, autocomplete: b, tabindex: x, modifiers: N, iconSizeMap: a, actionBtnIconSize: v, emit: u, modelValue: o, updateModelValue: l, initialValue: t, increaseHandler: y, decreaseHandler: I, minBtnDisabled: q, maxBtnDisabled: B, rightActionBtnHeight: _, inputHandler: M, inputDOMRef: r, get NmorphButton() {
69
+ return F;
67
70
  }, get NmorphIcon() {
68
- return k;
71
+ return C;
69
72
  }, get NmorphIconMinusThin() {
70
- return D;
73
+ return z;
71
74
  }, get NmorphIconPlusThin() {
72
- return T;
75
+ return k;
73
76
  } };
74
- return Object.defineProperty(u, "__isScriptSetup", { enumerable: !1, value: !0 }), u;
77
+ return Object.defineProperty(m, "__isScriptSetup", { enumerable: !1, value: !0 }), m;
75
78
  }
76
79
  });
77
80
  export {
78
- K as default
81
+ L as default
79
82
  };