[slider] Accept readonly array for the value prop

[pcorpet]

• I have followed (at least) the PR section of the contributing guide.

[mui-bot]

Netlify deploy preview

https://deploy-preview-47936--material-ui.netlify.app/

Bundle size report

Bundle	Parsed size	Gzip size
@mui/material	0B(0.00%)	0B(0.00%)
@mui/lab	0B(0.00%)	0B(0.00%)
@mui/system	0B(0.00%)	0B(0.00%)
@mui/utils	0B(0.00%)	0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against ecae658

[ZeeshanTamboli]

@pcorpet Codex tells to also do this change:

--- a/packages/mui-material/src/Slider/Slider.d.ts
+++ b/packages/mui-material/src/Slider/Slider.d.ts
@@ -369,7 +369,8 @@ declare const Slider: SliderType;
 export type SliderProps<
   RootComponent extends React.ElementType = SliderTypeMap['defaultComponent'],
   AdditionalProps = {},
-> = OverrideProps<SliderTypeMap<RootComponent, AdditionalProps>, RootComponent> & {
+  Value extends number | readonly number[] = number | number[],
+> = OverrideProps<SliderTypeMap<RootComponent, AdditionalProps, Value>, RootComponent> & {
   component?: React.ElementType | undefined;
 };

diff --git a/packages/mui-material/src/Slider/Slider.spec.tsx b/packages/mui-material/src/Slider/Slider.spec.tsx
index fca1838618..5205ee0440 100644
--- a/packages/mui-material/src/Slider/Slider.spec.tsx
+++ b/packages/mui-material/src/Slider/Slider.spec.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import Slider from '@mui/material/Slider';
+import type { SliderProps } from '@mui/material/Slider';

 function testOnChange() {
   function handleSliderChange(event: Event, value: unknown) {}
@@ -89,6 +90,13 @@ const values = [5, 10] as const;
   onChangeCommitted={(event, value: readonly number[]) => {}}
 />;

+const sliderProps: SliderProps<'span', {}, readonly number[]> = {
+  value: values,
+  onChange: (event, value: readonly number[]) => {},
+  onChangeCommitted: (event, value: readonly number[]) => {},
+};
+<Slider {...sliderProps} />;
+
 const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> =
   function CustomComponent() {
     return <div />;

Which I think makes sense. This is to add readonly value support in SliderProps as well.

What do you think?

[ZeeshanTamboli]

Looks good!

[github-actions]

Cherry-pick PRs will be created targeting branches: v7.x