chore: split output comment printing

Author: relliv

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@egoistdeveloper/twcss-to-sass",
-  "version": "2.1.12",
+  "version": "2.1.13",
   "description": "HTML template to SASS converter for TailwindCSS",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

src/interfaces/tw-to-sass-options.ts

@@ -4,7 +4,8 @@ import { IClassNameOptions } from './classname-options'
 export interface ITwToSassOptions {
   formatOutput: boolean
   formatterOptions: CSSBeautifyOptions
-  printComments: boolean
+  printHtmlComments: boolean
+  printSassComments: boolean
   useCommentBlocksAsClassName: boolean
   maxClassNameLength: number
   classNameOptions: IClassNameOptions

src/twcss-to-sass.ts

@@ -34,7 +34,8 @@ const defaultOptions: ITwToSassOptions = {
   formatOutput: true,
   useCommentBlocksAsClassName: true,
   maxClassNameLength: 50,
-  printComments: true,
+  printHtmlComments: true,
+  printSassComments: true,
   formatterOptions: formatterOptions,
   classNameOptions: {
     lowercase: true,
@@ -462,7 +463,7 @@ function getSassTree(nodeTree: IHtmlNode[]): string {
       }
 
       if (treeString.length || subTreeString.length) {
-        const classComment = _defaultOptions.printComments
+        const classComment = _defaultOptions.printSassComments
           ? `/* ${node.comment ? node.comment : node.tagName}${
               node.order ? ' -> ' + node.order : ''
             } */`
@@ -528,7 +529,7 @@ function getHtmlTree(nodeTree: IHtmlNode[]): string {
       const className = getClassName(node, node.order)
 
       if (node.type == 'element' && node.tagName != 'style') {
-        if (_defaultOptions.printComments) {
+        if (_defaultOptions.printHtmlComments) {
           if (node.comment) {
             htmlTree += `\n<!-- ${node.comment.trim()} -->`
           }

test/twcss-to-html.test.ts

@@ -1,3 +1,4 @@
+import { ITwToSassOptions } from '../src/interfaces/tw-to-sass-options'
 import { convertToSass } from '../src/twcss-to-sass'
 
 test('convert to sass for html', () => {
@@ -19,9 +20,9 @@ test('convert to sass for html', () => {
     </div>
 </div>`
 
-  const converterConfigs = <any>{
+  const converterConfigs = <ITwToSassOptions>{
     useCommentBlocksAsClassName: true,
-    printComments: true,
+    printSassComments: true,
   }
 
   const converterResult = convertToSass(htmlCotnent, converterConfigs)
@@ -89,9 +90,9 @@ test('convert to sass for html with void elements', () => {
 
 </html>`
 
-  const converterConfigs = <any>{
+  const converterConfigs = <ITwToSassOptions>{
     useCommentBlocksAsClassName: true,
-    printComments: true,
+    printSassComments: true,
   }
 
   const converterResult = convertToSass(htmlCotnent, converterConfigs)

test/twcss-to-sass.test.ts

@@ -1,3 +1,4 @@
+import { ITwToSassOptions } from '../src/interfaces/tw-to-sass-options'
 import { convertToSass } from '../src/twcss-to-sass'
 
 test('convert to sass', () => {
@@ -53,9 +54,9 @@ test('convert to sass with comments', () => {
     }
 }`
 
-  const converterConfigs = <any>{
+  const converterConfigs = <ITwToSassOptions>{
     useCommentBlocksAsClassName: false,
-    printComments: true,
+    printSassComments: true,
   }
   const converterResult = convertToSass(htmlCotnent, converterConfigs)
 
@@ -83,9 +84,9 @@ test('convert to sass with comments class names', () => {
     }
 }`
 
-  const converterConfigs = <any>{
+  const converterConfigs = <ITwToSassOptions>{
     useCommentBlocksAsClassName: true,
-    printComments: true,
+    printSassComments: true,
     classNameOptions: {
       lowercase: true,
       replacement: '_',