Merge branch 'main' of https://github.com/rohit-gohri/redocusaurus in…

…to releases/v1
rohit-gohri · Mar 13, 2022 · 937e73a · 937e73a
2 parents 60b869c + b283256
commit 937e73a
Show file tree

Hide file tree

Showing 20 changed files with 472 additions and 84 deletions.
diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
@@ -0,0 +1,47 @@
+name: E2E
+
+on:
+  pull_request:
+  push:
+    branches:
+      - main
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+env:
+  YARN_COMPRESSION_LEVEL: 0
+  YARN_ENABLE_GLOBAL_CACHE: true
+  PERCY_POSTINSTALL_BROWSER: true
+
+jobs:
+  percy:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - uses: actions/setup-node@v2
+        with:
+          node-version: '16'
+          cache: 'yarn'
+
+      - name: Install Dependencies 📦
+        run: yarn install --immutable
+
+      - name: Wait for Vercel Preview
+        uses: patrickedqvist/wait-for-vercel-preview@v1.2.0
+        id: vercel-preview
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          max_timeout: 200
+          check_interval: 5
+
+      - name: Run Percy
+        run: yarn test
+        working-directory: website
+        env:
+          TARGET_URL: ${{ steps.vercel-preview.outputs.url }}
+          PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }}
diff --git a/README.md b/README.md
@@ -1,17 +1,22 @@
 # Redocusaurus
 
-[![npm](https://img.shields.io/npm/v/redocusaurus?style=flat-square)](https://www.npmjs.com/package/redocusaurus/)
-[![Typed with TypeScript](https://img.shields.io/badge/Typed-555555.svg?style=flat-square&logo=typescript&labelColor=fff)](https://www.typescriptlang.org/)
+[![npm](https://img.shields.io/npm/v/redocusaurus)](https://www.npmjs.com/package/redocusaurus/)
+![npm](https://img.shields.io/npm/dw/redocusaurus)
+![Libraries.io dependency status for latest release](https://img.shields.io/librariesio/release/npm/redocusaurus)
+[![Typed with TypeScript](https://img.shields.io/badge/Typed-555555.svg?logo=typescript&labelColor=fff)](https://www.typescriptlang.org/)
+[![Build and Deploy](https://github.com/rohit-gohri/redocusaurus/actions/workflows/build.yml/badge.svg)](https://github.com/rohit-gohri/redocusaurus/actions/workflows/build.yml)
+![GitHub branch checks state](https://img.shields.io/github/checks-status/rohit-gohri/redocusaurus/main?logo=github)
+[![This project is using Percy.io for visual regression testing.](https://percy.io/static/images/percy-badge.svg)](https://percy.io/fef74697/redocusaurus)
 
 [Redoc](https://github.com/redocly/redoc) for [Docusaurus v2](https://v2.docusaurus.io/).
 
 ## Usage
 
-Check the [documentation on the website](https://rohit-gohri.github.io/redocusaurus/docs).
+Check the [documentation on the website](https://redocusaurus.vercel.app/docs).
 
 ## Demo
 
-See [Examples](https://rohit-gohri.github.io/redocusaurus/examples/)
+See [Examples](https://redocusaurus.vercel.app/examples/)
 
 ## Packages
 
@@ -33,7 +38,7 @@ Docs website and example project show casing the preset in action with multiple
 
 #### Who is using Redocusaurus?
 
-See [**Who is using Redocusaurus?** section in docs.](https://rohit-gohri.github.io/redocusaurus/docs/who-is-using-redocusaurus)
+See [**Who is using Redocusaurus?** section in docs.](https://redocusaurus.vercel.app/docs/who-is-using-redocusaurus)
 
 ## Contributing
 

diff --git a/packages/docusaurus-plugin-redoc/Readme.md b/packages/docusaurus-plugin-redoc/Readme.md
@@ -26,4 +26,4 @@ An object to pass as layout props. Useful to set title/description of the page.
 
 ## Docs
 
-See <https://rohit-gohri.github.io/redocusaurus/docs> for examples and programmatic usage.
+See <https://redocusaurus.vercel.app/docs> for examples and programmatic usage.
diff --git a/packages/docusaurus-plugin-redoc/package.json b/packages/docusaurus-plugin-redoc/package.json
@@ -24,7 +24,7 @@
   "bugs": {
     "url": "https://github.com/rohit-gohri/redocusaurus/issues"
   },
-  "homepage": "https://github.com/rohit-gohri/redocusaurus#readme",
+  "homepage": "https://github.com/rohit-gohri/redocusaurus/tree/main/packages/docusaurus-plugin-redoc#readme",
   "dependencies": {
     "@docusaurus/types": "^2.0.0-beta.17",
     "@docusaurus/utils": "^2.0.0-beta.17",

diff --git a/packages/docusaurus-plugin-redoc/src/index.ts b/packages/docusaurus-plugin-redoc/src/index.ts
@@ -56,6 +56,10 @@ export default function redocPlugin(
       }
       const content = await loadAndBundleSpec(parsedSpec || spec!);
 
+      if (debug) {
+        console.log('[REDOCUSAURUS_PLUGIN] Content loaded');
+      }
+
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       return content as any;
     },

diff --git a/packages/docusaurus-theme-redoc/Readme.md b/packages/docusaurus-theme-redoc/Readme.md
@@ -78,8 +78,8 @@ Note: You should not provide any color using this property, as it will be the sa
 
 ### redocOptions
 
-Override redoc options passed to [RedocStandalone](https://redoc.ly/docs/redoc/quickstart/react/) component.  
-See the defaults [here](https://github.com/rohit-gohri/redocusaurus/blob/main/packages/docusaurus-theme-redoc/src/redocData.ts#L6-L11).  
+Override redoc options passed to [RedocStandalone](https://redoc.ly/docs/redoc/quickstart/react/) component. See the defaults [here](./src/redocData.ts#L5-L12).  
+
 Available properties [here](https://github.com/Redocly/redoc#redoc-options-object).  
 You cannot set theme property using this property, use `redocTheme` instead.
 
@@ -89,4 +89,4 @@ Read More Here: <https://github.com/rohit-gohri/redocusaurus>
 
 ## Docs
 
-See: <https://rohit-gohri.github.io/redocusaurus/docs>
+See: <https://redocusaurus.vercel.app/docs>
diff --git a/packages/docusaurus-theme-redoc/package.json b/packages/docusaurus-theme-redoc/package.json
@@ -26,7 +26,7 @@
   "bugs": {
     "url": "https://github.com/rohit-gohri/redocusaurus/issues"
   },
-  "homepage": "https://github.com/rohit-gohri/redocusaurus#readme",
+  "homepage": "https://github.com/rohit-gohri/redocusaurus/tree/main/packages/docusaurus-theme-redoc#readme",
   "dependencies": {
     "@docusaurus/theme-common": "^2.0.0-beta.17",
     "@docusaurus/types": "^2.0.0-beta.17",

diff --git a/packages/docusaurus-theme-redoc/src/theme/Redoc/Redoc.tsx b/packages/docusaurus-theme-redoc/src/theme/Redoc/Redoc.tsx
@@ -6,7 +6,7 @@ import './styles.css';
 
 /*!
  * Redocusaurus
- * https://rohit-gohri.github.io/redocusaurus/
+ * https://redocusaurus.vercel.app/
  * (c) 2022 Rohit Gohri
  * Released under the MIT License
  */

diff --git a/packages/redocusaurus/Readme.md b/packages/redocusaurus/Readme.md
@@ -8,66 +8,70 @@
 
 1. Install redocusaurus:
 
-    ```sh
-    npm i --save redocusaurus
-    ```
+   ```sh
+   npm i --save redocusaurus
+   ```
 
 1. Add it as a preset to your docusaurus config and pass options:
 
-    - Pass it a OpenAPI spec URL
-
-        ```js
-        // docusaurus.config.js
-
-        module.exports = {
-          // ...
-          presets: [
-            [
-              'redocusaurus',
-              {
-                specs: [{
-                  specUrl: 'https://redocly.github.io/redoc/openapi.yaml',
-                }],
-              }
-            ],
-          ],
-          // ...
-        }
-        ```
-
-    - Pass it a OpenAPI spec local path
-
-        ```js
-        // docusaurus.config.js
-
-        module.exports = {
-          // ...
-          presets: [
-            [
-              'redocusaurus',
-              {
-                specs: [{
-                  spec: 'openapi.yaml',
-                }],
-              }
-            ],
-          ],
-          // ...
-        }
-        ```
-
-The API Doc will be available by default at `/api/` path. To customize it see [full plugin options](#options).
+   - Pass it a OpenAPI spec URL
+
+     ```js
+     // docusaurus.config.js
+
+     module.exports = {
+       // ...
+       presets: [
+         [
+           'redocusaurus',
+           {
+             specs: [
+               {
+                 specUrl: 'https://redocly.github.io/redoc/openapi.yaml',
+               },
+             ],
+           },
+         ],
+       ],
+       // ...
+     };
+     ```
+
+   - Pass it a OpenAPI spec local path
+
+     ```js
+     // docusaurus.config.js
+
+     module.exports = {
+       // ...
+       presets: [
+         [
+           'redocusaurus',
+           {
+             specs: [
+               {
+                 spec: 'openapi.yaml',
+               },
+             ],
+           },
+         ],
+       ],
+       // ...
+     };
+     ```
+
+The API Doc will be available by default at `/api/` path. To customize it see [full plugin options](../docusaurus-plugin-redoc/Readme.md).
 
 ### Options
 
 #### specs
 
-Pass it an array of plugin options, see [docusaurus-plugin-redoc](https://github.com/rohit-gohri/redocusaurus/tree/main/packages/docusaurus-plugin-redoc) for individual option details.
+Pass it an array of plugin options, see [docusaurus-plugin-redoc](../docusaurus-plugin-redoc/Readme.md) for individual option details.
 
 #### theme
 
-Pass options to customize the theme, see [docusaurus-theme-redoc](https://github.com/rohit-gohri/redocusaurus/tree/main/packages/docusaurus-theme-redoc) for individual option details.
+Pass options to customize the theme, see [docusaurus-theme-redoc](../docusaurus-theme-redoc/Readme.md) for individual option details.
 
 ## Docs
 
-See: <https://rohit-gohri.github.io/redocusaurus/docs>
+See: <https://redocusaurus.vercel.app/docs>
diff --git a/packages/redocusaurus/package.json b/packages/redocusaurus/package.json
@@ -20,6 +20,8 @@
   },
   "keywords": [
     "redoc",
+    "openapi",
+    "documentations",
     "api-doc",
     "docusaurus",
     "docusaurus-preset"
@@ -29,7 +31,7 @@
   "bugs": {
     "url": "https://github.com/rohit-gohri/redocusaurus/issues"
   },
-  "homepage": "https://github.com/rohit-gohri/redocusaurus#readme",
+  "homepage": "https://redocusaurus.vercel.app/",
   "dependencies": {
     "@docusaurus/types": "^2.0.0-beta.17",
     "docusaurus-plugin-redoc": "^0.9.0",

diff --git a/website/docs/getting-started/Installation.md b/website/docs/getting-started/Installation.md
@@ -26,11 +26,14 @@ npm i --save redocusaurus
          [
            'redocusaurus',
            {
+             // Plugin Options
              specs: [
                {
                  specUrl: 'https://redocly.github.io/redoc/openapi.yaml',
                },
              ],
+             // Theme Options
+             theme: {},
            },
          ],
        ],
@@ -49,11 +52,14 @@ npm i --save redocusaurus
          [
            'redocusaurus',
            {
+             // Plugin Options
              specs: [
                {
                  spec: 'openapi.yaml',
                },
              ],
+             // Theme Options
+             theme: {},
            },
          ],
        ],
@@ -98,4 +104,12 @@ module.exports = {
 };
 ```
 
-To customize it see [full plugin options](#options).
+## Options
+
+### specs
+
+An array of plugin options, see [plugin options](./plugin-options.md) for individual option details.
+
+### theme
+
+Pass options to customize the theme, see [theme options](./theme-options.md) for individual option details.
diff --git a/website/docs/getting-started/plugin-options.md b/website/docs/getting-started/plugin-options.md
@@ -0,0 +1,29 @@
+---
+title: Plugin Options
+sidebar_position: 1
+author: Rohit Gohri
+author_url: https://rohit.page
+---
+
+Either of `spec` or `specUrl` is required.
+
+### spec
+
+A path to a OpenAPI yaml or json file. Will be parsed and forwarded to Redoc component. This has higher priority over specUrl.
+
+### specUrl
+
+A url pointing to an OpenAPI spec.
+
+### layout
+
+An object to pass as layout props. Useful to set title/description of the page. See all properties available [here](https://github.com/rohit-gohri/redocusaurus/blob/releases/v0/packages/docusaurus-plugin-redoc/src/options.ts#L3).
+
+### routePath (default: `/api/`)
+
+Route URL at which docs would be available
+
+### apiDocComponent (default: `@theme/ApiDoc`)
+
+If you want to use a custom component to render the spec instead of the one with `docusaurus-theme-redoc` then overwrite this with a path to the component.
+It will be forwarded a single prop, see [ApiDoc](https://github.com/rohit-gohri/redocusaurus/blob/releases/v0/packages/docusaurus-theme-redoc/src/theme/ApiDoc/ApiDoc.tsx) for example.
diff --git a/website/docs/getting-started/theme-options.md b/website/docs/getting-started/theme-options.md
@@ -0,0 +1,16 @@
+---
+title: Theme Options
+sidebar_position: 2
+author: Rohit Gohri
+author_url: https://rohit.page
+---
+
+### primaryColor
+
+Hex code to be passed as the `main` color to [RedocStandalone](https://github.com/redocly/redoc#usage-as-a-react-component)
+
+### redocOptions
+
+Override the default redoc options passed to the [RedocStandalone](https://github.com/redocly/redoc#usage-as-a-react-component) component.
+
+See the defaults [here](https://github.com/rohit-gohri/redocusaurus/blob/releases/v0/packages/docusaurus-theme-redoc/src/redocData.ts#L5-L12).