UNPKG

@coveord/plasma-mantine

Version:

A Plasma flavoured Mantine theme

97 lines (96 loc) 4.4 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); Object.defineProperty(exports, "DateRangePickerPopoverCalendar", { enumerable: true, get: function() { return DateRangePickerPopoverCalendar; } }); var _object_spread = require("@swc/helpers/_/_object_spread"); var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array"); var _jsxruntime = require("react/jsx-runtime"); var _core = require("@mantine/core"); var _dates = require("@mantine/dates"); var _hooks = require("@mantine/hooks"); var _react = require("react"); var _DateRangePickerPresetSelect = require("./DateRangePickerPresetSelect"); var _EditableDateRangePicker = require("./EditableDateRangePicker"); var DateRangePickerPopoverCalendar = function(param) { var presets = param.presets, value = param.value, defaultValue = param.defaultValue, onChange = param.onChange, startProps = param.startProps, endProps = param.endProps, rangeCalendarProps = param.rangeCalendarProps; var _useState = _sliced_to_array._((0, _react.useState)(false), 2), opened = _useState[0], setOpened = _useState[1]; var ref = (0, _hooks.useClickOutside)(function() { return setOpened(false); }); var _useUncontrolled = _sliced_to_array._((0, _hooks.useUncontrolled)({ value: value, defaultValue: defaultValue, onChange: onChange, finalValue: [ null, null ] }), 2), _value = _useUncontrolled[0], handleChange = _useUncontrolled[1]; var onCalendarChange = function(dates) { handleChange === null || handleChange === void 0 ? void 0 : handleChange(dates); if (dates[1] !== null) { setOpened(false); } }; return /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, { children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Popover, { opened: opened, onChange: setOpened, trapFocus: true, children: [ /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Popover.Target, { children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Group, { align: "center", children: [ /*#__PURE__*/ (0, _jsxruntime.jsx)(_EditableDateRangePicker.EditableDateRangePicker, { value: _value, onChange: handleChange, onFocus: function() { return setOpened(true); }, startProps: startProps, endProps: endProps }), presets ? /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, { children: [ /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Space, { w: "sm" }), /*#__PURE__*/ (0, _jsxruntime.jsx)(_DateRangePickerPresetSelect.DateRangePickerPresetSelect, { presets: presets, value: _value, onChange: handleChange }) ] }) : null ] }) }), /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Popover.Dropdown, { children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_dates.DatePicker, _object_spread._({ ref: ref, type: "range", styles: { day: { textAlign: 'center' } }, numberOfColumns: 2, columnsToScroll: 1, firstDayOfWeek: 0, allowSingleDateInRange: true, value: _value, onChange: onCalendarChange }, rangeCalendarProps)) }) ] }) }); }; //# sourceMappingURL=DateRangePickerPopoverCalendar.js.map