Interactivity

Interactivity utilities control pointer events, manual focus rings, and screen-reader content visibility.

Pointer and cursor

Class	Declaration	Purpose
`pointer-events-none`	`pointer-events: none`	Makes element transparent to clicks
`pointer-cursor`	`cursor: pointer`	Adds hand pointer to non-button elements
`pointer-default`	`cursor: default`	Restores standard arrow cursor

ring applies the system focus ring to custom elements. It uses box-shadow offsets and activates on :focus-visible:

<a href="#" class="ring rounded-md">Keyboard-focusable link</a>

Inactive when unfocused: --_ring-width and --_ring-offset-width sit at 0.
Ring color defaults to --primary; offset uses --ring-offset-color (page background).
A matching transparent outline ensures visibility in forced-colors mode.

sr-only visually hides content while keeping it accessible to screen readers:

<button class="ui-button" data-size="icon">
  <svg aria-hidden="true"><!-- icon --></svg>
  <span class="sr-only">Close dialog</span>
</button>