@foi/design-system 0.0.18 → 0.0.19

package/dist/{emotion-react-jsx-runtime.browser.esm-Ct_bZ5JG.js → IconButton-C3x-E-ot.js}

@@ -1,9 +1,10 @@
-import { n as e } from "./theme-CLkxVsoE.js";
-import * as t from "react";
-import n, { forwardRef as r, useContext as i, useLayoutEffect as a, useMemo as o } from "react";
-import * as s from "react/jsx-runtime";
+import { n as e, r as t } from "./theme-BjrtNRDQ.js";
+import * as n from "react";
+import r, { forwardRef as i, useContext as a, useLayoutEffect as o, useMemo as s, useState as c } from "react";
+import { css as l } from "@emotion/react";
+import * as u from "react/jsx-runtime";
 //#region \0rolldown/runtime.js
-var c = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), l = (e) => {
+var d = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), f = (e) => {
 	let t, n = /* @__PURE__ */ new Set(), r = (e, r) => {
 		let i = typeof e == "function" ? e(t) : e;
 		if (!Object.is(i, t)) {
@@ -17,15 +18,15 @@ var c = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t
 		subscribe: (e) => (n.add(e), () => n.delete(e))
 	}, o = t = e(r, i, a);
 	return a;
-}, u = ((e) => e ? l(e) : l), d = (e) => e;
-function f(e, t = d) {
-	let r = n.useSyncExternalStore(e.subscribe, n.useCallback(() => t(e.getState()), [e, t]), n.useCallback(() => t(e.getInitialState()), [e, t]));
-	return n.useDebugValue(r), r;
+}, p = ((e) => e ? f(e) : f), m = (e) => e;
+function h(e, t = m) {
+	let n = r.useSyncExternalStore(e.subscribe, r.useCallback(() => t(e.getState()), [e, t]), r.useCallback(() => t(e.getInitialState()), [e, t]));
+	return r.useDebugValue(n), n;
 }
-var p = (e) => {
-	let t = u(e), n = (e) => f(t, e);
+var g = (e) => {
+	let t = p(e), n = (e) => h(t, e);
 	return Object.assign(n, t), n;
-}, m = ((e) => e ? p(e) : p), h = (e, t) => {
+}, _ = ((e) => e ? g(e) : g), v = (e, t) => {
 	let n = {};
 	return t && Object.entries(t).forEach(([t, r]) => {
 		let i = Object.values(r)[0];
@@ -37,30 +38,30 @@ var p = (e) => {
 			n[`--${e}-${t}-${r.toUpperCase()}`] = `${i}`;
 		});
 	}), n;
-}, g = (e, t) => t ? Object.fromEntries(Object.entries(t).map(([t, n]) => [t, h(e, n)])) : {}, _ = () => {
+}, y = (e, t) => t ? Object.fromEntries(Object.entries(t).map(([t, n]) => [t, v(e, n)])) : {}, b = () => {
 	let t = {};
 	Object.entries(e.components).forEach(([e, n]) => {
-		t[e] = g(e, n);
+		t[e] = y(e, n);
 	});
 	let n = Object.entries(e.fonts).reduce((e, [t, n]) => ({
 		...e,
 		[`--${t.toUpperCase()}`]: n
 	}), {});
 	return Object.assign(t, { FONT: { DEFAULT: n } }), t;
-}, v = m((e) => ({
-	themes: { DARK: _() },
+}, x = _((e) => ({
+	themes: { DARK: b() },
 	theme: "DARK",
 	setThemes: (t) => e(() => ({ themes: t })),
 	setTheme: (t) => e(() => ({ theme: t }))
-})), y = (e, t, n = "DEFAULT") => {
-	let { themes: r, theme: i } = v();
-	return { componentStyles: o(() => {
+})), S = (e, t, n = "DEFAULT") => {
+	let { themes: r, theme: i } = x();
+	return { componentStyles: s(() => {
 		let a = r[i] ?? {}, o = {};
 		if (e.forEach((e) => {
 			let t = a[e];
 			t?.[n] && Object.assign(o, t[n]);
 		}), t) {
-			let n = h(e[0], { EVENTS: t });
+			let n = v(e[0], { EVENTS: t });
 			Object.keys(n).length > 0 && Object.assign(o, n);
 		}
 		return {
@@ -74,48 +75,50 @@ var p = (e) => {
 		r,
 		i
 	]) };
-}, b = (e, t) => {
-	let { setThemes: n, setTheme: r } = v();
-	a(() => {
+}, C = (e, t) => {
+	let { setThemes: n, setTheme: r } = x();
+	o(() => {
 		let t = {};
 		e.forEach((e) => {
 			let n = {};
 			Object.entries(e.components).forEach(([e, t]) => {
-				let r = g(e, t);
+				let r = y(e, t);
 				Object.assign(n, { [e]: r });
 			});
 			let r = Object.entries(e.fonts).reduce((e, [t, n]) => (e[`--${t.toUpperCase()}`] = n, e), {});
 			Object.assign(n, { FONT: { DEFAULT: r } }), t[e.name.toUpperCase()] = n;
 		}), n(t);
-	}, [e]), a(() => {
+	}, [e]), o(() => {
 		r(t.toUpperCase());
 	}, [t]);
-}, x = !1;
-function S(e) {
+}, ee = /* @__PURE__ */ function(e) {
+	return e.CHIP = "CHIP", e.BUTTON = "BUTTON", e.ICONBUTTON = "ICONBUTTON", e.TEXTFIELD = "TEXTFIELD", e.NUMBERFIELD = "NUMBERFIELD", e.CHECKBOX = "CHECKBOX", e.RADIO = "RADIO", e.SELECT = "SELECT", e.SELECTMENU = "SELECTMENU", e.SWITCH = "SWITCH", e.SLIDER = "SLIDER", e.DATEPICKER = "DATEPICKER", e.DATEPICKERMENU = "DATEPICKERMENU", e.PAGINATION = "PAGINATION", e.PAGINATIONMENU = "PAGINATIONMENU", e.TOAST = "TOAST", e.CHECKBOXGROUP = "CHECKBOXGROUP", e.CHECKBOXTREE = "CHECKBOXTREE", e.RADIOGROUP = "RADIOGROUP", e.MODAL = "MODAL", e.DATAGRID = "DATAGRID", e.DATAGRIDMENU = "DATAGRIDMENU", e;
+}({}), te = !1;
+function ne(e) {
 	if (e.sheet) return e.sheet;
 	/* istanbul ignore next */
 	for (var t = 0; t < document.styleSheets.length; t++) if (document.styleSheets[t].ownerNode === e) return document.styleSheets[t];
 }
-function C(e) {
+function re(e) {
 	var t = document.createElement("style");
 	return t.setAttribute("data-emotion", e.key), e.nonce !== void 0 && t.setAttribute("nonce", e.nonce), t.appendChild(document.createTextNode("")), t.setAttribute("data-s", ""), t;
 }
-var ee = /* @__PURE__ */ function() {
+var ie = /* @__PURE__ */ function() {
 	function e(e) {
 		var t = this;
 		this._insertTag = function(e) {
 			var n = t.tags.length === 0 ? t.insertionPoint ? t.insertionPoint.nextSibling : t.prepend ? t.container.firstChild : t.before : t.tags[t.tags.length - 1].nextSibling;
 			t.container.insertBefore(e, n), t.tags.push(e);
-		}, this.isSpeedy = e.speedy === void 0 ? !x : e.speedy, this.tags = [], this.ctr = 0, this.nonce = e.nonce, this.key = e.key, this.container = e.container, this.prepend = e.prepend, this.insertionPoint = e.insertionPoint, this.before = null;
+		}, this.isSpeedy = e.speedy === void 0 ? !te : e.speedy, this.tags = [], this.ctr = 0, this.nonce = e.nonce, this.key = e.key, this.container = e.container, this.prepend = e.prepend, this.insertionPoint = e.insertionPoint, this.before = null;
 	}
 	var t = e.prototype;
 	return t.hydrate = function(e) {
 		e.forEach(this._insertTag);
 	}, t.insert = function(e) {
-		this.ctr % (this.isSpeedy ? 65e3 : 1) == 0 && this._insertTag(C(this));
+		this.ctr % (this.isSpeedy ? 65e3 : 1) == 0 && this._insertTag(re(this));
 		var t = this.tags[this.tags.length - 1];
 		if (this.isSpeedy) {
-			var n = S(t);
+			var n = ne(t);
 			try {
 				n.insertRule(e, n.cssRules.length);
 			} catch {}
@@ -126,14 +129,14 @@ var ee = /* @__PURE__ */ function() {
 			return e.parentNode?.removeChild(e);
 		}), this.tags = [], this.ctr = 0;
 	}, e;
-}(), w = "-ms-", T = "-moz-", E = "-webkit-", te = "comm", D = "rule", O = "decl", ne = "@import", re = "@keyframes", ie = "@layer", ae = Math.abs, k = String.fromCharCode, oe = Object.assign;
-function se(e, t) {
+}(), w = "-ms-", T = "-moz-", E = "-webkit-", ae = "comm", D = "rule", O = "decl", oe = "@import", se = "@keyframes", ce = "@layer", le = Math.abs, k = String.fromCharCode, ue = Object.assign;
+function de(e, t) {
 	return M(e, 0) ^ 45 ? (((t << 2 ^ M(e, 0)) << 2 ^ M(e, 1)) << 2 ^ M(e, 2)) << 2 ^ M(e, 3) : 0;
 }
-function ce(e) {
+function fe(e) {
 	return e.trim();
 }
-function le(e, t) {
+function pe(e, t) {
 	return (e = t.exec(e)) ? e[0] : e;
 }
 function A(e, t, n) {
@@ -151,19 +154,19 @@ function N(e, t, n) {
 function P(e) {
 	return e.length;
 }
-function F(e) {
+function me(e) {
 	return e.length;
 }
-function I(e, t) {
+function F(e, t) {
 	return t.push(e), e;
 }
-function ue(e, t) {
+function he(e, t) {
 	return e.map(t).join("");
 }
 //#endregion
 //#region node_modules/stylis/src/Tokenizer.js
-var L = 1, R = 1, de = 0, z = 0, B = 0, V = "";
-function H(e, t, n, r, i, a, o) {
+var ge = 1, I = 1, _e = 0, L = 0, R = 0, z = "";
+function B(e, t, n, r, i, a, o) {
 	return {
 		value: e,
 		root: t,
@@ -171,34 +174,34 @@ function H(e, t, n, r, i, a, o) {
 		type: r,
 		props: i,
 		children: a,
-		line: L,
-		column: R,
+		line: ge,
+		column: I,
 		length: o,
 		return: ""
 	};
 }
-function U(e, t) {
-	return oe(H("", null, null, "", null, null, 0), e, { length: -e.length }, t);
+function V(e, t) {
+	return ue(B("", null, null, "", null, null, 0), e, { length: -e.length }, t);
 }
-function fe() {
-	return B;
+function ve() {
+	return R;
 }
-function pe() {
-	return B = z > 0 ? M(V, --z) : 0, R--, B === 10 && (R = 1, L--), B;
+function ye() {
+	return R = L > 0 ? M(z, --L) : 0, I--, R === 10 && (I = 1, ge--), R;
 }
-function W() {
-	return B = z < de ? M(V, z++) : 0, R++, B === 10 && (R = 1, L++), B;
+function H() {
+	return R = L < _e ? M(z, L++) : 0, I++, R === 10 && (I = 1, ge++), R;
 }
-function G() {
-	return M(V, z);
+function U() {
+	return M(z, L);
 }
-function K() {
-	return z;
+function W() {
+	return L;
 }
-function q(e, t) {
-	return N(V, e, t);
+function G(e, t) {
+	return N(z, e, t);
 }
-function J(e) {
+function K(e) {
 	switch (e) {
 		case 0:
 		case 9:
@@ -225,77 +228,77 @@ function J(e) {
 	}
 	return 0;
 }
-function me(e) {
-	return L = R = 1, de = P(V = e), z = 0, [];
+function be(e) {
+	return ge = I = 1, _e = P(z = e), L = 0, [];
 }
-function he(e) {
-	return V = "", e;
+function xe(e) {
+	return z = "", e;
 }
-function Y(e) {
-	return ce(q(z - 1, ve(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
+function q(e) {
+	return fe(G(L - 1, we(e === 91 ? e + 2 : e === 40 ? e + 1 : e)));
 }
-function ge(e) {
-	for (; (B = G()) && B < 33;) W();
-	return J(e) > 2 || J(B) > 3 ? "" : " ";
+function Se(e) {
+	for (; (R = U()) && R < 33;) H();
+	return K(e) > 2 || K(R) > 3 ? "" : " ";
 }
-function _e(e, t) {
-	for (; --t && W() && !(B < 48 || B > 102 || B > 57 && B < 65 || B > 70 && B < 97););
-	return q(e, K() + (t < 6 && G() == 32 && W() == 32));
+function Ce(e, t) {
+	for (; --t && H() && !(R < 48 || R > 102 || R > 57 && R < 65 || R > 70 && R < 97););
+	return G(e, W() + (t < 6 && U() == 32 && H() == 32));
 }
-function ve(e) {
-	for (; W();) switch (B) {
-		case e: return z;
+function we(e) {
+	for (; H();) switch (R) {
+		case e: return L;
 		case 34:
 		case 39:
-			e !== 34 && e !== 39 && ve(B);
+			e !== 34 && e !== 39 && we(R);
 			break;
 		case 40:
-			e === 41 && ve(e);
+			e === 41 && we(e);
 			break;
 		case 92:
-			W();
+			H();
 			break;
 	}
-	return z;
+	return L;
 }
-function ye(e, t) {
-	for (; W() && e + B !== 57 && !(e + B === 84 && G() === 47););
-	return "/*" + q(t, z - 1) + "*" + k(e === 47 ? e : W());
+function Te(e, t) {
+	for (; H() && e + R !== 57 && !(e + R === 84 && U() === 47););
+	return "/*" + G(t, L - 1) + "*" + k(e === 47 ? e : H());
 }
-function be(e) {
-	for (; !J(G());) W();
-	return q(e, z);
+function Ee(e) {
+	for (; !K(U());) H();
+	return G(e, L);
 }
 //#endregion
 //#region node_modules/stylis/src/Parser.js
-function xe(e) {
-	return he(X("", null, null, null, [""], e = me(e), 0, [0], e));
+function De(e) {
+	return xe(J("", null, null, null, [""], e = be(e), 0, [0], e));
 }
-function X(e, t, n, r, i, a, o, s, c) {
-	for (var l = 0, u = 0, d = o, f = 0, p = 0, m = 0, h = 1, g = 1, _ = 1, v = 0, y = "", b = i, x = a, S = r, C = y; g;) switch (m = v, v = W()) {
+function J(e, t, n, r, i, a, o, s, c) {
+	for (var l = 0, u = 0, d = o, f = 0, p = 0, m = 0, h = 1, g = 1, _ = 1, v = 0, y = "", b = i, x = a, S = r, C = y; g;) switch (m = v, v = H()) {
 		case 40: if (m != 108 && M(C, d - 1) == 58) {
-			j(C += A(Y(v), "&", "&\f"), "&\f") != -1 && (_ = -1);
+			j(C += A(q(v), "&", "&\f"), "&\f") != -1 && (_ = -1);
 			break;
 		}
 		case 34:
 		case 39:
 		case 91:
-			C += Y(v);
+			C += q(v);
 			break;
 		case 9:
 		case 10:
 		case 13:
 		case 32:
-			C += ge(m);
+			C += Se(m);
 			break;
 		case 92:
-			C += _e(K() - 1, 7);
+			C += Ce(W() - 1, 7);
 			continue;
 		case 47:
-			switch (G()) {
+			switch (U()) {
 				case 42:
 				case 47:
-					I(Ce(ye(W(), K()), t, n), c);
+					F(ke(Te(H(), W()), t, n), c);
 					break;
 				default: C += "/";
 			}
@@ -308,18 +311,18 @@ function X(e, t, n, r, i, a, o, s, c) {
 				case 0:
 				case 125: g = 0;
 				case 59 + u:
-					_ == -1 && (C = A(C, /\f/g, "")), p > 0 && P(C) - d && I(p > 32 ? we(C + ";", r, n, d - 1) : we(A(C, " ", "") + ";", r, n, d - 2), c);
+					_ == -1 && (C = A(C, /\f/g, "")), p > 0 && P(C) - d && F(p > 32 ? Ae(C + ";", r, n, d - 1) : Ae(A(C, " ", "") + ";", r, n, d - 2), c);
 					break;
 				case 59: C += ";";
-				default: if (I(S = Se(C, t, n, l, u, i, s, y, b = [], x = [], d), a), v === 123) if (u === 0) X(C, t, S, S, b, a, d, s, x);
+				default: if (F(S = Oe(C, t, n, l, u, i, s, y, b = [], x = [], d), a), v === 123) if (u === 0) J(C, t, S, S, b, a, d, s, x);
 				else switch (f === 99 && M(C, 3) === 110 ? 100 : f) {
 					case 100:
 					case 108:
 					case 109:
 					case 115:
-						X(e, S, S, r && I(Se(e, S, S, 0, 0, i, s, y, i, b = [], d), x), i, x, d, s, r ? b : x);
+						J(e, S, S, r && F(Oe(e, S, S, 0, 0, i, s, y, i, b = [], d), x), i, x, d, s, r ? b : x);
 						break;
-					default: X(C, S, S, S, [""], x, 0, s, x);
+					default: J(C, S, S, S, [""], x, 0, s, x);
 				}
 			}
 			l = u = p = 0, h = _ = 1, y = C = "", d = o;
@@ -328,7 +331,7 @@ function X(e, t, n, r, i, a, o, s, c) {
 		default:
 			if (h < 1) {
 				if (v == 123) --h;
-				else if (v == 125 && h++ == 0 && pe() == 125) continue;
+				else if (v == 125 && h++ == 0 && ye() == 125) continue;
 			}
 			switch (C += k(v), v * h) {
 				case 38:
@@ -338,57 +341,57 @@ function X(e, t, n, r, i, a, o, s, c) {
 					s[l++] = (P(C) - 1) * _, _ = 1;
 					break;
 				case 64:
-					G() === 45 && (C += Y(W())), f = G(), u = d = P(y = C += be(K())), v++;
+					U() === 45 && (C += q(H())), f = U(), u = d = P(y = C += Ee(W())), v++;
 					break;
 				case 45: m === 45 && P(C) == 2 && (h = 0);
 			}
 	}
 	return a;
 }
-function Se(e, t, n, r, i, a, o, s, c, l, u) {
-	for (var d = i - 1, f = i === 0 ? a : [""], p = F(f), m = 0, h = 0, g = 0; m < r; ++m) for (var _ = 0, v = N(e, d + 1, d = ae(h = o[m])), y = e; _ < p; ++_) (y = ce(h > 0 ? f[_] + " " + v : A(v, /&\f/g, f[_]))) && (c[g++] = y);
-	return H(e, t, n, i === 0 ? D : s, c, l, u);
+function Oe(e, t, n, r, i, a, o, s, c, l, u) {
+	for (var d = i - 1, f = i === 0 ? a : [""], p = me(f), m = 0, h = 0, g = 0; m < r; ++m) for (var _ = 0, v = N(e, d + 1, d = le(h = o[m])), y = e; _ < p; ++_) (y = fe(h > 0 ? f[_] + " " + v : A(v, /&\f/g, f[_]))) && (c[g++] = y);
+	return B(e, t, n, i === 0 ? D : s, c, l, u);
 }
-function Ce(e, t, n) {
-	return H(e, t, n, te, k(fe()), N(e, 2, -2), 0);
+function ke(e, t, n) {
+	return B(e, t, n, ae, k(ve()), N(e, 2, -2), 0);
 }
-function we(e, t, n, r) {
-	return H(e, t, n, O, N(e, 0, r), N(e, r + 1, -1), r);
+function Ae(e, t, n, r) {
+	return B(e, t, n, O, N(e, 0, r), N(e, r + 1, -1), r);
 }
 //#endregion
 //#region node_modules/stylis/src/Serializer.js
-function Z(e, t) {
-	for (var n = "", r = F(e), i = 0; i < r; i++) n += t(e[i], i, e, t) || "";
+function Y(e, t) {
+	for (var n = "", r = me(e), i = 0; i < r; i++) n += t(e[i], i, e, t) || "";
 	return n;
 }
-function Te(e, t, n, r) {
+function je(e, t, n, r) {
 	switch (e.type) {
-		case ie: if (e.children.length) break;
-		case ne:
+		case ce: if (e.children.length) break;
+		case oe:
 		case O: return e.return = e.return || e.value;
-		case te: return "";
-		case re: return e.return = e.value + "{" + Z(e.children, r) + "}";
+		case ae: return "";
+		case se: return e.return = e.value + "{" + Y(e.children, r) + "}";
 		case D: e.value = e.props.join(",");
 	}
-	return P(n = Z(e.children, r)) ? e.return = e.value + "{" + n + "}" : "";
+	return P(n = Y(e.children, r)) ? e.return = e.value + "{" + n + "}" : "";
 }
 //#endregion
 //#region node_modules/stylis/src/Middleware.js
-function Ee(e) {
-	var t = F(e);
+function Me(e) {
+	var t = me(e);
 	return function(n, r, i, a) {
 		for (var o = "", s = 0; s < t; s++) o += e[s](n, r, i, a) || "";
 		return o;
 	};
 }
-function De(e) {
+function Ne(e) {
 	return function(t) {
 		t.root || (t = t.return) && e(t);
 	};
 }
 //#endregion
 //#region node_modules/@emotion/memoize/dist/emotion-memoize.esm.js
-function Oe(e) {
+function Pe(e) {
 	var t = Object.create(null);
 	return function(n) {
 		return t[n] === void 0 && (t[n] = e(n)), t[n];
@@ -396,45 +399,45 @@ function Oe(e) {
 }
 //#endregion
 //#region node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
-var ke = function(e, t, n) {
-	for (var r = 0, i = 0; r = i, i = G(), r === 38 && i === 12 && (t[n] = 1), !J(i);) W();
-	return q(e, z);
-}, Ae = function(e, t) {
+var Fe = function(e, t, n) {
+	for (var r = 0, i = 0; r = i, i = U(), r === 38 && i === 12 && (t[n] = 1), !K(i);) H();
+	return G(e, L);
+}, Ie = function(e, t) {
 	var n = -1, r = 44;
 	do
-		switch (J(r)) {
+		switch (K(r)) {
 			case 0:
-				r === 38 && G() === 12 && (t[n] = 1), e[n] += ke(z - 1, t, n);
+				r === 38 && U() === 12 && (t[n] = 1), e[n] += Fe(L - 1, t, n);
 				break;
 			case 2:
-				e[n] += Y(r);
+				e[n] += q(r);
 				break;
 			case 4: if (r === 44) {
-				e[++n] = G() === 58 ? "&\f" : "", t[n] = e[n].length;
+				e[++n] = U() === 58 ? "&\f" : "", t[n] = e[n].length;
 				break;
 			}
 			default: e[n] += k(r);
 		}
-	while (r = W());
+	while (r = H());
 	return e;
-}, je = function(e, t) {
-	return he(Ae(me(e), t));
-}, Me = /* @__PURE__ */ new WeakMap(), Ne = function(e) {
+}, Le = function(e, t) {
+	return xe(Ie(be(e), t));
+}, Re = /* @__PURE__ */ new WeakMap(), ze = function(e) {
 	if (!(e.type !== "rule" || !e.parent || e.length < 1)) {
 		for (var t = e.value, n = e.parent, r = e.column === n.column && e.line === n.line; n.type !== "rule";) if (n = n.parent, !n) return;
-		if (!(e.props.length === 1 && t.charCodeAt(0) !== 58 && !Me.get(n)) && !r) {
-			Me.set(e, !0);
-			for (var i = [], a = je(t, i), o = n.props, s = 0, c = 0; s < a.length; s++) for (var l = 0; l < o.length; l++, c++) e.props[c] = i[s] ? a[s].replace(/&\f/g, o[l]) : o[l] + " " + a[s];
+		if (!(e.props.length === 1 && t.charCodeAt(0) !== 58 && !Re.get(n)) && !r) {
+			Re.set(e, !0);
+			for (var i = [], a = Le(t, i), o = n.props, s = 0, c = 0; s < a.length; s++) for (var l = 0; l < o.length; l++, c++) e.props[c] = i[s] ? a[s].replace(/&\f/g, o[l]) : o[l] + " " + a[s];
 		}
 	}
-}, Pe = function(e) {
+}, Be = function(e) {
 	if (e.type === "decl") {
 		var t = e.value;
 		t.charCodeAt(0) === 108 && t.charCodeAt(2) === 98 && (e.return = "", e.value = "");
 	}
 };
-function Fe(e, t) {
-	switch (se(e, t)) {
+function Ve(e, t) {
+	switch (de(e, t)) {
 		case 5103: return E + "print-" + e + e;
 		case 5737:
 		case 4201:
@@ -499,7 +502,7 @@ function Fe(e, t) {
 			if (P(e) - 1 - t > 6) switch (M(e, t + 1)) {
 				case 109: if (M(e, t + 4) !== 45) break;
 				case 102: return A(e, /(.+:)(.+)-([^]+)/, "$1" + E + "$2-$3$1" + T + (M(e, t + 3) == 108 ? "$3" : "$2-$3")) + e;
-				case 115: return ~j(e, "stretch") ? Fe(A(e, "stretch", "fill-available"), t) + e : e;
+				case 115: return ~j(e, "stretch") ? Ve(A(e, "stretch", "fill-available"), t) + e : e;
 			}
 			break;
 		case 4949: if (M(e, t + 1) !== 115) break;
@@ -519,26 +522,26 @@ function Fe(e, t) {
 	}
 	return e;
 }
-var Ie = [function(e, t, n, r) {
+var He = [function(e, t, n, r) {
 	if (e.length > -1 && !e.return) switch (e.type) {
 		case O:
-			e.return = Fe(e.value, e.length);
+			e.return = Ve(e.value, e.length);
 			break;
-		case re: return Z([U(e, { value: A(e.value, "@", "@" + E) })], r);
-		case D: if (e.length) return ue(e.props, function(t) {
-			switch (le(t, /(::plac\w+|:read-\w+)/)) {
+		case se: return Y([V(e, { value: A(e.value, "@", "@" + E) })], r);
+		case D: if (e.length) return he(e.props, function(t) {
+			switch (pe(t, /(::plac\w+|:read-\w+)/)) {
 				case ":read-only":
-				case ":read-write": return Z([U(e, { props: [A(t, /:(read-\w+)/, ":" + T + "$1")] })], r);
-				case "::placeholder": return Z([
-					U(e, { props: [A(t, /:(plac\w+)/, ":" + E + "input-$1")] }),
-					U(e, { props: [A(t, /:(plac\w+)/, ":" + T + "$1")] }),
-					U(e, { props: [A(t, /:(plac\w+)/, w + "input-$1")] })
+				case ":read-write": return Y([V(e, { props: [A(t, /:(read-\w+)/, ":" + T + "$1")] })], r);
+				case "::placeholder": return Y([
+					V(e, { props: [A(t, /:(plac\w+)/, ":" + E + "input-$1")] }),
+					V(e, { props: [A(t, /:(plac\w+)/, ":" + T + "$1")] }),
+					V(e, { props: [A(t, /:(plac\w+)/, w + "input-$1")] })
 				], r);
 			}
 			return "";
 		});
 	}
-}], Le = function(e) {
+}], Ue = function(e) {
 	var t = e.key;
 	if (t === "css") {
 		var n = document.querySelectorAll("style[data-emotion]:not([data-s])");
@@ -546,22 +549,22 @@ var Ie = [function(e, t, n, r) {
 			e.getAttribute("data-emotion").indexOf(" ") !== -1 && (document.head.appendChild(e), e.setAttribute("data-s", ""));
 		});
 	}
-	var r = e.stylisPlugins || Ie, i = {}, a, o = [];
+	var r = e.stylisPlugins || He, i = {}, a, o = [];
 	a = e.container || document.head, Array.prototype.forEach.call(document.querySelectorAll("style[data-emotion^=\"" + t + " \"]"), function(e) {
 		for (var t = e.getAttribute("data-emotion").split(" "), n = 1; n < t.length; n++) i[t[n]] = !0;
 		o.push(e);
 	});
-	var s, c = [Ne, Pe], l, u = [Te, De(function(e) {
+	var s, c = [ze, Be], l, u = [je, Ne(function(e) {
 		l.insert(e);
-	})], d = Ee(c.concat(r, u)), f = function(e) {
-		return Z(xe(e), d);
+	})], d = Me(c.concat(r, u)), f = function(e) {
+		return Y(De(e), d);
 	};
 	s = function(e, t, n, r) {
 		l = n, f(e ? e + "{" + t.styles + "}" : t.styles), r && (p.inserted[t.name] = !0);
 	};
 	var p = {
 		key: t,
-		sheet: new ee({
+		sheet: new ie({
 			key: t,
 			container: a,
 			nonce: e.nonce,
@@ -575,7 +578,7 @@ var Ie = [function(e, t, n, r) {
 		insert: s
 	};
 	return p.sheet.hydrate(o), p;
-}, Re = /* @__PURE__ */ c(((e) => {
+}, We = /* @__PURE__ */ d(((e) => {
 	var t = typeof Symbol == "function" && Symbol.for, n = t ? Symbol.for("react.element") : 60103, r = t ? Symbol.for("react.portal") : 60106, i = t ? Symbol.for("react.fragment") : 60107, a = t ? Symbol.for("react.strict_mode") : 60108, o = t ? Symbol.for("react.profiler") : 60114, s = t ? Symbol.for("react.provider") : 60109, c = t ? Symbol.for("react.context") : 60110, l = t ? Symbol.for("react.async_mode") : 60111, u = t ? Symbol.for("react.concurrent_mode") : 60111, d = t ? Symbol.for("react.forward_ref") : 60112, f = t ? Symbol.for("react.suspense") : 60113, p = t ? Symbol.for("react.suspense_list") : 60120, m = t ? Symbol.for("react.memo") : 60115, h = t ? Symbol.for("react.lazy") : 60116, g = t ? Symbol.for("react.block") : 60121, _ = t ? Symbol.for("react.fundamental") : 60117, v = t ? Symbol.for("react.responder") : 60118, y = t ? Symbol.for("react.scope") : 60119;
 	function b(e) {
 		if (typeof e == "object" && e) {
@@ -631,7 +634,7 @@ var Ie = [function(e, t, n, r) {
 	}, e.isValidElementType = function(e) {
 		return typeof e == "string" || typeof e == "function" || e === i || e === u || e === o || e === a || e === f || e === p || typeof e == "object" && !!e && (e.$$typeof === h || e.$$typeof === m || e.$$typeof === s || e.$$typeof === c || e.$$typeof === d || e.$$typeof === _ || e.$$typeof === v || e.$$typeof === y || e.$$typeof === g);
 	}, e.typeOf = b;
-})), ze = /* @__PURE__ */ c(((e) => {
+})), Ge = /* @__PURE__ */ d(((e) => {
 	process.env.NODE_ENV !== "production" && (function() {
 		var t = typeof Symbol == "function" && Symbol.for, n = t ? Symbol.for("react.element") : 60103, r = t ? Symbol.for("react.portal") : 60106, i = t ? Symbol.for("react.fragment") : 60107, a = t ? Symbol.for("react.strict_mode") : 60108, o = t ? Symbol.for("react.profiler") : 60114, s = t ? Symbol.for("react.provider") : 60109, c = t ? Symbol.for("react.context") : 60110, l = t ? Symbol.for("react.async_mode") : 60111, u = t ? Symbol.for("react.concurrent_mode") : 60111, d = t ? Symbol.for("react.forward_ref") : 60112, f = t ? Symbol.for("react.suspense") : 60113, p = t ? Symbol.for("react.suspense_list") : 60120, m = t ? Symbol.for("react.memo") : 60115, h = t ? Symbol.for("react.lazy") : 60116, g = t ? Symbol.for("react.block") : 60121, _ = t ? Symbol.for("react.fundamental") : 60117, v = t ? Symbol.for("react.responder") : 60118, y = t ? Symbol.for("react.scope") : 60119;
 		function b(e) {
@@ -665,52 +668,52 @@ var Ie = [function(e, t, n, r) {
 				}
 			}
 		}
-		var S = l, C = u, ee = c, w = s, T = n, E = d, te = i, D = h, O = m, ne = r, re = o, ie = a, ae = f, k = !1;
-		function oe(e) {
-			return k || (k = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), se(e) || x(e) === l;
-		}
+		var S = l, C = u, ee = c, te = s, ne = n, re = d, ie = i, w = h, T = m, E = r, ae = o, D = a, O = f, oe = !1;
 		function se(e) {
-			return x(e) === u;
+			return oe || (oe = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), ce(e) || x(e) === l;
 		}
 		function ce(e) {
-			return x(e) === c;
+			return x(e) === u;
 		}
 		function le(e) {
+			return x(e) === c;
+		}
+		function k(e) {
 			return x(e) === s;
 		}
-		function A(e) {
+		function ue(e) {
 			return typeof e == "object" && !!e && e.$$typeof === n;
 		}
-		function j(e) {
+		function de(e) {
 			return x(e) === d;
 		}
-		function M(e) {
+		function fe(e) {
 			return x(e) === i;
 		}
-		function N(e) {
+		function pe(e) {
 			return x(e) === h;
 		}
-		function P(e) {
+		function A(e) {
 			return x(e) === m;
 		}
-		function F(e) {
+		function j(e) {
 			return x(e) === r;
 		}
-		function I(e) {
+		function M(e) {
 			return x(e) === o;
 		}
-		function ue(e) {
+		function N(e) {
 			return x(e) === a;
 		}
-		function L(e) {
+		function P(e) {
 			return x(e) === f;
 		}
-		e.AsyncMode = S, e.ConcurrentMode = C, e.ContextConsumer = ee, e.ContextProvider = w, e.Element = T, e.ForwardRef = E, e.Fragment = te, e.Lazy = D, e.Memo = O, e.Portal = ne, e.Profiler = re, e.StrictMode = ie, e.Suspense = ae, e.isAsyncMode = oe, e.isConcurrentMode = se, e.isContextConsumer = ce, e.isContextProvider = le, e.isElement = A, e.isForwardRef = j, e.isFragment = M, e.isLazy = N, e.isMemo = P, e.isPortal = F, e.isProfiler = I, e.isStrictMode = ue, e.isSuspense = L, e.isValidElementType = b, e.typeOf = x;
+		e.AsyncMode = S, e.ConcurrentMode = C, e.ContextConsumer = ee, e.ContextProvider = te, e.Element = ne, e.ForwardRef = re, e.Fragment = ie, e.Lazy = w, e.Memo = T, e.Portal = E, e.Profiler = ae, e.StrictMode = D, e.Suspense = O, e.isAsyncMode = se, e.isConcurrentMode = ce, e.isContextConsumer = le, e.isContextProvider = k, e.isElement = ue, e.isForwardRef = de, e.isFragment = fe, e.isLazy = pe, e.isMemo = A, e.isPortal = j, e.isProfiler = M, e.isStrictMode = N, e.isSuspense = P, e.isValidElementType = b, e.typeOf = x;
 	})();
-})), Be = /* @__PURE__ */ c(((e, t) => {
-	process.env.NODE_ENV === "production" ? t.exports = Re() : t.exports = ze();
-})), Ve = /* @__PURE__ */ c(((e, t) => {
-	var n = Be(), r = {
+})), Ke = /* @__PURE__ */ d(((e, t) => {
+	process.env.NODE_ENV === "production" ? t.exports = We() : t.exports = Ge();
+})), qe = /* @__PURE__ */ d(((e, t) => {
+	var n = Ke(), r = {
 		childContextTypes: !0,
 		contextType: !0,
 		contextTypes: !0,
@@ -770,18 +773,18 @@ var Ie = [function(e, t, n, r) {
 		return e;
 	}
 	t.exports = h;
-})), He = !0;
-function Ue(e, t, n) {
+})), Je = !0;
+function Ye(e, t, n) {
 	var r = "";
 	return n.split(" ").forEach(function(n) {
 		e[n] === void 0 ? n && (r += n + " ") : t.push(e[n] + ";");
 	}), r;
 }
-var We = function(e, t, n) {
+var Xe = function(e, t, n) {
 	var r = e.key + "-" + t.name;
-	(n === !1 || He === !1) && e.registered[r] === void 0 && (e.registered[r] = t.styles);
-}, Ge = function(e, t, n) {
-	We(e, t, n);
+	(n === !1 || Je === !1) && e.registered[r] === void 0 && (e.registered[r] = t.styles);
+}, Ze = function(e, t, n) {
+	Xe(e, t, n);
 	var r = e.key + "-" + t.name;
 	if (e.inserted[t.name] === void 0) {
 		var i = t;
@@ -792,7 +795,7 @@ var We = function(e, t, n) {
 };
 //#endregion
 //#region node_modules/@emotion/hash/dist/emotion-hash.esm.js
-function Ke(e) {
+function Qe(e) {
 	for (var t = 0, n, r = 0, i = e.length; i >= 4; ++r, i -= 4) n = e.charCodeAt(r) & 255 | (e.charCodeAt(++r) & 255) << 8 | (e.charCodeAt(++r) & 255) << 16 | (e.charCodeAt(++r) & 255) << 24, n = (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16), n ^= n >>> 24, t = (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16) ^ (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16);
 	switch (i) {
 		case 3: t ^= (e.charCodeAt(r + 2) & 255) << 16;
@@ -803,7 +806,7 @@ function Ke(e) {
 }
 //#endregion
 //#region node_modules/@emotion/unitless/dist/emotion-unitless.esm.js
-var qe = {
+var $e = {
 	animationIterationCount: 1,
 	aspectRatio: 1,
 	borderImageOutset: 1,
@@ -851,26 +854,26 @@ var qe = {
 	strokeMiterlimit: 1,
 	strokeOpacity: 1,
 	strokeWidth: 1
-}, Je = !1, Ye = /[A-Z]|^ms/g, Xe = /_EMO_([^_]+?)_([^]*?)_EMO_/g, Ze = function(e) {
+}, et = !1, tt = /[A-Z]|^ms/g, nt = /_EMO_([^_]+?)_([^]*?)_EMO_/g, rt = function(e) {
 	return e.charCodeAt(1) === 45;
-}, Qe = function(e) {
+}, it = function(e) {
 	return e != null && typeof e != "boolean";
-}, $e = /* @__PURE__ */ Oe(function(e) {
-	return Ze(e) ? e : e.replace(Ye, "-$&").toLowerCase();
-}), et = function(e, t) {
+}, at = /* @__PURE__ */ Pe(function(e) {
+	return rt(e) ? e : e.replace(tt, "-$&").toLowerCase();
+}), ot = function(e, t) {
 	switch (e) {
 		case "animation":
-		case "animationName": if (typeof t == "string") return t.replace(Xe, function(e, t, n) {
-			return $ = {
+		case "animationName": if (typeof t == "string") return t.replace(nt, function(e, t, n) {
+			return Z = {
 				name: t,
 				styles: n,
-				next: $
+				next: Z
 			}, t;
 		});
 	}
-	return qe[e] !== 1 && !Ze(e) && typeof t == "number" && t !== 0 ? t + "px" : t;
-}, tt = "Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform.";
-function Q(e, t, n) {
+	return $e[e] !== 1 && !rt(e) && typeof t == "number" && t !== 0 ? t + "px" : t;
+}, st = "Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform.";
+function X(e, t, n) {
 	if (n == null) return "";
 	var r = n;
 	if (r.__emotion_styles !== void 0) return r;
@@ -878,26 +881,26 @@ function Q(e, t, n) {
 		case "boolean": return "";
 		case "object":
 			var i = n;
-			if (i.anim === 1) return $ = {
+			if (i.anim === 1) return Z = {
 				name: i.name,
 				styles: i.styles,
-				next: $
+				next: Z
 			}, i.name;
 			var a = n;
 			if (a.styles !== void 0) {
 				var o = a.next;
-				if (o !== void 0) for (; o !== void 0;) $ = {
+				if (o !== void 0) for (; o !== void 0;) Z = {
 					name: o.name,
 					styles: o.styles,
-					next: $
+					next: Z
 				}, o = o.next;
 				return a.styles + ";";
 			}
-			return nt(e, t, n);
+			return ct(e, t, n);
 		case "function":
 			if (e !== void 0) {
-				var s = $, c = n(e);
-				return $ = s, Q(e, t, c);
+				var s = Z, c = n(e);
+				return Z = s, X(e, t, c);
 			}
 			break;
 	}
@@ -906,23 +909,23 @@ function Q(e, t, n) {
 	var u = t[l];
 	return u === void 0 ? l : u;
 }
-function nt(e, t, n) {
+function ct(e, t, n) {
 	var r = "";
-	if (Array.isArray(n)) for (var i = 0; i < n.length; i++) r += Q(e, t, n[i]) + ";";
+	if (Array.isArray(n)) for (var i = 0; i < n.length; i++) r += X(e, t, n[i]) + ";";
 	else for (var a in n) {
 		var o = n[a];
 		if (typeof o != "object") {
 			var s = o;
-			t != null && t[s] !== void 0 ? r += a + "{" + t[s] + "}" : Qe(s) && (r += $e(a) + ":" + et(a, s) + ";");
+			t != null && t[s] !== void 0 ? r += a + "{" + t[s] + "}" : it(s) && (r += at(a) + ":" + ot(a, s) + ";");
 		} else {
-			if (a === "NO_COMPONENT_SELECTOR" && Je) throw Error(tt);
-			if (Array.isArray(o) && typeof o[0] == "string" && (t == null || t[o[0]] === void 0)) for (var c = 0; c < o.length; c++) Qe(o[c]) && (r += $e(a) + ":" + et(a, o[c]) + ";");
+			if (a === "NO_COMPONENT_SELECTOR" && et) throw Error(st);
+			if (Array.isArray(o) && typeof o[0] == "string" && (t == null || t[o[0]] === void 0)) for (var c = 0; c < o.length; c++) it(o[c]) && (r += at(a) + ":" + ot(a, o[c]) + ";");
 			else {
-				var l = Q(e, t, o);
+				var l = X(e, t, o);
 				switch (a) {
 					case "animation":
 					case "animationName":
-						r += $e(a) + ":" + l + ";";
+						r += at(a) + ":" + l + ";";
 						break;
 					default: r += a + "{" + l + "}";
 				}
@@ -931,65 +934,272 @@ function nt(e, t, n) {
 	}
 	return r;
 }
-var rt = /label:\s*([^\s;{]+)\s*(;|$)/g, $;
-function it(e, t, n) {
+var lt = /label:\s*([^\s;{]+)\s*(;|$)/g, Z;
+function ut(e, t, n) {
 	if (e.length === 1 && typeof e[0] == "object" && e[0] !== null && e[0].styles !== void 0) return e[0];
 	var r = !0, i = "";
-	$ = void 0;
+	Z = void 0;
 	var a = e[0];
-	a == null || a.raw === void 0 ? (r = !1, i += Q(n, t, a)) : i += a[0];
-	for (var o = 1; o < e.length; o++) i += Q(n, t, e[o]), r && (i += a[o]);
-	rt.lastIndex = 0;
-	for (var s = "", c; (c = rt.exec(i)) !== null;) s += "-" + c[1];
+	a == null || a.raw === void 0 ? (r = !1, i += X(n, t, a)) : i += a[0];
+	for (var o = 1; o < e.length; o++) i += X(n, t, e[o]), r && (i += a[o]);
+	lt.lastIndex = 0;
+	for (var s = "", c; (c = lt.exec(i)) !== null;) s += "-" + c[1];
 	return {
-		name: Ke(i) + s,
+		name: Qe(i) + s,
 		styles: i,
-		next: $
+		next: Z
 	};
 }
 //#endregion
 //#region node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js
-var at = function(e) {
+var dt = function(e) {
 	return e();
-}, ot = t.useInsertionEffect ? t.useInsertionEffect : !1, st = ot || at;
-ot || t.useLayoutEffect;
-var ct = /* @__PURE__ */ t.createContext(typeof HTMLElement < "u" ? /* @__PURE__ */ Le({ key: "css" }) : null);
-ct.Provider;
-var lt = function(e) {
-	return /* @__PURE__ */ r(function(t, n) {
-		return e(t, i(ct), n);
+}, ft = n.useInsertionEffect ? n.useInsertionEffect : !1, pt = ft || dt;
+ft || n.useLayoutEffect;
+var mt = /* @__PURE__ */ n.createContext(typeof HTMLElement < "u" ? /* @__PURE__ */ Ue({ key: "css" }) : null);
+mt.Provider;
+var ht = function(e) {
+	return /* @__PURE__ */ i(function(t, n) {
+		return e(t, a(mt), n);
 	});
-}, ut = /* @__PURE__ */ t.createContext({}), dt = {}.hasOwnProperty, ft = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", pt = function(e, t) {
+}, gt = /* @__PURE__ */ n.createContext({}), _t = {}.hasOwnProperty, vt = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", yt = function(e, t) {
 	var n = {};
-	for (var r in t) dt.call(t, r) && (n[r] = t[r]);
-	return n[ft] = e, n;
-}, mt = function(e) {
+	for (var r in t) _t.call(t, r) && (n[r] = t[r]);
+	return n[vt] = e, n;
+}, bt = function(e) {
 	var t = e.cache, n = e.serialized, r = e.isStringTag;
-	return We(t, n, r), st(function() {
-		return Ge(t, n, r);
+	return Xe(t, n, r), pt(function() {
+		return Ze(t, n, r);
 	}), null;
-}, ht = /* @__PURE__ */ lt(function(e, n, r) {
+}, xt = /* @__PURE__ */ ht(function(e, t, r) {
 	var i = e.css;
-	typeof i == "string" && n.registered[i] !== void 0 && (i = n.registered[i]);
-	var a = e[ft], o = [i], s = "";
-	typeof e.className == "string" ? s = Ue(n.registered, o, e.className) : e.className != null && (s = e.className + " ");
-	var c = it(o, void 0, t.useContext(ut));
-	s += n.key + "-" + c.name;
+	typeof i == "string" && t.registered[i] !== void 0 && (i = t.registered[i]);
+	var a = e[vt], o = [i], s = "";
+	typeof e.className == "string" ? s = Ye(t.registered, o, e.className) : e.className != null && (s = e.className + " ");
+	var c = ut(o, void 0, n.useContext(gt));
+	s += t.key + "-" + c.name;
 	var l = {};
-	for (var u in e) dt.call(e, u) && u !== "css" && u !== ft && (l[u] = e[u]);
-	return l.className = s, r && (l.ref = r), /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(mt, {
-		cache: n,
+	for (var u in e) _t.call(e, u) && u !== "css" && u !== vt && (l[u] = e[u]);
+	return l.className = s, r && (l.ref = r), /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(bt, {
+		cache: t,
 		serialized: c,
 		isStringTag: typeof a == "string"
-	}), /* @__PURE__ */ t.createElement(a, l));
+	}), /* @__PURE__ */ n.createElement(a, l));
 });
-Ve();
-var gt = s.Fragment, _t = function(e, t, n) {
-	return dt.call(t, "css") ? s.jsx(ht, pt(e, t), n) : s.jsx(e, t, n);
-}, vt = function(e, t, n) {
-	return dt.call(t, "css") ? s.jsxs(ht, pt(e, t), n) : s.jsxs(e, t, n);
+qe();
+var St = u.Fragment, Q = function(e, t, n) {
+	return _t.call(t, "css") ? u.jsx(xt, yt(e, t), n) : u.jsx(e, t, n);
+}, Ct = function(e, t, n) {
+	return _t.call(t, "css") ? u.jsxs(xt, yt(e, t), n) : u.jsxs(e, t, n);
+}, wt = () => l`
+  &.--ICON {
+    font-family: 'Material Symbols Rounded';
+    font-weight: normal;
+    font-style: normal;
+    font-size: 20px;
+    line-height: 1;
+    letter-spacing: normal;
+    text-transform: none;
+    display: inline-block;
+    white-space: nowrap;
+    word-wrap: normal;
+    direction: ltr;
+    font-variation-settings:
+      'FILL' 0,
+      'wght' 400,
+      'GRAD' 0,
+      'opsz' 24;
+    user-select: none;
+    vertical-align: middle;
+
+    &.--ICON-fill {
+      font-variation-settings:
+        'FILL' 1,
+        'wght' 500,
+        'GRAD' 0,
+        'opsz' 24;
+    }
+
+    &.--ICON-sm {
+      font-size: 18px;
+    }
+    &.--ICON-lg {
+      font-size: 24px;
+    }
+    &.--ICON-xl {
+      font-size: 36px;
+    }
+  }
+`, Tt = "--ICON", Et = ({ name: e, fill: t = !1, size: n = "md", className: r, style: i }) => /* @__PURE__ */ Q("span", {
+	className: [
+		Tt,
+		t && `${Tt}-fill`,
+		n !== "md" && `${Tt}-${n}`,
+		r
+	].filter(Boolean).join(" "),
+	css: wt(),
+	style: i,
+	"aria-hidden": "true",
+	"data-testid": Tt,
+	children: e
+}), Dt = (e, n) => `
+    // BACKGROUNDS
+    .--ICONBUTTON-span {
+      ${t(e, "background-color", `--ICONBUTTON-EVENTS-${n}-BACKGROUND-COLOR`)}
+    }
+  `, Ot = (e, n) => `
+    // SHADOWS  
+    ${t(e, "background-color", `--ICONBUTTON-EVENTS-${n}-SHADOW-COLOR`)}
+  `, kt = (e, n) => `
+    // UTILS
+    .--ICONBUTTON-span > span {
+        ${t(e, "color", `--ICONBUTTON-EVENTS-${n}-ICON-COLOR`)}
+    }
+  `, At = (e, n) => `
+    // BORDER
+    .--ICONBUTTON-span {
+      ${t(e, "border-color", `--ICONBUTTON-EVENTS-${n}-BORDER-COLOR`)}
+      ${t(e, "border-width", `--ICONBUTTON-EVENTS-${n}-BORDER-WIDTH`)}
+      ${t(e, "border-style", `--ICONBUTTON-EVENTS-${n}-BORDER-STYLE`)}
+    }
+  `, jt = (e, n) => `
+    // OUTLINE
+    .--ICONBUTTON-span {
+      ${t(e, "outline-color", `--ICONBUTTON-EVENTS-${n}-OUTLINE-COLOR`)}
+      ${t(e, "outline-width", `--ICONBUTTON-EVENTS-${n}-OUTLINE-WIDTH`)}
+      ${t(e, "outline-style", `--ICONBUTTON-EVENTS-${n}-OUTLINE-STYLE`)}
+      ${t(e, "outline-offset", `--ICONBUTTON-EVENTS-${n}-OUTLINE-OFFSET`)}
+    }
+  `, Mt = (e) => l`
+  &.--ICONBUTTON {
+    width: 24px;
+    height: 24px;
+    ${t(e, "border-radius", "--ICONBUTTON-ROOT-BORDER-RADIUS")};
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    vertical-align: middle;
+    box-sizing: content-box;
+    position: relative;
+    user-select: none;
+    padding: 0px;
+    box-sizing: border-box;
+    -webkit-tap-highlight-color: transparent;
+    isolation: isolate;
+    border: none;
+    background-color: transparent;
+
+    // ENABLED
+    ${Dt(e, "ENABLED")};
+    ${At(e, "ENABLED")};
+    ${kt(e, "ENABLED")};
+
+    // HOVER
+    &:hover {
+      &:before {
+        opacity: 1;
+        ${Ot(e, "HOVER")};
+      }
+    }
+
+    // ACTIVE
+    &.--ICONBUTTON-active,
+    &:active {
+      &:before {
+        opacity: 1;
+        ${Ot(e, "ACTIVE")};
+      }
+    }
+
+    // FOCUS
+    &:focus-visible {
+      outline: none;
+      ${jt(e, "FOCUS")};
+    }
+
+    // DISABLED
+    &:disabled {
+      pointer-events: none;
+      ${Dt(e, "DISABLED")};
+      ${At(e, "DISABLED")};
+      ${kt(e, "DISABLED")};
+    }
+
+    &.--ICONBUTTON-flipped {
+      .--ICONBUTTON-span {
+        > span {
+          rotate: 180deg !important;
+        }
+      }
+    }
+
+    .--ICONBUTTON-span {
+      width: 24px;
+      height: 24px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      box-sizing: border-box;
+      ${t(e, "border-radius", "--ICONBUTTON-ROOT-BORDER-RADIUS")};
+
+      > span {
+        rotate: 0deg;
+        transition: rotate 150ms ease-in-out;
+        position: absolute;
+        width: 100%;
+        height: auto;
+        z-index: 1;
+      }
+    }
+
+    &:before {
+      content: '';
+      position: absolute;
+      width: 32px;
+      height: 32px;
+      border-radius: 50%;
+      opacity: 0;
+      transition: opacity 150ms ease-in-out;
+      z-index: -1;
+    }
+  }
+`, $ = "--ICONBUTTON", Nt = ({ className: e, style: t, icon: n, onClick: r, isFlipped: i, ...a }) => {
+	let [o, s] = c(!1);
+	return /* @__PURE__ */ Q("button", {
+		className: [
+			$,
+			o ? `${$}-active` : "",
+			i ? `${$}-flipped` : "",
+			e
+		].join(" "),
+		css: Mt(t),
+		type: "button",
+		onClick: r,
+		onKeyDown: (e) => {
+			e.stopPropagation(), (e.key === "Enter" || e.key === "Space") && s(!0), a.onKeyDown?.(e);
+		},
+		onKeyUp: (e) => {
+			(e.key === "Enter" || e.key === "Space") && s(!1), a.onKeyUp?.(e);
+		},
+		onBlur: (e) => {
+			s(!1), a.onBlur?.(e);
+		},
+		"data-testid": $,
+		...a,
+		children: /* @__PURE__ */ Q("span", {
+			className: `${$}-span`,
+			children: n
+		})
+	});
+}, Pt = ({ theme: e, variant: t = "default", ...n }) => {
+	let { componentStyles: r } = S([ee.ICONBUTTON], e, t.toUpperCase());
+	return /* @__PURE__ */ Q(Nt, {
+		...n,
+		style: r
+	});
 };
 //#endregion
-export { b as a, y as i, _t as n, vt as r, gt as t };
+export { Ct as a, C as c, Q as i, Et as n, ee as o, St as r, S as s, Pt as t };
 
-//# sourceMappingURL=emotion-react-jsx-runtime.browser.esm-Ct_bZ5JG.js.map
+//# sourceMappingURL=IconButton-C3x-E-ot.js.map