Component

AlphabeticalQueue

Each label must be selected in the next alphabetical position. Correct choices leave the board and enter a visible manifest, while an early selection is rejected and leaves the queue unchanged.

Possible use

It could make a reviewer file handoff fields in alphabetical order, or let a presenter reveal agenda labels according to a dictionary nobody consulted. The sequence imposes an order unrelated to meaning.

Reasonable alternative

A reasonable local alternative is sorting the array once and rendering it, or preserving the author’s intentional order. A queue should not turn an ordinary sort into a timed admission ceremony.

01 / Preview

Try it yourself.

The manifest is waiting for A.

Mechanism

1: Begin with four labels in a deliberately unhelpful order.
2: Select the next label alphabetically; an early choice is rejected.
3: Watch the manifest build itself one letter at a time.

02 / Usage

Put it somewhere.

example.tsxTSX

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

export function OrderedFields() {
  return <AlphabeticalQueue items={["Status", "Owner", "Title"]} />;
}

03 / API

Small surface area.

PropTypeDescription

itemsreadonly string[]The labels that must be admitted in alphabetical order.