npm - @pega/cosmos-react-core - Versions diffs - 7.0.0-build.3.4 → 7.0.0-build.30.1 - Mend

@pega/cosmos-react-core 7.0.0-build.3.4 → 7.0.0-build.30.1

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.

Files changed (777) hide show

package/lib/components/DateTime/Input/DateInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';\nimport type {\n ClipboardEvent,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n RefObject,\n Dispatch,\n SetStateAction,\n ComponentType\n} from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport {\n useConfiguration,\n useFocusWithin,\n useI18n,\n useOuterEvent,\n useTestIds\n} from '../../../hooks';\nimport type { ForwardProps } from '../../../types';\nimport FormField from '../../FormField';\nimport Flex from '../../Flex';\nimport Button from '../../Button';\nimport Icon, { registerIcon } from '../../Icon';\nimport * as calendarIcon from '../../Icon/icons/calendar.icon';\nimport DatePicker from '../Picker/DatePicker';\nimport type DatePickerProps from '../Picker/DatePicker.types';\nimport { StyledFormControl } from '../../FormControl';\nimport type { FormControlProps } from '../../FormControl';\nimport type DateTimeProps from '../DateTime.types';\nimport type { DateTimeCallbackParameter } from '../DateTime.types';\nimport { cap, withTestIds } from '../../../utils';\nimport { getDateInputTestIds } from '../DateTime.test-ids';\n\nimport {\n getDateFormat,\n parsePastedTextToDate,\n parseToDate,\n validateDate,\n generatePickerButtonAriaLabel\n} from './utils';\nimport StyledDateTime, {\n StyledClearNowButtonsContainer,\n StyledDatePickerDialog,\n StyledDialogContent,\n StyledInputContainer\n} from './DateTime.styles';\nimport useAutoFocusNextInput from './useAutoFocusNextInput';\nimport PartInput from './PartInput';\nimport usePickerButton from './usePickerButton';\nimport type { DateParts } from './DateTimeInput.types';\n\nregisterIcon(calendarIcon);\n\nexport interface DateInputHandleValue {\n setOpen: Dispatch<SetStateAction<boolean>>;\n}\n\nexport interface DateInputProps extends DateTimeProps {\n /*\n Display additional column with week number in date picker popover.\n * @default false\n /\n showWeekNumber?: boolean;\n /* Changes default date picker /\n picker?: {\n renderer: ComponentType;\n rendererProps?: Partial<DatePickerProps> & ForwardProps;\n };\n /* Pass a heading and content to show additional information on the field. /\n additionalInfo?: FormControlProps['additionalInfo'];\n /* Additional properties for imperative control. */\n handle?: Ref<DateInputHandleValue>;\n}\n\nexport const StyledDateInput = styled(StyledDateTime)<DateInputProps>`\n padding-inline-end: 0;\n`;\n\nStyledDateInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n date: Date,\n { year, month: monthIndex, day }: DateParts<string \| undefined>\n): DateTimeCallbackParameter => {\n if ([year, monthIndex, day].every(Boolean)) {\n if (!validateDate(Number(year), Number(monthIndex) + 1, Number(day))) {\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'invalid'\n };\n }\n\n date.setUTCFullYear(Number(year), Number(monthIndex), Number(day));\n return {\n valueAsISOString: date.toISOString(),\n valueAsTimestamp: date.getTime()\n };\n }\n if ([year, monthIndex, day].every(p => !p)) {\n return {\n valueAsISOString: undefined,\n valueAsTimestamp: undefined\n };\n }\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'incomplete'\n };\n};\n\nconst DateInput: FunctionComponent<DateInputProps & ForwardProps> = forwardRef(function DateInput(\n props: PropsWithoutRef<DateInputProps>,\n ref: Ref<HTMLFieldSetElement>\n) {\n const { locale } = useConfiguration();\n const {\n testId,\n value,\n min,\n max,\n id,\n label,\n labelHidden,\n info = getDateFormat(locale).join(''),\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n onResolveSuggestion,\n showWeekNumber,\n picker: { renderer: PickerComp = DatePicker, rendererProps = {} } = {},\n autoFocus,\n additionalInfo,\n handle,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getDateInputTestIds);\n\n const t = useI18n();\n const containerRef = useRef<HTMLElement>(null);\n\n const date = value !== undefined && value !== '' ? parseToDate(value) : undefined;\n\n const [yearInputRef, monthInputRef, dayInputRef] = [\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null)\n ];\n\n const pickParts = (): DateParts<string \| undefined> => {\n return {\n day: dayInputRef.current?.value \|\| undefined,\n month: monthInputRef.current?.value\n ? (Number(monthInputRef.current.value) - 1).toString()\n : undefined,\n year: yearInputRef.current?.value \|\| undefined\n };\n };\n\n const currentlySelectedDate = () => {\n const parts = pickParts();\n if (Object.values(parts).every(Boolean)) {\n const year = Number(parts.year);\n const monthIndex = Number(parts.month);\n const day = Number(parts.day);\n\n return validateDate(year, monthIndex + 1, day)\n ? new Date(Date.UTC(year, monthIndex, day))\n : undefined;\n }\n };\n\n const [open, setOpen, , setPopoverRef, buttonEl, setButtonEl] = usePickerButton();\n\n const inputContainerRef = useRef<HTMLDivElement>(null);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(\n date ? new Date(date) : new Date(),\n pickParts()\n );\n if (onFocus && focused) onFocus(callbackParam);\n if (!focused) {\n if (inputContainerRef.current) inputContainerRef.current.scrollTop = 0;\n onBlur?.(callbackParam);\n }\n };\n\n const onInputChange = () => {\n onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));\n buttonEl?.setAttribute(\n 'aria-label',\n generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open)\n );\n };\n\n const setInputValue = (newValue?: Date) => {\n if (dayInputRef.current && monthInputRef.current && yearInputRef.current) {\n dayInputRef.current.value = newValue?.getUTCDate().toString().padStart(2, '0') ?? '';\n monthInputRef.current.value =\n (newValue && (newValue.getUTCMonth() + 1).toString().padStart(2, '0')) ?? '';\n yearInputRef.current.value = newValue?.getUTCFullYear().toString() ?? '';\n }\n };\n\n const onPaste = (e: ClipboardEvent) => {\n const text = e.clipboardData.getData('text');\n const newDate = parsePastedTextToDate(text, locale, date \|\| new Date());\n if (newDate) {\n e.preventDefault();\n setInputValue(newDate);\n onInputChange();\n }\n };\n\n // autoclose picker on focusing out\n useOuterEvent('focusin', [containerRef], e => {\n if (containerRef.current?.contains(e.relatedTarget as HTMLElement)) setOpen(false);\n });\n\n const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });\n\n const DayInput = (\n <PartInput\n data-testid={testIds.controlDay}\n key='day'\n placeholder={t('day_placeholder')}\n aria-label={displayNames.of('day')}\n value={date?.getUTCDate()}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={31}\n ref={dayInputRef}\n />\n );\n\n const MonthInput = (\n <PartInput\n data-testid={testIds.controlMonth}\n key='month'\n placeholder={t('month_placeholder')}\n aria-label={displayNames.of('month')}\n value={date ? date.getUTCMonth() + 1 : undefined}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={12}\n ref={monthInputRef}\n />\n );\n\n const YearInput = (\n <PartInput\n data-testid={testIds.controlYear}\n key='year'\n placeholder={t('year_placeholder')}\n aria-label={displayNames.of('year')}\n value={date?.getUTCFullYear()}\n onChange={onInputChange}\n size={4}\n maxLength={4}\n padWithZeros={false}\n readOnly={readOnly}\n min={1}\n ref={yearInputRef}\n />\n );\n\n useFocusWithin([containerRef], onFocusChange);\n\n useImperativeHandle(handle, () => ({ setOpen }));\n\n const PickerButton = (\n <>\n <Button\n data-testid={testIds.openClosePicker}\n variant='simple'\n icon\n ref={setButtonEl}\n onClick={() => setOpen(cur => !cur)}\n aria-label={generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open)}\n readOnly={readOnly}\n disabled={disabled}\n >\n <Icon name='calendar' />\n </Button>\n {open && buttonEl && (\n <StyledDatePickerDialog\n ref={setPopoverRef}\n target={buttonEl}\n placement='bottom-end'\n ariaLabel={t('choose_date')}\n >\n <Flex container={{ direction: 'column' }} as={StyledDialogContent}>\n <PickerComp\n testId={testIds.root}\n selected={currentlySelectedDate()}\n min={min}\n max={max}\n showWeekNumber={showWeekNumber}\n {...rendererProps}\n onChange={selected => {\n setInputValue(selected);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n rendererProps?.onChange?.(selected);\n }}\n />\n <Flex as={StyledClearNowButtonsContainer} container={{ justify: 'between' }}>\n <Button\n data-testid={testIds.clearCurrentDate}\n aria-label={t('clear_current_date')}\n onClick={() => {\n setInputValue(undefined);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n }}\n >\n {t('clear')}\n </Button>\n <Button\n data-testid={testIds.setCurrentDate}\n aria-label={t('set_current_date_a11y')}\n onClick={() => {\n const now = new Date();\n now.setUTCMinutes(now.getMinutes());\n now.setUTCHours(now.getHours());\n now.setUTCSeconds(now.getSeconds());\n setInputValue(now);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n }}\n >\n {cap(new Intl.RelativeTimeFormat(locale, { numeric: 'auto' }).format(0, 'day'))}\n </Button>\n </Flex>\n </Flex>\n </StyledDatePickerDialog>\n )}\n </>\n );\n\n const orderedRefs: RefObject<HTMLInputElement>[] = [];\n\n const Comp = (\n <Flex\n data-testid={testIds.root}\n as={StyledDateInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n ref={containerRef}\n onClick={(e: MouseEvent) => {\n if (e.target === containerRef.current) orderedRefs[0].current?.focus();\n }}\n {...restProps}\n >\n <Flex\n ref={inputContainerRef}\n as={StyledInputContainer}\n container={{ alignItems: 'center', wrap: 'wrap' }}\n onPaste={onPaste}\n >\n {getDateFormat(locale).map(part => {\n switch (part) {\n case 'DD':\n orderedRefs.push(dayInputRef);\n return DayInput;\n case 'MM':\n orderedRefs.push(monthInputRef);\n return MonthInput;\n case 'YYYY':\n orderedRefs.push(yearInputRef);\n return YearInput;\n default:\n return part;\n }\n })}\n </Flex>\n {!readOnly && PickerButton}\n </Flex>\n );\n\n useEffect(() => {\n if (autoFocus) orderedRefs[0].current?.focus();\n }, [autoFocus]);\n\n useAutoFocusNextInput(orderedRefs);\n\n return label ? (\n <FormField\n testId={testIds}\n as='fieldset'\n aria-labelledby={id}\n labelAs='legend'\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n additionalInfo={additionalInfo}\n ref={ref}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n});\n\nexport default withTestIds(DateInput, getDateInputTestIds);\n"]}
1	+ {"version":3,"file":"DateInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useImperativeHandle, useEffect, useState } from 'react';\nimport type {\n ClipboardEvent,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n RefObject,\n Dispatch,\n SetStateAction,\n ComponentType\n} from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport {\n useConfiguration,\n useFocusWithin,\n useI18n,\n useOuterEvent,\n useTestIds\n} from '../../../hooks';\nimport type { ForwardProps } from '../../../types';\nimport FormField from '../../FormField';\nimport Flex from '../../Flex';\nimport Icon, { registerIcon } from '../../Icon';\nimport * as calendarIcon from '../../Icon/icons/calendar.icon';\nimport DatePicker from '../Picker/DatePicker';\nimport type DatePickerProps from '../Picker/DatePicker.types';\nimport { StyledFormControl } from '../../FormControl';\nimport type { FormControlProps } from '../../FormControl';\nimport type DateTimeProps from '../DateTime.types';\nimport type { DateTimeCallbackParameter } from '../DateTime.types';\nimport { withTestIds } from '../../../utils';\nimport { getDateInputTestIds } from '../DateTime.test-ids';\n\nimport {\n getDateFormat,\n parsePastedTextToDate,\n parseToDate,\n validateDate,\n generatePickerButtonAriaLabel\n} from './utils';\nimport StyledDateTime, {\n StyledDatePickerDialog,\n StyledDialogContent,\n StyledInputButton,\n StyledInputContainer\n} from './DateTime.styles';\nimport useAutoFocusNextInput from './useAutoFocusNextInput';\nimport PartInput from './PartInput';\nimport usePickerButton from './usePickerButton';\nimport type { DateParts } from './DateTimeInput.types';\n\nregisterIcon(calendarIcon);\n\nexport interface DateInputHandleValue {\n setOpen: Dispatch<SetStateAction<boolean>>;\n}\n\nexport interface DateInputProps extends DateTimeProps {\n /*\n Display additional column with week number in date picker popover.\n * @default false\n /\n showWeekNumber?: boolean;\n /* Changes default date picker /\n picker?: {\n renderer: ComponentType;\n rendererProps?: Partial<DatePickerProps> & ForwardProps;\n };\n /* Pass a heading and content to show additional information on the field. /\n additionalInfo?: FormControlProps['additionalInfo'];\n /* Additional properties for imperative control. */\n handle?: Ref<DateInputHandleValue>;\n}\n\nexport const StyledDateInput = styled(StyledDateTime)<DateInputProps>`\n padding-inline-end: 0;\n`;\n\nStyledDateInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n date: Date,\n { year, month: monthIndex, day }: DateParts<string \| undefined>\n): DateTimeCallbackParameter => {\n if ([year, monthIndex, day].every(Boolean)) {\n if (!validateDate(Number(year), Number(monthIndex) + 1, Number(day))) {\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'invalid'\n };\n }\n\n date.setUTCFullYear(Number(year), Number(monthIndex), Number(day));\n return {\n valueAsISOString: date.toISOString(),\n valueAsTimestamp: date.getTime()\n };\n }\n if ([year, monthIndex, day].every(p => !p)) {\n return {\n valueAsISOString: undefined,\n valueAsTimestamp: undefined\n };\n }\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'incomplete'\n };\n};\n\nconst DateInput: FunctionComponent<DateInputProps & ForwardProps> = forwardRef(function DateInput(\n props: PropsWithoutRef<DateInputProps>,\n ref: Ref<HTMLFieldSetElement>\n) {\n const { locale } = useConfiguration();\n const {\n testId,\n value,\n min,\n max,\n id,\n label,\n labelHidden,\n info = getDateFormat(locale).join(''),\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n onResolveSuggestion,\n showWeekNumber,\n picker: { renderer: PickerComp = DatePicker, rendererProps = {} } = {},\n autoFocus,\n additionalInfo,\n handle,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getDateInputTestIds);\n\n const t = useI18n();\n const containerRef = useRef<HTMLElement>(null);\n\n const date = value !== undefined && value !== '' ? parseToDate(value) : undefined;\n\n const [yearInputRef, monthInputRef, dayInputRef] = [\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null)\n ];\n\n const [hasValue, setHasValue] = useState(!!date);\n useEffect(() => {\n setHasValue(!!date);\n }, [date]);\n\n const pickParts = (): DateParts<string \| undefined> => {\n return {\n day: dayInputRef.current?.value \|\| undefined,\n month: monthInputRef.current?.value\n ? (Number(monthInputRef.current.value) - 1).toString()\n : undefined,\n year: yearInputRef.current?.value \|\| undefined\n };\n };\n\n const currentlySelectedDate = () => {\n const parts = pickParts();\n if (Object.values(parts).every(Boolean)) {\n const year = Number(parts.year);\n const monthIndex = Number(parts.month);\n const day = Number(parts.day);\n\n return validateDate(year, monthIndex + 1, day)\n ? new Date(Date.UTC(year, monthIndex, day))\n : undefined;\n }\n };\n\n const [open, setOpen, , setPopoverRef, datePickerButtonEl, setDatePickerButtonEl] =\n usePickerButton();\n\n const inputContainerRef = useRef<HTMLDivElement>(null);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(\n date ? new Date(date) : new Date(),\n pickParts()\n );\n if (onFocus && focused) onFocus(callbackParam);\n if (!focused) {\n if (inputContainerRef.current) inputContainerRef.current.scrollTop = 0;\n onBlur?.(callbackParam);\n }\n };\n\n const onInputChange = () => {\n onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));\n datePickerButtonEl?.setAttribute(\n 'aria-label',\n generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open)\n );\n if (dayInputRef.current?.value \|\| monthInputRef.current?.value \|\| yearInputRef.current?.value) {\n setHasValue(true);\n } else {\n setHasValue(false);\n }\n };\n\n const setInputValue = (newValue?: Date) => {\n if (dayInputRef.current && monthInputRef.current && yearInputRef.current) {\n dayInputRef.current.value = newValue?.getUTCDate().toString().padStart(2, '0') ?? '';\n monthInputRef.current.value =\n (newValue && (newValue.getUTCMonth() + 1).toString().padStart(2, '0')) ?? '';\n yearInputRef.current.value = newValue?.getUTCFullYear().toString() ?? '';\n setHasValue(!!newValue);\n }\n };\n\n const onPaste = (e: ClipboardEvent) => {\n const text = e.clipboardData.getData('text');\n const newDate = parsePastedTextToDate(text, locale, date \|\| new Date());\n if (newDate) {\n e.preventDefault();\n setInputValue(newDate);\n onInputChange();\n }\n };\n\n // autoclose picker on focusing out\n useOuterEvent('focusin', [containerRef], e => {\n if (containerRef.current?.contains(e.relatedTarget as HTMLElement)) setOpen(false);\n });\n\n const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });\n\n const DayInput = (\n <PartInput\n data-testid={testIds.controlDay}\n key='day'\n placeholder={t('day_placeholder')}\n aria-label={displayNames.of('day')}\n value={date?.getUTCDate()}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={31}\n ref={dayInputRef}\n />\n );\n\n const MonthInput = (\n <PartInput\n data-testid={testIds.controlMonth}\n key='month'\n placeholder={t('month_placeholder')}\n aria-label={displayNames.of('month')}\n value={date ? date.getUTCMonth() + 1 : undefined}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={12}\n ref={monthInputRef}\n />\n );\n\n const YearInput = (\n <PartInput\n data-testid={testIds.controlYear}\n key='year'\n placeholder={t('year_placeholder')}\n aria-label={displayNames.of('year')}\n value={date?.getUTCFullYear()}\n onChange={onInputChange}\n size={4}\n maxLength={4}\n padWithZeros={false}\n readOnly={readOnly}\n min={1}\n ref={yearInputRef}\n />\n );\n\n useFocusWithin([containerRef], onFocusChange);\n\n useImperativeHandle(handle, () => ({ setOpen }));\n\n const PickerButton = (\n <>\n <StyledInputButton\n data-testid={testIds.openClosePicker}\n variant='simple'\n icon\n ref={setDatePickerButtonEl}\n onClick={() => setOpen(cur => !cur)}\n aria-label={generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open)}\n readOnly={readOnly}\n disabled={disabled}\n >\n <Icon name='calendar' />\n </StyledInputButton>\n {open && datePickerButtonEl && (\n <StyledDatePickerDialog\n ref={setPopoverRef}\n target={datePickerButtonEl}\n placement='bottom-end'\n aria-label={t('choose_date')}\n >\n <Flex container={{ direction: 'column' }} as={StyledDialogContent}>\n <PickerComp\n testId={testIds.root}\n selected={currentlySelectedDate()}\n min={min}\n max={max}\n showWeekNumber={showWeekNumber}\n {...rendererProps}\n onChange={selected => {\n setInputValue(selected);\n setOpen(false);\n setTimeout(() => datePickerButtonEl?.focus());\n onInputChange();\n rendererProps?.onChange?.(selected);\n }}\n />\n </Flex>\n </StyledDatePickerDialog>\n )}\n </>\n );\n\n const orderedRefs: RefObject<HTMLInputElement>[] = [];\n\n const Comp = (\n <Flex\n data-testid={testIds.root}\n as={StyledDateInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap', justify: 'between' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n ref={containerRef}\n onClick={(e: MouseEvent) => {\n if (e.target === containerRef.current) orderedRefs[0].current?.focus();\n }}\n {...restProps}\n >\n <Flex\n ref={inputContainerRef}\n as={StyledInputContainer}\n container={{ alignItems: 'center', wrap: 'wrap' }}\n onPaste={onPaste}\n >\n {getDateFormat(locale).map(part => {\n switch (part) {\n case 'DD':\n orderedRefs.push(dayInputRef);\n return DayInput;\n case 'MM':\n orderedRefs.push(monthInputRef);\n return MonthInput;\n case 'YYYY':\n orderedRefs.push(yearInputRef);\n return YearInput;\n default:\n return part;\n }\n })}\n </Flex>\n <Flex container>\n {!readOnly && hasValue && (\n <StyledInputButton\n data-testid={testIds.clearCurrentDate}\n aria-label={t('clear_current_date')}\n icon\n onClick={() => {\n setInputValue(undefined);\n setTimeout(() => datePickerButtonEl?.focus());\n onInputChange();\n }}\n variant='simple'\n compact\n label={t('clear')}\n >\n <Icon name='times' />\n </StyledInputButton>\n )}\n {!readOnly && PickerButton}\n </Flex>\n </Flex>\n );\n\n useEffect(() => {\n if (autoFocus) orderedRefs[0].current?.focus();\n }, [autoFocus]);\n\n useAutoFocusNextInput(orderedRefs);\n\n return label ? (\n <FormField\n testId={testIds}\n as='fieldset'\n aria-labelledby={id}\n labelAs='legend'\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n additionalInfo={additionalInfo}\n ref={ref}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n});\n\nexport default withTestIds(DateInput, getDateInputTestIds);\n"]}

package/lib/components/DateTime/Input/DateRangeInput.d.ts CHANGED Viewed

@@ -32,7 +32,7 @@ export interface DateRangeInputProps extends DateTimeProperties {
     autoFocus?: boolean;
 }
 declare const _default: FunctionComponent<DateRangeInputProps & ForwardProps> & {
-    getTestIds: (testIdProp?: string | undefined) => import("../../../types").TestIdsRecord<readonly ["from-date", "to-date", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
+    getTestIds: (testIdProp?: string | null | undefined) => import("../../../types").TestIdsRecord<readonly ["from-date", "to-date", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
 };
 export default _default;
 //# sourceMappingURL=DateRangeInput.d.ts.map

package/lib/components/DateTime/Input/DateRangeInput.js CHANGED Viewed

@@ -132,7 +132,7 @@ const DateRangeInput = forwardRef(function DateRangeInput({ testId, value = {},
         max,
         status
     };
-    return (_jsx(FormField, { testId: testIds, as: StyledDateRangeInput, ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden, label: label, labelAs: 'legend', required: required, readOnly: readOnly, status: status, disabled: disabled, children: _jsxs(Flex, { container: true, as: StyledRangeInputContainer, children: [_jsx(DateInput, { ...commonProps, testId: testIds.fromDate, value: value.start, picker: {
+    return (_jsx(FormField, { testId: testIds, as: StyledDateRangeInput, ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden, label: label, labelAs: 'legend', required: required, readOnly: readOnly, status: status, disabled: disabled, children: _jsxs(Flex, { container: true, as: StyledRangeInputContainer, children: [_jsx(DateInput, { testId: testIds.fromDate, ...commonProps, value: value.start, picker: {
                         renderer: DateRangePicker,
                         rendererProps: {
                             selected: getSelected(start, end),
@@ -148,7 +148,7 @@ const DateRangeInput = forwardRef(function DateRangeInput({ testId, value = {},
                             start: newValue,
                             end: convertToCallbackParameter(prepareValue(end, 'end'))
                         });
-                    }, additionalInfo: fromAdditionalInfo, label: fromLabel, "aria-label": `${t('range_from_datetime') + (label ? ` - ${label}` : '')}`, autoFocus: autoFocus }), _jsx(DateInput, { ...commonProps, testId: testIds.toDate, value: value.end, handle: endDateHandle, picker: {
+                    }, additionalInfo: fromAdditionalInfo, label: fromLabel, "aria-label": `${t('range_from_datetime') + (label ? ` - ${label}` : '')}`, autoFocus: autoFocus }), _jsx(DateInput, { testId: testIds.toDate, ...commonProps, value: value.end, handle: endDateHandle, picker: {
                         renderer: DateRangePicker,
                         rendererProps: {
                             selected: getSelected(end, start),

package/lib/components/DateTime/Input/DateRangeInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, forwardRef, useCallback } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds } from '../../../hooks';\nimport type { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport type { FormControlProps } from '../../FormControl';\nimport Flex from '../../Flex';\nimport FormField, { StyledFormField } from '../../FormField/FormField';\nimport DateRangePicker from '../Picker/DateRangePicker';\nimport type DateTimeProps from '../DateTime.types';\nimport type {\n DateRangeCallbackParameter,\n DateTimeCallbackParameter,\n DateTimeProperties\n} from '../DateTime.types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport { getDateRangeInputTestIds } from '../DateTime.test-ids';\nimport { withTestIds } from '../../../utils';\n\nimport DateInput from './DateInput';\nimport type { DateInputHandleValue } from './DateInput';\nimport { parseToDate } from './utils';\nimport StyledDateInput from './DateTime.styles';\n\nexport interface DateRangeInputProps extends DateTimeProperties {\n /** Object of range boundaries. /\n value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n /\n Display additional column with week number in date picker popover.\n * @default false\n /\n showWeekNumber?: boolean;\n /* Pass a string or a fragment with an Icon and string for first part of DataRangeInput. /\n fromLabel?: FormControlProps['label'];\n /* Pass a string or a fragment with an Icon and string for second part of DataRangeInput. /\n toLabel?: FormControlProps['label'];\n /* Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for second part of DataRangeInput. /\n toAdditionalInfo?: FormControlProps['additionalInfo'];\n /* Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for first part of DataRangeInput. /\n fromAdditionalInfo?: FormControlProps['additionalInfo'];\n /* Callback fired when input value changes. /\n onChange: (value: DateRangeCallbackParameter) => void;\n /* Callback fired when the component gets focused. /\n onFocus?: (value: DateRangeCallbackParameter) => void;\n /* Callback fired when the component loses focus. /\n onBlur?: (value: DateRangeCallbackParameter) => void;\n /* Automatically focuses the input on render. */\n autoFocus?: boolean;\n}\n\nconst StyledDateRangeInput = styled.div<DateRangeInputProps>(props => {\n const {\n theme: {\n components: { input }\n }\n } = props;\n\n return css`\n border: 0;\n min-width: min-content;\n\n ${StyledFormField} {\n &:last-child > ${StyledDateInput} {\n margin-inline-start: -${input['border-width']};\n }\n & legend {\n align-self: center;\n }\n &:focus,\n &:hover,\n &:focus-within {\n z-index: 2;\n }\n }\n `;\n});\n\nStyledDateRangeInput.defaultProps = defaultThemeProp;\n\ntype DateRepresentable = string \| number \| Date;\n\nconst convertToCallbackParameter = (v?: number): DateTimeCallbackParameter => {\n return {\n valueAsISOString: v === undefined \|\| Number.isNaN(v) ? undefined : new Date(v).toISOString(),\n valueAsTimestamp: v\n };\n};\n\nconst prepareValue = (v: number \| undefined, type: 'start' \| 'end') => {\n if (v === undefined \|\| Number.isNaN(v)) {\n return v;\n }\n return type === 'start'\n ? new Date(v).setUTCHours(0, 0, 0, 0)\n : new Date(v).setUTCHours(23, 59, 59, 999);\n};\n\nconst getSelected = (first: number \| undefined, second: number \| undefined) => {\n const selected = first ?? second;\n return selected ? parseToDate(selected) : undefined;\n};\n\nconst parseValueToDate = (value: DateRepresentable \| undefined) => {\n return value ? parseToDate(value) : undefined;\n};\n\nconst DateRangeInput: FunctionComponent<DateRangeInputProps & ForwardProps> = forwardRef(\n function DateRangeInput(\n {\n testId,\n value = {},\n min,\n max,\n label,\n fromLabel,\n toLabel,\n labelHidden,\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n showWeekNumber,\n autoFocus,\n fromAdditionalInfo,\n toAdditionalInfo,\n ...restProps\n }: PropsWithoutRef<DateRangeInputProps>,\n ref: Ref<HTMLDivElement>\n ) {\n const testIds = useTestIds(testId, getDateRangeInputTestIds);\n const t = useI18n();\n const endDateHandle = useRef<DateInputHandleValue>(null);\n\n const start =\n value.start === undefined \|\| value.start === ''\n ? undefined\n : prepareValue(parseToDate(value.start).getTime(), 'start');\n const end =\n value.end === undefined \|\| value.end === ''\n ? undefined\n : prepareValue(parseToDate(value.end).getTime(), 'end');\n\n const startDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(start));\n const endDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(end));\n\n const onFocusChange = useCallback(\n (focused: boolean) => {\n (focused ? onFocus : onBlur)?.({\n start: startDateRef.current,\n end: endDateRef.current\n });\n },\n [onFocus, onBlur]\n );\n\n const containerRef = useConsolidatedRef(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const onStartDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n if (end && selected && selected > end) {\n startDateRef.current = convertToCallbackParameter(prepareValue(end, 'start'));\n endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n onChange({\n start: convertToCallbackParameter(prepareValue(end, 'start')),\n end: convertToCallbackParameter(prepareValue(selected, 'end'))\n });\n } else {\n startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n endDateRef.current = convertToCallbackParameter(end);\n onChange({\n start: convertToCallbackParameter(prepareValue(selected, 'start')),\n end: convertToCallbackParameter(end)\n });\n }\n endDateHandle.current?.setOpen(true);\n };\n\n const onEndDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n if (start && selected && selected < start) {\n endDateRef.current = convertToCallbackParameter(prepareValue(start, 'end'));\n startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n onChange({\n end: convertToCallbackParameter(prepareValue(start, 'end')),\n start: convertToCallbackParameter(prepareValue(selected, 'start'))\n });\n } else {\n endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n startDateRef.current = convertToCallbackParameter(start);\n onChange({\n start: convertToCallbackParameter(start),\n end: convertToCallbackParameter(prepareValue(selected, 'end'))\n });\n }\n };\n\n const getSelectedRange = () => {\n const startDate = parseValueToDate(start);\n const endDate = parseValueToDate(end);\n\n if (startDate && endDate && startDate > endDate) return undefined;\n\n return {\n startDate,\n endDate\n };\n };\n\n const commonProps = {\n required,\n readOnly,\n disabled,\n min,\n max,\n status\n };\n\n return (\n <FormField\n testId={testIds}\n as={StyledDateRangeInput}\n {...restProps}\n ref={containerRef}\n container={{ wrap: 'nowrap' }}\n labelHidden={labelHidden}\n label={label}\n labelAs='legend'\n required={required}\n readOnly={readOnly}\n status={status}\n disabled={disabled}\n >\n <Flex container as={StyledRangeInputContainer}>\n <DateInput\n {...commonProps}\n testId={testIds.fromDate}\n value={value.start}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(start, end),\n selectedRange: getSelectedRange(),\n onChange: onStartDateChange\n }\n }}\n onBlur={changedValue => {\n const newValue = changedValue.state\n ? changedValue\n : convertToCallbackParameter(prepareValue(changedValue.valueAsTimestamp, 'start'));\n startDateRef.current = newValue;\n onChange({\n start: newValue,\n end: convertToCallbackParameter(prepareValue(end, 'end'))\n });\n }}\n additionalInfo={fromAdditionalInfo}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n autoFocus={autoFocus}\n />\n <DateInput\n {...commonProps}\n testId={testIds.toDate}\n value={value.end}\n handle={endDateHandle}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(end, start),\n selectedRange: getSelectedRange(),\n onChange: onEndDateChange\n }\n }}\n onBlur={changedValue => {\n const newValue = changedValue.state\n ? changedValue\n : convertToCallbackParameter(prepareValue(changedValue.valueAsTimestamp, 'end'));\n endDateRef.current = newValue;\n onChange({\n start: convertToCallbackParameter(prepareValue(start, 'start')),\n end: newValue\n });\n }}\n additionalInfo={toAdditionalInfo}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n />\n </Flex>\n </FormField>\n );\n }\n);\n\nexport default withTestIds(DateRangeInput, getDateRangeInputTestIds);\n"]}
1	+ {"version":3,"file":"DateRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, forwardRef, useCallback } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds } from '../../../hooks';\nimport type { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport type { FormControlProps } from '../../FormControl';\nimport Flex from '../../Flex';\nimport FormField, { StyledFormField } from '../../FormField/FormField';\nimport DateRangePicker from '../Picker/DateRangePicker';\nimport type DateTimeProps from '../DateTime.types';\nimport type {\n DateRangeCallbackParameter,\n DateTimeCallbackParameter,\n DateTimeProperties\n} from '../DateTime.types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport { getDateRangeInputTestIds } from '../DateTime.test-ids';\nimport { withTestIds } from '../../../utils';\n\nimport DateInput from './DateInput';\nimport type { DateInputHandleValue } from './DateInput';\nimport { parseToDate } from './utils';\nimport StyledDateInput from './DateTime.styles';\n\nexport interface DateRangeInputProps extends DateTimeProperties {\n /** Object of range boundaries. /\n value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n /\n Display additional column with week number in date picker popover.\n * @default false\n /\n showWeekNumber?: boolean;\n /* Pass a string or a fragment with an Icon and string for first part of DataRangeInput. /\n fromLabel?: FormControlProps['label'];\n /* Pass a string or a fragment with an Icon and string for second part of DataRangeInput. /\n toLabel?: FormControlProps['label'];\n /* Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for second part of DataRangeInput. /\n toAdditionalInfo?: FormControlProps['additionalInfo'];\n /* Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for first part of DataRangeInput. /\n fromAdditionalInfo?: FormControlProps['additionalInfo'];\n /* Callback fired when input value changes. /\n onChange: (value: DateRangeCallbackParameter) => void;\n /* Callback fired when the component gets focused. /\n onFocus?: (value: DateRangeCallbackParameter) => void;\n /* Callback fired when the component loses focus. /\n onBlur?: (value: DateRangeCallbackParameter) => void;\n /* Automatically focuses the input on render. */\n autoFocus?: boolean;\n}\n\nconst StyledDateRangeInput = styled.div<DateRangeInputProps>(props => {\n const {\n theme: {\n components: { input }\n }\n } = props;\n\n return css`\n border: 0;\n min-width: min-content;\n\n ${StyledFormField} {\n &:last-child > ${StyledDateInput} {\n margin-inline-start: -${input['border-width']};\n }\n & legend {\n align-self: center;\n }\n &:focus,\n &:hover,\n &:focus-within {\n z-index: 2;\n }\n }\n `;\n});\n\nStyledDateRangeInput.defaultProps = defaultThemeProp;\n\ntype DateRepresentable = string \| number \| Date;\n\nconst convertToCallbackParameter = (v?: number): DateTimeCallbackParameter => {\n return {\n valueAsISOString: v === undefined \|\| Number.isNaN(v) ? undefined : new Date(v).toISOString(),\n valueAsTimestamp: v\n };\n};\n\nconst prepareValue = (v: number \| undefined, type: 'start' \| 'end') => {\n if (v === undefined \|\| Number.isNaN(v)) {\n return v;\n }\n return type === 'start'\n ? new Date(v).setUTCHours(0, 0, 0, 0)\n : new Date(v).setUTCHours(23, 59, 59, 999);\n};\n\nconst getSelected = (first: number \| undefined, second: number \| undefined) => {\n const selected = first ?? second;\n return selected ? parseToDate(selected) : undefined;\n};\n\nconst parseValueToDate = (value: DateRepresentable \| undefined) => {\n return value ? parseToDate(value) : undefined;\n};\n\nconst DateRangeInput: FunctionComponent<DateRangeInputProps & ForwardProps> = forwardRef(\n function DateRangeInput(\n {\n testId,\n value = {},\n min,\n max,\n label,\n fromLabel,\n toLabel,\n labelHidden,\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n showWeekNumber,\n autoFocus,\n fromAdditionalInfo,\n toAdditionalInfo,\n ...restProps\n }: PropsWithoutRef<DateRangeInputProps>,\n ref: Ref<HTMLDivElement>\n ) {\n const testIds = useTestIds(testId, getDateRangeInputTestIds);\n const t = useI18n();\n const endDateHandle = useRef<DateInputHandleValue>(null);\n\n const start =\n value.start === undefined \|\| value.start === ''\n ? undefined\n : prepareValue(parseToDate(value.start).getTime(), 'start');\n const end =\n value.end === undefined \|\| value.end === ''\n ? undefined\n : prepareValue(parseToDate(value.end).getTime(), 'end');\n\n const startDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(start));\n const endDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(end));\n\n const onFocusChange = useCallback(\n (focused: boolean) => {\n (focused ? onFocus : onBlur)?.({\n start: startDateRef.current,\n end: endDateRef.current\n });\n },\n [onFocus, onBlur]\n );\n\n const containerRef = useConsolidatedRef(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const onStartDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n if (end && selected && selected > end) {\n startDateRef.current = convertToCallbackParameter(prepareValue(end, 'start'));\n endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n onChange({\n start: convertToCallbackParameter(prepareValue(end, 'start')),\n end: convertToCallbackParameter(prepareValue(selected, 'end'))\n });\n } else {\n startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n endDateRef.current = convertToCallbackParameter(end);\n onChange({\n start: convertToCallbackParameter(prepareValue(selected, 'start')),\n end: convertToCallbackParameter(end)\n });\n }\n endDateHandle.current?.setOpen(true);\n };\n\n const onEndDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n if (start && selected && selected < start) {\n endDateRef.current = convertToCallbackParameter(prepareValue(start, 'end'));\n startDateRef.current = convertToCallbackParameter(prepareValue(selected, 'start'));\n onChange({\n end: convertToCallbackParameter(prepareValue(start, 'end')),\n start: convertToCallbackParameter(prepareValue(selected, 'start'))\n });\n } else {\n endDateRef.current = convertToCallbackParameter(prepareValue(selected, 'end'));\n startDateRef.current = convertToCallbackParameter(start);\n onChange({\n start: convertToCallbackParameter(start),\n end: convertToCallbackParameter(prepareValue(selected, 'end'))\n });\n }\n };\n\n const getSelectedRange = () => {\n const startDate = parseValueToDate(start);\n const endDate = parseValueToDate(end);\n\n if (startDate && endDate && startDate > endDate) return undefined;\n\n return {\n startDate,\n endDate\n };\n };\n\n const commonProps = {\n required,\n readOnly,\n disabled,\n min,\n max,\n status\n };\n\n return (\n <FormField\n testId={testIds}\n as={StyledDateRangeInput}\n {...restProps}\n ref={containerRef}\n container={{ wrap: 'nowrap' }}\n labelHidden={labelHidden}\n label={label}\n labelAs='legend'\n required={required}\n readOnly={readOnly}\n status={status}\n disabled={disabled}\n >\n <Flex container as={StyledRangeInputContainer}>\n <DateInput\n testId={testIds.fromDate}\n {...commonProps}\n value={value.start}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(start, end),\n selectedRange: getSelectedRange(),\n onChange: onStartDateChange\n }\n }}\n onBlur={changedValue => {\n const newValue = changedValue.state\n ? changedValue\n : convertToCallbackParameter(prepareValue(changedValue.valueAsTimestamp, 'start'));\n startDateRef.current = newValue;\n onChange({\n start: newValue,\n end: convertToCallbackParameter(prepareValue(end, 'end'))\n });\n }}\n additionalInfo={fromAdditionalInfo}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n autoFocus={autoFocus}\n />\n <DateInput\n testId={testIds.toDate}\n {...commonProps}\n value={value.end}\n handle={endDateHandle}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(end, start),\n selectedRange: getSelectedRange(),\n onChange: onEndDateChange\n }\n }}\n onBlur={changedValue => {\n const newValue = changedValue.state\n ? changedValue\n : convertToCallbackParameter(prepareValue(changedValue.valueAsTimestamp, 'end'));\n endDateRef.current = newValue;\n onChange({\n start: convertToCallbackParameter(prepareValue(start, 'start')),\n end: newValue\n });\n }}\n additionalInfo={toAdditionalInfo}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n />\n </Flex>\n </FormField>\n );\n }\n);\n\nexport default withTestIds(DateRangeInput, getDateRangeInputTestIds);\n"]}

package/lib/components/DateTime/Input/DateTime.styles.d.ts CHANGED Viewed

@@ -2,6 +2,7 @@ export declare const BareInput: import("styled-components").StyledComponent<"inp
 export declare const StyledInputContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 declare const StyledDateTime: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export default StyledDateTime;
+export declare const StyledInputButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("../../Button").ButtonProps & import("../../..").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledClearNowButtonsContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledDialogContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledDatePickerDialog: import("styled-components").StyledComponent<import("react").FC<import("../../Dialog/Dialog.types").BaseDialogProps & {

package/lib/components/DateTime/Input/DateTime.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateTime.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTime.styles.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,SAAS,2GA0CpB,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGA+B/B,CAAC;AAIH,QAAA,MAAM,cAAc,~~yGAuDlB~~,CAAC;AAIH,eAAe,cAAc,CAAC;AAE9B,eAAO,MAAM,8BAA8B,yGAOzC,CAAC;AAIH,eAAO,MAAM,mBAAmB,yGAE/B,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;yGAElC,CAAC"}
1	+ {"version":3,"file":"DateTime.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTime.styles.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,SAAS,2GA0CpB,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGA+B/B,CAAC;AAIH,QAAA,MAAM,cAAc,yGAqClB,CAAC;AAIH,eAAe,cAAc,CAAC;AAE9B,eAAO,MAAM,iBAAiB,2MA4B5B,CAAC;AAIH,eAAO,MAAM,8BAA8B,yGAOzC,CAAC;AAIH,eAAO,MAAM,mBAAmB,yGAE/B,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;yGAElC,CAAC"}

package/lib/components/DateTime/Input/DateTime.styles.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import styled, { css } from 'styled-components';
 import { defaultThemeProp } from '../../../theme';
-import { StyledButton } from '../../Button';
 import { StyledPopover } from '../../Popover/Popover.styles';
 import { StyledSelect } from '../../Select/Select';
 import Dialog from '../../Dialog/Dialog';
 import { StyledFormField } from '../../FormField/FormField';
+import Button, { StyledButton } from '../../Button';
 export const BareInput = styled.input(({ theme, size }) => {
     return css `
     color: ${theme.components['form-control']['foreground-color']};
@@ -81,7 +81,7 @@ export const StyledInputContainer = styled.div(({ theme }) => {
 });
 StyledInputContainer.defaultProps = defaultThemeProp;
 const StyledDateTime = styled.div(props => {
-    const { theme: { base: { 'font-family': fontFamily, spacing, 'border-radius': baseBorderRadius, 'hit-area': hitArea }, components: { input: { height }, 'form-control': { 'border-radius': formBorderRadius, 'foreground-color': fgColor, 'border-width': borderWidth, ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow } } } } } = props;
+    const { theme: { base: { 'font-family': fontFamily, spacing, 'hit-area': hitArea }, components: { input: { height }, 'form-control': { ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow } } } } } = props;
     return css `
     min-width: min-content;
     height: ${height};
@@ -98,28 +98,36 @@ const StyledDateTime = styled.div(props => {
       box-shadow: ${shadow};
     }
-    > ${StyledButton} {
-      border-radius: calc(${baseBorderRadius} * ${formBorderRadius});
-      margin-inline-start: auto;
-      border: 0;
-      &:enabled {
-        color: ${fgColor};
-      }
-      min-height: calc(${height} - 2 * ${borderWidth});
-      height: calc(${height} - 2 * ${borderWidth});
-      @media (pointer: coarse) {
-        min-height: calc(${hitArea['finger-min']} - 2 * ${borderWidth});
-      }
-    }
     ${StyledPopover},
     ${StyledSelect} {
       font-family: ${fontFamily};
     }
+    > ${StyledButton} {
+      margin-inline-start: auto;
+    }
   `;
 });
 StyledDateTime.defaultProps = defaultThemeProp;
 export default StyledDateTime;
+export const StyledInputButton = styled(Button)(props => {
+    const { theme: { base: { 'border-radius': baseBorderRadius, 'hit-area': hitArea }, components: { input: { height }, 'form-control': { 'border-radius': formBorderRadius, 'foreground-color': fgColor, 'border-width': borderWidth } } } } = props;
+    return css `
+    border-radius: calc(${baseBorderRadius} * ${formBorderRadius});
+    border: 0;
+    &:enabled {
+      color: ${fgColor};
+    }
+    min-height: calc(${height} - 2 * ${borderWidth});
+    height: calc(${height} - 2 * ${borderWidth});
+    width: calc(${height} - 2 * ${borderWidth});
+    @media (pointer: coarse) {
+      min-height: calc(${hitArea['finger-min']} - 2 * ${borderWidth});
+      width: calc(${hitArea['finger-min']} - 2 * ${borderWidth});
+    }
+  `;
+});
+StyledInputButton.defaultProps = defaultThemeProp;
 export const StyledClearNowButtonsContainer = styled.div(({ theme }) => {
     const spacing = theme.base.spacing;
     return css `

package/lib/components/DateTime/Input/DateTime.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateTime.styles.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTime.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,~~YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,~~aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,MAAM,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;~~AAE5D~~,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;aACC,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,kBAAkB,CAAC;;;aAGpD,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCd,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,SAAS,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE1C,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3D,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,EAC7C,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;;;QAIJ,YAAY;;;;;;;;;;uBAUG,UAAU,CAAC,WAAW,CAAC;;;;uBAIvB,UAAU,CAAC,MAAM;4BACZ,OAAO,CAAC,oBAAoB,CAAC;;;;;;;GAOtD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IACxC,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,~~EACJ~~,aAAa,EAAE,UAAU,~~EACzB~~,OAAO,~~EACP,eAAe,~~EAAE,~~gBAAgB,EACjC,~~UAAU,EAAE,OAAO,~~EACpB~~,~~EACD~~,UAAU,EAAE,EACV,KAAK,EAAE,EAAE,MAAM,EAAE,EACjB,cAAc,EAAE,EACd,~~eAAe,EAAE,gBAAgB,EACjC,kBAAkB,EAAE,OAAO,EAC3B,cAAc,EAAE,WAAW,EAC3B,~~QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,EACrE,EACF,EACF,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;cAEE,MAAM;kBACF,OAAO,CAAC,WAAW,CAAC;;iBAErB,OAAO;;;oBAGJ,OAAO,CAAC,YAAY,CAAC;;;MAGnC,eAAe;sBACC,gBAAgB;oBAClB,MAAM;;;~~QAGlB~~,YAAY;~~4BACQ~~,gBAAgB,MAAM,gBAAgB~~;;;;iBAIjD~~,OAAO;;~~yBAEC~~,MAAM,UAAU,WAAW;~~qBAC~~/B,MAAM,UAAU,WAAW;;~~2BAErB~~,OAAO,CAAC,YAAY,CAAC,UAAU,WAAW~~;;;;MAI~~/D,~~aAAa;MACb~~,YAAY~~;qBACG~~,UAAU;;~~GAE5B~~,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,~~cAAc~~,CAAC,YAAY,GAAG,gBAAgB,CAAC;~~AAE/C~~,~~eAAe,cAAc,CAAC;AAE9B,~~MAAM,CAAC,MAAM,8BAA8B,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACrE,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC;IAEnC,OAAO,GAAG,CAAA;0BACc,OAAO;2BACN,OAAO;GAC/B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,8BAA8B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/D,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAE5C,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;;CAEnD,CAAC;AAEF,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport { ~~StyledButton } from '../../Button';\nimport {~~ StyledPopover } from '../../Popover/Popover.styles';\nimport { StyledSelect } from '../../Select/Select';\nimport Dialog from '../../Dialog/Dialog';\nimport { StyledFormField } from '../../FormField/FormField';\n\nexport const BareInput = styled.input(({ theme, size }) => {\n return css`\n color: ${theme.components['form-control']['foreground-color']};\n border: 0;\n outline: none;\n width: ${size}ch;\n background-color: transparent;\n text-align: end;\n margin-inline-end: 0.125rem;\n height: inherit;\n\n &::placeholder {\n font-size: 0.6em;\n text-align: center;\n transform: translateY(-0.35ex);\n }\n\n &:last-child {\n text-align: start;\n }\n\n &:nth-child(3) {\n text-align: start;\n &::placeholder {\n text-align: start;\n }\n }\n\n ::-webkit-outer-spin-button,\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n\n &[type='number'] {\n -moz-appearance: textfield;\n }\n\n :not(:first-child) {\n margin-inline-start: 0.125rem;\n }\n `;\n});\n\nBareInput.defaultProps = defaultThemeProp;\n\nexport const StyledInputContainer = styled.div(({ theme }) => {\n const {\n base: { palette, 'font-weight': fontWeight }\n } = theme;\n return css`\n height: inherit;\n overflow: hidden;\n\n > ${StyledSelect} {\n background-color: transparent;\n border-radius: 0;\n border: 0;\n color: currentcolor;\n opacity: 1;\n width: max-content;\n\n &:focus:not([readonly]):enabled {\n box-shadow: none;\n font-weight: ${fontWeight['semi-bold']};\n }\n\n option {\n font-weight: ${fontWeight.normal};\n background-color: ${palette['primary-background']};\n }\n\n @media (pointer: coarse) {\n min-height: inherit;\n }\n }\n `;\n});\n\nStyledInputContainer.defaultProps = defaultThemeProp;\n\nconst StyledDateTime = styled.div(props => {\n const {\n theme: {\n base: {\n 'font-family': fontFamily~~,\n~~ spacing~~,\n 'border-radius':~~ ~~baseBorderRadius,\n~~ 'hit-area': hitArea\n },\n components: {\n input: { height },\n 'form-control': {\n '~~border-radius'~~: ~~formBorderRadius,\n 'foreground-color': fgColor,\n 'border-width': borderWidth,\n ':~~focus': { 'border-color': focusBorderColor, 'box-shadow': shadow }\n }\n }\n }\n } = props;\n return css`\n min-width: min-content;\n height: ${height};\n min-height: ${hitArea['mouse-min']};\n outline: none;\n padding: 0 ${spacing};\n\n @media (pointer: coarse) {\n min-height: ${hitArea['finger-min']};\n }\n\n ${StyledFormField}:enabled > &:focus-within {\n border-color: ${focusBorderColor};\n box-shadow: ${shadow};\n }\n\n > ${StyledButton} {\n border-radius: calc(${baseBorderRadius} * ${formBorderRadius});\n ~~margin-inline-start: auto;\n~~ border: 0;\n &:enabled {\n color: ${fgColor};\n }\n min-height: calc(${height} - 2 * ${borderWidth});\n height: calc(${height} - 2 * ${borderWidth});\n @media (pointer: coarse) {\n min-height: calc(${hitArea['finger-min']} - 2 * ${borderWidth});\n ~~}\n }\n\n~~ ${~~StyledPopover~~}~~,\n ${StyledSelect}~~ ~~{\n font~~-~~family:~~ ${~~fontFamily~~};\n }\n `;\n});\n\~~nStyledDateTime~~.defaultProps = defaultThemeProp;\n\nexport ~~default StyledDateTime;\n\nexport~~ const StyledClearNowButtonsContainer = styled.div(({ theme }) => {\n const spacing = theme.base.spacing;\n\n return css`\n padding-block: calc(${spacing} * 1.5);\n padding-inline: calc(${spacing} * 1.5);\n `;\n});\n\nStyledClearNowButtonsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledDialogContent = styled.div`\n overflow: auto;\n`;\n\nexport const StyledDatePickerDialog = styled(Dialog)`\n min-width: unset;\n`;\n\nStyledDatePickerDialog.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"DateTime.styles.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTime.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport { StyledPopover } from '../../Popover/Popover.styles';\nimport { StyledSelect } from '../../Select/Select';\nimport Dialog from '../../Dialog/Dialog';\nimport { StyledFormField } from '../../FormField/FormField';\nimport Button, { StyledButton } from '../../Button';\n\nexport const BareInput = styled.input(({ theme, size }) => {\n return css`\n color: ${theme.components['form-control']['foreground-color']};\n border: 0;\n outline: none;\n width: ${size}ch;\n background-color: transparent;\n text-align: end;\n margin-inline-end: 0.125rem;\n height: inherit;\n\n &::placeholder {\n font-size: 0.6em;\n text-align: center;\n transform: translateY(-0.35ex);\n }\n\n &:last-child {\n text-align: start;\n }\n\n &:nth-child(3) {\n text-align: start;\n &::placeholder {\n text-align: start;\n }\n }\n\n ::-webkit-outer-spin-button,\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n\n &[type='number'] {\n -moz-appearance: textfield;\n }\n\n :not(:first-child) {\n margin-inline-start: 0.125rem;\n }\n `;\n});\n\nBareInput.defaultProps = defaultThemeProp;\n\nexport const StyledInputContainer = styled.div(({ theme }) => {\n const {\n base: { palette, 'font-weight': fontWeight }\n } = theme;\n return css`\n height: inherit;\n overflow: hidden;\n\n > ${StyledSelect} {\n background-color: transparent;\n border-radius: 0;\n border: 0;\n color: currentcolor;\n opacity: 1;\n width: max-content;\n\n &:focus:not([readonly]):enabled {\n box-shadow: none;\n font-weight: ${fontWeight['semi-bold']};\n }\n\n option {\n font-weight: ${fontWeight.normal};\n background-color: ${palette['primary-background']};\n }\n\n @media (pointer: coarse) {\n min-height: inherit;\n }\n }\n `;\n});\n\nStyledInputContainer.defaultProps = defaultThemeProp;\n\nconst StyledDateTime = styled.div(props => {\n const {\n theme: {\n base: { 'font-family': fontFamily, spacing, 'hit-area': hitArea },\n components: {\n input: { height },\n 'form-control': {\n ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow }\n }\n }\n }\n } = props;\n return css`\n min-width: min-content;\n height: ${height};\n min-height: ${hitArea['mouse-min']};\n outline: none;\n padding: 0 ${spacing};\n\n @media (pointer: coarse) {\n min-height: ${hitArea['finger-min']};\n }\n\n ${StyledFormField}:enabled > &:focus-within {\n border-color: ${focusBorderColor};\n box-shadow: ${shadow};\n }\n\n ${StyledPopover},\n ${StyledSelect} {\n font-family: ${fontFamily};\n }\n\n > ${StyledButton} {\n margin-inline-start: auto;\n }\n `;\n});\n\nStyledDateTime.defaultProps = defaultThemeProp;\n\nexport default StyledDateTime;\n\nexport const StyledInputButton = styled(Button)(props => {\n const {\n theme: {\n base: { 'border-radius': baseBorderRadius, 'hit-area': hitArea },\n components: {\n input: { height },\n 'form-control': {\n 'border-radius': formBorderRadius,\n 'foreground-color': fgColor,\n 'border-width': borderWidth\n }\n }\n }\n } = props;\n return css`\n border-radius: calc(${baseBorderRadius} * ${formBorderRadius});\n border: 0;\n &:enabled {\n color: ${fgColor};\n }\n min-height: calc(${height} - 2 * ${borderWidth});\n height: calc(${height} - 2 * ${borderWidth});\n width: calc(${height} - 2 * ${borderWidth});\n @media (pointer: coarse) {\n min-height: calc(${hitArea['finger-min']} - 2 * ${borderWidth});\n width: calc(${hitArea['finger-min']} - 2 * ${borderWidth});\n }\n `;\n});\n\nStyledInputButton.defaultProps = defaultThemeProp;\n\nexport const StyledClearNowButtonsContainer = styled.div(({ theme }) => {\n const spacing = theme.base.spacing;\n\n return css`\n padding-block: calc(${spacing} * 1.5);\n padding-inline: calc(${spacing} * 1.5);\n `;\n});\n\nStyledClearNowButtonsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledDialogContent = styled.div`\n overflow: auto;\n`;\n\nexport const StyledDatePickerDialog = styled(Dialog)`\n min-width: unset;\n`;\n\nStyledDatePickerDialog.defaultProps = defaultThemeProp;\n"]}

package/lib/components/DateTime/Input/DateTimeInput.d.ts CHANGED Viewed

@@ -30,7 +30,7 @@ export interface DateTimeInputProps extends DateTimeProps {
 export declare const StyledDateTimeInput: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, DateTimeInputProps, never>;
 export declare const convertToCallbackParameter: (date: Date, parts: DateTimeParts<string | undefined>) => DateTimeCallbackParameter;
 declare const _default: FunctionComponent<DateTimeInputProps & ForwardProps> & {
-    getTestIds: (testIdProp?: string | undefined) => import("../../../types").TestIdsRecord<readonly ["control-day", "control-month", "control-year", "control-hour", "control-minute", "control-second", "control-period", "open-close-picker", "clear-current-date-and-time", "set-current-date-and-time", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
+    getTestIds: (testIdProp?: string | null | undefined) => import("../../../types").TestIdsRecord<readonly ["control-day", "control-month", "control-year", "control-hour", "control-minute", "control-second", "control-period", "open-close-picker", "discard-changes", "apply-changes", "clear-current-date-and-time", "set-current-date-and-time", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
 };
 export default _default;
 //# sourceMappingURL=DateTimeInput.d.ts.map

package/lib/components/DateTime/Input/DateTimeInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTimeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAgB1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;~~AAqBnE~~,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,OAAO,KAAK,EAAa,aAAa,EAAa,MAAM,uBAAuB,CAAC;AAIjF,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,+DAA+D;IAC/D,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,mBAAmB,yHAK9B,CAAC;AAwBH,eAAO,MAAM,0BAA0B,SAC/B,IAAI,SACH,cAAc,MAAM,GAAG,SAAS,CAAC,KACvC,yBAgEF,CAAC;;;;~~AAojBF~~,wBAAmE"}
1	+ {"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTimeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAgB1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAuBnE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,OAAO,KAAK,EAAa,aAAa,EAAa,MAAM,uBAAuB,CAAC;AAIjF,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,+DAA+D;IAC/D,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,mBAAmB,yHAK9B,CAAC;AAwBH,eAAO,MAAM,0BAA0B,SAC/B,IAAI,SACH,cAAc,MAAM,GAAG,SAAS,CAAC,KACvC,yBAgEF,CAAC;;;;AAskBF,wBAAmE"}

package/lib/components/DateTime/Input/DateTimeInput.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { forwardRef, useEffect, useRef } from 'react';
+import { forwardRef, useEffect, useRef, useState } from 'react';
 import styled, { css } from 'styled-components';
 import { StyledFormControl } from '../../FormControl';
 import FormField from '../../FormField';
@@ -10,9 +10,10 @@ import Button from '../../Button';
 import Icon, { registerIcon } from '../../Icon';
 import * as calendarIcon from '../../Icon/icons/calendar.icon';
 import DatePicker from '../Picker/DatePicker';
-import { hasProp, cap, withTestIds } from '../../../utils';
+import { hasProp, withTestIds } from '../../../utils';
 import { getDateTimeInputTestIds } from '../DateTime.test-ids';
-import StyledDateTime, { StyledClearNowButtonsContainer, StyledDatePickerDialog, StyledDialogContent, StyledInputContainer } from './DateTime.styles';
+import { getAdjustedUTCDateTime } from '../utils';
+import StyledDateTime, { StyledClearNowButtonsContainer, StyledDatePickerDialog, StyledDialogContent, StyledInputButton, StyledInputContainer } from './DateTime.styles';
 import { generatePickerButtonAriaLabel, getDateFormat, getTimeOptions, is12HClockFormat, parsePastedTextToDate, parseToDate, validateDate, validateDateTime, validateTime } from './utils';
 import useAutoFocusNextInput from './useAutoFocusNextInput';
 import PartInput from './PartInput';
@@ -65,7 +66,7 @@ export const convertToCallbackParameter = (date, parts) => {
             };
         }
         resultDate.setUTCFullYear(Number(year), Number(monthIndex), Number(day));
-        resultDate.setUTCHours(is12h ? convertTo24h(Number(hour), meridiem) : Number(hour), Number(minute), Number(second), date.getUTCMilliseconds());
+        resultDate.setUTCHours(is12h ? convertTo24h(Number(hour), meridiem) : Number(hour), Number(minute), Number(second), resultDate.getUTCMilliseconds());
         return {
             valueAsISOString: resultDate.toISOString(),
             valueAsTimestamp: resultDate.getTime()
@@ -125,6 +126,7 @@ const DateTimeInput = forwardRef(function DateTimeInput(props, ref) {
             meridiemSelectRef.current.value = getMeridiem(dateTime?.getUTCHours());
         }
     }, [is12h, dateTime?.getUTCHours()]);
+    const [pickerSelection, setPickerSelection] = useState(undefined);
     const pickDateParts = () => {
         return {
             day: dayInputRef.current?.value || undefined,
@@ -167,7 +169,7 @@ const DateTimeInput = forwardRef(function DateTimeInput(props, ref) {
             const minute = Number(parts.minute);
             const second = parts.second ? Number(parts.second) : 0;
             // make a copy of current value to avoid mutation
-            const current = dateTime !== undefined ? new Date(dateTime) : new Date();
+            const current = dateTime !== undefined ? new Date(dateTime) : getAdjustedUTCDateTime();
             return validateTime(hour, minute, second, 0, is12h)
                 ? new Date(current.setUTCHours(is12h ? convertTo24h(hour, parts.dayPeriod) : hour, minute, second, dateTime?.getUTCMilliseconds() || 0))
                 : undefined;
@@ -229,8 +231,7 @@ const DateTimeInput = forwardRef(function DateTimeInput(props, ref) {
         const date = parsePastedTextToDate(text, locale, dateTime || new Date());
         if (date) {
             e.preventDefault();
-            setInputValue(date);
-            onInputChange();
+            setPickerSelection(date);
         }
     };
     const inputContainerRef = useRef(null);
@@ -246,8 +247,10 @@ const DateTimeInput = forwardRef(function DateTimeInput(props, ref) {
     };
     // autoclose picker on focusing out
     useOuterEvent('focusin', [containerRef], e => {
-        if (containerRef.current?.contains(e.relatedTarget))
+        if (containerRef.current?.contains(e.relatedTarget)) {
+            setPickerSelection(undefined);
             setOpen(false);
+        }
     });
     const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });
     const DayInput = (_jsx(PartInput, { "data-testid": testIds.controlDay, placeholder: t('day_placeholder'), "aria-label": displayNames.of('day'), value: dateTime?.getUTCDate(), onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, min: 1, max: 31, ref: dayInputRef }, 'day'));
@@ -300,29 +303,32 @@ const DateTimeInput = forwardRef(function DateTimeInput(props, ref) {
             orderedRefs[0].current?.focus();
     }, [autoFocus]);
     useFocusWithin([containerRef], onFocusChange);
-    const Picker = (_jsxs(_Fragment, { children: [_jsx(Button, { "data-testid": testIds.openClosePicker, variant: 'simple', icon: true, ref: setButtonEl, onClick: () => {
+    const Picker = (_jsxs(_Fragment, { children: [_jsx(StyledInputButton, { "data-testid": testIds.openClosePicker, variant: 'simple', icon: true, ref: setButtonEl, onClick: () => {
                     setOpen(cur => !cur);
-                }, "aria-label": generatePickerButtonAriaLabel(currentlySelectedDateTime(), 'datetime', locale, t, open), readOnly: readOnly, disabled: disabled, children: _jsx(Icon, { name: 'calendar' }) }), open && buttonEl && (_jsx(StyledDatePickerDialog, { ref: setPopoverRef, target: buttonEl, placement: 'bottom-end', ariaLabel: t('choose_date_and_time'), children: _jsxs(Flex, { container: { direction: 'column' }, as: StyledDialogContent, children: [_jsx(DatePicker, { testId: testIds.root, mode: 'datetime', selected: currentlySelectedDateTime(), onChange: selected => {
-                                setInputValue(selected);
-                                onInputChange();
-                                setTimeout(() => buttonEl?.focus());
-                            }, min: min, max: max, showWeekNumber: showWeekNumber, pickerInterval: pickerInterval, withSeconds: withSeconds, clockFormat: clockFormat }), _jsxs(Flex, { as: StyledClearNowButtonsContainer, container: { justify: 'between' }, children: [_jsx(Button, { "data-testid": testIds.clearCurrentDateAndTime, "aria-label": t('clear_current_date_and_time'), onClick: () => {
-                                        setInputValue(undefined);
+                }, "aria-label": generatePickerButtonAriaLabel(currentlySelectedDateTime(), 'datetime', locale, t, open), readOnly: readOnly, disabled: disabled, children: _jsx(Icon, { name: 'calendar' }) }), open && buttonEl && (_jsx(StyledDatePickerDialog, { ref: setPopoverRef, target: buttonEl, placement: 'bottom-end', "aria-label": t('choose_date_and_time'), children: _jsxs(Flex, { container: { direction: 'column' }, as: StyledDialogContent, children: [_jsx(DatePicker, { testId: testIds.root, mode: 'datetime', selected: currentlySelectedDateTime(), onChange: selected => {
+                                setPickerSelection(selected);
+                            }, min: min, max: max, showWeekNumber: showWeekNumber, pickerInterval: pickerInterval, withSeconds: withSeconds, clockFormat: clockFormat }), _jsxs(Flex, { as: StyledClearNowButtonsContainer, container: { justify: 'between' }, children: [_jsx(Button, { "data-testid": testIds.discardChanges, "aria-label": t('cancel'), onClick: () => {
+                                        if (!dayInputRef.current?.value) {
+                                            setPickerSelection(undefined);
+                                        }
                                         setOpen(false);
                                         setTimeout(() => buttonEl?.focus());
                                         onInputChange();
-                                    }, children: t('clear') }), _jsx(Button, { "data-testid": testIds.setCurrentDateAndTime, "aria-label": t('set_current_date_and_time_a11y'), onClick: () => {
-                                        const now = new Date();
-                                        now.setTime(now.getTime() - now.getTimezoneOffset() * 60000);
-                                        setInputValue(now);
+                                    }, children: t('cancel') }), _jsx(Button, { "data-testid": testIds.applyChanges, "aria-label": t('apply'), variant: 'primary', onClick: () => {
+                                        setInputValue(pickerSelection);
                                         setOpen(false);
                                         setTimeout(() => buttonEl?.focus());
                                         onInputChange();
-                                    }, children: cap(new Intl.RelativeTimeFormat(locale, { numeric: 'auto' }).format(0, 'second')) })] })] }) }))] }));
-    const Comp = (_jsxs(Flex, { "data-testid": testIds.root, as: StyledDateTimeInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ref: containerRef, onClick: (e) => {
+                                    }, children: t('apply') })] })] }) }))] }));
+    const Comp = (_jsxs(Flex, { "data-testid": testIds.root, as: StyledDateTimeInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap', justify: 'between' }, status: status, readOnly: readOnly, disabled: disabled, ref: containerRef, onClick: (e) => {
             if (e.target === containerRef.current)
                 orderedRefs[0].current?.focus();
-        }, ...restProps, children: [_jsxs(Flex, { ref: inputContainerRef, as: StyledInputContainer, container: { alignItems: 'center', wrap: 'wrap' }, onPaste: onPaste, children: [dateInputs, timeInputs] }), !readOnly && Picker] }));
+        }, ...restProps, children: [_jsxs(Flex, { ref: inputContainerRef, as: StyledInputContainer, container: { alignItems: 'center', wrap: 'wrap' }, onPaste: onPaste, children: [dateInputs, timeInputs] }), _jsxs(Flex, { container: true, children: [!readOnly && dayInputRef.current?.value && (_jsx(StyledInputButton, { icon: true, onClick: () => {
+                            setPickerSelection(undefined);
+                            setInputValue(undefined);
+                            setTimeout(() => buttonEl?.focus());
+                            onInputChange();
+                        }, variant: 'simple', compact: true, "aria-label": t('clear_current_date_and_time'), label: t('clear'), "data-testid": testIds.clearCurrentDateAndTime, children: _jsx(Icon, { name: 'times' }) })), !readOnly && Picker] })] }));
     useAutoFocusNextInput(orderedRefs);
     return label ? (_jsx(FormField, { testId: testIds, as: StyledDateTimeFieldset, labelAs: 'legend', "aria-labelledby": id, ref: ref, label: label, labelHidden: labelHidden, id: id, info: info, status: status, required: required, disabled: disabled, onResolveSuggestion: onResolveSuggestion, additionalInfo: additionalInfo, children: Comp })) : (Comp);
 });