@coinbase/cds-web-visualization 3.4.0-beta.13 → 3.4.0-beta.14

package/CHANGELOG.md

@@ -8,6 +8,14 @@ All notable changes to this project will be documented in this file.
 
 <!-- template-start -->
 
+## 3.4.0-beta.14 (1/22/2026 PST)
+
+#### 🚀 Updates
+
+- Add chart Legend component. [[#302](https://github.com/coinbase/cds/pull/302)]
+- Add support for hideBeaconLabels in Scrubber. [[#302](https://github.com/coinbase/cds/pull/302)]
+- Add support for custom bar components. [[#302](https://github.com/coinbase/cds/pull/302)]
+
 ## 3.4.0-beta.13 (1/20/2026 PST)
 
 #### 🚀 Updates

package/dts/chart/CartesianChart.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type BoxBaseProps, type BoxProps } from '@coinbase/cds-web/layout';
 import { type ScrubberProviderProps } from './scrubber/ScrubberProvider';
-import { type AxisConfigProps, type ChartInset, type Series } from './utils';
+import { type AxisConfigProps, type ChartInset, type LegendPosition, type Series } from './utils';
 export type CartesianChartBaseProps = BoxBaseProps &
   Pick<ScrubberProviderProps, 'enableScrubbing' | 'onScrubberPositionChange'> & {
     /**
@@ -26,6 +26,23 @@ export type CartesianChartBaseProps = BoxBaseProps &
      * Inset around the entire chart (outside the axes).
      */
     inset?: number | Partial<ChartInset>;
+    /**
+     * Whether to show the legend or a custom legend element.
+     * - `true` renders the default Legend component
+     * - A React element renders that element as the legend
+     * - `false` or omitted hides the legend
+     */
+    legend?: boolean | React.ReactNode;
+    /**
+     * Position of the legend relative to the chart.
+     * @default 'bottom'
+     */
+    legendPosition?: LegendPosition;
+    /**
+     * Accessibility label for the legend group.
+     * @default 'Legend'
+     */
+    legendAccessibilityLabel?: string;
   };
 export type CartesianChartProps = Omit<BoxProps<'div'>, 'title'> &
   CartesianChartBaseProps & {

package/dts/chart/CartesianChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../src/chart/CartesianChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAI9E,OAAO,EAAO,KAAK,YAAY,EAAE,KAAK,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAGjF,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAE3F,OAAO,EAEL,KAAK,eAAe,EAEpB,KAAK,UAAU,EAUf,KAAK,MAAM,EAEZ,MAAM,SAAS,CAAC;AAYjB,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAChD,IAAI,CAAC,qBAAqB,EAAE,iBAAiB,GAAG,0BAA0B,CAAC,GAAG;IAC5E;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACvB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC,CAAC;IAC7C;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC;IAC1F;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;CACtC,CAAC;AAEJ,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,GAC9D,uBAAuB,GAAG;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE;QACX;;WAEG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;QACd;;WAEG;QACH,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE;QACP;;WAEG;QACH,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAC3B;;WAEG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;KAC7B,CAAC;CACH,CAAC;AAEJ,eAAO,MAAM,cAAc,mIA6U1B,CAAC"}
+{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../src/chart/CartesianChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAI9E,OAAO,EAAO,KAAK,YAAY,EAAE,KAAK,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAGjF,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAG3F,OAAO,EAEL,KAAK,eAAe,EAEpB,KAAK,UAAU,EAUf,KAAK,cAAc,EACnB,KAAK,MAAM,EAEZ,MAAM,SAAS,CAAC;AAYjB,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAChD,IAAI,CAAC,qBAAqB,EAAE,iBAAiB,GAAG,0BAA0B,CAAC,GAAG;IAC5E;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACvB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC,CAAC;IAC7C;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC;IAC1F;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;IACrC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC,SAAS,CAAC;IACnC;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC,CAAC;AAEJ,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,GAC9D,uBAAuB,GAAG;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE;QACX;;WAEG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;QACd;;WAEG;QACH,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE;QACP;;WAEG;QACH,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAC3B;;WAEG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;KAC7B,CAAC;CACH,CAAC;AAEJ,eAAO,MAAM,cAAc,mIA2X1B,CAAC"}

package/dts/chart/area/AreaChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AreaChart.d.ts","sourceRoot":"","sources":["../../../src/chart/area/AreaChart.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAS,KAAK,UAAU,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EACL,KAAK,eAAe,EAIpB,KAAK,MAAM,EACZ,MAAM,UAAU,CAAC;AAElB,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE9C,MAAM,MAAM,UAAU,GAAG,MAAM,GAC7B,OAAO,CACL,IAAI,CACF,SAAS,EACT,eAAe,GAAG,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,cAAc,GAAG,YAAY,CAC5F,CACF,GACD,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,eAAe,GAAG,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAC,CAAC,GAAG;IACjF;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC/B,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC1F,IAAI,CACF,SAAS,EACT,eAAe,GAAG,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,cAAc,GAAG,YAAY,CACnF,GACD,IAAI,CAAC,SAAS,EAAE,eAAe,GAAG,aAAa,CAAC,GAAG;IACjD;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC3B;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC9B;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;IAC9C;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE1D,eAAO,MAAM,SAAS,4JA8KrB,CAAC"}
+{"version":3,"file":"AreaChart.d.ts","sourceRoot":"","sources":["../../../src/chart/area/AreaChart.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAS,KAAK,UAAU,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EACL,KAAK,eAAe,EAIpB,KAAK,MAAM,EACZ,MAAM,UAAU,CAAC;AAElB,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE9C,MAAM,MAAM,UAAU,GAAG,MAAM,GAC7B,OAAO,CACL,IAAI,CACF,SAAS,EACT,eAAe,GAAG,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,cAAc,GAAG,YAAY,CAC5F,CACF,GACD,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,eAAe,GAAG,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAC,CAAC,GAAG;IACjF;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC/B,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC1F,IAAI,CACF,SAAS,EACT,eAAe,GAAG,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,cAAc,GAAG,YAAY,CACnF,GACD,IAAI,CAAC,SAAS,EAAE,eAAe,GAAG,aAAa,CAAC,GAAG;IACjD;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC3B;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC9B;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;IAC9C;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE1D,eAAO,MAAM,SAAS,4JAgLrB,CAAC"}

package/dts/chart/bar/Bar.d.ts

@@ -44,6 +44,10 @@ export type BarBaseProps = {
    * The y-axis data value for this bar.
    */
   dataY?: number | [number, number] | null;
+  /**
+   * The ID of the series this bar belongs to.
+   */
+  seriesId?: string;
   /**
    * Fill color for the bar.
    */

package/dts/chart/bar/Bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Bar.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/Bar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAMhD,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC;IACzC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,QAAQ,EAAE,cAAc,CAAC,GAAG;IAC/D;;OAEG;IACH,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAEvD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,GAAG,sCAkDf,CAAC"}
+{"version":3,"file":"Bar.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/Bar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAMhD,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC;IACzC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,QAAQ,EAAE,cAAc,CAAC,GAAG;IAC/D;;OAEG;IACH,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAEvD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,GAAG,sCAoDf,CAAC"}

package/dts/chart/bar/BarChart.d.ts

@@ -1,7 +1,8 @@
 import { type XAxisProps, type YAxisProps } from '../axis';
 import { type CartesianChartBaseProps, type CartesianChartProps } from '../CartesianChart';
-import { type AxisConfigProps, type Series } from '../utils';
+import { type AxisConfigProps } from '../utils';
 import { type BarPlotProps } from './BarPlot';
+import type { BarSeries } from './BarStack';
 export type BarChartBaseProps = Omit<CartesianChartBaseProps, 'xAxis' | 'yAxis' | 'series'> &
   Pick<
     BarPlotProps,
@@ -20,8 +21,9 @@ export type BarChartBaseProps = Omit<CartesianChartBaseProps, 'xAxis' | 'yAxis'
   > & {
     /**
      * Configuration objects that define how to visualize the data.
+     * Each series can optionally define its own BarComponent.
      */
-    series?: Array<Series>;
+    series?: Array<BarSeries>;
     /**
      * Whether to stack the areas on top of each other.
      * When true, each series builds cumulative values on top of the previous series.

package/dts/chart/bar/BarChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BarChart.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/BarChart.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAS,KAAK,UAAU,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,KAAK,eAAe,EAIpB,KAAK,MAAM,EACZ,MAAM,UAAU,CAAC;AAElB,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AAEvD,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GACzF,IAAI,CACF,YAAY,EACV,YAAY,GACZ,cAAc,GACd,aAAa,GACb,QAAQ,GACR,aAAa,GACb,cAAc,GACd,mBAAmB,GACnB,eAAe,GACf,UAAU,GACV,YAAY,GACZ,cAAc,GACd,YAAY,CACf,GAAG;IACF;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACvB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;IAC9C;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAC3C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE1D,eAAO,MAAM,QAAQ,2JA0HpB,CAAC"}
+{"version":3,"file":"BarChart.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/BarChart.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAS,KAAK,UAAU,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,KAAK,eAAe,EAAoD,MAAM,UAAU,CAAC;AAElG,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AACvD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GACzF,IAAI,CACF,YAAY,EACV,YAAY,GACZ,cAAc,GACd,aAAa,GACb,QAAQ,GACR,aAAa,GACb,cAAc,GACd,mBAAmB,GACnB,eAAe,GACf,UAAU,GACV,YAAY,GACZ,cAAc,GACd,YAAY,CACf,GAAG;IACF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC1B;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;IAC9C;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAC3C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE1D,eAAO,MAAM,QAAQ,2JA0HpB,CAAC"}

package/dts/chart/bar/BarStack.d.ts

@@ -2,7 +2,16 @@ import React from 'react';
 import type { Rect } from '@coinbase/cds-common';
 import type { Transition } from 'framer-motion';
 import type { ChartScaleFunction, Series } from '../utils';
-import { type BarProps } from './Bar';
+import { type BarComponent, type BarProps } from './Bar';
+/**
+ * Extended series type that includes bar-specific properties.
+ */
+export type BarSeries = Series & {
+  /**
+   * Custom component to render bars for this series.
+   */
+  BarComponent?: BarComponent;
+};
 export type BarStackBaseProps = Pick<
   BarProps,
   'BarComponent' | 'fillOpacity' | 'stroke' | 'strokeWidth' | 'borderRadius'
@@ -10,7 +19,7 @@ export type BarStackBaseProps = Pick<
   /**
    * Array of series configurations that belong to this stack.
    */
-  series: Series[];
+  series: BarSeries[];
   /**
    * The category index for this stack.
    */

package/dts/chart/bar/BarStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BarStack.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/BarStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGhD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAG3D,OAAO,EAA0B,KAAK,QAAQ,EAAE,MAAM,OAAO,CAAC;AAK9D,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,QAAQ,EACR,cAAc,GAAG,aAAa,GAAG,QAAQ,GAAG,aAAa,GAAG,cAAc,CAC3E,GAAG;IACF;;OAEG;IACH,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,MAAM,EAAE,kBAAkB,CAAC;IAC3B;;OAEG;IACH,IAAI,EAAE,IAAI,CAAC;IACX;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAAG;IAC9C;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,aAAa,EACb,GAAG,GAAG,OAAO,GAAG,eAAe,GAAG,cAAc,GAAG,YAAY,CAChE,GAAG;IACF;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC;AAEjE;;;GAGG;AACH,eAAO,MAAM,QAAQ,2CA+lBpB,CAAC"}
+{"version":3,"file":"BarStack.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/BarStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGhD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAG3D,OAAO,EAAO,KAAK,YAAY,EAAE,KAAK,QAAQ,EAAE,MAAM,OAAO,CAAC;AAK9D;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG;IAC/B;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,QAAQ,EACR,cAAc,GAAG,aAAa,GAAG,QAAQ,GAAG,aAAa,GAAG,cAAc,CAC3E,GAAG;IACF;;OAEG;IACH,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,MAAM,EAAE,kBAAkB,CAAC;IAC3B;;OAEG;IACH,IAAI,EAAE,IAAI,CAAC;IACX;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAAG;IAC9C;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,aAAa,EACb,GAAG,GAAG,OAAO,GAAG,eAAe,GAAG,cAAc,GAAG,YAAY,CAChE,GAAG;IACF;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC;AAEjE;;;GAGG;AACH,eAAO,MAAM,QAAQ,2CAgmBpB,CAAC"}

package/dts/chart/bar/DefaultBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultBar.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/DefaultBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAM7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,MAAM,MAAM,eAAe,GAAG,iBAAiB,GAAG;IAChD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,6CAyCtB,CAAC"}
+{"version":3,"file":"DefaultBar.d.ts","sourceRoot":"","sources":["../../../src/chart/bar/DefaultBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAM7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,MAAM,MAAM,eAAe,GAAG,iBAAiB,GAAG;IAChD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,6CA0CtB,CAAC"}

package/dts/chart/index.d.ts

@@ -4,6 +4,7 @@ export * from './bar/index';
 export * from './CartesianChart';
 export * from './ChartProvider';
 export * from './gradient/index';
+export * from './legend/index';
 export * from './line/index';
 export * from './Path';
 export * from './PeriodSelector';

package/dts/chart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/chart/index.ts"],"names":[],"mappings":"AACA,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/chart/index.ts"],"names":[],"mappings":"AACA,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC"}

package/dts/chart/legend/DefaultLegendEntry.d.ts

@@ -0,0 +1,21 @@
+import { type HStackDefaultElement, type HStackProps } from '@coinbase/cds-web/layout';
+import type { LegendEntryProps } from './Legend';
+export type DefaultLegendEntryProps = LegendEntryProps &
+  Omit<HStackProps<HStackDefaultElement>, 'children' | 'color'>;
+export declare const DefaultLegendEntry: import('react').MemoExoticComponent<
+  ({
+    seriesId,
+    label,
+    color,
+    shape,
+    ShapeComponent,
+    gap,
+    className,
+    classNames,
+    style,
+    styles,
+    testID,
+    ...props
+  }: DefaultLegendEntryProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=DefaultLegendEntry.d.ts.map

package/dts/chart/legend/DefaultLegendEntry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultLegendEntry.d.ts","sourceRoot":"","sources":["../../../src/chart/legend/DefaultLegendEntry.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAU,KAAK,oBAAoB,EAAE,KAAK,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAK/F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAMjD,MAAM,MAAM,uBAAuB,GAAG,gBAAgB,GACpD,IAAI,CAAC,WAAW,CAAC,oBAAoB,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAEhE,eAAO,MAAM,kBAAkB,uJAc1B,uBAAuB,6CAyB3B,CAAC"}

package/dts/chart/legend/DefaultLegendShape.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { type BoxProps } from '@coinbase/cds-web/layout';
+import type { LegendShapeProps } from './Legend';
+export type DefaultLegendShapeProps = LegendShapeProps &
+  Omit<BoxProps<'div'>, 'children' | 'color'>;
+export declare const DefaultLegendShape: React.NamedExoticComponent<DefaultLegendShapeProps>;
+//# sourceMappingURL=DefaultLegendShape.d.ts.map

package/dts/chart/legend/DefaultLegendShape.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultLegendShape.d.ts","sourceRoot":"","sources":["../../../src/chart/legend/DefaultLegendShape.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAK9D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AA2CjD,MAAM,MAAM,uBAAuB,GAAG,gBAAgB,GACpD,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;AAE9C,eAAO,MAAM,kBAAkB,qDAY9B,CAAC"}

package/dts/chart/legend/Legend.d.ts

@@ -0,0 +1,169 @@
+import { type BoxBaseProps, type BoxDefaultElement, type BoxProps } from '@coinbase/cds-web/layout';
+import type { LegendShape } from '../utils';
+export type LegendShapeProps = {
+  /**
+   * Color of the legend shape.
+   * @default 'var(--color-fgPrimary)'
+   */
+  color?: string;
+  /**
+   * Shape to display. Can be a preset shape or a custom ReactNode.
+   * @default 'circle'
+   */
+  shape?: LegendShape;
+  /**
+   * Custom class name for the shape element.
+   */
+  className?: string;
+  /**
+   * Custom styles for the shape element.
+   */
+  style?: React.CSSProperties;
+};
+export type LegendShapeComponent = React.FC<LegendShapeProps>;
+export type LegendEntryProps = {
+  /**
+   * Id of the series.
+   */
+  seriesId: string;
+  /**
+   * Label of the series.
+   * If a ReactNode is provided, it replaces the default Text component.
+   */
+  label: React.ReactNode;
+  /**
+   * Color of the series.
+   * @default 'var(--color-fgPrimary)'
+   */
+  color?: string;
+  /**
+   * Shape of the series.
+   */
+  shape?: LegendShape;
+  /**
+   * Custom component to render the legend shape.
+   * @default DefaultLegendShape
+   */
+  ShapeComponent?: LegendShapeComponent;
+  /**
+   * Custom class name for the root element.
+   */
+  className?: string;
+  /**
+   * Custom class names for the component parts.
+   */
+  classNames?: {
+    /**
+     * Custom class name for the root element.
+     */
+    root?: string;
+    /**
+     * Custom class name for the shape element.
+     */
+    shape?: string;
+    /**
+     * Custom class name for the label element.
+     * @note not applied when label is a ReactNode.
+     */
+    label?: string;
+  };
+  /**
+   * Custom styles for the root element.
+   */
+  style?: React.CSSProperties;
+  /**
+   * Custom styles for the component parts.
+   */
+  styles?: {
+    /**
+     * Custom styles for the root element.
+     */
+    root?: React.CSSProperties;
+    /**
+     * Custom styles for the shape element.
+     */
+    shape?: React.CSSProperties;
+    /**
+     * Custom styles for the label element.
+     * @note not applied when label is a ReactNode.
+     */
+    label?: React.CSSProperties;
+  };
+};
+export type LegendEntryComponent = React.FC<LegendEntryProps>;
+export type LegendBaseProps = Omit<BoxBaseProps, 'children'> & {
+  /**
+   * Array of series IDs to display in the legend.
+   * By default, all series will be displayed.
+   */
+  seriesIds?: string[];
+  /**
+   * Custom component to render each legend entry.
+   * @default DefaultLegendEntry
+   */
+  EntryComponent?: LegendEntryComponent;
+  /**
+   * Custom component to render the legend shape within each entry.
+   * Only used when EntryComponent is not provided or is DefaultLegendEntry.
+   * @default DefaultLegendShape
+   */
+  ShapeComponent?: LegendShapeComponent;
+  /**
+   * Accessibility label for the legend group.
+   * @default 'Legend'
+   */
+  accessibilityLabel?: string;
+};
+export type LegendProps = Omit<BoxProps<BoxDefaultElement>, 'children'> &
+  LegendBaseProps & {
+    /**
+     * Custom class names for the component parts.
+     */
+    classNames?: {
+      /**
+       * Custom class name for the root element.
+       */
+      root?: string;
+      /**
+       * Custom class name for each entry element.
+       */
+      entry?: string;
+      /**
+       * Custom class name for the shape element within each entry.
+       */
+      entryShape?: string;
+      /**
+       * Custom class name for the label element within each entry.
+       * @note not applied when label is a ReactNode.
+       */
+      entryLabel?: string;
+    };
+    /**
+     * Custom styles for the component parts.
+     */
+    styles?: {
+      /**
+       * Custom styles for the root element.
+       */
+      root?: React.CSSProperties;
+      /**
+       * Custom styles for each entry element.
+       */
+      entry?: React.CSSProperties;
+      /**
+       * Custom styles for the shape element within each entry.
+       */
+      entryShape?: React.CSSProperties;
+      /**
+       * Custom styles for the label element within each entry.
+       * @note not applied when label is a ReactNode.
+       */
+      entryLabel?: React.CSSProperties;
+    };
+  };
+export declare const Legend: import('react').MemoExoticComponent<
+  import('react').ForwardRefExoticComponent<
+    Omit<LegendProps, 'ref'> & import('react').RefAttributes<HTMLDivElement>
+  >
+>;
+//# sourceMappingURL=Legend.d.ts.map

package/dts/chart/legend/Legend.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Legend.d.ts","sourceRoot":"","sources":["../../../src/chart/legend/Legend.tsx"],"names":[],"mappings":"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"}

package/dts/chart/legend/index.d.ts

@@ -0,0 +1,4 @@
+export * from './DefaultLegendEntry';
+export * from './DefaultLegendShape';
+export * from './Legend';
+//# sourceMappingURL=index.d.ts.map

package/dts/chart/legend/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/chart/legend/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,UAAU,CAAC"}

package/dts/chart/line/LineChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../src/chart/line/LineChart.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,KAAK,eAAe,EAAoC,KAAK,MAAM,EAAE,MAAM,UAAU,CAAC;AAE/F,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE9C,MAAM,MAAM,UAAU,GAAG,MAAM,GAC7B,OAAO,CACL,IAAI,CACF,SAAS,EACP,OAAO,GACP,UAAU,GACV,UAAU,GACV,cAAc,GACd,MAAM,GACN,eAAe,GACf,eAAe,GACf,QAAQ,GACR,aAAa,GACb,eAAe,GACf,SAAS,GACT,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,cAAc,CACjB,CACF,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC1F,IAAI,CACF,SAAS,EACP,UAAU,GACV,UAAU,GACV,MAAM,GACN,eAAe,GACf,eAAe,GACf,OAAO,GACP,QAAQ,GACR,aAAa,GACb,eAAe,GACf,cAAc,GACd,YAAY,GACZ,cAAc,GACd,SAAS,CACZ,GAAG;IACF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;IAC9C;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE1D,eAAO,MAAM,SAAS,4JA0HrB,CAAC"}
+{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../src/chart/line/LineChart.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,KAAK,eAAe,EAAoC,KAAK,MAAM,EAAE,MAAM,UAAU,CAAC;AAE/F,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE9C,MAAM,MAAM,UAAU,GAAG,MAAM,GAC7B,OAAO,CACL,IAAI,CACF,SAAS,EACP,OAAO,GACP,UAAU,GACV,UAAU,GACV,cAAc,GACd,MAAM,GACN,eAAe,GACf,eAAe,GACf,QAAQ,GACR,aAAa,GACb,eAAe,GACf,SAAS,GACT,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,cAAc,CACjB,CACF,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC1F,IAAI,CACF,SAAS,EACP,UAAU,GACV,UAAU,GACV,MAAM,GACN,eAAe,GACf,eAAe,GACf,OAAO,GACP,QAAQ,GACR,aAAa,GACb,eAAe,GACf,cAAc,GACd,YAAY,GACZ,cAAc,GACd,SAAS,CACZ,GAAG;IACF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;IAC9C;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,UAAU,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE1D,eAAO,MAAM,SAAS,4JA6HrB,CAAC"}

package/dts/chart/scrubber/Scrubber.d.ts

@@ -125,6 +125,10 @@ export type ScrubberBaseProps = SharedProps &
      * By default, all series will be highlighted.
      */
     seriesIds?: string[];
+    /**
+     * Hides the beacon labels while keeping the line label visible (if provided).
+     */
+    hideBeaconLabels?: boolean;
     /**
      * Hides the scrubber line.
      * @note This hides Scrubber's ReferenceLine including the label.
@@ -225,6 +229,10 @@ export declare const Scrubber: React.MemoExoticComponent<
          * By default, all series will be highlighted.
          */
         seriesIds?: string[];
+        /**
+         * Hides the beacon labels while keeping the line label visible (if provided).
+         */
+        hideBeaconLabels?: boolean;
         /**
          * Hides the scrubber line.
          * @note This hides Scrubber's ReferenceLine including the label.

package/dts/chart/scrubber/Scrubber.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Scrubber.d.ts","sourceRoot":"","sources":["../../../src/chart/scrubber/Scrubber.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Scrubber.d.ts","sourceRoot":"","sources":["../../../src/chart/scrubber/Scrubber.tsx"],"names":[],"mappings":"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"}

package/dts/chart/utils/chart.d.ts

@@ -1,5 +1,17 @@
 import type { GradientDefinition } from './gradient';
 export declare const defaultStackId = 'DEFAULT_STACK_ID';
+/**
+ * Shape variants available for legend items.
+ */
+export type LegendShapeVariant = 'circle' | 'square' | 'squircle' | 'pill';
+/**
+ * Shape for legend items. Can be a preset variant or a custom ReactNode.
+ */
+export type LegendShape = LegendShapeVariant | React.ReactNode;
+/**
+ * Position of the legend relative to the chart.
+ */
+export type LegendPosition = 'top' | 'bottom' | 'left' | 'right';
 export type AxisBounds = {
   min: number;
   max: number;
@@ -50,6 +62,12 @@ export type Series = {
    * If not specified, the series will not be stacked.
    */
   stackId?: string;
+  /**
+   * Shape of the legend item for this series.
+   * Can be a preset shape variant or a custom ReactNode.
+   * @default 'circle'
+   */
+  legendShape?: LegendShape;
 };
 /**
  * Calculates the domain of a chart from series data.

package/dts/chart/utils/chart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/chart.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAErD,eAAO,MAAM,cAAc,qBAAqB,CAAC;AAEjD,MAAM,MAAM,UAAU,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;CACb,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GAAI,QAAQ,OAAO,CAAC,UAAU,CAAC,KAAG,MAAM,IAAI,UAChB,CAAC;AAEvD,MAAM,MAAM,MAAM,GAAG;IACnB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC;IAC7D;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,GACzB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EACZ,MAAM,MAAM,KACX,OAAO,CAAC,UAAU,CAoBpB,CAAC;AAcF;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAC/B,QAAQ,MAAM,EAAE,KACf,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,CA0E5C,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,GACtB,OAAO,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,KAC3D,KAAK,CAAC,MAAM,GAAG,IAAI,CAerB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EACZ,MAAM,MAAM,KACX,OAAO,CAAC,UAAU,CA2EpB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,UAK/B,CAAC;AAEF;;;;;GAKG;AACH;;;;;GAKG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC,EACpC,WAAW,UAAU,KACpB,UAuBF,CAAC"}
+{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/chart.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAErD,eAAO,MAAM,cAAc,qBAAqB,CAAC;AAEjD;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AAE3E;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,kBAAkB,GAAG,KAAK,CAAC,SAAS,CAAC;AAE/D;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAEjE,MAAM,MAAM,UAAU,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;CACb,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GAAI,QAAQ,OAAO,CAAC,UAAU,CAAC,KAAG,MAAM,IAAI,UAChB,CAAC;AAEvD,MAAM,MAAM,MAAM,GAAG;IACnB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC;IAC7D;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,GACzB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EACZ,MAAM,MAAM,KACX,OAAO,CAAC,UAAU,CAoBpB,CAAC;AAcF;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAC/B,QAAQ,MAAM,EAAE,KACf,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,CA0E5C,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,GACtB,OAAO,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,KAC3D,KAAK,CAAC,MAAM,GAAG,IAAI,CAerB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EACZ,MAAM,MAAM,KACX,OAAO,CAAC,UAAU,CA2EpB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,UAK/B,CAAC;AAEF;;;;;GAKG;AACH;;;;;GAKG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC,EACpC,WAAW,UAAU,KACpB,UAuBF,CAAC"}

package/esm/chart/CartesianChart.js

@@ -1,4 +1,4 @@
-const _excluded = ["series", "children", "animate", "xAxis", "yAxis", "inset", "enableScrubbing", "onScrubberPositionChange", "width", "height", "className", "classNames", "style", "styles"];
+const _excluded = ["series", "children", "animate", "xAxis", "yAxis", "inset", "enableScrubbing", "onScrubberPositionChange", "legend", "legendPosition", "legendAccessibilityLabel", "width", "height", "className", "classNames", "style", "styles", "accessibilityLabel"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -12,8 +12,9 @@ import { useDimensions } from '@coinbase/cds-web/hooks/useDimensions';
 import { Box } from '@coinbase/cds-web/layout';
 import { ScrubberProvider } from './scrubber/ScrubberProvider';
 import { CartesianChartProvider } from './ChartProvider';
+import { Legend } from './legend';
 import { defaultAxisId, defaultChartInset, getAxisConfig, getAxisDomain, getAxisRange, getAxisScale, getChartInset, getStackedSeriesData as calculateStackedSeriesData, useTotalAxisPadding } from './utils';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const focusStylesCss = "cds-focusStylesCss-f4oy7ru";
 export const CartesianChart = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) => {
   let {
@@ -25,12 +26,16 @@ export const CartesianChart = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, r
       inset,
       enableScrubbing,
       onScrubberPositionChange,
+      legend,
+      legendPosition = 'bottom',
+      legendAccessibilityLabel,
       width = '100%',
       height = '100%',
       className,
       classNames,
       style,
-      styles
+      styles,
+      accessibilityLabel
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
   const {
@@ -269,43 +274,70 @@ export const CartesianChart = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, r
   }), [series, getSeries, getStackedSeriesData, animate, chartWidth, chartHeight, getXAxis, getYAxis, getXScale, getYScale, chartRect, dataLength, registerAxis, unregisterAxis, getAxisBounds]);
   const rootClassNames = useMemo(() => cx(className, classNames === null || classNames === void 0 ? void 0 : classNames.root), [className, classNames]);
   const rootStyles = useMemo(() => _objectSpread(_objectSpread({}, style), styles === null || styles === void 0 ? void 0 : styles.root), [style, styles === null || styles === void 0 ? void 0 : styles.root]);
+  const legendElement = useMemo(() => {
+    if (!legend) return;
+    if (legend === true) {
+      const isHorizontal = legendPosition === 'top' || legendPosition === 'bottom';
+      const flexDirection = isHorizontal ? 'row' : 'column';
+      return /*#__PURE__*/_jsx(Legend, {
+        accessibilityLabel: legendAccessibilityLabel,
+        flexDirection: flexDirection
+      });
+    }
+    return legend;
+  }, [legend, legendAccessibilityLabel, legendPosition]);
+  const rootBoxProps = useMemo(() => _objectSpread({
+    className: rootClassNames,
+    height,
+    style: rootStyles,
+    width
+  }, props), [rootClassNames, height, rootStyles, width, props]);
+  const chartContent = /*#__PURE__*/_jsx(Box, {
+    ref: node => {
+      observe(node);
+    },
+    height: legend ? undefined : height,
+    style: {
+      flex: 1,
+      minHeight: 0,
+      minWidth: 0
+    },
+    width: legend ? undefined : width,
+    children: /*#__PURE__*/_jsx(Box, {
+      ref: node => {
+        const svgElement = node;
+        svgRef.current = svgElement;
+        // Forward the ref to the user
+        if (ref) {
+          if (typeof ref === 'function') {
+            ref(svgElement);
+          } else {
+            ref.current = svgElement;
+          }
+        }
+      },
+      accessibilityLabel: accessibilityLabel,
+      "aria-live": "polite",
+      as: "svg",
+      className: cx(enableScrubbing && focusStylesCss, classNames === null || classNames === void 0 ? void 0 : classNames.chart),
+      height: "100%",
+      style: styles === null || styles === void 0 ? void 0 : styles.chart,
+      tabIndex: enableScrubbing ? 0 : undefined,
+      width: "100%",
+      children: children
+    })
+  });
   return /*#__PURE__*/_jsx(CartesianChartProvider, {
     value: contextValue,
     children: /*#__PURE__*/_jsx(ScrubberProvider, {
       enableScrubbing: !!enableScrubbing,
       onScrubberPositionChange: onScrubberPositionChange,
       svgRef: svgRef,
-      children: /*#__PURE__*/_jsx(Box, _objectSpread(_objectSpread({
-        ref: node => {
-          observe(node);
-        },
-        className: rootClassNames,
-        height: height,
-        style: rootStyles,
-        width: width
-      }, props), {}, {
-        children: /*#__PURE__*/_jsx(Box, {
-          ref: node => {
-            const svgElement = node;
-            svgRef.current = svgElement;
-            // Forward the ref to the user
-            if (ref) {
-              if (typeof ref === 'function') {
-                ref(svgElement);
-              } else {
-                ref.current = svgElement;
-              }
-            }
-          },
-          "aria-live": "polite",
-          as: "svg",
-          className: cx(enableScrubbing && focusStylesCss, classNames === null || classNames === void 0 ? void 0 : classNames.chart),
-          height: "100%",
-          style: styles === null || styles === void 0 ? void 0 : styles.chart,
-          tabIndex: enableScrubbing ? 0 : undefined,
-          width: "100%",
-          children: children
-        })
+      children: legend ? /*#__PURE__*/_jsxs(Box, _objectSpread(_objectSpread({}, rootBoxProps), {}, {
+        flexDirection: legendPosition === 'top' || legendPosition === 'bottom' ? 'column' : 'row',
+        children: [(legendPosition === 'top' || legendPosition === 'left') && legendElement, chartContent, (legendPosition === 'bottom' || legendPosition === 'right') && legendElement]
+      })) : /*#__PURE__*/_jsx(Box, _objectSpread(_objectSpread({}, rootBoxProps), {}, {
+        children: chartContent
       }))
     })
   });

package/esm/chart/area/AreaChart.js

@@ -1,8 +1,8 @@
 const _excluded = ["series", "stacked", "AreaComponent", "curve", "fillOpacity", "type", "connectNulls", "transition", "LineComponent", "strokeWidth", "showXAxis", "showYAxis", "showLines", "lineType", "xAxis", "yAxis", "inset", "children"],
   _excluded2 = ["scaleType", "data", "categoryPadding", "domain", "domainLimit", "range"],
   _excluded3 = ["scaleType", "data", "categoryPadding", "domain", "domainLimit", "range", "id"],
-  _excluded4 = ["id", "data", "label", "color", "yAxisId", "opacity", "LineComponent", "stackId", "transition"],
-  _excluded5 = ["id", "data", "label", "color", "yAxisId", "fill", "fillOpacity", "stackId", "type", "lineType", "transition"];
+  _excluded4 = ["id", "data", "label", "color", "yAxisId", "opacity", "LineComponent", "stackId", "legendShape", "transition"],
+  _excluded5 = ["id", "data", "label", "color", "yAxisId", "fill", "fillOpacity", "stackId", "legendShape", "type", "lineType", "transition"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -131,6 +131,7 @@ export const AreaChart = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) =
           opacity,
           LineComponent,
           stackId,
+          legendShape,
           transition: seriesTransition
         } = _ref4,
         areaPropsFromSeries = _objectWithoutProperties(_ref4, _excluded4);
@@ -153,6 +154,7 @@ export const AreaChart = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) =
           fill,
           fillOpacity,
           stackId,
+          legendShape,
           type,
           // Area type (don't pass to Line)
           lineType: seriesLineType,

package/esm/chart/bar/Bar.js

@@ -23,6 +23,7 @@ export const Bar = /*#__PURE__*/memo(_ref => {
     originY,
     dataX,
     dataY,
+    seriesId,
     BarComponent = DefaultBar,
     fill = 'var(--color-fgPrimary)',
     fillOpacity = 1,
@@ -51,6 +52,7 @@ export const Bar = /*#__PURE__*/memo(_ref => {
     originY: effectiveOriginY,
     roundBottom: roundBottom,
     roundTop: roundTop,
+    seriesId: seriesId,
     stroke: stroke,
     strokeWidth: strokeWidth,
     transition: transition,

package/esm/chart/bar/BarStack.js

@@ -10,6 +10,11 @@ import { Bar } from './Bar';
 import { DefaultBarStack } from './DefaultBarStack';
 import { jsx as _jsx } from "react/jsx-runtime";
 const EPSILON = 1e-4;
+
+/**
+ * Extended series type that includes bar-specific properties.
+ */
+
 /**
  * BarStack component that renders a single stack of bars at a specific category index.
  * Handles the stacking logic for bars within a single category.
@@ -158,6 +163,7 @@ export const BarStack = /*#__PURE__*/memo(_ref => {
         // Check if the bar should be rounded based on the baseline, with an epsilon to handle floating-point rounding
         roundTop: roundBaseline || Math.abs(barTop - baseline) >= EPSILON,
         roundBottom: roundBaseline || Math.abs(barBottom - baseline) >= EPSILON,
+        BarComponent: s.BarComponent,
         shouldApplyGap
       });
     });
@@ -533,6 +539,7 @@ export const BarStack = /*#__PURE__*/memo(_ref => {
       originY: baseline,
       roundBottom: bar.roundBottom,
       roundTop: bar.roundTop,
+      seriesId: bar.seriesId,
       stroke: (_bar$stroke = bar.stroke) !== null && _bar$stroke !== void 0 ? _bar$stroke : defaultStroke,
       strokeWidth: (_bar$strokeWidth = bar.strokeWidth) !== null && _bar$strokeWidth !== void 0 ? _bar$strokeWidth : defaultStrokeWidth,
       transition: transition,

package/esm/chart/bar/DefaultBar.js

@@ -1,4 +1,4 @@
-const _excluded = ["x", "width", "borderRadius", "roundTop", "roundBottom", "originY", "d", "fill", "fillOpacity", "dataX", "dataY", "transition"];
+const _excluded = ["x", "width", "borderRadius", "roundTop", "roundBottom", "originY", "d", "fill", "fillOpacity", "dataX", "dataY", "seriesId", "transition"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -27,6 +27,7 @@ export const DefaultBar = /*#__PURE__*/memo(_ref => {
       fillOpacity = 1,
       dataX,
       dataY,
+      seriesId,
       transition
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);

package/esm/chart/index.js

@@ -5,6 +5,7 @@ export * from './bar/index';
 export * from './CartesianChart';
 export * from './ChartProvider';
 export * from './gradient/index';
+export * from './legend/index';
 export * from './line/index';
 export * from './Path';
 export * from './PeriodSelector';

package/esm/chart/legend/DefaultLegendEntry.css

@@ -0,0 +1 @@
+.cds-legendEntryCss-l16mq69f{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}

package/esm/chart/legend/DefaultLegendEntry.js

@@ -0,0 +1,50 @@
+const _excluded = ["seriesId", "label", "color", "shape", "ShapeComponent", "gap", "className", "classNames", "style", "styles", "testID"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import { memo } from 'react';
+import { cx } from '@coinbase/cds-web';
+import { HStack } from '@coinbase/cds-web/layout';
+import { Text } from '@coinbase/cds-web/typography';
+import { DefaultLegendShape } from './DefaultLegendShape';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const legendEntryCss = "cds-legendEntryCss-l16mq69f";
+export const DefaultLegendEntry = /*#__PURE__*/memo(_ref => {
+  let {
+      seriesId,
+      label,
+      color,
+      shape,
+      ShapeComponent = DefaultLegendShape,
+      gap = 1,
+      className,
+      classNames,
+      style,
+      styles,
+      testID
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_jsxs(HStack, _objectSpread(_objectSpread({
+    className: cx(legendEntryCss, className, classNames === null || classNames === void 0 ? void 0 : classNames.root),
+    "data-testid": testID,
+    gap: gap,
+    style: _objectSpread(_objectSpread({}, style), styles === null || styles === void 0 ? void 0 : styles.root)
+  }, props), {}, {
+    children: [/*#__PURE__*/_jsx(ShapeComponent, {
+      className: classNames === null || classNames === void 0 ? void 0 : classNames.shape,
+      color: color,
+      shape: shape,
+      style: styles === null || styles === void 0 ? void 0 : styles.shape
+    }), typeof label === 'string' ? /*#__PURE__*/_jsx(Text, {
+      className: classNames === null || classNames === void 0 ? void 0 : classNames.label,
+      font: "label1",
+      style: styles === null || styles === void 0 ? void 0 : styles.label,
+      children: label
+    }) : label]
+  }));
+});
+import "./DefaultLegendEntry.css";

package/esm/chart/legend/DefaultLegendShape.css

@@ -0,0 +1,5 @@
+.cds-containerCss-c18taxk5{width:10px;height:24px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
+.cds-pillCss-p17vg36s{width:6px;height:24px;border-radius:3px;}
+.cds-circleCss-cge4n06{width:10px;height:10px;border-radius:5px;}
+.cds-squareCss-s4trv9b{width:10px;height:10px;}
+.cds-squircleCss-s1e4cx3y{width:10px;height:10px;border-radius:2px;}

package/esm/chart/legend/DefaultLegendShape.js

@@ -0,0 +1,47 @@
+const _excluded = ["color", "shape", "className", "style"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import React, { memo } from 'react';
+import { cx } from '@coinbase/cds-web';
+import { Box } from '@coinbase/cds-web/layout';
+import { jsx as _jsx } from "react/jsx-runtime";
+const containerCss = "cds-containerCss-c18taxk5";
+const pillCss = "cds-pillCss-p17vg36s";
+const circleCss = "cds-circleCss-cge4n06";
+const squareCss = "cds-squareCss-s4trv9b";
+const squircleCss = "cds-squircleCss-s1e4cx3y";
+const stylesByVariant = {
+  pill: pillCss,
+  circle: circleCss,
+  square: squareCss,
+  squircle: squircleCss
+};
+const isVariantShape = shape => typeof shape === 'string' && shape in stylesByVariant;
+export const DefaultLegendShape = /*#__PURE__*/memo(_ref => {
+  let {
+      color = 'var(--color-fgPrimary)',
+      shape = 'circle',
+      className,
+      style
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  if (!isVariantShape(shape)) return shape;
+  const variantStyle = stylesByVariant[shape];
+  return /*#__PURE__*/_jsx(Box, _objectSpread(_objectSpread({
+    className: cx(containerCss, className),
+    style: style
+  }, props), {}, {
+    children: /*#__PURE__*/_jsx("span", {
+      className: variantStyle,
+      style: {
+        backgroundColor: color
+      }
+    })
+  }));
+});
+import "./DefaultLegendShape.css";

package/esm/chart/legend/Legend.js

@@ -0,0 +1,76 @@
+const _excluded = ["flexDirection", "justifyContent", "alignItems", "flexWrap", "columnGap", "rowGap", "seriesIds", "EntryComponent", "ShapeComponent", "accessibilityLabel", "className", "classNames", "style", "styles"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import { forwardRef, memo, useMemo } from 'react';
+import { Box } from '@coinbase/cds-web/layout';
+import { useCartesianChartContext } from '../ChartProvider';
+import { DefaultLegendEntry } from './DefaultLegendEntry';
+import { DefaultLegendShape } from './DefaultLegendShape';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Legend = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) => {
+  var _classNames$root;
+  let {
+      flexDirection = 'row',
+      justifyContent = 'center',
+      alignItems = flexDirection === 'row' ? 'center' : 'flex-start',
+      flexWrap = 'wrap',
+      columnGap = 2,
+      rowGap = 0.75,
+      seriesIds,
+      EntryComponent = DefaultLegendEntry,
+      ShapeComponent = DefaultLegendShape,
+      accessibilityLabel = 'Legend',
+      className,
+      classNames,
+      style,
+      styles
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  const {
+    series
+  } = useCartesianChartContext();
+  const filteredSeries = useMemo(() => {
+    if (seriesIds === undefined) return series;
+    return series.filter(s => seriesIds.includes(s.id));
+  }, [series, seriesIds]);
+  if (filteredSeries.length === 0) return;
+  return /*#__PURE__*/_jsx(Box, _objectSpread(_objectSpread({
+    ref: ref,
+    accessibilityLabel: accessibilityLabel,
+    alignItems: alignItems,
+    className: (_classNames$root = classNames === null || classNames === void 0 ? void 0 : classNames.root) !== null && _classNames$root !== void 0 ? _classNames$root : className,
+    columnGap: columnGap,
+    flexDirection: flexDirection,
+    flexWrap: flexWrap,
+    justifyContent: justifyContent,
+    role: "group",
+    rowGap: rowGap,
+    style: _objectSpread(_objectSpread({}, style), styles === null || styles === void 0 ? void 0 : styles.root)
+  }, props), {}, {
+    children: filteredSeries.map(s => {
+      var _s$label;
+      return /*#__PURE__*/_jsx(EntryComponent, {
+        ShapeComponent: ShapeComponent,
+        classNames: {
+          root: classNames === null || classNames === void 0 ? void 0 : classNames.entry,
+          shape: classNames === null || classNames === void 0 ? void 0 : classNames.entryShape,
+          label: classNames === null || classNames === void 0 ? void 0 : classNames.entryLabel
+        },
+        color: s.color,
+        label: (_s$label = s.label) !== null && _s$label !== void 0 ? _s$label : s.id,
+        seriesId: s.id,
+        shape: s.legendShape,
+        styles: {
+          root: styles === null || styles === void 0 ? void 0 : styles.entry,
+          shape: styles === null || styles === void 0 ? void 0 : styles.entryShape,
+          label: styles === null || styles === void 0 ? void 0 : styles.entryLabel
+        }
+      }, s.id);
+    })
+  }));
+}));

package/esm/chart/legend/index.js

@@ -0,0 +1,3 @@
+export * from './DefaultLegendEntry';
+export * from './DefaultLegendShape';
+export * from './Legend';

package/esm/chart/line/LineChart.js

@@ -1,7 +1,7 @@
 const _excluded = ["series", "showArea", "areaType", "type", "onPointClick", "LineComponent", "AreaComponent", "curve", "points", "strokeWidth", "strokeOpacity", "connectNulls", "transition", "opacity", "showXAxis", "showYAxis", "xAxis", "yAxis", "inset", "children"],
   _excluded2 = ["scaleType", "data", "categoryPadding", "domain", "domainLimit", "range"],
   _excluded3 = ["scaleType", "data", "categoryPadding", "domain", "domainLimit", "range", "id"],
-  _excluded4 = ["id", "data", "label", "color", "yAxisId"];
+  _excluded4 = ["id", "data", "label", "color", "yAxisId", "legendShape"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -51,7 +51,8 @@ export const LineChart = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) =
       color: s.color,
       yAxisId: s.yAxisId,
       stackId: s.stackId,
-      gradient: s.gradient
+      gradient: s.gradient,
+      legendShape: s.legendShape
     }));
   }, [series]);
 
@@ -108,7 +109,8 @@ export const LineChart = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) =
           data,
           label,
           color,
-          yAxisId
+          yAxisId,
+          legendShape
         } = _ref4,
         linePropsFromSeries = _objectWithoutProperties(_ref4, _excluded4);
       return /*#__PURE__*/_jsx(Line, _objectSpread({

package/esm/chart/scrubber/Scrubber.js

@@ -19,6 +19,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const Scrubber = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) => {
   let {
     seriesIds,
+    hideBeaconLabels,
     hideLine,
     label,
     accessibilityLabel,
@@ -180,7 +181,7 @@ export const Scrubber = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) =>
       style: styles === null || styles === void 0 ? void 0 : styles.beacon,
       testID: testID,
       transitions: beaconTransitions
-    }), beaconLabels.length > 0 && /*#__PURE__*/_jsx(ScrubberBeaconLabelGroup, {
+    }), !hideBeaconLabels && beaconLabels.length > 0 && /*#__PURE__*/_jsx(ScrubberBeaconLabelGroup, {
       BeaconLabelComponent: BeaconLabelComponent,
       labelFont: beaconLabelFont,
       labelHorizontalOffset: beaconLabelHorizontalOffset,

package/esm/chart/utils/chart.js

@@ -1,5 +1,18 @@
 import { stack as d3Stack, stackOffsetDiverging, stackOrderNone } from 'd3-shape';
 export const defaultStackId = 'DEFAULT_STACK_ID';
+
+/**
+ * Shape variants available for legend items.
+ */
+
+/**
+ * Shape for legend items. Can be a preset variant or a custom ReactNode.
+ */
+
+/**
+ * Position of the legend relative to the chart.
+ */
+
 /**
  * Type guard to check if bounds are complete with both min and max values.
  * @param bounds - The bounds to validate

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cds-web-visualization",
-  "version": "3.4.0-beta.13",
+  "version": "3.4.0-beta.14",
   "description": "Coinbase Design System - Web Sparkline",
   "repository": {
     "type": "git",
@@ -38,10 +38,10 @@
     "CHANGELOG"
   ],
   "peerDependencies": {
-    "@coinbase/cds-common": "^8.38.1",
+    "@coinbase/cds-common": "^8.38.6",
     "@coinbase/cds-lottie-files": "^3.3.4",
     "@coinbase/cds-utils": "^2.3.5",
-    "@coinbase/cds-web": "^8.38.1",
+    "@coinbase/cds-web": "^8.38.6",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },
@@ -58,10 +58,10 @@
     "@babel/preset-env": "^7.28.0",
     "@babel/preset-react": "^7.27.1",
     "@babel/preset-typescript": "^7.27.1",
-    "@coinbase/cds-common": "^8.38.1",
+    "@coinbase/cds-common": "^8.38.6",
     "@coinbase/cds-lottie-files": "^3.3.4",
     "@coinbase/cds-utils": "^2.3.5",
-    "@coinbase/cds-web": "^8.38.1",
+    "@coinbase/cds-web": "^8.38.6",
     "@linaria/core": "^3.0.0-beta.22",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1"