@salesforcedevs/docs-components 1.34.0-docs-feedback → 1.34.0-docs-feedback-1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforcedevs/docs-components",
-  "version": "1.34.0-docs-feedback",
+  "version": "1.34.0-docs-feedback-1",
   "description": "Docs Lightning web components for DSC",
   "license": "MIT",
   "main": "index.js",

package/src/modules/doc/header/header.css

@@ -77,12 +77,6 @@ header:not(.has-brand) > .header_l2 {
     border-top: 1px solid var(--dx-g-gray-90);
 }
 
-@media (max-width: 1280px) {
-    .no-header-content {
-        border-top: 0;
-    }
-}
-
 @media (max-width: 768px) {
     .header_l2 {
         padding: 0;

package/src/modules/doc/header/header.ts

@@ -74,6 +74,13 @@ export default class Header extends HeaderBase {
         return (this.hideDocHeader && !this.mobile) || this.showDocDivider;
     }
 
+    private get isDocsPath(): boolean {
+        return (
+            window.location.pathname.includes("/docs/") &&
+            window.location.pathname !== "/docs/apis"
+        );
+    }
+
     connectedCallback(): void {
         super.connectedCallback();
         this.tabletMatchMedia = window.matchMedia(
@@ -83,9 +90,7 @@ export default class Header extends HeaderBase {
         this.tabletMatchMedia.addEventListener("change", this.onTabletChange);
 
         if (
-            (!this.shouldHideHeader &&
-                window.location.pathname.includes("/docs/") &&
-                window.location.pathname !== "/docs/apis") ||
+            (!this.shouldHideHeader && this.isDocsPath) ||
             window.location.pathname ===
                 "/tableau/embedding-playground/overview" ||
             isStorybook()
@@ -109,6 +114,12 @@ export default class Header extends HeaderBase {
         );
     }
 
+    renderedCallback(): void {
+        if (this.hideDocHeader) {
+            this.shouldRender = !this.shouldHideHeader && this.isDocsPath;
+        }
+    }
+
     private onTabletChange = (e: MediaQueryListEvent | MediaQueryList) =>
         (this.tablet = e.matches);
 

package/src/modules/doc/unifiedContentLayout/unifiedContentLayout.ts

@@ -10,32 +10,30 @@ import type { OptionWithLink, TreeNode } from "typings/custom";
  */
 const TOPIC_TYPE_SPEC = "spec";
 
-function findFirstContentDescendant(node: TreeNode): TreeNode | undefined {
-    for (const child of node.children ?? []) {
-        const isSpec =
-            (child as { topicType?: string }).topicType === TOPIC_TYPE_SPEC;
-        const isExternal = child.link?.target === "_blank";
-        if (isSpec || isExternal) {
-            continue;
-        }
-
-        if (child.link?.href) {
-            return child;
-        }
+/**
+ * Returns the parent's first direct child when it is a markdown content
+ * page or undefined otherwise.
+ */
+function firstChildContentPage(node: TreeNode): TreeNode | undefined {
+    const firstChild = node.children?.[0];
+    if (!firstChild) {
+        return undefined;
+    }
 
-        const descendant = findFirstContentDescendant(child);
-        if (descendant) {
-            return descendant;
-        }
+    const isSpec =
+        (firstChild as { topicType?: string }).topicType === TOPIC_TYPE_SPEC;
+    const isExternal = firstChild.link?.target === "_blank";
+    if (isSpec || isExternal || !firstChild.link?.href) {
+        return undefined;
     }
 
-    return undefined;
+    return firstChild;
 }
 
 /**
  * Translates per-topic `topicType` into the generic `showForwardArrow` flag
  * that `dx-tree-tile` reads (spec topics get the forward arrow icon for Redoc),
- * and redirects content-less parent topics to their first content descendant.
+ * and redirects content-less parent topics whose first child is a content page
  */
 function decorateTopics(
     topics: Array<TreeNode & { topicType?: string }> | undefined
@@ -49,15 +47,17 @@ function decorateTopics(
             decorated.children = decorateTopics(decorated.children);
         }
 
-        // Redirect parent topics without their own content to their first
-        // available content descendant.
+        /** Redirect a parent that has no content of its own to its first child
+         * but only when that first child is itself a content page
+         */
         const isContentlessParent =
             !!decorated.children?.length && !decorated.link?.href;
 
         if (isContentlessParent) {
-            const firstContent = findFirstContentDescendant(topic);
-            if (firstContent?.link) {
-                decorated.link = { ...firstContent.link };
+            const firstChild = firstChildContentPage(topic);
+            if (firstChild?.link) {
+                decorated.link = { ...firstChild.link };
+                decorated.redirectToChild = true;
             }
         }