v4web-components/dist/stencil-library/p-d1703119.entry.js

Stencil Component Starter

import{r as e,h as a}from"./p-c2aeec95.js";const o=".v4-accordion{border-radius:var(--lab-ds-semantic-selectable-border-radius-xs);background-color:var(--lab-ds-semantic-selectable-color-bg-default);text-align:left}.closed .v4-accordion-header-description{border-radius:var(--lab-ds-semantic-selectable-border-radius-xs);border-top-style:solid;border-bottom-style:solid;border-top-width:var(--lab-ds-semantic-selectable-border-width-s);border-bottom-width:var(--lab-ds-semantic-selectable-border-width-s);border-color:var(--lab-ds-semantic-selectable-color-border-default);background-color:var(--lab-ds-semantic-selectable-color-bg-default);color:var(--lab-ds-semantic-color-fg-default)}.open.v4-accordion{border-radius:var(--lab-ds-semantic-selectable-border-radius-xs);border-bottom-style:solid;border-bottom-width:var(--lab-ds-semantic-selectable-border-width-s);border-color:var(--lab-ds-semantic-selectable-color-border-default);box-shadow:var(--lab-ds-semantic-selectable-shadow-m)}.v4-accordion-header-description{display:flex;flex-direction:column;cursor:pointer;padding-top:var(--lab-ds-semantic-selectable-space-padding-sm);padding-bottom:var(--lab-ds-semantic-selectable-space-padding-sm);padding-left:var(--lab-ds-semantic-selectable-space-padding-m);padding-right:var(--lab-ds-semantic-selectable-space-padding-m);gap:var(--lab-ds-semantic-selectable-space-gap-m)}.open .v4-accordion-header-description{border-top-style:solid;border-color:var(--lab-ds-semantic-selectable-color-border-default);border-radius:var(--lab-ds-semantic-selectable-border-radius-xs);border-top-width:var(--lab-ds-semantic-selectable-border-width-s)}.v4-accordion-header{display:flex;gap:auto;justify-content:space-between}.v4-accordion-title{display:flex;align-items:center;gap:var(--lab-ds-semantic-selectable-space-gap-s)}.v4-accordion-title-text{font:var(--lab-ds-semantic-typography-heading-h6)}.v4-accordion-description{font:var(--lab-ds-semantic-typography-heading-h7)}.v4-accordion-content{display:flex;flex-direction:column;padding-top:var(--lab-ds-semantic-selectable-space-padding-s);padding-bottom:var(--lab-ds-semantic-selectable-space-padding-xl);padding-right:var(--lab-ds-semantic-selectable-space-padding-xl);padding-left:var(--lab-ds-semantic-selectable-space-padding-m);gap:var(--lab-ds-semantic-selectable-space-gap-s)}.v4-accordion-content-title{font:var(--lab-ds-semantic-typography-heading-h7)}.v4-accordion-content-body{font:var(--lab-ds-semantic-typography-body-none-decoration-p3-regular)}.open.v4-accordion:not(.disabled) .v4-accordion-header-description:focus{outline:none;background-color:var(--lab-ds-semantic-selectable-color-bg-default);border-color:var(--lab-ds-semantic-selectable-color-primary-focus);border-width:var(--lab-ds-semantic-selectable-border-width-s);border-style:solid}.open.v4-accordion:not(.disabled) .v4-accordion-header-description:hover{background-color:var(--lab-ds-semantic-selectable-color-bg-hover);box-shadow:var(--lab-ds-semantic-selectable-shadow-m)}.open.v4-accordion:not(.disabled) .v4-accordion-header-description:hover .action-icon{color:var(--lab-ds-semantic-selectable-color-primary-hover)}.closed.v4-accordion:hover:not(.disabled){background-color:var(--lab-ds-semantic-selectable-color-bg-hover);box-shadow:var(--lab-ds-semantic-selectable-shadow-s);border:none}.closed.v4-accordion:hover:not(.disabled) .action-icon{color:var(--lab-ds-semantic-selectable-color-primary-hover)}.closed.v4-accordion:hover:not(.disabled) .v4-accordion-header-description{background-color:var(--lab-ds-semantic-selectable-color-bg-hover)}.closed.v4-accordion:not(.disabled) .v4-accordion-header-description:focus{outline:none;background-color:var(--lab-ds-semantic-selectable-color-bg-default);border-color:var(--lab-ds-semantic-selectable-color-primary-focus);border-width:var(--lab-ds-semantic-selectable-border-width-s);border-style:solid}.v4-accordion.disabled{cursor:not-allowed;background-color:var(--lab-ds-semantic-selectable-color-bg-disabled);color:var(--lab-ds-semantic-color-fg-disabled);border:none}.closed.v4-accordion.disabled .v4-accordion-header-description{cursor:not-allowed;background-color:var(--lab-ds-semantic-selectable-color-bg-disabled);color:var(--lab-ds-semantic-color-fg-disabled);border:none}.disabled .v4-accordion-header-description{cursor:not-allowed}";const d=class{constructor(a){e(this,a);this.titleAccordion=undefined;this.descriptionAccordion=undefined;this.titlePanel=undefined;this.bodyPanel=undefined;this.icon=undefined;this.openAccordion=false;this.disabled=false}render(){return a("div",{class:`v4-accordion ${this.openAccordion?"open":"closed"} ${this.disabled?"disabled":""}`},a("div",{tabIndex:1,onClick:()=>{if(this.disabled)return;this.openAccordion=!this.openAccordion},class:"v4-accordion-header-description"},a("div",{class:"v4-accordion-header"},a("div",{class:"v4-accordion-title"},this.icon&&a("lab-ds-icon-not-selectable",{icon:this.icon,size:"medium"}),a("span",{class:"v4-accordion-title-text"},this.titleAccordion)),a("lab-ds-icon-not-selectable",{class:"action-icon",icon:!this.openAccordion?"expand_more":"expand_less",size:"s-medium"})),this.descriptionAccordion&&!this.openAccordion&&a("div",{class:"v4-accordion-description"},this.descriptionAccordion)),this.openAccordion&&a("div",{class:"v4-accordion-content"},a("slot",{name:"body-accordion"}),this.titlePanel&&a("div",{class:"v4-accordion-content-title"},this.titlePanel),this.bodyPanel&&a("div",{class:"v4-accordion-content-body"},this.bodyPanel)))}};d.style=o;export{d as lab_ds_accordion};
//# sourceMappingURL=p-d1703119.entry.js.map