{"version":3,"sources":["webpack:///./src/js/helpers/debounce.js","webpack:///./node_modules/roving-ux/dist/index.module.js","webpack:///./src/js/modules/tabbed-featured-content.js"],"names":["debounce","callback","wait","timerId","args","clearTimeout","setTimeout","Map","window","getComputedStyle","document","documentElement","direction","n","LEFT","UP","RIGHT","DOWN","r","t","currentTarget","get","has","d","active","set","a","e","keyCode","preventDefault","i","s","o","MutationObserver","filter","removedNodes","length","forEach","concat","nodeType","c","contains","removeEventListener","delete","targets","tabIndex","size","clear","disconnect","index","focus","TabbedFeaturedContent","Component","el","super","this","defaultValue","dataset","panels","setTabPanels","currentCard","querySelector","dom","tabsList","querySelectorAll","element","target","addEventListener","observe","childList","subtree","rovingIndex","selectedTab","firstTab","firstPanel","firstCard","value","classList","add","init","container","tabs","cards","dropdown","panelsContainer","_a","trigger","handleTabClick","bind","handleDropdownChange","handleResize","tab","id","panel","__spreadProps","__spreadValues","button","activeTab","activePanel","remove","blur","ariaSelected","currentPanel","calculateOffset","getMaxCardHeight","defaultTab","setActiveTab","item","card","height","offsetHeight","style","setProperty","maxHeight","Math","max","Array","from","map","parentElement"],"mappings":"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","file":"10.1dcff14e1e2a947b95b3.js?v=c6bdba20766f48043c55","sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\n\nexport const debounce = (callback, wait) => {\n  let timerId;\n  return (...args) => {\n    clearTimeout(timerId);\n    timerId = setTimeout(() => {\n      callback(...args);\n    }, wait);\n  };\n};\n\nexport const useDebounce = (callback, waitTime) => {\n  const ref = useRef();\n\n  useEffect(() => {\n    ref.current = callback;\n  }, [callback]);\n\n  const debouncedCallback = useMemo(() => {\n    const func = () => {\n      ref.current?.();\n    };\n\n    return debounce(func, waitTime);\n  }, []);\n\n  return debouncedCallback;\n};\n\n","var e=new Map,t=\"rtl\"===window.getComputedStyle(document.documentElement).direction,n={LEFT:37,UP:38,RIGHT:39,DOWN:40},r=function(t){var n=t.currentTarget;e.get(\"last_rover\")!=n&&e.has(n)&&(d(n,e.get(n).active),e.set(\"last_rover\",n))},a=function(e){var r=e.currentTarget;switch(e.keyCode){case n[t?\"LEFT\":\"RIGHT\"]:case n.DOWN:e.preventDefault(),i(r);break;case n[t?\"RIGHT\":\"LEFT\"]:case n.UP:e.preventDefault(),s(r)}},o=new MutationObserver(function(t,n){t.filter(function(e){return e.removedNodes.length>0}).forEach(function(t){[].concat(t.removedNodes).filter(function(e){return 1===e.nodeType}).forEach(function(t){e.forEach(function(n,c){\"last_rover\"!==c&&t.contains(c)&&(c.removeEventListener(\"focusin\",r),c.removeEventListener(\"keydown\",a),e.delete(c),n.targets.forEach(function(e){return e.tabIndex=\"\"}),(0===e.size||1===e.size&&e.has(\"last_rover\"))&&(e.clear(),o.disconnect()))})})})}),c=function(t){var n=t.element,c=n.querySelectorAll(t.target||\":scope *\"),i=c[0];n.tabIndex=-1,c.forEach(function(e){return e.tabIndex=-1}),i.tabIndex=0,e.set(n,{targets:c,active:i,index:0}),n.addEventListener(\"focusin\",r),n.addEventListener(\"keydown\",a),o.observe(document,{childList:!0,subtree:!0})},i=function(t){var n=e.get(t);n.index+=1,n.index>n.targets.length-1&&(n.index=n.targets.length-1);var r=n.targets[n.index];r&&d(t,r)},s=function(t){var n=e.get(t);n.index-=1,n.index<1&&(n.index=0);var r=n.targets[n.index];r&&d(t,r)},d=function(t,n){var r=e.get(t);r.active.tabIndex=-1,r.active=n,r.active.tabIndex=0,r.active.focus()};export{c as rovingIndex};\n//# sourceMappingURL=index.module.js.map\n","import { Component } from '@verndale/core';\nimport { rovingIndex } from 'roving-ux';\nimport { debounce } from '../helpers/debounce';\n\nclass TabbedFeaturedContent extends Component {\n  constructor(el) {\n    super(el);\n    this.defaultValue = this.el.dataset.defaultValue;\n    this.panels = this.setTabPanels();\n    this.currentCard = this.el.querySelector(\n      '.tabbed-featured-content__panel.active .featured-content-card'\n    );\n\n    if (\n      this.dom.tabsList &&\n      (this.dom.tabsList).querySelectorAll(\n        '.tabbed-featured-content__tab'\n      ).length > 0\n    ) {\n      rovingIndex({\n        element: this.dom.tabsList,\n        target: '.tabbed-featured-content__tab'\n      });\n    }\n\n    this.defaultValue = this.el.dataset.defaultValue;\n    const selectedTab = this.el.querySelector(\n      `.tabbed-featured-content__tab[data-value=\"${this.defaultValue}\"]`\n    );\n\n    if (!this.defaultValue || !selectedTab) {\n      const firstTab = this.el.querySelector(\n        '.tabbed-featured-content__tab'\n      );\n\n      const firstPanel = this.el.querySelector(\n        '.tabbed-featured-content__panel'\n      );\n\n      const firstCard = firstPanel?.querySelector(\n        '.featured-content-card'\n      );\n\n      if (firstTab && firstPanel && firstCard) {\n        this.defaultValue = firstTab.dataset.value;\n        firstTab.classList.add('active');\n        firstPanel.classList.add('active');\n        this.currentCard = firstCard;\n      }\n    }\n\n    this.panels = this.setTabPanels();\n\n    this.init();\n  }\n\n  setupDefaults() {\n    this.dom = {\n      container: this.el,\n      tabsList: this.el.querySelector(\n        '.tabbed-featured-content__tabs-list'\n      ),\n      tabs: this.el.querySelectorAll(\n        '.tabbed-featured-content__tab'\n      ),\n      panels: this.el.querySelectorAll(\n        '.tabbed-featured-content__panel'\n      ),\n      cards: this.el.querySelectorAll('.featured-content-card'),\n      dropdown: this.el.querySelector('.field__select'),\n      panelsContainer: this.el.querySelector(\n        '.tabbed-featured-content__content-wrapper'\n      )\n    };\n  }\n\n  addListeners() {\n    (this.dom.tabs).forEach(trigger => {\n      trigger.addEventListener('click', this.handleTabClick.bind(this));\n    });\n\n    (this.dom.dropdown)?.addEventListener(\n      'change',\n      this.handleDropdownChange.bind(this)\n    );\n\n    window.addEventListener(\n      'resize',\n      debounce(this.handleResize.bind(this), 250)\n    );\n  }\n\n  setTabPanels() {\n    let panels = {};\n\n    (this.dom.tabs)?.forEach(tab => {\n      const value = tab.dataset.value;\n      const id = tab.id;\n      const panel = this.el.querySelector(\n        `[aria-labelledby=\"${id}\"]`\n      );\n\n      if (value) {\n        panels = { ...panels, [value]: panel };\n      }\n    });\n\n    return panels;\n  }\n\n  setActiveTab(button) {\n    const activeTab = button;\n    const activePanel = activeTab.dataset.value;\n\n    if (activePanel) {\n      (this.dom.panels).forEach(panel => {\n        panel.classList.add('tabbed-featured-content__panel--hidden');\n        panel.classList.remove('.active');\n      });\n\n      (this.dom.tabs).forEach(tab => {\n        tab.classList.remove('active');\n        tab.blur();\n        tab.ariaSelected = 'false';\n      });\n\n      const currentPanel =\n        this.panels[activePanel];\n\n      currentPanel?.classList.remove('tabbed-featured-content__panel--hidden');\n      currentPanel?.classList.add('active');\n\n      const currentCard = currentPanel.querySelector(\n        '.featured-content-card'\n      );\n      currentCard?.focus();\n\n      activeTab.classList.add('active');\n      activeTab.ariaSelected = 'true';\n\n      if (this.dom.dropdown)\n        (this.dom.dropdown).value = activePanel;\n\n      this.calculateOffset(currentCard);\n      this.getMaxCardHeight();\n\n      setTimeout(() => {\n        this.calculateOffset(currentCard);\n        this.getMaxCardHeight();\n      });\n    }\n  }\n\n  init() {\n    if (this.defaultValue) {\n      const defaultTab = this.el.querySelector(\n        `.tabbed-featured-content__tab[data-value=\"${this.defaultValue}\"]`\n      );\n\n      if (defaultTab) {\n        this.setActiveTab(defaultTab);\n      }\n    } else if (this.dom.tabs) {\n      this.setActiveTab(\n        (this.dom.tabs).item(0)\n      );\n    }\n\n    this.getMaxCardHeight();\n  }\n\n  calculateOffset(card = null) {\n    const currentCard = card || this.currentCard;\n    const height = currentCard?.offsetHeight;\n\n    if (this.dom.container && height) {\n      const container = this.dom.container;\n      const containerHeight = container.offsetHeight;\n      const offsetHeight = height - containerHeight;\n\n      if (offsetHeight !== 0) {\n        container.style.setProperty(\n          '--tab-content-offset',\n          `${offsetHeight > 0 ? offsetHeight / 2 : 0}px`\n        );\n      }\n    }\n  }\n\n  getMaxCardHeight() {\n    (this.dom.panelsContainer).classList.add(\n      '.tabbed-featured-content__content-wrapper--hidden'\n    );\n\n    const maxHeight = Math.max(\n      ...Array.from(this.dom.cards).map(\n        panel => panel.offsetHeight\n      )\n    );\n\n    (this.dom.container).style.setProperty(\n      '--min-featured-card-height',\n      `${maxHeight}px`\n    );\n\n    (this.dom.panelsContainer).classList.remove(\n      '.tabbed-featured-content__content-wrapper--hidden'\n    );\n  }\n\n  handleTabClick(e) {\n    const target = e.target;\n    this.setActiveTab(\n      target.classList.contains('tabbed-featured-content__tab')\n        ? target\n        : (target.parentElement)\n    );\n  }\n\n  handleResize() {\n    this.getMaxCardHeight();\n    this.calculateOffset();\n    setTimeout(() => {\n      this.getMaxCardHeight();\n      this.calculateOffset();\n    });\n  }\n\n  handleDropdownChange(e) {\n    const target = e.target;\n    const value = target.value;\n    const tab = this.el.querySelector(\n      `.tabbed-featured-content__tab[data-value=\"${value}\"]`\n    );\n\n    if (tab) {\n      this.setActiveTab(tab);\n    }\n  }\n}\n\nexport default TabbedFeaturedContent;\n"],"sourceRoot":""}