Ignite UI for React

All
  • Public
  • Public/Protected
  • All

Class IgrInput

Slot

prefix - Renders content before the input.

Slot

suffix - Renders content after input.

Slot

helper-text - Renders content below the input.

Slot

value-missing - Renders content when the required validation fails.

Slot

type-mismatch - Renders content when the a type url/email input pattern validation fails.

Slot

pattern-mismatch - Renders content when the pattern validation fails.

Slot

too-long - Renders content when the maxlength validation fails.

Slot

too-short - Renders content when the minlength validation fails.

Slot

range-overflow - Renders content when the max validation fails.

Slot

range-underflow - Renders content when the min validation fails.

Slot

step-mismatch - Renders content when the step validation fails.

Slot

custom-error - Renders content when setCustomValidity(message) is set.

Slot

invalid - Renders content when the component is in invalid state (validity.valid = false).

Csspart

container - The main wrapper that holds all main input elements.

Csspart

input - The native input element.

Csspart

label - The native label element.

Csspart

prefix - The prefix wrapper.

Csspart

suffix - The suffix wrapper.

Csspart

helper-text - The helper text wrapper.

Callable

  • IgrInput(): ReactNode

    Returns ReactNode

Events

Methods

Properties

Events

onChange

onChange: (args: CustomEvent<string>) => void

Emitted when the control's checked state changes.

Type declaration

onInput

onInput: (args: CustomEvent<string>) => void

Emitted when the control input receives user input.

Type declaration

Methods

select

  • select(): void

    Selects all text within the input.

    Returns void

setRangeText

  • setRangeText(
        replacement: string,
        start: number,
        end: number,
        selectMode?: RangeTextSelectMode,
    ): void

    Replaces the selected text in the input.

    Parameters

    Returns void

stepDown

  • stepDown(n?: number): void

    Decrements the numeric value of the input by one or more steps.

    Parameters

    • n: number

    Returns void

stepUp

  • stepUp(n?: number): void

    Increments the numeric value of the input by one or more steps.

    Parameters

    • n: number

    Returns void

Properties

autocomplete

autocomplete: string

The autocomplete attribute of the control.

autofocus

autofocus: boolean

The autofocus attribute of the control.

inputMode

inputMode: string

The input mode attribute of the control. See relevant MDN article

max

max: number

The max attribute of the control.

maxLength

maxLength: number

The maximum string length of the control.

min

min: number

The min attribute of the control.

minLength

minLength: number

The minimum string length required by the control.

pattern

pattern: string

The pattern attribute of the control.

step

step: number

The step attribute of the control.

type

type: InputType

The type attribute of the control.

validateOnly

validateOnly: boolean

Enables validation rules to be evaluated without restricting user input. This applies to the maxLength property for string-type inputs or allows spin buttons to exceed the predefined min/max limits for number-type inputs.

value

value: string

The value of the control.