1"use strict";(self.webpackChunksvk_designsystem=self.webpackChunksvk_designsystem||[]).push([[5720,9734],{25720:function(t,e,n){n.r(e);class o extends HTMLElement{static observedAttributes=["expanded"];constructor(){super(),this.dom={},this.el=this,this.shadowDom={},this.expanded=this.getAttribute("expanded")||!1,this.attachShadow({mode:"open"})}modifyTitleSlot(){let t=this.querySelector("[slot=title]");t.classList.add("heading-04"),t.innerHTML=`\n\t\t\t<button class="accordion-item__button" id="${this.id}" aria-expanded="${this.expanded}" aria-controls="${this.id}-content">\n\t\t\t\t${t.textContent}\n\t\t\t\t<svk-icon name="arrow-down"></svk-icon>\n\t\t\t</button>`}connectedCallback(){this.modifyTitleSlot(),this.render(),this.dom.button=this.querySelector(".accordion-item__button"),this.shadowDom.content=this.shadowRoot.querySelector(".accordion-item__content"),this.dom.button.addEventListener("click",this.handleClick.bind(this))}open(){this.dom.button.setAttribute("aria-expanded",!0),this.setAttribute("expanded",!0)}close(){this.dom.button.setAttribute("aria-expanded",!1),this.setAttribute("expanded",!1)}handleClick(){this.expanded=!this.expanded,this.dom.button.setAttribute("aria-expanded",this.expanded),this.expanded?this.open():this.close()}attributeChangedCallback(t,e,n){"expanded"===t&&(this.expanded="true"===n,this.dom.button.setAttribute("aria-expanded",n))}render(){this.shadowRoot.innerHTML=`\n\t\t\t<style>\n\t\t\t\t.accordion-item__content {\n\t\t\t\t\tdisplay: none;\n\t\t\t\t\tpadding: var(--space-50) var(--space-150) var(--space-150);\n\t\t\t\t}\n\n\t\t\t\t:host([expanded="true"]) .accordion-item__content {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t}\n\t\t\t</style>\n\t\t\t<slot name="title"></slot>\n\t\t\t<div\n\t\t\t\tid="${this.id}-content"\n\t\t\t\tclass="accordion-item__content"\n\t\t\t\taria-labelledby="${this.id}">\n\t\t\t\t<slot name="content"></slot>\n\t\t\t</div>\n\t\t`}}window.customElements.define("svk-accordion-item",o)},39734:function(t,e,n){n.r(e),n.d(e,{SvkAccordion:function(){return o}});n(25720);class o extends HTMLElement{constructor(){super(),this.allowMultiple=!!this.hasAttribute("allow-multiple"),this.attachShadow({mode:"open"})}connectedCallback(){this.render(),this.allowMultiple||this.toggleAccordionElements()}toggleAccordionElements(){const t=this.shadowRoot.querySelector("slot").assignedElements({flatten:!0});this.accordionItems=t.filter(t=>"svk-accordion-item"===t.localName),this.accordionItems.forEach(t=>{t.addEventListener("click",this.handleClick.bind(this))})}handleClick(t){this.accordionItems.forEach(e=>{e.contains(t.target)||e.setAttribute("expanded",!1)})}render(){this.shadowRoot.innerHTML="\n\t\t\t<style>\n\t\t\t\t:host {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tborder-top: var(--border-width) solid var(--border-color-brand);\n\t\t\t\t\tbackground: var(--color-brand-50);\n\t\t\t\t}\n\n\t\t\t\t::slotted(svk-accordion-item) {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\tflex-direction: column;\n\t\t\t\t}\n\n\t\t\t\t:host-context(.row--bg) {\n\t\t\t\t\tbackground: var(--color-white);\n\t\t\t\t}\n\t\t\t</style>\n\t\t\t<slot></slot>\n\t\t"}}window.customElements.define("svk-accordion",o)}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.