TextInput Group
The TextInputGroup component lives in 2 different packages:
Text type - @heathmont/moon-core
Select type - @heathmont/moon-select
!!! TextInput Group is supported only in size `xlarge`.
Default
Combined
City
City
Combined vertical
City
City
RTL
Text type variants
Single Select variant
Choose an option
Choose an option
Multi Select variant
xLarge
Choose an option
xLarge
Choose an option
Single Select variant vertical orientation
xLarge
Choose an option
xLarge
Choose an option
Single Select variant RTL
Choose an option
xLarge
Choose an option
Access Values by ref
Access Values (Select) by event listener
Country
Vehicle
Props (Text types)
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| inputProps | object { input1: TextInputTypes, input2: TextInputTypes } | Yes | object { inputSize: 'xlarge', type: 'text' } | Props for the text input fields. See TextInput component |
| orientation | vertical | horizontal | No | horizontal | How the fields are positioned with one another |
| isRtl | boolean | No | false | Text direction |
Props (Select types)
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| selectProps | object { input1: SelectProps, input2: SelectProps } | Yes | object {} | Props for the select fields. See Single Select and Multi Select components |
| orientation | vertical | horizontal | No | horizontal | How the fields are positioned with one another |
| isRtl | boolean | No | false | Text direction |