@salesforcedevs/docs-components 1.3.194-langpicker4-alpha → 1.3.194-langpicker6-alpha

package/lwc.config.json

@@ -18,6 +18,7 @@
         "doc/overview",
         "doc/phase",
         "doc/xmlContent",
+        "doc/footerNav",
         "docUtils/utils"
     ]
 }

package/package.json

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

package/src/modules/doc/footerNav/footerNav.css

@@ -21,4 +21,8 @@
     background-color: var(--button-primary-color-hover);
 
     --border-color: var(--button-primary-color-hover);
-}
+}
+
+.header_bail-link {
+    --dx-c-button-horizontal-spacing: var(--dx-g-spacing-sm);
+}

package/src/modules/doc/footerNav/footerNav.html

@@ -1,5 +1,17 @@
 <template>
     <div if:false={mobile} class="footer-nav">
+        <dx-button
+            if:true={hasBailLink}
+            aria-label={bailLabel}
+            class="header_bail-link"
+            href={bailHref}
+            onclick={handleBailClick}
+            variant="tertiary"
+            icon-symbol="new_window"
+            target="_blank"
+        >
+            {bailLabel}
+        </dx-button>
         <dx-dropdown
             if:true={hasLanguages}
             class="footer_lang-dropdown"
@@ -19,4 +31,4 @@
             </dx-button>
         </dx-dropdown>
     </div>
-</template>
+</template>

package/src/modules/doc/footerNav/footerNav.ts

@@ -1,11 +1,14 @@
 /* eslint-disable @lwc/lwc/no-document-query */
-import { LightningElement, api, track } from "lwc";
+import { LightningElement, api } from "lwc";
 import type { OptionWithLink } from "typings/custom";
 import { toJson } from "dxUtils/normalizers";
 import get from "lodash.get";
+import { track } from "dxUtils/analytics";
 
 export default class ContentLayout extends LightningElement {
-     @api langValuePath: string = "id";
+    @api langValuePath: string = "id";
+    @api bailHref?: string | null = null;
+    @api bailLabel?: string | null = null;
 
     @api
     get languages() {
@@ -44,11 +47,38 @@ export default class ContentLayout extends LightningElement {
         );
     }
 
+    get hasBailLink(): boolean {
+        return !!(this.bailHref && this.bailLabel);
+    }
+
     private onLangChange(event: CustomEvent<string>): void {
         const { detail } = event;
         this._language = detail;
 
-        this.dispatchEvent(new CustomEvent("langchange", { detail }));
+        const docElement = document.querySelector("doc-header");
+        docElement?.dispatchEvent(new CustomEvent("langchange", { detail }));
     }
 
-}
+    private getFilename = function (path: string) {
+        return path.substring(path.lastIndexOf("/") + 1);
+    };
+
+    private handleBailClick(event: Event) {
+        const payload = {
+            click_text: "pdf",
+            click_url: this.bailHref,
+            element_title: "pdf",
+            element_type: "link",
+            content_category: "download"
+        };
+        track(event.target!, "custEv_pdfDownload", {
+            ...payload,
+            file_name: this.getFilename(this.bailHref!),
+            file_extension: "pdf"
+        });
+
+        track(event.target!, "custEv_linkClick", {
+            ...payload
+        });
+    }
+}

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

@@ -11,6 +11,10 @@
         sidebar-value={sidebarValue}
         onselect={handleSelect}
         use-old-sidebar={useOldSidebar}
+        languages={availableLanguages}
+        language={language.id}
+        bailHref={pdfUrl}
+        bailLabel="PDF"
     >
         <doc-phase
             slot="version-banner"