@salesforcedevs/docs-components 1.20.2 → 1.20.5

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/docs-components",
-    "version": "1.20.2",
+    "version": "1.20.5",
     "description": "Docs Lightning web components for DSC",
     "license": "MIT",
     "main": "index.js",
@@ -25,5 +25,9 @@
         "@types/lodash.orderby": "4.6.9",
         "@types/lodash.uniqby": "4.7.9"
     },
-    "gitHead": "10311f28b3791b85639bde33ade200feb8ccd06d"
+    "gitHead": "0e3af2211cf15d8c1679afc69cf502643806222d",
+    "volta": {
+        "node": "20.19.0",
+        "yarn": "1.22.19"
+    }
 }

package/src/modules/doc/contentLayout/contentLayout.ts

@@ -269,13 +269,28 @@ export default class ContentLayout extends LightningElement {
             });
 
             // Adjusting the right nav bar on scroll.
+            // setting maxheight to make the RNB scrollable based on different parent elements
             if (rightNavBarEl) {
-                rightNavBarEl.style.top = docPhaseEl
-                    ? `${
-                          totalHeaderHeight +
-                          docPhaseEl.getBoundingClientRect().height
-                      }px`
-                    : `${totalHeaderHeight}px`;
+                const docPhaseElHeight = docPhaseEl
+                    ? docPhaseEl.getBoundingClientRect().height
+                    : 0;
+                const viewportHeight = window.innerHeight;
+                const maxHeight =
+                    viewportHeight -
+                    (docPhaseElHeight + totalHeaderHeight + 24); //added some margin of dx-toc
+
+                rightNavBarEl.style.top = `${
+                    totalHeaderHeight + docPhaseElHeight
+                }px`;
+
+                const toc = rightNavBarEl.querySelector("dx-toc");
+                const listContainer = toc?.shadowRoot?.querySelector(
+                    ".toc"
+                ) as HTMLElement;
+
+                if (listContainer) {
+                    listContainer.style.maxHeight = `${maxHeight}px`;
+                }
             }
 
             // If doc phase element exists, we need to account for its sticky position. Mobile should include the sidebar height (since it becomes sticky aswell).