{"version":3,"names":["accordionCss","Accordion","componentWillLoad","this","accordionId","accordionTitle","replace","window","location","hash","toLowerCase","open","toggleAccordion","closeOtherAccordions","accordions","document","querySelectorAll","forEach","accordion","closeAccordion","async","render","h","class","id","type","onClick","icon","role"],"sources":["./src/components/accordion/accordion.scss?tag=app-accordion","./src/components/accordion/accordion.tsx"],"sourcesContent":[".app-accordion {\r\n\tbackground-color: #ffffff;\r\n\t// box-shadow: 0px 6px 17px rgba($primary, 0.1);\r\n\tmargin: 16px 0;\r\n  \toverflow: hidden;\r\n\ttransition: all 300ms ease-out;\r\n\tborder-radius: 10px;\r\n\r\n\t&> h3 {\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&__trigger {\r\n\t\tcolor: $primary;\r\n\t\tbackground: #F6F4EF;\r\n        padding: 18px 54px 18px 18px;\r\n\t\tposition: relative;\r\n        text-align: left;\r\n\t\ttransition: background 300ms ease-out;\r\n        width: 100%;\r\n\t\tdisplay: flex;\r\n    \talign-items: center;\r\n\t\tjustify-content: space-between;\r\n\t\tgap: 18px;\r\n\t\tflex-wrap: nowrap;\r\n\t\tfont-size: 16px;\r\n\t\tfont-weight: 600;\r\n\t\tline-height: 24px;\r\n\t\tborder: 1px solid #EDE8DF;\r\n\t\tborder-radius: 10px;\r\n\r\n\t\tapp-icon {\r\n    \t\ttransition: inherit;\r\n\t\t\twidth: 29px;\r\n\t\t\theight: 29px !important;\r\n\t\t\tdisplay: flex;\r\n\t\t\talign-items: center;\r\n\t\t\tjustify-content: center;\r\n\t\t\tborder-radius: 100%;\r\n\t\t\tbackground: transparent;\r\n\t\t\tborder: 2px solid $secondary;\r\n\t\t\tvertical-align: middle;\r\n\t\t\tposition: absolute;\r\n\t\t\tright: 18px;\r\n\t\t\t\r\n\t\t\tsvg {\r\n      \t\t\t@include svg-format(18px, 18px, currentColor);\r\n    \t\t}\r\n\t\t}\r\n\r\n\t\t&:hover {\r\n\t\t\tbackground: #EDE8DF;\r\n\t\t\toutline: none;\r\n\r\n\t\t\tapp-icon {\r\n\t\t\t\tcolor: $secondary;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t&[aria-expanded=\"true\"] {\r\n\t\t\tborder-bottom-left-radius: 0;\r\n\t\t\tborder-bottom-right-radius: 0;\r\n\t\t\tbackground: #EDE8DF;\r\n\t\t\tborder-color: #E2D9C9;\r\n\t\t\tborder-bottom-color: #EDE8DF;\r\n\t\t\ttransition: transform 300ms ease-out;\r\n\r\n\t\t\tapp-icon {\r\n\t\t\t\ttransition: transform 300ms ease-out;\r\n\t\t\t\ttransform: rotate(180deg);\r\n\t\t\t\tbackground: $primary;\r\n\t\t\t\tborder-color: $primary;\r\n\t\t\t\tcolor: #ffffff;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&__content {\r\n\t\tvisibility: visible;\r\n\t\toverflow: hidden;\r\n\t\tpadding-inline: 18px;\r\n\t\ttransition: max-height 300ms ease-out, visibility 300ms ease-out;\r\n\t\tbackground: #EDE8DF;\r\n\t\tborder: 1px solid #E2D9C9;\r\n\t\tborder-top: none;\r\n\t\tborder-bottom-left-radius: 10px;\r\n\t\tborder-bottom-right-radius: 10px;\r\n\r\n\t\t&[aria-hidden=\"true\"] {\r\n\t\t\tmax-height: 0;\r\n\t\t\tvisibility: hidden;\r\n\t\t\ttransition: max-height 300ms ease-out, visibility 300ms ease-out;\r\n\t\t}\r\n\r\n\t\t&-wrapper {\r\n\t\t\tpadding-block: 18px;\r\n\t\t\tborder-top: 1px solid #E2D9C9;\r\n\t\t\tfont-size: 16px;\r\n\r\n\t\t\tp {\r\n\t\t\t\twidth: 100%;\r\n\t\t\t\tmax-inline-size: 100%;\r\n\t\t\t}\r\n\r\n\t\t\t&> :last-child {\r\n\t\t\t\tpadding-bottom: 0;\r\n\t\t\t\tmargin-bottom: 0;\r\n\t\t\t} \r\n\t\t}\r\n\t}\r\n}\r\n","import { Component, h, Method, Prop, State } from '@stencil/core';\r\nimport type { ComponentInterface } from '@stencil/core';\r\n\r\n@Component({\r\n\ttag: 'app-accordion',\r\n\tstyleUrl: 'accordion.scss'\r\n})\r\nexport class Accordion implements ComponentInterface {\r\n\t@Prop() accordionTitle: string;\r\n\t@Prop({ \r\n\t\tmutable: true \r\n\t}) accordionId: string;\r\n\t@State() open: boolean = false;\r\n\r\n\tcomponentWillLoad() {\r\n\t\t// If not id is provided, generate one using the accordion title.\r\n\t\tif (!this.accordionId) {\r\n\t\t\tthis.accordionId = this.accordionTitle.replace(/[\\s]/gi, '-').replace(/[^A-Z0-9\\-]/gi, '');\r\n\t\t}\r\n\r\n\t\t// If hash matches this accordion, open on load\r\n\t\tif (window.location.hash && window.location.hash.toLowerCase() == '#' + this.accordionId.toLowerCase()) {\r\n\t\t\tthis.open = true;\r\n\t\t}\r\n\t}\r\n\r\n\ttoggleAccordion() {\r\n\t\tthis.closeOtherAccordions();\r\n\t\tthis.open = !this.open;\r\n\t}\r\n\r\n\tcloseOtherAccordions() {\r\n\t\tconst accordions = document.querySelectorAll('app-accordion');\r\n\r\n\t\taccordions?.forEach(accordion => {\r\n\t\t\tif (accordion.accordionId != this.accordionId) {\r\n\t\t\t\taccordion.closeAccordion();\r\n\t\t\t}\r\n\t\t});\r\n\t}\r\n\r\n\t@Method() async closeAccordion() {\r\n\t\tthis.open = false;\r\n\t}\r\n\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t<section class=\"app-accordion\">\r\n\t\t\t\t<h3>\r\n\t\t\t\t\t<button\r\n\t\t\t\t\t\tid={this.accordionId}\r\n\t\t\t\t\t\tclass=\"app-accordion__trigger\"\r\n\t\t\t\t\t\taria-controls={this.accordionId + \"_content\"}\r\n\t\t\t\t\t\taria-expanded={this.open ? 'true' : 'false'}\r\n\t\t\t\t\t\ttype=\"button\"\r\n\t\t\t\t\t\tonClick={() => {this.toggleAccordion();}}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{this.accordionTitle}\r\n\t\t\t\t\t\t<app-icon icon=\"caret-down\" />\r\n\t\t\t\t\t</button>\r\n\t\t\t\t</h3>\r\n\t\t\t\t<div\r\n\t\t\t\t\tid={this.accordionId + \"_content\"}\r\n\t\t\t\t\tclass=\"app-accordion__content\"\r\n\t\t\t\t\trole=\"region\"\r\n\t\t\t\t\taria-labeledby={this.accordionId}\r\n\t\t\t\t\t{...(!this.open && {'aria-hidden':'true'})}\r\n\t\t\t\t>\r\n\t\t\t\t\t<div class=\"app-accordion__content-wrapper\">\r\n\t\t\t\t\t\t<slot />\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</section>\r\n\t\t);\r\n\t}\r\n}\r\n"],"mappings":"2CAAA,MAAMA,EAAe,m9D,MCORC,EAAS,M,4FAKI,K,CAEzBC,oBAEC,IAAKC,KAAKC,YAAa,CACtBD,KAAKC,YAAcD,KAAKE,eAAeC,QAAQ,SAAU,KAAKA,QAAQ,gBAAiB,G,CAIxF,GAAIC,OAAOC,SAASC,MAAQF,OAAOC,SAASC,KAAKC,eAAiB,IAAMP,KAAKC,YAAYM,cAAe,CACvGP,KAAKQ,KAAO,I,EAIdC,kBACCT,KAAKU,uBACLV,KAAKQ,MAAQR,KAAKQ,I,CAGnBE,uBACC,MAAMC,EAAaC,SAASC,iBAAiB,iBAE7CF,GAAYG,SAAQC,IACnB,GAAIA,EAAUd,aAAeD,KAAKC,YAAa,CAC9Cc,EAAUC,gB,KAKHC,uBACTjB,KAAKQ,KAAO,K,CAGbU,SACC,OACCC,EAAA,WAASC,MAAM,iBACdD,EAAA,UACCA,EAAA,UACCE,GAAIrB,KAAKC,YACTmB,MAAM,yBAAwB,gBACfpB,KAAKC,YAAc,WAAU,gBAC7BD,KAAKQ,KAAO,OAAS,QACpCc,KAAK,SACLC,QAAS,KAAOvB,KAAKS,iBAAiB,GAErCT,KAAKE,eACNiB,EAAA,YAAUK,KAAK,iBAGjBL,EAAA,OACCE,GAAIrB,KAAKC,YAAc,WACvBmB,MAAM,yBACNK,KAAK,SAAQ,iBACGzB,KAAKC,gBACfD,KAAKQ,MAAQ,CAAC,cAAc,SAElCW,EAAA,OAAKC,MAAM,kCACVD,EAAA,e"}