Component
WheelStamp
It turns local scrolling into a real five-step approval progression. Each wheel notch adds a visible seal to the paper and rolling backward removes the most recent one.
Possible use
It could make a reviewer over-certify a handoff note, or let a presenter stamp an agenda label before allowing it onto a slide.
Reasonable alternative
A reasonable local alternative is a progress indicator or no indicator at all. Scrolling should not issue paper authority.
01 / Preview
Try it yourself.
Approve this
Mechanism
- 1
- Start with an ordinary label and no paper seals.
- 2
- Roll over the paper, or focus it and press ArrowUp.
- 3
- Each notch adds one real visible seal, up to five.
- 4
- Roll back or remove the stamps when the paperwork is complete.
02 / Usage
Put it somewhere.
example.tsxTSX
import { WheelStamp } from "gra-ui";
import "gra-ui/styles.css";
export function StampedNotice() {
return <WheelStamp><span>Review me</span></WheelStamp>;
}03 / API
Small surface area.
PropTypeDescription
childrenReactNodeThe content collecting the five visible paper seals.