admins-components 9.0.75 → 9.0.77

package/dist/admins-components22.js

@@ -1,6 +1,6 @@
-import "./admins-components7.js";
-import e from "./admins-components21.js";
+import { dateRangePickerConfigDefaults as e } from "./admins-components7.js";
+import t from "./admins-components21.js";
 //#region src/components/DateRangePicker.vue
-var t = e;
+var n = t;
 //#endregion
-export { t as default };
+export { e as dateRangePickerConfigDefaults, n as default };

package/dist/admins-components23.js

@@ -1,6 +1,6 @@
 import { createElementBlock as e, defineComponent as t, normalizeStyle as n, openBlock as r } from "vue";
 //#region src/components/Loader.vue?vue&type=script&setup=true&lang.ts
-var i = /* @__PURE__ */ t({
+var i = /*@__PURE__*/ t({
 	__name: "Loader",
 	props: {
 		loading: {

package/dist/admins-components23.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components23.js","names":[],"sources":["../src/components/Loader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nwithDefaults(\n  defineProps<{\n    loading?: boolean\n    size?: string\n    color?: string\n  }>(),\n  {\n    loading: true,\n    size: '2rem',\n    color: 'var(--site-500)',\n  },\n)\n</script>\n<template>\n  <div\n    class=\"loader\"\n    :style=\"{\n      width: size,\n      '--loader-thickness': `calc(${size} / 6)`,\n      '--loader-color': color,\n    }\"\n  ></div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/loader.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;yBAeE,EAOO,OAAA;GANL,OAAM;GACL,OAAK,EAAA;WAAiB,EAAA;kCAA0C,EAAA,KAAI;sBAAiC,EAAA"}
+{"version":3,"file":"admins-components23.js","names":[],"sources":["../src/components/Loader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nwithDefaults(\n  defineProps<{\n    loading?: boolean\n    size?: string\n    color?: string\n  }>(),\n  {\n    loading: true,\n    size: '2rem',\n    color: 'var(--site-500)',\n  },\n)\n</script>\n<template>\n  <div\n    class=\"loader\"\n    :style=\"{\n      width: size,\n      '--loader-thickness': `calc(${size} / 6)`,\n      '--loader-color': color,\n    }\"\n  ></div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/loader.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;oBAeE,EAAA,GAAA,EAOO,OAAA;GANL,OAAM;GACL,OAAK,EAAA;IAAiB,OAAA,EAAA;IAA0C,sBAAA,QAAA,EAAA,KAAI;IAAiC,kBAAA,EAAA"}

package/dist/admins-components25.js

@@ -1,4 +1,4 @@
-import './src/styles/components/loader.scss_vue_type_style_index_0_src_true_lang.css';
+import './styles/components/loader.scss_vue_type_style_index_0_src_true_lang.css';
 import e from "./admins-components23.js";
 /* empty css                    */
 //#region src/components/Loader.vue

package/dist/admins-components26.js

@@ -1,26 +1,27 @@
 import e from "./admins-components6.js";
-import t from "./admins-components25.js";
-import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createVNode as ee, defineComponent as c, nextTick as l, normalizeClass as u, onBeforeUnmount as te, onMounted as d, openBlock as f, ref as p, renderList as m, toDisplayString as h, watch as g, withModifiers as _ } from "vue";
+import { useDropdownAnchor as t } from "./admins-components12.js";
+import n from "./admins-components25.js";
+import { Fragment as r, Teleport as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, nextTick as f, normalizeClass as p, normalizeStyle as ee, openBlock as m, ref as h, renderList as g, toDisplayString as _, unref as v, watch as y, withModifiers as b } from "vue";
 //#region src/components/DropdownSelect.vue?vue&type=script&setup=true&lang.ts
-var v = { class: "ac-component" }, ne = ["aria-disabled"], re = {
+var x = { class: "ac-component" }, S = ["aria-disabled"], C = {
 	key: 0,
 	class: "c-truncate ds-value"
-}, ie = {
+}, te = {
 	key: 1,
 	class: "c-placeholder"
-}, y = {
+}, ne = { class: "ac-component" }, re = {
 	key: 0,
 	class: "ds-filter"
-}, b = ["title"], x = ["value", "placeholder"], S = { class: "ds-options c-scroll" }, C = {
+}, w = ["title"], T = ["value", "placeholder"], E = { class: "ds-options c-scroll" }, ie = {
 	key: 0,
 	class: "ds-option ds-option--loading"
-}, w = ["onClick", "onKeydown"], T = ["innerHTML"], E = {
+}, ae = ["onClick", "onKeydown"], oe = ["innerHTML"], D = {
 	key: 0,
 	class: "ds-option ds-option--empty"
-}, D = {
+}, O = {
 	key: 1,
 	class: "c-footer"
-}, O = {
+}, k = {
 	placeholder: "Válassz...",
 	filterable: !0,
 	filterPlaceholder: "Kezdj el gépelni...",
@@ -32,45 +33,48 @@ var v = { class: "ac-component" }, ne = ["aria-disabled"], re = {
 	size: "normal",
 	highlight: !0,
 	disabled: !1
-}, k = /* @__PURE__ */ c({
+}, A = /*@__PURE__*/ d({
 	__name: "DropdownSelect",
 	props: {
 		modelValue: { default: null },
 		options: {},
-		config: { default: () => ({ ...O }) }
+		config: { default: () => ({ ...k }) }
 	},
 	emits: ["update:modelValue", "filter-input"],
-	setup(c, { expose: k, emit: A }) {
-		let j = c, M = r(() => ({
-			...O,
-			...j.config
-		})), N = A, P = p(!1), F = p(""), I = p(null), L = p(null), R = p([]), z = p(B(j.modelValue, j.options));
-		function B(e, t) {
+	setup(d, { expose: A, emit: j }) {
+		let M = d, N = a(() => ({
+			...k,
+			...M.config
+		})), P = j, F = h(""), I = h(null), L = h(null), R = h(null), z = h([]), B = h(U(M.modelValue, M.options)), { isOpen: V, dropdownStyle: H } = t(I, L, { extraStyle: (e) => ({
+			minWidth: `${e.width}px`,
+			maxWidth: `${e.width * 1.5}px`
+		}) });
+		function U(e, t) {
 			return e == null ? [] : (Array.isArray(e) ? e : [e]).map((e) => e == null ? null : typeof e == "object" && "label" in e ? e : typeof e == "string" ? t.find((t) => t.value === e) ?? {
 				value: e,
 				label: e
 			} : null).filter((e) => e !== null);
 		}
-		g(() => [j.modelValue, j.options], ([e]) => {
-			z.value = B(e, j.options);
-		}), g(P, (e) => {
-			e && (F.value = "", M.value.filterable && l(() => L.value?.focus()), M.value.lazy && (R.value = [...z.value]));
+		y(() => [M.modelValue, M.options], ([e]) => {
+			B.value = U(e, M.options);
+		}), y(V, (e) => {
+			e && (F.value = "", N.value.filterable && f(() => R.value?.focus()), N.value.lazy && (z.value = [...B.value]));
 		});
-		function V(e) {
-			F.value = e, N("filter-input", e);
+		function W(e) {
+			F.value = e, P("filter-input", e);
 		}
-		let H = r(() => {
-			if (z.value.length === 0) return null;
-			if (!M.value.multiple) {
-				let e = z.value[0];
-				return j.options.find((t) => t.value === e?.value)?.label ?? e?.label ?? null;
+		let G = a(() => {
+			if (B.value.length === 0) return null;
+			if (!N.value.multiple) {
+				let e = B.value[0];
+				return M.options.find((t) => t.value === e?.value)?.label ?? e?.label ?? null;
 			}
-			return z.value.length > 2 ? `${z.value.length} kiválasztva` : z.value.map((e) => j.options.find((t) => t.value === e.value)?.label ?? e.label ?? e.value).join(", ");
-		}), U = r(() => {
+			return B.value.length > 2 ? `${B.value.length} kiválasztva` : B.value.map((e) => M.options.find((t) => t.value === e.value)?.label ?? e.label ?? e.value).join(", ");
+		}), K = a(() => {
 			let e = F.value.toLowerCase();
-			return e ? j.options.filter((t) => t.label.toLowerCase().includes(e)) : j.options;
+			return e ? M.options.filter((t) => t.label.toLowerCase().includes(e)) : M.options;
 		});
-		function W(e) {
+		function q(e) {
 			return e.replace(/[&<>"']/g, (e) => ({
 				"&": "&amp;",
 				"<": "&lt;",
@@ -79,159 +83,155 @@ var v = { class: "ac-component" }, ne = ["aria-disabled"], re = {
 				"'": "&#39;"
 			})[e]);
 		}
-		function G(e) {
+		function se(e) {
 			let t = F.value.trim();
-			if (!t || !M.value.highlight) return W(e);
-			let n = W(e), r = W(t), i = new RegExp(r.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), "ig");
+			if (!t || !N.value.highlight) return q(e);
+			let n = q(e), r = q(t), i = new RegExp(r.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), "ig");
 			return n.replace(i, (e) => `<mark class="ds-option__highlight">${e}</mark>`);
 		}
-		let K = r(() => U.value.filter((e) => e.value)), q = r(() => {
-			if (K.value.length === 0) return !1;
-			let e = M.value.lazy && P.value ? R.value : z.value;
-			return K.value.every((t) => t.value && e.some((e) => e.value === t.value));
+		let J = a(() => K.value.filter((e) => e.value)), Y = a(() => {
+			if (J.value.length === 0) return !1;
+			let e = N.value.lazy && V.value ? z.value : B.value;
+			return J.value.every((t) => t.value && e.some((e) => e.value === t.value));
 		});
-		function J(e) {
-			return (M.value.lazy && P.value ? R : z).value.some((t) => t.value === e);
+		function X(e) {
+			return (N.value.lazy && V.value ? z : B).value.some((t) => t.value === e);
 		}
-		function Y() {
-			let e = M.value.lazy && P.value ? R : z, t = K.value.filter((e) => e.value);
-			if (q.value) {
+		function ce() {
+			let e = N.value.lazy && V.value ? z : B, t = J.value.filter((e) => e.value);
+			if (Y.value) {
 				let n = new Set(t.map((e) => e.value));
 				e.value = e.value.filter((e) => !n.has(e.value ?? ""));
 			} else {
 				let n = new Set(e.value.map((e) => e.value)), r = t.filter((e) => !n.has(e.value));
 				e.value = [...e.value, ...r];
 			}
-			M.value.lazy || N("update:modelValue", z.value.length > 0 ? [...z.value] : null);
+			N.value.lazy || P("update:modelValue", B.value.length > 0 ? [...B.value] : null);
 		}
-		function X(e, t) {
+		function Z(e, t) {
 			let n = e.findIndex((e) => e.value === t.value);
 			return n >= 0 ? e.filter((e, t) => t !== n) : [...e, t];
 		}
-		function Z(e) {
+		function Q(e) {
 			if (e.callback) {
-				e.callback(), P.value = !1;
+				e.callback(), V.value = !1;
 				return;
 			}
-			e.value && (M.value.multiple ? M.value.lazy ? R.value = X(R.value, e) : (z.value = X(z.value, e), N("update:modelValue", z.value.length > 0 ? [...z.value] : null)) : (z.value = [e], N("update:modelValue", e), P.value = !1));
+			e.value && (N.value.multiple ? N.value.lazy ? z.value = Z(z.value, e) : (B.value = Z(B.value, e), P("update:modelValue", B.value.length > 0 ? [...B.value] : null)) : (B.value = [e], P("update:modelValue", e), V.value = !1));
 		}
-		function Q() {
-			M.value.lazy && (z.value = [...R.value], N("update:modelValue", R.value.length > 0 ? [...R.value] : null)), P.value = !1;
+		function $() {
+			N.value.lazy && (B.value = [...z.value], P("update:modelValue", z.value.length > 0 ? [...z.value] : null)), V.value = !1;
 		}
-		function ae() {
-			M.value.lazy ? R.value = [] : (z.value = [], N("update:modelValue", null));
+		function le() {
+			N.value.lazy ? z.value = [] : (B.value = [], P("update:modelValue", null));
 		}
-		function oe(e, t) {
-			e.key === " " ? (e.preventDefault(), Z(t)) : e.key === "Enter" && (e.preventDefault(), Q());
+		function ue(e, t) {
+			e.key === " " ? (e.preventDefault(), Q(t)) : e.key === "Enter" && (e.preventDefault(), $());
 		}
-		function $(e) {
-			I.value && !I.value.contains(e.target) && (P.value = !1);
+		function de() {
+			N.value.disabled || (V.value = !V.value, V.value && N.value.filterable && (F.value = "", P("filter-input", "")));
 		}
-		d(() => document.addEventListener("mousedown", $)), te(() => {
-			document.removeEventListener("mousedown", $);
-		});
-		function se() {
-			M.value.disabled || (P.value = !P.value, P.value && M.value.filterable && (F.value = "", N("filter-input", "")));
+		function fe() {
+			N.value.disabled || (B.value = [], P("update:modelValue", null), V.value = !1);
 		}
-		function ce() {
-			M.value.disabled || (z.value = [], N("update:modelValue", null), P.value = !1);
-		}
-		function le() {
-			M.value.disabled || (P.value = !0, M.value.filterable && l(() => L.value?.focus()));
+		function pe() {
+			N.value.disabled || (V.value = !0, N.value.filterable && f(() => R.value?.focus()));
 		}
-		function ue() {
-			F.value = "", N("filter-input", "");
+		function me() {
+			F.value = "", P("filter-input", "");
 		}
-		return k({ focusAndOpen: le }), (r, c) => (f(), o("div", v, [s("div", {
+		return A({ focusAndOpen: pe }), (t, a) => (m(), c("div", x, [l("div", {
 			ref_key: "wrapperRef",
 			ref: I,
 			class: "c-wrapper ds-wrapper"
-		}, [s("div", {
-			class: u(["c-input-row pointer", {
-				"c-input-row--sm": M.value.size === "small",
-				"c-input-row--lg": M.value.size === "large",
-				"c-input-row--disabled": M.value.disabled
+		}, [l("div", {
+			class: p(["c-input-row pointer", {
+				"c-input-row--sm": N.value.size === "small",
+				"c-input-row--lg": N.value.size === "large",
+				"c-input-row--disabled": N.value.disabled
 			}]),
-			"aria-disabled": M.value.disabled || void 0,
-			onClick: c[1] ||= (e) => se()
+			"aria-disabled": N.value.disabled || void 0,
+			onClick: a[1] ||= (e) => de()
 		}, [
-			H.value ? (f(), o("span", re, h(H.value), 1)) : (f(), o("span", ie, h(M.value.placeholder), 1)),
-			M.value.clearable && z.value.length > 0 ? (f(), o("button", {
+			G.value ? (m(), c("span", C, _(G.value), 1)) : (m(), c("span", te, _(N.value.placeholder), 1)),
+			N.value.clearable && B.value.length > 0 ? (m(), c("button", {
 				key: 2,
 				type: "button",
 				class: "c-icon-btn c-icon-btn--clear ds-clear-btn",
-				onClick: c[0] ||= _((e) => ce(), ["stop"]),
+				onClick: a[0] ||= b((e) => fe(), ["stop"]),
 				"aria-label": "Törlés"
-			}, [...c[6] ||= [s("i", { class: "fa-solid fa-fw fa-xmark" }, null, -1)]])) : a("", !0),
-			s("span", { class: u(["c-icon-btn c-icon-btn--chevron mr-2", { "c-icon-btn--chevron-open": P.value }]) }, [...c[7] ||= [s("i", { class: "fa-solid fa-fw fa-chevron-down" }, null, -1)]], 2)
-		], 10, ne), P.value ? (f(), o("div", {
+			}, [...a[6] ||= [l("i", { class: "fa-solid fa-fw fa-xmark" }, null, -1)]])) : s("", !0),
+			l("span", { class: p(["c-icon-btn c-icon-btn--chevron mr-2", { "c-icon-btn--chevron-open": v(V) }]) }, [...a[7] ||= [l("i", { class: "fa-solid fa-fw fa-chevron-down" }, null, -1)]], 2)
+		], 10, S)], 512), (m(), o(i, { to: "body" }, [l("div", ne, [v(V) ? (m(), c("div", {
 			key: 0,
-			class: u(["c-dropdown ds-dropdown ac-component", { "ds-dropdown--multiple": M.value.multiple }])
+			ref_key: "dropdownRef",
+			ref: L,
+			class: p(["c-dropdown ds-dropdown ds-wrapper", { "ds-dropdown--multiple": N.value.multiple }]),
+			style: ee(v(H))
 		}, [
-			M.value.filterable ? (f(), o("div", y, [
-				M.value.multiple ? (f(), o("span", {
+			N.value.filterable ? (m(), c("div", re, [
+				N.value.multiple ? (m(), c("span", {
 					key: 0,
-					class: u(["c-checkbox ds-select-all-checkbox", { "c-checkbox--checked": q.value }]),
-					onClick: c[2] ||= _((e) => Y(), ["stop"]),
-					title: q.value ? "Összes kijelölés törlése" : "Összes kijelölése"
-				}, null, 10, b)) : a("", !0),
-				s("input", {
+					class: p(["c-checkbox ds-select-all-checkbox", { "c-checkbox--checked": Y.value }]),
+					onClick: a[2] ||= b((e) => ce(), ["stop"]),
+					title: Y.value ? "Összes kijelölés törlése" : "Összes kijelölése"
+				}, null, 10, w)) : s("", !0),
+				l("input", {
 					ref_key: "filterInputRef",
-					ref: L,
+					ref: R,
 					type: "text",
 					id: "ds-filter-input",
 					class: "c-focus ds-filter-input",
 					value: F.value,
-					onInput: c[3] ||= (e) => V(e.target.value),
+					onInput: a[3] ||= (e) => W(e.target.value),
 					autocomplete: "off",
-					placeholder: M.value.filterPlaceholder,
-					onClick: c[4] ||= _(() => {}, ["stop"])
-				}, null, 40, x),
-				F.value ? (f(), o("button", {
+					placeholder: N.value.filterPlaceholder,
+					onClick: a[4] ||= b(() => {}, ["stop"])
+				}, null, 40, T),
+				F.value ? (m(), c("button", {
 					key: 1,
 					type: "button",
 					class: "c-icon-btn c-icon-btn--clear ds-filter-clear",
-					onClick: c[5] ||= _((e) => ue(), ["stop"]),
+					onClick: a[5] ||= b((e) => me(), ["stop"]),
 					"aria-label": "Szűrők törlése"
-				}, [...c[8] ||= [s("i", { class: "fa-solid fa-xmark" }, null, -1)]])) : a("", !0)
-			])) : a("", !0),
-			s("ul", S, [M.value.loading ? (f(), o("li", C, [ee(t, {
+				}, [...a[8] ||= [l("i", { class: "fa-solid fa-xmark" }, null, -1)]])) : s("", !0)
+			])) : s("", !0),
+			l("ul", E, [N.value.loading ? (m(), c("li", ie, [u(n, {
 				size: "2rem",
 				color: "var(--neutral-300)",
 				class: "m-auto p-3"
-			})])) : (f(), o(n, { key: 1 }, [(f(!0), o(n, null, m(U.value, (e, t) => (f(), o("li", {
+			})])) : (m(), c(r, { key: 1 }, [(m(!0), c(r, null, g(K.value, (e, t) => (m(), c("li", {
 				key: e.value ?? `cb-${t}`,
-				class: u(["d-option ds-option", { "ds-option--selected": e.value && J(e.value) }]),
+				class: p(["d-option ds-option", { "ds-option--selected": e.value && X(e.value) }]),
 				tabindex: "0",
-				onClick: (t) => Z(e),
-				onKeydown: (t) => oe(t, e)
+				onClick: (t) => Q(e),
+				onKeydown: (t) => ue(t, e)
 			}, [
-				M.value.multiple && e.value ? (f(), o("span", {
+				N.value.multiple && e.value ? (m(), c("span", {
 					key: 0,
-					class: u(["c-checkbox", { "c-checkbox--checked": J(e.value) }])
-				}, null, 2)) : a("", !0),
-				e.icon ? (f(), o("i", {
+					class: p(["c-checkbox", { "c-checkbox--checked": X(e.value) }])
+				}, null, 2)) : s("", !0),
+				e.icon ? (m(), c("i", {
 					key: 1,
-					class: u(["fa-fw", e.icon])
-				}, null, 2)) : a("", !0),
-				s("span", {
-					class: u(["d-option__label", { "c-truncate": M.value.textEllipsis }]),
-					innerHTML: G(e.label)
-				}, null, 10, T)
-			], 42, w))), 128)), U.value.length === 0 ? (f(), o("li", E, " Nincs találat ")) : a("", !0)], 64))]),
-			M.value.multiple || M.value.clearable && z.value.length > 0 ? (f(), o("div", D, [M.value.clearable ? (f(), i(e, {
+					class: p(["fa-fw", e.icon])
+				}, null, 2)) : s("", !0),
+				l("span", {
+					class: p(["d-option__label", { "c-truncate": N.value.textEllipsis }]),
+					innerHTML: se(e.label)
+				}, null, 10, oe)
+			], 42, ae))), 128)), K.value.length === 0 ? (m(), c("li", D, " Nincs találat ")) : s("", !0)], 64))]),
+			N.value.multiple ? (m(), c("div", O, [N.value.clearable && B.value.length > 0 ? (m(), o(e, {
 				key: 0,
 				label: "Törlés",
 				outline: "",
-				onClick: ae
-			})) : a("", !0), M.value.multiple ? (f(), i(e, {
-				key: 1,
+				onClick: le
+			})) : s("", !0), u(e, {
 				label: "OK",
 				type: "success",
-				onClick: Q
-			})) : a("", !0)])) : a("", !0)
-		], 2)) : a("", !0)], 512)]));
+				onClick: $
+			})])) : s("", !0)
+		], 6)) : s("", !0)])]))]));
 	}
 });
 //#endregion
-export { k as default, O as dropdownSelectConfigDefaults };
+export { A as default, k as dropdownSelectConfigDefaults };

package/dist/admins-components26.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components26.js","names":[],"sources":["../src/components/DropdownSelect.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownSelectConfig {\n  placeholder?: string\n  filterable?: boolean\n  filterPlaceholder?: string\n  clearable?: boolean\n  textEllipsis?: boolean\n  multiple?: boolean\n  lazy?: boolean\n  size?: ControlSize\n  loading?: boolean\n  highlight?: boolean\n  disabled?: boolean\n}\n\nexport const dropdownSelectConfigDefaults: DropdownSelectConfig = {\n  placeholder: 'Válassz...',\n  filterable: true,\n  filterPlaceholder: 'Kezdj el gépelni...',\n  clearable: true,\n  textEllipsis: true,\n  multiple: false,\n  lazy: false,\n  loading: false,\n  size: 'normal' as ControlSize,\n  highlight: true,\n  disabled: false,\n}\n\nexport interface DropdownOption {\n  icon?: string\n  value?: string\n  label: string\n  callback?: () => void\n}\n\nexport interface DropdownSelectProps {\n  modelValue?: DropdownOption | DropdownOption[] | string | string[] | null\n  options: DropdownOption[]\n  config?: DropdownSelectConfig\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, watch, nextTick, onMounted, onBeforeUnmount } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { ControlSize } from '@/types/types'\nimport Loader from '@/components/Loader.vue'\n\nconst props = withDefaults(defineProps<DropdownSelectProps>(), {\n  modelValue: null,\n  config: () => ({ ...dropdownSelectConfigDefaults }),\n})\n\nconst cfg = computed(() => ({ ...dropdownSelectConfigDefaults, ...props.config }))\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: DropdownOption | DropdownOption[] | null]\n  'filter-input': [filterText: string]\n}>()\n\nconst isOpen = ref(false)\nconst filterText = ref('')\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst filterInputRef = ref<HTMLInputElement | null>(null)\nconst buffer = ref<DropdownOption[]>([])\nconst selection = ref<DropdownOption[]>(normalizeToOptions(props.modelValue, props.options))\n\n\nfunction normalizeToOptions(\n  val: DropdownOption | DropdownOption[] | string | string[] | null | undefined,\n  options: DropdownOption[],\n): DropdownOption[] {\n  if (val == null) return []\n  const arr = Array.isArray(val) ? val : [val]\n  return arr\n    .map((entry): DropdownOption | null => {\n      if (entry == null) return null\n      if (typeof entry === 'object' && 'label' in entry) {\n        return entry as DropdownOption\n      }\n      if (typeof entry === 'string') {\n        const found = options.find((o) => o.value === entry)\n        return found ?? { value: entry, label: entry }\n      }\n      return null\n    })\n    .filter((o): o is DropdownOption => o !== null)\n}\n\nwatch(\n  () => [props.modelValue, props.options],\n  ([v]) => {\n    selection.value = normalizeToOptions(v as typeof props.modelValue, props.options)\n  },\n)\n\nwatch(isOpen, (open) => {\n  if (open) {\n    filterText.value = ''\n    if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n    if (cfg.value.lazy) buffer.value = [...selection.value]\n  }\n})\n\nfunction onFilterInput(text: string) {\n  filterText.value = text\n  emit('filter-input', text)\n  //debouncedEmit(text)\n}\n\n/* const debouncedEmit = debounce((raw: string) => {\n  emit('filter-input', raw)\n}) */\n\n// Display\nconst selectedLabel = computed(() => {\n  if (selection.value.length === 0) return null\n  if (!cfg.value.multiple) {\n    const sel = selection.value[0]\n    // Prefer the label from the live options list, fall back to the stored label\n    return props.options.find((o) => o.value === sel?.value)?.label ?? sel?.label ?? null\n  }\n  if (selection.value.length > 2) return `${selection.value.length} kiválasztva`\n  return selection.value\n    .map((sel) => props.options.find((o) => o.value === sel.value)?.label ?? sel.label ?? sel.value)\n    .join(', ')\n})\n\nconst filteredOptions = computed(() => {\n  const q = filterText.value.toLowerCase()\n  return q ? props.options.filter((o) => o.label.toLowerCase().includes(q)) : props.options\n})\n\nfunction escapeHtml(str: string) {\n  return str.replace(\n    /[&<>\"']/g,\n    (m) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '\"': '&quot;', \"'\": '&#39;' })[m]!,\n  )\n}\n\nfunction highlight(label: string) {\n  const q = filterText.value.trim()\n  if (!q || !cfg.value.highlight) return escapeHtml(label)\n\n  const safeLabel = escapeHtml(label)\n  const safeQ = escapeHtml(q)\n\n  const re = new RegExp(safeQ.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&'), 'ig')\n  return safeLabel.replace(re, (m) => `<mark class=\"ds-option__highlight\">${m}</mark>`)\n}\n\nconst selectableOptions = computed(() => {\n  return filteredOptions.value.filter((o) => o.value)\n})\n\nconst allOptionsSelected = computed(() => {\n  if (selectableOptions.value.length === 0) return false\n  const currentList = cfg.value.lazy && isOpen.value ? buffer.value : selection.value\n  return selectableOptions.value.every((o) => o.value && currentList.some((s) => s.value === o.value))\n})\n\nfunction isSelected(value: string): boolean {\n  const list = cfg.value.lazy && isOpen.value ? buffer : selection\n  return list.value.some((s) => s.value === value)\n}\n\nfunction toggleAllOptions() {\n  const currentList = cfg.value.lazy && isOpen.value ? buffer : selection\n  const selectableOpts = selectableOptions.value.filter((o) => o.value)\n\n  if (allOptionsSelected.value) {\n    const selectableValues = new Set(selectableOpts.map((o) => o.value as string))\n    currentList.value = currentList.value.filter((s) => !selectableValues.has(s.value ?? ''))\n  } else {\n    const existingValues = new Set(currentList.value.map((s) => s.value))\n    const toAdd = selectableOpts.filter((o) => !existingValues.has(o.value as string))\n    currentList.value = [...currentList.value, ...toAdd]\n  }\n\n  if (!cfg.value.lazy) {\n    emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n  }\n}\n\n// Actions\nfunction toggleList(list: DropdownOption[], opt: DropdownOption): DropdownOption[] {\n  const idx = list.findIndex((s) => s.value === opt.value)\n  return idx >= 0 ? list.filter((_, i) => i !== idx) : [...list, opt]\n}\n\nfunction selectOption(opt: DropdownOption) {\n  if (opt.callback) {\n    opt.callback()\n    isOpen.value = false\n    return\n  }\n\n  const value = opt.value\n  if (!value) return\n\n  if (cfg.value.multiple) {\n    if (cfg.value.lazy) {\n      buffer.value = toggleList(buffer.value, opt)\n    } else {\n      selection.value = toggleList(selection.value, opt)\n      emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n    }\n  } else {\n    selection.value = [opt]\n    emit('update:modelValue', opt)\n    isOpen.value = false\n  }\n}\n\nfunction confirm() {\n  if (cfg.value.lazy) {\n    selection.value = [...buffer.value]\n    emit('update:modelValue', buffer.value.length > 0 ? [...buffer.value] : null)\n  }\n  isOpen.value = false\n}\n\nfunction clear() {\n  if (cfg.value.lazy) {\n    buffer.value = []\n  } else {\n    selection.value = []\n    emit('update:modelValue', null)\n  }\n}\n\nfunction onOptionKeydown(e: KeyboardEvent, opt: DropdownOption) {\n  if (e.key === ' ') {\n    e.preventDefault()\n    selectOption(opt)\n  } else if (e.key === 'Enter') {\n    e.preventDefault()\n    confirm()\n  }\n}\n\nfunction onClickOutside(e: MouseEvent) {\n  if (wrapperRef.value && !wrapperRef.value.contains(e.target as Node)) isOpen.value = false\n}\n\nonMounted(() => document.addEventListener('mousedown', onClickOutside))\nonBeforeUnmount(() => {\n  document.removeEventListener('mousedown', onClickOutside)\n})\n\nfunction toggleOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = !isOpen.value\n  if (isOpen.value) {\n    if (cfg.value.filterable) {\n      filterText.value = ''\n      emit('filter-input', '')\n    }\n  }\n}\n\nfunction clearInput() {\n  if (cfg.value.disabled) return\n  selection.value = []\n  emit('update:modelValue', null)\n  isOpen.value = false\n}\n\nfunction focusAndOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = true\n  if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n}\n\nfunction handleFilterClear() {\n  filterText.value = ''\n  emit('filter-input', '')\n}\n\ndefineExpose({ focusAndOpen })\n</script>\n\n<template>\n  <div class=\"ac-component\">\n    <div ref=\"wrapperRef\" class=\"c-wrapper ds-wrapper\">\n      <div\n        class=\"c-input-row pointer\"\n        :class=\"{\n          'c-input-row--sm': cfg.size === 'small',\n          'c-input-row--lg': cfg.size === 'large',\n          'c-input-row--disabled': cfg.disabled,\n        }\"\n        :aria-disabled=\"cfg.disabled || undefined\"\n        @click=\"toggleOpen()\"\n      >\n        <span v-if=\"selectedLabel\" class=\"c-truncate ds-value\">{{ selectedLabel }}</span>\n        <span v-else class=\"c-placeholder\">{{ cfg.placeholder }}</span>\n        <button\n          v-if=\"cfg.clearable && selection.length > 0\"\n          type=\"button\"\n          class=\"c-icon-btn c-icon-btn--clear ds-clear-btn\"\n          @click.stop=\"clearInput()\"\n          aria-label=\"Törlés\"\n        >\n          <i class=\"fa-solid fa-fw fa-xmark\"></i>\n        </button>\n        <span\n          class=\"c-icon-btn c-icon-btn--chevron mr-2\"\n          :class=\"{ 'c-icon-btn--chevron-open': isOpen }\"\n        >\n          <i class=\"fa-solid fa-fw fa-chevron-down\"></i>\n        </span>\n      </div>\n\n      <div\n        v-if=\"isOpen\"\n        class=\"c-dropdown ds-dropdown ac-component\"\n        :class=\"{ 'ds-dropdown--multiple': cfg.multiple }\"\n      >\n        <div v-if=\"cfg.filterable\" class=\"ds-filter\">\n          <span\n            v-if=\"cfg.multiple\"\n            class=\"c-checkbox ds-select-all-checkbox\"\n            :class=\"{ 'c-checkbox--checked': allOptionsSelected }\"\n            @click.stop=\"toggleAllOptions()\"\n            :title=\"allOptionsSelected ? 'Összes kijelölés törlése' : 'Összes kijelölése'\"\n          ></span>\n          <input\n            ref=\"filterInputRef\"\n            type=\"text\"\n            id=\"ds-filter-input\"\n            class=\"c-focus ds-filter-input\"\n            :value=\"filterText\"\n            @input=\"onFilterInput(($event.target as HTMLInputElement).value)\"\n            autocomplete=\"off\"\n            :placeholder=\"cfg.filterPlaceholder\"\n            @click.stop\n          />\n          <button\n            v-if=\"filterText\"\n            type=\"button\"\n            class=\"c-icon-btn c-icon-btn--clear ds-filter-clear\"\n            @click.stop=\"handleFilterClear()\"\n            aria-label=\"Szűrők törlése\"\n          >\n            <i class=\"fa-solid fa-xmark\"></i>\n          </button>\n        </div>\n\n        <ul class=\"ds-options c-scroll\">\n          <li v-if=\"cfg.loading\" class=\"ds-option ds-option--loading\">\n            <Loader size=\"2rem\" color=\"var(--neutral-300)\" class=\"m-auto p-3\" />\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(opt, idx) in filteredOptions\"\n              :key=\"opt.value ?? `cb-${idx}`\"\n              class=\"d-option ds-option\"\n              :class=\"{ 'ds-option--selected': opt.value && isSelected(opt.value) }\"\n              tabindex=\"0\"\n              @click=\"selectOption(opt)\"\n              @keydown=\"onOptionKeydown($event, opt)\"\n            >\n              <span\n                v-if=\"cfg.multiple && opt.value\"\n                class=\"c-checkbox\"\n                :class=\"{ 'c-checkbox--checked': isSelected(opt.value) }\"\n              ></span>\n              <i v-if=\"opt.icon\" class=\"fa-fw\" :class=\"opt.icon\"></i>\n              <span\n                class=\"d-option__label\"\n                :class=\"{ 'c-truncate': cfg.textEllipsis }\"\n                v-html=\"highlight(opt.label)\"\n              ></span>\n            </li>\n            <li v-if=\"filteredOptions.length === 0\" class=\"ds-option ds-option--empty\">\n              Nincs találat\n            </li>\n          </template>\n        </ul>\n\n        <div v-if=\"cfg.multiple || (cfg.clearable && selection.length > 0)\" class=\"c-footer\">\n          <Button v-if=\"cfg.clearable\" label=\"Törlés\" outline @click=\"clear\" />\n          <Button v-if=\"cfg.multiple\" label=\"OK\" type=\"success\" @click=\"confirm\" />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":"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"}
+{"version":3,"file":"admins-components26.js","names":[],"sources":["../src/components/DropdownSelect.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownSelectConfig {\n  placeholder?: string\n  filterable?: boolean\n  filterPlaceholder?: string\n  clearable?: boolean\n  textEllipsis?: boolean\n  multiple?: boolean\n  lazy?: boolean\n  size?: ControlSize\n  loading?: boolean\n  highlight?: boolean\n  disabled?: boolean\n}\n\nexport const dropdownSelectConfigDefaults: DropdownSelectConfig = {\n  placeholder: 'Válassz...',\n  filterable: true,\n  filterPlaceholder: 'Kezdj el gépelni...',\n  clearable: true,\n  textEllipsis: true,\n  multiple: false,\n  lazy: false,\n  loading: false,\n  size: 'normal' as ControlSize,\n  highlight: true,\n  disabled: false,\n}\n\nexport interface DropdownOption {\n  icon?: string\n  value?: string\n  label: string\n  callback?: () => void\n}\n\nexport interface DropdownSelectProps {\n  modelValue?: DropdownOption | DropdownOption[] | string | string[] | null\n  options: DropdownOption[]\n  config?: DropdownSelectConfig\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, watch, nextTick } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { ControlSize } from '@/types/types'\nimport Loader from '@/components/Loader.vue'\nimport { useDropdownAnchor } from '@/composables/useDropdownAnchor'\n\nconst props = withDefaults(defineProps<DropdownSelectProps>(), {\n  modelValue: null,\n  config: () => ({ ...dropdownSelectConfigDefaults }),\n})\n\nconst cfg = computed(() => ({ ...dropdownSelectConfigDefaults, ...props.config }))\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: DropdownOption | DropdownOption[] | null]\n  'filter-input': [filterText: string]\n}>()\n\nconst filterText = ref('')\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst dropdownRef = ref<HTMLElement | null>(null)\nconst filterInputRef = ref<HTMLInputElement | null>(null)\nconst buffer = ref<DropdownOption[]>([])\nconst selection = ref<DropdownOption[]>(normalizeToOptions(props.modelValue, props.options))\n\nconst { isOpen, dropdownStyle } = useDropdownAnchor(wrapperRef, dropdownRef, {\n  extraStyle: (rect) => ({\n    minWidth: `${rect.width}px`,\n    maxWidth: `${rect.width * 1.5}px`,\n  }),\n})\n\n\nfunction normalizeToOptions(\n  val: DropdownOption | DropdownOption[] | string | string[] | null | undefined,\n  options: DropdownOption[],\n): DropdownOption[] {\n  if (val == null) return []\n  const arr = Array.isArray(val) ? val : [val]\n  return arr\n    .map((entry): DropdownOption | null => {\n      if (entry == null) return null\n      if (typeof entry === 'object' && 'label' in entry) {\n        return entry as DropdownOption\n      }\n      if (typeof entry === 'string') {\n        const found = options.find((o) => o.value === entry)\n        return found ?? { value: entry, label: entry }\n      }\n      return null\n    })\n    .filter((o): o is DropdownOption => o !== null)\n}\n\nwatch(\n  () => [props.modelValue, props.options],\n  ([v]) => {\n    selection.value = normalizeToOptions(v as typeof props.modelValue, props.options)\n  },\n)\n\nwatch(isOpen, (open) => {\n  if (open) {\n    filterText.value = ''\n    if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n    if (cfg.value.lazy) buffer.value = [...selection.value]\n  }\n})\n\nfunction onFilterInput(text: string) {\n  filterText.value = text\n  emit('filter-input', text)\n}\n\nconst selectedLabel = computed(() => {\n  if (selection.value.length === 0) return null\n  if (!cfg.value.multiple) {\n    const sel = selection.value[0]\n\n    return props.options.find((o) => o.value === sel?.value)?.label ?? sel?.label ?? null\n  }\n  if (selection.value.length > 2) return `${selection.value.length} kiválasztva`\n  return selection.value\n    .map((sel) => props.options.find((o) => o.value === sel.value)?.label ?? sel.label ?? sel.value)\n    .join(', ')\n})\n\nconst filteredOptions = computed(() => {\n  const q = filterText.value.toLowerCase()\n  return q ? props.options.filter((o) => o.label.toLowerCase().includes(q)) : props.options\n})\n\nfunction escapeHtml(str: string) {\n  return str.replace(\n    /[&<>\"']/g,\n    (m) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '\"': '&quot;', \"'\": '&#39;' })[m]!,\n  )\n}\n\nfunction highlight(label: string) {\n  const q = filterText.value.trim()\n  if (!q || !cfg.value.highlight) return escapeHtml(label)\n\n  const safeLabel = escapeHtml(label)\n  const safeQ = escapeHtml(q)\n\n  const re = new RegExp(safeQ.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&'), 'ig')\n  return safeLabel.replace(re, (m) => `<mark class=\"ds-option__highlight\">${m}</mark>`)\n}\n\nconst selectableOptions = computed(() => {\n  return filteredOptions.value.filter((o) => o.value)\n})\n\nconst allOptionsSelected = computed(() => {\n  if (selectableOptions.value.length === 0) return false\n  const currentList = cfg.value.lazy && isOpen.value ? buffer.value : selection.value\n  return selectableOptions.value.every((o) => o.value && currentList.some((s) => s.value === o.value))\n})\n\nfunction isSelected(value: string): boolean {\n  const list = cfg.value.lazy && isOpen.value ? buffer : selection\n  return list.value.some((s) => s.value === value)\n}\n\nfunction toggleAllOptions() {\n  const currentList = cfg.value.lazy && isOpen.value ? buffer : selection\n  const selectableOpts = selectableOptions.value.filter((o) => o.value)\n\n  if (allOptionsSelected.value) {\n    const selectableValues = new Set(selectableOpts.map((o) => o.value as string))\n    currentList.value = currentList.value.filter((s) => !selectableValues.has(s.value ?? ''))\n  } else {\n    const existingValues = new Set(currentList.value.map((s) => s.value))\n    const toAdd = selectableOpts.filter((o) => !existingValues.has(o.value as string))\n    currentList.value = [...currentList.value, ...toAdd]\n  }\n\n  if (!cfg.value.lazy) {\n    emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n  }\n}\n\nfunction toggleList(list: DropdownOption[], opt: DropdownOption): DropdownOption[] {\n  const idx = list.findIndex((s) => s.value === opt.value)\n  return idx >= 0 ? list.filter((_, i) => i !== idx) : [...list, opt]\n}\n\nfunction selectOption(opt: DropdownOption) {\n  if (opt.callback) {\n    opt.callback()\n    isOpen.value = false\n    return\n  }\n\n  const value = opt.value\n  if (!value) return\n\n  if (cfg.value.multiple) {\n    if (cfg.value.lazy) {\n      buffer.value = toggleList(buffer.value, opt)\n    } else {\n      selection.value = toggleList(selection.value, opt)\n      emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n    }\n  } else {\n    selection.value = [opt]\n    emit('update:modelValue', opt)\n    isOpen.value = false\n  }\n}\n\nfunction confirm() {\n  if (cfg.value.lazy) {\n    selection.value = [...buffer.value]\n    emit('update:modelValue', buffer.value.length > 0 ? [...buffer.value] : null)\n  }\n  isOpen.value = false\n}\n\nfunction clear() {\n  if (cfg.value.lazy) {\n    buffer.value = []\n  } else {\n    selection.value = []\n    emit('update:modelValue', null)\n  }\n}\n\nfunction onOptionKeydown(e: KeyboardEvent, opt: DropdownOption) {\n  if (e.key === ' ') {\n    e.preventDefault()\n    selectOption(opt)\n  } else if (e.key === 'Enter') {\n    e.preventDefault()\n    confirm()\n  }\n}\n\nfunction toggleOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = !isOpen.value\n  if (isOpen.value) {\n    if (cfg.value.filterable) {\n      filterText.value = ''\n      emit('filter-input', '')\n    }\n  }\n}\n\nfunction clearInput() {\n  if (cfg.value.disabled) return\n  selection.value = []\n  emit('update:modelValue', null)\n  isOpen.value = false\n}\n\nfunction focusAndOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = true\n  if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n}\n\nfunction handleFilterClear() {\n  filterText.value = ''\n  emit('filter-input', '')\n}\n\ndefineExpose({ focusAndOpen })\n</script>\n\n<template>\n  <div class=\"ac-component\">\n    <div ref=\"wrapperRef\" class=\"c-wrapper ds-wrapper\">\n      <div\n        class=\"c-input-row pointer\"\n        :class=\"{\n          'c-input-row--sm': cfg.size === 'small',\n          'c-input-row--lg': cfg.size === 'large',\n          'c-input-row--disabled': cfg.disabled,\n        }\"\n        :aria-disabled=\"cfg.disabled || undefined\"\n        @click=\"toggleOpen()\"\n      >\n        <span v-if=\"selectedLabel\" class=\"c-truncate ds-value\">{{ selectedLabel }}</span>\n        <span v-else class=\"c-placeholder\">{{ cfg.placeholder }}</span>\n        <button\n          v-if=\"cfg.clearable && selection.length > 0\"\n          type=\"button\"\n          class=\"c-icon-btn c-icon-btn--clear ds-clear-btn\"\n          @click.stop=\"clearInput()\"\n          aria-label=\"Törlés\"\n        >\n          <i class=\"fa-solid fa-fw fa-xmark\"></i>\n        </button>\n        <span\n          class=\"c-icon-btn c-icon-btn--chevron mr-2\"\n          :class=\"{ 'c-icon-btn--chevron-open': isOpen }\"\n        >\n          <i class=\"fa-solid fa-fw fa-chevron-down\"></i>\n        </span>\n      </div>\n    </div>\n    <Teleport to=\"body\">\n      <div class=\"ac-component\">\n        <div\n          v-if=\"isOpen\"\n          ref=\"dropdownRef\"\n          class=\"c-dropdown ds-dropdown ds-wrapper\"\n          :class=\"{ 'ds-dropdown--multiple': cfg.multiple }\"\n          :style=\"dropdownStyle\"\n        >\n        <div v-if=\"cfg.filterable\" class=\"ds-filter\">\n          <span\n            v-if=\"cfg.multiple\"\n            class=\"c-checkbox ds-select-all-checkbox\"\n            :class=\"{ 'c-checkbox--checked': allOptionsSelected }\"\n            @click.stop=\"toggleAllOptions()\"\n            :title=\"allOptionsSelected ? 'Összes kijelölés törlése' : 'Összes kijelölése'\"\n          ></span>\n          <input\n            ref=\"filterInputRef\"\n            type=\"text\"\n            id=\"ds-filter-input\"\n            class=\"c-focus ds-filter-input\"\n            :value=\"filterText\"\n            @input=\"onFilterInput(($event.target as HTMLInputElement).value)\"\n            autocomplete=\"off\"\n            :placeholder=\"cfg.filterPlaceholder\"\n            @click.stop\n          />\n          <button\n            v-if=\"filterText\"\n            type=\"button\"\n            class=\"c-icon-btn c-icon-btn--clear ds-filter-clear\"\n            @click.stop=\"handleFilterClear()\"\n            aria-label=\"Szűrők törlése\"\n          >\n            <i class=\"fa-solid fa-xmark\"></i>\n          </button>\n        </div>\n\n        <ul class=\"ds-options c-scroll\">\n          <li v-if=\"cfg.loading\" class=\"ds-option ds-option--loading\">\n            <Loader size=\"2rem\" color=\"var(--neutral-300)\" class=\"m-auto p-3\" />\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(opt, idx) in filteredOptions\"\n              :key=\"opt.value ?? `cb-${idx}`\"\n              class=\"d-option ds-option\"\n              :class=\"{ 'ds-option--selected': opt.value && isSelected(opt.value) }\"\n              tabindex=\"0\"\n              @click=\"selectOption(opt)\"\n              @keydown=\"onOptionKeydown($event, opt)\"\n            >\n              <span\n                v-if=\"cfg.multiple && opt.value\"\n                class=\"c-checkbox\"\n                :class=\"{ 'c-checkbox--checked': isSelected(opt.value) }\"\n              ></span>\n              <i v-if=\"opt.icon\" class=\"fa-fw\" :class=\"opt.icon\"></i>\n              <span\n                class=\"d-option__label\"\n                :class=\"{ 'c-truncate': cfg.textEllipsis }\"\n                v-html=\"highlight(opt.label)\"\n              ></span>\n            </li>\n            <li v-if=\"filteredOptions.length === 0\" class=\"ds-option ds-option--empty\">\n              Nincs találat\n            </li>\n          </template>\n        </ul>\n        <div v-if=\"cfg.multiple\" class=\"c-footer\">\n          <Button v-if=\"cfg.clearable && selection.length > 0\" label=\"Törlés\" outline @click=\"clear\" />\n          <Button label=\"OK\" type=\"success\" @click=\"confirm\" />\n        </div>\n        </div>\n      </div>\n    </Teleport>\n  </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;GAea,IAAqD;CAChE,aAAa;CACb,YAAY;CACZ,mBAAmB;CACnB,WAAW;CACX,cAAc;CACd,UAAU;CACV,MAAM;CACN,SAAS;CACT,MAAM;CACN,WAAW;CACX,UAAU;AACZ;;;;;;;;;EAuBA,IAAM,IAAQ,GAKR,IAAM,SAAgB;GAAE,GAAG;GAA8B,GAAG,EAAM;EAAO,EAAE,GAE3E,IAAO,GAKP,IAAa,EAAI,EAAE,GACnB,IAAa,EAAwB,IAAI,GACzC,IAAc,EAAwB,IAAI,GAC1C,IAAiB,EAA6B,IAAI,GAClD,IAAS,EAAsB,CAAC,CAAC,GACjC,IAAY,EAAsB,EAAmB,EAAM,YAAY,EAAM,OAAO,CAAC,GAErF,EAAE,WAAQ,qBAAkB,EAAkB,GAAY,GAAa,EAC3E,aAAa,OAAU;GACrB,UAAU,GAAG,EAAK,MAAM;GACxB,UAAU,GAAG,EAAK,QAAQ,IAAI;EAChC,GACF,CAAC;EAGD,SAAS,EACP,GACA,GACkB;GAGlB,OAFI,KAAO,OAAa,CAAC,KACb,MAAM,QAAQ,CAAG,IAAI,IAAM,CAAC,CAAG,EAAA,CAExC,KAAK,MACA,KAAS,OAAa,OACtB,OAAO,KAAU,YAAY,WAAW,IACnC,IAEL,OAAO,KAAU,WACL,EAAQ,MAAM,MAAM,EAAE,UAAU,CACvC,KAAS;IAAE,OAAO;IAAO,OAAO;GAAM,IAExC,IACR,CAAA,CACA,QAAQ,MAA2B,MAAM,IAAI;EAClD;EASA,AAPA,QACQ,CAAC,EAAM,YAAY,EAAM,OAAO,IACrC,CAAC,OAAO;GACP,EAAU,QAAQ,EAAmB,GAA8B,EAAM,OAAO;EAClF,CACF,GAEA,EAAM,IAAS,MAAS;GACtB,AAAI,MACF,EAAW,QAAQ,IACf,EAAI,MAAM,cAAY,QAAe,EAAe,OAAO,MAAM,CAAC,GAClE,EAAI,MAAM,SAAM,EAAO,QAAQ,CAAC,GAAG,EAAU,KAAK;EAE1D,CAAC;EAED,SAAS,EAAc,GAAc;GAEnC,AADA,EAAW,QAAQ,GACnB,EAAK,gBAAgB,CAAI;EAC3B;EAEA,IAAM,IAAgB,QAAe;GACnC,IAAI,EAAU,MAAM,WAAW,GAAG,OAAO;GACzC,IAAI,CAAC,EAAI,MAAM,UAAU;IACvB,IAAM,IAAM,EAAU,MAAM;IAE5B,OAAO,EAAM,QAAQ,MAAM,MAAM,EAAE,UAAU,GAAK,KAAK,CAAC,EAAE,SAAS,GAAK,SAAS;GACnF;GAEA,OADI,EAAU,MAAM,SAAS,IAAU,GAAG,EAAU,MAAM,OAAO,gBAC1D,EAAU,MACd,KAAK,MAAQ,EAAM,QAAQ,MAAM,MAAM,EAAE,UAAU,EAAI,KAAK,CAAC,EAAE,SAAS,EAAI,SAAS,EAAI,KAAK,CAAA,CAC9F,KAAK,IAAI;EACd,CAAC,GAEK,IAAkB,QAAe;GACrC,IAAM,IAAI,EAAW,MAAM,YAAY;GACvC,OAAO,IAAI,EAAM,QAAQ,QAAQ,MAAM,EAAE,MAAM,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,EAAM;EACpF,CAAC;EAED,SAAS,EAAW,GAAa;GAC/B,OAAO,EAAI,QACT,aACC,OAAO;IAAE,KAAK;IAAS,KAAK;IAAQ,KAAK;IAAQ,MAAK;IAAU,KAAK;GAAQ,EAAA,CAAG,EACnF;EACF;EAEA,SAAS,GAAU,GAAe;GAChC,IAAM,IAAI,EAAW,MAAM,KAAK;GAChC,IAAI,CAAC,KAAK,CAAC,EAAI,MAAM,WAAW,OAAO,EAAW,CAAK;GAEvD,IAAM,IAAY,EAAW,CAAK,GAC5B,IAAQ,EAAW,CAAC,GAEpB,IAAK,IAAI,OAAO,EAAM,QAAQ,uBAAuB,MAAM,GAAG,IAAI;GACxE,OAAO,EAAU,QAAQ,IAAK,MAAM,sCAAsC,EAAE,QAAQ;EACtF;EAEA,IAAM,IAAoB,QACjB,EAAgB,MAAM,QAAQ,MAAM,EAAE,KAAK,CACnD,GAEK,IAAqB,QAAe;GACxC,IAAI,EAAkB,MAAM,WAAW,GAAG,OAAO;GACjD,IAAM,IAAc,EAAI,MAAM,QAAQ,EAAO,QAAQ,EAAO,QAAQ,EAAU;GAC9E,OAAO,EAAkB,MAAM,OAAO,MAAM,EAAE,SAAS,EAAY,MAAM,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC;EACrG,CAAC;EAED,SAAS,EAAW,GAAwB;GAE1C,QADa,EAAI,MAAM,QAAQ,EAAO,QAAQ,IAAS,EAAA,CAC3C,MAAM,MAAM,MAAM,EAAE,UAAU,CAAK;EACjD;EAEA,SAAS,KAAmB;GAC1B,IAAM,IAAc,EAAI,MAAM,QAAQ,EAAO,QAAQ,IAAS,GACxD,IAAiB,EAAkB,MAAM,QAAQ,MAAM,EAAE,KAAK;GAEpE,IAAI,EAAmB,OAAO;IAC5B,IAAM,IAAmB,IAAI,IAAI,EAAe,KAAK,MAAM,EAAE,KAAe,CAAC;IAC7E,EAAY,QAAQ,EAAY,MAAM,QAAQ,MAAM,CAAC,EAAiB,IAAI,EAAE,SAAS,EAAE,CAAC;GAC1F,OAAO;IACL,IAAM,IAAiB,IAAI,IAAI,EAAY,MAAM,KAAK,MAAM,EAAE,KAAK,CAAC,GAC9D,IAAQ,EAAe,QAAQ,MAAM,CAAC,EAAe,IAAI,EAAE,KAAe,CAAC;IACjF,EAAY,QAAQ,CAAC,GAAG,EAAY,OAAO,GAAG,CAAK;GACrD;GAEA,AAAK,EAAI,MAAM,QACb,EAAK,qBAAqB,EAAU,MAAM,SAAS,IAAI,CAAC,GAAG,EAAU,KAAK,IAAI,IAAI;EAEtF;EAEA,SAAS,EAAW,GAAwB,GAAuC;GACjF,IAAM,IAAM,EAAK,WAAW,MAAM,EAAE,UAAU,EAAI,KAAK;GACvD,OAAO,KAAO,IAAI,EAAK,QAAQ,GAAG,MAAM,MAAM,CAAG,IAAI,CAAC,GAAG,GAAM,CAAG;EACpE;EAEA,SAAS,EAAa,GAAqB;GACzC,IAAI,EAAI,UAAU;IAEhB,AADA,EAAI,SAAS,GACb,EAAO,QAAQ;IACf;GACF;GAEc,EAAI,UAGd,EAAI,MAAM,WACR,EAAI,MAAM,OACZ,EAAO,QAAQ,EAAW,EAAO,OAAO,CAAG,KAE3C,EAAU,QAAQ,EAAW,EAAU,OAAO,CAAG,GACjD,EAAK,qBAAqB,EAAU,MAAM,SAAS,IAAI,CAAC,GAAG,EAAU,KAAK,IAAI,IAAI,MAGpF,EAAU,QAAQ,CAAC,CAAG,GACtB,EAAK,qBAAqB,CAAG,GAC7B,EAAO,QAAQ;EAEnB;EAEA,SAAS,IAAU;GAKjB,AAJI,EAAI,MAAM,SACZ,EAAU,QAAQ,CAAC,GAAG,EAAO,KAAK,GAClC,EAAK,qBAAqB,EAAO,MAAM,SAAS,IAAI,CAAC,GAAG,EAAO,KAAK,IAAI,IAAI,IAE9E,EAAO,QAAQ;EACjB;EAEA,SAAS,KAAQ;GACf,AAAI,EAAI,MAAM,OACZ,EAAO,QAAQ,CAAC,KAEhB,EAAU,QAAQ,CAAC,GACnB,EAAK,qBAAqB,IAAI;EAElC;EAEA,SAAS,GAAgB,GAAkB,GAAqB;GAC9D,AAAI,EAAE,QAAQ,OACZ,EAAE,eAAe,GACjB,EAAa,CAAG,KACP,EAAE,QAAQ,YACnB,EAAE,eAAe,GACjB,EAAQ;EAEZ;EAEA,SAAS,KAAa;GAChB,EAAI,MAAM,aACd,EAAO,QAAQ,CAAC,EAAO,OACnB,EAAO,SACL,EAAI,MAAM,eACZ,EAAW,QAAQ,IACnB,EAAK,gBAAgB,EAAE;EAG7B;EAEA,SAAS,KAAa;GAChB,EAAI,MAAM,aACd,EAAU,QAAQ,CAAC,GACnB,EAAK,qBAAqB,IAAI,GAC9B,EAAO,QAAQ;EACjB;EAEA,SAAS,KAAe;GAClB,EAAI,MAAM,aACd,EAAO,QAAQ,IACX,EAAI,MAAM,cAAY,QAAe,EAAe,OAAO,MAAM,CAAC;EACxE;EAEA,SAAS,KAAoB;GAE3B,AADA,EAAW,QAAQ,IACnB,EAAK,gBAAgB,EAAE;EACzB;SAEA,EAAa,EAAE,iBAAa,CAAC,cAI3B,EAAA,GAAA,EA4GM,OA5GN,GA4GM,CA3GJ,EA6BM,OAAA;GA7BG,SAAA;GAAJ,KAAI;GAAa,OAAM;EAC1B,GAAA,CAAA,EA2BM,OAAA;GA1BJ,OAAK,EAAA,CAAC,uBAAqB;IACY,mBAAA,EAAA,MAAI,SAAI;IAA2C,mBAAA,EAAA,MAAI,SAAI;IAAiD,yBAAA,EAAA,MAAI;;GAKtJ,iBAAe,EAAA,MAAI,YAAY,KAAA;GAC/B,SAAK,AAAA,EAAA,QAAA,MAAE,GAAU;;GAEN,EAAA,SAAZ,EAAA,GAAA,EAAiF,QAAjF,GAAiF,EAAvB,EAAA,KAAa,GAAA,CAAA,MACvE,EAAA,GAAA,EAA+D,QAA/D,IAA+D,EAAzB,EAAA,MAAI,WAAW,GAAA,CAAA;GAE7C,EAAA,MAAI,aAAa,EAAA,MAAU,SAAM,KADzC,EAAA,GAAA,EAQS,UAAA;;IANP,MAAK;IACL,OAAM;IACL,SAAK,AAAA,EAAA,OAAA,GAAA,MAAO,GAAU,GAAA,CAAA,MAAA,CAAA;IACvB,cAAW;GAEX,GAAA,CAAA,GAAA,AAAA,EAAA,OAAA,CAAA,EAAuC,KAAA,EAApC,OAAM,0BAAyB,GAAA,MAAA,EAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAEpC,EAKO,QAAA,EAJL,OAAK,EAAA,CAAC,uCAAqC,EAAA,4BACL,EAAA,CAAA,EAAM,CAAA,CAAA,EAAA,GAAA,CAAA,GAAA,AAAA,EAAA,OAAA,CAE5C,EAA8C,KAAA,EAA3C,OAAM,iCAAgC,GAAA,MAAA,EAAA,CAAA,CAAA,GAAA,CAAA;EAI/C,GAAA,IAAA,CAAA,CAAA,GAAA,GAAA,IAAA,EAAA,GAAA,EA4EW,GAAA,EA5ED,IAAG,OAAM,GAAA,CACjB,EA0EM,OA1EN,IA0EM,CAxEI,EAAA,CAAA,KADR,EAAA,GAAA,EAwEM,OAAA;;GAtEA,SAAA;GAAJ,KAAI;GACJ,OAAK,EAAA,CAAC,qCAAmC,EAAA,yBACN,EAAA,MAAI,SAAQ,CAAA,CAAA;GAC9C,OAAK,GAAE,EAAA,CAAA,CAAa;;GAEZ,EAAA,MAAI,cAAf,EAAA,GAAA,EA4BM,OA5BN,IA4BM;IA1BI,EAAA,MAAI,YADZ,EAAA,GAAA,EAMQ,QAAA;;KAJN,OAAK,EAAA,CAAC,qCAAmC,EAAA,uBACR,EAAA,MAAkB,CAAA,CAAA;KAClD,SAAK,AAAA,EAAA,OAAA,GAAA,MAAO,GAAgB,GAAA,CAAA,MAAA,CAAA;KAC5B,OAAO,EAAA,QAAkB,6BAAA;;IAE5B,EAUE,SAAA;KATI,SAAA;KAAJ,KAAI;KACJ,MAAK;KACL,IAAG;KACH,OAAM;KACL,OAAO,EAAA;KACP,SAAK,AAAA,EAAA,QAAA,MAAE,EAAe,EAAO,OAA4B,KAAK;KAC/D,cAAa;KACZ,aAAa,EAAA,MAAI;KACjB,SAAK,AAAA,EAAA,OAAA,QAAN,CAAA,GAAW,CAAA,MAAA,CAAA;;IAGL,EAAA,SADR,EAAA,GAAA,EAQS,UAAA;;KANP,MAAK;KACL,OAAM;KACL,SAAK,AAAA,EAAA,OAAA,GAAA,MAAO,GAAiB,GAAA,CAAA,MAAA,CAAA;KAC9B,cAAW;IAEX,GAAA,CAAA,GAAA,AAAA,EAAA,OAAA,CAAA,EAAiC,KAAA,EAA9B,OAAM,oBAAmB,GAAA,MAAA,EAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;;GAIhC,EA8BK,MA9BL,GA8BK,CA7BO,EAAA,MAAI,WAAd,EAAA,GAAA,EAEK,MAFL,IAEK,CADH,EAAoE,GAAA;IAA5D,MAAK;IAAO,OAAM;IAAqB,OAAM;GAEvD,CAAA,CAAA,CAAA,MAAA,EAAA,GAAA,EAyBW,GAAA,EAAA,KAAA,EAAA,GAAA,EAxBT,EAAA,EAAA,GAAA,EAoBK,GAAA,MAAA,EAnBkB,EAAA,QAAb,GAAK,OADf,EAAA,GAAA,EAoBK,MAAA;IAlBF,KAAK,EAAI,SAAK,MAAU;IACzB,OAAK,EAAA,CAAC,sBAAoB,EAAA,uBACO,EAAI,SAAS,EAAW,EAAI,KAAK,EAAA,CAAA,CAAA;IAClE,UAAS;IACR,UAAK,MAAE,EAAa,CAAG;IACvB,YAAO,MAAE,GAAgB,GAAQ,CAAG;;IAG7B,EAAA,MAAI,YAAY,EAAI,SAD5B,EAAA,GAAA,EAIQ,QAAA;;KAFN,OAAK,EAAA,CAAC,cAAY,EAAA,uBACe,EAAW,EAAI,KAAK,EAAA,CAAA,CAAA;;IAE9C,EAAI,QAAb,EAAA,GAAA,EAAuD,KAAA;;KAApC,OAAK,EAAA,CAAC,SAAgB,EAAI,IAAI,CAAA;;IACjD,EAIQ,QAAA;KAHN,OAAK,EAAA,CAAC,mBAAiB,EAAA,cACC,EAAA,MAAI,aAAY,CAAA,CAAA;KACxC,WAAQ,GAAU,EAAI,KAAK;;cAGrB,GAAA,GAAA,IAAA,EAAA,MAAgB,WAAM,KAAhC,EAAA,GAAA,EAEK,MAFL,GAA2E,iBAE3E,KAAA,EAAA,IAAA,EAAA,CAAA,GAAA,EAAA,EAAA,CAAA;GAGO,EAAA,MAAI,YAAf,EAAA,GAAA,EAGM,OAHN,GAGM,CAFU,EAAA,MAAI,aAAa,EAAA,MAAU,SAAM,KAA/C,EAAA,GAAA,EAA6F,GAAA;;IAAxC,OAAM;IAAS,SAAA;IAAS,SAAO;GACpF,CAAA,KAAA,EAAA,IAAA,EAAA,GAAA,EAAqD,GAAA;IAA7C,OAAM;IAAK,MAAK;IAAW,SAAO"}

package/dist/admins-components28.js

@@ -1,7 +1,7 @@
-import './src/styles/components/dropdown-select.scss_vue_type_style_index_0_src_true_lang.css';
-import e from "./admins-components26.js";
+import './styles/components/dropdown-select.scss_vue_type_style_index_0_src_true_lang.css';
+import e, { dropdownSelectConfigDefaults as t } from "./admins-components26.js";
 /* empty css                    */
 //#region src/components/DropdownSelect.vue
-var t = e;
+var n = e;
 //#endregion
-export { t as default };
+export { n as default, t as dropdownSelectConfigDefaults };

package/dist/admins-components28.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components28.js","names":[],"sources":["../src/components/DropdownSelect.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownSelectConfig {\n  placeholder?: string\n  filterable?: boolean\n  filterPlaceholder?: string\n  clearable?: boolean\n  textEllipsis?: boolean\n  multiple?: boolean\n  lazy?: boolean\n  size?: ControlSize\n  loading?: boolean\n  highlight?: boolean\n  disabled?: boolean\n}\n\nexport const dropdownSelectConfigDefaults: DropdownSelectConfig = {\n  placeholder: 'Válassz...',\n  filterable: true,\n  filterPlaceholder: 'Kezdj el gépelni...',\n  clearable: true,\n  textEllipsis: true,\n  multiple: false,\n  lazy: false,\n  loading: false,\n  size: 'normal' as ControlSize,\n  highlight: true,\n  disabled: false,\n}\n\nexport interface DropdownOption {\n  icon?: string\n  value?: string\n  label: string\n  callback?: () => void\n}\n\nexport interface DropdownSelectProps {\n  modelValue?: DropdownOption | DropdownOption[] | string | string[] | null\n  options: DropdownOption[]\n  config?: DropdownSelectConfig\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, watch, nextTick, onMounted, onBeforeUnmount } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { ControlSize } from '@/types/types'\nimport Loader from '@/components/Loader.vue'\n\nconst props = withDefaults(defineProps<DropdownSelectProps>(), {\n  modelValue: null,\n  config: () => ({ ...dropdownSelectConfigDefaults }),\n})\n\nconst cfg = computed(() => ({ ...dropdownSelectConfigDefaults, ...props.config }))\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: DropdownOption | DropdownOption[] | null]\n  'filter-input': [filterText: string]\n}>()\n\nconst isOpen = ref(false)\nconst filterText = ref('')\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst filterInputRef = ref<HTMLInputElement | null>(null)\nconst buffer = ref<DropdownOption[]>([])\nconst selection = ref<DropdownOption[]>(normalizeToOptions(props.modelValue, props.options))\n\n\nfunction normalizeToOptions(\n  val: DropdownOption | DropdownOption[] | string | string[] | null | undefined,\n  options: DropdownOption[],\n): DropdownOption[] {\n  if (val == null) return []\n  const arr = Array.isArray(val) ? val : [val]\n  return arr\n    .map((entry): DropdownOption | null => {\n      if (entry == null) return null\n      if (typeof entry === 'object' && 'label' in entry) {\n        return entry as DropdownOption\n      }\n      if (typeof entry === 'string') {\n        const found = options.find((o) => o.value === entry)\n        return found ?? { value: entry, label: entry }\n      }\n      return null\n    })\n    .filter((o): o is DropdownOption => o !== null)\n}\n\nwatch(\n  () => [props.modelValue, props.options],\n  ([v]) => {\n    selection.value = normalizeToOptions(v as typeof props.modelValue, props.options)\n  },\n)\n\nwatch(isOpen, (open) => {\n  if (open) {\n    filterText.value = ''\n    if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n    if (cfg.value.lazy) buffer.value = [...selection.value]\n  }\n})\n\nfunction onFilterInput(text: string) {\n  filterText.value = text\n  emit('filter-input', text)\n  //debouncedEmit(text)\n}\n\n/* const debouncedEmit = debounce((raw: string) => {\n  emit('filter-input', raw)\n}) */\n\n// Display\nconst selectedLabel = computed(() => {\n  if (selection.value.length === 0) return null\n  if (!cfg.value.multiple) {\n    const sel = selection.value[0]\n    // Prefer the label from the live options list, fall back to the stored label\n    return props.options.find((o) => o.value === sel?.value)?.label ?? sel?.label ?? null\n  }\n  if (selection.value.length > 2) return `${selection.value.length} kiválasztva`\n  return selection.value\n    .map((sel) => props.options.find((o) => o.value === sel.value)?.label ?? sel.label ?? sel.value)\n    .join(', ')\n})\n\nconst filteredOptions = computed(() => {\n  const q = filterText.value.toLowerCase()\n  return q ? props.options.filter((o) => o.label.toLowerCase().includes(q)) : props.options\n})\n\nfunction escapeHtml(str: string) {\n  return str.replace(\n    /[&<>\"']/g,\n    (m) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '\"': '&quot;', \"'\": '&#39;' })[m]!,\n  )\n}\n\nfunction highlight(label: string) {\n  const q = filterText.value.trim()\n  if (!q || !cfg.value.highlight) return escapeHtml(label)\n\n  const safeLabel = escapeHtml(label)\n  const safeQ = escapeHtml(q)\n\n  const re = new RegExp(safeQ.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&'), 'ig')\n  return safeLabel.replace(re, (m) => `<mark class=\"ds-option__highlight\">${m}</mark>`)\n}\n\nconst selectableOptions = computed(() => {\n  return filteredOptions.value.filter((o) => o.value)\n})\n\nconst allOptionsSelected = computed(() => {\n  if (selectableOptions.value.length === 0) return false\n  const currentList = cfg.value.lazy && isOpen.value ? buffer.value : selection.value\n  return selectableOptions.value.every((o) => o.value && currentList.some((s) => s.value === o.value))\n})\n\nfunction isSelected(value: string): boolean {\n  const list = cfg.value.lazy && isOpen.value ? buffer : selection\n  return list.value.some((s) => s.value === value)\n}\n\nfunction toggleAllOptions() {\n  const currentList = cfg.value.lazy && isOpen.value ? buffer : selection\n  const selectableOpts = selectableOptions.value.filter((o) => o.value)\n\n  if (allOptionsSelected.value) {\n    const selectableValues = new Set(selectableOpts.map((o) => o.value as string))\n    currentList.value = currentList.value.filter((s) => !selectableValues.has(s.value ?? ''))\n  } else {\n    const existingValues = new Set(currentList.value.map((s) => s.value))\n    const toAdd = selectableOpts.filter((o) => !existingValues.has(o.value as string))\n    currentList.value = [...currentList.value, ...toAdd]\n  }\n\n  if (!cfg.value.lazy) {\n    emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n  }\n}\n\n// Actions\nfunction toggleList(list: DropdownOption[], opt: DropdownOption): DropdownOption[] {\n  const idx = list.findIndex((s) => s.value === opt.value)\n  return idx >= 0 ? list.filter((_, i) => i !== idx) : [...list, opt]\n}\n\nfunction selectOption(opt: DropdownOption) {\n  if (opt.callback) {\n    opt.callback()\n    isOpen.value = false\n    return\n  }\n\n  const value = opt.value\n  if (!value) return\n\n  if (cfg.value.multiple) {\n    if (cfg.value.lazy) {\n      buffer.value = toggleList(buffer.value, opt)\n    } else {\n      selection.value = toggleList(selection.value, opt)\n      emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n    }\n  } else {\n    selection.value = [opt]\n    emit('update:modelValue', opt)\n    isOpen.value = false\n  }\n}\n\nfunction confirm() {\n  if (cfg.value.lazy) {\n    selection.value = [...buffer.value]\n    emit('update:modelValue', buffer.value.length > 0 ? [...buffer.value] : null)\n  }\n  isOpen.value = false\n}\n\nfunction clear() {\n  if (cfg.value.lazy) {\n    buffer.value = []\n  } else {\n    selection.value = []\n    emit('update:modelValue', null)\n  }\n}\n\nfunction onOptionKeydown(e: KeyboardEvent, opt: DropdownOption) {\n  if (e.key === ' ') {\n    e.preventDefault()\n    selectOption(opt)\n  } else if (e.key === 'Enter') {\n    e.preventDefault()\n    confirm()\n  }\n}\n\nfunction onClickOutside(e: MouseEvent) {\n  if (wrapperRef.value && !wrapperRef.value.contains(e.target as Node)) isOpen.value = false\n}\n\nonMounted(() => document.addEventListener('mousedown', onClickOutside))\nonBeforeUnmount(() => {\n  document.removeEventListener('mousedown', onClickOutside)\n})\n\nfunction toggleOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = !isOpen.value\n  if (isOpen.value) {\n    if (cfg.value.filterable) {\n      filterText.value = ''\n      emit('filter-input', '')\n    }\n  }\n}\n\nfunction clearInput() {\n  if (cfg.value.disabled) return\n  selection.value = []\n  emit('update:modelValue', null)\n  isOpen.value = false\n}\n\nfunction focusAndOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = true\n  if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n}\n\nfunction handleFilterClear() {\n  filterText.value = ''\n  emit('filter-input', '')\n}\n\ndefineExpose({ focusAndOpen })\n</script>\n\n<template>\n  <div class=\"ac-component\">\n    <div ref=\"wrapperRef\" class=\"c-wrapper ds-wrapper\">\n      <div\n        class=\"c-input-row pointer\"\n        :class=\"{\n          'c-input-row--sm': cfg.size === 'small',\n          'c-input-row--lg': cfg.size === 'large',\n          'c-input-row--disabled': cfg.disabled,\n        }\"\n        :aria-disabled=\"cfg.disabled || undefined\"\n        @click=\"toggleOpen()\"\n      >\n        <span v-if=\"selectedLabel\" class=\"c-truncate ds-value\">{{ selectedLabel }}</span>\n        <span v-else class=\"c-placeholder\">{{ cfg.placeholder }}</span>\n        <button\n          v-if=\"cfg.clearable && selection.length > 0\"\n          type=\"button\"\n          class=\"c-icon-btn c-icon-btn--clear ds-clear-btn\"\n          @click.stop=\"clearInput()\"\n          aria-label=\"Törlés\"\n        >\n          <i class=\"fa-solid fa-fw fa-xmark\"></i>\n        </button>\n        <span\n          class=\"c-icon-btn c-icon-btn--chevron mr-2\"\n          :class=\"{ 'c-icon-btn--chevron-open': isOpen }\"\n        >\n          <i class=\"fa-solid fa-fw fa-chevron-down\"></i>\n        </span>\n      </div>\n\n      <div\n        v-if=\"isOpen\"\n        class=\"c-dropdown ds-dropdown ac-component\"\n        :class=\"{ 'ds-dropdown--multiple': cfg.multiple }\"\n      >\n        <div v-if=\"cfg.filterable\" class=\"ds-filter\">\n          <span\n            v-if=\"cfg.multiple\"\n            class=\"c-checkbox ds-select-all-checkbox\"\n            :class=\"{ 'c-checkbox--checked': allOptionsSelected }\"\n            @click.stop=\"toggleAllOptions()\"\n            :title=\"allOptionsSelected ? 'Összes kijelölés törlése' : 'Összes kijelölése'\"\n          ></span>\n          <input\n            ref=\"filterInputRef\"\n            type=\"text\"\n            id=\"ds-filter-input\"\n            class=\"c-focus ds-filter-input\"\n            :value=\"filterText\"\n            @input=\"onFilterInput(($event.target as HTMLInputElement).value)\"\n            autocomplete=\"off\"\n            :placeholder=\"cfg.filterPlaceholder\"\n            @click.stop\n          />\n          <button\n            v-if=\"filterText\"\n            type=\"button\"\n            class=\"c-icon-btn c-icon-btn--clear ds-filter-clear\"\n            @click.stop=\"handleFilterClear()\"\n            aria-label=\"Szűrők törlése\"\n          >\n            <i class=\"fa-solid fa-xmark\"></i>\n          </button>\n        </div>\n\n        <ul class=\"ds-options c-scroll\">\n          <li v-if=\"cfg.loading\" class=\"ds-option ds-option--loading\">\n            <Loader size=\"2rem\" color=\"var(--neutral-300)\" class=\"m-auto p-3\" />\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(opt, idx) in filteredOptions\"\n              :key=\"opt.value ?? `cb-${idx}`\"\n              class=\"d-option ds-option\"\n              :class=\"{ 'ds-option--selected': opt.value && isSelected(opt.value) }\"\n              tabindex=\"0\"\n              @click=\"selectOption(opt)\"\n              @keydown=\"onOptionKeydown($event, opt)\"\n            >\n              <span\n                v-if=\"cfg.multiple && opt.value\"\n                class=\"c-checkbox\"\n                :class=\"{ 'c-checkbox--checked': isSelected(opt.value) }\"\n              ></span>\n              <i v-if=\"opt.icon\" class=\"fa-fw\" :class=\"opt.icon\"></i>\n              <span\n                class=\"d-option__label\"\n                :class=\"{ 'c-truncate': cfg.textEllipsis }\"\n                v-html=\"highlight(opt.label)\"\n              ></span>\n            </li>\n            <li v-if=\"filteredOptions.length === 0\" class=\"ds-option ds-option--empty\">\n              Nincs találat\n            </li>\n          </template>\n        </ul>\n\n        <div v-if=\"cfg.multiple || (cfg.clearable && selection.length > 0)\" class=\"c-footer\">\n          <Button v-if=\"cfg.clearable\" label=\"Törlés\" outline @click=\"clear\" />\n          <Button v-if=\"cfg.multiple\" label=\"OK\" type=\"success\" @click=\"confirm\" />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":""}
+{"version":3,"file":"admins-components28.js","names":[],"sources":["../src/components/DropdownSelect.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownSelectConfig {\n  placeholder?: string\n  filterable?: boolean\n  filterPlaceholder?: string\n  clearable?: boolean\n  textEllipsis?: boolean\n  multiple?: boolean\n  lazy?: boolean\n  size?: ControlSize\n  loading?: boolean\n  highlight?: boolean\n  disabled?: boolean\n}\n\nexport const dropdownSelectConfigDefaults: DropdownSelectConfig = {\n  placeholder: 'Válassz...',\n  filterable: true,\n  filterPlaceholder: 'Kezdj el gépelni...',\n  clearable: true,\n  textEllipsis: true,\n  multiple: false,\n  lazy: false,\n  loading: false,\n  size: 'normal' as ControlSize,\n  highlight: true,\n  disabled: false,\n}\n\nexport interface DropdownOption {\n  icon?: string\n  value?: string\n  label: string\n  callback?: () => void\n}\n\nexport interface DropdownSelectProps {\n  modelValue?: DropdownOption | DropdownOption[] | string | string[] | null\n  options: DropdownOption[]\n  config?: DropdownSelectConfig\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, computed, watch, nextTick } from 'vue'\nimport Button from '@/components/Button.vue'\nimport type { ControlSize } from '@/types/types'\nimport Loader from '@/components/Loader.vue'\nimport { useDropdownAnchor } from '@/composables/useDropdownAnchor'\n\nconst props = withDefaults(defineProps<DropdownSelectProps>(), {\n  modelValue: null,\n  config: () => ({ ...dropdownSelectConfigDefaults }),\n})\n\nconst cfg = computed(() => ({ ...dropdownSelectConfigDefaults, ...props.config }))\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: DropdownOption | DropdownOption[] | null]\n  'filter-input': [filterText: string]\n}>()\n\nconst filterText = ref('')\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst dropdownRef = ref<HTMLElement | null>(null)\nconst filterInputRef = ref<HTMLInputElement | null>(null)\nconst buffer = ref<DropdownOption[]>([])\nconst selection = ref<DropdownOption[]>(normalizeToOptions(props.modelValue, props.options))\n\nconst { isOpen, dropdownStyle } = useDropdownAnchor(wrapperRef, dropdownRef, {\n  extraStyle: (rect) => ({\n    minWidth: `${rect.width}px`,\n    maxWidth: `${rect.width * 1.5}px`,\n  }),\n})\n\n\nfunction normalizeToOptions(\n  val: DropdownOption | DropdownOption[] | string | string[] | null | undefined,\n  options: DropdownOption[],\n): DropdownOption[] {\n  if (val == null) return []\n  const arr = Array.isArray(val) ? val : [val]\n  return arr\n    .map((entry): DropdownOption | null => {\n      if (entry == null) return null\n      if (typeof entry === 'object' && 'label' in entry) {\n        return entry as DropdownOption\n      }\n      if (typeof entry === 'string') {\n        const found = options.find((o) => o.value === entry)\n        return found ?? { value: entry, label: entry }\n      }\n      return null\n    })\n    .filter((o): o is DropdownOption => o !== null)\n}\n\nwatch(\n  () => [props.modelValue, props.options],\n  ([v]) => {\n    selection.value = normalizeToOptions(v as typeof props.modelValue, props.options)\n  },\n)\n\nwatch(isOpen, (open) => {\n  if (open) {\n    filterText.value = ''\n    if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n    if (cfg.value.lazy) buffer.value = [...selection.value]\n  }\n})\n\nfunction onFilterInput(text: string) {\n  filterText.value = text\n  emit('filter-input', text)\n}\n\nconst selectedLabel = computed(() => {\n  if (selection.value.length === 0) return null\n  if (!cfg.value.multiple) {\n    const sel = selection.value[0]\n\n    return props.options.find((o) => o.value === sel?.value)?.label ?? sel?.label ?? null\n  }\n  if (selection.value.length > 2) return `${selection.value.length} kiválasztva`\n  return selection.value\n    .map((sel) => props.options.find((o) => o.value === sel.value)?.label ?? sel.label ?? sel.value)\n    .join(', ')\n})\n\nconst filteredOptions = computed(() => {\n  const q = filterText.value.toLowerCase()\n  return q ? props.options.filter((o) => o.label.toLowerCase().includes(q)) : props.options\n})\n\nfunction escapeHtml(str: string) {\n  return str.replace(\n    /[&<>\"']/g,\n    (m) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '\"': '&quot;', \"'\": '&#39;' })[m]!,\n  )\n}\n\nfunction highlight(label: string) {\n  const q = filterText.value.trim()\n  if (!q || !cfg.value.highlight) return escapeHtml(label)\n\n  const safeLabel = escapeHtml(label)\n  const safeQ = escapeHtml(q)\n\n  const re = new RegExp(safeQ.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&'), 'ig')\n  return safeLabel.replace(re, (m) => `<mark class=\"ds-option__highlight\">${m}</mark>`)\n}\n\nconst selectableOptions = computed(() => {\n  return filteredOptions.value.filter((o) => o.value)\n})\n\nconst allOptionsSelected = computed(() => {\n  if (selectableOptions.value.length === 0) return false\n  const currentList = cfg.value.lazy && isOpen.value ? buffer.value : selection.value\n  return selectableOptions.value.every((o) => o.value && currentList.some((s) => s.value === o.value))\n})\n\nfunction isSelected(value: string): boolean {\n  const list = cfg.value.lazy && isOpen.value ? buffer : selection\n  return list.value.some((s) => s.value === value)\n}\n\nfunction toggleAllOptions() {\n  const currentList = cfg.value.lazy && isOpen.value ? buffer : selection\n  const selectableOpts = selectableOptions.value.filter((o) => o.value)\n\n  if (allOptionsSelected.value) {\n    const selectableValues = new Set(selectableOpts.map((o) => o.value as string))\n    currentList.value = currentList.value.filter((s) => !selectableValues.has(s.value ?? ''))\n  } else {\n    const existingValues = new Set(currentList.value.map((s) => s.value))\n    const toAdd = selectableOpts.filter((o) => !existingValues.has(o.value as string))\n    currentList.value = [...currentList.value, ...toAdd]\n  }\n\n  if (!cfg.value.lazy) {\n    emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n  }\n}\n\nfunction toggleList(list: DropdownOption[], opt: DropdownOption): DropdownOption[] {\n  const idx = list.findIndex((s) => s.value === opt.value)\n  return idx >= 0 ? list.filter((_, i) => i !== idx) : [...list, opt]\n}\n\nfunction selectOption(opt: DropdownOption) {\n  if (opt.callback) {\n    opt.callback()\n    isOpen.value = false\n    return\n  }\n\n  const value = opt.value\n  if (!value) return\n\n  if (cfg.value.multiple) {\n    if (cfg.value.lazy) {\n      buffer.value = toggleList(buffer.value, opt)\n    } else {\n      selection.value = toggleList(selection.value, opt)\n      emit('update:modelValue', selection.value.length > 0 ? [...selection.value] : null)\n    }\n  } else {\n    selection.value = [opt]\n    emit('update:modelValue', opt)\n    isOpen.value = false\n  }\n}\n\nfunction confirm() {\n  if (cfg.value.lazy) {\n    selection.value = [...buffer.value]\n    emit('update:modelValue', buffer.value.length > 0 ? [...buffer.value] : null)\n  }\n  isOpen.value = false\n}\n\nfunction clear() {\n  if (cfg.value.lazy) {\n    buffer.value = []\n  } else {\n    selection.value = []\n    emit('update:modelValue', null)\n  }\n}\n\nfunction onOptionKeydown(e: KeyboardEvent, opt: DropdownOption) {\n  if (e.key === ' ') {\n    e.preventDefault()\n    selectOption(opt)\n  } else if (e.key === 'Enter') {\n    e.preventDefault()\n    confirm()\n  }\n}\n\nfunction toggleOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = !isOpen.value\n  if (isOpen.value) {\n    if (cfg.value.filterable) {\n      filterText.value = ''\n      emit('filter-input', '')\n    }\n  }\n}\n\nfunction clearInput() {\n  if (cfg.value.disabled) return\n  selection.value = []\n  emit('update:modelValue', null)\n  isOpen.value = false\n}\n\nfunction focusAndOpen() {\n  if (cfg.value.disabled) return\n  isOpen.value = true\n  if (cfg.value.filterable) nextTick(() => filterInputRef.value?.focus())\n}\n\nfunction handleFilterClear() {\n  filterText.value = ''\n  emit('filter-input', '')\n}\n\ndefineExpose({ focusAndOpen })\n</script>\n\n<template>\n  <div class=\"ac-component\">\n    <div ref=\"wrapperRef\" class=\"c-wrapper ds-wrapper\">\n      <div\n        class=\"c-input-row pointer\"\n        :class=\"{\n          'c-input-row--sm': cfg.size === 'small',\n          'c-input-row--lg': cfg.size === 'large',\n          'c-input-row--disabled': cfg.disabled,\n        }\"\n        :aria-disabled=\"cfg.disabled || undefined\"\n        @click=\"toggleOpen()\"\n      >\n        <span v-if=\"selectedLabel\" class=\"c-truncate ds-value\">{{ selectedLabel }}</span>\n        <span v-else class=\"c-placeholder\">{{ cfg.placeholder }}</span>\n        <button\n          v-if=\"cfg.clearable && selection.length > 0\"\n          type=\"button\"\n          class=\"c-icon-btn c-icon-btn--clear ds-clear-btn\"\n          @click.stop=\"clearInput()\"\n          aria-label=\"Törlés\"\n        >\n          <i class=\"fa-solid fa-fw fa-xmark\"></i>\n        </button>\n        <span\n          class=\"c-icon-btn c-icon-btn--chevron mr-2\"\n          :class=\"{ 'c-icon-btn--chevron-open': isOpen }\"\n        >\n          <i class=\"fa-solid fa-fw fa-chevron-down\"></i>\n        </span>\n      </div>\n    </div>\n    <Teleport to=\"body\">\n      <div class=\"ac-component\">\n        <div\n          v-if=\"isOpen\"\n          ref=\"dropdownRef\"\n          class=\"c-dropdown ds-dropdown ds-wrapper\"\n          :class=\"{ 'ds-dropdown--multiple': cfg.multiple }\"\n          :style=\"dropdownStyle\"\n        >\n        <div v-if=\"cfg.filterable\" class=\"ds-filter\">\n          <span\n            v-if=\"cfg.multiple\"\n            class=\"c-checkbox ds-select-all-checkbox\"\n            :class=\"{ 'c-checkbox--checked': allOptionsSelected }\"\n            @click.stop=\"toggleAllOptions()\"\n            :title=\"allOptionsSelected ? 'Összes kijelölés törlése' : 'Összes kijelölése'\"\n          ></span>\n          <input\n            ref=\"filterInputRef\"\n            type=\"text\"\n            id=\"ds-filter-input\"\n            class=\"c-focus ds-filter-input\"\n            :value=\"filterText\"\n            @input=\"onFilterInput(($event.target as HTMLInputElement).value)\"\n            autocomplete=\"off\"\n            :placeholder=\"cfg.filterPlaceholder\"\n            @click.stop\n          />\n          <button\n            v-if=\"filterText\"\n            type=\"button\"\n            class=\"c-icon-btn c-icon-btn--clear ds-filter-clear\"\n            @click.stop=\"handleFilterClear()\"\n            aria-label=\"Szűrők törlése\"\n          >\n            <i class=\"fa-solid fa-xmark\"></i>\n          </button>\n        </div>\n\n        <ul class=\"ds-options c-scroll\">\n          <li v-if=\"cfg.loading\" class=\"ds-option ds-option--loading\">\n            <Loader size=\"2rem\" color=\"var(--neutral-300)\" class=\"m-auto p-3\" />\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(opt, idx) in filteredOptions\"\n              :key=\"opt.value ?? `cb-${idx}`\"\n              class=\"d-option ds-option\"\n              :class=\"{ 'ds-option--selected': opt.value && isSelected(opt.value) }\"\n              tabindex=\"0\"\n              @click=\"selectOption(opt)\"\n              @keydown=\"onOptionKeydown($event, opt)\"\n            >\n              <span\n                v-if=\"cfg.multiple && opt.value\"\n                class=\"c-checkbox\"\n                :class=\"{ 'c-checkbox--checked': isSelected(opt.value) }\"\n              ></span>\n              <i v-if=\"opt.icon\" class=\"fa-fw\" :class=\"opt.icon\"></i>\n              <span\n                class=\"d-option__label\"\n                :class=\"{ 'c-truncate': cfg.textEllipsis }\"\n                v-html=\"highlight(opt.label)\"\n              ></span>\n            </li>\n            <li v-if=\"filteredOptions.length === 0\" class=\"ds-option ds-option--empty\">\n              Nincs találat\n            </li>\n          </template>\n        </ul>\n        <div v-if=\"cfg.multiple\" class=\"c-footer\">\n          <Button v-if=\"cfg.clearable && selection.length > 0\" label=\"Törlés\" outline @click=\"clear\" />\n          <Button label=\"OK\" type=\"success\" @click=\"confirm\" />\n        </div>\n        </div>\n      </div>\n    </Teleport>\n  </div>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":""}

package/dist/admins-components29.js

@@ -2,7 +2,7 @@ import { sizeToClass as e } from "./admins-components4.js";
 import { useDropdownAnchor as t } from "./admins-components12.js";
 import { Fragment as n, Teleport as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, defineComponent as c, normalizeClass as l, normalizeStyle as u, openBlock as d, ref as f, renderList as p, toDisplayString as m, unref as h, vShow as g, withDirectives as _ } from "vue";
 //#region src/components/DropdownMenu.vue?vue&type=script&setup=true&lang.ts
-var v = ["aria-label"], y = { class: "ac-component" }, b = { class: "ds-options c-scroll" }, x = ["onClick", "aria-label"], S = /* @__PURE__ */ c({
+var v = ["aria-label"], y = { class: "ac-component" }, b = { class: "ds-options c-scroll" }, x = ["onClick", "aria-label"], S = /*@__PURE__*/ c({
 	__name: "DropdownMenu",
 	props: {
 		size: { default: "normal" },