svelte2tsx 0.5.16 → 0.5.17

package/index.js

@@ -4469,8 +4469,8 @@ function addSlotLet(node, element) {
  * {a}  -->  a;
  */
 function handleMustacheTag(str, node, parent) {
-    if (parent.type === 'Attribute') {
-        // handles inside Attribute.ts
+    if (parent.type === 'Attribute' || parent.type === 'StyleDirective') {
+        // handled inside Attribute.ts / StyleDirective.ts
         return;
     }
     str.overwrite(node.start, node.start + 1, '', { contentOnly: true });
@@ -4517,15 +4517,6 @@ function handleStyleDirective(str, style, element) {
         ]);
         return;
     }
-    let start = style.value[0].start;
-    if (style.value[0].type === 'MustacheTag') {
-        start++;
-    }
-    const last = style.value[style.value.length - 1];
-    let end = last.end;
-    if (last.type === 'MustacheTag') {
-        end--;
-    }
     if (style.value.length > 1) {
         // We have multiple attribute values, so we build a template string out of them.
         for (const n of style.value) {
@@ -4533,7 +4524,11 @@ function handleStyleDirective(str, style, element) {
                 str.appendRight(n.start, '$');
             }
         }
-        element.appendToStartEnd([ensureType + '`', [start, end], '`);']);
+        element.appendToStartEnd([
+            ensureType + '`',
+            [style.value[0].start, style.value[style.value.length - 1].end],
+            '`);'
+        ]);
         return;
     }
     const styleVal = style.value[0];
@@ -4541,11 +4536,15 @@ function handleStyleDirective(str, style, element) {
         const quote = ['"', "'"].includes(str.original[styleVal.start - 1])
             ? str.original[styleVal.start - 1]
             : '"';
-        element.appendToStartEnd([`${ensureType}${quote}`, [start, end], `${quote});`]);
+        element.appendToStartEnd([
+            `${ensureType}${quote}`,
+            [styleVal.start, styleVal.end],
+            `${quote});`
+        ]);
     }
     else {
         // MustacheTag
-        element.appendToStartEnd([ensureType, [start, end], ');']);
+        element.appendToStartEnd([ensureType, [styleVal.start + 1, styleVal.end - 1], ');']);
     }
 }
 
@@ -6409,6 +6408,24 @@ function isNewGroup(sourceFile, topLevelImportDecl, scanner) {
     }
     return false;
 }
+/**
+ * ensure it's in a newline.
+ * if file has module script ensure an empty line to separate imports
+ */
+function handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str) {
+    var _a;
+    const firstImport = tsAst.statements
+        .filter(ts__default['default'].isImportDeclaration)
+        .sort((a, b) => a.end - b.end)[0];
+    if (!firstImport) {
+        return;
+    }
+    const firstComment = Array.from((_a = ts__default['default'].getLeadingCommentRanges(firstImport.getFullText(), 0)) !== null && _a !== void 0 ? _a : []).sort((a, b) => a.pos - b.pos)[0];
+    const start = firstComment && firstComment.kind === ts__default['default'].SyntaxKind.MultiLineCommentTrivia
+        ? firstComment.pos + firstImport.getFullStart()
+        : firstImport.getStart();
+    str.appendRight(start + astOffset, '\n' + (hasModuleScript ? '\n' : ''));
+}
 
 function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript) {
     const htmlx = str.original;
@@ -6586,14 +6603,7 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
     // declare implicit reactive variables we found in the script
     implicitTopLevelNames.modifyCode(rootScope.declared);
     implicitStoreValues.modifyCode(astOffset, str);
-    const firstImport = tsAst.statements
-        .filter(ts__namespace.isImportDeclaration)
-        .sort((a, b) => a.end - b.end)[0];
-    if (firstImport) {
-        // ensure it's in a newline.
-        // if file has module script ensure an empty line to separate imports
-        str.appendRight(firstImport.getStart() + astOffset, '\n' + (hasModuleScript ? '\n' : ''));
-    }
+    handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str);
     if (mode === 'dts') {
         // Transform interface declarations to type declarations because indirectly
         // using interfaces inside the return type of a function is forbidden.

package/index.mjs

@@ -4439,8 +4439,8 @@ function addSlotLet(node, element) {
  * {a}  -->  a;
  */
 function handleMustacheTag(str, node, parent) {
-    if (parent.type === 'Attribute') {
-        // handles inside Attribute.ts
+    if (parent.type === 'Attribute' || parent.type === 'StyleDirective') {
+        // handled inside Attribute.ts / StyleDirective.ts
         return;
     }
     str.overwrite(node.start, node.start + 1, '', { contentOnly: true });
@@ -4487,15 +4487,6 @@ function handleStyleDirective(str, style, element) {
         ]);
         return;
     }
-    let start = style.value[0].start;
-    if (style.value[0].type === 'MustacheTag') {
-        start++;
-    }
-    const last = style.value[style.value.length - 1];
-    let end = last.end;
-    if (last.type === 'MustacheTag') {
-        end--;
-    }
     if (style.value.length > 1) {
         // We have multiple attribute values, so we build a template string out of them.
         for (const n of style.value) {
@@ -4503,7 +4494,11 @@ function handleStyleDirective(str, style, element) {
                 str.appendRight(n.start, '$');
             }
         }
-        element.appendToStartEnd([ensureType + '`', [start, end], '`);']);
+        element.appendToStartEnd([
+            ensureType + '`',
+            [style.value[0].start, style.value[style.value.length - 1].end],
+            '`);'
+        ]);
         return;
     }
     const styleVal = style.value[0];
@@ -4511,11 +4506,15 @@ function handleStyleDirective(str, style, element) {
         const quote = ['"', "'"].includes(str.original[styleVal.start - 1])
             ? str.original[styleVal.start - 1]
             : '"';
-        element.appendToStartEnd([`${ensureType}${quote}`, [start, end], `${quote});`]);
+        element.appendToStartEnd([
+            `${ensureType}${quote}`,
+            [styleVal.start, styleVal.end],
+            `${quote});`
+        ]);
     }
     else {
         // MustacheTag
-        element.appendToStartEnd([ensureType, [start, end], ');']);
+        element.appendToStartEnd([ensureType, [styleVal.start + 1, styleVal.end - 1], ');']);
     }
 }
 
@@ -6379,6 +6378,24 @@ function isNewGroup(sourceFile, topLevelImportDecl, scanner) {
     }
     return false;
 }
+/**
+ * ensure it's in a newline.
+ * if file has module script ensure an empty line to separate imports
+ */
+function handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str) {
+    var _a;
+    const firstImport = tsAst.statements
+        .filter(ts__default.isImportDeclaration)
+        .sort((a, b) => a.end - b.end)[0];
+    if (!firstImport) {
+        return;
+    }
+    const firstComment = Array.from((_a = ts__default.getLeadingCommentRanges(firstImport.getFullText(), 0)) !== null && _a !== void 0 ? _a : []).sort((a, b) => a.pos - b.pos)[0];
+    const start = firstComment && firstComment.kind === ts__default.SyntaxKind.MultiLineCommentTrivia
+        ? firstComment.pos + firstImport.getFullStart()
+        : firstImport.getStart();
+    str.appendRight(start + astOffset, '\n' + (hasModuleScript ? '\n' : ''));
+}
 
 function processInstanceScriptContent(str, script, events, implicitStoreValues, mode, hasModuleScript) {
     const htmlx = str.original;
@@ -6556,14 +6573,7 @@ function processInstanceScriptContent(str, script, events, implicitStoreValues,
     // declare implicit reactive variables we found in the script
     implicitTopLevelNames.modifyCode(rootScope.declared);
     implicitStoreValues.modifyCode(astOffset, str);
-    const firstImport = tsAst.statements
-        .filter(ts.isImportDeclaration)
-        .sort((a, b) => a.end - b.end)[0];
-    if (firstImport) {
-        // ensure it's in a newline.
-        // if file has module script ensure an empty line to separate imports
-        str.appendRight(firstImport.getStart() + astOffset, '\n' + (hasModuleScript ? '\n' : ''));
-    }
+    handleFirstInstanceImport(tsAst, astOffset, hasModuleScript, str);
     if (mode === 'dts') {
         // Transform interface declarations to type declarations because indirectly
         // using interfaces inside the return type of a function is forbidden.

package/package.json

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