adobe / adobe/spectrum-web-components
[Feat]: Allow to dynamically change "dismissible" state of overlay (for pointerevents)
- Dominant language
- TypeScript
- Stars
- 1.5k
- Forks
- 262
- Avg merge
- 3d 10h
- Merged PRs (30d)
- 68
Description
### Code of conduct
- [X] I agree to follow this project's code of conduct.
### Impacted component(s)
Overlay
### Description of the requested feature
Following use case:
The user opens a popover in an overlay that normally dismisses on click outside the overlay => for example with `type="auto"`.
When user interacts with the popover content - a state is created where dismissing by clicking outside should be prevented.
For example: We have a ColorPicker opens with type="auto" that should (by default) be dismissible - but inside there is an eyedropper action button - once it's clicked - the user should be able to pick colors from outside the ColorPicker without dismissing it (not closing on outside click).
Either we need the ability to change the overlay type from `auto` to `manual` when the overlay has been opened - or we might dynamically add an `skip-dismissible` attribute to keep the overlay open.
### Mockups or screenshots
_No response_
### Implementation notes or ideas
_No response_
Contributor guide
Research direction
Start at the Overlay component entry point and review how type="auto" handles outside-pointer dismissal. Reproduce the ColorPicker/eyedropper scenario described in the issue; done means an opened overlay can switch to non-dismissible behavior during that interaction and restore its default dismissal behavior afterward.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100