Primer CSS{meta.title ? ` / ${meta.title}` : null}

import React from 'react' import App, {Container} from 'next/app' import {MDXProvider} from '@mdx-js/tag' import Head from 'next/head' import Octicon, {Pencil} from '@githubprimer/octicons-react' import {BaseStyles, Link, Text, BorderBox, Box, Flex, theme} from '@primer/components' import {PackageHeader} from '../docs/components' import {Header, MarkdownHeading, JumpNav, SideNav} from '@primer/blueprints' import {NavList} from '@primer/blueprints/next-components' import getComponents from '../docs/markdown' import documents from '../searchIndex' import {config, requirePage, rootPage} from '../docs/utils' import {CONTENT_MAX_WIDTH} from '../docs/constants' import {repository} from '../package.json' import '../src/index.scss' const DocLink = props => const editLinkBase = `${repository}/edit/master/pages` export default class MyApp extends App { static async getInitialProps({Component, ctx}) { let page = {} if (Component.getInitialProps) { page = await Component.getInitialProps(ctx) } return {page} } render() { // strip the trailing slash const pathname = this.props.router.pathname.replace(/\/$/, '') const {Component, page} = this.props const node = rootPage.first(node => node.path === pathname) || {} const {file, meta = {}} = node || {} const isIndex = file.includes('index') const components = getComponents(node) const Hero = file ? requirePage(file).Hero : null return ( Primer CSS{meta.title ? ` / ${meta.title}` : null}

{Hero ? : null}

{!meta.hero && meta.title ? {meta.title} : null} {config.production ? null : (

Metadata

{JSON.stringify(meta, null, 2)}

)} {pathname && ( Edit this page {' '} on GitHub )}

) } }