solid-styled-jsx

Say I style a component And I use it I would expect that the shared style would be extrapolated into a single element on the dom, but instead it is repeated over and over again inside of every button I think the solution is to use a css outside of the component, but there doesn't seem to be a way to do that with solid-styled-jsx. Eg, for regular styled-jsx you would go:

" styled is not a function (While processing: "\\node_modules\\solid-styled-jsx\\babel.js") Could it be because there are outdated dependencies? I installed with --force I'm using Parcel and the babel.js in the plugin say's it's needed for "parcel/codesandbox had issues with preset so we have this monstrosity." but I'm not planning on using codesandbox, so is there an alternative babel file? As I tried many alternatives without a solution. https://github.com/solidjs/solid-styled-jsx/blob/main/babel.js If I should not be using parcel, please offer a suggestion where I can add plugins to .babelrc My package.json

I've been taking solid-styled-jsx for a test run in porting an app from Vue to Solid (easy to copy/paste styles from `` that way). I'm encountering an issue where this template, produces this output in the DOM: