@torpor/view 0.0.14 → 0.1.0

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

@@ -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

@@ -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}

@@ -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}

@@ -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}

@@ -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}

@@ -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}

@@ -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}

@@ -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}

@@ -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}

@@ -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

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

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

@@ -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

@@ -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}

@@ -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}

@@ -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

@@ -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}

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

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

package/test/party/components/InputHello.torp

@@ -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

@@ -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

@@ -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

@@ -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

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

package/test/party/components/output/AnswerButtonApp-client.ts

@@ -9,7 +9,7 @@ import t_fragment from "../../../../src/render/getFragment";
 import t_next from "../../../../src/render/nodeNext";
 import t_root from "../../../../src/render/nodeRoot";
 
-import AnswerButton from "./AnswerButton-client";
+import AnswerButton from "../output/./AnswerButton-client";
 
 export default function AnswerButtonApp(
 	$parent: ParentNode,
@@ -40,10 +40,10 @@ export default function AnswerButtonApp(
 	const t_fragment_0 = t_fragment($parent.ownerDocument!, t_fragments, 0, `<div> <p>Are you happy?</p> <!> <p style="font-size: 50px;">#</p> </div>`);
 	// @ts-ignore
 	const t_div_1 = t_root(t_fragment_0) as HTMLDivElement;
-	const t_comp_anchor_1 = t_anchor(t_next(t_next(t_next(t_child(t_div_1))))) as HTMLElement;
+	const t_comp_anchor_1 = t_anchor(t_next(t_child(t_div_1), 3)) as HTMLElement;
 
 	/* @component */
-	const t_props_1: any = {};
+	const t_props_1: any = $watch({});
 	$run(function setProp() {
 		t_props_1["onYes"] = onAnswerYes;
 	});
@@ -51,7 +51,7 @@ export default function AnswerButtonApp(
 		t_props_1["onNo"] = onAnswerNo;
 	});
 	AnswerButton(t_div_1, t_comp_anchor_1, t_props_1, $context);
-	const t_text_1 = t_child(t_next(t_next(t_comp_anchor_1)));
+	const t_text_1 = t_child(t_next(t_comp_anchor_1, 2));
 	$run(function setTextContent() {
 		t_text_1.textContent = t_fmt($state.isHappy ? "😀" : "😥");
 	});

package/test/party/components/output/AnswerButtonApp-server.ts

@@ -2,7 +2,7 @@ import $watch from "../../../../src/render/$serverWatch";
 import { type ServerSlotRender } from "../../../../src/types/ServerSlotRender";
 import t_fmt from "../../../../src/render/formatText";
 
-import AnswerButton from "./AnswerButton-server";
+import AnswerButton from "../output/./AnswerButton-server";
 
 export default function AnswerButtonApp(
 	// @ts-ignore

package/test/party/components/output/ColorSelect-client.ts

@@ -46,7 +46,7 @@ export default function ColorSelect(
 	// @ts-ignore
 	const t_div_1 = t_root(t_fragment_0) as HTMLDivElement;
 	const t_text_1 = t_child(t_next(t_child(t_div_1)));
-	const t_select_1 = t_next(t_next(t_next(t_child(t_div_1)))) as HTMLElement;
+	const t_select_1 = t_next(t_child(t_div_1), 3) as HTMLElement;
 	const t_for_anchor_1 = t_anchor(t_next(t_child(t_select_1))) as HTMLElement;
 
 	/* @for */

package/test/party/components/output/Colors-client.ts

@@ -59,7 +59,7 @@ export default function Colors(
 			const t_root_1 = t_root(t_fragment_1);
 			const t_text_1 = t_child(t_next(t_root_1));
 			// @ts-ignore
-			const t_text_2 = t_next(t_next(t_root_1));
+			const t_text_2 = t_next(t_root_1, 2);
 			$run(function setTextContent() {
 				t_text_1.textContent = t_fmt(t_item.data.color);
 			});

package/test/party/components/output/Counter-client.ts

@@ -35,7 +35,7 @@ export default function Counter(
 	// @ts-ignore
 	const t_div_1 = t_root(t_fragment_0) as HTMLDivElement;
 	const t_text_1 = t_child(t_next(t_child(t_div_1)));
-	const t_button_1 = t_next(t_next(t_next(t_child(t_div_1)))) as HTMLElement;
+	const t_button_1 = t_next(t_child(t_div_1), 3) as HTMLElement;
 	$run(function setTextContent() {
 		t_text_1.textContent = `Counter: ${t_fmt($state.count)}`;
 	});