Proposal: Ref Forwarding on all Components

[emplums]

Description

It's become clear through our collaboration with other teams that setting up ref forwarding on each component would make Primer React Components a lot more convenient to work with. Previously, we've added ref forwarding to components on an as-needed basis, but as Primer React Components begins to be used in more complex applications, it's harder to predict which components will need ref forwarding.

Plan of Action

I'm proposing that we refactor one component at a time and have a PR for each component so we don't miss anything in the review process as some components may take a bit of refactoring.

I would prefer to do all of the components in one big release, but since most of the DS Engineers are working on deadline intensive projects at the moment and I'd like close eyes on each PR, I am planning on doing a batch of high priority components in one major release, and then the rest of the components in another release later when we have more resources for reviewing all the PRs/helping refactor components.

First Batch of Components

• all SelectMenu Components
• Buttons
• Box (since some other components are based on Box, I think we'll need to set ref forwarding on Box so ref gets passed down properly)

[mattcosta7]

I'd love to +1 here

Currently, it would be awesome if I could set refs on all componentry in ActionLists to support adding drag/drop functionality to an ActionList.

Ideally i'd be able to set a ref to the list itself, as well as any items and/or groups thereof.

This likely requires a custom wrapper around components like ActionList.Item to create the ref via a useRef, but this would make it much easier to maintain proper accessibility and behaviors that rely on the implementation of these items

[github-actions]

Hi! This issue has been marked as stale because it has been open with no activity for 180 days. You can comment on the issue or remove the stale label to keep it open. If you do nothing, this issue will be closed in 7 days.