admins-components 9.0.76 → 9.0.77

package/dist/admins-components26.js

@@ -1,21 +1,21 @@
 import e from "./admins-components6.js";
 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 ee, defineComponent as u, nextTick as d, normalizeClass as f, normalizeStyle as te, openBlock as p, ref as m, renderList as h, toDisplayString as g, unref as _, watch as v, withModifiers as y } from "vue";
+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 ne = { class: "ac-component" }, b = ["aria-disabled"], x = {
+var x = { class: "ac-component" }, S = ["aria-disabled"], C = {
 	key: 0,
 	class: "c-truncate ds-value"
-}, S = {
+}, te = {
 	key: 1,
 	class: "c-placeholder"
-}, re = { class: "ac-component" }, ie = {
+}, ne = { class: "ac-component" }, re = {
 	key: 0,
 	class: "ds-filter"
-}, ae = ["title"], C = ["value", "placeholder"], w = { class: "ds-options c-scroll" }, T = {
+}, w = ["title"], T = ["value", "placeholder"], E = { class: "ds-options c-scroll" }, ie = {
 	key: 0,
 	class: "ds-option ds-option--loading"
-}, oe = ["onClick", "onKeydown"], E = ["innerHTML"], D = {
+}, ae = ["onClick", "onKeydown"], oe = ["innerHTML"], D = {
 	key: 0,
 	class: "ds-option ds-option--empty"
 }, O = {
@@ -33,7 +33,7 @@ var ne = { class: "ac-component" }, b = ["aria-disabled"], x = {
 	size: "normal",
 	highlight: !0,
 	disabled: !1
-}, A = /*@__PURE__*/ u({
+}, A = /*@__PURE__*/ d({
 	__name: "DropdownSelect",
 	props: {
 		modelValue: { default: null },
@@ -41,40 +41,40 @@ var ne = { class: "ac-component" }, b = ["aria-disabled"], x = {
 		config: { default: () => ({ ...k }) }
 	},
 	emits: ["update:modelValue", "filter-input"],
-	setup(u, { expose: A, emit: se }) {
-		let j = u, M = a(() => ({
+	setup(d, { expose: A, emit: j }) {
+		let M = d, N = a(() => ({
 			...k,
-			...j.config
-		})), N = se, P = m(""), F = m(null), I = m(null), L = m(null), R = m([]), z = m(H(j.modelValue, j.options)), { isOpen: B, dropdownStyle: V } = t(F, I, { extraStyle: (e) => ({
+			...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 H(e, t) {
+		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);
 		}
-		v(() => [j.modelValue, j.options], ([e]) => {
-			z.value = H(e, j.options);
-		}), v(B, (e) => {
-			e && (P.value = "", M.value.filterable && d(() => 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 U(e) {
-			P.value = e, N("filter-input", e);
+		function W(e) {
+			F.value = e, P("filter-input", e);
 		}
-		let W = a(() => {
-			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(", ");
-		}), G = a(() => {
-			let e = P.value.toLowerCase();
-			return e ? j.options.filter((t) => t.label.toLowerCase().includes(e)) : j.options;
+			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 ? M.options.filter((t) => t.label.toLowerCase().includes(e)) : M.options;
 		});
-		function K(e) {
+		function q(e) {
 			return e.replace(/[&<>"']/g, (e) => ({
 				"&": "&amp;",
 				"<": "&lt;",
@@ -83,154 +83,153 @@ var ne = { class: "ac-component" }, b = ["aria-disabled"], x = {
 				"'": "&#39;"
 			})[e]);
 		}
-		function ce(e) {
-			let t = P.value.trim();
-			if (!t || !M.value.highlight) return K(e);
-			let n = K(e), r = K(t), i = new RegExp(r.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), "ig");
+		function se(e) {
+			let t = F.value.trim();
+			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 q = a(() => G.value.filter((e) => e.value)), J = a(() => {
-			if (q.value.length === 0) return !1;
-			let e = M.value.lazy && B.value ? R.value : z.value;
-			return q.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 Y(e) {
-			return (M.value.lazy && B.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 le() {
-			let e = M.value.lazy && B.value ? R : z, t = q.value.filter((e) => e.value);
-			if (J.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(), B.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), B.value = !1));
-		}
-		function Q() {
-			M.value.lazy && (z.value = [...R.value], N("update:modelValue", R.value.length > 0 ? [...R.value] : null)), B.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 $() {
-			M.value.lazy ? R.value = [] : (z.value = [], N("update:modelValue", null));
+			N.value.lazy && (B.value = [...z.value], P("update:modelValue", z.value.length > 0 ? [...z.value] : null)), V.value = !1;
+		}
+		function le() {
+			N.value.lazy ? z.value = [] : (B.value = [], P("update:modelValue", null));
 		}
 		function ue(e, t) {
-			e.key === " " ? (e.preventDefault(), Z(t)) : e.key === "Enter" && (e.preventDefault(), Q());
+			e.key === " " ? (e.preventDefault(), Q(t)) : e.key === "Enter" && (e.preventDefault(), $());
 		}
 		function de() {
-			M.value.disabled || (B.value = !B.value, B.value && M.value.filterable && (P.value = "", N("filter-input", "")));
+			N.value.disabled || (V.value = !V.value, V.value && N.value.filterable && (F.value = "", P("filter-input", "")));
 		}
 		function fe() {
-			M.value.disabled || (z.value = [], N("update:modelValue", null), B.value = !1);
+			N.value.disabled || (B.value = [], P("update:modelValue", null), V.value = !1);
 		}
 		function pe() {
-			M.value.disabled || (B.value = !0, M.value.filterable && d(() => L.value?.focus()));
+			N.value.disabled || (V.value = !0, N.value.filterable && f(() => R.value?.focus()));
 		}
 		function me() {
-			P.value = "", N("filter-input", "");
+			F.value = "", P("filter-input", "");
 		}
-		return A({ focusAndOpen: pe }), (t, a) => (p(), c("div", ne, [l("div", {
+		return A({ focusAndOpen: pe }), (t, a) => (m(), c("div", x, [l("div", {
 			ref_key: "wrapperRef",
-			ref: F,
+			ref: I,
 			class: "c-wrapper ds-wrapper"
 		}, [l("div", {
-			class: f(["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
+			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,
+			"aria-disabled": N.value.disabled || void 0,
 			onClick: a[1] ||= (e) => de()
 		}, [
-			W.value ? (p(), c("span", x, g(W.value), 1)) : (p(), c("span", S, g(M.value.placeholder), 1)),
-			M.value.clearable && z.value.length > 0 ? (p(), c("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: a[0] ||= y((e) => fe(), ["stop"]),
+				onClick: a[0] ||= b((e) => fe(), ["stop"]),
 				"aria-label": "Törlés"
 			}, [...a[6] ||= [l("i", { class: "fa-solid fa-fw fa-xmark" }, null, -1)]])) : s("", !0),
-			l("span", { class: f(["c-icon-btn c-icon-btn--chevron mr-2", { "c-icon-btn--chevron-open": _(B) }]) }, [...a[7] ||= [l("i", { class: "fa-solid fa-fw fa-chevron-down" }, null, -1)]], 2)
-		], 10, b)], 512), (p(), o(i, { to: "body" }, [l("div", re, [_(B) ? (p(), c("div", {
+			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,
 			ref_key: "dropdownRef",
-			ref: I,
-			class: f(["c-dropdown ds-dropdown ds-wrapper", { "ds-dropdown--multiple": M.value.multiple }]),
-			style: te(_(V))
+			ref: L,
+			class: p(["c-dropdown ds-dropdown ds-wrapper", { "ds-dropdown--multiple": N.value.multiple }]),
+			style: ee(v(H))
 		}, [
-			M.value.filterable ? (p(), c("div", ie, [
-				M.value.multiple ? (p(), c("span", {
+			N.value.filterable ? (m(), c("div", re, [
+				N.value.multiple ? (m(), c("span", {
 					key: 0,
-					class: f(["c-checkbox ds-select-all-checkbox", { "c-checkbox--checked": J.value }]),
-					onClick: a[2] ||= y((e) => le(), ["stop"]),
-					title: J.value ? "Összes kijelölés törlése" : "Összes kijelölése"
-				}, null, 10, ae)) : s("", !0),
+					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: P.value,
-					onInput: a[3] ||= (e) => U(e.target.value),
+					value: F.value,
+					onInput: a[3] ||= (e) => W(e.target.value),
 					autocomplete: "off",
-					placeholder: M.value.filterPlaceholder,
-					onClick: a[4] ||= y(() => {}, ["stop"])
-				}, null, 40, C),
-				P.value ? (p(), c("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: a[5] ||= y((e) => me(), ["stop"]),
+					onClick: a[5] ||= b((e) => me(), ["stop"]),
 					"aria-label": "Szűrők törlése"
 				}, [...a[8] ||= [l("i", { class: "fa-solid fa-xmark" }, null, -1)]])) : s("", !0)
 			])) : s("", !0),
-			l("ul", w, [M.value.loading ? (p(), c("li", T, [ee(n, {
+			l("ul", E, [N.value.loading ? (m(), c("li", ie, [u(n, {
 				size: "2rem",
 				color: "var(--neutral-300)",
 				class: "m-auto p-3"
-			})])) : (p(), c(r, { key: 1 }, [(p(!0), c(r, null, h(G.value, (e, t) => (p(), c("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: f(["d-option ds-option", { "ds-option--selected": e.value && Y(e.value) }]),
+				class: p(["d-option ds-option", { "ds-option--selected": e.value && X(e.value) }]),
 				tabindex: "0",
-				onClick: (t) => Z(e),
+				onClick: (t) => Q(e),
 				onKeydown: (t) => ue(t, e)
 			}, [
-				M.value.multiple && e.value ? (p(), c("span", {
+				N.value.multiple && e.value ? (m(), c("span", {
 					key: 0,
-					class: f(["c-checkbox", { "c-checkbox--checked": Y(e.value) }])
+					class: p(["c-checkbox", { "c-checkbox--checked": X(e.value) }])
 				}, null, 2)) : s("", !0),
-				e.icon ? (p(), c("i", {
+				e.icon ? (m(), c("i", {
 					key: 1,
-					class: f(["fa-fw", e.icon])
+					class: p(["fa-fw", e.icon])
 				}, null, 2)) : s("", !0),
 				l("span", {
-					class: f(["d-option__label", { "c-truncate": M.value.textEllipsis }]),
-					innerHTML: ce(e.label)
-				}, null, 10, E)
-			], 42, oe))), 128)), G.value.length === 0 ? (p(), c("li", D, " Nincs találat ")) : s("", !0)], 64))]),
-			M.value.multiple || M.value.clearable && z.value.length > 0 ? (p(), c("div", O, [M.value.clearable ? (p(), o(e, {
+					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: $
-			})) : s("", !0), M.value.multiple ? (p(), o(e, {
-				key: 1,
+				onClick: le
+			})) : s("", !0), u(e, {
 				label: "OK",
 				type: "success",
-				onClick: Q
-			})) : s("", !0)])) : s("", !0)
+				onClick: $
+			})])) : s("", !0)
 		], 6)) : s("", !0)])]))]));
 	}
 });

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 } 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  //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 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\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    </Teleport>\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":"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"}

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 } 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  //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 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\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    </Teleport>\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/styles/components/dropdown-select.scss_vue_type_style_index_0_src_true_lang.css

@@ -1 +1 @@
-.ac-component .ds-wrapper{--ds-field-padding:.375rem .5rem}.ac-component .ds-wrapper .ds-value{padding:var(--ac-input-padding);font-size:inherit;color:var(--neutral-900);flex:1;padding-right:.125rem}.ac-component .ds-wrapper .c-input-row--sm .ds-value{padding:var(--ac-input-padding-sm);padding-right:.125rem}.ac-component .ds-wrapper .c-input-row--lg .ds-value{padding:var(--ac-input-padding-lg);padding-right:.125rem}.ac-component .ds-wrapper .ds-filter{padding:var(--ac-field-padding);border-bottom:1px solid var(--neutral-100);align-items:center;gap:.5rem;display:flex;position:relative}.ac-component .ds-wrapper .ds-dropdown--multiple .ds-filter,.ac-component .ds-wrapper .ds-dropdown--multiple .ds-option{padding:var(--ds-field-padding)}.ac-component .ds-wrapper .ds-select-all-checkbox{flex-shrink:0}.ac-component .ds-wrapper .ds-filter-input{border:1px solid var(--neutral-200);width:100%;color:var(--neutral-900);border-radius:.375rem;outline:none;padding:.375rem 1.5rem .375rem .5rem;font-family:inherit;font-size:.8125rem}.ac-component .ds-wrapper .ds-filter-input::placeholder{color:var(--ac-placeholder-color)}.ac-component .ds-wrapper .ds-clear-btn{padding:0 .125rem 0 0}.ac-component .ds-wrapper .ds-filter-clear{padding:0;position:absolute;top:50%;right:1.375rem;transform:translateY(-50%)}.ac-component .ds-wrapper .ds-options{max-height:var(--ac-dropdown-max-height,18rem);margin:0;padding:.25rem 0;list-style:none;overflow-y:auto}.ac-component .ds-wrapper .ds-options .ds-option--loading{min-height:calc(var(--ac-dropdown-max-height,18rem) / 1.75);pointer-events:none;justify-content:center;align-items:center;display:flex}.ac-component .ds-wrapper .d-option{cursor:pointer;align-items:center;gap:.5rem;transition:background-color .1s;display:flex}.ac-component .ds-wrapper .d-option__label{flex:1;font-weight:500}.ac-component .ds-wrapper .dm-option{align-items:center;gap:.375em;display:flex}.ac-component .ds-wrapper .dm-option.is-disabled{opacity:.7;pointer-events:none}.ac-component .ds-wrapper .dm-trigger .c-icon-btn--chevron{color:inherit}.ac-component .ds-wrapper .ds-option{padding:var(--ac-field-padding);color:var(--neutral-800);font-size:.875rem}.ac-component .ds-wrapper .ds-option:hover{background:var(--neutral-50)}.ac-component .ds-wrapper .ds-option__highlight{background:rgba(var(--ac-color-primary-rgb), .1);color:var(--neutral-900);border-radius:.125rem}.ac-component .ds-wrapper .ds-option--selected{background:var(--neutral-100);font-weight:500}.ac-component .ds-wrapper .ds-option--empty{color:var(--neutral-400);cursor:default;font-style:italic}.ac-component .ds-wrapper .ds-option--empty:hover{background:0 0}
+.ac-component .ds-wrapper{--ds-field-padding:.375rem .5rem}.ac-component .ds-wrapper .ds-value{padding:var(--ac-input-padding);font-size:inherit;color:var(--neutral-900);flex:1;padding-right:.125rem}.ac-component .ds-wrapper .c-input-row--sm .ds-value{padding:var(--ac-input-padding-sm);padding-right:.125rem}.ac-component .ds-wrapper .c-input-row--lg .ds-value{padding:var(--ac-input-padding-lg);padding-right:.125rem}.ac-component .ds-wrapper .ds-filter{padding:var(--ac-field-padding);border-bottom:1px solid var(--neutral-100);align-items:center;gap:.5rem;display:flex;position:relative}.ac-component .ds-wrapper .ds-dropdown--multiple .ds-filter,.ac-component .ds-wrapper .ds-dropdown--multiple .ds-option{padding:var(--ds-field-padding)}.ac-component .ds-wrapper .ds-select-all-checkbox{flex-shrink:0}.ac-component .ds-wrapper .ds-filter-input{border:1px solid var(--neutral-200);width:100%;color:var(--neutral-900);border-radius:.375rem;outline:none;padding:.375rem 1.5rem .375rem .5rem;font-family:inherit;font-size:.8125rem}.ac-component .ds-wrapper .ds-filter-input::placeholder{color:var(--ac-placeholder-color)}.ac-component .ds-wrapper .ds-clear-btn{padding:0 .125rem 0 0}.ac-component .ds-wrapper .ds-filter-clear{padding:0;position:absolute;top:50%;right:1.375rem;transform:translateY(-50%)}.ac-component .ds-wrapper .ds-options{max-height:var(--ac-dropdown-max-height);margin:0;padding:.25rem 0;list-style:none;overflow-y:auto}.ac-component .ds-wrapper .ds-options .ds-option--loading{min-height:var(--ac-dropdown-max-height);pointer-events:none;justify-content:center;align-items:center;display:flex}.ac-component .ds-wrapper .d-option{cursor:pointer;align-items:center;gap:.5rem;transition:background-color .1s;display:flex}.ac-component .ds-wrapper .d-option__label{flex:1;font-weight:500}.ac-component .ds-wrapper .dm-option{align-items:center;gap:.375em;display:flex}.ac-component .ds-wrapper .dm-option.is-disabled{opacity:.7;pointer-events:none}.ac-component .ds-wrapper .dm-trigger .c-icon-btn--chevron{color:inherit}.ac-component .ds-wrapper .ds-option{padding:var(--ac-field-padding);color:var(--neutral-800);font-size:.875rem}.ac-component .ds-wrapper .ds-option:hover{background:var(--neutral-50)}.ac-component .ds-wrapper .ds-option__highlight{background:rgba(var(--ac-color-primary-rgb), .1);color:var(--neutral-900);border-radius:.125rem}.ac-component .ds-wrapper .ds-option--selected{background:var(--neutral-100);font-weight:500}.ac-component .ds-wrapper .ds-option--empty{color:var(--neutral-400);cursor:default;font-style:italic}.ac-component .ds-wrapper .ds-option--empty:hover{background:0 0}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "admins-components",
-  "version": "9.0.76",
+  "version": "9.0.77",
   "type": "module",
   "module": "./dist/admins-components.js",
   "types": "./dist/index.d.ts",