Selection actions
Controlled workflow for applying an instruction to selected text, then accepting, rejecting, or retrying its result.
Loading interactive example
Use SelectionActions for a controlled edit to selected text. Keep the selection visible. Show a preview before acceptance. Preserve errors until retry or rejection. Supply one announcement for each semantic transition. New results animate on entrance. Focus moves to the heading immediately. Reduced motion removes the animation.
API
Inherited prop contracts
Omit<HTMLAttributes<HTMLDivElement>, 'children'>Props from this native base are accepted except the listed members.
| Member | Type | Kind | Required | Default |
|---|---|---|---|---|
anchorId | string | prop | No | undefined |
announcement | string | prop | No | undefined |
error | Snippet | snippet | No | undefined |
instructions | readonly SelectionInstruction[] | prop | Yes | |
labels | SelectionActionsLabels | prop | Yes | |
onAccept | () => void | callback | Yes | |
onInstruction | (instruction: SelectionInstruction) => void | callback | Yes | |
onReject | () => void | callback | Yes | |
onRetry | () => void | callback | Yes | |
preview | Snippet | snippet | No | undefined |
selectedText | string | prop | Yes | |
state | SelectionActionsState | binding | No | 'idle' |
Examples
Source
Loading source