components

930 B

1. // ONE CSS CUSTOM PROPERTY, declared as a value: `bg = var('#FFF')` in a styles file
2. // (`import { var } from 'hl:web/css'`). The sheet walker (css.hl) gives it its NAME
3. // from the member it is bound to, writes `--bg: #FFF` into the sheet's one `:root`,
4. // and every use — `color = bg`, or inside a composed value `'1px solid ' + rule` —
5. // becomes `var(--bg)`. Inside a composed value the name is not known yet (the
6. // string is built when the styles file is constructed, before the walker names
7. // anything), so the text carries a PLACEHOLDER by id that the walker replaces.
8. value = null // the declared value, as written
9. dark = null // the value under prefers-color-scheme: dark, or null
10. Number id = 0 // minted at construction; the walker maps id → name
11. name = null // set by the walker from the member that holds it
13. __toString() {
14. return 'var(--hlv' + id + ')'
15. }