-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
0 parents
commit 82f8bc1
Showing
8 changed files
with
206 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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. | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
Node.js back-end part, included from main `app.js`. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
module.exports = { | ||
group: 'request' | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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" | ||
} | ||
} |