How to use the react-docgen.resolver function in react-docgen

To help you get started, we’ve selected a few react-docgen examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github mlaursen / react-md / docs_old / scripts / docgen.js View on Github external
if (regex) {
      replace({
        regex,
        replacement: '',
        paths: [temp],
        silent: true,
      });
    }
  }

  const rawFile = fs.readFileSync(path.resolve(reactMD, sourceFolder, temp || file + '.js'));
  try {
    // For some reason there are 2 entries in the navigation drawer
    const docgenIndex = file === 'NavigationDrawer' ? 1 : 0;
    const generated = docgen.parse(rawFile, docgen.resolver.findAllComponentDefinitions)[docgenIndex];
    generated.source = `src/js/${sourceFolder}/${file}.js`;
    generated.component = component.replace(/(?=Focus)Container/, '');
    generated.methods = generated.methods.filter(method => method.name.charAt(0) !== '_');
    Object.keys(generated.props).forEach(key => {
      if (key.charAt(0) === '_' || generated.props[key].description.match(/@access private/)) {
        delete generated.props[key];
      }
    });


    docgens[folder] = docgens[folder] || {
      name: generated.component.replace(/((?!Snackbar)Container|Group)/, ''),
      docgens: [],
    };

    docgens[folder].docgens.push(generated);
github reach / reach-ui / website / gatsby-config.js View on Github external
name: `docs`,
        path: `${__dirname}/../packages`,
        ignore: ["examples/**", "es/**", "umd/**"]
      }
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: `${__dirname}/src/images`
      }
    },
    {
      resolve: `gatsby-transformer-react-docgen`,
      options: {
        resolver: require("react-docgen").resolver.findAllComponentDefinitions,
        babelrcRoots: ["../*"]
      }
    },
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    {
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: "reach-ui",
        short_name: "reach-ui",
        start_url: "/",
        background_color: "#1159a6",
        theme_color: "#1159a6",
        display: "minimal-ui",
        icon: "src/images/reach-icon.png" // This path is relative to the root of the site.
      }
github Azure / iot-ux-fluent-controls / packages / fluent-controls / styleguide.config.js View on Github external
const path = require('path');
const glob = require('glob');

module.exports = {
  title: 'Microsoft Method UI Framework Documentation',
  components: function () {
    return glob.sync(path.resolve(__dirname, 'src/components/**/*.tsx'))
      .filter(function (module) {
        return /\/[A-Z]\w*\.tsx$/.test(module);
      });
  },
  resolver: require('react-docgen').resolver.findAllComponentDefinitions,

  propsParser: require('react-docgen-typescript').parse,

  assetsDir: './static/',
  webpackConfig: require('./webpack.styleguide.js'),

  styleguideDir: './static/docs/',

  require: [
    path.join(__dirname, './static/css/icons.css'),
    path.join(__dirname, './static/css/examples.css'),
  ]
};
github csvenke / react-semantic-render / styleguide.config.js View on Github external
const docgen = require('react-docgen');
const docgenTypescript = require('react-docgen-typescript');
const pkg = require('./package.json');

const typescriptConfig = {
  resolver: docgen.resolver.findAllComponentDefinitions,
  propsParser: docgenTypescript.withDefaultConfig({
    propFilter: { skipPropsWithoutDoc: true, skipPropsWithName: true },
  }).parse,
};

module.exports = {
  title: pkg.name,
  version: pkg.version,
  exampleMode: 'expand',
  usageMode: 'expand',
  pagePerSection: true,
  skipComponentsWithoutExample: true,
  styleguideDir: 'docs',
  previewDelay: 1000,
  context: {
    faker: 'faker',
github facebook / react-native / website / server / docgenHelpers.js View on Github external
function findExportedOrFirst(node, recast) {
  return docgen.resolver.findExportedComponentDefinition(node, recast) ||
    docgen.resolver.findAllComponentDefinitions(node, recast)[0];
}
github alibaba / ice / tools / props-schema-generator / lib / apiExtractor.js View on Github external
function extractSource(source, options = {}) {
  const { filePath, componentName } = options;
  let componentInfo;
  try {
    componentInfo = reactDocs.parse(
      source,
      reactDocs.resolver.findExportedComponentDefinition,
      reactDocs.defaultHandlers
    );
  } catch (e) {
    if (e.message !== 'No suitable component definition found.') {
      e.message = `${e.message}\n[${filePath}]`;
      throw e;
    }
  }

  if (componentInfo) {
    return filter(componentInfo, options);
  }
  return null;
}
github doczjs / docz / core / docz-core / src / utils / docgen.ts View on Github external
const jsParser = async (filepath: string, config: Config) => {
  const resolver =
    config.docgenConfig.resolver ||
    reactDocgen.resolver.findAllExportedComponentDefinitions

  const handlers = reactDocgen.defaultHandlers.concat([
    externalProptypesHandler(filepath),
    actualNameHandler,
  ])

  try {
    const code = fs.readFileSync(filepath, 'utf-8')
    const data = reactDocgen.parse(code, resolver, handlers)
    return { [filepath]: data }
  } catch (err) {
    if (config.debug) throwError(err)
    return null
  }
}
github zendeskgarden / react-components / packages / datepickers / styleguide.config.js View on Github external
const reactDocgen = require('react-docgen');

/**
 * Package specific styleguide configuration
 * https://github.com/styleguidist/react-styleguidist/blob/master/docs/Configuration.md
 */
module.exports = {
  propsParser: reactDocgenTypescript.withCustomConfig(
    path.resolve(__dirname, '../../tsconfig.json'),
    {
      propFilter: props => {
        return props.parent.fileName.indexOf('node_modules') === -1;
      }
    }
  ).parse,
  resolver: reactDocgen.resolver.findAllComponentDefinitions,
  sections: [
    {
      name: '',
      content: '../../packages/datepickers/README.md'
    },
    {
      name: 'Examples',
      content: '../../packages/datepickers/examples/examples.md',
      sections: [
        {
          name: 'Default usage',
          content: '../../packages/datepickers/examples/default-usage.md'
        },
        {
          name: 'Custom date formats',
          content: '../../packages/datepickers/examples/custom-formats.md'
github storybookjs / babel-plugin-react-docgen / src / index.js View on Github external
function injectReactDocgenInfo(path, state, code, t) {
  const program = path.scope.getProgramParent().path;

  let docgenResults = [];
  try {
    let resolver = ReactDocgen.resolver.findAllExportedComponentDefinitions;
    if (state.opts.resolver) {
      resolver = ReactDocgen.resolver[state.opts.resolver];
    }

    let customHandlers = []
    if (state.opts.handlers) {
      state.opts.handlers.forEach(handler => {
        customHandlers.push(require(handler))
      })
    }

    const handlers = [...defaultHandlers, ...customHandlers, actualNameHandler]
    docgenResults = ReactDocgen.parse(code, resolver, handlers);

    if (state.opts.removeMethods) {
      docgenResults.forEach(function(docgenResult) {
github LastCallMedia / Mannequin / ui / styleguide.config.js View on Github external
var path = require('path');

module.exports = {
  styleguideComponents: {
    Wrapper: path.join(__dirname + '/src/StyleGuideWrapper')
  },
  resolver: require('react-docgen').resolver.findAllComponentDefinitions
};