import{r as t,c as o,h as a,a as i,g as n}from"./p-7c16486e.js";import{c as l}from"./p-c608c6dc.js";import{e as s}from"./p-3bc9966d.js";let e=0;const r=class{constructor(a){t(this,a),this.scaleExpand=o(this,"scale-expand",7),this.scaleExpandLegacy=o(this,"scaleExpand",7),this.headingLevel=2,this.iconLocation="left",this.handleClick=()=>{this.expanded=!this.expanded,s(this,"scaleExpand",{expanded:this.expanded})}}componentWillLoad(){const t=e++;this.headingId="collapsable-heading-"+t,this.panelId="collapsable-panel-"+t}componentDidLoad(){this.setHeadingFromLightDOM()}setHeadingFromLightDOM(){const t=this.hostElement.querySelector(":first-child");if(null==t)return;const o="H"===t.tagName.charAt(0).toUpperCase(),a=t.hasAttribute("slot");o&&!a&&(this.headingElement.innerHTML=t.innerHTML,t.style.display="none")}render(){return a(i,null,this.styles&&a("style",null,this.styles),a("div",{class:this.getCssClassMap(),part:l("base",this.expanded&&"expanded")},a("h2",{"aria-level":this.headingLevel,class:"collapsible__heading",part:"heading"},a("button",{id:this.headingId,class:"collapsible__button",part:"button",onClick:this.handleClick,"aria-expanded":this.expanded?"true":"false","aria-controls":this.panelId},"left"===this.iconLocation?a("scale-icon-navigation-collapse-down",{size:16,decorative:!0,class:"collapsible__icon",part:l("icon",this.expanded&&"expanded")}):null,a("span",{ref:t=>this.headingElement=t,class:"collapsible__button-text",part:"button-text"},a("slot",{name:"heading"})),"right"===this.iconLocation?a("scale-icon-navigation-collapse-down",{size:16,decorative:!0,class:"collapsible__icon collapsible__icon-right",part:l("icon",this.expanded&&"expanded")}):null)),a("div",{id:this.panelId,role:"region","aria-labelledby":this.headingId,hidden:!this.expanded,class:"collapsible__content",part:"content"},a("slot",null))))}getCssClassMap(){return l("collapsible",this.expanded&&"collapsible--expanded")}get hostElement(){return n(this)}};r.style=":host{--spacing-y:var(--scl-spacing-16);--font-size-button:var(--scl-font-size-20);--font-weight-button:var(--scl-font-weight-extrabold);--line-height-button:var(--scl-font-line-height-125);--border-width-button:var(--scl-spacing-2);--radius-button:var(--scl-radius-4);--spacing-left-button:var(--scl-spacing-4);--spacing-left-button-text:var(--scl-spacing-8);--color-button-hover:var(--scl-color-primary-hover);--color-button-active:var(--scl-color-primary-active);--background-button-hover:var(--scl-color-background-light);--border-color-button-focus:var(--scl-color-focus);--spacing-top-icon:calc(var(--scl-spacing-4) + 1px);--spacing-right-content:var(--scl-spacing-48);--spacing-left-content:var(--scl-spacing-32);--spacing-top-content:var(--scl-spacing-16);--spacing-bottom-content:var(--scl-spacing-24)}.collapsible{position:relative;margin:var(--spacing-y) 0}.collapsible--expanded:before{top:0;left:0;right:0;width:100%;border:var(--scl-spacing-1) solid transparent;content:'';display:block;position:absolute;pointer-events:none;bottom:calc(-1 * var(--spacing-y))}.collapsible__heading{margin:0}.collapsible__button{color:currentColor;width:100%;display:flex;text-align:left;align-items:flex-start;padding-top:0;border-color:transparent;border-style:solid;padding-right:0;padding-bottom:0;background-color:transparent;font-size:var(--font-size-button);font-weight:var(--font-weight-button);line-height:var(--line-height-button);border-width:var(--border-width-button);border-radius:var(--radius-button);padding-left:var(--spacing-left-button);font-family:inherit;word-spacing:inherit;letter-spacing:inherit}.collapsible__button-text{margin-left:var(--spacing-left-button-text)}.collapsible__button:hover{cursor:pointer;color:var(--color-button-hover);background-color:var(--background-button-hover)}.collapsible__button:active{color:var(--color-button-active)}.collapsible__button:focus{outline:none;border-color:var(--border-color-button-focus)}.collapsible__icon{transform:rotate(0.75turn);flex-shrink:0;margin-top:var(--spacing-top-icon)}.collapsible__icon-right{margin-left:auto}.collapsible__button[aria-expanded='true'] .collapsible__icon{transform:none}.collapsible__content{padding-right:var(--spacing-right-content);padding-left:var(--spacing-left-content);margin-top:var(--spacing-top-content);margin-bottom:var(--spacing-bottom-content)}";export{r as scale_collapsible}