@studiolxd/brand 49.18.0 → 49.20.0

package/dist/list.css

@@ -1 +1 @@
-.list{font-family:var(--text-list-font-family);font-size:var(--text-list-font-size);font-weight:var(--text-list-font-weight);line-height:var(--text-list-line-height);color:var(--text-list-color);letter-spacing:var(--text-list-letter-spacing);margin-block:0;margin-inline:0;padding-inline-start:var(--text-list-padding-inline-start)}.list>li+li,.list>.list__item+.list__item{margin-block-start:var(--text-list-gap)}.list.list--unordered{list-style-type:disc}.list.list--ordered{list-style-type:decimal}.list.list--plain{padding-inline-start:0;list-style-type:none}
+.list{font-family:var(--text-list-font-family);font-size:var(--text-list-font-size);font-weight:var(--text-list-font-weight);line-height:var(--text-list-line-height);color:var(--text-list-color);letter-spacing:var(--text-list-letter-spacing);margin-block:0;margin-inline:0;padding-inline-start:var(--text-list-padding-inline-start)}.list>li+li,.list>.list__item+.list__item{margin-block-start:var(--text-list-gap)}.list.list--unordered{list-style-type:disc}.list.list--ordered{list-style-type:decimal}.list.list--plain{padding-inline-start:0;list-style-type:none}.list.list--separated>li+li,.list.list--separated>.list__item+.list__item{border-block-start:var(--text-list-separator-thickness) solid var(--text-list-separator-color);margin-block-start:var(--text-list-separator-spacing);padding-block-start:var(--text-list-separator-spacing)}.list__item-row{align-items:center;column-gap:var(--text-list-item-gap);display:flex}.list__item-main{flex:auto;min-inline-size:0}.list__item-secondary{font-size:var(--text-list-secondary-font-size);line-height:var(--text-list-secondary-line-height);color:var(--text-list-secondary-color)}.list__item-leading,.list__item-trailing{flex:none;align-items:center;display:flex}

package/dist/list.js

@@ -1,25 +1,51 @@
 import './list.css';
 import { forwardRef as e } from "react";
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
 //#region src/stories/atoms/List/List.tsx
-var n = e(function({ type: e = "unordered", className: n, children: r, ...i }, a) {
+var r = e(function({ type: e = "unordered", showSeparators: n = !1, className: r, children: i, ...a }, o) {
 	return /* @__PURE__ */ t(e === "ordered" ? "ol" : "ul", {
-		ref: a,
+		ref: o,
 		className: [
 			"list",
 			`list--${e}`,
-			n ?? ""
+			n ? "list--separated" : "",
+			r ?? ""
 		].filter(Boolean).join(" "),
-		...i,
-		children: r
+		...a,
+		children: i
 	});
-}), r = e(function({ as: e = "li", className: n, children: r, ...i }, a) {
-	return /* @__PURE__ */ t(e, {
-		ref: a,
-		className: ["list__item", n ?? ""].filter(Boolean).join(" "),
-		...i,
-		children: r
+}), i = e(function({ as: e = "li", leading: r, secondary: i, trailing: a, className: o, children: s, ...c }, l) {
+	let u = ["list__item", o ?? ""].filter(Boolean).join(" "), d = i != null && i !== !1, f = r != null && r !== !1, p = a != null && a !== !1;
+	return !d && !p && !f ? /* @__PURE__ */ t(e, {
+		ref: l,
+		className: u,
+		...c,
+		children: s
+	}) : /* @__PURE__ */ t(e, {
+		ref: l,
+		className: u,
+		...c,
+		children: /* @__PURE__ */ n("div", {
+			className: "list__item-row",
+			children: [
+				f && /* @__PURE__ */ t("div", {
+					className: "list__item-leading",
+					children: r
+				}),
+				/* @__PURE__ */ n("div", {
+					className: "list__item-main",
+					children: [s, d && /* @__PURE__ */ t("div", {
+						className: "list__item-secondary",
+						children: i
+					})]
+				}),
+				p && /* @__PURE__ */ t("div", {
+					className: "list__item-trailing",
+					children: a
+				})
+			]
+		})
 	});
 });
 //#endregion
-export { n as List, r as ListItem };
+export { r as List, i as ListItem };

package/dist/number-input-field.js

@@ -8,21 +8,21 @@ import { n as i } from "./_shared/field-labels.js";
 import { forwardRef as a, useId as o } from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/stories/molecules/NumberInputField/NumberInputField.tsx
-var l = a(function({ id: a, label: l, labelHidden: u, value: d, defaultValue: f, min: p, max: m, step: h = 1, decimal: g, disabled: _, readOnly: v, size: y, error: b = !1, errorMessage: x, helperText: S, className: C, onChange: w, ...T }, E) {
-	let D = i(u), O = e(y), k = o(), A = a ?? k, j = x ? `${A}-error` : void 0, M = S ? `${A}-helper` : void 0, N = [j, M].filter(Boolean).join(" ") || void 0, P = b || !!x;
+var l = a(function({ id: a, label: l, labelHidden: u, value: d, defaultValue: f, min: p, max: m, step: h = 1, decimal: g, disabled: _, readOnly: v, size: y, compact: b, commitMode: x, error: S = !1, errorMessage: C, helperText: w, className: T, onChange: E, onEmpty: D, ...O }, k) {
+	let A = i(u), j = e(y), M = o(), N = a ?? M, P = C ? `${N}-error` : void 0, F = w ? `${N}-helper` : void 0, I = [P, F].filter(Boolean).join(" ") || void 0, L = S || !!C;
 	return /* @__PURE__ */ c("div", {
-		className: ["number-input-field", C].filter(Boolean).join(" "),
+		className: ["number-input-field", T].filter(Boolean).join(" "),
 		children: [
 			/* @__PURE__ */ s(n, {
-				htmlFor: A,
-				hidden: D,
-				size: O,
+				htmlFor: N,
+				hidden: A,
+				size: j,
 				children: l
 			}),
 			/* @__PURE__ */ s(r, {
-				ref: E,
-				...T,
-				id: A,
+				ref: k,
+				...O,
+				id: N,
 				value: d,
 				defaultValue: f,
 				min: p,
@@ -31,19 +31,22 @@ var l = a(function({ id: a, label: l, labelHidden: u, value: d, defaultValue: f,
 				decimal: g,
 				disabled: _,
 				readOnly: v,
-				size: O,
-				error: P,
-				"aria-describedby": N,
-				onChange: w
+				size: j,
+				compact: b,
+				commitMode: x,
+				error: L,
+				"aria-describedby": I,
+				onChange: E,
+				onEmpty: D
 			}),
-			x && /* @__PURE__ */ s(t, {
-				id: j,
-				children: x
+			C && /* @__PURE__ */ s(t, {
+				id: P,
+				children: C
 			}),
-			S && /* @__PURE__ */ s("span", {
-				id: M,
+			w && /* @__PURE__ */ s("span", {
+				id: F,
 				className: "number-input-field__helper",
-				children: S
+				children: w
 			})
 		]
 	});

package/dist/number-input.css

@@ -1 +1 @@
-.number-input{min-block-size:var(--number-input-height);border-radius:var(--number-input-border-radius);border-width:var(--number-input-border-width);border-style:var(--number-input-border-style);border-color:var(--number-input-border-color);background-color:var(--number-input-bg);transition:border-color var(--number-input-transition-duration) var(--number-input-transition-easing);box-sizing:border-box;align-items:stretch;display:inline-flex;overflow:hidden}.number-input.number-input--focused{box-shadow:inset 0 0 0 calc(var(--number-input-focus-ring-width) + var(--number-input-focus-ring-inset-offset)) var(--number-input-focus-ring-color), inset 0 0 0 var(--number-input-focus-ring-inset-offset) var(--number-input-bg);border-color:var(--number-input-focus-border-color);outline:none}.number-input__field{min-width:0;padding-block:0;padding-inline:var(--number-input-padding-inline);color:var(--number-input-color);font-family:var(--number-input-font-family);font-size:var(--number-input-font-size);font-weight:var(--number-input-font-weight);line-height:var(--number-input-line-height);text-align:center;-moz-appearance:textfield;background-color:#0000;border:none;outline:none;flex:1}.number-input__field::-webkit-inner-spin-button{appearance:none;margin:0}.number-input__field::-webkit-outer-spin-button{appearance:none;margin:0}.number-input__btn{width:var(--number-input-btn-width);background-color:var(--number-input-btn-bg);color:var(--number-input-btn-color);cursor:pointer;transition:box-shadow var(--number-input-transition-duration) var(--number-input-transition-easing);border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.number-input__btn:hover:not(:disabled){box-shadow:inset 0 calc(-1 * var(--number-input-btn-hover-line-width)) 0 0 var(--number-input-btn-hover-line-color)}.number-input__btn--decrement{border-inline-end-width:var(--number-input-border-width);border-inline-end-style:var(--number-input-border-style);border-inline-end-color:var(--number-input-btn-separator-color)}.number-input__btn--increment{border-inline-start-width:var(--number-input-border-width);border-inline-start-style:var(--number-input-border-style);border-inline-start-color:var(--number-input-btn-separator-color)}.number-input.number-input--error{border-color:var(--number-input-error-border-color);background-color:var(--number-input-error-bg)}.number-input.number-input--error .number-input__field{color:var(--number-input-error-color)}.number-input.number-input--error.number-input--focused{box-shadow:inset 0 0 0 calc(var(--number-input-focus-ring-width) + var(--number-input-focus-ring-inset-offset)) var(--number-input-error-focus-ring-color), inset 0 0 0 var(--number-input-focus-ring-inset-offset) var(--number-input-error-bg);border-color:var(--number-input-error-focus-border-color);outline:none}.number-input.number-input--disabled{cursor:var(--number-input-disabled-cursor);background-color:var(--number-input-disabled-bg);border-color:var(--number-input-disabled-border-color);pointer-events:none}.number-input.number-input--disabled .number-input__field{color:var(--number-input-disabled-color)}.number-input.number-input--disabled .number-input__btn{color:var(--number-input-disabled-btn-color)}.number-input.number-input--sm{--number-input-height:var(--number-input-sm-height);--number-input-padding-inline:var(--number-input-sm-padding-inline);--number-input-font-size:var(--number-input-sm-font-size)}.number-input.number-input--lg{--number-input-height:var(--number-input-lg-height);--number-input-padding-inline:var(--number-input-lg-padding-inline);--number-input-font-size:var(--number-input-lg-font-size)}
+.number-input{min-block-size:var(--number-input-height);border-radius:var(--number-input-border-radius);border-width:var(--number-input-border-width);border-style:var(--number-input-border-style);border-color:var(--number-input-border-color);background-color:var(--number-input-bg);transition:border-color var(--number-input-transition-duration) var(--number-input-transition-easing);box-sizing:border-box;align-items:stretch;display:inline-flex;overflow:hidden}.number-input.number-input--focused{box-shadow:inset 0 0 0 calc(var(--number-input-focus-ring-width) + var(--number-input-focus-ring-inset-offset)) var(--number-input-focus-ring-color), inset 0 0 0 var(--number-input-focus-ring-inset-offset) var(--number-input-bg);border-color:var(--number-input-focus-border-color);outline:none}.number-input__field{min-width:0;padding-block:0;padding-inline:var(--number-input-padding-inline);color:var(--number-input-color);font-family:var(--number-input-font-family);font-size:var(--number-input-font-size);font-weight:var(--number-input-font-weight);line-height:var(--number-input-line-height);text-align:center;-moz-appearance:textfield;background-color:#0000;border:none;outline:none;flex:1}.number-input__field::-webkit-inner-spin-button{appearance:none;margin:0}.number-input__field::-webkit-outer-spin-button{appearance:none;margin:0}.number-input__btn{width:var(--number-input-btn-width);background-color:var(--number-input-btn-bg);color:var(--number-input-btn-color);cursor:pointer;transition:box-shadow var(--number-input-transition-duration) var(--number-input-transition-easing);border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.number-input__btn:hover:not(:disabled){box-shadow:inset 0 calc(-1 * var(--number-input-btn-hover-line-width)) 0 0 var(--number-input-btn-hover-line-color)}.number-input__btn--decrement{border-inline-end-width:var(--number-input-border-width);border-inline-end-style:var(--number-input-border-style);border-inline-end-color:var(--number-input-btn-separator-color)}.number-input__btn--increment{border-inline-start-width:var(--number-input-border-width);border-inline-start-style:var(--number-input-border-style);border-inline-start-color:var(--number-input-btn-separator-color)}.number-input.number-input--error{border-color:var(--number-input-error-border-color);background-color:var(--number-input-error-bg)}.number-input.number-input--error .number-input__field{color:var(--number-input-error-color)}.number-input.number-input--error.number-input--focused{box-shadow:inset 0 0 0 calc(var(--number-input-focus-ring-width) + var(--number-input-focus-ring-inset-offset)) var(--number-input-error-focus-ring-color), inset 0 0 0 var(--number-input-focus-ring-inset-offset) var(--number-input-error-bg);border-color:var(--number-input-error-focus-border-color);outline:none}.number-input.number-input--disabled{cursor:var(--number-input-disabled-cursor);background-color:var(--number-input-disabled-bg);border-color:var(--number-input-disabled-border-color);pointer-events:none}.number-input.number-input--disabled .number-input__field{color:var(--number-input-disabled-color)}.number-input.number-input--disabled .number-input__btn{color:var(--number-input-disabled-btn-color)}.number-input.number-input--sm{--number-input-height:var(--number-input-sm-height);--number-input-padding-inline:var(--number-input-sm-padding-inline);--number-input-font-size:var(--number-input-sm-font-size)}.number-input.number-input--lg{--number-input-height:var(--number-input-lg-height);--number-input-padding-inline:var(--number-input-lg-padding-inline);--number-input-font-size:var(--number-input-lg-font-size)}.number-input.number-input--compact{--number-input-height:var(--number-input-compact-height);--number-input-padding-inline:var(--number-input-compact-padding-inline);--number-input-font-size:var(--number-input-compact-font-size);--number-input-btn-width:var(--number-input-compact-btn-width)}.number-input.number-input--compact .number-input__field{width:var(--number-input-compact-field-width);flex:none}

package/dist/number-input.js

@@ -5,47 +5,56 @@ import { Icon as t } from "./icon.js";
 import { forwardRef as n, useCallback as r, useState as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/stories/atoms/NumberInput/NumberInput.tsx
-var s = n(function({ value: n, defaultValue: s = 0, min: c, max: l, step: u = 1, decimal: d = !1, disabled: f = !1, readOnly: p = !1, size: m = "md", error: h = !1, id: g, name: _, describedBy: v, ariaLabel: y, decrementLabel: b, incrementLabel: x, className: S, onChange: C, onBlur: w, onFocus: T, ...E }, D) {
-	let O = e("numberInput"), k = n !== void 0, [A, j] = i(s), [M, N] = i(!1), [P, F] = i(null), I = k ? n : A, L = P === null ? String(I) : P, R = r((e) => {
+var s = n(function({ value: n, defaultValue: s = 0, min: c, max: l, step: u = 1, decimal: d = !1, disabled: f = !1, readOnly: p = !1, size: m = "md", compact: h = !1, commitMode: g = "change", error: _ = !1, id: v, name: y, describedBy: b, ariaLabel: x, decrementLabel: S, incrementLabel: C, className: w, onChange: T, onEmpty: E, onBlur: D, onFocus: O, onKeyDown: k, ...A }, j) {
+	let M = e("numberInput"), N = n !== void 0, [P, F] = i(s), [I, L] = i(!1), [R, z] = i(null), B = N ? n : P, V = R === null ? B === null ? "" : String(B) : R, H = B ?? 0, U = r((e) => {
 		let t = e;
 		return c !== void 0 && (t = Math.max(c, t)), l !== void 0 && (t = Math.min(l, t)), t;
-	}, [c, l]), z = r((e) => {
-		let t = R(e);
-		k || j(t), C?.(t);
+	}, [c, l]), W = r((e) => {
+		let t = U(e);
+		N || F(t), T?.(t);
 	}, [
-		R,
-		k,
-		C
-	]), B = () => {
-		f || p || (F(null), z(I - u));
-	}, V = () => {
-		f || p || (F(null), z(I + u));
-	}, H = (e) => {
+		U,
+		N,
+		T
+	]), G = () => {
+		f || p || (z(null), W(H - u));
+	}, K = () => {
+		f || p || (z(null), W(H + u));
+	}, q = (e) => {
+		let t = d ? e.replace(",", ".") : e, n = parseFloat(t);
+		if (!isNaN(n)) {
+			if (g === "blur" && U(n) === B) return;
+			W(n);
+		} else if (E && e.trim() === "") {
+			if (g === "blur" && B === null) return;
+			N || F(null), E();
+		}
+	}, J = (e) => {
 		let t = e.target.value;
-		F(t);
-		let n = d ? t.replace(",", ".") : t, r = parseFloat(n);
-		isNaN(r) || z(r);
-	}, U = (e) => {
-		N(!0), T?.(e);
-	}, W = (e) => {
-		N(!1), F(null), w?.(e);
-	}, G = [
+		z(t), g === "change" && q(t);
+	}, Y = (e) => {
+		k?.(e), !(e.defaultPrevented || g !== "blur" || R === null) && (e.key === "Enter" ? (q(R), z(null)) : e.key === "Escape" && (e.preventDefault(), z(null)));
+	}, X = (e) => {
+		L(!0), O?.(e);
+	}, Z = (e) => {
+		L(!1), g === "blur" && R !== null && q(R), z(null), D?.(e);
+	}, Q = [
 		"number-input",
-		m === "md" ? "" : `number-input--${m}`,
-		h ? "number-input--error" : "",
+		h ? "number-input--compact" : m === "md" ? "" : `number-input--${m}`,
+		_ ? "number-input--error" : "",
 		f ? "number-input--disabled" : "",
-		M ? "number-input--focused" : "",
-		S ?? ""
-	].filter(Boolean).join(" "), K = f || p || c !== void 0 && I <= c, q = f || p || l !== void 0 && I >= l;
+		I ? "number-input--focused" : "",
+		w ?? ""
+	].filter(Boolean).join(" "), $ = f || p || B !== null && c !== void 0 && B <= c, ee = f || p || B !== null && l !== void 0 && B >= l;
 	return /* @__PURE__ */ o("div", {
-		className: G,
+		className: Q,
 		children: [
 			/* @__PURE__ */ a("button", {
 				className: "number-input__btn number-input__btn--decrement",
 				type: "button",
-				onClick: B,
-				disabled: K,
-				"aria-label": O("decrement", b),
+				onClick: G,
+				disabled: $,
+				"aria-label": M("decrement", S),
 				tabIndex: -1,
 				children: /* @__PURE__ */ a(t, {
 					name: "minus",
@@ -53,30 +62,31 @@ var s = n(function({ value: n, defaultValue: s = 0, min: c, max: l, step: u = 1,
 				})
 			}),
 			/* @__PURE__ */ a("input", {
-				ref: D,
+				ref: j,
 				className: "number-input__field",
 				type: "text",
 				inputMode: d ? "decimal" : "numeric",
 				pattern: d ? "[0-9]*[.,]?[0-9]*" : "[0-9]*",
-				"aria-invalid": h || void 0,
-				"aria-describedby": v,
-				"aria-label": y,
-				...E,
-				id: g,
-				name: _,
-				value: L,
+				"aria-invalid": _ || void 0,
+				"aria-describedby": b,
+				"aria-label": x,
+				...A,
+				id: v,
+				name: y,
+				value: V,
 				disabled: f,
 				readOnly: p,
-				onChange: H,
-				onFocus: U,
-				onBlur: W
+				onChange: J,
+				onKeyDown: Y,
+				onFocus: X,
+				onBlur: Z
 			}),
 			/* @__PURE__ */ a("button", {
 				className: "number-input__btn number-input__btn--increment",
 				type: "button",
-				onClick: V,
-				disabled: q,
-				"aria-label": O("increment", x),
+				onClick: K,
+				disabled: ee,
+				"aria-label": M("increment", C),
 				tabIndex: -1,
 				children: /* @__PURE__ */ a(t, {
 					name: "plus",

package/dist/text.css

@@ -1 +1 @@
-.text{color:inherit;font:inherit}strong.text{font-weight:var(--text-inline-emphasis-font-weight)}.text.text--muted{color:var(--text-inline-muted-color)}.text.text--destructive{color:var(--text-inline-destructive-color)}.text.text--success{color:var(--text-inline-success-color)}
+.text{color:inherit;font:inherit}strong.text{font-weight:var(--text-inline-emphasis-font-weight)}.text.text--strikethrough{color:var(--text-inline-strikethrough-color);text-decoration-line:line-through;text-decoration-thickness:var(--text-inline-strikethrough-thickness)}.text.text--muted{color:var(--text-inline-muted-color)}.text.text--destructive{color:var(--text-inline-destructive-color)}.text.text--success{color:var(--text-inline-success-color)}

package/dist/text.js

@@ -2,16 +2,17 @@ import './text.css';
 import { forwardRef as e } from "react";
 import { jsx as t } from "react/jsx-runtime";
 //#region src/stories/atoms/Text/Text.tsx
-var n = e(function({ as: e = "span", tone: n = "default", className: r, children: i, ...a }, o) {
+var n = e(function({ as: e = "span", tone: n = "default", strikethrough: r = !1, className: i, children: a, ...o }, s) {
 	return /* @__PURE__ */ t(e, {
-		ref: o,
+		ref: s,
 		className: [
 			"text",
+			r || e === "del" || e === "s" ? "text--strikethrough" : "",
 			n === "default" ? "" : `text--${n}`,
-			r ?? ""
+			i ?? ""
 		].filter(Boolean).join(" "),
-		...a,
-		children: i
+		...o,
+		children: a
 	});
 }), r = e(function({ className: e, ...n }, r) {
 	return /* @__PURE__ */ t("br", {

package/dist/toaster.js

@@ -19,33 +19,36 @@ function h(e, t) {
 	return [
 		"alert",
 		m[e ?? ""] ?? "",
-		e === "warning" ? "" : "surface-dark",
+		e === "success" || e === "error" ? "surface-dark" : "",
 		t ? "alert--dismissible" : "",
 		"toast"
 	].filter(Boolean).join(" ");
 }
-function g({ position: a, containerAriaLabel: o, closeLabel: c, closeButton: p, gap: m, expand: g }) {
-	let _ = e("toaster"), { toasts: v } = f.useToastManager(), [y, b] = a.split("-"), x = v.map((e) => e.id).join(",");
+function g(e) {
+	return e === "success" || e === "error" ? "" : e === "warning" ? " surface-light" : " surface-invert";
+}
+function _({ position: a, containerAriaLabel: o, closeLabel: c, closeButton: p, gap: m, expand: _ }) {
+	let v = e("toaster"), { toasts: y } = f.useToastManager(), [b, x] = a.split("-"), S = y.map((e) => e.id).join(",");
 	l(() => {
-		s(x ? x.split(",") : []);
-	}, [x]);
-	let S = i({ "--toast-gap": `${m}px` }), C = t(void 0), w = [
+		s(S ? S.split(",") : []);
+	}, [S]);
+	let C = i({ "--toast-gap": `${m}px` }), w = t(void 0), T = [
 		"toaster",
-		y === "top" ? "toaster--top" : "",
-		b === "right" ? "" : `toaster--${b}`,
-		g ? "toaster--expanded" : ""
+		b === "top" ? "toaster--top" : "",
+		x === "right" ? "" : `toaster--${x}`,
+		_ ? "toaster--expanded" : ""
 	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ u(f.Portal, {
-		container: C,
+		container: w,
 		children: /* @__PURE__ */ u(f.Viewport, {
-			ref: S,
-			className: w,
-			"aria-label": _("container", o),
-			children: v.map((e) => /* @__PURE__ */ d(f.Root, {
+			ref: C,
+			className: T,
+			"aria-label": v("container", o),
+			children: y.map((e) => /* @__PURE__ */ d(f.Root, {
 				toast: e,
 				className: h(e.type, p),
 				children: [/* @__PURE__ */ d("div", {
-					className: "alert__content",
+					className: `alert__content${g(e.type)}`,
 					children: [
 						/* @__PURE__ */ u(f.Title, { className: "alert__title" }),
 						/* @__PURE__ */ u(f.Description, { className: "alert__description" }),
@@ -58,20 +61,20 @@ function g({ position: a, containerAriaLabel: o, closeLabel: c, closeButton: p,
 						})
 					]
 				}), p && /* @__PURE__ */ u(f.Close, {
-					className: "alert__close",
-					render: /* @__PURE__ */ u(r, { label: _("close", c) })
+					className: `alert__close${g(e.type)}`,
+					render: /* @__PURE__ */ u(r, { label: v("close", c) })
 				})]
 			}, e.id))
 		})
 	});
 }
-function _({ position: e = "bottom-right", containerAriaLabel: t, closeLabel: n, closeButton: r = !0, duration: i = a, gap: s = p, visibleToasts: d = 3, expand: m = !1 }) {
+function v({ position: e = "bottom-right", containerAriaLabel: t, closeLabel: n, closeButton: r = !0, duration: i = a, gap: s = p, visibleToasts: d = 3, expand: m = !1 }) {
 	let h = Number.isFinite(i) ? i : 0;
 	return l(() => o(h), [h]), /* @__PURE__ */ u(f.Provider, {
 		toastManager: c,
 		timeout: h,
 		limit: d,
-		children: /* @__PURE__ */ u(g, {
+		children: /* @__PURE__ */ u(_, {
 			position: e,
 			containerAriaLabel: t,
 			closeLabel: n,
@@ -82,4 +85,4 @@ function _({ position: e = "bottom-right", containerAriaLabel: t, closeLabel: n,
 	});
 }
 //#endregion
-export { _ as Toaster };
+export { v as Toaster };