Components
Tab
SketchTab — a hand-drawn tab button with an animated active indicator.
SketchTab renders a single tab button. When active is true it bolds the label,
lifts it slightly, and draws a rough.js underline that slides between tabs via a
shared layoutId. Compose several tabs in a flex row and toggle active to wire
up navigation.
Active tab
import { SketchTab } from "blackchalk";<div style={{ display: "flex", width: 320 }}><SketchTab active>Overview</SketchTab><SketchTab>Activity</SketchTab><SketchTab>Settings</SketchTab></div>Props
| Prop | Type | Default |
|---|---|---|
active | boolean | — |
onClick | () => void | — |
children | ReactNode | — |
style | CSSProperties | — |
See it in the Storybook playground, or read the source.