@public-ui/components/dist/kolibri/kol-table-stateless-wc.entry.js

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

/*!
 * KoliBri - The accessible HTML-Standard
 */
import{r as t,h as e,F as i,H as s,g as n}from"./index-299a463b.js";import{g as o,a,c as l}from"./component-names-4cb1c62b.js";import{t as r}from"./i18n-5fe08f1c.js";import{n as d}from"./dev.utils-1e715f17.js";import{t as c}from"./events-29e84d75.js";import{q as h,o as f,p as u,w as v,i as p}from"./prop.validators-17aec743.js";import{v as b,a as y,d as m,b as k,E as g}from"./events-3c3b4721.js";import{v as w}from"./label-90c13388.js";import"./i18n-7ea9f137.js";import"./reuse-32931294.js";import"./dev.utils-fab45cbc.js";import"./index-6d801dad.js";import"./common-0f1f2276.js";const _=(e,t)=>{h(t,(()=>{f(t,(()=>{try{t=u(t)}catch(e){}v(e,"_headerCells",(e=>"object"==typeof e&&null!==e&&(void 0===e.horizontal||Array.isArray(e.horizontal)&&void 0===e.horizontal.find((e=>!Array.isArray(e))))&&(void 0===e.vertical||Array.isArray(e.vertical)&&void 0===e.vertical.find((e=>!Array.isArray(e))))&&!0),new Set(["TableHeaderCellsPropType"]),t)}))}))},j=class{constructor(a){t(this,a),this.horizontal=!0,this.cellsToRenderTimeouts=new Map,this.dataToKeyMap=new Map,this.checkboxRefs=[],this.renderTableRow=(t,a,i)=>{var l,o;let s=String(a);return this.horizontal&&(null===(l=t[0])||void 0===l?void 0:l.data)&&(s=null!==(o=this.getDataKey(t[0].data))&&void 0!==o?o:s),e("tr",{key:`row-${s}`},this.renderSelectionCell(t,a),t.map(((e,t)=>this.renderTableCell(e,a,t,i))))},this.renderTableCell=(t,a,i,l)=>{let o=`${a}-${i}-${t.label}`;if(t.data){const e=this.getDataKey(t.data);o=e?`${e}-${this.horizontal?i:a}`:o}return!1===t.asTd?this.renderHeadingCell(t,a,i,l):e("td",{key:`cell-${o}`,class:{[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},ref:"function"==typeof t.render?e=>{this.cellRender(t,e)}:void 0},"function"!=typeof t.render?t.label:"")},this.state={_data:[],_label:"",_headerCells:{horizontal:[],vertical:[]}},this.tableDivElementHasScrollbar=!1,this._data=void 0,this._dataFoot=void 0,this._headerCells=void 0,this._label=void 0,this._minWidth=void 0,this._on=void 0,this._selection=void 0}validateData(e){b(this,e,{beforePatch:e=>{this.updateDataToKeyMap(e)}})}validateDataFoot(e){y(this,e)}validateHeaderCells(e){_(this,e)}validateLabel(e){w(this,e,{required:!0})}validateMinWidth(e){p(this,"_deprecatedMinWidth",e,{defaultValue:void 0})}validateOn(e){m(this,e)}validateSelection(e){k(this,e)}handleKeyDown(e){var t;if("ArrowUp"===e.key||"ArrowDown"===e.key){const a=null===(t=this.tableDivElement)||void 0===t?void 0:t.querySelector(":focus");let i=this.checkboxRefs.indexOf(a);i>-1&&(e.preventDefault(),"ArrowDown"===e.key?(i=(i+1)%this.checkboxRefs.length,this.checkboxRefs[i].focus()):"ArrowUp"===e.key&&(e.preventDefault(),i=(i+this.checkboxRefs.length-1)%this.checkboxRefs.length,this.checkboxRefs[i].focus()))}}componentDidRender(){this.checkDivElementScrollbar()}componentDidLoad(){this.tableDivElement&&ResizeObserver&&(this.tableDivElementResizeObserver=new ResizeObserver(this.checkDivElementScrollbar.bind(this)),this.tableDivElementResizeObserver.observe(this.tableDivElement))}disconnectedCallback(){var e;null===(e=this.tableDivElementResizeObserver)||void 0===e||e.disconnect()}checkDivElementScrollbar(){this.tableDivElement&&(this.tableDivElementHasScrollbar=this.tableDivElement.scrollWidth>this.tableDivElement.clientWidth)}updateDataToKeyMap(e){e.forEach((e=>{this.dataToKeyMap.has(e)||this.dataToKeyMap.set(e,d())})),this.dataToKeyMap.forEach(((t,a)=>{e.includes(a)||this.dataToKeyMap.delete(a)}))}getDataKey(e){return this.dataToKeyMap.get(e)}cellRender(e,t){t&&(clearTimeout(this.cellsToRenderTimeouts.get(t)),this.cellsToRenderTimeouts.set(t,setTimeout((()=>{if("function"==typeof e.render){const a=e.render(t,e,e.data,this.state._data);"string"==typeof a&&(t.textContent=a)}}))))}getNumberOfCols(e,t){let a=0;return e.forEach((e=>{let t=0;Array.isArray(e)&&e.forEach((e=>{var a;return t+=null!==(a=e.colSpan)&&void 0!==a?a:1})),a<t&&(a=t)})),0===a&&(a=t.length),a}getNumberOfRows(e,t){var a;let i=0;return e.forEach((e=>{let t=0;Array.isArray(e)&&e.forEach((e=>{var a;return t+=null!==(a=e.rowSpan)&&void 0!==a?a:1})),i<t&&(i=t)})),0===i?i=t.length:i-=(null===(a=this.state._dataFoot)||void 0===a?void 0:a.length)||0,i}getThePrimaryHeadersWithKeysIfExists(e){const t=[];return e.forEach((e=>{e.forEach((e=>{"string"==typeof e.key&&t.push(e)}))})),t}getPrimaryHeaders(e){var t,a;let i=this.getThePrimaryHeadersWithKeysIfExists(null!==(t=e.horizontal)&&void 0!==t?t:[]);return this.horizontal=!0,0===i.length&&(i=this.getThePrimaryHeadersWithKeysIfExists(null!==(a=e.vertical)&&void 0!==a?a:[]),i.length>0&&(this.horizontal=!1)),i}createDataField(e,t,a){var i;t.horizontal=Array.isArray(null==t?void 0:t.horizontal)?t.horizontal:[],t.vertical=Array.isArray(null==t?void 0:t.vertical)?t.vertical:[];const l=this.getPrimaryHeaders(t),o=this.getNumberOfCols(t.horizontal,e);let s=this.getNumberOfRows(t.vertical,e),n=0;a&&(n=s,s+=(null===(i=this.state._dataFoot)||void 0===i?void 0:i.length)||0);const c=[],d=[],h=[];t.vertical.forEach(((e,t)=>{d[t]=0,h[t]=[]}));for(let i=n;i<s;i++){const s=[];t.vertical.forEach(((e,t)=>{let a=0;if(h[t].forEach((e=>a+=e)),a<=i){const l=e[i-a+d[t]];if("object"==typeof l){s.push(Object.assign(Object.assign({},l),{asTd:!1,data:{}}));let e=1;if("number"==typeof l.rowSpan&&l.rowSpan>1&&(e=l.rowSpan),h[t].push(e),"number"==typeof l.colSpan&&l.colSpan>1)for(let a=1;a<l.colSpan;a++)h[t+a].push(e);d[t]++}}}));for(let t=0;t<o;t++)if(!0===this.horizontal){const o=a&&this.state._dataFoot?this.state._dataFoot[i-n]:e[i];"object"==typeof l[t]&&null!==l[t]&&"string"==typeof l[t].key&&"object"==typeof o&&null!==o&&s.push(Object.assign(Object.assign({},l[t]),{colSpan:void 0,data:o,label:o[l[t].key],rowSpan:void 0}))}else"object"==typeof l[i]&&null!==l[i]&&"string"==typeof l[i].key&&"object"==typeof e[t]&&null!==e[t]&&s.push(Object.assign(Object.assign({},l[i]),{colSpan:void 0,data:e[t],label:e[t][l[i].key],rowSpan:void 0}));c.push(s)}if(0===e.length){let e=0,a=0;Array.isArray(t.horizontal)&&t.horizontal.length>0&&t.horizontal[0].forEach((t=>{e+=t.colSpan||1})),Array.isArray(t.vertical)&&t.vertical.length>0&&(e-=t.vertical.length,t.vertical[0].forEach((e=>{a+=e.rowSpan||1})));const i={colSpan:e,label:r("kol-no-entries"),render:void 0,rowSpan:Math.max(a,1)};0===c.length?c.push([i]):c[0].push(i)}return c}componentWillLoad(){this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaderCells(this._headerCells),this.validateLabel(this._label),this.validateMinWidth(this._minWidth),this.validateOn(this._on),this.validateSelection(this._selection)}renderSelectionCell(t,i){var l,s,n;const r=this.state._selection;if(!r)return"";const d=null!==(l=r.keyPropertyName)&&void 0!==l?l:"id",h=null===(s=t[0])||void 0===s?void 0:s.data;if(!h)return"";const v=h[d],p=r.multiple||void 0===r.multiple,b=null===(n=null==r?void 0:r.selectedKeys)||void 0===n?void 0:n.includes(v),u=r.label(h),f={name:"selection",checked:b,id:v,"aria-label":u};return e("td",{key:`tbody-${i}-selection`,class:"selection-cell"},e("div",{class:"input "+(b?"checked":"")},p?e("label",{class:"checkbox-container"},e(o,{class:"icon",_icons:"codicon "+(b?"codicon-check":""),_label:""}),e("input",Object.assign({ref:e=>e&&this.checkboxRefs.push(e)},f,{type:"checkbox",onInput:e=>{var t,a,i;const l=b?null===(a=null==r?void 0:r.selectedKeys)||void 0===a?void 0:a.filter((e=>e!==v)):[...null!==(t=null==r?void 0:r.selectedKeys)&&void 0!==t?t:[],v];c("selection-change",this.host,l),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i[g.onSelectionChange])&&this.state._on[g.onSelectionChange](e,null!=l?l:[])}}))):e("label",{class:"radio-container"},e("input",Object.assign({},f,{type:"radio",onInput:e=>{var t;c("selection-change",this.host,v),"function"==typeof(null===(t=this.state._on)||void 0===t?void 0:t[g.onSelectionChange])&&this.state._on[g.onSelectionChange](e,v)}}))),e(a,{"aria-hidden":"true",class:"input-tooltip",_align:"right",_id:`${v}-label`,_label:u})))}renderHeadingSelectionCell(){var t,i;const l=this.state._selection;if(!l||!l.multiple&&void 0!==l.multiple)return e("th",{key:"thead-0"});const s=null!==(t=l.keyPropertyName)&&void 0!==t?t:"id",n=null===(i=l.selectedKeys)||void 0===i?void 0:i.length,d=n===this.state._data.length,h=0!==n&&!d;let v="kol-table-selection-indeterminate";d&&!h&&(v="kol-table-selection-none"),0===n&&(v="kol-table-selection-all");const p=r(v);return e("th",{key:"thead-0-selection",class:"selection-cell selection-control"},e("div",{class:"input "+(h?"indeterminate":d?"checked":"")},e("label",{class:"checkbox-container"},e(o,{class:"icon",_icons:"codicon "+(h?"codicon-remove":d?"codicon-check":""),_label:""}),e("input",{ref:e=>e&&this.checkboxRefs.push(e),name:"selection",checked:d&&!h,"aria-label":p,type:"checkbox",onInput:e=>{var t;const a=d?[]:this.state._data.map((e=>null==e?void 0:e[s]));c("selection-change",this.host,a),"function"==typeof(null===(t=this.state._on)||void 0===t?void 0:t[g.onSelectionChange])&&this.state._on[g.onSelectionChange](e,a)}})),e(a,{"aria-hidden":"true",class:"input-tooltip",_align:"right",_id:`${v}-label`,_label:p})))}renderHeaderTdCell(){return e(i,null,Array.isArray(this.state._headerCells.horizontal)&&this.state._headerCells.horizontal.length>0&&Array.isArray(this.state._headerCells.vertical)&&this.state._headerCells.vertical.length>0&&Array.isArray(this.state._headerCells.horizontal)&&e("td",{"aria-hidden":"true",colSpan:this.state._headerCells.vertical.length,rowSpan:this.state._headerCells.horizontal.length}))}renderHeadingCell(t,a,i,o){let s,n="codicon codicon-fold";if(t.sortDirection)switch(t.sortDirection){case"ASC":n="codicon codicon-chevron-up",s="ascending";break;case"DESC":n="codicon codicon-chevron-down",s="descending"}const r=o?"row":"number"==typeof t.colSpan&&t.colSpan>1?"colgroup":"col";return e("th",{key:`${a}-${i}-${t.label}`,class:t.textAlign?`align-${t.textAlign}`:void 0,scope:r,colSpan:t.colSpan,rowSpan:t.rowSpan,style:{width:t.width},"aria-sort":s,"data-sort":`sort-${t.sortDirection}`},t.sortDirection?e(l,{class:"table-sort-button",exportparts:"icon",_icons:{right:n},_label:t.label,_on:{onClick:e=>{var a;"function"==typeof(null===(a=this.state._on)||void 0===a?void 0:a.onSort)&&t.key&&t.sortDirection&&this.state._on.onSort(e,{key:t.key,currentSortDirection:t.sortDirection})}}}):t.label)}renderSpacer(t,a){var i,l;const o=(null===(i=this.state._headerCells.vertical)||void 0===i?void 0:i.length)||0,s=null===(l=null==a?void 0:a[0])||void 0===l?void 0:l.reduce(((e,t)=>e+(t.colSpan||1)),0),n=this.state._selection?1:0;return e("tr",{"aria-hidden":"true",class:`${t}-spacer`},e("td",{colSpan:o+s+n}))}renderFoot(){if(!this.state._dataFoot||0===this.state._dataFoot.length)return null;const t=this.createDataField(this.state._dataFoot,this.state._headerCells,!0);return e("tfoot",null,[this.renderSpacer("foot",t),t.map(((e,t)=>this.renderTableRow(e,t,!0)))])}render(){const t=this.createDataField(this.state._data,this.state._headerCells);return this.checkboxRefs=[],e(s,{key:"01a57844bc49085127ceca2271007c571ce96251",class:"kol-table-stateless-wc"},e("div",{key:"d9cee7a9008ed96b16b212587768532920ac8f78",ref:e=>this.tableDivElement=e,class:"table",tabindex:this.tableDivElementHasScrollbar?"-1":void 0},e("table",{key:"f223823a1d01d12c492b34d1f8f613ab10e7d6b0",style:{minWidth:this.state._deprecatedMinWidth||this.state._minWidth}},e("div",{key:"a95ff09d5a9c4cfd4bf668de15f8d47e8f04aca3",class:"focus-element",tabindex:this.tableDivElementHasScrollbar?"0":void 0,"aria-describedby":"caption"}," "),e("caption",{key:"d64984dac3ad59df1b72eb6c12ad26686719a5fd",id:"caption"},this.state._label),Array.isArray(this.state._headerCells.horizontal)&&e("thead",{key:"50e7c4f3f082048ccd4bf5006e282da18dfde1e2"},[this.state._headerCells.horizontal.map(((t,a)=>e("tr",{key:`thead-${a}`},this.state._selection&&this.renderHeadingSelectionCell(),0===a&&this.renderHeaderTdCell(),Array.isArray(t)&&t.map(((t,i)=>!0===t.asTd?e("td",{key:`thead-${a}-${i}-${t.label}`,class:{[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},colSpan:t.colSpan,rowSpan:t.rowSpan,style:{textAlign:t.textAlign,width:t.width},ref:"function"==typeof t.render?e=>{this.cellRender(t,e)}:void 0},"function"!=typeof t.render?t.label:""):this.renderHeadingCell(t,a,i,!1)))))),this.renderSpacer("head",this.state._headerCells.horizontal)]),e("tbody",{key:"735e65d968125058ad93a7334394bff87025757a"},t.map(((e,t)=>this.renderTableRow(e,t,!0)))),this.renderFoot())))}get host(){return n(this)}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headerCells:["validateHeaderCells"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_on:["validateOn"],_selection:["validateSelection"]}}};export{j as kol_table_stateless_wc};