![\"A](\"https://rocketseat-cdn.s3-sa-east-1.amazonaws.com/theme-docs.svg\")
\n\n\n\n\n \n
\n Out of the box Gatsby Theme for creating documentation websites easily and quickly.\n
\n\n\n ![\"PRs](\"https://img.shields.io/badge/PRs-welcome-%238257E6.svg\"){kind=icon}
\n\n ![\"License\"](\"https://img.shields.io/badge/license-MIT-%238257E6\"){kind=icon}
![\"Follow](\"https://img.shields.io/twitter/follow/jpedroschmitz.svg?label=Follow%20@jpedroschmitz\")
\n \n
\n Features •\n Getting started •\n Docs •\n Contributing •\n License\n
\n\n## 🚀 Features\n\n- 📝 MDX for docs;\n- 🛣 Yaml-based sidebar navigation;\n- 📱 Responsive and mobile friendly;\n- 🖥 Code highlighting with [prism-react-renderer](https://github.com/FormidableLabs/prism-react-renderer) and [react-live](https://github.com/FormidableLabs/react-live) support;\n- 🥇 SEO (Sitemap, schema.org data, Open Graph and Twitter tags).\n- 📈 Google Analytics support;\n- 📄 Custom docs schema;\n- 🖱 Table of Contents;\n- ⚡️ Offline Support & WebApp Manifest;\n- and much more 🔥\n\n## ⚡️ Getting started\n\n1. Create the website.\n\n ```sh\n npx gatsby new rocketdocs https://github.com/jpedroschmitz/gatsby-starter-rocketdocs\n ```\n\n2. Start developing.\n\n ```sh\n cd rocketdocs\n gatsby develop\n ```\n\n3. Are you ready for launch? 🚀\n\n Your site is now running at `http://localhost:8000`\n\n## 📄 Docs\n\nLooking for docs? Check our live demo and documentation [website](https://rocketdocs.netlify.app).\n\n## ✨ Contributing\n\nThanks for being interested in contributing! We’re so glad you want to help! Please take a little bit of your time and look at our [contributing guidelines](https://github.com/jpedroschmitz/rocketdocs/blob/main/.github/CONTRIBUTING.md) and our\n[code of conduct](https://github.com/jpedroschmitz/rocketdocs/blob/main/.github/CODE_OF_CONDUCT.md)! All type of contributions are welcome, such as bug fixes, issues or feature requests.\n\n## 🗺 Changelog\n\nAll notable changes to this project will be documented on the [CHANGELOG](https://github.com/jpedroschmitz/rocketdocs/blob/main/%40rocketseat/gatsby-theme-docs/CHANGELOG.md) file.\n\n## 📝 License\n\nLicensed under the [MIT License](https://github.com/jpedroschmitz/rocketdocs/blob/main/%40rocketseat/gatsby-theme-docs/LICENSE).\n\n---\n\nMade with 💜 by João Pedro\n" }, { "path": "@rocketseat/gatsby-theme-docs/gatsby/wrapPageElement.js", "content": "/* eslint-disable */\nimport React from 'react';\nimport { MDXProvider } from '@mdx-js/react';\n\nimport Code from '../src/components/Code';\n\nconst preToCodeBlock = (preProps) => {\n if (\n // children is code element\n preProps.children &&\n // if children is actually a\n preProps.children.type &&\n preProps.children.type.name &&\n preProps.children.type.name === 'code'\n ) {\n // we have a situation\n const {\n children: codeString,\n className = '',\n ...props\n } = preProps.children.props;\n\n const match = className.match(/language-([\\0-\\uFFFF]*)/);\n\n return {\n codeString: codeString.trim(),\n className,\n language: match != null ? match[1] : '',\n ...props,\n };\n }\n return undefined;\n};\n\nconst components = {\n pre: (preProps) => {\n const props = preToCodeBlock(preProps);\n\n if (props) {\n return {children}
\n \n ),\n};\n\nexport function wrapPageElement({ element }) {\n return {element} ;\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby/wrapRootElement.js",
"content": "/* eslint-disable */\nimport React from 'react';\nimport { ThemeProvider } from '@emotion/react';\n\nimport defaultTheme from '../src/styles/theme';\nimport GlobalStyle from '../src/styles/global';\n\nexport function wrapRootElement({ element }) {\n return (\n \n <>\n \n );\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby-browser.js",
"content": "export { wrapRootElement } from './gatsby/wrapRootElement';\nexport { wrapPageElement } from './gatsby/wrapPageElement';\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby-config.js",
"content": "const withDefault = require('@rocketseat/gatsby-theme-docs-core/util/with-default');\n\nmodule.exports = (options) => {\n const themeOptions = withDefault(options);\n\n return {\n siteMetadata: {\n defaultTitle: `Rocket Docs by João Pedro Schmitz`,\n siteTitle: `Rocket Docs`,\n siteTitleShort: `Rocket Docs`,\n siteDescription: `Easy to use Gatsby Theme to create documentation websites`,\n siteUrl: `https://rocketdocs.netlify.app`,\n siteAuthor: `@jpedroschmitz`,\n siteImage: `/banner.png`,\n siteLanguage: `en`,\n basePath: themeOptions.basePath,\n docsPath: themeOptions.docsPath,\n },\n plugins: [\n {\n resolve: `gatsby-source-filesystem`,\n options: {\n name: `homepage`,\n path: themeOptions.homePath || `${__dirname}/src/text`,\n },\n },\n {\n resolve: `@rocketseat/gatsby-theme-docs-core`,\n options: themeOptions,\n },\n `gatsby-plugin-catch-links`,\n `gatsby-plugin-emotion`,\n `gatsby-plugin-react-helmet`,\n ].filter(Boolean),\n };\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby-ssr.js",
"content": "export { wrapRootElement } from './gatsby/wrapRootElement';\nexport { wrapPageElement } from './gatsby/wrapPageElement';\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/index.js",
"content": "// beep\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/package.json",
"content": "{\n \"name\": \"@rocketseat/gatsby-theme-docs\",\n \"version\": \"4.0.1\",\n \"main\": \"index.js\",\n \"description\": \"Out of the box Gatsby Theme for creating documentation websites easily and quickly.\",\n \"author\": \"João Pedro Schmitz (@jpedroschmitz)\",\n \"license\": \"MIT\",\n \"publishConfig\": {\n \"access\": \"public\"\n },\n \"keywords\": [\n \"documentation\",\n \"open source\",\n \"gatsby\",\n \"gatsby-plugin\",\n \"gatsby-theme\",\n \"react\",\n \"docs\",\n \"mdx\"\n ],\n \"homepage\": \"https://github.com/jpedroschmitz/rocketdocs/tree/main/@rocketseat/gatsby-theme-docs#readme\",\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/jpedroschmitz/rocketdocs.git\",\n \"directory\": \"@rocketseat/gatsby-theme-docs\"\n },\n \"bugs\": {\n \"url\": \"https://github.com/jpedroschmitz/rocketdocs/issues\"\n },\n \"dependencies\": {\n \"@emotion/react\": \"^11.11.0\",\n \"@emotion/styled\": \"^11.11.0\",\n \"@mdx-js/react\": \"^2.3.0\",\n \"@rocketseat/gatsby-theme-docs-core\": \"^4.0.0\",\n \"gatsby-plugin-catch-links\": \"^5.9.0\",\n \"gatsby-plugin-emotion\": \"^8.9.0\",\n \"gatsby-plugin-mdx\": \"^5.9.0\",\n \"gatsby-plugin-react-helmet\": \"^6.9.0\",\n \"mdx-utils\": \"^0.2.0\",\n \"parse-numeric-range\": \"^1.3.0\",\n \"polished\": \"^4.2.2\",\n \"prism-react-renderer\": \"^1.2.1\",\n \"prop-types\": \"^15.8.1\",\n \"react-helmet\": \"^6.1.0\",\n \"react-icons\": \"^4.8.0\",\n \"react-live\": \"^4.0.1\",\n \"react-use\": \"^17.4.0\",\n \"url-join\": \"^4.0.1\"\n },\n \"peerDependencies\": {\n \"gatsby\": \"^5.0.0\",\n \"react\": \"^18.0.0\",\n \"react-dom\": \"^18.0.0\"\n }\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Docs.js",
"content": "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport Docs from '../../../components/Docs';\n\nexport default function Docspage({ data: { mdx }, pageContext, children }) {\n return (\n \n {children}\n \n );\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Homepage.js",
"content": "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport Home from '../../../components/Homepage';\n\nexport default function Homepage({ children }) {\n return {children} ;\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Code/LiveCodeScope.js",
"content": "import { css, jsx } from '@emotion/react';\n\nexport default {\n css,\n jsx,\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Code/index.js",
"content": "import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport Highlight, { defaultProps } from 'prism-react-renderer';\nimport rangeParser from 'parse-numeric-range';\nimport theme from 'prism-react-renderer/themes/dracula';\nimport { LiveProvider, LiveEditor } from 'react-live';\n\nimport { copyToClipboard } from '../../util/copy-to-clipboard';\nimport scope from './LiveCodeScope';\nimport {\n CopyCode,\n LineNo,\n Pre,\n PreHeader,\n LiveWrapper,\n LivePreview,\n LiveError,\n StyledEditor,\n} from './styles';\n\nconst calculateLinesToHighlight = (meta) => {\n const RE = /{([\\d,-]+)}/;\n\n if (RE.test(meta)) {\n const strlineNumbers = RE.exec(meta)[1];\n const lineNumbers = rangeParser(strlineNumbers);\n return (index) => lineNumbers.includes(index + 1);\n }\n\n return () => false;\n};\n\nexport default function CodeHighlight({\n codeString,\n className,\n live,\n highlight,\n title,\n lineNumbers,\n}) {\n const [copied, setCopied] = useState(false);\n const language = className && className.replace(/language-/, '');\n\n const shouldHighlightLine = calculateLinesToHighlight(highlight);\n\n const handleClick = () => {\n setCopied(true);\n copyToClipboard(codeString);\n\n setTimeout(() => {\n setCopied(false);\n }, 4000);\n };\n\n if (live) {\n return (\n `/** @jsx mdx */${code}`}\n scope={scope}\n >\n \n \n \n {copied ? 'Copied!' : 'Copy'}\n \n\n \n\n \n \n );\n }\n\n return (\n <>\n {title && {title} }\n \n \n {({\n className: blockClassName,\n style,\n tokens,\n getLineProps,\n getTokenProps,\n }) => (\n \n \n {copied ? 'Copied!' : 'Copy'}\n \n \n {tokens.map((line, index) => {\n const lineProps = getLineProps({ line, key: index });\n\n if (shouldHighlightLine(index)) {\n lineProps.className = `${lineProps.className} highlight-line`;\n }\n\n return (\n \n {lineNumbers && {index + 1} }\n {line.map((token, key) => (\n \n ))}\n \n );\n })}\n \n \n )}\n \n \n \n );\n}\n\nCodeHighlight.propTypes = {\n codeString: PropTypes.string.isRequired,\n className: PropTypes.string.isRequired,\n highlight: PropTypes.string,\n live: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n title: PropTypes.string,\n lineNumbers: PropTypes.string,\n};\n\nCodeHighlight.defaultProps = {\n live: false,\n title: null,\n lineNumbers: null,\n highlight: null,\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Code/styles.js",
"content": "import styled from '@emotion/styled';\nimport { darken } from 'polished';\nimport {\n LiveError as AuxLiveError,\n LivePreview as AuxLivePreview,\n} from 'react-live';\n\nexport const Pre = styled.pre`\n text-align: left;\n padding: ${({ hasLanguage }) => (hasLanguage ? `2rem` : `1rem`)} 1rem 1rem\n 1rem;\n overflow: auto;\n white-space: pre;\n word-spacing: normal;\n word-break: normal;\n border-radius: ${({ hasTitle }) => (hasTitle ? '0 0 5px 5px' : '5px')};\n -webkit-overflow-scrolling: touch;\n overflow-wrap: break-word;\n box-shadow: 1px 1px 20px rgba(20, 20, 20, 0.27);\n\n code {\n float: left;\n min-width: 100%;\n padding-right: 1rem;\n }\n\n .token-line {\n line-height: 22px;\n font-size: 14px;\n min-width: 100%;\n }\n\n .highlight-line {\n background-color: #44475a;\n margin-left: -1rem;\n margin-right: -2rem;\n padding: 0 0.75rem;\n border-left: 4px solid ${({ theme }) => theme.colors.primary};\n }\n`;\n\nexport const LiveWrapper = styled.div`\n border-radius: 5px;\n box-shadow: 1px 1px 20px rgba(20, 20, 20, 0.27);\n overflow: hidden;\n margin-bottom: 32px;\n`;\n\nexport const StyledEditor = styled.div`\n font-family: Hack, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',\n 'Courier New', monospace;\n font-variant: no-common-ligatures no-discretionary-ligatures\n no-historical-ligatures no-contextual;\n overflow: auto;\n position: relative;\n\n textarea,\n pre {\n font-size: 14px !important;\n line-height: 22px !important;\n padding: 1rem !important;\n }\n\n * > textarea:focus {\n outline: none;\n }\n\n .token {\n font-style: normal !important;\n }\n`;\n\nexport const LivePreview = styled(AuxLivePreview)`\n position: relative;\n padding: 0.5rem;\n background: white;\n color: black;\n height: auto;\n overflow: hidden;\n`;\n\nexport const LiveError = styled(AuxLiveError)`\n display: block;\n color: rgb(248, 248, 242);\n white-space: pre-wrap;\n text-align: left;\n font-size: 14px;\n font-family: Hack, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',\n 'Courier New', monospace;\n font-variant: no-common-ligatures no-discretionary-ligatures\n no-historical-ligatures no-contextual;\n padding: 1rem;\n background: rgb(255, 85, 85);\n`;\n\nexport const PreHeader = styled.div`\n background-color: ${darken('0.05', '#282a36')};\n color: rgb(248, 248, 242, 0.75);\n font-size: 12px;\n line-height: 18px;\n margin-top: 0.5rem;\n padding: 0.8rem 1rem;\n border-radius: 5px 5px 0 0;\n`;\n\nexport const LineNo = styled.span`\n display: inline-block;\n width: 2rem;\n user-select: none;\n opacity: 0.3;\n`;\n\nexport const CopyCode = styled.button`\n position: absolute;\n top: 0;\n right: 0;\n z-index: 1;\n border-radius: ${({ hasTitle }) => (!hasTitle ? '0 5px 0 5px' : '0 0 0 5px')};\n padding: 0.25rem 0.6rem;\n border: none;\n cursor: pointer;\n background: #44475a;\n color: rgb(248, 248, 242);\n transition: all 200ms ease;\n font-size: 12px;\n\n :disabled {\n cursor: not-allowed;\n }\n\n :not(:disabled) {\n :hover,\n :focus {\n background: ${({ theme }) => theme.colors.primary};\n }\n }\n`;\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/EditGithub.js",
"content": "/* @jsx jsx */\nimport { useTheme, jsx, css } from '@emotion/react';\nimport PropTypes from 'prop-types';\nimport { MdEdit } from 'react-icons/md';\n\nexport default function EditGithub({ repositoryEditUrl, repositoryProvider }) {\n const theme = useTheme();\n\n if (repositoryEditUrl) {\n return (\n \n \n {prev && (\n \n \n Prev
\n {prev.label}
\n \n \n \n )}\n {next && (\n \n \n \n Next
\n {next.label}
\n \n \n )}\n \n );\n}\n\nDocs.propTypes = {\n prev: PropTypes.shape({\n label: PropTypes.string,\n link: PropTypes.string,\n }),\n next: PropTypes.shape({\n label: PropTypes.string,\n link: PropTypes.string,\n }),\n};\n\nDocs.defaultProps = {\n prev: null,\n next: null,\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/PostNav/styles.js",
"content": "import styled from '@emotion/styled';\n\nexport const Container = styled.section`\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n padding: 48px 0;\n width: 100%;\n\n @media (max-width: 780px) {\n flex-direction: column;\n }\n`;\n\nexport const Post = styled.div`\n transition: all 200ms;\n ${({ isLeft }) => !isLeft && 'margin-left: auto;'}\n\n a {\n display: flex;\n text-decoration: none;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n\n svg {\n width: 25px;\n height: 25px;\n color: ${({ theme }) => theme.colors.text};\n\n ${({ isLeft }) => (isLeft ? 'margin-right: 16px' : 'margin-left: 16px')};\n }\n\n p {\n letter-spacing: 0.142em;\n text-transform: uppercase;\n font-size: 12px;\n margin: 0;\n color: ${({ theme }) => theme.colors.text};\n }\n\n h3 {\n color: ${({ theme }) => theme.colors.text};\n border: none;\n margin: 0;\n padding: 0;\n font-size: 16px;\n }\n }\n\n &:hover {\n opacity: 0.8;\n\n a svg {\n opacity: 0.8;\n }\n }\n\n @media (max-width: 780px) {\n width: 100%;\n ${({ isLeft }) => isLeft && 'margin-bottom: 16px'};\n\n a {\n justify-content: ${({ isLeft }) => (isLeft ? 'flex-start' : 'flex-end')};\n }\n }\n`;\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/TOC/index.js",
"content": "import React, { useState, useEffect, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { useTheme } from '@emotion/react';\nimport useWindowScroll from 'react-use/lib/useWindowScroll';\nimport useWindowSize from 'react-use/lib/useWindowSize';\n\nimport slug from '../../../util/slug';\n\nimport { Wrapper, Container } from './styles';\n\nexport default function TableOfContents({ headings, disableTOC, contentRef }) {\n const { y } = useWindowScroll();\n const theme = useTheme();\n const { width, height } = useWindowSize();\n const [offsets, setOffsets] = useState([]);\n\n const isMobile = width <= 1200;\n\n useEffect(() => {\n if (!isMobile || disableTOC) {\n const allHeadings = contentRef.current?.querySelectorAll(`h2, h3`);\n\n setOffsets(\n allHeadings &&\n Array.from(allHeadings)\n .map((heading) => {\n const anchor = heading.querySelector(`a`);\n if (!anchor) return {};\n\n return {\n id: heading.id,\n offset: heading.offsetTop + anchor.offsetTop,\n };\n })\n .filter(Boolean),\n );\n }\n }, [width, height, contentRef, isMobile, disableTOC]);\n\n const activeHeading = useMemo(() => {\n if (!isMobile || disableTOC) {\n const windowOffset = height / 2;\n const scrollTop = y + windowOffset;\n\n if (offsets) {\n for (let i = offsets.length - 1; i >= 0; i -= 1) {\n const { id, offset } = offsets[i];\n if (scrollTop >= offset) {\n return id;\n }\n }\n }\n }\n\n return null;\n }, [offsets, height, y, isMobile, disableTOC]);\n\n if (!disableTOC) {\n return (\n \n \n On this page
\n \n \n \n );\n }\n\n return \n {children}\n \n \n {siteTitle}
\n \n );\n}\n\nHeader.propTypes = {\n handleMenuOpen: PropTypes.func.isRequired,\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Homepage.js",
"content": "import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Layout from './Layout';\nimport SEO from './SEO';\n\nexport default function Home({ children }) {\n return (\n \n \n );\n}\n\nHome.propTypes = {\n children: PropTypes.node.isRequired,\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Layout/index.js",
"content": "/* @jsx jsx */\nimport { useState, useRef, Fragment } from 'react';\nimport { jsx, css } from '@emotion/react';\nimport PropTypes from 'prop-types';\n\nimport TableOfContents from '../Docs/TOC';\nimport Sidebar from '../Sidebar';\nimport Header from '../Header';\nimport Overlay from '../Overlay';\nimport { Container, Main, Children } from './styles';\n\nexport default function Layout({\n children,\n disableTableOfContents,\n title,\n headings,\n}) {\n const contentRef = useRef(null);\n const [isMenuOpen, setMenuOpen] = useState(false);\n const disableTOC =\n disableTableOfContents === true || !headings || headings.length === 0;\n\n const handleMenuOpen = () => {\n setMenuOpen(!isMenuOpen);\n };\n\n return (\n \n \n \n \n {title}\n \n )}\n \n {title && (\n \n {title}\n \n )}\n {children}\n \n \n \n \n );\n}\n\nLayout.propTypes = {\n children: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.node),\n PropTypes.node,\n ]).isRequired,\n disableTableOfContents: PropTypes.bool,\n title: PropTypes.string,\n headings: PropTypes.array,\n};\n\nLayout.defaultProps = {\n disableTableOfContents: false,\n title: '',\n headings: null,\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Layout/styles.js",
"content": "import styled from '@emotion/styled';\n\nexport const Container = styled.div`\n width: 100%;\n max-width: 1400px;\n margin: 0 auto;\n padding: 0 24px;\n\n display: grid;\n grid-template-columns: 280px calc(100% - 320px);\n grid-auto-flow: row;\n grid-gap: 40px;\n\n @media (max-width: 780px) {\n padding: 24px;\n grid-template-columns: 100%;\n }\n`;\n\nexport const Main = styled.main`\n height: 100%;\n padding-top: 36px;\n width: 100%;\n\n display: flex;\n justify-content: flex-start;\n position: relative;\n\n @media (max-width: 1200px) {\n flex-direction: column;\n }\n\n @media (max-width: 780px) {\n padding-top: 0;\n }\n`;\n\nexport const Children = styled.div`\n width: 100%;\n max-width: calc(75% - 64px);\n padding-right: 64px;\n\n @media (max-width: 1200px) {\n max-width: 100%;\n padding-right: 0;\n order: 3;\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n overflow-wrap: break-word;\n }\n`;\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Logo.js",
"content": "import React from 'react';\n\nexport default function Logo(props) {\n return (\n \n );\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Overlay.js",
"content": "/* @jsx jsx */\nimport { css, jsx } from '@emotion/react';\nimport PropTypes from 'prop-types';\n\nexport default function Overlay({ isMenuOpen, ...rest }) {\n return (\n \n {siteIcon && }\n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n\n \n {children}\n \n );\n}\n\nSEO.propTypes = {\n title: PropTypes.string,\n description: PropTypes.string,\n slug: PropTypes.string,\n image: PropTypes.string,\n children: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.element),\n PropTypes.node,\n ]),\n};\n\nSEO.defaultProps = {\n title: '',\n description: '',\n slug: '',\n image: '',\n children: '',\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Sidebar/ExternalLink/index.js",
"content": "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { FiExternalLink } from 'react-icons/fi';\n\nexport default function ExternalLink({ link, label }) {\n return (\n \n {label}\n {text} \n {children} \n \n );\n}\n\nexport default function Sidebar({ isMenuOpen }) {\n const {\n site: {\n siteMetadata: { basePath },\n },\n } = useStaticQuery(graphql`\n {\n site {\n siteMetadata {\n basePath\n }\n }\n }\n `);\n\n const data = useSidebar();\n\n function renderLink(link, label) {\n return isExternalUrl(link) ? (\n \n \n \n \n \n \n );\n}\n\nListWithSubItems.propTypes = {\n children: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.element),\n PropTypes.node,\n ]).isRequired,\n text: PropTypes.string.isRequired,\n};\n\nSidebar.propTypes = {\n isMenuOpen: PropTypes.bool.isRequired,\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Sidebar/styles.js",
"content": "import styled from '@emotion/styled';\n\nexport const Container = styled.aside`\n width: 100%;\n overflow-y: auto;\n\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-direction: column;\n\n position: sticky;\n top: 0;\n padding-top: 36px;\n transition: transform 0.5s;\n height: calc(100vh - 1px);\n\n nav {\n width: 100%;\n padding-top: 24px;\n align-self: flex-start;\n flex: 1;\n }\n\n @media (max-width: 780px) {\n max-width: 75%;\n min-width: auto;\n z-index: 1001;\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n padding-top: 32px;\n background: ${({ theme }) => theme.colors.background};\n transform: translate3d(\n ${({ isMenuOpen }) => (isMenuOpen ? '0' : '-100%')},\n 0,\n 0\n );\n }\n`;\n\nexport const LogoContainer = styled.div`\n width: 100%;\n\n a {\n width: 100%;\n padding-left: 30px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n`;\n\nexport const List = styled.ul`\n list-style: none;\n width: 100%;\n padding-left: 0;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n flex-direction: column;\n`;\n\nexport const Heading = styled.li`\n padding-left: 30px;\n width: 100%;\n text-transform: uppercase;\n font-size: 14px;\n font-weight: bold;\n margin-top: 20px;\n color: ${({ theme }) => theme.colors.title};\n letter-spacing: 0.142em;\n`;\n\nexport const Item = styled.li`\n font-size: 15px;\n width: 100%;\n transition: all 200ms ease-in-out;\n padding: 0 20px;\n cursor: pointer;\n\n a,\n span {\n display: block;\n font-size: 15px;\n color: ${({ theme }) => theme.colors.text};\n background-color: ${({ theme }) => theme.colors.background};\n padding: 4px 10px;\n margin: 4px 0;\n border-radius: 4px;\n font-weight: normal;\n\n text-decoration: none;\n width: 100%;\n height: 100%;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n\n cursor: pointer;\n margin: 0 auto;\n\n transition: all 0.2s ease;\n\n svg {\n width: 20px;\n height: 20px;\n margin-right: 10px;\n }\n\n &:not(.active-link):hover {\n color: ${({ theme }) => theme.colors.primary};\n }\n\n &.active-link {\n color: ${({ theme }) => theme.colors.primary};\n background-color: ${({ theme }) => theme.colors.shape};\n }\n\n @media (max-width: 780px) {\n &.active-link {\n background: ${({ theme }) => theme.colors.shape};\n }\n }\n }\n`;\n\nexport const SubItem = styled(List)`\n margin: 5px 0 0 0;\n`;\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/styles/global.js",
"content": "import React from 'react';\nimport { useTheme, Global, css } from '@emotion/react';\n\nexport default function GlobalStyle() {\n const theme = useTheme();\n\n return (\n \n \n
\n\n\n @rocketseat/gatsby-theme-docs-core\n
\n\n\n Core theme for @rocketseat/gatsby-theme-docs with no additional theming or style opinions. Includes all of the data structures you need to get up and build a documentation website.\n
\n\n\n \n\n \n\n \n \n \n
\n\n\n Features •\n Getting started •\n Usage •\n Contributing •\n License\n
\n\n## 🚀 Features\n\n- MDX for docs;\n- Sidebar customization with Yaml;\n\n## ⚡️ Getting started\n\nUsing Yarn:\n\n```sh\nyarn add @rocketseat/gatsby-theme-docs-core\n```\n\nUsing NPM:\n\n```sh\nnpm i @rocketseat/gatsby-theme-docs-core\n```\n\n## 🔥 Usage\n\n### Theme options\n\n| Key | Default | Required | Description |\n| ------------- | ------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| basePath | / | No | Root url for all docs |\n| configPath | config | No | Location of config files |\n| docsPath | docs | No | The site description for SEO and social (FB, Twitter) tags |\n| githubUrl | - | - | Deprecated in favor of `repositoryUrl` |\n| repositoryUrl | - | No | The URL of your repository (supports GitHub, GitLab and Bitbucket). Example: `https://github/jpedroschmitz/rocketdocs` |\n| baseDir | - | No | If your Gatsby site does not live in the root of your project directory/git repo, pass the subdirectory name here (`docs`, for example) |\n| withMdx | true | No | If necessary, you can add your own MDX options to the theme. To do so, make sure you turn this option to false and include `gatsby-plugin-mdx` on your `gatsby-config` |\n| branch | main | No | Default branch of the repository |\n\n> Note: When adding a BitBucket link on the `repositoryUrl` option, don't add the `src/` to it.\n> Example of correct link: `https://bitbucket.org/jpedroschmitz/rocketdocs`\n\n### Example usage\n\n```js\n// gatsby-config.js\nmodule.exports = {\n plugins: [\n {\n resolve: `@rocketseat/gatsby-theme-docs-core`,\n options: {\n basePath: `documentation`,\n configPath: `config`,\n docsPath: `docs`,\n githubUrl: `https://github.com/jpedroschmitz/rocketdocs`,\n baseDir: `www`,\n },\n },\n ],\n};\n```\n\n### Navigation\n\nThe sidebar is highly customizable, you can create a file under the config folder named `sidebar.yml`. If you add a `basePath` in the theme options, you don't need to add it before the links, the `useSidebar` hook will append it.\n\nHere is an example:\n\n```yml\n# Simple item\n- label: 'Home'\n link: '/'\n# With list of subitems\n- label: 'With dropdown'\n items:\n - label: 'My Example'\n link: '/my-example'\n```\n\n### `useSidebar`\n\nTo get all the sidebar items, you can use the `useSidebar` hook. Example:\n\n```js\nimport React from 'react';\nimport { useSidebar } from '@rocketseat/gatsby-theme-docs-core';\n\nexport default function Sidebar() {\n const data = useSidebar();\n\n console.log(data);\n /*\n [\n {\n \"node\": {\n \"label\": \"Home\",\n \"link\": \"/\",\n \"items\": null,\n \"id\": \"a2913be3-af3c-5fc9-967e-a058e86b20a9\"\n }\n },\n {\n \"node\": {\n \"label\": \"With dropdown\",\n \"link\": null,\n \"items\": [{ \"label\": \"My Example\", \"link\": \"/my-example\" }],\n \"id\": \"c7d9606c-4bda-5097-a0df-53108e9f4efd\"\n }\n }\n ]\n */\n}\n```\n\n### Docs Fields\n\nInside your docs folder, you can create MDX files. The filename will be the page path.\n\nAdd a title to the frontmatter of the MDX file and place the content below it. For example:\n\n```mdx\n---\ntitle: 'My Example'\ndescription: 'A simple description for this page'\nimage: 'banner.png'\ndisableTableOfContents: false\n---\n\nYour amazing page\n```\n\nEvery file must have a custom title. Description and image are not required.\n\n### Shadowing\n\nCheck the [Shadowing in Gatsby Themes](https://www.gatsbyjs.com/docs/themes/shadowing/) docs to understand how to customize this theme!\n\nIn general, you will need to create two files (`Docs.js` and `Homepage.js`) into `src/@rocketseat/gatsby-theme-docs-core/components/templates` to shadow/override it.\n\n## ✨ Contributing\n\nThanks for being interested in contributing! We’re so glad you want to help! Please take a little bit of your time and look at our [contributing guidelines](https://github.com/jpedroschmitz/rocketdocs/blob/main/.github/CONTRIBUTING.md) and our\n[code of conduct](https://github.com/jpedroschmitz/rocketdocs/blob/main/.github/CODE_OF_CONDUCT.md)! All type of contributions are welcome, such as bug fixes, issues or feature requests.\n\n## 📝 License\n\nLicensed under the [MIT License](https://github.com/jpedroschmitz/rocketdocs/blob/main/%40rocketseat/gatsby-theme-docs-core/LICENSE).\n\n---\n\nMade with 💜 by João Pedro\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/gatsby-config.js",
"content": "const withDefault = require(`./util/with-default`);\nconst path = require(`path`);\nconst gfmPlugin = require(`remark-gfm`);\nconst { rehypeMetaAsAttributes } = require(`./rehype-meta-as-attributes`);\nconst camelCase = require('lodash.camelcase');\n\nconst upperFirst = (text) => text.charAt(0).toUpperCase() + text.slice(1);\n\nmodule.exports = (options) => {\n const {\n basePath,\n configPath,\n docsPath,\n yamlFilesPath,\n withMdx,\n gatsbyRemarkPlugins,\n } = withDefault(options);\n\n return {\n siteMetadata: {\n basePath,\n },\n plugins: [\n `gatsby-transformer-sharp`,\n `gatsby-plugin-sharp`,\n {\n resolve: `gatsby-source-filesystem`,\n options: {\n name: `docs`,\n path: docsPath,\n },\n },\n {\n resolve: `gatsby-source-filesystem`,\n options: {\n name: `config`,\n path: configPath,\n },\n },\n {\n resolve: `gatsby-source-filesystem`,\n options: {\n name: `yamlFiles`,\n path: yamlFilesPath,\n },\n },\n {\n resolve: `gatsby-transformer-yaml`,\n options: {\n typeName: ({ node, isArray }) => {\n if (node.sourceInstanceName === `config`) {\n return `SidebarItems`;\n }\n\n // Fallback to the existing algorithm from gatsby-transformer-yaml plugin.\n // https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-transformer-yaml/src/gatsby-node.js#L22-L28\n if (node.internal.type !== `File`) {\n return upperFirst(camelCase(`${node.internal.type} Yaml`));\n }\n\n // Parsing algorithm: Array of Objects, where each file represents a collection.\n if (isArray) {\n return upperFirst(camelCase(`${node.name} Yaml`));\n }\n\n // Parsing algorithm: Single Object, where each subfolder represents a collection; each file represents one \"record\".\n return upperFirst(camelCase(`${path.basename(node.dir)} Yaml`));\n },\n },\n },\n withMdx && {\n resolve: `gatsby-plugin-mdx`,\n options: {\n extensions: [`.mdx`, `.md`],\n mdxOptions: {\n remarkPlugins: [gfmPlugin],\n rehypePlugins: [rehypeMetaAsAttributes],\n },\n gatsbyRemarkPlugins: [\n `gatsby-remark-autolink-headers`,\n `gatsby-remark-embedder`,\n {\n resolve: `gatsby-remark-images`,\n options: {\n maxWidth: 960,\n withWebp: true,\n linkImagesToOriginal: false,\n },\n },\n `gatsby-remark-responsive-iframe`,\n `gatsby-remark-copy-linked-files`,\n ...gatsbyRemarkPlugins,\n ],\n },\n },\n ].filter(Boolean),\n };\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/gatsby-node.js",
"content": "const path = require(`path`);\nconst { createFilePath } = require(`gatsby-source-filesystem`);\nconst fs = require(`fs`);\nconst urljoin = require(`url-join`);\nconst { compileMDXWithCustomOptions } = require(`gatsby-plugin-mdx`);\n\nconst { normalizeBasePath, resolveLink } = require(`./util/url`);\nconst withDefault = require(`./util/with-default`);\nconst { remarkHeadingsPlugin } = require(`./remark-headings-plugin`);\n\nfunction generateRepositoryEditLink(themeOptions, relativePath) {\n const { baseDir, docsPath, repositoryUrl, githubUrl, branch } =\n withDefault(themeOptions);\n\n const repoUrl = !repositoryUrl && githubUrl ? githubUrl : repositoryUrl;\n const pathToFile = path.join(branch, baseDir, docsPath);\n\n if (repoUrl.includes('github')) {\n return {\n editUrl: urljoin(repoUrl, `tree`, pathToFile, relativePath),\n provider: `GitHub`,\n };\n }\n\n if (repoUrl.includes('gitlab')) {\n return {\n editUrl: urljoin(repoUrl, '-', 'blob', pathToFile, relativePath),\n provider: `GitLab`,\n };\n }\n\n if (repoUrl.includes('bitbucket')) {\n return {\n editUrl: urljoin(repoUrl, 'src', pathToFile, relativePath),\n provider: `BitBucket`,\n };\n }\n\n return {\n editUrl: null,\n provider: null,\n };\n}\n\nexports.createPages = (\n { graphql, actions: { createPage }, reporter },\n themeOptions,\n) => {\n reporter.success(`onCreateDocs`);\n\n const { basePath, githubUrl, repositoryUrl } = withDefault(themeOptions);\n\n const docsTemplate = require.resolve(`./src/templates/docs-query.js`);\n const homeTemplate = require.resolve(`./src/templates/homepage-query.js`);\n\n return graphql(\n `\n {\n files: allFile(\n filter: {\n extension: { in: [\"md\", \"mdx\"] }\n sourceInstanceName: { eq: \"docs\" }\n }\n ) {\n edges {\n node {\n id\n relativePath\n childMdx {\n fields {\n slug\n }\n internal {\n contentFilePath\n }\n }\n }\n }\n }\n sidebar: allSidebarItems {\n edges {\n node {\n label\n link\n items {\n label\n link\n }\n id\n }\n }\n }\n homepage: allMdx(filter: { fields: { slug: { eq: \"/\" } } }) {\n nodes {\n internal {\n contentFilePath\n }\n }\n }\n }\n `,\n ).then((result) => {\n if (result.errors) {\n reporter.panic(\n `docs: there was an error loading the docs folder!`,\n result.errors,\n );\n return;\n }\n\n if (!repositoryUrl && githubUrl) {\n reporter.warn(\n `@rocketseat/gatsby-theme-docs: The option \\`githubUrl\\` was deprecated in favor of \\`repositoryUrl\\`. \\nTo remove this warning, replace \\`githubUrl\\` with \\`repositoryUrl\\`.`,\n );\n }\n\n const homepage = result.data.homepage.nodes[0];\n\n createPage({\n path: basePath,\n component: `${homeTemplate}?__contentFilePath=${homepage.internal.contentFilePath}`,\n context: {},\n });\n\n // Generate prev/next items based on sidebar.yml file\n const sidebar = result.data.sidebar.edges;\n const listOfItems = [];\n\n sidebar.forEach(({ node: { label, link, items } }) => {\n if (Array.isArray(items)) {\n items.forEach((item) => {\n listOfItems.push({\n label: item.label,\n link: resolveLink(item.link, basePath),\n });\n });\n } else {\n listOfItems.push({\n label,\n link: resolveLink(link, basePath),\n });\n }\n });\n\n // Generate docs pages\n const docs = result.data.files.edges;\n docs.forEach((doc) => {\n const {\n childMdx: {\n fields: { slug },\n internal: { contentFilePath },\n },\n relativePath,\n } = doc.node;\n\n // Get the file edit link based on the repository url\n const repositoryEditUrl = generateRepositoryEditLink(\n themeOptions,\n relativePath,\n );\n\n const pageLink = slug.slice(0, slug.length - 1);\n const currentPageIndex = listOfItems.findIndex(\n (page) => page.link === pageLink,\n );\n\n const prev = listOfItems[currentPageIndex - 1];\n const next = listOfItems[currentPageIndex + 1];\n\n createPage({\n path: slug,\n component: `${docsTemplate}?__contentFilePath=${contentFilePath}`,\n context: {\n slug,\n prev,\n next,\n repositoryEditUrl: repositoryEditUrl.editUrl || '',\n repositoryProvider: repositoryEditUrl.provider || '',\n },\n });\n });\n\n reporter.success(`docs pages created`);\n });\n};\n\nexports.createSchemaCustomization = async ({\n getNode,\n getNodesByType,\n pathPrefix,\n reporter,\n cache,\n actions,\n schema,\n store,\n}) => {\n const { createTypes } = actions;\n\n createTypes(`\n type MdxFrontmatter {\n title: String!\n description: String\n image: String\n disableTableOfContents: Boolean\n }\n `);\n\n createTypes(`\n type SidebarItems implements Node {\n label: String!\n link: String\n items: [SidebarItemsItems]\n }\n\n type SidebarItemsItems {\n label: String\n link: String\n }\n `);\n\n const headingsResolver = schema.buildObjectType({\n name: `Mdx`,\n fields: {\n headings: {\n type: `[MdxHeading]`,\n async resolve(mdxNode) {\n const fileNode = getNode(mdxNode.parent);\n\n if (!fileNode) {\n return null;\n }\n\n const result = await compileMDXWithCustomOptions(\n {\n source: mdxNode.body,\n absolutePath: fileNode.absolutePath,\n },\n {\n pluginOptions: {},\n customOptions: {\n mdxOptions: {\n remarkPlugins: [remarkHeadingsPlugin],\n },\n },\n getNode,\n getNodesByType,\n pathPrefix,\n reporter,\n cache,\n store,\n },\n );\n\n if (!result) {\n return null;\n }\n\n return result.metadata.headings;\n },\n },\n },\n });\n\n createTypes([\n `\n type MdxHeading {\n value: String\n depth: Int\n }\n `,\n headingsResolver,\n ]);\n};\n\nexports.onPreBootstrap = ({ store, reporter }, themeOptions) => {\n const { configPath, docsPath, yamlFilesPath } = withDefault(themeOptions);\n const { program } = store.getState();\n\n const dirs = [\n path.join(program.directory, configPath),\n path.join(program.directory, docsPath),\n path.join(program.directory, yamlFilesPath),\n ];\n\n dirs.forEach((dir) => {\n if (!fs.existsSync(dir)) {\n reporter.success(`docs: initialized the ${dir} directory`);\n fs.mkdirSync(dir);\n }\n });\n};\n\nexports.onCreateNode = (\n { node, actions: { createNodeField }, getNode },\n themeOptions,\n) => {\n if (node.internal.type !== `Mdx`) {\n return;\n }\n\n const { basePath } = withDefault(themeOptions);\n\n let value = createFilePath({ node, getNode });\n if (value === 'index') value = '';\n\n createNodeField({\n name: `slug`,\n node,\n value: normalizeBasePath(basePath, value),\n });\n\n createNodeField({\n name: `id`,\n node,\n value: node.id,\n });\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/index.js",
"content": "export { useSidebar } from './src/hooks/useSidebar';\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/package.json",
"content": "{\n \"name\": \"@rocketseat/gatsby-theme-docs-core\",\n \"version\": \"4.0.0\",\n \"main\": \"index.js\",\n \"description\": \"Core theme for @rocketseat/gatsby-theme-docs with no additional theming or style opinions. Includes all of the data structures you need to get up and build a documentation website.\",\n \"author\": \"João Pedro Schmitz (@jpedroschmitz)\",\n \"license\": \"MIT\",\n \"publishConfig\": {\n \"access\": \"public\"\n },\n \"keywords\": [\n \"documentation\",\n \"open source\",\n \"gatsby\",\n \"gatsby-plugin\",\n \"gatsby-theme\",\n \"react\",\n \"docs\",\n \"mdx\"\n ],\n \"homepage\": \"https://github.com/jpedroschmitz/rocketdocs/tree/main/@rocketseat/gatsby-theme-docs-core#readme\",\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/jpedroschmitz/rocketdocs.git\",\n \"directory\": \"@rocketseat/gatsby-theme-docs-core\"\n },\n \"bugs\": {\n \"url\": \"https://github.com/jpedroschmitz/rocketdocs/issues\"\n },\n \"dependencies\": {\n \"@mdx-js/mdx\": \"^1.6.22\",\n \"gatsby-plugin-mdx\": \"^5.9.0\",\n \"gatsby-plugin-sharp\": \"^5.9.0\",\n \"gatsby-remark-autolink-headers\": \"^6.9.0\",\n \"gatsby-remark-copy-linked-files\": \"^6.9.0\",\n \"gatsby-remark-embedder\": \"^6.0.1\",\n \"gatsby-remark-images\": \"^7.9.0\",\n \"gatsby-remark-responsive-iframe\": \"^6.9.0\",\n \"gatsby-source-filesystem\": \"^5.9.0\",\n \"gatsby-transformer-sharp\": \"^5.9.0\",\n \"gatsby-transformer-yaml\": \"^5.9.0\",\n \"lodash.camelcase\": \"^4.3.0\",\n \"mdast-util-to-string\": \"^2\",\n \"remark-gfm\": \"^1\",\n \"unist-util-visit\": \"^2\",\n \"url-join\": \"^4.0.1\"\n },\n \"peerDependencies\": {\n \"@mdx-js/react\": \"^2.3.0\",\n \"gatsby\": \"^5.0.0\",\n \"react\": \"^18.0.0\",\n \"react-dom\": \"^18.0.0\"\n }\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/rehype-meta-as-attributes.js",
"content": "const visit = require(`unist-util-visit`);\n\nexports.rehypeMetaAsAttributes = function rehypeMetaAsAttributes() {\n return (tree) => {\n // A regex that looks for a simplified attribute name, optionally followed\n // by a double, single, or unquoted attribute value\n const re = /\\b([-\\w]+)(?:=(?:\"([^\"]*)\"|'([^']*)'|([^\"'\\s]+)))?/g;\n\n // …\n visit(tree, 'element', (node) => {\n let match;\n\n if (node.tagName === 'code' && node.data && node.data.meta) {\n re.lastIndex = 0; // Reset regex.\n\n // eslint-disable-next-line no-cond-assign\n while ((match = re.exec(node.data.meta))) {\n node.properties[match[1]] = match[2] || match[3] || match[4] || '';\n }\n }\n });\n // …\n };\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/remark-headings-plugin.js",
"content": "const visit = require(`unist-util-visit`);\nconst toString = require(`mdast-util-to-string`);\n\nexports.remarkHeadingsPlugin = function remarkHeadingsPlugin() {\n return async function transformer(tree, file) {\n const headings = [];\n\n visit(tree, `heading`, (heading) => {\n headings.push({\n value: toString(heading),\n depth: heading.depth,\n });\n });\n\n const mdxFile = file;\n if (!mdxFile.data.meta) {\n mdxFile.data.meta = {};\n }\n\n mdxFile.data.meta.headings = headings;\n };\n};\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/components/Docs.js",
"content": "/* eslint-disable react/prop-types */\nimport React from 'react';\n\nexport default function Docspage({ data }) {\n return {JSON.stringify(data, null, 2)};\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/components/Homepage.js",
"content": "/* eslint-disable react/prop-types */\nimport React from 'react';\n\nexport default function Homepage({ data }) {\n return {JSON.stringify(data, null, 2)};\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/hooks/useSidebar.js",
"content": "import { graphql, useStaticQuery } from 'gatsby';\nimport { resolveLink } from '../../util/url';\n\nexport function useSidebar() {\n const data = useStaticQuery(graphql`\n {\n allSidebarItems {\n edges {\n node {\n label\n link\n items {\n label\n link\n }\n id\n }\n }\n }\n site {\n siteMetadata {\n basePath\n }\n }\n }\n `);\n\n const { basePath } = data.site.siteMetadata;\n\n const {\n allSidebarItems: { edges },\n } = data;\n\n if (basePath) {\n const normalizedSidebar = edges.map(\n ({ node: { label, link, items, id } }) => {\n if (Array.isArray(items)) {\n items = items.map((item) => ({\n label: item.label,\n link: resolveLink(item.link, basePath),\n }));\n }\n\n return {\n node: {\n id,\n label,\n items,\n link: resolveLink(link, basePath),\n },\n };\n },\n );\n\n return normalizedSidebar;\n }\n\n return edges;\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/templates/docs-query.js",
"content": "import { graphql } from 'gatsby';\nimport DocsComponent from '../components/Docs';\n\nexport default DocsComponent;\n\nexport const query = graphql`\n query ($slug: String!) {\n mdx(fields: { slug: { eq: $slug } }) {\n id\n excerpt(pruneLength: 160)\n fields {\n slug\n }\n frontmatter {\n title\n description\n image\n disableTableOfContents\n }\n headings {\n depth\n value\n }\n }\n }\n`;\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/templates/homepage-query.js",
"content": "import HomepageComponent from '../components/Homepage';\n\nexport default HomepageComponent;\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/util/url.js",
"content": "function normalizeBasePath(basePath, link) {\n return `/${basePath}/${link}`.replace(/\\/\\/+/g, `/`);\n}\n\nfunction isExternalUrl(url) {\n return /^((https?:)?\\/\\/)/i.test(url);\n}\n\nfunction resolveLink(link, basePath) {\n return isExternalUrl(link) ? link : normalizeBasePath(basePath, link);\n}\n\nmodule.exports = { resolveLink, normalizeBasePath, isExternalUrl };\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/util/with-default.js",
"content": "module.exports = (themeOptions) => {\n const basePath = themeOptions.basePath || `/`;\n const homePath = themeOptions.homePath || ``;\n const configPath = themeOptions.configPath || `config`;\n const docsPath = themeOptions.docsPath || `docs`;\n const yamlFilesPath = themeOptions.yamlFilesPath || `yamlFiles`;\n const branch = themeOptions.branch || `main`;\n const baseDir = themeOptions.baseDir || ``;\n const withMdx =\n themeOptions.withMdx === undefined ? true : themeOptions.withMdx;\n const gatsbyRemarkPlugins = themeOptions.gatsbyRemarkPlugins || [];\n\n const { githubUrl, repositoryUrl = '' } = themeOptions;\n\n return {\n basePath,\n homePath,\n configPath,\n docsPath,\n yamlFilesPath,\n baseDir,\n githubUrl,\n repositoryUrl,\n withMdx,\n branch,\n gatsbyRemarkPlugins,\n };\n};\n"
},
{
"path": "LICENSE.md",
"content": "MIT License\n\nCopyright (c) 2021 João Pedro Schmitz\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
},
{
"path": "README.md",
"content": "\n \n \n \n Rocket Docs\n
\n
\n\nEasy to use Gatsby Theme to create documentation websites ⚡️🔥
\n\n\n \n\n \n\n \n \n \n
\n\n\n Themes •\n Contributing •\n Need help? •\n License\n
\n\n## Themes\n\n🚀 [`gatsby-theme-docs-core`](./@rocketseat/gatsby-theme-docs-core): The core theme for docs websites that includes all the data structures you need.\n\n🚀 [`gatsby-theme-docs`](./@rocketseat/gatsby-theme-docs): Out of the box Gatsby Theme for creating documentation websites easily and quickly.\n\n## Contributing\n\nThanks for being interested in contributing! We’re so glad you want to help! Please take a little bit of your time and look at our [contributing guidelines](.github/CONTRIBUTING.md) and our\n[code of conduct](.github/CODE_OF_CONDUCT.md)! All type of contributions are welcome, such as bug fixes, issues or feature requests. Also, don't forget to check the roadmap.\n\n## Need help?\n\nIf you need help, feel free to open an issue with a description of the problem\nyou're facing or, if you prefer, you can chat with us on our\n[forum](https://github.com/jpedroschmitz/rocketdocs/discussions).\n\n## Sponsors\n\n\n \n \n \n ![\"\"](\"./.github/rocketseat.svg\")
\n \n \n \n
\n\n## Thanks\n\nThe following Open Source projects heavily inspire this project! Thanks, Apollo and LekoArts!\n\n- [LekoArts Gatsby themes](https://github.com/LekoArts/gatsby-themes)\n- [Apollo Gatsby themes](https://github.com/apollographql/gatsby-theme-apollo)\n\n## License\n\nMIT © [João Pedro](https://github.com/jpedroschmitz)\n"
},
{
"path": "examples/gatsby-theme-docs/.gitignore",
"content": "# Logs\nlogs\n*.log\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# Runtime data\npids\n*.pid\n*.seed\n*.pid.lock\n\n# Directory for instrumented libs generated by jscoverage/JSCover\nlib-cov\n\n# Coverage directory used by tools like istanbul\ncoverage\n\n# nyc test coverage\n.nyc_output\n\n# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)\n.grunt\n\n# Bower dependency directory (https://bower.io/)\nbower_components\n\n# node-waf configuration\n.lock-wscript\n\n# Compiled binary addons (http://nodejs.org/api/addons.html)\nbuild/Release\n\n# Dependency directories\nnode_modules/\njspm_packages/\n\n# Typescript v1 declaration files\ntypings/\n\n# Optional npm cache directory\n.npm\n\n# Optional eslint cache\n.eslintcache\n\n# Optional REPL history\n.node_repl_history\n\n# Output of 'npm pack'\n*.tgz\n\n# dotenv environment variable files\n.env*\n\n# gatsby files\n.cache/\npublic\n\n# Mac files\n.DS_Store\n\n# Yarn\nyarn-error.log\n.pnp/\n.pnp.js\n# Yarn Integrity file\n.yarn-integrity\n"
},
{
"path": "examples/gatsby-theme-docs/LICENSE",
"content": "MIT License\n\nCopyright (c) 2021 João Pedro\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
},
{
"path": "examples/gatsby-theme-docs/README.md",
"content": "\n \n
\n\n\n Gatsby Starter: Rocket Docs\n
\n\n\n Out of the box Gatsby Starter for creating documentation websites easily and quickly. With support for MDX, code highlight, Analytics, SEO and more 🔥 Using the theme: @rocketseat/gatsby-theme-docs\n
\n\n\n \n\n \n\n \n \n \n
\n\n## 🚀 Features\n\n- 📝 MDX for docs;\n- 🛣 Yaml-based sidebar navigation;\n- 📱 Responsive and mobile friendly;\n- 🖥 Code highlighting with [prism-react-renderer](https://github.com/FormidableLabs/prism-react-renderer) and [react-live](https://github.com/FormidableLabs/react-live) support;\n- 🥇 SEO (Sitemap, schema.org data, Open Graph and Twitter tags).\n- 📈 Google Analytics support;\n- 📄 Custom docs schema;\n- 🖱 Table of Contents;\n- ⚡️ Offline Support & WebApp Manifest;\n- and much more 🔥\n\n## ⚡️ Getting started\n\n1. Create the website.\n\n ```sh\n npx gatsby new rocketdocs https://github.com/jpedroschmitz/gatsby-starter-rocketdocs\n ```\n\n2. Start developing.\n\n ```sh\n cd rocketdocs\n gatsby develop\n ```\n\n3. Are you ready for launch?\n\n Your site is now running at `http://localhost:8000`\n\n## 📄 Docs\n\nLooking for docs? Check our live demo and documentation [website](https://rocketdocs.netlify.app).\n\n---\n\nMade with 💜 by João Pedro\n"
},
{
"path": "examples/gatsby-theme-docs/gatsby-config.js",
"content": "module.exports = {\n siteMetadata: {\n siteTitle: `Rocket Docs`,\n defaultTitle: `Rocket Docs`,\n siteTitleShort: `Rocket Docs`,\n siteDescription: `Out of the box Gatsby Theme for creating documentation websites easily and quickly`,\n siteUrl: `https://rocketdocs.netlify.app`,\n siteAuthor: `@jpedroschmitz`,\n siteImage: `/banner.png`,\n siteLanguage: `en`,\n themeColor: `#8257E6`,\n basePath: `/`,\n },\n plugins: [\n {\n resolve: `@rocketseat/gatsby-theme-docs`,\n options: {\n configPath: `src/config`,\n docsPath: `src/docs`,\n homePath: `src/home`,\n yamlFilesPath: `src/yamlFiles`,\n repositoryUrl: `https://github.com/jpedroschmitz/rocketdocs`,\n baseDir: `examples/gatsby-theme-docs`,\n gatsbyRemarkPlugins: [],\n },\n },\n {\n resolve: `gatsby-plugin-manifest`,\n options: {\n name: `Rocket Docs`,\n short_name: `Rocket Docs`,\n start_url: `/`,\n background_color: `#ffffff`,\n display: `standalone`,\n icon: `static/favicon.png`,\n },\n },\n `gatsby-plugin-sitemap`,\n // {\n // resolve: `gatsby-plugin-google-analytics`,\n // options: {\n // trackingId: `YOUR_ANALYTICS_ID`,\n // },\n // },\n `gatsby-plugin-remove-trailing-slashes`,\n {\n resolve: `gatsby-plugin-canonical-urls`,\n options: {\n siteUrl: `https://rocketdocs.netlify.app`,\n },\n },\n `gatsby-plugin-offline`,\n ],\n};\n"
},
{
"path": "examples/gatsby-theme-docs/package.json",
"content": "{\n \"name\": \"gatsby-starter-rocketdocs\",\n \"private\": true,\n \"version\": \"1.0.0\",\n \"description\": \"Out of the box Gatsby Starter for creating documentation websites easily and quickly. With support for MDX, code highlight, Analytics, SEO and more\",\n \"author\": \"João Pedro Schmitz (@jpedroschmitz)\",\n \"license\": \"MIT\",\n \"starter-name\": \"gatsby-starter-rocketdocs\",\n \"dependencies\": {\n \"@rocketseat/gatsby-theme-docs\": \"^4.0.1\",\n \"gatsby\": \"^5.9.0\",\n \"gatsby-plugin-canonical-urls\": \"^5.9.0\",\n \"gatsby-plugin-google-analytics\": \"^5.9.0\",\n \"gatsby-plugin-manifest\": \"^5.9.0\",\n \"gatsby-plugin-offline\": \"^6.9.0\",\n \"gatsby-plugin-remove-trailing-slashes\": \"^4.2.0\",\n \"gatsby-plugin-sitemap\": \"^6.9.0\",\n \"prop-types\": \"^15.8.1\",\n \"react\": \"^18.2.0\",\n \"react-dom\": \"^18.2.0\"\n },\n \"devDependencies\": {},\n \"keywords\": [\n \"gatsby\",\n \"gatsby-starter\"\n ],\n \"scripts\": {\n \"build\": \"gatsby build\",\n \"start\": \"gatsby develop\",\n \"serve\": \"gatsby serve\",\n \"clean\": \"gatsby clean\"\n }\n}\n"
},
{
"path": "examples/gatsby-theme-docs/src/config/sidebar.yml",
"content": "# Sidebar navigation\n\n- label: 'Introduction'\n link: '/'\n- label: 'Getting started'\n link: '/getting-started'\n- label: Usage\n items:\n - label: 'Creating docs'\n link: '/usage/creating-docs'\n - label: 'Navigation'\n link: '/usage/navigation'\n - label: 'Customizing'\n link: '/usage/customizing'\n - label: 'Using YAML files'\n link: '/usage/using-yaml-files'\n - label: 'Remark Plugins'\n link: '/usage/remark-plugins'\n- label: More\n items:\n - label: FAQ\n link: /faq\n - label: 'Github'\n link: https://github.com/jpedroschmitz/rocketdocs\n"
},
{
"path": "examples/gatsby-theme-docs/src/docs/faq.mdx",
"content": "---\ntitle: Frequently Asked Questions\ndescription: Frequently asked questions about the theme.\ndisableTableOfContents: true\n---\n\n## Will be included search or dark mode?\n\nThis theme is a great and complete option to build simple documentation websites.\nWe don't plan anymore to include search, dark mode or i18n to the project.\n\nRemember that if necessary, you can change colors and include a default\ndark theme. To do so, check this [doc](/usage/shadowing#changing-theme-colors).\n\n## How can I deploy my website?\n\nTo deploy this project, we recommend you take a look at this extensive documentation\nhosted on [Gatsby website](https://www.gatsbyjs.com/docs/deploying-and-hosting/). It\nincludes deploy tutorials for many services, like [Vercel](https://vercel.com/),\n[Netlify](https://www.netlify.com/), [GitHub Pages](https://pages.github.com/) and others.\n\n## What are good examples of the theme usage?\n\n- [Botmation](https://botmation.dev)\n- [Capmonster.cloud for Python](https://capmonster-python.alperenn.com/)\n- [ESPHome Devices](https://devices.esphome.io/)\n- [Label U](https://opendatalab.github.io/labelU-Kit/)\n- [React Observing](https://react-observing.web.app/)\n- [RudderStack Docs](https://rudderstack.com/docs/)\n- [Unform](https://unform.dev)\n- [Use Pandas](https://www.usepandas.com/)\n- [golangci-lint](https://golangci-lint.run/)\n- [use-cloudinary](https://use-cloudinary.netlify.app/)\n\nps: are you using this project? Submit a PR to add it to the [list](https://github.com/jpedroschmitz/rocketdocs/blob/main/examples/gatsby-theme-docs/src/docs/faq.mdx#what-are-good-examples-of-the-theme-usage).\n"
},
{
"path": "examples/gatsby-theme-docs/src/docs/getting-started.mdx",
"content": "---\ntitle: 'Getting started'\ndescription: Learn how to get started with Rocket Docs.\n---\n\n> Rocket Docs is ready for Gatsby v5. New projects will use the new version!\n\nThe best way to start is by using our starter:\n\n```bash\nnpx gatsby new rocketdocs https://github.com/jpedroschmitz/gatsby-starter-rocketdocs\n```\n\nBut, if you prefer, you can install and configure manually.\n\n#### Using Yarn:\n\n```bash\nyarn add @rocketseat/gatsby-theme-docs\n```\n\n#### Using NPM:\n\n```bash\nnpm i @rocketseat/gatsby-theme-docs\n```\n\n## Theme Options\n\n| Key | Default | Required | Description |\n| ------------- | ------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| basePath | / | No | Root url for all docs |\n| configPath | config | No | Location of config files |\n| docsPath | docs | No | The site description for SEO and social (FB, Twitter) tags |\n| homePath | - | No | Location of home file |\n| githubUrl | - | - | Deprecated in favor of `repositoryUrl` |\n| repositoryUrl | - | No | The complete URL of your repository (supports GitHub, GitLab and Bitbucket). Example: `https://github/jpedroschmitz/rocketdocs` |\n| baseDir | - | No | If your Gatsby site does not live in the root of your project directory/git repo, pass the subdirectory name here (ex: `docs`) |\n| withMdx | true | No | If necessary, you can add your own MDX options to the theme. To do so, make sure you turn this option to false and include `gatsby-plugin-mdx` on your `gatsby-config` |\n| branch | main | No | Default branch of the repository |\n\n
\n\n> Note: When adding a BitBucket link on the `repositoryUrl` option, don't add the `src/` to it.\n> Example of correct link:
`https://bitbucket.org/jpedroschmitz/rocketdocs`\n\n## Example usage\n\n```js title=gatsby-config.js\nmodule.exports = {\n siteMetadata: {\n siteTitle: `@rocketseat/gatsby-theme-docs`,\n defaultTitle: `@rocketseat/gatsby-theme-docs`,\n siteTitleShort: `gatsby-theme-docs`,\n siteDescription: `Out of the box Gatsby Theme for creating documentation websites easily and quickly`,\n siteUrl: `https://rocketdocs.netlify.app`,\n siteAuthor: `@jpedroschmitz`,\n siteImage: `/banner.png`,\n siteLanguage: `en`,\n themeColor: `#8257E6`,\n basePath: `/`,\n },\n plugins: [\n {\n resolve: `@rocketseat/gatsby-theme-docs`,\n options: {\n basePath: `/`,\n configPath: `src/config`,\n docsPath: `src/docs`,\n homePath: `src/home`,\n repositoryUrl: `https://github.com/jpedroschmitz/rocketdocs`,\n baseDir: `examples/gatsby-theme-docs`,\n },\n },\n ],\n};\n```\n\nOnce you have installed the dependencies you will need to create the [navigation](/usage/navigation) and [documentation](/usage/creating-docs) files.\n"
},
{
"path": "examples/gatsby-theme-docs/src/docs/usage/creating-docs.mdx",
"content": "---\ntitle: Creating docs\ndescription: Learn how to create docs using Rocket Docs.\n---\n\nAll MDX files created inside your docs folder will become pages, with the path defined by the filename.\nInside all docs files, you can define the following options:\n\n| Key | Required | Description |\n| ---------------------- | -------- | -------------------------- |\n| title | Yes | No |\n| description | No | Page description |\n| image | No | Used for og:image |\n| disableTableOfContents | No | Disables Table Of Contents |\n\n## Example\n\n```mdx\n---\ntitle: 'My Example'\ndescription: 'A simple description for this page'\nimage: /banner.jpeg\ndisableTableOfContents: false\n---\n\nWow, this is a nice page\n```\n\n## Embedding files\n\nIn a documentation website, sometimes you will need to embed well known services (like CodeSandbox, Twitter, or others...). If you need to\ndo it, you can simply copy-paste the link (powered by the awesome [gatsby-remark-embeder](https://www.gatsbyjs.com/packages/gatsby-remark-embedder/)).\nMake sure to check the [supported services](https://github.com/MichaelDeBoey/gatsby-remark-embedder#supported-services).\n\nhttps://youtu.be/QfcozcbDhNM\n\n## Code Highlight\n\nWe support many options for code components.\n\n### Title\n\nTo show a title, just add it to your code block. Ex: `title=src/myfile.css`\n\n```css title=src/myfile.css\n.gatsby::before {\n content: 'niceee...';\n}\n```\n\n### Line numbers\n\nTo add line numbers for that code block, pass an option `lineNumbers=true`.\n\n```js lineNumbers=true\nconst rocket = {\n launch: () => console.log('Launching...'),\n};\n\nrocket.launch();\n```\n\n### React live\n\nAs mentioned in the introduction, this theme uses `react-live`, so you can\ncreate a playground for live editing React components.\n\nTo use it, just add a `live=true` option to your code block.\n\n```jsx lineNumbers=true title=gatsby-config.js live=true\nfunction MyComponent() {\n function handleButtonClick() {\n alert('wowww');\n }\n\n return ;\n}\n\nrender(
\n);\n\nexport default Logo;\n```\n\n## Changing the home text\n\nCreate a file at `src/docs/index.mdx` with the text. Next, add the `homePath: 'src/home'` setting in the plugin options. Example:\n\n```mdx title=src/docs/index.mdx\n# Introduction\n\nMy awesome project!\n\nimport Navigation from '@rocketseat/gatsby-theme-docs/src/components/Docs/PostNav';\n\n
\n\n[Get started now!](/getting-started)\n"
},
{
"path": "examples/gatsby-theme-docs/src/pages/404.js",
"content": "import React from 'react';\nimport { Link } from 'gatsby';\n\nimport Layout from '@rocketseat/gatsby-theme-docs/src/components/Layout';\nimport Seo from '@rocketseat/gatsby-theme-docs/src/components/SEO';\n\nexport default function NotFound() {\n return (\n \n You just hit a route that doesn't exist... the sadness.
\n \n If you'd like to go back to homepage, click here\n .\n
\n \n );\n}\n"
},
{
"path": "examples/gatsby-theme-docs/src/yamlFiles/letters.yml",
"content": "- character: a\n- character: b\n- character: c\n"
},
{
"path": "package.json",
"content": "{\n \"name\": \"root\",\n \"private\": true,\n \"scripts\": {\n \"lint\": \"eslint --ignore-path .gitignore \\\"**/*.+(ts|js|tsx|jsx)\\\"\",\n \"format\": \"prettier --ignore-path .gitignore \\\"**/*.+(ts|js|tsx|jsx)\\\" --write\",\n \"postinstall\": \"husky install\",\n \"changeset\": \"changeset\",\n \"version-packages\": \"changeset version\",\n \"release\": \"changeset publish\",\n \"commit\": \"cz\"\n },\n \"engines\": {\n \"node\": \">=14.15.0\"\n },\n \"workspaces\": [\n \"@rocketseat/*\",\n \"examples/*\"\n ],\n \"lint-staged\": {\n \"**/*.{ts,js,jsx,tsx}\": [\n \"yarn lint --fix\",\n \"yarn format\"\n ],\n \"*.{md,mdx,json,yaml}\": [\n \"prettier \\\"**/*.{md,mdx,json,yaml}\\\" --write\"\n ]\n },\n \"config\": {\n \"commitizen\": {\n \"path\": \"cz-conventional-changelog\"\n }\n },\n \"devDependencies\": {\n \"@changesets/changelog-github\": \"^0.4.0\",\n \"@changesets/cli\": \"^2.14.1\",\n \"@commitlint/cli\": \"16.3.0\",\n \"@commitlint/config-conventional\": \"16.2.4\",\n \"commitizen\": \"4.2.4\",\n \"cz-conventional-changelog\": \"3.3.0\",\n \"eslint\": \"8.15.0\",\n \"eslint-config-airbnb\": \"19.0.4\",\n \"eslint-config-prettier\": \"8.5.0\",\n \"eslint-plugin-import\": \"2.26.0\",\n \"eslint-plugin-jsx-a11y\": \"6.5.1\",\n \"eslint-plugin-prettier\": \"4.0.0\",\n \"eslint-plugin-react\": \"7.29.4\",\n \"eslint-plugin-react-hooks\": \"4.5.0\",\n \"eslint-utils\": \"^3.0.0\",\n \"husky\": \"7.0.4\",\n \"lint-staged\": \"12.4.1\",\n \"prettier\": \"2.6.2\"\n }\n}\n"
}
]