@easypost/easy-ui 1.0.0-alpha.60 → 1.0.0-alpha.61
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/Badge/index.js +14 -14
- package/Badge/index.mjs +14 -14
- package/Banner/index.js +5 -5
- package/Banner/index.mjs +5 -5
- package/Button/index.js +1 -1
- package/Button/index.mjs +1 -1
- package/CHANGELOG.md +6 -0
- package/Calendar/CalendarCell.d.ts.map +1 -1
- package/Calendar/index.js +2 -40
- package/Calendar/index.mjs +2 -40
- package/Card/index.js +1 -1
- package/Card/index.mjs +1 -1
- package/Checkbox/index.js +1 -1
- package/Checkbox/index.mjs +1 -1
- package/CodeBlock/index.js +13 -13
- package/CodeBlock/index.mjs +15 -15
- package/CodeSnippet/index.js +1 -1
- package/CodeSnippet/index.mjs +1 -1
- package/DataGrid/index.js +63 -62
- package/DataGrid/index.mjs +72 -71
- package/DatePicker/DateField.d.ts +14 -0
- package/DatePicker/DateField.d.ts.map +1 -0
- package/DatePicker/DatePicker.d.ts +91 -0
- package/DatePicker/DatePicker.d.ts.map +1 -0
- package/DatePicker/DatePicker.stories.d.ts +14 -0
- package/DatePicker/DatePicker.stories.d.ts.map +1 -0
- package/DatePicker/DatePicker.test.d.ts +2 -0
- package/DatePicker/DatePicker.test.d.ts.map +1 -0
- package/DatePicker/DatePickerBase.d.ts +32 -0
- package/DatePicker/DatePickerBase.d.ts.map +1 -0
- package/DatePicker/DatePickerOverlay.d.ts +12 -0
- package/DatePicker/DatePickerOverlay.d.ts.map +1 -0
- package/DatePicker/DatePickerTrigger.d.ts +20 -0
- package/DatePicker/DatePickerTrigger.d.ts.map +1 -0
- package/DatePicker/index.d.ts +2 -0
- package/DatePicker/index.d.ts.map +1 -0
- package/DatePicker/index.js +275 -0
- package/DatePicker/index.mjs +275 -0
- package/DateRangePicker/DateRangePicker.d.ts +89 -0
- package/DateRangePicker/DateRangePicker.d.ts.map +1 -0
- package/DateRangePicker/DateRangePicker.stories.d.ts +14 -0
- package/DateRangePicker/DateRangePicker.stories.d.ts.map +1 -0
- package/DateRangePicker/DateRangePicker.test.d.ts +2 -0
- package/DateRangePicker/DateRangePicker.test.d.ts.map +1 -0
- package/DateRangePicker/index.d.ts +2 -0
- package/DateRangePicker/index.d.ts.map +1 -0
- package/DateRangePicker/index.js +434 -0
- package/DateRangePicker/index.mjs +434 -0
- package/Drawer/index.js +22 -22
- package/Drawer/index.mjs +21 -21
- package/DropdownButton/index.js +12 -12
- package/DropdownButton/index.mjs +13 -13
- package/EmptyStateCard/index.js +8 -8
- package/EmptyStateCard/index.mjs +8 -8
- package/FocusedProductLayout/index.js +23 -23
- package/FocusedProductLayout/index.mjs +23 -23
- package/ForgeLayout/index.js +27 -27
- package/ForgeLayout/index.mjs +30 -30
- package/FormLayout/index.js +5 -5
- package/FormLayout/index.mjs +5 -5
- package/HorizontalGrid/index.js +1 -1
- package/HorizontalGrid/index.mjs +1 -1
- package/HorizontalStack/index.js +1 -1
- package/HorizontalStack/index.mjs +1 -1
- package/Icon/index.js +1 -1
- package/Icon/index.mjs +1 -1
- package/IconButton/index.js +12 -12
- package/IconButton/index.mjs +13 -13
- package/InputField/index.js +1 -1
- package/InputField/index.mjs +1 -1
- package/KebabButton/index.js +1 -1
- package/KebabButton/index.mjs +1 -1
- package/Menu/index.js +1 -1
- package/Menu/index.mjs +1 -1
- package/Modal/index.js +23 -23
- package/Modal/index.mjs +22 -22
- package/NexusLayout/index.js +28 -28
- package/NexusLayout/index.mjs +31 -31
- package/Notification/index.js +1 -1
- package/Notification/index.mjs +1 -1
- package/Pagination/index.js +7 -7
- package/Pagination/index.mjs +8 -8
- package/PillGroup/index.js +9 -9
- package/PillGroup/index.mjs +19 -19
- package/ProductLayout/index.js +24 -24
- package/ProductLayout/index.mjs +25 -25
- package/Provider/index.js +1 -1
- package/Provider/index.mjs +2 -2
- package/RadioButtonGroup/index.js +2 -2
- package/RadioButtonGroup/index.mjs +5 -5
- package/RadioGroup/index.js +16 -16
- package/RadioGroup/index.mjs +21 -21
- package/RangeCalendar/RangeCalendar.test.d.ts +2 -1
- package/RangeCalendar/RangeCalendar.test.d.ts.map +1 -1
- package/RangeCalendar/index.js +2 -226
- package/RangeCalendar/index.mjs +2 -226
- package/SearchNav/index.js +29 -29
- package/SearchNav/index.mjs +30 -30
- package/SectionCard/index.js +7 -7
- package/SectionCard/index.mjs +7 -7
- package/Select/index.js +7 -6
- package/Select/index.mjs +6 -5
- package/SelectorErrorTooltip/index.js +1 -1
- package/SelectorErrorTooltip/index.mjs +1 -1
- package/Spinner/index.js +1 -1
- package/Spinner/index.mjs +1 -1
- package/SplitToggleCard/index.js +4 -4
- package/SplitToggleCard/index.mjs +4 -4
- package/Stepper/index.js +1 -1
- package/Stepper/index.mjs +1 -1
- package/TabNav/index.js +1 -1
- package/TabNav/index.mjs +1 -1
- package/TabPanels/index.js +1 -1
- package/TabPanels/index.mjs +7 -7
- package/Tabs/index.js +1 -1
- package/Tabs/index.mjs +1 -1
- package/Text/index.js +1 -1
- package/Text/index.mjs +1 -1
- package/TextField/index.js +1 -1
- package/TextField/index.mjs +1 -1
- package/Textarea/index.js +1 -1
- package/Textarea/index.mjs +1 -1
- package/Toggle/index.js +1 -1
- package/Toggle/index.mjs +1 -1
- package/ToggleCard/index.js +2 -2
- package/ToggleCard/index.mjs +2 -2
- package/Tooltip/index.js +1 -1
- package/Tooltip/index.mjs +1 -1
- package/UnstyledButton/index.mjs +1 -1
- package/VerticalNav/index.js +24 -24
- package/VerticalNav/index.mjs +27 -27
- package/VerticalStack/index.js +1 -1
- package/VerticalStack/index.mjs +1 -1
- package/__chunks__/{Button-DuqSI9GS.js → Button-BzB8v2mS.js} +17 -17
- package/__chunks__/{Button-D0YAQvKG.mjs → Button-DcYNVtp7.mjs} +3 -3
- package/__chunks__/{Button-bGGT-c6v.mjs → Button-gxCTl22H.mjs} +18 -18
- package/__chunks__/{Button-D8vjHIx8.js → Button-jgkOum0d.js} +1 -1
- package/__chunks__/Calendar-BS8zgZK8.js +41 -0
- package/__chunks__/Calendar-C9hD67Rz.mjs +42 -0
- package/__chunks__/{CalendarBase-DbXh9rhk.mjs → CalendarBase-4iGD1mPK.mjs} +99 -27
- package/__chunks__/{CalendarBase-CiBPzvL4.js → CalendarBase-saNix6u1.js} +94 -22
- package/__chunks__/{Card-DdHvpDEw.mjs → Card-Cr-bIjoN.mjs} +12 -12
- package/__chunks__/{Card-93kQP9IL.js → Card-DaFTIHZD.js} +12 -12
- package/__chunks__/{Checkbox-BRrfKcFE.mjs → Checkbox-BR4RBHLp.mjs} +23 -23
- package/__chunks__/{Checkbox-MbPCVxqs.js → Checkbox-BY4UkCg7.js} +20 -20
- package/__chunks__/{CodeSnippet-xb-psm_O.mjs → CodeSnippet-ChZIz_CO.mjs} +2 -2
- package/__chunks__/{CodeSnippet-D9ZZXVs3.js → CodeSnippet-H-6ta_Y8.js} +2 -2
- package/__chunks__/DatePickerBase-DlbnqBLN.mjs +3152 -0
- package/__chunks__/DatePickerBase-vorBKIfJ.js +3166 -0
- package/__chunks__/{FocusScope-CEeqhVmO.mjs → FocusScope-CjcZn1Rq.mjs} +4 -4
- package/__chunks__/{HelpMenu-E6z6tRl8.js → HelpMenu-BzUSoyPi.js} +6 -6
- package/__chunks__/{HelpMenu-CCHBb1Kr.mjs → HelpMenu-yEjZgR1V.mjs} +7 -7
- package/__chunks__/{HorizontalGrid-B7ijxURd.js → HorizontalGrid-Bhj16LbM.js} +1 -1
- package/__chunks__/{HorizontalGrid-vw7R2Tld.mjs → HorizontalGrid-D4bJqbQV.mjs} +1 -1
- package/__chunks__/{HorizontalStack-Dx9zYaH0.mjs → HorizontalStack-BDZp8p9E.mjs} +1 -1
- package/__chunks__/{HorizontalStack-1g4N72TF.js → HorizontalStack-_DnrRlDb.js} +1 -1
- package/__chunks__/{Icon-QGDwoR1f.mjs → Icon-BdtOD2WX.mjs} +2 -2
- package/__chunks__/{Icon-oPEVg2C8.js → Icon-DJ8CpeVT.js} +2 -2
- package/__chunks__/InputCaption-BBbxPdvJ.mjs +61 -0
- package/__chunks__/InputCaption-CEIuQ6BY.js +60 -0
- package/__chunks__/{InputField-BGBRvVMR.js → InputField-BUU9HZ1I.js} +7 -6
- package/__chunks__/{InputField-BI73lSp6.mjs → InputField-CPxOg_cd.mjs} +8 -7
- package/__chunks__/InputIcon-MHt_XLtO.mjs +112 -0
- package/__chunks__/InputIcon-nUumrcJ5.js +111 -0
- package/__chunks__/{KebabButton-DBLcfQI6.mjs → KebabButton-BapJTvS6.mjs} +5 -5
- package/__chunks__/{KebabButton-C15-V-k2.js → KebabButton-C3KI5LDA.js} +4 -4
- package/__chunks__/{LiveAnnouncer-Bi_Y3tfX.mjs → LiveAnnouncer-BSV5-C0m.mjs} +5 -1
- package/__chunks__/{LiveAnnouncer-Dwkwacle.js → LiveAnnouncer-CzeNwq2D.js} +4 -0
- package/__chunks__/{Menu-Cuqxc1iw.js → Menu-CkQaJJAH.js} +31 -30
- package/__chunks__/{Menu-BELtbX2b.mjs → Menu-LzJveIa-.mjs} +21 -20
- package/__chunks__/{Notification-D90-75ZN.js → Notification-C5_bwXj4.js} +15 -15
- package/__chunks__/{Notification-lqESwByD.mjs → Notification-CAmvbAK1.mjs} +18 -18
- package/__chunks__/{Spinner-D3LMSY80.js → NumberFormatter-CXW1Iqpu.js} +1 -79
- package/__chunks__/{Spinner-tHEG0z1g.mjs → NumberFormatter-p5KNJNTT.mjs} +1 -79
- package/__chunks__/{Overlay-CuhLUuXt.mjs → Overlay-d3z5W5Nn.mjs} +6 -6
- package/__chunks__/RangeCalendar-5enltd2P.js +227 -0
- package/__chunks__/RangeCalendar-Bhk32GB_.mjs +228 -0
- package/__chunks__/{SelectOverlay-pFcbx7UM.js → SelectOverlay-DKJvzJJ7.js} +35 -33
- package/__chunks__/{SelectOverlay-CadnQpV0.mjs → SelectOverlay-MLWWpDpl.mjs} +32 -30
- package/__chunks__/{SelectionManager-IO4G_cI2.mjs → SelectionManager-DCO_d3m1.mjs} +2 -2
- package/__chunks__/{SelectorErrorTooltip-CFlgzXu5.mjs → SelectorErrorTooltip-DLyZgeUf.mjs} +4 -4
- package/__chunks__/{SelectorErrorTooltip-Cfzpo7X3.js → SelectorErrorTooltip-DowQ2whn.js} +4 -4
- package/__chunks__/Spinner-BFydR08g.js +100 -0
- package/__chunks__/Spinner-hJoFNoHJ.mjs +101 -0
- package/__chunks__/{Stepper-B0w3sKYh.mjs → Stepper-BY8zQdW2.mjs} +27 -27
- package/__chunks__/{Stepper-Bbihngk4.js → Stepper-CxWpMLEW.js} +25 -25
- package/__chunks__/{TabNav-BHETvib0.js → TabNav-1cTg6TWo.js} +1 -1
- package/__chunks__/{TabNav-2W0d3JQ0.mjs → TabNav-burpvHrg.mjs} +1 -1
- package/__chunks__/{Tabs-C-D794Gi.mjs → Tabs-BzZ9w82m.mjs} +18 -18
- package/__chunks__/{Tabs-9dihRp0n.js → Tabs-DHXJckwb.js} +17 -17
- package/__chunks__/{Text-D8wg72pq.mjs → Text-CQ_8wg0t.mjs} +34 -34
- package/__chunks__/{Text-CEI17LPu.js → Text-Dfbyoxsz.js} +34 -34
- package/__chunks__/{Toggle-DlIBs_Za.mjs → Toggle-BiaALtul.mjs} +13 -13
- package/__chunks__/{Toggle-4oQhSggV.js → Toggle-CYKsPbEK.js} +11 -11
- package/__chunks__/{Tooltip-Cxv7qnVD.mjs → Tooltip-5ZgKkdk8.mjs} +12 -12
- package/__chunks__/{Tooltip-7wXzqEZl.js → Tooltip-Bzqm5boz.js} +8 -8
- package/__chunks__/{UnstyledButton-B7BScs8i.mjs → UnstyledButton-BlB066YT.mjs} +1 -1
- package/__chunks__/{VerticalStack-BTB8fX9P.js → VerticalStack-_gyNJbOa.js} +3 -3
- package/__chunks__/{VerticalStack-HnwP17N3.mjs → VerticalStack-eKUWFHU3.mjs} +3 -3
- package/__chunks__/{VisuallyHidden-BttNIgVC.mjs → VisuallyHidden-DmDK0fH3.mjs} +1 -1
- package/__chunks__/{ariaHideOutside-DcIkumuG.mjs → ariaHideOutside-B-UoCW1g.mjs} +5 -29
- package/__chunks__/{ariaHideOutside-DNGR3Fo6.js → ariaHideOutside-a1MUBVQF.js} +0 -24
- package/__chunks__/{focusSafely-Dw7K4rnX.mjs → focusSafely-DcMa3q3g.mjs} +2 -2
- package/__chunks__/{isVirtualEvent-BFRy7P_p.mjs → isVirtualEvent-BPCuFO54.mjs} +2 -2
- package/__chunks__/{useButton-B1CurEpI.mjs → useButton-BoMy_zYC.mjs} +2 -2
- package/__chunks__/useCollator-DGrSWVh4.js +12 -0
- package/__chunks__/useCollator-DXoNI6C-.mjs +13 -0
- package/__chunks__/{useDialog-Dsqz1M_N.js → useDialog-DILXRLSs.js} +1 -1
- package/__chunks__/{useDialog-DAYxqkKY.mjs → useDialog-o0QWfg2a.mjs} +3 -3
- package/__chunks__/{useEdgeInterceptors-BCHFmpf_.js → useEdgeInterceptors-DfiAHAYW.js} +5 -5
- package/__chunks__/{useEdgeInterceptors-CVxwDmQ0.mjs → useEdgeInterceptors-wWqxCUZX.mjs} +5 -5
- package/__chunks__/{useFocus-DDj4i8Xy.mjs → useFocus-BEhCbr7O.mjs} +2 -2
- package/__chunks__/{useFocusRing-BE_dgxH5.mjs → useFocusRing-BUwbt1Yv.mjs} +3 -3
- package/__chunks__/{useFocusVisible-CXSIZSY_.mjs → useFocusVisible-8tH_I2iV.mjs} +1 -1
- package/__chunks__/{useFocusWithin-CDX8m0Wu.mjs → useFocusWithin-CfhMwfXS.mjs} +1 -1
- package/__chunks__/{useFocusable-DD5dAIXt.mjs → useFocusable-DoNt-Wd3.mjs} +2 -2
- package/__chunks__/{useFormValidation-gwcVryr8.mjs → useFormValidation-D5Y_7NR2.mjs} +25 -3
- package/__chunks__/{useFormValidation-C2DoIczP.js → useFormValidation-DYz5WFze.js} +22 -0
- package/__chunks__/{useHasTabbableChild-CRCY1COZ.mjs → useHasTabbableChild-DUcbkV37.mjs} +1 -1
- package/__chunks__/{useHighlightSelectionDescription-CsB-ufoX.js → useHighlightSelectionDescription-CT5XKTz0.js} +2 -2
- package/__chunks__/{useHighlightSelectionDescription-DnW5KkSs.mjs → useHighlightSelectionDescription-DWm7Wr6h.mjs} +3 -3
- package/__chunks__/{useLink-B__d3N9L.mjs → useLink-B_g4ae9e.mjs} +2 -2
- package/__chunks__/{useListState-CH1PXfc5.mjs → useListState-AFrlkW73.mjs} +1 -1
- package/__chunks__/{useLocalizedStringFormatter-B5ons_mh.mjs → useLocalizedStringFormatter-CLrYoOi9.mjs} +4 -1
- package/__chunks__/{useLocalizedStringFormatter-D74_5d4h.js → useLocalizedStringFormatter-CaF1VsOH.js} +3 -0
- package/__chunks__/{useOverlayPosition-B31NgShQ.mjs → useOverlayPosition-B_X4JGFp.mjs} +2 -2
- package/__chunks__/useOverlayTrigger-Do68TGFi.mjs +28 -0
- package/__chunks__/useOverlayTrigger-MyMg5wFE.js +27 -0
- package/__chunks__/{usePress-lFMUra6S.mjs → usePress-BAsZaqDB.mjs} +1 -1
- package/__chunks__/{useSelectableItem-BdD2_J2D.mjs → useSelectableItem-DL-4kc1g.mjs} +5 -5
- package/__chunks__/{useSelectableList-D0uxeze4.mjs → useSelectableList-BQ06AmlV.mjs} +4 -14
- package/__chunks__/{useSelectableList-DlkRkps4.js → useSelectableList-F8fB4Dtg.js} +2 -12
- package/__chunks__/{useSingleSelectListState-BuqfjUxj.mjs → useSingleSelectListState-DuCUY6dR.mjs} +1 -1
- package/__chunks__/{useToggle-b0GY9dCM.mjs → useToggle-CU6aSiOx.mjs} +2 -2
- package/__chunks__/{useTreeState-BZxhJy4m.mjs → useTreeState-w_raYfy2.mjs} +1 -1
- package/__chunks__/{useTriggerWidth-DEToHKD3.mjs → useTriggerWidth-DA668KiC.mjs} +6 -335
- package/__chunks__/{useTriggerWidth-C7OT3WI9.js → useTriggerWidth-ROE4ZhGv.js} +3 -332
- package/__chunks__/utilities-DKvHenAr.js +353 -0
- package/__chunks__/utilities-DmLL16up.mjs +354 -0
- package/package.json +1 -1
- package/style.css +1249 -1104
- package/__chunks__/InputIcon-BGgFAA4L.mjs +0 -168
- package/__chunks__/InputIcon-CUOJRoq8.js +0 -167
|
@@ -0,0 +1,275 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
4
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
+
var __spreadValues = (a, b) => {
|
|
10
|
+
for (var prop in b || (b = {}))
|
|
11
|
+
if (__hasOwnProp.call(b, prop))
|
|
12
|
+
__defNormalProp(a, prop, b[prop]);
|
|
13
|
+
if (__getOwnPropSymbols)
|
|
14
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
+
if (__propIsEnum.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
}
|
|
18
|
+
return a;
|
|
19
|
+
};
|
|
20
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
22
|
+
const React = require("react");
|
|
23
|
+
const DatePickerBase = require("../__chunks__/DatePickerBase-vorBKIfJ.js");
|
|
24
|
+
const Calendar = require("../__chunks__/Calendar-BS8zgZK8.js");
|
|
25
|
+
const CalendarBase = require("../__chunks__/CalendarBase-saNix6u1.js");
|
|
26
|
+
const useFormValidation = require("../__chunks__/useFormValidation-DYz5WFze.js");
|
|
27
|
+
const Overlay = require("../__chunks__/Overlay-ZinDp2HW.js");
|
|
28
|
+
const useControlledState = require("../__chunks__/useControlledState-mnKBd6Uc.js");
|
|
29
|
+
const FocusScope = require("../__chunks__/FocusScope-Co1hHX8R.js");
|
|
30
|
+
const mergeProps = require("../__chunks__/mergeProps-DniMwM6P.js");
|
|
31
|
+
const filterDOMProps = require("../__chunks__/filterDOMProps-D3iOHP0H.js");
|
|
32
|
+
const scrollIntoView = require("../__chunks__/scrollIntoView-DkcUbB3D.js");
|
|
33
|
+
const useField = require("../__chunks__/useField-BJW_bXVD.js");
|
|
34
|
+
const useFocusWithin = require("../__chunks__/useFocusWithin-C1ioGWec.js");
|
|
35
|
+
const context = require("../__chunks__/context-D3NeXov7.js");
|
|
36
|
+
const useLocalizedStringFormatter = require("../__chunks__/useLocalizedStringFormatter-CaF1VsOH.js");
|
|
37
|
+
function $ab5bf3f618090389$export$87194bb378cc3ac2(props) {
|
|
38
|
+
let overlayState = Overlay.$fc909762b330b746$export$61c6a8c84e605fb6(props);
|
|
39
|
+
let [value, setValue] = useControlledState.$458b0a5536c1a7cf$export$40bfa8c7b0832715(props.value, props.defaultValue || null, props.onChange);
|
|
40
|
+
let v = value || props.placeholderValue || null;
|
|
41
|
+
let [granularity, defaultTimeZone] = DatePickerBase.$35a22f14a1f04b11$export$2440da353cedad43(v, props.granularity);
|
|
42
|
+
let dateValue = value != null ? value.toDate(defaultTimeZone !== null && defaultTimeZone !== void 0 ? defaultTimeZone : "UTC") : null;
|
|
43
|
+
let hasTime = granularity === "hour" || granularity === "minute" || granularity === "second";
|
|
44
|
+
var _props_shouldCloseOnSelect;
|
|
45
|
+
let shouldCloseOnSelect = (_props_shouldCloseOnSelect = props.shouldCloseOnSelect) !== null && _props_shouldCloseOnSelect !== void 0 ? _props_shouldCloseOnSelect : true;
|
|
46
|
+
let [selectedDate, setSelectedDate] = React.useState(null);
|
|
47
|
+
let [selectedTime, setSelectedTime] = React.useState(null);
|
|
48
|
+
if (value) {
|
|
49
|
+
selectedDate = value;
|
|
50
|
+
if ("hour" in value) selectedTime = value;
|
|
51
|
+
}
|
|
52
|
+
if (v && !(granularity in v)) throw new Error("Invalid granularity " + granularity + " for value " + v.toString());
|
|
53
|
+
let showEra = (value === null || value === void 0 ? void 0 : value.calendar.identifier) === "gregory" && value.era === "BC";
|
|
54
|
+
let formatOpts = React.useMemo(() => ({
|
|
55
|
+
granularity,
|
|
56
|
+
timeZone: defaultTimeZone,
|
|
57
|
+
hideTimeZone: props.hideTimeZone,
|
|
58
|
+
hourCycle: props.hourCycle,
|
|
59
|
+
shouldForceLeadingZeros: props.shouldForceLeadingZeros,
|
|
60
|
+
showEra
|
|
61
|
+
}), [
|
|
62
|
+
granularity,
|
|
63
|
+
props.hourCycle,
|
|
64
|
+
props.shouldForceLeadingZeros,
|
|
65
|
+
defaultTimeZone,
|
|
66
|
+
props.hideTimeZone,
|
|
67
|
+
showEra
|
|
68
|
+
]);
|
|
69
|
+
let { minValue, maxValue, isDateUnavailable } = props;
|
|
70
|
+
let builtinValidation = React.useMemo(() => DatePickerBase.$35a22f14a1f04b11$export$f18627323ab57ac0(value, minValue, maxValue, isDateUnavailable, formatOpts), [
|
|
71
|
+
value,
|
|
72
|
+
minValue,
|
|
73
|
+
maxValue,
|
|
74
|
+
isDateUnavailable,
|
|
75
|
+
formatOpts
|
|
76
|
+
]);
|
|
77
|
+
let validation = useFormValidation.$e5be200c675c3b3a$export$fc1a364ae1f3ff10(__spreadProps(__spreadValues({}, props), {
|
|
78
|
+
value,
|
|
79
|
+
builtinValidation
|
|
80
|
+
}));
|
|
81
|
+
let isValueInvalid = validation.displayValidation.isInvalid;
|
|
82
|
+
let validationState = props.validationState || (isValueInvalid ? "invalid" : null);
|
|
83
|
+
let commitValue = (date, time) => {
|
|
84
|
+
setValue("timeZone" in time ? time.set(CalendarBase.$11d87f3f76e88657$export$93522d1a439f3617(date)) : CalendarBase.$11d87f3f76e88657$export$b21e0b124e224484(date, time));
|
|
85
|
+
setSelectedDate(null);
|
|
86
|
+
setSelectedTime(null);
|
|
87
|
+
validation.commitValidation();
|
|
88
|
+
};
|
|
89
|
+
let selectDate = (newValue) => {
|
|
90
|
+
let shouldClose = typeof shouldCloseOnSelect === "function" ? shouldCloseOnSelect() : shouldCloseOnSelect;
|
|
91
|
+
if (hasTime) {
|
|
92
|
+
if (selectedTime || shouldClose) commitValue(newValue, selectedTime || DatePickerBase.$35a22f14a1f04b11$export$c5221a78ef73c5e9(props.defaultValue || props.placeholderValue));
|
|
93
|
+
else setSelectedDate(newValue);
|
|
94
|
+
} else {
|
|
95
|
+
setValue(newValue);
|
|
96
|
+
validation.commitValidation();
|
|
97
|
+
}
|
|
98
|
+
if (shouldClose) overlayState.setOpen(false);
|
|
99
|
+
};
|
|
100
|
+
let selectTime = (newValue) => {
|
|
101
|
+
if (selectedDate && newValue) commitValue(selectedDate, newValue);
|
|
102
|
+
else setSelectedTime(newValue);
|
|
103
|
+
};
|
|
104
|
+
return __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, validation), {
|
|
105
|
+
value,
|
|
106
|
+
setValue,
|
|
107
|
+
dateValue: selectedDate,
|
|
108
|
+
timeValue: selectedTime,
|
|
109
|
+
setDateValue: selectDate,
|
|
110
|
+
setTimeValue: selectTime,
|
|
111
|
+
granularity,
|
|
112
|
+
hasTime
|
|
113
|
+
}), overlayState), {
|
|
114
|
+
setOpen(isOpen) {
|
|
115
|
+
if (!isOpen && !value && selectedDate && hasTime) commitValue(selectedDate, selectedTime || DatePickerBase.$35a22f14a1f04b11$export$c5221a78ef73c5e9(props.defaultValue || props.placeholderValue));
|
|
116
|
+
overlayState.setOpen(isOpen);
|
|
117
|
+
},
|
|
118
|
+
validationState,
|
|
119
|
+
isInvalid: isValueInvalid,
|
|
120
|
+
formatValue(locale, fieldOptions) {
|
|
121
|
+
if (!dateValue) return "";
|
|
122
|
+
let formatOptions = DatePickerBase.$35a22f14a1f04b11$export$7e319ea407e63bc0(fieldOptions, formatOpts);
|
|
123
|
+
let formatter = new CalendarBase.$fb18d541ea1ad717$export$ad991b66133851cf(locale, formatOptions);
|
|
124
|
+
return formatter.format(dateValue);
|
|
125
|
+
},
|
|
126
|
+
getDateFormatter(locale, formatOptions) {
|
|
127
|
+
let newOptions = __spreadValues(__spreadValues({}, formatOpts), formatOptions);
|
|
128
|
+
let newFormatOptions = DatePickerBase.$35a22f14a1f04b11$export$7e319ea407e63bc0({}, newOptions);
|
|
129
|
+
return new CalendarBase.$fb18d541ea1ad717$export$ad991b66133851cf(locale, newFormatOptions);
|
|
130
|
+
}
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
function $parcel$interopDefault(a) {
|
|
134
|
+
return a && a.__esModule ? a.default : a;
|
|
135
|
+
}
|
|
136
|
+
function $6057a3d2a53a12fd$export$42df105a73306d51(props, state, ref) {
|
|
137
|
+
let buttonId = mergeProps.$bdb11010cef70236$export$f680877a34711e37();
|
|
138
|
+
let dialogId = mergeProps.$bdb11010cef70236$export$f680877a34711e37();
|
|
139
|
+
let fieldId = mergeProps.$bdb11010cef70236$export$f680877a34711e37();
|
|
140
|
+
let stringFormatter = useLocalizedStringFormatter.$fca6afa0e843324b$export$f12b703ca79dfbb1($parcel$interopDefault(DatePickerBase.$dfb4eba373ed9493$exports), "@react-aria/datepicker");
|
|
141
|
+
let { isInvalid, validationErrors, validationDetails } = state.displayValidation;
|
|
142
|
+
let { labelProps, fieldProps, descriptionProps, errorMessageProps } = useField.$2baaea4c71418dea$export$294aa081a6c6f55d(__spreadProps(__spreadValues({}, props), {
|
|
143
|
+
labelElementType: "span",
|
|
144
|
+
isInvalid,
|
|
145
|
+
errorMessage: props.errorMessage || validationErrors
|
|
146
|
+
}));
|
|
147
|
+
let groupProps = DatePickerBase.$3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref);
|
|
148
|
+
let labelledBy = fieldProps["aria-labelledby"] || fieldProps.id;
|
|
149
|
+
let { locale } = context.$18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
|
|
150
|
+
let date = state.formatValue(locale, {
|
|
151
|
+
month: "long"
|
|
152
|
+
});
|
|
153
|
+
let description = date ? stringFormatter.format("selectedDateDescription", {
|
|
154
|
+
date
|
|
155
|
+
}) : "";
|
|
156
|
+
let descProps = scrollIntoView.$ef06256079686ba0$export$f8aeda7b10753fa1(description);
|
|
157
|
+
let ariaDescribedBy = [
|
|
158
|
+
descProps["aria-describedby"],
|
|
159
|
+
fieldProps["aria-describedby"]
|
|
160
|
+
].filter(Boolean).join(" ") || void 0;
|
|
161
|
+
let domProps = filterDOMProps.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props);
|
|
162
|
+
let focusManager = React.useMemo(() => FocusScope.$9bf71ea28793e738$export$c5251b9e124bf29(ref), [
|
|
163
|
+
ref
|
|
164
|
+
]);
|
|
165
|
+
let { focusWithinProps } = useFocusWithin.$9ab94262bd0047c7$export$420e68273165f4ec(__spreadProps(__spreadValues({}, props), {
|
|
166
|
+
isDisabled: state.isOpen,
|
|
167
|
+
onBlurWithin: props.onBlur,
|
|
168
|
+
onFocusWithin: props.onFocus,
|
|
169
|
+
onFocusWithinChange: props.onFocusChange
|
|
170
|
+
}));
|
|
171
|
+
return {
|
|
172
|
+
groupProps: mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
|
|
173
|
+
role: "group",
|
|
174
|
+
"aria-disabled": props.isDisabled || null,
|
|
175
|
+
"aria-labelledby": labelledBy,
|
|
176
|
+
"aria-describedby": ariaDescribedBy,
|
|
177
|
+
onKeyDown(e) {
|
|
178
|
+
if (state.isOpen) return;
|
|
179
|
+
if (props.onKeyDown) props.onKeyDown(e);
|
|
180
|
+
},
|
|
181
|
+
onKeyUp(e) {
|
|
182
|
+
if (state.isOpen) return;
|
|
183
|
+
if (props.onKeyUp) props.onKeyUp(e);
|
|
184
|
+
}
|
|
185
|
+
}),
|
|
186
|
+
labelProps: __spreadProps(__spreadValues({}, labelProps), {
|
|
187
|
+
onClick: () => {
|
|
188
|
+
focusManager.focusFirst();
|
|
189
|
+
}
|
|
190
|
+
}),
|
|
191
|
+
fieldProps: __spreadProps(__spreadValues({}, fieldProps), {
|
|
192
|
+
id: fieldId,
|
|
193
|
+
[DatePickerBase.$16f0b7bb276bc17e$export$300019f83c56d282]: "presentation",
|
|
194
|
+
"aria-describedby": ariaDescribedBy,
|
|
195
|
+
value: state.value,
|
|
196
|
+
onChange: state.setValue,
|
|
197
|
+
placeholderValue: props.placeholderValue,
|
|
198
|
+
hideTimeZone: props.hideTimeZone,
|
|
199
|
+
hourCycle: props.hourCycle,
|
|
200
|
+
shouldForceLeadingZeros: props.shouldForceLeadingZeros,
|
|
201
|
+
granularity: props.granularity,
|
|
202
|
+
isDisabled: props.isDisabled,
|
|
203
|
+
isReadOnly: props.isReadOnly,
|
|
204
|
+
isRequired: props.isRequired,
|
|
205
|
+
validationBehavior: props.validationBehavior,
|
|
206
|
+
// DatePicker owns the validation state for the date field.
|
|
207
|
+
[useFormValidation.$e5be200c675c3b3a$export$a763b9476acd3eb]: state,
|
|
208
|
+
autoFocus: props.autoFocus,
|
|
209
|
+
name: props.name
|
|
210
|
+
}),
|
|
211
|
+
descriptionProps,
|
|
212
|
+
errorMessageProps,
|
|
213
|
+
buttonProps: __spreadProps(__spreadValues({}, descProps), {
|
|
214
|
+
id: buttonId,
|
|
215
|
+
"aria-haspopup": "dialog",
|
|
216
|
+
"aria-label": stringFormatter.format("calendar"),
|
|
217
|
+
"aria-labelledby": `${buttonId} ${labelledBy}`,
|
|
218
|
+
"aria-describedby": ariaDescribedBy,
|
|
219
|
+
"aria-expanded": state.isOpen,
|
|
220
|
+
isDisabled: props.isDisabled || props.isReadOnly,
|
|
221
|
+
onPress: () => state.setOpen(true)
|
|
222
|
+
}),
|
|
223
|
+
dialogProps: {
|
|
224
|
+
id: dialogId,
|
|
225
|
+
"aria-labelledby": `${buttonId} ${labelledBy}`
|
|
226
|
+
},
|
|
227
|
+
calendarProps: {
|
|
228
|
+
autoFocus: true,
|
|
229
|
+
value: state.dateValue,
|
|
230
|
+
onChange: state.setDateValue,
|
|
231
|
+
minValue: props.minValue,
|
|
232
|
+
maxValue: props.maxValue,
|
|
233
|
+
isDisabled: props.isDisabled,
|
|
234
|
+
isReadOnly: props.isReadOnly,
|
|
235
|
+
isDateUnavailable: props.isDateUnavailable,
|
|
236
|
+
defaultFocusedValue: state.dateValue ? void 0 : props.placeholderValue,
|
|
237
|
+
isInvalid: state.isInvalid,
|
|
238
|
+
errorMessage: typeof props.errorMessage === "function" ? props.errorMessage(state.displayValidation) : props.errorMessage || state.displayValidation.validationErrors.join(" ")
|
|
239
|
+
},
|
|
240
|
+
isInvalid,
|
|
241
|
+
validationErrors,
|
|
242
|
+
validationDetails
|
|
243
|
+
};
|
|
244
|
+
}
|
|
245
|
+
function DatePicker(props) {
|
|
246
|
+
const { label, size = "md", isDisabled, isInvalid, errorMessage, "aria-label": ariaLabel } = props;
|
|
247
|
+
const datePickerRef = React.useRef(null);
|
|
248
|
+
const state = $ab5bf3f618090389$export$87194bb378cc3ac2(props);
|
|
249
|
+
const { groupProps, labelProps, fieldProps, buttonProps, dialogProps, calendarProps } = $6057a3d2a53a12fd$export$42df105a73306d51(props, state, datePickerRef);
|
|
250
|
+
const triggerProps = {
|
|
251
|
+
datePickerRef,
|
|
252
|
+
buttonProps,
|
|
253
|
+
groupProps,
|
|
254
|
+
fieldProps,
|
|
255
|
+
isDisabled,
|
|
256
|
+
size,
|
|
257
|
+
isInvalid,
|
|
258
|
+
errorMessage: errorMessage || calendarProps.errorMessage
|
|
259
|
+
};
|
|
260
|
+
const overlayProps = {
|
|
261
|
+
dialogProps
|
|
262
|
+
};
|
|
263
|
+
return React.createElement(DatePickerBase.DatePickerBase, {
|
|
264
|
+
labelProps,
|
|
265
|
+
triggerProps,
|
|
266
|
+
overlayProps,
|
|
267
|
+
state,
|
|
268
|
+
label,
|
|
269
|
+
"aria-label": ariaLabel
|
|
270
|
+
}, React.createElement(Calendar.Calendar, __spreadProps(__spreadValues({}, calendarProps), {
|
|
271
|
+
isInvalid: false
|
|
272
|
+
})));
|
|
273
|
+
}
|
|
274
|
+
DatePicker.displayName = "DatePicker";
|
|
275
|
+
exports.DatePicker = DatePicker;
|
|
@@ -0,0 +1,275 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
import React__default, { useState, useMemo } from "react";
|
|
21
|
+
import { $ as $35a22f14a1f04b11$export$2440da353cedad43, h as $35a22f14a1f04b11$export$f18627323ab57ac0, b as $35a22f14a1f04b11$export$c5221a78ef73c5e9, c as $35a22f14a1f04b11$export$7e319ea407e63bc0, d as $3dfb0f96be0d6a08$export$4a931266a3838b86, f as $16f0b7bb276bc17e$export$300019f83c56d282, g as $dfb4eba373ed9493$exports, D as DatePickerBase } from "../__chunks__/DatePickerBase-DlbnqBLN.mjs";
|
|
22
|
+
import { C as Calendar } from "../__chunks__/Calendar-C9hD67Rz.mjs";
|
|
23
|
+
import { m as $fb18d541ea1ad717$export$ad991b66133851cf, d as $11d87f3f76e88657$export$93522d1a439f3617, n as $11d87f3f76e88657$export$b21e0b124e224484 } from "../__chunks__/CalendarBase-4iGD1mPK.mjs";
|
|
24
|
+
import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, b as $e5be200c675c3b3a$export$a763b9476acd3eb } from "../__chunks__/useFormValidation-D5Y_7NR2.mjs";
|
|
25
|
+
import { c as $fc909762b330b746$export$61c6a8c84e605fb6 } from "../__chunks__/Overlay-d3z5W5Nn.mjs";
|
|
26
|
+
import { $ as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../__chunks__/useControlledState-CFWhSD5C.mjs";
|
|
27
|
+
import { a as $9bf71ea28793e738$export$c5251b9e124bf29 } from "../__chunks__/FocusScope-CjcZn1Rq.mjs";
|
|
28
|
+
import { d as $bdb11010cef70236$export$f680877a34711e37, $ as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../__chunks__/mergeProps-T961Q1yJ.mjs";
|
|
29
|
+
import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../__chunks__/filterDOMProps-EDDcM64A.mjs";
|
|
30
|
+
import { $ as $ef06256079686ba0$export$f8aeda7b10753fa1 } from "../__chunks__/scrollIntoView-GfnXaOCE.mjs";
|
|
31
|
+
import { $ as $2baaea4c71418dea$export$294aa081a6c6f55d } from "../__chunks__/useField-DWmSslhe.mjs";
|
|
32
|
+
import { $ as $9ab94262bd0047c7$export$420e68273165f4ec } from "../__chunks__/useFocusWithin-CfhMwfXS.mjs";
|
|
33
|
+
import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../__chunks__/context-DEwqildc.mjs";
|
|
34
|
+
import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "../__chunks__/useLocalizedStringFormatter-CLrYoOi9.mjs";
|
|
35
|
+
function $ab5bf3f618090389$export$87194bb378cc3ac2(props) {
|
|
36
|
+
let overlayState = $fc909762b330b746$export$61c6a8c84e605fb6(props);
|
|
37
|
+
let [value, setValue] = $458b0a5536c1a7cf$export$40bfa8c7b0832715(props.value, props.defaultValue || null, props.onChange);
|
|
38
|
+
let v = value || props.placeholderValue || null;
|
|
39
|
+
let [granularity, defaultTimeZone] = $35a22f14a1f04b11$export$2440da353cedad43(v, props.granularity);
|
|
40
|
+
let dateValue = value != null ? value.toDate(defaultTimeZone !== null && defaultTimeZone !== void 0 ? defaultTimeZone : "UTC") : null;
|
|
41
|
+
let hasTime = granularity === "hour" || granularity === "minute" || granularity === "second";
|
|
42
|
+
var _props_shouldCloseOnSelect;
|
|
43
|
+
let shouldCloseOnSelect = (_props_shouldCloseOnSelect = props.shouldCloseOnSelect) !== null && _props_shouldCloseOnSelect !== void 0 ? _props_shouldCloseOnSelect : true;
|
|
44
|
+
let [selectedDate, setSelectedDate] = useState(null);
|
|
45
|
+
let [selectedTime, setSelectedTime] = useState(null);
|
|
46
|
+
if (value) {
|
|
47
|
+
selectedDate = value;
|
|
48
|
+
if ("hour" in value) selectedTime = value;
|
|
49
|
+
}
|
|
50
|
+
if (v && !(granularity in v)) throw new Error("Invalid granularity " + granularity + " for value " + v.toString());
|
|
51
|
+
let showEra = (value === null || value === void 0 ? void 0 : value.calendar.identifier) === "gregory" && value.era === "BC";
|
|
52
|
+
let formatOpts = useMemo(() => ({
|
|
53
|
+
granularity,
|
|
54
|
+
timeZone: defaultTimeZone,
|
|
55
|
+
hideTimeZone: props.hideTimeZone,
|
|
56
|
+
hourCycle: props.hourCycle,
|
|
57
|
+
shouldForceLeadingZeros: props.shouldForceLeadingZeros,
|
|
58
|
+
showEra
|
|
59
|
+
}), [
|
|
60
|
+
granularity,
|
|
61
|
+
props.hourCycle,
|
|
62
|
+
props.shouldForceLeadingZeros,
|
|
63
|
+
defaultTimeZone,
|
|
64
|
+
props.hideTimeZone,
|
|
65
|
+
showEra
|
|
66
|
+
]);
|
|
67
|
+
let { minValue, maxValue, isDateUnavailable } = props;
|
|
68
|
+
let builtinValidation = useMemo(() => $35a22f14a1f04b11$export$f18627323ab57ac0(value, minValue, maxValue, isDateUnavailable, formatOpts), [
|
|
69
|
+
value,
|
|
70
|
+
minValue,
|
|
71
|
+
maxValue,
|
|
72
|
+
isDateUnavailable,
|
|
73
|
+
formatOpts
|
|
74
|
+
]);
|
|
75
|
+
let validation = $e5be200c675c3b3a$export$fc1a364ae1f3ff10(__spreadProps(__spreadValues({}, props), {
|
|
76
|
+
value,
|
|
77
|
+
builtinValidation
|
|
78
|
+
}));
|
|
79
|
+
let isValueInvalid = validation.displayValidation.isInvalid;
|
|
80
|
+
let validationState = props.validationState || (isValueInvalid ? "invalid" : null);
|
|
81
|
+
let commitValue = (date, time) => {
|
|
82
|
+
setValue("timeZone" in time ? time.set($11d87f3f76e88657$export$93522d1a439f3617(date)) : $11d87f3f76e88657$export$b21e0b124e224484(date, time));
|
|
83
|
+
setSelectedDate(null);
|
|
84
|
+
setSelectedTime(null);
|
|
85
|
+
validation.commitValidation();
|
|
86
|
+
};
|
|
87
|
+
let selectDate = (newValue) => {
|
|
88
|
+
let shouldClose = typeof shouldCloseOnSelect === "function" ? shouldCloseOnSelect() : shouldCloseOnSelect;
|
|
89
|
+
if (hasTime) {
|
|
90
|
+
if (selectedTime || shouldClose) commitValue(newValue, selectedTime || $35a22f14a1f04b11$export$c5221a78ef73c5e9(props.defaultValue || props.placeholderValue));
|
|
91
|
+
else setSelectedDate(newValue);
|
|
92
|
+
} else {
|
|
93
|
+
setValue(newValue);
|
|
94
|
+
validation.commitValidation();
|
|
95
|
+
}
|
|
96
|
+
if (shouldClose) overlayState.setOpen(false);
|
|
97
|
+
};
|
|
98
|
+
let selectTime = (newValue) => {
|
|
99
|
+
if (selectedDate && newValue) commitValue(selectedDate, newValue);
|
|
100
|
+
else setSelectedTime(newValue);
|
|
101
|
+
};
|
|
102
|
+
return __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, validation), {
|
|
103
|
+
value,
|
|
104
|
+
setValue,
|
|
105
|
+
dateValue: selectedDate,
|
|
106
|
+
timeValue: selectedTime,
|
|
107
|
+
setDateValue: selectDate,
|
|
108
|
+
setTimeValue: selectTime,
|
|
109
|
+
granularity,
|
|
110
|
+
hasTime
|
|
111
|
+
}), overlayState), {
|
|
112
|
+
setOpen(isOpen) {
|
|
113
|
+
if (!isOpen && !value && selectedDate && hasTime) commitValue(selectedDate, selectedTime || $35a22f14a1f04b11$export$c5221a78ef73c5e9(props.defaultValue || props.placeholderValue));
|
|
114
|
+
overlayState.setOpen(isOpen);
|
|
115
|
+
},
|
|
116
|
+
validationState,
|
|
117
|
+
isInvalid: isValueInvalid,
|
|
118
|
+
formatValue(locale, fieldOptions) {
|
|
119
|
+
if (!dateValue) return "";
|
|
120
|
+
let formatOptions = $35a22f14a1f04b11$export$7e319ea407e63bc0(fieldOptions, formatOpts);
|
|
121
|
+
let formatter = new $fb18d541ea1ad717$export$ad991b66133851cf(locale, formatOptions);
|
|
122
|
+
return formatter.format(dateValue);
|
|
123
|
+
},
|
|
124
|
+
getDateFormatter(locale, formatOptions) {
|
|
125
|
+
let newOptions = __spreadValues(__spreadValues({}, formatOpts), formatOptions);
|
|
126
|
+
let newFormatOptions = $35a22f14a1f04b11$export$7e319ea407e63bc0({}, newOptions);
|
|
127
|
+
return new $fb18d541ea1ad717$export$ad991b66133851cf(locale, newFormatOptions);
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
function $parcel$interopDefault(a) {
|
|
132
|
+
return a && a.__esModule ? a.default : a;
|
|
133
|
+
}
|
|
134
|
+
function $6057a3d2a53a12fd$export$42df105a73306d51(props, state, ref) {
|
|
135
|
+
let buttonId = $bdb11010cef70236$export$f680877a34711e37();
|
|
136
|
+
let dialogId = $bdb11010cef70236$export$f680877a34711e37();
|
|
137
|
+
let fieldId = $bdb11010cef70236$export$f680877a34711e37();
|
|
138
|
+
let stringFormatter = $fca6afa0e843324b$export$f12b703ca79dfbb1($parcel$interopDefault($dfb4eba373ed9493$exports), "@react-aria/datepicker");
|
|
139
|
+
let { isInvalid, validationErrors, validationDetails } = state.displayValidation;
|
|
140
|
+
let { labelProps, fieldProps, descriptionProps, errorMessageProps } = $2baaea4c71418dea$export$294aa081a6c6f55d(__spreadProps(__spreadValues({}, props), {
|
|
141
|
+
labelElementType: "span",
|
|
142
|
+
isInvalid,
|
|
143
|
+
errorMessage: props.errorMessage || validationErrors
|
|
144
|
+
}));
|
|
145
|
+
let groupProps = $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref);
|
|
146
|
+
let labelledBy = fieldProps["aria-labelledby"] || fieldProps.id;
|
|
147
|
+
let { locale } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
|
|
148
|
+
let date = state.formatValue(locale, {
|
|
149
|
+
month: "long"
|
|
150
|
+
});
|
|
151
|
+
let description = date ? stringFormatter.format("selectedDateDescription", {
|
|
152
|
+
date
|
|
153
|
+
}) : "";
|
|
154
|
+
let descProps = $ef06256079686ba0$export$f8aeda7b10753fa1(description);
|
|
155
|
+
let ariaDescribedBy = [
|
|
156
|
+
descProps["aria-describedby"],
|
|
157
|
+
fieldProps["aria-describedby"]
|
|
158
|
+
].filter(Boolean).join(" ") || void 0;
|
|
159
|
+
let domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props);
|
|
160
|
+
let focusManager = useMemo(() => $9bf71ea28793e738$export$c5251b9e124bf29(ref), [
|
|
161
|
+
ref
|
|
162
|
+
]);
|
|
163
|
+
let { focusWithinProps } = $9ab94262bd0047c7$export$420e68273165f4ec(__spreadProps(__spreadValues({}, props), {
|
|
164
|
+
isDisabled: state.isOpen,
|
|
165
|
+
onBlurWithin: props.onBlur,
|
|
166
|
+
onFocusWithin: props.onFocus,
|
|
167
|
+
onFocusWithinChange: props.onFocusChange
|
|
168
|
+
}));
|
|
169
|
+
return {
|
|
170
|
+
groupProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, groupProps, fieldProps, descProps, focusWithinProps, {
|
|
171
|
+
role: "group",
|
|
172
|
+
"aria-disabled": props.isDisabled || null,
|
|
173
|
+
"aria-labelledby": labelledBy,
|
|
174
|
+
"aria-describedby": ariaDescribedBy,
|
|
175
|
+
onKeyDown(e) {
|
|
176
|
+
if (state.isOpen) return;
|
|
177
|
+
if (props.onKeyDown) props.onKeyDown(e);
|
|
178
|
+
},
|
|
179
|
+
onKeyUp(e) {
|
|
180
|
+
if (state.isOpen) return;
|
|
181
|
+
if (props.onKeyUp) props.onKeyUp(e);
|
|
182
|
+
}
|
|
183
|
+
}),
|
|
184
|
+
labelProps: __spreadProps(__spreadValues({}, labelProps), {
|
|
185
|
+
onClick: () => {
|
|
186
|
+
focusManager.focusFirst();
|
|
187
|
+
}
|
|
188
|
+
}),
|
|
189
|
+
fieldProps: __spreadProps(__spreadValues({}, fieldProps), {
|
|
190
|
+
id: fieldId,
|
|
191
|
+
[$16f0b7bb276bc17e$export$300019f83c56d282]: "presentation",
|
|
192
|
+
"aria-describedby": ariaDescribedBy,
|
|
193
|
+
value: state.value,
|
|
194
|
+
onChange: state.setValue,
|
|
195
|
+
placeholderValue: props.placeholderValue,
|
|
196
|
+
hideTimeZone: props.hideTimeZone,
|
|
197
|
+
hourCycle: props.hourCycle,
|
|
198
|
+
shouldForceLeadingZeros: props.shouldForceLeadingZeros,
|
|
199
|
+
granularity: props.granularity,
|
|
200
|
+
isDisabled: props.isDisabled,
|
|
201
|
+
isReadOnly: props.isReadOnly,
|
|
202
|
+
isRequired: props.isRequired,
|
|
203
|
+
validationBehavior: props.validationBehavior,
|
|
204
|
+
// DatePicker owns the validation state for the date field.
|
|
205
|
+
[$e5be200c675c3b3a$export$a763b9476acd3eb]: state,
|
|
206
|
+
autoFocus: props.autoFocus,
|
|
207
|
+
name: props.name
|
|
208
|
+
}),
|
|
209
|
+
descriptionProps,
|
|
210
|
+
errorMessageProps,
|
|
211
|
+
buttonProps: __spreadProps(__spreadValues({}, descProps), {
|
|
212
|
+
id: buttonId,
|
|
213
|
+
"aria-haspopup": "dialog",
|
|
214
|
+
"aria-label": stringFormatter.format("calendar"),
|
|
215
|
+
"aria-labelledby": `${buttonId} ${labelledBy}`,
|
|
216
|
+
"aria-describedby": ariaDescribedBy,
|
|
217
|
+
"aria-expanded": state.isOpen,
|
|
218
|
+
isDisabled: props.isDisabled || props.isReadOnly,
|
|
219
|
+
onPress: () => state.setOpen(true)
|
|
220
|
+
}),
|
|
221
|
+
dialogProps: {
|
|
222
|
+
id: dialogId,
|
|
223
|
+
"aria-labelledby": `${buttonId} ${labelledBy}`
|
|
224
|
+
},
|
|
225
|
+
calendarProps: {
|
|
226
|
+
autoFocus: true,
|
|
227
|
+
value: state.dateValue,
|
|
228
|
+
onChange: state.setDateValue,
|
|
229
|
+
minValue: props.minValue,
|
|
230
|
+
maxValue: props.maxValue,
|
|
231
|
+
isDisabled: props.isDisabled,
|
|
232
|
+
isReadOnly: props.isReadOnly,
|
|
233
|
+
isDateUnavailable: props.isDateUnavailable,
|
|
234
|
+
defaultFocusedValue: state.dateValue ? void 0 : props.placeholderValue,
|
|
235
|
+
isInvalid: state.isInvalid,
|
|
236
|
+
errorMessage: typeof props.errorMessage === "function" ? props.errorMessage(state.displayValidation) : props.errorMessage || state.displayValidation.validationErrors.join(" ")
|
|
237
|
+
},
|
|
238
|
+
isInvalid,
|
|
239
|
+
validationErrors,
|
|
240
|
+
validationDetails
|
|
241
|
+
};
|
|
242
|
+
}
|
|
243
|
+
function DatePicker(props) {
|
|
244
|
+
const { label, size = "md", isDisabled, isInvalid, errorMessage, "aria-label": ariaLabel } = props;
|
|
245
|
+
const datePickerRef = React__default.useRef(null);
|
|
246
|
+
const state = $ab5bf3f618090389$export$87194bb378cc3ac2(props);
|
|
247
|
+
const { groupProps, labelProps, fieldProps, buttonProps, dialogProps, calendarProps } = $6057a3d2a53a12fd$export$42df105a73306d51(props, state, datePickerRef);
|
|
248
|
+
const triggerProps = {
|
|
249
|
+
datePickerRef,
|
|
250
|
+
buttonProps,
|
|
251
|
+
groupProps,
|
|
252
|
+
fieldProps,
|
|
253
|
+
isDisabled,
|
|
254
|
+
size,
|
|
255
|
+
isInvalid,
|
|
256
|
+
errorMessage: errorMessage || calendarProps.errorMessage
|
|
257
|
+
};
|
|
258
|
+
const overlayProps = {
|
|
259
|
+
dialogProps
|
|
260
|
+
};
|
|
261
|
+
return React__default.createElement(DatePickerBase, {
|
|
262
|
+
labelProps,
|
|
263
|
+
triggerProps,
|
|
264
|
+
overlayProps,
|
|
265
|
+
state,
|
|
266
|
+
label,
|
|
267
|
+
"aria-label": ariaLabel
|
|
268
|
+
}, React__default.createElement(Calendar, __spreadProps(__spreadValues({}, calendarProps), {
|
|
269
|
+
isInvalid: false
|
|
270
|
+
})));
|
|
271
|
+
}
|
|
272
|
+
DatePicker.displayName = "DatePicker";
|
|
273
|
+
export {
|
|
274
|
+
DatePicker
|
|
275
|
+
};
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import React, { ReactNode } from "react";
|
|
2
|
+
import { RangeValue } from "@react-types/shared";
|
|
3
|
+
import { DateValue, MappedDateValue } from "@react-types/calendar";
|
|
4
|
+
export type DateRangePickerProps = {
|
|
5
|
+
/**
|
|
6
|
+
* Accessibility label for input field.
|
|
7
|
+
*/
|
|
8
|
+
"aria-label"?: string;
|
|
9
|
+
/**
|
|
10
|
+
* The content to display as the label.
|
|
11
|
+
*/
|
|
12
|
+
label?: string;
|
|
13
|
+
/**
|
|
14
|
+
* The default value (uncontrolled).
|
|
15
|
+
*/
|
|
16
|
+
defaultValue?: RangeValue<DateValue> | null;
|
|
17
|
+
/**
|
|
18
|
+
* The current value (controlled).
|
|
19
|
+
*/
|
|
20
|
+
value?: RangeValue<DateValue> | null;
|
|
21
|
+
/**
|
|
22
|
+
* Handler that is called when the value changes.
|
|
23
|
+
*/
|
|
24
|
+
onChange?: (value: RangeValue<MappedDateValue<DateValue>> | null) => void;
|
|
25
|
+
/**
|
|
26
|
+
* The minimum allowed date that a user may select.
|
|
27
|
+
*/
|
|
28
|
+
minValue?: DateValue;
|
|
29
|
+
/**
|
|
30
|
+
* The maximum allowed date that a user may select.
|
|
31
|
+
*/
|
|
32
|
+
maxValue?: DateValue;
|
|
33
|
+
/**
|
|
34
|
+
* Whether the input is disabled.
|
|
35
|
+
*/
|
|
36
|
+
isDisabled?: boolean;
|
|
37
|
+
/**
|
|
38
|
+
* Whether the input value is invalid.
|
|
39
|
+
*/
|
|
40
|
+
isInvalid?: boolean;
|
|
41
|
+
/**
|
|
42
|
+
* An error message to display when the selected value is invalid.
|
|
43
|
+
*/
|
|
44
|
+
errorMessage?: ReactNode;
|
|
45
|
+
/**
|
|
46
|
+
* Callback that is called for each date of the calendar. If
|
|
47
|
+
* it returns true, then the date is unavailable.
|
|
48
|
+
*/
|
|
49
|
+
isDateUnavailable?: (date: DateValue) => boolean;
|
|
50
|
+
/**
|
|
51
|
+
* The size of the DateRangePicker.
|
|
52
|
+
* @default md
|
|
53
|
+
*/
|
|
54
|
+
size?: "sm" | "md";
|
|
55
|
+
};
|
|
56
|
+
/**
|
|
57
|
+
* A `DateRangePicker` has a `DateField` and a calendar popover
|
|
58
|
+
* to allow users to enter or select a date.
|
|
59
|
+
*
|
|
60
|
+
* @remarks
|
|
61
|
+
* Use a DateRangePicker when you want to provide a view that
|
|
62
|
+
* allows the users to select a date.
|
|
63
|
+
*
|
|
64
|
+
* @example
|
|
65
|
+
* _Standalone:_
|
|
66
|
+
* ```tsx
|
|
67
|
+
* import { DateRangePicker } from "@easypost/easy-ui/DateRangePicker";
|
|
68
|
+
*
|
|
69
|
+
* function PageWithDateRangePicker() {
|
|
70
|
+
* return <DateRangePicker />;
|
|
71
|
+
* }
|
|
72
|
+
* ```
|
|
73
|
+
*
|
|
74
|
+
* @example
|
|
75
|
+
* _Controlled:_
|
|
76
|
+
* ```tsx
|
|
77
|
+
* import { DateRangePicker } from "@easypost/easy-ui/DateRangePicker";
|
|
78
|
+
*
|
|
79
|
+
* function PageWithDateRangePicker() {
|
|
80
|
+
* const [date, setDate] = React.useState(null);
|
|
81
|
+
* return (
|
|
82
|
+
* <DateRangePicker value={date} onChange={setDate}
|
|
83
|
+
* aria-label="Date picker" />
|
|
84
|
+
* );
|
|
85
|
+
* }
|
|
86
|
+
* ```
|
|
87
|
+
*/
|
|
88
|
+
export declare function DateRangePicker(props: DateRangePickerProps): React.JSX.Element;
|
|
89
|
+
//# sourceMappingURL=DateRangePicker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateRangePicker.d.ts","sourceRoot":"","sources":["../../src/DateRangePicker/DateRangePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAInE,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAC5C;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IACrC;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1E;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;IACjD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,qBA+C1D"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { DateRangePicker } from "./DateRangePicker";
|
|
3
|
+
type Story = StoryObj<typeof DateRangePicker>;
|
|
4
|
+
declare const meta: Meta<typeof DateRangePicker>;
|
|
5
|
+
export default meta;
|
|
6
|
+
export declare const Standalone: Story;
|
|
7
|
+
export declare const DefaultValue: Story;
|
|
8
|
+
export declare const Sizes: Story;
|
|
9
|
+
export declare const LimitAvailableDates: Story;
|
|
10
|
+
export declare const DatesAvailability: Story;
|
|
11
|
+
export declare const ControlledSelection: Story;
|
|
12
|
+
export declare const InvalidSelection: Story;
|
|
13
|
+
export declare const Disabled: Story;
|
|
14
|
+
//# sourceMappingURL=DateRangePicker.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateRangePicker.stories.d.ts","sourceRoot":"","sources":["../../src/DateRangePicker/DateRangePicker.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIlD,OAAO,EAAE,eAAe,EAAwB,MAAM,mBAAmB,CAAC;AAE1E,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,eAAe,CAAC,CAAC;AAE9C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,eAAe,CAKtC,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,eAAO,MAAM,UAAU,EAAE,KAExB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAQ1B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAMjC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAK/B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAWjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAmB9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateRangePicker.test.d.ts","sourceRoot":"","sources":["../../src/DateRangePicker/DateRangePicker.test.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/DateRangePicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}
|