@salt-ds/lab 1.0.0-alpha.52 → 1.0.0-alpha.53
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/css/salt-lab.css +279 -38
- package/dist-cjs/breadcrumbs/internal/BreadcrumbsCollapsed.js +3 -2
- package/dist-cjs/breadcrumbs/internal/BreadcrumbsCollapsed.js.map +1 -1
- package/dist-cjs/calendar/Calendar.js +55 -26
- package/dist-cjs/calendar/Calendar.js.map +1 -1
- package/dist-cjs/calendar/CalendarDateGrid.css.js +6 -0
- package/dist-cjs/calendar/CalendarDateGrid.css.js.map +1 -0
- package/dist-cjs/calendar/{internal/CalendarCarousel.js → CalendarDateGrid.js} +37 -14
- package/dist-cjs/calendar/CalendarDateGrid.js.map +1 -0
- package/dist-cjs/calendar/CalendarNavigation.js +7 -5
- package/dist-cjs/calendar/CalendarNavigation.js.map +1 -1
- package/dist-cjs/calendar/{internal/CalendarWeekHeader.js → CalendarWeekHeader.js} +4 -3
- package/dist-cjs/calendar/CalendarWeekHeader.js.map +1 -0
- package/dist-cjs/calendar/internal/CalendarDay.css.js +1 -1
- package/dist-cjs/calendar/internal/CalendarMonth.js.map +1 -1
- package/dist-cjs/calendar/useCalendar.js +2 -4
- package/dist-cjs/calendar/useCalendar.js.map +1 -1
- package/dist-cjs/calendar/useCalendarSelection.js +16 -43
- package/dist-cjs/calendar/useCalendarSelection.js.map +1 -1
- package/dist-cjs/carousel/Carousel.js +5 -5
- package/dist-cjs/carousel/Carousel.js.map +1 -1
- package/dist-cjs/cascading-menu/CascadingMenuItem.js +2 -2
- package/dist-cjs/cascading-menu/CascadingMenuItem.js.map +1 -1
- package/dist-cjs/contact-details/ContactMetadata.js +2 -2
- package/dist-cjs/contact-details/ContactMetadata.js.map +1 -1
- package/dist-cjs/date-input/DateInputRange.js +2 -0
- package/dist-cjs/date-input/DateInputRange.js.map +1 -1
- package/dist-cjs/date-input/DateInputSingle.js +2 -0
- package/dist-cjs/date-input/DateInputSingle.js.map +1 -1
- package/dist-cjs/date-picker/DatePicker.js +40 -5
- package/dist-cjs/date-picker/DatePicker.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerActions.js +7 -3
- package/dist-cjs/date-picker/DatePickerActions.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerRangeInput.js +5 -4
- package/dist-cjs/date-picker/DatePickerRangeInput.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerRangePanel.js +33 -9
- package/dist-cjs/date-picker/DatePickerRangePanel.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerSingleInput.js +5 -4
- package/dist-cjs/date-picker/DatePickerSingleInput.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerSinglePanel.js +19 -5
- package/dist-cjs/date-picker/DatePickerSinglePanel.js.map +1 -1
- package/dist-cjs/date-picker/useDatePicker.js +91 -63
- package/dist-cjs/date-picker/useDatePicker.js.map +1 -1
- package/dist-cjs/dropdown/DropdownButton.js +4 -2
- package/dist-cjs/dropdown/DropdownButton.js.map +1 -1
- package/dist-cjs/index.js +10 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/menu-button/MenuButtonTrigger.js +2 -2
- package/dist-cjs/menu-button/MenuButtonTrigger.js.map +1 -1
- package/dist-cjs/query-input/internal/CategoryListItem.js +2 -2
- package/dist-cjs/query-input/internal/CategoryListItem.js.map +1 -1
- package/dist-cjs/query-input/internal/ValueList.js +2 -2
- package/dist-cjs/query-input/internal/ValueList.js.map +1 -1
- package/dist-cjs/search-input/SearchInput.js +2 -1
- package/dist-cjs/search-input/SearchInput.js.map +1 -1
- package/dist-cjs/static-list/StaticList.css.js +6 -0
- package/dist-cjs/static-list/StaticList.css.js.map +1 -0
- package/dist-cjs/static-list/StaticList.js +32 -0
- package/dist-cjs/static-list/StaticList.js.map +1 -0
- package/dist-cjs/static-list/StaticListItem.css.js +6 -0
- package/dist-cjs/static-list/StaticListItem.css.js.map +1 -0
- package/dist-cjs/static-list/StaticListItem.js +33 -0
- package/dist-cjs/static-list/StaticListItem.js.map +1 -0
- package/dist-cjs/static-list/StaticListItemContent.css.js +6 -0
- package/dist-cjs/static-list/StaticListItemContent.css.js.map +1 -0
- package/dist-cjs/static-list/StaticListItemContent.js +30 -0
- package/dist-cjs/static-list/StaticListItemContent.js.map +1 -0
- package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js +8 -8
- package/dist-cjs/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
- package/dist-cjs/stepper-input/StepperInput.css.js +1 -1
- package/dist-cjs/stepper-input/StepperInput.js +214 -29
- package/dist-cjs/stepper-input/StepperInput.js.map +1 -1
- package/dist-cjs/stepper-input/internal/useActivateWhileMouseDown.js +54 -0
- package/dist-cjs/stepper-input/internal/useActivateWhileMouseDown.js.map +1 -0
- package/dist-cjs/stepper-input/internal/utils.js +43 -0
- package/dist-cjs/stepper-input/internal/utils.js.map +1 -0
- package/dist-cjs/stepper-input/useStepperInput.js +88 -172
- package/dist-cjs/stepper-input/useStepperInput.js.map +1 -1
- package/dist-cjs/tabs/Tab.js +14 -12
- package/dist-cjs/tabs/Tab.js.map +1 -1
- package/dist-cjs/tabs/Tabstrip.js +2 -1
- package/dist-cjs/tabs/Tabstrip.js.map +1 -1
- package/dist-cjs/tabs-next/OverflowMenu.js +2 -2
- package/dist-cjs/tabs-next/OverflowMenu.js.map +1 -1
- package/dist-cjs/tokenized-input/TokenizedInputBase.js +3 -3
- package/dist-cjs/tokenized-input/TokenizedInputBase.js.map +1 -1
- package/dist-cjs/tokenized-input/internal/InputPill.js +2 -2
- package/dist-cjs/tokenized-input/internal/InputPill.js.map +1 -1
- package/dist-cjs/tokenized-input-next/TokenizedInputNext.js +3 -3
- package/dist-cjs/tokenized-input-next/TokenizedInputNext.js.map +1 -1
- package/dist-cjs/tokenized-input-next/internal/InputPill.js +2 -2
- package/dist-cjs/tokenized-input-next/internal/InputPill.js.map +1 -1
- package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js +2 -2
- package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
- package/dist-es/breadcrumbs/internal/BreadcrumbsCollapsed.js +3 -2
- package/dist-es/breadcrumbs/internal/BreadcrumbsCollapsed.js.map +1 -1
- package/dist-es/calendar/Calendar.js +57 -28
- package/dist-es/calendar/Calendar.js.map +1 -1
- package/dist-es/calendar/CalendarDateGrid.css.js +4 -0
- package/dist-es/calendar/CalendarDateGrid.css.js.map +1 -0
- package/dist-es/calendar/{internal/CalendarCarousel.js → CalendarDateGrid.js} +37 -14
- package/dist-es/calendar/CalendarDateGrid.js.map +1 -0
- package/dist-es/calendar/CalendarNavigation.js +8 -6
- package/dist-es/calendar/CalendarNavigation.js.map +1 -1
- package/dist-es/calendar/{internal/CalendarWeekHeader.js → CalendarWeekHeader.js} +4 -3
- package/dist-es/calendar/CalendarWeekHeader.js.map +1 -0
- package/dist-es/calendar/internal/CalendarDay.css.js +1 -1
- package/dist-es/calendar/internal/CalendarMonth.js.map +1 -1
- package/dist-es/calendar/useCalendar.js +2 -4
- package/dist-es/calendar/useCalendar.js.map +1 -1
- package/dist-es/calendar/useCalendarSelection.js +16 -43
- package/dist-es/calendar/useCalendarSelection.js.map +1 -1
- package/dist-es/carousel/Carousel.js +6 -6
- package/dist-es/carousel/Carousel.js.map +1 -1
- package/dist-es/cascading-menu/CascadingMenuItem.js +3 -3
- package/dist-es/cascading-menu/CascadingMenuItem.js.map +1 -1
- package/dist-es/contact-details/ContactMetadata.js +3 -3
- package/dist-es/contact-details/ContactMetadata.js.map +1 -1
- package/dist-es/date-input/DateInputRange.js +2 -0
- package/dist-es/date-input/DateInputRange.js.map +1 -1
- package/dist-es/date-input/DateInputSingle.js +2 -0
- package/dist-es/date-input/DateInputSingle.js.map +1 -1
- package/dist-es/date-picker/DatePicker.js +40 -5
- package/dist-es/date-picker/DatePicker.js.map +1 -1
- package/dist-es/date-picker/DatePickerActions.js +7 -3
- package/dist-es/date-picker/DatePickerActions.js.map +1 -1
- package/dist-es/date-picker/DatePickerRangeInput.js +5 -4
- package/dist-es/date-picker/DatePickerRangeInput.js.map +1 -1
- package/dist-es/date-picker/DatePickerRangePanel.js +33 -9
- package/dist-es/date-picker/DatePickerRangePanel.js.map +1 -1
- package/dist-es/date-picker/DatePickerSingleInput.js +5 -4
- package/dist-es/date-picker/DatePickerSingleInput.js.map +1 -1
- package/dist-es/date-picker/DatePickerSinglePanel.js +19 -5
- package/dist-es/date-picker/DatePickerSinglePanel.js.map +1 -1
- package/dist-es/date-picker/useDatePicker.js +92 -64
- package/dist-es/date-picker/useDatePicker.js.map +1 -1
- package/dist-es/dropdown/DropdownButton.js +6 -4
- package/dist-es/dropdown/DropdownButton.js.map +1 -1
- package/dist-es/index.js +5 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/menu-button/MenuButtonTrigger.js +3 -3
- package/dist-es/menu-button/MenuButtonTrigger.js.map +1 -1
- package/dist-es/query-input/internal/CategoryListItem.js +3 -3
- package/dist-es/query-input/internal/CategoryListItem.js.map +1 -1
- package/dist-es/query-input/internal/ValueList.js +3 -3
- package/dist-es/query-input/internal/ValueList.js.map +1 -1
- package/dist-es/search-input/SearchInput.js +3 -2
- package/dist-es/search-input/SearchInput.js.map +1 -1
- package/dist-es/static-list/StaticList.css.js +4 -0
- package/dist-es/static-list/StaticList.css.js.map +1 -0
- package/dist-es/static-list/StaticList.js +28 -0
- package/dist-es/static-list/StaticList.js.map +1 -0
- package/dist-es/static-list/StaticListItem.css.js +4 -0
- package/dist-es/static-list/StaticListItem.css.js.map +1 -0
- package/dist-es/static-list/StaticListItem.js +29 -0
- package/dist-es/static-list/StaticListItem.js.map +1 -0
- package/dist-es/static-list/StaticListItemContent.css.js +4 -0
- package/dist-es/static-list/StaticListItemContent.css.js.map +1 -0
- package/dist-es/static-list/StaticListItemContent.js +26 -0
- package/dist-es/static-list/StaticListItemContent.js.map +1 -0
- package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js +9 -9
- package/dist-es/stepped-tracker/TrackerStep/TrackerStep.js.map +1 -1
- package/dist-es/stepper-input/StepperInput.css.js +1 -1
- package/dist-es/stepper-input/StepperInput.js +216 -31
- package/dist-es/stepper-input/StepperInput.js.map +1 -1
- package/dist-es/stepper-input/internal/useActivateWhileMouseDown.js +50 -0
- package/dist-es/stepper-input/internal/useActivateWhileMouseDown.js.map +1 -0
- package/dist-es/stepper-input/internal/utils.js +32 -0
- package/dist-es/stepper-input/internal/utils.js.map +1 -0
- package/dist-es/stepper-input/useStepperInput.js +88 -172
- package/dist-es/stepper-input/useStepperInput.js.map +1 -1
- package/dist-es/tabs/Tab.js +15 -13
- package/dist-es/tabs/Tab.js.map +1 -1
- package/dist-es/tabs/Tabstrip.js +4 -3
- package/dist-es/tabs/Tabstrip.js.map +1 -1
- package/dist-es/tabs-next/OverflowMenu.js +3 -3
- package/dist-es/tabs-next/OverflowMenu.js.map +1 -1
- package/dist-es/tokenized-input/TokenizedInputBase.js +3 -3
- package/dist-es/tokenized-input/TokenizedInputBase.js.map +1 -1
- package/dist-es/tokenized-input/internal/InputPill.js +2 -2
- package/dist-es/tokenized-input/internal/InputPill.js.map +1 -1
- package/dist-es/tokenized-input-next/TokenizedInputNext.js +3 -3
- package/dist-es/tokenized-input-next/TokenizedInputNext.js.map +1 -1
- package/dist-es/tokenized-input-next/internal/InputPill.js +2 -2
- package/dist-es/tokenized-input-next/internal/InputPill.js.map +1 -1
- package/dist-es/toolbar/overflow-panel/OverflowPanel.js +3 -3
- package/dist-es/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
- package/dist-types/calendar/Calendar.d.ts +2 -15
- package/dist-types/calendar/CalendarDateGrid.d.ts +10 -0
- package/dist-types/calendar/{internal/CalendarWeekHeader.d.ts → CalendarWeekHeader.d.ts} +1 -1
- package/dist-types/calendar/index.d.ts +2 -0
- package/dist-types/calendar/internal/CalendarMonth.d.ts +9 -1
- package/dist-types/calendar/useCalendarSelection.d.ts +0 -7
- package/dist-types/date-picker/DatePickerRangePanel.d.ts +17 -1
- package/dist-types/date-picker/DatePickerSinglePanel.d.ts +9 -1
- package/dist-types/index.d.ts +1 -0
- package/dist-types/static-list/StaticList.d.ts +8 -0
- package/dist-types/static-list/StaticListItem.d.ts +4 -0
- package/dist-types/static-list/StaticListItemContent.d.ts +8 -0
- package/dist-types/static-list/index.d.ts +3 -0
- package/dist-types/stepper-input/StepperInput.d.ts +66 -19
- package/dist-types/stepper-input/internal/useActivateWhileMouseDown.d.ts +5 -0
- package/dist-types/stepper-input/internal/utils.d.ts +8 -0
- package/dist-types/stepper-input/useStepperInput.d.ts +21 -8
- package/package.json +2 -2
- package/dist-cjs/calendar/internal/CalendarCarousel.css.js +0 -6
- package/dist-cjs/calendar/internal/CalendarCarousel.css.js.map +0 -1
- package/dist-cjs/calendar/internal/CalendarCarousel.js.map +0 -1
- package/dist-cjs/calendar/internal/CalendarWeekHeader.js.map +0 -1
- package/dist-cjs/stepper-input/internal/useSpinner.js +0 -33
- package/dist-cjs/stepper-input/internal/useSpinner.js.map +0 -1
- package/dist-es/calendar/internal/CalendarCarousel.css.js +0 -4
- package/dist-es/calendar/internal/CalendarCarousel.css.js.map +0 -1
- package/dist-es/calendar/internal/CalendarCarousel.js.map +0 -1
- package/dist-es/calendar/internal/CalendarWeekHeader.js.map +0 -1
- package/dist-es/stepper-input/internal/useSpinner.js +0 -29
- package/dist-es/stepper-input/internal/useSpinner.js.map +0 -1
- package/dist-types/calendar/internal/CalendarCarousel.d.ts +0 -3
- package/dist-types/stepper-input/internal/useSpinner.d.ts +0 -5
- /package/dist-cjs/calendar/{internal/CalendarWeekHeader.css.js → CalendarWeekHeader.css.js} +0 -0
- /package/dist-cjs/calendar/{internal/CalendarWeekHeader.css.js.map → CalendarWeekHeader.css.js.map} +0 -0
- /package/dist-es/calendar/{internal/CalendarWeekHeader.css.js → CalendarWeekHeader.css.js} +0 -0
- /package/dist-es/calendar/{internal/CalendarWeekHeader.css.js.map → CalendarWeekHeader.css.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInputRange.js","sources":["../src/date-input/DateInputRange.tsx"],"sourcesContent":["import { type DateValue, getLocalTimeZone } from \"@internationalized/date\";\nimport {\n type InputProps,\n StatusAdornment,\n makePrefixer,\n useControlled,\n useForkRef,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ChangeEventHandler,\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n type InputHTMLAttributes,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type ReactNode,\n type Ref,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n type DateRangeSelection,\n formatDate as defaultFormatDate,\n getCurrentLocale,\n} from \"../calendar\";\nimport dateInputCss from \"./DateInput.css\";\nimport type { DateInputSingleParserError } from \"./DateInputSingle\";\nimport {\n type RangeTimeFields,\n extractTimeFieldsFromDateRange,\n parseCalendarDate,\n} from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\n\n/**\n * Date error produced by DateInputRange parser.\n */\nexport type DateInputRangeParserError = string | false;\n\n/**\n * DateInputRange raw value or null if no date is defined.\n */\nexport type DateInputRangeValue = {\n startDate?: string | null;\n endDate?: string | null;\n};\n\n/**\n * Return value of DateInputRange parser.\n * @template T\n */\nexport interface DateInputRangeParserResult<T = DateValue | null> {\n /**\n * The parsed date value.\n */\n date: T;\n /**\n * The error encountered during parsing, if any.\n */\n error: DateInputRangeParserError;\n}\n\n/**\n * Date Range error returned with selected date to indicate invalid dates.\n */\nexport type DateInputRangeError = {\n /**\n * The error for the start date.\n */\n startDate: DateInputSingleParserError;\n /**\n * The error for the end date.\n */\n endDate: DateInputSingleParserError;\n};\n\n/**\n * Props for the DateInputRange component.\n * @template T\n */\nexport interface DateInputRangeProps<T = DateRangeSelection>\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\" | \"onChange\">,\n Omit<InputProps, \"defaultValue\" | \"inputRef\" | \"value\" | \"onChange\"> {\n /**\n * The aria-label for accessibility.\n */\n ariaLabel?: string;\n /**\n * Styling variant with full border. Defaults to false.\n */\n bordered?: boolean;\n /**\n * The marker to use in an empty read-only DateInput.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component.\n */\n endAdornment?: ReactNode;\n /**\n * Attributes applied to the start `input` element.\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n */\n startInputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * Attributes applied to the end `input` element.\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n */\n endInputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * If `true`, the component is read-only.\n */\n readOnly?: boolean;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Function to format the input value.\n */\n format?: (date: DateValue | null) => string;\n /**\n * Optional ref for the start input component.\n */\n startInputRef?: Ref<HTMLInputElement>;\n /**\n * Optional ref for the end input component.\n */\n endInputRef?: Ref<HTMLInputElement>;\n /**\n * Input value. Use when the input value is controlled.\n */\n value?: DateInputRangeValue;\n /**\n * The initial input value. Use when the component is uncontrolled.\n */\n defaultValue?: DateInputRangeValue;\n /**\n * The date value. Use when the component is controlled.\n */\n date?: T | null;\n /**\n * The initial selected date value. Use when the component is uncontrolled.\n */\n defaultDate?: T | null;\n /**\n * Callback fired when the input value changes.\n * @param event - The change event.\n * @param date - The new date input range value.\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n date: DateInputRangeValue,\n ) => void;\n /**\n * Callback fired when the selected date changes.\n * @param event - The synthetic event.\n * @param date - The new date value.\n * @param error - The date input range error.\n */\n onDateChange?: (\n event: SyntheticEvent,\n date: T | null,\n error: DateInputRangeError,\n ) => void;\n /**\n * Called when input values change, either due to user interaction or programmatic formatting of valid dates.\n * @param newValue - The new date input range value.\n * @param isFormatted - Whether the value is formatted.\n */\n onDateValueChange?: (\n newValue: DateInputRangeValue,\n isFormatted: boolean,\n ) => void;\n /**\n * Function to parse date string to valid `DateValue` or null, if invalid.\n * @param inputDate - The input date string.\n * @returns The result of the date input range parser.\n */\n parse?: (inputDate: string) => DateInputRangeParserResult;\n /**\n * Locale of the entered date.\n */\n locale?: string;\n /**\n * Timezone of the entered date.\n */\n timeZone?: string;\n}\n\nexport const DateInputRange = forwardRef<HTMLDivElement, DateInputRangeProps>(\n function DateInputRange(props, ref) {\n const {\n bordered = false,\n className,\n disabled,\n \"aria-label\": ariaLabel,\n date: dateProp,\n defaultDate = {},\n onDateChange,\n value: valueProp,\n defaultValue = { startDate: \"\", endDate: \"\" },\n onChange,\n onClick,\n onDateValueChange,\n emptyReadOnlyMarker = \"—\",\n endAdornment,\n format: formatProp,\n startInputProps = {},\n endInputProps = {},\n startInputRef: startInputRefProp,\n endInputRef: endInputRefProp,\n parse = parseCalendarDate,\n placeholder = \"dd mmm yyyy\",\n readOnly: readOnlyProp,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n locale = getCurrentLocale(),\n timeZone = getLocalTimeZone(),\n ...rest\n } = props;\n const wrapperRef = useRef(null);\n const handleWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const lastError = useRef<{\n startDate: DateInputRangeParserError;\n endDate: DateInputRangeParserError;\n }>({\n startDate: false,\n endDate: false,\n });\n\n const startInputRef = useRef<HTMLInputElement>(null);\n const handleStartInputRef = useForkRef(startInputRef, startInputRefProp);\n const endInputRef = useRef<HTMLInputElement>(null);\n const handleEndInputRef = useForkRef(endInputRef, endInputRefProp);\n\n const startInputID = useId();\n const endInputID = useId();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-input-range\",\n css: dateInputCss,\n window: targetWindow,\n });\n\n const [date, setDate] = useControlled({\n controlled: dateProp,\n default: defaultDate,\n name: \"DateInputRange\",\n state: \"date\",\n });\n const [dateValue, setDateValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DateInputRange\",\n state: \"dateValue\",\n });\n\n const preservedTime = useRef<RangeTimeFields>({});\n preservedTime.current = extractTimeFieldsFromDateRange(date);\n\n const format = useCallback(\n (date: DateValue | null) => {\n return formatProp\n ? formatProp(date)\n : defaultFormatDate(date, locale, { timeZone });\n },\n [formatProp, locale, timeZone],\n );\n\n const setDateValueFromDate = (newDate: DateInputRangeProps[\"date\"]) => {\n let newDateValue = { ...dateValue };\n const formattedStartDate = format(newDate?.startDate ?? null);\n if (formattedStartDate) {\n newDateValue = { ...newDateValue, startDate: formattedStartDate };\n }\n const formattedEndDate = format(newDate?.endDate ?? null);\n if (formattedEndDate) {\n newDateValue = { ...newDateValue, endDate: formattedEndDate };\n }\n if (\n newDateValue?.startDate !== dateValue?.startDate ||\n newDateValue?.endDate !== dateValue?.endDate\n ) {\n onDateValueChange?.(newDateValue, true);\n }\n setDateValue(newDateValue);\n };\n\n // Update date string value when selected date changes\n useEffect(() => {\n setDateValueFromDate(date);\n }, [date, date?.startDate, date?.endDate]);\n\n const [focused, setFocused] = useState(false);\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const isDisabled = disabled || formFieldDisabled;\n\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const {\n \"aria-describedby\": startInputPropsDescribedBy,\n \"aria-labelledby\": startInputPropsLabelledBy,\n onBlur: startInputPropsOnBlur,\n onChange: startInputPropsOnChange,\n onKeyDown: startInputPropsOnKeyDown,\n onFocus: startInputPropsOnFocus,\n required: startInputPropsRequired,\n ...restStartInputProps\n } = startInputProps;\n\n const startInputIsRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : startInputPropsRequired;\n\n const {\n \"aria-describedby\": endInputPropsDescribedBy,\n \"aria-labelledby\": endInputPropsLabelledBy,\n onBlur: endInputPropsOnBlur,\n onChange: endInputPropsOnChange,\n onKeyDown: endInputPropsOnKeyDown,\n onFocus: endInputPropsOnFocus,\n required: endInputPropsRequired,\n ...restEndInputProps\n } = endInputProps;\n\n const endInputIsRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : endInputPropsRequired;\n\n const apply = (event: SyntheticEvent) => {\n const { date: newStartDate, error: startDateError } = parse(\n dateValue.startDate ?? \"\",\n );\n const { date: newEndDate, error: endDateError } = parse(\n dateValue.endDate || \"\",\n );\n\n const hasDateChanged = (\n newDate: DateValue | null,\n oldDate: DateValue | null,\n ): boolean => {\n if (newDate && oldDate) {\n return newDate.compare(oldDate) !== 0;\n }\n return newDate !== oldDate;\n };\n\n const createNewDateRange = (\n startDate: DateValue | null,\n endDate: DateValue | null,\n ): DateRangeSelection | null => {\n if (!startDate && !endDate) {\n return null;\n }\n\n const dateRange: DateRangeSelection = {};\n dateRange.startDate = startDate;\n dateRange.endDate = endDate;\n\n return dateRange;\n };\n\n const hasStartDateChanged = hasDateChanged(\n newStartDate,\n date?.startDate || null,\n );\n const hasEndDateChanged = hasDateChanged(\n newEndDate,\n date?.endDate || null,\n );\n const hasStartOrEndDateChanged = hasStartDateChanged || hasEndDateChanged;\n\n const newDate: DateRangeSelection | null = createNewDateRange(\n newStartDate,\n newEndDate,\n );\n\n if (newDate?.startDate || newDate?.endDate) {\n setDateValueFromDate(newDate);\n }\n\n if (hasStartOrEndDateChanged) {\n setDate(newDate);\n if (newDate?.startDate && preservedTime.current.startTime) {\n newDate.startDate = newDate.startDate.set(\n preservedTime.current.startTime,\n );\n }\n if (newDate?.endDate && preservedTime.current.endTime) {\n newDate.endDate = newDate.endDate.set(preservedTime.current.endTime);\n }\n }\n const error = {\n startDate: startDateError,\n endDate: endDateError,\n };\n if (\n hasStartOrEndDateChanged ||\n lastError.current.startDate !== error.startDate ||\n lastError.current.endDate !== error.endDate\n ) {\n const error = {\n startDate: startDateError,\n endDate: endDateError,\n };\n onDateChange?.(event, newDate, error);\n lastError.current = error;\n }\n };\n\n const handleStartInputChange: ChangeEventHandler<HTMLInputElement> = (\n event,\n ) => {\n const newDateValue = { ...dateValue, startDate: event.target.value };\n setDateValue(newDateValue);\n startInputPropsOnChange?.(event);\n onChange?.(event, newDateValue);\n onDateValueChange?.(newDateValue, false);\n };\n\n const handleEndInputChange: ChangeEventHandler<HTMLInputElement> = (\n event,\n ) => {\n const newDateValue = { ...dateValue, endDate: event.target.value };\n setDateValue(newDateValue);\n endInputPropsOnChange?.(event);\n onChange?.(event, newDateValue);\n onDateValueChange?.(newDateValue, false);\n };\n\n const handleStartInputFocus: FocusEventHandler<HTMLInputElement> = (\n event,\n ) => {\n setFocused(true);\n startInputPropsOnFocus?.(event);\n };\n\n const handleEndInputFocus: FocusEventHandler<HTMLInputElement> = (\n event,\n ) => {\n setFocused(true);\n endInputPropsOnFocus?.(event);\n };\n\n const handleStartInputBlur: FocusEventHandler<HTMLInputElement> = (\n event,\n ) => {\n setFocused(false);\n apply(event);\n startInputPropsOnBlur?.(event);\n };\n\n const handleEndInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(false);\n apply(event);\n endInputPropsOnBlur?.(event);\n };\n\n const handleStartInputKeyDown: KeyboardEventHandler<HTMLInputElement> = (\n event,\n ) => {\n if (event.key === \"Enter\") {\n apply(event);\n }\n startInputPropsOnKeyDown?.(event);\n };\n\n const handleEndInputKeyDown: KeyboardEventHandler<HTMLInputElement> = (\n event,\n ) => {\n if (event.key === \"Enter\") {\n apply(event);\n }\n endInputPropsOnKeyDown?.(event);\n };\n\n const handleWrapperClick: MouseEventHandler<HTMLDivElement> = (event) => {\n if (event.target === wrapperRef.current) {\n const input = startInputRef.current;\n input?.focus();\n input?.setSelectionRange(input.value.length, input.value.length);\n }\n onClick?.(event);\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus ?? \"\")]: validationStatus,\n [withBaseName(\"bordered\")]: bordered,\n },\n className,\n )}\n ref={handleWrapperRef}\n onClick={handleWrapperClick}\n {...rest}\n >\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(\n formFieldDescribedBy,\n startInputPropsDescribedBy,\n )}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n startInputPropsLabelledBy,\n startInputID,\n )}\n aria-label={clsx(\"Start date\", ariaLabel)}\n id={startInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={handleStartInputRef}\n tabIndex={isDisabled ? -1 : 0}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !dateValue?.startDate\n ? emptyReadOnlyMarker\n : (dateValue.startDate ?? \"\")\n }\n {...restStartInputProps}\n onBlur={handleStartInputBlur}\n onChange={handleStartInputChange}\n onKeyDown={handleStartInputKeyDown}\n onFocus={!isDisabled ? handleStartInputFocus : undefined}\n required={startInputIsRequired}\n />\n <span>-</span>\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(\n formFieldDescribedBy,\n endInputPropsDescribedBy,\n )}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n endInputPropsLabelledBy,\n endInputID,\n )}\n aria-label={clsx(\"End date\", ariaLabel)}\n id={endInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={handleEndInputRef}\n tabIndex={isDisabled ? -1 : 0}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !dateValue?.endDate\n ? emptyReadOnlyMarker\n : (dateValue.endDate ?? \"\")\n }\n {...restEndInputProps}\n onBlur={handleEndInputBlur}\n onChange={handleEndInputChange}\n onKeyDown={handleEndInputKeyDown}\n onFocus={!isDisabled ? handleEndInputFocus : undefined}\n required={endInputIsRequired}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment}\n </div>\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n },\n);\n"],"names":["DateInputRange","dateInputCss","date","defaultFormatDate","_a","_b","newDate","error"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DateInputRange.js","sources":["../src/date-input/DateInputRange.tsx"],"sourcesContent":["import { type DateValue, getLocalTimeZone } from \"@internationalized/date\";\nimport {\n type InputProps,\n StatusAdornment,\n makePrefixer,\n useControlled,\n useForkRef,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type ChangeEventHandler,\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n type InputHTMLAttributes,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type ReactNode,\n type Ref,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n type DateRangeSelection,\n formatDate as defaultFormatDate,\n getCurrentLocale,\n} from \"../calendar\";\nimport dateInputCss from \"./DateInput.css\";\nimport type { DateInputSingleParserError } from \"./DateInputSingle\";\nimport {\n type RangeTimeFields,\n extractTimeFieldsFromDateRange,\n parseCalendarDate,\n} from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\n\n/**\n * Date error produced by DateInputRange parser.\n */\nexport type DateInputRangeParserError = string | false;\n\n/**\n * DateInputRange raw value or null if no date is defined.\n */\nexport type DateInputRangeValue = {\n startDate?: string | null;\n endDate?: string | null;\n};\n\n/**\n * Return value of DateInputRange parser.\n * @template T\n */\nexport interface DateInputRangeParserResult<T = DateValue | null> {\n /**\n * The parsed date value.\n */\n date: T;\n /**\n * The error encountered during parsing, if any.\n */\n error: DateInputRangeParserError;\n}\n\n/**\n * Date Range error returned with selected date to indicate invalid dates.\n */\nexport type DateInputRangeError = {\n /**\n * The error for the start date.\n */\n startDate: DateInputSingleParserError;\n /**\n * The error for the end date.\n */\n endDate: DateInputSingleParserError;\n};\n\n/**\n * Props for the DateInputRange component.\n * @template T\n */\nexport interface DateInputRangeProps<T = DateRangeSelection>\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\" | \"onChange\">,\n Omit<InputProps, \"defaultValue\" | \"inputRef\" | \"value\" | \"onChange\"> {\n /**\n * The aria-label for accessibility.\n */\n ariaLabel?: string;\n /**\n * Styling variant with full border. Defaults to false.\n */\n bordered?: boolean;\n /**\n * The marker to use in an empty read-only DateInput.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component.\n */\n endAdornment?: ReactNode;\n /**\n * Attributes applied to the start `input` element.\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n */\n startInputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * Attributes applied to the end `input` element.\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n */\n endInputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * If `true`, the component is read-only.\n */\n readOnly?: boolean;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Function to format the input value.\n */\n format?: (date: DateValue | null) => string;\n /**\n * Optional ref for the start input component.\n */\n startInputRef?: Ref<HTMLInputElement>;\n /**\n * Optional ref for the end input component.\n */\n endInputRef?: Ref<HTMLInputElement>;\n /**\n * Input value. Use when the input value is controlled.\n */\n value?: DateInputRangeValue;\n /**\n * The initial input value. Use when the component is uncontrolled.\n */\n defaultValue?: DateInputRangeValue;\n /**\n * The date value. Use when the component is controlled.\n */\n date?: T | null;\n /**\n * The initial selected date value. Use when the component is uncontrolled.\n */\n defaultDate?: T | null;\n /**\n * Callback fired when the input value changes.\n * @param event - The change event.\n * @param date - The new date input range value.\n */\n onChange?: (\n event: ChangeEvent<HTMLInputElement>,\n date: DateInputRangeValue,\n ) => void;\n /**\n * Callback fired when the selected date changes.\n * @param event - The synthetic event.\n * @param date - The new date value.\n * @param error - The date input range error.\n */\n onDateChange?: (\n event: SyntheticEvent,\n date: T | null,\n error: DateInputRangeError,\n ) => void;\n /**\n * Called when input values change, either due to user interaction or programmatic formatting of valid dates.\n * @param newValue - The new date input range value.\n * @param isFormatted - Whether the value is formatted.\n */\n onDateValueChange?: (\n newValue: DateInputRangeValue,\n isFormatted: boolean,\n ) => void;\n /**\n * Function to parse date string to valid `DateValue` or null, if invalid.\n * @param inputDate - The input date string.\n * @returns The result of the date input range parser.\n */\n parse?: (inputDate: string) => DateInputRangeParserResult;\n /**\n * Locale of the entered date.\n */\n locale?: string;\n /**\n * Timezone of the entered date.\n */\n timeZone?: string;\n}\n\nexport const DateInputRange = forwardRef<HTMLDivElement, DateInputRangeProps>(\n function DateInputRange(props, ref) {\n const {\n bordered = false,\n className,\n disabled,\n \"aria-label\": ariaLabel,\n date: dateProp,\n defaultDate = {},\n onDateChange,\n value: valueProp,\n defaultValue = { startDate: \"\", endDate: \"\" },\n onChange,\n onClick,\n onDateValueChange,\n emptyReadOnlyMarker = \"—\",\n endAdornment,\n format: formatProp,\n startInputProps = {},\n endInputProps = {},\n startInputRef: startInputRefProp,\n endInputRef: endInputRefProp,\n parse = parseCalendarDate,\n placeholder = \"dd mmm yyyy\",\n readOnly: readOnlyProp,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n locale = getCurrentLocale(),\n timeZone = getLocalTimeZone(),\n ...rest\n } = props;\n const wrapperRef = useRef(null);\n const handleWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const lastError = useRef<{\n startDate: DateInputRangeParserError;\n endDate: DateInputRangeParserError;\n }>({\n startDate: false,\n endDate: false,\n });\n\n const startInputRef = useRef<HTMLInputElement>(null);\n const handleStartInputRef = useForkRef(startInputRef, startInputRefProp);\n const endInputRef = useRef<HTMLInputElement>(null);\n const handleEndInputRef = useForkRef(endInputRef, endInputRefProp);\n\n const startInputID = useId();\n const endInputID = useId();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-input-range\",\n css: dateInputCss,\n window: targetWindow,\n });\n\n const [date, setDate] = useControlled({\n controlled: dateProp,\n default: defaultDate,\n name: \"DateInputRange\",\n state: \"date\",\n });\n const [dateValue, setDateValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DateInputRange\",\n state: \"dateValue\",\n });\n\n const preservedTime = useRef<RangeTimeFields>({});\n preservedTime.current = extractTimeFieldsFromDateRange(date);\n\n const format = useCallback(\n (date: DateValue | null) => {\n return formatProp\n ? formatProp(date)\n : defaultFormatDate(date, locale, { timeZone });\n },\n [formatProp, locale, timeZone],\n );\n\n const setDateValueFromDate = (newDate: DateInputRangeProps[\"date\"]) => {\n let newDateValue = { ...dateValue };\n const formattedStartDate = format(newDate?.startDate ?? null);\n if (formattedStartDate) {\n newDateValue = { ...newDateValue, startDate: formattedStartDate };\n }\n const formattedEndDate = format(newDate?.endDate ?? null);\n if (formattedEndDate) {\n newDateValue = { ...newDateValue, endDate: formattedEndDate };\n }\n if (\n newDateValue?.startDate !== dateValue?.startDate ||\n newDateValue?.endDate !== dateValue?.endDate\n ) {\n onDateValueChange?.(newDateValue, true);\n }\n setDateValue(newDateValue);\n };\n\n // Update date string value when selected date changes\n useEffect(() => {\n setDateValueFromDate(date);\n }, [date, date?.startDate, date?.endDate]);\n\n const [focused, setFocused] = useState(false);\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const isDisabled = disabled || formFieldDisabled;\n\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const {\n \"aria-describedby\": startInputPropsDescribedBy,\n \"aria-labelledby\": startInputPropsLabelledBy,\n onBlur: startInputPropsOnBlur,\n onChange: startInputPropsOnChange,\n onKeyDown: startInputPropsOnKeyDown,\n onFocus: startInputPropsOnFocus,\n required: startInputPropsRequired,\n ...restStartInputProps\n } = startInputProps;\n\n const startInputIsRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : startInputPropsRequired;\n\n const {\n \"aria-describedby\": endInputPropsDescribedBy,\n \"aria-labelledby\": endInputPropsLabelledBy,\n onBlur: endInputPropsOnBlur,\n onChange: endInputPropsOnChange,\n onKeyDown: endInputPropsOnKeyDown,\n onFocus: endInputPropsOnFocus,\n required: endInputPropsRequired,\n ...restEndInputProps\n } = endInputProps;\n\n const endInputIsRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : endInputPropsRequired;\n\n const apply = (event: SyntheticEvent) => {\n const { date: newStartDate, error: startDateError } = parse(\n dateValue.startDate ?? \"\",\n );\n const { date: newEndDate, error: endDateError } = parse(\n dateValue.endDate || \"\",\n );\n\n const hasDateChanged = (\n newDate: DateValue | null,\n oldDate: DateValue | null,\n ): boolean => {\n if (newDate && oldDate) {\n return newDate.compare(oldDate) !== 0;\n }\n return newDate !== oldDate;\n };\n\n const createNewDateRange = (\n startDate: DateValue | null,\n endDate: DateValue | null,\n ): DateRangeSelection | null => {\n if (!startDate && !endDate) {\n return null;\n }\n\n const dateRange: DateRangeSelection = {};\n dateRange.startDate = startDate;\n dateRange.endDate = endDate;\n\n return dateRange;\n };\n\n const hasStartDateChanged = hasDateChanged(\n newStartDate,\n date?.startDate || null,\n );\n const hasEndDateChanged = hasDateChanged(\n newEndDate,\n date?.endDate || null,\n );\n const hasStartOrEndDateChanged = hasStartDateChanged || hasEndDateChanged;\n\n const newDate: DateRangeSelection | null = createNewDateRange(\n newStartDate,\n newEndDate,\n );\n\n if (newDate?.startDate || newDate?.endDate) {\n setDateValueFromDate(newDate);\n }\n\n if (hasStartOrEndDateChanged) {\n setDate(newDate);\n if (newDate?.startDate && preservedTime.current.startTime) {\n newDate.startDate = newDate.startDate.set(\n preservedTime.current.startTime,\n );\n }\n if (newDate?.endDate && preservedTime.current.endTime) {\n newDate.endDate = newDate.endDate.set(preservedTime.current.endTime);\n }\n }\n const error = {\n startDate: startDateError,\n endDate: endDateError,\n };\n if (\n hasStartOrEndDateChanged ||\n lastError.current.startDate !== error.startDate ||\n lastError.current.endDate !== error.endDate\n ) {\n const error = {\n startDate: startDateError,\n endDate: endDateError,\n };\n onDateChange?.(event, newDate, error);\n lastError.current = error;\n }\n };\n\n const handleStartInputChange: ChangeEventHandler<HTMLInputElement> = (\n event,\n ) => {\n const newDateValue = { ...dateValue, startDate: event.target.value };\n setDateValue(newDateValue);\n startInputPropsOnChange?.(event);\n onChange?.(event, newDateValue);\n onDateValueChange?.(newDateValue, false);\n };\n\n const handleEndInputChange: ChangeEventHandler<HTMLInputElement> = (\n event,\n ) => {\n const newDateValue = { ...dateValue, endDate: event.target.value };\n setDateValue(newDateValue);\n endInputPropsOnChange?.(event);\n onChange?.(event, newDateValue);\n onDateValueChange?.(newDateValue, false);\n };\n\n const handleStartInputFocus: FocusEventHandler<HTMLInputElement> = (\n event,\n ) => {\n setFocused(true);\n startInputPropsOnFocus?.(event);\n };\n\n const handleEndInputFocus: FocusEventHandler<HTMLInputElement> = (\n event,\n ) => {\n setFocused(true);\n endInputPropsOnFocus?.(event);\n };\n\n const handleStartInputBlur: FocusEventHandler<HTMLInputElement> = (\n event,\n ) => {\n setFocused(false);\n apply(event);\n startInputPropsOnBlur?.(event);\n };\n\n const handleEndInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(false);\n apply(event);\n endInputPropsOnBlur?.(event);\n };\n\n const handleStartInputKeyDown: KeyboardEventHandler<HTMLInputElement> = (\n event,\n ) => {\n if (event.key === \"Enter\") {\n apply(event);\n }\n startInputPropsOnKeyDown?.(event);\n };\n\n const handleEndInputKeyDown: KeyboardEventHandler<HTMLInputElement> = (\n event,\n ) => {\n if (event.key === \"Enter\") {\n apply(event);\n }\n endInputPropsOnKeyDown?.(event);\n };\n\n const handleWrapperClick: MouseEventHandler<HTMLDivElement> = (event) => {\n if (event.target === wrapperRef.current) {\n const input = startInputRef.current;\n input?.focus();\n input?.setSelectionRange(input.value.length, input.value.length);\n }\n onClick?.(event);\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus ?? \"\")]: validationStatus,\n [withBaseName(\"bordered\")]: bordered,\n },\n className,\n )}\n ref={handleWrapperRef}\n onClick={handleWrapperClick}\n {...rest}\n >\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(\n formFieldDescribedBy,\n startInputPropsDescribedBy,\n )}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n startInputPropsLabelledBy,\n startInputID,\n )}\n aria-label={clsx(\"Start date\", ariaLabel)}\n id={startInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={handleStartInputRef}\n tabIndex={isDisabled ? -1 : 0}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !dateValue?.startDate\n ? emptyReadOnlyMarker\n : (dateValue.startDate ?? \"\")\n }\n {...restStartInputProps}\n onBlur={handleStartInputBlur}\n onChange={handleStartInputChange}\n onKeyDown={handleStartInputKeyDown}\n onFocus={!isDisabled ? handleStartInputFocus : undefined}\n required={startInputIsRequired}\n />\n <span>-</span>\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(\n formFieldDescribedBy,\n endInputPropsDescribedBy,\n )}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n endInputPropsLabelledBy,\n endInputID,\n )}\n aria-label={clsx(\"End date\", ariaLabel)}\n id={endInputID}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={handleEndInputRef}\n tabIndex={isDisabled ? -1 : 0}\n placeholder={placeholder}\n size={placeholder.length}\n value={\n isReadOnly && !dateValue?.endDate\n ? emptyReadOnlyMarker\n : (dateValue.endDate ?? \"\")\n }\n {...restEndInputProps}\n onBlur={handleEndInputBlur}\n onChange={handleEndInputChange}\n onKeyDown={handleEndInputKeyDown}\n onFocus={!isDisabled ? handleEndInputFocus : undefined}\n required={endInputIsRequired}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment}\n </div>\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n },\n);\n"],"names":["DateInputRange","dateInputCss","date","defaultFormatDate","_a","_b","newDate","error"],"mappings":"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"}
|
|
@@ -7,6 +7,8 @@ import { clsx } from 'clsx';
|
|
|
7
7
|
import { forwardRef, useRef, useCallback, useEffect, useState } from 'react';
|
|
8
8
|
import '../calendar/Calendar.js';
|
|
9
9
|
import '../calendar/CalendarNavigation.js';
|
|
10
|
+
import '../calendar/CalendarWeekHeader.js';
|
|
11
|
+
import '../calendar/CalendarDateGrid.js';
|
|
10
12
|
import '../calendar/internal/CalendarContext.js';
|
|
11
13
|
import { getCurrentLocale, formatDate } from '../calendar/formatDate.js';
|
|
12
14
|
import '../calendar/useCalendarSelection.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInputSingle.js","sources":["../src/date-input/DateInputSingle.tsx"],"sourcesContent":["import {\n type DateValue,\n type TimeFields,\n getLocalTimeZone,\n} from \"@internationalized/date\";\nimport {\n StatusAdornment,\n makePrefixer,\n useControlled,\n useForkRef,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n type InputHTMLAttributes,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type ReactNode,\n type RefObject,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n type SingleDateSelection,\n formatDate as defaultFormatDate,\n getCurrentLocale,\n} from \"../calendar\";\nimport dateInputCss from \"./DateInput.css\";\nimport { extractTimeFieldsFromDate, parseCalendarDate } from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\n\n/**\n * Date error produced by DateInputSingle parser.\n */\nexport type DateInputSingleParserError = string | false;\n\n/**\n * Date error produced by DateInputSingle parser.\n */\nexport type DateInputSingleError = DateInputSingleParserError;\n\n/**\n * Return value of DateInputSingle parser.\n * @template T\n */\nexport interface DateInputSingleParserResult<T = DateValue | null> {\n /**\n * The parsed date value.\n */\n date: T;\n /**\n * The error encountered during parsing, if any.\n */\n error: DateInputSingleParserError;\n}\n\n/**\n * Props for the DateInputSingle component.\n * @template T\n */\nexport interface DateInputSingleProps<T = SingleDateSelection>\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n Pick<\n ComponentPropsWithoutRef<\"input\">,\n \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n > {\n /**\n * The aria-label for accessibility.\n */\n ariaLabel?: string;\n /**\n * Styling variant with full border. Defaults to false.\n */\n bordered?: boolean;\n /**\n * The marker to use in an empty read-only DateInput.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component.\n */\n endAdornment?: ReactNode;\n /**\n * Attributes applied to the `input` element.\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * If `true`, the component is read-only.\n */\n readOnly?: boolean;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Function to format the input value.\n */\n format?: (date: DateValue | null) => string;\n /**\n * Reference for the input.\n */\n inputRef?: RefObject<HTMLInputElement>;\n /**\n * Input value. Use when the input value is controlled.\n */\n value?: string;\n /**\n * The initial input value. Use when the component is uncontrolled.\n */\n defaultValue?: string;\n /**\n * The date value. Use when the component is controlled.\n */\n date?: T | null;\n /**\n * The initial selected date value. Use when the component is uncontrolled.\n */\n defaultDate?: T | null;\n /**\n * Callback fired when the selected date changes.\n * @param event - The synthetic event.\n * @param date - The new date value.\n * @param error - The date input single error.\n */\n onDateChange?: (\n event: SyntheticEvent,\n date: T | null,\n error: DateInputSingleError,\n ) => void;\n /**\n * Function to parse date string to valid `DateValue` or null, if invalid or empty.\n * @param inputDate - The input date string.\n * @returns The result of the date input single parser.\n */\n parse?: (inputDate: string) => DateInputSingleParserResult;\n /**\n * Called when input value changes, either due to user interaction or programmatic formatting of valid dates.\n * @param newValue - The new date input value.\n * @param isFormatted - Whether the value is formatted.\n */\n onDateValueChange?: (newValue: string, isFormatted: boolean) => void;\n /**\n * Locale of the entered date.\n */\n locale?: string;\n /**\n * Timezone of the entered date.\n */\n timeZone?: string;\n}\nexport const DateInputSingle = forwardRef<HTMLDivElement, DateInputSingleProps>(\n function DateInput(props, ref) {\n const {\n bordered = false,\n className,\n disabled,\n \"aria-label\": ariaLabel,\n date: dateProp,\n defaultDate,\n onDateChange,\n value: valueProp,\n defaultValue = \"\",\n onChange,\n onClick,\n emptyReadOnlyMarker = \"—\",\n endAdornment,\n format: formatProp,\n inputProps = {},\n inputRef: inputRefProp = null,\n parse = parseCalendarDate,\n placeholder = \"dd mmm yyyy\",\n readOnly: readOnlyProp,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n onDateValueChange,\n locale = getCurrentLocale(),\n timeZone = getLocalTimeZone(),\n ...rest\n } = props;\n const wrapperRef = useRef(null);\n const lastError = useRef<string | false>(false);\n const handleWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const innerInputRef = useRef<HTMLInputElement>(null);\n const handleInputRef = useForkRef<HTMLInputElement>(\n innerInputRef,\n inputRefProp,\n );\n\n const inputId = useId();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-input-single\",\n css: dateInputCss,\n window: targetWindow,\n });\n\n const [date, setDate] = useControlled({\n controlled: dateProp,\n default: defaultDate,\n name: \"DateInputSingle\",\n state: \"date\",\n });\n const [dateValue, setDateValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DateInputSingle\",\n state: \"dateValue\",\n });\n const preservedTime = useRef<TimeFields | undefined>(\n extractTimeFieldsFromDate(date || null),\n );\n\n const format = useCallback(\n (date: DateValue | null) => {\n return formatProp\n ? formatProp(date)\n : defaultFormatDate(date, locale, { timeZone });\n },\n [formatProp, locale, timeZone],\n );\n\n // Update date string value when selected date changes\n useEffect(() => {\n const formattedDate = format(date || null);\n if (formattedDate) {\n setDateValue(formattedDate);\n onDateValueChange?.(formattedDate, true);\n }\n }, [date, format, locale, timeZone]);\n\n const [focused, setFocused] = useState(false);\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const isDisabled = disabled || formFieldDisabled;\n\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const {\n \"aria-describedby\": dateInputDescribedBy,\n \"aria-labelledby\": dateInputLabelledBy,\n onBlur: inputPropsOnBlur,\n onChange: inputPropsOnChange,\n onKeyDown: inputPropsOnKeyDown,\n onFocus: inputPropsOnFocus,\n required: dateInputPropsRequired,\n ...restDateInputProps\n } = inputProps;\n\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : dateInputPropsRequired;\n\n const apply = (event: SyntheticEvent) => {\n const { date: parsedDate, error } = parse(dateValue ?? \"\");\n let newDate = parsedDate;\n if (newDate) {\n const formattedDate = format(newDate);\n if (formattedDate) {\n setDateValue(formattedDate);\n onDateValueChange?.(formattedDate, true);\n }\n }\n const hasDateChanged =\n newDate && date ? newDate.compare(date) !== 0 : newDate !== date;\n if (hasDateChanged) {\n setDate(newDate);\n if (newDate && preservedTime.current) {\n newDate = newDate.set(preservedTime.current);\n }\n }\n if (hasDateChanged || lastError.current !== error) {\n onDateChange?.(event, newDate, error);\n }\n lastError.current = error;\n };\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const newDateValue = event.target.value;\n setDateValue(newDateValue);\n inputPropsOnChange?.(event);\n onChange?.(event);\n onDateValueChange?.(newDateValue, false);\n };\n\n const handleFocus: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(true);\n inputPropsOnFocus?.(event);\n };\n const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(false);\n apply(event);\n inputPropsOnBlur?.(event);\n };\n\n const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n apply(event);\n }\n inputPropsOnKeyDown?.(event);\n };\n\n const handleClick: MouseEventHandler<HTMLDivElement> = (event) => {\n if (event.target === wrapperRef.current) {\n innerInputRef?.current?.focus();\n }\n onClick?.(event);\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus ?? \"\")]: validationStatus,\n [withBaseName(\"bordered\")]: bordered,\n },\n className,\n )}\n ref={handleWrapperRef}\n onClick={handleClick}\n {...rest}\n >\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n dateInputLabelledBy,\n inputId,\n )}\n aria-label={clsx(\"Selected date\", ariaLabel)}\n id={inputId}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={handleInputRef}\n tabIndex={isDisabled ? -1 : 0}\n placeholder={placeholder}\n size={placeholder.length}\n value={isReadOnly && !dateValue ? emptyReadOnlyMarker : dateValue}\n {...restDateInputProps}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onFocus={!isDisabled ? handleFocus : undefined}\n required={isRequired}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment}\n </div>\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n },\n);\n"],"names":["dateInputCss","date","defaultFormatDate"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DateInputSingle.js","sources":["../src/date-input/DateInputSingle.tsx"],"sourcesContent":["import {\n type DateValue,\n type TimeFields,\n getLocalTimeZone,\n} from \"@internationalized/date\";\nimport {\n StatusAdornment,\n makePrefixer,\n useControlled,\n useForkRef,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n type InputHTMLAttributes,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type ReactNode,\n type RefObject,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n type SingleDateSelection,\n formatDate as defaultFormatDate,\n getCurrentLocale,\n} from \"../calendar\";\nimport dateInputCss from \"./DateInput.css\";\nimport { extractTimeFieldsFromDate, parseCalendarDate } from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\n\n/**\n * Date error produced by DateInputSingle parser.\n */\nexport type DateInputSingleParserError = string | false;\n\n/**\n * Date error produced by DateInputSingle parser.\n */\nexport type DateInputSingleError = DateInputSingleParserError;\n\n/**\n * Return value of DateInputSingle parser.\n * @template T\n */\nexport interface DateInputSingleParserResult<T = DateValue | null> {\n /**\n * The parsed date value.\n */\n date: T;\n /**\n * The error encountered during parsing, if any.\n */\n error: DateInputSingleParserError;\n}\n\n/**\n * Props for the DateInputSingle component.\n * @template T\n */\nexport interface DateInputSingleProps<T = SingleDateSelection>\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n Pick<\n ComponentPropsWithoutRef<\"input\">,\n \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n > {\n /**\n * The aria-label for accessibility.\n */\n ariaLabel?: string;\n /**\n * Styling variant with full border. Defaults to false.\n */\n bordered?: boolean;\n /**\n * The marker to use in an empty read-only DateInput.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component.\n */\n endAdornment?: ReactNode;\n /**\n * Attributes applied to the `input` element.\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * If `true`, the component is read-only.\n */\n readOnly?: boolean;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Function to format the input value.\n */\n format?: (date: DateValue | null) => string;\n /**\n * Reference for the input.\n */\n inputRef?: RefObject<HTMLInputElement>;\n /**\n * Input value. Use when the input value is controlled.\n */\n value?: string;\n /**\n * The initial input value. Use when the component is uncontrolled.\n */\n defaultValue?: string;\n /**\n * The date value. Use when the component is controlled.\n */\n date?: T | null;\n /**\n * The initial selected date value. Use when the component is uncontrolled.\n */\n defaultDate?: T | null;\n /**\n * Callback fired when the selected date changes.\n * @param event - The synthetic event.\n * @param date - The new date value.\n * @param error - The date input single error.\n */\n onDateChange?: (\n event: SyntheticEvent,\n date: T | null,\n error: DateInputSingleError,\n ) => void;\n /**\n * Function to parse date string to valid `DateValue` or null, if invalid or empty.\n * @param inputDate - The input date string.\n * @returns The result of the date input single parser.\n */\n parse?: (inputDate: string) => DateInputSingleParserResult;\n /**\n * Called when input value changes, either due to user interaction or programmatic formatting of valid dates.\n * @param newValue - The new date input value.\n * @param isFormatted - Whether the value is formatted.\n */\n onDateValueChange?: (newValue: string, isFormatted: boolean) => void;\n /**\n * Locale of the entered date.\n */\n locale?: string;\n /**\n * Timezone of the entered date.\n */\n timeZone?: string;\n}\nexport const DateInputSingle = forwardRef<HTMLDivElement, DateInputSingleProps>(\n function DateInput(props, ref) {\n const {\n bordered = false,\n className,\n disabled,\n \"aria-label\": ariaLabel,\n date: dateProp,\n defaultDate,\n onDateChange,\n value: valueProp,\n defaultValue = \"\",\n onChange,\n onClick,\n emptyReadOnlyMarker = \"—\",\n endAdornment,\n format: formatProp,\n inputProps = {},\n inputRef: inputRefProp = null,\n parse = parseCalendarDate,\n placeholder = \"dd mmm yyyy\",\n readOnly: readOnlyProp,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n onDateValueChange,\n locale = getCurrentLocale(),\n timeZone = getLocalTimeZone(),\n ...rest\n } = props;\n const wrapperRef = useRef(null);\n const lastError = useRef<string | false>(false);\n const handleWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const innerInputRef = useRef<HTMLInputElement>(null);\n const handleInputRef = useForkRef<HTMLInputElement>(\n innerInputRef,\n inputRefProp,\n );\n\n const inputId = useId();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-input-single\",\n css: dateInputCss,\n window: targetWindow,\n });\n\n const [date, setDate] = useControlled({\n controlled: dateProp,\n default: defaultDate,\n name: \"DateInputSingle\",\n state: \"date\",\n });\n const [dateValue, setDateValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DateInputSingle\",\n state: \"dateValue\",\n });\n const preservedTime = useRef<TimeFields | undefined>(\n extractTimeFieldsFromDate(date || null),\n );\n\n const format = useCallback(\n (date: DateValue | null) => {\n return formatProp\n ? formatProp(date)\n : defaultFormatDate(date, locale, { timeZone });\n },\n [formatProp, locale, timeZone],\n );\n\n // Update date string value when selected date changes\n useEffect(() => {\n const formattedDate = format(date || null);\n if (formattedDate) {\n setDateValue(formattedDate);\n onDateValueChange?.(formattedDate, true);\n }\n }, [date, format, locale, timeZone]);\n\n const [focused, setFocused] = useState(false);\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const isDisabled = disabled || formFieldDisabled;\n\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const {\n \"aria-describedby\": dateInputDescribedBy,\n \"aria-labelledby\": dateInputLabelledBy,\n onBlur: inputPropsOnBlur,\n onChange: inputPropsOnChange,\n onKeyDown: inputPropsOnKeyDown,\n onFocus: inputPropsOnFocus,\n required: dateInputPropsRequired,\n ...restDateInputProps\n } = inputProps;\n\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : dateInputPropsRequired;\n\n const apply = (event: SyntheticEvent) => {\n const { date: parsedDate, error } = parse(dateValue ?? \"\");\n let newDate = parsedDate;\n if (newDate) {\n const formattedDate = format(newDate);\n if (formattedDate) {\n setDateValue(formattedDate);\n onDateValueChange?.(formattedDate, true);\n }\n }\n const hasDateChanged =\n newDate && date ? newDate.compare(date) !== 0 : newDate !== date;\n if (hasDateChanged) {\n setDate(newDate);\n if (newDate && preservedTime.current) {\n newDate = newDate.set(preservedTime.current);\n }\n }\n if (hasDateChanged || lastError.current !== error) {\n onDateChange?.(event, newDate, error);\n }\n lastError.current = error;\n };\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const newDateValue = event.target.value;\n setDateValue(newDateValue);\n inputPropsOnChange?.(event);\n onChange?.(event);\n onDateValueChange?.(newDateValue, false);\n };\n\n const handleFocus: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(true);\n inputPropsOnFocus?.(event);\n };\n const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(false);\n apply(event);\n inputPropsOnBlur?.(event);\n };\n\n const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n apply(event);\n }\n inputPropsOnKeyDown?.(event);\n };\n\n const handleClick: MouseEventHandler<HTMLDivElement> = (event) => {\n if (event.target === wrapperRef.current) {\n innerInputRef?.current?.focus();\n }\n onClick?.(event);\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus ?? \"\")]: validationStatus,\n [withBaseName(\"bordered\")]: bordered,\n },\n className,\n )}\n ref={handleWrapperRef}\n onClick={handleClick}\n {...rest}\n >\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n dateInputLabelledBy,\n inputId,\n )}\n aria-label={clsx(\"Selected date\", ariaLabel)}\n id={inputId}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={handleInputRef}\n tabIndex={isDisabled ? -1 : 0}\n placeholder={placeholder}\n size={placeholder.length}\n value={isReadOnly && !dateValue ? emptyReadOnlyMarker : dateValue}\n {...restDateInputProps}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onFocus={!isDisabled ? handleFocus : undefined}\n required={isRequired}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment}\n </div>\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n },\n);\n"],"names":["dateInputCss","date","defaultFormatDate"],"mappings":"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"}
|
|
@@ -7,24 +7,59 @@ import { useDatePicker } from './useDatePicker.js';
|
|
|
7
7
|
const DatePickerMain = forwardRef(
|
|
8
8
|
function DatePickerMain2(props, ref) {
|
|
9
9
|
var _a, _b;
|
|
10
|
-
const {
|
|
10
|
+
const {
|
|
11
|
+
children,
|
|
12
|
+
readOnly,
|
|
13
|
+
disabled,
|
|
14
|
+
selectionVariant,
|
|
15
|
+
defaultSelectedDate,
|
|
16
|
+
selectedDate,
|
|
17
|
+
onSelectedDateChange,
|
|
18
|
+
onApply,
|
|
19
|
+
minDate,
|
|
20
|
+
maxDate,
|
|
21
|
+
timeZone,
|
|
22
|
+
locale,
|
|
23
|
+
onCancel,
|
|
24
|
+
...rest
|
|
25
|
+
} = props;
|
|
26
|
+
const useDatePickerProps = {
|
|
27
|
+
readOnly,
|
|
28
|
+
disabled,
|
|
29
|
+
selectionVariant,
|
|
30
|
+
defaultSelectedDate,
|
|
31
|
+
selectedDate,
|
|
32
|
+
onSelectedDateChange,
|
|
33
|
+
onApply,
|
|
34
|
+
minDate,
|
|
35
|
+
maxDate,
|
|
36
|
+
timeZone,
|
|
37
|
+
locale,
|
|
38
|
+
onCancel
|
|
39
|
+
};
|
|
11
40
|
if (props.selectionVariant === "range") {
|
|
12
|
-
const stateAndHelpers2 = useDatePicker(
|
|
41
|
+
const stateAndHelpers2 = useDatePicker(
|
|
42
|
+
useDatePickerProps,
|
|
43
|
+
ref
|
|
44
|
+
);
|
|
13
45
|
return /* @__PURE__ */ jsx(DateRangeSelectionContext.Provider, {
|
|
14
46
|
value: stateAndHelpers2,
|
|
15
47
|
children: /* @__PURE__ */ jsx("div", {
|
|
16
|
-
className,
|
|
17
48
|
ref: (_a = stateAndHelpers2 == null ? void 0 : stateAndHelpers2.state) == null ? void 0 : _a.containerRef,
|
|
49
|
+
...rest,
|
|
18
50
|
children
|
|
19
51
|
})
|
|
20
52
|
});
|
|
21
53
|
}
|
|
22
|
-
const stateAndHelpers = useDatePicker(
|
|
54
|
+
const stateAndHelpers = useDatePicker(
|
|
55
|
+
useDatePickerProps,
|
|
56
|
+
ref
|
|
57
|
+
);
|
|
23
58
|
return /* @__PURE__ */ jsx(SingleDateSelectionContext.Provider, {
|
|
24
59
|
value: stateAndHelpers,
|
|
25
60
|
children: /* @__PURE__ */ jsx("div", {
|
|
26
|
-
className,
|
|
27
61
|
ref: (_b = stateAndHelpers == null ? void 0 : stateAndHelpers.state) == null ? void 0 : _b.containerRef,
|
|
62
|
+
...rest,
|
|
28
63
|
children
|
|
29
64
|
})
|
|
30
65
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { type ReactNode, forwardRef } from \"react\";\nimport {\n DateRangeSelectionContext,\n type RangeDatePickerState,\n type SingleDatePickerState,\n SingleDateSelectionContext,\n} from \"./DatePickerContext\";\nimport { DatePickerOverlayProvider } from \"./DatePickerOverlayProvider\";\nimport {\n type UseDatePickerRangeProps,\n type UseDatePickerSingleProps,\n useDatePicker,\n} from \"./useDatePicker\";\n\n/**\n * Base props for DatePicker.\n */\nexport interface DatePickerBaseProps {\n className?: string;\n children?: ReactNode;\n /** the open/close state of the overlay. The open/close state will be controlled when this prop is provided. */\n open?: boolean;\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\nexport interface DatePickerSingleProps\n extends DatePickerBaseProps,\n UseDatePickerSingleProps {\n selectionVariant: \"single\";\n}\n\nexport interface DatePickerRangeProps\n extends DatePickerBaseProps,\n UseDatePickerRangeProps {\n selectionVariant: \"range\";\n}\n\nexport type DatePickerProps = DatePickerSingleProps | DatePickerRangeProps;\n\nexport const DatePickerMain = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePickerMain(props, ref) {\n const {
|
|
1
|
+
{"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { type ReactNode, forwardRef } from \"react\";\nimport {\n DateRangeSelectionContext,\n type RangeDatePickerState,\n type SingleDatePickerState,\n SingleDateSelectionContext,\n} from \"./DatePickerContext\";\nimport { DatePickerOverlayProvider } from \"./DatePickerOverlayProvider\";\nimport {\n type UseDatePickerRangeProps,\n type UseDatePickerSingleProps,\n useDatePicker,\n} from \"./useDatePicker\";\n\n/**\n * Base props for DatePicker.\n */\nexport interface DatePickerBaseProps {\n className?: string;\n children?: ReactNode;\n /** the open/close state of the overlay. The open/close state will be controlled when this prop is provided. */\n open?: boolean;\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\nexport interface DatePickerSingleProps\n extends DatePickerBaseProps,\n UseDatePickerSingleProps {\n selectionVariant: \"single\";\n}\n\nexport interface DatePickerRangeProps\n extends DatePickerBaseProps,\n UseDatePickerRangeProps {\n selectionVariant: \"range\";\n}\n\nexport type DatePickerProps = DatePickerSingleProps | DatePickerRangeProps;\n\nexport const DatePickerMain = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePickerMain(props, ref) {\n const {\n children,\n readOnly,\n disabled,\n selectionVariant,\n defaultSelectedDate,\n selectedDate,\n onSelectedDateChange,\n onApply,\n minDate,\n maxDate,\n timeZone,\n locale,\n onCancel,\n ...rest\n } = props;\n // biome-ignore lint/suspicious/noExplicitAny: type guard\n const useDatePickerProps: any = {\n readOnly,\n disabled,\n selectionVariant,\n defaultSelectedDate,\n selectedDate,\n onSelectedDateChange,\n onApply,\n minDate,\n maxDate,\n timeZone,\n locale,\n onCancel,\n };\n if (props.selectionVariant === \"range\") {\n const stateAndHelpers = useDatePicker(\n useDatePickerProps,\n ref,\n ) as RangeDatePickerState;\n return (\n <DateRangeSelectionContext.Provider value={stateAndHelpers}>\n <div ref={stateAndHelpers?.state?.containerRef} {...rest}>\n {children}\n </div>\n </DateRangeSelectionContext.Provider>\n );\n }\n const stateAndHelpers = useDatePicker(\n useDatePickerProps,\n ref,\n ) as SingleDatePickerState;\n return (\n <SingleDateSelectionContext.Provider value={stateAndHelpers}>\n <div ref={stateAndHelpers?.state?.containerRef} {...rest}>\n {children}\n </div>\n </SingleDateSelectionContext.Provider>\n );\n },\n);\n\nexport const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePicker(props, ref) {\n const { open, defaultOpen, ...rest } = props;\n\n return (\n <DatePickerOverlayProvider open={open} defaultOpen={defaultOpen}>\n <DatePickerMain {...rest} ref={ref} />\n </DatePickerOverlayProvider>\n );\n },\n);\n"],"names":["DatePickerMain","stateAndHelpers","DatePicker"],"mappings":";;;;;;AA0CO,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AA3CtC,IAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AA4CI,IAAM,MAAA;AAAA,MACJ,QAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA;AAAA,MACA,mBAAA;AAAA,MACA,YAAA;AAAA,MACA,oBAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,kBAA0B,GAAA;AAAA,MAC9B,QAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA;AAAA,MACA,mBAAA;AAAA,MACA,YAAA;AAAA,MACA,oBAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,KACF,CAAA;AACA,IAAI,IAAA,KAAA,CAAM,qBAAqB,OAAS,EAAA;AACtC,MAAA,MAAMC,gBAAkB,GAAA,aAAA;AAAA,QACtB,kBAAA;AAAA,QACA,GAAA;AAAA,OACF,CAAA;AACA,MACE,uBAAA,GAAA,CAAC,0BAA0B,QAA1B,EAAA;AAAA,QAAmC,KAAOA,EAAAA,gBAAAA;AAAA,QACzC,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,UAAI,MAAK,EAAAA,GAAAA,gBAAAA,IAAA,IAAAA,GAAAA,KAAAA,CAAAA,GAAAA,gBAAAA,CAAiB,UAAjB,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,UAAe,GAAG,IAAA;AAAA,UACjD,QAAA;AAAA,SACH,CAAA;AAAA,OACF,CAAA,CAAA;AAAA,KAEJ;AACA,IAAA,MAAM,eAAkB,GAAA,aAAA;AAAA,MACtB,kBAAA;AAAA,MACA,GAAA;AAAA,KACF,CAAA;AACA,IACE,uBAAA,GAAA,CAAC,2BAA2B,QAA3B,EAAA;AAAA,MAAoC,KAAO,EAAA,eAAA;AAAA,MAC1C,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,GAAA,EAAA,CAAK,EAAiB,GAAA,eAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,eAAA,CAAA,KAAA,KAAjB,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,QAAe,GAAG,IAAA;AAAA,QACjD,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,SAASC,WAAW,CAAA,KAAA,EAAO,GAAK,EAAA;AAC9B,IAAA,MAAM,EAAE,IAAA,EAAM,WAAgB,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEvC,IAAA,uBACG,GAAA,CAAA,yBAAA,EAAA;AAAA,MAA0B,IAAA;AAAA,MAAY,WAAA;AAAA,MACrC,QAAC,kBAAA,GAAA,CAAA,cAAA,EAAA;AAAA,QAAgB,GAAG,IAAA;AAAA,QAAM,GAAA;AAAA,OAAU,CAAA;AAAA,KACtC,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -24,7 +24,8 @@ const DatePickerActions = forwardRef(function DatePickerActions2(props, ref) {
|
|
|
24
24
|
CancelButtonProps,
|
|
25
25
|
onApply,
|
|
26
26
|
onCancel,
|
|
27
|
-
selectionVariant
|
|
27
|
+
selectionVariant,
|
|
28
|
+
...rest
|
|
28
29
|
} = props;
|
|
29
30
|
const targetWindow = useWindow();
|
|
30
31
|
useComponentCssInjection({
|
|
@@ -69,13 +70,15 @@ const DatePickerActions = forwardRef(function DatePickerActions2(props, ref) {
|
|
|
69
70
|
return /* @__PURE__ */ jsxs("div", {
|
|
70
71
|
className: clsx(className, withBaseName()),
|
|
71
72
|
ref,
|
|
73
|
+
...rest,
|
|
72
74
|
children: [
|
|
73
75
|
/* @__PURE__ */ jsx("div", {
|
|
74
76
|
className: withBaseName("body"),
|
|
75
77
|
children
|
|
76
78
|
}),
|
|
77
79
|
/* @__PURE__ */ jsx(Button, {
|
|
78
|
-
|
|
80
|
+
appearance: "transparent",
|
|
81
|
+
sentiment: "neutral",
|
|
79
82
|
ref: cancelButtonRef,
|
|
80
83
|
...CancelButtonProps,
|
|
81
84
|
onClick: handleCancel,
|
|
@@ -83,7 +86,8 @@ const DatePickerActions = forwardRef(function DatePickerActions2(props, ref) {
|
|
|
83
86
|
children: "Cancel"
|
|
84
87
|
}),
|
|
85
88
|
/* @__PURE__ */ jsx(Button, {
|
|
86
|
-
|
|
89
|
+
appearance: "solid",
|
|
90
|
+
sentiment: "accented",
|
|
87
91
|
ref: applyButtonRef,
|
|
88
92
|
...ApplyButtonProps,
|
|
89
93
|
onClick: handleApply,
|
|
@@ -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 { clsx } from \"clsx\";\nimport React, {\n type ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n type SyntheticEvent,\n type MouseEventHandler,\n type Ref,\n} from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport {\n type RangeDatePickerState,\n type SingleDatePickerState,\n useDatePickerContext,\n} from \"./index\";\nimport \"./DatePickerActions.css\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport datePickerActions from \"./DatePickerActions.css\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerActions\");\n\n/**\n * Base props for DatePicker actions.\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<\n HTMLDivElement,\n DatePickerActionsProps<\"single\" | \"range\">\n>(function DatePickerActions(props, ref) {\n const {\n applyButtonRef,\n ApplyButtonProps,\n cancelButtonRef,\n children,\n className,\n CancelButtonProps,\n onApply,\n onCancel,\n selectionVariant,\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-picker-actions\",\n css: datePickerActions,\n window: targetWindow,\n });\n\n // biome-ignore lint/suspicious/noExplicitAny: state and helpers coerced based on selectionVariant\n let stateAndHelpers: any;\n if (selectionVariant === \"range\") {\n stateAndHelpers = useDatePickerContext({\n selectionVariant: \"range\",\n }) as RangeDatePickerState;\n } else {\n stateAndHelpers = useDatePickerContext({\n selectionVariant: \"single\",\n }) as SingleDatePickerState;\n }\n\n const {\n state: { selectedDate },\n helpers: { cancel, apply, setEnableApply },\n } = stateAndHelpers;\n\n useEffect(() => {\n setEnableApply(true);\n }, [setEnableApply]);\n\n const handleCancel: MouseEventHandler<HTMLButtonElement> = (event) => {\n cancel();\n CancelButtonProps?.onClick?.(event);\n onCancel?.(event);\n };\n\n const handleApply: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (selectionVariant === \"single\") {\n apply(selectedDate, false);\n onApply?.(event, selectedDate);\n } else {\n apply(selectedDate, { startDate: false, endDate: false });\n onApply?.(event, selectedDate);\n }\n ApplyButtonProps?.onClick?.(event);\n };\n\n return (\n <div className={clsx(className, withBaseName())} ref={ref}>\n <div className={withBaseName(\"body\")}>{children}</div>\n <Button\n
|
|
1
|
+
{"version":3,"file":"DatePickerActions.js","sources":["../src/date-picker/DatePickerActions.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport React, {\n type ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n type SyntheticEvent,\n type MouseEventHandler,\n type Ref,\n} from \"react\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\nimport {\n type RangeDatePickerState,\n type SingleDatePickerState,\n useDatePickerContext,\n} from \"./index\";\nimport \"./DatePickerActions.css\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport datePickerActions from \"./DatePickerActions.css\";\n\nconst withBaseName = makePrefixer(\"saltDatePickerActions\");\n\n/**\n * Base props for DatePicker actions.\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<\n HTMLDivElement,\n DatePickerActionsProps<\"single\" | \"range\">\n>(function DatePickerActions(props, ref) {\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 // biome-ignore lint/suspicious/noExplicitAny: state and helpers coerced based on selectionVariant\n let stateAndHelpers: any;\n if (selectionVariant === \"range\") {\n stateAndHelpers = useDatePickerContext({\n selectionVariant: \"range\",\n }) as RangeDatePickerState;\n } else {\n stateAndHelpers = useDatePickerContext({\n selectionVariant: \"single\",\n }) as SingleDatePickerState;\n }\n\n const {\n state: { selectedDate },\n helpers: { cancel, apply, setEnableApply },\n } = stateAndHelpers;\n\n useEffect(() => {\n setEnableApply(true);\n }, [setEnableApply]);\n\n const handleCancel: MouseEventHandler<HTMLButtonElement> = (event) => {\n cancel();\n CancelButtonProps?.onClick?.(event);\n onCancel?.(event);\n };\n\n const handleApply: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (selectionVariant === \"single\") {\n apply(selectedDate, false);\n onApply?.(event, selectedDate);\n } else {\n apply(selectedDate, { startDate: false, endDate: false });\n onApply?.(event, selectedDate);\n }\n ApplyButtonProps?.onClick?.(event);\n };\n\n return (\n <div className={clsx(className, withBaseName())} ref={ref} {...rest}>\n <div className={withBaseName(\"body\")}>{children}</div>\n <Button\n appearance=\"transparent\"\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 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":["DatePickerActions","datePickerActions"],"mappings":"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"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { makePrefixer, useForkRef, useControlled, Button } from '@salt-ds/core';
|
|
3
|
-
import { CalendarIcon } from '@salt-ds/icons';
|
|
2
|
+
import { makePrefixer, useIcon, useForkRef, useControlled, Button } from '@salt-ds/core';
|
|
4
3
|
import { clsx } from 'clsx';
|
|
5
4
|
import { forwardRef, useRef, useCallback, useEffect } from 'react';
|
|
6
5
|
import '../date-input/DateInputSingle.js';
|
|
@@ -22,6 +21,7 @@ const DatePickerRangeInput = forwardRef(function DatePickerRangeInput2(props, re
|
|
|
22
21
|
onDateValueChange,
|
|
23
22
|
...rest
|
|
24
23
|
} = props;
|
|
24
|
+
const { CalendarIcon } = useIcon();
|
|
25
25
|
const {
|
|
26
26
|
state: { selectedDate, disabled, readOnly, cancelled, locale, timeZone },
|
|
27
27
|
helpers: { setSelectedDate }
|
|
@@ -65,7 +65,7 @@ const DatePickerRangeInput = forwardRef(function DatePickerRangeInput2(props, re
|
|
|
65
65
|
endDate: false
|
|
66
66
|
});
|
|
67
67
|
}
|
|
68
|
-
}, [cancelled
|
|
68
|
+
}, [cancelled]);
|
|
69
69
|
const startInputProps = {
|
|
70
70
|
onKeyDown: (event) => {
|
|
71
71
|
var _a;
|
|
@@ -100,7 +100,8 @@ const DatePickerRangeInput = forwardRef(function DatePickerRangeInput2(props, re
|
|
|
100
100
|
onDateValueChange: handleDateValueChange,
|
|
101
101
|
onChange,
|
|
102
102
|
endAdornment: /* @__PURE__ */ jsx(Button, {
|
|
103
|
-
|
|
103
|
+
appearance: "transparent",
|
|
104
|
+
sentiment: "neutral",
|
|
104
105
|
onClick: handleCalendarButton,
|
|
105
106
|
disabled,
|
|
106
107
|
"aria-label": "Open Calendar",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerRangeInput.js","sources":["../src/date-picker/DatePickerRangeInput.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"DatePickerRangeInput.js","sources":["../src/date-picker/DatePickerRangeInput.tsx"],"sourcesContent":["import {\n Button,\n makePrefixer,\n useControlled,\n useForkRef,\n useIcon,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n type KeyboardEvent,\n type KeyboardEventHandler,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport type { DateRangeSelection } from \"../calendar\";\nimport {\n DateInputRange,\n type DateInputRangeError,\n type DateInputRangeProps,\n type DateInputRangeValue,\n} from \"../date-input\";\nimport { useDatePickerContext } 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\nexport const DatePickerRangeInput = forwardRef<\n HTMLDivElement,\n DatePickerRangeInputProps\n>(function DatePickerRangeInput(props, ref) {\n const {\n className,\n endInputProps: endInputPropsProp,\n startInputProps: startInputPropsProp,\n onKeyDown,\n defaultValue,\n value: valueProp,\n onChange,\n onDateValueChange,\n ...rest\n } = props;\n\n const { CalendarIcon } = useIcon();\n\n const {\n state: { selectedDate, disabled, readOnly, cancelled, locale, timeZone },\n helpers: { setSelectedDate },\n } = useDatePickerContext({ selectionVariant: \"range\" });\n const {\n state: { open, floatingUIResult },\n helpers: { getReferenceProps, setOpen },\n } = useDatePickerOverlay();\n\n const inputRef = useForkRef<HTMLDivElement>(ref, floatingUIResult?.reference);\n const prevState = useRef<\n { date: typeof selectedDate; value: typeof valueProp } | undefined\n >();\n\n const [value, setValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DatePickerRangeInput\",\n state: \"dateValue\",\n });\n\n const handleCalendarButton = useCallback(() => {\n setOpen(!open);\n }, [open, setOpen]);\n\n const handleDateChange = useCallback(\n (\n _event: SyntheticEvent,\n newDate: DateRangeSelection | null,\n error: DateInputRangeError,\n ) => {\n setSelectedDate(newDate, error);\n },\n [setSelectedDate],\n );\n\n const handleDateValueChange = (\n newDateValue: DateInputRangeValue,\n isFormatted: boolean,\n ) => {\n setValue(newDateValue);\n onDateValueChange?.(newDateValue, isFormatted);\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 prevState.current = { date: selectedDate, value };\n }\n }, [open]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: avoid excessive re-rendering\n useEffect(() => {\n if (cancelled) {\n setValue(prevState?.current?.value);\n setSelectedDate(prevState?.current?.date || null, {\n startDate: false,\n endDate: false,\n });\n }\n }, [cancelled]);\n\n const startInputProps: {\n onKeyDown: KeyboardEventHandler<HTMLInputElement>;\n } = {\n onKeyDown: (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"ArrowDown\") {\n setOpen(true);\n }\n startInputPropsProp?.onKeyDown?.(event);\n },\n ...startInputPropsProp,\n };\n const endInputProps: {\n onKeyDown: KeyboardEventHandler<HTMLInputElement>;\n } = {\n onKeyDown: (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"ArrowDown\") {\n setOpen(true);\n }\n endInputPropsProp?.onKeyDown?.(event);\n },\n ...endInputPropsProp,\n };\n\n return (\n <DateInputRange\n value={value || { startDate: \"\", endDate: \"\" }}\n locale={locale}\n timeZone={timeZone}\n className={clsx(withBaseName(), className)}\n ref={inputRef}\n date={selectedDate}\n startInputProps={getReferenceProps(startInputProps)}\n endInputProps={getReferenceProps(endInputProps)}\n readOnly={readOnly}\n onDateChange={handleDateChange}\n onDateValueChange={handleDateValueChange}\n onChange={onChange}\n endAdornment={\n <Button\n appearance=\"transparent\"\n sentiment=\"neutral\"\n onClick={handleCalendarButton}\n disabled={disabled}\n aria-label=\"Open Calendar\"\n >\n <CalendarIcon />\n </Button>\n }\n {...rest}\n />\n );\n});\n"],"names":["DatePickerRangeInput"],"mappings":";;;;;;;;;;AA2BA,MAAM,YAAA,GAAe,aAAa,0BAA0B,CAAA,CAAA;AAOrD,MAAM,oBAAuB,GAAA,UAAA,CAGlC,SAASA,qBAAAA,CAAqB,OAAO,GAAK,EAAA;AAC1C,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,aAAe,EAAA,iBAAA;AAAA,IACf,eAAiB,EAAA,mBAAA;AAAA,IACjB,SAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACP,QAAA;AAAA,IACA,iBAAA;AAAA,IACG,GAAA,IAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAM,MAAA,EAAE,YAAa,EAAA,GAAI,OAAQ,EAAA,CAAA;AAEjC,EAAM,MAAA;AAAA,IACJ,OAAO,EAAE,YAAA,EAAc,UAAU,QAAU,EAAA,SAAA,EAAW,QAAQ,QAAS,EAAA;AAAA,IACvE,OAAA,EAAS,EAAE,eAAgB,EAAA;AAAA,GACzB,GAAA,oBAAA,CAAqB,EAAE,gBAAA,EAAkB,SAAS,CAAA,CAAA;AACtD,EAAM,MAAA;AAAA,IACJ,KAAA,EAAO,EAAE,IAAA,EAAM,gBAAiB,EAAA;AAAA,IAChC,OAAA,EAAS,EAAE,iBAAA,EAAmB,OAAQ,EAAA;AAAA,MACpC,oBAAqB,EAAA,CAAA;AAEzB,EAAA,MAAM,QAAW,GAAA,UAAA,CAA2B,GAAK,EAAA,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAkB,SAAS,CAAA,CAAA;AAC5E,EAAA,MAAM,YAAY,MAEhB,EAAA,CAAA;AAEF,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,aAAc,CAAA;AAAA,IACtC,UAAY,EAAA,SAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,IAAM,EAAA,sBAAA;AAAA,IACN,KAAO,EAAA,WAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,oBAAA,GAAuB,YAAY,MAAM;AAC7C,IAAA,OAAA,CAAQ,CAAC,IAAI,CAAA,CAAA;AAAA,GACZ,EAAA,CAAC,IAAM,EAAA,OAAO,CAAC,CAAA,CAAA;AAElB,EAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,IACvB,CACE,MACA,EAAA,OAAA,EACA,KACG,KAAA;AACH,MAAA,eAAA,CAAgB,SAAS,KAAK,CAAA,CAAA;AAAA,KAChC;AAAA,IACA,CAAC,eAAe,CAAA;AAAA,GAClB,CAAA;AAEA,EAAM,MAAA,qBAAA,GAAwB,CAC5B,YAAA,EACA,WACG,KAAA;AACH,IAAA,QAAA,CAAS,YAAY,CAAA,CAAA;AACrB,IAAA,iBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAoB,YAAc,EAAA,WAAA,CAAA,CAAA;AAAA,GACpC,CAAA;AAGA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,IAAM,EAAA;AACR,MAAA,SAAA,CAAU,OAAU,GAAA,EAAE,IAAM,EAAA,YAAA,EAAc,KAAM,EAAA,CAAA;AAAA,KAClD;AAAA,GACF,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAGT,EAAA,SAAA,CAAU,MAAM;AAxGlB,IAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAyGI,IAAA,IAAI,SAAW,EAAA;AACb,MAAS,QAAA,CAAA,CAAA,EAAA,GAAA,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAW,OAAX,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAoB,KAAK,CAAA,CAAA;AAClC,MAAA,eAAA,CAAA,CAAA,CAAgB,EAAW,GAAA,SAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAA,OAAA,KAAX,IAAoB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,KAAQ,IAAM,EAAA;AAAA,QAChD,SAAW,EAAA,KAAA;AAAA,QACX,OAAS,EAAA,KAAA;AAAA,OACV,CAAA,CAAA;AAAA,KACH;AAAA,GACF,EAAG,CAAC,SAAS,CAAC,CAAA,CAAA;AAEd,EAAA,MAAM,eAEF,GAAA;AAAA,IACF,SAAA,EAAW,CAAC,KAA2C,KAAA;AArH3D,MAAA,IAAA,EAAA,CAAA;AAsHM,MAAI,IAAA,KAAA,CAAM,QAAQ,WAAa,EAAA;AAC7B,QAAA,OAAA,CAAQ,IAAI,CAAA,CAAA;AAAA,OACd;AACA,MAAA,CAAA,EAAA,GAAA,mBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,mBAAA,CAAqB,cAArB,IAAiC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,mBAAA,EAAA,KAAA,CAAA,CAAA;AAAA,KACnC;AAAA,IACA,GAAG,mBAAA;AAAA,GACL,CAAA;AACA,EAAA,MAAM,aAEF,GAAA;AAAA,IACF,SAAA,EAAW,CAAC,KAA2C,KAAA;AAhI3D,MAAA,IAAA,EAAA,CAAA;AAiIM,MAAI,IAAA,KAAA,CAAM,QAAQ,WAAa,EAAA;AAC7B,QAAA,OAAA,CAAQ,IAAI,CAAA,CAAA;AAAA,OACd;AACA,MAAA,CAAA,EAAA,GAAA,iBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAmB,cAAnB,IAA+B,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,iBAAA,EAAA,KAAA,CAAA,CAAA;AAAA,KACjC;AAAA,IACA,GAAG,iBAAA;AAAA,GACL,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,cAAA,EAAA;AAAA,IACC,OAAO,KAAS,IAAA,EAAE,SAAW,EAAA,EAAA,EAAI,SAAS,EAAG,EAAA;AAAA,IAC7C,MAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,GAAK,EAAA,QAAA;AAAA,IACL,IAAM,EAAA,YAAA;AAAA,IACN,eAAA,EAAiB,kBAAkB,eAAe,CAAA;AAAA,IAClD,aAAA,EAAe,kBAAkB,aAAa,CAAA;AAAA,IAC9C,QAAA;AAAA,IACA,YAAc,EAAA,gBAAA;AAAA,IACd,iBAAmB,EAAA,qBAAA;AAAA,IACnB,QAAA;AAAA,IACA,8BACG,GAAA,CAAA,MAAA,EAAA;AAAA,MACC,UAAW,EAAA,aAAA;AAAA,MACX,SAAU,EAAA,SAAA;AAAA,MACV,OAAS,EAAA,oBAAA;AAAA,MACT,QAAA;AAAA,MACA,YAAW,EAAA,eAAA;AAAA,MAEX,8BAAC,YAAa,EAAA,EAAA,CAAA;AAAA,KAChB,CAAA;AAAA,IAED,GAAG,IAAA;AAAA,GACN,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -7,6 +7,8 @@ import clsx from 'clsx';
|
|
|
7
7
|
import { forwardRef, useState, useCallback } from 'react';
|
|
8
8
|
import { Calendar } from '../calendar/Calendar.js';
|
|
9
9
|
import { CalendarNavigation } from '../calendar/CalendarNavigation.js';
|
|
10
|
+
import { CalendarWeekHeader } from '../calendar/CalendarWeekHeader.js';
|
|
11
|
+
import { CalendarDateGrid } from '../calendar/CalendarDateGrid.js';
|
|
10
12
|
import '../calendar/internal/CalendarContext.js';
|
|
11
13
|
import { getCurrentLocale } from '../calendar/formatDate.js';
|
|
12
14
|
import '../calendar/useCalendarSelection.js';
|
|
@@ -42,8 +44,13 @@ const DatePickerRangePanel = forwardRef(function DatePickerRangePanel2(props, re
|
|
|
42
44
|
onSelect,
|
|
43
45
|
StartCalendarProps: StartCalendarPropsProp,
|
|
44
46
|
StartCalendarNavigationProps,
|
|
47
|
+
StartCalendarWeekHeaderProps,
|
|
48
|
+
StartCalendarDataGridProps,
|
|
45
49
|
EndCalendarProps: EndCalendarPropsProp,
|
|
46
|
-
EndCalendarNavigationProps
|
|
50
|
+
EndCalendarNavigationProps,
|
|
51
|
+
EndCalendarWeekHeaderProps,
|
|
52
|
+
EndCalendarDataGridProps,
|
|
53
|
+
...rest
|
|
47
54
|
} = props;
|
|
48
55
|
const targetWindow = useWindow();
|
|
49
56
|
useComponentCssInjection({
|
|
@@ -161,6 +168,7 @@ const DatePickerRangePanel = forwardRef(function DatePickerRangePanel2(props, re
|
|
|
161
168
|
gap: 0,
|
|
162
169
|
className: clsx(className, withBaseName("container")),
|
|
163
170
|
ref,
|
|
171
|
+
...rest,
|
|
164
172
|
children: [
|
|
165
173
|
helperText && /* @__PURE__ */ jsx(FlexItem, {
|
|
166
174
|
className: withBaseName("header"),
|
|
@@ -173,19 +181,35 @@ const DatePickerRangePanel = forwardRef(function DatePickerRangePanel2(props, re
|
|
|
173
181
|
children: /* @__PURE__ */ jsxs(FormFieldContext.Provider, {
|
|
174
182
|
value: {},
|
|
175
183
|
children: [
|
|
176
|
-
/* @__PURE__ */
|
|
184
|
+
/* @__PURE__ */ jsxs(Calendar, {
|
|
177
185
|
selectionVariant: "range",
|
|
178
186
|
...StartCalendarProps,
|
|
179
|
-
children:
|
|
180
|
-
|
|
181
|
-
|
|
187
|
+
children: [
|
|
188
|
+
/* @__PURE__ */ jsx(CalendarNavigation, {
|
|
189
|
+
...StartCalendarNavigationProps
|
|
190
|
+
}),
|
|
191
|
+
/* @__PURE__ */ jsx(CalendarWeekHeader, {
|
|
192
|
+
...StartCalendarWeekHeaderProps
|
|
193
|
+
}),
|
|
194
|
+
/* @__PURE__ */ jsx(CalendarDateGrid, {
|
|
195
|
+
...StartCalendarDataGridProps
|
|
196
|
+
})
|
|
197
|
+
]
|
|
182
198
|
}),
|
|
183
|
-
/* @__PURE__ */
|
|
199
|
+
/* @__PURE__ */ jsxs(Calendar, {
|
|
184
200
|
selectionVariant: "range",
|
|
185
201
|
...EndCalendarProps,
|
|
186
|
-
children:
|
|
187
|
-
|
|
188
|
-
|
|
202
|
+
children: [
|
|
203
|
+
/* @__PURE__ */ jsx(CalendarNavigation, {
|
|
204
|
+
...EndCalendarNavigationProps
|
|
205
|
+
}),
|
|
206
|
+
/* @__PURE__ */ jsx(CalendarWeekHeader, {
|
|
207
|
+
...EndCalendarWeekHeaderProps
|
|
208
|
+
}),
|
|
209
|
+
/* @__PURE__ */ jsx(CalendarDateGrid, {
|
|
210
|
+
...EndCalendarDataGridProps
|
|
211
|
+
})
|
|
212
|
+
]
|
|
189
213
|
})
|
|
190
214
|
]
|
|
191
215
|
})
|