Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added ability to pass custom resolver function through to react-docgen #2

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down
3 changes: 2 additions & 1 deletion index.js
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
35 changes: 23 additions & 12 deletions src/react-docgen-md.js
Original file line number Diff line number Diff line change
Expand Up @@ -86,36 +86,47 @@ 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 *
********************************************************/

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}}\
<br><br>\n');
{{#if value.description}}{{{value.description}}}\n\n{{/if}}\
{{/each_with_sort}}\
<br><br>\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
});
};

Expand Down