Skip to content

Commit c0db63e

Browse files
sapeginsapegin
committed
Docs: Add TOCs
1 parent d944a9d commit c0db63e

File tree

8 files changed

+140
-2
lines changed

8 files changed

+140
-2
lines changed

‎docs/API.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
# Node.js API
22

3+
<!-- To update run: npx markdown-toc --maxdepth 2 -i docs/API.md -->
4+
5+
<!-- toc -->
6+
7+
- [Initialization](#initialization)
8+
- [Methods](#methods)
9+
10+
<!-- tocstop -->
11+
312
## Initialization
413

514
First, you need to initialize the API for your style guide config.

‎docs/Components.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,15 @@
11
# Locating your components and organizing your style guide
22

3+
<!-- To update run: npx markdown-toc --maxdepth 2 -i docs/Components.md -->
4+
5+
<!-- toc -->
6+
7+
- [Finding components](#finding-components)
8+
- [Sections](#sections)
9+
- [Limitations](#limitations)
10+
11+
<!-- tocstop -->
12+
313
## Finding components
414

515
By default Styleguidist will search components using this [glob pattern](https://github.com/isaacs/node-glob#glob-primer): `src/components/**/*.{js,jsx}`.

‎docs/Configuration.md

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,47 @@
22

33
By default, Styleguidist will look for `styleguide.config.js` file in your project’s root folder. You can change the location of the config file using `--config` [CLI](CLI.md) option.
44

5+
<!-- To update run: npx markdown-toc --maxdepth 4 -i docs/Configuration.md -->
6+
7+
<!-- toc -->
8+
9+
- [`assetsDir`](#assetsdir)
10+
- [`compilerConfig`](#compilerconfig)
11+
- [`components`](#components)
12+
- [`context`](#context)
13+
- [`contextDependencies`](#contextdependencies)
14+
- [`configureServer`](#configureserver)
15+
- [`dangerouslyUpdateWebpackConfig`](#dangerouslyupdatewebpackconfig)
16+
- [`defaultExample`](#defaultexample)
17+
- [`getComponentPathLine`](#getcomponentpathline)
18+
- [`getExampleFilename`](#getexamplefilename)
19+
- [`handlers`](#handlers)
20+
- [`highlightTheme`](#highlighttheme)
21+
- [`ignore`](#ignore)
22+
- [`logger`](#logger)
23+
- [`previewDelay`](#previewdelay)
24+
- [`propsParser`](#propsparser)
25+
- [`require`](#require)
26+
- [`resolver`](#resolver)
27+
- [`sections`](#sections)
28+
- [`serverHost`](#serverhost)
29+
- [`serverPort`](#serverport)
30+
- [`showCode`](#showcode)
31+
- [`showUsage`](#showusage)
32+
- [`showSidebar`](#showsidebar)
33+
- [`skipComponentsWithoutExample`](#skipcomponentswithoutexample)
34+
- [`styleguideComponents`](#styleguidecomponents)
35+
- [`styleguideDir`](#styleguidedir)
36+
- [`styles`](#styles)
37+
- [`template`](#template)
38+
- [`theme`](#theme)
39+
- [`title`](#title)
40+
- [`updateExample`](#updateexample)
41+
- [`verbose`](#verbose)
42+
- [`webpackConfig`](#webpackconfig)
43+
44+
<!-- tocstop -->
45+
546
#### `assetsDir`
647

748
Type: `String`, optional

‎docs/Cookbook.md

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,29 @@
11
# Cookbook
22

3+
<!-- To update run: npx markdown-toc --maxdepth 2 -i docs/Cookbook.md -->
4+
5+
<!-- toc -->
6+
7+
- [How to use `ref`s in examples?](#how-to-use-refs-in-examples)
8+
- [How to exclude some components from style guide?](#how-to-exclude-some-components-from-style-guide)
9+
- [How to hide some components in style guide but make them available in examples?](#how-to-hide-some-components-in-style-guide-but-make-them-available-in-examples)
10+
- [How to add custom JavaScript and CSS or polyfills?](#how-to-add-custom-javascript-and-css-or-polyfills)
11+
- [How to use React Styleguidist with Preact?](#how-to-use-react-styleguidist-with-preact)
12+
- [How to change styles of a style guide?](#how-to-change-styles-of-a-style-guide)
13+
- [How to change the layout of a style guide?](#how-to-change-the-layout-of-a-style-guide)
14+
- [How to change style guide dev server logs output?](#how-to-change-style-guide-dev-server-logs-output)
15+
- [How to debug my components and examples?](#how-to-debug-my-components-and-examples)
16+
- [How to debug the exceptions thrown from my components?](#how-to-debug-the-exceptions-thrown-from-my-components)
17+
- [Why does the style guide list one of my prop types as `unknown`?](#why-does-the-style-guide-list-one-of-my-prop-types-as-unknown)
18+
- [Why object references don’t work in example component state?](#why-object-references-dont-work-in-example-component-state)
19+
- [How to use Vagrant with Styleguidist?](#how-to-use-vagrant-with-styleguidist)
20+
- [How to reuse project’s webpack config?](#how-to-reuse-projects-webpack-config)
21+
- [How to use React Styleguidist with Redux, Relay or Styled Components?](#how-to-use-react-styleguidist-with-redux-relay-or-styled-components)
22+
- [What’s the difference betweeen Styleguidist and Storybook](#whats-the-difference-betweeen-styleguidist-and-storybook)
23+
- [Are there any other projects like this?](#are-there-any-other-projects-like-this)
24+
25+
<!-- tocstop -->
26+
327
## How to use `ref`s in examples?
428

529
Use `ref` prop as a function and assign a reference to a local variable:

‎docs/Development.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,17 @@
11
# Developer guide
22

3+
<!-- To update run: npx markdown-toc --maxdepth 2 -i docs/Development.md -->
4+
5+
<!-- toc -->
6+
7+
- [How it works](#how-it-works)
8+
- [Webpack loaders and webpack configuration](#webpack-loaders-and-webpack-configuration)
9+
- [React components](#react-components)
10+
- [Styles](#styles)
11+
- [Testing](#testing)
12+
13+
<!-- tocstop -->
14+
315
*For basics see [How to contribute](https://github.com/styleguidist/react-styleguidist/blob/master/.github/Contributing.md).*
416

517
Styleguidist isn’t an ordinary single page app and some design decisions may look confusing to an outsider. In this guide we’ll explain these decisions to un-confuse potential contributors.

‎docs/Documenting.md

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,21 @@ Styleguidist generates documentation for your components based on the comments i
44

55
> **Note:** [See examples](https://github.com/styleguidist/react-styleguidist/tree/master/examples/basic/src/components) of documented components in our demo style guide.
66
7+
<!-- To update run: npx markdown-toc --maxdepth 2 -i docs/Documenting.md -->
8+
9+
<!-- toc -->
10+
11+
- [Code comments and propTypes](#code-comments-and-proptypes)
12+
- [Usage examples and Readme files](#usage-examples-and-readme-files)
13+
- [External examples using doclet tags](#external-examples-using-doclet-tags)
14+
- [Public methods](#public-methods)
15+
- [Ignoring props](#ignoring-props)
16+
- [Using JSDoc tags](#using-jsdoc-tags)
17+
- [Writing code examples](#writing-code-examples)
18+
- [Limitations](#limitations)
19+
20+
<!-- tocstop -->
21+
722
## Code comments and propTypes
823

924
Styleguidist will display your components’ JSDoc comment blocks. Also, it will pick up props from propTypes declarations and display them in a table.
@@ -52,11 +67,11 @@ Styleguidist will look for any `Readme.md` or `ComponentName.md` files in the co
5267
```
5368

5469
You can add a custom props to an example wrapper:
55-
70+
5671
```js { "props": { "className": "checks" } }
5772
<Button>I’m transparent!</Button>
5873
```
59-
74+
6075
Or disable an editor by passing a `noeditor` modifier:
6176

6277
```jsx noeditor

‎docs/Thirdparties.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,19 @@
11
# Working with third-party libraries
22

3+
<!-- To update run: npx markdown-toc --maxdepth 3 -i docs/Thirdparties.md -->
4+
5+
<!-- toc -->
6+
7+
- [How Styleguidist works](#how-styleguidist-works)
8+
- [Using Styleguidist with other libraries](#using-styleguidist-with-other-libraries)
9+
* [Redux](#redux)
10+
* [Relay](#relay)
11+
* [Styled Components](#styled-components)
12+
* [Fela](#fela)
13+
* [CSS Modules with react-css-modules](#css-modules-with-react-css-modules)
14+
15+
<!-- tocstop -->
16+
317
## How Styleguidist works
418

519
Styleguidist always uses the default export to *load* your components but it uses [react-docgen](https://github.com/reactjs/react-docgen) to *generate documentation* which may require changes in your code to work properly.

‎docs/Webpack.md

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,19 @@ Styleguidist uses [webpack](https://webpack.js.org/) under the hood and it needs
66

77
> **Note:** See [cookbook](Cookbook.md) for more examples.
88
9+
<!-- To update run: npx markdown-toc --maxdepth 2 -i docs/Webpack.md -->
10+
11+
<!-- toc -->
12+
13+
- [Reusing your project’s webpack config](#reusing-your-projects-webpack-config)
14+
- [Custom webpack config](#custom-webpack-config)
15+
- [Create React App](#create-react-app)
16+
- [Create React App, TypeScript](#create-react-app-typescript)
17+
- [Non-webpack projects](#non-webpack-projects)
18+
- [When nothing else works](#when-nothing-else-works)
19+
20+
<!-- tocstop -->
21+
922
## Reusing your project’s webpack config
1023

1124
By default Styleguidist will try to find `webpack.config.js` in your project’s root directory and use it.

0 commit comments

Comments
 (0)