From 9272440c8f50d46811e8971a0f5924c33e10fbbb Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Tue, 7 Apr 2026 10:28:14 +0200
Subject: [PATCH] fix: push renderer at the very top of component

---
 .../phases/3-transform/client/transform-client.js  | 14 +++++++-------
 .../samples/props-id/Nested.svelte                 |  5 +++++
 .../custom-renderers/samples/props-id/_config.js   |  2 +-
 .../custom-renderers/samples/props-id/main.svelte  |  4 +++-
 4 files changed, 16 insertions(+), 9 deletions(-)
 create mode 100644 packages/svelte/tests/custom-renderers/samples/props-id/Nested.svelte

diff --git a/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js b/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
index 5ba21e1ae5..c3a198d5e8 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/transform-client.js
@@ -406,13 +406,6 @@ export function client_component(analysis, options) {
 		);
 	}
 
-	if (analysis.custom_renderer) {
-		component_block.body.unshift(
-			b.var('$$pop_renderer', b.call('$.push_renderer', b.id('$renderer')))
-		);
-		component_block.body.push(b.stmt(b.call('$$pop_renderer')));
-	}
-
 	let should_inject_props =
 		should_inject_context ||
 		analysis.needs_props ||
@@ -616,6 +609,13 @@ export function client_component(analysis, options) {
 		component_block.body.unshift(b.const(analysis.props_id, b.call('$.props_id')));
 	}
 
+	if (analysis.custom_renderer) {
+		component_block.body.unshift(
+			b.var('$$pop_renderer', b.call('$.push_renderer', b.id('$renderer')))
+		);
+		component_block.body.push(b.stmt(b.call('$$pop_renderer')));
+	}
+
 	if (state.events.size > 0) {
 		body.push(
 			b.stmt(b.call('$.delegate', b.array(Array.from(state.events).map((name) => b.literal(name)))))
diff --git a/packages/svelte/tests/custom-renderers/samples/props-id/Nested.svelte b/packages/svelte/tests/custom-renderers/samples/props-id/Nested.svelte
new file mode 100644
index 0000000000..bbed82af1e
--- /dev/null
+++ b/packages/svelte/tests/custom-renderers/samples/props-id/Nested.svelte
@@ -0,0 +1,5 @@
+<script>
+	let id = $props.id();
+</script>
+
+{id}
\ No newline at end of file
diff --git a/packages/svelte/tests/custom-renderers/samples/props-id/_config.js b/packages/svelte/tests/custom-renderers/samples/props-id/_config.js
index 904e7498a8..9006b4e2fb 100644
--- a/packages/svelte/tests/custom-renderers/samples/props-id/_config.js
+++ b/packages/svelte/tests/custom-renderers/samples/props-id/_config.js
@@ -1,5 +1,5 @@
 import { test } from '../../test';
 
 export default test({
-	html: 'c1'
+	html: 'c1 c2'
 });
diff --git a/packages/svelte/tests/custom-renderers/samples/props-id/main.svelte b/packages/svelte/tests/custom-renderers/samples/props-id/main.svelte
index bbed82af1e..a5e2bf4395 100644
--- a/packages/svelte/tests/custom-renderers/samples/props-id/main.svelte
+++ b/packages/svelte/tests/custom-renderers/samples/props-id/main.svelte
@@ -1,5 +1,7 @@
 <script>
+	import Nested from './Nested.svelte';
 	let id = $props.id();
 </script>
 
-{id}
\ No newline at end of file
+{id}
+<Nested />
\ No newline at end of file