@7pmlabs/design-system 0.7.0 → 0.8.1
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/design-system10.mjs +8 -8
- package/dist/design-system10.mjs.map +1 -1
- package/dist/design-system101.mjs.map +1 -1
- package/dist/design-system102.mjs +16 -16
- package/dist/design-system105.mjs +9 -9
- package/dist/design-system106.mjs.map +1 -1
- package/dist/design-system107.mjs.map +1 -1
- package/dist/design-system108.mjs +16 -16
- package/dist/design-system109.mjs +16 -16
- package/dist/design-system11.mjs.map +1 -1
- package/dist/design-system111.mjs +16 -16
- package/dist/design-system111.mjs.map +1 -1
- package/dist/design-system112.mjs.map +1 -1
- package/dist/design-system114.mjs.map +1 -1
- package/dist/design-system116.mjs +1 -1
- package/dist/design-system117.mjs +1 -1
- package/dist/design-system118.mjs +5 -5
- package/dist/design-system118.mjs.map +1 -1
- package/dist/design-system12.mjs.map +1 -1
- package/dist/design-system123.mjs.map +1 -1
- package/dist/design-system125.mjs +7 -4
- package/dist/design-system125.mjs.map +1 -1
- package/dist/design-system126.mjs +5 -8
- package/dist/design-system126.mjs.map +1 -1
- package/dist/design-system127.mjs +6 -6
- package/dist/design-system127.mjs.map +1 -1
- package/dist/design-system13.mjs.map +1 -1
- package/dist/design-system14.mjs.map +1 -1
- package/dist/design-system15.mjs.map +1 -1
- package/dist/design-system16.mjs.map +1 -1
- package/dist/design-system17.mjs +170 -146
- package/dist/design-system17.mjs.map +1 -1
- package/dist/design-system18.mjs.map +1 -1
- package/dist/design-system19.mjs +64 -64
- package/dist/design-system19.mjs.map +1 -1
- package/dist/design-system20.mjs +78 -78
- package/dist/design-system20.mjs.map +1 -1
- package/dist/design-system21.mjs.map +1 -1
- package/dist/design-system22.mjs.map +1 -1
- package/dist/design-system23.mjs.map +1 -1
- package/dist/design-system24.mjs.map +1 -1
- package/dist/design-system25.mjs.map +1 -1
- package/dist/design-system40.mjs +46 -46
- package/dist/design-system40.mjs.map +1 -1
- package/dist/design-system43.mjs +10 -10
- package/dist/design-system45.mjs.map +1 -1
- package/dist/design-system49.mjs +2 -2
- package/dist/design-system49.mjs.map +1 -1
- package/dist/design-system51.mjs +68 -68
- package/dist/design-system51.mjs.map +1 -1
- package/dist/design-system54.mjs.map +1 -1
- package/dist/design-system57.mjs.map +1 -1
- package/dist/design-system64.mjs +10 -10
- package/dist/design-system64.mjs.map +1 -1
- package/dist/design-system66.mjs.map +1 -1
- package/dist/design-system72.mjs.map +1 -1
- package/dist/design-system76.mjs.map +1 -1
- package/dist/design-system79.mjs.map +1 -1
- package/dist/design-system83.mjs +43 -43
- package/dist/design-system83.mjs.map +1 -1
- package/dist/design-system85.mjs +75 -75
- package/dist/design-system85.mjs.map +1 -1
- package/dist/design-system88.mjs.map +1 -1
- package/dist/design-system90.mjs.map +1 -1
- package/dist/design-system95.mjs +42 -42
- package/dist/design-system95.mjs.map +1 -1
- package/dist/design-system96.mjs +2 -2
- package/dist/design-system96.mjs.map +1 -1
- package/dist/design-system97.mjs +1 -1
- package/dist/design-system97.mjs.map +1 -1
- package/dist/design-system98.mjs +12 -12
- package/dist/design-system98.mjs.map +1 -1
- package/dist/design-system99.mjs.map +1 -1
- package/dist/style.css +1 -1
- package/dist/types/components/BBreadcrumb/BBreadcrumb.vue.d.ts +4 -4
- package/dist/types/components/BBreadcrumb/BBreadcrumbSeparator.vue.d.ts +1 -1
- package/dist/types/components/BButton.vue.d.ts +4 -4
- package/dist/types/components/BCarousel/BCarousel.vue.d.ts +6 -6
- package/dist/types/components/BCarousel/BCarouselItem.vue.d.ts +1 -1
- package/dist/types/components/BCheckbox.vue.d.ts +5 -5
- package/dist/types/components/BCollapse.vue.d.ts +3 -3
- package/dist/types/components/BCurrencyField.vue.d.ts +6 -6
- package/dist/types/components/BDatePicker/BDatePicker.vue.d.ts +6 -6
- package/dist/types/components/BDatePicker/BDatePickerButtonNext.vue.d.ts +1 -1
- package/dist/types/components/BDatePicker/BDatePickerButtonPrevious.vue.d.ts +1 -1
- package/dist/types/components/BDatePicker/BDatePickerGridDate.vue.d.ts +3 -3
- package/dist/types/components/BDatePicker/BDatePickerGridDateRange.vue.d.ts +3 -3
- package/dist/types/components/BDatePicker/BDatePickerGridMonth.vue.d.ts +3 -3
- package/dist/types/components/BDatePicker/BDatePickerGridYear.vue.d.ts +3 -3
- package/dist/types/components/BDatePicker/BDatePickerHeading.vue.d.ts +1 -1
- package/dist/types/components/BDatePicker/BDatePickerIcon.vue.d.ts +1 -1
- package/dist/types/components/BDropdown/BDropdown.vue.d.ts +5 -5
- package/dist/types/components/BDropdown/BDropdownContent.vue.d.ts +1 -1
- package/dist/types/components/BDropdown/BDropdownItem.vue.d.ts +4 -4
- package/dist/types/components/BErrorMessage.vue.d.ts +4 -4
- package/dist/types/components/BImagePicker/BImagePicker.vue.d.ts +7 -7
- package/dist/types/components/BImagePicker/BImagePickerCloseButton.vue.d.ts +1 -1
- package/dist/types/components/BImagePicker/BImagePreview.vue.d.ts +3 -3
- package/dist/types/components/BLabel.vue.d.ts +5 -5
- package/dist/types/components/BLoadingBar.vue.d.ts +4 -4
- package/dist/types/components/BLoadingOverlay.vue.d.ts +4 -4
- package/dist/types/components/BModal/BModal.vue.d.ts +5 -5
- package/dist/types/components/BModal/BModalBody.vue.d.ts +1 -1
- package/dist/types/components/BModal/BModalContainer.vue.d.ts +5 -5
- package/dist/types/components/BModal/BModalFooter.vue.d.ts +1 -1
- package/dist/types/components/BModal/BModalHeader.vue.d.ts +1 -1
- package/dist/types/components/BMultiSelect.vue.d.ts +9 -9
- package/dist/types/components/BOtpField/BOtpField.vue.d.ts +7 -7
- package/dist/types/components/BOtpField/BOtpFieldBox.vue.d.ts +7 -7
- package/dist/types/components/BOverlay.vue.d.ts +1 -1
- package/dist/types/components/BPagination.vue.d.ts +5 -5
- package/dist/types/components/BRadio.vue.d.ts +6 -6
- package/dist/types/components/BSelect.vue.d.ts +9 -9
- package/dist/types/components/BStepper.vue.d.ts +3 -3
- package/dist/types/components/BSwitch.vue.d.ts +5 -5
- package/dist/types/components/BTabs/BTab.vue.d.ts +1 -1
- package/dist/types/components/BTabs/BTabs.vue.d.ts +5 -5
- package/dist/types/components/BTextField.vue.d.ts +8 -8
- package/dist/types/components/BTextarea.vue.d.ts +7 -7
- package/dist/types/components/BTimeline/BTimeline.vue.d.ts +1 -1
- package/dist/types/components/BTimeline/BTimelineItem.vue.d.ts +1 -1
- package/dist/types/components/BToast/BToast.vue.d.ts +3 -3
- package/dist/types/components/BToast/BToastItem.vue.d.ts +6 -6
- package/dist/types/components/BTooltip.vue.d.ts +6 -6
- package/dist/types/composables/Validation.d.ts +6 -1
- package/dist/types/constants/Common.d.ts +2 -2
- package/package.json +3 -3
package/dist/design-system83.mjs
CHANGED
|
@@ -1,105 +1,105 @@
|
|
|
1
|
-
import { defineComponent as C, ref as v, computed as
|
|
2
|
-
import { BTooltipPosition as
|
|
3
|
-
const
|
|
4
|
-
class: "tooltip-arrow",
|
|
5
|
-
"data-popper-arrow": ""
|
|
6
|
-
}, null, -1)), q = /* @__PURE__ */ C({
|
|
1
|
+
import { defineComponent as C, ref as v, computed as T, watch as L, onMounted as F, onBeforeUnmount as H, openBlock as R, createElementBlock as O, Fragment as P, createElementVNode as r, renderSlot as w, withDirectives as S, vShow as $ } from "vue";
|
|
2
|
+
import { BTooltipPosition as d, BTooltipOpenEvent as i } from "./design-system5.mjs";
|
|
3
|
+
const z = { class: "ds-relative" }, N = /* @__PURE__ */ C({
|
|
7
4
|
__name: "BTooltip",
|
|
8
5
|
props: {
|
|
9
6
|
modelValue: { type: Boolean, default: !1 },
|
|
10
|
-
position: { default:
|
|
7
|
+
position: { default: d.Top },
|
|
11
8
|
openEvent: { default: i.Hover }
|
|
12
9
|
},
|
|
13
10
|
emits: ["update:modelValue"],
|
|
14
|
-
setup(
|
|
15
|
-
const
|
|
11
|
+
setup(h, { emit: B }) {
|
|
12
|
+
const n = h, V = B, t = v(null), o = v(null), c = v(!1), l = T({
|
|
16
13
|
get() {
|
|
17
|
-
return
|
|
14
|
+
return n.modelValue !== void 0 ? n.modelValue : c.value;
|
|
18
15
|
},
|
|
19
16
|
set(e) {
|
|
20
|
-
|
|
17
|
+
n.modelValue !== void 0 ? V("update:modelValue", e) : c.value = e;
|
|
21
18
|
}
|
|
22
19
|
});
|
|
23
20
|
L(
|
|
24
|
-
() =>
|
|
21
|
+
() => n.position,
|
|
25
22
|
() => {
|
|
26
|
-
x(),
|
|
23
|
+
x(), k();
|
|
27
24
|
}
|
|
28
25
|
), L(
|
|
29
|
-
() =>
|
|
26
|
+
() => n.openEvent,
|
|
30
27
|
() => {
|
|
31
28
|
g(), b();
|
|
32
29
|
}
|
|
33
30
|
);
|
|
34
31
|
const m = () => {
|
|
35
|
-
|
|
32
|
+
l.value = !l.value;
|
|
33
|
+
}, p = () => {
|
|
34
|
+
l.value = !0;
|
|
35
|
+
}, _ = () => {
|
|
36
|
+
l.value = !1;
|
|
36
37
|
}, f = () => {
|
|
37
|
-
|
|
38
|
-
}, V = () => {
|
|
39
|
-
n.value = !1;
|
|
38
|
+
l.value = !0;
|
|
40
39
|
}, E = () => {
|
|
41
|
-
|
|
42
|
-
}, k = () => {
|
|
43
|
-
n.value = !1;
|
|
40
|
+
l.value = !1;
|
|
44
41
|
}, x = () => {
|
|
45
42
|
o.value && (o.value.style.top = "", o.value.style.right = "", o.value.style.bottom = "", o.value.style.left = "");
|
|
46
|
-
},
|
|
43
|
+
}, k = () => {
|
|
47
44
|
if (o.value)
|
|
48
|
-
switch (
|
|
49
|
-
case
|
|
45
|
+
switch (n.position) {
|
|
46
|
+
case d.Bottom:
|
|
50
47
|
o.value.style.top = "4px";
|
|
51
48
|
break;
|
|
52
|
-
case
|
|
49
|
+
case d.Top:
|
|
53
50
|
default:
|
|
54
51
|
o.value.style.bottom = "24px";
|
|
55
52
|
break;
|
|
56
53
|
}
|
|
57
54
|
}, b = () => {
|
|
58
|
-
var e,
|
|
59
|
-
switch (
|
|
55
|
+
var e, s, a, u, y;
|
|
56
|
+
switch (n.openEvent) {
|
|
60
57
|
case i.Click:
|
|
61
58
|
(e = t.value) == null || e.addEventListener("click", m);
|
|
62
59
|
break;
|
|
63
60
|
case i.Focus:
|
|
64
|
-
(
|
|
61
|
+
(s = t.value) == null || s.addEventListener("focus", p), (a = t.value) == null || a.addEventListener("focusout", _);
|
|
65
62
|
break;
|
|
66
63
|
case i.Hover:
|
|
67
64
|
default:
|
|
68
|
-
(
|
|
65
|
+
(u = t.value) == null || u.addEventListener("mouseover", f), (y = t.value) == null || y.addEventListener("mouseleave", E);
|
|
69
66
|
break;
|
|
70
67
|
}
|
|
71
68
|
}, g = () => {
|
|
72
|
-
var e,
|
|
73
|
-
(e = t.value) == null || e.removeEventListener("click", m), (
|
|
69
|
+
var e, s, a, u;
|
|
70
|
+
(e = t.value) == null || e.removeEventListener("click", m), (s = t.value) == null || s.removeEventListener("focus", p), (a = t.value) == null || a.removeEventListener("mouseover", f), (u = t.value) == null || u.removeEventListener("mouseleave", E);
|
|
74
71
|
};
|
|
75
|
-
return
|
|
76
|
-
b(),
|
|
77
|
-
}),
|
|
72
|
+
return F(() => {
|
|
73
|
+
b(), k();
|
|
74
|
+
}), H(() => {
|
|
78
75
|
g();
|
|
79
|
-
}), (e,
|
|
80
|
-
|
|
76
|
+
}), (e, s) => (R(), O(P, null, [
|
|
77
|
+
r("div", {
|
|
81
78
|
ref_key: "toggleRef",
|
|
82
79
|
ref: t,
|
|
83
80
|
class: "ds-inline"
|
|
84
81
|
}, [
|
|
85
|
-
|
|
82
|
+
w(e.$slots, "toggle", {}, void 0, !0)
|
|
86
83
|
], 512),
|
|
87
|
-
|
|
88
|
-
|
|
84
|
+
S(r("div", z, [
|
|
85
|
+
r("div", {
|
|
89
86
|
ref_key: "contentRef",
|
|
90
87
|
ref: o,
|
|
91
88
|
class: "ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/65 ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300"
|
|
92
89
|
}, [
|
|
93
|
-
|
|
94
|
-
|
|
90
|
+
w(e.$slots, "default", {}, void 0, !0),
|
|
91
|
+
s[0] || (s[0] = r("div", {
|
|
92
|
+
class: "tooltip-arrow",
|
|
93
|
+
"data-popper-arrow": ""
|
|
94
|
+
}, null, -1))
|
|
95
95
|
], 512)
|
|
96
96
|
], 512), [
|
|
97
|
-
[
|
|
97
|
+
[$, l.value]
|
|
98
98
|
])
|
|
99
99
|
], 64));
|
|
100
100
|
}
|
|
101
101
|
});
|
|
102
102
|
export {
|
|
103
|
-
|
|
103
|
+
N as default
|
|
104
104
|
};
|
|
105
105
|
//# sourceMappingURL=design-system83.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"design-system83.mjs","sources":["../src/components/BTooltip.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, createElementVNode as _createElementVNode, vShow as _vShow, withDirectives as _withDirectives, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock
|
|
1
|
+
{"version":3,"file":"design-system83.mjs","sources":["../src/components/BTooltip.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, createElementVNode as _createElementVNode, vShow as _vShow, withDirectives as _withDirectives, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = { class: \"ds-relative\" }\n\nimport { BTooltipOpenEvent, BTooltipPosition } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\n\n//#region Props\nexport interface BTooltipProps {\n modelValue?: boolean;\n /**\n * Position of opened tooltip compare to its toggle.\n */\n position?: `${BTooltipPosition}`;\n /**\n * Event to open tooltip.\n */\n openEvent?: `${BTooltipOpenEvent}`;\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n __name: 'BTooltip',\n props: {\n modelValue: { type: Boolean, default: false },\n position: { default: BTooltipPosition.Top },\n openEvent: { default: BTooltipOpenEvent.Hover }\n },\n emits: [\"update:modelValue\"],\n setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//region Data\nconst toggleRef = ref<HTMLDivElement | null>(null);\nconst contentRef = ref<HTMLDivElement | null>(null);\nconst mValue = ref(false);\nconst value = computed({\n get() {\n return props.modelValue !== undefined ? props.modelValue : mValue.value;\n },\n set(val: boolean) {\n if (props.modelValue !== undefined) {\n emit('update:modelValue', val);\n } else {\n mValue.value = val;\n }\n },\n});\n//endregion\n\n//region Watchers\nwatch(\n () => props.position,\n () => {\n resetContentPosition();\n ensureContentPosition();\n },\n);\nwatch(\n () => props.openEvent,\n () => {\n clearEventListeners();\n ensureEventListeners();\n },\n);\n//#endregion\n\n//region Methods\nconst onClick = () => {\n value.value = !value.value;\n};\nconst onFocus = () => {\n value.value = true;\n};\nconst onFocusOut = () => {\n value.value = false;\n};\nconst onHover = () => {\n value.value = true;\n};\nconst onHoverOut = () => {\n value.value = false;\n};\nconst resetContentPosition = () => {\n if (!contentRef.value) {\n return;\n }\n contentRef.value.style.top = '';\n contentRef.value.style.right = '';\n contentRef.value.style.bottom = '';\n contentRef.value.style.left = '';\n};\nconst ensureContentPosition = () => {\n if (!contentRef.value) {\n return;\n }\n\n switch (props.position) {\n case BTooltipPosition.Bottom:\n contentRef.value.style.top = '4px';\n break;\n case BTooltipPosition.Top:\n default:\n contentRef.value.style.bottom = '24px';\n break;\n }\n};\nconst ensureEventListeners = () => {\n switch (props.openEvent) {\n case BTooltipOpenEvent.Click:\n toggleRef.value?.addEventListener('click', onClick);\n break;\n case BTooltipOpenEvent.Focus:\n toggleRef.value?.addEventListener('focus', onFocus);\n toggleRef.value?.addEventListener('focusout', onFocusOut);\n break;\n case BTooltipOpenEvent.Hover:\n default:\n toggleRef.value?.addEventListener('mouseover', onHover);\n toggleRef.value?.addEventListener('mouseleave', onHoverOut);\n break;\n }\n};\nconst clearEventListeners = () => {\n toggleRef.value?.removeEventListener('click', onClick);\n toggleRef.value?.removeEventListener('focus', onFocus);\n toggleRef.value?.removeEventListener('mouseover', onHover);\n toggleRef.value?.removeEventListener('mouseleave', onHoverOut);\n};\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n ensureEventListeners();\n ensureContentPosition();\n});\nonBeforeUnmount(() => {\n clearEventListeners();\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(_Fragment, null, [\n _createElementVNode(\"div\", {\n ref_key: \"toggleRef\",\n ref: toggleRef,\n class: \"ds-inline\"\n }, [\n _renderSlot(_ctx.$slots, \"toggle\", {}, undefined, true)\n ], 512),\n _withDirectives(_createElementVNode(\"div\", _hoisted_1, [\n _createElementVNode(\"div\", {\n ref_key: \"contentRef\",\n ref: contentRef,\n class: \"ds-absolute ds-z-10 ds-inline-block ds-rounded-lg ds-bg-black/65 ds-px-3 ds-py-2 ds-text-sm ds-font-medium ds-text-white ds-shadow-sm ds-transition-opacity ds-duration-300\"\n }, [\n _renderSlot(_ctx.$slots, \"default\", {}, undefined, true),\n _cache[0] || (_cache[0] = _createElementVNode(\"div\", {\n class: \"tooltip-arrow\",\n \"data-popper-arrow\": \"\"\n }, null, -1))\n ], 512)\n ], 512), [\n [_vShow, value.value]\n ])\n ], 64))\n}\n}\n\n})"],"names":["_hoisted_1","_sfc_main","_defineComponent","BTooltipPosition","BTooltipOpenEvent","__props","__emit","props","emit","toggleRef","ref","contentRef","mValue","value","computed","val","watch","resetContentPosition","ensureContentPosition","clearEventListeners","ensureEventListeners","onClick","onFocus","onFocusOut","onHover","onHoverOut","_a","_b","_c","_d","_e","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createElementBlock","_Fragment","_createElementVNode","_renderSlot","_withDirectives","_vShow"],"mappings":"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"}
|
package/dist/design-system85.mjs
CHANGED
|
@@ -1,24 +1,18 @@
|
|
|
1
|
-
import { defineComponent as W, ref as
|
|
2
|
-
import { FileImageTypes as
|
|
3
|
-
import { useI18n as
|
|
1
|
+
import { defineComponent as W, ref as g, computed as h, openBlock as n, createElementBlock as p, createVNode as m, createElementVNode as i, unref as k, Fragment as X, renderList as Y, withModifiers as C, createCommentVNode as V, withCtx as I, createTextVNode as Z, toDisplayString as ee, createBlock as te } from "vue";
|
|
2
|
+
import { FileImageTypes as x } from "./design-system4.mjs";
|
|
3
|
+
import { useI18n as ae } from "./design-system49.mjs";
|
|
4
4
|
import F from "./design-system102.mjs";
|
|
5
|
-
import
|
|
6
|
-
import { useValidationField as
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
const
|
|
5
|
+
import le from "./design-system45.mjs";
|
|
6
|
+
import { useValidationField as se } from "./design-system3.mjs";
|
|
7
|
+
import re from "./design-system15.mjs";
|
|
8
|
+
import oe from "./design-system10.mjs";
|
|
9
|
+
import ie from "./design-system14.mjs";
|
|
10
|
+
import de from "./design-system98.mjs";
|
|
11
|
+
import ne from "./design-system103.mjs";
|
|
12
|
+
const ue = { class: "b-image-picker ds-w-full" }, ce = { class: "ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow" }, ge = {
|
|
13
13
|
key: 0,
|
|
14
14
|
class: "ds-flex ds-flex-wrap ds-justify-center ds-gap-1"
|
|
15
|
-
},
|
|
16
|
-
class: "ds-h-4 ds-w-4 ds-fill-primary-t",
|
|
17
|
-
viewBox: "0 0 512 512",
|
|
18
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
19
|
-
}, [
|
|
20
|
-
/* @__PURE__ */ i("path", { d: "M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z" })
|
|
21
|
-
], -1)), De = ["accept", "multiple"], Me = /* @__PURE__ */ W({
|
|
15
|
+
}, pe = ["onClick", "onDragenter", "onDragstart", "onDrop"], me = ["src"], ve = ["src"], fe = { class: "ds-flex ds-flex-wrap ds-justify-center" }, he = ["accept", "multiple"], Re = /* @__PURE__ */ W({
|
|
22
16
|
__name: "BImagePicker",
|
|
23
17
|
props: {
|
|
24
18
|
inputId: { default: "" },
|
|
@@ -32,44 +26,44 @@ const ge = (u) => (ae("data-v-8033e228"), u = u(), le(), u), pe = { class: "b-im
|
|
|
32
26
|
validationRules: { default: void 0 }
|
|
33
27
|
},
|
|
34
28
|
emits: ["change", "update:modelValue"],
|
|
35
|
-
setup(
|
|
36
|
-
const a =
|
|
29
|
+
setup(R, { expose: z, emit: B }) {
|
|
30
|
+
const a = R, u = B, { t: v } = ae(), f = g(null), D = g(0), s = h({
|
|
37
31
|
get() {
|
|
38
32
|
return a.modelValue;
|
|
39
33
|
},
|
|
40
34
|
set(e) {
|
|
41
|
-
|
|
35
|
+
u("update:modelValue", e);
|
|
42
36
|
}
|
|
43
|
-
}),
|
|
37
|
+
}), _ = g(!0), y = g(!0), c = g({
|
|
44
38
|
visible: !1,
|
|
45
39
|
url: ""
|
|
46
|
-
}),
|
|
40
|
+
}), w = h(() => x.join(", ")), M = h(() => a.inputId || `id-${de()}`), S = {
|
|
47
41
|
validateRule: (e) => !!e && e.length > 0,
|
|
48
|
-
errorMessage: () => a.requiredErrorMessage ||
|
|
42
|
+
errorMessage: () => a.requiredErrorMessage || v("ds.global.field_required")
|
|
49
43
|
}, T = {
|
|
50
|
-
validateRule: () =>
|
|
51
|
-
errorMessage: () =>
|
|
52
|
-
types:
|
|
44
|
+
validateRule: () => _.value,
|
|
45
|
+
errorMessage: () => v("ds.components.base.image_picker.file_types_valid", {
|
|
46
|
+
types: w.value
|
|
53
47
|
})
|
|
54
48
|
}, E = {
|
|
55
|
-
validateRule: () =>
|
|
56
|
-
errorMessage: () =>
|
|
49
|
+
validateRule: () => y.value,
|
|
50
|
+
errorMessage: () => v("ds.components.base.image_picker.file_size_valid", {
|
|
57
51
|
size: a.maxFileSize
|
|
58
52
|
})
|
|
59
|
-
}, L =
|
|
53
|
+
}, L = h(() => {
|
|
60
54
|
let e = [];
|
|
61
|
-
return a.required && e.push(
|
|
62
|
-
}), { validate: d, validationResult: $ } =
|
|
63
|
-
|
|
55
|
+
return a.required && e.push(S), a.validationRules && (e = e.concat(a.validationRules)), e.push(T), e.push(E), e.length ? e : void 0;
|
|
56
|
+
}), { validate: d, validationResult: $ } = se(
|
|
57
|
+
M.value,
|
|
64
58
|
s,
|
|
65
59
|
L.value
|
|
66
60
|
), q = (e, t) => {
|
|
67
|
-
|
|
61
|
+
D.value = e, t.target.classList.add("dragging"), t.dataTransfer.effectAllowed = "move", t.dataTransfer.setData("index", e.toString());
|
|
68
62
|
}, N = (e) => {
|
|
69
63
|
e.target.classList.remove("dragging");
|
|
70
64
|
}, j = (e, t) => {
|
|
71
65
|
const l = t.target;
|
|
72
|
-
|
|
66
|
+
D.value !== e && l.classList.add("dropped-target");
|
|
73
67
|
}, A = (e) => {
|
|
74
68
|
e.preventDefault(), e.dataTransfer.dropEffect = "move";
|
|
75
69
|
}, P = (e) => {
|
|
@@ -77,16 +71,16 @@ const ge = (u) => (ae("data-v-8033e228"), u = u(), le(), u), pe = { class: "b-im
|
|
|
77
71
|
}, U = (e, t) => {
|
|
78
72
|
t.preventDefault(), t.target.classList.remove("dropped-target");
|
|
79
73
|
const r = parseInt(t.dataTransfer.getData("index")), o = s.value[r];
|
|
80
|
-
s.value.splice(r, 1), s.value.splice(e, 0, o),
|
|
74
|
+
s.value.splice(r, 1), s.value.splice(e, 0, o), u("change"), d();
|
|
81
75
|
}, H = () => {
|
|
82
76
|
var e;
|
|
83
|
-
(e =
|
|
77
|
+
(e = f.value) == null || e.click();
|
|
84
78
|
}, O = (e) => {
|
|
85
79
|
let t = e.target.files || e.dataTransfer.files;
|
|
86
|
-
t.length && (G(t),
|
|
80
|
+
t.length && (G(t), f.value && (f.value.value = null));
|
|
87
81
|
}, G = (e) => {
|
|
88
82
|
Array.from(e).forEach((t) => {
|
|
89
|
-
if (
|
|
83
|
+
if (_.value = x.includes(t.type), y.value = Q(t.size) <= a.maxFileSize, _.value && y.value) {
|
|
90
84
|
let l = new FileReader();
|
|
91
85
|
l.onload = (r) => {
|
|
92
86
|
a.multiple ? s.value.push({
|
|
@@ -97,29 +91,29 @@ const ge = (u) => (ae("data-v-8033e228"), u = u(), le(), u), pe = { class: "b-im
|
|
|
97
91
|
url: r.target.result,
|
|
98
92
|
file: t,
|
|
99
93
|
type: t.type
|
|
100
|
-
},
|
|
94
|
+
}, u("change"), d();
|
|
101
95
|
}, l.readAsDataURL(t);
|
|
102
96
|
} else
|
|
103
97
|
d();
|
|
104
98
|
});
|
|
105
99
|
}, J = (e) => {
|
|
106
|
-
s.value.splice(e, 1),
|
|
100
|
+
s.value.splice(e, 1), u("change"), d();
|
|
107
101
|
}, K = () => {
|
|
108
|
-
s.value = {},
|
|
109
|
-
}, Q = (e) => e / 1024 ** 2,
|
|
110
|
-
|
|
102
|
+
s.value = {}, u("change"), d();
|
|
103
|
+
}, Q = (e) => e / 1024 ** 2, b = (e) => {
|
|
104
|
+
c.value.url = e.url || "", c.value.visible = !0;
|
|
111
105
|
};
|
|
112
|
-
return
|
|
113
|
-
|
|
106
|
+
return z({ validate: d }), (e, t) => (n(), p("div", ue, [
|
|
107
|
+
m(re, {
|
|
114
108
|
label: a.label
|
|
115
109
|
}, null, 8, ["label"]),
|
|
116
|
-
i("div",
|
|
117
|
-
|
|
118
|
-
a.multiple ? (n(!0),
|
|
110
|
+
i("div", ce, [
|
|
111
|
+
k(ne)(s.value) ? V("", !0) : (n(), p("div", ge, [
|
|
112
|
+
a.multiple ? (n(!0), p(X, { key: 0 }, Y(s.value, (l, r) => (n(), p("div", {
|
|
119
113
|
key: l.url,
|
|
120
114
|
class: "b-image-picker__draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t",
|
|
121
115
|
draggable: "true",
|
|
122
|
-
onClick: (o) =>
|
|
116
|
+
onClick: (o) => b(l),
|
|
123
117
|
onDragend: N,
|
|
124
118
|
onDragenter: (o) => j(r, o),
|
|
125
119
|
onDragleave: P,
|
|
@@ -131,63 +125,69 @@ const ge = (u) => (ae("data-v-8033e228"), u = u(), le(), u), pe = { class: "b-im
|
|
|
131
125
|
src: l.url,
|
|
132
126
|
alt: "image",
|
|
133
127
|
class: "ds-h-full ds-w-full ds-rounded-lg"
|
|
134
|
-
}, null, 8,
|
|
135
|
-
|
|
128
|
+
}, null, 8, me),
|
|
129
|
+
m(F, {
|
|
136
130
|
class: "ds-right-1 ds-top-1 ds-h-8 ds-w-8",
|
|
137
|
-
onClick:
|
|
131
|
+
onClick: C((o) => J(r), ["stop"])
|
|
138
132
|
}, null, 8, ["onClick"])
|
|
139
|
-
], 40,
|
|
133
|
+
], 40, pe))), 128)) : (n(), p("div", {
|
|
140
134
|
key: 1,
|
|
141
135
|
class: "b-image-picker__draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t",
|
|
142
136
|
draggable: "true",
|
|
143
|
-
onClick: t[0] || (t[0] = (l) =>
|
|
137
|
+
onClick: t[0] || (t[0] = (l) => b(s.value))
|
|
144
138
|
}, [
|
|
145
139
|
i("img", {
|
|
146
140
|
src: s.value.url,
|
|
147
141
|
alt: "image",
|
|
148
142
|
class: "ds-h-full ds-w-full ds-rounded-lg"
|
|
149
|
-
}, null, 8,
|
|
150
|
-
|
|
143
|
+
}, null, 8, ve),
|
|
144
|
+
m(F, {
|
|
151
145
|
class: "ds-right-1 ds-top-1 ds-h-8 ds-w-8",
|
|
152
|
-
onClick:
|
|
146
|
+
onClick: C(K, ["stop"])
|
|
153
147
|
})
|
|
154
148
|
]))
|
|
155
149
|
])),
|
|
156
|
-
i("div",
|
|
157
|
-
|
|
158
|
-
default:
|
|
159
|
-
Z(ee(
|
|
160
|
-
]),
|
|
161
|
-
appendIcon: x(() => [
|
|
162
|
-
ke
|
|
150
|
+
i("div", fe, [
|
|
151
|
+
m(oe, { onClick: H }, {
|
|
152
|
+
default: I(() => [
|
|
153
|
+
Z(ee(k(v)("ds.components.base.image_picker.select_image")), 1)
|
|
163
154
|
]),
|
|
155
|
+
appendIcon: I(() => t[2] || (t[2] = [
|
|
156
|
+
i("svg", {
|
|
157
|
+
class: "ds-h-4 ds-w-4 ds-fill-primary-t",
|
|
158
|
+
viewBox: "0 0 512 512",
|
|
159
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
160
|
+
}, [
|
|
161
|
+
i("path", { d: "M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z" })
|
|
162
|
+
], -1)
|
|
163
|
+
])),
|
|
164
164
|
_: 1
|
|
165
165
|
}),
|
|
166
166
|
i("input", {
|
|
167
167
|
ref_key: "inputRef",
|
|
168
|
-
ref:
|
|
169
|
-
accept:
|
|
168
|
+
ref: f,
|
|
169
|
+
accept: w.value,
|
|
170
170
|
multiple: a.multiple,
|
|
171
171
|
class: "ds-hidden",
|
|
172
172
|
type: "file",
|
|
173
173
|
onChange: O
|
|
174
|
-
}, null, 40,
|
|
174
|
+
}, null, 40, he)
|
|
175
175
|
])
|
|
176
176
|
]),
|
|
177
|
-
a.hideDetails ? V("", !0) : (n(), te(
|
|
177
|
+
a.hideDetails ? V("", !0) : (n(), te(ie, {
|
|
178
178
|
key: 0,
|
|
179
|
-
"error-message":
|
|
179
|
+
"error-message": k($).errorMessage(),
|
|
180
180
|
class: "ds-mt-1"
|
|
181
181
|
}, null, 8, ["error-message"])),
|
|
182
|
-
|
|
183
|
-
modelValue:
|
|
184
|
-
"onUpdate:modelValue": t[1] || (t[1] = (l) =>
|
|
185
|
-
url:
|
|
182
|
+
m(le, {
|
|
183
|
+
modelValue: c.value.visible,
|
|
184
|
+
"onUpdate:modelValue": t[1] || (t[1] = (l) => c.value.visible = l),
|
|
185
|
+
url: c.value.url
|
|
186
186
|
}, null, 8, ["modelValue", "url"])
|
|
187
187
|
]));
|
|
188
188
|
}
|
|
189
189
|
});
|
|
190
190
|
export {
|
|
191
|
-
|
|
191
|
+
Re as default
|
|
192
192
|
};
|
|
193
193
|
//# sourceMappingURL=design-system85.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"design-system85.mjs","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, withModifiers as _withModifiers, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from \"vue\"\n\nconst _withScopeId = n => (_pushScopeId(\"data-v-8033e228\"),n=n(),_popScopeId(),n)\nconst _hoisted_1 = { class: \"b-image-picker ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n key: 0,\n class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = [\"src\"]\nconst _hoisted_7 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_8 = /*#__PURE__*/ _withScopeId(() => /*#__PURE__*/_createElementVNode(\"svg\", {\n class: \"ds-h-4 ds-w-4 ds-fill-primary-t\",\n viewBox: \"0 0 512 512\",\n xmlns: \"http://www.w3.org/2000/svg\"\n}, [\n /*#__PURE__*/_createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n], -1))\nconst _hoisted_9 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n//#region Props\nexport interface Props {\n inputId?: string;\n /**\n * Empty object <code>multiple: false</code> or empty array <code>multiple: true</code>.\n */\n modelValue: FileItemRead | FileItemRead[];\n label?: string;\n /**\n * Allow to pick multiple images, v-model expects an array.\n */\n multiple?: boolean;\n /**\n * Maximum file size in MB.\n */\n maxFileSize?: number;\n hideDetails?: boolean;\n required?: boolean;\n requiredErrorMessage?: string;\n validationRules?: ValidationRule[];\n}\n\n\nexport default /*#__PURE__*/_defineComponent({\n __name: 'BImagePicker',\n props: {\n inputId: { default: '' },\n modelValue: {},\n label: { default: '' },\n multiple: { type: Boolean, default: false },\n maxFileSize: { default: 20 },\n hideDetails: { type: Boolean, default: false },\n required: { type: Boolean, default: false },\n requiredErrorMessage: { default: '' },\n validationRules: { default: undefined }\n },\n emits: [\"change\", \"update:modelValue\"],\n setup(__props: any, { expose: __expose, emit: __emit }) {\n\n// Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n get() {\n return props.modelValue;\n },\n set(val) {\n emit('update:modelValue', val);\n },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n visible: false,\n url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n errorMessage: () =>\n props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n validateRule: () => fileTypesValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_types_valid', {\n types: allowedTypes.value,\n }),\n};\nconst validateFileSizeValid: ValidationRule = {\n validateRule: () => fileSizeValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_size_valid', {\n size: props.maxFileSize,\n }),\n};\nconst vRules = computed(() => {\n let result: ValidationRule[] = [];\n\n if (props.required) {\n result.push(validateRequired);\n }\n if (props.validationRules) {\n result = result.concat(props.validationRules);\n }\n result.push(validateFileTypesValid);\n result.push(validateFileSizeValid);\n\n return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n id.value,\n value,\n vRules.value,\n);\n//#endregion\n\n//#region Methods\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n draggedIndex.value = index;\n const target = e.target as HTMLDivElement;\n target.classList.add('dragging');\n e.dataTransfer!.effectAllowed = 'move';\n e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n if (draggedIndex.value !== index) {\n target.classList.add('dropped-target');\n }\n};\nconst handleDragOver = (e: DragEvent) => {\n // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n e.preventDefault();\n e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n // When the draggable p element leaves the droptarget, reset the style\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n e.preventDefault();\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n const draggedImg = (value.value as FileItemRead[])[draggedIndex];\n (value.value as FileItemRead[]).splice(draggedIndex, 1);\n (value.value as FileItemRead[]).splice(index, 0, draggedImg);\n\n emit('change');\n validate();\n};\nconst openFileDialog = () => {\n inputRef.value?.click();\n};\nconst handleChangeInput = (e: any) => {\n let fileList: FileList = e.target.files || e.dataTransfer.files;\n if (!fileList.length) {\n return;\n }\n createFileImages(fileList);\n\n // Clear input's value so onChange event can work for the same files next picks\n if (inputRef.value) {\n inputRef.value.value = null as any;\n }\n};\nconst createFileImages = (fileList: FileList) => {\n Array.from(fileList).forEach((file) => {\n fileTypesValid.value = FileImageTypes.includes(file.type);\n fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n if (fileTypesValid.value && fileSizeValid.value) {\n let reader: any = new FileReader();\n\n reader.onload = (f: any) => {\n if (props.multiple) {\n (value.value as FileItemRead[]).push({\n url: f.target.result,\n file,\n type: file.type,\n });\n } else {\n // splice(index, how-many, item1, item2,...);\n value.value = {\n url: f.target.result,\n file,\n type: file.type,\n };\n }\n\n emit('change');\n validate();\n };\n\n reader.readAsDataURL(file);\n } else {\n validate();\n }\n });\n};\nconst removeFileImage = (index: number) => {\n (value.value as FileItemRead[]).splice(index, 1);\n emit('change');\n validate();\n};\nconst removeFileImageSingle = () => {\n value.value = {};\n emit('change');\n validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n previewImage.value.url = item.url || '';\n previewImage.value.visible = true;\n};\n//#endregion\n\n__expose({ validate });\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _createVNode(BLabel, {\n label: props.label\n }, null, 8, [\"label\"]),\n _createElementVNode(\"div\", _hoisted_2, [\n (!_unref(isEmpty)(value.value))\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n (props.multiple)\n ? (_openBlock(true), _createElementBlock(_Fragment, { key: 0 }, _renderList(value.value as FileItemRead[], (item, index) => {\n return (_openBlock(), _createElementBlock(\"div\", {\n key: item.url,\n class: \"b-image-picker__draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: ($event: any) => (preview(item)),\n onDragend: handleDragEnd,\n onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n onDragleave: handleDragLeave,\n onDragover: handleDragOver,\n onDragstart: ($event: any) => (handleDragStart(index, $event)),\n onDrop: ($event: any) => (handleDrop(index, $event))\n }, [\n _createElementVNode(\"img\", {\n src: item.url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_5),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: _withModifiers(($event: any) => (removeFileImage(index)), [\"stop\"])\n }, null, 8, [\"onClick\"])\n ], 40, _hoisted_4))\n }), 128))\n : (_openBlock(), _createElementBlock(\"div\", {\n key: 1,\n class: \"b-image-picker__draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: _cache[0] || (_cache[0] = ($event: any) => (preview(value.value as FileItemRead)))\n }, [\n _createElementVNode(\"img\", {\n src: (value.value as FileItemRead).url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_6),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: _withModifiers(removeFileImageSingle, [\"stop\"])\n })\n ]))\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"div\", _hoisted_7, [\n _createVNode(BButton, { onClick: openFileDialog }, {\n default: _withCtx(() => [\n _createTextVNode(_toDisplayString(_unref(t)('ds.components.base.image_picker.select_image')), 1)\n ]),\n appendIcon: _withCtx(() => [\n _hoisted_8\n ]),\n _: 1\n }),\n _createElementVNode(\"input\", {\n ref_key: \"inputRef\",\n ref: inputRef,\n accept: allowedTypes.value,\n multiple: props.multiple,\n class: \"ds-hidden\",\n type: \"file\",\n onChange: handleChangeInput\n }, null, 40, _hoisted_9)\n ])\n ]),\n (!props.hideDetails)\n ? (_openBlock(), _createBlock(BErrorMessage, {\n key: 0,\n \"error-message\": _unref(validationResult).errorMessage(),\n class: \"ds-mt-1\"\n }, null, 8, [\"error-message\"]))\n : _createCommentVNode(\"\", true),\n _createVNode(ImagePreview, {\n modelValue: previewImage.value.visible,\n \"onUpdate:modelValue\": _cache[1] || (_cache[1] = ($event: any) => ((previewImage.value.visible) = $event)),\n url: previewImage.value.url\n }, null, 8, [\"modelValue\", \"url\"])\n ]))\n}\n}\n\n})"],"names":["_withScopeId","_pushScopeId","n","_popScopeId","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_createElementVNode","_hoisted_9","_sfc_main","_defineComponent","__props","__expose","__emit","props","emit","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","handleChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","removeFileImageSingle","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","_withModifiers","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":";;;;;;;;;;;AAGA,MAAMA,KAAe,QAAMC,GAAa,iBAAiB,GAAEC,IAAEA,KAAIC,MAAcD,IACzEE,KAAa,EAAE,OAAO,8BACtBC,KAAa,EAAE,OAAO,2EACtBC,KAAa;AAAA,EACjB,KAAK;AAAA,EACL,OAAO;AACT,GACMC,KAAa,CAAC,WAAW,eAAe,eAAe,QAAQ,GAC/DC,KAAa,CAAC,KAAK,GACnBC,KAAa,CAAC,KAAK,GACnBC,KAAa,EAAE,OAAO,4CACtBC,KAA2B,gBAAAX,GAAa,MAAmBY,gBAAAA,EAAoB,OAAO;AAAA,EAC1F,OAAO;AAAA,EACP,SAAS;AAAA,EACT,OAAO;AACT,GAAG;AAAA,EACgCA,gBAAAA,EAAA,QAAQ,EAAE,GAAG,ygBAAygB;AACzjB,GAAG,EAAE,CAAC,GACAC,KAAa,CAAC,UAAU,UAAU,GAuCZC,KAAiBC,gBAAAA,EAAA;AAAA,EAC3C,QAAQ;AAAA,EACR,OAAO;AAAA,IACL,SAAS,EAAE,SAAS,GAAG;AAAA,IACvB,YAAY,CAAC;AAAA,IACb,OAAO,EAAE,SAAS,GAAG;AAAA,IACrB,UAAU,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC1C,aAAa,EAAE,SAAS,GAAG;AAAA,IAC3B,aAAa,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC7C,UAAU,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC1C,sBAAsB,EAAE,SAAS,GAAG;AAAA,IACpC,iBAAiB,EAAE,SAAS,OAAU;AAAA,EACxC;AAAA,EACA,OAAO,CAAC,UAAU,mBAAmB;AAAA,EACrC,MAAMC,GAAc,EAAE,QAAQC,GAAU,MAAMC,KAAU;AAG1D,UAAMC,IAAQH,GAIRI,IAAOF,GAIP,EAAE,GAAAG,MAAMC,MACRC,IAAWC,EAA6B,IAAI,GAC5CC,IAAeD,EAAI,CAAC,GACpBE,IAAQC,EAAS;AAAA,MACrB,MAAM;AACJ,eAAOR,EAAM;AAAA,MACf;AAAA,MACA,IAAIS,GAAK;AACP,QAAAR,EAAK,qBAAqBQ,CAAG;AAAA,MAC/B;AAAA,IAAA,CACD,GACKC,IAAiBL,EAAI,EAAI,GACzBM,IAAgBN,EAAI,EAAI,GACxBO,IAAeP,EAAI;AAAA,MACvB,SAAS;AAAA,MACT,KAAK;AAAA,IAAA,CACN,GACKQ,IAAeL,EAAS,MAAMM,EAAe,KAAK,IAAI,CAAC,GACvDC,IAAKP,EAAS,MAAMR,EAAM,WAAW,MAAMgB,IAAM,EAAE,GACnDC,IAAmC;AAAA,MACvC,cAAc,CAACR,MAAwB,CAAC,CAACA,KAAOA,EAAI,SAAS;AAAA,MAC7D,cAAc,MACZT,EAAM,wBAAwBE,EAAE,0BAA0B;AAAA,IAAA,GAExDgB,IAAyC;AAAA,MAC7C,cAAc,MAAMR,EAAe;AAAA,MACnC,cAAc,MACZR,EAAE,oDAAoD;AAAA,QACpD,OAAOW,EAAa;AAAA,MAAA,CACrB;AAAA,IAAA,GAECM,IAAwC;AAAA,MAC5C,cAAc,MAAMR,EAAc;AAAA,MAClC,cAAc,MACZT,EAAE,mDAAmD;AAAA,QACnD,MAAMF,EAAM;AAAA,MAAA,CACb;AAAA,IAAA,GAECoB,IAASZ,EAAS,MAAM;AAC5B,UAAIa,IAA2B,CAAA;AAE/B,aAAIrB,EAAM,YACRqB,EAAO,KAAKJ,CAAgB,GAE1BjB,EAAM,oBACCqB,IAAAA,EAAO,OAAOrB,EAAM,eAAe,IAE9CqB,EAAO,KAAKH,CAAsB,GAClCG,EAAO,KAAKF,CAAqB,GAE1BE,EAAO,SAASA,IAAS;AAAA,IAAA,CACjC,GACK,EAAE,UAAAC,GAAU,kBAAAC,EAAA,IAAqBC;AAAA,MACrCT,EAAG;AAAA,MACHR;AAAA,MACAa,EAAO;AAAA,IAAA,GAMHK,IAAkB,CAACC,GAAeC,MAAiB;AACvD,MAAArB,EAAa,QAAQoB,GACNC,EAAE,OACV,UAAU,IAAI,UAAU,GAC/BA,EAAE,aAAc,gBAAgB,QAChCA,EAAE,aAAc,QAAQ,SAASD,EAAM,UAAU;AAAA,IAAA,GAE7CE,IAAgB,CAAC,MAAiB;AAE/B,MADQ,EAAE,OACV,UAAU,OAAO,UAAU;AAAA,IAAA,GAG9BC,IAAkB,CAACH,GAAeC,MAAiB;AACvD,YAAMG,IAASH,EAAE;AACb,MAAArB,EAAa,UAAUoB,KAClBI,EAAA,UAAU,IAAI,gBAAgB;AAAA,IACvC,GAEIC,IAAiB,CAAC,MAAiB;AAEvC,QAAE,eAAe,GACjB,EAAE,aAAc,aAAa;AAAA,IAAA,GAEzBC,IAAkB,CAAC,MAAiB;AAGjC,MADQ,EAAE,OACV,UAAU,OAAO,gBAAgB;AAAA,IAAA,GAEpCC,IAAa,CAACP,GAAeC,MAAiB;AAClD,MAAAA,EAAE,eAAe,GACFA,EAAE,OACV,UAAU,OAAO,gBAAgB;AACxC,YAAMrB,IAAe,SAASqB,EAAE,aAAc,QAAQ,OAAO,CAAC,GACxDO,IAAc3B,EAAM,MAAyBD,CAAY;AAC9D,MAAAC,EAAM,MAAyB,OAAOD,GAAc,CAAC,GACrDC,EAAM,MAAyB,OAAOmB,GAAO,GAAGQ,CAAU,GAE3DjC,EAAK,QAAQ,GACJqB;IAAA,GAELa,IAAiB,MAAM;;AAC3B,OAAAC,IAAAhC,EAAS,UAAT,QAAAgC,EAAgB;AAAA,IAAM,GAElBC,IAAoB,CAAC,MAAW;AACpC,UAAIC,IAAqB,EAAE,OAAO,SAAS,EAAE,aAAa;AACtD,MAACA,EAAS,WAGdC,EAAiBD,CAAQ,GAGrBlC,EAAS,UACXA,EAAS,MAAM,QAAQ;AAAA,IACzB,GAEImC,IAAmB,CAACD,MAAuB;AAC/C,YAAM,KAAKA,CAAQ,EAAE,QAAQ,CAACE,MAAS;AAIjC,YAHJ9B,EAAe,QAAQI,EAAe,SAAS0B,EAAK,IAAI,GACxD7B,EAAc,QAAQ8B,EAAYD,EAAK,IAAI,KAAKxC,EAAM,aAElDU,EAAe,SAASC,EAAc,OAAO;AAC3C,cAAA+B,IAAc,IAAI;AAEf,UAAAA,EAAA,SAAS,CAACC,MAAW;AAC1B,YAAI3C,EAAM,WACPO,EAAM,MAAyB,KAAK;AAAA,cACnC,KAAKoC,EAAE,OAAO;AAAA,cACd,MAAAH;AAAA,cACA,MAAMA,EAAK;AAAA,YAAA,CACZ,IAGDjC,EAAM,QAAQ;AAAA,cACZ,KAAKoC,EAAE,OAAO;AAAA,cACd,MAAAH;AAAA,cACA,MAAMA,EAAK;AAAA,YAAA,GAIfvC,EAAK,QAAQ,GACJqB;UAAA,GAGXoB,EAAO,cAAcF,CAAI;AAAA,QAAA;AAEhB,UAAAlB;MACX,CACD;AAAA,IAAA,GAEGsB,IAAkB,CAAClB,MAAkB;AACxC,MAAAnB,EAAM,MAAyB,OAAOmB,GAAO,CAAC,GAC/CzB,EAAK,QAAQ,GACJqB;IAAA,GAELuB,IAAwB,MAAM;AAClC,MAAAtC,EAAM,QAAQ,IACdN,EAAK,QAAQ,GACJqB;IAAA,GAELmB,IAAc,CAACK,MAA0BA,IAAgB,QAAQ,GACjEC,IAAU,CAACC,MAAuB;AACzB,MAAApC,EAAA,MAAM,MAAMoC,EAAK,OAAO,IACrCpC,EAAa,MAAM,UAAU;AAAA,IAAA;AAItB,WAAAd,EAAA,EAAE,UAAAwB,GAAU,GAEd,CAAC2B,GAAUC,OACRC,EAAW,GAAGC,EAAoB,OAAOnE,IAAY;AAAA,MAC3DoE,EAAaC,IAAQ;AAAA,QACnB,OAAOtD,EAAM;AAAA,MACZ,GAAA,MAAM,GAAG,CAAC,OAAO,CAAC;AAAA,MACrBP,EAAoB,OAAOP,IAAY;AAAA,QACnCqE,EAAOC,EAAO,EAAEjD,EAAM,KAAK,IA4CzBkD,EAAoB,IAAI,EAAI,KA3C3BN,KAAcC,EAAoB,OAAOjE,IAAY;AAAA,UACnDa,EAAM,YACFmD,EAAW,EAAI,GAAGC,EAAoBM,GAAW,EAAE,KAAK,EAAA,GAAKC,EAAYpD,EAAM,OAAyB,CAACyC,GAAMtB,OACtGyB,EAAA,GAAcC,EAAoB,OAAO;AAAA,YAC/C,KAAKJ,EAAK;AAAA,YACV,OAAO;AAAA,YACP,WAAW;AAAA,YACX,SAAS,CAACY,MAAiBb,EAAQC,CAAI;AAAA,YACvC,WAAWpB;AAAA,YACX,aAAa,CAACgC,MAAiB/B,EAAgBH,GAAOkC,CAAM;AAAA,YAC5D,aAAa5B;AAAA,YACb,YAAYD;AAAA,YACZ,aAAa,CAAC6B,MAAiBnC,EAAgBC,GAAOkC,CAAM;AAAA,YAC5D,QAAQ,CAACA,MAAiB3B,EAAWP,GAAOkC,CAAM;AAAA,UAAA,GACjD;AAAA,YACDnE,EAAoB,OAAO;AAAA,cACzB,KAAKuD,EAAK;AAAA,cACV,KAAK;AAAA,cACL,OAAO;AAAA,YAAA,GACN,MAAM,GAAG3D,EAAU;AAAA,YACtBgE,EAAaQ,GAAyB;AAAA,cACpC,OAAO;AAAA,cACP,SAASC,EAAe,CAACF,MAAiBhB,EAAgBlB,CAAK,GAAI,CAAC,MAAM,CAAC;AAAA,YAC1E,GAAA,MAAM,GAAG,CAAC,SAAS,CAAC;AAAA,UAAA,GACtB,IAAItC,EAAU,EAClB,GAAG,GAAG,MACN+D,EAAW,GAAGC,EAAoB,OAAO;AAAA,YACxC,KAAK;AAAA,YACL,OAAO;AAAA,YACP,WAAW;AAAA,YACX,SAASF,EAAO,CAAC,MAAMA,EAAO,CAAC,IAAI,CAACU,MAAiBb,EAAQxC,EAAM,KAAqB;AAAA,UAAA,GACvF;AAAA,YACDd,EAAoB,OAAO;AAAA,cACzB,KAAMc,EAAM,MAAuB;AAAA,cACnC,KAAK;AAAA,cACL,OAAO;AAAA,YAAA,GACN,MAAM,GAAGjB,EAAU;AAAA,YACtB+D,EAAaQ,GAAyB;AAAA,cACpC,OAAO;AAAA,cACP,SAASC,EAAejB,GAAuB,CAAC,MAAM,CAAC;AAAA,YAAA,CACxD;AAAA,UAAA,CACF;AAAA,QAAA,CACN;AAAA,QAELpD,EAAoB,OAAOF,IAAY;AAAA,UACrC8D,EAAaU,IAAS,EAAE,SAAS5B,KAAkB;AAAA,YACjD,SAAS6B,EAAS,MAAM;AAAA,cACtBC,EAAiBC,GAAiBX,EAAOrD,CAAC,EAAE,8CAA8C,CAAC,GAAG,CAAC;AAAA,YAAA,CAChG;AAAA,YACD,YAAY8D,EAAS,MAAM;AAAA,cACzBxE;AAAA,YAAA,CACD;AAAA,YACD,GAAG;AAAA,UAAA,CACJ;AAAA,UACDC,EAAoB,SAAS;AAAA,YAC3B,SAAS;AAAA,YACT,KAAKW;AAAA,YACL,QAAQS,EAAa;AAAA,YACrB,UAAUb,EAAM;AAAA,YAChB,OAAO;AAAA,YACP,MAAM;AAAA,YACN,UAAUqC;AAAA,UAAA,GACT,MAAM,IAAI3C,EAAU;AAAA,QAAA,CACxB;AAAA,MAAA,CACF;AAAA,MACCM,EAAM,cAMJyD,EAAoB,IAAI,EAAI,KAL3BN,EAAW,GAAGgB,GAAaC,IAAe;AAAA,QACzC,KAAK;AAAA,QACL,iBAAiBb,EAAOhC,CAAgB,EAAE,aAAa;AAAA,QACvD,OAAO;AAAA,MAAA,GACN,MAAM,GAAG,CAAC,eAAe,CAAC;AAAA,MAEjC8B,EAAagB,IAAc;AAAA,QACzB,YAAYzD,EAAa,MAAM;AAAA,QAC/B,uBAAuBsC,EAAO,CAAC,MAAMA,EAAO,CAAC,IAAI,CAACU,MAAkBhD,EAAa,MAAM,UAAWgD;AAAA,QAClG,KAAKhD,EAAa,MAAM;AAAA,SACvB,MAAM,GAAG,CAAC,cAAc,KAAK,CAAC;AAAA,IAAA,CAClC;AAAA,EAEH;AAEA,CAAC;"}
|
|
1
|
+
{"version":3,"file":"design-system85.mjs","sources":["../src/components/BImagePicker/BImagePicker.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { createVNode as _createVNode, unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, withModifiers as _withModifiers, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock } from \"vue\"\n\nconst _hoisted_1 = { class: \"b-image-picker ds-w-full\" }\nconst _hoisted_2 = { class: \"ds-gap-2 ds-space-y-4 ds-rounded-lg ds-bg-white ds-p-4 ds-drop-shadow\" }\nconst _hoisted_3 = {\n key: 0,\n class: \"ds-flex ds-flex-wrap ds-justify-center ds-gap-1\"\n}\nconst _hoisted_4 = [\"onClick\", \"onDragenter\", \"onDragstart\", \"onDrop\"]\nconst _hoisted_5 = [\"src\"]\nconst _hoisted_6 = [\"src\"]\nconst _hoisted_7 = { class: \"ds-flex ds-flex-wrap ds-justify-center\" }\nconst _hoisted_8 = [\"accept\", \"multiple\"]\n\nimport { FileImageTypes } from '@/constants/Common';\nimport type { FileItemRead } from '@/types';\nimport { isEmpty } from 'lodash-es';\nimport { v4 as uuid } from 'uuid';\nimport { computed, ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\nimport BImagePickerCloseButton from './BImagePickerCloseButton.vue';\nimport ImagePreview from './BImagePreview.vue';\nimport type { ValidationRule } from '@/composables/Validation';\nimport { useValidationField } from '@/composables/Validation';\nimport BLabel from '../BLabel.vue';\nimport BButton from '../BButton.vue';\nimport BErrorMessage from '../BErrorMessage.vue';\n\n//#region Props\nexport interface Props {\n inputId?: string;\n /**\n * Empty object <code>multiple: false</code> or empty array <code>multiple: true</code>.\n */\n modelValue: FileItemRead | FileItemRead[];\n label?: string;\n /**\n * Allow to pick multiple images, v-model expects an array.\n */\n multiple?: boolean;\n /**\n * Maximum file size in MB.\n */\n maxFileSize?: number;\n hideDetails?: boolean;\n required?: boolean;\n requiredErrorMessage?: string;\n validationRules?: ValidationRule[];\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n __name: 'BImagePicker',\n props: {\n inputId: { default: '' },\n modelValue: {},\n label: { default: '' },\n multiple: { type: Boolean, default: false },\n maxFileSize: { default: 20 },\n hideDetails: { type: Boolean, default: false },\n required: { type: Boolean, default: false },\n requiredErrorMessage: { default: '' },\n validationRules: { default: undefined }\n },\n emits: [\"change\", \"update:modelValue\"],\n setup(__props: any, { expose: __expose, emit: __emit }) {\n\n// Drag & Drop: https://www.w3schools.com/jsref/event_ondragover.asp\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst { t } = useI18n();\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst draggedIndex = ref(0);\nconst value = computed({\n get() {\n return props.modelValue;\n },\n set(val) {\n emit('update:modelValue', val);\n },\n});\nconst fileTypesValid = ref(true);\nconst fileSizeValid = ref(true);\nconst previewImage = ref({\n visible: false,\n url: '',\n});\nconst allowedTypes = computed(() => FileImageTypes.join(', '));\nconst id = computed(() => props.inputId || `id-${uuid()}`);\nconst validateRequired: ValidationRule = {\n validateRule: (val: FileItemRead[]) => !!val && val.length > 0,\n errorMessage: () =>\n props.requiredErrorMessage || t('ds.global.field_required'),\n};\nconst validateFileTypesValid: ValidationRule = {\n validateRule: () => fileTypesValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_types_valid', {\n types: allowedTypes.value,\n }),\n};\nconst validateFileSizeValid: ValidationRule = {\n validateRule: () => fileSizeValid.value,\n errorMessage: () =>\n t('ds.components.base.image_picker.file_size_valid', {\n size: props.maxFileSize,\n }),\n};\nconst vRules = computed(() => {\n let result: ValidationRule[] = [];\n\n if (props.required) {\n result.push(validateRequired);\n }\n if (props.validationRules) {\n result = result.concat(props.validationRules);\n }\n result.push(validateFileTypesValid);\n result.push(validateFileSizeValid);\n\n return result.length ? result : undefined;\n});\nconst { validate, validationResult } = useValidationField(\n id.value,\n value,\n vRules.value,\n);\n//#endregion\n\n//#region Methods\n/* Events fired on the drag target */\nconst handleDragStart = (index: number, e: DragEvent) => {\n draggedIndex.value = index;\n const target = e.target as HTMLDivElement;\n target.classList.add('dragging');\n e.dataTransfer!.effectAllowed = 'move';\n e.dataTransfer!.setData('index', index.toString());\n};\nconst handleDragEnd = (e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n target.classList.remove('dragging');\n};\n/* Events fired on the drop target */\nconst handleDragEnter = (index: number, e: DragEvent) => {\n const target = e.target as HTMLDivElement;\n if (draggedIndex.value !== index) {\n target.classList.add('dropped-target');\n }\n};\nconst handleDragOver = (e: DragEvent) => {\n // By default, data/elements cannot be dropped in other elements. To allow a drop, we must prevent the default handling of the element\n e.preventDefault();\n e.dataTransfer!.dropEffect = 'move';\n};\nconst handleDragLeave = (e: DragEvent) => {\n // When the draggable p element leaves the droptarget, reset the style\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n};\nconst handleDrop = (index: number, e: DragEvent) => {\n e.preventDefault();\n const target = e.target as HTMLDivElement;\n target.classList.remove('dropped-target');\n const draggedIndex = parseInt(e.dataTransfer!.getData('index'));\n const draggedImg = (value.value as FileItemRead[])[draggedIndex];\n (value.value as FileItemRead[]).splice(draggedIndex, 1);\n (value.value as FileItemRead[]).splice(index, 0, draggedImg);\n\n emit('change');\n validate();\n};\nconst openFileDialog = () => {\n inputRef.value?.click();\n};\nconst handleChangeInput = (e: any) => {\n let fileList: FileList = e.target.files || e.dataTransfer.files;\n if (!fileList.length) {\n return;\n }\n createFileImages(fileList);\n\n // Clear input's value so onChange event can work for the same files next picks\n if (inputRef.value) {\n inputRef.value.value = null as any;\n }\n};\nconst createFileImages = (fileList: FileList) => {\n Array.from(fileList).forEach((file) => {\n fileTypesValid.value = FileImageTypes.includes(file.type);\n fileSizeValid.value = convertToMB(file.size) <= props.maxFileSize;\n\n if (fileTypesValid.value && fileSizeValid.value) {\n let reader: any = new FileReader();\n\n reader.onload = (f: any) => {\n if (props.multiple) {\n (value.value as FileItemRead[]).push({\n url: f.target.result,\n file,\n type: file.type,\n });\n } else {\n // splice(index, how-many, item1, item2,...);\n value.value = {\n url: f.target.result,\n file,\n type: file.type,\n };\n }\n\n emit('change');\n validate();\n };\n\n reader.readAsDataURL(file);\n } else {\n validate();\n }\n });\n};\nconst removeFileImage = (index: number) => {\n (value.value as FileItemRead[]).splice(index, 1);\n emit('change');\n validate();\n};\nconst removeFileImageSingle = () => {\n value.value = {};\n emit('change');\n validate();\n};\nconst convertToMB = (numberOfBytes: number) => numberOfBytes / 1024 ** 2;\nconst preview = (item: FileItemRead) => {\n previewImage.value.url = item.url || '';\n previewImage.value.visible = true;\n};\n//#endregion\n\n__expose({ validate });\n\nreturn (_ctx: any,_cache: any) => {\n return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n _createVNode(BLabel, {\n label: props.label\n }, null, 8, [\"label\"]),\n _createElementVNode(\"div\", _hoisted_2, [\n (!_unref(isEmpty)(value.value))\n ? (_openBlock(), _createElementBlock(\"div\", _hoisted_3, [\n (props.multiple)\n ? (_openBlock(true), _createElementBlock(_Fragment, { key: 0 }, _renderList(value.value as FileItemRead[], (item, index) => {\n return (_openBlock(), _createElementBlock(\"div\", {\n key: item.url,\n class: \"b-image-picker__draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: ($event: any) => (preview(item)),\n onDragend: handleDragEnd,\n onDragenter: ($event: any) => (handleDragEnter(index, $event)),\n onDragleave: handleDragLeave,\n onDragover: handleDragOver,\n onDragstart: ($event: any) => (handleDragStart(index, $event)),\n onDrop: ($event: any) => (handleDrop(index, $event))\n }, [\n _createElementVNode(\"img\", {\n src: item.url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_5),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: _withModifiers(($event: any) => (removeFileImage(index)), [\"stop\"])\n }, null, 8, [\"onClick\"])\n ], 40, _hoisted_4))\n }), 128))\n : (_openBlock(), _createElementBlock(\"div\", {\n key: 1,\n class: \"b-image-picker__draggable ds-h-full ds-cursor-pointer ds-rounded-lg ds-transition-all hover:ds-ring-2 hover:ds-ring-primary-t\",\n draggable: \"true\",\n onClick: _cache[0] || (_cache[0] = ($event: any) => (preview(value.value as FileItemRead)))\n }, [\n _createElementVNode(\"img\", {\n src: (value.value as FileItemRead).url,\n alt: \"image\",\n class: \"ds-h-full ds-w-full ds-rounded-lg\"\n }, null, 8, _hoisted_6),\n _createVNode(BImagePickerCloseButton, {\n class: \"ds-right-1 ds-top-1 ds-h-8 ds-w-8\",\n onClick: _withModifiers(removeFileImageSingle, [\"stop\"])\n })\n ]))\n ]))\n : _createCommentVNode(\"\", true),\n _createElementVNode(\"div\", _hoisted_7, [\n _createVNode(BButton, { onClick: openFileDialog }, {\n default: _withCtx(() => [\n _createTextVNode(_toDisplayString(_unref(t)('ds.components.base.image_picker.select_image')), 1)\n ]),\n appendIcon: _withCtx(() => _cache[2] || (_cache[2] = [\n _createElementVNode(\"svg\", {\n class: \"ds-h-4 ds-w-4 ds-fill-primary-t\",\n viewBox: \"0 0 512 512\",\n xmlns: \"http://www.w3.org/2000/svg\"\n }, [\n _createElementVNode(\"path\", { d: \"M447.1 32h-384C28.64 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM111.1 96c26.51 0 48 21.49 48 48S138.5 192 111.1 192s-48-21.49-48-48S85.48 96 111.1 96zM446.1 407.6C443.3 412.8 437.9 416 432 416H82.01c-6.021 0-11.53-3.379-14.26-8.75c-2.73-5.367-2.215-11.81 1.334-16.68l70-96C142.1 290.4 146.9 288 152 288s9.916 2.441 12.93 6.574l32.46 44.51l93.3-139.1C293.7 194.7 298.7 192 304 192s10.35 2.672 13.31 7.125l128 192C448.6 396 448.9 402.3 446.1 407.6z\" })\n ], -1)\n ])),\n _: 1\n }),\n _createElementVNode(\"input\", {\n ref_key: \"inputRef\",\n ref: inputRef,\n accept: allowedTypes.value,\n multiple: props.multiple,\n class: \"ds-hidden\",\n type: \"file\",\n onChange: handleChangeInput\n }, null, 40, _hoisted_8)\n ])\n ]),\n (!props.hideDetails)\n ? (_openBlock(), _createBlock(BErrorMessage, {\n key: 0,\n \"error-message\": _unref(validationResult).errorMessage(),\n class: \"ds-mt-1\"\n }, null, 8, [\"error-message\"]))\n : _createCommentVNode(\"\", true),\n _createVNode(ImagePreview, {\n modelValue: previewImage.value.visible,\n \"onUpdate:modelValue\": _cache[1] || (_cache[1] = ($event: any) => ((previewImage.value.visible) = $event)),\n url: previewImage.value.url\n }, null, 8, [\"modelValue\", \"url\"])\n ]))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_sfc_main","_defineComponent","__props","__expose","__emit","props","emit","t","useI18n","inputRef","ref","draggedIndex","value","computed","val","fileTypesValid","fileSizeValid","previewImage","allowedTypes","FileImageTypes","id","uuid","validateRequired","validateFileTypesValid","validateFileSizeValid","vRules","result","validate","validationResult","useValidationField","handleDragStart","index","e","handleDragEnd","handleDragEnter","target","handleDragOver","handleDragLeave","handleDrop","draggedImg","openFileDialog","_a","handleChangeInput","fileList","createFileImages","file","convertToMB","reader","f","removeFileImage","removeFileImageSingle","numberOfBytes","preview","item","_ctx","_cache","_openBlock","_createElementBlock","_createVNode","BLabel","_createElementVNode","_unref","isEmpty","_createCommentVNode","_Fragment","_renderList","$event","BImagePickerCloseButton","_withModifiers","BButton","_withCtx","_createTextVNode","_toDisplayString","_createBlock","BErrorMessage","ImagePreview"],"mappings":"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"}
|