fix(bar): use readonly arrays for props as the library does not modif…

packages/annotations/src/compute.ts

@@ -28,8 +28,8 @@ export const bindAnnotations = <
     getPosition,
     getDimensions,
 }: {
-    data: Datum[]
-    annotations: AnnotationMatcher<Datum>[]
+    data: readonly Datum[]
+    annotations: readonly AnnotationMatcher<Datum>[]
     getPosition: AnnotationPositionGetter<Datum>
     getDimensions: AnnotationDimensionsGetter<Datum>
 }): BoundAnnotation<Datum>[] =>

packages/annotations/src/hooks.ts

@@ -16,8 +16,8 @@ export const useAnnotations = <Datum>({
     getPosition,
     getDimensions,
 }: {
-    data: Datum[]
-    annotations: AnnotationMatcher<Datum>[]
+    data: readonly Datum[]
+    annotations: readonly AnnotationMatcher<Datum>[]
     getPosition: AnnotationPositionGetter<Datum>
     getDimensions: AnnotationDimensionsGetter<Datum>
 }) =>
@@ -35,7 +35,7 @@ export const useAnnotations = <Datum>({
 export const useComputedAnnotations = <Datum>({
     annotations,
 }: {
-    annotations: BoundAnnotation<Datum>[]
+    annotations: readonly BoundAnnotation<Datum>[]
 }) =>
     useMemo(
         () =>

packages/bar/src/Bar.tsx

@@ -58,7 +58,7 @@ const InnerBar = <RawDatum extends BarDatum>({
     gridXValues,
     gridYValues,
 
-    layers = svgDefaultProps.layers as BarLayer<RawDatum>[],
+    layers = svgDefaultProps.layers as readonly BarLayer<RawDatum>[],
     barComponent = svgDefaultProps.barComponent,
 
     enableLabel = svgDefaultProps.enableLabel,

packages/bar/src/compute/common.ts

@@ -4,7 +4,7 @@ import { ScaleBandSpec, ScaleBand, computeScale } from '@nivo/scales'
  * Generates indexed scale.
  */
 export const getIndexScale = <RawDatum>(
-    data: RawDatum[],
+    data: readonly RawDatum[],
     getIndex: (datum: RawDatum) => string,
     padding: number,
     indexScale: ScaleBandSpec,
@@ -24,7 +24,7 @@ export const getIndexScale = <RawDatum>(
 /**
  * This method ensures all the provided keys exist in the entire series.
  */
-export const normalizeData = <RawDatum>(data: RawDatum[], keys: string[]) =>
+export const normalizeData = <RawDatum>(data: readonly RawDatum[], keys: readonly string[]) =>
     data.map(
         item =>
             ({

packages/bar/src/compute/grouped.ts

@@ -5,7 +5,7 @@ import { BarDatum, BarSvgProps, ComputedBarDatum, ComputedDatum } from '../types
 import { coerceValue, filterNullValues, getIndexScale, normalizeData } from './common'
 
 type Params<RawDatum, XScaleInput, YScaleInput> = {
-    data: RawDatum[]
+    data: readonly RawDatum[]
     formatValue: (value: number) => string
     getColor: OrdinalColorScale<ComputedDatum<RawDatum>>
     getIndex: (datum: RawDatum) => string
@@ -186,7 +186,7 @@ export const generateGroupedBars = <RawDatum extends BarDatum>({
     getIndex: (datum: RawDatum) => string
     getTooltipLabel: (datum: ComputedDatum<RawDatum>) => string
     margin: Margin
-    hiddenIds?: (string | number)[]
+    hiddenIds?: readonly (string | number)[]
 }) => {
     const keys = props.keys.filter(key => !hiddenIds.includes(key))
     const data = normalizeData(props.data, keys)

packages/bar/src/compute/stacked.ts

@@ -179,7 +179,7 @@ export const generateStackedBars = <RawDatum extends BarDatum>({
     getIndex: (datum: RawDatum) => string
     getTooltipLabel: (datum: ComputedDatum<RawDatum>) => string
     margin: Margin
-    hiddenIds?: (string | number)[]
+    hiddenIds?: readonly (string | number)[]
 }) => {
     const keys = props.keys.filter(key => !hiddenIds.includes(key))
     const stackedData = stack<RawDatum, string>().keys(keys).offset(stackOffsetDiverging)(

packages/bar/src/types.ts

@@ -22,7 +22,7 @@ export interface BarDatum {
 }
 
 export interface DataProps<RawDatum extends BarDatum> {
-    data: RawDatum[]
+    data: readonly RawDatum[]
 }
 
 export type BarDatumWithColor = BarDatum & {
@@ -109,8 +109,8 @@ interface BarCustomLayerBaseProps<RawDatum>
             | 'tooltip'
         >,
         Dimensions {
-    bars: ComputedBarDatum<RawDatum>[]
-    legendData: [BarLegendProps, LegendData[]][]
+    bars: readonly ComputedBarDatum<RawDatum>[]
+    legendData: [BarLegendProps, readonly LegendData[]][]
 
     margin: Margin
     innerWidth: number
@@ -208,7 +208,7 @@ export type BarHandlers<RawDatum, Element> = {
 
 export type BarCommonProps<RawDatum> = {
     indexBy: PropertyAccessor<RawDatum, string>
-    keys: string[]
+    keys: readonly string[]
 
     maxValue: 'auto' | number
     minValue: 'auto' | number
@@ -253,12 +253,12 @@ export type BarCommonProps<RawDatum> = {
     colors: OrdinalColorScaleConfig<ComputedDatum<RawDatum>>
     theme: Theme
 
-    annotations: AnnotationMatcher<ComputedBarDatum<RawDatum>>[]
-    legends: BarLegendProps[]
+    annotations: readonly AnnotationMatcher<ComputedBarDatum<RawDatum>>[]
+    legends: readonly BarLegendProps[]
 
     renderWrapper?: boolean
 
-    initialHiddenIds: (string | number)[]
+    initialHiddenIds: readonly (string | number)[]
 }
 
 export type BarSvgProps<RawDatum extends BarDatum> = Partial<BarCommonProps<RawDatum>> &
@@ -275,9 +275,9 @@ export type BarSvgProps<RawDatum extends BarDatum> = Partial<BarCommonProps<RawD
 
         barComponent: React.FC<BarItemProps<RawDatum>>
 
-        markers: CartesianMarkerProps[]
+        markers: readonly CartesianMarkerProps[]
 
-        layers: BarLayer<RawDatum>[]
+        layers: readonly BarLayer<RawDatum>[]
 
         role: string
         ariaLabel?: React.AriaAttributes['aria-label']
@@ -310,6 +310,6 @@ export type BarCanvasProps<RawDatum extends BarDatum> = Partial<BarCommonProps<R
     }>
 
 export type BarAnnotationsProps<RawDatum> = {
-    annotations: AnnotationMatcher<ComputedBarDatum<RawDatum>>[]
-    bars: ComputedBarDatum<RawDatum>[]
+    annotations: readonly AnnotationMatcher<ComputedBarDatum<RawDatum>>[]
+    bars: readonly ComputedBarDatum<RawDatum>[]
 }