text-field

Import

import { TextField } from '@xpanseinc/nebula'

Usage

Size

Use the size prop to specify size. There are 2 size options for all inputs:

md (default)

Name

<TextField label="Name" placeholder="Enter your full legal name…" />

sm

Name

<TextField label="Name" placeholder="Enter your full legal name…" size="sm" />

With helper text

We'll use this address to contact you about the status of your loan.

<TextField
  label="Email"
  type="email"
  defaultValue="greg.middleman@xpanseinc.com"
  helperText="We'll use this address to contact you about the status of your loan."
/>

Invalid

Username

Please enter a username

<TextField label="Username" invalid error="Please enter a username" />

Disabled

Name

<TextField label="Name" defaultValue="Greg Middleman" disabled />