fix(Spinner): prevent keyboard focus on hidden children via inert att…

[kimiaShahbaghi]

Description

When loading is true and children are provided, Spinner wraps the children in a hidden span to preserve the button's size during the loading state:

<span aria-hidden style={{ display: 'contents', visibility: 'hidden' }} inert={undefined}>
  {children}
</span>

inert={undefined} in React removes the attribute from the DOM entirely — it is a no-op. This means any focusable element passed as a child (a button, link, input, etc.) can still receive keyboard focus via Tab while it is visually hidden and removed from the accessibility tree.

The codebase already has a purpose-built helper at src/helpers/inert.ts that handles the React 18 vs 19 difference for the inert attribute. It is used correctly in both Skeleton and ThemePanel. Spinner is the only loading component that doesn't use it.

This PR replaces inert={undefined} with inert={inert} (the existing helper), consistent with the pattern already in skeleton.tsx.

Testing steps

1. Run pnpm dev and open http://localhost:3000/sink
2. Find a Button with a loading spinner that has focusable children (or create one):

   <Spinner loading>
     <button>Inner button</button>
   </Spinner>

3. Before: pressing Tab while loading could land focus on the hidden inner button
4. After: the hidden children are fully inert — Tab skips them entirely

Relates issues / PRs

N/A

[vercel]

@kimiaShahbaghi is attempting to deploy a commit to the WorkOS Team on Vercel.

A member of the Team first needs to authorize it.