How to use the react-docgen-typescript.withDefaultConfig function in react-docgen-typescript

To help you get started, we’ve selected a few react-docgen-typescript 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 jenkinsci / jenkins-design-language / styleguide.config.js View on Github external
),
                    'rsg-components/Editor': path.join(__dirname, '.styleguide/EditorLoader'),
                },
            },
        }
    ),
    // getExampleFilename(componentPath) {
    //     return componentPath.replace(/\.tsx?$/, '.md');
    // },
    require: [
        path.join(__dirname, 'css/index.scss'),
        path.join(__dirname, 'docs/assets/css/project.css'),
        path.join(__dirname, 'docs/assets/css/local.css'),
    ],
    styleguideDir: './docs/docs',
    propsParser: require('react-docgen-typescript').withDefaultConfig([]).parse,

    // STYLES:
    showSidebar: true,
    theme: {
        baseBackground: '#fdfdfc',
        link: '#274e75',
        linkHover: '#90a7bf',
        border: '#e0d2de',
        fontFamily: {
            base: [
                'HelveticaNeue-Light',
                '-apple-system',
                'BlinkMacSystemFont',
                '"Segoe UI"',
                '"Roboto"',
                '"Oxygen"',
github styleguidist / react-docgen-typescript / examples / react-styleguidist-example / styleguide.config.js View on Github external
const path = require('path');
const glob = require('glob');

module.exports = {
  title: 'React Style Guide Example',
  components: function () {
    return glob.sync(path.resolve(__dirname, 'components/**/*.tsx'))
      .filter(function (module) {
        return /\/[A-Z]\w*\.tsx$/.test(module);
      });
  },
  resolver: require('react-docgen').resolver.findAllComponentDefinitions,
  propsParser: require('react-docgen-typescript').withDefaultConfig({ propFilter: { skipPropsWithoutDoc: true } }).parse
};
github ZEISS / precise-ui / styleguide.config.js View on Github external
const rdts = require('react-docgen-typescript');
const { version } = require('./package');
const componentRoot = path.join(__dirname, 'docs/components');
const styleguideComponents = {};
const componentFiles = fs.readdirSync(componentRoot);
const env = process.env.NODE_ENV;

for (const componentFile of componentFiles) {
  const refName = componentFile.replace('.tsx', '');
  styleguideComponents[refName] = path.join(componentRoot, refName);
}

module.exports = {
  version,
  title: 'Precise UI',
  propsParser: rdts.withDefaultConfig().parse,
  assetsDir: path.resolve(__dirname, 'docs', 'assets'),
  skipComponentsWithoutExample: true,
  pagePerSection: true,
  compilerConfig: {
    transforms: {
      dangerousTaggedTemplateString: true,
    },
    objectAssign: 'Object.assign',
  },
  ribbon: {
    url: 'https://github.com/ZEISS/precise-ui',
    text: 'GitHub repository',
  },
  usageMode: 'expand',
  sections: [
    {
github vrk-kpa / suomifi-ui-components / styleguide.config.js View on Github external
}
  if (prop.parent == null) {
    return true;
  }
  return prop.parent.fileName.indexOf('node_modules/@types/react') < 0;
};

module.exports = {
  title: 'Suomifi-ui-components',
  components: 'src/core/**/[A-Z]*.tsx',
  ignore: ['**/*basestyles.tsx', '**/*baseStyles.tsx', '**/*test.tsx'],
  webpackConfig: require('./webpack.config.js'),
  require: [path.join(__dirname, '.styleguidist/styleguidist.require.js')],
  assetsDir: path.join(__dirname, '.styleguidist/assets'),
  resolver: require('react-docgen').resolver.findAllComponentDefinitions,
  propsParser: require('react-docgen-typescript').withDefaultConfig({
    propFilter,
  }).parse,
  moduleAliases: {
    'suomifi-ui-components': path.resolve(__dirname, 'src'),
    'rsg-components/ComponentsList/ComponentsListRenderer': path.resolve(
      __dirname,
      'node_modules/react-styleguidist/lib/client/rsg-components/ComponentsList/ComponentsListRenderer',
    ),
  },
  exampleMode: 'expand',
  usageMode: 'expand',
  pagePerSection: true,
  skipComponentsWithoutExample: true,
  getExampleFilename: componentPath => componentPath.replace(/\.tsx?$/, '.md'),
  template: {
    head: {
github navikt / nav-frontend-moduler / gulpfile.js View on Github external
const ts = require('gulp-typescript');
const plumber = require('gulp-plumber');
const gutil = require('gulp-util');
const path = require('path');
const chalk = require('chalk');
const cssfont64 = require('gulp-cssfont64-formatter');
const merge = require('merge2');
const configureSvgIcon = require('react-svg-icon-generator-fork').default;

const jsScripts = './packages/node_modules/*/src/**/*.js';
const tsScripts = './packages/node_modules/*/src/**/*.ts*';
const fonts = './packages/node_modules/*/assets/**/*.woff';
const dest = 'packages/node_modules';
const tsProject = ts.createProject('tsconfig.json');

const tsDocgen = require('react-docgen-typescript').withDefaultConfig({
    propFilter: { skipPropsWithoutDoc: true }
});

const insert = require('gulp-insert');
const fs = require('fs');

let srcEx;
let assetsEx;
let libFragment;
let srcFragment;

if (path.win32 === path) {
    srcEx = /(packages\\node_modules\\[^/]+)\\src\\/;
    assetsEx = /(packages\\node_modules\\[^/]+)\\assets\\/;
    libFragment = '$1\\lib\\';
    srcFragment = '$1\\src\\';
github lightspeed / flame / packages / flame / scripts / docgen.js View on Github external
const styledSystemFileName = 'node_modules/@types/styled-system';
const glob = require('glob');
const fs = require('fs-extra');

const docgen = require('react-docgen-typescript').withDefaultConfig({
  propFilter: prop => {
    if (prop.parent) {
      if (prop.parent.fileName.includes(styledSystemFileName)) {
        return true;
      }

      return !prop.parent.fileName.includes('node_modules');
    }

    return true;
  },
});

const getStyledSystemDocsUrl = parentPropName => {
  switch (parentPropName) {
    case 'PositionProps':
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',
    _: 'lodash',
github Altinn / altinn-studio / src / react-apps / applications / shared / styleguide.config.js View on Github external
const path = require('path');
module.exports = {
  components: 'src/components/**/*.tsx',
  webpackConfig: require('./styleguide.webpack.config'),
  propsParser: require('react-docgen-typescript').withDefaultConfig({propFilter: {skipPropsWithName: 'classes'}}).parse,
  styles: {
    StyleGuide: {
      '@global html': {
        fontSize: '10px',
      },
      '@global body': {
        fontSize: '16px',
      },
    },
  },
  template: {
    head: {
      links: [
        {
          rel: 'stylesheet',
          href:
github skbkontur / retail-ui / styleguide.config.js View on Github external
const fs = require('fs');
const path = require('path');
const parseTsComponent = require('react-docgen-typescript').withDefaultConfig()
  .parse;
const parseJsComponent = require('react-docgen').parse;

function getComponentList() {
  const dirPath = path.resolve(__dirname, 'components');
  return fs
    .readdirSync(dirPath)
    .map(x => [
      path.join(dirPath, x, `${x}.tsx`),
      path.join(dirPath, x, `${x}.js`)
    ])
    .map(([ts, js]) => (fs.existsSync(ts) ? ts : fs.existsSync(js) ? js : null))
    .filter(Boolean);
}

module.exports = {

react-docgen-typescript

[![Build Status](https://github.com/styleguidist/react-docgen-typescript/actions/workflows/nodejs.yml/badge.svg)](https://github.com/styleguidist/react-docgen-typescript/actions/workflows/nodejs.yml)

MIT
Latest version published 3 years ago

Package Health Score

73 / 100
Full package analysis

Similar packages