Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProAn Add task row that turns into a field in the list itself, adds on Enter, stays open for the next item and closes on Escape or blur with text kept.
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 this when a list is built a line at a time and opening a dialog per item would slow people down: tasks, checklist items, tags, quick notes.
Do not use it when each item needs several fields (use a form or a dialog).
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 | Required | Description |
|---|---|---|---|
items | string[] | required | - |
onAdd | (text: string) => void | Promise<void> | required | Called with the trimmed text of a new item. Throw to keep the text and show the message. |
label | string | optional | Label of the add row and the field. Default "Add task". |
The pattern ships with a Testing Library test (inline-add-item-row.test.tsx) that covers adding several items, empty and duplicate text, Escape focus and a failed add.