npm - @pega/cosmos-react-core - Versions diffs - 9.0.0-build.27.4 → 9.0.0-build.27.6 - Mend

@pega/cosmos-react-core 9.0.0-build.27.4 → 9.0.0-build.27.6

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 (44) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAIrE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAI1D,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAW3B,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D,kCAAkC;IAClC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,GAAG,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;KAAE,CAAC;IACzE;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,6FAA6F;IAC7F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,uHAAuH;IACvH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACtD,sHAAsH;IACtH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACrD,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;;;;~~AA0QD~~,wBAAqE"}
1	+ {"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAIrE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAI1D,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAW3B,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D,kCAAkC;IAClC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,GAAG,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;KAAE,CAAC;IACzE;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,6FAA6F;IAC7F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,uHAAuH;IACvH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACtD,sHAAsH;IACtH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACrD,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;;;;AA+QD,wBAAqE"}

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useRef, forwardRef, useCallback } from 'react';
+import { useRef, forwardRef, useCallback, useLayoutEffect } from 'react';
 import styled, { css } from 'styled-components';
 import { useConsolidatedRef, useFocusWithin, useI18n, useTestIds, useUID } from '../../../hooks';
 import { defaultThemeProp } from '../../../theme';
@@ -70,6 +70,10 @@ const DateRangeInput = forwardRef(function DateRangeInput({ testId, value = {},
         : prepareValue(parseToDate(value.end).getTime(), 'end');
     const startDateRef = useRef(convertToCallbackParameter(start));
     const endDateRef = useRef(convertToCallbackParameter(end));
+    useLayoutEffect(() => {
+        startDateRef.current = convertToCallbackParameter(start);
+        endDateRef.current = convertToCallbackParameter(end);
+    }, [start, end]);
     const onFocusChange = useCallback((focused) => {
         (focused ? onFocus : onBlur)?.({
             start: startDateRef.current,

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, useUID } 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 { createClassName, withTestIds } from '../../../utils';\nimport HiddenText from '../../HiddenText';\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.fieldset<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\n & legend {\n align-self: center;\n }\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 timeZone,\n autoFocus,\n fromAdditionalInfo,\n toAdditionalInfo,\n className,\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 showWeekNumber,\n timeZone\n };\n\n const descriptionId = useUID();\n\n return (\n <>\n <FormField\n testId={testIds}\n as={StyledDateRangeInput}\n {...restProps}\n ref={containerRef}\n container={{ wrap: 'nowrap' }}\n labelHidden={labelHidden}\n label={label}\n required={required}\n readOnly={readOnly}\n status={status}\n disabled={disabled}\n aria-describedby={descriptionId}\n >\n <Flex\n container\n as={StyledRangeInputContainer}\n className={createClassName('date-range-input', className, { status })}\n >\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(\n prepareValue(changedValue.valueAsTimestamp, 'start')\n );\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 <HiddenText id={descriptionId}>{t('range_input')}</HiddenText>\n </>\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, useLayoutEffect } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds, useUID } 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 { createClassName, withTestIds } from '../../../utils';\nimport HiddenText from '../../HiddenText';\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.fieldset<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\n & legend {\n align-self: center;\n }\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 timeZone,\n autoFocus,\n fromAdditionalInfo,\n toAdditionalInfo,\n className,\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 useLayoutEffect(() => {\n startDateRef.current = convertToCallbackParameter(start);\n endDateRef.current = convertToCallbackParameter(end);\n }, [start, 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 showWeekNumber,\n timeZone\n };\n\n const descriptionId = useUID();\n\n return (\n <>\n <FormField\n testId={testIds}\n as={StyledDateRangeInput}\n {...restProps}\n ref={containerRef}\n container={{ wrap: 'nowrap' }}\n labelHidden={labelHidden}\n label={label}\n required={required}\n readOnly={readOnly}\n status={status}\n disabled={disabled}\n aria-describedby={descriptionId}\n >\n <Flex\n container\n as={StyledRangeInputContainer}\n className={createClassName('date-range-input', className, { status })}\n >\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(\n prepareValue(changedValue.valueAsTimestamp, 'start')\n );\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 <HiddenText id={descriptionId}>{t('range_input')}</HiddenText>\n </>\n );\n }\n);\n\nexport default withTestIds(DateRangeInput, getDateRangeInputTestIds);\n"]}

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

@@ -27,23 +27,23 @@ export const StyledMonthInput = styled(StyledDateTime) `
       z-index: 1;
     }
-    :first-child {
+    &:first-child {
       flex-grow: 1;
     }
-    :first-child > ${StyledSelect} {
+    &:first-child > ${StyledSelect} {
       border-start-end-radius: 0;
       border-end-end-radius: 0;
     }
-    :last-child > ${StyledSelect} {
+    &:last-child > ${StyledSelect} {
       width: max-content;
       margin-inline-start: -0.0625rem;
       border-start-start-radius: 0;
       border-end-start-radius: 0;
     }
-    :first-child > ${StyledFormFieldInfo}, :last-child > ${StyledFormFieldInfo} {
+    &:first-child > ${StyledFormFieldInfo}, &:last-child > ${StyledFormFieldInfo} {
       display: none;
     }
   }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"MonthInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/MonthInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, forwardRef, useEffect, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport type { ForwardProps } from '../../../types';\nimport { cap, createClassName, range, withTestIds } from '../../../utils';\nimport { useConfiguration, useConsolidatedRef, useFocusWithin, useTestIds } from '../../../hooks';\nimport FormField from '../../FormField';\nimport Select, { Option } from '../../Select';\nimport { StyledSelect } from '../../Select/Select';\nimport Flex from '../../Flex';\nimport { StyledFormControl } from '../../FormControl';\nimport type { FormControlProps } from '../../FormControl';\nimport type DateTimeProps from '../DateTime.types';\nimport type { DateTimeCallbackParameter } from '../DateTime.types';\nimport { getMonthInputTestIds } from '../DateTime.test-ids';\nimport { StyledFormField, StyledFormFieldInfo } from '../../FormField/FormField';\n\nimport { parseToDate, getLocalizedMonths, getLocalizedYear } from './utils';\nimport StyledDateTime from './DateTime.styles';\nimport type { DateParts } from './DateTimeInput.types';\n\nexport interface MonthInputProps extends DateTimeProps {\n /*\n Toggles visibility of inner labels form Month and Year\n * @default true\n /\n innerLabelsHidden?: boolean;\n /* Pass a heading and content to show additional information on the field. */\n additionalInfo?: FormControlProps['additionalInfo'];\n}\n\nexport const StyledMonthInput = styled(StyledDateTime)<MonthInputProps>`\n padding: 0;\n border: 0;\n background-color: transparent;\n\n ${StyledFormField}:enabled > &:focus-within {\n box-shadow: none;\n }\n\n ${StyledFormField} {\n > ${StyledSelect}:focus {\n z-index: 1;\n }\n\n :first-child {\n flex-grow: 1;\n }\n\n :first-child > ${StyledSelect} {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n\n :last-child > ${StyledSelect} {\n width: max-content;\n margin-inline-start: -0.0625rem;\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n\n :first-child > ${StyledFormFieldInfo}, :last-child > ${StyledFormFieldInfo} {\n display: none;\n }\n }\n`;\n\nStyledMonthInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n date: Date,\n { month, year }: DateParts<string \| undefined>\n): DateTimeCallbackParameter => {\n if ([month, year].every(Boolean)) {\n const resultDate = new Date(date);\n resultDate.setUTCFullYear(Number(year), Number(month));\n // handle month overflowing\n if (resultDate.getUTCMonth() !== Number(month)) {\n resultDate.setUTCDate(0);\n }\n return {\n valueAsISOString: resultDate.toISOString(),\n valueAsTimestamp: resultDate.getTime()\n };\n }\n if ([year, month].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 MonthInput: FunctionComponent<MonthInputProps & ForwardProps> = forwardRef(\n function MonthInput(props: PropsWithoutRef<MonthInputProps>, ref: Ref<HTMLFieldSetElement>) {\n const { locale } = useConfiguration();\n const {\n testId,\n value,\n min,\n max,\n id,\n label,\n labelHidden,\n innerLabelsHidden = true,\n info,\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n autoFocus,\n additionalInfo,\n className,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getMonthInputTestIds);\n\n const date = value ? parseToDate(value) : undefined;\n\n const dateToGetFullYearFrom = date ?? new Date();\n\n const minDate = parseToDate(\n min ??\n new Date(dateToGetFullYearFrom).setUTCFullYear(dateToGetFullYearFrom.getUTCFullYear() - 10)\n );\n const maxDate = parseToDate(\n max ??\n new Date(dateToGetFullYearFrom).setUTCFullYear(dateToGetFullYearFrom.getUTCFullYear() + 10)\n );\n\n const minYear = minDate.getUTCFullYear();\n const maxYear = maxDate.getUTCFullYear();\n\n const years = range(minYear, maxYear);\n const months = useMemo(() => getLocalizedMonths(locale), [locale]);\n\n const monthSelectRef = useRef<HTMLSelectElement>(null);\n const yearSelectRef = useRef<HTMLSelectElement>(null);\n\n useEffect(() => {\n if (monthSelectRef.current && yearSelectRef.current) {\n monthSelectRef.current.value = date?.getUTCMonth().toString() ?? '';\n yearSelectRef.current.value = date?.getUTCFullYear().toString() ?? '';\n }\n }, [date?.toDateString()]);\n\n const pickParts = (): DateParts<string \| undefined> => {\n return {\n month: monthSelectRef.current?.value \|\| '',\n year: yearSelectRef.current?.value \|\| ''\n };\n };\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 else if (onBlur && !focused) onBlur(callbackParam);\n };\n\n const onSelectChange = () => {\n onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));\n };\n\n const containerRef = useConsolidatedRef<HTMLElement>(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const isMonthOptionDisabled = (monthIndex: number) => {\n const year =\n yearSelectRef.current && yearSelectRef.current.value\n ? parseInt(yearSelectRef.current.value, 10)\n : new Date().getUTCFullYear();\n\n return (\n (year === minDate.getUTCFullYear() && monthIndex < minDate.getUTCMonth()) \|\|\n (year === maxDate.getUTCFullYear() && monthIndex > maxDate.getUTCMonth())\n );\n };\n\n const monthOptions = months.map((month, index) => (\n <Option disabled={isMonthOptionDisabled(index)} key={month} value={index.toString()}>\n {months[index]}\n </Option>\n ));\n const yearOptions = years.map(year => (\n <Option key={year.toString()} value={year.toString()}>\n {getLocalizedYear(year, locale).toString()}\n </Option>\n ));\n\n const displayNames = useMemo(\n () =>\n new Intl.DisplayNames(locale, {\n style: 'long',\n type: 'dateTimeField'\n }) as Intl.DateTimeDisplayNames,\n [locale]\n );\n\n const Month = (\n <Select\n data-testid={testIds.controlMonth}\n label={cap(displayNames.of('month'))}\n labelHidden={innerLabelsHidden}\n key='month'\n ref={monthSelectRef}\n aria-label={displayNames.of('month')}\n readOnly={readOnly}\n required={required}\n onChange={onSelectChange}\n status={status}\n disabled={disabled}\n autoFocus={autoFocus}\n >\n {!required && <Option key='null'> </Option>}\n {monthOptions}\n </Select>\n );\n\n const Year = (\n <Select\n data-testid={testIds.controlYear}\n label={cap(displayNames.of('year'))}\n labelHidden={innerLabelsHidden}\n key='year'\n ref={yearSelectRef}\n aria-label={displayNames.of('year')}\n readOnly={readOnly}\n required={required}\n onChange={onSelectChange}\n status={status}\n disabled={disabled}\n >\n {!required && <Option key='null'> </Option>}\n {yearOptions}\n </Select>\n );\n\n const Comp = (\n <Flex\n as={StyledMonthInput}\n forwardedAs={StyledFormControl}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n disabled={disabled}\n readOnly={readOnly}\n {...restProps}\n className={createClassName('month-input', className)}\n >\n {Month}\n {Year}\n </Flex>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n as='fieldset'\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n readOnly={readOnly}\n status={status}\n required={required}\n disabled={disabled}\n additionalInfo={additionalInfo}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default withTestIds(MonthInput, getMonthInputTestIds);\n"]}
1	+ {"version":3,"file":"MonthInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/MonthInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, forwardRef, useEffect, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport type { ForwardProps } from '../../../types';\nimport { cap, createClassName, range, withTestIds } from '../../../utils';\nimport { useConfiguration, useConsolidatedRef, useFocusWithin, useTestIds } from '../../../hooks';\nimport FormField from '../../FormField';\nimport Select, { Option } from '../../Select';\nimport { StyledSelect } from '../../Select/Select';\nimport Flex from '../../Flex';\nimport { StyledFormControl } from '../../FormControl';\nimport type { FormControlProps } from '../../FormControl';\nimport type DateTimeProps from '../DateTime.types';\nimport type { DateTimeCallbackParameter } from '../DateTime.types';\nimport { getMonthInputTestIds } from '../DateTime.test-ids';\nimport { StyledFormField, StyledFormFieldInfo } from '../../FormField/FormField';\n\nimport { parseToDate, getLocalizedMonths, getLocalizedYear } from './utils';\nimport StyledDateTime from './DateTime.styles';\nimport type { DateParts } from './DateTimeInput.types';\n\nexport interface MonthInputProps extends DateTimeProps {\n /*\n Toggles visibility of inner labels form Month and Year\n * @default true\n /\n innerLabelsHidden?: boolean;\n /* Pass a heading and content to show additional information on the field. */\n additionalInfo?: FormControlProps['additionalInfo'];\n}\n\nexport const StyledMonthInput = styled(StyledDateTime)<MonthInputProps>`\n padding: 0;\n border: 0;\n background-color: transparent;\n\n ${StyledFormField}:enabled > &:focus-within {\n box-shadow: none;\n }\n\n ${StyledFormField} {\n > ${StyledSelect}:focus {\n z-index: 1;\n }\n\n &:first-child {\n flex-grow: 1;\n }\n\n &:first-child > ${StyledSelect} {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n\n &:last-child > ${StyledSelect} {\n width: max-content;\n margin-inline-start: -0.0625rem;\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n\n &:first-child > ${StyledFormFieldInfo}, &:last-child > ${StyledFormFieldInfo} {\n display: none;\n }\n }\n`;\n\nStyledMonthInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n date: Date,\n { month, year }: DateParts<string \| undefined>\n): DateTimeCallbackParameter => {\n if ([month, year].every(Boolean)) {\n const resultDate = new Date(date);\n resultDate.setUTCFullYear(Number(year), Number(month));\n // handle month overflowing\n if (resultDate.getUTCMonth() !== Number(month)) {\n resultDate.setUTCDate(0);\n }\n return {\n valueAsISOString: resultDate.toISOString(),\n valueAsTimestamp: resultDate.getTime()\n };\n }\n if ([year, month].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 MonthInput: FunctionComponent<MonthInputProps & ForwardProps> = forwardRef(\n function MonthInput(props: PropsWithoutRef<MonthInputProps>, ref: Ref<HTMLFieldSetElement>) {\n const { locale } = useConfiguration();\n const {\n testId,\n value,\n min,\n max,\n id,\n label,\n labelHidden,\n innerLabelsHidden = true,\n info,\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n autoFocus,\n additionalInfo,\n className,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getMonthInputTestIds);\n\n const date = value ? parseToDate(value) : undefined;\n\n const dateToGetFullYearFrom = date ?? new Date();\n\n const minDate = parseToDate(\n min ??\n new Date(dateToGetFullYearFrom).setUTCFullYear(dateToGetFullYearFrom.getUTCFullYear() - 10)\n );\n const maxDate = parseToDate(\n max ??\n new Date(dateToGetFullYearFrom).setUTCFullYear(dateToGetFullYearFrom.getUTCFullYear() + 10)\n );\n\n const minYear = minDate.getUTCFullYear();\n const maxYear = maxDate.getUTCFullYear();\n\n const years = range(minYear, maxYear);\n const months = useMemo(() => getLocalizedMonths(locale), [locale]);\n\n const monthSelectRef = useRef<HTMLSelectElement>(null);\n const yearSelectRef = useRef<HTMLSelectElement>(null);\n\n useEffect(() => {\n if (monthSelectRef.current && yearSelectRef.current) {\n monthSelectRef.current.value = date?.getUTCMonth().toString() ?? '';\n yearSelectRef.current.value = date?.getUTCFullYear().toString() ?? '';\n }\n }, [date?.toDateString()]);\n\n const pickParts = (): DateParts<string \| undefined> => {\n return {\n month: monthSelectRef.current?.value \|\| '',\n year: yearSelectRef.current?.value \|\| ''\n };\n };\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 else if (onBlur && !focused) onBlur(callbackParam);\n };\n\n const onSelectChange = () => {\n onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));\n };\n\n const containerRef = useConsolidatedRef<HTMLElement>(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const isMonthOptionDisabled = (monthIndex: number) => {\n const year =\n yearSelectRef.current && yearSelectRef.current.value\n ? parseInt(yearSelectRef.current.value, 10)\n : new Date().getUTCFullYear();\n\n return (\n (year === minDate.getUTCFullYear() && monthIndex < minDate.getUTCMonth()) \|\|\n (year === maxDate.getUTCFullYear() && monthIndex > maxDate.getUTCMonth())\n );\n };\n\n const monthOptions = months.map((month, index) => (\n <Option disabled={isMonthOptionDisabled(index)} key={month} value={index.toString()}>\n {months[index]}\n </Option>\n ));\n const yearOptions = years.map(year => (\n <Option key={year.toString()} value={year.toString()}>\n {getLocalizedYear(year, locale).toString()}\n </Option>\n ));\n\n const displayNames = useMemo(\n () =>\n new Intl.DisplayNames(locale, {\n style: 'long',\n type: 'dateTimeField'\n }) as Intl.DateTimeDisplayNames,\n [locale]\n );\n\n const Month = (\n <Select\n data-testid={testIds.controlMonth}\n label={cap(displayNames.of('month'))}\n labelHidden={innerLabelsHidden}\n key='month'\n ref={monthSelectRef}\n aria-label={displayNames.of('month')}\n readOnly={readOnly}\n required={required}\n onChange={onSelectChange}\n status={status}\n disabled={disabled}\n autoFocus={autoFocus}\n >\n {!required && <Option key='null'> </Option>}\n {monthOptions}\n </Select>\n );\n\n const Year = (\n <Select\n data-testid={testIds.controlYear}\n label={cap(displayNames.of('year'))}\n labelHidden={innerLabelsHidden}\n key='year'\n ref={yearSelectRef}\n aria-label={displayNames.of('year')}\n readOnly={readOnly}\n required={required}\n onChange={onSelectChange}\n status={status}\n disabled={disabled}\n >\n {!required && <Option key='null'> </Option>}\n {yearOptions}\n </Select>\n );\n\n const Comp = (\n <Flex\n as={StyledMonthInput}\n forwardedAs={StyledFormControl}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n disabled={disabled}\n readOnly={readOnly}\n {...restProps}\n className={createClassName('month-input', className)}\n >\n {Month}\n {Year}\n </Flex>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n as='fieldset'\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n readOnly={readOnly}\n status={status}\n required={required}\n disabled={disabled}\n additionalInfo={additionalInfo}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default withTestIds(MonthInput, getMonthInputTestIds);\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/TimeRangeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAO,MAAM,OAAO,CAAC;AAGpD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAOjE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D,kCAAkC;IAClC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,GAAG,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;KAAE,CAAC;IACzE,gDAAgD;IAChD,QAAQ,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACrD,4FAA4F;IAC5F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,6FAA6F;IAC7F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,uHAAuH;IACvH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACtD,sHAAsH;IACtH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,wCAAwC;IACxC,IAAI,EAAE,MAAM,GAAG,UAAU,CAAC;IAC1B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,8DAA8D;IAC9D,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;;;;~~AAwLD~~,wBAAqE"}
1	+ {"version":3,"file":"TimeRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/TimeRangeInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAO,MAAM,OAAO,CAAC;AAGpD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,OAAO,KAAK,aAAa,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAOjE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D,kCAAkC;IAClC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,GAAG,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;KAAE,CAAC;IACzE,gDAAgD;IAChD,QAAQ,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACrD,4FAA4F;IAC5F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,6FAA6F;IAC7F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,uHAAuH;IACvH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACtD,sHAAsH;IACtH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,wCAAwC;IACxC,IAAI,EAAE,MAAM,GAAG,UAAU,CAAC;IAC1B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,8DAA8D;IAC9D,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;;;;AA6LD,wBAAqE"}

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useRef } from 'react';
+import { forwardRef, useCallback, useLayoutEffect, useRef } from 'react';
 import Flex from '../../Flex';
 import { useConsolidatedRef, useFocusWithin, useI18n, useTestIds, useUID } from '../../../hooks';
 import { StyledRangeInputContainer } from '../../Input/Input.styles';
@@ -25,6 +25,10 @@ const TimeRangeInput = forwardRef(function TimeRangeInput({ testId, value = {},
     const end = value.end === undefined || value.end === '' ? undefined : parseToDate(value.end).getTime();
     const startTimeRef = useRef(convertToCallbackParameter(start));
     const endTimeRef = useRef(convertToCallbackParameter(end));
+    useLayoutEffect(() => {
+        startTimeRef.current = convertToCallbackParameter(start);
+        endTimeRef.current = convertToCallbackParameter(end);
+    }, [start, end]);
     const onFocusChange = useCallback((focused) => {
         (focused ? onFocus : onBlur)?.({
             start: startTimeRef.current,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/TimeRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useRef } from 'react';\nimport type { FunctionComponent, Ref } from 'react';\n\nimport Flex from '../../Flex';\nimport type { FormControlProps } from '../../FormControl';\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds, useUID } from '../../../hooks';\nimport type DateTimeProps from '../DateTime.types';\nimport type {\n DateRangeCallbackParameter,\n DateTimeCallbackParameter,\n DateTimeProperties\n} from '../DateTime.types';\nimport type { ForwardProps } from '../../../types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport type { MinuteInterval } from '../Picker/DatePicker.types';\nimport FormField from '../../FormField';\nimport { getTimeRangeInputTestIds } from '../DateTime.test-ids';\nimport { createClassName, withTestIds } from '../../../utils';\nimport HiddenText from '../../HiddenText';\n\nimport { parseToDate } from './utils';\nimport type { ClockFormat } from './utils';\nimport TimeInput from './TimeInput';\nimport DateTimeInput from './DateTimeInput';\n\nexport interface TimeRangeInputProps extends DateTimeProperties {\n /** Object of range boundaries. /\n value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n /* Callback fired when inputs 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 /* Pass a string or a fragment with an Icon and string for first part of TimeRangeInput. /\n fromLabel?: FormControlProps['label'];\n /* Pass a string or a fragment with an Icon and string for second part of TimeRangeInput. /\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 /* Controls which input is displayed /\n mode: 'time' \| 'datetime';\n /\n Display the time with seconds.\n * @default false\n /\n withSeconds?: boolean;\n /\n Defines interval for time picker options (in minutes).\n * @default 30\n /\n pickerInterval?: MinuteInterval;\n /* Defines clock format that overrides locale based format */\n clockFormat?: ClockFormat;\n}\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 TimeRangeInput: FunctionComponent<TimeRangeInputProps & ForwardProps> = forwardRef(\n function TimeRangeInput(\n {\n testId,\n value = {},\n onChange,\n onFocus,\n onBlur,\n label,\n fromLabel,\n toLabel,\n labelHidden,\n required,\n readOnly,\n disabled,\n min,\n max,\n withSeconds,\n pickerInterval,\n clockFormat,\n mode,\n status,\n timeZone,\n fromAdditionalInfo,\n toAdditionalInfo,\n autoFocus,\n className,\n ...restProps\n }: TimeRangeInputProps,\n ref: Ref<HTMLDivElement>\n ) {\n const testIds = useTestIds(testId, getTimeRangeInputTestIds);\n\n const t = useI18n();\n\n const start =\n value.start === undefined \|\| value.start === ''\n ? undefined\n : parseToDate(value.start).getTime();\n const end =\n value.end === undefined \|\| value.end === '' ? undefined : parseToDate(value.end).getTime();\n\n const startTimeRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(start));\n const endTimeRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(end));\n\n const onFocusChange = useCallback(\n (focused: boolean) => {\n (focused ? onFocus : onBlur)?.({\n start: startTimeRef.current,\n end: endTimeRef.current\n });\n },\n [onFocus, onBlur]\n );\n\n const containerRef = useConsolidatedRef(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const commonProps = {\n required,\n readOnly,\n disabled,\n min,\n max,\n status,\n withSeconds,\n pickerInterval,\n clockFormat,\n timeZone\n };\n\n const descriptionId = useUID();\n\n return (\n <>\n <FormField\n testId={testIds}\n as='fieldset'\n {...restProps}\n container={{ wrap: 'nowrap' }}\n ref={containerRef}\n label={label}\n labelHidden={labelHidden}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n status={status}\n aria-describedby={descriptionId}\n >\n <Flex\n container\n as={StyledRangeInputContainer}\n className={createClassName('time-range-input', className)}\n >\n {mode === 'time' ? (\n <>\n <TimeInput\n testId={testIds.fromTime}\n {...commonProps}\n value={value.start}\n onBlur={changedValue => {\n startTimeRef.current = changedValue;\n if (!Number.isNaN(end)) endTimeRef.current = convertToCallbackParameter(end);\n onChange({\n start: changedValue,\n end: convertToCallbackParameter(end)\n });\n }}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={fromAdditionalInfo}\n autoFocus={autoFocus}\n />\n <TimeInput\n testId={testIds.toTime}\n {...commonProps}\n value={value.end}\n onBlur={changedValue => {\n if (!Number.isNaN(start))\n startTimeRef.current = convertToCallbackParameter(start);\n endTimeRef.current = changedValue;\n onChange({\n start: convertToCallbackParameter(start),\n end: changedValue\n });\n }}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={toAdditionalInfo}\n />\n </>\n ) : (\n <>\n <DateTimeInput\n testId={testIds.fromDateTime}\n {...commonProps}\n value={value.start}\n onBlur={changedValue => {\n startTimeRef.current = changedValue;\n if (!Number.isNaN(end)) endTimeRef.current = convertToCallbackParameter(end);\n onChange({\n start: changedValue,\n end: convertToCallbackParameter(end)\n });\n }}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={fromAdditionalInfo}\n />\n <DateTimeInput\n testId={testIds.toDateTime}\n {...commonProps}\n value={value.end}\n onBlur={changedValue => {\n if (!Number.isNaN(start))\n startTimeRef.current = convertToCallbackParameter(start);\n endTimeRef.current = changedValue;\n onChange({\n start: convertToCallbackParameter(start),\n end: changedValue\n });\n }}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={toAdditionalInfo}\n />\n </>\n )}\n </Flex>\n </FormField>\n <HiddenText id={descriptionId}>{t('range_input')}</HiddenText>\n </>\n );\n }\n);\nexport default withTestIds(TimeRangeInput, getTimeRangeInputTestIds);\n"]}
1	+ {"version":3,"file":"TimeRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/TimeRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useLayoutEffect, useRef } from 'react';\nimport type { FunctionComponent, Ref } from 'react';\n\nimport Flex from '../../Flex';\nimport type { FormControlProps } from '../../FormControl';\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds, useUID } from '../../../hooks';\nimport type DateTimeProps from '../DateTime.types';\nimport type {\n DateRangeCallbackParameter,\n DateTimeCallbackParameter,\n DateTimeProperties\n} from '../DateTime.types';\nimport type { ForwardProps } from '../../../types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport type { MinuteInterval } from '../Picker/DatePicker.types';\nimport FormField from '../../FormField';\nimport { getTimeRangeInputTestIds } from '../DateTime.test-ids';\nimport { createClassName, withTestIds } from '../../../utils';\nimport HiddenText from '../../HiddenText';\n\nimport { parseToDate } from './utils';\nimport type { ClockFormat } from './utils';\nimport TimeInput from './TimeInput';\nimport DateTimeInput from './DateTimeInput';\n\nexport interface TimeRangeInputProps extends DateTimeProperties {\n /** Object of range boundaries. /\n value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n /* Callback fired when inputs 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 /* Pass a string or a fragment with an Icon and string for first part of TimeRangeInput. /\n fromLabel?: FormControlProps['label'];\n /* Pass a string or a fragment with an Icon and string for second part of TimeRangeInput. /\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 /* Controls which input is displayed /\n mode: 'time' \| 'datetime';\n /\n Display the time with seconds.\n * @default false\n /\n withSeconds?: boolean;\n /\n Defines interval for time picker options (in minutes).\n * @default 30\n /\n pickerInterval?: MinuteInterval;\n /* Defines clock format that overrides locale based format */\n clockFormat?: ClockFormat;\n}\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 TimeRangeInput: FunctionComponent<TimeRangeInputProps & ForwardProps> = forwardRef(\n function TimeRangeInput(\n {\n testId,\n value = {},\n onChange,\n onFocus,\n onBlur,\n label,\n fromLabel,\n toLabel,\n labelHidden,\n required,\n readOnly,\n disabled,\n min,\n max,\n withSeconds,\n pickerInterval,\n clockFormat,\n mode,\n status,\n timeZone,\n fromAdditionalInfo,\n toAdditionalInfo,\n autoFocus,\n className,\n ...restProps\n }: TimeRangeInputProps,\n ref: Ref<HTMLDivElement>\n ) {\n const testIds = useTestIds(testId, getTimeRangeInputTestIds);\n\n const t = useI18n();\n\n const start =\n value.start === undefined \|\| value.start === ''\n ? undefined\n : parseToDate(value.start).getTime();\n const end =\n value.end === undefined \|\| value.end === '' ? undefined : parseToDate(value.end).getTime();\n\n const startTimeRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(start));\n const endTimeRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(end));\n\n useLayoutEffect(() => {\n startTimeRef.current = convertToCallbackParameter(start);\n endTimeRef.current = convertToCallbackParameter(end);\n }, [start, end]);\n\n const onFocusChange = useCallback(\n (focused: boolean) => {\n (focused ? onFocus : onBlur)?.({\n start: startTimeRef.current,\n end: endTimeRef.current\n });\n },\n [onFocus, onBlur]\n );\n\n const containerRef = useConsolidatedRef(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const commonProps = {\n required,\n readOnly,\n disabled,\n min,\n max,\n status,\n withSeconds,\n pickerInterval,\n clockFormat,\n timeZone\n };\n\n const descriptionId = useUID();\n\n return (\n <>\n <FormField\n testId={testIds}\n as='fieldset'\n {...restProps}\n container={{ wrap: 'nowrap' }}\n ref={containerRef}\n label={label}\n labelHidden={labelHidden}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n status={status}\n aria-describedby={descriptionId}\n >\n <Flex\n container\n as={StyledRangeInputContainer}\n className={createClassName('time-range-input', className)}\n >\n {mode === 'time' ? (\n <>\n <TimeInput\n testId={testIds.fromTime}\n {...commonProps}\n value={value.start}\n onBlur={changedValue => {\n startTimeRef.current = changedValue;\n if (!Number.isNaN(end)) endTimeRef.current = convertToCallbackParameter(end);\n onChange({\n start: changedValue,\n end: convertToCallbackParameter(end)\n });\n }}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={fromAdditionalInfo}\n autoFocus={autoFocus}\n />\n <TimeInput\n testId={testIds.toTime}\n {...commonProps}\n value={value.end}\n onBlur={changedValue => {\n if (!Number.isNaN(start))\n startTimeRef.current = convertToCallbackParameter(start);\n endTimeRef.current = changedValue;\n onChange({\n start: convertToCallbackParameter(start),\n end: changedValue\n });\n }}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={toAdditionalInfo}\n />\n </>\n ) : (\n <>\n <DateTimeInput\n testId={testIds.fromDateTime}\n {...commonProps}\n value={value.start}\n onBlur={changedValue => {\n startTimeRef.current = changedValue;\n if (!Number.isNaN(end)) endTimeRef.current = convertToCallbackParameter(end);\n onChange({\n start: changedValue,\n end: convertToCallbackParameter(end)\n });\n }}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={fromAdditionalInfo}\n />\n <DateTimeInput\n testId={testIds.toDateTime}\n {...commonProps}\n value={value.end}\n onBlur={changedValue => {\n if (!Number.isNaN(start))\n startTimeRef.current = convertToCallbackParameter(start);\n endTimeRef.current = changedValue;\n onChange({\n start: convertToCallbackParameter(start),\n end: changedValue\n });\n }}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n additionalInfo={toAdditionalInfo}\n />\n </>\n )}\n </Flex>\n </FormField>\n <HiddenText id={descriptionId}>{t('range_input')}</HiddenText>\n </>\n );\n }\n);\nexport default withTestIds(TimeRangeInput, getTimeRangeInputTestIds);\n"]}

package/lib/components/DateTime/Picker/DatePicker.styles.js CHANGED Viewed

@@ -68,12 +68,12 @@ export const StyledDatePickerMonthInput = styled(StyledDateTime) `
       z-index: 1;
     }
-    :first-child > ${StyledSelect} {
+    &:first-child > ${StyledSelect} {
       border-start-end-radius: 0;
       border-end-end-radius: 0;
     }
-    :last-child > ${StyledSelect} {
+    &:last-child > ${StyledSelect} {
       width: max-content;
       margin-inline-start: -0.0625rem;
       border-start-start-radius: 0;

package/lib/components/DateTime/Picker/DatePicker.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePicker.styles.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Picker/DatePicker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,MAAM,EAAE,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC5E,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,cAAc,MAAM,0BAA0B,CAAC;AAGtD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;IACvD,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EACP,eAAe,EAAE,gBAAgB,EACjC,OAAO,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,EACvC,EACD,UAAU,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,EAC5C,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;iCACqB,OAAO;gCACR,OAAO;;;;MAIjC,YAAY;4BACU,gBAAgB,MAAM,WAAW,CAAC,eAAe,CAAC;;;MAGxE,YAAY;4BACU,gBAAgB,MAAM,WAAW,CAAC,eAAe,CAAC;;;iBAG7D,KAAK;;;GAGnB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IACjD,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;eAEG,OAAO;;;MAGhB,eAAe;mCACc,OAAO;;GAEvC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,2BAA2B,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;;;;CAIxD,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,cAAc,CAAC,CAAiB;;;;;;IAM7E,eAAe;;;QAGX,WAAW,OAAO,cAAc,MAAM,WAAW;;;;;;;;;QASjD,YAAY;;;;~~qBAIC~~,YAAY;;;;;~~oBAKb~~,YAAY;;;;;;;~~CAO/B~~,CAAC;AAEF,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport Button, { StyledButton } from '../../Button';\nimport { StyledLabel } from '../../Label';\nimport { StyledFormField, StyledLabelRow } from '../../FormField/FormField';\nimport { StyledSelect } from '../../Select/Select';\nimport StyledDateTime from '../Input/DateTime.styles';\nimport type { MonthInputProps } from '../Input/MonthInput';\n\nexport const StyledMonthPicker = styled.fieldset(props => {\n const {\n theme: {\n base: {\n spacing,\n 'border-radius': baseBorderRadius,\n palette: { 'foreground-color': color }\n },\n components: { 'form-control': formControl }\n }\n } = props;\n return css`\n margin-block-end: calc(2 * ${spacing});\n margin-inline: calc(0.5 * ${spacing});\n font-size: 0.875rem;\n border: none;\n\n ${StyledSelect} {\n border-radius: calc(${baseBorderRadius} * ${formControl['border-radius']});\n }\n\n ${StyledButton} {\n border-radius: calc(${baseBorderRadius} * ${formControl['border-radius']});\n border: 0;\n &:enabled {\n color: ${color};\n }\n }\n `;\n});\n\nStyledMonthPicker.defaultProps = defaultThemeProp;\n\nexport const StyledDatePicker = styled.div(props => {\n const {\n theme: {\n base: { spacing }\n }\n } = props;\n return css`\n width: max-content;\n padding: ${spacing};\n overflow-y: auto;\n\n ${StyledFormField} {\n padding-inline: calc(1.5 * ${spacing});\n }\n `;\n});\n\nStyledDatePicker.defaultProps = defaultThemeProp;\n\nexport const StyledMonthNavigationButton = styled(Button)`\n & + & {\n margin-inline-start: 0;\n }\n`;\n\nStyledDatePicker.defaultProps = defaultThemeProp;\n\nexport const StyledDatePickerMonthInput = styled(StyledDateTime)<MonthInputProps>`\n padding: 0;\n border: 0;\n height: max-content;\n background-color: transparent;\n\n ${StyledFormField} {\n padding-inline: 0;\n\n > ${StyledLabel}, > ${StyledLabelRow} > ${StyledLabel} {\n &::after {\n content: none;\n }\n }\n > :last-child {\n margin: 0;\n }\n\n > ${StyledSelect}:focus {\n z-index: 1;\n }\n\n :first-child > ${StyledSelect} {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n\n :last-child > ${StyledSelect} {\n width: max-content;\n margin-inline-start: -0.0625rem;\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n`;\n\nStyledDatePickerMonthInput.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"DatePicker.styles.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Picker/DatePicker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,MAAM,EAAE,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC5E,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,cAAc,MAAM,0BAA0B,CAAC;AAGtD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;IACvD,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EACP,eAAe,EAAE,gBAAgB,EACjC,OAAO,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,EACvC,EACD,UAAU,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,EAC5C,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;iCACqB,OAAO;gCACR,OAAO;;;;MAIjC,YAAY;4BACU,gBAAgB,MAAM,WAAW,CAAC,eAAe,CAAC;;;MAGxE,YAAY;4BACU,gBAAgB,MAAM,WAAW,CAAC,eAAe,CAAC;;;iBAG7D,KAAK;;;GAGnB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IACjD,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;eAEG,OAAO;;;MAGhB,eAAe;mCACc,OAAO;;GAEvC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,2BAA2B,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;;;;CAIxD,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,cAAc,CAAC,CAAiB;;;;;;IAM7E,eAAe;;;QAGX,WAAW,OAAO,cAAc,MAAM,WAAW;;;;;;;;;QASjD,YAAY;;;;sBAIE,YAAY;;;;;qBAKb,YAAY;;;;;;;CAOhC,CAAC;AAEF,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport Button, { StyledButton } from '../../Button';\nimport { StyledLabel } from '../../Label';\nimport { StyledFormField, StyledLabelRow } from '../../FormField/FormField';\nimport { StyledSelect } from '../../Select/Select';\nimport StyledDateTime from '../Input/DateTime.styles';\nimport type { MonthInputProps } from '../Input/MonthInput';\n\nexport const StyledMonthPicker = styled.fieldset(props => {\n const {\n theme: {\n base: {\n spacing,\n 'border-radius': baseBorderRadius,\n palette: { 'foreground-color': color }\n },\n components: { 'form-control': formControl }\n }\n } = props;\n return css`\n margin-block-end: calc(2 * ${spacing});\n margin-inline: calc(0.5 * ${spacing});\n font-size: 0.875rem;\n border: none;\n\n ${StyledSelect} {\n border-radius: calc(${baseBorderRadius} * ${formControl['border-radius']});\n }\n\n ${StyledButton} {\n border-radius: calc(${baseBorderRadius} * ${formControl['border-radius']});\n border: 0;\n &:enabled {\n color: ${color};\n }\n }\n `;\n});\n\nStyledMonthPicker.defaultProps = defaultThemeProp;\n\nexport const StyledDatePicker = styled.div(props => {\n const {\n theme: {\n base: { spacing }\n }\n } = props;\n return css`\n width: max-content;\n padding: ${spacing};\n overflow-y: auto;\n\n ${StyledFormField} {\n padding-inline: calc(1.5 * ${spacing});\n }\n `;\n});\n\nStyledDatePicker.defaultProps = defaultThemeProp;\n\nexport const StyledMonthNavigationButton = styled(Button)`\n & + & {\n margin-inline-start: 0;\n }\n`;\n\nStyledDatePicker.defaultProps = defaultThemeProp;\n\nexport const StyledDatePickerMonthInput = styled(StyledDateTime)<MonthInputProps>`\n padding: 0;\n border: 0;\n height: max-content;\n background-color: transparent;\n\n ${StyledFormField} {\n padding-inline: 0;\n\n > ${StyledLabel}, > ${StyledLabelRow} > ${StyledLabel} {\n &::after {\n content: none;\n }\n }\n > :last-child {\n margin: 0;\n }\n\n > ${StyledSelect}:focus {\n z-index: 1;\n }\n\n &:first-child > ${StyledSelect} {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n\n &:last-child > ${StyledSelect} {\n width: max-content;\n margin-inline-start: -0.0625rem;\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n`;\n\nStyledDatePickerMonthInput.defaultProps = defaultThemeProp;\n"]}

package/lib/components/FormField/FormField.d.ts CHANGED Viewed

@@ -70,7 +70,9 @@ export interface FormFieldProps extends OmitStrict<FormControlProps, 'placeholde
     /** Suppresses announcements for status changes. */
     suppressAnnouncements?: boolean;
 }
-export declare const StyledFormFieldInfo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<FormControlProps, "status"> & Pick<FormFieldProps, "inline">>> & string;
+export declare const StyledFormFieldInfo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<FormControlProps, "status"> & Pick<FormFieldProps, "inline"> & {
+    $infoAbove?: boolean;
+}>> & string;
 export declare const StyledLabelRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     inline: boolean;
 }>> & string;

package/lib/components/FormField/FormField.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAwB,MAAM,OAAO,CAAC;AAK9F,OAAO,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE/F,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAmB3C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAIrD,MAAM,WAAW,cACf,SAAQ,UAAU,CAAC,gBAAgB,EAAE,aAAa,GAAG,OAAO,GAAG,cAAc,CAAC,EAC5E,UAAU,CAAC,OAAO,QAAQ,CAAC;IAC7B,kFAAkF;IAClF,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC;;;;;;;;OAQG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,UAAU,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;IAC7C;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,gDAAgD;IAChD,SAAS,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,IAAI,CAAC,CAAC;IACxD,kEAAkE;IAClE,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,2CAA2C;IAC3C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,mGAAmG;IACnG,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mDAAmD;IACnD,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAyBD,eAAO,MAAM,mBAAmB,~~sSAgC9B~~,CAAC;AAIH,eAAO,MAAM,cAAc;YAAwB,OAAO;YAUxD,CAAC;AAEH,eAAO,MAAM,eAAe;gBACK,OAAO;wBAAsB,OAAO;YAuEnE,CAAC;;;;~~AAyUH~~,wBAA2D"}
1	+ {"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,EAAwB,MAAM,OAAO,CAAC;AAK9F,OAAO,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE/F,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAmB3C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAIrD,MAAM,WAAW,cACf,SAAQ,UAAU,CAAC,gBAAgB,EAAE,aAAa,GAAG,OAAO,GAAG,cAAc,CAAC,EAC5E,UAAU,CAAC,OAAO,QAAQ,CAAC;IAC7B,kFAAkF;IAClF,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC;;;;;;;;OAQG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,UAAU,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;IAC7C;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,gDAAgD;IAChD,SAAS,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,IAAI,CAAC,CAAC;IACxD,kEAAkE;IAClE,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,2CAA2C;IAC3C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,mGAAmG;IACnG,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mDAAmD;IACnD,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAyBD,eAAO,MAAM,mBAAmB;iBACqD,OAAO;YAqC1F,CAAC;AAIH,eAAO,MAAM,cAAc;YAAwB,OAAO;YAUxD,CAAC;AAEH,eAAO,MAAM,eAAe;gBACK,OAAO;wBAAsB,OAAO;YAuEnE,CAAC;;;;AAiVH,wBAA2D"}

package/lib/components/FormField/FormField.js CHANGED Viewed

@@ -35,7 +35,7 @@ const StyledClearButton = styled(Button)(({ theme }) => {
   `;
 });
 StyledClearButton.defaultProps = defaultThemeProp;
-export const StyledFormFieldInfo = styled.div(({ status, inline, theme }) => {
+export const StyledFormFieldInfo = styled.div(({ status, inline, $infoAbove, theme }) => {
     const { base: { 'font-size': fontSize, 'font-scale': fontScale, spacing }, components: { 'form-field': formField } } = theme;
     const fontSizes = calculateFontSize(fontSize, fontScale);
     const infoFontSize = fontSizes.xxs;
@@ -52,7 +52,13 @@ export const StyledFormFieldInfo = styled.div(({ status, inline, theme }) => {
     `}
     &:not(:empty) {
-      margin-block-start: calc(0.25 * ${spacing});
+      ${$infoAbove
+        ? css `
+            margin-block-end: calc(0.25 * ${spacing});
+          `
+        : css `
+            margin-block-start: calc(0.25 * ${spacing});
+          `}
     }
     ${status &&
@@ -176,6 +182,7 @@ const FormField = forwardRef(function FormField(props, ref) {
     const uid = useUID();
     const theme = useTheme();
     const { testId, children: controlElement, id = uid, as = 'div', label, labelAs: labelAsProp = 'label', labelFor = id, labelId: labelIdProp, labelHidden = false, labelAfter = false, info, status, suppressAnnouncements, isRadioCheck, charLimitDisplay, required = false, disabled = false, readOnly = false, inline = theme.components['form-field'].layout === 'inline', onClear, actions, container, additionalInfo, onResolveSuggestion, 'aria-describedby': ariaDescribedBy, className, ...restProps } = props;
+    const infoAbove = theme.components['form-field']['helper-text-position'] === 'above';
     const testIds = useTestIds(testId, getFormFieldTestIds);
     const asFieldset = as === 'fieldset' || (typeof as !== 'string' && 'target' in as && as.target === 'fieldset');
     const t = useI18n();
@@ -234,13 +241,13 @@ const FormField = forwardRef(function FormField(props, ref) {
     if (actions) {
         content = (_jsxs(Flex, { container: { alignItems: 'center', gap: 0.5 }, item: { grow: labelInline ? 1 : undefined }, children: [content, _jsx(Actions, { items: actions, menuAt: 3 })] }));
     }
-    let infoContent = (_jsxs(Flex, { id: `${id}-info`, "data-testid": testIds.info, status: status, as: StyledFormFieldInfo, container: { alignItems: 'center', gap: 0.5 }, inline: labelInline, children: [status && status !== 'pending' && (_jsxs(_Fragment, { children: [_jsx(Flex, { item: { alignSelf: 'start' }, as: StyledStatusIcon, status: status, name: statusIconMap[status] }), _jsx(VisuallyHiddenText, { children: `${t(status)} ` })] })), info] }));
+    let infoContent = (_jsxs(Flex, { id: `${id}-info`, "data-testid": testIds.info, status: status, as: StyledFormFieldInfo, container: { alignItems: 'center', gap: 0.5 }, inline: labelInline, "$infoAbove": infoAbove, children: [status && status !== 'pending' && (_jsxs(_Fragment, { children: [_jsx(Flex, { item: { alignSelf: 'start' }, as: StyledStatusIcon, status: status, name: statusIconMap[status] }), _jsx(VisuallyHiddenText, { children: `${t(status)} ` })] })), info] }));
     if (charLimitDisplay) {
         infoContent = (_jsxs(Flex, { container: { justify: infoContent ? 'between' : 'end', gap: 1 }, children: [infoContent, _jsx(Flex, { item: { shrink: 0 }, children: charLimitDisplay })] }));
     }
     if (hasSuggestion) {
         const focusables = getFocusables(consolidatedRef);
-        infoContent = (_jsxs(Flex, { container: { alignItems: 'start', justify: 'between' }, children: [_jsxs(StyledFormFieldInfo, { "data-testid": testIds.info, status: status, id: `${id}-info`, children: [t('suggestion_info'), _jsx(VisuallyHiddenText, { "aria-live": 'polite', children: t('suggestion_assist') })] }), _jsxs(Flex, { container: { wrap: 'nowrap' }, children: [_jsx(StyledSuggestionButton, { "data-testid": testIds.suggestionReject, onClick: () => {
+        infoContent = (_jsxs(Flex, { container: { alignItems: 'start', justify: 'between' }, children: [_jsxs(StyledFormFieldInfo, { "data-testid": testIds.info, status: status, id: `${id}-info`, "$infoAbove": infoAbove, children: [t('suggestion_info'), _jsx(VisuallyHiddenText, { "aria-live": 'polite', children: t('suggestion_assist') })] }), _jsxs(Flex, { container: { wrap: 'nowrap' }, children: [_jsx(StyledSuggestionButton, { "data-testid": testIds.suggestionReject, onClick: () => {
                                 onResolveSuggestion(false);
                                 focusables[0]?.focus();
                             }, "aria-label": `${t('no')}, ${t('reject_suggestion_button_a11y')}${labelText ? ` - ${labelText}` : ''}`, children: t('no') }), _jsx(StyledSuggestionButton, { "data-testid": testIds.suggestionAccept, onClick: () => {
@@ -267,7 +274,7 @@ const FormField = forwardRef(function FormField(props, ref) {
             alignItems: inline ? 'center' : undefined,
             wrap: isRadioCheck || inline ? 'wrap' : undefined,
             ...container
-        }, as: StyledFormField, asFieldset: asFieldset, isRadioCheck: isRadioCheck, showAdditionalInfo: showAdditionalInfo, id: `${id}-field`, forwardedAs: as, required: required, disabled: disabled, readOnly: readOnly, onKeyDown: hasSuggestion ? onKeyDown : undefined, "aria-describedby": descriptionIds.length ? descriptionIds.join(' ') : undefined, "aria-labelledby": asFieldset ? labelId : undefined, ref: consolidatedRef, className: createClassName('form-field', className, { status }), children: [(asFieldset || !labelAfter) && labelRow, content, !asFieldset && labelAfter && labelRow, !readOnly && infoContent, isRadioCheck && onClear && (_jsx(StyledClearButton, { variant: 'link', onClick: () => {
+        }, as: StyledFormField, asFieldset: asFieldset, isRadioCheck: isRadioCheck, showAdditionalInfo: showAdditionalInfo, id: `${id}-field`, forwardedAs: as, required: required, disabled: disabled, readOnly: readOnly, onKeyDown: hasSuggestion ? onKeyDown : undefined, "aria-describedby": descriptionIds.length ? descriptionIds.join(' ') : undefined, "aria-labelledby": asFieldset ? labelId : undefined, ref: consolidatedRef, className: createClassName('form-field', className, { status }), children: [(asFieldset || !labelAfter) && labelRow, !readOnly && infoAbove && infoContent, content, !asFieldset && labelAfter && labelRow, !readOnly && !infoAbove && infoContent, isRadioCheck && onClear && (_jsx(StyledClearButton, { variant: 'link', onClick: () => {
                     onClear();
                 }, children: t('clear_selection') }))] }));
 });