Label is a light wrapper around the basic HTML label element

It adds default styling and the css prop.

Labels are associated with controls like input or checkbox, however before using this component consider using one of the provided Field components that are available. Use this Label to compose more complex Field type components.

Accessibility

For accessibility purposes the component needs either to have the htmlFor prop set to link it to the control it is associated with or to wrap around the component that it is labelling.

Sizes

<Label size="sm">A small label</Label>
<Label>A normal label</Label>

Required

To denote a required field, the required prop will add an * suffix to the label text.

<Label required>A normal label</Label>

API Reference

PropTypeDefaultRequired
size
"sm" | "md"
md

-

direction
"reverse" | "row"
row

-

type
"block" | "inline"
block

-

align
"center" | "start"
start

-

cssCSSProperties

-

-

asJSX.IntrinsicElementslabel

-

required
boolean

-

-