Component

PressureSeal

Press one impression at a time. Each accepted press adds a real ring to the paper and advances the native progress bar; after four impressions the notice is sealed, and Flatten seal restores the unmarked state.

Possible use

It could let a reviewer add one ceremonial mark per pass to a handoff note, or let a presenter over-certify an agenda line before showing it. Neither use makes the notice more correct.

Reasonable alternative

A reasonable local alternative is one approval status or one ordinary stamp rendered at the point of decision. A progress meter should not make ink feel like evidence.

01 / Preview

Try it yourself.

Preview Interactive
Pressure seal0 / 4 impressions
Ready for one needless certification

Add one ceremonial impression to a perfectly adequate notice.

Mechanism
1
Start with a flat notice and no impressions.
2
Press one impression at a time until four rings accumulate.
3
The paper receives a real seal state; flatten it when the ceremony is over.

02 / Usage

Put it somewhere.

example.tsxTSX
import { PressureSeal } from "gra-ui";
import "gra-ui/styles.css";

export function CertifiedNotice() {
  return <PressureSeal><span>Ready for one needless certification</span></PressureSeal>;
}

03 / API

Small surface area.

PropTypeDescription
childrenReactNodeThe notice that receives four visible pressure impressions.