@pega/cosmos-react-core 3.0.0-dev.4.2 → 3.0.0-dev.5.0

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

@@ -1 +1 @@
-{"version":3,"file":"DayOfWeekInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DayOfWeekInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useMemo } from 'react';\n\nimport { ForwardProps } from '../../../types';\nimport Select, { Option } from '../../Select';\nimport { SelectProps } from '../../Select/Select';\nimport { FormControlProps } from '../../FormControl';\nimport { useConfiguration } from '../../../hooks';\n\nimport { CALENDAR_TYPES } from './local';\nimport { getCalendarTypeFromLocale, getWeekdays } from './utils';\n\nexport type DayOfWeek = 1 | 2 | 3 | 4 | 5 | 6 | 7;\n\nexport interface DayOfWeekInputProps {\n  /**\n   * Number from range [1-7].\n   * Creates a controlled input and sets the value. Requires an onChange handler to update value.\n   * value + onChange is the recommended method per React team.\n   */\n  value?: DayOfWeek;\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Visually hides the label region. */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Makes the input non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Callback fired when input value changes. */\n  onChange?: (value: DayOfWeek) => void;\n}\n\n// returns object with properties for localized days names\n// properties are numbers corresponding to days order according to ISO_8601 calendar (1-Monday, 2-Tuesday etc.)\nfunction getDayOfWeekNamesMap(localeTag?: string) {\n  return getWeekdays(CALENDAR_TYPES.ISO_8601).reduce((accumulator, dayDate, index) => {\n    accumulator[index + 1] = dayDate.toLocaleString(localeTag, {\n      weekday: 'long',\n      timeZone: 'UTC'\n    });\n    return accumulator;\n  }, {} as { [key: number]: string });\n}\n\n// returns index of the first day of week according to given calendar type\n// returned value is a position of the day in base ISO calendar\nfunction getFirstWeekDayForCalendar(refCalendarType = CALENDAR_TYPES.ISO_8601) {\n  switch (refCalendarType) {\n    case CALENDAR_TYPES.ISO_8601:\n      // start week with Monday\n      return 0;\n    case CALENDAR_TYPES.ARABIC:\n      // start week with Saturday\n      return 5;\n    case CALENDAR_TYPES.HEBREW:\n    case CALENDAR_TYPES.US:\n      // start week with Sunday\n      return 6;\n    default:\n      // ISO as default\n      return 0;\n  }\n}\n\n// returns array of Options for day names, ordered according to given calendar\nfunction generateOrderedDays(dayOfWeekNames: { [key: number]: string }, refCalendarType: string) {\n  const optionsArray = Object.keys(dayOfWeekNames).map(key => {\n    return (\n      <Option key={dayOfWeekNames[Number(key)]} value={key.toString()}>\n        {dayOfWeekNames[Number(key)]}\n      </Option>\n    );\n  });\n\n  const startingDayIndex = getFirstWeekDayForCalendar(refCalendarType);\n\n  return [...optionsArray.slice(startingDayIndex), ...optionsArray.slice(0, startingDayIndex)];\n}\n\nconst DayOfWeekInput: FunctionComponent<DayOfWeekInputProps & ForwardProps> = (\n  props: DayOfWeekInputProps\n) => {\n  const { locale } = useConfiguration();\n  const { value, required, readOnly, disabled, onChange, ...restProps } = props;\n\n  // days ordered according to given calendar\n  const dayOfWeekOptions = useMemo(\n    () => generateOrderedDays(getDayOfWeekNamesMap(locale), getCalendarTypeFromLocale(locale)),\n    [locale]\n  );\n\n  const onChangeWrapper: SelectProps['onChange'] = ev => {\n    onChange?.(Number(ev.target.value) as DayOfWeek);\n  };\n\n  return (\n    <Select\n      required={required}\n      value={value ? value.toString() : undefined}\n      onChange={onChangeWrapper}\n      readOnly={readOnly}\n      disabled={disabled || readOnly}\n      {...restProps}\n    >\n      {!required && <Option> </Option>}\n      {dayOfWeekOptions}\n    </Select>\n  );\n};\n\nexport default DayOfWeekInput;\n"]}
+{"version":3,"file":"DayOfWeekInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DayOfWeekInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useMemo } from 'react';\n\nimport { ForwardProps } from '../../../types';\nimport Select, { Option } from '../../Select';\nimport { SelectProps } from '../../Select/Select';\nimport { FormControlProps } from '../../FormControl';\nimport { useConfiguration } from '../../../hooks';\n\nimport { CALENDAR_TYPES } from './local';\nimport { getCalendarTypeFromLocale, getWeekdays } from './utils';\n\nexport type DayOfWeek = 1 | 2 | 3 | 4 | 5 | 6 | 7;\n\nexport interface DayOfWeekInputProps {\n  /**\n   * Number from range [1-7].\n   * Creates a controlled input and sets the value. Requires an onChange handler to update value.\n   * value + onChange is the recommended method per React team.\n   */\n  value?: DayOfWeek;\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Visually hides the label region. */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Makes the input non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Callback fired when input value changes. */\n  onChange?: (value: DayOfWeek) => void;\n}\n\n// returns object with properties for localized days names\n// properties are numbers corresponding to days order according to ISO_8601 calendar (1-Monday, 2-Tuesday etc.)\nfunction getDayOfWeekNamesMap(localeTag?: string) {\n  return getWeekdays(CALENDAR_TYPES.ISO_8601).reduce((accumulator, dayDate, index) => {\n    accumulator[index + 1] = dayDate.toLocaleString(localeTag, {\n      weekday: 'long',\n      timeZone: 'UTC'\n    });\n    return accumulator;\n  }, {} as { [key: number]: string });\n}\n\n// returns index of the first day of week according to given calendar type\n// returned value is a position of the day in base ISO calendar\nfunction getFirstWeekDayForCalendar(refCalendarType = CALENDAR_TYPES.ISO_8601) {\n  switch (refCalendarType) {\n    case CALENDAR_TYPES.ISO_8601:\n      // start week with Monday\n      return 0;\n    case CALENDAR_TYPES.ARABIC:\n      // start week with Saturday\n      return 5;\n    case CALENDAR_TYPES.HEBREW:\n    case CALENDAR_TYPES.US:\n      // start week with Sunday\n      return 6;\n    default:\n      // ISO as default\n      return 0;\n  }\n}\n\n// returns array of Options for day names, ordered according to given calendar\nfunction generateOrderedDays(dayOfWeekNames: { [key: number]: string }, refCalendarType: string) {\n  const optionsArray = Object.keys(dayOfWeekNames).map(key => {\n    return (\n      <Option key={dayOfWeekNames[Number(key)]} value={key.toString()}>\n        {dayOfWeekNames[Number(key)]}\n      </Option>\n    );\n  });\n\n  const startingDayIndex = getFirstWeekDayForCalendar(refCalendarType);\n\n  return [...optionsArray.slice(startingDayIndex), ...optionsArray.slice(0, startingDayIndex)];\n}\n\nconst DayOfWeekInput: FunctionComponent<DayOfWeekInputProps & ForwardProps> = (\n  props: DayOfWeekInputProps\n) => {\n  const { locale } = useConfiguration();\n  const { value, required, readOnly, disabled, onChange, ...restProps } = props;\n\n  // days ordered according to given calendar\n  const dayOfWeekOptions = useMemo(\n    () => generateOrderedDays(getDayOfWeekNamesMap(locale), getCalendarTypeFromLocale(locale)),\n    [locale]\n  );\n\n  const onChangeWrapper: SelectProps['onChange'] = ev => {\n    onChange?.(Number(ev.target.value) as DayOfWeek);\n  };\n\n  return (\n    <Select\n      required={required}\n      value={value ? value.toString() : undefined}\n      onChange={onChangeWrapper}\n      readOnly={readOnly}\n      disabled={disabled || readOnly}\n      {...restProps}\n    >\n      {!required && <Option> </Option>}\n      {dayOfWeekOptions}\n    </Select>\n  );\n};\n\nexport default DayOfWeekInput;\n"]}

package/lib/components/DateTime/Input/Duration/DurationInput.js

@@ -8,8 +8,8 @@ import { Format } from './DurationInput.types';
 const DurationInput = forwardRef((props, ref) => {
     const { id, label, labelHidden, required, status, disabled, onChange, format = Format.Seconds, onSelect, ...restProps } = props;
     const t = useI18n();
-    const Comp = format === Format.Formatted ? (_jsx(Time, { ...{ status, disabled, onChange }, ...restProps }, void 0)) : (_jsx(NumberUnit, { ...{ format, status, disabled, onChange, onSelect }, ...restProps }, void 0));
-    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', info: format === Format.Formatted && t('time_format_info'), status: status, ...{ label, labelHidden, id, required, disabled, ref }, children: Comp }, void 0)) : (Comp);
+    const Comp = format === Format.Formatted ? (_jsx(Time, { ...{ status, disabled, onChange }, ...restProps })) : (_jsx(NumberUnit, { ...{ format, status, disabled, onChange, onSelect }, ...restProps }));
+    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', info: format === Format.Formatted && t('time_format_info'), status: status, ...{ label, labelHidden, id, required, disabled, ref }, children: Comp })) : (Comp);
 });
 export default DurationInput;
 //# sourceMappingURL=DurationInput.js.map

package/lib/components/DateTime/Input/Duration/DurationInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DurationInput.js","sourceRoot":"","sources":["../../../../../src/components/DateTime/Input/Duration/DurationInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAmB,UAAU,EAA0B,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,SAAS,MAAM,oBAAoB,CAAC;AAG3C,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAA2B,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAEnE,MAAM,aAAa,GAAyD,UAAU,CACpF,CAAC,KAA0C,EAAE,GAA6B,EAAE,EAAE;IAC5E,MAAM,EACJ,EAAE,EACF,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,GAAG,MAAM,CAAC,OAAO,EACvB,QAAQ,EACR,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,IAAI,GACR,MAAM,KAAK,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAC5B,KAAC,IAAI,OAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAM,SAAS,WAAI,CAC5D,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,OAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAM,SAAS,WAAI,CACpF,CAAC;IAEJ,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,IACR,EAAE,EAAC,UAAU,EACb,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC,SAAS,IAAI,CAAC,CAAC,kBAAkB,CAAC,EAC1D,MAAM,EAAE,MAAM,KACV,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,YAEtD,IAAI,WACK,CACb,CAAC,CAAC,CAAC,CACF,IAAI,CACL,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { PropsWithoutRef, forwardRef, Ref, FunctionComponent } from 'react';\n\nimport { useI18n } from '../../../../hooks';\nimport FormField from '../../../FormField';\nimport { ForwardProps } from '../../../../types';\n\nimport Time from './Time';\nimport NumberUnit from './NumberUnit';\nimport DurationInputProps, { Format } from './DurationInput.types';\n\nconst DurationInput: FunctionComponent<DurationInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<DurationInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const {\n      id,\n      label,\n      labelHidden,\n      required,\n      status,\n      disabled,\n      onChange,\n      format = Format.Seconds,\n      onSelect,\n      ...restProps\n    } = props;\n    const t = useI18n();\n\n    const Comp =\n      format === Format.Formatted ? (\n        <Time {...{ status, disabled, onChange }} {...restProps} />\n      ) : (\n        <NumberUnit {...{ format, status, disabled, onChange, onSelect }} {...restProps} />\n      );\n\n    return label ? (\n      <FormField\n        as='fieldset'\n        labelAs='legend'\n        info={format === Format.Formatted && t('time_format_info')}\n        status={status}\n        {...{ label, labelHidden, id, required, disabled, ref }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default DurationInput;\n"]}
+{"version":3,"file":"DurationInput.js","sourceRoot":"","sources":["../../../../../src/components/DateTime/Input/Duration/DurationInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAmB,UAAU,EAA0B,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,SAAS,MAAM,oBAAoB,CAAC;AAG3C,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAA2B,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAEnE,MAAM,aAAa,GAAyD,UAAU,CACpF,CAAC,KAA0C,EAAE,GAA6B,EAAE,EAAE;IAC5E,MAAM,EACJ,EAAE,EACF,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,GAAG,MAAM,CAAC,OAAO,EACvB,QAAQ,EACR,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,IAAI,GACR,MAAM,KAAK,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAC5B,KAAC,IAAI,OAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAM,SAAS,GAAI,CAC5D,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,OAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAM,SAAS,GAAI,CACpF,CAAC;IAEJ,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,IACR,EAAE,EAAC,UAAU,EACb,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC,SAAS,IAAI,CAAC,CAAC,kBAAkB,CAAC,EAC1D,MAAM,EAAE,MAAM,KACV,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,YAEtD,IAAI,GACK,CACb,CAAC,CAAC,CAAC,CACF,IAAI,CACL,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { PropsWithoutRef, forwardRef, Ref, FunctionComponent } from 'react';\n\nimport { useI18n } from '../../../../hooks';\nimport FormField from '../../../FormField';\nimport { ForwardProps } from '../../../../types';\n\nimport Time from './Time';\nimport NumberUnit from './NumberUnit';\nimport DurationInputProps, { Format } from './DurationInput.types';\n\nconst DurationInput: FunctionComponent<DurationInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<DurationInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const {\n      id,\n      label,\n      labelHidden,\n      required,\n      status,\n      disabled,\n      onChange,\n      format = Format.Seconds,\n      onSelect,\n      ...restProps\n    } = props;\n    const t = useI18n();\n\n    const Comp =\n      format === Format.Formatted ? (\n        <Time {...{ status, disabled, onChange }} {...restProps} />\n      ) : (\n        <NumberUnit {...{ format, status, disabled, onChange, onSelect }} {...restProps} />\n      );\n\n    return label ? (\n      <FormField\n        as='fieldset'\n        labelAs='legend'\n        info={format === Format.Formatted && t('time_format_info')}\n        status={status}\n        {...{ label, labelHidden, id, required, disabled, ref }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default DurationInput;\n"]}

package/lib/components/DateTime/Input/Duration/NumberUnit.js

@@ -80,7 +80,7 @@ const NumberUnit = (props) => {
     }, [onSelect]);
     const unitOptions = OPTIONS.map(option => (_jsx(Option, { value: option, children: t(`${option}_text`) }, option)));
     const id = useUID();
-    return (_jsxs(Flex, { as: StyledNumberUnit, forwardedAs: StyledFormControl, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ...restProps, children: [_jsx(Input, { type: 'number', placeholder: '0', "aria-labelledby": id, value: msToTimeUnit(valueInMs, unit), onChange: onNumberInputChange, onBlur: onInputBlur, onKeyDown: onInputKeyDown, required: required, status: status, readOnly: readOnly, disabled: disabled, autoFocus: autoFocus }, 'number'), _jsx(Select, { id: id, "aria-label": t(`${unit}_text`), value: unit, required: required, status: status, readOnly: readOnly, disabled: disabled || readOnly, onChange: onSelectChange, children: unitOptions }, 'unit')] }, void 0));
+    return (_jsxs(Flex, { as: StyledNumberUnit, forwardedAs: StyledFormControl, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ...restProps, children: [_jsx(Input, { type: 'number', placeholder: '0', "aria-labelledby": id, value: msToTimeUnit(valueInMs, unit), onChange: onNumberInputChange, onBlur: onInputBlur, onKeyDown: onInputKeyDown, required: required, status: status, readOnly: readOnly, disabled: disabled, autoFocus: autoFocus }, 'number'), _jsx(Select, { id: id, "aria-label": t(`${unit}_text`), value: unit, required: required, status: status, readOnly: readOnly, disabled: disabled || readOnly, onChange: onSelectChange, children: unitOptions }, 'unit')] }));
 };
 export default NumberUnit;
 //# sourceMappingURL=NumberUnit.js.map

package/lib/components/DateTime/Input/Duration/NumberUnit.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberUnit.js","sourceRoot":"","sources":["../../../../../src/components/DateTime/Input/Duration/NumberUnit.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ChangeEvent, FC, KeyboardEvent, useCallback, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { TranslationPack } from '../../../../i18n';\nimport { useDirection, useI18n, useUID } from '../../../../hooks';\nimport StyledInput from '../../../Input/Input.styles';\nimport { StyledSelect } from '../../../Select/Select';\nimport { ForwardProps } from '../../../../types';\nimport { msToTimeUnit, timeUnitToMs } from '../utils';\nimport StyledDateTime from '../DateTime.styles';\nimport { StyledFormControl } from '../../../FormControl';\nimport Flex from '../../../Flex';\nimport Input from '../../../Input';\nimport Select, { Option } from '../../../Select';\nimport { defaultThemeProp } from '../../../../theme';\n\nimport DurationInputProps, { Format } from './DurationInput.types';\n\nexport const StyledNumberUnit = styled(StyledDateTime)<DurationInputProps>(() => {\n  const { start, end } = useDirection();\n  return css`\n    padding: 0;\n    border: 0;\n    height: auto;\n    &:focus-within:not([readonly]):not([disabled]) {\n      box-shadow: none;\n    }\n    > ${StyledInput} {\n      background-color: transparent;\n      border-top-${end}-radius: 0;\n      border-bottom-${end}-radius: 0;\n    }\n    > ${StyledSelect} {\n      max-width: max-content;\n      margin-inline-start: -0.0625rem;\n      background-color: transparent;\n      border-top-${start}-radius: 0;\n      border-bottom-${start}-radius: 0;\n    }\n    &[readonly] > ${StyledSelect} {\n      color: currentcolor;\n      opacity: 1;\n      cursor: default;\n    }\n    > ${StyledInput}:hover:not([readonly]):not([disabled]) + ${StyledSelect} {\n      border-inline-start: transparent;\n    }\n  `;\n});\n\nStyledNumberUnit.defaultProps = defaultThemeProp;\n\ntype NumberUnitProps = DurationInputProps & ForwardProps;\n\nconst OPTIONS = [Format.Seconds, Format.Minutes, Format.Hours, Format.Days];\n\nconst NumberUnit: FC<NumberUnitProps> = (props: DurationInputProps) => {\n  const {\n    defaultValue = 0,\n    value,\n    onChange,\n    format = Format.Seconds,\n    onSelect,\n    disabled,\n    readOnly,\n    required,\n    status,\n    autoFocus,\n    ...restProps\n  } = props;\n  const t = useI18n();\n  const [valueInMs, setValueInMs] = useState<number>(value ?? defaultValue);\n  const [unit, setUnit] = useState<Format>(format);\n\n  useEffect(() => {\n    setUnit(format);\n  }, [format]);\n\n  useEffect(() => {\n    if (value !== undefined) {\n      setValueInMs(value);\n    }\n  }, [value]);\n\n  const onNumberInputChange = useCallback(\n    (ev: ChangeEvent<HTMLInputElement>) => {\n      const inputValue = Number(ev.target.value);\n      if (Number.isNaN(inputValue) || inputValue < 0) return;\n      setValueInMs(timeUnitToMs(inputValue, unit));\n    },\n    [unit]\n  );\n\n  const onInputBlur = useCallback(() => {\n    if (!disabled && !readOnly && onChange) {\n      onChange(valueInMs);\n    }\n  }, [valueInMs, onChange]);\n\n  const onInputKeyDown = useCallback((ev: KeyboardEvent<HTMLInputElement>) => {\n    if (['e', 'E', '+', '-', ',', '.'].includes(ev.key)) ev.preventDefault();\n  }, []);\n\n  const onSelectChange = useCallback(\n    (ev: ChangeEvent<HTMLSelectElement>) => {\n      const selectedValue = ev.target.value as Format;\n      setUnit(selectedValue);\n      onSelect?.(selectedValue);\n    },\n    [onSelect]\n  );\n\n  const unitOptions = OPTIONS.map(option => (\n    <Option key={option} value={option}>\n      {t(`${option}_text` as keyof TranslationPack)}\n    </Option>\n  ));\n\n  const id = useUID();\n\n  return (\n    <Flex\n      as={StyledNumberUnit}\n      forwardedAs={StyledFormControl}\n      container={{ alignItems: 'center', wrap: 'nowrap' }}\n      status={status}\n      readOnly={readOnly}\n      disabled={disabled}\n      {...restProps}\n    >\n      <Input\n        type='number'\n        key='number'\n        placeholder='0'\n        aria-labelledby={id}\n        value={msToTimeUnit(valueInMs, unit) as any}\n        onChange={onNumberInputChange}\n        onBlur={onInputBlur}\n        onKeyDown={onInputKeyDown}\n        required={required}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n        autoFocus={autoFocus}\n      />\n      <Select\n        id={id}\n        aria-label={t(`${unit}_text` as keyof TranslationPack)}\n        key='unit'\n        value={unit}\n        required={required}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled || readOnly}\n        onChange={onSelectChange}\n      >\n        {unitOptions}\n      </Select>\n    </Flex>\n  );\n};\n\nexport default NumberUnit;\n"]}
+{"version":3,"file":"NumberUnit.js","sourceRoot":"","sources":["../../../../../src/components/DateTime/Input/Duration/NumberUnit.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ChangeEvent, FC, KeyboardEvent, useCallback, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { TranslationPack } from '../../../../i18n';\nimport { useDirection, useI18n, useUID } from '../../../../hooks';\nimport StyledInput from '../../../Input/Input.styles';\nimport { StyledSelect } from '../../../Select/Select';\nimport { ForwardProps } from '../../../../types';\nimport { msToTimeUnit, timeUnitToMs } from '../utils';\nimport StyledDateTime from '../DateTime.styles';\nimport { StyledFormControl } from '../../../FormControl';\nimport Flex from '../../../Flex';\nimport Input from '../../../Input';\nimport Select, { Option } from '../../../Select';\nimport { defaultThemeProp } from '../../../../theme';\n\nimport DurationInputProps, { Format } from './DurationInput.types';\n\nexport const StyledNumberUnit = styled(StyledDateTime)<DurationInputProps>(() => {\n  const { start, end } = useDirection();\n  return css`\n    padding: 0;\n    border: 0;\n    height: auto;\n    &:focus-within:not([readonly]):not([disabled]) {\n      box-shadow: none;\n    }\n    > ${StyledInput} {\n      background-color: transparent;\n      border-top-${end}-radius: 0;\n      border-bottom-${end}-radius: 0;\n    }\n    > ${StyledSelect} {\n      max-width: max-content;\n      margin-inline-start: -0.0625rem;\n      background-color: transparent;\n      border-top-${start}-radius: 0;\n      border-bottom-${start}-radius: 0;\n    }\n    &[readonly] > ${StyledSelect} {\n      color: currentcolor;\n      opacity: 1;\n      cursor: default;\n    }\n    > ${StyledInput}:hover:not([readonly]):not([disabled]) + ${StyledSelect} {\n      border-inline-start: transparent;\n    }\n  `;\n});\n\nStyledNumberUnit.defaultProps = defaultThemeProp;\n\ntype NumberUnitProps = DurationInputProps & ForwardProps;\n\nconst OPTIONS = [Format.Seconds, Format.Minutes, Format.Hours, Format.Days];\n\nconst NumberUnit: FC<NumberUnitProps> = (props: DurationInputProps) => {\n  const {\n    defaultValue = 0,\n    value,\n    onChange,\n    format = Format.Seconds,\n    onSelect,\n    disabled,\n    readOnly,\n    required,\n    status,\n    autoFocus,\n    ...restProps\n  } = props;\n  const t = useI18n();\n  const [valueInMs, setValueInMs] = useState<number>(value ?? defaultValue);\n  const [unit, setUnit] = useState<Format>(format);\n\n  useEffect(() => {\n    setUnit(format);\n  }, [format]);\n\n  useEffect(() => {\n    if (value !== undefined) {\n      setValueInMs(value);\n    }\n  }, [value]);\n\n  const onNumberInputChange = useCallback(\n    (ev: ChangeEvent<HTMLInputElement>) => {\n      const inputValue = Number(ev.target.value);\n      if (Number.isNaN(inputValue) || inputValue < 0) return;\n      setValueInMs(timeUnitToMs(inputValue, unit));\n    },\n    [unit]\n  );\n\n  const onInputBlur = useCallback(() => {\n    if (!disabled && !readOnly && onChange) {\n      onChange(valueInMs);\n    }\n  }, [valueInMs, onChange]);\n\n  const onInputKeyDown = useCallback((ev: KeyboardEvent<HTMLInputElement>) => {\n    if (['e', 'E', '+', '-', ',', '.'].includes(ev.key)) ev.preventDefault();\n  }, []);\n\n  const onSelectChange = useCallback(\n    (ev: ChangeEvent<HTMLSelectElement>) => {\n      const selectedValue = ev.target.value as Format;\n      setUnit(selectedValue);\n      onSelect?.(selectedValue);\n    },\n    [onSelect]\n  );\n\n  const unitOptions = OPTIONS.map(option => (\n    <Option key={option} value={option}>\n      {t(`${option}_text` as keyof TranslationPack)}\n    </Option>\n  ));\n\n  const id = useUID();\n\n  return (\n    <Flex\n      as={StyledNumberUnit}\n      forwardedAs={StyledFormControl}\n      container={{ alignItems: 'center', wrap: 'nowrap' }}\n      status={status}\n      readOnly={readOnly}\n      disabled={disabled}\n      {...restProps}\n    >\n      <Input\n        type='number'\n        key='number'\n        placeholder='0'\n        aria-labelledby={id}\n        value={msToTimeUnit(valueInMs, unit) as any}\n        onChange={onNumberInputChange}\n        onBlur={onInputBlur}\n        onKeyDown={onInputKeyDown}\n        required={required}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n        autoFocus={autoFocus}\n      />\n      <Select\n        id={id}\n        aria-label={t(`${unit}_text` as keyof TranslationPack)}\n        key='unit'\n        value={unit}\n        required={required}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled || readOnly}\n        onChange={onSelectChange}\n      >\n        {unitOptions}\n      </Select>\n    </Flex>\n  );\n};\n\nexport default NumberUnit;\n"]}

package/lib/components/DateTime/Input/Duration/Time.js

@@ -43,7 +43,7 @@ const Time = (props) => {
     return (_jsxs(Flex, { as: StyledDateTime, forwardedAs: StyledFormControl, 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(PartInput, { placeholder: t('hour_placeholder'), "aria-label": t('hour_label_a11y'), value: time.hour, readOnly: readOnly, ref: hourInputRef, autoFocus: autoFocus }, 'hour'), ":", _jsx(PartInput, { placeholder: t('minute_placeholder'), "aria-label": t('minute_label_a11y'), value: time.minute, size: 2, maxLength: 2, readOnly: readOnly, max: 59, ref: minuteInputRef }, 'minute'), ":", _jsx(PartInput, { placeholder: t('second_placeholder'), "aria-label": t('second_label_a11y'), value: time.second, size: 2, maxLength: 2, readOnly: readOnly, max: 59, ref: secondInputRef }, 'second')] }, void 0));
+        }, ...restProps, children: [_jsx(PartInput, { placeholder: t('hour_placeholder'), "aria-label": t('hour_label_a11y'), value: time.hour, readOnly: readOnly, ref: hourInputRef, autoFocus: autoFocus }, 'hour'), ":", _jsx(PartInput, { placeholder: t('minute_placeholder'), "aria-label": t('minute_label_a11y'), value: time.minute, size: 2, maxLength: 2, readOnly: readOnly, max: 59, ref: minuteInputRef }, 'minute'), ":", _jsx(PartInput, { placeholder: t('second_placeholder'), "aria-label": t('second_label_a11y'), value: time.second, size: 2, maxLength: 2, readOnly: readOnly, max: 59, ref: secondInputRef }, 'second')] }));
 };
 export default Time;
 //# sourceMappingURL=Time.js.map

package/lib/components/DateTime/Input/Duration/Time.js.map

@@ -1 +1 @@
-{"version":3,"file":"Time.js","sourceRoot":"","sources":["../../../../../src/components/DateTime/Input/Duration/Time.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useCallback, useRef } from 'react';\n\nimport { ForwardProps } from '../../../../types';\nimport { useI18n, useFocusWithin } from '../../../../hooks';\nimport { msToTimeFormat, timeFormatToMs } from '../utils';\nimport StyledDateTime from '../DateTime.styles';\nimport { StyledFormControl } from '../../../FormControl';\nimport Flex from '../../../Flex';\nimport PartInput from '../PartInput';\nimport useAutoFocusNextInput from '../useAutoFocusNextInput';\n\nimport DurationInputProps from './DurationInput.types';\n\ntype TimeProps = DurationInputProps & ForwardProps;\n\nconst Time: FC<TimeProps> = (props: DurationInputProps) => {\n  const { value, onChange, disabled, readOnly, required, status, autoFocus, ...restProps } = props;\n\n  const time =\n    value !== undefined\n      ? msToTimeFormat(value)\n      : { hour: undefined, minute: undefined, second: undefined };\n\n  const [hourInputRef, minuteInputRef, secondInputRef] = [\n    useRef<HTMLInputElement>(null),\n    useRef<HTMLInputElement>(null),\n    useRef<HTMLInputElement>(null)\n  ];\n\n  useAutoFocusNextInput([hourInputRef, minuteInputRef, secondInputRef]);\n\n  const pickParts = () => {\n    return [\n      hourInputRef.current?.value || undefined,\n      minuteInputRef.current?.value || undefined,\n      secondInputRef.current?.value || undefined\n    ];\n  };\n\n  const onFocusChange = useCallback(\n    (focused: boolean) => {\n      if (!focused && !disabled && !readOnly && onChange) {\n        const parts = pickParts();\n        onChange(\n          parts.some(v => v !== undefined)\n            ? timeFormatToMs({\n                hour: Number(parts[0] ?? 0),\n                minute: Number(parts[1] ?? 0),\n                second: Number(parts[2] ?? 0)\n              })\n            : undefined\n        );\n      }\n    },\n    [disabled, readOnly, onChange]\n  );\n\n  const t = useI18n();\n\n  const containerRef = useRef<HTMLElement>(null);\n  useFocusWithin([containerRef], onFocusChange);\n\n  return (\n    <Flex\n      as={StyledDateTime}\n      forwardedAs={StyledFormControl}\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      <PartInput\n        key='hour'\n        placeholder={t('hour_placeholder')}\n        aria-label={t('hour_label_a11y')}\n        value={time.hour}\n        readOnly={readOnly}\n        ref={hourInputRef}\n        autoFocus={autoFocus}\n      />\n      :\n      <PartInput\n        key='minute'\n        placeholder={t('minute_placeholder')}\n        aria-label={t('minute_label_a11y')}\n        value={time.minute}\n        size={2}\n        maxLength={2}\n        readOnly={readOnly}\n        max={59}\n        ref={minuteInputRef}\n      />\n      :\n      <PartInput\n        key='second'\n        placeholder={t('second_placeholder')}\n        aria-label={t('second_label_a11y')}\n        value={time.second}\n        size={2}\n        maxLength={2}\n        readOnly={readOnly}\n        max={59}\n        ref={secondInputRef}\n      />\n    </Flex>\n  );\n};\nexport default Time;\n"]}
+{"version":3,"file":"Time.js","sourceRoot":"","sources":["../../../../../src/components/DateTime/Input/Duration/Time.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useCallback, useRef } from 'react';\n\nimport { ForwardProps } from '../../../../types';\nimport { useI18n, useFocusWithin } from '../../../../hooks';\nimport { msToTimeFormat, timeFormatToMs } from '../utils';\nimport StyledDateTime from '../DateTime.styles';\nimport { StyledFormControl } from '../../../FormControl';\nimport Flex from '../../../Flex';\nimport PartInput from '../PartInput';\nimport useAutoFocusNextInput from '../useAutoFocusNextInput';\n\nimport DurationInputProps from './DurationInput.types';\n\ntype TimeProps = DurationInputProps & ForwardProps;\n\nconst Time: FC<TimeProps> = (props: DurationInputProps) => {\n  const { value, onChange, disabled, readOnly, required, status, autoFocus, ...restProps } = props;\n\n  const time =\n    value !== undefined\n      ? msToTimeFormat(value)\n      : { hour: undefined, minute: undefined, second: undefined };\n\n  const [hourInputRef, minuteInputRef, secondInputRef] = [\n    useRef<HTMLInputElement>(null),\n    useRef<HTMLInputElement>(null),\n    useRef<HTMLInputElement>(null)\n  ];\n\n  useAutoFocusNextInput([hourInputRef, minuteInputRef, secondInputRef]);\n\n  const pickParts = () => {\n    return [\n      hourInputRef.current?.value || undefined,\n      minuteInputRef.current?.value || undefined,\n      secondInputRef.current?.value || undefined\n    ];\n  };\n\n  const onFocusChange = useCallback(\n    (focused: boolean) => {\n      if (!focused && !disabled && !readOnly && onChange) {\n        const parts = pickParts();\n        onChange(\n          parts.some(v => v !== undefined)\n            ? timeFormatToMs({\n                hour: Number(parts[0] ?? 0),\n                minute: Number(parts[1] ?? 0),\n                second: Number(parts[2] ?? 0)\n              })\n            : undefined\n        );\n      }\n    },\n    [disabled, readOnly, onChange]\n  );\n\n  const t = useI18n();\n\n  const containerRef = useRef<HTMLElement>(null);\n  useFocusWithin([containerRef], onFocusChange);\n\n  return (\n    <Flex\n      as={StyledDateTime}\n      forwardedAs={StyledFormControl}\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      <PartInput\n        key='hour'\n        placeholder={t('hour_placeholder')}\n        aria-label={t('hour_label_a11y')}\n        value={time.hour}\n        readOnly={readOnly}\n        ref={hourInputRef}\n        autoFocus={autoFocus}\n      />\n      :\n      <PartInput\n        key='minute'\n        placeholder={t('minute_placeholder')}\n        aria-label={t('minute_label_a11y')}\n        value={time.minute}\n        size={2}\n        maxLength={2}\n        readOnly={readOnly}\n        max={59}\n        ref={minuteInputRef}\n      />\n      :\n      <PartInput\n        key='second'\n        placeholder={t('second_placeholder')}\n        aria-label={t('second_label_a11y')}\n        value={time.second}\n        size={2}\n        maxLength={2}\n        readOnly={readOnly}\n        max={59}\n        ref={secondInputRef}\n      />\n    </Flex>\n  );\n};\nexport default Time;\n"]}

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

@@ -99,8 +99,8 @@ const MonthInput = forwardRef((props, ref) => {
     const yearOptions = years.map(year => (_jsx(Option, { value: year.toString(), children: year.toString() }, year.toString())));
     const Month = (_jsxs(Select, { "aria-label": t('month_label_a11y'), readOnly: readOnly, required: required, value: state[1]?.toString() ?? '', onChange: onSelectChange('month'), status: status, disabled: disabled, autoFocus: autoFocus, children: [!required && _jsx(Option, { children: " " }, 'null'), monthOptions] }, 'month'));
     const Year = (_jsxs(Select, { "aria-label": t('year_label_a11y'), readOnly: readOnly, required: required, value: state[0]?.toString() ?? '', onChange: onSelectChange('year'), status: status, disabled: disabled, children: [!required && _jsx(Option, { children: " " }, 'null'), yearOptions] }, 'year'));
-    const Comp = (_jsxs(Flex, { as: StyledMonthInput, forwardedAs: StyledFormControl, container: { alignItems: 'center', wrap: 'nowrap' }, ref: containerRef, status: status, disabled: disabled, readOnly: readOnly, ...restProps, children: [Month, Year] }, void 0));
-    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, children: Comp }, void 0)) : (Comp);
+    const Comp = (_jsxs(Flex, { as: StyledMonthInput, forwardedAs: StyledFormControl, container: { alignItems: 'center', wrap: 'nowrap' }, ref: containerRef, status: status, disabled: disabled, readOnly: readOnly, ...restProps, children: [Month, Year] }));
+    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, children: Comp })) : (Comp);
 });
 export default MonthInput;
 //# sourceMappingURL=MonthInput.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MonthInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/MonthInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useMemo,\n  FunctionComponent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useReducer,\n  ChangeEvent,\n  useEffect\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport { ForwardProps } from '../../../types';\nimport { range } from '../../../utils';\nimport {\n  useConfiguration,\n  useConsolidatedRef,\n  useDirection,\n  useFocusWithin,\n  useI18n\n} 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 DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\n\nimport { parseToDate, getLocalizedMonths } from './utils';\nimport StyledDateTime from './DateTime.styles';\n\nexport interface MonthInputProps extends DateTimeProps {}\n\nexport const StyledMonthInput = styled(StyledDateTime)<MonthInputProps>(() => {\n  const { start, end } = useDirection();\n  return css`\n    padding: 0;\n    border: 0;\n    ${StyledSelect} {\n      min-width: 0;\n      &:first-child {\n        border-top-${end}-radius: 0;\n        border-bottom-${end}-radius: 0;\n      }\n      &:last-child {\n        max-width: max-content;\n        margin-inline-start: -0.0625rem;\n        border-top-${start}-radius: 0;\n        border-bottom-${start}-radius: 0;\n      }\n    }\n  `;\n});\n\nStyledMonthInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n  date: Date,\n  parts: (string | undefined)[]\n): DateTimeCallbackParameter => {\n  if (parts.every(Boolean)) {\n    const [year, month] = parts.map(Number);\n    date.setUTCFullYear(year, month);\n    return {\n      valueAsISOString: date.toISOString(),\n      valueAsTimestamp: date.getTime()\n    };\n  }\n  if (parts.every(p => !p)) {\n    return {\n      valueAsISOString: '',\n      valueAsTimestamp: undefined\n    };\n  }\n  return {\n    valueAsISOString: '',\n    valueAsTimestamp: NaN,\n    state: 'incomplete'\n  };\n};\n\ntype Field = 'month' | 'year';\ntype State = [year: string | undefined, month: string | undefined];\n\nconst reducer = (state: State, action: { field: Field; value: string | undefined }): State => {\n  switch (action.field) {\n    case 'year':\n      return [action.value, state[1]];\n    case 'month':\n      return [state[0], action.value];\n    default:\n      return state.slice(0) as State;\n  }\n};\n\nconst MonthInput: FunctionComponent<MonthInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<MonthInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const { locale } = useConfiguration();\n    const {\n      defaultValue,\n      value = defaultValue,\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      ...restProps\n    } = props;\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    const months = useMemo(() => getLocalizedMonths(locale), [locale]);\n\n    const [state, dispatch] = useReducer(reducer, [\n      date?.getUTCFullYear().toString(),\n      date?.getUTCMonth().toString()\n    ]);\n\n    useEffect(() => {\n      dispatch({ field: 'month', value: date?.getUTCMonth().toString() });\n      dispatch({ field: 'year', value: date?.getUTCFullYear().toString() });\n    }, [date?.toLocaleDateString()]);\n\n    const onFocusChange = (focused: boolean) => {\n      const callbackParam = convertToCallbackParameter(date ? new Date(date) : new Date(), state);\n      if (onFocus && focused) onFocus(callbackParam);\n      else if (onBlur && !focused) onBlur(callbackParam);\n    };\n\n    const onSelectChange = (field: Field) => (ev: ChangeEvent<HTMLSelectElement>) => {\n      const action = { field, value: ev.target.value };\n      dispatch(action);\n      onChange?.(\n        convertToCallbackParameter(date ? new Date(date) : new Date(), reducer(state, action))\n      );\n    };\n\n    const containerRef = useConsolidatedRef<HTMLElement>(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const t = useI18n();\n\n    const monthOptions = months.map((month, index) => (\n      <Option 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        {year.toString()}\n      </Option>\n    ));\n\n    const Month = (\n      <Select\n        key='month'\n        aria-label={t('month_label_a11y')}\n        readOnly={readOnly}\n        required={required}\n        value={state[1]?.toString() ?? ''}\n        onChange={onSelectChange('month')}\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        aria-label={t('year_label_a11y')}\n        key='year'\n        readOnly={readOnly}\n        required={required}\n        value={state[0]?.toString() ?? ''}\n        onChange={onSelectChange('year')}\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      >\n        {Month}\n        {Year}\n      </Flex>\n    );\n\n    return label ? (\n      <FormField\n        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, status, required, disabled }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default MonthInput;\n"]}
+{"version":3,"file":"MonthInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/MonthInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useMemo,\n  FunctionComponent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useReducer,\n  ChangeEvent,\n  useEffect\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport { ForwardProps } from '../../../types';\nimport { range } from '../../../utils';\nimport {\n  useConfiguration,\n  useConsolidatedRef,\n  useDirection,\n  useFocusWithin,\n  useI18n\n} 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 DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\n\nimport { parseToDate, getLocalizedMonths } from './utils';\nimport StyledDateTime from './DateTime.styles';\n\nexport interface MonthInputProps extends DateTimeProps {}\n\nexport const StyledMonthInput = styled(StyledDateTime)<MonthInputProps>(() => {\n  const { start, end } = useDirection();\n  return css`\n    padding: 0;\n    border: 0;\n    ${StyledSelect} {\n      min-width: 0;\n      &:first-child {\n        border-top-${end}-radius: 0;\n        border-bottom-${end}-radius: 0;\n      }\n      &:last-child {\n        max-width: max-content;\n        margin-inline-start: -0.0625rem;\n        border-top-${start}-radius: 0;\n        border-bottom-${start}-radius: 0;\n      }\n    }\n  `;\n});\n\nStyledMonthInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n  date: Date,\n  parts: (string | undefined)[]\n): DateTimeCallbackParameter => {\n  if (parts.every(Boolean)) {\n    const [year, month] = parts.map(Number);\n    date.setUTCFullYear(year, month);\n    return {\n      valueAsISOString: date.toISOString(),\n      valueAsTimestamp: date.getTime()\n    };\n  }\n  if (parts.every(p => !p)) {\n    return {\n      valueAsISOString: '',\n      valueAsTimestamp: undefined\n    };\n  }\n  return {\n    valueAsISOString: '',\n    valueAsTimestamp: NaN,\n    state: 'incomplete'\n  };\n};\n\ntype Field = 'month' | 'year';\ntype State = [year: string | undefined, month: string | undefined];\n\nconst reducer = (state: State, action: { field: Field; value: string | undefined }): State => {\n  switch (action.field) {\n    case 'year':\n      return [action.value, state[1]];\n    case 'month':\n      return [state[0], action.value];\n    default:\n      return state.slice(0) as State;\n  }\n};\n\nconst MonthInput: FunctionComponent<MonthInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<MonthInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const { locale } = useConfiguration();\n    const {\n      defaultValue,\n      value = defaultValue,\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      ...restProps\n    } = props;\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    const months = useMemo(() => getLocalizedMonths(locale), [locale]);\n\n    const [state, dispatch] = useReducer(reducer, [\n      date?.getUTCFullYear().toString(),\n      date?.getUTCMonth().toString()\n    ]);\n\n    useEffect(() => {\n      dispatch({ field: 'month', value: date?.getUTCMonth().toString() });\n      dispatch({ field: 'year', value: date?.getUTCFullYear().toString() });\n    }, [date?.toLocaleDateString()]);\n\n    const onFocusChange = (focused: boolean) => {\n      const callbackParam = convertToCallbackParameter(date ? new Date(date) : new Date(), state);\n      if (onFocus && focused) onFocus(callbackParam);\n      else if (onBlur && !focused) onBlur(callbackParam);\n    };\n\n    const onSelectChange = (field: Field) => (ev: ChangeEvent<HTMLSelectElement>) => {\n      const action = { field, value: ev.target.value };\n      dispatch(action);\n      onChange?.(\n        convertToCallbackParameter(date ? new Date(date) : new Date(), reducer(state, action))\n      );\n    };\n\n    const containerRef = useConsolidatedRef<HTMLElement>(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const t = useI18n();\n\n    const monthOptions = months.map((month, index) => (\n      <Option 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        {year.toString()}\n      </Option>\n    ));\n\n    const Month = (\n      <Select\n        key='month'\n        aria-label={t('month_label_a11y')}\n        readOnly={readOnly}\n        required={required}\n        value={state[1]?.toString() ?? ''}\n        onChange={onSelectChange('month')}\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        aria-label={t('year_label_a11y')}\n        key='year'\n        readOnly={readOnly}\n        required={required}\n        value={state[0]?.toString() ?? ''}\n        onChange={onSelectChange('year')}\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      >\n        {Month}\n        {Year}\n      </Flex>\n    );\n\n    return label ? (\n      <FormField\n        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, status, required, disabled }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default MonthInput;\n"]}

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

@@ -27,7 +27,7 @@ const PartInput = forwardRef(({ value, onChange, readOnly, min = 0, max = Infini
         onChange?.(targetEl.value);
     }, [onChange]);
     const defaultValue = value ? value.toString().padStart(2, '0') : '';
-    return (_jsx(BareInput, { type: 'number', defaultValue: defaultValue, onBlur: onBlur, onKeyDown: onKeyDown, onChange: onInputChange, step: 1, min: min, max: max, maxLength: maxLength, readOnly: readOnly, ref: inputRef, size: size, ...restProps }, void 0));
+    return (_jsx(BareInput, { type: 'number', defaultValue: defaultValue, onBlur: onBlur, onKeyDown: onKeyDown, onChange: onInputChange, step: 1, min: min, max: max, maxLength: maxLength, readOnly: readOnly, ref: inputRef, size: size, ...restProps }));
 });
 export default PartInput;
 //# sourceMappingURL=PartInput.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PartInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/PartInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FocusEvent,\n  KeyboardEvent,\n  FunctionComponent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useCallback,\n  useEffect,\n  ChangeEvent\n} from 'react';\n\nimport { useConsolidatedRef } from '../../../hooks';\nimport { ForwardProps, OmitStrict } from '../../../types';\nimport { InputProps } from '../../Input/Input';\n\nimport { BareInput } from './DateTime.styles';\n\nexport interface PartInputProps extends OmitStrict<InputProps, 'defaultValue' | 'value'> {\n  value?: number;\n  min?: number;\n  max?: number;\n  maxLength?: number;\n  size?: number;\n  onChange?: (value?: string) => void;\n}\n\nconst PartInput: FunctionComponent<PartInputProps & ForwardProps> = forwardRef(\n  (\n    {\n      value,\n      onChange,\n      readOnly,\n      min = 0,\n      max = Infinity,\n      size = 2,\n      maxLength = Infinity,\n      ...restProps\n    }: PropsWithoutRef<PartInputProps>,\n    ref: Ref<HTMLInputElement>\n  ) => {\n    const onKeyDown = useCallback((ev: KeyboardEvent<HTMLInputElement>) => {\n      if (['+', '-', 'e', 'E', '.', ','].includes(ev.key)) ev.preventDefault();\n    }, []);\n\n    const inputRef = useConsolidatedRef(ref);\n    useEffect(() => {\n      if (inputRef.current && !Number.isNaN(value)) {\n        inputRef.current.value = value?.toString().padStart(2, '0') ?? '';\n      }\n    }, [value, inputRef.current]);\n\n    const onInputChange = useCallback(\n      (ev: ChangeEvent<HTMLInputElement>) => {\n        const targetEl = ev.target;\n        if (targetEl.value.length > maxLength) targetEl.value = targetEl.value.slice(0, maxLength);\n        else if (size !== maxLength)\n          targetEl.style.width = `${Math.max(targetEl.value.length, size)}ch`;\n      },\n      [maxLength]\n    );\n\n    const onBlur = useCallback(\n      (ev: FocusEvent<HTMLInputElement>) => {\n        const targetEl = ev.target;\n        if (targetEl.value !== '') targetEl.value = targetEl.value.padStart(2, '0');\n        onChange?.(targetEl.value);\n      },\n      [onChange]\n    );\n\n    const defaultValue = value ? value.toString().padStart(2, '0') : '';\n\n    return (\n      <BareInput\n        type='number'\n        defaultValue={defaultValue}\n        onBlur={onBlur}\n        onKeyDown={onKeyDown}\n        onChange={onInputChange}\n        step={1}\n        min={min}\n        max={max}\n        maxLength={maxLength}\n        readOnly={readOnly}\n        ref={inputRef}\n        size={size}\n        {...restProps}\n      />\n    );\n  }\n);\n\nexport default PartInput;\n"]}
+{"version":3,"file":"PartInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/PartInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAIL,UAAU,EAGV,WAAW,EACX,SAAS,EAEV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAIpD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAW9C,MAAM,SAAS,GAAqD,UAAU,CAC5E,CACE,EACE,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,GAAG,GAAG,CAAC,EACP,GAAG,GAAG,QAAQ,EACd,IAAI,GAAG,CAAC,EACR,SAAS,GAAG,QAAQ,EACpB,GAAG,SAAS,EACoB,EAClC,GAA0B,EAC1B,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,EAAmC,EAAE,EAAE;QACpE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC;YAAE,EAAE,CAAC,cAAc,EAAE,CAAC;IAC3E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,QAAQ,CAAC,OAAO,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YAC5C,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,EAAE,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,IAAI,EAAE,CAAC;SACnE;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;IAE9B,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,EAAiC,EAAE,EAAE;QACpC,MAAM,QAAQ,GAAG,EAAE,CAAC,MAAM,CAAC;QAC3B,IAAI,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,SAAS;YAAE,QAAQ,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;aACtF,IAAI,IAAI,KAAK,SAAS;YACzB,QAAQ,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC;IACxE,CAAC,EACD,CAAC,SAAS,CAAC,CACZ,CAAC;IAEF,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,EAAgC,EAAE,EAAE;QACnC,MAAM,QAAQ,GAAG,EAAE,CAAC,MAAM,CAAC;QAC3B,IAAI,QAAQ,CAAC,KAAK,KAAK,EAAE;YAAE,QAAQ,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QAC5E,QAAQ,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC7B,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAEpE,OAAO,CACL,KAAC,SAAS,IACR,IAAI,EAAC,QAAQ,EACb,YAAY,EAAE,YAAY,EAC1B,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,aAAa,EACvB,IAAI,EAAE,CAAC,EACP,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,QAAQ,EACb,IAAI,EAAE,IAAI,KACN,SAAS,GACb,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import {\n  FocusEvent,\n  KeyboardEvent,\n  FunctionComponent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useCallback,\n  useEffect,\n  ChangeEvent\n} from 'react';\n\nimport { useConsolidatedRef } from '../../../hooks';\nimport { ForwardProps, OmitStrict } from '../../../types';\nimport { InputProps } from '../../Input/Input';\n\nimport { BareInput } from './DateTime.styles';\n\nexport interface PartInputProps extends OmitStrict<InputProps, 'defaultValue' | 'value'> {\n  value?: number;\n  min?: number;\n  max?: number;\n  maxLength?: number;\n  size?: number;\n  onChange?: (value?: string) => void;\n}\n\nconst PartInput: FunctionComponent<PartInputProps & ForwardProps> = forwardRef(\n  (\n    {\n      value,\n      onChange,\n      readOnly,\n      min = 0,\n      max = Infinity,\n      size = 2,\n      maxLength = Infinity,\n      ...restProps\n    }: PropsWithoutRef<PartInputProps>,\n    ref: Ref<HTMLInputElement>\n  ) => {\n    const onKeyDown = useCallback((ev: KeyboardEvent<HTMLInputElement>) => {\n      if (['+', '-', 'e', 'E', '.', ','].includes(ev.key)) ev.preventDefault();\n    }, []);\n\n    const inputRef = useConsolidatedRef(ref);\n    useEffect(() => {\n      if (inputRef.current && !Number.isNaN(value)) {\n        inputRef.current.value = value?.toString().padStart(2, '0') ?? '';\n      }\n    }, [value, inputRef.current]);\n\n    const onInputChange = useCallback(\n      (ev: ChangeEvent<HTMLInputElement>) => {\n        const targetEl = ev.target;\n        if (targetEl.value.length > maxLength) targetEl.value = targetEl.value.slice(0, maxLength);\n        else if (size !== maxLength)\n          targetEl.style.width = `${Math.max(targetEl.value.length, size)}ch`;\n      },\n      [maxLength]\n    );\n\n    const onBlur = useCallback(\n      (ev: FocusEvent<HTMLInputElement>) => {\n        const targetEl = ev.target;\n        if (targetEl.value !== '') targetEl.value = targetEl.value.padStart(2, '0');\n        onChange?.(targetEl.value);\n      },\n      [onChange]\n    );\n\n    const defaultValue = value ? value.toString().padStart(2, '0') : '';\n\n    return (\n      <BareInput\n        type='number'\n        defaultValue={defaultValue}\n        onBlur={onBlur}\n        onKeyDown={onKeyDown}\n        onChange={onInputChange}\n        step={1}\n        min={min}\n        max={max}\n        maxLength={maxLength}\n        readOnly={readOnly}\n        ref={inputRef}\n        size={size}\n        {...restProps}\n      />\n    );\n  }\n);\n\nexport default PartInput;\n"]}

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

@@ -95,8 +95,8 @@ const QuarterInput = forwardRef((props, ref) => {
     const yearOptions = years.map(year => (_jsx(Option, { value: year.toString(), children: year.toString() }, year.toString())));
     const Quarter = (_jsxs(Select, { "aria-label": t('quarter_label_a11y'), readOnly: readOnly, required: required, value: state[1]?.toString() ?? '', onChange: onSelectChange('quarter'), status: status, disabled: disabled, autoFocus: autoFocus, children: [!required && _jsx(Option, { children: " " }, 'null'), quarterOptions] }, 'quarter'));
     const Year = (_jsxs(Select, { "aria-label": t('year_label_a11y'), readOnly: readOnly, required: required, value: state[0]?.toString() ?? '', onChange: onSelectChange('year'), status: status, disabled: disabled, children: [!required && _jsx(Option, { children: " " }, 'null'), yearOptions] }, 'year'));
-    const Comp = (_jsxs(Flex, { ...restProps, as: StyledQuarterInput, forwardedAs: StyledFormControl, container: { alignItems: 'center' }, ref: containerRef, status: status, disabled: disabled, readOnly: readOnly, children: [Quarter, Year] }, void 0));
-    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, children: Comp }, void 0)) : (Comp);
+    const Comp = (_jsxs(Flex, { ...restProps, as: StyledQuarterInput, forwardedAs: StyledFormControl, container: { alignItems: 'center' }, ref: containerRef, status: status, disabled: disabled, readOnly: readOnly, children: [Quarter, Year] }));
+    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, children: Comp })) : (Comp);
 });
 export default QuarterInput;
 //# sourceMappingURL=QuarterInput.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"QuarterInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/QuarterInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeEvent,\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  useReducer\n} from 'react';\nimport styled, { css } 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 } from '../../../utils';\nimport { useConsolidatedRef, useDirection, useFocusWithin, useI18n } from '../../../hooks';\nimport { StyledSelect } from '../../Select/Select';\nimport { defaultThemeProp } from '../../../theme';\nimport { StyledFormControl } from '../../FormControl';\n\nimport { getQuarter, parseToDate, QuarterNumber } from './utils';\nimport StyledDateTime from './DateTime.styles';\n\nexport interface QuarterInputProps extends DateTimeProps {}\n\nexport const StyledQuarterInput = styled(StyledDateTime)<QuarterInputProps>(() => {\n  const { start, end } = useDirection();\n  return css`\n    padding: 0;\n    border: 0;\n    ${StyledSelect} {\n      min-width: 0;\n      &:first-child {\n        ${`border-top-${end}-radius`}: 0;\n        ${`border-bottom-${end}-radius`}: 0;\n      }\n      &:last-child {\n        max-width: max-content;\n        margin-inline-start: -0.0625rem;\n        ${`border-top-${start}-radius`}: 0;\n        ${`border-bottom-${start}-radius`}: 0;\n      }\n    }\n  `;\n});\n\nStyledQuarterInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n  date: Date,\n  parts: (string | undefined)[]\n): DateTimeCallbackParameter => {\n  if (parts.every(Boolean)) {\n    const [year, quarter] = parts.map(Number);\n    const quarterStartMonth = [0, 3, 6, 9][quarter - 1];\n    date.setUTCFullYear(year, quarterStartMonth, 1);\n    return {\n      valueAsISOString: date.toISOString(),\n      valueAsTimestamp: date.getTime()\n    };\n  }\n  if (parts.every(p => !p)) {\n    return {\n      valueAsISOString: '',\n      valueAsTimestamp: undefined\n    };\n  }\n  return {\n    valueAsISOString: '',\n    valueAsTimestamp: NaN,\n    state: 'incomplete'\n  };\n};\n\ntype Field = 'quarter' | 'year';\ntype State = [year: string | undefined, quarter: string | undefined];\n\nconst reducer = (state: State, action: { field: Field; value: string | undefined }): State => {\n  switch (action.field) {\n    case 'year':\n      return [action.value, state[1]];\n    case 'quarter':\n      return [state[0], action.value];\n    default:\n      return state.slice(0) as State;\n  }\n};\n\nconst QuarterInput: FunctionComponent<QuarterInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<QuarterInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const {\n      defaultValue,\n      value = defaultValue,\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      ...restProps\n    } = props;\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 [state, dispatch] = useReducer(reducer, [\n      date?.getUTCFullYear().toString(),\n      date && getQuarter(date).toString()\n    ]);\n\n    const onFocusChange = (focused: boolean) => {\n      const callbackParam = convertToCallbackParameter(date ? new Date(date) : new Date(), state);\n      if (onFocus && focused) onFocus(callbackParam);\n      else if (onBlur && !focused) onBlur(callbackParam);\n    };\n\n    const onSelectChange = (field: Field) => (ev: ChangeEvent<HTMLSelectElement>) => {\n      const action = { field, value: ev.target.value };\n      dispatch(action);\n      onChange?.(\n        convertToCallbackParameter(date ? new Date(date) : new Date(), reducer(state, action))\n      );\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 Quarter = (\n      <Select\n        aria-label={t('quarter_label_a11y')}\n        key='quarter'\n        readOnly={readOnly}\n        required={required}\n        value={state[1]?.toString() ?? ''}\n        onChange={onSelectChange('quarter')}\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        aria-label={t('year_label_a11y')}\n        key='year'\n        readOnly={readOnly}\n        required={required}\n        value={state[0]?.toString() ?? ''}\n        onChange={onSelectChange('year')}\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        {...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        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, status, required, disabled }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default QuarterInput;\n"]}
+{"version":3,"file":"QuarterInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/QuarterInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeEvent,\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  useReducer\n} from 'react';\nimport styled, { css } 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 } from '../../../utils';\nimport { useConsolidatedRef, useDirection, useFocusWithin, useI18n } from '../../../hooks';\nimport { StyledSelect } from '../../Select/Select';\nimport { defaultThemeProp } from '../../../theme';\nimport { StyledFormControl } from '../../FormControl';\n\nimport { getQuarter, parseToDate, QuarterNumber } from './utils';\nimport StyledDateTime from './DateTime.styles';\n\nexport interface QuarterInputProps extends DateTimeProps {}\n\nexport const StyledQuarterInput = styled(StyledDateTime)<QuarterInputProps>(() => {\n  const { start, end } = useDirection();\n  return css`\n    padding: 0;\n    border: 0;\n    ${StyledSelect} {\n      min-width: 0;\n      &:first-child {\n        ${`border-top-${end}-radius`}: 0;\n        ${`border-bottom-${end}-radius`}: 0;\n      }\n      &:last-child {\n        max-width: max-content;\n        margin-inline-start: -0.0625rem;\n        ${`border-top-${start}-radius`}: 0;\n        ${`border-bottom-${start}-radius`}: 0;\n      }\n    }\n  `;\n});\n\nStyledQuarterInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n  date: Date,\n  parts: (string | undefined)[]\n): DateTimeCallbackParameter => {\n  if (parts.every(Boolean)) {\n    const [year, quarter] = parts.map(Number);\n    const quarterStartMonth = [0, 3, 6, 9][quarter - 1];\n    date.setUTCFullYear(year, quarterStartMonth, 1);\n    return {\n      valueAsISOString: date.toISOString(),\n      valueAsTimestamp: date.getTime()\n    };\n  }\n  if (parts.every(p => !p)) {\n    return {\n      valueAsISOString: '',\n      valueAsTimestamp: undefined\n    };\n  }\n  return {\n    valueAsISOString: '',\n    valueAsTimestamp: NaN,\n    state: 'incomplete'\n  };\n};\n\ntype Field = 'quarter' | 'year';\ntype State = [year: string | undefined, quarter: string | undefined];\n\nconst reducer = (state: State, action: { field: Field; value: string | undefined }): State => {\n  switch (action.field) {\n    case 'year':\n      return [action.value, state[1]];\n    case 'quarter':\n      return [state[0], action.value];\n    default:\n      return state.slice(0) as State;\n  }\n};\n\nconst QuarterInput: FunctionComponent<QuarterInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<QuarterInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const {\n      defaultValue,\n      value = defaultValue,\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      ...restProps\n    } = props;\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 [state, dispatch] = useReducer(reducer, [\n      date?.getUTCFullYear().toString(),\n      date && getQuarter(date).toString()\n    ]);\n\n    const onFocusChange = (focused: boolean) => {\n      const callbackParam = convertToCallbackParameter(date ? new Date(date) : new Date(), state);\n      if (onFocus && focused) onFocus(callbackParam);\n      else if (onBlur && !focused) onBlur(callbackParam);\n    };\n\n    const onSelectChange = (field: Field) => (ev: ChangeEvent<HTMLSelectElement>) => {\n      const action = { field, value: ev.target.value };\n      dispatch(action);\n      onChange?.(\n        convertToCallbackParameter(date ? new Date(date) : new Date(), reducer(state, action))\n      );\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 Quarter = (\n      <Select\n        aria-label={t('quarter_label_a11y')}\n        key='quarter'\n        readOnly={readOnly}\n        required={required}\n        value={state[1]?.toString() ?? ''}\n        onChange={onSelectChange('quarter')}\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        aria-label={t('year_label_a11y')}\n        key='year'\n        readOnly={readOnly}\n        required={required}\n        value={state[0]?.toString() ?? ''}\n        onChange={onSelectChange('year')}\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        {...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        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, status, required, disabled }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default QuarterInput;\n"]}

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

@@ -123,11 +123,11 @@ const TimeInput = forwardRef((props, ref) => {
     const Period = (_jsxs(Select, { ref: meridiemSelectRef, "aria-label": t('meridiem_label_a11y'), value: meridiem, required: required, disabled: disabled, onChange: (ev) => {
             setMeridiem(ev.target.value);
             onInputChange();
-        }, readOnly: readOnly, children: [_jsx(Option, { value: 'AM', children: t('meridiem_value_am') }, void 0), _jsx(Option, { value: 'PM', children: t('meridiem_value_pm') }, void 0)] }, 'period'));
+        }, readOnly: readOnly, children: [_jsx(Option, { value: 'AM', children: t('meridiem_value_am') }), _jsx(Option, { value: 'PM', children: t('meridiem_value_pm') })] }, 'period'));
     const [open, setOpen, , setPopoverRef, buttonEl, setButtonEl] = usePickerButton();
     const containerRef = useConsolidatedRef(ref);
     useFocusWithin([containerRef], onFocusChange);
-    const Picker = (_jsxs(_Fragment, { children: [_jsx(Button, { 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: open ? 'times' : 'clock' }, void 0) }, void 0), _jsx(Popover, { show: open, ref: setPopoverRef, target: containerRef.current, placement: 'bottom-end', strategy: 'fixed', modifiers: [
+    const Picker = (_jsxs(_Fragment, { children: [_jsx(Button, { 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: open ? 'times' : 'clock' }) }), _jsx(Popover, { show: open, ref: setPopoverRef, target: containerRef.current, placement: 'bottom-end', strategy: 'fixed', modifiers: [
                     {
                         name: 'flip',
                         options: {
@@ -152,7 +152,7 @@ const TimeInput = forwardRef((props, ref) => {
                         setOpen(false);
                         buttonEl?.focus();
                         onInputChange();
-                    }, clockFormat: clockFormat }, void 0) }, void 0)] }, void 0));
+                    }, clockFormat: clockFormat }) })] }));
     const Comp = (_jsxs(Flex, { as: StyledTimeInput, forwardedAs: StyledFormControl, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ref: containerRef, onClick: (e) => {
             if (e.target === containerRef.current)
                 hourInputRef.current?.focus();
@@ -170,8 +170,8 @@ const TimeInput = forwardRef((props, ref) => {
                         default:
                             return part;
                     }
-                }) }, void 0), !readOnly && Picker] }, void 0));
-    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, ref: ref, children: Comp }, void 0)) : (Comp);
+                }) }), !readOnly && Picker] }));
+    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, ref: ref, children: Comp })) : (Comp);
 });
 export default TimeInput;
 //# sourceMappingURL=TimeInput.js.map

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

@@ -1 +1 @@
-{"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  useState,\n  ChangeEvent,\n  forwardRef,\n  Ref,\n  PropsWithoutRef\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 timesIcon from '../../Icon/icons/times.icon';\nimport * as clockIcon from '../../Icon/icons/clock.icon';\nimport Popover from '../../Popover';\nimport TimePicker, { MinuteInterval } from '../Picker/TimePicker';\nimport { useConfiguration, useConsolidatedRef, useFocusWithin, useI18n } from '../../../hooks';\nimport { StyledFormControl } from '../../FormControl';\nimport DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\nimport { sameWidth } from '../../Popover/modifiers';\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';\n\nregisterIcon(timesIcon, 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  /**\n   * Defines clock format that overrides locale based format\n   */\n  clockFormat?: ClockFormat;\n}\n\nexport const StyledTimeInput = styled(StyledDateTime)<TimeInputProps>`\n  padding-inline-end: 0;\n`;\n\nfunction getMeridiem(hour: number) {\n  return 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: (string | undefined)[],\n  meridiem?: string\n): DateTimeCallbackParameter => {\n  if (parts.every(Boolean)) {\n    const [hour, minute, second = date.getUTCSeconds()] = parts.map(Number);\n\n    const is12h = meridiem !== undefined;\n\n    if (!validateTime(hour, minute, second, is12h)) {\n      return {\n        valueAsISOString: '',\n        valueAsTimestamp: NaN,\n        state: 'invalid'\n      };\n    }\n\n    date.setUTCHours(is12h ? convertTo24h(hour, meridiem!) : hour, minute, second);\n    return {\n      valueAsISOString: date.toISOString(),\n      valueAsTimestamp: date.getTime()\n    };\n  }\n  if (parts.every(p => !p)) {\n    return {\n      valueAsISOString: '',\n      valueAsTimestamp: undefined\n    };\n  }\n  return {\n    valueAsISOString: '',\n    valueAsTimestamp: NaN,\n    state: 'incomplete'\n  };\n};\n\nconst TimeInput: FunctionComponent<TimeInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<TimeInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const { locale } = useConfiguration();\n    const {\n      defaultValue,\n      value = defaultValue,\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      autoFocus,\n      ...restProps\n    } = props;\n\n    const date = value !== undefined ? parseToDate(value) : undefined;\n\n    const is12h = clockFormat ? clockFormat === 12 : is12HClockFormat(locale);\n    const [meridiem, setMeridiem] = useState<'AM' | 'PM' | undefined>(\n      is12h ? () => (date ? getMeridiem(date.getUTCHours()) : 'AM') : undefined\n    );\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      return [\n        hourInputRef.current?.value || undefined,\n        minuteInputRef.current?.value || undefined\n      ].concat(withSeconds ? [secondInputRef.current?.value] : []);\n    };\n\n    const currentlySelectedTime = () => {\n      const parts = pickParts();\n\n      if (parts.every(Boolean)) {\n        const [hour, minute, second = 0] = parts.map(Number);\n        const current = date ?? new Date();\n        return validateTime(hour, minute, second, is12h)\n          ? new Date(\n              current.setUTCHours(is12h ? convertTo24h(hour, meridiem!) : hour, minute, second)\n            )\n          : undefined;\n      }\n    };\n\n    const inputContainerRef = useRef<HTMLDivElement>(null);\n\n    const onFocusChange = (focused: boolean) => {\n      const currentMeridiem = meridiemSelectRef.current?.value || undefined;\n      const callbackParam = convertToCallbackParameter(\n        date ? new Date(date) : new Date(),\n        pickParts(),\n        is12h ? currentMeridiem : undefined\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      const currentMeridiem = meridiemSelectRef.current?.value || undefined;\n      onChange?.(\n        convertToCallbackParameter(\n          date ? new Date(date) : new Date(),\n          pickParts(),\n          is12h ? currentMeridiem : undefined\n        )\n      );\n    };\n\n    const t = useI18n();\n\n    const hour = date && is12h ? convertTo12h(date.getUTCHours()) : date?.getUTCHours();\n    const HourInput = (\n      <PartInput\n        key='hour'\n        placeholder={t('hour_placeholder')}\n        aria-label={t('hour_label_a11y')}\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        key='minute'\n        placeholder={t('minute_placeholder')}\n        aria-label={t('minute_label_a11y')}\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        key='second'\n        placeholder={t('second_placeholder')}\n        aria-label={t('second_label_a11y')}\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        ref={meridiemSelectRef}\n        aria-label={t('meridiem_label_a11y')}\n        key='period'\n        value={meridiem}\n        required={required}\n        disabled={disabled}\n        onChange={(ev: ChangeEvent<HTMLSelectElement>) => {\n          setMeridiem(ev.target.value as 'AM' | 'PM');\n          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 [open, setOpen, , setPopoverRef, buttonEl, setButtonEl] = usePickerButton();\n\n    const containerRef = useConsolidatedRef(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const Picker = (\n      <>\n        <Button\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={open ? 'times' : '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={[\n            {\n              name: 'flip',\n              options: {\n                fallbackPlacements: ['top-end']\n              }\n            },\n            sameWidth\n          ]}\n        >\n          <TimePicker\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\n                  .getUTCSeconds()\n                  .toString()\n                  .padStart(2, '0');\n              if (meridiemSelectRef.current) {\n                meridiemSelectRef.current!.value = getMeridiem(selected.getUTCHours());\n              }\n              setMeridiem(getMeridiem(selected.getUTCHours()));\n              setOpen(false);\n              buttonEl?.focus();\n              onInputChange();\n            }}\n            clockFormat={clockFormat}\n          />\n        </Popover>\n      </>\n    );\n\n    const Comp = (\n      <Flex\n        as={StyledTimeInput}\n        forwardedAs={StyledFormControl}\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        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, status, required, disabled }}\n        ref={ref}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default TimeInput;\n"]}
+{"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  useState,\n  ChangeEvent,\n  forwardRef,\n  Ref,\n  PropsWithoutRef\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 timesIcon from '../../Icon/icons/times.icon';\nimport * as clockIcon from '../../Icon/icons/clock.icon';\nimport Popover from '../../Popover';\nimport TimePicker, { MinuteInterval } from '../Picker/TimePicker';\nimport { useConfiguration, useConsolidatedRef, useFocusWithin, useI18n } from '../../../hooks';\nimport { StyledFormControl } from '../../FormControl';\nimport DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\nimport { sameWidth } from '../../Popover/modifiers';\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';\n\nregisterIcon(timesIcon, 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  /**\n   * Defines clock format that overrides locale based format\n   */\n  clockFormat?: ClockFormat;\n}\n\nexport const StyledTimeInput = styled(StyledDateTime)<TimeInputProps>`\n  padding-inline-end: 0;\n`;\n\nfunction getMeridiem(hour: number) {\n  return 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: (string | undefined)[],\n  meridiem?: string\n): DateTimeCallbackParameter => {\n  if (parts.every(Boolean)) {\n    const [hour, minute, second = date.getUTCSeconds()] = parts.map(Number);\n\n    const is12h = meridiem !== undefined;\n\n    if (!validateTime(hour, minute, second, is12h)) {\n      return {\n        valueAsISOString: '',\n        valueAsTimestamp: NaN,\n        state: 'invalid'\n      };\n    }\n\n    date.setUTCHours(is12h ? convertTo24h(hour, meridiem!) : hour, minute, second);\n    return {\n      valueAsISOString: date.toISOString(),\n      valueAsTimestamp: date.getTime()\n    };\n  }\n  if (parts.every(p => !p)) {\n    return {\n      valueAsISOString: '',\n      valueAsTimestamp: undefined\n    };\n  }\n  return {\n    valueAsISOString: '',\n    valueAsTimestamp: NaN,\n    state: 'incomplete'\n  };\n};\n\nconst TimeInput: FunctionComponent<TimeInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<TimeInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n    const { locale } = useConfiguration();\n    const {\n      defaultValue,\n      value = defaultValue,\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      autoFocus,\n      ...restProps\n    } = props;\n\n    const date = value !== undefined ? parseToDate(value) : undefined;\n\n    const is12h = clockFormat ? clockFormat === 12 : is12HClockFormat(locale);\n    const [meridiem, setMeridiem] = useState<'AM' | 'PM' | undefined>(\n      is12h ? () => (date ? getMeridiem(date.getUTCHours()) : 'AM') : undefined\n    );\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      return [\n        hourInputRef.current?.value || undefined,\n        minuteInputRef.current?.value || undefined\n      ].concat(withSeconds ? [secondInputRef.current?.value] : []);\n    };\n\n    const currentlySelectedTime = () => {\n      const parts = pickParts();\n\n      if (parts.every(Boolean)) {\n        const [hour, minute, second = 0] = parts.map(Number);\n        const current = date ?? new Date();\n        return validateTime(hour, minute, second, is12h)\n          ? new Date(\n              current.setUTCHours(is12h ? convertTo24h(hour, meridiem!) : hour, minute, second)\n            )\n          : undefined;\n      }\n    };\n\n    const inputContainerRef = useRef<HTMLDivElement>(null);\n\n    const onFocusChange = (focused: boolean) => {\n      const currentMeridiem = meridiemSelectRef.current?.value || undefined;\n      const callbackParam = convertToCallbackParameter(\n        date ? new Date(date) : new Date(),\n        pickParts(),\n        is12h ? currentMeridiem : undefined\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      const currentMeridiem = meridiemSelectRef.current?.value || undefined;\n      onChange?.(\n        convertToCallbackParameter(\n          date ? new Date(date) : new Date(),\n          pickParts(),\n          is12h ? currentMeridiem : undefined\n        )\n      );\n    };\n\n    const t = useI18n();\n\n    const hour = date && is12h ? convertTo12h(date.getUTCHours()) : date?.getUTCHours();\n    const HourInput = (\n      <PartInput\n        key='hour'\n        placeholder={t('hour_placeholder')}\n        aria-label={t('hour_label_a11y')}\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        key='minute'\n        placeholder={t('minute_placeholder')}\n        aria-label={t('minute_label_a11y')}\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        key='second'\n        placeholder={t('second_placeholder')}\n        aria-label={t('second_label_a11y')}\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        ref={meridiemSelectRef}\n        aria-label={t('meridiem_label_a11y')}\n        key='period'\n        value={meridiem}\n        required={required}\n        disabled={disabled}\n        onChange={(ev: ChangeEvent<HTMLSelectElement>) => {\n          setMeridiem(ev.target.value as 'AM' | 'PM');\n          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 [open, setOpen, , setPopoverRef, buttonEl, setButtonEl] = usePickerButton();\n\n    const containerRef = useConsolidatedRef(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const Picker = (\n      <>\n        <Button\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={open ? 'times' : '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={[\n            {\n              name: 'flip',\n              options: {\n                fallbackPlacements: ['top-end']\n              }\n            },\n            sameWidth\n          ]}\n        >\n          <TimePicker\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\n                  .getUTCSeconds()\n                  .toString()\n                  .padStart(2, '0');\n              if (meridiemSelectRef.current) {\n                meridiemSelectRef.current!.value = getMeridiem(selected.getUTCHours());\n              }\n              setMeridiem(getMeridiem(selected.getUTCHours()));\n              setOpen(false);\n              buttonEl?.focus();\n              onInputChange();\n            }}\n            clockFormat={clockFormat}\n          />\n        </Popover>\n      </>\n    );\n\n    const Comp = (\n      <Flex\n        as={StyledTimeInput}\n        forwardedAs={StyledFormControl}\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        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, status, required, disabled }}\n        ref={ref}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default TimeInput;\n"]}

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

@@ -102,7 +102,7 @@ const WeekInput = forwardRef((props, ref) => {
     const YearInput = (_jsx(PartInput, { placeholder: t('year_placeholder'), "aria-label": t('year_label_a11y'), value: date ? getWeekYear(date) : undefined, onChange: onInputChange, size: 4, maxLength: 4, min: 1, readOnly: readOnly, ref: yearInputRef }, 'year'));
     const containerRef = useConsolidatedRef(ref);
     useFocusWithin([containerRef], onFocusChange);
-    const Picker = (_jsxs(_Fragment, { children: [_jsx(Button, { variant: 'simple', icon: true, ref: setButtonEl, onClick: () => setOpen(cur => !cur), "aria-label": generatePickerButtonAriaLabel(currentlySelectedDate(), 'week', locale, t, open), readOnly: readOnly, disabled: disabled, children: _jsx(Icon, { name: open ? 'times' : 'calendar' }, void 0) }, void 0), _jsx(Popover, { show: open, ref: setPopoverRef, target: containerRef.current, strategy: 'fixed', placement: 'bottom-end', modifiers: [
+    const Picker = (_jsxs(_Fragment, { children: [_jsx(Button, { variant: 'simple', icon: true, ref: setButtonEl, onClick: () => setOpen(cur => !cur), "aria-label": generatePickerButtonAriaLabel(currentlySelectedDate(), 'week', locale, t, open), readOnly: readOnly, disabled: disabled, children: _jsx(Icon, { name: open ? 'times' : 'calendar' }) }), _jsx(Popover, { show: open, ref: setPopoverRef, target: containerRef.current, strategy: 'fixed', placement: 'bottom-end', modifiers: [
                     {
                         name: 'flip',
                         options: {
@@ -115,12 +115,12 @@ const WeekInput = forwardRef((props, ref) => {
                         setOpen(false);
                         setTimeout(() => buttonEl?.focus());
                         onInputChange();
-                    }, min: min, max: max, mode: 'week' }, void 0) }, void 0)] }, void 0));
+                    }, min: min, max: max, mode: 'week' }) })] }));
     const Comp = (_jsxs(Flex, { as: StyledWeekInput, forwardedAs: StyledFormControl, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ref: containerRef, onClick: (e) => {
             if (e.target === containerRef.current)
                 weekInputRef.current?.focus();
-        }, ...restProps, children: [_jsxs(Flex, { ref: inputContainerRef, as: StyledInputContainer, container: { alignItems: 'center', wrap: 'wrap' }, children: [t('week_text'), " ", WeekNumberInput, ",", YearInput] }, void 0), !readOnly && Picker] }, void 0));
-    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, ref: ref, children: Comp }, void 0)) : (Comp);
+        }, ...restProps, children: [_jsxs(Flex, { ref: inputContainerRef, as: StyledInputContainer, container: { alignItems: 'center', wrap: 'wrap' }, children: [t('week_text'), " ", WeekNumberInput, ",", YearInput] }), !readOnly && Picker] }));
+    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, ref: ref, children: Comp })) : (Comp);
 });
 export default WeekInput;
 //# sourceMappingURL=WeekInput.js.map