@zendeskgarden/react-datepickers 8.47.1 → 8.47.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +108 -122
- package/dist/index.esm.js +31 -43
- package/dist/typings/elements/DatepickerRange/DatepickerRange.d.ts +2 -2
- package/dist/typings/elements/DatepickerRange/components/End.d.ts +1 -1
- package/dist/typings/elements/DatepickerRange/components/Start.d.ts +1 -1
- package/package.json +4 -4
package/dist/index.cjs.js
CHANGED
|
@@ -27,14 +27,12 @@ function _interopNamespace(e) {
|
|
|
27
27
|
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
28
28
|
Object.defineProperty(n, k, d.get ? d : {
|
|
29
29
|
enumerable: true,
|
|
30
|
-
get: function () {
|
|
31
|
-
return e[k];
|
|
32
|
-
}
|
|
30
|
+
get: function () { return e[k]; }
|
|
33
31
|
});
|
|
34
32
|
}
|
|
35
33
|
});
|
|
36
34
|
}
|
|
37
|
-
n[
|
|
35
|
+
n["default"] = e;
|
|
38
36
|
return Object.freeze(n);
|
|
39
37
|
}
|
|
40
38
|
|
|
@@ -48,14 +46,9 @@ function ownKeys(object, enumerableOnly) {
|
|
|
48
46
|
|
|
49
47
|
if (Object.getOwnPropertySymbols) {
|
|
50
48
|
var symbols = Object.getOwnPropertySymbols(object);
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
55
|
-
});
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
keys.push.apply(keys, symbols);
|
|
49
|
+
enumerableOnly && (symbols = symbols.filter(function (sym) {
|
|
50
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
51
|
+
})), keys.push.apply(keys, symbols);
|
|
59
52
|
}
|
|
60
53
|
|
|
61
54
|
return keys;
|
|
@@ -63,19 +56,12 @@ function ownKeys(object, enumerableOnly) {
|
|
|
63
56
|
|
|
64
57
|
function _objectSpread2(target) {
|
|
65
58
|
for (var i = 1; i < arguments.length; i++) {
|
|
66
|
-
var source = arguments[i]
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
} else if (Object.getOwnPropertyDescriptors) {
|
|
73
|
-
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
74
|
-
} else {
|
|
75
|
-
ownKeys(Object(source)).forEach(function (key) {
|
|
76
|
-
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
77
|
-
});
|
|
78
|
-
}
|
|
59
|
+
var source = null != arguments[i] ? arguments[i] : {};
|
|
60
|
+
i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
|
|
61
|
+
_defineProperty(target, key, source[key]);
|
|
62
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
|
|
63
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
64
|
+
});
|
|
79
65
|
}
|
|
80
66
|
|
|
81
67
|
return target;
|
|
@@ -392,9 +378,9 @@ function getDate(dirtyDate) {
|
|
|
392
378
|
}
|
|
393
379
|
|
|
394
380
|
var COMPONENT_ID$b = 'datepickers.menu';
|
|
395
|
-
var StyledMenu = styled__default[
|
|
381
|
+
var StyledMenu = styled__default["default"].div.attrs({
|
|
396
382
|
'data-garden-id': COMPONENT_ID$b,
|
|
397
|
-
'data-garden-version': '8.47.
|
|
383
|
+
'data-garden-version': '8.47.2'
|
|
398
384
|
}).withConfig({
|
|
399
385
|
displayName: "StyledMenu",
|
|
400
386
|
componentId: "sc-1npbkk0-0"
|
|
@@ -406,7 +392,7 @@ StyledMenu.defaultProps = {
|
|
|
406
392
|
};
|
|
407
393
|
|
|
408
394
|
var COMPONENT_ID$a = 'datepickers.menu_wrapper';
|
|
409
|
-
var StyledMenuWrapper = styled__default[
|
|
395
|
+
var StyledMenuWrapper = styled__default["default"].div.attrs(function (props) {
|
|
410
396
|
return {
|
|
411
397
|
className: props.isAnimated && 'is-animated'
|
|
412
398
|
};
|
|
@@ -438,7 +424,7 @@ var retrievePadding = function retrievePadding(_ref) {
|
|
|
438
424
|
}
|
|
439
425
|
return "margin: ".concat(value, "px;");
|
|
440
426
|
};
|
|
441
|
-
var StyledDatepicker = styled__default[
|
|
427
|
+
var StyledDatepicker = styled__default["default"].div.attrs({
|
|
442
428
|
'data-garden-id': COMPONENT_ID$9
|
|
443
429
|
}).withConfig({
|
|
444
430
|
displayName: "StyledDatepicker",
|
|
@@ -457,7 +443,7 @@ StyledDatepicker.defaultProps = {
|
|
|
457
443
|
};
|
|
458
444
|
|
|
459
445
|
var COMPONENT_ID$8 = 'datepickers.range_calendar';
|
|
460
|
-
var StyledRangeCalendar = styled__default[
|
|
446
|
+
var StyledRangeCalendar = styled__default["default"].div.attrs({
|
|
461
447
|
'data-garden-id': COMPONENT_ID$8
|
|
462
448
|
}).withConfig({
|
|
463
449
|
displayName: "StyledRangeCalendar",
|
|
@@ -472,7 +458,7 @@ StyledRangeCalendar.defaultProps = {
|
|
|
472
458
|
};
|
|
473
459
|
|
|
474
460
|
var COMPONENT_ID$7 = 'datepickers.header';
|
|
475
|
-
var StyledHeader = styled__default[
|
|
461
|
+
var StyledHeader = styled__default["default"].div.attrs({
|
|
476
462
|
'data-garden-id': COMPONENT_ID$7
|
|
477
463
|
}).withConfig({
|
|
478
464
|
displayName: "StyledHeader",
|
|
@@ -500,7 +486,7 @@ var retrieveColor$1 = function retrieveColor(_ref2) {
|
|
|
500
486
|
return styled.css([":hover{background-color:", ";color:", ";}:active{background-color:", ";color:", ";}color:", ";"], reactTheming.getColor('primaryHue', 600, theme, 0.08), theme.colors.foreground, reactTheming.getColor('primaryHue', 600, theme, 0.2), theme.colors.foreground, reactTheming.getColor('neutralHue', 600, theme));
|
|
501
487
|
};
|
|
502
488
|
var COMPONENT_ID$6 = 'datepickers.header_paddle';
|
|
503
|
-
var StyledHeaderPaddle = styled__default[
|
|
489
|
+
var StyledHeaderPaddle = styled__default["default"].div.attrs({
|
|
504
490
|
'data-garden-id': COMPONENT_ID$6
|
|
505
491
|
}).withConfig({
|
|
506
492
|
displayName: "StyledHeaderPaddle",
|
|
@@ -522,7 +508,7 @@ StyledHeaderPaddle.defaultProps = {
|
|
|
522
508
|
};
|
|
523
509
|
|
|
524
510
|
var COMPONENT_ID$5 = 'datepickers.header_label';
|
|
525
|
-
var StyledHeaderLabel = styled__default[
|
|
511
|
+
var StyledHeaderLabel = styled__default["default"].div.attrs({
|
|
526
512
|
'data-garden-id': COMPONENT_ID$5
|
|
527
513
|
}).withConfig({
|
|
528
514
|
displayName: "StyledHeaderLabel",
|
|
@@ -539,7 +525,7 @@ StyledHeaderLabel.defaultProps = {
|
|
|
539
525
|
};
|
|
540
526
|
|
|
541
527
|
var COMPONENT_ID$4 = 'datepickers.calendar';
|
|
542
|
-
var StyledCalendar = styled__default[
|
|
528
|
+
var StyledCalendar = styled__default["default"].div.attrs({
|
|
543
529
|
'data-garden-id': COMPONENT_ID$4
|
|
544
530
|
}).withConfig({
|
|
545
531
|
displayName: "StyledCalendar",
|
|
@@ -565,7 +551,7 @@ var retrieveSize = function retrieveSize(_ref) {
|
|
|
565
551
|
}
|
|
566
552
|
return styled.css(["width:", ";height:", ";"], size, size);
|
|
567
553
|
};
|
|
568
|
-
var StyledCalendarItem = styled__default[
|
|
554
|
+
var StyledCalendarItem = styled__default["default"].div.attrs({
|
|
569
555
|
'data-garden-id': COMPONENT_ID$3
|
|
570
556
|
}).withConfig({
|
|
571
557
|
displayName: "StyledCalendarItem",
|
|
@@ -578,7 +564,7 @@ StyledCalendarItem.defaultProps = {
|
|
|
578
564
|
};
|
|
579
565
|
|
|
580
566
|
var COMPONENT_ID$2 = 'datepickers.day_label';
|
|
581
|
-
var StyledDayLabel = styled__default[
|
|
567
|
+
var StyledDayLabel = styled__default["default"].div.attrs({
|
|
582
568
|
'data-garden-id': COMPONENT_ID$2
|
|
583
569
|
}).withConfig({
|
|
584
570
|
displayName: "StyledDayLabel",
|
|
@@ -623,7 +609,7 @@ var retrieveColor = function retrieveColor(_ref2) {
|
|
|
623
609
|
}
|
|
624
610
|
return styled.css([""]);
|
|
625
611
|
};
|
|
626
|
-
var StyledHighlight = styled__default[
|
|
612
|
+
var StyledHighlight = styled__default["default"].div.attrs({
|
|
627
613
|
'data-garden-id': COMPONENT_ID$1
|
|
628
614
|
}).withConfig({
|
|
629
615
|
displayName: "StyledHighlight",
|
|
@@ -656,7 +642,7 @@ var retrieveStyledDayColors = function retrieveStyledDayColors(_ref) {
|
|
|
656
642
|
return styled.css(["background-color:", ";color:", ";", ""], backgroundColor, color, !isSelected && !isDisabled && "\n :hover {\n background-color: ".concat(reactTheming.getColor('primaryHue', 600, theme, 0.08), ";\n color: ").concat(reactTheming.getColor('primaryHue', 800, theme), ";\n }\n\n :active {\n background-color: ").concat(reactTheming.getColor('primaryHue', 600, theme, 0.2), ";\n color: ").concat(reactTheming.getColor('primaryHue', 800, theme), ";\n }\n "));
|
|
657
643
|
};
|
|
658
644
|
var COMPONENT_ID = 'datepickers.day';
|
|
659
|
-
var StyledDay = styled__default[
|
|
645
|
+
var StyledDay = styled__default["default"].div.attrs(function (props) {
|
|
660
646
|
return {
|
|
661
647
|
'data-garden-id': COMPONENT_ID,
|
|
662
648
|
'aria-disabled': props.isDisabled ? 'true' : 'false'
|
|
@@ -763,41 +749,41 @@ function getStartOfWeek(locale) {
|
|
|
763
749
|
return 0;
|
|
764
750
|
}
|
|
765
751
|
|
|
766
|
-
|
|
752
|
+
var _path$1;
|
|
767
753
|
|
|
768
|
-
|
|
769
|
-
fill: "currentColor",
|
|
770
|
-
d: "M10.39 12.688a.5.5 0 01-.718.69l-.062-.066-4-5a.5.5 0 01-.054-.542l.054-.082 4-5a.5.5 0 01.83.55l-.05.074L6.641 8l3.75 4.688z"
|
|
771
|
-
});
|
|
754
|
+
function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
|
|
772
755
|
|
|
773
|
-
function SvgChevronLeftStroke(props) {
|
|
756
|
+
var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
|
|
774
757
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
|
|
775
758
|
xmlns: "http://www.w3.org/2000/svg",
|
|
776
759
|
width: 16,
|
|
777
760
|
height: 16,
|
|
778
|
-
viewBox: "0 0 16 16",
|
|
779
761
|
focusable: "false",
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
}
|
|
762
|
+
viewBox: "0 0 16 16",
|
|
763
|
+
"aria-hidden": "true"
|
|
764
|
+
}, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
765
|
+
fill: "currentColor",
|
|
766
|
+
d: "M10.39 12.688a.5.5 0 01-.718.69l-.062-.066-4-5a.5.5 0 01-.054-.542l.054-.082 4-5a.5.5 0 01.83.55l-.05.074L6.641 8l3.75 4.688z"
|
|
767
|
+
})));
|
|
768
|
+
};
|
|
783
769
|
|
|
784
|
-
|
|
770
|
+
var _path;
|
|
785
771
|
|
|
786
|
-
var
|
|
787
|
-
fill: "currentColor",
|
|
788
|
-
d: "M5.61 3.312a.5.5 0 01.718-.69l.062.066 4 5a.5.5 0 01.054.542l-.054.082-4 5a.5.5 0 01-.83-.55l.05-.074L9.359 8l-3.75-4.688z"
|
|
789
|
-
});
|
|
772
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
790
773
|
|
|
791
|
-
function SvgChevronRightStroke(props) {
|
|
774
|
+
var SvgChevronRightStroke = function SvgChevronRightStroke(props) {
|
|
792
775
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
793
776
|
xmlns: "http://www.w3.org/2000/svg",
|
|
794
777
|
width: 16,
|
|
795
778
|
height: 16,
|
|
796
|
-
viewBox: "0 0 16 16",
|
|
797
779
|
focusable: "false",
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
}
|
|
780
|
+
viewBox: "0 0 16 16",
|
|
781
|
+
"aria-hidden": "true"
|
|
782
|
+
}, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
|
|
783
|
+
fill: "currentColor",
|
|
784
|
+
d: "M5.61 3.312a.5.5 0 01.718-.69l.062.066 4 5a.5.5 0 01.054.542l-.054.082-4 5a.5.5 0 01-.83-.55l.05-.074L9.359 8l-3.75-4.688z"
|
|
785
|
+
})));
|
|
786
|
+
};
|
|
801
787
|
|
|
802
788
|
var MonthSelector = function MonthSelector(_ref) {
|
|
803
789
|
var locale = _ref.locale,
|
|
@@ -812,25 +798,25 @@ var MonthSelector = function MonthSelector(_ref) {
|
|
|
812
798
|
});
|
|
813
799
|
return formatter.format(date);
|
|
814
800
|
}, [locale]);
|
|
815
|
-
return React__default[
|
|
801
|
+
return React__default["default"].createElement(StyledHeader, {
|
|
816
802
|
isCompact: isCompact
|
|
817
|
-
}, React__default[
|
|
803
|
+
}, React__default["default"].createElement(StyledHeaderPaddle, {
|
|
818
804
|
isCompact: isCompact,
|
|
819
805
|
onClick: function onClick() {
|
|
820
806
|
dispatch({
|
|
821
807
|
type: 'PREVIEW_PREVIOUS_MONTH'
|
|
822
808
|
});
|
|
823
809
|
}
|
|
824
|
-
}, React__default[
|
|
810
|
+
}, React__default["default"].createElement(SvgChevronLeftStroke, null)), React__default["default"].createElement(StyledHeaderLabel, {
|
|
825
811
|
isCompact: isCompact
|
|
826
|
-
}, headerLabelFormatter(state.previewDate)), React__default[
|
|
812
|
+
}, headerLabelFormatter(state.previewDate)), React__default["default"].createElement(StyledHeaderPaddle, {
|
|
827
813
|
isCompact: isCompact,
|
|
828
814
|
onClick: function onClick() {
|
|
829
815
|
dispatch({
|
|
830
816
|
type: 'PREVIEW_NEXT_MONTH'
|
|
831
817
|
});
|
|
832
818
|
}
|
|
833
|
-
}, React__default[
|
|
819
|
+
}, React__default["default"].createElement(SvgChevronRightStroke, null)));
|
|
834
820
|
};
|
|
835
821
|
|
|
836
822
|
var Calendar$1 = function Calendar(_ref) {
|
|
@@ -862,10 +848,10 @@ var Calendar$1 = function Calendar(_ref) {
|
|
|
862
848
|
end: addDays(startDate, 6)
|
|
863
849
|
}).map(function (date) {
|
|
864
850
|
var formattedDayLabel = dayLabelFormatter(date);
|
|
865
|
-
return React__default[
|
|
851
|
+
return React__default["default"].createElement(StyledCalendarItem, {
|
|
866
852
|
key: "day-label-".concat(formattedDayLabel),
|
|
867
853
|
isCompact: isCompact
|
|
868
|
-
}, React__default[
|
|
854
|
+
}, React__default["default"].createElement(StyledDayLabel, {
|
|
869
855
|
isCompact: isCompact
|
|
870
856
|
}, formattedDayLabel));
|
|
871
857
|
});
|
|
@@ -884,10 +870,10 @@ var Calendar$1 = function Calendar(_ref) {
|
|
|
884
870
|
if (maxValue !== undefined) {
|
|
885
871
|
isDisabled = isDisabled || isAfter(date, maxValue) && !isSameDay(date, maxValue);
|
|
886
872
|
}
|
|
887
|
-
return React__default[
|
|
873
|
+
return React__default["default"].createElement(StyledCalendarItem, {
|
|
888
874
|
key: "day-".concat(itemsIndex),
|
|
889
875
|
isCompact: isCompact
|
|
890
|
-
}, React__default[
|
|
876
|
+
}, React__default["default"].createElement(StyledDay, {
|
|
891
877
|
isToday: isCurrentDate,
|
|
892
878
|
isPreviousMonth: isPreviousMonth,
|
|
893
879
|
isSelected: isSelected,
|
|
@@ -903,15 +889,15 @@ var Calendar$1 = function Calendar(_ref) {
|
|
|
903
889
|
}
|
|
904
890
|
}, formattedDayLabel));
|
|
905
891
|
});
|
|
906
|
-
return React__default[
|
|
892
|
+
return React__default["default"].createElement(StyledDatepicker, {
|
|
907
893
|
isCompact: isCompact,
|
|
908
894
|
onMouseDown: function onMouseDown(e) {
|
|
909
895
|
e.preventDefault();
|
|
910
896
|
}
|
|
911
|
-
}, React__default[
|
|
897
|
+
}, React__default["default"].createElement(MonthSelector, {
|
|
912
898
|
locale: locale,
|
|
913
899
|
isCompact: isCompact
|
|
914
|
-
}), React__default[
|
|
900
|
+
}), React__default["default"].createElement(StyledCalendar, {
|
|
915
901
|
isCompact: isCompact
|
|
916
902
|
}, dayLabels, items));
|
|
917
903
|
};
|
|
@@ -3329,13 +3315,13 @@ var Datepicker = function Datepicker(props) {
|
|
|
3329
3315
|
dispatch: dispatch
|
|
3330
3316
|
};
|
|
3331
3317
|
}, [state, dispatch]);
|
|
3332
|
-
return React__default[
|
|
3318
|
+
return React__default["default"].createElement(DatepickerContext.Provider, {
|
|
3333
3319
|
value: contextValue
|
|
3334
|
-
}, React__default[
|
|
3320
|
+
}, React__default["default"].createElement(reactPopper.Manager, null, React__default["default"].createElement(reactPopper.Reference, null, function (_ref) {
|
|
3335
3321
|
var _React$cloneElement;
|
|
3336
3322
|
var ref = _ref.ref;
|
|
3337
|
-
var childElement = React__default[
|
|
3338
|
-
return React__default[
|
|
3323
|
+
var childElement = React__default["default"].Children.only(children);
|
|
3324
|
+
return React__default["default"].cloneElement(childElement, (_React$cloneElement = {}, _defineProperty(_React$cloneElement, refKey, function (refValue) {
|
|
3339
3325
|
ref(refValue);
|
|
3340
3326
|
inputRef.current = refValue;
|
|
3341
3327
|
}), _defineProperty(_React$cloneElement, "onMouseDown", containerUtilities.composeEventHandlers(childElement.props.onMouseDown, function () {
|
|
@@ -3376,7 +3362,7 @@ var Datepicker = function Datepicker(props) {
|
|
|
3376
3362
|
break;
|
|
3377
3363
|
}
|
|
3378
3364
|
})), _defineProperty(_React$cloneElement, "autoComplete", 'off'), _defineProperty(_React$cloneElement, "value", state.inputValue), _React$cloneElement));
|
|
3379
|
-
}), React__default[
|
|
3365
|
+
}), React__default["default"].createElement(reactPopper.Popper, {
|
|
3380
3366
|
placement: popperPlacement,
|
|
3381
3367
|
modifiers: popperModifiers
|
|
3382
3368
|
,
|
|
@@ -3387,14 +3373,14 @@ var Datepicker = function Datepicker(props) {
|
|
|
3387
3373
|
scheduleUpdate = _ref2.scheduleUpdate,
|
|
3388
3374
|
currentPlacement = _ref2.placement;
|
|
3389
3375
|
scheduleUpdateRef.current = scheduleUpdate;
|
|
3390
|
-
return React__default[
|
|
3376
|
+
return React__default["default"].createElement(StyledMenuWrapper, {
|
|
3391
3377
|
ref: ref,
|
|
3392
3378
|
style: style,
|
|
3393
3379
|
isHidden: !state.isOpen,
|
|
3394
3380
|
isAnimated: isAnimated && (state.isOpen || isVisible),
|
|
3395
3381
|
placement: currentPlacement,
|
|
3396
3382
|
zIndex: zIndex
|
|
3397
|
-
}, (state.isOpen || isVisible) && React__default[
|
|
3383
|
+
}, (state.isOpen || isVisible) && React__default["default"].createElement(StyledMenu, null, React__default["default"].createElement(Calendar$1, {
|
|
3398
3384
|
isCompact: isCompact,
|
|
3399
3385
|
value: value,
|
|
3400
3386
|
minValue: minValue,
|
|
@@ -3404,20 +3390,20 @@ var Datepicker = function Datepicker(props) {
|
|
|
3404
3390
|
})));
|
|
3405
3391
|
};
|
|
3406
3392
|
Datepicker.propTypes = {
|
|
3407
|
-
value: PropTypes__default[
|
|
3408
|
-
onChange: PropTypes__default[
|
|
3409
|
-
formatDate: PropTypes__default[
|
|
3410
|
-
locale: PropTypes__default[
|
|
3411
|
-
minValue: PropTypes__default[
|
|
3412
|
-
maxValue: PropTypes__default[
|
|
3413
|
-
isCompact: PropTypes__default[
|
|
3414
|
-
customParseDate: PropTypes__default[
|
|
3415
|
-
refKey: PropTypes__default[
|
|
3416
|
-
placement: PropTypes__default[
|
|
3417
|
-
popperModifiers: PropTypes__default[
|
|
3418
|
-
isAnimated: PropTypes__default[
|
|
3419
|
-
eventsEnabled: PropTypes__default[
|
|
3420
|
-
zIndex: PropTypes__default[
|
|
3393
|
+
value: PropTypes__default["default"].any,
|
|
3394
|
+
onChange: PropTypes__default["default"].any,
|
|
3395
|
+
formatDate: PropTypes__default["default"].func,
|
|
3396
|
+
locale: PropTypes__default["default"].any,
|
|
3397
|
+
minValue: PropTypes__default["default"].any,
|
|
3398
|
+
maxValue: PropTypes__default["default"].any,
|
|
3399
|
+
isCompact: PropTypes__default["default"].bool,
|
|
3400
|
+
customParseDate: PropTypes__default["default"].any,
|
|
3401
|
+
refKey: PropTypes__default["default"].string,
|
|
3402
|
+
placement: PropTypes__default["default"].oneOf(['auto', 'top', 'top-start', 'top-end', 'end', 'end-top', 'end-bottom', 'bottom', 'bottom-start', 'bottom-end', 'start', 'start-top', 'start-bottom']),
|
|
3403
|
+
popperModifiers: PropTypes__default["default"].any,
|
|
3404
|
+
isAnimated: PropTypes__default["default"].bool,
|
|
3405
|
+
eventsEnabled: PropTypes__default["default"].bool,
|
|
3406
|
+
zIndex: PropTypes__default["default"].number
|
|
3421
3407
|
};
|
|
3422
3408
|
Datepicker.defaultProps = {
|
|
3423
3409
|
placement: 'bottom-start',
|
|
@@ -3770,8 +3756,8 @@ var Start = function Start(props) {
|
|
|
3770
3756
|
});
|
|
3771
3757
|
props.children.props.onBlur && props.children.props.onBlur(e);
|
|
3772
3758
|
}, [dispatch, props.children]);
|
|
3773
|
-
var childElement = React__default[
|
|
3774
|
-
return React__default[
|
|
3759
|
+
var childElement = React__default["default"].Children.only(props.children);
|
|
3760
|
+
return React__default["default"].cloneElement(childElement, {
|
|
3775
3761
|
value: state.startInputValue,
|
|
3776
3762
|
ref: startInputRef,
|
|
3777
3763
|
onChange: containerUtilities.composeEventHandlers(childElement.props.onChange, onChangeCallback),
|
|
@@ -3814,8 +3800,8 @@ var End = function End(props) {
|
|
|
3814
3800
|
});
|
|
3815
3801
|
props.children.props.onBlur && props.children.props.onBlur(e);
|
|
3816
3802
|
}, [dispatch, props.children]);
|
|
3817
|
-
var childElement = React__default[
|
|
3818
|
-
return React__default[
|
|
3803
|
+
var childElement = React__default["default"].Children.only(props.children);
|
|
3804
|
+
return React__default["default"].cloneElement(childElement, {
|
|
3819
3805
|
value: state.endInputValue,
|
|
3820
3806
|
ref: endInputRef,
|
|
3821
3807
|
onChange: containerUtilities.composeEventHandlers(childElement.props.onChange, onChangeCallback),
|
|
@@ -3876,10 +3862,10 @@ var Month = function Month(_ref) {
|
|
|
3876
3862
|
end: addDays(startDate, 6)
|
|
3877
3863
|
}).map(function (date) {
|
|
3878
3864
|
var formattedDayLabel = dayLabelFormatter(date);
|
|
3879
|
-
return React__default[
|
|
3865
|
+
return React__default["default"].createElement(StyledCalendarItem, {
|
|
3880
3866
|
key: "day-label-".concat(formattedDayLabel),
|
|
3881
3867
|
isCompact: isCompact
|
|
3882
|
-
}, React__default[
|
|
3868
|
+
}, React__default["default"].createElement(StyledDayLabel, {
|
|
3883
3869
|
isCompact: isCompact
|
|
3884
3870
|
}, formattedDayLabel));
|
|
3885
3871
|
});
|
|
@@ -3891,10 +3877,10 @@ var Month = function Month(_ref) {
|
|
|
3891
3877
|
var isCurrentDate = isToday(date);
|
|
3892
3878
|
var isPreviousMonth = !isSameMonth(date, displayDate);
|
|
3893
3879
|
if (isPreviousMonth) {
|
|
3894
|
-
return React__default[
|
|
3880
|
+
return React__default["default"].createElement(StyledCalendarItem, {
|
|
3895
3881
|
key: "day-".concat(itemsIndex),
|
|
3896
3882
|
isCompact: isCompact
|
|
3897
|
-
}, React__default[
|
|
3883
|
+
}, React__default["default"].createElement(StyledDay, {
|
|
3898
3884
|
isCompact: isCompact,
|
|
3899
3885
|
isPreviousMonth: true,
|
|
3900
3886
|
isDisabled: true
|
|
@@ -3939,14 +3925,14 @@ var Month = function Month(_ref) {
|
|
|
3939
3925
|
isInvalidDateRange = isInvalidDateRange || compareAsc(endValue, maxValue) === 1;
|
|
3940
3926
|
}
|
|
3941
3927
|
}
|
|
3942
|
-
return React__default[
|
|
3928
|
+
return React__default["default"].createElement(StyledCalendarItem, {
|
|
3943
3929
|
key: "day-".concat(itemsIndex),
|
|
3944
3930
|
isCompact: isCompact
|
|
3945
|
-
}, React__default[
|
|
3931
|
+
}, React__default["default"].createElement(StyledHighlight, {
|
|
3946
3932
|
isHighlighted: !isInvalidDateRange && isHighlighted && !isDisabled,
|
|
3947
3933
|
isStart: !isInvalidDateRange && isHighlightStart,
|
|
3948
3934
|
isEnd: !isInvalidDateRange && isHighlightEnd
|
|
3949
|
-
}), React__default[
|
|
3935
|
+
}), React__default["default"].createElement(StyledDay, {
|
|
3950
3936
|
isToday: isCurrentDate,
|
|
3951
3937
|
isPreviousMonth: isPreviousMonth,
|
|
3952
3938
|
isSelected: !isInvalidDateRange && isSelected,
|
|
@@ -3970,14 +3956,14 @@ var Month = function Month(_ref) {
|
|
|
3970
3956
|
}
|
|
3971
3957
|
}, formattedDayLabel));
|
|
3972
3958
|
});
|
|
3973
|
-
return React__default[
|
|
3959
|
+
return React__default["default"].createElement(StyledDatepicker, {
|
|
3974
3960
|
isCompact: isCompact,
|
|
3975
3961
|
onMouseDown: function onMouseDown(e) {
|
|
3976
3962
|
e.preventDefault();
|
|
3977
3963
|
}
|
|
3978
|
-
}, React__default[
|
|
3964
|
+
}, React__default["default"].createElement(StyledHeader, {
|
|
3979
3965
|
isCompact: isCompact
|
|
3980
|
-
}, React__default[
|
|
3966
|
+
}, React__default["default"].createElement(StyledHeaderPaddle, {
|
|
3981
3967
|
isCompact: isCompact,
|
|
3982
3968
|
onClick: function onClick() {
|
|
3983
3969
|
dispatch({
|
|
@@ -3985,9 +3971,9 @@ var Month = function Month(_ref) {
|
|
|
3985
3971
|
});
|
|
3986
3972
|
},
|
|
3987
3973
|
isHidden: isPreviousHidden
|
|
3988
|
-
}, React__default[
|
|
3974
|
+
}, React__default["default"].createElement(SvgChevronLeftStroke, null)), React__default["default"].createElement(StyledHeaderLabel, {
|
|
3989
3975
|
isCompact: isCompact
|
|
3990
|
-
}, headerLabelFormatter(displayDate)), React__default[
|
|
3976
|
+
}, headerLabelFormatter(displayDate)), React__default["default"].createElement(StyledHeaderPaddle, {
|
|
3991
3977
|
isCompact: isCompact,
|
|
3992
3978
|
isHidden: isNextHidden,
|
|
3993
3979
|
onClick: function onClick() {
|
|
@@ -3995,7 +3981,7 @@ var Month = function Month(_ref) {
|
|
|
3995
3981
|
type: 'PREVIEW_NEXT_MONTH'
|
|
3996
3982
|
});
|
|
3997
3983
|
}
|
|
3998
|
-
}, React__default[
|
|
3984
|
+
}, React__default["default"].createElement(SvgChevronRightStroke, null))), React__default["default"].createElement(StyledCalendar, {
|
|
3999
3985
|
isCompact: isCompact,
|
|
4000
3986
|
onMouseLeave: function onMouseLeave() {
|
|
4001
3987
|
dispatch({
|
|
@@ -4017,10 +4003,10 @@ var Calendar = function Calendar(props) {
|
|
|
4017
4003
|
startValue = _useDatepickerRangeCo.startValue,
|
|
4018
4004
|
endValue = _useDatepickerRangeCo.endValue,
|
|
4019
4005
|
onChange = _useDatepickerRangeCo.onChange;
|
|
4020
|
-
return React__default[
|
|
4006
|
+
return React__default["default"].createElement(StyledRangeCalendar, _extends$2({
|
|
4021
4007
|
"data-garden-id": "datepickers.range",
|
|
4022
|
-
"data-garden-version": '8.47.
|
|
4023
|
-
}, props), React__default[
|
|
4008
|
+
"data-garden-version": '8.47.2'
|
|
4009
|
+
}, props), React__default["default"].createElement(Month, {
|
|
4024
4010
|
locale: locale,
|
|
4025
4011
|
displayDate: state.previewDate,
|
|
4026
4012
|
isCompact: isCompact,
|
|
@@ -4032,7 +4018,7 @@ var Calendar = function Calendar(props) {
|
|
|
4032
4018
|
endValue: endValue,
|
|
4033
4019
|
onChange: onChange,
|
|
4034
4020
|
hoverDate: state.hoverDate
|
|
4035
|
-
}), React__default[
|
|
4021
|
+
}), React__default["default"].createElement(Month, {
|
|
4036
4022
|
locale: locale,
|
|
4037
4023
|
displayDate: addMonths(state.previewDate, 1),
|
|
4038
4024
|
isCompact: isCompact,
|
|
@@ -4109,7 +4095,7 @@ var DatepickerRange = function DatepickerRange(props) {
|
|
|
4109
4095
|
endInputRef: endInputRef
|
|
4110
4096
|
};
|
|
4111
4097
|
}, [state, dispatch, isCompact, locale, minValue, maxValue, startValue, endValue, onChange, startInputRef, endInputRef]);
|
|
4112
|
-
return React__default[
|
|
4098
|
+
return React__default["default"].createElement(DatepickerRangeContext.Provider, {
|
|
4113
4099
|
value: value
|
|
4114
4100
|
}, children);
|
|
4115
4101
|
};
|
|
@@ -4117,15 +4103,15 @@ DatepickerRange.Start = Start;
|
|
|
4117
4103
|
DatepickerRange.End = End;
|
|
4118
4104
|
DatepickerRange.Calendar = Calendar;
|
|
4119
4105
|
DatepickerRange.propTypes = {
|
|
4120
|
-
locale: PropTypes__default[
|
|
4121
|
-
startValue: PropTypes__default[
|
|
4122
|
-
endValue: PropTypes__default[
|
|
4123
|
-
minValue: PropTypes__default[
|
|
4124
|
-
maxValue: PropTypes__default[
|
|
4125
|
-
onChange: PropTypes__default[
|
|
4126
|
-
formatDate: PropTypes__default[
|
|
4127
|
-
customParseDate: PropTypes__default[
|
|
4128
|
-
isCompact: PropTypes__default[
|
|
4106
|
+
locale: PropTypes__default["default"].string,
|
|
4107
|
+
startValue: PropTypes__default["default"].instanceOf(Date),
|
|
4108
|
+
endValue: PropTypes__default["default"].instanceOf(Date),
|
|
4109
|
+
minValue: PropTypes__default["default"].instanceOf(Date),
|
|
4110
|
+
maxValue: PropTypes__default["default"].instanceOf(Date),
|
|
4111
|
+
onChange: PropTypes__default["default"].func,
|
|
4112
|
+
formatDate: PropTypes__default["default"].func,
|
|
4113
|
+
customParseDate: PropTypes__default["default"].func,
|
|
4114
|
+
isCompact: PropTypes__default["default"].bool
|
|
4129
4115
|
};
|
|
4130
4116
|
DatepickerRange.defaultProps = {
|
|
4131
4117
|
locale: 'en-US',
|
package/dist/index.esm.js
CHANGED
|
@@ -18,14 +18,9 @@ function ownKeys(object, enumerableOnly) {
|
|
|
18
18
|
|
|
19
19
|
if (Object.getOwnPropertySymbols) {
|
|
20
20
|
var symbols = Object.getOwnPropertySymbols(object);
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
keys.push.apply(keys, symbols);
|
|
21
|
+
enumerableOnly && (symbols = symbols.filter(function (sym) {
|
|
22
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
23
|
+
})), keys.push.apply(keys, symbols);
|
|
29
24
|
}
|
|
30
25
|
|
|
31
26
|
return keys;
|
|
@@ -33,19 +28,12 @@ function ownKeys(object, enumerableOnly) {
|
|
|
33
28
|
|
|
34
29
|
function _objectSpread2(target) {
|
|
35
30
|
for (var i = 1; i < arguments.length; i++) {
|
|
36
|
-
var source = arguments[i]
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
} else if (Object.getOwnPropertyDescriptors) {
|
|
43
|
-
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
44
|
-
} else {
|
|
45
|
-
ownKeys(Object(source)).forEach(function (key) {
|
|
46
|
-
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
47
|
-
});
|
|
48
|
-
}
|
|
31
|
+
var source = null != arguments[i] ? arguments[i] : {};
|
|
32
|
+
i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
|
|
33
|
+
_defineProperty(target, key, source[key]);
|
|
34
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
|
|
35
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
36
|
+
});
|
|
49
37
|
}
|
|
50
38
|
|
|
51
39
|
return target;
|
|
@@ -364,7 +352,7 @@ function getDate(dirtyDate) {
|
|
|
364
352
|
var COMPONENT_ID$b = 'datepickers.menu';
|
|
365
353
|
var StyledMenu = styled.div.attrs({
|
|
366
354
|
'data-garden-id': COMPONENT_ID$b,
|
|
367
|
-
'data-garden-version': '8.47.
|
|
355
|
+
'data-garden-version': '8.47.2'
|
|
368
356
|
}).withConfig({
|
|
369
357
|
displayName: "StyledMenu",
|
|
370
358
|
componentId: "sc-1npbkk0-0"
|
|
@@ -733,41 +721,41 @@ function getStartOfWeek(locale) {
|
|
|
733
721
|
return 0;
|
|
734
722
|
}
|
|
735
723
|
|
|
736
|
-
|
|
724
|
+
var _path$1;
|
|
737
725
|
|
|
738
|
-
|
|
739
|
-
fill: "currentColor",
|
|
740
|
-
d: "M10.39 12.688a.5.5 0 01-.718.69l-.062-.066-4-5a.5.5 0 01-.054-.542l.054-.082 4-5a.5.5 0 01.83.55l-.05.074L6.641 8l3.75 4.688z"
|
|
741
|
-
});
|
|
726
|
+
function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
|
|
742
727
|
|
|
743
|
-
function SvgChevronLeftStroke(props) {
|
|
728
|
+
var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
|
|
744
729
|
return /*#__PURE__*/React.createElement("svg", _extends$1({
|
|
745
730
|
xmlns: "http://www.w3.org/2000/svg",
|
|
746
731
|
width: 16,
|
|
747
732
|
height: 16,
|
|
748
|
-
viewBox: "0 0 16 16",
|
|
749
733
|
focusable: "false",
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
}
|
|
734
|
+
viewBox: "0 0 16 16",
|
|
735
|
+
"aria-hidden": "true"
|
|
736
|
+
}, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
|
|
737
|
+
fill: "currentColor",
|
|
738
|
+
d: "M10.39 12.688a.5.5 0 01-.718.69l-.062-.066-4-5a.5.5 0 01-.054-.542l.054-.082 4-5a.5.5 0 01.83.55l-.05.074L6.641 8l3.75 4.688z"
|
|
739
|
+
})));
|
|
740
|
+
};
|
|
753
741
|
|
|
754
|
-
|
|
742
|
+
var _path;
|
|
755
743
|
|
|
756
|
-
var
|
|
757
|
-
fill: "currentColor",
|
|
758
|
-
d: "M5.61 3.312a.5.5 0 01.718-.69l.062.066 4 5a.5.5 0 01.054.542l-.054.082-4 5a.5.5 0 01-.83-.55l.05-.074L9.359 8l-3.75-4.688z"
|
|
759
|
-
});
|
|
744
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
760
745
|
|
|
761
|
-
function SvgChevronRightStroke(props) {
|
|
746
|
+
var SvgChevronRightStroke = function SvgChevronRightStroke(props) {
|
|
762
747
|
return /*#__PURE__*/React.createElement("svg", _extends({
|
|
763
748
|
xmlns: "http://www.w3.org/2000/svg",
|
|
764
749
|
width: 16,
|
|
765
750
|
height: 16,
|
|
766
|
-
viewBox: "0 0 16 16",
|
|
767
751
|
focusable: "false",
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
}
|
|
752
|
+
viewBox: "0 0 16 16",
|
|
753
|
+
"aria-hidden": "true"
|
|
754
|
+
}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
|
|
755
|
+
fill: "currentColor",
|
|
756
|
+
d: "M5.61 3.312a.5.5 0 01.718-.69l.062.066 4 5a.5.5 0 01.054.542l-.054.082-4 5a.5.5 0 01-.83-.55l.05-.074L9.359 8l-3.75-4.688z"
|
|
757
|
+
})));
|
|
758
|
+
};
|
|
771
759
|
|
|
772
760
|
var MonthSelector = function MonthSelector(_ref) {
|
|
773
761
|
var locale = _ref.locale,
|
|
@@ -3989,7 +3977,7 @@ var Calendar = function Calendar(props) {
|
|
|
3989
3977
|
onChange = _useDatepickerRangeCo.onChange;
|
|
3990
3978
|
return React__default.createElement(StyledRangeCalendar, _extends$2({
|
|
3991
3979
|
"data-garden-id": "datepickers.range",
|
|
3992
|
-
"data-garden-version": '8.47.
|
|
3980
|
+
"data-garden-version": '8.47.2'
|
|
3993
3981
|
}, props), React__default.createElement(Month, {
|
|
3994
3982
|
locale: locale,
|
|
3995
3983
|
displayDate: state.previewDate,
|
|
@@ -60,8 +60,8 @@ export interface IDatepickerRangeProps {
|
|
|
60
60
|
}
|
|
61
61
|
export declare const DatepickerRange: {
|
|
62
62
|
(props: PropsWithChildren<IDatepickerRangeProps>): JSX.Element;
|
|
63
|
-
Start: (props: React.PropsWithChildren<React.HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string |
|
|
64
|
-
End: (props: React.PropsWithChildren<React.HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string |
|
|
63
|
+
Start: (props: React.PropsWithChildren<React.HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
64
|
+
End: (props: React.PropsWithChildren<React.HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
65
65
|
Calendar: React.FunctionComponent<React.HTMLAttributes<HTMLDivElement>>;
|
|
66
66
|
propTypes: {
|
|
67
67
|
locale: PropTypes.Requireable<string>;
|
|
@@ -5,5 +5,5 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import React, { PropsWithChildren, HTMLAttributes } from 'react';
|
|
8
|
-
declare const End: (props: PropsWithChildren<HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string |
|
|
8
|
+
declare const End: (props: PropsWithChildren<HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
9
9
|
export default End;
|
|
@@ -5,5 +5,5 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import React, { PropsWithChildren, HTMLAttributes } from 'react';
|
|
8
|
-
declare const Start: (props: PropsWithChildren<HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string |
|
|
8
|
+
declare const Start: (props: PropsWithChildren<HTMLAttributes<HTMLInputElement>>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
9
9
|
export default Start;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-datepickers",
|
|
3
|
-
"version": "8.47.
|
|
3
|
+
"version": "8.47.2",
|
|
4
4
|
"description": "Components relating to datepickers in the Garden Design System",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Zendesk Garden <garden@zendesk.com>",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"sideEffects": false,
|
|
22
22
|
"types": "dist/typings/index.d.ts",
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@zendeskgarden/container-utilities": "^0.
|
|
24
|
+
"@zendeskgarden/container-utilities": "^0.7.0",
|
|
25
25
|
"date-fns": "^2.0.0-beta.2",
|
|
26
26
|
"prop-types": "^15.5.7",
|
|
27
27
|
"react-popper": "^1.3.4"
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"styled-components": "^4.2.0 || ^5.0.0"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
|
-
"@zendeskgarden/react-theming": "^8.47.
|
|
36
|
+
"@zendeskgarden/react-theming": "^8.47.2",
|
|
37
37
|
"@zendeskgarden/svg-icons": "6.30.2"
|
|
38
38
|
},
|
|
39
39
|
"keywords": [
|
|
@@ -46,5 +46,5 @@
|
|
|
46
46
|
"access": "public"
|
|
47
47
|
},
|
|
48
48
|
"zendeskgarden:src": "src/index.ts",
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "41cb43f285760417ae2145e47eca0e4a600455ab"
|
|
50
50
|
}
|