feat: add x-if x-else x-elseif

.gitignore

@@ -1,4 +1,6 @@
 .idea
+lib
+
 # Logs
 logs
 *.log

__tests__/__fixtures__/x-if-else/actual.js

@@ -0,0 +1,11 @@
+import { createElement } from 'react';
+
+function Foo(props) {
+  return (
+    <View {...props} x-if={true} className="container">
+      <View x-if={condition}>First</View>
+      <View x-if={condition}>First</View><View x-elseif={another}>Second</View><View x-else>Third</View>
+      <View x-else>Third</View>
+    </View>
+  )
+}

__tests__/__fixtures__/x-if-else/expected.js

@@ -0,0 +1,67 @@
+function _extends() {
+    _extends = Object.assign || function(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source){
+                if (Object.prototype.hasOwnProperty.call(source, key)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+        return target;
+    };
+    return _extends.apply(this, arguments);
+}
+import { createCondition as __create_condition__ } from "babel-runtime-jsx-plus";
+import { createElement } from "react";
+function Foo(props) {
+    return __create_condition__([
+        [
+            function() {
+                return true;
+            },
+            function() {
+                return React.createElement(View, _extends({}, props, {
+                    className: "container"
+                }), __create_condition__([
+                    [
+                        function() {
+                            return condition;
+                        },
+                        function() {
+                            return React.createElement(View, null, "First");
+                        }
+                    ]
+                ]), __create_condition__([
+                    [
+                        function() {
+                            return condition;
+                        },
+                        function() {
+                            return React.createElement(View, null, "First");
+                        }
+                    ],
+                    [
+                        function() {
+                            return another;
+                        },
+                        function() {
+                            return React.createElement(View, null, "Second");
+                        }
+                    ],
+                    [
+                        function() {
+                            return true;
+                        },
+                        function() {
+                            return React.createElement(View, null, "Third");
+                        }
+                    ]
+                ]), /*#__PURE__*/ React.createElement(View, {
+                    "x-else": true
+                }, "Third"));
+            }
+        ]
+    ]);
+}
+

__tests__/__fixtures__/x-if/actual.js

@@ -0,0 +1,9 @@
+import { createElement } from 'react';
+
+function Foo(props) {
+  return (
+    <View {...props} x-if={true} className="container">
+      <View x-if={condition}>First</View>
+    </View>
+  )
+}

__tests__/__fixtures__/x-if/expected.js

@@ -0,0 +1,40 @@
+function _extends() {
+    _extends = Object.assign || function(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source){
+                if (Object.prototype.hasOwnProperty.call(source, key)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+        return target;
+    };
+    return _extends.apply(this, arguments);
+}
+import { createCondition as __create_condition__ } from "babel-runtime-jsx-plus";
+import { createElement } from "react";
+function Foo(props) {
+    return __create_condition__([
+        [
+            function() {
+                return true;
+            },
+            function() {
+                return React.createElement(View, _extends({}, props, {
+                    className: "container"
+                }), __create_condition__([
+                    [
+                        function() {
+                            return condition;
+                        },
+                        function() {
+                            return React.createElement(View, null, "First");
+                        }
+                    ]
+                ]));
+            }
+        ]
+    ]);
+}
+

__tests__/usage.js

@@ -1,11 +1,27 @@
 const swc = require('@swc/core')
 const path = require('path')
-const ConsoleStripper = require(path.join(__dirname, '../lib/index.js')).default;
+const fs = require('fs');
+const JSXConditionTransformPlugin = require(path.join(__dirname, '../lib/index.js')).default;
 
-it('should strip console call', () => {
-    const output = swc.transformSync(`console.log('Foo')`, {
-        plugin: (m) => (new ConsoleStripper()).visitModule(m),
-    });
+describe('', () => {
+  const fixturesDir = path.join(__dirname, '__fixtures__');
+  fs.readdirSync(fixturesDir).map((caseName) => {
+    it(`should ${caseName.split('-').join(' ')}`, () => {
+      const fixtureDir = path.join(fixturesDir, caseName);
+      const actualPath = path.join(fixtureDir, 'actual.js');
+      const actualCode = fs.readFileSync(actualPath, {encoding: 'utf-8'});
+      const expectedCode = fs.readFileSync(path.join(fixtureDir, 'expected.js'), { encoding: 'utf-8' });
+
+      const transformedOutput = swc.transformSync(actualCode, {
+        jsc: {
+          parser: {
+            jsx: true
+          },
+        },
+        plugin: JSXConditionTransformPlugin
+      });
 
-    expect(output.code.replace(/\n/g, '')).toBe('void 0;')
-})
+      expect(transformedOutput.code.trim()).toBe(expectedCode.trim());
+    });
+  });
+});

jest.config.js

@@ -0,0 +1,8 @@
+// Sync object
+/** @type {import('@jest/types').Config.InitialOptions} */
+const config = {
+  verbose: true,
+  testMatch: ['!**/__fixtures__/**', '**/__tests__/**/*.js']
+};
+
+module.exports = config;

package.json

@@ -1,10 +1,11 @@
 {
   "name": "swc-plugin-transform-jsx-condition",
-  "version": "0.1.0",
+  "version": "0.1.0-beta.1",
   "description": "Support of transform jsx condition directive based on SWC",
   "main": "lib/index.js",
   "scripts": {
     "build": "tsc -d",
+    "build:watch": "tsc -d --watch",
     "test": "jest"
   },
   "types": "./lib/index.d.ts",
@@ -18,7 +19,7 @@
     "typescript": "^4.7.3"
   },
   "dependencies": {},
-  "author": "andycall",
+  "author": "jsx-plus <[email protected]>",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/jsx-plus/swc-plugin-transform-jsx-condition/issues"