components-ai / css.gui

Visual development environment for CSS
https://components.ai/css-gui
MIT License
518 stars 24 forks source link

Question: What's the story for integrating with headless UI components (e.g. radix) #45

Open tarngerine opened 2 years ago

tarngerine commented 2 years ago

Radix has great accessible components (e.g. for a Toolbar, Radio, Select, Popover) and I'd love to use it with css.gui — some examples would be great on how to mix match with that (and also how to integrate w a styling library like Stitches or emotion)

johno commented 2 years ago

Great question!

We're working on the inputs having varying levels of abstractions, so there are a few ways CSS GUI could be mix and matched with other inputs like those that Radix offers (which we are also using under the hood). Definitely something we should, and will, document.

For more context, could you elaborate on what you're hoping to achieve? Is it around using some CSS GUI and Radix inputs for other controls in a form/app/UI? Or something different?

Regarding styling, our controls themselves are pretty encapsulated with Emotion/Theme UI. But we can document how the styles can be overridden and even create some type of API to tap into those styles (right now it's mostly driven by a theme object). As they stand, any other styling in an app should be able to be composed with any other solution including Stitches and emotion. They shouldn't clash in any way.

mrmrs commented 2 years ago

As a general principle we would like to support as many formats / libraries / code styles as possible. Mostly want people to be able to explore what's possible with CSS, SVG, and HTML, and then export / publish whatever artifact they need, even if that's a screenshot of the output. So we're open to feedback / requests on what biggest needs are there.