adobe / adobe/react-spectrum

RFC: Ability to provide selection trigger for Card

Open
#5,914 2 comments 0 reactions 0 assignees View on GitHub
CardView spectrum design
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

### Provide a general summary of the feature here

Currently, the Card component only allows a Checkbox for selection in a CardView. In order to prepare for new designs, allow users to trigger a selection with a custom trigger such as a ToggleButton.

### 🤔 Expected Behavior?

Allow user to provide a selection trigger according to their own designs, while ideally maintaining accessibility patterns for the trigger.

### 😯 Current Behavior

Currently the CardBase uses a Checkbox component for selection. This option is difficult to override since the Checkbox is used directly in the CardBase component.

### 💁 Possible Solution

There are a few different routes that can be taken here I think:
* Separate out the Card from the selection trigger; can possibly use and expose hooks like useCard, useSelectionTrigger
* Create an additional CardBase component with a ToggleButton at the bottom?
* Other ideas I'm not thinking of

### 🔦 Context

We currently have designs that use a card grid with a toggle button for selection. In order to implement these designs, we would have to re-invent the wheel in order in order to correctly implement accessibility patterns. Making room for a custom selector would help us move forward and also move this component forward in terms of emerging designs.

### 💻 Examples

Here is an example of the design:

Screen Shot 2024-02-20 at 2 46 47 PM

### 🧢 Your Company/Team

Adobe / Agora squad

### 🕷 Tracking Issue

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.