146 lines
4.1 KiB
JavaScript
146 lines
4.1 KiB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
import * as React from 'react';
|
|
import { useSlotProps } from '@mui/base/utils';
|
|
import { unstable_composeClasses as composeClasses } from '@mui/utils';
|
|
import { PickersActionBar } from '../PickersActionBar';
|
|
import { getPickersLayoutUtilityClass } from './pickersLayoutClasses';
|
|
import { PickersShortcuts } from '../PickersShortcuts';
|
|
import { uncapitalizeObjectKeys } from '../internals/utils/slots-migration';
|
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
function toolbarHasView(toolbarProps) {
|
|
return toolbarProps.view !== null;
|
|
}
|
|
const useUtilityClasses = ownerState => {
|
|
const {
|
|
classes,
|
|
isLandscape
|
|
} = ownerState;
|
|
const slots = {
|
|
root: ['root', isLandscape && 'landscape'],
|
|
contentWrapper: ['contentWrapper'],
|
|
toolbar: ['toolbar'],
|
|
actionBar: ['actionBar'],
|
|
tabs: ['tabs'],
|
|
landscape: ['landscape'],
|
|
shortcuts: ['shortcuts']
|
|
};
|
|
return composeClasses(slots, getPickersLayoutUtilityClass, classes);
|
|
};
|
|
const usePickerLayout = props => {
|
|
var _slots$actionBar, _slots$shortcuts;
|
|
const {
|
|
wrapperVariant,
|
|
onAccept,
|
|
onClear,
|
|
onCancel,
|
|
onSetToday,
|
|
view,
|
|
views,
|
|
onViewChange,
|
|
value,
|
|
onChange,
|
|
onSelectShortcut,
|
|
isValid,
|
|
isLandscape,
|
|
disabled,
|
|
readOnly,
|
|
children,
|
|
components,
|
|
componentsProps,
|
|
slots: innerSlots,
|
|
slotProps: innerSlotProps
|
|
// TODO: Remove this "as" hack. It get introduced to mark `value` prop in PickersLayoutProps as not required.
|
|
// The true type should be
|
|
// - For pickers value: TDate | null
|
|
// - For range pickers value: [TDate | null, TDate | null]
|
|
} = props;
|
|
const slots = innerSlots != null ? innerSlots : uncapitalizeObjectKeys(components);
|
|
const slotProps = innerSlotProps != null ? innerSlotProps : componentsProps;
|
|
const classes = useUtilityClasses(props);
|
|
|
|
// Action bar
|
|
|
|
const ActionBar = (_slots$actionBar = slots == null ? void 0 : slots.actionBar) != null ? _slots$actionBar : PickersActionBar;
|
|
const actionBarProps = useSlotProps({
|
|
elementType: ActionBar,
|
|
externalSlotProps: slotProps == null ? void 0 : slotProps.actionBar,
|
|
additionalProps: {
|
|
onAccept,
|
|
onClear,
|
|
onCancel,
|
|
onSetToday,
|
|
actions: wrapperVariant === 'desktop' ? [] : ['cancel', 'accept'],
|
|
className: classes.actionBar
|
|
},
|
|
ownerState: _extends({}, props, {
|
|
wrapperVariant
|
|
})
|
|
});
|
|
const actionBar = /*#__PURE__*/_jsx(ActionBar, _extends({}, actionBarProps));
|
|
|
|
// Toolbar
|
|
|
|
const Toolbar = slots == null ? void 0 : slots.toolbar;
|
|
const toolbarProps = useSlotProps({
|
|
elementType: Toolbar,
|
|
externalSlotProps: slotProps == null ? void 0 : slotProps.toolbar,
|
|
additionalProps: {
|
|
isLandscape,
|
|
onChange,
|
|
value,
|
|
view,
|
|
onViewChange,
|
|
views,
|
|
disabled,
|
|
readOnly,
|
|
className: classes.toolbar
|
|
},
|
|
ownerState: _extends({}, props, {
|
|
wrapperVariant
|
|
})
|
|
});
|
|
const toolbar = toolbarHasView(toolbarProps) && !!Toolbar ? /*#__PURE__*/_jsx(Toolbar, _extends({}, toolbarProps)) : null;
|
|
|
|
// Content
|
|
|
|
const content = children;
|
|
|
|
// Tabs
|
|
|
|
const Tabs = slots == null ? void 0 : slots.tabs;
|
|
const tabs = view && Tabs ? /*#__PURE__*/_jsx(Tabs, _extends({
|
|
view: view,
|
|
onViewChange: onViewChange,
|
|
className: classes.tabs
|
|
}, slotProps == null ? void 0 : slotProps.tabs)) : null;
|
|
|
|
// Shortcuts
|
|
|
|
const Shortcuts = (_slots$shortcuts = slots == null ? void 0 : slots.shortcuts) != null ? _slots$shortcuts : PickersShortcuts;
|
|
const shortcutsProps = useSlotProps({
|
|
elementType: Shortcuts,
|
|
externalSlotProps: slotProps == null ? void 0 : slotProps.shortcuts,
|
|
additionalProps: {
|
|
isValid,
|
|
isLandscape,
|
|
onChange: onSelectShortcut,
|
|
className: classes.shortcuts
|
|
},
|
|
ownerState: {
|
|
isValid,
|
|
isLandscape,
|
|
onChange: onSelectShortcut,
|
|
className: classes.shortcuts,
|
|
wrapperVariant
|
|
}
|
|
});
|
|
const shortcuts = view && !!Shortcuts ? /*#__PURE__*/_jsx(Shortcuts, _extends({}, shortcutsProps)) : null;
|
|
return {
|
|
toolbar,
|
|
content,
|
|
tabs,
|
|
actionBar,
|
|
shortcuts
|
|
};
|
|
};
|
|
export default usePickerLayout; |