svelte2tsx 0.6.2 → 0.6.3

package/index.js

@@ -2961,7 +2961,9 @@ function isInterfaceOrTypeDeclaration(node) {
 }
 function findExportKeyword(node) {
     var _a;
-    return (_a = node.modifiers) === null || _a === void 0 ? void 0 : _a.find((x) => x.kind == ts.SyntaxKind.ExportKeyword);
+    return ts.canHaveModifiers(node)
+        ? (_a = ts.getModifiers(node)) === null || _a === void 0 ? void 0 : _a.find((x) => x.kind == ts.SyntaxKind.ExportKeyword)
+        : undefined;
 }
 /**
  * Node is like `bla = ...` or `{bla} = ...` or `[bla] = ...`
@@ -3570,10 +3572,12 @@ function updatePrepends(str, index, toAppend, removeExisting) {
 function is$$PropsDeclaration(node) {
     return isInterfaceOrTypeDeclaration(node) && node.name.text === '$$Props';
 }
+const kitPageFiles = new Set(['+page.svelte', '+layout.svelte']);
 class ExportedNames {
-    constructor(str, astOffset) {
+    constructor(str, astOffset, basename) {
         this.str = str;
         this.astOffset = astOffset;
+        this.basename = basename;
         /**
          * Uses the $$Props type
          */
@@ -3651,6 +3655,20 @@ class ExportedNames {
             const tsType = declaration.type;
             const jsDocType = ts.getJSDocType(declaration);
             const type = tsType || jsDocType;
+            const name = identifier.getText();
+            const isKitExport = kitPageFiles.has(this.basename) &&
+                (name === 'data' || name === 'form' || name === 'snapshot');
+            // TS types are not allowed in JS files, but TS will still pick it up and the ignore comment will filter out the error
+            const kitType = isKitExport && !type
+                ? `: import('./$types').${name === 'data'
+                    ? this.basename.includes('layout')
+                        ? 'LayoutData'
+                        : 'PageData'
+                    : name === 'form'
+                        ? 'ActionData'
+                        : 'Snapshot'}`
+                : '';
+            const end = declaration.end + this.astOffset;
             if (ts.isIdentifier(identifier) &&
                 // Ensure initialization for proper control flow and to avoid "possibly undefined" type errors.
                 // Also ensure prop is typed as any with a type annotation in TS strict mode
@@ -3662,8 +3680,10 @@ class ExportedNames {
                     (!type &&
                         [ts.SyntaxKind.FalseKeyword, ts.SyntaxKind.TrueKeyword].includes(declaration.initializer.kind)))) {
                 const name = identifier.getText();
-                const end = declaration.end + this.astOffset;
-                preprendStr(this.str, end, surroundWithIgnoreComments(`;${name} = __sveltets_2_any(${name});`));
+                preprendStr(this.str, end, surroundWithIgnoreComments(`${kitType};${name} = __sveltets_2_any(${name});`));
+            }
+            else if (kitType) {
+                preprendStr(this.str, end, surroundWithIgnoreComments(`${kitType}`));
             }
         };
         const findComma = (target) => target.getChildren().filter((child) => child.kind === ts.SyntaxKind.CommaToken);
@@ -4986,12 +5006,12 @@ class InterfacesAndTypes {
     }
 }
 
-function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript) {
+function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript, basename) {
     const htmlx = str.original;
     const scriptContent = htmlx.substring(script.content.start, script.content.end);
     const tsAst = ts__namespace.createSourceFile('component.ts.svelte', scriptContent, ts__namespace.ScriptTarget.Latest, true, ts__namespace.ScriptKind.TS);
     const astOffset = script.content.start;
-    const exportedNames = new ExportedNames(str, astOffset);
+    const exportedNames = new ExportedNames(str, astOffset, basename);
     const generics = new Generics(str, astOffset);
     const interfacesAndTypes = new InterfacesAndTypes();
     const implicitTopLevelNames = new ImplicitTopLevelNames(str, astOffset);
@@ -5686,6 +5706,7 @@ function processSvelteTemplate(str, options) {
 function svelte2tsx(svelte, options = {}) {
     options.mode = options.mode || 'ts';
     const str = new MagicString(svelte);
+    const basename = path.basename(options.filename || '');
     // process the htmlx as a svelte template
     let { htmlAst, moduleScriptTag, scriptTag, slots, uses$$props, uses$$slots, uses$$restProps, events, componentDocumentation, resolvedStores, usesAccessors } = processSvelteTemplate(str, options);
     /* Rearrange the script tags so that module is first, and instance second followed finally by the template
@@ -5709,7 +5730,7 @@ function svelte2tsx(svelte, options = {}) {
         : instanceScriptTarget;
     const implicitStoreValues = new ImplicitStoreValues(resolvedStores, renderFunctionStart);
     //move the instance script and process the content
-    let exportedNames = new ExportedNames(str, 0);
+    let exportedNames = new ExportedNames(str, 0, basename);
     let generics = new Generics(str, 0);
     let uses$$SlotsInterface = false;
     if (scriptTag) {
@@ -5718,7 +5739,7 @@ function svelte2tsx(svelte, options = {}) {
             str.move(scriptTag.start, scriptTag.end, instanceScriptTarget);
         }
         const res = processInstanceScriptContent(str, scriptTag, events, implicitStoreValues, options.mode, 
-        /**hasModuleScripts */ !!moduleScriptTag);
+        /**hasModuleScripts */ !!moduleScriptTag, basename);
         uses$$props = uses$$props || res.uses$$props;
         uses$$restProps = uses$$restProps || res.uses$$restProps;
         uses$$slots = uses$$slots || res.uses$$slots;

package/index.mjs

@@ -2941,7 +2941,9 @@ function isInterfaceOrTypeDeclaration(node) {
 }
 function findExportKeyword(node) {
     var _a;
-    return (_a = node.modifiers) === null || _a === void 0 ? void 0 : _a.find((x) => x.kind == ts__default.SyntaxKind.ExportKeyword);
+    return ts__default.canHaveModifiers(node)
+        ? (_a = ts__default.getModifiers(node)) === null || _a === void 0 ? void 0 : _a.find((x) => x.kind == ts__default.SyntaxKind.ExportKeyword)
+        : undefined;
 }
 /**
  * Node is like `bla = ...` or `{bla} = ...` or `[bla] = ...`
@@ -3550,10 +3552,12 @@ function updatePrepends(str, index, toAppend, removeExisting) {
 function is$$PropsDeclaration(node) {
     return isInterfaceOrTypeDeclaration(node) && node.name.text === '$$Props';
 }
+const kitPageFiles = new Set(['+page.svelte', '+layout.svelte']);
 class ExportedNames {
-    constructor(str, astOffset) {
+    constructor(str, astOffset, basename) {
         this.str = str;
         this.astOffset = astOffset;
+        this.basename = basename;
         /**
          * Uses the $$Props type
          */
@@ -3631,6 +3635,20 @@ class ExportedNames {
             const tsType = declaration.type;
             const jsDocType = ts__default.getJSDocType(declaration);
             const type = tsType || jsDocType;
+            const name = identifier.getText();
+            const isKitExport = kitPageFiles.has(this.basename) &&
+                (name === 'data' || name === 'form' || name === 'snapshot');
+            // TS types are not allowed in JS files, but TS will still pick it up and the ignore comment will filter out the error
+            const kitType = isKitExport && !type
+                ? `: import('./$types').${name === 'data'
+                    ? this.basename.includes('layout')
+                        ? 'LayoutData'
+                        : 'PageData'
+                    : name === 'form'
+                        ? 'ActionData'
+                        : 'Snapshot'}`
+                : '';
+            const end = declaration.end + this.astOffset;
             if (ts__default.isIdentifier(identifier) &&
                 // Ensure initialization for proper control flow and to avoid "possibly undefined" type errors.
                 // Also ensure prop is typed as any with a type annotation in TS strict mode
@@ -3642,8 +3660,10 @@ class ExportedNames {
                     (!type &&
                         [ts__default.SyntaxKind.FalseKeyword, ts__default.SyntaxKind.TrueKeyword].includes(declaration.initializer.kind)))) {
                 const name = identifier.getText();
-                const end = declaration.end + this.astOffset;
-                preprendStr(this.str, end, surroundWithIgnoreComments(`;${name} = __sveltets_2_any(${name});`));
+                preprendStr(this.str, end, surroundWithIgnoreComments(`${kitType};${name} = __sveltets_2_any(${name});`));
+            }
+            else if (kitType) {
+                preprendStr(this.str, end, surroundWithIgnoreComments(`${kitType}`));
             }
         };
         const findComma = (target) => target.getChildren().filter((child) => child.kind === ts__default.SyntaxKind.CommaToken);
@@ -4966,12 +4986,12 @@ class InterfacesAndTypes {
     }
 }
 
-function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript) {
+function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript, basename) {
     const htmlx = str.original;
     const scriptContent = htmlx.substring(script.content.start, script.content.end);
     const tsAst = ts.createSourceFile('component.ts.svelte', scriptContent, ts.ScriptTarget.Latest, true, ts.ScriptKind.TS);
     const astOffset = script.content.start;
-    const exportedNames = new ExportedNames(str, astOffset);
+    const exportedNames = new ExportedNames(str, astOffset, basename);
     const generics = new Generics(str, astOffset);
     const interfacesAndTypes = new InterfacesAndTypes();
     const implicitTopLevelNames = new ImplicitTopLevelNames(str, astOffset);
@@ -5666,6 +5686,7 @@ function processSvelteTemplate(str, options) {
 function svelte2tsx(svelte, options = {}) {
     options.mode = options.mode || 'ts';
     const str = new MagicString(svelte);
+    const basename = path__default.basename(options.filename || '');
     // process the htmlx as a svelte template
     let { htmlAst, moduleScriptTag, scriptTag, slots, uses$$props, uses$$slots, uses$$restProps, events, componentDocumentation, resolvedStores, usesAccessors } = processSvelteTemplate(str, options);
     /* Rearrange the script tags so that module is first, and instance second followed finally by the template
@@ -5689,7 +5710,7 @@ function svelte2tsx(svelte, options = {}) {
         : instanceScriptTarget;
     const implicitStoreValues = new ImplicitStoreValues(resolvedStores, renderFunctionStart);
     //move the instance script and process the content
-    let exportedNames = new ExportedNames(str, 0);
+    let exportedNames = new ExportedNames(str, 0, basename);
     let generics = new Generics(str, 0);
     let uses$$SlotsInterface = false;
     if (scriptTag) {
@@ -5698,7 +5719,7 @@ function svelte2tsx(svelte, options = {}) {
             str.move(scriptTag.start, scriptTag.end, instanceScriptTarget);
         }
         const res = processInstanceScriptContent(str, scriptTag, events, implicitStoreValues, options.mode, 
-        /**hasModuleScripts */ !!moduleScriptTag);
+        /**hasModuleScripts */ !!moduleScriptTag, basename);
         uses$$props = uses$$props || res.uses$$props;
         uses$$restProps = uses$$restProps || res.uses$$restProps;
         uses$$slots = uses$$slots || res.uses$$slots;

package/package.json

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

package/svelte-jsx.d.ts

@@ -562,7 +562,7 @@ declare namespace svelte.JSX {
   |'unselectable';
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface DOMAttributes<T extends EventTarget> {
@@ -670,7 +670,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface AriaAttributes {
@@ -725,7 +725,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface HTMLAttributes<T extends EventTarget> extends AriaAttributes, DOMAttributes<T> {
@@ -904,7 +904,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SVGAttributes<T extends EventTarget> extends AriaAttributes, DOMAttributes<T> {
@@ -1172,18 +1172,18 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface HTMLProps<T extends EventTarget> extends HTMLAttributes<T> {}
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SVGProps<T extends EventTarget> extends SVGAttributes<T> {}
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SvelteInputProps extends HTMLProps<HTMLInputElement> {
@@ -1193,7 +1193,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SvelteWindowProps  {
@@ -1238,7 +1238,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SapperAnchorProps {
@@ -1248,7 +1248,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SvelteMediaTimeRange {
@@ -1257,7 +1257,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SvelteMediaProps {
@@ -1286,7 +1286,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface SvelteVideoProps extends SvelteMediaProps {
@@ -1296,7 +1296,7 @@ declare namespace svelte.JSX {
   }
 
   /**
-   * @deprecated use the types from `svelte/elements` instead, or the .
+   * @deprecated use the types from `svelte/elements` instead
    * For more info see https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/typescript.md#im-getting-deprecation-warnings-for-sveltejsx--i-want-to-migrate-to-the-new-typings
    */
   interface IntrinsicElements {