fix: don't hoist types referencing stores or destructured variables (#…

…2661) #2659 #2660
sveltejs · Jan 10, 2025 · 2f46701 · 2f46701
1 parent 90c9953
commit 2f46701
Show file tree

Hide file tree

Showing 6 changed files with 62 additions and 4 deletions.
diff --git a/packages/svelte-vscode/prettier-options-schema.json b/packages/svelte-vscode/prettier-options-schema.json
@@ -33,7 +33,7 @@
                         "styles-options-scripts-markup",
                         "styles-scripts-markup-options",
                         "styles-scripts-options-markup",
-                        "none",
+                        "none"
                     ]
                 },
                 "svelteStrictMode": {

diff --git a/packages/svelte2tsx/src/svelte2tsx/nodes/HoistableInterfaces.ts b/packages/svelte2tsx/src/svelte2tsx/nodes/HoistableInterfaces.ts
@@ -179,6 +179,19 @@ export class HoistableInterfaces {
             node.declarationList.declarations.forEach((declaration) => {
                 if (ts.isIdentifier(declaration.name)) {
                     this.disallowed_values.add(declaration.name.text);
+                } else {
+                    const walk = (node: ts.Node) => {
+                        if (
+                            ts.isIdentifier(node) &&
+                            ts.isBindingElement(node.parent) &&
+                            node.parent.name === node
+                        ) {
+                            this.disallowed_values.add(node.text);
+                        }
+                        ts.forEachChild(node, walk);
+                    };
+
+                    walk(declaration.name);
                 }
             });
         }
@@ -256,7 +269,7 @@ export class HoistableInterfaces {
                 }
 
                 for (const dep of deps.value_deps) {
-                    if (this.disallowed_values.has(dep)) {
+                    if (!this.isAllowedReference(dep)) {
                         this.disallowed_types.add(interface_name);
                         can_hoist = false;
                         break;
@@ -275,7 +288,7 @@ export class HoistableInterfaces {
                 ...this.props_interface.type_deps,
                 ...this.props_interface.value_deps
             ].every((dep) => {
-                return !this.disallowed_types.has(dep) && !this.disallowed_values.has(dep);
+                return !this.disallowed_types.has(dep) && this.isAllowedReference(dep);
             });
 
             if (can_hoist) {
@@ -333,7 +346,16 @@ export class HoistableInterfaces {
     }
 
     isAllowedReference(reference: string) {
-        return !this.disallowed_values.has(reference);
+        return !(
+            this.disallowed_values.has(reference) ||
+            reference === '$$props' ||
+            reference === '$$restProps' ||
+            reference === '$$slots' ||
+            // could be a $store reference
+            (reference[0] === '$' &&
+                reference[1] !== '$' &&
+                this.disallowed_values.has(reference.slice(1)))
+        );
     }
 
     /**

diff --git a/...ages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-6.v5/expectedv2.ts b/...ages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-6.v5/expectedv2.ts
@@ -0,0 +1,11 @@
+///<reference types="svelte" />
+;function render() {
+
+    let store = null/*Ωignore_startΩ*/;let $store = __sveltets_2_store_get(store);/*Ωignore_endΩ*/;;type $$ComponentProps =  { someProp: typeof $store };
+    let { someProp }:/*Ωignore_startΩ*/$$ComponentProps/*Ωignore_endΩ*/ = $props();
+;
+async () => {};
+return { props: {} as any as $$ComponentProps, exports: {}, bindings: __sveltets_$$bindings(''), slots: {}, events: {} }}
+const Input__SvelteComponent_ = __sveltets_2_fn_component(render());
+type Input__SvelteComponent_ = ReturnType<typeof Input__SvelteComponent_>;
+export default Input__SvelteComponent_;
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-6.v5/input.svelte b/packages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-6.v5/input.svelte
@@ -0,0 +1,4 @@
+<script lang="ts">
+    let store = null;
+    let { someProp }: { someProp: typeof $store } = $props();
+</script>
diff --git a/...ages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-7.v5/expectedv2.ts b/...ages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-7.v5/expectedv2.ts
@@ -0,0 +1,14 @@
+///<reference types="svelte" />
+;function render() {
+
+	let { destructured } = {};
+	type Props = {
+		prop: typeof destructured;
+	};
+	let { prop }: Props = $props();
+;
+async () => {};
+return { props: {} as any as Props, exports: {}, bindings: __sveltets_$$bindings(''), slots: {}, events: {} }}
+const Input__SvelteComponent_ = __sveltets_2_fn_component(render());
+type Input__SvelteComponent_ = ReturnType<typeof Input__SvelteComponent_>;
+export default Input__SvelteComponent_;
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-7.v5/input.svelte b/packages/svelte2tsx/test/svelte2tsx/samples/ts-runes-hoistable-props-false-7.v5/input.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	let { destructured } = {};
+	type Props = {
+		prop: typeof destructured;
+	};
+	let { prop }: Props = $props();
+</script>