Selection Toolbar
A floating toolbar over selected prose with Improve, Shorten, Explain and Ask, number-key hints, an expanding prompt and a result preview that replaces the selection.
Preview
Select a phrase, or press Alt Space on a selection0 edits
Draft · Q4 planning note
Why we are moving the launch
We have a lot of open questions about billing, and at this point in time it is really hard to make sure every customer gets the right invoice on day one.
Result preview
Moving the date by two weeks gives the support team time to rehearse, and it means we are not shipping a very important change just before the holidays.
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | — | The prose. Keep it static: Replace edits this DOM in place. |
| onAction | (action, text, prompt?) => string | Promise<string> | — | Produces the result for improve, shorten, explain or ask. |
| onReplace | (before: string, after: string) => void | — | Called after a result replaces the selection. |
| actions | ("improve" | "shorten" | "explain" | "ask")[] | all four | Actions in order; the order sets the number keys. |
| editable | boolean | false | Make the region a contenteditable editor. |
| label | string | "Document" | Accessible name of the region. |
| preview | { phrase, action?, result? } | — | Open on a phrase with a drawn highlight (no live selection); with action and result, on the result panel. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.