adobe / adobe/react-spectrum

ColorSwatchPicker always selects `#000` when in "unselected" state.

Open
#7,918 1 comment 0 reactions 0 assignees View on GitHub
bug
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

### Provide a general summary of the issue here

If the Swatch contains color `#000`, there is no way to unselect it.

This is due to: https://github.com/adobe/react-spectrum/blob/main/packages/react-aria-components/src/ColorSwatchPicker.tsx#L44

See CodeSandBox link at bottom for a better explanation.

### 🤔 Expected Behavior?

The value should accept `null` or `undefined` and properly handle that.

### 😯 Current Behavior

```


```

Will show `#000` as selected.

### 💁 Possible Solution

The value should accept `null` or `undefined` and properly handle that.

### 🔦 Context

I have a `ColorSwatchPicker` where the list of colors is user defined. I know the hacky workaround is to just set the value to a non-existent color in the list, but that's very wrong.

### 🖥️ Steps to Reproduce

Here's a CodeSandBox outlining a couple issues with the current implementation:

https://codesandbox.io/p/sandbox/exciting-waterfall-h66ngf

### Version

latest

### What browsers are you seeing the problem on?

Other

### If other, please specify.

all

### What operating system are you using?

mac

### 🧢 Your Company/Team

_No response_

### 🕷 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.