diff --git a/README.md b/README.md
index 058dfa1..d894d17 100644
--- a/README.md
+++ b/README.md
@@ -60,6 +60,12 @@ If you pass in a string, `path` should be the relative path from the `gulpfile.j
If you pass in a function, `path` is expected to return a string. The return value can be either a relative from where the generated documentation will be output to the source code, or an absolute path / URL pointing to the source code.
+#### resolver
+
+* Type: `function`
+
+A resolver function to pass into react-docgen for identifying React Components from source code. The default resolver recognizes all React Components exported from a module, to supply your own custom resolver function, see the [react-docgen](https://github.com/reactjs/react-docgen) docs for more information.
+
## Contributors
- [@marsjosephine](https://github.com/marsjosephine)
diff --git a/index.js b/index.js
index 1bf22e3..b964baa 100644
--- a/index.js
+++ b/index.js
@@ -41,7 +41,8 @@ module.exports = function(options) {
// get the markdown documentation for the file
var markdownDoc = reactDocgenMarkdown(file.contents, {
componentName : gUtil.replaceExtension(file.relative, ''),
- srcLink : srcLink
+ srcLink : srcLink,
+ resolver : options.resolver
});
// replace the file contents and extension
diff --git a/src/react-docgen-md.js b/src/react-docgen-md.js
index ff545dd..e3a30c7 100644
--- a/src/react-docgen-md.js
+++ b/src/react-docgen-md.js
@@ -86,6 +86,12 @@ Handlebars.registerHelper('indent', function(indentLevel, options) {
return lines.join('\n');
});
+Handlebars.registerHelper('each_with_sort', function(obj, opts) {
+ return _(obj).keys().sort().reduce(function(s, key) {
+ return s + opts.fn({ key: key, value: obj[key]});
+ }, '');
+});
+
/********************************************************
* Top-level handlebars template *
********************************************************/
@@ -93,29 +99,34 @@ Handlebars.registerHelper('indent', function(indentLevel, options) {
var reactDocgenTemplate = Handlebars.compile('\
## {{componentName}}\n\n\
{{#if srcLink }}From [`{{srcLink}}`]({{srcLink}})\n\n\{{/if}}\
-{{#if description}}{{{description}}}\n\n{{/if}}\
-{{#each props}}\
-#### {{@key}}\n\n\
+{{#each components}}\
+{{#if this.displayName}}### {{this.displayName}}\n\n\{{/if}}\
+{{#if this.description}}{{{this.description}}}\n\n{{/if}}\
+{{#each_with_sort this.props}}\
+#### {{key}}\n\n\
```js\n\
-{{#if this.required}}// Required\n{{/if}}\
-{{#if this.defaultValue}}// Default: {{{this.defaultValue.value}}}\n{{/if}}\
-{{@key}}: {{> (whichPartial this.type) this.type level=0}}\n\
+{{#if value.required}}// Required\n{{/if}}\
+{{#if value.defaultValue}}// Default: {{{value.defaultValue.value}}}\n{{/if}}\
+{{key}}: {{> (whichPartial value.type) value.type level=0}}\n\
```\n\n\
-{{#if this.description}}{{{this.description}}}\n\n{{/if}}\
-{{/each}}\
-
\n');
+{{#if value.description}}{{{value.description}}}\n\n{{/if}}\
+{{/each_with_sort}}\
+
\n\
+{{/each}}');
/********************************************************
* Documentation generator using react-docgen *
********************************************************/
var reactDocgenMarkdown = function(componentSrc, options) {
- var docs = reactDocs.parse(componentSrc);
+ var docs = reactDocs.parse(componentSrc,options.resolver);
+ if (!docs instanceof Array) {
+ docs = [docs];
+ }
return reactDocgenTemplate({
srcLink : options.srcLink,
componentName : options.componentName,
- description : docs.description,
- props : sortObjectByKey(docs.props)
+ components : docs
});
};