@mantine/dates
Version:
Calendars, date and time pickers based on Mantine components
133 lines (127 loc) • 3.82 kB
JavaScript
'use client';
;
var jsxRuntime = require('react/jsx-runtime');
var dayjs = require('dayjs');
var react = require('react');
var core = require('@mantine/core');
var handleControlKeyDown = require('../../utils/handle-control-key-down/handle-control-key-down.cjs');
var DecadeLevel = require('../DecadeLevel/DecadeLevel.cjs');
var LevelsGroup = require('../LevelsGroup/LevelsGroup.cjs');
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
var dayjs__default = /*#__PURE__*/_interopDefault(dayjs);
const defaultProps = {
numberOfColumns: 1
};
const DecadeLevelGroup = core.factory((_props, ref) => {
const props = core.useProps("DecadeLevelGroup", defaultProps, _props);
const {
// DecadeLevel settings
decade,
locale,
minDate,
maxDate,
yearsListFormat,
getYearControlProps,
__onControlClick,
__onControlMouseEnter,
withCellSpacing,
// CalendarHeader settings
__preventFocus,
nextIcon,
previousIcon,
nextLabel,
previousLabel,
onNext,
onPrevious,
nextDisabled,
previousDisabled,
headerControlsOrder,
// Other settings
classNames,
styles,
unstyled,
__staticSelector,
__stopPropagation,
numberOfColumns,
levelControlAriaLabel,
decadeLabelFormat,
size,
vars,
attributes,
...others
} = props;
const controlsRef = react.useRef([]);
const decades = Array(numberOfColumns).fill(0).map((_, decadeIndex) => {
const currentDecade = dayjs__default.default(decade).add(decadeIndex * 10, "years").format("YYYY-MM-DD");
return /* @__PURE__ */ jsxRuntime.jsx(
DecadeLevel.DecadeLevel,
{
size,
yearsListFormat,
decade: currentDecade,
withNext: decadeIndex === numberOfColumns - 1,
withPrevious: decadeIndex === 0,
decadeLabelFormat,
__onControlClick,
__onControlMouseEnter,
__onControlKeyDown: (event, payload) => handleControlKeyDown.handleControlKeyDown({
levelIndex: decadeIndex,
rowIndex: payload.rowIndex,
cellIndex: payload.cellIndex,
event,
controlsRef
}),
__getControlRef: (rowIndex, cellIndex, node) => {
if (!Array.isArray(controlsRef.current[decadeIndex])) {
controlsRef.current[decadeIndex] = [];
}
if (!Array.isArray(controlsRef.current[decadeIndex][rowIndex])) {
controlsRef.current[decadeIndex][rowIndex] = [];
}
controlsRef.current[decadeIndex][rowIndex][cellIndex] = node;
},
levelControlAriaLabel: typeof levelControlAriaLabel === "function" ? levelControlAriaLabel(currentDecade) : levelControlAriaLabel,
locale,
minDate,
maxDate,
__preventFocus,
__stopPropagation,
nextIcon,
previousIcon,
nextLabel,
previousLabel,
onNext,
onPrevious,
nextDisabled,
previousDisabled,
getYearControlProps,
__staticSelector: __staticSelector || "DecadeLevelGroup",
classNames,
styles,
unstyled,
withCellSpacing,
headerControlsOrder,
attributes
},
decadeIndex
);
});
return /* @__PURE__ */ jsxRuntime.jsx(
LevelsGroup.LevelsGroup,
{
classNames,
styles,
__staticSelector: __staticSelector || "DecadeLevelGroup",
ref,
size,
unstyled,
attributes,
...others,
children: decades
}
);
});
DecadeLevelGroup.classes = { ...LevelsGroup.LevelsGroup.classes, ...DecadeLevel.DecadeLevel.classes };
DecadeLevelGroup.displayName = "@mantine/dates/DecadeLevelGroup";
exports.DecadeLevelGroup = DecadeLevelGroup;
//# sourceMappingURL=DecadeLevelGroup.cjs.map