feat: add source map support to customRenderer (#249)

README.md

@@ -153,6 +153,11 @@ module.exports = (css, { fileName, logger }) => {
   try {
     // ...process your css here.
     return renderedCss;
+    // css and sourceMap
+    return {
+      css: renderedCss,
+      map: sourceMap,
+    };
   } catch (error) {
     logger.error(error.message);
   }

src/helpers/getCssExports.ts

@@ -64,11 +64,17 @@ export const getCssExports = ({
     if (options.customRenderer) {
       // eslint-disable-next-line @typescript-eslint/no-var-requires
       const customRenderer = require(options.customRenderer) as CustomRenderer;
-      transformedCss = customRenderer(rawCss, {
+      const customResult = customRenderer(rawCss, {
         fileName,
         logger,
         compilerOptions,
       });
+      if (typeof customResult === 'string') {
+        transformedCss = customResult;
+      } else if (customResult.css) {
+        transformedCss = customResult.css;
+        sourceMap = customResult.map;
+      }
     } else {
       switch (fileType) {
         case FileType.less:

src/options.ts

@@ -4,6 +4,7 @@ import { DotenvConfigOptions } from 'dotenv';
 import { CSSExports } from 'icss-utils';
 import stylus from 'stylus';
 import { Logger } from './helpers/logger';
+import type { RawSourceMap } from 'source-map-js';
 
 // NOTE: Stylus doesn't directly export RenderOptions.
 type StylusRenderOptions = Parameters<typeof stylus>[1];
@@ -52,7 +53,12 @@ export interface CustomRendererOptions {
 export type CustomRenderer = (
   css: string,
   options: CustomRendererOptions,
-) => string;
+) =>
+  | string
+  | {
+      css: string;
+      map?: RawSourceMap;
+    };
 
 export interface CustomTemplateOptions {
   classes: CSSExports;