Component

CalendarSequence

New

The three native selects unlock one another in month–day–year order. Once the sequence is complete, the chosen values become a real date card; changing the month sends the later fields back to intake.

Possible use

It could make a reviewer assemble a handoff deadline in the only order a calendar can tolerate, or let a presenter give an agenda date a tiny filing ritual. The order records ceremony, not correctness.

Reasonable alternative

A reasonable local alternative is one date input or a normal date picker with validation. Three dependent selects should not turn a date into a custody sequence.

01 / Preview

Try it yourself.

No date has survived the sequenceA date waits for its ceremonial order.

01 / Month02 / Day03 / Year

Mechanism

1: Choose a month from the first native select.
2: The day field unlocks only after the month has been filed.
3: Choose a year last to produce the actual date card.
4: Reset order to make the calendar forget its ceremony.

02 / Usage

Put it somewhere.

example.tsxTSX

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

export function SequencedDate() {
  return <CalendarSequence />;
}

03 / API

Small surface area.

PropTypeDescription

(none)Record<string, never>CalendarSequence is self-contained and accepts no conceptual props.