[csswg-drafts] [css-ui] Pseudo-element for select's UA popover (#10758)

josepharhar has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-ui] Pseudo-element for select's UA popover ==
Customizable `<select>` will have a popover element inside the UA shadowroot for the picker. We need a pseudo-element to target this element, and it needs a name and some supported capabilities.

We recently discussed removing the capability for the author to provide their own popover element as a `<datalist>` in OpenUI [here](https://github.com/openui/open-ui/issues/1082), which means that this pseudo-element will only be for the UA shadowroot popover rather than possibly also being for an author-provided element.

For the name, the chromium prototype implementation currently has `::select-fallback-datalist` (this name would need improvement), but I imagine based on [this issue](https://github.com/w3c/csswg-drafts/issues/10440) that some people would like for it to be called `::picker(select)`.

One capability which I know will be needed is popover / top layer animations. In order to support this, we need this pseudo-element to support the `:popover-open` pseudo-class and some other things so that the following code works when in base appearance mode:
```css
select::select-fallback-datalist {
  transition: display 1s allow-discrete, overlay 1s allow-discrete, opacity 1s;
  opacity: 0;
}

select::select-fallback-datalist:popover-open {
  opacity: 1;
}
@starting-style {
  select::select-fallback-datalist:popover-open {
    opacity: 0;
  } 
}
```

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10758 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 19 August 2024 16:39:48 UTC