{"version":3,"file":"location-menu-Bpz0Rvsb.js","sources":["../../../../../src/scripts/modules/header/location-menu.ts"],"sourcesContent":["import { Component } from '@verndale/core';\nimport { isLargeDesktop } from '../../helpers';\n\nclass LocationMenu extends Component {\n  outsideClickListener: EventListenerOrEventListenerObject;\n  resizeObserver: ResizeObserver;\n  widthAdded: boolean;\n  escapeKeyListener: EventListener;\n\n  constructor(el: HTMLElement) {\n    super(el);\n    this.outsideClickListener = this.handleOutsideClick.bind(this);\n    this.resizeObserver = new ResizeObserver(this.adjustDropdownWidth.bind(this));\n    this.widthAdded = false;\n    this.escapeKeyListener = this.handleEscapeKeyPress.bind(this) as EventListener;\n  }\n\n  setupDefaults() {\n    this.dom = {\n      header: this.el.closest<HTMLElement>('header'),\n      trigger: this.el.querySelector<HTMLElement>('.location-menu__button'),\n      dropdown: this.el.querySelector<HTMLElement>('.location-menu__dropdown'),\n      backButton: this.el.querySelector<HTMLElement>('.location-menu__back-button'),\n      accordions: this.el.querySelectorAll<HTMLElement>('.location-menu__accordion'),\n      sublists: this.el.querySelectorAll<HTMLElement>('.location-menu__sublist'),\n    };\n\n    this.dom.navigationPrimaryItems = (this.dom.header as HTMLElement).querySelectorAll<HTMLElement>('.global-navigation__items__navigation-item');\n    this.dom.navigationSecondaryItems = (this.dom.header as HTMLElement).querySelectorAll<HTMLElement>('.global-navigation__menu-column');\n    this.dom.navigationPrimaryItemsContainer = (this.dom.header as HTMLElement).querySelector<HTMLElement>('.global-navigation__items');\n\n    this.resizeObserver = new ResizeObserver(this.adjustDropdownWidth.bind(this));\n    this.resizeObserver.observe(this.dom.dropdown as HTMLElement);\n  }\n\n  addListeners() {\n    (this.dom.trigger as HTMLElement).addEventListener('click', this.handleToggleDropdown.bind(this));\n    (this.dom.backButton as HTMLElement).addEventListener('click', this.handleBackToMenu.bind(this));\n\n    Array.from(this.dom.accordions as NodeListOf<HTMLElement>).forEach((accordion) => {\n      accordion.addEventListener('click', this.handleAccordionClick.bind(this));\n    });\n  }\n\n  openAccordion(accordion: HTMLElement) {\n    const trigger = accordion.querySelector('.location-menu__accordion') as HTMLElement;\n    const panel = accordion.querySelector('.location-menu__pannel') as HTMLElement;\n    accordion.classList.add('location-menu__item--open');\n    trigger.setAttribute('aria-expanded', 'true');\n\n    if (panel) {\n      panel.style.display = 'block';\n      const pannelContent = panel.querySelector<HTMLElement>('.location-menu__sublist');\n\n      panel.style.height = `${pannelContent?.offsetHeight}px`;\n\n      setTimeout(() => (panel.style.height = 'auto'), 250);\n    }\n  }\n\n  closeAccordion(accordion: HTMLElement) {\n    const trigger = accordion.querySelector('.location-menu__accordion') as HTMLElement;\n    const panel = accordion.querySelector('.location-menu__pannel') as HTMLElement;\n    accordion.classList.remove('location-menu__item--open');\n    trigger.setAttribute('aria-expanded', 'false');\n\n    if (panel) {\n      const pannelContent = panel.querySelector<HTMLElement>('.location-menu__sublist');\n      panel.style.height = `${pannelContent?.offsetHeight}px`;\n      setTimeout(() => (panel.style.height = '0px'));\n      setTimeout(() => (panel.style.display = 'none'), 500);\n    }\n  }\n\n  handleAccordionClick(event: Event) {\n    const target = event.target as HTMLElement;\n    const parent = target.closest('.location-menu__item') as HTMLElement;\n\n    if (parent.classList.contains('location-menu__item--open')) {\n      this.closeAccordion(parent);\n      return;\n    }\n\n    this.openAccordion(parent);\n  }\n\n  openDropdown() {\n    (this.dom.trigger as HTMLElement).setAttribute('aria-expanded', 'true');\n    this.el.classList.add('location-menu--open');\n    this.el.parentElement?.classList.add('utility-navigation__location-menu--open');\n    const utilityNav = this.el.closest('.utility-navigation') as HTMLElement;\n\n\n    if (!isLargeDesktop()) {\n      (this.dom.navigationPrimaryItemsContainer as HTMLElement).classList.add('global-navigation__items--hidden');\n      (this.dom.dropdown as HTMLElement).style.blockSize = `calc(100% - 68px - ${utilityNav.offsetHeight}px)`;\n    }\n\n    document.addEventListener('click', this.outsideClickListener);\n    document.addEventListener('keydown', this.escapeKeyListener);\n  }\n\n  closeDropdown() {\n    (this.dom.trigger as HTMLElement).setAttribute('aria-expanded', 'false');\n    this.el.classList.remove('location-menu--open');\n    this.el.parentElement?.classList.remove('utility-navigation__location-menu--open');\n\n    Array.from(this.dom.navigationPrimaryItems as NodeListOf<HTMLElement>).forEach((navigationItem) => {\n      navigationItem.classList.remove('global-navigation__items__navigation-item--active');\n      (this.dom.navigationPrimaryItemsContainer as HTMLElement).classList.remove('global-navigation__items--hidden');\n    });\n\n    Array.from(this.dom.navigationSecondaryItems as NodeListOf<HTMLElement>).forEach((navigationItem) => {\n      const secondary = navigationItem.closest('.global-navigation__items__navigation-item') as HTMLElement;\n      secondary.classList.remove('global-navigation__items__navigation-item--hidden');  \n      navigationItem.classList.remove('--active');\n    });\n    \n    document.removeEventListener('click', this.outsideClickListener);\n    document.removeEventListener('keydown', this.escapeKeyListener);\n  }\n\n  handleToggleDropdown() {\n    if (this.el.classList.contains('location-menu--open')) {\n      this.closeDropdown();\n      return;\n    }\n\n    this.openDropdown();\n  }\n\n  handleBackToMenu() {\n    this.closeDropdown();\n  }\n\n  handleOutsideClick(event: Event) {\n    const isClickInside = this.el.contains(event.target as Node);\n    if (!isClickInside) {\n      this.closeDropdown();\n    }\n  }\n\n  handleEscapeKeyPress(event: KeyboardEvent) {\n    if (event.key === 'Escape') {\n      this.closeDropdown();\n    }\n  }\n\n  getScrollbarWidth() {\n    const container = document.createElement('div');\n    container.style.overflow = 'scroll';\n    container.style.visibility = 'hidden';\n    container.style.position = 'absolute';\n    container.style.top = '0';\n    container.style.left = '0';\n    container.style.width = '100px';\n    container.style.height = '100px';\n    document.body.appendChild(container);\n  \n    const inner = document.createElement('div');\n    inner.style.width = '100%';\n    inner.style.height = '100%';\n    container.appendChild(inner);\n  \n    const scrollbarWidth = container.offsetWidth - inner.offsetWidth;\n    document.body.removeChild(container);\n  \n    return scrollbarWidth;\n  }\n\n  adjustDropdownWidth() {\n    if (!isLargeDesktop()) return;\n\n    const dropdown = this.dom.dropdown as HTMLElement;\n    const hasScrollbar = dropdown.scrollHeight > dropdown.clientHeight;\n    const scrollbarWidth = this.getScrollbarWidth();\n    \n    if (hasScrollbar && !this.widthAdded) {\n      dropdown.style.insetInlineEnd = `-${scrollbarWidth}px`;\n      dropdown.style.inlineSize = `${dropdown.offsetWidth + scrollbarWidth}px`;\n      this.widthAdded = true;\n    } else if (!hasScrollbar && this.widthAdded) {\n      dropdown.style.insetInlineEnd = '0';\n      dropdown.style.inlineSize = 'auto';\n      this.widthAdded = false;\n    }\n  }\n}\n\nexport default LocationMenu;"],"names":["LocationMenu","Component","el","__publicField","accordion","trigger","panel","pannelContent","event","parent","_a","utilityNav","isLargeDesktop","navigationItem","container","inner","scrollbarWidth","dropdown","hasScrollbar"],"mappings":"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"}