New draft of appearance:base spec

[mfreed7]

...has been published here:

https://drafts.csswg.org/css-forms-1/

This is a meta-issue to bring this over to OpenUI and ask for feedback generally. In particular, issues should be filed at CSSWG for problems, missing features, etc.

[lukewarlow]

Fwiw I'm working on a set of custom elements that implement at least the styling and layout from the new draft (even if not perfect on the interactivity etc). https://codepen.io/collection/wkkNLz - hopefully will make evaluating various aspects easier.

[css-meeting-bot]

The Open UI Community Group just discussed New draft of appearance:base spec.

The full IRC log of that discussion

<masonf> scribenick: masonf
<masonf> lwarlow: there's a draft up, please take a look, open issues if needed.
<lwarlow> https://drafts.csswg.org/css-forms-1
<masonf> Many issues have been opened already: https://github.com/w3c/csswg-drafts/issues?q=is%3Aissue%20state%3Aopen%20label%3Acss-forms-1
<sorvell> q+
<masonf> lwarlow: note the URL, there's a bad one that is out of date.
<keithamus> ack sorvell
<masonf> sorvell: I hadn't seen the issues, I'll look. Two points. Control value function is interesting. It should have different units.
<masonf> sorvell: presumably if min is 10, max is 110, value is 20, then percent does something good if you ask for percent. Needs calculations to be defined.
<masonf> keithamus: I don't think I saw that issue tracked anywhere - please raise it.
<masonf> sorvell: it needs different units, and the units needs to be useful. Min/max make that interesting.
<masonf> sorvell: would love opinions for css-forms-2, we spent years working on <select>, there are inputs with popups, like date/color, and they're unusable. People make their own.
<lwarlow> q+
<masonf> sorvell: I wonder if that should be level 2 or not? It's a huge can of worms, but important.
<keithamus> ack lwarlow
<masonf8> lwarlow: control value needs work. Meter and progress might be workable.
<frehner> q+
<masonf8> lwarlow: regarding pickers, css-forms-1 will be for in-page controls only.
<masonf8> (My internet is back. Yay.)
<masonf8> lwarlow: pickers need to be done one-by-one, color might be "simplest" (quoted added by scribe)
<masonf8> lwarlow: datalist should be done soon. Needs to be a popover that can be styled. Could be a quick win.
<masonf8> lwarlow: color picker, might be worthwhile adding things to the builtin one first, like alpha. Can be done now in WebKit. Maybe not stylable, but more usable.
<masonf8> lwarlow: We here need to decide what percentage of use cases we want css-forms-1 to handle. 75% might be doable without doing complicated things.
<masonf8> q+
<keithamus> ack frehner
<masonf8> sorvell: {missed, sorry}
<masonf8> frehner: validation popups would be nice to be stylable also
<keithamus> s/{missed, sorry}/date is likely very valuable but also the hardest
<jarhar> masonf8: there are no issues for validation popups, making them popovers would be the way to do it
<jarhar> masonf8: what percent of the use cases do we think need to be solved?
<jarhar> masonf8: its a rough number, but 75% seems low to me
<jarhar> masonf8: redesigning this thing and leaving out 25% of the use cases feels not great to me
<jarhar> masonf8: it will be 2045 before we do this again
<jarhar> masonf8: i want that to be 95%
<jarhar> masonf8: all the issues i opened are along those lines: you can do this and thats great, but you cant do xyz
<keithamus> q?
<masonf8> ack mason
<lwarlow> https://github.com/w3c/csswg-drafts/issues/7172
<masonf8> lwarlow: I had some ideas about validation messages.
<masonf8> lwarlow: doesn't handle rich content
<masonf8> lwarlow: question about what people need. Maybe content attribute not needed.
<masonf8> lwarlow: making them work inline vs. as popovers is interesting also. Comes back to open discussions about <select>.
<scott> q+
<masonf8> lwarlow: quite common to have date picker in the page. If we did the work to redesign date picker, and forced to use it as a popover, that would suck.
<masonf8> lwarlow: for <select> we already have `size`, so maybe we could use that later or whatever.
<masonf8> lwarlow: we should have the discussion about the percentage of use cases. Once there's a prototype, we'll know more.
<masonf8> ack scott
<masonf8> scott: question: date picker or form validation popups - can those even be customimzable in the DOM?
<masonf8> scott: {missed sorry}
<masonf8> scott: maybe they can be styled or forced to render, but not like <Select> where it's possible to add content.
<masonf8> lwarlow: maybe you could use the content attribute to replace the (text) content. Beyond that, just styling.
<sorvell> q+
<masonf8> lwarlow: error popups - we should have a way to expose the string the browser makes. People want to put those strings somewhere else.
<masonf8> lwarlow: then you don't need to define composability.
<masonf8> scott: for some of these things, the browser popups for error messages are treated as alerts. Pretty bad for a11y. You hear it once, then if you move away, it's gone.
<masonf8> scott: hopefully you make it accessible somehow, because this work will encourage more use.
<masonf8> lwarlow: fair point, let's open an issue.
<masonf8> someone please comment on https://github.com/w3c/csswg-drafts/issues/7172 with this stuff!
<masonf8> lwarlow: openui can work on the tricky stuff.
<keithamus> q?
<masonf8> scott: datalist was mentioned - I'd love if that was handled first. Some of you were pinged on a conversation about that. I made a large comment there.
<masonf8> ack sorvell
<masonf8> sorvell: Mason that was a good challenge about percentages of use cases. I wanted to say date picker is high value and also high difficulty.
<keithamus> Zakim, close queue
<Zakim> ok, keithamus, the speaker queue is closed
<masonf8> sorvell: not being able to muck with the DOM there seems bad. AirBNB, Google travel, all have these things. All airlines. Etc.
<lwarlow> q+
<masonf8> lwarlow: Stuff like ranges for date selection. Not predicated on having composition in the UI. HTML would need changing to account for that. So adding alpha to color, we can add things like that without doing the difficult work. If we had a range attribute on input type=date, and you get two values, that's valuable.
<masonf8> lwarlow: excluding specific values, quite common to be able to do that.