diff --git a/.changeset/lucky-experts-float.md b/.changeset/lucky-experts-float.md new file mode 100644 index 0000000000..77e160580e --- /dev/null +++ b/.changeset/lucky-experts-float.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: omit `$$index` parameter where possible diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js index 9ed168f458..d787665121 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js @@ -149,14 +149,23 @@ export function EachBlock(node, context) { each_node_meta.contains_group_binding || !node.index ? each_node_meta.index : b.id(node.index); const item = each_node_meta.item; + let uses_index = each_node_meta.contains_group_binding; + let key_uses_index = false; + if (node.index) { - if ((flags & EACH_INDEX_REACTIVE) !== 0) { - child_state.transform[node.index] = { read: get_value }; - } else { - delete child_state.transform[node.index]; - } + child_state.transform[node.index] = { + read: (node) => { + uses_index = true; + return (flags & EACH_INDEX_REACTIVE) !== 0 ? get_value(node) : node; + } + }; - delete key_state.transform[node.index]; + key_state.transform[node.index] = { + read: (node) => { + key_uses_index = true; + return node; + } + }; } /** @type {Statement[]} */ @@ -180,6 +189,8 @@ export function EachBlock(node, context) { child_state.transform[node.context.name] = { read: (flags & EACH_ITEM_REACTIVE) !== 0 ? get_value : (node) => node, assign: (_, value) => { + uses_index = true; + const left = b.member( each_node_meta.array_name ? b.call(each_node_meta.array_name) : collection, index, @@ -238,7 +249,7 @@ export function EachBlock(node, context) { context.visit(/** @type {Expression} */ (node.key), key_state) ); - key_function = b.arrow([node.context, index], expression); + key_function = b.arrow(key_uses_index ? [node.context, index] : [node.context], expression); } if (node.index && each_node_meta.contains_group_binding) { @@ -259,7 +270,10 @@ export function EachBlock(node, context) { b.literal(flags), each_node_meta.array_name ? each_node_meta.array_name : b.thunk(collection), key_function, - b.arrow([b.id('$$anchor'), item, index], b.block(declarations.concat(block.body))) + b.arrow( + uses_index ? [b.id('$$anchor'), item, index] : [b.id('$$anchor'), item], + b.block(declarations.concat(block.body)) + ) ]; if (node.fallback) { diff --git a/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js index 93cf459e40..8152445ec3 100644 --- a/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js +++ b/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js @@ -5,7 +5,7 @@ export default function Each_string_template($$anchor) { var fragment = $.comment(); var node = $.first_child(fragment); - $.each(node, 0, () => ['foo', 'bar', 'baz'], $.index, ($$anchor, thing, $$index) => { + $.each(node, 0, () => ['foo', 'bar', 'baz'], $.index, ($$anchor, thing) => { var text = $.text(); $.template_effect(() => $.set_text(text, `${thing ?? ""}, `));