Fork me on GitHub
#squint
<
2024-02-15
>
dobladez18:02:34

newbie question: I'm trying to generate #jsx using tags with a hyphen in their names... Squint replaces the hyphen by underscore (say :my-button becomes _jsx("my_button", { .. Is there special syntax? or flag? workaround? Thanks!!!

borkdude19:02:47

I don't think you can normally write JSX with hyphens in JS right?

<Foo-Bar></Foo-Bar>
would be invalid I think

borkdude19:02:55

for this reason the symbol is munged

borkdude19:02:29

What does your entire example look like?

dobladez19:02:57

you can, I think, in lowercase (like )

dobladez19:02:52

I took, you SolidJS example, changed it minimally to generate a tag with hyphen (that's always the case when using custom-elements/web components)

borkdude19:02:04

how do you define a function with that name then?

borkdude19:02:22

full example would be appreciated

dobladez19:02:31

you don't, the HTML tag ends up being literally <my-button>

borkdude19:02:04

but... that isn't a real HTML tag, right?

dobladez19:02:29

it is, it's a custom element (the webcomponents standard)

dobladez19:02:03

honestly, I have no example other then you SolidJS example, and changed the "button" there with "my-button", that's it 🙂

borkdude19:02:35

an example from the wild where they use this name would be helpful

dobladez19:02:24

any usage of web components is like that: minimal example from the react docs: (see <x-search>) https://legacy.reactjs.org/docs/web-components.html

dobladez19:02:06

gotta leave now, but if you want me to create a concrete example, I will

borkdude19:02:32

what does web components have to do with solidjs exactly?

borkdude19:02:47

yeah ok, that example is helpful

borkdude19:02:08

as long as I have an example of JSX that shows you can use hyphens. It didn't work for me in the playground

dobladez19:02:28

nothing... I was just starting to play with squint, with the goal of coding a SolidJS component, make use of 3rd party web components (which contain a dash)

borkdude19:02:04

it makes sense to me now, thank you. so the rule should be that lower case things should not be renamed? and that function components always start with a capital?

dobladez19:02:01

I believe that's right

dobladez19:02:21

thank YOU!

👍 1
borkdude19:02:21

ok, will have a look at that tomorrow then

borkdude12:02:45

ah wait, this is only about keywords? yes, it makes a lot of sense not to munge keywords!

borkdude12:02:49

even easier to implement then

dobladez12:02:49

ahh yes! just keywords! 🙂

borkdude13:02:29

should work with 0.6.93

🙌 1
dobladez13:02:40

thanks again!