Components
Form Row
SketchFormRow — a label-and-control layout row for sketch-style forms.
SketchFormRow pairs a bold label (and optional description) with any form
control, keeping them aligned in a consistent two-column layout. Drop it inside
a flex column to stack multiple rows with even spacing.
Default
import { SketchFormRow, SketchInput } from "blackchalk";<SketchFormRow label="Full name"><SketchInput placeholder="Ada Lovelace" /></SketchFormRow>With description
import { SketchFormRow, SketchInput } from "blackchalk";<div style={{ display: "flex", flexDirection: "column", gap: 24 }}><SketchFormRow label="Email" description="We'll never share your email."> <SketchInput placeholder="you@example.com" /></SketchFormRow><SketchFormRow label="Display name"> <SketchInput placeholder="ada" /></SketchFormRow></div>Props
| Prop | Type | Default |
|---|---|---|
label | string | — |
description | string | — |
children | ReactNode | — |
labelWidth | number | 200 |
See it in the Storybook playground, or read the source.