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>[]
 }