Component

QuotaProcession

It imposes a strict one-way sequence of per-child quotas: the first piece needs one tap, the next two, the next three and then the pattern repeats. Only the active step can be used, and completed pieces remain visibly filed.

Possible use

It could force a reviewer to tap a title once, a status twice and an owner three times before a handoff card is complete, or make a presenter perform a growing ritual on each agenda label.

Reasonable alternative

A reasonable local alternative is a normal ordered list with one completion button. Per-item tap quotas add ceremony without adding information.

01 / Preview

Try it yourself.

Mechanism

1: Start at Title, which demands one tap.
2: Status demands two taps, Owner three and Date one again.
3: Only the current step accepts input; completed steps stay filed.
4: Return to the first stage when the procession has gone far enough.

02 / Usage

Put it somewhere.

example.tsxTSX

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

export function CeremonialFields() {
  return (
    <QuotaProcession>
      <span>Title</span>
      <span>Status</span>
      <span>Owner</span>
      <span>Date</span>
    </QuotaProcession>
  );
}

03 / API

Small surface area.

PropTypeDescription

childrenReactNodeThe ordered pieces that advance through the repeating one-two-three tap quotas.