@salesforcedevs/dx-components 1.3.16 → 1.3.18

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/dx-components",
-    "version": "1.3.16",
+    "version": "1.3.18",
     "description": "DX Lightning web components",
     "license": "MIT",
     "engines": {
@@ -38,5 +38,5 @@
         "eventsourcemock": "^2.0.0",
         "luxon": "^3.1.0"
     },
-    "gitHead": "9bc872aa74451b077e4c1d70a7b2378a01a2337a"
+    "gitHead": "a45e1a97eefa6646c36a6fa5d24ad6c10a775d04"
 }

package/src/modules/dx/footer/links.ts

@@ -206,5 +206,11 @@ export const socialLinks = [
         iconSymbol: "rss",
         iconSprite: "general",
         label: "RSS"
+    },
+    {
+        href: "https://www.instagram.com/salesforcedevs",
+        iconSymbol: "instagram",
+        iconSprite: "brand",
+        label: "Instagram"
     }
 ];

package/src/modules/dx/sidebar/sidebar.ts

@@ -169,6 +169,8 @@ export default class Sidebar extends SidebarBase {
 
     private onSelect(event: CustomEvent) {
         this._value = event.detail.name;
+
+        this.dispatchEvent(new CustomEvent("sidebarclick"));
     }
 
     private onToggleClick(event: Event) {

package/src/modules/dx/sidebarOld/sidebarOld.ts

@@ -95,6 +95,8 @@ export default class Sidebar extends SidebarBase {
 
     private onSelect(event: CustomEvent) {
         this._value = event.detail.name;
+
+        this.dispatchEvent(new CustomEvent("sidebarclick"));
     }
 
     private onToggleClick(event: Event) {

package/src/modules/dx/toc/toc.ts

@@ -2,6 +2,7 @@ import { LightningElement, api, track } from "lwc";
 import cx from "classnames";
 import { ContentElement } from "typings/custom";
 import { toJson } from "dxUtils/normalizers";
+import { track as sendGtm } from "dxUtils/analytics";
 
 export default class Toc extends LightningElement {
     @api title!: string;
@@ -65,10 +66,22 @@ export default class Toc extends LightningElement {
     private onClick(e: Event) {
         const target = e.currentTarget as HTMLElement;
         const id = target.getAttribute("contentid");
+        const text = target.getAttribute("data-text");
+        const href = target.getAttribute("href");
+
         this.dispatchEvent(
             new CustomEvent("selectedcontent", { detail: { name: id } })
         );
+
         this._value = id!;
+
+        sendGtm(e.currentTarget!, "custEv_tableOfContentsClick", {
+            clickText: text,
+            clickUrl: href,
+            elementType: "link",
+            locationOnPage: "table of contents",
+            itemTitle: this.title
+        });
     }
 
     private toggleShowContent() {

package/src/modules/dx/treeItem/treeItem.html

@@ -24,6 +24,7 @@
                 key={child.key}
                 tree-node={child}
                 selected-key={selectedKey}
+                parent-name={treeNode.label}
             ></dx-tree-item>
         </template>
     </template>

package/src/modules/dx/treeItem/treeItem.ts

@@ -1,7 +1,6 @@
 import { LightningElement, api } from "lwc";
 import { InternalTreeNode } from "typings/custom";
 import { track } from "dxUtils/analytics";
-import { SidebarGtmAction } from "typings/custom";
 import { isInViewport } from "dxUtils/browser";
 
 const DEFAULT_TARGET = "_self";
@@ -9,6 +8,7 @@ const DEFAULT_TARGET = "_self";
 export default class TreeItem extends LightningElement {
     @api selectedKey?: string;
     @api isRoot: boolean = false;
+    @api parentName?: string = "";
 
     @api
     public get treeNode() {
@@ -94,7 +94,7 @@ export default class TreeItem extends LightningElement {
     private onIconClick(event: CustomEvent): void {
         const isSelectAction = false;
         this.doExpand(isSelectAction);
-        this.sendGtm(event, this.isExpanded ? "expand" : "collapse");
+        this.sendGtm(event);
     }
 
     private onLinkClick(event: Event): void {
@@ -107,7 +107,7 @@ export default class TreeItem extends LightningElement {
             this.doExpand(isSelectAction);
         }
 
-        this.sendGtm(event, "click");
+        this.sendGtm(event);
         this.fireEvent("tileselected", { name: this._treeNode.name });
     }
 
@@ -137,10 +137,12 @@ export default class TreeItem extends LightningElement {
         this.isExpanded = value;
     }
 
-    private sendGtm(event: Event, sideNavAction: SidebarGtmAction) {
-        track(event.currentTarget!, "custEv_leftNavLinkClick", {
+    private sendGtm(event: Event) {
+        track(event.currentTarget!, "custEv_leftNavClick", {
+            navType: "left nav bar",
             clickText: this._treeNode.label,
-            sideNavAction
+            clickUrl: this.href,
+            navItem: this.parentName
         });
     }
 }