@teleporthq/teleport-plugin-react-styled-components - npm Package Compare versions

Comparing version 0.10.0 to 0.10.1

dist/cjs/index.js

@@ -46,6 +46,6 @@ "use strict";
     var reactStyledComponentsPlugin = function (structure) { return __awaiter(_this, void 0, void 0, function () {
-        var uidl, chunks, dependencies, node, componentChunk, jsxNodesLookup, propsPrefix, jssStyleMap;
+        var uidl, chunks, dependencies, node, name, componentChunk, jsxNodesLookup, propsPrefix, jssStyleMap;
         return __generator(this, function (_a) {
             uidl = structure.uidl, chunks = structure.chunks, dependencies = structure.dependencies;
-            node = uidl.node;
+            node = uidl.node, name = uidl.name;
             componentChunk = chunks.find(function (chunk) { return chunk.name === componentChunkName; });
@@ -63,5 +63,7 @@ if (!componentChunk) {
                     var root_1 = jsxNodesLookup[key];
-                    var className = "" + teleport_shared_1.StringUtils.dashCaseToUpperCamelCase(key);
+                    var className = teleport_shared_1.StringUtils.dashCaseToUpperCamelCase(key);
                     // Styled components might create an element that clashes with native element (Text, View, Image, etc.)
-                    if (illegalComponentNames.includes(className)) {
+                    if (illegalComponentNames.includes(className) ||
+                        teleport_shared_1.StringUtils.dashCaseToUpperCamelCase(key) === name ||
+                        Object.keys(dependencies).includes(className)) {
                         className = "Styled" + className;
@@ -68,0 +70,0 @@ }

dist/esm/index.js

@@ -9,3 +9,3 @@ import { ChunkType, FileType, } from '@teleporthq/teleport-types';
         const { uidl, chunks, dependencies } = structure;
-        const { node } = uidl;
+        const { node, name } = uidl;
         const componentChunk = chunks.find((chunk) => chunk.name === componentChunkName);
@@ -23,5 +23,7 @@ if (!componentChunk) {
                 const root = jsxNodesLookup[key];
-                let className = `${StringUtils.dashCaseToUpperCamelCase(key)}`;
+                let className = StringUtils.dashCaseToUpperCamelCase(key);
                 // Styled components might create an element that clashes with native element (Text, View, Image, etc.)
-                if (illegalComponentNames.includes(className)) {
+                if (illegalComponentNames.includes(className) ||
+                    StringUtils.dashCaseToUpperCamelCase(key) === name ||
+                    Object.keys(dependencies).includes(className)) {
                     className = `Styled${className}`;
@@ -28,0 +30,0 @@ }

package.json

 {
   "name": "@teleporthq/teleport-plugin-react-styled-components",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "description": "A plugin for injecting the styles through styled-components inside React components",
@@ -30,7 +30,7 @@ "author": "teleportHQ",
     "@babel/types": "^7.5.5",
-    "@teleporthq/teleport-plugin-common": "^0.10.0",
-    "@teleporthq/teleport-shared": "^0.10.0",
-    "@teleporthq/teleport-types": "^0.10.0"
+    "@teleporthq/teleport-plugin-common": "^0.10.1",
+    "@teleporthq/teleport-shared": "^0.10.1",
+    "@teleporthq/teleport-types": "^0.10.1"
   },
-  "gitHead": "4f450e577ee86798ffdc26ff2dfa6c1b85e254df"
+  "gitHead": "7a290387c6a68eec58f6cc2aac5e5bcdced0184e"
 }

src/index.ts

@@ -31,3 +31,3 @@ import * as types from '@babel/types'
     const { uidl, chunks, dependencies } = structure
-    const { node } = uidl
+    const { node, name } = uidl
     const componentChunk = chunks.find((chunk) => chunk.name === componentChunkName)
@@ -47,5 +47,10 @@ if (!componentChunk) {
         const root = jsxNodesLookup[key]
-        let className = `${StringUtils.dashCaseToUpperCamelCase(key)}`
+        let className = StringUtils.dashCaseToUpperCamelCase(key)
+
         // Styled components might create an element that clashes with native element (Text, View, Image, etc.)
-        if (illegalComponentNames.includes(className)) {
+        if (
+          illegalComponentNames.includes(className) ||
+          StringUtils.dashCaseToUpperCamelCase(key) === name ||
+          Object.keys(dependencies).includes(className)
+        ) {
           className = `Styled${className}`
@@ -52,0 +57,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

320751

increased by1.06%

Lines of code

637

increased by1.27%

Dependency changes

• Updated@teleporthq/teleport-plugin-common@^0.10.1

• Updated@teleporthq/teleport-shared@^0.10.1

• Updated@teleporthq/teleport-types@^0.10.1