diff --git a/dist/js/accordion.min.js b/dist/js/accordion.min.js index 595b8d9a1..b7853c250 100644 --- a/dist/js/accordion.min.js +++ b/dist/js/accordion.min.js @@ -1 +1 @@ -!function(){"use strict";var t={8529:function(t,e,i){i.d(e,{Z:function(){return s}});class s{static accordionItemElement="helfi-accordion-item";static toggleElement="accordion-item__button--toggle";static closeElement="accordion-item__button--close";static ariaExpandedElements=["accordion-item__button--toggle","accordion-item__button--close"];static contentElement="accordion-item__content";constructor(t,e){this.element=t,this.id=t.querySelector(".helfi-accordion__header").id,this.localState=e,this.isOpen=this.localState.loadItemState(this.id),this.setHidden(),this.addEventListeners(),setTimeout((()=>{this.handleLinkAnchor(),this.setAriaOpen()}),100)}open=()=>{this.isOpen=!0,this.setAriaOpen(),this.setHidden(),this.localState.saveItemState(this.id,this.isOpen)};close=()=>{this.isOpen=!1,this.setAriaOpen(),this.changeFocus(),this.setHidden(),this.localState.saveItemState(this.id,this.isOpen)};toggle=t=>{s.isClick(t.which)&&(this.isOpen?this.close():this.open())};handleLinkAnchor=()=>{const{hash:t}=window.location;t&&this.element.querySelector(t)&&(this.open(),this.element.scrollIntoView())};setAriaOpen=()=>{s.ariaExpandedElements.forEach((t=>{this.element.getElementsByClassName(t)[0].setAttribute("aria-expanded",this.isOpen)}))};setHidden=()=>{const t=this.element.getElementsByClassName(s.contentElement)[0];this.isOpen?t.classList.remove("is-hidden"):t.classList.add("is-hidden")};changeFocus=()=>{this.element.querySelector(`.${s.toggleElement}`).focus()};addEventListeners=()=>{this.element.getElementsByClassName(s.toggleElement)[0].addEventListener("mouseup",this.toggle),this.element.getElementsByClassName(s.toggleElement)[0].addEventListener("keypress",this.toggle),this.element.getElementsByClassName(s.closeElement)[0].addEventListener("mouseup",this.close),this.element.getElementsByClassName(s.closeElement)[0].addEventListener("keypress",this.close)};static isClick(t){return 1===t||13===t||32===t}getId=()=>this.id}},4670:function(t,e,i){i.d(e,{Z:function(){return o}});var s=i(8529);class o{static accordionWrapper="component--accordion";constructor(t,e){this.accordion=t,this.localState=e,this.accordionItems=[],this.getAccordionLocalState(),this.initializeAccordion()}initializeAccordion=()=>{Array.from(this.accordion.getElementsByClassName(s.Z.accordionItemElement)).forEach((t=>{const e=new s.Z(t,this.localState);this.accordionItems.push(e)}))};getAccordionLocalState=()=>{this.state=localStorage.getItem(o.localStateKey)};getAccordionItemById=t=>this.accordionItems.find((e=>e.getId()===t))}},1077:function(t,e,i){i.d(e,{Z:function(){return s}});class s{constructor(){this.site=window.drupalSettings.path.pathPrefix.match("/(.*?)/").shift().replaceAll("/",""),this.page=window.drupalSettings.path.currentPath;const t=JSON.parse(localStorage.getItem(this.getStorageKey()));null===t?(this.siteAccordionStates={},this.siteAccordionStates[this.page]={},this.pageAccordionStates={}):(this.siteAccordionStates=t,this.pageAccordionStates=void 0===this.siteAccordionStates[this.page]?{}:this.siteAccordionStates[this.page])}getStorageKey=()=>`${this.site}-accordion`;saveItemState=(t,e)=>{this.siteAccordionStates[this.page][t]=e,localStorage.setItem(this.getStorageKey(),JSON.stringify(this.siteAccordionStates))};loadItemState=t=>!!this.siteAccordionStates&&(void 0!==this.pageAccordionStates[t]&&this.pageAccordionStates[t])}}},e={};function i(s){var o=e[s];if(void 0!==o)return o.exports;var n=e[s]={exports:{}};return t[s](n,n.exports,i),n.exports}i.d=function(t,e){for(var s in e)i.o(e,s)&&!i.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:e[s]})},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},function(){var t=i(4670),e=i(1077),s=i(8529);window.addEventListener("hashchange",(t=>{const{hash:e}=window.location;let i=!1;if(window.helfiAccordions.forEach((t=>{const s=t.getAccordionItemById(e.replace("#",""));s&&(i=!0,s.handleLinkAnchor())})),!i){const t=document.querySelector(`${e}`);if(!t)return;const i=t.closest(`.${s.Z.accordionItemElement}`);i&&window.helfiAccordions.forEach((t=>{const e=i.querySelector(".helfi-accordion__header").id,s=t.getAccordionItemById(e);s&&s.handleLinkAnchor()}))}})),window.helfiAccordions=[];const o=new e.Z;setTimeout((()=>{document.querySelectorAll(`.${t.Z.accordionWrapper}`).forEach((e=>{const i=new t.Z(e,o);window.helfiAccordions.push(i)}))}),50)}()}(); \ No newline at end of file +!function(){"use strict";var t={8529:function(t,e,i){i.d(e,{Z:function(){return s}});class s{static accordionItemElement="helfi-accordion-item";static toggleElement="accordion-item__button--toggle";static closeElement="accordion-item__button--close";static ariaExpandedElements=["accordion-item__button--toggle","accordion-item__button--close"];static contentElement="accordion-item__content";constructor(t,e){this.element=t,this.id=t.querySelector(".helfi-accordion__header").id,this.localState=e,this.isOpen=this.localState.loadItemState(this.id),this.setHidden(),this.addEventListeners(),setTimeout((()=>{this.handleLinkAnchor(),this.setAriaOpen()}),100)}open=()=>{this.isOpen=!0,this.setAriaOpen(),this.setHidden(),this.localState.saveItemState(this.id,this.isOpen)};close=()=>{this.isOpen=!1,this.setAriaOpen(),this.changeFocus(),this.setHidden(),this.localState.saveItemState(this.id,this.isOpen)};toggle=t=>{s.isClick(t.which)&&(this.isOpen?this.close():this.open())};handleLinkAnchor=()=>{const{hash:t}=window.location;t&&this.element.querySelector(t)&&(this.open(),this.element.scrollIntoView())};setAriaOpen=()=>{s.ariaExpandedElements.forEach((t=>{this.element.getElementsByClassName(t)[0].setAttribute("aria-expanded",this.isOpen)}))};setHidden=()=>{const t=this.element.getElementsByClassName(s.contentElement)[0];this.isOpen?t.classList.remove("is-hidden"):t.classList.add("is-hidden")};changeFocus=()=>{this.element.querySelector(`.${s.toggleElement}`).focus()};addEventListeners=()=>{this.element.getElementsByClassName(s.toggleElement)[0].addEventListener("mouseup",this.toggle),this.element.getElementsByClassName(s.toggleElement)[0].addEventListener("keypress",this.toggle),this.element.getElementsByClassName(s.closeElement)[0].addEventListener("mouseup",this.close),this.element.getElementsByClassName(s.closeElement)[0].addEventListener("keypress",this.close)};static isClick(t){return 1===t||13===t||32===t}getId=()=>this.id}},4670:function(t,e,i){i.d(e,{Z:function(){return o}});var s=i(8529);class o{static accordionWrapper="component--accordion";constructor(t,e){this.accordion=t,this.localState=e,this.accordionItems=[],this.getAccordionLocalState(),this.initializeAccordion()}initializeAccordion=()=>{Array.from(this.accordion.getElementsByClassName(s.Z.accordionItemElement)).forEach((t=>{const e=new s.Z(t,this.localState);this.accordionItems.push(e)}))};getAccordionLocalState=()=>{this.state=localStorage.getItem(o.localStateKey)};getAccordionItemById=t=>this.accordionItems.find((e=>e.getId()===t))}},1077:function(t,e,i){i.d(e,{Z:function(){return s}});class s{constructor(){this.site=window.drupalSettings.path.pathPrefix.match("/(.*?)/").shift().replaceAll("/",""),this.page=window.drupalSettings.path.currentPath;const t=JSON.parse(localStorage.getItem(this.getStorageKey()));null===t?(this.siteAccordionStates={},this.siteAccordionStates[this.page]={},this.pageAccordionStates={}):(this.siteAccordionStates=t,this.siteAccordionStates[this.page]=void 0===this.siteAccordionStates[this.page]?{}:this.siteAccordionStates[this.page],this.pageAccordionStates=this.siteAccordionStates[this.page])}getStorageKey=()=>`${this.site}-accordion`;saveItemState=(t,e)=>{this.siteAccordionStates[this.page][t]=e,localStorage.setItem(this.getStorageKey(),JSON.stringify(this.siteAccordionStates))};loadItemState=t=>!!this.siteAccordionStates&&(void 0!==this.pageAccordionStates[t]&&this.pageAccordionStates[t])}}},e={};function i(s){var o=e[s];if(void 0!==o)return o.exports;var n=e[s]={exports:{}};return t[s](n,n.exports,i),n.exports}i.d=function(t,e){for(var s in e)i.o(e,s)&&!i.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:e[s]})},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},function(){var t=i(4670),e=i(1077),s=i(8529);window.addEventListener("hashchange",(t=>{const{hash:e}=window.location;let i=!1;if(window.helfiAccordions.forEach((t=>{const s=t.getAccordionItemById(e.replace("#",""));s&&(i=!0,s.handleLinkAnchor())})),!i){const t=document.querySelector(`${e}`);if(!t)return;const i=t.closest(`.${s.Z.accordionItemElement}`);i&&window.helfiAccordions.forEach((t=>{const e=i.querySelector(".helfi-accordion__header").id,s=t.getAccordionItemById(e);s&&s.handleLinkAnchor()}))}})),window.helfiAccordions=[];const o=new e.Z;setTimeout((()=>{document.querySelectorAll(`.${t.Z.accordionWrapper}`).forEach((e=>{const i=new t.Z(e,o);window.helfiAccordions.push(i)}))}),50)}()}(); \ No newline at end of file diff --git a/src/js/accordion/state.js b/src/js/accordion/state.js index 36fff6435..af60d5541 100644 --- a/src/js/accordion/state.js +++ b/src/js/accordion/state.js @@ -11,7 +11,8 @@ export default class State { this.pageAccordionStates = {}; } else { this.siteAccordionStates = siteAccordions; - this.pageAccordionStates = this.siteAccordionStates[this.page] === undefined ? {} : this.siteAccordionStates[this.page]; + this.siteAccordionStates[this.page] = this.siteAccordionStates[this.page] === undefined ? {} : this.siteAccordionStates[this.page]; + this.pageAccordionStates = this.siteAccordionStates[this.page]; } } diff --git a/templates/component/accordion.twig b/templates/component/accordion.twig index a1b484d7d..bcc24fdea 100644 --- a/templates/component/accordion.twig +++ b/templates/component/accordion.twig @@ -13,7 +13,7 @@
<{{ heading_level|default('h2') }} class="accordion-item__header helfi-accordion__header" data-accordion-id="{{heading[0]['#context']['value']|clean_class}}"> -