styleguide.config.js

/* eslint import/no-extraneous-dependencies: 0 */
const path = require('path')
const { createConfig, babel, css, devServer } = require('webpack-blocks')

// https://react-styleguidist.js.org/docs/configuration.html
module.exports = {
  title: 'react-dropzone',
  styleguideDir: path.join(__dirname, 'styleguide'),
  template: {
    favicon: 'https://github.com/react-dropzone/react-dropzone/raw/master/logo/logo.png'
  },
  webpackConfig: createConfig([babel(), css(), devServer({
    disableHostCheck: true,
    host: '0.0.0.0',
  })]),
  exampleMode: 'expand',
  usageMode: 'expand',
  showSidebar: true,
  serverPort: 8080,
  moduleAliases: {
    'react-dropzone': path.resolve(__dirname, './src'),
    'doka': path.resolve(__dirname, './vendor/doka/doka.esm.min.js')
  },
  require: [
    path.join(__dirname, 'examples/theme.css'),
    path.join(__dirname, 'vendor/doka/doka.min.css'),
  ],
  sections: [
    {
      name: '',
      content: 'README.md'
    },
    // TODO: Figure out how to document the hook
    // See https://github.com/reactjs/react-docgen/issues/332
    {
      name: 'Components',
      components: './src/index.js'
    },
    {
      name: 'Examples',
      sections: [
        {
          name: 'Basic example',
          content: 'examples/basic/README.md'
        },
        {
          name: 'Event Propagation',
          content: 'examples/events/README.md'
        },
        {
          name: 'Styling Dropzone',
          content: 'examples/styling/README.md'
        },
        {
          name: 'Accepting specific file types',
          content: 'examples/accept/README.md'
        },
        {
          name: 'Accepting specific number of files',
          content: 'examples/maxFiles/README.md'
        },
        {
          name: 'Custom validation',
          content: 'examples/validator/README.md'
        },
        {
          name: 'Opening File Dialog Programmatically',
          content: 'examples/file-dialog/README.md'
        },
        {
          name: 'Previews',
          content: 'examples/previews/README.md'
        },
        {
          name: 'Class Components',
          content: 'examples/class-component/README.md'
        },
        {
          name: 'Extending Dropzone',
          content: 'examples/plugins/README.md'
        }
      ]
    },
    {
      name: 'Integrations',
      sections: [
        {
          name: 'Doka',
          content: 'examples/doka/README.md'
        }
      ]
    }
  ]
}