@patternfly/pfe-collapse/dist/pfe-collapse.min.js

Collapse element for PatternFly Elements

import t from"../../pfelement/dist/pfelement.min.js";
/*!
 * PatternFly Elements: PfeCollapse 1.12.3
 * @license
 * Copyright 2021 Red Hat, Inc.
 * 
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 * 
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 * 
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 * SOFTWARE.
 * 
*/function e(){return Math.random().toString(36).substr(2,9)}class n extends t{static get version(){return"1.12.3"}get html(){return"\n<style>:host{display:block;cursor:default} /*# sourceMappingURL=pfe-collapse-toggle.min.css.map */</style>\n<slot></slot>"}static get slots(){return{default:{title:"Default",type:"array",namedSlot:!1,items:{oneOf:[{$ref:"pfe-collapsibe-toggle"},{$ref:"pfe-collapse-panel"}]}}}}static get tag(){return"pfe-collapse-toggle"}get templateUrl(){return"pfe-collapse-toggle.html"}get styleUrl(){return"pfe-collapse-toggle.scss"}get expanded(){return"true"===this.getAttribute("aria-expanded")}set expanded(t){const e=Boolean(t);this.setAttribute("aria-expanded",e)}static get properties(){return{ariaExpanded:{title:"Aria expanded",type:String,prefix:!1,values:["true","false"]},ariaControls:{title:"Aria controls",type:String,prefix:!1,observer:"_ariaControlsChanged"}}}constructor(t,{setTabIndex:e=!0,addKeydownHandler:i=!0}={}){super(t||n),this.controlledPanel=!1,this._setTabIndex=e,this._addKeydownHandler=i,this.addEventListener("click",this._clickHandler),i&&this.addEventListener("keydown",this._keydownHandler)}connectedCallback(){super.connectedCallback(),this.expanded=!1,this.id=this.id||`${n.tag}-${e()}`,this.setAttribute("role","button"),this._setTabIndex&&this.setAttribute("tabindex",0),this.controlledPanel||this._connectPanel(this.getAttribute("aria-controls"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this._clickHandler),this._addKeydownHandler&&this.removeEventListener("keydown",this._keydownHandler)}_ariaControlsChanged(t,e){e&&this._connectPanel(e)}toggle(){this.hasAttribute("disabled")||(this.expanded=!this.expanded,this.controlledPanel||this._connectPanel(this.getAttribute("aria-controls")),this.controlledPanel?(this.controlledPanel.expanded=this.expanded,this.emitEvent(a.events.change,{detail:{expanded:this.expanded,toggle:this,panel:this.controlledPanel}})):this.warn("This toggle doesn't have a panel associated with it"))}_clickHandler(){this.toggle()}_keydownHandler(t){switch(t.key){case" ":case"Spacebar":case"Enter":this.toggle()}}_connectPanel(t){this.getRootNode?this.controlledPanel=this.getRootNode().querySelector("#"+t):this.controlledPanel=document.querySelector("#"+t)}}class i extends t{static get version(){return"1.12.3"}get html(){return"\n<style>:host{display:none;overflow:hidden;will-change:height}:host([expanded]){display:block;position:relative}:host(.animating){display:block;-webkit-transition:height .3s ease-in-out;transition:height .3s ease-in-out} /*# sourceMappingURL=pfe-collapse-panel.min.css.map */</style>\n<slot></slot>"}static get slots(){return{default:{title:"Default",type:"array",namedSlot:!1,items:{oneOf:[{$ref:"pfe-collapsibe-toggle"},{$ref:"pfe-collapse-panel"}]}}}}static get tag(){return"pfe-collapse-panel"}static get events(){return{animationStart:this.tag+":animation-start",animationEnd:this.tag+":animation-end"}}get templateUrl(){return"pfe-collapse-panel.html"}get styleUrl(){return"pfe-collapse-panel.scss"}get animates(){return"false"!==this.animation}get expanded(){return this.hasAttribute("expanded")||this.hasAttribute("pfe-expanded")}set expanded(t){if(Boolean(t)){if(this.setAttribute("pfe-expanded",""),this.setAttribute("expanded",""),this.animates){const t=this.getBoundingClientRect().height;this._fireAnimationEvent("opening"),this._animate(0,t)}}else if(this.hasAttribute("expanded")||this.hasAttribute("pfe-expanded")){const t=this.getBoundingClientRect().height;this.removeAttribute("expanded"),this.removeAttribute("pfe-expanded"),this.animates&&(this._fireAnimationEvent("closing"),this._animate(t,0))}}static get properties(){return{animation:{title:"Animation",type:String,values:["false"]},oldAnimation:{alias:"animation",attr:"pfe-animation"}}}constructor(t){super(t||i)}connectedCallback(){super.connectedCallback(),this.expanded=!1,this.id=this.id||`${i.tag}-${e()}`}_animate(t,e){this.classList.add("animating"),this.style.height=t+"px",requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.style.height=e+"px",this.classList.add("animating"),this.addEventListener("transitionend",this._transitionEndHandler)})})}_transitionEndHandler(t){t.target.style.height="",t.target.classList.remove("animating"),t.target.removeEventListener("transitionend",this._transitionEndHandler),this.emitEvent(i.events.animationEnd,{detail:{expanded:this.expanded,panel:this}})}_fireAnimationEvent(t){this.emitEvent(i.events.animationStart,{detail:{state:t,panel:this}})}}class a extends t{static get version(){return"1.12.3"}get html(){return"\n<style>:host{display:block}:host([hidden]){display:none}:host(.animating),:host([expanded]){display:block} /*# sourceMappingURL=pfe-collapse.min.css.map */</style>\n<slot></slot>"}static get slots(){return{default:{title:"Default",type:"array",namedSlot:!1,items:{oneOf:[{$ref:"pfe-collapsibe-toggle"},{$ref:"pfe-collapse-panel"}]}}}}static get tag(){return"pfe-collapse"}get templateUrl(){return"pfe-collapse.html"}get styleUrl(){return"pfe-collapse.scss"}get schemaUrl(){return"pfe-collapse.json"}get animates(){return"false"!==this.animation}static get events(){return{change:this.tag+":change"}}static get properties(){return{animation:{title:"Animation",type:String,values:["false"],observer:"_animationChanged"},oldAnimation:{alias:"animation",attr:"pfe-animation"}}}constructor(t){super(t||a),this._toggle=null,this._panel=null,this._linkControls=this._linkControls.bind(this),this._changeHandler=this._changeHandler.bind(this),this._observer=new MutationObserver(this._linkControls),this.addEventListener(a.events.change,this._changeHandler),this.addEventListener(a.events.animationStart,this._animationStartHandler),this.addEventListener(a.events.animationEnd,this._animationEndHandler)}connectedCallback(){super.connectedCallback(),Promise.all([customElements.whenDefined(i.tag),customElements.whenDefined(n.tag)]).then(()=>{this.hasLightDOM()&&this._linkControls(),this._observer.observe(this,{childList:!0})})}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(a.events.change,this._changeHandler),this.removeEventListener(a.events.animationStart,this._animationStartHandler),this.removeEventListener(a.events.animationEnd,this._animationEndHandler),this._observer.disconnect()}_animationChanged(t,e){e&&("false"!==e&&"true"!==e||this._panel&&(this._panel.animation=e))}toggle(){this._toggle.toggle()}_linkControls(){this._toggle=this.querySelector(n.tag),this._panel=this.querySelector(i.tag),this._toggle.setAttribute("aria-controls",this._panel.id)}_animationStartHandler(){this.classList.add("animating")}_animationEndHandler(){this.classList.remove("animating")}_changeHandler(t){}}t.create(a),t.create(n),t.create(i);export{a as PfeCollapse,i as PfeCollapsePanel,n as PfeCollapseToggle};
//# sourceMappingURL=pfe-collapse.min.js.map