@d4gger/design-system 2.7.0 → 3.0.1

package/dist/components/chart/Chart.js

@@ -3,15 +3,20 @@ import * as React from "react";
 import classNames from "classnames";
 import { Slot } from "@radix-ui/react-slot";
 import {
+  Area,
+  AreaChart,
   Bar,
   BarChart,
   CartesianGrid,
   Cell,
+  DefaultLegendContent,
   Legend as RechartsLegend,
   Line,
   LineChart,
   Pie,
   PieChart,
+  RadialBar,
+  RadialBarChart,
   ResponsiveContainer,
   Tooltip as RechartsTooltip,
   XAxis,
@@ -20,6 +25,25 @@ import {
 import { extractProps } from "../../_internal/helpers/extractProps.js";
 import { chartContainerPropDefs } from "./chart.props.js";
 import { jsx, jsxs } from "react/jsx-runtime";
+const seriesFill = (index, explicit) => explicit ?? `var(--dsx-chart-${index % 5 + 1})`;
+const useLegendHeight = () => {
+  const [legend, setLegend] = React.useState(null);
+  const [height, setHeight] = React.useState(0);
+  React.useEffect(() => {
+    if (!legend) return;
+    const measure = () => {
+      setHeight(legend.getBoundingClientRect().height);
+    };
+    measure();
+    const observer = new ResizeObserver(measure);
+    observer.observe(legend);
+    return () => {
+      observer.disconnect();
+    };
+  }, [legend]);
+  const content = React.useCallback((legendProps) => /* @__PURE__ */ jsx("div", { ref: setLegend, children: /* @__PURE__ */ jsx(DefaultLegendContent, { ...legendProps }) }), []);
+  return [height, content];
+};
 const ChartContainer = React.forwardRef(({ children, ...props }, forwardedRef) => {
   const { asChild, className, ...containerProps } = extractProps(props, chartContainerPropDefs);
   const Comp = asChild ? Slot : "div";
@@ -35,40 +59,125 @@ const ChartContainer = React.forwardRef(({ children, ...props }, forwardedRef) =
   );
 });
 ChartContainer.displayName = "ChartContainer";
-const ChartLine = React.forwardRef(({ data, className, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ jsx(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "line", children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 350, children: /* @__PURE__ */ jsxs(LineChart, { data, children: [
+const chartResponsiveFallback = { minWidth: 0, minHeight: 240, debounce: 50 };
+const chartTick = { fill: "var(--dsx-semantic-muted-foreground)", fontSize: 12 };
+const chartInset = { top: 12, right: 20, bottom: 8, left: 8 };
+const chartSparkInset = { top: 4, right: 4, bottom: 4, left: 4 };
+const chartTooltipStyle = {
+  backgroundColor: "var(--dsx-color-panel-translucent)",
+  backdropFilter: "var(--dsx-effect-panel-glass-backdrop-filter)",
+  border: "1px solid var(--dsx-color-outline-variant)",
+  borderRadius: "var(--dsx-rounded-md)",
+  boxShadow: "var(--dsx-shadow-elevation-2)",
+  fontSize: 12
+};
+const chartTooltipLabel = { color: "var(--dsx-color-on-surface)" };
+const chartTooltipItemStyle = { color: "var(--dsx-color-on-surface)" };
+const chartTooltipCursor = { stroke: "var(--dsx-color-outline-variant)" };
+const chartTooltipBarCursor = { fill: "var(--dsx-color-surface-raised)" };
+const ChartLine = React.forwardRef(({ data, series, stacked, name, className, ...props }, forwardedRef) => {
+  const stackId = stacked ? "dsx-stack" : void 0;
+  return /* @__PURE__ */ jsx(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "line", children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", minWidth: chartResponsiveFallback.minWidth, minHeight: chartResponsiveFallback.minHeight, debounce: chartResponsiveFallback.debounce, children: /* @__PURE__ */ jsxs(LineChart, { data, margin: chartInset, children: [
     /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
-    /* @__PURE__ */ jsx(XAxis, { dataKey: "name" }),
-    /* @__PURE__ */ jsx(YAxis, {}),
-    /* @__PURE__ */ jsx(RechartsTooltip, {}),
+    /* @__PURE__ */ jsx(XAxis, { dataKey: "name", tickLine: false, axisLine: false, tick: chartTick }),
+    /* @__PURE__ */ jsx(YAxis, { tickLine: false, axisLine: false, tick: chartTick }),
+    /* @__PURE__ */ jsx(RechartsTooltip, { contentStyle: chartTooltipStyle, itemStyle: chartTooltipItemStyle, labelStyle: chartTooltipLabel, cursor: chartTooltipCursor }),
     /* @__PURE__ */ jsx(RechartsLegend, {}),
-    /* @__PURE__ */ jsx(Line, { type: "monotone", dataKey: "value", stroke: "var(--dsx-color-primary)", isAnimationActive: false })
+    series && series.length > 0 ? series.map((s, i) => /* @__PURE__ */ jsx(Line, { type: "monotone", dataKey: s.dataKey, name: s.name ?? s.dataKey, stroke: seriesFill(i, s.fill), isAnimationActive: false }, s.dataKey)) : /* @__PURE__ */ jsx(Line, { type: "monotone", dataKey: "value", name: name ?? "value", stroke: "var(--dsx-color-primary)", isAnimationActive: false })
   ] }) }) });
 });
 ChartLine.displayName = "ChartLine";
-const ChartBar = React.forwardRef(({ data, className, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ jsx(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "bar", children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 350, children: /* @__PURE__ */ jsxs(BarChart, { data, children: [
+const ChartBar = React.forwardRef(({ data, series, stacked, name, className, ...props }, forwardedRef) => {
+  const stackId = stacked ? "dsx-stack" : void 0;
+  return /* @__PURE__ */ jsx(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "bar", children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", minWidth: chartResponsiveFallback.minWidth, minHeight: chartResponsiveFallback.minHeight, debounce: chartResponsiveFallback.debounce, children: /* @__PURE__ */ jsxs(BarChart, { data, margin: chartInset, children: [
     /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }),
-    /* @__PURE__ */ jsx(XAxis, { dataKey: "name" }),
-    /* @__PURE__ */ jsx(YAxis, {}),
-    /* @__PURE__ */ jsx(RechartsTooltip, {}),
+    /* @__PURE__ */ jsx(XAxis, { dataKey: "name", tickLine: false, axisLine: false, tick: chartTick }),
+    /* @__PURE__ */ jsx(YAxis, { tickLine: false, axisLine: false, tick: chartTick }),
+    /* @__PURE__ */ jsx(RechartsTooltip, { contentStyle: chartTooltipStyle, itemStyle: chartTooltipItemStyle, labelStyle: chartTooltipLabel, cursor: chartTooltipBarCursor }),
     /* @__PURE__ */ jsx(RechartsLegend, {}),
-    /* @__PURE__ */ jsx(Bar, { dataKey: "value", fill: "var(--dsx-color-primary)", isAnimationActive: false })
+    series && series.length > 0 ? series.map((s, i) => /* @__PURE__ */ jsx(Bar, { dataKey: s.dataKey, name: s.name ?? s.dataKey, fill: seriesFill(i, s.fill), stackId, isAnimationActive: false }, s.dataKey)) : /* @__PURE__ */ jsx(Bar, { dataKey: "value", name: name ?? "value", fill: "var(--dsx-color-primary)", isAnimationActive: false })
   ] }) }) });
 });
 ChartBar.displayName = "ChartBar";
 const ChartPie = React.forwardRef(({ data, className, ...props }, forwardedRef) => {
+  const [dimensions, setDimensions] = React.useState({ width: 220, height: 240 });
+  const [legendHeight, legendContent] = useLegendHeight();
+  const radius = Math.max(0, Math.min(100, (Math.min(dimensions.width, dimensions.height - legendHeight) - 10) / 2));
   const pieData = React.useMemo(
     () => data.map((entry, index) => ({ ...entry, fill: `var(--dsx-chart-${index % 5 + 1})` })),
     [data]
   );
-  return /* @__PURE__ */ jsx(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "pie", children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: 350, children: /* @__PURE__ */ jsxs(PieChart, { children: [
-    /* @__PURE__ */ jsx(Pie, { data: pieData, dataKey: "value", nameKey: "name", cx: "50%", cy: "50%", outerRadius: 100, isAnimationActive: false, children: pieData.map((entry, index) => /* @__PURE__ */ jsx(Cell, { fill: entry.fill }, entry.id ?? entry.name ?? index)) }),
-    /* @__PURE__ */ jsx(RechartsTooltip, {}),
-    /* @__PURE__ */ jsx(RechartsLegend, {})
-  ] }) }) });
+  return /* @__PURE__ */ jsx(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "pie", children: /* @__PURE__ */ jsx(
+    ResponsiveContainer,
+    {
+      width: "100%",
+      height: "100%",
+      minWidth: chartResponsiveFallback.minWidth,
+      minHeight: chartResponsiveFallback.minHeight,
+      debounce: chartResponsiveFallback.debounce,
+      onResize: (width, height) => {
+        setDimensions({ width, height });
+      },
+      children: /* @__PURE__ */ jsxs(PieChart, { children: [
+        /* @__PURE__ */ jsx(Pie, { data: pieData, dataKey: "value", nameKey: "name", cx: "50%", cy: "50%", outerRadius: radius, isAnimationActive: false, children: pieData.map((entry, index) => /* @__PURE__ */ jsx(Cell, { fill: entry.fill }, entry.id ?? entry.name ?? index)) }),
+        /* @__PURE__ */ jsx(RechartsTooltip, { contentStyle: chartTooltipStyle, itemStyle: chartTooltipItemStyle, labelStyle: chartTooltipLabel }),
+        /* @__PURE__ */ jsx(RechartsLegend, { content: legendContent })
+      ] })
+    }
+  ) });
 });
 ChartPie.displayName = "ChartPie";
+const ChartDonut = React.forwardRef(({ data, label, className, ...props }, forwardedRef) => {
+  const [dimensions, setDimensions] = React.useState({ width: 220, height: 240 });
+  const [legendHeight, legendContent] = useLegendHeight();
+  const radius = Math.max(0, Math.min(100, (Math.min(dimensions.width, dimensions.height - legendHeight) - 10) / 2));
+  const pieData = React.useMemo(
+    () => data.map((entry, index) => ({ ...entry, fill: `var(--dsx-chart-${index % 5 + 1})` })),
+    [data]
+  );
+  return /* @__PURE__ */ jsxs(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "donut", children: [
+    /* @__PURE__ */ jsx(
+      ResponsiveContainer,
+      {
+        width: "100%",
+        height: "100%",
+        minWidth: chartResponsiveFallback.minWidth,
+        minHeight: chartResponsiveFallback.minHeight,
+        debounce: chartResponsiveFallback.debounce,
+        onResize: (width, height) => {
+          setDimensions({ width, height });
+        },
+        children: /* @__PURE__ */ jsxs(PieChart, { children: [
+          /* @__PURE__ */ jsx(Pie, { data: pieData, dataKey: "value", nameKey: "name", cx: "50%", cy: "50%", innerRadius: radius * 0.62, outerRadius: radius, isAnimationActive: false, children: pieData.map((entry, index) => /* @__PURE__ */ jsx(Cell, { fill: entry.fill }, entry.id ?? entry.name ?? index)) }),
+          /* @__PURE__ */ jsx(RechartsTooltip, { contentStyle: chartTooltipStyle, itemStyle: chartTooltipItemStyle, labelStyle: chartTooltipLabel }),
+          /* @__PURE__ */ jsx(RechartsLegend, { content: legendContent })
+        ] })
+      }
+    ),
+    label != null ? /* @__PURE__ */ jsx("div", { className: "dsx-chart__center-label", style: { bottom: legendHeight }, children: label }) : null
+  ] });
+});
+ChartDonut.displayName = "ChartDonut";
+const ChartRadial = React.forwardRef(({ value, max = 100, label, className, ...props }, forwardedRef) => {
+  const clamped = Math.max(0, Math.min(value, max));
+  const data = React.useMemo(() => [{ name: "value", value: clamped, fill: "var(--dsx-color-primary)" }], [clamped]);
+  return /* @__PURE__ */ jsxs(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "radial", children: [
+    /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", minWidth: chartResponsiveFallback.minWidth, minHeight: chartResponsiveFallback.minHeight, debounce: chartResponsiveFallback.debounce, children: /* @__PURE__ */ jsx(RadialBarChart, { cx: "50%", cy: "50%", innerRadius: "88%", outerRadius: "100%", data, startAngle: 90, endAngle: -270, children: /* @__PURE__ */ jsx(RadialBar, { dataKey: "value", background: { fill: "var(--dsx-color-surface-sunken)" }, isAnimationActive: false }) }) }),
+    label != null ? /* @__PURE__ */ jsx("div", { className: "dsx-chart__center-label", children: label }) : null
+  ] });
+});
+ChartRadial.displayName = "ChartRadial";
+const ChartArea = React.forwardRef(({ data, series, name, spark, className, ...props }, forwardedRef) => {
+  return /* @__PURE__ */ jsx(ChartContainer, { ...props, ref: forwardedRef, className, "data-chart-type": "area", "data-spark": spark || void 0, children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height: "100%", minWidth: chartResponsiveFallback.minWidth, minHeight: spark ? 0 : chartResponsiveFallback.minHeight, debounce: chartResponsiveFallback.debounce, children: /* @__PURE__ */ jsxs(AreaChart, { data, margin: spark ? chartSparkInset : chartInset, children: [
+    !spark ? /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3" }) : null,
+    !spark ? /* @__PURE__ */ jsx(XAxis, { dataKey: "name", tickLine: false, axisLine: false, tick: chartTick }) : null,
+    !spark ? /* @__PURE__ */ jsx(YAxis, { tickLine: false, axisLine: false, tick: chartTick }) : null,
+    !spark ? /* @__PURE__ */ jsx(RechartsTooltip, { contentStyle: chartTooltipStyle, itemStyle: chartTooltipItemStyle, labelStyle: chartTooltipLabel, cursor: chartTooltipCursor }) : null,
+    !spark ? /* @__PURE__ */ jsx(RechartsLegend, {}) : null,
+    series && series.length > 0 ? series.map((s, i) => /* @__PURE__ */ jsx(Area, { type: "monotone", dataKey: s.dataKey, name: s.name ?? s.dataKey, stroke: seriesFill(i, s.fill), fill: seriesFill(i, s.fill), fillOpacity: 0.1, isAnimationActive: false }, s.dataKey)) : /* @__PURE__ */ jsx(Area, { type: "monotone", dataKey: "value", name: name ?? "value", stroke: "var(--dsx-color-primary)", fill: "var(--dsx-color-primary)", fillOpacity: 0.1, isAnimationActive: false })
+  ] }) }) });
+});
+ChartArea.displayName = "ChartArea";
 const ChartEmpty = React.forwardRef(
   ({ className, ...props }, forwardedRef) => /* @__PURE__ */ jsx("div", { ...props, ref: forwardedRef, className: classNames("dsx-chart__empty", className) })
 );
@@ -94,24 +203,32 @@ const Chart = Object.assign(ChartContainer, {
   Line: ChartLine,
   Bar: ChartBar,
   Pie: ChartPie,
+  Donut: ChartDonut,
+  Radial: ChartRadial,
+  Area: ChartArea,
   Empty: ChartEmpty,
   Legend: ChartLegend,
   LegendItem: ChartLegendItem
 });
 export {
+  AreaChart,
   BarChart,
   CartesianGrid,
   Chart,
+  ChartArea,
   ChartBar,
   ChartContainer,
+  ChartDonut,
   ChartEmpty,
   ChartLegend,
   ChartLegendItem,
   ChartLine,
   ChartPie,
+  ChartRadial,
   RechartsTooltip as ChartTooltip,
   LineChart,
   PieChart,
+  RadialBarChart,
   RechartsLegend,
   ResponsiveContainer,
   XAxis,

package/dist/components/chart/Chart.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/chart/Chart.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport classNames from 'classnames'\nimport { Slot } from '@radix-ui/react-slot'\nimport {\n  Bar,\n  BarChart,\n  CartesianGrid,\n  Cell,\n  Legend as RechartsLegend,\n  Line,\n  LineChart,\n  Pie,\n  PieChart,\n  ResponsiveContainer,\n  Tooltip as RechartsTooltip,\n  XAxis,\n  YAxis,\n} from 'recharts'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { chartContainerPropDefs } from './chart.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\ntype ChartDatum = {\n  id?: number | string\n  name: string\n  value: number\n}\n\ntype ChartPieDatum = ChartDatum & {\n  fill: string\n}\n\ntype ChartContainerOwnProps = GetPropDefTypes<typeof chartContainerPropDefs>\n\ninterface ChartContainerProps extends React.HTMLAttributes<HTMLDivElement>, ChartContainerOwnProps {}\n\ninterface ChartProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  data: ChartDatum[]\n}\n\nconst ChartContainer = React.forwardRef<HTMLDivElement, ChartContainerProps>(({ children, ...props }, forwardedRef) => {\n  const { asChild, className, ...containerProps } = extractProps(props, chartContainerPropDefs)\n  const Comp = asChild ? Slot : 'div'\n\n  return (\n    <Comp\n      {...containerProps}\n      ref={forwardedRef}\n      className={classNames('dsx-chart', className)}\n      data-slot=\"chart-container\"\n    >\n      {children}\n    </Comp>\n  )\n})\nChartContainer.displayName = 'ChartContainer'\n\nconst ChartLine = React.forwardRef<HTMLDivElement, ChartProps>(({ data, className, ...props }, forwardedRef) => {\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"line\">\n      <ResponsiveContainer width=\"100%\" height={350}>\n        <LineChart data={data}>\n          <CartesianGrid strokeDasharray=\"3 3\" />\n          <XAxis dataKey=\"name\" />\n          <YAxis />\n          <RechartsTooltip />\n          <RechartsLegend />\n          <Line type=\"monotone\" dataKey=\"value\" stroke=\"var(--dsx-color-primary)\" isAnimationActive={false} />\n        </LineChart>\n      </ResponsiveContainer>\n    </ChartContainer>\n  )\n})\nChartLine.displayName = 'ChartLine'\n\nconst ChartBar = React.forwardRef<HTMLDivElement, ChartProps>(({ data, className, ...props }, forwardedRef) => {\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"bar\">\n      <ResponsiveContainer width=\"100%\" height={350}>\n        <BarChart data={data}>\n          <CartesianGrid strokeDasharray=\"3 3\" />\n          <XAxis dataKey=\"name\" />\n          <YAxis />\n          <RechartsTooltip />\n          <RechartsLegend />\n          <Bar dataKey=\"value\" fill=\"var(--dsx-color-primary)\" isAnimationActive={false} />\n        </BarChart>\n      </ResponsiveContainer>\n    </ChartContainer>\n  )\n})\nChartBar.displayName = 'ChartBar'\n\nconst ChartPie = React.forwardRef<HTMLDivElement, ChartProps>(({ data, className, ...props }, forwardedRef) => {\n  const pieData = React.useMemo<ChartPieDatum[]>(\n    () => data.map((entry, index) => ({ ...entry, fill: `var(--dsx-chart-${(index % 5) + 1})` })),\n    [data],\n  )\n\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"pie\">\n      <ResponsiveContainer width=\"100%\" height={350}>\n        <PieChart>\n          <Pie data={pieData} dataKey=\"value\" nameKey=\"name\" cx=\"50%\" cy=\"50%\" outerRadius={100} isAnimationActive={false}>\n            {pieData.map((entry, index) => (\n              <Cell key={entry.id ?? entry.name ?? index} fill={entry.fill} />\n            ))}\n          </Pie>\n          <RechartsTooltip />\n          <RechartsLegend />\n        </PieChart>\n      </ResponsiveContainer>\n    </ChartContainer>\n  )\n})\nChartPie.displayName = 'ChartPie'\n\nconst ChartEmpty = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, forwardedRef) => (\n    <div {...props} ref={forwardedRef} className={classNames('dsx-chart__empty', className)} />\n  ),\n)\nChartEmpty.displayName = 'ChartEmpty'\n\ntype ChartLegendItemProps = React.HTMLAttributes<HTMLSpanElement> & {\n  color?: string\n}\n\nconst ChartLegendItem = React.forwardRef<HTMLSpanElement, ChartLegendItemProps>(\n  ({ className, color, style, ...props }, forwardedRef) => (\n    <span\n      {...props}\n      ref={forwardedRef}\n      className={classNames('dsx-chart__legend-item', className)}\n      style={color ? { ...style, '--dsx-chart-legend-color': color } as React.CSSProperties : style}\n    />\n  ),\n)\nChartLegendItem.displayName = 'ChartLegendItem'\n\nconst ChartLegend = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, forwardedRef) => (\n    <div {...props} ref={forwardedRef} className={classNames('dsx-chart__legend', className)} />\n  ),\n)\nChartLegend.displayName = 'ChartLegend'\n\nconst Chart: typeof ChartContainer & {\n  Container: typeof ChartContainer\n  Line: typeof ChartLine\n  Bar: typeof ChartBar\n  Pie: typeof ChartPie\n  Empty: typeof ChartEmpty\n  Legend: typeof ChartLegend\n  LegendItem: typeof ChartLegendItem\n} = Object.assign(ChartContainer, {\n  Container: ChartContainer,\n  Line: ChartLine,\n  Bar: ChartBar,\n  Pie: ChartPie,\n  Empty: ChartEmpty,\n  Legend: ChartLegend,\n  LegendItem: ChartLegendItem,\n})\n\nexport {\n  BarChart,\n  CartesianGrid,\n  Chart,\n  ChartBar,\n  ChartContainer,\n  ChartEmpty,\n  ChartLegend,\n  ChartLegendItem,\n  ChartLine,\n  ChartPie,\n  LineChart,\n  PieChart,\n  RechartsLegend,\n  RechartsTooltip as ChartTooltip,\n  ResponsiveContainer,\n  XAxis,\n  YAxis,\n}\nexport type { ChartContainerProps, ChartDatum, ChartLegendItemProps, ChartProps }\n"],
-  "mappings": ";AAEA,YAAY,WAAW;AACvB,OAAO,gBAAgB;AACvB,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,OACK;AAEP,SAAS,oBAAoB;AAC7B,SAAS,8BAA8B;AA2BnC,cAgBI,YAhBJ;AALJ,MAAM,iBAAiB,MAAM,WAAgD,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACrH,QAAM,EAAE,SAAS,WAAW,GAAG,eAAe,IAAI,aAAa,OAAO,sBAAsB;AAC5F,QAAM,OAAO,UAAU,OAAO;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,WAAW,WAAW,aAAa,SAAS;AAAA,MAC5C,aAAU;AAAA,MAET;AAAA;AAAA,EACH;AAEJ,CAAC;AACD,eAAe,cAAc;AAE7B,MAAM,YAAY,MAAM,WAAuC,CAAC,EAAE,MAAM,WAAW,GAAG,MAAM,GAAG,iBAAiB;AAC9G,SACE,oBAAC,kBAAgB,GAAG,OAAO,KAAK,cAAc,WAAsB,mBAAgB,QAClF,8BAAC,uBAAoB,OAAM,QAAO,QAAQ,KACxC,+BAAC,aAAU,MACT;AAAA,wBAAC,iBAAc,iBAAgB,OAAM;AAAA,IACrC,oBAAC,SAAM,SAAQ,QAAO;AAAA,IACtB,oBAAC,SAAM;AAAA,IACP,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,kBAAe;AAAA,IAChB,oBAAC,QAAK,MAAK,YAAW,SAAQ,SAAQ,QAAO,4BAA2B,mBAAmB,OAAO;AAAA,KACpG,GACF,GACF;AAEJ,CAAC;AACD,UAAU,cAAc;AAExB,MAAM,WAAW,MAAM,WAAuC,CAAC,EAAE,MAAM,WAAW,GAAG,MAAM,GAAG,iBAAiB;AAC7G,SACE,oBAAC,kBAAgB,GAAG,OAAO,KAAK,cAAc,WAAsB,mBAAgB,OAClF,8BAAC,uBAAoB,OAAM,QAAO,QAAQ,KACxC,+BAAC,YAAS,MACR;AAAA,wBAAC,iBAAc,iBAAgB,OAAM;AAAA,IACrC,oBAAC,SAAM,SAAQ,QAAO;AAAA,IACtB,oBAAC,SAAM;AAAA,IACP,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,kBAAe;AAAA,IAChB,oBAAC,OAAI,SAAQ,SAAQ,MAAK,4BAA2B,mBAAmB,OAAO;AAAA,KACjF,GACF,GACF;AAEJ,CAAC;AACD,SAAS,cAAc;AAEvB,MAAM,WAAW,MAAM,WAAuC,CAAC,EAAE,MAAM,WAAW,GAAG,MAAM,GAAG,iBAAiB;AAC7G,QAAM,UAAU,MAAM;AAAA,IACpB,MAAM,KAAK,IAAI,CAAC,OAAO,WAAW,EAAE,GAAG,OAAO,MAAM,mBAAoB,QAAQ,IAAK,CAAC,IAAI,EAAE;AAAA,IAC5F,CAAC,IAAI;AAAA,EACP;AAEA,SACE,oBAAC,kBAAgB,GAAG,OAAO,KAAK,cAAc,WAAsB,mBAAgB,OAClF,8BAAC,uBAAoB,OAAM,QAAO,QAAQ,KACxC,+BAAC,YACC;AAAA,wBAAC,OAAI,MAAM,SAAS,SAAQ,SAAQ,SAAQ,QAAO,IAAG,OAAM,IAAG,OAAM,aAAa,KAAK,mBAAmB,OACvG,kBAAQ,IAAI,CAAC,OAAO,UACnB,oBAAC,QAA2C,MAAM,MAAM,QAA7C,MAAM,MAAM,MAAM,QAAQ,KAAyB,CAC/D,GACH;AAAA,IACA,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,kBAAe;AAAA,KAClB,GACF,GACF;AAEJ,CAAC;AACD,SAAS,cAAc;AAEvB,MAAM,aAAa,MAAM;AAAA,EACvB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,iBACxB,oBAAC,SAAK,GAAG,OAAO,KAAK,cAAc,WAAW,WAAW,oBAAoB,SAAS,GAAG;AAE7F;AACA,WAAW,cAAc;AAMzB,MAAM,kBAAkB,MAAM;AAAA,EAC5B,CAAC,EAAE,WAAW,OAAO,OAAO,GAAG,MAAM,GAAG,iBACtC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,WAAW,WAAW,0BAA0B,SAAS;AAAA,MACzD,OAAO,QAAQ,EAAE,GAAG,OAAO,4BAA4B,MAAM,IAA2B;AAAA;AAAA,EAC1F;AAEJ;AACA,gBAAgB,cAAc;AAE9B,MAAM,cAAc,MAAM;AAAA,EACxB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,iBACxB,oBAAC,SAAK,GAAG,OAAO,KAAK,cAAc,WAAW,WAAW,qBAAqB,SAAS,GAAG;AAE9F;AACA,YAAY,cAAc;AAE1B,MAAM,QAQF,OAAO,OAAO,gBAAgB;AAAA,EAChC,WAAW;AAAA,EACX,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,YAAY;AACd,CAAC;",
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport classNames from 'classnames'\nimport { Slot } from '@radix-ui/react-slot'\nimport {\n  Area,\n  AreaChart,\n  Bar,\n  BarChart,\n  CartesianGrid,\n  Cell,\n  DefaultLegendContent,\n  Legend as RechartsLegend,\n  Line,\n  LineChart,\n  Pie,\n  PieChart,\n  RadialBar,\n  RadialBarChart,\n  ResponsiveContainer,\n  Tooltip as RechartsTooltip,\n  XAxis,\n  YAxis,\n} from 'recharts'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { chartContainerPropDefs } from './chart.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\ntype ChartDatum = {\n  id?: number | string\n  name: string\n  value: number\n}\n\ntype ChartRow = {\n  name: string\n  id?: number | string\n  [key: string]: string | number | undefined\n}\n\ntype ChartPieDatum = ChartDatum & {\n  fill: string\n}\n\ntype ChartSeries = {\n  dataKey: string\n  name?: string\n  fill?: string\n}\n\ntype ChartContainerOwnProps = GetPropDefTypes<typeof chartContainerPropDefs>\n\ninterface ChartContainerProps extends React.HTMLAttributes<HTMLDivElement>, ChartContainerOwnProps {}\n\ninterface ChartProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  data: ChartDatum[]\n}\n\ninterface ChartMultiProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  data: ChartDatum[] | ChartRow[]\n  series?: ChartSeries[]\n  stacked?: boolean\n  name?: string\n}\n\ninterface ChartDonutProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  data: ChartDatum[]\n  label?: React.ReactNode\n}\n\ninterface ChartRadialProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  value: number\n  max?: number\n  label?: React.ReactNode\n}\n\ninterface ChartAreaProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  data: ChartDatum[] | ChartRow[]\n  series?: ChartSeries[]\n  name?: string\n  spark?: boolean\n}\n\nconst seriesFill = (index: number, explicit?: string) => explicit ?? `var(--dsx-chart-${(index % 5) + 1})`\n\n// Observe the rendered legend: its height changes when labels wrap or fonts load.\n// Recharts' onBBoxUpdate type remains public in v3, but the implementation no\n// longer calls it. Measuring our content also preserves the >=2 peer contract.\nconst useLegendHeight = () => {\n  const [legend, setLegend] = React.useState<HTMLDivElement | null>(null)\n  const [height, setHeight] = React.useState(0)\n  React.useEffect(() => {\n    if (!legend) return\n    const measure = () => { setHeight(legend.getBoundingClientRect().height) }\n    measure()\n    const observer = new ResizeObserver(measure)\n    observer.observe(legend)\n    return () => { observer.disconnect() }\n  }, [legend])\n  const content = React.useCallback((legendProps: React.ComponentProps<typeof DefaultLegendContent>) => (\n    <div ref={setLegend}><DefaultLegendContent {...legendProps} /></div>\n  ), [])\n  return [height, content] as const\n}\n\nconst ChartContainer = React.forwardRef<HTMLDivElement, ChartContainerProps>(({ children, ...props }, forwardedRef) => {\n  const { asChild, className, ...containerProps } = extractProps(props, chartContainerPropDefs)\n  const Comp = asChild ? Slot : 'div'\n\n  return (\n    <Comp\n      {...containerProps}\n      ref={forwardedRef}\n      className={classNames('dsx-chart', className)}\n      data-slot=\"chart-container\"\n    >\n      {children}\n    </Comp>\n  )\n})\nChartContainer.displayName = 'ChartContainer'\n\n// minHeight mirrors --dsx-chart-min-height (240px): hidden matrix/preview\n// cells measure 0, and without a fallback recharts logs width(0)/height(0).\n// The remaining width(-1)/height(-1) lines are recharts' first-measure noise\n// on mount and clear once layout resolves \u2014 inherent, not actionable.\n// debounce shortens that window. minWidth stays 0 so narrow rails don't\n// force overflow. Spark passes minHeight 0 at its call site: a 240px floor\n// inside a ~60px spark cell renders cropped (confirmed live 2026-09-19).\nconst chartResponsiveFallback = { minWidth: 0, minHeight: 240, debounce: 50 } as const\nconst chartTick = { fill: 'var(--dsx-semantic-muted-foreground)', fontSize: 12 } as const\nconst chartInset = { top: 12, right: 20, bottom: 8, left: 8 } as const\nconst chartSparkInset = { top: 4, right: 4, bottom: 4, left: 4 } as const\nconst chartTooltipStyle = {\n  backgroundColor: 'var(--dsx-color-panel-translucent)',\n  backdropFilter: 'var(--dsx-effect-panel-glass-backdrop-filter)',\n  border: '1px solid var(--dsx-color-outline-variant)',\n  borderRadius: 'var(--dsx-rounded-md)',\n  boxShadow: 'var(--dsx-shadow-elevation-2)',\n  fontSize: 12,\n} as const\nconst chartTooltipLabel = { color: 'var(--dsx-color-on-surface)' } as const\n// Neutral item text on both themes. Recharts defaults item color to the\n// series stroke, which goes low-contrast on glass (confirmed live 2026-09-19:\n// accent-purple value text on light glass). Same neutral-text rule as menus.\nconst chartTooltipItemStyle = { color: 'var(--dsx-color-on-surface)' } as const\nconst chartTooltipCursor = { stroke: 'var(--dsx-color-outline-variant)' } as const\nconst chartTooltipBarCursor = { fill: 'var(--dsx-color-surface-raised)' } as const\n\nconst ChartLine = React.forwardRef<HTMLDivElement, ChartMultiProps>(({ data, series, stacked, name, className, ...props }, forwardedRef) => {\n  const stackId = stacked ? 'dsx-stack' : undefined\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"line\">\n      <ResponsiveContainer width=\"100%\" height=\"100%\" minWidth={chartResponsiveFallback.minWidth} minHeight={chartResponsiveFallback.minHeight} debounce={chartResponsiveFallback.debounce}>\n        <LineChart data={data} margin={chartInset}>\n          <CartesianGrid strokeDasharray=\"3 3\" />\n          <XAxis dataKey=\"name\" tickLine={false} axisLine={false} tick={chartTick} />\n          <YAxis tickLine={false} axisLine={false} tick={chartTick} />\n          <RechartsTooltip contentStyle={chartTooltipStyle} itemStyle={chartTooltipItemStyle} labelStyle={chartTooltipLabel} cursor={chartTooltipCursor} />\n          <RechartsLegend />\n          {series && series.length > 0\n            ? series.map((s, i) => (\n              <Line key={s.dataKey} type=\"monotone\" dataKey={s.dataKey} name={s.name ?? s.dataKey} stroke={seriesFill(i, s.fill)} isAnimationActive={false} />\n            ))\n            : <Line type=\"monotone\" dataKey=\"value\" name={name ?? 'value'} stroke=\"var(--dsx-color-primary)\" isAnimationActive={false} />}\n        </LineChart>\n      </ResponsiveContainer>\n    </ChartContainer>\n  )\n})\nChartLine.displayName = 'ChartLine'\n\nconst ChartBar = React.forwardRef<HTMLDivElement, ChartMultiProps>(({ data, series, stacked, name, className, ...props }, forwardedRef) => {\n  const stackId = stacked ? 'dsx-stack' : undefined\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"bar\">\n      <ResponsiveContainer width=\"100%\" height=\"100%\" minWidth={chartResponsiveFallback.minWidth} minHeight={chartResponsiveFallback.minHeight} debounce={chartResponsiveFallback.debounce}>\n        <BarChart data={data} margin={chartInset}>\n          <CartesianGrid strokeDasharray=\"3 3\" />\n          <XAxis dataKey=\"name\" tickLine={false} axisLine={false} tick={chartTick} />\n          <YAxis tickLine={false} axisLine={false} tick={chartTick} />\n          <RechartsTooltip contentStyle={chartTooltipStyle} itemStyle={chartTooltipItemStyle} labelStyle={chartTooltipLabel} cursor={chartTooltipBarCursor} />\n          <RechartsLegend />\n          {series && series.length > 0\n            ? series.map((s, i) => (\n              <Bar key={s.dataKey} dataKey={s.dataKey} name={s.name ?? s.dataKey} fill={seriesFill(i, s.fill)} stackId={stackId} isAnimationActive={false} />\n            ))\n            : <Bar dataKey=\"value\" name={name ?? 'value'} fill=\"var(--dsx-color-primary)\" isAnimationActive={false} />}\n        </BarChart>\n      </ResponsiveContainer>\n    </ChartContainer>\n  )\n})\nChartBar.displayName = 'ChartBar'\n\nconst ChartPie = React.forwardRef<HTMLDivElement, ChartProps>(({ data, className, ...props }, forwardedRef) => {\n  const [dimensions, setDimensions] = React.useState({ width: 220, height: 240 })\n  const [legendHeight, legendContent] = useLegendHeight()\n  const radius = Math.max(0, Math.min(100, (Math.min(dimensions.width, dimensions.height - legendHeight) - 10) / 2))\n  const pieData = React.useMemo<ChartPieDatum[]>(\n    () => data.map((entry, index) => ({ ...entry, fill: `var(--dsx-chart-${(index % 5) + 1})` })),\n    [data],\n  )\n\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"pie\">\n      <ResponsiveContainer width=\"100%\" height=\"100%\" minWidth={chartResponsiveFallback.minWidth} minHeight={chartResponsiveFallback.minHeight} debounce={chartResponsiveFallback.debounce}\n        onResize={(width, height) => { setDimensions({ width, height }) }}>\n        <PieChart>\n          <Pie data={pieData} dataKey=\"value\" nameKey=\"name\" cx=\"50%\" cy=\"50%\" outerRadius={radius} isAnimationActive={false}>\n            {pieData.map((entry, index) => (\n              <Cell key={entry.id ?? entry.name ?? index} fill={entry.fill} />\n            ))}\n          </Pie>\n          <RechartsTooltip contentStyle={chartTooltipStyle} itemStyle={chartTooltipItemStyle} labelStyle={chartTooltipLabel} />\n          <RechartsLegend content={legendContent} />\n        </PieChart>\n      </ResponsiveContainer>\n    </ChartContainer>\n  )\n})\nChartPie.displayName = 'ChartPie'\n\nconst ChartDonut = React.forwardRef<HTMLDivElement, ChartDonutProps>(({ data, label, className, ...props }, forwardedRef) => {\n  const [dimensions, setDimensions] = React.useState({ width: 220, height: 240 })\n  const [legendHeight, legendContent] = useLegendHeight()\n  const radius = Math.max(0, Math.min(100, (Math.min(dimensions.width, dimensions.height - legendHeight) - 10) / 2))\n  const pieData = React.useMemo<ChartPieDatum[]>(\n    () => data.map((entry, index) => ({ ...entry, fill: `var(--dsx-chart-${(index % 5) + 1})` })),\n    [data],\n  )\n\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"donut\">\n      <ResponsiveContainer width=\"100%\" height=\"100%\" minWidth={chartResponsiveFallback.minWidth} minHeight={chartResponsiveFallback.minHeight} debounce={chartResponsiveFallback.debounce}\n        onResize={(width, height) => { setDimensions({ width, height }) }}>\n        <PieChart>\n          <Pie data={pieData} dataKey=\"value\" nameKey=\"name\" cx=\"50%\" cy=\"50%\" innerRadius={radius * 0.62} outerRadius={radius} isAnimationActive={false}>\n            {pieData.map((entry, index) => (\n              <Cell key={entry.id ?? entry.name ?? index} fill={entry.fill} />\n            ))}\n          </Pie>\n          <RechartsTooltip contentStyle={chartTooltipStyle} itemStyle={chartTooltipItemStyle} labelStyle={chartTooltipLabel} />\n          <RechartsLegend content={legendContent} />\n        </PieChart>\n      </ResponsiveContainer>\n      {label != null ? <div className=\"dsx-chart__center-label\" style={{ bottom: legendHeight }}>{label}</div> : null}\n    </ChartContainer>\n  )\n})\nChartDonut.displayName = 'ChartDonut'\n\nconst ChartRadial = React.forwardRef<HTMLDivElement, ChartRadialProps>(({ value, max = 100, label, className, ...props }, forwardedRef) => {\n  const clamped = Math.max(0, Math.min(value, max))\n  const data = React.useMemo(() => [{ name: 'value', value: clamped, fill: 'var(--dsx-color-primary)' }], [clamped])\n\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"radial\">\n      <ResponsiveContainer width=\"100%\" height=\"100%\" minWidth={chartResponsiveFallback.minWidth} minHeight={chartResponsiveFallback.minHeight} debounce={chartResponsiveFallback.debounce}>\n        <RadialBarChart cx=\"50%\" cy=\"50%\" innerRadius=\"88%\" outerRadius=\"100%\" data={data} startAngle={90} endAngle={-270}>\n          <RadialBar dataKey=\"value\" background={{ fill: 'var(--dsx-color-surface-sunken)' }} isAnimationActive={false} />\n        </RadialBarChart>\n      </ResponsiveContainer>\n      {label != null ? <div className=\"dsx-chart__center-label\">{label}</div> : null}\n    </ChartContainer>\n  )\n})\nChartRadial.displayName = 'ChartRadial'\n\nconst ChartArea = React.forwardRef<HTMLDivElement, ChartAreaProps>(({ data, series, name, spark, className, ...props }, forwardedRef) => {\n  return (\n    <ChartContainer {...props} ref={forwardedRef} className={className} data-chart-type=\"area\" data-spark={spark || undefined}>\n      <ResponsiveContainer width=\"100%\" height=\"100%\" minWidth={chartResponsiveFallback.minWidth} minHeight={spark ? 0 : chartResponsiveFallback.minHeight} debounce={chartResponsiveFallback.debounce}>\n        <AreaChart data={data} margin={spark ? chartSparkInset : chartInset}>\n          {!spark ? <CartesianGrid strokeDasharray=\"3 3\" /> : null}\n          {!spark ? <XAxis dataKey=\"name\" tickLine={false} axisLine={false} tick={chartTick} /> : null}\n          {!spark ? <YAxis tickLine={false} axisLine={false} tick={chartTick} /> : null}\n          {!spark ? <RechartsTooltip contentStyle={chartTooltipStyle} itemStyle={chartTooltipItemStyle} labelStyle={chartTooltipLabel} cursor={chartTooltipCursor} /> : null}\n          {!spark ? <RechartsLegend /> : null}\n          {series && series.length > 0\n            ? series.map((s, i) => (\n              <Area key={s.dataKey} type=\"monotone\" dataKey={s.dataKey} name={s.name ?? s.dataKey} stroke={seriesFill(i, s.fill)} fill={seriesFill(i, s.fill)} fillOpacity={0.1} isAnimationActive={false} />\n            ))\n            : <Area type=\"monotone\" dataKey=\"value\" name={name ?? 'value'} stroke=\"var(--dsx-color-primary)\" fill=\"var(--dsx-color-primary)\" fillOpacity={0.1} isAnimationActive={false} />}\n        </AreaChart>\n      </ResponsiveContainer>\n    </ChartContainer>\n  )\n})\nChartArea.displayName = 'ChartArea'\n\nconst ChartEmpty = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, forwardedRef) => (\n    <div {...props} ref={forwardedRef} className={classNames('dsx-chart__empty', className)} />\n  ),\n)\nChartEmpty.displayName = 'ChartEmpty'\n\ntype ChartLegendItemProps = React.HTMLAttributes<HTMLSpanElement> & {\n  color?: string\n}\n\nconst ChartLegendItem = React.forwardRef<HTMLSpanElement, ChartLegendItemProps>(\n  ({ className, color, style, ...props }, forwardedRef) => (\n    <span\n      {...props}\n      ref={forwardedRef}\n      className={classNames('dsx-chart__legend-item', className)}\n      style={color ? { ...style, '--dsx-chart-legend-color': color } as React.CSSProperties : style}\n    />\n  ),\n)\nChartLegendItem.displayName = 'ChartLegendItem'\n\nconst ChartLegend = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, forwardedRef) => (\n    <div {...props} ref={forwardedRef} className={classNames('dsx-chart__legend', className)} />\n  ),\n)\nChartLegend.displayName = 'ChartLegend'\n\nconst Chart: typeof ChartContainer & {\n  Container: typeof ChartContainer\n  Line: typeof ChartLine\n  Bar: typeof ChartBar\n  Pie: typeof ChartPie\n  Donut: typeof ChartDonut\n  Radial: typeof ChartRadial\n  Area: typeof ChartArea\n  Empty: typeof ChartEmpty\n  Legend: typeof ChartLegend\n  LegendItem: typeof ChartLegendItem\n} = Object.assign(ChartContainer, {\n  Container: ChartContainer,\n  Line: ChartLine,\n  Bar: ChartBar,\n  Pie: ChartPie,\n  Donut: ChartDonut,\n  Radial: ChartRadial,\n  Area: ChartArea,\n  Empty: ChartEmpty,\n  Legend: ChartLegend,\n  LegendItem: ChartLegendItem,\n})\n\nexport {\n  AreaChart,\n  BarChart,\n  CartesianGrid,\n  Chart,\n  ChartArea,\n  ChartBar,\n  ChartContainer,\n  ChartDonut,\n  ChartEmpty,\n  ChartLegend,\n  ChartLegendItem,\n  ChartLine,\n  ChartPie,\n  ChartRadial,\n  LineChart,\n  PieChart,\n  RadialBarChart,\n  RechartsLegend,\n  RechartsTooltip as ChartTooltip,\n  ResponsiveContainer,\n  XAxis,\n  YAxis,\n}\nexport type { ChartAreaProps, ChartContainerProps, ChartDatum, ChartDonutProps, ChartLegendItemProps, ChartMultiProps, ChartProps, ChartRadialProps, ChartRow, ChartSeries }\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/components/chart.css

@@ -2,20 +2,45 @@
 
 .dsx-chart {
   position: relative;
+  min-width: 0;
+  max-width: 100%;
   display: flex;
-  min-height: var(--dsx-chart-min-height);
+  min-height: var(--dsx-chart-min-height, 240px);
   aspect-ratio: var(--dsx-chart-aspect-ratio, 1.7778);
-  border: 1px solid var(--dsx-semantic-border);
-  border-radius: var(--dsx-rounded-xl);
-  background: linear-gradient(180deg, var(--dsx-semantic-card), var(--dsx-semantic-muted));
   color: var(--dsx-semantic-card-foreground);
   overflow: hidden;
 }
 
-.dsx-chart[data-chart-type='pie'] {
+.dsx-chart[data-chart-type='pie'],
+.dsx-chart[data-chart-type='donut'],
+.dsx-chart[data-chart-type='radial'] {
   --dsx-chart-aspect-ratio: 1;
 }
 
+.dsx-chart[data-chart-type='area']:where([data-spark='true']) {
+  --dsx-chart-aspect-ratio: 3;
+  min-height: 0;
+}
+
+.dsx-chart__center-label {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: var(--dsx-space-xs);
+  pointer-events: none;
+  text-align: center;
+  min-width: 0;
+  overflow-wrap: anywhere;
+}
+
+.dsx-chart__center-label > * {
+  min-width: 0;
+  max-width: 100%;
+}
+
 .dsx-chart__empty {
   display: flex;
   flex: 1;

package/dist/components/checkbox-cards.css

@@ -54,6 +54,14 @@
 .dsx-checkbox-cards__item[data-state='checked'] {
   border-color: var(--dsx-color-primary);
   background: var(--dsx-color-primary-ghost, color-mix(in srgb, var(--dsx-color-primary) 8%, transparent));
+  /* F2 selected role: 2px inset accent ring on top of the 1px accent border —
+     no layout shift on check, crisp at every DPI. */
+  box-shadow: var(--dsx-boundary-selected-ring);
+}
+
+/* Checked + keyboard focus: show the focus ring and the selected ring together. */
+.dsx-checkbox-cards__item[data-state='checked']:focus-visible {
+  box-shadow: var(--dsx-shadow-focus-ring), var(--dsx-boundary-selected-ring);
 }
 
 .dsx-checkbox-cards__item[data-disabled] {

package/dist/components/checkbox.css

@@ -2,10 +2,11 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
+  position: relative;
   width: var(--dsx-size-md);
   height: var(--dsx-size-md);
   border-radius: var(--dsx-rounded-sm);
-  border: var(--dsx-border-width-md) solid var(--dsx-color-outline-variant);
+  border: var(--dsx-boundary-control-width, var(--dsx-border-width-sm)) solid var(--dsx-color-outline-variant);
   background: var(--dsx-color-surface);
   color: var(--dsx-color-on-surface);
   transition:
@@ -61,11 +62,24 @@
   box-shadow: var(--dsx-shadow-focus-ring);
 }
 
+/* Extended hit area — the visual box stays 20/24/32px per size, but the
+   pointer target grows to 44px (WCAG 2.5.8 minimum 24px, TMA touch 44px).
+   Absolutely positioned, so it never affects layout. */
+.dsx-checkbox::before {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: max(100% + 16px, 44px);
+  height: max(100% + 16px, 44px);
+}
+
 .dsx-checkbox[data-state='checked'],
 .dsx-checkbox[data-state='indeterminate'] {
-  background: var(--dsx-color-primary);
-  border-color: var(--dsx-color-primary);
-  color: var(--dsx-color-on-primary);
+  background: var(--dsx-color-accent-track);
+  border-color: var(--dsx-color-accent-track);
+  color: var(--dsx-color-accent-contrast);
 }
 
 /* Accent color overrides for checked/indeterminate state */

package/dist/components/code.css

@@ -1,11 +1,14 @@
 
 
 .dsx-code {
-  font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', monospace;
-  font-size: var(--dsx-typography-code-font-size, 0.875em);
-  font-weight: var(--dsx-typography-code-font-weight, 400);
-  line-height: var(--dsx-typography-code-line-height, 1.25);
-  letter-spacing: var(--dsx-typography-code-letter-spacing, -0.01em);
+  font-family: var(--dsx-typography-code-font-family);
+  font-size: var(--dsx-typography-code-font-size);
+  font-weight: var(--dsx-typography-code-font-weight);
+  line-height: var(--dsx-typography-code-line-height);
+  letter-spacing: var(--dsx-typography-code-letter-spacing);
+  font-variation-settings: var(--dsx-typography-code-font-variation-settings);
+  text-transform: var(--dsx-typography-code-text-transform);
+  text-decoration: var(--dsx-typography-code-text-decoration);
   border-radius: var(--dsx-rounded-sm);
   padding: var(--dsx-space-0-5, 2px) var(--dsx-space-1-5, 6px);
   box-sizing: border-box;
@@ -13,7 +16,7 @@
 }
 
 .dsx-code--soft {
-  background-color: var(--dsx-color-surface-raised);
+  background-color: var(--dsx-color-surface-sunken);
   color: var(--dsx-color-on-surface);
   box-shadow: inset 0 0 0 1px var(--dsx-color-outline-variant);
 }

package/dist/components/collapsible/Collapsible.cjs

@@ -73,7 +73,8 @@ const COLLAPSIBLE_MOTION_STYLES = `
 }
 
 .dsx-collapsible__content[data-state='closed'] {
-  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);
+  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out) both;
+  overflow: hidden;
 }
 
 @media (prefers-reduced-motion: reduce) {
@@ -81,6 +82,11 @@ const COLLAPSIBLE_MOTION_STYLES = `
   .dsx-collapsible__content[data-state='closed'] {
     animation: none !important;
   }
+  /* No animation runs, so forceMount-kept closed content would render at
+     full height \u2014 hide it outright for reduced-motion users. */
+  .dsx-collapsible__content[data-state='closed'] {
+    display: none;
+  }
 }
 `;
 function useCollapsibleMotionStyles() {

package/dist/components/collapsible/Collapsible.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/collapsible/Collapsible.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { Icon } from '../icon/Icon'\nimport { collapsibleContentPropDefs, collapsiblePropDefs, collapsibleTriggerPropDefs } from './collapsible.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\nconst COLLAPSIBLE_MOTION_STYLE_ID = 'dsx-collapsible-motion-styles'\nconst COLLAPSIBLE_MOTION_STYLES = `\n@keyframes dsx-collapsible-expand {\n  from {\n    height: 0;\n    opacity: 0;\n  }\n\n  to {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n}\n\n@keyframes dsx-collapsible-collapse {\n  from {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n\n  to {\n    height: 0;\n    opacity: 0;\n  }\n}\n\n.dsx-collapsible__content[data-state='open'] {\n  animation: dsx-collapsible-expand var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);\n}\n\n.dsx-collapsible__content[data-state='closed'] {\n  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .dsx-collapsible__content[data-state='open'],\n  .dsx-collapsible__content[data-state='closed'] {\n    animation: none !important;\n  }\n}\n`\n\nfunction useCollapsibleMotionStyles() {\n  React.useInsertionEffect(() => {\n    if (typeof document === 'undefined') {\n      return\n    }\n\n    if (document.getElementById(COLLAPSIBLE_MOTION_STYLE_ID)) {\n      return\n    }\n\n    const style = document.createElement('style')\n\n    style.id = COLLAPSIBLE_MOTION_STYLE_ID\n    style.textContent = COLLAPSIBLE_MOTION_STYLES\n\n    document.head.appendChild(style)\n  }, [])\n}\n\ntype CollapsibleOwnProps = GetPropDefTypes<typeof collapsiblePropDefs>\ntype CollapsibleTriggerOwnProps = GetPropDefTypes<typeof collapsibleTriggerPropDefs>\ntype CollapsibleContentOwnProps = GetPropDefTypes<typeof collapsibleContentPropDefs>\n\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root> & CollapsibleOwnProps\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger> & CollapsibleTriggerOwnProps\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content> & CollapsibleContentOwnProps\n\nconst CollapsibleRoot = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Root>, CollapsibleProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...collapsibleProps } = extractProps(props, collapsiblePropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Root {...collapsibleProps} ref={forwardedRef} asChild>\n        <Comp className={className}>{children}</Comp>\n      </CollapsiblePrimitive.Root>\n    )\n  },\n)\nCollapsibleRoot.displayName = 'Collapsible'\n\nconst CollapsibleTrigger = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Trigger>, CollapsibleTriggerProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...triggerProps } = extractProps(props, collapsibleTriggerPropDefs)\n    const Comp = asChild ? Slot : 'button'\n\n    return (\n      <CollapsiblePrimitive.Trigger {...triggerProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__trigger', className)}>\n          <span>{asChild ? <Slottable>{children}</Slottable> : children}</span>\n          <Icon name=\"chevron-down\" size=\"lg\" className=\"dsx-collapsible__chevron\" />\n        </Comp>\n      </CollapsiblePrimitive.Trigger>\n    )\n  },\n)\nCollapsibleTrigger.displayName = 'CollapsibleTrigger'\n\nconst CollapsibleContent = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Content>, CollapsibleContentProps>(\n  ({ children, ...props }, forwardedRef) => {\n    useCollapsibleMotionStyles()\n\n    const { asChild, className, ...contentProps } = extractProps(props, collapsibleContentPropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Content {...contentProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__content', className)}>\n          {asChild ? <Slottable>{children}</Slottable> : children}\n        </Comp>\n      </CollapsiblePrimitive.Content>\n    )\n  },\n)\nCollapsibleContent.displayName = 'CollapsibleContent'\n\nconst Collapsible: typeof CollapsibleRoot & {\n  Trigger: typeof CollapsibleTrigger\n  Content: typeof CollapsibleContent\n} = Object.assign(CollapsibleRoot, {\n  Trigger: CollapsibleTrigger,\n  Content: CollapsibleContent,\n})\n\nexport { Collapsible, CollapsibleContent, CollapsibleRoot, CollapsibleTrigger }\nexport type { CollapsibleContentProps, CollapsibleProps, CollapsibleTriggerProps }\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,wBAAuB;AACvB,2BAAsC;AACtC,wBAAgC;AAEhC,0BAA6B;AAC7B,kBAAqB;AACrB,yBAA4F;AAgFpF;AA5ER,MAAM,8BAA8B;AACpC,MAAM,4BAA4B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyClC,SAAS,6BAA6B;AACpC,QAAM,mBAAmB,MAAM;AAC7B,QAAI,OAAO,aAAa,aAAa;AACnC;AAAA,IACF;AAEA,QAAI,SAAS,eAAe,2BAA2B,GAAG;AACxD;AAAA,IACF;AAEA,UAAM,QAAQ,SAAS,cAAc,OAAO;AAE5C,UAAM,KAAK;AACX,UAAM,cAAc;AAEpB,aAAS,KAAK,YAAY,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AACP;AAUA,MAAM,kBAAkB,MAAM;AAAA,EAC5B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,iBAAiB,QAAI,kCAAa,OAAO,sCAAmB;AAC3F,UAAM,OAAO,UAAU,yBAAO;AAE9B,WACE,4CAAC,qBAAqB,MAArB,EAA2B,GAAG,kBAAkB,KAAK,cAAc,SAAO,MACzE,sDAAC,QAAK,WAAuB,UAAS,GACxC;AAAA,EAEJ;AACF;AACA,gBAAgB,cAAc;AAE9B,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,QAAI,kCAAa,OAAO,6CAA0B;AAC9F,UAAM,OAAO,UAAU,yBAAO;AAE9B,WACE,4CAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,uDAAC,QAAK,eAAW,kBAAAA,SAAW,4BAA4B,SAAS,GAC/D;AAAA,kDAAC,UAAM,oBAAU,4CAAC,+BAAW,UAAS,IAAe,UAAS;AAAA,MAC9D,4CAAC,oBAAK,MAAK,gBAAe,MAAK,MAAK,WAAU,4BAA2B;AAAA,OAC3E,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,+BAA2B;AAE3B,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,QAAI,kCAAa,OAAO,6CAA0B;AAC9F,UAAM,OAAO,UAAU,yBAAO;AAE9B,WACE,4CAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,sDAAC,QAAK,eAAW,kBAAAA,SAAW,4BAA4B,SAAS,GAC9D,oBAAU,4CAAC,+BAAW,UAAS,IAAe,UACjD,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,cAGF,OAAO,OAAO,iBAAiB;AAAA,EACjC,SAAS;AAAA,EACT,SAAS;AACX,CAAC;",
+  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { Icon } from '../icon/Icon'\nimport { collapsibleContentPropDefs, collapsiblePropDefs, collapsibleTriggerPropDefs } from './collapsible.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\nconst COLLAPSIBLE_MOTION_STYLE_ID = 'dsx-collapsible-motion-styles'\nconst COLLAPSIBLE_MOTION_STYLES = `\n@keyframes dsx-collapsible-expand {\n  from {\n    height: 0;\n    opacity: 0;\n  }\n\n  to {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n}\n\n@keyframes dsx-collapsible-collapse {\n  from {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n\n  to {\n    height: 0;\n    opacity: 0;\n  }\n}\n\n.dsx-collapsible__content[data-state='open'] {\n  animation: dsx-collapsible-expand var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);\n}\n\n.dsx-collapsible__content[data-state='closed'] {\n  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out) both;\n  overflow: hidden;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .dsx-collapsible__content[data-state='open'],\n  .dsx-collapsible__content[data-state='closed'] {\n    animation: none !important;\n  }\n  /* No animation runs, so forceMount-kept closed content would render at\n     full height \u2014 hide it outright for reduced-motion users. */\n  .dsx-collapsible__content[data-state='closed'] {\n    display: none;\n  }\n}\n`\n\nfunction useCollapsibleMotionStyles() {\n  React.useInsertionEffect(() => {\n    if (typeof document === 'undefined') {\n      return\n    }\n\n    if (document.getElementById(COLLAPSIBLE_MOTION_STYLE_ID)) {\n      return\n    }\n\n    const style = document.createElement('style')\n\n    style.id = COLLAPSIBLE_MOTION_STYLE_ID\n    style.textContent = COLLAPSIBLE_MOTION_STYLES\n\n    document.head.appendChild(style)\n  }, [])\n}\n\ntype CollapsibleOwnProps = GetPropDefTypes<typeof collapsiblePropDefs>\ntype CollapsibleTriggerOwnProps = GetPropDefTypes<typeof collapsibleTriggerPropDefs>\ntype CollapsibleContentOwnProps = GetPropDefTypes<typeof collapsibleContentPropDefs>\n\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root> & CollapsibleOwnProps\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger> & CollapsibleTriggerOwnProps\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content> & CollapsibleContentOwnProps\n\nconst CollapsibleRoot = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Root>, CollapsibleProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...collapsibleProps } = extractProps(props, collapsiblePropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Root {...collapsibleProps} ref={forwardedRef} asChild>\n        <Comp className={className}>{children}</Comp>\n      </CollapsiblePrimitive.Root>\n    )\n  },\n)\nCollapsibleRoot.displayName = 'Collapsible'\n\nconst CollapsibleTrigger = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Trigger>, CollapsibleTriggerProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...triggerProps } = extractProps(props, collapsibleTriggerPropDefs)\n    const Comp = asChild ? Slot : 'button'\n\n    return (\n      <CollapsiblePrimitive.Trigger {...triggerProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__trigger', className)}>\n          <span>{asChild ? <Slottable>{children}</Slottable> : children}</span>\n          <Icon name=\"chevron-down\" size=\"lg\" className=\"dsx-collapsible__chevron\" />\n        </Comp>\n      </CollapsiblePrimitive.Trigger>\n    )\n  },\n)\nCollapsibleTrigger.displayName = 'CollapsibleTrigger'\n\nconst CollapsibleContent = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Content>, CollapsibleContentProps>(\n  ({ children, ...props }, forwardedRef) => {\n    useCollapsibleMotionStyles()\n\n    const { asChild, className, ...contentProps } = extractProps(props, collapsibleContentPropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Content {...contentProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__content', className)}>\n          {asChild ? <Slottable>{children}</Slottable> : children}\n        </Comp>\n      </CollapsiblePrimitive.Content>\n    )\n  },\n)\nCollapsibleContent.displayName = 'CollapsibleContent'\n\nconst Collapsible: typeof CollapsibleRoot & {\n  Trigger: typeof CollapsibleTrigger\n  Content: typeof CollapsibleContent\n} = Object.assign(CollapsibleRoot, {\n  Trigger: CollapsibleTrigger,\n  Content: CollapsibleContent,\n})\n\nexport { Collapsible, CollapsibleContent, CollapsibleRoot, CollapsibleTrigger }\nexport type { CollapsibleContentProps, CollapsibleProps, CollapsibleTriggerProps }\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,wBAAuB;AACvB,2BAAsC;AACtC,wBAAgC;AAEhC,0BAA6B;AAC7B,kBAAqB;AACrB,yBAA4F;AAsFpF;AAlFR,MAAM,8BAA8B;AACpC,MAAM,4BAA4B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+ClC,SAAS,6BAA6B;AACpC,QAAM,mBAAmB,MAAM;AAC7B,QAAI,OAAO,aAAa,aAAa;AACnC;AAAA,IACF;AAEA,QAAI,SAAS,eAAe,2BAA2B,GAAG;AACxD;AAAA,IACF;AAEA,UAAM,QAAQ,SAAS,cAAc,OAAO;AAE5C,UAAM,KAAK;AACX,UAAM,cAAc;AAEpB,aAAS,KAAK,YAAY,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AACP;AAUA,MAAM,kBAAkB,MAAM;AAAA,EAC5B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,iBAAiB,QAAI,kCAAa,OAAO,sCAAmB;AAC3F,UAAM,OAAO,UAAU,yBAAO;AAE9B,WACE,4CAAC,qBAAqB,MAArB,EAA2B,GAAG,kBAAkB,KAAK,cAAc,SAAO,MACzE,sDAAC,QAAK,WAAuB,UAAS,GACxC;AAAA,EAEJ;AACF;AACA,gBAAgB,cAAc;AAE9B,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,QAAI,kCAAa,OAAO,6CAA0B;AAC9F,UAAM,OAAO,UAAU,yBAAO;AAE9B,WACE,4CAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,uDAAC,QAAK,eAAW,kBAAAA,SAAW,4BAA4B,SAAS,GAC/D;AAAA,kDAAC,UAAM,oBAAU,4CAAC,+BAAW,UAAS,IAAe,UAAS;AAAA,MAC9D,4CAAC,oBAAK,MAAK,gBAAe,MAAK,MAAK,WAAU,4BAA2B;AAAA,OAC3E,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,+BAA2B;AAE3B,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,QAAI,kCAAa,OAAO,6CAA0B;AAC9F,UAAM,OAAO,UAAU,yBAAO;AAE9B,WACE,4CAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,sDAAC,QAAK,eAAW,kBAAAA,SAAW,4BAA4B,SAAS,GAC9D,oBAAU,4CAAC,+BAAW,UAAS,IAAe,UACjD,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,cAGF,OAAO,OAAO,iBAAiB;AAAA,EACjC,SAAS;AAAA,EACT,SAAS;AACX,CAAC;",
   "names": ["classNames"]
 }

package/dist/components/collapsible/Collapsible.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Collapsible.d.cts","sourceRoot":"","sources":["../../../src/components/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAKnE,OAAO,EAAE,0BAA0B,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAA;AAEjH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AA+DpE,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAA;AACtE,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AACpF,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AAEpF,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,mBAAmB,CAAA;AAC9G,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAC/H,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAE/H,QAAA,MAAM,eAAe;;;;;yCAWpB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;4CAcvB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;yCAevB,CAAA;AAGD,QAAA,MAAM,WAAW,EAAE,OAAO,eAAe,GAAG;IAC1C,OAAO,EAAE,OAAO,kBAAkB,CAAA;IAClC,OAAO,EAAE,OAAO,kBAAkB,CAAA;CAIlC,CAAA;AAEF,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAA;AAC/E,YAAY,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,CAAA"}
+{"version":3,"file":"Collapsible.d.cts","sourceRoot":"","sources":["../../../src/components/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAKnE,OAAO,EAAE,0BAA0B,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAA;AAEjH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAqEpE,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAA;AACtE,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AACpF,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AAEpF,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,mBAAmB,CAAA;AAC9G,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAC/H,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAE/H,QAAA,MAAM,eAAe;;;;;yCAWpB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;4CAcvB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;yCAevB,CAAA;AAGD,QAAA,MAAM,WAAW,EAAE,OAAO,eAAe,GAAG;IAC1C,OAAO,EAAE,OAAO,kBAAkB,CAAA;IAClC,OAAO,EAAE,OAAO,kBAAkB,CAAA;CAIlC,CAAA;AAEF,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAA;AAC/E,YAAY,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,CAAA"}

package/dist/components/collapsible/Collapsible.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Collapsible.d.mts","sourceRoot":"","sources":["../../../src/components/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAKnE,OAAO,EAAE,0BAA0B,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAA;AAEjH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AA+DpE,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAA;AACtE,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AACpF,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AAEpF,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,mBAAmB,CAAA;AAC9G,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAC/H,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAE/H,QAAA,MAAM,eAAe;;;;;yCAWpB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;4CAcvB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;yCAevB,CAAA;AAGD,QAAA,MAAM,WAAW,EAAE,OAAO,eAAe,GAAG;IAC1C,OAAO,EAAE,OAAO,kBAAkB,CAAA;IAClC,OAAO,EAAE,OAAO,kBAAkB,CAAA;CAIlC,CAAA;AAEF,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAA;AAC/E,YAAY,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,CAAA"}
+{"version":3,"file":"Collapsible.d.mts","sourceRoot":"","sources":["../../../src/components/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAKnE,OAAO,EAAE,0BAA0B,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAA;AAEjH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAqEpE,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAA;AACtE,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AACpF,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AAEpF,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,mBAAmB,CAAA;AAC9G,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAC/H,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAE/H,QAAA,MAAM,eAAe;;;;;yCAWpB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;4CAcvB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;yCAevB,CAAA;AAGD,QAAA,MAAM,WAAW,EAAE,OAAO,eAAe,GAAG;IAC1C,OAAO,EAAE,OAAO,kBAAkB,CAAA;IAClC,OAAO,EAAE,OAAO,kBAAkB,CAAA;CAIlC,CAAA;AAEF,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAA;AAC/E,YAAY,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,CAAA"}

package/dist/components/collapsible/Collapsible.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Collapsible.d.ts","sourceRoot":"","sources":["../../../src/components/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAKnE,OAAO,EAAE,0BAA0B,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAA;AAEjH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AA+DpE,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAA;AACtE,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AACpF,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AAEpF,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,mBAAmB,CAAA;AAC9G,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAC/H,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAE/H,QAAA,MAAM,eAAe;;;;;yCAWpB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;4CAcvB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;yCAevB,CAAA;AAGD,QAAA,MAAM,WAAW,EAAE,OAAO,eAAe,GAAG;IAC1C,OAAO,EAAE,OAAO,kBAAkB,CAAA;IAClC,OAAO,EAAE,OAAO,kBAAkB,CAAA;CAIlC,CAAA;AAEF,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAA;AAC/E,YAAY,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,CAAA"}
+{"version":3,"file":"Collapsible.d.ts","sourceRoot":"","sources":["../../../src/components/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAKnE,OAAO,EAAE,0BAA0B,EAAE,mBAAmB,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAA;AAEjH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAqEpE,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAA;AACtE,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AACpF,KAAK,0BAA0B,GAAG,eAAe,CAAC,OAAO,0BAA0B,CAAC,CAAA;AAEpF,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,mBAAmB,CAAA;AAC9G,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAC/H,KAAK,uBAAuB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC,GAAG,0BAA0B,CAAA;AAE/H,QAAA,MAAM,eAAe;;;;;yCAWpB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;4CAcvB,CAAA;AAGD,QAAA,MAAM,kBAAkB;;;;;yCAevB,CAAA;AAGD,QAAA,MAAM,WAAW,EAAE,OAAO,eAAe,GAAG;IAC1C,OAAO,EAAE,OAAO,kBAAkB,CAAA;IAClC,OAAO,EAAE,OAAO,kBAAkB,CAAA;CAIlC,CAAA;AAEF,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAA;AAC/E,YAAY,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,CAAA"}

package/dist/components/collapsible/Collapsible.js

@@ -37,7 +37,8 @@ const COLLAPSIBLE_MOTION_STYLES = `
 }
 
 .dsx-collapsible__content[data-state='closed'] {
-  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);
+  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out) both;
+  overflow: hidden;
 }
 
 @media (prefers-reduced-motion: reduce) {
@@ -45,6 +46,11 @@ const COLLAPSIBLE_MOTION_STYLES = `
   .dsx-collapsible__content[data-state='closed'] {
     animation: none !important;
   }
+  /* No animation runs, so forceMount-kept closed content would render at
+     full height \u2014 hide it outright for reduced-motion users. */
+  .dsx-collapsible__content[data-state='closed'] {
+    display: none;
+  }
 }
 `;
 function useCollapsibleMotionStyles() {

package/dist/components/collapsible/Collapsible.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/collapsible/Collapsible.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { Icon } from '../icon/Icon'\nimport { collapsibleContentPropDefs, collapsiblePropDefs, collapsibleTriggerPropDefs } from './collapsible.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\nconst COLLAPSIBLE_MOTION_STYLE_ID = 'dsx-collapsible-motion-styles'\nconst COLLAPSIBLE_MOTION_STYLES = `\n@keyframes dsx-collapsible-expand {\n  from {\n    height: 0;\n    opacity: 0;\n  }\n\n  to {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n}\n\n@keyframes dsx-collapsible-collapse {\n  from {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n\n  to {\n    height: 0;\n    opacity: 0;\n  }\n}\n\n.dsx-collapsible__content[data-state='open'] {\n  animation: dsx-collapsible-expand var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);\n}\n\n.dsx-collapsible__content[data-state='closed'] {\n  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .dsx-collapsible__content[data-state='open'],\n  .dsx-collapsible__content[data-state='closed'] {\n    animation: none !important;\n  }\n}\n`\n\nfunction useCollapsibleMotionStyles() {\n  React.useInsertionEffect(() => {\n    if (typeof document === 'undefined') {\n      return\n    }\n\n    if (document.getElementById(COLLAPSIBLE_MOTION_STYLE_ID)) {\n      return\n    }\n\n    const style = document.createElement('style')\n\n    style.id = COLLAPSIBLE_MOTION_STYLE_ID\n    style.textContent = COLLAPSIBLE_MOTION_STYLES\n\n    document.head.appendChild(style)\n  }, [])\n}\n\ntype CollapsibleOwnProps = GetPropDefTypes<typeof collapsiblePropDefs>\ntype CollapsibleTriggerOwnProps = GetPropDefTypes<typeof collapsibleTriggerPropDefs>\ntype CollapsibleContentOwnProps = GetPropDefTypes<typeof collapsibleContentPropDefs>\n\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root> & CollapsibleOwnProps\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger> & CollapsibleTriggerOwnProps\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content> & CollapsibleContentOwnProps\n\nconst CollapsibleRoot = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Root>, CollapsibleProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...collapsibleProps } = extractProps(props, collapsiblePropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Root {...collapsibleProps} ref={forwardedRef} asChild>\n        <Comp className={className}>{children}</Comp>\n      </CollapsiblePrimitive.Root>\n    )\n  },\n)\nCollapsibleRoot.displayName = 'Collapsible'\n\nconst CollapsibleTrigger = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Trigger>, CollapsibleTriggerProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...triggerProps } = extractProps(props, collapsibleTriggerPropDefs)\n    const Comp = asChild ? Slot : 'button'\n\n    return (\n      <CollapsiblePrimitive.Trigger {...triggerProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__trigger', className)}>\n          <span>{asChild ? <Slottable>{children}</Slottable> : children}</span>\n          <Icon name=\"chevron-down\" size=\"lg\" className=\"dsx-collapsible__chevron\" />\n        </Comp>\n      </CollapsiblePrimitive.Trigger>\n    )\n  },\n)\nCollapsibleTrigger.displayName = 'CollapsibleTrigger'\n\nconst CollapsibleContent = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Content>, CollapsibleContentProps>(\n  ({ children, ...props }, forwardedRef) => {\n    useCollapsibleMotionStyles()\n\n    const { asChild, className, ...contentProps } = extractProps(props, collapsibleContentPropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Content {...contentProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__content', className)}>\n          {asChild ? <Slottable>{children}</Slottable> : children}\n        </Comp>\n      </CollapsiblePrimitive.Content>\n    )\n  },\n)\nCollapsibleContent.displayName = 'CollapsibleContent'\n\nconst Collapsible: typeof CollapsibleRoot & {\n  Trigger: typeof CollapsibleTrigger\n  Content: typeof CollapsibleContent\n} = Object.assign(CollapsibleRoot, {\n  Trigger: CollapsibleTrigger,\n  Content: CollapsibleContent,\n})\n\nexport { Collapsible, CollapsibleContent, CollapsibleRoot, CollapsibleTrigger }\nexport type { CollapsibleContentProps, CollapsibleProps, CollapsibleTriggerProps }\n"],
-  "mappings": "AAAA,YAAY,WAAW;AACvB,OAAO,gBAAgB;AACvB,YAAY,0BAA0B;AACtC,SAAS,MAAM,iBAAiB;AAEhC,SAAS,oBAAoB;AAC7B,SAAS,YAAY;AACrB,SAAS,4BAA4B,qBAAqB,kCAAkC;AAgFpF,cAcA,YAdA;AA5ER,MAAM,8BAA8B;AACpC,MAAM,4BAA4B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyClC,SAAS,6BAA6B;AACpC,QAAM,mBAAmB,MAAM;AAC7B,QAAI,OAAO,aAAa,aAAa;AACnC;AAAA,IACF;AAEA,QAAI,SAAS,eAAe,2BAA2B,GAAG;AACxD;AAAA,IACF;AAEA,UAAM,QAAQ,SAAS,cAAc,OAAO;AAE5C,UAAM,KAAK;AACX,UAAM,cAAc;AAEpB,aAAS,KAAK,YAAY,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AACP;AAUA,MAAM,kBAAkB,MAAM;AAAA,EAC5B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,iBAAiB,IAAI,aAAa,OAAO,mBAAmB;AAC3F,UAAM,OAAO,UAAU,OAAO;AAE9B,WACE,oBAAC,qBAAqB,MAArB,EAA2B,GAAG,kBAAkB,KAAK,cAAc,SAAO,MACzE,8BAAC,QAAK,WAAuB,UAAS,GACxC;AAAA,EAEJ;AACF;AACA,gBAAgB,cAAc;AAE9B,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,IAAI,aAAa,OAAO,0BAA0B;AAC9F,UAAM,OAAO,UAAU,OAAO;AAE9B,WACE,oBAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,+BAAC,QAAK,WAAW,WAAW,4BAA4B,SAAS,GAC/D;AAAA,0BAAC,UAAM,oBAAU,oBAAC,aAAW,UAAS,IAAe,UAAS;AAAA,MAC9D,oBAAC,QAAK,MAAK,gBAAe,MAAK,MAAK,WAAU,4BAA2B;AAAA,OAC3E,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,+BAA2B;AAE3B,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,IAAI,aAAa,OAAO,0BAA0B;AAC9F,UAAM,OAAO,UAAU,OAAO;AAE9B,WACE,oBAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,8BAAC,QAAK,WAAW,WAAW,4BAA4B,SAAS,GAC9D,oBAAU,oBAAC,aAAW,UAAS,IAAe,UACjD,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,cAGF,OAAO,OAAO,iBAAiB;AAAA,EACjC,SAAS;AAAA,EACT,SAAS;AACX,CAAC;",
+  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { Icon } from '../icon/Icon'\nimport { collapsibleContentPropDefs, collapsiblePropDefs, collapsibleTriggerPropDefs } from './collapsible.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\nconst COLLAPSIBLE_MOTION_STYLE_ID = 'dsx-collapsible-motion-styles'\nconst COLLAPSIBLE_MOTION_STYLES = `\n@keyframes dsx-collapsible-expand {\n  from {\n    height: 0;\n    opacity: 0;\n  }\n\n  to {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n}\n\n@keyframes dsx-collapsible-collapse {\n  from {\n    height: var(--radix-collapsible-content-height);\n    opacity: 1;\n  }\n\n  to {\n    height: 0;\n    opacity: 0;\n  }\n}\n\n.dsx-collapsible__content[data-state='open'] {\n  animation: dsx-collapsible-expand var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out);\n}\n\n.dsx-collapsible__content[data-state='closed'] {\n  animation: dsx-collapsible-collapse var(--dsx-motion-duration-normal) var(--dsx-motion-easing-in-out) both;\n  overflow: hidden;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .dsx-collapsible__content[data-state='open'],\n  .dsx-collapsible__content[data-state='closed'] {\n    animation: none !important;\n  }\n  /* No animation runs, so forceMount-kept closed content would render at\n     full height \u2014 hide it outright for reduced-motion users. */\n  .dsx-collapsible__content[data-state='closed'] {\n    display: none;\n  }\n}\n`\n\nfunction useCollapsibleMotionStyles() {\n  React.useInsertionEffect(() => {\n    if (typeof document === 'undefined') {\n      return\n    }\n\n    if (document.getElementById(COLLAPSIBLE_MOTION_STYLE_ID)) {\n      return\n    }\n\n    const style = document.createElement('style')\n\n    style.id = COLLAPSIBLE_MOTION_STYLE_ID\n    style.textContent = COLLAPSIBLE_MOTION_STYLES\n\n    document.head.appendChild(style)\n  }, [])\n}\n\ntype CollapsibleOwnProps = GetPropDefTypes<typeof collapsiblePropDefs>\ntype CollapsibleTriggerOwnProps = GetPropDefTypes<typeof collapsibleTriggerPropDefs>\ntype CollapsibleContentOwnProps = GetPropDefTypes<typeof collapsibleContentPropDefs>\n\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root> & CollapsibleOwnProps\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger> & CollapsibleTriggerOwnProps\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content> & CollapsibleContentOwnProps\n\nconst CollapsibleRoot = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Root>, CollapsibleProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...collapsibleProps } = extractProps(props, collapsiblePropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Root {...collapsibleProps} ref={forwardedRef} asChild>\n        <Comp className={className}>{children}</Comp>\n      </CollapsiblePrimitive.Root>\n    )\n  },\n)\nCollapsibleRoot.displayName = 'Collapsible'\n\nconst CollapsibleTrigger = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Trigger>, CollapsibleTriggerProps>(\n  ({ children, ...props }, forwardedRef) => {\n    const { asChild, className, ...triggerProps } = extractProps(props, collapsibleTriggerPropDefs)\n    const Comp = asChild ? Slot : 'button'\n\n    return (\n      <CollapsiblePrimitive.Trigger {...triggerProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__trigger', className)}>\n          <span>{asChild ? <Slottable>{children}</Slottable> : children}</span>\n          <Icon name=\"chevron-down\" size=\"lg\" className=\"dsx-collapsible__chevron\" />\n        </Comp>\n      </CollapsiblePrimitive.Trigger>\n    )\n  },\n)\nCollapsibleTrigger.displayName = 'CollapsibleTrigger'\n\nconst CollapsibleContent = React.forwardRef<React.ComponentRef<typeof CollapsiblePrimitive.Content>, CollapsibleContentProps>(\n  ({ children, ...props }, forwardedRef) => {\n    useCollapsibleMotionStyles()\n\n    const { asChild, className, ...contentProps } = extractProps(props, collapsibleContentPropDefs)\n    const Comp = asChild ? Slot : 'div'\n\n    return (\n      <CollapsiblePrimitive.Content {...contentProps} ref={forwardedRef} asChild>\n        <Comp className={classNames('dsx-collapsible__content', className)}>\n          {asChild ? <Slottable>{children}</Slottable> : children}\n        </Comp>\n      </CollapsiblePrimitive.Content>\n    )\n  },\n)\nCollapsibleContent.displayName = 'CollapsibleContent'\n\nconst Collapsible: typeof CollapsibleRoot & {\n  Trigger: typeof CollapsibleTrigger\n  Content: typeof CollapsibleContent\n} = Object.assign(CollapsibleRoot, {\n  Trigger: CollapsibleTrigger,\n  Content: CollapsibleContent,\n})\n\nexport { Collapsible, CollapsibleContent, CollapsibleRoot, CollapsibleTrigger }\nexport type { CollapsibleContentProps, CollapsibleProps, CollapsibleTriggerProps }\n"],
+  "mappings": "AAAA,YAAY,WAAW;AACvB,OAAO,gBAAgB;AACvB,YAAY,0BAA0B;AACtC,SAAS,MAAM,iBAAiB;AAEhC,SAAS,oBAAoB;AAC7B,SAAS,YAAY;AACrB,SAAS,4BAA4B,qBAAqB,kCAAkC;AAsFpF,cAcA,YAdA;AAlFR,MAAM,8BAA8B;AACpC,MAAM,4BAA4B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+ClC,SAAS,6BAA6B;AACpC,QAAM,mBAAmB,MAAM;AAC7B,QAAI,OAAO,aAAa,aAAa;AACnC;AAAA,IACF;AAEA,QAAI,SAAS,eAAe,2BAA2B,GAAG;AACxD;AAAA,IACF;AAEA,UAAM,QAAQ,SAAS,cAAc,OAAO;AAE5C,UAAM,KAAK;AACX,UAAM,cAAc;AAEpB,aAAS,KAAK,YAAY,KAAK;AAAA,EACjC,GAAG,CAAC,CAAC;AACP;AAUA,MAAM,kBAAkB,MAAM;AAAA,EAC5B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,iBAAiB,IAAI,aAAa,OAAO,mBAAmB;AAC3F,UAAM,OAAO,UAAU,OAAO;AAE9B,WACE,oBAAC,qBAAqB,MAArB,EAA2B,GAAG,kBAAkB,KAAK,cAAc,SAAO,MACzE,8BAAC,QAAK,WAAuB,UAAS,GACxC;AAAA,EAEJ;AACF;AACA,gBAAgB,cAAc;AAE9B,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,IAAI,aAAa,OAAO,0BAA0B;AAC9F,UAAM,OAAO,UAAU,OAAO;AAE9B,WACE,oBAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,+BAAC,QAAK,WAAW,WAAW,4BAA4B,SAAS,GAC/D;AAAA,0BAAC,UAAM,oBAAU,oBAAC,aAAW,UAAS,IAAe,UAAS;AAAA,MAC9D,oBAAC,QAAK,MAAK,gBAAe,MAAK,MAAK,WAAU,4BAA2B;AAAA,OAC3E,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,qBAAqB,MAAM;AAAA,EAC/B,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,iBAAiB;AACxC,+BAA2B;AAE3B,UAAM,EAAE,SAAS,WAAW,GAAG,aAAa,IAAI,aAAa,OAAO,0BAA0B;AAC9F,UAAM,OAAO,UAAU,OAAO;AAE9B,WACE,oBAAC,qBAAqB,SAArB,EAA8B,GAAG,cAAc,KAAK,cAAc,SAAO,MACxE,8BAAC,QAAK,WAAW,WAAW,4BAA4B,SAAS,GAC9D,oBAAU,oBAAC,aAAW,UAAS,IAAe,UACjD,GACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAEjC,MAAM,cAGF,OAAO,OAAO,iBAAiB;AAAA,EACjC,SAAS;AAAA,EACT,SAAS;AACX,CAAC;",
   "names": []
 }