@dynatrace/strato-components 3.0.1 → 3.1.1

package/esm/forms/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/forms/index.ts"],
-  "sourcesContent": ["export type { BaseInputButtonProps as TextInputButtonProps } from './_base-input/BaseInputButton.js';\nexport type { BaseInputProps } from './_base-input/base-input.types.js';\nexport type { BaseInputContentProps as TextInputContentProps } from './_base-input/BaseInputContent.js';\nexport { Checkbox } from './checkbox/Checkbox.js';\nexport type { CheckboxProps } from './checkbox/Checkbox.js';\nexport { Calendar as _Calendar } from './calendar/Calendar.js';\nexport type {\n  CalendarProps as _CalendarProps,\n  CalendarStrictValueType as _CalendarOnChangeType,\n  CalendarValueType as _CalendarValueType,\n} from './calendar/Calendar.types.js';\nexport type { CalendarType as _CalendarType } from './calendar/types/calendarConfiguration.js';\nexport { getFormattedDateTime } from './forms-core/time/date-time.js';\nexport { DateTimePicker } from './date-time-picker/DateTimePicker.js';\nexport type {\n  DateTimePickerPrecision,\n  DateTimePickerProps,\n  DateTimePickerType,\n  DateTimePickerTypeProps,\n} from './date-time-picker/types.js';\nexport { FieldSet } from './forms-core/components/field-set/FieldSet.js';\nexport type { FieldSetProps } from './forms-core/components/field-set/FieldSet.js';\nexport type { FieldSetLegendProps } from './forms-core/components/field-set/FieldSet.js';\nexport { FormField } from './forms-core/components/form-field/FormField.js';\nexport type { FormFieldProps } from './forms-core/components/form-field/FormField.js';\nexport { _FormFieldContext } from './forms-core/contexts/FormFieldContext.js';\nexport type { SharedFormFieldContextProps } from './forms-core/contexts/FormFieldContext.js';\nexport type {\n  FormFieldReducerAction,\n  FormFieldReducerActionPayload,\n  FormFieldAction,\n} from './forms-core/state/formfield-state-reducer.js';\nexport type { SharedFormFieldProps } from './forms-core/types/formfield.types.js';\nexport { FormFieldMessages } from './forms-core/components/form-field-messages/FormFieldMessages.js';\nexport type { FormFieldMessageProps } from './forms-core/components/form-field-messages/FormFieldMessages.js';\nexport type {\n  FormFieldControlMessage,\n  FormFieldCustomMessage,\n} from './forms-core/types/formfield-messages.types.js';\nexport type { FormFieldMessageItemProps } from './forms-core/components/form-field-messages/FormFieldMessageItem.js';\nexport type { FormFieldMessageBaseItemProps } from './forms-core/components/form-field-messages/FormFieldMessageBaseItem.js';\nexport { Hint } from './forms-core/components/hint/Hint.js';\nexport type { HintProps } from './forms-core/components/hint/Hint.js';\nexport { Label } from './forms-core/components/label/Label.js';\nexport type { LabelProps } from './forms-core/components/label/Label.js';\nexport { NumberInput } from './number-input/NumberInput.js';\nexport type { NumberInputProps } from './number-input/NumberInputBase.js';\nexport { PasswordInput } from './password-input/PasswordInput.js';\nexport type { PasswordInputProps } from './password-input/PasswordInput.js';\nexport type { PasswordInputTooltipProps } from './password-input/PasswordInputTooltip.js';\nexport { Radio } from './radio/Radio.js';\nexport type { RadioProps } from './radio/Radio.js';\nexport { RadioGroup } from './radio/RadioGroup.js';\nexport type { RadioGroupProps } from './radio/RadioGroup.js';\nexport { SearchInput } from './search-input/SearchInput.js';\nexport type { SearchInputProps } from './search-input/SearchInput.js';\n\nexport { Select } from './select/Select.js';\nexport type {\n  SelectOnChangeValue,\n  SelectFormsProps,\n  SelectBaseProps,\n} from './select/Select.js';\nexport { SelectContent } from './select/SelectContent.js';\nexport type { SelectContentProps } from './select/SelectContent.js';\n\nexport { SelectCustomTrigger } from './select/SelectCustomTrigger.js';\nexport type { SelectCustomTriggerProps } from './select/SelectCustomTrigger.js';\n\nexport { SelectDisplayValue } from './select/SelectDisplayValue.js';\nexport type { SelectDisplayValueProps } from './select/SelectDisplayValue.js';\n\nexport { SelectEmptyState } from './select/SelectEmptyState.js';\nexport type { SelectEmptyStateProps } from './select/SelectEmptyState.js';\n\nexport { SelectFilter } from './select/SelectFilter.js';\nexport type { SelectFilterProps } from './select/SelectFilter.js';\n\nexport { SelectGroup, SelectGroupLabel } from './select/SelectGroup.js';\n\nexport type {\n  SelectGroupLabelProps,\n  SelectGroupProps,\n} from './select/SelectGroup.js';\n\nexport { SelectOption } from './select/SelectOption.js';\nexport type { SelectOptionProps } from './select/SelectOption.js';\n\nexport { SelectPrefix } from './select/SelectPrefix.js';\nexport type { SelectPrefixProps } from './select/SelectPrefix.js';\n\nexport { SelectSuffix } from './select/SelectSuffix.js';\nexport type { SelectSuffixProps } from './select/SelectSuffix.js';\n\nexport { SelectTrigger } from './select/SelectTrigger.js';\nexport type { SelectTriggerProps } from './select/SelectTrigger.js';\n\nexport type {\n  SelectContentWidthOptionsType,\n  SelectTriggerWidthOptionsType,\n  SelectMultiValue,\n  SelectSingleValue,\n} from './select/types.js';\n\nexport {\n  isFormControlRef as _isFormControlRef,\n  isFormControlWithOverlayRef as _isFormControlWithOverlayRef,\n} from './shared-types.js';\nexport type {\n  FormControlRef,\n  FormControlWithOverlayRef,\n  TimeRangePickerRef,\n} from './shared-types.js';\nexport { NumberSpinButton as _NumberSpinButton } from './spin-buttons/number-spin-button/NumberSpinButton.js';\nexport type {\n  NumberSpinButtonDisplayFormat as _NumberSpinButtonDisplayFormat,\n  NumberSpinButtonProps as _NumberSpinButtonProps,\n  NumberSpinButtonRef as _NumberSpinButtonRef,\n} from './spin-buttons/number-spin-button/types.js';\nexport { SpinButtonGroup as _SpinButtonGroup } from './spin-buttons/spin-button-group/SpinButtonGroup.js';\nexport type {\n  SpinButtonGroupProps as _SpinButtonGroupProps,\n  SpinButtonGroupSeparatorProps as _SpinButtonGroupSeparatorProps,\n} from './spin-buttons/spin-button-group/types.js';\nexport { TextSpinButton as _TextSpinButton } from './spin-buttons/text-spin-button/TextSpinButton.js';\nexport type {\n  TextSpinButtonProps as _TextSpinButtonProps,\n  TextSpinButtonRef as _TextSpinButtonRef,\n} from './spin-buttons/text-spin-button/types.js';\nexport type { SpinButtonTextSelection as _SpinButtonTextSelection } from './spin-buttons/types.js';\nexport { Switch } from './switch/Switch.js';\nexport type { SwitchProps } from './switch/Switch.js';\nexport { TextArea } from './text-area/TextArea.js';\nexport type { TextAreaProps, TextAreaInputRef } from './text-area/TextArea.js';\nexport { TextInput } from './text-input/TextInput.js';\nexport type {\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  TextInputControlledProps,\n  TextInputProps,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  TextInputUncontrolledProps,\n} from './text-input/TextInput.js';\n\nexport { DateTimeRangePicker as _DateTimeRangePicker } from './date-time-range-picker/DateTimeRangePicker.js';\nexport type {\n  DateTimeRangePickerProps as _DateTimeRangePickerProps,\n  DateTimeRangePickerRef as _DateTimeRangePickerRef,\n} from './date-time-range-picker/types.js';\n\nexport {\n  ToggleButtonGroup,\n  type ToggleButtonGroupProps,\n} from './toggle-button-group/ToggleButtonGroup.js';\nexport type { ToggleButtonGroupItemProps } from './toggle-button-group/Item.js';\nexport type { ToggleButtonGroupPrefixProps } from './toggle-button-group/Prefix.js';\nexport type { ToggleButtonGroupSuffixProps } from './toggle-button-group/Suffix.js';\n"],
-  "mappings": "AAGA,SAAS,gBAAgB;AAEzB,SAAqB,gBAAiB;AAOtC,SAAS,4BAA4B;AACrC,SAAS,sBAAsB;AAO/B,SAAS,gBAAgB;AAGzB,SAAS,iBAAiB;AAE1B,SAAS,yBAAyB;AAQlC,SAAS,yBAAyB;AAQlC,SAAS,YAAY;AAErB,SAAS,aAAa;AAEtB,SAAS,mBAAmB;AAE5B,SAAS,qBAAqB;AAG9B,SAAS,aAAa;AAEtB,SAAS,kBAAkB;AAE3B,SAAS,mBAAmB;AAG5B,SAAS,cAAc;AAMvB,SAAS,qBAAqB;AAG9B,SAAS,2BAA2B;AAGpC,SAAS,0BAA0B;AAGnC,SAAS,wBAAwB;AAGjC,SAAS,oBAAoB;AAG7B,SAAS,aAAa,wBAAwB;AAO9C,SAAS,oBAAoB;AAG7B,SAAS,oBAAoB;AAG7B,SAAS,oBAAoB;AAG7B,SAAS,qBAAqB;AAU9B;AAAA,EACsB;AAAA,EACW;AAAA,OAC1B;AAMP,SAA6B,wBAAyB;AAMtD,SAA4B,uBAAwB;AAKpD,SAA2B,sBAAuB;AAMlD,SAAS,cAAc;AAEvB,SAAS,gBAAgB;AAEzB,SAAS,iBAAiB;AAS1B,SAAgC,2BAA4B;AAM5D;AAAA,EACE;AAAA,OAEK;",
-  "names": []
+  "sourcesContent": ["export type { BaseInputButtonProps } from './_base-input/BaseInputButton.js';\nexport type { BaseInputContentProps } from './_base-input/BaseInputContent.js';\nexport type { BaseInputButtonProps as TextInputButtonProps } from './_base-input/BaseInputButton.js';\nexport type { BaseInputProps } from './_base-input/base-input.types.js';\nexport type { BaseInputContentProps as TextInputContentProps } from './_base-input/BaseInputContent.js';\nexport { Checkbox } from './checkbox/Checkbox.js';\nexport type { CheckboxProps } from './checkbox/Checkbox.js';\nexport { Calendar as _Calendar } from './calendar/Calendar.js';\nexport type {\n  CalendarProps as _CalendarProps,\n  CalendarStrictValueType as _CalendarOnChangeType,\n  CalendarValueType as _CalendarValueType,\n} from './calendar/Calendar.types.js';\nexport type { CalendarType as _CalendarType } from './calendar/types/calendarConfiguration.js';\nexport { getFormattedDateTime } from './forms-core/time/date-time.js';\nexport { DateTimePicker } from './date-time-picker/DateTimePicker.js';\nexport type {\n  DateTimePickerPrecision,\n  DateTimePickerProps,\n  DateTimePickerType,\n  DateTimePickerTypeProps,\n} from './date-time-picker/types.js';\nexport { FieldSet } from './forms-core/components/field-set/FieldSet.js';\nexport type { FieldSetProps } from './forms-core/components/field-set/FieldSet.js';\nexport type { FieldSetLegendProps } from './forms-core/components/field-set/FieldSet.js';\nexport { FormField } from './forms-core/components/form-field/FormField.js';\nexport type { FormFieldProps } from './forms-core/components/form-field/FormField.js';\nexport { _FormFieldContext } from './forms-core/contexts/FormFieldContext.js';\nexport type { SharedFormFieldContextProps } from './forms-core/contexts/FormFieldContext.js';\nexport type {\n  FormFieldReducerAction,\n  FormFieldReducerActionPayload,\n  FormFieldAction,\n} from './forms-core/state/formfield-state-reducer.js';\nexport type { SharedFormFieldProps } from './forms-core/types/formfield.types.js';\nexport { FormFieldMessages } from './forms-core/components/form-field-messages/FormFieldMessages.js';\nexport type { FormFieldMessageProps } from './forms-core/components/form-field-messages/FormFieldMessages.js';\nexport type {\n  FormFieldControlMessage,\n  FormFieldCustomMessage,\n} from './forms-core/types/formfield-messages.types.js';\nexport type { FormFieldMessageItemProps } from './forms-core/components/form-field-messages/FormFieldMessageItem.js';\nexport type { FormFieldMessageBaseItemProps } from './forms-core/components/form-field-messages/FormFieldMessageBaseItem.js';\nexport { Hint } from './forms-core/components/hint/Hint.js';\nexport type { HintProps } from './forms-core/components/hint/Hint.js';\nexport { Label } from './forms-core/components/label/Label.js';\nexport type { LabelProps } from './forms-core/components/label/Label.js';\n/* eslint-disable-next-line @typescript-eslint/no-deprecated */\nexport { NumberInput } from './number-input/NumberInput.js';\n/* eslint-disable-next-line @typescript-eslint/no-deprecated */\nexport type { NumberInputProps } from './number-input/NumberInputBase.js';\nexport { NumberInput as NumberInputV2 } from './number-input-v2/NumberInput.js';\nexport type { NumberInputProps as NumberInputV2Props } from './number-input-v2/NumberInput.js';\nexport { PasswordInput } from './password-input/PasswordInput.js';\nexport type { PasswordInputProps } from './password-input/PasswordInput.js';\nexport type { PasswordInputTooltipProps } from './password-input/PasswordInputTooltip.js';\nexport { Radio } from './radio/Radio.js';\nexport type { RadioProps } from './radio/Radio.js';\nexport { RadioGroup } from './radio/RadioGroup.js';\nexport type { RadioGroupProps } from './radio/RadioGroup.js';\nexport { SearchInput } from './search-input/SearchInput.js';\nexport type { SearchInputProps } from './search-input/SearchInput.js';\n\nexport { Select } from './select/Select.js';\nexport type {\n  SelectOnChangeValue,\n  SelectFormsProps,\n  SelectBaseProps,\n} from './select/Select.js';\nexport { SelectContent } from './select/SelectContent.js';\nexport type { SelectContentProps } from './select/SelectContent.js';\n\nexport { SelectCustomTrigger } from './select/SelectCustomTrigger.js';\nexport type { SelectCustomTriggerProps } from './select/SelectCustomTrigger.js';\n\nexport { SelectDisplayValue } from './select/SelectDisplayValue.js';\nexport type { SelectDisplayValueProps } from './select/SelectDisplayValue.js';\n\nexport { SelectEmptyState } from './select/SelectEmptyState.js';\nexport type { SelectEmptyStateProps } from './select/SelectEmptyState.js';\n\nexport { SelectFilter } from './select/SelectFilter.js';\nexport type { SelectFilterProps } from './select/SelectFilter.js';\n\nexport { SelectGroup, SelectGroupLabel } from './select/SelectGroup.js';\n\nexport type {\n  SelectGroupLabelProps,\n  SelectGroupProps,\n} from './select/SelectGroup.js';\n\nexport { SelectOption } from './select/SelectOption.js';\nexport type { SelectOptionProps } from './select/SelectOption.js';\n\nexport { SelectPrefix } from './select/SelectPrefix.js';\nexport type { SelectPrefixProps } from './select/SelectPrefix.js';\n\nexport { SelectSuffix } from './select/SelectSuffix.js';\nexport type { SelectSuffixProps } from './select/SelectSuffix.js';\n\nexport { SelectTrigger } from './select/SelectTrigger.js';\nexport type { SelectTriggerProps } from './select/SelectTrigger.js';\n\nexport type {\n  SelectContentWidthOptionsType,\n  SelectTriggerWidthOptionsType,\n  SelectMultiValue,\n  SelectSingleValue,\n} from './select/types.js';\n\nexport {\n  isFormControlRef as _isFormControlRef,\n  isFormControlWithOverlayRef as _isFormControlWithOverlayRef,\n} from './shared-types.js';\nexport type {\n  FormControlRef,\n  FormControlWithOverlayRef,\n  TimeRangePickerRef,\n} from './shared-types.js';\nexport { NumberSpinButton as _NumberSpinButton } from './spin-buttons/number-spin-button/NumberSpinButton.js';\nexport type {\n  NumberSpinButtonDisplayFormat as _NumberSpinButtonDisplayFormat,\n  NumberSpinButtonProps as _NumberSpinButtonProps,\n  NumberSpinButtonRef as _NumberSpinButtonRef,\n} from './spin-buttons/number-spin-button/types.js';\nexport { SpinButtonGroup as _SpinButtonGroup } from './spin-buttons/spin-button-group/SpinButtonGroup.js';\nexport type {\n  SpinButtonGroupProps as _SpinButtonGroupProps,\n  SpinButtonGroupSeparatorProps as _SpinButtonGroupSeparatorProps,\n} from './spin-buttons/spin-button-group/types.js';\nexport { TextSpinButton as _TextSpinButton } from './spin-buttons/text-spin-button/TextSpinButton.js';\nexport type {\n  TextSpinButtonProps as _TextSpinButtonProps,\n  TextSpinButtonRef as _TextSpinButtonRef,\n} from './spin-buttons/text-spin-button/types.js';\nexport type { SpinButtonTextSelection as _SpinButtonTextSelection } from './spin-buttons/types.js';\nexport { Switch } from './switch/Switch.js';\nexport type { SwitchProps } from './switch/Switch.js';\nexport { TextArea } from './text-area/TextArea.js';\nexport type { TextAreaProps, TextAreaInputRef } from './text-area/TextArea.js';\nexport { TextInput } from './text-input/TextInput.js';\nexport type {\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  TextInputControlledProps,\n  TextInputProps,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  TextInputUncontrolledProps,\n} from './text-input/TextInput.js';\n\nexport { DateTimeRangePicker as _DateTimeRangePicker } from './date-time-range-picker/DateTimeRangePicker.js';\nexport type {\n  DateTimeRangePickerProps as _DateTimeRangePickerProps,\n  DateTimeRangePickerRef as _DateTimeRangePickerRef,\n} from './date-time-range-picker/types.js';\n\nexport {\n  ToggleButtonGroup,\n  type ToggleButtonGroupProps,\n} from './toggle-button-group/ToggleButtonGroup.js';\nexport type { ToggleButtonGroupItemProps } from './toggle-button-group/Item.js';\nexport type { ToggleButtonGroupPrefixProps } from './toggle-button-group/Prefix.js';\nexport type { ToggleButtonGroupSuffixProps } from './toggle-button-group/Suffix.js';\n"],
+  "mappings": "AAKA,SAAS,gBAAgB;AAEzB,SAAqB,gBAAiB;AAOtC,SAAS,4BAA4B;AACrC,SAAS,sBAAsB;AAO/B,SAAS,gBAAgB;AAGzB,SAAS,iBAAiB;AAE1B,SAAS,yBAAyB;AAQlC,SAAS,yBAAyB;AAQlC,SAAS,YAAY;AAErB,SAAS,aAAa;AAGtB,SAAS,mBAAmB;AAG5B,SAAwB,eAAfA,oBAAoC;AAE7C,SAAS,qBAAqB;AAG9B,SAAS,aAAa;AAEtB,SAAS,kBAAkB;AAE3B,SAAS,mBAAmB;AAG5B,SAAS,cAAc;AAMvB,SAAS,qBAAqB;AAG9B,SAAS,2BAA2B;AAGpC,SAAS,0BAA0B;AAGnC,SAAS,wBAAwB;AAGjC,SAAS,oBAAoB;AAG7B,SAAS,aAAa,wBAAwB;AAO9C,SAAS,oBAAoB;AAG7B,SAAS,oBAAoB;AAG7B,SAAS,oBAAoB;AAG7B,SAAS,qBAAqB;AAU9B;AAAA,EACsB;AAAA,EACW;AAAA,OAC1B;AAMP,SAA6B,wBAAyB;AAMtD,SAA4B,uBAAwB;AAKpD,SAA2B,sBAAuB;AAMlD,SAAS,cAAc;AAEvB,SAAS,gBAAgB;AAEzB,SAAS,iBAAiB;AAS1B,SAAgC,2BAA4B;AAM5D;AAAA,EACE;AAAA,OAEK;",
+  "names": ["NumberInput"]
 }

package/esm/forms/number-input/NumberInput.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/forms/number-input/NumberInput.tsx"],
-  "sourcesContent": ["import { isFinite } from 'lodash-es';\nimport { forwardRef } from 'react';\n\nimport { NumberInputProps, NumberInputBase } from './NumberInputBase.js';\nimport { useControllableState } from '../../core/hooks/useControllableState.js';\nimport type { FormControlRef } from '../shared-types.js';\n\nconst COMPONENT_NAME = 'NumberInput';\n\n/**\n * Number inputs let users enter and edit integers and floating-point numbers.\n * @public\n */\nexport const NumberInput = /* @__PURE__ */ forwardRef<\n  FormControlRef<HTMLDivElement>,\n  NumberInputProps\n>((props, forwardedRef) => {\n  const { defaultValue, value, onChange, ...remainingProps } = props;\n\n  const [internalValue, setInternalValue] = useControllableState({\n    defaultValue,\n    value,\n    onChange,\n  });\n\n  const handleChange = (newValue: number | null) => {\n    try {\n      const newInternalValue = isFinite(newValue) ? newValue : null;\n      setInternalValue(newInternalValue);\n    } catch {\n      //\n    }\n  };\n\n  return (\n    <NumberInputBase\n      ref={forwardedRef}\n      value={internalValue}\n      onChange={handleChange}\n      {...remainingProps}\n      data-dt-component={COMPONENT_NAME}\n    />\n  );\n});\n(NumberInput as typeof NumberInput & { displayName: string }).displayName =\n  COMPONENT_NAME;\n"],
-  "mappings": "AAmCI;AAnCJ,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAE3B,SAA2B,uBAAuB;AAClD,SAAS,4BAA4B;AAGrC,MAAM,iBAAiB;AAMhB,MAAM,cAA8B,2BAGzC,CAAC,OAAO,iBAAiB;AACzB,QAAM,EAAE,cAAc,OAAO,UAAU,GAAG,eAAe,IAAI;AAE7D,QAAM,CAAC,eAAe,gBAAgB,IAAI,qBAAqB;AAAA,IAC7D;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,eAAe,CAAC,aAA4B;AAChD,QAAI;AACF,YAAM,mBAAmB,SAAS,QAAQ,IAAI,WAAW;AACzD,uBAAiB,gBAAgB;AAAA,IACnC,QAAQ;AAAA,IAER;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,OAAO;AAAA,MACP,UAAU;AAAA,MACT,GAAG;AAAA,MACJ,qBAAmB;AAAA;AAAA,EACrB;AAEJ,CAAC;AACA,YAA6D,cAC5D;",
+  "sourcesContent": ["import { isFinite } from 'lodash-es';\nimport { forwardRef } from 'react';\n\nimport { NumberInputProps, NumberInputBase } from './NumberInputBase.js';\nimport { useControllableState } from '../../core/hooks/useControllableState.js';\nimport type { FormControlRef } from '../shared-types.js';\n\nconst COMPONENT_NAME = 'NumberInput';\n\n/**\n * Number inputs let users enter and edit integers and floating-point numbers.\n * @public\n * @deprecated This component is deprecated and will be removed in a future release. Please use the NumberInputV2 component instead.\n */\nexport const NumberInput = /* @__PURE__ */ forwardRef<\n  FormControlRef<HTMLDivElement>,\n  /* eslint-disable @typescript-eslint/no-deprecated */\n  NumberInputProps\n>((props, forwardedRef) => {\n  const { defaultValue, value, onChange, ...remainingProps } = props;\n\n  const [internalValue, setInternalValue] = useControllableState({\n    defaultValue,\n    value,\n    onChange,\n  });\n\n  const handleChange = (newValue: number | null) => {\n    try {\n      const newInternalValue = isFinite(newValue) ? newValue : null;\n      setInternalValue(newInternalValue);\n    } catch {\n      //\n    }\n  };\n\n  return (\n    <NumberInputBase\n      ref={forwardedRef}\n      value={internalValue}\n      onChange={handleChange}\n      {...remainingProps}\n      data-dt-component={COMPONENT_NAME}\n    />\n  );\n});\n(NumberInput as typeof NumberInput & { displayName: string }).displayName =\n  COMPONENT_NAME;\n"],
+  "mappings": "AAqCI;AArCJ,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAE3B,SAA2B,uBAAuB;AAClD,SAAS,4BAA4B;AAGrC,MAAM,iBAAiB;AAOhB,MAAM,cAA8B,2BAIzC,CAAC,OAAO,iBAAiB;AACzB,QAAM,EAAE,cAAc,OAAO,UAAU,GAAG,eAAe,IAAI;AAE7D,QAAM,CAAC,eAAe,gBAAgB,IAAI,qBAAqB;AAAA,IAC7D;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,eAAe,CAAC,aAA4B;AAChD,QAAI;AACF,YAAM,mBAAmB,SAAS,QAAQ,IAAI,WAAW;AACzD,uBAAiB,gBAAgB;AAAA,IACnC,QAAQ;AAAA,IAER;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,OAAO;AAAA,MACP,UAAU;AAAA,MACT,GAAG;AAAA,MACJ,qBAAmB;AAAA;AAAA,EACrB;AAEJ,CAAC;AACA,YAA6D,cAC5D;",
   "names": []
 }

package/esm/forms/number-input/NumberInputBase.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/forms/number-input/NumberInputBase.tsx"],
-  "sourcesContent": ["import { useNumberField } from '@react-aria/numberfield';\nimport { useNumberFieldState } from '@react-stately/numberfield';\nimport clsx from 'clsx';\nimport {\n  type ChangeEvent,\n  type KeyboardEvent,\n  type KeyboardEventHandler,\n  forwardRef,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport { getRegionalFormat } from '@dynatrace-sdk/user-preferences';\n\nimport { useAriaLabelingProps } from '../../core/hooks/useAriaLabelingProps.js';\nimport { useControllableState } from '../../core/hooks/useControllableState.js';\nimport { useFormControlState } from '../../core/hooks/useFormControlState.js';\nimport { useFocusRing } from '../../core/styles/useFocusRing.js';\nimport type { FocusEvents } from '../../core/types/events.js';\nimport type { FormControlProps } from '../../core/types/form-control-props.js';\nimport { mergeProps as _mergeProps } from '../../core/utils/merge-props.js';\nimport { Flex } from '../../layouts/flex/Flex.js';\nimport { inputGroupClassName } from '../../layouts/input-group/InputGroup.sty.js';\nimport type { BaseInputProps } from '../_base-input/base-input.types.js';\nimport * as styles from '../_base-input/BaseInput.sty.js';\nimport { InternalBaseItem as BaseItem } from '../forms-core/components/form-field-messages/FormFieldMessageBaseItem.js';\nimport { useSyncedFormControlProps } from '../forms-core/hooks/useSyncedFormControlProps.js';\nimport { autofillCSS } from '../hooks/useAutofillEvent.sty.js';\nimport { useAutofillEvent } from '../hooks/useAutofillEvent.js';\nimport { useInputHint } from '../hooks/useInputHint.js';\nimport type { FormControlRef } from '../shared-types.js';\n\n// #region Typings\n/**\n * The properties of the NumberInput component.\n * @public\n */\nexport type NumberInputProps = Pick<\n  BaseInputProps,\n  | 'autoComplete'\n  | 'placeholder'\n  | 'minLength'\n  | 'maxLength'\n  | 'pattern'\n  | 'onKeyUp'\n  | 'className'\n  | 'style'\n  | 'data-testid'\n  | 'data-dtrum-mask'\n  | 'data-dtrum-allow'\n> &\n  FormControlProps<number | null, (value: number | null) => void> &\n  FocusEvents & {\n    /** Handler that is called when a key is pressed. */\n    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n    /** Minimum amount of the input. */\n    min?: number | string;\n    /** Maximum amount of the input. */\n    max?: number | string;\n    /** Defines the step size in which increments/decrements can be performed on the input. */\n    step?: number;\n  };\n// #endregion\n\n/**\n * NumberInputBase component. This is necessary in order to correctly call onChange with undefined on blur, which is otherwise set to NaN by react-stately.\n * @public\n */\nexport const NumberInputBase = /* @__PURE__ */ forwardRef<\n  Omit<FormControlRef<HTMLDivElement>, 'validate'>,\n  NumberInputProps\n>((props, forwardedRef) => {\n  const {\n    id: propId,\n    defaultValue,\n    value,\n    name,\n    onChange,\n    disabled: propDisabled,\n    readOnly: isReadOnly,\n    required: propRequired,\n    min: minValueNumberLike,\n    max: maxValueNumberLike,\n    step,\n    placeholder,\n    controlState,\n    onKeyUp,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onFocusChange,\n    className: consumerClassName,\n    style: consumerStyle,\n    'data-testid': dataTestId,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'aria-disabled': ariaDisabledProp,\n    ...remainingProps\n  }: NumberInputProps = props;\n\n  const componentName = (remainingProps as Record<string, unknown>)[\n    'data-dt-component'\n  ];\n\n  const { 'aria-labelledby': ariaLabelledBy, ...remainingAriaProps } =\n    useAriaLabelingProps(remainingProps);\n  const locale = useMemo(() => getRegionalFormat(), []);\n\n  // Cast min and max to number since we accept string as well to better match native number inputs\n  const minValue = !isNaN(Number(minValueNumberLike))\n    ? Number(minValueNumberLike)\n    : undefined;\n  const maxValue = !isNaN(Number(maxValueNumberLike))\n    ? Number(maxValueNumberLike)\n    : undefined;\n\n  const numberInputValue = value === null || value === undefined ? NaN : value; // necessary so we can clear the inputValue; otherwise, it snaps back to the previously valid inputValue\n\n  const {\n    disabled,\n    required,\n    id: contextId,\n    ariaDisabled,\n  } = useSyncedFormControlProps({\n    propDisabled,\n    propRequired,\n    propId,\n    propAriaDisabled: ariaDisabledProp,\n  });\n  const disabledOrAriaDisabled = disabled || ariaDisabled || false;\n\n  const state = useNumberFieldState({\n    value: numberInputValue,\n    onChange,\n    placeholder,\n    minValue,\n    maxValue,\n    step,\n    isDisabled: disabled,\n    isReadOnly,\n    isRequired: required,\n    locale,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const wrapperRef = useRef<HTMLDivElement | null>(null);\n\n  useImperativeHandle(\n    forwardedRef,\n    (): Omit<FormControlRef<HTMLDivElement>, 'validate'> => ({\n      element: wrapperRef.current,\n      inputRef: inputRef.current,\n      focus() {\n        inputRef.current?.focus();\n      },\n    }),\n    [],\n  );\n\n  const { inputProps } = useNumberField(\n    {\n      value: numberInputValue,\n      onChange,\n      id: contextId,\n      placeholder,\n      minValue,\n      maxValue,\n      step,\n      isDisabled: disabled,\n      isReadOnly,\n      isRequired: required,\n      onKeyUp,\n      onKeyDown,\n      onBlur,\n      onFocus,\n      onFocusChange,\n      // we pass the aria-labelledBy only if there's no aria-label, because the useNumberField would add aria-labelledby\n      // with 2 ids and append the input text to its aria-label otherwise, breaking the getByLabelText selectors in tests otherwise\n      'aria-labelledby': remainingAriaProps['aria-label']\n        ? undefined\n        : ariaLabelledBy,\n\n      ...remainingAriaProps, // passing the aria props here prevents unnecessary react-aria warnings when aria-labelling props are already set\n    },\n    state,\n    // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error, @typescript-eslint/ban-ts-comment\n    // @ts-ignore React 19 - proper overlap for the ref is no longer there. It should be fine, but the Numberfield will be reworked anyways\n    inputRef,\n  );\n  let inputDefaultValue: string | undefined;\n\n  if (defaultValue !== null && defaultValue !== undefined) {\n    inputDefaultValue = defaultValue.toString();\n  } else {\n    inputDefaultValue =\n      value === undefined && !onChange\n        ? '' // this prevents warnings about switching from uncontrolled to controlled inputs when no value or defaultValue is set, but onChange used without a value/defaultValue will still throw it\n        : undefined;\n  }\n\n  const {\n    value: inputPropsValue,\n    type,\n    id,\n    readOnly = false,\n    role,\n    onKeyDown: onKeyDownReactAria,\n    ...remainingInputProps\n  } = inputProps;\n\n  const [inputValue, setInputValue] = useControllableState({\n    defaultValue: inputDefaultValue,\n    value: inputPropsValue?.toString(),\n  });\n\n  const [hasError, hint] = useFormControlState(controlState);\n  // _useInputHint will be replaced with new validation concept. APPDEV-8298\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  const { inputProps: inputHintAriaProps, hintProps } = useInputHint({\n    hint,\n    hasError,\n  });\n\n  const { isAutoFilled, onAnimationStart } = useAutofillEvent();\n\n  const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n    remainingInputProps?.onChange?.(event);\n    setInputValue(event.target.value);\n  };\n\n  const { focusProps, focusClassName } = useFocusRing({\n    color: hasError && !(disabled || ariaDisabled) ? 'critical' : 'neutral',\n    ignoreModality: true,\n    disabled,\n  });\n\n  //TODO: replace this with the BaseInput once the rework is done and we no longer depend on react-aria. This introduced the limitation of passing the inputRef from the BaseInput to the NumberInputBase, as it's initially null and useNumberField instantly breaks instead of waiting for failing gracefully and then resetting the ref on the next render\n  return (\n    <Flex\n      gap={4}\n      flexDirection=\"column\"\n      data-testid={dataTestId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      ref={wrapperRef}\n      className={consumerClassName}\n      style={consumerStyle}\n      data-dt-component={componentName}\n    >\n      <Flex\n        gap={2}\n        alignItems=\"center\"\n        className={clsx(styles.wrapper, styles.variant['default'], {\n          [styles.hasError]: hasError,\n          [styles.disabled]: disabledOrAriaDisabled,\n        })}\n      >\n        <div\n          className={clsx(\n            styles.container,\n            inputGroupClassName,\n            focusClassName,\n            {\n              [styles.isAutoFilled]: isAutoFilled,\n            },\n          )}\n        >\n          <input\n            id={id}\n            ref={inputRef}\n            type=\"text\"\n            role={role}\n            onChange={handleInputChange}\n            onAnimationStart={onAnimationStart}\n            disabled={disabled}\n            className={clsx(styles.input, autofillCSS)}\n            readOnly={readOnly}\n            {...(_mergeProps(\n              remainingInputProps,\n              remainingProps,\n              focusProps,\n              inputHintAriaProps,\n            ) as unknown as Record<string, unknown>)}\n            name={name}\n            required={required} // react-aria only sets aria-required in the remainingInputProps, so we need to override it with the context prop here\n            value={inputValue}\n            aria-disabled={ariaDisabled}\n            // react-aria prevents default events, so it behaves differently from our TextInput, which has some undesired issues - see ADES-3971 and https://github.com/adobe/react-spectrum/issues/2803\n            onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n              if (\n                (e.key === 'Home' && minValue === undefined) ||\n                (e.key === 'End' && maxValue === undefined)\n              ) {\n                onKeyDown?.(e);\n                return; // opt out of using react-aria's keydown logic in this case, because it would prevent default behavior (moving the cursor to the front/end with Home/End)\n              }\n\n              onKeyDownReactAria?.(e); // we still need to use react aria's events when we do have a min/max (then the value will be snapped to these when pressing Home/End) or for incrementing/decrementing the value on pressing Up/Down keys, but these will no longer be necessary as soon as we implement the spin button\n            }}\n          />\n        </div>\n      </Flex>\n      {hint && (\n        <BaseItem\n          variant={hasError ? 'error' : 'hint'}\n          disabled={disabled || ariaDisabled}\n          {...hintProps}\n        >\n          {hint}\n        </BaseItem>\n      )}\n    </Flex>\n  );\n});\n\n(\n  NumberInputBase as typeof NumberInputBase & { displayName: string }\n).displayName = 'NumberInputBase';\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-deprecated */\nimport { useNumberField } from '@react-aria/numberfield';\nimport { useNumberFieldState } from '@react-stately/numberfield';\nimport clsx from 'clsx';\nimport {\n  type ChangeEvent,\n  type KeyboardEvent,\n  type KeyboardEventHandler,\n  forwardRef,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport { getRegionalFormat } from '@dynatrace-sdk/user-preferences';\n\nimport { useAriaLabelingProps } from '../../core/hooks/useAriaLabelingProps.js';\nimport { useControllableState } from '../../core/hooks/useControllableState.js';\nimport { useFormControlState } from '../../core/hooks/useFormControlState.js';\nimport { useFocusRing } from '../../core/styles/useFocusRing.js';\nimport type { FocusEvents } from '../../core/types/events.js';\nimport type { FormControlProps } from '../../core/types/form-control-props.js';\nimport { mergeProps as _mergeProps } from '../../core/utils/merge-props.js';\nimport { Flex } from '../../layouts/flex/Flex.js';\nimport { inputGroupClassName } from '../../layouts/input-group/InputGroup.sty.js';\nimport type { BaseInputProps } from '../_base-input/base-input.types.js';\nimport * as styles from '../_base-input/BaseInput.sty.js';\nimport { InternalBaseItem as BaseItem } from '../forms-core/components/form-field-messages/FormFieldMessageBaseItem.js';\nimport { useSyncedFormControlProps } from '../forms-core/hooks/useSyncedFormControlProps.js';\nimport { autofillCSS } from '../hooks/useAutofillEvent.sty.js';\nimport { useAutofillEvent } from '../hooks/useAutofillEvent.js';\nimport { useInputHint } from '../hooks/useInputHint.js';\nimport type { FormControlRef } from '../shared-types.js';\n\n// #region Typings\n/**\n * The properties of the NumberInput component.\n * @public\n * @deprecated This type is deprecated and will be removed in a future release. Please use the NumberInputV2Props instead.\n */\nexport type NumberInputProps = Pick<\n  BaseInputProps,\n  | 'autoComplete'\n  | 'placeholder'\n  | 'minLength'\n  | 'maxLength'\n  | 'pattern'\n  | 'onKeyUp'\n  | 'className'\n  | 'style'\n  | 'data-testid'\n  | 'data-dtrum-mask'\n  | 'data-dtrum-allow'\n> &\n  FormControlProps<number | null, (value: number | null) => void> &\n  FocusEvents & {\n    /** Handler that is called when a key is pressed. */\n    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n    /** Minimum amount of the input. */\n    min?: number | string;\n    /** Maximum amount of the input. */\n    max?: number | string;\n    /** Defines the step size in which increments/decrements can be performed on the input. */\n    step?: number;\n  };\n// #endregion\n\n/**\n * NumberInputBase component. This is necessary in order to correctly call onChange with undefined on blur, which is otherwise set to NaN by react-stately.\n * @public\n */\nexport const NumberInputBase = /* @__PURE__ */ forwardRef<\n  Omit<FormControlRef<HTMLDivElement>, 'validate'>,\n  NumberInputProps\n>((props, forwardedRef) => {\n  const {\n    id: propId,\n    defaultValue,\n    value,\n    name,\n    onChange,\n    disabled: propDisabled,\n    readOnly: isReadOnly,\n    required: propRequired,\n    min: minValueNumberLike,\n    max: maxValueNumberLike,\n    step,\n    placeholder,\n    controlState,\n    onKeyUp,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onFocusChange,\n    className: consumerClassName,\n    style: consumerStyle,\n    'data-testid': dataTestId,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'aria-disabled': ariaDisabledProp,\n    ...remainingProps\n  }: NumberInputProps = props;\n\n  const componentName = (remainingProps as Record<string, unknown>)[\n    'data-dt-component'\n  ];\n\n  const { 'aria-labelledby': ariaLabelledBy, ...remainingAriaProps } =\n    useAriaLabelingProps(remainingProps);\n  const locale = useMemo(() => getRegionalFormat(), []);\n\n  // Cast min and max to number since we accept string as well to better match native number inputs\n  const minValue = !isNaN(Number(minValueNumberLike))\n    ? Number(minValueNumberLike)\n    : undefined;\n  const maxValue = !isNaN(Number(maxValueNumberLike))\n    ? Number(maxValueNumberLike)\n    : undefined;\n\n  const numberInputValue = value === null || value === undefined ? NaN : value; // necessary so we can clear the inputValue; otherwise, it snaps back to the previously valid inputValue\n\n  const {\n    disabled,\n    required,\n    id: contextId,\n    ariaDisabled,\n  } = useSyncedFormControlProps({\n    propDisabled,\n    propRequired,\n    propId,\n    propAriaDisabled: ariaDisabledProp,\n  });\n  const disabledOrAriaDisabled = disabled || ariaDisabled || false;\n\n  const state = useNumberFieldState({\n    value: numberInputValue,\n    onChange,\n    placeholder,\n    minValue,\n    maxValue,\n    step,\n    isDisabled: disabled,\n    isReadOnly,\n    isRequired: required,\n    locale,\n  });\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const wrapperRef = useRef<HTMLDivElement | null>(null);\n\n  useImperativeHandle(\n    forwardedRef,\n    (): Omit<FormControlRef<HTMLDivElement>, 'validate'> => ({\n      element: wrapperRef.current,\n      inputRef: inputRef.current,\n      focus() {\n        inputRef.current?.focus();\n      },\n    }),\n    [],\n  );\n\n  const { inputProps } = useNumberField(\n    {\n      value: numberInputValue,\n      onChange,\n      id: contextId,\n      placeholder,\n      minValue,\n      maxValue,\n      step,\n      isDisabled: disabled,\n      isReadOnly,\n      isRequired: required,\n      onKeyUp,\n      onKeyDown,\n      onBlur,\n      onFocus,\n      onFocusChange,\n      // we pass the aria-labelledBy only if there's no aria-label, because the useNumberField would add aria-labelledby\n      // with 2 ids and append the input text to its aria-label otherwise, breaking the getByLabelText selectors in tests otherwise\n      'aria-labelledby': remainingAriaProps['aria-label']\n        ? undefined\n        : ariaLabelledBy,\n\n      ...remainingAriaProps, // passing the aria props here prevents unnecessary react-aria warnings when aria-labelling props are already set\n    },\n    state,\n    // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error, @typescript-eslint/ban-ts-comment\n    // @ts-ignore React 19 - proper overlap for the ref is no longer there. It should be fine, but the Numberfield will be reworked anyways\n    inputRef,\n  );\n  let inputDefaultValue: string | undefined;\n\n  if (defaultValue !== null && defaultValue !== undefined) {\n    inputDefaultValue = defaultValue.toString();\n  } else {\n    inputDefaultValue =\n      value === undefined && !onChange\n        ? '' // this prevents warnings about switching from uncontrolled to controlled inputs when no value or defaultValue is set, but onChange used without a value/defaultValue will still throw it\n        : undefined;\n  }\n\n  const {\n    value: inputPropsValue,\n    type,\n    id,\n    readOnly = false,\n    role,\n    onKeyDown: onKeyDownReactAria,\n    ...remainingInputProps\n  } = inputProps;\n\n  const [inputValue, setInputValue] = useControllableState({\n    defaultValue: inputDefaultValue,\n    value: inputPropsValue?.toString(),\n  });\n\n  const [hasError, hint] = useFormControlState(controlState);\n  // _useInputHint will be replaced with new validation concept. APPDEV-8298\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  const { inputProps: inputHintAriaProps, hintProps } = useInputHint({\n    hint,\n    hasError,\n  });\n\n  const { isAutoFilled, onAnimationStart } = useAutofillEvent();\n\n  const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n    remainingInputProps?.onChange?.(event);\n    setInputValue(event.target.value);\n  };\n\n  const { focusProps, focusClassName } = useFocusRing({\n    color: hasError && !(disabled || ariaDisabled) ? 'critical' : 'neutral',\n    ignoreModality: true,\n    disabled,\n  });\n\n  //TODO: replace this with the BaseInput once the rework is done and we no longer depend on react-aria. This introduced the limitation of passing the inputRef from the BaseInput to the NumberInputBase, as it's initially null and useNumberField instantly breaks instead of waiting for failing gracefully and then resetting the ref on the next render\n  return (\n    <Flex\n      gap={4}\n      flexDirection=\"column\"\n      data-testid={dataTestId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      ref={wrapperRef}\n      className={consumerClassName}\n      style={consumerStyle}\n      data-dt-component={componentName}\n    >\n      <Flex\n        gap={2}\n        alignItems=\"center\"\n        className={clsx(styles.wrapper, styles.variant['default'], {\n          [styles.hasError]: hasError,\n          [styles.disabled]: disabledOrAriaDisabled,\n        })}\n      >\n        <div\n          className={clsx(\n            styles.container,\n            inputGroupClassName,\n            focusClassName,\n            {\n              [styles.isAutoFilled]: isAutoFilled,\n            },\n          )}\n        >\n          <input\n            id={id}\n            ref={inputRef}\n            type=\"text\"\n            role={role}\n            onChange={handleInputChange}\n            onAnimationStart={onAnimationStart}\n            disabled={disabled}\n            className={clsx(styles.input, autofillCSS)}\n            readOnly={readOnly}\n            {...(_mergeProps(\n              remainingInputProps,\n              remainingProps,\n              focusProps,\n              inputHintAriaProps,\n            ) as unknown as Record<string, unknown>)}\n            name={name}\n            required={required} // react-aria only sets aria-required in the remainingInputProps, so we need to override it with the context prop here\n            value={inputValue}\n            aria-disabled={ariaDisabled}\n            // react-aria prevents default events, so it behaves differently from our TextInput, which has some undesired issues - see ADES-3971 and https://github.com/adobe/react-spectrum/issues/2803\n            onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n              if (\n                (e.key === 'Home' && minValue === undefined) ||\n                (e.key === 'End' && maxValue === undefined)\n              ) {\n                onKeyDown?.(e);\n                return; // opt out of using react-aria's keydown logic in this case, because it would prevent default behavior (moving the cursor to the front/end with Home/End)\n              }\n\n              onKeyDownReactAria?.(e); // we still need to use react aria's events when we do have a min/max (then the value will be snapped to these when pressing Home/End) or for incrementing/decrementing the value on pressing Up/Down keys, but these will no longer be necessary as soon as we implement the spin button\n            }}\n          />\n        </div>\n      </Flex>\n      {hint && (\n        <BaseItem\n          variant={hasError ? 'error' : 'hint'}\n          disabled={disabled || ariaDisabled}\n          {...hintProps}\n        >\n          {hint}\n        </BaseItem>\n      )}\n    </Flex>\n  );\n});\n\n(\n  NumberInputBase as typeof NumberInputBase & { displayName: string }\n).displayName = 'NumberInputBase';\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/forms/number-input-v2/NumberInput.js

@@ -0,0 +1,240 @@
+import { jsx } from "react/jsx-runtime";
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { getRegionalFormat } from "@dynatrace-sdk/user-preferences";
+import { applyStep } from "./utils/calculations.js";
+import { useMergeRefs } from "../../core/hooks/useMergeRefs.js";
+import { useId } from "../../core/index.js";
+import { BaseInput } from "../_base-input/BaseInput.js";
+import { BaseInputButton } from "../_base-input/BaseInputButton.js";
+import { useFormFieldMessagesContext } from "../forms-core/hooks/useFormFieldMessagesContext.js";
+import { FormFieldMessagesAction } from "../forms-core/state/formfield-messages-state-reducer.js";
+import { checkFormat, parseNumber } from "./utils/format.js";
+import { addError, getErrorKey } from "./utils/validation.js";
+import {
+  BaseInputPrefix,
+  BaseInputSuffix
+} from "../_base-input/BaseInputContent.js";
+const COMPONENT_NAME = "NumberInput";
+const VALID_PATTERN = "^[+\\-]?\\d+(?:[\\.,]\\d+)?(?:[eE][+\\-]?\\d+)?$";
+const VALID_REGEXP = new RegExp(VALID_PATTERN);
+const FORMATTABLE_PATTERN = /^[-+]?[\d.,'\u2019 ٫٬\u00A0\u1680\u2000-\u200A\u202F\u205F\u3000]+(?:[eE][-+]?\d+)?$/u;
+const INTERMEDIATE_VALID_PATTERN = /^[+-]?\d*(?:[.,]\d*)?(?:[eE][+-]?\d*)?$/;
+const NumberInputRoot = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
+  const {
+    onChange,
+    onKeyDown,
+    value: propValue,
+    defaultValue,
+    required,
+    readOnly = false,
+    "data-testid": dataTestId,
+    "data-dtrum-mask": dataDtrumMask,
+    "data-dtrum-allow": dataDtrumAllow,
+    "aria-disabled": ariaDisabledProp,
+    min,
+    max,
+    step,
+    stepMultiplier = 1,
+    ...remainingProps
+  } = props;
+  const { state, dispatch } = useFormFieldMessagesContext();
+  const errorId = useId();
+  const isPasted = useRef(false);
+  const isInternalChanged = useRef(defaultValue !== void 0);
+  const internalRef = useRef(null);
+  const inputRef = useMergeRefs([forwardedRef, internalRef]);
+  const [internalValue, setInternalValue] = useState(
+    defaultValue ?? propValue ?? null
+  );
+  const setValueNative = useCallback(
+    (newValue, triggerChange = true) => {
+      const input = internalRef.current?.inputRef;
+      if (input) {
+        let stringValue;
+        if (newValue === null) {
+          stringValue = "";
+        } else if (typeof newValue === "number") {
+          stringValue = new Intl.NumberFormat(getRegionalFormat(), {
+            useGrouping: false,
+            maximumFractionDigits: 17
+          }).format(newValue);
+        } else {
+          stringValue = String(newValue);
+        }
+        const desc = Object.getOwnPropertyDescriptor(
+          HTMLInputElement.prototype,
+          "value"
+        );
+        desc?.set?.call(input, stringValue);
+        input.value = stringValue;
+        if (triggerChange) {
+          const parsedValue = checkFormat(stringValue);
+          isInternalChanged.current = true;
+          setInternalValue(parsedValue || stringValue);
+          if (VALID_REGEXP.exec(parsedValue)) {
+            onChange?.(parseNumber(parsedValue));
+          } else if (parsedValue === "") {
+            onChange?.(null);
+          }
+        }
+      }
+    },
+    [onChange]
+  );
+  const value = useMemo(() => {
+    const isChanged = isInternalChanged.current;
+    isInternalChanged.current = false;
+    if (isChanged) {
+      return internalValue;
+    }
+    if (!propValue && propValue !== 0) {
+      return "";
+    }
+    const formattedPropValue = new Intl.NumberFormat(getRegionalFormat(), {
+      useGrouping: false,
+      maximumFractionDigits: 17
+      // Max precision for a JS number
+    }).format(propValue);
+    return formattedPropValue;
+  }, [propValue, internalValue]);
+  const handleChange = useCallback(
+    (e) => {
+      const parsedValue = checkFormat(e.target.value);
+      if (VALID_REGEXP.exec(parsedValue)) {
+        onChange?.(parseNumber(parsedValue));
+      }
+      if (parsedValue === "") {
+        onChange?.(null);
+      }
+      if (isPasted.current && FORMATTABLE_PATTERN.exec(parsedValue)) {
+        isInternalChanged.current = true;
+        setInternalValue(parsedValue);
+        setValueNative(parsedValue, false);
+      } else if (INTERMEDIATE_VALID_PATTERN.exec(e.target.value)) {
+        isInternalChanged.current = true;
+        setInternalValue(parsedValue);
+      } else {
+        setValueNative(value ?? "", false);
+      }
+      isPasted.current = false;
+    },
+    [onChange, setInternalValue, value, setValueNative]
+  );
+  const handleStep = useCallback(
+    (direction) => {
+      setValueNative(
+        applyStep(value, step, stepMultiplier, min, max, direction)
+      );
+    },
+    [value, stepMultiplier, step, min, max, setValueNative]
+  );
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (readOnly) {
+        onKeyDown?.(e);
+        return;
+      }
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        handleStep(1);
+      }
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        handleStep(-1);
+      }
+      if (e.key === "Home" && min !== void 0) {
+        e.preventDefault();
+        setValueNative(min);
+      }
+      if (e.key === "End" && max !== void 0) {
+        e.preventDefault();
+        setValueNative(max);
+      }
+      onKeyDown?.(e);
+    },
+    [handleStep, onKeyDown, setValueNative, min, max, readOnly]
+  );
+  useEffect(() => {
+    const el = internalRef?.current;
+    if (!el) {
+      return;
+    }
+    const onWheel = (e) => {
+      if (document.activeElement !== e.target) {
+        return;
+      }
+      e.preventDefault();
+      handleStep(e.deltaY < 0 ? 1 : -1);
+    };
+    el.element?.addEventListener("wheel", onWheel, { passive: false });
+    return () => el.element?.removeEventListener("wheel", onWheel);
+  }, [handleStep]);
+  useEffect(() => {
+    if (!value && value !== 0) {
+      return;
+    }
+    const errorMessage = getErrorKey(value, min, max, step);
+    if (errorMessage) {
+      addError(errorMessage, errorId, internalRef.current?.inputRef, dispatch);
+      return;
+    }
+    dispatch?.({
+      type: FormFieldMessagesAction.REMOVEMESSAGE,
+      payload: {
+        id: errorId,
+        messageType: "formcontrol"
+      }
+    });
+  }, [
+    value,
+    min,
+    max,
+    step,
+    state.isTouched,
+    state.isValid,
+    dispatch,
+    errorId
+  ]);
+  return /* @__PURE__ */ jsx(
+    BaseInput,
+    {
+      ref: inputRef,
+      ...remainingProps,
+      type: "text",
+      inputMode: "decimal",
+      autoComplete: "off",
+      value: value ?? "",
+      required,
+      readOnly,
+      onChange: handleChange,
+      onKeyDown: handleKeyDown,
+      onPaste: () => isPasted.current = true,
+      "data-testid": dataTestId,
+      "data-dtrum-mask": dataDtrumMask,
+      "data-dtrum-allow": dataDtrumAllow,
+      "aria-disabled": ariaDisabledProp,
+      "data-dt-component": COMPONENT_NAME,
+      min,
+      max,
+      step,
+      pattern: VALID_PATTERN
+    }
+  );
+});
+const NumberInput = Object.assign(NumberInputRoot, {
+  Prefix: BaseInputPrefix,
+  Suffix: BaseInputSuffix,
+  Button: BaseInputButton
+});
+NumberInput.displayName = COMPONENT_NAME;
+export {
+  NumberInput
+};
+//# sourceMappingURL=NumberInput.js.map

package/esm/forms/number-input-v2/NumberInput.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/forms/number-input-v2/NumberInput.tsx"],
+  "sourcesContent": ["import {\n  type ChangeEvent as ReactChangeEvent,\n  forwardRef,\n  type KeyboardEvent,\n  type PropsWithChildren,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { getRegionalFormat } from '@dynatrace-sdk/user-preferences';\n\nimport { applyStep } from './utils/calculations.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { useId } from '../../core/index.js';\nimport type { FocusEvents } from '../../core/types/events.js';\nimport type { FormControlProps } from '../../core/types/form-control-props.js';\nimport type { BaseInputProps } from '../_base-input/base-input.types.js';\nimport { BaseInput } from '../_base-input/BaseInput.js';\nimport { BaseInputButton } from '../_base-input/BaseInputButton.js';\nimport { useFormFieldMessagesContext } from '../forms-core/hooks/useFormFieldMessagesContext.js';\nimport { FormFieldMessagesAction } from '../forms-core/state/formfield-messages-state-reducer.js';\nimport type { FormControlRef } from '../shared-types.js';\nimport { checkFormat, parseNumber } from './utils/format.js';\nimport { addError, getErrorKey } from './utils/validation.js';\nimport {\n  BaseInputPrefix,\n  BaseInputSuffix,\n} from '../_base-input/BaseInputContent.js';\n\nconst COMPONENT_NAME = 'NumberInput';\n// Matches a fully valid number: optional sign, integer digits, optional decimal part, optional scientific notation (e.g. \"-1.5e+3\")\nconst VALID_PATTERN = '^[+\\\\-]?\\\\d+(?:[\\\\.,]\\\\d+)?(?:[eE][+\\\\-]?\\\\d+)?$';\nconst VALID_REGEXP = new RegExp(VALID_PATTERN);\n// Matches a number that may use any locale's grouping/decimal separators (spaces, dots, commas, Arabic/Unicode variants)\n// \u2014 used to detect paste-formatted input that can be normalized\nconst FORMATTABLE_PATTERN =\n  /^[-+]?[\\d.,'\\u2019 \u066B\u066C\\u00A0\\u1680\\u2000-\\u200A\\u202F\\u205F\\u3000]+(?:[eE][-+]?\\d+)?$/u;\n// Matches a number that is syntactically incomplete but still being typed:\n// digits and separators are optional so intermediate states like \"-\", \"1.\", \"1.5e\" are allowed without rejecting the input\nconst INTERMEDIATE_VALID_PATTERN = /^[+-]?\\d*(?:[.,]\\d*)?(?:[eE][+-]?\\d*)?$/;\n\n// #region Typings\n/**\n * Number inputs let users enter and edit integers and floating-point numbers.\n * @public\n */\nexport type NumberInputProps = Pick<\n  BaseInputProps,\n  | 'placeholder'\n  | 'variant'\n  | 'onKeyUp'\n  | 'onKeyDown'\n  | 'className'\n  | 'style'\n  | 'data-testid'\n  | 'data-dtrum-mask'\n  | 'data-dtrum-allow'\n> &\n  FormControlProps<number | null, (value: number | null) => void> &\n  PropsWithChildren &\n  FocusEvents & {\n    /** Minimum amount of the input.\n     * @defaultValue undefined */\n    min?: number;\n    /** Maximum amount of the input.\n     * @defaultValue undefined */\n    max?: number;\n    /** Defines the step in which increments/decrements can be performed on the input and validates the value.\n     * Must be a positive number greater than 0. Values that are negative, zero, NaN, or undefined default to 1.\n     * @defaultValue undefined */\n    step?: number;\n    /** Multiplier applied to `step` (or 1 if no `step` is set) to determine how much the value changes\n     * when using arrow keys or the scroll wheel. Must be a positive integer greater than 0.\n     * Values that are negative, zero, NaN, or undefined default to 1. Decimal values are truncated to the nearest integer.\n     * @defaultValue 1 */\n    stepMultiplier?: number;\n  };\n\n// #endregion\n\n/**\n * Number inputs let users enter and edit integers and floating-point numbers.\n * @public\n */\nconst NumberInputRoot = /* @__PURE__ */ forwardRef<\n  FormControlRef<HTMLDivElement>,\n  NumberInputProps\n>((props, forwardedRef) => {\n  const {\n    onChange,\n    onKeyDown,\n    value: propValue,\n    defaultValue,\n    required,\n    readOnly = false,\n    'data-testid': dataTestId,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'aria-disabled': ariaDisabledProp,\n    min,\n    max,\n    step,\n    stepMultiplier = 1,\n    ...remainingProps\n  }: NumberInputProps = props;\n\n  const { state, dispatch } = useFormFieldMessagesContext();\n  const errorId = useId();\n  const isPasted = useRef<boolean>(false);\n  const isInternalChanged = useRef<boolean>(defaultValue !== undefined);\n\n  const internalRef = useRef<FormControlRef<HTMLDivElement>>(null);\n  const inputRef = useMergeRefs([forwardedRef, internalRef]);\n\n  const [internalValue, setInternalValue] = useState<string | number | null>(\n    defaultValue ?? propValue ?? null,\n  );\n\n  // Programmatically sets the DOM input value and optionally notifies consumers.\n  // Uses the native prototype setter so React's internal value tracker stays in sync.\n  const setValueNative = useCallback(\n    (newValue: number | string | null, triggerChange: boolean = true) => {\n      const input = internalRef.current?.inputRef;\n      if (input) {\n        let stringValue: string;\n        if (newValue === null) {\n          stringValue = '';\n        } else if (typeof newValue === 'number') {\n          stringValue = new Intl.NumberFormat(getRegionalFormat(), {\n            useGrouping: false,\n            maximumFractionDigits: 17,\n          }).format(newValue);\n        } else {\n          stringValue = String(newValue);\n        }\n        const desc = Object.getOwnPropertyDescriptor(\n          HTMLInputElement.prototype,\n          'value',\n        );\n        desc?.set?.call(input, stringValue);\n        input.value = stringValue;\n        if (triggerChange) {\n          const parsedValue = checkFormat(stringValue);\n          isInternalChanged.current = true;\n          setInternalValue(parsedValue || stringValue);\n          if (VALID_REGEXP.exec(parsedValue)) {\n            onChange?.(parseNumber(parsedValue));\n          } else if (parsedValue === '') {\n            onChange?.(null);\n          }\n        }\n      }\n    },\n    [onChange],\n  );\n\n  // Caching the value to keep not valid states in the input\n  const value = useMemo<string | number | null>(() => {\n    const isChanged = isInternalChanged.current;\n    isInternalChanged.current = false;\n\n    if (isChanged) {\n      return internalValue;\n    }\n\n    if (!propValue && propValue !== 0) {\n      return '';\n    }\n\n    const formattedPropValue = new Intl.NumberFormat(getRegionalFormat(), {\n      useGrouping: false,\n      maximumFractionDigits: 17, // Max precision for a JS number\n    }).format(propValue);\n\n    return formattedPropValue;\n  }, [propValue, internalValue]);\n\n  const handleChange = useCallback(\n    (e: ReactChangeEvent<HTMLInputElement>) => {\n      const parsedValue = checkFormat(e.target.value);\n\n      if (VALID_REGEXP.exec(parsedValue)) {\n        onChange?.(parseNumber(parsedValue));\n      }\n\n      if (parsedValue === '') {\n        onChange?.(null);\n      }\n\n      if (isPasted.current && FORMATTABLE_PATTERN.exec(parsedValue)) {\n        isInternalChanged.current = true;\n        setInternalValue(parsedValue);\n        setValueNative(parsedValue, false);\n      } else if (INTERMEDIATE_VALID_PATTERN.exec(e.target.value)) {\n        isInternalChanged.current = true;\n        setInternalValue(parsedValue);\n      } else {\n        setValueNative(value ?? '', false);\n      }\n      isPasted.current = false;\n    },\n    [onChange, setInternalValue, value, setValueNative],\n  );\n\n  // Handling step changes with buttons, keyboard and wheel\n  const handleStep = useCallback(\n    (direction: 1 | -1) => {\n      setValueNative(\n        applyStep(value, step, stepMultiplier, min, max, direction),\n      );\n    },\n    [value, stepMultiplier, step, min, max, setValueNative],\n  );\n\n  // Handling keyboard input for step changes and home/end keys\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      if (readOnly) {\n        onKeyDown?.(e);\n        return;\n      }\n\n      if (e.key === 'ArrowUp') {\n        e.preventDefault();\n        handleStep(+1);\n      }\n\n      if (e.key === 'ArrowDown') {\n        e.preventDefault();\n        handleStep(-1);\n      }\n\n      if (e.key === 'Home' && min !== undefined) {\n        e.preventDefault();\n        setValueNative(min);\n      }\n\n      if (e.key === 'End' && max !== undefined) {\n        e.preventDefault();\n        setValueNative(max);\n      }\n      onKeyDown?.(e);\n    },\n    [handleStep, onKeyDown, setValueNative, min, max, readOnly],\n  );\n\n  // Handling wheel input\n  useEffect(() => {\n    const el = internalRef?.current;\n\n    if (!el) {\n      return;\n    }\n\n    const onWheel = (e: WheelEvent) => {\n      if (document.activeElement !== e.target) {\n        return;\n      }\n      e.preventDefault();\n      handleStep(e.deltaY < 0 ? +1 : -1);\n    };\n\n    // Passive event listeners do not work, because the default action needs to be prevented\n    // so we need to explicitly set passive to false\n    el.element?.addEventListener('wheel', onWheel, { passive: false });\n    return () => el.element?.removeEventListener('wheel', onWheel);\n  }, [handleStep]);\n\n  // Validating the native number input props manually, as we need to use a type=\"text\" input and can't rely on the native checks.\n  // We can't use type=\"number\" because it doesn't support all the formatting and localization features we need.\n  useEffect(() => {\n    if (!value && value !== 0) {\n      return;\n    }\n\n    const errorMessage = getErrorKey(value, min, max, step);\n    if (errorMessage) {\n      addError(errorMessage, errorId, internalRef.current?.inputRef, dispatch);\n      return;\n    }\n\n    dispatch?.({\n      type: FormFieldMessagesAction.REMOVEMESSAGE,\n      payload: {\n        id: errorId,\n        messageType: 'formcontrol',\n      },\n    });\n  }, [\n    value,\n    min,\n    max,\n    step,\n    state.isTouched,\n    state.isValid,\n    dispatch,\n    errorId,\n  ]);\n\n  return (\n    <BaseInput\n      ref={inputRef}\n      {...remainingProps}\n      type=\"text\"\n      inputMode=\"decimal\"\n      autoComplete=\"off\"\n      value={value ?? ''}\n      required={required}\n      readOnly={readOnly}\n      onChange={handleChange}\n      onKeyDown={handleKeyDown}\n      onPaste={() => (isPasted.current = true)}\n      data-testid={dataTestId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      aria-disabled={ariaDisabledProp}\n      data-dt-component={COMPONENT_NAME}\n      min={min}\n      max={max}\n      step={step}\n      pattern={VALID_PATTERN}\n    />\n  );\n});\n\n/**\n * Use the `NumberInput` component to enter integers and floating-point numbers.\n * @public\n */\nexport const NumberInput = Object.assign(NumberInputRoot, {\n  Prefix: BaseInputPrefix,\n  Suffix: BaseInputSuffix,\n  Button: BaseInputButton,\n});\n\n(NumberInput as typeof NumberInput & { displayName: string }).displayName =\n  COMPONENT_NAME;\n"],
+  "mappings": "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",
+  "names": []
+}

package/esm/forms/number-input-v2/utils/calculations.js

@@ -0,0 +1,84 @@
+import { parseNumber } from "./format.js";
+import { sanitizePositiveNumber } from "./validation.js";
+function resolveInputValue(value) {
+  if (value === null) {
+    return 0;
+  }
+  if (typeof value === "string") {
+    if (value.trim() === "") {
+      return 0;
+    }
+    const parsed = parseNumber(value);
+    return parsed ?? 0;
+  }
+  return value;
+}
+function isValidStep(step) {
+  return step !== void 0 && !Number.isNaN(step) && step > 0;
+}
+function computeStepAlignedValue(parsedValue, direction, cleanedStep, baseValue) {
+  const remainder = Math.abs((parsedValue - baseValue) % cleanedStep);
+  const softEpsilon = Number.EPSILON * 100;
+  if (remainder <= softEpsilon || remainder >= cleanedStep - softEpsilon) {
+    return void 0;
+  }
+  const nextValue = parsedValue + direction * cleanedStep;
+  if (parsedValue < baseValue) {
+    return nextValue + remainder - (direction > 0 ? cleanedStep : 0);
+  }
+  return nextValue - remainder + (direction < 0 ? cleanedStep : 0);
+}
+function applyMinConstraint(value, min) {
+  if (min === void 0 || Number.isNaN(min)) {
+    return value;
+  }
+  return Math.max(value, min);
+}
+function applyMaxConstraint(value, max, baseValue, cleanedStep, validStep) {
+  if (max === void 0 || Number.isNaN(max)) {
+    return value;
+  }
+  if (validStep && value >= max) {
+    return baseValue + cleanedStep * Math.floor((max - baseValue) / cleanedStep);
+  }
+  return Math.min(value, max);
+}
+function roundToPrecision(value) {
+  const precision = Math.pow(10, 10);
+  return Math.round(value * precision) / precision;
+}
+function applyStep(value, step, stepMultiplier, min, max, direction) {
+  const parsedValue = resolveInputValue(value);
+  if (Number.isNaN(parsedValue)) {
+    return value;
+  }
+  const validStep = isValidStep(step);
+  const cleanedStep = sanitizePositiveNumber(step);
+  const effectiveStepSize = Math.trunc(sanitizePositiveNumber(stepMultiplier)) * cleanedStep;
+  const baseValue = min || 0;
+  let nextValue = parsedValue + direction * effectiveStepSize;
+  if (validStep) {
+    const aligned = computeStepAlignedValue(
+      parsedValue,
+      direction,
+      cleanedStep,
+      baseValue
+    );
+    if (aligned !== void 0) {
+      nextValue = aligned;
+    }
+  }
+  nextValue = applyMinConstraint(nextValue, min);
+  nextValue = applyMaxConstraint(
+    nextValue,
+    max,
+    baseValue,
+    cleanedStep,
+    validStep
+  );
+  return roundToPrecision(nextValue);
+}
+export {
+  applyStep
+};
+//# sourceMappingURL=calculations.js.map

package/esm/forms/number-input-v2/utils/calculations.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/forms/number-input-v2/utils/calculations.ts"],
+  "sourcesContent": ["import { parseNumber } from './format.js';\nimport { sanitizePositiveNumber } from './validation.js';\n\n/** Normalizes any incoming value type to a plain number for arithmetic. Null and empty/whitespace strings resolve to 0. Returns NaN for unparseable strings or NaN inputs. */\nfunction resolveInputValue(value: string | number | null): number {\n  if (value === null) {\n    return 0;\n  }\n\n  if (typeof value === 'string') {\n    if (value.trim() === '') {\n      return 0;\n    }\n    const parsed = parseNumber(value);\n    return parsed ?? 0;\n  }\n\n  return value; // number, possibly NaN\n}\n\n/** Returns true when `step` is a finite positive number that can be used for alignment. */\nfunction isValidStep(step: number | undefined): boolean {\n  return step !== undefined && !Number.isNaN(step) && step > 0;\n}\n\n/**\n * When `parsedValue` falls between two step marks, returns the value snapped to the nearest mark in the given direction.\n * Returns `undefined` when the value already sits on a step boundary (no snap needed).\n */\nfunction computeStepAlignedValue(\n  parsedValue: number,\n  direction: 1 | -1,\n  cleanedStep: number,\n  baseValue: number,\n): number | undefined {\n  const remainder = Math.abs((parsedValue - baseValue) % cleanedStep);\n  const softEpsilon = Number.EPSILON * 100;\n\n  if (remainder <= softEpsilon || remainder >= cleanedStep - softEpsilon) {\n    return undefined; // already on a boundary\n  }\n\n  const nextValue = parsedValue + direction * cleanedStep;\n\n  if (parsedValue < baseValue) {\n    return nextValue + remainder - (direction > 0 ? cleanedStep : 0);\n  }\n\n  return nextValue - remainder + (direction < 0 ? cleanedStep : 0);\n}\n\n/** Clamps `value` to the lower bound if `min` is defined. */\nfunction applyMinConstraint(value: number, min: number | undefined): number {\n  if (min === undefined || Number.isNaN(min)) {\n    return value;\n  }\n  return Math.max(value, min);\n}\n\n/** Clamps `value` to the upper bound. When `validStep` is set and the clamped value equals `max`, it is further snapped down to the last full step below `max`. */\nfunction applyMaxConstraint(\n  value: number,\n  max: number | undefined,\n  baseValue: number,\n  cleanedStep: number,\n  validStep: boolean,\n): number {\n  if (max === undefined || Number.isNaN(max)) {\n    return value;\n  }\n\n  if (validStep && value >= max) {\n    return (\n      baseValue + cleanedStep * Math.floor((max - baseValue) / cleanedStep)\n    );\n  }\n\n  return Math.min(value, max);\n}\n\n/** Rounds away floating-point noise beyond 10 decimal places. */\nfunction roundToPrecision(value: number): number {\n  const precision = Math.pow(10, 10);\n  return Math.round(value * precision) / precision;\n}\n\n/**\n * Apply step increment or decrement to a given value, ensuring it adheres to the specified step, min, and max constraints.\n * @internal\n */\nexport function applyStep(\n  value: string | number | null,\n  step: number | undefined,\n  stepMultiplier: number | undefined,\n  min: number | undefined,\n  max: number | undefined,\n  direction: 1 | -1,\n): number | null | string {\n  const parsedValue = resolveInputValue(value);\n\n  if (Number.isNaN(parsedValue)) {\n    return value;\n  }\n\n  const validStep = isValidStep(step);\n  const cleanedStep = sanitizePositiveNumber(step);\n  const effectiveStepSize =\n    Math.trunc(sanitizePositiveNumber(stepMultiplier)) * cleanedStep;\n  const baseValue = min || 0;\n\n  let nextValue = parsedValue + direction * effectiveStepSize;\n\n  if (validStep) {\n    const aligned = computeStepAlignedValue(\n      parsedValue,\n      direction,\n      cleanedStep,\n      baseValue,\n    );\n    if (aligned !== undefined) {\n      nextValue = aligned;\n    }\n  }\n\n  nextValue = applyMinConstraint(nextValue, min);\n  nextValue = applyMaxConstraint(\n    nextValue,\n    max,\n    baseValue,\n    cleanedStep,\n    validStep,\n  );\n\n  return roundToPrecision(nextValue);\n}\n"],
+  "mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AAGvC,SAAS,kBAAkB,OAAuC;AAChE,MAAI,UAAU,MAAM;AAClB,WAAO;AAAA,EACT;AAEA,MAAI,OAAO,UAAU,UAAU;AAC7B,QAAI,MAAM,KAAK,MAAM,IAAI;AACvB,aAAO;AAAA,IACT;AACA,UAAM,SAAS,YAAY,KAAK;AAChC,WAAO,UAAU;AAAA,EACnB;AAEA,SAAO;AACT;AAGA,SAAS,YAAY,MAAmC;AACtD,SAAO,SAAS,UAAa,CAAC,OAAO,MAAM,IAAI,KAAK,OAAO;AAC7D;AAMA,SAAS,wBACP,aACA,WACA,aACA,WACoB;AACpB,QAAM,YAAY,KAAK,KAAK,cAAc,aAAa,WAAW;AAClE,QAAM,cAAc,OAAO,UAAU;AAErC,MAAI,aAAa,eAAe,aAAa,cAAc,aAAa;AACtE,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,cAAc,YAAY;AAE5C,MAAI,cAAc,WAAW;AAC3B,WAAO,YAAY,aAAa,YAAY,IAAI,cAAc;AAAA,EAChE;AAEA,SAAO,YAAY,aAAa,YAAY,IAAI,cAAc;AAChE;AAGA,SAAS,mBAAmB,OAAe,KAAiC;AAC1E,MAAI,QAAQ,UAAa,OAAO,MAAM,GAAG,GAAG;AAC1C,WAAO;AAAA,EACT;AACA,SAAO,KAAK,IAAI,OAAO,GAAG;AAC5B;AAGA,SAAS,mBACP,OACA,KACA,WACA,aACA,WACQ;AACR,MAAI,QAAQ,UAAa,OAAO,MAAM,GAAG,GAAG;AAC1C,WAAO;AAAA,EACT;AAEA,MAAI,aAAa,SAAS,KAAK;AAC7B,WACE,YAAY,cAAc,KAAK,OAAO,MAAM,aAAa,WAAW;AAAA,EAExE;AAEA,SAAO,KAAK,IAAI,OAAO,GAAG;AAC5B;AAGA,SAAS,iBAAiB,OAAuB;AAC/C,QAAM,YAAY,KAAK,IAAI,IAAI,EAAE;AACjC,SAAO,KAAK,MAAM,QAAQ,SAAS,IAAI;AACzC;AAMO,SAAS,UACd,OACA,MACA,gBACA,KACA,KACA,WACwB;AACxB,QAAM,cAAc,kBAAkB,KAAK;AAE3C,MAAI,OAAO,MAAM,WAAW,GAAG;AAC7B,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,YAAY,IAAI;AAClC,QAAM,cAAc,uBAAuB,IAAI;AAC/C,QAAM,oBACJ,KAAK,MAAM,uBAAuB,cAAc,CAAC,IAAI;AACvD,QAAM,YAAY,OAAO;AAEzB,MAAI,YAAY,cAAc,YAAY;AAE1C,MAAI,WAAW;AACb,UAAM,UAAU;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AACA,QAAI,YAAY,QAAW;AACzB,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,cAAY,mBAAmB,WAAW,GAAG;AAC7C,cAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,SAAO,iBAAiB,SAAS;AACnC;",
+  "names": []
+}