@pega/cosmos-react-core 5.0.0-dev.4.7 → 5.0.0-dev.4.8

package/lib/components/DateTime/Input/QuarterInput.js

@@ -1,108 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useRef, useEffect } from 'react';
-import styled from 'styled-components';
-import FormField from '../../FormField';
-import Select, { Option } from '../../Select';
-import Flex from '../../Flex';
-import { range, withTestIds } from '../../../utils';
-import { useConfiguration, useConsolidatedRef, useFocusWithin, useI18n, useTestIds } from '../../../hooks';
-import { StyledSelect } from '../../Select/Select';
-import { defaultThemeProp } from '../../../theme';
-import { StyledFormControl } from '../../FormControl';
-import { getQuarterInputTestIds } from '../DateTime.test-ids';
-import { getQuarter, parseToDate } from './utils';
-import StyledDateTime from './DateTime.styles';
-export const StyledQuarterInput = styled(StyledDateTime) `
-  padding: 0;
-  border: 0;
-
-  ${StyledSelect} {
-    min-width: 0;
-
-    &:focus {
-      z-index: 1;
-    }
-
-    &:first-child {
-      border-start-end-radius: 0;
-      border-end-end-radius: 0;
-    }
-
-    &:last-child {
-      max-width: max-content;
-      margin-inline-start: -0.0625rem;
-      border-start-start-radius: 0;
-      border-end-start-radius: 0;
-    }
-  }
-`;
-StyledQuarterInput.defaultProps = defaultThemeProp;
-const convertToCallbackParameter = (date, parts) => {
-    if ([parts.quarter, parts.year].every(Boolean)) {
-        const quarterStartMonth = [0, 3, 6, 9][Number(parts.quarter) - 1];
-        const resultDate = new Date(date);
-        resultDate.setUTCFullYear(Number(parts.year), quarterStartMonth, 1);
-        return {
-            valueAsISOString: resultDate.toISOString(),
-            valueAsTimestamp: resultDate.getTime()
-        };
-    }
-    if ([parts.year, parts.quarter].every(p => !p)) {
-        return {
-            valueAsISOString: undefined,
-            valueAsTimestamp: undefined
-        };
-    }
-    return {
-        valueAsISOString: '',
-        valueAsTimestamp: NaN,
-        state: 'incomplete'
-    };
-};
-const QuarterInput = forwardRef(function QuarterInput(props, ref) {
-    const { testId, value, min, max, id, label, labelHidden, info, status, required, readOnly, disabled, onChange, onFocus, onBlur, autoFocus, additionalInfo, ...restProps } = props;
-    const testIds = useTestIds(testId, getQuarterInputTestIds);
-    const { locale } = useConfiguration();
-    const date = value ? parseToDate(value) : undefined;
-    const currentYear = date ? date.getUTCFullYear() : new Date().getFullYear();
-    const minYear = min ? parseToDate(min).getUTCFullYear() : currentYear - 10;
-    const maxYear = max ? parseToDate(max).getUTCFullYear() : currentYear + 10;
-    const years = range(minYear, maxYear);
-    const quarterSelectRef = useRef(null);
-    const yearSelectRef = useRef(null);
-    useEffect(() => {
-        if (quarterSelectRef.current && yearSelectRef.current) {
-            quarterSelectRef.current.value = date ? getQuarter(date).toString() : '';
-            yearSelectRef.current.value = date?.getUTCFullYear().toString() ?? '';
-        }
-    }, [date?.toDateString()]);
-    const pickParts = () => {
-        return {
-            quarter: quarterSelectRef.current?.value || '',
-            year: yearSelectRef.current?.value || ''
-        };
-    };
-    const onFocusChange = (focused) => {
-        const callbackParam = convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts());
-        if (onFocus && focused)
-            onFocus(callbackParam);
-        else if (onBlur && !focused)
-            onBlur(callbackParam);
-    };
-    const onSelectChange = () => {
-        onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));
-    };
-    const containerRef = useConsolidatedRef(ref);
-    useFocusWithin([containerRef], onFocusChange);
-    const t = useI18n();
-    const quarters = [1, 2, 3, 4];
-    const quarterOptions = quarters.map(quarterNumber => (_jsx(Option, { value: quarterNumber.toString(), children: t(`date_quarter_q${quarterNumber}`).trim() }, t(`date_quarter_q${quarterNumber}`).trim())));
-    const yearOptions = years.map(year => (_jsx(Option, { value: year.toString(), children: year.toString() }, year.toString())));
-    const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });
-    const Quarter = (_jsxs(Select, { "data-testid": testIds.controlQuarter, ref: quarterSelectRef, "aria-label": displayNames.of('quarter'), readOnly: readOnly, required: required, onChange: onSelectChange, status: status, disabled: disabled, autoFocus: autoFocus, children: [!required && _jsx(Option, { children: " " }, 'null'), quarterOptions] }, 'quarter'));
-    const Year = (_jsxs(Select, { "data-testid": testIds.controlYear, ref: yearSelectRef, "aria-label": displayNames.of('year'), readOnly: readOnly, required: required, onChange: onSelectChange, status: status, disabled: disabled, children: [!required && _jsx(Option, { children: " " }, 'null'), yearOptions] }, 'year'));
-    const Comp = (_jsxs(Flex, { "data-testid": testIds.root, ...restProps, as: StyledQuarterInput, forwardedAs: StyledFormControl, container: { alignItems: 'center' }, ref: containerRef, status: status, disabled: disabled, readOnly: readOnly, children: [Quarter, Year] }));
-    return label ? (_jsx(FormField, { testId: testIds, as: 'fieldset', labelAs: 'legend', label: label, labelHidden: labelHidden, id: id, info: info, status: status, required: required, disabled: disabled, additionalInfo: additionalInfo, children: Comp })) : (Comp);
-});
-export default withTestIds(QuarterInput, getQuarterInputTestIds);
-//# sourceMappingURL=QuarterInput.js.map

package/lib/components/DateTime/Input/QuarterInput.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"QuarterInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/QuarterInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref, useRef, useEffect } from 'react';\nimport styled from 'styled-components';\n\nimport { ForwardProps } from '../../../types';\nimport FormField from '../../FormField';\nimport Select, { Option } from '../../Select';\nimport DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\nimport Flex from '../../Flex';\nimport { range, withTestIds } from '../../../utils';\nimport {\n  useConfiguration,\n  useConsolidatedRef,\n  useFocusWithin,\n  useI18n,\n  useTestIds\n} from '../../../hooks';\nimport { StyledSelect } from '../../Select/Select';\nimport { defaultThemeProp } from '../../../theme';\nimport { FormControlProps, StyledFormControl } from '../../FormControl';\nimport { getQuarterInputTestIds } from '../DateTime.test-ids';\n\nimport { getQuarter, parseToDate, QuarterNumber } from './utils';\nimport StyledDateTime from './DateTime.styles';\nimport { DateParts } from './DateTimeInput.types';\n\nexport interface QuarterInputProps extends DateTimeProps {\n  /** Pass a heading and content to show additional information on the field. */\n  additionalInfo?: FormControlProps['additionalInfo'];\n}\n\nexport const StyledQuarterInput = styled(StyledDateTime)<QuarterInputProps>`\n  padding: 0;\n  border: 0;\n\n  ${StyledSelect} {\n    min-width: 0;\n\n    &:focus {\n      z-index: 1;\n    }\n\n    &:first-child {\n      border-start-end-radius: 0;\n      border-end-end-radius: 0;\n    }\n\n    &:last-child {\n      max-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\nStyledQuarterInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n  date: Date,\n  parts: DateParts<string | undefined>\n): DateTimeCallbackParameter => {\n  if ([parts.quarter, parts.year].every(Boolean)) {\n    const quarterStartMonth = [0, 3, 6, 9][Number(parts.quarter) - 1];\n\n    const resultDate = new Date(date);\n    resultDate.setUTCFullYear(Number(parts.year), quarterStartMonth, 1);\n    return {\n      valueAsISOString: resultDate.toISOString(),\n      valueAsTimestamp: resultDate.getTime()\n    };\n  }\n  if ([parts.year, parts.quarter].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 QuarterInput: FunctionComponent<QuarterInputProps & ForwardProps> = forwardRef(\n  function QuarterInput(props: PropsWithoutRef<QuarterInputProps>, ref: Ref<HTMLFieldSetElement>) {\n    const {\n      testId,\n      value,\n      min,\n      max,\n      id,\n      label,\n      labelHidden,\n      info,\n      status,\n      required,\n      readOnly,\n      disabled,\n      onChange,\n      onFocus,\n      onBlur,\n      autoFocus,\n      additionalInfo,\n      ...restProps\n    } = props;\n\n    const testIds = useTestIds(testId, getQuarterInputTestIds);\n\n    const { locale } = useConfiguration();\n\n    const date = value ? parseToDate(value) : undefined;\n    const currentYear = date ? date.getUTCFullYear() : new Date().getFullYear();\n\n    const minYear = min ? parseToDate(min).getUTCFullYear() : currentYear - 10;\n    const maxYear = max ? parseToDate(max).getUTCFullYear() : currentYear + 10;\n\n    const years = range(minYear, maxYear);\n\n    const quarterSelectRef = useRef<HTMLSelectElement>(null);\n    const yearSelectRef = useRef<HTMLSelectElement>(null);\n\n    useEffect(() => {\n      if (quarterSelectRef.current && yearSelectRef.current) {\n        quarterSelectRef.current.value = date ? getQuarter(date).toString() : '';\n        yearSelectRef.current.value = date?.getUTCFullYear().toString() ?? '';\n      }\n    }, [date?.toDateString()]);\n\n    const pickParts = (): DateParts<string | undefined> => {\n      return {\n        quarter: quarterSelectRef.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 t = useI18n();\n\n    const quarters: QuarterNumber[] = [1, 2, 3, 4];\n\n    const quarterOptions = quarters.map(quarterNumber => (\n      <Option key={t(`date_quarter_q${quarterNumber}`).trim()} value={quarterNumber.toString()}>\n        {t(`date_quarter_q${quarterNumber}`).trim()}\n      </Option>\n    ));\n\n    const yearOptions = years.map(year => (\n      <Option key={year.toString()} value={year.toString()}>\n        {year.toString()}\n      </Option>\n    ));\n\n    const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });\n\n    const Quarter = (\n      <Select\n        data-testid={testIds.controlQuarter}\n        key='quarter'\n        ref={quarterSelectRef}\n        aria-label={displayNames.of('quarter')}\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        {quarterOptions}\n      </Select>\n    );\n\n    const Year = (\n      <Select\n        data-testid={testIds.controlYear}\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        data-testid={testIds.root}\n        {...restProps}\n        as={StyledQuarterInput}\n        forwardedAs={StyledFormControl}\n        container={{ alignItems: 'center' }}\n        ref={containerRef}\n        status={status}\n        disabled={disabled}\n        readOnly={readOnly}\n      >\n        {Quarter}\n        {Year}\n      </Flex>\n    );\n\n    return label ? (\n      <FormField\n        testId={testIds}\n        as='fieldset'\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        additionalInfo={additionalInfo}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default withTestIds(QuarterInput, getQuarterInputTestIds);\n"]}

package/lib/components/DateTime/Input/TimeInput.d.ts

@@ -1,28 +0,0 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '../../../types';
-import { FormControlProps } from '../../FormControl';
-import DateTimeProps from '../DateTime.types';
-import type { MinuteInterval } from '../Picker/DatePicker.types';
-import { ClockFormat } from './utils';
-export interface TimeInputProps extends DateTimeProps {
-    /**
-     * Display the time with seconds.
-     * @default false
-     */
-    withSeconds?: boolean;
-    /**
-     * Defines interval for time picker options (in minutes).
-     * @default 30
-     */
-    pickerInterval?: MinuteInterval;
-    /** Defines clock format that overrides locale based format */
-    clockFormat?: ClockFormat;
-    /** Pass a heading and content to show additional information on the field. */
-    additionalInfo?: FormControlProps['additionalInfo'];
-}
-export declare const StyledTimeInput: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TimeInputProps, never>;
-declare const _default: FunctionComponent<TimeInputProps & ForwardProps> & {
-    getTestIds: (testIdProp?: string | undefined) => import("../../../types").TestIdsRecord<readonly ["control-hour", "control-minute", "control-second", "control-period", "open-close-picker", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
-};
-export default _default;
-//# sourceMappingURL=TimeInput.d.ts.map

package/lib/components/DateTime/Input/TimeInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TimeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/TimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAgB9C,OAAO,EAAE,gBAAgB,EAAqB,MAAM,mBAAmB,CAAC;AACxE,OAAO,aAA4C,MAAM,mBAAmB,CAAC;AAG7E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAGjE,OAAO,EAKL,WAAW,EAEZ,MAAM,SAAS,CAAC;AASjB,MAAM,WAAW,cAAe,SAAQ,aAAa;IACnD;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,8DAA8D;IAC9D,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,eAAe,qHAE3B,CAAC;;;;AAkXF,wBAA2D"}

package/lib/components/DateTime/Input/TimeInput.js

@@ -1,199 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useRef, forwardRef, useImperativeHandle, useEffect } from 'react';
-import styled from 'styled-components';
-import FormField from '../../FormField';
-import Flex from '../../Flex';
-import Select, { Option } from '../../Select';
-import Button from '../../Button';
-import Icon, { registerIcon } from '../../Icon';
-import * as clockIcon from '../../Icon/icons/clock.icon';
-import Popover from '../../Popover';
-import TimePicker from '../Picker/TimePicker';
-import { useConfiguration, useConsolidatedRef, useFocusWithin, useI18n, useTestIds } from '../../../hooks';
-import { StyledFormControl } from '../../FormControl';
-import { sameWidth } from '../../Popover/modifiers';
-import { hasProp, withTestIds } from '../../../utils';
-import { getTimeInputTestIds } from '../DateTime.test-ids';
-import { getDateFormat, parseToDate, is12HClockFormat, validateTime, getTimeOptions } from './utils';
-import StyledDateTime, { StyledInputContainer } from './DateTime.styles';
-import PartInput from './PartInput';
-import usePickerButton from './usePickerButton';
-import useAutoFocusNextInput from './useAutoFocusNextInput';
-registerIcon(clockIcon);
-export const StyledTimeInput = styled(StyledDateTime) `
-  padding-inline-end: 0;
-`;
-function getMeridiem(hour) {
-    return hour && hour >= 12 ? 'PM' : 'AM';
-}
-const convertTo12h = (hour) => {
-    let converted = hour;
-    if (hour > 12)
-        converted = hour - 12;
-    else if (hour === 0)
-        converted = 12;
-    return converted;
-};
-const convertTo24h = (hour, meridiem) => {
-    let converted = hour;
-    if (meridiem === 'PM' && hour < 12)
-        converted = hour + 12;
-    else if (meridiem === 'AM' && hour === 12)
-        converted = 0;
-    return converted;
-};
-const convertToCallbackParameter = (date, parts) => {
-    const withSeconds = hasProp(parts, 'second');
-    const { hour, minute, second = date.getUTCSeconds().toString(), dayPeriod: meridiem } = parts;
-    const toValidate = withSeconds ? [hour, minute, second] : [hour, minute];
-    if (toValidate.every(Boolean)) {
-        const is12h = meridiem !== undefined;
-        if (!validateTime(Number(hour), Number(minute), Number(second), is12h)) {
-            return {
-                valueAsISOString: '',
-                valueAsTimestamp: NaN,
-                state: 'invalid'
-            };
-        }
-        const resultDate = new Date(date);
-        resultDate.setUTCHours(is12h ? convertTo24h(Number(hour), meridiem) : Number(hour), Number(minute), Number(second));
-        return {
-            valueAsISOString: resultDate.toISOString(),
-            valueAsTimestamp: resultDate.getTime()
-        };
-    }
-    if (toValidate.every(p => !p)) {
-        return {
-            valueAsISOString: undefined,
-            valueAsTimestamp: undefined
-        };
-    }
-    return {
-        valueAsISOString: '',
-        valueAsTimestamp: NaN,
-        state: 'incomplete'
-    };
-};
-const TimeInput = forwardRef(function TimeInput(props, ref) {
-    const { locale } = useConfiguration();
-    const { testId, value, id, label, labelHidden, status, withSeconds = false, pickerInterval = 30, clockFormat, info = getDateFormat(locale, getTimeOptions(withSeconds), true).join(''), required, readOnly, disabled, onChange, onFocus, onBlur, onResolveSuggestion, autoFocus, additionalInfo, handle, ...restProps } = props;
-    const testIds = useTestIds(testId, getTimeInputTestIds);
-    const date = value !== undefined ? parseToDate(value) : undefined;
-    const is12h = clockFormat ? clockFormat === 12 : is12HClockFormat(locale);
-    const [hourInputRef, minuteInputRef, secondInputRef, meridiemSelectRef] = [
-        useRef(null),
-        useRef(null),
-        useRef(null),
-        useRef(null)
-    ];
-    useAutoFocusNextInput([hourInputRef, minuteInputRef, secondInputRef]);
-    const pickParts = () => {
-        const parts = {
-            hour: hourInputRef.current?.value || undefined,
-            minute: minuteInputRef.current?.value || undefined
-        };
-        if (withSeconds)
-            parts.second = secondInputRef.current?.value;
-        if (is12h)
-            parts.dayPeriod = meridiemSelectRef.current?.value;
-        return parts;
-    };
-    const currentlySelectedTime = () => {
-        const parts = pickParts();
-        if (Object.values(parts).every(Boolean)) {
-            const hour = Number(parts.hour);
-            const minute = Number(parts.minute);
-            const second = parts.minute ? Number(parts.minute) : 0;
-            const current = date ?? new Date();
-            return validateTime(hour, minute, second, is12h)
-                ? new Date(current.setUTCHours(is12h ? convertTo24h(hour, parts.dayPeriod) : hour, minute, second))
-                : undefined;
-        }
-    };
-    const [open, setOpen, , setPopoverRef, buttonEl, setButtonEl] = usePickerButton();
-    const inputContainerRef = useRef(null);
-    const onFocusChange = (focused) => {
-        const callbackParam = convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts());
-        if (onFocus && focused)
-            onFocus(callbackParam);
-        if (!focused) {
-            if (inputContainerRef.current)
-                inputContainerRef.current.scrollTop = 0;
-            onBlur?.(callbackParam);
-        }
-    };
-    const onInputChange = () => {
-        onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));
-    };
-    const setMeridiem = (meridiem) => {
-        if (meridiemSelectRef.current) {
-            meridiemSelectRef.current.value = meridiem;
-        }
-    };
-    useEffect(() => {
-        if (is12h && meridiemSelectRef.current) {
-            meridiemSelectRef.current.value = getMeridiem(date?.getUTCHours());
-        }
-    }, [is12h, date?.getUTCHours()]);
-    const t = useI18n();
-    const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });
-    const hour = date && is12h ? convertTo12h(date.getUTCHours()) : date?.getUTCHours();
-    const HourInput = (_jsx(PartInput, { "data-testid": testIds.controlHour, placeholder: t('hour_placeholder'), "aria-label": displayNames.of('hour'), value: hour, onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, min: is12h ? 1 : 0, max: is12h ? 12 : 23, ref: hourInputRef, autoFocus: autoFocus }, 'hour'));
-    const MinuteInput = (_jsx(PartInput, { "data-testid": testIds.controlMinute, placeholder: t('minute_placeholder'), "aria-label": displayNames.of('minute'), value: date?.getUTCMinutes(), onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, max: 59, ref: minuteInputRef }, 'minute'));
-    const SecondInput = (_jsx(PartInput, { "data-testid": testIds.controlSecond, placeholder: t('second_placeholder'), "aria-label": displayNames.of('second'), value: date?.getUTCSeconds(), onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, max: 59, ref: secondInputRef }, 'second'));
-    const Period = (_jsxs(Select, { "data-testid": testIds.controlPeriod, ref: meridiemSelectRef, "aria-label": displayNames.of('dayPeriod'), required: required, disabled: disabled, onChange: () => {
-            if (Object.values(pickParts()).every(Boolean))
-                onInputChange();
-        }, readOnly: readOnly, children: [_jsx(Option, { value: 'AM', children: t('meridiem_value_am') }), _jsx(Option, { value: 'PM', children: t('meridiem_value_pm') })] }, 'period'));
-    const containerRef = useConsolidatedRef(ref);
-    useFocusWithin([containerRef], onFocusChange);
-    useImperativeHandle(handle, () => ({
-        clear: () => {
-            if (hourInputRef.current)
-                hourInputRef.current.value = '';
-            if (minuteInputRef.current)
-                minuteInputRef.current.value = '';
-            if (secondInputRef.current)
-                secondInputRef.current.value = '';
-            if (meridiemSelectRef.current)
-                meridiemSelectRef.current.value = '';
-            onInputChange();
-        }
-    }), [onInputChange]);
-    const Picker = (_jsxs(_Fragment, { children: [_jsx(Button, { "data-testid": testIds.openClosePicker, variant: 'simple', icon: true, ref: setButtonEl, onClick: () => setOpen(cur => !cur), "aria-label": t(open ? 'close_time_button_a11y' : 'open_time_button_a11y'), readOnly: readOnly, disabled: disabled, children: _jsx(Icon, { name: 'clock' }) }), _jsx(Popover, { show: open, ref: setPopoverRef, target: containerRef.current, placement: 'bottom-end', strategy: 'fixed', modifiers: [sameWidth], children: _jsx(TimePicker, { testId: testIds.root, selected: currentlySelectedTime(), interval: pickerInterval, onSelect: selected => {
-                        hourInputRef.current.value = (is12h ? convertTo12h(selected.getUTCHours()) : selected.getUTCHours())
-                            .toString()
-                            .padStart(2, '0');
-                        minuteInputRef.current.value = selected.getUTCMinutes().toString().padStart(2, '0');
-                        if (withSeconds)
-                            secondInputRef.current.value = selected.getUTCSeconds().toString().padStart(2, '0');
-                        if (meridiemSelectRef.current) {
-                            meridiemSelectRef.current.value = getMeridiem(selected.getUTCHours());
-                        }
-                        setMeridiem(getMeridiem(selected.getUTCHours()));
-                        setOpen(false);
-                        setTimeout(() => buttonEl?.focus());
-                        onInputChange();
-                    }, clockFormat: clockFormat }) })] }));
-    const Comp = (_jsxs(Flex, { "data-testid": testIds.root, as: StyledTimeInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ref: containerRef, onClick: (e) => {
-            if (e.target === containerRef.current)
-                hourInputRef.current?.focus();
-        }, ...restProps, children: [_jsx(Flex, { ref: inputContainerRef, as: StyledInputContainer, container: { alignItems: 'center', wrap: 'wrap' }, children: getDateFormat(locale, getTimeOptions(withSeconds, is12h)).map(part => {
-                    switch (part) {
-                        case 'hh':
-                            return HourInput;
-                        case 'mm':
-                            return MinuteInput;
-                        case 'ss':
-                            return SecondInput;
-                        case 'AM':
-                        case 'PM':
-                            return Period;
-                        default:
-                            return part;
-                    }
-                }) }), !readOnly && Picker] }));
-    return label ? (_jsx(FormField, { testId: testIds, as: 'fieldset', labelAs: 'legend', label: label, labelHidden: labelHidden, id: id, info: info, status: status, required: required, disabled: disabled, onResolveSuggestion: onResolveSuggestion, additionalInfo: additionalInfo, ref: ref, children: Comp })) : (Comp);
-});
-export default withTestIds(TimeInput, getTimeInputTestIds);
-//# sourceMappingURL=TimeInput.js.map

package/lib/components/DateTime/Input/TimeInput.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TimeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/TimeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  useRef,\n  forwardRef,\n  Ref,\n  PropsWithoutRef,\n  useImperativeHandle,\n  useEffect\n} from 'react';\nimport styled from 'styled-components';\n\nimport { ForwardProps } from '../../../types';\nimport FormField from '../../FormField';\nimport Flex from '../../Flex';\nimport Select, { Option } from '../../Select';\nimport Button from '../../Button';\nimport Icon, { registerIcon } from '../../Icon';\nimport * as clockIcon from '../../Icon/icons/clock.icon';\nimport Popover from '../../Popover';\nimport TimePicker from '../Picker/TimePicker';\nimport {\n  useConfiguration,\n  useConsolidatedRef,\n  useFocusWithin,\n  useI18n,\n  useTestIds\n} from '../../../hooks';\nimport { FormControlProps, StyledFormControl } from '../../FormControl';\nimport DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\nimport { sameWidth } from '../../Popover/modifiers';\nimport { hasProp, withTestIds } from '../../../utils';\nimport type { MinuteInterval } from '../Picker/DatePicker.types';\nimport { getTimeInputTestIds } from '../DateTime.test-ids';\n\nimport {\n  getDateFormat,\n  parseToDate,\n  is12HClockFormat,\n  validateTime,\n  ClockFormat,\n  getTimeOptions\n} from './utils';\nimport StyledDateTime, { StyledInputContainer } from './DateTime.styles';\nimport PartInput from './PartInput';\nimport usePickerButton from './usePickerButton';\nimport useAutoFocusNextInput from './useAutoFocusNextInput';\nimport { TimeParts } from './DateTimeInput.types';\n\nregisterIcon(clockIcon);\n\nexport interface TimeInputProps extends DateTimeProps {\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  /** Pass a heading and content to show additional information on the field. */\n  additionalInfo?: FormControlProps['additionalInfo'];\n}\n\nexport const StyledTimeInput = styled(StyledDateTime)<TimeInputProps>`\n  padding-inline-end: 0;\n`;\n\nfunction getMeridiem(hour: number | undefined) {\n  return hour && hour >= 12 ? 'PM' : 'AM';\n}\n\nconst convertTo12h = (hour: number) => {\n  let converted: number = hour;\n  if (hour > 12) converted = hour - 12;\n  else if (hour === 0) converted = 12;\n  return converted;\n};\n\nconst convertTo24h = (hour: number, meridiem: string) => {\n  let converted: number = hour;\n  if (meridiem === 'PM' && hour < 12) converted = hour + 12;\n  else if (meridiem === 'AM' && hour === 12) converted = 0;\n  return converted;\n};\n\nconst convertToCallbackParameter = (\n  date: Date,\n  parts: TimeParts<string | undefined>\n): DateTimeCallbackParameter => {\n  const withSeconds = hasProp(parts, 'second');\n  const { hour, minute, second = date.getUTCSeconds().toString(), dayPeriod: meridiem } = parts;\n  const toValidate = withSeconds ? [hour, minute, second] : [hour, minute];\n\n  if (toValidate.every(Boolean)) {\n    const is12h = meridiem !== undefined;\n\n    if (!validateTime(Number(hour), Number(minute), Number(second), is12h)) {\n      return {\n        valueAsISOString: '',\n        valueAsTimestamp: NaN,\n        state: 'invalid'\n      };\n    }\n\n    const resultDate = new Date(date);\n    resultDate.setUTCHours(\n      is12h ? convertTo24h(Number(hour), meridiem) : Number(hour),\n      Number(minute),\n      Number(second)\n    );\n    return {\n      valueAsISOString: resultDate.toISOString(),\n      valueAsTimestamp: resultDate.getTime()\n    };\n  }\n  if (toValidate.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 TimeInput: FunctionComponent<TimeInputProps & ForwardProps> = forwardRef(function TimeInput(\n  props: PropsWithoutRef<TimeInputProps>,\n  ref: Ref<HTMLFieldSetElement>\n) {\n  const { locale } = useConfiguration();\n  const {\n    testId,\n    value,\n    id,\n    label,\n    labelHidden,\n    status,\n    withSeconds = false,\n    pickerInterval = 30,\n    clockFormat,\n    info = getDateFormat(locale, getTimeOptions(withSeconds), true).join(''),\n    required,\n    readOnly,\n    disabled,\n    onChange,\n    onFocus,\n    onBlur,\n    onResolveSuggestion,\n    autoFocus,\n    additionalInfo,\n    handle,\n    ...restProps\n  } = props;\n\n  const testIds = useTestIds(testId, getTimeInputTestIds);\n\n  const date = value !== undefined ? parseToDate(value) : undefined;\n\n  const is12h = clockFormat ? clockFormat === 12 : is12HClockFormat(locale);\n\n  const [hourInputRef, minuteInputRef, secondInputRef, meridiemSelectRef] = [\n    useRef<HTMLInputElement>(null),\n    useRef<HTMLInputElement>(null),\n    useRef<HTMLInputElement>(null),\n    useRef<HTMLSelectElement>(null)\n  ];\n\n  useAutoFocusNextInput([hourInputRef, minuteInputRef, secondInputRef]);\n\n  const pickParts = () => {\n    const parts: TimeParts<string | undefined> = {\n      hour: hourInputRef.current?.value || undefined,\n      minute: minuteInputRef.current?.value || undefined\n    };\n    if (withSeconds) parts.second = secondInputRef.current?.value;\n    if (is12h) parts.dayPeriod = meridiemSelectRef.current?.value;\n    return parts;\n  };\n\n  const currentlySelectedTime = () => {\n    const parts = pickParts();\n\n    if (Object.values(parts).every(Boolean)) {\n      const hour = Number(parts.hour);\n      const minute = Number(parts.minute);\n      const second = parts.minute ? Number(parts.minute) : 0;\n\n      const current = date ?? new Date();\n      return validateTime(hour, minute, second, is12h)\n        ? new Date(\n            current.setUTCHours(is12h ? convertTo24h(hour, parts.dayPeriod!) : hour, minute, second)\n          )\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  };\n\n  const setMeridiem = (meridiem: string) => {\n    if (meridiemSelectRef.current) {\n      meridiemSelectRef.current.value = meridiem;\n    }\n  };\n\n  useEffect(() => {\n    if (is12h && meridiemSelectRef.current) {\n      meridiemSelectRef.current.value = getMeridiem(date?.getUTCHours());\n    }\n  }, [is12h, date?.getUTCHours()]);\n\n  const t = useI18n();\n\n  const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });\n\n  const hour = date && is12h ? convertTo12h(date.getUTCHours()) : date?.getUTCHours();\n  const HourInput = (\n    <PartInput\n      data-testid={testIds.controlHour}\n      key='hour'\n      placeholder={t('hour_placeholder')}\n      aria-label={displayNames.of('hour')}\n      value={hour}\n      onChange={onInputChange}\n      size={2}\n      maxLength={2}\n      readOnly={readOnly}\n      min={is12h ? 1 : 0}\n      max={is12h ? 12 : 23}\n      ref={hourInputRef}\n      autoFocus={autoFocus}\n    />\n  );\n\n  const MinuteInput = (\n    <PartInput\n      data-testid={testIds.controlMinute}\n      key='minute'\n      placeholder={t('minute_placeholder')}\n      aria-label={displayNames.of('minute')}\n      value={date?.getUTCMinutes()}\n      onChange={onInputChange}\n      size={2}\n      maxLength={2}\n      readOnly={readOnly}\n      max={59}\n      ref={minuteInputRef}\n    />\n  );\n\n  const SecondInput = (\n    <PartInput\n      data-testid={testIds.controlSecond}\n      key='second'\n      placeholder={t('second_placeholder')}\n      aria-label={displayNames.of('second')}\n      value={date?.getUTCSeconds()}\n      onChange={onInputChange}\n      size={2}\n      maxLength={2}\n      readOnly={readOnly}\n      max={59}\n      ref={secondInputRef}\n    />\n  );\n\n  const Period = (\n    <Select\n      data-testid={testIds.controlPeriod}\n      ref={meridiemSelectRef}\n      aria-label={displayNames.of('dayPeriod')}\n      key='period'\n      required={required}\n      disabled={disabled}\n      onChange={() => {\n        if (Object.values(pickParts()).every(Boolean)) onInputChange();\n      }}\n      readOnly={readOnly}\n    >\n      <Option value='AM'>{t('meridiem_value_am')}</Option>\n      <Option value='PM'>{t('meridiem_value_pm')}</Option>\n    </Select>\n  );\n\n  const containerRef = useConsolidatedRef(ref);\n  useFocusWithin([containerRef], onFocusChange);\n\n  useImperativeHandle(\n    handle,\n    () => ({\n      clear: () => {\n        if (hourInputRef.current) hourInputRef.current.value = '';\n        if (minuteInputRef.current) minuteInputRef.current.value = '';\n        if (secondInputRef.current) secondInputRef.current.value = '';\n        if (meridiemSelectRef.current) meridiemSelectRef.current.value = '';\n        onInputChange();\n      }\n    }),\n    [onInputChange]\n  );\n\n  const Picker = (\n    <>\n      <Button\n        data-testid={testIds.openClosePicker}\n        variant='simple'\n        icon\n        ref={setButtonEl}\n        onClick={() => setOpen(cur => !cur)}\n        aria-label={t(open ? 'close_time_button_a11y' : 'open_time_button_a11y')}\n        readOnly={readOnly}\n        disabled={disabled}\n      >\n        <Icon name='clock' />\n      </Button>\n\n      <Popover\n        show={open}\n        ref={setPopoverRef}\n        target={containerRef.current}\n        placement='bottom-end'\n        strategy='fixed'\n        modifiers={[sameWidth]}\n      >\n        <TimePicker\n          testId={testIds.root}\n          selected={currentlySelectedTime()}\n          interval={pickerInterval}\n          onSelect={selected => {\n            hourInputRef.current!.value = (\n              is12h ? convertTo12h(selected.getUTCHours()) : selected.getUTCHours()\n            )\n              .toString()\n              .padStart(2, '0');\n            minuteInputRef.current!.value = selected.getUTCMinutes().toString().padStart(2, '0');\n            if (withSeconds)\n              secondInputRef.current!.value = selected.getUTCSeconds().toString().padStart(2, '0');\n            if (meridiemSelectRef.current) {\n              meridiemSelectRef.current.value = getMeridiem(selected.getUTCHours());\n            }\n            setMeridiem(getMeridiem(selected.getUTCHours()));\n            setOpen(false);\n            setTimeout(() => buttonEl?.focus());\n            onInputChange();\n          }}\n          clockFormat={clockFormat}\n        />\n      </Popover>\n    </>\n  );\n\n  const Comp = (\n    <Flex\n      data-testid={testIds.root}\n      as={StyledTimeInput}\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) hourInputRef.current?.focus();\n      }}\n      {...restProps}\n    >\n      <Flex\n        ref={inputContainerRef}\n        as={StyledInputContainer}\n        container={{ alignItems: 'center', wrap: 'wrap' }}\n      >\n        {getDateFormat(locale, getTimeOptions(withSeconds, is12h)).map(part => {\n          switch (part) {\n            case 'hh':\n              return HourInput;\n            case 'mm':\n              return MinuteInput;\n            case 'ss':\n              return SecondInput;\n            case 'AM':\n            case 'PM':\n              return Period;\n            default:\n              return part;\n          }\n        })}\n      </Flex>\n      {!readOnly && Picker}\n    </Flex>\n  );\n\n  return label ? (\n    <FormField\n      testId={testIds}\n      as='fieldset'\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(TimeInput, getTimeInputTestIds);\n"]}

package/lib/components/DateTime/Input/TimeRangeInput.d.ts

@@ -1,48 +0,0 @@
-import { FunctionComponent, Ref } from 'react';
-import { FormControlProps, HandleValue } from '../../FormControl';
-import DateTimeProps, { DateRangeCallbackParameter, DateTimeProperties } from '../DateTime.types';
-import { ForwardProps } from '../../../types';
-import { MinuteInterval } from '../Picker/DatePicker.types';
-import { ClockFormat } from './utils';
-export interface TimeRangeInputProps extends DateTimeProperties {
-    /** Object of range boundaries. */
-    value?: {
-        start?: DateTimeProps['value'];
-        end?: DateTimeProps['value'];
-    };
-    /** Callback fired when inputs value changes. */
-    onChange: (value: DateRangeCallbackParameter) => void;
-    /** Callback fired when the component gets focused. */
-    onFocus?: (value: DateRangeCallbackParameter) => void;
-    /** Callback fired when the component loses focus. */
-    onBlur?: (value: DateRangeCallbackParameter) => void;
-    /** Pass a string or a fragment with an Icon and string for first part of TimeRangeInput. */
-    fromLabel?: FormControlProps['label'];
-    /** Pass a string or a fragment with an Icon and string for second part of TimeRangeInput. */
-    toLabel?: FormControlProps['label'];
-    /** Pass an object with "heading" and "content" properties to show AdditionalInfo for second part of DataRangeInput. */
-    toAdditionalInfo?: FormControlProps['additionalInfo'];
-    /** Pass an object with "heading" and "content" properties to show AdditionalInfo for first part of DataRangeInput. */
-    fromAdditionalInfo?: FormControlProps['additionalInfo'];
-    /** Controls which input is displayed */
-    mode: 'time' | 'datetime';
-    /**
-     * Display the time with seconds.
-     * @default false
-     */
-    withSeconds?: boolean;
-    /**
-     * Defines interval for time picker options (in minutes).
-     * @default 30
-     */
-    pickerInterval?: MinuteInterval;
-    /** Defines clock format that overrides locale based format */
-    clockFormat?: ClockFormat;
-    /** Imperative handle */
-    handle?: Ref<HandleValue>;
-}
-declare const _default: FunctionComponent<TimeRangeInputProps & ForwardProps> & {
-    getTestIds: (testIdProp?: string | undefined) => import("../../../types").TestIdsRecord<readonly ["from-time", "to-time", "from-date-time", "to-date-time", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
-};
-export default _default;
-//# sourceMappingURL=TimeRangeInput.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"TimeRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/TimeRangeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,GAAG,EAKJ,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAElE,OAAO,aAAa,EAAE,EACpB,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAK5D,OAAO,EAAE,WAAW,EAAe,MAAM,SAAS,CAAC;AAInD,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;IAC1B,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CAC3B;;;;AA2OD,wBAAqE"}

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

@@ -1,120 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useImperativeHandle, useReducer, useRef } from 'react';
-import Flex from '../../Flex';
-import { useConsolidatedRef, useFocusWithin, useI18n, useTestIds } from '../../../hooks';
-import { StyledRangeInputContainer } from '../../Input/Input.styles';
-import FormField from '../../FormField';
-import { getTimeRangeInputTestIds } from '../DateTime.test-ids';
-import { withTestIds } from '../../../utils';
-import { parseToDate } from './utils';
-import TimeInput from './TimeInput';
-import DateTimeInput from './DateTimeInput';
-const reducer = (prevState, { type, value }) => {
-    switch (type) {
-        case 'start': {
-            return { ...prevState, start: value };
-        }
-        case 'end': {
-            return { ...prevState, end: value };
-        }
-        default:
-            return prevState;
-    }
-};
-const convertToCallbackParameter = (v) => {
-    return {
-        valueAsISOString: v === undefined || Number.isNaN(v) ? undefined : new Date(v).toISOString(),
-        valueAsTimestamp: v
-    };
-};
-const TimeRangeInput = forwardRef(function TimeRangeInput({ testId, value = {}, onChange, onFocus, onBlur, label, fromLabel, toLabel, labelHidden, required, readOnly, disabled, min, max, withSeconds, pickerInterval, clockFormat, mode, status, fromAdditionalInfo, toAdditionalInfo, autoFocus, handle, ...restProps }, ref) {
-    const testIds = useTestIds(testId, getTimeRangeInputTestIds);
-    const t = useI18n();
-    const startTimeInputRef = useRef(null);
-    const endTimeInputRef = useRef(null);
-    const startTimeClearHandle = useRef(null);
-    const endTimeClearHandle = useRef(null);
-    const [state, dispatch] = useReducer(reducer, {
-        start: value.start ? parseToDate(value.start).getTime() : undefined,
-        end: value.end ? parseToDate(value.end).getTime() : undefined
-    });
-    const startTimeRef = useRef(convertToCallbackParameter(state.start));
-    const endTimeRef = useRef(convertToCallbackParameter(state.end));
-    useImperativeHandle(handle, () => ({
-        clear: () => {
-            startTimeClearHandle.current?.clear();
-            endTimeClearHandle.current?.clear();
-            const emptyCallbackParameter = convertToCallbackParameter(undefined);
-            startTimeRef.current = emptyCallbackParameter;
-            endTimeRef.current = emptyCallbackParameter;
-            dispatch({ type: 'start', value: undefined });
-            dispatch({ type: 'end', value: undefined });
-            onChange({
-                start: emptyCallbackParameter,
-                end: emptyCallbackParameter
-            });
-        }
-    }), [onChange]);
-    const onFocusChange = useCallback((focused) => {
-        (focused ? onFocus : onBlur)?.({
-            start: startTimeRef.current,
-            end: endTimeRef.current
-        });
-    }, [onFocus, onBlur]);
-    const containerRef = useConsolidatedRef(ref);
-    useFocusWithin([containerRef], onFocusChange);
-    const commonProps = {
-        required,
-        readOnly,
-        disabled,
-        min,
-        max,
-        status,
-        withSeconds,
-        pickerInterval,
-        clockFormat
-    };
-    return (_jsx(FormField, { testId: testIds, as: 'fieldset', ...restProps, container: { wrap: 'nowrap' }, ref: containerRef, labelAs: 'legend', label: label, labelHidden: labelHidden, disabled: disabled, required: required, readOnly: readOnly, status: status, children: _jsx(Flex, { container: true, as: StyledRangeInputContainer, children: mode === 'time' ? (_jsxs(_Fragment, { children: [_jsx(TimeInput, { ...commonProps, testId: testIds.fromTime, value: state.start, onBlur: changedValue => {
-                            dispatch({
-                                type: 'start',
-                                value: changedValue.state ? undefined : changedValue.valueAsTimestamp
-                            });
-                            startTimeRef.current = changedValue;
-                            onChange({
-                                start: changedValue,
-                                end: convertToCallbackParameter(state.end)
-                            });
-                        }, label: fromLabel, "aria-label": `${t('range_from_datetime') + (label ? ` - ${label}` : '')}`, additionalInfo: fromAdditionalInfo, autoFocus: autoFocus, ref: startTimeInputRef, handle: startTimeClearHandle }), _jsx(TimeInput, { ...commonProps, testId: testIds.toTime, value: state.end, onBlur: changedValue => {
-                            dispatch({
-                                type: 'end',
-                                value: changedValue.state ? undefined : changedValue.valueAsTimestamp
-                            });
-                            endTimeRef.current = changedValue;
-                            onChange({
-                                start: convertToCallbackParameter(state.start),
-                                end: changedValue
-                            });
-                        }, label: toLabel, "aria-label": `${t('range_to_datetime') + (label ? ` - ${label}` : '')}`, additionalInfo: toAdditionalInfo, ref: endTimeInputRef, handle: endTimeClearHandle })] })) : (_jsxs(_Fragment, { children: [_jsx(DateTimeInput, { ...commonProps, testId: testIds.fromDateTime, value: state.start, onBlur: changedValue => {
-                            dispatch({
-                                type: 'start',
-                                value: changedValue.state ? undefined : changedValue.valueAsTimestamp
-                            });
-                            startTimeRef.current = changedValue;
-                            onChange({
-                                start: changedValue,
-                                end: convertToCallbackParameter(state.end)
-                            });
-                        }, label: fromLabel, "aria-label": `${t('range_from_datetime') + (label ? ` - ${label}` : '')}`, additionalInfo: fromAdditionalInfo, ref: startTimeInputRef, handle: startTimeClearHandle }), _jsx(DateTimeInput, { testId: testIds.toDateTime, ...commonProps, value: state.end, onBlur: changedValue => {
-                            dispatch({
-                                type: 'end',
-                                value: changedValue.state ? undefined : changedValue.valueAsTimestamp
-                            });
-                            endTimeRef.current = changedValue;
-                            onChange({
-                                start: convertToCallbackParameter(state.start),
-                                end: changedValue
-                            });
-                        }, label: toLabel, "aria-label": `${t('range_to_datetime') + (label ? ` - ${label}` : '')}`, additionalInfo: toAdditionalInfo, ref: endTimeInputRef, handle: endTimeClearHandle })] })) }) }));
-});
-export default withTestIds(TimeRangeInput, getTimeRangeInputTestIds);
-//# sourceMappingURL=TimeRangeInput.js.map