https://github.com/transitive-bullshit/react-docgen-props-table

Beautiful Props Table for React Docgen.
https://github.com/transitive-bullshit/react-docgen-props-table

react react-component react-docgen

Last synced: 14 days ago
JSON representation

Beautiful Props Table for React Docgen.

• Host: GitHub
• URL: https://github.com/transitive-bullshit/react-docgen-props-table
• Owner: transitive-bullshit
• Created: 2019-04-02T14:21:33.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2022-12-09T18:06:25.000Z (almost 2 years ago)
• Last Synced: 2024-10-20T01:09:35.667Z (26 days ago)
• Topics: react, react-component, react-docgen
• Language: JavaScript
• Homepage: https://transitive-bullshit.github.io/react-docgen-props-table/
• Size: 1.79 MB
• Stars: 17
• Watchers: 4
• Forks: 3
• Open Issues: 37
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

README

        
# react-docgen-props-table ([demo](https://transitive-bullshit.github.io/react-docgen-props-table/))

> Beautiful Props Table for React Docgen.

[![NPM](https://img.shields.io/npm/v/react-docgen-props-table.svg)](https://www.npmjs.com/package/react-docgen-props-table) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)



  



This is a standalone version of the (now deprecated) `PropsTable` component from [Docz](https://github.com/pedronauck/docz).

## Install

```bash

npm install --save react-docgen-props-table

```

## Usage

```jsx

import React, { Component } from 'react'

import PropsTable from 'react-docgen-props-table'

// this was generated via react-docgen

const docgenInfo = {

  "description": "General component description.",

  "displayName": "MyComponent",

  "methods": [],

  "props": {

    "foo": {

      "type": {

        "name": "number"

      },

      "required": true,

      "description": "Description foo."

    },

    "bar": {

      "type": {

        "name": "string"

      },

      "required": false,

      "description": "Description bar.\n\n- markdown list-item 1\n- markdown list-item 2",

      "defaultValue": {

        "value": "'bar'",

        "computed": false

      }

    },

    "baz": {

      "type": {

        "name": "bool"

      },

      "required": false,

      "description": "Description baz."

    }

  }

}

class Example extends Component {

  render () {

    return (

      

    )

  }

}

```

## Examples

Check out the [demo](https://transitive-bullshit.github.io/react-docgen-props-table/) for live examples.

## License

Credit goes to [Pedro Nauck](https://github.com/pedronauck) and [docz](https://github.com/pedronauck/docz) for the initial implementation.

MIT © [transitive-bullshit](https://transitivebullsh.it)

Support my OSS work by following me on twitter