1 | import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
2 | import React__default, { createElement, useMemo, useState, useCallback, useEffect, useDebugValue, useRef } from 'react';
|
3 | import { bool, string, any } from 'prop-types';
|
4 | import { u as useUtils } from './useUtils-cfb96ac9.js';
|
5 | import clsx from 'clsx';
|
6 | import _extends from '@babel/runtime/helpers/esm/extends';
|
7 | import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
8 | import Typography from '@material-ui/core/Typography';
|
9 | import { makeStyles, fade, withStyles, createStyles } from '@material-ui/core/styles';
|
10 | import Button from '@material-ui/core/Button';
|
11 | import Toolbar from '@material-ui/core/Toolbar';
|
12 | import { W as Wrapper } from './Wrapper-241966d7.js';
|
13 | import TextField from '@material-ui/core/TextField';
|
14 | import IconButton from '@material-ui/core/IconButton';
|
15 | import InputAdornment from '@material-ui/core/InputAdornment';
|
16 | import { Rifm } from 'rifm';
|
17 | import SvgIcon from '@material-ui/core/SvgIcon';
|
18 | import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
|
19 | import { P as Picker } from './Picker-ccd9ba90.js';
|
20 |
|
21 | var useStyles = makeStyles(function (theme) {
|
22 | var textColor = theme.palette.type === 'light' ? theme.palette.primary.contrastText : theme.palette.getContrastText(theme.palette.background["default"]);
|
23 | return {
|
24 | toolbarTxt: {
|
25 | color: fade(textColor, 0.54)
|
26 | },
|
27 | toolbarBtnSelected: {
|
28 | color: textColor
|
29 | }
|
30 | };
|
31 | }, {
|
32 | name: 'MuiPickersToolbarText'
|
33 | });
|
34 |
|
35 | var ToolbarText = function ToolbarText(_ref) {
|
36 | var selected = _ref.selected,
|
37 | label = _ref.label,
|
38 | _ref$className = _ref.className,
|
39 | className = _ref$className === void 0 ? null : _ref$className,
|
40 | other = _objectWithoutProperties(_ref, ["selected", "label", "className"]);
|
41 |
|
42 | var classes = useStyles();
|
43 | return createElement(Typography, _extends({
|
44 | children: label,
|
45 | className: clsx(classes.toolbarTxt, className, selected && classes.toolbarBtnSelected)
|
46 | }, other));
|
47 | };
|
48 |
|
49 | var ToolbarButton = function ToolbarButton(_ref) {
|
50 | var classes = _ref.classes,
|
51 | _ref$className = _ref.className,
|
52 | className = _ref$className === void 0 ? null : _ref$className,
|
53 | label = _ref.label,
|
54 | selected = _ref.selected,
|
55 | variant = _ref.variant,
|
56 | align = _ref.align,
|
57 | typographyClassName = _ref.typographyClassName,
|
58 | other = _objectWithoutProperties(_ref, ["classes", "className", "label", "selected", "variant", "align", "typographyClassName"]);
|
59 |
|
60 | return createElement(Button, _extends({
|
61 | variant: "text",
|
62 | className: clsx(classes.toolbarBtn, className)
|
63 | }, other), createElement(ToolbarText, {
|
64 | align: align,
|
65 | className: typographyClassName,
|
66 | variant: variant,
|
67 | label: label,
|
68 | selected: selected
|
69 | }));
|
70 | };
|
71 |
|
72 | process.env.NODE_ENV !== "production" ? ToolbarButton.propTypes = {
|
73 | selected: bool.isRequired,
|
74 | label: string.isRequired,
|
75 | classes: any.isRequired,
|
76 | className: string,
|
77 | innerRef: any
|
78 | } : void 0;
|
79 | ToolbarButton.defaultProps = {
|
80 | className: ''
|
81 | };
|
82 | var styles = createStyles({
|
83 | toolbarBtn: {
|
84 | padding: 0,
|
85 | minWidth: '16px',
|
86 | textTransform: 'none'
|
87 | }
|
88 | });
|
89 | var ToolbarButton$1 = withStyles(styles, {
|
90 | name: 'MuiPickersToolbarButton'
|
91 | })(ToolbarButton);
|
92 |
|
93 | var useStyles$1 = makeStyles(function (theme) {
|
94 | return {
|
95 | toolbar: {
|
96 | display: 'flex',
|
97 | flexDirection: 'row',
|
98 | alignItems: 'center',
|
99 | justifyContent: 'center',
|
100 | height: 100,
|
101 | backgroundColor: theme.palette.type === 'light' ? theme.palette.primary.main : theme.palette.background["default"]
|
102 | },
|
103 | toolbarLandscape: {
|
104 | height: 'auto',
|
105 | maxWidth: 150,
|
106 | padding: 8,
|
107 | justifyContent: 'flex-start'
|
108 | }
|
109 | };
|
110 | }, {
|
111 | name: 'MuiPickersToolbar'
|
112 | });
|
113 |
|
114 | var PickerToolbar = function PickerToolbar(_ref) {
|
115 | var children = _ref.children,
|
116 | isLandscape = _ref.isLandscape,
|
117 | _ref$className = _ref.className,
|
118 | className = _ref$className === void 0 ? null : _ref$className,
|
119 | other = _objectWithoutProperties(_ref, ["children", "isLandscape", "className"]);
|
120 |
|
121 | var classes = useStyles$1();
|
122 | return createElement(Toolbar, _extends({
|
123 | className: clsx(classes.toolbar, className, isLandscape && classes.toolbarLandscape)
|
124 | }, other), children);
|
125 | };
|
126 |
|
127 | function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
128 |
|
129 | function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
130 | var PureDateInput = function PureDateInput(_ref) {
|
131 | var inputValue = _ref.inputValue,
|
132 | inputVariant = _ref.inputVariant,
|
133 | validationError = _ref.validationError,
|
134 | InputProps = _ref.InputProps,
|
135 | onOpen = _ref.openPicker,
|
136 | _ref$TextFieldCompone = _ref.TextFieldComponent,
|
137 | TextFieldComponent = _ref$TextFieldCompone === void 0 ? TextField : _ref$TextFieldCompone,
|
138 | other = _objectWithoutProperties(_ref, ["inputValue", "inputVariant", "validationError", "InputProps", "openPicker", "TextFieldComponent"]);
|
139 |
|
140 | var PureDateInputProps = useMemo(function () {
|
141 | return _objectSpread({}, InputProps, {
|
142 | readOnly: true
|
143 | });
|
144 | }, [InputProps]);
|
145 | return createElement(TextFieldComponent, _extends({
|
146 | error: Boolean(validationError),
|
147 | helperText: validationError
|
148 | }, other, {
|
149 |
|
150 | onClick: onOpen,
|
151 | value: inputValue,
|
152 | variant: inputVariant,
|
153 | InputProps: PureDateInputProps,
|
154 | onKeyDown: function onKeyDown(e) {
|
155 |
|
156 | if (e.keyCode === 32) {
|
157 | e.stopPropagation();
|
158 | onOpen();
|
159 | }
|
160 | }
|
161 | }));
|
162 | };
|
163 | PureDateInput.displayName = 'PureDateInput';
|
164 |
|
165 | var KeyboardIcon = function KeyboardIcon(props) {
|
166 | return React__default.createElement(SvgIcon, props, React__default.createElement("path", {
|
167 | d: "M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
|
168 | }), React__default.createElement("path", {
|
169 | fill: "none",
|
170 | d: "M0 0h24v24H0z"
|
171 | }));
|
172 | };
|
173 |
|
174 | var getDisplayDate = function getDisplayDate(value, format, utils, isEmpty, _ref) {
|
175 | var invalidLabel = _ref.invalidLabel,
|
176 | emptyLabel = _ref.emptyLabel,
|
177 | labelFunc = _ref.labelFunc;
|
178 | var date = utils.date(value);
|
179 |
|
180 | if (labelFunc) {
|
181 | return labelFunc(isEmpty ? null : date, invalidLabel);
|
182 | }
|
183 |
|
184 | if (isEmpty) {
|
185 | return emptyLabel || '';
|
186 | }
|
187 |
|
188 | return utils.isValid(date) ? utils.format(date, format) : invalidLabel;
|
189 | };
|
190 |
|
191 | var getComparisonMaxDate = function getComparisonMaxDate(utils, strictCompareDates, date) {
|
192 | if (strictCompareDates) {
|
193 | return date;
|
194 | }
|
195 |
|
196 | return utils.endOfDay(date);
|
197 | };
|
198 |
|
199 | var getComparisonMinDate = function getComparisonMinDate(utils, strictCompareDates, date) {
|
200 | if (strictCompareDates) {
|
201 | return date;
|
202 | }
|
203 |
|
204 | return utils.startOfDay(date);
|
205 | };
|
206 |
|
207 | var validate = function validate(value, utils, _ref2) {
|
208 | var maxDate = _ref2.maxDate,
|
209 | minDate = _ref2.minDate,
|
210 | disablePast = _ref2.disablePast,
|
211 | disableFuture = _ref2.disableFuture,
|
212 | maxDateMessage = _ref2.maxDateMessage,
|
213 | minDateMessage = _ref2.minDateMessage,
|
214 | invalidDateMessage = _ref2.invalidDateMessage,
|
215 | strictCompareDates = _ref2.strictCompareDates;
|
216 | var parsedValue = utils.date(value);
|
217 |
|
218 | if (value === null) {
|
219 | return '';
|
220 | }
|
221 |
|
222 | if (!utils.isValid(value)) {
|
223 | return invalidDateMessage;
|
224 | }
|
225 |
|
226 | if (maxDate && utils.isAfter(parsedValue, getComparisonMaxDate(utils, !!strictCompareDates, utils.date(maxDate)))) {
|
227 | return maxDateMessage;
|
228 | }
|
229 |
|
230 | if (disableFuture && utils.isAfter(parsedValue, getComparisonMaxDate(utils, !!strictCompareDates, utils.date()))) {
|
231 | return maxDateMessage;
|
232 | }
|
233 |
|
234 | if (minDate && utils.isBefore(parsedValue, getComparisonMinDate(utils, !!strictCompareDates, utils.date(minDate)))) {
|
235 | return minDateMessage;
|
236 | }
|
237 |
|
238 | if (disablePast && utils.isBefore(parsedValue, getComparisonMinDate(utils, !!strictCompareDates, utils.date()))) {
|
239 | return minDateMessage;
|
240 | }
|
241 |
|
242 | return '';
|
243 | };
|
244 | function pick12hOr24hFormat(userFormat) {
|
245 | var ampm = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
246 | var formats = arguments.length > 2 ? arguments[2] : undefined;
|
247 |
|
248 | if (userFormat) {
|
249 | return userFormat;
|
250 | }
|
251 |
|
252 | return ampm ? formats['12h'] : formats['24h'];
|
253 | }
|
254 | function makeMaskFromFormat(format, numberMaskChar) {
|
255 | return format.replace(/[a-z]/gi, numberMaskChar);
|
256 | }
|
257 | var maskedDateFormatter = function maskedDateFormatter(mask, numberMaskChar, refuse) {
|
258 | return function (value) {
|
259 | var result = '';
|
260 | var parsed = value.replace(refuse, '');
|
261 |
|
262 | if (parsed === '') {
|
263 | return parsed;
|
264 | }
|
265 |
|
266 | var i = 0;
|
267 | var n = 0;
|
268 |
|
269 | while (i < mask.length) {
|
270 | var maskChar = mask[i];
|
271 |
|
272 | if (maskChar === numberMaskChar && n < parsed.length) {
|
273 | var parsedChar = parsed[n];
|
274 | result += parsedChar;
|
275 | n += 1;
|
276 | } else {
|
277 | result += maskChar;
|
278 | }
|
279 |
|
280 | i += 1;
|
281 | }
|
282 |
|
283 | return result;
|
284 | };
|
285 | };
|
286 |
|
287 | function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
288 |
|
289 | function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
290 | var KeyboardDateInput = function KeyboardDateInput(_ref) {
|
291 | var inputValue = _ref.inputValue,
|
292 | inputVariant = _ref.inputVariant,
|
293 | validationError = _ref.validationError,
|
294 | KeyboardButtonProps = _ref.KeyboardButtonProps,
|
295 | InputAdornmentProps = _ref.InputAdornmentProps,
|
296 | onOpen = _ref.openPicker,
|
297 | onChange = _ref.onChange,
|
298 | InputProps = _ref.InputProps,
|
299 | mask = _ref.mask,
|
300 | _ref$maskChar = _ref.maskChar,
|
301 | maskChar = _ref$maskChar === void 0 ? '_' : _ref$maskChar,
|
302 | _ref$refuse = _ref.refuse,
|
303 | refuse = _ref$refuse === void 0 ? /[^\d]+/gi : _ref$refuse,
|
304 | format = _ref.format,
|
305 | keyboardIcon = _ref.keyboardIcon,
|
306 | disabled = _ref.disabled,
|
307 | rifmFormatter = _ref.rifmFormatter,
|
308 | _ref$TextFieldCompone = _ref.TextFieldComponent,
|
309 | TextFieldComponent = _ref$TextFieldCompone === void 0 ? TextField : _ref$TextFieldCompone,
|
310 | other = _objectWithoutProperties(_ref, ["inputValue", "inputVariant", "validationError", "KeyboardButtonProps", "InputAdornmentProps", "openPicker", "onChange", "InputProps", "mask", "maskChar", "refuse", "format", "keyboardIcon", "disabled", "rifmFormatter", "TextFieldComponent"]);
|
311 |
|
312 | var inputMask = mask || makeMaskFromFormat(format, maskChar);
|
313 |
|
314 | var formatter = useMemo(function () {
|
315 | return maskedDateFormatter(inputMask, maskChar, refuse);
|
316 | }, [inputMask, maskChar, refuse]);
|
317 | var position = InputAdornmentProps && InputAdornmentProps.position ? InputAdornmentProps.position : 'end';
|
318 |
|
319 | var handleChange = function handleChange(text) {
|
320 | var finalString = text === '' || text === inputMask ? null : text;
|
321 | onChange(finalString);
|
322 | };
|
323 |
|
324 | return createElement(Rifm, {
|
325 | key: inputMask,
|
326 | value: inputValue,
|
327 | onChange: handleChange,
|
328 | refuse: refuse,
|
329 | format: rifmFormatter || formatter
|
330 | }, function (_ref2) {
|
331 | var onChange = _ref2.onChange,
|
332 | value = _ref2.value;
|
333 | return createElement(TextFieldComponent, _extends({
|
334 | disabled: disabled,
|
335 | error: Boolean(validationError),
|
336 | helperText: validationError
|
337 | }, other, {
|
338 | value: value,
|
339 | onChange: onChange,
|
340 | variant: inputVariant,
|
341 | InputProps: _objectSpread$1({}, InputProps, _defineProperty({}, "".concat(position, "Adornment"), createElement(InputAdornment, _extends({
|
342 | position: position
|
343 | }, InputAdornmentProps), createElement(IconButton, _extends({
|
344 | disabled: disabled
|
345 | }, KeyboardButtonProps, {
|
346 | onClick: onOpen
|
347 | }), keyboardIcon))))
|
348 | }));
|
349 | });
|
350 | };
|
351 | KeyboardDateInput.defaultProps = {
|
352 | keyboardIcon: createElement(KeyboardIcon, null)
|
353 | };
|
354 |
|
355 | function useOpenState(_ref) {
|
356 | var open = _ref.open,
|
357 | onOpen = _ref.onOpen,
|
358 | onClose = _ref.onClose;
|
359 | var setIsOpenState = null;
|
360 |
|
361 | if (open === undefined || open === null) {
|
362 |
|
363 | var _useState = useState(false);
|
364 |
|
365 | var _useState2 = _slicedToArray(_useState, 2);
|
366 |
|
367 | open = _useState2[0];
|
368 | setIsOpenState = _useState2[1];
|
369 | }
|
370 |
|
371 |
|
372 | var setIsOpen = useCallback(function (newIsOpen) {
|
373 | setIsOpenState && setIsOpenState(newIsOpen);
|
374 | return newIsOpen ? onOpen && onOpen() : onClose && onClose();
|
375 | }, [onOpen, onClose, setIsOpenState]);
|
376 | return {
|
377 | isOpen: open,
|
378 | setIsOpen: setIsOpen
|
379 | };
|
380 | }
|
381 |
|
382 | var useValueToDate = function useValueToDate(utils, _ref) {
|
383 | var value = _ref.value,
|
384 | initialFocusedDate = _ref.initialFocusedDate;
|
385 | var nowRef = useRef(utils.date());
|
386 | var date = utils.date(value || initialFocusedDate || nowRef.current);
|
387 | return date && utils.isValid(date) ? date : nowRef.current;
|
388 | };
|
389 |
|
390 | function useDateValues(props, options) {
|
391 | var utils = useUtils();
|
392 | var date = useValueToDate(utils, props);
|
393 | var format = props.format || options.getDefaultFormat();
|
394 | return {
|
395 | date: date,
|
396 | format: format
|
397 | };
|
398 | }
|
399 |
|
400 | function usePickerState(props, options) {
|
401 | var autoOk = props.autoOk,
|
402 | disabled = props.disabled,
|
403 | readOnly = props.readOnly,
|
404 | onAccept = props.onAccept,
|
405 | _onChange = props.onChange,
|
406 | onError = props.onError,
|
407 | value = props.value,
|
408 | variant = props.variant;
|
409 | var utils = useUtils();
|
410 |
|
411 | var _useOpenState = useOpenState(props),
|
412 | isOpen = _useOpenState.isOpen,
|
413 | setIsOpen = _useOpenState.setIsOpen;
|
414 |
|
415 | var _useDateValues = useDateValues(props, options),
|
416 | date = _useDateValues.date,
|
417 | format = _useDateValues.format;
|
418 |
|
419 | var _useState = useState(date),
|
420 | _useState2 = _slicedToArray(_useState, 2),
|
421 | pickerDate = _useState2[0],
|
422 | setPickerDate = _useState2[1];
|
423 |
|
424 | useEffect(function () {
|
425 |
|
426 | if (!isOpen && !utils.isEqual(pickerDate, date)) {
|
427 | setPickerDate(date);
|
428 | }
|
429 | }, [date, isOpen, pickerDate, utils]);
|
430 | var acceptDate = useCallback(function (acceptedDate) {
|
431 | _onChange(acceptedDate);
|
432 |
|
433 | if (onAccept) {
|
434 | onAccept(acceptedDate);
|
435 | }
|
436 |
|
437 | setIsOpen(false);
|
438 | }, [onAccept, _onChange, setIsOpen]);
|
439 | var wrapperProps = useMemo(function () {
|
440 | return {
|
441 | format: format,
|
442 | open: isOpen,
|
443 | onClear: function onClear() {
|
444 | return acceptDate(null);
|
445 | },
|
446 | onAccept: function onAccept() {
|
447 | return acceptDate(pickerDate);
|
448 | },
|
449 | onSetToday: function onSetToday() {
|
450 | return setPickerDate(utils.date());
|
451 | },
|
452 | onDismiss: function onDismiss() {
|
453 | setIsOpen(false);
|
454 | }
|
455 | };
|
456 | }, [acceptDate, format, isOpen, pickerDate, setIsOpen, utils]);
|
457 | var pickerProps = useMemo(function () {
|
458 | return {
|
459 | date: pickerDate,
|
460 | onChange: function onChange(newDate) {
|
461 | var isFinish = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
462 | setPickerDate(newDate);
|
463 |
|
464 | if (isFinish && autoOk) {
|
465 | acceptDate(newDate);
|
466 | return;
|
467 | }
|
468 |
|
469 |
|
470 | if (variant === 'inline' || variant === 'static') {
|
471 | _onChange(newDate);
|
472 |
|
473 | onAccept && onAccept(newDate);
|
474 | }
|
475 | }
|
476 | };
|
477 | }, [acceptDate, autoOk, onAccept, _onChange, pickerDate, variant]);
|
478 | var validationError = validate(value, utils, props);
|
479 | useEffect(function () {
|
480 | if (onError) {
|
481 | onError(validationError, value);
|
482 | }
|
483 | }, [onError, validationError, value]);
|
484 | var inputValue = getDisplayDate(date, format, utils, value === null, props);
|
485 | var inputProps = useMemo(function () {
|
486 | return {
|
487 | inputValue: inputValue,
|
488 | validationError: validationError,
|
489 | openPicker: function openPicker() {
|
490 | return !readOnly && !disabled && setIsOpen(true);
|
491 | }
|
492 | };
|
493 | }, [disabled, inputValue, readOnly, setIsOpen, validationError]);
|
494 | var pickerState = {
|
495 | pickerProps: pickerProps,
|
496 | inputProps: inputProps,
|
497 | wrapperProps: wrapperProps
|
498 | };
|
499 | useDebugValue(pickerState);
|
500 | return pickerState;
|
501 | }
|
502 |
|
503 | function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
504 |
|
505 | function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
506 |
|
507 | function parseInputString(value, utils, format) {
|
508 | try {
|
509 | return utils.parse(value, format);
|
510 | } catch (_unused) {
|
511 | return null;
|
512 | }
|
513 | }
|
514 |
|
515 | function useKeyboardPickerState(props, options) {
|
516 | var _props$format = props.format,
|
517 | format = _props$format === void 0 ? options.getDefaultFormat() : _props$format,
|
518 | inputValue = props.inputValue,
|
519 | _onChange = props.onChange,
|
520 | value = props.value;
|
521 | var utils = useUtils();
|
522 | var displayDate = getDisplayDate(value, format, utils, value === null, props);
|
523 |
|
524 | var _useState = useState(displayDate),
|
525 | _useState2 = _slicedToArray(_useState, 2),
|
526 | innerInputValue = _useState2[0],
|
527 | setInnerInputValue = _useState2[1];
|
528 |
|
529 | var dateValue = inputValue ? parseInputString(inputValue, utils, format) : value;
|
530 | useEffect(function () {
|
531 | if (value === null || utils.isValid(value)) {
|
532 | setInnerInputValue(displayDate);
|
533 | }
|
534 | }, [displayDate, setInnerInputValue, utils, value]);
|
535 | var handleKeyboardChange = useCallback(function (date) {
|
536 | _onChange(date, date === null ? null : utils.format(date, format));
|
537 | }, [format, _onChange, utils]);
|
538 |
|
539 | var _usePickerState = usePickerState(
|
540 | _objectSpread$2({}, props, {
|
541 | value: dateValue,
|
542 | onChange: handleKeyboardChange
|
543 | }), options),
|
544 | innerInputProps = _usePickerState.inputProps,
|
545 | wrapperProps = _usePickerState.wrapperProps,
|
546 | pickerProps = _usePickerState.pickerProps;
|
547 |
|
548 | var inputProps = useMemo(function () {
|
549 | return _objectSpread$2({}, innerInputProps, {
|
550 |
|
551 | format: wrapperProps.format,
|
552 | inputValue: inputValue || innerInputValue,
|
553 | onChange: function onChange(value) {
|
554 | setInnerInputValue(value || '');
|
555 | var date = value === null ? null : utils.parse(value, wrapperProps.format);
|
556 |
|
557 | _onChange(date, value);
|
558 | }
|
559 | });
|
560 | }, [innerInputProps, innerInputValue, inputValue, _onChange, utils, wrapperProps.format]);
|
561 | return {
|
562 | inputProps: inputProps,
|
563 | wrapperProps: wrapperProps,
|
564 | pickerProps: pickerProps
|
565 | };
|
566 | }
|
567 |
|
568 | function makePickerWithState(_ref) {
|
569 | var Input = _ref.Input,
|
570 | useState = _ref.useState,
|
571 | useOptions = _ref.useOptions,
|
572 | getCustomProps = _ref.getCustomProps,
|
573 | DefaultToolbarComponent = _ref.DefaultToolbarComponent;
|
574 |
|
575 | function PickerWithState(props) {
|
576 | var allowKeyboardControl = props.allowKeyboardControl,
|
577 | ampm = props.ampm,
|
578 | animateYearScrolling = props.animateYearScrolling,
|
579 | autoOk = props.autoOk,
|
580 | dateRangeIcon = props.dateRangeIcon,
|
581 | disableFuture = props.disableFuture,
|
582 | disablePast = props.disablePast,
|
583 | disableToolbar = props.disableToolbar,
|
584 | emptyLabel = props.emptyLabel,
|
585 | format = props.format,
|
586 | forwardedRef = props.forwardedRef,
|
587 | hideTabs = props.hideTabs,
|
588 | initialFocusedDate = props.initialFocusedDate,
|
589 | invalidDateMessage = props.invalidDateMessage,
|
590 | invalidLabel = props.invalidLabel,
|
591 | labelFunc = props.labelFunc,
|
592 | leftArrowButtonProps = props.leftArrowButtonProps,
|
593 | leftArrowIcon = props.leftArrowIcon,
|
594 | loadingIndicator = props.loadingIndicator,
|
595 | maxDate = props.maxDate,
|
596 | maxDateMessage = props.maxDateMessage,
|
597 | minDate = props.minDate,
|
598 | minDateMessage = props.minDateMessage,
|
599 | minutesStep = props.minutesStep,
|
600 | onAccept = props.onAccept,
|
601 | onChange = props.onChange,
|
602 | onClose = props.onClose,
|
603 | onMonthChange = props.onMonthChange,
|
604 | onOpen = props.onOpen,
|
605 | onYearChange = props.onYearChange,
|
606 | openTo = props.openTo,
|
607 | orientation = props.orientation,
|
608 | renderDay = props.renderDay,
|
609 | rightArrowButtonProps = props.rightArrowButtonProps,
|
610 | rightArrowIcon = props.rightArrowIcon,
|
611 | shouldDisableDate = props.shouldDisableDate,
|
612 | strictCompareDates = props.strictCompareDates,
|
613 | timeIcon = props.timeIcon,
|
614 | _props$ToolbarCompone = props.ToolbarComponent,
|
615 | ToolbarComponent = _props$ToolbarCompone === void 0 ? DefaultToolbarComponent : _props$ToolbarCompone,
|
616 | value = props.value,
|
617 | variant = props.variant,
|
618 | views = props.views,
|
619 | other = _objectWithoutProperties(props, ["allowKeyboardControl", "ampm", "animateYearScrolling", "autoOk", "dateRangeIcon", "disableFuture", "disablePast", "disableToolbar", "emptyLabel", "format", "forwardedRef", "hideTabs", "initialFocusedDate", "invalidDateMessage", "invalidLabel", "labelFunc", "leftArrowButtonProps", "leftArrowIcon", "loadingIndicator", "maxDate", "maxDateMessage", "minDate", "minDateMessage", "minutesStep", "onAccept", "onChange", "onClose", "onMonthChange", "onOpen", "onYearChange", "openTo", "orientation", "renderDay", "rightArrowButtonProps", "rightArrowIcon", "shouldDisableDate", "strictCompareDates", "timeIcon", "ToolbarComponent", "value", "variant", "views"]);
|
620 |
|
621 | var injectedProps = getCustomProps ? getCustomProps(props) : {};
|
622 | var options = useOptions(props);
|
623 |
|
624 | var _useState = useState(props, options),
|
625 | pickerProps = _useState.pickerProps,
|
626 | inputProps = _useState.inputProps,
|
627 | wrapperProps = _useState.wrapperProps;
|
628 |
|
629 | return createElement(Wrapper, _extends({
|
630 | variant: variant,
|
631 | InputComponent: Input,
|
632 | DateInputProps: inputProps
|
633 | }, injectedProps, wrapperProps, other), createElement(Picker, _extends({}, pickerProps, {
|
634 | allowKeyboardControl: allowKeyboardControl,
|
635 | ampm: ampm,
|
636 | animateYearScrolling: animateYearScrolling,
|
637 | dateRangeIcon: dateRangeIcon,
|
638 | disableFuture: disableFuture,
|
639 | disablePast: disablePast,
|
640 | disableToolbar: disableToolbar,
|
641 | hideTabs: hideTabs,
|
642 | leftArrowButtonProps: leftArrowButtonProps,
|
643 | leftArrowIcon: leftArrowIcon,
|
644 | loadingIndicator: loadingIndicator,
|
645 | maxDate: maxDate,
|
646 | minDate: minDate,
|
647 | minutesStep: minutesStep,
|
648 | onMonthChange: onMonthChange,
|
649 | onYearChange: onYearChange,
|
650 | openTo: openTo,
|
651 | orientation: orientation,
|
652 | renderDay: renderDay,
|
653 | rightArrowButtonProps: rightArrowButtonProps,
|
654 | rightArrowIcon: rightArrowIcon,
|
655 | shouldDisableDate: shouldDisableDate,
|
656 | strictCompareDates: strictCompareDates,
|
657 | timeIcon: timeIcon,
|
658 | ToolbarComponent: ToolbarComponent,
|
659 | views: views
|
660 | })));
|
661 | }
|
662 |
|
663 | return PickerWithState;
|
664 | }
|
665 |
|
666 | export { KeyboardDateInput as K, PickerToolbar as P, ToolbarButton$1 as T, PureDateInput as a, useKeyboardPickerState as b, ToolbarText as c, makePickerWithState as m, pick12hOr24hFormat as p, usePickerState as u, validate as v };
|
667 |
|