NumberInputV2

Use the NumberInput component to enter integers and floating-point numbers.

NumberInputV2Props

Signature:

export declare type NumberInputV2Props = <,  |  |  |  |  |  |  |  | > & < | , (value:  | ) => > &  &  & {
    /** Minimum amount of the input.
     * @defaultValue  */
    min?: ;
    /** Maximum amount of the input.
     * @defaultValue  */
    max?: ;
    /** Defines the step in which increments/decrements can be performed on the input and validates the value.
     * Must be a positive  greater than 0. Values that are negative, zero, NaN, or  default to 1.
     * @defaultValue  */
    step?: ;
    /** Multiplier applied to `step` (or 1 if no `step` is set) to determine how much the value changes
     * when using arrow keys or the scroll wheel. Must be a positive integer greater than 0.
     * Values that are negative, zero, NaN, or  default to 1. Decimal values are truncated to the nearest integer.
     * @defaultValue 1 */
    stepMultiplier?: ;
};

NumberInput.Prefix, NumberInput.Suffix

You can use the NumberInput.Prefix component to render custom content in front of the input, or the NumberInput.Suffix component if you need to render content after it.

BaseInputContentProps

Name	Type	Default	Description
`children`			Elements to be displayed in the Prefix slot.

NumberInput.Button

You can use the NumberInput.Button component to render a button inside the NumberInput.Prefix or NumberInput.Suffix component.

BaseInputButtonProps

extends, , , ,

Name	Default	Description
`children`		Elements to be displayed in the BaseInput Button slot, preferably an icon or a similar visual element
`disabled?`	`false`	If a button is disabled e.g. it cannot be interacted with. By default, it inherits the disabled prop of the BaseInput, but can be overwritten.
`tooltipText?`		If specified, a tooltip is rendered with this text, which describes what the button does. Please also consider translating the text in an internationalized context and use a short text description for the tooltip. The positioning and placing of the according tooltip will be handled by the component.
`onClick?`		Called when the button is interacted with.
`readOnly?`		Determines whether the input is in read-only mode.

Still have questions?

Find answers in the Dynatrace Community