ablok-components 0.3.104 → 0.3.106

package/dist/components/molecules/input-color/input-color.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,118 @@
+import { uniqueId as e } from "../../../utilities/helpers.js";
+import t from "../../atoms/base-input/base-input.js";
+import { computed as n, createElementBlock as r, createElementVNode as i, createVNode as a, defineComponent as o, openBlock as s, vModelText as c, withCtx as l, withDirectives as u } from "vue";
+//#region src/components/molecules/input-color/input-color.vue?vue&type=script&setup=true&lang.ts
+var d = { class: "input-color" }, f = { class: "base-input__color-swatch" }, p = [
+	"name",
+	"id",
+	"disabled",
+	"read-only",
+	"required",
+	"aria-label"
+], m = /*@__PURE__*/ o({
+	__name: "input-color",
+	props: {
+		modelValue: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Date
+			],
+			default: ""
+		},
+		type: {
+			type: String,
+			default: "text"
+		},
+		name: {
+			type: String,
+			default: () => e()
+		},
+		id: {
+			type: String,
+			default: () => e()
+		},
+		label: {
+			type: String,
+			default: ""
+		},
+		placeholder: {
+			type: String,
+			default: ""
+		},
+		variant: {
+			type: String,
+			default: ""
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		readOnly: {
+			type: Boolean,
+			default: !1
+		},
+		required: {
+			type: Boolean,
+			default: !1
+		},
+		maxlength: { type: Number },
+		pattern: {
+			type: String,
+			default: null
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: o }) {
+		let m = e, h = o, g = n({
+			get() {
+				return m.modelValue;
+			},
+			set(e) {
+				h("update:modelValue", e);
+			}
+		});
+		return (n, o) => (s(), r("div", d, [a(t, {
+			modelValue: g.value,
+			"onUpdate:modelValue": o[1] ||= (e) => g.value = e,
+			type: e.type === "color" ? "text" : e.type,
+			id: e.id,
+			name: e.name,
+			placeholder: e.placeholder,
+			pattern: e.pattern,
+			label: e.label,
+			disabled: e.disabled,
+			"read-only": e.readOnly,
+			required: e.required,
+			maxlength: e.maxlength
+		}, {
+			"input-append": l((t) => [i("span", f, [u(i("input", {
+				"onUpdate:modelValue": o[0] ||= (e) => g.value = e,
+				type: "color",
+				name: `${e.name}-color`,
+				id: `${e.id}-color`,
+				disabled: e.disabled,
+				"read-only": e.readOnly,
+				required: e.required,
+				class: "form-control",
+				"aria-label": e.label
+			}, null, 8, p), [[c, g.value]])])]),
+			_: 1
+		}, 8, [
+			"modelValue",
+			"type",
+			"id",
+			"name",
+			"placeholder",
+			"pattern",
+			"label",
+			"disabled",
+			"read-only",
+			"required",
+			"maxlength"
+		])]));
+	}
+});
+//#endregion
+export { m as default };

package/dist/components/molecules/input-datepicker/input-datepicker.js

@@ -0,0 +1,6 @@
+import e from "./input-datepicker.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                 */
+//#region src/components/molecules/input-datepicker/input-datepicker.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/components/molecules/input-datepicker/input-datepicker.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,337 @@
+import { sanitizeHtml as e } from "../../../composables/useSanitize.js";
+import { uniqueId as t } from "../../../utilities/helpers.js";
+/* empty css                                                                                                                                   */
+import { de as n } from "../../../node_modules/.pnpm/date-fns@4.4.0/node_modules/date-fns/locale/de.js";
+import r from "../../../node_modules/.pnpm/date-fns@4.4.0/node_modules/date-fns/locale/en-US.js";
+import i from "../../../node_modules/.pnpm/date-fns@4.4.0/node_modules/date-fns/locale/fr.js";
+import { computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, defineComponent as u, normalizeClass as d, onMounted as f, openBlock as p, ref as m, renderSlot as h, resolveDynamicComponent as g, shallowRef as _, unref as v, watch as y } from "vue";
+import { useI18n as b } from "vue-i18n";
+import { WeekStart as x } from "@vuepic/vue-datepicker";
+//#region src/components/molecules/input-datepicker/input-datepicker.vue?vue&type=script&setup=true&lang.ts
+var S = { class: "row" }, C = { class: "col-12" }, w = ["for", "innerHTML"], T = { key: 0 }, E = { class: "input-group justify-content-center" }, D = {
+	key: 0,
+	class: "row"
+}, O = { class: "col-12 col-md-6" }, k = { class: "col-12 col-md-6" }, A = {
+	key: 1,
+	class: "row"
+}, j = { class: "col-12" }, M = /*@__PURE__*/ u({
+	__name: "input-datepicker",
+	props: {
+		modelValue: {
+			type: null,
+			default: ""
+		},
+		from: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Date
+			],
+			default: ""
+		},
+		to: {
+			type: [
+				String,
+				Number,
+				Boolean,
+				Date
+			],
+			default: ""
+		},
+		type: {
+			type: String,
+			default: "datetime-local"
+		},
+		name: {
+			type: String,
+			default: () => t()
+		},
+		id: {
+			type: String,
+			default: () => t()
+		},
+		label: {
+			type: String,
+			default: ""
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		readOnly: {
+			type: Boolean,
+			default: !1
+		},
+		required: {
+			type: Boolean,
+			default: !1
+		},
+		range: {
+			type: Boolean,
+			default: !1
+		},
+		textRange: {
+			type: Boolean,
+			default: !1
+		},
+		inline: {
+			type: Boolean,
+			default: !1
+		},
+		textInput: {
+			type: Boolean,
+			default: !0
+		},
+		picker: {
+			type: Boolean,
+			default: !0
+		},
+		locale: {
+			type: String,
+			default: "en"
+		},
+		utcStore: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"update:from",
+		"update:to"
+	],
+	setup(t, { emit: u }) {
+		let M = _(null);
+		f(async () => {
+			let { VueDatePicker: e } = await import("@vuepic/vue-datepicker");
+			M.value = e, console.log("VueDatePicker loaded:", F.value, N.locale);
+		});
+		let N = t, P = u, { t: ee, locale: F } = b(), I = {
+			en: r,
+			de: n,
+			fr: i
+		}, L = a(() => {
+			let e = N.locale || F.value;
+			return I[e] || r;
+		}), R = a(() => {
+			switch (N.locale || F.value) {
+				case "en": return x.Sunday;
+				case "de":
+				case "fr": return x.Monday;
+				default: return x.Sunday;
+			}
+		}), z = a(() => N.inline || !N.picker ? {
+			openMenu: !1,
+			format: L.value
+		} : !0);
+		function B(e) {
+			return !e || Number.isNaN(e.getTime()) ? null : e.toISOString().replace("Z", "");
+		}
+		function V(e) {
+			return !e || Array.isArray(e) ? null : B(/* @__PURE__ */ new Date(`${e}Z`));
+		}
+		function H(e) {
+			if (!e || Array.isArray(e)) return null;
+			let t = new Date(e);
+			return Number.isNaN(t.getTime()) ? null : (t.setUTCHours(t.getHours()), B(t));
+		}
+		function U() {
+			let e = N.from || (Array.isArray(N.modelValue) ? N.modelValue[0] : null), t = N.to || (Array.isArray(N.modelValue) ? N.modelValue[1] : null);
+			return N.utcStore ? (e = e ? Z(e) : null, t = t ? Z(t) : null) : (e = V(e), t = V(t)), [e, t];
+		}
+		let W = m(U());
+		y(() => [
+			N.modelValue,
+			N.from,
+			N.to,
+			N.utcStore
+		], () => {
+			if (!N.range) return;
+			let e = U();
+			(e[0] !== W.value[0] || e[1] !== W.value[1]) && (W.value = e);
+		});
+		function G(e, t) {
+			N.utcStore ? (e = e ? Q(e) : null, t = t ? Q(t) : null) : (e = H(e), t = H(t)), P("update:modelValue", [e, t]), P("update:from", e), P("update:to", t);
+		}
+		function K(e, t) {
+			W.value = [e ?? null, t ?? null], G(e ?? null, t ?? null);
+		}
+		let q = a({
+			get() {
+				if (N.range) {
+					let e = N.from || (Array.isArray(N.modelValue) ? N.modelValue[0] : null), t = N.to || (Array.isArray(N.modelValue) ? N.modelValue[1] : null);
+					return N.utcStore ? (e = e ? Z(e) : null, t = t ? Z(t) : null) : (e = V(e), t = V(t)), [...e ? [e] : [], ...t ? [t] : []];
+				}
+				if (N.utcStore) {
+					let e = N.modelValue;
+					return e && Z(e) || "";
+				}
+				return V(N.modelValue) || "";
+			},
+			set(e) {
+				if (N.range && Array.isArray(e)) {
+					let [t, n] = e;
+					N.utcStore ? (t = Q(t) || null, n = Q(n) || null) : (t = H(t), n = H(n)), P("update:modelValue", [t, n]), P("update:from", t), P("update:to", n);
+				} else if (N.utcStore) {
+					let t = Q(e);
+					P("update:modelValue", t);
+				} else P("update:modelValue", H(e));
+			}
+		}), J = a({
+			get() {
+				return W.value[0];
+			},
+			set(e) {
+				K(e, W.value[1]);
+			}
+		}), Y = a({
+			get() {
+				return W.value[1];
+			},
+			set(e) {
+				K(W.value[0], e);
+			}
+		});
+		function X(e) {
+			if (!e) return;
+			let t = e.getDate(), n = e.getMonth() + 1, r = e.getFullYear(), i = e.getMinutes(), a = e.getHours();
+			switch (L.value) {
+				case "de": return `${t}.${n}.${r} ${a < 10 ? "0" + a : a}:${i < 10 ? "0" + i : i}`;
+				case "fr": return `${t}/${n}/${r} ${a < 10 ? "0" + a : a}:${i < 10 ? "0" + i : i}`;
+				default: return `${n}/${t}/${r} ${a < 10 ? "0" + a : a}:${i < 10 ? "0" + i : i}`;
+			}
+		}
+		function Z(e) {
+			if (!e || Array.isArray(e)) return null;
+			let t = e instanceof Date ? new Date(e) : /* @__PURE__ */ new Date(`${e}Z`);
+			return Number.isNaN(t.getTime()) ? null : `${t.getFullYear()}-${String(t.getMonth() + 1).padStart(2, "0")}-${String(t.getDate()).padStart(2, "0")}T${String(t.getHours()).padStart(2, "0")}:${String(t.getMinutes()).padStart(2, "0")}:${String(t.getSeconds()).padStart(2, "0")}`;
+		}
+		function Q(e) {
+			if (!e || Array.isArray(e)) return null;
+			let t = e instanceof Date ? new Date(e) : new Date(String(e));
+			return Number.isNaN(t.getTime()) ? null : t.toISOString().split(".")[0];
+		}
+		let $ = (e) => (e = Array.isArray(e) ? e.map((e) => X(e)).join(" - ") : X(e), e);
+		return (n, r) => (p(), c("div", { class: d(["input", "input--datepicker"]) }, [
+			h(n.$slots, "label", {}, () => [l("div", S, [l("div", C, [t.label ? (p(), c("label", {
+				key: 0,
+				for: t.id,
+				class: "input__label",
+				innerHTML: v(e)(`${t.label}${t.required ? " *" : ""}`)
+			}, null, 8, w)) : s("", !0)])])]),
+			t.textInput ? (p(), c("div", T, [l("div", E, [
+				h(n.$slots, "input-prepend", { slotScope: "props" }),
+				t.range && !t.textRange ? (p(), c("div", D, [l("div", O, [(p(), o(g(M.value), {
+					uid: `${t.id}-from`,
+					modelValue: J.value,
+					"onUpdate:modelValue": r[0] ||= (e) => J.value = e,
+					locale: L.value,
+					format: $,
+					"text-input": z.value,
+					disabled: t.disabled,
+					"read-only": t.readOnly,
+					required: t.required,
+					"max-date": Y.value,
+					"auto-apply": !0,
+					"week-start": R.value
+				}, null, 8, [
+					"uid",
+					"modelValue",
+					"locale",
+					"text-input",
+					"disabled",
+					"read-only",
+					"required",
+					"max-date",
+					"week-start"
+				]))]), l("div", k, [(p(), o(g(M.value), {
+					uid: `${t.id}-to`,
+					modelValue: Y.value,
+					"onUpdate:modelValue": r[1] ||= (e) => Y.value = e,
+					locale: L.value,
+					format: $,
+					"text-input": z.value,
+					disabled: t.disabled,
+					"read-only": t.readOnly,
+					required: t.required,
+					"min-date": J.value,
+					"auto-apply": !0,
+					"week-start": R.value
+				}, null, 8, [
+					"uid",
+					"modelValue",
+					"locale",
+					"text-input",
+					"disabled",
+					"read-only",
+					"required",
+					"min-date",
+					"week-start"
+				]))])])) : (p(), o(g(M.value), {
+					key: 1,
+					uid: `${t.id}-input-to`,
+					modelValue: q.value,
+					"onUpdate:modelValue": r[2] ||= (e) => q.value = e,
+					format: $,
+					locale: L.value,
+					range: t.textRange,
+					"text-input": z.value,
+					disabled: t.disabled,
+					"read-only": t.readOnly,
+					required: t.required,
+					"auto-apply": !0,
+					"week-start": R.value
+				}, null, 8, [
+					"uid",
+					"modelValue",
+					"locale",
+					"range",
+					"text-input",
+					"disabled",
+					"read-only",
+					"required",
+					"week-start"
+				])),
+				h(n.$slots, "input-append", { slotScope: "props" })
+			])])) : s("", !0),
+			t.inline ? (p(), c("div", A, [l("div", j, [(p(), o(g(M.value), {
+				uid: `${t.id}-inline`,
+				modelValue: q.value,
+				"onUpdate:modelValue": r[3] ||= (e) => q.value = e,
+				locale: L.value,
+				cancelText: "abbrechen",
+				selectText: "auswählen",
+				range: t.range,
+				"multi-calendars": t.range,
+				inline: { input: !1 },
+				"auto-apply": !0,
+				"partial-range": t.range,
+				"partial-flow": !0,
+				"start-time": {
+					hours: 0,
+					minutes: 0
+				},
+				class: "justify-content-center",
+				disabled: t.disabled,
+				"read-only": t.readOnly,
+				required: t.required,
+				"month-name-format": "long",
+				"week-start": R.value
+			}, null, 8, [
+				"uid",
+				"modelValue",
+				"locale",
+				"range",
+				"multi-calendars",
+				"partial-range",
+				"disabled",
+				"read-only",
+				"required",
+				"week-start"
+			]))])])) : s("", !0)
+		]));
+	}
+});
+//#endregion
+export { M as default };

package/dist/components/molecules/input-dropdown/input-dropdown.js

@@ -0,0 +1,6 @@
+import e from "./input-dropdown.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                               */
+//#region src/components/molecules/input-dropdown/input-dropdown.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/components/molecules/input-dropdown/input-dropdown.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,169 @@
+import { uniqueId as e } from "../../../utilities/helpers.js";
+import t from "../../atoms/base-button/base-button.js";
+import { Fragment as n, Transition as r, computed as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createVNode as c, defineComponent as l, normalizeClass as u, openBlock as d, renderList as f, renderSlot as p, toDisplayString as m, vModelCheckbox as h, vModelRadio as g, withCtx as _, withDirectives as v } from "vue";
+import { useI18n as y } from "vue-i18n";
+//#region src/components/molecules/input-dropdown/input-dropdown.vue?vue&type=script&setup=true&lang.ts
+var b = ["id"], x = ["for", "innerHTML"], S = { class: "dropdown" }, C = { class: "caption" }, w = ["innerHTML"], T = { class: "caption__text" }, E = { class: "d-block text-truncate" }, D = { class: "dropdown-menu" }, O = { class: "form-check d-flex" }, k = [
+	"value",
+	"id",
+	"name",
+	"label",
+	"required",
+	"disabled"
+], A = [
+	"value",
+	"id",
+	"name",
+	"label",
+	"required",
+	"disabled"
+], j = ["for"], M = /*@__PURE__*/ l({
+	__name: "input-dropdown",
+	props: {
+		id: { type: String },
+		name: {
+			type: String,
+			default: () => `dropdown-${e()}`
+		},
+		label: { type: String },
+		error: { type: String },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		readOnly: {
+			type: Boolean,
+			default: !1
+		},
+		required: {
+			type: Boolean,
+			default: !1
+		},
+		modelValue: { type: null },
+		options: {
+			type: Array,
+			required: !0
+		},
+		multiple: {
+			type: Boolean,
+			default: !1
+		},
+		showSelectionCount: {
+			type: Boolean,
+			default: !1
+		},
+		toggleCaption: { type: String },
+		placeholder: {
+			type: String,
+			default: ""
+		},
+		icon: {
+			default: "chevron-down",
+			type: String
+		},
+		variant: {
+			type: String,
+			default: ""
+		},
+		color: {
+			type: String,
+			default: ""
+		},
+		outlined: {
+			type: Boolean,
+			default: !1
+		},
+		exactMatch: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: l }) {
+		let { t: M } = y(), N = e, P = l, F = i({
+			get() {
+				return N.multiple && !N.modelValue ? [] : N.modelValue;
+			},
+			set(e) {
+				P("update:modelValue", e);
+			}
+		}), I = i(() => N.options && N.options.map((e) => (e = typeof e == "string" ? {
+			text: e,
+			value: e
+		} : e, {
+			...e,
+			active: N.modelValue && e.value && (N.exactMatch ? N.modelValue === e.value : N.multiple ? N.modelValue.includes(e.value) : N.modelValue === e.value)
+		}))), L = i(() => {
+			if (!N.modelValue) return N.placeholder || `${M("common.select")}`;
+			if (N.multiple && Array.isArray(N.modelValue) && N.modelValue.length) return I.value.reduce((e, t) => N.modelValue.includes(t.value) ? `${e}${e ? ", " : ""}${t.text}` : e, "");
+			if (!N.multiple) {
+				let e = I.value.find((e) => typeof e.value == "object" && e.value !== null ? JSON.stringify(e.value) === JSON.stringify(N.modelValue) : e.value === N.modelValue);
+				return e ? e.text : N.placeholder || `${M("common.select")}`;
+			}
+			return N.placeholder || `${M("common.select")}`;
+		});
+		return (i, l) => (d(), o("div", {
+			class: "input input-dropdown",
+			id: `${e.id || e.name}`
+		}, [p(i.$slots, "label", {}, () => [e.label ? (d(), o("label", {
+			key: 0,
+			for: `${e.id || e.name}--dropdown-toggle`,
+			class: "input__label",
+			innerHTML: `${e.label}${e.required ? " *" : ""}`
+		}, null, 8, x)) : a("", !0)]), s("div", S, [c(t, {
+			id: `${e.id || e.name}--dropdown-toggle`,
+			"data-bs-toggle": "dropdown",
+			role: "button",
+			type: "button",
+			title: L.value,
+			class: "btn dropdown-toggle",
+			color: e.color,
+			outlined: e.outlined,
+			disabled: e.disabled
+		}, {
+			default: _(() => [s("span", C, [c(r, { name: "bounce" }, {
+				default: _(() => [e.showSelectionCount && e.modelValue.length ? (d(), o("i", {
+					key: 0,
+					class: "caption__count",
+					innerHTML: e.modelValue.length
+				}, null, 8, w)) : a("", !0)]),
+				_: 1
+			}), s("span", T, [s("span", E, m(e.toggleCaption || L.value), 1)])])]),
+			_: 1
+		}, 8, [
+			"id",
+			"title",
+			"color",
+			"outlined",
+			"disabled"
+		]), s("ul", D, [(d(!0), o(n, null, f(I.value, (t, n) => (d(), o("li", { key: `${t.value}-${n}` }, [s("div", { class: u(["dropdown-item", t.active && "active"]) }, [s("div", O, [e.multiple ? v((d(), o("input", {
+			type: "checkbox",
+			"onUpdate:modelValue": l[0] ||= (e) => F.value = e,
+			value: t.value,
+			key: `${e.name}-${t.value}-${n}__if`,
+			id: `${e.name}-${t.value}-${n}`,
+			name: e.name,
+			label: t.text,
+			required: e.required,
+			disabled: t.selectable === !1,
+			class: "form-check-input"
+		}, null, 8, k)), [[h, F.value]]) : v((d(), o("input", {
+			type: "radio",
+			"onUpdate:modelValue": l[1] ||= (e) => F.value = e,
+			value: t.value,
+			key: `${e.name}-${t.value}-${n}__else`,
+			id: `${e.name}-${t.value}-${n}`,
+			name: e.name,
+			label: t.text,
+			required: e.required,
+			disabled: t.selectable === !1,
+			class: "form-check-input visually-hidden"
+		}, null, 8, A)), [[g, F.value]]), s("label", {
+			class: "form-check-label flex-grow-1",
+			onclick: "event.stopPropagation",
+			for: `${e.name}-${t.value}-${n}`
+		}, m(t.text), 9, j)])], 2)]))), 128))])])], 8, b));
+	}
+});
+//#endregion
+export { M as default };

package/dist/components/molecules/link-sharing/link-sharing.js

@@ -0,0 +1,6 @@
+import e, { stripHtml as t } from "./link-sharing.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                             */
+//#region src/components/molecules/link-sharing/link-sharing.vue
+var n = e;
+//#endregion
+export { n as default, t as stripHtml };