I'm trying to use the new JSX implementation but encountered this error for home page. Can anyone help?

[pranavcpawar]

[Montoya]

Are you using Flask version 12? It hasn't released yet so you would have to get it from a pre-release build.

[Montoya]

Hi, I apologize for not seeing your questions before. I would recommend following the code examples here to make sure you have the right syntax: https://docs.metamask.io/snaps/features/custom-ui/with-jsx/

Also, I don't think the Checkbox component is available yet. You should only be using the components on that page ^

[Montoya]

@ziad-saab can follow up if you are still stuck

[ziad-saab]

Hey @pranavcpawar happy to help! It's been a while since you've chimed in here, so please let me know where you're at and what I can help with.

[pranavcpawar]

hey @ziad-saab sir,
'Box' cannot be used as a JSX component. Its type 'SnapComponent<BoxProps, "Box">' is not a valid JSX element type. Type 'SnapComponent<BoxProps, "Box">' is not assignable to type '(props: any, deprecatedLegacyContext?: any) => ReactNode'. Type 'SnapElement<BoxProps, "Box">' is not assignable to type 'ReactNode'. Property 'children' is missing in type 'SnapElement<BoxProps, "Box">' but required in type 'ReactPortal'.ts(2786) index.d.ts(378, 9): 'children' is declared here.
all the JSX components are giving this error prompt but UI is working fine inside snap

[pranavcpawar]

hey @ziad-saab sir, the current template-snap-monorepo is bootstrapped with Gatsby. Can u provide a NextJs or Vite implementation of the same?