feat: use implicit return for each block keys (#10938)

* feat: use implicit return for each block keys

* swap args

* update test

Author: Rich-Harris

.changeset/eleven-beers-yell.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+feat: use implicit return for each block keys

packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js

@@ -2317,11 +2317,13 @@ export const template_visitors = {
 		const key_function = node.key
 			? b.arrow(
 					[node.context.type === 'Identifier' ? node.context : b.id('$$item'), index],
-					b.block(
-						declarations.concat(
-							b.return(/** @type {import('estree').Expression} */ (context.visit(node.key)))
-						)
-					)
+					declarations.length > 0
+						? b.block(
+								declarations.concat(
+									b.return(/** @type {import('estree').Expression} */ (context.visit(node.key)))
+								)
+							)
+						: /** @type {import('estree').Expression} */ (context.visit(node.key))
 				)
 			: b.literal(null);
 
@@ -2347,16 +2349,16 @@ export const template_visitors = {
 
 			args.push(
 				context.state.node,
-				each_node_meta.array_name ? each_node_meta.array_name : b.thunk(collection),
 				b.literal(each_type),
+				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(children)))
 			);
 		} else {
 			args.push(
 				context.state.node,
-				each_node_meta.array_name ? each_node_meta.array_name : b.thunk(collection),
 				b.literal(each_type),
+				each_node_meta.array_name ? each_node_meta.array_name : b.thunk(collection),
 				b.arrow([b.id('$$anchor'), item, index], b.block(declarations.concat(children)))
 			);
 		}

packages/svelte/src/internal/client/dom/blocks/each.js

@@ -46,15 +46,15 @@ export function set_current_each_item(item) {
 /**
  * @template V
  * @param {Element | Comment} anchor The next sibling node, or the parent node if this is a 'controlled' block
- * @param {() => V[]} get_collection
  * @param {number} flags
+ * @param {() => V[]} get_collection
  * @param {null | ((item: V) => string)} get_key
  * @param {(anchor: null, item: V, index: import('#client').MaybeSource<number>) => void} render_fn
  * @param {null | ((anchor: Node | null) => void)} fallback_fn
  * @param {typeof reconcile_indexed_array | reconcile_tracked_array} reconcile_fn
  * @returns {void}
  */
-function each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, reconcile_fn) {
+function each(anchor, flags, get_collection, get_key, render_fn, fallback_fn, reconcile_fn) {
 	/** @type {import('#client').EachState} */
 	var state = { flags, items: [] };
 
@@ -193,28 +193,28 @@ function each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, re
 /**
  * @template V
  * @param {Element | Comment} anchor
- * @param {() => V[]} get_collection
  * @param {number} flags
+ * @param {() => V[]} get_collection
  * @param {null | ((item: V) => string)} get_key
  * @param {(anchor: null, item: V, index: import('#client').MaybeSource<number>) => void} render_fn
  * @param {null | ((anchor: Node | null) => void)} [fallback_fn]
  * @returns {void}
  */
-export function each_keyed(anchor, get_collection, flags, get_key, render_fn, fallback_fn = null) {
-	each(anchor, get_collection, flags, get_key, render_fn, fallback_fn, reconcile_tracked_array);
+export function each_keyed(anchor, flags, get_collection, get_key, render_fn, fallback_fn = null) {
+	each(anchor, flags, get_collection, get_key, render_fn, fallback_fn, reconcile_tracked_array);
 }
 
 /**
  * @template V
  * @param {Element | Comment} anchor
- * @param {() => V[]} get_collection
  * @param {number} flags
+ * @param {() => V[]} get_collection
  * @param {(anchor: null, item: V, index: import('#client').MaybeSource<number>) => void} render_fn
  * @param {null | ((anchor: Node | null) => void)} [fallback_fn]
  * @returns {void}
  */
-export function each_indexed(anchor, get_collection, flags, render_fn, fallback_fn = null) {
-	each(anchor, get_collection, flags, null, render_fn, fallback_fn, reconcile_indexed_array);
+export function each_indexed(anchor, flags, get_collection, render_fn, fallback_fn = null) {
+	each(anchor, flags, get_collection, null, render_fn, fallback_fn, reconcile_indexed_array);
 }
 
 /**

packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js

@@ -10,7 +10,7 @@ export default function Each_string_template($$anchor, $$props) {
 	var fragment = $.comment($$anchor);
 	var node = $.first_child(fragment);
 
-	$.each_indexed(node, () => ['foo', 'bar', 'baz'], 1, ($$anchor, thing, $$index) => {
+	$.each_indexed(node, 1, () => ['foo', 'bar', 'baz'], ($$anchor, thing, $$index) => {
 		var text = $.space_frag($$anchor);
 
 		$.render_effect(() => $.set_text(text, `${$.stringify($.unwrap(thing))}, `));