fix: migrate nested `svelte:component`

packages/svelte/src/compiler/migrate/index.js

@@ -627,7 +627,8 @@ const template = {
 					part.type === 'IfBlock' ||
 					part.type === 'KeyBlock' ||
 					part.type === 'SnippetBlock' ||
-					part.type === 'Component'
+					part.type === 'Component' ||
+					part.type === 'SvelteComponent'
 				) {
 					const indent = state.str.original.substring(
 						state.str.original.lastIndexOf('\n', node.start) + 1,

packages/svelte/tests/migrate/samples/svelte-component/input.svelte

@@ -33,6 +33,36 @@
 	</svelte:element>
 </Component>
 
+<svelte:component this={Component} let:Comp>
+	<svelte:component this={Comp} />
+</svelte:component>
+
+<svelte:component this={Component} let:comp>
+	<svelte:component this={comp} />
+</svelte:component>
+
+<svelte:component this={Component} let:comp={stuff}>
+	<svelte:component this={stuff} />
+</svelte:component>
+
+<svelte:component this={Component}>
+	<div slot="x" let:comp={stuff}>
+		<svelte:component this={stuff} />
+	</div>
+</svelte:component>
+
+<svelte:component this={Component}>
+	<svelte:fragment slot="x" let:comp={stuff}>
+		<svelte:component this={stuff} />
+	</svelte:fragment>
+</svelte:component>
+
+<svelte:component this={Component}>
+	<svelte:element this={"div"} slot="x" let:comp={stuff}>
+		<svelte:component this={stuff} />
+	</svelte:element>
+</svelte:component>
+
 <svelte:component this={Component} />
 <svelte:component this={Component} prop value="" on:click on:click={()=>''} />
 <svelte:component this={Math.random() > .5 ? $$restProps.heads : $$restProps.tail}  prop value="" on:click on:click={()=>''}/>

packages/svelte/tests/migrate/samples/svelte-component/output.svelte

@@ -4,7 +4,7 @@
 	let Component;
 	let fallback;
 
-	const SvelteComponent_5 = $derived(Math.random() > .5 ? rest.heads : rest.tail);
+	const SvelteComponent_10 = $derived(Math.random() > .5 ? rest.heads : rest.tail);
 </script>
 
 <Component let:Comp>
@@ -42,9 +42,44 @@
 	</svelte:element>
 </Component>
 
+<Component let:Comp>
+	<Comp />
+</Component>
+
+<Component let:comp>
+	{@const SvelteComponent_5 = comp}
+	<SvelteComponent_5 />
+</Component>
+
+<Component let:comp={stuff}>
+	{@const SvelteComponent_6 = stuff}
+	<SvelteComponent_6 />
+</Component>
+
+<Component>
+	<div slot="x" let:comp={stuff}>
+		{@const SvelteComponent_7 = stuff}
+		<SvelteComponent_7 />
+	</div>
+</Component>
+
+<Component>
+	<svelte:fragment slot="x" let:comp={stuff}>
+		{@const SvelteComponent_8 = stuff}
+		<SvelteComponent_8 />
+	</svelte:fragment>
+</Component>
+
+<Component>
+	<svelte:element this={"div"} slot="x" let:comp={stuff}>
+		{@const SvelteComponent_9 = stuff}
+		<SvelteComponent_9 />
+	</svelte:element>
+</Component>
+
 <Component />
 <Component prop value="" on:click on:click={()=>''} />
-<SvelteComponent_5  prop value="" on:click on:click={()=>''}/>
+<SvelteComponent_10  prop value="" on:click on:click={()=>''}/>
 
 <Component 
 	prop value="" 
@@ -52,7 +87,7 @@
 	on:click={()=>''} 
 />
 
-<SvelteComponent_5
+<SvelteComponent_10
 	prop value="" 
 	on:click 
 	on:click={()=>''}
@@ -60,8 +95,8 @@
 
 {#if true}
 	{@const x = {Component}}
-	{@const SvelteComponent_7 = x['Component']}
+	{@const SvelteComponent_12 = x['Component']}
-	<SvelteComponent_7 />
+	<SvelteComponent_12 />
 {/if}
 
 {#if true}
@@ -70,8 +105,8 @@
 {/if}
 
 {#each [] as component}
-	{@const SvelteComponent_8 = component}
+	{@const SvelteComponent_13 = component}
-	<SvelteComponent_8 />
+	<SvelteComponent_13 />
 {/each}
 
 {#each [] as Component}
@@ -85,20 +120,20 @@
 
 {#each [] as component}
 	{@const comp = component.component}
-	{@const SvelteComponent_9 = comp}
+	{@const SvelteComponent_14 = comp}
-	<SvelteComponent_9 />
+	<SvelteComponent_14 />
 {/each}
 
 {#await Promise.resolve()}
 	<Component />
-	{@const SvelteComponent_10 = fallback}
+	{@const SvelteComponent_15 = fallback}
-	<SvelteComponent_10 />
+	<SvelteComponent_15 />
 {:then something}
-	{@const SvelteComponent_11 = something}
+	{@const SvelteComponent_16 = something}
-	<SvelteComponent_11 />
+	<SvelteComponent_16 />
 {:catch e}
-	{@const SvelteComponent_12 = e}
+	{@const SvelteComponent_17 = e}
-	<SvelteComponent_12 />
+	<SvelteComponent_17 />
 {/await}
 
 {#await Promise.resolve() then Something}