tesseract-design
/
react-common


			
				
					
						
						
							
							import * as React from 'react'
import Head from 'next/head'
import unified from 'unified'
import parse from 'remark-parse'
import remark2react from 'remark-react'
import docgen from '../../docgen.json'

const Header = ({ of: ofAttr }) => {
  const docs = docgen.find(d => d.displayName === ofAttr)

  if (!docs) {
    return null
  }

  return (
    <React.Fragment>
      <Head>
        <title>
          {docs.displayName} | React Common
        </title>
      </Head>
      <h1>{docs.displayName}</h1>
      <p>
        {
          unified()
            .use(parse)
            .use(remark2react)
            .processSync(docs.description).result
        }
      </p>
    </React.Fragment>
  )
}

export default Header