@redsift/charts 8.0.0-alpha.8 → 8.0.1

package/{index.d.ts → dist/index.d.ts}

@@ -1,7 +1,7 @@
 import { BrushBehavior, ScaleLinear as ScaleLinear$1, ScaleOrdinal, Arc as Arc$1 } from 'd3';
 import * as _redsift_design_system from '@redsift/design-system';
 import { ValueOf, Comp, StylingProps } from '@redsift/design-system';
-import { MutableRefObject, ComponentProps, ReactElement, ReactNode } from 'react';
+import { MutableRefObject, ComponentProps, RefObject, ReactElement, ReactNode } from 'react';
 import { PieArcDatum } from 'd3-shape';
 import * as d3_scale from 'd3-scale';
 import { ScaleLinear as ScaleLinear$2, ScaleLogarithmic, ScaleSymLog, ScalePoint as ScalePoint$1, ScaleBand as ScaleBand$1, ScaleTime as ScaleTime$1 } from 'd3-scale';
@@ -162,7 +162,7 @@ interface UseColorProps {
     /** Name of the field that will be used to categorize the data. */
     category: string;
 }
-declare const useColor: ({ data, theme, category }: UseColorProps) => ScaleOrdinal<string, string, never> | undefined;
+declare const useColor: ({ data, theme, category }: UseColorProps) => ScaleOrdinal<string, string, never>;
 
 interface UseFormatCategoricalDataProps {
     /** Dataset to use to generate the chart, should be a list of objects containing a key and a value. */
@@ -176,7 +176,7 @@ interface UseFormatCategoricalDataProps {
 }
 declare const useFormatCategoricalData: ({ data, caping, others, theme, }: UseFormatCategoricalDataProps) => {
     data: CategoryData;
-    colorScale: d3_scale.ScaleOrdinal<string, string, never> | undefined;
+    colorScale: d3_scale.ScaleOrdinal<string, string, never>;
 };
 
 interface UseZoomProps {
@@ -188,9 +188,10 @@ interface UseZoomProps {
         x: number;
         y: number;
     };
+    size?: any;
     onZoom?: () => void;
 }
-declare const useZoom: ({ svgRef, scaleX, scaleY, defaultTransform, onZoom, }: UseZoomProps) => {
+declare const useZoom: ({ svgRef, scaleX, scaleY, defaultTransform, size, onZoom, }: UseZoomProps) => {
     transform: {
         k: number;
         x: number;
@@ -291,6 +292,8 @@ interface ArcsProps extends Omit<ComponentProps<'g'>, 'onClick' | 'role'>, Pick<
     arcs: Omit<ArcProps, 'ref'>[];
     /** Whether arcs have internal labels or not. */
     hasLabels?: boolean;
+    /** Native HTML props to forward to each slice. */
+    sliceProps?: Omit<ComponentProps<'g'>, 'onClick' | 'ref' | 'width'>;
 }
 type StyledArcsProps = Omit<ArcsProps, 'arcs'> & {};
 
@@ -395,6 +398,10 @@ declare const StyledBar: styled_components.StyledComponent<_redsift_design_syste
 interface ChartContainerProps extends Omit<ComponentProps<'div'>, 'title'>, StylingProps {
     /** Caption. */
     caption?: string;
+    /** Native HTML props to pass to the chart. */
+    chartProps?: ComponentProps<'div'>;
+    /** Ref to the chart. */
+    chartRef?: RefObject<HTMLDivElement>;
     /** Id. */
     id?: string;
     /** Method called when the Reset button is displayed (defines whether or not the button should be displayed). */
@@ -425,6 +432,8 @@ type BarChartDimensions = ChartDimensions & {
 interface BarChartProps extends ChartContainerProps {
     /** Whether the x axis labels are rotated or not. */
     areXLabelsRotated?: boolean;
+    /** Native HTML props to forward to each bar. */
+    barProps?: Omit<ComponentProps<'g'>, 'onClick' | 'orientation' | 'ref' | 'scale' | 'width'>;
     /** Number of categories to use, the rest being put into a new category called "Others". */
     caping?: number;
     /** Dataset to use to generate the chart, should be a list of objects containing a key and a value. */
@@ -580,6 +589,8 @@ interface PieChartProps extends ChartContainerProps {
     others?: boolean | string;
     /** PieChart size. */
     size?: ChartSize | PieChartDimensions;
+    /** Native HTML props to forward to each slice. */
+    sliceProps?: Omit<ComponentProps<'g'>, 'onClick' | 'ref' | 'width'>;
     /** Slice role. Used to indicate that slices are to be considered buttons or links. If an onClick is provided, the slices will have the role `button` unless specifically set to `link` with this prop. */
     sliceRole?: ArcProps['role'];
     /** Secondary text to be displayed in the middle of the chart, between the main text and subtext. Recommended to be used with donut variants only. */