Repository: Rocketseat/gatsby-themes
Branch: main
Commit: 49a07ab95707
Files: 101
Total size: 132.3 KB
Directory structure:
gitextract_pvqa2e3n/
├── .changeset/
│ ├── README.md
│ └── config.json
├── .commitlintrc.json
├── .editorconfig
├── .eslintrc
├── .github/
│ ├── CODEOWNERS
│ ├── CODE_OF_CONDUCT.md
│ ├── CONTRIBUTING.md
│ ├── ISSUE_TEMPLATE/
│ │ ├── bug_report.md
│ │ ├── config.yml
│ │ ├── documentation-report.md
│ │ ├── enhancement-request.md
│ │ └── question.md
│ ├── PULL_REQUEST_TEMPLATE
│ ├── labeler.json
│ ├── lock.yml
│ └── workflows/
│ ├── commit.yml
│ ├── lint.yml
│ ├── publish-starters.yml
│ └── release.yml
├── .gitignore
├── .husky/
│ ├── .gitignore
│ ├── commit-msg
│ ├── common.sh
│ └── pre-commit
├── .prettierrc
├── @rocketseat/
│ ├── gatsby-theme-docs/
│ │ ├── .npmignore
│ │ ├── CHANGELOG.md
│ │ ├── LICENSE
│ │ ├── README.md
│ │ ├── gatsby/
│ │ │ ├── wrapPageElement.js
│ │ │ └── wrapRootElement.js
│ │ ├── gatsby-browser.js
│ │ ├── gatsby-config.js
│ │ ├── gatsby-ssr.js
│ │ ├── index.js
│ │ ├── package.json
│ │ └── src/
│ │ ├── @rocketseat/
│ │ │ └── gatsby-theme-docs-core/
│ │ │ └── components/
│ │ │ ├── Docs.js
│ │ │ └── Homepage.js
│ │ ├── components/
│ │ │ ├── Code/
│ │ │ │ ├── LiveCodeScope.js
│ │ │ │ ├── index.js
│ │ │ │ └── styles.js
│ │ │ ├── Docs/
│ │ │ │ ├── EditGithub.js
│ │ │ │ ├── PostNav/
│ │ │ │ │ ├── index.js
│ │ │ │ │ └── styles.js
│ │ │ │ ├── TOC/
│ │ │ │ │ ├── index.js
│ │ │ │ │ └── styles.js
│ │ │ │ └── index.js
│ │ │ ├── Header.js
│ │ │ ├── Homepage.js
│ │ │ ├── Layout/
│ │ │ │ ├── index.js
│ │ │ │ └── styles.js
│ │ │ ├── Logo.js
│ │ │ ├── Overlay.js
│ │ │ ├── SEO.js
│ │ │ └── Sidebar/
│ │ │ ├── ExternalLink/
│ │ │ │ └── index.js
│ │ │ ├── InternalLink/
│ │ │ │ └── index.js
│ │ │ ├── index.js
│ │ │ └── styles.js
│ │ ├── styles/
│ │ │ ├── global.js
│ │ │ └── theme.js
│ │ ├── text/
│ │ │ └── index.mdx
│ │ └── util/
│ │ ├── copy-to-clipboard.js
│ │ ├── slug.js
│ │ └── url.js
│ └── gatsby-theme-docs-core/
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── LICENSE
│ ├── README.md
│ ├── gatsby-config.js
│ ├── gatsby-node.js
│ ├── index.js
│ ├── package.json
│ ├── rehype-meta-as-attributes.js
│ ├── remark-headings-plugin.js
│ ├── src/
│ │ ├── components/
│ │ │ ├── Docs.js
│ │ │ └── Homepage.js
│ │ ├── hooks/
│ │ │ └── useSidebar.js
│ │ └── templates/
│ │ ├── docs-query.js
│ │ └── homepage-query.js
│ └── util/
│ ├── url.js
│ └── with-default.js
├── LICENSE.md
├── README.md
├── examples/
│ └── gatsby-theme-docs/
│ ├── .gitignore
│ ├── LICENSE
│ ├── README.md
│ ├── gatsby-config.js
│ ├── package.json
│ └── src/
│ ├── config/
│ │ └── sidebar.yml
│ ├── docs/
│ │ ├── faq.mdx
│ │ ├── getting-started.mdx
│ │ └── usage/
│ │ ├── creating-docs.mdx
│ │ ├── customizing.mdx
│ │ ├── navigation.mdx
│ │ ├── remark-plugins.md
│ │ └── using-yaml-files.md
│ ├── home/
│ │ └── index.mdx
│ ├── pages/
│ │ └── 404.js
│ └── yamlFiles/
│ └── letters.yml
└── package.json
================================================
FILE CONTENTS
================================================
================================================
FILE: .changeset/README.md
================================================
# Changesets
Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works
with multi-package repos, or single-package repos to help you version and publish your code. You can
find the full documentation for it [in our repository](https://github.com/changesets/changesets).
We have a quick list of common questions to get you started engaging with this project in
[our documentation](https://github.com/changesets/changesets/blob/master/docs/common-questions.md).
================================================
FILE: .changeset/config.json
================================================
{
"$schema": "https://unpkg.com/@changesets/config@1.5.0/schema.json",
"changelog": [
"@changesets/changelog-github",
{ "repo": "jpedroschmitz/rocketdocs" }
],
"commit": false,
"linked": [
["@rocketseat/gatsby-theme-docs", "@rocketseat/gatsby-theme-docs-core"]
],
"access": "public",
"baseBranch": "main",
"updateInternalDependencies": "patch",
"ignore": ["gatsby-starter-rocketdocs"]
}
================================================
FILE: .commitlintrc.json
================================================
{
"extends": ["@commitlint/config-conventional"]
}
================================================
FILE: .editorconfig
================================================
root = true
[*]
indent_style = space
indent_size = 2
charset = utf-8
end_of_line = lf
trim_trailing_whitespace = true
insert_final_newline = true
================================================
FILE: .eslintrc
================================================
{
"parserOptions": {
"ecmaVersion": 2020,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"plugins": ["import", "jsx-a11y", "react", "react-hooks", "prettier"],
"extends": ["plugin:react/recommended", "airbnb", "prettier"],
"rules": {
"prettier/prettier": "error",
"react/jsx-filename-extension": [
"warn",
{
"extensions": [".jsx", ".js"]
}
],
"import/prefer-default-export": "off",
"no-param-reassign": "off",
"react/jsx-one-expression-per-line": "off",
"react/jsx-props-no-spreading": "off",
"react/forbid-prop-types": "off",
"react/jsx-fragments": "off",
"react/function-component-definition": [
2,
{
"namedComponents": "function-declaration"
}
]
},
"env": {
"browser": true,
"jest": true,
"node": true
}
}
================================================
FILE: .github/CODEOWNERS
================================================
# Learn how to add code owners here:
# https://help.github.com/en/articles/about-code-owners
* @jpedroschmitz
================================================
FILE: .github/CODE_OF_CONDUCT.md
================================================
# Code of Conduct
This Code of Conduct outlines our expectations for participants within the community as well as steps to reporting unacceptable behavior. Our goal is to make explicit what we expect from participants in this community as well as its leaders. We are committed to providing a welcoming and inspiring community for all and expect our code of conduct to be honored. Anyone who violates this code of conduct may be banned from the community.
Our community strives to:
- **Be welcoming, friendly and patient**.
- **Be considerate**: Your work will be used by other people, and you in turn will depend on the work of others. Any decision you take will affect users and colleagues, and you should take those consequences into account when making decisions. Remember that you might not be communicating in someone else’s primary language.
- **Be respectful**: Not all of us will agree all the time, but disagreement is no excuse for poor behavior and poor manners. We might all experience some frustration now and then, but we cannot allow that frustration to turn into a personal attack. It’s important to remember that a community where people feel uncomfortable or threatened is not a productive one.
- **Be understandable**: Disagreements, both social and technical, happen all the time and this project is no exception. It is important that we resolve disagreements and differing views constructively. Remember that we're different. The strength of our project comes from its varied community, people from a wide range of backgrounds. Different people have different perspectives on issues. Being unable to understand why someone holds a viewpoint doesn't mean that they're wrong. Don't forget that it is human to err and blaming each other doesn't get us anywhere, rather offer to help resolving issues and to help learn from mistakes.
This code serves to distill our common understanding of a collaborative, shared environment, and goals. We expect it to be followed in spirit as much as in the letter.
### Diversity Statement
We encourage everyone to participate and are committed to building a community for all. Although we may not be able to satisfy everyone, we all agree that everyone is equal. Whenever a participant has made a mistake, we expect them to take responsibility for it. If someone has been harmed or offended, it is our responsibility to listen carefully and respectfully, and do our best to right the wrong.
Although this list cannot be exhaustive, we explicitly honor diversity in age, gender, gender identity or expression, culture, ethnicity, language, national origin, political beliefs, profession, race, religion, sexual orientation, socioeconomic status, and technical ability. We will not tolerate discrimination based on any of the protected characteristics above, including participants with disabilities.
### Reporting Issues
If you experience or witness unacceptable behavior—or have any other concerns—please report it by contacting us via hey@joaopedro.dev. All reports will be handled with discretion. In your report please include:
- Your contact information.
- Names (real, nicknames, or pseudonyms) of any individuals involved. If there are additional witnesses, please include them as well. Your account of what occurred, and if you believe the incident is ongoing. If there is a publicly available record, please include a link.
- Any additional information that may be helpful.
After filing a report, a representative will contact you personally. If the person who is harassing you is part of the response team, they will recuse themselves from handling your incident. A representative will then review the incident, follow up with any additional questions, and make a decision as to how to respond. We will respect confidentiality requests for the purpose of protecting victims of abuse.
Anyone asked to stop unacceptable behavior is expected to comply immediately. If an individual engages in unacceptable behavior, the representative may take any action they deem appropriate, up to and including a permanent ban from our community without warning.
_This Code Of Conduct follows the template established by [TODO Group](https://todogroup.org)_.
================================================
FILE: .github/CONTRIBUTING.md
================================================
# Contribution guidelines
## Table of Contents
- [Getting started](#getting-started)
- [Language](#language)
- [For native English speakers](#for-native-english-speakers)
- [Code of Conduct](#code-of-conduct)
- [How can I help?](#how-can-i-help)
- [Documentation](#documentation)
- [Issues](#issues)
- [Submitting an issue](#submitting-an-issue)
- [Feedback](#feedback)
- [Code](#code)
- [Prerequisites](#prerequisites)
- [Local Development](#local-development)
- [Commiting](#commiting)
- [Why all these rules?](#why-all-these-rules)
- [Pull Requests](#pull-requests)
- [Changesets](#changesets)
## Getting started
First off, we would like to thank you for taking the time to contribute and make this a better project!
Here we have a set of instructions and guidelines to reduce misunderstandings and make the process of contributing to Rocket Docs as smooth as possible.
We hope this guide makes the contribution process clear and answers any questions you may have.
### Language
Please, while contributing or interacting in any way in this project, refrain from using any language other than **English**.
#### For native English speakers
Try to use simple words and sentences. Don't make fun of non-native English speakers if you find something wrong about the way they express themselves.
Try to encourage newcomers to express their opinions, and make them comfortable enough to do so.
### Code of Conduct
We expect that project participants to adhere to our Code of Conduct. You can check the [full text](CODE_OF_CONDUCT.md) so that you may understand the kind of conduct we are expecting and what actions will and will not be tolerated.
By participating in this project, you agree to abide by its terms.
## How can I help?
Here are some ways you can help along with some guidelines.
### Documentation
As a user of our themes, you're the perfect candidate to help us improve our documentation!
Typos, errors, lack of examples and/or explanation and so on, are just some examples of things that could be fixed and/or improved.
You could even make improvements to this guide! :)
While documenting, try to keep things simple and clear.
### Issues
Some issues are created with missing information, without a template, not reproducible, or plain
invalid.
You can make them easier to understand and resolve.
#### Submitting an issue
- Please search for similar issues before opening a new one;
- Use one of the corresponding issue templates;
- Use a clear and descriptive title;
- Include as much information as possible by filling out the provided issue template;
### Feedback
The more feedback the better! We're always looking for more suggestions and opinions on discussions. That's a good opportunity to influence the future direction of this project.
This includes submitting an enhancement suggestion, including completely new features and minor improvements to existing functionality.
### Code
You can use issue labels to discover issues you could help out with:
- [`bug` issues](https://github.com/jpedroschmitz/rocketdocs/labels/kind%3A%20bug)
are known bugs we'd like to fix;
- [`enhancement` issues](https://github.com/jpedroschmitz/rocketdocs/labels/type%3A%20feature%20request)
are features we're open to include.
The
[`help wanted`](https://github.com/jpedroschmitz/rocketdocs/labels/help%20wanted)
and
[`good first issue`](https://github.com/jpedroschmitz/rocketdocs/labels/good%20first%20issue)
labels are especially useful.
When you see an issue that is already assigned, please check to see if there isn't someone working on it already (maybe try asking in the issue). This is to prevent unnecessary work for everyone involved.
#### Prerequisites
- [Node.js](http://nodejs.org/) >= v12 must be installed.
- [Yarn](https://yarnpkg.com/en/docs/install)
#### Local Development
This repository uses [Yarn Workspaces][] and [changesets][] to develop multiple packages together as a monorepo. Be sure to install [Yarn][] before setting up the development environment.
To get started, clone the repository:
```sh
git clone git@github.com:LekoArts/gatsby-themes.git --depth=1
```
Install the dependencies:
```sh
yarn
```
After yarn has linked packages and installed the dependencies in the repo, you can inspect the locally available workspaces with:
```sh
yarn workspaces info
```
As all themes are set up with a respective example page (to view the theme/changes), you could for example run the "@rocketseat/gatsby-theme-docs" workspace with the example "rocketdocs" like:
```sh
yarn workspace gatsby-starter-rocketdocs start
```
## Commiting
When commiting on the repository, make sure to use the [Commitizen CLI](https://www.npmjs.com/package/commitizen) by using the `yarn commit` command. It will format your commit message following the configuration we have defined.
### Why all these rules?
We try to enforce these rules for the following reasons:
- Automatically generating changelog;
- Communicating in a better way the nature of changes;
- Triggering build and publish processes;
- Automatically determining a semantic version bump (based on the types of commits);
- Making it easier for people to contribute, by allowing them to explore a more structured commit history.
## Pull Requests
When opening a pull request, please be sure to update any relevant documentation in the READMEs or write some additional tests to ensure functionality. Also include a high-level list of changes.
### Changesets
This repository uses [changesets][] to do versioning. What that means for contributors is that you need to add a changeset by running `yarn changeset` which contains what packages should be bumped, their associated semver bump types, and some markdown which will be inserted into changelogs.
[yarn workspaces]: https://yarnpkg.com/en/docs/workspaces
[changesets]: https://github.com/atlassian/changesets
================================================
FILE: .github/ISSUE_TEMPLATE/bug_report.md
================================================
---
name: Bug report
about: Create a report to help us improve
---
<!-- Verify first that your issue is not already reported -->
<!-- Please use this template while reporting a bug and provide as much info as possible. Not doing so may result in your bug not being addressed in a timely manner. Thanks! -->
<!-- If possible complete *all* sections as described. Don't remove any section. -->
**Description of bug**
<!-- A clear and concise description of what the bug is. -->
**To Reproduce**
<!--
Steps to reproduce the behavior:
1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error
-->
**Expected behavior**
<!-- A clear and concise description of what you expected to happen. -->
**Exception or Error**
<pre><code>
<!-- If the issue is accompanied by an exception or an error, please share it below: -->
<!-- ✍️-->
</code></pre>
**Screenshots**
<!-- If applicable, add screenshots to help explain your problem. -->
**Environment:**
<!--
Add information about your environment
- OS: [e.g. iOS, Ubuntu]
- Browser [e.g. Chrome (69.0.3472.3), Firefox (62.0.3)]
- Node [e.g 8.9.1]
- Etc
If you want, you can also run `gatsby info` in the terminal
-->
**Additional context**
<!-- Add any other context about the problem here. -->
================================================
FILE: .github/ISSUE_TEMPLATE/config.yml
================================================
blank_issues_enabled: false
================================================
FILE: .github/ISSUE_TEMPLATE/documentation-report.md
================================================
---
name: Documentation report
about: Use this template for documentation related issues
---
<!-- Verify first that your issue is not already reported -->
<!-- Please only use this template for documentation related issues -->
<!-- If possible complete *all* sections as described. Don't remove any section. -->
**Description of issue**
<!-- A clear description what needs changing, why should it be changed? How is it useful? -->
**Usage example**
<!-- Is there a usage example? -->
================================================
FILE: .github/ISSUE_TEMPLATE/enhancement-request.md
================================================
---
name: Enhancement request
about: Suggest an idea for this project
---
<!-- Verify first that your issue is not already reported -->
<!-- Please only use this template for submitting enhancement requests -->
<!-- If possible complete *all* sections as described. Don't remove any section. -->
**What would you like to be added**:
<!-- A clear and concise description of what would you like to be added. -->
**Why is this needed**:
<!-- A clear and concise description of why is it needed. -->
**Is your enhancement request related to a problem? Please describe.**
<!-- A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] -->
**Additional context**
<!-- Add any other context or screenshots about the enhancement request here. -->
================================================
FILE: .github/ISSUE_TEMPLATE/question.md
================================================
---
name: Question 🤔
about: Usage question or discussion about Gatsby.
---
<!--
To make it easier for us to help you, please include as much useful information as possible.
You can also chat with us on our forum: https://github.com/jpedroschmitz/rocketdocs/discussions
Before opening a new issue, please search existing issues.
-->
## Summary
## Relevant information
<!-- Provide as much useful information as you can -->
================================================
FILE: .github/PULL_REQUEST_TEMPLATE
================================================
<!-- If this is your first time, please read our contribution guidelines: (https://github.com/jpedroschmitz/rocketdocs/blob/main/.github/CONTRIBUTING.md) -->
<!-- Verify first that your pull request is not already proposed -->
<!-- Refrain from using any language other than English -->
<!-- If possible complete *all* sections as described. Don't remove any section. -->
**Changes proposed**
<!--- Describe the change below, including rationale and design decisions -->
<!--- Include "Fixes #[issue_number]" if you are fixing an existing issue -->
**Additional context**
<!-- Add any other context or screenshots about the feature request here. -->
================================================
FILE: .github/labeler.json
================================================
{
"labels": {
"type: ci": [".github/workflows/**"],
"type: meta": [".github/**"],
"type: example": ["examples/**"],
"type: gatsby-theme-docs": ["@rocketseat/gatsby-theme-docs/**"],
"type: gatsby-theme-docs-core": ["@rocketseat/gatsby-theme-docs-core/**"]
}
}
================================================
FILE: .github/lock.yml
================================================
# Configuration for lock-threads - https://github.com/dessant/lock-threads
daysUntilLock: 365
issue-lock-labels: 'outdated'
lockComment: false
================================================
FILE: .github/workflows/commit.yml
================================================
name: Lint commit
on: pull_request
jobs:
commit:
name: Lint commit messages
runs-on: ubuntu-latest
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
steps:
- name: Checkout repository
uses: actions/checkout@v2
with:
fetch-depth: 0
- name: Set up Node
uses: actions/setup-node@v3
with:
node-version: lts/*
- name: Install dependencies
uses: bahmutov/npm-install@v1
- name: Check commit message
uses: wagoid/commitlint-github-action@v1
================================================
FILE: .github/workflows/lint.yml
================================================
name: Lint
on: pull_request
jobs:
code:
name: Lint code
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v2
with:
fetch-depth: 0
- name: Set up Node
uses: actions/setup-node@v3
with:
node-version: lts/*
- name: Install dependencies
uses: bahmutov/npm-install@v1
- name: Run ESLint
run: yarn lint
================================================
FILE: .github/workflows/publish-starters.yml
================================================
name: Publish Starters
on:
workflow_dispatch:
jobs:
publish-starters:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v2
with:
fetch-depth: 0
- name: Set up Node
uses: actions/setup-node@v3
with:
node-version: lts/*
- name: publish:starters
uses: LekoArts/actions-push-subdirectories@master
env:
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
with:
args: examples jpedroschmitz starter-name
================================================
FILE: .github/workflows/release.yml
================================================
name: Release
on:
push:
branches:
- main
jobs:
release:
name: Release
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v2
with:
fetch-depth: 0
- name: Set up Node
uses: actions/setup-node@v3
with:
node-version: lts/*
- name: Install dependencies
uses: bahmutov/npm-install@v1
- name: Create Release Pull Request or Publish to npm
id: changesets
uses: changesets/action@v1
with:
commit: 'chore(release): publish'
title: 'Changesets: Version Packages'
publish: yarn release
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
================================================
FILE: .gitignore
================================================
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Typescript v1 declaration files
typings/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# dotenv environment variables file
.env
# gatsby files
.cache/
public
# Mac files
.DS_Store
# Yarn
yarn-error.log
.pnp/
.pnp.js
# Yarn Integrity file
.yarn-integrity
.netlify/
# Editors
.vscode/*
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
# NPM lock files
package-lock.json
================================================
FILE: .husky/.gitignore
================================================
_
================================================
FILE: .husky/commit-msg
================================================
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
. "$(dirname "$0")/common.sh"
yarn commitlint --edit $1
================================================
FILE: .husky/common.sh
================================================
command_exists () {
command -v "$1" >/dev/null 2>&1
}
# Workaround for Windows 10, Git Bash and Yarn
if command_exists winpty && test -t 1; then
exec < /dev/tty
fi
================================================
FILE: .husky/pre-commit
================================================
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
. "$(dirname "$0")/common.sh"
yarn lint-staged
================================================
FILE: .prettierrc
================================================
{
"printWidth": 80,
"semi": true,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "all"
}
================================================
FILE: @rocketseat/gatsby-theme-docs/.npmignore
================================================
.cache/
node_modules/
public/
.vscode
.DS_Store
================================================
FILE: @rocketseat/gatsby-theme-docs/CHANGELOG.md
================================================
# @rocketseat/gatsby-theme-docs
## 4.0.1
### Patch Changes
- [#156](https://github.com/jpedroschmitz/rocketdocs/pull/156) [`10de666`](https://github.com/jpedroschmitz/rocketdocs/commit/10de6661b08f5c9551c223ef26f027dbb18aa8e2) Thanks [@tekmaven](https://github.com/tekmaven)! - Fix peerDependencies to React 18
## 4.0.0
### Major Changes
- [#150](https://github.com/jpedroschmitz/rocketdocs/pull/150) [`ed4b5b3`](https://github.com/jpedroschmitz/rocketdocs/commit/ed4b5b31dd60f732abced13d09df97671e9af828) Thanks [@tekmaven](https://github.com/tekmaven)! - Upgrade to Gatsby v5
### Patch Changes
- Updated dependencies [[`ed4b5b3`](https://github.com/jpedroschmitz/rocketdocs/commit/ed4b5b31dd60f732abced13d09df97671e9af828)]:
- @rocketseat/gatsby-theme-docs-core@4.0.0
## 3.2.0
### Minor Changes
- [#146](https://github.com/jpedroschmitz/rocketdocs/pull/146) [`a4903ae`](https://github.com/jpedroschmitz/rocketdocs/commit/a4903ae1f5bb24cdb075b15f374135e7da554511) Thanks [@aaronamm](https://github.com/aaronamm)! - Add `gatsbyRemarkPlugins` option
### Patch Changes
- Updated dependencies [[`a4903ae`](https://github.com/jpedroschmitz/rocketdocs/commit/a4903ae1f5bb24cdb075b15f374135e7da554511)]:
- @rocketseat/gatsby-theme-docs-core@3.2.0
## 3.1.0
### Minor Changes
- [#124](https://github.com/jpedroschmitz/rocketdocs/pull/124) [`c4f8d21`](https://github.com/jpedroschmitz/rocketdocs/commit/c4f8d213010b61f20183632f9fc407fb659c151d) Thanks [@aaronamm](https://github.com/aaronamm)! - Support additional YAML files
### Patch Changes
- Updated dependencies [[`c4f8d21`](https://github.com/jpedroschmitz/rocketdocs/commit/c4f8d213010b61f20183632f9fc407fb659c151d)]:
- @rocketseat/gatsby-theme-docs-core@3.1.0
## 3.0.0
### Major Changes
- [#109](https://github.com/jpedroschmitz/rocketdocs/pull/109) [`0ef266e`](https://github.com/jpedroschmitz/rocketdocs/commit/0ef266ef3ba56d690759fc270dcea21ba31b74aa) Thanks [@thinkybeast](https://github.com/thinkybeast)! - Add support for Gatsby v4
### Patch Changes
- [#113](https://github.com/jpedroschmitz/rocketdocs/pull/113) [`3c2acfc`](https://github.com/jpedroschmitz/rocketdocs/commit/3c2acfc89f89a9d94643b8fcb4b7694a7c4c1031) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - Update dependencies to their latest version
* [#115](https://github.com/jpedroschmitz/rocketdocs/pull/115) [`528373b`](https://github.com/jpedroschmitz/rocketdocs/commit/528373be3002558fbc0e16436f2b937724268a91) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - fix: createPages only for docs content
chore: update dev dependencies
* Updated dependencies [[`3c2acfc`](https://github.com/jpedroschmitz/rocketdocs/commit/3c2acfc89f89a9d94643b8fcb4b7694a7c4c1031), [`528373b`](https://github.com/jpedroschmitz/rocketdocs/commit/528373be3002558fbc0e16436f2b937724268a91)]:
- @rocketseat/gatsby-theme-docs-core@3.0.0
## 2.4.0
### Minor Changes
- [#92](https://github.com/jpedroschmitz/rocketdocs/pull/92) [`fa2cc45`](https://github.com/jpedroschmitz/rocketdocs/commit/fa2cc45f23a387737c6207bad8fac1ce3f4d75b0) Thanks [@benomatis](https://github.com/benomatis)! - Allow changing font family
## 2.4.0
### Minor Changes
- [#84](https://github.com/jpedroschmitz/rocketdocs/pull/84) [`52ea0430`](https://github.com/jpedroschmitz/rocketdocs/pull/84/commits/52ea043013226279e92e79a06beb25fb3b599fc1) - Allow changing font family
## 2.3.3
### Patch Changes
- [#101](https://github.com/jpedroschmitz/rocketdocs/pull/101) [`14d6c25`](https://github.com/jpedroschmitz/rocketdocs/commit/14d6c251ee713812ef98d3e222cd87628c4ec070) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - Updated dependencies: @rocketseat/gatsby-theme-docs-core@2.3.2
## 2.3.1
### Patch Changes
- [#84](https://github.com/jpedroschmitz/rocketdocs/pull/84) [`c6c4ada`](https://github.com/jpedroschmitz/rocketdocs/commit/c6c4ada2d468b95a91bcbeb7ef1360a2f15f5c5d) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - fix repositoryUrl option as required field
- Updated dependencies [[`4a1dd6d`](https://github.com/jpedroschmitz/rocketdocs/commit/4a1dd6d016e4ed973e54df4a8c6a60f6e900ffbb)]:
- @rocketseat/gatsby-theme-docs-core@2.3.1
## 2.3.0
### Minor Changes
- [#74](https://github.com/jpedroschmitz/rocketdocs/pull/74) [`22c1ce3`](https://github.com/jpedroschmitz/rocketdocs/commit/22c1ce3124e540d51cac50f21b71e9eaf21524b3) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - **New**
- feat: add support for Gatsby v3
- feat: add repositoryUrl option to theme (#47)
**Docs**
- docs: add more examples of theme usage
- docs: rename master to main
**Other**
- chore(deps): update packages
- refactor: change colors for blockquote
### Patch Changes
- Updated dependencies [[`22c1ce3`](https://github.com/jpedroschmitz/rocketdocs/commit/22c1ce3124e540d51cac50f21b71e9eaf21524b3)]:
- @rocketseat/gatsby-theme-docs-core@2.3.0
================================================
FILE: @rocketseat/gatsby-theme-docs/LICENSE
================================================
The MIT License (MIT)
Copyright (c) 2021 João Pedro Schmitz
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: @rocketseat/gatsby-theme-docs/README.md
================================================
<p align="center">
<img src="https://rocketseat-cdn.s3-sa-east-1.amazonaws.com/theme-docs.svg" alt="A illustration of file that is the @rocketseat/gatsby-theme-docs logo" width="100">
</p>
<h2 align="center">
@rocketseat/gatsby-theme-docs
</h2>
<p align="center">
Out of the box Gatsby Theme for creating documentation websites easily and quickly.
</p>
<p align="center">
<img src="https://img.shields.io/badge/PRs-welcome-%238257E6.svg" alt="PRs welcome!" />
<img alt="License" src="https://img.shields.io/badge/license-MIT-%238257E6">
<a href="https://twitter.com/intent/follow?screen_name=jpedroschmitz">
<img src="https://img.shields.io/twitter/follow/jpedroschmitz.svg?label=Follow%20@jpedroschmitz" alt="Follow @jpedroschmitz" />
</a>
</p>
<p align="center">
<a href="#-features">Features</a> •
<a href="#-getting-started">Getting started</a> •
<a href="#-docs">Docs</a> •
<a href="#-contributing">Contributing</a> •
<a href="#-license">License</a>
</p>
## 🚀 Features
- 📝 MDX for docs;
- 🛣 Yaml-based sidebar navigation;
- 📱 Responsive and mobile friendly;
- 🖥 Code highlighting with [prism-react-renderer](https://github.com/FormidableLabs/prism-react-renderer) and [react-live](https://github.com/FormidableLabs/react-live) support;
- 🥇 SEO (Sitemap, schema.org data, Open Graph and Twitter tags).
- 📈 Google Analytics support;
- 📄 Custom docs schema;
- 🖱 Table of Contents;
- ⚡️ Offline Support & WebApp Manifest;
- and much more 🔥
## ⚡️ Getting started
1. Create the website.
```sh
npx gatsby new rocketdocs https://github.com/jpedroschmitz/gatsby-starter-rocketdocs
```
2. Start developing.
```sh
cd rocketdocs
gatsby develop
```
3. Are you ready for launch? 🚀
Your site is now running at `http://localhost:8000`
## 📄 Docs
Looking for docs? Check our live demo and documentation [website](https://rocketdocs.netlify.app).
## ✨ Contributing
Thanks 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
[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.
## 🗺 Changelog
All 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.
## 📝 License
Licensed under the [MIT License](https://github.com/jpedroschmitz/rocketdocs/blob/main/%40rocketseat/gatsby-theme-docs/LICENSE).
---
Made with 💜 by João Pedro
================================================
FILE: @rocketseat/gatsby-theme-docs/gatsby/wrapPageElement.js
================================================
/* eslint-disable */
import React from 'react';
import { MDXProvider } from '@mdx-js/react';
import Code from '../src/components/Code';
const preToCodeBlock = (preProps) => {
if (
// children is code element
preProps.children &&
// if children is actually a <code>
preProps.children.type &&
preProps.children.type.name &&
preProps.children.type.name === 'code'
) {
// we have a <pre><code> situation
const {
children: codeString,
className = '',
...props
} = preProps.children.props;
const match = className.match(/language-([\0-\uFFFF]*)/);
return {
codeString: codeString.trim(),
className,
language: match != null ? match[1] : '',
...props,
};
}
return undefined;
};
const components = {
pre: (preProps) => {
const props = preToCodeBlock(preProps);
if (props) {
return <Code {...props} />;
}
return <pre {...preProps} />;
},
code: (props) => <code className="inline-code" {...props} />,
table: ({ children, ...rest }) => (
<div style={{ overflowX: `auto` }}>
<table {...rest}>{children}</table>
</div>
),
};
export function wrapPageElement({ element }) {
return <MDXProvider components={components}>{element}</MDXProvider>;
}
================================================
FILE: @rocketseat/gatsby-theme-docs/gatsby/wrapRootElement.js
================================================
/* eslint-disable */
import React from 'react';
import { ThemeProvider } from '@emotion/react';
import defaultTheme from '../src/styles/theme';
import GlobalStyle from '../src/styles/global';
export function wrapRootElement({ element }) {
return (
<ThemeProvider theme={defaultTheme}>
<>
<GlobalStyle />
{element}
</>
</ThemeProvider>
);
}
================================================
FILE: @rocketseat/gatsby-theme-docs/gatsby-browser.js
================================================
export { wrapRootElement } from './gatsby/wrapRootElement';
export { wrapPageElement } from './gatsby/wrapPageElement';
================================================
FILE: @rocketseat/gatsby-theme-docs/gatsby-config.js
================================================
const withDefault = require('@rocketseat/gatsby-theme-docs-core/util/with-default');
module.exports = (options) => {
const themeOptions = withDefault(options);
return {
siteMetadata: {
defaultTitle: `Rocket Docs by João Pedro Schmitz`,
siteTitle: `Rocket Docs`,
siteTitleShort: `Rocket Docs`,
siteDescription: `Easy to use Gatsby Theme to create documentation websites`,
siteUrl: `https://rocketdocs.netlify.app`,
siteAuthor: `@jpedroschmitz`,
siteImage: `/banner.png`,
siteLanguage: `en`,
basePath: themeOptions.basePath,
docsPath: themeOptions.docsPath,
},
plugins: [
{
resolve: `gatsby-source-filesystem`,
options: {
name: `homepage`,
path: themeOptions.homePath || `${__dirname}/src/text`,
},
},
{
resolve: `@rocketseat/gatsby-theme-docs-core`,
options: themeOptions,
},
`gatsby-plugin-catch-links`,
`gatsby-plugin-emotion`,
`gatsby-plugin-react-helmet`,
].filter(Boolean),
};
};
================================================
FILE: @rocketseat/gatsby-theme-docs/gatsby-ssr.js
================================================
export { wrapRootElement } from './gatsby/wrapRootElement';
export { wrapPageElement } from './gatsby/wrapPageElement';
================================================
FILE: @rocketseat/gatsby-theme-docs/index.js
================================================
// beep
================================================
FILE: @rocketseat/gatsby-theme-docs/package.json
================================================
{
"name": "@rocketseat/gatsby-theme-docs",
"version": "4.0.1",
"main": "index.js",
"description": "Out of the box Gatsby Theme for creating documentation websites easily and quickly.",
"author": "João Pedro Schmitz <hey@joaopedro.dev> (@jpedroschmitz)",
"license": "MIT",
"publishConfig": {
"access": "public"
},
"keywords": [
"documentation",
"open source",
"gatsby",
"gatsby-plugin",
"gatsby-theme",
"react",
"docs",
"mdx"
],
"homepage": "https://github.com/jpedroschmitz/rocketdocs/tree/main/@rocketseat/gatsby-theme-docs#readme",
"repository": {
"type": "git",
"url": "https://github.com/jpedroschmitz/rocketdocs.git",
"directory": "@rocketseat/gatsby-theme-docs"
},
"bugs": {
"url": "https://github.com/jpedroschmitz/rocketdocs/issues"
},
"dependencies": {
"@emotion/react": "^11.11.0",
"@emotion/styled": "^11.11.0",
"@mdx-js/react": "^2.3.0",
"@rocketseat/gatsby-theme-docs-core": "^4.0.0",
"gatsby-plugin-catch-links": "^5.9.0",
"gatsby-plugin-emotion": "^8.9.0",
"gatsby-plugin-mdx": "^5.9.0",
"gatsby-plugin-react-helmet": "^6.9.0",
"mdx-utils": "^0.2.0",
"parse-numeric-range": "^1.3.0",
"polished": "^4.2.2",
"prism-react-renderer": "^1.2.1",
"prop-types": "^15.8.1",
"react-helmet": "^6.1.0",
"react-icons": "^4.8.0",
"react-live": "^4.0.1",
"react-use": "^17.4.0",
"url-join": "^4.0.1"
},
"peerDependencies": {
"gatsby": "^5.0.0",
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
}
================================================
FILE: @rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Docs.js
================================================
/* eslint-disable react/prop-types */
import React from 'react';
import Docs from '../../../components/Docs';
export default function Docspage({ data: { mdx }, pageContext, children }) {
return (
<Docs mdx={mdx} pageContext={pageContext}>
{children}
</Docs>
);
}
================================================
FILE: @rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Homepage.js
================================================
/* eslint-disable react/prop-types */
import React from 'react';
import Home from '../../../components/Homepage';
export default function Homepage({ children }) {
return <Home>{children}</Home>;
}
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Code/LiveCodeScope.js
================================================
import { css, jsx } from '@emotion/react';
export default {
css,
jsx,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Code/index.js
================================================
import React, { useState } from 'react';
import PropTypes from 'prop-types';
import Highlight, { defaultProps } from 'prism-react-renderer';
import rangeParser from 'parse-numeric-range';
import theme from 'prism-react-renderer/themes/dracula';
import { LiveProvider, LiveEditor } from 'react-live';
import { copyToClipboard } from '../../util/copy-to-clipboard';
import scope from './LiveCodeScope';
import {
CopyCode,
LineNo,
Pre,
PreHeader,
LiveWrapper,
LivePreview,
LiveError,
StyledEditor,
} from './styles';
const calculateLinesToHighlight = (meta) => {
const RE = /{([\d,-]+)}/;
if (RE.test(meta)) {
const strlineNumbers = RE.exec(meta)[1];
const lineNumbers = rangeParser(strlineNumbers);
return (index) => lineNumbers.includes(index + 1);
}
return () => false;
};
export default function CodeHighlight({
codeString,
className,
live,
highlight,
title,
lineNumbers,
}) {
const [copied, setCopied] = useState(false);
const language = className && className.replace(/language-/, '');
const shouldHighlightLine = calculateLinesToHighlight(highlight);
const handleClick = () => {
setCopied(true);
copyToClipboard(codeString);
setTimeout(() => {
setCopied(false);
}, 4000);
};
if (live) {
return (
<LiveProvider
code={codeString}
noInline
theme={theme}
transformCode={(code) => `/** @jsx mdx */${code}`}
scope={scope}
>
<LiveWrapper>
<LivePreview />
<StyledEditor>
<CopyCode onClick={handleClick} disabled={copied} hasTitle>
{copied ? 'Copied!' : 'Copy'}
</CopyCode>
<LiveEditor />
</StyledEditor>
<LiveError />
</LiveWrapper>
</LiveProvider>
);
}
return (
<>
{title && <PreHeader>{title}</PreHeader>}
<div className="gatsby-highlight">
<Highlight
{...defaultProps}
code={codeString}
language={language}
theme={theme}
>
{({
className: blockClassName,
style,
tokens,
getLineProps,
getTokenProps,
}) => (
<Pre
className={blockClassName}
style={style}
hasTitle={title}
hasLanguage={!!language}
>
<CopyCode
onClick={handleClick}
disabled={copied}
hasTitle={title}
>
{copied ? 'Copied!' : 'Copy'}
</CopyCode>
<code>
{tokens.map((line, index) => {
const lineProps = getLineProps({ line, key: index });
if (shouldHighlightLine(index)) {
lineProps.className = `${lineProps.className} highlight-line`;
}
return (
<div {...lineProps}>
{lineNumbers && <LineNo>{index + 1}</LineNo>}
{line.map((token, key) => (
<span {...getTokenProps({ token, key })} />
))}
</div>
);
})}
</code>
</Pre>
)}
</Highlight>
</div>
</>
);
}
CodeHighlight.propTypes = {
codeString: PropTypes.string.isRequired,
className: PropTypes.string.isRequired,
highlight: PropTypes.string,
live: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
title: PropTypes.string,
lineNumbers: PropTypes.string,
};
CodeHighlight.defaultProps = {
live: false,
title: null,
lineNumbers: null,
highlight: null,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Code/styles.js
================================================
import styled from '@emotion/styled';
import { darken } from 'polished';
import {
LiveError as AuxLiveError,
LivePreview as AuxLivePreview,
} from 'react-live';
export const Pre = styled.pre`
text-align: left;
padding: ${({ hasLanguage }) => (hasLanguage ? `2rem` : `1rem`)} 1rem 1rem
1rem;
overflow: auto;
white-space: pre;
word-spacing: normal;
word-break: normal;
border-radius: ${({ hasTitle }) => (hasTitle ? '0 0 5px 5px' : '5px')};
-webkit-overflow-scrolling: touch;
overflow-wrap: break-word;
box-shadow: 1px 1px 20px rgba(20, 20, 20, 0.27);
code {
float: left;
min-width: 100%;
padding-right: 1rem;
}
.token-line {
line-height: 22px;
font-size: 14px;
min-width: 100%;
}
.highlight-line {
background-color: #44475a;
margin-left: -1rem;
margin-right: -2rem;
padding: 0 0.75rem;
border-left: 4px solid ${({ theme }) => theme.colors.primary};
}
`;
export const LiveWrapper = styled.div`
border-radius: 5px;
box-shadow: 1px 1px 20px rgba(20, 20, 20, 0.27);
overflow: hidden;
margin-bottom: 32px;
`;
export const StyledEditor = styled.div`
font-family: Hack, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
'Courier New', monospace;
font-variant: no-common-ligatures no-discretionary-ligatures
no-historical-ligatures no-contextual;
overflow: auto;
position: relative;
textarea,
pre {
font-size: 14px !important;
line-height: 22px !important;
padding: 1rem !important;
}
* > textarea:focus {
outline: none;
}
.token {
font-style: normal !important;
}
`;
export const LivePreview = styled(AuxLivePreview)`
position: relative;
padding: 0.5rem;
background: white;
color: black;
height: auto;
overflow: hidden;
`;
export const LiveError = styled(AuxLiveError)`
display: block;
color: rgb(248, 248, 242);
white-space: pre-wrap;
text-align: left;
font-size: 14px;
font-family: Hack, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
'Courier New', monospace;
font-variant: no-common-ligatures no-discretionary-ligatures
no-historical-ligatures no-contextual;
padding: 1rem;
background: rgb(255, 85, 85);
`;
export const PreHeader = styled.div`
background-color: ${darken('0.05', '#282a36')};
color: rgb(248, 248, 242, 0.75);
font-size: 12px;
line-height: 18px;
margin-top: 0.5rem;
padding: 0.8rem 1rem;
border-radius: 5px 5px 0 0;
`;
export const LineNo = styled.span`
display: inline-block;
width: 2rem;
user-select: none;
opacity: 0.3;
`;
export const CopyCode = styled.button`
position: absolute;
top: 0;
right: 0;
z-index: 1;
border-radius: ${({ hasTitle }) => (!hasTitle ? '0 5px 0 5px' : '0 0 0 5px')};
padding: 0.25rem 0.6rem;
border: none;
cursor: pointer;
background: #44475a;
color: rgb(248, 248, 242);
transition: all 200ms ease;
font-size: 12px;
:disabled {
cursor: not-allowed;
}
:not(:disabled) {
:hover,
:focus {
background: ${({ theme }) => theme.colors.primary};
}
}
`;
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/EditGithub.js
================================================
/* @jsx jsx */
import { useTheme, jsx, css } from '@emotion/react';
import PropTypes from 'prop-types';
import { MdEdit } from 'react-icons/md';
export default function EditGithub({ repositoryEditUrl, repositoryProvider }) {
const theme = useTheme();
if (repositoryEditUrl) {
return (
<a
href={repositoryEditUrl}
target="_blank"
rel="noopener noreferrer"
css={css`
display: flex;
align-items: center;
text-decoration: none;
margin-top: 48px;
color: ${theme.colors.text};
opacity: 0.8;
font-size: 14px;
font-weight: normal;
`}
>
<MdEdit style={{ marginRight: '5px' }} />
Edit this page on {repositoryProvider}
</a>
);
}
return null;
}
EditGithub.propTypes = {
repositoryEditUrl: PropTypes.string,
repositoryProvider: PropTypes.string,
};
EditGithub.defaultProps = {
repositoryEditUrl: null,
repositoryProvider: null,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/PostNav/index.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import { Link } from 'gatsby';
import { MdKeyboardArrowRight, MdKeyboardArrowLeft } from 'react-icons/md';
import { Container, Post } from './styles';
export default function Docs({ prev, next }) {
return (
<Container>
{prev && (
<Post isLeft>
<Link to={prev.link}>
<MdKeyboardArrowLeft />
<div>
<p>Prev</p>
<h3>{prev.label}</h3>
</div>
</Link>
</Post>
)}
{next && (
<Post>
<Link to={next.link}>
<div>
<p>Next</p>
<h3>{next.label}</h3>
</div>
<MdKeyboardArrowRight />
</Link>
</Post>
)}
</Container>
);
}
Docs.propTypes = {
prev: PropTypes.shape({
label: PropTypes.string,
link: PropTypes.string,
}),
next: PropTypes.shape({
label: PropTypes.string,
link: PropTypes.string,
}),
};
Docs.defaultProps = {
prev: null,
next: null,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/PostNav/styles.js
================================================
import styled from '@emotion/styled';
export const Container = styled.section`
display: flex;
justify-content: space-between;
align-items: center;
padding: 48px 0;
width: 100%;
@media (max-width: 780px) {
flex-direction: column;
}
`;
export const Post = styled.div`
transition: all 200ms;
${({ isLeft }) => !isLeft && 'margin-left: auto;'}
a {
display: flex;
text-decoration: none;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
svg {
width: 25px;
height: 25px;
color: ${({ theme }) => theme.colors.text};
${({ isLeft }) => (isLeft ? 'margin-right: 16px' : 'margin-left: 16px')};
}
p {
letter-spacing: 0.142em;
text-transform: uppercase;
font-size: 12px;
margin: 0;
color: ${({ theme }) => theme.colors.text};
}
h3 {
color: ${({ theme }) => theme.colors.text};
border: none;
margin: 0;
padding: 0;
font-size: 16px;
}
}
&:hover {
opacity: 0.8;
a svg {
opacity: 0.8;
}
}
@media (max-width: 780px) {
width: 100%;
${({ isLeft }) => isLeft && 'margin-bottom: 16px'};
a {
justify-content: ${({ isLeft }) => (isLeft ? 'flex-start' : 'flex-end')};
}
}
`;
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/TOC/index.js
================================================
import React, { useState, useEffect, useMemo } from 'react';
import PropTypes from 'prop-types';
import { useTheme } from '@emotion/react';
import useWindowScroll from 'react-use/lib/useWindowScroll';
import useWindowSize from 'react-use/lib/useWindowSize';
import slug from '../../../util/slug';
import { Wrapper, Container } from './styles';
export default function TableOfContents({ headings, disableTOC, contentRef }) {
const { y } = useWindowScroll();
const theme = useTheme();
const { width, height } = useWindowSize();
const [offsets, setOffsets] = useState([]);
const isMobile = width <= 1200;
useEffect(() => {
if (!isMobile || disableTOC) {
const allHeadings = contentRef.current?.querySelectorAll(`h2, h3`);
setOffsets(
allHeadings &&
Array.from(allHeadings)
.map((heading) => {
const anchor = heading.querySelector(`a`);
if (!anchor) return {};
return {
id: heading.id,
offset: heading.offsetTop + anchor.offsetTop,
};
})
.filter(Boolean),
);
}
}, [width, height, contentRef, isMobile, disableTOC]);
const activeHeading = useMemo(() => {
if (!isMobile || disableTOC) {
const windowOffset = height / 2;
const scrollTop = y + windowOffset;
if (offsets) {
for (let i = offsets.length - 1; i >= 0; i -= 1) {
const { id, offset } = offsets[i];
if (scrollTop >= offset) {
return id;
}
}
}
}
return null;
}, [offsets, height, y, isMobile, disableTOC]);
if (!disableTOC) {
return (
<Wrapper>
<Container>
<h2>On this page</h2>
<nav>
<ul>
{headings
.filter((heading) => heading.depth === 2 || heading.depth === 3)
.map((heading) => {
const headingSlug = slug(heading.value);
return (
<li
key={heading.value}
style={{
marginLeft: heading.depth === 3 ? `8px` : null,
}}
>
<a
href={`#${headingSlug}`}
style={{
color:
activeHeading === headingSlug
? theme.colors.primary
: theme.colors.text,
}}
>
{heading.value}
</a>
</li>
);
})}
</ul>
</nav>
</Container>
</Wrapper>
);
}
return <Wrapper />;
}
TableOfContents.propTypes = {
headings: PropTypes.array,
disableTOC: PropTypes.bool.isRequired,
contentRef: PropTypes.shape({ current: PropTypes.object }).isRequired,
};
TableOfContents.defaultProps = {
headings: null,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/TOC/styles.js
================================================
import styled from '@emotion/styled';
export const Wrapper = styled.div`
position: sticky;
top: 0;
order: 2;
padding-top: 72px;
max-height: calc(100vh - 72px);
overflow-y: auto;
overflow-x: hidden;
width: 100%;
max-width: 200px;
@media (max-width: 1200px) {
position: relative;
top: auto;
order: 0;
max-width: 100%;
margin-left: 0;
padding-top: 0;
}
`;
export const Container = styled.div`
h2 {
text-transform: uppercase;
font-size: 14px;
font-weight: bold;
letter-spacing: 0.142em;
margin-top: 0rem;
border: none;
margin: 0 0 16px 0;
}
nav ul {
padding-left: 0;
margin-bottom: 0;
list-style: none;
li {
margin-bottom: 12px;
line-height: 1.1;
a {
font-size: 14px;
font-weight: 400;
text-decoration: none;
transition: all 0.2s;
overflow-wrap: break-word;
&:hover {
text-decoration: underline;
}
}
}
}
@media (max-width: 1200px) {
margin: 0 0 24px 0;
padding-bottom: 16px;
border-bottom: 1px solid rgba(120, 117, 122, 0.2);
}
`;
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/index.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import Layout from '../Layout';
import SEO from '../SEO';
import PostNav from './PostNav';
import EditGithub from './EditGithub';
export default function Docs({ mdx, pageContext, children }) {
const { prev, next, repositoryEditUrl, repositoryProvider } = pageContext;
const { title, description, image, disableTableOfContents } = mdx.frontmatter;
const { headings } = mdx;
const { slug } = mdx.fields;
return (
<>
<SEO title={title} description={description} slug={slug} image={image} />
<Layout
disableTableOfContents={disableTableOfContents}
title={title}
headings={headings}
>
{children}
<EditGithub
repositoryEditUrl={repositoryEditUrl}
repositoryProvider={repositoryProvider}
/>
<PostNav prev={prev} next={next} />
</Layout>
</>
);
}
Docs.propTypes = {
mdx: PropTypes.shape({
body: PropTypes.string,
headings: PropTypes.array,
frontmatter: PropTypes.shape({
title: PropTypes.string,
description: PropTypes.string,
image: PropTypes.string,
disableTableOfContents: PropTypes.bool,
}),
fields: PropTypes.shape({
slug: PropTypes.string,
}),
}).isRequired,
pageContext: PropTypes.shape({
prev: PropTypes.shape({}),
next: PropTypes.shape({}),
repositoryEditUrl: PropTypes.string,
repositoryProvider: PropTypes.string,
}).isRequired,
children: PropTypes.node.isRequired,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Header.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import styled from '@emotion/styled';
import { GiHamburgerMenu } from 'react-icons/gi';
import { useStaticQuery, graphql } from 'gatsby';
const Container = styled.header`
display: flex;
justify-content: flex-start;
align-items: center;
height: 40px;
margin-bottom: 24px;
h2 {
margin: 0;
border: none;
padding: 0;
font-size: 18px;
@media (max-width: 359px) {
font-size: 14px;
}
}
button {
border: none;
background: none;
cursor: pointer;
margin-right: 16px;
display: flex;
justify-content: flex-start;
align-items: center;
}
@media (min-width: 780px) {
display: none;
}
`;
export default function Header({ handleMenuOpen }) {
const { site } = useStaticQuery(
graphql`
query {
site {
siteMetadata {
siteTitle
}
}
}
`,
);
const { siteTitle } = site.siteMetadata;
return (
<Container>
<button aria-label="Open sidebar" type="button" onClick={handleMenuOpen}>
<GiHamburgerMenu size={23} aria-hidden="true" />
</button>
<h2>{siteTitle}</h2>
</Container>
);
}
Header.propTypes = {
handleMenuOpen: PropTypes.func.isRequired,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Homepage.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import Layout from './Layout';
import SEO from './SEO';
export default function Home({ children }) {
return (
<Layout>
<SEO />
{children}
</Layout>
);
}
Home.propTypes = {
children: PropTypes.node.isRequired,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Layout/index.js
================================================
/* @jsx jsx */
import { useState, useRef, Fragment } from 'react';
import { jsx, css } from '@emotion/react';
import PropTypes from 'prop-types';
import TableOfContents from '../Docs/TOC';
import Sidebar from '../Sidebar';
import Header from '../Header';
import Overlay from '../Overlay';
import { Container, Main, Children } from './styles';
export default function Layout({
children,
disableTableOfContents,
title,
headings,
}) {
const contentRef = useRef(null);
const [isMenuOpen, setMenuOpen] = useState(false);
const disableTOC =
disableTableOfContents === true || !headings || headings.length === 0;
const handleMenuOpen = () => {
setMenuOpen(!isMenuOpen);
};
return (
<Fragment>
<Overlay isMenuOpen={isMenuOpen} onClick={handleMenuOpen} />
<Container>
<Sidebar isMenuOpen={isMenuOpen} />
<Main>
<Header handleMenuOpen={handleMenuOpen} />
{title && (
<h1
css={css`
display: none;
@media (max-width: 1200px) {
display: block;
}
`}
>
{title}
</h1>
)}
<Children ref={contentRef}>
{title && (
<h1
css={css`
@media (max-width: 1200px) {
display: none;
}
`}
>
{title}
</h1>
)}
{children}
</Children>
<TableOfContents
headings={headings}
disableTOC={disableTOC}
contentRef={contentRef}
/>
</Main>
</Container>
</Fragment>
);
}
Layout.propTypes = {
children: PropTypes.oneOfType([
PropTypes.arrayOf(PropTypes.node),
PropTypes.node,
]).isRequired,
disableTableOfContents: PropTypes.bool,
title: PropTypes.string,
headings: PropTypes.array,
};
Layout.defaultProps = {
disableTableOfContents: false,
title: '',
headings: null,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Layout/styles.js
================================================
import styled from '@emotion/styled';
export const Container = styled.div`
width: 100%;
max-width: 1400px;
margin: 0 auto;
padding: 0 24px;
display: grid;
grid-template-columns: 280px calc(100% - 320px);
grid-auto-flow: row;
grid-gap: 40px;
@media (max-width: 780px) {
padding: 24px;
grid-template-columns: 100%;
}
`;
export const Main = styled.main`
height: 100%;
padding-top: 36px;
width: 100%;
display: flex;
justify-content: flex-start;
position: relative;
@media (max-width: 1200px) {
flex-direction: column;
}
@media (max-width: 780px) {
padding-top: 0;
}
`;
export const Children = styled.div`
width: 100%;
max-width: calc(75% - 64px);
padding-right: 64px;
@media (max-width: 1200px) {
max-width: 100%;
padding-right: 0;
order: 3;
}
h1,
h2,
h3,
h4,
h5,
h6 {
overflow-wrap: break-word;
}
`;
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Logo.js
================================================
import React from 'react';
export default function Logo(props) {
return (
<svg width={180} height={34} viewBox="0 0 180 34" fill="none" {...props}>
<path
d="M37.504 9.983c-1.515 0-2.763 1.204-2.763 2.723v11.521h2.763v-11.52h6.589V9.982h-6.589zM60.566 17.079V12.68c0-1.492-1.222-2.723-2.763-2.723h-8.927c-1.515 0-2.764 1.204-2.764 2.723v8.798c0 1.492 1.223 2.723 2.764 2.723h8.927c1.515 0 2.763-1.205 2.763-2.723v-4.4zm-2.763 0v4.399h-8.927V12.68h8.927v4.399zM66.093 9.983c-1.515 0-2.764 1.204-2.764 2.723v8.798c0 1.492 1.223 2.723 2.764 2.723l9.724-.13v-2.593h-9.724v-8.798h9.724v-2.592l-9.724-.131zM91.655 9.983H87.91l-5.474 5.734h-1.089V9.983h-2.763v14.218h2.763v-5.76H82.94l5.686 5.76h3.8l-7.307-7.436 6.536-6.782zM95.77 21.478V18.44l11.692-.13v-5.63c0-1.492-1.223-2.723-2.764-2.723h-8.927c-1.515 0-2.763 1.204-2.763 2.723v8.798c0 1.492 1.222 2.723 2.763 2.723l11.691-.131v-2.592H95.771zm0-8.798h8.928v3.037h-8.927V12.68zM114.396 5.82h-1.063l-1.7 2.069v2.068h-2.099v2.723l2.099-.026v8.824c0 1.493 1.222 2.723 2.763 2.723l4.464-.13v-2.593h-4.464v-8.85l4.862-.079V9.957h-4.862V5.82zM133.819 18.44c0-1.492-1.223-2.723-2.764-2.723h-6.961V12.68h9.725v-2.592l-9.725-.131c-1.514 0-2.763 1.204-2.763 2.723v3.037c0 1.493 1.222 2.723 2.763 2.723h6.961v3.038h-9.724v2.592l9.724.13c1.515 0 2.764-1.204 2.764-2.722V18.44zM148.246 9.983h-8.928c-1.514 0-2.763 1.204-2.763 2.723v8.798c0 1.492 1.222 2.723 2.763 2.723l11.691-.13v-2.593h-11.691v-3.037l11.691-.131v-5.63c0-1.518-1.222-2.723-2.763-2.723zm0 5.734h-8.928V12.68h8.928v3.037zM165.463 9.983l-11.691.13v2.593h11.691v3.037l-11.691.131v5.63c0 1.492 1.222 2.723 2.763 2.723h8.928c1.514 0 2.763-1.204 2.763-2.723v-8.798a2.759 2.759 0 00-2.763-2.723zm0 11.495h-8.928V18.44h8.928v3.038zM175.138 12.628l4.862-.079V9.957h-4.862V5.794h-1.063l-1.7 2.068v2.069h-2.099v2.723l2.099-.026v8.824c0 1.492 1.222 2.723 2.763 2.723l4.463-.131v-2.592h-4.463v-8.824z"
fill="#121214"
/>
<path
d="M27.434.662l-4.49-.655a.389.389 0 00-.319.079l-1.913 2.46a.593.593 0 00-.106.55c.053.184-.106.341-.292.315l-1.568-.34a.657.657 0 00-.664.235l-6.217 7.855c-.107.157-.32.21-.505.131l-2.365-1.047a.62.62 0 00-.637.052l-1.196.812a.669.669 0 01-.664.052l-.585-.288a.666.666 0 00-.93.42l-.425 1.858c-.106.445.08.89.478 1.126l.904.55 2.896 1.754 1.408.864c.399.236.903.184 1.249-.104l2.364-2.043c.186-.157.479-.21.691-.078l.718.366a.61.61 0 00.717-.104l1.196-1.1a.618.618 0 01.69-.105l1.78.812c.266.13.585.052.771-.183l.824-1.048 6.244-7.881a.636.636 0 00-.372-1.021l-1.382-.314c-.292-.053-.425-.42-.213-.629l2.153-2.644c.212-.315.08-.655-.24-.707zM6.843 16.529c-.133-.078-.266.052-.213.183l.664 1.728c.054.131.054.262.027.393l-.585 2.252c-.026.157.027.314.133.393l1.674 1.283c.16.105.372.105.505-.026l1.754-1.52c.106-.078.239-.13.345-.156l1.993-.21c.133-.026.186-.21.053-.288l-6.35-4.032zM6.258 22.342a.43.43 0 00-.398-.052l-1.408.68c-.08.026-.133.105-.186.184l-3.003 7.305v.052c.027.026.053.053.107.053l.69-.262h.08c.027.026.053.078.027.105L.014 33.889c-.053.078.054.157.107.078l7.785-7.698a.496.496 0 00.133-.261l.159-1.99a.43.43 0 00-.133-.315l-1.807-1.361z"
fill="#8257E6"
/>
</svg>
);
}
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Overlay.js
================================================
/* @jsx jsx */
import { css, jsx } from '@emotion/react';
import PropTypes from 'prop-types';
export default function Overlay({ isMenuOpen, ...rest }) {
return (
<div
css={css`
::after {
content: '';
position: fixed;
width: 100%;
height: 100%;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.8);
z-index: 999;
display: ${isMenuOpen ? `block` : `none`};
}
`}
aria-label="Close menu"
{...rest}
/>
);
}
Overlay.propTypes = {
isMenuOpen: PropTypes.bool,
};
Overlay.defaultProps = {
isMenuOpen: false,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/SEO.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
import urljoin from 'url-join';
import { useStaticQuery, graphql } from 'gatsby';
export default function SEO({ description, title, slug, image, children }) {
const { site } = useStaticQuery(
graphql`
query {
site {
siteMetadata {
defaultTitle
siteTitleShort
siteTitle
siteImage
siteDescription
siteLanguage
siteUrl
siteAuthor
}
}
}
`,
);
const {
siteTitle,
siteTitleShort,
siteUrl,
defaultTitle,
siteImage,
siteDescription,
siteLanguage,
siteAuthor,
siteIcon,
} = site.siteMetadata;
const metaTitle = title ? `${title} | ${siteTitle}` : defaultTitle;
const metaUrl = urljoin(siteUrl, slug);
const metaImage = urljoin(siteUrl, image || siteImage);
const metaDescription = description || siteDescription;
const schemaOrgJSONLD = [
{
'@context': 'http://schema.org',
'@type': 'WebSite',
url: metaUrl,
name: title,
alternateName: siteTitleShort,
},
];
return (
<Helmet
htmlAttributes={{
lang: siteLanguage,
}}
title={metaTitle}
>
{siteIcon && <link rel="icon" href={siteIcon} />}
<meta name="description" content={metaDescription} />
<meta name="image" content={metaImage} />
<meta httpEquiv="x-ua-compatible" content="IE=edge,chrome=1" />
<meta name="MobileOptimized" content="320" />
<meta name="HandheldFriendly" content="True" />
<meta name="google" content="notranslate" />
<meta name="referrer" content="no-referrer-when-downgrade" />
<meta property="og:url" content={metaUrl} />
<meta property="og:type" content="website" />
<meta property="og:title" content={metaTitle} />
<meta property="og:description" content={metaDescription} />
<meta property="og:locale" content={siteLanguage} />
<meta property="og:site_name" content={siteTitle} />
<meta property="og:image" content={metaImage} />
<meta property="og:image:secure_url" content={metaImage} />
<meta property="og:image:alt" content="Banner" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content={metaTitle} />
<meta name="twitter:site" content={siteAuthor} />
<meta name="twitter:creator" content={siteAuthor} />
<meta name="twitter:image" content={metaImage} />
<meta name="twitter:image:src" content={metaImage} />
<meta name="twitter:image:alt" content="Banner" />
<meta name="twitter:image:width" content="1200" />
<meta name="twitter:image:height" content="630" />
<script type="application/ld+json">
{JSON.stringify(schemaOrgJSONLD)}
</script>
{children}
</Helmet>
);
}
SEO.propTypes = {
title: PropTypes.string,
description: PropTypes.string,
slug: PropTypes.string,
image: PropTypes.string,
children: PropTypes.oneOfType([
PropTypes.arrayOf(PropTypes.element),
PropTypes.node,
]),
};
SEO.defaultProps = {
title: '',
description: '',
slug: '',
image: '',
children: '',
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Sidebar/ExternalLink/index.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import { FiExternalLink } from 'react-icons/fi';
export default function ExternalLink({ link, label }) {
return (
<a href={link} rel="noopener noreferrer">
{label}
<FiExternalLink
style={{ width: '16px', height: '16px', marginLeft: '10px' }}
/>
</a>
);
}
ExternalLink.propTypes = {
link: PropTypes.string.isRequired,
label: PropTypes.string.isRequired,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Sidebar/InternalLink/index.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import { Link } from 'gatsby';
export default function InternalLink({ link, label }) {
return (
<Link to={link} activeClassName="active-link">
{label}
</Link>
);
}
InternalLink.propTypes = {
link: PropTypes.string.isRequired,
label: PropTypes.string.isRequired,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Sidebar/index.js
================================================
import React from 'react';
import PropTypes from 'prop-types';
import { useStaticQuery, graphql, Link } from 'gatsby';
import { useSidebar } from '@rocketseat/gatsby-theme-docs-core';
import {
Container,
LogoContainer,
List,
Heading,
Item,
SubItem,
} from './styles';
import { isExternalUrl } from '../../util/url';
import ExternalLink from './ExternalLink';
import InternalLink from './InternalLink';
import Logo from '../Logo';
function ListWithSubItems({ children, text }) {
return (
<>
<Heading>{text}</Heading>
<SubItem>{children}</SubItem>
</>
);
}
export default function Sidebar({ isMenuOpen }) {
const {
site: {
siteMetadata: { basePath },
},
} = useStaticQuery(graphql`
{
site {
siteMetadata {
basePath
}
}
}
`);
const data = useSidebar();
function renderLink(link, label) {
return isExternalUrl(link) ? (
<ExternalLink link={link} label={label} />
) : (
<InternalLink link={link} label={label} />
);
}
return (
<Container isMenuOpen={isMenuOpen}>
<LogoContainer>
<Link to={basePath} aria-label="Go to home page">
<Logo aria-hidden="true" />
</Link>
</LogoContainer>
<nav>
<List>
{data.map(({ node: { label, link, items, id } }) => {
if (Array.isArray(items)) {
const subitems = items.map((item) => (
<Item key={item.link}>{renderLink(item.link, item.label)}</Item>
));
return (
<ListWithSubItems key={id} text={label}>
{subitems}
</ListWithSubItems>
);
}
return <Item key={id}>{renderLink(link, label)}</Item>;
})}
</List>
</nav>
</Container>
);
}
ListWithSubItems.propTypes = {
children: PropTypes.oneOfType([
PropTypes.arrayOf(PropTypes.element),
PropTypes.node,
]).isRequired,
text: PropTypes.string.isRequired,
};
Sidebar.propTypes = {
isMenuOpen: PropTypes.bool.isRequired,
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/components/Sidebar/styles.js
================================================
import styled from '@emotion/styled';
export const Container = styled.aside`
width: 100%;
overflow-y: auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: column;
position: sticky;
top: 0;
padding-top: 36px;
transition: transform 0.5s;
height: calc(100vh - 1px);
nav {
width: 100%;
padding-top: 24px;
align-self: flex-start;
flex: 1;
}
@media (max-width: 780px) {
max-width: 75%;
min-width: auto;
z-index: 1001;
position: fixed;
top: 0;
bottom: 0;
left: 0;
padding-top: 32px;
background: ${({ theme }) => theme.colors.background};
transform: translate3d(
${({ isMenuOpen }) => (isMenuOpen ? '0' : '-100%')},
0,
0
);
}
`;
export const LogoContainer = styled.div`
width: 100%;
a {
width: 100%;
padding-left: 30px;
display: flex;
justify-content: flex-start;
align-items: center;
}
`;
export const List = styled.ul`
list-style: none;
width: 100%;
padding-left: 0;
display: flex;
justify-content: flex-start;
align-items: center;
flex-direction: column;
`;
export const Heading = styled.li`
padding-left: 30px;
width: 100%;
text-transform: uppercase;
font-size: 14px;
font-weight: bold;
margin-top: 20px;
color: ${({ theme }) => theme.colors.title};
letter-spacing: 0.142em;
`;
export const Item = styled.li`
font-size: 15px;
width: 100%;
transition: all 200ms ease-in-out;
padding: 0 20px;
cursor: pointer;
a,
span {
display: block;
font-size: 15px;
color: ${({ theme }) => theme.colors.text};
background-color: ${({ theme }) => theme.colors.background};
padding: 4px 10px;
margin: 4px 0;
border-radius: 4px;
font-weight: normal;
text-decoration: none;
width: 100%;
height: 100%;
display: flex;
justify-content: flex-start;
align-items: center;
cursor: pointer;
margin: 0 auto;
transition: all 0.2s ease;
svg {
width: 20px;
height: 20px;
margin-right: 10px;
}
&:not(.active-link):hover {
color: ${({ theme }) => theme.colors.primary};
}
&.active-link {
color: ${({ theme }) => theme.colors.primary};
background-color: ${({ theme }) => theme.colors.shape};
}
@media (max-width: 780px) {
&.active-link {
background: ${({ theme }) => theme.colors.shape};
}
}
}
`;
export const SubItem = styled(List)`
margin: 5px 0 0 0;
`;
================================================
FILE: @rocketseat/gatsby-theme-docs/src/styles/global.js
================================================
import React from 'react';
import { useTheme, Global, css } from '@emotion/react';
export default function GlobalStyle() {
const theme = useTheme();
return (
<Global
styles={css`
*,
*::after,
*::before {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-size: 16px;
font-family: ${theme.fonts.body};
background-color: ${theme.colors.background};
text-rendering: optimizelegibility;
-webkit-font-smoothing: antialiased;
overflow-y: scroll;
}
h1 {
font-size: 32px;
color: ${theme.colors.title};
font-weight: bold;
margin-bottom: 24px;
}
h2 {
font-size: 24px;
}
h3 {
font-size: 18px;
}
h4 {
font-size: 16px;
}
h2,
h3,
h4,
h5,
h6 {
color: ${theme.colors.title};
margin: 24px 0 16px 0;
font-weight: bold;
}
p {
color: ${theme.colors.text};
font-size: 16px;
line-height: 28px;
margin-bottom: 16px;
font-weight: 400;
}
code.inline-code {
display: inline-block;
vertical-align: middle;
line-height: 1;
padding: 0.2em;
background-color: #44475a;
color: rgba(248, 248, 242);
font-size: 14px;
border-radius: 3px;
font-feature-settings: 'clig' 0, 'calt' 0;
font-variant: no-common-ligatures no-discretionary-ligatures
no-historical-ligatures no-contextual;
}
h1 code.inline-code,
h2 code.inline-code {
font-size: calc(100% - 5px);
padding: 4px;
}
a {
color: ${theme.colors.text};
font-weight: bold;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
blockquote {
margin-bottom: 16px;
width: 100%;
p {
padding: 1rem;
border-radius: 5px;
background: ${theme.colors.components.blockquote.background};
color: ${theme.colors.components.blockquote.text};
margin: 0;
a {
color: ${theme.colors.components.blockquote.text};
}
}
}
hr {
border: 0;
height: 0;
border-top: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
table {
border-collapse: separate;
border-spacing: 0 4px;
margin-top: -4px;
margin-bottom: 16px;
width: 100%;
th,
td {
margin: 0;
color: ${theme.colors.text};
background-color: ${theme.colors.shape};
border: solid 1px ${theme.colors.shape};
border-style: solid none;
padding: 12px;
:first-of-type {
border-left-style: solid;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
:last-child {
border-right-style: solid;
border-bottom-right-radius: 5px;
border-top-right-radius: 5px;
}
}
tr {
th {
color: ${theme.colors.title};
text-align: left;
font-weight: bold;
}
}
}
iframe {
margin-bottom: 16px;
}
img {
max-width: 100%;
}
ul,
ol {
color: ${theme.colors.text};
padding-left: 15px;
margin-bottom: 16px;
li {
line-height: 28px;
}
}
li ul,
li ol {
margin-bottom: 0;
}
.gatsby-highlight {
font-family: Hack, SFMono-Regular, Menlo, Monaco, Consolas,
'Liberation Mono', 'Courier New', monospace;
font-variant: no-common-ligatures no-discretionary-ligatures
no-historical-ligatures no-contextual;
position: relative;
z-index: 0;
margin: 0 0 16px 0;
overflow: auto;
.token {
font-style: normal !important;
}
}
pre[class*='language-'] code {
font-family: inherit;
}
pre[class*='language-']::before {
background: #d9d7e0;
border-radius: 0 0 4px 4px;
color: #232129;
font-size: 12px;
font-family: inherit;
letter-spacing: 0.075em;
line-height: 1;
padding: 0.25rem 0.5rem;
position: absolute;
left: 1rem;
text-align: right;
text-transform: uppercase;
top: 0;
}
pre[class~='language-js']::before,
pre[class~='language-javascript']::before {
content: 'js';
background: #f7df1e;
}
pre[class~='language-jsx']::before {
content: 'jsx';
background: #61dafb;
}
pre[class~='language-typescript']::before,
pre[class~='language-ts']::before {
content: 'ts';
background: #294e80;
color: #fff;
}
pre[class~='language-tsx']::before {
content: 'tsx';
background: #294e80;
color: #fff;
}
pre[class~='language-graphql']::before {
content: 'GraphQL';
background: #e10098;
color: #fff;
}
pre[class~='language-html']::before {
content: 'html';
background: #005a9c;
color: #fff;
}
pre[class~='language-css']::before {
content: 'css';
background: #ff9800;
color: #fff;
}
pre[class~='language-mdx']::before {
content: 'mdx';
background: #f9ac00;
color: #fff;
}
pre[class~='language-shell']::before {
content: 'shell';
}
pre[class~='language-sh']::before {
content: 'sh';
}
pre[class~='language-bash']::before {
content: 'bash';
}
pre[class~='language-yaml']::before,
pre[class~='language-yml']::before {
content: 'yaml';
background: #ffa8df;
}
pre[class~='language-markdown']::before {
content: 'md';
}
pre[class~='language-json']::before,
pre[class~='language-json5']::before {
content: 'json';
background: linen;
}
pre[class~='language-diff']::before {
content: 'diff';
background: #e6ffed;
}
pre[class~='language-text']::before {
content: 'text';
background: #fff;
}
pre[class~='language-flow']::before {
content: 'flow';
background: #e8bd36;
}
`}
/>
);
}
================================================
FILE: @rocketseat/gatsby-theme-docs/src/styles/theme.js
================================================
export default {
colors: {
primary: '#8257E6',
background: '#FFFFFF',
shape: `#F2F2FA`,
title: `#3D3D4D`,
text: `#6C6C80`,
components: {
blockquote: {
background: `#feebc8`,
text: `#2d3748`,
},
},
},
fonts: {
body: `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif`,
},
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/text/index.mdx
================================================
Welcome, this is the default page of `@rocketseat/gatsby-theme-docs`! To
change this page create a file named `index.mdx` inside `src/docs` and place
there your text. Next, add the `homePath: 'src/home'` setting in the plugin
options. Also, if you need help, feel free to
[open an issue](https://github.com/jpedroschmitz/rocketdocs/issues) with a
description of the problem you're facing.
================================================
FILE: @rocketseat/gatsby-theme-docs/src/util/copy-to-clipboard.js
================================================
/* eslint-disable */
export const copyToClipboard = (str) => {
const { clipboard } = window.navigator;
if (!clipboard || typeof clipboard.writeText !== `function`) {
const textarea = document.createElement(`textarea`);
textarea.value = str;
textarea.setAttribute(`readonly`, true);
textarea.setAttribute(`contenteditable`, true);
textarea.style.position = `absolute`;
textarea.style.left = `-9999px`;
document.body.appendChild(textarea);
textarea.select();
const range = document.createRange();
const sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
textarea.setSelectionRange(0, textarea.value.length);
document.execCommand(`copy`);
document.body.removeChild(textarea);
return Promise.resolve(true);
}
return clipboard.writeText(str);
};
================================================
FILE: @rocketseat/gatsby-theme-docs/src/util/slug.js
================================================
export default function slugify(string) {
return string
.toString() // Cast to string
.toLowerCase() // Convert the string to lowercase letters
.trim() // Remove whitespace from both sides of a string
.replace(/\s/g, '-') // Replace each space with -
.replace(
/[^\w\-\u00b4\u00C0-\u00C3\u00c7\u00C9-\u00CA\u00CD\u00D3-\u00D5\u00DA\u00E0-\u00E3\u00E7\u00E9-\u00EA\u00ED\u00F3-\u00F5\u00FA]+/g,
'',
); // Removes all chars that aren't words, -, ´ or some latin characters (À Á Â Ã Ç É Ê Í Ó Ô Õ Ú à á â ã ç é ê í ó ô õ ú)
}
================================================
FILE: @rocketseat/gatsby-theme-docs/src/util/url.js
================================================
function isExternalUrl(url) {
return /^((https?:)?\/\/)/i.test(url);
}
module.exports = { isExternalUrl };
================================================
FILE: @rocketseat/gatsby-theme-docs-core/.npmignore
================================================
.cache/
node_modules/
public/
.vscode
.DS_Store
================================================
FILE: @rocketseat/gatsby-theme-docs-core/CHANGELOG.md
================================================
# @rocketseat/gatsby-theme-docs-core
## 4.0.0
### Major Changes
- [#150](https://github.com/jpedroschmitz/rocketdocs/pull/150) [`ed4b5b3`](https://github.com/jpedroschmitz/rocketdocs/commit/ed4b5b31dd60f732abced13d09df97671e9af828) Thanks [@tekmaven](https://github.com/tekmaven)! - Upgrade to Gatsby v5
## 3.2.0
### Minor Changes
- [#146](https://github.com/jpedroschmitz/rocketdocs/pull/146) [`a4903ae`](https://github.com/jpedroschmitz/rocketdocs/commit/a4903ae1f5bb24cdb075b15f374135e7da554511) Thanks [@aaronamm](https://github.com/aaronamm)! - Add `gatsbyRemarkPlugins` option
## 3.1.0
### Minor Changes
- [#124](https://github.com/jpedroschmitz/rocketdocs/pull/124) [`c4f8d21`](https://github.com/jpedroschmitz/rocketdocs/commit/c4f8d213010b61f20183632f9fc407fb659c151d) Thanks [@aaronamm](https://github.com/aaronamm)! - Support additional YAML files
## 3.0.0
### Major Changes
- [#113](https://github.com/jpedroschmitz/rocketdocs/pull/113) [`3c2acfc`](https://github.com/jpedroschmitz/rocketdocs/commit/3c2acfc89f89a9d94643b8fcb4b7694a7c4c1031) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - Add support for Gatsby v4
### Patch Changes
- [#115](https://github.com/jpedroschmitz/rocketdocs/pull/115) [`528373b`](https://github.com/jpedroschmitz/rocketdocs/commit/528373be3002558fbc0e16436f2b937724268a91) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - fix: createPages only for docs content
chore: update dev dependencies
## 2.3.2
### Patch Changes
- [#99](https://github.com/jpedroschmitz/rocketdocs/pull/99) [`418e3c7`](https://github.com/jpedroschmitz/rocketdocs/commit/418e3c767f3d84cb7d53c9049873bee625c57071) Thanks [@milgner](https://github.com/milgner)! - fix: allow setting withMdx option to false
## 2.3.1
### Patch Changes
- [#82](https://github.com/jpedroschmitz/rocketdocs/pull/82) [`4a1dd6d`](https://github.com/jpedroschmitz/rocketdocs/commit/4a1dd6d016e4ed973e54df4a8c6a60f6e900ffbb) Thanks [@colmcgiv](https://github.com/colmcgiv)! - repositoryUrl listed as required but build fails when not included
## 2.3.0
### Minor Changes
- [#74](https://github.com/jpedroschmitz/rocketdocs/pull/74) [`22c1ce3`](https://github.com/jpedroschmitz/rocketdocs/commit/22c1ce3124e540d51cac50f21b71e9eaf21524b3) Thanks [@jpedroschmitz](https://github.com/jpedroschmitz)! - **New**
- feat: add support for Gatsby v3
- feat: add repositoryUrl option to theme (#47)
**Docs**
- docs: add more examples of theme usage
- docs: rename master to main
**Other**
- chore(deps): update packages
- refactor: change colors for blockquote
================================================
FILE: @rocketseat/gatsby-theme-docs-core/LICENSE
================================================
The MIT License (MIT)
Copyright (c) 2021 João Pedro
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: @rocketseat/gatsby-theme-docs-core/README.md
================================================
<p align="center">
<img src="https://rocketseat-cdn.s3-sa-east-1.amazonaws.com/theme-docs.svg" alt="A illustration of file that is the @rocketseat/gatsby-theme-docs logo" width="100">
</p>
<h2 align="center">
@rocketseat/gatsby-theme-docs-core
</h2>
<p align="center">
Core theme for <a href="https://github.com/jpedroschmitz/rocketdocs/tree/main/%40rocketseat/gatsby-theme-docs">@rocketseat/gatsby-theme-docs</a> with no additional theming or style opinions. Includes all of the data structures you need to get up and build a documentation website.
</p>
<p align="center">
<img src="https://img.shields.io/badge/PRs-welcome-%238257E6.svg" alt="PRs welcome!" />
<img alt="License" src="https://img.shields.io/badge/license-MIT-%238257E6">
<a href="https://twitter.com/intent/follow?screen_name=jpedroschmitz">
<img src="https://img.shields.io/twitter/follow/jpedroschmitz.svg?label=Follow%20@jpedroschmitz" alt="Follow @jpedroschmitz" />
</a>
</p>
<p align="center">
<a href="#-features">Features</a> •
<a href="#%EF%B8%8F-getting-started">Getting started</a> •
<a href="#-usage">Usage</a> •
<a href="#-contributing">Contributing</a> •
<a href="#-license">License</a>
</p>
## 🚀 Features
- MDX for docs;
- Sidebar customization with Yaml;
## ⚡️ Getting started
Using Yarn:
```sh
yarn add @rocketseat/gatsby-theme-docs-core
```
Using NPM:
```sh
npm i @rocketseat/gatsby-theme-docs-core
```
## 🔥 Usage
### Theme options
| Key | Default | Required | Description |
| ------------- | ------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| basePath | / | No | Root url for all docs |
| configPath | config | No | Location of config files |
| docsPath | docs | No | The site description for SEO and social (FB, Twitter) tags |
| githubUrl | - | - | Deprecated in favor of `repositoryUrl` |
| repositoryUrl | - | No | The URL of your repository (supports GitHub, GitLab and Bitbucket). Example: `https://github/jpedroschmitz/rocketdocs` |
| 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) |
| 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` |
| branch | main | No | Default branch of the repository |
> Note: When adding a BitBucket link on the `repositoryUrl` option, don't add the `src/<branch>` to it.
> Example of correct link: `https://bitbucket.org/jpedroschmitz/rocketdocs`
### Example usage
```js
// gatsby-config.js
module.exports = {
plugins: [
{
resolve: `@rocketseat/gatsby-theme-docs-core`,
options: {
basePath: `documentation`,
configPath: `config`,
docsPath: `docs`,
githubUrl: `https://github.com/jpedroschmitz/rocketdocs`,
baseDir: `www`,
},
},
],
};
```
### Navigation
The 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.
Here is an example:
```yml
# Simple item
- label: 'Home'
link: '/'
# With list of subitems
- label: 'With dropdown'
items:
- label: 'My Example'
link: '/my-example'
```
### `useSidebar`
To get all the sidebar items, you can use the `useSidebar` hook. Example:
```js
import React from 'react';
import { useSidebar } from '@rocketseat/gatsby-theme-docs-core';
export default function Sidebar() {
const data = useSidebar();
console.log(data);
/*
[
{
"node": {
"label": "Home",
"link": "/",
"items": null,
"id": "a2913be3-af3c-5fc9-967e-a058e86b20a9"
}
},
{
"node": {
"label": "With dropdown",
"link": null,
"items": [{ "label": "My Example", "link": "/my-example" }],
"id": "c7d9606c-4bda-5097-a0df-53108e9f4efd"
}
}
]
*/
}
```
### Docs Fields
Inside your docs folder, you can create MDX files. The filename will be the page path.
Add a title to the frontmatter of the MDX file and place the content below it. For example:
```mdx
---
title: 'My Example'
description: 'A simple description for this page'
image: 'banner.png'
disableTableOfContents: false
---
Your amazing page
```
Every file must have a custom title. Description and image are not required.
### Shadowing
Check the [Shadowing in Gatsby Themes](https://www.gatsbyjs.com/docs/themes/shadowing/) docs to understand how to customize this theme!
In 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.
## ✨ Contributing
Thanks 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
[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.
## 📝 License
Licensed under the [MIT License](https://github.com/jpedroschmitz/rocketdocs/blob/main/%40rocketseat/gatsby-theme-docs-core/LICENSE).
---
Made with 💜 by João Pedro
================================================
FILE: @rocketseat/gatsby-theme-docs-core/gatsby-config.js
================================================
const withDefault = require(`./util/with-default`);
const path = require(`path`);
const gfmPlugin = require(`remark-gfm`);
const { rehypeMetaAsAttributes } = require(`./rehype-meta-as-attributes`);
const camelCase = require('lodash.camelcase');
const upperFirst = (text) => text.charAt(0).toUpperCase() + text.slice(1);
module.exports = (options) => {
const {
basePath,
configPath,
docsPath,
yamlFilesPath,
withMdx,
gatsbyRemarkPlugins,
} = withDefault(options);
return {
siteMetadata: {
basePath,
},
plugins: [
`gatsby-transformer-sharp`,
`gatsby-plugin-sharp`,
{
resolve: `gatsby-source-filesystem`,
options: {
name: `docs`,
path: docsPath,
},
},
{
resolve: `gatsby-source-filesystem`,
options: {
name: `config`,
path: configPath,
},
},
{
resolve: `gatsby-source-filesystem`,
options: {
name: `yamlFiles`,
path: yamlFilesPath,
},
},
{
resolve: `gatsby-transformer-yaml`,
options: {
typeName: ({ node, isArray }) => {
if (node.sourceInstanceName === `config`) {
return `SidebarItems`;
}
// Fallback to the existing algorithm from gatsby-transformer-yaml plugin.
// https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-transformer-yaml/src/gatsby-node.js#L22-L28
if (node.internal.type !== `File`) {
return upperFirst(camelCase(`${node.internal.type} Yaml`));
}
// Parsing algorithm: Array of Objects, where each file represents a collection.
if (isArray) {
return upperFirst(camelCase(`${node.name} Yaml`));
}
// Parsing algorithm: Single Object, where each subfolder represents a collection; each file represents one "record".
return upperFirst(camelCase(`${path.basename(node.dir)} Yaml`));
},
},
},
withMdx && {
resolve: `gatsby-plugin-mdx`,
options: {
extensions: [`.mdx`, `.md`],
mdxOptions: {
remarkPlugins: [gfmPlugin],
rehypePlugins: [rehypeMetaAsAttributes],
},
gatsbyRemarkPlugins: [
`gatsby-remark-autolink-headers`,
`gatsby-remark-embedder`,
{
resolve: `gatsby-remark-images`,
options: {
maxWidth: 960,
withWebp: true,
linkImagesToOriginal: false,
},
},
`gatsby-remark-responsive-iframe`,
`gatsby-remark-copy-linked-files`,
...gatsbyRemarkPlugins,
],
},
},
].filter(Boolean),
};
};
================================================
FILE: @rocketseat/gatsby-theme-docs-core/gatsby-node.js
================================================
const path = require(`path`);
const { createFilePath } = require(`gatsby-source-filesystem`);
const fs = require(`fs`);
const urljoin = require(`url-join`);
const { compileMDXWithCustomOptions } = require(`gatsby-plugin-mdx`);
const { normalizeBasePath, resolveLink } = require(`./util/url`);
const withDefault = require(`./util/with-default`);
const { remarkHeadingsPlugin } = require(`./remark-headings-plugin`);
function generateRepositoryEditLink(themeOptions, relativePath) {
const { baseDir, docsPath, repositoryUrl, githubUrl, branch } =
withDefault(themeOptions);
const repoUrl = !repositoryUrl && githubUrl ? githubUrl : repositoryUrl;
const pathToFile = path.join(branch, baseDir, docsPath);
if (repoUrl.includes('github')) {
return {
editUrl: urljoin(repoUrl, `tree`, pathToFile, relativePath),
provider: `GitHub`,
};
}
if (repoUrl.includes('gitlab')) {
return {
editUrl: urljoin(repoUrl, '-', 'blob', pathToFile, relativePath),
provider: `GitLab`,
};
}
if (repoUrl.includes('bitbucket')) {
return {
editUrl: urljoin(repoUrl, 'src', pathToFile, relativePath),
provider: `BitBucket`,
};
}
return {
editUrl: null,
provider: null,
};
}
exports.createPages = (
{ graphql, actions: { createPage }, reporter },
themeOptions,
) => {
reporter.success(`onCreateDocs`);
const { basePath, githubUrl, repositoryUrl } = withDefault(themeOptions);
const docsTemplate = require.resolve(`./src/templates/docs-query.js`);
const homeTemplate = require.resolve(`./src/templates/homepage-query.js`);
return graphql(
`
{
files: allFile(
filter: {
extension: { in: ["md", "mdx"] }
sourceInstanceName: { eq: "docs" }
}
) {
edges {
node {
id
relativePath
childMdx {
fields {
slug
}
internal {
contentFilePath
}
}
}
}
}
sidebar: allSidebarItems {
edges {
node {
label
link
items {
label
link
}
id
}
}
}
homepage: allMdx(filter: { fields: { slug: { eq: "/" } } }) {
nodes {
internal {
contentFilePath
}
}
}
}
`,
).then((result) => {
if (result.errors) {
reporter.panic(
`docs: there was an error loading the docs folder!`,
result.errors,
);
return;
}
if (!repositoryUrl && githubUrl) {
reporter.warn(
`@rocketseat/gatsby-theme-docs: The option \`githubUrl\` was deprecated in favor of \`repositoryUrl\`. \nTo remove this warning, replace \`githubUrl\` with \`repositoryUrl\`.`,
);
}
const homepage = result.data.homepage.nodes[0];
createPage({
path: basePath,
component: `${homeTemplate}?__contentFilePath=${homepage.internal.contentFilePath}`,
context: {},
});
// Generate prev/next items based on sidebar.yml file
const sidebar = result.data.sidebar.edges;
const listOfItems = [];
sidebar.forEach(({ node: { label, link, items } }) => {
if (Array.isArray(items)) {
items.forEach((item) => {
listOfItems.push({
label: item.label,
link: resolveLink(item.link, basePath),
});
});
} else {
listOfItems.push({
label,
link: resolveLink(link, basePath),
});
}
});
// Generate docs pages
const docs = result.data.files.edges;
docs.forEach((doc) => {
const {
childMdx: {
fields: { slug },
internal: { contentFilePath },
},
relativePath,
} = doc.node;
// Get the file edit link based on the repository url
const repositoryEditUrl = generateRepositoryEditLink(
themeOptions,
relativePath,
);
const pageLink = slug.slice(0, slug.length - 1);
const currentPageIndex = listOfItems.findIndex(
(page) => page.link === pageLink,
);
const prev = listOfItems[currentPageIndex - 1];
const next = listOfItems[currentPageIndex + 1];
createPage({
path: slug,
component: `${docsTemplate}?__contentFilePath=${contentFilePath}`,
context: {
slug,
prev,
next,
repositoryEditUrl: repositoryEditUrl.editUrl || '',
repositoryProvider: repositoryEditUrl.provider || '',
},
});
});
reporter.success(`docs pages created`);
});
};
exports.createSchemaCustomization = async ({
getNode,
getNodesByType,
pathPrefix,
reporter,
cache,
actions,
schema,
store,
}) => {
const { createTypes } = actions;
createTypes(`
type MdxFrontmatter {
title: String!
description: String
image: String
disableTableOfContents: Boolean
}
`);
createTypes(`
type SidebarItems implements Node {
label: String!
link: String
items: [SidebarItemsItems]
}
type SidebarItemsItems {
label: String
link: String
}
`);
const headingsResolver = schema.buildObjectType({
name: `Mdx`,
fields: {
headings: {
type: `[MdxHeading]`,
async resolve(mdxNode) {
const fileNode = getNode(mdxNode.parent);
if (!fileNode) {
return null;
}
const result = await compileMDXWithCustomOptions(
{
source: mdxNode.body,
absolutePath: fileNode.absolutePath,
},
{
pluginOptions: {},
customOptions: {
mdxOptions: {
remarkPlugins: [remarkHeadingsPlugin],
},
},
getNode,
getNodesByType,
pathPrefix,
reporter,
cache,
store,
},
);
if (!result) {
return null;
}
return result.metadata.headings;
},
},
},
});
createTypes([
`
type MdxHeading {
value: String
depth: Int
}
`,
headingsResolver,
]);
};
exports.onPreBootstrap = ({ store, reporter }, themeOptions) => {
const { configPath, docsPath, yamlFilesPath } = withDefault(themeOptions);
const { program } = store.getState();
const dirs = [
path.join(program.directory, configPath),
path.join(program.directory, docsPath),
path.join(program.directory, yamlFilesPath),
];
dirs.forEach((dir) => {
if (!fs.existsSync(dir)) {
reporter.success(`docs: initialized the ${dir} directory`);
fs.mkdirSync(dir);
}
});
};
exports.onCreateNode = (
{ node, actions: { createNodeField }, getNode },
themeOptions,
) => {
if (node.internal.type !== `Mdx`) {
return;
}
const { basePath } = withDefault(themeOptions);
let value = createFilePath({ node, getNode });
if (value === 'index') value = '';
createNodeField({
name: `slug`,
node,
value: normalizeBasePath(basePath, value),
});
createNodeField({
name: `id`,
node,
value: node.id,
});
};
================================================
FILE: @rocketseat/gatsby-theme-docs-core/index.js
================================================
export { useSidebar } from './src/hooks/useSidebar';
================================================
FILE: @rocketseat/gatsby-theme-docs-core/package.json
================================================
{
"name": "@rocketseat/gatsby-theme-docs-core",
"version": "4.0.0",
"main": "index.js",
"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.",
"author": "João Pedro Schmitz <hey@joaopedro.dev> (@jpedroschmitz)",
"license": "MIT",
"publishConfig": {
"access": "public"
},
"keywords": [
"documentation",
"open source",
"gatsby",
"gatsby-plugin",
"gatsby-theme",
"react",
"docs",
"mdx"
],
"homepage": "https://github.com/jpedroschmitz/rocketdocs/tree/main/@rocketseat/gatsby-theme-docs-core#readme",
"repository": {
"type": "git",
"url": "https://github.com/jpedroschmitz/rocketdocs.git",
"directory": "@rocketseat/gatsby-theme-docs-core"
},
"bugs": {
"url": "https://github.com/jpedroschmitz/rocketdocs/issues"
},
"dependencies": {
"@mdx-js/mdx": "^1.6.22",
"gatsby-plugin-mdx": "^5.9.0",
"gatsby-plugin-sharp": "^5.9.0",
"gatsby-remark-autolink-headers": "^6.9.0",
"gatsby-remark-copy-linked-files": "^6.9.0",
"gatsby-remark-embedder": "^6.0.1",
"gatsby-remark-images": "^7.9.0",
"gatsby-remark-responsive-iframe": "^6.9.0",
"gatsby-source-filesystem": "^5.9.0",
"gatsby-transformer-sharp": "^5.9.0",
"gatsby-transformer-yaml": "^5.9.0",
"lodash.camelcase": "^4.3.0",
"mdast-util-to-string": "^2",
"remark-gfm": "^1",
"unist-util-visit": "^2",
"url-join": "^4.0.1"
},
"peerDependencies": {
"@mdx-js/react": "^2.3.0",
"gatsby": "^5.0.0",
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
}
================================================
FILE: @rocketseat/gatsby-theme-docs-core/rehype-meta-as-attributes.js
================================================
const visit = require(`unist-util-visit`);
exports.rehypeMetaAsAttributes = function rehypeMetaAsAttributes() {
return (tree) => {
// A regex that looks for a simplified attribute name, optionally followed
// by a double, single, or unquoted attribute value
const re = /\b([-\w]+)(?:=(?:"([^"]*)"|'([^']*)'|([^"'\s]+)))?/g;
// …
visit(tree, 'element', (node) => {
let match;
if (node.tagName === 'code' && node.data && node.data.meta) {
re.lastIndex = 0; // Reset regex.
// eslint-disable-next-line no-cond-assign
while ((match = re.exec(node.data.meta))) {
node.properties[match[1]] = match[2] || match[3] || match[4] || '';
}
}
});
// …
};
};
================================================
FILE: @rocketseat/gatsby-theme-docs-core/remark-headings-plugin.js
================================================
const visit = require(`unist-util-visit`);
const toString = require(`mdast-util-to-string`);
exports.remarkHeadingsPlugin = function remarkHeadingsPlugin() {
return async function transformer(tree, file) {
const headings = [];
visit(tree, `heading`, (heading) => {
headings.push({
value: toString(heading),
depth: heading.depth,
});
});
const mdxFile = file;
if (!mdxFile.data.meta) {
mdxFile.data.meta = {};
}
mdxFile.data.meta.headings = headings;
};
};
================================================
FILE: @rocketseat/gatsby-theme-docs-core/src/components/Docs.js
================================================
/* eslint-disable react/prop-types */
import React from 'react';
export default function Docspage({ data }) {
return <pre>{JSON.stringify(data, null, 2)}</pre>;
}
================================================
FILE: @rocketseat/gatsby-theme-docs-core/src/components/Homepage.js
================================================
/* eslint-disable react/prop-types */
import React from 'react';
export default function Homepage({ data }) {
return <pre>{JSON.stringify(data, null, 2)}</pre>;
}
================================================
FILE: @rocketseat/gatsby-theme-docs-core/src/hooks/useSidebar.js
================================================
import { graphql, useStaticQuery } from 'gatsby';
import { resolveLink } from '../../util/url';
export function useSidebar() {
const data = useStaticQuery(graphql`
{
allSidebarItems {
edges {
node {
label
link
items {
label
link
}
id
}
}
}
site {
siteMetadata {
basePath
}
}
}
`);
const { basePath } = data.site.siteMetadata;
const {
allSidebarItems: { edges },
} = data;
if (basePath) {
const normalizedSidebar = edges.map(
({ node: { label, link, items, id } }) => {
if (Array.isArray(items)) {
items = items.map((item) => ({
label: item.label,
link: resolveLink(item.link, basePath),
}));
}
return {
node: {
id,
label,
items,
link: resolveLink(link, basePath),
},
};
},
);
return normalizedSidebar;
}
return edges;
}
================================================
FILE: @rocketseat/gatsby-theme-docs-core/src/templates/docs-query.js
================================================
import { graphql } from 'gatsby';
import DocsComponent from '../components/Docs';
export default DocsComponent;
export const query = graphql`
query ($slug: String!) {
mdx(fields: { slug: { eq: $slug } }) {
id
excerpt(pruneLength: 160)
fields {
slug
}
frontmatter {
title
description
image
disableTableOfContents
}
headings {
depth
value
}
}
}
`;
================================================
FILE: @rocketseat/gatsby-theme-docs-core/src/templates/homepage-query.js
================================================
import HomepageComponent from '../components/Homepage';
export default HomepageComponent;
================================================
FILE: @rocketseat/gatsby-theme-docs-core/util/url.js
================================================
function normalizeBasePath(basePath, link) {
return `/${basePath}/${link}`.replace(/\/\/+/g, `/`);
}
function isExternalUrl(url) {
return /^((https?:)?\/\/)/i.test(url);
}
function resolveLink(link, basePath) {
return isExternalUrl(link) ? link : normalizeBasePath(basePath, link);
}
module.exports = { resolveLink, normalizeBasePath, isExternalUrl };
================================================
FILE: @rocketseat/gatsby-theme-docs-core/util/with-default.js
================================================
module.exports = (themeOptions) => {
const basePath = themeOptions.basePath || `/`;
const homePath = themeOptions.homePath || ``;
const configPath = themeOptions.configPath || `config`;
const docsPath = themeOptions.docsPath || `docs`;
const yamlFilesPath = themeOptions.yamlFilesPath || `yamlFiles`;
const branch = themeOptions.branch || `main`;
const baseDir = themeOptions.baseDir || ``;
const withMdx =
themeOptions.withMdx === undefined ? true : themeOptions.withMdx;
const gatsbyRemarkPlugins = themeOptions.gatsbyRemarkPlugins || [];
const { githubUrl, repositoryUrl = '' } = themeOptions;
return {
basePath,
homePath,
configPath,
docsPath,
yamlFilesPath,
baseDir,
githubUrl,
repositoryUrl,
withMdx,
branch,
gatsbyRemarkPlugins,
};
};
================================================
FILE: LICENSE.md
================================================
MIT License
Copyright (c) 2021 João Pedro Schmitz
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: README.md
================================================
<h1 align="center">
<!-- <br> -->
<!-- <img src="https://storage.googleapis.com/golden-wind/github/gatsby-themes-logo.svg" alt="Rocketseat and Gatsby" width="260"> -->
<!-- <br> -->
Rocket Docs
<br>
</h1>
<h4 align="center">Easy to use Gatsby Theme to create documentation websites ⚡️🔥</h4>
<p align="center">
<img src="https://img.shields.io/badge/PRs-welcome-%238257E6.svg" alt="PRs welcome!" />
<img alt="License" src="https://img.shields.io/badge/license-MIT-%238257E6">
<a href="https://twitter.com/intent/follow?screen_name=jpedroschmitz">
<img src="https://img.shields.io/twitter/follow/jpedroschmitz.svg?label=Follow%20@jpedroschmitz" alt="Follow @jpedroschmitz" />
</a>
</p>
<p align="center">
<a href="#themes">Themes</a> •
<a href="#contributing">Contributing</a> •
<a href="#need-help">Need help?</a> •
<a href="#license">License</a>
</p>
## Themes
🚀 [`gatsby-theme-docs-core`](./@rocketseat/gatsby-theme-docs-core): The core theme for docs websites that includes all the data structures you need.
🚀 [`gatsby-theme-docs`](./@rocketseat/gatsby-theme-docs): Out of the box Gatsby Theme for creating documentation websites easily and quickly.
## Contributing
Thanks 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
[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.
## Need help?
If you need help, feel free to open an issue with a description of the problem
you're facing or, if you prefer, you can chat with us on our
[forum](https://github.com/jpedroschmitz/rocketdocs/discussions).
## Sponsors
<table>
<tr>
<td>
<a aria-label="Rocketseat" href="https://rocketseat.com.br?utm_source=rocketdocs&utm_medium=sponsorship&utm_campaign=rocketdocs_sponsorship">
<img alt="" src="./.github/rocketseat.svg">
</a>
</td>
</tr>
</table>
## Thanks
The following Open Source projects heavily inspire this project! Thanks, Apollo and LekoArts!
- [LekoArts Gatsby themes](https://github.com/LekoArts/gatsby-themes)
- [Apollo Gatsby themes](https://github.com/apollographql/gatsby-theme-apollo)
## License
MIT © [João Pedro](https://github.com/jpedroschmitz)
================================================
FILE: examples/gatsby-theme-docs/.gitignore
================================================
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Typescript v1 declaration files
typings/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# dotenv environment variable files
.env*
# gatsby files
.cache/
public
# Mac files
.DS_Store
# Yarn
yarn-error.log
.pnp/
.pnp.js
# Yarn Integrity file
.yarn-integrity
================================================
FILE: examples/gatsby-theme-docs/LICENSE
================================================
MIT License
Copyright (c) 2021 João Pedro
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: examples/gatsby-theme-docs/README.md
================================================
<p align="center">
<img src="https://rocketseat-cdn.s3-sa-east-1.amazonaws.com/theme-docs.svg" alt="A illustration of file that is the @rocketseat/gatsby-theme-docs logo" width="100">
</p>
<h2 align="center">
Gatsby Starter: Rocket Docs
</h2>
<p align="center">
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: <a href="https://github.com/jpedroschmitz/rocketdocs/tree/main/%40rocketseat/gatsby-theme-docs">@rocketseat/gatsby-theme-docs</a>
</p>
<p align="center">
<img src="https://img.shields.io/badge/PRs-welcome-%238257E6.svg" alt="PRs welcome!" />
<img alt="License" src="https://img.shields.io/badge/license-MIT-%238257E6">
<a href="https://twitter.com/intent/follow?screen_name=jpedroschmitz">
<img src="https://img.shields.io/twitter/follow/jpedroschmitz.svg?label=Follow%20@jpedroschmitz" alt="Follow @jpedroschmitz" />
</a>
</p>
## 🚀 Features
- 📝 MDX for docs;
- 🛣 Yaml-based sidebar navigation;
- 📱 Responsive and mobile friendly;
- 🖥 Code highlighting with [prism-react-renderer](https://github.com/FormidableLabs/prism-react-renderer) and [react-live](https://github.com/FormidableLabs/react-live) support;
- 🥇 SEO (Sitemap, schema.org data, Open Graph and Twitter tags).
- 📈 Google Analytics support;
- 📄 Custom docs schema;
- 🖱 Table of Contents;
- ⚡️ Offline Support & WebApp Manifest;
- and much more 🔥
## ⚡️ Getting started
1. Create the website.
```sh
npx gatsby new rocketdocs https://github.com/jpedroschmitz/gatsby-starter-rocketdocs
```
2. Start developing.
```sh
cd rocketdocs
gatsby develop
```
3. Are you ready for launch?
Your site is now running at `http://localhost:8000`
## 📄 Docs
Looking for docs? Check our live demo and documentation [website](https://rocketdocs.netlify.app).
---
Made with 💜 by João Pedro
================================================
FILE: examples/gatsby-theme-docs/gatsby-config.js
================================================
module.exports = {
siteMetadata: {
siteTitle: `Rocket Docs`,
defaultTitle: `Rocket Docs`,
siteTitleShort: `Rocket Docs`,
siteDescription: `Out of the box Gatsby Theme for creating documentation websites easily and quickly`,
siteUrl: `https://rocketdocs.netlify.app`,
siteAuthor: `@jpedroschmitz`,
siteImage: `/banner.png`,
siteLanguage: `en`,
themeColor: `#8257E6`,
basePath: `/`,
},
plugins: [
{
resolve: `@rocketseat/gatsby-theme-docs`,
options: {
configPath: `src/config`,
docsPath: `src/docs`,
homePath: `src/home`,
yamlFilesPath: `src/yamlFiles`,
repositoryUrl: `https://github.com/jpedroschmitz/rocketdocs`,
baseDir: `examples/gatsby-theme-docs`,
gatsbyRemarkPlugins: [],
},
},
{
resolve: `gatsby-plugin-manifest`,
options: {
name: `Rocket Docs`,
short_name: `Rocket Docs`,
start_url: `/`,
background_color: `#ffffff`,
display: `standalone`,
icon: `static/favicon.png`,
},
},
`gatsby-plugin-sitemap`,
// {
// resolve: `gatsby-plugin-google-analytics`,
// options: {
// trackingId: `YOUR_ANALYTICS_ID`,
// },
// },
`gatsby-plugin-remove-trailing-slashes`,
{
resolve: `gatsby-plugin-canonical-urls`,
options: {
siteUrl: `https://rocketdocs.netlify.app`,
},
},
`gatsby-plugin-offline`,
],
};
================================================
FILE: examples/gatsby-theme-docs/package.json
================================================
{
"name": "gatsby-starter-rocketdocs",
"private": true,
"version": "1.0.0",
"description": "Out of the box Gatsby Starter for creating documentation websites easily and quickly. With support for MDX, code highlight, Analytics, SEO and more",
"author": "João Pedro Schmitz <hey@joaopedro.dev> (@jpedroschmitz)",
"license": "MIT",
"starter-name": "gatsby-starter-rocketdocs",
"dependencies": {
"@rocketseat/gatsby-theme-docs": "^4.0.1",
"gatsby": "^5.9.0",
"gatsby-plugin-canonical-urls": "^5.9.0",
"gatsby-plugin-google-analytics": "^5.9.0",
"gatsby-plugin-manifest": "^5.9.0",
"gatsby-plugin-offline": "^6.9.0",
"gatsby-plugin-remove-trailing-slashes": "^4.2.0",
"gatsby-plugin-sitemap": "^6.9.0",
"prop-types": "^15.8.1",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {},
"keywords": [
"gatsby",
"gatsby-starter"
],
"scripts": {
"build": "gatsby build",
"start": "gatsby develop",
"serve": "gatsby serve",
"clean": "gatsby clean"
}
}
================================================
FILE: examples/gatsby-theme-docs/src/config/sidebar.yml
================================================
# Sidebar navigation
- label: 'Introduction'
link: '/'
- label: 'Getting started'
link: '/getting-started'
- label: Usage
items:
- label: 'Creating docs'
link: '/usage/creating-docs'
- label: 'Navigation'
link: '/usage/navigation'
- label: 'Customizing'
link: '/usage/customizing'
- label: 'Using YAML files'
link: '/usage/using-yaml-files'
- label: 'Remark Plugins'
link: '/usage/remark-plugins'
- label: More
items:
- label: FAQ
link: /faq
- label: 'Github'
link: https://github.com/jpedroschmitz/rocketdocs
================================================
FILE: examples/gatsby-theme-docs/src/docs/faq.mdx
================================================
---
title: Frequently Asked Questions
description: Frequently asked questions about the theme.
disableTableOfContents: true
---
## Will be included search or dark mode?
This theme is a great and complete option to build simple documentation websites.
We don't plan anymore to include search, dark mode or i18n to the project.
Remember that if necessary, you can change colors and include a default
dark theme. To do so, check this [doc](/usage/shadowing#changing-theme-colors).
## How can I deploy my website?
To deploy this project, we recommend you take a look at this extensive documentation
hosted on [Gatsby website](https://www.gatsbyjs.com/docs/deploying-and-hosting/). It
includes deploy tutorials for many services, like [Vercel](https://vercel.com/),
[Netlify](https://www.netlify.com/), [GitHub Pages](https://pages.github.com/) and others.
## What are good examples of the theme usage?
- [Botmation](https://botmation.dev)
- [Capmonster.cloud for Python](https://capmonster-python.alperenn.com/)
- [ESPHome Devices](https://devices.esphome.io/)
- [Label U](https://opendatalab.github.io/labelU-Kit/)
- [React Observing](https://react-observing.web.app/)
- [RudderStack Docs](https://rudderstack.com/docs/)
- [Unform](https://unform.dev)
- [Use Pandas](https://www.usepandas.com/)
- [golangci-lint](https://golangci-lint.run/)
- [use-cloudinary](https://use-cloudinary.netlify.app/)
ps: 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).
================================================
FILE: examples/gatsby-theme-docs/src/docs/getting-started.mdx
================================================
---
title: 'Getting started'
description: Learn how to get started with Rocket Docs.
---
> Rocket Docs is ready for Gatsby v5. New projects will use the new version!
The best way to start is by using our starter:
```bash
npx gatsby new rocketdocs https://github.com/jpedroschmitz/gatsby-starter-rocketdocs
```
But, if you prefer, you can install and configure manually.
#### Using Yarn:
```bash
yarn add @rocketseat/gatsby-theme-docs
```
#### Using NPM:
```bash
npm i @rocketseat/gatsby-theme-docs
```
## Theme Options
| Key | Default | Required | Description |
| ------------- | ------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| basePath | / | No | Root url for all docs |
| configPath | config | No | Location of config files |
| docsPath | docs | No | The site description for SEO and social (FB, Twitter) tags |
| homePath | - | No | Location of home file |
| githubUrl | - | - | Deprecated in favor of `repositoryUrl` |
| repositoryUrl | - | No | The complete URL of your repository (supports GitHub, GitLab and Bitbucket). Example: `https://github/jpedroschmitz/rocketdocs` |
| 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`) |
| 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` |
| branch | main | No | Default branch of the repository |
<br />
> Note: When adding a BitBucket link on the `repositoryUrl` option, don't add the `src/<branch>` to it.
> Example of correct link: <br /> `https://bitbucket.org/jpedroschmitz/rocketdocs`
## Example usage
```js title=gatsby-config.js
module.exports = {
siteMetadata: {
siteTitle: `@rocketseat/gatsby-theme-docs`,
defaultTitle: `@rocketseat/gatsby-theme-docs`,
siteTitleShort: `gatsby-theme-docs`,
siteDescription: `Out of the box Gatsby Theme for creating documentation websites easily and quickly`,
siteUrl: `https://rocketdocs.netlify.app`,
siteAuthor: `@jpedroschmitz`,
siteImage: `/banner.png`,
siteLanguage: `en`,
themeColor: `#8257E6`,
basePath: `/`,
},
plugins: [
{
resolve: `@rocketseat/gatsby-theme-docs`,
options: {
basePath: `/`,
configPath: `src/config`,
docsPath: `src/docs`,
homePath: `src/home`,
repositoryUrl: `https://github.com/jpedroschmitz/rocketdocs`,
baseDir: `examples/gatsby-theme-docs`,
},
},
],
};
```
Once you have installed the dependencies you will need to create the [navigation](/usage/navigation) and [documentation](/usage/creating-docs) files.
================================================
FILE: examples/gatsby-theme-docs/src/docs/usage/creating-docs.mdx
================================================
---
title: Creating docs
description: Learn how to create docs using Rocket Docs.
---
All MDX files created inside your docs folder will become pages, with the path defined by the filename.
Inside all docs files, you can define the following options:
| Key | Required | Description |
| ---------------------- | -------- | -------------------------- |
| title | Yes | No |
| description | No | Page description |
| image | No | Used for og:image |
| disableTableOfContents | No | Disables Table Of Contents |
## Example
```mdx
---
title: 'My Example'
description: 'A simple description for this page'
image: /banner.jpeg
disableTableOfContents: false
---
Wow, this is a nice page
```
## Embedding files
In a documentation website, sometimes you will need to embed well known services (like CodeSandbox, Twitter, or others...). If you need to
do it, you can simply copy-paste the link (powered by the awesome [gatsby-remark-embeder](https://www.gatsbyjs.com/packages/gatsby-remark-embedder/)).
Make sure to check the [supported services](https://github.com/MichaelDeBoey/gatsby-remark-embedder#supported-services).
https://youtu.be/QfcozcbDhNM
## Code Highlight
We support many options for code components.
### Title
To show a title, just add it to your code block. Ex: `title=src/myfile.css`
```css title=src/myfile.css
.gatsby::before {
content: 'niceee...';
}
```
### Line numbers
To add line numbers for that code block, pass an option `lineNumbers=true`.
```js lineNumbers=true
const rocket = {
launch: () => console.log('Launching...'),
};
rocket.launch();
```
### React live
As mentioned in the introduction, this theme uses `react-live`, so you can
create a playground for live editing React components.
To use it, just add a `live=true` option to your code block.
```jsx lineNumbers=true title=gatsby-config.js live=true
function MyComponent() {
function handleButtonClick() {
alert('wowww');
}
return <button onClick={handleButtonClick}>Hey, click me!</button>;
}
render(<MyComponent />);
```
> If you need to add elements to the scope, check this [guide](/usage/shadowing#adding-elements-to-react-live-scope).
### Highlight lines
To highlight lines, you can pass ranges to a `highlight` option.
For example `highlight={1-4,6-7,9}` on the code below would result in:
```jsx highlight={1-4,6-7,9}
function MyComponent() {
function handleButtonClick() {
alert('wowww');
}
return <button onClick={handleButtonClick}>Hey, click me!</button>;
}
render(<MyComponent />);
```
================================================
FILE: examples/gatsby-theme-docs/src/docs/usage/customizing.mdx
================================================
---
title: Customizing
description: Rocket Docs allows to customize the look by using Gatsby theme shadowing feature.
---
To shadow/override this theme, you will need to place your files into `src/@rocketseat/gatsby-theme-docs` folder.
If you don't know what shadowing is, or have questions about it, [check this tutorial](https://www.gatsbyjs.com/docs/themes/shadowing/) from the Gatsby documentation.
## Changing the logo
If you want to change the logo just create the following file:
```js title=src/@rocketseat/gatsby-theme-docs/components/Logo.js
import React from 'react';
export default function Logo(props) {
return (
<svg width={180} height={34} viewBox="0 0 180 34" fill="none" {...props}>
<path
d="M37.504 9.983c-1.515 0-2.763 1.204-2.763 2.723v11.521h2.763v-11.52h6.589V9.982h-6.589zM60.566 17.079V12.68c0-1.492-1.222-2.723-2.763-2.723h-8.927c-1.515 0-2.764 1.204-2.764 2.723v8.798c0 1.492 1.223 2.723 2.764 2.723h8.927c1.515 0 2.763-1.205 2.763-2.723v-4.4zm-2.763 0v4.399h-8.927V12.68h8.927v4.399zM66.093 9.983c-1.515 0-2.764 1.204-2.764 2.723v8.798c0 1.492 1.223 2.723 2.764 2.723l9.724-.13v-2.593h-9.724v-8.798h9.724v-2.592l-9.724-.131zM91.655 9.983H87.91l-5.474 5.734h-1.089V9.983h-2.763v14.218h2.763v-5.76H82.94l5.686 5.76h3.8l-7.307-7.436 6.536-6.782zM95.77 21.478V18.44l11.692-.13v-5.63c0-1.492-1.223-2.723-2.764-2.723h-8.927c-1.515 0-2.763 1.204-2.763 2.723v8.798c0 1.492 1.222 2.723 2.763 2.723l11.691-.131v-2.592H95.771zm0-8.798h8.928v3.037h-8.927V12.68zM114.396 5.82h-1.063l-1.7 2.069v2.068h-2.099v2.723l2.099-.026v8.824c0 1.493 1.222 2.723 2.763 2.723l4.464-.13v-2.593h-4.464v-8.85l4.862-.079V9.957h-4.862V5.82zM133.819 18.44c0-1.492-1.223-2.723-2.764-2.723h-6.961V12.68h9.725v-2.592l-9.725-.131c-1.514 0-2.763 1.204-2.763 2.723v3.037c0 1.493 1.222 2.723 2.763 2.723h6.961v3.038h-9.724v2.592l9.724.13c1.515 0 2.764-1.204 2.764-2.722V18.44zM148.246 9.983h-8.928c-1.514 0-2.763 1.204-2.763 2.723v8.798c0 1.492 1.222 2.723 2.763 2.723l11.691-.13v-2.593h-11.691v-3.037l11.691-.131v-5.63c0-1.518-1.222-2.723-2.763-2.723zm0 5.734h-8.928V12.68h8.928v3.037zM165.463 9.983l-11.691.13v2.593h11.691v3.037l-11.691.131v5.63c0 1.492 1.222 2.723 2.763 2.723h8.928c1.514 0 2.763-1.204 2.763-2.723v-8.798a2.759 2.759 0 00-2.763-2.723zm0 11.495h-8.928V18.44h8.928v3.038zM175.138 12.628l4.862-.079V9.957h-4.862V5.794h-1.063l-1.7 2.068v2.069h-2.099v2.723l2.099-.026v8.824c0 1.492 1.222 2.723 2.763 2.723l4.463-.131v-2.592h-4.463v-8.824z"
fill="#121214"
/>
<path
d="M27.434.662l-4.49-.655a.389.389 0 00-.319.079l-1.913 2.46a.593.593 0 00-.106.55c.053.184-.106.341-.292.315l-1.568-.34a.657.657 0 00-.664.235l-6.217 7.855c-.107.157-.32.21-.505.131l-2.365-1.047a.62.62 0 00-.637.052l-1.196.812a.669.669 0 01-.664.052l-.585-.288a.666.666 0 00-.93.42l-.425 1.858c-.106.445.08.89.478 1.126l.904.55 2.896 1.754 1.408.864c.399.236.903.184 1.249-.104l2.364-2.043c.186-.157.479-.21.691-.078l.718.366a.61.61 0 00.717-.104l1.196-1.1a.618.618 0 01.69-.105l1.78.812c.266.13.585.052.771-.183l.824-1.048 6.244-7.881a.636.636 0 00-.372-1.021l-1.382-.314c-.292-.053-.425-.42-.213-.629l2.153-2.644c.212-.315.08-.655-.24-.707zM6.843 16.529c-.133-.078-.266.052-.213.183l.664 1.728c.054.131.054.262.027.393l-.585 2.252c-.026.157.027.314.133.393l1.674 1.283c.16.105.372.105.505-.026l1.754-1.52c.106-.078.239-.13.345-.156l1.993-.21c.133-.026.186-.21.053-.288l-6.35-4.032zM6.258 22.342a.43.43 0 00-.398-.052l-1.408.68c-.08.026-.133.105-.186.184l-3.003 7.305v.052c.027.026.053.053.107.053l.69-.262h.08c.027.026.053.078.027.105L.014 33.889c-.053.078.054.157.107.078l7.785-7.698a.496.496 0 00.133-.261l.159-1.99a.43.43 0 00-.133-.315l-1.807-1.361z"
fill="#8257E6"
/>
</svg>
);
}
```
If your logo is a png, you could use it like this:
```js title=src/@rocketseat/gatsby-theme-docs/components/Logo.js
import React from 'react';
// Path to the logo file on your project
import rocketseatLogo from 'assets/logo.png';
const Logo = () => (
<img src={rocketseatLogo} alt="Rocketseat logo" style={{ width: 180 }} />
);
export default Logo;
```
## Changing the home text
Create a file at `src/docs/index.mdx` with the text. Next, add the `homePath: 'src/home'` setting in the plugin options. Example:
```mdx title=src/docs/index.mdx
# Introduction
My awesome project!
import Navigation from '@rocketseat/gatsby-theme-docs/src/components/Docs/PostNav';
<Navigation
prev={null}
next={{
label: 'Installation',
link: '/installation',
}}
/>
```
## Changing theme colors
We use Emotion for theming. To change the theme colors, create a file under `src/@rocketseat/gatsby-theme-docs/styles/theme.js`.
Remember that you need to restart your server to see the update.
```js title=src/@rocketseat/gatsby-theme-docs/styles/theme.js
export default {
colors: {
primary: '#8257E6',
background: '#FFFFFF',
shape: `#F2F2FA`,
title: `#3D3D4D`,
text: `#6C6C80`,
components: {
blockquote: {
background: `#332616`,
text: `#E1E1E6`,
},
},
},
};
```
## Changing the font family
You can also change the default font family of the theme.
To do this, create a file under `src/@rocketseat/gatsby-theme-docs/styles/theme.js` (or add to the existing default object if you already started customizing the theme).
```js title=src/@rocketseat/gatsby-theme-docs/styles/theme.js
export default {
fonts: {
fontFace: {
family: 'Roboto',
file: '/fonts/roboto-regular-webfont',
},
body: 'Roboto',
},
};
```
The `fontFace` property will define the name of the font family for later use, while the `file` property will provide the path and file name of the font files.
Font files should be placed in the [`static`](https://www.gatsbyjs.com/docs/how-to/images-and-media/static-folder/) folder in the root of the project (or a subfolder therein, eg. `fonts`), and their path specified accordingly.
```
.
└── static
└── fonts
├── roboto-regular-webfont.eot
├── roboto-regular-webfont.svg
├── roboto-regular-webfont.ttf
├── roboto-regular-webfont.woff
└── roboto-regular-webfont.woff2
```
## Adding elements to React Live scope
By default we add some elements to React Live Scope. If you need to add more, just
shadow the following file:
```js title=src/@rocketseat/gatsby-theme-docs/components/Code/LiveCodeScope.js
import { mdx } from '@mdx-js/react';
import { css, jsx } from '@emotion/react';
export default {
css,
jsx,
mdx,
};
```
If you want to know more about Scope, [check this explanation](https://github.com/FormidableLabs/react-live#how-does-the-scope-work).
================================================
FILE: examples/gatsby-theme-docs/src/docs/usage/navigation.mdx
================================================
---
title: Navigation
description: How to use the sidebar.yml file from Rocket Docs.
---
To add items on the sidebar, it's necessary you create a `sidebar.yml` file under the config folder. Example:
```yaml title=sidebar.yml
# Just a simple item
- label: 'Home'
link: '/'
# With a list of items
- label: 'With subitems'
items:
- label: 'My Example'
link: '/my-example'
```
If necessary, you can also add external links:
```yaml
- label: 'GitHub'
link: 'https://github.com/jpedroschmitz'
```
================================================
FILE: examples/gatsby-theme-docs/src/docs/usage/remark-plugins.md
================================================
---
title: Remark plugins
description: Learn how to use Remark plugins in Rocket Docs.
---
To use a Remark plugin, you need to set the plugin name on this theme's `gatsbyRemarkPlugins` option.
## Example usage
Given that we want to use [Graphviz](https://graphviz.org/) in our Markdown files, we need to install the Remark plugin and add it on to `gatsbyRemarkPlugins` option on `gatsby.config.js`.
```sh
# Using Yarn:
yarn add gatsby-remark-graphviz
# Using NPM:
npm i gatsby-remark-graphviz
```
```js title=gatsby-config.js
module.exports = {
siteMetadata: {
// ...
},
plugins: [
{
resolve: `@rocketseat/gatsby-theme-docs`,
options: {
// ...
gatsbyRemarkPlugins: [
{
`gatsby-remark-graphviz`,
}
]
},
}
]
}
```
## Using a custom Remark Transformer plugin
If you use a local plugin, you must point to its location in the project through `require.resolve`.
```js title=gatsby-config.js
module.exports = {
siteMetadata: {
// ...
},
plugins: [
{
resolve: `@rocketseat/gatsby-theme-docs`,
options: {
// ...
gatsbyRemarkPlugins: [
{
`gatsby-remark-graphviz`,
resolve: require.resolve(`./plugins/gatsby-remark-purple-headers`)
}
]
},
}
]
}
```
For more information on how to create a Remark Transformer plugin, please refer to the [Creating a Remark Transformer Plugin](https://www.gatsbyjs.com/tutorial/remark-plugin-tutorial/) document.
================================================
FILE: examples/gatsby-theme-docs/src/docs/usage/using-yaml-files.md
================================================
---
title: Using YAML files
description: Learn how to YAML files in Rocket Docs.
---
To use YAML files, create a new YAML file in a `yamlFiles` folder and it will be exposed as `all{FileName}Yaml` GraphQL node.
To store YAML in another folder, please change `yamlFilesPath` option of `@rocketseat/gatsby-theme-docs` plugin which is configured in `gatsby.config.js`.
## Example file
If our project has `letters.yml` or `letters.yaml` under a `yamlFiles` folder which looks like:
```yml
- character: a
- character: b
- character: c
```
Then the following three nodes would be created:
```json
[
{
"character": "a"
},
{
"character": "b"
},
{
"character": "c"
}
]
```
## Query GraphQL node
We can query the GraphQL nodes which is created from the YAML file as the following code:
```graphql
{
allLettersYaml {
edges {
node {
character
}
}
}
}
```
Which would return:
```json
{
"allLettersYaml": {
"edges": [
{
"node": {
"character": "a"
}
},
{
"node": {
"character": "b"
}
},
{
"node": {
"character": "c"
}
}
]
}
}
```
More information, please refer to [gatsby-transformer-yaml plugin page](https://www.gatsbyjs.com/plugins/gatsby-transformer-yaml/).
================================================
FILE: examples/gatsby-theme-docs/src/home/index.mdx
================================================
# Introduction
Rocket Docs is a complete and awesome Gatsby Theme for documentation websites. We've
developed it to be easy to use and customize. Forget about other
things and focus on what matters: **writing docs.**
## Features
- ⚛️ Ready for Gatsby v5;
- 📝 MDX for docs;
- 🛣 Yaml-based sidebar navigation;
- 📱 Responsive and mobile friendly;
- 🖥 Code highlighting with [prism-react-renderer](https://github.com/FormidableLabs/prism-react-renderer) and [react-live](https://github.com/FormidableLabs/react-live) support;
- 🥇 SEO (Sitemap, schema.org data, Open Graph and Twitter tags).
- 📈 Google Analytics support;
- 📄 Custom docs schema;
- 🖱 Table of Contents;
- ⚡️ Offline Support & WebApp Manifest;
- and much more 🔥
<br />
[Get started now!](/getting-started)
================================================
FILE: examples/gatsby-theme-docs/src/pages/404.js
================================================
import React from 'react';
import { Link } from 'gatsby';
import Layout from '@rocketseat/gatsby-theme-docs/src/components/Layout';
import Seo from '@rocketseat/gatsby-theme-docs/src/components/SEO';
export default function NotFound() {
return (
<Layout title="Page not found!">
<Seo title="404: Not found" />
<p>You just hit a route that doesn't exist... the sadness.</p>
<p>
If you'd like to go back to homepage, <Link to="/">click here</Link>
.
</p>
</Layout>
);
}
================================================
FILE: examples/gatsby-theme-docs/src/yamlFiles/letters.yml
================================================
- character: a
- character: b
- character: c
================================================
FILE: package.json
================================================
{
"name": "root",
"private": true,
"scripts": {
"lint": "eslint --ignore-path .gitignore \"**/*.+(ts|js|tsx|jsx)\"",
"format": "prettier --ignore-path .gitignore \"**/*.+(ts|js|tsx|jsx)\" --write",
"postinstall": "husky install",
"changeset": "changeset",
"version-packages": "changeset version",
"release": "changeset publish",
"commit": "cz"
},
"engines": {
"node": ">=14.15.0"
},
"workspaces": [
"@rocketseat/*",
"examples/*"
],
"lint-staged": {
"**/*.{ts,js,jsx,tsx}": [
"yarn lint --fix",
"yarn format"
],
"*.{md,mdx,json,yaml}": [
"prettier \"**/*.{md,mdx,json,yaml}\" --write"
]
},
"config": {
"commitizen": {
"path": "cz-conventional-changelog"
}
},
"devDependencies": {
"@changesets/changelog-github": "^0.4.0",
"@changesets/cli": "^2.14.1",
"@commitlint/cli": "16.3.0",
"@commitlint/config-conventional": "16.2.4",
"commitizen": "4.2.4",
"cz-conventional-changelog": "3.3.0",
"eslint": "8.15.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-import": "2.26.0",
"eslint-plugin-jsx-a11y": "6.5.1",
"eslint-plugin-prettier": "4.0.0",
"eslint-plugin-react": "7.29.4",
"eslint-plugin-react-hooks": "4.5.0",
"eslint-utils": "^3.0.0",
"husky": "7.0.4",
"lint-staged": "12.4.1",
"prettier": "2.6.2"
}
}
gitextract_pvqa2e3n/ ├── .changeset/ │ ├── README.md │ └── config.json ├── .commitlintrc.json ├── .editorconfig ├── .eslintrc ├── .github/ │ ├── CODEOWNERS │ ├── CODE_OF_CONDUCT.md │ ├── CONTRIBUTING.md │ ├── ISSUE_TEMPLATE/ │ │ ├── bug_report.md │ │ ├── config.yml │ │ ├── documentation-report.md │ │ ├── enhancement-request.md │ │ └── question.md │ ├── PULL_REQUEST_TEMPLATE │ ├── labeler.json │ ├── lock.yml │ └── workflows/ │ ├── commit.yml │ ├── lint.yml │ ├── publish-starters.yml │ └── release.yml ├── .gitignore ├── .husky/ │ ├── .gitignore │ ├── commit-msg │ ├── common.sh │ └── pre-commit ├── .prettierrc ├── @rocketseat/ │ ├── gatsby-theme-docs/ │ │ ├── .npmignore │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── README.md │ │ ├── gatsby/ │ │ │ ├── wrapPageElement.js │ │ │ └── wrapRootElement.js │ │ ├── gatsby-browser.js │ │ ├── gatsby-config.js │ │ ├── gatsby-ssr.js │ │ ├── index.js │ │ ├── package.json │ │ └── src/ │ │ ├── @rocketseat/ │ │ │ └── gatsby-theme-docs-core/ │ │ │ └── components/ │ │ │ ├── Docs.js │ │ │ └── Homepage.js │ │ ├── components/ │ │ │ ├── Code/ │ │ │ │ ├── LiveCodeScope.js │ │ │ │ ├── index.js │ │ │ │ └── styles.js │ │ │ ├── Docs/ │ │ │ │ ├── EditGithub.js │ │ │ │ ├── PostNav/ │ │ │ │ │ ├── index.js │ │ │ │ │ └── styles.js │ │ │ │ ├── TOC/ │ │ │ │ │ ├── index.js │ │ │ │ │ └── styles.js │ │ │ │ └── index.js │ │ │ ├── Header.js │ │ │ ├── Homepage.js │ │ │ ├── Layout/ │ │ │ │ ├── index.js │ │ │ │ └── styles.js │ │ │ ├── Logo.js │ │ │ ├── Overlay.js │ │ │ ├── SEO.js │ │ │ └── Sidebar/ │ │ │ ├── ExternalLink/ │ │ │ │ └── index.js │ │ │ ├── InternalLink/ │ │ │ │ └── index.js │ │ │ ├── index.js │ │ │ └── styles.js │ │ ├── styles/ │ │ │ ├── global.js │ │ │ └── theme.js │ │ ├── text/ │ │ │ └── index.mdx │ │ └── util/ │ │ ├── copy-to-clipboard.js │ │ ├── slug.js │ │ └── url.js │ └── gatsby-theme-docs-core/ │ ├── .npmignore │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── gatsby-config.js │ ├── gatsby-node.js │ ├── index.js │ ├── package.json │ ├── rehype-meta-as-attributes.js │ ├── remark-headings-plugin.js │ ├── src/ │ │ ├── components/ │ │ │ ├── Docs.js │ │ │ └── Homepage.js │ │ ├── hooks/ │ │ │ └── useSidebar.js │ │ └── templates/ │ │ ├── docs-query.js │ │ └── homepage-query.js │ └── util/ │ ├── url.js │ └── with-default.js ├── LICENSE.md ├── README.md ├── examples/ │ └── gatsby-theme-docs/ │ ├── .gitignore │ ├── LICENSE │ ├── README.md │ ├── gatsby-config.js │ ├── package.json │ └── src/ │ ├── config/ │ │ └── sidebar.yml │ ├── docs/ │ │ ├── faq.mdx │ │ ├── getting-started.mdx │ │ └── usage/ │ │ ├── creating-docs.mdx │ │ ├── customizing.mdx │ │ ├── navigation.mdx │ │ ├── remark-plugins.md │ │ └── using-yaml-files.md │ ├── home/ │ │ └── index.mdx │ ├── pages/ │ │ └── 404.js │ └── yamlFiles/ │ └── letters.yml └── package.json
SYMBOL INDEX (31 symbols across 27 files)
FILE: @rocketseat/gatsby-theme-docs-core/gatsby-node.js
function generateRepositoryEditLink (line 11) | function generateRepositoryEditLink(themeOptions, relativePath) {
method resolve (line 226) | async resolve(mdxNode) {
FILE: @rocketseat/gatsby-theme-docs-core/src/components/Docs.js
function Docspage (line 4) | function Docspage({ data }) {
FILE: @rocketseat/gatsby-theme-docs-core/src/components/Homepage.js
function Homepage (line 4) | function Homepage({ data }) {
FILE: @rocketseat/gatsby-theme-docs-core/src/hooks/useSidebar.js
function useSidebar (line 4) | function useSidebar() {
FILE: @rocketseat/gatsby-theme-docs-core/util/url.js
function normalizeBasePath (line 1) | function normalizeBasePath(basePath, link) {
function isExternalUrl (line 5) | function isExternalUrl(url) {
function resolveLink (line 9) | function resolveLink(link, basePath) {
FILE: @rocketseat/gatsby-theme-docs/gatsby/wrapPageElement.js
function wrapPageElement (line 53) | function wrapPageElement({ element }) {
FILE: @rocketseat/gatsby-theme-docs/gatsby/wrapRootElement.js
function wrapRootElement (line 8) | function wrapRootElement({ element }) {
FILE: @rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Docs.js
function Docspage (line 5) | function Docspage({ data: { mdx }, pageContext, children }) {
FILE: @rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Homepage.js
function Homepage (line 5) | function Homepage({ children }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Code/index.js
function CodeHighlight (line 33) | function CodeHighlight({
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/EditGithub.js
function EditGithub (line 6) | function EditGithub({ repositoryEditUrl, repositoryProvider }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/PostNav/index.js
function Docs (line 8) | function Docs({ prev, next }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/TOC/index.js
function TableOfContents (line 11) | function TableOfContents({ headings, disableTOC, contentRef }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Docs/index.js
function Docs (line 9) | function Docs({ mdx, pageContext, children }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Header.js
function Header (line 42) | function Header({ handleMenuOpen }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Homepage.js
function Home (line 7) | function Home({ children }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Layout/index.js
function Layout (line 12) | function Layout({
FILE: @rocketseat/gatsby-theme-docs/src/components/Logo.js
function Logo (line 3) | function Logo(props) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Overlay.js
function Overlay (line 5) | function Overlay({ isMenuOpen, ...rest }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/SEO.js
function SEO (line 7) | function SEO({ description, title, slug, image, children }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Sidebar/ExternalLink/index.js
function ExternalLink (line 5) | function ExternalLink({ link, label }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Sidebar/InternalLink/index.js
function InternalLink (line 5) | function InternalLink({ link, label }) {
FILE: @rocketseat/gatsby-theme-docs/src/components/Sidebar/index.js
function ListWithSubItems (line 19) | function ListWithSubItems({ children, text }) {
function Sidebar (line 28) | function Sidebar({ isMenuOpen }) {
FILE: @rocketseat/gatsby-theme-docs/src/styles/global.js
function GlobalStyle (line 4) | function GlobalStyle() {
FILE: @rocketseat/gatsby-theme-docs/src/util/slug.js
function slugify (line 1) | function slugify(string) {
FILE: @rocketseat/gatsby-theme-docs/src/util/url.js
function isExternalUrl (line 1) | function isExternalUrl(url) {
FILE: examples/gatsby-theme-docs/src/pages/404.js
function NotFound (line 7) | function NotFound() {
Condensed preview — 101 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (149K chars).
[
{
"path": ".changeset/README.md",
"chars": 514,
"preview": "# Changesets\n\nHello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that wo"
},
{
"path": ".changeset/config.json",
"chars": 419,
"preview": "{\n \"$schema\": \"https://unpkg.com/@changesets/config@1.5.0/schema.json\",\n \"changelog\": [\n \"@changesets/changelog-git"
},
{
"path": ".commitlintrc.json",
"chars": 53,
"preview": "{\n \"extends\": [\"@commitlint/config-conventional\"]\n}\n"
},
{
"path": ".editorconfig",
"chars": 146,
"preview": "root = true\n\n[*]\nindent_style = space\nindent_size = 2\ncharset = utf-8\nend_of_line = lf\ntrim_trailing_whitespace = true\ni"
},
{
"path": ".eslintrc",
"chars": 867,
"preview": "{\n \"parserOptions\": {\n \"ecmaVersion\": 2020,\n \"sourceType\": \"module\",\n \"ecmaFeatures\": {\n \"jsx\": true\n "
},
{
"path": ".github/CODEOWNERS",
"chars": 126,
"preview": "# Learn how to add code owners here:\n# https://help.github.com/en/articles/about-code-owners\n\n* @jpedrosc"
},
{
"path": ".github/CODE_OF_CONDUCT.md",
"chars": 4219,
"preview": "# Code of Conduct\n\nThis Code of Conduct outlines our expectations for participants within the community as well as steps"
},
{
"path": ".github/CONTRIBUTING.md",
"chars": 5916,
"preview": "# Contribution guidelines\n\n## Table of Contents\n\n- [Getting started](#getting-started)\n - [Language](#language)\n - ["
},
{
"path": ".github/ISSUE_TEMPLATE/bug_report.md",
"chars": 1269,
"preview": "---\nname: Bug report\nabout: Create a report to help us improve\n---\n\n<!-- Verify first that your issue is not already rep"
},
{
"path": ".github/ISSUE_TEMPLATE/config.yml",
"chars": 28,
"preview": "blank_issues_enabled: false\n"
},
{
"path": ".github/ISSUE_TEMPLATE/documentation-report.md",
"chars": 491,
"preview": "---\nname: Documentation report\nabout: Use this template for documentation related issues\n---\n\n<!-- Verify first that you"
},
{
"path": ".github/ISSUE_TEMPLATE/enhancement-request.md",
"chars": 785,
"preview": "---\nname: Enhancement request\nabout: Suggest an idea for this project\n---\n\n<!-- Verify first that your issue is not alre"
},
{
"path": ".github/ISSUE_TEMPLATE/question.md",
"chars": 434,
"preview": "---\nname: Question 🤔\nabout: Usage question or discussion about Gatsby.\n---\n\n<!--\n To make it easier for us to help you,"
},
{
"path": ".github/PULL_REQUEST_TEMPLATE",
"chars": 656,
"preview": "<!-- If this is your first time, please read our contribution guidelines: (https://github.com/jpedroschmitz/rocketdocs/b"
},
{
"path": ".github/labeler.json",
"chars": 283,
"preview": "{\n \"labels\": {\n \"type: ci\": [\".github/workflows/**\"],\n \"type: meta\": [\".github/**\"],\n \"type: example\": [\"examp"
},
{
"path": ".github/lock.yml",
"chars": 144,
"preview": "# Configuration for lock-threads - https://github.com/dessant/lock-threads\n\ndaysUntilLock: 365\nissue-lock-labels: 'outda"
},
{
"path": ".github/workflows/commit.yml",
"chars": 554,
"preview": "name: Lint commit\n\non: pull_request\n\njobs:\n commit:\n name: Lint commit messages\n runs-on: ubuntu-latest\n\n env:"
},
{
"path": ".github/workflows/lint.yml",
"chars": 439,
"preview": "name: Lint\n\non: pull_request\n\njobs:\n code:\n name: Lint code\n runs-on: ubuntu-latest\n steps:\n - name: Chec"
},
{
"path": ".github/workflows/publish-starters.yml",
"chars": 609,
"preview": "name: Publish Starters\n\non:\n workflow_dispatch:\n\njobs:\n publish-starters:\n runs-on: ubuntu-latest\n steps:\n "
},
{
"path": ".github/workflows/release.yml",
"chars": 784,
"preview": "name: Release\n\non:\n push:\n branches:\n - main\n\njobs:\n release:\n name: Release\n runs-on: ubuntu-latest\n "
},
{
"path": ".gitignore",
"chars": 1107,
"preview": "# 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# Directo"
},
{
"path": ".husky/.gitignore",
"chars": 2,
"preview": "_\n"
},
{
"path": ".husky/commit-msg",
"chars": 98,
"preview": "#!/bin/sh\n. \"$(dirname \"$0\")/_/husky.sh\"\n. \"$(dirname \"$0\")/common.sh\"\n\nyarn commitlint --edit $1\n"
},
{
"path": ".husky/common.sh",
"chars": 169,
"preview": "command_exists () {\n command -v \"$1\" >/dev/null 2>&1\n}\n\n# Workaround for Windows 10, Git Bash and Yarn\nif command_exist"
},
{
"path": ".husky/pre-commit",
"chars": 89,
"preview": "#!/bin/sh\n. \"$(dirname \"$0\")/_/husky.sh\"\n. \"$(dirname \"$0\")/common.sh\"\n\nyarn lint-staged\n"
},
{
"path": ".prettierrc",
"chars": 105,
"preview": "{\n \"printWidth\": 80,\n \"semi\": true,\n \"singleQuote\": true,\n \"tabWidth\": 2,\n \"trailingComma\": \"all\"\n}\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/.npmignore",
"chars": 49,
"preview": ".cache/\nnode_modules/\npublic/\n\n.vscode\n.DS_Store\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/CHANGELOG.md",
"chars": 4927,
"preview": "# @rocketseat/gatsby-theme-docs\n\n## 4.0.1\n\n### Patch Changes\n\n- [#156](https://github.com/jpedroschmitz/rocketdocs/pull/"
},
{
"path": "@rocketseat/gatsby-theme-docs/LICENSE",
"chars": 1085,
"preview": "The MIT License (MIT)\n\nCopyright (c) 2021 João Pedro Schmitz\n\nPermission is hereby granted, free of charge, to any perso"
},
{
"path": "@rocketseat/gatsby-theme-docs/README.md",
"chars": 2726,
"preview": "<p align=\"center\">\n <img src=\"https://rocketseat-cdn.s3-sa-east-1.amazonaws.com/theme-docs.svg\" alt=\"A illustration of "
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby/wrapPageElement.js",
"chars": 1283,
"preview": "/* eslint-disable */\nimport React from 'react';\nimport { MDXProvider } from '@mdx-js/react';\n\nimport Code from '../src/c"
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby/wrapRootElement.js",
"chars": 382,
"preview": "/* eslint-disable */\nimport React from 'react';\nimport { ThemeProvider } from '@emotion/react';\n\nimport defaultTheme fro"
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby-browser.js",
"chars": 120,
"preview": "export { wrapRootElement } from './gatsby/wrapRootElement';\nexport { wrapPageElement } from './gatsby/wrapPageElement';\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby-config.js",
"chars": 1070,
"preview": "const withDefault = require('@rocketseat/gatsby-theme-docs-core/util/with-default');\n\nmodule.exports = (options) => {\n "
},
{
"path": "@rocketseat/gatsby-theme-docs/gatsby-ssr.js",
"chars": 120,
"preview": "export { wrapRootElement } from './gatsby/wrapRootElement';\nexport { wrapPageElement } from './gatsby/wrapPageElement';\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/index.js",
"chars": 8,
"preview": "// beep\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/package.json",
"chars": 1566,
"preview": "{\n \"name\": \"@rocketseat/gatsby-theme-docs\",\n \"version\": \"4.0.1\",\n \"main\": \"index.js\",\n \"description\": \"Out of the bo"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Docs.js",
"chars": 282,
"preview": "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport Docs from '../../../components/Docs';\n\nexport de"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/@rocketseat/gatsby-theme-docs-core/components/Homepage.js",
"chars": 200,
"preview": "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport Home from '../../../components/Homepage';\n\nexpor"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Code/LiveCodeScope.js",
"chars": 78,
"preview": "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",
"chars": 3741,
"preview": "import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport Highlight, { defaultProps } from 'pr"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Code/styles.js",
"chars": 3078,
"preview": "import styled from '@emotion/styled';\nimport { darken } from 'polished';\nimport {\n LiveError as AuxLiveError,\n LivePre"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/EditGithub.js",
"chars": 1002,
"preview": "/* @jsx jsx */\nimport { useTheme, jsx, css } from '@emotion/react';\nimport PropTypes from 'prop-types';\nimport { MdEdit "
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/PostNav/index.js",
"chars": 1061,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Link } from 'gatsby';\nimport { MdKeyboardArrowRi"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/PostNav/styles.js",
"chars": 1292,
"preview": "import styled from '@emotion/styled';\n\nexport const Container = styled.section`\n display: flex;\n justify-content: spac"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/TOC/index.js",
"chars": 3056,
"preview": "import React, { useState, useEffect, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { useTheme } fro"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/TOC/styles.js",
"chars": 1144,
"preview": "import styled from '@emotion/styled';\n\nexport const Wrapper = styled.div`\n position: sticky;\n top: 0;\n order: 2;\n\n p"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Docs/index.js",
"chars": 1539,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Layout from '../Layout';\nimport SEO from '../SEO'"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Header.js",
"chars": 1292,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from '@emotion/styled';\nimport { GiHamburge"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Homepage.js",
"chars": 304,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Layout from './Layout';\nimport SEO from './SEO';\n"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Layout/index.js",
"chars": 2068,
"preview": "/* @jsx jsx */\nimport { useState, useRef, Fragment } from 'react';\nimport { jsx, css } from '@emotion/react';\nimport Pro"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Layout/styles.js",
"chars": 903,
"preview": "import styled from '@emotion/styled';\n\nexport const Container = styled.div`\n width: 100%;\n max-width: 1400px;\n margin"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Logo.js",
"chars": 3171,
"preview": "import React from 'react';\n\nexport default function Logo(props) {\n return (\n <svg width={180} height={34} viewBox=\"0"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Overlay.js",
"chars": 675,
"preview": "/* @jsx jsx */\nimport { css, jsx } from '@emotion/react';\nimport PropTypes from 'prop-types';\n\nexport default function O"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/SEO.js",
"chars": 3463,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\nimport Helmet from 'react-helmet';\nimport urljoin from 'u"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Sidebar/ExternalLink/index.js",
"chars": 463,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { FiExternalLink } from 'react-icons/fi';\n\nexport "
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Sidebar/InternalLink/index.js",
"chars": 352,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Link } from 'gatsby';\n\nexport default function I"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Sidebar/index.js",
"chars": 2107,
"preview": "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { useStaticQuery, graphql, Link } from 'gatsby';\ni"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/components/Sidebar/styles.js",
"chars": 2514,
"preview": "import styled from '@emotion/styled';\n\nexport const Container = styled.aside`\n width: 100%;\n overflow-y: auto;\n\n disp"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/styles/global.js",
"chars": 7172,
"preview": "import React from 'react';\nimport { useTheme, Global, css } from '@emotion/react';\n\nexport default function GlobalStyle("
},
{
"path": "@rocketseat/gatsby-theme-docs/src/styles/theme.js",
"chars": 416,
"preview": "export default {\n colors: {\n primary: '#8257E6',\n background: '#FFFFFF',\n shape: `#F2F2FA`,\n title: `#3D3D4"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/text/index.mdx",
"chars": 389,
"preview": "Welcome, this is the default page of `@rocketseat/gatsby-theme-docs`! To\nchange this page create a file named `index.mdx"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/util/copy-to-clipboard.js",
"chars": 839,
"preview": "/* eslint-disable */\n\nexport const copyToClipboard = (str) => {\n const { clipboard } = window.navigator;\n\n if (!clipbo"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/util/slug.js",
"chars": 561,
"preview": "export default function slugify(string) {\n return string\n .toString() // Cast to string\n .toLowerCase() // Conver"
},
{
"path": "@rocketseat/gatsby-theme-docs/src/util/url.js",
"chars": 110,
"preview": "function isExternalUrl(url) {\n return /^((https?:)?\\/\\/)/i.test(url);\n}\n\nmodule.exports = { isExternalUrl };\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/.npmignore",
"chars": 49,
"preview": ".cache/\nnode_modules/\npublic/\n\n.vscode\n.DS_Store\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/CHANGELOG.md",
"chars": 2606,
"preview": "# @rocketseat/gatsby-theme-docs-core\n\n## 4.0.0\n\n### Major Changes\n\n- [#150](https://github.com/jpedroschmitz/rocketdocs/"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/LICENSE",
"chars": 1077,
"preview": "The MIT License (MIT)\n\nCopyright (c) 2021 João Pedro\n\nPermission is hereby granted, free of charge, to any person obtain"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/README.md",
"chars": 6616,
"preview": "<p align=\"center\">\n <img src=\"https://rocketseat-cdn.s3-sa-east-1.amazonaws.com/theme-docs.svg\" alt=\"A illustration of "
},
{
"path": "@rocketseat/gatsby-theme-docs-core/gatsby-config.js",
"chars": 2859,
"preview": "const withDefault = require(`./util/with-default`);\nconst path = require(`path`);\nconst gfmPlugin = require(`remark-gfm`"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/gatsby-node.js",
"chars": 7464,
"preview": "const path = require(`path`);\nconst { createFilePath } = require(`gatsby-source-filesystem`);\nconst fs = require(`fs`);\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/index.js",
"chars": 53,
"preview": "export { useSidebar } from './src/hooks/useSidebar';\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/package.json",
"chars": 1697,
"preview": "{\n \"name\": \"@rocketseat/gatsby-theme-docs-core\",\n \"version\": \"4.0.0\",\n \"main\": \"index.js\",\n \"description\": \"Core the"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/rehype-meta-as-attributes.js",
"chars": 741,
"preview": "const visit = require(`unist-util-visit`);\n\nexports.rehypeMetaAsAttributes = function rehypeMetaAsAttributes() {\n retur"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/remark-headings-plugin.js",
"chars": 526,
"preview": "const visit = require(`unist-util-visit`);\nconst toString = require(`mdast-util-to-string`);\n\nexports.remarkHeadingsPlug"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/components/Docs.js",
"chars": 166,
"preview": "/* eslint-disable react/prop-types */\nimport React from 'react';\n\nexport default function Docspage({ data }) {\n return "
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/components/Homepage.js",
"chars": 166,
"preview": "/* eslint-disable react/prop-types */\nimport React from 'react';\n\nexport default function Homepage({ data }) {\n return "
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/hooks/useSidebar.js",
"chars": 1097,
"preview": "import { graphql, useStaticQuery } from 'gatsby';\nimport { resolveLink } from '../../util/url';\n\nexport function useSide"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/templates/docs-query.js",
"chars": 464,
"preview": "import { graphql } from 'gatsby';\nimport DocsComponent from '../components/Docs';\n\nexport default DocsComponent;\n\nexport"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/src/templates/homepage-query.js",
"chars": 91,
"preview": "import HomepageComponent from '../components/Homepage';\n\nexport default HomepageComponent;\n"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/util/url.js",
"chars": 361,
"preview": "function normalizeBasePath(basePath, link) {\n return `/${basePath}/${link}`.replace(/\\/\\/+/g, `/`);\n}\n\nfunction isExter"
},
{
"path": "@rocketseat/gatsby-theme-docs-core/util/with-default.js",
"chars": 816,
"preview": "module.exports = (themeOptions) => {\n const basePath = themeOptions.basePath || `/`;\n const homePath = themeOptions.ho"
},
{
"path": "LICENSE.md",
"chars": 1075,
"preview": "MIT License\n\nCopyright (c) 2021 João Pedro Schmitz\n\nPermission is hereby granted, free of charge, to any person obtainin"
},
{
"path": "README.md",
"chars": 2392,
"preview": "<h1 align=\"center\">\n <!-- <br> -->\n <!-- <img src=\"https://storage.googleapis.com/golden-wind/github/gatsby-themes-log"
},
{
"path": "examples/gatsby-theme-docs/.gitignore",
"chars": 974,
"preview": "# 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# Directo"
},
{
"path": "examples/gatsby-theme-docs/LICENSE",
"chars": 1067,
"preview": "MIT License\n\nCopyright (c) 2021 João Pedro\n\nPermission is hereby granted, free of charge, to any person obtaining a copy"
},
{
"path": "examples/gatsby-theme-docs/README.md",
"chars": 1918,
"preview": "<p align=\"center\">\n <img src=\"https://rocketseat-cdn.s3-sa-east-1.amazonaws.com/theme-docs.svg\" alt=\"A illustration of "
},
{
"path": "examples/gatsby-theme-docs/gatsby-config.js",
"chars": 1479,
"preview": "module.exports = {\n siteMetadata: {\n siteTitle: `Rocket Docs`,\n defaultTitle: `Rocket Docs`,\n siteTitleShort: "
},
{
"path": "examples/gatsby-theme-docs/package.json",
"chars": 1050,
"preview": "{\n \"name\": \"gatsby-starter-rocketdocs\",\n \"private\": true,\n \"version\": \"1.0.0\",\n \"description\": \"Out of the box Gatsb"
},
{
"path": "examples/gatsby-theme-docs/src/config/sidebar.yml",
"chars": 589,
"preview": "# Sidebar navigation\n\n- label: 'Introduction'\n link: '/'\n- label: 'Getting started'\n link: '/getting-started'\n- label:"
},
{
"path": "examples/gatsby-theme-docs/src/docs/faq.mdx",
"chars": 1612,
"preview": "---\ntitle: Frequently Asked Questions\ndescription: Frequently asked questions about the theme.\ndisableTableOfContents: t"
},
{
"path": "examples/gatsby-theme-docs/src/docs/getting-started.mdx",
"chars": 4028,
"preview": "---\ntitle: 'Getting started'\ndescription: Learn how to get started with Rocket Docs.\n---\n\n> Rocket Docs is ready for Gat"
},
{
"path": "examples/gatsby-theme-docs/src/docs/usage/creating-docs.mdx",
"chars": 2675,
"preview": "---\ntitle: Creating docs\ndescription: Learn how to create docs using Rocket Docs.\n---\n\nAll MDX files created inside your"
},
{
"path": "examples/gatsby-theme-docs/src/docs/usage/customizing.mdx",
"chars": 6648,
"preview": "---\ntitle: Customizing\ndescription: Rocket Docs allows to customize the look by using Gatsby theme shadowing feature.\n--"
},
{
"path": "examples/gatsby-theme-docs/src/docs/usage/navigation.mdx",
"chars": 511,
"preview": "---\ntitle: Navigation\ndescription: How to use the sidebar.yml file from Rocket Docs.\n---\n\nTo add items on the sidebar, i"
},
{
"path": "examples/gatsby-theme-docs/src/docs/usage/remark-plugins.md",
"chars": 1542,
"preview": "---\ntitle: Remark plugins\ndescription: Learn how to use Remark plugins in Rocket Docs.\n---\n\nTo use a Remark plugin, you "
},
{
"path": "examples/gatsby-theme-docs/src/docs/usage/using-yaml-files.md",
"chars": 1342,
"preview": "---\ntitle: Using YAML files\ndescription: Learn how to YAML files in Rocket Docs.\n---\n\nTo use YAML files, create a new YA"
},
{
"path": "examples/gatsby-theme-docs/src/home/index.mdx",
"chars": 771,
"preview": "# Introduction\n\nRocket Docs is a complete and awesome Gatsby Theme for documentation websites. We've\ndeveloped it to be "
},
{
"path": "examples/gatsby-theme-docs/src/pages/404.js",
"chars": 530,
"preview": "import React from 'react';\nimport { Link } from 'gatsby';\n\nimport Layout from '@rocketseat/gatsby-theme-docs/src/compone"
},
{
"path": "examples/gatsby-theme-docs/src/yamlFiles/letters.yml",
"chars": 45,
"preview": "- character: a\n- character: b\n- character: c\n"
},
{
"path": "package.json",
"chars": 1431,
"preview": "{\n \"name\": \"root\",\n \"private\": true,\n \"scripts\": {\n \"lint\": \"eslint --ignore-path .gitignore \\\"**/*.+(ts|js|tsx|js"
}
]
About this extraction
This page contains the full source code of the Rocketseat/gatsby-themes GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 101 files (132.3 KB), approximately 40.4k tokens, and a symbol index with 31 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.