UNPKG

@telekom/scale-components

Version:

Scale is the digital design system for Telekom products and experiences.

1 lines 2.9 kB
import{r as e,h as t,a as i,g as s}from"./p-d52b3602.js";import{s as a}from"./p-c5a89792.js";const o=class{constructor(t){e(this,t),this.label="",this.status="",this.invalid=!1,this.value="",this.selectText="Select all",this.unselectText="Unselect all"}handleCheckboxChange(e){const t=e.composedPath()[0],{tagName:i,checked:s}=t;"scale-checkbox"===i.toLowerCase()&&(t!==this.groupNode||this.updateChildrenCheckboxStates(s),this.updateParentCheckboxState())}componentDidRender(){""!==this.status&&a({tag:"deprecated",message:'Property "status" is deprecated. Please use the "invalid" property!',type:"warn",source:this.host}),this.host.hasAttribute("aria-label")&&a({tag:"deprecated",message:'Property "ariaLabel" is deprecated. Please use the "ariaLabelCheckboxGroup" property!',type:"warn",source:this.host})}getChildNodes(){return Array.from(this.host.querySelector("fieldset").querySelectorAll("scale-checkbox"))}updateChildrenCheckboxStates(e){this.getChildNodes().filter((e=>!e.disabled)).forEach((t=>{void 0!==e&&(t.checked=e,t.indeterminate=!1)}))}updateParentCheckboxState(){const e=this.getChildNodes(),t=null==e?void 0:e.map((e=>e.checked)),i=null==e?void 0:e.map((e=>e.indeterminate)),s=null==e?void 0:e.map((e=>e.disabled)),a=t.every(Boolean),o=t.some(Boolean),c=i.some(Boolean),r=s.every(Boolean);this.checked=a||o,this.indeterminate=c||o&&!a,this.disabled=r,this.actionText=a?this.unselectText:this.selectText}render(){return t(i,{class:"checkbox-group"},t("scale-checkbox",{ref:e=>this.groupNode=e,name:this.name,label:this.label,ariaLabelCheckbox:`${this.ariaLabelCheckboxGroup||this.label} - ${this.actionText}`,helperText:this.helperText,status:this.status,invalid:this.invalid,value:this.value,inputId:this.inputId,checked:this.checked,indeterminate:this.indeterminate,disabled:this.disabled,part:"parent-checkbox"}),t("fieldset",{part:"fieldset"},t("legend",null,this.ariaLabelCheckboxGroup||this.label),t("slot",null)))}componentDidLoad(){this.updateParentCheckboxState()}get host(){return s(this)}};o.style=":host,.checkbox-group{--spacing-left-container:var(--telekom-spacing-composition-space-10);--spacing-left-checkbox:var(--telekom-spacing-composition-space-04);--spacing-top-slotted-item:var(--telekom-spacing-composition-space-05)}.checkbox-group{display:inline-flex;flex-direction:column;position:relative}.checkbox-group [part='fieldset']{display:flex;flex-direction:column;border:0;padding:0;margin:0;margin-left:var(--spacing-left-container)}.checkbox-group [part='parent-checkbox']{line-height:var(--telekom-typography-line-spacing-standard);--font-weight-label:var(--telekom-typography-font-weight-bold)}.checkbox-group legend{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}.checkbox-group scale-checkbox{margin-top:var(--spacing-top-slotted-item)}";export{o as scale_checkbox_group}