@studiolxd/brand 49.28.0 → 51.0.0

package/dist/card.js

@@ -1,91 +1,94 @@
 'use client';
 import './card.css';
-import { VisuallyHidden as e } from "./visually-hidden.js";
-import { Arrow as t } from "./arrow.js";
-import { Heading as n } from "./heading.js";
-import { Paragraph as r } from "./paragraph.js";
-import { forwardRef as i, useCallback as a, useRef as o } from "react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
-import { useRender as u } from "@base-ui/react/use-render";
+import { n as e } from "./_shared/env.js";
+import { VisuallyHidden as t } from "./visually-hidden.js";
+import { Arrow as n } from "./arrow.js";
+import { Heading as r } from "./heading.js";
+import { t as i } from "./_shared/assign-ref.js";
+import { Paragraph as a } from "./paragraph.js";
+import { forwardRef as o, useCallback as s, useRef as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { useRender as f } from "@base-ui/react/use-render";
 //#region src/stories/molecules/Card/Card.tsx
-var d = i(function({ href: r, render: i, external: a = !1, title: o, description: d, ctaLabel: f, color: p = "outline", variant: m = "default", media: h, linkOverlay: g = !1, selectable: _ = !1, selected: v = !1, className: y, children: b, ...x }, S) {
-	let C = [
+var p = o(function({ href: i, render: a, external: o = !1, title: s, description: c, ctaLabel: p, tone: m, color: h, variant: g = "default", media: _, linkOverlay: v = !1, selectable: y = !1, selected: b = !1, className: x, children: S, ...C }, w) {
+	h !== void 0 && e("Card", "color", "`tone`");
+	let T = [
 		"card",
-		`card--${p}`,
-		m === "default" ? "" : `card--${m}`,
-		g ? "card--link-overlay" : "",
-		_ ? "card--selectable" : "",
-		_ && v ? "card--selected" : "",
-		y ?? ""
-	].filter(Boolean).join(" "), w = /* @__PURE__ */ l(s, { children: [
-		o !== void 0 && /* @__PURE__ */ c(n, {
+		`card--${m ?? h ?? "outline"}`,
+		g === "default" ? "" : `card--${g}`,
+		v ? "card--link-overlay" : "",
+		y ? "card--selectable" : "",
+		y && b ? "card--selected" : "",
+		x ?? ""
+	].filter(Boolean).join(" "), E = /* @__PURE__ */ d(l, { children: [
+		s !== void 0 && /* @__PURE__ */ u(r, {
 			level: 2,
 			size: 8,
-			children: o
+			children: s
 		}),
-		d && (typeof d == "string" ? /* @__PURE__ */ c("p", { children: d }) : d),
-		b,
-		f !== void 0 && /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(e, { children: f }), /* @__PURE__ */ c(t, { size: "lg" })] })
-	] }), T = h && /* @__PURE__ */ c("div", {
+		c && (typeof c == "string" ? /* @__PURE__ */ u("p", { children: c }) : c),
+		S,
+		p !== void 0 && /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(t, { children: p }), /* @__PURE__ */ u(n, { size: "lg" })] })
+	] }), D = _ && /* @__PURE__ */ u("div", {
 		className: "card__media",
-		children: /* @__PURE__ */ c("img", {
-			src: h.src,
-			alt: h.alt
+		children: /* @__PURE__ */ u("img", {
+			src: _.src,
+			alt: _.alt
 		})
-	}), E = m === "default" && !h ? w : /* @__PURE__ */ l(s, { children: [T, /* @__PURE__ */ c("div", {
+	}), O = g === "default" && !_ ? E : /* @__PURE__ */ d(l, { children: [D, /* @__PURE__ */ u("div", {
 		className: "card__body",
-		children: w
+		children: E
 	})] });
-	return u({
-		render: i,
-		ref: S,
-		enabled: i !== void 0,
+	return f({
+		render: a,
+		ref: w,
+		enabled: a !== void 0,
 		props: {
-			className: C,
-			...x,
-			children: E
+			className: T,
+			...C,
+			children: O
 		}
-	}) || (r === void 0 ? /* @__PURE__ */ c("div", {
-		ref: S,
-		className: C,
-		...x,
-		children: b
-	}) : /* @__PURE__ */ c("a", {
-		ref: S,
-		href: r,
-		className: C,
-		...a ? {
+	}) || (i === void 0 ? /* @__PURE__ */ u("div", {
+		ref: w,
+		className: T,
+		...C,
+		children: S
+	}) : /* @__PURE__ */ u("a", {
+		ref: w,
+		href: i,
+		className: T,
+		...o ? {
 			target: "_blank",
 			rel: "noopener noreferrer"
 		} : {},
-		...x,
-		children: E
+		...C,
+		children: O
 	}));
 });
-function f(e, t, n) {
+function m(e, t, n) {
 	return [
 		e,
 		t ? "card__interactive" : "",
 		n
 	].filter(Boolean).join(" ");
 }
-var p = i(function({ interactive: e, className: t, ...n }, r) {
-	return /* @__PURE__ */ c("div", {
+var h = o(function({ interactive: e, className: t, ...n }, r) {
+	return /* @__PURE__ */ u("div", {
 		ref: r,
-		className: f("card__header", e, t),
+		className: m("card__header", e, t),
 		...n
 	});
-}), m = i(function({ level: e = 3, size: t = 4, className: r, children: i, ...a }, o) {
-	return /* @__PURE__ */ c(n, {
+}), g = o(function({ level: e = 3, size: t = 4, className: n, children: i, ...a }, o) {
+	return /* @__PURE__ */ u(r, {
 		ref: o,
 		level: e,
 		size: t,
-		className: ["card__title", r].filter(Boolean).join(" "),
+		className: ["card__title", n].filter(Boolean).join(" "),
 		...a,
 		children: i
 	});
-}), h = i(function({ size: e = "small", lines: t, className: n, children: i, ...a }, o) {
-	return /* @__PURE__ */ c(r, {
+}), _ = o(function({ size: e = "sm", lines: t, className: n, children: r, ...i }, o) {
+	return /* @__PURE__ */ u(a, {
 		ref: o,
 		size: e,
 		className: [
@@ -93,28 +96,28 @@ var p = i(function({ interactive: e, className: t, ...n }, r) {
 			t ? `card__description--lines-${t}` : "",
 			n
 		].filter(Boolean).join(" "),
-		...a,
-		children: i
+		...i,
+		children: r
 	});
-}), g = i(function({ isolate: e = !0, className: t, onClick: n, ...r }, i) {
-	let s = o(null);
-	return /* @__PURE__ */ c("div", {
-		ref: a((e) => {
-			s.current = e, typeof i == "function" ? i(e) : i && (i.current = e);
-		}, [i]),
+}), v = o(function({ isolate: e = !0, className: t, onClick: n, ...r }, a) {
+	let o = c(null);
+	return /* @__PURE__ */ u("div", {
+		ref: s((e) => {
+			o.current = e, i(a, e);
+		}, [a]),
 		className: ["card__action", t].filter(Boolean).join(" "),
 		onClick: (t) => {
 			if (e) {
 				t.stopPropagation();
-				let e = s.current;
+				let e = o.current;
 				(e?.contains(t.target) ?? !1) && e?.parentElement?.closest("a[href], [role=\"link\"]") && t.preventDefault();
 			}
 			n?.(t);
 		},
 		...r
 	});
-}), _ = i(function({ isolate: e = !0, className: t, onClick: n, ...r }, i) {
-	return /* @__PURE__ */ c("div", {
+}), y = o(function({ isolate: e = !0, className: t, onClick: n, ...r }, i) {
+	return /* @__PURE__ */ u("div", {
 		ref: i,
 		className: ["card__selection", t].filter(Boolean).join(" "),
 		onClick: (t) => {
@@ -122,18 +125,18 @@ var p = i(function({ interactive: e, className: t, ...n }, r) {
 		},
 		...r
 	});
-}), v = i(function({ interactive: e, className: t, ...n }, r) {
-	return /* @__PURE__ */ c("div", {
+}), b = o(function({ interactive: e, className: t, ...n }, r) {
+	return /* @__PURE__ */ u("div", {
 		ref: r,
-		className: f("card__content", e, t),
+		className: m("card__content", e, t),
 		...n
 	});
-}), y = i(function({ direction: e = "row", interactive: t, className: n, ...r }, i) {
-	return /* @__PURE__ */ c("div", {
+}), x = o(function({ direction: e = "row", interactive: t, className: n, ...r }, i) {
+	return /* @__PURE__ */ u("div", {
 		ref: i,
-		className: f("card__footer", t, [e === "column" ? "card__footer--column" : "", n].filter(Boolean).join(" ") || void 0),
+		className: m("card__footer", t, [e === "column" ? "card__footer--column" : "", n].filter(Boolean).join(" ") || void 0),
 		...r
 	});
 });
 //#endregion
-export { d as Card, g as CardAction, v as CardContent, h as CardDescription, y as CardFooter, p as CardHeader, _ as CardSelection, m as CardTitle };
+export { p as Card, v as CardAction, b as CardContent, _ as CardDescription, x as CardFooter, h as CardHeader, y as CardSelection, g as CardTitle };

package/dist/carousel.css

@@ -1 +1 @@
-.carousel{display:block}.carousel__track{gap:var(--carousel-gap);overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scrollbar-width:none;display:flex;overflow-x:auto}.carousel__track::-webkit-scrollbar{display:none}.carousel__track:focus-visible{outline:var(--carousel-focus-ring-width) solid var(--carousel-focus-ring-color);outline-offset:var(--carousel-focus-ring-offset)}.carousel__slide{flex:0 0 var(--carousel-slide-size);scroll-snap-align:start;min-inline-size:0}.carousel__controls{justify-content:space-between;align-items:center;gap:var(--carousel-controls-gap);flex-wrap:wrap;margin-block-start:var(--carousel-controls-space-before);display:flex}.carousel__indicators{align-items:center;gap:var(--carousel-controls-gap);display:flex}.carousel__indicator{cursor:pointer;inline-size:var(--carousel-indicator-inline-size);block-size:var(--carousel-indicator-hit-block-size);background:0 0;border:0;align-items:center;padding:0;display:flex}.carousel__indicator:before{content:"";inline-size:100%;block-size:var(--carousel-indicator-block-size);background-color:var(--carousel-indicator-color)}.carousel__indicator[aria-current]:before{background-color:var(--carousel-indicator-current-color)}.carousel__indicator:focus-visible{outline:var(--carousel-focus-ring-width) solid var(--carousel-focus-ring-color);outline-offset:var(--carousel-focus-ring-offset)}.carousel__buttons{align-items:center;gap:var(--carousel-controls-gap);margin-inline-start:auto;display:flex}
+.carousel{display:block}.carousel__track{gap:var(--carousel-gap);overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scrollbar-width:none;display:flex;overflow-x:auto}.carousel__track::-webkit-scrollbar{display:none}.carousel__track:focus-visible{outline:var(--carousel-focus-ring-width) solid var(--carousel-focus-ring-color);outline-offset:var(--carousel-focus-ring-offset)}.carousel__slide{flex:0 0 var(--carousel-slide-size);scroll-snap-align:start;min-inline-size:0}.carousel__controls{justify-content:space-between;align-items:center;gap:var(--carousel-controls-gap);flex-wrap:wrap;margin-block-start:var(--carousel-controls-space-before);display:flex}.carousel__indicators{align-items:center;gap:var(--carousel-controls-gap);display:flex}.carousel__indicator{cursor:pointer;inline-size:var(--carousel-indicator-width);block-size:var(--carousel-indicator-hit-height);background:0 0;border:0;align-items:center;padding:0;display:flex}.carousel__indicator:before{content:"";inline-size:100%;block-size:var(--carousel-indicator-height);background-color:var(--carousel-indicator-color)}.carousel__indicator[aria-current]:before{background-color:var(--carousel-indicator-current-color)}.carousel__indicator:focus-visible{outline:var(--carousel-focus-ring-width) solid var(--carousel-focus-ring-color);outline-offset:var(--carousel-focus-ring-offset)}.carousel__buttons{align-items:center;gap:var(--carousel-controls-gap);margin-inline-start:auto;display:flex}

package/dist/carousel.js

@@ -1,18 +1,32 @@
 'use client';
 import './carousel.css';
-import { n as e } from "./_shared/brandmessagescontext.js";
+import { r as e } from "./_shared/brandmessagescontext.js";
 import { Icon as t } from "./icon.js";
 import { VisuallyHidden as n } from "./visually-hidden.js";
 import { Button as r } from "./button.js";
 import { t as i } from "./_shared/css-properties.js";
 import { Children as a, useCallback as o, useEffect as s, useRef as c, useState as l } from "react";
 import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/stories/messages/es/carousel.ts
+var p = {
+	label: "Carrusel",
+	roleDescription: "carrusel",
+	track: "Diapositivas",
+	previous: "Anterior",
+	next: "Siguiente",
+	indicator: (e) => `Ir a la diapositiva ${e + 1}`,
+	pause: "Pausar",
+	play: "Reproducir",
+	slideStatus: (e, t) => `Diapositiva ${e + 1} de ${t}`,
+	slideRoleDescription: "diapositiva"
+};
+//#endregion
 //#region src/stories/molecules/Carousel/Carousel.tsx
-function p({ children: p, label: m, roleDescription: h, trackLabel: g, slideSize: _, controls: v = !0, indicators: y = !1, autoplay: b, prevLabel: x, nextLabel: S, indicatorLabel: C, pauseLabel: w, playLabel: T, slideStatusLabel: E, className: D, id: O }) {
-	let k = e("carousel"), A = c(null), [j, M] = l(0), N = c(0), [P, F] = l(!1), [I, L] = l(!1), R = a.count(p), z = b !== void 0 && !I, B = (e) => Array.from(e.children), V = o((e) => {
-		let t = A.current;
+function m({ children: m, label: h, roleDescription: g, trackLabel: _, slideSize: v, controls: y = !0, indicators: b = !1, autoplay: x, prevLabel: S, nextLabel: C, indicatorLabel: w, pauseLabel: T, playLabel: E, slideStatusLabel: D, className: O, id: k }) {
+	let A = e("carousel", p), j = c(null), [M, N] = l(0), P = c(0), [F, I] = l(!1), [L, R] = l(!1), z = a.count(m), B = x !== void 0 && !L, V = (e) => Array.from(e.children), H = o((e) => {
+		let t = j.current;
 		if (!t) return;
-		let n = B(t);
+		let n = V(t);
 		if (n.length === 0) return;
 		let r = n[(e + n.length) % n.length], i = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 		t.scrollTo({
@@ -21,90 +35,90 @@ function p({ children: p, label: m, roleDescription: h, trackLabel: g, slideSize
 		});
 	}, []);
 	s(() => {
-		let e = A.current;
+		let e = j.current;
 		if (!e) return;
 		let t = () => {
-			let t = B(e);
+			let t = V(e);
 			if (t.length === 0) return;
 			let n = t[0].offsetLeft, r = 0, i = Infinity;
 			t.forEach((t, a) => {
 				let o = Math.abs(t.offsetLeft - n - e.scrollLeft);
 				o < i && (i = o, r = a);
-			}), N.current = r, M(r);
+			}), P.current = r, N(r);
 		};
 		return t(), e.addEventListener("scroll", t, { passive: !0 }), () => e.removeEventListener("scroll", t);
-	}, [p]), s(() => {
-		if (!b || I || P || R < 2 || window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
-		let e = window.setInterval(() => V(N.current + 1), b);
+	}, [m]), s(() => {
+		if (!x || L || F || z < 2 || window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
+		let e = window.setInterval(() => H(P.current + 1), x);
 		return () => window.clearInterval(e);
 	}, [
-		b,
-		I,
-		P,
-		R,
-		V
+		x,
+		L,
+		F,
+		z,
+		H
 	]);
-	let H = (e) => {
-		e.key === "ArrowRight" ? (e.preventDefault(), V(j + 1)) : e.key === "ArrowLeft" && (e.preventDefault(), V(j - 1));
+	let U = (e) => {
+		e.key === "ArrowRight" ? (e.preventDefault(), H(M + 1)) : e.key === "ArrowLeft" && (e.preventDefault(), H(M - 1));
 	};
 	return /* @__PURE__ */ f("div", {
-		id: O,
-		ref: i({ "--carousel-slide-size": _ }),
-		className: ["carousel", D].filter(Boolean).join(" "),
+		id: k,
+		ref: i({ "--carousel-slide-size": v }),
+		className: ["carousel", O].filter(Boolean).join(" "),
 		role: "region",
-		"aria-roledescription": k("roleDescription", h),
-		"aria-label": k("label", m),
-		onMouseEnter: () => F(!0),
-		onMouseLeave: () => F(!1),
-		onFocus: () => F(!0),
-		onBlur: () => F(!1),
+		"aria-roledescription": A("roleDescription", g),
+		"aria-label": A("label", h),
+		onMouseEnter: () => I(!0),
+		onMouseLeave: () => I(!1),
+		onFocus: () => I(!0),
+		onBlur: () => I(!1),
 		children: [
 			/* @__PURE__ */ d("div", {
-				ref: A,
+				ref: j,
 				className: "carousel__track",
 				tabIndex: 0,
 				role: "group",
-				"aria-label": k("track", g),
-				onKeyDown: H,
-				children: p
+				"aria-label": A("track", _),
+				onKeyDown: U,
+				children: m
 			}),
 			/* @__PURE__ */ d(n, {
 				as: "div",
 				role: "status",
-				"aria-live": z ? "off" : "polite",
+				"aria-live": B ? "off" : "polite",
 				"aria-atomic": "true",
-				children: k("slideStatus", E)(j, R)
+				children: A("slideStatus", D)(M, z)
 			}),
-			(v || y || b !== void 0) && /* @__PURE__ */ f("div", {
+			(y || b || x !== void 0) && /* @__PURE__ */ f("div", {
 				className: "carousel__controls",
-				children: [y && /* @__PURE__ */ d("div", {
+				children: [b && /* @__PURE__ */ d("div", {
 					className: "carousel__indicators",
-					children: Array.from({ length: R }, (e, t) => /* @__PURE__ */ d("button", {
+					children: Array.from({ length: z }, (e, t) => /* @__PURE__ */ d("button", {
 						type: "button",
 						className: "carousel__indicator",
-						"aria-label": k("indicator", C)(t),
-						"aria-current": t === j ? "true" : void 0,
-						onClick: () => V(t)
+						"aria-label": A("indicator", w)(t),
+						"aria-current": t === M ? "true" : void 0,
+						onClick: () => H(t)
 					}, t))
-				}), (v || b !== void 0) && /* @__PURE__ */ f("div", {
+				}), (y || x !== void 0) && /* @__PURE__ */ f("div", {
 					className: "carousel__buttons",
-					children: [b !== void 0 && /* @__PURE__ */ d(r, {
+					children: [x !== void 0 && /* @__PURE__ */ d(r, {
 						variant: "ghost",
 						iconOnly: !0,
-						"aria-label": z ? k("pause", w) : k("play", T),
-						onClick: () => L((e) => !e),
-						children: /* @__PURE__ */ d(t, { name: z ? "pause" : "play" })
-					}), v && /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ d(r, {
+						"aria-label": B ? A("pause", T) : A("play", E),
+						onClick: () => R((e) => !e),
+						children: /* @__PURE__ */ d(t, { name: B ? "pause" : "play" })
+					}), y && /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ d(r, {
 						variant: "ghost",
 						iconOnly: !0,
-						"aria-label": k("previous", x),
-						onClick: () => V(j - 1),
+						"aria-label": A("previous", S),
+						onClick: () => H(M - 1),
 						children: /* @__PURE__ */ d(t, { name: "arrow-left" })
 					}), /* @__PURE__ */ d(r, {
 						variant: "ghost",
 						iconOnly: !0,
-						"aria-label": k("next", S),
-						onClick: () => V(j + 1),
+						"aria-label": A("next", C),
+						onClick: () => H(M + 1),
 						children: /* @__PURE__ */ d(t, { name: "arrow" })
 					})] })]
 				})]
@@ -112,8 +126,8 @@ function p({ children: p, label: m, roleDescription: h, trackLabel: g, slideSize
 		]
 	});
 }
-function m({ roleDescription: t, className: n, children: r, ...i }) {
-	let a = e("carousel");
+function h({ roleDescription: t, className: n, children: r, ...i }) {
+	let a = e("carousel", p);
 	return /* @__PURE__ */ d("div", {
 		className: ["carousel__slide", n].filter(Boolean).join(" "),
 		role: "group",
@@ -123,4 +137,4 @@ function m({ roleDescription: t, className: n, children: r, ...i }) {
 	});
 }
 //#endregion
-export { p as Carousel, m as CarouselSlide };
+export { m as Carousel, h as CarouselSlide };

package/dist/chart.css

@@ -1 +1 @@
-.chart{gap:var(--chart-block-gap);font-family:var(--chart-label-font-family);flex-direction:column;margin:0;display:flex}.chart__title{color:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);font-weight:var(--chart-value-font-weight)}.chart__caption,.chart__empty{color:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);margin:0}.chart__plot{position:relative}.chart__canvas{width:100%;height:auto;display:block;overflow:visible}.chart__grid-line{stroke:var(--chart-grid-color);stroke-width:var(--chart-grid-width);fill:none}.chart__axis{stroke:var(--chart-axis-color);stroke-width:var(--chart-axis-width)}.chart__axis-label{fill:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);font-weight:var(--chart-label-font-weight);font-variant-numeric:tabular-nums}.chart__value-label,.chart__center-value{fill:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);font-weight:var(--chart-value-font-weight)}.chart__crosshair{stroke:var(--chart-crosshair-color);stroke-width:var(--chart-grid-width)}.chart [data-slot="1"]{--chart-mark-color:var(--chart-series-1)}.chart [data-slot="2"]{--chart-mark-color:var(--chart-series-2)}.chart [data-slot="3"]{--chart-mark-color:var(--chart-series-3)}.chart [data-slot="4"]{--chart-mark-color:var(--chart-series-4)}.chart [data-slot="5"]{--chart-mark-color:var(--chart-series-5)}.chart [data-slot="6"]{--chart-mark-color:var(--chart-series-6)}.chart [data-slot="7"]{--chart-mark-color:var(--chart-series-7)}.chart [data-slot="8"]{--chart-mark-color:var(--chart-series-8)}.chart [data-slot=muted]{--chart-mark-color:var(--chart-muted-color)}.chart__line{fill:none;stroke-width:var(--chart-line-width);stroke-linecap:round;stroke-linejoin:round}.chart__line:not([stroke]){stroke:var(--chart-mark-color)}.chart__area{fill-opacity:var(--chart-area-fill-opacity);stroke:none}.chart__area:not([fill]){fill:var(--chart-mark-color)}.chart__marker{stroke:var(--chart-surface);stroke-width:var(--chart-marker-ring-width)}.chart__marker:not([fill]){fill:var(--chart-mark-color)}.chart__bar,.chart__slice,.chart__funnel-step,.chart__tile,.chart__radial-bar{transition:fill-opacity var(--chart-transition-duration) var(--chart-transition-easing)}.chart__bar:not([fill]),.chart__slice:not([fill]),.chart__funnel-step:not([fill]),.chart__tile:not([fill]),.chart__radial-bar:not([fill]){fill:var(--chart-mark-color)}.chart__funnel-step,.chart__tile,.chart__radial-bar{stroke:var(--chart-surface);stroke-width:var(--chart-mark-gap)}.chart__radial-track{fill:var(--chart-radial-track-color);stroke:none}.chart__point{stroke:var(--chart-surface);stroke-width:var(--chart-marker-ring-width);transition:fill-opacity var(--chart-transition-duration) var(--chart-transition-easing)}.chart__point:not([fill]){fill:var(--chart-mark-color)}.chart__radar-shape{fill-opacity:var(--chart-radar-fill-opacity);stroke-width:var(--chart-line-width);stroke-linejoin:round}.chart__radar-shape:not([fill]){fill:var(--chart-mark-color)}.chart__radar-shape:not([stroke]){stroke:var(--chart-mark-color)}.chart__tile-label{fill:var(--chart-tile-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size)}.chart__tile-label[data-slot="1"]{--chart-tile-label-color:var(--chart-tile-label-color-1)}.chart__tile-label[data-slot="2"]{--chart-tile-label-color:var(--chart-tile-label-color-2)}.chart__tile-label[data-slot="3"]{--chart-tile-label-color:var(--chart-tile-label-color-3)}.chart__tile-label[data-slot="4"]{--chart-tile-label-color:var(--chart-tile-label-color-4)}.chart__tile-label[data-slot="5"]{--chart-tile-label-color:var(--chart-tile-label-color-5)}.chart__tile-label[data-slot="6"]{--chart-tile-label-color:var(--chart-tile-label-color-6)}.chart__tile-label[data-slot="7"]{--chart-tile-label-color:var(--chart-tile-label-color-7)}.chart__tile-label[data-slot="8"]{--chart-tile-label-color:var(--chart-tile-label-color-8)}.chart__slice{stroke:var(--chart-surface);stroke-width:var(--chart-mark-gap)}.chart__line.chart__line--muted,.chart__area.chart__area--muted,.chart__marker.chart__marker--muted,.chart__bar.chart__bar--muted,.chart__slice.chart__slice--muted,.chart__funnel-step.chart__funnel-step--muted,.chart__tile.chart__tile--muted,.chart__radial-bar.chart__radial-bar--muted,.chart__point.chart__point--muted,.chart__radar-shape.chart__radar-shape--muted{--chart-mark-color:var(--chart-muted-color)}:is(.chart__marks:has([data-active]) .chart__bar:not([data-active]),.chart__marks:has([data-active]) .chart__slice:not([data-active]),.chart__marks:has([data-active]) .chart__funnel-step:not([data-active]),.chart__marks:has([data-active]) .chart__tile:not([data-active]),.chart__marks:has([data-active]) .chart__radial-bar:not([data-active]),.chart__marks:has([data-active]) .chart__point:not([data-active])){fill-opacity:var(--chart-hover-opacity)}.chart__hit-layer{background:0 0;position:absolute}.chart__hit-layer:focus-visible{outline:var(--control-focus-ring-width) solid var(--chart-axis-color);outline-offset:var(--control-focus-ring-inset-offset)}.chart__tooltip{transform:translate(-50%, calc(-100% - var(--chart-tooltip-offset)));max-width:var(--chart-tooltip-max-width);padding-block:var(--chart-tooltip-padding-block);padding-inline:var(--chart-tooltip-padding-inline);border-radius:var(--chart-tooltip-border-radius);background:var(--chart-tooltip-bg);color:var(--chart-tooltip-color);font-family:var(--chart-label-font-family);font-size:var(--chart-tooltip-font-size);line-height:var(--chart-tooltip-line-height);pointer-events:none;position:absolute}.chart__tooltip-header{font-weight:var(--chart-value-font-weight);margin:0}.chart__tooltip-list{gap:var(--chart-tooltip-row-gap);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.chart__tooltip-row{align-items:center;gap:var(--chart-tooltip-row-gap);display:flex}.chart__tooltip-key{inline-size:var(--chart-legend-swatch-line-width);block-size:var(--chart-line-width);flex:none;display:inline-block}.chart__tooltip-value{font-weight:var(--chart-value-font-weight);font-variant-numeric:tabular-nums}.chart__legend-item{align-items:center;gap:var(--chart-legend-gap);display:inline-flex}.chart__legend-item.chart__legend-item--muted .chart__legend-swatch{--chart-mark-color:var(--chart-muted-color)}.chart__legend-swatch{inline-size:var(--chart-legend-swatch-size);block-size:var(--chart-legend-swatch-size);flex:none;display:inline-block}.chart__legend-swatch rect:not([fill]),.chart__tooltip-key rect:not([fill]){fill:var(--chart-mark-color)}.chart__legend-swatch.chart__legend-swatch--line{inline-size:var(--chart-legend-swatch-line-width);block-size:var(--chart-line-width)}
+.chart{gap:var(--chart-block-gap);font-family:var(--chart-label-font-family);flex-direction:column;margin:0;display:flex}.chart__title{color:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);font-weight:var(--chart-value-font-weight)}.chart__caption,.chart__empty{color:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);margin:0}.chart__plot{position:relative}.chart__canvas{width:100%;height:auto;display:block;overflow:visible}.chart__grid-line{stroke:var(--chart-grid-color);stroke-width:var(--chart-grid-width);fill:none}.chart__axis{stroke:var(--chart-axis-color);stroke-width:var(--chart-axis-width)}.chart__axis-label{fill:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);font-weight:var(--chart-label-font-weight);font-variant-numeric:tabular-nums}.chart__value-label,.chart__center-value{fill:var(--chart-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size);font-weight:var(--chart-value-font-weight)}.chart__crosshair{stroke:var(--chart-crosshair-color);stroke-width:var(--chart-grid-width)}.chart [data-slot="1"]{--chart-mark-color:var(--chart-series-1)}.chart [data-slot="2"]{--chart-mark-color:var(--chart-series-2)}.chart [data-slot="3"]{--chart-mark-color:var(--chart-series-3)}.chart [data-slot="4"]{--chart-mark-color:var(--chart-series-4)}.chart [data-slot="5"]{--chart-mark-color:var(--chart-series-5)}.chart [data-slot="6"]{--chart-mark-color:var(--chart-series-6)}.chart [data-slot="7"]{--chart-mark-color:var(--chart-series-7)}.chart [data-slot="8"]{--chart-mark-color:var(--chart-series-8)}.chart [data-slot=muted]{--chart-mark-color:var(--chart-muted-color)}.chart__line{fill:none;stroke-width:var(--chart-line-width);stroke-linecap:round;stroke-linejoin:round}.chart__line:not([stroke]){stroke:var(--chart-mark-color)}.chart__area{fill-opacity:var(--chart-area-fill-opacity);stroke:none}.chart__area:not([fill]){fill:var(--chart-mark-color)}.chart__marker{stroke:var(--chart-surface);stroke-width:var(--chart-marker-ring-width)}.chart__marker:not([fill]){fill:var(--chart-mark-color)}.chart__bar,.chart__slice,.chart__funnel-step,.chart__tile,.chart__radial-bar{transition:fill-opacity var(--chart-transition-duration) var(--chart-transition-easing)}.chart__bar:not([fill]),.chart__slice:not([fill]),.chart__funnel-step:not([fill]),.chart__tile:not([fill]),.chart__radial-bar:not([fill]){fill:var(--chart-mark-color)}.chart__funnel-step,.chart__tile,.chart__radial-bar{stroke:var(--chart-surface);stroke-width:var(--chart-mark-gap)}.chart__radial-track{fill:var(--chart-radial-track-color);stroke:none}.chart__point{stroke:var(--chart-surface);stroke-width:var(--chart-marker-ring-width);transition:fill-opacity var(--chart-transition-duration) var(--chart-transition-easing)}.chart__point:not([fill]){fill:var(--chart-mark-color)}.chart__radar-shape{fill-opacity:var(--chart-radar-fill-opacity);stroke-width:var(--chart-line-width);stroke-linejoin:round}.chart__radar-shape:not([fill]){fill:var(--chart-mark-color)}.chart__radar-shape:not([stroke]){stroke:var(--chart-mark-color)}.chart__tile-label{fill:var(--chart-tile-label-color);font-family:var(--chart-label-font-family);font-size:var(--chart-label-font-size)}.chart__tile-label[data-slot="1"]{--chart-tile-label-color:var(--chart-tile-label-color-1)}.chart__tile-label[data-slot="2"]{--chart-tile-label-color:var(--chart-tile-label-color-2)}.chart__tile-label[data-slot="3"]{--chart-tile-label-color:var(--chart-tile-label-color-3)}.chart__tile-label[data-slot="4"]{--chart-tile-label-color:var(--chart-tile-label-color-4)}.chart__tile-label[data-slot="5"]{--chart-tile-label-color:var(--chart-tile-label-color-5)}.chart__tile-label[data-slot="6"]{--chart-tile-label-color:var(--chart-tile-label-color-6)}.chart__tile-label[data-slot="7"]{--chart-tile-label-color:var(--chart-tile-label-color-7)}.chart__tile-label[data-slot="8"]{--chart-tile-label-color:var(--chart-tile-label-color-8)}.chart__slice{stroke:var(--chart-surface);stroke-width:var(--chart-mark-gap)}.chart__line.chart__line--muted,.chart__area.chart__area--muted,.chart__marker.chart__marker--muted,.chart__bar.chart__bar--muted,.chart__slice.chart__slice--muted,.chart__funnel-step.chart__funnel-step--muted,.chart__tile.chart__tile--muted,.chart__radial-bar.chart__radial-bar--muted,.chart__point.chart__point--muted,.chart__radar-shape.chart__radar-shape--muted{--chart-mark-color:var(--chart-muted-color)}:is(.chart__marks:has([data-active]) .chart__bar:not([data-active]),.chart__marks:has([data-active]) .chart__slice:not([data-active]),.chart__marks:has([data-active]) .chart__funnel-step:not([data-active]),.chart__marks:has([data-active]) .chart__tile:not([data-active]),.chart__marks:has([data-active]) .chart__radial-bar:not([data-active]),.chart__marks:has([data-active]) .chart__point:not([data-active])){fill-opacity:var(--chart-hover-opacity)}.chart__hit-layer{background:0 0;position:absolute}.chart__hit-layer:focus-visible{outline:var(--control-focus-ring-width) solid var(--chart-axis-color);outline-offset:var(--control-focus-ring-inset-offset)}.chart__tooltip{transform:translate(-50%, calc(-100% - var(--chart-tooltip-offset)));max-inline-size:var(--chart-tooltip-max-width);padding-block:var(--chart-tooltip-padding-block);padding-inline:var(--chart-tooltip-padding-inline);border-radius:var(--chart-tooltip-border-radius);background:var(--chart-tooltip-bg);color:var(--chart-tooltip-color);font-family:var(--chart-label-font-family);font-size:var(--chart-tooltip-font-size);line-height:var(--chart-tooltip-line-height);pointer-events:none;position:absolute}.chart__tooltip-header{font-weight:var(--chart-value-font-weight);margin:0}.chart__tooltip-list{gap:var(--chart-tooltip-row-gap);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.chart__tooltip-row{align-items:center;gap:var(--chart-tooltip-row-gap);display:flex}.chart__tooltip-key{inline-size:var(--chart-legend-swatch-line-width);block-size:var(--chart-line-width);flex:none;display:inline-block}.chart__tooltip-value{font-weight:var(--chart-value-font-weight);font-variant-numeric:tabular-nums}.chart__legend-item{align-items:center;gap:var(--chart-legend-gap);display:inline-flex}.chart__legend-item.chart__legend-item--muted .chart__legend-swatch{--chart-mark-color:var(--chart-muted-color)}.chart__legend-swatch{inline-size:var(--chart-legend-swatch-size);block-size:var(--chart-legend-swatch-size);flex:none;display:inline-block}.chart__legend-swatch rect:not([fill]),.chart__tooltip-key rect:not([fill]){fill:var(--chart-mark-color)}.chart__legend-swatch.chart__legend-swatch--line{inline-size:var(--chart-legend-swatch-line-width);block-size:var(--chart-line-width)}