Text-based input fields for collecting typed data from users.

input

Text-based input with HTML5 type support.

{
  key: 'email',
  type: 'input',
  value: '',
  label: 'Email',
  required: true,
  email: true,
  placeholder: 'user@example.com',
  props: {
    type: 'email',              // 'text' | 'email' | 'password' | 'number' | 'tel' | 'url'
  }
}

Core Props:

type: HTML input type ('text' | 'email' | 'password' | 'number' | 'tel' | 'url')
placeholder: Input placeholder text

Adapter Props

Prop	Type	Description
`appearance`	`'fill' \| 'outline'`	Material form field appearance variant
`hint`	`string`	Helper text displayed below the field
`subscriptSizing`	`'fixed' \| 'dynamic'`	Controls space reserved for hint/error
`floatLabel`	`'auto' \| 'always' \| 'never'`	Label float behavior
`hideRequiredMarker`	`boolean`	Hide the required asterisk

Example

Material

textarea

Multi-line text input.

{
  key: 'bio',
  type: 'textarea',
  value: '',
  label: 'Biography',
  maxLength: 500,
  placeholder: 'Tell us about yourself',
  props: {
    rows: 4,
  }
}

Core Props:

placeholder: Placeholder text
rows: Number of visible text rows

Adapter Props

Prop	Type	Description
`appearance`	`'fill' \| 'outline'`	Material form field appearance variant
`hint`	`string`	Helper text below the field
`resize`	`'none' \| 'vertical' \| 'horizontal' \| 'both'`	Resize handle behavior
`floatLabel`	`'auto' \| 'always' \| 'never'`	Label float behavior
`hideRequiredMarker`	`boolean`	Hide the required asterisk

Example

Material