Component

VectorRitual

Press the four directional controls in the prescribed order. Each accepted vector moves the cargo around a different corner; a wrong direction returns it to origin, and Reset vectors clears the route.

Possible use

It could let a reviewer rehearse four handoff stages as a compass ritual, or let a presenter walk an agenda line around a slide before releasing it. The route is deterministic but unrelated to readiness.

Reasonable alternative

A reasonable local alternative is a visible checklist with one next action. A directional pilgrimage should not be the hidden workflow for a simple release.

01 / Preview

Try it yourself.

Complete this tiny pilgrimage

Mechanism

1: Press East, South, West, then North.
2: Each accepted vector moves the cargo around one corner.
3: A wrong vector returns the route to origin; reset when the loop closes.

02 / Usage

Put it somewhere.

example.tsxTSX

import { VectorRitual } from "gra-ui";
import "gra-ui/styles.css";

export function PilgrimNotice() {
  return <VectorRitual><span>Complete this tiny pilgrimage</span></VectorRitual>;
}

03 / API

Small surface area.

PropTypeDescription

childrenReactNodeThe parcel moved through the directional sequence.