Component

IndexCipher

Apply index cipher to replace the readable label with a real reversible transformation: word one shifts by one letter, word two by two, and so on. Restore wording returns the supplied text exactly.

Possible use

It could let a reviewer turn a handoff sentence into a position-dependent cipher specimen, or let a presenter make an agenda label progressively less readable before restoring it. Neither use makes copy safer.

Reasonable alternative

A reasonable local alternative is keeping the label readable and applying a local encoding function only at a real protocol boundary. A display component should not encrypt a sentence for atmosphere.

01 / Preview

Try it yourself.

Visible wording

Prepare the remarkably ordinary handoff

Mechanism

1: Apply the cipher to the readable sentence.
2: Word one shifts by one letter, word two by two, and so on.
3: Restore the exact wording when the index has over-explained itself.

02 / Usage

Put it somewhere.

example.tsxTSX

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

export function IndexedLabel() {
  return <IndexCipher label="Prepare the ordinary handoff" />;
}

03 / API

Small surface area.

PropTypeDescription

labelstringThe sentence whose words are shifted by their one-based position.