├── .gitignore ├── .npmignore ├── .npmrc ├── .travis.yml ├── Dockerfile ├── LICENSE.md ├── README.md ├── babel.config.js ├── cli.js ├── docs ├── package-lock.json ├── package.json └── src │ ├── 404.md │ ├── ComponentProvider.md │ ├── Head.md │ ├── Link.md │ ├── StyleProvider.md │ ├── card.js │ ├── card.png │ ├── components.js │ ├── configuration.md │ ├── css-in-js.md │ ├── examples.md │ ├── exporting.md │ ├── getting-started.md │ ├── index.js │ ├── logo.js │ ├── logo.png │ ├── routing.md │ ├── typography.md │ └── using-mdx.md ├── examples ├── basic │ ├── README.md │ ├── docs │ │ └── index.mdx │ └── package.json ├── dev-environment │ ├── README.md │ ├── docs │ │ ├── Button.md │ │ ├── Heading.md │ │ └── index.mdx │ ├── package-lock.json │ ├── package.json │ └── src │ │ ├── Button.js │ │ └── Heading.js ├── dev │ ├── components │ │ └── button.mdx │ ├── hello.mdx │ ├── index.mdx │ └── typography.mdx ├── emotion │ ├── README.md │ ├── docs │ │ ├── Box.js │ │ └── index.mdx │ └── package.json ├── head-content │ ├── README.md │ ├── docs │ │ └── index.mdx │ └── package.json ├── live-code │ ├── README.md │ ├── docs │ │ └── index.mdx │ ├── package-lock.json │ └── package.json ├── mdx-themes │ ├── README.md │ ├── docs │ │ └── index.mdx │ └── package.json ├── react-live │ ├── README.md │ ├── docs │ │ ├── components.js │ │ └── index.mdx │ ├── package-lock.json │ └── package.json ├── routing │ ├── README.md │ ├── docs │ │ ├── about.mdx │ │ └── index.mdx │ └── package.json └── styled-components │ ├── README.md │ ├── docs │ ├── Box.js │ └── index.mdx │ └── package.json ├── lib ├── build.js ├── client │ ├── App.js │ ├── ComponentProvider.js │ ├── Head.js │ ├── Keyboard.js │ ├── Link.js │ ├── StyleProvider.js │ ├── components.js │ ├── index.js │ ├── keyboard-shortcuts.md │ ├── lazyComponent.js │ ├── routes.js │ ├── scope.js │ └── withComponents.js ├── config.js ├── dev.js ├── html-plugin.js └── render-html.js ├── now.json ├── package-lock.json ├── package.json └── test ├── build.js ├── dev.js ├── fixtures └── index.mdx └── snapshots ├── build.js.md └── build.js.snap /.gitignore: -------------------------------------------------------------------------------- 1 | dist 2 | .nyc_output 3 | coverage 4 | temp 5 | node_modules/ 6 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | docs 2 | .nyc_output 3 | coverage 4 | test 5 | temp 6 | src 7 | examples 8 | .travis.yml 9 | .babelrc 10 | Dockerfile 11 | now.json 12 | babel.config.js 13 | 14 | packages 15 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | package-lock=true 2 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - 10 4 | -------------------------------------------------------------------------------- /Dockerfile: -------------------------------------------------------------------------------- 1 | FROM node:10-alpine 2 | 3 | WORKDIR /usr/src 4 | 5 | COPY package.json . 6 | COPY package-lock.json . 7 | 8 | RUN npm i 9 | 10 | COPY . . 11 | 12 | RUN cd docs && npm i && npm run build 13 | 14 | RUN mv docs/dist /public 15 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | 2 | # The MIT License (MIT) 3 | Copyright (c) 2018 Brent Jackson 4 | 5 | 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: 6 | 7 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 8 | 9 | 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. 10 | 11 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | # mdx-go 3 | 4 | ![](https://s3.amazonaws.com/jxnblk/mdx-go-24.gif) 5 | 6 | :zap: Lightning fast [MDX][]-based dev server for progressive documentation 7 | 8 | https://mdx-go.now.sh 9 | 10 | [![Build Status][badge]][travis] 11 | [![Downloads][downloads-badge]][npm] 12 | [![Version][version-badge]][npm] 13 | [![MIT License][license]](LICENSE.md) 14 | 15 | ```sh 16 | npm i -g mdx-go 17 | ``` 18 | 19 | - :zero: Zero-config dev server 20 | - :memo: Write in markdown 21 | - :atom_symbol: Import and use React components 22 | - :file_folder: File-system based routing 23 | - :triangular_ruler: Customizable layouts 24 | - :globe_with_meridians: Export as static HTML 25 | - :woman_singer: Support for [styled-components][] & [emotion][] 26 | - :unlock: Avoid lock-in and easily migrate to other MDX-based tools 27 | 28 | [badge]: https://flat.badgen.net/travis/jxnblk/mdx-go 29 | [travis]: https://travis-ci.org/jxnblk/mdx-go 30 | 31 | [version-badge]: https://flat.badgen.net/npm/v/mdx-go 32 | [downloads-badge]: https://flat.badgen.net/npm/dt/mdx-go 33 | [npm]: https://npmjs.com/package/mdx-go 34 | 35 | [license]: https://flat.badgen.net/badge/license/MIT/blue 36 | [coverage]: https://flat.badgen.net/codecov/c/github/jxnblk/mdx-go 37 | 38 | ## Getting Started 39 | 40 | Create a `docs` folder and `docs/index.mdx` file. 41 | 42 | ```mdx 43 | import MyComponent from '../src' 44 | 45 | # Component Demo 46 | 47 | 50 | ``` 51 | 52 | Start the dev server on the `docs` folder: 53 | 54 | ```sh 55 | mdx-go docs 56 | ``` 57 | 58 | ### npm run scripts 59 | 60 | Alternatively, mdx-go can be installed as a development dependency and used with run scripts in your `package.json`. 61 | 62 | ```json 63 | "scripts": { 64 | "dev": "mdx-go docs", 65 | "docs": "mdx-go build docs" 66 | } 67 | ``` 68 | 69 | ```sh 70 | npm run dev 71 | ``` 72 | 73 | ## Motivation 74 | 75 | mdx-go is built with the idea of **[Progressive Documentation][]** in mind, 76 | intended to be used anywhere as a dev server, prototyping tool, or simple static site generator. 77 | By embracing the MDX file format, the docs you create with mdx-go can easily be used in other tools. 78 | Start your docs with mdx-go and migrate to tools like [Next.js][] and [Gatsby][] when needed. 79 | You can even keep mdx-go around to use as a dev tool outside of other React applications. 80 | 81 | [Next.js]: https://github.com/zeit/next.js/ 82 | [Gatsby]: https://github.com/gatsbyjs/gatsby 83 | 84 | ## Using MDX 85 | 86 | MDX combines the simplicity of markdown with the ability to import and use React components inline. 87 | 88 | Write markdown like you normally would. 89 | 90 | ```md 91 | # Hello 92 | ``` 93 | 94 | Import and use React components inline. 95 | 96 | ```mdx 97 | import { Box } from 'grid-styled' 98 | 99 | # Hello 100 | 101 | 102 | This is a React component! 103 | 104 | ``` 105 | 106 | To learn more about using MDX, see the [MDX docs][MDX]. 107 | 108 | ## Routing 109 | 110 | Each MDX file in the target directory will become its own route, 111 | with `index.mdx` serving as the base route, i.e. `/`. 112 | 113 | With the following directory structure: 114 | 115 | ``` 116 | docs/ 117 | index.mdx 118 | getting-started.mdx 119 | api.mdx 120 | ``` 121 | 122 | mdx-go will create routes for `/`, `/getting-started`, and `/api`. 123 | 124 | mdx-go also supports using React components as routes for files with the `.js` extension. 125 | Be sure that the `.js` file exports a default component to render as a route. 126 | 127 | ## Layouts 128 | 129 | mdx-go includes a default layout that centers the document in the viewport, 130 | but custom layout components can be added both globally and per-route. 131 | 132 | To render a custom layout for a single route, export a component as the `default` from the MDX file. 133 | This is a built-in [feature of MDX](https://mdxjs.com/syntax#export-default). 134 | 135 | ```mdx 136 | import Layout from './Layout' 137 | 138 | export default Layout 139 | 140 | # Page with layout 141 | ``` 142 | 143 | To wrap all routes with a custom layout, export a `Root` component from your `index.mdx` file. 144 | This will completely disable the built-in centered layout. 145 | Note: this only works in the `index` route, not other routes. 146 | 147 | ```mdx 148 | export { Root } from './Root' 149 | 150 | # Root layout for all routes 151 | ``` 152 | 153 | ## Head Content 154 | 155 | Head contents can be set per-route by using the `Head` component. 156 | 157 | ```mdx 158 | import { Head } from 'mdx-go' 159 | 160 | 161 | Page title 162 | 163 | 164 | # Page with title 165 | ``` 166 | 167 | To set head contents for all routes, use the Head component within a [`Root` component](#layouts). 168 | 169 | ## Custom MDX Components 170 | 171 | To customize the HTML components rendered from MDX, use the `ComponentProvider` in a [`Root` component](#layouts). 172 | 173 | ```js 174 | // example Root component 175 | import React from 'react' 176 | import { ComponentProvider } from 'mdx-go' 177 | 178 | const components = { 179 | h1: props =>

, 180 | } 181 | 182 | export const Root = props => 183 | 184 | {props.children} 185 | 186 | ``` 187 | 188 | Ensure the Root component is exported from `index.mdx` 189 | 190 | ```mdx 191 | export { Root } from './Root.js' 192 | ``` 193 | 194 | ## Custom File Match Pattern 195 | 196 | To specify a custom file pattern for matching against, 197 | export a `files` webpack context from the main `index.mdx` file. 198 | 199 | ```mdx 200 | export const files = require.context('../src', true, /\.example\.js$/, 'lazy') 201 | ``` 202 | 203 | ## Theming 204 | 205 | By default mdx-go includes virtually no styling. To customize the styles, use components to 206 | wrap MDX with a [Root component](#layouts) and use the [MDXProvider](#custom-mdx-components) to change the default styles. 207 | 208 | ## Exporting 209 | 210 | To export as a static site with HTML and JS bundles, run: 211 | 212 | ```sh 213 | mdx-go build docs 214 | ``` 215 | 216 | This will export all routes as HTML in a `dist` folder. 217 | See [CLI Options](#cli-options) for configuration options. 218 | 219 | ## CSS-in-JS 220 | 221 | mdx-go does not use any CSS-in-JS libraries internally, and most libraries will work when using the dev server. 222 | To extract static CSS when using the `build` command, ensure you have either `styled-components` or `emotion` installed locally in your `package.json`. 223 | For Emotion, be sure that `emotion-server` is also installed. 224 | 225 | When either of these libraries are detected in your `package.json` dependencies, mdx-go will extract static CSS during the build process. 226 | 227 | ## CLI Options 228 | 229 | The following flags can be passed to the CLI. 230 | 231 | ``` 232 | -p --port Port for dev server 233 | --no-open Disable opening in default browser 234 | -d --out-dir Output directory for static export 235 | --basename Base path for routing 236 | --static Export HTML without JS bundle 237 | --webpack Path to custom webpack config 238 | ``` 239 | 240 | All CLI options can also be specified in a `mdx-go` field in your `package.json`. 241 | 242 | ```json 243 | "mdx-go": { 244 | "outDir": "site" 245 | } 246 | ``` 247 | 248 | ## Custom webpack config 249 | 250 | mdx-go will automatically pick up a `webpack.config.js` if it exists in the current working directory. 251 | A custom path can be passed to the CLI using the `--webpack` flag. 252 | The provided webpack config will be merged with the built-in config using [webpack-merge][]. 253 | 254 | [webpack-merge]: https://github.com/survivejs/webpack-merge 255 | 256 | 257 | ## Examples 258 | 259 | - [Basic](examples/basic) 260 | - [Head Content](examples/head-content) 261 | - [Routing](examples/routing) 262 | - [Styled Components](examples/styled-components) 263 | - [Emotion](examples/emotion) 264 | - [Dev Environment](examples/dev-environment) 265 | - [React Live](examples/react-live) 266 | 267 | 268 | ## Related 269 | 270 | [MDX][] | [mdx-deck][] | [mdx-docs][] | [ok-mdx][] | 271 | [x0][] 272 | 273 | 274 | [MIT License](LICENSE.md) 275 | 276 | --- 277 | 278 |

279 | 280 |

281 | 282 | 283 | [MDX]: https://github.com/mdx-js/mdx 284 | [mdx-themes]: https://github.com/jxnblk/mdx-themes 285 | [mdx-deck]: https://github.com/jxnblk/mdx-deck 286 | [mdx-docs]: https://github.com/jxnblk/mdx-docs 287 | [ok-mdx]: https://github.com/jxnblk/ok-mdx 288 | [styled-components]: https://github.com/styled-components/styled-components 289 | [emotion]: https://github.com/emotion-js/emotion 290 | [x0]: https://github.com/c8r/x0 291 | [Progressive Documentation]: https://jxnblk.com/blog/progressive-documentation/ 292 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [['@babel/env', { modules: false }], '@babel/react'], 3 | plugins: [ 4 | '@babel/proposal-class-properties', 5 | '@babel/proposal-export-default-from', 6 | '@babel/proposal-export-namespace-from', 7 | '@babel/proposal-nullish-coalescing-operator', 8 | '@babel/syntax-dynamic-import' 9 | ] 10 | } 11 | -------------------------------------------------------------------------------- /cli.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | const path = require('path') 3 | const meow = require('meow') 4 | const chalk = require('chalk') 5 | const open = require('react-dev-utils/openBrowser') 6 | const findUp = require('find-up') 7 | 8 | const name = 'mdx-go' 9 | const config = require('pkg-conf').sync(name) 10 | const { pkg } = require('read-pkg-up').sync() 11 | 12 | const log = (...msg) => { 13 | console.log( 14 | chalk.green(`[${name}]`), 15 | ...msg 16 | ) 17 | } 18 | 19 | log.error = (...msg) => { 20 | console.log( 21 | chalk.red('[err]'), 22 | ...msg 23 | ) 24 | } 25 | 26 | const cli = meow(` 27 | ${chalk.gray('Usage')} 28 | 29 | ${chalk.gray('$')} ${chalk.green(name + ' docs')} 30 | 31 | ${chalk.gray('$')} ${chalk.green(name + ' build docs')} 32 | 33 | ${chalk.gray('Options')} 34 | 35 | -p --port Port for dev server 36 | --no-open Disable opening in default browser 37 | --fullscreen Disable default centered layout 38 | --no-keyboard Disable keyboard shortcuts 39 | 40 | -d --out-dir Output directory for static export 41 | --basename Base path for routing 42 | --static Export HTML without JS bundle 43 | --webpack Path to custom webpack config 44 | 45 | `, { 46 | description: chalk.green(name) + ' Lightning fast MDX-based dev server', 47 | flags: { 48 | help: { 49 | type: 'boolean', 50 | alias: 'h' 51 | }, 52 | version: { 53 | type: 'boolean', 54 | alias: 'v' 55 | }, 56 | port: { 57 | type: 'string', 58 | alias: 'p', 59 | default: '8080' 60 | }, 61 | open: { 62 | type: 'boolean', 63 | alias: 'o', 64 | default: true 65 | }, 66 | fullscreen: { 67 | type: 'boolean' 68 | }, 69 | keyboard: { 70 | type: 'boolean', 71 | default: true 72 | }, 73 | outDir: { 74 | type: 'string', 75 | alias: 'd', 76 | default: 'dist' 77 | }, 78 | basename: { 79 | type: 'string' 80 | }, 81 | static: { 82 | type: 'boolean' 83 | }, 84 | webpack: { 85 | type: 'string' 86 | }, 87 | debug: { 88 | type: 'boolean' 89 | } 90 | } 91 | }) 92 | 93 | require('update-notifier')({ pkg: cli.pkg }).notify() 94 | 95 | const [ cmd, input ] = cli.input 96 | 97 | if (!cmd && !input) { 98 | cli.showHelp(0) 99 | } 100 | 101 | const opts = Object.assign({ 102 | pkg, 103 | name, 104 | dirname: path.resolve(input || cmd), 105 | basename: '', 106 | webpack: findUp.sync('webpack.config.js'), 107 | }, config, cli.flags) 108 | 109 | opts.outDir = path.resolve(opts.outDir) 110 | 111 | if (!opts.cssLibrary && pkg && pkg.dependencies) { 112 | const deps = Object.assign({}, pkg.devDependencies, pkg.dependencies) 113 | if (deps['styled-components']) { 114 | opts.cssLibrary = 'styled-components' 115 | } else if (deps['emotion']) { 116 | opts.cssLibrary = 'emotion' 117 | } 118 | } 119 | 120 | if (opts.webpack) { 121 | opts.webpack = require(path.resolve(opts.webpack)) 122 | } 123 | 124 | switch (cmd) { 125 | case 'build': 126 | log('building...') 127 | const build = require('./lib/build') 128 | build(opts) 129 | .catch(err => { 130 | log.error(err) 131 | process.exit(1) 132 | }) 133 | .then(stats => { 134 | log('built', chalk.gray(opts.outDir)) 135 | }) 136 | break 137 | case 'dev': 138 | default: 139 | log('starting dev server...') 140 | const dev = require('./lib/dev') 141 | dev(opts) 142 | .then(server => { 143 | const { port } = server.address() 144 | const url = `http://localhost:${port}` 145 | log('listening on', chalk.green(url)) 146 | if (opts.open) open(url) 147 | }) 148 | .catch(err => { 149 | log.error(err) 150 | process.exit(1) 151 | }) 152 | } 153 | 154 | -------------------------------------------------------------------------------- /docs/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "scripts": { 4 | "start": "mdx-go src", 5 | "build": "mdx-go build src", 6 | "logo": "npx repng src/logo.js -w 256 -h 256 -d src -f logo.png", 7 | "card": "npx repng src/card.js -w 1024 -h 512 -d src -f card.png" 8 | }, 9 | "dependencies": { 10 | "react": "^16.5.2", 11 | "rebass": "^3.0.0-9", 12 | "sidepane": "^1.0.0-4", 13 | "styled-components": "^4.0.0-beta.10", 14 | "mdx-go": "^2.0.0-25" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /docs/src/404.md: -------------------------------------------------------------------------------- 1 | 2 | # 404 3 | 4 | Page not found 5 | -------------------------------------------------------------------------------- /docs/src/ComponentProvider.md: -------------------------------------------------------------------------------- 1 | 2 | # ComponentProvider 3 | 4 | Wrap your application with the ComponentProvider to use custom MDX components. 5 | 6 | ```jsx 7 | // example Root component 8 | import React from 'react' 9 | import { ComponentProvider } from 'mdx-go' 10 | 11 | export const Root = props => 12 | 13 | {props.children} 14 | 15 | ``` 16 | 17 | For a version with built-in styles, see the [`StyleProvider`](/StyleProvider) component. 18 | 19 | -------------------------------------------------------------------------------- /docs/src/Head.md: -------------------------------------------------------------------------------- 1 | 2 | # Head 3 | 4 | Use the Head component to set contents in the document ``. 5 | This component can be used in a Root component or in individual pages. 6 | 7 | ```mdx 8 | import { Head } from 'mdx-go' 9 | 10 | 11 | My Page Title 12 | 13 | ``` 14 | 15 | ## Webfonts 16 | 17 | The Head component can be used to load webfonts with a `` tag. 18 | 19 | ```mdx 20 | 21 | 25 | 26 | ``` 27 | -------------------------------------------------------------------------------- /docs/src/Link.md: -------------------------------------------------------------------------------- 1 | 2 | # Link 3 | 4 | The Link component is provided as an MDX component by default. 5 | It automatically handles absolute URLs and relative links with client-side routing. 6 | 7 | When providing custom MDX components with the [ComponentProvider](/ComponentProvider), it's recommended you use the `Link` component for the `a` element. 8 | 9 | ```jsx 10 | // example Root component 11 | import React from 'react' 12 | import { ComponentProvider, Link } from 'mdx-go' 13 | import styled from 'react-emotion' 14 | 15 | const components = { 16 | a: styled(Link)({ 17 | color: 'tomato' 18 | }) 19 | } 20 | 21 | export const Root = props => 22 | 23 | {props.children} 24 | 25 | ``` 26 | 27 | -------------------------------------------------------------------------------- /docs/src/StyleProvider.md: -------------------------------------------------------------------------------- 1 | 2 | # StyleProvider 3 | 4 | The StyleProvider component is an extension of the [ComponentProvider](/ComponentProvider) component that includes default styles for MDX components with support for theming. 5 | The StyleProvider is enabled by default when a custom Root component is not configured. 6 | 7 | ```jsx 8 | // example Root component 9 | import React from 'react' 10 | import { StyleProvider } from 'mdx-go' 11 | 12 | export const Root = props => 13 | 14 | {props.children} 15 | 16 | ``` 17 | 18 | ## Theming 19 | 20 | Custom themes can be passed to the StyleProvider with the `theme` prop. 21 | 22 | ```jsx 23 | 26 | ``` 27 | 28 | ## Props 29 | 30 | Prop | Type | Description 31 | ---|---|--- 32 | `theme` | object | [theme](#theming) 33 | `components` | object | MDX component scope 34 | `fontSize` | number, string, or array | Base font size 35 | `fontFamily` | string | Base font family 36 | `color` | string | Base text color 37 | `bg` | string | Base background color 38 | `css` | object or string | Additional CSS to pass to the root element 39 | 40 | 41 | -------------------------------------------------------------------------------- /docs/src/card.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Logo from './logo' 3 | 4 | export default ({ 5 | width = 1024, 6 | color = '#0d0', 7 | bg = '#000' 8 | }) => 9 | 14 | 19 | 20 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /docs/src/card.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jxnblk/mdx-go/4287ee391aa2e6da923980da61b5a614cc390e46/docs/src/card.png -------------------------------------------------------------------------------- /docs/src/components.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { 3 | Head, 4 | Link as GoLink, 5 | StyleProvider, 6 | } from 'mdx-go' 7 | import { Box, Flex } from 'rebass' 8 | import Sidepane from 'sidepane' 9 | import Logo from './logo' 10 | 11 | const green = '#0d3' 12 | const darkgreen = '#0a6' 13 | const black = '#000619' 14 | const lightgray = '#f6f6ff' 15 | const blue = '#07c' 16 | 17 | 18 | const gradient = ` 19 | linear-gradient( 20 | 150deg, 21 | transparent 90%, 22 | rgba(0, 191, 0, 0.25) 90%, 23 | rgba(0, 191, 0, 0.25) 95%, 24 | rgba(0, 191, 0, 0.5) 95% 25 | ) 26 | ` 27 | 28 | const nav = [ 29 | { path: '/', name: 'Home' }, 30 | { path: '/getting-started', name: 'Getting-Started' }, 31 | { path: '/using-mdx', name: 'Using-MDX' }, 32 | { path: '/routing', name: 'Routing' }, 33 | { path: '/configuration', name: 'Configuration' }, 34 | { path: '/exporting', name: 'Exporting' }, 35 | { path: '/Head', name: 'Head' }, 36 | { path: '/Link', name: 'Link' }, 37 | { path: '/examples', name: 'Examples' }, 38 | { path: 'https://github.com/jxnblk/mdx-go', name: 'GitHub' }, 39 | 40 | // 'ComponentProvider', 41 | // 'Layout', 42 | // 'NavLinks', 43 | // 'Pagination', 44 | // 'StyleProvider', 45 | // 'DocsLayout', 46 | // 'DevLayout', 47 | // Examples 48 | // 'Typography', 49 | ] 50 | 51 | // todo: update 52 | const theme = { 53 | colors: { 54 | lightgray, 55 | black, 56 | blue, 57 | green, 58 | darkgreen, 59 | }, 60 | code: { 61 | color: darkgreen 62 | }, 63 | pre: { 64 | // color: darkgreen 65 | } 66 | } 67 | 68 | const PageLayout = props => props.location.pathname === '/' 69 | ? props.children 70 | : ( 71 | 72 | 74 | 75 | 76 | 77 | 78 | 79 | {nav.map(({ name, path }) => ( 80 | 96 | ))} 97 | {/* 98 | nav.includes(route.name)} 101 | order={nav} 102 | py={2} 103 | /> 104 | 105 | 109 | */} 110 | 111 | 112 | 113 | 114 | {props.children} 115 | 116 | 117 | 118 | ) 119 | 120 | export const Root = props => 121 | 122 | 123 | MDX Go 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | export const Banner = props => 138 | 147 | 148 | export const Title = props => 149 | 158 | 159 | export const Text = props => 160 | 168 | 169 | export const Button = props => 170 | 186 | 187 | export const ButtonOutline = props => 188 | 70 | 71 | GitHub 72 | 73 | 
npm i -g mdx-go
74 | 75 | 78 | 91 | 92 | 93 | 94 | 95 | 96 | {intro} 97 | 98 | 99 | 106 | 107 | Zero-config dev server 108 | 109 | 110 | Write in markdown 111 | 112 | 113 | Import and use React components 114 | 115 | 116 | File-system based routing 117 | 118 | 119 | Customizable layouts 120 | 121 | 122 | Support for styled-components & emotion 123 | 124 | 125 | Export as static HTML 126 | 127 | 128 | Avoid lock-in and easily migrate to other MDX-based tools 129 | 130 | 131 | 132 | 133 | 134 | 135 | 141 | Docs 142 | GitHub 143 | Made by Jxnblk 144 | 145 | 146 | 147 | 150 | 151 | 152 | 153 | 154 | 155 | 156 | 157 | -------------------------------------------------------------------------------- /docs/src/logo.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | // forward // 4 | const forward = [ 5 | 'M 16 0', 6 | 'L 48 0', 7 | 'L 32 32', 8 | 'L 0 32', 9 | 'z', 10 | ].join(' ') 11 | 12 | // \\ 13 | const backward = [ 14 | 'M 0 0', 15 | 'L 32 0', 16 | 'L 48 32', 17 | 'L 16 32', 18 | 'z', 19 | ].join(' ') 20 | 21 | export default ({ 22 | size = 256, 23 | color = '#fff', 24 | bg = '#0d0' 25 | }) => 26 | 30 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /docs/src/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jxnblk/mdx-go/4287ee391aa2e6da923980da61b5a614cc390e46/docs/src/logo.png -------------------------------------------------------------------------------- /docs/src/routing.md: -------------------------------------------------------------------------------- 1 | 2 | # Routing 3 | 4 | Each MDX file in the target directory will become its own route, 5 | with `index.mdx` serving as the base route, i.e. `/`. 6 | 7 | With the following directory structure: 8 | 9 | ``` 10 | docs/ 11 | index.mdx 12 | getting-started.mdx 13 | api.mdx 14 | ``` 15 | 16 | MDX Go will create routes for `/`, `/getting-started`, and `/api`. 17 | 18 | ## React Components 19 | 20 | MDX Go also supports using React components as routes for files with the `.js` extension. 21 | Be sure that the `.js` file exports a default component to render as a route. 22 | 23 | ```jsx 24 | // example React component route 25 | import React from 'react' 26 | 27 | export default props => 28 |

Hello

29 | ``` 30 | 31 | ## Customizing Routes 32 | 33 | Each page can customize its path and other metadata using exports. 34 | 35 | To set a custom path, without renaming the file, export a `path` string. 36 | 37 | ```mdx 38 | export const path = '/go' 39 | 40 | # Getting Started 41 | ``` 42 | 43 | ## Route Object 44 | 45 | Each file will generate a route object with the following keys. Additionally, the `index.mdx` route will include any additional named exports from the file. 46 | 47 | Key | Description 48 | ---|--- 49 | `key` | Key from wepback's `require.context` 50 | `extname` | The file extension of the route 51 | `name` | The file basename 52 | `dirname` | The directory of the file 53 | `path` | Route pathname used for routing 54 | `Component` | React component 55 | -------------------------------------------------------------------------------- /docs/src/typography.md: -------------------------------------------------------------------------------- 1 | 2 | # Typography 3 | 4 | This is a demonstration page for MDX typographic styles provided by the [`StyleProvider`](/StyleProvider) component. 5 | 6 | # Hamburger 1 7 | ## Hamburger 2 8 | ### Hamburger 3 9 | #### Hamburger 4 10 | ##### Hamburger 5 11 | ###### Hamburger 6 12 | 13 | ``` 14 | This is a fenced code block 15 | ``` 16 | 17 | ```.jsx 18 |

This is a live code block

19 | ``` 20 | 21 | ![](card.png) 22 | 23 | This is a paragraph with `inline code` and *italics* and **bold** and a [link](#typography). 24 | 25 | > Hello, this is a blockquote. 26 | 27 | --- 28 | 29 | ## Lists 30 | 31 | - This is a list 32 | - Of things that can be listed 33 | - And this particular item is really really long. Much longer than the other items, so it should wrap, but still look okay. 34 | - And here's the last item 35 | 36 | ## Checklists 37 | 38 | - [x] checklist 39 | - [ ] things you could do 40 | - [ ] check items off the list 41 | - [ ] ignore the checklist 42 | 43 | ## Ordered Lists 44 | 45 | 1. Get Ready 46 | 2. Get Set 47 | 3. Go! 48 | 49 | Prop | Type | Description 50 | ---|---|--- 51 | `color` | string | Text color 52 | `bg` | string | Background color 53 | `mt` | number, string, or array | margin top 54 | `mb` | number, string, or array | margin bottom 55 | 56 | ## This is a really long heading that should wrap but still look okay with regard to line height 57 | 58 | -------------------------------------------------------------------------------- /docs/src/using-mdx.md: -------------------------------------------------------------------------------- 1 | 2 | # Using MDX 3 | 4 | MDX combines the simplicity of markdown with the ability to import and use React components inline. 5 | 6 | Write markdown like you normally would. 7 | 8 | ```md 9 | # Hello 10 | ``` 11 | 12 | Import and use React components inline. 13 | 14 | ```mdx 15 | import { Box } from 'grid-styled' 16 | 17 | # Hello 18 | 19 | 20 | This is a React component! 21 | 22 | ``` 23 | 24 | ## Exports 25 | 26 | MDX uses the ES export syntax to communicate with its parent. 27 | MDX Go makes use of this to customize layouts, routing, and set other configuration options. 28 | 29 | For example, a custom [Root component](/configuration#root-component) that wraps the entire app can be added by exporting `Root` from your `index.mdx` file. 30 | 31 | ```mdx 32 | export const Root = props => 33 |
37 | {props.children} 38 |
39 | 40 | # Tomato 41 | ``` 42 | 43 | To learn more about using MDX, see the [MDX docs][MDX]. 44 | 45 | [MDX]: https://github.com/mdx-js/mdx 46 | -------------------------------------------------------------------------------- /examples/basic/README.md: -------------------------------------------------------------------------------- 1 | 2 | # mdx-go basic example 3 | 4 | ```sh 5 | npm i -g mdx-go 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/basic/docs/index.mdx: -------------------------------------------------------------------------------- 1 | 2 | # mdx-go basic example 3 | 4 | -------------------------------------------------------------------------------- /examples/basic/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "basic", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /examples/dev-environment/README.md: -------------------------------------------------------------------------------- 1 | 2 | # dev environment example 3 | 4 | ```sh 5 | npm i -g mdx-go 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/dev-environment/docs/Button.md: -------------------------------------------------------------------------------- 1 | import Button from '../src/Button' 2 | 3 | # Button 4 | 5 | 8 | 11 | -------------------------------------------------------------------------------- /examples/dev-environment/docs/Heading.md: -------------------------------------------------------------------------------- 1 | import Heading from '../src/Heading' 2 | 3 | # Heading 4 | 5 | Hello 6 | Hello 7 | Hello 8 | Hello 9 | -------------------------------------------------------------------------------- /examples/dev-environment/docs/index.mdx: -------------------------------------------------------------------------------- 1 | 2 | export { DevLayout as Root } from 'mdx-go' 3 | 4 | # dev environment example 5 | 6 | - [Button](/Button) 7 | - [Heading](/Heading) 8 | -------------------------------------------------------------------------------- /examples/dev-environment/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "dev-environment", 3 | "requires": true, 4 | "lockfileVersion": 1, 5 | "dependencies": { 6 | "@babel/helper-module-imports": { 7 | "version": "7.0.0-beta.51", 8 | "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.0.0-beta.51.tgz", 9 | "integrity": "sha1-zgBCgEX7t9XrwOp7+DV4nxU2arI=", 10 | "requires": { 11 | "@babel/types": "7.0.0-beta.51", 12 | "lodash": "^4.17.5" 13 | } 14 | }, 15 | "@babel/types": { 16 | "version": "7.0.0-beta.51", 17 | "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.0.0-beta.51.tgz", 18 | "integrity": "sha1-2AK3tUO1g2x3iqaReXq/APPZfqk=", 19 | "requires": { 20 | "esutils": "^2.0.2", 21 | "lodash": "^4.17.5", 22 | "to-fast-properties": "^2.0.0" 23 | } 24 | }, 25 | "@emotion/babel-utils": { 26 | "version": "0.6.9", 27 | "resolved": "https://registry.npmjs.org/@emotion/babel-utils/-/babel-utils-0.6.9.tgz", 28 | "integrity": "sha512-QN2+TP+x5QWuOGUv8TZwdMiF8PHgBQiLx646rKZBnakgc9gLYFi+gsROVxE6YTNHSaEv0fWsFjDasDyiWSJlDg==", 29 | "requires": { 30 | "@emotion/hash": "^0.6.5", 31 | "@emotion/memoize": "^0.6.5", 32 | "@emotion/serialize": "^0.9.0", 33 | "convert-source-map": "^1.5.1", 34 | "find-root": "^1.1.0", 35 | "source-map": "^0.7.2" 36 | }, 37 | "dependencies": { 38 | "source-map": { 39 | "version": "0.7.3", 40 | "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz", 41 | "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==" 42 | } 43 | } 44 | }, 45 | "@emotion/hash": { 46 | "version": "0.6.5", 47 | "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.5.tgz", 48 | "integrity": "sha512-JlZbn5+adseTdDPTUkx/O1/UZbhaGR5fCLLWQDCIJ4eP9fJcVdP/qjlTveEX6mkNoJHWFbZ47wArWQQ0Qk6nMA==" 49 | }, 50 | "@emotion/is-prop-valid": { 51 | "version": "0.6.7", 52 | "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.6.7.tgz", 53 | "integrity": "sha512-cK5YUueFhAff0GqL5PqPruBCSdiQ9Gatuc2p7uHOsXh1hx+4aKLF3frPSTobFElwlGUypVwF5pjB3hhc7DebjQ==", 54 | "requires": { 55 | "@emotion/memoize": "^0.6.5" 56 | } 57 | }, 58 | "@emotion/memoize": { 59 | "version": "0.6.5", 60 | "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.6.5.tgz", 61 | "integrity": "sha512-n1USr7yICA4LFIv7z6kKsXM8rZJxd1btKCBmDewlit+3OJ2j4bDfgXTAxTHYbPkHS/eztHmFWfsbxW2Pu5mDqA==" 62 | }, 63 | "@emotion/serialize": { 64 | "version": "0.9.0", 65 | "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.9.0.tgz", 66 | "integrity": "sha512-ScuBRGxHCyAEN8YgQSsxtG5ddmP9+Of8WkxC7hidhGTxKhq3lgeCu5cFk2WdAMrpYgEd0U4g4QW/1YrCOGpAsA==", 67 | "requires": { 68 | "@emotion/hash": "^0.6.5", 69 | "@emotion/memoize": "^0.6.5", 70 | "@emotion/unitless": "^0.6.6", 71 | "@emotion/utils": "^0.8.1" 72 | } 73 | }, 74 | "@emotion/stylis": { 75 | "version": "0.7.0", 76 | "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.7.0.tgz", 77 | "integrity": "sha512-DTq3Wo4p63JoogA5TaVKZHj7QcU32kRF+iKLWJnfGlIw4S+v90rVHX8pLQETKILWXk05iZ2b0KUKFMTAHYbytw==" 78 | }, 79 | "@emotion/unitless": { 80 | "version": "0.6.6", 81 | "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.6.6.tgz", 82 | "integrity": "sha512-zbd1vXRpGWCgDLsXqITReL+eqYJ95PYyWrVCCuMLBDb2LGA/HdxrZHJri6Fe+tKHihBOiCK1kbu+3Ij8aNEjzA==" 83 | }, 84 | "@emotion/utils": { 85 | "version": "0.8.1", 86 | "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.8.1.tgz", 87 | "integrity": "sha512-dEv1n+IFtlvLQ8/FsTOtBCC1aNT4B5abE8ODF5wk2tpWnjvgGNRMvHCeJGbVHjFfer4h8MH2w9c2/6eoJHclMg==" 88 | }, 89 | "abbrev": { 90 | "version": "1.1.1", 91 | "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", 92 | "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==" 93 | }, 94 | "ansi-regex": { 95 | "version": "2.1.1", 96 | "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", 97 | "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=" 98 | }, 99 | "ansi-styles": { 100 | "version": "2.2.1", 101 | "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", 102 | "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=" 103 | }, 104 | "argparse": { 105 | "version": "1.0.10", 106 | "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz", 107 | "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==", 108 | "requires": { 109 | "sprintf-js": "~1.0.2" 110 | } 111 | }, 112 | "babel-code-frame": { 113 | "version": "6.26.0", 114 | "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz", 115 | "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=", 116 | "requires": { 117 | "chalk": "^1.1.3", 118 | "esutils": "^2.0.2", 119 | "js-tokens": "^3.0.2" 120 | } 121 | }, 122 | "babel-core": { 123 | "version": "6.26.3", 124 | "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-6.26.3.tgz", 125 | "integrity": "sha512-6jyFLuDmeidKmUEb3NM+/yawG0M2bDZ9Z1qbZP59cyHLz8kYGKYwpJP0UwUKKUiTRNvxfLesJnTedqczP7cTDA==", 126 | "requires": { 127 | "babel-code-frame": "^6.26.0", 128 | "babel-generator": "^6.26.0", 129 | "babel-helpers": "^6.24.1", 130 | "babel-messages": "^6.23.0", 131 | "babel-register": "^6.26.0", 132 | "babel-runtime": "^6.26.0", 133 | "babel-template": "^6.26.0", 134 | "babel-traverse": "^6.26.0", 135 | "babel-types": "^6.26.0", 136 | "babylon": "^6.18.0", 137 | "convert-source-map": "^1.5.1", 138 | "debug": "^2.6.9", 139 | "json5": "^0.5.1", 140 | "lodash": "^4.17.4", 141 | "minimatch": "^3.0.4", 142 | "path-is-absolute": "^1.0.1", 143 | "private": "^0.1.8", 144 | "slash": "^1.0.0", 145 | "source-map": "^0.5.7" 146 | } 147 | }, 148 | "babel-generator": { 149 | "version": "6.26.1", 150 | "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.1.tgz", 151 | "integrity": "sha512-HyfwY6ApZj7BYTcJURpM5tznulaBvyio7/0d4zFOeMPUmfxkCjHocCuoLa2SAGzBI8AREcH3eP3758F672DppA==", 152 | "requires": { 153 | "babel-messages": "^6.23.0", 154 | "babel-runtime": "^6.26.0", 155 | "babel-types": "^6.26.0", 156 | "detect-indent": "^4.0.0", 157 | "jsesc": "^1.3.0", 158 | "lodash": "^4.17.4", 159 | "source-map": "^0.5.7", 160 | "trim-right": "^1.0.1" 161 | } 162 | }, 163 | "babel-helpers": { 164 | "version": "6.24.1", 165 | "resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz", 166 | "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI=", 167 | "requires": { 168 | "babel-runtime": "^6.22.0", 169 | "babel-template": "^6.24.1" 170 | } 171 | }, 172 | "babel-messages": { 173 | "version": "6.23.0", 174 | "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz", 175 | "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4=", 176 | "requires": { 177 | "babel-runtime": "^6.22.0" 178 | } 179 | }, 180 | "babel-plugin-emotion": { 181 | "version": "9.2.8", 182 | "resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-9.2.8.tgz", 183 | "integrity": "sha512-m+M0Xim43+y3Egpl0C4Zz5dI0f7JaBi6GZF1vtr1IdODRpxWOx47uzr7qXyuBCG/U/nB2DGaU996of0nJjwWbw==", 184 | "requires": { 185 | "@babel/helper-module-imports": "7.0.0-beta.51", 186 | "@emotion/babel-utils": "^0.6.4", 187 | "@emotion/hash": "^0.6.2", 188 | "@emotion/memoize": "^0.6.1", 189 | "@emotion/stylis": "^0.7.0", 190 | "babel-core": "^6.26.3", 191 | "babel-plugin-macros": "^2.0.0", 192 | "babel-plugin-syntax-jsx": "^6.18.0", 193 | "convert-source-map": "^1.5.0", 194 | "find-root": "^1.1.0", 195 | "mkdirp": "^0.5.1", 196 | "source-map": "^0.5.7", 197 | "touch": "^1.0.0" 198 | } 199 | }, 200 | "babel-plugin-macros": { 201 | "version": "2.4.0", 202 | "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.4.0.tgz", 203 | "integrity": "sha512-flIBfrqAdHWn+4l2cS/4jZEyl+m5EaBHVzTb0aOF+eu/zR7E41/MoCFHPhDNL8Wzq1nyelnXeT+vcL2byFLSZw==", 204 | "requires": { 205 | "cosmiconfig": "^5.0.5" 206 | } 207 | }, 208 | "babel-plugin-syntax-jsx": { 209 | "version": "6.18.0", 210 | "resolved": "http://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz", 211 | "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=" 212 | }, 213 | "babel-register": { 214 | "version": "6.26.0", 215 | "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz", 216 | "integrity": "sha1-btAhFz4vy0htestFxgCahW9kcHE=", 217 | "requires": { 218 | "babel-core": "^6.26.0", 219 | "babel-runtime": "^6.26.0", 220 | "core-js": "^2.5.0", 221 | "home-or-tmp": "^2.0.0", 222 | "lodash": "^4.17.4", 223 | "mkdirp": "^0.5.1", 224 | "source-map-support": "^0.4.15" 225 | } 226 | }, 227 | "babel-runtime": { 228 | "version": "6.26.0", 229 | "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz", 230 | "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=", 231 | "requires": { 232 | "core-js": "^2.4.0", 233 | "regenerator-runtime": "^0.11.0" 234 | } 235 | }, 236 | "babel-template": { 237 | "version": "6.26.0", 238 | "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz", 239 | "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI=", 240 | "requires": { 241 | "babel-runtime": "^6.26.0", 242 | "babel-traverse": "^6.26.0", 243 | "babel-types": "^6.26.0", 244 | "babylon": "^6.18.0", 245 | "lodash": "^4.17.4" 246 | } 247 | }, 248 | "babel-traverse": { 249 | "version": "6.26.0", 250 | "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz", 251 | "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4=", 252 | "requires": { 253 | "babel-code-frame": "^6.26.0", 254 | "babel-messages": "^6.23.0", 255 | "babel-runtime": "^6.26.0", 256 | "babel-types": "^6.26.0", 257 | "babylon": "^6.18.0", 258 | "debug": "^2.6.8", 259 | "globals": "^9.18.0", 260 | "invariant": "^2.2.2", 261 | "lodash": "^4.17.4" 262 | } 263 | }, 264 | "babel-types": { 265 | "version": "6.26.0", 266 | "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz", 267 | "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=", 268 | "requires": { 269 | "babel-runtime": "^6.26.0", 270 | "esutils": "^2.0.2", 271 | "lodash": "^4.17.4", 272 | "to-fast-properties": "^1.0.3" 273 | }, 274 | "dependencies": { 275 | "to-fast-properties": { 276 | "version": "1.0.3", 277 | "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz", 278 | "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=" 279 | } 280 | } 281 | }, 282 | "babylon": { 283 | "version": "6.18.0", 284 | "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz", 285 | "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==" 286 | }, 287 | "balanced-match": { 288 | "version": "1.0.0", 289 | "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", 290 | "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=" 291 | }, 292 | "brace-expansion": { 293 | "version": "1.1.11", 294 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", 295 | "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", 296 | "requires": { 297 | "balanced-match": "^1.0.0", 298 | "concat-map": "0.0.1" 299 | } 300 | }, 301 | "chalk": { 302 | "version": "1.1.3", 303 | "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", 304 | "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", 305 | "requires": { 306 | "ansi-styles": "^2.2.1", 307 | "escape-string-regexp": "^1.0.2", 308 | "has-ansi": "^2.0.0", 309 | "strip-ansi": "^3.0.0", 310 | "supports-color": "^2.0.0" 311 | } 312 | }, 313 | "concat-map": { 314 | "version": "0.0.1", 315 | "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", 316 | "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=" 317 | }, 318 | "convert-source-map": { 319 | "version": "1.5.1", 320 | "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz", 321 | "integrity": "sha1-uCeAl7m8IpNl3lxiz1/K7YtVmeU=" 322 | }, 323 | "core-js": { 324 | "version": "2.5.7", 325 | "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.7.tgz", 326 | "integrity": "sha512-RszJCAxg/PP6uzXVXL6BsxSXx/B05oJAQ2vkJRjyjrEcNVycaqOmNb5OTxZPE3xa5gwZduqza6L9JOCenh/Ecw==" 327 | }, 328 | "cosmiconfig": { 329 | "version": "5.0.6", 330 | "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-5.0.6.tgz", 331 | "integrity": "sha512-6DWfizHriCrFWURP1/qyhsiFvYdlJzbCzmtFWh744+KyWsJo5+kPzUZZaMRSSItoYc0pxFX7gEO7ZC1/gN/7AQ==", 332 | "requires": { 333 | "is-directory": "^0.3.1", 334 | "js-yaml": "^3.9.0", 335 | "parse-json": "^4.0.0" 336 | } 337 | }, 338 | "create-emotion": { 339 | "version": "9.2.6", 340 | "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-9.2.6.tgz", 341 | "integrity": "sha512-4g46va26lw6DPfKF7HeWY3OI/qoaNSwpvO+li8dMydZfC6f6+ZffwlYHeIyAhGR8Z8C8c0H9J1pJbQRtb9LScw==", 342 | "requires": { 343 | "@emotion/hash": "^0.6.2", 344 | "@emotion/memoize": "^0.6.1", 345 | "@emotion/stylis": "^0.6.10", 346 | "@emotion/unitless": "^0.6.2", 347 | "csstype": "^2.5.2", 348 | "stylis": "^3.5.0", 349 | "stylis-rule-sheet": "^0.0.10" 350 | }, 351 | "dependencies": { 352 | "@emotion/stylis": { 353 | "version": "0.6.12", 354 | "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.6.12.tgz", 355 | "integrity": "sha512-yS+t7l5FeYeiIyADyqjFBJvdotpphHb2S3mP4qak5BpV7ODvxuyAVF24IchEslW+A1MWHAhn5SiOW6GZIumiEQ==" 356 | } 357 | } 358 | }, 359 | "create-emotion-styled": { 360 | "version": "9.2.8", 361 | "resolved": "https://registry.npmjs.org/create-emotion-styled/-/create-emotion-styled-9.2.8.tgz", 362 | "integrity": "sha512-2LrNM5MREWzI5hZK+LyiBHglwE18WE3AEbBQgpHQ1+zmyLSm/dJsUZBeFAwuIMb+TjNZP0KsMZlV776ufOtFdg==", 363 | "requires": { 364 | "@emotion/is-prop-valid": "^0.6.1" 365 | } 366 | }, 367 | "csstype": { 368 | "version": "2.5.6", 369 | "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.5.6.tgz", 370 | "integrity": "sha512-tKPyhy0FmfYD2KQYXD5GzkvAYLYj96cMLXr648CKGd3wBe0QqoPipImjGiLze9c8leJK8J3n7ap90tpk3E6HGQ==" 371 | }, 372 | "debug": { 373 | "version": "2.6.9", 374 | "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", 375 | "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", 376 | "requires": { 377 | "ms": "2.0.0" 378 | } 379 | }, 380 | "detect-indent": { 381 | "version": "4.0.0", 382 | "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz", 383 | "integrity": "sha1-920GQ1LN9Docts5hnE7jqUdd4gg=", 384 | "requires": { 385 | "repeating": "^2.0.0" 386 | } 387 | }, 388 | "emotion": { 389 | "version": "9.2.8", 390 | "resolved": "https://registry.npmjs.org/emotion/-/emotion-9.2.8.tgz", 391 | "integrity": "sha512-4CT7S2+TDcd9qTSosd3VibERAsaZjhraeLxLWRuV6epX5XdHQjeLFqAlion/iT8M3UNQx9bqmlOTd+KaUj2M8Q==", 392 | "requires": { 393 | "babel-plugin-emotion": "^9.2.8", 394 | "create-emotion": "^9.2.6" 395 | } 396 | }, 397 | "error-ex": { 398 | "version": "1.3.2", 399 | "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz", 400 | "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==", 401 | "requires": { 402 | "is-arrayish": "^0.2.1" 403 | } 404 | }, 405 | "escape-string-regexp": { 406 | "version": "1.0.5", 407 | "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", 408 | "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=" 409 | }, 410 | "esprima": { 411 | "version": "4.0.1", 412 | "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz", 413 | "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==" 414 | }, 415 | "esutils": { 416 | "version": "2.0.2", 417 | "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz", 418 | "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs=" 419 | }, 420 | "find-root": { 421 | "version": "1.1.0", 422 | "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", 423 | "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" 424 | }, 425 | "globals": { 426 | "version": "9.18.0", 427 | "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz", 428 | "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==" 429 | }, 430 | "has-ansi": { 431 | "version": "2.0.0", 432 | "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz", 433 | "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=", 434 | "requires": { 435 | "ansi-regex": "^2.0.0" 436 | } 437 | }, 438 | "home-or-tmp": { 439 | "version": "2.0.0", 440 | "resolved": "https://registry.npmjs.org/home-or-tmp/-/home-or-tmp-2.0.0.tgz", 441 | "integrity": "sha1-42w/LSyufXRqhX440Y1fMqeILbg=", 442 | "requires": { 443 | "os-homedir": "^1.0.0", 444 | "os-tmpdir": "^1.0.1" 445 | } 446 | }, 447 | "invariant": { 448 | "version": "2.2.4", 449 | "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", 450 | "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==", 451 | "requires": { 452 | "loose-envify": "^1.0.0" 453 | } 454 | }, 455 | "is-arrayish": { 456 | "version": "0.2.1", 457 | "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz", 458 | "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=" 459 | }, 460 | "is-directory": { 461 | "version": "0.3.1", 462 | "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz", 463 | "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE=" 464 | }, 465 | "is-finite": { 466 | "version": "1.0.2", 467 | "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz", 468 | "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko=", 469 | "requires": { 470 | "number-is-nan": "^1.0.0" 471 | } 472 | }, 473 | "js-tokens": { 474 | "version": "3.0.2", 475 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz", 476 | "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=" 477 | }, 478 | "js-yaml": { 479 | "version": "3.12.0", 480 | "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.12.0.tgz", 481 | "integrity": "sha512-PIt2cnwmPfL4hKNwqeiuz4bKfnzHTBv6HyVgjahA6mPLwPDzjDWrplJBMjHUFxku/N3FlmrbyPclad+I+4mJ3A==", 482 | "requires": { 483 | "argparse": "^1.0.7", 484 | "esprima": "^4.0.0" 485 | } 486 | }, 487 | "jsesc": { 488 | "version": "1.3.0", 489 | "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz", 490 | "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s=" 491 | }, 492 | "json-parse-better-errors": { 493 | "version": "1.0.2", 494 | "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz", 495 | "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==" 496 | }, 497 | "json5": { 498 | "version": "0.5.1", 499 | "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz", 500 | "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE=" 501 | }, 502 | "lodash": { 503 | "version": "4.17.10", 504 | "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz", 505 | "integrity": "sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg==" 506 | }, 507 | "loose-envify": { 508 | "version": "1.4.0", 509 | "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", 510 | "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", 511 | "requires": { 512 | "js-tokens": "^3.0.0 || ^4.0.0" 513 | } 514 | }, 515 | "minimatch": { 516 | "version": "3.0.4", 517 | "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", 518 | "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", 519 | "requires": { 520 | "brace-expansion": "^1.1.7" 521 | } 522 | }, 523 | "minimist": { 524 | "version": "0.0.8", 525 | "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", 526 | "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=" 527 | }, 528 | "mkdirp": { 529 | "version": "0.5.1", 530 | "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", 531 | "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=", 532 | "requires": { 533 | "minimist": "0.0.8" 534 | } 535 | }, 536 | "ms": { 537 | "version": "2.0.0", 538 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", 539 | "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" 540 | }, 541 | "nopt": { 542 | "version": "1.0.10", 543 | "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz", 544 | "integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4=", 545 | "requires": { 546 | "abbrev": "1" 547 | } 548 | }, 549 | "number-is-nan": { 550 | "version": "1.0.1", 551 | "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz", 552 | "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=" 553 | }, 554 | "object-assign": { 555 | "version": "4.1.1", 556 | "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", 557 | "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" 558 | }, 559 | "os-homedir": { 560 | "version": "1.0.2", 561 | "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", 562 | "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=" 563 | }, 564 | "os-tmpdir": { 565 | "version": "1.0.2", 566 | "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", 567 | "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=" 568 | }, 569 | "parse-json": { 570 | "version": "4.0.0", 571 | "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz", 572 | "integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=", 573 | "requires": { 574 | "error-ex": "^1.3.1", 575 | "json-parse-better-errors": "^1.0.1" 576 | } 577 | }, 578 | "path-is-absolute": { 579 | "version": "1.0.1", 580 | "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", 581 | "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=" 582 | }, 583 | "private": { 584 | "version": "0.1.8", 585 | "resolved": "https://registry.npmjs.org/private/-/private-0.1.8.tgz", 586 | "integrity": "sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg==" 587 | }, 588 | "prop-types": { 589 | "version": "15.6.2", 590 | "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz", 591 | "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==", 592 | "requires": { 593 | "loose-envify": "^1.3.1", 594 | "object-assign": "^4.1.1" 595 | } 596 | }, 597 | "react-emotion": { 598 | "version": "9.2.8", 599 | "resolved": "https://registry.npmjs.org/react-emotion/-/react-emotion-9.2.8.tgz", 600 | "integrity": "sha512-wBtVqGLQR49QG8hl5KDxIMBZtRR6W7n39bk9tq+YU1bfh0RmfLfr5Uatz5NDg86A+XDVX5jFhtXaKxHuKQDCaw==", 601 | "requires": { 602 | "babel-plugin-emotion": "^9.2.8", 603 | "create-emotion-styled": "^9.2.8" 604 | } 605 | }, 606 | "regenerator-runtime": { 607 | "version": "0.11.1", 608 | "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz", 609 | "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==" 610 | }, 611 | "repeating": { 612 | "version": "2.0.1", 613 | "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz", 614 | "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo=", 615 | "requires": { 616 | "is-finite": "^1.0.0" 617 | } 618 | }, 619 | "slash": { 620 | "version": "1.0.0", 621 | "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz", 622 | "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=" 623 | }, 624 | "source-map": { 625 | "version": "0.5.7", 626 | "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", 627 | "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=" 628 | }, 629 | "source-map-support": { 630 | "version": "0.4.18", 631 | "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz", 632 | "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA==", 633 | "requires": { 634 | "source-map": "^0.5.6" 635 | } 636 | }, 637 | "sprintf-js": { 638 | "version": "1.0.3", 639 | "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", 640 | "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=" 641 | }, 642 | "strip-ansi": { 643 | "version": "3.0.1", 644 | "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", 645 | "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=", 646 | "requires": { 647 | "ansi-regex": "^2.0.0" 648 | } 649 | }, 650 | "styled-system": { 651 | "version": "3.0.2", 652 | "resolved": "https://registry.npmjs.org/styled-system/-/styled-system-3.0.2.tgz", 653 | "integrity": "sha512-1fsnk6JtRZVoPo3515+mvaWdLjCXNN0jHvbSKrrz6niaW9fR1VLsx6VO1SBeZgjWo9dtonMhoyTB3oECAoVtrA==", 654 | "requires": { 655 | "prop-types": "^15.6.2" 656 | } 657 | }, 658 | "stylis": { 659 | "version": "3.5.3", 660 | "resolved": "https://registry.npmjs.org/stylis/-/stylis-3.5.3.tgz", 661 | "integrity": "sha512-TxU0aAscJghF9I3V9q601xcK3Uw1JbXvpsBGj/HULqexKOKlOEzzlIpLFRbKkCK990ccuxfXUqmPbIIo7Fq/cQ==" 662 | }, 663 | "stylis-rule-sheet": { 664 | "version": "0.0.10", 665 | "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz", 666 | "integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw==" 667 | }, 668 | "supports-color": { 669 | "version": "2.0.0", 670 | "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", 671 | "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=" 672 | }, 673 | "to-fast-properties": { 674 | "version": "2.0.0", 675 | "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", 676 | "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=" 677 | }, 678 | "touch": { 679 | "version": "1.0.0", 680 | "resolved": "https://registry.npmjs.org/touch/-/touch-1.0.0.tgz", 681 | "integrity": "sha1-RJy+LbrlqMgDjjDXH6D/RklHxN4=", 682 | "requires": { 683 | "nopt": "~1.0.10" 684 | } 685 | }, 686 | "trim-right": { 687 | "version": "1.0.1", 688 | "resolved": "https://registry.npmjs.org/trim-right/-/trim-right-1.0.1.tgz", 689 | "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=" 690 | } 691 | } 692 | } 693 | -------------------------------------------------------------------------------- /examples/dev-environment/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "dev-environment", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | }, 7 | "dependencies": { 8 | "emotion": "^9.2.8", 9 | "react-emotion": "^9.2.8", 10 | "styled-system": "^3.0.2" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /examples/dev-environment/src/Button.js: -------------------------------------------------------------------------------- 1 | import styled from 'react-emotion' 2 | import { space, color } from 'styled-system' 3 | 4 | const Button = styled('button')({ 5 | appearance: 'none', 6 | border: 0, 7 | borderRadius: '4px', 8 | display: 'inline-block', 9 | fontSize: '14px', 10 | fontFamily: 'inherit', 11 | fontWeight: 600, 12 | }, space, color) 13 | 14 | Button.defaultProps = { 15 | px: 3, 16 | py: 2, 17 | color: 'white', 18 | bg: '#c0c' 19 | } 20 | 21 | export default Button 22 | -------------------------------------------------------------------------------- /examples/dev-environment/src/Heading.js: -------------------------------------------------------------------------------- 1 | import styled from 'react-emotion' 2 | import { space, fontSize, color } from 'styled-system' 3 | 4 | const Heading = styled('h2')({ 5 | fontSize: '14px', 6 | fontWeight: 600, 7 | }, space, fontSize, color) 8 | 9 | Heading.defaultProps = { 10 | fontSize: 5, 11 | m: 0 12 | } 13 | 14 | export default Heading 15 | -------------------------------------------------------------------------------- /examples/dev/components/button.mdx: -------------------------------------------------------------------------------- 1 | 2 | # Button 3 | 4 | This is a subroute 5 | -------------------------------------------------------------------------------- /examples/dev/hello.mdx: -------------------------------------------------------------------------------- 1 | 2 | # Hello 3 | 4 | This is another route 5 | -------------------------------------------------------------------------------- /examples/dev/index.mdx: -------------------------------------------------------------------------------- 1 | import { 2 | Head, 3 | } from 'mdx-go' 4 | 5 | 6 | Hello 7 | 8 | 9 | 10 | 11 | # Dev Example 12 | 13 | This example can be run from the root directory as a development environment for the core library. 14 | 15 | - [Menu](/_) 16 | - [Typography](/typography) 17 | - [Hello](/hello) 18 | - [Button](/components/button) 19 | 20 | 21 | ```jsx 22 | import React from 'react' 23 | 24 | export default () => 25 |
26 |

Not Live

27 |
28 | ``` 29 | 30 | ``` 31 | export const files = require.context('..', true, /\.example\.mdx?$/, 'lazy') 32 | ``` 33 | -------------------------------------------------------------------------------- /examples/dev/typography.mdx: -------------------------------------------------------------------------------- 1 | 2 | export const name = 'Typography' 3 | 4 | # Typography 5 | 6 | This is a demonstration page for MDX typographic styles provided by the [`StyleProvider`](/StyleProvider) component. 7 | 8 | # Hamburger 1 9 | ## Hamburger 2 10 | ### Hamburger 3 11 | #### Hamburger 4 12 | ##### Hamburger 5 13 | ###### Hamburger 6 14 | 15 | ``` 16 | This is a fenced code block 17 | ``` 18 | 19 | ```.jsx 20 |

This is a live code block

21 | ``` 22 | 23 | ![](https://jxnblk.com/mdx-go/card.png) 24 | 25 | This is a paragraph with `inline code` and *italics* and **bold** and a [link](#typography). 26 | 27 | > Hello, this is a blockquote. 28 | 29 | --- 30 | 31 | ## Lists 32 | 33 | - This is a list 34 | - Of things that can be listed 35 | - And this particular item is really really long. Much longer than the other items, so it should wrap, but still look okay. 36 | - And here's the last item 37 | 38 | ## Checklists 39 | 40 | - [x] checklist 41 | - [ ] things you could do 42 | - [ ] check items off the list 43 | - [ ] ignore the checklist 44 | 45 | ## Ordered Lists 46 | 47 | 1. Get Ready 48 | 2. Get Set 49 | 3. Go! 50 | 51 | Prop | Type | Description 52 | ---|---|--- 53 | `color` | string | Text color 54 | `bg` | string | Background color 55 | `mt` | number, string, or array | margin top 56 | `mb` | number, string, or array | margin bottom 57 | 58 | ## This is a really long heading that should wrap but still look okay with regard to line height 59 | 60 | -------------------------------------------------------------------------------- /examples/emotion/README.md: -------------------------------------------------------------------------------- 1 | 2 | # emotion example 3 | 4 | ```sh 5 | npm i -g mdx-go && npm i 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/emotion/docs/Box.js: -------------------------------------------------------------------------------- 1 | import styled from '@emotion/styled' 2 | 3 | const Box = styled('div')` 4 | padding: 32px; 5 | font-size: 32px; 6 | font-weight: bold; 7 | background-color: tomato; 8 | ` 9 | 10 | export default Box 11 | -------------------------------------------------------------------------------- /examples/emotion/docs/index.mdx: -------------------------------------------------------------------------------- 1 | import Box from './Box' 2 | 3 | # emotion example 4 | 5 | 6 | Box 7 | 8 | -------------------------------------------------------------------------------- /examples/emotion/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "emotion-example", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | }, 7 | "dependencies": { 8 | "emotion": "^9.2.6", 9 | "emotion-server": "^9.2.6", 10 | "react-emotion": "^9.2.6" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /examples/head-content/README.md: -------------------------------------------------------------------------------- 1 | 2 | # Head example 3 | 4 | ```sh 5 | npm i -g mdx-go 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/head-content/docs/index.mdx: -------------------------------------------------------------------------------- 1 | import { Head } from 'mdx-go' 2 | 3 | 4 | Head example 5 | 6 | 7 | # Head example 8 | 9 | This example has a custom `` set with the `Head` component 10 | 11 | -------------------------------------------------------------------------------- /examples/head-content/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "head-content", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /examples/live-code/README.md: -------------------------------------------------------------------------------- 1 | 2 | # mdx-go live-code example 3 | 4 | ```sh 5 | npm i -g mdx-go 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/live-code/docs/index.mdx: -------------------------------------------------------------------------------- 1 | 2 | export { ComponentProvider as Root } from 'mdx-go' 3 | 4 | # LiveCode example 5 | 6 | ```.jsx 7 | <div 8 | style={{ 9 | color: 'tomato' 10 | }}> 11 | <h2>Edit me</h2> 12 | </div> 13 | ``` 14 | 15 | -------------------------------------------------------------------------------- /examples/live-code/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "live-code", 3 | "requires": true, 4 | "lockfileVersion": 1, 5 | "dependencies": { 6 | "@babel/helper-module-imports": { 7 | "version": "7.0.0-beta.51", 8 | "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.0.0-beta.51.tgz", 9 | "integrity": "sha1-zgBCgEX7t9XrwOp7+DV4nxU2arI=", 10 | "dev": true, 11 | "requires": { 12 | "@babel/types": "7.0.0-beta.51", 13 | "lodash": "^4.17.5" 14 | } 15 | }, 16 | "@babel/types": { 17 | "version": "7.0.0-beta.51", 18 | "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.0.0-beta.51.tgz", 19 | "integrity": "sha1-2AK3tUO1g2x3iqaReXq/APPZfqk=", 20 | "dev": true, 21 | "requires": { 22 | "esutils": "^2.0.2", 23 | "lodash": "^4.17.5", 24 | "to-fast-properties": "^2.0.0" 25 | }, 26 | "dependencies": { 27 | "to-fast-properties": { 28 | "version": "2.0.0", 29 | "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", 30 | "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=", 31 | "dev": true 32 | } 33 | } 34 | }, 35 | "@emotion/babel-utils": { 36 | "version": "0.6.9", 37 | "resolved": "https://registry.npmjs.org/@emotion/babel-utils/-/babel-utils-0.6.9.tgz", 38 | "integrity": "sha512-QN2+TP+x5QWuOGUv8TZwdMiF8PHgBQiLx646rKZBnakgc9gLYFi+gsROVxE6YTNHSaEv0fWsFjDasDyiWSJlDg==", 39 | "dev": true, 40 | "requires": { 41 | "@emotion/hash": "^0.6.5", 42 | "@emotion/memoize": "^0.6.5", 43 | "@emotion/serialize": "^0.9.0", 44 | "convert-source-map": "^1.5.1", 45 | "find-root": "^1.1.0", 46 | "source-map": "^0.7.2" 47 | }, 48 | "dependencies": { 49 | "source-map": { 50 | "version": "0.7.3", 51 | "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz", 52 | "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==", 53 | "dev": true 54 | } 55 | } 56 | }, 57 | "@emotion/hash": { 58 | "version": "0.6.5", 59 | "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.5.tgz", 60 | "integrity": "sha512-JlZbn5+adseTdDPTUkx/O1/UZbhaGR5fCLLWQDCIJ4eP9fJcVdP/qjlTveEX6mkNoJHWFbZ47wArWQQ0Qk6nMA==", 61 | "dev": true 62 | }, 63 | "@emotion/is-prop-valid": { 64 | "version": "0.6.7", 65 | "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.6.7.tgz", 66 | "integrity": "sha512-cK5YUueFhAff0GqL5PqPruBCSdiQ9Gatuc2p7uHOsXh1hx+4aKLF3frPSTobFElwlGUypVwF5pjB3hhc7DebjQ==", 67 | "dev": true, 68 | "requires": { 69 | "@emotion/memoize": "^0.6.5" 70 | } 71 | }, 72 | "@emotion/memoize": { 73 | "version": "0.6.5", 74 | "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.6.5.tgz", 75 | "integrity": "sha512-n1USr7yICA4LFIv7z6kKsXM8rZJxd1btKCBmDewlit+3OJ2j4bDfgXTAxTHYbPkHS/eztHmFWfsbxW2Pu5mDqA==", 76 | "dev": true 77 | }, 78 | "@emotion/serialize": { 79 | "version": "0.9.0", 80 | "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.9.0.tgz", 81 | "integrity": "sha512-ScuBRGxHCyAEN8YgQSsxtG5ddmP9+Of8WkxC7hidhGTxKhq3lgeCu5cFk2WdAMrpYgEd0U4g4QW/1YrCOGpAsA==", 82 | "dev": true, 83 | "requires": { 84 | "@emotion/hash": "^0.6.5", 85 | "@emotion/memoize": "^0.6.5", 86 | "@emotion/unitless": "^0.6.6", 87 | "@emotion/utils": "^0.8.1" 88 | } 89 | }, 90 | "@emotion/stylis": { 91 | "version": "0.7.0", 92 | "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.7.0.tgz", 93 | "integrity": "sha512-DTq3Wo4p63JoogA5TaVKZHj7QcU32kRF+iKLWJnfGlIw4S+v90rVHX8pLQETKILWXk05iZ2b0KUKFMTAHYbytw==", 94 | "dev": true 95 | }, 96 | "@emotion/unitless": { 97 | "version": "0.6.6", 98 | "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.6.6.tgz", 99 | "integrity": "sha512-zbd1vXRpGWCgDLsXqITReL+eqYJ95PYyWrVCCuMLBDb2LGA/HdxrZHJri6Fe+tKHihBOiCK1kbu+3Ij8aNEjzA==", 100 | "dev": true 101 | }, 102 | "@emotion/utils": { 103 | "version": "0.8.1", 104 | "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.8.1.tgz", 105 | "integrity": "sha512-dEv1n+IFtlvLQ8/FsTOtBCC1aNT4B5abE8ODF5wk2tpWnjvgGNRMvHCeJGbVHjFfer4h8MH2w9c2/6eoJHclMg==", 106 | "dev": true 107 | }, 108 | "abbrev": { 109 | "version": "1.1.1", 110 | "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", 111 | "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==", 112 | "dev": true 113 | }, 114 | "ansi-regex": { 115 | "version": "2.1.1", 116 | "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", 117 | "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=", 118 | "dev": true 119 | }, 120 | "ansi-styles": { 121 | "version": "2.2.1", 122 | "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", 123 | "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=", 124 | "dev": true 125 | }, 126 | "argparse": { 127 | "version": "1.0.10", 128 | "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz", 129 | "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==", 130 | "dev": true, 131 | "requires": { 132 | "sprintf-js": "~1.0.2" 133 | } 134 | }, 135 | "babel-code-frame": { 136 | "version": "6.26.0", 137 | "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz", 138 | "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=", 139 | "dev": true, 140 | "requires": { 141 | "chalk": "^1.1.3", 142 | "esutils": "^2.0.2", 143 | "js-tokens": "^3.0.2" 144 | }, 145 | "dependencies": { 146 | "chalk": { 147 | "version": "1.1.3", 148 | "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", 149 | "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", 150 | "dev": true, 151 | "requires": { 152 | "ansi-styles": "^2.2.1", 153 | "escape-string-regexp": "^1.0.2", 154 | "has-ansi": "^2.0.0", 155 | "strip-ansi": "^3.0.0", 156 | "supports-color": "^2.0.0" 157 | } 158 | }, 159 | "js-tokens": { 160 | "version": "3.0.2", 161 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz", 162 | "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=", 163 | "dev": true 164 | } 165 | } 166 | }, 167 | "babel-core": { 168 | "version": "6.26.3", 169 | "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-6.26.3.tgz", 170 | "integrity": "sha512-6jyFLuDmeidKmUEb3NM+/yawG0M2bDZ9Z1qbZP59cyHLz8kYGKYwpJP0UwUKKUiTRNvxfLesJnTedqczP7cTDA==", 171 | "dev": true, 172 | "requires": { 173 | "babel-code-frame": "^6.26.0", 174 | "babel-generator": "^6.26.0", 175 | "babel-helpers": "^6.24.1", 176 | "babel-messages": "^6.23.0", 177 | "babel-register": "^6.26.0", 178 | "babel-runtime": "^6.26.0", 179 | "babel-template": "^6.26.0", 180 | "babel-traverse": "^6.26.0", 181 | "babel-types": "^6.26.0", 182 | "babylon": "^6.18.0", 183 | "convert-source-map": "^1.5.1", 184 | "debug": "^2.6.9", 185 | "json5": "^0.5.1", 186 | "lodash": "^4.17.4", 187 | "minimatch": "^3.0.4", 188 | "path-is-absolute": "^1.0.1", 189 | "private": "^0.1.8", 190 | "slash": "^1.0.0", 191 | "source-map": "^0.5.7" 192 | } 193 | }, 194 | "babel-generator": { 195 | "version": "6.26.1", 196 | "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.1.tgz", 197 | "integrity": "sha512-HyfwY6ApZj7BYTcJURpM5tznulaBvyio7/0d4zFOeMPUmfxkCjHocCuoLa2SAGzBI8AREcH3eP3758F672DppA==", 198 | "dev": true, 199 | "requires": { 200 | "babel-messages": "^6.23.0", 201 | "babel-runtime": "^6.26.0", 202 | "babel-types": "^6.26.0", 203 | "detect-indent": "^4.0.0", 204 | "jsesc": "^1.3.0", 205 | "lodash": "^4.17.4", 206 | "source-map": "^0.5.7", 207 | "trim-right": "^1.0.1" 208 | } 209 | }, 210 | "babel-helpers": { 211 | "version": "6.24.1", 212 | "resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz", 213 | "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI=", 214 | "dev": true, 215 | "requires": { 216 | "babel-runtime": "^6.22.0", 217 | "babel-template": "^6.24.1" 218 | } 219 | }, 220 | "babel-messages": { 221 | "version": "6.23.0", 222 | "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz", 223 | "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4=", 224 | "dev": true, 225 | "requires": { 226 | "babel-runtime": "^6.22.0" 227 | } 228 | }, 229 | "babel-plugin-emotion": { 230 | "version": "9.2.8", 231 | "resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-9.2.8.tgz", 232 | "integrity": "sha512-m+M0Xim43+y3Egpl0C4Zz5dI0f7JaBi6GZF1vtr1IdODRpxWOx47uzr7qXyuBCG/U/nB2DGaU996of0nJjwWbw==", 233 | "dev": true, 234 | "requires": { 235 | "@babel/helper-module-imports": "7.0.0-beta.51", 236 | "@emotion/babel-utils": "^0.6.4", 237 | "@emotion/hash": "^0.6.2", 238 | "@emotion/memoize": "^0.6.1", 239 | "@emotion/stylis": "^0.7.0", 240 | "babel-core": "^6.26.3", 241 | "babel-plugin-macros": "^2.0.0", 242 | "babel-plugin-syntax-jsx": "^6.18.0", 243 | "convert-source-map": "^1.5.0", 244 | "find-root": "^1.1.0", 245 | "mkdirp": "^0.5.1", 246 | "source-map": "^0.5.7", 247 | "touch": "^1.0.0" 248 | } 249 | }, 250 | "babel-plugin-macros": { 251 | "version": "2.4.0", 252 | "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.4.0.tgz", 253 | "integrity": "sha512-flIBfrqAdHWn+4l2cS/4jZEyl+m5EaBHVzTb0aOF+eu/zR7E41/MoCFHPhDNL8Wzq1nyelnXeT+vcL2byFLSZw==", 254 | "dev": true, 255 | "requires": { 256 | "cosmiconfig": "^5.0.5" 257 | } 258 | }, 259 | "babel-plugin-syntax-jsx": { 260 | "version": "6.18.0", 261 | "resolved": "http://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz", 262 | "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=", 263 | "dev": true 264 | }, 265 | "babel-register": { 266 | "version": "6.26.0", 267 | "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz", 268 | "integrity": "sha1-btAhFz4vy0htestFxgCahW9kcHE=", 269 | "dev": true, 270 | "requires": { 271 | "babel-core": "^6.26.0", 272 | "babel-runtime": "^6.26.0", 273 | "core-js": "^2.5.0", 274 | "home-or-tmp": "^2.0.0", 275 | "lodash": "^4.17.4", 276 | "mkdirp": "^0.5.1", 277 | "source-map-support": "^0.4.15" 278 | }, 279 | "dependencies": { 280 | "core-js": { 281 | "version": "2.5.7", 282 | "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.7.tgz", 283 | "integrity": "sha512-RszJCAxg/PP6uzXVXL6BsxSXx/B05oJAQ2vkJRjyjrEcNVycaqOmNb5OTxZPE3xa5gwZduqza6L9JOCenh/Ecw==", 284 | "dev": true 285 | } 286 | } 287 | }, 288 | "babel-runtime": { 289 | "version": "6.26.0", 290 | "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz", 291 | "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=", 292 | "dev": true, 293 | "requires": { 294 | "core-js": "^2.4.0", 295 | "regenerator-runtime": "^0.11.0" 296 | }, 297 | "dependencies": { 298 | "core-js": { 299 | "version": "2.5.7", 300 | "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.7.tgz", 301 | "integrity": "sha512-RszJCAxg/PP6uzXVXL6BsxSXx/B05oJAQ2vkJRjyjrEcNVycaqOmNb5OTxZPE3xa5gwZduqza6L9JOCenh/Ecw==", 302 | "dev": true 303 | } 304 | } 305 | }, 306 | "babel-template": { 307 | "version": "6.26.0", 308 | "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz", 309 | "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI=", 310 | "dev": true, 311 | "requires": { 312 | "babel-runtime": "^6.26.0", 313 | "babel-traverse": "^6.26.0", 314 | "babel-types": "^6.26.0", 315 | "babylon": "^6.18.0", 316 | "lodash": "^4.17.4" 317 | } 318 | }, 319 | "babel-traverse": { 320 | "version": "6.26.0", 321 | "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz", 322 | "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4=", 323 | "dev": true, 324 | "requires": { 325 | "babel-code-frame": "^6.26.0", 326 | "babel-messages": "^6.23.0", 327 | "babel-runtime": "^6.26.0", 328 | "babel-types": "^6.26.0", 329 | "babylon": "^6.18.0", 330 | "debug": "^2.6.8", 331 | "globals": "^9.18.0", 332 | "invariant": "^2.2.2", 333 | "lodash": "^4.17.4" 334 | } 335 | }, 336 | "babel-types": { 337 | "version": "6.26.0", 338 | "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz", 339 | "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=", 340 | "dev": true, 341 | "requires": { 342 | "babel-runtime": "^6.26.0", 343 | "esutils": "^2.0.2", 344 | "lodash": "^4.17.4", 345 | "to-fast-properties": "^1.0.3" 346 | } 347 | }, 348 | "babylon": { 349 | "version": "6.18.0", 350 | "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz", 351 | "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==", 352 | "dev": true 353 | }, 354 | "balanced-match": { 355 | "version": "1.0.0", 356 | "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", 357 | "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=", 358 | "dev": true 359 | }, 360 | "brace-expansion": { 361 | "version": "1.1.11", 362 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", 363 | "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", 364 | "dev": true, 365 | "requires": { 366 | "balanced-match": "^1.0.0", 367 | "concat-map": "0.0.1" 368 | } 369 | }, 370 | "concat-map": { 371 | "version": "0.0.1", 372 | "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", 373 | "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", 374 | "dev": true 375 | }, 376 | "convert-source-map": { 377 | "version": "1.5.1", 378 | "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz", 379 | "integrity": "sha1-uCeAl7m8IpNl3lxiz1/K7YtVmeU=", 380 | "dev": true 381 | }, 382 | "cosmiconfig": { 383 | "version": "5.0.6", 384 | "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-5.0.6.tgz", 385 | "integrity": "sha512-6DWfizHriCrFWURP1/qyhsiFvYdlJzbCzmtFWh744+KyWsJo5+kPzUZZaMRSSItoYc0pxFX7gEO7ZC1/gN/7AQ==", 386 | "dev": true, 387 | "requires": { 388 | "is-directory": "^0.3.1", 389 | "js-yaml": "^3.9.0", 390 | "parse-json": "^4.0.0" 391 | } 392 | }, 393 | "create-emotion": { 394 | "version": "9.2.6", 395 | "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-9.2.6.tgz", 396 | "integrity": "sha512-4g46va26lw6DPfKF7HeWY3OI/qoaNSwpvO+li8dMydZfC6f6+ZffwlYHeIyAhGR8Z8C8c0H9J1pJbQRtb9LScw==", 397 | "dev": true, 398 | "requires": { 399 | "@emotion/hash": "^0.6.2", 400 | "@emotion/memoize": "^0.6.1", 401 | "@emotion/stylis": "^0.6.10", 402 | "@emotion/unitless": "^0.6.2", 403 | "csstype": "^2.5.2", 404 | "stylis": "^3.5.0", 405 | "stylis-rule-sheet": "^0.0.10" 406 | }, 407 | "dependencies": { 408 | "@emotion/stylis": { 409 | "version": "0.6.12", 410 | "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.6.12.tgz", 411 | "integrity": "sha512-yS+t7l5FeYeiIyADyqjFBJvdotpphHb2S3mP4qak5BpV7ODvxuyAVF24IchEslW+A1MWHAhn5SiOW6GZIumiEQ==", 412 | "dev": true 413 | } 414 | } 415 | }, 416 | "create-emotion-styled": { 417 | "version": "9.2.8", 418 | "resolved": "https://registry.npmjs.org/create-emotion-styled/-/create-emotion-styled-9.2.8.tgz", 419 | "integrity": "sha512-2LrNM5MREWzI5hZK+LyiBHglwE18WE3AEbBQgpHQ1+zmyLSm/dJsUZBeFAwuIMb+TjNZP0KsMZlV776ufOtFdg==", 420 | "dev": true, 421 | "requires": { 422 | "@emotion/is-prop-valid": "^0.6.1" 423 | } 424 | }, 425 | "csstype": { 426 | "version": "2.5.6", 427 | "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.5.6.tgz", 428 | "integrity": "sha512-tKPyhy0FmfYD2KQYXD5GzkvAYLYj96cMLXr648CKGd3wBe0QqoPipImjGiLze9c8leJK8J3n7ap90tpk3E6HGQ==", 429 | "dev": true 430 | }, 431 | "debug": { 432 | "version": "2.6.9", 433 | "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", 434 | "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", 435 | "dev": true, 436 | "requires": { 437 | "ms": "2.0.0" 438 | } 439 | }, 440 | "detect-indent": { 441 | "version": "4.0.0", 442 | "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz", 443 | "integrity": "sha1-920GQ1LN9Docts5hnE7jqUdd4gg=", 444 | "dev": true, 445 | "requires": { 446 | "repeating": "^2.0.0" 447 | } 448 | }, 449 | "emotion": { 450 | "version": "9.2.8", 451 | "resolved": "https://registry.npmjs.org/emotion/-/emotion-9.2.8.tgz", 452 | "integrity": "sha512-4CT7S2+TDcd9qTSosd3VibERAsaZjhraeLxLWRuV6epX5XdHQjeLFqAlion/iT8M3UNQx9bqmlOTd+KaUj2M8Q==", 453 | "dev": true, 454 | "requires": { 455 | "babel-plugin-emotion": "^9.2.8", 456 | "create-emotion": "^9.2.6" 457 | } 458 | }, 459 | "emotion-theming": { 460 | "version": "9.2.6", 461 | "resolved": "https://registry.npmjs.org/emotion-theming/-/emotion-theming-9.2.6.tgz", 462 | "integrity": "sha512-sbZStubPmaDuMhs3+saH4XegnoMgbVtEY2giD1MP+maDinCnJdzf/1Apcip1wo5HMAN7vrjvpmcY13pH34xR6g==", 463 | "dev": true, 464 | "requires": { 465 | "hoist-non-react-statics": "^2.3.1" 466 | } 467 | }, 468 | "error-ex": { 469 | "version": "1.3.2", 470 | "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz", 471 | "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==", 472 | "dev": true, 473 | "requires": { 474 | "is-arrayish": "^0.2.1" 475 | } 476 | }, 477 | "escape-string-regexp": { 478 | "version": "1.0.5", 479 | "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", 480 | "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=", 481 | "dev": true 482 | }, 483 | "esprima": { 484 | "version": "4.0.1", 485 | "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz", 486 | "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==", 487 | "dev": true 488 | }, 489 | "esutils": { 490 | "version": "2.0.2", 491 | "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz", 492 | "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs=", 493 | "dev": true 494 | }, 495 | "find-root": { 496 | "version": "1.1.0", 497 | "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", 498 | "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==", 499 | "dev": true 500 | }, 501 | "globals": { 502 | "version": "9.18.0", 503 | "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz", 504 | "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==", 505 | "dev": true 506 | }, 507 | "has-ansi": { 508 | "version": "2.0.0", 509 | "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz", 510 | "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=", 511 | "dev": true, 512 | "requires": { 513 | "ansi-regex": "^2.0.0" 514 | } 515 | }, 516 | "hoist-non-react-statics": { 517 | "version": "2.5.5", 518 | "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz", 519 | "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==", 520 | "dev": true 521 | }, 522 | "home-or-tmp": { 523 | "version": "2.0.0", 524 | "resolved": "https://registry.npmjs.org/home-or-tmp/-/home-or-tmp-2.0.0.tgz", 525 | "integrity": "sha1-42w/LSyufXRqhX440Y1fMqeILbg=", 526 | "dev": true, 527 | "requires": { 528 | "os-homedir": "^1.0.0", 529 | "os-tmpdir": "^1.0.1" 530 | } 531 | }, 532 | "invariant": { 533 | "version": "2.2.4", 534 | "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", 535 | "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==", 536 | "dev": true, 537 | "requires": { 538 | "loose-envify": "^1.0.0" 539 | } 540 | }, 541 | "is-arrayish": { 542 | "version": "0.2.1", 543 | "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz", 544 | "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=", 545 | "dev": true 546 | }, 547 | "is-directory": { 548 | "version": "0.3.1", 549 | "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz", 550 | "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE=", 551 | "dev": true 552 | }, 553 | "is-finite": { 554 | "version": "1.0.2", 555 | "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz", 556 | "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko=", 557 | "dev": true, 558 | "requires": { 559 | "number-is-nan": "^1.0.0" 560 | } 561 | }, 562 | "js-tokens": { 563 | "version": "4.0.0", 564 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", 565 | "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", 566 | "dev": true 567 | }, 568 | "js-yaml": { 569 | "version": "3.12.0", 570 | "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.12.0.tgz", 571 | "integrity": "sha512-PIt2cnwmPfL4hKNwqeiuz4bKfnzHTBv6HyVgjahA6mPLwPDzjDWrplJBMjHUFxku/N3FlmrbyPclad+I+4mJ3A==", 572 | "dev": true, 573 | "requires": { 574 | "argparse": "^1.0.7", 575 | "esprima": "^4.0.0" 576 | } 577 | }, 578 | "jsesc": { 579 | "version": "1.3.0", 580 | "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz", 581 | "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s=", 582 | "dev": true 583 | }, 584 | "json-parse-better-errors": { 585 | "version": "1.0.2", 586 | "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz", 587 | "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==", 588 | "dev": true 589 | }, 590 | "json5": { 591 | "version": "0.5.1", 592 | "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz", 593 | "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE=", 594 | "dev": true 595 | }, 596 | "lodash": { 597 | "version": "4.17.10", 598 | "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz", 599 | "integrity": "sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg==", 600 | "dev": true 601 | }, 602 | "loose-envify": { 603 | "version": "1.4.0", 604 | "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", 605 | "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", 606 | "dev": true, 607 | "requires": { 608 | "js-tokens": "^3.0.0 || ^4.0.0" 609 | } 610 | }, 611 | "minimatch": { 612 | "version": "3.0.4", 613 | "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", 614 | "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", 615 | "dev": true, 616 | "requires": { 617 | "brace-expansion": "^1.1.7" 618 | } 619 | }, 620 | "minimist": { 621 | "version": "0.0.8", 622 | "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", 623 | "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=", 624 | "dev": true 625 | }, 626 | "mkdirp": { 627 | "version": "0.5.1", 628 | "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", 629 | "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=", 630 | "dev": true, 631 | "requires": { 632 | "minimist": "0.0.8" 633 | } 634 | }, 635 | "ms": { 636 | "version": "2.0.0", 637 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", 638 | "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=", 639 | "dev": true 640 | }, 641 | "nopt": { 642 | "version": "1.0.10", 643 | "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz", 644 | "integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4=", 645 | "dev": true, 646 | "requires": { 647 | "abbrev": "1" 648 | } 649 | }, 650 | "number-is-nan": { 651 | "version": "1.0.1", 652 | "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz", 653 | "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=", 654 | "dev": true 655 | }, 656 | "os-homedir": { 657 | "version": "1.0.2", 658 | "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", 659 | "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=", 660 | "dev": true 661 | }, 662 | "os-tmpdir": { 663 | "version": "1.0.2", 664 | "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", 665 | "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=", 666 | "dev": true 667 | }, 668 | "parse-json": { 669 | "version": "4.0.0", 670 | "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz", 671 | "integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=", 672 | "dev": true, 673 | "requires": { 674 | "error-ex": "^1.3.1", 675 | "json-parse-better-errors": "^1.0.1" 676 | } 677 | }, 678 | "path-is-absolute": { 679 | "version": "1.0.1", 680 | "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", 681 | "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", 682 | "dev": true 683 | }, 684 | "private": { 685 | "version": "0.1.8", 686 | "resolved": "https://registry.npmjs.org/private/-/private-0.1.8.tgz", 687 | "integrity": "sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg==", 688 | "dev": true 689 | }, 690 | "react-emotion": { 691 | "version": "9.2.8", 692 | "resolved": "https://registry.npmjs.org/react-emotion/-/react-emotion-9.2.8.tgz", 693 | "integrity": "sha512-wBtVqGLQR49QG8hl5KDxIMBZtRR6W7n39bk9tq+YU1bfh0RmfLfr5Uatz5NDg86A+XDVX5jFhtXaKxHuKQDCaw==", 694 | "dev": true, 695 | "requires": { 696 | "babel-plugin-emotion": "^9.2.8", 697 | "create-emotion-styled": "^9.2.8" 698 | } 699 | }, 700 | "regenerator-runtime": { 701 | "version": "0.11.1", 702 | "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz", 703 | "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==", 704 | "dev": true 705 | }, 706 | "repeating": { 707 | "version": "2.0.1", 708 | "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz", 709 | "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo=", 710 | "dev": true, 711 | "requires": { 712 | "is-finite": "^1.0.0" 713 | } 714 | }, 715 | "slash": { 716 | "version": "1.0.0", 717 | "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz", 718 | "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=", 719 | "dev": true 720 | }, 721 | "source-map": { 722 | "version": "0.5.7", 723 | "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", 724 | "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", 725 | "dev": true 726 | }, 727 | "source-map-support": { 728 | "version": "0.4.18", 729 | "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz", 730 | "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA==", 731 | "dev": true, 732 | "requires": { 733 | "source-map": "^0.5.6" 734 | } 735 | }, 736 | "sprintf-js": { 737 | "version": "1.0.3", 738 | "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", 739 | "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=", 740 | "dev": true 741 | }, 742 | "strip-ansi": { 743 | "version": "3.0.1", 744 | "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", 745 | "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=", 746 | "dev": true, 747 | "requires": { 748 | "ansi-regex": "^2.0.0" 749 | } 750 | }, 751 | "stylis": { 752 | "version": "3.5.3", 753 | "resolved": "https://registry.npmjs.org/stylis/-/stylis-3.5.3.tgz", 754 | "integrity": "sha512-TxU0aAscJghF9I3V9q601xcK3Uw1JbXvpsBGj/HULqexKOKlOEzzlIpLFRbKkCK990ccuxfXUqmPbIIo7Fq/cQ==", 755 | "dev": true 756 | }, 757 | "stylis-rule-sheet": { 758 | "version": "0.0.10", 759 | "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz", 760 | "integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw==", 761 | "dev": true 762 | }, 763 | "supports-color": { 764 | "version": "2.0.0", 765 | "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", 766 | "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", 767 | "dev": true 768 | }, 769 | "to-fast-properties": { 770 | "version": "1.0.3", 771 | "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz", 772 | "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=", 773 | "dev": true 774 | }, 775 | "touch": { 776 | "version": "1.0.0", 777 | "resolved": "https://registry.npmjs.org/touch/-/touch-1.0.0.tgz", 778 | "integrity": "sha1-RJy+LbrlqMgDjjDXH6D/RklHxN4=", 779 | "dev": true, 780 | "requires": { 781 | "nopt": "~1.0.10" 782 | } 783 | }, 784 | "trim-right": { 785 | "version": "1.0.1", 786 | "resolved": "https://registry.npmjs.org/trim-right/-/trim-right-1.0.1.tgz", 787 | "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=", 788 | "dev": true 789 | } 790 | } 791 | } 792 | -------------------------------------------------------------------------------- /examples/live-code/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "live-code", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | }, 7 | "devDependencies": { 8 | "emotion": "^9.2.8", 9 | "emotion-theming": "^9.2.6", 10 | "react-emotion": "^9.2.8" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /examples/mdx-themes/README.md: -------------------------------------------------------------------------------- 1 | 2 | # mdx-themes example 3 | 4 | ```sh 5 | npm i -g mdx-go && npm i 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/mdx-themes/docs/index.mdx: -------------------------------------------------------------------------------- 1 | export { BaseTheme as Root } from 'mdx-themes' 2 | 3 | # BaseTheme example 4 | 5 | This example uses the `BaseTheme` component from mdx-themes 6 | 7 | -------------------------------------------------------------------------------- /examples/mdx-themes/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "mdx-themes-example", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | }, 7 | "dependencies": { 8 | "mdx-themes": "^1.0.0-0" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /examples/react-live/README.md: -------------------------------------------------------------------------------- 1 | 2 | # mdx-go basic example 3 | 4 | ```sh 5 | npm i -g mdx-go 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/react-live/docs/components.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { ComponentProvider, Layout } from 'mdx-go' 3 | import { 4 | LiveProvider, 5 | LivePreview, 6 | LiveEditor, 7 | LiveError 8 | } from 'react-live' 9 | 10 | const code = props => { 11 | const isLive = props.className.includes('language-.jsx') 12 | if (!isLive) return <pre {...props} /> 13 | const code = React.Children.toArray(props.children).join('') 14 | 15 | return ( 16 | <LiveProvider 17 | code={code} 18 | mountStylesheet={false} 19 | > 20 | <LivePreview /> 21 | <LiveEditor /> 22 | <LiveError /> 23 | </LiveProvider> 24 | ) 25 | } 26 | 27 | const components = { 28 | code, 29 | } 30 | 31 | export const Root = props => 32 | <ComponentProvider components={components}> 33 | <Layout.Main> 34 | {props.children} 35 | </Layout.Main> 36 | </ComponentProvider> 37 | 38 | -------------------------------------------------------------------------------- /examples/react-live/docs/index.mdx: -------------------------------------------------------------------------------- 1 | 2 | export { Root } from './components' 3 | 4 | # mdx-go react-live example 5 | 6 | ```.jsx 7 | <h1>Edit me</h1> 8 | ``` 9 | 10 | -------------------------------------------------------------------------------- /examples/react-live/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "basic", 3 | "requires": true, 4 | "lockfileVersion": 1, 5 | "dependencies": { 6 | "acorn": { 7 | "version": "5.7.3", 8 | "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.7.3.tgz", 9 | "integrity": "sha512-T/zvzYRfbVojPWahDsE5evJdHb3oJoQfFbsrKM7w5Zcs++Tr257tia3BmMP8XYVjp1S9RZXQMh7gao96BlqZOw==" 10 | }, 11 | "acorn-dynamic-import": { 12 | "version": "3.0.0", 13 | "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-3.0.0.tgz", 14 | "integrity": "sha512-zVWV8Z8lislJoOKKqdNMOB+s6+XV5WERty8MnKBeFgwA+19XJjJHs2RP5dzM57FftIs+jQnRToLiWazKr6sSWg==", 15 | "requires": { 16 | "acorn": "^5.0.0" 17 | } 18 | }, 19 | "acorn-jsx": { 20 | "version": "4.1.1", 21 | "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-4.1.1.tgz", 22 | "integrity": "sha512-JY+iV6r+cO21KtntVvFkD+iqjtdpRUpGqKWgfkCdZq1R+kbreEl8EcdcJR4SmiIgsIQT33s6QzheQ9a275Q8xw==", 23 | "requires": { 24 | "acorn": "^5.0.3" 25 | } 26 | }, 27 | "ansi-styles": { 28 | "version": "3.2.1", 29 | "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", 30 | "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", 31 | "requires": { 32 | "color-convert": "^1.9.0" 33 | } 34 | }, 35 | "buble": { 36 | "version": "0.19.3", 37 | "resolved": "https://registry.npmjs.org/buble/-/buble-0.19.3.tgz", 38 | "integrity": "sha512-3B0Lcy2u6x6km0BqTz/FS3UnrOJlnIlBWsyjvtqzdtmWkqiS0+Sg4hc6L9Mmm63hZKTACpYS9vUeIoKSi1vcrQ==", 39 | "requires": { 40 | "acorn": "^5.4.1", 41 | "acorn-dynamic-import": "^3.0.0", 42 | "acorn-jsx": "^4.1.1", 43 | "chalk": "^2.3.1", 44 | "magic-string": "^0.22.4", 45 | "minimist": "^1.2.0", 46 | "os-homedir": "^1.0.1", 47 | "vlq": "^1.0.0" 48 | } 49 | }, 50 | "chalk": { 51 | "version": "2.4.1", 52 | "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.1.tgz", 53 | "integrity": "sha512-ObN6h1v2fTJSmUXoS3nMQ92LbDK9be4TV+6G+omQlGJFdcUX5heKi1LZ1YnRMIgwTLEj3E24bT6tYni50rlCfQ==", 54 | "requires": { 55 | "ansi-styles": "^3.2.1", 56 | "escape-string-regexp": "^1.0.5", 57 | "supports-color": "^5.3.0" 58 | } 59 | }, 60 | "clipboard": { 61 | "version": "1.7.1", 62 | "resolved": "https://registry.npmjs.org/clipboard/-/clipboard-1.7.1.tgz", 63 | "integrity": "sha1-Ng1taUbpmnof7zleQrqStem1oWs=", 64 | "optional": true, 65 | "requires": { 66 | "good-listener": "^1.2.2", 67 | "select": "^1.1.2", 68 | "tiny-emitter": "^2.0.0" 69 | } 70 | }, 71 | "color-convert": { 72 | "version": "1.9.3", 73 | "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", 74 | "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==", 75 | "requires": { 76 | "color-name": "1.1.3" 77 | } 78 | }, 79 | "color-name": { 80 | "version": "1.1.3", 81 | "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", 82 | "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=" 83 | }, 84 | "component-props": { 85 | "version": "1.1.1", 86 | "resolved": "https://registry.npmjs.org/component-props/-/component-props-1.1.1.tgz", 87 | "integrity": "sha1-+bffm5kntubZfJvScqqGdnDzSUQ=" 88 | }, 89 | "component-xor": { 90 | "version": "0.0.4", 91 | "resolved": "https://registry.npmjs.org/component-xor/-/component-xor-0.0.4.tgz", 92 | "integrity": "sha1-xV2DzMG5TNUImk6T+niRxyY+Wao=" 93 | }, 94 | "core-js": { 95 | "version": "2.5.7", 96 | "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.7.tgz", 97 | "integrity": "sha512-RszJCAxg/PP6uzXVXL6BsxSXx/B05oJAQ2vkJRjyjrEcNVycaqOmNb5OTxZPE3xa5gwZduqza6L9JOCenh/Ecw==" 98 | }, 99 | "delegate": { 100 | "version": "3.2.0", 101 | "resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz", 102 | "integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw==", 103 | "optional": true 104 | }, 105 | "dom-iterator": { 106 | "version": "1.0.0", 107 | "resolved": "https://registry.npmjs.org/dom-iterator/-/dom-iterator-1.0.0.tgz", 108 | "integrity": "sha512-7dsMOQI07EMU98gQM8NSB3GsAiIeBYIPKpnxR3c9xOvdvBjChAcOM0iJ222I3p5xyiZO9e5oggkNaCusuTdYig==", 109 | "requires": { 110 | "component-props": "1.1.1", 111 | "component-xor": "0.0.4" 112 | } 113 | }, 114 | "escape-string-regexp": { 115 | "version": "1.0.5", 116 | "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", 117 | "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=" 118 | }, 119 | "good-listener": { 120 | "version": "1.2.2", 121 | "resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz", 122 | "integrity": "sha1-1TswzfkxPf+33JoNR3CWqm0UXFA=", 123 | "optional": true, 124 | "requires": { 125 | "delegate": "^3.1.2" 126 | } 127 | }, 128 | "has-flag": { 129 | "version": "3.0.0", 130 | "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", 131 | "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=" 132 | }, 133 | "js-tokens": { 134 | "version": "4.0.0", 135 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", 136 | "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" 137 | }, 138 | "loose-envify": { 139 | "version": "1.4.0", 140 | "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", 141 | "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", 142 | "requires": { 143 | "js-tokens": "^3.0.0 || ^4.0.0" 144 | } 145 | }, 146 | "magic-string": { 147 | "version": "0.22.5", 148 | "resolved": "http://registry.npmjs.org/magic-string/-/magic-string-0.22.5.tgz", 149 | "integrity": "sha512-oreip9rJZkzvA8Qzk9HFs8fZGF/u7H/gtrE8EN6RjKJ9kh2HlC+yQ2QezifqTZfGyiuAV0dRv5a+y/8gBb1m9w==", 150 | "requires": { 151 | "vlq": "^0.2.2" 152 | }, 153 | "dependencies": { 154 | "vlq": { 155 | "version": "0.2.3", 156 | "resolved": "https://registry.npmjs.org/vlq/-/vlq-0.2.3.tgz", 157 | "integrity": "sha512-DRibZL6DsNhIgYQ+wNdWDL2SL3bKPlVrRiBqV5yuMm++op8W4kGFtaQfCs4KEJn0wBZcHVHJ3eoywX8983k1ow==" 158 | } 159 | } 160 | }, 161 | "minimist": { 162 | "version": "1.2.0", 163 | "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", 164 | "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=" 165 | }, 166 | "object-assign": { 167 | "version": "4.1.1", 168 | "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", 169 | "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" 170 | }, 171 | "os-homedir": { 172 | "version": "1.0.2", 173 | "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", 174 | "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=" 175 | }, 176 | "prismjs": { 177 | "version": "1.6.0", 178 | "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.6.0.tgz", 179 | "integrity": "sha1-EY2V+3pm26InLjQ7NF9SNmWds2U=", 180 | "requires": { 181 | "clipboard": "^1.5.5" 182 | } 183 | }, 184 | "prop-types": { 185 | "version": "15.6.2", 186 | "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz", 187 | "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==", 188 | "requires": { 189 | "loose-envify": "^1.3.1", 190 | "object-assign": "^4.1.1" 191 | } 192 | }, 193 | "react-live": { 194 | "version": "1.11.0", 195 | "resolved": "https://registry.npmjs.org/react-live/-/react-live-1.11.0.tgz", 196 | "integrity": "sha512-Lx2SnR4Dj3hgPcoHPuOB7pUDp8yjxajyl38uJ3FbZ+8Pfa1Y7gqW3PMQuAUIzjsHACEPqjm4RrXPP0rzrlUKXg==", 197 | "requires": { 198 | "buble": "^0.19.3", 199 | "core-js": "^2.4.1", 200 | "dom-iterator": "^1.0.0", 201 | "prismjs": "1.6", 202 | "prop-types": "^15.5.8", 203 | "unescape": "^0.2.0" 204 | } 205 | }, 206 | "select": { 207 | "version": "1.1.2", 208 | "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz", 209 | "integrity": "sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0=", 210 | "optional": true 211 | }, 212 | "supports-color": { 213 | "version": "5.5.0", 214 | "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", 215 | "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==", 216 | "requires": { 217 | "has-flag": "^3.0.0" 218 | } 219 | }, 220 | "tiny-emitter": { 221 | "version": "2.0.2", 222 | "resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.0.2.tgz", 223 | "integrity": "sha512-2NM0auVBGft5tee/OxP4PI3d8WItkDM+fPnaRAVo6xTDI2knbz9eC5ArWGqtGlYqiH3RU5yMpdyTTO7MguC4ow==", 224 | "optional": true 225 | }, 226 | "unescape": { 227 | "version": "0.2.0", 228 | "resolved": "https://registry.npmjs.org/unescape/-/unescape-0.2.0.tgz", 229 | "integrity": "sha1-t4ubYMhvFinfGBv1Pu47yNY2fd8=" 230 | }, 231 | "vlq": { 232 | "version": "1.0.0", 233 | "resolved": "https://registry.npmjs.org/vlq/-/vlq-1.0.0.tgz", 234 | "integrity": "sha512-o3WmXySo+oI5thgqr7Qy8uBkT/v9Zr+sRyrh1lr8aWPUkgDWdWt4Nae2WKBrLsocgE8BuWWD0jLc+VW8LeU+2g==" 235 | } 236 | } 237 | } 238 | -------------------------------------------------------------------------------- /examples/react-live/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "basic", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | }, 7 | "dependencies": { 8 | "react-live": "^1.11.0" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /examples/routing/README.md: -------------------------------------------------------------------------------- 1 | 2 | # routing example 3 | 4 | ```sh 5 | npm i -g mdx-go 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/routing/docs/about.mdx: -------------------------------------------------------------------------------- 1 | 2 | # About 3 | 4 | - [Home](/) 5 | - [About](/about) 6 | -------------------------------------------------------------------------------- /examples/routing/docs/index.mdx: -------------------------------------------------------------------------------- 1 | 2 | # routing example 3 | 4 | - [Home](/) 5 | - [About](/about) 6 | 7 | -------------------------------------------------------------------------------- /examples/routing/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "routing-example", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /examples/styled-components/README.md: -------------------------------------------------------------------------------- 1 | 2 | # styled-components example 3 | 4 | ```sh 5 | npm i -g mdx-go && npm i 6 | ``` 7 | 8 | ```sh 9 | npm start 10 | ``` 11 | -------------------------------------------------------------------------------- /examples/styled-components/docs/Box.js: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | const Box = styled.div` 4 | padding: 32px; 5 | font-size: 32px; 6 | font-weight: bold; 7 | background-color: tomato; 8 | ` 9 | 10 | export default Box 11 | -------------------------------------------------------------------------------- /examples/styled-components/docs/index.mdx: -------------------------------------------------------------------------------- 1 | import Box from './Box' 2 | 3 | # styled-components example 4 | 5 | <Box> 6 | Box 7 | </Box> 8 | -------------------------------------------------------------------------------- /examples/styled-components/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "styled-components-example", 4 | "scripts": { 5 | "start": "mdx-go docs" 6 | }, 7 | "dependencies": { 8 | "styled-components": "^3.4.5" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /lib/build.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const http = require('http') 3 | const path = require('path') 4 | const webpack = require('webpack') 5 | const rimraf = require('rimraf') 6 | const createConfig = require('./config') 7 | const HTMLPlugin = require('./html-plugin') 8 | const renderHTML = require('./render-html') 9 | 10 | const compile = async compiler => await new Promise((resolve, reject) => { 11 | compiler.run((err, stats) => { 12 | if (err) { 13 | reject(err) 14 | return 15 | } 16 | resolve(stats) 17 | }) 18 | }) 19 | 20 | module.exports = async opts => { 21 | const pages = await renderHTML(opts) 22 | const config = createConfig(opts) 23 | 24 | const defs = new webpack.DefinePlugin({ 25 | __DEV__: JSON.stringify(false), 26 | __OPTIONS__: JSON.stringify(opts), 27 | __DIRNAME__: JSON.stringify(opts.dirname), 28 | __BASENAME__: JSON.stringify(opts.basename), 29 | __STATIC__: JSON.stringify(false) 30 | }) 31 | 32 | config.plugins.push(defs) 33 | config.output.path = opts.outDir 34 | config.output.publicPath = opts.basename + '/' 35 | 36 | if (opts.debug) { 37 | console.log('DEBUG MODE') 38 | config.mode = 'development' 39 | config.stats = 'verbose' 40 | } 41 | 42 | pages.forEach(page => { 43 | config.plugins.push( 44 | new HTMLPlugin({ 45 | filename: page.path + '/index.html', 46 | context: page 47 | }) 48 | ) 49 | }) 50 | 51 | const compiler = webpack(config) 52 | 53 | const stats = await compile(compiler) 54 | 55 | if (opts.static) { 56 | const bundle = path.join(opts.outDir, './main.js') 57 | rimraf(bundle, err => { 58 | if (err) console.error(err) 59 | }) 60 | } 61 | 62 | return stats 63 | } 64 | -------------------------------------------------------------------------------- /lib/client/App.js: -------------------------------------------------------------------------------- 1 | import path from 'path' 2 | import React from 'react' 3 | import { 4 | Router, 5 | } from '@reach/router' 6 | import { routes, Root, NotFound } from './routes' 7 | import { 8 | HeadProvider, 9 | ComponentProvider, 10 | } from 'mdx-go' 11 | import Keyboard from './Keyboard' 12 | 13 | const App = ({ 14 | basepath = '', 15 | keyboard, 16 | fullscreen, 17 | headTags = [], 18 | }) => 19 | <HeadProvider tags={headTags}> 20 | <Root 21 | routes={routes} 22 | fullscreen={fullscreen}> 23 | <Router basepath={basepath}> 24 | {routes.map(({ 25 | Component, 26 | ...route 27 | }) => Component && ( 28 | <Component 29 | {...route} 30 | path={route.path} 31 | routes={routes} 32 | default={undefined} 33 | /> 34 | ))} 35 | <NotFound 36 | default 37 | routes={routes} 38 | /> 39 | </Router> 40 | </Root> 41 | {keyboard && <Keyboard />} 42 | </HeadProvider> 43 | 44 | export default App 45 | export { routes, Root, NotFound } 46 | -------------------------------------------------------------------------------- /lib/client/ComponentProvider.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { MDXProvider } from '@mdx-js/tag' 3 | import defaultScope from './scope' 4 | 5 | export const ComponentProvider = ({ 6 | components, 7 | ...props 8 | }) => 9 | <MDXProvider 10 | components={{ 11 | ...defaultScope, 12 | ...components 13 | }}> 14 | <React.Fragment> 15 | {props.children} 16 | </React.Fragment> 17 | </MDXProvider> 18 | 19 | export default ComponentProvider 20 | -------------------------------------------------------------------------------- /lib/client/Head.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { createPortal } from 'react-dom' 3 | 4 | const noop = () => { 5 | console.warn('Missing HeadProvider') 6 | } 7 | 8 | export const Context = React.createContext({ 9 | tags: [], 10 | push: noop 11 | }) 12 | 13 | export class HeadProvider extends React.Component { 14 | static defaultProps = { 15 | tags: [] 16 | } 17 | 18 | push = (elements) => { 19 | this.props.tags.push(...elements) 20 | } 21 | 22 | render () { 23 | const context = { 24 | ...this.props, 25 | push: this.push 26 | } 27 | 28 | return ( 29 | <Context.Provider value={context}> 30 | {this.props.children} 31 | </Context.Provider> 32 | ) 33 | } 34 | } 35 | 36 | export class Head extends React.Component { 37 | state = { 38 | didMount: false 39 | } 40 | 41 | rehydrate = () => { 42 | const children = React.Children.toArray(this.props.children) 43 | const nodes = [ 44 | ...document.head.querySelectorAll('[data-head]') 45 | ] 46 | 47 | nodes.forEach(node => { 48 | node.remove() 49 | }) 50 | children.forEach(child => { 51 | if (child.type === 'title') { 52 | const title = document.head.querySelector('title') 53 | if (title) title.remove() 54 | } 55 | if (child.type === 'meta') { 56 | const { name } = child.props 57 | let meta 58 | if (name) meta = document.head.querySelector(`meta[name="${name}"]`) 59 | if (meta) meta.remove() 60 | } 61 | }) 62 | 63 | this.setState({ 64 | didMount: true 65 | }) 66 | } 67 | 68 | componentDidMount () { 69 | this.rehydrate() 70 | } 71 | 72 | render () { 73 | const children = React.Children.toArray(this.props.children) 74 | .map(child => React.cloneElement(child, { 75 | 'data-head': true 76 | })) 77 | 78 | const { didMount } = this.state 79 | 80 | if (!didMount) { 81 | return ( 82 | <Context.Consumer 83 | children={({ push }) => { 84 | push(children) 85 | return false 86 | }} 87 | /> 88 | ) 89 | } 90 | 91 | return createPortal( 92 | children, 93 | document.head 94 | ) 95 | } 96 | } 97 | -------------------------------------------------------------------------------- /lib/client/Keyboard.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Location } from '@reach/router' 3 | import routes from './routes' 4 | 5 | export class Keyboard extends React.Component { 6 | handleKeyDown = e => { 7 | const { location } = this.props 8 | const { tagName } = document.activeElement 9 | if (tagName !== 'BODY' && tagName !== 'DIV') return 10 | switch (e.key) { 11 | case '/': 12 | this.navigate('/_') 13 | break 14 | case 'ArrowLeft': 15 | case 'k': 16 | this.goto(-1) 17 | break 18 | case 'ArrowRight': 19 | case 'j': 20 | this.goto(1) 21 | break 22 | } 23 | } 24 | 25 | navigate = pathname => { 26 | const { navigate } = this.props 27 | navigate(pathname) 28 | .then(() => { 29 | window.scrollTo(0, 0) 30 | }) 31 | } 32 | 33 | goto = n => { 34 | const { location } = this.props 35 | const index = routes.findIndex(route => route.path === location.pathname) 36 | const next = routes[index + n] 37 | if (!next) return 38 | this.navigate(next.path) 39 | } 40 | 41 | componentDidMount () { 42 | document.addEventListener('keydown', this.handleKeyDown) 43 | } 44 | 45 | componentWillUnmount () { 46 | document.removeEventListener('keydown', this.handleKeyDown) 47 | } 48 | 49 | render () { 50 | return false 51 | } 52 | } 53 | 54 | export default props => 55 | <Location 56 | children={router => <Keyboard {...router} />} 57 | /> 58 | -------------------------------------------------------------------------------- /lib/client/Link.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Link as ReachLink } from '@reach/router' 3 | import isAbsoluteURL from 'is-absolute-url' 4 | 5 | export const Link = ({ 6 | href, 7 | ...props 8 | }) => isAbsoluteURL(href) 9 | ? <a href={href} {...props} /> 10 | : <ReachLink to={href} {...props} /> 11 | 12 | export default Link 13 | -------------------------------------------------------------------------------- /lib/client/StyleProvider.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import MDXStyle from 'mdx-style' 3 | import { base as theme } from 'mdx-style/themes' 4 | import scope from './scope' 5 | 6 | export const StyleProvider = ({ 7 | components = {}, 8 | ...props 9 | }) => 10 | <MDXStyle 11 | components={{ 12 | ...scope, 13 | ...components 14 | }} 15 | css={theme} 16 | {...props} 17 | /> 18 | 19 | export default StyleProvider 20 | -------------------------------------------------------------------------------- /lib/client/components.js: -------------------------------------------------------------------------------- 1 | export { Head, HeadProvider } from './Head' 2 | export { Link } from './Link' 3 | export { ComponentProvider } from './ComponentProvider' 4 | export { withComponents } from './withComponents' 5 | export { StyleProvider } from './StyleProvider' 6 | export { lazyComponent } from './lazyComponent' 7 | -------------------------------------------------------------------------------- /lib/client/index.js: -------------------------------------------------------------------------------- 1 | import path from 'path' 2 | import React from 'react' 3 | import { render, hydrate } from 'react-dom' 4 | import App from './App' 5 | 6 | const div = document.getElementById('root') 7 | const mount = div.innerHTML ? hydrate : render 8 | 9 | const basename = __BASENAME__ 10 | const props = __OPTIONS__ 11 | props.basepath = basename 12 | 13 | mount(<App {...props} />, div) 14 | 15 | if (module.hot) module.hot.accept() 16 | -------------------------------------------------------------------------------- /lib/client/keyboard-shortcuts.md: -------------------------------------------------------------------------------- 1 | 2 | ### Keyboard Shortcuts 3 | 4 | - `/`: Show directory listing 5 | - `→` `j`: Go to next route 6 | - `←` `k`: Go to previous route 7 | 8 | <a href='https://github.com/jxnblk/mdx-go' target='_blank'>About MDX Go</a> 9 | -------------------------------------------------------------------------------- /lib/client/lazyComponent.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export const lazyComponent = (loader, loading) => { 4 | let Component = null 5 | 6 | return class Loadable extends React.Component { 7 | static preload = () => { 8 | Component = loader().default 9 | } 10 | 11 | constructor () { 12 | super() 13 | this.state = { 14 | Component, 15 | } 16 | } 17 | 18 | componentDidMount () { 19 | const load = loader() 20 | if (typeof load.then !== 'function') { 21 | this.setState({ Component: load.default }) 22 | return 23 | } 24 | 25 | load.then(({ 26 | default: Component, 27 | }) => { 28 | this.setState({ Component }) 29 | }) 30 | } 31 | 32 | render () { 33 | const { Component } = this.state 34 | 35 | if (!Component) return false 36 | 37 | return ( 38 | <Component 39 | {...this.props} 40 | /> 41 | ) 42 | } 43 | } 44 | } 45 | 46 | export default lazyComponent 47 | -------------------------------------------------------------------------------- /lib/client/routes.js: -------------------------------------------------------------------------------- 1 | import path from 'path' 2 | import React from 'react' 3 | import { Location } from '@reach/router' 4 | import lazyComponent from './lazyComponent' 5 | import { Link } from './Link' 6 | import StyleProvider from './StyleProvider' 7 | import KeyboardShortcuts from './keyboard-shortcuts.md' 8 | 9 | const name = 'mdx-go' 10 | const context = __STATIC__ 11 | ? require.context(__DIRNAME__, true, /\.(js|md|mdx)$/, 'sync') 12 | : require.context(__DIRNAME__, true, /\.(js|md|mdx)$/, 'lazy') 13 | 14 | const getSync = require.context(__DIRNAME__, false, /index\.(js|md|mdx)$/, 'sync') 15 | 16 | export let Root = props => props.fullscreen ? props.children : 17 | <StyleProvider 18 | children={props.children} 19 | style={{ 20 | padding: 32, 21 | marginLeft: 'auto', 22 | marginRight: 'auto', 23 | maxWidth: 768 24 | }} 25 | /> 26 | 27 | export let NotFound = (props) => 28 | <h1>Page not found</h1> 29 | 30 | export const Directory = props => 31 | <React.Fragment> 32 | <h1>{name}</h1> 33 | {props.routes 34 | .filter(route => route.path !== '/_') 35 | .map(route => ( 36 | <div key={route.key}> 37 | <Link href={route.path} 38 | style={{ 39 | fontWeight: 'bold', 40 | color: 'inherit', 41 | }}> 42 | {route.key} 43 | </Link> 44 | </div> 45 | ))} 46 | <KeyboardShortcuts /> 47 | </React.Fragment> 48 | 49 | export const parseRoute = (key, context) => { 50 | const extname = path.extname(key) 51 | const name = path.basename(key, extname) 52 | if (/^_/.test(name)) return null 53 | const dirname = path.dirname(key).replace(/^\./, '') 54 | const index = name === 'index' 55 | const pathname = dirname + '/' + (index ? '' : name) 56 | 57 | let Component = lazyComponent(() => context(key)) 58 | let exports = {} 59 | 60 | if (index) { 61 | exports = context(key) 62 | Component = lazyComponent(() => exports) 63 | } 64 | 65 | if (name === '404') { 66 | NotFound = Component 67 | return 68 | } 69 | 70 | return { 71 | key, 72 | extname, 73 | name, 74 | dirname, 75 | path: pathname, 76 | Component, 77 | ...exports 78 | } 79 | } 80 | 81 | export const [ index ] = getSync.keys() 82 | .map(key => parseRoute(key, getSync)) 83 | .filter(Boolean) 84 | 85 | const withRouter = Component => React.forwardRef((props, ref) => 86 | <Location 87 | children={router => ( 88 | <Component 89 | ref={ref} 90 | {...props} 91 | {...router} 92 | /> 93 | )} 94 | /> 95 | ) 96 | 97 | if (typeof index.Root === 'function') { 98 | Root = withRouter(index.Root) 99 | } 100 | 101 | export const mainRoutes = context.keys() 102 | .filter(key => key !== index.key) 103 | .map(key => parseRoute(key, context)) 104 | .filter(Boolean) 105 | 106 | export const subRoutes = (typeof index.files === 'function' && index.files.keys) 107 | ? index.files.keys().map(key => parseRoute(key, index.files)) 108 | : [] 109 | 110 | const directory = { 111 | key: '_', 112 | path: '/_', 113 | Component: lazyComponent(() => ({ default: Directory })), 114 | } 115 | 116 | export const routes = [ 117 | index, 118 | ...mainRoutes, 119 | ...subRoutes, 120 | directory 121 | ] 122 | 123 | export default routes 124 | -------------------------------------------------------------------------------- /lib/client/scope.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Link } from './Link' 3 | import lazyComponent from './lazyComponent' 4 | 5 | const pre = lazyComponent(() => import('mdx-live')) 6 | 7 | const heading = Tag => ({ id, children, ...props }) => 8 | <Tag id={id} {...props}> 9 | <a 10 | href={'#' + id} 11 | style={{ 12 | textDecoration: 'none', 13 | color: 'inherit' 14 | }} 15 | children={children} 16 | /> 17 | </Tag> 18 | 19 | export const scope = { 20 | a: Link, 21 | pre, 22 | h1: heading('h1'), 23 | h2: heading('h2'), 24 | h3: heading('h3'), 25 | h4: heading('h4'), 26 | h5: heading('h5'), 27 | h6: heading('h6'), 28 | } 29 | 30 | export default scope 31 | -------------------------------------------------------------------------------- /lib/client/withComponents.js: -------------------------------------------------------------------------------- 1 | export { withMDXComponents as withComponents } from '@mdx-js/tag/dist/mdx-provider' 2 | -------------------------------------------------------------------------------- /lib/config.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const WebpackBar = require('webpackbar') 3 | const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') 4 | const merge = require('webpack-merge') 5 | const remarkPlugins = [ 6 | require('remark-emoji'), 7 | require('remark-images'), 8 | require('remark-autolink-headings'), 9 | require('remark-slug'), 10 | require('remark-unwrap-images'), 11 | ] 12 | 13 | const babel = { 14 | babelrc: false, 15 | presets: [ 16 | [ require.resolve('@babel/preset-env'), { modules: false } ], 17 | require.resolve('@babel/preset-react'), 18 | ], 19 | plugins: [ 20 | '@babel/plugin-proposal-class-properties', 21 | '@babel/plugin-proposal-export-default-from', 22 | '@babel/plugin-proposal-export-namespace-from', 23 | '@babel/plugin-transform-runtime', 24 | '@babel/plugin-syntax-dynamic-import', 25 | ].map(require.resolve) 26 | } 27 | 28 | const rules = [ 29 | { 30 | test: /\.js$/, 31 | exclude: /node_modules/, 32 | use: { 33 | loader: require.resolve('babel-loader'), 34 | options: babel 35 | } 36 | }, 37 | { 38 | test: /\.js$/, 39 | exclude: path.join(__dirname, '../node_modules'), 40 | include: [ 41 | path.join(__dirname, './lib'), 42 | __dirname, 43 | path.join(__dirname, '..') 44 | ], 45 | use: { 46 | loader: require.resolve('babel-loader'), 47 | options: babel 48 | } 49 | }, 50 | { 51 | test: /\.mdx?$/, 52 | exclude: /node_modules\/(?!(mdx-go)\/).*/, 53 | use: [ 54 | { 55 | loader: require.resolve('babel-loader'), 56 | options: babel 57 | }, 58 | { 59 | loader: require.resolve('@mdx-js/loader'), 60 | options: { 61 | remarkPlugins 62 | } 63 | } 64 | ] 65 | }, 66 | ] 67 | 68 | const createConfig = (opts = {}) => merge.smart(({ 69 | name: 'mdx-go', 70 | context: __dirname, 71 | mode: 'production', 72 | stats: 'errors-only', 73 | entry: [ 74 | path.join(__dirname, './client/index.js') 75 | ], 76 | output: { 77 | path: path.resolve('dist'), 78 | filename: 'main.js', 79 | publicPath: '/' 80 | }, 81 | module: { 82 | rules 83 | }, 84 | resolve: { 85 | alias: { 86 | 'mdx-go': path.resolve(__dirname, './client/components'), 87 | 'webpack-hot-middleware/client': path.resolve(require.resolve('webpack-hot-middleware/client')) 88 | }, 89 | modules: [ 90 | __dirname, 91 | path.join(__dirname, '../node_modules'), 92 | path.relative(process.cwd(), path.join(__dirname, '../node_modules')), 93 | 'node_modules' 94 | ] 95 | }, 96 | plugins: [ 97 | new WebpackBar({ 98 | name: '[mdx-go]' 99 | }), 100 | new FriendlyErrorsPlugin(), 101 | ] 102 | }), opts.webpack) 103 | 104 | module.exports = createConfig 105 | -------------------------------------------------------------------------------- /lib/dev.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const http = require('http') 3 | const connect = require('connect') 4 | const webpack = require('webpack') 5 | const history = require('connect-history-api-fallback') 6 | const serveStatic = require('serve-static') 7 | const devMiddleware = require('webpack-dev-middleware') 8 | const hotMiddleware = require('webpack-hot-middleware') 9 | const chalk = require('chalk') 10 | 11 | const HTMLPlugin = require('./html-plugin') 12 | const createConfig = require('./config') 13 | 14 | module.exports = async opts => { 15 | const config = createConfig(opts) 16 | 17 | config.entry.unshift( 18 | 'webpack-hot-middleware/client' 19 | ) 20 | config.plugins.push( 21 | new webpack.HotModuleReplacementPlugin() 22 | ) 23 | config.mode = 'development' 24 | 25 | const defs = new webpack.DefinePlugin({ 26 | __DEV__: JSON.stringify(true), 27 | __OPTIONS__: JSON.stringify(opts), 28 | __DIRNAME__: JSON.stringify(opts.dirname), 29 | __BASENAME__: JSON.stringify(''), 30 | __STATIC__: JSON.stringify(false) 31 | }) 32 | 33 | config.plugins.push(defs) 34 | 35 | config.plugins.push( 36 | new HTMLPlugin() 37 | ) 38 | 39 | const devOptions = { 40 | stats: 'errors-only', 41 | logLevel: 'error', 42 | publicPath: '/', 43 | } 44 | const hotOptions = { 45 | log: false 46 | } 47 | 48 | if (opts.debug) { 49 | console.log('DEBUG MODE') 50 | config.stats = 'verbose' 51 | devOptions.stats = 'verbose' 52 | devOptions.logLevel = 'debug' 53 | hotOptions.log = true 54 | } 55 | 56 | const app = connect() 57 | 58 | const compiler = webpack(config) 59 | 60 | const middleware = devMiddleware(compiler, devOptions) 61 | 62 | app.use(history()) 63 | app.use(serveStatic(opts.dirname)) 64 | app.use(middleware) 65 | app.use(hotMiddleware(compiler, hotOptions)) 66 | 67 | return new Promise((resolve) => { 68 | const server = http.createServer(app) 69 | 70 | compiler.hooks.done.tap('mdx-go', () => { 71 | resolve(server) 72 | }) 73 | 74 | const port = Number(opts.port) 75 | server.listen(port) 76 | }) 77 | } 78 | -------------------------------------------------------------------------------- /lib/html-plugin.js: -------------------------------------------------------------------------------- 1 | // based on mini-html-webpack-plugin 2 | const path = require('path') 3 | const { RawSource } = require('webpack-sources') 4 | 5 | class HTMLPlugin { 6 | constructor (options = {}) { 7 | this.options = options 8 | this.plugin = this.plugin.bind(this) 9 | } 10 | 11 | plugin (compilation, callback) { 12 | const { publicPath } = compilation.options.output 13 | const { 14 | filename = 'index.html', 15 | template = defaultTemplate, 16 | context 17 | } = this.options 18 | 19 | const files = getFiles(compilation.entrypoints) 20 | const chunks = getChunks(compilation.chunks) 21 | const links = generateCSSReferences(files.css, publicPath) 22 | const scripts = generateJSReferences(files.js, publicPath) 23 | const prefetch = generatePrefetchLinks(chunks.js, publicPath) 24 | const ctx = Object.assign({}, files, { 25 | publicPath, 26 | links, 27 | prefetch, 28 | scripts 29 | }, context) 30 | 31 | compilation.assets[filename] = new RawSource( 32 | template(ctx) 33 | ) 34 | 35 | callback() 36 | } 37 | 38 | apply (compiler) { 39 | compiler.hooks.emit.tapAsync('MDXGoHtmlPlugin', this.plugin) 40 | } 41 | } 42 | 43 | const getFiles = (entrypoints) => { 44 | const files = {} 45 | 46 | entrypoints.forEach(entry => { 47 | entry.getFiles().forEach(file => { 48 | const extension = path.extname(file).replace(/\./, '') 49 | 50 | if (!files[extension]) { 51 | files[extension] = [] 52 | } 53 | 54 | files[extension].push(file) 55 | }) 56 | }) 57 | 58 | return files 59 | } 60 | 61 | const getChunks = (chunks) => { 62 | const obj = {} 63 | 64 | chunks.forEach(chunk => { 65 | chunk.files.forEach(file => { 66 | const extension = path.extname(file).replace(/\./, '') 67 | if (!obj[extension]) { 68 | obj[extension] = [] 69 | } 70 | obj[extension].push(file) 71 | }) 72 | }) 73 | 74 | return obj 75 | } 76 | 77 | const defaultTemplate = ({ 78 | links, 79 | prefetch, 80 | scripts, 81 | title = '', 82 | body = '', 83 | head = '', 84 | css = '', 85 | static: noScript, 86 | publicPath 87 | }) => `<!DOCTYPE html> 88 | <html> 89 | <head> 90 | <meta charset='utf-8'> 91 | <meta name='viewport' content='width=device-width,initial-scale=1'> 92 | <style>*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif}</style> 93 | ${head}${css}${links}${prefetch} 94 | </head> 95 | <body> 96 | <div id=root>${body}</div> 97 | ${noScript ? '' : scripts} 98 | </body> 99 | </html>` 100 | 101 | const generateCSSReferences = (files = [], publicPath = '') => files 102 | .map(file => `<link href='${publicPath + file}' rel='stylesheet'>`) 103 | .join('') 104 | 105 | const generateJSReferences = (files = [], publicPath = '') => files 106 | .map(file => `<script src='${publicPath + file}'></script>`) 107 | .join('') 108 | 109 | const generatePrefetchLinks = (files = [], publicPath = '') => files 110 | .map(file => `<link rel='prefetch' as='script' href='${publicPath + file}'>`) 111 | .join('') 112 | 113 | module.exports = HTMLPlugin 114 | module.exports.template = defaultTemplate 115 | -------------------------------------------------------------------------------- /lib/render-html.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const path = require('path') 3 | const React = require('react') 4 | const { 5 | renderToString, 6 | renderToStaticMarkup 7 | } = require('react-dom/server') 8 | const { ServerLocation } = require('@reach/router') 9 | const webpack = require('webpack') 10 | const nodeExternals = require('webpack-node-externals') 11 | const rimraf = require('rimraf') 12 | const mkdirp = require('mkdirp') 13 | const resolveCWD = require('resolve-cwd') 14 | const createConfig = require('./config') 15 | 16 | const getApp = async opts => { 17 | opts.tempdir = path.join(opts.outDir, 'TEMP') 18 | 19 | if (!fs.existsSync(opts.outDir)) mkdirp.sync(opts.outDir) 20 | if (!fs.existsSync(opts.tempdir)) mkdirp.sync(opts.tempdir) 21 | 22 | const config = createConfig(opts) 23 | 24 | config.output = { 25 | path: opts.tempdir, 26 | filename: '[name].js', 27 | libraryTarget: 'umd' 28 | } 29 | config.entry = { 30 | App: path.join(__dirname, './client/App.js') 31 | } 32 | config.target = 'node' 33 | config.externals = [ 34 | nodeExternals({ 35 | whitelist: [ 36 | 'mdx-go' 37 | ] 38 | }) 39 | ] 40 | config.plugins.push( 41 | new webpack.DefinePlugin({ 42 | __OPTIONS__: JSON.stringify(opts), 43 | __DIRNAME__: JSON.stringify(opts.dirname), 44 | __STATIC__: JSON.stringify(true) 45 | }) 46 | ) 47 | 48 | if (opts.debug) { 49 | config.mode = 'development' 50 | config.stats = 'verbose' 51 | } 52 | 53 | const compiler = webpack(config) 54 | 55 | return new Promise((resolve, reject) => { 56 | compiler.run((err, stats) => { 57 | if (err) { 58 | reject(err) 59 | return 60 | } 61 | const app = require( 62 | path.resolve(opts.tempdir, './App.js') 63 | ) 64 | 65 | if (!opts.debug) { 66 | rimraf(opts.tempdir, err => { 67 | if (err) console.error(err) 68 | }) 69 | } 70 | resolve(app) 71 | }) 72 | }) 73 | } 74 | 75 | const renderPage = (App, path, opts) => { 76 | let body, css, head 77 | const headTags = [] 78 | const el = React.createElement(ServerLocation, { 79 | basename: opts.basename, 80 | url: path 81 | }, 82 | React.createElement(App, { headTags }) 83 | ) 84 | switch (opts.cssLibrary) { 85 | case 'styled-components': 86 | const { ServerStyleSheet } = require(resolveCWD('styled-components')) 87 | const sheet = new ServerStyleSheet() 88 | body = renderToString( 89 | sheet.collectStyles(el) 90 | ) 91 | css = sheet.getStyleTags() 92 | break 93 | case 'emotion': 94 | const { renderStylesToString } = require(resolveCWD('emotion-server')) 95 | body = renderStylesToString(renderToString(el)) 96 | break 97 | default: 98 | body = renderToString(el) 99 | break 100 | } 101 | head = renderToStaticMarkup(headTags) 102 | return { body, css, head } 103 | } 104 | 105 | const renderHTML = async opts => { 106 | const { default: App, routes } = await getApp(opts) 107 | const headTags = [] 108 | const pages = routes.map(route => { 109 | route.Component.preload() 110 | const { body, css, head } = renderPage(App, route.path, opts) 111 | return Object.assign({ body, head, css }, opts, route) 112 | }) 113 | return pages 114 | } 115 | 116 | module.exports = renderHTML 117 | -------------------------------------------------------------------------------- /now.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "mdx-go", 3 | "alias": [ 4 | "mdx-go.now.sh" 5 | ], 6 | "public": true, 7 | "type": "static" 8 | } 9 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "mdx-go", 3 | "version": "2.0.0-31", 4 | "description": "Lightning-fast MDX-based dev server", 5 | "bin": { 6 | "mdx-go": "./cli.js" 7 | }, 8 | "main": "lib/client/components.js", 9 | "module": "lib/client/components.js", 10 | "sideEffects": false, 11 | "scripts": { 12 | "start": "./cli.js examples/dev", 13 | "build": "./cli.js build examples/dev -d temp", 14 | "help": "./cli.js", 15 | "test": "nyc ava" 16 | }, 17 | "keywords": [ 18 | "mdx", 19 | "react", 20 | "dev-server", 21 | "development", 22 | "docs", 23 | "documentation", 24 | "static-site" 25 | ], 26 | "author": "Brent Jackson", 27 | "license": "MIT", 28 | "dependencies": { 29 | "@babel/core": "^7.8.3", 30 | "@babel/plugin-proposal-class-properties": "^7.8.3", 31 | "@babel/plugin-proposal-export-default-from": "^7.8.3", 32 | "@babel/plugin-proposal-export-namespace-from": "^7.8.3", 33 | "@babel/plugin-proposal-nullish-coalescing-operator": "^7.8.3", 34 | "@babel/plugin-syntax-dynamic-import": "^7.8.3", 35 | "@babel/plugin-transform-runtime": "^7.8.3", 36 | "@babel/preset-env": "^7.8.3", 37 | "@babel/preset-react": "^7.8.3", 38 | "@babel/runtime": "^7.8.3", 39 | "@mdx-js/loader": "^1.5.4", 40 | "@mdx-js/mdx": "^1.5.4", 41 | "@mdx-js/tag": "^0.20.3", 42 | "@reach/router": "^1.2.1", 43 | "babel-loader": "^8.0.6", 44 | "chalk": "^3.0.0", 45 | "connect": "^3.7.0", 46 | "connect-history-api-fallback": "^1.6.0", 47 | "find-up": "^4.1.0", 48 | "friendly-errors-webpack-plugin": "^1.7.0", 49 | "is-absolute-url": "^3.0.3", 50 | "lodash.get": "^4.4.2", 51 | "lodash.sortby": "^4.7.0", 52 | "mdx-live": "^2.0.0-alpha.2", 53 | "mdx-style": "^2.0.0-alpha.2", 54 | "meow": "^6.0.0", 55 | "pkg-conf": "^3.1.0", 56 | "prop-types": "^15.7.2", 57 | "react": "^16.12.0", 58 | "react-dev-utils": "^10.0.0", 59 | "react-dom": "^16.12.0", 60 | "read-pkg-up": "^7.0.1", 61 | "remark-autolink-headings": "^5.2.1", 62 | "remark-emoji": "^2.0.2", 63 | "remark-images": "^1.0.0", 64 | "remark-slug": "^5.1.2", 65 | "remark-unwrap-images": "1.0.0", 66 | "resolve-cwd": "^3.0.0", 67 | "rimraf": "^3.0.0", 68 | "serve-static": "^1.14.1", 69 | "update-notifier": "^4.0.0", 70 | "webpack": "^4.41.5", 71 | "webpack-dev-middleware": "^3.7.2", 72 | "webpack-hot-middleware": "^2.25.0", 73 | "webpack-merge": "^4.2.2", 74 | "webpack-node-externals": "^1.7.2", 75 | "webpack-sources": "^1.4.3", 76 | "webpackbar": "^4.0.0" 77 | }, 78 | "devDependencies": { 79 | "@babel/polyfill": "^7.8.3", 80 | "@babel/register": "^7.8.3", 81 | "ava": "^2.4.0", 82 | "nyc": "^15.0.0", 83 | "supertest": "^4.0.2" 84 | }, 85 | "ava": { 86 | "require": [ 87 | "@babel/register", 88 | "@babel/polyfill" 89 | ] 90 | } 91 | } 92 | -------------------------------------------------------------------------------- /test/build.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const path = require('path') 3 | const test = require('ava') 4 | const rimraf = require('rimraf') 5 | const build = require('../lib/build') 6 | 7 | const output = path.resolve('test/helpers') 8 | const index = path.resolve('test/helpers/index.html') 9 | 10 | const clean = () => { 11 | rimraf.sync(output) 12 | } 13 | 14 | test.before(clean) 15 | test.after(clean) 16 | 17 | test.serial('builds', async t => { 18 | const stats = await build({ 19 | basename: '', 20 | dirname: path.join(__dirname, './fixtures'), 21 | outDir: output 22 | }) 23 | t.is(typeof stats, 'object') 24 | const html = fs.readFileSync(index, 'utf8') 25 | t.is(typeof html, 'string') 26 | t.snapshot(html) 27 | }) 28 | -------------------------------------------------------------------------------- /test/dev.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const test = require('ava') 3 | const request = require('supertest') 4 | const dev = require('../lib/dev') 5 | 6 | let server 7 | 8 | test.serial('starts', async t => { 9 | server = await dev({ 10 | port: 3000, 11 | dirname: path.join(__dirname, './fixtures') 12 | }) 13 | t.is(typeof server, 'object') 14 | t.is(typeof server.address, 'function') 15 | }) 16 | 17 | test('returns html', async t => { 18 | const res = await request(server).get('/') 19 | .expect(200) 20 | .expect('Content-Type', 'text/html; charset=UTF-8') 21 | t.is(typeof res.text, 'string') 22 | }) 23 | 24 | test('serves bundled.js', async t => { 25 | const res = await request(server).get('/main.js') 26 | .expect(200) 27 | .expect('Content-Type', 'application/javascript; charset=UTF-8') 28 | t.is(typeof res.text, 'string') 29 | }) 30 | -------------------------------------------------------------------------------- /test/fixtures/index.mdx: -------------------------------------------------------------------------------- 1 | 2 | # Hello mdx-go 3 | 4 | This is a test fixture for snapshot testing 5 | 6 | ```jsx 7 | <Box /> 8 | ``` 9 | 10 | ```.jsx 11 | <h1>Hello</h1> 12 | ``` 13 | -------------------------------------------------------------------------------- /test/snapshots/build.js.md: -------------------------------------------------------------------------------- 1 | # Snapshot report for `test/build.js` 2 | 3 | The actual snapshot is saved in `build.js.snap`. 4 | 5 | Generated by [AVA](https://ava.li). 6 | 7 | ## builds 8 | 9 | > Snapshot 1 10 | 11 | `<!DOCTYPE html>␊ 12 | <html>␊ 13 | <head>␊ 14 | <meta charset='utf-8'>␊ 15 | <meta name='viewport' content='width=device-width,initial-scale=1'>␊ 16 | <style>*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif}</style>␊ 17 | <link rel='prefetch' as='script' href='/main.js'><link rel='prefetch' as='script' href='/1.main.js'>␊ 18 | </head>␊ 19 | <body>␊ 20 | <div id=root><style>.xxkzcb5{font-family:system-ui, sans-serif}.x1xuibxm{line-height:1.625}.xj5o3ko{color:var(--text, #000)}.x84zijf{--text:#000}.x1lx8izr{--lightgray:#f6f6ff}.xoavy26{--gray:#e6e6ef}.x3jh6gi{--link:#07c}.xt40oyo{color:var(--link)}.x7jn1pg{font-size:32px}.x932p0m{line-height:1.25}.x1lsblo3{margin-top:32px}.xdr0by3{margin-bottom:16px}@media screen and (min-width:40em){.x1oyn110{font-size:48px}}.xgg8z9z{font-size:24px}@media screen and (min-width:40em){.x16ffdkx{font-size:32px}}.xz648ln{font-size:20px}.xkxfumy{font-size:16px}.xuo9ww4{font-size:14px}.x1uu2vdp{margin-top:16px}.x14c28r2{font-size:12px}.x1de0kzs{padding-left:16px}.x1h6hk7o > p{margin-top:0}.x1c1lvta > p{margin-bottom:0}.x1eretcl > ul{margin-top:0}.x1ehgsib > ul{margin-bottom:0}.x1dlcerz > ol{margin-top:0}.x1oejo2x > ol{margin-bottom:0}.xp1ivzq{margin-left:0}.x78eudp{margin-right:0}.x1eqpo9x{margin-bottom:32px}.x1ps3c24{font-family:Menlo, monospace}.x55fj3t{padding:16px}.x1klcqci{overflow-x:auto}.x14jyeuf{background-color:var(--lightgray)}.x1i0a24p{max-width:100%}.xou3god{height:auto}.xnoz0g5{border:0}.xsivphk{height:2px}.xz4sy0x{background-color:var(--gray)}.xb7xxzh{width:100%}.xc6hipd{border-collapse:separate}.x18v5jv0{border-spacing:0}.x1hzqba3{border-color:var(--gray)}.x1sroim th{text-align:left}.xmv2pot th{vertical-align:bottom}.x1jxwcmx th{padding-top:4px}.xjtf2yd th{padding-bottom:4px}.x176f04c th{padding-right:4px}.xj13anj th{padding-left:0}.xs98ker th{border-color:inherit}.xnwb6v6 th{border-bottom-width:2px}.xdqab7s th{border-bottom-style:solid}.xot9qq td{text-align:left}.x1rg1gwh td{vertical-align:top}.x1n9rkyl td{padding-top:4px}.xkxdhq9 td{padding-bottom:4px}.x18adew8 td{padding-right:4px}.xk51pff td{padding-left:0}.xvl3sqf td{border-color:inherit}.xgftcjh td{border-bottom-width:1px}.xcmbwfw td{border-bottom-style:solid}</style><div style="padding:32px;margin-left:auto;margin-right:auto;max-width:768px" class="xxkzcb5 x1xuibxm xj5o3ko x84zijf x1lx8izr xoavy26 x3jh6gi"><div style="outline:none" tabindex="-1" role="group"><h1 id="hello-mdx-go">Hello mdx-go</h1><p>This is a test fixture for snapshot testing</p><pre><code class="language-jsx"><Box />␊ 21 | </code></pre><pre><code class="language-.jsx"><h1>Hello</h1>␊ 22 | </code></pre></div></div></div>␊ 23 | <script src='/main.js'></script>␊ 24 | </body>␊ 25 | </html>` 26 | -------------------------------------------------------------------------------- /test/snapshots/build.js.snap: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jxnblk/mdx-go/4287ee391aa2e6da923980da61b5a614cc390e46/test/snapshots/build.js.snap --------------------------------------------------------------------------------