@driveflux/beam 3.0.19 → 3.0.20
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/accordion/Accordion.js +203 -7
- package/dist/accordion/Accordion.stories.js +31 -11
- package/dist/alert/Alert.js +193 -19
- package/dist/alert/Alert.stories.js +50 -15
- package/dist/animations/LoadingAnimation.js +34 -21
- package/dist/badge/Badge.js +105 -7
- package/dist/badge/Badge.stories.js +28 -7
- package/dist/box/Box.js +151 -3
- package/dist/box/Box.stories.js +8 -7
- package/dist/breadcrumbs/Breadcrumbs.js +351 -26
- package/dist/breadcrumbs/Breadcrumbs.stories.js +51 -27
- package/dist/button/Button.js +190 -12
- package/dist/button/Button.stories.js +35 -7
- package/dist/button/TextButton.js +168 -9
- package/dist/card/Card.js +188 -7
- package/dist/card/Card.stories.js +10 -7
- package/dist/carousel/Carousel.js +308 -58
- package/dist/carousel/Carousel.stories.js +39 -7
- package/dist/carousel/CarouselButton.js +132 -7
- package/dist/center/Center.js +127 -3
- package/dist/center/Center.stories.js +19 -7
- package/dist/checkbox/Checkbox.js +188 -4
- package/dist/checkbox/Checkbox.stories.js +10 -8
- package/dist/chip/Chip.js +168 -3
- package/dist/chip/Chip.stories.js +19 -7
- package/dist/circular-progress/CircularProgress.js +159 -11
- package/dist/circular-progress/CircularProgress.stories.js +54 -14
- package/dist/command/command.js +249 -13
- package/dist/datepicker/DatePicker.js +245 -90
- package/dist/datepicker/DatePicker.stories.js +162 -58
- package/dist/datepicker/DatePickerDrawer.js +115 -17
- package/dist/datepicker/DatePickerPopover.js +208 -35
- package/dist/datepicker/constants.js +3 -4
- package/dist/datepicker/utils.js +4 -11
- package/dist/dialog/index.js +253 -12
- package/dist/divider/Divider.js +127 -3
- package/dist/divider/Divider.stories.js +13 -7
- package/dist/drawer/index.js +230 -12
- package/dist/dropdown/Dropdown.js +297 -26
- package/dist/dropdown/Dropdown.stories.js +109 -22
- package/dist/field-wrapper/FieldWrapper.js +203 -3
- package/dist/field-wrapper/FieldWrapper.stories.js +124 -28
- package/dist/flex/Flex.js +127 -3
- package/dist/flex/Flex.stories.js +19 -7
- package/dist/grid/Grid.js +127 -3
- package/dist/grid/Grid.stories.js +28 -7
- package/dist/hooks/use-breakpoint-value.js +77 -14
- package/dist/hooks/use-media-query.js +61 -12
- package/dist/hstack/HStack.js +127 -3
- package/dist/hstack/HStack.stories.js +19 -7
- package/dist/icons/FluxLogo.js +222 -9
- package/dist/icons/FluxLogoTable.js +118 -5
- package/dist/icons/Icon.js +117 -7
- package/dist/icons/Icon.stories.js +12 -7
- package/dist/icons/Icon24Hours.js +92 -5
- package/dist/icons/IconAcceleration.js +81 -4
- package/dist/icons/IconAccount.js +81 -4
- package/dist/icons/IconApplicant.js +87 -5
- package/dist/icons/IconArrow.js +87 -6
- package/dist/icons/IconArrowBack.js +81 -4
- package/dist/icons/IconArrowForward.js +81 -4
- package/dist/icons/IconArrowTopLeft.js +79 -4
- package/dist/icons/IconBluesharkProductGuide.js +89 -5
- package/dist/icons/IconBolt.js +81 -4
- package/dist/icons/IconBriefcase.js +81 -4
- package/dist/icons/IconBulb.js +81 -4
- package/dist/icons/IconCalendar.js +81 -4
- package/dist/icons/IconCalendarArrowBack.js +81 -4
- package/dist/icons/IconCalendarArrowForward.js +81 -4
- package/dist/icons/IconCalendarDoubleArrowBack.js +81 -4
- package/dist/icons/IconCalendarDoubleArrowForward.js +81 -4
- package/dist/icons/IconCancel.js +86 -5
- package/dist/icons/IconCancelMark.js +81 -4
- package/dist/icons/IconCarSUV.js +81 -4
- package/dist/icons/IconCarSedan.js +156 -7
- package/dist/icons/IconChain.js +88 -5
- package/dist/icons/IconCheckmark.js +81 -4
- package/dist/icons/IconChevronRight.js +81 -4
- package/dist/icons/IconCircle.js +123 -11
- package/dist/icons/IconCircleCheckmark.js +86 -5
- package/dist/icons/IconCircleError.js +81 -4
- package/dist/icons/IconCircleExclamation.js +113 -6
- package/dist/icons/IconCircleMark.js +87 -5
- package/dist/icons/IconCircleOutline.js +148 -5
- package/dist/icons/IconClock.js +89 -5
- package/dist/icons/IconClose.js +81 -4
- package/dist/icons/IconCollapseAll.js +103 -5
- package/dist/icons/IconConcierge.js +88 -5
- package/dist/icons/IconConciergeService.js +96 -5
- package/dist/icons/IconCreditCard.js +87 -5
- package/dist/icons/IconDash.js +81 -4
- package/dist/icons/IconDeliver.js +81 -4
- package/dist/icons/IconDelivery.js +96 -5
- package/dist/icons/IconDetails.js +81 -4
- package/dist/icons/IconDot.js +96 -6
- package/dist/icons/IconDownload.js +88 -5
- package/dist/icons/IconEVCharging.js +88 -5
- package/dist/icons/IconElectricCarFuel.js +89 -5
- package/dist/icons/IconEllipsis.js +87 -5
- package/dist/icons/IconEnvelope.js +81 -4
- package/dist/icons/IconExpandAll.js +103 -5
- package/dist/icons/IconEye.js +88 -5
- package/dist/icons/IconFacebook.js +103 -6
- package/dist/icons/IconFilter.js +92 -5
- package/dist/icons/IconFlagMalaysia.js +150 -5
- package/dist/icons/IconGiveKey.js +88 -5
- package/dist/icons/IconGlobe.js +79 -4
- package/dist/icons/IconGoogle.js +96 -5
- package/dist/icons/IconHome.js +87 -5
- package/dist/icons/IconHostAdvertise.js +81 -4
- package/dist/icons/IconHostCar.js +84 -4
- package/dist/icons/IconHostCash.js +100 -5
- package/dist/icons/IconHostHandle.js +79 -4
- package/dist/icons/IconHostLocation.js +79 -4
- package/dist/icons/IconHostPayment.js +100 -5
- package/dist/icons/IconHostService.js +88 -5
- package/dist/icons/IconHotDeals.js +81 -4
- package/dist/icons/IconInfo.js +86 -5
- package/dist/icons/IconInstagram.js +81 -4
- package/dist/icons/IconInsurance.js +108 -5
- package/dist/icons/IconInternet.js +82 -4
- package/dist/icons/IconInventory.js +87 -5
- package/dist/icons/IconLaurel.js +110 -5
- package/dist/icons/IconLinkedIn.js +81 -4
- package/dist/icons/IconLoading.js +87 -4
- package/dist/icons/IconLocation.js +89 -5
- package/dist/icons/IconLock.js +82 -4
- package/dist/icons/IconLogistics.js +81 -4
- package/dist/icons/IconMail.js +103 -5
- package/dist/icons/IconMember.js +87 -5
- package/dist/icons/IconMobilePen.js +92 -5
- package/dist/icons/IconMotorcycleMoped.js +87 -5
- package/dist/icons/IconNoCost.js +101 -5
- package/dist/icons/IconPDF.js +89 -5
- package/dist/icons/IconPencil.js +79 -4
- package/dist/icons/IconPhone.js +79 -4
- package/dist/icons/IconPlus.js +81 -4
- package/dist/icons/IconPricing.js +81 -4
- package/dist/icons/IconProtected.js +80 -4
- package/dist/icons/IconPsychology.js +81 -4
- package/dist/icons/IconQuestionTooltip.js +137 -4
- package/dist/icons/IconQuote.js +81 -4
- package/dist/icons/IconRate.js +80 -4
- package/dist/icons/IconRegister.js +108 -5
- package/dist/icons/IconReport.js +98 -6
- package/dist/icons/IconReturn.js +81 -4
- package/dist/icons/IconSearch.js +79 -4
- package/dist/icons/IconSecure.js +80 -4
- package/dist/icons/IconSecurity.js +82 -4
- package/dist/icons/IconSedanOutline.js +168 -5
- package/dist/icons/IconSelectArrow.js +87 -6
- package/dist/icons/IconSort.js +88 -5
- package/dist/icons/IconSortListed.js +104 -5
- package/dist/icons/IconSortPriceAscending.js +92 -5
- package/dist/icons/IconSortPriceDescending.js +92 -5
- package/dist/icons/IconSortYear.js +88 -5
- package/dist/icons/IconSpan.js +80 -4
- package/dist/icons/IconSpeaker.js +88 -4
- package/dist/icons/IconSpecialCar.js +104 -5
- package/dist/icons/IconStar.js +101 -7
- package/dist/icons/IconStockPhoto.js +104 -5
- package/dist/icons/IconSubscription.js +122 -6
- package/dist/icons/IconSubscriptions.js +122 -6
- package/dist/icons/IconSwap.js +88 -5
- package/dist/icons/IconTax.js +81 -4
- package/dist/icons/IconThinArrow.js +87 -6
- package/dist/icons/IconThumbsdown.js +87 -5
- package/dist/icons/IconThumbsup.js +87 -5
- package/dist/icons/IconTool.js +81 -4
- package/dist/icons/IconTooltip.js +137 -4
- package/dist/icons/IconTrash.js +81 -4
- package/dist/icons/IconTriangleExclamation.js +81 -4
- package/dist/icons/IconTyersBrakes.js +92 -5
- package/dist/icons/IconTyre.js +92 -5
- package/dist/icons/IconVacancy.js +87 -5
- package/dist/icons/IconVolunteer.js +81 -4
- package/dist/icons/IconWhatsapp.js +82 -4
- package/dist/icons/IconXPlatform.js +81 -4
- package/dist/icons/IconZeroEffort.js +86 -5
- package/dist/icons/Logo.js +108 -3
- package/dist/input/Input.js +134 -11
- package/dist/input/Input.stories.js +17 -18
- package/dist/input-mask/InputMask.js +158 -11
- package/dist/input-mask/InputMask.stories.js +5 -6
- package/dist/input-mask/mask-trackers.js +4 -5
- package/dist/input-select/InputSelect.js +390 -68
- package/dist/input-select/InputSelect.stories.js +98 -25
- package/dist/popover/popover.js +136 -4
- package/dist/progress/Progress.js +160 -2
- package/dist/progress/Progress.stories.js +13 -14
- package/dist/radio/Radio.js +227 -4
- package/dist/scroll-area/scroll-area.js +180 -5
- package/dist/search-input-select/SearchInputSelect.js +379 -69
- package/dist/select/Select.js +354 -29
- package/dist/select/Select.stories.js +55 -19
- package/dist/skeleton/Skeleton.js +71 -3
- package/dist/skeleton/Skeleton.stories.js +8 -7
- package/dist/slider/Slider.js +170 -5
- package/dist/slider/Slider.stories.js +12 -11
- package/dist/stack/Stack.js +127 -3
- package/dist/stack/Stack.stories.js +19 -7
- package/dist/table/Table.js +216 -10
- package/dist/table/Table.stories.js +84 -8
- package/dist/tabs/Tabs.js +198 -9
- package/dist/tabs/Tabs.stories.js +46 -13
- package/dist/text/Text.js +152 -6
- package/dist/text/Text.stories.js +44 -7
- package/dist/toast/Toast.stories.js +66 -14
- package/dist/toast/ToastBox.js +77 -29
- package/dist/toast/index.js +0 -1
- package/dist/toast/sonner.js +66 -6
- package/dist/toggle/Toggle.js +180 -7
- package/dist/toggle/Toggle.stories.js +10 -8
- package/dist/tooltip/Tooltip.js +169 -12
- package/dist/tooltip/Tooltip.stories.js +71 -13
- package/dist/utils.js +4 -2
- package/dist/vstack/VStack.js +127 -3
- package/dist/vstack/VStack.stories.js +19 -7
- package/package.json +11 -11
|
@@ -1,177 +1,332 @@
|
|
|
1
1
|
'use client';
|
|
2
|
+
function _array_like_to_array(arr, len) {
|
|
3
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
4
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
5
|
+
return arr2;
|
|
6
|
+
}
|
|
7
|
+
function _array_with_holes(arr) {
|
|
8
|
+
if (Array.isArray(arr)) return arr;
|
|
9
|
+
}
|
|
10
|
+
function _define_property(obj, key, value) {
|
|
11
|
+
if (key in obj) {
|
|
12
|
+
Object.defineProperty(obj, key, {
|
|
13
|
+
value: value,
|
|
14
|
+
enumerable: true,
|
|
15
|
+
configurable: true,
|
|
16
|
+
writable: true
|
|
17
|
+
});
|
|
18
|
+
} else {
|
|
19
|
+
obj[key] = value;
|
|
20
|
+
}
|
|
21
|
+
return obj;
|
|
22
|
+
}
|
|
23
|
+
function _iterable_to_array_limit(arr, i) {
|
|
24
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
25
|
+
if (_i == null) return;
|
|
26
|
+
var _arr = [];
|
|
27
|
+
var _n = true;
|
|
28
|
+
var _d = false;
|
|
29
|
+
var _s, _e;
|
|
30
|
+
try {
|
|
31
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
32
|
+
_arr.push(_s.value);
|
|
33
|
+
if (i && _arr.length === i) break;
|
|
34
|
+
}
|
|
35
|
+
} catch (err) {
|
|
36
|
+
_d = true;
|
|
37
|
+
_e = err;
|
|
38
|
+
} finally{
|
|
39
|
+
try {
|
|
40
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
41
|
+
} finally{
|
|
42
|
+
if (_d) throw _e;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
return _arr;
|
|
46
|
+
}
|
|
47
|
+
function _non_iterable_rest() {
|
|
48
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
49
|
+
}
|
|
50
|
+
function _object_spread(target) {
|
|
51
|
+
for(var i = 1; i < arguments.length; i++){
|
|
52
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
53
|
+
var ownKeys = Object.keys(source);
|
|
54
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
55
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
56
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
57
|
+
}));
|
|
58
|
+
}
|
|
59
|
+
ownKeys.forEach(function(key) {
|
|
60
|
+
_define_property(target, key, source[key]);
|
|
61
|
+
});
|
|
62
|
+
}
|
|
63
|
+
return target;
|
|
64
|
+
}
|
|
65
|
+
function _object_without_properties(source, excluded) {
|
|
66
|
+
if (source == null) return {};
|
|
67
|
+
var target = {}, sourceKeys, key, i;
|
|
68
|
+
if (typeof Reflect !== "undefined" && Reflect.ownKeys) {
|
|
69
|
+
sourceKeys = Reflect.ownKeys(Object(source));
|
|
70
|
+
for(i = 0; i < sourceKeys.length; i++){
|
|
71
|
+
key = sourceKeys[i];
|
|
72
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
73
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
74
|
+
target[key] = source[key];
|
|
75
|
+
}
|
|
76
|
+
return target;
|
|
77
|
+
}
|
|
78
|
+
target = _object_without_properties_loose(source, excluded);
|
|
79
|
+
if (Object.getOwnPropertySymbols) {
|
|
80
|
+
sourceKeys = Object.getOwnPropertySymbols(source);
|
|
81
|
+
for(i = 0; i < sourceKeys.length; i++){
|
|
82
|
+
key = sourceKeys[i];
|
|
83
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
84
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
85
|
+
target[key] = source[key];
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
return target;
|
|
89
|
+
}
|
|
90
|
+
function _object_without_properties_loose(source, excluded) {
|
|
91
|
+
if (source == null) return {};
|
|
92
|
+
var target = {}, sourceKeys = Object.getOwnPropertyNames(source), key, i;
|
|
93
|
+
for(i = 0; i < sourceKeys.length; i++){
|
|
94
|
+
key = sourceKeys[i];
|
|
95
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
96
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
97
|
+
target[key] = source[key];
|
|
98
|
+
}
|
|
99
|
+
return target;
|
|
100
|
+
}
|
|
101
|
+
function _sliced_to_array(arr, i) {
|
|
102
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
103
|
+
}
|
|
104
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
105
|
+
if (!o) return;
|
|
106
|
+
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
107
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
108
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
109
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
110
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
111
|
+
}
|
|
2
112
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
113
|
import { useCallback, useState } from 'react';
|
|
4
114
|
import { useIsMobile } from '../hooks/use-media-query';
|
|
5
115
|
import DatePickerDrawer from './DatePickerDrawer';
|
|
6
116
|
import DatePickerPopover from './DatePickerPopover';
|
|
7
117
|
import { formatInputBy } from './utils';
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
118
|
+
var DatePicker = function DatePicker(_0) {
|
|
119
|
+
var tileDisabled = _0.tileDisabled, onCancel = _0.onCancel, props = _object_without_properties(_0, [
|
|
120
|
+
"tileDisabled",
|
|
121
|
+
"onCancel"
|
|
122
|
+
]);
|
|
123
|
+
var value = props.value, isRange = props.isRange, onChange = props.onChange, disableWeekends = props.disableWeekends, error = props.error, onSelect = props.onSelect;
|
|
124
|
+
var isMobile = useIsMobile();
|
|
125
|
+
var _useState = _sliced_to_array(useState(value), 2), innerValue = _useState[0], setInnerValue = _useState[1];
|
|
126
|
+
var _useState1 = _sliced_to_array(useState(formatInputBy(value, isRange)), 2), inputValue = _useState1[0], setInputValue = _useState1[1];
|
|
127
|
+
var _useState2 = _sliced_to_array(useState(false), 2), focused = _useState2[0], setFocused = _useState2[1];
|
|
128
|
+
var isSameDate = function isSameDate(date1, date2) {
|
|
129
|
+
return date1.getFullYear() === date2.getFullYear() && date1.getMonth() === date2.getMonth() && date1.getDate() === date2.getDate();
|
|
18
130
|
};
|
|
19
|
-
|
|
131
|
+
var handleSelect = function handleSelect(value) {
|
|
20
132
|
if (isRange) {
|
|
21
133
|
// Handle range mode
|
|
22
|
-
|
|
23
|
-
if (Array.isArray(value) && value
|
|
134
|
+
var currentRange = Array.isArray(innerValue) ? innerValue : undefined;
|
|
135
|
+
if (Array.isArray(value) && (value === null || value === void 0 ? void 0 : value[0]) && value[1]) {
|
|
24
136
|
// Both dates selected
|
|
25
|
-
|
|
26
|
-
|
|
137
|
+
var clickedStart = new Date(value[0]);
|
|
138
|
+
var clickedEnd = new Date(value[1]);
|
|
27
139
|
// Check if clicking the same start date (start date matches, end might be different)
|
|
28
|
-
if (currentRange
|
|
29
|
-
isSameDate(clickedStart, currentRange[0]) &&
|
|
30
|
-
currentRange[1] &&
|
|
31
|
-
!isSameDate(clickedEnd, currentRange[1])) {
|
|
140
|
+
if ((currentRange === null || currentRange === void 0 ? void 0 : currentRange[0]) && isSameDate(clickedStart, currentRange[0]) && currentRange[1] && !isSameDate(clickedEnd, currentRange[1])) {
|
|
32
141
|
// User clicked start date again - clear start, keep end
|
|
33
|
-
|
|
142
|
+
var newValue = [
|
|
34
143
|
undefined,
|
|
35
|
-
currentRange[1]
|
|
144
|
+
currentRange[1]
|
|
36
145
|
];
|
|
37
|
-
onSelect
|
|
146
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(newValue);
|
|
38
147
|
setInnerValue(newValue);
|
|
39
148
|
setInputValue(formatInputBy(newValue, isRange));
|
|
40
149
|
return;
|
|
41
150
|
}
|
|
42
151
|
// Check if clicking the same end date (end date matches, start might be different)
|
|
43
|
-
if (currentRange
|
|
44
|
-
isSameDate(clickedEnd, currentRange[1]) &&
|
|
45
|
-
currentRange[0] &&
|
|
46
|
-
!isSameDate(clickedStart, currentRange[0])) {
|
|
152
|
+
if ((currentRange === null || currentRange === void 0 ? void 0 : currentRange[1]) && isSameDate(clickedEnd, currentRange[1]) && currentRange[0] && !isSameDate(clickedStart, currentRange[0])) {
|
|
47
153
|
// User clicked end date again - clear end, keep start
|
|
48
|
-
|
|
154
|
+
var newValue1 = [
|
|
49
155
|
currentRange[0],
|
|
50
|
-
undefined
|
|
156
|
+
undefined
|
|
51
157
|
];
|
|
52
|
-
onSelect
|
|
53
|
-
setInnerValue(
|
|
54
|
-
setInputValue(formatInputBy(
|
|
158
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(newValue1);
|
|
159
|
+
setInnerValue(newValue1);
|
|
160
|
+
setInputValue(formatInputBy(newValue1, isRange));
|
|
55
161
|
return;
|
|
56
162
|
}
|
|
57
163
|
// Normal case: set both dates
|
|
58
|
-
onSelect
|
|
59
|
-
|
|
60
|
-
|
|
164
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect([
|
|
165
|
+
new Date(value[0]),
|
|
166
|
+
new Date(value[1])
|
|
167
|
+
]);
|
|
168
|
+
setInnerValue([
|
|
169
|
+
new Date(value[0]),
|
|
170
|
+
new Date(value[1])
|
|
171
|
+
]);
|
|
172
|
+
setInputValue(formatInputBy([
|
|
173
|
+
value[0],
|
|
174
|
+
value[1]
|
|
175
|
+
], isRange));
|
|
61
176
|
return;
|
|
62
177
|
}
|
|
63
178
|
// Single date selected in range mode
|
|
64
179
|
if (!Array.isArray(value) && value) {
|
|
65
|
-
|
|
180
|
+
var clickedDate = new Date(value);
|
|
66
181
|
// Check if start and end are the same date and clicking that date
|
|
67
|
-
if (currentRange
|
|
68
|
-
currentRange[1] &&
|
|
69
|
-
isSameDate(currentRange[0], currentRange[1]) &&
|
|
70
|
-
isSameDate(clickedDate, currentRange[0])) {
|
|
182
|
+
if ((currentRange === null || currentRange === void 0 ? void 0 : currentRange[0]) && currentRange[1] && isSameDate(currentRange[0], currentRange[1]) && isSameDate(clickedDate, currentRange[0])) {
|
|
71
183
|
// Clear both dates
|
|
72
|
-
|
|
73
|
-
undefined,
|
|
184
|
+
var newValue2 = [
|
|
74
185
|
undefined,
|
|
186
|
+
undefined
|
|
75
187
|
];
|
|
76
|
-
onSelect
|
|
77
|
-
setInnerValue(
|
|
78
|
-
setInputValue(formatInputBy(
|
|
188
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(newValue2);
|
|
189
|
+
setInnerValue(newValue2);
|
|
190
|
+
setInputValue(formatInputBy(newValue2, isRange));
|
|
79
191
|
return;
|
|
80
192
|
}
|
|
81
193
|
// Check if clicking the same start date
|
|
82
|
-
if (currentRange
|
|
194
|
+
if ((currentRange === null || currentRange === void 0 ? void 0 : currentRange[0]) && isSameDate(clickedDate, currentRange[0])) {
|
|
83
195
|
// Clear start date, keep end if it exists
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
196
|
+
var newValue3 = currentRange[1] ? [
|
|
197
|
+
undefined,
|
|
198
|
+
currentRange[1]
|
|
199
|
+
] : [
|
|
200
|
+
undefined,
|
|
201
|
+
undefined
|
|
202
|
+
];
|
|
203
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(newValue3);
|
|
204
|
+
setInnerValue(newValue3);
|
|
205
|
+
setInputValue(formatInputBy(newValue3, isRange));
|
|
90
206
|
return;
|
|
91
207
|
}
|
|
92
208
|
// Check if clicking the same end date
|
|
93
|
-
if (currentRange
|
|
209
|
+
if ((currentRange === null || currentRange === void 0 ? void 0 : currentRange[1]) && isSameDate(clickedDate, currentRange[1])) {
|
|
94
210
|
// Clear end date, keep start if it exists
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
211
|
+
var newValue4 = currentRange[0] ? [
|
|
212
|
+
currentRange[0],
|
|
213
|
+
undefined
|
|
214
|
+
] : [
|
|
215
|
+
undefined,
|
|
216
|
+
undefined
|
|
217
|
+
];
|
|
218
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(newValue4);
|
|
219
|
+
setInnerValue(newValue4);
|
|
220
|
+
setInputValue(formatInputBy(newValue4, isRange));
|
|
101
221
|
return;
|
|
102
222
|
}
|
|
103
223
|
// Normal case: set start date (or both if no range exists)
|
|
104
|
-
if (currentRange
|
|
224
|
+
if ((currentRange === null || currentRange === void 0 ? void 0 : currentRange[0]) && !currentRange[1]) {
|
|
105
225
|
// Start exists but no end - this click sets the end
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
226
|
+
var start = currentRange[0];
|
|
227
|
+
var end = clickedDate;
|
|
228
|
+
var finalRange = start <= end ? [
|
|
229
|
+
start,
|
|
230
|
+
end
|
|
231
|
+
] : [
|
|
232
|
+
end,
|
|
233
|
+
start
|
|
234
|
+
];
|
|
235
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(finalRange);
|
|
110
236
|
setInnerValue(finalRange);
|
|
111
237
|
setInputValue(formatInputBy(finalRange, isRange));
|
|
112
238
|
return;
|
|
113
239
|
}
|
|
114
240
|
// No range or both dates exist - set as new start
|
|
115
|
-
onSelect
|
|
116
|
-
|
|
241
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect([
|
|
242
|
+
clickedDate,
|
|
243
|
+
clickedDate
|
|
244
|
+
]);
|
|
245
|
+
setInnerValue([
|
|
246
|
+
clickedDate,
|
|
247
|
+
clickedDate
|
|
248
|
+
]);
|
|
117
249
|
setInputValue(formatInputBy(clickedDate, isRange));
|
|
118
250
|
return;
|
|
119
251
|
}
|
|
120
252
|
}
|
|
121
253
|
if (!isRange && !Array.isArray(value) && value) {
|
|
122
254
|
// Handle single date mode - toggle if same date clicked
|
|
123
|
-
|
|
124
|
-
if (innerValue &&
|
|
125
|
-
!Array.isArray(innerValue) &&
|
|
126
|
-
isSameDate(clickedDate, innerValue)) {
|
|
255
|
+
var clickedDate1 = new Date(value);
|
|
256
|
+
if (innerValue && !Array.isArray(innerValue) && isSameDate(clickedDate1, innerValue)) {
|
|
127
257
|
setInnerValue(undefined);
|
|
128
258
|
setInputValue(formatInputBy(undefined, isRange));
|
|
129
|
-
onSelect
|
|
259
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(undefined);
|
|
130
260
|
return;
|
|
131
261
|
}
|
|
132
262
|
// Normal case: set the date
|
|
133
|
-
onSelect
|
|
263
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect(new Date(value));
|
|
134
264
|
setInnerValue(new Date(value));
|
|
135
265
|
setInputValue(formatInputBy(value, isRange));
|
|
136
266
|
return;
|
|
137
267
|
}
|
|
138
268
|
};
|
|
139
|
-
|
|
269
|
+
var handleCancel = function handleCancel() {
|
|
140
270
|
setFocused(false);
|
|
141
271
|
setInnerValue(value);
|
|
142
272
|
setInputValue(formatInputBy(value, isRange));
|
|
143
|
-
onCancel
|
|
273
|
+
onCancel === null || onCancel === void 0 ? void 0 : onCancel();
|
|
144
274
|
};
|
|
145
|
-
|
|
146
|
-
if (isRange &&
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
275
|
+
var handleApply = function handleApply() {
|
|
276
|
+
if (isRange && Array.isArray(innerValue) && (innerValue === null || innerValue === void 0 ? void 0 : innerValue[0]) && innerValue[1]) {
|
|
277
|
+
onChange === null || onChange === void 0 ? void 0 : onChange([
|
|
278
|
+
innerValue[0],
|
|
279
|
+
innerValue[1]
|
|
280
|
+
]);
|
|
151
281
|
setFocused(false);
|
|
152
282
|
return;
|
|
153
283
|
}
|
|
154
284
|
if (!isRange && !Array.isArray(innerValue) && innerValue) {
|
|
155
|
-
onChange
|
|
285
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(innerValue);
|
|
156
286
|
setFocused(false);
|
|
157
287
|
return;
|
|
158
288
|
}
|
|
159
289
|
};
|
|
160
|
-
|
|
290
|
+
var weekendTiles = useCallback(function(args) {
|
|
161
291
|
if (args.view === 'month') {
|
|
162
|
-
|
|
292
|
+
var day = args.date.getDay();
|
|
163
293
|
return day === 0 || day === 6;
|
|
164
294
|
}
|
|
165
295
|
return false;
|
|
166
296
|
}, []);
|
|
167
|
-
|
|
168
|
-
if (disableWeekends && weekendTiles(args))
|
|
169
|
-
|
|
170
|
-
if (typeof tileDisabled === 'function')
|
|
171
|
-
return tileDisabled(args);
|
|
297
|
+
var combinedTileDisabled = useCallback(function(args) {
|
|
298
|
+
if (disableWeekends && weekendTiles(args)) return true;
|
|
299
|
+
if (typeof tileDisabled === 'function') return tileDisabled(args);
|
|
172
300
|
return false;
|
|
173
|
-
}, [
|
|
174
|
-
|
|
301
|
+
}, [
|
|
302
|
+
disableWeekends,
|
|
303
|
+
tileDisabled,
|
|
304
|
+
weekendTiles
|
|
305
|
+
]);
|
|
306
|
+
return isMobile ? /*#__PURE__*/ _jsx(DatePickerDrawer, _object_spread({
|
|
307
|
+
innerValue: innerValue,
|
|
308
|
+
setInnerValue: setInnerValue,
|
|
309
|
+
inputValue: inputValue,
|
|
310
|
+
setInputValue: setInputValue,
|
|
311
|
+
focused: focused,
|
|
312
|
+
setFocused: setFocused,
|
|
313
|
+
handleSelect: handleSelect,
|
|
314
|
+
handleCancel: handleCancel,
|
|
315
|
+
handleApply: handleApply,
|
|
316
|
+
tileDisabled: combinedTileDisabled,
|
|
317
|
+
error: error
|
|
318
|
+
}, props)) : /*#__PURE__*/ _jsx(DatePickerPopover, _object_spread({
|
|
319
|
+
innerValue: innerValue,
|
|
320
|
+
setInnerValue: setInnerValue,
|
|
321
|
+
inputValue: inputValue,
|
|
322
|
+
setInputValue: setInputValue,
|
|
323
|
+
focused: focused,
|
|
324
|
+
setFocused: setFocused,
|
|
325
|
+
handleSelect: handleSelect,
|
|
326
|
+
handleCancel: handleCancel,
|
|
327
|
+
handleApply: handleApply,
|
|
328
|
+
tileDisabled: combinedTileDisabled,
|
|
329
|
+
error: error
|
|
330
|
+
}, props));
|
|
175
331
|
};
|
|
176
332
|
export default DatePicker;
|
|
177
|
-
//# sourceMappingURL=DatePicker.js.map
|
|
@@ -1,79 +1,183 @@
|
|
|
1
|
+
function _array_like_to_array(arr, len) {
|
|
2
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
3
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
4
|
+
return arr2;
|
|
5
|
+
}
|
|
6
|
+
function _array_with_holes(arr) {
|
|
7
|
+
if (Array.isArray(arr)) return arr;
|
|
8
|
+
}
|
|
9
|
+
function _iterable_to_array_limit(arr, i) {
|
|
10
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
11
|
+
if (_i == null) return;
|
|
12
|
+
var _arr = [];
|
|
13
|
+
var _n = true;
|
|
14
|
+
var _d = false;
|
|
15
|
+
var _s, _e;
|
|
16
|
+
try {
|
|
17
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
18
|
+
_arr.push(_s.value);
|
|
19
|
+
if (i && _arr.length === i) break;
|
|
20
|
+
}
|
|
21
|
+
} catch (err) {
|
|
22
|
+
_d = true;
|
|
23
|
+
_e = err;
|
|
24
|
+
} finally{
|
|
25
|
+
try {
|
|
26
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
27
|
+
} finally{
|
|
28
|
+
if (_d) throw _e;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
return _arr;
|
|
32
|
+
}
|
|
33
|
+
function _non_iterable_rest() {
|
|
34
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
35
|
+
}
|
|
36
|
+
function _sliced_to_array(arr, i) {
|
|
37
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
38
|
+
}
|
|
39
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
40
|
+
if (!o) return;
|
|
41
|
+
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
42
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
43
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
44
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
45
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
46
|
+
}
|
|
1
47
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
48
|
import { useState } from 'react';
|
|
3
49
|
import DatePicker from './DatePicker.js';
|
|
4
|
-
|
|
50
|
+
var meta = {
|
|
5
51
|
component: DatePicker,
|
|
6
52
|
argTypes: {
|
|
7
53
|
locale: {
|
|
8
|
-
options: [
|
|
9
|
-
|
|
54
|
+
options: [
|
|
55
|
+
'en',
|
|
56
|
+
'ms',
|
|
57
|
+
'zh'
|
|
58
|
+
],
|
|
59
|
+
control: {
|
|
60
|
+
type: 'select'
|
|
61
|
+
}
|
|
10
62
|
},
|
|
11
63
|
calendarType: {
|
|
12
|
-
options: [
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
64
|
+
options: [
|
|
65
|
+
'iso8601',
|
|
66
|
+
'gregory',
|
|
67
|
+
'islamic',
|
|
68
|
+
'hebrew'
|
|
69
|
+
],
|
|
70
|
+
control: {
|
|
71
|
+
type: 'select'
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
16
75
|
};
|
|
17
76
|
export default meta;
|
|
18
|
-
export
|
|
19
|
-
render: ()
|
|
20
|
-
|
|
21
|
-
return
|
|
22
|
-
|
|
77
|
+
export var Standard = {
|
|
78
|
+
render: function render() {
|
|
79
|
+
var _useState = _sliced_to_array(useState(new Date()), 2), date = _useState[0], setDate = _useState[1];
|
|
80
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
81
|
+
htmlFor: "standard-calendar",
|
|
82
|
+
value: date,
|
|
83
|
+
onChange: setDate
|
|
84
|
+
});
|
|
85
|
+
}
|
|
23
86
|
};
|
|
24
|
-
export
|
|
25
|
-
render: ()
|
|
26
|
-
|
|
27
|
-
return
|
|
28
|
-
|
|
87
|
+
export var Locale = {
|
|
88
|
+
render: function render() {
|
|
89
|
+
var _useState = _sliced_to_array(useState(), 2), date = _useState[0], setDate = _useState[1];
|
|
90
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
91
|
+
htmlFor: "standard-calendar",
|
|
92
|
+
locale: "ms",
|
|
93
|
+
value: date,
|
|
94
|
+
onChange: setDate
|
|
95
|
+
});
|
|
96
|
+
}
|
|
29
97
|
};
|
|
30
|
-
export
|
|
31
|
-
render: (_args)
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
return
|
|
98
|
+
export var Ranged = {
|
|
99
|
+
render: function render(_args) {
|
|
100
|
+
var _useState = _sliced_to_array(useState(), 2), dates = _useState[0], setDates = _useState[1];
|
|
101
|
+
var _useState1 = _sliced_to_array(useState(''), 2), error = _useState1[0], setError = _useState1[1];
|
|
102
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
103
|
+
htmlFor: "ranged-calendar",
|
|
104
|
+
isRange: true,
|
|
105
|
+
value: dates,
|
|
106
|
+
onChange: function onChange(dates) {
|
|
35
107
|
setDates(dates);
|
|
36
108
|
setError('');
|
|
37
|
-
},
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
}
|
|
41
|
-
|
|
109
|
+
},
|
|
110
|
+
onError: function onError(type) {
|
|
111
|
+
return type === 'start-gte-end' && setError('Start Date must be earlier than End Date');
|
|
112
|
+
},
|
|
113
|
+
inputProps: {
|
|
114
|
+
error: error
|
|
115
|
+
}
|
|
116
|
+
});
|
|
117
|
+
}
|
|
42
118
|
};
|
|
43
|
-
export
|
|
44
|
-
render: ()
|
|
45
|
-
|
|
46
|
-
return
|
|
47
|
-
|
|
119
|
+
export var MinDate = {
|
|
120
|
+
render: function render() {
|
|
121
|
+
var _useState = _sliced_to_array(useState(), 2), date = _useState[0], setDate = _useState[1];
|
|
122
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
123
|
+
htmlFor: "mindate-calendar",
|
|
124
|
+
minDate: new Date(),
|
|
125
|
+
value: date,
|
|
126
|
+
onChange: setDate
|
|
127
|
+
});
|
|
128
|
+
}
|
|
48
129
|
};
|
|
49
|
-
export
|
|
50
|
-
render: ()
|
|
51
|
-
|
|
52
|
-
return
|
|
53
|
-
|
|
130
|
+
export var MaxDate = {
|
|
131
|
+
render: function render() {
|
|
132
|
+
var _useState = _sliced_to_array(useState(), 2), date = _useState[0], setDate = _useState[1];
|
|
133
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
134
|
+
htmlFor: "maxdate-calendar",
|
|
135
|
+
maxDate: new Date(),
|
|
136
|
+
value: date,
|
|
137
|
+
onChange: setDate
|
|
138
|
+
});
|
|
139
|
+
}
|
|
54
140
|
};
|
|
55
|
-
export
|
|
56
|
-
render: ()
|
|
57
|
-
|
|
58
|
-
return
|
|
59
|
-
|
|
141
|
+
export var CalendarType = {
|
|
142
|
+
render: function render() {
|
|
143
|
+
var _useState = _sliced_to_array(useState(), 2), date = _useState[0], setDate = _useState[1];
|
|
144
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
145
|
+
htmlFor: "islamic-calendar",
|
|
146
|
+
calendarType: "islamic",
|
|
147
|
+
value: date,
|
|
148
|
+
onChange: setDate
|
|
149
|
+
});
|
|
150
|
+
}
|
|
60
151
|
};
|
|
61
|
-
export
|
|
62
|
-
render: ()
|
|
63
|
-
|
|
64
|
-
return
|
|
65
|
-
|
|
152
|
+
export var Disabled = {
|
|
153
|
+
render: function render() {
|
|
154
|
+
var _useState = _sliced_to_array(useState(), 2), date = _useState[0], setDate = _useState[1];
|
|
155
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
156
|
+
htmlFor: "disabled-calendar",
|
|
157
|
+
isDisabled: true,
|
|
158
|
+
value: date,
|
|
159
|
+
onChange: setDate
|
|
160
|
+
});
|
|
161
|
+
}
|
|
66
162
|
};
|
|
67
|
-
export
|
|
68
|
-
render: ()
|
|
69
|
-
|
|
70
|
-
return
|
|
71
|
-
|
|
163
|
+
export var DisableWeekends = {
|
|
164
|
+
render: function render() {
|
|
165
|
+
var _useState = _sliced_to_array(useState(), 2), date = _useState[0], setDate = _useState[1];
|
|
166
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
167
|
+
htmlFor: "no-date-calendar",
|
|
168
|
+
value: date,
|
|
169
|
+
onChange: setDate,
|
|
170
|
+
disableWeekends: true
|
|
171
|
+
});
|
|
172
|
+
}
|
|
72
173
|
};
|
|
73
|
-
export
|
|
74
|
-
render: ()
|
|
75
|
-
|
|
76
|
-
return
|
|
77
|
-
|
|
174
|
+
export var NoDate = {
|
|
175
|
+
render: function render() {
|
|
176
|
+
var _useState = _sliced_to_array(useState(), 2), date = _useState[0], setDate = _useState[1];
|
|
177
|
+
return /*#__PURE__*/ _jsx(DatePicker, {
|
|
178
|
+
htmlFor: "no-date-calendar",
|
|
179
|
+
value: date,
|
|
180
|
+
onChange: setDate
|
|
181
|
+
});
|
|
182
|
+
}
|
|
78
183
|
};
|
|
79
|
-
//# sourceMappingURL=DatePicker.stories.js.map
|