@salt-ds/date-components 1.1.1 → 1.1.3
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/CHANGELOG.md +71 -0
- package/css/salt-date-components.css +2 -2
- package/dist-cjs/calendar/Calendar.js +1 -1
- package/dist-cjs/calendar/Calendar.js.map +1 -1
- package/dist-cjs/calendar/CalendarGrid.js +1 -1
- package/dist-cjs/calendar/CalendarGrid.js.map +1 -1
- package/dist-cjs/calendar/CalendarMonthHeader.js +1 -1
- package/dist-cjs/calendar/CalendarMonthHeader.js.map +1 -1
- package/dist-cjs/calendar/CalendarNavigation.js +1 -1
- package/dist-cjs/calendar/CalendarNavigation.js.map +1 -1
- package/dist-cjs/calendar/internal/createAnnouncement.js +3 -3
- package/dist-cjs/calendar/internal/createAnnouncement.js.map +1 -1
- package/dist-cjs/calendar/useCalendarSelection.js +1 -1
- package/dist-cjs/calendar/useCalendarSelection.js.map +1 -1
- package/dist-cjs/date-input/DateInput.css.js +1 -1
- package/dist-cjs/date-input/DateInputRange.js +9 -10
- package/dist-cjs/date-input/DateInputRange.js.map +1 -1
- package/dist-cjs/date-input/DateInputSingle.js +1 -1
- package/dist-cjs/date-input/DateInputSingle.js.map +1 -1
- package/dist-cjs/date-picker/DatePicker.js +1 -1
- package/dist-cjs/date-picker/DatePicker.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerActions.js +3 -3
- package/dist-cjs/date-picker/DatePickerActions.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerOverlayProvider.js +3 -1
- package/dist-cjs/date-picker/DatePickerOverlayProvider.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerRangeInput.js +2 -2
- package/dist-cjs/date-picker/DatePickerRangeInput.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerSingleInput.js +2 -2
- package/dist-cjs/date-picker/DatePickerSingleInput.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerTrigger.js +1 -1
- package/dist-cjs/date-picker/DatePickerTrigger.js.map +1 -1
- package/dist-cjs/date-picker/useDatePicker.js +1 -1
- package/dist-cjs/date-picker/useDatePicker.js.map +1 -1
- package/dist-es/calendar/Calendar.js +1 -1
- package/dist-es/calendar/Calendar.js.map +1 -1
- package/dist-es/calendar/CalendarGrid.js +1 -1
- package/dist-es/calendar/CalendarGrid.js.map +1 -1
- package/dist-es/calendar/CalendarMonthHeader.js +1 -1
- package/dist-es/calendar/CalendarMonthHeader.js.map +1 -1
- package/dist-es/calendar/CalendarNavigation.js +1 -1
- package/dist-es/calendar/CalendarNavigation.js.map +1 -1
- package/dist-es/calendar/internal/createAnnouncement.js +3 -3
- package/dist-es/calendar/internal/createAnnouncement.js.map +1 -1
- package/dist-es/calendar/useCalendarSelection.js +1 -1
- package/dist-es/calendar/useCalendarSelection.js.map +1 -1
- package/dist-es/date-input/DateInput.css.js +1 -1
- package/dist-es/date-input/DateInputRange.js +9 -10
- package/dist-es/date-input/DateInputRange.js.map +1 -1
- package/dist-es/date-input/DateInputSingle.js +1 -1
- package/dist-es/date-input/DateInputSingle.js.map +1 -1
- package/dist-es/date-picker/DatePicker.js +1 -1
- package/dist-es/date-picker/DatePicker.js.map +1 -1
- package/dist-es/date-picker/DatePickerActions.js +3 -3
- package/dist-es/date-picker/DatePickerActions.js.map +1 -1
- package/dist-es/date-picker/DatePickerOverlayProvider.js +3 -1
- package/dist-es/date-picker/DatePickerOverlayProvider.js.map +1 -1
- package/dist-es/date-picker/DatePickerRangeInput.js +2 -2
- package/dist-es/date-picker/DatePickerRangeInput.js.map +1 -1
- package/dist-es/date-picker/DatePickerSingleInput.js +2 -2
- package/dist-es/date-picker/DatePickerSingleInput.js.map +1 -1
- package/dist-es/date-picker/DatePickerTrigger.js +1 -1
- package/dist-es/date-picker/DatePickerTrigger.js.map +1 -1
- package/dist-es/date-picker/useDatePicker.js +1 -1
- package/dist-es/date-picker/useDatePicker.js.map +1 -1
- package/dist-types/date-input/DateInputRange.d.ts +9 -4
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import type { Timezone } from \"@salt-ds/date-adapters\";\nimport { Children, forwardRef, isValidElement, type ReactNode } from \"react\";\nimport { DatePickerActions } from \"./DatePickerActions\";\nimport {\n DateRangeSelectionContext,\n type RangeDatePickerState,\n type SingleDatePickerState,\n SingleDateSelectionContext,\n} from \"./DatePickerContext\";\nimport {\n type DatePickerOpenChangeReason,\n DatePickerOverlayProvider,\n} from \"./DatePickerOverlayProvider\";\nimport {\n type UseDatePickerRangeProps,\n type UseDatePickerSingleProps,\n useDatePicker,\n} from \"./useDatePicker\";\n\nlet hasDatePickerActionsWarningShown = false;\n\nfunction hasDatePickerActions(children: ReactNode): boolean {\n return Children.toArray(children).some((child) => {\n if (!isValidElement(child)) {\n return false;\n }\n\n if (child.type === DatePickerActions) {\n return true;\n }\n\n return hasDatePickerActions(\n (child.props as { children?: ReactNode }).children,\n );\n });\n}\n\n/**\n * Base props for DatePicker.\n */\nexport interface DatePickerBaseProps {\n className?: string;\n children?: ReactNode;\n /**\n * If `true`, enables apply mode where selections are not committed until explicitly applied.\n * This is required when using a modal DatePicker with confirmation controls (e.g., DatePickerActions).\n * When enabled, date selections remain pending until the user explicitly applies them.\n */\n enableApply?: boolean;\n /** the open/close state of the overlay. The open/close state will be controlled when this prop is provided. */\n open?: boolean;\n /** When `open` is uncontrolled, set this to `true` to open on click */\n openOnClick?: boolean;\n /**\n * Handler for when open state changes\n * @param newOpen - true when opened\n * @param reason - reason for the the state change\n */\n onOpenChange?: (\n newOpen: boolean,\n reason?: DatePickerOpenChangeReason,\n ) => void;\n /**\n * the initial open/close state of the overlay, when the open/close state is un-controlled.\n */\n defaultOpen?: DatePickerBaseProps[\"open\"];\n /**\n * Specifies the timezone behavior:\n * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`.\n * - If set to \"default\", the default timezone of the date library will be used.\n * - If set to \"system\", the local system's timezone will be applied.\n * - If set to \"UTC\", the time will be returned in UTC.\n * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone.\n */\n timezone?: Timezone;\n}\n\n/**\n * Props for the DatePicker component, when `selectionVariant` is `single`.\n */\nexport interface DatePickerSingleProps\n extends DatePickerBaseProps,\n UseDatePickerSingleProps {\n selectionVariant: \"single\";\n}\n\n/**\n * Props for the DatePicker component, when `selectionVariant` is `range`.\n */\nexport interface DatePickerRangeProps\n extends DatePickerBaseProps,\n UseDatePickerRangeProps {\n selectionVariant: \"range\";\n}\n\n/**\n * Props for the DatePicker component.\n */\nexport type DatePickerProps = DatePickerSingleProps | DatePickerRangeProps;\n\nexport const DatePickerMain = forwardRef<HTMLDivElement, DatePickerProps>(\n (props
|
|
1
|
+
{"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import type { Timezone } from \"@salt-ds/date-adapters\";\nimport { Children, forwardRef, isValidElement, type ReactNode } from \"react\";\nimport { DatePickerActions } from \"./DatePickerActions\";\nimport {\n DateRangeSelectionContext,\n type RangeDatePickerState,\n type SingleDatePickerState,\n SingleDateSelectionContext,\n} from \"./DatePickerContext\";\nimport {\n type DatePickerOpenChangeReason,\n DatePickerOverlayProvider,\n} from \"./DatePickerOverlayProvider\";\nimport {\n type UseDatePickerRangeProps,\n type UseDatePickerSingleProps,\n useDatePicker,\n} from \"./useDatePicker\";\n\nlet hasDatePickerActionsWarningShown = false;\n\nfunction hasDatePickerActions(children: ReactNode): boolean {\n return Children.toArray(children).some((child) => {\n if (!isValidElement(child)) {\n return false;\n }\n\n if (child.type === DatePickerActions) {\n return true;\n }\n\n return hasDatePickerActions(\n (child.props as { children?: ReactNode }).children,\n );\n });\n}\n\n/**\n * Base props for DatePicker.\n */\nexport interface DatePickerBaseProps {\n className?: string;\n children?: ReactNode;\n /**\n * If `true`, enables apply mode where selections are not committed until explicitly applied.\n * This is required when using a modal DatePicker with confirmation controls (e.g., DatePickerActions).\n * When enabled, date selections remain pending until the user explicitly applies them.\n */\n enableApply?: boolean;\n /** the open/close state of the overlay. The open/close state will be controlled when this prop is provided. */\n open?: boolean;\n /** When `open` is uncontrolled, set this to `true` to open on click */\n openOnClick?: boolean;\n /**\n * Handler for when open state changes\n * @param newOpen - true when opened\n * @param reason - reason for the the state change\n */\n onOpenChange?: (\n newOpen: boolean,\n reason?: DatePickerOpenChangeReason,\n ) => void;\n /**\n * the initial open/close state of the overlay, when the open/close state is un-controlled.\n */\n defaultOpen?: DatePickerBaseProps[\"open\"];\n /**\n * Specifies the timezone behavior:\n * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`.\n * - If set to \"default\", the default timezone of the date library will be used.\n * - If set to \"system\", the local system's timezone will be applied.\n * - If set to \"UTC\", the time will be returned in UTC.\n * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone.\n */\n timezone?: Timezone;\n}\n\n/**\n * Props for the DatePicker component, when `selectionVariant` is `single`.\n */\nexport interface DatePickerSingleProps\n extends DatePickerBaseProps,\n UseDatePickerSingleProps {\n selectionVariant: \"single\";\n}\n\n/**\n * Props for the DatePicker component, when `selectionVariant` is `range`.\n */\nexport interface DatePickerRangeProps\n extends DatePickerBaseProps,\n UseDatePickerRangeProps {\n selectionVariant: \"range\";\n}\n\n/**\n * Props for the DatePicker component.\n */\nexport type DatePickerProps = DatePickerSingleProps | DatePickerRangeProps;\n\nexport const DatePickerMain = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePickerMain(props, ref) {\n const {\n createAnnouncement,\n children,\n enableApply: enableApplyProp,\n readOnly,\n disabled,\n isDayHighlighted,\n isDayUnselectable,\n selectionVariant,\n defaultSelectedDate,\n selectedDate,\n onSelectionChange,\n onApply,\n minDate,\n maxDate,\n onCancel,\n timezone,\n ...rest\n } = props;\n\n // Only detect DatePickerActions if enableApply is not explicitly provided\n const hasActionsDetected =\n enableApplyProp === undefined ? hasDatePickerActions(children) : false;\n const enableApply =\n enableApplyProp !== undefined ? enableApplyProp : hasActionsDetected;\n\n // Deprecation warning for hasDatePickerActions detection (only once globally in dev mode)\n if (\n process.env.NODE_ENV === \"development\" &&\n !hasDatePickerActionsWarningShown &&\n hasActionsDetected\n ) {\n hasDatePickerActionsWarningShown = true;\n console.warn(\n \"DatePicker: Automatic detection of DatePickerActions via hasDatePickerActions is deprecated. \" +\n \"Please explicitly pass the `enableApply` prop to DatePicker instead. \" +\n \"This automatic detection will be removed in a future version.\",\n );\n }\n\n // biome-ignore lint/suspicious/noExplicitAny: type guard\n const useDatePickerProps: any = {\n createAnnouncement,\n enableApply,\n readOnly,\n disabled,\n isDayHighlighted,\n isDayUnselectable,\n selectionVariant,\n defaultSelectedDate,\n selectedDate,\n onSelectionChange,\n onApply,\n minDate,\n maxDate,\n onCancel,\n timezone,\n };\n\n const stateAndHelpers = useDatePicker(useDatePickerProps, ref);\n\n if (props.selectionVariant === \"range\") {\n return (\n <DateRangeSelectionContext.Provider\n value={stateAndHelpers as RangeDatePickerState}\n >\n <div ref={stateAndHelpers?.state?.containerRef} {...rest}>\n {children}\n </div>\n </DateRangeSelectionContext.Provider>\n );\n }\n\n return (\n <SingleDateSelectionContext.Provider\n value={stateAndHelpers as SingleDatePickerState}\n >\n <div ref={stateAndHelpers?.state?.containerRef} {...rest}>\n {children}\n </div>\n </SingleDateSelectionContext.Provider>\n );\n },\n);\n\nexport const DatePicker = forwardRef(function DatePicker(\n props: DatePickerProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const { defaultOpen, open, openOnClick, onOpenChange, readOnly, ...rest } =\n props;\n\n return (\n <DatePickerOverlayProvider\n disabled={rest.disabled}\n defaultOpen={defaultOpen}\n open={open}\n openOnClick={openOnClick}\n onOpenChange={onOpenChange}\n readOnly={readOnly}\n >\n <DatePickerMain {...rest} readOnly={readOnly} ref={ref} />\n </DatePickerOverlayProvider>\n );\n});\n"],"names":["Children","isValidElement","DatePickerActions","forwardRef","DatePickerMain","useDatePicker","jsx","DateRangeSelectionContext","SingleDateSelectionContext","DatePicker","DatePickerOverlayProvider"],"mappings":"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"}
|
|
@@ -71,15 +71,15 @@ const DatePickerActions = react.forwardRef(function DatePickerActions2(props, re
|
|
|
71
71
|
if (Array.isArray(date)) {
|
|
72
72
|
selectedLabel = (date == null ? void 0 : date.length) === 0 ? "no dates selected" : `${date.length} single dates`;
|
|
73
73
|
} else {
|
|
74
|
-
selectedLabel = `${dateAdapter.format(date, "dddd
|
|
74
|
+
selectedLabel = `${dateAdapter.format(date, "dddd DD MMMM YYYY")}`;
|
|
75
75
|
}
|
|
76
76
|
} else if (selectionVariant === "range") {
|
|
77
77
|
const dateRange = selectedDate;
|
|
78
78
|
if (Array.isArray(dateRange)) {
|
|
79
79
|
selectedLabel = (dateRange == null ? void 0 : dateRange.length) === 0 ? "no dates selected" : `${dateRange.length} range dates`;
|
|
80
80
|
} else {
|
|
81
|
-
const startLabel = (dateRange == null ? void 0 : dateRange.startDate) ? dateAdapter.format(dateRange.startDate, "dddd
|
|
82
|
-
const endLabel = (dateRange == null ? void 0 : dateRange.endDate) ? dateAdapter.format(dateRange.endDate, "dddd
|
|
81
|
+
const startLabel = (dateRange == null ? void 0 : dateRange.startDate) ? dateAdapter.format(dateRange.startDate, "dddd DD MMMM YYYY") : "no start date";
|
|
82
|
+
const endLabel = (dateRange == null ? void 0 : dateRange.endDate) ? dateAdapter.format(dateRange.endDate, "dddd DD MMMM YYYY") : "no end date";
|
|
83
83
|
selectedLabel = `${startLabel} to ${endLabel}`;
|
|
84
84
|
}
|
|
85
85
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerActions.js","sources":["../src/date-picker/DatePickerActions.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEventHandler,\n type Ref,\n type SyntheticEvent,\n} from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport { useLocalization } from \"../localization-provider\";\nimport datePickerActions from \"./DatePickerActions.css\";\nimport {\n type RangeDatePickerState,\n type SingleDatePickerState,\n useDatePickerContext,\n} from \"./DatePickerContext\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerActions\");\n\n/**\n * Base props for DatePicker actions component.\n */\nexport interface DatePickerActionsBaseProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Callback fired when the cancel action is triggered.\n * @param _event - The synthetic event.\n */\n onCancel?: (_event: SyntheticEvent) => void;\n /**\n * Ref to apply button\n */\n applyButtonRef?: Ref<HTMLButtonElement>;\n /**\n * Props for the apply button.\n */\n ApplyButtonProps?: ButtonProps;\n /**\n * Props for the cancel button.\n */\n CancelButtonProps?: ButtonProps;\n /**\n * Ref to cancel button\n */\n cancelButtonRef?: Ref<HTMLButtonElement>;\n}\n\n/**\n * Props for the DatePicker actions component.\n * @template SelectionVariant - The selection variant, either \"single\" or \"range\".\n */\nexport type DatePickerActionsProps<\n SelectionVariant extends \"single\" | \"range\",\n> = SelectionVariant extends \"single\"\n ? DatePickerActionsBaseProps & {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n /**\n * Callback fired when the apply action is triggered.\n * @param _event - The synthetic event.\n * @param date - The selected single date or null.\n */\n onApply?: (\n _event: SyntheticEvent,\n date: SingleDateSelection | null,\n ) => void;\n }\n : DatePickerActionsBaseProps & {\n /**\n * The selection variant, set to \"range\".\n */\n selectionVariant: \"range\";\n /**\n * Callback fired when the apply action is triggered.\n * @param _event - The synthetic event.\n * @param date - The selected date range or null.\n */\n onApply?: (\n _event: SyntheticEvent,\n date: DateRangeSelection | null,\n ) => void;\n };\n\nexport const DatePickerActions = forwardRef(function DatePickerActions(\n props: DatePickerActionsProps<\"single\" | \"range\">,\n ref: React.Ref<HTMLDivElement>,\n) {\n const {\n applyButtonRef,\n ApplyButtonProps,\n cancelButtonRef,\n children,\n className,\n CancelButtonProps,\n onApply,\n onCancel,\n selectionVariant,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-picker-actions\",\n css: datePickerActions,\n window: targetWindow,\n });\n\n const { dateAdapter } = useLocalization();\n\n const stateAndHelpers = useDatePickerContext({\n selectionVariant,\n });\n\n const {\n state: { selectedDate },\n helpers: { cancel },\n } = stateAndHelpers;\n\n const handleCancel: MouseEventHandler<HTMLButtonElement> = (event) => {\n cancel(event.nativeEvent);\n CancelButtonProps?.onClick?.(event);\n onCancel?.(event);\n };\n\n const handleApply: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (selectionVariant === \"range\") {\n const {\n helpers: { apply },\n state: { selectedDate },\n } = stateAndHelpers as RangeDatePickerState;\n apply(event, selectedDate);\n onApply?.(event, selectedDate);\n } else {\n const {\n helpers: { apply },\n state: { selectedDate },\n } = stateAndHelpers as SingleDatePickerState;\n apply(event, selectedDate);\n onApply?.(event, selectedDate);\n }\n ApplyButtonProps?.onClick?.(event);\n };\n\n let selectedLabel = \"\";\n if (selectedDate === null || selectedDate === undefined) {\n selectedLabel = \"no date selected\";\n } else if (selectionVariant === \"single\") {\n const date = selectedDate as SingleDateSelection[] | SingleDateSelection;\n if (Array.isArray(date)) {\n selectedLabel =\n date?.length === 0\n ? \"no dates selected\"\n : `${date.length} single dates`;\n } else {\n selectedLabel = `${dateAdapter.format(date, \"dddd D MMMM YYYY\")}`;\n }\n } else if (selectionVariant === \"range\") {\n const dateRange = selectedDate as DateRangeSelection;\n if (Array.isArray(dateRange)) {\n selectedLabel =\n dateRange?.length === 0\n ? \"no dates selected\"\n : `${dateRange.length} range dates`;\n } else {\n const startLabel = dateRange?.startDate\n ? dateAdapter.format(dateRange.startDate, \"dddd D MMMM YYYY\")\n : \"no start date\";\n const endLabel = dateRange?.endDate\n ? dateAdapter.format(dateRange.endDate, \"dddd D MMMM YYYY\")\n : \"no end date\";\n selectedLabel = `${startLabel} to ${endLabel}`;\n }\n }\n\n return (\n <div className={clsx(className, withBaseName())} ref={ref} {...rest}>\n <div className={withBaseName(\"body\")}>{children}</div>\n <Button\n aria-label={`Cancel ${selectedLabel}`}\n appearance=\"bordered\"\n sentiment=\"neutral\"\n ref={cancelButtonRef}\n {...CancelButtonProps}\n onClick={handleCancel}\n className={clsx(withBaseName(\"action\"), CancelButtonProps?.className)}\n >\n Cancel\n </Button>\n <Button\n aria-label={`Apply ${selectedLabel}`}\n appearance=\"solid\"\n sentiment=\"accented\"\n ref={applyButtonRef}\n {...ApplyButtonProps}\n onClick={handleApply}\n className={clsx(withBaseName(\"action\"), ApplyButtonProps?.className)}\n >\n Apply\n </Button>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePickerActions","useWindow","useComponentCssInjection","datePickerActions","useLocalization","useDatePickerContext","selectedDate","jsxs","clsx","jsx","Button"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAeA,kBAAa,uBAAuB,CAAA;AAoElD,MAAM,iBAAA,GAAoBC,gBAAA,CAAW,SAASC,kBAAAA,CACnD,OACA,GAAA,EACA;AACA,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,gBAAA;AAAA,IACA,eAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,iBAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,gBAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,0BAAA;AAAA,IACR,GAAA,EAAKC,mBAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,WAAA,EAAY,GAAIC,oCAAA,EAAgB;AAExC,EAAA,MAAM,kBAAkBC,sCAAA,CAAqB;AAAA,IAC3C;AAAA,GACD,CAAA;AAED,EAAA,MAAM;AAAA,IACJ,KAAA,EAAO,EAAE,YAAA,EAAa;AAAA,IACtB,OAAA,EAAS,EAAE,MAAA;AAAO,GACpB,GAAI,eAAA;AAEJ,EAAA,MAAM,YAAA,GAAqD,CAAC,KAAA,KAAU;AA1HxE,IAAA,IAAA,EAAA;AA2HI,IAAA,MAAA,CAAO,MAAM,WAAW,CAAA;AACxB,IAAA,CAAA,EAAA,GAAA,iBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,iBAAA,CAAmB,YAAnB,IAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,iBAAA,EAA6B,KAAA,CAAA;AAC7B,IAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,CAAA;AAAA,EACb,CAAA;AAEA,EAAA,MAAM,WAAA,GAAoD,CAAC,KAAA,KAAU;AAhIvE,IAAA,IAAA,EAAA;AAiII,IAAA,IAAI,qBAAqB,OAAA,EAAS;AAChC,MAAA,MAAM;AAAA,QACJ,OAAA,EAAS,EAAE,KAAA,EAAM;AAAA,QACjB,KAAA,EAAO,EAAE,YAAA,EAAAC,aAAAA;AAAa,OACxB,GAAI,eAAA;AACJ,MAAA,KAAA,CAAM,OAAOA,aAAY,CAAA;AACzB,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,EAAOA,aAAAA,CAAAA;AAAA,IACnB,CAAA,MAAO;AACL,MAAA,MAAM;AAAA,QACJ,OAAA,EAAS,EAAE,KAAA,EAAM;AAAA,QACjB,KAAA,EAAO,EAAE,YAAA,EAAAA,aAAAA;AAAa,OACxB,GAAI,eAAA;AACJ,MAAA,KAAA,CAAM,OAAOA,aAAY,CAAA;AACzB,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,EAAOA,aAAAA,CAAAA;AAAA,IACnB;AACA,IAAA,CAAA,EAAA,GAAA,gBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,gBAAA,CAAkB,YAAlB,IAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,gBAAA,EAA4B,KAAA,CAAA;AAAA,EAC9B,CAAA;AAEA,EAAA,IAAI,aAAA,GAAgB,EAAA;AACpB,EAAA,IAAI,YAAA,KAAiB,IAAA,IAAQ,YAAA,KAAiB,MAAA,EAAW;AACvD,IAAA,aAAA,GAAgB,kBAAA;AAAA,EAClB,CAAA,MAAA,IAAW,qBAAqB,QAAA,EAAU;AACxC,IAAA,MAAM,IAAA,GAAO,YAAA;AACb,IAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,IAAI,CAAA,EAAG;AACvB,MAAA,aAAA,GAAA,CACE,6BAAM,MAAA,MAAW,CAAA,GACb,mBAAA,GACA,CAAA,EAAG,KAAK,MAAM,CAAA,aAAA,CAAA;AAAA,IACtB,CAAA,MAAO;AACL,MAAA,aAAA,GAAgB,CAAA,EAAG,WAAA,CAAY,MAAA,CAAO,IAAA,EAAM,kBAAkB,CAAC,CAAA,CAAA;AAAA,IACjE;AAAA,EACF,CAAA,MAAA,IAAW,qBAAqB,OAAA,EAAS;AACvC,IAAA,MAAM,SAAA,GAAY,YAAA;AAClB,IAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,SAAS,CAAA,EAAG;AAC5B,MAAA,aAAA,GAAA,CACE,uCAAW,MAAA,MAAW,CAAA,GAClB,mBAAA,GACA,CAAA,EAAG,UAAU,MAAM,CAAA,YAAA,CAAA;AAAA,IAC3B,CAAA,MAAO;AACL,MAAA,MAAM,UAAA,GAAA,CAAa,uCAAW,SAAA,IAC1B,WAAA,CAAY,OAAO,SAAA,CAAU,SAAA,EAAW,kBAAkB,CAAA,GAC1D,eAAA;AACJ,MAAA,MAAM,QAAA,GAAA,CAAW,uCAAW,OAAA,IACxB,WAAA,CAAY,OAAO,SAAA,CAAU,OAAA,EAAS,kBAAkB,CAAA,GACxD,aAAA;AACJ,MAAA,aAAA,GAAgB,CAAA,EAAG,UAAU,CAAA,IAAA,EAAO,QAAQ,CAAA,CAAA;AAAA,IAC9C;AAAA,EACF;AAEA,EAAA,uBACEC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,SAAA,CAAK,SAAA,EAAW,cAAc,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAC7D,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,MAAM,GAAI,QAAA,EAAS,CAAA;AAAA,oBAChDA,cAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,UAAU,aAAa,CAAA,CAAA;AAAA,QACnC,UAAA,EAAW,UAAA;AAAA,QACX,SAAA,EAAU,SAAA;AAAA,QACV,GAAA,EAAK,eAAA;AAAA,QACJ,GAAG,iBAAA;AAAA,QACJ,OAAA,EAAS,YAAA;AAAA,QACT,WAAWF,SAAA,CAAK,YAAA,CAAa,QAAQ,CAAA,EAAG,uDAAmB,SAAS,CAAA;AAAA,QACrE,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACAC,cAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,SAAS,aAAa,CAAA,CAAA;AAAA,QAClC,UAAA,EAAW,OAAA;AAAA,QACX,SAAA,EAAU,UAAA;AAAA,QACV,GAAA,EAAK,cAAA;AAAA,QACJ,GAAG,gBAAA;AAAA,QACJ,OAAA,EAAS,WAAA;AAAA,QACT,WAAWF,SAAA,CAAK,YAAA,CAAa,QAAQ,CAAA,EAAG,qDAAkB,SAAS,CAAA;AAAA,QACpE,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
1
|
+
{"version":3,"file":"DatePickerActions.js","sources":["../src/date-picker/DatePickerActions.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEventHandler,\n type Ref,\n type SyntheticEvent,\n} from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport { useLocalization } from \"../localization-provider\";\nimport datePickerActions from \"./DatePickerActions.css\";\nimport {\n type RangeDatePickerState,\n type SingleDatePickerState,\n useDatePickerContext,\n} from \"./DatePickerContext\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerActions\");\n\n/**\n * Base props for DatePicker actions component.\n */\nexport interface DatePickerActionsBaseProps\n extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Callback fired when the cancel action is triggered.\n * @param _event - The synthetic event.\n */\n onCancel?: (_event: SyntheticEvent) => void;\n /**\n * Ref to apply button\n */\n applyButtonRef?: Ref<HTMLButtonElement>;\n /**\n * Props for the apply button.\n */\n ApplyButtonProps?: ButtonProps;\n /**\n * Props for the cancel button.\n */\n CancelButtonProps?: ButtonProps;\n /**\n * Ref to cancel button\n */\n cancelButtonRef?: Ref<HTMLButtonElement>;\n}\n\n/**\n * Props for the DatePicker actions component.\n * @template SelectionVariant - The selection variant, either \"single\" or \"range\".\n */\nexport type DatePickerActionsProps<\n SelectionVariant extends \"single\" | \"range\",\n> = SelectionVariant extends \"single\"\n ? DatePickerActionsBaseProps & {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n /**\n * Callback fired when the apply action is triggered.\n * @param _event - The synthetic event.\n * @param date - The selected single date or null.\n */\n onApply?: (\n _event: SyntheticEvent,\n date: SingleDateSelection | null,\n ) => void;\n }\n : DatePickerActionsBaseProps & {\n /**\n * The selection variant, set to \"range\".\n */\n selectionVariant: \"range\";\n /**\n * Callback fired when the apply action is triggered.\n * @param _event - The synthetic event.\n * @param date - The selected date range or null.\n */\n onApply?: (\n _event: SyntheticEvent,\n date: DateRangeSelection | null,\n ) => void;\n };\n\nexport const DatePickerActions = forwardRef(function DatePickerActions(\n props: DatePickerActionsProps<\"single\" | \"range\">,\n ref: React.Ref<HTMLDivElement>,\n) {\n const {\n applyButtonRef,\n ApplyButtonProps,\n cancelButtonRef,\n children,\n className,\n CancelButtonProps,\n onApply,\n onCancel,\n selectionVariant,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-picker-actions\",\n css: datePickerActions,\n window: targetWindow,\n });\n\n const { dateAdapter } = useLocalization();\n\n const stateAndHelpers = useDatePickerContext({\n selectionVariant,\n });\n\n const {\n state: { selectedDate },\n helpers: { cancel },\n } = stateAndHelpers;\n\n const handleCancel: MouseEventHandler<HTMLButtonElement> = (event) => {\n cancel(event.nativeEvent);\n CancelButtonProps?.onClick?.(event);\n onCancel?.(event);\n };\n\n const handleApply: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (selectionVariant === \"range\") {\n const {\n helpers: { apply },\n state: { selectedDate },\n } = stateAndHelpers as RangeDatePickerState;\n apply(event, selectedDate);\n onApply?.(event, selectedDate);\n } else {\n const {\n helpers: { apply },\n state: { selectedDate },\n } = stateAndHelpers as SingleDatePickerState;\n apply(event, selectedDate);\n onApply?.(event, selectedDate);\n }\n ApplyButtonProps?.onClick?.(event);\n };\n\n let selectedLabel = \"\";\n if (selectedDate === null || selectedDate === undefined) {\n selectedLabel = \"no date selected\";\n } else if (selectionVariant === \"single\") {\n const date = selectedDate as SingleDateSelection[] | SingleDateSelection;\n if (Array.isArray(date)) {\n selectedLabel =\n date?.length === 0\n ? \"no dates selected\"\n : `${date.length} single dates`;\n } else {\n selectedLabel = `${dateAdapter.format(date, \"dddd DD MMMM YYYY\")}`;\n }\n } else if (selectionVariant === \"range\") {\n const dateRange = selectedDate as DateRangeSelection;\n if (Array.isArray(dateRange)) {\n selectedLabel =\n dateRange?.length === 0\n ? \"no dates selected\"\n : `${dateRange.length} range dates`;\n } else {\n const startLabel = dateRange?.startDate\n ? dateAdapter.format(dateRange.startDate, \"dddd DD MMMM YYYY\")\n : \"no start date\";\n const endLabel = dateRange?.endDate\n ? dateAdapter.format(dateRange.endDate, \"dddd DD MMMM YYYY\")\n : \"no end date\";\n selectedLabel = `${startLabel} to ${endLabel}`;\n }\n }\n\n return (\n <div className={clsx(className, withBaseName())} ref={ref} {...rest}>\n <div className={withBaseName(\"body\")}>{children}</div>\n <Button\n aria-label={`Cancel ${selectedLabel}`}\n appearance=\"bordered\"\n sentiment=\"neutral\"\n ref={cancelButtonRef}\n {...CancelButtonProps}\n onClick={handleCancel}\n className={clsx(withBaseName(\"action\"), CancelButtonProps?.className)}\n >\n Cancel\n </Button>\n <Button\n aria-label={`Apply ${selectedLabel}`}\n appearance=\"solid\"\n sentiment=\"accented\"\n ref={applyButtonRef}\n {...ApplyButtonProps}\n onClick={handleApply}\n className={clsx(withBaseName(\"action\"), ApplyButtonProps?.className)}\n >\n Apply\n </Button>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePickerActions","useWindow","useComponentCssInjection","datePickerActions","useLocalization","useDatePickerContext","selectedDate","jsxs","clsx","jsx","Button"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,YAAA,GAAeA,kBAAa,uBAAuB,CAAA;AAoElD,MAAM,iBAAA,GAAoBC,gBAAA,CAAW,SAASC,kBAAAA,CACnD,OACA,GAAA,EACA;AACA,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,gBAAA;AAAA,IACA,eAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,iBAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,gBAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,0BAAA;AAAA,IACR,GAAA,EAAKC,mBAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,WAAA,EAAY,GAAIC,oCAAA,EAAgB;AAExC,EAAA,MAAM,kBAAkBC,sCAAA,CAAqB;AAAA,IAC3C;AAAA,GACD,CAAA;AAED,EAAA,MAAM;AAAA,IACJ,KAAA,EAAO,EAAE,YAAA,EAAa;AAAA,IACtB,OAAA,EAAS,EAAE,MAAA;AAAO,GACpB,GAAI,eAAA;AAEJ,EAAA,MAAM,YAAA,GAAqD,CAAC,KAAA,KAAU;AA1HxE,IAAA,IAAA,EAAA;AA2HI,IAAA,MAAA,CAAO,MAAM,WAAW,CAAA;AACxB,IAAA,CAAA,EAAA,GAAA,iBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,iBAAA,CAAmB,YAAnB,IAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,iBAAA,EAA6B,KAAA,CAAA;AAC7B,IAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,CAAA;AAAA,EACb,CAAA;AAEA,EAAA,MAAM,WAAA,GAAoD,CAAC,KAAA,KAAU;AAhIvE,IAAA,IAAA,EAAA;AAiII,IAAA,IAAI,qBAAqB,OAAA,EAAS;AAChC,MAAA,MAAM;AAAA,QACJ,OAAA,EAAS,EAAE,KAAA,EAAM;AAAA,QACjB,KAAA,EAAO,EAAE,YAAA,EAAAC,aAAAA;AAAa,OACxB,GAAI,eAAA;AACJ,MAAA,KAAA,CAAM,OAAOA,aAAY,CAAA;AACzB,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,EAAOA,aAAAA,CAAAA;AAAA,IACnB,CAAA,MAAO;AACL,MAAA,MAAM;AAAA,QACJ,OAAA,EAAS,EAAE,KAAA,EAAM;AAAA,QACjB,KAAA,EAAO,EAAE,YAAA,EAAAA,aAAAA;AAAa,OACxB,GAAI,eAAA;AACJ,MAAA,KAAA,CAAM,OAAOA,aAAY,CAAA;AACzB,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,EAAOA,aAAAA,CAAAA;AAAA,IACnB;AACA,IAAA,CAAA,EAAA,GAAA,gBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,gBAAA,CAAkB,YAAlB,IAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,gBAAA,EAA4B,KAAA,CAAA;AAAA,EAC9B,CAAA;AAEA,EAAA,IAAI,aAAA,GAAgB,EAAA;AACpB,EAAA,IAAI,YAAA,KAAiB,IAAA,IAAQ,YAAA,KAAiB,MAAA,EAAW;AACvD,IAAA,aAAA,GAAgB,kBAAA;AAAA,EAClB,CAAA,MAAA,IAAW,qBAAqB,QAAA,EAAU;AACxC,IAAA,MAAM,IAAA,GAAO,YAAA;AACb,IAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,IAAI,CAAA,EAAG;AACvB,MAAA,aAAA,GAAA,CACE,6BAAM,MAAA,MAAW,CAAA,GACb,mBAAA,GACA,CAAA,EAAG,KAAK,MAAM,CAAA,aAAA,CAAA;AAAA,IACtB,CAAA,MAAO;AACL,MAAA,aAAA,GAAgB,CAAA,EAAG,WAAA,CAAY,MAAA,CAAO,IAAA,EAAM,mBAAmB,CAAC,CAAA,CAAA;AAAA,IAClE;AAAA,EACF,CAAA,MAAA,IAAW,qBAAqB,OAAA,EAAS;AACvC,IAAA,MAAM,SAAA,GAAY,YAAA;AAClB,IAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,SAAS,CAAA,EAAG;AAC5B,MAAA,aAAA,GAAA,CACE,uCAAW,MAAA,MAAW,CAAA,GAClB,mBAAA,GACA,CAAA,EAAG,UAAU,MAAM,CAAA,YAAA,CAAA;AAAA,IAC3B,CAAA,MAAO;AACL,MAAA,MAAM,UAAA,GAAA,CAAa,uCAAW,SAAA,IAC1B,WAAA,CAAY,OAAO,SAAA,CAAU,SAAA,EAAW,mBAAmB,CAAA,GAC3D,eAAA;AACJ,MAAA,MAAM,QAAA,GAAA,CAAW,uCAAW,OAAA,IACxB,WAAA,CAAY,OAAO,SAAA,CAAU,OAAA,EAAS,mBAAmB,CAAA,GACzD,aAAA;AACJ,MAAA,aAAA,GAAgB,CAAA,EAAG,UAAU,CAAA,IAAA,EAAO,QAAQ,CAAA,CAAA;AAAA,IAC9C;AAAA,EACF;AAEA,EAAA,uBACEC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,SAAA,CAAK,SAAA,EAAW,cAAc,CAAA,EAAG,GAAA,EAAW,GAAG,IAAA,EAC7D,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,MAAM,GAAI,QAAA,EAAS,CAAA;AAAA,oBAChDA,cAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,UAAU,aAAa,CAAA,CAAA;AAAA,QACnC,UAAA,EAAW,UAAA;AAAA,QACX,SAAA,EAAU,SAAA;AAAA,QACV,GAAA,EAAK,eAAA;AAAA,QACJ,GAAG,iBAAA;AAAA,QACJ,OAAA,EAAS,YAAA;AAAA,QACT,WAAWF,SAAA,CAAK,YAAA,CAAa,QAAQ,CAAA,EAAG,uDAAmB,SAAS,CAAA;AAAA,QACrE,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACAC,cAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,SAAS,aAAa,CAAA,CAAA;AAAA,QAClC,UAAA,EAAW,OAAA;AAAA,QACX,SAAA,EAAU,UAAA;AAAA,QACV,GAAA,EAAK,cAAA;AAAA,QACJ,GAAG,gBAAA;AAAA,QACJ,OAAA,EAAS,WAAA;AAAA,QACT,WAAWF,SAAA,CAAK,YAAA,CAAa,QAAQ,CAAA,EAAG,qDAAkB,SAAS,CAAA;AAAA,QACpE,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -27,7 +27,9 @@ const DatePickerOverlayProvider = ({
|
|
|
27
27
|
const triggeringElementRef = react.useRef(null);
|
|
28
28
|
const initialFocusRef = react.useRef(null);
|
|
29
29
|
const [focused, setFocused] = react.useState(false);
|
|
30
|
-
const onDismissCallback = react.useRef(
|
|
30
|
+
const onDismissCallback = react.useRef(
|
|
31
|
+
void 0
|
|
32
|
+
);
|
|
31
33
|
const handleOpenChange = react.useCallback(
|
|
32
34
|
(newOpen, _event, reason) => {
|
|
33
35
|
var _a;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerOverlayProvider.js","sources":["../src/date-picker/DatePickerOverlayProvider.tsx"],"sourcesContent":["import {\n type ElementProps,\n type FloatingContext,\n type OpenChangeReason as FloatingUIOpenChangeReason,\n flip,\n useClick,\n useDismiss,\n useInteractions,\n} from \"@floating-ui/react\";\nimport { createContext, useControlled, useFloatingUI } from \"@salt-ds/core\";\nimport {\n type ReactNode,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { useFocusOut } from \"./useFocusOut\";\nimport { useKeyboard } from \"./useKeyboard\";\n\n/** Reason for overlay state change, can be a custom reason */\nexport type DatePickerOpenChangeReason =\n | FloatingUIOpenChangeReason\n | \"apply\"\n | \"cancel\"\n | string;\n/**\n * Interface representing the state for a DatePicker overlay.\n */\ninterface DatePickerOverlayState {\n /**\n * If `true`, the overlay is open.\n */\n open: boolean;\n /**\n * If `true`, the overlay contains the active element\n */\n focused: boolean;\n /**\n * The result of the floating UI calculations.\n */\n floatingUIResult: ReturnType<typeof useFloatingUI>;\n /**\n * Ref to attach to the initially focused element, when the overlay is opened.\n */\n initialFocusRef?: React.MutableRefObject<HTMLElement | null>;\n}\n\n/**\n * Interface representing the helper functions for a DatePicker overlay.\n */\ninterface DatePickerOverlayHelpers {\n /**\n * Function to get the props for the floating element.\n */\n getFloatingProps: ReturnType<typeof useInteractions>[\"getFloatingProps\"];\n /**\n * Function to get the props for the reference element.\n */\n getReferenceProps: ReturnType<typeof useInteractions>[\"getReferenceProps\"];\n /**\n * Sets the open state of the overlay.\n * @param newOpen - The new value for the open state.\n * @param event - event that triggered the state change\n * @param reason - reason for the the state change\n */\n setOpen: (\n newOpen: boolean,\n event?: Event,\n reason?: DatePickerOpenChangeReason,\n ) => void;\n /**~\n * Register a callback for when onDismiss is called\n * @param onDismissCallback\n */\n setOnDismiss: (onDismissCallback: (event?: Event) => void) => void;\n}\n\n/**\n * Interface representing the context type for a DatePicker overlay.\n */\ninterface DatePickerOverlayContextType {\n /**\n * The state of the DatePicker overlay.\n */\n state: DatePickerOverlayState;\n /**\n * The helper functions for the DatePicker overlay.\n */\n helpers: DatePickerOverlayHelpers;\n}\n\n/**\n * Context for the DatePicker overlay.\n */\nconst DatePickerOverlayContext = createContext<\n DatePickerOverlayContextType | undefined\n>(\"DatePickerOverlayContext\", undefined);\n\n/**\n * Props for the DatePickerOverlayProvider component.\n */\ninterface DatePickerOverlayProviderProps {\n /**\n * If `true`, the overlay is disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the overlay is open.\n */\n open?: boolean;\n /**\n * When `open` is uncontrolled, set this to `true` to open on click\n */\n openOnClick?: boolean;\n /**\n * Handler for when open state changes\n * @param newOpen - true when opened\n * @param reason - reason for the the state change\n */\n onOpenChange?: (\n newOpen: boolean,\n reason?: DatePickerOpenChangeReason,\n ) => void;\n /**\n * The default open state of the overlay.\n */\n defaultOpen?: boolean;\n /**\n * The content to be rendered inside the overlay provider.\n */\n children: ReactNode;\n /**\n * A factory method to create a set of interaction, if provided overrides the default interactions\n */\n interactions?: (context: FloatingContext) => Array<ElementProps>;\n /**\n * When true, shouldn't open the overlay.\n */\n readOnly?: boolean;\n}\n\nexport const DatePickerOverlayProvider: React.FC<\n DatePickerOverlayProviderProps\n> = ({\n disabled,\n open: openProp,\n openOnClick,\n defaultOpen,\n onOpenChange,\n children,\n interactions,\n readOnly,\n}) => {\n const [open, setOpenState, isOpenControlled] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"DatePicker\",\n state: \"openDatePickerOverlay\",\n });\n const triggeringElementRef = useRef<HTMLElement | null>(null);\n const initialFocusRef = useRef<HTMLElement | null>(null);\n const [focused, setFocused] = useState(false);\n const onDismissCallback = useRef<(event?: Event) => void>();\n const handleOpenChange = useCallback(\n (newOpen: boolean, _event?: Event, reason?: DatePickerOpenChangeReason) => {\n if (newOpen) {\n if (readOnly) {\n return;\n }\n triggeringElementRef.current = document.activeElement as HTMLElement;\n setFocused(true);\n } else if (!isOpenControlled && reason !== \"focus-out\") {\n const trigger = triggeringElementRef.current as HTMLElement;\n if (trigger) {\n trigger.focus();\n }\n if (trigger instanceof HTMLInputElement) {\n setTimeout(() => {\n trigger.setSelectionRange(0, trigger.value.length);\n }, 1);\n }\n triggeringElementRef.current = null;\n }\n setOpenState(newOpen);\n onOpenChange?.(newOpen, reason);\n\n if (\n reason === \"focus-out\" ||\n reason === \"escape-key\" ||\n (reason === \"outside-press\" && onDismissCallback.current)\n ) {\n onDismissCallback?.current?.();\n }\n },\n [isOpenControlled, onOpenChange, readOnly],\n );\n\n const openState = open && !readOnly;\n const floatingUIResult = useFloatingUI({\n open: openState,\n onOpenChange: handleOpenChange,\n placement: \"bottom-start\",\n middleware: [flip({ fallbackStrategy: \"initialPlacement\" })],\n });\n\n const handleContainerBlur = useCallback(() => {\n setTimeout(() => {\n setFocused(\n !!floatingUIResult?.refs.floating?.current?.contains(\n document.activeElement,\n ),\n );\n }, 0);\n }, [floatingUIResult]);\n\n const defaultInteractions = [\n useDismiss(floatingUIResult.context, {}),\n useKeyboard(floatingUIResult.context, {\n enabled: !readOnly,\n onArrowDown: (event) => {\n handleOpenChange(true, event.nativeEvent, \"reference-press\");\n },\n }),\n useClick(floatingUIResult.context, {\n enabled: !disabled && !!openOnClick && !readOnly,\n toggle: false,\n keyboardHandlers: false,\n }),\n useFocusOut(floatingUIResult.context, {\n enabled: !readOnly,\n }),\n ];\n\n const {\n getFloatingProps: getFloatingPropsCallback,\n getReferenceProps: getReferencePropsCallback,\n } = useInteractions(\n interactions ? interactions(floatingUIResult.context) : defaultInteractions,\n );\n\n const getFloatingProps = useCallback(\n (userProps: React.HTMLProps<HTMLElement> | undefined) => {\n const { x, y, strategy, elements } = floatingUIResult;\n return {\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n ...getFloatingPropsCallback(userProps),\n focusManagerProps: {\n returnFocus: false,\n context: floatingUIResult.context,\n initialFocus: initialFocusRef,\n },\n };\n },\n [getFloatingPropsCallback, floatingUIResult],\n );\n const setOnDismiss = useCallback(\n (dismissCallback: (event?: Event) => void) => {\n onDismissCallback.current = dismissCallback;\n },\n [],\n );\n\n const state: DatePickerOverlayState = useMemo(\n () => ({\n open: openState,\n focused,\n floatingUIResult,\n initialFocusRef,\n }),\n [focused, openState, floatingUIResult],\n );\n\n const helpers: DatePickerOverlayHelpers = useMemo(\n () => ({\n getFloatingProps,\n getReferenceProps: getReferencePropsCallback,\n setOpen: handleOpenChange,\n setOnDismiss,\n }),\n [\n getFloatingProps,\n getReferencePropsCallback,\n handleOpenChange,\n setOnDismiss,\n ],\n );\n const contextValue = useMemo(() => ({ state, helpers }), [state, helpers]);\n\n return (\n <DatePickerOverlayContext.Provider value={contextValue}>\n <div onBlur={handleContainerBlur}>{children}</div>\n </DatePickerOverlayContext.Provider>\n );\n};\n\nexport const useDatePickerOverlay = (): DatePickerOverlayContextType => {\n const context = useContext(DatePickerOverlayContext);\n if (!context) {\n throw new Error(\n \"useDatePickerOverlay must be used within a DatePickerOverlayProvider\",\n );\n }\n return context;\n};\n"],"names":["createContext","useControlled","useRef","useState","useCallback","useFloatingUI","flip","useDismiss","useKeyboard","useClick","useFocusOut","useInteractions","useMemo","jsx","useContext"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DatePickerOverlayProvider.js","sources":["../src/date-picker/DatePickerOverlayProvider.tsx"],"sourcesContent":["import {\n type ElementProps,\n type FloatingContext,\n type OpenChangeReason as FloatingUIOpenChangeReason,\n flip,\n useClick,\n useDismiss,\n useInteractions,\n} from \"@floating-ui/react\";\nimport { createContext, useControlled, useFloatingUI } from \"@salt-ds/core\";\nimport {\n type ReactNode,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { useFocusOut } from \"./useFocusOut\";\nimport { useKeyboard } from \"./useKeyboard\";\n\n/** Reason for overlay state change, can be a custom reason */\nexport type DatePickerOpenChangeReason =\n | FloatingUIOpenChangeReason\n | \"apply\"\n | \"cancel\"\n | string;\n/**\n * Interface representing the state for a DatePicker overlay.\n */\ninterface DatePickerOverlayState {\n /**\n * If `true`, the overlay is open.\n */\n open: boolean;\n /**\n * If `true`, the overlay contains the active element\n */\n focused: boolean;\n /**\n * The result of the floating UI calculations.\n */\n floatingUIResult: ReturnType<typeof useFloatingUI>;\n /**\n * Ref to attach to the initially focused element, when the overlay is opened.\n */\n initialFocusRef?: React.MutableRefObject<HTMLElement | null>;\n}\n\n/**\n * Interface representing the helper functions for a DatePicker overlay.\n */\ninterface DatePickerOverlayHelpers {\n /**\n * Function to get the props for the floating element.\n */\n getFloatingProps: ReturnType<typeof useInteractions>[\"getFloatingProps\"];\n /**\n * Function to get the props for the reference element.\n */\n getReferenceProps: ReturnType<typeof useInteractions>[\"getReferenceProps\"];\n /**\n * Sets the open state of the overlay.\n * @param newOpen - The new value for the open state.\n * @param event - event that triggered the state change\n * @param reason - reason for the the state change\n */\n setOpen: (\n newOpen: boolean,\n event?: Event,\n reason?: DatePickerOpenChangeReason,\n ) => void;\n /**~\n * Register a callback for when onDismiss is called\n * @param onDismissCallback\n */\n setOnDismiss: (onDismissCallback: (event?: Event) => void) => void;\n}\n\n/**\n * Interface representing the context type for a DatePicker overlay.\n */\ninterface DatePickerOverlayContextType {\n /**\n * The state of the DatePicker overlay.\n */\n state: DatePickerOverlayState;\n /**\n * The helper functions for the DatePicker overlay.\n */\n helpers: DatePickerOverlayHelpers;\n}\n\n/**\n * Context for the DatePicker overlay.\n */\nconst DatePickerOverlayContext = createContext<\n DatePickerOverlayContextType | undefined\n>(\"DatePickerOverlayContext\", undefined);\n\n/**\n * Props for the DatePickerOverlayProvider component.\n */\ninterface DatePickerOverlayProviderProps {\n /**\n * If `true`, the overlay is disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, the overlay is open.\n */\n open?: boolean;\n /**\n * When `open` is uncontrolled, set this to `true` to open on click\n */\n openOnClick?: boolean;\n /**\n * Handler for when open state changes\n * @param newOpen - true when opened\n * @param reason - reason for the the state change\n */\n onOpenChange?: (\n newOpen: boolean,\n reason?: DatePickerOpenChangeReason,\n ) => void;\n /**\n * The default open state of the overlay.\n */\n defaultOpen?: boolean;\n /**\n * The content to be rendered inside the overlay provider.\n */\n children: ReactNode;\n /**\n * A factory method to create a set of interaction, if provided overrides the default interactions\n */\n interactions?: (context: FloatingContext) => Array<ElementProps>;\n /**\n * When true, shouldn't open the overlay.\n */\n readOnly?: boolean;\n}\n\nexport const DatePickerOverlayProvider: React.FC<\n DatePickerOverlayProviderProps\n> = ({\n disabled,\n open: openProp,\n openOnClick,\n defaultOpen,\n onOpenChange,\n children,\n interactions,\n readOnly,\n}) => {\n const [open, setOpenState, isOpenControlled] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"DatePicker\",\n state: \"openDatePickerOverlay\",\n });\n const triggeringElementRef = useRef<HTMLElement | null>(null);\n const initialFocusRef = useRef<HTMLElement | null>(null);\n const [focused, setFocused] = useState(false);\n const onDismissCallback = useRef<((event?: Event) => void) | undefined>(\n undefined,\n );\n const handleOpenChange = useCallback(\n (newOpen: boolean, _event?: Event, reason?: DatePickerOpenChangeReason) => {\n if (newOpen) {\n if (readOnly) {\n return;\n }\n triggeringElementRef.current = document.activeElement as HTMLElement;\n setFocused(true);\n } else if (!isOpenControlled && reason !== \"focus-out\") {\n const trigger = triggeringElementRef.current as HTMLElement;\n if (trigger) {\n trigger.focus();\n }\n if (trigger instanceof HTMLInputElement) {\n setTimeout(() => {\n trigger.setSelectionRange(0, trigger.value.length);\n }, 1);\n }\n triggeringElementRef.current = null;\n }\n setOpenState(newOpen);\n onOpenChange?.(newOpen, reason);\n\n if (\n reason === \"focus-out\" ||\n reason === \"escape-key\" ||\n (reason === \"outside-press\" && onDismissCallback.current)\n ) {\n onDismissCallback?.current?.();\n }\n },\n [isOpenControlled, onOpenChange, readOnly],\n );\n\n const openState = open && !readOnly;\n const floatingUIResult = useFloatingUI({\n open: openState,\n onOpenChange: handleOpenChange,\n placement: \"bottom-start\",\n middleware: [flip({ fallbackStrategy: \"initialPlacement\" })],\n });\n\n const handleContainerBlur = useCallback(() => {\n setTimeout(() => {\n setFocused(\n !!floatingUIResult?.refs.floating?.current?.contains(\n document.activeElement,\n ),\n );\n }, 0);\n }, [floatingUIResult]);\n\n const defaultInteractions = [\n useDismiss(floatingUIResult.context, {}),\n useKeyboard(floatingUIResult.context, {\n enabled: !readOnly,\n onArrowDown: (event) => {\n handleOpenChange(true, event.nativeEvent, \"reference-press\");\n },\n }),\n useClick(floatingUIResult.context, {\n enabled: !disabled && !!openOnClick && !readOnly,\n toggle: false,\n keyboardHandlers: false,\n }),\n useFocusOut(floatingUIResult.context, {\n enabled: !readOnly,\n }),\n ];\n\n const {\n getFloatingProps: getFloatingPropsCallback,\n getReferenceProps: getReferencePropsCallback,\n } = useInteractions(\n interactions ? interactions(floatingUIResult.context) : defaultInteractions,\n );\n\n const getFloatingProps = useCallback(\n (userProps: React.HTMLProps<HTMLElement> | undefined) => {\n const { x, y, strategy, elements } = floatingUIResult;\n return {\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n ...getFloatingPropsCallback(userProps),\n focusManagerProps: {\n returnFocus: false,\n context: floatingUIResult.context,\n initialFocus: initialFocusRef,\n },\n };\n },\n [getFloatingPropsCallback, floatingUIResult],\n );\n const setOnDismiss = useCallback(\n (dismissCallback: (event?: Event) => void) => {\n onDismissCallback.current = dismissCallback;\n },\n [],\n );\n\n const state: DatePickerOverlayState = useMemo(\n () => ({\n open: openState,\n focused,\n floatingUIResult,\n initialFocusRef,\n }),\n [focused, openState, floatingUIResult],\n );\n\n const helpers: DatePickerOverlayHelpers = useMemo(\n () => ({\n getFloatingProps,\n getReferenceProps: getReferencePropsCallback,\n setOpen: handleOpenChange,\n setOnDismiss,\n }),\n [\n getFloatingProps,\n getReferencePropsCallback,\n handleOpenChange,\n setOnDismiss,\n ],\n );\n const contextValue = useMemo(() => ({ state, helpers }), [state, helpers]);\n\n return (\n <DatePickerOverlayContext.Provider value={contextValue}>\n <div onBlur={handleContainerBlur}>{children}</div>\n </DatePickerOverlayContext.Provider>\n );\n};\n\nexport const useDatePickerOverlay = (): DatePickerOverlayContextType => {\n const context = useContext(DatePickerOverlayContext);\n if (!context) {\n throw new Error(\n \"useDatePickerOverlay must be used within a DatePickerOverlayProvider\",\n );\n }\n return context;\n};\n"],"names":["createContext","useControlled","useRef","useState","useCallback","useFloatingUI","flip","useDismiss","useKeyboard","useClick","useFocusOut","useInteractions","useMemo","jsx","useContext"],"mappings":"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"}
|
|
@@ -86,7 +86,7 @@ function defaultRangeValidator(dateAdapter, date, details, minDate, maxDate) {
|
|
|
86
86
|
}
|
|
87
87
|
return details;
|
|
88
88
|
}
|
|
89
|
-
const DatePickerRangeInput = react.forwardRef((props, ref)
|
|
89
|
+
const DatePickerRangeInput = react.forwardRef(function DatePickerRangeInput2(props, ref) {
|
|
90
90
|
const { dateAdapter } = LocalizationProvider.useLocalization();
|
|
91
91
|
const {
|
|
92
92
|
className,
|
|
@@ -119,7 +119,7 @@ const DatePickerRangeInput = react.forwardRef((props, ref) => {
|
|
|
119
119
|
state: { open },
|
|
120
120
|
helpers: { setOpen }
|
|
121
121
|
} = DatePickerOverlayProvider.useDatePickerOverlay();
|
|
122
|
-
const previousValue = react.useRef();
|
|
122
|
+
const previousValue = react.useRef(void 0);
|
|
123
123
|
const [value, setValue] = core.useControlled({
|
|
124
124
|
controlled: valueProp,
|
|
125
125
|
default: defaultValue,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerRangeInput.js","sources":["../src/date-picker/DatePickerRangeInput.tsx"],"sourcesContent":["import { Button, makePrefixer, useControlled, useIcon } from \"@salt-ds/core\";\nimport {\n DateDetailError,\n type DateFrameworkType,\n type SaltDateAdapter,\n} from \"@salt-ds/date-adapters\";\nimport { clsx } from \"clsx\";\nimport {\n forwardRef,\n type MouseEventHandler,\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport type { DateRangeSelection } from \"../calendar\";\nimport {\n DateInputRange,\n type DateInputRangeDetails,\n type DateInputRangeProps,\n type DateInputRangeValue,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport {\n type RangeDatePickerState,\n useDatePickerContext,\n} from \"./DatePickerContext\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerRangeInput\");\n\n/**\n * Props for the DatePickerRangeInput component.\n */\nexport interface DatePickerRangeInputProps extends DateInputRangeProps {\n /**\n * Function to validate the entered date\n * @param date - The selected date\n * @param details - The details of date selection, either a valid date or error\n * @returns updated DateInputRangeDetails details\n */\n validate?: (\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n ) => DateInputRangeDetails;\n}\n\nexport function defaultRangeValidator(\n dateAdapter: SaltDateAdapter,\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n minDate?: DateFrameworkType,\n maxDate?: DateFrameworkType,\n): DateInputRangeDetails {\n const { startDate, endDate } = date || {};\n\n if (!startDate) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n const unsetStartDateError = details.startDate.errors.find(\n (err) => err.type === DateDetailError.UNSET,\n );\n if (unsetStartDateError) {\n unsetStartDateError.message = \"no start date defined\";\n } else {\n details.startDate.errors.push({\n type: DateDetailError.UNSET,\n message: \"no start date defined\",\n });\n }\n }\n\n if (!endDate) {\n details.endDate = details.endDate || {};\n details.endDate.errors = details.endDate.errors || [];\n const unsetEndDateError = details.endDate.errors.find(\n (err) => err.type === DateDetailError.UNSET,\n );\n if (unsetEndDateError) {\n unsetEndDateError.message = \"no end date defined\";\n } else {\n details.endDate.errors.push({\n type: DateDetailError.UNSET,\n message: \"no end date defined\",\n });\n }\n }\n\n // If startDate is after endDate\n if (\n dateAdapter.isValid(startDate) &&\n dateAdapter.isValid(endDate) &&\n dateAdapter.compare(startDate, endDate) > 0\n ) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n details.startDate.errors.push({\n type: \"greater-than-end-date\",\n message: \"start date after end date\",\n });\n }\n // If startDate is before minDate\n if (\n minDate &&\n dateAdapter.isValid(startDate) &&\n dateAdapter.compare(startDate, minDate) < 0\n ) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n details.startDate.errors.push({\n type: \"min-date\",\n message: \"is before min date\",\n });\n }\n // If startDate is after maxDate\n if (\n maxDate &&\n dateAdapter.isValid(startDate) &&\n dateAdapter.compare(startDate, maxDate) > 0\n ) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n details.startDate.errors.push({\n type: \"max-date\",\n message: \"is after max date\",\n });\n }\n if (\n minDate &&\n dateAdapter.isValid(endDate) &&\n dateAdapter.compare(endDate, minDate) < 0\n ) {\n details.endDate = details.endDate || {};\n details.endDate.errors = details.endDate.errors || [];\n details.endDate.errors.push({\n type: \"min-date\",\n message: \"is before min date\",\n });\n }\n // If endDate is after maxDate\n if (\n maxDate &&\n dateAdapter.isValid(endDate) &&\n dateAdapter.compare(endDate, maxDate) > 0\n ) {\n details.endDate = details.endDate || {};\n details.endDate.errors = details.endDate.errors || [];\n details.endDate.errors.push({\n type: \"max-date\",\n message: \"is after max date\",\n });\n }\n return details;\n}\n\nexport const DatePickerRangeInput = forwardRef<\n HTMLDivElement,\n DatePickerRangeInputProps\n>((props: DatePickerRangeInputProps, ref: React.Ref<HTMLDivElement>) => {\n const { dateAdapter } = useLocalization();\n const {\n className,\n endInputProps,\n startInputProps,\n defaultValue,\n format = \"DD MMM YYYY\",\n value: valueProp,\n validate,\n onChange,\n onDateValueChange,\n ...rest\n } = props;\n\n const { CalendarIcon } = useIcon();\n\n const {\n state: {\n selectedDate,\n disabled,\n readOnly,\n cancelled,\n minDate,\n maxDate,\n timezone,\n },\n helpers: { select },\n } = useDatePickerContext({\n selectionVariant: \"range\",\n }) as RangeDatePickerState;\n const {\n state: { open },\n helpers: { setOpen },\n } = useDatePickerOverlay();\n\n const previousValue = useRef<typeof valueProp>();\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DatePickerRangeInput\",\n state: \"dateValue\",\n });\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: run when date changes to sync the value\n useEffect(() => {\n setValue({\n startDate: !selectedDate?.startDate\n ? \"\"\n : selectedDate?.startDate && dateAdapter.isValid(selectedDate.startDate)\n ? dateAdapter.format(selectedDate.startDate, format)\n : value?.startDate,\n endDate: !selectedDate?.endDate\n ? \"\"\n : selectedDate?.endDate && dateAdapter.isValid(selectedDate.endDate)\n ? dateAdapter.format(selectedDate.endDate, format)\n : value?.endDate,\n });\n }, [dateAdapter, format, selectedDate]);\n\n const handleCalendarButton: MouseEventHandler<HTMLButtonElement> =\n useCallback(\n (event) => {\n event.persist();\n setOpen(!open, event.nativeEvent, \"click\");\n event.stopPropagation();\n },\n [open, setOpen],\n );\n\n const handleDateChange = useCallback(\n (\n event: SyntheticEvent,\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n ) => {\n const validatedDetails = validate\n ? validate(date, details)\n : defaultRangeValidator(dateAdapter, date, details, minDate, maxDate);\n select(event, date, validatedDetails);\n },\n [dateAdapter, select, minDate, maxDate, validate],\n );\n\n const handleDateValueChange = useCallback(\n (event: SyntheticEvent | null, newDateValue: DateInputRangeValue) => {\n setValue(newDateValue);\n onDateValueChange?.(event, newDateValue);\n },\n [onDateValueChange],\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n useEffect(() => {\n if (open) {\n previousValue.current = value;\n }\n }, [open]);\n\n useEffect(() => {\n if (cancelled) {\n setValue(previousValue.current);\n }\n }, [cancelled]);\n\n return (\n <DateInputRange\n value={\n value ?? {\n startDate: \"\",\n endDate: \"\",\n }\n }\n className={clsx(withBaseName(), className)}\n date={selectedDate ?? null}\n startInputProps={startInputProps}\n endInputProps={endInputProps}\n readOnly={readOnly}\n disabled={disabled}\n ref={ref}\n onDateChange={handleDateChange}\n onDateValueChange={handleDateValueChange}\n onChange={onChange}\n endAdornment={\n !readOnly && (\n <Button\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleCalendarButton}\n disabled={disabled}\n aria-haspopup=\"dialog\"\n aria-label=\"Open Calendar\"\n aria-expanded={open}\n >\n <CalendarIcon aria-hidden />\n </Button>\n )\n }\n format={format}\n timezone={timezone}\n {...rest}\n />\n );\n});\n"],"names":["makePrefixer","DateDetailError","forwardRef","useLocalization","useIcon","useDatePickerContext","useDatePickerOverlay","useRef","useControlled","useEffect","useCallback","jsx","DateInputRange","clsx","Button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DatePickerRangeInput.js","sources":["../src/date-picker/DatePickerRangeInput.tsx"],"sourcesContent":["import { Button, makePrefixer, useControlled, useIcon } from \"@salt-ds/core\";\nimport {\n DateDetailError,\n type DateFrameworkType,\n type SaltDateAdapter,\n} from \"@salt-ds/date-adapters\";\nimport { clsx } from \"clsx\";\nimport {\n forwardRef,\n type MouseEventHandler,\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport type { DateRangeSelection } from \"../calendar\";\nimport {\n DateInputRange,\n type DateInputRangeDetails,\n type DateInputRangeProps,\n type DateInputRangeValue,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport {\n type RangeDatePickerState,\n useDatePickerContext,\n} from \"./DatePickerContext\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerRangeInput\");\n\n/**\n * Props for the DatePickerRangeInput component.\n */\nexport interface DatePickerRangeInputProps extends DateInputRangeProps {\n /**\n * Function to validate the entered date\n * @param date - The selected date\n * @param details - The details of date selection, either a valid date or error\n * @returns updated DateInputRangeDetails details\n */\n validate?: (\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n ) => DateInputRangeDetails;\n}\n\nexport function defaultRangeValidator(\n dateAdapter: SaltDateAdapter,\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n minDate?: DateFrameworkType,\n maxDate?: DateFrameworkType,\n): DateInputRangeDetails {\n const { startDate, endDate } = date || {};\n\n if (!startDate) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n const unsetStartDateError = details.startDate.errors.find(\n (err) => err.type === DateDetailError.UNSET,\n );\n if (unsetStartDateError) {\n unsetStartDateError.message = \"no start date defined\";\n } else {\n details.startDate.errors.push({\n type: DateDetailError.UNSET,\n message: \"no start date defined\",\n });\n }\n }\n\n if (!endDate) {\n details.endDate = details.endDate || {};\n details.endDate.errors = details.endDate.errors || [];\n const unsetEndDateError = details.endDate.errors.find(\n (err) => err.type === DateDetailError.UNSET,\n );\n if (unsetEndDateError) {\n unsetEndDateError.message = \"no end date defined\";\n } else {\n details.endDate.errors.push({\n type: DateDetailError.UNSET,\n message: \"no end date defined\",\n });\n }\n }\n\n // If startDate is after endDate\n if (\n dateAdapter.isValid(startDate) &&\n dateAdapter.isValid(endDate) &&\n dateAdapter.compare(startDate, endDate) > 0\n ) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n details.startDate.errors.push({\n type: \"greater-than-end-date\",\n message: \"start date after end date\",\n });\n }\n // If startDate is before minDate\n if (\n minDate &&\n dateAdapter.isValid(startDate) &&\n dateAdapter.compare(startDate, minDate) < 0\n ) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n details.startDate.errors.push({\n type: \"min-date\",\n message: \"is before min date\",\n });\n }\n // If startDate is after maxDate\n if (\n maxDate &&\n dateAdapter.isValid(startDate) &&\n dateAdapter.compare(startDate, maxDate) > 0\n ) {\n details.startDate = details.startDate || {};\n details.startDate.errors = details.startDate.errors || [];\n details.startDate.errors.push({\n type: \"max-date\",\n message: \"is after max date\",\n });\n }\n if (\n minDate &&\n dateAdapter.isValid(endDate) &&\n dateAdapter.compare(endDate, minDate) < 0\n ) {\n details.endDate = details.endDate || {};\n details.endDate.errors = details.endDate.errors || [];\n details.endDate.errors.push({\n type: \"min-date\",\n message: \"is before min date\",\n });\n }\n // If endDate is after maxDate\n if (\n maxDate &&\n dateAdapter.isValid(endDate) &&\n dateAdapter.compare(endDate, maxDate) > 0\n ) {\n details.endDate = details.endDate || {};\n details.endDate.errors = details.endDate.errors || [];\n details.endDate.errors.push({\n type: \"max-date\",\n message: \"is after max date\",\n });\n }\n return details;\n}\n\nexport const DatePickerRangeInput = forwardRef<\n HTMLDivElement,\n DatePickerRangeInputProps\n>(function DatePickerRangeInput(props, ref) {\n const { dateAdapter } = useLocalization();\n const {\n className,\n endInputProps,\n startInputProps,\n defaultValue,\n format = \"DD MMM YYYY\",\n value: valueProp,\n validate,\n onChange,\n onDateValueChange,\n ...rest\n } = props;\n\n const { CalendarIcon } = useIcon();\n\n const {\n state: {\n selectedDate,\n disabled,\n readOnly,\n cancelled,\n minDate,\n maxDate,\n timezone,\n },\n helpers: { select },\n } = useDatePickerContext({\n selectionVariant: \"range\",\n }) as RangeDatePickerState;\n const {\n state: { open },\n helpers: { setOpen },\n } = useDatePickerOverlay();\n\n const previousValue = useRef<typeof valueProp>(undefined);\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DatePickerRangeInput\",\n state: \"dateValue\",\n });\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: run when date changes to sync the value\n useEffect(() => {\n setValue({\n startDate: !selectedDate?.startDate\n ? \"\"\n : selectedDate?.startDate && dateAdapter.isValid(selectedDate.startDate)\n ? dateAdapter.format(selectedDate.startDate, format)\n : value?.startDate,\n endDate: !selectedDate?.endDate\n ? \"\"\n : selectedDate?.endDate && dateAdapter.isValid(selectedDate.endDate)\n ? dateAdapter.format(selectedDate.endDate, format)\n : value?.endDate,\n });\n }, [dateAdapter, format, selectedDate]);\n\n const handleCalendarButton: MouseEventHandler<HTMLButtonElement> =\n useCallback(\n (event) => {\n event.persist();\n setOpen(!open, event.nativeEvent, \"click\");\n event.stopPropagation();\n },\n [open, setOpen],\n );\n\n const handleDateChange = useCallback(\n (\n event: SyntheticEvent,\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n ) => {\n const validatedDetails = validate\n ? validate(date, details)\n : defaultRangeValidator(dateAdapter, date, details, minDate, maxDate);\n select(event, date, validatedDetails);\n },\n [dateAdapter, select, minDate, maxDate, validate],\n );\n\n const handleDateValueChange = useCallback(\n (event: SyntheticEvent | null, newDateValue: DateInputRangeValue) => {\n setValue(newDateValue);\n onDateValueChange?.(event, newDateValue);\n },\n [onDateValueChange],\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n useEffect(() => {\n if (open) {\n previousValue.current = value;\n }\n }, [open]);\n\n useEffect(() => {\n if (cancelled) {\n setValue(previousValue.current);\n }\n }, [cancelled]);\n\n return (\n <DateInputRange\n value={\n value ?? {\n startDate: \"\",\n endDate: \"\",\n }\n }\n className={clsx(withBaseName(), className)}\n date={selectedDate ?? null}\n startInputProps={startInputProps}\n endInputProps={endInputProps}\n readOnly={readOnly}\n disabled={disabled}\n ref={ref}\n onDateChange={handleDateChange}\n onDateValueChange={handleDateValueChange}\n onChange={onChange}\n endAdornment={\n !readOnly && (\n <Button\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleCalendarButton}\n disabled={disabled}\n aria-haspopup=\"dialog\"\n aria-label=\"Open Calendar\"\n aria-expanded={open}\n >\n <CalendarIcon aria-hidden />\n </Button>\n )\n }\n format={format}\n timezone={timezone}\n {...rest}\n />\n );\n});\n"],"names":["makePrefixer","DateDetailError","forwardRef","DatePickerRangeInput","useLocalization","useIcon","useDatePickerContext","useDatePickerOverlay","useRef","useControlled","useEffect","useCallback","jsx","DateInputRange","clsx","Button"],"mappings":"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"}
|
|
@@ -43,7 +43,7 @@ function defaultSingleValidation(dateAdapter, date, details, minDate, maxDate) {
|
|
|
43
43
|
}
|
|
44
44
|
return details;
|
|
45
45
|
}
|
|
46
|
-
const DatePickerSingleInput = react.forwardRef((props, ref)
|
|
46
|
+
const DatePickerSingleInput = react.forwardRef(function DatePickerSingleInput2(props, ref) {
|
|
47
47
|
const { dateAdapter } = LocalizationProvider.useLocalization();
|
|
48
48
|
const {
|
|
49
49
|
className,
|
|
@@ -71,7 +71,7 @@ const DatePickerSingleInput = react.forwardRef((props, ref) => {
|
|
|
71
71
|
state: { open },
|
|
72
72
|
helpers: { setOpen }
|
|
73
73
|
} = DatePickerOverlayProvider.useDatePickerOverlay();
|
|
74
|
-
const previousValue = react.useRef();
|
|
74
|
+
const previousValue = react.useRef(void 0);
|
|
75
75
|
const [value, setValue] = core.useControlled({
|
|
76
76
|
controlled: valueProp,
|
|
77
77
|
default: defaultValue,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerSingleInput.js","sources":["../src/date-picker/DatePickerSingleInput.tsx"],"sourcesContent":["import { Button, makePrefixer, useControlled } from \"@salt-ds/core\";\nimport {\n DateDetailError,\n type DateFrameworkType,\n type SaltDateAdapter,\n} from \"@salt-ds/date-adapters\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n forwardRef,\n type MouseEventHandler,\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport type { SingleDateSelection } from \"../calendar\";\nimport {\n DateInputSingle,\n type DateInputSingleDetails,\n type DateInputSingleProps,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport {\n type SingleDatePickerState,\n useDatePickerContext,\n} from \"./DatePickerContext\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerSingleInput\");\n\n/**\n * Props for the DatePickerSingleInput component.\n */\nexport interface DatePickerSingleInputProps extends DateInputSingleProps {\n /**\n * Function to validate the entered date\n * @param date - The selected date\n * @param details - The details of date selection, either a valid date or error\n * @returns updated DateInputSingleDetails details\n */\n validate?: (\n date: SingleDateSelection | null | undefined,\n details: DateInputSingleDetails,\n ) => DateInputSingleDetails;\n}\n\nfunction defaultSingleValidation(\n dateAdapter: SaltDateAdapter,\n date: DateFrameworkType | null | undefined,\n details: DateInputSingleDetails,\n minDate?: DateFrameworkType,\n maxDate?: DateFrameworkType,\n): DateInputSingleDetails {\n if (!date) {\n details.errors = details.errors ?? [];\n const hasUnsetError = details.errors.some(\n (err) => err.type === DateDetailError.UNSET,\n );\n if (!hasUnsetError) {\n details.errors.push({\n type: DateDetailError.UNSET,\n message: \"no date defined\",\n });\n }\n } else {\n if (\n minDate &&\n dateAdapter.isValid(date) &&\n dateAdapter.compare(date, minDate) < 0\n ) {\n details.errors = details.errors ?? [];\n details.errors?.push({\n type: \"min-date\",\n message: \"is before min date\",\n });\n } else if (\n maxDate &&\n dateAdapter.isValid(date) &&\n dateAdapter.compare(date, maxDate) > 0\n ) {\n details.errors = details.errors ?? [];\n details.errors?.push({\n type: \"max-date\",\n message: \"is after max date\",\n });\n }\n }\n return details;\n}\n\nexport const DatePickerSingleInput = forwardRef<\n HTMLDivElement,\n DatePickerSingleInputProps\n>((props
|
|
1
|
+
{"version":3,"file":"DatePickerSingleInput.js","sources":["../src/date-picker/DatePickerSingleInput.tsx"],"sourcesContent":["import { Button, makePrefixer, useControlled } from \"@salt-ds/core\";\nimport {\n DateDetailError,\n type DateFrameworkType,\n type SaltDateAdapter,\n} from \"@salt-ds/date-adapters\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n forwardRef,\n type MouseEventHandler,\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport type { SingleDateSelection } from \"../calendar\";\nimport {\n DateInputSingle,\n type DateInputSingleDetails,\n type DateInputSingleProps,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport {\n type SingleDatePickerState,\n useDatePickerContext,\n} from \"./DatePickerContext\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerSingleInput\");\n\n/**\n * Props for the DatePickerSingleInput component.\n */\nexport interface DatePickerSingleInputProps extends DateInputSingleProps {\n /**\n * Function to validate the entered date\n * @param date - The selected date\n * @param details - The details of date selection, either a valid date or error\n * @returns updated DateInputSingleDetails details\n */\n validate?: (\n date: SingleDateSelection | null | undefined,\n details: DateInputSingleDetails,\n ) => DateInputSingleDetails;\n}\n\nfunction defaultSingleValidation(\n dateAdapter: SaltDateAdapter,\n date: DateFrameworkType | null | undefined,\n details: DateInputSingleDetails,\n minDate?: DateFrameworkType,\n maxDate?: DateFrameworkType,\n): DateInputSingleDetails {\n if (!date) {\n details.errors = details.errors ?? [];\n const hasUnsetError = details.errors.some(\n (err) => err.type === DateDetailError.UNSET,\n );\n if (!hasUnsetError) {\n details.errors.push({\n type: DateDetailError.UNSET,\n message: \"no date defined\",\n });\n }\n } else {\n if (\n minDate &&\n dateAdapter.isValid(date) &&\n dateAdapter.compare(date, minDate) < 0\n ) {\n details.errors = details.errors ?? [];\n details.errors?.push({\n type: \"min-date\",\n message: \"is before min date\",\n });\n } else if (\n maxDate &&\n dateAdapter.isValid(date) &&\n dateAdapter.compare(date, maxDate) > 0\n ) {\n details.errors = details.errors ?? [];\n details.errors?.push({\n type: \"max-date\",\n message: \"is after max date\",\n });\n }\n }\n return details;\n}\n\nexport const DatePickerSingleInput = forwardRef<\n HTMLDivElement,\n DatePickerSingleInputProps\n>(function DatePickerSingleInput(props, ref) {\n const { dateAdapter } = useLocalization();\n\n const {\n className,\n value: valueProp,\n validate,\n defaultValue,\n onDateValueChange,\n ...rest\n } = props;\n\n const {\n state: {\n selectedDate,\n disabled,\n readOnly,\n cancelled,\n minDate,\n maxDate,\n timezone,\n },\n helpers: { select },\n } = useDatePickerContext({\n selectionVariant: \"single\",\n }) as SingleDatePickerState;\n const {\n state: { open },\n helpers: { setOpen },\n } = useDatePickerOverlay();\n\n const previousValue = useRef<typeof valueProp>(undefined);\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DatePickerSingleInput\",\n state: \"value\",\n });\n\n const handleCalendarButton: MouseEventHandler<HTMLButtonElement> =\n useCallback(\n (event) => {\n event.persist();\n setOpen(!open, event.nativeEvent, \"click\");\n event.stopPropagation();\n },\n [open, setOpen],\n );\n\n const handleDateChange = useCallback(\n (\n event: SyntheticEvent,\n date: SingleDateSelection | null | undefined,\n details: DateInputSingleDetails,\n ) => {\n const validatedDetails = validate\n ? validate(date, details)\n : defaultSingleValidation(dateAdapter, date, details, minDate, maxDate);\n select(event, date ?? null, validatedDetails);\n },\n [dateAdapter, minDate, maxDate, select, validate],\n );\n\n const handleDateValueChange = useCallback(\n (event: SyntheticEvent | null, newDateValue: string) => {\n setValue(newDateValue);\n onDateValueChange?.(event, newDateValue);\n },\n [onDateValueChange],\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n useEffect(() => {\n if (open) {\n previousValue.current = value;\n }\n }, [open]);\n\n useEffect(() => {\n if (cancelled) {\n setValue(previousValue?.current);\n }\n }, [cancelled]);\n\n return (\n <DateInputSingle\n value={value ?? \"\"}\n className={clsx(withBaseName(), className)}\n date={selectedDate ?? null}\n readOnly={readOnly}\n disabled={disabled}\n ref={ref}\n onDateChange={handleDateChange}\n onDateValueChange={handleDateValueChange}\n endAdornment={\n !readOnly && (\n <Button\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleCalendarButton}\n disabled={disabled}\n aria-haspopup=\"dialog\"\n aria-label=\"Open Calendar\"\n aria-expanded={open}\n >\n <CalendarIcon aria-hidden />\n </Button>\n )\n }\n timezone={timezone}\n {...rest}\n />\n );\n});\n"],"names":["makePrefixer","DateDetailError","forwardRef","DatePickerSingleInput","useLocalization","useDatePickerContext","useDatePickerOverlay","useRef","useControlled","useCallback","useEffect","jsx","DateInputSingle","clsx","Button","CalendarIcon"],"mappings":"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"}
|
|
@@ -7,7 +7,7 @@ var react = require('react');
|
|
|
7
7
|
var DatePickerOverlayProvider = require('./DatePickerOverlayProvider.js');
|
|
8
8
|
|
|
9
9
|
const withBaseName = core.makePrefixer("saltDatePickerTrigger");
|
|
10
|
-
const DatePickerTrigger = react.forwardRef((props, ref)
|
|
10
|
+
const DatePickerTrigger = react.forwardRef(function DatePickerTrigger2(props, ref) {
|
|
11
11
|
const { children, className, ...rest } = props;
|
|
12
12
|
const {
|
|
13
13
|
state: { floatingUIResult },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerTrigger.js","sources":["../src/date-picker/DatePickerTrigger.tsx"],"sourcesContent":["import { makePrefixer, useForkRef } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerTrigger\");\n\n/**\n * Props for the DatePickerTrigger component.\n */\nexport interface DatePickerTriggerProps {\n className?: string;\n children?: ReactNode;\n}\n\nexport const DatePickerTrigger = forwardRef<\n HTMLDivElement,\n DatePickerTriggerProps\n>((props
|
|
1
|
+
{"version":3,"file":"DatePickerTrigger.js","sources":["../src/date-picker/DatePickerTrigger.tsx"],"sourcesContent":["import { makePrefixer, useForkRef } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type ReactNode } from \"react\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerTrigger\");\n\n/**\n * Props for the DatePickerTrigger component.\n */\nexport interface DatePickerTriggerProps {\n className?: string;\n children?: ReactNode;\n}\n\nexport const DatePickerTrigger = forwardRef<\n HTMLDivElement,\n DatePickerTriggerProps\n>(function DatePickerTrigger(props, ref) {\n const { children, className, ...rest } = props;\n\n const {\n state: { floatingUIResult },\n helpers: { getReferenceProps },\n } = useDatePickerOverlay();\n\n const triggerRef = useForkRef<HTMLDivElement>(\n ref,\n floatingUIResult?.reference,\n );\n\n return (\n <div\n className={clsx(withBaseName(), className)}\n ref={triggerRef}\n {...getReferenceProps(rest)}\n >\n {children}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","DatePickerTrigger","useDatePickerOverlay","useForkRef","jsx","clsx"],"mappings":";;;;;;;;AAKA,MAAM,YAAA,GAAeA,kBAAa,uBAAuB,CAAA;AAUlD,MAAM,iBAAA,GAAoBC,gBAAA,CAG/B,SAASC,kBAAAA,CAAkB,OAAO,GAAA,EAAK;AACvC,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAEzC,EAAA,MAAM;AAAA,IACJ,KAAA,EAAO,EAAE,gBAAA,EAAiB;AAAA,IAC1B,OAAA,EAAS,EAAE,iBAAA;AAAkB,MAC3BC,8CAAA,EAAqB;AAEzB,EAAA,MAAM,UAAA,GAAaC,eAAA;AAAA,IACjB,GAAA;AAAA,IACA,gBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,gBAAA,CAAkB;AAAA,GACpB;AAEA,EAAA,uBACEC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA,EAAK,UAAA;AAAA,MACJ,GAAG,kBAAkB,IAAI,CAAA;AAAA,MAEzB;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
|
|
@@ -30,7 +30,7 @@ function useDatePicker(props, ref) {
|
|
|
30
30
|
onCancel,
|
|
31
31
|
timezone
|
|
32
32
|
} = props;
|
|
33
|
-
const previousSelectedDate = react.useRef();
|
|
33
|
+
const previousSelectedDate = react.useRef(void 0);
|
|
34
34
|
const incompleteRangeAnnouncementKeyRef = react.useRef(null);
|
|
35
35
|
const datePickerRef = react.useRef(null);
|
|
36
36
|
const containerRef = core.useForkRef(ref, datePickerRef);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDatePicker.js","sources":["../src/date-picker/useDatePicker.ts"],"sourcesContent":["import { useControlled, useForkRef, useFormFieldProps } from \"@salt-ds/core\";\nimport type { DateFrameworkType, Timezone } from \"@salt-ds/date-adapters\";\nimport {\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport {\n createRangeSelectionAnnouncement,\n createSingleSelectionAnnouncement,\n} from \"../calendar/internal/createAnnouncement\";\nimport {\n type CreateAnnouncement,\n useDateSelectionAnnouncer,\n} from \"../calendar/useDateSelectionAnnouncer\";\nimport type {\n DateInputRangeDetails,\n DateInputSingleDetails,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport type {\n RangeDatePickerState,\n SingleDatePickerState,\n} from \"./DatePickerContext\";\nimport { DATE_PICKER_OVERLAY_ANNOUNCER_TARGET } from \"./DatePickerOverlay\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\ninterface UseDatePickerBaseProps {\n /**\n * Factory method for date selection live announcements or null to silence announcements\n */\n createAnnouncement?: CreateAnnouncement | null;\n /**\n * If `true`, the component is disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, enables apply mode where selections are not committed until explicitly applied.\n * When using `DatePickerActions`, this is automatically set to `true`.\n */\n enableApply?: boolean;\n /**\n * Function to determine if a day is highlighted.\n * @param date - The date to check.\n * @returns A string reason if the day is highlighted, otherwise `false` or `undefined`.\n */\n isDayHighlighted?: (date: DateFrameworkType) => string | false | undefined;\n /**\n * Function to determine if a day is unselectable.\n * @param date - The date to check.\n * @returns A string reason if the day is unselectable, otherwise `false` or `undefined`.\n */\n isDayUnselectable?: (date: DateFrameworkType) => string | false | undefined;\n /** If `true`, the component is read-only. */\n readOnly?: boolean;\n /**\n * The minimum date for the range, default is 1900.\n */\n minDate?: DateFrameworkType;\n /**\n * The maximum date for the range, default is 2100.\n */\n maxDate?: DateFrameworkType;\n /**\n * Handler for when the date selection is cancelled.\n */\n onCancel?: () => void;\n /**\n * Timezone, if un-defined will take the timezone from passed date (or defaultSelectedDate/selectedDate)\n * Can also be set to \"default\" to use the default timezone of the date library\n * Can also be set to \"system\" to take the timezone of the local system.\n */\n timezone?: Timezone;\n}\n\n/**\n * Props for single date selection.\n */\nexport interface UseDatePickerSingleProps extends UseDatePickerBaseProps {\n /**\n * Single date selection.\n */\n selectionVariant: \"single\";\n /**\n * The selected date. The selected date will be controlled when this prop is provided.\n */\n selectedDate?: SingleDateSelection | null;\n /**\n * The initial selected date, when the selected date is uncontrolled.\n */\n defaultSelectedDate?: SingleDateSelection | null;\n /**\n * Handler called when the selected date changes.\n * @param event - The synthetic event.\n * @param date - The selected date or null.\n * @param details - The selected date details.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n date: SingleDateSelection | null,\n details?: DateInputSingleDetails,\n ) => void;\n /**\n * Handler called when the selected date is confirmed/applied.\n * @param event - The synthetic event.\n * @param date - The selected date or null.\n */\n onApply?: (event: SyntheticEvent, date: SingleDateSelection | null) => void;\n}\n\n/**\n * Props for date range selection.\n */\nexport interface UseDatePickerRangeProps extends UseDatePickerBaseProps {\n /**\n * Date range selection.\n */\n selectionVariant: \"range\";\n /**\n * The selected date range. The selected date will be controlled when this prop is provided.\n */\n selectedDate?: DateRangeSelection | null;\n /**\n * The initial selected date range, when the selected date is uncontrolled.\n */\n defaultSelectedDate?: DateRangeSelection | null;\n /**\n * Handler called when the selected date range changes.\n * @param event - The synthetic event.\n * @param date - The selected date range or null.\n * @param details - The selected date range details.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n date: DateRangeSelection | null,\n details?: DateInputRangeDetails,\n ) => void;\n /**\n * Handler called when the selected date range is confirmed/applied.\n * @param event - The synthetic event.\n * @param date - The selected date range.\n */\n onApply?: (event: SyntheticEvent, date: DateRangeSelection | null) => void;\n}\n\n/**\n * Props for the useDatePicker hook.\n */\nexport type UseDatePickerProps =\n | UseDatePickerSingleProps\n | UseDatePickerRangeProps;\n\n/**\n * Custom hook for managing date picker state.\n * @template SelectionVariant - The selection variant, either \"single\" or \"range\".\n * @param props - The props for the date picker.\n * @param ref - The ref for the date picker container.\n * @returns The date picker state and helpers.\n */\nexport function useDatePicker(\n props: UseDatePickerProps,\n ref: React.ForwardedRef<HTMLDivElement>,\n): SingleDatePickerState | RangeDatePickerState {\n const {\n dateAdapter,\n defaultDates: { minDate: defaultMinDate, maxDate: defaultMaxDate },\n } = useLocalization<DateFrameworkType>();\n const {\n createAnnouncement,\n readOnly = false,\n disabled,\n enableApply = false,\n selectionVariant,\n defaultSelectedDate,\n isDayHighlighted,\n isDayUnselectable,\n selectedDate: selectedDateProp,\n onSelectionChange,\n onApply,\n minDate = defaultMinDate,\n maxDate = defaultMaxDate,\n onCancel,\n timezone,\n } = props;\n\n const previousSelectedDate = useRef<typeof selectedDateProp>();\n const incompleteRangeAnnouncementKeyRef = useRef<string | null>(null);\n const datePickerRef = useRef<HTMLDivElement>(null);\n const containerRef = useForkRef(ref, datePickerRef);\n\n const { announce } = useDateSelectionAnnouncer(\n createAnnouncement ??\n (selectionVariant === \"single\"\n ? createSingleSelectionAnnouncement\n : createRangeSelectionAnnouncement),\n dateAdapter,\n );\n\n const {\n state: { open },\n helpers: { setOpen, setOnDismiss },\n } = useDatePickerOverlay();\n\n const overlayAnnounceOptions = open\n ? { target: DATE_PICKER_OVERLAY_ANNOUNCER_TARGET }\n : undefined;\n\n const [selectedDate, setSelectedDate] = useControlled({\n controlled: selectedDateProp,\n default: defaultSelectedDate,\n name: \"DatePicker\",\n state: \"selectedDate\",\n });\n\n const [cancelled, setCancelled] = useState<boolean>(false);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n useEffect(() => {\n if (open) {\n previousSelectedDate.current = selectedDate;\n if (enableApply) {\n setOnDismiss(cancel);\n }\n setCancelled(false);\n }\n }, [enableApply, open, setOnDismiss, setCancelled]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: avoid excessive re-rendering\n useEffect(() => {\n if (cancelled) {\n setSelectedDate(previousSelectedDate?.current);\n }\n }, [cancelled, setSelectedDate]);\n\n const { disabled: formFieldDisabled, readOnly: formFieldReadOnly } =\n useFormFieldProps();\n const isReadOnly = readOnly || formFieldReadOnly || false;\n const isDisabled = disabled || formFieldDisabled || false;\n\n const applySingle = useCallback(\n (event: SyntheticEvent, date: SingleDateSelection | null): void => {\n setCancelled(false);\n setOpen(false, event.nativeEvent, \"apply\");\n announce(\n \"dateSelected\",\n {\n multiselect: false,\n selectedDate: date,\n },\n overlayAnnounceOptions,\n );\n if (selectionVariant === \"single\") {\n onApply?.(event, date);\n }\n },\n [announce, overlayAnnounceOptions, selectionVariant, setOpen, onApply],\n );\n\n const checkAndAddError = useCallback(\n (\n date: DateFrameworkType | null | undefined,\n checkFunction:\n | ((date: DateFrameworkType) => string | false | undefined)\n | undefined,\n errorType: string,\n details: {\n errors?: { type: string; message: string | false | undefined }[];\n } = {},\n ) => {\n const errorMessage = date ? checkFunction?.(date) : false;\n if (errorMessage) {\n details.errors = details.errors ?? [];\n details.errors.push({\n type: errorType,\n message: errorMessage,\n });\n }\n },\n [],\n );\n\n const selectSingle = useCallback(\n (\n event: SyntheticEvent,\n date: SingleDateSelection | null,\n details: DateInputSingleDetails,\n ) => {\n setSelectedDate(date);\n checkAndAddError(date, isDayUnselectable, \"unselectable\", details);\n const canBeApplied =\n dateAdapter.isValid(date) && !details?.errors?.length;\n\n if (selectionVariant === \"single\") {\n onSelectionChange?.(event, date, details);\n }\n if (!enableApply && canBeApplied) {\n applySingle(event, date);\n }\n },\n [\n checkAndAddError,\n dateAdapter,\n applySingle,\n isDayUnselectable,\n enableApply,\n onSelectionChange,\n selectionVariant,\n ],\n );\n\n const applyRange = useCallback(\n (event: SyntheticEvent, date: DateRangeSelection | null): void => {\n setCancelled(false);\n setOpen(false, event.nativeEvent, \"apply\");\n announce(\n \"dateSelected\",\n {\n multiselect: false,\n selectedDate: date\n ? {\n startDate: date.startDate ?? undefined,\n endDate: date.endDate ?? undefined,\n }\n : null,\n },\n overlayAnnounceOptions,\n );\n if (selectionVariant === \"range\") {\n onApply?.(event, date);\n }\n },\n [announce, overlayAnnounceOptions, onApply, setOpen, selectionVariant],\n );\n\n const selectRange = useCallback(\n (\n event: SyntheticEvent,\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n ) => {\n setSelectedDate(date);\n checkAndAddError(\n date?.startDate,\n isDayUnselectable,\n \"unselectable\",\n details?.startDate,\n );\n checkAndAddError(\n date?.endDate,\n isDayUnselectable,\n \"unselectable\",\n details?.endDate,\n );\n\n if (selectionVariant === \"range\") {\n onSelectionChange?.(event, date, details);\n }\n\n const hasValidStartDate = dateAdapter.isValid(date?.startDate);\n const hasValidEndDate = dateAdapter.isValid(date?.endDate);\n const hasStartDateErrors = Boolean(details?.startDate?.errors?.length);\n const hasEndDateErrors = Boolean(details?.endDate?.errors?.length);\n\n let incompleteRangeAnnouncementKey: string | null = null;\n let incompleteRangeSelection:\n | { startDate?: DateFrameworkType; endDate?: DateFrameworkType }\n | undefined;\n\n if (hasValidStartDate && !hasValidEndDate && !hasStartDateErrors) {\n incompleteRangeAnnouncementKey = `start:${dateAdapter.format(\n date?.startDate as DateFrameworkType,\n \"YYYY-MM-DD\",\n )}`;\n incompleteRangeSelection = {\n startDate: date?.startDate ?? undefined,\n endDate: undefined,\n };\n } else if (!hasValidStartDate && hasValidEndDate && !hasEndDateErrors) {\n incompleteRangeAnnouncementKey = `end:${dateAdapter.format(\n date?.endDate as DateFrameworkType,\n \"YYYY-MM-DD\",\n )}`;\n incompleteRangeSelection = {\n startDate: undefined,\n endDate: date?.endDate ?? undefined,\n };\n }\n\n if (incompleteRangeAnnouncementKey && incompleteRangeSelection) {\n if (\n incompleteRangeAnnouncementKeyRef.current !==\n incompleteRangeAnnouncementKey\n ) {\n announce(\n \"dateSelected\",\n {\n multiselect: false,\n selectedDate: incompleteRangeSelection,\n },\n overlayAnnounceOptions,\n );\n incompleteRangeAnnouncementKeyRef.current =\n incompleteRangeAnnouncementKey;\n }\n } else {\n incompleteRangeAnnouncementKeyRef.current = null;\n }\n\n const isAValidRange =\n dateAdapter.isValid(date?.startDate) &&\n dateAdapter.isValid(date?.endDate);\n const isValidSelection =\n !details?.startDate?.errors?.length &&\n !details?.endDate?.errors?.length;\n const canBeApplied = isAValidRange && isValidSelection;\n if (!enableApply && canBeApplied) {\n applyRange(event, date);\n }\n },\n [\n checkAndAddError,\n announce,\n overlayAnnounceOptions,\n dateAdapter,\n applyRange,\n isDayUnselectable,\n enableApply,\n onSelectionChange,\n selectionVariant,\n ],\n );\n\n const cancel = useCallback(\n (event?: Event) => {\n setCancelled(true);\n setOpen(false, event, \"cancel\");\n onCancel?.();\n },\n [setOpen, onCancel],\n );\n\n const returnValue = {\n state: {\n selectionVariant,\n selectedDate,\n cancelled,\n enableApply,\n disabled: isDisabled,\n readOnly: isReadOnly,\n containerRef,\n minDate,\n maxDate,\n timezone,\n },\n helpers: {\n cancel,\n isDayHighlighted,\n isDayUnselectable,\n },\n };\n if (props.selectionVariant === \"range\") {\n return {\n ...returnValue,\n helpers: {\n ...returnValue.helpers,\n apply: applyRange,\n select: selectRange,\n },\n } as RangeDatePickerState;\n }\n return {\n ...returnValue,\n helpers: {\n ...returnValue.helpers,\n apply: applySingle,\n select: selectSingle,\n },\n } as SingleDatePickerState;\n}\n"],"names":["useLocalization","createAnnouncement","useRef","useForkRef","useDateSelectionAnnouncer","createSingleSelectionAnnouncement","createRangeSelectionAnnouncement","useDatePickerOverlay","DATE_PICKER_OVERLAY_ANNOUNCER_TARGET","useControlled","useState","useEffect","useFormFieldProps","useCallback"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useDatePicker.js","sources":["../src/date-picker/useDatePicker.ts"],"sourcesContent":["import { useControlled, useForkRef, useFormFieldProps } from \"@salt-ds/core\";\nimport type { DateFrameworkType, Timezone } from \"@salt-ds/date-adapters\";\nimport {\n type SyntheticEvent,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport {\n createRangeSelectionAnnouncement,\n createSingleSelectionAnnouncement,\n} from \"../calendar/internal/createAnnouncement\";\nimport {\n type CreateAnnouncement,\n useDateSelectionAnnouncer,\n} from \"../calendar/useDateSelectionAnnouncer\";\nimport type {\n DateInputRangeDetails,\n DateInputSingleDetails,\n} from \"../date-input\";\nimport { useLocalization } from \"../localization-provider\";\nimport type {\n RangeDatePickerState,\n SingleDatePickerState,\n} from \"./DatePickerContext\";\nimport { DATE_PICKER_OVERLAY_ANNOUNCER_TARGET } from \"./DatePickerOverlay\";\nimport { useDatePickerOverlay } from \"./DatePickerOverlayProvider\";\n\ninterface UseDatePickerBaseProps {\n /**\n * Factory method for date selection live announcements or null to silence announcements\n */\n createAnnouncement?: CreateAnnouncement | null;\n /**\n * If `true`, the component is disabled.\n */\n disabled?: boolean;\n /**\n * If `true`, enables apply mode where selections are not committed until explicitly applied.\n * When using `DatePickerActions`, this is automatically set to `true`.\n */\n enableApply?: boolean;\n /**\n * Function to determine if a day is highlighted.\n * @param date - The date to check.\n * @returns A string reason if the day is highlighted, otherwise `false` or `undefined`.\n */\n isDayHighlighted?: (date: DateFrameworkType) => string | false | undefined;\n /**\n * Function to determine if a day is unselectable.\n * @param date - The date to check.\n * @returns A string reason if the day is unselectable, otherwise `false` or `undefined`.\n */\n isDayUnselectable?: (date: DateFrameworkType) => string | false | undefined;\n /** If `true`, the component is read-only. */\n readOnly?: boolean;\n /**\n * The minimum date for the range, default is 1900.\n */\n minDate?: DateFrameworkType;\n /**\n * The maximum date for the range, default is 2100.\n */\n maxDate?: DateFrameworkType;\n /**\n * Handler for when the date selection is cancelled.\n */\n onCancel?: () => void;\n /**\n * Timezone, if un-defined will take the timezone from passed date (or defaultSelectedDate/selectedDate)\n * Can also be set to \"default\" to use the default timezone of the date library\n * Can also be set to \"system\" to take the timezone of the local system.\n */\n timezone?: Timezone;\n}\n\n/**\n * Props for single date selection.\n */\nexport interface UseDatePickerSingleProps extends UseDatePickerBaseProps {\n /**\n * Single date selection.\n */\n selectionVariant: \"single\";\n /**\n * The selected date. The selected date will be controlled when this prop is provided.\n */\n selectedDate?: SingleDateSelection | null;\n /**\n * The initial selected date, when the selected date is uncontrolled.\n */\n defaultSelectedDate?: SingleDateSelection | null;\n /**\n * Handler called when the selected date changes.\n * @param event - The synthetic event.\n * @param date - The selected date or null.\n * @param details - The selected date details.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n date: SingleDateSelection | null,\n details?: DateInputSingleDetails,\n ) => void;\n /**\n * Handler called when the selected date is confirmed/applied.\n * @param event - The synthetic event.\n * @param date - The selected date or null.\n */\n onApply?: (event: SyntheticEvent, date: SingleDateSelection | null) => void;\n}\n\n/**\n * Props for date range selection.\n */\nexport interface UseDatePickerRangeProps extends UseDatePickerBaseProps {\n /**\n * Date range selection.\n */\n selectionVariant: \"range\";\n /**\n * The selected date range. The selected date will be controlled when this prop is provided.\n */\n selectedDate?: DateRangeSelection | null;\n /**\n * The initial selected date range, when the selected date is uncontrolled.\n */\n defaultSelectedDate?: DateRangeSelection | null;\n /**\n * Handler called when the selected date range changes.\n * @param event - The synthetic event.\n * @param date - The selected date range or null.\n * @param details - The selected date range details.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n date: DateRangeSelection | null,\n details?: DateInputRangeDetails,\n ) => void;\n /**\n * Handler called when the selected date range is confirmed/applied.\n * @param event - The synthetic event.\n * @param date - The selected date range.\n */\n onApply?: (event: SyntheticEvent, date: DateRangeSelection | null) => void;\n}\n\n/**\n * Props for the useDatePicker hook.\n */\nexport type UseDatePickerProps =\n | UseDatePickerSingleProps\n | UseDatePickerRangeProps;\n\n/**\n * Custom hook for managing date picker state.\n * @template SelectionVariant - The selection variant, either \"single\" or \"range\".\n * @param props - The props for the date picker.\n * @param ref - The ref for the date picker container.\n * @returns The date picker state and helpers.\n */\nexport function useDatePicker(\n props: UseDatePickerProps,\n ref: React.ForwardedRef<HTMLDivElement>,\n): SingleDatePickerState | RangeDatePickerState {\n const {\n dateAdapter,\n defaultDates: { minDate: defaultMinDate, maxDate: defaultMaxDate },\n } = useLocalization<DateFrameworkType>();\n const {\n createAnnouncement,\n readOnly = false,\n disabled,\n enableApply = false,\n selectionVariant,\n defaultSelectedDate,\n isDayHighlighted,\n isDayUnselectable,\n selectedDate: selectedDateProp,\n onSelectionChange,\n onApply,\n minDate = defaultMinDate,\n maxDate = defaultMaxDate,\n onCancel,\n timezone,\n } = props;\n\n const previousSelectedDate = useRef<typeof selectedDateProp>(undefined);\n const incompleteRangeAnnouncementKeyRef = useRef<string | null>(null);\n const datePickerRef = useRef<HTMLDivElement>(null);\n const containerRef = useForkRef(ref, datePickerRef);\n\n const { announce } = useDateSelectionAnnouncer(\n createAnnouncement ??\n (selectionVariant === \"single\"\n ? createSingleSelectionAnnouncement\n : createRangeSelectionAnnouncement),\n dateAdapter,\n );\n\n const {\n state: { open },\n helpers: { setOpen, setOnDismiss },\n } = useDatePickerOverlay();\n\n const overlayAnnounceOptions = open\n ? { target: DATE_PICKER_OVERLAY_ANNOUNCER_TARGET }\n : undefined;\n\n const [selectedDate, setSelectedDate] = useControlled({\n controlled: selectedDateProp,\n default: defaultSelectedDate,\n name: \"DatePicker\",\n state: \"selectedDate\",\n });\n\n const [cancelled, setCancelled] = useState<boolean>(false);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: should run when open changes and not selected date or value\n useEffect(() => {\n if (open) {\n previousSelectedDate.current = selectedDate;\n if (enableApply) {\n setOnDismiss(cancel);\n }\n setCancelled(false);\n }\n }, [enableApply, open, setOnDismiss, setCancelled]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: avoid excessive re-rendering\n useEffect(() => {\n if (cancelled) {\n setSelectedDate(previousSelectedDate?.current);\n }\n }, [cancelled, setSelectedDate]);\n\n const { disabled: formFieldDisabled, readOnly: formFieldReadOnly } =\n useFormFieldProps();\n const isReadOnly = readOnly || formFieldReadOnly || false;\n const isDisabled = disabled || formFieldDisabled || false;\n\n const applySingle = useCallback(\n (event: SyntheticEvent, date: SingleDateSelection | null): void => {\n setCancelled(false);\n setOpen(false, event.nativeEvent, \"apply\");\n announce(\n \"dateSelected\",\n {\n multiselect: false,\n selectedDate: date,\n },\n overlayAnnounceOptions,\n );\n if (selectionVariant === \"single\") {\n onApply?.(event, date);\n }\n },\n [announce, overlayAnnounceOptions, selectionVariant, setOpen, onApply],\n );\n\n const checkAndAddError = useCallback(\n (\n date: DateFrameworkType | null | undefined,\n checkFunction:\n | ((date: DateFrameworkType) => string | false | undefined)\n | undefined,\n errorType: string,\n details: {\n errors?: { type: string; message: string | false | undefined }[];\n } = {},\n ) => {\n const errorMessage = date ? checkFunction?.(date) : false;\n if (errorMessage) {\n details.errors = details.errors ?? [];\n details.errors.push({\n type: errorType,\n message: errorMessage,\n });\n }\n },\n [],\n );\n\n const selectSingle = useCallback(\n (\n event: SyntheticEvent,\n date: SingleDateSelection | null,\n details: DateInputSingleDetails,\n ) => {\n setSelectedDate(date);\n checkAndAddError(date, isDayUnselectable, \"unselectable\", details);\n const canBeApplied =\n dateAdapter.isValid(date) && !details?.errors?.length;\n\n if (selectionVariant === \"single\") {\n onSelectionChange?.(event, date, details);\n }\n if (!enableApply && canBeApplied) {\n applySingle(event, date);\n }\n },\n [\n checkAndAddError,\n dateAdapter,\n applySingle,\n isDayUnselectable,\n enableApply,\n onSelectionChange,\n selectionVariant,\n ],\n );\n\n const applyRange = useCallback(\n (event: SyntheticEvent, date: DateRangeSelection | null): void => {\n setCancelled(false);\n setOpen(false, event.nativeEvent, \"apply\");\n announce(\n \"dateSelected\",\n {\n multiselect: false,\n selectedDate: date\n ? {\n startDate: date.startDate ?? undefined,\n endDate: date.endDate ?? undefined,\n }\n : null,\n },\n overlayAnnounceOptions,\n );\n if (selectionVariant === \"range\") {\n onApply?.(event, date);\n }\n },\n [announce, overlayAnnounceOptions, onApply, setOpen, selectionVariant],\n );\n\n const selectRange = useCallback(\n (\n event: SyntheticEvent,\n date: DateRangeSelection | null,\n details: DateInputRangeDetails,\n ) => {\n setSelectedDate(date);\n checkAndAddError(\n date?.startDate,\n isDayUnselectable,\n \"unselectable\",\n details?.startDate,\n );\n checkAndAddError(\n date?.endDate,\n isDayUnselectable,\n \"unselectable\",\n details?.endDate,\n );\n\n if (selectionVariant === \"range\") {\n onSelectionChange?.(event, date, details);\n }\n\n const hasValidStartDate = dateAdapter.isValid(date?.startDate);\n const hasValidEndDate = dateAdapter.isValid(date?.endDate);\n const hasStartDateErrors = Boolean(details?.startDate?.errors?.length);\n const hasEndDateErrors = Boolean(details?.endDate?.errors?.length);\n\n let incompleteRangeAnnouncementKey: string | null = null;\n let incompleteRangeSelection:\n | { startDate?: DateFrameworkType; endDate?: DateFrameworkType }\n | undefined;\n\n if (hasValidStartDate && !hasValidEndDate && !hasStartDateErrors) {\n incompleteRangeAnnouncementKey = `start:${dateAdapter.format(\n date?.startDate as DateFrameworkType,\n \"YYYY-MM-DD\",\n )}`;\n incompleteRangeSelection = {\n startDate: date?.startDate ?? undefined,\n endDate: undefined,\n };\n } else if (!hasValidStartDate && hasValidEndDate && !hasEndDateErrors) {\n incompleteRangeAnnouncementKey = `end:${dateAdapter.format(\n date?.endDate as DateFrameworkType,\n \"YYYY-MM-DD\",\n )}`;\n incompleteRangeSelection = {\n startDate: undefined,\n endDate: date?.endDate ?? undefined,\n };\n }\n\n if (incompleteRangeAnnouncementKey && incompleteRangeSelection) {\n if (\n incompleteRangeAnnouncementKeyRef.current !==\n incompleteRangeAnnouncementKey\n ) {\n announce(\n \"dateSelected\",\n {\n multiselect: false,\n selectedDate: incompleteRangeSelection,\n },\n overlayAnnounceOptions,\n );\n incompleteRangeAnnouncementKeyRef.current =\n incompleteRangeAnnouncementKey;\n }\n } else {\n incompleteRangeAnnouncementKeyRef.current = null;\n }\n\n const isAValidRange =\n dateAdapter.isValid(date?.startDate) &&\n dateAdapter.isValid(date?.endDate);\n const isValidSelection =\n !details?.startDate?.errors?.length &&\n !details?.endDate?.errors?.length;\n const canBeApplied = isAValidRange && isValidSelection;\n if (!enableApply && canBeApplied) {\n applyRange(event, date);\n }\n },\n [\n checkAndAddError,\n announce,\n overlayAnnounceOptions,\n dateAdapter,\n applyRange,\n isDayUnselectable,\n enableApply,\n onSelectionChange,\n selectionVariant,\n ],\n );\n\n const cancel = useCallback(\n (event?: Event) => {\n setCancelled(true);\n setOpen(false, event, \"cancel\");\n onCancel?.();\n },\n [setOpen, onCancel],\n );\n\n const returnValue = {\n state: {\n selectionVariant,\n selectedDate,\n cancelled,\n enableApply,\n disabled: isDisabled,\n readOnly: isReadOnly,\n containerRef,\n minDate,\n maxDate,\n timezone,\n },\n helpers: {\n cancel,\n isDayHighlighted,\n isDayUnselectable,\n },\n };\n if (props.selectionVariant === \"range\") {\n return {\n ...returnValue,\n helpers: {\n ...returnValue.helpers,\n apply: applyRange,\n select: selectRange,\n },\n } as RangeDatePickerState;\n }\n return {\n ...returnValue,\n helpers: {\n ...returnValue.helpers,\n apply: applySingle,\n select: selectSingle,\n },\n } as SingleDatePickerState;\n}\n"],"names":["useLocalization","createAnnouncement","useRef","useForkRef","useDateSelectionAnnouncer","createSingleSelectionAnnouncement","createRangeSelectionAnnouncement","useDatePickerOverlay","DATE_PICKER_OVERLAY_ANNOUNCER_TARGET","useControlled","useState","useEffect","useFormFieldProps","useCallback"],"mappings":"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"}
|
|
@@ -24,7 +24,7 @@ function getStartOrEndDate(dateRange, isMultiselect2) {
|
|
|
24
24
|
}
|
|
25
25
|
let warnedOnce = false;
|
|
26
26
|
const Calendar = forwardRef(
|
|
27
|
-
(props, ref)
|
|
27
|
+
function Calendar2(props, ref) {
|
|
28
28
|
const targetWindow = useWindow();
|
|
29
29
|
const { dateAdapter } = useLocalization();
|
|
30
30
|
useComponentCssInjection({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Calendar.js","sources":["../src/calendar/Calendar.tsx"],"sourcesContent":["import { makePrefixer, type ResponsiveProp } from \"@salt-ds/core\";\nimport type { DateFrameworkType, Timezone } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n useRef,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarCss from \"./Calendar.css\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport {\n type UseCalendarMultiselectOffsetProps,\n type UseCalendarMultiselectRangeProps,\n type UseCalendarMultiselectSingleProps,\n type UseCalendarOffsetProps,\n type UseCalendarRangeProps,\n type UseCalendarSingleProps,\n useCalendar,\n} from \"./useCalendar\";\nimport type { DateRangeSelection } from \"./useCalendarSelection\";\n\n/**\n * Base props for the Calendar component.\n */\nexport interface CalendarBaseProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content to be rendered inside the Calendar.\n */\n children: ReactNode;\n /**\n * If `true`, hides dates that are out of the selectable range.\n */\n hideOutOfRangeDates?: boolean;\n /**\n * Ref to attach to the focused element,enabling focus to be controlled.\n */\n focusedDateRef?: React.MutableRefObject<HTMLElement | null>;\n /**\n * Number of visible months, maximum 12, defaults to 1\n */\n numberOfVisibleMonths?: ResponsiveProp<\n 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n >;\n /**\n * Specifies the timezone behavior:\n * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`.\n * - If set to \"default\", the default timezone of the date library will be used.\n * - If set to \"system\", the local system's timezone will be applied.\n * - If set to \"UTC\", the time will be returned in UTC.\n * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone.\n */\n timezone?: Timezone;\n}\n\n/**\n * Props for the Calendar component with single date selection.\n */\nexport interface CalendarSingleProps\n extends CalendarBaseProps,\n UseCalendarSingleProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date selection.\n */\nexport interface CalendarMultiselectSingleProps\n extends CalendarBaseProps,\n UseCalendarMultiselectSingleProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n /**\n * Multiple selection\n */\n multiselect: true;\n}\n\n/**\n * Props for the Calendar component with date range selection.\n */\nexport interface CalendarRangeProps\n extends CalendarBaseProps,\n UseCalendarRangeProps {\n /**\n * The selection variant, set to \"range\".\n */\n selectionVariant: \"range\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date range selection.\n */\nexport interface CalendarMultiselectRangeProps\n extends CalendarBaseProps,\n UseCalendarMultiselectRangeProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"range\";\n /**\n * Multiple selection\n */\n multiselect: true;\n}\n\n/**\n * Props for the Calendar component with offset date selection.\n */\nexport interface CalendarOffsetProps\n extends CalendarBaseProps,\n UseCalendarOffsetProps {\n /**\n * The selection variant, set to \"offset\".\n */\n selectionVariant: \"offset\";\n}\n\n/**\n * Props for the Calendar component with multi-select, offset date selection.\n */\nexport interface CalendarMultiselectOffsetProps\n extends CalendarBaseProps,\n UseCalendarMultiselectOffsetProps {\n /**\n * The selection variant, set to \"offset\".\n */\n selectionVariant: \"offset\";\n /**\n * Multiple selection\n */\n multiselect: true;\n}\n\n/**\n * Type representing the props for the Calendar component with various selection variants.\n */\nexport type CalendarProps =\n | CalendarSingleProps\n | CalendarMultiselectSingleProps\n | CalendarRangeProps\n | CalendarMultiselectRangeProps\n | CalendarOffsetProps\n | CalendarMultiselectOffsetProps;\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nfunction isMultiselect(\n props: CalendarProps,\n): props is\n | CalendarMultiselectSingleProps\n | CalendarMultiselectRangeProps\n | CalendarMultiselectOffsetProps {\n return props.multiselect === true;\n}\n\nfunction getStartOrEndDate(\n dateRange: DateRangeSelection | DateRangeSelection[] | undefined,\n isMultiselect: boolean,\n): DateFrameworkType | null | undefined {\n if (isMultiselect) {\n const rangeArray = dateRange as DateRangeSelection[];\n return rangeArray?.[0]?.startDate ?? rangeArray?.[0]?.endDate;\n }\n const range = dateRange as DateRangeSelection;\n return range?.startDate ?? range?.endDate;\n}\n\nlet warnedOnce = false;\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>(\n (props: CalendarProps, ref: React.Ref<HTMLDivElement>) => {\n const targetWindow = useWindow();\n const { dateAdapter } = useLocalization();\n useComponentCssInjection({\n testId: \"salt-calendar\",\n css: calendarCss,\n window: targetWindow,\n });\n const {\n createAnnouncement,\n children,\n className,\n selectedDate,\n defaultSelectedDate,\n visibleMonth: visibleMonthProp,\n defaultVisibleMonth,\n onFocusedDateChange,\n onSelectionChange,\n onVisibleMonthChange,\n hideOutOfRangeDates,\n focusedDate,\n focusedDateRef,\n isDayUnselectable,\n isDayHighlighted,\n minDate,\n maxDate,\n multiselect,\n numberOfVisibleMonths = 1,\n select,\n selectionVariant,\n onHoveredDateChange,\n hoveredDate,\n timezone: timezoneProp,\n ...propsRest\n } = props;\n\n if (\n process.env.NODE_ENV !== \"production\" &&\n !warnedOnce &&\n multiselect &&\n selectionVariant !== \"single\"\n ) {\n console.warn(\n `'multiselect' with selection variant '${selectionVariant}' is experimental and not for production use.`,\n );\n warnedOnce = true;\n }\n\n let timezone: Timezone = \"default\";\n if (timezoneProp) {\n timezone = timezoneProp;\n } else {\n let defaultTimezoneDate: DateFrameworkType | null | undefined;\n\n if (selectionVariant === \"range\" || selectionVariant === \"offset\") {\n const shouldExtractFromList = isMultiselect(props);\n defaultTimezoneDate =\n getStartOrEndDate(selectedDate, shouldExtractFromList) ??\n getStartOrEndDate(defaultSelectedDate, shouldExtractFromList);\n } else if (selectionVariant === \"single\") {\n if (isMultiselect(props)) {\n defaultTimezoneDate =\n (defaultSelectedDate as DateFrameworkType[])?.[0] ?? undefined;\n } else {\n defaultTimezoneDate =\n (selectedDate as DateFrameworkType | null) ??\n (defaultSelectedDate as DateFrameworkType | null);\n }\n }\n if (defaultTimezoneDate) {\n timezone = dateAdapter.getTimezone(defaultTimezoneDate);\n }\n }\n\n let startDateOffset: CalendarOffsetProps[\"startDateOffset\"];\n let endDateOffset: CalendarOffsetProps[\"startDateOffset\"];\n let rest: Partial<typeof props>;\n if (selectionVariant === \"offset\") {\n ({ startDateOffset, endDateOffset, ...rest } =\n propsRest as CalendarOffsetProps);\n } else {\n rest = propsRest;\n }\n const defaultFocusedDateRef = useRef(null);\n\n // biome-ignore lint/suspicious/noExplicitAny: type guard\n const useCalendarProps: any = {\n createAnnouncement,\n selectedDate,\n defaultSelectedDate,\n visibleMonth: visibleMonthProp,\n defaultVisibleMonth,\n onSelectionChange,\n onVisibleMonthChange,\n focusedDate,\n focusedDateRef:\n focusedDateRef !== undefined ? focusedDateRef : defaultFocusedDateRef,\n isDayUnselectable,\n isDayHighlighted,\n multiselect,\n minDate,\n maxDate,\n numberOfVisibleMonths,\n select,\n selectionVariant,\n onFocusedDateChange,\n onHoveredDateChange,\n hideOutOfRangeDates,\n hoveredDate,\n startDateOffset,\n endDateOffset,\n timezone,\n };\n const { state, helpers } = useCalendar(useCalendarProps);\n const calendarLabel = dateAdapter.format(state.visibleMonth, \"MMMM YYYY\");\n\n return (\n <CalendarContext.Provider\n value={{\n state,\n helpers,\n }}\n >\n <div\n className={clsx(withBaseName(), className)}\n role=\"application\"\n aria-label={calendarLabel}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n </CalendarContext.Provider>\n );\n },\n);\n"],"names":["isMultiselect","calendarCss"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Calendar.js","sources":["../src/calendar/Calendar.tsx"],"sourcesContent":["import { makePrefixer, type ResponsiveProp } from \"@salt-ds/core\";\nimport type { DateFrameworkType, Timezone } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n useRef,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarCss from \"./Calendar.css\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport {\n type UseCalendarMultiselectOffsetProps,\n type UseCalendarMultiselectRangeProps,\n type UseCalendarMultiselectSingleProps,\n type UseCalendarOffsetProps,\n type UseCalendarRangeProps,\n type UseCalendarSingleProps,\n useCalendar,\n} from \"./useCalendar\";\nimport type { DateRangeSelection } from \"./useCalendarSelection\";\n\n/**\n * Base props for the Calendar component.\n */\nexport interface CalendarBaseProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The content to be rendered inside the Calendar.\n */\n children: ReactNode;\n /**\n * If `true`, hides dates that are out of the selectable range.\n */\n hideOutOfRangeDates?: boolean;\n /**\n * Ref to attach to the focused element,enabling focus to be controlled.\n */\n focusedDateRef?: React.MutableRefObject<HTMLElement | null>;\n /**\n * Number of visible months, maximum 12, defaults to 1\n */\n numberOfVisibleMonths?: ResponsiveProp<\n 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n >;\n /**\n * Specifies the timezone behavior:\n * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`.\n * - If set to \"default\", the default timezone of the date library will be used.\n * - If set to \"system\", the local system's timezone will be applied.\n * - If set to \"UTC\", the time will be returned in UTC.\n * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone.\n */\n timezone?: Timezone;\n}\n\n/**\n * Props for the Calendar component with single date selection.\n */\nexport interface CalendarSingleProps\n extends CalendarBaseProps,\n UseCalendarSingleProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date selection.\n */\nexport interface CalendarMultiselectSingleProps\n extends CalendarBaseProps,\n UseCalendarMultiselectSingleProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"single\";\n /**\n * Multiple selection\n */\n multiselect: true;\n}\n\n/**\n * Props for the Calendar component with date range selection.\n */\nexport interface CalendarRangeProps\n extends CalendarBaseProps,\n UseCalendarRangeProps {\n /**\n * The selection variant, set to \"range\".\n */\n selectionVariant: \"range\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date range selection.\n */\nexport interface CalendarMultiselectRangeProps\n extends CalendarBaseProps,\n UseCalendarMultiselectRangeProps {\n /**\n * The selection variant, set to \"single\".\n */\n selectionVariant: \"range\";\n /**\n * Multiple selection\n */\n multiselect: true;\n}\n\n/**\n * Props for the Calendar component with offset date selection.\n */\nexport interface CalendarOffsetProps\n extends CalendarBaseProps,\n UseCalendarOffsetProps {\n /**\n * The selection variant, set to \"offset\".\n */\n selectionVariant: \"offset\";\n}\n\n/**\n * Props for the Calendar component with multi-select, offset date selection.\n */\nexport interface CalendarMultiselectOffsetProps\n extends CalendarBaseProps,\n UseCalendarMultiselectOffsetProps {\n /**\n * The selection variant, set to \"offset\".\n */\n selectionVariant: \"offset\";\n /**\n * Multiple selection\n */\n multiselect: true;\n}\n\n/**\n * Type representing the props for the Calendar component with various selection variants.\n */\nexport type CalendarProps =\n | CalendarSingleProps\n | CalendarMultiselectSingleProps\n | CalendarRangeProps\n | CalendarMultiselectRangeProps\n | CalendarOffsetProps\n | CalendarMultiselectOffsetProps;\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nfunction isMultiselect(\n props: CalendarProps,\n): props is\n | CalendarMultiselectSingleProps\n | CalendarMultiselectRangeProps\n | CalendarMultiselectOffsetProps {\n return props.multiselect === true;\n}\n\nfunction getStartOrEndDate(\n dateRange: DateRangeSelection | DateRangeSelection[] | undefined,\n isMultiselect: boolean,\n): DateFrameworkType | null | undefined {\n if (isMultiselect) {\n const rangeArray = dateRange as DateRangeSelection[];\n return rangeArray?.[0]?.startDate ?? rangeArray?.[0]?.endDate;\n }\n const range = dateRange as DateRangeSelection;\n return range?.startDate ?? range?.endDate;\n}\n\nlet warnedOnce = false;\n\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>(\n function Calendar(props, ref) {\n const targetWindow = useWindow();\n const { dateAdapter } = useLocalization();\n useComponentCssInjection({\n testId: \"salt-calendar\",\n css: calendarCss,\n window: targetWindow,\n });\n const {\n createAnnouncement,\n children,\n className,\n selectedDate,\n defaultSelectedDate,\n visibleMonth: visibleMonthProp,\n defaultVisibleMonth,\n onFocusedDateChange,\n onSelectionChange,\n onVisibleMonthChange,\n hideOutOfRangeDates,\n focusedDate,\n focusedDateRef,\n isDayUnselectable,\n isDayHighlighted,\n minDate,\n maxDate,\n multiselect,\n numberOfVisibleMonths = 1,\n select,\n selectionVariant,\n onHoveredDateChange,\n hoveredDate,\n timezone: timezoneProp,\n ...propsRest\n } = props;\n\n if (\n process.env.NODE_ENV !== \"production\" &&\n !warnedOnce &&\n multiselect &&\n selectionVariant !== \"single\"\n ) {\n console.warn(\n `'multiselect' with selection variant '${selectionVariant}' is experimental and not for production use.`,\n );\n warnedOnce = true;\n }\n\n let timezone: Timezone = \"default\";\n if (timezoneProp) {\n timezone = timezoneProp;\n } else {\n let defaultTimezoneDate: DateFrameworkType | null | undefined;\n\n if (selectionVariant === \"range\" || selectionVariant === \"offset\") {\n const shouldExtractFromList = isMultiselect(props);\n defaultTimezoneDate =\n getStartOrEndDate(selectedDate, shouldExtractFromList) ??\n getStartOrEndDate(defaultSelectedDate, shouldExtractFromList);\n } else if (selectionVariant === \"single\") {\n if (isMultiselect(props)) {\n defaultTimezoneDate =\n (defaultSelectedDate as DateFrameworkType[])?.[0] ?? undefined;\n } else {\n defaultTimezoneDate =\n (selectedDate as DateFrameworkType | null) ??\n (defaultSelectedDate as DateFrameworkType | null);\n }\n }\n if (defaultTimezoneDate) {\n timezone = dateAdapter.getTimezone(defaultTimezoneDate);\n }\n }\n\n let startDateOffset: CalendarOffsetProps[\"startDateOffset\"];\n let endDateOffset: CalendarOffsetProps[\"startDateOffset\"];\n let rest: Partial<typeof props>;\n if (selectionVariant === \"offset\") {\n ({ startDateOffset, endDateOffset, ...rest } =\n propsRest as CalendarOffsetProps);\n } else {\n rest = propsRest;\n }\n const defaultFocusedDateRef = useRef(null);\n\n // biome-ignore lint/suspicious/noExplicitAny: type guard\n const useCalendarProps: any = {\n createAnnouncement,\n selectedDate,\n defaultSelectedDate,\n visibleMonth: visibleMonthProp,\n defaultVisibleMonth,\n onSelectionChange,\n onVisibleMonthChange,\n focusedDate,\n focusedDateRef:\n focusedDateRef !== undefined ? focusedDateRef : defaultFocusedDateRef,\n isDayUnselectable,\n isDayHighlighted,\n multiselect,\n minDate,\n maxDate,\n numberOfVisibleMonths,\n select,\n selectionVariant,\n onFocusedDateChange,\n onHoveredDateChange,\n hideOutOfRangeDates,\n hoveredDate,\n startDateOffset,\n endDateOffset,\n timezone,\n };\n const { state, helpers } = useCalendar(useCalendarProps);\n const calendarLabel = dateAdapter.format(state.visibleMonth, \"MMMM YYYY\");\n\n return (\n <CalendarContext.Provider\n value={{\n state,\n helpers,\n }}\n >\n <div\n className={clsx(withBaseName(), className)}\n role=\"application\"\n aria-label={calendarLabel}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n </CalendarContext.Provider>\n );\n },\n);\n"],"names":["isMultiselect","Calendar","calendarCss"],"mappings":"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"}
|