Accessibility

Without a title, an icon is aria-hidden and screen readers skip it. When an icon is the only content of a control, a name is required:

tsx

<button aria-label="Settings"><Settings /></button>
// or on the icon
<Settings title="Settings" />

Motion respects prefers-reduced-motion.
With trigger="parent", keyboard focus plays the motion, as hover does.
On touch screens, a tap plays the motion forward and back.
Tap icons such as Bookmark indicate state by colour and shape, and should be paired with text or aria-pressed on the button.