@mantine/dates
Version:
Calendars, date and time pickers based on Mantine components
105 lines (104 loc) • 4.14 kB
JavaScript
"use client";
const require_CalendarHeader_module = require("./CalendarHeader.module.cjs");
let react = require("react");
let react_jsx_runtime = require("react/jsx-runtime");
let _mantine_core = require("@mantine/core");
//#region packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.tsx
const defaultProps = {
hasNextLevel: true,
withNext: true,
withPrevious: true,
headerControlsOrder: [
"previous",
"level",
"next"
]
};
const varsResolver = (0, _mantine_core.createVarsResolver)((_, { size }) => ({ calendarHeader: {
"--dch-control-size": (0, _mantine_core.getSize)(size, "dch-control-size"),
"--dch-fz": (0, _mantine_core.getFontSize)(size)
} }));
const CalendarHeader = (0, _mantine_core.factory)((_props) => {
const props = (0, _mantine_core.useProps)("CalendarHeader", defaultProps, _props);
const { classNames, className, style, styles, unstyled, vars, nextIcon, previousIcon, nextLabel, previousLabel, onNext, onPrevious, onLevelClick, label, nextDisabled, previousDisabled, hasNextLevel, levelControlAriaLabel, withNext, withPrevious, headerControlsOrder, fullWidth, __staticSelector, __preventFocus, __stopPropagation, attributes, ...others } = props;
const getStyles = (0, _mantine_core.useStyles)({
name: __staticSelector || "CalendarHeader",
classes: require_CalendarHeader_module.default,
props,
className,
style,
classNames,
styles,
unstyled,
attributes,
vars,
varsResolver,
rootSelector: "calendarHeader"
});
const preventFocus = __preventFocus ? (event) => event.preventDefault() : void 0;
const previousControl = withPrevious && /* @__PURE__ */ (0, react.createElement)(_mantine_core.UnstyledButton, {
...getStyles("calendarHeaderControl"),
key: "previous",
"data-direction": "previous",
"aria-label": previousLabel,
onClick: onPrevious,
unstyled,
onMouseDown: preventFocus,
disabled: previousDisabled,
"data-disabled": previousDisabled || void 0,
tabIndex: __preventFocus || previousDisabled ? -1 : 0,
"data-mantine-stop-propagation": __stopPropagation || void 0
}, previousIcon || /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.AccordionChevron, {
...getStyles("calendarHeaderControlIcon"),
"data-direction": "previous",
size: "45%"
}));
const levelControl = /* @__PURE__ */ (0, react.createElement)(_mantine_core.UnstyledButton, {
component: hasNextLevel ? "button" : "div",
...getStyles("calendarHeaderLevel"),
key: "level",
onClick: hasNextLevel ? onLevelClick : void 0,
unstyled,
onMouseDown: hasNextLevel ? preventFocus : void 0,
disabled: !hasNextLevel,
"data-static": !hasNextLevel || void 0,
"aria-label": levelControlAriaLabel,
tabIndex: __preventFocus || !hasNextLevel ? -1 : 0,
"data-mantine-stop-propagation": __stopPropagation || void 0
}, label);
const nextControl = withNext && /* @__PURE__ */ (0, react.createElement)(_mantine_core.UnstyledButton, {
...getStyles("calendarHeaderControl"),
key: "next",
"data-direction": "next",
"aria-label": nextLabel,
onClick: onNext,
unstyled,
onMouseDown: preventFocus,
disabled: nextDisabled,
"data-disabled": nextDisabled || void 0,
tabIndex: __preventFocus || nextDisabled ? -1 : 0,
"data-mantine-stop-propagation": __stopPropagation || void 0
}, nextIcon || /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.AccordionChevron, {
...getStyles("calendarHeaderControlIcon"),
"data-direction": "next",
size: "45%"
}));
const controls = headerControlsOrder.map((control) => {
if (control === "previous") return previousControl;
if (control === "level") return levelControl;
if (control === "next") return nextControl;
return null;
});
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Box, {
...getStyles("calendarHeader"),
"data-full-width": fullWidth || void 0,
...others,
children: controls
});
});
CalendarHeader.classes = require_CalendarHeader_module.default;
CalendarHeader.varsResolver = varsResolver;
CalendarHeader.displayName = "@mantine/dates/CalendarHeader";
//#endregion
exports.CalendarHeader = CalendarHeader;
//# sourceMappingURL=CalendarHeader.cjs.map