KQ-1186 · REDLINE/DRAFT
Redline Draft
A status line with an editor at work: each phrase arrives as a rough draft typed in behind a text cursor, then a pen nib, following its marks on springs.flick, strikes weak words through with a swept clip, writes better ones above over a caret, puts a missing word in and curls a filler out. Then the clean version slides into place on springs.glide — struck words and marks fade where they are, kept words glide to their new spots and each written word comes down from above the line as its ink turns to text — and the clean phrase is announced once. The visitor edits too: a drag strikes words under the pointer and a tap or Enter strikes one; a weak word struck is taken and rewritten at once, a good one is marked stet; arrow keys choose the word.
Gaugeworks · Q3 report
editing · 1 of 3 · strike a weak word
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/redline-draft
Props
- phrases
- string[]
- default —
- The status phrases, each drafted, marked up and set clean, cycled in order.
- drafts
- string[]
- default —
- The rough draft each phrase starts as, index for index; a word diff finds the edits. Without it a draft is made from the phrase (weaker word choices, a small word left out, a filler to strike), seeded so the same phrase always gets the same draft.
- active
- boolean
- default true
- Editing. False sets doneText clean in place of the draft and stops; nothing loops.
- doneText
- string
- default —
- What stays once inactive. Defaults to the last phrase.
- speed
- number
- default 1
- How fast the draft is typed, marked up and rested, 0.5 to 2.
- ink
- "red" | "blue" | "green"
- default "red"
- The editor's pen: the danger, accent or success text colour, so every mark reads in both themes.
- marks
- "few" | "many"
- default "few"
- How rough a made draft is: one or two edits, or three or four. Applies from the next phrase; drafts given in drafts are used as they are.
- sound
- boolean
- default false
- Play the scratch of the visitor's strike (following its speed), a tick when an edit is taken or the chosen word moves, and a lower tick for stet. The editor's own marks are silent.
- disabled
- boolean
- default false
- The editor keeps working, but the visitor cannot strike.
- onPhraseChange
- (index: number) => void
- default —
- A phrase began: its index in phrases, or -1 for doneText. Also reported on the first commit.
- className
- string
- default —
- Classes for the root; it is w-full, and the page's height follows its lines.
| Prop | Type | Default | Description |
|---|---|---|---|
| phrases | string[] | — | The status phrases, each drafted, marked up and set clean, cycled in order. |
| drafts | string[] | — | The rough draft each phrase starts as, index for index; a word diff finds the edits. Without it a draft is made from the phrase (weaker word choices, a small word left out, a filler to strike), seeded so the same phrase always gets the same draft. |
| active | boolean | true | Editing. False sets doneText clean in place of the draft and stops; nothing loops. |
| doneText | string | — | What stays once inactive. Defaults to the last phrase. |
| speed | number | 1 | How fast the draft is typed, marked up and rested, 0.5 to 2. |
| ink | "red" | "blue" | "green" | "red" | The editor's pen: the danger, accent or success text colour, so every mark reads in both themes. |
| marks | "few" | "many" | "few" | How rough a made draft is: one or two edits, or three or four. Applies from the next phrase; drafts given in drafts are used as they are. |
| sound | boolean | false | Play the scratch of the visitor's strike (following its speed), a tick when an edit is taken or the chosen word moves, and a lower tick for stet. The editor's own marks are silent. |
| disabled | boolean | false | The editor keeps working, but the visitor cannot strike. |
| onPhraseChange | (index: number) => void | — | A phrase began: its index in phrases, or -1 for doneText. Also reported on the first commit. |
| className | string | — | Classes for the root; it is w-full, and the page's height follows its lines. |