ablok-components 0.3.117 → 0.3.119

package/dist/components/molecules/bulk-upload/bulk-upload.vue.d.ts

@@ -10,13 +10,15 @@ declare var __VLS_1: {}, __VLS_20: {
         };
         index: number;
     };
-}, __VLS_33: {};
+}, __VLS_33: {}, __VLS_35: {};
 type __VLS_Slots = {} & {
     'bulk-remove'?: (props: typeof __VLS_1) => any;
 } & {
     'upload-progress'?: (props: typeof __VLS_20) => any;
 } & {
     button?: (props: typeof __VLS_33) => any;
+} & {
+    info?: (props: typeof __VLS_35) => any;
 };
 declare const __VLS_base: import('../../../../vue/dist/vue.esm-bundler.js').DefineComponent<import('../../../../vue/dist/vue.esm-bundler.js').ExtractPropTypes<{
     storeId: StringConstructor;
@@ -130,12 +132,29 @@ declare const __VLS_base: import('../../../../vue/dist/vue.esm-bundler.js').Defi
         type: NumberConstructor;
         default: number;
     };
+    minFiles: {
+        type: NumberConstructor;
+        default: number;
+    };
+    restrictRemoval: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showProgress: {
         type: BooleanConstructor;
         default: boolean;
     };
+    valid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import('../../../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, import('../../../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, {
     "update:modelValue": (...args: any[]) => void;
+    "update:valid": (...args: any[]) => void;
 }, string, import('../../../../vue/dist/vue.esm-bundler.js').PublicProps, Readonly<import('../../../../vue/dist/vue.esm-bundler.js').ExtractPropTypes<{
     storeId: StringConstructor;
     id: {
@@ -248,12 +267,29 @@ declare const __VLS_base: import('../../../../vue/dist/vue.esm-bundler.js').Defi
         type: NumberConstructor;
         default: number;
     };
+    minFiles: {
+        type: NumberConstructor;
+        default: number;
+    };
+    restrictRemoval: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showProgress: {
         type: BooleanConstructor;
         default: boolean;
     };
+    valid: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:valid"?: ((...args: any[]) => any) | undefined;
 }>, {
     size: number;
     title: string;
@@ -268,12 +304,16 @@ declare const __VLS_base: import('../../../../vue/dist/vue.esm-bundler.js').Defi
         uploadProgress?: number;
     }[];
     disabled: boolean;
+    validate: boolean;
+    valid: boolean;
     hasHeader: boolean;
     hasBulkRemove: boolean;
     hasCaptions: boolean;
     editCaptions: boolean;
     allowDuplicateFiles: boolean;
     maxFiles: number;
+    minFiles: number;
+    restrictRemoval: boolean;
     showProgress: boolean;
 }, {}, {}, {}, string, import('../../../../vue/dist/vue.esm-bundler.js').ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/components/molecules/bulk-upload/bulk-upload.vue_vue_type_script_setup_true_lang.js

@@ -1,17 +1,21 @@
 import { sanitizeHtml as e } from "../../../composables/useSanitize.js";
 import t from "../file-upload/file-upload.js";
-import { Fragment as n, computed as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, nextTick as l, normalizeClass as u, openBlock as d, ref as f, renderSlot as p, resolveComponent as m, toDisplayString as h, unref as g, vModelText as _, withCtx as v, withDirectives as y, withModifiers as b } from "vue";
+import { Fragment as n, computed as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, nextTick as l, normalizeClass as u, openBlock as d, ref as f, renderSlot as p, resolveComponent as m, toDisplayString as h, unref as g, vModelText as ee, watch as _, withCtx as v, withDirectives as te, withModifiers as y } from "vue";
+import { useI18n as ne } from "vue-i18n";
 //#region src/components/molecules/bulk-upload/bulk-upload.vue?vue&type=script&setup=true&lang.ts
-var ee = { class: "container" }, te = { class: "row" }, x = {
+var re = { class: "container-fluid" }, ie = { class: "row" }, ae = {
 	key: 0,
 	class: "col-12"
-}, S = { class: "py-4 px-3 d-flex align-items-center border border-bottom-0" }, C = ["innerHTML"], w = { class: "col-12" }, T = {
+}, oe = { class: "py-4 px-3 d-flex align-items-center border border-bottom-0" }, se = ["innerHTML"], ce = { class: "col-12" }, le = {
 	key: 0,
 	class: "grid place-items-center text-center text-muted py-5 border border-bottom-0"
-}, E = { class: "m-0" }, D = { class: "preview-item border-bottom p-3" }, O = { class: "d-flex gap-3" }, k = { class: "col-2" }, A = { class: "col d-flex flex-column" }, j = { class: "file-meta text-muted small mb-2" }, M = { class: "fw-semibold" }, N = { key: 0 }, P = { key: 1 }, F = ["onUpdate:modelValue", "id"], I = ["innerHTML"], L = {
+}, b = { class: "m-0" }, x = { class: "preview-item border-bottom p-3" }, S = { class: "d-flex gap-3" }, C = { class: "col-2" }, w = { class: "col d-flex flex-column" }, T = { class: "file-meta text-muted small mb-2" }, E = { class: "fw-semibold" }, D = { key: 0 }, O = { key: 1 }, k = ["onUpdate:modelValue", "id"], A = ["innerHTML"], j = {
 	key: 2,
 	class: "upload-progress mt-3 mb-0"
-}, R = ["value"], z = { class: "col-auto d-flex flex-column gap-2" }, B = ["onClick"], ne = ["onClick"], V = { class: "file-upload__label" }, H = { class: "d-flex align-items-end p-3" }, U = ["for"], W = ["innerHTML"], G = /*@__PURE__*/ c({
+}, M = ["value"], N = { class: "col-auto d-flex flex-column gap-2" }, P = ["onClick"], F = ["onClick"], I = { class: "d-flex justify-content-between align-items-center" }, L = { class: "file-upload__info p-3" }, R = {
+	key: 0,
+	class: "text-muted small"
+}, z = { class: "file-upload__label" }, ue = { class: "d-flex align-items-end p-3" }, B = ["for"], V = ["innerHTML"], H = /*@__PURE__*/ c({
 	__name: "bulk-upload",
 	props: {
 		storeId: String,
@@ -60,17 +64,33 @@ var ee = { class: "container" }, te = { class: "row" }, x = {
 			type: Number,
 			default: 0
 		},
+		minFiles: {
+			type: Number,
+			default: 0
+		},
+		restrictRemoval: {
+			type: Boolean,
+			default: !1
+		},
 		showProgress: {
 			type: Boolean,
 			default: !0
+		},
+		valid: {
+			type: Boolean,
+			default: !0
+		},
+		validate: {
+			type: Boolean,
+			default: !0
 		}
 	},
-	emits: ["update:modelValue"],
-	setup(c, { emit: G }) {
-		let K = c, q = G, J = (e) => `${e.name ?? ""}|${e.size ?? 0}|${e.lastModified ?? 0}|${e.type ?? ""}`, Y = r({
+	emits: ["update:modelValue", "update:valid"],
+	setup(c, { emit: H }) {
+		let U = c, W = H, { t: G } = ne(), K = (e) => `${e.name ?? ""}|${e.size ?? 0}|${e.lastModified ?? 0}|${e.type ?? ""}`, q = r({
 			get: () => {
-				let e = K.modelValue || [];
-				return Q.value = e.map((e) => e.caption || ""), e.map((e) => ({
+				let e = U.modelValue || [];
+				return X.value = e.map((e) => e.caption || ""), e.map((e) => ({
 					type: e.type,
 					src: e.src,
 					...e.name ? { name: e.name } : {},
@@ -80,21 +100,42 @@ var ee = { class: "container" }, te = { class: "row" }, x = {
 				}));
 			},
 			set: (e) => {
-				let t = Y.value || [], n = Array.isArray(e) ? e : [], r = K.allowDuplicateFiles ? n : n.filter((e) => {
-					let n = J(e);
-					return !t.some((e) => J(e) === n);
-				}), i = K.maxFiles > 0 ? Math.max(0, K.maxFiles - t.length) : void 0, a = typeof i == "number" ? r.slice(0, i) : r;
-				!K.allowDuplicateFiles && n.length > 0 && a.length === 0 || (a.length <= t.length && a.every((e) => t.some((t) => t.src === e.src)) ? $(a) : $([...t, ...a]));
+				let t = q.value || [], n = Array.isArray(e) ? e : [], r = U.allowDuplicateFiles ? n : n.filter((e) => {
+					let n = K(e);
+					return !t.some((e) => K(e) === n);
+				}), i = U.maxFiles > 0 ? Math.max(0, U.maxFiles - t.length) : void 0, a = typeof i == "number" ? r.slice(0, i) : r;
+				!U.allowDuplicateFiles && n.length > 0 && a.length === 0 || (a.length <= t.length && a.every((e) => t.some((t) => t.src === e.src)) ? $(a) : $([...t, ...a]));
 			}
-		}), X = f(null), Z = f({}), Q = f({}), re = r(() => K.disabled || K.maxFiles > 0 && Y.value.length >= K.maxFiles);
-		function ie(e) {
-			let t = [...K.modelValue || []];
-			t.splice(e, 1), q("update:modelValue", t);
+		}), J = f(null), Y = f({}), X = f({}), de = r(() => U.disabled || U.maxFiles > 0 && q.value.length >= U.maxFiles), Z = r(() => !U.restrictRemoval || U.minFiles <= 0 || q.value.length > U.minFiles), fe = r(() => !U.restrictRemoval || U.minFiles <= 0), pe = r(() => {
+			let e = q.value.length, t = U.minFiles <= 0 || e >= U.minFiles, n = U.maxFiles <= 0 || e <= U.maxFiles;
+			return t && n;
+		});
+		_(() => q.value.length, () => {
+			W("update:valid", pe.value);
+		});
+		let me = r(() => {
+			let e = q.value.length;
+			return U.minFiles > 0 && U.maxFiles > 0 ? G("fileInput.minMaxFiles", {
+				count: e,
+				min: U.minFiles,
+				max: U.maxFiles
+			}) : U.minFiles > 0 ? G("fileInput.minFiles", {
+				count: e,
+				min: U.minFiles
+			}) : G("fileInput.maxFiles", {
+				count: e,
+				max: U.maxFiles
+			});
+		});
+		function he(e) {
+			if (!Z.value) return;
+			let t = [...U.modelValue || []];
+			t.splice(e, 1), W("update:modelValue", t);
 		}
-		async function ae(e) {
-			Z.value[e] = !Z.value[e], Z.value[e] || $(), await l(), (X.value?.querySelector(`#caption-${e}`))?.focus();
+		async function ge(e) {
+			Y.value[e] = !Y.value[e], Y.value[e] || $(), await l(), (J.value?.querySelector(`#caption-${e}`))?.focus();
 		}
-		function oe(e) {
+		function _e(e) {
 			if (e == null) return "";
 			let t = [
 				"B",
@@ -106,32 +147,32 @@ var ee = { class: "container" }, te = { class: "row" }, x = {
 			for (; n >= 1024 && t.length;) n /= 1024, r = t.shift();
 			return `${n.toFixed(1)} ${r}`;
 		}
-		function se(e) {
+		function Q(e) {
 			return e ? new Date(e).toLocaleDateString() : "";
 		}
 		function $(e) {
-			q("update:modelValue", (e || Y.value).map((e, t) => ({
+			W("update:modelValue", (e || q.value).map((e, t) => ({
 				...e,
-				caption: Q.value[t] || ""
+				caption: X.value[t] || ""
 			})));
 		}
 		return (r, l) => {
-			let f = m("svg-icon"), G = m("base-image");
+			let f = m("svg-icon"), _ = m("base-image");
 			return d(), a("div", {
 				class: "bulk-upload",
 				ref_key: "root",
-				ref: X
-			}, [o("div", ee, [o("div", te, [c.hasHeader ? (d(), a("div", x, [o("div", S, [o("p", {
+				ref: J
+			}, [o("div", re, [o("div", ie, [c.hasHeader ? (d(), a("div", ae, [o("div", oe, [o("p", {
 				class: "fw-bold m-0",
 				innerHTML: g(e)(c.title || r.$t("fileInput.bulkUploadHeadline"))
-			}, null, 8, C), p(r.$slots, "bulk-remove", {}, () => [c.hasBulkRemove ? (d(), a("button", {
+			}, null, 8, se), p(r.$slots, "bulk-remove", {}, () => [c.hasBulkRemove && fe.value ? (d(), a("button", {
 				key: 0,
-				onClick: l[0] ||= b((e) => Y.value = [], ["prevent"]),
+				onClick: l[0] ||= y((e) => q.value = [], ["prevent"]),
 				class: "btn btn--close ms-auto p-0"
-			}, [s(f, { symbol: "x" })])) : i("", !0)])])])) : i("", !0), o("div", w, [Y.value.length ? i("", !0) : (d(), a("div", T, [o("p", E, h(r.$t("fileInput.noFilesSelected")), 1)])), s(t, {
+			}, [s(f, { symbol: "x" })])) : i("", !0)])])])) : i("", !0), o("div", ce, [q.value.length ? i("", !0) : (d(), a("div", le, [o("p", b, h(r.$t("fileInput.noFilesSelected")), 1)])), s(t, {
 				id: `${c.id}-file-upload`,
-				modelValue: Y.value,
-				"onUpdate:modelValue": l[2] ||= (e) => Y.value = e,
+				modelValue: q.value,
+				"onUpdate:modelValue": l[2] ||= (e) => q.value = e,
 				multiple: !0,
 				accept: "image/*",
 				"drop-files": !0,
@@ -139,50 +180,51 @@ var ee = { class: "container" }, te = { class: "row" }, x = {
 				"local-url-format": "objectUrl",
 				class: "d-flex flex-column border"
 			}, {
-				"preview-item": v(({ bind: { item: e, index: t } }) => [o("div", D, [o("div", O, [
-					o("div", k, [s(G, {
+				"preview-item": v(({ bind: { item: e, index: t } }) => [o("div", x, [o("div", S, [
+					o("div", C, [s(_, {
 						src: e.src,
 						alt: "",
 						class: "img-thumbnail"
 					}, null, 8, ["src"])]),
-					o("div", A, [o("div", j, [o("div", M, h(e.name || r.$t("fileInput.unknownFile")), 1), o("div", null, [e.size ? (d(), a("span", N, h(oe(e.size)), 1)) : i("", !0), e.lastModified ? (d(), a("span", P, " · " + h(se(e.lastModified)), 1)) : i("", !0)])]), c.hasCaptions ? (d(), a(n, { key: 0 }, [Z.value[t] && c.editCaptions ? y((d(), a("textarea", {
+					o("div", w, [o("div", T, [o("div", E, h(e.name || r.$t("fileInput.unknownFile")), 1), o("div", null, [e.size ? (d(), a("span", D, h(_e(e.size)), 1)) : i("", !0), e.lastModified ? (d(), a("span", O, " · " + h(Q(e.lastModified)), 1)) : i("", !0)])]), c.hasCaptions ? (d(), a(n, { key: 0 }, [Y.value[t] && c.editCaptions ? te((d(), a("textarea", {
 						key: 0,
-						"onUpdate:modelValue": (e) => Q.value[t] = e,
+						"onUpdate:modelValue": (e) => X.value[t] = e,
 						id: `caption-${t}`,
 						class: "form-control rounded-0 h-100",
 						onChangeCapture: l[1] ||= (e) => $()
-					}, null, 40, F)), [[_, Q.value[t]]]) : (d(), a("p", {
+					}, null, 40, k)), [[ee, X.value[t]]]) : (d(), a("p", {
 						key: 1,
 						class: "m-0",
-						innerHTML: Q.value[t] || `<small>${r.$t("fileInput.noCaption")}</small>`
-					}, null, 8, I)), c.showProgress && e.uploadProgress ? (d(), a("div", L, [p(r.$slots, "upload-progress", { bind: {
+						innerHTML: X.value[t] || `<small>${r.$t("fileInput.noCaption")}</small>`
+					}, null, 8, A)), c.showProgress && e.uploadProgress ? (d(), a("div", j, [p(r.$slots, "upload-progress", { bind: {
 						item: e,
 						index: t
 					} }, () => [o("progress", {
 						value: e.uploadProgress,
 						max: "100",
 						class: "w-100"
-					}, null, 8, R)])])) : i("", !0)], 64)) : i("", !0)]),
-					o("div", z, [o("button", {
-						onClick: b((e) => ie(t), ["prevent"]),
-						class: "btn btn--close"
-					}, [s(f, { symbol: "x" })], 8, B), c.editCaptions ? (d(), a("button", {
+					}, null, 8, M)])])) : i("", !0)], 64)) : i("", !0)]),
+					o("div", N, [Z.value ? (d(), a("button", {
 						key: 0,
-						onClick: b((e) => ae(t), ["prevent"]),
+						onClick: y((e) => he(t), ["prevent"]),
+						class: "btn btn--close"
+					}, [s(f, { symbol: "x" })], 8, P)) : i("", !0), c.editCaptions ? (d(), a("button", {
+						key: 1,
+						onClick: y((e) => ge(t), ["prevent"]),
 						class: "btn btn--close"
-					}, [s(f, { symbol: Z.value[t] ? "check" : "edit-3" }, null, 8, ["symbol"])], 8, ne)) : i("", !0)])
+					}, [s(f, { symbol: Y.value[t] ? "check" : "edit-3" }, null, 8, ["symbol"])], 8, F)) : i("", !0)])
 				])])]),
-				label: v(() => [p(r.$slots, "button", {}, () => [o("span", V, [o("span", H, [o("label", {
+				label: v(() => [p(r.$slots, "button", {}, () => [o("span", I, [o("span", L, [p(r.$slots, "info", {}, () => [c.maxFiles > 0 || c.minFiles > 0 ? (d(), a("span", R, h(me.value), 1)) : i("", !0)])]), o("span", z, [o("span", ue, [o("label", {
 					for: `${c.id}-file-upload`,
-					class: u(["btn btn-primary btn-sm ms-auto d-flex align-items-center gap-2", { disabled: re.value }])
+					class: u(["btn btn-primary btn-sm ms-auto d-flex align-items-center gap-2", { disabled: de.value }])
 				}, [s(f, {
 					symbol: "upload",
 					size: "small"
-				}), o("span", { innerHTML: r.$t("common.selectFile") }, null, 8, W)], 10, U)])])])]),
+				}), o("span", { innerHTML: r.$t("common.selectFile") }, null, 8, V)], 10, B)])])])])]),
 				_: 3
 			}, 8, ["id", "modelValue"])])])])], 512);
 		};
 	}
 });
 //#endregion
-export { G as default };
+export { H as default };

package/dist/components/molecules/image-upload/image-upload.vue_vue_type_script_setup_true_lang.js

@@ -157,7 +157,7 @@ var ne = { class: "image-upload__controls" }, re = { class: "d-flex gap-1 align-
 				U.value = null;
 			}
 		}), O(() => B.value, (e, t) => {
-			!e && t && H.value && (W && J(H.value.src), W = !1, H.value = null, $());
+			!e && t && H.value && (W && (J(H.value.src), $()), W = !1, H.value = null);
 		}), O(() => F.src, (e) => {
 			!e && V.value && $();
 		});

package/dist/i18n.d.ts

@@ -99,6 +99,10 @@ declare const i18n: import('vue-i18n').I18n<{
             noFilesSelected: string;
             noCaption: string;
             bulkUploadHeadline: string;
+            maxFiles: string;
+            minFiles: string;
+            minMaxFiles: string;
+            unlimitedFiles: string;
         };
         editor: {
             header: {

package/dist/locales/en.d.ts

@@ -98,6 +98,10 @@ export declare const messages: {
         noFilesSelected: string;
         noCaption: string;
         bulkUploadHeadline: string;
+        maxFiles: string;
+        minFiles: string;
+        minMaxFiles: string;
+        unlimitedFiles: string;
     };
     editor: {
         header: {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ablok-components",
   "private": false,
-  "version": "0.3.117",
+  "version": "0.3.119",
   "type": "module",
   "dependencies": {
     "@tiptap/core": "^3.30.0",