Sticky
A postit-style note with a stable tilt and colour.
Brand palette shipped
Interviews ran late
Book slots a week ahead
Rota export done
Offline sync for tasks
Move the crew interview notes into one shared document before Friday
Icon audit
In context
Offline sync for tasks
Jonas Weber
Harbour homepage
Maya Chen
Props
| Prop | Type | Required | Default |
|---|---|---|---|
title | ReactNode | Yes | — |
children | ReactNode | No | — |
tags | (string | { label: string; tone?: TagTone | undefined; })[] | undefined | No | — |
onTagClose | ((tag: string) => void) | undefined | No | — |
color | string | undefined | No | — |
seed | string | undefined | No | typeof title === "string" ? title : "sticky" |
activeBorder | boolean | undefined | No | — |
Deterministic
seed (default title) picks the rotation and the pastel colour, so a re-render never reshuffles a board. The ink colour follows the note, not the theme, so it reads in light and dark. Kanban uses this for cardVariant="sticky".
Tags
tags takes strings or { label, tone }. Pass onTagClose and each tag gets a close button.
data-rebar-* attributes
data-rebar-component="sticky" on the root; data-rebar-part is "title", "body" or "tags".
Migrating to Ant Design
Not codemod-covered. AntD has no sticky-note component; reimplement the look or use a plain Card.