Skip to content

role textbox

Text field draft v0.1.0

Lets people enter or edit a single line of text.

A text field collects one line of free text: a name, an email address, a search term, a quantity typed as text. It has a visible label above, an optional description and, when its value fails validation, an error message under it. Several lines of text are a Textarea; a choice among known values is a Select.

Examples

Full name

size="medium"
label="Full name"
value="Ada Lovelace"

Open in playground

Email address

We will only use it to send your receipt.

size="medium"
label="Email address"
placeholder="name@example.com"
description="We will only use it to send your receipt."
required=true

Open in playground

Search

size="small"
label="Search"
placeholder="Filter by name"

Open in playground

Project name

size="large"
label="Project name"
value="Quantum Design System"

Open in playground

Email address

Enter an email address with an @.

size="medium"
label="Email address"
value="ada.example.com"
invalid=true
errorMessage="Enter an email address with an @."
required=true

Open in playground

Workspace identifier

Generated when the workspace was created.

size="medium"
label="Workspace identifier"
value="ws_8f3a2c"
description="Generated when the workspace was created."
readonly=true

Open in playground

Billing email

size="medium"
label="Billing email"
value="billing@example.com"
disabled=true

Open in playground