fix(striker-ui): include all MessageBox props passed to Slider

striker-ui/components/Slider.tsx

@@ -150,25 +150,27 @@ const createOutlinedInput = ({
 );
 
 const Slider = ({
-  messageBoxProps: {
+  messageBoxProps = SLIDER_DEFAULT_PROPS.messageBoxProps,
-    text: messageBoxText,
+  isAllowTextInput = SLIDER_DEFAULT_PROPS.isAllowTextInput,
-    type: messageBoxType,
-  } = SLIDER_DEFAULT_PROPS.messageBoxProps,
-  isAllowTextInput,
   label,
-  labelId,
+  labelId = SLIDER_DEFAULT_PROPS.labelId,
-  labelProps,
+  labelProps = SLIDER_DEFAULT_PROPS.labelProps,
-  sliderProps,
+  sliderProps = SLIDER_DEFAULT_PROPS.sliderProps,
   value,
 }: SliderProps): JSX.Element => {
-  const { sx: labelSx } = labelProps ?? SLIDER_DEFAULT_PROPS.labelProps;
+  const {
+    sx: messageBoxSx,
+    text: messageBoxText,
+    ...messageBoxRestProps
+  } = messageBoxProps;
+  const { sx: labelSx } = labelProps;
   const {
     max,
     min,
     onChange: sliderChangeCallback,
     sx: sliderSx,
     valueLabelDisplay: sliderValueLabelDisplay,
-  } = sliderProps ?? SLIDER_DEFAULT_PROPS.sliderProps;
+  } = sliderProps;
 
   const [isFocused, setIsFocused] = useState<boolean>(false);
 
@@ -254,9 +256,12 @@ const Slider = ({
       </Box>
       {messageBoxText && (
         <MessageBox
-          sx={{ marginTop: '.4em' }}
+          // eslint-disable-next-line react/jsx-props-no-spreading
-          text={messageBoxText}
+          {...{
-          type={messageBoxType}
+            ...messageBoxRestProps,
+            sx: { marginTop: '.4em', ...messageBoxSx },
+            text: messageBoxText,
+          }}
         />
       )}
     </FormControl>