@v1nt1248/3nclient-lib 0.3.29 → 0.3.31

package/dist/ui3n-components.js

@@ -1,9 +1,9 @@
 import { $ as e, B as t, Q as n, R as r, T as i, V as a, X as o, Z as s, at as c, ct as l, dt as u, et as d, ft as f, ht as p, it as m, lt as h, mt as g, nt as _, o as v, ot as y, pt as b, rt as x, st as S, t as C, tt as w, ut as T, v as ee, z as E } from "./chunks/plugins-keys-jqAZ5D94.js";
-import { a as te, i as D, n as O, r as ne, t as k } from "./chunks/ui3n-notification-Dr_3Td9N.js";
-import { t as re } from "./chunks/emoticons-DMgiBINj.js";
-import ie from "sanitize-html";
-import { autoUpdate as A, computePosition as ae, offset as oe } from "@floating-ui/dom";
-import { Fragment as j, Teleport as se, Transition as ce, TransitionGroup as le, computed as M, createBlock as N, createCommentVNode as P, createElementBlock as F, createElementVNode as I, createTextVNode as ue, createVNode as L, defineComponent as R, getCurrentInstance as de, inject as fe, mergeProps as pe, nextTick as me, normalizeClass as z, normalizeStyle as B, onBeforeMount as he, onBeforeUnmount as V, onMounted as H, openBlock as U, provide as ge, ref as W, renderList as G, renderSlot as K, resolveDynamicComponent as _e, shallowRef as ve, toDisplayString as q, toHandlers as ye, unref as J, useCssModule as be, useCssVars as xe, useSlots as Se, useTemplateRef as Ce, vModelText as we, watch as Y, withCtx as X, withDirectives as Te, withKeys as Z, withModifiers as Q } from "vue";
+import { a as te, i as D, n as O, r as k, t as A } from "./chunks/ui3n-notification-DPC5Ke4b.js";
+import { t as ne } from "./chunks/emoticons-DMgiBINj.js";
+import re from "sanitize-html";
+import { autoUpdate as j, computePosition as ie, offset as ae } from "@floating-ui/dom";
+import { Fragment as M, Teleport as oe, Transition as se, TransitionGroup as ce, computed as N, createBlock as P, createCommentVNode as F, createElementBlock as I, createElementVNode as L, createTextVNode as le, createVNode as R, defineComponent as z, inject as ue, mergeProps as de, nextTick as fe, normalizeClass as B, normalizeStyle as V, onBeforeMount as pe, onBeforeUnmount as me, onMounted as H, onUnmounted as he, openBlock as U, provide as ge, ref as W, renderList as G, renderSlot as K, resolveDynamicComponent as _e, shallowRef as ve, toDisplayString as q, toHandlers as ye, unref as J, useCssModule as be, useCssVars as xe, useSlots as Se, useTemplateRef as Ce, vModelText as we, watch as Y, withCtx as X, withDirectives as Te, withKeys as Z, withModifiers as Q } from "vue";
 import { arrow as Ee, autoUpdate as De, flip as Oe, offset as ke, shift as Ae, useFloating as je } from "@floating-ui/vue";
 //#region node_modules/.pnpm/lodash@4.18.1/node_modules/lodash/_arrayMap.js
 var Me = /* @__PURE__ */ g(((e, t) => {
@@ -508,39 +508,39 @@ var Me = /* @__PURE__ */ g(((e, t) => {
 	var n = qt(), r = x(), i = _(), a = i && i.isSet;
 	t.exports = a ? r(a) : n;
 })), Yt = /* @__PURE__ */ g(((e, t) => {
-	var n = st(), r = ct(), i = dt(), a = _t(), s = xt(), l = St(), u = Ct(), d = Dt(), f = jt(), p = Nt(), h = Pt(), g = o(), _ = Ft(), v = Ht(), y = Wt(), b = c(), x = m(), S = Kt(), C = T(), w = Jt(), ee = gt(), E = bt(), te = 1, D = 2, O = 4, ne = "[object Arguments]", k = "[object Array]", re = "[object Boolean]", ie = "[object Date]", A = "[object Error]", ae = "[object Function]", oe = "[object GeneratorFunction]", j = "[object Map]", se = "[object Number]", ce = "[object Object]", le = "[object RegExp]", M = "[object Set]", N = "[object String]", P = "[object Symbol]", F = "[object WeakMap]", I = "[object ArrayBuffer]", ue = "[object DataView]", L = "[object Float32Array]", R = "[object Float64Array]", de = "[object Int8Array]", fe = "[object Int16Array]", pe = "[object Int32Array]", me = "[object Uint8Array]", z = "[object Uint8ClampedArray]", B = "[object Uint16Array]", he = "[object Uint32Array]", V = {};
-	V[ne] = V[k] = V[I] = V[ue] = V[re] = V[ie] = V[L] = V[R] = V[de] = V[fe] = V[pe] = V[j] = V[se] = V[ce] = V[le] = V[M] = V[N] = V[P] = V[me] = V[z] = V[B] = V[he] = !0, V[A] = V[ae] = V[F] = !1;
-	function H(e, t, o, c, m, T) {
-		var k, re = t & te, ie = t & D, A = t & O;
-		if (o && (k = m ? o(e, c, m, T) : o(e)), k !== void 0) return k;
+	var n = st(), r = ct(), i = dt(), a = _t(), s = xt(), l = St(), u = Ct(), d = Dt(), f = jt(), p = Nt(), h = Pt(), g = o(), _ = Ft(), v = Ht(), y = Wt(), b = c(), x = m(), S = Kt(), C = T(), w = Jt(), ee = gt(), E = bt(), te = 1, D = 2, O = 4, k = "[object Arguments]", A = "[object Array]", ne = "[object Boolean]", re = "[object Date]", j = "[object Error]", ie = "[object Function]", ae = "[object GeneratorFunction]", M = "[object Map]", oe = "[object Number]", se = "[object Object]", ce = "[object RegExp]", N = "[object Set]", P = "[object String]", F = "[object Symbol]", I = "[object WeakMap]", L = "[object ArrayBuffer]", le = "[object DataView]", R = "[object Float32Array]", z = "[object Float64Array]", ue = "[object Int8Array]", de = "[object Int16Array]", fe = "[object Int32Array]", B = "[object Uint8Array]", V = "[object Uint8ClampedArray]", pe = "[object Uint16Array]", me = "[object Uint32Array]", H = {};
+	H[k] = H[A] = H[L] = H[le] = H[ne] = H[re] = H[R] = H[z] = H[ue] = H[de] = H[fe] = H[M] = H[oe] = H[se] = H[ce] = H[N] = H[P] = H[F] = H[B] = H[V] = H[pe] = H[me] = !0, H[j] = H[ie] = H[I] = !1;
+	function he(e, t, o, c, m, T) {
+		var A, ne = t & te, re = t & D, j = t & O;
+		if (o && (A = m ? o(e, c, m, T) : o(e)), A !== void 0) return A;
 		if (!C(e)) return e;
-		var j = b(e);
-		if (j) {
-			if (k = _(e), !re) return u(e, k);
+		var M = b(e);
+		if (M) {
+			if (A = _(e), !ne) return u(e, A);
 		} else {
-			var se = g(e), le = se == ae || se == oe;
-			if (x(e)) return l(e, re);
-			if (se == ce || se == ne || le && !m) {
-				if (k = ie || le ? {} : y(e), !re) return ie ? f(e, s(k, e)) : d(e, a(k, e));
+			var oe = g(e), ce = oe == ie || oe == ae;
+			if (x(e)) return l(e, ne);
+			if (oe == se || oe == k || ce && !m) {
+				if (A = re || ce ? {} : y(e), !ne) return re ? f(e, s(A, e)) : d(e, a(A, e));
 			} else {
-				if (!V[se]) return m ? e : {};
-				k = v(e, se, re);
+				if (!H[oe]) return m ? e : {};
+				A = v(e, oe, ne);
 			}
 		}
 		T ||= new n();
-		var M = T.get(e);
-		if (M) return M;
-		T.set(e, k), w(e) ? e.forEach(function(n) {
-			k.add(H(n, t, o, n, e, T));
+		var N = T.get(e);
+		if (N) return N;
+		T.set(e, A), w(e) ? e.forEach(function(n) {
+			A.add(he(n, t, o, n, e, T));
 		}) : S(e) && e.forEach(function(n, r) {
-			k.set(r, H(n, t, o, r, e, T));
+			A.set(r, he(n, t, o, r, e, T));
 		});
-		var N = j ? void 0 : (A ? ie ? h : p : ie ? E : ee)(e);
-		return r(N || e, function(n, r) {
-			N && (r = n, n = e[r]), i(k, r, H(n, t, o, r, e, T));
-		}), k;
+		var P = M ? void 0 : (j ? re ? h : p : re ? E : ee)(e);
+		return r(P || e, function(n, r) {
+			P && (r = n, n = e[r]), i(A, r, he(n, t, o, r, e, T));
+		}), A;
 	}
-	t.exports = H;
+	t.exports = he;
 })), Xt = /* @__PURE__ */ g(((e, t) => {
 	var n = u(), r = S(), i = "[object Symbol]";
 	function a(e) {
@@ -783,11 +783,11 @@ function Tn(e, t) {
 		return;
 	}
 	if (typeof r == "string") {
-		e.innerHTML = ie(r);
+		e.innerHTML = re(r);
 		return;
 	}
 	try {
-		e.innerHTML = ie(r.dirty, { ...(0, wn.default)(r, "dirty") });
+		e.innerHTML = re(r.dirty, { ...(0, wn.default)(r, "dirty") });
 		return;
 	} catch (e) {
 		throw Error("[v-ui3n-html] ", e);
@@ -946,11 +946,11 @@ function Wn(e, t, n) {
 		return;
 	}
 	let f = document.getElementById(zn), p = f || document.createElement("div");
-	f || (p.id = zn, p.classList.add("ui3n-title")), p.innerHTML = r, p.style.maxWidth = `${i}px`, p.style.color = a, p.style.backgroundColor = o, Object.keys(d).length && Object.assign(p.style, d), e.insertAdjacentElement("beforeend", p), Rn = A(e, p, () => {
-		ae(e, p, {
+	f || (p.id = zn, p.classList.add("ui3n-title")), p.innerHTML = r, p.style.maxWidth = `${i}px`, p.style.color = a, p.style.backgroundColor = o, Object.keys(d).length && Object.assign(p.style, d), e.insertAdjacentElement("beforeend", p), Rn = j(e, p, () => {
+		ie(e, p, {
 			placement: s,
 			strategy: c,
-			middleware: [oe(Hn(s, l, u))]
+			middleware: [ae(Hn(s, l, u))]
 		}).then(({ x: e, y: t }) => {
 			Object.assign(p.style, {
 				left: `${e}px`,
@@ -1049,7 +1049,7 @@ var Qn = {
 		}, a = Jn(t);
 		n.removeEventListener("pointerdown", a.pointerdownEvent, i), n.removeEventListener("pointerup", a.pointerupEvent, i), n.removeEventListener("pointermove", a.pointermoveEvent, i);
 	}
-}, $n = ["id"], er = /* @__PURE__ */ D(/* @__PURE__ */ R({
+}, $n = ["id"], er = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-chip",
 	props: {
 		id: {},
@@ -1074,29 +1074,29 @@ var Qn = {
 	},
 	emits: ["close", "click"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, i = Se(), a = M(() => {
+		let n = e, r = t, i = Se(), a = N(() => {
 			let e = Number(n.height);
 			return isNaN(e) ? 24 : e;
-		}), o = M(() => `${a.value}px`), s = M(() => a.value - 4), c = M(() => {
+		}), o = N(() => `${a.value}px`), s = N(() => a.value - 4), c = N(() => {
 			let e = Math.round(a.value / 3);
 			return p.value ? `0 ${e}px 0 4px` : `0 ${e}px`;
-		}), l = M(() => {
+		}), l = N(() => {
 			let e = Number(n.maxWidth);
 			return isNaN(e) ? String(n.maxWidth) : `${e}px`;
-		}), u = M(() => n.color), d = M(() => {
+		}), u = N(() => n.color), d = N(() => {
 			let e = Number(n.textSize);
 			return isNaN(e) ? String(n.textSize) : `${e}px`;
-		}), f = M(() => n.textColor), p = M(() => !!i.left);
-		return (t, n) => (U(), F("div", {
+		}), f = N(() => n.textColor), p = N(() => !!i.left);
+		return (t, n) => (U(), I("div", {
 			id: e.id,
-			class: z([
+			class: B([
 				t.$style.ui3nChip,
 				e.round && t.$style.round,
 				e.plain && t.$style.plain,
 				e.closeable && t.$style.closeable,
 				p.value && t.$style.withIcon
 			]),
-			style: B({
+			style: V({
 				"--ui3n-chip-height": o.value,
 				"--ui3n-chip-max-width": l.value,
 				"--ui3n-chip-padding": c.value,
@@ -1106,12 +1106,12 @@ var Qn = {
 			}),
 			onClick: n[1] ||= (e) => r("click", e)
 		}, [
-			I("div", { class: z(t.$style.ui3nChipIcon) }, [K(t.$slots, "left", {
+			L("div", { class: B(t.$style.ui3nChipIcon) }, [K(t.$slots, "left", {
 				size: s.value,
 				color: f.value
 			})], 2),
-			I("div", { class: z(t.$style.ui3nChipBody) }, [K(t.$slots, "default")], 2),
-			e.closeable ? (U(), N(O, {
+			L("div", { class: B(t.$style.ui3nChipBody) }, [K(t.$slots, "default")], 2),
+			e.closeable ? (U(), P(O, {
 				key: 0,
 				type: "icon",
 				size: "small",
@@ -1120,7 +1120,7 @@ var Qn = {
 				"icon-color": "var(--color-icon-control-primary-default)",
 				disabled: e.disabled,
 				onClick: n[0] ||= Q((e) => r("close"), ["stop", "prevent"])
-			}, null, 8, ["disabled"])) : P("", !0)
+			}, null, 8, ["disabled"])) : F("", !0)
 		], 14, $n));
 	}
 }), [["__cssModules", { $style: {
@@ -1133,7 +1133,7 @@ var Qn = {
 	ui3nChipIcon: "_ui3nChipIcon_prky3_33",
 	round: "_round_prky3_41",
 	plain: "_plain_prky3_50"
-} }]]), tr = ["name"], nr = ["width", "height"], rr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), tr = ["name"], nr = ["width", "height"], rr = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-drop-files",
 	props: {
 		name: { default: void 0 },
@@ -1184,10 +1184,10 @@ var Qn = {
 			!e && s.value && (s.value.value = "");
 		}), H(() => {
 			_();
-		}), (t, n) => Te((U(), F("div", {
+		}), (t, n) => Te((U(), I("div", {
 			ref_key: "wrapperElement",
 			ref: o,
-			class: z([
+			class: B([
 				t.$style.ui3nDropFiles,
 				e.permanentDisplay && t.$style.ui3nDropFilesWithBorder,
 				(l.value || u.value) && t.$style.ui3nDropFilesWithAccentBorder
@@ -1196,7 +1196,7 @@ var Qn = {
 			onDragover: n[2] ||= Q(() => {}, ["prevent"]),
 			onDragleave: f
 		}, [
-			e.name ? (U(), F("input", {
+			e.name ? (U(), I("input", {
 				key: 0,
 				ref_key: "fileInput",
 				ref: s,
@@ -1204,33 +1204,33 @@ var Qn = {
 				name: e.name,
 				multiple: "",
 				hidden: ""
-			}, null, 8, tr)) : P("", !0),
+			}, null, 8, tr)) : F("", !0),
 			K(t.$slots, "default"),
-			e.permanentDisplay || l.value || u.value ? (U(), F("div", {
+			e.permanentDisplay || l.value || u.value ? (U(), I("div", {
 				key: 1,
-				class: z(t.$style.ui3nDropFilesDropzone),
+				class: B(t.$style.ui3nDropFilesDropzone),
 				onDragenter: m,
 				onDragover: p,
 				onDragleave: h,
 				onDrop: g
 			}, [
-				I("h3", { class: z(t.$style.ui3nDropFilesDropzoneTitle) }, q(e.title), 3),
-				I("div", { class: z(t.$style.ui3nDropFilesDropzoneIcon) }, [(U(), F("svg", {
+				L("h3", { class: B(t.$style.ui3nDropFilesDropzoneTitle) }, q(e.title), 3),
+				L("div", { class: B(t.$style.ui3nDropFilesDropzoneIcon) }, [(U(), I("svg", {
 					width: c.value * .35,
 					height: c.value * .35,
 					viewBox: "0 0 192 192",
 					fill: "none",
 					xmlns: "http://www.w3.org/2000/svg"
-				}, [...n[3] ||= [I("path", {
+				}, [...n[3] ||= [L("path", {
 					d: "M51 152C47.9333 152 45.3333 150.934 43.2 148.8C41.0667 146.667 40 144.067 40 141V119.8H46.2V141C46.2 142.2 46.7 143.3 47.7 144.3C48.7 145.3 49.8 145.8 51 145.8H141C142.2 145.8 143.3 145.3 144.3 144.3C145.3 143.3 145.8 142.2 145.8 141V119.8H152V141C152 144.067 150.933 146.667 148.8 148.8C146.667 150.934 144.067 152 141 152H51ZM93 122.4V49.2002L72.8 69.2002L68.4 65.0002L96 37.2002L123.6 65.0002L119.2 69.2002L99 49.2002V122.4H93Z",
 					fill: "var(--color-icon-control-primary-default)"
 				}, null, -1)]], 8, nr))], 2),
-				I("div", {
-					class: z(t.$style.ui3nDropFilesDropzoneAdditional),
+				L("div", {
+					class: B(t.$style.ui3nDropFilesDropzoneAdditional),
 					onDragenter: n[0] ||= Q(() => {}, ["stop", "prevent"]),
 					onDragleave: n[1] ||= Q(() => {}, ["stop", "prevent"])
 				}, [K(t.$slots, "additional-text")], 34)
-			], 34)) : P("", !0)
+			], 34)) : F("", !0)
 		], 34)), [[J(r), () => _()]]);
 	}
 }), [["__cssModules", { $style: {
@@ -1241,7 +1241,7 @@ var Qn = {
 	ui3nDropFilesDropzoneTitle: "_ui3nDropFilesDropzoneTitle_gssdx_33",
 	ui3nDropFilesDropzoneIcon: "_ui3nDropFilesDropzoneIcon_gssdx_41",
 	ui3nDropFilesDropzoneAdditional: "_ui3nDropFilesDropzoneAdditional_gssdx_53"
-} }]]), ir = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), ir = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-emoji",
 	props: {
 		emoji: {},
@@ -1253,26 +1253,28 @@ var Qn = {
 	},
 	emits: ["click"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, i = W(null), a = M(() => re[n.emoji]);
-		H(() => {
-			i.value && i.value.style.setProperty("--ui3n-emoji-size", `${n.size}px`);
-		}), Y(() => n.emoji, (e) => {
-			Object.keys(re).includes(e) || console.error(`[Ui3nEmoji] Invalid emoticon: ${e}`);
-		}, { immediate: !0 }), Y(() => n.size, (e, t) => {
-			i.value && e && e !== t && i.value.style.setProperty("--ui3n-emoji-size", `${e}px`);
+		let n = e, r = t, i = W(null), a = N(() => ne[n.emoji]), o = N(() => {
+			let e = isNaN(Number(n.size)) ? String(n.size) : `${n.size}px`;
+			return {
+				"--ui3n-emoji-size": e,
+				"line-height": e
+			};
 		});
-		let o = (e) => {
-			e.stopImmediatePropagation(), r("click", e);
-		};
-		return (t, n) => (U(), F("div", pe({
+		function s(e) {
+			e.stopPropagation(), r("click", e);
+		}
+		return Y(() => n.emoji, (e) => {
+			Object.keys(ne).includes(e) || console.error(`[Ui3nEmoji] Invalid emoticon: ${e}`);
+		}, { immediate: !0 }), (t, n) => (U(), I("div", de({
 			ref_key: "emojiElement",
 			ref: i,
-			class: [t.$style.ui3nEmoji, e.readonly && t.$style.readonly]
-		}, ye(e.readonly ? {} : { click: o }, !0)), q(a.value && a.value.value), 17));
+			class: [t.$style.ui3nEmoji, e.readonly && t.$style.readonly],
+			style: o.value
+		}, ye(e.readonly ? {} : { click: s }, !0)), q(a.value && a.value.value), 17));
 	}
 }), [["__cssModules", { $style: {
-	ui3nEmoji: "_ui3nEmoji_2j41l_1",
-	readonly: "_readonly_2j41l_14"
+	ui3nEmoji: "_ui3nEmoji_12jhb_1",
+	readonly: "_readonly_12jhb_15"
 } }]]), ar = ["id"], or = [
 	"autocomplete",
 	"type",
@@ -1281,8 +1283,9 @@ var Qn = {
 	"readonly",
 	"name",
 	"maxlength",
-	"minlength"
-], sr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	"minlength",
+	"value"
+], sr = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-input",
 	props: {
 		id: {},
@@ -1341,24 +1344,24 @@ var Qn = {
 		"update:valid"
 	],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, a = Se(), o = W(null), s = W(""), c = W(!1), l = W(!1), u = W(""), d = M(() => !!a["prepend-icon"]), f = M(() => !!a["append-icon"]), p = M(() => r.displayStateMode === "success" && r.displayStateWithIcon && !l.value), m = M(() => !r.disabled && r.clearable && !!s.value && !p.value), h = M(() => p.value || m.value || f.value), g = M(() => !!u.value || !!(r.displayStateMode && r.displayStateMessage)), _ = M(() => !!u.value || r.displayStateMode === "error" && !!r.displayStateMessage), v = M(() => r.displayStateMode === "success" && !!r.displayStateMessage);
+		let r = e, i = n, a = Se(), o = W(null), s = W(""), c = W(!1), l = W(!1), u = W(""), d = N(() => !!a["prepend-icon"]), f = N(() => !!a["append-icon"]), p = N(() => r.displayStateMode === "success" && r.displayStateWithIcon && !l.value), m = N(() => !r.disabled && r.clearable && !!s.value && !p.value), h = N(() => p.value || m.value || f.value), g = N(() => !!u.value || !!(r.displayStateMode && r.displayStateMessage)), _ = N(() => !!u.value || r.displayStateMode === "error" && !!r.displayStateMessage), v = N(() => r.displayStateMode === "success" && !!r.displayStateMessage);
 		function y(e) {
 			return e.target.value;
 		}
-		function b(e) {
-			let t = [];
-			for (let n of r.rules) {
-				if (typeof n != "function") continue;
-				let r = n(e);
-				typeof r == "string" ? t.push(r) : r || t.push("Invalid");
+		function b(e, t = !1) {
+			let n = [];
+			for (let t of r.rules) {
+				if (typeof t != "function") continue;
+				let r = t(e);
+				typeof r == "string" ? n.push(r) : r || n.push("Invalid");
 			}
-			u.value = t.join(". "), (c.value || r.validateAtStartup) && i("update:valid", t.length === 0);
+			u.value = n.join(". "), (c.value || r.validateAtStartup || t) && i("update:valid", n.length === 0);
 		}
 		function x(e) {
 			l.value = !0, i("focus", e);
 		}
 		function S(e) {
-			me(() => {
+			fe(() => {
 				l.value = !1, i("blur", e);
 			});
 		}
@@ -1395,15 +1398,15 @@ var Qn = {
 			isFocused: l,
 			clearValue: te
 		}), H(() => {
-			s.value = r.modelValue ?? "", o.value && (o.value.value = s.value, r.autofocus && o.value.focus(), i("init", o.value)), r.validateAtStartup && (c.value = !0, b(s.value));
+			s.value = r.modelValue ?? "", o.value && (i("init", o.value), r.autofocus && o.value.focus()), r.validateAtStartup && (c.value = !0, b(s.value));
 		}), Y(() => r.modelValue, (e) => {
 			let t = e ?? "";
-			t !== s.value && (s.value = t, o.value && (o.value.value = t), b(t));
+			t !== s.value && (s.value = t, b(t, !0));
 		}), Y(() => r.name, (e) => {
 			e || te();
-		}), (t, n) => (U(), F("div", {
+		}), (t, n) => (U(), I("div", {
 			id: e.id,
-			class: z([
+			class: B([
 				t.$style.ui3nInput,
 				e.size === "large" && t.$style.large,
 				e.label && t.$style.withLabel,
@@ -1413,20 +1416,20 @@ var Qn = {
 				e.displayStateMode === "success" && t.$style.success
 			])
 		}, [
-			e.label ? (U(), F("label", {
+			e.label ? (U(), I("label", {
 				key: 0,
-				class: z(t.$style.ui3nInputLabel)
-			}, q(e.label), 3)) : P("", !0),
-			I("div", { class: z([
+				class: B(t.$style.ui3nInputLabel)
+			}, q(e.label), 3)) : F("", !0),
+			L("div", { class: B([
 				t.$style.inputWrapper,
 				d.value && t.$style.withPrepend,
 				h.value && t.$style.withAppend
 			]) }, [
-				d.value ? (U(), F("div", {
+				d.value ? (U(), I("div", {
 					key: 0,
-					class: z(t.$style.prependIconSlot)
-				}, [K(t.$slots, "prepend-icon")], 2)) : P("", !0),
-				I("input", {
+					class: B(t.$style.prependIconSlot)
+				}, [K(t.$slots, "prepend-icon")], 2)) : F("", !0),
+				L("input", {
 					ref_key: "inputElement",
 					ref: o,
 					autocomplete: e.autocomplete,
@@ -1437,7 +1440,8 @@ var Qn = {
 					name: e.name,
 					maxlength: e.maxlength,
 					minlength: e.minlength,
-					class: z(t.$style.ui3nInputField),
+					value: s.value,
+					class: B(t.$style.ui3nInputField),
 					onInput: w,
 					onKeydown: [
 						Z(T, ["enter"]),
@@ -1448,18 +1452,18 @@ var Qn = {
 					onBlur: S,
 					onChange: C
 				}, null, 42, or),
-				h.value ? (U(), F("div", {
+				h.value ? (U(), I("div", {
 					key: 1,
-					class: z(t.$style.appendIconSlot)
+					class: B(t.$style.appendIconSlot)
 				}, [
-					p.value ? (U(), N(ne, {
+					p.value ? (U(), P(k, {
 						key: 0,
 						icon: "round-check-circle-outline",
 						size: 16,
 						color: "var(--success-content-default)",
-						class: z(t.$style.appendSlotItem)
-					}, null, 8, ["class"])) : P("", !0),
-					m.value ? (U(), N(O, {
+						class: B(t.$style.appendSlotItem)
+					}, null, 8, ["class"])) : F("", !0),
+					m.value ? (U(), P(O, {
 						key: 1,
 						type: "icon",
 						size: "small",
@@ -1467,43 +1471,43 @@ var Qn = {
 						icon: "round-close",
 						"icon-size": "16",
 						"icon-color": "var(--color-icon-control-accent-default)",
-						class: z(t.$style.appendSlotItem),
+						class: B(t.$style.appendSlotItem),
 						onMousedown: n[0] ||= Q(() => {}, ["prevent"]),
 						onTouchstart: n[1] ||= Q(() => {}, ["prevent"]),
 						onClick: te
-					}, null, 8, ["class"])) : P("", !0),
-					f.value ? K(t.$slots, "append-icon", { key: 2 }) : P("", !0)
-				], 2)) : P("", !0)
+					}, null, 8, ["class"])) : F("", !0),
+					f.value ? K(t.$slots, "append-icon", { key: 2 }) : F("", !0)
+				], 2)) : F("", !0)
 			], 2),
-			g.value ? (U(), F("div", {
+			g.value ? (U(), I("div", {
 				key: 1,
-				class: z([
+				class: B([
 					t.$style.ui3nInputFieldMessage,
 					_.value && t.$style.ui3nInputErrorMessage,
 					v.value && t.$style.ui3nInputSuccessMessage
 				])
-			}, q(u.value || e.displayStateMessage), 3)) : P("", !0)
+			}, q(u.value || e.displayStateMessage), 3)) : F("", !0)
 		], 10, ar));
 	}
 }), [["__cssModules", { $style: {
-	ui3nInput: "_ui3nInput_1x29a_1",
-	withLabel: "_withLabel_1x29a_13",
-	large: "_large_1x29a_18",
-	withoutBottomSpace: "_withoutBottomSpace_1x29a_30",
-	inputWrapper: "_inputWrapper_1x29a_33",
-	ui3nInputField: "_ui3nInputField_1x29a_36",
-	ui3nInputLabel: "_ui3nInputLabel_1x29a_44",
-	prependIconSlot: "_prependIconSlot_1x29a_97",
-	appendIconSlot: "_appendIconSlot_1x29a_104",
-	withPrepend: "_withPrepend_1x29a_112",
-	withAppend: "_withAppend_1x29a_116",
-	appendSlotItem: "_appendSlotItem_1x29a_120",
-	ui3nInputFieldMessage: "_ui3nInputFieldMessage_1x29a_124",
-	ui3nInputErrorMessage: "_ui3nInputErrorMessage_1x29a_135",
-	ui3nInputSuccessMessage: "_ui3nInputSuccessMessage_1x29a_139",
-	error: "_error_1x29a_143",
-	success: "_success_1x29a_150",
-	disabled: "_disabled_1x29a_154"
+	ui3nInput: "_ui3nInput_dhax2_1",
+	withLabel: "_withLabel_dhax2_13",
+	large: "_large_dhax2_18",
+	withoutBottomSpace: "_withoutBottomSpace_dhax2_30",
+	inputWrapper: "_inputWrapper_dhax2_33",
+	ui3nInputField: "_ui3nInputField_dhax2_36",
+	ui3nInputLabel: "_ui3nInputLabel_dhax2_44",
+	prependIconSlot: "_prependIconSlot_dhax2_97",
+	appendIconSlot: "_appendIconSlot_dhax2_104",
+	withPrepend: "_withPrepend_dhax2_112",
+	withAppend: "_withAppend_dhax2_116",
+	appendSlotItem: "_appendSlotItem_dhax2_120",
+	ui3nInputFieldMessage: "_ui3nInputFieldMessage_dhax2_124",
+	ui3nInputErrorMessage: "_ui3nInputErrorMessage_dhax2_135",
+	ui3nInputSuccessMessage: "_ui3nInputSuccessMessage_dhax2_139",
+	error: "_error_dhax2_143",
+	success: "_success_dhax2_155",
+	disabled: "_disabled_dhax2_159"
 } }]]), cr = /* @__PURE__ */ g(((e, t) => {
 	var n = u(), r = c(), i = S(), a = "[object String]";
 	function o(e) {
@@ -1643,7 +1647,7 @@ var Qn = {
 	"multiple",
 	"accept",
 	"disabled"
-], Ar = /* @__PURE__ */ D(/* @__PURE__ */ R({
+], Ar = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-input-file",
 	props: {
 		id: {},
@@ -1698,11 +1702,11 @@ var Qn = {
 		}
 		return n({ clear: h }), Y(() => i.name, (e) => {
 			e || h();
-		}), (t, n) => (U(), F("div", { class: z(t.$style.ui3nInputFile) }, [I("label", {
+		}), (t, n) => (U(), I("div", { class: B(t.$style.ui3nInputFile) }, [L("label", {
 			for: J(o),
-			class: z([t.$style.label, e.disabled && t.$style.disabled]),
+			class: B([t.$style.label, e.disabled && t.$style.disabled]),
 			onClick: Q(c, ["stop", "prevent"])
-		}, [K(t.$slots, "default", {}, () => [ue(q(e.buttonText), 1)])], 10, Or), I("input", {
+		}, [K(t.$slots, "default", {}, () => [le(q(e.buttonText), 1)])], 10, Or), L("input", {
 			id: J(o),
 			ref_key: "fileInput",
 			ref: s,
@@ -1727,7 +1731,7 @@ var Qn = {
 	"rows",
 	"max-rows",
 	"disabled"
-], Nr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+], Nr = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-text",
 	props: {
 		id: {},
@@ -1738,7 +1742,10 @@ var Qn = {
 		label: { default: "" },
 		placeholder: { default: "" },
 		rules: {},
-		validateAtStartup: { type: Boolean },
+		validateAtStartup: {
+			type: Boolean,
+			default: !1
+		},
 		disabled: {
 			type: Boolean,
 			default: !1
@@ -1758,23 +1765,23 @@ var Qn = {
 	],
 	setup(e, { expose: t, emit: n }) {
 		let r = e, i = n, a = W(null), o = W(""), s = W(!1), c = W(!1), l = W("");
-		function u(e) {
+		function u(e, t = !1) {
 			if (l.value = "", r.rules && r.rules.length) {
 				for (let t of r.rules) if (typeof t == "function") {
 					let n = t(e);
 					typeof n == "string" && (l.value += n);
 				}
 			}
-			s.value && i("update:valid", !l.value);
+			(s.value || t || r.validateAtStartup) && i("update:valid", !l.value);
 		}
 		function d(e) {
 			c.value = !0, i("focus", e);
 		}
 		function f(e) {
 			let t = e.target.value;
-			setTimeout(() => {
-				c.value = !1, u(t), i("blur", e), i("change", t), i("update:modelValue", t);
-			}, 100);
+			u(t), i("update:modelValue", t), i("change", t), setTimeout(() => {
+				c.value = !1, i("blur", e);
+			}, 50);
 		}
 		function p(e) {
 			let t = e.target.value;
@@ -1805,53 +1812,63 @@ var Qn = {
 		}), Y(() => r.name, (e) => {
 			e || _();
 		}), Y(() => r.modelValue, (e, t) => {
-			(e ?? "") !== (t ?? "") && (o.value = e ?? "", u(o.value));
-		}, { immediate: !0 }), (t, n) => (U(), F("div", {
+			(e ?? "") !== (t ?? "") && (o.value = e ?? "", u(o.value, s.value || r.validateAtStartup));
+		}, { immediate: !0 }), (t, n) => (U(), I("div", {
 			id: e.id,
-			class: z([
+			class: B([
 				t.$style.ui3nText,
 				e.disabled && t.$style.disabled,
-				c.value && t.$style.focused
+				c.value && t.$style.focused,
+				l.value && t.$style.hasError
 			])
-		}, [e.label ? (U(), F("label", {
-			key: 0,
-			class: z(t.$style.label)
-		}, q(e.label), 3)) : P("", !0), I("div", { class: z(t.$style.body) }, [I("textarea", pe({
-			ref_key: "textareaElement",
-			ref: a,
-			class: t.$style.content,
-			value: o.value,
-			name: e.name,
-			placeholder: e.placeholder,
-			readonly: e.disabled,
-			rows: e.rows,
-			"max-rows": e.maxRows,
-			disabled: e.disabled
-		}, t.$attrs, {
-			onInput: p,
-			onKeydown: [
-				Z(m, ["enter"]),
-				Z(h, ["esc"]),
-				g
-			],
-			onFocusin: d,
-			onFocusout: f
-		}), null, 16, Mr)], 2)], 10, jr));
+		}, [
+			e.label ? (U(), I("label", {
+				key: 0,
+				class: B(t.$style.label)
+			}, q(e.label), 3)) : F("", !0),
+			L("div", { class: B(t.$style.body) }, [L("textarea", de({
+				ref_key: "textareaElement",
+				ref: a,
+				class: t.$style.content,
+				value: o.value,
+				name: e.name,
+				placeholder: e.placeholder,
+				readonly: e.disabled,
+				rows: e.rows,
+				"max-rows": e.maxRows,
+				disabled: e.disabled
+			}, t.$attrs, {
+				onInput: p,
+				onKeydown: [
+					Z(m, ["enter"]),
+					Z(h, ["esc"]),
+					g
+				],
+				onFocusin: d,
+				onFocusout: f
+			}), null, 16, Mr)], 2),
+			l.value ? (U(), I("div", {
+				key: 1,
+				class: B(t.$style.errorBlock)
+			}, q(l.value), 3)) : F("", !0)
+		], 10, jr));
 	}
 }), [["__cssModules", { $style: {
-	ui3nText: "_ui3nText_1pxii_1",
-	label: "_label_1pxii_13",
-	body: "_body_1pxii_23",
-	content: "_content_1pxii_34",
-	disabled: "_disabled_1pxii_69",
-	focused: "_focused_1pxii_81"
+	ui3nText: "_ui3nText_1g5zc_1",
+	label: "_label_1g5zc_13",
+	body: "_body_1g5zc_23",
+	content: "_content_1g5zc_34",
+	disabled: "_disabled_1g5zc_69",
+	focused: "_focused_1g5zc_81",
+	hasError: "_hasError_1g5zc_89",
+	errorBlock: "_errorBlock_1g5zc_93"
 } }]]), Pr = ["id"], Fr = [
 	"name",
 	"id",
 	"disabled",
 	"checked",
 	"value"
-], Ir = ["tabindex"], Lr = ["width", "height"], Rr = ["width", "height"], zr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+], Ir = ["tabindex"], Lr = ["width", "height"], Rr = ["width", "height"], zr = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-checkbox",
 	props: {
 		id: {},
@@ -1880,7 +1897,7 @@ var Qn = {
 			],
 			default: !1
 		},
-		size: { default: "16" },
+		size: { default: 16 },
 		color: { default: "var(--color-icon-control-accent-default)" },
 		indeterminate: {
 			type: Boolean,
@@ -1893,37 +1910,38 @@ var Qn = {
 	},
 	emits: ["change", "update:modelValue"],
 	setup(e, { expose: t, emit: n }) {
-		let r = te, i = e, a = n, o = Se(), s = be(), c = W(null), l = W(i.uncheckedValue || !1), u = W(!1), d = M(() => u.value ? "indeterminate" : l.value === i.checkedValue ? "checked" : "unchecked"), f = M(() => typeof l.value == "boolean" ? l.value ? "on" : "" : String(l.value)), p = M(() => {
+		let r = te, i = e, a = n, o = Se(), s = be(), c = W(null), l = W(i.modelValue), u = W(i.indeterminate), d = N(() => u.value ? "indeterminate" : l.value === i.checkedValue ? "checked" : "unchecked"), f = N(() => typeof l.value == "boolean" ? l.value ? "on" : "" : String(l.value)), p = N(() => {
+			let e = parseFloat(String(i.size));
+			return isNaN(e) ? 12 : e - 4;
+		}), m = N(() => ({
+			"--ui3n-checkbox-size": typeof i.size == "number" ? `${i.size}px` : i.size,
+			"--ui3n-checkbox-color": i.color
+		})), h = N(() => {
 			let e = [s.ui3nCheckbox];
 			return i.disabled && e.push(s.disabled), !o.default && e.push(s.noLabel), e;
-		}), m = M(() => {
+		}), g = N(() => {
 			let e = [s.ui3nCheckboxBody];
 			return d.value === "unchecked" ? e.push(s.unfilled) : e.push(s.filled), e;
 		});
-		function h(e) {
+		function _(e) {
 			e.preventDefault(), l.value = d.value === "unchecked" ? i.checkedValue : i.uncheckedValue, u.value &&= !1, a("change", l.value), a("update:modelValue", l.value);
 		}
-		function g() {
+		function v() {
 			l.value = i.uncheckedValue, u.value = !1, a("change", l.value), a("update:modelValue", l.value);
 		}
-		return t({ clear: g }), Y(() => i.name, (e) => {
-			e || g();
-		}), Y(() => i.modelValue, (e) => l.value = e, { immediate: !0 }), Y(() => i.indeterminate, (e) => u.value = e, { immediate: !0 }), Y(() => i.size, (e) => {
-			c.value && c.value.style.setProperty("--ui3n-checkbox-size", `${e}px`);
-		}), Y(() => i.color, (e) => {
-			c.value && c.value.style.setProperty("--ui3n-checkbox-color", e);
-		}), he(() => {
+		return t({ clear: v }), Y(() => i.name, (e) => {
+			e || v();
+		}), Y(() => i.modelValue, (e) => l.value = e), Y(() => i.indeterminate, (e) => u.value = e), pe(() => {
 			let e = typeof i.checkedValue, t = typeof i.uncheckedValue, n = typeof i.modelValue;
 			if (e !== t || e !== n || t !== n) throw Error("[Ui3nCheckbox] types of \"value\", \"checkedValue\" and \"uncheckedValue\" are different");
-		}), H(() => {
-			c.value && (c.value.style.setProperty("--ui3n-checkbox-size", `${i.size}px`), c.value.style.setProperty("--ui3n-checkbox-color", i.color));
-		}), (t, n) => (U(), F("div", {
+		}), (t, n) => (U(), I("div", {
 			ref_key: "checkboxEl",
 			ref: c,
 			id: e.id,
-			class: z(p.value)
+			class: B(h.value),
+			style: V(m.value)
 		}, [
-			I("input", {
+			L("input", {
 				type: "checkbox",
 				style: { display: "none" },
 				name: e.name,
@@ -1932,78 +1950,54 @@ var Qn = {
 				checked: d.value !== "unchecked",
 				value: f.value
 			}, null, 8, Fr),
-			Te((U(), F("div", {
-				class: z(m.value),
+			Te((U(), I("div", {
+				class: B(g.value),
 				tabindex: e.disabled ? -1 : 0,
-				onKeydown: [Z(h, ["space"]), Z(h, ["enter"])],
-				onClick: h
-			}, [d.value === "checked" ? (U(), F("svg", {
+				onKeydown: [Z(_, ["space"]), Z(_, ["enter"])],
+				onClick: _
+			}, [d.value === "checked" ? (U(), I("svg", {
 				key: 0,
-				width: Number(e.size) - 4,
-				height: Number(e.size) - 4,
+				width: p.value,
+				height: p.value,
 				viewBox: "0 0 24 24",
 				fill: "none",
-				xmlns: "http://www.w3.org/2000/svg",
-				class: z(t.$style.ui3nCheckboxIcon)
-			}, [...n[0] ||= [
-				I("g", {
-					id: "SVGRepo_bgCarrier",
-					"stroke-width": "0"
-				}, null, -1),
-				I("g", {
-					id: "SVGRepo_tracerCarrier",
-					"stroke-linecap": "round",
-					"stroke-linejoin": "round"
-				}, null, -1),
-				I("g", { id: "SVGRepo_iconCarrier" }, [I("path", {
-					d: "M20.0001 7L9.0001 18L4 13",
-					stroke: "#fff",
-					"stroke-width": "3",
-					"stroke-linecap": "round",
-					"stroke-linejoin": "round"
-				})], -1)
-			]], 10, Lr)) : P("", !0), d.value === "indeterminate" ? (U(), F("svg", {
+				class: B(t.$style.ui3nCheckboxIcon)
+			}, [...n[0] ||= [L("g", { id: "SVGRepo_iconCarrier" }, [L("path", {
+				d: "M20.0001 7L9.0001 18L4 13",
+				stroke: "#fff",
+				"stroke-width": "3",
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round"
+			})], -1)]], 10, Lr)) : F("", !0), d.value === "indeterminate" ? (U(), I("svg", {
 				key: 1,
-				width: Number(e.size) - 4,
-				height: Number(e.size) - 4,
+				width: p.value,
+				height: p.value,
 				viewBox: "0 0 24 24",
 				fill: "none",
-				xmlns: "http://www.w3.org/2000/svg",
-				class: z(t.$style.ui3nCheckboxIcon)
-			}, [...n[1] ||= [
-				I("g", {
-					id: "SVGRepo_bgCarrier",
-					"stroke-width": "0"
-				}, null, -1),
-				I("g", {
-					id: "SVGRepo_tracerCarrier",
-					"stroke-linecap": "round",
-					"stroke-linejoin": "round"
-				}, null, -1),
-				I("g", { id: "SVGRepo_iconCarrier" }, [I("path", {
-					d: "M7 12L17 12",
-					stroke: "#fff",
-					"stroke-width": "3",
-					"stroke-linecap": "round",
-					"stroke-linejoin": "round"
-				})], -1)
-			]], 10, Rr)) : P("", !0)], 42, Ir)), [[J(r)]]),
-			I("div", {
-				class: z(t.$style.ui3nCheckboxLabel),
-				onClick: h
+				class: B(t.$style.ui3nCheckboxIcon)
+			}, [...n[1] ||= [L("g", { id: "SVGRepo_iconCarrier" }, [L("path", {
+				d: "M7 12L17 12",
+				stroke: "#fff",
+				"stroke-width": "3",
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round"
+			})], -1)]], 10, Rr)) : F("", !0)], 42, Ir)), [[J(r)]]),
+			L("div", {
+				class: B(t.$style.ui3nCheckboxLabel),
+				onClick: _
 			}, [K(t.$slots, "default")], 2)
-		], 10, Pr));
+		], 14, Pr));
 	}
 }), [["__cssModules", { $style: {
-	ui3nCheckbox: "_ui3nCheckbox_1ohja_3",
-	noLabel: "_noLabel_1ohja_17",
-	ui3nCheckboxBody: "_ui3nCheckboxBody_1ohja_21",
-	filled: "_filled_1ohja_36",
-	unfilled: "_unfilled_1ohja_58",
-	ui3nCheckboxIcon: "_ui3nCheckboxIcon_1ohja_77",
-	ui3nCheckboxLabel: "_ui3nCheckboxLabel_1ohja_82",
-	disabled: "_disabled_1ohja_90"
-} }]]), Br = /* @__PURE__ */ R({
+	ui3nCheckbox: "_ui3nCheckbox_s0t61_3",
+	noLabel: "_noLabel_s0t61_17",
+	ui3nCheckboxBody: "_ui3nCheckboxBody_s0t61_21",
+	filled: "_filled_s0t61_37",
+	unfilled: "_unfilled_s0t61_59",
+	ui3nCheckboxIcon: "_ui3nCheckboxIcon_s0t61_78",
+	ui3nCheckboxLabel: "_ui3nCheckboxLabel_s0t61_82",
+	disabled: "_disabled_s0t61_90"
+} }]]), Br = /* @__PURE__ */ z({
 	__name: "ui3n-table-sort-icon",
 	props: {
 		size: { default: 16 },
@@ -2011,15 +2005,18 @@ var Qn = {
 		value: {}
 	},
 	setup(e) {
-		let t = e, n = M(() => t.value === "asc" ? "round-arrow-upward" : "round-arrow-downward");
-		return (t, r) => (U(), N(ce, {
+		let t = e, n = N(() => t.value === "asc" ? "round-arrow-upward" : "round-arrow-downward"), r = N(() => {
+			let e = Number(t.size);
+			return isNaN(e) ? 16 : e;
+		});
+		return (t, i) => (U(), P(se, {
 			mode: "out-in",
 			name: "fade"
 		}, {
-			default: X(() => [(U(), N(ne, {
+			default: X(() => [(U(), P(k, {
 				key: n.value,
 				icon: n.value,
-				size: Number(e.size),
+				size: r.value,
 				color: e.color
 			}, null, 8, [
 				"icon",
@@ -2029,34 +2026,40 @@ var Qn = {
 			_: 1
 		}));
 	}
-}), Vr = /* @__PURE__ */ p((/* @__PURE__ */ g(((e, t) => {
+}), Vr = /* @__PURE__ */ g(((e, t) => {
 	var n = sn();
 	function r(e, t, r) {
 		var i = e == null ? void 0 : n(e, t);
 		return i === void 0 ? r : i;
 	}
 	t.exports = r;
-})))(), 1), Hr = /* @__PURE__ */ p(r(), 1);
-function Ur(e, t) {
+})), Hr = /* @__PURE__ */ g(((e, t) => {
+	var n = Yt(), r = 1, i = 4;
+	function a(e) {
+		return n(e, r | i);
+	}
+	t.exports = a;
+})), Ur = /* @__PURE__ */ p(Vr(), 1), Wr = /* @__PURE__ */ p(r(), 1), Gr = /* @__PURE__ */ p(Hr(), 1);
+function Kr(e, t) {
 	let n = W(null), r = W({
 		sortOrder: m(),
 		fieldAsRowKey: p()
-	}), i = r.value?.fieldAsRowKey ? W([]) : W(/* @__PURE__ */ new Set()), a = W(!1), o = M(() => !!r.value.fieldAsRowKey), s = M(() => e.head.filter((e) => !e.hidden)), c = M(() => o.value ? e.body.content.filter((e) => i.value.includes(e[r.value.fieldAsRowKey])) : Array.from(i.value)), l = M(() => o.value ? (0, $.default)(i.value) : i.value.size), u = M(() => e.config?.selectable === "multiple" && a.value), d = M(() => {
+	}), i = r.value?.fieldAsRowKey ? W([]) : W(/* @__PURE__ */ new Set()), a = W(!1), o = N(() => !!r.value.fieldAsRowKey), s = N(() => e.head.filter((e) => !e.hidden)), c = N(() => o.value ? e.body.content.filter((e) => i.value.includes(e[r.value.fieldAsRowKey])) : Array.from(i.value)), l = N(() => o.value ? (0, $.default)(i.value) : i.value.size), u = N(() => e.config?.selectable === "multiple" && a.value), d = N(() => {
 		if (!n.value) return "100%";
 		let { config: t = {}, head: r } = e, { columnStyle: i } = t;
-		return r.map((e) => e.key).reduce((e, t, n) => {
-			let r = (0, Vr.default)(i, [t, "width"], "1fr");
+		return r.filter((e) => !e.hidden).map((e) => e.key).reduce((e, t, n) => {
+			let r = (0, Ur.default)(i, [t, "width"], "1fr");
 			return e = n === 0 ? `${r}` : `${e} ${r}`, e;
 		}, "");
-	}), f = M(() => !e.config?.minHeightUnusedPlace || isNaN(Number(e.config?.minHeightUnusedPlace)) ? {} : { minHeight: `${Number(e.config?.minHeightUnusedPlace || 0)}px` });
+	}), f = N(() => !e.config?.minHeightUnusedPlace || isNaN(Number(e.config?.minHeightUnusedPlace)) ? {} : { minHeight: `${Number(e.config?.minHeightUnusedPlace || 0)}px` });
 	function p() {
 		let { config: t = {}, body: n } = e, { fieldAsRowKey: r } = t;
-		if (r && r in (0, Vr.default)(n, ["content", 0], {})) return r;
-		if ("id" in (0, Vr.default)(n, ["content", 0], {})) return "id";
+		if (r && r in (0, Ur.default)(n, ["content", 0], {})) return r;
+		if ("id" in (0, Ur.default)(n, ["content", 0], {})) return "id";
 	}
 	function m() {
 		let { config: t = {}, head: n } = e, { sortOrder: r } = t;
-		if (!(0, Hr.default)(r)) return r;
+		if (!(0, Wr.default)(r)) return (0, Gr.default)(r);
 		for (let e of n) {
 			let { key: t, sortable: n } = e;
 			if (n) return {
@@ -2073,9 +2076,9 @@ function Ur(e, t) {
 		return o.value ? !!i.value.find((t) => t === e[r.value.fieldAsRowKey]) : i.value.has(e);
 	}
 	function _(t) {
-		if ((0, Hr.default)(e.body.rowsStyle) || !o.value) return {};
+		if ((0, Wr.default)(e.body.rowsStyle) || !o.value) return {};
 		let n = t[r.value.fieldAsRowKey];
-		return (0, Vr.default)(e, [
+		return (0, Ur.default)(e, [
 			"body",
 			"rowsStyle",
 			n
@@ -2091,13 +2094,13 @@ function Ur(e, t) {
 		if (g(e)) if (!o.value) i.value.delete(e);
 		else {
 			let t = i.value.findIndex((t) => t === e[r.value.fieldAsRowKey]);
-			i.value.splice(t, 1);
+			t !== -1 && i.value.splice(t, 1);
 		}
-		else o.value && i.value.push(e[r.value.fieldAsRowKey]), !o.value && i.value.add(e);
+		else o.value ? i.value.push(e[r.value.fieldAsRowKey]) : i.value.add(e);
 	}
 	function x(n, r) {
 		let { selectable: i } = e.config;
-		i === "single" ? y(n) : b(n), !r && t("select:row", c.value);
+		i === "single" ? y(n) : b(n), r || t("select:row", c.value);
 	}
 	function S(n) {
 		if (e.config.selectable === "multiple") {
@@ -2107,19 +2110,21 @@ function Ur(e, t) {
 		}
 	}
 	function C(e) {
-		r.value.sortOrder?.field === e ? r.value.sortOrder.direction = r.value.sortOrder?.direction === "asc" ? "desc" : "asc" : (r.value.sortOrder.field = e, r.value.sortOrder.direction = "desc"), r.value.sortOrder?.field && t("change:sort", r.value.sortOrder);
+		r.value.sortOrder?.field === e ? r.value.sortOrder.direction = r.value.sortOrder?.direction === "asc" ? "desc" : "asc" : r.value.sortOrder = {
+			field: e,
+			direction: "desc"
+		}, r.value.sortOrder?.field && t("change:sort", r.value.sortOrder);
 	}
 	function w() {
-		o.value && (i.value = []), !o.value && i.value.clear(), a.value = !1, t("select:row", []);
+		o.value ? i.value = [] : i.value.clear(), a.value = !1, t("select:row", []);
 	}
 	return Y(() => e.config?.tableName, (e) => {
 		e || w();
-	}), Y(d, (e, t) => {
-		e && e !== t && n.value && n.value.style.setProperty("--ui3n-table-columns-width", e);
-	}, { immediate: !0 }), Y(() => l.value, (t, n) => {
+	}), Y(() => l.value, (t, n) => {
 		t && t > n && e.config.selectable === "multiple" && !u.value && (a.value = !0);
 	}), {
 		tableEl: n,
+		tableColumnWidth: d,
 		unusedPlaceCssStyle: f,
 		currentConfig: r,
 		visibleColumns: s,
@@ -2140,7 +2145,7 @@ function Ur(e, t) {
 }
 //#endregion
 //#region src/components/ui3n-table/ui3n-table.vue?vue&type=script&setup=true&lang.ts
-var Wr = ["name", "value"], Gr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+var qr = ["name", "value"], Jr = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-table",
 	props: {
 		config: {},
@@ -2149,112 +2154,113 @@ var Wr = ["name", "value"], Gr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["change:sort", "select:row"],
 	setup(e, { expose: t, emit: n }) {
-		let { tableEl: r, unusedPlaceCssStyle: i, currentConfig: a, visibleColumns: o, hasGroupActionsRow: s, showGroupActionsRow: c, selectedRows: l, selectedRowsArray: u, selectedRowsSize: d, closeGroupActionsRow: f, getRowKey: p, isRowSelected: m, getRowStyle: h, processSelection: g, toggleSelectedRows: _, changeSortOrder: v, clear: y } = Ur(e, n), b = { select: g };
+		let { tableEl: r, tableColumnWidth: i, unusedPlaceCssStyle: a, currentConfig: o, visibleColumns: s, hasGroupActionsRow: c, showGroupActionsRow: l, selectedRows: u, selectedRowsArray: d, selectedRowsSize: f, closeGroupActionsRow: p, getRowKey: m, isRowSelected: h, getRowStyle: g, processSelection: _, toggleSelectedRows: v, changeSortOrder: y, clear: b } = Kr(e, n), x = { select: _ };
 		return t({
-			getRowStyle: h,
-			selectedRows: l,
-			selectedRowsArray: u,
-			hasGroupActionsRow: s,
-			closeGroupActionsRow: f,
-			clear: y
-		}), (t, n) => (U(), F("div", {
+			getRowStyle: g,
+			selectedRows: u,
+			selectedRowsArray: d,
+			hasGroupActionsRow: c,
+			closeGroupActionsRow: p,
+			clear: b
+		}), (t, n) => (U(), I("div", {
 			ref_key: "tableEl",
 			ref: r,
-			class: z(t.$style.ui3nTable)
+			style: V({ "--ui3n-table-columns-width": J(i) }),
+			class: B(t.$style.ui3nTable)
 		}, [
-			e.config?.tableName && J(d) > 0 ? (U(), F("fieldset", {
+			e.config?.tableName && J(f) > 0 ? (U(), I("fieldset", {
 				key: 0,
-				class: z(t.$style.hiddenBlock)
-			}, [(U(!0), F(j, null, G(J(u), (t, n) => (U(), F("input", {
-				key: J(p)(t, n),
+				class: B(t.$style.hiddenBlock)
+			}, [(U(!0), I(M, null, G(J(d), (t, n) => (U(), I("input", {
+				key: J(m)(t, n),
 				type: "hidden",
 				name: e.config.selectable === "multiple" ? `${e.config.tableName}[]` : e.config.tableName,
-				value: String(J(p)(t, n))
-			}, null, 8, Wr))), 128))], 2)) : P("", !0),
-			I("div", { class: z([t.$style.header, J(c) && t.$style.withGroupActions]) }, [J(c) ? (U(), F("div", {
+				value: String(J(m)(t, n))
+			}, null, 8, qr))), 128))], 2)) : F("", !0),
+			L("div", { class: B([t.$style.header, J(l) && t.$style.withGroupActions]) }, [J(l) ? (U(), I("div", {
 				key: 0,
-				class: z(t.$style.groupActions)
+				class: B(t.$style.groupActions)
 			}, [
-				L(zr, {
-					indeterminate: J(d) < e.body.content.length && J(d) !== 0,
-					"model-value": J(d) === e.body.content.length,
-					onChange: J(_)
+				R(zr, {
+					indeterminate: J(f) < e.body.content.length && J(f) !== 0,
+					"model-value": J(f) === e.body.content.length,
+					onChange: J(v)
 				}, {
-					default: X(() => [ue(" Selected: " + q(J(d)), 1)]),
+					default: X(() => [le(" Selected: " + q(J(f)), 1)]),
 					_: 1
 				}, 8, [
 					"indeterminate",
 					"model-value",
 					"onChange"
 				]),
-				I("div", { class: z(t.$style.groupActionsBody) }, [K(t.$slots, "group-actions", { selectedRows: J(u) })], 2),
-				L(O, {
+				L("div", { class: B(t.$style.groupActionsBody) }, [K(t.$slots, "group-actions", { selectedRows: J(d) })], 2),
+				R(O, {
 					type: "secondary",
-					onClick: J(f)
+					onClick: J(p)
 				}, {
-					default: X(() => [...n[0] ||= [ue(" Cancel ", -1)]]),
+					default: X(() => [...n[0] ||= [le(" Cancel ", -1)]]),
 					_: 1
 				}, 8, ["onClick"])
-			], 2)) : P("", !0), (U(!0), F(j, null, G(J(o), (e) => (U(), F("div", {
+			], 2)) : F("", !0), (U(!0), I(M, null, G(J(s), (e) => (U(), I("div", {
 				key: e.key,
-				class: z([
+				class: B([
 					t.$style.headerItemWrapper,
 					e.sortable && t.$style.sortable,
-					e.sortable && J(a).sortOrder?.field === e.key && t.$style.sortableActive
+					e.sortable && J(o).sortOrder?.field === e.key && t.$style.sortableActive
 				]),
-				style: B(e.headCellStyle)
-			}, [I("div", pe({
+				style: V(e.headCellStyle)
+			}, [L("div", de({
 				class: t.$style.headerItem,
 				style: e.headCellStyle
-			}, ye(e.sortable ? { click: () => J(v)(e.key) } : {}, !0)), [K(t.$slots, `header-cell-${e.key}`, {}, () => [I("span", { class: z(t.$style.headerText) }, q(e.text), 3)]), e.sortable && J(a).sortOrder?.field === e.key ? (U(), N(Br, {
+			}, ye(e.sortable ? { click: () => J(y)(e.key) } : {}, !0)), [K(t.$slots, `header-cell-${e.key}`, {}, () => [L("span", { class: B(t.$style.headerText) }, q(e.text), 3)]), e.sortable && J(o).sortOrder?.field === e.key ? (U(), P(Br, {
 				key: 0,
-				value: J(a).sortOrder?.direction,
+				value: J(o).sortOrder?.direction,
 				size: "16"
-			}, null, 8, ["value"])) : P("", !0)], 16)], 6))), 128))], 2),
-			I("div", { class: z(t.$style.body) }, [e.config?.showNoDataMessage && !J($.default)(e.body.content) ? K(t.$slots, "no-data", { key: 0 }, () => [I("div", { class: z(t.$style.noData) }, "No data", 2)]) : (U(), F(j, { key: 1 }, [t.$slots.row ? (U(!0), F(j, { key: 0 }, G(e.body.content, (n, r) => (U(), F("div", {
-				key: J(p)(n, r),
-				class: z([
+			}, null, 8, ["value"])) : F("", !0)], 16)], 6))), 128))], 2),
+			L("div", { class: B(t.$style.body) }, [e.config?.showNoDataMessage && !J($.default)(e.body.content) ? K(t.$slots, "no-data", { key: 0 }, () => [L("div", { class: B(t.$style.noData) }, "No data", 2)]) : (U(), I(M, { key: 1 }, [t.$slots.row ? (U(!0), I(M, { key: 0 }, G(e.body.content, (n, r) => (U(), I("div", {
+				key: J(m)(n, r),
+				class: B([
 					t.$style.row,
 					t.$slots.row && t.$style.customRow,
-					J(m)(n) && t.$style.selected,
+					J(h)(n) && t.$style.selected,
 					e.config.selectable && t.$style.selectable
 				])
 			}, [K(t.$slots, "row", {
 				row: n,
-				rowStyle: J(h)(n),
+				rowStyle: J(g)(n),
 				rowIndex: r,
-				isRowSelected: J(m)(n),
+				isRowSelected: J(h)(n),
 				columnStyle: e.config?.columnStyle,
-				events: b
-			})], 2))), 128)) : (U(!0), F(j, { key: 1 }, G(e.body.content, (n, r) => (U(), F("div", {
-				key: J(p)(n, r),
-				class: z([
+				events: x
+			})], 2))), 128)) : (U(!0), I(M, { key: 1 }, G(e.body.content, (n, r) => (U(), I("div", {
+				key: J(m)(n, r),
+				class: B([
 					t.$style.row,
-					J(m)(n) && t.$style.selected,
+					J(h)(n) && t.$style.selected,
 					e.config.selectable && t.$style.selectable
 				]),
-				style: B(J(h)(n))
-			}, [e.config.selectable ? (U(), F("div", {
+				style: V(J(g)(n))
+			}, [e.config.selectable ? (U(), I("div", {
 				key: 0,
-				class: z(t.$style.rowCheckbox)
-			}, [L(zr, {
-				"model-value": J(m)(n),
-				onChange: (e) => J(g)(n)
-			}, null, 8, ["model-value", "onChange"])], 2)) : P("", !0), (U(!0), F(j, null, G(J(o), (i, a) => (U(), F("div", {
+				class: B(t.$style.rowCheckbox)
+			}, [R(zr, {
+				"model-value": J(h)(n),
+				onChange: (e) => J(_)(n)
+			}, null, 8, ["model-value", "onChange"])], 2)) : F("", !0), (U(!0), I(M, null, G(J(s), (i, a) => (U(), I("div", {
 				key: i.key,
-				class: z([t.$style.bodyItem, a === 0 && t.$style.bodyItemFirst])
+				class: B([t.$style.bodyItem, a === 0 && t.$style.bodyItemFirst])
 			}, [K(t.$slots, `row-cell-${i.key}`, {
 				row: n,
 				rowIndex: r,
-				isRowSelected: J(m)(n),
+				isRowSelected: J(h)(n),
 				columnStyle: e.config?.columnStyle,
 				cell: n[i.key]
-			}, () => [I("span", { class: z(t.$style.cell) }, q(n[i.key]), 3)])], 2))), 128))], 6))), 128))], 64))], 2),
-			I("div", {
-				class: z(t.$style.unusedPlace),
-				style: B(J(i))
+			}, () => [L("span", { class: B(t.$style.cell) }, q(i.format ? i.format(n[i.key]) : n[i.key]), 3)])], 2))), 128))], 6))), 128))], 64))], 2),
+			L("div", {
+				class: B(t.$style.unusedPlace),
+				style: V(J(a))
 			}, [K(t.$slots, "unused-place")], 6)
-		], 2));
+		], 6));
 	}
 }), [["__cssModules", { $style: {
 	ui3nTable: "_ui3nTable_d2343_3",
@@ -2279,27 +2285,27 @@ var Wr = ["name", "value"], Gr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	cell: "_cell_d2343_171",
 	noData: "_noData_d2343_177",
 	unusedPlace: "_unusedPlace_d2343_190"
-} }]]), Kr = ["id", "onClick"], qr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), Yr = ["id", "onClick"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-dialog-provider",
 	setup(e) {
-		let t = fe(C);
+		let t = ue(C);
 		function n(e, n) {
 			(n.closeOnClickOverlay || n.dialogProps?.closeOnClickOverlay) && t.$closeDialog(e, { event: "click-overlay" });
 		}
 		function r(e, n) {
 			t.$closeDialog(e, n);
 		}
-		return (e, i) => (U(), N(se, { to: "body" }, [(U(!0), F(j, null, G(J(t).dialogStack.value, (t) => (U(), F("div", {
+		return (e, i) => (U(), P(oe, { to: "body" }, [(U(!0), I(M, null, G(J(t).dialogStack.value, (t) => (U(), I("div", {
 			id: `dialog-wrapper-${t.id}`,
 			key: t.id,
-			class: z(e.$style["dialog-provider-overlay"]),
+			class: B(e.$style["dialog-provider-overlay"]),
 			onClick: Q((e) => n(t.id, t.props), ["self", "prevent"])
-		}, [(U(), N(_e(t.component), pe({ ref_for: !0 }, t.props, { onAction: (e) => r(t.id, e) }), null, 16, ["onAction"]))], 10, Kr))), 128))]));
+		}, [(U(), P(_e(t.component), de({ ref_for: !0 }, t.props, { onAction: (e) => r(t.id, e) }), null, 16, ["onAction"]))], 10, Yr))), 128))]));
 	}
 }), [["__cssModules", { $style: { "dialog-provider-overlay": "_dialog-provider-overlay_v01lr_1" } }]]);
 //#endregion
 //#region src/components/ui3n-dialog/util.ts
-function Jr({ width: e, style: t, defaultValue: n = 380 }) {
+function Zr({ width: e, style: t, defaultValue: n = 380 }) {
 	if (e) {
 		let t = Number(e);
 		return Number.isNaN(t) ? e : `${t}px`;
@@ -2308,7 +2314,7 @@ function Jr({ width: e, style: t, defaultValue: n = 380 }) {
 }
 //#endregion
 //#region src/components/ui3n-dialog/ui3n-dialog.vue?vue&type=script&setup=true&lang.ts
-var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+var Qr = ["id"], $r = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-dialog",
 	props: {
 		id: {},
@@ -2352,8 +2358,8 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			top: 0,
 			shiftX: 0,
 			shiftY: 0
-		}), s = M(() => ({
-			width: Jr({
+		}), s = N(() => ({
+			width: Zr({
 				width: n.width,
 				style: n.cssStyle
 			}),
@@ -2362,7 +2368,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				left: `${o.value.left}px`,
 				top: `${o.value.top}px`
 			}
-		})), c = M(() => n.icon ? typeof n.icon == "string" ? {
+		})), c = N(() => n.icon ? typeof n.icon == "string" ? {
 			icon: n.icon,
 			size: 14,
 			color: "var(--color-icon-control-secondary-default)"
@@ -2393,7 +2399,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			a.value && (o.value.left = e.clientX - o.value.shiftX - o.value.initialLeft, o.value.top = e.clientY - o.value.shiftY - o.value.initialTop);
 		}
 		return H(() => {
-			i.value && (i.value.style.setProperty("--ui3n-dialog-confirm-button-color", n.confirmButtonColor), i.value.style.setProperty("--ui3n-dialog-cancel-button-color", n.cancelButtonColor), i.value.style.setProperty("--ui3n-dialog-confirm-background-color", n.confirmButtonBackground), i.value.style.setProperty("--ui3n-dialog-cancel-background-color", n.cancelButtonBackground), me(() => {
+			i.value && (i.value.style.setProperty("--ui3n-dialog-confirm-button-color", n.confirmButtonColor), i.value.style.setProperty("--ui3n-dialog-cancel-button-color", n.cancelButtonColor), i.value.style.setProperty("--ui3n-dialog-confirm-background-color", n.confirmButtonBackground), i.value.style.setProperty("--ui3n-dialog-cancel-background-color", n.cancelButtonBackground), fe(() => {
 				i.value && i.value.focus(), setTimeout(() => {
 					if (i.value) {
 						let e = i.value.getBoundingClientRect();
@@ -2401,7 +2407,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 					}
 				}, 100);
 			}));
-		}), (t, i) => (U(), F("div", pe({
+		}), (t, i) => (U(), I("div", de({
 			id: e.id,
 			ref: "dialog-el",
 			tabindex: "1",
@@ -2418,22 +2424,22 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			mousemove: p,
 			keydown: l
 		} : { keydown: l }, !0)), [
-			e.title && !t.$slots.header ? (U(), F("div", {
+			e.title && !t.$slots.header ? (U(), I("div", {
 				key: 0,
-				class: z([t.$style.title, t.$style.titleDefault])
-			}, [c.value ? (U(), N(ne, pe({ key: 0 }, c.value, { class: t.$style.icon }), null, 16, ["class"])) : P("", !0), I("span", null, q(e.title), 1)], 2)) : P("", !0),
-			t.$slots.header ? (U(), F("div", {
+				class: B([t.$style.title, t.$style.titleDefault])
+			}, [c.value ? (U(), P(k, de({ key: 0 }, c.value, { class: t.$style.icon }), null, 16, ["class"])) : F("", !0), L("span", null, q(e.title), 1)], 2)) : F("", !0),
+			t.$slots.header ? (U(), I("div", {
 				key: 1,
-				class: z(t.$style.title)
-			}, [K(t.$slots, "header")], 2)) : P("", !0),
-			t.$slots.body ? (U(), F("div", {
+				class: B(t.$style.title)
+			}, [K(t.$slots, "header")], 2)) : F("", !0),
+			t.$slots.body ? (U(), I("div", {
 				key: 2,
-				class: z(t.$style.content)
-			}, [K(t.$slots, "body")], 2)) : P("", !0),
-			(e.confirmButton || e.cancelButton) && !t.$slots.actions ? (U(), F("div", {
+				class: B(t.$style.content)
+			}, [K(t.$slots, "body")], 2)) : F("", !0),
+			(e.confirmButton || e.cancelButton) && !t.$slots.actions ? (U(), I("div", {
 				key: 3,
-				class: z([t.$style.actions, t.$style.actionsDefault])
-			}, [e.cancelButton ? (U(), N(O, {
+				class: B([t.$style.actions, t.$style.actionsDefault])
+			}, [e.cancelButton ? (U(), P(O, {
 				key: 0,
 				type: "custom",
 				color: e.cancelButtonBackground,
@@ -2443,9 +2449,9 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 					data: n.data
 				}), ["stop", "prevent"])
 			}, {
-				default: X(() => [ue(q(e.cancelButtonText), 1)]),
+				default: X(() => [le(q(e.cancelButtonText), 1)]),
 				_: 1
-			}, 8, ["color", "text-color"])) : P("", !0), e.confirmButton ? (U(), N(O, {
+			}, 8, ["color", "text-color"])) : F("", !0), e.confirmButton ? (U(), P(O, {
 				key: 1,
 				type: "custom",
 				color: e.confirmButtonBackground,
@@ -2456,24 +2462,24 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 					data: n.data
 				}), ["stop", "prevent"])
 			}, {
-				default: X(() => [ue(q(e.confirmButtonText), 1)]),
+				default: X(() => [le(q(e.confirmButtonText), 1)]),
 				_: 1
 			}, 8, [
 				"color",
 				"text-color",
 				"disabled"
-			])) : P("", !0)], 2)) : P("", !0),
-			t.$slots.actions ? (U(), F("div", {
+			])) : F("", !0)], 2)) : F("", !0),
+			t.$slots.actions ? (U(), I("div", {
 				key: 4,
-				class: z(t.$style.actions)
-			}, [K(t.$slots, "actions")], 2)) : P("", !0),
-			t.$slots.loading ? (U(), F("div", {
+				class: B(t.$style.actions)
+			}, [K(t.$slots, "actions")], 2)) : F("", !0),
+			t.$slots.loading ? (U(), I("div", {
 				key: 5,
-				class: z(t.$style.loading)
-			}, [K(t.$slots, "loading")], 2)) : P("", !0),
-			e.hideCloseButton ? P("", !0) : (U(), N(O, {
+				class: B(t.$style.loading)
+			}, [K(t.$slots, "loading")], 2)) : F("", !0),
+			e.hideCloseButton ? F("", !0) : (U(), P(O, {
 				key: 6,
-				class: z(t.$style.closeBtn),
+				class: B(t.$style.closeBtn),
 				type: "icon",
 				size: "small",
 				color: "var(--color-bg-block-primary-default)",
@@ -2482,7 +2488,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				"icon-color": "var(--color-icon-control-primary-default)",
 				onClick: i[2] ||= Q((e) => r("action", { event: "close" }), ["stop", "prevent"])
 			}, null, 8, ["class"]))
-		], 16, Yr));
+		], 16, Qr));
 	}
 }), [["__cssModules", { $style: {
 	dialog: "_dialog_13zmx_3",
@@ -2495,7 +2501,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	actions: "_actions_13zmx_74",
 	actionsDefault: "_actionsDefault_13zmx_81",
 	loading: "_loading_13zmx_89"
-} }]]), Zr = ["id"], Qr = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), ei = ["id"], ti = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-menu",
 	props: {
 		id: {},
@@ -2507,6 +2513,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			type: Boolean,
 			default: !0
 		},
+		lockScroll: {
+			type: Boolean,
+			default: !1
+		},
 		offsetX: { default: 0 },
 		offsetY: { default: 0 },
 		contentBorderRadius: { default: 4 },
@@ -2526,6 +2536,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		}
 	},
 	emits: [
+		"click",
 		"open",
 		"opened",
 		"close",
@@ -2534,7 +2545,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		"update:modelValue"
 	],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, a = Ce("menu-trigger-element"), o = Ce("menu-content-element"), s = W(!1), c = W(r.triggerElement || null), l = M(() => c.value || a.value), u = M(() => {
+		let r = e, i = n, a = Ce("menu-trigger-element"), o = Ce("menu-content-element"), s = W(!1), c = W(r.triggerElement || null), l = N(() => c.value || a.value), u = N(() => {
+			let e = l.value;
+			return e ? e instanceof HTMLElement ? e : "contextElement" in e && e.contextElement instanceof HTMLElement ? e.contextElement : null : null;
+		}), d = N(() => {
 			let e = [ke({
 				mainAxis: r.offsetY,
 				crossAxis: r.offsetX + 2
@@ -2543,12 +2557,12 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				fallbackAxisSideDirection: "end",
 				fallbackPlacements: ["top-end", "bottom-end"]
 			})), e.push(Ae()), e;
-		}), { floatingStyles: d, isPositioned: f, update: p } = je(l, o, {
+		}), { floatingStyles: f, isPositioned: p, update: m } = je(l, o, {
 			placement: "bottom-start",
 			strategy: r.positionStrategy,
-			middleware: u,
+			middleware: d,
 			whileElementsMounted: r.positionAutoupdate || r.positionStrategy === "fixed" ? De : void 0
-		}), m = M(() => {
+		}), h = N(() => {
 			let e = "";
 			if (typeof r.contentBorderRadius == "number") e = `${r.contentBorderRadius}px`;
 			else if (Array.isArray(r.contentBorderRadius)) {
@@ -2556,53 +2570,89 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				e = `${t}px ${n}px ${i}px ${a}px`;
 			}
 			return {
-				...d.value,
+				...f.value,
 				"--ui3n-menu-zIndex": String(r.zIndex),
 				...e && { "--ui3n-menu-border-radius": e },
 				...r.contentStyles || {}
 			};
 		});
-		function h() {
+		function g(e) {
+			e.preventDefault();
+		}
+		function _(e) {
+			if (!e) return document.body;
+			let t = e.parentElement;
+			for (; t && t !== document.body && t !== document.documentElement;) {
+				let e = window.getComputedStyle(t);
+				if (/(auto|scroll)/.test(e.overflowY || e.overflow) && t.scrollHeight > t.clientHeight) return t;
+				t = t.parentElement;
+			}
+			return document.body;
+		}
+		function v() {
+			if (!r.lockScroll) return;
+			let e = _(u.value);
+			if (e) {
+				let t = Number(e.dataset.scrollLocksCount || "0");
+				t === 0 ? (e.dataset.scrollLocksCount = "1", e.dataset.originalOverscroll = e.style.overscrollBehaviorY || "", e.style.overscrollBehaviorY = "contain", e === document.body ? (document.addEventListener("wheel", g, { passive: !1 }), document.addEventListener("touchmove", g, { passive: !1 })) : (e.addEventListener("wheel", g, { passive: !1 }), e.addEventListener("touchmove", g, { passive: !1 }))) : e.dataset.scrollLocksCount = String(t + 1);
+			}
+		}
+		function y() {
+			let e = _(u.value);
+			if (!e) return;
+			let t = Number(e.dataset.scrollLocksCount || "0");
+			if (t > 0) {
+				let n = t - 1;
+				if (n === 0) {
+					let t = e.dataset.originalOverscroll;
+					t ? e.style.overscrollBehaviorY = t : e.style.removeProperty("overscroll-behavior-y"), e === document.body ? (document.removeEventListener("wheel", g), document.removeEventListener("touchmove", g)) : (e.removeEventListener("wheel", g), e.removeEventListener("touchmove", g)), delete e.dataset.scrollLocksCount, delete e.dataset.originalOverscroll;
+				} else e.dataset.scrollLocksCount = String(n);
+			}
+		}
+		function b() {
 			r.disabled || (s.value = !s.value, s.value ? i("open") : i("close"), i("update:modelValue", s.value));
 		}
-		function g() {
+		function x() {
 			s.value = !1, i("close"), i("update:modelValue", s.value);
 		}
-		function _(e) {
-			l.value?.contains(e.target) || (i("click-outside"), r.closeOnClickOutside && (s.value = !1, i("close"), i("update:modelValue", s.value)));
+		function S(e) {
+			u.value?.contains(e.target) || (i("click-outside"), r.closeOnClickOutside && (s.value = !1, i("close"), i("update:modelValue", s.value)));
 		}
-		return Y(f, (e) => {
-			i(e ? "opened" : "closed");
+		return Y(() => s.value, (e) => {
+			e ? v() : y();
 		}), Y(() => r.modelValue, (e) => {
-			s.value !== e && (s.value = e);
+			e !== void 0 && s.value !== e && (s.value = e, i(e ? "open" : "close"));
 		}, { immediate: !0 }), Y(() => r.triggerElement, (e) => {
-			e && (c.value = e, p());
+			e && (c.value = e, m());
 		}), Y([() => r.offsetX, () => r.offsetY], ([e, t], [n, r]) => {
-			(e !== n || t !== r) && p();
+			(e !== n || t !== r) && m();
+		}), he(() => {
+			y();
 		}), t({
-			isPositioned: f,
-			update: p
-		}), (t, n) => (U(), F("div", {
+			isPositioned: p,
+			update: m
+		}), (t, n) => (U(), I("div", {
 			ref: "menu-element",
 			id: e.id,
-			class: z(t.$style.ui3nMenu)
-		}, [I("div", {
+			class: B(t.$style.ui3nMenu),
+			onClick: n[0] ||= (e) => i("click", e)
+		}, [L("div", {
 			ref: "menu-trigger-element",
-			class: z([t.$style.ui3nMenuTrigger, e.disabled && t.$style.ui3nMenuTriggerDisabled]),
-			onClick: Q(h, ["stop"])
-		}, [K(t.$slots, "default")], 2), s.value ? Te((U(), F("div", pe({
+			class: B([t.$style.ui3nMenuTrigger, e.disabled && t.$style.ui3nMenuTriggerDisabled]),
+			onClick: Q(b, ["stop"])
+		}, [K(t.$slots, "default")], 2), s.value ? Te((U(), I("div", de({
 			key: 0,
 			ref: "menu-content-element",
-			style: m.value,
+			style: h.value,
 			class: t.$style.ui3nMenuContent
-		}, ye(e.closeOnClick ? { click: g } : {}, !0)), [K(t.$slots, "menu")], 16)), [[J(On), _]]) : P("", !0)], 10, Zr));
+		}, ye(e.closeOnClick ? { click: x } : {}, !0)), [K(t.$slots, "menu")], 16)), [[J(On), S]]) : F("", !0)], 10, ei));
 	}
 }), [["__cssModules", { $style: {
-	ui3nMenu: "_ui3nMenu_r8nw6_3",
-	ui3nMenuTrigger: "_ui3nMenuTrigger_r8nw6_10",
-	ui3nMenuTriggerDisabled: "_ui3nMenuTriggerDisabled_r8nw6_14",
-	ui3nMenuContent: "_ui3nMenuContent_r8nw6_19"
-} }]]), $r = ["id"], ei = ["onClick"], ti = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nMenu: "_ui3nMenu_t6wf8_3",
+	ui3nMenuTrigger: "_ui3nMenuTrigger_t6wf8_11",
+	ui3nMenuTriggerDisabled: "_ui3nMenuTriggerDisabled_t6wf8_15",
+	ui3nMenuContent: "_ui3nMenuContent_t6wf8_20"
+} }]]), ni = ["id"], ri = ["onClick"], ii = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-list",
 	props: {
 		id: {},
@@ -2621,26 +2671,26 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	emits: ["select"],
 	setup(e, { emit: t }) {
 		let n = t;
-		return (t, r) => (U(), F("div", {
+		return (t, r) => (U(), I("div", {
 			ref: "listElement",
 			id: e.id,
-			class: z(t.$style.ui3nList)
-		}, [I("div", { class: z([t.$style.ui3nListTitle, e.sticky && t.$style.ui3nListTitleSticky]) }, [K(t.$slots, "title", {}, () => [e.title ? (U(), F("div", {
+			class: B(t.$style.ui3nList)
+		}, [L("div", { class: B([t.$style.ui3nListTitle, e.sticky && t.$style.ui3nListTitleSticky]) }, [K(t.$slots, "title", {}, () => [e.title ? (U(), I("div", {
 			key: 0,
-			class: z(t.$style.ui3nListTitleContent)
-		}, q(e.title), 3)) : P("", !0)])], 2), I("div", { class: z(t.$style.ui3nListContent) }, [(U(!0), F(j, null, G(e.items, (r, i) => (U(), F("div", {
+			class: B(t.$style.ui3nListTitleContent)
+		}, q(e.title), 3)) : F("", !0)])], 2), L("div", { class: B(t.$style.ui3nListContent) }, [(U(!0), I(M, null, G(e.items, (r, i) => (U(), I("div", {
 			key: r[e.keyField],
-			class: z(t.$style.ui3nListItem)
+			class: B(t.$style.ui3nListItem)
 		}, [K(t.$slots, "item", {
 			item: r,
 			index: i
-		}, () => [I("div", {
-			class: z([t.$style.ui3nListItemContent, e.disabled && t.$style.ui3nListItemContentDisabled]),
+		}, () => [L("div", {
+			class: B([t.$style.ui3nListItemContent, e.disabled && t.$style.ui3nListItemContentDisabled]),
 			onClick: Q((e) => n("select", {
 				value: r,
 				index: i
 			}), ["stop"])
-		}, q(r), 11, ei)])], 2))), 128))], 2)], 10, $r));
+		}, q(r), 11, ri)])], 2))), 128))], 2)], 10, ni));
 	}
 }), [["__cssModules", { $style: {
 	ui3nList: "_ui3nList_1mtxl_1",
@@ -2651,10 +2701,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	ui3nListItem: "_ui3nListItem_1mtxl_26",
 	ui3nListItemContent: "_ui3nListItemContent_1mtxl_43",
 	ui3nListItemContentDisabled: "_ui3nListItemContentDisabled_1mtxl_50"
-} }]]), ni = 32, ri = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), ai = 32, oi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-scrollbar-vertical",
 	props: {
-		thumbMinHeight: { default: ni },
+		thumbMinHeight: { default: ai },
 		thumbHeight: { default: "auto" },
 		thumbRadius: { default: 4 },
 		thumbColor: { default: "var(--color-bg-control-accent-default)" },
@@ -2670,10 +2720,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["scroll"],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, a = W(null), o = W(null), s = W(null), c = W(0), l = W(0), u = W(0), d = W(!1), f = W(!1), p = W(!1), m = null, h, g = 0, _ = 0, v = M(() => c.value > l.value), y = M(() => d.value ? !0 : v.value && (f.value || p.value)), b = M(() => {
+		let r = e, i = n, a = W(null), o = W(null), s = W(null), c = W(0), l = W(0), u = W(0), d = W(!1), f = W(!1), p = W(!1), m = null, h, g = 0, _ = 0, v = N(() => c.value > l.value), y = N(() => d.value ? !0 : v.value && (f.value || p.value)), b = N(() => {
 			let e = Number(r.thumbMinHeight);
-			return isNaN(e) ? ni : e;
-		}), x = M(() => {
+			return isNaN(e) ? ai : e;
+		}), x = N(() => {
 			if (!c.value) return 0;
 			if (r.thumbHeight !== "auto") {
 				let e = Number(r.thumbHeight);
@@ -2681,62 +2731,62 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			}
 			let e = l.value / c.value, t = l.value * e;
 			return Math.max(b.value, t);
-		}), S = M(() => {
+		}), S = N(() => {
 			if (!c.value || c.value === l.value) return 0;
 			let e = c.value - l.value, t = l.value - x.value;
 			return u.value / e * t;
-		}), C = M(() => {
+		}), C = N(() => {
 			let e = Number(r.thumbRadius);
 			return isNaN(e) ? String(r.thumbRadius) : `${e}px`;
-		}), w = M(() => r.thumbColor), T = M(() => r.thumbHoverColor), ee = M(() => r.thumbActiveColor), E = M(() => {
+		}), w = N(() => r.thumbColor), T = N(() => r.thumbHoverColor), ee = N(() => r.thumbActiveColor), E = N(() => {
 			let e = Number(r.trackWidth);
 			return isNaN(e) ? String(r.trackWidth) : `${e}px`;
-		}), te = M(() => r.trackColor), D = M(() => {
+		}), te = N(() => r.trackColor), D = N(() => {
 			let e = Number(r.trackRadius);
 			return isNaN(e) ? String(r.trackRadius) : `${e}px`;
 		});
 		function O() {
 			a.value && (c.value = a.value.scrollHeight, l.value = a.value.clientHeight, u.value = a.value.scrollTop);
 		}
-		function ne(e) {
-			d.value || (u.value = e.target.scrollTop), p.value = !0, window.clearTimeout(h), h = window.setTimeout(() => {
+		function k(e) {
+			d.value || (u.value = e.target.scrollTop), p.value = !0, h && clearTimeout(h), h = setTimeout(() => {
 				p.value = !1;
 			}, 1500), i("scroll", e);
 		}
-		function k(e) {
+		function A(e) {
 			if (e.target !== o.value || !a.value || !o.value) return;
 			let t = o.value.getBoundingClientRect(), n = e.clientY - t.top - x.value / 2, r = c.value - l.value, i = n / (l.value - x.value) * r;
 			i = Math.max(0, Math.min(r, i)), a.value.scrollTo({ top: i });
 		}
-		function re(e) {
-			!s.value || !a.value || (e.preventDefault(), e.stopPropagation(), s.value.setPointerCapture(e.pointerId), d.value = !0, g = e.clientY, _ = u.value, document.body.style.userSelect = "none", s.value.addEventListener("pointermove", ie), s.value.addEventListener("pointerup", A), s.value.addEventListener("pointercancel", A));
+		function ne(e) {
+			!s.value || !a.value || (e.pointerType === "mouse" && e.preventDefault(), e.stopPropagation(), s.value.setPointerCapture(e.pointerId), d.value = !0, g = e.clientY, _ = u.value, document.body.style.userSelect = "none", s.value.addEventListener("pointermove", re), s.value.addEventListener("pointerup", j), s.value.addEventListener("pointercancel", j));
 		}
-		function ie(e) {
+		function re(e) {
 			if (!d.value || !a.value) return;
 			let t = e.clientY - g, n = c.value - l.value, r = t / (l.value - x.value) * n;
 			a.value.scrollTop = _ + r, u.value = a.value.scrollTop;
 		}
-		function A(e) {
+		function j(e) {
 			if (d.value && (d.value = !1, document.body.style.userSelect = "", s.value)) {
 				try {
 					s.value.releasePointerCapture(e.pointerId);
 				} catch {}
-				s.value.removeEventListener("pointermove", ie), s.value.removeEventListener("pointerup", A), s.value.removeEventListener("pointercancel", A);
+				s.value.removeEventListener("pointermove", re), s.value.removeEventListener("pointerup", j), s.value.removeEventListener("pointercancel", j);
 			}
 		}
 		return H(() => {
 			O(), a.value && (m = new ResizeObserver(O), m.observe(a.value), r.autoUpdate && a.value.firstElementChild && m.observe(a.value.firstElementChild));
-		}), V(() => {
-			m?.disconnect(), window.clearTimeout(h), s.value && (s.value.removeEventListener("pointermove", ie), s.value.removeEventListener("pointerup", A), s.value.removeEventListener("pointercancel", A)), document.body.style.userSelect = "";
+		}), me(() => {
+			m?.disconnect(), h && clearTimeout(h), s.value && (s.value.removeEventListener("pointermove", re), s.value.removeEventListener("pointerup", j), s.value.removeEventListener("pointercancel", j)), document.body.style.userSelect = "";
 		}), t({
 			scrollTo: (e) => {
 				a.value?.scrollTo(e);
 			},
 			getContainer: () => a.value,
 			updateMetrics: O
-		}), (e, t) => (U(), F("div", {
-			class: z(e.$style.ui3nScrollbarVertical),
-			style: B({
+		}), (e, t) => (U(), I("div", {
+			class: B(e.$style.ui3nScrollbarVertical),
+			style: V({
 				"--ui3n-scrollbar-thumb-radius": C.value,
 				"--ui3n-scrollbar-thumb-color": w.value,
 				"--ui3n-scrollbar-thumb-hover-color": T.value,
@@ -2747,35 +2797,35 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			}),
 			onMouseenter: t[0] ||= (e) => f.value = !0,
 			onMouseleave: t[1] ||= (e) => f.value = !1
-		}, [I("div", {
+		}, [L("div", {
 			ref_key: "containerRef",
 			ref: a,
-			class: z(e.$style.scrollbarContainer),
-			onScroll: ne
-		}, [K(e.$slots, "default")], 34), I("div", {
+			class: B(e.$style.scrollbarContainer),
+			onScroll: k
+		}, [K(e.$slots, "default")], 34), L("div", {
 			ref_key: "trackRef",
 			ref: o,
-			class: z([e.$style.track, { [e.$style.trackVisible]: y.value }]),
-			onPointerdown: k
-		}, [I("div", {
+			class: B([e.$style.track, { [e.$style.trackVisible]: y.value }]),
+			onPointerdown: A
+		}, [L("div", {
 			ref_key: "thumbRef",
 			ref: s,
-			class: z([e.$style.thumb, { [e.$style.active]: d.value }]),
-			style: B({
+			class: B([e.$style.thumb, { [e.$style.active]: d.value }]),
+			style: V({
 				height: `${x.value}px`,
 				transform: `translateY(${S.value}px)`
 			}),
-			onPointerdown: re
+			onPointerdown: ne
 		}, null, 38)], 34)], 38));
 	}
 }), [["__cssModules", { $style: {
-	ui3nScrollbarVertical: "_ui3nScrollbarVertical_fjwb1_1",
-	scrollbarContainer: "_scrollbarContainer_fjwb1_8",
-	track: "_track_fjwb1_21",
-	trackVisible: "_trackVisible_fjwb1_36",
-	thumb: "_thumb_fjwb1_42",
-	active: "_active_fjwb1_55"
-} }]]), ii = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nScrollbarVertical: "_ui3nScrollbarVertical_m0o0t_1",
+	scrollbarContainer: "_scrollbarContainer_m0o0t_9",
+	track: "_track_m0o0t_23",
+	trackVisible: "_trackVisible_m0o0t_38",
+	thumb: "_thumb_m0o0t_44",
+	active: "_active_m0o0t_57"
+} }]]), si = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-virtual-scroll",
 	props: {
 		items: {},
@@ -2783,16 +2833,15 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		renderAhead: { default: 20 }
 	},
 	setup(e) {
-		xe((e) => ({ ff57f5da: t.minChildHeight + "px" }));
-		let t = e, n = W(0), r = W(null), i = W(null), a = ve([]), o = W(0), s = !1, c = null, l = null, u = /* @__PURE__ */ new Map(), d = M(() => {
+		let t = e, n = W(0), r = W(null), i = W(null), a = ve([]), o = W(0), s = !1, c = null, l = null, u = /* @__PURE__ */ new Map(), d = N(() => {
 			if (o.value, !a.value.length) return 0;
 			let e = a.value[a.value.length - 1];
 			return e.top + e.height;
-		}), f = M(() => {
+		}), f = N(() => {
 			if (r.value !== null) return r.value;
 			let e = i.value?.getContainer();
 			return e ? e.clientHeight : 0;
-		}), p = M(() => {
+		}), p = N(() => {
 			o.value;
 			let e = n.value;
 			if (!a.value.length) return 0;
@@ -2805,10 +2854,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				} else n.top > e ? i = t - 1 : r = t + 1;
 			}
 			return s === -1 && (s = Math.max(0, i)), Math.max(0, s - t.renderAhead);
-		}), m = M(() => {
+		}), m = N(() => {
 			let e = f.value;
 			return e ? Math.ceil(e / t.minChildHeight) + 2 * t.renderAhead : t.renderAhead * 2;
-		}), h = M(() => (o.value, a.value.length && a.value[p.value]?.top || 0)), g = M(() => {
+		}), h = N(() => (o.value, a.value.length && a.value[p.value]?.top || 0)), g = N(() => {
 			let e = p.value, n = m.value;
 			return e + n >= t.items.length - t.renderAhead ? t.items.slice(e) : t.items.slice(e, e + n);
 		});
@@ -2859,38 +2908,41 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 					}
 				});
 			});
-		}), V(() => {
+		}), me(() => {
 			c?.disconnect(), l?.disconnect();
-		}), Y(() => t.items, y, { immediate: !0 }), (e, t) => (U(), N(ri, {
+		}), Y(() => t.items, y, { immediate: !0 }), (e, n) => (U(), P(oi, {
 			ref_key: "scrollbarComponentRef",
 			ref: i,
-			class: z(e.$style.ui3nVirtualScroll),
+			class: B(e.$style.ui3nVirtualScroll),
 			"auto-update": !1,
 			onScroll: _
 		}, {
-			default: X(() => [I("div", {
-				class: z(e.$style.viewport),
-				style: B({ height: `${d.value}px` })
-			}, [I("div", {
-				class: z(e.$style.content),
-				style: B({ transform: `translateY(${h.value}px)` })
-			}, [(U(!0), F(j, null, G(g.value, (t, n) => (U(), F("div", pe({
-				key: t.id,
+			default: X(() => [L("div", {
+				class: B(e.$style.viewport),
+				style: V({ height: `${d.value}px` })
+			}, [L("div", {
+				class: B(e.$style.content),
+				style: V({ transform: `translateY(${h.value}px)` })
+			}, [(U(!0), I(M, null, G(g.value, (n, r) => (U(), I("div", de({
+				key: n.id ?? `v-node-${p.value + r}`,
 				ref_for: !0,
-				ref: (e) => v(e, t.id ?? p.value + n)
-			}, { ref_for: !0 }, { "data-sid": t.id ?? p.value + n }, { class: e.$style.item }), [K(e.$slots, "item", {
-				value: t,
-				index: p.value + n
+				ref: (e) => v(e, n.id ?? p.value + r)
+			}, { ref_for: !0 }, { "data-sid": n.id ?? p.value + r }, {
+				class: e.$style.item,
+				style: { minHeight: `${t.minChildHeight}px` }
+			}), [K(e.$slots, "item", {
+				value: n,
+				index: p.value + r
 			})], 16))), 128))], 6)], 6)]),
 			_: 3
 		}, 8, ["class"]));
 	}
 }), [["__cssModules", { $style: {
-	ui3nVirtualScroll: "_ui3nVirtualScroll_180po_1",
-	viewport: "_viewport_180po_5",
-	content: "_content_180po_14",
-	item: "_item_180po_18"
-} }]]), ai = ["id"], oi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nVirtualScroll: "_ui3nVirtualScroll_1mjyl_1",
+	viewport: "_viewport_1mjyl_5",
+	content: "_content_1mjyl_14",
+	item: "_item_1mjyl_18"
+} }]]), ci = ["id"], li = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-tabs",
 	props: {
 		id: {},
@@ -2904,9 +2956,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, i = be(), a = W(null), o = W(n.modelValue);
-		W(null);
-		let s = M(() => ({
+		let n = e, r = t, i = be(), a = W(null), o = W(n.modelValue), s = N(() => ({
 			"--ui3n-tabs-active-color": n.activeColor,
 			"--ui3n-tabs-inactive-color": n.inactiveColor,
 			"--ui3n-tabs-indicator-color": n.indicatorColor,
@@ -2931,26 +2981,26 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			}
 		}
 		return Y(() => n.modelValue, (e) => {
-			e !== o.value && (o.value = e, me(() => {
+			e !== o.value && (o.value = e, fe(() => {
 				c();
 			}));
 		}, { immediate: !0 }), H(() => {
 			c();
-		}), (t, n) => (U(), F("div", {
+		}), (t, n) => (U(), I("div", {
 			ref_key: "tabs",
 			ref: a,
 			id: e.id,
-			style: B(s.value),
-			class: z([J(i).ui3nTabs, e.itemDirection === "vertical" && J(i).vertical]),
+			style: V(s.value),
+			class: B([J(i).ui3nTabs, e.itemDirection === "vertical" && J(i).vertical]),
 			onClick: l
-		}, [K(t.$slots, "default")], 14, ai));
+		}, [K(t.$slots, "default")], 14, ci));
 	}
 }), [["__cssModules", { $style: {
 	ui3nTabs: "_ui3nTabs_1yilq_3",
 	item: "_item_1yilq_13",
 	active: "_active_1yilq_52",
 	vertical: "_vertical_1yilq_60"
-} }]]), si = ["id"], ci = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), ui = ["id"], di = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-badge-simple",
 	props: {
 		id: {},
@@ -2970,7 +3020,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		}));
 		let n = e, r = t, i = W(null);
 		function a() {
-			me(() => {
+			fe(() => {
 				i.value && r("change:size", {
 					width: i.value.offsetWidth,
 					height: i.value.offsetHeight
@@ -2979,21 +3029,21 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		}
 		return Y(() => [n.value, n.dot], () => a()), H(() => {
 			a();
-		}), (t, n) => (U(), F("div", {
+		}), (t, n) => (U(), I("div", {
 			ref_key: "element",
 			ref: i,
 			id: e.id,
-			class: z([t.$style.ui3nBadgeSimple, e.dot && t.$style.ui3nBadgeDot])
-		}, [e.dot ? P("", !0) : (U(), F("span", {
+			class: B([t.$style.ui3nBadgeSimple, e.dot && t.$style.ui3nBadgeDot])
+		}, [e.dot ? F("", !0) : (U(), I("span", {
 			key: 0,
-			class: z(t.$style.ui3nBadgeText)
-		}, q(e.value), 3))], 10, si));
+			class: B(t.$style.ui3nBadgeText)
+		}, q(e.value), 3))], 10, ui));
 	}
 }), [["__cssModules", { $style: {
 	ui3nBadgeSimple: "_ui3nBadgeSimple_1vu4n_1",
 	ui3nBadgeDot: "_ui3nBadgeDot_1vu4n_12",
 	ui3nBadgeText: "_ui3nBadgeText_1vu4n_30"
-} }]]), li = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), fi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-badge",
 	props: {
 		id: {},
@@ -3007,26 +3057,26 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		position: { default: "right-top" }
 	},
 	setup(e) {
-		let t = e, n = Se(), r = W(), i = M(() => !!n.default), a = M(() => {
+		let t = e, n = Se(), r = W(), i = N(() => !!n.default), a = N(() => {
 			let [e, n] = t.position.split("-");
 			return {
-				...e === "right" && { right: `-${(0, Vr.default)(r.value, "width", 0) / 2}px` },
-				...e === "left" && { left: `-${(0, Vr.default)(r.value, "width", 0) / 2}px` },
-				...n === "top" && { top: `-${(0, Vr.default)(r.value, "height", 0) / 2}px` },
-				...n === "bottom" && { bottom: `-${(0, Vr.default)(r.value, "height", 0) / 2}px` }
+				...e === "right" && { right: `-${(0, Ur.default)(r.value, "width", 0) / 2}px` },
+				...e === "left" && { left: `-${(0, Ur.default)(r.value, "width", 0) / 2}px` },
+				...n === "top" && { top: `-${(0, Ur.default)(r.value, "height", 0) / 2}px` },
+				...n === "bottom" && { bottom: `-${(0, Ur.default)(r.value, "height", 0) / 2}px` }
 			};
 		});
-		return (t, n) => i.value ? (U(), F("div", {
+		return (t, n) => i.value ? (U(), I("div", {
 			key: 0,
-			class: z(t.$style.ui3nBadge)
-		}, [I("div", { class: z(t.$style.ui3nBadgeWrapper) }, [K(t.$slots, "default"), L(ci, {
+			class: B(t.$style.ui3nBadge)
+		}, [L("div", { class: B(t.$style.ui3nBadgeWrapper) }, [K(t.$slots, "default"), R(di, {
 			id: e.id,
 			dot: e.dot,
 			value: e.value,
 			color: e.color,
 			"text-color": e.textColor,
-			style: B(a.value),
-			class: z(t.$style.ui3nBadgeContent),
+			style: V(a.value),
+			class: B(t.$style.ui3nBadgeContent),
 			"onChange:size": n[0] ||= (e) => r.value = e
 		}, null, 8, [
 			"id",
@@ -3036,7 +3086,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			"text-color",
 			"style",
 			"class"
-		])], 2)], 2)) : (U(), N(ci, {
+		])], 2)], 2)) : (U(), P(di, {
 			key: 1,
 			id: e.id,
 			dot: e.dot,
@@ -3055,7 +3105,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	ui3nBadge: "_ui3nBadge_1slsk_1",
 	ui3nBadgeWrapper: "_ui3nBadgeWrapper_1slsk_6",
 	ui3nBadgeContent: "_ui3nBadgeContent_1slsk_12"
-} }]]), ui = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), pi = { key: 2 }, mi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-breadcrumb",
 	props: {
 		separator: { default: void 0 },
@@ -3070,25 +3120,22 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["click"],
 	setup(e, { emit: t }) {
-		let n = e, r = t, i = be(), a = M(() => n.separator ? n.separator : de()?.parent?.props.separator || "/"), o = M(() => de()?.parent?.props.disabled || !1), s = M(() => {
-			let e = [i.ui3nBreadcrumb];
-			return n.isActive && e.push(i.ui3nBreadcrumbActive), (n.disabled || o.value) && e.push(i.ui3nBreadcrumbDisabled), e;
+		let n = e, r = t, i = Se(), a = be(), o = ue("ui3n-breadcrumbs-context", null), s = N(() => n.separator ? n.separator : o ? o.separator() : "/"), c = N(() => o ? o.disabled() : !1), l = N(() => {
+			let e = [a.ui3nBreadcrumb];
+			return n.isActive && e.push(a.ui3nBreadcrumbActive), (n.disabled || c.value) && e.push(a.ui3nBreadcrumbDisabled), e;
 		});
-		function c(e) {
+		function u(e) {
 			r("click", e);
 		}
-		return (t, n) => (U(), F("div", pe({ class: s.value }, ye(e.isActive && !(e.disabled || o.value) ? { click: c } : {}, !0)), [K(t.$slots, "default"), e.isActive ? (U(), F("div", {
-			key: 0,
-			class: z(t.$style.ui3nBreadcrumbSeparator)
-		}, [K(t.$slots, "separator", {}, () => [I("span", null, q(a.value), 1)])], 2)) : P("", !0)], 16));
+		return (t, n) => (U(), I("div", de({ class: l.value }, ye(e.isActive && !(e.disabled || c.value) ? { click: u } : {}, !0)), [L("span", { class: B(t.$style.content) }, [K(t.$slots, "default")], 2), L("div", { class: B(t.$style.ui3nBreadcrumbSeparator) }, [typeof J(i).separator == "function" ? K(t.$slots, "separator", { key: 0 }) : J(o)?.customSeparatorSlot ? (U(), P(_e(J(o).customSeparatorSlot), { key: 1 })) : (U(), I("span", pi, q(s.value), 1))], 2)], 16));
 	}
 }), [["__cssModules", { $style: {
-	ui3nBreadcrumb: "_ui3nBreadcrumb_1fr5q_1",
-	separator: "_separator_1fr5q_12",
-	ui3nBreadcrumbActive: "_ui3nBreadcrumbActive_1fr5q_18",
-	ui3nBreadcrumbSeparator: "_ui3nBreadcrumbSeparator_1fr5q_28",
-	ui3nBreadcrumbDisabled: "_ui3nBreadcrumbDisabled_1fr5q_36"
-} }]]), di = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nBreadcrumb: "_ui3nBreadcrumb_1tz9w_1",
+	ui3nBreadcrumbSeparator: "_ui3nBreadcrumbSeparator_1tz9w_10",
+	content: "_content_1tz9w_14",
+	ui3nBreadcrumbActive: "_ui3nBreadcrumbActive_1tz9w_28",
+	ui3nBreadcrumbDisabled: "_ui3nBreadcrumbDisabled_1tz9w_33"
+} }]]), hi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-breadcrumbs",
 	props: {
 		separator: { default: "/" },
@@ -3098,14 +3145,19 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		}
 	},
 	setup(e) {
-		return (e, t) => (U(), F("div", { class: z(e.$style.ui3nBreadcrumbs) }, [K(e.$slots, "default")], 2));
-	}
-}), [["__cssModules", { $style: { ui3nBreadcrumbs: "_ui3nBreadcrumbs_1xm1m_1" } }]]), fi = ["id"], pi = [
+		let t = e;
+		return ge("ui3n-breadcrumbs-context", {
+			separator: () => t.separator,
+			disabled: () => t.disabled,
+			customSeparatorSlot: Se().separator
+		}), (e, t) => (U(), I("div", { class: B(e.$style.ui3nBreadcrumbs) }, [K(e.$slots, "default")], 2));
+	}
+}), [["__cssModules", { $style: { ui3nBreadcrumbs: "_ui3nBreadcrumbs_1oq6f_1" } }]]), gi = ["id", "tabindex"], _i = [
 	"name",
 	"checked",
 	"disabled",
 	"value"
-], mi = ["tabindex"], hi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+], vi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-switch",
 	props: {
 		id: {},
@@ -3120,74 +3172,71 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["change", "update:modelValue"],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, a = Se(), o = W(null), s = W(!1), c = M(() => ({
+		let r = e, i = n, a = Se(), o = W(!1), s = N(() => ({
 			"--ui3n-switch-color": r.color,
 			"--ui3n-switch-size": `${r.size}px`
 		}));
-		function l(e) {
-			e.preventDefault(), s.value = !s.value, i("change", s.value), i("update:modelValue", s.value);
+		function c(e) {
+			e.preventDefault(), !r.disabled && (o.value = !o.value, i("change", o.value), i("update:modelValue", o.value));
 		}
-		function u() {
-			s.value = !1, i("change", !1), i("update:modelValue", !1);
+		function l() {
+			o.value = !1, i("change", !1), i("update:modelValue", !1);
 		}
-		return t({ clear: u }), Y(() => r.name, (e) => {
-			e || u();
-		}), Y(() => r.modelValue, (e) => s.value = e, { immediate: !0 }), (t, n) => (U(), F("div", {
-			ref_key: "switchEl",
-			ref: o,
+		return t({ clear: l }), Y(() => r.name, (e) => {
+			e || l();
+		}), Y(() => r.modelValue, (e) => o.value = e, { immediate: !0 }), (t, n) => (U(), I("div", {
 			id: e.id,
-			style: B(c.value),
-			class: z([
+			style: V(s.value),
+			tabindex: e.disabled ? -1 : 0,
+			class: B([
 				t.$style.ui3nSwitch,
-				s.value && t.$style.checked,
+				o.value && t.$style.checked,
 				!J(a).default && t.$style.noLabel,
 				e.disabled && t.$style.disabled
-			])
+			]),
+			onKeydown: [Z(c, ["enter"]), Z(c, ["space"])],
+			onClick: c
 		}, [
-			e.name ? (U(), F("input", {
+			e.name ? (U(), I("input", {
 				key: 0,
 				type: "checkbox",
 				hidden: "",
 				name: e.name,
-				checked: s.value,
+				checked: o.value,
 				disabled: e.disabled,
-				value: s.value ? "on" : ""
-			}, null, 8, pi)) : P("", !0),
-			I("div", {
-				class: z(t.$style.body),
-				tabindex: e.disabled ? -1 : 0,
-				onKeydown: [Z(l, ["enter"]), Z(l, ["space"])],
-				onClick: l
-			}, [I("div", { class: z([t.$style.dot, s.value ? t.$style.right : t.$style.left]) }, null, 2)], 42, mi),
-			I("div", { class: z(t.$style.label) }, [K(t.$slots, "default")], 2)
-		], 14, fi));
+				value: o.value ? "on" : ""
+			}, null, 8, _i)) : F("", !0),
+			L("div", { class: B(t.$style.body) }, [L("div", { class: B([t.$style.dot, o.value ? t.$style.right : t.$style.left]) }, null, 2)], 2),
+			L("div", { class: B(t.$style.label) }, [K(t.$slots, "default")], 2)
+		], 46, gi));
 	}
 }), [["__cssModules", { $style: {
-	ui3nSwitch: "_ui3nSwitch_audi7_1",
-	body: "_body_audi7_15",
-	checked: "_checked_audi7_24",
-	dot: "_dot_audi7_27",
-	noLabel: "_noLabel_audi7_31",
-	left: "_left_audi7_47",
-	right: "_right_audi7_51",
-	label: "_label_audi7_55",
-	disabled: "_disabled_audi7_63"
-} }]]), gi = ["id"], _i = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nSwitch: "_ui3nSwitch_1lo7b_1",
+	body: "_body_1lo7b_21",
+	checked: "_checked_1lo7b_30",
+	dot: "_dot_1lo7b_33",
+	noLabel: "_noLabel_1lo7b_37",
+	left: "_left_1lo7b_53",
+	right: "_right_1lo7b_57",
+	label: "_label_1lo7b_61",
+	disabled: "_disabled_1lo7b_68"
+} }]]), yi = ["id"], bi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-step-line-bar",
 	props: {
 		id: {},
 		label: {},
 		current: { default: 1 },
-		steps: {}
+		steps: { default: 1 }
 	},
 	setup(e) {
-		return (t, n) => (U(), F("div", {
+		let t = e, n = N(() => Math.max(0, Math.floor(t.steps)));
+		return (t, r) => (U(), I("div", {
 			id: e.id,
-			class: z(t.$style.ui3nStepLineBar)
-		}, [I("div", { class: z(t.$style.label) }, q(e.label), 3), I("div", { class: z(t.$style.body) }, [(U(!0), F(j, null, G(e.steps, (n) => (U(), F("div", {
+			class: B(t.$style.ui3nStepLineBar)
+		}, [L("div", { class: B(t.$style.label) }, q(e.label), 3), L("div", { class: B(t.$style.body) }, [(U(!0), I(M, null, G(n.value, (n) => (U(), I("div", {
 			key: n,
-			class: z([t.$style.step, n <= e.current && t.$style.active])
-		}, null, 2))), 128))], 2)], 10, gi));
+			class: B([t.$style.step, n <= e.current && t.$style.active])
+		}, null, 2))), 128))], 2)], 10, yi));
 	}
 }), [["__cssModules", { $style: {
 	ui3nStepLineBar: "_ui3nStepLineBar_119zg_1",
@@ -3195,140 +3244,122 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	body: "_body_119zg_17",
 	step: "_step_119zg_25",
 	active: "_active_119zg_33"
-} }]]), vi = /* @__PURE__ */ p(Mn(), 1), yi = 12, bi = 5, xi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), xi = 12, Si = 5, Ci = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-progress-linear",
 	props: {
 		value: { default: 0 },
 		height: { default: 2 },
-		withText: { type: Boolean },
+		withText: {
+			type: Boolean,
+			default: !1
+		},
 		bgColor: { default: "var(--color-bg-control-primary-default)" },
 		color: { default: "var(--color-bg-control-accent-default)" },
-		indeterminate: { type: Boolean }
+		indeterminate: {
+			type: Boolean,
+			default: !1
+		}
 	},
 	setup(e) {
-		let t = e, n = M(() => t.withText && !t.indeterminate), r = M(() => (0, vi.default)(t.height)), i = M(() => (0, vi.default)(t.value)), a = M(() => t.indeterminate ? "20%" : `${Math.min(i.value, 100)}%`), o = M(() => ({
+		let t = e, n = (e) => {
+			let t = parseFloat(String(e));
+			return isNaN(t) ? 0 : t;
+		}, r = N(() => n(t.height)), i = N(() => {
+			let e = n(t.value);
+			return Math.min(Math.max(e, 0), 100);
+		}), a = N(() => t.withText && !t.indeterminate), o = N(() => `${i.value}%`), s = N(() => ({
 			"--ui3n-progress-linear-height": `${r.value}px`,
 			"--ui3n-progress-linear-bg": t.bgColor,
 			"--ui3n-progress-linear-color": t.color,
 			"--ui3n-progress-linear-font-size": `${Math.max(r.value - 2, 10)}px`
 		}));
-		return (t, s) => (U(), F("div", {
-			style: B(o.value),
-			class: z([t.$style.ui3nProgressLinear, e.indeterminate && t.$style.indeterminate])
-		}, [n.value && r.value < yi ? (U(), F("div", {
+		return (t, n) => (U(), I("div", {
+			style: V(s.value),
+			class: B([t.$style.ui3nProgressLinear, e.indeterminate && t.$style.indeterminate])
+		}, [a.value && r.value < xi ? (U(), I("div", {
 			key: 0,
-			class: z([t.$style.text, t.$style.above])
-		}, q(a.value), 3)) : P("", !0), I("div", { class: z(t.$style.body) }, [I("div", {
-			class: z(t.$style.value),
-			style: B({ width: a.value })
-		}, [n.value && r.value >= yi && i.value >= bi ? (U(), F("div", {
+			class: B([t.$style.text, t.$style.above])
+		}, q(o.value), 3)) : F("", !0), L("div", { class: B(t.$style.body) }, [L("div", {
+			class: B(t.$style.value),
+			style: V(e.indeterminate ? void 0 : { width: o.value })
+		}, [a.value && r.value >= xi && i.value >= Si ? (U(), I("div", {
 			key: 0,
-			class: z(t.$style.text)
-		}, q(a.value), 3)) : P("", !0)], 6)], 2)], 6));
+			class: B(t.$style.text)
+		}, q(o.value), 3)) : F("", !0)], 6)], 2)], 6));
 	}
 }), [["__cssModules", { $style: {
-	ui3nProgressLinear: "_ui3nProgressLinear_144v6_1",
-	body: "_body_144v6_6",
-	value: "_value_144v6_15",
-	text: "_text_144v6_27",
-	above: "_above_144v6_34",
-	indeterminate: "_indeterminate_144v6_43",
-	move: "_move_144v6_1"
-} }]]), Si = ["height", "width"], Ci = ["r"], wi = ["r", "stroke-dasharray"], Ti = 64, Ei = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nProgressLinear: "_ui3nProgressLinear_1avv2_1",
+	body: "_body_1avv2_7",
+	value: "_value_1avv2_16",
+	text: "_text_1avv2_29",
+	above: "_above_1avv2_37",
+	indeterminate: "_indeterminate_1avv2_47",
+	"linear-fly": "_linear-fly_1avv2_1"
+} }]]), wi = ["height", "width"], Ti = ["r"], Ei = ["r", "stroke-dasharray"], Di = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-progress-circular",
 	props: {
 		value: { default: 0 },
 		size: { default: 64 },
 		width: {},
-		withText: { type: Boolean },
+		withText: {
+			type: Boolean,
+			default: !1
+		},
 		bgColor: { default: "var(--color-bg-control-primary-default)" },
 		color: { default: "var(--color-bg-control-accent-default)" },
-		indeterminate: { type: Boolean }
+		indeterminate: {
+			type: Boolean,
+			default: !1
+		}
 	},
 	setup(e) {
-		let t = [
-			1,
-			5,
-			10,
-			15,
-			20,
-			30,
-			40,
-			50,
-			60,
-			70,
-			80,
-			85,
-			90,
-			95,
-			99
-		], n = e, r = be(), i = W(), a = M(() => n.withText && !n.indeterminate), o = M(() => (0, vi.default)(n.size)), s = M(() => {
-			if (n.width) return (0, vi.default)(n.width);
-			let e = o.value - Ti;
-			return e <= 0 ? Math.round(o.value / 10) : 6 + Math.round(e / 20);
-		}), c = M(() => (0, vi.default)(n.value)), l = M(() => `${Math.floor((o.value - 2 * s.value) / 3.2)}px`), u = M(() => Math.round(o.value / 2) - Math.round(s.value / 2)), d = M(() => Math.round(Math.PI * 2 * u.value)), f = W(null), p = W(0), m = W(!1), h = M(() => ({
-			"--ui3n-progress-circular-size": `${o.value}px`,
-			"--ui3n-progress-circular-width": `${s.value}px`,
-			"--ui3n-progress-circular-font-size": l.value,
-			"--ui3n-progress-circular-bg": n.bgColor,
-			"--ui3n-progress-circular-color": n.color
-		})), g = M(() => {
-			let e = n.indeterminate ? p.value : c.value, t = Math.round(d.value * e / 100);
-			return `${t} ${d.value - t}`;
-		});
-		function _() {
-			if (f.value) return;
-			let e = t.length, n = 0;
-			f.value = setInterval(() => {
-				p.value = t[n % e], n += 1, n % e === 1 && (m.value = !m.value);
-			}, 200);
-		}
-		function v() {
-			f.value &&= (clearInterval(f.value), null);
-		}
-		return Y(() => n.indeterminate, (e) => {
-			e ? _() : (v(), m.value = !1, p.value = 0);
-		}, { immediate: !0 }), V(() => {
-			v();
-		}), (t, n) => (U(), F("div", {
-			ref_key: "element",
-			ref: i,
-			style: B(h.value),
-			class: z([
-				J(r).ui3nProgressCircular,
-				e.indeterminate && J(r).indeterminate,
-				m.value && J(r).inverse
-			])
-		}, [(U(), F("svg", {
-			height: o.value,
-			width: o.value,
-			class: z(J(r).pie)
-		}, [I("circle", {
-			class: z(J(r).background),
-			r: u.value,
-			cx: "50%",
-			cy: "50%"
-		}, null, 10, Ci), I("circle", {
-			class: z(J(r).chart),
-			r: u.value,
-			cx: "50%",
-			cy: "50%",
-			"stroke-dasharray": g.value
-		}, null, 10, wi)], 10, Si)), a.value ? (U(), F("div", {
+		let t = e, n = (e) => {
+			let t = parseFloat(String(e));
+			return isNaN(t) ? 0 : t;
+		}, r = N(() => n(t.size) || 64), i = N(() => Math.min(Math.max(n(t.value), 0), 100)), a = N(() => t.withText && !t.indeterminate), o = N(() => t.width ? n(t.width) / r.value * 100 : 8), s = N(() => (100 - o.value) / 2), c = N(() => Math.round(Math.PI * 2 * s.value)), l = N(() => {
+			let e = Math.round(c.value * i.value / 100);
+			return `${e} ${c.value - e}`;
+		}), u = N(() => `${Math.floor(r.value / 3.8)}px`), d = N(() => ({
+			"--ui3n-progress-circular-size": `${r.value}px`,
+			"--ui3n-progress-circular-font-size": u.value,
+			"--ui3n-progress-circular-bg": t.bgColor,
+			"--ui3n-progress-circular-color": t.color,
+			"--ui3n-progress-virtual-width": String(o.value)
+		}));
+		return (t, n) => (U(), I("div", {
+			style: V(d.value),
+			class: B([t.$style.ui3nProgressCircular, e.indeterminate && t.$style.indeterminate])
+		}, [(U(), I("svg", {
+			height: r.value,
+			width: r.value,
+			viewBox: "0 0 100 100",
+			class: B(t.$style.pie)
+		}, [L("circle", {
+			class: B(t.$style.background),
+			r: s.value,
+			cx: "50",
+			cy: "50"
+		}, null, 10, Ti), L("circle", {
+			class: B(t.$style.chart),
+			r: s.value,
+			cx: "50",
+			cy: "50",
+			"stroke-dasharray": e.indeterminate ? void 0 : l.value
+		}, null, 10, Ei)], 10, wi)), a.value ? (U(), I("div", {
 			key: 0,
-			class: z(J(r).text)
-		}, q(c.value) + "% ", 3)) : P("", !0)], 6));
+			class: B(t.$style.text)
+		}, q(i.value) + "% ", 3)) : F("", !0)], 6));
 	}
 }), [["__cssModules", { $style: {
-	ui3nProgressCircular: "_ui3nProgressCircular_1lgms_1",
-	inverse: "_inverse_1lgms_12",
-	background: "_background_1lgms_12",
-	chart: "_chart_1lgms_15",
-	indeterminate: "_indeterminate_1lgms_18",
-	pie: "_pie_1lgms_22",
-	text: "_text_1lgms_43",
-	spin: "_spin_1lgms_1"
-} }]]), Di = 5, Oi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nProgressCircular: "_ui3nProgressCircular_zypt9_1",
+	pie: "_pie_zypt9_13",
+	background: "_background_zypt9_19",
+	chart: "_chart_zypt9_26",
+	text: "_text_zypt9_33",
+	indeterminate: "_indeterminate_zypt9_45",
+	"circular-spin": "_circular-spin_zypt9_1",
+	"circular-dash": "_circular-dash_zypt9_1"
+} }]]), Oi = 5, ki = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-tooltip",
 	props: {
 		id: {},
@@ -3342,7 +3373,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		offsetX: { default: 0 },
 		offsetY: { default: 0 },
 		trigger: { default: "hover" },
-		disabled: { type: Boolean }
+		disabled: {
+			type: Boolean,
+			default: !1
+		}
 	},
 	emits: [
 		"open",
@@ -3352,80 +3386,91 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		"update:modelValue"
 	],
 	setup(e, { emit: t }) {
-		let n = e, r = t, i = W(!1), a = W(null), o = W(null), s = W(null), c = M(() => {
+		let n = e, r = t, i = W(!1), a = W(null), o = W(null), s = W(null), c = W(!1), l = N(() => {
 			let [e] = n.placement.split("-");
 			return e;
-		}), l = M(() => {
+		}), u = N(() => {
 			let e = {
 				mainAxis: 0,
 				crossAxis: 0
 			};
-			switch (c.value) {
+			switch (l.value) {
 				case "top":
-					e.mainAxis = -1 * Number(n.offsetY) + Di, e.crossAxis = Number(n.offsetX);
+					e.mainAxis = -1 * Number(n.offsetY) + Oi, e.crossAxis = Number(n.offsetX);
 					break;
 				case "bottom":
-					e.mainAxis = Number(n.offsetY) + Di, e.crossAxis = Number(n.offsetX);
+					e.mainAxis = Number(n.offsetY) + Oi, e.crossAxis = Number(n.offsetX);
 					break;
 				case "left":
-					e.mainAxis = -1 * Number(n.offsetX) + Di, e.crossAxis = Number(n.offsetY);
+					e.mainAxis = -1 * Number(n.offsetX) + Oi, e.crossAxis = Number(n.offsetY);
 					break;
 				case "right":
-					e.mainAxis = Number(n.offsetX) + Di, e.crossAxis = Number(n.offsetY);
+					e.mainAxis = Number(n.offsetX) + Oi, e.crossAxis = Number(n.offsetY);
 					break;
 			}
 			return e;
-		}), u = M(() => [ke(l.value), Ee({
+		}), d = N(() => [ke(u.value), Ee({
 			element: s,
 			padding: 8
-		})]), { floatingStyles: d, isPositioned: f, middlewareData: p } = je(a, o, {
+		})]), { floatingStyles: f, isPositioned: p, middlewareData: m } = je(a, o, {
 			open: i,
 			placement: n.placement,
 			strategy: n.positionStrategy,
-			middleware: u,
+			middleware: d,
 			whileElementsMounted: n.positionStrategy === "fixed" ? De : void 0
-		}), m = M(() => ({
-			...d.value,
-			"--ui3n-tooltip-bg-color": n.color,
-			"--ui3n-tooltip-text-color": n.textColor,
-			"--ui3n-tooltip-max-width": `${n.maxContentWidth}px`,
-			"--ui3n-tooltip-arrow-size": `${Di}px`,
-			"--ui3n-tooltip-base-offset": "-5px"
-		}));
-		function h() {
+		}), h = N(() => {
+			let e = typeof n.maxContentWidth == "number" || !isNaN(Number(n.maxContentWidth)) ? `${n.maxContentWidth}px` : String(n.maxContentWidth);
+			return {
+				...f.value,
+				"--ui3n-tooltip-bg-color": n.color,
+				"--ui3n-tooltip-text-color": n.textColor,
+				"--ui3n-tooltip-max-width": e,
+				"--ui3n-tooltip-arrow-size": `${Oi}px`,
+				"--ui3n-tooltip-base-offset": "-5px"
+			};
+		});
+		function g() {
 			n.disabled || (i.value = !0, r("open"), r("update:modelValue", !0));
 		}
-		function g() {
+		function _() {
 			n.disabled && !i.value || (i.value = !1, r("close"), r("update:modelValue", !1));
 		}
-		function _() {
-			n.disabled && !i.value || (i.value ? g() : h());
+		function v() {
+			n.disabled && !i.value || (i.value ? _() : g());
+		}
+		function y() {
+			a.value && (a.value.removeEventListener("mouseenter", g), a.value.removeEventListener("mouseleave", _), a.value.removeEventListener("click", v));
+		}
+		function b() {
+			y(), !(!a.value || n.disabled) && (n.trigger === "hover" ? (a.value.addEventListener("mouseenter", g), a.value.addEventListener("mouseleave", _)) : n.trigger === "click" && a.value.addEventListener("click", v));
 		}
 		return H(() => {
-			a.value && (n.trigger === "hover" ? (a.value.addEventListener("mouseenter", h), a.value.addEventListener("mouseleave", g)) : n.trigger === "click" && a.value.addEventListener("click", _));
-		}), V(() => {
-			a.value && (n.trigger === "hover" ? (a.value.removeEventListener("mouseenter", h), a.value.removeEventListener("mouseleave", g)) : n.trigger === "click" && a.value.removeEventListener("click", _));
-		}), Y(() => n.modelValue, (e) => n.trigger === "manual" && (i.value = e), { immediate: !0 }), Y(f, (e) => {
+			c.value = !0, b();
+		}), me(() => {
+			y();
+		}), Y([() => n.trigger, () => n.disabled], () => {
+			b();
+		}), Y(() => n.modelValue, (e) => n.trigger === "manual" && (i.value = e), { immediate: !0 }), Y(p, (e) => {
 			r(e ? "opened" : "closed");
-		}), (t, n) => (U(), F(j, null, [I("div", {
+		}), (t, n) => (U(), I(M, null, [L("div", {
 			ref_key: "referenceContainer",
 			ref: a,
-			class: z(t.$style.container)
-		}, [K(t.$slots, "default")], 2), i.value ? (U(), F("div", {
+			class: B(t.$style.container)
+		}, [K(t.$slots, "default")], 2), i.value ? (U(), I("div", {
 			key: 0,
 			ref_key: "floatingEl",
 			ref: o,
-			class: z(t.$style.floating),
-			style: B(m.value)
-		}, [K(t.$slots, "content", {}, () => [I("div", { class: z(t.$style.content) }, [ue(q(e.content) + " ", 1), I("div", {
+			class: B(t.$style.floating),
+			style: V(h.value)
+		}, [K(t.$slots, "content", {}, () => [L("div", { class: B(t.$style.content) }, [le(q(e.content) + " ", 1), L("div", {
 			ref_key: "floatingArrowEl",
 			ref: s,
-			class: z([t.$style.arrow, t.$style[`arrow-${c.value}`]]),
-			style: B({
-				left: J(p).arrow?.x == null ? "" : `${J(p).arrow?.x}px`,
-				top: J(p).arrow?.y == null ? "" : `${J(p).arrow?.y}px`
+			class: B([t.$style.arrow, t.$style[`arrow-${l.value}`]]),
+			style: V({
+				left: J(m).arrow?.x == null ? "" : `${J(m).arrow?.x}px`,
+				top: J(m).arrow?.y == null ? "" : `${J(m).arrow?.y}px`
 			})
-		}, null, 6)], 2)])], 6)) : P("", !0)], 64));
+		}, null, 6)], 2)])], 6)) : F("", !0)], 64));
 	}
 }), [["__cssModules", { $style: {
 	container: "_container_1wkac_1",
@@ -3436,12 +3481,12 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	"arrow-left": "_arrow-left_1wkac_30",
 	"arrow-right": "_arrow-right_1wkac_30",
 	content: "_content_1wkac_44"
-} }]]), ki = [
+} }]]), Ai = [
 	"name",
 	"checked",
 	"value",
 	"disabled"
-], Ai = ["tabindex"], ji = ["width", "height"], Mi = ["width", "height"], Ni = /* @__PURE__ */ D(/* @__PURE__ */ R({
+], ji = ["tabindex"], Mi = ["width", "height"], Ni = ["width", "height"], Pi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-radio",
 	props: {
 		id: {},
@@ -3479,70 +3524,68 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["change", "update:modelValue"],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, a = Se(), o = de(), s = o?.parent?.type.__name === "Ui3nRadioGroup" || o?.parent?.type.__name === "ui3n-radio-group" ? o?.parent?.props.name : "", { groupValue: c, updateGroupValue: l } = s ? fe(`radio-group-${s}`) : {
-			groupValue: null,
-			updateGroupValue: null
-		}, u = W(s ? c.value : r.modelValue), d = M(() => u.value === r.checkedValue), f = M(() => ({
+		let r = e, i = n, a = Se(), o = ue("ui3n-radio-group-context", null), s = N(() => o !== null), c = N(() => o ? o.groupName.value : r.name || ""), l = W(s.value && o ? o.groupValue.value : r.modelValue), u = N(() => s.value && o ? o.groupValue.value === r.checkedValue : l.value === r.checkedValue), d = N(() => ({
 			"--ui3n-radio-size": `${r.size}px`,
 			"--ui3n-radio-color": r.color
 		}));
-		function p(e) {
-			if (e.preventDefault(), !s) {
-				u.value = d.value ? r.uncheckedValue : r.checkedValue, i("change", u.value), i("update:modelValue", u.value);
-				return;
+		function f(e) {
+			if (e.preventDefault(), !r.disabled) {
+				if (!s.value) {
+					l.value = u.value ? r.uncheckedValue : r.checkedValue, i("change", l.value), i("update:modelValue", l.value);
+					return;
+				}
+				u.value || o && o.updateGroupValue(r.checkedValue);
 			}
-			d.value || (u.value = r.checkedValue, l(u.value));
 		}
-		function m() {
-			u.value = r.uncheckedValue, s || (i("change", u.value), i("update:modelValue", u.value));
+		function p() {
+			l.value = r.uncheckedValue, s.value || (i("change", l.value), i("update:modelValue", l.value));
 		}
-		return t({ clear: m }), Y(() => r.name, (e) => {
-			!e && !s && m();
-		}), he(() => {
-			if (a.checkedIcon && !a.uncheckedIcon || !a.checkedIcon && a.uncheckedIcon) throw Error("[Ui3nRadio] Both checkedIcon and uncheckedIcon slots must have values defined.");
+		return t({ clear: p }), pe(() => {
+			let e = !!a.checkedIcon, t = !!a.uncheckedIcon;
+			if (e && !t || !e && t) throw Error("[Ui3nRadio] Both checkedIcon and uncheckedIcon slots must have values defined.");
+		}), Y(() => r.name, (e) => {
+			!e && !s.value && p();
 		}), Y(() => r.modelValue, (e) => {
-			e !== u.value && (u.value = e);
-		}), Y(() => c?.value, (e) => {
-			s && (u.value = e === r.checkedValue ? r.checkedValue : r.uncheckedValue);
-		}), (t, n) => (U(), F("div", {
-			style: B(f.value),
-			class: z([
+			e !== l.value && (l.value = e);
+		}), (t, n) => (U(), I("div", {
+			style: V(d.value),
+			class: B([
 				t.$style.ui3nRadio,
 				e.disabled && t.$style.disabled,
 				!J(a).default && t.$style.noLabel
 			])
 		}, [
-			I("input", {
+			L("input", {
 				type: "radio",
 				hidden: "",
-				name: J(s) || e.name,
-				checked: d.value,
+				name: c.value,
+				checked: u.value,
 				value: String(e.checkedValue),
 				disabled: e.disabled
-			}, null, 8, ki),
-			I("div", {
-				class: z([t.$style.body, e.disabled && t.$style.bodyDisabled]),
+			}, null, 8, Ai),
+			L("div", {
+				class: B([t.$style.body, e.disabled && t.$style.bodyDisabled]),
 				tabindex: e.disabled ? -1 : 0,
-				onKeydown: [Z(p, ["enter"]), Z(p, ["space"])],
-				onClick: p
-			}, [d.value ? K(t.$slots, "checkedIcon", { key: 0 }, () => [(U(), F("svg", {
+				onKeydown: [Z(f, ["enter"]), Z(f, ["space"])],
+				onClick: f
+			}, [u.value ? K(t.$slots, "checkedIcon", { key: 0 }, () => [(U(), I("svg", {
 				width: Number(e.size) - 4,
 				height: Number(e.size) - 4,
 				viewBox: "0 0 24 24",
-				class: z([t.$style.icon, e.disabled && t.$style.iconDisabled])
-			}, [...n[0] ||= [I("path", {
+				class: B([t.$style.icon, e.disabled && t.$style.iconDisabled])
+			}, [...n[0] ||= [L("path", {
 				fill: "currentColor",
 				d: "M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5s5-2.24 5-5s-2.24-5-5-5m0-5C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2m0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8s8 3.58 8 8s-3.58 8-8 8"
-			}, null, -1)]], 10, ji))]) : K(t.$slots, "uncheckedIcon", { key: 1 }, () => [(U(), F("svg", {
+			}, null, -1)]], 10, Mi))]) : K(t.$slots, "uncheckedIcon", { key: 1 }, () => [(U(), I("svg", {
 				width: Number(e.size) - 4,
 				height: Number(e.size) - 4,
 				viewBox: "0 0 24 24",
-				class: z([t.$style.icon, e.disabled && t.$style.iconDisabled])
-			}, [...n[1] ||= [I("path", {
+				class: B([t.$style.icon, e.disabled && t.$style.iconDisabled])
+			}, [...n[1] ||= [L("path", {
 				fill: "currentColor",
 				d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2m0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8s8 3.58 8 8s-3.58 8-8 8"
-			}, null, -1)]], 10, Mi))])], 42, Ai),
-			I("div", { class: z(t.$style.label) }, [K(t.$slots, "default")], 2)
+			}, null, -1)]], 10, Ni))])], 42, ji),
+			L("div", { class: B(t.$style.label) }, [K(t.$slots, "default")], 2)
 		], 6));
 	}
 }), [["__cssModules", { $style: {
@@ -3554,7 +3597,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	icon: "_icon_17bki_62",
 	bodyDisabled: "_bodyDisabled_17bki_71",
 	iconDisabled: "_iconDisabled_17bki_72"
-} }]]), Pi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+} }]]), Fi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-radio-group",
 	props: {
 		id: {},
@@ -3576,8 +3619,9 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		function o(e) {
 			a.value = e, i("update:modelValue", e), i("change", e);
 		}
-		ge(`radio-group-${r.name}`, {
-			groupValue: M(() => a.value),
+		ge("ui3n-radio-group-context", {
+			groupValue: N(() => a.value),
+			groupName: N(() => r.name || ""),
 			updateGroupValue: o
 		});
 		function s() {
@@ -3587,16 +3631,16 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			e !== a.value && (a.value = e);
 		}), Y(() => r.name, (e) => {
 			e || s();
-		}), (t, n) => (U(), F("div", { class: z([t.$style.ui3nRadioGroup, e.direction === "horizontal" && t.$style.horizontal]) }, [K(t.$slots, "default")], 2));
+		}), (t, n) => (U(), I("div", { class: B([t.$style.ui3nRadioGroup, e.direction === "horizontal" && t.$style.horizontal]) }, [K(t.$slots, "default")], 2));
 	}
 }), [["__cssModules", { $style: {
 	ui3nRadioGroup: "_ui3nRadioGroup_1aejh_1",
 	horizontal: "_horizontal_1aejh_9"
-} }]]), Fi = ["id"], Ii = ["name", "value"], Li = [
+} }]]), Ii = ["id"], Li = ["name", "value"], Ri = [
 	"value",
 	"placeholder",
 	"disabled"
-], Ri = ["title"], zi = 60, Bi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+], zi = ["title"], Bi = 60, Vi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-editable",
 	props: {
 		id: {},
@@ -3619,139 +3663,137 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		"focusout"
 	],
 	setup(e, { expose: t, emit: n }) {
-		xe((e) => ({
-			v1cfca3f2: m.value,
-			f2497fc0: h.value
-		}));
-		let r = te, i = On, a = e, o = n, s = W(null), c = W(null), l = W("auto"), u = W(null), d = W(a.modelValue), f = W(a.modelValue), p = W(!1), m = M(() => `${zi}px`), h = M(() => {
-			if (!a.maxWidth) return "100%";
-			let e = Number(a.maxWidth);
-			return Number.isNaN(e) ? a.maxWidth : `${e}px`;
-		}), g = M(() => u.value ? u.value.scrollWidth > u.value.clientWidth : !1), _ = M(() => a.disallowEmptyValue ? !!d.value : !0);
-		function v() {
-			c.value.textContent = d.value || a.placeholder || "...", l.value = `${Math.max(c.value.scrollWidth, zi)}px`;
+		let r = te, i = On, a = e, o = n, s = W(null), c = W(null), l = W("auto"), u = W(null), d = W(a.modelValue), f = W(a.modelValue), p = W(!1), m = N(() => {
+			let e = "100%";
+			if (a.maxWidth) {
+				let t = Number(a.maxWidth);
+				e = Number.isNaN(t) ? a.maxWidth : `${t}px`;
+			}
+			return {
+				"--ui3n-editable-min-width": `${Bi}px`,
+				"--ui3n-editable-max-width": e
+			};
+		}), h = N(() => u.value ? u.value.scrollWidth > u.value.clientWidth : !1), g = N(() => a.disallowEmptyValue ? !!d.value : !0);
+		function _() {
+			c.value && (c.value.textContent = d.value || a.placeholder || "", l.value = `${Math.max(c.value.scrollWidth + 48, Bi)}px`);
 		}
-		function y() {
-			a.disabled || (p.value = !0, f.value = d.value, me(() => {
-				s.value && (v(), s.value.focus(), a.selectAllOnFocus && s.value.select());
+		function v() {
+			a.disabled || (p.value = !0, f.value = d.value, fe(() => {
+				s.value && (_(), s.value.focus(), a.selectAllOnFocus && s.value.select());
 			}));
 		}
-		function b(e) {
-			d.value = e.target.value || "", v();
+		function y(e) {
+			d.value = e.target.value || "", _();
+		}
+		function b() {
+			a.disabled || a.disallowEmptyValue && !g.value || (d.value !== f.value && (f.value = d.value, o("update:modelValue", d.value)), o("done"), p.value = !1);
 		}
 		function x() {
-			a.disabled || a.disallowEmptyValue && !_.value || (d.value !== f.value && (f.value = d.value, o("update:modelValue", d.value)), o("done"), p.value = !1);
+			a.disabled || (d.value !== f.value && (d.value = f.value, o("update:modelValue", d.value)), o("cancel"), p.value = !1);
 		}
 		function S() {
-			a.disabled || (d.value !== f.value && (d.value = f.value, o("update:modelValue", d.value)), o("cancel"), p.value = !1);
+			a.disabled || p.value && (o("focusout"), b());
 		}
 		function C() {
-			a.disabled || p.value && (o("focusout"), x());
-		}
-		function w() {
 			d.value = "", f.value = "", o("update:modelValue", "");
 		}
-		return t({ clear: w }), Y(() => a.modelValue, (e, t) => {
+		return t({ clear: C }), Y(() => a.modelValue, (e, t) => {
 			e !== t && (d.value = e, f.value = e);
 		}), Y(() => p.value, (e) => {
 			!a.disabled && o("toggle:editMode", e);
 		}), Y(() => a.name, (e) => {
-			e || w();
-		}), (t, n) => Te((U(), F("div", {
+			e || C();
+		}), (t, n) => Te((U(), I("div", {
 			id: e.id,
-			class: z([t.$style.ui3nEditable, e.disabled && t.$style.ui3nEditableDisabled]),
+			class: B([
+				t.$style.ui3nEditable,
+				e.disabled && t.$style.ui3nEditableDisabled,
+				p.value && t.$style.ui3nEditableInEdit,
+				p.value && !g.value && t.$style.ui3nEditableInEditWarning
+			]),
+			style: V(m.value),
 			onFocusin: n[0] ||= (e) => o("focusin", e)
-		}, [e.name ? (U(), F("input", {
+		}, [e.name ? (U(), I("input", {
 			key: 0,
 			type: "hidden",
 			name: e.name,
 			value: d.value
-		}, null, 8, Ii)) : P("", !0), p.value ? (U(), F(j, { key: 1 }, [
-			I("span", {
+		}, null, 8, Li)) : F("", !0), p.value ? (U(), I(M, { key: 1 }, [
+			L("span", {
 				ref_key: "hiddenEl",
 				ref: c,
-				class: z(t.$style.hidden)
+				class: B(t.$style.hidden)
 			}, null, 2),
-			I("input", {
+			L("input", {
 				ref_key: "inputEl",
 				ref: s,
-				class: z([
-					t.$style.input,
-					p.value && t.$style.inEdit,
-					p.value && !_.value && t.$style.inEditWarning
-				]),
-				style: B({ width: l.value }),
+				class: B(t.$style.input),
+				style: V({ width: l.value }),
 				value: d.value,
 				placeholder: e.placeholder,
 				disabled: e.disabled,
-				onInput: b,
+				onInput: y,
 				onKeydown: [
-					Z(x, ["enter"]),
-					Z(x, ["tab"]),
-					Z(S, ["esc"])
+					Z(b, ["enter"]),
+					Z(b, ["tab"]),
+					Z(x, ["esc"])
 				]
-			}, null, 46, Li),
-			Te((U(), F("div", {
-				class: z([
+			}, null, 46, Ri),
+			Te((U(), I("div", {
+				class: B([
 					t.$style.btn,
 					t.$style.doneBtn,
 					e.disabled && t.$style.btnDisabled
 				]),
-				onClick: Q(x, ["stop", "prevent"])
-			}, [L(ne, {
+				onClick: Q(b, ["stop", "prevent"])
+			}, [R(k, {
 				icon: "round-done",
 				size: "12",
 				color: "var(--color-icon-table-accent-default)"
 			})], 2)), [[J(r)]]),
-			Te((U(), F("div", {
-				class: z([
+			Te((U(), I("div", {
+				class: B([
 					t.$style.btn,
 					t.$style.cancelBtn,
 					e.disabled && t.$style.btnDisabled
 				]),
-				onClick: Q(S, ["stop", "prevent"])
-			}, [L(ne, {
+				onClick: Q(x, ["stop", "prevent"])
+			}, [R(k, {
 				icon: "round-close",
 				size: "12",
 				color: "var(--color-icon-table-secondary-default)"
 			})], 2)), [[J(r)]])
-		], 64)) : (U(), F("div", {
+		], 64)) : (U(), I("div", {
 			key: 2,
-			class: z([t.$style.content, !d.value && t.$style.contentEmpty]),
-			title: g.value ? d.value : void 0
-		}, [I("span", {
+			class: B([t.$style.content, !d.value && t.$style.contentEmpty]),
+			title: h.value ? d.value : void 0
+		}, [L("span", {
 			ref_key: "contentValueEl",
 			ref: u
-		}, q(d.value || e.placeholder || "..."), 513), Te((U(), F("div", {
-			class: z([t.$style.btn, t.$style.editBtn]),
-			onClick: Q(y, ["stop", "prevent"])
-		}, [L(ne, {
+		}, q(d.value || e.placeholder || "..."), 513), Te((U(), I("div", {
+			class: B([t.$style.btn, t.$style.editBtn]),
+			onClick: Q(v, ["stop", "prevent"])
+		}, [R(k, {
 			icon: "round-edit",
 			size: "12",
 			color: "var(--color-icon-control-accent-unselected)"
-		})], 2)), [[J(r)]])], 10, Ri))], 42, Fi)), [[J(i), C]]);
+		})], 2)), [[J(r)]])], 10, zi))], 46, Ii)), [[J(i), S]]);
 	}
 }), [["__cssModules", { $style: {
-	ui3nEditable: "_ui3nEditable_1dioq_3",
-	ui3nEditableDisabled: "_ui3nEditableDisabled_1dioq_25",
-	content: "_content_1dioq_30",
-	contentEmpty: "_contentEmpty_1dioq_42",
-	btn: "_btn_1dioq_48",
-	editBtn: "_editBtn_1dioq_48",
-	input: "_input_1dioq_60",
-	inEdit: "_inEdit_1dioq_73",
-	inEditWarning: "_inEditWarning_1dioq_77",
-	hidden: "_hidden_1dioq_88",
-	cancelBtn: "_cancelBtn_1dioq_118",
-	doneBtn: "_doneBtn_1dioq_123",
-	btnDisabled: "_btnDisabled_1dioq_129"
-} }]]), Vi = /* @__PURE__ */ p((/* @__PURE__ */ g(((e, t) => {
-	var n = Yt(), r = 1, i = 4;
-	function a(e) {
-		return n(e, r | i);
-	}
-	t.exports = a;
-})))(), 1), Hi = ["name", "value"], Ui = ["name", "value"], Wi = ["name", "value"], Gi = ["placeholder", "disabled"], Ki = ["id", "onClick"], qi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nEditable: "_ui3nEditable_s7l0a_3",
+	ui3nEditableInEdit: "_ui3nEditableInEdit_s7l0a_23",
+	ui3nEditableInEditWarning: "_ui3nEditableInEditWarning_s7l0a_26",
+	ui3nEditableDisabled: "_ui3nEditableDisabled_s7l0a_33",
+	content: "_content_s7l0a_38",
+	contentEmpty: "_contentEmpty_s7l0a_60",
+	btn: "_btn_s7l0a_66",
+	editBtn: "_editBtn_s7l0a_66",
+	input: "_input_s7l0a_70",
+	hidden: "_hidden_s7l0a_92",
+	cancelBtn: "_cancelBtn_s7l0a_128",
+	doneBtn: "_doneBtn_s7l0a_133",
+	btnDisabled: "_btnDisabled_s7l0a_139"
+} }]]), Hi = ["name", "value"], Ui = ["name", "value"], Wi = ["name", "value"], Gi = ["placeholder", "disabled"], Ki = ["id", "onClick"], qi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-autocomplete",
 	props: {
 		name: {},
@@ -3767,6 +3809,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			type: Boolean,
 			default: !1
 		},
+		lockScroll: {
+			type: Boolean,
+			default: !1
+		},
 		items: { default: () => [] },
 		itemTitle: { default: "name" },
 		itemValue: { default: "id" },
@@ -3785,7 +3831,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		"valid:new-value"
 	],
 	setup(e, { expose: n, emit: r }) {
-		let a = En, o = e, s = r, c = `auto-${t(4)}`, l = W(""), u = W(!1), d = W(null), f = W(null), p = W(null), m = W(null), h = W(!1), g = W(!0), _ = M(() => o.returnObject ? o.modelValue.map((e) => e.id) : o.modelValue), v = M(() => o.chips ? "" : o.returnObject ? o.modelValue.map((e) => e[o.itemTitle] || "?").join(", ") : o.modelValue.join(", ")), y = M(() => o.customFilter ? o.items.filter((e) => o.customFilter(e, l.value)).filter((e) => o.hideSelected ? o.returnObject ? !_.value.includes(e.id) : !_.value.includes(e[o.itemValue]) : !0) : o.items.filter((e) => e[o.itemTitle].toLowerCase().includes(l.value.toLowerCase())).filter((e) => o.hideSelected ? o.returnObject ? !_.value.includes(e.id) : !_.value.includes(e[o.itemValue]) : !0));
+		let a = En, o = e, s = r, c = `auto-${t(4)}`, l = W(""), u = W(!1), d = W(null), f = W(null), p = W(null), m = W(null), h = W(!1), g = W(!0), _ = N(() => o.returnObject ? o.modelValue.map((e) => e.id) : o.modelValue), v = N(() => o.chips ? "" : o.returnObject ? o.modelValue.map((e) => e[o.itemTitle] || "?").join(", ") : o.modelValue.join(", ")), y = N(() => o.customFilter ? o.items.filter((e) => o.customFilter(e, l.value)).filter((e) => o.hideSelected ? o.returnObject ? !_.value.includes(e.id) : !_.value.includes(e[o.itemValue]) : !0) : o.items.filter((e) => e[o.itemTitle].toLowerCase().includes(l.value.toLowerCase())).filter((e) => o.hideSelected ? o.returnObject ? !_.value.includes(e.id) : !_.value.includes(e[o.itemValue]) : !0));
 		function b() {
 			h.value = !1, s("update:search", l.value);
 		}
@@ -3800,24 +3846,24 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				s("update:modelValue", o.returnObject ? [e] : [e[o.itemValue]]);
 				return;
 			}
-			let t = (0, Vi.default)(o.modelValue), n = o.returnObject ? o.modelValue.findIndex((t) => t.id === e.id) : o.modelValue.findIndex((t) => t === e[o.itemValue]);
+			let t = (0, Gr.default)(o.modelValue), n = o.returnObject ? o.modelValue.findIndex((t) => t.id === e.id) : o.modelValue.findIndex((t) => t === e[o.itemValue]);
 			n > -1 ? t.splice(n, 1) : t.push(o.returnObject ? e : e[o.itemValue]), s("update:modelValue", t), o.clearOnSelect && (l.value = "");
 		}
 		function C(e) {
 			if (o.disabled) return;
-			let t = o.returnObject ? o.modelValue.findIndex((t) => t.id === e.id) : o.modelValue.findIndex((t) => t === e), n = (0, Vi.default)(o.modelValue);
+			let t = o.returnObject ? o.modelValue.findIndex((t) => t.id === e.id) : o.modelValue.findIndex((t) => t === e), n = (0, Gr.default)(o.modelValue);
 			n.splice(t, 1), s("update:modelValue", n);
 		}
 		function w() {
 			if (m.value === null) {
-				m.value = 0, p.value && p.value.focus();
+				m.value = 0, p.value && p.value.focus({ preventScroll: !0 });
 				return;
 			}
 			m.value >= 0 && m.value < (0, $.default)(y.value) - 1 && (m.value += 1);
 		}
 		function T() {
 			if (m.value === null) {
-				m.value = (0, $.default)(y.value) - 1, p.value && p.value.focus();
+				m.value = (0, $.default)(y.value) - 1, p.value && p.value.focus({ preventScroll: !0 });
 				return;
 			}
 			m.value > 0 && m.value < (0, $.default)(y.value) && --m.value;
@@ -3827,7 +3873,7 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		}
 		function E() {
 			if (m.value === null && !u.value) {
-				u.value = !0, m.value = 0, p.value && p.value.focus();
+				u.value = !0, m.value = 0, p.value && p.value.focus({ preventScroll: !0 });
 				return;
 			}
 			if (m.value === null && u.value && l.value) {
@@ -3844,12 +3890,12 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			}
 		}
 		function te() {
-			if (o.disabled || l.value !== "" || (0, Hr.default)(o.modelValue)) return;
+			if (o.disabled || l.value !== "" || (0, Wr.default)(o.modelValue)) return;
 			if (!h.value) {
 				h.value = !0;
 				return;
 			}
-			let e = (0, Vi.default)(o.modelValue);
+			let e = (0, Gr.default)(o.modelValue);
 			e.pop(), s("update:modelValue", e), h.value = !1;
 		}
 		function D(e, t) {
@@ -3879,29 +3925,31 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			e || O();
 		}), Y(() => (0, $.default)(y.value), (e, t) => {
 			e !== t && (m.value = null), e && !g.value && (g.value = !0);
-		}), (t, n) => (U(), F("div", { class: z(t.$style.ui3nAutocomplete) }, [e.name && !J(Hr.default)(e.modelValue) ? (U(), F("fieldset", {
+		}), (t, n) => (U(), I("div", { class: B(t.$style.ui3nAutocomplete) }, [e.name && !J(Wr.default)(e.modelValue) ? (U(), I("fieldset", {
 			key: 0,
-			class: z(t.$style.hiddenBlock)
-		}, [e.multiple ? (U(), F(j, { key: 1 }, [e.returnObject ? (U(!0), F(j, { key: 1 }, G(e.modelValue, (t, n) => (U(), F("input", {
+			class: B(t.$style.hiddenBlock)
+		}, [e.multiple ? (U(), I(M, { key: 1 }, [e.returnObject ? (U(!0), I(M, { key: 1 }, G(e.modelValue, (t, n) => (U(), I("input", {
 			key: t.id || `${e.name}-obj-${n}`,
 			type: "hidden",
 			name: `${e.name}[]`,
 			value: JSON.stringify(t)
-		}, null, 8, Wi))), 128)) : (U(!0), F(j, { key: 0 }, G(e.modelValue, (t, n) => (U(), F("input", {
+		}, null, 8, Wi))), 128)) : (U(!0), I(M, { key: 0 }, G(e.modelValue, (t, n) => (U(), I("input", {
 			key: `${e.name}-flat-${n}`,
 			type: "hidden",
 			name: `${e.name}[]`,
 			value: t
-		}, null, 8, Ui))), 128))], 64)) : (U(), F("input", {
+		}, null, 8, Ui))), 128))], 64)) : (U(), I("input", {
 			key: 0,
 			type: "hidden",
 			name: e.name,
 			value: e.returnObject ? JSON.stringify(e.modelValue) : e.modelValue
-		}, null, 8, Hi))], 2)) : P("", !0), L(Qr, {
+		}, null, 8, Hi))], 2)) : F("", !0), R(ti, {
 			modelValue: u.value,
 			"onUpdate:modelValue": n[8] ||= (e) => u.value = e,
+			"lock-scroll": e.lockScroll,
 			"offset-x": 2,
 			"offset-y": 4,
+			"position-strategy": "fixed",
 			"position-autoupdate": "",
 			"content-border-radius": [
 				0,
@@ -3911,15 +3959,15 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			],
 			disabled: e.disabled
 		}, {
-			menu: X(() => [!J(Hr.default)(y.value) || J(Hr.default)(y.value) && e.noDataText ? (U(), F("div", {
+			menu: X(() => [!J(Wr.default)(y.value) || J(Wr.default)(y.value) && e.noDataText ? (U(), I("div", {
 				key: 0,
 				ref_key: "menuBodyEl",
 				ref: p,
-				class: z(t.$style.body)
-			}, [J($.default)(y.value) ? (U(!0), F(j, { key: 0 }, G(y.value, (n, r) => (U(), F("div", {
+				class: B(t.$style.body)
+			}, [J($.default)(y.value) ? (U(!0), I(M, { key: 0 }, G(y.value, (n, r) => (U(), I("div", {
 				key: n.id,
 				id: `${c}-${r}`,
-				class: z([
+				class: B([
 					t.$style.item,
 					m.value === r && t.$style.itemSelected,
 					e.disabled && t.$style.itemDisabled
@@ -3929,51 +3977,51 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				item: n,
 				index: r,
 				query: l.value
-			}, () => [Te(I("div", { class: z(t.$style.simpleItem) }, null, 2), [[J(a), J(i)(n[o.itemTitle], l.value)]])])], 10, Ki))), 128)) : P("", !0), !J($.default)(y.value) && e.noDataText ? (U(), F("div", {
+			}, () => [Te(L("div", { class: B(t.$style.simpleItem) }, null, 2), [[J(a), J(i)(n[o.itemTitle], l.value)]])])], 10, Ki))), 128)) : F("", !0), !J($.default)(y.value) && e.noDataText ? (U(), I("div", {
 				key: 1,
-				class: z(t.$style.noData)
-			}, [K(t.$slots, "noDataText", {}, () => [ue(q(e.noDataText), 1)])], 2)) : P("", !0)], 2)) : P("", !0)]),
-			default: X(() => [I("div", {
+				class: B(t.$style.noData)
+			}, [K(t.$slots, "noDataText", {}, () => [le(q(e.noDataText), 1)])], 2)) : F("", !0)], 2)) : F("", !0)]),
+			default: X(() => [L("div", {
 				ref_key: "activatorEl",
 				ref: d,
-				class: z(t.$style.trigger)
-			}, [e.chips ? (U(), N(le, {
+				class: B(t.$style.trigger)
+			}, [e.chips ? (U(), P(ce, {
 				key: 0,
 				name: "chipAnim",
 				tag: "div",
-				class: z(t.$style.chipsContainer)
+				class: B(t.$style.chipsContainer)
 			}, {
-				default: X(() => [(U(!0), F(j, null, G(e.modelValue, (n, r) => (U(), F("div", {
+				default: X(() => [(U(!0), I(M, null, G(e.modelValue, (n, r) => (U(), I("div", {
 					key: n.id || r,
-					class: z(t.$style.chipWrapper)
+					class: B(t.$style.chipWrapper)
 				}, [K(t.$slots, "chip", {
 					item: n,
 					index: r,
 					isHighlighted: r === J($.default)(e.modelValue) - 1 && h.value
-				}, () => [L(er, {
+				}, () => [R(er, {
 					height: "32",
 					color: r === J($.default)(e.modelValue) - 1 && h.value ? "var(--color-bg-control-primary-hover)" : void 0,
 					round: "",
 					closeable: "",
 					onClose: (e) => C(n)
 				}, {
-					default: X(() => [ue(q(e.returnObject ? n[o.itemTitle] : n), 1)]),
+					default: X(() => [le(q(e.returnObject ? n[o.itemTitle] : n), 1)]),
 					_: 2
 				}, 1032, ["color", "onClose"])])], 2))), 128))]),
 				_: 3
-			}, 8, ["class"])) : (U(), F("div", {
+			}, 8, ["class"])) : (U(), I("div", {
 				key: 1,
-				class: z(t.$style.displayValue)
-			}, q(v.value), 3)), Te(I("input", {
+				class: B(t.$style.displayValue)
+			}, q(v.value), 3)), Te(L("input", {
 				ref_key: "inputEl",
 				ref: f,
 				"onUpdate:modelValue": n[0] ||= (e) => l.value = e,
 				type: "text",
-				class: z([t.$style.input, !g.value && t.$style.inputWithError]),
-				placeholder: J(Hr.default)(e.modelValue) && e.placeholder ? e.placeholder : "",
+				class: B([t.$style.input, !g.value && t.$style.inputWithError]),
+				placeholder: J(Wr.default)(e.modelValue) && e.placeholder ? e.placeholder : "",
 				disabled: e.disabled,
 				onInput: b,
-				onFocusin: n[1] ||= (e) => s("update:focused", !0),
+				onFocusin: n[1] ||= Q((e) => s("update:focused", !0), ["prevent"]),
 				onFocusout: x,
 				onKeydown: [
 					n[2] ||= Z((e) => D(e, "down"), ["down"]),
@@ -3985,24 +4033,28 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				]
 			}, null, 42, Gi), [[we, l.value]])], 2)]),
 			_: 3
-		}, 8, ["modelValue", "disabled"])], 2));
+		}, 8, [
+			"modelValue",
+			"lock-scroll",
+			"disabled"
+		])], 2));
 	}
 }), [["__cssModules", { $style: {
-	ui3nAutocomplete: "_ui3nAutocomplete_e6zzg_1",
-	hiddenBlock: "_hiddenBlock_e6zzg_17",
-	trigger: "_trigger_e6zzg_24",
-	displayValue: "_displayValue_e6zzg_33",
-	input: "_input_e6zzg_40",
-	inputWithError: "_inputWithError_e6zzg_59",
-	body: "_body_e6zzg_65",
-	item: "_item_e6zzg_71",
-	itemSelected: "_itemSelected_e6zzg_85",
-	itemDisabled: "_itemDisabled_e6zzg_89",
-	simpleItem: "_simpleItem_e6zzg_94",
-	noData: "_noData_e6zzg_99",
-	chipsContainer: "_chipsContainer_e6zzg_112",
-	chipWrapper: "_chipWrapper_e6zzg_119"
-} }]]), Ji = ["id"], Yi = ["name", "value"], Xi = ["name", "value"], Zi = ["name", "value"], Qi = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nAutocomplete: "_ui3nAutocomplete_2o0no_1",
+	hiddenBlock: "_hiddenBlock_2o0no_17",
+	trigger: "_trigger_2o0no_24",
+	displayValue: "_displayValue_2o0no_33",
+	input: "_input_2o0no_40",
+	inputWithError: "_inputWithError_2o0no_60",
+	body: "_body_2o0no_66",
+	item: "_item_2o0no_72",
+	itemSelected: "_itemSelected_2o0no_86",
+	itemDisabled: "_itemDisabled_2o0no_90",
+	simpleItem: "_simpleItem_2o0no_95",
+	noData: "_noData_2o0no_100",
+	chipsContainer: "_chipsContainer_2o0no_113",
+	chipWrapper: "_chipWrapper_2o0no_120"
+} }]]), Ji = ["id"], Yi = ["name", "value"], Xi = ["name", "value"], Zi = ["name", "value"], Qi = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-slider",
 	props: {
 		id: {},
@@ -4031,24 +4083,26 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		}), u = W({
 			1: r.labelVisible === "always",
 			2: r.labelVisible === "always"
-		}), d = W(0), f = W(null), p = M(() => `${r.thumbSize}px`), m = M(() => Number(r.max) - Number(r.min)), h = M(() => r.step ? Number(r.step) : m.value / 100), g = M(() => {
+		}), d = W(0), f = W(null);
+		N(() => `${r.thumbSize}px`);
+		let p = N(() => Number(r.max) - Number(r.min)), m = N(() => r.step ? Number(r.step) : p.value / 100), h = N(() => {
 			let e = {};
 			if (r.range) {
 				let [t, n] = d.value;
-				return t <= Number(r.min) ? e.left = "0px" : t < Number(r.max) && (e.left = `${a((t - Number(r.min)) / m.value * 100, 0)}%`), n >= Number(r.max) ? e.width = t <= Number(r.min) ? "100%" : `${a((Number(r.max) - t) / m.value * 100, 0)}%` : n > Number(r.min) && (e.width = `${a((n - t) / m.value * 100, 0)}%`), e;
+				return t <= Number(r.min) ? e.left = "0px" : t < Number(r.max) && (e.left = `${a((t - Number(r.min)) / p.value * 100, 0)}%`), n >= Number(r.max) ? e.width = t <= Number(r.min) ? "100%" : `${a((Number(r.max) - t) / p.value * 100, 0)}%` : n > Number(r.min) && (e.width = `${a((n - t) / p.value * 100, 0)}%`), e;
 			}
-			return d.value <= Number(r.min) ? (e.left = "0px", e.width = "0px") : d.value >= Number(r.max) ? (e.left = "0px", e.width = "100%") : (e.left = "0px", e.width = `${a((d.value - Number(r.min)) / m.value * 100, 0)}%`), e;
-		}), _ = M(() => r.range ? `calc(${g.value.left} - calc(${p.value} / 2))` : `calc(${g.value.width} - calc(${p.value} / 2))`), v = M(() => r.range ? `calc(${g.value.width} + ${g.value.left} - calc(${p.value} / 2))` : "200%"), y = M(() => {
+			return d.value <= Number(r.min) ? (e.left = "0px", e.width = "0px") : d.value >= Number(r.max) ? (e.left = "0px", e.width = "100%") : (e.left = "0px", e.width = `${a((d.value - Number(r.min)) / p.value * 100, 0)}%`), e;
+		}), g = N(() => r.range ? `calc(${h.value.left} + 1px)` : `${h.value.width}`), _ = N(() => r.range ? `calc(${h.value.width} + ${h.value.left} - 1px)` : "200%"), v = N(() => {
 			if (r.range) {
 				let e = d.value[0];
 				return r.transformValueMethod ? r.transformValueMethod(e) : `${e}`;
 			}
 			return r.transformValueMethod ? r.transformValueMethod(d.value) : `${d.value}`;
-		}), b = M(() => {
+		}), y = N(() => {
 			if (!r.range) return "";
 			let e = d.value[1];
 			return r.transformValueMethod ? r.transformValueMethod(e) : `${e}`;
-		}), x = M(() => ({
+		}), b = N(() => ({
 			"--ui3n-slider-height": `${Math.max(Number(r.trackHeight), Number(r.thumbSize))}px`,
 			"--ui3n-slider-label-color": r.labelColor,
 			"--ui3n-slider-label-text-color": r.labelTextColor,
@@ -4057,99 +4111,99 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			"--ui3n-slider-track-height": `${r.trackHeight}px`,
 			"--ui3n-slider-thumb-size": `${r.thumbSize}px`,
 			"--ui3n-slider-thumb-color": r.thumbColor,
-			"--ui3n-slider-pointer1-position": _.value,
-			"--ui3n-slider-pointer2-position": v.value
+			"--ui3n-slider-pointer1-position": g.value,
+			"--ui3n-slider-pointer2-position": _.value
 		}));
-		function S(e) {
+		function x(e) {
 			r.labelVisible === "normal" && (u.value[`${e}`] = !0);
 		}
-		function C(e) {
+		function S(e) {
 			r.labelVisible === "normal" && (u.value[`${e}`] = !1);
 		}
-		function w() {
+		function C() {
 			return !1;
 		}
-		function T(e, t) {
+		function w(e, t) {
 			f.value = t, r.labelVisible === "normal" && (u.value[`${t}`] = !0), e.preventDefault();
 			let n = t === 1 ? s.value : c.value;
-			l.value[`${f.value}`] = e.clientX - n.getBoundingClientRect().left, n.setPointerCapture(e.pointerId), n.onpointermove = ee, n.onpointerup = () => {
+			l.value[`${f.value}`] = e.clientX - n.getBoundingClientRect().left, n.setPointerCapture(e.pointerId), n.onpointermove = T, n.onpointerup = () => {
 				n.onpointermove = null, n.onpointerup = null, r.labelVisible === "normal" && f.value && (u.value[`${f.value}`] = !1), f.value = null;
 			};
 		}
-		function ee(e) {
+		function T(e) {
 			if (!f.value) return;
-			let t = o.value.getBoundingClientRect(), n = (e) => Math.round(e / t.width * m.value) + Number(r.min), a = e.clientX - l.value[`${f.value}`] - t.left;
+			let t = o.value.getBoundingClientRect(), n = (e) => Math.round(e / t.width * p.value) + Number(r.min), a = e.clientX - l.value[`${f.value}`] - t.left;
 			a < 0 && (a = 0);
 			let s = o.value.offsetWidth;
 			a > s && (a = s);
 			let c = n(a);
-			r.range && (f.value === 1 && c >= d.value[1] ? c = d.value[1] - h.value : f.value === 2 && c <= d.value[0] && (c = d.value[0] + h.value)), r.range ? (f.value === 1 && (d.value[0] = c), f.value === 2 && (d.value[1] = c)) : d.value = c, i("update:modelValue", d.value);
+			r.range && (f.value === 1 && c >= d.value[1] ? c = d.value[1] - m.value : f.value === 2 && c <= d.value[0] && (c = d.value[0] + m.value)), r.range ? (f.value === 1 && (d.value[0] = c), f.value === 2 && (d.value[1] = c)) : d.value = c, i("update:modelValue", d.value);
 		}
-		function E(e) {
-			let { x: t } = e, { x: n, width: a } = o.value.getBoundingClientRect(), s = Math.round((t - n) / a * m.value) + Number(r.min);
+		function ee(e) {
+			let { x: t } = e, { x: n, width: a } = o.value.getBoundingClientRect(), s = Math.round((t - n) / a * p.value) + Number(r.min);
 			if (r.range) {
 				let [e, t] = d.value, n = Math.abs(s - e), r = Math.abs(t - s);
 				d.value = [n <= r ? s : d.value[0], n > r ? s : d.value[1]];
 			} else d.value = s;
 			i("update:modelValue", d.value);
 		}
-		function te() {
+		function E() {
 			let e = r.range ? [Number(r.min), Number(r.min)] : Number(r.min);
 			d.value = e, i("update:modelValue", e);
 		}
-		return t({ clear: te }), Y(() => r.name, (e) => {
-			e || te();
+		return t({ clear: E }), Y(() => r.name, (e) => {
+			e || E();
 		}), Y(() => JSON.stringify(r.modelValue), (e) => {
 			if (r.range) {
-				e !== JSON.stringify(d.value) && (d.value = (0, Vi.default)(r.modelValue));
+				e !== JSON.stringify(d.value) && (d.value = (0, Gr.default)(r.modelValue));
 				return;
 			}
 			let t = Array.isArray(r.modelValue) ? r.modelValue[r.modelValue.length - 1] : r.modelValue;
 			t !== d.value && (d.value = t);
-		}, { immediate: !0 }), (t, n) => (U(), F("div", {
+		}, { immediate: !0 }), (t, n) => (U(), I("div", {
 			ref: "sliderEl",
 			id: e.id,
-			style: B(x.value),
-			class: z([t.$style.ui3nSlider, e.disabled && t.$style.disabled]),
-			onClick: Q(E, ["stop", "prevent"])
+			style: V(b.value),
+			class: B([t.$style.ui3nSlider, e.disabled && t.$style.disabled]),
+			onClick: Q(ee, ["stop", "prevent"])
 		}, [
-			e.name ? (U(), F(j, { key: 0 }, [e.range ? (U(), F(j, { key: 0 }, [I("input", {
+			e.name ? (U(), I(M, { key: 0 }, [e.range ? (U(), I(M, { key: 0 }, [L("input", {
 				type: "hidden",
 				name: `${e.name}_min`,
 				value: d.value[0]
-			}, null, 8, Yi), I("input", {
+			}, null, 8, Yi), L("input", {
 				type: "hidden",
 				name: `${e.name}_max`,
 				value: d.value[1]
-			}, null, 8, Xi)], 64)) : (U(), F("input", {
+			}, null, 8, Xi)], 64)) : (U(), I("input", {
 				key: 1,
 				type: "hidden",
 				name: e.name,
 				value: d.value
-			}, null, 8, Zi))], 64)) : P("", !0),
-			I("div", { class: z(t.$style.track) }, [I("div", {
-				class: z(t.$style.active),
-				style: B(g.value)
+			}, null, 8, Zi))], 64)) : F("", !0),
+			L("div", { class: B(t.$style.track) }, [L("div", {
+				class: B(t.$style.active),
+				style: V(h.value)
 			}, null, 6)], 2),
-			I("div", {
+			L("div", {
 				ref: "pointerEl1",
-				class: z([t.$style.pointerWrapper, t.$style.pointer1]),
-				onPointerdown: n[0] ||= (e) => T(e, 1),
+				class: B([t.$style.pointerWrapper, t.$style.pointer1]),
+				onPointerdown: n[0] ||= (e) => w(e, 1),
 				onClick: n[1] ||= Q(() => {}, ["stop", "prevent"]),
-				onDragstart: w,
-				onMouseenter: n[2] ||= (e) => S(1),
-				onMouseleave: n[3] ||= (e) => C(1)
-			}, [L(Oi, {
+				onDragstart: C,
+				onMouseenter: n[2] ||= (e) => x(1),
+				onMouseleave: n[3] ||= (e) => S(1)
+			}, [R(ki, {
 				"model-value": u.value[1],
-				content: y.value,
+				content: v.value,
 				trigger: "manual",
-				placement: "top-start",
+				placement: "top",
 				"position-strategy": "absolute",
 				color: e.labelColor,
 				"text-color": e.labelTextColor,
 				disabled: e.labelVisible === "never"
 			}, {
-				default: X(() => [I("div", { class: z([t.$style.pointer, f.value === 1 && t.$style.selected]) }, null, 2)]),
+				default: X(() => [L("div", { class: B([t.$style.pointer, f.value === 1 && t.$style.selected]) }, null, 2)]),
 				_: 1
 			}, 8, [
 				"model-value",
@@ -4158,26 +4212,26 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				"text-color",
 				"disabled"
 			])], 34),
-			e.range ? (U(), F("div", {
+			e.range ? (U(), I("div", {
 				key: 1,
 				ref: "pointerEl2",
-				class: z([t.$style.pointerWrapper, t.$style.pointer2]),
-				onPointerdown: n[4] ||= (e) => T(e, 2),
+				class: B([t.$style.pointerWrapper, t.$style.pointer2]),
+				onPointerdown: n[4] ||= (e) => w(e, 2),
 				onClick: n[5] ||= Q(() => {}, ["stop", "prevent"]),
-				onDragstart: w,
-				onMouseenter: n[6] ||= (e) => S(2),
-				onMouseleave: n[7] ||= (e) => C(2)
-			}, [L(Oi, {
+				onDragstart: C,
+				onMouseenter: n[6] ||= (e) => x(2),
+				onMouseleave: n[7] ||= (e) => S(2)
+			}, [R(ki, {
 				"model-value": u.value[2],
-				content: b.value,
+				content: y.value,
 				trigger: "manual",
-				placement: "top-start",
+				placement: "top",
 				"position-strategy": "absolute",
 				color: e.labelColor,
 				"text-color": e.labelTextColor,
 				disabled: e.labelVisible === "never"
 			}, {
-				default: X(() => [I("div", { class: z([t.$style.pointer, f.value === 2 && t.$style.selected]) }, null, 2)]),
+				default: X(() => [L("div", { class: B([t.$style.pointer, f.value === 2 && t.$style.selected]) }, null, 2)]),
 				_: 1
 			}, 8, [
 				"model-value",
@@ -4185,20 +4239,20 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				"color",
 				"text-color",
 				"disabled"
-			])], 34)) : P("", !0)
+			])], 34)) : F("", !0)
 		], 14, Ji));
 	}
 }), [["__cssModules", { $style: {
-	ui3nSlider: "_ui3nSlider_19ii3_1",
-	disabled: "_disabled_19ii3_9",
-	track: "_track_19ii3_14",
-	active: "_active_19ii3_23",
-	pointerWrapper: "_pointerWrapper_19ii3_30",
-	pointer: "_pointer_19ii3_30",
-	selected: "_selected_19ii3_55",
-	pointer1: "_pointer1_19ii3_69",
-	pointer2: "_pointer2_19ii3_73"
-} }]]), $i = ["id"], ea = ["name", "value"], ta = ["id", "onClick"], na = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nSlider: "_ui3nSlider_17be6_1",
+	disabled: "_disabled_17be6_9",
+	track: "_track_17be6_14",
+	active: "_active_17be6_23",
+	pointerWrapper: "_pointerWrapper_17be6_30",
+	pointer: "_pointer_17be6_30",
+	selected: "_selected_17be6_55",
+	pointer1: "_pointer1_17be6_69",
+	pointer2: "_pointer2_17be6_73"
+} }]]), $i = ["id"], ea = ["name", "value"], ta = ["tabindex"], na = ["id", "onClick"], ra = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-selector",
 	props: {
 		id: {},
@@ -4209,7 +4263,6 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		items: { default: () => [] },
 		itemValue: { default: "id" },
 		itemDisplay: {},
-		customFilter: {},
 		returnObject: {
 			type: Boolean,
 			default: !1
@@ -4218,66 +4271,59 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			type: Boolean,
 			default: !1
 		},
-		withSearch: {
-			type: Boolean,
-			default: !1
-		},
 		hideSelected: { type: Boolean },
 		noDataText: { default: "" },
 		disabled: { type: Boolean }
 	},
 	setup(e, { expose: n, emit: r }) {
-		let i = e, a = r, o = `select-${t(4)}`, s = Ce("activator"), c = Ce("body"), l = W(!1), u = W(!1), d = W(null), f = W(""), p = M(() => f.value.toLowerCase()), m = M(() => i.items.filter((e) => i.customFilter ? i.customFilter(e, f.value) : g(e, !0).includes(p.value)).filter((e) => i.hideSelected ? i.returnObject ? i.modelValue.id !== e.id : i.modelValue !== e[i.itemValue] : !0)), h = M(() => {
+		let i = e, a = r, o = `select-${t(4)}`, s = Ce("activator"), c = Ce("body"), l = W(!1), u = W(!1), d = W(null), f = N(() => i.items.filter((e) => i.hideSelected ? i.returnObject ? i.modelValue.id !== e.id : i.modelValue !== e[i.itemValue] : !0)), p = N(() => {
 			if (!i.modelValue) return "";
 			if (i.returnObject && typeof i.modelValue == "object") {
 				let e = i.items.find((e) => e.id === i.modelValue.id);
-				return e ? g(e) : JSON.stringify(i.modelValue);
+				return e ? m(e) : JSON.stringify(i.modelValue);
 			}
 			if (i.returnObject && typeof i.returnObject != "object") return JSON.stringify(i.modelValue);
 			let e = i.items.find((e) => e[i.itemValue] === i.modelValue);
-			return e ? g(e) : i.modelValue;
+			return e ? m(e) : i.modelValue;
 		});
-		function g(e, t) {
-			if (!e) return "";
-			if (typeof e != "object") {
-				let n = e.toString();
-				return t ? n.toLowerCase() : n;
-			}
-			let n = (i.itemDisplay && typeof i.itemDisplay == "function" ? i.itemDisplay(e) : i.itemDisplay ? e[i.itemDisplay] : e.id).toString();
-			return t ? n.toLowerCase() : n;
+		function m(e, t) {
+			if (!e || typeof e != "object") return "";
+			let n = i.itemDisplay && typeof i.itemDisplay == "function" ? i.itemDisplay(e) : i.itemDisplay ? e[i.itemDisplay] : e.id;
+			if (n == null) return "";
+			let r = String(n);
+			return t ? r.toLowerCase() : r;
 		}
-		function _() {
+		function h() {
 			u.value = !0, a("focus");
 		}
-		function v() {
-			setTimeout(() => {
-				u.value = !1, a("blur");
-			}, 100);
+		function g(e) {
+			let t = e.relatedTarget;
+			s.value?.contains(t) || c.value?.contains(t) || (u.value = !1, a("blur"));
 		}
-		function y(e) {
-			i.disabled || (a("update:modelValue", i.returnObject ? e : e[i.itemValue]), f.value = "", l.value = !1);
+		function _(e) {
+			i.disabled || (a("update:modelValue", i.returnObject ? e : e[i.itemValue]), l.value = !1);
 		}
-		function b() {
-			a("update:modelValue", null), l.value = !1, d.value = null, f.value = "";
+		function v() {
+			a("update:modelValue", null), l.value = !1, d.value = null;
 		}
-		function x() {
+		function y() {
 			if (d.value === null) {
 				d.value = 0, c.value && c.value.focus();
 				return;
 			}
-			d.value >= 0 && d.value < (0, $.default)(m.value) - 1 && (d.value += 1);
+			d.value >= 0 && d.value < (0, $.default)(f.value) - 1 && (d.value += 1);
 		}
-		function S() {
+		function b() {
 			if (d.value === null) {
-				d.value = (0, $.default)(m.value) - 1, c.value && c.value.focus();
+				d.value = (0, $.default)(f.value) - 1, c.value && c.value.focus();
 				return;
 			}
-			d.value > 0 && d.value < (0, $.default)(m.value) && --d.value;
+			d.value > 0 && d.value < (0, $.default)(f.value) && --d.value;
 		}
-		function C() {
-			a("blur"), l.value = !1, c.value.blur(), s.value && s.value.blur();
+		function x() {
+			a("blur"), l.value = !1, c.value?.blur(), s.value && s.value.blur();
 		}
-		function w() {
+		function S() {
 			if (d.value === null && !l.value) {
 				l.value = !0, c.value && c.value.focus();
 				return;
@@ -4287,112 +4333,121 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				return;
 			}
 			if (d.value !== null) {
-				let e = m.value[d.value];
-				y(e), d.value = null, f.value = "";
+				let e = f.value[d.value];
+				_(e), d.value = null;
 			}
 		}
-		function T(e, t) {
+		function C(e, t) {
 			switch (t) {
 				case "down":
-					e.preventDefault(), e.stopPropagation(), x();
+					e.preventDefault(), e.stopPropagation(), y();
 					break;
 				case "up":
-					e.preventDefault(), e.stopPropagation(), S();
+					e.preventDefault(), e.stopPropagation(), b();
 					break;
 				case "esc":
 				case "tab":
-					C();
+					x();
 					break;
 				case "enter":
-					e.preventDefault(), e.stopPropagation(), w();
+					e.preventDefault(), e.stopPropagation(), S();
 					break;
 			}
 		}
-		function ee() {
-			b();
+		function w() {
+			v();
 		}
-		return n({ clear: ee }), Y(() => i.name, (e) => {
-			e || ee();
+		return n({ clear: w }), Y(() => i.name, (e) => {
+			e || w();
 		}), Y(() => l.value, (e, t) => {
 			if (e !== t && e) {
+				if (s.value) {
+					let e = s.value.getBoundingClientRect();
+					s.value.style.setProperty("--ui3n-selector-width", `${e.width}px`);
+				}
 				if (i.modelValue) {
-					let e = m.value.findIndex((e) => typeof i.modelValue == "object" ? e.id === i.modelValue.id : e[i.itemValue] === i.modelValue);
+					let e = f.value.findIndex((e) => typeof i.modelValue == "object" ? e.id === i.modelValue.id : e[i.itemValue] === i.modelValue);
 					d.value = e >= 0 ? e : 0;
 				}
 				a("list:open");
-			} else e !== t && !e && (d.value = null, f.value = "", a("list:close"));
-		}), (t, n) => (U(), F("div", {
+			} else e !== t && !e && (d.value = null, a("list:close"));
+		}), (t, n) => (U(), I("div", {
 			id: e.id,
-			class: z(t.$style.ui3nSelector)
+			class: B(t.$style.ui3nSelector)
 		}, [
-			e.name && e.modelValue ? (U(), F("input", {
+			e.name && e.modelValue ? (U(), I("input", {
 				key: 0,
 				type: "hidden",
 				name: e.name,
 				value: typeof e.modelValue == "object" ? JSON.stringify(e.modelValue) : String(e.modelValue)
-			}, null, 8, ea)) : P("", !0),
-			e.label ? (U(), F("label", {
+			}, null, 8, ea)) : F("", !0),
+			e.label ? (U(), I("label", {
 				key: 1,
-				class: z(t.$style.label)
-			}, q(e.label), 3)) : P("", !0),
-			L(Qr, {
+				class: B(t.$style.label)
+			}, q(e.label), 3)) : F("", !0),
+			R(ti, {
 				modelValue: l.value,
-				"onUpdate:modelValue": n[5] ||= (e) => l.value = e,
+				"onUpdate:modelValue": n[6] ||= (e) => l.value = e,
 				"offset-x": -3,
 				"offset-y": 4,
 				"position-autoupdate": "",
 				"content-border-radius": 8,
-				"content-styles": { width: "100%" },
-				class: z(t.$style.menu),
-				disabled: e.disabled
+				"content-styles": {
+					width: "100%",
+					minWidth: "var(--ui3n-selector-width, 200px)"
+				},
+				class: B(t.$style.menu),
+				disabled: e.disabled,
+				onClick: n[7] ||= () => {
+					e.disabled || (l.value = !l.value);
+				}
 			}, {
-				menu: X(() => [!J(Hr.default)(m.value) || J(Hr.default)(m.value) && e.noDataText ? (U(), F("div", {
+				menu: X(() => [!J(Wr.default)(f.value) || J(Wr.default)(f.value) && e.noDataText ? (U(), I("div", {
 					key: 0,
 					ref: "body",
-					class: z(t.$style.body)
-				}, [J(Hr.default)(m.value) ? P("", !0) : (U(!0), F(j, { key: 0 }, G(m.value, (n, r) => (U(), F("div", {
+					class: B(t.$style.body)
+				}, [J(Wr.default)(f.value) ? F("", !0) : (U(!0), I(M, { key: 0 }, G(f.value, (n, r) => (U(), I("div", {
 					key: n.id,
 					id: `${o}-${r}`,
-					class: z([
+					class: B([
 						t.$style.item,
 						d.value === r && t.$style.itemSelected,
 						e.disabled && t.$style.itemDisabled
 					]),
-					onClick: Q((e) => y(n), ["stop", "prevent"])
+					onClick: Q((e) => _(n), ["stop", "prevent"])
 				}, [K(t.$slots, "item", {
 					item: n,
 					index: r,
-					activeIndex: d.value,
-					query: f.value
-				}, () => [ue(q(g(n)), 1)])], 10, ta))), 128)), J(Hr.default)(m.value) && e.noDataText ? (U(), F("div", {
+					activeIndex: d.value
+				}, () => [le(q(m(n)), 1)])], 10, na))), 128)), J(Wr.default)(f.value) && e.noDataText ? (U(), I("div", {
 					key: 1,
-					class: z(t.$style.noData)
-				}, [K(t.$slots, "noDataText", {}, () => [ue(q(e.noDataText), 1)])], 2)) : P("", !0)], 2)) : P("", !0)]),
-				default: X(() => [I("div", {
+					class: B(t.$style.noData)
+				}, [K(t.$slots, "noDataText", {}, () => [le(q(e.noDataText), 1)])], 2)) : F("", !0)], 2)) : F("", !0)]),
+				default: X(() => [L("div", {
 					ref: "activator",
-					tabindex: "0",
-					class: z([
+					tabindex: e.disabled ? -1 : 0,
+					class: B([
 						t.$style.trigger,
 						u.value && t.$style.triggerFocused,
 						e.clearable && e.modelValue && t.$style.clearable,
 						e.placeholder && !e.modelValue && !e.disabled && t.$style.placeholder,
 						e.disabled && t.$style.triggerDisabled
 					]),
-					onFocusin: _,
-					onFocusout: v,
+					onFocusin: h,
+					onFocusout: g,
 					onKeydown: [
-						n[0] ||= Z((e) => T(e, "down"), ["down"]),
-						n[1] ||= Z((e) => T(e, "up"), ["up"]),
-						n[2] ||= Z((e) => T(e, "esc"), ["esc"]),
-						n[3] ||= Z((e) => T(e, "enter"), ["enter"]),
-						n[4] ||= Z((e) => T(e, "tab"), ["tab"])
+						n[1] ||= Z((e) => C(e, "down"), ["down"]),
+						n[2] ||= Z((e) => C(e, "up"), ["up"]),
+						n[3] ||= Z((e) => C(e, "esc"), ["esc"]),
+						n[4] ||= Z((e) => C(e, "enter"), ["enter"]),
+						n[5] ||= Z((e) => C(e, "tab"), ["tab"])
 					]
 				}, [
 					K(t.$slots, "selection", {
 						value: e.modelValue,
-						selectedItem: d.value === null ? void 0 : m.value[d.value]
-					}, () => [ue(q(h.value || e.placeholder || ""), 1)]),
-					e.clearable && e.modelValue ? (U(), N(O, {
+						selectedItem: d.value === null ? void 0 : f.value[d.value]
+					}, () => [le(q(p.value || e.placeholder || ""), 1)]),
+					e.clearable && e.modelValue ? (U(), P(O, {
 						key: 0,
 						type: "icon",
 						size: "small",
@@ -4401,17 +4456,18 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 						"icon-size": "16",
 						"icon-color": "var(--color-icon-block-primary-default)",
 						disabled: e.disabled,
-						class: z(t.$style.clearBtn),
-						onClick: Q(b, ["stop", "prevent"])
-					}, null, 8, ["disabled", "class"])) : P("", !0),
-					L(ne, {
+						class: B(t.$style.clearBtn),
+						onClick: Q(v, ["stop", "prevent"]),
+						onMousedown: n[0] ||= Q(() => {}, ["stop", "prevent"])
+					}, null, 8, ["disabled", "class"])) : F("", !0),
+					R(k, {
 						icon: "outline-arrow-drop-down",
 						color: "var(--color-icon-block-primary-default)",
 						size: "16",
 						"vertical-flip": l.value,
-						class: z(t.$style.menuIcon)
+						class: B(t.$style.menuIcon)
 					}, null, 8, ["vertical-flip", "class"])
-				], 34)]),
+				], 42, ta)]),
 				_: 3
 			}, 8, [
 				"modelValue",
@@ -4421,22 +4477,22 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		], 10, $i));
 	}
 }), [["__cssModules", { $style: {
-	ui3nSelector: "_ui3nSelector_1xb1y_3",
-	label: "_label_1xb1y_17",
-	menu: "_menu_1xb1y_27",
-	trigger: "_trigger_1xb1y_37",
-	placeholder: "_placeholder_1xb1y_57",
-	triggerDisabled: "_triggerDisabled_1xb1y_61",
-	menuIcon: "_menuIcon_1xb1y_67",
-	clearable: "_clearable_1xb1y_72",
-	clearBtn: "_clearBtn_1xb1y_75",
-	triggerFocused: "_triggerFocused_1xb1y_80",
-	body: "_body_1xb1y_85",
-	noData: "_noData_1xb1y_91",
-	item: "_item_1xb1y_103",
-	itemSelected: "_itemSelected_1xb1y_117",
-	itemDisabled: "_itemDisabled_1xb1y_121"
-} }]]), ra = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nSelector: "_ui3nSelector_1fmel_3",
+	label: "_label_1fmel_18",
+	menu: "_menu_1fmel_28",
+	trigger: "_trigger_1fmel_38",
+	placeholder: "_placeholder_1fmel_58",
+	triggerDisabled: "_triggerDisabled_1fmel_62",
+	menuIcon: "_menuIcon_1fmel_68",
+	clearable: "_clearable_1fmel_73",
+	clearBtn: "_clearBtn_1fmel_76",
+	triggerFocused: "_triggerFocused_1fmel_81",
+	body: "_body_1fmel_86",
+	noData: "_noData_1fmel_95",
+	item: "_item_1fmel_107",
+	itemSelected: "_itemSelected_1fmel_121",
+	itemDisabled: "_itemDisabled_1fmel_125"
+} }]]), ia = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-mobile-menu",
 	props: {
 		modelValue: { type: Boolean },
@@ -4445,57 +4501,60 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		xe((e) => ({
-			v5ec41730: i.value,
-			v06b55ad7: a.value
+		let n = e, r = t, i = N(() => ({
+			"--ui3n-menu-width-custom": isNaN(Number(n.width)) ? n.width || "240px" : `${n.width}px`,
+			"--ui3n-menu-blur-custom": n.withBlur ? "2px" : "0"
 		}));
-		let n = e, r = t, i = M(() => n.width || "240px"), a = M(() => n.withBlur ? "2px" : "0");
-		function o() {
+		function a() {
 			r("update:modelValue", !n.modelValue);
 		}
-		return (t, n) => (U(), F(j, null, [I("div", { class: z(t.$style.ui3nMobileMenu) }, [e.modelValue ? P("", !0) : (U(), N(O, {
+		return (t, n) => (U(), I("div", {
+			class: B(t.$style.ui3nMobileMenu),
+			style: V(i.value)
+		}, [e.modelValue ? F("", !0) : (U(), P(O, {
 			key: 0,
 			type: "icon",
-			class: z(t.$style.menuButton),
+			class: B(t.$style.menuButton),
 			color: "var(--color-bg-block-primary-default)",
 			icon: "round-menu",
 			"icon-color": "var(--color-icon-block-primary-default)",
 			"icon-size": "32",
-			onClick: Q(o, ["stop", "prevent"])
-		}, null, 8, ["class"])), L(ce, { name: "slide-fade" }, {
-			default: X(() => [e.modelValue ? (U(), F("div", {
+			onClick: Q(a, ["stop", "prevent"])
+		}, null, 8, ["class"])), R(se, { name: "slide-fade" }, {
+			default: X(() => [e.modelValue ? (U(), I("div", {
 				key: 0,
-				class: z(t.$style.appMenu)
-			}, [
-				I("div", { class: z(t.$style.appMenuHeader) }, [K(t.$slots, "header")], 2),
-				I("div", { class: z(t.$style.appMenuBody) }, [K(t.$slots, "menuBody")], 2),
-				I("div", { class: z(t.$style.appMenuFooter) }, [K(t.$slots, "footer")], 2),
-				L(O, {
-					type: "icon",
-					icon: "round-close",
-					color: "transparent",
-					"icon-color": "var(--color-icon-block-secondary-default)",
-					"icon-size": "32",
-					class: z(t.$style.closeBtn),
-					onClick: Q(o, ["stop", "prevent"])
-				}, null, 8, ["class"])
-			], 2)) : P("", !0)]),
+				class: B(t.$style.menuWrapper)
+			}, [L("div", {
+				class: B(t.$style.overlay),
+				onClick: a
+			}, null, 2), L("div", { class: B(t.$style.menuPanel) }, [L("div", { class: B(t.$style.appMenu) }, [
+				L("div", { class: B(t.$style.appMenuHeader) }, [K(t.$slots, "header")], 2),
+				L("div", { class: B(t.$style.appMenuBody) }, [K(t.$slots, "menuBody")], 2),
+				L("div", { class: B(t.$style.appMenuFooter) }, [K(t.$slots, "footer")], 2)
+			], 2), R(O, {
+				type: "icon",
+				icon: "round-close",
+				color: "transparent",
+				"icon-color": "var(--color-icon-block-secondary-default)",
+				"icon-size": "32",
+				class: B(t.$style.closeBtn),
+				onClick: Q(a, ["stop", "prevent"])
+			}, null, 8, ["class"])], 2)], 2)) : F("", !0)]),
 			_: 3
-		})], 2), e.modelValue ? (U(), F("div", {
-			key: 0,
-			class: z(t.$style.overlay)
-		}, null, 2)) : P("", !0)], 64));
+		})], 6));
 	}
 }), [["__cssModules", { $style: {
-	ui3nMobileMenu: "_ui3nMobileMenu_25kgy_3",
-	appMenu: "_appMenu_25kgy_8",
-	appMenuHeader: "_appMenuHeader_25kgy_27",
-	appMenuBody: "_appMenuBody_25kgy_32",
-	appMenuFooter: "_appMenuFooter_25kgy_40",
-	menuButton: "_menuButton_25kgy_45",
-	closeBtn: "_closeBtn_25kgy_50",
-	overlay: "_overlay_25kgy_59"
-} }]]), ia = /* @__PURE__ */ D(/* @__PURE__ */ R({
+	ui3nMobileMenu: "_ui3nMobileMenu_1991k_3",
+	menuWrapper: "_menuWrapper_1991k_9",
+	menuPanel: "_menuPanel_1991k_18",
+	appMenu: "_appMenu_1991k_28",
+	appMenuHeader: "_appMenuHeader_1991k_47",
+	appMenuBody: "_appMenuBody_1991k_52",
+	appMenuFooter: "_appMenuFooter_1991k_60",
+	menuButton: "_menuButton_1991k_65",
+	closeBtn: "_closeBtn_1991k_70",
+	overlay: "_overlay_1991k_78"
+} }]]), aa = /* @__PURE__ */ D(/* @__PURE__ */ z({
 	__name: "ui3n-mobile-menu-item",
 	props: {
 		item: {},
@@ -4507,25 +4566,25 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 		async function i() {
 			r("selectItem", n.item);
 		}
-		return (t, n) => (U(), F("div", {
-			class: z([t.$style.menuItem, e.isActive && t.$style.menuItemSelected]),
+		return (t, n) => (U(), I("div", {
+			class: B([t.$style.menuItem, e.isActive && t.$style.menuItemSelected]),
 			onClick: i
-		}, [e.item.icon ? (U(), N(ne, {
+		}, [e.item.icon ? (U(), P(k, {
 			key: 0,
 			icon: e.item.icon,
 			size: "20",
 			color: "var(--color-icon-control-secondary-default)"
-		}, null, 8, ["icon"])) : P("", !0), I("span", { class: z(t.$style.menuItemName) }, q(e.item.name), 3)], 2));
+		}, null, 8, ["icon"])) : F("", !0), L("span", { class: B(t.$style.menuItemName) }, q(e.item.name), 3)], 2));
 	}
 }), [["__cssModules", { $style: {
 	menuItem: "_menuItem_5dv4z_4",
 	menuItemName: "_menuItemName_5dv4z_15",
 	menuItemSelected: "_menuItemSelected_5dv4z_21",
 	bounceOnce: "_bounceOnce_5dv4z_1"
-} }]]), aa = 32, oa = /* @__PURE__ */ D(/* @__PURE__ */ R({
-	__name: "ui3n-scroolbar-horizontal",
+} }]]), oa = 32, sa = /* @__PURE__ */ D(/* @__PURE__ */ z({
+	__name: "ui3n-scrollbar-horizontal",
 	props: {
-		thumbMinWidth: { default: aa },
+		thumbMinWidth: { default: oa },
 		thumbWidth: { default: "auto" },
 		thumbRadius: { default: 4 },
 		thumbColor: { default: "var(--color-bg-control-accent-default)" },
@@ -4537,10 +4596,10 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 	},
 	emits: ["scroll"],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, a = W(null), o = W(null), s = W(null), c = W(0), l = W(0), u = W(0), d = W(!1), f = W(!1), p = W(!1), m = null, h, g = 0, _ = 0, v = M(() => c.value > l.value), y = M(() => d.value ? !0 : v.value && (f.value || p.value)), b = M(() => {
+		let r = e, i = n, a = W(null), o = W(null), s = W(null), c = W(0), l = W(0), u = W(0), d = W(!1), f = W(!1), p = W(!1), m = null, h, g = 0, _ = 0, v = N(() => c.value > l.value), y = N(() => d.value ? !0 : v.value && (f.value || p.value)), b = N(() => {
 			let e = Number(r.thumbMinWidth);
-			return isNaN(e) ? aa : e;
-		}), x = M(() => {
+			return isNaN(e) ? oa : e;
+		}), x = N(() => {
 			if (!c.value) return 0;
 			if (r.thumbWidth !== "auto") {
 				let e = Number(r.thumbWidth);
@@ -4548,29 +4607,29 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			}
 			let e = l.value / c.value, t = l.value * e;
 			return Math.max(b.value, t);
-		}), S = M(() => {
+		}), S = N(() => {
 			if (!c.value || c.value === l.value) return 0;
 			let e = c.value - l.value, t = l.value - x.value;
 			return u.value / e * t;
-		}), C = M(() => {
+		}), C = N(() => {
 			let e = Number(r.thumbRadius);
 			return isNaN(e) ? String(r.thumbRadius) : `${e}px`;
-		}), w = M(() => r.thumbColor), T = M(() => r.thumbHoverColor), ee = M(() => r.thumbActiveColor), E = M(() => {
+		}), w = N(() => r.thumbColor), T = N(() => r.thumbHoverColor), ee = N(() => r.thumbActiveColor), E = N(() => {
 			let e = Number(r.trackHeight);
 			return isNaN(e) ? String(r.trackHeight) : `${e}px`;
-		}), te = M(() => {
+		}), te = N(() => {
 			let e = Number(r.trackRadius);
 			return isNaN(e) ? String(r.trackRadius) : `${e}px`;
-		}), D = M(() => r.trackColor);
+		}), D = N(() => r.trackColor);
 		function O() {
 			a.value && (c.value = a.value.scrollWidth, l.value = a.value.clientWidth, u.value = a.value.scrollLeft);
 		}
-		function ne(e) {
-			d.value || (u.value = e.target.scrollLeft), p.value = !0, window.clearTimeout(h), h = window.setTimeout(() => {
+		function k(e) {
+			d.value || (u.value = e.target.scrollLeft), p.value = !0, clearTimeout(h), h = setTimeout(() => {
 				p.value = !1;
 			}, 1500), i("scroll", e);
 		}
-		function k(e) {
+		function A(e) {
 			if (e.target !== o.value || !a.value || !o.value) return;
 			let t = o.value.getBoundingClientRect(), n = e.clientX - t.left - x.value / 2, r = c.value - l.value, i = n / (l.value - x.value) * r;
 			i = Math.max(0, Math.min(r, i)), a.value.scrollTo({
@@ -4578,34 +4637,34 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 				behavior: "smooth"
 			});
 		}
-		function re(e) {
-			!s.value || !a.value || (e.preventDefault(), e.stopPropagation(), s.value.setPointerCapture(e.pointerId), d.value = !0, g = e.clientX, _ = u.value, document.body.style.userSelect = "none", s.value.addEventListener("pointermove", ie), s.value.addEventListener("pointerup", A), s.value.addEventListener("pointercancel", A));
+		function ne(e) {
+			!s.value || !a.value || (e.preventDefault(), e.stopPropagation(), s.value.setPointerCapture(e.pointerId), d.value = !0, g = e.clientX, _ = u.value, document.body.style.userSelect = "none", s.value.addEventListener("pointermove", re), s.value.addEventListener("pointerup", j), s.value.addEventListener("pointercancel", j));
 		}
-		function ie(e) {
+		function re(e) {
 			if (!d.value || !a.value) return;
 			let t = e.clientX - g, n = c.value - l.value, r = t / (l.value - x.value) * n;
 			a.value.scrollLeft = _ + r, u.value = a.value.scrollLeft;
 		}
-		function A(e) {
+		function j(e) {
 			if (d.value && (d.value = !1, document.body.style.userSelect = "", s.value)) {
 				try {
 					s.value.releasePointerCapture(e.pointerId);
 				} catch {}
-				s.value.removeEventListener("pointermove", ie), s.value.removeEventListener("pointerup", A), s.value.removeEventListener("pointercancel", A);
+				s.value.removeEventListener("pointermove", re), s.value.removeEventListener("pointerup", j), s.value.removeEventListener("pointercancel", j);
 			}
 		}
 		return H(() => {
 			O(), a.value && (m = new ResizeObserver(O), m.observe(a.value), a.value.firstElementChild && m.observe(a.value.firstElementChild));
-		}), V(() => {
-			m?.disconnect(), window.clearTimeout(h), s.value && (s.value.removeEventListener("pointermove", ie), s.value.removeEventListener("pointerup", A), s.value.removeEventListener("pointercancel", A)), document.body.style.userSelect = "";
+		}), me(() => {
+			m?.disconnect(), h && clearTimeout(h), s.value && (s.value.removeEventListener("pointermove", re), s.value.removeEventListener("pointerup", j), s.value.removeEventListener("pointercancel", j)), document.body.style.userSelect = "";
 		}), t({
 			scrollTo: (e) => {
 				a.value?.scrollTo(e);
 			},
 			getContainer: () => a.value
-		}), (e, t) => (U(), F("div", {
-			class: z(e.$style.ui3nScrollbarHorizontal),
-			style: B({
+		}), (e, t) => (U(), I("div", {
+			class: B(e.$style.ui3nScrollbarHorizontal),
+			style: V({
 				"--ui3n-scrollbar-horizontal-thumb-radius": C.value,
 				"--ui3n-scrollbar-horizontal-thumb-color": w.value,
 				"--ui3n-scrollbar-horizontal-thumb-hover-color": T.value,
@@ -4616,38 +4675,38 @@ var Yr = ["id"], Xr = /* @__PURE__ */ D(/* @__PURE__ */ R({
 			}),
 			onMouseenter: t[0] ||= (e) => f.value = !0,
 			onMouseleave: t[1] ||= (e) => f.value = !1
-		}, [I("div", {
+		}, [L("div", {
 			ref_key: "containerRef",
 			ref: a,
-			class: z(e.$style.scrollbarContainer),
-			onScroll: ne
-		}, [K(e.$slots, "default")], 34), I("div", {
+			class: B(e.$style.scrollbarContainer),
+			onScroll: k
+		}, [K(e.$slots, "default")], 34), L("div", {
 			ref_key: "trackRef",
 			ref: o,
-			class: z([e.$style.track, { [e.$style.trackVisible]: y.value }]),
-			onMousedown: k
-		}, [I("div", {
+			class: B([e.$style.track, { [e.$style.trackVisible]: y.value }]),
+			onMousedown: A
+		}, [L("div", {
 			ref_key: "thumbRef",
 			ref: s,
-			class: z([e.$style.thumb, { [e.$style.active]: d.value }]),
-			style: B({
+			class: B([e.$style.thumb, { [e.$style.active]: d.value }]),
+			style: V({
 				width: `${x.value}px`,
 				transform: `translateX(${S.value}px)`
 			}),
-			onPointerdown: re
+			onPointerdown: ne
 		}, null, 38)], 34)], 38));
 	}
 }), [["__cssModules", { $style: {
-	ui3nScrollbarHorizontal: "_ui3nScrollbarHorizontal_1ne48_1",
-	scrollbarContainer: "_scrollbarContainer_1ne48_8",
-	track: "_track_1ne48_22",
-	trackVisible: "_trackVisible_1ne48_37",
-	thumb: "_thumb_1ne48_43",
-	active: "_active_1ne48_56"
+	ui3nScrollbarHorizontal: "_ui3nScrollbarHorizontal_1rgwl_1",
+	scrollbarContainer: "_scrollbarContainer_1rgwl_7",
+	track: "_track_1rgwl_20",
+	trackVisible: "_trackVisible_1rgwl_35",
+	thumb: "_thumb_1rgwl_41",
+	active: "_active_1rgwl_54"
 } }]]);
 //#endregion
 //#region src/composables/useDblClickHandler.ts
-function sa(e, t, n = 250) {
+function ca(e, t, n = 250) {
 	let r = 0, i = null;
 	function a(a) {
 		r++, i && clearTimeout(i), i = setTimeout(() => {
@@ -4657,4 +4716,4 @@ function sa(e, t, n = 250) {
 	return { handleDblClick: a };
 }
 //#endregion
-export { qi as Ui3nAutocomplete, li as Ui3nBadge, ui as Ui3nBreadcrumb, di as Ui3nBreadcrumbs, O as Ui3nButton, zr as Ui3nCheckbox, er as Ui3nChip, On as Ui3nClickOutside, Xr as Ui3nDialog, qr as Ui3nDialogProvider, rr as Ui3nDropFiles, Bi as Ui3nEditable, ir as Ui3nEmoji, En as Ui3nHtml, ne as Ui3nIcon, sr as Ui3nInput, Ar as Ui3nInputFile, ti as Ui3nList, Qn as Ui3nLongPress, Qr as Ui3nMenu, ra as Ui3nMobileMenu, ia as Ui3nMobileMenuItem, k as Ui3nNotification, Ei as Ui3nProgressCircular, xi as Ui3nProgressLinear, Ni as Ui3nRadio, Pi as Ui3nRadioGroup, Fn as Ui3nResize, te as Ui3nRipple, oa as Ui3nScrollbarHorizontal, ri as Ui3nScrollbarVertical, na as Ui3nSelector, Qi as Ui3nSlider, _i as Ui3nStepLineBar, hi as Ui3nSwitch, Gr as Ui3nTable, Br as Ui3nTableSortIcon, oi as Ui3nTabs, Nr as Ui3nText, Gn as Ui3nTitle, Oi as Ui3nTooltip, ii as Ui3nVirtualScroll, sa as useDblClickHandler };
+export { qi as Ui3nAutocomplete, fi as Ui3nBadge, mi as Ui3nBreadcrumb, hi as Ui3nBreadcrumbs, O as Ui3nButton, zr as Ui3nCheckbox, er as Ui3nChip, On as Ui3nClickOutside, $r as Ui3nDialog, Xr as Ui3nDialogProvider, rr as Ui3nDropFiles, Vi as Ui3nEditable, ir as Ui3nEmoji, En as Ui3nHtml, k as Ui3nIcon, sr as Ui3nInput, Ar as Ui3nInputFile, ii as Ui3nList, Qn as Ui3nLongPress, ti as Ui3nMenu, ia as Ui3nMobileMenu, aa as Ui3nMobileMenuItem, A as Ui3nNotification, Di as Ui3nProgressCircular, Ci as Ui3nProgressLinear, Pi as Ui3nRadio, Fi as Ui3nRadioGroup, Fn as Ui3nResize, te as Ui3nRipple, sa as Ui3nScrollbarHorizontal, oi as Ui3nScrollbarVertical, ra as Ui3nSelector, Qi as Ui3nSlider, bi as Ui3nStepLineBar, vi as Ui3nSwitch, Jr as Ui3nTable, Br as Ui3nTableSortIcon, li as Ui3nTabs, Nr as Ui3nText, Gn as Ui3nTitle, ki as Ui3nTooltip, si as Ui3nVirtualScroll, ca as useDblClickHandler };