blackchalkv0.3.0
Components

Form Field

SketchFormField — a labelled wrapper that pairs any input with an optional inline error message.

SketchFormField composes a label, an arbitrary input child, and an optional error message into a single vertical stack. Pass any sketch input (or any element) as children and it will be laid out consistently with the rest of the sketch system.

Default

import { SketchFormField, SketchInput } from "blackchalk";<SketchFormField label="Email address"><SketchInput placeholder="you@example.com" /></SketchFormField>

With error

import { SketchFormField, SketchInput } from "blackchalk";<SketchFormField label="Email address" error="Please enter a valid email"><SketchInput placeholder="you@example.com" /></SketchFormField>

Props

PropTypeDefault
labelstring
errorstring
childrenReactNode

See it in the Storybook playground, or read the source.

On this page