Components

Text Field

Text fields let the user enter a single line of text, such as a name or email address.

Stable

Name

Enter your full name.

Anatomy

import {TextField} from '@staffbase/design';

<TextField />

Address

Enter a valid email address.

Inherits props fromBase UI Input Root

Renders a single-line text input. Combine with Field to provide accessible labels, descriptions, and errors.

Supports all Base UI Input props and native input attributes. The table below highlights TextField-specific and constrained props.

Name	Type	Description
`type`	`textemailpasswordtelurl`	The HTML input type rendered by the field. Default: `text`
`leadingIcon`	`ReactNode`	An icon rendered at the start side of the input.
`trailingIcon`	`ReactNode`	An icon rendered at the end side of the input.