## @0xproject/react-docs
A full-page React component for rendering beautiful documentation for Solidity and Typescript code generated with [TypeDoc](http://typedoc.org/) or [Doxity](https://github.com/0xproject/doxity). See a [live example](http://react-docs-example.s3-website-us-east-1.amazonaws.com/).
<div style="text-align: center;">
<img src="https://s3.eu-west-2.amazonaws.com/0x-wiki-images/screenshot.png" style="padding-bottom: 20px; padding-top: 20px;" width="80%" />
<div>react-docs generating 0x's smart contract docs</div>
</div>
#### Features
* Mobile optimized
* Reads Javadoc-style comments in your code to generate class/method/argument/return/type comments.
* Syntax highlighting support for TypeScript & Solidity
* Type declaration linking
* Type declaration popovers to avoid clicking through to the definition
* Section/method/type anchors for easily pointing others to a specific part of your docs.
* Version picker
* Customizable sidebar header
* Supports custom markdown sections so you can easily add an intro or installation instructions.
## Installation
```bash
yarn add @0xproject/react-docs
```
## Usage
View the [live example](http://react-docs-example.s3-website-us-east-1.amazonaws.com/) that renders the [@0xproject/web3-wrapper](https://github.com/0xProject/0x-monorepo/tree/development/packages/web3-wrapper) Typescript package. It's source code is in the [react-docs-example](https://github.com/0xProject/0x-monorepo/tree/development/packages/react-docs-example) 0x monorepo subpackage.
This package exposes both a single `Documentation` react component that will render a docs page, as well as all of it's sub-components in case someone wants to build their own layout.
Currently this package still has some external dependencies outside of the `Documentation` component, so please start your project off by copying the [react-docs-example](https://github.com/0xProject/0x-monorepo/tree/development/packages/react-docs-example) directory and modifying it there. If you need changes in the [react-docs](https://github.com/0xProject/0x-monorepo/tree/development/packages/react-docs) package, fork the 0x monorepo, make the required changes and submit a PR. Until we merge it, you can have your project depend on your own custom fork.
If your project is in [TypeScript](https://www.typescriptlang.org/), add the following to your `tsconfig.json`:
```json
"compilerOptions": {
"typeRoots": ["node_modules/@0xproject/typescript-typings/types", "node_modules/@types"],
}
```
## Future improvements
Feel free to contribute to these improvements!
* Allow user to pass in styling for all major elements similar to [Material-UI](http://www.material-ui.com/).
* Allow user to define an alternative font and have it change everywhere.
* Add source links to Solidity docs (currently unsupported by Doxity).
## Contributing
We welcome improvements and fixes from the wider community! To report bugs within this package, please create an issue in this repository.
Please read our [contribution guidelines](../../CONTRIBUTING.md) before getting started.
### Install dependencies
If you don't have yarn workspaces enabled (Yarn < v1.0) - enable them:
```bash
yarn config set workspaces-experimental true
```
Then install dependencies
```bash
yarn install
```
### Build
To build this package and all other monorepo packages that it depends on, run the following from the monorepo root directory:
```bash
PKG=@0xproject/react-docs yarn build
```
Or continuously rebuild on change:
```bash
PKG=@0xproject/react-docs yarn watch
```
### Clean
```bash
yarn clean
```
### Lint
```bash
yarn lint
```
value='branches/2016Q1'>branches/2016Q1</option>
<option value='branches/2016Q2'>branches/2016Q2</option>
<option value='branches/2016Q3'>branches/2016Q3</option>
<option value='branches/2016Q4'>branches/2016Q4</option>
<option value='branches/2017Q1'>branches/2017Q1</option>
<option value='branches/2017Q2'>branches/2017Q2</option>
<option value='branches/2017Q3'>branches/2017Q3</option>
<option value='branches/2017Q4'>branches/2017Q4</option>
<option value='branches/2018Q1'>branches/2018Q1</option>
<option value='branches/2018Q2'>branches/2018Q2</option>
<option value='branches/2018Q3'>branches/2018Q3</option>
<option value='branches/2018Q4'>branches/2018Q4</option>
<option value='branches/2019Q1'>branches/2019Q1</option>
<option value='branches/2019Q2'>branches/2019Q2</option>
<option value='branches/2019Q3'>branches/2019Q3</option>
<option value='branches/2019Q4'>branches/2019Q4</option>
<option value='branches/2020Q1'>branches/2020Q1</option>
<option value='branches/2020Q2'>branches/2020Q2</option>
<option value='branches/2020Q3'>branches/2020Q3</option>
<option value='branches/2020Q4'>branches/2020Q4</option>
<option value='branches/2021Q1'>branches/2021Q1</option>
<option value='branches/RELEASE_8_4_0'>branches/RELEASE_8_4_0</option>
<option value='branches/RELENG_2_1_0'>branches/RELENG_2_1_0</option>
<option value='branches/RELENG_2_2'>branches/RELENG_2_2</option>
<option value='branches/RELENG_9_1_0'>branches/RELENG_9_1_0</option>
<option value='branches/RELENG_9_2_0'>branches/RELENG_9_2_0</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3' selected='selected'>dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/lodash-4.17.15'>dependabot/npm_and_yarn/devel/electron4/files/lodash-4.17.15</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/lodash.merge-4.6.2'>dependabot/npm_and_yarn/devel/electron4/files/lodash.merge-4.6.2</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/lodash.template-4.5.0'>dependabot/npm_and_yarn/devel/electron4/files/lodash.template-4.5.0</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/minimist-1.2.2'>dependabot/npm_and_yarn/devel/electron4/files/minimist-1.2.2</option>
<option value='dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2'>dependabot/npm_and_yarn/devel/electron4/files/mixin-deep-1.3.2</option>
<option value='main'>main</option>
<option value='master'>master</option>
<option value='svn_head'>svn_head</option>
</select> <input type='submit' value='switch'/></form></td></tr>
<tr><td class='sub'>FreeBSD Ports (https://github.com/freebsd/freebsd-ports)</td><td class='sub right'></td></tr></table>
<table class='tabs'><tr><td>
<a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/about/?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3'>about</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3'>summary</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/refs/?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3&id=a4df9a012dc1e6a17dfebbebb77a9440103f4a69'>refs</a><a class='active' href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/base?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3'>log</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/tree/base?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3&id=a4df9a012dc1e6a17dfebbebb77a9440103f4a69'>tree</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/commit/base?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3&id=a4df9a012dc1e6a17dfebbebb77a9440103f4a69'>commit</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/diff/base?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3&id=a4df9a012dc1e6a17dfebbebb77a9440103f4a69'>diff</a><a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/stats/base?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3'>stats</a></td><td class='form'><form class='right' method='get' action='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/base'>
<input type='hidden' name='h' value='dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3'/><input type='hidden' name='id' value='a4df9a012dc1e6a17dfebbebb77a9440103f4a69'/><select name='qt'>
<option value='grep'>log msg</option>
<option value='author'>author</option>
<option value='committer'>committer</option>
<option value='range'>range</option>
</select>
<input class='txt' type='search' size='10' name='q' value=''/>
<input type='submit' value='search'/>
</form>
</td></tr></table>
<div class='path'>path: <a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3&id=a4df9a012dc1e6a17dfebbebb77a9440103f4a69'>root</a>/<a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/base?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3&id=a4df9a012dc1e6a17dfebbebb77a9440103f4a69'>base</a></div><div class='content'><table class='list nowrap'><tr class='nohover'><th></th><th class='left'>Commit message (<a href='/~lantw44/cgit/cgit.cgi/freebsd-ports/log/base?h=dependabot/npm_and_yarn/devel/electron4/files/eslint-utils-1.4.3&id=a4df9a012dc1e6a17dfebbebb77a9440103f4a69&showmsg=1'>Expand</a>)</th><th class='left'>Author</th><th class='left'>Age</th><th class='left'>Files</th><th class='left'>Lines</th></tr>