diff --git a/docs/pages/base-ui/api/use-select.json b/docs/pages/base-ui/api/use-select.json index 51f573b1423e3b..7039d1053f4cd4 100644 --- a/docs/pages/base-ui/api/use-select.json +++ b/docs/pages/base-ui/api/use-select.json @@ -58,8 +58,8 @@ "open": { "type": { "name": "boolean", "description": "boolean" } }, "options": { "type": { - "name": "SelectOptionDefinition<OptionValue>[]", - "description": "SelectOptionDefinition<OptionValue>[]" + "name": "ReadonlyArray<SelectOptionDefinition<OptionValue>>", + "description": "ReadonlyArray<SelectOptionDefinition<OptionValue>>" } }, "required": { "type": { "name": "boolean", "description": "boolean" } }, diff --git a/docs/pages/base-ui/api/use-slider.json b/docs/pages/base-ui/api/use-slider.json index 810000f851844c..80574b4b450bda 100644 --- a/docs/pages/base-ui/api/use-slider.json +++ b/docs/pages/base-ui/api/use-slider.json @@ -1,12 +1,20 @@ { "parameters": { "aria-labelledby": { "type": { "name": "string", "description": "string" } }, - "defaultValue": { "type": { "name": "number | number[]", "description": "number | number[]" } }, + "defaultValue": { + "type": { + "name": "number | ReadonlyArray<number>", + "description": "number | ReadonlyArray<number>" + } + }, "disabled": { "type": { "name": "boolean", "description": "boolean" }, "default": "false" }, "disableSwap": { "type": { "name": "boolean", "description": "boolean" }, "default": "false" }, "isRtl": { "type": { "name": "boolean", "description": "boolean" }, "default": "false" }, "marks": { - "type": { "name": "boolean | Mark[]", "description": "boolean | Mark[]" }, + "type": { + "name": "boolean | ReadonlyArray<Mark>", + "description": "boolean | ReadonlyArray<Mark>" + }, "default": "false" }, "max": { "type": { "name": "number", "description": "number" }, "default": "100" }, @@ -44,7 +52,12 @@ "shiftStep": { "type": { "name": "number", "description": "number" }, "default": "10" }, "step": { "type": { "name": "number | null", "description": "number | null" }, "default": "1" }, "tabIndex": { "type": { "name": "number", "description": "number" } }, - "value": { "type": { "name": "number | number[]", "description": "number | number[]" } } + "value": { + "type": { + "name": "number | ReadonlyArray<number>", + "description": "number | ReadonlyArray<number>" + } + } }, "returnValue": { "active": { "type": { "name": "number", "description": "number" }, "required": true }, diff --git a/packages/mui-base/src/FocusTrap/FocusTrap.tsx b/packages/mui-base/src/FocusTrap/FocusTrap.tsx index 95b7ef816aef45..68803e9080e62d 100644 --- a/packages/mui-base/src/FocusTrap/FocusTrap.tsx +++ b/packages/mui-base/src/FocusTrap/FocusTrap.tsx @@ -278,7 +278,7 @@ function FocusTrap(props: FocusTrapProps): JSX.Element { return; } - let tabbable: string[] | HTMLElement[] = []; + let tabbable: ReadonlyArray | HTMLElement[] = []; if ( doc.activeElement === sentinelStart.current || doc.activeElement === sentinelEnd.current diff --git a/packages/mui-base/src/FocusTrap/FocusTrap.types.ts b/packages/mui-base/src/FocusTrap/FocusTrap.types.ts index 90a746233ea97e..70c6861eeaf4f7 100644 --- a/packages/mui-base/src/FocusTrap/FocusTrap.types.ts +++ b/packages/mui-base/src/FocusTrap/FocusTrap.types.ts @@ -10,7 +10,7 @@ export interface FocusTrapProps { * For instance, you can provide the "tabbable" npm dependency. * @param {HTMLElement} root */ - getTabbable?: (root: HTMLElement) => string[]; + getTabbable?: (root: HTMLElement) => ReadonlyArray; /** * This prop extends the `open` prop. * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop. diff --git a/packages/mui-base/src/useSelect/useSelect.types.ts b/packages/mui-base/src/useSelect/useSelect.types.ts index 4eac9199280cbd..c76160baccccee 100644 --- a/packages/mui-base/src/useSelect/useSelect.types.ts +++ b/packages/mui-base/src/useSelect/useSelect.types.ts @@ -102,7 +102,7 @@ export interface UseSelectParameters[]; + options?: ReadonlyArray>; /** * A function to convert the currently selected value to a string. * Used to set a value of a hidden input associated with the select, diff --git a/packages/mui-base/src/useSlider/useSlider.ts b/packages/mui-base/src/useSlider/useSlider.ts index 6f2d352302a98d..7739bab422238c 100644 --- a/packages/mui-base/src/useSlider/useSlider.ts +++ b/packages/mui-base/src/useSlider/useSlider.ts @@ -136,8 +136,8 @@ function focusThumb({ } function areValuesEqual( - newValue: number | Array, - oldValue: number | Array, + newValue: number | ReadonlyArray, + oldValue: number | ReadonlyArray, ): boolean { if (typeof newValue === 'number' && typeof oldValue === 'number') { return newValue === oldValue; diff --git a/packages/mui-base/src/useSlider/useSlider.types.ts b/packages/mui-base/src/useSlider/useSlider.types.ts index 39e6af36e1aeaf..d2992f27eaf1d5 100644 --- a/packages/mui-base/src/useSlider/useSlider.types.ts +++ b/packages/mui-base/src/useSlider/useSlider.types.ts @@ -8,7 +8,7 @@ export interface UseSliderParameters { /** * The default value. Use when the component is not controlled. */ - defaultValue?: number | number[]; + defaultValue?: number | ReadonlyArray; /** * If `true`, the component is disabled. * @default false @@ -30,7 +30,7 @@ export interface UseSliderParameters { * If an array, it should contain objects with `value` and an optional `label` keys. * @default false */ - marks?: boolean | Mark[]; + marks?: boolean | ReadonlyArray; /** * The maximum allowed value of the slider. * Should not be equal to min. @@ -104,7 +104,7 @@ export interface UseSliderParameters { * The value of the slider. * For ranged sliders, provide an array with two values. */ - value?: number | number[]; + value?: number | ReadonlyArray; } export interface Mark { diff --git a/packages/mui-base/src/utils/areArraysEqual.ts b/packages/mui-base/src/utils/areArraysEqual.ts index 2f9cff4aae28ae..e4791eb48627b1 100644 --- a/packages/mui-base/src/utils/areArraysEqual.ts +++ b/packages/mui-base/src/utils/areArraysEqual.ts @@ -1,8 +1,8 @@ type ItemComparer = (a: Item, b: Item) => boolean; export function areArraysEqual( - array1: Item[], - array2: Item[], + array1: ReadonlyArray, + array2: ReadonlyArray, itemComparer: ItemComparer = (a, b) => a === b, ) { return (