@semcore/babel-plugin-shadow - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

index.js

@@ -10,3 +10,2 @@ const fs = require('fs');
 
-const postCssPluginMediarezka = require('@semcore/postcss-mediarezka');
 const postCssPluginInlineComment = require('postcss-inline-comment');
@@ -83,3 +82,2 @@
             preserve: false,
-            // importFrom: require.resolve('@semcore/utils/style/var.css'),
           },
@@ -92,3 +90,3 @@ 'color-mod-function': {
     },
-    plugins: [postCssPluginInlineComment(), postCssPluginMediarezka()],
+    plugins: [postCssPluginInlineComment()],
   },
@@ -262,2 +260,12 @@ };
 
+    const filterUniqueIdentifiers = () => {
+      const unique = [];
+      return (node) => {
+        const { name, type } = node;
+        if (type !== 'Identifier' || unique.find((i) => i === name)) return;
+        unique.push(name);
+        return node;
+      };
+    };
+
     if (options.stringStyle) {
@@ -294,3 +302,9 @@ let isInsideComment = false;
           ),
-        expressions,
+        /*
+         * We should filter unique identifiers, because of babel check number of quasis/idetifiers passed
+         * to templateLiteral builder since 7.6.3
+         * https://github.com/babel/babel/issues/10486
+         * Reshadow now uses babel 7.5.5
+         */
+        expressions.filter(filterUniqueIdentifiers()),
       );
@@ -638,2 +652,16 @@ }
 
+  const createMediaStylesCall = (styles, hash) => {
+    const cssCallExpression = t.callExpression(t.identifier(addImport('__css__')), [
+      t.templateLiteral([t.templateElement({ raw: styles, cooked: styles })], []),
+      t.stringLiteral(hash),
+    ]);
+
+    wrapBundlerComments(cssCallExpression);
+
+    return t.ifStatement(
+      t.booleanLiteral(false),
+      t.blockStatement([t.expressionStatement(cssCallExpression)]),
+    );
+  };
+
   const visited = new WeakSet();
@@ -711,4 +739,16 @@
       const code = result.code;
+      const media = result.media;
       const tokens = toObjectExpression(result.tokens);
 
+      if (media) {
+        const mediaStylesNode = createMediaStylesCall(media, hash);
+        p.findParent((path) => {
+          if (!t.isVariableDeclaration(path)) return;
+          if (!path.node.leadingComments) return;
+          if (path.node.leadingComments.length < 1) return;
+          if (!path.node.leadingComments[0].value.includes('__reshadow-styles__:')) return;
+          path.insertAfter(mediaStylesNode);
+        });
+      }
+
       const templateLiteral = t.templateLiteral(
@@ -715,0 +755,0 @@ [

package.json

 {
   "name": "@semcore/babel-plugin-shadow",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "reshadow babel plugin",
@@ -5,0 +5,0 @@ "main": "index.js",

postcss/index.js

@@ -15,2 +15,3 @@ const fs = require('fs');
 const reshadow = require('@reshadow/postcss');
+const mediarezka = require('@semcore/postcss-mediarezka');
 
@@ -22,2 +23,4 @@ const stringHash = require('string-hash');
 
+const OUTPUT = {};
+
 /**
@@ -133,2 +136,11 @@ *
 
+  if (options.mediarezka !== null) {
+    processorPlugins.push(
+      mediarezka({
+        getMedia: (css) => (OUTPUT.media = css),
+        ...options.mediarezka,
+      }),
+    );
+  }
+
   if (options.cssnano || (options.cssnano !== null && process.env.NODE_ENV === 'production')) {
@@ -152,2 +164,5 @@ /**
     const { root, css: code } = result;
+    const { media } = OUTPUT;
+    // cleanup scoped variable to prevent multiple insertion
+    delete OUTPUT.media;
 
@@ -157,2 +172,3 @@ return {
       code,
+      media,
       tokens: parser.exportTokens,
@@ -159,0 +175,0 @@ };

No alert changes

Improved metrics

Total package byte prevSize

69577

increased by139.84%

Number of package files

9

increased by125%

Lines of code

1428

increased by75.65%

No dependency changes