255 lines
No EOL
10 KiB
JavaScript
255 lines
No EOL
10 KiB
JavaScript
"use strict";
|
|
'use client';
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.PickersSectionListSectionSeparator = exports.PickersSectionListSectionContent = exports.PickersSectionListSection = exports.PickersSectionListRoot = exports.PickersSectionList = void 0;
|
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
var React = _interopRequireWildcard(require("react"));
|
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
var _useSlotProps = _interopRequireDefault(require("@mui/utils/useSlotProps"));
|
|
var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
|
|
var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
|
|
var _styles = require("@mui/material/styles");
|
|
var _pickersSectionListClasses = require("./pickersSectionListClasses");
|
|
var _usePickerPrivateContext = require("../internals/hooks/usePickerPrivateContext");
|
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
const _excluded = ["slots", "slotProps", "elements", "sectionListRef", "classes"];
|
|
const PickersSectionListRoot = exports.PickersSectionListRoot = (0, _styles.styled)('div', {
|
|
name: 'MuiPickersSectionList',
|
|
slot: 'Root'
|
|
})({
|
|
direction: 'ltr /*! @noflip */',
|
|
outline: 'none'
|
|
});
|
|
const PickersSectionListSection = exports.PickersSectionListSection = (0, _styles.styled)('span', {
|
|
name: 'MuiPickersSectionList',
|
|
slot: 'Section'
|
|
})({});
|
|
const PickersSectionListSectionSeparator = exports.PickersSectionListSectionSeparator = (0, _styles.styled)('span', {
|
|
name: 'MuiPickersSectionList',
|
|
slot: 'SectionSeparator'
|
|
})({
|
|
whiteSpace: 'pre'
|
|
});
|
|
const PickersSectionListSectionContent = exports.PickersSectionListSectionContent = (0, _styles.styled)('span', {
|
|
name: 'MuiPickersSectionList',
|
|
slot: 'SectionContent'
|
|
})({
|
|
outline: 'none'
|
|
});
|
|
const useUtilityClasses = classes => {
|
|
const slots = {
|
|
root: ['root'],
|
|
section: ['section'],
|
|
sectionContent: ['sectionContent']
|
|
};
|
|
return (0, _composeClasses.default)(slots, _pickersSectionListClasses.getPickersSectionListUtilityClass, classes);
|
|
};
|
|
function PickersSection(props) {
|
|
const {
|
|
slots,
|
|
slotProps,
|
|
element,
|
|
classes
|
|
} = props;
|
|
const {
|
|
ownerState
|
|
} = (0, _usePickerPrivateContext.usePickerPrivateContext)();
|
|
const Section = slots?.section ?? PickersSectionListSection;
|
|
const sectionProps = (0, _useSlotProps.default)({
|
|
elementType: Section,
|
|
externalSlotProps: slotProps?.section,
|
|
externalForwardedProps: element.container,
|
|
className: classes.section,
|
|
ownerState
|
|
});
|
|
const SectionContent = slots?.sectionContent ?? PickersSectionListSectionContent;
|
|
const sectionContentProps = (0, _useSlotProps.default)({
|
|
elementType: SectionContent,
|
|
externalSlotProps: slotProps?.sectionContent,
|
|
externalForwardedProps: element.content,
|
|
additionalProps: {
|
|
suppressContentEditableWarning: true
|
|
},
|
|
className: classes.sectionContent,
|
|
ownerState
|
|
});
|
|
const SectionSeparator = slots?.sectionSeparator ?? PickersSectionListSectionSeparator;
|
|
const sectionSeparatorBeforeProps = (0, _useSlotProps.default)({
|
|
elementType: SectionSeparator,
|
|
externalSlotProps: slotProps?.sectionSeparator,
|
|
externalForwardedProps: element.before,
|
|
ownerState: (0, _extends2.default)({}, ownerState, {
|
|
separatorPosition: 'before'
|
|
})
|
|
});
|
|
const sectionSeparatorAfterProps = (0, _useSlotProps.default)({
|
|
elementType: SectionSeparator,
|
|
externalSlotProps: slotProps?.sectionSeparator,
|
|
externalForwardedProps: element.after,
|
|
ownerState: (0, _extends2.default)({}, ownerState, {
|
|
separatorPosition: 'after'
|
|
})
|
|
});
|
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Section, (0, _extends2.default)({}, sectionProps, {
|
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SectionSeparator, (0, _extends2.default)({}, sectionSeparatorBeforeProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(SectionContent, (0, _extends2.default)({}, sectionContentProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(SectionSeparator, (0, _extends2.default)({}, sectionSeparatorAfterProps))]
|
|
}));
|
|
}
|
|
process.env.NODE_ENV !== "production" ? PickersSection.propTypes = {
|
|
// ----------------------------- Warning --------------------------------
|
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
// | To update them edit the TypeScript types and run "pnpm proptypes" |
|
|
// ----------------------------------------------------------------------
|
|
classes: _propTypes.default.object.isRequired,
|
|
element: _propTypes.default.shape({
|
|
after: _propTypes.default.object.isRequired,
|
|
before: _propTypes.default.object.isRequired,
|
|
container: _propTypes.default.object.isRequired,
|
|
content: _propTypes.default.object.isRequired
|
|
}).isRequired,
|
|
/**
|
|
* The props used for each component slot.
|
|
*/
|
|
slotProps: _propTypes.default.object,
|
|
/**
|
|
* Overridable component slots.
|
|
*/
|
|
slots: _propTypes.default.object
|
|
} : void 0;
|
|
/**
|
|
* Demos:
|
|
*
|
|
* - [Custom field](https://mui.com/x/react-date-pickers/custom-field/)
|
|
*
|
|
* API:
|
|
*
|
|
* - [PickersSectionList API](https://mui.com/x/api/date-pickers/pickers-section-list/)
|
|
*/
|
|
const PickersSectionList = exports.PickersSectionList = /*#__PURE__*/React.forwardRef(function PickersSectionList(inProps, ref) {
|
|
const props = (0, _styles.useThemeProps)({
|
|
props: inProps,
|
|
name: 'MuiPickersSectionList'
|
|
});
|
|
const {
|
|
slots,
|
|
slotProps,
|
|
elements,
|
|
sectionListRef,
|
|
classes: classesProp
|
|
} = props,
|
|
other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
|
|
const classes = useUtilityClasses(classesProp);
|
|
const {
|
|
ownerState
|
|
} = (0, _usePickerPrivateContext.usePickerPrivateContext)();
|
|
const rootRef = React.useRef(null);
|
|
const handleRootRef = (0, _useForkRef.default)(ref, rootRef);
|
|
const getRoot = methodName => {
|
|
if (!rootRef.current) {
|
|
throw new Error(`MUI X: Cannot call sectionListRef.${methodName} before the mount of the component.`);
|
|
}
|
|
return rootRef.current;
|
|
};
|
|
React.useImperativeHandle(sectionListRef, () => ({
|
|
getRoot() {
|
|
return getRoot('getRoot');
|
|
},
|
|
getSectionContainer(index) {
|
|
const root = getRoot('getSectionContainer');
|
|
return root.querySelector(`.${_pickersSectionListClasses.pickersSectionListClasses.section}[data-sectionindex="${index}"]`);
|
|
},
|
|
getSectionContent(index) {
|
|
const root = getRoot('getSectionContent');
|
|
return root.querySelector(`.${_pickersSectionListClasses.pickersSectionListClasses.section}[data-sectionindex="${index}"] .${_pickersSectionListClasses.pickersSectionListClasses.sectionContent}`);
|
|
},
|
|
getSectionIndexFromDOMElement(element) {
|
|
const root = getRoot('getSectionIndexFromDOMElement');
|
|
if (element == null || !root.contains(element)) {
|
|
return null;
|
|
}
|
|
let sectionContainer = null;
|
|
if (element.classList.contains(_pickersSectionListClasses.pickersSectionListClasses.section)) {
|
|
sectionContainer = element;
|
|
} else if (element.classList.contains(_pickersSectionListClasses.pickersSectionListClasses.sectionContent)) {
|
|
sectionContainer = element.parentElement;
|
|
}
|
|
if (sectionContainer == null) {
|
|
return null;
|
|
}
|
|
return Number(sectionContainer.dataset.sectionindex);
|
|
}
|
|
}));
|
|
const Root = slots?.root ?? PickersSectionListRoot;
|
|
const rootProps = (0, _useSlotProps.default)({
|
|
elementType: Root,
|
|
externalSlotProps: slotProps?.root,
|
|
externalForwardedProps: other,
|
|
additionalProps: {
|
|
ref: handleRootRef,
|
|
suppressContentEditableWarning: true
|
|
},
|
|
className: classes.root,
|
|
ownerState
|
|
});
|
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, rootProps, {
|
|
children: rootProps.contentEditable ? elements.map(({
|
|
content,
|
|
before,
|
|
after
|
|
}) => `${before.children}${content.children}${after.children}`).join('') : /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
|
|
children: elements.map((element, elementIndex) => /*#__PURE__*/(0, _jsxRuntime.jsx)(PickersSection, {
|
|
slots: slots,
|
|
slotProps: slotProps,
|
|
element: element,
|
|
classes: classes
|
|
}, elementIndex))
|
|
})
|
|
}));
|
|
});
|
|
if (process.env.NODE_ENV !== "production") PickersSectionList.displayName = "PickersSectionList";
|
|
process.env.NODE_ENV !== "production" ? PickersSectionList.propTypes = {
|
|
// ----------------------------- Warning --------------------------------
|
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
// | To update them edit the TypeScript types and run "pnpm proptypes" |
|
|
// ----------------------------------------------------------------------
|
|
/**
|
|
* Override or extend the styles applied to the component.
|
|
*/
|
|
classes: _propTypes.default.object,
|
|
/**
|
|
* If true, the whole element is editable.
|
|
* Useful when all the sections are selected.
|
|
*/
|
|
contentEditable: _propTypes.default.bool.isRequired,
|
|
/**
|
|
* The elements to render.
|
|
* Each element contains the prop to edit a section of the value.
|
|
*/
|
|
elements: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
after: _propTypes.default.object.isRequired,
|
|
before: _propTypes.default.object.isRequired,
|
|
container: _propTypes.default.object.isRequired,
|
|
content: _propTypes.default.object.isRequired
|
|
})).isRequired,
|
|
sectionListRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
|
|
current: _propTypes.default.shape({
|
|
getRoot: _propTypes.default.func.isRequired,
|
|
getSectionContainer: _propTypes.default.func.isRequired,
|
|
getSectionContent: _propTypes.default.func.isRequired,
|
|
getSectionIndexFromDOMElement: _propTypes.default.func.isRequired
|
|
})
|
|
})]),
|
|
/**
|
|
* The props used for each component slot.
|
|
*/
|
|
slotProps: _propTypes.default.object,
|
|
/**
|
|
* Overridable component slots.
|
|
*/
|
|
slots: _propTypes.default.object
|
|
} : void 0; |