fix: cssobj param order bug

Author: futurist

.babelrc

@@ -1,4 +1,4 @@
 {
-  "plugins": ["./index"],
+  "plugins": ["./index", "add-module-exports"],
   "ignore": ["node_modules"]
 }

README.md

@@ -1,33 +1,42 @@
-# babel-plugin-transform-cssobj-jsx
-Babel plugin to transform class names into cssobj localized names, easily transform existing code into cssobj.
+# babel-plugin-transform-cssobj
+Babel plugin to transform css into cssobj (CSS in JS solution), map class names into cssobj localized names
 
 [![Join the chat at https://gitter.im/css-in-js/cssobj](https://badges.gitter.im/css-in-js/cssobj.svg)](https://gitter.im/css-in-js/cssobj)
-[![Build Status](https://travis-ci.org/cssobj/babel-plugin-transform-cssobj-jsx.svg?branch=master)](https://travis-ci.org/cssobj/babel-plugin-transform-cssobj-jsx)
-[![Coverage Status](https://coveralls.io/repos/github/cssobj/babel-plugin-transform-cssobj-jsx/badge.svg?branch=master)](https://coveralls.io/github/cssobj/babel-plugin-transform-cssobj-jsx?branch=master)
-[![npm](https://img.shields.io/npm/v/babel-plugin-transform-cssobj-jsx.svg "Version")](https://www.npmjs.com/package/cssobj)
+[![Build Status](https://travis-ci.org/cssobj/babel-plugin-transform-cssobj.svg?branch=master)](https://travis-ci.org/cssobj/babel-plugin-transform-cssobj)
+[![Coverage Status](https://coveralls.io/repos/github/cssobj/babel-plugin-transform-cssobj/badge.svg?branch=master)](https://coveralls.io/github/cssobj/babel-plugin-transform-cssobj?branch=master)
+[![npm](https://img.shields.io/npm/v/babel-plugin-transform-cssobj.svg "Version")](https://www.npmjs.com/package/cssobj)
 
 ## Usage
 
 1. Install
 
   ``` bash
-  npm install --save-dev babel-plugin-transform-cssobj-jsx
+  npm install --save-dev babel-plugin-transform-cssobj
   ```
 
 2. In your `.babelrc`:
 
   ``` json
   {
-    "plugins": ["transform-cssobj-jsx"]
+    "plugins": ["transform-cssobj"]
   }
   ```
 
-3. **Wrap your JSX in result.mapClass()**
+3. **Write CSS as normal, Wrap JSX in result.mapClass()**
 
     ``` javascript
-    const style = cssobj(obj)
-
-    const html = style.mapClass(
+    const result = CSSOBJ`
+    ---
+    plugins:
+      - default-unit: px
+      - flexbox
+    ---
+    body { color: red; font-size:12 }
+    .container { display: flex; height: ${ getWindowHeight() }; }
+    .item { flex: 1; width: 100; height: ${ v=> v.prev + 1 } }
+    `
+
+    const html = result.mapClass(
       <div className='container'>
         <div className={func()}>
         <p className='!news item active'> </p></div></div>
@@ -37,6 +46,27 @@ Babel plugin to transform class names into cssobj localized names, easily transf
     Which transform into below code:
 
     ``` javascript
+    import cssobj from "cssobj";
+    import cssobj_plugin_default_unit from "cssobj-plugin-default-unit";
+    import cssobj_plugin_flexbox from "cssobj-plugin-flexbox";
+    const result = cssobj({
+      plugins: [cssobj_plugin_default_unit('px'), cssobj_plugin_flexbox()]
+    }, {
+        body: {
+            color: 'red',
+            fontSize: 12
+        },
+        '.container': {
+            display: 'flex',
+            height: getWindowHeight()
+        },
+        '.item': {
+            flex: 1,
+            width: 100,
+            height: v => v.prev + 1
+        }
+    });
+
     const html = (
       <div className={style.mapClass('container')}>
         <div className={style.mapClass(func())}>
@@ -72,7 +102,7 @@ You have two way to escape the transform
 
   ``` json
   {
-    "plugins": [ ["transform-cssobj-jsx", {"mapName": "makeLocal"}] ]
+    "plugins": [ ["transform-cssobj", {"mapName": "makeLocal"}] ]
   }
   ```
 

index.js

@@ -96,7 +96,7 @@ module.exports = function (babel) {
               t.stringLiteral(cssobjNS.path)
             ))
 
-            path.replaceWithSourceString(`${cssobjName} (${config}, ${objStr})`)
+            path.replaceWithSourceString(`${cssobjName} (${objStr}, ${config})`)
           }
       },
       CallExpression (path, state) {

package.json

@@ -1,7 +1,7 @@
 {
-  "name": "babel-plugin-transform-cssobj-jsx",
-  "version": "2.1.0",
-  "description": "Babel plugin to transform class names into cssobj localized",
+  "name": "babel-plugin-transform-cssobj",
+  "version": "3.0.1",
+  "description": "Babel plugin to transform css into cssobj (CSS in JS engine), map class names into cssobj localized names",
   "main": "index.js",
   "directories": {
     "test": "test"
@@ -36,6 +36,7 @@
   "homepage": "https://github.com/cssobj/babel-plugin-transform-cssobj-jsx#readme",
   "devDependencies": {
     "babel-core": "^6.21.0",
+    "babel-plugin-transform-es2015-modules-umd": "^6.18.0",
     "chai": "^3.5.0",
     "coveralls": "^2.11.15",
     "gulp": "^3.9.1",
@@ -46,6 +47,6 @@
   "dependencies": {
     "babel-plugin-syntax-jsx": "^6.18.0",
     "cssobj-converter": "*",
-    "objutil": "^2.0.6"
+    "objutil": "^2.0.7"
   }
 }

test/test.js

@@ -75,18 +75,18 @@ import cssobj_plugin_flexbox from "cssobj-plugin-flexbox";
 
 var getUnit = v => v;
 var d = cssobj({
-  plugins: [cssobj_plugin_default_unit(getUnit()), cssobj_plugin_default_unit_2('px'), cssobj_plugin_default_unit_3(), cssobj_plugin_flexbox({
-    pref: 1234,
-    abc: 'def'
-  })]
-}, {
   body: [{
     color: 'red'
   }, {
     color: 'v=>v'
   }, {
     fontSize: 234
   }]
+}, {
+  plugins: [cssobj_plugin_default_unit(getUnit()), cssobj_plugin_default_unit_2('px'), cssobj_plugin_default_unit_3(), cssobj_plugin_flexbox({
+    pref: 1234,
+    abc: 'def'
+  })]
 });`)
   })
 
@@ -109,9 +109,9 @@ plugins:
 import cssobj_plugin_default_unit from "cssobj-plugin-default-unit";
 import cssobj_plugin_flexbox from "cssobj-plugin-flexbox";
 
-cssobj({
+cssobj({}, {
   plugins: [cssobj_plugin_default_unit('px'), cssobj_plugin_flexbox()]
-}, {});`)
+});`)
   })
 
   it('should work with no config', function() {
@@ -123,15 +123,15 @@ body { color: $\{getColor()\}; }
 `
     expect(lib(node)).to.equal(`import cssobj from "cssobj";
 
-var d = cssobj({}, {
+var d = cssobj({
   body: {
     color: getColor()
   },
   '.p1': {
     color: 'blue',
     fontSize: '12px'
   }
-});`)
+}, {});`)
 
         node = `
 var d = CSSOBJ\`
@@ -142,11 +142,11 @@ body {color: red;}
 `
     expect(lib(node)).equal(`import cssobj from "cssobj";
 
-var d = cssobj({}, {
+var d = cssobj({
   body: {
     color: 'red'
   }
-});`)
+}, {});`)
   })
 
   it('should not change other templateLiteral', function() {
@@ -200,9 +200,9 @@ plugins:
     expect(lib(node)).equal(`import abc from "./cssobj";
 import unit from "./unit";
 import box from "cssobj-plugin-flexbox";
-abc({
+abc({}, {
   plugins: [unit(), box()]
-}, {});`)
+});`)
   })
 
 })