@builder.io/mitosis 0.3.14 → 0.3.15

package/dist/src/generators/react-native/index.js

@@ -167,29 +167,44 @@ var TWRNC_STYLES_PLUGIN = function () { return ({
         post: function (json) {
             (0, legacy_1.default)(json).forEach(function (node) {
                 if ((0, is_mitosis_node_1.isMitosisNode)(node)) {
-                    var combinedClasses = [
-                        node.properties.class,
-                        node.properties.className,
-                        node.bindings.class,
-                        node.bindings.className,
-                    ]
+                    var staticClasses = [node.properties.class, node.properties.className]
                         .filter(Boolean)
                         .join(' ');
-                    if (combinedClasses) {
-                        node.properties.style = "{tw`".concat(combinedClasses, "`}");
-                    }
-                    if (node.properties.class) {
-                        delete node.properties.class;
-                    }
-                    if (node.properties.className) {
-                        delete node.properties.className;
-                    }
-                    if (node.bindings.class) {
-                        delete node.bindings.class;
-                    }
-                    if (node.bindings.className) {
-                        delete node.bindings.className;
+                    var dynamicClasses = [node.bindings.class, node.bindings.className].filter(Boolean);
+                    if (staticClasses || dynamicClasses.length) {
+                        var styleCode = '';
+                        if (staticClasses) {
+                            styleCode = "tw`".concat(staticClasses, "`");
+                        }
+                        if (dynamicClasses.length) {
+                            var dynamicCode = dynamicClasses
+                                .map(function (dc) { return (dc && dc.code ? dc.code : null); })
+                                .filter(Boolean)
+                                .join(', ');
+                            if (dynamicCode) {
+                                if (styleCode) {
+                                    // If we have both static and dynamic classes
+                                    styleCode = "tw.style(".concat(styleCode, ", ").concat(dynamicCode, ")");
+                                }
+                                else if (dynamicClasses.length > 1) {
+                                    // If we have multiple dynamic classes
+                                    styleCode = "tw.style([".concat(dynamicCode, "])");
+                                }
+                                else {
+                                    // If we have a single dynamic class
+                                    styleCode = "tw.style(".concat(dynamicCode, ")");
+                                }
+                            }
+                        }
+                        if (styleCode) {
+                            node.bindings.style = (0, bindings_1.createSingleBinding)({ code: styleCode });
+                        }
                     }
+                    // Clean up original class and className properties/bindings
+                    delete node.properties.class;
+                    delete node.properties.className;
+                    delete node.bindings.class;
+                    delete node.bindings.className;
                 }
             });
         },

package/package.json

@@ -22,7 +22,7 @@
     "name": "Builder.io",
     "url": "https://www.builder.io"
   },
-  "version": "0.3.14",
+  "version": "0.3.15",
   "homepage": "https://github.com/BuilderIO/mitosis",
   "main": "./dist/src/index.js",
   "exports": {