@salesforcedevs/docs-components 1.29.0-newct-alpha1 → 1.29.0-spec-alpha

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforcedevs/docs-components",
-  "version": "1.29.0-newct-alpha1",
+  "version": "1.29.0-spec-alpha",
   "description": "Docs Lightning web components for DSC",
   "license": "MIT",
   "main": "index.js",

package/src/modules/doc/unifiedContentLayout/unifiedContentLayout.css

@@ -1,3 +1,19 @@
 :host {
     display: block;
 }
+
+.content-type-docs doc-phase {
+    --doc-c-phase-top: calc(
+        var(--dx-g-global-header-height) + var(--dx-g-doc-header-height) +
+            var(--dx-g-spacing-xl)
+    );
+}
+
+@media screen and (max-width: 768px) {
+    .content-type-docs doc-phase {
+        --doc-c-phase-top: calc(
+            var(--dx-g-global-header-height) + var(--dx-g-doc-header-height) +
+                40px
+        );
+    }
+}

package/src/modules/doc/unifiedContentLayout/unifiedContentLayout.html

@@ -21,14 +21,6 @@
             lwc:if={docPhaseInfo}
             doc-phase-info={docPhaseInfo}
         ></doc-phase>
-
-        <template lwc:if={isMarkdownTopic}>
-            <slot></slot>
-        </template>
-        <!--
-            TODO(W-22340752): render OAS specs via doc-redoc-reference when
-            topicType === "spec". The docs content-type parser currently 404s
-            spec topics until that path lands.
-        -->
+        <slot></slot>
     </doc-content-layout>
 </template>

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

@@ -1,31 +1,44 @@
 import { LightningElement, api } from "lwc";
-import { normalizeBoolean } from "dxUtils/normalizers";
-import type { OptionWithLink } from "typings/custom";
+import { toJson } from "dxUtils/normalizers";
+import type { OptionWithLink, TreeNode } from "typings/custom";
 
 /**
- * Topic types emitted by the docs content-type parser
- * (see @salesforcedevs/sfdocs-doc-framework: `TopicTypeEnum`).
+ * Per-topic type emitted by the docs content-type parser
+ * (see @salesforcedevs/sfdocs-doc-framework: `TopicTypeEnum`). Only `spec`
+ * is meaningful inside this component; everything else renders as a plain
+ * markdown-style tile.
  */
-const TOPIC_TYPE_MARKDOWN = "markdown";
 const TOPIC_TYPE_SPEC = "spec";
 
+/**
+ * Translates per-topic `topicType` into the generic `showForwardArrow` flag
+ * that `dx-tree-tile` reads (spec topics get the forward arrow icon for Redoc).
+ */
+function decorateTopicsWithForwardArrow(
+    topics: Array<TreeNode & { topicType?: string }> | undefined
+): TreeNode[] | undefined {
+    return topics?.map((topic) => {
+        const { topicType, ...decorated } = topic;
+        if (topicType === TOPIC_TYPE_SPEC) {
+            decorated.showForwardArrow = true;
+        }
+        if (decorated.children) {
+            decorated.children = decorateTopicsWithForwardArrow(
+                decorated.children
+            );
+        }
+        return decorated;
+    });
+}
+
 /**
  * Wrapper around `doc-content-layout` for the "docs" content type emitted by
  * the `DocsContentTypeParser`.
- *
- * Mirrors the role that `doc-amf-reference` plays for the "reference" content
- * type: it owns content-type-aware concerns (markdown body vs. OAS spec via
- * Redoc) and forwards the chrome (sidebar, breadcrumbs, TOC, footer) to
- * `doc-content-layout`.
- *
- * Only the markdown topic type is wired up today. OAS spec rendering via Redoc
- * is tracked separately (W-22340752) and currently 404s upstream in the parser.
  */
 export default class UnifiedContentLayout extends LightningElement {
     @api breadcrumbs: string | null = null;
     @api sidebarHeader?: string;
     @api sidebarValue?: string;
-    @api sidebarContent?: string;
     @api tocTitle?: string;
     @api tocOptions?: string;
     @api tocAriaLevel?: string;
@@ -43,13 +56,8 @@ export default class UnifiedContentLayout extends LightningElement {
 
     @api hideFooter = false;
 
-    /**
-     * Topic type forwarded from the layout template. The docs parser supports
-     * `markdown` today and `spec` (OAS via Redoc) in a follow-up.
-     */
-    @api topicType: string = TOPIC_TYPE_MARKDOWN;
-
     private _docPhaseInfo: string | null = null;
+    private _sidebarContent: unknown = null;
 
     @api
     get docPhaseInfo(): string | null {
@@ -60,23 +68,15 @@ export default class UnifiedContentLayout extends LightningElement {
         this._docPhaseInfo = value || null;
     }
 
-    private _expandChildren = false;
-
     @api
-    get expandChildren(): boolean {
-        return this._expandChildren;
-    }
-
-    set expandChildren(value: boolean | string) {
-        this._expandChildren = normalizeBoolean(value);
-    }
-
-    get isMarkdownTopic(): boolean {
-        return this.topicType === TOPIC_TYPE_MARKDOWN;
+    get sidebarContent(): unknown {
+        return this._sidebarContent;
     }
 
-    get isSpecTopic(): boolean {
-        return this.topicType === TOPIC_TYPE_SPEC;
+    set sidebarContent(value: string) {
+        this._sidebarContent = decorateTopicsWithForwardArrow(
+            toJson(value)?.topics
+        );
     }
 
     private get enableFooter(): boolean {