@lwc/babel-plugin-component 2.33.0 → 2.35.0

package/package.json

@@ -10,7 +10,7 @@
     "bugs": {
         "url": "https://github.com/salesforce/lwc/issues"
     },
-    "version": "2.33.0",
+    "version": "2.35.0",
     "main": "src/index.js",
     "typings": "src/index.d.ts",
     "license": "MIT",
@@ -21,8 +21,8 @@
     ],
     "dependencies": {
         "@babel/helper-module-imports": "~7.18.6",
-        "@lwc/errors": "2.33.0",
-        "@lwc/shared": "2.33.0",
+        "@lwc/errors": "2.35.0",
+        "@lwc/shared": "2.35.0",
         "line-column": "~1.0.2"
     },
     "peerDependencies": {

package/src/index.js

@@ -12,6 +12,7 @@ const {
 } = require('./decorators');
 const dedupeImports = require('./dedupe-imports');
 const dynamicImports = require('./dynamic-imports');
+const scopeCssImports = require('./scope-css-imports');
 const compilerVersionNumber = require('./compiler-version-number');
 const { getEngineImportSpecifiers } = require('./utils');
 
@@ -43,6 +44,9 @@ module.exports = function LwcClassTransform(api) {
 
                     // Validate the usage of LWC decorators.
                     validateImportedLwcDecoratorUsage(engineImportSpecifiers);
+
+                    // Add ?scoped=true to *.scoped.css imports
+                    scopeCssImports(api, path);
                 },
                 exit(path) {
                     const engineImportSpecifiers = getEngineImportSpecifiers(path);

package/src/scope-css-imports.js

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) 2020, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+
+// Add ?scoped=true to any imports ending with .scoped.css. This signals that the stylesheet
+// should be treated as "scoped".
+module.exports = function ({ types: t }, path) {
+    const programPath = path.isProgram() ? path : path.findParent((node) => node.isProgram());
+
+    return programPath.get('body').forEach((node) => {
+        const source = node.get('source');
+        if (
+            node.isImportDeclaration() &&
+            source.type === 'StringLiteral' &&
+            source.node.value.endsWith('.scoped.css')
+        ) {
+            source.replaceWith(t.stringLiteral(source.node.value + '?scoped=true'));
+        }
+    });
+};