svelte2tsx 0.5.21 → 0.5.23

package/index.js

@@ -4932,6 +4932,49 @@ function getNamesFromLabeledStatement(node) {
         // svelte won't let you create a variable with $ prefix (reserved for stores)
         .filter((name) => !name.startsWith('$')));
 }
+/**
+ * move node to top of script so they appear outside our render function
+ */
+function moveNode(node, str, astOffset, scriptStart, sourceFile) {
+    var _a;
+    const scanner = ts__default['default'].createScanner(sourceFile.languageVersion, 
+    /*skipTrivia*/ false, sourceFile.languageVariant);
+    const comments = (_a = ts__default['default'].getLeadingCommentRanges(node.getFullText(), 0)) !== null && _a !== void 0 ? _a : [];
+    if (!comments.some((comment) => comment.hasTrailingNewLine) &&
+        isNewGroup(sourceFile, node, scanner)) {
+        str.appendRight(node.getStart() + astOffset, '\n');
+    }
+    for (const comment of comments) {
+        const commentEnd = node.pos + comment.end + astOffset;
+        str.move(node.pos + comment.pos + astOffset, commentEnd, scriptStart + 1);
+        if (comment.hasTrailingNewLine) {
+            str.overwrite(commentEnd - 1, commentEnd, str.original[commentEnd - 1] + '\n');
+        }
+    }
+    str.move(node.getStart() + astOffset, node.end + astOffset, scriptStart + 1);
+    //add in a \n
+    const originalEndChar = str.original[node.end + astOffset - 1];
+    str.overwrite(node.end + astOffset - 1, node.end + astOffset, originalEndChar + '\n');
+}
+/**
+ * adopted from https://github.com/microsoft/TypeScript/blob/6e0447fdf165b1cec9fc80802abcc15bd23a268f/src/services/organizeImports.ts#L111
+ */
+function isNewGroup(sourceFile, topLevelImportDecl, scanner) {
+    const startPos = topLevelImportDecl.getFullStart();
+    const endPos = topLevelImportDecl.getStart();
+    scanner.setText(sourceFile.text, startPos, endPos - startPos);
+    let numberOfNewLines = 0;
+    while (scanner.getTokenPos() < endPos) {
+        const tokenKind = scanner.scan();
+        if (tokenKind === ts__default['default'].SyntaxKind.NewLineTrivia) {
+            numberOfNewLines++;
+            if (numberOfNewLines >= 2) {
+                return true;
+            }
+        }
+    }
+    return false;
+}
 
 function is$$EventsDeclaration(node) {
     return isInterfaceOrTypeDeclaration(node) && node.name.text === '$$Events';
@@ -5353,6 +5396,9 @@ class ExportedNames {
     constructor(str, astOffset) {
         this.str = str;
         this.astOffset = astOffset;
+        /**
+         * Uses the $$Props type
+         */
         this.uses$$Props = false;
         this.exports = new Map();
         this.possibleExports = new Map();
@@ -5488,7 +5534,11 @@ class ExportedNames {
     }
     createClassGetters() {
         return Array.from(this.getters)
-            .map((name) => `\n    get ${name}() { return this.$$prop_def.${name} }`)
+            .map((name) => 
+        // getters are const/classes/functions, which are always defined.
+        // We have to remove the `| undefined` from the type here because it was necessary to
+        // be added in a previous step so people are not expected to provide these as props.
+        `\n    get ${name}() { return __sveltets_2_nonNullable(this.$$prop_def.${name}) }`)
             .join('');
     }
     createClassAccessors() {
@@ -5581,8 +5631,9 @@ class ExportedNames {
      * Creates a string from the collected props
      *
      * @param isTsFile Whether this is a TypeScript file or not.
+     * @param uses$$propsValue whether the file references the $$props variable
      */
-    createPropsStr(isTsFile) {
+    createPropsStr(isTsFile, uses$$propsValue) {
         const names = Array.from(this.exports.entries());
         if (this.uses$$Props) {
             const lets = names.filter(([, { isLet }]) => isLet);
@@ -5608,7 +5659,7 @@ class ExportedNames {
                 this.createReturnElementsType(others).join(',') +
                 '}}');
         }
-        if (names.length === 0) {
+        if (names.length === 0 && !uses$$propsValue) {
             // Necessary, because {} roughly equals to any
             return isTsFile
                 ? '{} as Record<string, never>'
@@ -6332,6 +6383,7 @@ class Generics {
         this.str = str;
         this.astOffset = astOffset;
         this.definitions = [];
+        this.typeReferences = [];
         this.references = [];
     }
     addIfIsGeneric(node) {
@@ -6341,10 +6393,12 @@ class Generics {
                 throw new Error('Invalid $$Generic declaration: Only one type argument allowed');
             }
             if (((_b = node.type.typeArguments) === null || _b === void 0 ? void 0 : _b.length) === 1) {
-                this.definitions.push(`${node.name.text} extends ${node.type.typeArguments[0].getText()}`);
+                const typeReference = node.type.typeArguments[0].getText();
+                this.typeReferences.push(typeReference);
+                this.definitions.push(`${node.name.text} extends ${typeReference}`);
             }
             else {
-                this.definitions.push(`${node.name.text}`);
+                this.definitions.push(node.name.text);
             }
             this.references.push(node.name.text);
             this.str.remove(this.astOffset + node.getStart(), this.astOffset + node.getEnd());
@@ -6360,6 +6414,9 @@ class Generics {
             ts__default['default'].isIdentifier(node.typeName) &&
             node.typeName.text === '$$Generic');
     }
+    getTypeReferences() {
+        return this.typeReferences;
+    }
     toDefinitionString(addIgnore = false) {
         const surround = addIgnore ? surroundWithIgnoreComments : (str) => str;
         return this.definitions.length ? surround(`<${this.definitions.join(',')}>`) : '';
@@ -6376,44 +6433,7 @@ class Generics {
  * move imports to top of script so they appear outside our render function
  */
 function handleImportDeclaration(node, str, astOffset, scriptStart, sourceFile) {
-    var _a;
-    const scanner = ts__default['default'].createScanner(sourceFile.languageVersion, 
-    /*skipTrivia*/ false, sourceFile.languageVariant);
-    const comments = (_a = ts__default['default'].getLeadingCommentRanges(node.getFullText(), 0)) !== null && _a !== void 0 ? _a : [];
-    if (!comments.some((comment) => comment.hasTrailingNewLine) &&
-        isNewGroup(sourceFile, node, scanner)) {
-        str.appendRight(node.getStart() + astOffset, '\n');
-    }
-    for (const comment of comments) {
-        const commentEnd = node.pos + comment.end + astOffset;
-        str.move(node.pos + comment.pos + astOffset, commentEnd, scriptStart + 1);
-        if (comment.hasTrailingNewLine) {
-            str.overwrite(commentEnd - 1, commentEnd, str.original[commentEnd - 1] + '\n');
-        }
-    }
-    str.move(node.getStart() + astOffset, node.end + astOffset, scriptStart + 1);
-    //add in a \n
-    const originalEndChar = str.original[node.end + astOffset - 1];
-    str.overwrite(node.end + astOffset - 1, node.end + astOffset, originalEndChar + '\n');
-}
-/**
- * adopted from https://github.com/microsoft/TypeScript/blob/6e0447fdf165b1cec9fc80802abcc15bd23a268f/src/services/organizeImports.ts#L111
- */
-function isNewGroup(sourceFile, topLevelImportDecl, scanner) {
-    const startPos = topLevelImportDecl.getFullStart();
-    const endPos = topLevelImportDecl.getStart();
-    scanner.setText(sourceFile.text, startPos, endPos - startPos);
-    let numberOfNewLines = 0;
-    while (scanner.getTokenPos() < endPos) {
-        const tokenKind = scanner.scan();
-        if (tokenKind === ts__default['default'].SyntaxKind.NewLineTrivia) {
-            numberOfNewLines++;
-            if (numberOfNewLines >= 2) {
-                return true;
-            }
-        }
-    }
-    return false;
+    return moveNode(node, str, astOffset, scriptStart, sourceFile);
 }
 /**
  * ensure it's in a newline.
@@ -6434,6 +6454,56 @@ function handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str) {
     str.appendRight(start + astOffset, '\n' + (hasModuleScript ? '\n' : ''));
 }
 
+function flatten(arr) {
+    return arr.reduce((acc, val) => acc.concat(val), []);
+}
+
+class InterfacesAndTypes {
+    constructor() {
+        this.node = null;
+        this.all = [];
+        this.references = new Map();
+    }
+    add(node) {
+        this.all.push(node);
+    }
+    getNodesWithNames(names) {
+        return this.all.filter((node) => names.includes(node.name.text));
+    }
+    // The following could be used to create a informative error message in case
+    // someone has an interface that both references a generic and is used by one:
+    addReference(reference) {
+        if (!this.node) {
+            return;
+        }
+        const references = this.references.get(this.node) || [];
+        references.push(reference);
+        this.references.set(this.node, references);
+    }
+    getNodesThatReferenceType(name) {
+        const nodes = [];
+        for (const [node, references] of this.references) {
+            if (references.some((r) => r.typeName.getText() === name)) {
+                nodes.push(node);
+            }
+        }
+        return nodes;
+    }
+    getNodesThatRecursivelyReferenceType(name) {
+        let types = [name];
+        const nodes = new Set();
+        while (types.length !== 0) {
+            const newTypes = flatten(types.map((type) => this.getNodesThatReferenceType(type))).filter((t) => !nodes.has(t));
+            newTypes.forEach((t) => nodes.add(t));
+            types = newTypes.map((t) => t.name.text);
+        }
+        return [...nodes.values()];
+    }
+    getNodesThatRecursivelyReferenceTypes(names) {
+        return flatten(names.map((name) => this.getNodesThatRecursivelyReferenceType(name)));
+    }
+}
+
 function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript) {
     const htmlx = str.original;
     const scriptContent = htmlx.substring(script.content.start, script.content.end);
@@ -6441,6 +6511,7 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
     const astOffset = script.content.start;
     const exportedNames = new ExportedNames(str, astOffset);
     const generics = new Generics(str, astOffset);
+    const interfacesAndTypes = new InterfacesAndTypes();
     const implicitTopLevelNames = new ImplicitTopLevelNames(str, astOffset);
     let uses$$props = false;
     let uses$$restProps = false;
@@ -6576,6 +6647,11 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
         if (ts__namespace.isImportSpecifier(node)) {
             implicitStoreValues.addImportStatement(node);
         }
+        if (ts__namespace.isTypeAliasDeclaration(node) || ts__namespace.isInterfaceDeclaration(node)) {
+            interfacesAndTypes.node = node;
+            interfacesAndTypes.add(node);
+            onLeaveCallbacks.push(() => (interfacesAndTypes.node = null));
+        }
         //handle stores etc
         if (ts__namespace.isIdentifier(node)) {
             handleIdentifier(node, parent);
@@ -6611,12 +6687,18 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
     implicitTopLevelNames.modifyCode(rootScope.declared);
     implicitStoreValues.modifyCode(astOffset, str);
     handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str);
+    // move interfaces and types out of the render function if they are referenced
+    // by a $$Generic, otherwise it will be used before being defined after the transformation
+    const nodesToMove = interfacesAndTypes.getNodesWithNames(generics.getTypeReferences());
+    for (const node of nodesToMove) {
+        moveNode(node, str, astOffset, script.start, tsAst);
+    }
     if (mode === 'dts') {
         // Transform interface declarations to type declarations because indirectly
         // using interfaces inside the return type of a function is forbidden.
         // This is not a problem for intellisense/type inference but it will
         // break dts generation (file will not be generated).
-        transformInterfacesToTypes(tsAst, str, astOffset);
+        transformInterfacesToTypes(tsAst, str, astOffset, nodesToMove);
     }
     return {
         exportedNames,
@@ -6628,8 +6710,11 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
         generics
     };
 }
-function transformInterfacesToTypes(tsAst, str, astOffset) {
-    tsAst.statements.filter(ts__namespace.isInterfaceDeclaration).forEach((node) => {
+function transformInterfacesToTypes(tsAst, str, astOffset, movedNodes) {
+    tsAst.statements
+        .filter(ts__namespace.isInterfaceDeclaration)
+        .filter((i) => !movedNodes.includes(i))
+        .forEach((node) => {
         var _a;
         str.overwrite(node.getStart() + astOffset, node.getStart() + astOffset + 'interface'.length, 'type');
         if ((_a = node.heritageClauses) === null || _a === void 0 ? void 0 : _a.length) {
@@ -6904,7 +6989,7 @@ function createRenderFunction({ str, scriptTag, scriptDestination, slots, events
             })
                 .join(', ') +
             '}';
-    const returnString = `\nreturn { props: ${exportedNames.createPropsStr(isTsFile)}` +
+    const returnString = `\nreturn { props: ${exportedNames.createPropsStr(isTsFile, uses$$props)}` +
         `, slots: ${slotsAsDef}` +
         `, events: ${events.toDefString()} }}`;
     // wrap template with callback

package/index.mjs

@@ -4902,6 +4902,49 @@ function getNamesFromLabeledStatement(node) {
         // svelte won't let you create a variable with $ prefix (reserved for stores)
         .filter((name) => !name.startsWith('$')));
 }
+/**
+ * move node to top of script so they appear outside our render function
+ */
+function moveNode(node, str, astOffset, scriptStart, sourceFile) {
+    var _a;
+    const scanner = ts__default.createScanner(sourceFile.languageVersion, 
+    /*skipTrivia*/ false, sourceFile.languageVariant);
+    const comments = (_a = ts__default.getLeadingCommentRanges(node.getFullText(), 0)) !== null && _a !== void 0 ? _a : [];
+    if (!comments.some((comment) => comment.hasTrailingNewLine) &&
+        isNewGroup(sourceFile, node, scanner)) {
+        str.appendRight(node.getStart() + astOffset, '\n');
+    }
+    for (const comment of comments) {
+        const commentEnd = node.pos + comment.end + astOffset;
+        str.move(node.pos + comment.pos + astOffset, commentEnd, scriptStart + 1);
+        if (comment.hasTrailingNewLine) {
+            str.overwrite(commentEnd - 1, commentEnd, str.original[commentEnd - 1] + '\n');
+        }
+    }
+    str.move(node.getStart() + astOffset, node.end + astOffset, scriptStart + 1);
+    //add in a \n
+    const originalEndChar = str.original[node.end + astOffset - 1];
+    str.overwrite(node.end + astOffset - 1, node.end + astOffset, originalEndChar + '\n');
+}
+/**
+ * adopted from https://github.com/microsoft/TypeScript/blob/6e0447fdf165b1cec9fc80802abcc15bd23a268f/src/services/organizeImports.ts#L111
+ */
+function isNewGroup(sourceFile, topLevelImportDecl, scanner) {
+    const startPos = topLevelImportDecl.getFullStart();
+    const endPos = topLevelImportDecl.getStart();
+    scanner.setText(sourceFile.text, startPos, endPos - startPos);
+    let numberOfNewLines = 0;
+    while (scanner.getTokenPos() < endPos) {
+        const tokenKind = scanner.scan();
+        if (tokenKind === ts__default.SyntaxKind.NewLineTrivia) {
+            numberOfNewLines++;
+            if (numberOfNewLines >= 2) {
+                return true;
+            }
+        }
+    }
+    return false;
+}
 
 function is$$EventsDeclaration(node) {
     return isInterfaceOrTypeDeclaration(node) && node.name.text === '$$Events';
@@ -5323,6 +5366,9 @@ class ExportedNames {
     constructor(str, astOffset) {
         this.str = str;
         this.astOffset = astOffset;
+        /**
+         * Uses the $$Props type
+         */
         this.uses$$Props = false;
         this.exports = new Map();
         this.possibleExports = new Map();
@@ -5458,7 +5504,11 @@ class ExportedNames {
     }
     createClassGetters() {
         return Array.from(this.getters)
-            .map((name) => `\n    get ${name}() { return this.$$prop_def.${name} }`)
+            .map((name) => 
+        // getters are const/classes/functions, which are always defined.
+        // We have to remove the `| undefined` from the type here because it was necessary to
+        // be added in a previous step so people are not expected to provide these as props.
+        `\n    get ${name}() { return __sveltets_2_nonNullable(this.$$prop_def.${name}) }`)
             .join('');
     }
     createClassAccessors() {
@@ -5551,8 +5601,9 @@ class ExportedNames {
      * Creates a string from the collected props
      *
      * @param isTsFile Whether this is a TypeScript file or not.
+     * @param uses$$propsValue whether the file references the $$props variable
      */
-    createPropsStr(isTsFile) {
+    createPropsStr(isTsFile, uses$$propsValue) {
         const names = Array.from(this.exports.entries());
         if (this.uses$$Props) {
             const lets = names.filter(([, { isLet }]) => isLet);
@@ -5578,7 +5629,7 @@ class ExportedNames {
                 this.createReturnElementsType(others).join(',') +
                 '}}');
         }
-        if (names.length === 0) {
+        if (names.length === 0 && !uses$$propsValue) {
             // Necessary, because {} roughly equals to any
             return isTsFile
                 ? '{} as Record<string, never>'
@@ -6302,6 +6353,7 @@ class Generics {
         this.str = str;
         this.astOffset = astOffset;
         this.definitions = [];
+        this.typeReferences = [];
         this.references = [];
     }
     addIfIsGeneric(node) {
@@ -6311,10 +6363,12 @@ class Generics {
                 throw new Error('Invalid $$Generic declaration: Only one type argument allowed');
             }
             if (((_b = node.type.typeArguments) === null || _b === void 0 ? void 0 : _b.length) === 1) {
-                this.definitions.push(`${node.name.text} extends ${node.type.typeArguments[0].getText()}`);
+                const typeReference = node.type.typeArguments[0].getText();
+                this.typeReferences.push(typeReference);
+                this.definitions.push(`${node.name.text} extends ${typeReference}`);
             }
             else {
-                this.definitions.push(`${node.name.text}`);
+                this.definitions.push(node.name.text);
             }
             this.references.push(node.name.text);
             this.str.remove(this.astOffset + node.getStart(), this.astOffset + node.getEnd());
@@ -6330,6 +6384,9 @@ class Generics {
             ts__default.isIdentifier(node.typeName) &&
             node.typeName.text === '$$Generic');
     }
+    getTypeReferences() {
+        return this.typeReferences;
+    }
     toDefinitionString(addIgnore = false) {
         const surround = addIgnore ? surroundWithIgnoreComments : (str) => str;
         return this.definitions.length ? surround(`<${this.definitions.join(',')}>`) : '';
@@ -6346,44 +6403,7 @@ class Generics {
  * move imports to top of script so they appear outside our render function
  */
 function handleImportDeclaration(node, str, astOffset, scriptStart, sourceFile) {
-    var _a;
-    const scanner = ts__default.createScanner(sourceFile.languageVersion, 
-    /*skipTrivia*/ false, sourceFile.languageVariant);
-    const comments = (_a = ts__default.getLeadingCommentRanges(node.getFullText(), 0)) !== null && _a !== void 0 ? _a : [];
-    if (!comments.some((comment) => comment.hasTrailingNewLine) &&
-        isNewGroup(sourceFile, node, scanner)) {
-        str.appendRight(node.getStart() + astOffset, '\n');
-    }
-    for (const comment of comments) {
-        const commentEnd = node.pos + comment.end + astOffset;
-        str.move(node.pos + comment.pos + astOffset, commentEnd, scriptStart + 1);
-        if (comment.hasTrailingNewLine) {
-            str.overwrite(commentEnd - 1, commentEnd, str.original[commentEnd - 1] + '\n');
-        }
-    }
-    str.move(node.getStart() + astOffset, node.end + astOffset, scriptStart + 1);
-    //add in a \n
-    const originalEndChar = str.original[node.end + astOffset - 1];
-    str.overwrite(node.end + astOffset - 1, node.end + astOffset, originalEndChar + '\n');
-}
-/**
- * adopted from https://github.com/microsoft/TypeScript/blob/6e0447fdf165b1cec9fc80802abcc15bd23a268f/src/services/organizeImports.ts#L111
- */
-function isNewGroup(sourceFile, topLevelImportDecl, scanner) {
-    const startPos = topLevelImportDecl.getFullStart();
-    const endPos = topLevelImportDecl.getStart();
-    scanner.setText(sourceFile.text, startPos, endPos - startPos);
-    let numberOfNewLines = 0;
-    while (scanner.getTokenPos() < endPos) {
-        const tokenKind = scanner.scan();
-        if (tokenKind === ts__default.SyntaxKind.NewLineTrivia) {
-            numberOfNewLines++;
-            if (numberOfNewLines >= 2) {
-                return true;
-            }
-        }
-    }
-    return false;
+    return moveNode(node, str, astOffset, scriptStart, sourceFile);
 }
 /**
  * ensure it's in a newline.
@@ -6404,6 +6424,56 @@ function handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str) {
     str.appendRight(start + astOffset, '\n' + (hasModuleScript ? '\n' : ''));
 }
 
+function flatten(arr) {
+    return arr.reduce((acc, val) => acc.concat(val), []);
+}
+
+class InterfacesAndTypes {
+    constructor() {
+        this.node = null;
+        this.all = [];
+        this.references = new Map();
+    }
+    add(node) {
+        this.all.push(node);
+    }
+    getNodesWithNames(names) {
+        return this.all.filter((node) => names.includes(node.name.text));
+    }
+    // The following could be used to create a informative error message in case
+    // someone has an interface that both references a generic and is used by one:
+    addReference(reference) {
+        if (!this.node) {
+            return;
+        }
+        const references = this.references.get(this.node) || [];
+        references.push(reference);
+        this.references.set(this.node, references);
+    }
+    getNodesThatReferenceType(name) {
+        const nodes = [];
+        for (const [node, references] of this.references) {
+            if (references.some((r) => r.typeName.getText() === name)) {
+                nodes.push(node);
+            }
+        }
+        return nodes;
+    }
+    getNodesThatRecursivelyReferenceType(name) {
+        let types = [name];
+        const nodes = new Set();
+        while (types.length !== 0) {
+            const newTypes = flatten(types.map((type) => this.getNodesThatReferenceType(type))).filter((t) => !nodes.has(t));
+            newTypes.forEach((t) => nodes.add(t));
+            types = newTypes.map((t) => t.name.text);
+        }
+        return [...nodes.values()];
+    }
+    getNodesThatRecursivelyReferenceTypes(names) {
+        return flatten(names.map((name) => this.getNodesThatRecursivelyReferenceType(name)));
+    }
+}
+
 function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript) {
     const htmlx = str.original;
     const scriptContent = htmlx.substring(script.content.start, script.content.end);
@@ -6411,6 +6481,7 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
     const astOffset = script.content.start;
     const exportedNames = new ExportedNames(str, astOffset);
     const generics = new Generics(str, astOffset);
+    const interfacesAndTypes = new InterfacesAndTypes();
     const implicitTopLevelNames = new ImplicitTopLevelNames(str, astOffset);
     let uses$$props = false;
     let uses$$restProps = false;
@@ -6546,6 +6617,11 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
         if (ts.isImportSpecifier(node)) {
             implicitStoreValues.addImportStatement(node);
         }
+        if (ts.isTypeAliasDeclaration(node) || ts.isInterfaceDeclaration(node)) {
+            interfacesAndTypes.node = node;
+            interfacesAndTypes.add(node);
+            onLeaveCallbacks.push(() => (interfacesAndTypes.node = null));
+        }
         //handle stores etc
         if (ts.isIdentifier(node)) {
             handleIdentifier(node, parent);
@@ -6581,12 +6657,18 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
     implicitTopLevelNames.modifyCode(rootScope.declared);
     implicitStoreValues.modifyCode(astOffset, str);
     handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str);
+    // move interfaces and types out of the render function if they are referenced
+    // by a $$Generic, otherwise it will be used before being defined after the transformation
+    const nodesToMove = interfacesAndTypes.getNodesWithNames(generics.getTypeReferences());
+    for (const node of nodesToMove) {
+        moveNode(node, str, astOffset, script.start, tsAst);
+    }
     if (mode === 'dts') {
         // Transform interface declarations to type declarations because indirectly
         // using interfaces inside the return type of a function is forbidden.
         // This is not a problem for intellisense/type inference but it will
         // break dts generation (file will not be generated).
-        transformInterfacesToTypes(tsAst, str, astOffset);
+        transformInterfacesToTypes(tsAst, str, astOffset, nodesToMove);
     }
     return {
         exportedNames,
@@ -6598,8 +6680,11 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
         generics
     };
 }
-function transformInterfacesToTypes(tsAst, str, astOffset) {
-    tsAst.statements.filter(ts.isInterfaceDeclaration).forEach((node) => {
+function transformInterfacesToTypes(tsAst, str, astOffset, movedNodes) {
+    tsAst.statements
+        .filter(ts.isInterfaceDeclaration)
+        .filter((i) => !movedNodes.includes(i))
+        .forEach((node) => {
         var _a;
         str.overwrite(node.getStart() + astOffset, node.getStart() + astOffset + 'interface'.length, 'type');
         if ((_a = node.heritageClauses) === null || _a === void 0 ? void 0 : _a.length) {
@@ -6874,7 +6959,7 @@ function createRenderFunction({ str, scriptTag, scriptDestination, slots, events
             })
                 .join(', ') +
             '}';
-    const returnString = `\nreturn { props: ${exportedNames.createPropsStr(isTsFile)}` +
+    const returnString = `\nreturn { props: ${exportedNames.createPropsStr(isTsFile, uses$$props)}` +
         `, slots: ${slotsAsDef}` +
         `, events: ${events.toDefString()} }}`;
     // wrap template with callback

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte2tsx",
-  "version": "0.5.21",
+  "version": "0.5.23",
   "description": "Convert Svelte components to TSX for type checking",
   "author": "David Pershouse",
   "license": "MIT",

package/svelte-html-do-not-use.d.ts

@@ -87,7 +87,7 @@ export interface DOMAttributes<T extends EventTarget> {
 	'on:reset'?: FormEventHandler<T> | undefined | null;
 	'on:submit'?: EventHandler<Event, T> | undefined | null; // TODO make this SubmitEvent once we require TS>=4.4
 	'on:invalid'?: EventHandler<Event, T> | undefined | null;
-
+	'on:formdata'?: EventHandler<Event & { readonly formData: FormData; }, T> | undefined | null; // TODO make this FormDataEvent once we require TS>=4.4
 
 	// Image Events
 	'on:load'?: EventHandler | undefined | null;
@@ -538,6 +538,12 @@ export interface HTMLAttributes<T extends EventTarget> extends AriaAttributes, D
 	 * Elements with the contenteditable attribute support innerHTML and textContent bindings.
 	 */
 	'bind:textContent'?: string | undefined | null;
+
+	// SvelteKit
+	'data-sveltekit-noscroll'?: true | '' | 'off' | undefined | null;
+	'data-sveltekit-preload-code'?: true | '' | 'eager' | 'viewport' | 'hover' | 'tap' | 'off' | undefined | null;
+	'data-sveltekit-preload-data'?: true | '' | 'hover' | 'tap' | 'off' | undefined | null;
+	'data-sveltekit-reload'?: true | '' | 'off' | undefined | null;
 }
 
 export type HTMLAttributeAnchorTarget =
@@ -558,12 +564,6 @@ export interface HTMLAnchorAttributes extends HTMLAttributes<HTMLAnchorElement>
 	type?: string | undefined | null;
 	referrerpolicy?: ReferrerPolicy | undefined | null;
 
-	// SvelteKit
-	'data-sveltekit-noscroll'?: true | undefined | null;
-	'data-sveltekit-preload-code'?: true | 'eager' | 'viewport' | 'hover' | 'tap' | 'off' | undefined | null;
-	'data-sveltekit-preload-data'?: true | 'hover' | 'tap' | 'off' | undefined | null;
-	'data-sveltekit-reload'?: true | undefined | null;
-
 	// Sapper
 	'sapper:noscroll'?: true | undefined | null;
 	'sapper:prefetch'?: true | undefined | null;

package/svelte-jsx.d.ts

@@ -348,6 +348,7 @@ declare namespace svelte.JSX {
       onsubmit?: EventHandler<SubmitEvent, T> | undefined | null;
       oninvalid?: EventHandler<Event, T> | undefined | null;
       onbeforeinput?: EventHandler<InputEvent, T> | undefined | null;
+      'on:formdata'?: EventHandler<FormDataEvent, T> | undefined | null;
 
       // Image Events
       onload?: EventHandler | undefined | null;
@@ -838,6 +839,11 @@ declare namespace svelte.JSX {
       results?: number | undefined | null;
       security?: string | undefined | null;
       unselectable?: boolean | undefined | null;
+      
+      'data-sveltekit-noscroll'?: true | '' | 'off' | undefined | null;
+      'data-sveltekit-preload-code'?: true | '' | 'eager' | 'viewport' | 'hover' | 'tap' | 'off' | undefined | null;
+      'data-sveltekit-preload-data'?: true | '' | 'hover' | 'tap' | 'off' | undefined | null;
+      'data-sveltekit-reload'?: true | '' | 'off' | undefined | null;
     }
 
     // this list is "complete" in that it contains every SVG attribute
@@ -1175,13 +1181,6 @@ declare namespace svelte.JSX {
         sapperPrefetch?: true | undefined | null;
     }
 
-    interface SvelteKitAnchorProps {
-        'data-sveltekit-noscroll'?: true | undefined | null;
-        'data-sveltekit-preload-code'?: true | 'eager' | 'viewport' | 'hover' | 'tap' | 'off' | undefined | null;
-        'data-sveltekit-preload-data'?: true | 'hover' | 'tap' | 'off' | undefined | null;
-        'data-sveltekit-reload'?: true | undefined | null;
-    }
-
     interface SvelteMediaTimeRange {
         start: number;
         end: number;
@@ -1220,7 +1219,7 @@ declare namespace svelte.JSX {
 
     interface IntrinsicElements {
       // HTML
-      a: HTMLProps<HTMLAnchorElement> & SapperAnchorProps & SvelteKitAnchorProps;
+      a: HTMLProps<HTMLAnchorElement> & SapperAnchorProps;
       abbr: HTMLProps<HTMLElement>;
       address: HTMLProps<HTMLElement>;
       area: HTMLProps<HTMLAreaElement>;
@@ -1397,7 +1396,7 @@ declare namespace svelte.JSX {
       sveltefragment: { slot?: string; };
       svelteoptions: { [name: string]: any };
       sveltehead: { [name: string]: any };
-      svelteelement: { 'this': string | undefined | null; } & HTMLProps<any> & SVGProps<any> & SapperAnchorProps & SvelteKitAnchorProps;
+      svelteelement: { 'this': string | undefined | null; } & HTMLProps<any> & SVGProps<any> & SapperAnchorProps;
       // Needed due to backwards compatibility type which hits these
       'svelte:window': HTMLProps<Window> & SvelteWindowProps;
       'svelte:body': HTMLProps<HTMLElement>;

package/svelte-shims.d.ts

@@ -231,6 +231,7 @@ declare function __sveltets_2_createComponentAny(props: Record<string, any>): _S
 declare function __sveltets_2_any(...dummy: any[]): any;
 declare function __sveltets_2_empty(...dummy: any[]): {};
 declare function __sveltets_2_union<T1,T2,T3,T4,T5>(t1:T1,t2?:T2,t3?:T3,t4?:T4,t5?:T5): T1 & T2 & T3 & T4 & T5;
+declare function __sveltets_2_nonNullable<T>(type: T): NonNullable<T>;
 
 declare function __sveltets_2_cssProp(prop: Record<string, any>): {};
 
@@ -295,7 +296,14 @@ declare type ATypedSvelteComponent = {
     $on(event: string, handler: ((e: any) => any) | null | undefined): () => void;
 }
 /**
- * Ambient type only used for intellisense, DO NOT USE IN YOUR PROJECT
+ * Ambient type only used for intellisense, DO NOT USE IN YOUR PROJECT.
+ * 
+ * If you're looking for the type of a Svelte Component, use `SvelteComponentTyped` and `ComponentType` instead:
+ *
+ * ```ts
+ * import type { ComponentType, SvelteComponentTyped } from "svelte";
+ * let myComponentConstructor: ComponentType<SvelteComponentTyped> = ..;
+ * ```
  */
 declare type ConstructorOfATypedSvelteComponent = new (args: {target: any, props?: any}) => ATypedSvelteComponent
 declare function __sveltets_2_ensureComponent<T extends ConstructorOfATypedSvelteComponent | null | undefined>(type: T): NonNullable<T>;