feat: added jsx support and some tests

test.tsx

@@ -0,0 +1,49 @@
+import { h, q, frag, bootstrap, Rung, Capsule } from "./index";
+import {SubNode} from "./lib/helpers";
+
+const MyCoolDiv = (props: { isRed: boolean }, subNodes?: SubNode[]) => h("div", { classes: props.isRed ? ["red"] : [] }, ...subNodes ?? []);
+
+class App extends Rung {
+    private counter = Capsule.new<number>(0);
+    private rungs = Capsule.new<HTMLDivElement | null>(null);
+
+    constructor() {
+        super({});
+        this.counter.watch((count) => {
+            if (this.rungs.val) {
+                this.rungs.val.replaceChildren(
+                    ...new Array(count).fill(null).map((_, i) => {
+                        return <div className={'rung'}/>;
+                    })
+                );
+            }
+        });
+    }
+
+    build() {
+        return <>
+            <style>{`
+.rung {
+    width: 30px;
+    height: 30px;
+    border: solid black;
+    border-width: 0 2px 2px 2px;
+}
+.rung:last-of-type {
+    border-width: 0 2px 0 2px;
+}
+.rung:first-of-type {
+    border-width: 0 2px 2px 2px;
+}
+`}</style>
+            <h1>Ladder</h1>
+            <button onclick={() => this.counter.val--}>-</button>
+            <span>{this.counter}</span>
+            <button onclick={() => this.counter.val++}>+</button>
+            <div saveTo={this.rungs}/>
+        </>;
+    }
+}
+
+const app = new App();
+bootstrap(app, "app");