Import SendButton from @prepared911/ui/send-button.
- The host is a native
button, type="button" unless type says otherwise. Its accessible name is label, rendered once through VisuallyHidden; the icon is aria-hidden.
- Pending sets
aria-busy="true" and aria-disabled="true" and not disabled, so the button stays in the tab order and keeps focus. Clicks, Enter and Space are ignored while it is pending. The accessible name is pendingLabel.
- A visually hidden
output element (implicit role="status", a polite live region) announces pendingLabel when the send starts and is empty at rest. Nothing is announced on mount.
- Disabled and pending are not shown by color alone: a disabled button paints the disabled foreground on a disabled surface, and a pending one swaps the arrow for a spinner and shows the progress cursor.
- A pointer press never moves focus off the composer's input. Enter or Space on the focused button sends, and
restoreFocusTo returns focus to the input.
- Reduced motion swaps the arrow and the spinner at once (only the current icon is mounted) and stops the spinner turning. The pending name and the spinner glyph still show.
- Forced colors: the button follows Button's system colors and the arrow follows its text color.
- Disabled:
disabled is native, and a disabled fieldset disables the button.
- Right to left: the up arrow is not directional and does not mirror. The spinner turns clockwise in both directions.