chore(getComponentInfo): handle HOC default exports (Semantic-Org#2883)

* chore(getComponentInfo): handle HOC default exports

* fix(getComponentInfo): subcomponents start with dirname

Author: levithomason

gulp/plugins/util/getComponentInfo.js

@@ -1,6 +1,6 @@
 import _ from 'lodash'
 import path from 'path'
-import { defaultHandlers, parse } from 'react-docgen'
+import { defaultHandlers, parse, resolver } from 'react-docgen'
 import fs from 'fs'
 
 import { parseDefaultValue, parseDocblock, parserCustomHandler, parseType } from './'
@@ -19,7 +19,22 @@ const getComponentInfo = (filepath) => {
   const componentType = path.basename(path.dirname(dir)).replace(/s$/, '')
 
   // start with react-docgen info
-  const info = parse(contents, null, [...defaultHandlers, parserCustomHandler])
+  const components = parse(contents, resolver.findAllComponentDefinitions, [
+    ...defaultHandlers,
+    parserCustomHandler,
+  ])
+  if (!components.length) {
+    throw new Error(`Could not find a component definition in "${filepath}".`)
+  }
+  if (components.length > 1) {
+    throw new Error(
+      [
+        `Found more than one component definition in "${filepath}".`,
+        'This is currently not supported, please ensure your module only defines a single React component.',
+      ].join(' '),
+    )
+  }
+  const info = components[0]
 
   // remove keys we don't use
   delete info.methods
@@ -40,11 +55,13 @@ const getComponentInfo = (filepath) => {
     ? null
     : info.displayName.replace(info.parentDisplayName, '')
 
+  // "ListItem.js" is a subcomponent is the "List" directory
+  const subcomponentRegExp = new RegExp(`^${dirname}\\w+\\.js$`)
+
   info.subcomponents = info.isParent
     ? fs
       .readdirSync(dir)
-      .filter(file => /^(?!index).*\.js$/.test(file))
-      .filter(file => dirname !== path.basename(file, path.extname(file)))
+      .filter(file => subcomponentRegExp.test(file))
       .map(file => path.basename(file, path.extname(file)))
     : null