admins-components 9.0.68 → 9.0.70

package/dist/admins-components12.js

@@ -4,52 +4,62 @@ function a(e, t, n) {
 	let r = e.target, i = t?.contains(r) ?? !1, a = n?.contains(r) ?? !1;
 	return !i && !a;
 }
-function o(o, s, c = {}) {
-	let { extraStyle: l, isOutsideClick: u = a, closeOnScroll: d = !1 } = c, f = r(!1), p = r({});
-	function m() {
-		if (!o.value) return;
-		let t = o.value.getBoundingClientRect();
-		p.value = {
+function o(e, t) {
+	if (!t) return e ?? null;
+	let n = e ? Number.parseFloat(e) : NaN, r = Number.parseFloat(t);
+	return Number.isNaN(n) || n < r ? t : e;
+}
+function s(s, c, l = {}) {
+	let { extraStyle: u, isOutsideClick: d = a, closeOnScroll: f = !1, minWidth: p = "120px" } = l, m = r(!1), h = r({});
+	function g() {
+		if (!s.value) return;
+		let t = s.value.getBoundingClientRect(), n = u ? u(t) : void 0, r = o(n?.minWidth, p);
+		h.value = {
 			position: "fixed",
 			top: `${t.bottom + 2}px`,
 			left: `${t.left}px`,
 			zIndex: "10001",
-			...l ? l(t) : {}
+			...n ?? {},
+			...r ? { minWidth: r } : {}
 		}, e(() => {
-			if (!s.value || !o.value) return;
-			let e = s.value.getBoundingClientRect(), t = o.value.getBoundingClientRect(), n = window.innerHeight, r = window.innerWidth, i = e.bottom > n, a = e.right > r, c = i ? `${t.top - e.height - 2}px` : `${t.bottom + 2}px`, u = a ? `${t.right - e.width}px` : `${t.left}px`;
-			(i || a) && (p.value = {
-				position: "fixed",
-				top: c,
-				left: u,
-				zIndex: "10001",
-				...l ? l(t) : {}
-			});
+			if (!c.value || !s.value) return;
+			let e = c.value.getBoundingClientRect(), t = s.value.getBoundingClientRect(), n = window.innerHeight, r = window.innerWidth, i = e.bottom > n, a = e.right > r, l = i ? `${t.top - e.height - 2}px` : `${t.bottom + 2}px`, d = a ? `${Math.max(t.right - e.width, 0)}px` : `${t.left}px`;
+			if (i || a) {
+				let e = u ? u(t) : void 0, n = o(e?.minWidth, p);
+				h.value = {
+					position: "fixed",
+					top: l,
+					left: d,
+					zIndex: "10001",
+					...e ?? {},
+					...n ? { minWidth: n } : {}
+				};
+			}
 		});
 	}
-	function h(e) {
-		u(e, o.value, s.value) && (f.value = !1);
+	function _(e) {
+		d(e, s.value, c.value) && (m.value = !1);
 	}
-	function g() {
-		if (f.value) {
-			if (d) {
-				f.value = !1;
+	function v() {
+		if (m.value) {
+			if (f) {
+				m.value = !1;
 				return;
 			}
-			m();
+			g();
 		}
 	}
-	return i(f, (e) => {
-		e && m();
+	return i(m, (e) => {
+		e && g();
 	}), n(() => {
-		document.addEventListener("mousedown", h), window.addEventListener("scroll", g, !0), window.addEventListener("resize", g);
+		document.addEventListener("mousedown", _), window.addEventListener("scroll", v, !0), window.addEventListener("resize", v);
 	}), t(() => {
-		document.removeEventListener("mousedown", h), window.removeEventListener("scroll", g, !0), window.removeEventListener("resize", g);
+		document.removeEventListener("mousedown", _), window.removeEventListener("scroll", v, !0), window.removeEventListener("resize", v);
 	}), {
-		isOpen: f,
-		dropdownStyle: p,
-		positionDropdown: m
+		isOpen: m,
+		dropdownStyle: h,
+		positionDropdown: g
 	};
 }
 //#endregion
-export { o as useDropdownAnchor };
+export { s as useDropdownAnchor };

package/dist/admins-components12.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components12.js","names":[],"sources":["../src/composables/useDropdownAnchor.ts"],"sourcesContent":["import { ref, watch, onMounted, onBeforeUnmount, nextTick } from 'vue'\nimport type { Ref } from 'vue'\n\nexport interface UseDropdownAnchorOptions {\n  extraStyle?: (rect: DOMRect) => Record<string, string>\n  isOutsideClick?: (\n    e: MouseEvent,\n    wrapperEl: HTMLElement | null,\n    dropdownEl: HTMLElement | null,\n  ) => boolean\n  closeOnScroll?: boolean\n}\n\nexport interface UseDropdownAnchorReturn {\n  isOpen: Ref<boolean>\n  dropdownStyle: Ref<Record<string, string>>\n  positionDropdown: () => void\n}\n\nfunction defaultIsOutsideClick(\n  e: MouseEvent,\n  wrapperEl: HTMLElement | null,\n  dropdownEl: HTMLElement | null,\n): boolean {\n  const target = e.target as Node\n  const inWrapper = wrapperEl?.contains(target) ?? false\n  const inDropdown = dropdownEl?.contains(target) ?? false\n  return !inWrapper && !inDropdown\n}\n\nexport function useDropdownAnchor(\n  wrapperRef: Ref<HTMLElement | null>,\n  dropdownRef: Ref<HTMLElement | null>,\n  options: UseDropdownAnchorOptions = {},\n): UseDropdownAnchorReturn {\n  const { extraStyle, isOutsideClick = defaultIsOutsideClick, closeOnScroll = false } = options\n\n  const isOpen = ref(false)\n  const dropdownStyle = ref<Record<string, string>>({})\n\n  function positionDropdown() {\n    if (!wrapperRef.value) return\n    const rect = wrapperRef.value.getBoundingClientRect()\n    dropdownStyle.value = {\n      position: 'fixed',\n      top: `${rect.bottom + 2}px`,\n      left: `${rect.left}px`,\n      zIndex: '10001',\n      ...(extraStyle ? extraStyle(rect) : {}),\n    }\n    nextTick(() => {\n      if (!dropdownRef.value || !wrapperRef.value) return\n      const dropdownRect = dropdownRef.value.getBoundingClientRect()\n      const anchorRect = wrapperRef.value.getBoundingClientRect()\n      const viewportHeight = window.innerHeight\n      const viewportWidth = window.innerWidth\n\n      const flipY = dropdownRect.bottom > viewportHeight\n      const flipX = dropdownRect.right > viewportWidth\n\n      const top = flipY\n        ? `${anchorRect.top - dropdownRect.height - 2}px`\n        : `${anchorRect.bottom + 2}px`\n      const left = flipX\n        ? `${anchorRect.right - dropdownRect.width}px`\n        : `${anchorRect.left}px`\n\n      if (flipY || flipX) {\n        dropdownStyle.value = {\n          position: 'fixed',\n          top,\n          left,\n          zIndex: '10001',\n          ...(extraStyle ? extraStyle(anchorRect) : {}),\n        }\n      }\n    })\n  }\n\n  function onClickOutside(e: MouseEvent) {\n    if (isOutsideClick(e, wrapperRef.value, dropdownRef.value)) {\n      isOpen.value = false\n    }\n  }\n\n  function onScrollOrResize() {\n    if (!isOpen.value) return\n    if (closeOnScroll) {\n      isOpen.value = false\n      return\n    }\n    positionDropdown()\n  }\n\n  watch(isOpen, (open) => {\n    if (open) positionDropdown()\n  })\n\n  onMounted(() => {\n    document.addEventListener('mousedown', onClickOutside)\n\n    window.addEventListener('scroll', onScrollOrResize, true)\n    window.addEventListener('resize', onScrollOrResize)\n  })\n\n  onBeforeUnmount(() => {\n    document.removeEventListener('mousedown', onClickOutside)\n\n    window.removeEventListener('scroll', onScrollOrResize, true)\n    window.removeEventListener('resize', onScrollOrResize)\n  })\n\n  return { isOpen, dropdownStyle, positionDropdown }\n}\n"],"mappings":";;AAmBA,SAAS,EACP,GACA,GACA,GACS;CACT,IAAM,IAAS,EAAE,QACX,IAAY,GAAW,SAAS,CAAM,KAAK,IAC3C,IAAa,GAAY,SAAS,CAAM,KAAK;CACnD,OAAO,CAAC,KAAa,CAAC;AACxB;AAEA,SAAgB,EACd,GACA,GACA,IAAoC,CAAC,GACZ;CACzB,IAAM,EAAE,eAAY,oBAAiB,GAAuB,mBAAgB,OAAU,GAEhF,IAAS,EAAI,EAAK,GAClB,IAAgB,EAA4B,CAAC,CAAC;CAEpD,SAAS,IAAmB;EAC1B,IAAI,CAAC,EAAW,OAAO;EACvB,IAAM,IAAO,EAAW,MAAM,sBAAsB;EAQpD,AAPA,EAAc,QAAQ;GACpB,UAAU;GACV,KAAK,GAAG,EAAK,SAAS,EAAE;GACxB,MAAM,GAAG,EAAK,KAAK;GACnB,QAAQ;GACR,GAAI,IAAa,EAAW,CAAI,IAAI,CAAC;EACvC,GACA,QAAe;GACb,IAAI,CAAC,EAAY,SAAS,CAAC,EAAW,OAAO;GAC7C,IAAM,IAAe,EAAY,MAAM,sBAAsB,GACvD,IAAa,EAAW,MAAM,sBAAsB,GACpD,IAAiB,OAAO,aACxB,IAAgB,OAAO,YAEvB,IAAQ,EAAa,SAAS,GAC9B,IAAQ,EAAa,QAAQ,GAE7B,IAAM,IACR,GAAG,EAAW,MAAM,EAAa,SAAS,EAAE,MAC5C,GAAG,EAAW,SAAS,EAAE,KACvB,IAAO,IACT,GAAG,EAAW,QAAQ,EAAa,MAAM,MACzC,GAAG,EAAW,KAAK;GAEvB,CAAI,KAAS,OACX,EAAc,QAAQ;IACpB,UAAU;IACV;IACA;IACA,QAAQ;IACR,GAAI,IAAa,EAAW,CAAU,IAAI,CAAC;GAC7C;EAEJ,CAAC;CACH;CAEA,SAAS,EAAe,GAAe;EACrC,AAAI,EAAe,GAAG,EAAW,OAAO,EAAY,KAAK,MACvD,EAAO,QAAQ;CAEnB;CAEA,SAAS,IAAmB;EACrB,MAAO,OACZ;OAAI,GAAe;IACjB,EAAO,QAAQ;IACf;GACF;GACA,EAAiB;EADjB;CAEF;CAoBA,OAlBA,EAAM,IAAS,MAAS;EACtB,AAAI,KAAM,EAAiB;CAC7B,CAAC,GAED,QAAgB;EAId,AAHA,SAAS,iBAAiB,aAAa,CAAc,GAErD,OAAO,iBAAiB,UAAU,GAAkB,EAAI,GACxD,OAAO,iBAAiB,UAAU,CAAgB;CACpD,CAAC,GAED,QAAsB;EAIpB,AAHA,SAAS,oBAAoB,aAAa,CAAc,GAExD,OAAO,oBAAoB,UAAU,GAAkB,EAAI,GAC3D,OAAO,oBAAoB,UAAU,CAAgB;CACvD,CAAC,GAEM;EAAE;EAAQ;EAAe;CAAiB;AACnD"}
+{"version":3,"file":"admins-components12.js","names":[],"sources":["../src/composables/useDropdownAnchor.ts"],"sourcesContent":["import { ref, watch, onMounted, onBeforeUnmount, nextTick } from 'vue'\nimport type { Ref } from 'vue'\n\nexport interface UseDropdownAnchorOptions {\n  extraStyle?: (rect: DOMRect) => Record<string, string>\n  isOutsideClick?: (\n    e: MouseEvent,\n    wrapperEl: HTMLElement | null,\n    dropdownEl: HTMLElement | null,\n  ) => boolean\n  closeOnScroll?: boolean\n  /**\n   * Global minimum width applied to the dropdown. Defaults to `'120px'`.\n   *\n   * The global value is only applied when `extraStyle` does not request\n   * an equal-or-larger `minWidth`. So `minWidth` acts as a **floor**:\n   * dropdowns can grow bigger (via `extraStyle`), but never smaller than\n   * this value. Pass `null` to disable the floor entirely.\n   *\n   * Both the floor and any `extraStyle` `minWidth` are assumed to be\n   * `px` values.\n   */\n  minWidth?: string | null\n}\n\nexport interface UseDropdownAnchorReturn {\n  isOpen: Ref<boolean>\n  dropdownStyle: Ref<Record<string, string>>\n  positionDropdown: () => void\n}\n\nfunction defaultIsOutsideClick(\n  e: MouseEvent,\n  wrapperEl: HTMLElement | null,\n  dropdownEl: HTMLElement | null,\n): boolean {\n  const target = e.target as Node\n  const inWrapper = wrapperEl?.contains(target) ?? false\n  const inDropdown = dropdownEl?.contains(target) ?? false\n  return !inWrapper && !inDropdown\n}\n\n/**\n * Compare the global `minWidth` floor against an optional value supplied\n * by `extraStyle` and return the larger of the two (in pixels).\n *\n * Both the floor and any `extraStyle` `minWidth` are expected to be `px`\n * values (e.g. `'120px'`, `'${rect.width}px'`), so a single `parseFloat`\n * is enough.\n *\n * Returns `null` when there is no floor and `extraStyle` didn't supply\n * a `minWidth`, letting the caller skip the property entirely.\n */\nfunction pickMinWidth(extraMinWidth: string | undefined, floor: string | null): string | null {\n  if (!floor) return extraMinWidth ?? null\n  const extraPx = extraMinWidth ? Number.parseFloat(extraMinWidth) : Number.NaN\n  const floorPx = Number.parseFloat(floor)\n  if (Number.isNaN(extraPx) || extraPx < floorPx) return floor\n  return extraMinWidth!\n}\n\nexport function useDropdownAnchor(\n  wrapperRef: Ref<HTMLElement | null>,\n  dropdownRef: Ref<HTMLElement | null>,\n  options: UseDropdownAnchorOptions = {},\n): UseDropdownAnchorReturn {\n  const {\n    extraStyle,\n    isOutsideClick = defaultIsOutsideClick,\n    closeOnScroll = false,\n    minWidth = '120px',\n  } = options\n\n  const isOpen = ref(false)\n  const dropdownStyle = ref<Record<string, string>>({})\n\n  function positionDropdown() {\n    if (!wrapperRef.value) return\n    const rect = wrapperRef.value.getBoundingClientRect()\n    const extraStyleValues = extraStyle ? extraStyle(rect) : undefined\n    const effectiveMinWidth = pickMinWidth(extraStyleValues?.minWidth, minWidth)\n\n    dropdownStyle.value = {\n      position: 'fixed',\n      top: `${rect.bottom + 2}px`,\n      left: `${rect.left}px`,\n      zIndex: '10001',\n      ...(extraStyleValues ?? {}),\n      ...(effectiveMinWidth ? { minWidth: effectiveMinWidth } : {}),\n    }\n    nextTick(() => {\n      if (!dropdownRef.value || !wrapperRef.value) return\n      const dropdownRect = dropdownRef.value.getBoundingClientRect()\n      const anchorRect = wrapperRef.value.getBoundingClientRect()\n      const viewportHeight = window.innerHeight\n      const viewportWidth = window.innerWidth\n\n      // Flip vertically when the dropdown doesn't fit below the anchor.\n      const flipY = dropdownRect.bottom > viewportHeight\n\n      // Flip horizontally when the dropdown would otherwise be partially\n      // cut off by the right edge of the viewport. We anchor the\n      // dropdown's right edge to the trigger's right edge so it stays\n      // fully visible while preserving the anchor.\n      const flipX = dropdownRect.right > viewportWidth\n\n      const top = flipY\n        ? `${anchorRect.top - dropdownRect.height - 2}px`\n        : `${anchorRect.bottom + 2}px`\n      const left = flipX\n        ? `${Math.max(anchorRect.right - dropdownRect.width, 0)}px`\n        : `${anchorRect.left}px`\n\n      if (flipY || flipX) {\n        const flippedExtras = extraStyle ? extraStyle(anchorRect) : undefined\n        const flippedMinWidth = pickMinWidth(flippedExtras?.minWidth, minWidth)\n        dropdownStyle.value = {\n          position: 'fixed',\n          top,\n          left,\n          zIndex: '10001',\n          ...(flippedExtras ?? {}),\n          ...(flippedMinWidth ? { minWidth: flippedMinWidth } : {}),\n        }\n      }\n    })\n  }\n\n  function onClickOutside(e: MouseEvent) {\n    if (isOutsideClick(e, wrapperRef.value, dropdownRef.value)) {\n      isOpen.value = false\n    }\n  }\n\n  function onScrollOrResize() {\n    if (!isOpen.value) return\n    if (closeOnScroll) {\n      isOpen.value = false\n      return\n    }\n    positionDropdown()\n  }\n\n  watch(isOpen, (open) => {\n    if (open) positionDropdown()\n  })\n\n  onMounted(() => {\n    document.addEventListener('mousedown', onClickOutside)\n\n    window.addEventListener('scroll', onScrollOrResize, true)\n    window.addEventListener('resize', onScrollOrResize)\n  })\n\n  onBeforeUnmount(() => {\n    document.removeEventListener('mousedown', onClickOutside)\n\n    window.removeEventListener('scroll', onScrollOrResize, true)\n    window.removeEventListener('resize', onScrollOrResize)\n  })\n\n  return { isOpen, dropdownStyle, positionDropdown }\n}\n"],"mappings":";;AA+BA,SAAS,EACP,GACA,GACA,GACS;CACT,IAAM,IAAS,EAAE,QACX,IAAY,GAAW,SAAS,CAAM,KAAK,IAC3C,IAAa,GAAY,SAAS,CAAM,KAAK;CACnD,OAAO,CAAC,KAAa,CAAC;AACxB;AAaA,SAAS,EAAa,GAAmC,GAAqC;CAC5F,IAAI,CAAC,GAAO,OAAO,KAAiB;CACpC,IAAM,IAAU,IAAgB,OAAO,WAAW,CAAa,IAAI,KAC7D,IAAU,OAAO,WAAW,CAAK;CAEvC,OADI,OAAO,MAAM,CAAO,KAAK,IAAU,IAAgB,IAChD;AACT;AAEA,SAAgB,EACd,GACA,GACA,IAAoC,CAAC,GACZ;CACzB,IAAM,EACJ,eACA,oBAAiB,GACjB,mBAAgB,IAChB,cAAW,YACT,GAEE,IAAS,EAAI,EAAK,GAClB,IAAgB,EAA4B,CAAC,CAAC;CAEpD,SAAS,IAAmB;EAC1B,IAAI,CAAC,EAAW,OAAO;EACvB,IAAM,IAAO,EAAW,MAAM,sBAAsB,GAC9C,IAAmB,IAAa,EAAW,CAAI,IAAI,KAAA,GACnD,IAAoB,EAAa,GAAkB,UAAU,CAAQ;EAU3E,AARA,EAAc,QAAQ;GACpB,UAAU;GACV,KAAK,GAAG,EAAK,SAAS,EAAE;GACxB,MAAM,GAAG,EAAK,KAAK;GACnB,QAAQ;GACR,GAAI,KAAoB,CAAC;GACzB,GAAI,IAAoB,EAAE,UAAU,EAAkB,IAAI,CAAC;EAC7D,GACA,QAAe;GACb,IAAI,CAAC,EAAY,SAAS,CAAC,EAAW,OAAO;GAC7C,IAAM,IAAe,EAAY,MAAM,sBAAsB,GACvD,IAAa,EAAW,MAAM,sBAAsB,GACpD,IAAiB,OAAO,aACxB,IAAgB,OAAO,YAGvB,IAAQ,EAAa,SAAS,GAM9B,IAAQ,EAAa,QAAQ,GAE7B,IAAM,IACR,GAAG,EAAW,MAAM,EAAa,SAAS,EAAE,MAC5C,GAAG,EAAW,SAAS,EAAE,KACvB,IAAO,IACT,GAAG,KAAK,IAAI,EAAW,QAAQ,EAAa,OAAO,CAAC,EAAE,MACtD,GAAG,EAAW,KAAK;GAEvB,IAAI,KAAS,GAAO;IAClB,IAAM,IAAgB,IAAa,EAAW,CAAU,IAAI,KAAA,GACtD,IAAkB,EAAa,GAAe,UAAU,CAAQ;IACtE,EAAc,QAAQ;KACpB,UAAU;KACV;KACA;KACA,QAAQ;KACR,GAAI,KAAiB,CAAC;KACtB,GAAI,IAAkB,EAAE,UAAU,EAAgB,IAAI,CAAC;IACzD;GACF;EACF,CAAC;CACH;CAEA,SAAS,EAAe,GAAe;EACrC,AAAI,EAAe,GAAG,EAAW,OAAO,EAAY,KAAK,MACvD,EAAO,QAAQ;CAEnB;CAEA,SAAS,IAAmB;EACrB,MAAO,OACZ;OAAI,GAAe;IACjB,EAAO,QAAQ;IACf;GACF;GACA,EAAiB;EADjB;CAEF;CAoBA,OAlBA,EAAM,IAAS,MAAS;EACtB,AAAI,KAAM,EAAiB;CAC7B,CAAC,GAED,QAAgB;EAId,AAHA,SAAS,iBAAiB,aAAa,CAAc,GAErD,OAAO,iBAAiB,UAAU,GAAkB,EAAI,GACxD,OAAO,iBAAiB,UAAU,CAAgB;CACpD,CAAC,GAED,QAAsB;EAIpB,AAHA,SAAS,oBAAoB,aAAa,CAAc,GAExD,OAAO,oBAAoB,UAAU,GAAkB,EAAI,GAC3D,OAAO,oBAAoB,UAAU,CAAgB;CACvD,CAAC,GAEM;EAAE;EAAQ;EAAe;CAAiB;AACnD"}

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 = { class: "ac-component" }, y = ["aria-label"], b = { class: "ac-component" }, x = { class: "ds-options c-scroll" }, S = ["onClick", "aria-label"], C = /* @__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" },
@@ -22,22 +22,22 @@ var v = { class: "ac-component" }, y = ["aria-label"], b = { class: "ac-componen
 		class: {}
 	},
 	setup(c) {
-		let C = c, w = f(null), T = f(null), { isOpen: E, dropdownStyle: D } = t(w, T, {
+		let S = c, C = f(null), w = f(null), { isOpen: T, dropdownStyle: E } = t(C, w, {
 			extraStyle: (e) => ({
 				minWidth: `${e.width}px`,
 				maxWidth: `${e.width * 2}px`
 			}),
 			closeOnScroll: !0
 		});
-		function O() {
-			E.value = !E.value;
+		function D() {
+			T.value = !T.value;
 		}
-		function k(e) {
-			e.callback?.(), E.value = !1;
+		function O(e) {
+			e.callback?.(), T.value = !1;
 		}
-		return (t, f) => (d(), o("div", v, [s("div", {
+		return (t, f) => (d(), o("div", {
 			ref_key: "wrapperRef",
-			ref: w,
+			ref: C,
 			class: "ds-wrapper d-inline-block"
 		}, [s("button", {
 			type: "button",
@@ -45,10 +45,10 @@ var v = { class: "ac-component" }, y = ["aria-label"], b = { class: "ac-componen
 				c.size === "small" && "c-btn-sm",
 				c.size === "large" && "c-btn-lg",
 				c.type !== "normal" && `c-btn-${c.type}`,
-				C.class
+				S.class
 			]]),
 			"aria-label": c.ariaLabel ?? c.label,
-			onClick: f[0] ||= (e) => O()
+			onClick: f[0] ||= (e) => D()
 		}, [
 			c.icon ? (d(), o("i", {
 				key: 0,
@@ -56,16 +56,16 @@ var v = { class: "ac-component" }, y = ["aria-label"], b = { class: "ac-componen
 			}, null, 2)) : a("", !0),
 			c.label ? (d(), o("span", {
 				key: 1,
-				class: l({ "align-center-fix ": C.labelAlignmentFix })
+				class: l(["btn-label", { "align-center-fix ": S.labelAlignmentFix }])
 			}, m(c.label), 3)) : a("", !0),
-			s("span", { class: l(["c-icon-btn c-icon-btn--chevron", { "c-icon-btn--chevron-open": h(E) }]) }, [...f[1] ||= [s("i", { class: "fa-solid fa-fw fa-chevron-down" }, null, -1)]], 2)
-		], 10, y), (d(), i(r, { to: "body" }, [s("div", b, [h(E) ? (d(), o("div", {
+			s("span", { class: l(["c-icon-btn c-icon-btn--chevron", { "c-icon-btn--chevron-open": h(T) }]) }, [s("i", { class: l(["fa-solid fa-chevron-down", { "fa-fw": !!c.label }]) }, null, 2)], 2)
+		], 10, v), (d(), i(r, { to: "body" }, [s("div", y, [h(T) ? (d(), o("div", {
 			key: 0,
 			ref_key: "dropdownRef",
-			ref: T,
+			ref: w,
 			class: "c-dropdown ds-wrapper",
-			style: u(h(D))
-		}, [s("ul", x, [(d(!0), o(n, null, p(c.items, (t, n) => _((d(), o("li", {
+			style: u(h(E))
+		}, [s("ul", b, [(d(!0), o(n, null, p(c.items, (t, n) => _((d(), o("li", {
 			key: `cb-${n}`,
 			class: l(["d-option dm-option c-field-size c-type-color", {
 				[`c-field-size--${h(e)(t.size)}`]: t.size,
@@ -74,13 +74,13 @@ var v = { class: "ac-component" }, y = ["aria-label"], b = { class: "ac-componen
 				[t.class]: !!t.class
 			}]),
 			tabindex: "0",
-			onClick: (e) => k(t),
+			onClick: (e) => O(t),
 			"aria-label": t.ariaLabel ?? t.label
 		}, [t.icon ? (d(), o("i", {
 			key: 0,
 			class: l(["fa-fw", t.icon])
-		}, null, 2)) : a("", !0), s("span", { class: l(["d-option__label", { "c-truncate": C.textEllipsis }]) }, m(t.label), 3)], 10, S)), [[g, !t.hidden?.()]])), 128))])], 4)) : a("", !0)])]))], 512)]));
+		}, null, 2)) : a("", !0), s("span", { class: l(["d-option__label", { "c-truncate": S.textEllipsis }]) }, m(t.label), 3)], 10, x)), [[g, !t.hidden?.()]])), 128))])], 4)) : a("", !0)])]))], 512));
 	}
 });
 //#endregion
-export { C as default };
+export { S as default };

package/dist/admins-components29.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components29.js","names":[],"sources":["../src/components/DropdownMenu.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownMenuItem {\n  icon?: string\n  label: string\n  type?: ButtonType\n  size?: ControlSize\n  ariaLabel?: string\n  class?: string\n  callback: () => void\n  disabled?: () => boolean\n  hidden?: () => boolean\n}\n\nexport interface DropdownMenuProps {\n  size?: ControlSize\n  icon?: string\n  label?: string\n  ariaLabel?: string\n  textEllipsis?: boolean\n  type?: ButtonType\n  items: DropdownMenuItem[]\n  labelAlignmentFix?: boolean\n  class?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport type { ControlSize } from '@/types/types'\nimport type { ButtonType } from '@/components/Button.vue'\nimport { useDropdownAnchor } from '@/composables/useDropdownAnchor'\nimport { sizeToClass } from '@/utils/dom'\n\nconst props = withDefaults(defineProps<DropdownMenuProps>(), {\n  size: 'normal',\n  type: 'normal',\n  textEllipsis: true,\n  icon: undefined,\n  label: undefined,\n  labelAlignmentFix: false,\n})\n\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst dropdownRef = ref<HTMLElement | null>(null)\nconst { isOpen, dropdownStyle } = useDropdownAnchor(wrapperRef, dropdownRef, {\n  extraStyle: (rect) => ({\n    minWidth: `${rect.width}px`,\n    maxWidth: `${rect.width * 2}px`,\n  }),\n  closeOnScroll: true,\n})\n\nfunction toggleOpen() {\n  isOpen.value = !isOpen.value\n}\n\nfunction selectItem(item: DropdownMenuItem) {\n  item.callback?.()\n  isOpen.value = false\n}\n</script>\n\n<template>\n  <div class=\"ac-component\">\n    <div ref=\"wrapperRef\" class=\"ds-wrapper d-inline-block\">\n      <button\n        type=\"button\"\n        class=\"c-btn dm-trigger\"\n        :class=\"[\n          size === 'small' && 'c-btn-sm',\n          size === 'large' && 'c-btn-lg',\n          type !== 'normal' && `c-btn-${type}`,\n          props.class,\n        ]\"\n        :aria-label=\"ariaLabel ?? label\"\n        @click=\"toggleOpen()\"\n      >\n        <i v-if=\"icon\" class=\"fa-fw\" :class=\"icon\"></i>\n        <span v-if=\"label\" :class=\"{ 'align-center-fix ': props.labelAlignmentFix }\">{{\n          label\n        }}</span>\n\n        <span\n          class=\"c-icon-btn c-icon-btn--chevron\"\n          :class=\"{ 'c-icon-btn--chevron-open': isOpen }\"\n        >\n          <i class=\"fa-solid fa-fw fa-chevron-down\"></i>\n        </span>\n      </button>\n\n      <Teleport to=\"body\">\n        <div class=\"ac-component\">\n          <div v-if=\"isOpen\" ref=\"dropdownRef\" class=\"c-dropdown ds-wrapper\" :style=\"dropdownStyle\">\n            <ul class=\"ds-options c-scroll\">\n              <li\n                v-for=\"(item, idx) in items\"\n                v-show=\"!item.hidden?.()\"\n                :key=\"`cb-${idx}`\"\n                class=\"d-option dm-option c-field-size c-type-color\"\n                :class=\"{\n                  [`c-field-size--${sizeToClass(item.size)}`]: item.size,\n                  [`c-type-color--${item.type}`]: item.type,\n                  'is-disabled': item.disabled?.(),\n                  [item.class!]: !!item.class,\n                }\"\n                tabindex=\"0\"\n                @click=\"selectItem(item)\"\n                :aria-label=\"item.ariaLabel ?? item.label\"\n              >\n                <i v-if=\"item.icon\" class=\"fa-fw\" :class=\"item.icon\"></i>\n                <span class=\"d-option__label\" :class=\"{ 'c-truncate': props.textEllipsis }\">{{\n                  item.label\n                }}</span>\n              </li>\n            </ul>\n          </div>\n        </div>\n      </Teleport>\n    </div>\n  </div>\n</template>\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAiCA,IAAM,IAAQ,GASR,IAAa,EAAwB,IAAI,GACzC,IAAc,EAAwB,IAAI,GAC1C,EAAE,WAAQ,qBAAkB,EAAkB,GAAY,GAAa;GAC3E,aAAa,OAAU;IACrB,UAAU,GAAG,EAAK,MAAM;IACxB,UAAU,GAAG,EAAK,QAAQ,EAAE;GAC9B;GACA,eAAe;EACjB,CAAC;EAED,SAAS,IAAa;GACpB,EAAO,QAAQ,CAAC,EAAO;EACzB;EAEA,SAAS,EAAW,GAAwB;GAE1C,AADA,EAAK,WAAW,GAChB,EAAO,QAAQ;EACjB;yBAIE,EAwDM,OAxDN,GAwDM,CAvDJ,EAsDM,OAAA;YAtDG;GAAJ,KAAI;GAAa,OAAM;MAC1B,EAuBS,UAAA;GAtBP,MAAK;GACL,OAAK,EAAA,CAAC,oBAAkB;IACJ,EAAA,SAAI,WAAA;IAAsC,EAAA,SAAI,WAAA;IAAsC,EAAA,SAAI,YAAA,SAA0B,EAAA;IAAkB,EAAM;;GAM7J,cAAY,EAAA,aAAa,EAAA;GACzB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAU;;GAET,EAAA,QAAA,EAAA,GAAT,EAA+C,KAAA;;IAAhC,OAAK,EAAA,CAAC,SAAgB,EAAA,IAAI,CAAA;;GAC7B,EAAA,SAAA,EAAA,GAAZ,EAES,QAAA;;IAFW,OAAK,EAAA,EAAA,qBAAyB,EAAM,kBAAiB,CAAA;QACvE,EAAA,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAGP,EAKO,QAAA,EAJL,OAAK,EAAA,CAAC,kCAAgC,EAAA,4BACA,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;mBAI7C,EA2BW,GAAA,EA3BD,IAAG,OAAM,GAAA,CACjB,EAyBM,OAzBN,GAyBM,CAxBO,EAAA,CAAA,KAAA,EAAA,GAAX,EAuBM,OAAA;;YAvBiB;GAAJ,KAAI;GAAc,OAAM;GAAyB,OAAK,EAAE,EAAA,CAAA,CAAa;MACtF,EAqBK,MArBL,GAqBK,EAAA,EAAA,EAAA,GApBH,EAmBK,GAAA,MAAA,EAlBmB,EAAA,QAAd,GAAM,cADhB,EAmBK,MAAA;GAhBF,KAAG,MAAQ;GACZ,OAAK,EAAA,CAAC,gDAA8C;sBACN,EAAA,CAAA,EAAY,EAAK,IAAI,MAAM,EAAK;sBAA0C,EAAK,SAAS,EAAK;mBAAuC,EAAK,WAAQ;KAAyB,EAAK,QAAK,CAAA,CAAM,EAAK;;GAM7O,UAAS;GACR,UAAK,MAAE,EAAW,CAAI;GACtB,cAAY,EAAK,aAAa,EAAK;MAE3B,EAAK,QAAA,EAAA,GAAd,EAAyD,KAAA;;GAArC,OAAK,EAAA,CAAC,SAAgB,EAAK,IAAI,CAAA;4BACnD,EAES,QAAA,EAFH,OAAK,EAAA,CAAC,mBAAiB,EAAA,cAAyB,EAAM,aAAY,CAAA,CAAA,EAAA,GAAA,EACtE,EAAK,KAAK,GAAA,CAAA,CAAA,GAAA,IAAA,CAAA,IAAA,CAAA,CAAA,GAAA,CAfH,EAAK,SAAM,CAAA,CAAA,CAAA"}
+{"version":3,"file":"admins-components29.js","names":[],"sources":["../src/components/DropdownMenu.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownMenuItem {\n  icon?: string\n  label: string\n  type?: ButtonType\n  size?: ControlSize\n  ariaLabel?: string\n  class?: string\n  callback: () => void\n  disabled?: () => boolean\n  hidden?: () => boolean\n}\n\nexport interface DropdownMenuProps {\n  size?: ControlSize\n  icon?: string\n  label?: string\n  ariaLabel?: string\n  textEllipsis?: boolean\n  type?: ButtonType\n  items: DropdownMenuItem[]\n  labelAlignmentFix?: boolean\n  class?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport type { ControlSize } from '@/types/types'\nimport type { ButtonType } from '@/components/Button.vue'\nimport { useDropdownAnchor } from '@/composables/useDropdownAnchor'\nimport { sizeToClass } from '@/utils/dom'\n\nconst props = withDefaults(defineProps<DropdownMenuProps>(), {\n  size: 'normal',\n  type: 'normal',\n  textEllipsis: true,\n  icon: undefined,\n  label: undefined,\n  labelAlignmentFix: false,\n})\n\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst dropdownRef = ref<HTMLElement | null>(null)\nconst { isOpen, dropdownStyle } = useDropdownAnchor(wrapperRef, dropdownRef, {\n  extraStyle: (rect) => ({\n    minWidth: `${rect.width}px`,\n    maxWidth: `${rect.width * 2}px`,\n  }),\n  closeOnScroll: true,\n})\n\nfunction toggleOpen() {\n  isOpen.value = !isOpen.value\n}\n\nfunction selectItem(item: DropdownMenuItem) {\n  item.callback?.()\n  isOpen.value = false\n}\n</script>\n\n<template>\n  <div ref=\"wrapperRef\" class=\"ds-wrapper d-inline-block\">\n    <button\n      type=\"button\"\n      class=\"c-btn dm-trigger\"\n      :class=\"[\n        size === 'small' && 'c-btn-sm',\n        size === 'large' && 'c-btn-lg',\n        type !== 'normal' && `c-btn-${type}`,\n        props.class,\n      ]\"\n      :aria-label=\"ariaLabel ?? label\"\n      @click=\"toggleOpen()\"\n    >\n      <i v-if=\"icon\" class=\"fa-fw\" :class=\"icon\"></i>\n      <span\n        v-if=\"label\"\n        class=\"btn-label\"\n        :class=\"{ 'align-center-fix ': props.labelAlignmentFix }\"\n        >{{ label }}</span\n      >\n\n      <span class=\"c-icon-btn c-icon-btn--chevron\" :class=\"{ 'c-icon-btn--chevron-open': isOpen }\">\n        <i class=\"fa-solid fa-chevron-down\" :class=\"{ 'fa-fw': !!label }\"></i>\n      </span>\n    </button>\n\n    <Teleport to=\"body\">\n      <div class=\"ac-component\">\n        <div v-if=\"isOpen\" ref=\"dropdownRef\" class=\"c-dropdown ds-wrapper\" :style=\"dropdownStyle\">\n          <ul class=\"ds-options c-scroll\">\n            <li\n              v-for=\"(item, idx) in items\"\n              v-show=\"!item.hidden?.()\"\n              :key=\"`cb-${idx}`\"\n              class=\"d-option dm-option c-field-size c-type-color\"\n              :class=\"{\n                [`c-field-size--${sizeToClass(item.size)}`]: item.size,\n                [`c-type-color--${item.type}`]: item.type,\n                'is-disabled': item.disabled?.(),\n                [item.class!]: !!item.class,\n              }\"\n              tabindex=\"0\"\n              @click=\"selectItem(item)\"\n              :aria-label=\"item.ariaLabel ?? item.label\"\n            >\n              <i v-if=\"item.icon\" class=\"fa-fw\" :class=\"item.icon\"></i>\n              <span class=\"d-option__label\" :class=\"{ 'c-truncate': props.textEllipsis }\">{{\n                item.label\n              }}</span>\n            </li>\n          </ul>\n        </div>\n      </div>\n    </Teleport>\n  </div>\n</template>\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAiCA,IAAM,IAAQ,GASR,IAAa,EAAwB,IAAI,GACzC,IAAc,EAAwB,IAAI,GAC1C,EAAE,WAAQ,qBAAkB,EAAkB,GAAY,GAAa;GAC3E,aAAa,OAAU;IACrB,UAAU,GAAG,EAAK,MAAM;IACxB,UAAU,GAAG,EAAK,QAAQ,EAAE;GAC9B;GACA,eAAe;EACjB,CAAC;EAED,SAAS,IAAa;GACpB,EAAO,QAAQ,CAAC,EAAO;EACzB;EAEA,SAAS,EAAW,GAAwB;GAE1C,AADA,EAAK,WAAW,GAChB,EAAO,QAAQ;EACjB;yBAIE,EAsDM,OAAA;YAtDG;GAAJ,KAAI;GAAa,OAAM;MAC1B,EAuBS,UAAA;GAtBP,MAAK;GACL,OAAK,EAAA,CAAC,oBAAkB;IACN,EAAA,SAAI,WAAA;IAAoC,EAAA,SAAI,WAAA;IAAoC,EAAA,SAAI,YAAA,SAA0B,EAAA;IAAgB,EAAM;;GAMrJ,cAAY,EAAA,aAAa,EAAA;GACzB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAU;;GAET,EAAA,QAAA,EAAA,GAAT,EAA+C,KAAA;;IAAhC,OAAK,EAAA,CAAC,SAAgB,EAAA,IAAI,CAAA;;GAEjC,EAAA,SAAA,EAAA,GADR,EAKC,QAAA;;IAHC,OAAK,EAAA,CAAC,aAAW,EAAA,qBACc,EAAM,kBAAiB,CAAA,CAAA;QAClD,EAAA,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAGX,EAEO,QAAA,EAFD,OAAK,EAAA,CAAC,kCAAgC,EAAA,4BAAuC,EAAA,CAAA,EAAM,CAAA,CAAA,EAAA,GAAA,CACvF,EAAsE,KAAA,EAAnE,OAAK,EAAA,CAAC,4BAA0B,EAAA,SAAA,CAAA,CAAsB,EAAA,MAAK,CAAA,CAAA,EAAA,GAAA,MAAA,CAAA,CAAA,GAAA,CAAA;mBAIlE,EA2BW,GAAA,EA3BD,IAAG,OAAM,GAAA,CACjB,EAyBM,OAzBN,GAyBM,CAxBO,EAAA,CAAA,KAAA,EAAA,GAAX,EAuBM,OAAA;;YAvBiB;GAAJ,KAAI;GAAc,OAAM;GAAyB,OAAK,EAAE,EAAA,CAAA,CAAa;MACtF,EAqBK,MArBL,GAqBK,EAAA,EAAA,EAAA,GApBH,EAmBK,GAAA,MAAA,EAlBmB,EAAA,QAAd,GAAM,cADhB,EAmBK,MAAA;GAhBF,KAAG,MAAQ;GACZ,OAAK,EAAA,CAAC,gDAA8C;sBACR,EAAA,CAAA,EAAY,EAAK,IAAI,MAAM,EAAK;sBAAwC,EAAK,SAAS,EAAK;mBAAqC,EAAK,WAAQ;KAAuB,EAAK,QAAK,CAAA,CAAM,EAAK;;GAMrO,UAAS;GACR,UAAK,MAAE,EAAW,CAAI;GACtB,cAAY,EAAK,aAAa,EAAK;MAE3B,EAAK,QAAA,EAAA,GAAd,EAAyD,KAAA;;GAArC,OAAK,EAAA,CAAC,SAAgB,EAAK,IAAI,CAAA;4BACnD,EAES,QAAA,EAFH,OAAK,EAAA,CAAC,mBAAiB,EAAA,cAAyB,EAAM,aAAY,CAAA,CAAA,EAAA,GAAA,EACtE,EAAK,KAAK,GAAA,CAAA,CAAA,GAAA,IAAA,CAAA,IAAA,CAAA,CAAA,GAAA,CAfH,EAAK,SAAM,CAAA,CAAA,CAAA"}

package/dist/admins-components30.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components30.js","names":[],"sources":["../src/components/DropdownMenu.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownMenuItem {\n  icon?: string\n  label: string\n  type?: ButtonType\n  size?: ControlSize\n  ariaLabel?: string\n  class?: string\n  callback: () => void\n  disabled?: () => boolean\n  hidden?: () => boolean\n}\n\nexport interface DropdownMenuProps {\n  size?: ControlSize\n  icon?: string\n  label?: string\n  ariaLabel?: string\n  textEllipsis?: boolean\n  type?: ButtonType\n  items: DropdownMenuItem[]\n  labelAlignmentFix?: boolean\n  class?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport type { ControlSize } from '@/types/types'\nimport type { ButtonType } from '@/components/Button.vue'\nimport { useDropdownAnchor } from '@/composables/useDropdownAnchor'\nimport { sizeToClass } from '@/utils/dom'\n\nconst props = withDefaults(defineProps<DropdownMenuProps>(), {\n  size: 'normal',\n  type: 'normal',\n  textEllipsis: true,\n  icon: undefined,\n  label: undefined,\n  labelAlignmentFix: false,\n})\n\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst dropdownRef = ref<HTMLElement | null>(null)\nconst { isOpen, dropdownStyle } = useDropdownAnchor(wrapperRef, dropdownRef, {\n  extraStyle: (rect) => ({\n    minWidth: `${rect.width}px`,\n    maxWidth: `${rect.width * 2}px`,\n  }),\n  closeOnScroll: true,\n})\n\nfunction toggleOpen() {\n  isOpen.value = !isOpen.value\n}\n\nfunction selectItem(item: DropdownMenuItem) {\n  item.callback?.()\n  isOpen.value = false\n}\n</script>\n\n<template>\n  <div class=\"ac-component\">\n    <div ref=\"wrapperRef\" class=\"ds-wrapper d-inline-block\">\n      <button\n        type=\"button\"\n        class=\"c-btn dm-trigger\"\n        :class=\"[\n          size === 'small' && 'c-btn-sm',\n          size === 'large' && 'c-btn-lg',\n          type !== 'normal' && `c-btn-${type}`,\n          props.class,\n        ]\"\n        :aria-label=\"ariaLabel ?? label\"\n        @click=\"toggleOpen()\"\n      >\n        <i v-if=\"icon\" class=\"fa-fw\" :class=\"icon\"></i>\n        <span v-if=\"label\" :class=\"{ 'align-center-fix ': props.labelAlignmentFix }\">{{\n          label\n        }}</span>\n\n        <span\n          class=\"c-icon-btn c-icon-btn--chevron\"\n          :class=\"{ 'c-icon-btn--chevron-open': isOpen }\"\n        >\n          <i class=\"fa-solid fa-fw fa-chevron-down\"></i>\n        </span>\n      </button>\n\n      <Teleport to=\"body\">\n        <div class=\"ac-component\">\n          <div v-if=\"isOpen\" ref=\"dropdownRef\" class=\"c-dropdown ds-wrapper\" :style=\"dropdownStyle\">\n            <ul class=\"ds-options c-scroll\">\n              <li\n                v-for=\"(item, idx) in items\"\n                v-show=\"!item.hidden?.()\"\n                :key=\"`cb-${idx}`\"\n                class=\"d-option dm-option c-field-size c-type-color\"\n                :class=\"{\n                  [`c-field-size--${sizeToClass(item.size)}`]: item.size,\n                  [`c-type-color--${item.type}`]: item.type,\n                  'is-disabled': item.disabled?.(),\n                  [item.class!]: !!item.class,\n                }\"\n                tabindex=\"0\"\n                @click=\"selectItem(item)\"\n                :aria-label=\"item.ariaLabel ?? item.label\"\n              >\n                <i v-if=\"item.icon\" class=\"fa-fw\" :class=\"item.icon\"></i>\n                <span class=\"d-option__label\" :class=\"{ 'c-truncate': props.textEllipsis }\">{{\n                  item.label\n                }}</span>\n              </li>\n            </ul>\n          </div>\n        </div>\n      </Teleport>\n    </div>\n  </div>\n</template>\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":""}
+{"version":3,"file":"admins-components30.js","names":[],"sources":["../src/components/DropdownMenu.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface DropdownMenuItem {\n  icon?: string\n  label: string\n  type?: ButtonType\n  size?: ControlSize\n  ariaLabel?: string\n  class?: string\n  callback: () => void\n  disabled?: () => boolean\n  hidden?: () => boolean\n}\n\nexport interface DropdownMenuProps {\n  size?: ControlSize\n  icon?: string\n  label?: string\n  ariaLabel?: string\n  textEllipsis?: boolean\n  type?: ButtonType\n  items: DropdownMenuItem[]\n  labelAlignmentFix?: boolean\n  class?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport type { ControlSize } from '@/types/types'\nimport type { ButtonType } from '@/components/Button.vue'\nimport { useDropdownAnchor } from '@/composables/useDropdownAnchor'\nimport { sizeToClass } from '@/utils/dom'\n\nconst props = withDefaults(defineProps<DropdownMenuProps>(), {\n  size: 'normal',\n  type: 'normal',\n  textEllipsis: true,\n  icon: undefined,\n  label: undefined,\n  labelAlignmentFix: false,\n})\n\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst dropdownRef = ref<HTMLElement | null>(null)\nconst { isOpen, dropdownStyle } = useDropdownAnchor(wrapperRef, dropdownRef, {\n  extraStyle: (rect) => ({\n    minWidth: `${rect.width}px`,\n    maxWidth: `${rect.width * 2}px`,\n  }),\n  closeOnScroll: true,\n})\n\nfunction toggleOpen() {\n  isOpen.value = !isOpen.value\n}\n\nfunction selectItem(item: DropdownMenuItem) {\n  item.callback?.()\n  isOpen.value = false\n}\n</script>\n\n<template>\n  <div ref=\"wrapperRef\" class=\"ds-wrapper d-inline-block\">\n    <button\n      type=\"button\"\n      class=\"c-btn dm-trigger\"\n      :class=\"[\n        size === 'small' && 'c-btn-sm',\n        size === 'large' && 'c-btn-lg',\n        type !== 'normal' && `c-btn-${type}`,\n        props.class,\n      ]\"\n      :aria-label=\"ariaLabel ?? label\"\n      @click=\"toggleOpen()\"\n    >\n      <i v-if=\"icon\" class=\"fa-fw\" :class=\"icon\"></i>\n      <span\n        v-if=\"label\"\n        class=\"btn-label\"\n        :class=\"{ 'align-center-fix ': props.labelAlignmentFix }\"\n        >{{ label }}</span\n      >\n\n      <span class=\"c-icon-btn c-icon-btn--chevron\" :class=\"{ 'c-icon-btn--chevron-open': isOpen }\">\n        <i class=\"fa-solid fa-chevron-down\" :class=\"{ 'fa-fw': !!label }\"></i>\n      </span>\n    </button>\n\n    <Teleport to=\"body\">\n      <div class=\"ac-component\">\n        <div v-if=\"isOpen\" ref=\"dropdownRef\" class=\"c-dropdown ds-wrapper\" :style=\"dropdownStyle\">\n          <ul class=\"ds-options c-scroll\">\n            <li\n              v-for=\"(item, idx) in items\"\n              v-show=\"!item.hidden?.()\"\n              :key=\"`cb-${idx}`\"\n              class=\"d-option dm-option c-field-size c-type-color\"\n              :class=\"{\n                [`c-field-size--${sizeToClass(item.size)}`]: item.size,\n                [`c-type-color--${item.type}`]: item.type,\n                'is-disabled': item.disabled?.(),\n                [item.class!]: !!item.class,\n              }\"\n              tabindex=\"0\"\n              @click=\"selectItem(item)\"\n              :aria-label=\"item.ariaLabel ?? item.label\"\n            >\n              <i v-if=\"item.icon\" class=\"fa-fw\" :class=\"item.icon\"></i>\n              <span class=\"d-option__label\" :class=\"{ 'c-truncate': props.textEllipsis }\">{{\n                item.label\n              }}</span>\n            </li>\n          </ul>\n        </div>\n      </div>\n    </Teleport>\n  </div>\n</template>\n<style lang=\"scss\" src=\"@/styles/components/dropdown-select.scss\"></style>\n"],"mappings":""}

package/dist/admins-components5.js

@@ -5,7 +5,10 @@ var u = [
 	"aria-label",
 	"title",
 	"disabled"
-], d = { key: 1 }, f = ["aria-label"], p = {
+], d = {
+	key: 1,
+	class: "btn-label"
+}, f = ["aria-label"], p = {
 	size: "normal",
 	type: "normal",
 	outline: !1,

package/dist/admins-components5.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components5.js","names":[],"sources":["../src/components/Button.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ButtonType = 'normal' | 'primary' | 'dark' | 'success' | 'error' | 'warning' | 'info'\n\nexport type IconPosition = 'left' | 'right'\n\nexport interface ButtonProps {\n  size?: ControlSize\n  type?: ButtonType\n  outline?: boolean\n  icon?: string\n  iconPosition?: IconPosition\n  label?: string\n  ariaLabel?: string\n  callback?: () => void\n  disabled?: boolean | (() => boolean)\n  indicator?: string | number\n  labelAlignmentFix?: boolean\n  class?: string\n}\n\nexport const buttonDefaults = {\n  size: 'normal' as ControlSize,\n  type: 'normal' as ButtonType,\n  outline: false,\n  icon: undefined,\n  iconPosition: 'left' as IconPosition,\n  labelAlignmentFix: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ControlSize } from '@/types/types'\nimport { sizeToClass, typeToClass } from '@/utils/dom'\nimport { computed } from 'vue'\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n  ...buttonDefaults,\n})\n\nconst classes = computed(() => [\n  'c-btn',\n  sizeToClass(props.size, 'c-btn'),\n  props.outline && 'c-btn-outline',\n  typeToClass(props.type, 'c-btn'),\n  props.class,\n])\n\nconst isDisabled = computed(() => {\n  if (props.disabled === undefined || props.disabled === null) return false\n  return typeof props.disabled === 'function' ? props.disabled() : props.disabled\n})\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    :class=\"classes\"\n    :aria-label=\"ariaLabel ?? label\"\n    :title=\"ariaLabel ?? label\"\n    @click=\"callback?.()\"\n    :disabled=\"isDisabled\"\n  >\n    <i v-if=\"icon && iconPosition === 'left'\" :class=\"icon\"></i>\n    <span v-if=\"label\">{{ label }}</span>\n    <span\n      v-if=\"indicator != null && indicator !== ''\"\n      class=\"c-btn-indicator\"\n      :aria-label=\"`${indicator}`\"\n    >\n      {{ indicator }}\n    </span>\n    <i v-if=\"icon && iconPosition === 'right'\" :class=\"icon\"></i>\n  </button>\n</template>\n"],"mappings":";;;;;;;uCAoBa,IAAiB;CAC5B,MAAM;CACN,MAAM;CACN,SAAS;CACT,MAAM,KAAA;CACN,cAAc;CACd,mBAAmB;AACrB;;;;;;;;;;;;;;;;;EAQA,IAAM,IAAQ,GAIR,IAAU,QAAe;GAC7B;GACA,EAAY,EAAM,MAAM,OAAO;GAC/B,EAAM,WAAW;GACjB,EAAY,EAAM,MAAM,OAAO;GAC/B,EAAM;EACR,CAAC,GAEK,IAAa,QACb,EAAM,aAAa,KAAA,KAAa,EAAM,aAAa,OAAa,KAC7D,OAAO,EAAM,YAAa,aAAa,EAAM,SAAS,IAAI,EAAM,QACxE;yBAIC,EAkBS,UAAA;GAjBP,MAAK;GACJ,OAAK,EAAE,EAAA,KAAO;GACd,cAAY,EAAA,aAAa,EAAA;GACzB,OAAO,EAAA,aAAa,EAAA;GACpB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAA,WAAQ;GACf,UAAU,EAAA;;GAEF,EAAA,QAAQ,EAAA,iBAAY,UAAA,EAAA,GAA7B,EAA4D,KAAA;;IAAjB,OAAK,EAAE,EAAA,IAAI;;GAC1C,EAAA,SAAA,EAAA,GAAZ,EAAqC,QAAA,GAAA,EAAf,EAAA,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAEnB,EAAA,aAAS,QAAY,EAAA,cAAS,MAAA,EAAA,GADtC,EAMO,QAAA;;IAJL,OAAM;IACL,cAAU,GAAK,EAAA;QAEb,EAAA,SAAS,GAAA,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAEL,EAAA,QAAQ,EAAA,iBAAY,WAAA,EAAA,GAA7B,EAA6D,KAAA;;IAAjB,OAAK,EAAE,EAAA,IAAI"}
+{"version":3,"file":"admins-components5.js","names":[],"sources":["../src/components/Button.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ButtonType = 'normal' | 'primary' | 'dark' | 'success' | 'error' | 'warning' | 'info'\n\nexport type IconPosition = 'left' | 'right'\n\nexport interface ButtonProps {\n  size?: ControlSize\n  type?: ButtonType\n  outline?: boolean\n  icon?: string\n  iconPosition?: IconPosition\n  label?: string\n  ariaLabel?: string\n  callback?: () => void\n  disabled?: boolean | (() => boolean)\n  indicator?: string | number\n  labelAlignmentFix?: boolean\n  class?: string\n}\n\nexport const buttonDefaults = {\n  size: 'normal' as ControlSize,\n  type: 'normal' as ButtonType,\n  outline: false,\n  icon: undefined,\n  iconPosition: 'left' as IconPosition,\n  labelAlignmentFix: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ControlSize } from '@/types/types'\nimport { sizeToClass, typeToClass } from '@/utils/dom'\nimport { computed } from 'vue'\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n  ...buttonDefaults,\n})\n\nconst classes = computed(() => [\n  'c-btn',\n  sizeToClass(props.size, 'c-btn'),\n  props.outline && 'c-btn-outline',\n  typeToClass(props.type, 'c-btn'),\n  props.class,\n])\n\nconst isDisabled = computed(() => {\n  if (props.disabled === undefined || props.disabled === null) return false\n  return typeof props.disabled === 'function' ? props.disabled() : props.disabled\n})\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    :class=\"classes\"\n    :aria-label=\"ariaLabel ?? label\"\n    :title=\"ariaLabel ?? label\"\n    @click=\"callback?.()\"\n    :disabled=\"isDisabled\"\n  >\n    <i v-if=\"icon && iconPosition === 'left'\" :class=\"icon\"></i>\n    <span v-if=\"label\" class=\"btn-label\">{{ label }}</span>\n    <span\n      v-if=\"indicator != null && indicator !== ''\"\n      class=\"c-btn-indicator\"\n      :aria-label=\"`${indicator}`\"\n    >\n      {{ indicator }}\n    </span>\n    <i v-if=\"icon && iconPosition === 'right'\" :class=\"icon\"></i>\n  </button>\n</template>\n"],"mappings":";;;;;;;;;;uBAoBa,IAAiB;CAC5B,MAAM;CACN,MAAM;CACN,SAAS;CACT,MAAM,KAAA;CACN,cAAc;CACd,mBAAmB;AACrB;;;;;;;;;;;;;;;;;EAQA,IAAM,IAAQ,GAIR,IAAU,QAAe;GAC7B;GACA,EAAY,EAAM,MAAM,OAAO;GAC/B,EAAM,WAAW;GACjB,EAAY,EAAM,MAAM,OAAO;GAC/B,EAAM;EACR,CAAC,GAEK,IAAa,QACb,EAAM,aAAa,KAAA,KAAa,EAAM,aAAa,OAAa,KAC7D,OAAO,EAAM,YAAa,aAAa,EAAM,SAAS,IAAI,EAAM,QACxE;yBAIC,EAkBS,UAAA;GAjBP,MAAK;GACJ,OAAK,EAAE,EAAA,KAAO;GACd,cAAY,EAAA,aAAa,EAAA;GACzB,OAAO,EAAA,aAAa,EAAA;GACpB,SAAK,AAAA,EAAA,QAAA,MAAE,EAAA,WAAQ;GACf,UAAU,EAAA;;GAEF,EAAA,QAAQ,EAAA,iBAAY,UAAA,EAAA,GAA7B,EAA4D,KAAA;;IAAjB,OAAK,EAAE,EAAA,IAAI;;GAC1C,EAAA,SAAA,EAAA,GAAZ,EAAuD,QAAvD,GAAuD,EAAf,EAAA,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAErC,EAAA,aAAS,QAAY,EAAA,cAAS,MAAA,EAAA,GADtC,EAMO,QAAA;;IAJL,OAAM;IACL,cAAU,GAAK,EAAA;QAEb,EAAA,SAAS,GAAA,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAEL,EAAA,QAAQ,EAAA,iBAAY,WAAA,EAAA,GAA7B,EAA6D,KAAA;;IAAjB,OAAK,EAAE,EAAA,IAAI"}

package/dist/admins-components57.js

@@ -1,26 +1,88 @@
-import { computed as e, ref as t } from "vue";
-//#region src/composables/useSelection.ts
-function n(n, r, i) {
-	let a = t(/* @__PURE__ */ new Set()), o = e(() => {
-		let e = r(), t = n();
-		return t.length > 0 && e != null && t.every((t) => a.value.has(t[e]));
-	});
-	function s(e) {
-		let t = e[r()];
-		a.value.has(t) ? a.value.delete(t) : a.value.add(t), i([...a.value]);
+import e from "./admins-components6.js";
+import t from "./admins-components30.js";
+import n from "./admins-components42.js";
+import { Fragment as r, createBlock as i, createCommentVNode as a, createElementBlock as o, defineComponent as s, mergeProps as c, openBlock as l, ref as u, renderList as d } from "vue";
+//#region src/components/data-table/DataListActions.vue?vue&type=script&setup=true&lang.ts
+var f = /* @__PURE__ */ s({
+	__name: "DataListActions",
+	props: {
+		actions: {},
+		item: {}
+	},
+	setup(s) {
+		let f = u(null);
+		function p(e, t) {
+			let n = {
+				title: e.label ?? "Megerősítés",
+				message: "Biztosan végrehajta a műveletet?",
+				type: e.type
+			}, r = typeof e.withConfirmConfig == "function" ? e.withConfirmConfig(t) : e.withConfirmConfig;
+			return {
+				...n,
+				...r
+			};
+		}
+		function m(e, t) {
+			e.withConfirm ? f.value = {
+				action: e,
+				item: t
+			} : e.callback(t);
+		}
+		function h() {
+			f.value &&= (f.value.action.callback(f.value.item), null);
+		}
+		function g(e) {
+			return e.isGroup === !0 && Array.isArray(e.items);
+		}
+		function _(e, t) {
+			return e.items.map((e) => {
+				let n = e.disabled, r = e.hidden;
+				return {
+					icon: e.icon,
+					label: e.label ?? "",
+					type: e.type,
+					size: e.label ? "small" : "normal",
+					class: e.class,
+					callback: () => m(e, t),
+					disabled: n ? () => n(t) : void 0,
+					hidden: r ? () => r(t) : void 0
+				};
+			});
+		}
+		return (u, v) => (l(), o(r, null, [(l(!0), o(r, null, d(s.actions, (n, u) => (l(), o(r, { key: u }, [n.hidden && n.hidden(s.item) ? a("", !0) : (l(), o(r, { key: 0 }, [g(n) ? (l(), i(t, c({
+			key: 0,
+			icon: n.icon,
+			label: n.label,
+			items: _(n, s.item),
+			class: n.class
+		}, { ref_for: !0 }, n.config), null, 16, [
+			"icon",
+			"label",
+			"items",
+			"class"
+		])) : (l(), i(e, c({
+			key: 1,
+			icon: n.icon,
+			label: n.label,
+			type: n.type,
+			ariaLabel: n.ariaLabel,
+			class: n.class,
+			outline: "",
+			callback: () => m(n, s.item),
+			disabled: n.disabled ? n.disabled(s.item) : !1
+		}, { ref_for: !0 }, n.config), null, 16, [
+			"icon",
+			"label",
+			"type",
+			"ariaLabel",
+			"class",
+			"callback",
+			"disabled"
+		]))], 64))], 64))), 128)), f.value ? (l(), i(n, c({ key: 0 }, p(f.value.action, f.value.item), {
+			onConfirm: h,
+			onCancel: v[0] ||= (e) => f.value = null
+		}), null, 16)) : a("", !0)], 64));
 	}
-	function c() {
-		let e = r();
-		if (o.value) a.value.clear();
-		else for (let t of n()) a.value.add(t[e]);
-		i([...a.value]);
-	}
-	return {
-		selectedKeys: a,
-		allSelected: o,
-		toggle: s,
-		toggleAll: c
-	};
-}
+});
 //#endregion
-export { n as useSelection };
+export { f as default };

package/dist/admins-components57.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components57.js","names":[],"sources":["../src/composables/useSelection.ts"],"sourcesContent":["import { ref, computed } from 'vue'\n\nexport function useSelection(\n  getItems: () => Record<string, unknown>[],\n  getAttr: () => string | undefined,\n  emit: (selected: unknown[]) => void,\n) {\n  const selectedKeys = ref<Set<unknown>>(new Set())\n\n  const allSelected = computed(() => {\n    const attr = getAttr()\n    const items = getItems()\n    return items.length > 0 && attr != null && items.every((i) => selectedKeys.value.has(i[attr]))\n  })\n\n  function toggle(item: Record<string, unknown>) {\n    const key = item[getAttr()!]\n    if (selectedKeys.value.has(key)) {\n      selectedKeys.value.delete(key)\n    } else {\n      selectedKeys.value.add(key)\n    }\n    emit([...selectedKeys.value])\n  }\n\n  function toggleAll() {\n    const attr = getAttr()!\n    if (allSelected.value) {\n      selectedKeys.value.clear()\n    } else {\n      for (const item of getItems()) {\n        selectedKeys.value.add(item[attr])\n      }\n    }\n    emit([...selectedKeys.value])\n  }\n\n  return { selectedKeys, allSelected, toggle, toggleAll }\n}\n"],"mappings":";;AAEA,SAAgB,EACd,GACA,GACA,GACA;CACA,IAAM,IAAe,kBAAkB,IAAI,IAAI,CAAC,GAE1C,IAAc,QAAe;EACjC,IAAM,IAAO,EAAQ,GACf,IAAQ,EAAS;EACvB,OAAO,EAAM,SAAS,KAAK,KAAQ,QAAQ,EAAM,OAAO,MAAM,EAAa,MAAM,IAAI,EAAE,EAAK,CAAC;CAC/F,CAAC;CAED,SAAS,EAAO,GAA+B;EAC7C,IAAM,IAAM,EAAK,EAAQ;EAMzB,AALI,EAAa,MAAM,IAAI,CAAG,IAC5B,EAAa,MAAM,OAAO,CAAG,IAE7B,EAAa,MAAM,IAAI,CAAG,GAE5B,EAAK,CAAC,GAAG,EAAa,KAAK,CAAC;CAC9B;CAEA,SAAS,IAAY;EACnB,IAAM,IAAO,EAAQ;EACrB,IAAI,EAAY,OACd,EAAa,MAAM,MAAM;OAEzB,KAAK,IAAM,KAAQ,EAAS,GAC1B,EAAa,MAAM,IAAI,EAAK,EAAK;EAGrC,EAAK,CAAC,GAAG,EAAa,KAAK,CAAC;CAC9B;CAEA,OAAO;EAAE;EAAc;EAAa;EAAQ;CAAU;AACxD"}
+{"version":3,"file":"admins-components57.js","names":[],"sources":["../src/components/data-table/DataListActions.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport type { Action, ActionGroup } from '@/types/data-list'\nimport type { ConfirmModalProps } from '@/components/ConfirmModal.vue'\nimport Button from '@/components/Button.vue'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport ConfirmModal from '@/components/ConfirmModal.vue'\nimport type { DropdownMenuItem } from '@/components/DropdownMenu.vue'\n\ndefineProps<{\n  actions: Array<Action | ActionGroup>\n  item?: Record<string, unknown>\n}>()\n\nconst activeConfirm = ref<{\n  action: Action\n  item?: Record<string, unknown>\n} | null>(null)\n\nfunction getConfirmConfig(action: Action, item?: Record<string, unknown>): ConfirmModalProps {\n  const defaultConfig = {\n    title: action.label ?? 'Megerősítés',\n    message: 'Biztosan végrehajta a műveletet?',\n    type: action.type,\n  }\n  const extra =\n    typeof action.withConfirmConfig === 'function'\n      ? action.withConfirmConfig(item)\n      : action.withConfirmConfig\n  return {\n    ...defaultConfig,\n    ...extra,\n  }\n}\n\nfunction handleOnClick(action: Action, item?: Record<string, unknown>) {\n  if (action.withConfirm) {\n    activeConfirm.value = { action, item }\n  } else {\n    action.callback(item)\n  }\n}\n\nfunction handleConfirm() {\n  if (activeConfirm.value) {\n    activeConfirm.value.action.callback(activeConfirm.value.item)\n    activeConfirm.value = null\n  }\n}\n\nfunction isActionGroup(entry: Action | ActionGroup): entry is ActionGroup {\n  return (entry as ActionGroup).isGroup === true && Array.isArray((entry as ActionGroup).items)\n}\n\nfunction buildActionGroupMenuItems(\n  group: ActionGroup,\n  item?: Record<string, unknown>,\n): DropdownMenuItem[] {\n  return group.items.map((action: Action) => {\n    const isDisabled = action.disabled\n    const isHidden = action.hidden\n    return {\n      icon: action.icon,\n      label: action.label ?? '',\n      type: action.type,\n      size: action.label ? 'small' : 'normal',\n      class: action.class,\n      callback: () => handleOnClick(action, item),\n      disabled: isDisabled ? () => isDisabled(item) : undefined,\n      hidden: isHidden ? () => isHidden(item) : undefined,\n    }\n  })\n}\n</script>\n\n<template>\n  <template v-for=\"(action, ai) in actions\" :key=\"ai\">\n    <template v-if=\"!(action.hidden && action.hidden(item))\">\n      <DropdownMenu\n        v-if=\"isActionGroup(action)\"\n        :icon=\"action.icon\"\n        :label=\"action.label\"\n        :items=\"buildActionGroupMenuItems(action, item)\"\n        :class=\"action.class\"\n        v-bind=\"action.config\"\n      />\n\n      <Button\n        v-else\n        :icon=\"action.icon\"\n        :label=\"action.label\"\n        :type=\"action.type\"\n        :ariaLabel=\"action.ariaLabel\"\n        :class=\"action.class\"\n        outline\n        :callback=\"() => handleOnClick(action, item)\"\n        :disabled=\"action.disabled ? action.disabled(item) : false\"\n        v-bind=\"action.config\"\n      />\n    </template>\n  </template>\n\n  <ConfirmModal\n    v-if=\"activeConfirm\"\n    v-bind=\"getConfirmConfig(activeConfirm.action, activeConfirm.item)\"\n    @confirm=\"handleConfirm\"\n    @cancel=\"activeConfirm = null\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;EAcA,IAAM,IAAgB,EAGZ,IAAI;EAEd,SAAS,EAAiB,GAAgB,GAAmD;GAC3F,IAAM,IAAgB;IACpB,OAAO,EAAO,SAAS;IACvB,SAAS;IACT,MAAM,EAAO;GACf,GACM,IACJ,OAAO,EAAO,qBAAsB,aAChC,EAAO,kBAAkB,CAAI,IAC7B,EAAO;GACb,OAAO;IACL,GAAG;IACH,GAAG;GACL;EACF;EAEA,SAAS,EAAc,GAAgB,GAAgC;GACrE,AAAI,EAAO,cACT,EAAc,QAAQ;IAAE;IAAQ;GAAK,IAErC,EAAO,SAAS,CAAI;EAExB;EAEA,SAAS,IAAgB;GACvB,AAEE,EAAc,WADd,EAAc,MAAM,OAAO,SAAS,EAAc,MAAM,IAAI,GACtC;EAE1B;EAEA,SAAS,EAAc,GAAmD;GACxE,OAAQ,EAAsB,YAAY,MAAQ,MAAM,QAAS,EAAsB,KAAK;EAC9F;EAEA,SAAS,EACP,GACA,GACoB;GACpB,OAAO,EAAM,MAAM,KAAK,MAAmB;IACzC,IAAM,IAAa,EAAO,UACpB,IAAW,EAAO;IACxB,OAAO;KACL,MAAM,EAAO;KACb,OAAO,EAAO,SAAS;KACvB,MAAM,EAAO;KACb,MAAM,EAAO,QAAQ,UAAU;KAC/B,OAAO,EAAO;KACd,gBAAgB,EAAc,GAAQ,CAAI;KAC1C,UAAU,UAAmB,EAAW,CAAI,IAAI,KAAA;KAChD,QAAQ,UAAiB,EAAS,CAAI,IAAI,KAAA;IAC5C;GACF,CAAC;EACH;6CAIE,EAwBW,GAAA,MAAA,EAxBsB,EAAA,UAAf,GAAQ,wBAAsB,EAAE,GAAA,CAC9B,EAAO,UAAU,EAAO,OAAO,EAAA,IAAI,IAoB5B,EAAA,IAAA,EAAA,KApB4B,EAAA,GAArD,EAsBW,GAAA,EAAA,KAAA,EAAA,GAAA,CApBD,EAAc,CAAM,KAAA,EAAA,GAD5B,EAOE,GAPF,EAOE;;GALC,MAAM,EAAO;GACb,OAAO,EAAO;GACd,OAAO,EAA0B,GAAQ,EAAA,IAAI;GAC7C,OAAO,EAAO;sBACP,EAAO,MAAM,GAAA,MAAA,IAAA;GAAA;GAAA;GAAA;GAAA;EAAA,CAAA,MAAA,EAAA,GAGvB,EAWE,GAXF,EAWE;;GATC,MAAM,EAAO;GACb,OAAO,EAAO;GACd,MAAM,EAAO;GACb,WAAW,EAAO;GAClB,OAAO,EAAO;GACf,SAAA;GACC,gBAAgB,EAAc,GAAQ,EAAA,IAAI;GAC1C,UAAU,EAAO,WAAW,EAAO,SAAS,EAAA,IAAI,IAAA;sBACzC,EAAO,MAAM,GAAA,MAAA,IAAA;GAAA;GAAA;GAAA;GAAA;GAAA;GAAA;GAAA;EAAA,CAAA,EAAA,GAAA,EAAA,EAAA,GAAA,EAAA,YAMnB,EAAA,SAAA,EAAA,GADR,EAKE,GALF,EAKE,EAAA,KAAA,EAAA,GAHQ,EAAiB,EAAA,MAAc,QAAQ,EAAA,MAAc,IAAI,GAAA;GAChE,WAAS;GACT,UAAM,AAAA,EAAA,QAAA,MAAE,EAAA,QAAa"}

package/dist/admins-components58.js

@@ -1,10 +1,5 @@
-//#region src/types/data-list.ts
-var e = {
-	striped: !0,
-	compact: !1
-}, t = { compact: !1 }, n = {
-	layout: "screen",
-	compact: !1
-};
+import e from "./admins-components57.js";
+//#region src/components/data-table/DataListActions.vue
+var t = e;
 //#endregion
-export { t as dataCardsSettingsDefaults, n as dataListSettingsDefaults, e as dataTableSettingsDefaults };
+export { t as default };

package/dist/admins-components58.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components58.js","names":[],"sources":["../src/types/data-list.ts"],"sourcesContent":["import type { DropdownOption } from '@/components/DropdownSelect.vue'\nimport type { PickedDate, PickedUtcRange } from '@/types/types'\nimport type { ButtonType } from '@/components/Button.vue'\nimport type { ConfirmModalProps } from '@/components/ConfirmModal.vue'\n\nexport type FilterValue = string | PickedDate | PickedUtcRange | string[] | null | undefined\n\nexport interface FilterConfig {\n  type: 'text' | 'date' | 'date-range' | 'select' | 'multi-select'\n  key: string\n  placeholder?: string\n  options?: DropdownOption[]\n}\n\nexport type LayoutMode = 'table' | 'cards' | 'screen'\n\nexport interface DataTableSettings {\n  striped: boolean\n  compact: boolean\n}\n\nexport interface DataCardsSettings {\n  compact: boolean\n}\n\nexport interface DataListSettings extends DataTableSettings, DataCardsSettings {\n  layout: LayoutMode\n  columns: Record<string, boolean>\n  cardHeaderColumns: Record<string, boolean>\n  columnOrder: string[]\n  cardHeaderOrder: string[]\n}\n\nexport interface PageSettings {\n  page: number\n  pageSize: number\n}\n\nexport interface PaginatorSettings extends PageSettings {\n  total: number\n}\n\nexport interface DataListConfig {\n  selectableAttr?: string\n  columns: Column[]\n\n  actions?: Array<Action | ActionGroup>\n  actionHeader?: string\n}\n\nexport type ColumnType = 'normal' | 'uuid' | 'date' | 'datetime'\n\nexport interface Column {\n  visible?: boolean\n  primary?: boolean\n  hideable?: boolean\n  defaultCardHeader?: boolean\n  label: string\n  property: string\n  sort?: Sort | boolean\n  type?: ColumnType\n  class?: string\n  headerClass?: string\n  hideCopyToClipboard?: boolean\n  hideHeader?: boolean\n\n  converter?: ((v: any, item: any) => any)\n  loading?: (() => boolean)\n}\n\nexport type SortDirection = 'asc' | 'desc' | null\n\nexport interface Sort {\n  label: string\n  callback: (property: string, direction: SortDirection) => any\n}\n\nexport interface Action {\n  icon: string\n  label?: string\n  ariaLabel?: string\n  cardLabel?: string\n  type?: ButtonType\n  class?: string\n  config?: Record<string, any>\n  disabled?: (item: any) => boolean\n  hidden?: (item: any) => boolean\n  callback: (item: any) => any\n  withConfirm?: boolean\n  withConfirmConfig?: (item: any) => ConfirmModalProps\n}\n\nexport interface ActionGroup {\n  isGroup: true\n  icon?: string\n  label?: string\n  ariaLabel?: string\n  cardLabel?: string\n  class?: string\n  config?: Record<string, any>\n  items: Action[]\n  disabled?: (item: any) => boolean\n  hidden?: (item: any) => boolean\n}\n\nexport const dataTableSettingsDefaults: DataTableSettings = {\n  striped: true,\n  compact: false,\n}\n\nexport const dataCardsSettingsDefaults: DataCardsSettings = {\n  compact: false,\n}\n\nexport const dataListSettingsDefaults: Partial<DataListSettings> = {\n  layout: 'screen',\n  compact: false,\n}\n"],"mappings":";AAyGA,IAAa,IAA+C;CAC1D,SAAS;CACT,SAAS;AACX,GAEa,IAA+C,EAC1D,SAAS,GACX,GAEa,IAAsD;CACjE,QAAQ;CACR,SAAS;AACX"}
+{"version":3,"file":"admins-components58.js","names":[],"sources":["../src/components/data-table/DataListActions.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from 'vue'\nimport type { Action, ActionGroup } from '@/types/data-list'\nimport type { ConfirmModalProps } from '@/components/ConfirmModal.vue'\nimport Button from '@/components/Button.vue'\nimport DropdownMenu from '@/components/DropdownMenu.vue'\nimport ConfirmModal from '@/components/ConfirmModal.vue'\nimport type { DropdownMenuItem } from '@/components/DropdownMenu.vue'\n\ndefineProps<{\n  actions: Array<Action | ActionGroup>\n  item?: Record<string, unknown>\n}>()\n\nconst activeConfirm = ref<{\n  action: Action\n  item?: Record<string, unknown>\n} | null>(null)\n\nfunction getConfirmConfig(action: Action, item?: Record<string, unknown>): ConfirmModalProps {\n  const defaultConfig = {\n    title: action.label ?? 'Megerősítés',\n    message: 'Biztosan végrehajta a műveletet?',\n    type: action.type,\n  }\n  const extra =\n    typeof action.withConfirmConfig === 'function'\n      ? action.withConfirmConfig(item)\n      : action.withConfirmConfig\n  return {\n    ...defaultConfig,\n    ...extra,\n  }\n}\n\nfunction handleOnClick(action: Action, item?: Record<string, unknown>) {\n  if (action.withConfirm) {\n    activeConfirm.value = { action, item }\n  } else {\n    action.callback(item)\n  }\n}\n\nfunction handleConfirm() {\n  if (activeConfirm.value) {\n    activeConfirm.value.action.callback(activeConfirm.value.item)\n    activeConfirm.value = null\n  }\n}\n\nfunction isActionGroup(entry: Action | ActionGroup): entry is ActionGroup {\n  return (entry as ActionGroup).isGroup === true && Array.isArray((entry as ActionGroup).items)\n}\n\nfunction buildActionGroupMenuItems(\n  group: ActionGroup,\n  item?: Record<string, unknown>,\n): DropdownMenuItem[] {\n  return group.items.map((action: Action) => {\n    const isDisabled = action.disabled\n    const isHidden = action.hidden\n    return {\n      icon: action.icon,\n      label: action.label ?? '',\n      type: action.type,\n      size: action.label ? 'small' : 'normal',\n      class: action.class,\n      callback: () => handleOnClick(action, item),\n      disabled: isDisabled ? () => isDisabled(item) : undefined,\n      hidden: isHidden ? () => isHidden(item) : undefined,\n    }\n  })\n}\n</script>\n\n<template>\n  <template v-for=\"(action, ai) in actions\" :key=\"ai\">\n    <template v-if=\"!(action.hidden && action.hidden(item))\">\n      <DropdownMenu\n        v-if=\"isActionGroup(action)\"\n        :icon=\"action.icon\"\n        :label=\"action.label\"\n        :items=\"buildActionGroupMenuItems(action, item)\"\n        :class=\"action.class\"\n        v-bind=\"action.config\"\n      />\n\n      <Button\n        v-else\n        :icon=\"action.icon\"\n        :label=\"action.label\"\n        :type=\"action.type\"\n        :ariaLabel=\"action.ariaLabel\"\n        :class=\"action.class\"\n        outline\n        :callback=\"() => handleOnClick(action, item)\"\n        :disabled=\"action.disabled ? action.disabled(item) : false\"\n        v-bind=\"action.config\"\n      />\n    </template>\n  </template>\n\n  <ConfirmModal\n    v-if=\"activeConfirm\"\n    v-bind=\"getConfirmConfig(activeConfirm.action, activeConfirm.item)\"\n    @confirm=\"handleConfirm\"\n    @cancel=\"activeConfirm = null\"\n  />\n</template>\n"],"mappings":""}

package/dist/admins-components59.js

@@ -1,8 +1,26 @@
-//#region src/utils/dataList.ts
-function e(e, t) {
-	if (!t) return "";
-	let n = e[t.property];
-	return t.converter ? t.converter(n, e) : n;
+import { computed as e, ref as t } from "vue";
+//#region src/composables/useSelection.ts
+function n(n, r, i) {
+	let a = t(/* @__PURE__ */ new Set()), o = e(() => {
+		let e = r(), t = n();
+		return t.length > 0 && e != null && t.every((t) => a.value.has(t[e]));
+	});
+	function s(e) {
+		let t = e[r()];
+		a.value.has(t) ? a.value.delete(t) : a.value.add(t), i([...a.value]);
+	}
+	function c() {
+		let e = r();
+		if (o.value) a.value.clear();
+		else for (let t of n()) a.value.add(t[e]);
+		i([...a.value]);
+	}
+	return {
+		selectedKeys: a,
+		allSelected: o,
+		toggle: s,
+		toggleAll: c
+	};
 }
 //#endregion
-export { e as getColumnValue };
+export { n as useSelection };

package/dist/admins-components59.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components59.js","names":[],"sources":["../src/utils/dataList.ts"],"sourcesContent":["import type { Column } from '@/types/data-list'\nimport type { Action, ActionGroup } from '@/types/data-list'\nimport type { DropdownMenuItem } from '@/components/DropdownMenu.vue'\n\nexport function getColumnValue(item: Record<string, unknown>, col: Column | undefined) {\n  if (!col) return ''\n  const value = (item as any)[col.property]\n  return col.converter ? col.converter(value, item) : value\n}\n\nexport function isUuid(str: string): boolean {\n  return /^[0-9a-f]{8}-[0-9a-f]{4}-[1-8][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i.test(str)\n}\n\nexport function isActionGroup(entry: Action | ActionGroup): entry is ActionGroup {\n  return (entry as ActionGroup).isGroup === true && Array.isArray((entry as ActionGroup).items)\n}\n\nexport function buildActionGroupMenuItems(\n  group: ActionGroup,\n  item: Record<string, unknown>,\n): DropdownMenuItem[] {\n  return group.items.map((action: Action) => ({\n    icon: action.icon,\n    label: action.label ?? '',\n    type: action.type,\n    size: action.label ? 'small' : 'normal',\n    callback: () => action.callback(item),\n  }))\n}\n"],"mappings":";AAIA,SAAgB,EAAe,GAA+B,GAAyB;CACrF,IAAI,CAAC,GAAK,OAAO;CACjB,IAAM,IAAS,EAAa,EAAI;CAChC,OAAO,EAAI,YAAY,EAAI,UAAU,GAAO,CAAI,IAAI;AACtD"}
+{"version":3,"file":"admins-components59.js","names":[],"sources":["../src/composables/useSelection.ts"],"sourcesContent":["import { ref, computed } from 'vue'\n\nexport function useSelection(\n  getItems: () => Record<string, unknown>[],\n  getAttr: () => string | undefined,\n  emit: (selected: unknown[]) => void,\n) {\n  const selectedKeys = ref<Set<unknown>>(new Set())\n\n  const allSelected = computed(() => {\n    const attr = getAttr()\n    const items = getItems()\n    return items.length > 0 && attr != null && items.every((i) => selectedKeys.value.has(i[attr]))\n  })\n\n  function toggle(item: Record<string, unknown>) {\n    const key = item[getAttr()!]\n    if (selectedKeys.value.has(key)) {\n      selectedKeys.value.delete(key)\n    } else {\n      selectedKeys.value.add(key)\n    }\n    emit([...selectedKeys.value])\n  }\n\n  function toggleAll() {\n    const attr = getAttr()!\n    if (allSelected.value) {\n      selectedKeys.value.clear()\n    } else {\n      for (const item of getItems()) {\n        selectedKeys.value.add(item[attr])\n      }\n    }\n    emit([...selectedKeys.value])\n  }\n\n  return { selectedKeys, allSelected, toggle, toggleAll }\n}\n"],"mappings":";;AAEA,SAAgB,EACd,GACA,GACA,GACA;CACA,IAAM,IAAe,kBAAkB,IAAI,IAAI,CAAC,GAE1C,IAAc,QAAe;EACjC,IAAM,IAAO,EAAQ,GACf,IAAQ,EAAS;EACvB,OAAO,EAAM,SAAS,KAAK,KAAQ,QAAQ,EAAM,OAAO,MAAM,EAAa,MAAM,IAAI,EAAE,EAAK,CAAC;CAC/F,CAAC;CAED,SAAS,EAAO,GAA+B;EAC7C,IAAM,IAAM,EAAK,EAAQ;EAMzB,AALI,EAAa,MAAM,IAAI,CAAG,IAC5B,EAAa,MAAM,OAAO,CAAG,IAE7B,EAAa,MAAM,IAAI,CAAG,GAE5B,EAAK,CAAC,GAAG,EAAa,KAAK,CAAC;CAC9B;CAEA,SAAS,IAAY;EACnB,IAAM,IAAO,EAAQ;EACrB,IAAI,EAAY,OACd,EAAa,MAAM,MAAM;OAEzB,KAAK,IAAM,KAAQ,EAAS,GAC1B,EAAa,MAAM,IAAI,EAAK,EAAK;EAGrC,EAAK,CAAC,GAAG,EAAa,KAAK,CAAC;CAC9B;CAEA,OAAO;EAAE;EAAc;EAAa;EAAQ;CAAU;AACxD"}

package/dist/admins-components6.js.map

@@ -1 +1 @@
-{"version":3,"file":"admins-components6.js","names":[],"sources":["../src/components/Button.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ButtonType = 'normal' | 'primary' | 'dark' | 'success' | 'error' | 'warning' | 'info'\n\nexport type IconPosition = 'left' | 'right'\n\nexport interface ButtonProps {\n  size?: ControlSize\n  type?: ButtonType\n  outline?: boolean\n  icon?: string\n  iconPosition?: IconPosition\n  label?: string\n  ariaLabel?: string\n  callback?: () => void\n  disabled?: boolean | (() => boolean)\n  indicator?: string | number\n  labelAlignmentFix?: boolean\n  class?: string\n}\n\nexport const buttonDefaults = {\n  size: 'normal' as ControlSize,\n  type: 'normal' as ButtonType,\n  outline: false,\n  icon: undefined,\n  iconPosition: 'left' as IconPosition,\n  labelAlignmentFix: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ControlSize } from '@/types/types'\nimport { sizeToClass, typeToClass } from '@/utils/dom'\nimport { computed } from 'vue'\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n  ...buttonDefaults,\n})\n\nconst classes = computed(() => [\n  'c-btn',\n  sizeToClass(props.size, 'c-btn'),\n  props.outline && 'c-btn-outline',\n  typeToClass(props.type, 'c-btn'),\n  props.class,\n])\n\nconst isDisabled = computed(() => {\n  if (props.disabled === undefined || props.disabled === null) return false\n  return typeof props.disabled === 'function' ? props.disabled() : props.disabled\n})\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    :class=\"classes\"\n    :aria-label=\"ariaLabel ?? label\"\n    :title=\"ariaLabel ?? label\"\n    @click=\"callback?.()\"\n    :disabled=\"isDisabled\"\n  >\n    <i v-if=\"icon && iconPosition === 'left'\" :class=\"icon\"></i>\n    <span v-if=\"label\">{{ label }}</span>\n    <span\n      v-if=\"indicator != null && indicator !== ''\"\n      class=\"c-btn-indicator\"\n      :aria-label=\"`${indicator}`\"\n    >\n      {{ indicator }}\n    </span>\n    <i v-if=\"icon && iconPosition === 'right'\" :class=\"icon\"></i>\n  </button>\n</template>\n"],"mappings":""}
+{"version":3,"file":"admins-components6.js","names":[],"sources":["../src/components/Button.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ButtonType = 'normal' | 'primary' | 'dark' | 'success' | 'error' | 'warning' | 'info'\n\nexport type IconPosition = 'left' | 'right'\n\nexport interface ButtonProps {\n  size?: ControlSize\n  type?: ButtonType\n  outline?: boolean\n  icon?: string\n  iconPosition?: IconPosition\n  label?: string\n  ariaLabel?: string\n  callback?: () => void\n  disabled?: boolean | (() => boolean)\n  indicator?: string | number\n  labelAlignmentFix?: boolean\n  class?: string\n}\n\nexport const buttonDefaults = {\n  size: 'normal' as ControlSize,\n  type: 'normal' as ButtonType,\n  outline: false,\n  icon: undefined,\n  iconPosition: 'left' as IconPosition,\n  labelAlignmentFix: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ControlSize } from '@/types/types'\nimport { sizeToClass, typeToClass } from '@/utils/dom'\nimport { computed } from 'vue'\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n  ...buttonDefaults,\n})\n\nconst classes = computed(() => [\n  'c-btn',\n  sizeToClass(props.size, 'c-btn'),\n  props.outline && 'c-btn-outline',\n  typeToClass(props.type, 'c-btn'),\n  props.class,\n])\n\nconst isDisabled = computed(() => {\n  if (props.disabled === undefined || props.disabled === null) return false\n  return typeof props.disabled === 'function' ? props.disabled() : props.disabled\n})\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    :class=\"classes\"\n    :aria-label=\"ariaLabel ?? label\"\n    :title=\"ariaLabel ?? label\"\n    @click=\"callback?.()\"\n    :disabled=\"isDisabled\"\n  >\n    <i v-if=\"icon && iconPosition === 'left'\" :class=\"icon\"></i>\n    <span v-if=\"label\" class=\"btn-label\">{{ label }}</span>\n    <span\n      v-if=\"indicator != null && indicator !== ''\"\n      class=\"c-btn-indicator\"\n      :aria-label=\"`${indicator}`\"\n    >\n      {{ indicator }}\n    </span>\n    <i v-if=\"icon && iconPosition === 'right'\" :class=\"icon\"></i>\n  </button>\n</template>\n"],"mappings":""}

package/dist/admins-components60.js

@@ -1,32 +1,10 @@
-import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, defineComponent as i, normalizeClass as a, openBlock as o, ref as s, renderList as c, toDisplayString as l } from "vue";
-//#region src/components/data-table/TagList.vue?vue&type=script&setup=true&lang.ts
-var u = ["aria-expanded", "title"], d = /* @__PURE__ */ i({
-	__name: "TagList",
-	props: {
-		items: { default: () => [] },
-		visibleCount: { default: 3 },
-		class: { default: void 0 }
-	},
-	setup(i) {
-		let d = i, f = s(!1), p = t(() => d.items.length), m = t(() => Math.max(0, p.value - d.visibleCount)), h = t(() => f.value || p.value <= d.visibleCount ? d.items : d.items.slice(0, d.visibleCount)), g = t(() => f.value ? 0 : m.value);
-		function _(e) {
-			return e == null ? "" : typeof e == "string" ? e : e.label ?? (e.id == null ? "" : String(e.id));
-		}
-		function v() {
-			f.value = !f.value;
-		}
-		return (t, i) => (o(), r("span", { class: a(["tag-list", d.class]) }, [(o(!0), r(e, null, c(h.value, (e, t) => (o(), r("span", {
-			key: t,
-			class: "tag-list__item"
-		}, l(_(e)) + l(t < h.value.length - 1 ? "," : ""), 1))), 128)), g.value > 0 ? (o(), r("button", {
-			key: 0,
-			type: "button",
-			class: "tag-list__toggle",
-			"aria-expanded": f.value,
-			title: f.value ? "Összecsukás" : `További ${g.value} megjelenítése`,
-			onClick: v
-		}, " +" + l(g.value), 9, u)) : n("", !0)], 2));
-	}
-});
+//#region src/types/data-list.ts
+var e = {
+	striped: !0,
+	compact: !1
+}, t = { compact: !1 }, n = {
+	layout: "screen",
+	compact: !1
+};
 //#endregion
-export { d as default };
+export { t as dataCardsSettingsDefaults, n as dataListSettingsDefaults, e as dataTableSettingsDefaults };