Re: [css-houdini-drafts] [css-properties-values-api] Should property registration be scoped? (#939)

> And so, if we have to uniquify the names anyway, I don't see a strong need to try and address this directly. Some guidance in a spec is probably warranted, but as far as I can tell anything we do to address this will just be codifying some form of uniquifying without any real reduction in typing for the author.

An alternative is lexical namespaces for CSS, [other proposals](https://github.com/w3c/csswg-drafts/issues/3714) have suggested it for other features. For properties specifically I'd imagine something like:

```css
/* In practice the shared definitions would be put into a sheet which the actual shadow DOM
   sheet imports so that importers of this variable don't need to import the whole sheet */
@export @property $myVar {
    syntax: "<color>";
    initial-value: blue;
}

/* Not exported so can't be used outside of this sheet */
@property $local {
    syntax: "<angle>";
    initial-value: 2deg;
}

:host {
    color: var($myVar);
}
```

For users of this component they would reference this name from the sheet:


```html
<style>
    @import-names "custom-element/sheet.css" {
      $myVar;
      /* Also we'd allow renaming like JS
      $someVar: $someLocalName;
       */
    }

    custom-element {
      $myVar: blue;
    }
</style>
```

And this could also integrate into the CSS module feature (just shipped in Chrome) so it would be usable from JS:

```js
import { myVar } from "./sheet.css";

element.style.setProperty(myVar, "green");
element.attributeStyleMap.setProperty(myVar, "green");
```

-- 
GitHub Notification of comment by Jamesernator
Please view or discuss this issue at https://github.com/w3c/css-houdini-drafts/issues/939#issuecomment-915423665 using your GitHub account


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

Received on Wednesday, 8 September 2021 17:18:14 UTC