wave-ui 3.27.1 → 3.28.0

package/dist/wave-ui.esm.js

@@ -1,13 +1,13 @@
-import { Fragment as e, KeepAlive as t, Teleport as n, Transition as r, TransitionGroup as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createSlots as u, createTextVNode as d, createVNode as f, h as p, inject as m, mergeProps as h, normalizeClass as g, normalizeProps as _, normalizeStyle as v, onBeforeUnmount as y, onMounted as ee, openBlock as b, reactive as x, ref as S, render as te, renderList as C, renderSlot as w, resolveComponent as T, resolveDirective as E, resolveDynamicComponent as D, toDisplayString as O, toHandlers as k, useId as A, vModelDynamic as j, vModelText as M, vShow as N, withCtx as P, withDirectives as F, withKeys as I, withModifiers as L } from "vue";
+import { Fragment as e, KeepAlive as t, Teleport as n, Transition as r, TransitionGroup as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createSlots as u, createTextVNode as d, createVNode as f, h as p, inject as m, mergeProps as h, nextTick as g, normalizeClass as _, normalizeProps as v, normalizeStyle as y, onBeforeUnmount as ee, onMounted as te, openBlock as b, reactive as x, ref as S, render as C, renderList as w, renderSlot as T, resolveComponent as E, resolveDirective as ne, resolveDynamicComponent as D, toDisplayString as O, toHandlers as k, unref as re, useAttrs as ie, useId as A, vModelDynamic as j, vModelText as M, vShow as ae, watch as oe, withCtx as N, withDirectives as P, withKeys as F, withModifiers as I } from "vue";
 //#region \0rolldown/runtime.js
-var R = Object.defineProperty, ne = (e, t) => {
+var se = Object.defineProperty, L = (e, t) => {
 	let n = {};
-	for (var r in e) R(n, r, {
+	for (var r in e) se(n, r, {
 		get: e[r],
 		enumerable: !0
 	});
-	return t || R(n, Symbol.toStringTag, { value: "Module" }), n;
-}, re = x({
+	return t || se(n, Symbol.toStringTag, { value: "Module" }), n;
+}, R = x({
 	on: "#app",
 	breakpoints: {
 		xs: 600,
@@ -49,15 +49,16 @@ var R = Object.defineProperty, ne = (e, t) => {
 		align: "right",
 		transition: "default"
 	},
+	ripple: !0,
 	presets: {}
-}), ie = (e, t = re) => {
+}), ce = (e, t = R) => {
 	if (!Object.keys(t).length) t = Object.assign(t, e);
 	else for (let n in e) {
 		let r = e[n];
-		typeof r == "object" && typeof t[n] == "object" ? ie(e[n], t[n]) : t[n] = r;
+		typeof r == "object" && typeof t[n] == "object" ? ce(e[n], t[n]) : t[n] = r;
 	}
 	return t;
-}, z = (e) => console.warn(`Wave UI: ${e}`), B = (e) => console.error(`Wave UI: ${e}`), ae = (e) => {
+}, z = (e) => console.warn(`Wave UI: ${e}`), B = (e) => console.error(`Wave UI: ${e}`), le = (e) => {
 	["light", "dark"].forEach((t) => {
 		let n = e.colors[t];
 		n.shades = {};
@@ -70,13 +71,13 @@ var R = Object.defineProperty, ne = (e, t) => {
 			if (i) {
 				i.length === 3 && (r.color = `${i[0]}${i[0]}${i[1]}${i[1]}${i[2]}${i[2]}`);
 				for (let e = 1; e <= 6; e++) {
-					let i = de(`#${r.color}`, e * (t?.lightIncrement ?? 16) + (t?.lightOffset ?? 0)), a = fe(`#${r.color}`, e * (t?.darkIncrement ?? 12.4) + (t?.darkOffset ?? 0));
+					let i = ve(`#${r.color}`, e * (t?.lightIncrement ?? 16) + (t?.lightOffset ?? 0)), a = ye(`#${r.color}`, e * (t?.darkIncrement ?? 12.4) + (t?.darkOffset ?? 0));
 					n.shades[`${r.label}-light${e}`] = i, n.shades[`${r.label}-dark${e}`] = a;
 				}
 			}
 		}
 	});
-}, V = (e, t) => {
+}, ue = (e, t) => {
 	let n = { ...t.reduce((e, t) => {
 		e[t.label] = t.color;
 		let n = (t.shades || []).reduce((e, t) => (e[t.label] = t.color, e), {});
@@ -90,27 +91,27 @@ var R = Object.defineProperty, ne = (e, t) => {
 	}) };
 	return delete n.shades, n;
 };
-function H(e, t, n) {
+function de(e, t, n) {
 	return Math.min(Math.max(e, t), n);
 }
-function U(e) {
+function V(e) {
 	let t = e.toString(16);
 	return t.length === 1 && `0${t}` || t.length === 2 && t || B(`expected value from 0~255, got: ${e}`) || "";
 }
-function oe(e) {
+function H(e) {
 	return /^#[0-9a-f]{6}([0-9a-f]{2})?$/i.test(e);
 }
-function se(e) {
+function fe(e) {
 	return /^#[0-9a-f]{3}([0-9a-f])?$/i.test(e);
 }
-function ce(e) {
+function pe(e) {
 	return `#${e.substring(1).split("").map((e) => `${e}${e}`).join("")}`;
 }
-function le(e) {
-	return oe(e) && e || se(e) && ce(e) || B(`expected color hex string, got '${e}'`) || "";
+function me(e) {
+	return H(e) && e || fe(e) && pe(e) || B(`expected color hex string, got '${e}'`) || "";
 }
-function W(e) {
-	let t = le(e);
+function he(e) {
+	let t = me(e);
 	return {
 		red: parseInt(t.substring(1, 3), 16),
 		green: parseInt(t.substring(3, 5), 16),
@@ -119,24 +120,24 @@ function W(e) {
 		hasAlpha: t.length === 9
 	};
 }
-function ue(e, t, n, r) {
-	return `#${U(e)}${U(t)}${U(n)}${r ? U(Math.floor(r * 255)) : ""}`;
+function ge(e, t, n, r) {
+	return `#${V(e)}${V(t)}${V(n)}${r ? V(Math.floor(r * 255)) : ""}`;
 }
-function G(e, t, n = 50) {
-	let r = W(e), i = W(t), a = H(n, 0, 100) / 100, o = 2 * a - 1, s = r.alpha - i.alpha, c = ((o * s === -1 ? o : (o + s) / (1 + o * s)) + 1) / 2, l = 1 - c, u = H(Math.round(r.red * c + i.red * l), 0, 255), d = H(Math.round(r.green * c + i.green * l), 0, 255), f = H(Math.round(r.blue * c + i.blue * l), 0, 255), p = r.alpha * a + i.alpha * (1 - a), m = [
+function _e(e, t, n = 50) {
+	let r = he(e), i = he(t), a = de(n, 0, 100) / 100, o = 2 * a - 1, s = r.alpha - i.alpha, c = ((o * s === -1 ? o : (o + s) / (1 + o * s)) + 1) / 2, l = 1 - c, u = de(Math.round(r.red * c + i.red * l), 0, 255), d = de(Math.round(r.green * c + i.green * l), 0, 255), f = de(Math.round(r.blue * c + i.blue * l), 0, 255), p = r.alpha * a + i.alpha * (1 - a), m = [
 		u,
 		d,
 		f
 	];
-	return (r.hasAlpha || i.hasAlpha || p !== 1) && m.push(p), ue(...m);
+	return (r.hasAlpha || i.hasAlpha || p !== 1) && m.push(p), ge(...m);
 }
-function de(e, t = 15) {
-	return G("#ffffff", e, t);
+function ve(e, t = 15) {
+	return _e("#ffffff", e, t);
 }
-function fe(e, t = 12.4) {
-	return G("#000000", e, t);
+function ye(e, t = 12.4) {
+	return _e("#000000", e, t);
 }
-var K = [
+var be = [
 	{
 		label: "pink",
 		color: "#e91e63",
@@ -1179,14 +1180,14 @@ var K = [
 		label: "inherit",
 		color: "inherit"
 	}
-], q = {
+], U = {
 	cssScope: ".w-app",
 	baseIncrement: 4
-}, J = {
+}, W = {
 	keys: [],
 	values: []
-}, pe = null, me = (e, t) => {
-	let n = "", r = {}, { info: i, warning: a, success: o, error: s, shades: c, ...l } = e, { cssScope: u } = q;
+}, xe = null, Se = (e, t) => {
+	let n = "", r = {}, { info: i, warning: a, success: o, error: s, shades: c, ...l } = e, { cssScope: u } = U;
 	for (let e in l) n += `${u} .${e}--bg{background-color:var(--w-${e}-color)}${u} .${e}{color:var(--w-${e}-color)}`;
 	for (let e in c) n += `${u} .${e}--bg{background-color:${c[e]}}${u} .${e}{color:${c[e]}}`;
 	let d = {
@@ -1202,8 +1203,8 @@ var K = [
 	return Object.entries(r).forEach(([e, t]) => {
 		f += `--w-${e}-color: ${t};`;
 	}), `:root{${f}}${n}`;
-}, he = (e, t) => {
-	let n = "", { cssScope: r } = q;
+}, Ce = (e, t) => {
+	let n = "", { cssScope: r } = U;
 	return e.forEach(({ min: e, label: i }) => {
 		if (i === "xs") for (let e = 0; e < t; e++) n += `${r} .${i}${t - e}{width:${parseFloat(((t - e) * 100 / t).toFixed(4))}%;}`;
 		else {
@@ -1212,8 +1213,8 @@ var K = [
 			n += "}";
 		}
 	}), n;
-}, ge = (e) => {
-	let t = "", { cssScope: n, baseIncrement: r } = q, i = /* @__PURE__ */ "show{display:block}.hide{display:none}.d-flex{display:flex}.d-iflex{display:inline-flex}.d-block{display:block}.d-iblock{display:inline-block}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-nowrap{white-space:nowrap}.row{flex-direction:row}.column{flex-direction:column}.column-reverse{flex-direction:column-reverse}.grow{flex-grow:1;flex-basis:auto}.no-grow{flex-grow:0}.shrink{flex-shrink:1;margin-left:auto;margin-right:auto}.no-shrink{flex-shrink:0}.wrap{flex-wrap: wrap}.no-wrap{flex-wrap: nowrap}.fill-width{width:100%}.fill-height{height:100%}.h-auto{height:auto}.h-screen{height:100vh}.basis-zero{flex-basis:0}.align-start{align-items:flex-start}.align-center{align-items:center}.align-end{align-items:flex-end}.align-self-start{align-self:flex-start}.align-self-center{align-self:center}.align-self-end{align-self:flex-end}.align-self-stretch{align-self:stretch}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-space-between{justify-content:space-between}.justify-space-around{justify-content:space-around}.justify-space-evenly{justify-content:space-evenly}".split("."), a = Array(12).fill();
+}, we = (e) => {
+	let t = "", { cssScope: n, baseIncrement: r } = U, i = /* @__PURE__ */ "show{display:block}.hide{display:none}.d-flex{display:flex}.d-iflex{display:inline-flex}.d-block{display:block}.d-iblock{display:inline-block}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-nowrap{white-space:nowrap}.row{flex-direction:row}.column{flex-direction:column}.column-reverse{flex-direction:column-reverse}.grow{flex-grow:1;flex-basis:auto}.no-grow{flex-grow:0}.shrink{flex-shrink:1;margin-left:auto;margin-right:auto}.no-shrink{flex-shrink:0}.wrap{flex-wrap: wrap}.no-wrap{flex-wrap: nowrap}.fill-width{width:100%}.fill-height{height:100%}.h-auto{height:auto}.h-screen{height:100vh}.basis-zero{flex-basis:0}.align-start{align-items:flex-start}.align-center{align-items:center}.align-end{align-items:flex-end}.align-self-start{align-self:flex-start}.align-self-center{align-self:center}.align-self-end{align-self:flex-end}.align-self-stretch{align-self:stretch}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-space-between{justify-content:space-between}.justify-space-around{justify-content:space-around}.justify-space-evenly{justify-content:space-evenly}".split("."), a = Array(12).fill();
 	return e.forEach(({ label: e, min: o }) => {
 		e !== "xs" && (t += `@media(min-width:${o}px){` + i.map((t) => `${n} .${e}u-${t}`).join("") + a.map((t, n) => `.w-grid.${e}u-columns${n + 1}{grid-template-columns:repeat(${n + 1},1fr);}`).join("") + a.map((t, n) => `.w-flex.${e}u-gap${n + 1},.w-grid.${e}u-gap${n + 1}{gap:${(n + 1) * r}px;}`).join("") + `.w-flex.${e}u-gap0,.w-flex.${e}u-gap0{gap:0}}`);
 	}), e.forEach(({ label: e, min: o, max: s }) => {
@@ -1221,11 +1222,11 @@ var K = [
 	}), e.forEach(({ label: e, max: o }) => {
 		e !== "xl" && (t += `@media (max-width:${o}px){` + i.map((t) => `${n} .${e}d-${t}`).join("") + a.map((t, n) => `.w-grid.${e}d-columns${n + 1}{grid-template-columns:repeat(${n + 1},1fr);}`).join("") + a.map((t, n) => `.w-flex.${e}d-gap${n + 1},.w-grid.${e}d-gap${n + 1}{gap:${(n + 1) * r}px;}`).join("") + `.w-flex.${e}d-gap0,.w-flex.${e}d-gap0{gap:0}}`);
 	}), t;
-}, _e = (e) => {
-	let t = window.innerWidth, n = J.values.slice(0);
+}, Te = (e) => {
+	let t = window.innerWidth, n = W.values.slice(0);
 	n.push(t), n.sort((e, t) => e - t);
-	let r = J.keys[n.indexOf(t)] || "xl";
-	r !== pe && (pe = r, e.breakpoint = {
+	let r = W.keys[n.indexOf(t)] || "xl";
+	r !== xe && (xe = r, e.breakpoint = {
 		name: r,
 		xs: r === "xs",
 		sm: r === "sm",
@@ -1234,14 +1235,14 @@ var K = [
 		xl: r === "xl",
 		width: t
 	}), e.breakpoint.width = window.innerWidth;
-}, ve = (e) => {
+}, G = (e) => {
 	let { config: t } = e;
-	if (J = {
+	if (W = {
 		keys: Object.keys(t.breakpoints),
 		values: Object.values(t.breakpoints)
 	}, !document.getElementById("wave-ui-styles")) {
 		let e = document.createElement("style");
-		e.id = "wave-ui-styles", e.innerHTML = be(t);
+		e.id = "wave-ui-styles", e.innerHTML = Ee(t);
 		let n = document.head.querySelectorAll("style,link[rel=\"stylesheet\"]");
 		if (t.css.prependCss) {
 			let t = n[0];
@@ -1251,15 +1252,15 @@ var K = [
 			t ? t.after(e) : document.head.appendChild(e);
 		}
 	}
-	_e(e), window.addEventListener("resize", () => _e(e));
-}, ye = (e, t, n) => {
+	Te(e), window.addEventListener("resize", () => Te(e));
+}, K = (e, t, n) => {
 	if (!document.getElementById("wave-ui-colors")) {
 		let r = document.createElement("style");
-		r.id = "wave-ui-colors", r.innerHTML = me(e, t, n);
+		r.id = "wave-ui-colors", r.innerHTML = Se(e, t, n);
 		let i = document.head.querySelectorAll("style,link[rel=\"stylesheet\"]")[0];
 		i ? i.before(r) : document.head.appendChild(r);
 	}
-}, be = (e) => {
+}, Ee = (e) => {
 	let t = Object.entries(e.breakpoints), n = t.map(([e, n], r) => {
 		let [, i = 0] = t[r - 1] || [];
 		return {
@@ -1268,26 +1269,26 @@ var K = [
 			max: n
 		};
 	}), r = getComputedStyle(document.documentElement);
-	q.cssScope = r.getPropertyValue("--w-css-scope"), q.baseIncrement = parseInt(r.getPropertyValue("--w-base-increment"));
+	U.cssScope = r.getPropertyValue("--w-css-scope"), U.baseIncrement = parseInt(r.getPropertyValue("--w-base-increment"));
 	let i = "";
-	return i += he(n, e.css.grid), e.css.breakpointLayoutClasses && (i += ge(n)), i;
-}, xe = ["innerHTML"];
-function Se(t, r, a, u, d, p) {
-	let m = T("w-alert");
+	return i += Ce(n, e.css.grid), e.css.breakpointLayoutClasses && (i += we(n)), i;
+}, q = ["innerHTML"];
+function De(t, r, a, u, d, p) {
+	let m = E("w-alert");
 	return b(), o(n, { to: ".w-app" }, [f(i, {
-		class: g(["w-notification-manager", { "w-notification-manager--left": p.conf.align === "left" }]),
+		class: _(["w-notification-manager", { "w-notification-manager--left": p.conf.align === "left" }]),
 		tag: "div",
 		name: p.transition,
 		appear: ""
 	}, {
-		default: P(() => [(b(!0), c(e, null, C(p.notifications, (t) => (b(), c(e, null, [t._value ? (b(), o(m, h({
+		default: N(() => [(b(!0), c(e, null, w(p.notifications, (t) => (b(), c(e, null, [t._value ? (b(), o(m, h({
 			class: "white--bg",
 			key: t._uid,
 			modelValue: t._value,
 			"onUpdate:modelValue": (e) => t._value = e,
 			onClose: t.dismiss
 		}, { ref_for: !0 }, p.notifProps(t)), {
-			default: P(() => [l("div", { innerHTML: t.message }, null, 8, xe)]),
+			default: N(() => [l("div", { innerHTML: t.message }, null, 8, q)]),
 			_: 2
 		}, 1040, [
 			"modelValue",
@@ -1299,11 +1300,11 @@ function Se(t, r, a, u, d, p) {
 }
 //#endregion
 //#region \0plugin-vue:export-helper
-var Y = (e, t) => {
+var J = (e, t) => {
 	let n = e.__vccOpts || e;
 	for (let [e, r] of t) n[e] = r;
 	return n;
-}, Ce = /* @__PURE__ */ Y({
+}, Oe = /* @__PURE__ */ J({
 	name: "w-notification-manager",
 	computed: {
 		conf() {
@@ -1320,7 +1321,7 @@ var Y = (e, t) => {
 		let { _value: t, _uid: n, message: r, timeout: i, ...a } = e;
 		return a.dismiss &&= !0, a;
 	} }
-}, [["render", Se]]), we = class e {
+}, [["render", De]]), ke = class e {
 	static #e;
 	notifications;
 	_uid;
@@ -1358,17 +1359,69 @@ var Y = (e, t) => {
 	dismiss(e) {
 		this.notifications = this.notifications.filter((t) => t._uid !== e);
 	}
-}, Te = (e) => {
+}, Ae = (e) => {
 	let t = document.createElement("div");
 	document.body.appendChild(t);
-	let n = p(Ce);
-	n.appContext = e._context, te(n, t), t.remove();
-}, Ee = !1, De = (e) => {
+	let n = p(Oe);
+	n.appContext = e._context, C(n, t), t.remove();
+};
+//#endregion
+//#region src/wave-ui/utils/ripple.js
+function je(e, t, n = {}) {
+	if (typeof window > "u" || typeof document > "u" || !e?.ownerDocument || n.disabled || window.matchMedia?.("(prefers-reduced-motion: reduce)")?.matches) return;
+	let r = typeof t.clientX == "number" ? t.clientX : null, i = typeof t.clientY == "number" ? t.clientY : null;
+	if ((r == null || i == null) && t.touches?.length && (r = t.touches[0].clientX, i = t.touches[0].clientY), r == null || i == null) return;
+	let a = e.getBoundingClientRect(), o = Math.max(a.width, a.height), s = Math.max(o * 2.5, 48), c = r - a.left - s / 2, l = i - a.top - s / 2, u = document.createElement("span");
+	u.className = "w-ripple__ink-container", u.setAttribute("aria-hidden", "true");
+	let d = document.createElement("span");
+	d.className = "w-ripple__ink", d.style.width = `${s}px`, d.style.height = `${s}px`, d.style.left = `${c}px`, d.style.top = `${l}px`, u.appendChild(d), e.appendChild(u);
+	let f = () => {
+		d.removeEventListener("animationend", f), u.remove();
+	};
+	d.addEventListener("animationend", f, { once: !0 }), window.setTimeout(() => {
+		u.parentNode === e && u.remove();
+	}, 600);
+}
+function Me(e) {
+	let t = e?.$waveui;
+	return t && typeof t == "object" ? t : { config: { ripple: !0 } };
+}
+function Ne(e, t) {
+	return typeof e == "boolean" ? e : t?.config?.ripple !== !1;
+}
+//#endregion
+//#region src/wave-ui/utils/wave-ripple-directive.js
+function Pe(e) {
+	let t = e.value;
+	return !!(t === !1 || t && typeof t == "object" && t.disabled);
+}
+function Fe(e, t) {
+	if (Pe(e)) return !1;
+	let n = Me(t);
+	return e.value === !0 ? Ne(!0, n) : Ne(void 0, n);
+}
+var Ie = {
+	mounted(e, t) {
+		e.classList.add("w-ripple"), e.__waveRippleLastBinding = t;
+		let n = (t) => {
+			if (typeof t.button == "number" && t.button !== 0) return;
+			let n = e.__waveRippleLastBinding;
+			Fe(n, n?.instance) && je(e, t);
+		};
+		e.__waveRippleHandler = n, e.addEventListener("pointerdown", n);
+	},
+	updated(e, t) {
+		e.__waveRippleLastBinding = t;
+	},
+	unmounted(e) {
+		e.removeEventListener("pointerdown", e.__waveRippleHandler), delete e.__waveRippleHandler, delete e.__waveRippleLastBinding;
+	}
+}, Y = !1, Le = (e) => {
 	let t = window.matchMedia("(prefers-color-scheme: dark)");
 	e.preferredTheme = t.matches ? "dark" : "light", e.switchTheme(e.preferredTheme), t.addEventListener("change", (t) => {
 		e.preferredTheme = t.matches ? "dark" : "light", e.switchTheme(e.preferredTheme);
 	});
-}, Oe = (e, t) => {
+}, Re = (e, t) => {
 	for (let n in t) if (e.props?.[n]) e.props[n].default = t[n];
 	else {
 		let r = !1;
@@ -1380,7 +1433,7 @@ var Y = (e, t) => {
 			r || z(`Attempting to set a preset on a prop that doesn't exist: \`${e.name}.${n}\`.`);
 		}
 	}
-}, X = class e {
+}, ze = class e {
 	$waveui = {
 		breakpoint: {
 			name: "",
@@ -1402,7 +1455,7 @@ var Y = (e, t) => {
 		switchTheme(e) {
 			this.theme = e, document.documentElement.setAttribute("data-theme", e), document.head.querySelector("#wave-ui-colors")?.remove?.();
 			let t = this.config.colors[this.theme];
-			ye(t, this.config.css.colorShadeCssVariables), this.colors = V(t, K);
+			K(t, this.config.css.colorShadeCssVariables), this.colors = ue(t, be);
 		},
 		setAppClasses(...e) {
 			let t = document.querySelector(".w-app");
@@ -1415,23 +1468,23 @@ var Y = (e, t) => {
 				t.value(r, e) && window.removeEventListener("scroll", n);
 			};
 			window.addEventListener("scroll", n);
-		} });
+		} }), t.directive("waveRipple", Ie);
 		let { components: r = {} } = n || {};
 		for (let e in r) {
 			let i = r[e];
-			n.presets?.[i.name] && Oe(i, n.presets[i.name]), t.component(i.name, i);
+			n.presets?.[i.name] && Re(i, n.presets[i.name]), t.component(i.name, i);
 		}
 		t.mixin({ beforeMount() {
-			if (!Ee) {
-				Ee = !0;
+			if (!Y) {
+				Y = !0;
 				let e = m("$waveui"), { config: n } = e;
-				(document.querySelector(n.on) || document.body).classList.add("w-app"), n.theme === "auto" ? De(e) : e.switchTheme(n.theme, !0), ve(e), Te(t), t._context.mixins.find((e) => e.mounted &&= void 0);
+				(document.querySelector(n.on) || document.body).classList.add("w-app"), n.theme === "auto" ? Le(e) : e.switchTheme(n.theme, !0), G(e), Ae(t), t._context.mixins.find((e) => e.mounted &&= void 0);
 			}
 		} }), new e(t, n);
 	}
 	constructor(e, t = {}) {
 		if (e.config.globalProperties.$waveui) return;
-		if (this.$waveui._notificationManager = new we(), t.theme ||= "light", t.colors) {
+		if (this.$waveui._notificationManager = new ke(), t.theme ||= "light", t.colors) {
 			let e = { ...t.colors };
 			t.colors.light || (t.colors.light = e), t.colors.dark || (t.colors.dark = e), t.colors = {
 				light: t.colors.light,
@@ -1439,36 +1492,58 @@ var Y = (e, t) => {
 			};
 		}
 		let { components: n, ...r } = t;
-		r = this.$waveui.config = ie(r), r.css.colorShades && ae(r);
+		r = this.$waveui.config = ce(r), r.css.colorShades && le(r);
 		let i = x(this.$waveui);
-		e.config.globalProperties.$waveui = i, e.provide("$waveui", i), r.theme !== "auto" && (this.$waveui.colors = V(r.colors[r.theme], K));
+		e.config.globalProperties.$waveui = i, e.provide("$waveui", i), r.theme !== "auto" && (this.$waveui.colors = ue(r.colors[r.theme], be));
 	}
-}, Z = (e = {}) => (typeof e == "string" ? e = { [e]: !0 } : Array.isArray(e) && (e = { [e.join(" ")]: !0 }), e), ke = { class: "w-accordion__item-content" };
-function Ae(e, t, n, r, i, a) {
-	return b(), c("div", ke, [w(e.$slots, "default")]);
+}, X = (e = {}) => (typeof e == "string" ? e = { [e]: !0 } : Array.isArray(e) && (e = { [e.join(" ")]: !0 }), e), Z = {
+	inject: { $waveui: {
+		from: "$waveui",
+		default: () => ({ config: { ripple: !0 } })
+	} },
+	props: { noRipple: {
+		type: Boolean,
+		default: void 0
+	} },
+	computed: { rippleActive() {
+		return Ne(this.noRipple ? !1 : void 0, this.$waveui);
+	} },
+	methods: { onRipple(e, t) {
+		if (!this.rippleActive || !e) return;
+		let n = t ?? e.currentTarget;
+		if (!n?.getBoundingClientRect) {
+			let t = e.target;
+			n = (t?.nodeType === 1 ? t : t?.parentElement)?.closest?.(".w-ripple") ?? null;
+		}
+		!n?.getBoundingClientRect && this.$el instanceof Element && this.$el.classList?.contains("w-ripple") && (n = this.$el), n?.getBoundingClientRect && je(n, e);
+	} }
+}, Be = { class: "w-accordion__item-content" };
+function Ve(e, t, n, r, i, a) {
+	return b(), c("div", Be, [T(e.$slots, "default")]);
 }
-var je = /* @__PURE__ */ Y({
+var He = /* @__PURE__ */ J({
 	name: "accordion-content",
 	props: { item: {
 		type: Object,
 		default: () => ({})
 	} }
-}, [["render", Ae]]), Me = ["aria-expanded"], Ne = ["tabindex"], Pe = ["innerHTML"], Fe = ["innerHTML"], Ie = ["innerHTML"];
-function Le(e, n, r, i, a, u) {
-	let d = T("w-button"), p = T("accordion-content"), m = T("w-transition-expand");
+}, [["render", Ve]]), Ue = ["aria-expanded"], We = ["tabindex"], Ge = ["innerHTML"], Ke = ["innerHTML"], qe = ["innerHTML"];
+function Je(e, n, r, i, a, u) {
+	let d = E("w-button"), p = E("accordion-content"), m = E("w-transition-expand");
 	return b(), c("div", {
-		class: g(["w-accordion__item", u.itemClasses]),
+		class: _(["w-accordion__item", u.itemClasses]),
 		"aria-expanded": u.accordionItem._expanded ? "true" : "false"
 	}, [l("div", {
-		class: g(["w-accordion__item-title", u.titleClasses]),
+		class: _(["w-accordion__item-title", u.accordionTitleClasses]),
 		onClick: n[4] ||= (e) => !u.accordionItem._disabled && u.toggleItem(u.accordionItem, e),
-		onFocus: n[5] ||= (t) => e.$emit("focus", u.accordionItem),
-		onKeypress: n[6] ||= I((e) => !u.accordionItem._disabled && u.toggleItem(u.accordionItem, e), ["enter"]),
+		onPointerdown: n[5] ||= (...e) => u.onAccordionTitlePointerDown && u.onAccordionTitlePointerDown(...e),
+		onFocus: n[6] ||= (t) => e.$emit("focus", u.accordionItem),
+		onKeypress: n[7] ||= F((e) => !u.accordionItem._disabled && u.toggleItem(u.accordionItem, e), ["enter"]),
 		tabindex: !u.accordionItem._disabled && 0
 	}, [
 		u.options.expandIcon && !u.options.expandIconRight ? (b(), o(d, {
 			key: 0,
-			class: g(["w-accordion__expand-icon", {
+			class: _(["w-accordion__expand-icon", {
 				"w-accordion__expand-icon--expanded": u.accordionItem._expanded,
 				"w-accordion__expand-icon--rotate90": u.options.expandIconRotate90
 			}]),
@@ -1477,97 +1552,117 @@ function Le(e, n, r, i, a, u) {
 			disabled: u.accordionItem._disabled || null,
 			tabindex: -1,
 			text: "",
-			onKeypress: n[0] ||= L(() => {}, ["stop"]),
-			onClick: n[1] ||= L((e) => !u.accordionItem._disabled && u.toggleItem(u.accordionItem, e), ["stop"])
+			onKeypress: n[0] ||= I(() => {}, ["stop"]),
+			onClick: n[1] ||= I((e) => !u.accordionItem._disabled && u.toggleItem(u.accordionItem, e), ["stop"])
 		}, null, 8, [
 			"icon",
 			"icon-props",
 			"disabled",
 			"class"
 		])) : s("", !0),
-		w(e.$slots, "title", {
+		T(e.$slots, "title", {
 			item: u.getOriginalItem(u.accordionItem),
 			expanded: u.accordionItem._expanded,
 			index: u.accordionItem._index + 1
 		}, () => [l("div", {
 			class: "grow",
 			innerHTML: u.accordionItem[u.options.itemTitleKey]
-		}, null, 8, Pe)]),
+		}, null, 8, Ge)]),
 		u.options.expandIcon && u.options.expandIconRight ? (b(), o(d, {
 			key: 1,
-			class: g(["w-accordion__expand-icon", {
+			class: _(["w-accordion__expand-icon", {
 				"w-accordion__expand-icon--expanded": u.accordionItem._expanded,
 				"w-accordion__expand-icon--rotate90": u.options.expandIconRotate90
 			}]),
 			icon: u.accordionItem._expanded && u.options.collapseIcon || u.options.expandIcon,
 			text: "",
-			onKeypress: n[2] ||= L(() => {}, ["stop"]),
-			onClick: n[3] ||= L((e) => !u.accordionItem._disabled && u.toggleItem(u.accordionItem, e), ["stop"])
+			onKeypress: n[2] ||= I(() => {}, ["stop"]),
+			onClick: n[3] ||= I((e) => !u.accordionItem._disabled && u.toggleItem(u.accordionItem, e), ["stop"])
 		}, null, 8, ["icon", "class"])) : s("", !0)
-	], 42, Ne), u.options.keepInDom ? (b(), o(m, {
+	], 42, We), u.options.keepInDom ? (b(), o(m, {
 		key: 0,
 		y: "",
-		onAfterLeave: n[7] ||= (e) => u.onEndOfCollapse(u.accordionItem),
+		onAfterLeave: n[8] ||= (e) => u.onEndOfCollapse(u.accordionItem),
 		duration: u.options.duration
 	}, {
-		default: P(() => [F(f(p, {
+		default: N(() => [P(f(p, {
 			item: u.accordionItem,
-			class: g(u.contentClasses)
+			class: _(u.contentClasses)
 		}, {
-			default: P(() => [w(e.$slots, "content", {
+			default: N(() => [T(e.$slots, "content", {
 				item: u.getOriginalItem(u.accordionItem),
 				expanded: u.accordionItem._expanded,
 				index: u.accordionItem._index + 1
-			}, () => [l("div", { innerHTML: u.accordionItem[u.options.itemContentKey] }, null, 8, Fe)])]),
+			}, () => [l("div", { innerHTML: u.accordionItem[u.options.itemContentKey] }, null, 8, Ke)])]),
 			_: 3
-		}, 8, ["item", "class"]), [[N, u.accordionItem._expanded]])]),
+		}, 8, ["item", "class"]), [[ae, u.accordionItem._expanded]])]),
 		_: 3
 	}, 8, ["duration"])) : (b(), o(m, {
 		key: 1,
 		y: "",
-		onAfterLeave: n[8] ||= (e) => u.onEndOfCollapse(u.accordionItem),
+		onAfterLeave: n[9] ||= (e) => u.onEndOfCollapse(u.accordionItem),
 		duration: u.options.duration
 	}, {
-		default: P(() => [(b(), o(t, { exclude: u.options.keepAlive ? "" : "accordion-content" }, [u.accordionItem._expanded ? (b(), o(p, {
+		default: N(() => [(b(), o(t, { exclude: u.options.keepAlive ? "" : "accordion-content" }, [u.accordionItem._expanded ? (b(), o(p, {
 			key: u.accordionItem._cuid,
 			item: u.accordionItem,
-			class: g(u.contentClasses)
+			class: _(u.contentClasses)
 		}, {
-			default: P(() => [w(e.$slots, "content", {
+			default: N(() => [T(e.$slots, "content", {
 				item: u.getOriginalItem(u.accordionItem),
 				expanded: u.accordionItem._expanded,
 				index: u.accordionItem._index + 1
-			}, () => [l("div", { innerHTML: u.accordionItem[u.options.itemContentKey] }, null, 8, Ie)])]),
+			}, () => [l("div", { innerHTML: u.accordionItem[u.options.itemContentKey] }, null, 8, qe)])]),
 			_: 3
 		}, 8, ["item", "class"])) : s("", !0)], 1032, ["exclude"]))]),
 		_: 3
-	}, 8, ["duration"]))], 10, Me);
+	}, 8, ["duration"]))], 10, Ue);
 }
-var Re = /* @__PURE__ */ Y({
+var Ye = /* @__PURE__ */ J({
 	name: "w-accordion-item",
+	mixins: [Z],
 	setup() {
 		return { accordionItemUid: A() };
 	},
-	components: { AccordionContent: je },
+	components: { AccordionContent: He },
 	props: {
 		title: { type: String },
 		content: { type: String },
 		expanded: { type: Boolean },
 		disabled: { type: Boolean }
 	},
-	inject: [
-		"options",
-		"titleClasses",
-		"contentClasses",
-		"onItemToggle",
-		"onEndOfCollapse",
-		"getOriginalItem",
-		"getAccordionItem",
-		"registerItem",
-		"unregisterItem"
-	],
+	inject: {
+		options: { from: "options" },
+		titleClasses: { from: "titleClasses" },
+		contentClasses: { from: "contentClasses" },
+		onItemToggle: { from: "onItemToggle" },
+		onEndOfCollapse: { from: "onEndOfCollapse" },
+		getOriginalItem: { from: "getOriginalItem" },
+		getAccordionItem: { from: "getAccordionItem" },
+		registerItem: { from: "registerItem" },
+		unregisterItem: { from: "unregisterItem" },
+		getAccordionNoRipple: {
+			from: "getAccordionNoRipple",
+			default: () => void 0
+		}
+	},
 	emits: ["focus"],
 	computed: {
+		rippleActive() {
+			let e;
+			if (typeof this.noRipple == "boolean") e = this.noRipple;
+			else {
+				let t = this.getAccordionNoRipple?.();
+				e = typeof t == "boolean" ? t : void 0;
+			}
+			return Ne(e ? !1 : void 0, this.$waveui);
+		},
+		accordionTitleClasses() {
+			return {
+				...this.titleClasses,
+				"w-ripple": this.rippleActive
+			};
+		},
 		accordionItem: {
 			get() {
 				return this.getAccordionItem(this.accordionItemUid);
@@ -1582,9 +1677,14 @@ var Re = /* @__PURE__ */ Y({
 			};
 		}
 	},
-	methods: { toggleItem(e, t) {
-		e._expanded = !e._expanded, this.onItemToggle(e), t.target.blur(), setTimeout(() => t.target.focus(), 300);
-	} },
+	methods: {
+		onAccordionTitlePointerDown(e) {
+			this.accordionItem._disabled || e.target.closest?.(".w-accordion__expand-icon") || this.onRipple(e);
+		},
+		toggleItem(e, t) {
+			e._expanded = !e._expanded, this.onItemToggle(e), t.target.blur(), setTimeout(() => t.target.focus(), 300);
+		}
+	},
 	created() {
 		this.registerItem({
 			_cuid: this.accordionItemUid,
@@ -1598,37 +1698,37 @@ var Re = /* @__PURE__ */ Y({
 	beforeUnmount() {
 		this.unregisterItem(this.accordionItemUid);
 	}
-}, [["render", Le]]);
+}, [["render", Je]]);
 //#endregion
 //#region src/wave-ui/components/w-accordion/index.vue?vue&type=template&lang.js
-function ze(t, n, r, i, a, l) {
-	let u = T("w-accordion-item");
-	return b(), c("div", { class: g(["w-accordion", l.accordionClasses]) }, [l.accordionItemsProvided ? w(t.$slots, "default", { key: 0 }) : (r.items || []).length ? (b(!0), c(e, { key: 1 }, C(r.items.length ? r.items : t.accordionItems, (e, r) => (b(), o(u, {
+function Xe(t, n, r, i, a, l) {
+	let u = E("w-accordion-item");
+	return b(), c("div", { class: _(["w-accordion", l.accordionClasses]) }, [l.accordionItemsProvided ? T(t.$slots, "default", { key: 0 }) : (r.items || []).length ? (b(!0), c(e, { key: 1 }, w(r.items.length ? r.items : t.accordionItems, (e, r) => (b(), o(u, {
 		key: r,
-		class: g(l.itemClasses),
+		class: _(l.itemClasses),
 		title: e.title,
 		content: e.content,
 		expanded: e.expanded || e._expanded,
 		disabled: e.disabled || e._disabled,
 		onFocus: n[0] ||= (e) => t.$emit("focus", e)
 	}, {
-		title: P(({ item: e, expanded: n, index: r }) => [t.$slots[`item-title.${e.id || r}`] ? w(t.$slots, `item-title.${e.id || r}`, {
+		title: N(({ item: e, expanded: n, index: r }) => [t.$slots[`item-title.${e.id || r}`] ? T(t.$slots, `item-title.${e.id || r}`, {
 			key: 0,
 			item: e,
 			expanded: n,
 			index: r
-		}) : w(t.$slots, "item-title", {
+		}) : T(t.$slots, "item-title", {
 			key: 1,
 			item: e,
 			expanded: n,
 			index: r
 		})]),
-		content: P(({ item: e, expanded: n, index: r }) => [t.$slots[`item-content.${e.id || r}`] ? w(t.$slots, `item-content.${e.id || r}`, {
+		content: N(({ item: e, expanded: n, index: r }) => [t.$slots[`item-content.${e.id || r}`] ? T(t.$slots, `item-content.${e.id || r}`, {
 			key: 0,
 			item: e,
 			expanded: n,
 			index: r
-		}) : w(t.$slots, "item-content", {
+		}) : T(t.$slots, "item-content", {
 			key: 1,
 			item: e,
 			expanded: n,
@@ -1643,8 +1743,9 @@ function ze(t, n, r, i, a, l) {
 		"disabled"
 	]))), 128)) : s("", !0)], 2);
 }
-var Be = /* @__PURE__ */ Y({
+var Ze = /* @__PURE__ */ J({
 	name: "w-accordion",
+	mixins: [Z],
 	props: {
 		modelValue: { type: Array },
 		color: { type: String },
@@ -1705,7 +1806,7 @@ var Be = /* @__PURE__ */ Y({
 			default: !1
 		}
 	},
-	components: { WAccordionItem: Re },
+	components: { WAccordionItem: Ye },
 	emits: [
 		"input",
 		"update:modelValue",
@@ -1723,7 +1824,8 @@ var Be = /* @__PURE__ */ Y({
 			options: this.$props,
 			registerItem: this.registerItem,
 			unregisterItem: this.unregisterItem,
-			getAccordionItem: this.getAccordionItem
+			getAccordionItem: this.getAccordionItem,
+			getAccordionNoRipple: () => this.noRipple
 		};
 	},
 	data: () => ({ accordionItems: [] }),
@@ -1747,13 +1849,13 @@ var Be = /* @__PURE__ */ Y({
 			};
 		},
 		itemClasses() {
-			return Z(this.itemClass);
+			return X(this.itemClass);
 		},
 		titleClasses() {
-			return Z(this.titleClass);
+			return X(this.titleClass);
 		},
 		contentClasses() {
-			return Z(this.contentClass);
+			return X(this.contentClass);
 		}
 	},
 	methods: {
@@ -1798,21 +1900,21 @@ var Be = /* @__PURE__ */ Y({
 		}
 		e.forEach((e, t) => (this.accordionItems[t] || {})._expanded = e);
 	} }
-}, [["render", ze]]), Ve = { class: "w-alert__content" };
-function He(t, n, r, i, a, u) {
-	let f = T("w-icon"), p = T("w-button");
+}, [["render", Xe]]), Qe = { class: "w-alert__content" };
+function $e(t, n, r, i, a, u) {
+	let f = E("w-icon"), p = E("w-button");
 	return a.show ? (b(), c("div", {
 		key: 0,
-		class: g(["w-alert", u.classes])
+		class: _(["w-alert", u.classes])
 	}, [u.type || r.icon || r.dismiss ? (b(), c(e, { key: 0 }, [
 		u.type || r.icon ? (b(), o(f, {
 			key: 0,
 			class: "w-alert__icon"
 		}, {
-			default: P(() => [d(O(u.type ? u.typeIcon : r.icon), 1)]),
+			default: N(() => [d(O(u.type ? u.typeIcon : r.icon), 1)]),
 			_: 1
 		})) : s("", !0),
-		l("div", Ve, [w(t.$slots, "default")]),
+		l("div", Qe, [T(t.$slots, "default")]),
 		r.dismiss ? (b(), o(p, {
 			key: 1,
 			class: "w-alert__dismiss",
@@ -1824,9 +1926,9 @@ function He(t, n, r, i, a, u) {
 			sm: "",
 			text: ""
 		})) : s("", !0)
-	], 64)) : w(t.$slots, "default", { key: 1 })], 2)) : s("", !0);
+	], 64)) : T(t.$slots, "default", { key: 1 })], 2)) : s("", !0);
 }
-var Ue = /* @__PURE__ */ Y({
+var et = /* @__PURE__ */ J({
 	name: "w-alert",
 	props: {
 		modelValue: { default: !0 },
@@ -1904,19 +2006,19 @@ var Ue = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		this.show = e;
 	} }
-}, [["render", He]]), We = { class: "w-autocomplete__selection" }, Ge = ["innerHTML"], Ke = ["innerHTML"], qe = ["value"], Je = ["onClick"], Ye = ["innerHTML"], Xe = ["innerHTML"];
-function Ze(t, n, r, i, a, o) {
-	let u = T("w-button"), d = T("w-transition-slide-fade");
+}, [["render", $e]]), tt = { class: "w-autocomplete__selection" }, nt = ["innerHTML"], rt = ["innerHTML"], it = ["value"], at = ["onClick"], ot = ["innerHTML"], st = ["innerHTML"];
+function ct(t, n, r, i, a, o) {
+	let u = E("w-button"), d = E("w-transition-slide-fade");
 	return b(), c("div", {
-		class: g(["w-autocomplete", o.classes]),
+		class: _(["w-autocomplete", o.classes]),
 		onClick: n[5] ||= (...e) => o.onClick && o.onClick(...e),
-		style: v(t.$attrs.style)
+		style: y(t.$attrs.style)
 	}, [
-		t.selection.length ? (b(!0), c(e, { key: 0 }, C(t.selection, (e, n) => (b(), c("div", We, [w(t.$slots, "selection", {
+		t.selection.length ? (b(!0), c(e, { key: 0 }, w(t.selection, (e, n) => (b(), c("div", tt, [T(t.$slots, "selection", {
 			item: e,
 			unselect: (e) => o.unselectItem(e)
-		}, () => [l("span", { innerHTML: e[r.itemLabelKey] }, null, 8, Ge), f(u, {
-			onClick: L((e) => o.unselectItem(n), ["stop"]),
+		}, () => [l("span", { innerHTML: e[r.itemLabelKey] }, null, 8, nt), f(u, {
+			onClick: I((e) => o.unselectItem(n), ["stop"]),
 			icon: "wi-cross",
 			xs: "",
 			text: "",
@@ -1926,14 +2028,14 @@ function Ze(t, n, r, i, a, o) {
 			key: 1,
 			class: "w-autocomplete__placeholder",
 			innerHTML: r.placeholder
-		}, null, 8, Ke)) : s("", !0),
+		}, null, 8, rt)) : s("", !0),
 		l("input", h({
 			class: "w-autocomplete__input",
 			ref: "input",
 			value: t.keywords
-		}, k(o.inputEventListeners, !0), o.inputAttrs), null, 16, qe),
+		}, k(o.inputEventListeners, !0), o.inputAttrs), null, 16, it),
 		f(d, null, {
-			default: P(() => [t.menuOpen ? (b(), c("ul", {
+			default: N(() => [t.menuOpen ? (b(), c("ul", {
 				key: 0,
 				class: "w-autocomplete__menu",
 				ref: "menu",
@@ -1942,32 +2044,32 @@ function Ze(t, n, r, i, a, o) {
 				onTouchstart: n[3] ||= (e) => t.menuIsBeingClicked = !0,
 				onTouchend: n[4] ||= (...e) => o.setEndOfMenuClick && o.setEndOfMenuClick(...e)
 			}, [
-				(b(!0), c(e, null, C(o.filteredItems, (e, n) => (b(), c("li", {
+				(b(!0), c(e, null, w(o.filteredItems, (e, n) => (b(), c("li", {
 					key: n,
-					onClick: L((n) => (o.selectItem(e), t.$emit("item-click", e)), ["stop"]),
-					class: g({ highlighted: t.highlightedItem === e.uid })
-				}, [w(t.$slots, "item", {
+					onClick: I((n) => (o.selectItem(e), t.$emit("item-click", e)), ["stop"]),
+					class: _({ highlighted: t.highlightedItem === e.uid })
+				}, [T(t.$slots, "item", {
 					item: e,
 					highlighted: t.highlightedItem === e.uid
-				}, () => [l("span", { innerHTML: e[r.itemLabelKey] }, null, 8, Ye)])], 10, Je))), 128)),
+				}, () => [l("span", { innerHTML: e[r.itemLabelKey] }, null, 8, ot)])], 10, at))), 128)),
 				o.filteredItems.length ? s("", !0) : (b(), c("li", {
 					key: 0,
-					class: g(["w-autocomplete__no-match", { "w-autocomplete__no-match--default": !t.$slots.noMatch }])
-				}, [w(t.$slots, "no-match", {}, () => [l("div", {
+					class: _(["w-autocomplete__no-match", { "w-autocomplete__no-match--default": !t.$slots.noMatch }])
+				}, [T(t.$slots, "no-match", {}, () => [l("div", {
 					class: "caption",
 					innerHTML: r.noMatch ?? "No match."
-				}, null, 8, Xe)])], 2)),
+				}, null, 8, st)])], 2)),
 				t.$slots["extra-item"] ? (b(), c("li", {
 					key: 1,
-					class: g(["w-autocomplete__extra-item", { highlighted: t.highlightedItem === "extra-item" }]),
+					class: _(["w-autocomplete__extra-item", { highlighted: t.highlightedItem === "extra-item" }]),
 					onClick: n[0] ||= (...e) => o.selectExtraItem && o.selectExtraItem(...e)
-				}, [w(t.$slots, "extra-item")], 2)) : s("", !0)
+				}, [T(t.$slots, "extra-item")], 2)) : s("", !0)
 			], 544)) : s("", !0)]),
 			_: 3
 		})
 	], 6);
 }
-var Qe = /* @__PURE__ */ Y({
+var lt = /* @__PURE__ */ J({
 	name: "w-autocomplete",
 	inheritAttrs: !1,
 	props: {
@@ -2146,11 +2248,11 @@ var Qe = /* @__PURE__ */ Y({
 			this.selection.push(this.optimizedItemsForSearch.find((t) => t[this.itemValueKey] === +e));
 		});
 	} }
-}, [["render", Ze]]), $e = { class: "w-app" };
-function et(e, t, n, r, i, a) {
-	return b(), c("div", $e, [w(e.$slots, "default")]);
+}, [["render", ct]]), ut = { class: "w-app" };
+function dt(e, t, n, r, i, a) {
+	return b(), c("div", ut, [T(e.$slots, "default")]);
 }
-var tt = /* @__PURE__ */ Y({
+var ft = /* @__PURE__ */ J({
 	name: "w-app",
 	props: {
 		block: { type: Boolean },
@@ -2165,22 +2267,22 @@ var tt = /* @__PURE__ */ Y({
 		textCenter: { type: Boolean },
 		textRight: { type: Boolean }
 	}
-}, [["render", et]]), nt = { class: "w-badge-wrap" };
-function rt(e, t, n, i, a, o) {
-	return b(), c("div", nt, [w(e.$slots, "default"), f(r, { name: `${n.transition}` }, {
-		default: P(() => [n.modelValue ? (b(), c("div", {
+}, [["render", dt]]), pt = { class: "w-badge-wrap" };
+function mt(e, t, n, i, a, o) {
+	return b(), c("div", pt, [T(e.$slots, "default"), f(r, { name: `${n.transition}` }, {
+		default: N(() => [n.modelValue ? (b(), c("div", {
 			key: 0,
-			class: g(["w-badge", o.classes]),
-			style: v(o.styles),
+			class: _(["w-badge", o.classes]),
+			style: y(o.styles),
 			"aria-atomic": "true",
 			"aria-label": "Badge",
 			"aria-live": "polite",
 			role: "status"
-		}, [n.dot ? s("", !0) : w(e.$slots, "badge", { key: 0 }, () => [d(O(n.modelValue === !0 ? "" : n.modelValue || ""), 1)])], 6)) : s("", !0)]),
+		}, [n.dot ? s("", !0) : T(e.$slots, "badge", { key: 0 }, () => [d(O(n.modelValue === !0 ? "" : n.modelValue || ""), 1)])], 6)) : s("", !0)]),
 		_: 3
 	}, 8, ["name"])]);
 }
-var it = /* @__PURE__ */ Y({
+var ht = /* @__PURE__ */ J({
 	name: "w-badge",
 	props: {
 		modelValue: { default: !0 },
@@ -2246,46 +2348,50 @@ var it = /* @__PURE__ */ Y({
 			return this.forcedSize && `font-size: ${this.forcedSize}`;
 		}
 	}
-}, [["render", rt]]), at = ["innerHTML"];
-function ot(t, n, r, i, a, l) {
-	let u = T("w-icon");
-	return b(), c("div", { class: g(["w-breadcrumbs", l.classes]) }, [(b(!0), c(e, null, C(r.items, (n, i) => (b(), c(e, null, [i && t.$slots.separator ? (b(), c("span", {
-		class: g(["w-breadcrumbs__separator", r.separatorColor]),
+}, [["render", mt]]), gt = ["innerHTML"];
+function _t(t, n, r, i, a, l) {
+	let u = E("w-icon");
+	return b(), c("div", { class: _(["w-breadcrumbs", l.classes]) }, [(b(!0), c(e, null, w(r.items, (n, i) => (b(), c(e, null, [i && t.$slots.separator ? (b(), c("span", {
+		class: _(["w-breadcrumbs__separator", r.separatorColor]),
 		key: `${i}a`
-	}, [w(t.$slots, "separator", { index: i })], 2)) : i ? (b(), o(u, {
-		class: g(["w-breadcrumbs__separator", r.separatorColor]),
+	}, [T(t.$slots, "separator", { index: i })], 2)) : i ? (b(), o(u, {
+		class: _(["w-breadcrumbs__separator", r.separatorColor]),
 		key: `${i}b`
 	}, {
-		default: P(() => [d(O(r.icon), 1)]),
+		default: N(() => [d(O(r.icon), 1)]),
 		_: 1
 	}, 8, ["class"])) : s("", !0), n[r.itemRouteKey] && (i < r.items.length - 1 || r.linkLastItem) ? (b(), c(e, { key: 2 }, [t.$slots.item ? (b(), o(D(l.hasRouter ? "router-link" : "a"), {
-		class: g(["w-breadcrumbs__item", r.color || null]),
+		class: _(["w-breadcrumbs__item", l.breadcrumbLinkClasses]),
 		key: `${i}c`,
 		to: l.hasRouter && n[r.itemRouteKey],
-		href: n[r.itemRouteKey]
+		href: n[r.itemRouteKey],
+		onPointerdown: t.onRipple
 	}, {
-		default: P(() => [w(t.$slots, "item", {
+		default: N(() => [T(t.$slots, "item", {
 			item: n,
 			index: i + 1,
 			isLast: i === r.items.length - 1
 		})]),
 		_: 2
-	}, 1032, [
+	}, 1064, [
 		"to",
 		"href",
-		"class"
+		"class",
+		"onPointerdown"
 	])) : (b(), o(D(l.hasRouter ? "router-link" : "a"), {
-		class: g(["w-breadcrumbs__item", r.color || null]),
+		class: _(["w-breadcrumbs__item", l.breadcrumbLinkClasses]),
 		key: `${i}d`,
 		to: l.hasRouter && n[r.itemRouteKey],
 		href: n[r.itemRouteKey],
-		innerHTML: n[r.itemLabelKey]
-	}, null, 8, [
+		innerHTML: n[r.itemLabelKey],
+		onPointerdown: t.onRipple
+	}, null, 40, [
 		"to",
 		"href",
 		"innerHTML",
-		"class"
-	]))], 64)) : t.$slots.item ? w(t.$slots, "item", {
+		"class",
+		"onPointerdown"
+	]))], 64)) : t.$slots.item ? T(t.$slots, "item", {
 		key: `${i}e`,
 		item: n,
 		index: i + 1,
@@ -2293,10 +2399,11 @@ function ot(t, n, r, i, a, l) {
 	}) : (b(), c("span", {
 		key: `${i}f`,
 		innerHTML: n[r.itemLabelKey]
-	}, null, 8, at))], 64))), 256))], 2);
+	}, null, 8, gt))], 64))), 256))], 2);
 }
-var st = /* @__PURE__ */ Y({
+var vt = /* @__PURE__ */ J({
 	name: "w-breadcrumbs",
+	mixins: [Z],
 	props: {
 		items: {
 			type: Array,
@@ -2328,6 +2435,9 @@ var st = /* @__PURE__ */ Y({
 	},
 	emits: [],
 	computed: {
+		breadcrumbLinkClasses() {
+			return [this.color || null, { "w-ripple": this.rippleActive }];
+		},
 		hasRouter() {
 			return "$router" in this;
 		},
@@ -2338,23 +2448,26 @@ var st = /* @__PURE__ */ Y({
 			return { [`size--${this.size}`]: !0 };
 		}
 	}
-}, [["render", ot]]), ct = {
+}, [["render", _t]]), yt = {
 	key: 0,
 	class: "w-button__loader"
 };
-function lt(e, t, n, i, a, u) {
-	let p = T("w-icon");
+function bt(e, t, n, i, a, u) {
+	let p = E("w-icon");
 	return b(), o(D(!n.disabled && n.route ? "a" : "button"), h({
 		class: ["w-button", u.classes],
 		type: !n.route && n.type,
 		href: !n.disabled && n.route && (u.externalLink ? n.route : u.resolvedRoute) || null,
 		disabled: !!n.disabled || null
-	}, u.attrs, { style: u.styles }), {
-		default: P(() => [n.icon ? (b(), o(p, _(h({ key: 0 }, n.iconProps || {})), {
-			default: P(() => [d(O(n.icon), 1)]),
+	}, u.attrs, {
+		style: u.styles,
+		onPointerdown: u.onPointerDownRipple
+	}), {
+		default: N(() => [n.icon ? (b(), o(p, v(h({ key: 0 }, n.iconProps || {})), {
+			default: N(() => [d(O(n.icon), 1)]),
 			_: 1
-		}, 16)) : w(e.$slots, "default", { key: 1 }), f(r, { name: "scale-fade" }, {
-			default: P(() => [n.loading ? (b(), c("div", ct, [w(e.$slots, "loading", {}, () => [t[0] ||= l("svg", { viewBox: "0 0 40 40" }, [l("circle", {
+		}, 16)) : T(e.$slots, "default", { key: 1 }), f(r, { name: "scale-fade" }, {
+			default: N(() => [n.loading ? (b(), c("div", yt, [T(e.$slots, "loading", {}, () => [t[0] ||= l("svg", { viewBox: "0 0 40 40" }, [l("circle", {
 				cx: "20",
 				cy: "20",
 				r: "18",
@@ -2371,11 +2484,13 @@ function lt(e, t, n, i, a, u) {
 		"href",
 		"class",
 		"disabled",
-		"style"
+		"style",
+		"onPointerdown"
 	]);
 }
-var ut = /* @__PURE__ */ Y({
+var xt = /* @__PURE__ */ J({
 	inheritAttrs: !1,
+	mixins: [Z],
 	props: {
 		color: { type: String },
 		bgColor: { type: String },
@@ -2418,6 +2533,9 @@ var ut = /* @__PURE__ */ Y({
 		xl: { type: Boolean }
 	},
 	emits: [],
+	methods: { onPointerDownRipple(e) {
+		this.disabled || this.loading || !this.rippleActive || this.onRipple(e);
+	} },
 	computed: {
 		hasRouter() {
 			return "$router" in this;
@@ -2445,6 +2563,7 @@ var ut = /* @__PURE__ */ Y({
 		},
 		classes() {
 			return {
+				"w-ripple": this.rippleActive,
 				"primary--bg": !this.bgColor && !this.color && !(this.outline || this.text),
 				primary: !this.bgColor && !this.color && !this.dark && (this.outline || this.text),
 				[this.color]: this.color,
@@ -2472,23 +2591,23 @@ var ut = /* @__PURE__ */ Y({
 			};
 		}
 	}
-}, [["render", lt]]), dt = ["innerHTML"];
-function ft(e, t, n, r, i, a) {
-	let s = T("button-partial");
-	return n.tooltip ? (b(), o(D("w-tooltip"), _(h({ key: 0 }, n.tooltipProps)), {
-		activator: P(({ on: t }) => [f(s, h(a.buttonProps, k(t)), {
-			default: P(() => [w(e.$slots, "default")]),
+}, [["render", bt]]), St = ["innerHTML"];
+function Ct(e, t, n, r, i, a) {
+	let s = E("button-partial");
+	return n.tooltip ? (b(), o(D("w-tooltip"), v(h({ key: 0 }, n.tooltipProps)), {
+		activator: N(({ on: t }) => [f(s, h(a.buttonProps, k(t)), {
+			default: N(() => [T(e.$slots, "default")]),
 			_: 3
 		}, 16)]),
-		default: P(() => [l("div", { innerHTML: n.tooltip }, null, 8, dt)]),
+		default: N(() => [l("div", { innerHTML: n.tooltip }, null, 8, St)]),
 		_: 3
-	}, 16)) : (b(), o(s, _(h({ key: 1 }, a.buttonProps)), {
-		loading: P(() => [w(e.$slots, "loading")]),
-		default: P(() => [w(e.$slots, "default")]),
+	}, 16)) : (b(), o(s, v(h({ key: 1 }, a.buttonProps)), {
+		loading: N(() => [T(e.$slots, "loading")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16));
 }
-var pt = /* @__PURE__ */ Y({
+var wt = /* @__PURE__ */ J({
 	name: "w-button",
 	inheritAttrs: !1,
 	props: {
@@ -2534,9 +2653,13 @@ var pt = /* @__PURE__ */ Y({
 		sm: { type: Boolean },
 		md: { type: Boolean },
 		lg: { type: Boolean },
-		xl: { type: Boolean }
+		xl: { type: Boolean },
+		noRipple: {
+			type: Boolean,
+			default: void 0
+		}
 	},
-	components: { ButtonPartial: ut },
+	components: { ButtonPartial: xt },
 	emits: [],
 	computed: { buttonProps() {
 		let { tooltip: e, tooltipProps: t = {}, ...n } = this.$props;
@@ -2545,40 +2668,40 @@ var pt = /* @__PURE__ */ Y({
 			...this.$attrs
 		};
 	} }
-}, [["render", ft]]), mt = ["innerHTML"];
-function ht(e, t, n, r, i, a) {
-	let u = T("w-image");
-	return b(), c("div", { class: g(["w-card", a.classes]) }, [
+}, [["render", Ct]]), Tt = ["innerHTML"];
+function Et(e, t, n, r, i, a) {
+	let u = E("w-image");
+	return b(), c("div", { class: _(["w-card", a.classes]) }, [
 		e.$slots.title ? (b(), c("div", {
 			key: 0,
-			class: g(["w-card__title", {
+			class: _(["w-card__title", {
 				"w-card__title--has-toolbar": e.$slots.title && a.titleHasToolbar,
 				...a.titleClasses
 			}])
-		}, [w(e.$slots, "title")], 2)) : n.title ? (b(), c("div", {
+		}, [T(e.$slots, "title")], 2)) : n.title ? (b(), c("div", {
 			key: 1,
-			class: g(["w-card__title", {
+			class: _(["w-card__title", {
 				"w-card__title--has-toolbar": e.$slots.title && a.titleHasToolbar,
 				...a.titleClasses
 			}]),
 			innerHTML: n.title
-		}, null, 10, mt)) : s("", !0),
+		}, null, 10, Tt)) : s("", !0),
 		n.image ? (b(), o(u, h({
 			key: 2,
 			class: "w-card__image",
 			src: n.image
 		}, a.imgProps), {
-			default: P(() => [w(e.$slots, "image-content")]),
+			default: N(() => [T(e.$slots, "image-content")]),
 			_: 3
 		}, 16, ["src"])) : s("", !0),
-		l("div", { class: g(["w-card__content", a.contentClasses]) }, [w(e.$slots, "default")], 2),
+		l("div", { class: _(["w-card__content", a.contentClasses]) }, [T(e.$slots, "default")], 2),
 		e.$slots.actions ? (b(), c("div", {
 			key: 3,
-			class: g(["w-card__actions", { "w-card__actions--has-toolbar": a.actionsHasToolbar }])
-		}, [w(e.$slots, "actions")], 2)) : s("", !0)
+			class: _(["w-card__actions", { "w-card__actions--has-toolbar": a.actionsHasToolbar }])
+		}, [T(e.$slots, "actions")], 2)) : s("", !0)
 	], 2);
 }
-var gt = /* @__PURE__ */ Y({
+var Dt = /* @__PURE__ */ J({
 	name: "w-card",
 	props: {
 		color: { type: String },
@@ -2605,10 +2728,10 @@ var gt = /* @__PURE__ */ Y({
 	emits: [],
 	computed: {
 		titleClasses() {
-			return Z(this.titleClass);
+			return X(this.titleClass);
 		},
 		contentClasses() {
-			return Z(this.contentClass);
+			return X(this.contentClass);
 		},
 		titleHasToolbar() {
 			let { title: e } = this.$slots;
@@ -2637,7 +2760,13 @@ var gt = /* @__PURE__ */ Y({
 			};
 		}
 	}
-}, [["render", ht]]), Q = {
+}, [["render", Et]]);
+//#endregion
+//#region src/wave-ui/mixins/form-elements.js
+function Q() {
+	return { waveUiUseId: A() };
+}
+var $ = {
 	inject: {
 		formRegister: { default: null },
 		formProps: { default: () => ({
@@ -2645,9 +2774,6 @@ var gt = /* @__PURE__ */ Y({
 			readonly: !1
 		}) }
 	},
-	setup() {
-		return { waveUiUseId: A() };
-	},
 	props: {
 		id: { type: String },
 		name: { type: String },
@@ -2686,7 +2812,7 @@ var gt = /* @__PURE__ */ Y({
 	methods: { validate() {
 		this.$refs.formEl.validate(this);
 	} }
-}, _t = [
+}, Ot = [
 	"id",
 	"name",
 	"checked",
@@ -2694,8 +2820,8 @@ var gt = /* @__PURE__ */ Y({
 	"required",
 	"tabindex",
 	"aria-checked"
-], vt = ["for"], yt = ["for", "innerHTML"], bt = ["for"], xt = ["for", "innerHTML"];
-function St(t, n, r, i, a, u) {
+], kt = ["for"], At = ["for", "innerHTML"], jt = ["for"], Mt = ["for", "innerHTML"];
+function Nt(t, n, r, i, a, u) {
 	return b(), o(D(t.formRegister && !u.wCheckboxes ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: a.isChecked,
@@ -2710,7 +2836,7 @@ function St(t, n, r, i, a, u) {
 		},
 		class: u.classes
 	}), {
-		default: P(() => [
+		default: N(() => [
 			l("input", {
 				ref: "input",
 				id: t.inputId,
@@ -2723,43 +2849,46 @@ function St(t, n, r, i, a, u) {
 				onFocus: n[0] ||= (e) => t.$emit("focus", e),
 				onBlur: n[1] ||= (e) => t.$emit("blur", e),
 				onChange: n[2] ||= (e) => u.onInput(),
-				onKeypress: n[3] ||= I((...e) => u.onInput && u.onInput(...e), ["enter"]),
+				onKeypress: n[3] ||= F((...e) => u.onInput && u.onInput(...e), ["enter"]),
 				"aria-checked": a.isChecked || "false",
 				role: "checkbox"
-			}, null, 40, _t),
+			}, null, 40, Ot),
 			u.hasLabel && r.labelOnLeft ? (b(), c(e, { key: 0 }, [t.$slots.default ? (b(), c("label", {
 				key: 0,
-				class: g(["w-checkbox__label w-form-el-shakable pr2", t.labelClasses]),
+				class: _(["w-checkbox__label w-form-el-shakable pr2", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, vt)) : r.label ? (b(), c("label", {
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, kt)) : r.label ? (b(), c("label", {
 				key: 1,
-				class: g(["w-checkbox__label w-form-el-shakable pr2", t.labelClasses]),
+				class: _(["w-checkbox__label w-form-el-shakable pr2", t.labelClasses]),
 				for: t.inputId,
 				innerHTML: r.label
-			}, null, 10, yt)) : s("", !0)], 64)) : s("", !0),
+			}, null, 10, At)) : s("", !0)], 64)) : s("", !0),
 			l("div", {
-				class: g(["w-checkbox__input", this.color]),
+				class: _(["w-checkbox__input", this.color]),
 				onClick: n[4] ||= (e) => {
 					t.$refs.input.focus(), t.$refs.input.click();
 				}
 			}, [...n[7] ||= [l("svg", { viewBox: "-0.5 0 12 10" }, [l("polyline", { points: "1 5 4 8 10 2" })], -1)]], 2),
 			u.hasLabel && !r.labelOnLeft ? (b(), c(e, { key: 1 }, [t.$slots.default ? (b(), c("label", {
 				key: 0,
-				class: g(["w-checkbox__label w-form-el-shakable pl2", t.labelClasses]),
+				class: _(["w-checkbox__label w-form-el-shakable pl2", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, bt)) : r.label ? (b(), c("label", {
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, jt)) : r.label ? (b(), c("label", {
 				key: 1,
-				class: g(["w-checkbox__label w-form-el-shakable pl2", t.labelClasses]),
+				class: _(["w-checkbox__label w-form-el-shakable pl2", t.labelClasses]),
 				for: t.inputId,
 				innerHTML: r.label
-			}, null, 10, xt)) : s("", !0)], 64)) : s("", !0)
+			}, null, 10, Mt)) : s("", !0)], 64)) : s("", !0)
 		]),
 		_: 3
 	}, 16, ["valid", "class"]);
 }
-var Ct = /* @__PURE__ */ Y({
+var Pt = /* @__PURE__ */ J({
 	name: "w-checkbox",
-	mixins: [Q],
+	mixins: [$],
+	setup() {
+		return Q();
+	},
 	inject: { wCheckboxes: { default: null } },
 	props: {
 		modelValue: { default: !1 },
@@ -2824,9 +2953,9 @@ var Ct = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		this.isChecked = e;
 	} }
-}, [["render", St]]), wt = ["innerHTML"];
-function Tt(t, n, r, i, a, l) {
-	let u = T("w-checkbox");
+}, [["render", Nt]]), Ft = ["innerHTML"];
+function It(t, n, r, i, a, l) {
+	let u = E("w-checkbox");
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: l.checkboxItems.some((e) => e._isChecked),
@@ -2840,7 +2969,7 @@ function Tt(t, n, r, i, a, l) {
 		wrap: r.inline,
 		class: l.classes
 	}), {
-		default: P(() => [(b(!0), c(e, null, C(l.checkboxItems, (e, i) => (b(), o(u, h({
+		default: N(() => [(b(!0), c(e, null, w(l.checkboxItems, (e, i) => (b(), o(u, h({
 			key: i,
 			"model-value": e._isChecked,
 			"onUpdate:modelValue": (t) => l.toggleCheck(e, t),
@@ -2857,7 +2986,7 @@ function Tt(t, n, r, i, a, l) {
 			readonly: t.isReadonly || null,
 			class: { mt1: !r.inline && i }
 		}), {
-			default: P(() => [t.$slots[`item.${i + 1}`] || t.$slots.item ? w(t.$slots, t.$slots[`item.${i + 1}`] ? `item.${i + 1}` : "item", {
+			default: N(() => [t.$slots[`item.${i + 1}`] || t.$slots.item ? T(t.$slots, t.$slots[`item.${i + 1}`] ? `item.${i + 1}` : "item", {
 				key: 0,
 				item: l.getOriginalItem(e),
 				checked: !!e._isChecked,
@@ -2866,7 +2995,7 @@ function Tt(t, n, r, i, a, l) {
 			}) : e.label ? (b(), c("div", {
 				key: 1,
 				innerHTML: e.label
-			}, null, 8, wt)) : s("", !0)]),
+			}, null, 8, Ft)) : s("", !0)]),
 			_: 2
 		}, 1040, [
 			"model-value",
@@ -2885,9 +3014,12 @@ function Tt(t, n, r, i, a, l) {
 		"class"
 	]);
 }
-var Et = /* @__PURE__ */ Y({
+var Lt = /* @__PURE__ */ J({
 	name: "w-checkboxes",
-	mixins: [Q],
+	mixins: [$],
+	setup() {
+		return Q();
+	},
 	props: {
 		items: {
 			type: Array,
@@ -2958,42 +3090,42 @@ var Et = /* @__PURE__ */ Y({
 			return this.items[e._index];
 		}
 	}
-}, [["render", Tt]]);
+}, [["render", It]]);
 //#endregion
 //#region src/wave-ui/components/w-confirm.vue?vue&type=template&lang.js
-function Dt(e, t, n, r, i, a) {
-	let c = T("w-button"), u = T("w-flex"), p = T("w-menu"), m = E("focus");
+function Rt(e, t, n, r, i, a) {
+	let c = E("w-button"), u = E("w-flex"), p = E("w-menu"), m = ne("focus");
 	return b(), o(p, h({
 		modelValue: e.showPopup,
 		"onUpdate:modelValue": t[2] ||= (t) => e.showPopup = t
 	}, a.wMenuProps), {
-		activator: P(({ on: t }) => [f(c, h({ class: "w-confirm" }, {
+		activator: N(({ on: t }) => [f(c, h({ class: "w-confirm" }, {
 			...e.$attrs,
 			...a.buttonProps
 		}, k(n.disablePrompt ? {} : { ...t })), {
-			default: P(() => [w(e.$slots, "default")]),
+			default: N(() => [T(e.$slots, "default")]),
 			_: 3
 		}, 16)]),
-		default: P(() => [f(u, {
+		default: N(() => [f(u, {
 			column: !n.inline,
 			"align-center": ""
 		}, {
-			default: P(() => [l("div", null, [w(e.$slots, "question", {}, () => [d(O(n.question), 1)])]), l("div", { class: g(["w-flex justify-end", n.inline ? "ml2" : "mt2"]) }, [n.cancel === !1 ? s("", !0) : (b(), o(c, h({
+			default: N(() => [l("div", null, [T(e.$slots, "question", {}, () => [d(O(n.question), 1)])]), l("div", { class: _(["w-flex justify-end", n.inline ? "ml2" : "mt2"]) }, [n.cancel === !1 ? s("", !0) : (b(), o(c, h({
 				key: 0,
 				class: "mr2"
 			}, a.cancelButtonProps, {
 				"bg-color": (a.cancelButton || {}).bgColor || "error",
-				onKeyup: t[0] ||= I((e) => !n.persistent && a.onCancel(), ["escape"]),
+				onKeyup: t[0] ||= F((e) => !n.persistent && a.onCancel(), ["escape"]),
 				onClick: a.onCancel
 			}), {
-				default: P(() => [w(e.$slots, "cancel", {}, () => [d(O(a.cancelButton.label), 1)])]),
+				default: N(() => [T(e.$slots, "cancel", {}, () => [d(O(a.cancelButton.label), 1)])]),
 				_: 3
-			}, 16, ["bg-color", "onClick"])), F((b(), o(c, h(a.confirmButtonProps, {
+			}, 16, ["bg-color", "onClick"])), P((b(), o(c, h(a.confirmButtonProps, {
 				"bg-color": (a.confirmButton || {}).bgColor || "success",
-				onKeyup: t[1] ||= I((e) => !n.persistent && a.onCancel(), ["escape"]),
+				onKeyup: t[1] ||= F((e) => !n.persistent && a.onCancel(), ["escape"]),
 				onClick: a.onConfirm
 			}), {
-				default: P(() => [w(e.$slots, "confirm", {}, () => [d(O(a.confirmButton.label), 1)])]),
+				default: N(() => [T(e.$slots, "confirm", {}, () => [d(O(a.confirmButton.label), 1)])]),
 				_: 3
 			}, 16, ["bg-color", "onClick"])), [[m]])], 2)]),
 			_: 3
@@ -3001,7 +3133,7 @@ function Dt(e, t, n, r, i, a) {
 		_: 3
 	}, 16, ["modelValue"]);
 }
-var Ot = /* @__PURE__ */ Y({
+var zt = /* @__PURE__ */ J({
 	name: "w-confirm",
 	inheritAttrs: !1,
 	props: {
@@ -3127,16 +3259,16 @@ var Ot = /* @__PURE__ */ Y({
 			this.$emit("confirm"), this.showPopup = !1;
 		}
 	}
-}, [["render", Dt]]);
+}, [["render", Rt]]);
 //#endregion
 //#region src/wave-ui/components/w-date-picker.vue?vue&type=template&lang.js
-function kt(e, t, n, r, i, a) {
+function Bt(e, t, n, r, i, a) {
 	return b(), c("div", {
-		class: g(["w-date-picker", a.classes]),
-		style: v(a.styles)
-	}, [w(e.$slots, "default")], 6);
+		class: _(["w-date-picker", a.classes]),
+		style: y(a.styles)
+	}, [T(e.$slots, "default")], 6);
 }
-var At = /* @__PURE__ */ Y({
+var Vt = /* @__PURE__ */ J({
 	name: "w-date-picker",
 	props: {
 		dark: { type: Boolean },
@@ -3154,13 +3286,13 @@ var At = /* @__PURE__ */ Y({
 			return !1;
 		}
 	}
-}, [["render", kt]]);
+}, [["render", Bt]]);
 //#endregion
 //#region src/wave-ui/components/w-dialog.vue?vue&type=template&lang.js
-function jt(e, t, n, i, a, s) {
-	let c = T("w-card"), l = T("w-overlay");
+function Ht(e, t, n, i, a, s) {
+	let c = E("w-card"), l = E("w-overlay");
 	return b(), o(l, {
-		class: g(["w-dialog", s.classes]),
+		class: _(["w-dialog", s.classes]),
 		"model-value": a.showWrapper,
 		persistent: n.persistent,
 		"persistent-no-animation": n.persistentNoAnimation,
@@ -3169,13 +3301,13 @@ function jt(e, t, n, i, a, s) {
 		"bg-color": n.overlayColor,
 		opacity: n.overlayOpacity
 	}, {
-		default: P(() => [f(r, {
+		default: N(() => [f(r, {
 			name: n.transition,
 			appear: "",
 			onAfterLeave: s.onBeforeClose
 		}, {
-			default: P(() => [F(f(c, {
-				class: g(["w-dialog__content", n.dialogClass]),
+			default: N(() => [P(f(c, {
+				class: _(["w-dialog__content", n.dialogClass]),
 				ref: "dialog",
 				"no-border": "",
 				color: n.color,
@@ -3183,17 +3315,17 @@ function jt(e, t, n, i, a, s) {
 				"title-class": n.titleClass,
 				"content-class": n.contentClass,
 				title: n.title || void 0,
-				style: v(s.contentStyles)
+				style: y(s.contentStyles)
 			}, u({
-				default: P(() => [w(e.$slots, "default")]),
+				default: N(() => [T(e.$slots, "default")]),
 				_: 2
 			}, [e.$slots.title ? {
 				name: "title",
-				fn: P(() => [w(e.$slots, "title")]),
+				fn: N(() => [T(e.$slots, "title")]),
 				key: "0"
 			} : void 0, e.$slots.actions ? {
 				name: "actions",
-				fn: P(() => [w(e.$slots, "actions")]),
+				fn: N(() => [T(e.$slots, "actions")]),
 				key: "1"
 			} : void 0]), 1032, [
 				"color",
@@ -3203,7 +3335,7 @@ function jt(e, t, n, i, a, s) {
 				"content-class",
 				"title",
 				"style"
-			]), [[N, a.showContent]])]),
+			]), [[ae, a.showContent]])]),
 			_: 3
 		}, 8, ["name", "onAfterLeave"])]),
 		_: 3
@@ -3218,7 +3350,7 @@ function jt(e, t, n, i, a, s) {
 		"class"
 	]);
 }
-var Mt = /* @__PURE__ */ Y({
+var Ut = /* @__PURE__ */ J({
 	name: "w-dialog",
 	props: {
 		modelValue: { default: !0 },
@@ -3278,13 +3410,13 @@ var Mt = /* @__PURE__ */ Y({
 	},
 	computed: {
 		titleClasses() {
-			return Z(this.titleClass);
+			return X(this.titleClass);
 		},
 		contentClasses() {
-			return Z(this.contentClass);
+			return X(this.contentClass);
 		},
 		dialogClasses() {
-			return Z(this.dialogClass);
+			return X(this.dialogClass);
 		},
 		maxWidth() {
 			let e = this.width;
@@ -3315,15 +3447,15 @@ var Mt = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		this.showWrapper = e, this.showContent = e;
 	} }
-}, [["render", jt]]), Nt = ["role", "aria-orientation"];
-function Pt(e, t, n, r, i, a) {
+}, [["render", Ht]]), Wt = ["role", "aria-orientation"];
+function Gt(e, t, n, r, i, a) {
 	return b(), c("div", {
-		class: g(["w-divider", a.classes]),
+		class: _(["w-divider", a.classes]),
 		role: e.$slots.default ? null : "presentation",
 		"aria-orientation": n.vertical ? "vertical" : "horizontal"
-	}, [w(e.$slots, "default")], 10, Nt);
+	}, [T(e.$slots, "default")], 10, Wt);
 }
-var Ft = /* @__PURE__ */ Y({
+var Kt = /* @__PURE__ */ J({
 	name: "w-divider",
 	props: {
 		vertical: { type: Boolean },
@@ -3341,17 +3473,17 @@ var Ft = /* @__PURE__ */ Y({
 			"w-divider--light": this.light
 		};
 	} }
-}, [["render", Pt]]), It = { class: "w-drawer-wrap__pushable" };
-function Lt(t, n, i, a, u, d) {
-	let p = T("w-overlay");
+}, [["render", Gt]]), qt = { class: "w-drawer-wrap__pushable" };
+function Jt(t, n, i, a, u, d) {
+	let p = E("w-overlay");
 	return u.showWrapper || i.pushContent ? (b(), c("div", {
 		key: 0,
-		class: g(["w-drawer-wrap", d.wrapperClasses])
+		class: _(["w-drawer-wrap", d.wrapperClasses])
 	}, [i.pushContent ? (b(), c("div", {
 		key: 0,
 		class: "w-drawer-wrap__track",
-		style: v(d.trackStyles)
-	}, [l("div", It, [i.noOverlay ? s("", !0) : (b(), o(p, {
+		style: y(d.trackStyles)
+	}, [l("div", qt, [i.noOverlay ? s("", !0) : (b(), o(p, {
 		key: 0,
 		modelValue: u.showDrawer,
 		"onUpdate:modelValue": n[0] ||= (e) => u.showDrawer = e,
@@ -3366,18 +3498,18 @@ function Lt(t, n, i, a, u, d) {
 		"persistent",
 		"bg-color",
 		"opacity"
-	])), w(t.$slots, "pushable")]), f(r, {
+	])), T(t.$slots, "pushable")]), f(r, {
 		name: "fade",
 		onBeforeLeave: d.onBeforeClose,
 		onAfterLeave: d.onClose
 	}, {
-		default: P(() => [u.showDrawer ? (b(), o(D(i.tag || "aside"), {
+		default: N(() => [u.showDrawer ? (b(), o(D(i.tag || "aside"), {
 			key: 0,
-			class: g(["w-drawer", d.drawerClasses]),
+			class: _(["w-drawer", d.drawerClasses]),
 			ref: "drawer",
-			style: v(d.styles)
+			style: y(d.styles)
 		}, {
-			default: P(() => [w(t.$slots, "default")]),
+			default: N(() => [T(t.$slots, "default")]),
 			_: 3
 		}, 8, ["class", "style"])) : s("", !0)]),
 		_: 3
@@ -3402,13 +3534,13 @@ function Lt(t, n, i, a, u, d) {
 		onBeforeLeave: d.onBeforeClose,
 		onAfterLeave: d.onClose
 	}, {
-		default: P(() => [u.showDrawer ? (b(), o(D(i.tag || "aside"), {
+		default: N(() => [u.showDrawer ? (b(), o(D(i.tag || "aside"), {
 			key: 0,
-			class: g(["w-drawer", d.drawerClasses]),
+			class: _(["w-drawer", d.drawerClasses]),
 			ref: "drawer",
-			style: v(d.styles)
+			style: y(d.styles)
 		}, {
-			default: P(() => [w(t.$slots, "default")]),
+			default: N(() => [T(t.$slots, "default")]),
 			_: 3
 		}, 8, ["class", "style"])) : s("", !0)]),
 		_: 3
@@ -3420,12 +3552,12 @@ function Lt(t, n, i, a, u, d) {
 }
 //#endregion
 //#region src/wave-ui/components/w-drawer.vue
-var Rt = {
+var Yt = {
 	left: "right",
 	right: "left",
 	top: "down",
 	bottom: "up"
-}, zt = /* @__PURE__ */ Y({
+}, Xt = /* @__PURE__ */ J({
 	name: "w-drawer",
 	props: {
 		modelValue: { default: !0 },
@@ -3531,7 +3663,7 @@ var Rt = {
 			return !this.showWrapper;
 		},
 		transitionName() {
-			return `slide-${Rt[this.position]}`;
+			return `slide-${Yt[this.position]}`;
 		}
 	},
 	methods: {
@@ -3548,16 +3680,16 @@ var Rt = {
 	watch: { modelValue(e) {
 		e && (this.showWrapper = !0), this.showDrawer = e;
 	} }
-}, [["render", Lt]]);
+}, [["render", Jt]]);
 //#endregion
 //#region src/wave-ui/components/w-flex.vue?vue&type=template&lang.js
-function Bt(e, t, n, r, i, a) {
-	return b(), o(D(n.tag), { class: g(["w-flex", a.classes]) }, {
-		default: P(() => [w(e.$slots, "default")]),
+function Zt(e, t, n, r, i, a) {
+	return b(), o(D(n.tag), { class: _(["w-flex", a.classes]) }, {
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 8, ["class"]);
 }
-var Vt = /* @__PURE__ */ Y({
+var Qt = /* @__PURE__ */ J({
 	name: "w-flex",
 	props: {
 		tag: {
@@ -3608,23 +3740,23 @@ var Vt = /* @__PURE__ */ Y({
 			[`gap${this.gap}`]: ~~this.gap
 		};
 	} }
-}, [["render", Bt]]);
+}, [["render", Zt]]);
 //#endregion
 //#region src/wave-ui/components/w-form.vue?vue&type=template&lang.js
-function Ht(e, t, n, r, i, a) {
+function $t(e, t, n, r, i, a) {
 	return b(), c("form", {
-		class: g(["w-form", a.classes]),
+		class: _(["w-form", a.classes]),
 		onSubmit: t[0] ||= (...e) => a.onSubmit && a.onSubmit(...e),
 		onReset: t[1] ||= (...e) => a.reset && a.reset(...e),
 		novalidate: ""
-	}, [w(e.$slots, "default")], 34);
+	}, [T(e.$slots, "default")], 34);
 }
 //#endregion
 //#region src/wave-ui/components/w-form.vue
-var Ut = async (e, t) => {
+var en = async (e, t) => {
 	for (let n of e) if (await t(n)) return !0;
 	return !1;
-}, Wt = /* @__PURE__ */ Y({
+}, tn = /* @__PURE__ */ J({
 	name: "w-form",
 	props: {
 		modelValue: {},
@@ -3699,7 +3831,7 @@ var Ut = async (e, t) => {
 		},
 		async checkElementValidators(e) {
 			let t = !1, n = "";
-			await Ut(e.validators, async (r) => {
+			await en(e.validators, async (r) => {
 				let i = await (typeof r == "function" && r(e.inputValue));
 				return t = typeof i != "string", n = t ? "" : i, !t;
 			}), e.hasJustReset = !1, e.Validation.isValid = t, e.Validation.message = n;
@@ -3720,20 +3852,20 @@ var Ut = async (e, t) => {
 	watch: { modelValue(e) {
 		(this.status === !1 && e || e === null && this.status !== null) && this.reset(), this.status = e;
 	} }
-}, [["render", Ht]]);
+}, [["render", $t]]);
 //#endregion
 //#region src/wave-ui/components/w-form-element.vue?vue&type=template&lang.js
-function Gt(e, t, n, r, i, a) {
-	let o = T("w-transition-expand");
-	return b(), c("div", { class: g(a.classes) }, [l("div", { class: g(["w-flex grow", [n.column ? "column" : "align-center", n.wrap ? "wrap" : ""]]) }, [w(e.$slots, "default")], 2), f(o, { y: "" }, {
-		default: P(() => [e.Validation.message ? (b(), c("div", {
+function nn(e, t, n, r, i, a) {
+	let o = E("w-transition-expand");
+	return b(), c("div", { class: _(a.classes) }, [l("div", { class: _(["w-flex grow", [n.column ? "column" : "align-center", n.wrap ? "wrap" : ""]]) }, [T(e.$slots, "default")], 2), f(o, { y: "" }, {
+		default: N(() => [e.Validation.message ? (b(), c("div", {
 			key: 0,
-			class: g(["w-form-el__error", a.formProps.validationColor])
-		}, [w(e.$slots, "error-message", { message: e.Validation.message }, () => [d(O(e.Validation.message), 1)])], 2)) : s("", !0)]),
+			class: _(["w-form-el__error", a.formProps.validationColor])
+		}, [T(e.$slots, "error-message", { message: e.Validation.message }, () => [d(O(e.Validation.message), 1)])], 2)) : s("", !0)]),
 		_: 3
 	})], 2);
 }
-var Kt = /* @__PURE__ */ Y({
+var rn = /* @__PURE__ */ J({
 	name: "w-form-element",
 	props: {
 		valid: { required: !0 },
@@ -3801,16 +3933,16 @@ var Kt = /* @__PURE__ */ Y({
 	beforeUnmount() {
 		this.formUnregister && this.formUnregister(this);
 	}
-}, [["render", Gt]]);
+}, [["render", nn]]);
 //#endregion
 //#region src/wave-ui/components/w-grid.vue?vue&type=template&lang.js
-function qt(e, t, n, r, i, a) {
-	return b(), o(D(n.tag), { class: g(["w-grid", a.classes]) }, {
-		default: P(() => [w(e.$slots, "default")]),
+function an(e, t, n, r, i, a) {
+	return b(), o(D(n.tag), { class: _(["w-grid", a.classes]) }, {
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 8, ["class"]);
 }
-var Jt = /* @__PURE__ */ Y({
+var on = /* @__PURE__ */ J({
 	name: "w-grid",
 	props: {
 		tag: {
@@ -3882,21 +4014,21 @@ var Jt = /* @__PURE__ */ Y({
 			};
 		}
 	}
-}, [["render", qt]]);
+}, [["render", an]]);
 //#endregion
 //#region src/wave-ui/components/w-icon.vue?vue&type=template&lang.js
-function Yt(t, n, r, i, a, l) {
+function sn(t, n, r, i, a, l) {
 	return b(), o(D(r.tag || "i"), {
-		class: g(["w-icon", l.classes]),
+		class: _(["w-icon", l.classes]),
 		role: "icon",
 		"aria-hidden": "true",
-		style: v(l.readIcon() && l.styles)
+		style: y(l.readIcon() && l.styles)
 	}, {
-		default: P(() => [l.hasLigature ? (b(), c(e, { key: 0 }, [d(O(t.icon), 1)], 64)) : s("", !0)]),
+		default: N(() => [l.hasLigature ? (b(), c(e, { key: 0 }, [d(O(t.icon), 1)], 64)) : s("", !0)]),
 		_: 1
 	}, 8, ["class", "style"]);
 }
-var Xt = /* @__PURE__ */ Y({
+var cn = /* @__PURE__ */ J({
 	name: "w-icon",
 	props: {
 		tag: {
@@ -3966,27 +4098,27 @@ var Xt = /* @__PURE__ */ Y({
 		let { default: e } = this.$slots, [t = "", n = ""] = typeof e == "function" && e()?.[0]?.children?.trim()?.split(" ") || [];
 		return this.fontName = t, this.icon = n, !0;
 	} }
-}, [["render", Yt]]), Zt = {
+}, [["render", sn]]), ln = {
 	key: 0,
 	class: "w-image__loader"
-}, Qt = ["innerHTML"];
-function $t(e, t, n, i, a, l) {
-	let u = T("w-progress");
+}, un = ["innerHTML"];
+function dn(e, t, n, i, a, l) {
+	let u = E("w-progress");
 	return b(), o(D(l.wrapperTag), {
-		class: g(["w-image", l.wrapperClasses]),
+		class: _(["w-image", l.wrapperClasses]),
 		ref: "imageWrap",
-		style: v(l.wrapperStyles),
+		style: y(l.wrapperStyles),
 		onError: t[0] ||= (e) => a.error = !0
 	}, {
-		default: P(() => [
+		default: N(() => [
 			f(r, {
 				name: n.transition,
 				appear: ""
 			}, {
-				default: P(() => [a.loaded ? (b(), o(D(l.normalized.tag), {
+				default: N(() => [a.loaded ? (b(), o(D(l.normalized.tag), {
 					key: 0,
-					class: g(["w-image__image", l.imageClasses]),
-					style: v(l.imageStyles),
+					class: _(["w-image__image", l.imageClasses]),
+					style: y(l.imageStyles),
 					src: l.normalized.tag === "img" ? a.computedImg.src : null
 				}, null, 8, [
 					"class",
@@ -3995,31 +4127,31 @@ function $t(e, t, n, i, a, l) {
 				])) : s("", !0)]),
 				_: 1
 			}, 8, ["name"]),
-			!n.noSpinner && a.loading ? (b(), c("span", Zt, [e.$slots.loading ? w(e.$slots, "loading", { key: 0 }) : (b(), o(u, h({
+			!n.noSpinner && a.loading ? (b(), c("span", ln, [e.$slots.loading ? T(e.$slots, "loading", { key: 0 }) : (b(), o(u, h({
 				key: 1,
 				circle: "",
 				indeterminate: ""
 			}, n.spinnerColor ? { color: n.spinnerColor } : {}), null, 16))])) : s("", !0),
 			e.$slots.default ? (b(), o(D(l.wrapperTag), {
 				key: 1,
-				class: g(["w-image__content", n.contentClass])
+				class: _(["w-image__content", n.contentClass])
 			}, {
-				default: P(() => [w(e.$slots, "default")]),
+				default: N(() => [T(e.$slots, "default")]),
 				_: 3
 			}, 8, ["class"])) : s("", !0),
 			e.$slots.caption ? (b(), c("figcaption", {
 				key: 2,
-				class: g(["w-image__caption caption", n.captionClass])
-			}, [w(e.$slots, "caption")], 2)) : n.caption ? (b(), c("figcaption", {
+				class: _(["w-image__caption caption", n.captionClass])
+			}, [T(e.$slots, "caption")], 2)) : n.caption ? (b(), c("figcaption", {
 				key: 3,
-				class: g(["w-image__caption caption", n.captionClass]),
+				class: _(["w-image__caption caption", n.captionClass]),
 				innerHTML: n.caption
-			}, null, 10, Qt)) : s("", !0)
+			}, null, 10, un)) : s("", !0)
 		]),
 		_: 3
 	}, 40, ["class", "style"]);
 }
-var en = /* @__PURE__ */ Y({
+var fn = /* @__PURE__ */ J({
 	name: "w-image",
 	props: {
 		tag: {
@@ -4132,7 +4264,7 @@ var en = /* @__PURE__ */ Y({
 	watch: { src() {
 		this.loadImage();
 	} }
-}, [["render", $t]]), tn = ["name"], nn = ["for"], rn = [
+}, [["render", dn]]), pn = ["name"], mn = ["for"], hn = [
 	"id",
 	"type",
 	"name",
@@ -4147,18 +4279,18 @@ var en = /* @__PURE__ */ Y({
 	"disabled",
 	"required",
 	"tabindex"
-], an = [
+], gn = [
 	"id",
 	"name",
 	"multiple",
 	"disabled",
 	"data-progress"
-], on = {
+], _n = {
 	class: "w-input__no-file",
 	key: "no-file"
-}, sn = ["for"], cn = ["src"], ln = ["for"];
-function un(t, n, r, a, u, p) {
-	let m = T("w-icon"), _ = T("w-progress");
+}, vn = ["for"], yn = ["src"], bn = ["for"];
+function xn(t, n, r, a, u, p) {
+	let m = E("w-icon"), g = E("w-progress");
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: u.inputValue,
@@ -4176,26 +4308,26 @@ function un(t, n, r, a, u, p) {
 		class: p.classes,
 		style: t.$attrs.style
 	}), {
-		default: P(() => [r.type === "hidden" ? F((b(), c("input", {
+		default: N(() => [r.type === "hidden" ? P((b(), c("input", {
 			key: 0,
 			type: "hidden",
 			name: t.name || null,
 			"onUpdate:modelValue": n[0] ||= (e) => u.inputValue = e
-		}, null, 8, tn)), [[M, u.inputValue]]) : (b(), c(e, { key: 1 }, [
+		}, null, 8, pn)), [[M, u.inputValue]]) : (b(), c(e, { key: 1 }, [
 			r.labelPosition === "left" ? (b(), c(e, { key: 0 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-input__label w-input__label--left w-form-el-shakable", t.labelClasses]),
+				class: _(["w-input__label w-input__label--left w-form-el-shakable", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, nn)) : s("", !0)], 64)) : s("", !0),
-			l("div", { class: g(["w-input__input-wrap", p.inputWrapClasses]) }, [
-				w(t.$slots, "icon-left", { inputId: t.inputId }, () => [r.innerIconLeft ? (b(), o(m, {
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, mn)) : s("", !0)], 64)) : s("", !0),
+			l("div", { class: _(["w-input__input-wrap", p.inputWrapClasses]) }, [
+				T(t.$slots, "icon-left", { inputId: t.inputId }, () => [r.innerIconLeft ? (b(), o(m, {
 					key: 0,
 					class: "w-input__icon w-input__icon--inner-left",
 					tag: "label",
 					for: t.inputId,
 					onClick: n[1] ||= (e) => t.$emit("click:inner-icon-left", e)
 				}, {
-					default: P(() => [d(O(r.innerIconLeft), 1)]),
+					default: N(() => [d(O(r.innerIconLeft), 1)]),
 					_: 1
 				}, 8, ["for"])) : s("", !0)]),
 				r.type === "file" ? (b(), c(e, { key: 1 }, [l("input", h({
@@ -4210,13 +4342,13 @@ function un(t, n, r, a, u, p) {
 				}, p.attrs, {
 					disabled: t.isDisabled || null,
 					"data-progress": p.overallFilesProgress
-				}), null, 16, an), f(i, {
+				}), null, 16, gn), f(i, {
 					class: "w-input__input w-input__input--file",
 					tag: "label",
 					name: "fade",
 					for: t.inputId
 				}, {
-					default: P(() => [!u.inputFiles.length && u.isFocused ? (b(), c("span", on, [w(t.$slots, "no-file", {}, () => [t.$slots["no-file"] === void 0 ? (b(), c(e, { key: 0 }, [d("No file")], 64)) : s("", !0)])])) : s("", !0), (b(!0), c(e, null, C(u.inputFiles, (e, t) => (b(), c("span", { key: e.lastModified }, [
+					default: N(() => [!u.inputFiles.length && u.isFocused ? (b(), c("span", _n, [T(t.$slots, "no-file", {}, () => [t.$slots["no-file"] === void 0 ? (b(), c(e, { key: 0 }, [d("No file")], 64)) : s("", !0)])])) : s("", !0), (b(!0), c(e, null, w(u.inputFiles, (e, t) => (b(), c("span", { key: e.lastModified }, [
 						d(O(t ? ", " : ""), 1),
 						(b(), c("span", {
 							class: "filename",
@@ -4225,7 +4357,7 @@ function un(t, n, r, a, u, p) {
 						d(O(e.extension ? `.${e.extension}` : ""), 1)
 					]))), 128))]),
 					_: 3
-				}, 8, ["for"])], 64)) : F((b(), c("input", h({
+				}, 8, ["for"])], 64)) : P((b(), c("input", h({
 					key: 0,
 					class: "w-input__input",
 					ref: "input",
@@ -4247,22 +4379,22 @@ function un(t, n, r, a, u, p) {
 					disabled: t.isDisabled || null,
 					required: t.required || null,
 					tabindex: t.tabindex || null
-				}, p.attrs, { class: r.inputClass }), null, 16, rn)), [[j, u.inputValue]]),
+				}, p.attrs, { class: r.inputClass }), null, 16, hn)), [[j, u.inputValue]]),
 				r.labelPosition === "inside" && p.showLabelInside ? (b(), c(e, { key: 2 }, [t.$slots.default || r.label ? (b(), c("label", {
 					key: 0,
-					class: g(["w-input__label w-input__label--inside w-form-el-shakable", t.labelClasses])
-				}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
-				w(t.$slots, "icon-right", { inputId: t.inputId }, () => [r.innerIconRight ? (b(), o(m, {
+					class: _(["w-input__label w-input__label--inside w-form-el-shakable", t.labelClasses])
+				}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
+				T(t.$slots, "icon-right", { inputId: t.inputId }, () => [r.innerIconRight ? (b(), o(m, {
 					key: 0,
 					class: "w-input__icon w-input__icon--inner-right",
 					tag: "label",
 					for: t.inputId,
 					onClick: n[9] ||= (e) => t.$emit("click:inner-icon-right", e)
 				}, {
-					default: P(() => [d(O(r.innerIconRight), 1)]),
+					default: N(() => [d(O(r.innerIconRight), 1)]),
 					_: 1
 				}, 8, ["for"])) : s("", !0)]),
-				p.hasLoading || r.showProgress && (p.uploadInProgress || p.uploadComplete) ? (b(), o(_, {
+				p.hasLoading || r.showProgress && (p.uploadInProgress || p.uploadComplete) ? (b(), o(g, {
 					key: 3,
 					class: "fill-width",
 					size: "2",
@@ -4274,7 +4406,7 @@ function un(t, n, r, a, u, p) {
 				key: 1,
 				class: "d-flex",
 				for: t.inputId
-			}, [(b(!0), c(e, null, C(u.inputFiles, (t, n) => (b(), c(e, null, [t.progress < 100 ? (b(), c("i", {
+			}, [(b(!0), c(e, null, w(u.inputFiles, (t, n) => (b(), c(e, null, [t.progress < 100 ? (b(), c("i", {
 				class: "w-icon wi-spinner w-icon--spin size--sm w-input__file-preview primary",
 				key: `${n}a`
 			})) : t.preview ? (b(), c("img", {
@@ -4282,15 +4414,15 @@ function un(t, n, r, a, u, p) {
 				key: `${n}b`,
 				src: t.preview,
 				alt: ""
-			}, null, 8, cn)) : (b(), c("i", {
-				class: g(["w-icon w-input__file-preview primary size--md", r.preview && typeof r.preview == "string" ? r.preview : "wi-file"]),
+			}, null, 8, yn)) : (b(), c("i", {
+				class: _(["w-icon w-input__file-preview primary size--md", r.preview && typeof r.preview == "string" ? r.preview : "wi-file"]),
 				key: `${n}c`
-			}, null, 2))], 64))), 256))], 8, sn)) : s("", !0),
+			}, null, 2))], 64))), 256))], 8, vn)) : s("", !0),
 			r.labelPosition === "right" ? (b(), c(e, { key: 2 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-input__label w-input__label--right w-form-el-shakable", t.labelClasses]),
+				class: _(["w-input__label w-input__label--right w-form-el-shakable", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, ln)) : s("", !0)], 64)) : s("", !0)
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, bn)) : s("", !0)], 64)) : s("", !0)
 		], 64))]),
 		_: 3
 	}, 16, [
@@ -4300,10 +4432,13 @@ function un(t, n, r, a, u, p) {
 		"style"
 	]);
 }
-var dn = /* @__PURE__ */ Y({
+var Sn = /* @__PURE__ */ J({
 	name: "w-input",
-	mixins: [Q],
+	mixins: [$],
 	inheritAttrs: !1,
+	setup() {
+		return Q();
+	},
 	props: {
 		modelValue: { default: "" },
 		type: {
@@ -4488,37 +4623,37 @@ var dn = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		this.inputValue = e, !e && e !== 0 && (this.isAutofilled = !1, this.inputFiles = []);
 	} }
-}, [["render", un]]);
+}, [["render", xn]]);
 //#endregion
 //#region src/wave-ui/components/w-list.vue?vue&type=template&lang.js
-function fn(t, n, r, i, a, l) {
-	let f = T("w-icon"), p = T("w-list", !0);
-	return b(), c("ul", { class: g(["w-list", l.classes]) }, [(b(!0), c(e, null, C(t.listItems, (e, i) => (b(), c("li", {
-		class: g(["w-list__item", { "w-list__item--parent": (e.children || []).length }]),
+function Cn(t, n, r, i, a, l) {
+	let f = E("w-icon"), p = E("w-list", !0);
+	return b(), c("ul", { class: _(["w-list", l.classes]) }, [(b(!0), c(e, null, w(t.listItems, (e, i) => (b(), c("li", {
+		class: _(["w-list__item", { "w-list__item--parent": (e.children || []).length }]),
 		key: i
 	}, [
 		r.icon ? (b(), o(f, {
 			key: 0,
 			class: "w-list__item-bullet"
 		}, {
-			default: P(() => [d(O(r.icon), 1)]),
+			default: N(() => [d(O(r.icon), 1)]),
 			_: 1
 		})) : s("", !0),
 		t.$slots[`item.${i + 1}`] || t.$slots.item || t.$slots.default ? (b(), o(D(r.checklist ? "w-checkbox" : r.nav && !e.disabled && e.route ? l.hasRouter ? "router-link" : "a" : "div"), h({
 			key: 1,
 			class: "w-list__item-label"
 		}, { ref_for: !0 }, l.liLabelProps(e, i, e._selected)), {
-			default: P(() => [t.$slots[`item.${i + 1}`] ? w(t.$slots, `item.${i + 1}`, {
+			default: N(() => [t.$slots[`item.${i + 1}`] ? T(t.$slots, `item.${i + 1}`, {
 				key: 0,
 				item: l.cleanLi(e),
 				index: i + 1,
 				selected: e._selected
-			}) : t.$slots.item ? w(t.$slots, "item", {
+			}) : t.$slots.item ? T(t.$slots, "item", {
 				key: 1,
 				item: l.cleanLi(e),
 				index: i + 1,
 				selected: e._selected
-			}) : w(t.$slots, "default", {
+			}) : T(t.$slots, "default", {
 				key: 2,
 				item: l.cleanLi(e),
 				index: i + 1,
@@ -4541,7 +4676,7 @@ function fn(t, n, r, i, a, l) {
 			onItemSelect: n[3] ||= (e) => t.$emit("item-select", e)
 		}), u({ _: 2 }, [t.$slots.item ? {
 			name: "item",
-			fn: P(({ item: e, index: n, selected: r }) => [w(t.$slots, "item", {
+			fn: N(({ item: e, index: n, selected: r }) => [T(t.$slots, "item", {
 				item: l.cleanLi(e),
 				index: n,
 				selected: r
@@ -4549,7 +4684,7 @@ function fn(t, n, r, i, a, l) {
 			key: "0"
 		} : {
 			name: "default",
-			fn: P(({ item: e, index: n, selected: i }) => [w(t.$slots, "default", {
+			fn: N(({ item: e, index: n, selected: i }) => [T(t.$slots, "default", {
 				item: l.cleanLi(e),
 				index: n,
 				selected: i
@@ -4558,8 +4693,9 @@ function fn(t, n, r, i, a, l) {
 		}]), 1040, ["items", "depth"])) : s("", !0)
 	], 2))), 128))], 2);
 }
-var pn = /* @__PURE__ */ Y({
+var wn = /* @__PURE__ */ J({
 	name: "w-list",
+	mixins: [Z],
 	setup() {
 		return { waveUiUseId: A() };
 	},
@@ -4663,6 +4799,7 @@ var pn = /* @__PURE__ */ Y({
 		},
 		liLabelClasses(e) {
 			return {
+				"w-ripple": this.rippleActive && !e.disabled && (this.checklist || this.isSelectable || this.nav && e[this.itemRouteKey]),
 				"w-list__item-label--disabled": e.disabled || this.nav && !e[this.itemRouteKey] && !e.children,
 				"w-list__item-label--active": this.isSelectable && e._selected || null,
 				"w-list__item-label--focused": e._focused,
@@ -4680,7 +4817,7 @@ var pn = /* @__PURE__ */ Y({
 					this.$emit("item-click", t), this.$emit("item-select", t);
 				}
 			}, a = this.isSelectable && ((t) => {
-				t.stopPropagation(), !e.disabled && this.selectItem(e);
+				t.stopPropagation(), this.onRipple(t), !e.disabled && this.selectItem(e);
 			}), o = this.isSelectable && ((t) => {
 				!e.disabled && t.keyCode === 13 ? (this.selectItem(e), this.$emit("keydown:enter"), this.$emit("item-select", this.cleanLi(e))) : t.keyCode === 27 ? this.$emit("keydown:escape") : this.arrowsNavigation && [38, 40].includes(t.keyCode) && (t.preventDefault(), t.keyCode === 38 && this.focusPrevNextItem(e._index, !1), t.keyCode === 40 && this.focusPrevNextItem(e._index, !0));
 			}), s = {
@@ -4690,10 +4827,10 @@ var pn = /* @__PURE__ */ Y({
 				id: this.listId ? `${this.listId}_item-${t + 1}` : null,
 				role: "option"
 			};
-			return this.checklist ? (s.modelValue = e._selected, s.color = e[this.itemColorKey] || this.color, s.round = this.roundCheckboxes, s.disabled = e.disabled, r || (s.label = e._label || null), s.onFocus = () => e._focused = !0, s.onBlur = () => e._focused = !1, s.onInput = (t) => this.selectItem(e, t), s.onClick = (e) => {
+			return this.checklist ? (s.modelValue = e._selected, s.color = e[this.itemColorKey] || this.color, s.round = this.roundCheckboxes, s.disabled = e.disabled, r || (s.label = e._label || null), s.onFocus = () => e._focused = !0, s.onBlur = () => e._focused = !1, s.onInput = (t) => this.selectItem(e, t), s.onPointerdown = (e) => this.onRipple(e), s.onClick = (e) => {
 				let t = e.target.querySelector("input[type=\"checkbox\"]");
 				t && (t.focus(), t.click()), i();
-			}) : this.nav ? (!e.disabled && e[this.itemRouteKey] && (s.onKeydown = o, s.onMousedown = a, this.$router ? (s.to = e[this.itemRouteKey], s.onClick = (t) => {
+			}) : this.nav ? (!e.disabled && e[this.itemRouteKey] && (s.onKeydown = o, s.onMousedown = a, s.onPointerdown = (e) => this.onRipple(e), this.$router ? (s.to = e[this.itemRouteKey], s.onClick = (t) => {
 				t.preventDefault(), this.$router.push(e[this.itemRouteKey]), i();
 			}) : (s.href = e[this.itemRouteKey], s.onClick = i)), r || (s.innerHTML = e._label)) : this.isSelectable ? (e.disabled || (s.tabindex = 0), s.onClick = i, s.onKeydown = o, s.onMousedown = a, r || (s.innerHTML = e._label)) : r || (s.innerHTML = e._label), s;
 		},
@@ -4755,8 +4892,8 @@ var pn = /* @__PURE__ */ Y({
 			}
 		}
 	}
-}, [["render", fn]]), mn = 4;
-function hn(e) {
+}, [["render", Cn]]), Tn = 4;
+function En(e) {
 	return {
 		top: "bottom",
 		bottom: "top",
@@ -4764,7 +4901,7 @@ function hn(e) {
 		right: "left"
 	}[e] || "bottom";
 }
-var gn = {
+var Dn = {
 	props: {
 		appendTo: { type: [
 			String,
@@ -4901,8 +5038,8 @@ var gn = {
 			this.viewportPlacementOverride = null, this.detachableEl.style.display = "flex";
 			let e = window.getComputedStyle(this.detachableEl, null), t = this.detachableEl.offsetWidth, n = this.detachableEl.offsetHeight, r = this.position;
 			if (!this.noPosition) {
-				let e = mn, i = window.innerWidth, a = window.innerHeight, { top: o, left: s, width: c, height: l } = this.activatorEl.getBoundingClientRect();
-				(r === "bottom" && o + l + n > a - e && o - n >= e || r === "top" && o - n < e && o + l + n <= a - e || r === "right" && s + c + t > i - e && s - t >= e || r === "left" && s - t < e && s + c + t <= i - e) && (r = hn(r), this.viewportPlacementOverride = r);
+				let e = Tn, i = window.innerWidth, a = window.innerHeight, { top: o, left: s, width: c, height: l } = this.activatorEl.getBoundingClientRect();
+				(r === "bottom" && o + l + n > a - e && o - n >= e || r === "top" && o - n < e && o + l + n <= a - e || r === "right" && s + c + t > i - e && s - t >= e || r === "left" && s - t < e && s + c + t <= i - e) && (r = En(r), this.viewportPlacementOverride = r);
 			}
 			let i = this.getActivatorCoordinates(), { top: a, left: o } = this._applyDetachablePlacement(r, i, e);
 			this.detachableCoords = {
@@ -4966,16 +5103,16 @@ var gn = {
 };
 //#endregion
 //#region src/wave-ui/components/w-menu.vue?vue&type=template&lang.js
-function _n(t, n, i, a, l, d) {
-	let p = T("w-card"), m = T("w-overlay");
+function On(t, n, i, a, l, d) {
+	let p = E("w-card"), m = E("w-overlay");
 	return b(), c(e, null, [
-		w(t.$slots, "activator", { on: d.activatorEventHandlers }),
+		T(t.$slots, "activator", { on: d.activatorEventHandlers }),
 		f(r, {
 			name: d.transitionName,
 			appear: "",
 			onAfterLeave: t.onAfterLeave
 		}, {
-			default: P(() => [i.custom && t.detachableVisible ? (b(), c("div", h({
+			default: N(() => [i.custom && t.detachableVisible ? (b(), c("div", h({
 				key: 0,
 				class: "w-menu",
 				ref: "detachable"
@@ -4985,7 +5122,7 @@ function _n(t, n, i, a, l, d) {
 				onMouseleave: n[2] ||= (e) => i.showOnHover && (t.hoveringMenu = !1, d.close()),
 				class: d.classes,
 				style: d.styles
-			}), [w(t.$slots, "default")], 16)) : t.detachableVisible ? (b(), o(p, h({
+			}), [T(t.$slots, "default")], 16)) : t.detachableVisible ? (b(), o(p, h({
 				key: 1,
 				class: "w-menu",
 				ref: "detachable"
@@ -5001,15 +5138,15 @@ function _n(t, n, i, a, l, d) {
 				class: d.classes,
 				style: d.styles
 			}), u({
-				default: P(() => [w(t.$slots, "default")]),
+				default: N(() => [T(t.$slots, "default")]),
 				_: 2
 			}, [t.$slots.title ? {
 				name: "title",
-				fn: P(() => [w(t.$slots, "title")]),
+				fn: N(() => [T(t.$slots, "title")]),
 				key: "0"
 			} : void 0, t.$slots.actions ? {
 				name: "actions",
-				fn: P(() => [w(t.$slots, "actions")]),
+				fn: N(() => [T(t.$slots, "actions")]),
 				key: "1"
 			} : void 0]), 1040, [
 				"tile",
@@ -5039,9 +5176,9 @@ function _n(t, n, i, a, l, d) {
 		])) : s("", !0)
 	], 64);
 }
-var vn = /* @__PURE__ */ Y({
+var kn = /* @__PURE__ */ J({
 	name: "w-menu",
-	mixins: [gn],
+	mixins: [Dn],
 	inheritAttrs: !1,
 	props: {
 		modelValue: {},
@@ -5117,17 +5254,17 @@ var vn = /* @__PURE__ */ Y({
 			return this.maxWidth === "activator" ? this.activatorWidth ? `${this.activatorWidth}px` : 0 : isNaN(this.maxWidth) ? this.maxWidth : this.maxWidth ? `${this.maxWidth}px` : 0;
 		},
 		menuClasses() {
-			return Z(this.menuClass);
+			return X(this.menuClass);
 		},
 		titleClasses() {
-			return Z(this.titleClass);
+			return X(this.titleClass);
 		},
 		contentClasses() {
-			return Z(this.contentClass);
+			return X(this.contentClass);
 		},
 		overlayClasses() {
 			return {
-				...Z(this.overlayClass),
+				...X(this.overlayClass),
 				"w-overlay--no-pointer-event": this.showOnHover
 			};
 		},
@@ -5186,32 +5323,32 @@ var vn = /* @__PURE__ */ Y({
 			this.openTimeout = clearTimeout(this.openTimeout), this.detachableVisible && (this.showOnHover && !e && (await new Promise((e) => setTimeout(e, 10)), this.showOnHover && (this.hoveringMenu || this.hoveringActivator)) || (this.$emit("update:modelValue", this.detachableVisible = !1), this.$emit("input", !1), this.$emit("close"), this.viewportPlacementOverride = null, typeof document < "u" && document.removeEventListener("mousedown", this.onOutsideMousedown), typeof window < "u" && window.removeEventListener("resize", this.onResize)));
 		}
 	}
-}, [["render", _n]]);
+}, [["render", On]]);
 //#endregion
 //#region src/wave-ui/components/w-notification.vue?vue&type=template&lang.js
-function yn(e, t, n, i, a, l) {
-	let u = T("w-alert");
+function An(e, t, n, i, a, l) {
+	let u = E("w-alert");
 	return b(), o(r, {
 		name: l.transitionName,
 		appear: ""
 	}, {
-		default: P(() => [a.show ? (b(), c("div", {
+		default: N(() => [a.show ? (b(), c("div", {
 			key: 0,
-			class: g(["w-notification", l.classes]),
-			style: v(l.styles)
+			class: _(["w-notification", l.classes]),
+			style: y(l.styles)
 		}, [f(u, h(l.alertProps, {
 			class: l.alertClasses,
 			"onUpdate:modelValue": t[0] ||= (t) => {
 				e.$emit("update:modelValue", !1), e.$emit("input", !1);
 			}
 		}), {
-			default: P(() => [w(e.$slots, "default")]),
+			default: N(() => [T(e.$slots, "default")]),
 			_: 3
 		}, 16, ["class"])], 6)) : s("", !0)]),
 		_: 3
 	}, 8, ["name"]);
 }
-var bn = /* @__PURE__ */ Y({
+var jn = /* @__PURE__ */ J({
 	name: "w-notification",
 	props: {
 		modelValue: { default: !0 },
@@ -5341,29 +5478,29 @@ var bn = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		clearTimeout(this.timeoutId), this.show = e, e && this.timeoutVal && this.countdown();
 	} }
-}, [["render", yn]]);
+}, [["render", An]]);
 //#endregion
 //#region src/wave-ui/components/w-overlay.vue?vue&type=template&lang.js
-function xn(e, t, n, i, a, l) {
-	let u = E("focus");
+function Mn(e, t, n, i, a, l) {
+	let u = ne("focus");
 	return b(), o(r, {
 		name: "fade",
 		appear: "",
 		onAfterLeave: l.onClose
 	}, {
-		default: P(() => [n.modelValue ? F((b(), c("div", {
+		default: N(() => [n.modelValue ? P((b(), c("div", {
 			key: 0,
-			class: g(["w-overlay", l.classes]),
+			class: _(["w-overlay", l.classes]),
 			ref: "overlay",
-			style: v(n.modelValue && l.styles || null),
-			onKeydown: t[0] ||= I(L((...e) => l.onClick && l.onClick(...e), ["stop"]), ["escape"]),
+			style: y(n.modelValue && l.styles || null),
+			onKeydown: t[0] ||= F(I((...e) => l.onClick && l.onClick(...e), ["stop"]), ["escape"]),
 			onClick: t[1] ||= (...e) => l.onClick && l.onClick(...e),
 			tabindex: "0"
-		}, [w(e.$slots, "default")], 38)), [[N, e.showOverlay], [u]]) : s("", !0)]),
+		}, [T(e.$slots, "default")], 38)), [[ae, e.showOverlay], [u]]) : s("", !0)]),
 		_: 3
 	}, 8, ["onAfterLeave"]);
 }
-var Sn = /* @__PURE__ */ Y({
+var Nn = /* @__PURE__ */ J({
 	name: "w-overlay",
 	props: {
 		modelValue: {},
@@ -5427,22 +5564,22 @@ var Sn = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		e && (this.showOverlay = !0);
 	} }
-}, [["render", xn]]), Cn = { class: "w-parallax" };
-function wn(e, t, n, r, i, a) {
-	return b(), c("div", Cn);
+}, [["render", Mn]]), Pn = { class: "w-parallax" };
+function Fn(e, t, n, r, i, a) {
+	return b(), c("div", Pn);
 }
-var Tn = /* @__PURE__ */ Y({
+var In = /* @__PURE__ */ J({
 	name: "w-parallax",
 	props: {},
 	emits: [],
 	data: () => ({})
-}, [["render", wn]]), En = ["viewBox"], Dn = [
+}, [["render", Fn]]), Ln = ["viewBox"], Rn = [
 	"cx",
 	"cy",
 	"r",
 	"stroke-dasharray",
 	"stroke-width"
-], On = [
+], zn = [
 	"cx",
 	"cy",
 	"r",
@@ -5450,23 +5587,23 @@ var Tn = /* @__PURE__ */ Y({
 	"stroke-linecap",
 	"stroke-dasharray"
 ];
-function kn(e, t, n, r, i, a) {
+function Bn(e, t, n, r, i, a) {
 	return b(), c("div", {
-		class: g(["w-progress", a.classes]),
-		style: v(a.styles)
+		class: _(["w-progress", a.classes]),
+		style: y(a.styles)
 	}, [n.circle ? (b(), c("svg", {
 		key: 1,
 		viewBox: `${a.circleCenter / 2} ${a.circleCenter / 2} ${a.circleCenter} ${a.circleCenter}`
 	}, [n.bgColor || this.progressValue > -1 ? (b(), c("circle", {
 		key: 0,
-		class: g(["bg", n.bgColor || null]),
+		class: _(["bg", n.bgColor || null]),
 		cx: a.circleCenter,
 		cy: a.circleCenter,
 		r: e.circleRadius,
 		fill: "transparent",
 		"stroke-dasharray": e.circleCircumference,
 		"stroke-width": n.stroke
-	}, null, 10, Dn)) : s("", !0), l("circle", {
+	}, null, 10, Rn)) : s("", !0), l("circle", {
 		class: "w-progress__progress",
 		cx: a.circleCenter,
 		cy: a.circleCenter,
@@ -5475,19 +5612,19 @@ function kn(e, t, n, r, i, a) {
 		"stroke-width": n.stroke,
 		"stroke-linecap": n.roundCap && "round",
 		"stroke-dasharray": e.circleCircumference,
-		style: v(`stroke-dashoffset: ${(1 - a.progressValue / 100) * e.circleCircumference}`)
-	}, null, 12, On)], 8, En)) : (b(), c("div", {
+		style: y(`stroke-dashoffset: ${(1 - a.progressValue / 100) * e.circleCircumference}`)
+	}, null, 12, zn)], 8, Ln)) : (b(), c("div", {
 		key: 0,
-		class: g(["w-progress__progress", { full: a.progressValue === 100 }]),
-		style: v(`width: ${a.progressValue}%`)
+		class: _(["w-progress__progress", { full: a.progressValue === 100 }]),
+		style: y(`width: ${a.progressValue}%`)
 	}, null, 6)), n.label || e.$slots.default ? (b(), c("div", {
 		key: 2,
-		class: g(["w-progress__label", n.labelColor || !1])
-	}, [w(e.$slots, "default", {}, () => [d(O(Math.round(a.progressValue)) + O(n.circle ? "" : "%"), 1)])], 2)) : s("", !0)], 6);
+		class: _(["w-progress__label", n.labelColor || !1])
+	}, [T(e.$slots, "default", {}, () => [d(O(Math.round(a.progressValue)) + O(n.circle ? "" : "%"), 1)])], 2)) : s("", !0)], 6);
 }
 //#endregion
 //#region src/wave-ui/components/w-progress.vue
-var $ = 40, An = $ / 2, jn = Math.round($ * 3.14 * 100) / 100, Mn = /* @__PURE__ */ Y({
+var Vn = 40, Hn = Vn / 2, Un = Math.round(Vn * 3.14 * 100) / 100, Wn = /* @__PURE__ */ J({
 	name: "w-progress",
 	props: {
 		modelValue: {
@@ -5529,16 +5666,16 @@ var $ = 40, An = $ / 2, jn = Math.round($ * 3.14 * 100) / 100, Mn = /* @__PURE__
 	},
 	emits: [],
 	data: () => ({
-		circleSize: $,
-		circleRadius: An,
-		circleCircumference: jn
+		circleSize: Vn,
+		circleRadius: Hn,
+		circleCircumference: Un
 	}),
 	computed: {
 		progressValue() {
 			return parseFloat(this.modelValue);
 		},
 		circleCenter() {
-			return $ + this.stroke;
+			return Vn + this.stroke;
 		},
 		forcedSize() {
 			return this.size && (isNaN(this.size) ? this.size : `${this.size}px`);
@@ -5568,7 +5705,7 @@ var $ = 40, An = $ / 2, jn = Math.round($ * 3.14 * 100) / 100, Mn = /* @__PURE__
 			return { [this.circle ? "width" : "height"]: this.forcedSize || null };
 		}
 	}
-}, [["render", kn]]), Nn = [
+}, [["render", Bn]]), Gn = [
 	"id",
 	"name",
 	"checked",
@@ -5576,8 +5713,8 @@ var $ = 40, An = $ / 2, jn = Math.round($ * 3.14 * 100) / 100, Mn = /* @__PURE__
 	"required",
 	"tabindex",
 	"aria-checked"
-], Pn = ["for"], Fn = ["for", "innerHTML"], In = ["for"], Ln = ["for", "innerHTML"];
-function Rn(t, n, r, i, a, u) {
+], Kn = ["for"], qn = ["for", "innerHTML"], Jn = ["for"], Yn = ["for", "innerHTML"];
+function Xn(t, n, r, i, a, u) {
 	return b(), o(D(t.formRegister && !u.wRadios ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: t.inputValue,
@@ -5592,7 +5729,7 @@ function Rn(t, n, r, i, a, u) {
 		},
 		class: u.classes
 	}), {
-		default: P(() => [
+		default: N(() => [
 			l("input", {
 				ref: "input",
 				id: t.inputId,
@@ -5606,40 +5743,43 @@ function Rn(t, n, r, i, a, u) {
 				onChange: n[1] ||= (e) => u.onInput(e),
 				"aria-checked": t.inputValue || "false",
 				role: "radio"
-			}, null, 40, Nn),
+			}, null, 40, Gn),
 			u.hasLabel && r.labelOnLeft ? (b(), c(e, { key: 0 }, [t.$slots.default ? (b(), c("label", {
 				key: 0,
-				class: g(["w-radio__label w-form-el-shakable pr2", t.labelClasses]),
+				class: _(["w-radio__label w-form-el-shakable pr2", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, Pn)) : r.label ? (b(), c("label", {
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, Kn)) : r.label ? (b(), c("label", {
 				key: 1,
-				class: g(["w-radio__label w-form-el-shakable pr2", t.labelClasses]),
+				class: _(["w-radio__label w-form-el-shakable pr2", t.labelClasses]),
 				for: t.inputId,
 				innerHTML: r.label
-			}, null, 10, Fn)) : s("", !0)], 64)) : s("", !0),
+			}, null, 10, qn)) : s("", !0)], 64)) : s("", !0),
 			l("div", {
-				class: g(["w-radio__input", this.color]),
+				class: _(["w-radio__input", this.color]),
 				onClick: n[2] ||= (e) => {
 					t.$refs.input.focus(), t.$refs.input.click();
 				}
 			}, null, 2),
 			u.hasLabel && !r.labelOnLeft ? (b(), c(e, { key: 1 }, [t.$slots.default ? (b(), c("label", {
 				key: 0,
-				class: g(["w-radio__label w-form-el-shakable pl2", t.labelClasses]),
+				class: _(["w-radio__label w-form-el-shakable pl2", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, In)) : r.label ? (b(), c("label", {
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, Jn)) : r.label ? (b(), c("label", {
 				key: 1,
-				class: g(["w-radio__label w-form-el-shakable pl2", t.labelClasses]),
+				class: _(["w-radio__label w-form-el-shakable pl2", t.labelClasses]),
 				for: t.inputId,
 				innerHTML: r.label
-			}, null, 10, Ln)) : s("", !0)], 64)) : s("", !0)
+			}, null, 10, Yn)) : s("", !0)], 64)) : s("", !0)
 		]),
 		_: 3
 	}, 16, ["valid", "class"]);
 }
-var zn = /* @__PURE__ */ Y({
+var Zn = /* @__PURE__ */ J({
 	name: "w-radio",
-	mixins: [Q],
+	mixins: [$],
+	setup() {
+		return Q();
+	},
 	inject: { wRadios: { default: null } },
 	props: {
 		modelValue: { default: !1 },
@@ -5705,9 +5845,9 @@ var zn = /* @__PURE__ */ Y({
 	watch: { modelValue() {
 		this.toggleFromOutside();
 	} }
-}, [["render", Rn]]), Bn = ["innerHTML"];
-function Vn(t, n, r, i, a, l) {
-	let u = T("w-radio");
+}, [["render", Xn]]), Qn = ["innerHTML"];
+function $n(t, n, r, i, a, l) {
+	let u = E("w-radio");
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: t.inputValue,
@@ -5723,7 +5863,7 @@ function Vn(t, n, r, i, a, l) {
 		wrap: r.inline,
 		class: l.classes
 	}), {
-		default: P(() => [(b(!0), c(e, null, C(l.radioItems, (e, i) => (b(), o(u, h({
+		default: N(() => [(b(!0), c(e, null, w(l.radioItems, (e, i) => (b(), o(u, h({
 			key: i,
 			"model-value": e.value === r.modelValue,
 			"onUpdate:modelValue": (t) => l.onInput(e),
@@ -5739,7 +5879,7 @@ function Vn(t, n, r, i, a, l) {
 			readonly: t.isReadonly || null,
 			class: { mt1: !r.inline && i }
 		}), {
-			default: P(() => [t.$slots[`item.${i + 1}`] || t.$slots.item ? w(t.$slots, t.$slots[`item.${i + 1}`] ? `item.${i + 1}` : "item", {
+			default: N(() => [t.$slots[`item.${i + 1}`] || t.$slots.item ? T(t.$slots, t.$slots[`item.${i + 1}`] ? `item.${i + 1}` : "item", {
 				key: 0,
 				item: l.getOriginalItem(e),
 				index: i + 1,
@@ -5748,7 +5888,7 @@ function Vn(t, n, r, i, a, l) {
 			}) : e.label ? (b(), c("div", {
 				key: 1,
 				innerHTML: e.label
-			}, null, 8, Bn)) : s("", !0)]),
+			}, null, 8, Qn)) : s("", !0)]),
 			_: 2
 		}, 1040, [
 			"model-value",
@@ -5766,9 +5906,12 @@ function Vn(t, n, r, i, a, l) {
 		"class"
 	]);
 }
-var Hn = /* @__PURE__ */ Y({
+var er = /* @__PURE__ */ J({
 	name: "w-radios",
-	mixins: [Q],
+	mixins: [$],
+	setup() {
+		return Q();
+	},
 	props: {
 		items: {
 			type: Array,
@@ -5833,17 +5976,17 @@ var Hn = /* @__PURE__ */ Y({
 			return this.items[e._index];
 		}
 	}
-}, [["render", Vn]]), Un = [
+}, [["render", $n]]), tr = [
 	"id",
 	"name",
 	"value"
-], Wn = [
+], nr = [
 	"disabled",
 	"onMouseenter",
 	"onClick",
 	"tabindex"
 ];
-function Gn(t, n, r, i, a, u) {
+function rr(t, n, r, i, a, u) {
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: a.rating,
@@ -5858,16 +6001,16 @@ function Gn(t, n, r, i, a, u) {
 		},
 		class: u.classes
 	}), {
-		default: P(() => [l("input", {
+		default: N(() => [l("input", {
 			id: t.inputId,
 			name: t.inputName,
 			type: "hidden",
 			value: a.rating
-		}, null, 8, Un), (b(!0), c(e, null, C(r.max, (i) => (b(), c(e, { key: i }, [t.$slots.item ? w(t.$slots, "item", {
+		}, null, 8, tr), (b(!0), c(e, null, w(r.max, (i) => (b(), c(e, { key: i }, [t.$slots.item ? T(t.$slots, "item", {
 			key: 0,
 			index: i + 1
 		}) : s("", !0), l("button", {
-			class: g(["w-rating__button", u.buttonClasses(i)]),
+			class: _(["w-rating__button", u.buttonClasses(i)]),
 			disabled: t.isDisabled || t.isReadonly,
 			onMouseenter: (e) => a.hover = i,
 			onMouseleave: n[0] ||= (e) => a.hover = 0,
@@ -5879,17 +6022,20 @@ function Gn(t, n, r, i, a, u) {
 			tabindex: i === 1 ? 0 : -1
 		}, [i - 1 === ~~a.rating && a.rating - ~~a.rating ? (b(), c("i", {
 			key: 0,
-			class: g(["w-icon", `${r.icon} ${r.color}`]),
+			class: _(["w-icon", `${r.icon} ${r.color}`]),
 			role: "icon",
 			"aria-hidden": "true",
-			style: v(u.halfStarStyle)
-		}, null, 6)) : s("", !0)], 42, Wn)], 64))), 128))]),
+			style: y(u.halfStarStyle)
+		}, null, 6)) : s("", !0)], 42, nr)], 64))), 128))]),
 		_: 3
 	}, 16, ["valid", "class"]);
 }
-var Kn = /* @__PURE__ */ Y({
+var ir = /* @__PURE__ */ J({
 	name: "w-rating",
-	mixins: [Q],
+	mixins: [$],
+	setup() {
+		return Q();
+	},
 	props: {
 		modelValue: {},
 		max: {
@@ -5992,7 +6138,14 @@ var Kn = /* @__PURE__ */ Y({
 	watch: { value(e) {
 		this.rating = parseFloat(e);
 	} }
-}, [["render", Gn]]), qn = /* @__PURE__ */ Object.assign({ name: "WScrollable" }, {
+}, [["render", rr]]), ar = ["tabindex", "aria-disabled"], or = ["id"], sr = [
+	"aria-controls",
+	"aria-orientation",
+	"aria-valuemax",
+	"aria-valuenow",
+	"aria-disabled",
+	"aria-label"
+], cr = 120, lr = 450, ur = /* @__PURE__ */ Object.assign({ name: "WScrollable" }, {
 	__name: "w-scrollable",
 	props: {
 		color: {
@@ -6001,18 +6154,56 @@ var Kn = /* @__PURE__ */ Y({
 		},
 		bgColor: { type: String },
 		width: { type: [Number, String] },
-		height: { type: [Number, String] }
+		height: { type: [Number, String] },
+		contentClass: {
+			type: [
+				String,
+				Object,
+				Array
+			],
+			default: void 0
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		tabindex: {
+			type: [Number, String],
+			default: 0
+		},
+		wheelStep: {
+			type: Number,
+			default: 40
+		},
+		horizontal: {
+			type: Boolean,
+			default: !1
+		},
+		scrollbar: {
+			type: [Number, String],
+			default: 1,
+			validator: (e) => e === 0 || e === 1 || e === "0" || e === "1" || e === "hover" || e === "interaction"
+		},
+		scrollPosition: {
+			type: [Number, Object],
+			default: null,
+			validator: (e) => e == null || typeof e == "number" && !Number.isNaN(e) || typeof e == "object" && !!e && !Array.isArray(e)
+		}
 	},
-	emits: [],
+	emits: [
+		"scroll",
+		"scroll-start",
+		"scroll-end"
+	],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = {
+		let r = e, i = n, o = {
 			h: {
 				direction: "horizontal",
 				topOrLeft: "left",
 				size: "width",
 				offsetSize: "offsetWidth",
-				maxSize: "max-width",
 				scrollSize: "scrollWidth",
+				clientSize: "clientWidth",
 				clientXorY: "clientX",
 				deltaXorY: "deltaX",
 				scrollTopOrLeft: "scrollLeft"
@@ -6022,94 +6213,378 @@ var Kn = /* @__PURE__ */ Y({
 				topOrLeft: "top",
 				size: "height",
 				offsetSize: "offsetHeight",
-				maxSize: "max-height",
 				scrollSize: "scrollHeight",
+				clientSize: "clientHeight",
 				clientXorY: "clientY",
 				deltaXorY: "deltaY",
 				scrollTopOrLeft: "scrollTop"
 			}
-		}, o = S(!1), s = S(null), u = S(null), d = S(null), f = S({
-			top: null,
-			left: null,
-			hovered: !1
-		}), p = S(0), m = S(!1), _ = a(() => o.value ? (console.log("💂‍♂️", s.value?.scrollWidth, s.value?.offsetWidth), r.width && !r.height || s.value?.scrollWidth > s.value?.offsetWidth) : !1), x = a(() => i[_.value ? "h" : "v"]), te = a(() => ({ [`w-scrollable--${x.value.direction}`]: !0 })), C = a(() => ({ [`w-scrollable__scrollbar--${x.value.direction}`]: !0 })), T = S(0), E = a(() => (T.value, o.value && (r[x.value.size] ?? s.value?.[x.value.offsetSize]) * 100 / s.value?.[x.value.scrollSize] || 0));
-		function D() {
-			T.value++;
-		}
-		let O = a(() => ({ [x.value.maxSize]: r[x.value.size] ? `${r[x.value.size]}px` : void 0 })), k = a(() => {
-			let e = p.value;
-			return e = Math.max(0, Math.min(e, 100 - E.value)), {
-				[x.value.size]: `${E.value}%`,
-				[x.value.topOrLeft]: `${e}%`
+		}, s = A(), u = ie(), d = S(null), f = S(null), p = S(null), m = S(null), v = S(!1), x = S(!1), C = S(!1), w = S(0), E = S(0), ne = S("native"), D = S(!1), O = S(!1), k = S({
+			offset: 0,
+			trackStart: 0,
+			trackSize: 0
+		}), j = S(null), M = null, N = null, F = null, se = "", L = a(() => r.horizontal), R = a(() => o[L.value ? "h" : "v"]), ce = a(() => r.disabled ? -1 : r.tabindex), z = a(() => {
+			let e = r.scrollbar;
+			return e === 0 || e === "0" ? "off" : e === 1 || e === "1" ? "always" : e === "hover" ? "hover" : e === "interaction" ? "interaction" : "always";
+		}), B = a(() => z.value !== "off"), le = a(() => ({
+			[`w-scrollable--${R.value.direction}`]: !0,
+			"w-scrollable--disabled": r.disabled,
+			"w-scrollable--dragging": C.value,
+			"w-scrollable--scrolling": x.value || C.value
+		})), ue = a(() => ({
+			[`w-scrollable__scrollbar--${R.value.direction}`]: !0,
+			"w-scrollable__scrollbar--hidden": !ve.value,
+			[`${r.bgColor}--bg`]: !!r.bgColor
+		})), de = a(() => X(r.contentClass ?? {})), V = a(() => (E.value, f.value ? f.value[R.value.scrollSize] > f.value[R.value.clientSize] + 1 : !1)), H = a(() => (E.value, f.value ? Math.max(0, f.value[R.value.scrollSize] - f.value[R.value.clientSize]) : 0)), fe = a(() => L.value ? "horizontal" : "vertical"), pe = a(() => V.value ? Math.max(0, Math.round(H.value)) : 0), me = a(() => {
+			if (!f.value) return 0;
+			let e = Math.round(f.value[R.value.scrollTopOrLeft]), t = pe.value;
+			return t ? Math.min(t, Math.max(0, e)) : 0;
+		}), he = a(() => {
+			let e = u["aria-label"] ?? u.ariaLabel;
+			return typeof e == "string" && e ? e : "";
+		}), ge = a(() => he.value ? `${he.value}, scroll position` : L.value ? "Horizontal scrollbar" : "Vertical scrollbar"), _e = a(() => {
+			if (E.value, !f.value || !V.value) return 100;
+			let e = f.value[R.value.clientSize], t = f.value[R.value.scrollSize];
+			return Math.max(8, Math.min(100, e * 100 / t));
+		}), ve = a(() => {
+			let e = z.value;
+			return !V.value || e === "off" ? !1 : e === "always" ? !0 : e === "hover" ? v.value || C.value || x.value : e === "interaction" ? C.value || x.value : !0;
+		});
+		function ye(e) {
+			if (!(e == null || e === "")) return typeof e == "number" ? `${e}px` : typeof e == "string" && /^-?\d+(\.\d+)?$/.test(e.trim()) ? `${e.trim()}px` : e;
+		}
+		let be = a(() => ({
+			"max-width": ye(r.width),
+			"max-height": ye(r.height)
+		})), U = a(() => {
+			let e = Math.max(0, 100 - _e.value), t = W(w.value / 100 * e, 0, e);
+			return {
+				[R.value.size]: `${_e.value}%`,
+				[R.value.topOrLeft]: `${t}%`
 			};
 		});
-		function A(e) {
-			if (r.isDisabled || r.isReadonly || "ontouchstart" in window && e.type === "mousedown") return;
-			let { top: t, left: n, width: i, height: a } = u.value.getBoundingClientRect();
-			_.value ? (u.value.width = i, u.value.left = n) : (u.value.height = a, u.value.top = t), m.value = !0, I(e.type === "touchstart" ? e.touches[0][x.value.clientXorY] : e[x.value.clientXorY]), L(), document.addEventListener(e.type === "touchstart" ? "touchmove" : "mousemove", j), document.addEventListener(e.type === "touchstart" ? "touchend" : "mouseup", M, { once: !0 });
-		}
-		function j(e) {
-			I(e.type === "touchmove" ? e.touches[0][x.value.clientXorY] : e[x.value.clientXorY]), L();
-		}
-		function M(e) {
-			m.value = !1, document.removeEventListener(e.type === "touchend" ? "touchmove" : "mousemove", j), d.value && d.value.focus();
-		}
-		function N() {
-			f.value.hovered = !0;
-		}
-		function P() {
-			f.value.hovered = !1;
-		}
-		function F(e) {
-			f.value.hovered && (p.value <= 0 && e[x.value.deltaXorY] < 0 || p.value >= 100 - E.value && e[x.value.deltaXorY] > 0 || (e.preventDefault(), p.value += e[x.value.deltaXorY] * .05, p.value = Math.max(0, Math.min(p.value, 100)), L()));
-		}
-		function I(e) {
-			let { top: t, left: n, width: r, height: i } = s.value.getBoundingClientRect(), a = _.value ? n : t, o = _.value ? r : i;
-			p.value = Math.max(0, Math.min((e - a) / o * 100, 100));
-		}
-		function L() {
-			s.value[x.value.scrollTopOrLeft] = p.value * s.value?.[x.value.scrollSize] / 100, R();
-		}
-		function R() {
-			d.value.style[x.value.topOrLeft] = p.value;
-		}
-		return ee(() => {
-			o.value = !0;
-			let { top: e, left: t } = s.value.getBoundingClientRect();
-			f.value.top = e, f.value.left = t, window.addEventListener("resize", D);
-		}), y(() => {
-			window.removeEventListener("resize", D);
-		}), t({ scroll: L }), (e, t) => (b(), c("div", h({
-			class: ["w-scrollable", te.value],
-			onMouseenter: N,
-			onMouseleave: P,
-			onMousewheel: F
-		}, e.$attrs, { style: O.value }), [l("div", {
-			class: "w-scrollable__content",
+		function W(e, t, n) {
+			return Math.max(t, Math.min(e, n));
+		}
+		function xe(e) {
+			if (!e || e === d.value) return !1;
+			let t = e.tagName;
+			return t ? e.isContentEditable ? !0 : [
+				"INPUT",
+				"TEXTAREA",
+				"SELECT",
+				"BUTTON"
+			].includes(t) : !1;
+		}
+		function Se(e = "native") {
+			if (!f.value) return {
+				top: 0,
+				left: 0,
+				maxTop: 0,
+				maxLeft: 0,
+				topPercent: 0,
+				leftPercent: 0,
+				source: e
+			};
+			let t = f.value.scrollTop, n = f.value.scrollLeft, r = Math.max(0, f.value.scrollHeight - f.value.clientHeight), i = Math.max(0, f.value.scrollWidth - f.value.clientWidth);
+			return {
+				top: t,
+				left: n,
+				maxTop: r,
+				maxLeft: i,
+				topPercent: r ? t / r * 100 : 0,
+				leftPercent: i ? n / i * 100 : 0,
+				source: e
+			};
+		}
+		function Ce(e = "native") {
+			let t = Se(e);
+			i("scroll", t), O.value || (O.value = !0, i("scroll-start", t)), M && window.clearTimeout(M), M = window.setTimeout(() => {
+				O.value = !1, i("scroll-end", Se("native"));
+			}, cr);
+		}
+		function we() {
+			v.value = !0;
+		}
+		function Te() {
+			v.value = !1;
+		}
+		function G() {
+			f.value && (w.value = H.value ? f.value[R.value.scrollTopOrLeft] * 100 / H.value : 0);
+		}
+		function K(e, t = "api") {
+			if (!f.value) return;
+			let n = W(e, 0, H.value), r = f.value[R.value.scrollTopOrLeft];
+			if (ne.value = t, Math.abs(r - n) < 1) {
+				G(), Ce(t);
+				return;
+			}
+			(t === "wheel" || t === "keyboard") && Oe(), D.value = !0, f.value[R.value.scrollTopOrLeft] = n, G(), Ce(t);
+		}
+		function Ee(e, t = "api") {
+			K(W(e, 0, 100) / 100 * H.value, t);
+		}
+		function q() {
+			g(() => {
+				E.value++, G(), requestAnimationFrame(() => {
+					E.value++, G();
+				});
+			});
+		}
+		function De() {
+			if (D.value) {
+				D.value = !1;
+				return;
+			}
+			G(), Ce(ne.value), ne.value = "native";
+		}
+		function J(e) {
+			let t = e.deltaX || 0, n = e.deltaY || 0, i = 0;
+			return L.value ? (i = Math.abs(t) >= Math.abs(n) ? t : n, !i && e.shiftKey && (i = n)) : i = Math.abs(n) >= Math.abs(t) ? n : t, f.value ? e.deltaMode === 1 ? i * r.wheelStep : e.deltaMode === 2 ? i * f.value[R.value.clientSize] : i : i;
+		}
+		function Oe() {
+			x.value = !0, N && window.clearTimeout(N), N = window.setTimeout(() => {
+				x.value = !1, N = null;
+			}, lr);
+		}
+		function ke() {
+			let e = r.scrollPosition;
+			if (e == null || !f.value) return;
+			if (typeof e == "number") {
+				if (Number.isNaN(e)) return;
+				K(e, "api");
+				return;
+			}
+			if (typeof e != "object" || !e) return;
+			let t = f.value, n = Math.max(0, t.scrollHeight - t.clientHeight), i = Math.max(0, t.scrollWidth - t.clientWidth), a = "top" in e && e.top != null && typeof e.top == "number" && !Number.isNaN(e.top), o = "left" in e && e.left != null && typeof e.left == "number" && !Number.isNaN(e.left);
+			if (a || o) {
+				D.value = !0, a && (t.scrollTop = W(e.top, 0, n)), o && (t.scrollLeft = W(e.left, 0, i)), G(), Ce("api");
+				return;
+			}
+			let s = L.value ? e.left ?? e.top : e.top ?? e.left;
+			typeof s == "number" && !Number.isNaN(s) && K(s, "api");
+		}
+		function Ae(e) {
+			e ? (se = document.documentElement.style.cursor, document.documentElement.style.cursor = "grabbing") : (document.documentElement.style.cursor = se, se = "");
+		}
+		function je() {
+			document.addEventListener("pointermove", ze, !0), document.addEventListener("pointerup", Z, !0), document.addEventListener("pointercancel", Z, !0);
+		}
+		function Me() {
+			document.removeEventListener("pointermove", ze, !0), document.removeEventListener("pointerup", Z, !0), document.removeEventListener("pointercancel", Z, !0);
+		}
+		function Ne(e) {
+			if (r.disabled || !V.value) return;
+			if (e.metaKey) {
+				let t = J(e);
+				if (!t) return;
+				e.preventDefault(), K(t < 0 ? 0 : H.value, "wheel");
+				return;
+			}
+			let t = J(e);
+			if (!t) return;
+			let n = f.value[R.value.scrollTopOrLeft], i = W(n + t, 0, H.value), a = n <= 0 && t < 0, o = n >= H.value && t > 0;
+			a || o || (e.preventDefault(), K(i, "wheel"));
+		}
+		function Pe(e) {
+			if (r.disabled || !V.value || xe(e.target)) return;
+			let t = f.value[R.value.scrollTopOrLeft], n = r.wheelStep, i = f.value[R.value.clientSize], a = null;
+			if (e.metaKey) {
+				if (e.key === "ArrowUp" && !L.value) {
+					e.preventDefault(), K(0, "keyboard");
+					return;
+				}
+				if (e.key === "ArrowDown" && !L.value) {
+					e.preventDefault(), K(H.value, "keyboard");
+					return;
+				}
+				if (e.key === "ArrowLeft" && L.value) {
+					e.preventDefault(), K(0, "keyboard");
+					return;
+				}
+				if (e.key === "ArrowRight" && L.value) {
+					e.preventDefault(), K(H.value, "keyboard");
+					return;
+				}
+			}
+			switch (e.key) {
+				case "ArrowUp":
+					L.value || (a = t - n);
+					break;
+				case "ArrowDown":
+					L.value || (a = t + n);
+					break;
+				case "ArrowLeft":
+					L.value && (a = t - n);
+					break;
+				case "ArrowRight":
+					L.value && (a = t + n);
+					break;
+				case "PageUp":
+					a = t - i;
+					break;
+				case "PageDown":
+					a = t + i;
+					break;
+				case "Home":
+					a = 0;
+					break;
+				case "End":
+					a = H.value;
+					break;
+			}
+			a !== null && (e.preventDefault(), K(a, "keyboard"));
+		}
+		function Fe(e, t, n) {
+			if (!p.value) return;
+			let r = p.value.getBoundingClientRect();
+			k.value.trackStart = r[R.value.topOrLeft], k.value.trackSize = r[R.value.size], k.value.offset = Number.isFinite(t) ? t : 0, C.value = !0;
+			let i = n?.pointerId;
+			if (i != null && d.value?.setPointerCapture) try {
+				d.value.setPointerCapture(i), j.value = i;
+			} catch {
+				j.value = null;
+			}
+			Ae(!0), Ie(e), je();
+		}
+		function Ie(e) {
+			if (!C.value || !k.value.trackSize) return;
+			let t = k.value.trackSize * (_e.value / 100), n = Math.max(1, k.value.trackSize - t);
+			Ee(W(e - k.value.trackStart - k.value.offset, 0, n) / n * 100, "drag");
+		}
+		function Y() {
+			if (j.value != null && d.value?.releasePointerCapture) {
+				try {
+					d.value.releasePointerCapture(j.value);
+				} catch {}
+				j.value = null;
+			}
+			Ae(!1), C.value = !1, Me();
+		}
+		function Le(e) {
+			if (r.disabled || e.button !== 0 && e.pointerType !== "touch") return;
+			Y();
+			let t = m.value?.getBoundingClientRect(), n = t ? t[R.value.size] / 2 : 0;
+			Fe(e[R.value.clientXorY], n, e);
+		}
+		function Re(e) {
+			if (r.disabled || e.button !== 0 && e.pointerType !== "touch") return;
+			Y();
+			let t = m.value?.getBoundingClientRect(), n = t ? e[R.value.clientXorY] - t[R.value.topOrLeft] : 0;
+			Fe(e[R.value.clientXorY], n, e);
+		}
+		function ze(e) {
+			C.value && (e.cancelable && e.preventDefault(), Ie(e[R.value.clientXorY]));
+		}
+		function Z() {
+			C.value && Y();
+		}
+		function Be(e = w.value) {
+			if (typeof e == "number") {
+				Ee(e, "api");
+				return;
+			}
+			e && typeof e == "object" && Ve(e);
+		}
+		function Ve({ top: e, left: t, behavior: n = "auto" } = {}) {
+			let r = L.value ? t ?? e : e ?? t;
+			typeof r == "number" && K(r, "api");
+		}
+		function He({ top: e = 0, left: t = 0, behavior: n = "auto" } = {}) {
+			if (!f.value) return;
+			let r = L.value ? t : e;
+			K(f.value[R.value.scrollTopOrLeft] + r, "api");
+		}
+		function Ue() {
+			K(0, "api");
+		}
+		function We() {
+			K(H.value, "api");
+		}
+		function Ge() {
+			d.value?.focus();
+		}
+		return te(() => {
+			q(), window.addEventListener("resize", q), typeof ResizeObserver < "u" && f.value && (F = new ResizeObserver(() => q()), F.observe(f.value)), g(() => {
+				requestAnimationFrame(() => {
+					ke(), G();
+				});
+			});
+		}), oe(() => [
+			r.horizontal,
+			r.width,
+			r.height
+		], () => q()), oe(() => r.scrollPosition, () => {
+			r.scrollPosition != null && g(() => {
+				ke(), G();
+			});
+		}, { deep: !0 }), oe(L, () => {
+			r.scrollPosition != null && g(() => {
+				ke(), G();
+			});
+		}), ee(() => {
+			window.removeEventListener("resize", q), Y(), M && window.clearTimeout(M), N && window.clearTimeout(N), F && f.value && F.unobserve(f.value), F = null;
+		}), t({
+			scroll: Be,
+			scrollTo: Ve,
+			scrollBy: He,
+			scrollToStart: Ue,
+			scrollToEnd: We,
+			focus: Ge,
+			refresh: q
+		}), (e, t) => (b(), c("div", h({
+			class: "w-scrollable",
+			ref_key: "rootEl",
+			ref: d
+		}, e.$attrs, {
+			tabindex: ce.value,
+			role: "region",
+			"aria-disabled": r.disabled ? "true" : void 0,
+			onMouseenter: we,
+			onMouseleave: Te,
+			onWheel: Ne,
+			onKeydown: Pe,
+			class: le.value,
+			style: be.value
+		}), [l("div", {
+			class: _(["w-scrollable__content", de.value]),
+			id: re(s),
 			ref_key: "scrollableEl",
-			ref: s
-		}, [w(e.$slots, "default")], 512), l("div", {
-			class: g(["w-scrollable__scrollbar", C.value]),
+			ref: f,
+			onScroll: De
+		}, [T(e.$slots, "default")], 42, or), P(l("div", {
+			class: _(["w-scrollable__scrollbar", ue.value]),
 			ref_key: "trackEl",
-			ref: u,
-			onMousedown: A
+			ref: p,
+			role: "presentation",
+			onPointerdown: I(Le, ["prevent"])
 		}, [l("div", {
-			class: "w-scrollable__scrollbar-thumb",
+			class: _(["w-scrollable__scrollbar-thumb", { [r.color]: !!r.color }]),
 			ref_key: "thumbEl",
-			ref: d,
-			style: v(k.value)
-		}, null, 4)], 34)], 16));
+			ref: m,
+			style: y(U.value),
+			role: "scrollbar",
+			"aria-controls": re(s),
+			"aria-orientation": fe.value,
+			"aria-valuemin": 0,
+			"aria-valuemax": pe.value,
+			"aria-valuenow": me.value,
+			"aria-disabled": r.disabled ? "true" : void 0,
+			"aria-label": ge.value,
+			tabindex: "-1",
+			onPointerdown: I(Re, ["stop", "prevent"])
+		}, null, 46, sr)], 34), [[ae, V.value && B.value]])], 16, ar));
 	}
-}), Jn = [
+}), dr = [
 	"aria-expanded",
 	"aria-owns",
 	"aria-activedescendant"
-], Yn = {
+], fr = {
 	key: 0,
 	class: "w-select__selection-slot"
-}, Xn = ["innerHTML"], Zn = ["value", "name"];
-function Qn(t, n, r, i, a, p) {
-	let m = T("w-icon"), _ = T("w-list"), v = T("w-menu");
+}, pr = ["innerHTML"], mr = ["value", "name"];
+function hr(t, n, r, i, a, p) {
+	let m = E("w-icon"), g = E("w-list"), v = E("w-menu");
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: p.selectionString,
@@ -6124,12 +6599,12 @@ function Qn(t, n, r, i, a, p) {
 		wrap: p.hasLabel && r.labelPosition !== "inside",
 		class: p.classes
 	}), {
-		default: P(() => [
+		default: N(() => [
 			r.labelPosition === "left" ? (b(), c(e, { key: 0 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-select__label w-select__label--left w-form-el-shakable", t.labelClasses]),
+				class: _(["w-select__label w-select__label--left w-form-el-shakable", t.labelClasses]),
 				onClick: n[0] ||= (e) => t.$refs["selection-input"].click()
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
 			f(v, h({
 				modelValue: t.showMenu,
 				"onUpdate:modelValue": n[10] ||= (e) => t.showMenu = e,
@@ -6141,53 +6616,53 @@ function Qn(t, n, r, i, a, p) {
 				custom: "",
 				"min-width": "activator"
 			}, r.menuProps || {}), {
-				activator: P(() => [l("div", {
-					class: g(["w-select__selection-wrap", p.inputWrapClasses]),
+				activator: N(() => [l("div", {
+					class: _(["w-select__selection-wrap", p.inputWrapClasses]),
 					onClick: n[6] ||= (e) => !t.isDisabled && !t.isReadonly && p.onInputFieldClick(),
 					role: "button",
 					"aria-haspopup": "listbox",
 					"aria-expanded": t.showMenu ? "true" : "false",
-					"aria-owns": p.selectListId,
-					"aria-activedescendant": `${p.selectListId}_item-1`
+					"aria-owns": i.selectListId,
+					"aria-activedescendant": `${i.selectListId}_item-1`
 				}, [
-					w(t.$slots, "icon-left", {}, () => [r.innerIconLeft ? (b(), o(m, {
+					T(t.$slots, "icon-left", {}, () => [r.innerIconLeft ? (b(), o(m, {
 						key: 0,
 						class: "w-select__icon w-select__icon--inner-left",
 						tag: "label",
 						onClick: n[1] ||= (e) => t.$emit("click:inner-icon-left", e)
 					}, {
-						default: P(() => [d(O(r.innerIconLeft), 1)]),
+						default: N(() => [d(O(r.innerIconLeft), 1)]),
 						_: 1
 					})) : s("", !0)]),
-					t.$slots.selection ? (b(), c("div", Yn, [w(t.$slots, "selection", { item: r.multiple ? t.inputValue : t.inputValue[0] })])) : s("", !0),
+					t.$slots.selection ? (b(), c("div", fr, [T(t.$slots, "selection", { item: r.multiple ? t.inputValue : t.inputValue[0] })])) : s("", !0),
 					l("div", h({
 						class: "w-select__selection",
 						ref: "selection-input",
 						onFocus: n[2] ||= (e) => !t.isDisabled && !t.isReadonly && p.onFocus(e),
 						onBlur: n[3] ||= (...e) => p.onBlur && p.onBlur(...e),
 						onKeydown: n[4] ||= (e) => !t.isDisabled && !t.isReadonly && p.onKeydown(e)
-					}, p.selectionAttributes, { innerHTML: p.selectionHtml }), null, 16, Xn),
-					(b(!0), c(e, null, C(t.inputValue.length ? t.inputValue : [{}], (e, n) => (b(), c("input", {
+					}, p.selectionAttributes, { innerHTML: p.selectionHtml }), null, 16, pr),
+					(b(!0), c(e, null, w(t.inputValue.length ? t.inputValue : [{}], (e, n) => (b(), c("input", {
 						key: n,
 						type: "hidden",
 						value: e.value === void 0 ? "" : e.value.toString(),
 						name: t.inputName + (r.multiple ? "[]" : "")
-					}, null, 8, Zn))), 128)),
+					}, null, 8, mr))), 128)),
 					r.labelPosition === "inside" && p.showLabelInside ? (b(), c(e, { key: 1 }, [t.$slots.default || r.label ? (b(), c("label", {
 						key: 0,
-						class: g(["w-select__label w-select__label--inside w-form-el-shakable", t.labelClasses])
-					}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
-					w(t.$slots, "icon-right", {}, () => [r.innerIconRight ? (b(), o(m, {
+						class: _(["w-select__label w-select__label--inside w-form-el-shakable", t.labelClasses])
+					}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
+					T(t.$slots, "icon-right", {}, () => [r.innerIconRight ? (b(), o(m, {
 						key: 0,
 						class: "w-select__icon w-select__icon--inner-right",
 						tag: "label",
 						onClick: n[5] ||= (e) => t.$emit("click:inner-icon-right", e)
 					}, {
-						default: P(() => [d(O(r.innerIconRight), 1)]),
+						default: N(() => [d(O(r.innerIconRight), 1)]),
 						_: 1
 					})) : s("", !0)])
-				], 10, Jn)]),
-				default: P(() => [f(_, {
+				], 10, dr)]),
+				default: N(() => [f(g, {
 					ref: "w-list",
 					"model-value": t.inputValue,
 					"onUpdate:modelValue": p.onInput,
@@ -6200,20 +6675,20 @@ function Qn(t, n, r, i, a, p) {
 					multiple: r.multiple,
 					"arrows-navigation": "",
 					"return-object": "",
-					"add-ids": p.selectListId,
+					"add-ids": i.selectListId,
 					"no-unselect": r.noUnselect,
 					"selection-color": r.selectionColor,
 					"item-color-key": r.itemColorKey,
 					role: "listbox",
 					tabindex: "-1"
-				}, u({ _: 2 }, [C(r.items.length, (e) => ({
+				}, u({ _: 2 }, [w(r.items.length, (e) => ({
 					name: `item.${e}`,
-					fn: P(({ item: n, selected: i, index: a }) => [t.$slots[`item.${e}`] && t.$slots[`item.${e}`](n, i, a) ? w(t.$slots, `item.${e}`, {
+					fn: N(({ item: n, selected: i, index: a }) => [t.$slots[`item.${e}`] && t.$slots[`item.${e}`](n, i, a) ? T(t.$slots, `item.${e}`, {
 						key: 0,
 						item: n,
 						selected: i,
 						index: a
-					}, () => [d(O(n[r.itemLabelKey]), 1)]) : w(t.$slots, "item", {
+					}, () => [d(O(n[r.itemLabelKey]), 1)]) : T(t.$slots, "item", {
 						key: 1,
 						item: n,
 						selected: i,
@@ -6240,9 +6715,9 @@ function Qn(t, n, r, i, a, p) {
 			]),
 			r.labelPosition === "right" ? (b(), c(e, { key: 1 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-select__label w-select__label--right w-form-el-shakable", t.labelClasses]),
+				class: _(["w-select__label w-select__label--right w-form-el-shakable", t.labelClasses]),
 				onClick: n[11] ||= (e) => t.$refs["selection-input"].click()
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0)
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0)
 		]),
 		_: 3
 	}, 16, [
@@ -6252,9 +6727,16 @@ function Qn(t, n, r, i, a, p) {
 		"class"
 	]);
 }
-var $n = /* @__PURE__ */ Y({
+var gr = /* @__PURE__ */ J({
 	name: "w-select",
-	mixins: [Q],
+	mixins: [$],
+	setup(e) {
+		let { waveUiUseId: t } = Q();
+		return {
+			waveUiUseId: t,
+			selectListId: a(() => e.id ? `${e.id}__listbox` : `w-select-menu--${t}`)
+		};
+	},
 	props: {
 		items: {
 			type: Array,
@@ -6334,9 +6816,6 @@ var $n = /* @__PURE__ */ Y({
 		}
 	}),
 	computed: {
-		selectListId() {
-			return this.id ? `${this.id}__listbox` : `w-select-menu--${this.waveUiUseId}`;
-		},
 		selectItems() {
 			return this.items.map((e, t) => {
 				let n = { ...e };
@@ -6480,12 +6959,12 @@ var $n = /* @__PURE__ */ Y({
 			this.inputValue = this.checkSelection(this.modelValue);
 		}
 	}
-}, [["render", Qn]]), er = ["for"], tr = ["for", "innerHTML"], nr = { class: "w-slider__track-wrap" }, rr = [
+}, [["render", hr]]), _r = ["for"], vr = ["for", "innerHTML"], yr = { class: "w-slider__track-wrap" }, br = [
 	"aria-valuemin",
 	"aria-valuemax",
 	"aria-valuenow",
 	"aria-readonly"
-], ir = [
+], xr = [
 	"id",
 	"name",
 	"model-value",
@@ -6493,11 +6972,11 @@ var $n = /* @__PURE__ */ Y({
 	"readonly",
 	"aria-readonly",
 	"tabindex"
-], ar = ["for"], or = { key: 0 }, sr = {
+], Sr = ["for"], Cr = { key: 0 }, wr = {
 	key: 0,
 	class: "w-slider__step-labels"
-}, cr = ["onClick"], lr = ["for"], ur = ["for", "innerHTML"];
-function dr(t, n, r, i, a, u) {
+}, Tr = ["onClick"], Er = ["for"], Dr = ["for", "innerHTML"];
+function Or(t, n, r, i, a, u) {
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: t.rangeValueScaled,
@@ -6513,19 +6992,19 @@ function dr(t, n, r, i, a, u) {
 		wrap: t.formRegister || null,
 		class: u.wrapperClasses
 	}), {
-		default: P(() => [
+		default: N(() => [
 			t.$slots["label-left"] ? (b(), c("label", {
 				key: 0,
-				class: g(["w-slider__label w-slider__label--left w-form-el-shakable", t.labelClasses]),
+				class: _(["w-slider__label w-slider__label--left w-form-el-shakable", t.labelClasses]),
 				for: u.thumbId
-			}, [w(t.$slots, "label-left")], 10, er)) : r.labelLeft ? (b(), c("label", {
+			}, [T(t.$slots, "label-left")], 10, _r)) : r.labelLeft ? (b(), c("label", {
 				key: 1,
-				class: g(["w-slider__label w-slider__label--left w-form-el-shakable", t.labelClasses]),
+				class: _(["w-slider__label w-slider__label--left w-form-el-shakable", t.labelClasses]),
 				for: u.thumbId,
 				innerHTML: r.labelLeft
-			}, null, 10, tr)) : s("", !0),
-			l("div", nr, [l("div", {
-				class: g(["w-slider__track", u.trackClasses]),
+			}, null, 10, vr)) : s("", !0),
+			l("div", yr, [l("div", {
+				class: _(["w-slider__track", u.trackClasses]),
 				ref: "track",
 				onMousedown: n[4] ||= (...e) => u.onTrackMouseDown && u.onTrackMouseDown(...e),
 				onTouchstart: n[5] ||= (...e) => u.onTrackMouseDown && u.onTrackMouseDown(...e),
@@ -6537,13 +7016,13 @@ function dr(t, n, r, i, a, u) {
 				"aria-readonly": t.isReadonly ? "true" : "false",
 				"aria-orientation": "horizontal"
 			}, [l("div", {
-				class: g(["w-slider__range", u.rangeClasses]),
-				style: v(u.rangeStyles)
+				class: _(["w-slider__range", u.rangeClasses]),
+				style: y(u.rangeStyles)
 			}, null, 6), l("div", {
 				class: "w-slider__thumb",
-				style: v(u.thumbStyles)
+				style: y(u.thumbStyles)
 			}, [l("button", {
-				class: g(["w-slider__thumb-button", [r.color]]),
+				class: _(["w-slider__thumb-button", [r.color]]),
 				ref: "thumb",
 				id: u.thumbId,
 				name: t.inputName,
@@ -6552,27 +7031,27 @@ function dr(t, n, r, i, a, u) {
 				readonly: t.isReadonly || null,
 				"aria-readonly": t.isReadonly ? "true" : "false",
 				tabindex: t.isDisabled || t.isReadonly ? -1 : null,
-				onKeydown: [n[0] ||= I((e) => u.onKeyDown(e, -1), ["left"]), n[1] ||= I((e) => u.onKeyDown(e, 1), ["right"])],
+				onKeydown: [n[0] ||= F((e) => u.onKeyDown(e, -1), ["left"]), n[1] ||= F((e) => u.onKeyDown(e, 1), ["right"])],
 				onFocus: n[2] ||= (e) => t.$emit("focus", e),
-				onClick: n[3] ||= L(() => {}, ["prevent"])
-			}, null, 42, ir), r.thumbLabel ? (b(), c("label", {
+				onClick: n[3] ||= I(() => {}, ["prevent"])
+			}, null, 42, xr), r.thumbLabel ? (b(), c("label", {
 				key: 0,
-				class: g(["w-slider__thumb-label", u.thumbClasses]),
+				class: _(["w-slider__thumb-label", u.thumbClasses]),
 				for: u.thumbId
-			}, [r.thumbLabel === "droplet" ? (b(), c("div", or, [w(t.$slots, "label", { value: t.rangeValueScaled }, () => [d(O(~~t.rangeValueScaled), 1)])])) : w(t.$slots, "label", {
+			}, [r.thumbLabel === "droplet" ? (b(), c("div", Cr, [T(t.$slots, "label", { value: t.rangeValueScaled }, () => [d(O(~~t.rangeValueScaled), 1)])])) : T(t.$slots, "label", {
 				key: 1,
 				value: t.rangeValueScaled
-			}, () => [d(O(~~t.rangeValueScaled), 1)])], 10, ar)) : s("", !0)], 4)], 42, rr), r.stepLabels && r.step ? (b(), c("div", sr, [
+			}, () => [d(O(~~t.rangeValueScaled), 1)])], 10, Sr)) : s("", !0)], 4)], 42, br), r.stepLabels && r.step ? (b(), c("div", wr, [
 				l("div", {
 					class: "w-slider__step-label",
 					onClick: n[6] ||= (e) => u.onStepLabelClick(0)
 				}, O(this.minVal), 1),
-				(b(!0), c(e, null, C(~~u.numberOfSteps, (e) => (b(), c("div", {
+				(b(!0), c(e, null, w(~~u.numberOfSteps, (e) => (b(), c("div", {
 					class: "w-slider__step-label",
 					key: e,
 					onClick: (t) => u.onStepLabelClick(e * (100 / u.numberOfSteps)),
-					style: v(`left: ${e * (100 / u.numberOfSteps)}%`)
-				}, O(u.percentToScaled(e * (100 / u.numberOfSteps))), 13, cr))), 128)),
+					style: y(`left: ${e * (100 / u.numberOfSteps)}%`)
+				}, O(u.percentToScaled(e * (100 / u.numberOfSteps))), 13, Tr))), 128)),
 				~~u.numberOfSteps === u.numberOfSteps ? s("", !0) : (b(), c("div", {
 					key: 0,
 					class: "w-slider__step-label",
@@ -6582,14 +7061,14 @@ function dr(t, n, r, i, a, u) {
 			])) : s("", !0)]),
 			t.$slots["label-right"] ? (b(), c("label", {
 				key: 2,
-				class: g(["w-slider__label w-slider__label--right w-form-el-shakable", t.labelClasses]),
+				class: _(["w-slider__label w-slider__label--right w-form-el-shakable", t.labelClasses]),
 				for: u.thumbId
-			}, [w(t.$slots, "label-right")], 10, lr)) : r.labelRight ? (b(), c("label", {
+			}, [T(t.$slots, "label-right")], 10, Er)) : r.labelRight ? (b(), c("label", {
 				key: 3,
-				class: g(["w-slider__label w-slider__label--right w-form-el-shakable", t.labelClasses]),
+				class: _(["w-slider__label w-slider__label--right w-form-el-shakable", t.labelClasses]),
 				for: u.thumbId,
 				innerHTML: r.labelRight
-			}, null, 10, ur)) : s("", !0)
+			}, null, 10, Dr)) : s("", !0)
 		]),
 		_: 3
 	}, 16, [
@@ -6598,9 +7077,12 @@ function dr(t, n, r, i, a, u) {
 		"class"
 	]);
 }
-var fr = /* @__PURE__ */ Y({
+var kr = /* @__PURE__ */ J({
 	name: "w-slider",
-	mixins: [Q],
+	mixins: [$],
+	setup() {
+		return Q();
+	},
 	props: {
 		modelValue: {
 			type: Number,
@@ -6747,15 +7229,15 @@ var fr = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		this.rangeValueScaled !== e && (this.rangeValueScaled = e, this.rangeValuePercent = this.scaledToPercent(e));
 	} }
-}, [["render", dr]]), pr = { key: 0 };
-function mr(e, t, n, r, i, a) {
+}, [["render", Or]]), Ar = { key: 0 };
+function jr(e, t, n, r, i, a) {
 	return n.modelValue || n.modelValue === void 0 ? (b(), c("div", {
 		key: 0,
-		class: g(["w-spinner", a.classes]),
-		style: v(a.styles)
-	}, [a.isThreeDots ? (b(), c("span", pr)) : s("", !0)], 6)) : s("", !0);
+		class: _(["w-spinner", a.classes]),
+		style: y(a.styles)
+	}, [a.isThreeDots ? (b(), c("span", Ar)) : s("", !0)], 6)) : s("", !0);
 }
-var hr = /* @__PURE__ */ Y({
+var Mr = /* @__PURE__ */ J({
 	name: "w-spinner",
 	props: {
 		modelValue: {},
@@ -6796,13 +7278,13 @@ var hr = /* @__PURE__ */ Y({
 			};
 		}
 	}
-}, [["render", mr]]);
+}, [["render", jr]]);
 //#endregion
 //#region src/wave-ui/components/w-steps.vue?vue&type=template&lang.js
-function gr(e, t, n, r, i, a) {
-	return b(), c("div", { class: g(["w-steps", a.classes]) }, null, 2);
+function Nr(e, t, n, r, i, a) {
+	return b(), c("div", { class: _(["w-steps", a.classes]) }, null, 2);
 }
-var _r = /* @__PURE__ */ Y({
+var Pr = /* @__PURE__ */ J({
 	name: "w-steps",
 	props: {
 		dark: { type: Boolean },
@@ -6816,7 +7298,7 @@ var _r = /* @__PURE__ */ Y({
 			"w-steps--light": this.light
 		};
 	} }
-}, [["render", gr]]), vr = [
+}, [["render", Nr]]), Fr = [
 	"id",
 	"name",
 	"checked",
@@ -6826,15 +7308,15 @@ var _r = /* @__PURE__ */ Y({
 	"required",
 	"tabindex",
 	"aria-checked"
-], yr = ["for"], br = {
+], Ir = ["for"], Lr = {
 	key: 0,
 	class: "w-switch__track"
-}, xr = {
+}, Rr = {
 	key: 1,
 	class: "w-switch__thumb"
-}, Sr = ["for"];
-function Cr(t, n, r, i, a, u) {
-	let f = T("w-progress");
+}, zr = ["for"];
+function Br(t, n, r, i, a, u) {
+	let f = E("w-progress");
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: a.isOn,
@@ -6852,7 +7334,7 @@ function Cr(t, n, r, i, a, u) {
 		class: u.classes,
 		style: t.$attrs.style
 	}), {
-		default: P(() => [
+		default: N(() => [
 			l("input", h({
 				ref: "input",
 				id: t.inputId,
@@ -6870,27 +7352,27 @@ function Cr(t, n, r, i, a, u) {
 				onBlur: n[2] ||= (e) => t.$emit("blur", e),
 				"aria-checked": a.isOn || "false",
 				role: "switch"
-			}), null, 16, vr),
+			}), null, 16, Fr),
 			u.hasLabel && r.labelOnLeft ? (b(), c(e, { key: 0 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-switch__label w-switch__label--left w-form-el-shakable", t.labelClasses]),
+				class: _(["w-switch__label w-switch__label--left w-form-el-shakable", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, yr)) : s("", !0)], 64)) : s("", !0),
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, Ir)) : s("", !0)], 64)) : s("", !0),
 			l("div", {
-				class: g(["w-switch__input", u.inputClasses]),
+				class: _(["w-switch__input", u.inputClasses]),
 				onClick: n[3] ||= (e) => {
 					t.$refs.input.focus(), t.$refs.input.click();
 				}
-			}, [t.$slots.track ? (b(), c("div", br, [w(t.$slots, "track")])) : s("", !0), t.$slots.thumb || r.loading ? (b(), c("div", xr, [r.loading ? (b(), o(f, h({
+			}, [t.$slots.track ? (b(), c("div", Lr, [T(t.$slots, "track")])) : s("", !0), t.$slots.thumb || r.loading ? (b(), c("div", Rr, [r.loading ? (b(), o(f, h({
 				key: 0,
 				circle: "",
 				color: "inherit"
-			}, typeof r.loading == "number" && { "model-value": r.loading }), null, 16)) : w(t.$slots, "thumb", { key: 1 })])) : s("", !0)], 2),
+			}, typeof r.loading == "number" && { "model-value": r.loading }), null, 16)) : T(t.$slots, "thumb", { key: 1 })])) : s("", !0)], 2),
 			u.hasLabel && !r.labelOnLeft ? (b(), c(e, { key: 1 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-switch__label w-switch__label--right w-form-el-shakable", t.labelClasses]),
+				class: _(["w-switch__label w-switch__label--right w-form-el-shakable", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, Sr)) : s("", !0)], 64)) : s("", !0)
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, zr)) : s("", !0)], 64)) : s("", !0)
 		]),
 		_: 3
 	}, 16, [
@@ -6899,10 +7381,13 @@ function Cr(t, n, r, i, a, u) {
 		"style"
 	]);
 }
-var wr = /* @__PURE__ */ Y({
+var Vr = /* @__PURE__ */ J({
 	name: "w-switch",
-	mixins: [Q],
+	mixins: [$],
 	inheritAttrs: !1,
+	setup() {
+		return Q();
+	},
 	props: {
 		modelValue: { default: !1 },
 		label: {
@@ -6982,73 +7467,75 @@ var wr = /* @__PURE__ */ Y({
 	watch: { modelValue(e) {
 		this.isOn = e;
 	} }
-}, [["render", Cr]]), Tr = { class: "w-tabs__content" };
-function Er(e, t, n, r, i, a) {
-	return b(), c("div", Tr, [w(e.$slots, "default", { item: n.item })]);
+}, [["render", Br]]), Hr = { class: "w-tabs__content" };
+function Ur(e, t, n, r, i, a) {
+	return b(), c("div", Hr, [T(e.$slots, "default", { item: n.item })]);
 }
-var Dr = /* @__PURE__ */ Y({
+var Wr = /* @__PURE__ */ J({
 	name: "tab-content",
 	props: { item: Object }
-}, [["render", Er]]), Or = [
+}, [["render", Ur]]), Gr = [
+	"onPointerdown",
 	"onClick",
 	"onFocus",
 	"tabindex",
 	"onKeypress",
 	"aria-selected"
-], kr = ["innerHTML"], Ar = {
+], Kr = ["innerHTML"], qr = {
 	key: 0,
 	class: "w-tabs__bar-extra"
-}, jr = {
+}, Jr = {
 	key: 0,
 	class: "w-tabs__content-wrap"
-}, Mr = ["innerHTML"], Nr = ["innerHTML"];
-function Pr(n, a, u, d, f, p) {
-	let m = T("tab-content");
-	return b(), c("div", { class: g(["w-tabs", p.tabsClasses]) }, [l("div", {
-		class: g(["w-tabs__bar", p.tabsBarClasses]),
+}, Yr = ["innerHTML"], Xr = ["innerHTML"];
+function Zr(n, a, u, d, f, p) {
+	let m = E("tab-content");
+	return b(), c("div", { class: _(["w-tabs", p.tabsClasses]) }, [l("div", {
+		class: _(["w-tabs__bar", p.tabsBarClasses]),
 		ref: "tabs-bar"
 	}, [
-		(b(!0), c(e, null, C(n.tabs, (e, t) => (b(), c("div", {
-			class: g(["w-tabs__bar-item", p.barItemClasses(e)]),
+		(b(!0), c(e, null, w(n.tabs, (e, t) => (b(), c("div", {
+			class: _(["w-tabs__bar-item", p.barItemClasses(e)]),
 			key: t,
+			onPointerdown: (t) => p.onTabsBarPointerDown(t, e),
 			onClick: (t) => !e._disabled && e._uid !== n.activeTabUid && p.openTab(e._uid),
 			onFocus: (t) => n.$emit("focus", p.getOriginalItem(e)),
 			tabindex: !e._disabled && 0,
-			onKeypress: I((t) => !e._disabled && p.openTab(e._uid), ["enter"]),
+			onKeypress: F((t) => !e._disabled && p.openTab(e._uid), ["enter"]),
 			"aria-selected": e._uid === n.activeTabUid ? "true" : "false",
 			role: "tab"
-		}, [n.$slots[`item-title.${e.id || t + 1}`] ? w(n.$slots, `item-title.${e.id || t + 1}`, {
+		}, [n.$slots[`item-title.${e.id || t + 1}`] ? T(n.$slots, `item-title.${e.id || t + 1}`, {
 			key: 0,
 			item: p.getOriginalItem(e),
 			index: t + 1,
 			active: e._uid === n.activeTabUid
-		}) : w(n.$slots, "item-title", {
+		}) : T(n.$slots, "item-title", {
 			key: 1,
 			item: p.getOriginalItem(e),
 			index: t + 1,
 			active: e._uid === n.activeTabUid
-		}, () => [l("div", { innerHTML: e[u.itemTitleKey] }, null, 8, kr)])], 42, Or))), 128)),
-		n.$slots["tabs-bar-extra"] ? (b(), c("div", Ar, [w(n.$slots, "tabs-bar-extra")])) : s("", !0),
+		}, () => [l("div", { innerHTML: e[u.itemTitleKey] }, null, 8, Kr)])], 42, Gr))), 128)),
+		n.$slots["tabs-bar-extra"] ? (b(), c("div", qr, [T(n.$slots, "tabs-bar-extra")])) : s("", !0),
 		!u.noSlider && !u.card ? (b(), c("div", {
 			key: 1,
-			class: g(["w-tabs__slider", u.sliderColor]),
-			style: v(p.sliderStyles)
+			class: _(["w-tabs__slider", u.sliderColor]),
+			style: y(p.sliderStyles)
 		}, null, 6)) : s("", !0)
-	], 2), n.tabs.length ? (b(), c("div", jr, [u.keepInDom ? (b(), o(i, {
+	], 2), n.tabs.length ? (b(), c("div", Jr, [u.keepInDom ? (b(), o(i, {
 		key: 0,
 		name: p.transitionName
 	}, {
-		default: P(() => [(b(!0), c(e, null, C(n.tabs, (e, t) => F((b(), o(m, {
+		default: N(() => [(b(!0), c(e, null, w(n.tabs, (e, t) => P((b(), o(m, {
 			key: e._uid,
 			item: e,
-			class: g(p.contentClasses)
+			class: _(p.contentClasses)
 		}, {
-			default: P(() => [n.$slots[`item-content.${e._index + 1}`] ? w(n.$slots, `item-content.${e._index + 1}`, {
+			default: N(() => [n.$slots[`item-content.${e._index + 1}`] ? T(n.$slots, `item-content.${e._index + 1}`, {
 				key: 0,
 				item: p.getOriginalItem(e),
 				index: e._index + 1,
 				active: e._index === p.activeTab._index
-			}) : w(n.$slots, "item-content", {
+			}) : T(n.$slots, "item-content", {
 				key: 1,
 				item: p.getOriginalItem(e),
 				index: e._index + 1,
@@ -7056,26 +7543,26 @@ function Pr(n, a, u, d, f, p) {
 			}, () => [e[u.itemContentKey] ? (b(), c("div", {
 				key: 0,
 				innerHTML: e[u.itemContentKey]
-			}, null, 8, Mr)) : s("", !0)])]),
+			}, null, 8, Yr)) : s("", !0)])]),
 			_: 2
-		}, 1032, ["item", "class"])), [[N, e._uid === p.activeTab._uid]])), 128))]),
+		}, 1032, ["item", "class"])), [[ae, e._uid === p.activeTab._uid]])), 128))]),
 		_: 3
 	}, 8, ["name"])) : (b(), o(r, {
 		key: 1,
 		name: p.transitionName,
 		mode: p.transitionMode
 	}, {
-		default: P(() => [(b(), o(t, { exclude: u.keepAlive ? "" : "tab-content" }, [(b(), o(m, {
+		default: N(() => [(b(), o(t, { exclude: u.keepAlive ? "" : "tab-content" }, [(b(), o(m, {
 			key: n.activeTabUid,
 			item: p.activeTab,
-			class: g(u.contentClass)
+			class: _(u.contentClass)
 		}, {
-			default: P(({ item: t }) => [t ? (b(), c(e, { key: 0 }, [n.$slots[`item-content.${t._index + 1}`] ? w(n.$slots, `item-content.${t._index + 1}`, {
+			default: N(({ item: t }) => [t ? (b(), c(e, { key: 0 }, [n.$slots[`item-content.${t._index + 1}`] ? T(n.$slots, `item-content.${t._index + 1}`, {
 				key: 0,
 				item: p.getOriginalItem(t),
 				index: t._index + 1,
 				active: t._uid === n.activeTabUid
-			}) : w(n.$slots, "item-content", {
+			}) : T(n.$slots, "item-content", {
 				key: 1,
 				item: p.getOriginalItem(t),
 				index: t._index + 1,
@@ -7083,14 +7570,15 @@ function Pr(n, a, u, d, f, p) {
 			}, () => [t[u.itemContentKey] ? (b(), c("div", {
 				key: 0,
 				innerHTML: t[u.itemContentKey]
-			}, null, 8, Nr)) : s("", !0)])], 64)) : s("", !0)]),
+			}, null, 8, Xr)) : s("", !0)])], 64)) : s("", !0)]),
 			_: 3
 		}, 8, ["item", "class"]))], 1032, ["exclude"]))]),
 		_: 3
 	}, 8, ["name", "mode"]))])) : s("", !0)], 2);
 }
-var Fr = /* @__PURE__ */ Y({
+var Qr = /* @__PURE__ */ J({
 	name: "w-tabs",
+	mixins: [Z],
 	setup() {
 		return { tabsStableId: A() };
 	},
@@ -7154,7 +7642,7 @@ var Fr = /* @__PURE__ */ Y({
 			default: !1
 		}
 	},
-	components: { TabContent: Dr },
+	components: { TabContent: Wr },
 	emits: [
 		"input",
 		"update:modelValue",
@@ -7174,7 +7662,7 @@ var Fr = /* @__PURE__ */ Y({
 	}),
 	computed: {
 		contentClasses() {
-			return Z(this.contentClass);
+			return X(this.contentClass);
 		},
 		transitionName() {
 			return this.transition === !1 ? "" : this.transition || `w-tabs-slide-${this.direction}`;
@@ -7244,14 +7732,18 @@ var Fr = /* @__PURE__ */ Y({
 		barItemClasses(e) {
 			let t = e._index === this.activeTabIndex;
 			return {
+				"w-ripple": this.rippleActive,
 				[`${this.bgColor}--bg`]: this.bgColor,
 				[this.color]: this.color && !e._disabled && !(this.activeClass && t),
 				"w-tabs__bar-item--active": t,
 				"w-tabs__bar-item--disabled": e._disabled,
-				...Z(this.titleClass),
-				...t ? Z(this.activeClass) : {}
+				...X(this.titleClass),
+				...t ? X(this.activeClass) : {}
 			};
 		},
+		onTabsBarPointerDown(e, t) {
+			t._disabled || this.onRipple(e);
+		},
 		openTab(e) {
 			this.prevTabIndex = this.activeTabIndex;
 			let t = this.tabsByUid[e];
@@ -7306,57 +7798,57 @@ var Fr = /* @__PURE__ */ Y({
 			e ? window.removeEventListener("resize", this.onResize) : (this.updateSlider(), window.addEventListener("resize", this.onResize));
 		}
 	}
-}, [["render", Pr]]), Ir = { class: "w-table__scroll-wrap" }, Lr = { ref: "colgroup" }, Rr = ["width"], zr = { key: 0 }, Br = ["onClick"], Vr = ["innerHTML"], Hr = {
+}, [["render", Zr]]), $r = { class: "w-table__scroll-wrap" }, ei = { ref: "colgroup" }, ti = ["width"], ni = { key: 0 }, ri = ["onClick"], ii = ["innerHTML"], ai = {
 	key: 0,
 	class: "w-table__progress-bar"
-}, Ur = ["colspan"], Wr = {
+}, oi = ["colspan"], si = {
 	key: 0,
 	class: "w-table__progress-bar"
-}, Gr = ["colspan"], Kr = { class: "w-table__loading-text" }, qr = {
+}, ci = ["colspan"], li = { class: "w-table__loading-text" }, ui = {
 	key: 1,
 	class: "no-data"
-}, Jr = ["colspan"], Yr = ["onClick"], Xr = ["data-label"], Zr = ["data-label"], Qr = ["innerHTML"], $r = {
+}, di = ["colspan"], fi = ["onClick"], pi = ["data-label"], mi = ["data-label"], hi = ["innerHTML"], gi = {
 	key: 2,
 	class: "w-table__row w-table__row--expansion"
-}, ei = ["colspan"], ti = { key: 0 }, ni = {
+}, _i = ["colspan"], vi = { key: 0 }, yi = {
 	key: 3,
 	class: "w-table__extra-row"
-}, ri = {
+}, bi = {
 	key: 1,
 	class: "w-table__footer"
-}, ii = {
+}, xi = {
 	key: 1,
 	class: "w-table__row"
-}, ai = ["colspan"], oi = {
+}, Si = ["colspan"], Ci = {
 	key: 0,
 	class: "w-table__pagination w-pagination"
-}, si = { class: "pages-wrap" }, ci = { class: "w-pagination__results" };
-function li(t, n, r, i, a, u) {
-	let p = T("w-icon"), m = T("w-progress"), h = T("w-transition-fade"), _ = T("w-transition-expand"), v = T("w-select"), y = T("w-button");
-	return b(), c("div", { class: g(["w-table w-table--wrap", u.classes]) }, [l("div", Ir, [l("table", {
+}, wi = { class: "pages-wrap" }, Ti = { class: "w-pagination__results" };
+function Ei(t, n, r, i, a, u) {
+	let p = E("w-icon"), m = E("w-progress"), h = E("w-transition-fade"), g = E("w-transition-expand"), v = E("w-select"), y = E("w-button");
+	return b(), c("div", { class: _(["w-table w-table--wrap", u.classes]) }, [l("div", $r, [l("table", {
 		class: "w-table__table",
 		onMousedown: n[1] ||= (...e) => u.onMouseDown && u.onMouseDown(...e),
 		onMouseover: n[2] ||= (...e) => u.onMouseOver && u.onMouseOver(...e),
 		onMouseout: n[3] ||= (...e) => u.onMouseOut && u.onMouseOut(...e)
 	}, [
-		l("colgroup", Lr, [(b(!0), c(e, null, C(r.headers, (e, t) => (b(), c("col", {
-			class: g(["w-table__col", u.colClasses[t]]),
+		l("colgroup", ei, [(b(!0), c(e, null, w(r.headers, (e, t) => (b(), c("col", {
+			class: _(["w-table__col", u.colClasses[t]]),
 			key: t,
 			width: e.width || null
-		}, null, 10, Rr))), 128))], 512),
-		r.noHeaders ? s("", !0) : (b(), c("thead", zr, [l("tr", null, [(b(!0), c(e, null, C(r.headers, (i, a) => (b(), c("th", {
-			class: g(["w-table__header", u.headerClasses(i)]),
+		}, null, 10, ti))), 128))], 512),
+		r.noHeaders ? s("", !0) : (b(), c("thead", ni, [l("tr", null, [(b(!0), c(e, null, w(r.headers, (i, a) => (b(), c("th", {
+			class: _(["w-table__header", u.headerClasses(i)]),
 			key: a,
 			onClick: (e) => !t.colResizing.dragging && i.sortable !== !1 && u.sortTable(i)
 		}, [
 			i.sortable !== !1 && i.align === "right" ? (b(), o(p, {
 				key: 0,
-				class: g(["w-table__header-sort", u.headerSortClasses(i)])
+				class: _(["w-table__header-sort", u.headerSortClasses(i)])
 			}, {
-				default: P(() => [...n[8] ||= [d("wi-arrow-down", -1)]]),
+				default: N(() => [...n[8] ||= [d("wi-arrow-down", -1)]]),
 				_: 1
 			}, 8, ["class"])) : s("", !0),
-			i.label ? (b(), c(e, { key: 1 }, [t.$slots["header-label"] ? w(t.$slots, "header-label", {
+			i.label ? (b(), c(e, { key: 1 }, [t.$slots["header-label"] ? T(t.$slots, "header-label", {
 				key: 0,
 				header: i,
 				label: i.label,
@@ -7364,32 +7856,32 @@ function li(t, n, r, i, a, u) {
 			}, () => [d(O(i.label || ""), 1)]) : (b(), c("span", {
 				key: 1,
 				innerHTML: i.label || ""
-			}, null, 8, Vr))], 64)) : s("", !0),
+			}, null, 8, ii))], 64)) : s("", !0),
 			i.sortable !== !1 && i.align !== "right" ? (b(), o(p, {
 				key: 2,
-				class: g(["w-table__header-sort", u.headerSortClasses(i)])
+				class: _(["w-table__header-sort", u.headerSortClasses(i)])
 			}, {
-				default: P(() => [...n[9] ||= [d("wi-arrow-down", -1)]]),
+				default: N(() => [...n[9] ||= [d("wi-arrow-down", -1)]]),
 				_: 1
 			}, 8, ["class"])) : s("", !0),
 			a < r.headers.length - 1 && r.resizableColumns ? (b(), c("span", {
 				key: 3,
-				class: g(["w-table__col-resizer", {
+				class: _(["w-table__col-resizer", {
 					"w-table__col-resizer--hover": t.colResizing.hover === a,
 					"w-table__col-resizer--active": t.colResizing.columnIndex === a
 				}]),
-				onClick: n[0] ||= L(() => {}, ["stop"])
+				onClick: n[0] ||= I(() => {}, ["stop"])
 			}, null, 2)) : s("", !0)
-		], 10, Br))), 128))]), f(h, null, {
-			default: P(() => [r.loading === "header" ? (b(), c("tr", Hr, [l("td", { colspan: r.headers.length }, [f(m, { tile: "" })], 8, Ur)])) : s("", !0)]),
+		], 10, ri))), 128))]), f(h, null, {
+			default: N(() => [r.loading === "header" ? (b(), c("tr", ai, [l("td", { colspan: r.headers.length }, [f(m, { tile: "" })], 8, oi)])) : s("", !0)]),
 			_: 1
 		})])),
 		l("tbody", null, [
-			r.loading === !0 ? (b(), c("tr", Wr, [l("td", { colspan: r.headers.length }, [f(m, { tile: "" }), l("div", Kr, [w(t.$slots, "loading", {}, () => [n[10] ||= d("Loading...", -1)])])], 8, Gr)])) : u.tableItems.length ? s("", !0) : (b(), c("tr", qr, [l("td", {
+			r.loading === !0 ? (b(), c("tr", si, [l("td", { colspan: r.headers.length }, [f(m, { tile: "" }), l("div", li, [T(t.$slots, "loading", {}, () => [n[10] ||= d("Loading...", -1)])])], 8, ci)])) : u.tableItems.length ? s("", !0) : (b(), c("tr", ui, [l("td", {
 				class: "w-table__cell text-center",
 				colspan: r.headers.length
-			}, [w(t.$slots, "no-data", {}, () => [n[11] ||= d("No data to show.", -1)])], 8, Jr)])),
-			u.tableItems.length && r.loading !== !0 ? (b(!0), c(e, { key: 2 }, C(u.paginatedItems, (n, i) => (b(), c(e, { key: i }, [t.$slots.item ? w(t.$slots, "item", {
+			}, [T(t.$slots, "no-data", {}, () => [n[11] ||= d("No data to show.", -1)])], 8, di)])),
+			u.tableItems.length && r.loading !== !0 ? (b(!0), c(e, { key: 2 }, w(u.paginatedItems, (n, i) => (b(), c(e, { key: i }, [t.$slots.item ? T(t.$slots, "item", {
 				key: 0,
 				item: n,
 				index: i + 1,
@@ -7401,32 +7893,32 @@ function li(t, n, r, i, a, u) {
 				}
 			}) : (b(), c("tr", {
 				key: 1,
-				class: g(["w-table__row", {
+				class: _(["w-table__row", {
 					"w-table__row--selected": u.selectedRowsByUid[n._uid] !== void 0,
 					"w-table__row--expanded": u.expandedRowsByUid[n._uid] !== void 0,
 					[n.class]: n.class
 				}]),
 				onClick: (e) => u.doSelectRow(n, i)
-			}, [(b(!0), c(e, null, C(r.headers, (a, o) => (b(), c(e, null, [t.$slots[`item-cell.${a.key}`] || t.$slots[`item-cell.${o + 1}`] || t.$slots["item-cell"] ? (b(), c("td", {
-				class: g(["w-table__cell", {
+			}, [(b(!0), c(e, null, w(r.headers, (a, o) => (b(), c(e, null, [t.$slots[`item-cell.${a.key}`] || t.$slots[`item-cell.${o + 1}`] || t.$slots["item-cell"] ? (b(), c("td", {
+				class: _(["w-table__cell", {
 					[`text-${a.align || "left"}`]: !0,
 					"w-table__cell--sticky": a.sticky
 				}]),
 				key: `${o}-a`,
 				"data-label": a.label
-			}, [t.$slots[`item-cell.${a.key}`] ? w(t.$slots, `item-cell.${a.key}`, {
+			}, [t.$slots[`item-cell.${a.key}`] ? T(t.$slots, `item-cell.${a.key}`, {
 				key: 0,
 				header: a,
 				item: n,
 				label: n[a.key] || "",
 				index: i + 1
-			}) : t.$slots[`item-cell.${o + 1}`] ? w(t.$slots, `item-cell.${o + 1}`, {
+			}) : t.$slots[`item-cell.${o + 1}`] ? T(t.$slots, `item-cell.${o + 1}`, {
 				key: 1,
 				header: a,
 				item: n,
 				label: n[a.key] || "",
 				index: i + 1
-			}) : t.$slots["item-cell"] ? w(t.$slots, "item-cell", {
+			}) : t.$slots["item-cell"] ? T(t.$slots, "item-cell", {
 				key: 2,
 				header: a,
 				item: n,
@@ -7434,46 +7926,46 @@ function li(t, n, r, i, a, u) {
 				index: i + 1
 			}) : s("", !0), o < r.headers.length - 1 && r.resizableColumns ? (b(), c("span", {
 				key: 3,
-				class: g(["w-table__col-resizer", {
+				class: _(["w-table__col-resizer", {
 					"w-table__col-resizer--hover": t.colResizing.hover === o,
 					"w-table__col-resizer--active": t.colResizing.columnIndex === o
 				}])
-			}, null, 2)) : s("", !0)], 10, Xr)) : (b(), c("td", {
-				class: g(["w-table__cell", {
+			}, null, 2)) : s("", !0)], 10, pi)) : (b(), c("td", {
+				class: _(["w-table__cell", {
 					[`text-${a.align || "left"}`]: !0,
 					"w-table__cell--sticky": a.sticky
 				}]),
 				key: `${o}-b`,
 				"data-label": a.label
-			}, [l("div", { innerHTML: n[a.key] || "" }, null, 8, Qr), o < r.headers.length - 1 && r.resizableColumns ? (b(), c("span", {
+			}, [l("div", { innerHTML: n[a.key] || "" }, null, 8, hi), o < r.headers.length - 1 && r.resizableColumns ? (b(), c("span", {
 				key: 0,
-				class: g(["w-table__col-resizer", {
+				class: _(["w-table__col-resizer", {
 					"w-table__col-resizer--hover": t.colResizing.hover === o,
 					"w-table__col-resizer--active": t.colResizing.columnIndex === o
 				}])
-			}, null, 2)) : s("", !0)], 10, Zr))], 64))), 256))], 10, Yr)), u.expandedRowsByUid[n._uid] ? (b(), c("tr", $r, [l("td", {
+			}, null, 2)) : s("", !0)], 10, mi))], 64))), 256))], 10, fi)), u.expandedRowsByUid[n._uid] ? (b(), c("tr", gi, [l("td", {
 				class: "w-table__cell",
 				colspan: r.headers.length
-			}, [f(_, { y: "" }, {
-				default: P(() => [u.expandedRowsByUid[n._uid] ? (b(), c("div", ti, [w(t.$slots, "row-expansion", {
+			}, [f(g, { y: "" }, {
+				default: N(() => [u.expandedRowsByUid[n._uid] ? (b(), c("div", vi, [T(t.$slots, "row-expansion", {
 					item: n,
 					index: i + 1
 				})])) : s("", !0), i < r.headers.length - 1 && r.resizableColumns ? (b(), c("span", {
 					key: 1,
-					class: g(["w-table__col-resizer", {
+					class: _(["w-table__col-resizer", {
 						"w-table__col-resizer--hover": t.colResizing.hover === i,
 						"w-table__col-resizer--active": t.colResizing.columnIndex === t.j
 					}])
 				}, null, 2)) : s("", !0)]),
 				_: 2
-			}, 1024)], 8, ei)])) : s("", !0)], 64))), 128)) : s("", !0),
-			t.$slots["extra-row"] ? (b(), c("div", ni, [w(t.$slots, "extra-row")])) : s("", !0)
+			}, 1024)], 8, _i)])) : s("", !0)], 64))), 128)) : s("", !0),
+			t.$slots["extra-row"] ? (b(), c("div", yi, [T(t.$slots, "extra-row")])) : s("", !0)
 		]),
-		t.$slots.footer || t.$slots["footer-row"] ? (b(), c("tfoot", ri, [t.$slots["footer-row"] ? w(t.$slots, "footer-row", { key: 0 }) : t.$slots.footer ? (b(), c("tr", ii, [l("td", {
+		t.$slots.footer || t.$slots["footer-row"] ? (b(), c("tfoot", bi, [t.$slots["footer-row"] ? T(t.$slots, "footer-row", { key: 0 }) : t.$slots.footer ? (b(), c("tr", xi, [l("td", {
 			class: "w-table__cell",
 			colspan: r.headers.length
-		}, [w(t.$slots, "footer")], 8, ai)])) : s("", !0)])) : s("", !0)
-	], 32)]), r.pagination && t.paginationConfig ? (b(), c("div", oi, [w(t.$slots, "pagination", {
+		}, [T(t.$slots, "footer")], 8, Si)])) : s("", !0)])) : s("", !0)
+	], 32)]), r.pagination && t.paginationConfig ? (b(), c("div", Ci, [T(t.$slots, "pagination", {
 		range: `${t.paginationConfig.start}-${t.paginationConfig.end}`,
 		total: t.paginationConfig.total,
 		pagesCount: t.paginationConfig.pagesCount,
@@ -7491,7 +7983,7 @@ function li(t, n, r, i, a, u) {
 			label: "Items per page",
 			"label-color": "inherit"
 		}, null, 8, ["modelValue", "items"])) : s("", !0),
-		l("div", si, [
+		l("div", wi, [
 			f(y, {
 				class: "w-pagination__arrow w-pagination__arrow--prev",
 				onClick: n[6] ||= (e) => u.goToPage("-1"),
@@ -7500,7 +7992,7 @@ function li(t, n, r, i, a, u) {
 				text: "",
 				lg: ""
 			}, null, 8, ["disabled"]),
-			t.paginationConfig.pagesCount > 7 ? (b(!0), c(e, { key: 0 }, C(t.paginationConfig.pagesCount, (r) => (b(), c(e, { key: r }, [[
+			t.paginationConfig.pagesCount > 7 ? (b(!0), c(e, { key: 0 }, w(t.paginationConfig.pagesCount, (r) => (b(), c(e, { key: r }, [[
 				1,
 				t.paginationConfig.pagesCount,
 				t.paginationConfig.page - 1,
@@ -7508,12 +8000,12 @@ function li(t, n, r, i, a, u) {
 				t.paginationConfig.page + 1
 			].includes(r) ? (b(), o(y, {
 				key: 0,
-				class: g(["w-pagination__page", { "w-pagination__page--active": r === t.paginationConfig.page }]),
+				class: _(["w-pagination__page", { "w-pagination__page--active": r === t.paginationConfig.page }]),
 				onClick: (e) => r !== t.paginationConfig.page && u.goToPage(r),
 				round: "",
 				lg: ""
 			}, {
-				default: P(() => [d(O(r), 1)]),
+				default: N(() => [d(O(r), 1)]),
 				_: 2
 			}, 1032, ["onClick", "class"])) : [
 				1,
@@ -7523,21 +8015,21 @@ function li(t, n, r, i, a, u) {
 				t.paginationConfig.page + 1
 			].includes(r - 1) ? (b(), o(y, {
 				key: 1,
-				class: g(["w-pagination__page", { "w-pagination__page--active": r === t.paginationConfig.page }]),
+				class: _(["w-pagination__page", { "w-pagination__page--active": r === t.paginationConfig.page }]),
 				onClick: (e) => r !== t.paginationConfig.page && u.goToPage(r),
 				round: "",
 				lg: ""
 			}, {
-				default: P(() => [...n[12] ||= [d("...", -1)]]),
+				default: N(() => [...n[12] ||= [d("...", -1)]]),
 				_: 1
-			}, 8, ["onClick", "class"])) : s("", !0)], 64))), 128)) : (b(!0), c(e, { key: 1 }, C(t.paginationConfig.pagesCount, (e) => (b(), o(y, {
-				class: g(["w-pagination__page", { "w-pagination__page--active": e === t.paginationConfig.page }]),
+			}, 8, ["onClick", "class"])) : s("", !0)], 64))), 128)) : (b(!0), c(e, { key: 1 }, w(t.paginationConfig.pagesCount, (e) => (b(), o(y, {
+				class: _(["w-pagination__page", { "w-pagination__page--active": e === t.paginationConfig.page }]),
 				key: e,
 				onClick: (n) => e !== t.paginationConfig.page && u.goToPage(e),
 				round: "",
 				lg: ""
 			}, {
-				default: P(() => [d(O(e), 1)]),
+				default: N(() => [d(O(e), 1)]),
 				_: 2
 			}, 1032, ["onClick", "class"]))), 128)),
 			f(y, {
@@ -7549,12 +8041,12 @@ function li(t, n, r, i, a, u) {
 				lg: ""
 			}, null, 8, ["disabled"])
 		]),
-		l("span", ci, O(t.paginationConfig.start) + "-" + O(t.paginationConfig.end || t.paginationConfig.total) + " of " + O(t.paginationConfig.total), 1)
+		l("span", Ti, O(t.paginationConfig.start) + "-" + O(t.paginationConfig.end || t.paginationConfig.total) + " of " + O(t.paginationConfig.total), 1)
 	])])) : s("", !0)], 2);
 }
 //#endregion
 //#region src/wave-ui/components/w-table.vue
-var ui = 15, di = /* @__PURE__ */ Y({
+var Di = 15, Oi = /* @__PURE__ */ J({
 	name: "w-table",
 	props: {
 		items: {
@@ -7753,9 +8245,9 @@ var ui = 15, di = /* @__PURE__ */ Y({
 			this.colResizing.dragging = !0;
 			let o = e.pageX - t, s = i + a, c = i + o, l = a - o;
 			n.style.width = `${i + o}px`, r.style.width = `${a - o}px`;
-			let u = o < 0 && n.offsetWidth > c || n.offsetWidth <= ui, d = o > 0 && r.offsetWidth > l;
+			let u = o < 0 && n.offsetWidth > c || n.offsetWidth <= Di, d = o > 0 && r.offsetWidth > l;
 			if (u) {
-				let e = Math.max(n.offsetWidth, ui);
+				let e = Math.max(n.offsetWidth, Di);
 				n.style.width = `${e}px`, r.style.width = `${s - e}px`;
 			} else d && (n.style.width = `${s - r.offsetWidth}px`, r.style.width = `${r.offsetWidth}px`);
 		},
@@ -7842,36 +8334,38 @@ var ui = 15, di = /* @__PURE__ */ Y({
 			this.updatePaginationConfig({ total: e });
 		}
 	}
-}, [["render", li]]), fi = [
+}, [["render", Ei]]), ki = [
 	"role",
 	"aria-pressed",
 	"tabindex"
 ];
-function pi(e, t, n, r, i, a) {
+function Ai(e, t, n, r, i, a) {
 	return b(), c("span", {
-		class: g(["w-tag", a.classes]),
+		class: _(["w-tag", a.classes]),
 		onClick: t[1] ||= (t) => {
 			e.$emit("update:modelValue", !n.modelValue), e.$emit("input", !n.modelValue);
 		},
-		onKeypress: t[2] ||= I((t) => {
+		onPointerdown: t[2] ||= (...e) => a.onTagPointerDown && a.onTagPointerDown(...e),
+		onKeypress: t[3] ||= F((t) => {
 			e.$emit("update:modelValue", !n.modelValue), e.$emit("input", !n.modelValue);
 		}, ["enter"]),
 		role: n.modelValue !== -1 && "button",
 		"aria-pressed": n.modelValue !== -1 && (n.modelValue ? "true" : "false"),
 		tabindex: n.modelValue !== -1 && 0,
-		style: v(a.styles)
-	}, [w(e.$slots, "default"), n.closable && n.modelValue ? (b(), c("i", {
+		style: y(a.styles)
+	}, [T(e.$slots, "default"), n.closable && n.modelValue ? (b(), c("i", {
 		key: 0,
 		class: "w-icon w-tag__closable wi-cross",
-		onClick: t[0] ||= L((t) => {
+		onClick: t[0] ||= I((t) => {
 			e.$emit("update:modelValue", !1), e.$emit("input", !1);
 		}, ["stop"]),
 		role: "icon",
 		"aria-hidden": "true"
-	})) : s("", !0)], 46, fi);
+	})) : s("", !0)], 46, ki);
 }
-var mi = /* @__PURE__ */ Y({
+var ji = /* @__PURE__ */ J({
 	name: "w-tag",
+	mixins: [Z],
 	props: {
 		modelValue: {
 			type: [Boolean, Number],
@@ -7905,6 +8399,7 @@ var mi = /* @__PURE__ */ Y({
 				[this.color]: this.color,
 				[`${this.bgColor}--bg`]: this.bgColor,
 				[`size--${this.presetSize}`]: !0,
+				"w-ripple": this.rippleActive && this.modelValue !== -1,
 				"w-tag--dark": this.dark,
 				"w-tag--light": this.light,
 				"w-tag--clickable": this.modelValue !== -1,
@@ -7921,8 +8416,11 @@ var mi = /* @__PURE__ */ Y({
 				height: (isNaN(this.height) ? this.height : `${this.height}px`) || null
 			};
 		}
-	}
-}, [["render", pi]]), hi = ["for"], gi = [
+	},
+	methods: { onTagPointerDown(e) {
+		this.modelValue !== -1 && (e.target.closest?.(".w-tag__closable") || this.onRipple(e));
+	} }
+}, [["render", Ai]]), Mi = ["for"], Ni = [
 	"id",
 	"name",
 	"placeholder",
@@ -7933,9 +8431,9 @@ var mi = /* @__PURE__ */ Y({
 	"disabled",
 	"required",
 	"tabindex"
-], _i = ["for"];
-function vi(t, n, r, i, a, u) {
-	let f = T("w-icon");
+], Pi = ["for"];
+function Fi(t, n, r, i, a, u) {
+	let f = E("w-icon");
 	return b(), o(D(t.formRegister ? "w-form-element" : "div"), h({ ref: "formEl" }, t.formRegister && {
 		validators: t.validators,
 		inputValue: a.inputValue,
@@ -7953,24 +8451,24 @@ function vi(t, n, r, i, a, u) {
 		class: u.classes,
 		style: t.$attrs.style
 	}), {
-		default: P(() => [
+		default: N(() => [
 			r.labelPosition === "left" ? (b(), c(e, { key: 0 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-textarea__label w-textarea__label--left w-form-el-shakable", t.labelClasses]),
+				class: _(["w-textarea__label w-textarea__label--left w-form-el-shakable", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, hi)) : s("", !0)], 64)) : s("", !0),
-			l("div", { class: g(["w-textarea__textarea-wrap", u.inputWrapClasses]) }, [
-				w(t.$slots, "icon-left", { inputId: t.inputId }, () => [r.innerIconLeft ? (b(), o(f, {
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, Mi)) : s("", !0)], 64)) : s("", !0),
+			l("div", { class: _(["w-textarea__textarea-wrap", u.inputWrapClasses]) }, [
+				T(t.$slots, "icon-left", { inputId: t.inputId }, () => [r.innerIconLeft ? (b(), o(f, {
 					key: 0,
 					class: "w-textarea__icon w-textarea__icon--inner-left",
 					tag: "label",
 					for: t.inputId,
 					onClick: n[0] ||= (e) => t.$emit("click:inner-icon-left", e)
 				}, {
-					default: P(() => [d(O(r.innerIconLeft), 1)]),
+					default: N(() => [d(O(r.innerIconLeft), 1)]),
 					_: 1
 				}, 8, ["for"])) : s("", !0)]),
-				F(l("textarea", h({
+				P(l("textarea", h({
 					class: "w-textarea__textarea",
 					ref: "textarea",
 					"onUpdate:modelValue": n[1] ||= (e) => a.inputValue = e
@@ -7988,27 +8486,27 @@ function vi(t, n, r, i, a, u) {
 					disabled: t.isDisabled || null,
 					required: t.required || null,
 					tabindex: t.tabindex || null
-				}), null, 16, gi), [[M, a.inputValue]]),
+				}), null, 16, Ni), [[M, a.inputValue]]),
 				r.labelPosition === "inside" && u.showLabelInside ? (b(), c(e, { key: 0 }, [t.$slots.default || r.label ? (b(), c("label", {
 					key: 0,
-					class: g(["w-textarea__label w-textarea__label--inside w-form-el-shakable", t.labelClasses])
-				}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
-				w(t.$slots, "icon-right", { inputId: t.inputId }, () => [r.innerIconRight ? (b(), o(f, {
+					class: _(["w-textarea__label w-textarea__label--inside w-form-el-shakable", t.labelClasses])
+				}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 2)) : s("", !0)], 64)) : s("", !0),
+				T(t.$slots, "icon-right", { inputId: t.inputId }, () => [r.innerIconRight ? (b(), o(f, {
 					key: 0,
 					class: "w-textarea__icon w-textarea__icon--inner-right",
 					tag: "label",
 					for: t.inputId,
 					onClick: n[5] ||= (e) => t.$emit("click:inner-icon-right", e)
 				}, {
-					default: P(() => [d(O(r.innerIconRight), 1)]),
+					default: N(() => [d(O(r.innerIconRight), 1)]),
 					_: 1
 				}, 8, ["for"])) : s("", !0)])
 			], 2),
 			r.labelPosition === "right" ? (b(), c(e, { key: 1 }, [t.$slots.default || r.label ? (b(), c("label", {
 				key: 0,
-				class: g(["w-textarea__label w-textarea__label--right w-form-el-shakable", t.labelClasses]),
+				class: _(["w-textarea__label w-textarea__label--right w-form-el-shakable", t.labelClasses]),
 				for: t.inputId
-			}, [w(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, _i)) : s("", !0)], 64)) : s("", !0)
+			}, [T(t.$slots, "default", {}, () => [d(O(r.label), 1)])], 10, Pi)) : s("", !0)], 64)) : s("", !0)
 		]),
 		_: 3
 	}, 16, [
@@ -8018,10 +8516,13 @@ function vi(t, n, r, i, a, u) {
 		"style"
 	]);
 }
-var yi = /* @__PURE__ */ Y({
+var Ii = /* @__PURE__ */ J({
 	name: "w-textarea",
-	mixins: [Q],
+	mixins: [$],
 	inheritAttrs: !1,
+	setup() {
+		return Q();
+	},
 	props: {
 		modelValue: { default: "" },
 		label: { type: String },
@@ -8153,31 +8654,31 @@ var yi = /* @__PURE__ */ Y({
 			e ? this.getLineHeight() : this.height = null;
 		}
 	}
-}, [["render", vi]]), bi = ["innerHTML"], xi = ["innerHTML"];
-function Si(t, n, r, i, a, s) {
-	return b(), c("ul", { class: g(["w-timeline", s.classes]) }, [(b(!0), c(e, null, C(r.items, (e, n) => (b(), c("li", {
+}, [["render", Fi]]), Li = ["innerHTML"], Ri = ["innerHTML"];
+function zi(t, n, r, i, a, s) {
+	return b(), c("ul", { class: _(["w-timeline", s.classes]) }, [(b(!0), c(e, null, w(r.items, (e, n) => (b(), c("li", {
 		class: "w-timeline-item",
 		key: n
-	}, [(b(), o(D(e[r.itemIconKey] || r.icon ? "w-icon" : "div"), { class: g(["w-timeline-item__bullet", { [e[r.itemColorKey] || r.color]: e[r.itemColorKey] || r.color }]) }, {
-		default: P(() => [d(O(e[r.itemIconKey] || r.icon), 1)]),
+	}, [(b(), o(D(e[r.itemIconKey] || r.icon ? "w-icon" : "div"), { class: _(["w-timeline-item__bullet", { [e[r.itemColorKey] || r.color]: e[r.itemColorKey] || r.color }]) }, {
+		default: N(() => [d(O(e[r.itemIconKey] || r.icon), 1)]),
 		_: 2
-	}, 1032, ["class"])), t.$slots[`item.${n + 1}`] ? w(t.$slots, `item.${n + 1}`, {
+	}, 1032, ["class"])), t.$slots[`item.${n + 1}`] ? T(t.$slots, `item.${n + 1}`, {
 		key: 1,
 		item: e,
 		index: n + 1
-	}) : w(t.$slots, "item", {
+	}) : T(t.$slots, "item", {
 		key: 0,
 		item: e,
 		index: n + 1
 	}, () => [l("div", {
-		class: g(["w-timeline-item__title", { [e[r.itemColorKey] || r.color]: e[r.itemColorKey] || r.color }]),
+		class: _(["w-timeline-item__title", { [e[r.itemColorKey] || r.color]: e[r.itemColorKey] || r.color }]),
 		innerHTML: e[r.itemTitleKey]
-	}, null, 10, bi), l("div", {
+	}, null, 10, Li), l("div", {
 		class: "w-timeline-item__content",
 		innerHTML: e[r.itemContentKey]
-	}, null, 8, xi)])]))), 128))], 2);
+	}, null, 8, Ri)])]))), 128))], 2);
 }
-var Ci = /* @__PURE__ */ Y({
+var Bi = /* @__PURE__ */ J({
 	name: "w-timeline",
 	props: {
 		items: {
@@ -8212,16 +8713,16 @@ var Ci = /* @__PURE__ */ Y({
 			"w-timeline--light": this.light
 		};
 	} }
-}, [["render", Si]]);
+}, [["render", zi]]);
 //#endregion
 //#region src/wave-ui/components/w-toolbar.vue?vue&type=template&lang.js
-function wi(e, t, n, r, i, a) {
+function Vi(e, t, n, r, i, a) {
 	return b(), c("div", {
-		class: g(["w-toolbar", a.classes]),
-		style: v(a.styles)
-	}, [w(e.$slots, "default")], 6);
+		class: _(["w-toolbar", a.classes]),
+		style: y(a.styles)
+	}, [T(e.$slots, "default")], 6);
 }
-var Ti = /* @__PURE__ */ Y({
+var Hi = /* @__PURE__ */ J({
 	name: "w-toolbar",
 	props: {
 		color: { type: String },
@@ -8276,27 +8777,27 @@ var Ti = /* @__PURE__ */ Y({
 			};
 		}
 	}
-}, [["render", wi]]);
+}, [["render", Vi]]);
 //#endregion
 //#region src/wave-ui/components/w-tooltip.vue?vue&type=template&lang.js
-function Ei(t, n, i, a, o, l) {
-	return b(), c(e, null, [w(t.$slots, "activator", { on: l.activatorEventHandlers }), f(r, {
+function Ui(t, n, i, a, o, l) {
+	return b(), c(e, null, [T(t.$slots, "activator", { on: l.activatorEventHandlers }), f(r, {
 		name: l.transitionName,
 		appear: "",
 		onAfterLeave: t.onAfterLeave
 	}, {
-		default: P(() => [t.detachableVisible ? (b(), c("div", {
-			class: g(["w-tooltip", l.classes]),
+		default: N(() => [t.detachableVisible ? (b(), c("div", {
+			class: _(["w-tooltip", l.classes]),
 			ref: "detachable",
 			key: a.tooltipInstanceId,
-			style: v(l.styles)
-		}, [w(t.$slots, "default")], 6)) : s("", !0)]),
+			style: y(l.styles)
+		}, [T(t.$slots, "default")], 6)) : s("", !0)]),
 		_: 3
 	}, 8, ["name", "onAfterLeave"])], 64);
 }
-var Di = /* @__PURE__ */ Y({
+var Wi = /* @__PURE__ */ J({
 	name: "w-tooltip",
-	mixins: [gn],
+	mixins: [Dn],
 	setup() {
 		return { tooltipInstanceId: A() };
 	},
@@ -8345,7 +8846,7 @@ var Di = /* @__PURE__ */ Y({
 	}),
 	computed: {
 		tooltipClasses() {
-			return Z(this.tooltipClass);
+			return X(this.tooltipClass);
 		},
 		transitionName() {
 			let e = this.effectiveDetachablePosition.replace(/top|bottom/, (e) => ({
@@ -8410,25 +8911,25 @@ var Di = /* @__PURE__ */ Y({
 			this.detachableVisible && (this.showOnHover && !e && (await new Promise((e) => setTimeout(e, 10)), this.showOnHover && this.hoveringActivator) || (this.$emit("update:modelValue", this.detachableVisible = !1), this.$emit("input", !1), this.$emit("close"), this.viewportPlacementOverride = null, typeof document < "u" && document.removeEventListener("mousedown", this.onOutsideMousedown), typeof window < "u" && window.removeEventListener("resize", this.onResize)));
 		}
 	}
-}, [["render", Ei]]);
+}, [["render", Ui]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-bounce.vue?vue&type=template&lang.js
-function Oi(e, t, n, i, a, s) {
+function Gi(e, t, n, i, a, s) {
 	return b(), o(r, h({ name: "bounce" }, e.$props), {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16);
 }
-var ki = /* @__PURE__ */ Y({
+var Ki = /* @__PURE__ */ J({
 	name: "w-transition-bounce",
 	props: {
 		appear: { type: Boolean },
 		duration: { type: [Number, String] }
 	}
-}, [["render", Oi]]);
+}, [["render", Gi]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-expand.vue?vue&type=template&lang.js
-function Ai(e, t, n, i, a, s) {
+function qi(e, t, n, i, a, s) {
 	return b(), o(r, {
 		name: "expand",
 		mode: "out-in",
@@ -8443,7 +8944,7 @@ function Ai(e, t, n, i, a, s) {
 		onLeave: s.leave,
 		onAfterLeave: s.afterLeave
 	}, {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 8, [
 		"onBeforeAppear",
@@ -8457,7 +8958,7 @@ function Ai(e, t, n, i, a, s) {
 		"onAfterLeave"
 	]);
 }
-var ji = /* @__PURE__ */ Y({
+var Ji = /* @__PURE__ */ J({
 	name: "w-transition-expand",
 	props: {
 		x: { type: Boolean },
@@ -8550,61 +9051,61 @@ var ji = /* @__PURE__ */ Y({
 			this.animX && (this.el.width = e.offsetWidth, this.el.marginLeft = t.getPropertyValue("marginLeft"), this.el.marginRight = t.getPropertyValue("marginRight"), this.el.paddingLeft = t.getPropertyValue("paddingLeft"), this.el.paddingRight = t.getPropertyValue("paddingRight"), this.el.borderLeftWidth = t.getPropertyValue("borderLeftWidth"), this.el.borderRightWidth = t.getPropertyValue("borderRightWidth")), this.animY && (this.el.height = e.offsetHeight, this.el.marginTop = t.getPropertyValue("marginTop"), this.el.marginBottom = t.getPropertyValue("marginBottom"), this.el.paddingTop = t.getPropertyValue("paddingTop"), this.el.paddingBottom = t.getPropertyValue("paddingBottom"), this.el.borderTopWidth = t.getPropertyValue("borderTopWidth"), this.el.borderBottomWidth = t.getPropertyValue("borderBottomWidth")), this.el.savedState = !0;
 		}
 	}
-}, [["render", Ai]]);
+}, [["render", qi]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-fade.vue?vue&type=template&lang.js
-function Mi(e, t, n, i, a, s) {
+function Yi(e, t, n, i, a, s) {
 	return b(), o(r, h({ name: "fade" }, e.$props), {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16);
 }
-var Ni = /* @__PURE__ */ Y({
+var Xi = /* @__PURE__ */ J({
 	name: "w-transition-fade",
 	props: {
 		appear: { type: Boolean },
 		duration: { type: [Number, String] }
 	}
-}, [["render", Mi]]);
+}, [["render", Yi]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-scale.vue?vue&type=template&lang.js
-function Pi(e, t, n, i, a, s) {
+function Zi(e, t, n, i, a, s) {
 	return b(), o(r, h({ name: "scale" }, e.$props), {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16);
 }
-var Fi = /* @__PURE__ */ Y({
+var Qi = /* @__PURE__ */ J({
 	name: "w-transition-scale",
 	props: {
 		appear: { type: Boolean },
 		duration: { type: [Number, String] }
 	}
-}, [["render", Pi]]);
+}, [["render", Zi]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-scale-fade.vue?vue&type=template&lang.js
-function Ii(e, t, n, i, a, s) {
+function $i(e, t, n, i, a, s) {
 	return b(), o(r, h({ name: "scale-fade" }, e.$props), {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16);
 }
-var Li = /* @__PURE__ */ Y({
+var ea = /* @__PURE__ */ J({
 	name: "w-transition-scale-fade",
 	props: {
 		appear: { type: Boolean },
 		duration: { type: [Number, String] }
 	}
-}, [["render", Ii]]);
+}, [["render", $i]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-slide.vue?vue&type=template&lang.js
-function Ri(e, t, n, i, a, s) {
+function ta(e, t, n, i, a, s) {
 	return b(), o(r, h({ name: s.transitionName }, e.$props), {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16, ["name"]);
 }
-var zi = /* @__PURE__ */ Y({
+var na = /* @__PURE__ */ J({
 	name: "w-transition-slide",
 	props: {
 		appear: { type: Boolean },
@@ -8622,16 +9123,16 @@ var zi = /* @__PURE__ */ Y({
 			return `slide-${this.direction}`;
 		}
 	}
-}, [["render", Ri]]);
+}, [["render", ta]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-slide-fade.vue?vue&type=template&lang.js
-function Bi(e, t, n, i, a, s) {
+function ra(e, t, n, i, a, s) {
 	return b(), o(r, h({ name: s.transitionName }, e.$props), {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16, ["name"]);
 }
-var Vi = /* @__PURE__ */ Y({
+var ia = /* @__PURE__ */ J({
 	name: "w-transition-slide-fade",
 	props: {
 		appear: { type: Boolean },
@@ -8649,39 +9150,39 @@ var Vi = /* @__PURE__ */ Y({
 			return `slide-fade-${this.direction}`;
 		}
 	}
-}, [["render", Bi]]);
+}, [["render", ra]]);
 //#endregion
 //#region src/wave-ui/components/transitions/w-transition-twist.vue?vue&type=template&lang.js
-function Hi(e, t, n, i, a, s) {
+function aa(e, t, n, i, a, s) {
 	return b(), o(r, h({ name: "twist" }, e.$props), {
-		default: P(() => [w(e.$slots, "default")]),
+		default: N(() => [T(e.$slots, "default")]),
 		_: 3
 	}, 16);
 }
-var Ui = /* @__PURE__ */ Y({
+var oa = /* @__PURE__ */ J({
 	name: "w-transition-twist",
 	props: {
 		appear: { type: Boolean },
 		duration: { type: [Number, String] }
 	}
-}, [["render", Hi]]), Wi = ["innerHTML"], Gi = {
+}, [["render", aa]]), sa = ["innerHTML"], ca = {
 	key: 1,
 	class: "ml1"
 };
-function Ki(t, n, r, i, a, u) {
-	let f = T("w-button"), p = T("w-icon"), m = T("w-tree", !0);
-	return b(), c("ul", { class: g(["w-tree", u.classes]) }, [(b(!0), c(e, null, C(t.currentDepthItems, (e, i) => (b(), c("li", {
-		class: g(["w-tree__item", u.itemClasses(e)]),
+function la(t, n, r, i, a, u) {
+	let f = E("w-button"), p = E("w-icon"), m = E("w-tree", !0);
+	return b(), c("ul", { class: _(["w-tree", u.classes]) }, [(b(!0), c(e, null, w(t.currentDepthItems, (e, i) => (b(), c("li", {
+		class: _(["w-tree__item", u.itemClasses(e)]),
 		key: i
 	}, [(b(), o(D(u.getTreeItemComponent(e)), h({ class: "w-tree__item-label" }, { ref_for: !0 }, e.route && { [!t.$router || u.hasExternalLink(e) ? "href" : "to"]: e.route }, {
 		onClick: (t) => !r.disabled && !e.disabled && u.onLabelClick(e, t),
 		onKeydown: (t) => !r.disabled && !e.disabled && u.onLabelKeydown(e, t),
 		tabindex: u.getTreeItemTabindex(e)
 	}), {
-		default: P(() => [(e.children || e.branch) && (r.expandOpenIcon && e.open || r.expandIcon) && !(r.unexpandableEmpty && !e.children) ? (b(), o(f, {
+		default: N(() => [(e.children || e.branch) && (r.expandOpenIcon && e.open || r.expandIcon) && !(r.unexpandableEmpty && !e.children) ? (b(), o(f, {
 			key: 0,
 			class: "w-tree__item-expand",
-			onClick: L((t) => !r.disabled && !e.disabled && u.onLabelClick(e, t), ["stop"]),
+			onClick: I((t) => !r.disabled && !e.disabled && u.onLabelClick(e, t), ["stop"]),
 			color: "inherit",
 			icon: e.open && r.expandOpenIcon || r.expandIcon,
 			"icon-props": { rotate90a: !e.open },
@@ -8694,7 +9195,7 @@ function Ki(t, n, r, i, a, u) {
 			"icon",
 			"icon-props",
 			"disabled"
-		])) : s("", !0), w(t.$slots, "item", {
+		])) : s("", !0), T(t.$slots, "item", {
 			item: e.originalItem,
 			depth: r.depth,
 			path: e.path,
@@ -8705,11 +9206,11 @@ function Ki(t, n, r, i, a, u) {
 				class: "w-tree__item-icon",
 				color: e.originalItem[r.itemIconColorKey] || r.iconColor
 			}, {
-				default: P(() => [d(O(u.itemIcon(e)), 1)]),
+				default: N(() => [d(O(u.itemIcon(e)), 1)]),
 				_: 2
 			}, 1032, ["color"])) : s("", !0),
-			l("span", { innerHTML: e.label }, null, 8, Wi),
-			r.counts && (e.children || e.branch) ? (b(), c("span", Gi, "(" + O(e.originalItem.children?.length || 0) + ")", 1)) : s("", !0)
+			l("span", { innerHTML: e.label }, null, 8, sa),
+			r.counts && (e.children || e.branch) ? (b(), c("span", ca, "(" + O(e.originalItem.children?.length || 0) + ")", 1)) : s("", !0)
 		])]),
 		_: 2
 	}, 1040, [
@@ -8721,7 +9222,7 @@ function Ki(t, n, r, i, a, u) {
 		onAfterEnter: (n) => t.$emit("open", u.emitPayload(e)),
 		onAfterLeave: (n) => t.$emit("close", u.emitPayload(e))
 	}, {
-		default: P(() => [e.children && e.open ? (b(), o(m, h({
+		default: N(() => [e.children && e.open ? (b(), o(m, h({
 			key: 0,
 			ref_for: !0
 		}, t.$props, {
@@ -8736,7 +9237,7 @@ function Ki(t, n, r, i, a, u) {
 			onSelect: n[5] ||= (e) => t.$emit("select", e),
 			"onUpdate:modelValue": n[6] ||= (e) => t.$emit("update:model-value", e)
 		}), {
-			item: P(({ item: e, depth: n, path: r, open: i }) => [w(t.$slots, "item", {
+			item: N(({ item: e, depth: n, path: r, open: i }) => [T(t.$slots, "item", {
 				item: e,
 				depth: n,
 				path: r,
@@ -8755,7 +9256,7 @@ function Ki(t, n, r, i, a, u) {
 		"onAfterLeave"
 	]))], 2))), 128))], 2);
 }
-var qi = /* @__PURE__ */ Y({
+var ua = /* @__PURE__ */ J({
 	name: "w-tree",
 	props: {
 		modelValue: { type: [Object, Array] },
@@ -8940,66 +9441,66 @@ var qi = /* @__PURE__ */ Y({
 	unmounted() {
 		this.dataPropUnwatch();
 	}
-}, [["render", Ki]]), Ji = /* @__PURE__ */ ne({
-	WAccordion: () => Be,
-	WAccordionItem: () => Re,
-	WAlert: () => Ue,
-	WApp: () => tt,
-	WAutocomplete: () => Qe,
-	WBadge: () => it,
-	WBreadcrumbs: () => st,
-	WButton: () => pt,
-	WCard: () => gt,
-	WCheckbox: () => Ct,
-	WCheckboxes: () => Et,
-	WConfirm: () => Ot,
-	WDatePicker: () => At,
-	WDialog: () => Mt,
-	WDivider: () => Ft,
-	WDrawer: () => zt,
-	WFlex: () => Vt,
-	WForm: () => Wt,
-	WFormElement: () => Kt,
-	WGrid: () => Jt,
-	WIcon: () => Xt,
-	WImage: () => en,
-	WInput: () => dn,
-	WList: () => pn,
-	WMenu: () => vn,
-	WNotification: () => bn,
-	WOverlay: () => Sn,
-	WParallax: () => Tn,
-	WProgress: () => Mn,
-	WRadio: () => zn,
-	WRadios: () => Hn,
-	WRating: () => Kn,
-	WScrollable: () => qn,
-	WSelect: () => $n,
-	WSlider: () => fr,
-	WSpinner: () => hr,
-	WSteps: () => _r,
-	WSwitch: () => wr,
-	WTable: () => di,
-	WTabs: () => Fr,
-	WTag: () => mi,
-	WTextarea: () => yi,
-	WTimeline: () => Ci,
-	WToolbar: () => Ti,
-	WTooltip: () => Di,
-	WTransitionBounce: () => ki,
-	WTransitionExpand: () => ji,
-	WTransitionFade: () => Ni,
-	WTransitionScale: () => Fi,
-	WTransitionScaleFade: () => Li,
-	WTransitionSlide: () => zi,
-	WTransitionSlideFade: () => Vi,
-	WTransitionTwist: () => Ui,
-	WTree: () => qi
-}), Yi = X.install;
-X.install = (e, t = {}) => Yi.call(X, e, {
-	components: Ji,
+}, [["render", la]]), da = /* @__PURE__ */ L({
+	WAccordion: () => Ze,
+	WAccordionItem: () => Ye,
+	WAlert: () => et,
+	WApp: () => ft,
+	WAutocomplete: () => lt,
+	WBadge: () => ht,
+	WBreadcrumbs: () => vt,
+	WButton: () => wt,
+	WCard: () => Dt,
+	WCheckbox: () => Pt,
+	WCheckboxes: () => Lt,
+	WConfirm: () => zt,
+	WDatePicker: () => Vt,
+	WDialog: () => Ut,
+	WDivider: () => Kt,
+	WDrawer: () => Xt,
+	WFlex: () => Qt,
+	WForm: () => tn,
+	WFormElement: () => rn,
+	WGrid: () => on,
+	WIcon: () => cn,
+	WImage: () => fn,
+	WInput: () => Sn,
+	WList: () => wn,
+	WMenu: () => kn,
+	WNotification: () => jn,
+	WOverlay: () => Nn,
+	WParallax: () => In,
+	WProgress: () => Wn,
+	WRadio: () => Zn,
+	WRadios: () => er,
+	WRating: () => ir,
+	WScrollable: () => ur,
+	WSelect: () => gr,
+	WSlider: () => kr,
+	WSpinner: () => Mr,
+	WSteps: () => Pr,
+	WSwitch: () => Vr,
+	WTable: () => Oi,
+	WTabs: () => Qr,
+	WTag: () => ji,
+	WTextarea: () => Ii,
+	WTimeline: () => Bi,
+	WToolbar: () => Hi,
+	WTooltip: () => Wi,
+	WTransitionBounce: () => Ki,
+	WTransitionExpand: () => Ji,
+	WTransitionFade: () => Xi,
+	WTransitionScale: () => Qi,
+	WTransitionScaleFade: () => ea,
+	WTransitionSlide: () => na,
+	WTransitionSlideFade: () => ia,
+	WTransitionTwist: () => oa,
+	WTree: () => ua
+}), fa = ze.install;
+ze.install = (e, t = {}) => fa.call(ze, e, {
+	components: da,
 	...t
 });
-var Xi = X;
+var pa = ze;
 //#endregion
-export { Xi as default };
+export { pa as default };