npm - @torpor/view - Versions diffs - 0.0.14 → 0.1.1 - Mend

@torpor/view 0.0.14 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (276) hide show

package/test/if/components/output/IfElseIf-client.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+import $watch from "../../../../src/render/$watch";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
 import t_anchor from "../../../../src/render/nodeAnchor";
@@ -18,7 +19,7 @@ export default function IfElseIf(
 	// @ts-ignore
 	$slots?: Record<string, SlotRender>
 ) {
-	$props ??= {};
+	$props ??= $watch({});
 	/* User interface */
 	const t_fragments: DocumentFragment[] = [];
@@ -37,7 +38,7 @@ export default function IfElseIf(
 				// @ts-ignore
 				const t_root_1 = t_root(t_fragment_1);
 				// @ts-ignore
-				const t_text_1 = t_next(t_next(t_root_1));
+				const t_text_1 = t_next(t_root_1, 2);
 				t_add_fragment(t_fragment_1, t_div_1, t_before);
 				t_next(t_text_1);
 			});
@@ -48,7 +49,7 @@ export default function IfElseIf(
 				// @ts-ignore
 				const t_root_2 = t_root(t_fragment_2);
 				// @ts-ignore
-				const t_text_2 = t_next(t_next(t_root_2));
+				const t_text_2 = t_next(t_root_2, 2);
 				t_add_fragment(t_fragment_2, t_div_1, t_before);
 				t_next(t_text_2);
 			});
@@ -59,7 +60,7 @@ export default function IfElseIf(
 				// @ts-ignore
 				const t_root_3 = t_root(t_fragment_3);
 				// @ts-ignore
-				const t_text_3 = t_next(t_next(t_root_3));
+				const t_text_3 = t_next(t_root_3, 2);
 				t_add_fragment(t_fragment_3, t_div_1, t_before);
 				t_next(t_text_3);
 			});

package/test/if/components/output/IfElseIf-server.ts CHANGED Viewed

@@ -7,6 +7,7 @@ export default function IfElseIf(
 	// @ts-ignore
 	$slots?: Record<string, ServerSlotRender>
 ) {
+	$props ??= {};
 	/* User interface */
 	let $output = "";

package/test/if/components/output/IfNested-client.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+import $watch from "../../../../src/render/$watch";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
 import t_anchor from "../../../../src/render/nodeAnchor";
@@ -18,7 +19,7 @@ export default function IfNested(
 	// @ts-ignore
 	$slots?: Record<string, SlotRender>
 ) {
-	$props ??= {};
+	$props ??= $watch({});
 	/* User interface */
 	const t_fragments: DocumentFragment[] = [];
@@ -47,7 +48,7 @@ export default function IfNested(
 							// @ts-ignore
 							const t_root_2 = t_root(t_fragment_2);
 							// @ts-ignore
-							const t_text_1 = t_next(t_next(t_root_2));
+							const t_text_1 = t_next(t_root_2, 2);
 							t_add_fragment(t_fragment_2, t_fragment_1, t_before);
 							t_next(t_text_1);
 						});
@@ -58,7 +59,7 @@ export default function IfNested(
 							// @ts-ignore
 							const t_root_3 = t_root(t_fragment_3);
 							// @ts-ignore
-							const t_text_2 = t_next(t_next(t_root_3));
+							const t_text_2 = t_next(t_root_3, 2);
 							t_add_fragment(t_fragment_3, t_fragment_1, t_before);
 							t_next(t_text_2);
 						});
@@ -77,7 +78,7 @@ export default function IfNested(
 				// @ts-ignore
 				const t_root_4 = t_root(t_fragment_4);
 				// @ts-ignore
-				const t_text_4 = t_next(t_next(t_root_4));
+				const t_text_4 = t_next(t_root_4, 2);
 				t_add_fragment(t_fragment_4, t_div_1, t_before);
 				t_next(t_text_4);
 			});

package/test/if/components/output/IfNested-server.ts CHANGED Viewed

@@ -7,6 +7,7 @@ export default function IfNested(
 	// @ts-ignore
 	$slots?: Record<string, ServerSlotRender>
 ) {
+	$props ??= {};
 	/* User interface */
 	let $output = "";

package/test/if/components/temp/{IfAfterIf-client-a489daa5b961ed9da71418fdbb1665b6ba39f1b7.ts → IfAfterIf-client-49b6b8c42b0a351561f9f5f22c2ae2e844bf3b58.ts} RENAMED Viewed

@@ -1,3 +1,4 @@
+import $watch from "../../../../src/render/$watch";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
 import t_anchor from "../../../../src/render/nodeAnchor";
@@ -18,7 +19,7 @@ export default function IfAfterIf(
 	// @ts-ignore
 	$slots?: Record<string, SlotRender>
 ) {
-	$props ??= {};
+	$props ??= $watch({});
 	/* User interface */
 	const t_fragments: DocumentFragment[] = [];
@@ -37,7 +38,7 @@ export default function IfAfterIf(
 				// @ts-ignore
 				const t_root_1 = t_root(t_fragment_1);
 				// @ts-ignore
-				const t_text_1 = t_next(t_next(t_root_1));
+				const t_text_1 = t_next(t_root_1, 2);
 				t_add_fragment(t_fragment_1, t_div_1, t_before);
 				t_next(t_text_1);
 			});
@@ -48,7 +49,7 @@ export default function IfAfterIf(
 		}
 	});
-	const t_if_anchor_2 = t_anchor(t_next(t_next(t_if_anchor_1))) as HTMLElement;
+	const t_if_anchor_2 = t_anchor(t_next(t_if_anchor_1, 2)) as HTMLElement;
 	/* @if */
 	const t_if_range_2 = t_range();
@@ -59,7 +60,7 @@ export default function IfAfterIf(
 				// @ts-ignore
 				const t_root_2 = t_root(t_fragment_2);
 				// @ts-ignore
-				const t_text_2 = t_next(t_next(t_root_2));
+				const t_text_2 = t_next(t_root_2, 2);
 				t_add_fragment(t_fragment_2, t_div_1, t_before);
 				t_next(t_text_2);
 			});

package/test/if/components/temp/{IfAfterIf-server-243736e666e7d77d3f8553a1682734555f5ffd22.ts → IfAfterIf-server-eb67cf1fcf6711882266219940a47bd4a66497f3.ts} RENAMED Viewed

@@ -7,6 +7,7 @@ export default function IfAfterIf(
 	// @ts-ignore
 	$slots?: Record<string, ServerSlotRender>
 ) {
+	$props ??= {};
 	/* User interface */
 	let $output = "";

package/test/if/components/temp/{IfElse-client-4c71642f412d5dd2f45729eafb7e974781dbe011.ts → IfElse-client-e236d4a2e99262ff09675bc519c07e2826c0d70b.ts} RENAMED Viewed

@@ -1,3 +1,4 @@
+import $watch from "../../../../src/render/$watch";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
 import t_anchor from "../../../../src/render/nodeAnchor";
@@ -18,7 +19,7 @@ export default function IfElse(
 	// @ts-ignore
 	$slots?: Record<string, SlotRender>
 ) {
-	$props ??= {};
+	$props ??= $watch({});
 	/* User interface */
 	const t_fragments: DocumentFragment[] = [];
@@ -37,7 +38,7 @@ export default function IfElse(
 				// @ts-ignore
 				const t_root_1 = t_root(t_fragment_1);
 				// @ts-ignore
-				const t_text_1 = t_next(t_next(t_root_1));
+				const t_text_1 = t_next(t_root_1, 2);
 				t_add_fragment(t_fragment_1, t_div_1, t_before);
 				t_next(t_text_1);
 			});
@@ -48,7 +49,7 @@ export default function IfElse(
 				// @ts-ignore
 				const t_root_2 = t_root(t_fragment_2);
 				// @ts-ignore
-				const t_text_2 = t_next(t_next(t_root_2));
+				const t_text_2 = t_next(t_root_2, 2);
 				t_add_fragment(t_fragment_2, t_div_1, t_before);
 				t_next(t_text_2);
 			});

package/test/if/components/temp/{IfElse-server-64c055182b327504ee71d1f1d44cfccf48be350d.ts → IfElse-server-c077e0e30f4d2adec41ab779198362d21542d055.ts} RENAMED Viewed

@@ -7,6 +7,7 @@ export default function IfElse(
 	// @ts-ignore
 	$slots?: Record<string, ServerSlotRender>
 ) {
+	$props ??= {};
 	/* User interface */
 	let $output = "";

package/test/if/components/temp/{IfElseIf-client-98d50d6f40c2385c4ef4fc02329f9d2e182c76c4.ts → IfElseIf-client-b92106861f0c7ec3d09e3a42bb93d8f5bd4e3bdf.ts} RENAMED Viewed

@@ -1,3 +1,4 @@
+import $watch from "../../../../src/render/$watch";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
 import t_anchor from "../../../../src/render/nodeAnchor";
@@ -18,7 +19,7 @@ export default function IfElseIf(
 	// @ts-ignore
 	$slots?: Record<string, SlotRender>
 ) {
-	$props ??= {};
+	$props ??= $watch({});
 	/* User interface */
 	const t_fragments: DocumentFragment[] = [];
@@ -37,7 +38,7 @@ export default function IfElseIf(
 				// @ts-ignore
 				const t_root_1 = t_root(t_fragment_1);
 				// @ts-ignore
-				const t_text_1 = t_next(t_next(t_root_1));
+				const t_text_1 = t_next(t_root_1, 2);
 				t_add_fragment(t_fragment_1, t_div_1, t_before);
 				t_next(t_text_1);
 			});
@@ -48,7 +49,7 @@ export default function IfElseIf(
 				// @ts-ignore
 				const t_root_2 = t_root(t_fragment_2);
 				// @ts-ignore
-				const t_text_2 = t_next(t_next(t_root_2));
+				const t_text_2 = t_next(t_root_2, 2);
 				t_add_fragment(t_fragment_2, t_div_1, t_before);
 				t_next(t_text_2);
 			});
@@ -59,7 +60,7 @@ export default function IfElseIf(
 				// @ts-ignore
 				const t_root_3 = t_root(t_fragment_3);
 				// @ts-ignore
-				const t_text_3 = t_next(t_next(t_root_3));
+				const t_text_3 = t_next(t_root_3, 2);
 				t_add_fragment(t_fragment_3, t_div_1, t_before);
 				t_next(t_text_3);
 			});

package/test/if/components/temp/{IfElseIf-server-79788b13af905175f50bfa8658f2ff2af73db232.ts → IfElseIf-server-67991eee3f56dc687cda600511c31396438e0a77.ts} RENAMED Viewed

@@ -7,6 +7,7 @@ export default function IfElseIf(
 	// @ts-ignore
 	$slots?: Record<string, ServerSlotRender>
 ) {
+	$props ??= {};
 	/* User interface */
 	let $output = "";

package/test/{build-server/components/temp/IfNested-client-979db97eea5b4595550b9b46f297f3fbc31796d2.ts → if/components/temp/IfNested-client-f563ac1b16a2280e457557281c4925ed447a9cd7.ts} RENAMED Viewed

@@ -1,3 +1,4 @@
+import $watch from "../../../../src/render/$watch";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
 import t_anchor from "../../../../src/render/nodeAnchor";
@@ -18,7 +19,7 @@ export default function IfNested(
 	// @ts-ignore
 	$slots?: Record<string, SlotRender>
 ) {
-	$props ??= {};
+	$props ??= $watch({});
 	/* User interface */
 	const t_fragments: DocumentFragment[] = [];
@@ -47,7 +48,7 @@ export default function IfNested(
 							// @ts-ignore
 							const t_root_2 = t_root(t_fragment_2);
 							// @ts-ignore
-							const t_text_1 = t_next(t_next(t_root_2));
+							const t_text_1 = t_next(t_root_2, 2);
 							t_add_fragment(t_fragment_2, t_fragment_1, t_before);
 							t_next(t_text_1);
 						});
@@ -58,7 +59,7 @@ export default function IfNested(
 							// @ts-ignore
 							const t_root_3 = t_root(t_fragment_3);
 							// @ts-ignore
-							const t_text_2 = t_next(t_next(t_root_3));
+							const t_text_2 = t_next(t_root_3, 2);
 							t_add_fragment(t_fragment_3, t_fragment_1, t_before);
 							t_next(t_text_2);
 						});
@@ -77,7 +78,7 @@ export default function IfNested(
 				// @ts-ignore
 				const t_root_4 = t_root(t_fragment_4);
 				// @ts-ignore
-				const t_text_4 = t_next(t_next(t_root_4));
+				const t_text_4 = t_next(t_root_4, 2);
 				t_add_fragment(t_fragment_4, t_div_1, t_before);
 				t_next(t_text_4);
 			});

package/test/{build-server/components/temp/IfNested-server-3c4e4b6f2162c0906cef685830219b9ea9ee985c.ts → if/components/temp/IfNested-server-0a2a9643324ab73b02b310cad61ba87dab146ab2.ts} RENAMED Viewed

@@ -7,6 +7,7 @@ export default function IfNested(
 	// @ts-ignore
 	$slots?: Record<string, ServerSlotRender>
 ) {
+	$props ??= {};
 	/* User interface */
 	let $output = "";

package/test/mount/components/Mount.torp CHANGED Viewed

@@ -6,6 +6,6 @@ export default function Mount() {
 	});
 	@render {
-		<input :self={inputElement} />
+		<input &ref={inputElement} />
 	}
 }

package/test/mount/components/output/Mount-client.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import $mount from "../../../../src/render/$mount";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
-import t_flush from "../../../../src/render/flushMountEffects";
 import t_fragment from "../../../../src/render/getFragment";
 import t_next from "../../../../src/render/nodeNext";
 import t_root from "../../../../src/render/nodeRoot";
@@ -33,5 +32,4 @@ export default function Mount(
 	t_add_fragment(t_fragment_0, $parent, $anchor);
 	t_next(t_input_1);
-	t_flush();
 }

package/test/mount/components/output/Mount-server.ts CHANGED Viewed

@@ -18,7 +18,7 @@ export default function Mount(
 	/* User interface */
 	let $output = "";
-	$output += `<input self="${t_attr(inputElement) || ""}">`;
+	$output += `<input ref="${t_attr(inputElement) || ""}">`;
 	return $output;
 }

package/test/mount/components/temp/{Mount-client-49d8d6475336b5749fe8a17be847fd2b6cda5ccc.ts → Mount-client-36dbc95a61345a1b7dcf07e6b0c998af2afca691.ts} RENAMED Viewed

@@ -1,7 +1,6 @@
 import $mount from "../../../../src/render/$mount";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
-import t_flush from "../../../../src/render/flushMountEffects";
 import t_fragment from "../../../../src/render/getFragment";
 import t_next from "../../../../src/render/nodeNext";
 import t_root from "../../../../src/render/nodeRoot";
@@ -33,5 +32,4 @@ export default function Mount(
 	t_add_fragment(t_fragment_0, $parent, $anchor);
 	t_next(t_input_1);
-	t_flush();
 }

package/test/mount/components/temp/{Mount-server-e3d689cf52a4477da9aa00e2c7604110710db991.ts → Mount-server-8bef1924a731f3db63cb827be3938fec685e53af.ts} RENAMED Viewed

@@ -18,7 +18,7 @@ export default function Mount(
 	/* User interface */
 	let $output = "";
-	$output += `<input self="${t_attr(inputElement) || ""}">`;
+	$output += `<input ref="${t_attr(inputElement) || ""}">`;
 	return $output;
 }

package/test/on-mount/components/output/OnMount-client.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import $mount from "../../../../src/render/$mount";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
-import t_flush from "../../../../src/render/flushMountEffects";
 import t_fragment from "../../../../src/render/getFragment";
 import t_next from "../../../../src/render/nodeNext";
 import t_root from "../../../../src/render/nodeRoot";
@@ -29,5 +28,4 @@ export default function OnMount(
 	t_add_fragment(t_fragment_0, $parent, $anchor);
 	t_next(t_input_1);
-	t_flush();
 }

package/test/on-mount/components/temp/{OnMount-client-b2dfd41a0aaeafb3b7af14793a03e0fc3bc43aaa.ts → OnMount-client-21708a638d2939ee8b017f5dc819cee4748bde87.ts} RENAMED Viewed

@@ -1,7 +1,6 @@
 import $mount from "../../../../src/render/$mount";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
-import t_flush from "../../../../src/render/flushMountEffects";
 import t_fragment from "../../../../src/render/getFragment";
 import t_next from "../../../../src/render/nodeNext";
 import t_root from "../../../../src/render/nodeRoot";
@@ -29,5 +28,4 @@ export default function OnMount(
 	t_add_fragment(t_fragment_0, $parent, $anchor);
 	t_next(t_input_1);
-	t_flush();
 }

package/test/party/13-emit-to-parent.test.ts CHANGED Viewed

@@ -31,19 +31,18 @@ test("emit to parent -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	const yesButton = container.getElementsByTagName("button")[0];
 	const noButton = container.getElementsByTagName("button")[1];
 	expect(queryByText(container, "😀")).not.toBeNull();
 	expect(queryByText(container, "😥")).toBeNull();
-	await user.click(noButton);
+	await userEvent.click(noButton);
 	expect(queryByText(container, "😀")).toBeNull();
 	expect(queryByText(container, "😥")).not.toBeNull();
-	await user.click(yesButton);
+	await userEvent.click(yesButton);
 	expect(queryByText(container, "😀")).not.toBeNull();
 	expect(queryByText(container, "😥")).toBeNull();

package/test/party/16-context.test.ts CHANGED Viewed

@@ -31,13 +31,12 @@ test("context -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	const button = container.getElementsByTagName("button")[0];
 	expect(queryByText(container, "Welcome back, unicorn42")).not.toBeNull();
 	expect(queryByText(container, "Username: unicorn42")).not.toBeNull();
-	await user.click(button);
+	await userEvent.click(button);
 	expect(queryByText(container, "Welcome back, Jane")).not.toBeNull();
 	expect(queryByText(container, "Username: Jane")).not.toBeNull();

package/test/party/17-input-text.test.ts CHANGED Viewed

@@ -31,13 +31,12 @@ test("input text -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	const input = container.getElementsByTagName("input")[0];
 	expect(queryByText(container, "Hello World")).not.toBeNull();
-	await user.clear(input);
-	await user.type(input, "Hello Jane");
+	await userEvent.clear(input);
+	await userEvent.type(input, "Hello Jane");
 	expect(queryByText(container, "Hello Jane")).not.toBeNull();
 }

package/test/party/18-input-checkbox.test.ts CHANGED Viewed

@@ -31,12 +31,11 @@ test("input checkbox -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	const input = container.getElementsByTagName("input")[0];
 	expect(queryByText(container, "Not available")).not.toBeNull();
-	await user.click(input);
+	await userEvent.click(input);
 	expect(queryByText(container, "Available")).not.toBeNull();
 }

package/test/party/19-input-radio.test.ts CHANGED Viewed

@@ -31,19 +31,18 @@ test("input radio -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	const blueRadio = container.getElementsByTagName("input")[0];
 	const redRadio = container.getElementsByTagName("input")[1];
 	expect(queryByText(container, "Picked: red")).not.toBeNull();
 	expect(queryByText(container, "Picked: blue")).toBeNull();
-	await user.click(blueRadio);
+	await userEvent.click(blueRadio);
 	expect(queryByText(container, "Picked: red")).toBeNull();
 	expect(queryByText(container, "Picked: blue")).not.toBeNull();
-	await user.click(redRadio);
+	await userEvent.click(redRadio);
 	expect(queryByText(container, "Picked: red")).not.toBeNull();
 	expect(queryByText(container, "Picked: blue")).toBeNull();

package/test/party/20-input-select.test.ts CHANGED Viewed

@@ -31,21 +31,20 @@ test("input select -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	const select = container.getElementsByTagName("select")[0];
 	expect(queryByText(container, "Selected: blue")).not.toBeNull();
-	await user.selectOptions(select, "1");
+	await userEvent.selectOptions(select, "1");
 	expect(queryByText(container, "Selected: red")).not.toBeNull();
-	await user.selectOptions(select, "3");
+	await userEvent.selectOptions(select, "3");
 	expect(queryByText(container, "Selected: green")).not.toBeNull();
 	// This shouldn't work because the option is disabled
-	await user.selectOptions(select, "4");
+	await userEvent.selectOptions(select, "4");
 	expect(queryByText(container, "Selected: gray")).toBeNull();
 	expect(queryByText(container, "Selected: green")).not.toBeNull();

package/test/party/7-event-click.test.ts CHANGED Viewed

@@ -31,12 +31,10 @@ test("event click -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	expect(queryByText(container, "Counter: 0")).not.toBeNull();
 	const button = container.getElementsByTagName("button")[0];
-	await user.click(button);
+	await userEvent.click(button);
 	expect(queryByText(container, "Counter: 1")).not.toBeNull();
 }

package/test/party/9-conditional.test.ts CHANGED Viewed

@@ -31,20 +31,18 @@ test("conditional -- hydrated", async () => {
 });
 async function check(container: HTMLElement) {
-	const user = userEvent.setup();
 	expect(queryByText(container, "STOP")).not.toBeNull();
 	expect(queryByText(container, "SLOW DOWN")).toBeNull();
 	expect(queryByText(container, "GO")).toBeNull();
 	const button = container.getElementsByTagName("button")[0];
-	await user.click(button);
+	await userEvent.click(button);
 	expect(queryByText(container, "STOP")).toBeNull();
 	expect(queryByText(container, "SLOW DOWN")).not.toBeNull();
 	expect(queryByText(container, "GO")).toBeNull();
-	await user.click(button);
+	await userEvent.click(button);
 	expect(queryByText(container, "STOP")).toBeNull();
 	expect(queryByText(container, "SLOW DOWN")).toBeNull();

package/test/party/components/ColorSelect.torp CHANGED Viewed

@@ -14,7 +14,7 @@ export default function ColorSelect() {
 		<div>
 			<div>Selected: {colors[$state.selectedColorId - 1].text}</div>
-			<select :value={$state.selectedColorId}>
+			<select &value={$state.selectedColorId}>
 				@for (let color of colors) {
 					<option value={color.id} disabled={color.isDisabled}>
 						{color.text}

package/test/party/components/InputFocused.torp CHANGED Viewed

@@ -7,6 +7,6 @@ export default function InputFocused() {
 	});
 	@render {
-		<input :self={inputElement} />
+		<input &ref={inputElement} />
 	}
 }

package/test/party/components/InputHello.torp CHANGED Viewed

@@ -6,7 +6,7 @@ export default function InputHello() {
 	@render {
 		<div>
 			<p>{$state.text}</p>
-			<input :value={$state.text} />
+			<input &value={$state.text} />
 		</div>
 	}
 }

package/test/party/components/IsAvailable.torp CHANGED Viewed

@@ -7,7 +7,7 @@ export default function IsAvailable() {
 		<div>
 			<div>{$state.isAvailable ? "Available" : "Not available"}</div>
-			<input id="is-available" type="checkbox" :checked={$state.isAvailable} />
+			<input id="is-available" type="checkbox" &checked={$state.isAvailable} />
 			<label for="is-available">Is available</label>
 		</div>
 	}

package/test/party/components/PickPill.torp CHANGED Viewed

@@ -7,10 +7,10 @@ export default function PickPill() {
 		<div>
 			<div>Picked: {$state.picked}</div>
-			<input id="blue-pill" :group={$state.picked} type="radio" value="blue" />
+			<input id="blue-pill" &group={$state.picked} type="radio" value="blue" />
 			<label for="blue-pill">Blue pill</label>
-			<input id="red-pill" :group={$state.picked} type="radio" value="red" />
+			<input id="red-pill" &group={$state.picked} type="radio" value="red" />
 			<label for="red-pill">Red pill</label>
 		</div>
 	}

package/test/party/components/output/AnswerButton-client.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+import $watch from "../../../../src/render/$watch";
 import { type SlotRender } from "../../../../src/types/SlotRender";
 import t_add_fragment from "../../../../src/render/addFragment";
 import t_child from "../../../../src/render/nodeChild";
@@ -15,7 +16,7 @@ export default function AnswerButton(
 	// @ts-ignore
 	$slots?: Record<string, SlotRender>
 ) {
-	$props ??= {};
+	$props ??= $watch({});
 	/* User interface */
 	const t_fragments: DocumentFragment[] = [];
@@ -24,7 +25,7 @@ export default function AnswerButton(
 	// @ts-ignore
 	const t_div_1 = t_root(t_fragment_0) as HTMLDivElement;
 	const t_button_1 = t_next(t_child(t_div_1)) as HTMLElement;
-	const t_button_2 = t_next(t_next(t_button_1)) as HTMLElement;
+	const t_button_2 = t_next(t_button_1, 2) as HTMLElement;
 	t_event(t_button_1, "click", $props.onYes);
 	t_event(t_button_2, "click", $props.onNo);
 	t_add_fragment(t_fragment_0, $parent, $anchor);

package/test/party/components/output/AnswerButton-server.ts CHANGED Viewed

@@ -7,6 +7,7 @@ export default function AnswerButton(
 	// @ts-ignore
 	$slots?: Record<string, ServerSlotRender>
 ) {
+	$props ??= {};
 	/* User interface */
 	let $output = "";