Component
KeystrokeStack
It counts character keystrokes, stacks the label one symbol at a time, and flattens it again after one extra key.
01 / Preview
Try it yourself.
Focus it, then press one character key per letter. One extra key flattens it.
Mechanism
- 1
- Focus the label and type any character.
- 2
- Repeat until every character is in its own row.
- 3
- Press once more to restore the line.
02 / Usage
Put it somewhere.
example.tsxTSX
import { KeystrokeStack } from "gra-ui";
export function Example() {
return <KeystrokeStack label="Leave this alone" />;
}03 / API
Small surface area.
PropTypeDescription
labelstringThe text stacked one character at a time.