fix(ui): close package-wide gaps from the component library PRs

[EhabY]

🤖 This PR was created by Coder Agents on behalf of @EhabY.

Closes #1046 (all 8 checkboxes) plus the overlays gaps deferred from #1039; list/selection-row tokens stay deferred to the Tree suite (#1037).

Changes

• packages/ui declares its Storybook devDependencies; the root storybook pin moves into the pnpm catalog.
• Tokens: secondary-button colors, --ui-font-size-small, --ui-z-index-overlay, --ui-panel-background for non-sidebar hosts, and VS Code's cornerRadius and spacing scales. Only the spacing rungs components actually use are declared, and the README states the policy for adding more. Metrics VS Code hardcodes natively (button, hover, and menu paddings, the 5px hover radius) stay hardcoded.
• Button matching monaco-text-button, with a secondary variant; the state panels and story triggers use it instead of faking one.
• LoadingState panel reusing the StatePanel skeleton stylesheet, with the large Spinner in the icon slot.
• Menus gain *CheckboxItem, *RadioGroup/*RadioItem, *Label, and *Keybinding, styled like native. Both menus build their styled parts from one shared menuPart factory: the Radix packages create separate menu scopes so the components cannot be shared, but their part props are the same Menu*Props types, so the factory keeps the public types exact and the React Compiler still memoizes what it produces.
• Keybinding hints take a contribution's key/mac/win/linux fields and render the current OS's binding in the native label style (⇧⌘R on macOS, Ctrl+Shift+R elsewhere); formatKeybinding is exported for other surfaces. key is required and the platform fields are overrides, matching VS Code's contributes.keybindings schema, so the formatter is total. VS Code has no API to resolve user-remapped bindings, so hints show contributed defaults (documented known gap).
• useVscodeTheme re-renders on same-kind theme switches: one shared observer, and a snapshot of theme kind plus id that the returned kind is derived from.
• Reduced motion keeps activity cues: striped indeterminate ProgressBar band, Spinner arc over a tinted ring.
• Button parity fixes surfaced by the vscode-elements comparison: focus outlines apply on :focus like native (a click shows the ring; workbench style.css outlines button:focus), a toggled IconButton keeps its active background on hover (native applies checked colors as inline styles in toggle.ts), and IconButton no longer defaults a browser title box (native hints via the styled hover widget; wrap in Tooltip).
• The toolbar button's focus ring now wins over its hover and toggled rings. All three share one outline, so the toggled rule was hiding the ring; natively they never compete, because the ring is an outline while a toggle's active state is an inline borderColor. :where() keeps the exclusions weightless so source order alone decides.
• TooltipProvider becomes a public export mounted once per app, so hovers moving between triggers skip the 500ms delay like native; tooltips cap at half the window height. Tooltip has no per-instance delay prop; nest a provider where a different delay is needed.
• Layout follows StatePanel's precedent: the shared menu module is components/Menu/Menu.tsx with its stylesheet beside it, so components/ holds one folder per component plus the control.css and overlay.css bases, and the keybinding.ts formatter sits with the other package-level modules.

Testing

pnpm typecheck, lint, format:check, test (2222 passed), and storybook:ci pass.

Values were checked against current VS Code source rather than inferred: .monaco-menu uses cornerRadius-large, .action-menu-item and .monaco-action-bar .action-label use cornerRadius-medium, the workbench hover pins a literal 5px radius with 19px leading and a 700px cap, .monaco-menu is min-width: 160px with padding: 0 2em labels and a fadeIn 0.083s, and style.css outlines plain button:focus with outline-offset: -1px while button is deliberately absent from its :active { outline: 0 } list.

Every component has a story, at all four captured themes; StatePanel and Menu are internal. Stories cover the button variants and disabled state, toolbar button default/toggled/disabled, both state panels, all pill tones plus the native badge, spinner sizes, determinate and indeterminate progress, search input filled and disabled, tooltip open and overflowing, and both menus with items, disabled rows, keybinding hints, separators, checkbox, label, radio group, submenu, and a scrolling long menu. The parity story compares the secondary Button and an open menu against vscode-elements.

Three visual cases are knowingly uncovered. Hover, focus, and pressed rings are not snapshotted, because every play function restores the resting state to keep snapshots deterministic, so the focus-ring change above is verified against VS Code source rather than by pixel. The prefers-reduced-motion and forced-colors branches are not reachable from a story, since Pixel's matrix covers themes, color schemes, browsers, and viewports but not emulated media. High-contrast themes are covered and are a different thing from forced-colors: active. Pixel CI will show intended diffs where stories now use Button as the overlay trigger and where the context menu and loading panel render more rows.