Skip to content

Commit

Permalink
fix: account for shadowing children slot during migration (#14224)
Browse files Browse the repository at this point in the history
Fixes #14171
  • Loading branch information
paoloricciuti authored Nov 8, 2024
1 parent 31e6bbb commit f0c2d4c
Show file tree
Hide file tree
Showing 4 changed files with 47 additions and 1 deletion.
5 changes: 5 additions & 0 deletions .changeset/lazy-chefs-float.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': patch
---

fix: account for shadowing children slot during migration
15 changes: 15 additions & 0 deletions packages/svelte/src/compiler/migrate/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -1300,6 +1300,21 @@ const template = {
existing_prop.needs_refine_type = false;
}

if (
slot_name === 'default' &&
path.some(
(parent) =>
(parent.type === 'SvelteComponent' ||
parent.type === 'Component' ||
parent.type === 'RegularElement' ||
parent.type === 'SvelteElement' ||
parent.type === 'SvelteFragment') &&
parent.attributes.some((attr) => (attr.type = 'LetDirective'))
)
) {
aliased_slot_name = `${name}_render`;
state.derived_conflicting_slots.set(aliased_slot_name, name);
}
name = aliased_slot_name ?? name;

if (node.fragment.nodes.length > 0) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,4 +12,14 @@
</div>
</MyComponent>
</div>
</MyInput>

<MyInput let:args>
<slot/>
</MyInput>

<MyInput>
<div let:args>
<slot/>
</div>
</MyInput>
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,13 @@
/**
* @typedef {Object} Props
* @property {import('svelte').Snippet} [label]
* @property {import('svelte').Snippet} [children]
*/
/** @type {Props} */
let { label } = $props();
let { label, children } = $props();
const label_render = $derived(label);
const children_render = $derived(children);
</script>

Expand All @@ -30,4 +32,18 @@
</MyComponent>
</div>
{/snippet}
</MyInput>

<MyInput >
{#snippet children({ args })}
{@render children_render?.()}
{/snippet}
</MyInput>

<MyInput>
<div >
{#snippet children({ args })}
{@render children_render?.()}
{/snippet}
</div>
</MyInput>

0 comments on commit f0c2d4c

Please sign in to comment.