diff --git a/striker-ui/components/Slider.tsx b/striker-ui/components/Slider.tsx index 2f4ce5ed..0991b528 100644 --- a/striker-ui/components/Slider.tsx +++ b/striker-ui/components/Slider.tsx @@ -25,7 +25,9 @@ type SliderOptionalProps = { isAllowTextInput?: boolean; labelId?: string; labelProps?: MUITypographyProps; - sliderProps?: MUISliderProps; + sliderProps?: Omit & { + onChange?: (value: number | number[]) => void; + }; }; type SliderProps = { @@ -149,33 +151,25 @@ const Slider = ({ valueLabelDisplay: sliderValueLabelDisplay, } = sliderProps ?? SLIDER_DEFAULT_PROPS.sliderProps; - const [sliderValue, setSliderValue] = useState(value); const [isFocused, setIsFocused] = useState(false); const handleLocalSliderBlur: SliderOnBlur = () => { setIsFocused(false); }; - const handleLocalSliderChange: SliderOnChange = (event, newValue) => { - setSliderValue(newValue); - }; - const handleLocalSliderFocus: SliderOnFocus = () => { setIsFocused(true); }; - const handleLocalTextInputChange: TextInputOnChange = ({ - target: { value: newValue }, - }) => { - setSliderValue(parseFloat(newValue)); + const handleSliderChange: SliderOnChange = (event, newValue) => { + sliderChangeCallback?.call(null, newValue); }; - const handleSliderChange = sliderChangeCallback - ? (...args: Parameters) => { - handleLocalSliderChange(...args); - sliderChangeCallback(...args); - } - : handleLocalSliderChange; + const handleTextInputChange: TextInputOnChange = ({ + target: { value: newValue }, + }) => { + sliderChangeCallback?.call(null, parseFloat(newValue)); + }; return ( @@ -219,7 +213,7 @@ const Slider = ({ ...sliderSx, }, - value: sliderValue, + value, valueLabelDisplay: sliderValueLabelDisplay, }} /> @@ -228,9 +222,9 @@ const Slider = ({ max, min, onBlur: handleLocalSliderBlur, - onChange: handleLocalTextInputChange, + onChange: handleTextInputChange, onFocus: handleLocalSliderFocus, - sliderValue, + sliderValue: value, sx: isAllowTextInput ? undefined : {