Marko Version: 6.0.50

Details

As described in the docs for <style>:

If the <style> tag has a Tag Variable, it leverages CSS Modules to expose its classes as an object.

In my usage, I've found this works at build/runtime, but I see TypeScript type errors (at least in VSCode) when accessing those properties. For instance, in this snippet from the documented example:

<style/styles>
  .foo {
    border: 1px solid red;
  }
</style>

<div class=styles.foo/>
//                ^ Property 'foo' does not exist on type '() => HTMLStyleElement'

Expected Behavior

Ideally: since <style> as a Tag Variable is compiled as a CSS module, it would be very nice if the specific exports were exposed in generated types.

Pragmatically: it makes sense that the <style> Tag Variable's type could be expressed as Record<string, string> (perhaps as an intersection with () => HTMLStyleElement?).

Actual Behavior

As above, accessing properties on the <style>'s Tag Variable produces TypeScript type errors.

(Well, to be pedantic… since the variable is typed as a function, accessing a function's properties does not produce type-level errors. I haven't checked the runtime behavior for that, but I could imagine…!)

Possible Fix

I'll open a PR shortly!