Intent to Prototype: Slotted Options for <select>

18 views

Skip to first unread message

Fernando Fiori

unread,

5:37 PM (3 hours ago) 5:37 PM

to blink-dev, Leo Lee, Chris Holt

Contact emails

ffi...@microsoft.com

Explainer

https://open-ui.org/components/select.slotted.option

Specification

No information provided

Summary

Enables HTML <select> elements to recognize options, option groups, separators, and trigger buttons supplied through slots or descendant shadow trees. These elements behave like direct descendants, letting developers build reusable select components without having to copy options or reimplementing native behavior.

Blink component

Blink>DOM

Web Feature ID

Missing feature

Motivation

Web component authors cannot wrap a native <select> element and let component users provide <option> elements through a <slot> because the select does not recognize those options. Developers must move or copy options into the select and keep them synchronized with extra code, or rebuild the native select element from scratch (see https://open-ui.org/components/select.slotted.option/#stakeholder-feedback--opposition). Recognizing options (and <optgroup>, <hr>, and <button>) in the select's flat tree lets developers wrap the native select in a component instead of having to go through complex workarounds.

Plan to explore expanding this solution to other elements that are having the same kind of issue nowadays if this goes well.

Initial public proposal

https://github.com/whatwg/html/issues/11535

Search tags

select, option, slot

Goals for experimentation

None

Requires code in //chrome?

False

Tracking bug

https://issues.chromium.org/issues/40236878

Estimated milestones