@parcel/transformer-css 2.11.0 → 2.13.0

package/lib/CSSTransformer.js

@@ -61,8 +61,8 @@ function _diagnostic() {
   return data;
 }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const {
   transform,
   transformStyleAttribute,
@@ -144,14 +144,16 @@ var _default = exports.default = new (_plugin().Transformer)({
             if (cssModulesConfig !== null && cssModulesConfig !== void 0 && cssModulesConfig.dashedIdents && !asset.isSource) {
               cssModulesConfig.dashedIdents = false;
             }
-            cssModules = cssModulesConfig !== null && cssModulesConfig !== void 0 ? cssModulesConfig : true;
+            cssModules = cssModulesConfig ?? true;
           }
         }
         res = transform({
           filename: (0, _utils().normalizeSeparators)(_path().default.relative(options.projectRoot, asset.filePath)),
           code,
           cssModules,
-          analyzeDependencies: asset.meta.hasDependencies !== false,
+          analyzeDependencies: asset.meta.hasDependencies !== false ? {
+            preserveImports: true
+          } : false,
           sourceMap: !!asset.env.sourceMap,
           drafts: config === null || config === void 0 ? void 0 : config.drafts,
           pseudoClasses: config === null || config === void 0 ? void 0 : config.pseudoClasses,
@@ -194,7 +196,6 @@ var _default = exports.default = new (_plugin().Transformer)({
         });
       }
     }
-    asset.setBuffer(Buffer.from(res.code));
     if (res.map != null) {
       let vlqMap = JSON.parse(Buffer.from(res.map).toString());
       let map = new (_sourceMap().default)(options.projectRoot);
@@ -219,7 +220,8 @@ var _default = exports.default = new (_plugin().Transformer)({
             meta: {
               // For the glob resolver to distinguish between `@import` and other URL dependencies.
               isCSSImport: true,
-              media: dep.media
+              media: dep.media,
+              placeholder: dep.placeholder
             }
           });
         } else if (dep.type === 'url') {
@@ -233,8 +235,8 @@ var _default = exports.default = new (_plugin().Transformer)({
       }
     }
     let assets = [asset];
+    let buffer = Buffer.from(res.code);
     if (res.exports != null) {
-      var _asset$uniqueKey;
       let exports = res.exports;
       asset.symbols.ensure();
       asset.symbols.set('default', 'default');
@@ -243,10 +245,11 @@ var _default = exports.default = new (_plugin().Transformer)({
       let c = 0;
       let depjs = '';
       let js = '';
+      let cssImports = '';
       for (let key in exports) {
         locals.set(exports[key].name, key);
       }
-      (_asset$uniqueKey = asset.uniqueKey) !== null && _asset$uniqueKey !== void 0 ? _asset$uniqueKey : asset.uniqueKey = asset.id;
+      asset.uniqueKey ??= asset.id;
       let seen = new Set();
       let add = key => {
         if (seen.has(key)) {
@@ -278,6 +281,7 @@ var _default = exports.default = new (_plugin().Transformer)({
               d = `dep_${c++}`;
               depjs += `import * as ${d} from ${JSON.stringify(ref.specifier)};\n`;
               dependencies.set(ref.specifier, d);
+              cssImports += `@import "${ref.specifier}";\n`;
               asset.addDependency({
                 specifier: ref.specifier,
                 specifierType: 'esm',
@@ -338,6 +342,7 @@ var _default = exports.default = new (_plugin().Transformer)({
             }]])
           });
           asset.meta.hasReferences = true;
+          cssImports += `@import "${reference.specifier}";\n`;
         }
       }
       assets.push({
@@ -346,7 +351,13 @@ var _default = exports.default = new (_plugin().Transformer)({
         dependencies: [],
         env
       });
+
+      // Prepend @import rules for each composes dependency so packager knows where to insert them.
+      if (cssImports.length > 0) {
+        buffer = Buffer.concat([Buffer.from(cssImports), buffer]);
+      }
     }
+    asset.setBuffer(buffer);
     return assets;
   }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parcel/transformer-css",
-  "version": "2.11.0",
+  "version": "2.13.0",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -16,14 +16,14 @@
   "main": "lib/CSSTransformer.js",
   "source": "src/CSSTransformer.js",
   "engines": {
-    "node": ">= 12.0.0",
-    "parcel": "^2.11.0"
+    "node": ">= 16.0.0",
+    "parcel": "^2.13.0"
   },
   "dependencies": {
-    "@parcel/diagnostic": "2.11.0",
-    "@parcel/plugin": "2.11.0",
+    "@parcel/diagnostic": "2.13.0",
+    "@parcel/plugin": "2.13.0",
     "@parcel/source-map": "^2.1.1",
-    "@parcel/utils": "2.11.0",
+    "@parcel/utils": "2.13.0",
     "browserslist": "^4.6.6",
     "lightningcss": "^1.22.1",
     "nullthrows": "^1.1.1"
@@ -32,7 +32,7 @@
     "lightningcss-wasm": "^1.22.1"
   },
   "browser": {
-    "lightningcss": "./wasm-wrapper.js"
+    "lightningcss": "lightningcss-wasm"
   },
-  "gitHead": "f8076f1644cabc944695b5ec82602c8ae32bcf21"
+  "gitHead": "a53f8f3ba1025c7ea8653e9719e0a61ef9717079"
 }

package/src/CSSTransformer.js

@@ -119,7 +119,12 @@ export default (new Transformer({
           ),
           code,
           cssModules,
-          analyzeDependencies: asset.meta.hasDependencies !== false,
+          analyzeDependencies:
+            asset.meta.hasDependencies !== false
+              ? {
+                  preserveImports: true,
+                }
+              : false,
           sourceMap: !!asset.env.sourceMap,
           drafts: config?.drafts,
           pseudoClasses: config?.pseudoClasses,
@@ -175,8 +180,6 @@ export default (new Transformer({
       }
     }
 
-    asset.setBuffer(Buffer.from(res.code));
-
     if (res.map != null) {
       let vlqMap = JSON.parse(Buffer.from(res.map).toString());
       let map = new SourceMap(options.projectRoot);
@@ -206,6 +209,7 @@ export default (new Transformer({
               // For the glob resolver to distinguish between `@import` and other URL dependencies.
               isCSSImport: true,
               media: dep.media,
+              placeholder: dep.placeholder,
             },
           });
         } else if (dep.type === 'url') {
@@ -220,6 +224,7 @@ export default (new Transformer({
     }
 
     let assets = [asset];
+    let buffer = Buffer.from(res.code);
 
     if (res.exports != null) {
       let exports = res.exports;
@@ -231,6 +236,7 @@ export default (new Transformer({
       let c = 0;
       let depjs = '';
       let js = '';
+      let cssImports = '';
 
       let jsDeps = [];
 
@@ -273,6 +279,7 @@ export default (new Transformer({
                 ref.specifier,
               )};\n`;
               dependencies.set(ref.specifier, d);
+              cssImports += `@import "${ref.specifier}";\n`;
               asset.addDependency({
                 specifier: ref.specifier,
                 specifierType: 'esm',
@@ -334,6 +341,7 @@ export default (new Transformer({
           });
 
           asset.meta.hasReferences = true;
+          cssImports += `@import "${reference.specifier}";\n`;
         }
       }
 
@@ -343,8 +351,14 @@ export default (new Transformer({
         dependencies: jsDeps,
         env,
       });
+
+      // Prepend @import rules for each composes dependency so packager knows where to insert them.
+      if (cssImports.length > 0) {
+        buffer = Buffer.concat([Buffer.from(cssImports), buffer]);
+      }
     }
 
+    asset.setBuffer(buffer);
     return assets;
   },
 }): Transformer);

package/wasm-wrapper.js

@@ -1,26 +0,0 @@
-import {transform, transformStyleAttribute} from 'lightningcss-wasm';
-
-export {default, browserslistToTargets} from 'lightningcss-wasm';
-
-// Hydrate Uint8Array into Buffer
-
-function transformWrapper(config) {
-  let result = transform(config);
-  return {
-    ...result,
-    code: Buffer.from(result.code),
-    map: result.map ? Buffer.from(result.map) : result.map,
-  };
-}
-function transformStyleAttributeWrapper(config) {
-  let result = transformStyleAttribute(config);
-  return {
-    ...result,
-    code: Buffer.from(result.code),
-  };
-}
-
-export {
-  transformWrapper as transform,
-  transformStyleAttributeWrapper as transformStyleAttribute,
-};