rollup-plugin-react-scoped-css 0.6.0 → 0.7.0

package/README.md

@@ -27,6 +27,9 @@ export default function Sub() {
 ```
 And just like that the styles will be scoped to the component.
 
+## Limitations
+Due to the way this plugin is working, it will apply the scope to the file and not the component individually... This may differ from other frameworks since they don't really let you define multiple components in the same file. This then means that if you have 2 components in the same file, the styles might conflict.
+
 ## Technicality
 since this plugin uses the engine of vue to scope the css to the components, the following sections come straight from the [vue documentation](https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors).
 
@@ -65,12 +68,12 @@ in vite:
 ```js
 // vite.config.js
 import { defineConfig } from 'vite'
-import reactRefresh from '@vitejs/plugin-react-refresh'
-import reactScopedCssPlugin from 'rollup-plugin-react-scoped-css'
+import react from '@vitejs/plugin-react'
+import { reactScopedCssPlugin } from 'rollup-plugin-react-scoped-css'
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [reactRefresh(), reactScopedCssPlugin()]
+  plugins: [react(), reactScopedCssPlugin()]
 })
 ```
 

package/dist/ast-program.d.ts

@@ -0,0 +1,5 @@
+import { ParserImplementations } from "./parsers/jsx-parser.model";
+declare global {
+    var implementation: null | ParserImplementations;
+}
+export declare function addHashAttributesToJsxTagsAst(program: any, attr: string): any;

package/dist/ast-program.js

@@ -0,0 +1,63 @@
+"use strict";
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addHashAttributesToJsxTagsAst = void 0;
+var ast_iterator_1 = require("./ast-iterator");
+var ast_transformer_1 = require("./ast-transformer");
+var ast_utils_1 = require("./ast.utils");
+var classic_parser_1 = require("./parsers/classic-parser");
+var jsx_parser_model_1 = require("./parsers/jsx-parser.model");
+var new_parser_1 = require("./parsers/new-parser");
+global.implementation = null;
+var classicParser = new classic_parser_1.ClassicJsxParser();
+var newParser = new new_parser_1.NewJsxParser();
+var parser = classicParser;
+var findImplementation = function (program) {
+    var e_1, _a;
+    var implementation = jsx_parser_model_1.ParserImplementations.classic;
+    try {
+        for (var _b = __values((0, ast_iterator_1.astIterator)(program)), _c = _b.next(); !_c.done; _c = _b.next()) {
+            var node = _c.value;
+            if (!(0, ast_utils_1.isNodeImportOrRequire)(node)) {
+                continue;
+            }
+            var src = (0, ast_utils_1.getSrcFromImportOrRequire)(node);
+            if (["react/jsx-dev-runtime", "react/jsx-runtime"].includes(src)) {
+                return jsx_parser_model_1.ParserImplementations.new;
+            }
+        }
+    }
+    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    finally {
+        try {
+            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+        }
+        finally { if (e_1) throw e_1.error; }
+    }
+    return implementation;
+};
+function addHashAttributesToJsxTagsAst(program, attr) {
+    // Once in the program, we can determine which parser to use
+    if (global.implementation === null) {
+        global.implementation = findImplementation(program);
+        if (global.implementation === jsx_parser_model_1.ParserImplementations.new) {
+            parser = newParser;
+        }
+    }
+    return (0, ast_transformer_1.astTransformer)(program, function (node) {
+        if (parser.isNodeReactElement(node) && !parser.isNodeReactFragment(node)) {
+            return parser.extendNodeWithAttributes(node, attr);
+        }
+    });
+}
+exports.addHashAttributesToJsxTagsAst = addHashAttributesToJsxTagsAst;

package/dist/ast.utils.d.ts

@@ -1,5 +1,32 @@
-import { ParserImplementations } from "./parsers/jsx-parser.model";
-declare global {
-    var implementation: null | ParserImplementations;
-}
-export declare function addHashAttributesToJsxTagsAst(program: any, attr: string): any;
+export declare const createObjectAssignCallExpressionWithIdentifier: (identifier: any, objectExpression: any) => {
+    type: string;
+    callee: {
+        type: string;
+        object: {
+            type: string;
+            name: string;
+        };
+        property: {
+            type: string;
+            name: string;
+        };
+        computed: boolean;
+        optional: boolean;
+    };
+    arguments: any[];
+    optional: boolean;
+};
+export declare const createObjectExpressionWithAttr: (attrNode: any) => {
+    type: string;
+    properties: any[];
+};
+export declare const extendObjectExpression: (objectExpression: any, prop: any) => any;
+export declare const hackIntoExtenderCallExpression: (callExpression: any, prop: any) => any;
+export declare const isNodeCallExpression: (node: any) => boolean;
+export declare const isNodeObjectExpression: (node: any) => boolean;
+export declare const isNodeExtender: (node: any) => boolean;
+export declare const isNodeIdentifier: (node: any) => boolean;
+export declare const isNodeImportDeclaration: (node: any) => boolean;
+export declare const isNodeRequireCallExpression: (node: any) => boolean;
+export declare const isNodeImportOrRequire: (node: any) => boolean;
+export declare const getSrcFromImportOrRequire: (node: any) => any;

package/dist/ast.utils.js

@@ -1,64 +1,127 @@
 "use strict";
-var __values = (this && this.__values) || function(o) {
-    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-    if (m) return m.call(o);
-    if (o && typeof o.length === "number") return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
         }
+        return t;
     };
-    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+    return __assign.apply(this, arguments);
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.addHashAttributesToJsxTagsAst = void 0;
-var ast_iterator_1 = require("./ast-iterator");
-var ast_transformer_1 = require("./ast-transformer");
-var classic_parser_1 = require("./parsers/classic-parser");
-var jsx_parser_model_1 = require("./parsers/jsx-parser.model");
-var new_parser_1 = require("./parsers/new-parser");
-global.implementation = null;
-var classicParser = new classic_parser_1.ClassicJsxParser();
-var newParser = new new_parser_1.NewJsxParser();
-var parser = classicParser;
-var findImplementation = function (program) {
-    var e_1, _a;
-    var implementation = jsx_parser_model_1.ParserImplementations.classic;
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
     try {
-        for (var _b = __values((0, ast_iterator_1.astIterator)(program)), _c = _b.next(); !_c.done; _c = _b.next()) {
-            var node = _c.value;
-            if (node.type !== "ImportDeclaration") {
-                continue;
-            }
-            if (node.specifiers.some(function (n) {
-                return ["_jsxDEV", "jsxRuntime"].includes(n.local.name);
-            }) ||
-                ["react/jsx-dev-runtime", "react/jsx-runtime"].includes(node.source.value)) {
-                return jsx_parser_model_1.ParserImplementations.new;
-            }
-        }
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
     }
-    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    catch (error) { e = { error: error }; }
     finally {
         try {
-            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            if (r && !r.done && (m = i["return"])) m.call(i);
         }
-        finally { if (e_1) throw e_1.error; }
+        finally { if (e) throw e.error; }
     }
-    return implementation;
+    return ar;
 };
-function addHashAttributesToJsxTagsAst(program, attr) {
-    // Once in the program, we can determine which parser to use
-    if (global.implementation === null) {
-        global.implementation = findImplementation(program);
-        if (global.implementation === jsx_parser_model_1.ParserImplementations.new) {
-            parser = newParser;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
         }
     }
-    return (0, ast_transformer_1.astTransformer)(program, function (node) {
-        if (parser.isNodeReactElement(node) && !parser.isNodeReactFragment(node)) {
-            return parser.extendNodeWithAttributes(node, attr);
-        }
-    });
-}
-exports.addHashAttributesToJsxTagsAst = addHashAttributesToJsxTagsAst;
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getSrcFromImportOrRequire = exports.isNodeImportOrRequire = exports.isNodeRequireCallExpression = exports.isNodeImportDeclaration = exports.isNodeIdentifier = exports.isNodeExtender = exports.isNodeObjectExpression = exports.isNodeCallExpression = exports.hackIntoExtenderCallExpression = exports.extendObjectExpression = exports.createObjectExpressionWithAttr = exports.createObjectAssignCallExpressionWithIdentifier = void 0;
+var createObjectAssignCallExpressionWithIdentifier = function (identifier, objectExpression) {
+    return {
+        type: "CallExpression",
+        callee: {
+            type: "MemberExpression",
+            object: {
+                type: "Identifier",
+                name: "Object",
+            },
+            property: {
+                type: "Identifier",
+                name: "assign",
+            },
+            computed: false,
+            optional: false,
+        },
+        arguments: [
+            {
+                type: "ObjectExpression",
+                start: 14,
+                end: 16,
+                properties: [],
+            },
+            identifier,
+            objectExpression,
+        ],
+        optional: false,
+    };
+};
+exports.createObjectAssignCallExpressionWithIdentifier = createObjectAssignCallExpressionWithIdentifier;
+var createObjectExpressionWithAttr = function (attrNode) {
+    return {
+        type: "ObjectExpression",
+        properties: [attrNode],
+    };
+};
+exports.createObjectExpressionWithAttr = createObjectExpressionWithAttr;
+var extendObjectExpression = function (objectExpression, prop) {
+    return __assign(__assign({}, objectExpression), { properties: __spreadArray(__spreadArray([], __read(objectExpression.properties), false), [prop], false) });
+};
+exports.extendObjectExpression = extendObjectExpression;
+var hackIntoExtenderCallExpression = function (callExpression, prop) {
+    return __assign(__assign({}, callExpression), { arguments: __spreadArray(__spreadArray([], __read(callExpression.arguments), false), [
+            (0, exports.createObjectExpressionWithAttr)(prop),
+        ], false) });
+};
+exports.hackIntoExtenderCallExpression = hackIntoExtenderCallExpression;
+var isNodeCallExpression = function (node) {
+    return node.type === "CallExpression";
+};
+exports.isNodeCallExpression = isNodeCallExpression;
+var isNodeObjectExpression = function (node) {
+    return node.type === "ObjectExpression";
+};
+exports.isNodeObjectExpression = isNodeObjectExpression;
+var isNodeExtender = function (node) {
+    return ((0, exports.isNodeCallExpression)(node) &&
+        (node.callee.name === "_objectSpread" || node.callee.name === "_extends"));
+};
+exports.isNodeExtender = isNodeExtender;
+var isNodeIdentifier = function (node) {
+    return node.type === "Identifier";
+};
+exports.isNodeIdentifier = isNodeIdentifier;
+var isNodeImportDeclaration = function (node) {
+    return node.type === "ImportDeclaration";
+};
+exports.isNodeImportDeclaration = isNodeImportDeclaration;
+var isNodeRequireCallExpression = function (node) {
+    return ((0, exports.isNodeCallExpression)(node) &&
+        node.callee.name === "require" &&
+        node.arguments.length === 1);
+};
+exports.isNodeRequireCallExpression = isNodeRequireCallExpression;
+var isNodeImportOrRequire = function (node) {
+    return (0, exports.isNodeImportDeclaration)(node) || (0, exports.isNodeRequireCallExpression)(node);
+};
+exports.isNodeImportOrRequire = isNodeImportOrRequire;
+var getSrcFromImportOrRequire = function (node) {
+    if ((0, exports.isNodeImportDeclaration)(node)) {
+        return node.source.value;
+    }
+    if ((0, exports.isNodeRequireCallExpression)(node)) {
+        return node.arguments[0].value;
+    }
+    return null;
+};
+exports.getSrcFromImportOrRequire = getSrcFromImportOrRequire;

package/dist/index.d.ts

@@ -36,4 +36,4 @@ export interface ReactScopedCssPluginOptions {
 export interface VitePartialPlugin extends Plugin {
     enforce?: "pre" | "post";
 }
-export default function reactScopedCssPlugin(optionsIn?: ReactScopedCssPluginOptions): VitePartialPlugin[];
+export declare function reactScopedCssPlugin(optionsIn?: ReactScopedCssPluginOptions): VitePartialPlugin[];

package/dist/index.js

@@ -30,13 +30,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.reactScopedCssPlugin = void 0;
 /* eslint-disable no-useless-escape */
 var path = __importStar(require("path"));
 var js_xxhash_1 = require("js-xxhash");
 var pluginutils_1 = require("@rollup/pluginutils");
 var component_compiler_utils_1 = require("@vue/component-compiler-utils");
 var escodegen_1 = require("escodegen");
-var ast_utils_1 = require("./ast.utils");
+var ast_program_1 = require("./ast-program");
 var getFilenameFromPath = function (filePath) {
     var parts = filePath.split("/");
     return parts[parts.length - 1].split("?")[0];
@@ -102,7 +103,7 @@ function reactScopedCssPlugin(optionsIn) {
                 if (scopedCssInFileRegex.test(code)) {
                     var importerHash = generateHash(id);
                     var program = this.parse(code);
-                    var newAst = (0, ast_utils_1.addHashAttributesToJsxTagsAst)(program, "data-".concat(options.hashPrefix, "-").concat(importerHash));
+                    var newAst = (0, ast_program_1.addHashAttributesToJsxTagsAst)(program, "data-".concat(options.hashPrefix, "-").concat(importerHash));
                     return (0, escodegen_1.generate)(newAst);
                 }
                 if (scopedCssRegex.test(getFilenameFromPath(id))) {
@@ -113,4 +114,4 @@ function reactScopedCssPlugin(optionsIn) {
         },
     ];
 }
-exports.default = reactScopedCssPlugin;
+exports.reactScopedCssPlugin = reactScopedCssPlugin;

package/dist/parsers/classic-parser.js

@@ -10,72 +10,47 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ClassicJsxParser = void 0;
+var ast_utils_1 = require("../ast.utils");
 var ClassicJsxParser = /** @class */ (function () {
     function ClassicJsxParser() {
     }
     ClassicJsxParser.prototype.isNodeReactFragment = function (node) {
-        var _a, _b, _c, _d, _e, _f;
-        return (((_c = (_b = (_a = node === null || node === void 0 ? void 0 : node.arguments) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.object) === null || _c === void 0 ? void 0 : _c.name) === "React" &&
-            ((_f = (_e = (_d = node === null || node === void 0 ? void 0 : node.arguments) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.property) === null || _f === void 0 ? void 0 : _f.name) === "Fragment");
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        return ((((_b = (_a = node === null || node === void 0 ? void 0 : node.callee) === null || _a === void 0 ? void 0 : _a.object) === null || _b === void 0 ? void 0 : _b.name) === "React" ||
+            ((_e = (_d = (_c = node === null || node === void 0 ? void 0 : node.callee) === null || _c === void 0 ? void 0 : _c.object) === null || _d === void 0 ? void 0 : _d.object) === null || _e === void 0 ? void 0 : _e.name) === "_react") &&
+            ((_h = (_g = (_f = node === null || node === void 0 ? void 0 : node.arguments) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.property) === null || _h === void 0 ? void 0 : _h.name) === "Fragment");
     };
     ClassicJsxParser.prototype.isNodeReactElement = function (node) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f, _g;
         return ((node === null || node === void 0 ? void 0 : node.type) === "CallExpression" &&
-            ((_b = (_a = node === null || node === void 0 ? void 0 : node.callee) === null || _a === void 0 ? void 0 : _a.object) === null || _b === void 0 ? void 0 : _b.name) === "React" &&
-            ((_d = (_c = node === null || node === void 0 ? void 0 : node.callee) === null || _c === void 0 ? void 0 : _c.property) === null || _d === void 0 ? void 0 : _d.name) === "createElement");
+            (((_b = (_a = node === null || node === void 0 ? void 0 : node.callee) === null || _a === void 0 ? void 0 : _a.object) === null || _b === void 0 ? void 0 : _b.name) === "React" ||
+                ((_e = (_d = (_c = node === null || node === void 0 ? void 0 : node.callee) === null || _c === void 0 ? void 0 : _c.object) === null || _d === void 0 ? void 0 : _d.object) === null || _e === void 0 ? void 0 : _e.name) === "_react") &&
+            ((_g = (_f = node === null || node === void 0 ? void 0 : node.callee) === null || _f === void 0 ? void 0 : _f.property) === null || _g === void 0 ? void 0 : _g.name) === "createElement");
     };
     ClassicJsxParser.prototype.extendNodeWithAttributes = function (node, attr) {
         var _this = this;
-        var _a;
-        var arg = (_a = node === null || node === void 0 ? void 0 : node.arguments) === null || _a === void 0 ? void 0 : _a[1];
         return __assign(__assign({}, node), { arguments: node === null || node === void 0 ? void 0 : node.arguments.map(function (v, i) {
-                if (i === 1) {
-                    if (v.type === "ObjectExpression") {
-                        return __assign(__assign({}, v), { properties: __spreadArray(__spreadArray([], __read(arg.properties), false), [_this.createAttributeNode(attr)], false) });
-                    }
-                    else if (v.type === "CallExpression" &&
-                        v.callee.name === "_objectSpread") {
-                        var args = __spreadArray([], __read(v.arguments), false);
-                        args[0].properties = __spreadArray(__spreadArray([], __read(args[0].properties), false), [
-                            _this.createAttributeNode(attr),
-                        ], false);
-                        return __assign(__assign({}, v), { arguments: args });
-                    }
-                    else {
-                        return {
-                            type: "ObjectExpression",
-                            properties: [_this.createAttributeNode(attr)],
-                        };
-                    }
+                // Second argument is attributes so ignore others
+                if (i !== 1) {
+                    return v;
+                }
+                var attrNode = _this.createAttributeNode(attr);
+                // If it's an object expression, extend it
+                if ((0, ast_utils_1.isNodeObjectExpression)(v)) {
+                    return (0, ast_utils_1.extendObjectExpression)(v, attrNode);
+                }
+                // If it's an extender, hack into it
+                if ((0, ast_utils_1.isNodeExtender)(v)) {
+                    return (0, ast_utils_1.hackIntoExtenderCallExpression)(v, attrNode);
+                }
+                // If it's an identifier, do Object.assign to be safe
+                if ((0, ast_utils_1.isNodeIdentifier)(v)) {
+                    return (0, ast_utils_1.createObjectAssignCallExpressionWithIdentifier)(v, (0, ast_utils_1.createObjectExpressionWithAttr)(attrNode));
                 }
-                return v;
+                // Worst case override with
+                return (0, ast_utils_1.createObjectExpressionWithAttr)(attrNode);
             }) });
     };
     ClassicJsxParser.prototype.createAttributeNode = function (attr) {

package/dist/parsers/new-parser.js

@@ -10,71 +10,65 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NewJsxParser = void 0;
+var ast_utils_1 = require("../ast.utils");
 var NewJsxParser = /** @class */ (function () {
     function NewJsxParser() {
     }
     NewJsxParser.prototype.isNodeReactFragment = function (node) {
-        var _a, _b, _c, _d;
-        return (((_b = (_a = node.arguments) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.type) === "Identifier" &&
-            ["_Fragment", "Fragment"].includes((_d = (_c = node.arguments) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.name));
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        // Always a call expression
+        if ((node === null || node === void 0 ? void 0 : node.type) !== "CallExpression") {
+            return false;
+        }
+        if (((_b = (_a = node.arguments) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.type) === "Identifier" &&
+            ["_Fragment", "Fragment"].includes((_d = (_c = node.arguments) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.name)) {
+            return true;
+        }
+        if (((_f = (_e = node.arguments) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.type) === "MemberExpression" &&
+            ["_Fragment", "Fragment"].includes((_j = (_h = (_g = node.arguments) === null || _g === void 0 ? void 0 : _g[0]) === null || _h === void 0 ? void 0 : _h.property) === null || _j === void 0 ? void 0 : _j.name)) {
+            return true;
+        }
+        return false;
     };
     NewJsxParser.prototype.isNodeReactElement = function (node) {
-        var _a;
-        return ((node === null || node === void 0 ? void 0 : node.type) === "CallExpression" &&
-            ["_jsxDEV", "_jsx", "_jsxs", "jsxDev", "jsx", "jsxs"].includes((_a = node === null || node === void 0 ? void 0 : node.callee) === null || _a === void 0 ? void 0 : _a.name));
+        var _a, _b, _c, _d, _e, _f;
+        // Always a call expression
+        if ((node === null || node === void 0 ? void 0 : node.type) !== "CallExpression") {
+            return false;
+        }
+        if (["_jsxDEV", "_jsx", "_jsxs", "jsxDev", "jsx", "jsxs"].includes((_a = node === null || node === void 0 ? void 0 : node.callee) === null || _a === void 0 ? void 0 : _a.name)) {
+            return true;
+        }
+        if (((_b = node === null || node === void 0 ? void 0 : node.callee) === null || _b === void 0 ? void 0 : _b.type) === "SequenceExpression" &&
+            ["_jsxDEV", "_jsx", "_jsxs", "jsxDev", "jsx", "jsxs"].includes((_f = (_e = (_d = (_c = node === null || node === void 0 ? void 0 : node.callee) === null || _c === void 0 ? void 0 : _c.expressions) === null || _d === void 0 ? void 0 : _d[1]) === null || _e === void 0 ? void 0 : _e.property) === null || _f === void 0 ? void 0 : _f.name)) {
+            return true;
+        }
+        return false;
     };
     NewJsxParser.prototype.extendNodeWithAttributes = function (node, attr) {
         var _this = this;
-        var _a;
-        var arg = (_a = node === null || node === void 0 ? void 0 : node.arguments) === null || _a === void 0 ? void 0 : _a[1];
         return __assign(__assign({}, node), { arguments: node === null || node === void 0 ? void 0 : node.arguments.map(function (v, i) {
-                if (i === 1) {
-                    if (v.type === "ObjectExpression") {
-                        return __assign(__assign({}, v), { properties: __spreadArray(__spreadArray([], __read(arg.properties), false), [_this.createAttributeNode(attr)], false) });
-                    }
-                    else if (v.type === "CallExpression" &&
-                        v.callee.name === "_objectSpread") {
-                        var args = __spreadArray([], __read(v.arguments), false);
-                        args[0].properties = __spreadArray(__spreadArray([], __read(args[0].properties), false), [
-                            _this.createAttributeNode(attr),
-                        ], false);
-                        return __assign(__assign({}, v), { arguments: args });
-                    }
-                    else {
-                        return {
-                            type: "ObjectExpression",
-                            properties: [_this.createAttributeNode(attr)],
-                        };
-                    }
+                // Second argument is attributes so ignore others
+                if (i !== 1) {
+                    return v;
+                }
+                var attrNode = _this.createAttributeNode(attr);
+                // If it's an object expression, extend it
+                if ((0, ast_utils_1.isNodeObjectExpression)(v)) {
+                    return (0, ast_utils_1.extendObjectExpression)(v, attrNode);
+                }
+                // If it's an extender, hack into it
+                if ((0, ast_utils_1.isNodeExtender)(v)) {
+                    return (0, ast_utils_1.hackIntoExtenderCallExpression)(v, attrNode);
+                }
+                // If it's an identifier, do Object.assign to be safe
+                if ((0, ast_utils_1.isNodeIdentifier)(v)) {
+                    return (0, ast_utils_1.createObjectAssignCallExpressionWithIdentifier)(v, (0, ast_utils_1.createObjectExpressionWithAttr)(attrNode));
                 }
-                return v;
+                // Worst case override with
+                return (0, ast_utils_1.createObjectExpressionWithAttr)(attrNode);
             }) });
     };
     NewJsxParser.prototype.createAttributeNode = function (attr) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rollup-plugin-react-scoped-css",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "A rollup plugin designed to allow scoped css to be run in react (Compatible with vite and rollup)",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -40,7 +40,9 @@
     "rollup": "^2.56.2"
   },
   "devDependencies": {
+    "@babel/core": "^7.16.0",
     "@babel/preset-env": "^7.15.0",
+    "@babel/preset-react": "^7.16.0",
     "@babel/preset-typescript": "^7.15.0",
     "@semantic-release/commit-analyzer": "^9.0.2",
     "@semantic-release/git": "^10.0.1",

package/.github/workflows/pull-request.yml

@@ -1,20 +0,0 @@
-name: Pull Request Workflow
-
-on:
-  - pull_request
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v2
-      - name: Use Node.js 16.x
-        uses: actions/setup-node@v2
-        with:
-          node-version: 16.x
-          cache: 'npm'
-      - run: npm ci
-      - run: npm run build --if-present
-      - run: npm test
-      - run: npm run lint

package/.github/workflows/release.yml

@@ -1,30 +0,0 @@
-name: Release Workflow
-
-on:
-  push:
-    branches:
-      - 'main'
-    paths-ignore:
-      - '.github/**'
-
-jobs:
-  release:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@v2
-      - name: Use Node.js 16.x
-        uses: actions/setup-node@v2
-        with:
-          node-version: 16.x
-          registry-url: 'https://registry.npmjs.org'
-          cache: 'npm'
-      - run: npm ci
-      - run: npm run build --if-present
-      - name: Release
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-        run: npx semantic-release
-      
-