Adds RefPickerV1Correct, a reusable git-ref picker: a button opening an
anchored panel with two tabs (Branches/Tags), one shared search input that
filters the active tab's list, per-tab result counts, and single selection.
The stable SelectPanel renders a fixed internal layout (header -> notice ->
internally-owned FilteredActionList) with no content slot and an internally
generated listbox id, so a correct APG tab -> tabpanel -> listbox association
cannot be wired through its closed API. This component is therefore built on
the public AnchoredOverlay primitive + useFocusZone, re-implementing the
overlay content, shared filter input, listbox and its focus management.
ARIA: tab(aria-controls=panel) -> tabpanel(aria-labelledby=tab) -> listbox
(aria-labelledby=tab) -> option(aria-selected); the shared combobox input's
aria-controls points at the active listbox with focus-zone-managed
aria-activedescendant.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
github-actions
Bot
added
the
integration-tests: recommended
Draft — not for merge. Part of a spike comparing how a tabbed SelectPanel (Branches / Tags, one shared search) gets built across Primer's APIs. Same task, same model (Opus 4.8); the API is the only variable:
SelectPanel, pragmatic (tabs work visually but aren't ARIA-associated)SelectPanel, ARIA correctness forced (the component gets abandoned)SelectPanel(composes correctly, ~35 lines of glue)SelectPanel(composes correctly, zero glue)Same task on the stable
SelectPanel, but with ARIA correctness made non-negotiable (a real tab→tabpanel→listbox relationship). The agent abandoned the stableSelectPanelentirely — it can't express this — and rebuilt the overlay/listbox/combobox/tabs on lower-level primitives (AnchoredOverlay,useFocusZone): ~282 lines, ~40% of it re-implemented SelectPanel internals.See
packages/react/src/SelectPanel/examples/RefPickerV1Correct.tsx. This shows what correctness costs on the closed API: the component contributes essentially nothing.