svelte 5.57.0 → 5.57.2

package/src/compiler/phases/1-parse/state/tag.js

@@ -3,11 +3,10 @@
 /** @import { Parser } from '../index.js' */
 import { walk } from 'zimmerframe';
 import * as e from '../../../errors.js';
-import { ExpressionMetadata } from '../../nodes.js';
+import { create_fragment, ExpressionMetadata } from '../../nodes.js';
 import { parse_expression_at, parse_statement_at } from '../acorn.js';
 import read_pattern from '../read/context.js';
 import read_expression, { get_loose_identifier } from '../read/expression.js';
-import { create_fragment } from '../utils/create.js';
 import { find_matching_bracket, match_bracket } from '../utils/bracket.js';
 
 const regex_whitespace_with_closing_curly_brace = /\s*}/y;
@@ -488,12 +487,13 @@ function open(parser) {
 			parser.eat(')', true);
 		}
 
-		const prelude = parser.template.slice(0, params_start).replace(/\S/g, ' ');
-		const params = parser.template.slice(params_start, parser.index);
-
 		let function_expression = matched
 			? /** @type {ArrowFunctionExpression} */ (
-					parse_expression_at(parser, prelude + `${params} => {}`, params_start)
+					parse_expression_at(
+						parser,
+						parser.template.slice(0, parser.index) + ' => {}',
+						params_start
+					)
 				)
 			: { params: [] };
 
@@ -532,6 +532,7 @@ function next(parser) {
 	if (block.type === 'IfBlock') {
 		if (!parser.eat('else')) e.expected_token(start, '{:else} or {:else if}');
 		if (parser.eat('if')) e.block_invalid_elseif(start);
+		if (block.alternate) e.block_duplicate_clause(start, '{:else}');
 
 		parser.allow_whitespace();
 
@@ -580,6 +581,7 @@ function next(parser) {
 
 	if (block.type === 'EachBlock') {
 		if (!parser.eat('else')) e.expected_token(start, '{:else}');
+		if (block.fallback) e.block_duplicate_clause(start, '{:else}');
 
 		parser.allow_whitespace();
 		parser.eat('}', true);

package/src/compiler/phases/1-parse/utils/html.js

@@ -38,6 +38,8 @@ const entity_pattern_attr_value = get_entity_pattern(true);
  * @param {boolean} is_attribute_value
  */
 export function decode_character_references(html, is_attribute_value) {
+	if (html.indexOf('&') === -1) return html; // fast path
+
 	const entity_pattern = is_attribute_value ? entity_pattern_attr_value : entity_pattern_content;
 	return html.replace(
 		entity_pattern,

package/src/compiler/phases/1-parse/utils/whitespace.js

@@ -0,0 +1,18 @@
+/** @param {number} cc */
+export function is_whitespace(cc) {
+	// fast path for common whitespace
+	if (cc === 32 || (cc <= 13 && cc >= 9)) return true;
+	// rare whitespace — \u00a0, \u1680, \u2000-\u200a, \u2028, \u2029, \u202f, \u205f, \u3000, \ufeff
+	if (cc < 160) return false;
+	return (
+		cc === 160 ||
+		cc === 5760 ||
+		(cc >= 8192 && cc <= 8202) ||
+		cc === 8232 ||
+		cc === 8233 ||
+		cc === 8239 ||
+		cc === 8287 ||
+		cc === 12288 ||
+		cc === 65279
+	);
+}

package/src/compiler/phases/2-analyze/css/css-prune.js

@@ -145,6 +145,12 @@ export function prune(stylesheet, elements) {
 		},
 		ComplexSelector(node) {
 			const selectors = get_relative_selectors(node);
+			const rule = /** @type {Compiler.AST.CSS.Rule} */ (node.metadata.rule);
+
+			// Global and ICSS export rules do not depend on an element in this component
+			if (every_is_global(selectors, 0, selectors.length, rule)) {
+				node.metadata.used = true;
+			}
 
 			for (const element of elements) {
 				seen.clear();
@@ -153,12 +159,7 @@ export function prune(stylesheet, elements) {
 					// Elements rendered through <svelte:head> are not style-scopable.
 					// Prevent css hash injection (class="s-...") on tags like <meta>, <link>, <script>.
 					!is_inside_svelte_head(element) &&
-					apply_selector(
-						selectors,
-						/** @type {Compiler.AST.CSS.Rule} */ (node.metadata.rule),
-						element,
-						BACKWARD
-					)
+					apply_selector(selectors, rule, element, BACKWARD)
 				) {
 					node.metadata.used = true;
 				}

package/src/compiler/phases/2-analyze/index.js

@@ -14,7 +14,7 @@ import {
 } from '../../utils/ast.js';
 import * as b from '#compiler/builders';
 import { Scope, ScopeRoot, create_scopes, get_rune, set_scope } from '../scope.js';
-import check_graph_for_cycles from './utils/check_graph_for_cycles.js';
+import check_graph_for_cycles from '../../utils/check_graph_for_cycles.js';
 import { create_attribute, is_custom_element_node } from '../nodes.js';
 import { analyze_css } from './css/css-analyze.js';
 import { prune } from './css/css-prune.js';

package/src/compiler/phases/2-analyze/visitors/BindDirective.js

@@ -9,7 +9,7 @@ import { validate_assignment } from './shared/utils.js';
 import * as e from '../../../errors.js';
 import * as w from '../../../warnings.js';
 import { binding_properties } from '../../bindings.js';
-import fuzzymatch from '../../1-parse/utils/fuzzymatch.js';
+import fuzzymatch from '../../../utils/fuzzymatch.js';
 import { is_content_editable_binding, is_svg } from '../../../../utils.js';
 import { mark_subtree_dynamic } from './shared/fragment.js';
 

package/src/compiler/phases/2-analyze/visitors/ClassDeclaration.js

@@ -1,7 +1,7 @@
 /** @import { ClassDeclaration } from 'estree' */
 /** @import { Context } from '../types' */
 import * as w from '../../../warnings.js';
-import { validate_identifier_name } from './shared/utils.js';
+import { validate_identifier_name } from '../../scope.js';
 
 /**
  * @param {ClassDeclaration} node

package/src/compiler/phases/2-analyze/visitors/FunctionDeclaration.js

@@ -1,7 +1,7 @@
 /** @import { FunctionDeclaration } from 'estree' */
 /** @import { Context } from '../types' */
 import { visit_function } from './shared/function.js';
-import { validate_identifier_name } from './shared/utils.js';
+import { validate_identifier_name } from '../../scope.js';
 
 /**
  * @param {FunctionDeclaration} node

package/src/compiler/phases/2-analyze/visitors/Identifier.js

@@ -1,12 +1,11 @@
 /** @import { Expression, Identifier } from 'estree' */
 /** @import { Context } from '../types' */
 import is_reference from 'is-reference';
-import { should_proxy } from '../../3-transform/client/utils.js';
+import { should_proxy, get_rune } from '../../scope.js';
 import * as e from '../../../errors.js';
 import * as w from '../../../warnings.js';
 import { is_rune } from '../../../../utils.js';
 import { mark_subtree_dynamic } from './shared/fragment.js';
-import { get_rune } from '../../scope.js';
 import { is_component_node } from '../../nodes.js';
 
 /**

package/src/compiler/phases/2-analyze/visitors/LetDirective.js

@@ -1,6 +1,7 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
 import * as e from '../../../errors.js';
+import { determine_slot } from '../../../utils/slot.js';
 
 /**
  * @param {AST.LetDirective} node
@@ -21,4 +22,25 @@ export function LetDirective(node, context) {
 	) {
 		e.let_directive_invalid_placement(node);
 	}
+
+	// an explicit `children` snippet replaces the default slot content, so the `let:`
+	// directive would never be provided. if the component has a `slot` attribute, the
+	// directive applies to the component itself instead, which is fine
+	if (
+		(parent.type === 'Component' ||
+			parent.type === 'SvelteComponent' ||
+			parent.type === 'SvelteSelf') &&
+		!determine_slot(parent) &&
+		parent.fragment.nodes.some(
+			(child) => child.type === 'SnippetBlock' && child.expression.name === 'children'
+		)
+	) {
+		const { expression } = node;
+		const pattern =
+			expression === null || (expression.type === 'Identifier' && expression.name === node.name)
+				? node.name
+				: `${node.name}: ${context.state.analysis.source.slice(expression.start, expression.end)}`;
+
+		e.let_directive_snippet_conflict(node, pattern);
+	}
 }

package/src/compiler/phases/2-analyze/visitors/SvelteBody.js

@@ -2,7 +2,7 @@
 /** @import { Context } from '../types' */
 import * as e from '../../../errors.js';
 import { is_event_attribute } from '../../../utils/ast.js';
-import { disallow_children } from './shared/special-element.js';
+import { disallow_children } from '../../nodes.js';
 import { check_global_event_reference } from './shared/utils.js';
 
 /**

package/src/compiler/phases/2-analyze/visitors/SvelteDocument.js

@@ -1,6 +1,6 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
-import { disallow_children } from './shared/special-element.js';
+import { disallow_children } from '../../nodes.js';
 import * as e from '../../../errors.js';
 import { is_event_attribute } from '../../../utils/ast.js';
 import { check_global_event_reference } from './shared/utils.js';

package/src/compiler/phases/2-analyze/visitors/SvelteWindow.js

@@ -1,6 +1,6 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
-import { disallow_children } from './shared/special-element.js';
+import { disallow_children } from '../../nodes.js';
 import * as e from '../../../errors.js';
 import { is_event_attribute } from '../../../utils/ast.js';
 import { check_global_event_reference } from './shared/utils.js';

package/src/compiler/phases/2-analyze/visitors/VariableDeclarator.js

@@ -1,8 +1,8 @@
 /** @import { Expression, Identifier, Literal, VariableDeclarator } from 'estree' */
 /** @import { Binding } from '#compiler' */
 /** @import { Context } from '../types' */
-import { get_rune } from '../../scope.js';
-import { ensure_no_module_import_conflict, validate_identifier_name } from './shared/utils.js';
+import { get_rune, validate_identifier_name } from '../../scope.js';
+import { ensure_no_module_import_conflict } from './shared/utils.js';
 import * as e from '../../../errors.js';
 import * as w from '../../../warnings.js';
 import { extract_paths } from '../../../utils/ast.js';

package/src/compiler/phases/2-analyze/visitors/shared/a11y/constants.js

@@ -4,7 +4,7 @@ import { roles as roles_map, elementRoles } from 'aria-query';
 import { AXObjects, elementAXObjects } from 'axobject-query';
 
 export const aria_attributes =
-	'activedescendant atomic autocomplete busy checked colcount colindex colspan controls current describedby description details disabled dropeffect errormessage expanded flowto grabbed haspopup hidden invalid keyshortcuts label labelledby level live modal multiline multiselectable orientation owns placeholder posinset pressed readonly relevant required roledescription rowcount rowindex rowspan selected setsize sort valuemax valuemin valuenow valuetext'.split(
+	'activedescendant atomic autocomplete braillelabel brailleroledescription busy checked colcount colindex colspan controls current describedby description details disabled dropeffect errormessage expanded flowto grabbed haspopup hidden invalid keyshortcuts label labelledby level live modal multiline multiselectable orientation owns placeholder posinset pressed readonly relevant required roledescription rowcount rowindex rowspan selected setsize sort valuemax valuemin valuenow valuetext'.split(
 		' '
 	);
 

package/src/compiler/phases/2-analyze/visitors/shared/a11y/index.js

@@ -45,7 +45,7 @@ import {
 import { is_event_attribute, is_text_attribute } from '../../../../../utils/ast.js';
 import { list } from '../../../../../utils/string.js';
 import { walk } from 'zimmerframe';
-import fuzzymatch from '../../../../1-parse/utils/fuzzymatch.js';
+import fuzzymatch from '../../../../../utils/fuzzymatch.js';
 import { is_content_editable_binding } from '../../../../../../utils.js';
 import * as w from '../../../../../warnings.js';
 
@@ -173,8 +173,8 @@ export function check_element(node, context) {
 						current_role === get_implicit_role(node.name, attribute_map) &&
 						// <ul role="list"> is ok because CSS list-style:none removes the semantics and this is a way to bring them back
 						!['ul', 'ol', 'li', 'menu'].includes(node.name) &&
-						// <a role="link" /> is ok because without href the a tag doesn't have a role of link
-						!(node.name === 'a' && !attribute_map.has('href'))
+						// <a role="link" /> and <area role="link" /> are ok because without href they don't have a role of link
+						!((node.name === 'a' || node.name === 'area') && !attribute_map.has('href'))
 					) {
 						w.a11y_no_redundant_roles(attribute, current_role);
 					}

package/src/compiler/phases/2-analyze/visitors/shared/utils.js

@@ -246,44 +246,6 @@ export function is_pure(node, context) {
 	return false;
 }
 
-/**
- * Checks if the name is valid, which it is when it's not starting with (or is) a dollar sign or if it's a function parameter.
- * The second argument is the depth of the scope, which is there for backwards compatibility reasons: In Svelte 4, you
- * were allowed to define `$`-prefixed variables anywhere below the top level of components. Once legacy mode is gone, this
- * argument can be removed / the call sites adjusted accordingly.
- * @param {Binding | null} binding
- * @param {number | undefined} [function_depth]
- */
-export function validate_identifier_name(binding, function_depth) {
-	if (!binding) return;
-
-	const declaration_kind = binding.declaration_kind;
-
-	if (
-		declaration_kind !== 'synthetic' &&
-		declaration_kind !== 'param' &&
-		declaration_kind !== 'rest_param' &&
-		(!function_depth || function_depth <= 1)
-	) {
-		const node = binding.node;
-
-		if (node.name === '$') {
-			e.dollar_binding_invalid(node);
-		} else if (
-			node.name.startsWith('$') &&
-			// import type { $Type } from "" - these are normally already filtered out,
-			// but for the migration they aren't, and throwing here is preventing the migration to complete
-			// TODO -> once migration script is gone we can remove this check
-			!(
-				binding.initial?.type === 'ImportDeclaration' &&
-				/** @type {any} */ (binding.initial).importKind === 'type'
-			)
-		) {
-			e.dollar_prefix_invalid(node);
-		}
-	}
-}
-
 /**
  * Checks that the exported name is not a derived or reassigned state variable.
  * @param {Node} node

package/src/compiler/phases/3-transform/client/utils.js

@@ -127,44 +127,6 @@ export function is_prop_source(binding, state) {
 	);
 }
 
-/**
- * @param {Expression} node
- * @param {Scope | null} scope
- */
-export function should_proxy(node, scope) {
-	if (
-		!node ||
-		node.type === 'Literal' ||
-		node.type === 'TemplateLiteral' ||
-		node.type === 'ArrowFunctionExpression' ||
-		node.type === 'FunctionExpression' ||
-		node.type === 'UnaryExpression' ||
-		node.type === 'BinaryExpression' ||
-		(node.type === 'Identifier' && node.name === 'undefined')
-	) {
-		return false;
-	}
-
-	if (node.type === 'Identifier' && scope !== null) {
-		const binding = scope.get(node.name);
-		// Let's see if the reference is something that can be proxied
-		if (
-			binding !== null &&
-			!binding.reassigned &&
-			binding.initial !== null &&
-			binding.initial.type !== 'FunctionDeclaration' &&
-			binding.initial.type !== 'ClassDeclaration' &&
-			binding.initial.type !== 'ImportDeclaration' &&
-			binding.initial.type !== 'EachBlock' &&
-			binding.initial.type !== 'SnippetBlock'
-		) {
-			return should_proxy(binding.initial, null);
-		}
-	}
-
-	return true;
-}
-
 /**
  * An async thunk. If an `await` inside restores the reaction context via `$.save`,
  * the body exits through `$.unsave` so the context cannot leak into foreign microtasks

package/src/compiler/phases/3-transform/client/visitors/AssignmentExpression.js

@@ -9,10 +9,10 @@ import {
 	is_expression_async
 } from '../../../../utils/ast.js';
 import { dev, locate_node } from '../../../../state.js';
-import { build_getter, should_proxy } from '../utils.js';
+import { build_getter } from '../utils.js';
+import { should_proxy, get_rune } from '../../../scope.js';
 import { visit_assignment_expression } from '../../shared/assignments.js';
 import { validate_mutation } from './shared/utils.js';
-import { get_rune } from '../../../scope.js';
 import { get_name } from '../../../nodes.js';
 
 /**

package/src/compiler/phases/3-transform/client/visitors/AwaitExpression.js

@@ -18,7 +18,8 @@ export function AwaitExpression(node, context) {
 	// in dev, note which values are read inside a reactive expression,
 	// but don't track them
 	else if (dev && !is_ignored(node, 'await_reactivity_loss')) {
-		return b.call(b.await(b.call('$.track_reactivity_loss', argument)));
+		// don't use b.await here, this way we preserve location information
+		return b.call({ ...node, argument: b.call('$.track_reactivity_loss', argument) });
 	}
 
 	return argument === node.argument ? node : { ...node, argument };

package/src/compiler/phases/3-transform/client/visitors/CallExpression.js

@@ -2,8 +2,7 @@
 /** @import { Context } from '../types' */
 import { dev, is_ignored } from '../../../../state.js';
 import * as b from '#compiler/builders';
-import { get_rune } from '../../../scope.js';
-import { should_proxy } from '../utils.js';
+import { get_rune, should_proxy } from '../../../scope.js';
 import { get_inspect_args } from '../../utils.js';
 
 /**

package/src/compiler/phases/3-transform/client/visitors/VariableDeclaration.js

@@ -5,14 +5,8 @@ import { dev, is_ignored, locate_node } from '../../../../state.js';
 import { extract_paths, save } from '../../../../utils/ast.js';
 import * as b from '#compiler/builders';
 import * as assert from '../../../../utils/assert.js';
-import { get_rune } from '../../../scope.js';
-import {
-	async_thunk,
-	get_prop_source,
-	is_prop_source,
-	is_state_source,
-	should_proxy
-} from '../utils.js';
+import { get_rune, should_proxy } from '../../../scope.js';
+import { async_thunk, get_prop_source, is_prop_source, is_state_source } from '../utils.js';
 import { get_value } from './shared/declarations.js';
 
 /**
@@ -35,6 +29,7 @@ export function VariableDeclaration(node, context) {
 				rune === '$inspect' ||
 				rune === '$inspect.trace' ||
 				rune === '$state.snapshot' ||
+				rune === '$state.eager' ||
 				rune === '$host'
 			) {
 				declarations.push(/** @type {VariableDeclarator} */ (context.visit(declarator)));

package/src/compiler/phases/3-transform/client/visitors/shared/events.js

@@ -119,8 +119,9 @@ export function build_event_handler(node, metadata, context) {
 
 		// local variable can be assigned directly
 		// except in dev mode where when need $.apply()
-		// in order to handle warnings.
-		if (!dev && binding?.declaration_kind !== 'import') {
+		// in order to handle warnings, or when it is
+		// assigned after a top-level `await`
+		if (!dev && binding?.declaration_kind !== 'import' && !binding?.blocker) {
 			return handler;
 		}
 	}

package/src/compiler/phases/3-transform/server/visitors/shared/element.js

@@ -80,6 +80,14 @@ export function build_element_attributes(node, context, transform) {
 				) {
 					events_to_capture.add(attribute.name);
 				}
+			} else if (
+				node.type === 'RegularElement' &&
+				node.name === 'input' &&
+				(attribute.name === 'defaultValue' || attribute.name === 'defaultChecked')
+			) {
+				attributes.push(attribute);
+				// deopt to spread at runtime, where we can handle interaction of value/defaultValue etc
+				has_spread = true;
 				// the defaultValue/defaultChecked properties don't exist as attributes
 			} else if (attribute.name !== 'defaultValue' && attribute.name !== 'defaultChecked') {
 				if (attribute.name === 'class') {

package/src/compiler/phases/3-transform/utils.js

@@ -9,7 +9,7 @@ import {
 import * as e from '../../errors.js';
 import { walk } from 'zimmerframe';
 import { extract_identifiers } from '../../utils/ast.js';
-import check_graph_for_cycles from '../2-analyze/utils/check_graph_for_cycles.js';
+import check_graph_for_cycles from '../../utils/check_graph_for_cycles.js';
 import is_reference from 'is-reference';
 import { set_scope } from '../scope.js';
 

package/src/compiler/phases/nodes.js

@@ -1,6 +1,7 @@
 /** @import { Expression, PrivateIdentifier, SourceLocation } from 'estree' */
 /** @import { AST, Binding } from '#compiler' */
 import * as b from '#compiler/builders';
+import * as e from '../errors.js';
 
 /**
  * All nodes that can appear elsewhere than the top level, have attributes and can contain children
@@ -45,6 +46,35 @@ export function is_custom_element_node(node) {
 	);
 }
 
+/**
+ * @param {boolean} transparent
+ * @returns {AST.Fragment}
+ */
+export function create_fragment(transparent = false) {
+	return {
+		type: 'Fragment',
+		nodes: [],
+		metadata: {
+			transparent,
+			dynamic: false
+		}
+	};
+}
+
+/**
+ * @param {AST.SvelteBody | AST.SvelteDocument | AST.SvelteOptionsRaw | AST.SvelteWindow} node
+ */
+export function disallow_children(node) {
+	const { nodes } = node.fragment;
+
+	if (nodes.length > 0) {
+		const first = nodes[0];
+		const last = nodes[nodes.length - 1];
+
+		e.svelte_meta_invalid_content({ start: first.start, end: last.end }, node.name);
+	}
+}
+
 /**
  * @param {string} name
  * @param {SourceLocation | null} name_loc

package/src/compiler/phases/scope.js

@@ -14,7 +14,6 @@ import {
 } from '../utils/ast.js';
 import { is_reserved, is_rune } from '../../utils.js';
 import { determine_slot } from '../utils/slot.js';
-import { validate_identifier_name } from './2-analyze/visitors/shared/utils.js';
 
 const UNKNOWN = Symbol('unknown');
 /** Includes `BigInt` */
@@ -1233,6 +1232,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 
 		EachBlock(node, { state, visit }) {
 			visit(node.expression);
+			if (node.fallback) visit(node.fallback);
 
 			// context and children are a new scope
 			const scope = state.scope.child();
@@ -1278,7 +1278,6 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 			for (const child of node.body.nodes) {
 				visit(child, { scope });
 			}
-			if (node.fallback) visit(node.fallback, { scope });
 
 			node.metadata = {
 				expression: new ExpressionMetadata(),
@@ -1344,6 +1343,14 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 			}
 
 			context.next({ scope: child_scope });
+
+			// the parameters and what the body declares end up in the same function
+			const body_scope = /** @type {Scope} */ (scopes.get(node.body));
+			for (const [name, binding] of body_scope.declarations) {
+				if (child_scope.declarations.has(name)) {
+					e.declaration_duplicate(binding.node, name);
+				}
+			}
 		},
 
 		Fragment: (node, context) => {
@@ -1469,3 +1476,79 @@ function get_global_keypath(node, scope) {
 
 	return n.name + joined;
 }
+
+/**
+ * @param {Expression} node
+ * @param {Scope | null} scope
+ */
+export function should_proxy(node, scope) {
+	if (
+		!node ||
+		node.type === 'Literal' ||
+		node.type === 'TemplateLiteral' ||
+		node.type === 'ArrowFunctionExpression' ||
+		node.type === 'FunctionExpression' ||
+		node.type === 'UnaryExpression' ||
+		node.type === 'BinaryExpression' ||
+		(node.type === 'Identifier' && node.name === 'undefined')
+	) {
+		return false;
+	}
+
+	if (node.type === 'Identifier' && scope !== null) {
+		const binding = scope.get(node.name);
+		// Let's see if the reference is something that can be proxied
+		if (
+			binding !== null &&
+			!binding.reassigned &&
+			binding.initial !== null &&
+			binding.initial.type !== 'FunctionDeclaration' &&
+			binding.initial.type !== 'ClassDeclaration' &&
+			binding.initial.type !== 'ImportDeclaration' &&
+			binding.initial.type !== 'EachBlock' &&
+			binding.initial.type !== 'SnippetBlock'
+		) {
+			return should_proxy(binding.initial, null);
+		}
+	}
+
+	return true;
+}
+
+/**
+ * Checks if the name is valid, which it is when it's not starting with (or is) a dollar sign or if it's a function parameter.
+ * The second argument is the depth of the scope, which is there for backwards compatibility reasons: In Svelte 4, you
+ * were allowed to define `$`-prefixed variables anywhere below the top level of components. Once legacy mode is gone, this
+ * argument can be removed / the call sites adjusted accordingly.
+ * @param {Binding | null} binding
+ * @param {number | undefined} [function_depth]
+ */
+export function validate_identifier_name(binding, function_depth) {
+	if (!binding) return;
+
+	const declaration_kind = binding.declaration_kind;
+
+	if (
+		declaration_kind !== 'synthetic' &&
+		declaration_kind !== 'param' &&
+		declaration_kind !== 'rest_param' &&
+		(!function_depth || function_depth <= 1)
+	) {
+		const node = binding.node;
+
+		if (node.name === '$') {
+			e.dollar_binding_invalid(node);
+		} else if (
+			node.name.startsWith('$') &&
+			// import type { $Type } from "" - these are normally already filtered out,
+			// but for the migration they aren't, and throwing here is preventing the migration to complete
+			// TODO -> once migration script is gone we can remove this check
+			!(
+				binding.initial?.type === 'ImportDeclaration' &&
+				/** @type {any} */ (binding.initial).importKind === 'type'
+			)
+		) {
+			e.dollar_prefix_invalid(node);
+		}
+	}
+}

package/src/compiler/print/index.js

@@ -754,7 +754,9 @@ const svelte_visitors = (comments, state) => ({
 		if (node.pending) {
 			context.write('}');
 			block(context, node.pending, state.preserve_whitespace > 0);
-			context.write('{:');
+			if (node.then || node.catch) {
+				context.write('{:');
+			}
 		} else {
 			context.write(' ');
 		}