import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import Typography from '@mui/material/Typography'; import Stack, { StackProps } from '@mui/material/Stack'; import TextField from '@mui/material/TextField'; import { PickerValidDate } from '../models'; import { UseTimeRangeFieldProps } from '../internals/models/timeRange'; import { UseMultiInputRangeFieldParams } from '../internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types'; import { MultiInputFieldRefs, MultiInputRangeFieldClasses, RangePosition } from '../models'; export type UseMultiInputTimeRangeFieldParams = UseMultiInputRangeFieldParams, TTextFieldSlotProps>; export interface UseMultiInputTimeRangeFieldProps extends Omit, 'unstableFieldRef' | 'clearable' | 'onClear'>, MultiInputFieldRefs { } export type UseMultiInputTimeRangeFieldComponentProps = Omit> & UseMultiInputTimeRangeFieldProps; export interface MultiInputTimeRangeFieldProps extends UseMultiInputTimeRangeFieldComponentProps> { autoFocus?: boolean; /** * Override or extend the styles applied to the component. */ classes?: Partial; /** * Overridable slots. * @default {} */ slots?: MultiInputTimeRangeFieldSlots; /** * The props used for each component slot. * @default {} */ slotProps?: MultiInputTimeRangeFieldSlotProps; } export interface MultiInputTimeRangeFieldSlots { /** * Element rendered at the root. * @default MultiInputTimeRangeFieldRoot */ root?: React.ElementType; /** * Form control with an input to render a time. * It is rendered twice: once for the start time and once for the end time. * @default TextField from '@mui/material' or PickersTextField if `enableAccessibleFieldDOMStructure` is `true`. */ textField?: React.ElementType; /** * Element rendered between the two inputs. * @default MultiInputTimeRangeFieldSeparator */ separator?: React.ElementType; } export interface MultiInputTimeRangeFieldSlotProps { root?: SlotComponentProps>; textField?: SlotComponentProps & { position: RangePosition; }>; separator?: SlotComponentProps>; }