InputSliderLegacy deprecated LEGACY

Examples API Setup

Dark mode Background

-

Name and description	Type	Value
`disabled` Disabled state (use `formControl.disable()` )	`boolean`
`[min]` The lowest value in the range of permitted values	`number`	`0`
`[max]` The greatest value in the range of permitted values	`number`	`10`
`[quantum]` Minimum indivisible value	`number`	`1`
`[steps]` Number of actual discrete slider steps If property is not set (i.e. equals to default value 0 ), number of steps equals `(max - min) / quantum`	`number`
`[segments]` A number of visual segments or an array, in which every number - is ratio of slider's track length in range (0; 1) where to put tick (use `1` for no ticks)	`number \| number[]`	`1`
`[keySteps]` Anchor points of non-uniform format between value and position	`TuiKeySteps`
`[valueContent]` A template for custom view of selected value.	`PolymorpheusContent`	`''`
TuiNumberFormat Usage example: `[tuiNumberFormat]="{thousandSeparator, decimalSeparator, ..., rounding}"`
`[thousandSeparator]` Symbol for separating thousands	`string`
`[decimalSeparator]` Symbol for separating fraction	`string`
`[decimalMode]` `always` number of digits after `[decimalSeparator]` is always equal to the precision. `pad` pads trailing zeroes up to precision, if the number is fractional `not-zero` drops trailing zeroes	`TuiDecimalMode`	`'pad'`
`[rounding]` `round` rounds to the nearest number with the specified `[precision]` `floor` rounds down (the largest number with the specified `[precision]` less than or equal to a given number) `ceil` rounds up (the smallest number with the specified `[precision]` greater than or equal to a given number) `truncate` returns the number with the specified `[precision]` by just removing extra fractional digits	`TuiRounding`	`'truncate'`

Can be expanded with TuiHint

Requires you to import TuiHint

Name and description	Type	Value
`[tuiHintContent]` Content of a hint	`PolymorpheusContent`	`''`
`[tuiHintDirection]` Hint direction	`TuiHintDirection \| TuiHintDirection[]`	`'bottom-left'`
`[tuiHintAppearance]` Hint mode	`string`	`''`

Can be expanded with TuiTextfieldController

Requires you to import TuiTextfieldControllerModule

Name and description	Type	Value
`[tuiTextfieldCleaner]` Shows a cross to reset a value	`boolean`
`[tuiTextfieldCustomContent]` Right content (e.g. avatar with maximum size 32x32px)	`PolymorpheusContent`	`''`
`[tuiTextfieldLabelOutside]` Label is outside a component and made with `Label` ( `labelOutside = false` does not work together with `size === 's'` : for s-size inputs use only outside labels)	`boolean`
`[tuiTextfieldSize]` Size	`TuiSizeS \| TuiSizeL`	`'l'`
`[tuiTextfieldIconLeft]` A left icon. It can be stringified svg.	`string`	`''`
`[tuiTextfieldFiller]` Pale text suggestion for input (e.g. HH:MM:SS for time)	`string`
`[tuiTextfieldPrefix]` Uneditable text before value	`string`	`''`
`[tuiTextfieldPostfix]` Uneditable text after value	`string`	`''`

Inherited from `TuiReactiveControl`

Name and description	Type	Value
`[readOnly]` Component is read only	`boolean`
`[pseudoInvalid]` Set invalid state regardless of control	`null \| boolean`	`null`

Inherited from `TuiInteractive`

Name and description	Type	Value
`[focusable]` Element can be focused	`boolean`
`[nativeId]` Native ID attribute for element. It helps users with Screen Readers to use a page	`string`
`[pseudoHover]` Visual hovered state	`null \| boolean`	`null`
`[pseudoFocus]` Visual focused state	`null \| boolean`	`null`
`[pseudoActive]` Visual pressed state	`null \| boolean`	`null`
`(focusedChange)` Emits on focus and blur	`boolean`	Emit!