@triptease/tt-navbar 0.0.45 → 0.0.46

package/dist/src/TtNavbar.d.ts

@@ -12,18 +12,18 @@ export declare class TtNavbar extends LitElement {
         clientKey: string;
         displayName: string;
     }[];
+    initialState: 'open' | 'closed' | undefined;
+    isOpen: boolean;
     onClientChange: ((clientKeySelected: string) => void) | undefined;
     protected allDetailsElements: Array<HTMLDetailsElement>;
     protected allNavLinks: Array<HTMLAnchorElement>;
-    private sidebarOpen;
-    private navbarController;
     protected firstUpdated(): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     private setActiveState;
     private closeAllDetails;
     private toggleSidebar;
-    private handleToggle;
+    private handleDetailsToggle;
     private buildUrl;
     private onAnchorClick;
     private handleClientChange;

package/dist/src/TtNavbar.js

@@ -8,7 +8,6 @@ import { styles } from './styles.js';
 import { tripteaseLogo } from './triptease-logo.js';
 import { urlMappings } from './urlMappings.js';
 import { Routes } from './Routes.js';
-import { NavbarController } from './NavbarController.js';
 const jsonArrayConverter = (value) => {
     if (!value)
         return [];
@@ -24,8 +23,8 @@ export class TtNavbar extends LitElement {
         super(...arguments);
         this.campaignManagerUrl = 'https://app.campaign-manager.triptease.io';
         this.clients = [];
-        this.sidebarOpen = true;
-        this.navbarController = new NavbarController(this);
+        this.initialState = undefined;
+        this.isOpen = true;
         /*
          * Set the active state for the current page.
          *
@@ -106,14 +105,15 @@ export class TtNavbar extends LitElement {
         };
         this.toggleSidebar = () => {
             this.closeAllDetails();
-            this.navbarController.toggle();
+            this.isOpen = !this.isOpen;
+            // TODO - Set cookie
         };
-        this.handleToggle = (e) => {
+        this.handleDetailsToggle = (e) => {
             const { newState } = e;
             const target = e.currentTarget;
             if (newState === 'open') {
-                if (!this.navbarController.isOpen) {
-                    this.navbarController.toggle();
+                if (!this.isOpen) {
+                    this.toggleSidebar();
                 }
                 this.closeAllDetails(target);
             }
@@ -149,6 +149,9 @@ export class TtNavbar extends LitElement {
         // Listen for Tetris programmatic navigation
         window.addEventListener('tetris:navigate', this.setActiveState);
         super.connectedCallback();
+        if (this.initialState) {
+            this.isOpen = this.initialState === 'open';
+        }
     }
     disconnectedCallback() {
         window.removeEventListener('popstate', this.setActiveState);
@@ -157,8 +160,8 @@ export class TtNavbar extends LitElement {
     }
     render() {
         return html `
-      <nav id=${this.id} class="${this.navbarController.isOpen ? '' : 'sidebar-closed'}">
-        <div class="sidebar-header ${this.navbarController.isOpen ? '' : 'sidebar-closed'}">
+      <nav id=${this.id} class="${this.isOpen ? '' : 'sidebar-closed'}">
+        <div class="sidebar-header ${this.isOpen ? '' : 'sidebar-closed'}">
           <div class="logo">
             ${unsafeSVG(tripteaseLogo)}
           </div>
@@ -171,7 +174,7 @@ export class TtNavbar extends LitElement {
           </button>
         </div>
 
-        <div class="nav-items ${this.navbarController.isOpen ? '' : 'sidebar-closed'}">
+        <div class="nav-items ${this.isOpen ? '' : 'sidebar-closed'}">
           <a
             class="nav-item"
             href=${this.buildUrl('/')}
@@ -190,7 +193,7 @@ export class TtNavbar extends LitElement {
             data-intercom-target="channels"
           >${unsafeSVG(channels)}<span>Channels</span></a
           >
-          <details id="market-insights" @toggle=${this.handleToggle} data-intercom-target="market-insights">
+          <details id="market-insights" @toggle=${this.handleDetailsToggle} data-intercom-target="market-insights">
             <summary>
               ${unsafeSVG(graph)}
               <span>Market Insights</span>
@@ -213,7 +216,7 @@ export class TtNavbar extends LitElement {
               >
             </div>
           </details>
-          <details id="settings" @toggle=${this.handleToggle} data-intercom-target="settings">
+          <details id="settings" @toggle=${this.handleDetailsToggle} data-intercom-target="settings">
             <summary>
               ${unsafeSVG(gear)}
               <span>Settings</span>
@@ -251,7 +254,7 @@ export class TtNavbar extends LitElement {
             </div>
           </details>
           <hr />
-          <details id="account" @toggle=${this.handleToggle} data-intercom-target="account">
+          <details id="account" @toggle=${this.handleDetailsToggle} data-intercom-target="account">
             <summary>
               ${unsafeSVG(user)}
               <span>Account</span>
@@ -274,7 +277,7 @@ export class TtNavbar extends LitElement {
               >
             </div>
           </details>
-          <details id="billing-routes" @toggle=${this.handleToggle} data-intercom-target="billing">
+          <details id="billing-routes" @toggle=${this.handleDetailsToggle} data-intercom-target="billing">
             <summary>
               ${unsafeSVG(wallet)}
               <span>Billing</span>
@@ -298,7 +301,7 @@ export class TtNavbar extends LitElement {
             </div>
           </details>
         </div>
-        <div class="tertiary-nav ${this.navbarController.isOpen ? '' : 'sidebar-closed'}">
+        <div class="tertiary-nav ${this.isOpen ? '' : 'sidebar-closed'}">
           <div id="external-links" class="nav-items">
             <a
               class="nav-item external-link"
@@ -383,6 +386,12 @@ __decorate([
 __decorate([
     property({ type: Array, converter: jsonArrayConverter })
 ], TtNavbar.prototype, "clients", void 0);
+__decorate([
+    property({ type: String, attribute: 'initial-state' })
+], TtNavbar.prototype, "initialState", void 0);
+__decorate([
+    state()
+], TtNavbar.prototype, "isOpen", void 0);
 __decorate([
     property({ type: Object })
 ], TtNavbar.prototype, "onClientChange", void 0);
@@ -392,7 +401,4 @@ __decorate([
 __decorate([
     queryAll('a')
 ], TtNavbar.prototype, "allNavLinks", void 0);
-__decorate([
-    state()
-], TtNavbar.prototype, "sidebarOpen", void 0);
 //# sourceMappingURL=TtNavbar.js.map

package/dist/src/TtNavbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TtNavbar.js","sourceRoot":"","sources":["../../src/TtNavbar.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAll, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport {\n  campaigns,\n  channels,\n  chevronDown,\n  external,\n  gear,\n  graph,\n  home,\n  logout,\n  sidebarCollapsed,\n  user,\n  wallet,\n} from '@triptease/icons';\nimport '@triptease/tt-combobox';\nimport { styles } from './styles.js';\nimport { tripteaseLogo } from './triptease-logo.js';\nimport { urlMappings } from './urlMappings.js';\nimport { Routes } from './Routes.js';\nimport { NavbarController } from './NavbarController.js';\n\nconst jsonArrayConverter = (value: string | null) => {\n  if (!value) return [];\n  try {\n    return JSON.parse(value);\n  } catch {\n    return [];\n  }\n};\n\nexport class TtNavbar extends LitElement {\n  static styles = styles;\n\n  @property({ type: Function })\n  navigate: ((e: MouseEvent) => void) | undefined;\n\n  @property({ type: String, attribute: 'campaign-manager-url' })\n  campaignManagerUrl: string = 'https://app.campaign-manager.triptease.io';\n\n  @property({ type: String, attribute: 'platform-url' })\n  platformUrl?: string;\n\n  @property({ type: String, attribute: 'client-key' })\n  clientKey?: string;\n\n  @property({ type: String, attribute: 'active-route' })\n  activeRoute?: keyof typeof Routes;\n\n  @property({ type: Array, converter: jsonArrayConverter })\n  clients: { clientKey: string; displayName: string }[] = [];\n\n  @property({ type: Object })\n  onClientChange: ((clientKeySelected: string) => void) | undefined;\n\n  @queryAll('details')\n  protected allDetailsElements!: Array<HTMLDetailsElement>;\n\n  @queryAll('a')\n  protected allNavLinks!: Array<HTMLAnchorElement>;\n\n  @state()\n  private sidebarOpen = true;\n\n  private navbarController = new NavbarController(this);\n\n  protected firstUpdated() {\n    this.setActiveState();\n  }\n\n  public connectedCallback() {\n    // Listen for browser back/forward navigation\n    window.addEventListener('popstate', this.setActiveState);\n\n    // Listen for Tetris programmatic navigation\n    window.addEventListener('tetris:navigate', this.setActiveState);\n\n    super.connectedCallback();\n  }\n\n  public disconnectedCallback() {\n    window.removeEventListener('popstate', this.setActiveState);\n    window.removeEventListener('tetris:navigate', this.setActiveState);\n\n    super.disconnectedCallback();\n  }\n\n  /*\n   * Set the active state for the current page.\n   *\n   * This function iterates over all nav links and compares the current URL path with the href of each link.\n   * If the current URL path starts with the href of a link, the link is marked as active. If multiple links\n   * share the same prefix, the longest prefix is used as it is more specific.\n   *\n   * Example:\n   * - Current URL: /channels/123\n   * - Nav links:\n   *   - /channels\n   *   - /channels/123\n   *   - /channels/456\n   *\n   * Loop 1: currentPath = /channels/123, linkPath = /channels, bestMatch = /channels\n   * Loop 2: currentPath = /channels/123, linkPath = /channels/123, bestMatch = /channels/123\n   * Loop 3: currentPath = /channels/123, linkPath = /channels/456, bestMatch = /channels/123\n   * Result: /channels/123 is marked as active\n   *\n   */\n  private setActiveState = () => {\n    const currentPath = window.location.pathname;\n\n    let bestMatch: HTMLAnchorElement | undefined;\n    let bestMatchLength = 0;\n\n    // Check special cases first, as everything will always match on / and return Dashboard\n    if (this.activeRoute === Routes.CampaignManager) {\n      const links = Object.values(this.allNavLinks);\n      bestMatch = links.find(link => link.id === Routes.CampaignManager);\n    }\n    if (!bestMatch && this.clientKey) {\n      const parsedPath = currentPath.replace(this.clientKey, '$CLIENT_KEY');\n      const mappedUrl = urlMappings[parsedPath];\n      if (mappedUrl) {\n        const clientSpecificUrl = mappedUrl.includes('$CLIENT_KEY')\n          ? mappedUrl.replace('$CLIENT_KEY', this.clientKey)\n          : mappedUrl;\n        const links = Object.values(this.allNavLinks);\n        bestMatch = links.find(link => link.href.includes(clientSpecificUrl));\n      }\n    }\n\n    if (!bestMatch) {\n      for (const link of this.allNavLinks) {\n        link.classList.remove('current-page');\n        if (link.hasAttribute('aria-current')) {\n          link.attributes.removeNamedItem('aria-current');\n        }\n\n        const linkPath = new URL(link.href).pathname;\n\n        if (currentPath.startsWith(linkPath)) {\n          if (linkPath.length > bestMatchLength) {\n            bestMatch = link;\n            bestMatchLength = linkPath.length;\n          }\n        }\n      }\n    }\n\n    if (bestMatch) {\n      bestMatch.classList.add('current-page');\n      bestMatch.setAttribute('aria-current', 'page');\n\n      // Auto-expand parent details if the active link is within a collapsible section\n      const parentDetails = bestMatch.closest('details');\n      if (parentDetails) {\n        parentDetails.setAttribute('open', '');\n      }\n    } else {\n      console.error(`No matching nav link found for path: ${currentPath}`);\n    }\n  };\n\n  private closeAllDetails = (element?: HTMLDetailsElement) => {\n    this.allDetailsElements.forEach(detail => {\n      if (element && !detail.contains(element)) {\n        detail.removeAttribute('open');\n      } else if (!element) {\n        detail.removeAttribute('open');\n      }\n    });\n  };\n\n  private toggleSidebar = () => {\n    this.closeAllDetails();\n    this.navbarController.toggle();\n  };\n\n  private handleToggle = (e: ToggleEvent) => {\n    const { newState } = e;\n    const target = e.currentTarget as HTMLDetailsElement;\n\n    if (newState === 'open') {\n      if (!this.navbarController.isOpen) {\n        this.navbarController.toggle();\n      }\n\n      this.closeAllDetails(target);\n    }\n  };\n\n  private buildUrl = (path: string): string => {\n    if (!this.clientKey) throw new Error('clientKey is required');\n\n    const formattedPath = path.replace('$CLIENT_KEY', this.clientKey);\n    if (!this.platformUrl) return formattedPath;\n\n    return new URL(formattedPath, this.platformUrl).toString();\n  };\n\n  private onAnchorClick = (e: MouseEvent) => {\n    if (this.navigate) {\n      this.navigate(e);\n      this.setActiveState();\n    }\n  };\n\n  private handleClientChange = (e: Event) => {\n    const combobox = e.target as any;\n    const selectedClientKey = combobox.value?.[0];\n\n    if (selectedClientKey && this.onClientChange) {\n      this.onClientChange(selectedClientKey);\n    }\n  };\n\n  render() {\n    return html`\n      <nav id=${this.id} class=\"${this.navbarController.isOpen ? '' : 'sidebar-closed'}\">\n        <div class=\"sidebar-header ${this.navbarController.isOpen ? '' : 'sidebar-closed'}\">\n          <div class=\"logo\">\n            ${unsafeSVG(tripteaseLogo)}\n          </div>\n          <button id=\"navbar-toggle-btn\" class=\"nav-item nav-toggle-button\" @click=${this.toggleSidebar}>\n            ${unsafeSVG(sidebarCollapsed)}\n            <span class=\"tooltip nav-toggle-tooltip\">\n              ${unsafeSVG(sidebarCollapsed)}\n              <span>Collapse sidebar</span>\n            </span>\n          </button>\n        </div>\n\n        <div class=\"nav-items ${this.navbarController.isOpen ? '' : 'sidebar-closed'}\">\n          <a\n            class=\"nav-item\"\n            href=${this.buildUrl('/')}\n            @click=${this.onAnchorClick}\n            data-intercom-target=\"dashboard\"\n          >${unsafeSVG(home)}<span>Dashboard</span></a\n          >\n          <a id=\"${Routes.CampaignManager}\" class=\"nav-item\" href=${this.campaignManagerUrl}\n             data-intercom-target=\"campaigns\"\n          >${unsafeSVG(campaigns)}<span>Campaigns</span></a\n          >\n          <a\n            class=\"nav-item\"\n            href=${this.buildUrl('/$CLIENT_KEY/channels')}\n            @click=${this.onAnchorClick}\n            data-intercom-target=\"channels\"\n          >${unsafeSVG(channels)}<span>Channels</span></a\n          >\n          <details id=\"market-insights\" @toggle=${this.handleToggle} data-intercom-target=\"market-insights\">\n            <summary>\n              ${unsafeSVG(graph)}\n              <span>Market Insights</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div class=\"dropdown-items\">\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/parity/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"parity-monitoring\"\n              >Parity monitoring</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/guest-insights/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"guest-insights\"\n              >Guest insights</a\n              >\n            </div>\n          </details>\n          <details id=\"settings\" @toggle=${this.handleToggle} data-intercom-target=\"settings\">\n            <summary>\n              ${unsafeSVG(gear)}\n              <span>Settings</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div class=\"dropdown-items\">\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/$CLIENT_KEY/guest-behavioural-data')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"email-setup\"\n              >Email setup</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/$CLIENT_KEY/crm-config')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"crm-connectivity\"\n              >CRM connectivity</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/settings/$CLIENT_KEY/guides')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"group-settings\"\n              >Group settings</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/settings/$CLIENT_KEY/hotels')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"property-settings\"\n              >Property settings</a\n              >\n            </div>\n          </details>\n          <hr />\n          <details id=\"account\" @toggle=${this.handleToggle} data-intercom-target=\"account\">\n            <summary>\n              ${unsafeSVG(user)}\n              <span>Account</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div class=\"dropdown-items\">\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/account')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"user-settings\"\n              >User settings</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/account/team/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"team-permissions\"\n              >Team and permissions</a\n              >\n            </div>\n          </details>\n          <details id=\"billing-routes\" @toggle=${this.handleToggle} data-intercom-target=\"billing\">\n            <summary>\n              ${unsafeSVG(wallet)}\n              <span>Billing</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div>\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/account/billing-management/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"booking-reconciliation\"\n              >Booking reconciliation</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/subscriptions/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"subscriptions\"\n              >Subscriptions</a\n              >\n            </div>\n          </details>\n        </div>\n        <div class=\"tertiary-nav ${this.navbarController.isOpen ? '' : 'sidebar-closed'}\">\n          <div id=\"external-links\" class=\"nav-items\">\n            <a\n              class=\"nav-item external-link\"\n              href='https://triptease.canny.io/feature-requests'\n              target=\"_blank\"\n              rel=\"noreferrer\"\n            >\n              Feature requests\n              ${unsafeSVG(external)}\n            </a>\n            <a\n              class='nav-item external-link'\n              href='https://triptease.canny.io/changelog'\n              target=\"_blank\"\n              rel=\"noreferrer\"\n            >\n              Product updates\n              ${unsafeSVG(external)}\n            </a>\n            <a\n              class='nav-item external-link'\n              href='https://help.triptease.com/'\n              target=\"_blank\"\n              rel=\"noreferrer\"\n            >\n              Help center\n              ${unsafeSVG(external)}\n            </a>\n            <hr />\n          </div>\n          <div class='nav-items'>\n            <div id=\"client-selector\">\n              ${\n                this.clients.length > 1\n                  ? html`\n                      <tt-combobox\n                        .openUpward=${true}\n                        .value=${this.clientKey ? [this.clientKey] : []}\n                        @change=${this.handleClientChange}\n                      >\n                        ${this.clients.map(\n                          client => html`\n                            <option slot=\"option\" value=${client.clientKey}>\n                              ${client.displayName}\n                            </option>\n                          `,\n                        )}\n                      </tt-combobox>\n                    `\n                  : html`\n                      <div class=\"single-client-name\">\n                        ${this.clients.find(m => m.clientKey === this.clientKey)\n                          ?.displayName}\n                      </div>\n                    `\n              }\n            </div>\n            <a\n              id=\"logout-link\"\n              class=\"nav-item\"\n              href=${this.buildUrl('/logout')}\n              @click=${this.onAnchorClick}\n              data-intercom-target=\"logout\"\n            >${unsafeSVG(logout)}<span>Logout</span></a>\n          </div>\n      </nav>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"TtNavbar.js","sourceRoot":"","sources":["../../src/TtNavbar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EACL,SAAS,EACT,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,MAAM,EACN,gBAAgB,EAChB,IAAI,EACJ,MAAM,GACP,MAAM,kBAAkB,CAAC;AAC1B,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,kBAAkB,GAAG,CAAC,KAAoB,EAAE,EAAE;IAClD,IAAI,CAAC,KAAK;QAAE,OAAO,EAAE,CAAC;IACtB,IAAI,CAAC;QACH,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,EAAE,CAAC;IACZ,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,OAAO,QAAS,SAAQ,UAAU;IAAxC;;QAOE,uBAAkB,GAAW,2CAA2C,CAAC;QAYzE,YAAO,GAAiD,EAAE,CAAC;QAG3D,iBAAY,GAAkC,SAAS,CAAC;QAGxD,WAAM,GAAY,IAAI,CAAC;QAoCvB;;;;;;;;;;;;;;;;;;;WAmBG;QACK,mBAAc,GAAG,GAAG,EAAE;YAC5B,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAE7C,IAAI,SAAwC,CAAC;YAC7C,IAAI,eAAe,GAAG,CAAC,CAAC;YAExB,uFAAuF;YACvF,IAAI,IAAI,CAAC,WAAW,KAAK,MAAM,CAAC,eAAe,EAAE,CAAC;gBAChD,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;gBAC9C,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,MAAM,CAAC,eAAe,CAAC,CAAC;YACrE,CAAC;YACD,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACjC,MAAM,UAAU,GAAG,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;gBACtE,MAAM,SAAS,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;gBAC1C,IAAI,SAAS,EAAE,CAAC;oBACd,MAAM,iBAAiB,GAAG,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC;wBACzD,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,SAAS,CAAC;wBAClD,CAAC,CAAC,SAAS,CAAC;oBACd,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;oBAC9C,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC;gBACxE,CAAC;YACH,CAAC;YAED,IAAI,CAAC,SAAS,EAAE,CAAC;gBACf,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;oBACpC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;oBACtC,IAAI,IAAI,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE,CAAC;wBACtC,IAAI,CAAC,UAAU,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;oBAClD,CAAC;oBAED,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC;oBAE7C,IAAI,WAAW,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;wBACrC,IAAI,QAAQ,CAAC,MAAM,GAAG,eAAe,EAAE,CAAC;4BACtC,SAAS,GAAG,IAAI,CAAC;4BACjB,eAAe,GAAG,QAAQ,CAAC,MAAM,CAAC;wBACpC,CAAC;oBACH,CAAC;gBACH,CAAC;YACH,CAAC;YAED,IAAI,SAAS,EAAE,CAAC;gBACd,SAAS,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;gBACxC,SAAS,CAAC,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;gBAE/C,gFAAgF;gBAChF,MAAM,aAAa,GAAG,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;gBACnD,IAAI,aAAa,EAAE,CAAC;oBAClB,aAAa,CAAC,YAAY,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;gBACzC,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,OAAO,CAAC,KAAK,CAAC,wCAAwC,WAAW,EAAE,CAAC,CAAC;YACvE,CAAC;QACH,CAAC,CAAC;QAEM,oBAAe,GAAG,CAAC,OAA4B,EAAE,EAAE;YACzD,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;gBACvC,IAAI,OAAO,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;oBACzC,MAAM,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;gBACjC,CAAC;qBAAM,IAAI,CAAC,OAAO,EAAE,CAAC;oBACpB,MAAM,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;gBACjC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QAEM,kBAAa,GAAG,GAAG,EAAE;YAC3B,IAAI,CAAC,eAAe,EAAE,CAAC;YACvB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;YAE3B,oBAAoB;QACtB,CAAC,CAAC;QAEM,wBAAmB,GAAG,CAAC,CAAc,EAAE,EAAE;YAC/C,MAAM,EAAE,QAAQ,EAAE,GAAG,CAAC,CAAC;YACvB,MAAM,MAAM,GAAG,CAAC,CAAC,aAAmC,CAAC;YAErD,IAAI,QAAQ,KAAK,MAAM,EAAE,CAAC;gBACxB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;oBACjB,IAAI,CAAC,aAAa,EAAE,CAAC;gBACvB,CAAC;gBAED,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;YAC/B,CAAC;QACH,CAAC,CAAC;QAEM,aAAQ,GAAG,CAAC,IAAY,EAAU,EAAE;YAC1C,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE,MAAM,IAAI,KAAK,CAAC,uBAAuB,CAAC,CAAC;YAE9D,MAAM,aAAa,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YAClE,IAAI,CAAC,IAAI,CAAC,WAAW;gBAAE,OAAO,aAAa,CAAC;YAE5C,OAAO,IAAI,GAAG,CAAC,aAAa,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,QAAQ,EAAE,CAAC;QAC7D,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,CAAa,EAAE,EAAE;YACxC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBACjB,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,CAAC;QACH,CAAC,CAAC;QAEM,uBAAkB,GAAG,CAAC,CAAQ,EAAE,EAAE;YACxC,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAa,CAAC;YACjC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;YAE9C,IAAI,iBAAiB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;gBAC7C,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;YACzC,CAAC;QACH,CAAC,CAAC;IAsNJ,CAAC;IA/WW,YAAY;QACpB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAEM,iBAAiB;QACtB,6CAA6C;QAC7C,MAAM,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QAEzD,4CAA4C;QAC5C,MAAM,CAAC,gBAAgB,CAAC,iBAAiB,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QAEhE,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,YAAY,KAAK,MAAM,CAAC;QAC7C,CAAC;IACH,CAAC;IAEM,oBAAoB;QACzB,MAAM,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QAC5D,MAAM,CAAC,mBAAmB,CAAC,iBAAiB,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QAEnE,KAAK,CAAC,oBAAoB,EAAE,CAAC;IAC/B,CAAC;IAoID,MAAM;QACJ,OAAO,IAAI,CAAA;gBACC,IAAI,CAAC,EAAE,WAAW,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,gBAAgB;qCAChC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,gBAAgB;;cAE1D,SAAS,CAAC,aAAa,CAAC;;qFAE+C,IAAI,CAAC,aAAa;cACzF,SAAS,CAAC,gBAAgB,CAAC;;gBAEzB,SAAS,CAAC,gBAAgB,CAAC;;;;;;gCAMX,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,gBAAgB;;;mBAGhD,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC;qBAChB,IAAI,CAAC,aAAa;;aAE1B,SAAS,CAAC,IAAI,CAAC;;mBAET,MAAM,CAAC,eAAe,2BAA2B,IAAI,CAAC,kBAAkB;;aAE9E,SAAS,CAAC,SAAS,CAAC;;;;mBAId,IAAI,CAAC,QAAQ,CAAC,uBAAuB,CAAC;qBACpC,IAAI,CAAC,aAAa;;aAE1B,SAAS,CAAC,QAAQ,CAAC;;kDAEkB,IAAI,CAAC,mBAAmB;;gBAE1D,SAAS,CAAC,KAAK,CAAC;;4CAEY,SAAS,CAAC,WAAW,CAAC;;;;;uBAK3C,IAAI,CAAC,QAAQ,CAAC,qBAAqB,CAAC;yBAClC,IAAI,CAAC,aAAa;;;;;;uBAMpB,IAAI,CAAC,QAAQ,CAAC,6BAA6B,CAAC;yBAC1C,IAAI,CAAC,aAAa;;;;;;2CAMA,IAAI,CAAC,mBAAmB;;gBAEnD,SAAS,CAAC,IAAI,CAAC;;4CAEa,SAAS,CAAC,WAAW,CAAC;;;;;uBAK3C,IAAI,CAAC,QAAQ,CAAC,qCAAqC,CAAC;yBAClD,IAAI,CAAC,aAAa;;;;;;uBAMpB,IAAI,CAAC,QAAQ,CAAC,yBAAyB,CAAC;yBACtC,IAAI,CAAC,aAAa;;;;;;uBAMpB,IAAI,CAAC,QAAQ,CAAC,8BAA8B,CAAC;yBAC3C,IAAI,CAAC,aAAa;;;;;;uBAMpB,IAAI,CAAC,QAAQ,CAAC,8BAA8B,CAAC;yBAC3C,IAAI,CAAC,aAAa;;;;;;;0CAOD,IAAI,CAAC,mBAAmB;;gBAElD,SAAS,CAAC,IAAI,CAAC;;4CAEa,SAAS,CAAC,WAAW,CAAC;;;;;uBAK3C,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC;yBACvB,IAAI,CAAC,aAAa;;;;;;uBAMpB,IAAI,CAAC,QAAQ,CAAC,2BAA2B,CAAC;yBACxC,IAAI,CAAC,aAAa;;;;;;iDAMM,IAAI,CAAC,mBAAmB;;gBAEzD,SAAS,CAAC,MAAM,CAAC;;4CAEW,SAAS,CAAC,WAAW,CAAC;;;;;uBAK3C,IAAI,CAAC,QAAQ,CAAC,yCAAyC,CAAC;yBACtD,IAAI,CAAC,aAAa;;;;;;uBAMpB,IAAI,CAAC,QAAQ,CAAC,4BAA4B,CAAC;yBACzC,IAAI,CAAC,aAAa;;;;;;;mCAOR,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,gBAAgB;;;;;;;;;gBAStD,SAAS,CAAC,QAAQ,CAAC;;;;;;;;;gBASnB,SAAS,CAAC,QAAQ,CAAC;;;;;;;;;gBASnB,SAAS,CAAC,QAAQ,CAAC;;;;;;gBAOnB,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC;YACrB,CAAC,CAAC,IAAI,CAAA;;sCAEc,IAAI;iCACT,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE;kCACrC,IAAI,CAAC,kBAAkB;;0BAE/B,IAAI,CAAC,OAAO,CAAC,GAAG,CAChB,MAAM,CAAC,EAAE,CAAC,IAAI,CAAA;0DACkB,MAAM,CAAC,SAAS;gCAC1C,MAAM,CAAC,WAAW;;2BAEvB,CACF;;qBAEJ;YACH,CAAC,CAAC,IAAI,CAAA;;0BAEE,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KAAK,IAAI,CAAC,SAAS,CAAC;gBACtD,EAAE,WAAW;;qBAGzB;;;;;qBAKO,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;uBACtB,IAAI,CAAC,aAAa;;eAE1B,SAAS,CAAC,MAAM,CAAC;;;KAG3B,CAAC;IACJ,CAAC;;AAjZM,eAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;0CACmB;AAGhD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,sBAAsB,EAAE,CAAC;oDACW;AAGzE;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;6CACjC;AAGrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;2CACjC;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;6CACpB;AAGlC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;yCACE;AAG3D;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;8CACC;AAGxD;IADC,KAAK,EAAE;wCACe;AAGvB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDACuC;AAGxD;IADT,QAAQ,CAAC,SAAS,CAAC;oDACqC;AAG/C;IADT,QAAQ,CAAC,GAAG,CAAC;6CACmC","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAll, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport {\n  campaigns,\n  channels,\n  chevronDown,\n  external,\n  gear,\n  graph,\n  home,\n  logout,\n  sidebarCollapsed,\n  user,\n  wallet,\n} from '@triptease/icons';\nimport '@triptease/tt-combobox';\nimport { styles } from './styles.js';\nimport { tripteaseLogo } from './triptease-logo.js';\nimport { urlMappings } from './urlMappings.js';\nimport { Routes } from './Routes.js';\n\nconst jsonArrayConverter = (value: string | null) => {\n  if (!value) return [];\n  try {\n    return JSON.parse(value);\n  } catch {\n    return [];\n  }\n};\n\nexport class TtNavbar extends LitElement {\n  static styles = styles;\n\n  @property({ type: Function })\n  navigate: ((e: MouseEvent) => void) | undefined;\n\n  @property({ type: String, attribute: 'campaign-manager-url' })\n  campaignManagerUrl: string = 'https://app.campaign-manager.triptease.io';\n\n  @property({ type: String, attribute: 'platform-url' })\n  platformUrl?: string;\n\n  @property({ type: String, attribute: 'client-key' })\n  clientKey?: string;\n\n  @property({ type: String, attribute: 'active-route' })\n  activeRoute?: keyof typeof Routes;\n\n  @property({ type: Array, converter: jsonArrayConverter })\n  clients: { clientKey: string; displayName: string }[] = [];\n\n  @property({ type: String, attribute: 'initial-state' })\n  initialState: 'open' | 'closed' | undefined = undefined;\n\n  @state()\n  isOpen: boolean = true;\n\n  @property({ type: Object })\n  onClientChange: ((clientKeySelected: string) => void) | undefined;\n\n  @queryAll('details')\n  protected allDetailsElements!: Array<HTMLDetailsElement>;\n\n  @queryAll('a')\n  protected allNavLinks!: Array<HTMLAnchorElement>;\n\n  protected firstUpdated() {\n    this.setActiveState();\n  }\n\n  public connectedCallback() {\n    // Listen for browser back/forward navigation\n    window.addEventListener('popstate', this.setActiveState);\n\n    // Listen for Tetris programmatic navigation\n    window.addEventListener('tetris:navigate', this.setActiveState);\n\n    super.connectedCallback();\n\n    if (this.initialState) {\n      this.isOpen = this.initialState === 'open';\n    }\n  }\n\n  public disconnectedCallback() {\n    window.removeEventListener('popstate', this.setActiveState);\n    window.removeEventListener('tetris:navigate', this.setActiveState);\n\n    super.disconnectedCallback();\n  }\n\n  /*\n   * Set the active state for the current page.\n   *\n   * This function iterates over all nav links and compares the current URL path with the href of each link.\n   * If the current URL path starts with the href of a link, the link is marked as active. If multiple links\n   * share the same prefix, the longest prefix is used as it is more specific.\n   *\n   * Example:\n   * - Current URL: /channels/123\n   * - Nav links:\n   *   - /channels\n   *   - /channels/123\n   *   - /channels/456\n   *\n   * Loop 1: currentPath = /channels/123, linkPath = /channels, bestMatch = /channels\n   * Loop 2: currentPath = /channels/123, linkPath = /channels/123, bestMatch = /channels/123\n   * Loop 3: currentPath = /channels/123, linkPath = /channels/456, bestMatch = /channels/123\n   * Result: /channels/123 is marked as active\n   *\n   */\n  private setActiveState = () => {\n    const currentPath = window.location.pathname;\n\n    let bestMatch: HTMLAnchorElement | undefined;\n    let bestMatchLength = 0;\n\n    // Check special cases first, as everything will always match on / and return Dashboard\n    if (this.activeRoute === Routes.CampaignManager) {\n      const links = Object.values(this.allNavLinks);\n      bestMatch = links.find(link => link.id === Routes.CampaignManager);\n    }\n    if (!bestMatch && this.clientKey) {\n      const parsedPath = currentPath.replace(this.clientKey, '$CLIENT_KEY');\n      const mappedUrl = urlMappings[parsedPath];\n      if (mappedUrl) {\n        const clientSpecificUrl = mappedUrl.includes('$CLIENT_KEY')\n          ? mappedUrl.replace('$CLIENT_KEY', this.clientKey)\n          : mappedUrl;\n        const links = Object.values(this.allNavLinks);\n        bestMatch = links.find(link => link.href.includes(clientSpecificUrl));\n      }\n    }\n\n    if (!bestMatch) {\n      for (const link of this.allNavLinks) {\n        link.classList.remove('current-page');\n        if (link.hasAttribute('aria-current')) {\n          link.attributes.removeNamedItem('aria-current');\n        }\n\n        const linkPath = new URL(link.href).pathname;\n\n        if (currentPath.startsWith(linkPath)) {\n          if (linkPath.length > bestMatchLength) {\n            bestMatch = link;\n            bestMatchLength = linkPath.length;\n          }\n        }\n      }\n    }\n\n    if (bestMatch) {\n      bestMatch.classList.add('current-page');\n      bestMatch.setAttribute('aria-current', 'page');\n\n      // Auto-expand parent details if the active link is within a collapsible section\n      const parentDetails = bestMatch.closest('details');\n      if (parentDetails) {\n        parentDetails.setAttribute('open', '');\n      }\n    } else {\n      console.error(`No matching nav link found for path: ${currentPath}`);\n    }\n  };\n\n  private closeAllDetails = (element?: HTMLDetailsElement) => {\n    this.allDetailsElements.forEach(detail => {\n      if (element && !detail.contains(element)) {\n        detail.removeAttribute('open');\n      } else if (!element) {\n        detail.removeAttribute('open');\n      }\n    });\n  };\n\n  private toggleSidebar = () => {\n    this.closeAllDetails();\n    this.isOpen = !this.isOpen;\n\n    // TODO - Set cookie\n  };\n\n  private handleDetailsToggle = (e: ToggleEvent) => {\n    const { newState } = e;\n    const target = e.currentTarget as HTMLDetailsElement;\n\n    if (newState === 'open') {\n      if (!this.isOpen) {\n        this.toggleSidebar();\n      }\n\n      this.closeAllDetails(target);\n    }\n  };\n\n  private buildUrl = (path: string): string => {\n    if (!this.clientKey) throw new Error('clientKey is required');\n\n    const formattedPath = path.replace('$CLIENT_KEY', this.clientKey);\n    if (!this.platformUrl) return formattedPath;\n\n    return new URL(formattedPath, this.platformUrl).toString();\n  };\n\n  private onAnchorClick = (e: MouseEvent) => {\n    if (this.navigate) {\n      this.navigate(e);\n      this.setActiveState();\n    }\n  };\n\n  private handleClientChange = (e: Event) => {\n    const combobox = e.target as any;\n    const selectedClientKey = combobox.value?.[0];\n\n    if (selectedClientKey && this.onClientChange) {\n      this.onClientChange(selectedClientKey);\n    }\n  };\n\n  render() {\n    return html`\n      <nav id=${this.id} class=\"${this.isOpen ? '' : 'sidebar-closed'}\">\n        <div class=\"sidebar-header ${this.isOpen ? '' : 'sidebar-closed'}\">\n          <div class=\"logo\">\n            ${unsafeSVG(tripteaseLogo)}\n          </div>\n          <button id=\"navbar-toggle-btn\" class=\"nav-item nav-toggle-button\" @click=${this.toggleSidebar}>\n            ${unsafeSVG(sidebarCollapsed)}\n            <span class=\"tooltip nav-toggle-tooltip\">\n              ${unsafeSVG(sidebarCollapsed)}\n              <span>Collapse sidebar</span>\n            </span>\n          </button>\n        </div>\n\n        <div class=\"nav-items ${this.isOpen ? '' : 'sidebar-closed'}\">\n          <a\n            class=\"nav-item\"\n            href=${this.buildUrl('/')}\n            @click=${this.onAnchorClick}\n            data-intercom-target=\"dashboard\"\n          >${unsafeSVG(home)}<span>Dashboard</span></a\n          >\n          <a id=\"${Routes.CampaignManager}\" class=\"nav-item\" href=${this.campaignManagerUrl}\n             data-intercom-target=\"campaigns\"\n          >${unsafeSVG(campaigns)}<span>Campaigns</span></a\n          >\n          <a\n            class=\"nav-item\"\n            href=${this.buildUrl('/$CLIENT_KEY/channels')}\n            @click=${this.onAnchorClick}\n            data-intercom-target=\"channels\"\n          >${unsafeSVG(channels)}<span>Channels</span></a\n          >\n          <details id=\"market-insights\" @toggle=${this.handleDetailsToggle} data-intercom-target=\"market-insights\">\n            <summary>\n              ${unsafeSVG(graph)}\n              <span>Market Insights</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div class=\"dropdown-items\">\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/parity/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"parity-monitoring\"\n              >Parity monitoring</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/guest-insights/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"guest-insights\"\n              >Guest insights</a\n              >\n            </div>\n          </details>\n          <details id=\"settings\" @toggle=${this.handleDetailsToggle} data-intercom-target=\"settings\">\n            <summary>\n              ${unsafeSVG(gear)}\n              <span>Settings</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div class=\"dropdown-items\">\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/$CLIENT_KEY/guest-behavioural-data')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"email-setup\"\n              >Email setup</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/$CLIENT_KEY/crm-config')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"crm-connectivity\"\n              >CRM connectivity</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/settings/$CLIENT_KEY/guides')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"group-settings\"\n              >Group settings</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/settings/$CLIENT_KEY/hotels')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"property-settings\"\n              >Property settings</a\n              >\n            </div>\n          </details>\n          <hr />\n          <details id=\"account\" @toggle=${this.handleDetailsToggle} data-intercom-target=\"account\">\n            <summary>\n              ${unsafeSVG(user)}\n              <span>Account</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div class=\"dropdown-items\">\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/account')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"user-settings\"\n              >User settings</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/account/team/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"team-permissions\"\n              >Team and permissions</a\n              >\n            </div>\n          </details>\n          <details id=\"billing-routes\" @toggle=${this.handleDetailsToggle} data-intercom-target=\"billing\">\n            <summary>\n              ${unsafeSVG(wallet)}\n              <span>Billing</span>\n              <span class=\"icon chevron\"> ${unsafeSVG(chevronDown)}</span>\n            </summary>\n            <div>\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/account/billing-management/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"booking-reconciliation\"\n              >Booking reconciliation</a\n              >\n              <a\n                class=\"sub-nav-item\"\n                href=${this.buildUrl('/subscriptions/$CLIENT_KEY')}\n                @click=${this.onAnchorClick}\n                data-intercom-target=\"subscriptions\"\n              >Subscriptions</a\n              >\n            </div>\n          </details>\n        </div>\n        <div class=\"tertiary-nav ${this.isOpen ? '' : 'sidebar-closed'}\">\n          <div id=\"external-links\" class=\"nav-items\">\n            <a\n              class=\"nav-item external-link\"\n              href='https://triptease.canny.io/feature-requests'\n              target=\"_blank\"\n              rel=\"noreferrer\"\n            >\n              Feature requests\n              ${unsafeSVG(external)}\n            </a>\n            <a\n              class='nav-item external-link'\n              href='https://triptease.canny.io/changelog'\n              target=\"_blank\"\n              rel=\"noreferrer\"\n            >\n              Product updates\n              ${unsafeSVG(external)}\n            </a>\n            <a\n              class='nav-item external-link'\n              href='https://help.triptease.com/'\n              target=\"_blank\"\n              rel=\"noreferrer\"\n            >\n              Help center\n              ${unsafeSVG(external)}\n            </a>\n            <hr />\n          </div>\n          <div class='nav-items'>\n            <div id=\"client-selector\">\n              ${\n                this.clients.length > 1\n                  ? html`\n                      <tt-combobox\n                        .openUpward=${true}\n                        .value=${this.clientKey ? [this.clientKey] : []}\n                        @change=${this.handleClientChange}\n                      >\n                        ${this.clients.map(\n                          client => html`\n                            <option slot=\"option\" value=${client.clientKey}>\n                              ${client.displayName}\n                            </option>\n                          `,\n                        )}\n                      </tt-combobox>\n                    `\n                  : html`\n                      <div class=\"single-client-name\">\n                        ${this.clients.find(m => m.clientKey === this.clientKey)\n                          ?.displayName}\n                      </div>\n                    `\n              }\n            </div>\n            <a\n              id=\"logout-link\"\n              class=\"nav-item\"\n              href=${this.buildUrl('/logout')}\n              @click=${this.onAnchorClick}\n              data-intercom-target=\"logout\"\n            >${unsafeSVG(logout)}<span>Logout</span></a>\n          </div>\n      </nav>\n    `;\n  }\n}\n"]}

package/dist/test/tt-navbar.test.js

@@ -260,72 +260,23 @@ describe('TtNavbar', () => {
         expect(anchor).to.exist;
         expect(anchor.textContent).to.include('Booking reconciliation');
     });
-    it('should default to open when Clerk is not available', async () => {
+    it("should default to 'open' when the 'initial-state' attribute is not provided", async () => {
         const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`);
         const logo = navbar.shadowRoot.querySelector('.logo');
-        expect(window.Clerk).to.be.undefined;
         expect(logo).to.exist;
         expect(logo.checkVisibility()).to.be.true;
     });
-    it('should default to state stored in Clerk when set', async () => {
-        const mockUser = {
-            unsafeMetadata: { preferences: { ui: { navigationOpen: false } } },
-        };
-        const mockAddListener = (func) => {
-            func({ user: mockUser });
-        };
-        window.Clerk = {
-            addListener: mockAddListener,
-            user: mockUser,
-        };
-        const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`);
+    it("should default to 'open' when the 'initial-state' attribute is 'open", async () => {
+        const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY} initial-state="open"></tt-navbar>`);
         const logo = navbar.shadowRoot.querySelector('.logo');
         expect(logo).to.exist;
-        expect(logo.checkVisibility()).to.be.false;
-        window.Clerk = undefined; // Cleanup
+        expect(logo.checkVisibility()).to.be.true;
     });
-    it('should update Clerk state when toggling if Clerk is available', async () => {
-        let timesCalled = 0;
-        let calledWith;
-        const mockUpdate = (args) => {
-            timesCalled += 1;
-            calledWith = args;
-        };
-        const mockUser = {
-            update: mockUpdate,
-            unsafeMetadata: {
-                foo: 'foo',
-                preferences: {
-                    bar: 'bar',
-                    ui: { duck: 'duck', navigationOpen: false },
-                },
-            },
-        };
-        const mockAddListener = (func) => {
-            func({ user: mockUser });
-        };
-        window.Clerk = {
-            addListener: mockAddListener,
-            user: mockUser,
-        };
-        const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`);
-        const navbarToggleBtn = navbar.shadowRoot.querySelector('#navbar-toggle-btn');
-        navbarToggleBtn.click();
-        await elementUpdated(navbar);
-        await expect(timesCalled).to.equal(1);
-        expect(calledWith).to.deep.equal({
-            unsafeMetadata: {
-                foo: 'foo',
-                preferences: {
-                    bar: 'bar',
-                    ui: {
-                        duck: 'duck',
-                        navigationOpen: true,
-                    },
-                },
-            },
-        });
-        window.Clerk = undefined; // Cleanup
+    it("should default to 'closed' when the 'initial-state' attribute is 'closed", async () => {
+        const navbar = await fixture(`<tt-navbar client-key=${CLIENT_KEY} initial-state="closed"></tt-navbar>`);
+        const logo = navbar.shadowRoot.querySelector('.logo');
+        expect(logo).to.exist;
+        expect(logo.checkVisibility()).to.be.false;
     });
 });
 //# sourceMappingURL=tt-navbar.test.js.map

package/dist/test/tt-navbar.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"tt-navbar.test.js","sourceRoot":"","sources":["../../test/tt-navbar.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { Clerk } from '@clerk/clerk-js';\nimport '../src/tt-navbar.js';\nimport {\n  elementUpdated,\n  expect,\n  fixture,\n  nextFrame,\n  waitUntil,\n} from '@open-wc/testing';\nimport { Resources } from '@clerk/types';\nimport { TtNavbar } from '../src/index.js';\nimport { Routes } from '../src/Routes.js';\n\n// eslint-disable-next-line no-undef\nconst getLinkByHref = (links: NodeListOf<HTMLAnchorElement>, href: string) => {\n  for (const link of links) {\n    if (link.getAttribute('href') === href) {\n      return link;\n    }\n  }\n\n  return undefined;\n};\n\nconst selectComboboxOption = async (combobox: Element, value: string) => {\n  const input = combobox.shadowRoot!.querySelector(\n    '[role=\"combobox\"]',\n  ) as HTMLInputElement;\n  input.click();\n\n  await elementUpdated(combobox);\n\n  const option = combobox.shadowRoot!.querySelector(\n    `[role=\"option\"][data-value=\"${value}\"]`,\n  ) as HTMLLIElement;\n  option.click();\n};\n\nconst isVisuallyHidden = (element: Element) => {\n  const style = getComputedStyle(element);\n\n  return Boolean(\n    style.position === 'absolute' &&\n      style.width === '1px' &&\n      style.height === '1px' &&\n      style.margin === '-1px' &&\n      style.padding === '0px' &&\n      style.borderWidth === '0px' &&\n      style.overflow === 'hidden' &&\n      style.clip === 'rect(0px, 0px, 0px, 0px)' &&\n      style.clipPath === 'inset(50%)' &&\n      style.whiteSpace === 'nowrap',\n  );\n};\n\nconst CLIENT_KEY = 'zxd47KQGAP';\n\ndescribe('TtNavbar', () => {\n  it('should throw an error if the clientKey is not provided', async () => {\n    try {\n      await fixture<TtNavbar>(`<tt-navbar></tt-navbar>`);\n    } catch (e) {\n      expect(e).to.match(/clientKey is required/);\n    }\n  });\n  it('should render with the default links', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n\n    if (links) {\n      expect(getLinkByHref(links, '/')).to.exist;\n      expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n        .to.exist;\n      expect(getLinkByHref(links, `/${CLIENT_KEY}/channels`)).to.exist;\n      expect(getLinkByHref(links, `/parity/${CLIENT_KEY}`)).to.exist;\n      expect(getLinkByHref(links, `/guest-insights/${CLIENT_KEY}`)).to.exist;\n      expect(getLinkByHref(links, `/${CLIENT_KEY}/guest-behavioural-data`)).to\n        .exist;\n      expect(getLinkByHref(links, `/${CLIENT_KEY}/crm-config`)).to.exist;\n      expect(getLinkByHref(links, `/settings/${CLIENT_KEY}/guides`)).to.exist;\n      expect(getLinkByHref(links, `/settings/${CLIENT_KEY}/hotels`)).to.exist;\n      expect(getLinkByHref(links, `/account`)).to.exist;\n      expect(getLinkByHref(links, `/account/team/${CLIENT_KEY}`)).to.exist;\n      expect(getLinkByHref(links, `/account/billing-management/${CLIENT_KEY}`))\n        .to.exist;\n      expect(getLinkByHref(links, `/subscriptions/${CLIENT_KEY}`)).to.exist;\n    }\n  });\n\n  it('should render platform URLs against the base URL when it is defined', async () => {\n    const platformUrl = 'https://app.triptease.io';\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY} platform-url=\"${platformUrl}\"></tt-navbar>`,\n    );\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n\n    if (links) {\n      expect(getLinkByHref(links, `${platformUrl}/`)).to.exist;\n      expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n        .to.exist; // This shouldn't change\n      expect(getLinkByHref(links, `${platformUrl}/${CLIENT_KEY}/channels`)).to\n        .exist;\n    }\n  });\n\n  it.skip('should allow navigation events to be handled externally', async () => {\n    let navigateEventCount = 0;\n\n    const onNavigate = (e: MouseEvent) => {\n      e.preventDefault();\n      navigateEventCount += 1;\n    };\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.navigate = onNavigate;\n    await navbar.updateComplete;\n\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n    links?.forEach(l => l.click());\n\n    await waitUntil(\n      () => expect(navigateEventCount).to.equal(13),\n      'navigate event did not fire',\n    );\n  });\n\n  it('should render a combobox when multiple clients are provided', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.clients = [\n      { clientKey: CLIENT_KEY, displayName: 'Client One' },\n      { clientKey: 'abc123', displayName: 'Client Two' },\n    ];\n    await navbar.updateComplete;\n\n    const combobox = navbar.shadowRoot?.querySelector('tt-combobox');\n    const singleClientName = navbar.shadowRoot?.querySelector(\n      '.single-client-name',\n    );\n\n    expect(combobox).to.exist;\n    expect(singleClientName).to.not.exist;\n    expect(combobox?.value).to.deep.equal([CLIENT_KEY]);\n  });\n\n  it('should render the client name when only one client is provided', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.clients = [{ clientKey: CLIENT_KEY, displayName: 'Single Client' }];\n    await navbar.updateComplete;\n\n    const singleClientName = navbar.shadowRoot?.querySelector(\n      '.single-client-name',\n    );\n    const combobox = navbar.shadowRoot?.querySelector('tt-combobox');\n\n    expect(singleClientName).to.exist;\n    expect(singleClientName?.textContent?.trim()).to.equal('Single Client');\n    expect(combobox).to.not.exist;\n  });\n\n  it('should render the logout link', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n    const logoutLink = getLinkByHref(links!, '/logout');\n\n    expect(logoutLink).to.exist;\n  });\n\n  it('should close other details when one is being opened', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const allDetails = navbar.shadowRoot!.querySelectorAll('summary');\n    const [marketInsights, settings] = allDetails;\n\n    marketInsights.click();\n    /*\n     * Wait for the DOM to update before continuing. This is necessary because helpers like elementUpdated don't wait for\n     * the browser to fire the $toggle handler as well as adding the open attribute.\n     */\n    await nextFrame();\n    await nextFrame();\n\n    expect(marketInsights.closest('details')?.open).to.be.true;\n\n    settings.click();\n    await nextFrame();\n    await nextFrame();\n\n    expect(settings.closest('details')?.open).to.be.true;\n    expect(marketInsights.closest('details')?.open).to.be.false;\n  });\n\n  it('should collapse the navbar when toggle clicked', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const navbarToggleBtn = navbar.shadowRoot!.querySelector(\n      '#navbar-toggle-btn',\n    ) as HTMLButtonElement;\n\n    navbarToggleBtn.click();\n    await elementUpdated(navbar);\n\n    const logo = navbar.shadowRoot!.querySelector('.logo');\n    const rootLinksHiddenElements =\n      navbar.shadowRoot!.querySelectorAll('nav a span');\n    const summaryHiddenElements =\n      navbar.shadowRoot!.querySelectorAll('nav summary span');\n    const externalLinks =\n      navbar.shadowRoot!.querySelectorAll('#external-links a');\n    const logoutLink = navbar.shadowRoot!.querySelector('#logout-link span');\n    const clientSelector = navbar.shadowRoot!.querySelector('#client-selector');\n\n    // Visually and accessibly hidden\n    expect(logo?.checkVisibility()).to.be.false;\n    expect(clientSelector?.checkVisibility()).to.be.false;\n    for (const link of externalLinks) {\n      expect(link.checkVisibility()).to.be.false;\n    }\n\n    // Visually hidden only\n    expect(logoutLink).to.exist;\n    expect(rootLinksHiddenElements.length).to.be.greaterThan(1);\n    expect(summaryHiddenElements.length).to.be.greaterThan(1);\n    for (const element of [\n      ...rootLinksHiddenElements,\n      ...summaryHiddenElements,\n      logoutLink!,\n    ]) {\n      expect(isVisuallyHidden(element)).to.be.true;\n    }\n  });\n\n  const collapsibleIds: string[] = [\n    'market-insights',\n    'settings',\n    'account',\n    'billing-routes',\n  ];\n  collapsibleIds.forEach(id => {\n    it(`should open the nav bar when the ${id} collapsible is clicked`, async () => {\n      const navbar = await fixture<TtNavbar>(\n        `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n      );\n\n      const navbarToggleBtn = navbar.shadowRoot!.querySelector(\n        '#navbar-toggle-btn',\n      ) as HTMLButtonElement;\n\n      navbarToggleBtn.click();\n      await elementUpdated(navbar);\n\n      const logo = navbar.shadowRoot!.querySelector('.logo');\n      expect(logo?.checkVisibility()).to.be.false;\n\n      const element: HTMLDetailsElement | null =\n        navbar.shadowRoot!.querySelector(`#${id} summary`);\n\n      expect(element).to.exist;\n\n      element!.click();\n\n      await waitUntil(() => logo?.checkVisibility(), 'navbar should be open', {\n        timeout: 500,\n      });\n    });\n  });\n\n  const URLs = [\n    ['/', 'Dashboard'],\n    [`/${CLIENT_KEY}/channels`, 'Channels'],\n    [`/parity/${CLIENT_KEY}`, 'Parity'],\n    [`/parity/${CLIENT_KEY}`, 'Parity'],\n    [`/parity/${CLIENT_KEY}/foo`, 'Parity'],\n    [`/meta/${CLIENT_KEY}/performance`, 'Channels'],\n    [`/chat/insights/${CLIENT_KEY}`, 'Channels'],\n    [`/${CLIENT_KEY}/email`, 'Channels'],\n    [`/settings/${CLIENT_KEY}/branding`, 'Group settings'],\n    [`/settings/${CLIENT_KEY}/price-check`, 'Group settings'],\n  ];\n\n  URLs.forEach(([route, text]) => {\n    it(`should show the current page as active when link is ${route}`, async () => {\n      // eslint-disable-next-line no-restricted-globals\n      history.pushState({}, '', route); // 👈 mock URL\n\n      const navbar = await fixture<TtNavbar>(\n        `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n      );\n\n      const anchor = navbar.shadowRoot!.querySelector('a[aria-current=\"page\"]');\n\n      expect(anchor).to.exist;\n      expect(anchor!.textContent).to.include(text);\n    });\n  });\n\n  it('should show the current page as campaign manager when on the given campaign manager url', async () => {\n    const platformUrl = 'https://app.triptease.io';\n    const campaignManagerUrl = 'http://localhost:8000';\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY} platform-url=${platformUrl} campaign-manager-url=${campaignManagerUrl} active-route=\"${Routes.CampaignManager}\"></tt-navbar>`,\n    );\n    const anchor = navbar.shadowRoot!.querySelector('a[aria-current=\"page\"]');\n    expect(anchor).to.exist;\n    expect(anchor!.textContent).to.include('Campaigns');\n  });\n\n  it('should fire an event when the client is changed', async () => {\n    let selectedClientKey: string | undefined;\n    const onClientChange = (clientKey: string) => {\n      selectedClientKey = clientKey;\n    };\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.clients = [\n      { clientKey: CLIENT_KEY, displayName: 'Client One' },\n      { clientKey: 'abc123', displayName: 'Client Two' },\n    ];\n    navbar.onClientChange = onClientChange;\n\n    await navbar.updateComplete;\n\n    const combobox = navbar.shadowRoot?.querySelector('tt-combobox');\n    expect(combobox).to.exist;\n\n    await selectComboboxOption(combobox!, 'abc123');\n\n    expect(selectedClientKey).to.equal('abc123');\n  });\n\n  it('should set the --nav-bar-width css variable when collapsed', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    await expect(\n      getComputedStyle(navbar).getPropertyValue('--nav-bar-width').trim(),\n    ).to.equal('260px');\n\n    const navbarToggleBtn = navbar.shadowRoot!.querySelector(\n      '#navbar-toggle-btn',\n    ) as HTMLButtonElement;\n\n    navbarToggleBtn.click();\n    await elementUpdated(navbar);\n\n    await expect(\n      getComputedStyle(navbar).getPropertyValue('--nav-bar-width').trim(),\n    ).to.equal('fit-content');\n  });\n\n  it('should expand the details when the current page is within that section', async () => {\n    // eslint-disable-next-line no-restricted-globals\n    history.pushState({}, '', `/parity/${CLIENT_KEY}`);\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const marketInsightsDetails = navbar.shadowRoot!.querySelector(\n      '#market-insights',\n    ) as HTMLDetailsElement;\n\n    expect(marketInsightsDetails).to.exist;\n    expect(marketInsightsDetails.open).to.be.true;\n  });\n\n  it('should set the active route when receives `tetris:navigate` event', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    // eslint-disable-next-line no-restricted-globals\n    history.pushState({}, '', `/account/billing-management/${CLIENT_KEY}`);\n\n    // Dispatch the event to change to Channels route\n    const navigateEvent = new CustomEvent('tetris:navigate', {});\n    window.dispatchEvent(navigateEvent);\n\n    await elementUpdated(navbar);\n    const anchor = navbar.shadowRoot!.querySelector('a[aria-current=\"page\"]');\n\n    expect(anchor).to.exist;\n    expect(anchor!.textContent).to.include('Booking reconciliation');\n  });\n\n  it('should default to open when Clerk is not available', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const logo = navbar.shadowRoot!.querySelector('.logo');\n\n    expect(window.Clerk).to.be.undefined;\n    expect(logo).to.exist;\n    expect(logo!.checkVisibility()).to.be.true;\n  });\n\n  it('should default to state stored in Clerk when set', async () => {\n    const mockUser = {\n      unsafeMetadata: { preferences: { ui: { navigationOpen: false } } },\n    };\n\n    const mockAddListener = (func: (resources: Resources) => void) => {\n      func({ user: mockUser } as unknown as Resources);\n    };\n\n    window.Clerk = {\n      addListener: mockAddListener,\n      user: mockUser,\n    } as Clerk;\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const logo = navbar.shadowRoot!.querySelector('.logo');\n\n    expect(logo).to.exist;\n    expect(logo!.checkVisibility()).to.be.false;\n\n    window.Clerk = undefined; // Cleanup\n  });\n\n  it('should update Clerk state when toggling if Clerk is available', async () => {\n    let timesCalled = 0;\n    let calledWith: unknown;\n\n    const mockUpdate = (args: unknown) => {\n      timesCalled += 1;\n      calledWith = args;\n    };\n\n    const mockUser = {\n      update: mockUpdate,\n      unsafeMetadata: {\n        foo: 'foo',\n        preferences: {\n          bar: 'bar',\n          ui: { duck: 'duck', navigationOpen: false },\n        },\n      },\n    };\n\n    const mockAddListener = (func: (resources: Resources) => void) => {\n      func({ user: mockUser } as unknown as Resources);\n    };\n\n    window.Clerk = {\n      addListener: mockAddListener,\n      user: mockUser,\n    } as unknown as Clerk;\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const navbarToggleBtn = navbar.shadowRoot!.querySelector(\n      '#navbar-toggle-btn',\n    ) as HTMLButtonElement;\n\n    navbarToggleBtn.click();\n    await elementUpdated(navbar);\n\n    await expect(timesCalled).to.equal(1);\n    expect(calledWith).to.deep.equal({\n      unsafeMetadata: {\n        foo: 'foo',\n        preferences: {\n          bar: 'bar',\n          ui: {\n            duck: 'duck',\n            navigationOpen: true,\n          },\n        },\n      },\n    });\n\n    window.Clerk = undefined; // Cleanup\n  });\n});\n"]}
+{"version":3,"file":"tt-navbar.test.js","sourceRoot":"","sources":["../../test/tt-navbar.test.ts"],"names":[],"mappings":"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","sourcesContent":["import '../src/tt-navbar.js';\nimport {\n  elementUpdated,\n  expect,\n  fixture,\n  nextFrame,\n  waitUntil,\n} from '@open-wc/testing';\nimport { TtNavbar } from '../src/index.js';\nimport { Routes } from '../src/Routes.js';\n\n// eslint-disable-next-line no-undef\nconst getLinkByHref = (links: NodeListOf<HTMLAnchorElement>, href: string) => {\n  for (const link of links) {\n    if (link.getAttribute('href') === href) {\n      return link;\n    }\n  }\n\n  return undefined;\n};\n\nconst selectComboboxOption = async (combobox: Element, value: string) => {\n  const input = combobox.shadowRoot!.querySelector(\n    '[role=\"combobox\"]',\n  ) as HTMLInputElement;\n  input.click();\n\n  await elementUpdated(combobox);\n\n  const option = combobox.shadowRoot!.querySelector(\n    `[role=\"option\"][data-value=\"${value}\"]`,\n  ) as HTMLLIElement;\n  option.click();\n};\n\nconst isVisuallyHidden = (element: Element) => {\n  const style = getComputedStyle(element);\n\n  return Boolean(\n    style.position === 'absolute' &&\n      style.width === '1px' &&\n      style.height === '1px' &&\n      style.margin === '-1px' &&\n      style.padding === '0px' &&\n      style.borderWidth === '0px' &&\n      style.overflow === 'hidden' &&\n      style.clip === 'rect(0px, 0px, 0px, 0px)' &&\n      style.clipPath === 'inset(50%)' &&\n      style.whiteSpace === 'nowrap',\n  );\n};\n\nconst CLIENT_KEY = 'zxd47KQGAP';\n\ndescribe('TtNavbar', () => {\n  it('should throw an error if the clientKey is not provided', async () => {\n    try {\n      await fixture<TtNavbar>(`<tt-navbar></tt-navbar>`);\n    } catch (e) {\n      expect(e).to.match(/clientKey is required/);\n    }\n  });\n  it('should render with the default links', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n\n    if (links) {\n      expect(getLinkByHref(links, '/')).to.exist;\n      expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n        .to.exist;\n      expect(getLinkByHref(links, `/${CLIENT_KEY}/channels`)).to.exist;\n      expect(getLinkByHref(links, `/parity/${CLIENT_KEY}`)).to.exist;\n      expect(getLinkByHref(links, `/guest-insights/${CLIENT_KEY}`)).to.exist;\n      expect(getLinkByHref(links, `/${CLIENT_KEY}/guest-behavioural-data`)).to\n        .exist;\n      expect(getLinkByHref(links, `/${CLIENT_KEY}/crm-config`)).to.exist;\n      expect(getLinkByHref(links, `/settings/${CLIENT_KEY}/guides`)).to.exist;\n      expect(getLinkByHref(links, `/settings/${CLIENT_KEY}/hotels`)).to.exist;\n      expect(getLinkByHref(links, `/account`)).to.exist;\n      expect(getLinkByHref(links, `/account/team/${CLIENT_KEY}`)).to.exist;\n      expect(getLinkByHref(links, `/account/billing-management/${CLIENT_KEY}`))\n        .to.exist;\n      expect(getLinkByHref(links, `/subscriptions/${CLIENT_KEY}`)).to.exist;\n    }\n  });\n\n  it('should render platform URLs against the base URL when it is defined', async () => {\n    const platformUrl = 'https://app.triptease.io';\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY} platform-url=\"${platformUrl}\"></tt-navbar>`,\n    );\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n\n    if (links) {\n      expect(getLinkByHref(links, `${platformUrl}/`)).to.exist;\n      expect(getLinkByHref(links, 'https://app.campaign-manager.triptease.io'))\n        .to.exist; // This shouldn't change\n      expect(getLinkByHref(links, `${platformUrl}/${CLIENT_KEY}/channels`)).to\n        .exist;\n    }\n  });\n\n  it.skip('should allow navigation events to be handled externally', async () => {\n    let navigateEventCount = 0;\n\n    const onNavigate = (e: MouseEvent) => {\n      e.preventDefault();\n      navigateEventCount += 1;\n    };\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.navigate = onNavigate;\n    await navbar.updateComplete;\n\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n    links?.forEach(l => l.click());\n\n    await waitUntil(\n      () => expect(navigateEventCount).to.equal(13),\n      'navigate event did not fire',\n    );\n  });\n\n  it('should render a combobox when multiple clients are provided', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.clients = [\n      { clientKey: CLIENT_KEY, displayName: 'Client One' },\n      { clientKey: 'abc123', displayName: 'Client Two' },\n    ];\n    await navbar.updateComplete;\n\n    const combobox = navbar.shadowRoot?.querySelector('tt-combobox');\n    const singleClientName = navbar.shadowRoot?.querySelector(\n      '.single-client-name',\n    );\n\n    expect(combobox).to.exist;\n    expect(singleClientName).to.not.exist;\n    expect(combobox?.value).to.deep.equal([CLIENT_KEY]);\n  });\n\n  it('should render the client name when only one client is provided', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.clients = [{ clientKey: CLIENT_KEY, displayName: 'Single Client' }];\n    await navbar.updateComplete;\n\n    const singleClientName = navbar.shadowRoot?.querySelector(\n      '.single-client-name',\n    );\n    const combobox = navbar.shadowRoot?.querySelector('tt-combobox');\n\n    expect(singleClientName).to.exist;\n    expect(singleClientName?.textContent?.trim()).to.equal('Single Client');\n    expect(combobox).to.not.exist;\n  });\n\n  it('should render the logout link', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const links = navbar.shadowRoot?.querySelectorAll('a');\n    const logoutLink = getLinkByHref(links!, '/logout');\n\n    expect(logoutLink).to.exist;\n  });\n\n  it('should close other details when one is being opened', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const allDetails = navbar.shadowRoot!.querySelectorAll('summary');\n    const [marketInsights, settings] = allDetails;\n\n    marketInsights.click();\n    /*\n     * Wait for the DOM to update before continuing. This is necessary because helpers like elementUpdated don't wait for\n     * the browser to fire the $toggle handler as well as adding the open attribute.\n     */\n    await nextFrame();\n    await nextFrame();\n\n    expect(marketInsights.closest('details')?.open).to.be.true;\n\n    settings.click();\n    await nextFrame();\n    await nextFrame();\n\n    expect(settings.closest('details')?.open).to.be.true;\n    expect(marketInsights.closest('details')?.open).to.be.false;\n  });\n\n  it('should collapse the navbar when toggle clicked', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const navbarToggleBtn = navbar.shadowRoot!.querySelector(\n      '#navbar-toggle-btn',\n    ) as HTMLButtonElement;\n\n    navbarToggleBtn.click();\n    await elementUpdated(navbar);\n\n    const logo = navbar.shadowRoot!.querySelector('.logo');\n    const rootLinksHiddenElements =\n      navbar.shadowRoot!.querySelectorAll('nav a span');\n    const summaryHiddenElements =\n      navbar.shadowRoot!.querySelectorAll('nav summary span');\n    const externalLinks =\n      navbar.shadowRoot!.querySelectorAll('#external-links a');\n    const logoutLink = navbar.shadowRoot!.querySelector('#logout-link span');\n    const clientSelector = navbar.shadowRoot!.querySelector('#client-selector');\n\n    // Visually and accessibly hidden\n    expect(logo?.checkVisibility()).to.be.false;\n    expect(clientSelector?.checkVisibility()).to.be.false;\n    for (const link of externalLinks) {\n      expect(link.checkVisibility()).to.be.false;\n    }\n\n    // Visually hidden only\n    expect(logoutLink).to.exist;\n    expect(rootLinksHiddenElements.length).to.be.greaterThan(1);\n    expect(summaryHiddenElements.length).to.be.greaterThan(1);\n    for (const element of [\n      ...rootLinksHiddenElements,\n      ...summaryHiddenElements,\n      logoutLink!,\n    ]) {\n      expect(isVisuallyHidden(element)).to.be.true;\n    }\n  });\n\n  const collapsibleIds: string[] = [\n    'market-insights',\n    'settings',\n    'account',\n    'billing-routes',\n  ];\n  collapsibleIds.forEach(id => {\n    it(`should open the nav bar when the ${id} collapsible is clicked`, async () => {\n      const navbar = await fixture<TtNavbar>(\n        `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n      );\n\n      const navbarToggleBtn = navbar.shadowRoot!.querySelector(\n        '#navbar-toggle-btn',\n      ) as HTMLButtonElement;\n\n      navbarToggleBtn.click();\n      await elementUpdated(navbar);\n\n      const logo = navbar.shadowRoot!.querySelector('.logo');\n      expect(logo?.checkVisibility()).to.be.false;\n\n      const element: HTMLDetailsElement | null =\n        navbar.shadowRoot!.querySelector(`#${id} summary`);\n\n      expect(element).to.exist;\n\n      element!.click();\n\n      await waitUntil(() => logo?.checkVisibility(), 'navbar should be open', {\n        timeout: 500,\n      });\n    });\n  });\n\n  const URLs = [\n    ['/', 'Dashboard'],\n    [`/${CLIENT_KEY}/channels`, 'Channels'],\n    [`/parity/${CLIENT_KEY}`, 'Parity'],\n    [`/parity/${CLIENT_KEY}`, 'Parity'],\n    [`/parity/${CLIENT_KEY}/foo`, 'Parity'],\n    [`/meta/${CLIENT_KEY}/performance`, 'Channels'],\n    [`/chat/insights/${CLIENT_KEY}`, 'Channels'],\n    [`/${CLIENT_KEY}/email`, 'Channels'],\n    [`/settings/${CLIENT_KEY}/branding`, 'Group settings'],\n    [`/settings/${CLIENT_KEY}/price-check`, 'Group settings'],\n  ];\n\n  URLs.forEach(([route, text]) => {\n    it(`should show the current page as active when link is ${route}`, async () => {\n      // eslint-disable-next-line no-restricted-globals\n      history.pushState({}, '', route); // 👈 mock URL\n\n      const navbar = await fixture<TtNavbar>(\n        `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n      );\n\n      const anchor = navbar.shadowRoot!.querySelector('a[aria-current=\"page\"]');\n\n      expect(anchor).to.exist;\n      expect(anchor!.textContent).to.include(text);\n    });\n  });\n\n  it('should show the current page as campaign manager when on the given campaign manager url', async () => {\n    const platformUrl = 'https://app.triptease.io';\n    const campaignManagerUrl = 'http://localhost:8000';\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY} platform-url=${platformUrl} campaign-manager-url=${campaignManagerUrl} active-route=\"${Routes.CampaignManager}\"></tt-navbar>`,\n    );\n    const anchor = navbar.shadowRoot!.querySelector('a[aria-current=\"page\"]');\n    expect(anchor).to.exist;\n    expect(anchor!.textContent).to.include('Campaigns');\n  });\n\n  it('should fire an event when the client is changed', async () => {\n    let selectedClientKey: string | undefined;\n    const onClientChange = (clientKey: string) => {\n      selectedClientKey = clientKey;\n    };\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    navbar.clients = [\n      { clientKey: CLIENT_KEY, displayName: 'Client One' },\n      { clientKey: 'abc123', displayName: 'Client Two' },\n    ];\n    navbar.onClientChange = onClientChange;\n\n    await navbar.updateComplete;\n\n    const combobox = navbar.shadowRoot?.querySelector('tt-combobox');\n    expect(combobox).to.exist;\n\n    await selectComboboxOption(combobox!, 'abc123');\n\n    expect(selectedClientKey).to.equal('abc123');\n  });\n\n  it('should set the --nav-bar-width css variable when collapsed', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    await expect(\n      getComputedStyle(navbar).getPropertyValue('--nav-bar-width').trim(),\n    ).to.equal('260px');\n\n    const navbarToggleBtn = navbar.shadowRoot!.querySelector(\n      '#navbar-toggle-btn',\n    ) as HTMLButtonElement;\n\n    navbarToggleBtn.click();\n    await elementUpdated(navbar);\n\n    await expect(\n      getComputedStyle(navbar).getPropertyValue('--nav-bar-width').trim(),\n    ).to.equal('fit-content');\n  });\n\n  it('should expand the details when the current page is within that section', async () => {\n    // eslint-disable-next-line no-restricted-globals\n    history.pushState({}, '', `/parity/${CLIENT_KEY}`);\n\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const marketInsightsDetails = navbar.shadowRoot!.querySelector(\n      '#market-insights',\n    ) as HTMLDetailsElement;\n\n    expect(marketInsightsDetails).to.exist;\n    expect(marketInsightsDetails.open).to.be.true;\n  });\n\n  it('should set the active route when receives `tetris:navigate` event', async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n    // eslint-disable-next-line no-restricted-globals\n    history.pushState({}, '', `/account/billing-management/${CLIENT_KEY}`);\n\n    // Dispatch the event to change to Channels route\n    const navigateEvent = new CustomEvent('tetris:navigate', {});\n    window.dispatchEvent(navigateEvent);\n\n    await elementUpdated(navbar);\n    const anchor = navbar.shadowRoot!.querySelector('a[aria-current=\"page\"]');\n\n    expect(anchor).to.exist;\n    expect(anchor!.textContent).to.include('Booking reconciliation');\n  });\n\n  it(\"should default to 'open' when the 'initial-state' attribute is not provided\", async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`,\n    );\n\n    const logo = navbar.shadowRoot!.querySelector('.logo');\n\n    expect(logo).to.exist;\n    expect(logo!.checkVisibility()).to.be.true;\n  });\n\n  it(\"should default to 'open' when the 'initial-state' attribute is 'open\", async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY} initial-state=\"open\"></tt-navbar>`,\n    );\n\n    const logo = navbar.shadowRoot!.querySelector('.logo');\n\n    expect(logo).to.exist;\n    expect(logo!.checkVisibility()).to.be.true;\n  });\n\n  it(\"should default to 'closed' when the 'initial-state' attribute is 'closed\", async () => {\n    const navbar = await fixture<TtNavbar>(\n      `<tt-navbar client-key=${CLIENT_KEY} initial-state=\"closed\"></tt-navbar>`,\n    );\n\n    const logo = navbar.shadowRoot!.querySelector('.logo');\n\n    expect(logo).to.exist;\n    expect(logo!.checkVisibility()).to.be.false;\n  });\n});\n"]}

package/dist/web/Routes.js

@@ -1,5 +1,5 @@
 /**
-* @triptease/tt-navbar v0.0.45
+* @triptease/tt-navbar v0.0.46
 */
 
 // src/Routes.ts