@adsgency_npm/adsgency-ads-ui 0.1.0-alpha.23 → 0.1.0-alpha.24

package/dist/index.cjs

@@ -48,6 +48,7 @@ __export(src_exports, {
   AdsAlertDialogTrigger: () => AdsAlertDialogTrigger,
   AdsAlertTitle: () => AlertTitle2,
   AdsBadge: () => AdsBadge,
+  AdsBarChart: () => AdsBarChart,
   AdsBreadcrumb: () => AdsBreadcrumb,
   AdsBreadcrumbEllipsis: () => AdsBreadcrumbEllipsis,
   AdsBreadcrumbItem: () => AdsBreadcrumbItem,
@@ -69,6 +70,7 @@ __export(src_exports, {
   AdsDatePicker: () => AdsDatePicker,
   AdsDateTimePicker: () => AdsDateTimePicker,
   AdsDialog: () => AdsDialog,
+  AdsDialogBody: () => AdsDialogBody,
   AdsDialogClose: () => AdsDialogClose,
   AdsDialogContent: () => AdsDialogContent,
   AdsDialogDescription: () => AdsDialogDescription,
@@ -124,6 +126,7 @@ __export(src_exports, {
   AdsPopoverTitle: () => AdsPopoverTitle,
   AdsPopoverTrigger: () => AdsPopoverTrigger,
   AdsProgress: () => AdsProgress,
+  AdsRadialProgressChart: () => AdsRadialProgressChart,
   AdsRadioGroup: () => AdsRadioGroup,
   AdsRadioGroupCardOption: () => AdsRadioGroupCardOption,
   AdsRadioGroupOption: () => AdsRadioGroupOption,
@@ -141,7 +144,9 @@ __export(src_exports, {
   AdsSeparator: () => AdsSeparator,
   AdsSkeleton: () => AdsSkeleton,
   AdsSlider: () => AdsSlider,
+  AdsSparklineChart: () => AdsSparklineChart,
   AdsSpinner: () => AdsSpinner,
+  AdsStackedBarChart: () => AdsStackedBarChart,
   AdsSwitch: () => AdsSwitch,
   AdsTable: () => AdsTable,
   AdsTableBody: () => AdsTableBody,
@@ -5869,14 +5874,328 @@ var AdsProgress = React46.forwardRef(
 );
 AdsProgress.displayName = "AdsProgress";
 
-// src/components/AdsSlider/index.tsx
+// src/components/AdsRadialProgressChart/index.tsx
+var import_recharts2 = require("recharts");
+
+// src/primitives/chart.tsx
+var React47 = __toESM(require("react"), 1);
+var import_recharts = require("recharts");
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var chartContext = React47.createContext(null);
+var ChartContainer = React47.forwardRef(
+  ({ children, className, config, height = 240, style, ...props }, ref) => {
+    const chartStyle = Object.entries(config).reduce((variables, [key, item]) => {
+      if (item.color) {
+        variables[`--color-${key}`] = item.color;
+      }
+      return variables;
+    }, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(chartContext.Provider, { value: config, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+      "div",
+      {
+        className: cn("relative w-full text-xs", className),
+        "data-slot": "chart",
+        ref,
+        style: { height, ...chartStyle, ...style },
+        ...props,
+        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_recharts.ResponsiveContainer, { height: "100%", width: "100%", children })
+      }
+    ) });
+  }
+);
+ChartContainer.displayName = "ChartContainer";
+
+// src/components/AdsRadialProgressChart/index.tsx
+var import_jsx_runtime54 = require("react/jsx-runtime");
+var DEFAULT_SIZE = 160;
+var DEFAULT_STROKE_WIDTH = 14;
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function AdsRadialProgressChart({
+  ariaLabel,
+  className,
+  color = "var(--primary)",
+  label,
+  max = 100,
+  size = DEFAULT_SIZE,
+  strokeWidth = DEFAULT_STROKE_WIDTH,
+  trackColor = "color-mix(in srgb, var(--primary) 20%, transparent)",
+  value
+}) {
+  const safeMax = Number.isFinite(max) && max > 0 ? max : 0;
+  const safeValue = Number.isFinite(value) && safeMax > 0 ? clamp(value, 0, safeMax) : 0;
+  const percentage = safeMax > 0 ? Math.round(safeValue / safeMax * 100) : 0;
+  const safeSize = Number.isFinite(size) && size > 0 ? size : DEFAULT_SIZE;
+  const safeStrokeWidth = clamp(
+    Number.isFinite(strokeWidth) && strokeWidth > 0 ? strokeWidth : DEFAULT_STROKE_WIDTH,
+    1,
+    safeSize / 2
+  );
+  const chartData = [{ value: safeValue }];
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
+    "div",
+    {
+      "aria-label": ariaLabel ?? `${percentage}%`,
+      className: cn(
+        "relative inline-grid place-items-center",
+        className
+      ),
+      "data-testid": "ads-radial-progress-chart",
+      role: "img",
+      style: {
+        "--ads-radial-chart-size": `${safeSize}px`,
+        height: safeSize,
+        width: safeSize
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+          ChartContainer,
+          {
+            "aria-hidden": "true",
+            className: "absolute inset-0",
+            config: { value: { color } },
+            height: "100%",
+            children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
+              import_recharts2.RadialBarChart,
+              {
+                accessibilityLayer: true,
+                data: chartData,
+                endAngle: -270,
+                innerRadius: safeSize / 2 - safeStrokeWidth,
+                outerRadius: safeSize / 2,
+                startAngle: 90,
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+                    import_recharts2.PolarAngleAxis,
+                    {
+                      axisLine: false,
+                      dataKey: "value",
+                      domain: [0, Math.max(safeMax, 1)],
+                      tick: false,
+                      type: "number"
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+                    import_recharts2.RadialBar,
+                    {
+                      background: { fill: trackColor },
+                      cornerRadius: safeStrokeWidth / 2,
+                      dataKey: "value",
+                      fill: "var(--color-value)",
+                      isAnimationActive: false
+                    }
+                  )
+                ]
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "pointer-events-none absolute inset-0 flex items-center justify-center text-center", children: label ?? `${percentage}%` })
+      ]
+    }
+  );
+}
+
+// src/components/AdsSparklineChart/index.tsx
+var import_recharts3 = require("recharts");
+var import_jsx_runtime55 = require("react/jsx-runtime");
+var DEFAULT_HEIGHT = 40;
+function getSafeHeight(height) {
+  return Number.isFinite(height) && height && height > 0 ? height : DEFAULT_HEIGHT;
+}
+function getSafeValue(value) {
+  return typeof value === "number" && Number.isFinite(value) ? Math.max(value, 0) : 0;
+}
+function AdsSparklineChart({
+  ariaLabel,
+  className,
+  color = "var(--chart-1)",
+  data,
+  dataKey,
+  height,
+  xKey
+}) {
+  const chartData = data.map((datum) => ({
+    ...datum,
+    [xKey]: datum[xKey],
+    [dataKey]: getSafeValue(datum[dataKey])
+  }));
+  const safeHeight = getSafeHeight(height);
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    "div",
+    {
+      "aria-label": ariaLabel ?? "Trend chart",
+      className: cn("w-full", className),
+      "data-testid": "ads-sparkline-chart",
+      role: "img",
+      style: { height: safeHeight },
+      children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ChartContainer,
+        {
+          "aria-hidden": "true",
+          className: "h-full",
+          config: { value: { color } },
+          height: "100%",
+          children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_recharts3.LineChart, { data: chartData, margin: { bottom: 1, left: 1, right: 1, top: 1 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_recharts3.XAxis, { dataKey: xKey, hide: true, type: "category" }),
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+              import_recharts3.Line,
+              {
+                activeDot: false,
+                dataKey,
+                dot: false,
+                isAnimationActive: false,
+                stroke: "var(--color-value)",
+                strokeWidth: 2,
+                type: "monotone"
+              }
+            )
+          ] })
+        }
+      )
+    }
+  );
+}
+
+// src/components/AdsStackedBarChart/index.tsx
 var React48 = __toESM(require("react"), 1);
+var import_jsx_runtime56 = require("react/jsx-runtime");
+var DEFAULT_HEIGHT2 = 20;
+var DEFAULT_SEGMENT_COLOR = "var(--chart-1)";
+function getSafeHeight2(height) {
+  return Number.isFinite(height) && height && height > 0 ? height : DEFAULT_HEIGHT2;
+}
+function formatPercentage(percentage) {
+  return `${Number(percentage.toFixed(2))}%`;
+}
+function AdsStackedBarChart({
+  ariaLabel,
+  className,
+  height,
+  segments
+}) {
+  const descriptionId = React48.useId();
+  const validSegments = segments.reduce((items, segment, index) => {
+    const value = Number.isFinite(segment.value) ? Math.max(segment.value, 0) : 0;
+    if (value > 0) {
+      items.push({
+        color: segment.color ?? DEFAULT_SEGMENT_COLOR,
+        label: segment.label ?? `Segment ${index + 1}`,
+        value
+      });
+    }
+    return items;
+  }, []);
+  const normalizationBase = validSegments.reduce(
+    (maximum, segment) => Math.max(maximum, segment.value),
+    0
+  );
+  const normalizedTotal = normalizationBase > 0 ? validSegments.reduce((sum, segment) => sum + segment.value / normalizationBase, 0) : 0;
+  const hasData = normalizedTotal > 0 && Number.isFinite(normalizedTotal);
+  const getPercentage = (value) => value / normalizationBase / normalizedTotal * 100;
+  const summary = hasData ? validSegments.map((segment) => `${segment.label}: ${formatPercentage(getPercentage(segment.value))}`).join(", ") : "No data";
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+    "div",
+    {
+      "aria-label": ariaLabel ?? summary,
+      "aria-describedby": ariaLabel ? descriptionId : void 0,
+      className: cn("overflow-hidden rounded-full bg-muted", className),
+      "data-testid": "ads-stacked-bar-chart",
+      role: "img",
+      style: { height: getSafeHeight2(height) },
+      children: [
+        ariaLabel && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "sr-only", id: descriptionId, children: summary }),
+        hasData && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { "aria-hidden": "true", className: "flex size-full", children: validSegments.map((segment, index) => {
+          const percentage = getPercentage(segment.value);
+          return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+            "div",
+            {
+              "data-testid": "ads-stacked-bar-chart-segment",
+              style: { backgroundColor: segment.color, width: `${percentage}%` }
+            },
+            `${segment.label}-${index}`
+          );
+        }) })
+      ]
+    }
+  );
+}
+
+// src/components/AdsBarChart/index.tsx
+var import_recharts4 = require("recharts");
+var import_jsx_runtime57 = require("react/jsx-runtime");
+var DEFAULT_HEIGHT3 = 160;
+var DEFAULT_HIGHLIGHT_COLOR = "var(--chart-2)";
+var DEFAULT_RADIUS = 4;
+function getSafeHeight3(height) {
+  return Number.isFinite(height) && height && height > 0 ? height : DEFAULT_HEIGHT3;
+}
+function getSafeRadius(radius) {
+  return Number.isFinite(radius) && radius !== void 0 && radius >= 0 ? radius : DEFAULT_RADIUS;
+}
+function getSafeValue2(value) {
+  return typeof value === "number" && Number.isFinite(value) ? Math.max(value, 0) : 0;
+}
+function AdsBarChart({
+  ariaLabel,
+  barRadius,
+  className,
+  color = "var(--chart-1)",
+  data,
+  dataKey,
+  height,
+  highlightColor,
+  highlightIndex,
+  xKey
+}) {
+  const chartData = data.map((datum) => ({
+    ...datum,
+    [xKey]: datum[xKey],
+    [dataKey]: getSafeValue2(datum[dataKey])
+  }));
+  const safeHeight = getSafeHeight3(height);
+  const safeRadius = getSafeRadius(barRadius);
+  const safeHighlightIndex = Number.isInteger(highlightIndex) ? highlightIndex : -1;
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    "div",
+    {
+      "aria-label": ariaLabel ?? "Bar chart",
+      className: cn("w-full", className),
+      "data-testid": "ads-bar-chart",
+      role: "img",
+      style: { height: safeHeight },
+      children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+        ChartContainer,
+        {
+          "aria-hidden": "true",
+          className: "h-full",
+          config: { value: { color } },
+          height: "100%",
+          children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_recharts4.BarChart, { data: chartData, margin: { bottom: 0, left: 0, right: 0, top: 0 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_recharts4.XAxis, { dataKey: xKey, hide: true, type: "category" }),
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_recharts4.Bar, { dataKey, fill: "var(--color-value)", isAnimationActive: false, radius: safeRadius, children: chartData.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+              import_recharts4.Cell,
+              {
+                fill: index === safeHighlightIndex ? highlightColor ?? DEFAULT_HIGHLIGHT_COLOR : "var(--color-value)"
+              },
+              index
+            )) })
+          ] })
+        }
+      )
+    }
+  );
+}
+
+// src/components/AdsSlider/index.tsx
+var React50 = __toESM(require("react"), 1);
 
 // src/primitives/slider.tsx
-var React47 = __toESM(require("react"), 1);
+var React49 = __toESM(require("react"), 1);
 var SliderPrimitive = __toESM(require("@radix-ui/react-slider"), 1);
-var import_jsx_runtime53 = require("react/jsx-runtime");
-var Slider = React47.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
+var import_jsx_runtime58 = require("react/jsx-runtime");
+var Slider = React49.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
   SliderPrimitive.Root,
   {
     ref,
@@ -5886,10 +6205,10 @@ var Slider = React47.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
     ),
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(SliderPrimitive.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-secondary", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(SliderPrimitive.Range, { className: "absolute h-full bg-primary" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(SliderPrimitive.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-secondary", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(SliderPrimitive.Range, { className: "absolute h-full bg-primary" }) }),
       Array.from({
         length: Array.isArray(props.value) ? props.value.length : Array.isArray(props.defaultValue) ? props.defaultValue.length : 1
-      }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+      }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
         SliderPrimitive.Thumb,
         {
           className: "block h-5 w-5 rounded-full border border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
@@ -5902,11 +6221,11 @@ var Slider = React47.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
 Slider.displayName = SliderPrimitive.Root.displayName;
 
 // src/components/AdsSlider/index.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var sliderBaseClassName = "py-1";
-var Slider2 = React48.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Slider, { className: cn(sliderBaseClassName, className), ref, ...props }));
+var Slider2 = React50.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Slider, { className: cn(sliderBaseClassName, className), ref, ...props }));
 Slider2.displayName = "Slider";
-var AdsSlider = React48.forwardRef(
+var AdsSlider = React50.forwardRef(
   ({
     className,
     descriptionPlacement = "above",
@@ -5921,12 +6240,12 @@ var AdsSlider = React48.forwardRef(
       helperText,
       id
     });
-    const helperNode = helperText ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(AdsFieldDescription, { id: description.helperId, children: helperText }) : null;
-    const errorNode = errorText ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(AdsFieldError, { id: description.errorId, children: errorText }) : null;
-    return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(AdsFieldItem, { children: [
-      label ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(AdsFieldLabel, { children: label }) : null,
+    const helperNode = helperText ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(AdsFieldDescription, { id: description.helperId, children: helperText }) : null;
+    const errorNode = errorText ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(AdsFieldError, { id: description.errorId, children: errorText }) : null;
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(AdsFieldItem, { children: [
+      label ? /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(AdsFieldLabel, { children: label }) : null,
       descriptionPlacement === "above" ? helperNode : null,
-      /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
         Slider2,
         {
           "aria-describedby": description.describedBy,
@@ -5943,13 +6262,13 @@ var AdsSlider = React48.forwardRef(
 AdsSlider.displayName = "AdsSlider";
 
 // src/components/AdsSwitch/index.tsx
-var React50 = __toESM(require("react"), 1);
+var React52 = __toESM(require("react"), 1);
 
 // src/primitives/switch.tsx
-var React49 = __toESM(require("react"), 1);
+var React51 = __toESM(require("react"), 1);
 var SwitchPrimitives = __toESM(require("@radix-ui/react-switch"), 1);
-var import_jsx_runtime55 = require("react/jsx-runtime");
-var Switch = React49.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+var import_jsx_runtime60 = require("react/jsx-runtime");
+var Switch = React51.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
   SwitchPrimitives.Root,
   {
     className: cn(
@@ -5958,7 +6277,7 @@ var Switch = React49.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
     ),
     ...props,
     ref,
-    children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
       SwitchPrimitives.Thumb,
       {
         className: cn(
@@ -5971,15 +6290,15 @@ var Switch = React49.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
 Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/components/AdsSwitch/index.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var switchBaseClassName = "h-6 w-11 border border-transparent bg-muted shadow-[0px_1px_2px_rgba(0,0,0,0.1)] focus-visible:ring-[3px] focus-visible:ring-[rgba(161,161,161,0.5)] focus-visible:ring-offset-0 data-[state=checked]:bg-primary data-[state=unchecked]:bg-muted";
-var Switch2 = React50.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Switch, { className: cn(switchBaseClassName, className), ref, ...props }));
+var Switch2 = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Switch, { className: cn(switchBaseClassName, className), ref, ...props }));
 Switch2.displayName = "Switch";
-var AdsSwitch = React50.forwardRef(({ className, description, id, label, switchClassName, wrapperClassName, ...props }, ref) => {
-  const generatedId = React50.useId();
+var AdsSwitch = React52.forwardRef(({ className, description, id, label, switchClassName, wrapperClassName, ...props }, ref) => {
+  const generatedId = React52.useId();
   const inputId = id ?? generatedId;
   if (!label) {
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
       Switch2,
       {
         className: cn(className, switchClassName),
@@ -5989,12 +6308,12 @@ var AdsSwitch = React50.forwardRef(({ className, description, id, label, switchC
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("label", { className: cn("block w-full cursor-pointer", wrapperClassName), htmlFor: inputId, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex w-full items-start gap-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5 pt-0.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "text-sm font-medium leading-5 text-foreground", children: label }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(AdsFieldDescription, { className: "text-sm leading-5", children: description }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("label", { className: cn("block w-full cursor-pointer", wrapperClassName), htmlFor: inputId, children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex w-full items-start gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5 pt-0.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "text-sm font-medium leading-5 text-foreground", children: label }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(AdsFieldDescription, { className: "text-sm leading-5", children: description }) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
       Switch2,
       {
         className: cn(className, switchClassName),
@@ -6008,14 +6327,14 @@ var AdsSwitch = React50.forwardRef(({ className, description, id, label, switchC
 AdsSwitch.displayName = "AdsSwitch";
 
 // src/components/AdsTabs/index.tsx
-var React52 = __toESM(require("react"), 1);
+var React54 = __toESM(require("react"), 1);
 
 // src/primitives/tabs.tsx
-var React51 = __toESM(require("react"), 1);
+var React53 = __toESM(require("react"), 1);
 var TabsPrimitive = __toESM(require("@radix-ui/react-tabs"), 1);
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var Tabs = TabsPrimitive.Root;
-var TabsList = React51.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+var TabsList = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
   TabsPrimitive.List,
   {
     className: cn("inline-flex items-center", className),
@@ -6024,7 +6343,7 @@ var TabsList = React51.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 TabsList.displayName = TabsPrimitive.List.displayName;
-var TabsTrigger = React51.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+var TabsTrigger = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
   TabsPrimitive.Trigger,
   {
     className: cn(
@@ -6036,7 +6355,7 @@ var TabsTrigger = React51.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React51.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+var TabsContent = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
   TabsPrimitive.Content,
   {
     className: cn("focus-visible:outline-none", className),
@@ -6047,9 +6366,9 @@ var TabsContent = React51.forwardRef(({ className, ...props }, ref) => /* @__PUR
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // src/components/AdsTabs/index.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 var AdsTabs = Tabs;
-var AdsTabsList = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+var AdsTabsList = React54.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
   TabsList,
   {
     className: cn(
@@ -6061,7 +6380,7 @@ var AdsTabsList = React52.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 AdsTabsList.displayName = "AdsTabsList";
-var AdsTabsTrigger = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+var AdsTabsTrigger = React54.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
   TabsTrigger,
   {
     className: cn(
@@ -6073,7 +6392,7 @@ var AdsTabsTrigger = React52.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 AdsTabsTrigger.displayName = "AdsTabsTrigger";
-var AdsTabsContent = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+var AdsTabsContent = React54.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
   TabsContent,
   {
     className: cn(
@@ -6087,13 +6406,13 @@ var AdsTabsContent = React52.forwardRef(({ className, ...props }, ref) => /* @__
 AdsTabsContent.displayName = "AdsTabsContent";
 
 // src/components/AdsToggle/index.tsx
-var React54 = __toESM(require("react"), 1);
+var React56 = __toESM(require("react"), 1);
 
 // src/primitives/toggle.tsx
-var React53 = __toESM(require("react"), 1);
+var React55 = __toESM(require("react"), 1);
 var TogglePrimitive = __toESM(require("@radix-ui/react-toggle"), 1);
-var import_jsx_runtime59 = require("react/jsx-runtime");
-var Toggle = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+var import_jsx_runtime64 = require("react/jsx-runtime");
+var Toggle = React55.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
   TogglePrimitive.Root,
   {
     className: cn(
@@ -6107,7 +6426,7 @@ var Toggle = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
 Toggle.displayName = TogglePrimitive.Root.displayName;
 
 // src/components/AdsToggle/index.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 var sizeClassName3 = {
   sm: "!h-8 px-[6px] text-sm",
   md: "!h-9 px-md text-sm",
@@ -6122,10 +6441,10 @@ var variantClassName = {
   default: "border border-transparent bg-transparent text-foreground shadow-none hover:bg-muted/70 data-[state=on]:bg-muted data-[state=on]:shadow-[0px_1px_1px_rgba(0,0,0,0.1)]",
   outline: "border border-border bg-transparent text-foreground shadow-none hover:bg-muted/70 data-[state=on]:border-transparent data-[state=on]:bg-muted data-[state=on]:shadow-[0px_1px_1px_rgba(0,0,0,0.1)]"
 };
-var AdsToggle = React54.forwardRef(({ children, className, size = "md", variant = "default", ...props }, ref) => {
-  const childCount = React54.Children.count(children);
-  const isIconOnly = childCount === 1 && React54.isValidElement(children);
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+var AdsToggle = React56.forwardRef(({ children, className, size = "md", variant = "default", ...props }, ref) => {
+  const childCount = React56.Children.count(children);
+  const isIconOnly = childCount === 1 && React56.isValidElement(children);
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     Toggle,
     {
       className: cn(
@@ -6144,13 +6463,13 @@ var AdsToggle = React54.forwardRef(({ children, className, size = "md", variant
 AdsToggle.displayName = "AdsToggle";
 
 // src/components/AdsToggleGroup/index.tsx
-var React56 = __toESM(require("react"), 1);
+var React58 = __toESM(require("react"), 1);
 
 // src/primitives/toggle-group.tsx
-var React55 = __toESM(require("react"), 1);
+var React57 = __toESM(require("react"), 1);
 var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"), 1);
-var import_jsx_runtime61 = require("react/jsx-runtime");
-var ToggleGroup = React55.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+var import_jsx_runtime66 = require("react/jsx-runtime");
+var ToggleGroup = React57.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
   ToggleGroupPrimitive.Root,
   {
     className: cn("inline-flex items-center justify-start", className),
@@ -6159,7 +6478,7 @@ var ToggleGroup = React55.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-var ToggleGroupItem = React55.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+var ToggleGroupItem = React57.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
   ToggleGroupPrimitive.Item,
   {
     className: cn(
@@ -6173,7 +6492,7 @@ var ToggleGroupItem = React55.forwardRef(({ className, ...props }, ref) => /* @_
 ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 
 // src/components/AdsToggleGroup/index.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 var sizeClassName4 = {
   sm: "h-8 min-w-7 px-[6px] text-sm",
   md: "h-9 min-w-[34px] px-md text-sm",
@@ -6183,8 +6502,8 @@ var variantClassName2 = {
   default: "border-transparent bg-transparent text-foreground hover:bg-muted/70 data-[state=on]:bg-muted data-[state=on]:shadow-[0px_1px_1px_rgba(0,0,0,0.1)]",
   outline: "border border-border bg-transparent text-foreground hover:bg-muted/70 data-[state=on]:border-transparent data-[state=on]:bg-muted data-[state=on]:shadow-[0px_1px_1px_rgba(0,0,0,0.1)]"
 };
-var AdsToggleGroupContext = React56.createContext(null);
-var AdsToggleGroup = React56.forwardRef(
+var AdsToggleGroupContext = React58.createContext(null);
+var AdsToggleGroup = React58.forwardRef(
   ({
     children,
     className,
@@ -6192,7 +6511,7 @@ var AdsToggleGroup = React56.forwardRef(
     size = "md",
     variant = "default",
     ...props
-  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(AdsToggleGroupContext.Provider, { value: { orientation, size, variant }, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(AdsToggleGroupContext.Provider, { value: { orientation, size, variant }, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     ToggleGroup,
     {
       className: cn(
@@ -6208,12 +6527,12 @@ var AdsToggleGroup = React56.forwardRef(
   ) })
 );
 AdsToggleGroup.displayName = "AdsToggleGroup";
-var AdsToggleGroupItem = React56.forwardRef(({ className, size, variant, ...props }, ref) => {
-  const context = React56.useContext(AdsToggleGroupContext);
+var AdsToggleGroupItem = React58.forwardRef(({ className, size, variant, ...props }, ref) => {
+  const context = React58.useContext(AdsToggleGroupContext);
   const resolvedOrientation = context?.orientation ?? "horizontal";
   const resolvedSize = size ?? context?.size ?? "md";
   const resolvedVariant = variant ?? context?.variant ?? "default";
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     ToggleGroupItem,
     {
       className: cn(
@@ -6231,10 +6550,10 @@ var AdsToggleGroupItem = React56.forwardRef(({ className, size, variant, ...prop
 AdsToggleGroupItem.displayName = "AdsToggleGroupItem";
 
 // src/components/AdsTextarea/index.tsx
-var React57 = __toESM(require("react"), 1);
-var import_jsx_runtime63 = require("react/jsx-runtime");
+var React59 = __toESM(require("react"), 1);
+var import_jsx_runtime68 = require("react/jsx-runtime");
 var textareaBaseClassName = "w-full rounded-radius-md border border-border bg-card px-md py-md text-base leading-6 shadow-[0px_1px_2px_rgba(0,0,0,0.1)] placeholder:text-[var(--muted-foreground)] focus-visible:border-border-focus focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-[rgba(161,161,161,0.5)] focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50";
-var AdsTextarea = React57.forwardRef(
+var AdsTextarea = React59.forwardRef(
   ({
     action,
     className,
@@ -6253,12 +6572,12 @@ var AdsTextarea = React57.forwardRef(
       helperText,
       id
     });
-    const helperNode = helperText ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(AdsFieldDescription, { id: description.helperId, children: helperText }) : null;
-    const errorNode = errorText ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(AdsFieldError, { id: description.errorId, children: errorText }) : null;
-    return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(AdsFieldItem, { children: [
-      label ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(AdsFieldLabel, { htmlFor: description.inputId, children: label }) : null,
+    const helperNode = helperText ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(AdsFieldDescription, { id: description.helperId, children: helperText }) : null;
+    const errorNode = errorText ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(AdsFieldError, { id: description.errorId, children: errorText }) : null;
+    return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(AdsFieldItem, { children: [
+      label ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(AdsFieldLabel, { htmlFor: description.inputId, children: label }) : null,
       descriptionPlacement === "above" ? helperNode : null,
-      /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
         Textarea,
         {
           "aria-describedby": description.describedBy,
@@ -6276,7 +6595,7 @@ var AdsTextarea = React57.forwardRef(
           ...props
         }
       ),
-      action ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "w-full [&>*]:w-full", children: action }) : null,
+      action ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { className: "w-full [&>*]:w-full", children: action }) : null,
       descriptionPlacement === "below" ? helperNode : null,
       errorNode
     ] });
@@ -6285,17 +6604,17 @@ var AdsTextarea = React57.forwardRef(
 AdsTextarea.displayName = "AdsTextarea";
 
 // src/components/AdsTooltip/index.tsx
-var React59 = __toESM(require("react"), 1);
+var React61 = __toESM(require("react"), 1);
 
 // src/primitives/tooltip.tsx
-var React58 = __toESM(require("react"), 1);
+var React60 = __toESM(require("react"), 1);
 var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime69 = require("react/jsx-runtime");
 var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
 var TooltipArrow = TooltipPrimitive.Arrow;
-var TooltipContent = React58.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(TooltipPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+var TooltipContent = React60.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(TooltipPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
   TooltipPrimitive.Content,
   {
     className: cn(
@@ -6310,12 +6629,12 @@ var TooltipContent = React58.forwardRef(({ className, sideOffset = 4, ...props }
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
 // src/components/AdsTooltip/index.tsx
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime70 = require("react/jsx-runtime");
 var tooltipContentClassName = "z-50 rounded-[6px] border-0 bg-[#844fff] px-3 py-2 text-sm font-normal leading-5 text-[#fdfdfd] shadow-[0px_8px_24px_rgba(0,0,0,0.22)]";
 var AdsTooltipProvider = TooltipProvider;
 var AdsTooltip = Tooltip;
 var AdsTooltipTrigger = TooltipTrigger;
-var AdsTooltipContent = React59.forwardRef(({ align = "center", className, sideOffset = 10, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+var AdsTooltipContent = React61.forwardRef(({ align = "center", className, sideOffset = 10, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
   TooltipContent,
   {
     align,
@@ -6326,7 +6645,7 @@ var AdsTooltipContent = React59.forwardRef(({ align = "center", className, sideO
   }
 ));
 AdsTooltipContent.displayName = "AdsTooltipContent";
-var AdsTooltipArrow = React59.forwardRef(({ className, height = 5, width = 10, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+var AdsTooltipArrow = React61.forwardRef(({ className, height = 5, width = 10, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
   TooltipArrow,
   {
     className: cn("fill-[#844fff]", className),
@@ -6339,10 +6658,10 @@ var AdsTooltipArrow = React59.forwardRef(({ className, height = 5, width = 10, .
 AdsTooltipArrow.displayName = "AdsTooltipArrow";
 
 // src/components/AdsToast/index.tsx
-var React60 = __toESM(require("react"), 1);
+var React62 = __toESM(require("react"), 1);
 var import_lucide_react16 = require("lucide-react");
 var import_sonner = require("sonner");
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime71 = require("react/jsx-runtime");
 var adsToastIconMap = {
   success: import_lucide_react16.CircleCheck,
   info: import_lucide_react16.Info,
@@ -6358,7 +6677,7 @@ function resolveToastIcon(intent, icon) {
     return null;
   }
   const Icon2 = adsToastIconMap[intent];
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     Icon2,
     {
       "aria-hidden": true,
@@ -6371,7 +6690,7 @@ function resolveToastIcon(intent, icon) {
     }
   );
 }
-var AdsToast = React60.forwardRef(
+var AdsToast = React62.forwardRef(
   ({
     action,
     className,
@@ -6382,7 +6701,7 @@ var AdsToast = React60.forwardRef(
     ...props
   }, ref) => {
     const resolvedIcon = resolveToastIcon(intent, icon);
-    return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
       "div",
       {
         className: cn(
@@ -6397,8 +6716,8 @@ var AdsToast = React60.forwardRef(
         ...props,
         children: [
           resolvedIcon,
-          /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
               "p",
               {
                 className: cn(
@@ -6408,7 +6727,7 @@ var AdsToast = React60.forwardRef(
                 children: title
               }
             ),
-            description ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+            description ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
               "p",
               {
                 className: cn(
@@ -6419,7 +6738,7 @@ var AdsToast = React60.forwardRef(
               }
             ) : null
           ] }),
-          action ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+          action ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
             AdsButton,
             {
               className: "shrink-0 rounded-radius-lg",
@@ -6445,7 +6764,7 @@ function AdsToaster({
   ...props
 }) {
   const { messages } = useAdsI18n();
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     import_sonner.Toaster,
     {
       closeButton: false,
@@ -6463,7 +6782,7 @@ function AdsToaster({
   );
 }
 function toStageNode(intent, title, options) {
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     AdsToast,
     {
       action: options?.action,
@@ -6477,7 +6796,7 @@ function toStageNode(intent, title, options) {
 function showAdsToast(intent, title, options) {
   const { action, description, icon, ...toastOptions } = options ?? {};
   return import_sonner.toast.custom(
-    (id) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+    (id) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
       AdsToast,
       {
         action: action ? {
@@ -6531,10 +6850,10 @@ var AdsToastManager = Object.assign(
 );
 
 // src/components/AdsDialog/index.tsx
-var React61 = __toESM(require("react"), 1);
+var React63 = __toESM(require("react"), 1);
 var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
 var import_lucide_react17 = require("lucide-react");
-var import_jsx_runtime67 = require("react/jsx-runtime");
+var import_jsx_runtime72 = require("react/jsx-runtime");
 var overlayClassName2 = "fixed inset-0 z-50 bg-black/80 backdrop-blur-[2px] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0";
 var contentClassName2 = "fixed left-1/2 top-1/2 z-50 flex max-h-[calc(100dvh-2rem)] w-[calc(100%-2rem)] max-w-[423px] -translate-x-1/2 -translate-y-1/2 flex-col gap-lg overflow-hidden rounded-radius-md border border-border bg-card p-xl shadow-[0px_4px_6px_-4px_rgba(0,0,0,0.1),0px_10px_15px_-3px_rgba(0,0,0,0.1)] duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]";
 var bodyClassName = "min-h-0 flex-1 overflow-y-auto overscroll-contain [scrollbar-gutter:stable]";
@@ -6542,7 +6861,7 @@ var closeButtonClassName = "absolute right-xl top-xl inline-flex h-6 w-6 items-c
 var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
 var DialogPortal = DialogPrimitive.Portal;
-var DialogOverlay = React61.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var DialogOverlay = React63.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
   DialogPrimitive.Overlay,
   {
     className: cn(overlayClassName2, className),
@@ -6551,7 +6870,7 @@ var DialogOverlay = React61.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DialogOverlay.displayName = "DialogOverlay";
-var DialogClose = React61.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var DialogClose = React63.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
   DialogPrimitive.Close,
   {
     className: cn(
@@ -6565,8 +6884,8 @@ var DialogClose = React61.forwardRef(({ className, ...props }, ref) => /* @__PUR
 DialogClose.displayName = "DialogClose";
 function flattenDialogChildren(children) {
   const nodes = [];
-  React61.Children.forEach(children, (child) => {
-    if (React61.isValidElement(child) && child.type === React61.Fragment) {
+  React63.Children.forEach(children, (child) => {
+    if (React63.isValidElement(child) && child.type === React63.Fragment) {
       nodes.push(...flattenDialogChildren(child.props.children));
       return;
     }
@@ -6575,10 +6894,10 @@ function flattenDialogChildren(children) {
   return nodes;
 }
 function isDialogSlotElement(child, component) {
-  return React61.isValidElement(child) && child.type === component;
+  return React63.isValidElement(child) && child.type === component;
 }
-var DialogBody = React61.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var DialogBody = React63.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     "div",
     {
       className: cn(bodyClassName, className),
@@ -6589,7 +6908,7 @@ var DialogBody = React61.forwardRef(
   )
 );
 DialogBody.displayName = "DialogBody";
-var DialogContent = React61.forwardRef(
+var DialogContent = React63.forwardRef(
   ({
     children,
     className,
@@ -6646,9 +6965,9 @@ var DialogContent = React61.forwardRef(
     const looseBodyNodes = bodyNodes.filter(
       (child) => !isDialogSlotElement(child, DialogBody)
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(NestedDismissableLayerProvider, { coordinator: parentLayer.coordinator, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(DialogPortal, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(DialogOverlay, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(NestedDismissableLayerProvider, { coordinator: parentLayer.coordinator, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(DialogPortal, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DialogOverlay, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
         DialogPrimitive.Content,
         {
           "data-slot": "ads-dialog-content",
@@ -6664,18 +6983,18 @@ var DialogContent = React61.forwardRef(
           ...props,
           children: [
             headerNode,
-            headerNode === null && generatedHeaderNodes.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(DialogHeader, { children: generatedHeaderNodes }) : null,
+            headerNode === null && generatedHeaderNodes.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DialogHeader, { children: generatedHeaderNodes }) : null,
             explicitBodyNodes.length > 0 ? explicitBodyNodes : null,
-            looseBodyNodes.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(DialogBody, { children: looseBodyNodes }) : null,
+            looseBodyNodes.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DialogBody, { children: looseBodyNodes }) : null,
             footerNode,
-            !hideCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
+            !hideCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
               DialogPrimitive.Close,
               {
                 "aria-label": resolvedCloseLabel,
                 className: cn(closeButtonClassName, adsTextColorClassName.card),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_lucide_react17.X, { "aria-hidden": true, className: "h-4 w-4" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("span", { className: "sr-only", children: resolvedCloseLabel })
+                  /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_lucide_react17.X, { "aria-hidden": true, className: "h-4 w-4" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "sr-only", children: resolvedCloseLabel })
                 ]
               }
             ) : null
@@ -6686,8 +7005,8 @@ var DialogContent = React61.forwardRef(
   }
 );
 DialogContent.displayName = "DialogContent";
-var DialogHeader = React61.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var DialogHeader = React63.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     "div",
     {
       "data-slot": "ads-dialog-header",
@@ -6698,8 +7017,8 @@ var DialogHeader = React61.forwardRef(
   )
 );
 DialogHeader.displayName = "DialogHeader";
-var DialogFooter = React61.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var DialogFooter = React63.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     "div",
     {
       "data-slot": "ads-dialog-footer",
@@ -6713,7 +7032,7 @@ var DialogFooter = React61.forwardRef(
   )
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React61.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var DialogTitle = React63.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
   DialogPrimitive.Title,
   {
     className: cn(
@@ -6726,7 +7045,7 @@ var DialogTitle = React61.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = "DialogTitle";
-var DialogDescription = React61.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+var DialogDescription = React63.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
   DialogPrimitive.Description,
   {
     className: cn("text-sm leading-5", adsTextColorClassName.muted, className),
@@ -6742,13 +7061,14 @@ var AdsDialogOverlay = DialogOverlay;
 var AdsDialogClose = DialogClose;
 var AdsDialogContent = DialogContent;
 var AdsDialogHeader = DialogHeader;
+var AdsDialogBody = DialogBody;
 var AdsDialogFooter = DialogFooter;
 var AdsDialogTitle = DialogTitle;
 var AdsDialogDescription = DialogDescription;
 
 // src/components/AdsMasonry/index.tsx
 var import_masonic = require("masonic");
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_jsx_runtime73 = require("react/jsx-runtime");
 var DEFAULT_COLUMN_WIDTH = 240;
 var DEFAULT_GAP = 16;
 var DEFAULT_ITEM_HEIGHT_ESTIMATE = 280;
@@ -6784,7 +7104,7 @@ function AdsMasonry({
       { length: loadingItemCount },
       (_, index) => index
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
       "div",
       {
         className: cn(
@@ -6796,20 +7116,20 @@ function AdsMasonry({
           const mediaHeight = LOADING_MEDIA_HEIGHT_PATTERN[index % LOADING_MEDIA_HEIGHT_PATTERN.length];
           const titleWidth = LOADING_TITLE_WIDTH_PATTERN[index % LOADING_TITLE_WIDTH_PATTERN.length];
           const bodyWidth = LOADING_BODY_WIDTH_PATTERN[index % LOADING_BODY_WIDTH_PATTERN.length];
-          return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
             "article",
             {
               className: "overflow-hidden rounded-radius-lg border border-border bg-card shadow-showcase",
               "data-slot": "ads-masonry-loading-card",
               "data-testid": "ads-masonry-loading-card",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
                   "div",
                   {
                     className: "border-b border-border/60 bg-surface-inset/50",
                     "data-slot": "ads-masonry-skeleton-preview",
                     "data-testid": "ads-masonry-skeleton-preview",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                    children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
                       AdsSkeleton,
                       {
                         className: cn("w-full rounded-none", classNames?.skeleton),
@@ -6820,10 +7140,10 @@ function AdsMasonry({
                     )
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "flex flex-col gap-4 p-lg", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "flex-1 space-y-2", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex flex-col gap-4 p-lg", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex items-start justify-between gap-3", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "flex-1 space-y-2", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
                         AdsSkeleton,
                         {
                           className: cn("h-3 w-16 rounded-full", classNames?.skeleton),
@@ -6831,7 +7151,7 @@ function AdsMasonry({
                           "data-testid": "ads-masonry-skeleton"
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
                         AdsSkeleton,
                         {
                           className: cn("h-6 rounded-full", classNames?.skeleton),
@@ -6841,7 +7161,7 @@ function AdsMasonry({
                         }
                       )
                     ] }),
-                    /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
                       AdsSkeleton,
                       {
                         className: cn("h-6 w-16 rounded-full", classNames?.skeleton),
@@ -6850,7 +7170,7 @@ function AdsMasonry({
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
                     AdsSkeleton,
                     {
                       className: cn("h-4 rounded-full", classNames?.skeleton),
@@ -6869,7 +7189,7 @@ function AdsMasonry({
     );
   }
   if (items.length === 0) {
-    return emptyState ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    return emptyState ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
       "div",
       {
         className: cn(rootClassName, classNames?.empty),
@@ -6878,7 +7198,7 @@ function AdsMasonry({
       }
     ) : null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
     import_masonic.Masonry,
     {
       className: rootClassName,
@@ -6890,7 +7210,7 @@ function AdsMasonry({
       maxColumnCount,
       onRender,
       overscanBy,
-      render: ({ data, index, width }) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+      render: ({ data, index, width }) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
         "div",
         {
           className: cn("pb-0", classNames?.item, itemClassName),
@@ -6990,6 +7310,7 @@ var designTokens = {
   AdsAlertDialogTrigger,
   AdsAlertTitle,
   AdsBadge,
+  AdsBarChart,
   AdsBreadcrumb,
   AdsBreadcrumbEllipsis,
   AdsBreadcrumbItem,
@@ -7011,6 +7332,7 @@ var designTokens = {
   AdsDatePicker,
   AdsDateTimePicker,
   AdsDialog,
+  AdsDialogBody,
   AdsDialogClose,
   AdsDialogContent,
   AdsDialogDescription,
@@ -7066,6 +7388,7 @@ var designTokens = {
   AdsPopoverTitle,
   AdsPopoverTrigger,
   AdsProgress,
+  AdsRadialProgressChart,
   AdsRadioGroup,
   AdsRadioGroupCardOption,
   AdsRadioGroupOption,
@@ -7083,7 +7406,9 @@ var designTokens = {
   AdsSeparator,
   AdsSkeleton,
   AdsSlider,
+  AdsSparklineChart,
   AdsSpinner,
+  AdsStackedBarChart,
   AdsSwitch,
   AdsTable,
   AdsTableBody,