import * as React from 'react'; import { SxProps, Theme } from '@mui/material/styles'; import { SlotComponentProps } from '@mui/base/utils'; import { PickersActionBarProps } from '../PickersActionBar'; import { BaseToolbarProps, ExportedBaseToolbarProps } from '../internals/models/props/toolbar'; import { BaseTabsProps, ExportedBaseTabsProps } from '../internals/models/props/tabs'; import { UsePickerLayoutPropsResponseLayoutProps } from '../internals/hooks/usePicker/usePickerLayoutProps'; import { UncapitalizeObjectKeys } from '../internals/utils/slots-migration'; import { PickersLayoutClasses } from './pickersLayoutClasses'; import { DateOrTimeViewWithMeridiem, WrapperVariant } from '../internals/models/common'; import { PickersShortcutsProps } from '../PickersShortcuts'; export interface ExportedPickersLayoutSlotsComponent { /** * Custom component for the action bar, it is placed below the picker views. * @default PickersActionBar */ ActionBar?: React.ElementType; /** * Custom component for the shortcuts. * @default PickersShortcuts */ Shortcuts?: React.JSXElementConstructor>; /** * Custom component for wrapping the layout. * It wraps the toolbar, views, action bar, and shortcuts. */ Layout?: React.JSXElementConstructor & React.RefAttributes>; } interface PickersLayoutActionBarOwnerState extends PickersLayoutProps { wrapperVariant: WrapperVariant; } interface PickersShortcutsOwnerState extends PickersShortcutsProps { wrapperVariant: WrapperVariant; } export interface ExportedPickersLayoutSlotsComponentsProps { /** * Props passed down to the action bar component. */ actionBar?: SlotComponentProps>, {}, PickersLayoutActionBarOwnerState>; /** * Props passed down to the shortcuts component. */ shortcuts?: SlotComponentProps>, {}, PickersShortcutsOwnerState>; /** * Props passed down to the layoutRoot component. */ layout?: Partial>; } export interface PickersLayoutSlotsComponent extends ExportedPickersLayoutSlotsComponent { /** * Tabs enabling toggling between views. */ Tabs?: React.ElementType>; /** * Custom component for the toolbar. * It is placed above the picker views. */ Toolbar?: React.JSXElementConstructor>; } export interface PickersLayoutSlotsComponentsProps extends ExportedPickersLayoutSlotsComponentsProps { /** * Props passed down to the tabs component. */ tabs?: ExportedBaseTabsProps; /** * Props passed down to the toolbar component. */ toolbar?: ExportedBaseToolbarProps; } export interface PickersLayoutProps extends Omit, 'value'> { value?: TValue; className?: string; children?: React.ReactNode; sx?: SxProps; /** * Ref to pass to the root element */ ref?: React.Ref; classes?: Partial; /** * Overridable components. * @default {} * @deprecated Please use `slots`. */ components?: PickersLayoutSlotsComponent; /** * The props used for each component slot. * @default {} * @deprecated Please use `slotProps`. */ componentsProps?: PickersLayoutSlotsComponentsProps; /** * Overridable component slots. * @default {} */ slots?: UncapitalizeObjectKeys>; /** * The props used for each component slot. * @default {} */ slotProps?: PickersLayoutSlotsComponentsProps; } export interface SubComponents { toolbar: React.ReactNode; content: React.ReactNode; tabs: React.ReactNode; actionBar: React.ReactNode; shortcuts: React.ReactNode; } export {};