feat: redocly scroll y offset

adobe · Sep 25, 2024 · 1d2746c · 1d2746c
1 parent 627e88e
commit 1d2746c
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -107,6 +107,7 @@ Using a theme, all of your default configuration lives in an npm package.
       - [disableSidebar (optional)](#disablesidebar-optional)
       - [disableSearch (optional)](#disablesearch-optional)
       - [hideTryItPanel (optional)](#hidetryitpanel-optional)
+      - [scrollYOffset (optional)](#scrollyoffset-optional)
       - [sortOperationsAlphabetically (optional)](#sortoperationsalphabetically-optional)
       - [sortTagsAlphabetically (optional)](#sorttagsalphabetically-optional)
       - [jsonSampleExpandLevel (optional)](#jsonsampleexpandlevel-optional)
@@ -1199,6 +1200,19 @@ Defaults to ```false```
 
 https://redocly.com/docs/api-reference-docs/configuration/functionality/#theme-object-openapi-schema
 
+#### scrollYOffset (optional)
+
+```js
+<RedoclyAPIBlock src="URL pointing to your open api yaml file." scrollYOffset={64} />
+```
+
+Specifies a vertical scroll-offset. This is useful when there are fixed positioned elements at the top of the page, such as navbars, headers etc. You can specify the scrollYOffset value as a number - a fixed number of pixels to be used as the offset.
+
+Defaults to ```0```
+
+https://redocly.com/docs/api-reference-docs/configuration/functionality/#theme-object-openapi-schema
+
+
 #### sortOperationsAlphabetically (optional)
 
 ```js

diff --git a/packages/gatsby-theme-aio/package.json b/packages/gatsby-theme-aio/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@adobe/gatsby-theme-aio",
-  "version": "4.14.10",
+  "version": "4.14.11",
   "description": "The Adobe I/O theme for building markdown powered sites",
   "main": "index.js",
   "license": "Apache-2.0",

diff --git a/packages/gatsby-theme-aio/src/components/RedoclyAPIBlock/index.js b/packages/gatsby-theme-aio/src/components/RedoclyAPIBlock/index.js
@@ -26,6 +26,7 @@ const RedoclyAPIBlock = ({
   disableSidebar = false,
   disableSearch = false,
   hideTryItPanel = false,
+  scrollYOffset = 0,
   sortOperationsAlphabetically = false,
   sortTagsAlphabetically = false,
   jsonSampleExpandLevel = 2,
@@ -70,6 +71,7 @@ const RedoclyAPIBlock = ({
                disableSidebar: ${disableSidebar}, 
                disableSearch: ${disableSearch},
                hideTryItPanel: ${hideTryItPanel},
+               scrollYOffset: ${scrollYOffset},
                sortOperationsAlphabetically: ${sortOperationsAlphabetically},
                sortTagsAlphabetically: ${sortTagsAlphabetically},
                jsonSampleExpandLevel: ${jsonSampleExpandLevel === all ? `'${jsonSampleExpandLevel}'` : jsonSampleExpandLevel},
@@ -101,6 +103,7 @@ RedoclyAPIBlock.propTypes = {
   disableSidebar: PropTypes.bool,
   disableSearch: PropTypes.bool,
   hideTryItPanel: PropTypes.bool,
+  scrollYOffset: PropTypes.number,
   sortOperationsAlphabetically: PropTypes.bool,
   sortTagsAlphabetically: PropTypes.bool,
   jsonSampleExpandLevel: PropTypes.oneOfType([