Subcomponents

Control

The control subcomponent is required to render the Control of the TextInput component. Because of this, this component extends the native ranged input component props. Because of this, you can use all of the native props. This is a required children.

Notice that there is a difference between using hasError, isDisabled here or in the parent component. It is not recommended to change this props in the Control subcomponent, because this props can be inherited from the Wrapper, in fact, you should never use it. If you use it in the Control subcomponent, you will get the state only in the field.

API

Props	Type	Required
rangeVisibility	boolean	❌
minValue	number	❌
maxValue	number	❌
hasInput	boolean	❌
value	number	❌
isDisabled	boolean	❌
hasError	boolean	❌
step	number	❌
onChange	(e: React.ChangeEvent<HTMLInputElement>) => void;	❌

rangeVisibility

Set to true if you want the slider to show the range

minValue and maxValue

Maximum or minimum value of the slider

hasInput

Set to true if you want to have an numeric input that affects the value.

step

Steps on which the input changes the values

Helptext

The helptext subcomponent renders the children passed below the field as a ReactNode. This is made like this so you can have full control over the component.

Helptext API

The control subcomponent is required to render the HelpText of the TextInput component. Because of this, this component extends the native span component props.

children	ReactNode	✅

Label

The Label subcomponent extends the SDS label component. See for reference: Label