@salesforcedevs/docs-components 1.3.243-newdocux-alpha9 → 1.3.252-dc1-alpha

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/docs-components",
-    "version": "1.3.243-newdocux-alpha9",
+    "version": "1.3.252-dc1-alpha",
     "description": "Docs Lightning web components for DSC",
     "license": "MIT",
     "main": "index.js",

package/src/modules/doc/amfReference/amfReference.html

@@ -19,6 +19,7 @@
         enable-slot-change="true"
         languages={languages}
         language={language}
+        show-footer={enableFooter}
     >
         <doc-phase
             slot="doc-phase"

package/src/modules/doc/amfReference/amfReference.ts

@@ -50,6 +50,7 @@ export default class AmfReference extends LightningElement {
     @api tocOptions?: string;
     @api languages!: OptionWithLink[];
     @api language!: string;
+    @api hideFooter = false;
     @track navigation = [] as NavigationItem[];
     @track versions: Array<ReferenceVersion> = [];
     @track showVersionBanner = false;
@@ -184,6 +185,10 @@ export default class AmfReference extends LightningElement {
         this._coveoAdvancedQueryConfig = toJson(config);
     }
 
+    private get enableFooter(): boolean {
+        return !this.hideFooter;
+    }
+
     // model
     protected _amfConfigList: AmfConfig[] = [];
     protected _amfConfigMap: Map<string, AmfConfig> = new Map();

package/src/modules/doc/contentLayout/contentLayout.html

@@ -56,7 +56,7 @@
                     ></dx-toc>
                 </div>
             </div>
-            <div lwc:if={footerHidden} class="footer-container">
+            <div lwc:if={showFooter} class="footer-container">
                 <dx-footer variant="no-signup"></dx-footer>
             </div>
         </div>

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

@@ -43,7 +43,7 @@ export default class ContentLayout extends LightningElement {
     @api bailLabel!: string;
 
     // This is needed for now to prevent failing snapshot tests due to links in the footer
-    @api hideFooter = false;
+    @api showFooter = false;
 
     @api
     get breadcrumbs() {
@@ -97,10 +97,6 @@ export default class ContentLayout extends LightningElement {
     private contentLoaded: boolean = false;
     private sidebarOpen: boolean = false;
 
-    get footerHidden() {
-        return this.hideFooter !== true;
-    }
-
     get shouldDisplayFeedback() {
         return this.contentLoaded && typeof Sprig !== "undefined";
     }

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

@@ -4,11 +4,39 @@ dx-logo {
     min-width: fit-content;
 }
 
+.dev-center-link {
+    display: inline-block;
+    padding: var(--dx-g-spacing-smd) var(--dx-g-spacing-lg) 0
+        var(--dx-g-global-header-padding-horizontal);
+    height: var(--dx-g-spacing-xl);
+}
+
+.dev-center-content {
+    display: flex;
+    align-items: center;
+    text-decoration: none;
+    color: inherit;
+    font-weight: var(--dx-g-font-bold);
+}
+
+dx-icon {
+    --dx-c-icon-size: var(--dx-g-icon-size-xs);
+    --dx-c-icon-color: var(--dx-g-blue-vibrant-20);
+}
+
+.dev-center-content > * + * {
+    margin-left: 8px; /* Adjust this value to your desired spacing */
+}
+
 .header_l2 {
     justify-content: space-between;
     height: var(--dx-g-doc-header-main-nav-height);
 }
 
+.has-brand .header_l2 {
+    height: var(--dx-g-spacing-3xl);
+}
+
 .nav_menu-button {
     --dx-c-button-primary-color: var(--dx-g-blue-vibrant-20);
     --dx-c-button-secondary-color-hover: var(
@@ -40,7 +68,7 @@ header:not(.has-brand) > .header_l2 {
 }
 
 .has-brand .header_l2_group-title {
-    padding: var(--dx-g-spacing-smd) var(--dx-g-spacing-xl)
+    padding: var(--dx-g-spacing-sm) var(--dx-g-spacing-xl)
         calc(var(--dx-g-spacing-smd) - 1px) 0;
     min-width: 320px;
 }

package/src/modules/doc/header/header.html

@@ -6,16 +6,24 @@
                     lwc:if={showBanner}
                     banner-markup={bannerMarkup}
                 ></dx-banner>
+                <div lwc:if={devCenter} class="dev-center-link">
+                    <a href={devCenter.link} class="dev-center-content">
+                        <dx-icon symbol="back"></dx-icon>
+                        <dx-icon
+                            class="brand-icon"
+                            lwc:if={devCenter.icon}
+                            sprite="salesforcebrand"
+                            symbol={brand}
+                            size="large"
+                        ></dx-icon>
+                        <span class="subtitle dx-text-body-4">
+                            {devCenter.title}
+                        </span>
+                    </a>
+                </div>
                 <div class="header_l2">
                     <div class="header_l2_group header_l2_group-title">
                         <a href={headerHref} class="home-link">
-                            <dx-icon
-                                class="brand-icon"
-                                lwc:if={isValidBrand}
-                                sprite="salesforcebrand"
-                                symbol={brand}
-                                size="large"
-                            ></dx-icon>
                             <span class="subtitle dx-text-display-7">
                                 {subtitle}
                             </span>

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

@@ -20,11 +20,21 @@ export default class Header extends HeaderBase {
         this._scopedNavItems = toJson(value);
     }
 
+    @api
+    get devCenter() {
+        return this._devCenter;
+    }
+
+    set devCenter(value) {
+        this._devCenter = toJson(value);
+    }
+
     private _scopedNavItems!: OptionWithNested[];
     private tablet = false;
     private tabletMatchMedia!: MediaQueryList;
     private shouldRender: boolean = false;
     private showDocDivider: boolean = false;
+    private _devCenter: any;
 
     protected mobileBreakpoint(): string {
         return MOBILE_MATCH;

package/src/modules/doc/xmlContent/xmlContent.html

@@ -17,6 +17,7 @@
         language={sidebarFooterContent.language}
         bail-href={sidebarFooterContent.bailHref}
         bail-label={sidebarFooterContent.bailLabel}
+        show-footer={enableFooter}
     >
         <doc-phase
             slot="version-banner"

package/src/modules/doc/xmlContent/xmlContent.ts

@@ -44,6 +44,7 @@ export default class DocXmlContent extends LightningElementWithState<{
     @api coveoPublicAccessToken!: string;
     @api coveoAnalyticsToken!: string;
     @api coveoSearchHub!: string;
+    @api hideFooter = false;
 
     @api
     get allLanguages(): Array<Language> {
@@ -84,6 +85,10 @@ export default class DocXmlContent extends LightningElementWithState<{
     private latestVersion = false;
     private previewVersion = false;
 
+    private get enableFooter(): boolean {
+        return !this.hideFooter;
+    }
+
     private searchSyncer = new SearchSyncer({
         callbacks: {
             onSearchChange: (nextSearchString: string): void => {