@salesforcedevs/docs-components 1.3.345-refactor-tab-alpha3 → 1.3.345-refactor-tab-alpha4

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/docs-components",
-    "version": "1.3.345-refactor-tab-alpha3",
+    "version": "1.3.345-refactor-tab-alpha4",
     "description": "Docs Lightning web components for DSC",
     "license": "MIT",
     "main": "index.js",

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

@@ -152,7 +152,7 @@ export default class ContentLayout extends LightningElement {
     }
 
     // Placeholder for childs renderedCallback
-    protected renderedCallbackForLwcContentLayout?(): void;
+    protected postRenderedCallback?(): void;
 
     renderedCallback(): void {
         /**
@@ -174,7 +174,7 @@ export default class ContentLayout extends LightningElement {
             this.restoreScroll();
 
             // Dynamically call `renderedCallbackForLwcContentLayout` if it exists
-            this.renderedCallbackForLwcContentLayout?.();
+            this.postRenderedCallback?.();
         }
     }
 
@@ -360,6 +360,32 @@ export default class ContentLayout extends LightningElement {
         this.updateHeadingForRNB();
     };
 
+    // eslint-disable-next-line no-undef
+    updateTocItems(headingElements: any): void {
+        const tocOptions = [];
+
+        for (const headingElement of headingElements as any) {
+            headingElement.id = headingElement.hash;
+
+            // Update tocOptions from anchorTags only for H2, consider default as 2 as per component
+            const headingAriaLevel =
+                headingElement.attributes["aria-level"]?.nodeValue || "2";
+            const isH2 = headingAriaLevel === "2";
+
+            if (isH2) {
+                const tocItem = {
+                    anchor: `#${headingElement.hash}`,
+                    id: headingElement.id,
+                    label: headingElement.header
+                };
+                tocOptions.push(tocItem);
+                this.tocOptionIdsSet.add(headingElement.id);
+            }
+        }
+
+        this._tocOptions = tocOptions;
+    }
+
     onSlotChange(event: Event): void {
         const slotElements = (
             event.target as HTMLSlotElement
@@ -380,27 +406,7 @@ export default class ContentLayout extends LightningElement {
                     headingElement.attributes.header?.nodeValue;
             }
 
-            const tocOptions = [];
-            for (const headingElement of headingElements as any) {
-                headingElement.id = headingElement.hash;
-
-                // Update tocOptions from anchorTags only for H2, consider default as 2 as per component
-                const headingAriaLevel =
-                    headingElement.attributes["aria-level"]?.nodeValue || "2";
-                const isH2 = headingAriaLevel === "2";
-
-                if (isH2) {
-                    const tocItem = {
-                        anchor: `#${headingElement.hash}`,
-                        id: headingElement.id,
-                        label: headingElement.header
-                    };
-                    tocOptions.push(tocItem);
-                    this.tocOptionIdsSet.add(headingElement.id);
-                }
-            }
-
-            this._tocOptions = tocOptions;
+            this.updateTocItems(headingElements);
         }
     }
 

package/src/modules/doc/lwcContentLayout/lwcContentLayout.ts

@@ -142,7 +142,7 @@ export default class LwcContentLayout extends ContentLayout {
         });
     }
 
-    renderedCallbackForLwcContentLayout(): void {
+    postRenderedCallback(): void {
         this.setRNBByTab();
         if (this.showTabBasedRNB) {
             window.addEventListener("tabchanged", this.onTabChanged);
@@ -187,30 +187,4 @@ export default class LwcContentLayout extends ContentLayout {
         this.updateRNB();
         this.contentLoaded = true;
     }
-
-    // eslint-disable-next-line no-undef
-    private updateTocItems(headingElements: NodeListOf<Element>): void {
-        const tocOptions = [];
-
-        for (const headingElement of headingElements as any) {
-            headingElement.id = headingElement.hash;
-
-            // Update tocOptions from anchorTags only for H2, consider default as 2 as per component
-            const headingAriaLevel =
-                headingElement.attributes["aria-level"]?.nodeValue || "2";
-            const isH2 = headingAriaLevel === "2";
-
-            if (isH2) {
-                const tocItem = {
-                    anchor: `#${headingElement.hash}`,
-                    id: headingElement.id,
-                    label: headingElement.header
-                };
-                tocOptions.push(tocItem);
-                this.tocOptionIdsSet.add(headingElement.id);
-            }
-        }
-
-        this._tocOptions = tocOptions;
-    }
 }