gra-ui

Component

ContextEscalator

It turns the browser context menu into a four-step escalation ladder. Each right-click records another level, adds a visible paper shadow and leaves the notice fully filed after the fourth context gesture.

Possible use

It could let a reviewer promote a handoff note through progressively more official filing levels, or let a presenter right-click an agenda label until it has earned an entirely ceremonial status.

Reasonable alternative

A reasonable local alternative is one visible status field and a normal button. Making a context menu carry a four-step approval ladder gives a browser gesture far more authority than it deserves.

01 / Preview

Try it yourself.

Preview Ready

02 / Usage

Put it somewhere.

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

export function EscalatedNotice() {
  return <ContextEscalator><span>Needs one decision</span></ContextEscalator>;
}

03 / API

Small surface area.

PropTypeDescription
childrenReactNodeThe notice advanced through the four context-menu levels.