@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.
- package/dist/components/basic/nmorph-button/NmorphButton.vue2.js +8 -8
- package/dist/components/basic/nmorph-icon/NmorphIcon.vue2.js +3 -3
- package/dist/components/basic/nmorph-layout/NmorphLayout.vue2.js +14 -13
- package/dist/components/basic/nmorph-link/NmorphLink.vue2.js +1 -1
- package/dist/components/basic/nmorph-scroll/NmorphScroll.css +1 -0
- package/dist/components/basic/nmorph-scroll/NmorphScroll.vue.js +6 -4
- package/dist/components/basic/nmorph-scroll/NmorphScroll.vue2.js +1 -0
- package/dist/components/basic/nmorph-space/NmorphSpace.vue2.js +15 -19
- package/dist/components/data/nmorph-avatar/NmorphAvatar.css +1 -1
- package/dist/components/data/nmorph-avatar/NmorphAvatar.vue2.js +5 -5
- package/dist/components/data/nmorph-badge/NmorphBadge.vue2.js +37 -36
- package/dist/components/data/nmorph-calendar/NmorphCalendar.vue2.js +41 -40
- package/dist/components/data/nmorph-card/NmorphCard.vue2.js +19 -15
- package/dist/components/data/nmorph-collapse/components/nmorph-collapse-item/NmorphCollapseItem.vue2.js +5 -9
- package/dist/components/data/nmorph-empty/NmorphEmpty.vue.js +3 -3
- package/dist/components/data/nmorph-empty/NmorphEmpty.vue2.js +17 -14
- package/dist/components/data/nmorph-image/NmorphImage.css +1 -0
- package/dist/components/data/nmorph-image/NmorphImage.vue.js +14 -12
- package/dist/components/data/nmorph-image/NmorphImage.vue2.js +3 -2
- package/dist/components/data/nmorph-image-preview/NmorphImagePreview.vue2.js +36 -35
- package/dist/components/data/nmorph-pagination/NmorphPagination.vue2.js +1 -1
- package/dist/components/data/nmorph-progress/NmorphProgress.vue2.js +19 -18
- package/dist/components/data/nmorph-qr-code/NmorphQRCode.vue2.js +20 -19
- package/dist/components/data/nmorph-skeleton/NmorphSkeleton.vue2.js +1 -1
- package/dist/components/data/nmorph-table/NmorphTable.vue2.js +39 -43
- package/dist/components/data/nmorph-virtual-list/NmorphVirtualList.vue2.js +34 -33
- package/dist/components/feedback/nmorph-alert/NmorphAlert.vue2.js +1 -1
- package/dist/components/feedback/nmorph-callout/NmorphCallout.vue2.js +7 -6
- package/dist/components/feedback/nmorph-dialog/NmorphDialog.css +1 -1
- package/dist/components/feedback/nmorph-dialog/NmorphDialog.vue.js +25 -20
- package/dist/components/feedback/nmorph-dialog/NmorphDialog.vue2.js +37 -37
- package/dist/components/feedback/nmorph-drawer/NmorphDrawer.vue2.js +22 -21
- package/dist/components/feedback/nmorph-tooltip/NmorphTooltip.vue2.js +26 -25
- package/dist/components/form/nmorph-autocomplete/NmorphAutocomplete.vue2.js +65 -71
- package/dist/components/form/nmorph-checkbox/NmorphCheckbox.css +1 -1
- package/dist/components/form/nmorph-checkbox/NmorphCheckbox.vue2.js +30 -28
- package/dist/components/form/nmorph-checkbox-group/NmorphCheckboxGroup.vue2.js +25 -20
- package/dist/components/form/nmorph-color-picker/NmorphColorPicker.vue2.js +43 -42
- package/dist/components/form/nmorph-date-picker/NmorphDatePicker.vue2.js +53 -40
- package/dist/components/form/nmorph-file-upload/NmorphFileUpload.vue.js +20 -16
- package/dist/components/form/nmorph-file-upload/NmorphFileUpload.vue2.js +113 -86
- package/dist/components/form/nmorph-form/NmorphForm.vue2.js +9 -9
- package/dist/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue2.js +33 -24
- package/dist/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-error-box/NmorphErrorBox.vue2.js +1 -1
- package/dist/components/form/nmorph-form/use-form-item-input.js +29 -8
- package/dist/components/form/nmorph-number-input/NmorphNumberInput.vue2.js +42 -39
- package/dist/components/form/nmorph-otp-input/NmorphOTPInput.vue2.js +66 -62
- package/dist/components/form/nmorph-radio/NmorphRadio.css +1 -1
- package/dist/components/form/nmorph-radio/NmorphRadio.vue2.js +1 -1
- package/dist/components/form/nmorph-radio-group/NmorphRadioGroup.vue2.js +24 -22
- package/dist/components/form/nmorph-select/NmorphSelect.css +1 -1
- package/dist/components/form/nmorph-select/NmorphSelect.vue2.js +83 -81
- package/dist/components/form/nmorph-select/components/nmorph-select-option/NmorphSelectOption.vue2.js +4 -4
- package/dist/components/form/nmorph-select-button/NmorphSelectButton.vue2.js +28 -25
- package/dist/components/form/nmorph-select-button/components/nmorph-select-button-item/NmorphSelectButtonItem.vue2.js +1 -1
- package/dist/components/form/nmorph-slider/NmorphSlider.vue2.js +51 -49
- package/dist/components/form/nmorph-switch/NmorphSwitch.vue2.js +35 -33
- package/dist/components/form/nmorph-text-input/NmorphTextInput.css +1 -0
- package/dist/components/form/nmorph-text-input/NmorphTextInput.vue.js +5 -3
- package/dist/components/form/nmorph-text-input/NmorphTextInput.vue2.js +37 -35
- package/dist/components/form/nmorph-textarea/NmorphTextarea.vue.js +1 -1
- package/dist/components/form/nmorph-textarea/NmorphTextarea.vue2.js +30 -26
- package/dist/components/form/nmorph-time-picker/NmorphTimePicker.vue.js +1 -1
- package/dist/components/form/nmorph-time-picker/NmorphTimePicker.vue2.js +68 -66
- package/dist/components/navigation/nmorph-backtop/NmorphBacktop.vue2.js +1 -1
- package/dist/components/navigation/nmorph-dropdown/NmorphDropdown.vue2.js +32 -31
- package/dist/components/navigation/nmorph-tabs/NmorphTabs.vue2.js +1 -1
- package/dist/components/others/nmorph-overlay/NmorphOverlay.vue2.js +1 -1
- package/dist/hooks/use-common-styles.js +18 -278
- package/dist/hooks/use-field-validation.js +71 -42
- package/dist/hooks/use-form-validation.js +62 -24
- package/dist/hooks/use-virtual-list.js +38 -32
- package/dist/index.umd.js +26 -286
- package/dist/package.json.js +1 -1
- package/dist/src/components/basic/nmorph-button/NmorphButton.vue.d.ts +2 -2
- package/dist/src/components/basic/nmorph-link/NmorphLink.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-avatar/NmorphAvatar.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-badge/NmorphBadge.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-collapse/components/nmorph-collapse-item/NmorphCollapseItem.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-empty/NmorphEmpty.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-pagination/NmorphPagination.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-progress/NmorphProgress.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-table/NmorphTable.vue.d.ts +1 -1
- package/dist/src/components/data/nmorph-tag-list/components/nmorph-tag-item/NmorphTagItem.vue.d.ts +1 -1
- package/dist/src/components/feedback/nmorph-callout/NmorphCallout.vue.d.ts +1 -1
- package/dist/src/components/feedback/nmorph-dialog/NmorphDialog.vue.d.ts +4 -4
- package/dist/src/components/form/nmorph-autocomplete/NmorphAutocomplete.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-checkbox-group/NmorphCheckboxGroup.vue.d.ts +3 -3
- package/dist/src/components/form/nmorph-color-picker/NmorphColorPicker.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-date-picker/NmorphDatePicker.vue.d.ts +3 -3
- package/dist/src/components/form/nmorph-file-upload/NmorphFileUpload.vue.d.ts +6 -3
- package/dist/src/components/form/nmorph-file-upload/types.d.ts +4 -0
- package/dist/src/components/form/nmorph-form/components/nmorph-form-item/NmorphFormItem.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-form/components/nmorph-form-item/inner-components/nmorph-error-box/NmorphErrorBox.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-form/types.d.ts +15 -5
- package/dist/src/components/form/nmorph-form/use-form-item-input.d.ts +10 -0
- package/dist/src/components/form/nmorph-number-input/NmorphNumberInput.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-otp-input/NmorphOTPInput.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-radio-group/NmorphRadioGroup.vue.d.ts +3 -3
- package/dist/src/components/form/nmorph-select/NmorphSelect.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-select-button/NmorphSelectButton.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-text-input/NmorphTextInput.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-textarea/NmorphTextarea.vue.d.ts +1 -1
- package/dist/src/components/form/nmorph-time-picker/NmorphTimePicker.vue.d.ts +1 -1
- package/dist/src/hooks/use-field-validation.d.ts +15 -0
- package/dist/src/hooks/use-form-validation.d.ts +5 -0
- package/dist/src/hooks/use-virtual-list.d.ts +6 -0
- package/dist/src/types/index.d.ts +2 -1
- package/dist/src/utils/common.d.ts +5 -0
- package/dist/src/utils/create-modifiers.d.ts +4 -2
- package/dist/style.css +1 -1
- package/dist/utils/common.js +9 -3
- package/dist/utils/create-modifiers.js +6 -6
- package/package.json +1 -1
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import './NmorphCheckbox.css';
|
|
2
|
-
import { defineComponent as
|
|
3
|
-
import { useModifiers as
|
|
4
|
-
import { NmorphSelectionControlHeight as
|
|
5
|
-
|
|
2
|
+
import { defineComponent as x, inject as i, watch as S, ref as n, computed as d } from "vue";
|
|
3
|
+
import { useModifiers as q } from "../../../utils/create-modifiers.js";
|
|
4
|
+
import { NmorphSelectionControlHeight as V } from "../../../types/index.js";
|
|
5
|
+
import { useFormItemModel as C } from "../nmorph-form/use-form-item-input.js";
|
|
6
|
+
const H = /* @__PURE__ */ x({
|
|
6
7
|
__name: "NmorphCheckbox",
|
|
7
8
|
props: {
|
|
8
9
|
id: { type: String, required: !1, default: "" },
|
|
@@ -13,43 +14,44 @@ const $ = /* @__PURE__ */ y({
|
|
|
13
14
|
height: { type: null, required: !1 }
|
|
14
15
|
},
|
|
15
16
|
emits: ["update:model-value"],
|
|
16
|
-
setup(
|
|
17
|
-
const
|
|
17
|
+
setup(g, { expose: b, emit: _ }) {
|
|
18
|
+
const o = i(
|
|
18
19
|
"checkbox-group-selected-value",
|
|
19
20
|
void 0
|
|
20
|
-
),
|
|
21
|
+
), u = i(
|
|
21
22
|
"change-checkbox-value-handler",
|
|
22
23
|
void 0
|
|
23
|
-
),
|
|
24
|
-
|
|
25
|
-
() =>
|
|
26
|
-
|
|
27
|
-
t.value = _;
|
|
28
|
-
}
|
|
24
|
+
), s = i("checkbox-group-height", void 0), e = g, c = _, { modelValue: l, updateModelValue: p } = C(
|
|
25
|
+
e,
|
|
26
|
+
(r) => c("update:model-value", r),
|
|
27
|
+
!1
|
|
29
28
|
);
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
29
|
+
S(l, (r) => {
|
|
30
|
+
t.value = r;
|
|
31
|
+
});
|
|
32
|
+
const f = n(null);
|
|
33
|
+
b({ inputDOMRef: f });
|
|
34
|
+
const a = o !== void 0, t = a ? n(o.value) : n(l.value), h = d(() => a ? o.value.includes(e.id) : l.value), m = d(() => e.height || s?.value || "thin"), y = () => {
|
|
33
35
|
if (!e.disabled) {
|
|
34
|
-
if (!
|
|
35
|
-
t.value = !t.value, p(
|
|
36
|
+
if (!a) {
|
|
37
|
+
t.value = !t.value, p(t.value);
|
|
36
38
|
return;
|
|
37
39
|
}
|
|
38
|
-
|
|
40
|
+
u && Array.isArray(t.value) && u(e.id, t.value);
|
|
39
41
|
}
|
|
40
|
-
},
|
|
41
|
-
() =>
|
|
42
|
-
nmorph: [
|
|
42
|
+
}, k = d(
|
|
43
|
+
() => q({
|
|
44
|
+
nmorph: [V[m.value]],
|
|
43
45
|
"nmorph-checkbox": [
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
46
|
+
h.value && "checked",
|
|
47
|
+
e.disabled && "disabled",
|
|
48
|
+
e.design === "button" && "button"
|
|
47
49
|
]
|
|
48
50
|
})
|
|
49
|
-
),
|
|
50
|
-
return Object.defineProperty(
|
|
51
|
+
), v = { groupSelectedValue: o, changeValue: u, groupHeight: s, props: e, emit: c, modelValue: l, updateModelValue: p, inputDOMRef: f, hasGroup: a, initialValue: t, checked: h, height: m, handleChange: y, modifiers: k };
|
|
52
|
+
return Object.defineProperty(v, "__isScriptSetup", { enumerable: !1, value: !0 }), v;
|
|
51
53
|
}
|
|
52
54
|
});
|
|
53
55
|
export {
|
|
54
|
-
|
|
56
|
+
H as default
|
|
55
57
|
};
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import './NmorphCheckboxGroup.css';
|
|
2
|
-
import { defineComponent as
|
|
3
|
-
import { useModifiers as
|
|
4
|
-
import
|
|
5
|
-
|
|
2
|
+
import { defineComponent as g, ref as b, watch as v, computed as p, provide as u } from "vue";
|
|
3
|
+
import { useModifiers as y } from "../../../utils/create-modifiers.js";
|
|
4
|
+
import { useFormItemModel as q } from "../nmorph-form/use-form-item-input.js";
|
|
5
|
+
import x from "../nmorph-checkbox/NmorphCheckbox.vue.js";
|
|
6
|
+
const N = /* @__PURE__ */ g({
|
|
6
7
|
__name: "NmorphCheckboxGroup",
|
|
7
8
|
props: {
|
|
8
|
-
modelValue: { type: Array, required: !
|
|
9
|
+
modelValue: { type: Array, required: !1, default: () => [] },
|
|
9
10
|
options: { type: Array, required: !1, default: () => [] },
|
|
10
11
|
design: { type: String, required: !1, default: "button" },
|
|
11
12
|
direction: { type: null, required: !1, default: "row" },
|
|
@@ -17,30 +18,34 @@ const _ = /* @__PURE__ */ m({
|
|
|
17
18
|
tabindex: { type: Number, required: !1 }
|
|
18
19
|
},
|
|
19
20
|
emits: ["update:model-value"],
|
|
20
|
-
setup(
|
|
21
|
-
|
|
22
|
-
const r =
|
|
23
|
-
|
|
24
|
-
() =>
|
|
21
|
+
setup(s, { expose: c, emit: f }) {
|
|
22
|
+
c();
|
|
23
|
+
const r = s, a = f, { modelValue: o, updateModelValue: l } = q(
|
|
24
|
+
r,
|
|
25
|
+
(t) => a("update:model-value", t),
|
|
26
|
+
[]
|
|
27
|
+
), e = b([...o.value]);
|
|
28
|
+
v(
|
|
29
|
+
o,
|
|
25
30
|
(t) => {
|
|
26
31
|
e.value = [...t];
|
|
27
32
|
},
|
|
28
33
|
{ deep: !0 }
|
|
29
34
|
);
|
|
30
|
-
const
|
|
31
|
-
e.value = e.value.includes(t) ? e.value.filter((
|
|
32
|
-
},
|
|
33
|
-
() =>
|
|
35
|
+
const i = (t) => {
|
|
36
|
+
e.value = e.value.includes(t) ? e.value.filter((h) => h !== t) : [...e.value, t], l(e.value);
|
|
37
|
+
}, m = p(
|
|
38
|
+
() => y({
|
|
34
39
|
"nmorph-checkbox-group": [r.design, r.direction]
|
|
35
40
|
})
|
|
36
|
-
),
|
|
37
|
-
|
|
38
|
-
const
|
|
39
|
-
return
|
|
41
|
+
), d = p(() => r.height);
|
|
42
|
+
u("checkbox-group-selected-value", e), u("change-checkbox-value-handler", i), u("checkbox-group-height", d);
|
|
43
|
+
const n = { props: r, emit: a, modelValue: o, updateModelValue: l, initialValue: e, changeHandler: i, modifiers: m, height: d, get NmorphCheckbox() {
|
|
44
|
+
return x;
|
|
40
45
|
} };
|
|
41
|
-
return Object.defineProperty(
|
|
46
|
+
return Object.defineProperty(n, "__isScriptSetup", { enumerable: !1, value: !0 }), n;
|
|
42
47
|
}
|
|
43
48
|
});
|
|
44
49
|
export {
|
|
45
|
-
|
|
50
|
+
N as default
|
|
46
51
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import './NmorphColorPicker.css';
|
|
2
|
-
import { defineComponent as
|
|
3
|
-
import { NmorphComponentHeight as
|
|
4
|
-
import { useModifiers as
|
|
5
|
-
import { useFormItemInput as
|
|
6
|
-
const
|
|
2
|
+
import { defineComponent as k, ref as g, watch as B, onMounted as H, computed as _ } from "vue";
|
|
3
|
+
import { NmorphComponentHeight as L } from "../../../types/index.js";
|
|
4
|
+
import { useModifiers as O } from "../../../utils/create-modifiers.js";
|
|
5
|
+
import { useFormItemInput as z, useFormItemModel as A } from "../nmorph-form/use-form-item-input.js";
|
|
6
|
+
const G = /* @__PURE__ */ k({
|
|
7
7
|
__name: "NmorphColorPicker",
|
|
8
8
|
props: {
|
|
9
9
|
modelValue: { type: String, required: !1, default: "" },
|
|
@@ -17,51 +17,52 @@ const E = /* @__PURE__ */ R({
|
|
|
17
17
|
tabindex: { type: Number, required: !1 }
|
|
18
18
|
},
|
|
19
19
|
emits: ["update:model-value", "focus", "blur"],
|
|
20
|
-
setup(
|
|
21
|
-
const
|
|
20
|
+
setup(q, { expose: S, emit: V }) {
|
|
21
|
+
const n = q, b = V, { id: x, name: I, tabindex: F } = z(n), { modelValue: d, updateModelValue: y } = A(
|
|
22
|
+
n,
|
|
23
|
+
(e) => b("update:model-value", e),
|
|
24
|
+
""
|
|
25
|
+
), l = (e, r = "#000000") => {
|
|
22
26
|
const t = e?.trim() || "";
|
|
23
|
-
return /^#[\da-f]{6}$/i.test(t) ? t.toLowerCase() : /^#[\da-f]{3}$/i.test(t) ? `#${t.slice(1).split("").map((
|
|
24
|
-
},
|
|
27
|
+
return /^#[\da-f]{6}$/i.test(t) ? t.toLowerCase() : /^#[\da-f]{3}$/i.test(t) ? `#${t.slice(1).split("").map((o) => `${o}${o}`).join("").toLowerCase()}` : r;
|
|
28
|
+
}, p = g(null), m = () => {
|
|
25
29
|
if (typeof document > "u") return "#006cb6";
|
|
26
|
-
const e =
|
|
27
|
-
return
|
|
28
|
-
}, a =
|
|
29
|
-
|
|
30
|
-
()
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
const r = e.target, t = s(r.value);
|
|
37
|
-
a.value = t, g("update:model-value", t);
|
|
38
|
-
}, p = (e) => [
|
|
30
|
+
const e = p.value || document.documentElement, r = getComputedStyle(e).getPropertyValue("--nmorph-accent-color").trim();
|
|
31
|
+
return l(r, "#006cb6");
|
|
32
|
+
}, a = g(l(d.value)), v = g(!1);
|
|
33
|
+
B(d, (e) => {
|
|
34
|
+
a.value = e ? l(e) : m();
|
|
35
|
+
});
|
|
36
|
+
const w = (e) => {
|
|
37
|
+
const r = e.target, t = l(r.value);
|
|
38
|
+
a.value = t, y(t);
|
|
39
|
+
}, f = (e) => [
|
|
39
40
|
parseInt(e.slice(1, 3), 16),
|
|
40
41
|
parseInt(e.slice(3, 5), 16),
|
|
41
42
|
parseInt(e.slice(5, 7), 16)
|
|
42
|
-
],
|
|
43
|
-
const [r, t,
|
|
44
|
-
return `rgb(${r}, ${t}, ${
|
|
45
|
-
},
|
|
46
|
-
const [r, t,
|
|
47
|
-
if (
|
|
48
|
-
return `hsl(0, 0%, ${Math.round(
|
|
49
|
-
const i =
|
|
50
|
-
let
|
|
51
|
-
return
|
|
43
|
+
], $ = (e) => {
|
|
44
|
+
const [r, t, o] = f(e);
|
|
45
|
+
return `rgb(${r}, ${t}, ${o})`;
|
|
46
|
+
}, M = (e) => {
|
|
47
|
+
const [r, t, o] = f(e).map((j) => j / 255), s = Math.max(r, t, o), u = Math.min(r, t, o), h = (s + u) / 2;
|
|
48
|
+
if (s === u)
|
|
49
|
+
return `hsl(0, 0%, ${Math.round(h * 100)}%)`;
|
|
50
|
+
const i = s - u, R = h > 0.5 ? i / (2 - s - u) : i / (s + u);
|
|
51
|
+
let c = 0;
|
|
52
|
+
return s === r ? c = (t - o) / i + (t < o ? 6 : 0) : s === t ? c = (o - r) / i + 2 : c = (r - t) / i + 4, `hsl(${Math.round(c * 60)}, ${Math.round(R * 100)}%, ${Math.round(h * 100)}%)`;
|
|
52
53
|
};
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
}),
|
|
56
|
-
const
|
|
57
|
-
() =>
|
|
58
|
-
nmorph: [
|
|
59
|
-
"nmorph-color-picker": [
|
|
54
|
+
H(() => {
|
|
55
|
+
d.value || (a.value = m());
|
|
56
|
+
}), S({ inputDOMRef: p });
|
|
57
|
+
const N = _(
|
|
58
|
+
() => O({
|
|
59
|
+
nmorph: [L[n.height], v.value && "focused"],
|
|
60
|
+
"nmorph-color-picker": [n.disabled && "disabled", n.displayFormat]
|
|
60
61
|
})
|
|
61
|
-
),
|
|
62
|
-
return Object.defineProperty(
|
|
62
|
+
), P = _(() => n.displayFormat === "rgb" ? $(a.value) : n.displayFormat === "hsl" ? M(a.value) : a.value.toUpperCase()), C = { props: n, emit: b, id: x, name: I, tabindex: F, modelValue: d, updateModelValue: y, normalizeColor: l, inputDOMRef: p, resolveAccentColor: m, currentValue: a, focused: v, handleInput: w, hexToRgb: f, formatRgb: $, formatHsl: M, modifiers: N, displayValue: P };
|
|
63
|
+
return Object.defineProperty(C, "__isScriptSetup", { enumerable: !1, value: !0 }), C;
|
|
63
64
|
}
|
|
64
65
|
});
|
|
65
66
|
export {
|
|
66
|
-
|
|
67
|
+
G as default
|
|
67
68
|
};
|
|
@@ -1,20 +1,21 @@
|
|
|
1
1
|
import './NmorphDatePicker.css';
|
|
2
|
-
import { defineComponent as
|
|
3
|
-
import { useModifiers as
|
|
4
|
-
import {
|
|
5
|
-
import P from "
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
|
|
2
|
+
import { defineComponent as B, computed as a, ref as u, watch as M } from "vue";
|
|
3
|
+
import { useModifiers as V } from "../../../utils/create-modifiers.js";
|
|
4
|
+
import { toCssSize as m } from "../../../utils/common.js";
|
|
5
|
+
import { NmorphComponentHeight as P } from "../../../types/index.js";
|
|
6
|
+
import j from "./inner-components/nmorph-clear-button/NmorphClearButton.vue.js";
|
|
7
|
+
import z from "./inner-components/nmorph-date-picker-content/NmorphDatePickerContent.vue.js";
|
|
8
|
+
import { useI18n as L } from "vue-i18n";
|
|
9
|
+
import { useFormItemInput as R, useFormItemModel as T } from "../nmorph-form/use-form-item-input.js";
|
|
10
|
+
import { formatDate as c } from "../../data/nmorph-calendar/utils.js";
|
|
11
|
+
import E from "../../../assets/icons/calendar.svg.js";
|
|
12
|
+
import G from "../../basic/nmorph-icon/NmorphIcon.vue.js";
|
|
13
|
+
import J from "../../navigation/nmorph-dropdown/NmorphDropdown.vue.js";
|
|
14
|
+
const le = /* @__PURE__ */ B({
|
|
14
15
|
__name: "NmorphDatePicker",
|
|
15
16
|
props: {
|
|
16
17
|
placeholder: { type: String, required: !1, default: "" },
|
|
17
|
-
modelValue: { type: [Date, Array, null], required: !
|
|
18
|
+
modelValue: { type: [Date, Array, null], required: !1, default: null },
|
|
18
19
|
type: { type: null, required: !1, default: "date" },
|
|
19
20
|
textSeparator: { type: String, required: !1, default: "-" },
|
|
20
21
|
initialDate: { type: Date, required: !1, default: () => /* @__PURE__ */ new Date() },
|
|
@@ -35,25 +36,29 @@ const Z = /* @__PURE__ */ O({
|
|
|
35
36
|
tabindex: { type: Number, required: !1 }
|
|
36
37
|
},
|
|
37
38
|
emits: ["update:model-value"],
|
|
38
|
-
setup(
|
|
39
|
-
|
|
40
|
-
const { t: p } =
|
|
39
|
+
setup(v, { expose: h, emit: y }) {
|
|
40
|
+
h();
|
|
41
|
+
const { t: p } = L(), e = v, { id: g, name: q, autocomplete: S } = R(e), n = a(() => e.placeholder ? e.placeholder : p("pickADate")), s = y, { modelValue: d, updateModelValue: i } = T(
|
|
42
|
+
e,
|
|
43
|
+
(r) => s("update:model-value", r),
|
|
44
|
+
null
|
|
45
|
+
), t = u(d.value), l = u(!1), N = () => {
|
|
41
46
|
l.value = !0;
|
|
42
|
-
},
|
|
47
|
+
}, D = () => {
|
|
43
48
|
l.value = !1;
|
|
44
|
-
},
|
|
45
|
-
() =>
|
|
46
|
-
nmorph: [
|
|
47
|
-
"nmorph-date-picker": [
|
|
49
|
+
}, b = a(
|
|
50
|
+
() => V({
|
|
51
|
+
nmorph: [P[e.height]],
|
|
52
|
+
"nmorph-date-picker": [e.disabled && "disabled", e.type, l.value && "focus"]
|
|
48
53
|
})
|
|
49
|
-
),
|
|
50
|
-
...e.width !== void 0 && { "--width":
|
|
54
|
+
), C = a(() => ({
|
|
55
|
+
...e.width !== void 0 && { "--width": m(e.width) },
|
|
51
56
|
...e.calendarCellHeight !== void 0 && {
|
|
52
|
-
"--date-picker-calendar-cell-height":
|
|
57
|
+
"--date-picker-calendar-cell-height": m(e.calendarCellHeight)
|
|
53
58
|
}
|
|
54
|
-
})), o = u(!1),
|
|
59
|
+
})), o = u(!1), I = u(null), _ = () => {
|
|
55
60
|
o.value = !1;
|
|
56
|
-
},
|
|
61
|
+
}, w = () => {
|
|
57
62
|
o.value = !o.value;
|
|
58
63
|
}, A = a(() => {
|
|
59
64
|
if (!t.value) return n.value;
|
|
@@ -65,25 +70,33 @@ const Z = /* @__PURE__ */ O({
|
|
|
65
70
|
};
|
|
66
71
|
if (Array.isArray(t.value)) {
|
|
67
72
|
if (t.value.length === 0) return n.value;
|
|
68
|
-
const
|
|
69
|
-
return
|
|
73
|
+
const O = c(t.value, r), k = e.type === "daterange" ? e.rangeSeparator : e.valueSeparator;
|
|
74
|
+
return O.join(k);
|
|
70
75
|
} else
|
|
71
|
-
return
|
|
72
|
-
}),
|
|
76
|
+
return c(t.value, r);
|
|
77
|
+
}), F = () => {
|
|
73
78
|
const r = Array.isArray(t.value) ? [] : null;
|
|
74
|
-
t.value = r,
|
|
75
|
-
},
|
|
76
|
-
t.value = r,
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
+
t.value = r, i(t.value);
|
|
80
|
+
}, H = (r) => {
|
|
81
|
+
t.value = r, i(t.value);
|
|
82
|
+
};
|
|
83
|
+
M(
|
|
84
|
+
d,
|
|
85
|
+
(r) => {
|
|
86
|
+
t.value = r;
|
|
87
|
+
},
|
|
88
|
+
{ deep: !0 }
|
|
89
|
+
);
|
|
90
|
+
const x = a(() => Array.isArray(t.value) ? t.value.length > 0 : !!t.value), f = { t: p, props: e, id: g, name: q, autocomplete: S, placeholderText: n, emit: s, modelValue: d, updateModelValue: i, selectedDate: t, focus: l, focusHandler: N, blurHandler: D, modifiers: b, styles: C, open: o, nmorphInputDOMRef: I, closeHandler: _, toggleOpen: w, displayValue: A, clearHandler: F, updateSelectedDateHandler: H, showClearButton: x, get NmorphDropdown() {
|
|
91
|
+
return J;
|
|
79
92
|
}, get NmorphIcon() {
|
|
80
|
-
return
|
|
93
|
+
return G;
|
|
81
94
|
}, get NmorphIconCalendar() {
|
|
82
|
-
return
|
|
83
|
-
}, NmorphClearButton:
|
|
84
|
-
return Object.defineProperty(
|
|
95
|
+
return E;
|
|
96
|
+
}, NmorphClearButton: j, NmorphDatePickerContent: z };
|
|
97
|
+
return Object.defineProperty(f, "__isScriptSetup", { enumerable: !1, value: !0 }), f;
|
|
85
98
|
}
|
|
86
99
|
});
|
|
87
100
|
export {
|
|
88
|
-
|
|
101
|
+
le as default
|
|
89
102
|
};
|
|
@@ -1,30 +1,34 @@
|
|
|
1
1
|
import './NmorphFileUpload.css';
|
|
2
|
-
import
|
|
3
|
-
import { openBlock as o, createElementBlock as r, normalizeClass as
|
|
2
|
+
import p from "./NmorphFileUpload.vue2.js";
|
|
3
|
+
import { openBlock as o, createElementBlock as r, normalizeClass as s, createElementVNode as l, renderSlot as _, createVNode as n, TransitionGroup as h, withCtx as t, Fragment as f, renderList as v, createBlock as a, createCommentVNode as m, resolveDynamicComponent as u, toDisplayString as g } from "vue";
|
|
4
4
|
/* empty css */
|
|
5
|
-
import
|
|
6
|
-
const
|
|
5
|
+
import b from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
6
|
+
const x = { class: "nmorph-file-upload__trigger" }, y = ["id", "name", "autocomplete", "tabindex", "multiple", "disabled", "accept"], k = {
|
|
7
7
|
key: 0,
|
|
8
8
|
class: "nmorph-file-upload__list"
|
|
9
|
-
},
|
|
10
|
-
function B(
|
|
9
|
+
}, N = { class: "nmorph-file-upload__file-info" }, C = { class: "nmorph-file-upload__file-name" }, F = { class: "nmorph-file-upload__remove-file" };
|
|
10
|
+
function B(d, I, w, e, D, S) {
|
|
11
11
|
return o(), r(
|
|
12
12
|
"div",
|
|
13
13
|
{
|
|
14
|
-
class:
|
|
14
|
+
class: s(e.modifiers)
|
|
15
15
|
},
|
|
16
16
|
[
|
|
17
|
-
l("div",
|
|
17
|
+
l("div", x, [
|
|
18
18
|
l("input", {
|
|
19
|
+
id: e.id,
|
|
19
20
|
ref: "inputDOMRef",
|
|
21
|
+
name: e.name,
|
|
22
|
+
autocomplete: e.autocomplete,
|
|
23
|
+
tabindex: e.tabindex,
|
|
20
24
|
type: "file",
|
|
21
25
|
multiple: e.props.multiple,
|
|
22
26
|
disabled: e.props.disabled,
|
|
23
27
|
accept: e.inputAccept,
|
|
24
28
|
class: "nmorph-native-input",
|
|
25
29
|
onChange: e.handleFileUpload
|
|
26
|
-
}, null, 40,
|
|
27
|
-
_(
|
|
30
|
+
}, null, 40, y),
|
|
31
|
+
_(d.$slots, "trigger", {}, () => [
|
|
28
32
|
n(e.NmorphButton, {
|
|
29
33
|
text: e.computedButtonText,
|
|
30
34
|
fill: "",
|
|
@@ -33,7 +37,7 @@ function B(s, I, w, e, D, S) {
|
|
|
33
37
|
}, null, 8, ["text", "disabled"])
|
|
34
38
|
])
|
|
35
39
|
]),
|
|
36
|
-
e.files.length > 0 ? (o(), r("div",
|
|
40
|
+
e.files.length > 0 ? (o(), r("div", k, [
|
|
37
41
|
n(h, {
|
|
38
42
|
name: "list",
|
|
39
43
|
tag: "div"
|
|
@@ -49,8 +53,8 @@ function B(s, I, w, e, D, S) {
|
|
|
49
53
|
e.props.photoWithPreview && e.isImageFile(i) ? (o(), a(e.NmorphImagePreview, {
|
|
50
54
|
key: 0,
|
|
51
55
|
src: c
|
|
52
|
-
}, null, 8, ["src"])) :
|
|
53
|
-
l("div",
|
|
56
|
+
}, null, 8, ["src"])) : m("v-if", !0),
|
|
57
|
+
l("div", N, [
|
|
54
58
|
n(
|
|
55
59
|
e.NmorphIcon,
|
|
56
60
|
{
|
|
@@ -69,7 +73,7 @@ function B(s, I, w, e, D, S) {
|
|
|
69
73
|
),
|
|
70
74
|
l(
|
|
71
75
|
"span",
|
|
72
|
-
|
|
76
|
+
C,
|
|
73
77
|
g(i.name),
|
|
74
78
|
1
|
|
75
79
|
/* TEXT */
|
|
@@ -96,13 +100,13 @@ function B(s, I, w, e, D, S) {
|
|
|
96
100
|
_: 1
|
|
97
101
|
/* STABLE */
|
|
98
102
|
})
|
|
99
|
-
])) :
|
|
103
|
+
])) : m("v-if", !0)
|
|
100
104
|
],
|
|
101
105
|
2
|
|
102
106
|
/* CLASS */
|
|
103
107
|
);
|
|
104
108
|
}
|
|
105
|
-
const T = /* @__PURE__ */
|
|
109
|
+
const T = /* @__PURE__ */ b(p, [["render", B], ["__file", "/builds/ketjo/nmorph/library/src/components/form/nmorph-file-upload/NmorphFileUpload.vue"]]);
|
|
106
110
|
export {
|
|
107
111
|
T as default
|
|
108
112
|
};
|