UNPKG

@public-ui/components

Version:

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

5 lines 4.36 kB
/*! * KoliBri - The accessible HTML-Standard */ import{r as e,h as t,H as i,g as s}from"./index-BQlHOxik.js";import{c as l,u as o}from"./component-names-Dy77vq43.js";import{I as a}from"./component-DzaT2WlJ.js";import{e as n}from"./common-Cx_AGO_M.js";import{v as r}from"./href-Dp4go7zq.js";import{v as c}from"./label-Fyi30H9j.js";import{v as d}from"./open-Dw4Y2dzo.js";import{c as h}from"./clsx-COFh-Vc8.js";import{c as v}from"./dev.utils-02Sl9bQo.js";import"./tslib.es6-QNbPBOk5.js";import"./bem-registry-CWvl2xho.js";const f=(e,t,i)=>{n(e,"_active",t,i)};const _=class{constructor(t){e(this,t);this.groupId=v("tree-group");this.state={_active:false,_hasChildren:false,_href:"",_label:"",_open:false}}render(){const{_href:e,_active:s,_hasChildren:o,_open:n,_label:r}=this.state;return t(i,{key:"0e8dace9d24995b94398cda4155f9cc026704b1f",onSlotchange:this.handleSlotchange.bind(this)},t("li",{key:"5e7cad99348e4230718731a8ccd42edc7cde0e5c",class:"kol-tree-item",style:{"--level":`${this.level}`}},t(l,{key:"c36dd466d9c4a46528628459fbfedf88cd100c60",class:h("kol-tree-item__link",{"kol-tree-item__link--first-level":this.level===0,"kol-tree-item__link--active":s}),_href:e,_label:"",_role:"treeitem",_tabIndex:s?0:-1,_ariaExpanded:o?n:undefined,_ariaOwns:o?this.groupId:undefined,ref:e=>this.linkElement=e},t("span",{key:"d1119a0de39c5c6ccb63c3c767d947a9babd5f9c",class:"kol-tree-item__link-inner",slot:"expert"},o?t("span",{class:"kol-tree-item__toggle-button",onClick:e=>n?void this.handleCollapseClick(e):void this.handleExpandClick(e)},t(a,{class:"kol-tree-item__toggle-button-icon",icons:`kolicon kolicon-${n?"chevron-down":"chevron-right"}`,label:""})):t("span",{class:"kol-tree-item__toggle-button-placeholder"}),t("span",{key:"4ec3c0df36f1d428b2ebcd472aa5e2c54598dd0b",class:"kol-tree-item__text"},r))),t("ul",{key:"0dae6860fca3e03e5363bef3ee080542c5152f0d",class:"kol-tree-item__children",hidden:!o||!n,role:"group",id:this.groupId},t("slot",{key:"0a7af9ff0c81e4555d3e28fd4fd95b6c219b527a"}))))}validateActive(e){f(this,e||false)}validateLabel(e){c(this,e)}validateOpen(e){d(this,e)}validateHref(e){r(this,e)}componentWillLoad(){this.validateActive(this._active);this.validateLabel(this._label);this.validateOpen(this._open);this.validateHref(this._href);this.checkForChildren();this.determineTreeItemDepth()}determineTreeItemDepth(){var e,t;let i=0;let s=(t=(e=this.host)===null||e===void 0?void 0:e.parentNode)===null||t===void 0?void 0:t.host.parentNode;while(s!==null&&s.tagName.toLowerCase()!==o&&s!==document.body){s=s.parentElement;i+=1}this.level=i}handleSlotchange(){this.checkForChildren()}checkForChildren(){var e,t,i;this.state=Object.assign(Object.assign({},this.state),{_hasChildren:Boolean((i=(t=(e=this.host)===null||e===void 0?void 0:e.querySelector("slot"))===null||t===void 0?void 0:t.assignedElements)===null||i===void 0?void 0:i.call(t).length)})}getTreeParent(){var e,t;let i=this.host;while(i){const s=i.closest(o);if(s){const t=(e=s.shadowRoot)===null||e===void 0?void 0:e.querySelector("kol-tree-wc");if(t){return t}return undefined}const l=(t=i.getRootNode())===null||t===void 0?void 0:t.host;if(!l||l===document.body){break}i=l.parentElement}return undefined}async focus(){if(this.host&&this.linkElement){return Promise.resolve(this.linkElement.focus())}}async handleExpandClick(e){e.preventDefault();if(this.host&&this.linkElement){await this.linkElement.focus()}await this.expand()}async expand(){var e,t;if(this.state._hasChildren){this.state=Object.assign(Object.assign({},this.state),{_open:true});void((t=(e=this.getTreeParent())===null||e===void 0?void 0:e.invalidateOpenItemsCache)===null||t===void 0?void 0:t.call(e))}}async handleCollapseClick(e){e.preventDefault();if(this.host&&this.linkElement){await this.linkElement.focus()}await this.collapse()}async collapse(){var e,t;if(this.state._hasChildren){this.state=Object.assign(Object.assign({},this.state),{_open:false});void((t=(e=this.getTreeParent())===null||e===void 0?void 0:e.invalidateOpenItemsCache)===null||t===void 0?void 0:t.call(e))}}async isOpen(){var e;return(e=this.state._open)!==null&&e!==void 0?e:false}get host(){return s(this)}static get watchers(){return{_active:["validateActive"],_label:["validateLabel"],_open:["validateOpen"],_href:["validateHref"]}}};export{_ as kol_tree_item_wc}; //# sourceMappingURL=kol-tree-item-wc.entry.js.map