svelte2tsx 0.5.6 → 0.5.9

package/index.js

@@ -1807,7 +1807,11 @@ function handleAttribute$1(htmlx, str, attr, parent, preserveCase) {
     //if we are on an "element" we are case insensitive, lowercase to match our JSX
     if (parent.type == 'Element') {
         const sapperLinkActions = ['sapper:prefetch', 'sapper:noscroll'];
-        const sveltekitLinkActions = ['sveltekit:prefetch', 'sveltekit:noscroll'];
+        const sveltekitLinkActions = [
+            'sveltekit:prefetch',
+            'sveltekit:noscroll',
+            'sveltekit:reload'
+        ];
         // skip Attribute shorthand, that is handled below
         if ((attr.value !== true &&
             !(attr.value.length &&
@@ -2811,7 +2815,7 @@ function handleStyleDirective$1(str, style) {
 
 /**
  * `<svelte:window>...</svelte:window>`   ---->    `<sveltewindow>...</sveltewindow>`
- * (same for :head, :body, :options, :fragment)
+ * (same for :head, :body, :options, :fragment, :element)
  */
 function handleSvelteTag(htmlx, str, node) {
     const colon = htmlx.indexOf(':', node.start);
@@ -3091,6 +3095,9 @@ function convertHtmlxToJsx$1(str, ast, onWalk = null, onLeave = null, options =
                         handleComponent(htmlx, str, node, parent, ifScope, templateScopeManager.value);
                         break;
                     case 'Element':
+                        if (node.name === 'svelte:element') {
+                            handleSvelteTag(htmlx, str, node);
+                        }
                         templateScopeManager.componentOrSlotTemplateOrElementEnter(node);
                         handleElement(htmlx, str, node, parent, ifScope, templateScopeManager.value);
                         break;
@@ -3383,7 +3390,7 @@ var svgAttributes = 'accent-height accumulate additive alignment-baseline allowR
 
 const voidTags = 'area,base,br,col,embed,hr,img,input,link,meta,param,source,track,wbr'.split(',');
 /**
- * Handles HTML elements as well as svelte:options, svelte:head, svelte:window, svelte:body
+ * Handles HTML elements as well as svelte:options, svelte:head, svelte:window, svelte:body, svelte:element
  *
  * Children of this element should call the methods on this class to add themselves to the correct
  * position within the transformation.
@@ -3452,6 +3459,18 @@ class Element {
                 this.addNameConstDeclaration = () => (this.startTransformation[0] = `{ const ${this._name} = ${createElement}("${nodeName}", {`);
                 break;
             }
+            case 'svelte:element': {
+                const nodeName = this.node.tag
+                    ? typeof this.node.tag !== 'string'
+                        ? [this.node.tag.start, this.node.tag.end]
+                        : `"${this.node.tag}"`
+                    : '""';
+                this._name = '$$_svelteelement' + this.computeDepth();
+                this.startTransformation.push(`{ ${createElement}(`, nodeName, ', {');
+                this.addNameConstDeclaration = () => ((this.startTransformation[0] = `{ const ${this._name} = ${createElement}(`),
+                    ', {');
+                break;
+            }
             case 'slot': {
                 // If the element is a <slot> tag, create the element with the createSlot-function
                 // which is created inside createRenderFunction.ts to check that the name and attributes
@@ -3815,8 +3834,6 @@ const numberOnlyAttributes = new Set([
     'results',
     'volume'
 ]);
-const sapperLinkActions = ['sapper:prefetch', 'sapper:noscroll'];
-const sveltekitLinkActions = ['sveltekit:prefetch', 'sveltekit:noscroll'];
 /**
  * Handle various kinds of attributes and make them conform to being valid in context of a object definition
  * - {x}   --->    x
@@ -3878,14 +3895,7 @@ function handleAttribute(str, attr, parent, preserveCase, element) {
     };
     // Handle attribute name
     const attributeName = [];
-    if (sapperLinkActions.includes(attr.name) || sveltekitLinkActions.includes(attr.name)) {
-        //strip ":" from out attribute name and uppercase the next letter to convert to jsx attribute
-        const parts = attr.name.split(':');
-        const name = parts[0] + parts[1][0].toUpperCase() + parts[1].substring(1);
-        str.overwrite(attr.start, attr.start + attr.name.length, name);
-        attributeName.push([attr.start, attr.start + attr.name.length]);
-    }
-    else if (attributeValueIsOfType(attr.value, 'AttributeShorthand')) {
+    if (attributeValueIsOfType(attr.value, 'AttributeShorthand')) {
         // For the attribute shorthand, the name will be the mapped part
         addAttribute([[attr.value[0].start, attr.value[0].end]]);
         return;
@@ -4387,9 +4397,10 @@ function handleSpread(node, element) {
  */
 function handleStyleDirective(str, style, element) {
     const htmlx = str.original;
+    const ensureType = '__sveltets_2_ensureType(String, Number, ';
     if (style.value === true || style.value.length === 0) {
         element.appendToStartEnd([
-            '__sveltets_2_ensureType(String, Number, ',
+            ensureType,
             [htmlx.indexOf(':', style.start) + 1, style.end],
             ');'
         ]);
@@ -4411,11 +4422,7 @@ function handleStyleDirective(str, style, element) {
                 str.appendRight(n.start, '$');
             }
         }
-        element.appendToStartEnd([
-            '__sveltets_2_ensureType(String, Number, `',
-            [start, end],
-            '`);'
-        ]);
+        element.appendToStartEnd([ensureType + '`', [start, end], '`);']);
         return;
     }
     const styleVal = style.value[0];
@@ -4423,15 +4430,11 @@ function handleStyleDirective(str, style, element) {
         const quote = ['"', "'"].includes(str.original[styleVal.start - 1])
             ? str.original[styleVal.start - 1]
             : '"';
-        element.appendToStartEnd([
-            `__sveltets_2_ensureType(String, Number, ${quote}`,
-            [start, end],
-            `${quote});`
-        ]);
+        element.appendToStartEnd([`${ensureType}${quote}`, [start, end], `${quote});`]);
     }
     else {
         // MustacheTag
-        element.appendToStartEnd(['__sveltets_2_ensureType(String, Number, ', [start, end], ');']);
+        element.appendToStartEnd([ensureType, [start, end], ');']);
     }
 }
 
@@ -5675,11 +5678,14 @@ class Scripts {
         // Those have another type ('Element' with name 'script').
         this.scriptTags = this.htmlxAst.children.filter((child) => child.type === 'Script');
         this.topLevelScripts = this.scriptTags;
-        this.handleScriptTag = (node, parent) => {
-            if (parent !== this.htmlxAst && node.name === 'script') {
-                this.topLevelScripts = this.topLevelScripts.filter((tag) => tag.start !== node.start || tag.end !== node.end);
-            }
-        };
+    }
+    checkIfElementIsScriptTag(node, parent) {
+        if (parent !== this.htmlxAst && node.name === 'script') {
+            this.topLevelScripts = this.topLevelScripts.filter((tag) => tag.start !== node.start || tag.end !== node.end);
+        }
+    }
+    checkIfContainsScriptTag(node) {
+        this.topLevelScripts = this.topLevelScripts.filter((tag) => !(node.start <= tag.start && node.end >= tag.end));
     }
     getTopLevelScriptTags() {
         let scriptTag = null;
@@ -6168,12 +6174,15 @@ class ImplicitTopLevelNames {
         // to `let {a} = b;` produces valid code.
         if (ts__default['default'].isExpressionStatement(node.statement) &&
             isParenthesizedObjectOrArrayLiteralExpression(node.statement.expression)) {
-            const start = node.statement.expression.getStart() + this.astOffset;
-            this.str.overwrite(start, start + 1, '', { contentOnly: true });
-            const end = node.statement.expression.getEnd() + this.astOffset - 1;
+            const parenthesizedExpression = node.statement.expression;
+            const parenthesisStart = parenthesizedExpression.getStart() + this.astOffset;
+            const expressionStart = parenthesizedExpression.expression.getStart() + this.astOffset;
+            this.str.overwrite(parenthesisStart, expressionStart, '', { contentOnly: true });
+            const parenthesisEnd = parenthesizedExpression.getEnd() + this.astOffset;
+            const expressionEnd = parenthesizedExpression.expression.getEnd() + this.astOffset;
             // We need to keep the `)` of the "wrap with invalidate" expression above.
             // We overwrite the same range so it's needed.
-            overwriteStr(this.str, end, end + 1, ')', true);
+            overwriteStr(this.str, expressionEnd, parenthesisEnd, ')', true);
         }
     }
 }
@@ -7041,7 +7050,10 @@ function processSvelteTemplate(str, options) {
                 handleStyleTag(node);
                 break;
             case 'Element':
-                scripts.handleScriptTag(node, parent);
+                scripts.checkIfElementIsScriptTag(node, parent);
+                break;
+            case 'RawMustacheTag':
+                scripts.checkIfContainsScriptTag(node);
                 break;
             case 'BlockStatement':
                 scopeStack.push();

package/index.mjs

@@ -1777,7 +1777,11 @@ function handleAttribute$1(htmlx, str, attr, parent, preserveCase) {
     //if we are on an "element" we are case insensitive, lowercase to match our JSX
     if (parent.type == 'Element') {
         const sapperLinkActions = ['sapper:prefetch', 'sapper:noscroll'];
-        const sveltekitLinkActions = ['sveltekit:prefetch', 'sveltekit:noscroll'];
+        const sveltekitLinkActions = [
+            'sveltekit:prefetch',
+            'sveltekit:noscroll',
+            'sveltekit:reload'
+        ];
         // skip Attribute shorthand, that is handled below
         if ((attr.value !== true &&
             !(attr.value.length &&
@@ -2781,7 +2785,7 @@ function handleStyleDirective$1(str, style) {
 
 /**
  * `<svelte:window>...</svelte:window>`   ---->    `<sveltewindow>...</sveltewindow>`
- * (same for :head, :body, :options, :fragment)
+ * (same for :head, :body, :options, :fragment, :element)
  */
 function handleSvelteTag(htmlx, str, node) {
     const colon = htmlx.indexOf(':', node.start);
@@ -3061,6 +3065,9 @@ function convertHtmlxToJsx$1(str, ast, onWalk = null, onLeave = null, options =
                         handleComponent(htmlx, str, node, parent, ifScope, templateScopeManager.value);
                         break;
                     case 'Element':
+                        if (node.name === 'svelte:element') {
+                            handleSvelteTag(htmlx, str, node);
+                        }
                         templateScopeManager.componentOrSlotTemplateOrElementEnter(node);
                         handleElement(htmlx, str, node, parent, ifScope, templateScopeManager.value);
                         break;
@@ -3353,7 +3360,7 @@ var svgAttributes = 'accent-height accumulate additive alignment-baseline allowR
 
 const voidTags = 'area,base,br,col,embed,hr,img,input,link,meta,param,source,track,wbr'.split(',');
 /**
- * Handles HTML elements as well as svelte:options, svelte:head, svelte:window, svelte:body
+ * Handles HTML elements as well as svelte:options, svelte:head, svelte:window, svelte:body, svelte:element
  *
  * Children of this element should call the methods on this class to add themselves to the correct
  * position within the transformation.
@@ -3422,6 +3429,18 @@ class Element {
                 this.addNameConstDeclaration = () => (this.startTransformation[0] = `{ const ${this._name} = ${createElement}("${nodeName}", {`);
                 break;
             }
+            case 'svelte:element': {
+                const nodeName = this.node.tag
+                    ? typeof this.node.tag !== 'string'
+                        ? [this.node.tag.start, this.node.tag.end]
+                        : `"${this.node.tag}"`
+                    : '""';
+                this._name = '$$_svelteelement' + this.computeDepth();
+                this.startTransformation.push(`{ ${createElement}(`, nodeName, ', {');
+                this.addNameConstDeclaration = () => ((this.startTransformation[0] = `{ const ${this._name} = ${createElement}(`),
+                    ', {');
+                break;
+            }
             case 'slot': {
                 // If the element is a <slot> tag, create the element with the createSlot-function
                 // which is created inside createRenderFunction.ts to check that the name and attributes
@@ -3785,8 +3804,6 @@ const numberOnlyAttributes = new Set([
     'results',
     'volume'
 ]);
-const sapperLinkActions = ['sapper:prefetch', 'sapper:noscroll'];
-const sveltekitLinkActions = ['sveltekit:prefetch', 'sveltekit:noscroll'];
 /**
  * Handle various kinds of attributes and make them conform to being valid in context of a object definition
  * - {x}   --->    x
@@ -3848,14 +3865,7 @@ function handleAttribute(str, attr, parent, preserveCase, element) {
     };
     // Handle attribute name
     const attributeName = [];
-    if (sapperLinkActions.includes(attr.name) || sveltekitLinkActions.includes(attr.name)) {
-        //strip ":" from out attribute name and uppercase the next letter to convert to jsx attribute
-        const parts = attr.name.split(':');
-        const name = parts[0] + parts[1][0].toUpperCase() + parts[1].substring(1);
-        str.overwrite(attr.start, attr.start + attr.name.length, name);
-        attributeName.push([attr.start, attr.start + attr.name.length]);
-    }
-    else if (attributeValueIsOfType(attr.value, 'AttributeShorthand')) {
+    if (attributeValueIsOfType(attr.value, 'AttributeShorthand')) {
         // For the attribute shorthand, the name will be the mapped part
         addAttribute([[attr.value[0].start, attr.value[0].end]]);
         return;
@@ -4357,9 +4367,10 @@ function handleSpread(node, element) {
  */
 function handleStyleDirective(str, style, element) {
     const htmlx = str.original;
+    const ensureType = '__sveltets_2_ensureType(String, Number, ';
     if (style.value === true || style.value.length === 0) {
         element.appendToStartEnd([
-            '__sveltets_2_ensureType(String, Number, ',
+            ensureType,
             [htmlx.indexOf(':', style.start) + 1, style.end],
             ');'
         ]);
@@ -4381,11 +4392,7 @@ function handleStyleDirective(str, style, element) {
                 str.appendRight(n.start, '$');
             }
         }
-        element.appendToStartEnd([
-            '__sveltets_2_ensureType(String, Number, `',
-            [start, end],
-            '`);'
-        ]);
+        element.appendToStartEnd([ensureType + '`', [start, end], '`);']);
         return;
     }
     const styleVal = style.value[0];
@@ -4393,15 +4400,11 @@ function handleStyleDirective(str, style, element) {
         const quote = ['"', "'"].includes(str.original[styleVal.start - 1])
             ? str.original[styleVal.start - 1]
             : '"';
-        element.appendToStartEnd([
-            `__sveltets_2_ensureType(String, Number, ${quote}`,
-            [start, end],
-            `${quote});`
-        ]);
+        element.appendToStartEnd([`${ensureType}${quote}`, [start, end], `${quote});`]);
     }
     else {
         // MustacheTag
-        element.appendToStartEnd(['__sveltets_2_ensureType(String, Number, ', [start, end], ');']);
+        element.appendToStartEnd([ensureType, [start, end], ');']);
     }
 }
 
@@ -5645,11 +5648,14 @@ class Scripts {
         // Those have another type ('Element' with name 'script').
         this.scriptTags = this.htmlxAst.children.filter((child) => child.type === 'Script');
         this.topLevelScripts = this.scriptTags;
-        this.handleScriptTag = (node, parent) => {
-            if (parent !== this.htmlxAst && node.name === 'script') {
-                this.topLevelScripts = this.topLevelScripts.filter((tag) => tag.start !== node.start || tag.end !== node.end);
-            }
-        };
+    }
+    checkIfElementIsScriptTag(node, parent) {
+        if (parent !== this.htmlxAst && node.name === 'script') {
+            this.topLevelScripts = this.topLevelScripts.filter((tag) => tag.start !== node.start || tag.end !== node.end);
+        }
+    }
+    checkIfContainsScriptTag(node) {
+        this.topLevelScripts = this.topLevelScripts.filter((tag) => !(node.start <= tag.start && node.end >= tag.end));
     }
     getTopLevelScriptTags() {
         let scriptTag = null;
@@ -6138,12 +6144,15 @@ class ImplicitTopLevelNames {
         // to `let {a} = b;` produces valid code.
         if (ts__default.isExpressionStatement(node.statement) &&
             isParenthesizedObjectOrArrayLiteralExpression(node.statement.expression)) {
-            const start = node.statement.expression.getStart() + this.astOffset;
-            this.str.overwrite(start, start + 1, '', { contentOnly: true });
-            const end = node.statement.expression.getEnd() + this.astOffset - 1;
+            const parenthesizedExpression = node.statement.expression;
+            const parenthesisStart = parenthesizedExpression.getStart() + this.astOffset;
+            const expressionStart = parenthesizedExpression.expression.getStart() + this.astOffset;
+            this.str.overwrite(parenthesisStart, expressionStart, '', { contentOnly: true });
+            const parenthesisEnd = parenthesizedExpression.getEnd() + this.astOffset;
+            const expressionEnd = parenthesizedExpression.expression.getEnd() + this.astOffset;
             // We need to keep the `)` of the "wrap with invalidate" expression above.
             // We overwrite the same range so it's needed.
-            overwriteStr(this.str, end, end + 1, ')', true);
+            overwriteStr(this.str, expressionEnd, parenthesisEnd, ')', true);
         }
     }
 }
@@ -7011,7 +7020,10 @@ function processSvelteTemplate(str, options) {
                 handleStyleTag(node);
                 break;
             case 'Element':
-                scripts.handleScriptTag(node, parent);
+                scripts.checkIfElementIsScriptTag(node, parent);
+                break;
+            case 'RawMustacheTag':
+                scripts.checkIfContainsScriptTag(node);
                 break;
             case 'BlockStatement':
                 scopeStack.push();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte2tsx",
-  "version": "0.5.6",
+  "version": "0.5.9",
   "description": "Convert Svelte components to TSX for type checking",
   "author": "David Pershouse",
   "license": "MIT",
@@ -22,19 +22,19 @@
     "@rollup/plugin-json": "^4.0.0",
     "@rollup/plugin-node-resolve": "^9.0.0",
     "@rollup/plugin-typescript": "^6.0.0",
-    "@types/mocha": "^5.2.7",
+    "@types/mocha": "^9.1.0",
     "@types/node": "^8.10.53",
     "@types/unist": "^2.0.3",
     "@types/vfile": "^3.0.2",
     "magic-string": "^0.25.7",
-    "mocha": "^9.0.0",
+    "mocha": "^9.2.0",
     "periscopic": "^2.0.2",
     "rollup": "2.52.7",
     "rollup-plugin-delete": "^2.0.0",
     "source-map": "^0.6.1",
     "source-map-support": "^0.5.16",
     "sourcemap-codec": "^1.4.8",
-    "svelte": "~3.46.1",
+    "svelte": "~3.47.0",
     "tiny-glob": "^0.2.6",
     "tslib": "^1.10.0",
     "typescript": "^4.6.2"

package/svelte-jsx.d.ts

@@ -11,11 +11,12 @@ declare namespace svelteHTML {
   ): SVGElementTagNameMap[K];
   function mapElementTag(
     tag: any
-  ): HTMLElement;
+  ): any; // needs to be any because used in context of <svelte:element>
 
   function createElement<Elements extends IntrinsicElements, Key extends keyof Elements>(
-    element: Key, attrs: Elements[Key]
-  ): Key extends keyof ElementTagNameMap ? ElementTagNameMap[Key] : Key extends keyof SVGElementTagNameMap ? SVGElementTagNameMap[Key] : HTMLElement;
+    // "undefined | null" because of <svelte:element>
+    element: Key | undefined | null, attrs: Elements[Key]
+  ): Key extends keyof ElementTagNameMap ? ElementTagNameMap[Key] : Key extends keyof SVGElementTagNameMap ? SVGElementTagNameMap[Key] : any;
 
 
   type NativeElement = HTMLElement;
@@ -98,11 +99,16 @@ declare namespace svelteHTML {
   // eslint-disable-next-line @typescript-eslint/no-empty-interface
   interface SvelteWindowProps extends svelte.JSX.SvelteWindowProps {}
   
-  // eslint-disable-next-line @typescript-eslint/no-empty-interface
-  interface SapperAnchorProps extends svelte.JSX.SapperAnchorProps {}
-  
-  // eslint-disable-next-line @typescript-eslint/no-empty-interface
-  interface SvelteKitAnchorProps extends svelte.JSX.SvelteKitAnchorProps {}
+  interface SapperAnchorProps {
+    "sapper:noscroll"?: true | undefined | null;
+    "sapper:prefetch"?: true | undefined | null;
+  }
+
+  interface SvelteKitAnchorProps {
+    "sveltekit:noscroll"?: true | undefined | null;
+    "sveltekit:prefetch"?: true | undefined | null;
+    "sveltekit:reload"?: true | undefined | null;
+  }
   
   // eslint-disable-next-line @typescript-eslint/no-empty-interface
   interface SvelteMediaTimeRange extends svelte.JSX.SvelteMediaTimeRange {}
@@ -819,6 +825,7 @@ declare namespace svelte.JSX {
       pattern?: string | undefined | null;
       placeholder?: string | undefined | null;
       playsinline?: boolean | undefined | null;
+      ping?: string | undefined | null;
       poster?: string | undefined | null;
       preload?: string | undefined | null;
       radiogroup?: string | undefined | null;
@@ -1230,6 +1237,7 @@ declare namespace svelte.JSX {
         // transformed from sveltekit:noscroll so it should be camel case
         sveltekitNoscroll?: true | undefined | null;
         sveltekitPrefetch?: true | undefined | null;
+        sveltekitReload?: true | undefined | null;
     }
 
     interface SvelteMediaTimeRange {
@@ -1447,6 +1455,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>;
 
       [name: string]: { [name: string]: any };
     }

package/svelte-shims.d.ts

@@ -3,9 +3,11 @@
 // are loaded and their declarations conflict each other
 // See https://github.com/sveltejs/language-tools/issues/1059 for an example bug that stems from it
 
+// -- start svelte-ls-remove --
 declare module '*.svelte' {
     export default Svelte2TsxComponent
 }
+// -- end svelte-ls-remove --
 
 declare class Svelte2TsxComponent<
     Props extends {} = {},
@@ -119,8 +121,10 @@ declare function __sveltets_1_ensureAnimation(animationCall: SvelteAnimationRetu
 declare function __sveltets_1_ensureAction(actionCall: SvelteActionReturnType): {};
 declare function __sveltets_1_ensureTransition(transitionCall: SvelteTransitionReturnType): {};
 declare function __sveltets_1_ensureFunction(expression: (e: Event & { detail?: any }) => unknown ): {};
-declare function __sveltets_1_ensureType<T>(type: AConstructorTypeOf<T>, el: T): {};
-declare function __sveltets_1_ensureType<T1, T2>(type1: AConstructorTypeOf<T1>, type2: AConstructorTypeOf<T2>, el: T1 | T2): {};
+// Includes undefined and null for all types as all usages also allow these
+declare function __sveltets_1_ensureType<T>(type: AConstructorTypeOf<T>, el: T | undefined | null): {};
+declare function __sveltets_1_ensureType<T1, T2>(type1: AConstructorTypeOf<T1>, type2: AConstructorTypeOf<T2>, el: T1 | T2 | undefined | null): {};
+
 declare function __sveltets_1_createEnsureSlot<Slots = Record<string, Record<string, any>>>(): <K1 extends keyof Slots, K2 extends keyof Slots[K1]>(k1: K1, k2: K2, val: Slots[K1][K2]) => Slots[K1][K2];
 declare function __sveltets_1_ensureRightProps<Props>(props: Props): {};
 declare function __sveltets_1_cssProp(prop: Record<string, any>): {};
@@ -183,7 +187,7 @@ declare function __sveltets_1_mapElementTag<K extends keyof SVGElementTagNameMap
 ): SVGElementTagNameMap[K];
 declare function __sveltets_1_mapElementTag(
     tag: any
-): HTMLElement;
+): any; // needs to be any because used in context of <svelte:element>
 
 declare function __sveltets_1_bubbleEventDef<Events, K extends keyof Events>(
     events: Events, eventKey: K
@@ -253,8 +257,9 @@ type __sveltets_2_SvelteTransitionConfig = {
 type __sveltets_2_SvelteTransitionReturnType = __sveltets_2_SvelteTransitionConfig | (() => __sveltets_2_SvelteTransitionConfig)
 declare function __sveltets_2_ensureTransition(transitionCall: __sveltets_2_SvelteTransitionReturnType): {};
 
-declare function __sveltets_2_ensureType<T>(type: AConstructorTypeOf<T>, el: T): {};
-declare function __sveltets_2_ensureType<T1, T2>(type1: AConstructorTypeOf<T1>, type2: AConstructorTypeOf<T2>, el: T1 | T2): {};
+// Includes undefined and null for all types as all usages also allow these
+declare function __sveltets_2_ensureType<T>(type: AConstructorTypeOf<T>, el: T | undefined | null): {};
+declare function __sveltets_2_ensureType<T1, T2>(type1: AConstructorTypeOf<T1>, type2: AConstructorTypeOf<T2>, el: T1 | T2 | undefined | null): {};
 
 // The following is necessary because there are two clashing errors that can't be solved at the same time
 // when using Svelte2TsxComponent, more precisely the event typings in