Skip to content

Commit

Permalink
initial commit
Browse files Browse the repository at this point in the history
  • Loading branch information
robhrt7 committed Oct 6, 2015
0 parents commit 82f8bc1
Show file tree
Hide file tree
Showing 8 changed files with 206 additions and 0 deletions.
31 changes: 31 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
# Created by .ignore support plugin (hsz.mobi)
### Node template
# Logs
logs
*.log
npm-debug.log*

# Runtime data
pids
*.pid
*.seed

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# node-waf configuration
.lock-wscript

# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release

# Dependency directory
# https://docs.npmjs.com/misc/faq#should-i-check-my-node-modules-folder-into-git
node_modules

22 changes: 22 additions & 0 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
The MIT License (MIT)

Copyright (c) 2013-2015 SourceJS

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

55 changes: 55 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
# SourceJS auto React doc builder middleware.

[react-docgen](https://github.com/reactjs/react-docgen) integration plugin, renders React components information into [SourceJS](http://sourcejs.com) Spec page.

Compatible with [SourceJS](http://sourcejs.com) 0.6.0+.

## Install

To install middleware, run npm command in `sourcejs/user` folder:

```
npm install sourcejs-react-docgen --save
```

After restarting your app, middleware will be loaded automatically. To disable it, remove npm module and restart the app.

## Usage

After installing the middleware, during spec load, plugin will try to find `<specPath>/index.jsx` or `<specPath>/src/index.jsx` file, analyze it and expose raw and rendered data objects. Data will be then available within [EJS Spec pre-rendering](http://sourcejs.com/docs/spec-helpers/#native-templating) (enabled by default).

Insert these code snippets anywhere you want in your Spec file

```html
<h1>My Spec</h1>

<section class="source_section">
<h2>Default Example</h2>

<p><%- info.__docGenRaw.description %></p>

<%- info.__docGenHTML %>

<div class="source_example"></div>
</section>
```

Other custom Spec file syntax with [sourcejs-react](https://github.com/szarouski/sourcejs-react) and [sourcejs-md-react](https://github.com/mik01aj/sourcejs-md-react) plugins is also supported.

Check usage examples in [react-styleguide-example](https://github.com/sourcejs/react-styleguide-example).

### Exposed Data

* **info.__docGenRaw** - raw JSON from react-docgen
* **info.__docGenHTML** - rendered table with properties

## TODO

* Add more configuration options

## Other SourceJS Middlewares

* https://github.com/sourcejs/sourcejs-jade
* https://github.com/sourcejs/sourcejs-smiles

To create own SourceJS Middleware, we recommend using the official generator - https://github.com/sourcejs/generator-sourcejs.
1 change: 1 addition & 0 deletions core/middleware/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Node.js back-end part, included from main `app.js`.
61 changes: 61 additions & 0 deletions core/middleware/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
var reactDocs = require('react-docgen');
var path = require('path');
var fs = require('fs');
var ejs = require('ejs');
var specUtils = require(path.join(global.pathToApp,'core/lib/specUtils'));
var currentDir = path.dirname(__filename);

// Module configuration
var globalConfig = global.opts.plugins && global.opts.plugins.reactDocgen ? global.opts.plugins.reactDocgen : {};
var config = {
enabled: true,

// Public object is exposed to Front-end via options API.
public: {}
};

/*
* @param {object} req - Request object
* @param {object} res - Response object
* @param {function} next - The callback function
* */
var processRequest = function (req, res, next) {
if (!config.enabled) {
next();
return;
}

// Check if request is targeting Spec
if (req.specData && req.specData.renderedHtml) {
var specPath = specUtils.getFullPathToSpec(req.path);
var componentPath = path.join(specPath, 'src/index.jsx');
var componentPathAlt = path.join(specPath, 'index.jsx');
var componentPathExists = fs.existsSync(componentPath);
var componentPathAltExists = fs.existsSync(componentPathAlt);

if (!(componentPathExists || componentPathAltExists)) {
next();
return;
}

var componentPathToUse = componentPath ? componentPath : componentPathAlt;
var componentContent = fs.readFileSync(componentPathToUse, 'utf-8');
var propsTpl = fs.readFileSync(path.join(currentDir, '../templates/props.ejs'), 'utf-8');

var componentInfo = reactDocs.parse(componentContent);

req.specData.info.__docGenRaw = componentInfo;

try {
req.specData.info.__docGenHTML = ejs.render(propsTpl, componentInfo);
} catch(e) {
console.log('error rendering docgen props', e);
}

next();
} else {
next();
}
};

exports.process = processRequest;
19 changes: 19 additions & 0 deletions core/templates/props.ejs
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<table>
<tr>
<td>Property name</td>
<td>Type</td>
<td>Required</td>
<td>Default value</td>
<td>Description</td>
</tr>
<% for(var key in props) { %>
<% var val = props[key] %>
<tr>
<td><%- key %></td>
<td><%- val.type.name %></td>
<td><%- val.required %></td>
<td><%- val.defaultValue.value %></td>
<td><%- val.description %></td>
</tr>
<% }; %>
</table>
3 changes: 3 additions & 0 deletions options.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
module.exports = {
group: 'request'
};
14 changes: 14 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"name": "sourcejs-react-docgen",
"version": "0.1.0",
"description": "SourceJS auto React doc builder middleware.",
"repository": {
"type": "git",
"url": "https://github.com/sourcejs/sourcejs-react-docgen.git"
},
"homepage": "https://github.com/sourcejs/sourcejs-react-docgen",
"dependencies": {
"ejs": "^2.3.4",
"react-docgen": "^2.2.0"
}
}

0 comments on commit 82f8bc1

Please sign in to comment.