@triptease/tt-navbar 0.0.19 → 0.0.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/TtNavbar.d.ts +2 -1
- package/dist/src/TtNavbar.js +37 -14
- package/dist/src/TtNavbar.js.map +1 -1
- package/dist/src/urlMappings.d.ts +3 -0
- package/dist/src/urlMappings.js +11 -0
- package/dist/src/urlMappings.js.map +1 -0
- package/dist/stories/index.stories.js +4 -1
- package/dist/stories/index.stories.js.map +1 -1
- package/dist/test/tt-navbar.test.js +15 -4
- package/dist/test/tt-navbar.test.js.map +1 -1
- package/dist/web/TtNavbar.js +48 -15
- package/dist/web/TtNavbar.js.map +3 -3
- package/dist/web/index.js +48 -15
- package/dist/web/index.js.map +3 -3
- package/dist/web/styles.js +1 -1
- package/dist/web/triptease-logo.js +1 -1
- package/dist/web/tt-navbar.js +48 -15
- package/dist/web/tt-navbar.js.map +3 -3
- package/dist/web/urlMappings.js +18 -0
- package/dist/web/urlMappings.js.map +7 -0
- package/package.json +1 -1
- package/src/TtNavbar.ts +41 -14
- package/src/urlMappings.ts +13 -0
- package/stories/index.stories.ts +4 -1
- package/test/tt-navbar.test.ts +19 -4
package/dist/web/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @triptease/tt-navbar v0.0.
|
|
2
|
+
* @triptease/tt-navbar v0.0.20
|
|
3
3
|
*/
|
|
4
4
|
var __defProp = Object.defineProperty;
|
|
5
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -1059,10 +1059,22 @@ var tripteaseLogo = `<svg width="112" height="32" viewBox="0 0 112 32" fill="no
|
|
|
1059
1059
|
</defs>
|
|
1060
1060
|
</svg>`;
|
|
1061
1061
|
|
|
1062
|
+
// src/urlMappings.ts
|
|
1063
|
+
var urlMappings = {
|
|
1064
|
+
"/paidsearch/$CLIENT_KEY/performance": "/channels",
|
|
1065
|
+
"/meta/$CLIENT_KEY/performance": "/channels",
|
|
1066
|
+
"/retargeting/$CLIENT_KEY/performance": "/channels",
|
|
1067
|
+
"/messages/$CLIENT_KEY/messages": "/channels",
|
|
1068
|
+
"/$CLIENT_KEY/email": "/channels",
|
|
1069
|
+
"/pricematch/$CLIENT_KEY/performance": "/channels",
|
|
1070
|
+
"/chat/insights/$CLIENT_KEY": "/channels"
|
|
1071
|
+
};
|
|
1072
|
+
|
|
1062
1073
|
// src/TtNavbar.ts
|
|
1063
1074
|
var TtNavbar = class extends i4 {
|
|
1064
1075
|
constructor() {
|
|
1065
1076
|
super(...arguments);
|
|
1077
|
+
this.campaignManagerUrl = "https://app.campaign-manager.triptease.io";
|
|
1066
1078
|
this.sidebarOpen = true;
|
|
1067
1079
|
/*
|
|
1068
1080
|
* Set the active state for the current page.
|
|
@@ -1088,22 +1100,40 @@ var TtNavbar = class extends i4 {
|
|
|
1088
1100
|
const currentPath = window.location.pathname;
|
|
1089
1101
|
let bestMatch;
|
|
1090
1102
|
let bestMatchLength = 0;
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
link.
|
|
1103
|
+
if (this.campaignManagerUrl.includes(window.location.host)) {
|
|
1104
|
+
const links = Object.values(this.allNavLinks);
|
|
1105
|
+
bestMatch = links.find(
|
|
1106
|
+
(link) => link.href.includes(this.campaignManagerUrl)
|
|
1107
|
+
);
|
|
1108
|
+
}
|
|
1109
|
+
if (!bestMatch && this.clientKey) {
|
|
1110
|
+
const parsedPath = currentPath.replace(this.clientKey, "$CLIENT_KEY");
|
|
1111
|
+
const mappedUrl = urlMappings[parsedPath];
|
|
1112
|
+
if (mappedUrl) {
|
|
1113
|
+
const links = Object.values(this.allNavLinks);
|
|
1114
|
+
bestMatch = links.find((link) => link.href.includes(mappedUrl));
|
|
1095
1115
|
}
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1100
|
-
|
|
1116
|
+
}
|
|
1117
|
+
if (!bestMatch) {
|
|
1118
|
+
for (const link of this.allNavLinks) {
|
|
1119
|
+
link.classList.remove("current-page");
|
|
1120
|
+
if (link.hasAttribute("aria-current")) {
|
|
1121
|
+
link.attributes.removeNamedItem("aria-current");
|
|
1122
|
+
}
|
|
1123
|
+
const linkPath = new URL(link.href).pathname;
|
|
1124
|
+
if (currentPath.startsWith(linkPath)) {
|
|
1125
|
+
if (linkPath.length > bestMatchLength) {
|
|
1126
|
+
bestMatch = link;
|
|
1127
|
+
bestMatchLength = linkPath.length;
|
|
1128
|
+
}
|
|
1101
1129
|
}
|
|
1102
1130
|
}
|
|
1103
1131
|
}
|
|
1104
1132
|
if (bestMatch) {
|
|
1105
1133
|
bestMatch.classList.add("current-page");
|
|
1106
1134
|
bestMatch.setAttribute("aria-current", "page");
|
|
1135
|
+
} else {
|
|
1136
|
+
console.error(`No matching nav link found for path: ${currentPath}`);
|
|
1107
1137
|
}
|
|
1108
1138
|
};
|
|
1109
1139
|
this.closeAllDetails = (element) => {
|
|
@@ -1132,8 +1162,8 @@ var TtNavbar = class extends i4 {
|
|
|
1132
1162
|
this.buildUrl = (path) => {
|
|
1133
1163
|
if (!this.clientKey) throw new Error("clientKey is required");
|
|
1134
1164
|
const formattedPath = path.replace("$CLIENT_KEY", this.clientKey);
|
|
1135
|
-
if (!this.
|
|
1136
|
-
return new URL(formattedPath, this.
|
|
1165
|
+
if (!this.platformUrl) return formattedPath;
|
|
1166
|
+
return new URL(formattedPath, this.platformUrl).toString();
|
|
1137
1167
|
};
|
|
1138
1168
|
this.onAnchorClick = (e8) => {
|
|
1139
1169
|
if (this.navigate) {
|
|
@@ -1168,7 +1198,7 @@ var TtNavbar = class extends i4 {
|
|
|
1168
1198
|
@click=${this.onAnchorClick}
|
|
1169
1199
|
>${o7(home)}<span>Dashboard</span></a
|
|
1170
1200
|
>
|
|
1171
|
-
<a class="nav-item" href
|
|
1201
|
+
<a class="nav-item" href=${this.campaignManagerUrl}
|
|
1172
1202
|
>${o7(campaigns)}<span>Campaigns</span></a
|
|
1173
1203
|
>
|
|
1174
1204
|
<a
|
|
@@ -1325,8 +1355,11 @@ __decorateClass([
|
|
|
1325
1355
|
n4({ type: Function })
|
|
1326
1356
|
], TtNavbar.prototype, "navigate", 2);
|
|
1327
1357
|
__decorateClass([
|
|
1328
|
-
n4({ type: String, attribute: "
|
|
1329
|
-
], TtNavbar.prototype, "
|
|
1358
|
+
n4({ type: String, attribute: "campaign-manager-url" })
|
|
1359
|
+
], TtNavbar.prototype, "campaignManagerUrl", 2);
|
|
1360
|
+
__decorateClass([
|
|
1361
|
+
n4({ type: String, attribute: "platform-url" })
|
|
1362
|
+
], TtNavbar.prototype, "platformUrl", 2);
|
|
1330
1363
|
__decorateClass([
|
|
1331
1364
|
n4({ type: String, attribute: "client-key" })
|
|
1332
1365
|
], TtNavbar.prototype, "clientKey", 2);
|