Code listing: function MyComponent ({name, SLOT, CLASS}) { return html` <div class='MyComponent ${CLASS}'> <h2>Hello ${name}, this is my component.</h2> <blockquote> ${SLOT} </blockquote> </div> <style> .MyComponent { padding: 1em; border: 1px solid cadetblue; } </style> ` }

Notices where this attachment appears

1. Aral Balkan (aral@mastodon.ar.al)'s status on Tuesday, 28-Mar-2023 21:29:04 JST Aral Balkan

   Web dev folks, I’m implementing the ability to pass classes to components in Kitten and could use your thoughts…

   Passing a class is easy: <${MyComponent} … class='myClass'> (same as any DOM element). However, in the component, you can’t get a property named “class” as that’s a reserved keyword. Even if you could, I’m worried about polluting the prop namespace (we also have “slot”).

   So, I’m thinking, ALL CAPS for special props?

   - Won’t clash
   - Stands out
   - I’m allergic to $ prefixes

   Thoughts?