Merge pull request #97 from phyllisstein/babel-7-beta-3

Support Babel v7.0.0-beta.3 (fixes #96).

Author: mxstbr

src/utils/detectors.js

@@ -1,16 +1,33 @@
 import * as t from 'babel-types'
 
 const importLocalName = (name, state) => {
-  const imports = state.file.metadata.modules.imports
-  const styledImports = imports.find(x => x.source === 'styled-components')
-  if (styledImports) {
-    const specifier = styledImports.specifiers.find(x => x.imported === name)
-    if (specifier) {
-      return specifier.local
+  let localName = name === 'default' ? 'styled' : name
+
+  state.file.path.traverse({
+    ImportDeclaration: {
+      exit(path) {
+        const { node } = path
+
+        if (node.source.value === 'styled-components') {
+          for (const specifier of path.get('specifiers')) {
+            if (specifier.isImportDefaultSpecifier()) {
+              localName = specifier.node.local.name
+            }
+
+            if (specifier.isImportSpecifier() && specifier.node.imported.name === name) {
+              localName = specifier.node.local.name
+            }
+
+            if (specifier.isImportNamespaceSpecifier()) {
+              localName = specifier.node.local.name
+            }
+          }
+        }
+      }
     }
-  }
-  // import not found - return default name
-  return name === 'default' ? 'styled' : name
+  })
+
+  return localName
 }
 
 export const isStyled = (tag, state) => {

test/fixtures/19-transpile-require-default/after.js

@@ -3,14 +3,14 @@ const styled_default = require("styled-components/no-parser");
 const TestNormal = styled.div.withConfig({
   displayName: "before__TestNormal",
   componentId: "y0c69d-0"
-})([["{width: 100%;}"]]);
+})([["{width:100%;}"]]);
 
 const Test = styled_default.default.div.withConfig({
   displayName: "before__Test",
   componentId: "y0c69d-1"
-})([["{width: 100%;}"]]);
+})([["{width:100%;}"]]);
 
 const TestCallExpression = styled_default.default(Test).withConfig({
   displayName: "before__TestCallExpression",
   componentId: "y0c69d-2"
-})([["{height: 20px;}"]]);
+})([["{height:20px;}"]]);