Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA text area with a ring that fills toward a word goal, the count beside it and a goal-reached state, all mirrored in text.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it in a writing tool with a target length: a brief that asks for 800 words, a bio capped at 60.
Do not use it when: there is no target: show a plain count.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
goal | number | required | The target word count. |
defaultValue | string | "" | Starting text. |
label | string | "Draft" | The textarea label. |
The ring is a progressbar with min, max and the current value; the count is a polite live region in text; the goal-reached state is words, not only the ring colour.
The pattern ships with a test (word-count-goal-ring.test.tsx). It covers counting and the progressbar value.