Component
EdgeExchange
Exchange edges to rotate each word’s outside characters while preserving its middle. The rendered label changes into a deterministic, reversible near-sentence; restoring it returns the exact original wording.
Possible use
It could let a reviewer scramble the edges of a handoff line to test whether its middle remains recognizable, or let a presenter create a temporary editorial artifact from an agenda phrase. Neither use makes the copy clearer.
Reasonable alternative
A reasonable local alternative is keeping the label intact and applying a one-off string transform only for an actual text experiment. A reusable edge exchange should not supervise ordinary wording.
01 / Preview
Try it yourself.
Displayed label
Keep the handoff readable
Mechanism
- 1
- Start with a phrase whose word edges are behaving normally.
- 2
- Exchange the first and last character of every word in one operation.
- 3
- Restore the exact wording when the transformed sentence stops helping.
02 / Usage
Put it somewhere.
example.tsxTSX
import { EdgeExchange } from "gra-ui";
import "gra-ui/styles.css";
export function ExchangedNotice() {
return <EdgeExchange label="Keep the handoff readable" />;
}03 / API
Small surface area.
PropTypeDescription
labelstringThe phrase whose word edges are exchanged.