fix: 🐛 rename scss prepend option from data to prependData

Aligning the prop value with the
[`sass-loader`](https://webpack.js.org/loaders/sass-loader/) option.

BREAKING CHANGE: 🧨 Content passed through the `data` property won't be prepended anymore.

src/modules/typescript/compileFromMemory.ts

@@ -114,6 +114,7 @@ function createImportTransformerFromProgram(program: ts.Program) {
                 continue;
               }
             }
+
             newElements.push(spec);
           }
 

src/transformers/scss.ts

@@ -34,14 +34,17 @@ const transformer: Transformer<Options.Sass> = async ({
     implementation = sass = mod.default;
   }
 
-  const { renderSync, ...sassOptions }: Options.Sass = {
+  const { renderSync, prependData, ...restOptions } = {
     sourceMap: true,
     ...options,
     includePaths: getIncludePaths(filename, options.includePaths),
     outFile: `${filename}.css`,
   };
 
-  sassOptions.data = options.data ? options.data + content : content;
+  const sassOptions = {
+    ...restOptions,
+    data: prependData ? prependData + content : content,
+  };
 
   // scss errors if passed an empty string
   if (sassOptions.data.length === 0) {

src/types/options.ts

@@ -26,12 +26,13 @@ export interface Babel extends BabelOptions {
 }
 
 export type Pug = PugOptions;
-export type Sass = Omit<SassOptions, 'file'> & {
+export type Sass = Omit<SassOptions, 'file' | 'data'> & {
   implementation?: {
     render?: typeof render;
     renderSync?: typeof renderSync;
   };
   renderSync?: boolean;
+  prependData?: string;
 };
 // from https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/less/index.d.ts#L80
 export interface Less {

test/fixtures/types.ts

@@ -1,7 +1,7 @@
-export type AType = "test1" | "test2"
+export type AType = 'test1' | 'test2';
 export interface AInterface {
-    test: string
+  test: string;
 }
-export const AValue: string = "test"
+export const AValue: string = 'test';
 
-export default "String"
+export default 'String';

test/transformers/scss.test.ts

@@ -34,7 +34,7 @@ describe('transformer - scss', () => {
     const template = `<style lang="scss"></style>`;
     const opts = getAutoPreprocess({
       scss: {
-        data: '$color:red;div{color:$color}',
+        prependData: '$color:red;div{color:$color}',
       },
     });
 
@@ -70,7 +70,7 @@ describe('transformer - scss', () => {
     const template = `<style lang="scss"></style>`;
     const opts = getAutoPreprocess({
       scss: {
-        data: '$color:blue;div{color:$color}',
+        prependData: '$color:blue;div{color:$color}',
         renderSync: true,
       },
     });