HTML to JSX

astro.config.mjs

@@ -11,4 +11,7 @@ export default defineConfig({
       transformer: 'lightningcss',
     },
   },
+  build: {
+    assets: '_fwt',
+  },
 })

fwt/components/HTML/HTML.tsx

@@ -1,10 +1,11 @@
 import './HTML.sass'
+import type { JSXElement } from 'solid-js'
 
 interface Props {
   title: string
   name: string
   description: string
-  children: HTMLElement
+  children: JSXElement
   font?: string
 }
 

src/pages/index.astro

@@ -21,7 +21,7 @@ import PA2 from '../../fwt/images/pat-alcala.webp'
     </Link>
 
     <h1>Fast WebApp Template</h1>
-    <Counter client:load />
+    <Counter client:idle />
     <Button edges="rounded" label="FWT Components" to="/next" />
 
     <Footer>

src/pages/next.astro

@@ -16,7 +16,6 @@ import Column from '../../fwt/components/Column/Column'
     <Button edges="rounded" label="Back to Home" to="/" />
 
     <section class="image">
-      <!-- <OptimizeImage src="batman.png" size={400} /> -->
       <Row content="center" gap={1}>
         <Image avif={sample1.src} webp={sample2.src} alt="Example Image" size={400} />
         <Image avif={sample1.src} webp={sample2.src} alt="Example Image" size={400} />