@compiled/webpack-loader 0.6.17 → 0.7.3

package/dist/extract-plugin.js

@@ -17,7 +17,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.CompiledExtractPlugin = exports.styleSheetName = exports.pluginName = void 0;
 const css_1 = require("@compiled/css");
 const utils_1 = require("@compiled/utils");
-const webpack_1 = require("./utils/webpack");
+const utils_2 = require("./utils");
 exports.pluginName = 'CompiledExtractPlugin';
 exports.styleSheetName = 'compiled-css';
 /**
@@ -100,22 +100,22 @@ class CompiledExtractPlugin {
         __classPrivateFieldSet(this, _options, options);
     }
     apply(compiler) {
-        const { RawSource } = webpack_1.getSources(compiler);
+        const { RawSource } = utils_2.getSources(compiler);
         pushNodeModulesExtractLoader(compiler, __classPrivateFieldGet(this, _options));
         forceCSSIntoOneStyleSheet(compiler);
         compiler.hooks.compilation.tap(exports.pluginName, (compilation) => {
-            webpack_1.getNormalModuleHook(compiler, compilation).tap(exports.pluginName, (loaderContext) => {
+            utils_2.getNormalModuleHook(compiler, compilation).tap(exports.pluginName, (loaderContext) => {
                 // We add some information here to tell loaders that the plugin has been configured.
                 // Bundling will throw if this is missing (i.e. consumers did not setup correctly).
                 loaderContext[exports.pluginName] = true;
             });
-            webpack_1.getOptimizeAssetsHook(compiler, compilation).tap(exports.pluginName, (assets) => {
+            utils_2.getOptimizeAssetsHook(compiler, compilation).tap(exports.pluginName, (assets) => {
                 const cssAssets = getCSSAssets(assets);
                 if (cssAssets.length === 0) {
                     return;
                 }
                 const [asset] = cssAssets;
-                const contents = webpack_1.getAssetSourceContents(asset.source);
+                const contents = utils_2.getAssetSourceContents(asset.source);
                 const newSource = new RawSource(css_1.sort(contents));
                 compilation.updateAsset(asset.name, newSource, asset.info);
             });

package/dist/extract-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"extract-plugin.js","sourceRoot":"","sources":["../src/extract-plugin.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,uCAAqC;AACrC,2CAAyD;AAGzD,6CAKyB;AAEZ,QAAA,UAAU,GAAG,uBAAuB,CAAC;AACrC,QAAA,cAAc,GAAG,cAAc,CAAC;AAE7C;;;;;;GAMG;AACH,MAAM,YAAY,GAAG,CAAC,MAA6B,EAAE,EAAE;IACrD,OAAO,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;SACvB,MAAM,CAAC,CAAC,SAAS,EAAE,EAAE;QACpB,OAAO,SAAS,CAAC,QAAQ,CAAC,GAAG,sBAAc,MAAM,CAAC,CAAC;IACrD,CAAC,CAAC;SACD,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;AACpF,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,yBAAyB,GAAG,CAAC,QAAkB,EAAE,EAAE;IACvD,MAAM,UAAU,GAAG;QACjB,WAAW,EAAE;YACX,IAAI,EAAE,sBAAc;YACpB,IAAI,EAAE,kBAAkB;YACxB,MAAM,EAAE,KAAK;YACb,mCAAmC;YACnC,IAAI,EAAE,2BAA2B;YACjC,OAAO,EAAE,IAAI;SACd;KACF,CAAC;IAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,EAAE;QAClC,QAAQ,CAAC,OAAO,CAAC,YAAY,GAAG,EAAE,CAAC;KACpC;IAED,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,EAAE;QAC9C,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,GAAG;YAC1C,WAAW,EAAE,EAAE;SAChB,CAAC;KACH;IAED,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE;QAC1D,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,WAAW,GAAG,EAAE,CAAC;KAC5D;IAED,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;AACnF,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,4BAA4B,GAAG,CACnC,QAAkB,EAClB,OAAqC,EAC/B,EAAE;IACR,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,EAAE;QAC5B,MAAM,mBAAW,CAAC,gBAAgB,CAAC,CAAC,4BAA4B,CAAC,CAAC;KACnE;IAED,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC;QACjC,IAAI,EAAE,EAAE,GAAG,EAAE,CAAC,qBAAqB,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC,MAAM,CAAC,iBAAS,CAAC,EAAE;QACjF,OAAO,EAAE,OAAO,CAAC,kBAAkB;QACnC,OAAO,EAAE,OAAO,CAAC,kBAAkB;QACnC,GAAG,EAAE;YACH,MAAM,EAAE,0BAA0B;YAClC,OAAO,EAAE;gBACP,uGAAuG;gBACvG,IAAI,EAAE,KAAK;gBACX,OAAO,EAAE,IAAI;aACd;SACF;KACF,CAAC,CAAC;AACL,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAa,qBAAqB;IAGhC,YAAY,UAAwC,EAAE;QAFtD,2BAAuC;QAGrC,uBAAA,IAAI,YAAY,OAAO,EAAC;IAC1B,CAAC;IAED,KAAK,CAAC,QAAkB;QACtB,MAAM,EAAE,SAAS,EAAE,GAAG,oBAAU,CAAC,QAAQ,CAAC,CAAC;QAE3C,4BAA4B,CAAC,QAAQ,yCAAgB,CAAC;QACtD,yBAAyB,CAAC,QAAQ,CAAC,CAAC;QAEpC,QAAQ,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,kBAAU,EAAE,CAAC,WAAW,EAAE,EAAE;YACzD,6BAAmB,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAU,EAAE,CAAC,aAAa,EAAE,EAAE;gBAC3E,oFAAoF;gBACpF,mFAAmF;gBAClF,aAAqB,CAAC,kBAAU,CAAC,GAAG,IAAI,CAAC;YAC5C,CAAC,CAAC,CAAC;YAEH,+BAAqB,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAU,EAAE,CAAC,MAAM,EAAE,EAAE;gBACtE,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;gBACvC,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE;oBAC1B,OAAO;iBACR;gBAED,MAAM,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;gBAC1B,MAAM,QAAQ,GAAG,gCAAsB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;gBACtD,MAAM,SAAS,GAAG,IAAI,SAAS,CAAC,UAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;gBAEhD,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;YAC7D,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;CACF;AAlCD,sDAkCC"}
+{"version":3,"file":"extract-plugin.js","sourceRoot":"","sources":["../src/extract-plugin.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,uCAAqC;AACrC,2CAAyD;AAIzD,mCAKiB;AAEJ,QAAA,UAAU,GAAG,uBAAuB,CAAC;AACrC,QAAA,cAAc,GAAG,cAAc,CAAC;AAE7C;;;;;;GAMG;AACH,MAAM,YAAY,GAAG,CAAC,MAA6B,EAAE,EAAE;IACrD,OAAO,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;SACvB,MAAM,CAAC,CAAC,SAAS,EAAE,EAAE;QACpB,OAAO,SAAS,CAAC,QAAQ,CAAC,GAAG,sBAAc,MAAM,CAAC,CAAC;IACrD,CAAC,CAAC;SACD,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;AACpF,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,yBAAyB,GAAG,CAAC,QAAkB,EAAE,EAAE;IACvD,MAAM,UAAU,GAAG;QACjB,WAAW,EAAE;YACX,IAAI,EAAE,sBAAc;YACpB,IAAI,EAAE,kBAAkB;YACxB,MAAM,EAAE,KAAK;YACb,mCAAmC;YACnC,IAAI,EAAE,2BAA2B;YACjC,OAAO,EAAE,IAAI;SACd;KACF,CAAC;IAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,EAAE;QAClC,QAAQ,CAAC,OAAO,CAAC,YAAY,GAAG,EAAE,CAAC;KACpC;IAED,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,EAAE;QAC9C,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,GAAG;YAC1C,WAAW,EAAE,EAAE;SAChB,CAAC;KACH;IAED,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE;QAC1D,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,WAAW,GAAG,EAAE,CAAC;KAC5D;IAED,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;AACnF,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,4BAA4B,GAAG,CACnC,QAAkB,EAClB,OAAqC,EAC/B,EAAE;IACR,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,EAAE;QAC5B,MAAM,mBAAW,CAAC,gBAAgB,CAAC,CAAC,4BAA4B,CAAC,CAAC;KACnE;IAED,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC;QACjC,IAAI,EAAE,EAAE,GAAG,EAAE,CAAC,qBAAqB,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC,MAAM,CAAC,iBAAS,CAAC,EAAE;QACjF,OAAO,EAAE,OAAO,CAAC,kBAAkB;QACnC,OAAO,EAAE,OAAO,CAAC,kBAAkB;QACnC,GAAG,EAAE;YACH,MAAM,EAAE,0BAA0B;YAClC,OAAO,EAAE;gBACP,uGAAuG;gBACvG,IAAI,EAAE,KAAK;gBACX,OAAO,EAAE,IAAI;aACd;SACF;KACF,CAAC,CAAC;AACL,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAa,qBAAqB;IAGhC,YAAY,UAAwC,EAAE;QAFtD,2BAAuC;QAGrC,uBAAA,IAAI,YAAY,OAAO,EAAC;IAC1B,CAAC;IAED,KAAK,CAAC,QAAkB;QACtB,MAAM,EAAE,SAAS,EAAE,GAAG,kBAAU,CAAC,QAAQ,CAAC,CAAC;QAE3C,4BAA4B,CAAC,QAAQ,yCAAgB,CAAC;QACtD,yBAAyB,CAAC,QAAQ,CAAC,CAAC;QAEpC,QAAQ,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,kBAAU,EAAE,CAAC,WAAW,EAAE,EAAE;YACzD,2BAAmB,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAU,EAAE,CAAC,aAAa,EAAE,EAAE;gBAC3E,oFAAoF;gBACpF,mFAAmF;gBAClF,aAAqB,CAAC,kBAAU,CAAC,GAAG,IAAI,CAAC;YAC5C,CAAC,CAAC,CAAC;YAEH,6BAAqB,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAU,EAAE,CAAC,MAAM,EAAE,EAAE;gBACtE,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;gBACvC,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE;oBAC1B,OAAO;iBACR;gBAED,MAAM,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;gBAC1B,MAAM,QAAQ,GAAG,8BAAsB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;gBACtD,MAAM,SAAS,GAAG,IAAI,SAAS,CAAC,UAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;gBAEhD,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;YAC7D,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;CACF;AAlCD,sDAkCC"}

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 export { default, pitch } from './compiled-loader';
 export { CompiledExtractPlugin } from './extract-plugin';
+export type { CompiledExtractPluginOptions, CompiledLoaderOptions, ResolveOptions } from './types';

package/dist/types.d.ts

@@ -1,5 +1,5 @@
-import type { RuleSetCondition } from 'webpack';
-import type { pluginName } from './extract-plugin';
+import type { ResolveOptions, RuleSetCondition } from 'webpack';
+export type { ResolveOptions };
 export interface CompiledLoaderOptions {
     /**
      * Converts your source code into a Compiled component.
@@ -21,64 +21,10 @@ export interface CompiledLoaderOptions {
      * read [Security](https://compiledcssinjs.com/docs/security) for more information.
      */
     nonce?: string;
-}
-export interface LoaderThis<TOptions = unknown> {
-    /**
-     * Query param passed to the loader.
-     *
-     * ```
-     * import '!loader-module?query=params';
-     * ```
-     */
-    resourceQuery: string;
-    /**
-     * Absolute path of this file.
-     */
-    resourcePath: string;
-    /**
-     * Returns the passed in options from a user.
-     * Optionally validated with a `schema` object.
-     */
-    getOptions?: (schema?: {
-        type: string;
-        properties: Required<{
-            [P in keyof TOptions]: {
-                type: string;
-            } | {
-                anyOf: Array<{
-                    type: string;
-                }>;
-            };
-        }>;
-    }) => TOptions;
-    /**
-     * Notifies webpack that this loader run included another file.
-     * When the other file changes this file will be recompiled.
-     */
-    addDependency(path: string): void;
-    /**
-     * Marks the loader async.
-     * Call the return value when the loader has completed.
-     */
-    async(): (err: any, result?: string, map?: any) => void;
-    /**
-     * Internal access to the current webpack compiler.
-     */
-    _compiler: any;
-    /**
-     * Internal access to the loaders for this run.
-     */
-    loaders: any[];
-    /**
-     * Emits an error during the loader run.
-     *
-     * @param error
-     */
-    emitError(error: Error): void;
     /**
-     * When set confirms that the extract plugin has been configured.
+     * Override the default `resolve` passed into webpack, which is used to statically evaluate import declarations
      */
-    [pluginName]?: true;
+    resolve?: ResolveOptions;
 }
 export interface CompiledExtractPluginOptions {
     /**

package/dist/{utils/webpack.d.ts → utils.d.ts}

@@ -1,4 +1,4 @@
-import type { Compiler, Compilation as CompilationType, sources } from 'webpack';
+import type { Compilation as CompilationType, Compiler, sources } from 'webpack';
 /**
  * Gets the normal module hook for webpack 4 & webpack 5.
  *

package/dist/{utils/webpack.js → utils.js}

@@ -93,4 +93,4 @@ const toURIComponent = (rule) => {
     return component;
 };
 exports.toURIComponent = toURIComponent;
-//# sourceMappingURL=webpack.js.map
+//# sourceMappingURL=utils.js.map

package/dist/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":";;;AAEA;;;;GAIG;AACI,MAAM,mBAAmB,GAAG,CACjC,QAAkB,EAClB,WAA4B,EACoB,EAAE;IAClD,MAAM,EAAE,YAAY,EAAE;IACpB,iBAAiB;IACjB,QAAQ,CAAC,OAAO;QAChB,iBAAiB;QACjB,OAAO,CAAC,SAAS,CAAC,CAAC;IAErB,MAAM,gBAAgB,GACpB,YAAY,IAAI,OAAO,YAAY,CAAC,mBAAmB,KAAK,WAAW;QACrE,CAAC,CAAC,iBAAiB;YACjB,YAAY,CAAC,mBAAmB,CAAC,WAAW,CAAC,CAAC,MAAM;QACtD,CAAC,CAAC,iBAAiB;YACjB,WAAW,CAAC,KAAK,CAAC,kBAAkB,CAAC;IAE3C,OAAO,gBAAgB,CAAC;AAC1B,CAAC,CAAC;AAlBW,QAAA,mBAAmB,uBAkB9B;AAEF;;;;;GAKG;AACI,MAAM,sBAAsB,GAAG,CAAC,WAA2B,EAAU,EAAE;IAC5E,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,EAAE,CAAC;IACpC,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;QAC9B,OAAO,MAAM,CAAC;KACf;IAED,OAAO,MAAM,CAAC,QAAQ,EAAE,CAAC;AAC3B,CAAC,CAAC;AAPW,QAAA,sBAAsB,0BAOjC;AAEF;;;;;GAKG;AACI,MAAM,qBAAqB,GAAG,CACnC,QAAkB,EAClB,WAA4B,EAC+B,EAAE;IAC7D,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE;IAC5B,iBAAiB;IACjB,QAAQ,CAAC,OAAO;QAChB,iBAAiB;QACjB,OAAO,CAAC,SAAS,CAAC,CAAC;IACrB,MAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IAC5C,MAAM,cAAc;IAClB,iBAAiB;IACjB,WAAW,CAAC,KAAK,CAAC,aAAa;QAC/B,iBAAiB;QACjB,WAAW,CAAC,KAAK,CAAC,cAAc,CAAC;IAEnC,OAAO;QACL,GAAG,EAAE,CAAC,UAAkB,EAAE,QAAqD,EAAE,EAAE;YACjF,cAAc,CAAC,GAAG,CAChB,UAAU;gBACR,CAAC,CAAC,UAAU;gBACZ,CAAC,CAAC;oBACE,IAAI,EAAE,UAAU;oBAChB,KAAK,EAAE,WAAW,CAAC,kCAAkC;iBACtD,EACL,QAAQ,CACT,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AA7BW,QAAA,qBAAqB,yBA6BhC;AAEF;;;GAGG;AACI,MAAM,UAAU,GAAG,CAAC,QAAkB,EAAkB,EAAE;IAC/D,MAAM,EAAE,OAAO,EAAE;IACf,iBAAiB;IACjB,QAAQ,CAAC,OAAO;QAChB,iBAAiB;QACjB,EAAE,CAAC;IAEL,OAAO;IACL,iBAAiB;IACjB,OAAO;QACP,iBAAiB;QACjB,OAAO,CAAC,iBAAiB,CAAC,CAC3B,CAAC;AACJ,CAAC,CAAC;AAbW,QAAA,UAAU,cAarB;AAEF;;;;;;GAMG;AACI,MAAM,cAAc,GAAG,CAAC,IAAY,EAAU,EAAE;IACrD,MAAM,SAAS,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAEhE,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAJW,QAAA,cAAc,kBAIzB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@compiled/webpack-loader",
-  "version": "0.6.17",
+  "version": "0.7.3",
   "description": "A familiar and performant compile time CSS-in-JS library for React.",
   "homepage": "https://compiledcssinjs.com",
   "bugs": "https://github.com/atlassian-labs/compiled/issues/new?assignees=&labels=bug&template=bug_report.md",
@@ -21,20 +21,21 @@
     "README.md"
   ],
   "dependencies": {
-    "@babel/core": "^7.15.8",
-    "@compiled/babel-plugin": "^0.8.0",
-    "@compiled/babel-plugin-strip-runtime": "^0.6.13",
-    "@compiled/css": "^0.7.0",
-    "@compiled/utils": "^0.6.11",
-    "loader-utils": "^2.0.0",
+    "@babel/core": "^7.16.0",
+    "@compiled/babel-plugin": "^0.11.1",
+    "@compiled/babel-plugin-strip-runtime": "^0.11.1",
+    "@compiled/css": "^0.7.1",
+    "@compiled/utils": "^0.6.12",
+    "enhanced-resolve": "^5.8.3",
+    "loader-utils": "^2.0.2",
     "webpack-sources": "^1.4.3"
   },
   "devDependencies": {
-    "babel-loader": "^8.2.2",
+    "babel-loader": "^8.2.3",
     "css-loader": "^5.2.7",
     "memfs": "^3.2.4",
     "mini-css-extract-plugin": "^1.5.0",
-    "webpack": "^5.58.1"
+    "webpack": "^5.61.0"
   },
   "peerDependencies": {
     "webpack": ">= 4.46.0"

package/src/__fixtures__/async-styles.ts

@@ -0,0 +1 @@
+import('./common/css-prop');

package/src/__fixtures__/babel.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+
+import BabelCJS from './lib/babel-cjs';
+import BabelESM from './lib/babel-esm';
+
+export const App = (): JSX.Element => (
+  <>
+    <BabelCJS />
+    <BabelESM />
+  </>
+);

package/src/{__tests__/fixtures → __fixtures__}/binding-not-found.tsx

@@ -1,5 +1,6 @@
+/** @jsx jsx */
+import { jsx, styled } from '@compiled/react';
 import React from 'react';
-import { styled } from '@compiled/react';
 
 const height = '9rem';
 

package/src/{__tests__/fixtures/imports/colors.js → __fixtures__/common/colors.ts}

@@ -1,6 +1,7 @@
-export const purple = 'purple';
-export const blueviolet = 'blueviolet';
 export const blue = 'blue';
-export const red = 'red';
+export const blueviolet = 'blueviolet';
+export const coral = 'coral';
+export const purple = 'purple';
 export const orange = 'orange';
+export const red = 'red';
 export const yellow = 'yellow';

package/src/__fixtures__/common/css-prop.tsx

@@ -0,0 +1,8 @@
+/** @jsx jsx */
+import { jsx } from '@compiled/react';
+
+import { coral } from './colors';
+
+export const Coral = (): JSX.Element => (
+  <div css={{ color: coral, border: `2px solid ${coral}` }} />
+);

package/src/__fixtures__/compiled-error.tsx

@@ -0,0 +1,7 @@
+/** @jsx jsx */
+import { jsx, css } from '@compiled/react';
+
+// @ts-expect-error
+const styles = css(false);
+
+export const App = (): JSX.Element => <div css={styles} />;

package/src/__fixtures__/important-styles.tsx

@@ -0,0 +1,6 @@
+/** @jsx jsx */
+import { jsx } from '@compiled/react';
+
+const Component = (): JSX.Element => <div css={{ fontSize: '12!important', color: 'blue' }} />;
+
+export default Component;

package/src/__fixtures__/lib/babel-cjs.d.ts

@@ -0,0 +1,3 @@
+declare const Component: () => JSX.Element;
+
+export default Component;

package/src/__fixtures__/lib/babel-esm.d.ts

@@ -0,0 +1,3 @@
+declare const Component: () => JSX.Element;
+
+export default Component;

package/src/__fixtures__/lib/loader-alias.ts

@@ -0,0 +1,5 @@
+import { css } from '@compiled/react';
+
+export const styles = css({
+  color: 'indigo',
+});

package/src/__fixtures__/lib/webpack-alias.ts

@@ -0,0 +1,5 @@
+import { css } from '@compiled/react';
+
+export const styles = css({
+  color: 'blue',
+});

package/src/__fixtures__/loader-alias.tsx

@@ -0,0 +1,8 @@
+/** @jsx jsx */
+// @ts-ignore This is a bug where the meta is not updated for the new file import
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { jsx, css } from '@compiled/react';
+// @ts-expect-error
+import { styles } from 'loader-alias';
+
+export const App = (): JSX.Element => <div css={styles} />;

package/src/__fixtures__/local-styles.tsx

@@ -0,0 +1,14 @@
+/** @jsx jsx */
+import { jsx, styled } from '@compiled/react';
+import { Fragment } from 'react';
+
+const Styled = styled.div({
+  color: 'blue',
+});
+
+export const App = (): JSX.Element => (
+  <Fragment>
+    <div css={{ fontSize: 14 }} />
+    <Styled />
+  </Fragment>
+);

package/src/__fixtures__/no-compiled-styles.ts

@@ -0,0 +1 @@
+console.log('Hello world!');

package/src/__fixtures__/relative-styles.tsx

@@ -0,0 +1,39 @@
+/** @jsx jsx */
+import { jsx, css, styled } from '@compiled/react';
+import { Fragment } from 'react';
+
+import { blueviolet, blue, orange, purple, red, yellow } from './common/colors';
+// @ts-expect-error ↓↓↓ This should not have their styles extracted ↓↓↓
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Coral } from './common/css-prop';
+
+export const Styled = styled.span`
+  color: ${blueviolet};
+
+  :focus {
+    color: ${purple};
+  }
+
+  :hover {
+    color: ${blue};
+  }
+`;
+
+const styles = css`
+  color: ${red};
+
+  :focus {
+    color: ${orange};
+  }
+
+  :hover {
+    color: ${yellow};
+  }
+`;
+
+export const App = (): JSX.Element => (
+  <Fragment>
+    <div css={styles} />
+    <Styled />
+  </Fragment>
+);

package/src/__fixtures__/webpack-alias.tsx

@@ -0,0 +1,8 @@
+/** @jsx jsx */
+// @ts-expect-error This is a bug where the meta is not updated for the new file import
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { jsx, css } from '@compiled/react';
+// @ts-expect-error
+import { styles } from 'webpack-alias';
+
+export const App = (): JSX.Element => <div css={styles} />;

package/src/__tests__/compiled-loader.test.tsx

@@ -1,53 +1,84 @@
-import loader from '../index';
+import { join } from 'path';
 
-const getLoader = (opts: { addDependency: jest.Mock; callback: jest.Mock }) =>
-  loader.bind({
-    async: () => opts.callback,
-    resourcePath: '/projects/index.js',
-    addDependency: opts.addDependency,
-    getOptions: () => ({ importReact: false }),
-  });
+import { bundle as bundleEntry } from './test-utils';
+import type { BundleOptions } from './test-utils';
 
-describe('webpack loader', () => {
-  it('should bail out early if the file has no compiled in it', async () => {
-    const callback = jest.fn();
-    const loader = getLoader({ addDependency: jest.fn(), callback });
+// We are testing in both modes, because the initial custom resolver implementation (i.e. this.getResolve) only works
+// in production
+describe.each<'development' | 'production'>(['development', 'production'])(
+  'webpack loader in %s mode',
+  (mode) => {
+    const fixturesPath = join(__dirname, '..', '__fixtures__');
 
-    await loader('console.log(undefined);');
+    const bundle = (entry: string, options: Omit<BundleOptions, 'mode'> = {}) =>
+      bundleEntry(entry, {
+        ...options,
+        mode,
+      });
 
-    expect(callback).toHaveBeenCalled();
-  });
+    it('does not transform files that do not contain @compiled/react', async () => {
+      const assets = await bundle(join(fixturesPath, 'no-compiled-styles.ts'));
 
-  it('should transform code if compiled has been found', async () => {
-    const callback = jest.fn();
-    const loader = getLoader({ addDependency: jest.fn(), callback });
-    const code = `import '@compiled/react';`;
+      if (mode === 'development') {
+        expect(assets['main.js']).toInclude("console.log('Hello world!');");
+      } else {
+        expect(assets['main.js']).toMatchInlineSnapshot(`"console.log(\\"Hello world!\\");"`);
+      }
+    });
 
-    await loader(code);
+    it('transforms local styles', async () => {
+      const assets = await bundle(join(fixturesPath, 'local-styles.tsx'));
 
-    expect(callback).toHaveBeenCalled();
-  });
+      expect(assets['main.js']).toIncludeMultiple([
+        '._1wybdlk8{font-size:14px}',
+        '._syaz13q2{color:blue}',
+      ]);
+    });
 
-  it('should callback with transformed code', async () => {
-    const callback = jest.fn();
-    const loader = getLoader({ addDependency: jest.fn(), callback });
+    it('transforms styles imported through a relative import', async () => {
+      const assets = await bundle(join(fixturesPath, 'relative-styles.tsx'));
 
-    await loader(`import '@compiled/react';`);
+      expect(assets['main.js']).toIncludeMultiple([
+        '._syaz5scu{color:red}',
+        '._syazmu8g{color:blueviolet}',
+        '._f8pjruxl:focus{color:orange}',
+        '._f8pj1cnh:focus{color:purple}',
+        '._30l31gy6:hover{color:yellow}',
+        '._30l313q2:hover{color:blue}',
+      ]);
 
-    expect(callback.mock.calls[0][0]).toBe(null);
-    expect(callback.mock.calls[0][1]).toMatchInlineSnapshot(`
-      "/* index.js generated by @compiled/babel-plugin v0.0.0 */
+      // not.toIncludeMultiple does not work as intended
+      expect(assets['main.js']).not.toInclude('{border:2px solid coral}');
+      expect(assets['main.js']).not.toInclude('{color:coral}');
+    });
 
-      import { ax, ix, CC, CS } from \\"@compiled/react/runtime\\";"
-    `);
-  });
+    it('transforms styles imported through a webpack alias', async () => {
+      const assets = await bundle(join(fixturesPath, 'webpack-alias.tsx'));
 
-  it('should callback on error', async () => {
-    const callback = jest.fn();
-    const loader = getLoader({ addDependency: jest.fn(), callback });
+      expect(assets['main.js']).toInclude('._syaz13q2{color:blue}');
+    });
 
-    await loader(`import '@compiled/react'; asdasd`);
+    it('transforms styles imported through an overridden resolve configuration', async () => {
+      const assets = await bundle(join(fixturesPath, 'loader-alias.tsx'), {
+        resolve: {
+          // This alias will be put into the compiled plugin options, but not the webpack resolve configuration
+          alias: {
+            'loader-alias': join(fixturesPath, 'lib', 'loader-alias.ts'),
+          },
+        },
+      });
 
-    expect(callback.mock.calls[0][0]).toBeDefined();
-  });
-});
+      expect(assets['main.js']).toInclude('._syaz1if8{color:indigo}');
+    });
+
+    it('fails when using unrecognised compiled syntax', async () => {
+      await expect(bundle(join(fixturesPath, 'compiled-error.tsx'))).rejects.toEqual([
+        expect.objectContaining({
+          message: expect.stringContaining(
+            "BooleanLiteral isn't a supported CSS type - try using an object or string"
+          ),
+        }),
+      ]);
+    });
+  }
+);