{"version":3,"file":"accordion.js","sources":["../../FrontEnd/PDP-FE/src/scripts/modules/accordion.ts"],"sourcesContent":["import { Component } from '@verndale/core';\nimport '../../scss/modules/accordion.scss';\n\nclass Accordion extends Component {\n  private currentlyOpenItem: HTMLButtonElement | null = null;\n\n  setupDefaults() {\n    this.dom = {\n      el: this.el,\n      triggers: this.el.querySelectorAll('.accordion__item-trigger'),\n      panels: this.el.querySelectorAll('.accordion__item-panel')\n    };\n\n    this.initAccordion();\n  }\n\n  addListeners() {\n    (this.dom.triggers as NodeList).forEach(trigger =>\n      trigger.addEventListener('click', this.handleClick.bind(this))\n    );\n  }\n\n  initAccordion() {\n    (this.dom.triggers as NodeListOf<HTMLButtonElement>).forEach(trigger => {\n      if (trigger.getAttribute('aria-expanded') === 'true') {\n        this.currentlyOpenItem = trigger;\n      }\n    });\n  }\n\n  handleClick(e: Event) {\n    const trigger = e.currentTarget as HTMLButtonElement;\n\n    if (trigger !== this.currentlyOpenItem) {\n      if (this.currentlyOpenItem) {\n        this.closeItem(this.currentlyOpenItem);\n      }\n      this.openItem(trigger);\n    } else {\n      this.closeItem(trigger);\n    }\n  }\n\n  openItem(trigger: HTMLButtonElement) {\n    trigger.setAttribute('aria-expanded', 'true');\n    this.currentlyOpenItem = trigger;\n\n    const panelId = trigger.getAttribute('aria-controls');\n    const panel = this.el.querySelector(`#${panelId}`) as HTMLElement;\n\n    if (panel) {\n      const panelContent = panel.querySelector<HTMLElement>('.accordion__item-content');\n\n      if (panelContent !== null) {\n        panel.style.blockSize = `${panelContent?.offsetHeight}px`;\n      } else {\n        panel.style.blockSize = 'auto';\n      }\n\n      setTimeout(() => (panel.style.blockSize = 'auto'), 250);\n    }\n  }\n\n  closeItem(trigger: HTMLButtonElement) {\n    trigger.setAttribute('aria-expanded', 'false');\n    if (trigger === this.currentlyOpenItem) {\n      this.currentlyOpenItem = null;\n    }\n\n    const panelId = trigger.getAttribute('aria-controls');\n    const panel = this.el.querySelector(`#${panelId}`) as HTMLElement;\n\n    if (panel) {\n      const panelContent = panel.querySelector<HTMLElement>('.accordion__item-content');\n\n      if (panelContent !== null) {\n        panel.style.blockSize = `${panelContent?.offsetHeight}px`;\n      } else {\n        panel.style.blockSize = '0';\n      }\n      setTimeout(() => (panel.style.blockSize = '0'));\n    }\n  }\n}\n\nexport default Accordion;\n"],"names":["Accordion","Component","__publicField","trigger","panelId","panel","panelContent"],"mappings":"wMAGA,MAAMA,UAAkBC,CAAU,CAAlC,kCACUC,EAAA,yBAA8C,MAEtD,eAAgB,CACd,KAAK,IAAM,CACT,GAAI,KAAK,GACT,SAAU,KAAK,GAAG,iBAAiB,0BAA0B,EAC7D,OAAQ,KAAK,GAAG,iBAAiB,wBAAwB,CAAA,EAG3D,KAAK,cAAc,CACrB,CAEA,cAAe,CACZ,KAAK,IAAI,SAAsB,QAAQC,GACtCA,EAAQ,iBAAiB,QAAS,KAAK,YAAY,KAAK,IAAI,CAAC,CAAA,CAEjE,CAEA,eAAgB,CACb,KAAK,IAAI,SAA2C,QAAmBA,GAAA,CAClEA,EAAQ,aAAa,eAAe,IAAM,SAC5C,KAAK,kBAAoBA,EAC3B,CACD,CACH,CAEA,YAAY,EAAU,CACpB,MAAMA,EAAU,EAAE,cAEdA,IAAY,KAAK,mBACf,KAAK,mBACF,KAAA,UAAU,KAAK,iBAAiB,EAEvC,KAAK,SAASA,CAAO,GAErB,KAAK,UAAUA,CAAO,CAE1B,CAEA,SAASA,EAA4B,CAC3BA,EAAA,aAAa,gBAAiB,MAAM,EAC5C,KAAK,kBAAoBA,EAEnB,MAAAC,EAAUD,EAAQ,aAAa,eAAe,EAC9CE,EAAQ,KAAK,GAAG,cAAc,IAAID,CAAO,EAAE,EAEjD,GAAIC,EAAO,CACH,MAAAC,EAAeD,EAAM,cAA2B,0BAA0B,EAE5EC,IAAiB,KACnBD,EAAM,MAAM,UAAY,GAAGC,GAAA,YAAAA,EAAc,YAAY,KAErDD,EAAM,MAAM,UAAY,OAG1B,WAAW,IAAOA,EAAM,MAAM,UAAY,OAAS,GAAG,CACxD,CACF,CAEA,UAAUF,EAA4B,CAC5BA,EAAA,aAAa,gBAAiB,OAAO,EACzCA,IAAY,KAAK,oBACnB,KAAK,kBAAoB,MAGrB,MAAAC,EAAUD,EAAQ,aAAa,eAAe,EAC9CE,EAAQ,KAAK,GAAG,cAAc,IAAID,CAAO,EAAE,EAEjD,GAAIC,EAAO,CACH,MAAAC,EAAeD,EAAM,cAA2B,0BAA0B,EAE5EC,IAAiB,KACnBD,EAAM,MAAM,UAAY,GAAGC,GAAA,YAAAA,EAAc,YAAY,KAErDD,EAAM,MAAM,UAAY,IAE1B,WAAW,IAAOA,EAAM,MAAM,UAAY,GAAI,CAChD,CACF,CACF"}