@three11/accordion/dist/accordion.cjs.map

Front-end Accordion widget using max-height

{"version":3,"file":"accordion.cjs","sources":["../src/accordion.ts"],"sourcesContent":["import './accordion.css';\n\nexport type AccordionOptions = {\n\theadSelector: string;\n\tbodySelector: string;\n\thiddenClass: string;\n\tactiveClass: string;\n};\n\nexport class Accordion {\n\tprivate el: HTMLElement | null;\n\tprivate head: HTMLElement | null;\n\tprivate body: HTMLElement | null;\n\n\tprivate height = 0;\n\tprivate isOpen = false;\n\n\tprivate settings: AccordionOptions;\n\tprivate defaultSettings: AccordionOptions = {\n\t\theadSelector: '[data-title]',\n\t\tbodySelector: '[data-content]',\n\t\thiddenClass: 'is--hidden',\n\t\tactiveClass: 'is--active'\n\t};\n\n\tconstructor(el: HTMLElement | null, options: Partial<AccordionOptions> = {}) {\n\t\tthis.settings = {\n\t\t\t...this.defaultSettings,\n\t\t\t...options\n\t\t};\n\t\tthis.el = el;\n\t\tthis.head = this.el?.querySelector(this.settings.headSelector) || null;\n\t\tthis.body = this.el?.querySelector(this.settings.bodySelector) || null;\n\n\t\tthis.bind().close();\n\n\t\treturn this;\n\t}\n\n\tprivate bind(): Accordion {\n\t\tif (this.head) {\n\t\t\tthis.head.addEventListener('click', this.toggle.bind(this));\n\t\t}\n\n\t\tif (this.body) {\n\t\t\tthis.body.addEventListener('transitionend', () => {\n\t\t\t\tif (!this.isOpen && this.el) {\n\t\t\t\t\tthis.el.classList.add(this.settings.hiddenClass);\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\n\t\treturn this;\n\t}\n\n\tprivate setHeight(n: number): Accordion {\n\t\tsetTimeout(() => {\n\t\t\tif (this.body) {\n\t\t\t\tthis.body.style.maxHeight = `${n}px`;\n\t\t\t}\n\t\t}, 1);\n\n\t\treturn this;\n\t}\n\n\tpublic toggle(): Accordion {\n\t\tthis.height = this.body?.scrollHeight || 0;\n\n\t\tthis.isOpen ? this.close() : this.open();\n\n\t\treturn this;\n\t}\n\n\tpublic close(): Accordion {\n\t\tthis.isOpen = false;\n\n\t\tif (this.el) {\n\t\t\tthis.el.classList.remove(this.settings.activeClass);\n\t\t}\n\n\t\tif (this.body) {\n\t\t\tthis.body.style.maxHeight = `${this.height}px`;\n\t\t}\n\n\t\tthis.setHeight(0);\n\n\t\treturn this;\n\t}\n\n\tpublic open(): Accordion {\n\t\tthis.isOpen = true;\n\n\t\tif (this.el) {\n\t\t\tthis.el.classList.add(this.settings.activeClass);\n\t\t\tthis.el.classList.remove(this.settings.hiddenClass);\n\t\t}\n\n\t\tif (this.body) {\n\t\t\tthis.body.style.maxHeight = `${0}px`;\n\t\t}\n\n\t\tthis.setHeight(this.height);\n\n\t\treturn this;\n\t}\n}\n\nexport default Accordion;\n"],"names":["Accordion","el","options","head","body","height","isOpen","this","settings","defaultSettings","headSelector","bodySelector","hiddenClass","activeClass","_extends","_this$el","querySelector","_this$el2","bind","close","addEventListener","toggle","_this","classList","add","_proto","setHeight","n","setTimeout","_this2","style","maxHeight","_this$body","scrollHeight","open","remove"],"mappings":"oOASaA,IAAAA,0BAgBZ,SAAYC,EAAAA,EAAwBC,WAWnC,YAXmC,IAAAA,IAAAA,EAAqC,CAAE,GAfnED,KAAAA,QACAE,EAAAA,KAAAA,UACAC,EAAAA,KAAAA,iBAEAC,OAAS,EACTC,KAAAA,QAAS,EAAKC,KAEdC,cAAQ,EAAAD,KACRE,gBAAoC,CAC3CC,aAAc,eACdC,aAAc,iBACdC,YAAa,aACbC,YAAa,cAIbN,KAAKC,SAAQM,EAAA,CAAA,EACTP,KAAKE,gBACLP,GAEJK,KAAKN,GAAKA,EACVM,KAAKJ,oBAAYF,WAALc,EAASC,cAAcT,KAAKC,SAASE,gBAAiB,KAClEH,KAAKH,MAAc,OAAHa,EAAAV,KAACN,SAAE,EAAPgB,EAASD,cAAcT,KAAKC,SAASG,gBAAiB,KAElEJ,KAAKW,OAAOC,QAGbZ,IAAA,CAAC,IAEOW,EAAAA,EAAAA,UAoET,OApESA,EAAAA,KAAA,sBAaP,OAZIX,KAAKJ,MACRI,KAAKJ,KAAKiB,iBAAiB,QAASb,KAAKc,OAAOH,KAAKX,OAGlDA,KAAKH,MACRG,KAAKH,KAAKgB,iBAAiB,gBAAiB,YACtCE,EAAKhB,QAAUgB,EAAKrB,IACxBqB,EAAKrB,GAAGsB,UAAUC,IAAIF,EAAKd,SAASI,YAEtC,OAIF,EAACa,EAEOC,UAAA,SAAUC,GACjBC,IAAAA,EAAAA,KAMA,OANAA,WAAW,WACNC,EAAKzB,OACRyB,EAAKzB,KAAK0B,MAAMC,UAAeJ,EAC/B,KACF,EAAG,GAGJpB,IAAA,IAEOc,OAAA,WAAM,IAAAW,EAKZ,OAJAzB,KAAKF,QAAkB,OAAT2B,EAAAzB,KAAKH,WAAI,EAAT4B,EAAWC,eAAgB,EAEzC1B,KAAKD,OAASC,KAAKY,QAAUZ,KAAK2B,WAGnC,EAACT,EAEMN,MAAA,WAaN,OAZAZ,KAAKD,QAAS,EAEVC,KAAKN,IACRM,KAAKN,GAAGsB,UAAUY,OAAO5B,KAAKC,SAASK,aAGpCN,KAAKH,OACRG,KAAKH,KAAK0B,MAAMC,UAAexB,KAAKF,OAAM,MAG3CE,KAAKmB,UAAU,GAGhBnB,IAAA,EAEO2B,EAAAA,KAAA,WAcN,OAbA3B,KAAKD,QAAS,EAEVC,KAAKN,KACRM,KAAKN,GAAGsB,UAAUC,IAAIjB,KAAKC,SAASK,aACpCN,KAAKN,GAAGsB,UAAUY,OAAO5B,KAAKC,SAASI,cAGpCL,KAAKH,OACRG,KAAKH,KAAK0B,MAAMC,UAAe,OAGhCxB,KAAKmB,UAAUnB,KAAKF,QAGrBE,IAAA,EAGDP,CAAA"}