@public-ui/components 2.0.0-rc.10 → 2.0.0-rc.11

package/dist/kolibri/kol-spin.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as n,H as e,F as i}from"./index-0bc40dc4.js";import{a as o}from"./i18n-1b5afe13.js";import{v as a}from"./show-bfbd8b47.js";import{w as r}from"./prop.validators-445950f8.js";import"./index-48743821.js";import"./dev.utils-babc1742.js";import"./reuse-b3566e4c.js";import"./a11y.tipps-1e89ea61.js";const s=["cycle","dot","none"],l=(t,n)=>{r(t,"_variant",(t=>"string"==typeof t&&s.includes(t)),new Set(s),n)},d="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t.spin.cycle {\n\t\twidth: 3rem;\n\t\theight: 3rem;\n\t}\n\n\t.spin.cycle > .loader {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder-radius: 50%;\n\t\tposition: relative;\n\t\tanimation: 2s linear infinite rotate;\n\t}\n\n\t.spin.cycle > .loader::before {\n\t\tcontent: '';\n\t\tbox-sizing: border-box;\n\t\tposition: absolute;\n\t\tinset: 0px;\n\t\tborder-radius: 50%;\n\t\tborder: 5px solid #333;\n\t\tanimation: 3s linear infinite prixClipFix;\n\t}\n\n\t@keyframes rotate {\n\t\t100% {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n\t@keyframes prixClipFix {\n\t\t0% {\n\t\t\tborder-color: #fff;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n\t\t}\n\t\t25% {\n\t\t\tborder-color: #666;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n\t\t}\n\t\t50% {\n\t\t\tborder-color: #fc0;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);\n\t\t}\n\t\t75% {\n\t\t\tborder-color: red;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n\t\t}\n\t\t100% {\n\t\t\tborder-color: #000;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n\t\t}\n\t} /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n\t@media (prefers-reduced-motion) {\n\t\t.spin.cycle > .loader {\n\t\t\tanimation-duration: 4s;\n\t\t}\n\n\t\t.spin.cycle > .loader::before {\n\t\t\tanimation-duration: 6s;\n\t\t}\n\t}\n}\n\n@layer kol-component {\n\t.spin.dot {\n\t\theight: 1rem;\n\t\twidth: 3rem;\n\t}\n\n\t.spin.dot > span {\n\t\tanimation-timing-function: cubic-bezier(0, 1, 1, 0);\n\t\tborder-radius: 50%;\n\t\tborder: 0.1rem solid #fff;\n\t\theight: 0.8rem;\n\t\tposition: absolute;\n\t\ttop: 0.1rem;\n\t\twidth: 0.8rem;\n\t}\n\n\t.spin.dot > span:first-child {\n\t\tbackground-color: #fc0;\n\t\tz-index: 0;\n\t\tanimation: 1s infinite spin1;\n\t\tleft: 0.1rem;\n\t}\n\n\t.spin.dot > span:nth-child(2) {\n\t\tbackground-color: red;\n\t\tz-index: 1;\n\t\tanimation: 1s infinite spin2;\n\t\tleft: 0.1rem;\n\t}\n\n\t.spin.dot > span:nth-child(3) {\n\t\tbackground-color: #000;\n\t\tz-index: 1;\n\t\tanimation: 1s infinite spin2;\n\t\tleft: 1.1rem;\n\t}\n\n\t.spin.dot > span:nth-child(4) {\n\t\tbackground-color: #666;\n\t\tz-index: 0;\n\t\tanimation: 1s infinite spin3;\n\t\tleft: 2.1rem;\n\t}\n\n\t@keyframes spin1 {\n\t\t0% {\n\t\t\ttransform: scale(0);\n\t\t}\n\t\t100% {\n\t\t\ttransform: scale(1);\n\t\t}\n\t}\n\t@keyframes spin2 {\n\t\t0% {\n\t\t\ttransform: translate(0, 0);\n\t\t}\n\t\t100% {\n\t\t\ttransform: translate(1rem, 0);\n\t\t}\n\t}\n\t@keyframes spin3 {\n\t\t0% {\n\t\t\ttransform: scale(1);\n\t\t}\n\t\t100% {\n\t\t\ttransform: scale(0);\n\t\t}\n\t} /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n\t@media (prefers-reduced-motion) {\n\t\t.spin.dot > span:first-child,\n\t\t.spin.dot > span:nth-child(2),\n\t\t.spin.dot > span:nth-child(3),\n\t\t.spin.dot > span:nth-child(4) {\n\t\t\tanimation-duration: 2s;\n\t\t}\n\t}\n}\n\n@layer kol-component {\n\t.spin {\n\t\tdisplay: block;\n\t\tpadding: 0.125rem;\n\t\tposition: relative;\n\t}\n}\n";function p(t){switch(t){case"cycle":return n("span",{class:"loader"});case"none":return n("slot",{name:"expert"});default:return n(i,null,n("span",{class:"bg-spin-1"}),n("span",{class:"bg-spin-2"}),n("span",{class:"bg-spin-3"}),n("span",{class:"bg-neutral"}))}}const h=class{constructor(n){t(this,n),this.showToggled=!1,this._show=!1,this._variant="dot",this.state={_variant:"dot"}}render(){return n(e,null,this.state._show?n("span",{"aria-busy":"true","aria-label":o("kol-action-running"),"aria-live":"polite",class:{spin:!0,[this.state._variant]:!0},role:"alert"},p(this.state._variant)):this.showToggled&&n("span",{"aria-label":o("kol-action-done"),"aria-busy":"false","aria-live":"polite",role:"alert"}))}validateShow(t){this.showToggled=!0===this.state._show&&!1===this._show,a(this,t)}validateVariant(t){l(this,t)}componentWillLoad(){this.validateShow(this._show),this.validateVariant(this._variant)}static get watchers(){return{_show:["validateShow"],_variant:["validateVariant"]}}};h.style={default:d};export{h as kol_spin};
+import{r as t,h as n,H as e,F as i}from"./index-0bc40dc4.js";import{a as o}from"./i18n-99b63f3a.js";import{v as a}from"./show-cc5fafc8.js";import{w as r}from"./prop.validators-3fb6bedf.js";import"./index-a4b1e92f.js";import"./dev.utils-8202a1bc.js";import"./reuse-b3566e4c.js";import"./a11y.tipps-68791110.js";const s=["cycle","dot","none"],l=(t,n)=>{r(t,"_variant",(t=>"string"==typeof t&&s.includes(t)),new Set(s),n)},d="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t.spin.cycle {\n\t\twidth: 3rem;\n\t\theight: 3rem;\n\t}\n\n\t.spin.cycle > .loader {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder-radius: 50%;\n\t\tposition: relative;\n\t\tanimation: 2s linear infinite rotate;\n\t}\n\n\t.spin.cycle > .loader::before {\n\t\tcontent: '';\n\t\tbox-sizing: border-box;\n\t\tposition: absolute;\n\t\tinset: 0px;\n\t\tborder-radius: 50%;\n\t\tborder: 5px solid #333;\n\t\tanimation: 3s linear infinite prixClipFix;\n\t}\n\n\t@keyframes rotate {\n\t\t100% {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n\t@keyframes prixClipFix {\n\t\t0% {\n\t\t\tborder-color: #fff;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n\t\t}\n\t\t25% {\n\t\t\tborder-color: #666;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n\t\t}\n\t\t50% {\n\t\t\tborder-color: #fc0;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);\n\t\t}\n\t\t75% {\n\t\t\tborder-color: red;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n\t\t}\n\t\t100% {\n\t\t\tborder-color: #000;\n\t\t\tclip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n\t\t}\n\t} /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n\t@media (prefers-reduced-motion) {\n\t\t.spin.cycle > .loader {\n\t\t\tanimation-duration: 4s;\n\t\t}\n\n\t\t.spin.cycle > .loader::before {\n\t\t\tanimation-duration: 6s;\n\t\t}\n\t}\n}\n\n@layer kol-component {\n\t.spin.dot {\n\t\theight: 1rem;\n\t\twidth: 3rem;\n\t}\n\n\t.spin.dot > span {\n\t\tanimation-timing-function: cubic-bezier(0, 1, 1, 0);\n\t\tborder-radius: 50%;\n\t\tborder: 0.1rem solid #fff;\n\t\theight: 0.8rem;\n\t\tposition: absolute;\n\t\ttop: 0.1rem;\n\t\twidth: 0.8rem;\n\t}\n\n\t.spin.dot > span:first-child {\n\t\tbackground-color: #fc0;\n\t\tz-index: 0;\n\t\tanimation: 1s infinite spin1;\n\t\tleft: 0.1rem;\n\t}\n\n\t.spin.dot > span:nth-child(2) {\n\t\tbackground-color: red;\n\t\tz-index: 1;\n\t\tanimation: 1s infinite spin2;\n\t\tleft: 0.1rem;\n\t}\n\n\t.spin.dot > span:nth-child(3) {\n\t\tbackground-color: #000;\n\t\tz-index: 1;\n\t\tanimation: 1s infinite spin2;\n\t\tleft: 1.1rem;\n\t}\n\n\t.spin.dot > span:nth-child(4) {\n\t\tbackground-color: #666;\n\t\tz-index: 0;\n\t\tanimation: 1s infinite spin3;\n\t\tleft: 2.1rem;\n\t}\n\n\t@keyframes spin1 {\n\t\t0% {\n\t\t\ttransform: scale(0);\n\t\t}\n\t\t100% {\n\t\t\ttransform: scale(1);\n\t\t}\n\t}\n\t@keyframes spin2 {\n\t\t0% {\n\t\t\ttransform: translate(0, 0);\n\t\t}\n\t\t100% {\n\t\t\ttransform: translate(1rem, 0);\n\t\t}\n\t}\n\t@keyframes spin3 {\n\t\t0% {\n\t\t\ttransform: scale(1);\n\t\t}\n\t\t100% {\n\t\t\ttransform: scale(0);\n\t\t}\n\t} /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n\t@media (prefers-reduced-motion) {\n\t\t.spin.dot > span:first-child,\n\t\t.spin.dot > span:nth-child(2),\n\t\t.spin.dot > span:nth-child(3),\n\t\t.spin.dot > span:nth-child(4) {\n\t\t\tanimation-duration: 2s;\n\t\t}\n\t}\n}\n\n@layer kol-component {\n\t.spin {\n\t\tdisplay: block;\n\t\tpadding: 0.125rem;\n\t\tposition: relative;\n\t}\n}\n";function p(t){switch(t){case"cycle":return n("span",{class:"loader"});case"none":return n("slot",{name:"expert"});default:return n(i,null,n("span",{class:"bg-spin-1"}),n("span",{class:"bg-spin-2"}),n("span",{class:"bg-spin-3"}),n("span",{class:"bg-neutral"}))}}const c=class{constructor(n){t(this,n),this.showToggled=!1,this._show=!1,this._variant="dot",this.state={_variant:"dot"}}render(){return n(e,null,this.state._show?n("span",{"aria-busy":"true","aria-label":o("kol-action-running"),"aria-live":"polite",class:{spin:!0,[this.state._variant]:!0},role:"alert"},p(this.state._variant)):this.showToggled&&n("span",{"aria-label":o("kol-action-done"),"aria-busy":"false","aria-live":"polite",role:"alert"}))}validateShow(t){this.showToggled=!0===this.state._show&&!1===this._show,a(this,t)}validateVariant(t){l(this,t)}componentWillLoad(){this.validateShow(this._show),this.validateVariant(this._variant)}static get watchers(){return{_show:["validateShow"],_variant:["validateVariant"]}}};c.style={default:d};export{c as kol_spin};

package/dist/kolibri/kol-symbol.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as s,h as t,H as i}from"./index-0bc40dc4.js";import{a as e}from"./i18n-1b5afe13.js";import{v as a}from"./label-cdb96413.js";import{d as r}from"./prop.validators-445950f8.js";import"./index-48743821.js";import"./dev.utils-babc1742.js";import"./reuse-b3566e4c.js";import"./a11y.tipps-1e89ea61.js";const l=class{constructor(t){s(this,t),this._label=void 0,this._symbol=void 0,this.state={_label:e("kol-warning"),_symbol:"…"}}render(){return t(i,null,t("span",{"aria-label":this.state._label,role:"term"},this.state._symbol))}validateLabel(s){a(this,s)}validateSymbol(s){r(this,"_symbol",s,{required:!0})}componentWillLoad(){this.validateLabel(this._label),this.validateSymbol(this._symbol)}static get watchers(){return{_label:["validateLabel"],_symbol:["validateSymbol"]}}};export{l as kol_symbol};
+import{r as s,h as t,H as a}from"./index-0bc40dc4.js";import{a as i}from"./i18n-99b63f3a.js";import{v as e}from"./label-7afcc6a9.js";import{d as r}from"./prop.validators-3fb6bedf.js";import"./index-a4b1e92f.js";import"./dev.utils-8202a1bc.js";import"./reuse-b3566e4c.js";import"./a11y.tipps-68791110.js";const l=class{constructor(a){s(this,a),this._label=void 0,this._symbol=void 0,this.state={_label:i("kol-warning"),_symbol:"…"}}render(){return t(a,null,t("span",{"aria-label":this.state._label,role:"term"},this.state._symbol))}validateLabel(a){e(this,a)}validateSymbol(a){r(this,"_symbol",a,{required:!0})}componentWillLoad(){this.validateLabel(this._label),this.validateSymbol(this._symbol)}static get watchers(){return{_label:["validateLabel"],_symbol:["validateSymbol"]}}};export{l as kol_symbol};

package/dist/kolibri/kol-table.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as e,H as i}from"./index-0bc40dc4.js";import{a as n}from"./i18n-1b5afe13.js";import{v as o}from"./label-cdb96413.js";import{d as s}from"./a11y.tipps-1e89ea61.js";import{s as a,g as l,d as r,p as h,w as d,o as c}from"./prop.validators-445950f8.js";import"./index-48743821.js";import"./dev.utils-babc1742.js";import"./reuse-b3566e4c.js";const f="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: block;\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: grid;\n\t}\n\n\t:host > div.table {\n\t\tmax-width: 100%;\n\t\torder: 1;\n\t\toverflow-x: auto;\n\t\toverflow-y: hidden;\n\t}\n\n\t:host > div.table table {\n\t\twidth: 100%;\n\t}\n\n\tth > div {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\t\tplace-items: center;\n\t}\n\n\tdiv.pagination {\n\t\torder: 2;\n\t}\n\n\tdiv.pagination,\n\tdiv.pagination > div:last-child {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t@media (min-width: 1024px) {\n\t\tdiv.pagination,\n\t\tdiv.pagination > div:last-child {\n\t\t\tgrid-auto-flow: column;\n\t\t}\n\n\t\tdiv.pagination kol-pagination {\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n",p=[10,20,50,100],u=new Map,b=class{constructor(i){t(this,i),this.horizontal=!0,this.sortDirections=new Map,this.showPagination=!1,this.pageStartSlice=0,this.pageEndSlice=10,this.disableSort=!1,this.sortedColumnHead={label:"",key:"",sortDirection:"NOS"},this.ariaLive="",this.setSortDirection=(t,e)=>{this.sortDirections.clear(),this.sortDirections.set(t,e),this.sortFunction=t},this.handlePagination={onClick:(t,e)=>{var i;"function"==typeof(null===(i=this.state._pagination._on)||void 0===i?void 0:i.onClick)&&this.state._pagination._on.onClick(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePage:(t,e)=>{var i;"function"==typeof(null===(i=this.state._pagination._on)||void 0===i?void 0:i.onChangePage)&&this.state._pagination._on.onChangePage(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePageSize:(t,e)=>{var i;"function"==typeof(null===(i=this.state._pagination._on)||void 0===i?void 0:i.onChangePageSize)&&this.state._pagination._on.onChangePageSize(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_pageSize:e})),a(this,"_pageSize",e)}},this.beforePatchPagination=(t,e,i,n)=>{"_pagination"===n&&(this.showPagination=!0===t||""===t||"object"==typeof t&&null!==t)},this.updateSortedData=(t=this.sortedColumnHead)=>{let e=this.state._data;if("function"==typeof this.sortFunction)switch(this.sortDirections.get(this.sortFunction)){case"ASC":e=this.sortFunction([...this.state._data]),this.ariaLive=n("kol-sort-ascending",{placeholders:{column:t.label}}),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"ASC"};break;case"DESC":e=this.sortFunction([...this.state._data]).reverse(),this.ariaLive=n("kol-sort-descending",{placeholders:{column:t.label}}),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"DESC"};break;default:e=[...this.state._data],this.sortedColumnHead={label:"",key:"",sortDirection:"NOS"},this.ariaLive=n("kol-sort-none",{placeholders:{column:t.label}})}a(this,"_sortedData",e)},this.renderTableRow=(t,i)=>e("tr",{key:`tbody-${i}`},t.map(((t,e)=>this.renderTableCell(t,i,e)))),this.renderTableCell=(t,i,a)=>{if(!1===t.asTd){const o=t;let s,l="codicon codicon-fold";if(!this.disableSort&&o.key===this.sortedColumnHead.key)switch(this.sortedColumnHead.sortDirection){case"ASC":l="codicon codicon-chevron-up",s="ascending";break;case"DESC":l="codicon codicon-chevron-down",s="descending"}return e("th",{key:`tbody-${i}-${a}-${o.label}`,scope:"number"==typeof o.rowSpan&&o.rowSpan>1?"rowgroup":"row",colSpan:o.colSpan,rowSpan:o.rowSpan,style:{textAlign:o.textAlign,width:o.width},"aria-sort":s,"data-sort":`sort-${this.sortDirections.get(o.sort)}`},e("div",{class:"w-full flex gap-1 items-center"},e("div",{class:{"w-full":!0,[o.textAlign]:"string"==typeof o.textAlign&&o.textAlign.length>0},innerHTML:o.label,style:{textAlign:o.textAlign}}),!this.disableSort&&"function"==typeof o.sort&&e("kol-button",{exportparts:"icon",_icons:l,_hideLabel:!0,_label:n("kol-change-order",{placeholders:{colLabel:o.label}}),_on:{onClick:()=>{if("function"==typeof o.sort){switch(this.sortFunction=o.sort,this.sortDirections.get(this.sortFunction)){case"ASC":this.setSortDirection(this.sortFunction,"DESC");break;case"DESC":this.setSortDirection(this.sortFunction,"NOS");break;default:this.setSortDirection(this.sortFunction,"ASC")}this.updateSortedData(o)}}},_variant:"ghost"})))}return e("td",{key:`tbody-${i}-${a}-${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,innerHTML:"function"!=typeof t.render?t.label:""})},this.renderFoot=()=>{const t=this.createDataField(this.state._dataFoot,this.state._headers,!0);return e("tfoot",null,t.map(this.renderTableRow))},this._data=void 0,this._dataFoot=void 0,this._headers=void 0,this._label=void 0,this._minWidth=void 0,this._pagination=void 0,this.state={_label:"…",_data:[],_dataFoot:[],_headers:{horizontal:[],vertical:[]},_pagination:{_page:1,_pageSize:10,_max:0},_sortedData:[]}}validateData(t){l(t,(()=>{c(t,(()=>{void 0===t&&(t=[]);try{t=h(t)}catch(t){}Array.isArray(t)&&void 0===t.find((t=>!("object"==typeof t&&null!==t)))&&a(this,"_data",t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}))}))}validateDataFoot(t){l(t,(()=>{c(t,(()=>{void 0===t&&(t=[]);try{t=h(t)}catch(t){}Array.isArray(t)&&void 0===t.find((t=>!("object"==typeof t&&null!==t)))&&a(this,"_dataFoot",t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}))}))}validateHeaders(t){l(t,(()=>{c(t,(()=>{try{t=h(t)}catch(t){}d(this,"_headers",(t=>"object"==typeof t&&null!==t),new Set(["KoliBriTableHeaders"]),t,{hooks:{beforePatch:t=>{var e,i,n,a;const o=t;null===(e=o.horizontal)||void 0===e||e.forEach((t=>{t.forEach((t=>{"function"==typeof t.sort&&"string"==typeof t.sortDirection&&this.setSortDirection(t.sort,t.sortDirection)}))})),null===(i=o.vertical)||void 0===i||i.forEach((t=>{t.forEach((t=>{"function"==typeof t.sort&&"string"==typeof t.sortDirection&&this.setSortDirection(t.sort,t.sortDirection)}))})),o.horizontal&&o.vertical&&(null===(n=o.horizontal)||void 0===n?void 0:n.length)>0&&(null===(a=o.vertical)||void 0===a?void 0:a.length)>0&&(this.disableSort=!0,s("Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)"))}}})}))}))}validateLabel(t){o(this,t)}validateMinWidth(t){r(this,"_minWidth",t,{defaultValue:void 0})}validatePagination(t){try{t=h(t)}catch(t){}d(this,"_pagination",(()=>!0),new Set(["boolean","KoliBriTablePagination"]),t,{hooks:{beforePatch:this.beforePatchPagination}})}componentWillLoad(){this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaders(this._headers),this.validateLabel(this._label),this.validateMinWidth(this._minWidth),this.validatePagination(this._pagination)}getNumberOfCols(t,e){let i=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var i;return e+=null!==(i=t.colSpan)&&void 0!==i?i:1})),i<e&&(i=e)})),0===i&&(i=e.length),i}getNumberOfRows(t,e){let i=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var i;return e+=null!==(i=t.rowSpan)&&void 0!==i?i:1})),i<e&&(i=e)})),0===i?i=e.length:i-=this.state._dataFoot.length,i}filterHeaderKeys(t){const e=[];return t.forEach((t=>{t.forEach((t=>{"string"==typeof t.key&&e.push(t)}))})),e}getPrimaryHeader(t){var e,i;let n=this.filterHeaderKeys(null!==(e=t.horizontal)&&void 0!==e?e:[]);return this.horizontal=!0,0===n.length&&(n=this.filterHeaderKeys(null!==(i=t.vertical)&&void 0!==i?i:[]),n.length>0&&(this.horizontal=!1)),n}createDataField(t,e,i){e.horizontal=Array.isArray(null==e?void 0:e.horizontal)?e.horizontal:[],e.vertical=Array.isArray(null==e?void 0:e.vertical)?e.vertical:[];const a=this.getPrimaryHeader(e),o=this.getNumberOfCols(e.horizontal,t);let s=this.getNumberOfRows(e.vertical,t),l=0;i&&(l=s,s+=this.state._dataFoot.length);const r=[],h=[],d=[];e.vertical.forEach(((t,e)=>{h[e]=0,d[e]=[]}));for(let n=l;n<s;n++){const s=[];e.vertical.forEach(((t,e)=>{let i=0;if(d[e].forEach((t=>i+=t)),i<=n){const a=t[n-i+h[e]];if("object"==typeof a){s.push(Object.assign(Object.assign({},a),{asTd:!1,data:{}}));let t=1;if("number"==typeof a.rowSpan&&a.rowSpan>1&&(t=a.rowSpan),d[e].push(t),"number"==typeof a.colSpan&&a.colSpan>1)for(let i=1;i<a.colSpan;i++)d[e+i].push(t);h[e]++}}}));for(let e=0;e<o;e++)if(!0===this.horizontal){const o=i?this.state._dataFoot[n-l]:t[n];"object"==typeof a[e]&&null!==a[e]&&"string"==typeof a[e].key&&"object"==typeof o&&null!==o&&s.push(Object.assign(Object.assign({},a[e]),{colSpan:void 0,data:o,label:o[a[e].key],rowSpan:void 0}))}else"object"==typeof a[n]&&null!==a[n]&&"string"==typeof a[n].key&&"object"==typeof t[e]&&null!==t[e]&&s.push(Object.assign(Object.assign({},a[n]),{colSpan:void 0,data:t[e],label:t[e][a[n].key],rowSpan:void 0}));r.push(s)}if(0===t.length){let t=0,i=0;Array.isArray(e.horizontal)&&e.horizontal.length>0&&e.horizontal[0].forEach((e=>{t+=e.colSpan||1})),Array.isArray(e.vertical)&&e.vertical.length>0&&(t-=e.vertical.length,e.vertical[0].forEach((t=>{i+=t.rowSpan||1})));const a={colSpan:t,label:n("kol-no-entries"),render:void 0,rowSpan:Math.max(i,1)};0===r.length?r.push([a]):r[0].push(a)}return r}selectDisplayedData(t,e,i){return"number"==typeof e&&e>0&&"number"==typeof i&&i>0?(this.pageStartSlice=e*(i-1),this.pageEndSlice=e*i>t.length?t.length:e*i,t.slice(this.pageStartSlice,this.pageEndSlice)):(this.pageStartSlice=0,this.pageEndSlice=t.length,t)}cellRender(t,e){e&&(clearTimeout(u.get(e)),u.set(e,setTimeout((()=>{clearTimeout(u.get(e));const i=t.render(e,{asTd:t.asTd,label:t.label,textAlign:t.textAlign,width:t.width},t.data,this.state._data);"string"==typeof i&&(e.innerHTML=i)}))))}render(){var t,a;const o=this.selectDisplayedData(this.state._sortedData,this.showPagination?null!==(a=null===(t=this.state._pagination)||void 0===t?void 0:t._pageSize)&&void 0!==a?a:10:this.state._sortedData.length,this.state._pagination._page||1),s=this.createDataField(o,this.state._headers);return e(i,null,e("span",{style:{height:"0",width:"0",overflow:"hidden"},"aria-live":"assertive"},this.ariaLive),this.pageEndSlice>0&&this.showPagination&&e("div",{class:"pagination"},e("span",null,"Einträge ",this.pageEndSlice>0?this.pageStartSlice+1:0," bis ",this.pageEndSlice," von"," ",this.state._pagination._max||(Array.isArray(this.state._data)?this.state._data.length:0)," angezeigt"),e("div",null,e("kol-pagination",{_boundaryCount:this.state._pagination._boundaryCount,_customClass:this.state._pagination._customClass,_on:this.handlePagination,_page:this.state._pagination._page,_pageSize:this.state._pagination._pageSize,_pageSizeOptions:this.state._pagination._pageSizeOptions||p,_siblingCount:this.state._pagination._siblingCount,_tooltipAlign:"bottom",_max:this.state._pagination._max||this.state._pagination._max||this.state._data.length,_label:n("kol-table-pagination-label",{placeholders:{label:this.state._label}})}))),e("div",{class:"table",tabindex:"0"},e("table",{style:{minWidth:this.state._minWidth}},e("caption",null,this.state._label),Array.isArray(this.state._headers.horizontal)&&e("thead",null,this.state._headers.horizontal.map(((t,i)=>e("tr",{key:`thead-${i}`},t.map(((t,a)=>{if(!0===t.asTd)return e("td",{key:`thead-${i}-${a}-${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,innerHTML:"function"!=typeof t.render?t.label:""});{const o=t;let s,l="codicon codicon-fold";if(o.key===this.sortedColumnHead.key)switch(this.sortedColumnHead.sortDirection){case"ASC":l="codicon codicon-chevron-up",s="ascending";break;case"DESC":l="codicon codicon-chevron-down",s="descending"}return e("th",{key:`thead-${i}-${a}-${o.label}`,scope:"number"==typeof o.colSpan&&o.colSpan>1?"colgroup":"col",colSpan:o.colSpan,rowSpan:o.rowSpan,style:{textAlign:t.textAlign,width:t.width},"aria-sort":s,"data-sort":s?`sort-${this.sortedColumnHead.sortDirection}`:"sort-NOS"},e("div",{class:"w-full flex gap-1 items-center"},e("div",{class:{"w-full":!0,[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},innerHTML:t.label,style:{textAlign:t.textAlign}}),!this.disableSort&&"function"==typeof o.sort&&e("kol-button",{exportparts:"icon",_icons:l,_hideLabel:!0,_label:n("kol-change-order",{placeholders:{colLabel:t.label}}),_on:{onClick:()=>{if("function"==typeof o.sort){switch(this.sortFunction=o.sort,this.sortDirections.get(this.sortFunction)){case"ASC":this.setSortDirection(this.sortFunction,"DESC");break;case"DESC":this.setSortDirection(this.sortFunction,"NOS");break;default:this.setSortDirection(this.sortFunction,"ASC")}this.updateSortedData(o)}}},_variant:"ghost"})))}})))))),e("tbody",null,s.map(this.renderTableRow)),this.state._dataFoot.length>0?this.renderFoot():"")))}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headers:["validateHeaders"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_pagination:["validatePagination"]}}};b.style={default:f};export{b as kol_table};
+import{r as t,h as e,H as i}from"./index-0bc40dc4.js";import{a as n}from"./i18n-99b63f3a.js";import{v as o}from"./label-7afcc6a9.js";import{d as s}from"./a11y.tipps-68791110.js";import{s as a,w as l,g as r,d as h,p as d,o as c}from"./prop.validators-3fb6bedf.js";import"./index-a4b1e92f.js";import"./dev.utils-8202a1bc.js";import"./reuse-b3566e4c.js";const f="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: block;\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: grid;\n\t}\n\n\t:host > div.table {\n\t\tmax-width: 100%;\n\t\torder: 1;\n\t\toverflow-x: auto;\n\t\toverflow-y: hidden;\n\t}\n\n\t:host > div.table table {\n\t\twidth: 100%;\n\t}\n\n\tth > div {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\t\tplace-items: center;\n\t}\n\n\tdiv.pagination {\n\t\torder: 2;\n\t}\n\n\tdiv.pagination,\n\tdiv.pagination > div:last-child {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t@media (min-width: 1024px) {\n\t\tdiv.pagination,\n\t\tdiv.pagination > div:last-child {\n\t\t\tgrid-auto-flow: column;\n\t\t}\n\n\t\tdiv.pagination kol-pagination {\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n",u=[10,20,50,100],p=new Map,b=class{constructor(i){t(this,i),this.horizontal=!0,this.sortDirections=new Map,this.sortData=[],this.showPagination=!1,this.pageStartSlice=0,this.pageEndSlice=10,this.disableSort=!1,this.sortedColumnHead={label:"",key:"",sortDirection:"NOS"},this.ariaLive="",this.setSortDirection=(t,e)=>{this.sortDirections.clear(),this.sortDirections.set(t,e),this.sortFunction=t},this.handlePagination={onClick:(t,e)=>{var i;"function"==typeof(null===(i=this.state._pagination._on)||void 0===i?void 0:i.onClick)&&this.state._pagination._on.onClick(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePage:(t,e)=>{var i;"function"==typeof(null===(i=this.state._pagination._on)||void 0===i?void 0:i.onChangePage)&&this.state._pagination._on.onChangePage(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePageSize:(t,e)=>{var i;"function"==typeof(null===(i=this.state._pagination._on)||void 0===i?void 0:i.onChangePageSize)&&this.state._pagination._on.onChangePageSize(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_pageSize:e})),a(this,"_pageSize",e)}},this.beforePatchPagination=(t,e,i,a)=>{"_pagination"===a&&(this.showPagination=!0===t||""===t||"object"==typeof t&&null!==t)},this.updateSortedData=(t=this.sortedColumnHead)=>{if(this.disableSort)return void a(this,"_sortedData",this.state._data);let e=this.state._data;if(this.sortData.length>0)if(e=this.state._data.sort(((t,e)=>{for(let i=0;i<this.sortData.length;i++){const a=this.sortData[i],n=a.compareFn(t,e);if(0!==n)return"ASC"===a.direction?n:-n}return 0})),1===this.sortData.length)this.ariaLive=n("kol-sort-"+("ASC"===this.sortData[0].direction?"ascending":"descending"),{placeholders:{column:this.sortData[0].label,multi:""}});else{let t="";for(let e=1;e<this.sortData.length-1;e++){const i=this.sortData[e];t+=n("kol-sort-then-"+("ASC"===i.direction?"ascending":"descending"),{placeholders:{column:i.label}})}t+=n("kol-sort-then-last-"+("ASC"===this.sortData[this.sortData.length-1].direction?"ascending":"descending"),{placeholders:{column:this.sortData[this.sortData.length-1].label}}),this.ariaLive=n("kol-sort-"+("ASC"===this.sortData[0].direction?"ascending":"descending"),{placeholders:{column:this.sortData[0].label,multi:t}})}else if("function"==typeof this.sortFunction)switch(this.sortDirections.get(this.sortFunction)){case"ASC":e=this.sortFunction([...this.state._data]),this.ariaLive=n("kol-sort-ascending",{placeholders:{column:t.label}}),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"ASC"};break;case"DESC":e=this.sortFunction([...this.state._data]).reverse(),this.ariaLive=n("kol-sort-descending",{placeholders:{column:t.label}}),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"DESC"};break;default:e=[...this.state._data],this.sortedColumnHead={label:"",key:"",sortDirection:"NOS"},this.ariaLive=n("kol-sort-none",{placeholders:{column:t.label}})}else this.ariaLive=n("kol-table-sort-none");a(this,"_sortedData",e)},this.renderTableRow=(t,i)=>e("tr",{key:`tbody-${i}`},t.map(((t,e)=>this.renderTableCell(t,i,e)))),this.renderTableCell=(t,i,a)=>{if(!1===t.asTd){const o=t;let s,l="NOS",r="codicon codicon-fold";if(!this.disableSort){if(o.key){const t=this.sortData.find((t=>t.key===o.key));if(t)switch(l=t.direction,t.direction){case"ASC":r="codicon codicon-chevron-up",s="ascending";break;case"DESC":r="codicon codicon-chevron-down",s="descending"}}if(o.key===this.sortedColumnHead.key)switch(l=this.sortedColumnHead.sortDirection,this.sortedColumnHead.sortDirection){case"ASC":r="codicon codicon-chevron-up",s="ascending";break;case"DESC":r="codicon codicon-chevron-down",s="descending"}}return e("th",{key:`tbody-${i}-${a}-${o.label}`,scope:"number"==typeof o.rowSpan&&o.rowSpan>1?"rowgroup":"row",colSpan:o.colSpan,rowSpan:o.rowSpan,style:{textAlign:o.textAlign,width:o.width},"aria-sort":s,"data-sort":`sort-${l}`},e("div",{class:"w-full flex gap-1 items-center"},e("div",{class:{"w-full":!0,[o.textAlign]:"string"==typeof o.textAlign&&o.textAlign.length>0},style:{textAlign:o.textAlign}},o.label),!this.disableSort&&("function"==typeof o.compareFn||"function"==typeof o.sort)&&e("kol-button",{exportparts:"icon",_icons:r,_hideLabel:!0,_label:n("kol-change-order",{placeholders:{colLabel:o.label}}),_on:{onClick:()=>this.changeCellSort(o)},_variant:"ghost"})))}return e("td",{key:`tbody-${i}-${a}-${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.renderFoot=()=>{const t=this.createDataField(this.state._dataFoot,this.state._headers,!0);return e("tfoot",null,t.map(this.renderTableRow))},this._allowMultiSort=void 0,this._data=void 0,this._dataFoot=void 0,this._headers=void 0,this._label=void 0,this._minWidth=void 0,this._pagination=void 0,this.state={_allowMultiSort:!1,_label:"…",_data:[],_dataFoot:[],_headers:{horizontal:[],vertical:[]},_pagination:{_page:1,_pageSize:10,_max:0},_sortedData:[]}}validateAllowMultiSort(t){l(this,"_allowMultiSort",(()=>!0),new Set(["boolean"]),t,{defaultValue:!1})}validateData(t){r(t,(()=>{c(t,(()=>{void 0===t&&(t=[]);try{t=d(t)}catch(t){}Array.isArray(t)&&void 0===t.find((t=>!("object"==typeof t&&null!==t)))&&a(this,"_data",t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}))}))}validateDataFoot(t){r(t,(()=>{c(t,(()=>{void 0===t&&(t=[]);try{t=d(t)}catch(t){}Array.isArray(t)&&void 0===t.find((t=>!("object"==typeof t&&null!==t)))&&a(this,"_dataFoot",t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}))}))}changeCellSort(t){var e;if("function"==typeof t.compareFn){this.state._allowMultiSort||t.key==(null===(e=this.sortData[0])||void 0===e?void 0:e.key)||(this.sortData=[]);const i=this.sortData.findIndex((e=>e.key===t.key));if(i>=0){const t=this.sortData[i];switch(t.direction){case"ASC":t.direction="DESC";break;case"DESC":this.sortData.splice(i,1);break;default:t.direction="ASC"}}else t.key&&this.sortData.push({label:t.label,key:t.key,compareFn:t.compareFn,direction:"ASC"});this.updateSortedData(t)}else if("function"==typeof t.sort){switch(this.sortFunction=t.sort,this.sortDirections.get(this.sortFunction)){case"ASC":this.setSortDirection(this.sortFunction,"DESC");break;case"DESC":this.setSortDirection(this.sortFunction,"NOS");break;default:this.setSortDirection(this.sortFunction,"ASC")}this.updateSortedData(t)}}validateHeaders(t){r(t,(()=>{c(t,(()=>{try{t=d(t)}catch(t){}l(this,"_headers",(t=>"object"==typeof t&&null!==t),new Set(["KoliBriTableHeaders"]),t,{hooks:{beforePatch:t=>{var e,i,a,n;const o=t=>{let e=!1;t.forEach((t=>{const i=t.key;if(!i)return;const a=t.sortDirection;"ASC"!==a&&"DESC"!==a||("function"==typeof t.compareFn?((this.state._allowMultiSort||0===this.sortData.length)&&this.sortData.push({label:t.label,key:i,compareFn:t.compareFn,direction:a}),e=!0):"function"==typeof t.sort&&(this.setSortDirection(t.sort,a),setTimeout((()=>this.updateSortedData({key:i,label:t.label,sortDirection:a})))))})),e&&setTimeout((()=>this.updateSortedData()))},l=t;null===(e=l.horizontal)||void 0===e||e.forEach(o),null===(i=l.vertical)||void 0===i||i.forEach(o),l.horizontal&&l.vertical&&(null===(a=l.horizontal)||void 0===a?void 0:a.length)>0&&(null===(n=l.vertical)||void 0===n?void 0:n.length)>0&&(this.disableSort=!0,s("Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)"))}}})}))}))}validateLabel(t){o(this,t)}validateMinWidth(t){h(this,"_minWidth",t,{defaultValue:void 0})}validatePagination(t){try{t=d(t)}catch(t){}l(this,"_pagination",(()=>!0),new Set(["boolean","KoliBriTablePagination"]),t,{hooks:{beforePatch:this.beforePatchPagination}})}componentWillLoad(){this.validateAllowMultiSort(this._allowMultiSort),this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaders(this._headers),this.validateLabel(this._label),this.validateMinWidth(this._minWidth),this.validatePagination(this._pagination)}getNumberOfCols(t,e){let i=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var i;return e+=null!==(i=t.colSpan)&&void 0!==i?i:1})),i<e&&(i=e)})),0===i&&(i=e.length),i}getNumberOfRows(t,e){let i=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var i;return e+=null!==(i=t.rowSpan)&&void 0!==i?i:1})),i<e&&(i=e)})),0===i?i=e.length:i-=this.state._dataFoot.length,i}filterHeaderKeys(t){const e=[];return t.forEach((t=>{t.forEach((t=>{"string"==typeof t.key&&e.push(t)}))})),e}getPrimaryHeader(t){var e,i;let a=this.filterHeaderKeys(null!==(e=t.horizontal)&&void 0!==e?e:[]);return this.horizontal=!0,0===a.length&&(a=this.filterHeaderKeys(null!==(i=t.vertical)&&void 0!==i?i:[]),a.length>0&&(this.horizontal=!1)),a}createDataField(t,e,i){e.horizontal=Array.isArray(null==e?void 0:e.horizontal)?e.horizontal:[],e.vertical=Array.isArray(null==e?void 0:e.vertical)?e.vertical:[];const a=this.getPrimaryHeader(e),o=this.getNumberOfCols(e.horizontal,t);let s=this.getNumberOfRows(e.vertical,t),l=0;i&&(l=s,s+=this.state._dataFoot.length);const r=[],h=[],d=[];e.vertical.forEach(((t,e)=>{h[e]=0,d[e]=[]}));for(let n=l;n<s;n++){const s=[];e.vertical.forEach(((t,e)=>{let i=0;if(d[e].forEach((t=>i+=t)),i<=n){const a=t[n-i+h[e]];if("object"==typeof a){s.push(Object.assign(Object.assign({},a),{asTd:!1,data:{}}));let t=1;if("number"==typeof a.rowSpan&&a.rowSpan>1&&(t=a.rowSpan),d[e].push(t),"number"==typeof a.colSpan&&a.colSpan>1)for(let i=1;i<a.colSpan;i++)d[e+i].push(t);h[e]++}}}));for(let e=0;e<o;e++)if(!0===this.horizontal){const o=i?this.state._dataFoot[n-l]:t[n];"object"==typeof a[e]&&null!==a[e]&&"string"==typeof a[e].key&&"object"==typeof o&&null!==o&&s.push(Object.assign(Object.assign({},a[e]),{colSpan:void 0,data:o,label:o[a[e].key],rowSpan:void 0}))}else"object"==typeof a[n]&&null!==a[n]&&"string"==typeof a[n].key&&"object"==typeof t[e]&&null!==t[e]&&s.push(Object.assign(Object.assign({},a[n]),{colSpan:void 0,data:t[e],label:t[e][a[n].key],rowSpan:void 0}));r.push(s)}if(0===t.length){let t=0,i=0;Array.isArray(e.horizontal)&&e.horizontal.length>0&&e.horizontal[0].forEach((e=>{t+=e.colSpan||1})),Array.isArray(e.vertical)&&e.vertical.length>0&&(t-=e.vertical.length,e.vertical[0].forEach((t=>{i+=t.rowSpan||1})));const a={colSpan:t,label:n("kol-no-entries"),render:void 0,rowSpan:Math.max(i,1)};0===r.length?r.push([a]):r[0].push(a)}return r}selectDisplayedData(t,e,i){return"number"==typeof e&&e>0&&"number"==typeof i&&i>0?(this.pageStartSlice=e*(i-1),this.pageEndSlice=e*i>t.length?t.length:e*i,t.slice(this.pageStartSlice,this.pageEndSlice)):(this.pageStartSlice=0,this.pageEndSlice=t.length,t)}cellRender(t,e){e&&(clearTimeout(p.get(e)),p.set(e,setTimeout((()=>{clearTimeout(p.get(e));const i=t.render(e,{asTd:t.asTd,label:t.label,textAlign:t.textAlign,width:t.width},t.data,this.state._data);"string"==typeof i&&(e.textContent=i)}))))}render(){var t,a;const o=this.selectDisplayedData(this.state._sortedData,this.showPagination?null!==(a=null===(t=this.state._pagination)||void 0===t?void 0:t._pageSize)&&void 0!==a?a:10:this.state._sortedData.length,this.state._pagination._page||1),s=this.createDataField(o,this.state._headers);return e(i,null,e("div",{style:{height:"0",width:"0",overflow:"hidden"},"aria-live":"assertive"},this.ariaLive),this.pageEndSlice>0&&this.showPagination&&e("div",{class:"pagination"},e("span",null,"Einträge ",this.pageEndSlice>0?this.pageStartSlice+1:0," bis ",this.pageEndSlice," von"," ",this.state._pagination._max||(Array.isArray(this.state._data)?this.state._data.length:0)," angezeigt"),e("div",null,e("kol-pagination",{_boundaryCount:this.state._pagination._boundaryCount,_customClass:this.state._pagination._customClass,_on:this.handlePagination,_page:this.state._pagination._page,_pageSize:this.state._pagination._pageSize,_pageSizeOptions:this.state._pagination._pageSizeOptions||u,_siblingCount:this.state._pagination._siblingCount,_tooltipAlign:"bottom",_max:this.state._pagination._max||this.state._pagination._max||this.state._data.length,_label:n("kol-table-pagination-label",{placeholders:{label:this.state._label}})}))),e("div",{class:"table",tabindex:"0"},e("table",{style:{minWidth:this.state._minWidth}},e("caption",null,this.state._label),Array.isArray(this.state._headers.horizontal)&&e("thead",null,this.state._headers.horizontal.map(((t,i)=>e("tr",{key:`thead-${i}`},t.map(((t,a)=>{if(!0===t.asTd)return e("td",{key:`thead-${i}-${a}-${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:"");{const o=t;let s,l="NOS",r="codicon codicon-fold";if(o.key){const t=this.sortData.find((t=>t.key===o.key));if(t)switch(l=t.direction,t.direction){case"ASC":r="codicon codicon-chevron-up",s="ascending";break;case"DESC":r="codicon codicon-chevron-down",s="descending"}}if(o.key===this.sortedColumnHead.key)switch(l=this.sortedColumnHead.sortDirection,this.sortedColumnHead.sortDirection){case"ASC":r="codicon codicon-chevron-up",s="ascending";break;case"DESC":r="codicon codicon-chevron-down",s="descending"}return e("th",{key:`thead-${i}-${a}-${o.label}`,scope:"number"==typeof o.colSpan&&o.colSpan>1?"colgroup":"col",colSpan:o.colSpan,rowSpan:o.rowSpan,style:{textAlign:t.textAlign,width:t.width},"aria-sort":s,"data-sort":`sort-${l}`},e("div",{class:"w-full flex gap-1 items-center"},e("div",{class:{"w-full":!0,[t.textAlign]:"string"==typeof t.textAlign&&t.textAlign.length>0},style:{textAlign:t.textAlign}},t.label),!this.disableSort&&("function"==typeof o.compareFn||"function"==typeof o.sort)&&e("kol-button",{exportparts:"icon",_icons:r,_hideLabel:!0,_label:n("kol-change-order",{placeholders:{colLabel:t.label}}),_on:{onClick:()=>this.changeCellSort(o)},_variant:"ghost"})))}})))))),e("tbody",null,s.map(this.renderTableRow)),this.state._dataFoot.length>0?this.renderFoot():"")))}static get watchers(){return{_allowMultiSort:["validateAllowMultiSort"],_data:["validateData"],_dataFoot:["validateDataFoot"],_headers:["validateHeaders"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_pagination:["validatePagination"]}}};b.style={default:f};export{b as kol_table};

package/dist/kolibri/kol-table.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["defaultStyleCss","PAGINATION_OPTIONS","CELL_REFS","Map","KolTable","this","horizontal","sortDirections","showPagination","pageStartSlice","pageEndSlice","disableSort","sortedColumnHead","label","key","sortDirection","ariaLive","setSortDirection","sort","direction","clear","set","sortFunction","handlePagination","onClick","event","page","_a","state","_pagination","_on","setState","Object","assign","_page","onChangePage","onChangePageSize","pageSize","_pageSize","beforePatchPagination","nextValue","_nextState","_component","updateSortedData","cell","sortedData","_data","get","translate","placeholders","column","reverse","renderTableRow","row","rowIndex","h","map","col","colIndex","renderTableCell","asTd","headerCell","undefined","sortButtonIcon","scope","rowSpan","colSpan","style","textAlign","width","class","length","innerHTML","exportparts","_icons","_hideLabel","_label","colLabel","_variant","ref","render","el","cellRender","renderFoot","rows","createDataField","_dataFoot","_headers","vertical","_max","_sortedData","validateData","value","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","Array","isArray","find","dataTupel","afterPatch","setTimeout","validateDataFoot","validateHeaders","watchValidator","Set","hooks","beforePatch","headers","forEach","header","_b","_c","_d","devHint","validateLabel","validateMinWidth","watchString","defaultValue","validatePagination","componentWillLoad","_minWidth","getNumberOfCols","horizontalHeaders","data","max","count","getNumberOfRows","verticalHeaders","filterHeaderKeys","primaryHeader","cells","push","getPrimaryHeader","isFoot","maxCols","maxRows","startRow","dataField","rowCount","rowSpans","_row","index","i","dataRow","headerCells","rowsTotal","k","j","colspan","rowspan","emptyCell","Math","selectDisplayedData","slice","clearTimeout","html","displayedData","Host","height","overflow","_boundaryCount","_customClass","_pageSizeOptions","_siblingCount","_tooltipAlign","tabindex","minWidth","cols"],"sources":["src/components/table/style.css?tag=kol-table&mode=default&encapsulation=shadow","src/components/table/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\n@layer kol-component {\n\t:host {\n\t\tdisplay: grid;\n\t}\n\n\t:host > div.table {\n\t\tmax-width: 100%;\n\t\torder: 1;\n\t\toverflow-x: auto;\n\t\toverflow-y: hidden;\n\t}\n\n\t:host > div.table table {\n\t\twidth: 100%;\n\t}\n\n\tth > div {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\t\tplace-items: center;\n\t}\n\n\tdiv.pagination {\n\t\torder: 2;\n\t}\n\n\tdiv.pagination,\n\tdiv.pagination > div:last-child {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t@media (min-width: 1024px) {\n\t\tdiv.pagination,\n\t\tdiv.pagination > div:last-child {\n\t\t\tgrid-auto-flow: column;\n\t\t}\n\n\t\tdiv.pagination kol-pagination {\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-tabindex */\nimport { Generic } from '@a11y-ui/core';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { Stringified } from '../../types/common';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, setState, watchString, watchValidator } from '../../utils/prop.validators';\nimport { KoliBriPaginationButtonCallbacks } from '../pagination/types';\nimport {\n\tAPI,\n\tKoliBriSortDirection,\n\tKoliBriSortFunction,\n\tKoliBriTableCell,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaderCellAndData,\n\tKoliBriTableHeaders,\n\tKoliBriTablePaginationProps,\n\tKoliBriTableRender,\n\tKoliBriTableSelectedHead,\n\tStates,\n} from './types';\n\nconst PAGINATION_OPTIONS = [10, 20, 50, 100];\n\nconst CELL_REFS = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\n@Component({\n\ttag: 'kol-table',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolTable implements API {\n\tprivate horizontal = true;\n\tprivate sortFunction?: KoliBriSortFunction;\n\tprivate sortDirections: Map<KoliBriSortFunction, KoliBriSortDirection> = new Map();\n\tprivate showPagination = false;\n\tprivate pageStartSlice = 0;\n\tprivate pageEndSlice = 10;\n\tprivate disableSort = false;\n\n\tprivate sortedColumnHead: KoliBriTableSelectedHead = { label: '', key: '', sortDirection: 'NOS' };\n\tprivate ariaLive = '';\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headers!: Stringified<KoliBriTableHeaders>;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width.\n\t */\n\t@Prop() public _minWidth?: string;\n\n\t/**\n\t * Defines whether to show the data distributed over multiple pages.\n\t */\n\t@Prop() public _pagination?: boolean | Stringified<KoliBriTablePaginationProps>;\n\n\t@State() public state: States = {\n\t\t_label: '…', // ⚠ required\n\t\t_data: [],\n\t\t_dataFoot: [],\n\t\t_headers: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t\t_pagination: {\n\t\t\t_page: 1,\n\t\t\t_pageSize: 10,\n\t\t\t_max: 0,\n\t\t},\n\t\t_sortedData: [],\n\t};\n\n\t@Watch('_data')\n\tpublic validateData(value?: Stringified<KoliBriTableDataType[]>): void {\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\tif (typeof value === 'undefined') {\n\t\t\t\t\tvalue = [];\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableDataType[]>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\tif (Array.isArray(value) && value.find((dataTupel: KoliBriTableDataType) => !(typeof dataTupel === 'object' && dataTupel !== null)) === undefined) {\n\t\t\t\t\tsetState(this, '_data', value, {\n\t\t\t\t\t\tafterPatch: () => {\n\t\t\t\t\t\t\t// TODO: kein guter Hack (endless loop)\n\t\t\t\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: Stringified<KoliBriTableDataType[]>): void {\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\tif (typeof value === 'undefined') {\n\t\t\t\t\tvalue = [];\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableDataType[]>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\tif (Array.isArray(value) && value.find((dataTupel: KoliBriTableDataType) => !(typeof dataTupel === 'object' && dataTupel !== null)) === undefined) {\n\t\t\t\t\tsetState(this, '_dataFoot', value, {\n\t\t\t\t\t\tafterPatch: () => {\n\t\t\t\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\tprivate setSortDirection = (sort: KoliBriSortFunction, direction: KoliBriSortDirection) => {\n\t\t/**\n\t\t * Durch des Clearen, ist es nicht möglich eine Mehr-Spalten-Sortierung\n\t\t * darzustellen. Das wäre der Fall, wenn man ggf. Daten in außerhalb der\n\t\t * Komponente sortiert und diese sortiert von außen rein gibt und der\n\t\t * Sortierungsalgorithmus mehrere Spalten zusammen sortierte.\n\t\t *\n\t\t * Beachte auch col.sort !== this.sortFunction\n\t\t */\n\t\tthis.sortDirections.clear();\n\t\tthis.sortDirections.set(sort, direction);\n\t\tthis.sortFunction = sort;\n\t};\n\n\t@Watch('_headers')\n\tpublic validateHeaders(value?: Stringified<KoliBriTableHeaders>): void {\n\t\t/**\n\t\t * - es darf maximal ein Header als primary markiert werden (last win)\n\t\t * - der primary-Header entscheidet implizit über _order und _orientation\n\t\t *   - primary-Headers müssen das key-Property setzen\n\t\t *   - nicht primary-Headers müssen das key-Property nicht setzen (wird ignoriert)\n\t\t *   - _order: wird durch den primary-Header geregelt\n\t\t *   - _orientation: wird durch den primary-Header geregelt\n\t\t * - sobald ein Header sortierbar ist, darf es nur noch entweder horizontale\n\t\t *   oder vertikale Header geben, aber nicht mehr beides\n\t\t */\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableHeaders>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\twatchValidator(this, '_headers', (value): boolean => typeof value === 'object' && value !== null, new Set(['KoliBriTableHeaders']), value, {\n\t\t\t\t\thooks: {\n\t\t\t\t\t\tbeforePatch: (nextValue: unknown) => {\n\t\t\t\t\t\t\tconst headers: KoliBriTableHeaders = nextValue as KoliBriTableHeaders;\n\t\t\t\t\t\t\theaders.horizontal?.forEach((header) => {\n\t\t\t\t\t\t\t\theader.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tif (typeof cell.sort === 'function' && typeof cell.sortDirection === 'string') {\n\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(cell.sort, cell.sortDirection);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\theaders.vertical?.forEach((header) => {\n\t\t\t\t\t\t\t\theader.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tif (typeof cell.sort === 'function' && typeof cell.sortDirection === 'string') {\n\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(cell.sort, cell.sortDirection);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tif (headers.horizontal && headers.vertical && headers.horizontal?.length > 0 && headers.vertical?.length > 0) {\n\t\t\t\t\t\t\t\tthis.disableSort = true;\n\t\t\t\t\t\t\t\tdevHint(\n\t\t\t\t\t\t\t\t\t`Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)`\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_minWidth')\n\tpublic validateMinWidth(value?: string): void {\n\t\twatchString(this, '_minWidth', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\tprivate readonly handlePagination: KoliBriPaginationButtonCallbacks = {\n\t\tonClick: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onClick === 'function') {\n\t\t\t\tthis.state._pagination._on.onClick(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePage: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePage === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePage(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePageSize: (event: Event, pageSize: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePageSize === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePageSize(event, pageSize);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_pageSize: pageSize,\n\t\t\t});\n\t\t\tsetState(this, '_pageSize', pageSize);\n\t\t},\n\t};\n\n\tprivate readonly beforePatchPagination: Generic.Element.NextStateHooksCallback = (nextValue, _nextState, _component, key): void => {\n\t\tif (key === '_pagination') {\n\t\t\tthis.showPagination = nextValue === true || nextValue === '' /* true */ || (typeof nextValue === 'object' && nextValue !== null);\n\t\t}\n\t};\n\n\t@Watch('_pagination')\n\tpublic validatePagination(value?: boolean | Stringified<KoliBriTablePaginationProps>): void {\n\t\ttry {\n\t\t\tvalue = parseJson<KoliBriTablePaginationProps>(value);\n\t\t\t// eslint-disable-next-line no-empty\n\t\t} catch (e) {\n\t\t\t// value behält den ursprünglichen Wert\n\t\t}\n\t\twatchValidator(this, '_pagination', () => true, new Set(['boolean', 'KoliBriTablePagination']), value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchPagination,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaders(this._headers);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validatePagination(this._pagination);\n\t}\n\n\tprivate getNumberOfCols(horizontalHeaders: KoliBriTableHeaderCell[][], data: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\thorizontalHeaders.forEach((row) => {\n\t\t\tlet count = 0;\n\t\t\trow.forEach((col) => (count += col.colSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate getNumberOfRows(verticalHeaders: KoliBriTableHeaderCell[][], data: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\tverticalHeaders.forEach((col) => {\n\t\t\tlet count = 0;\n\t\t\tcol.forEach((row) => (count += row.rowSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t} else {\n\t\t\tmax -= this.state._dataFoot.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate filterHeaderKeys(headers: KoliBriTableHeaderCell[][]): KoliBriTableHeaderCell[] {\n\t\tconst primaryHeader: KoliBriTableHeaderCell[] = [];\n\t\theaders.forEach((cells) => {\n\t\t\tcells.forEach((cell) => {\n\t\t\t\tif (typeof cell.key === 'string') {\n\t\t\t\t\tprimaryHeader.push(cell);\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t\treturn primaryHeader;\n\t}\n\n\tprivate getPrimaryHeader(headers: KoliBriTableHeaders): KoliBriTableHeaderCell[] {\n\t\tlet primaryHeader: KoliBriTableHeaderCell[] = this.filterHeaderKeys(headers.horizontal ?? []);\n\t\tthis.horizontal = true;\n\t\tif (primaryHeader.length === 0) {\n\t\t\tprimaryHeader = this.filterHeaderKeys(headers.vertical ?? []);\n\t\t\tif (primaryHeader.length > 0) {\n\t\t\t\tthis.horizontal = false;\n\t\t\t}\n\t\t}\n\t\treturn primaryHeader;\n\t}\n\n\tprivate createDataField(data: KoliBriTableDataType[], headers: KoliBriTableHeaders, isFoot?: boolean): KoliBriTableCell[][] {\n\t\theaders.horizontal = Array.isArray(headers?.horizontal) ? headers.horizontal : [];\n\t\theaders.vertical = Array.isArray(headers?.vertical) ? headers.vertical : [];\n\t\tconst primaryHeader = this.getPrimaryHeader(headers);\n\t\tconst maxCols = this.getNumberOfCols(headers.horizontal, data);\n\t\tlet maxRows = this.getNumberOfRows(headers.vertical, data);\n\t\tlet startRow = 0;\n\t\tif (isFoot) {\n\t\t\tstartRow = maxRows;\n\t\t\tmaxRows += this.state._dataFoot.length;\n\t\t}\n\t\tconst dataField: KoliBriTableCell[][] = [];\n\n\t\tconst rowCount: number[] = [];\n\t\tconst rowSpans: number[][] = [];\n\t\theaders.vertical.forEach((_row, index) => {\n\t\t\trowCount[index] = 0;\n\t\t\trowSpans[index] = [];\n\t\t});\n\n\t\tfor (let i = startRow; i < maxRows; i++) {\n\t\t\tconst dataRow: KoliBriTableHeaderCellAndData[] = [];\n\t\t\theaders.vertical.forEach((headerCells, index) => {\n\t\t\t\tlet rowsTotal = 0;\n\t\t\t\trowSpans[index].forEach((value) => (rowsTotal += value));\n\t\t\t\tif (rowsTotal <= i) {\n\t\t\t\t\tconst rows = headerCells[i - rowsTotal + rowCount[index]];\n\t\t\t\t\tif (typeof rows === 'object') {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...rows,\n\t\t\t\t\t\t\tasTd: false,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: {} as KoliBriTableDataType,\n\t\t\t\t\t\t});\n\t\t\t\t\t\tlet rowSpan = 1;\n\t\t\t\t\t\tif (typeof rows.rowSpan === 'number' && rows.rowSpan > 1) {\n\t\t\t\t\t\t\trowSpan = rows.rowSpan;\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowSpans[index].push(rowSpan);\n\t\t\t\t\t\tif (typeof rows.colSpan === 'number' && rows.colSpan > 1) {\n\t\t\t\t\t\t\tfor (let k = 1; k < rows.colSpan; k++) {\n\t\t\t\t\t\t\t\trowSpans[index + k].push(rowSpan);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowCount[index]++;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t\tfor (let j = 0; j < maxCols; j++) {\n\t\t\t\tif (this.horizontal === true) {\n\t\t\t\t\tconst row = isFoot ? this.state._dataFoot[i - startRow] : data[i];\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[j] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[j] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[j].key === 'string' &&\n\t\t\t\t\t\ttypeof row === 'object' &&\n\t\t\t\t\t\trow !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[j],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: row,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: row[primaryHeader[j].key as unknown as string] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[i] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[i] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[i].key === 'string' &&\n\t\t\t\t\t\ttypeof data[j] === 'object' &&\n\t\t\t\t\t\tdata[j] !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[i],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: data[j],\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: data[j][primaryHeader[i].key as unknown as number] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\tdataField.push(dataRow);\n\t\t}\n\t\tif (data.length === 0) {\n\t\t\tlet colspan = 0;\n\t\t\tlet rowspan = 0;\n\t\t\tif (Array.isArray(headers.horizontal) && headers.horizontal.length > 0) {\n\t\t\t\theaders.horizontal[0].forEach((col) => {\n\t\t\t\t\tcolspan += col.colSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tif (Array.isArray(headers.vertical) && headers.vertical.length > 0) {\n\t\t\t\tcolspan -= headers.vertical.length;\n\t\t\t\theaders.vertical[0].forEach((row) => {\n\t\t\t\t\trowspan += row.rowSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tconst emptyCell = {\n\t\t\t\tcolSpan: colspan,\n\t\t\t\tlabel: translate('kol-no-entries'),\n\t\t\t\trender: undefined,\n\t\t\t\trowSpan: Math.max(rowspan, 1),\n\t\t\t};\n\t\t\tif (dataField.length === 0) {\n\t\t\t\tdataField.push([emptyCell]);\n\t\t\t} else {\n\t\t\t\tdataField[0].push(emptyCell);\n\t\t\t}\n\t\t}\n\t\treturn dataField;\n\t}\n\n\tprivate selectDisplayedData(data: KoliBriTableDataType[], pageSize: number, page: number): KoliBriTableDataType[] {\n\t\tif (typeof pageSize === 'number' && pageSize > 0 && typeof page === 'number' && page > 0) {\n\t\t\tthis.pageStartSlice = pageSize * (page - 1);\n\t\t\tthis.pageEndSlice = pageSize * page > data.length ? data.length : pageSize * page;\n\t\t\treturn data.slice(this.pageStartSlice, this.pageEndSlice);\n\t\t} else {\n\t\t\tthis.pageStartSlice = 0;\n\t\t\tthis.pageEndSlice = data.length;\n\t\t\treturn data;\n\t\t}\n\t}\n\n\tprivate cellRender(col: KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el?: HTMLElement): void {\n\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\tCELL_REFS.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\t\t\tconst html = col.render(\n\t\t\t\t\t\tel,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tasTd: col.asTd,\n\t\t\t\t\t\t\tlabel: col.label,\n\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t} as KoliBriTableHeaderCell,\n\t\t\t\t\t\tcol.data,\n\t\t\t\t\t\tthis.state._data\n\t\t\t\t\t);\n\t\t\t\t\tif (typeof html === 'string') {\n\t\t\t\t\t\tel.innerHTML = html;\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t}\n\n\tprivate updateSortedData = (cell: KoliBriTableSelectedHead = this.sortedColumnHead) => {\n\t\tlet sortedData: KoliBriTableDataType[] = this.state._data;\n\t\tif (typeof this.sortFunction === 'function') {\n\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]);\n\t\t\t\t\tthis.ariaLive = translate('kol-sort-ascending', { placeholders: { column: cell.label } });\n\t\t\t\t\tthis.sortedColumnHead = { label: cell.label, key: cell.key, sortDirection: 'ASC' };\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'DESC':\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]).reverse();\n\t\t\t\t\tthis.ariaLive = translate('kol-sort-descending', { placeholders: { column: cell.label } });\n\t\t\t\t\tthis.sortedColumnHead = { label: cell.label, key: cell.key, sortDirection: 'DESC' };\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'NOS':\n\t\t\t\tdefault:\n\t\t\t\t\tsortedData = [...this.state._data];\n\t\t\t\t\tthis.sortedColumnHead = { label: '', key: '', sortDirection: 'NOS' };\n\t\t\t\t\tthis.ariaLive = translate('kol-sort-none', { placeholders: { column: cell.label } });\n\t\t\t}\n\t\t}\n\t\tsetState(this, '_sortedData', sortedData);\n\t};\n\n\tprivate readonly renderTableRow = (row: KoliBriTableCell[], rowIndex: number): JSX.Element => {\n\t\treturn <tr key={`tbody-${rowIndex}`}>{row.map((col, colIndex) => this.renderTableCell(col, rowIndex, colIndex))}</tr>;\n\t};\n\tprivate readonly renderTableCell = (cell: KoliBriTableCell, rowIndex: number, colIndex: number): JSX.Element => {\n\t\tif (cell.asTd === false) {\n\t\t\tconst headerCell: KoliBriTableHeaderCell = cell;\n\t\t\tlet sortDirection = undefined;\n\t\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\t\t\tif (!this.disableSort && headerCell.key === this.sortedColumnHead.key) {\n\t\t\t\tswitch (this.sortedColumnHead.sortDirection) {\n\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\t\tsortDirection = 'ascending';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\t\tsortDirection = 'descending';\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<th // role=\"rowheader\"\n\t\t\t\t\tkey={`tbody-${rowIndex}-${colIndex}-${headerCell.label}`}\n\t\t\t\t\tscope={typeof headerCell.rowSpan === 'number' && headerCell.rowSpan > 1 ? 'rowgroup' : 'row'}\n\t\t\t\t\tcolSpan={headerCell.colSpan}\n\t\t\t\t\trowSpan={headerCell.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: headerCell.textAlign,\n\t\t\t\t\t\twidth: headerCell.width,\n\t\t\t\t\t}}\n\t\t\t\t\taria-sort={sortDirection}\n\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\t\t\tdata-sort={`sort-${this.sortDirections.get(headerCell.sort!) as string}`}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t[headerCell.textAlign as string]: typeof headerCell.textAlign === 'string' && headerCell.textAlign.length > 0,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinnerHTML={headerCell.label}\n\t\t\t\t\t\t\tstyle={{ textAlign: headerCell.textAlign }}\n\t\t\t\t\t\t></div>\n\t\t\t\t\t\t{!this.disableSort && typeof headerCell.sort === 'function' && (\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t_icons={sortButtonIcon}\n\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: headerCell.label } })}\n\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\tif (typeof headerCell.sort === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tthis.sortFunction = headerCell.sort;\n\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'DESC');\n\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'NOS');\n\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'ASC');\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tthis.updateSortedData(headerCell as KoliBriTableSelectedHead);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</th>\n\t\t\t);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\tkey={`tbody-${rowIndex}-${colIndex}-${cell.label}`}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[cell.textAlign as string]: typeof cell.textAlign === 'string' && cell.textAlign.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: cell.textAlign,\n\t\t\t\t\t\twidth: cell.width,\n\t\t\t\t\t}}\n\t\t\t\t\tref={\n\t\t\t\t\t\ttypeof cell.render === 'function'\n\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\tthis.cellRender(cell as KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el);\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tinnerHTML={typeof cell.render !== 'function' ? cell.label : ''}\n\t\t\t\t></td>\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly renderFoot = (): JSX.Element => {\n\t\tconst rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headers, true);\n\t\treturn <tfoot>{rows.map(this.renderTableRow)}</tfoot>;\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst displayedData: KoliBriTableDataType[] = this.selectDisplayedData(\n\t\t\tthis.state._sortedData,\n\t\t\tthis.showPagination ? this.state._pagination?._pageSize ?? 10 : this.state._sortedData.length,\n\t\t\tthis.state._pagination._page || 1\n\t\t);\n\t\tconst dataField = this.createDataField(displayedData, this.state._headers);\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<span style={{ height: '0', width: '0', overflow: 'hidden' }} aria-live=\"assertive\">\n\t\t\t\t\t{this.ariaLive}\n\t\t\t\t</span>\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && (\n\t\t\t\t\t<div class=\"pagination\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\tEinträge {this.pageEndSlice > 0 ? this.pageStartSlice + 1 : 0} bis {this.pageEndSlice} von{' '}\n\t\t\t\t\t\t\t{this.state._pagination._max || (Array.isArray(this.state._data) ? this.state._data.length : 0)} angezeigt\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<kol-pagination\n\t\t\t\t\t\t\t\t_boundaryCount={this.state._pagination._boundaryCount}\n\t\t\t\t\t\t\t\t_customClass={this.state._pagination._customClass}\n\t\t\t\t\t\t\t\t_on={this.handlePagination}\n\t\t\t\t\t\t\t\t_page={this.state._pagination._page}\n\t\t\t\t\t\t\t\t_pageSize={this.state._pagination._pageSize}\n\t\t\t\t\t\t\t\t_pageSizeOptions={this.state._pagination._pageSizeOptions || PAGINATION_OPTIONS}\n\t\t\t\t\t\t\t\t_siblingCount={this.state._pagination._siblingCount}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"bottom\"\n\t\t\t\t\t\t\t\t_max={this.state._pagination._max || this.state._pagination._max || this.state._data.length}\n\t\t\t\t\t\t\t\t_label={translate('kol-table-pagination-label', { placeholders: { label: this.state._label } })}\n\t\t\t\t\t\t\t></kol-pagination>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div class=\"table\" tabindex=\"0\">\n\t\t\t\t\t<table\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tminWidth: this.state._minWidth,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<caption>{this.state._label}</caption>\n\t\t\t\t\t\t{Array.isArray(this.state._headers.horizontal) && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t{this.state._headers.horizontal.map((cols, rowIndex) => (\n\t\t\t\t\t\t\t\t\t<tr key={`thead-${rowIndex}`}>\n\t\t\t\t\t\t\t\t\t\t{cols.map((col, colIndex) => {\n\t\t\t\t\t\t\t\t\t\t\tif (col.asTd === true) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tref={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttypeof col.render === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.cellRender(col as KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={typeof col.render !== 'function' ? col.label : ''}\n\t\t\t\t\t\t\t\t\t\t\t\t\t></td>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\tconst headerCell: KoliBriTableHeaderCell = col;\n\t\t\t\t\t\t\t\t\t\t\t\tlet sortDirection = undefined;\n\t\t\t\t\t\t\t\t\t\t\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\t\t\t\t\t\t\t\t\t\t\t\tif (headerCell.key === this.sortedColumnHead.key) {\n\t\t\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortedColumnHead.sortDirection) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortDirection = 'ascending';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortDirection = 'descending';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<th // role=\"columnheader\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${headerCell.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscope={typeof headerCell.colSpan === 'number' && headerCell.colSpan > 1 ? 'colgroup' : 'col'}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={headerCell.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={headerCell.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\taria-sort={sortDirection}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-sort={sortDirection ? `sort-${this.sortedColumnHead.sortDirection}` : 'sort-NOS'}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={col.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{!this.disableSort && typeof headerCell.sort === 'function' && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_icons={sortButtonIcon}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (typeof headerCell.sort === 'function') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.sortFunction = headerCell.sort;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'DESC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'NOS');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'ASC');\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.updateSortedData(headerCell as KoliBriTableSelectedHead);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</thead>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<tbody>{dataField.map(this.renderTableRow)}</tbody>\n\t\t\t\t\t\t{this.state._dataFoot.length > 0 ? this.renderFoot() : ''}\n\t\t\t\t\t</table>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"names":["defaultStyleCss","PAGINATION_OPTIONS","CELL_REFS","Map","KolTable","this","horizontal","sortDirections","sortData","showPagination","pageStartSlice","pageEndSlice","disableSort","sortedColumnHead","label","key","sortDirection","ariaLive","setSortDirection","sort","direction","clear","set","sortFunction","handlePagination","onClick","event","page","_a","state","_pagination","_on","setState","Object","assign","_page","onChangePage","onChangePageSize","pageSize","_pageSize","beforePatchPagination","nextValue","_nextState","_component","updateSortedData","cell","_data","sortedData","length","a","b","index","data","result","compareFn","translate","placeholders","column","multi","sortText","get","reverse","renderTableRow","row","rowIndex","h","map","col","colIndex","renderTableCell","asTd","headerCell","undefined","shortSortDirection","sortButtonIcon","find","value","scope","rowSpan","colSpan","style","textAlign","width","class","exportparts","_icons","_hideLabel","_label","colLabel","changeCellSort","_variant","ref","render","el","cellRender","renderFoot","rows","createDataField","_dataFoot","_headers","_allowMultiSort","vertical","_max","_sortedData","validateAllowMultiSort","watchValidator","Set","defaultValue","validateData","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","Array","isArray","dataTupel","afterPatch","setTimeout","validateDataFoot","findIndex","settings","splice","push","validateHeaders","hooks","beforePatch","applySort","headers","hasSortedCells","forEach","_b","_c","_d","devHint","validateLabel","validateMinWidth","watchString","validatePagination","componentWillLoad","_minWidth","getNumberOfCols","horizontalHeaders","max","count","getNumberOfRows","verticalHeaders","filterHeaderKeys","primaryHeader","cells","getPrimaryHeader","isFoot","maxCols","maxRows","startRow","dataField","rowCount","rowSpans","_row","i","dataRow","headerCells","rowsTotal","k","j","colspan","rowspan","emptyCell","Math","selectDisplayedData","slice","clearTimeout","html","textContent","displayedData","Host","height","overflow","_boundaryCount","_customClass","_pageSizeOptions","_siblingCount","_tooltipAlign","tabindex","minWidth","cols"],"sources":["src/components/table/style.css?tag=kol-table&mode=default&encapsulation=shadow","src/components/table/component.tsx"],"sourcesContent":["@import url(../style.css);\n@import url(../host-display-block.css);\n@layer kol-component {\n\t:host {\n\t\tdisplay: grid;\n\t}\n\n\t:host > div.table {\n\t\tmax-width: 100%;\n\t\torder: 1;\n\t\toverflow-x: auto;\n\t\toverflow-y: hidden;\n\t}\n\n\t:host > div.table table {\n\t\twidth: 100%;\n\t}\n\n\tth > div {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\t\tplace-items: center;\n\t}\n\n\tdiv.pagination {\n\t\torder: 2;\n\t}\n\n\tdiv.pagination,\n\tdiv.pagination > div:last-child {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t@media (min-width: 1024px) {\n\t\tdiv.pagination,\n\t\tdiv.pagination > div:last-child {\n\t\t\tgrid-auto-flow: column;\n\t\t}\n\n\t\tdiv.pagination kol-pagination {\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n","/* eslint-disable jsx-a11y/no-noninteractive-tabindex */\nimport { Generic } from '@a11y-ui/core';\nimport { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { Stringified } from '../../types/common';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { devHint } from '../../utils/a11y.tipps';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, setState, watchString, watchValidator } from '../../utils/prop.validators';\nimport { KoliBriPaginationButtonCallbacks } from '../pagination/types';\nimport {\n\tAPI,\n\tKoliBriDataCompareFn,\n\tKoliBriSortDirection,\n\tKoliBriSortFunction,\n\tKoliBriTableCell,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaderCellAndData,\n\tKoliBriTableHeaders,\n\tKoliBriTablePaginationProps,\n\tKoliBriTableRender,\n\tKoliBriTableSelectedHead,\n\tStates,\n} from './types';\n\nconst PAGINATION_OPTIONS = [10, 20, 50, 100];\n\nconst CELL_REFS = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\ntype SortData = {\n\tlabel: string;\n\tkey: string;\n\tcompareFn: KoliBriDataCompareFn;\n\tdirection: KoliBriSortDirection;\n};\n\n@Component({\n\ttag: 'kol-table',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolTable implements API {\n\tprivate horizontal = true;\n\t/**\n\t * @deprecated only for backward compatibility\n\t */\n\tprivate sortFunction?: KoliBriSortFunction;\n\t/**\n\t * @deprecated only for backward compatibility\n\t */\n\tprivate sortDirections: Map<KoliBriSortFunction, KoliBriSortDirection> = new Map();\n\tprivate sortData: SortData[] = [];\n\tprivate showPagination = false;\n\tprivate pageStartSlice = 0;\n\tprivate pageEndSlice = 10;\n\tprivate disableSort = false;\n\n\t/**\n\t * @deprecated only for backward compatibility\n\t */\n\tprivate sortedColumnHead: KoliBriTableSelectedHead = { label: '', key: '', sortDirection: 'NOS' };\n\tprivate ariaLive = '';\n\n\t/**\n\t * Defines whether to allow multi sort.\n\t */\n\t@Prop() public _allowMultiSort?: boolean;\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: Stringified<KoliBriTableDataType[]>;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headers!: Stringified<KoliBriTableHeaders>;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: string;\n\n\t/**\n\t * Defines the table min-width.\n\t */\n\t@Prop() public _minWidth?: string;\n\n\t/**\n\t * Defines whether to show the data distributed over multiple pages.\n\t */\n\t@Prop() public _pagination?: boolean | Stringified<KoliBriTablePaginationProps>;\n\n\t@State() public state: States = {\n\t\t_allowMultiSort: false,\n\t\t_label: '…', // ⚠ required\n\t\t_data: [],\n\t\t_dataFoot: [],\n\t\t_headers: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t\t_pagination: {\n\t\t\t_page: 1,\n\t\t\t_pageSize: 10,\n\t\t\t_max: 0,\n\t\t},\n\t\t_sortedData: [],\n\t};\n\n\t@Watch('_allowMultiSort')\n\tpublic validateAllowMultiSort(value?: boolean): void {\n\t\twatchValidator(this, '_allowMultiSort', () => true, new Set(['boolean']), value, {\n\t\t\tdefaultValue: false,\n\t\t});\n\t}\n\n\t@Watch('_data')\n\tpublic validateData(value?: Stringified<KoliBriTableDataType[]>): void {\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\tif (typeof value === 'undefined') {\n\t\t\t\t\tvalue = [];\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableDataType[]>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\tif (Array.isArray(value) && value.find((dataTupel: KoliBriTableDataType) => !(typeof dataTupel === 'object' && dataTupel !== null)) === undefined) {\n\t\t\t\t\tsetState(this, '_data', value, {\n\t\t\t\t\t\tafterPatch: () => {\n\t\t\t\t\t\t\t// TODO: kein guter Hack (endless loop)\n\t\t\t\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: Stringified<KoliBriTableDataType[]>): void {\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\tif (typeof value === 'undefined') {\n\t\t\t\t\tvalue = [];\n\t\t\t\t}\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableDataType[]>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\tif (Array.isArray(value) && value.find((dataTupel: KoliBriTableDataType) => !(typeof dataTupel === 'object' && dataTupel !== null)) === undefined) {\n\t\t\t\t\tsetState(this, '_dataFoot', value, {\n\t\t\t\t\t\tafterPatch: () => {\n\t\t\t\t\t\t\tsetTimeout(this.updateSortedData);\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * @deprecated only for backward compatibility\n\t */\n\tprivate setSortDirection = (sort: KoliBriSortFunction, direction: KoliBriSortDirection) => {\n\t\t/**\n\t\t * Durch des Clearen, ist es nicht möglich eine Mehr-Spalten-Sortierung\n\t\t * darzustellen. Das wäre der Fall, wenn man ggf. Daten in außerhalb der\n\t\t * Komponente sortiert und diese sortiert von außen rein gibt und der\n\t\t * Sortierungsalgorithmus mehrere Spalten zusammen sortierte.\n\t\t *\n\t\t * Beachte auch col.sort !== this.sortFunction\n\t\t */\n\t\tthis.sortDirections.clear();\n\t\tthis.sortDirections.set(sort, direction);\n\t\tthis.sortFunction = sort;\n\t};\n\n\tprivate changeCellSort(headerCell: KoliBriTableHeaderCell) {\n\t\tif (typeof headerCell.compareFn === 'function') {\n\t\t\tif (!this.state._allowMultiSort && headerCell.key != this.sortData[0]?.key) {\n\t\t\t\t// clear when another column is sorted and multi sort is not allowed\n\t\t\t\tthis.sortData = [];\n\t\t\t}\n\n\t\t\tconst index = this.sortData.findIndex((value) => value.key === headerCell.key);\n\t\t\tif (index >= 0) {\n\t\t\t\tconst settings = this.sortData[index];\n\t\t\t\tswitch (settings.direction) {\n\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\tsettings.direction = 'DESC';\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\tthis.sortData.splice(index, 1);\n\t\t\t\t\t\tbreak;\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tsettings.direction = 'ASC';\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t} else if (headerCell.key) {\n\t\t\t\tthis.sortData.push({\n\t\t\t\t\tlabel: headerCell.label,\n\t\t\t\t\tkey: headerCell.key,\n\t\t\t\t\tcompareFn: headerCell.compareFn,\n\t\t\t\t\tdirection: 'ASC',\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tthis.updateSortedData(headerCell as KoliBriTableSelectedHead);\n\t\t} else if (typeof headerCell.sort === 'function') {\n\t\t\tthis.sortFunction = headerCell.sort;\n\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'DESC');\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'DESC':\n\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'NOS');\n\t\t\t\t\tbreak;\n\t\t\t\tdefault:\n\t\t\t\t\tthis.setSortDirection(this.sortFunction, 'ASC');\n\t\t\t}\n\t\t\tthis.updateSortedData(headerCell as KoliBriTableSelectedHead);\n\t\t}\n\t}\n\n\t@Watch('_headers')\n\tpublic validateHeaders(value?: Stringified<KoliBriTableHeaders>): void {\n\t\t/**\n\t\t * - es darf maximal ein Header als primary markiert werden (last win)\n\t\t * - der primary-Header entscheidet implizit über _order und _orientation\n\t\t *   - primary-Headers müssen das key-Property setzen\n\t\t *   - nicht primary-Headers müssen das key-Property nicht setzen (wird ignoriert)\n\t\t *   - _order: wird durch den primary-Header geregelt\n\t\t *   - _orientation: wird durch den primary-Header geregelt\n\t\t * - sobald ein Header sortierbar ist, darf es nur noch entweder horizontale\n\t\t *   oder vertikale Header geben, aber nicht mehr beides\n\t\t */\n\t\temptyStringByArrayHandler(value, () => {\n\t\t\tobjectObjectHandler(value, () => {\n\t\t\t\ttry {\n\t\t\t\t\tvalue = parseJson<KoliBriTableHeaders>(value);\n\t\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t\t} catch (e) {\n\t\t\t\t\t// value behält den ursprünglichen Wert\n\t\t\t\t}\n\t\t\t\twatchValidator(this, '_headers', (value): boolean => typeof value === 'object' && value !== null, new Set(['KoliBriTableHeaders']), value, {\n\t\t\t\t\thooks: {\n\t\t\t\t\t\tbeforePatch: (nextValue: unknown) => {\n\t\t\t\t\t\t\tconst applySort = (headers: KoliBriTableHeaderCell[]) => {\n\t\t\t\t\t\t\t\tlet hasSortedCells = false;\n\t\t\t\t\t\t\t\theaders.forEach((cell) => {\n\t\t\t\t\t\t\t\t\tconst key = cell.key;\n\t\t\t\t\t\t\t\t\tif (!key) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst sortDirection = cell.sortDirection;\n\t\t\t\t\t\t\t\t\tif (sortDirection === 'ASC' || sortDirection === 'DESC') {\n\t\t\t\t\t\t\t\t\t\tif (typeof cell.compareFn === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tif (this.state._allowMultiSort || this.sortData.length === 0) {\n\t\t\t\t\t\t\t\t\t\t\t\tthis.sortData.push({ label: cell.label, key, compareFn: cell.compareFn, direction: sortDirection });\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\thasSortedCells = true;\n\t\t\t\t\t\t\t\t\t\t} else if (typeof cell.sort === 'function') {\n\t\t\t\t\t\t\t\t\t\t\tthis.setSortDirection(cell.sort, sortDirection);\n\t\t\t\t\t\t\t\t\t\t\tsetTimeout(() => this.updateSortedData({ key, label: cell.label, sortDirection }));\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\tif (hasSortedCells) {\n\t\t\t\t\t\t\t\t\tsetTimeout(() => this.updateSortedData());\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\tconst headers: KoliBriTableHeaders = nextValue as KoliBriTableHeaders;\n\t\t\t\t\t\t\theaders.horizontal?.forEach(applySort);\n\t\t\t\t\t\t\theaders.vertical?.forEach(applySort);\n\n\t\t\t\t\t\t\tif (headers.horizontal && headers.vertical && headers.horizontal?.length > 0 && headers.vertical?.length > 0) {\n\t\t\t\t\t\t\t\tthis.disableSort = true;\n\t\t\t\t\t\t\t\tdevHint(\n\t\t\t\t\t\t\t\t\t`Table: You can not sort the table data, if horizontal and vertical headers are defined at the same time. (https://github.com/public-ui/kolibri/issues/2372)`\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_minWidth')\n\tpublic validateMinWidth(value?: string): void {\n\t\twatchString(this, '_minWidth', value, {\n\t\t\tdefaultValue: undefined,\n\t\t});\n\t}\n\n\tprivate readonly handlePagination: KoliBriPaginationButtonCallbacks = {\n\t\tonClick: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onClick === 'function') {\n\t\t\t\tthis.state._pagination._on.onClick(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePage: (event: Event, page: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePage === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePage(event, page);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_page: page,\n\t\t\t});\n\t\t},\n\t\tonChangePageSize: (event: Event, pageSize: number) => {\n\t\t\tif (typeof this.state._pagination._on?.onChangePageSize === 'function') {\n\t\t\t\tthis.state._pagination._on.onChangePageSize(event, pageSize);\n\t\t\t}\n\t\t\tsetState(this, '_pagination', {\n\t\t\t\t...this.state._pagination,\n\t\t\t\t_pageSize: pageSize,\n\t\t\t});\n\t\t\tsetState(this, '_pageSize', pageSize);\n\t\t},\n\t};\n\n\tprivate readonly beforePatchPagination: Generic.Element.NextStateHooksCallback = (nextValue, _nextState, _component, key): void => {\n\t\tif (key === '_pagination') {\n\t\t\tthis.showPagination = nextValue === true || nextValue === '' /* true */ || (typeof nextValue === 'object' && nextValue !== null);\n\t\t}\n\t};\n\n\t@Watch('_pagination')\n\tpublic validatePagination(value?: boolean | Stringified<KoliBriTablePaginationProps>): void {\n\t\ttry {\n\t\t\tvalue = parseJson<KoliBriTablePaginationProps>(value);\n\t\t\t// eslint-disable-next-line no-empty\n\t\t} catch (e) {\n\t\t\t// value behält den ursprünglichen Wert\n\t\t}\n\t\twatchValidator(this, '_pagination', () => true, new Set(['boolean', 'KoliBriTablePagination']), value, {\n\t\t\thooks: {\n\t\t\t\tbeforePatch: this.beforePatchPagination,\n\t\t\t},\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateAllowMultiSort(this._allowMultiSort);\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaders(this._headers);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validatePagination(this._pagination);\n\t}\n\n\tprivate getNumberOfCols(horizontalHeaders: KoliBriTableHeaderCell[][], data: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\thorizontalHeaders.forEach((row) => {\n\t\t\tlet count = 0;\n\t\t\trow.forEach((col) => (count += col.colSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate getNumberOfRows(verticalHeaders: KoliBriTableHeaderCell[][], data: KoliBriTableDataType[]): number {\n\t\tlet max = 0;\n\t\tverticalHeaders.forEach((col) => {\n\t\t\tlet count = 0;\n\t\t\tcol.forEach((row) => (count += row.rowSpan ?? 1));\n\t\t\tif (max < count) {\n\t\t\t\tmax = count;\n\t\t\t}\n\t\t});\n\t\tif (max === 0) {\n\t\t\tmax = data.length;\n\t\t} else {\n\t\t\tmax -= this.state._dataFoot.length;\n\t\t}\n\t\treturn max;\n\t}\n\n\tprivate filterHeaderKeys(headers: KoliBriTableHeaderCell[][]): KoliBriTableHeaderCell[] {\n\t\tconst primaryHeader: KoliBriTableHeaderCell[] = [];\n\t\theaders.forEach((cells) => {\n\t\t\tcells.forEach((cell) => {\n\t\t\t\tif (typeof cell.key === 'string') {\n\t\t\t\t\tprimaryHeader.push(cell);\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\t\treturn primaryHeader;\n\t}\n\n\tprivate getPrimaryHeader(headers: KoliBriTableHeaders): KoliBriTableHeaderCell[] {\n\t\tlet primaryHeader: KoliBriTableHeaderCell[] = this.filterHeaderKeys(headers.horizontal ?? []);\n\t\tthis.horizontal = true;\n\t\tif (primaryHeader.length === 0) {\n\t\t\tprimaryHeader = this.filterHeaderKeys(headers.vertical ?? []);\n\t\t\tif (primaryHeader.length > 0) {\n\t\t\t\tthis.horizontal = false;\n\t\t\t}\n\t\t}\n\t\treturn primaryHeader;\n\t}\n\n\tprivate createDataField(data: KoliBriTableDataType[], headers: KoliBriTableHeaders, isFoot?: boolean): KoliBriTableCell[][] {\n\t\theaders.horizontal = Array.isArray(headers?.horizontal) ? headers.horizontal : [];\n\t\theaders.vertical = Array.isArray(headers?.vertical) ? headers.vertical : [];\n\t\tconst primaryHeader = this.getPrimaryHeader(headers);\n\t\tconst maxCols = this.getNumberOfCols(headers.horizontal, data);\n\t\tlet maxRows = this.getNumberOfRows(headers.vertical, data);\n\t\tlet startRow = 0;\n\t\tif (isFoot) {\n\t\t\tstartRow = maxRows;\n\t\t\tmaxRows += this.state._dataFoot.length;\n\t\t}\n\t\tconst dataField: KoliBriTableCell[][] = [];\n\n\t\tconst rowCount: number[] = [];\n\t\tconst rowSpans: number[][] = [];\n\t\theaders.vertical.forEach((_row, index) => {\n\t\t\trowCount[index] = 0;\n\t\t\trowSpans[index] = [];\n\t\t});\n\n\t\tfor (let i = startRow; i < maxRows; i++) {\n\t\t\tconst dataRow: KoliBriTableHeaderCellAndData[] = [];\n\t\t\theaders.vertical.forEach((headerCells, index) => {\n\t\t\t\tlet rowsTotal = 0;\n\t\t\t\trowSpans[index].forEach((value) => (rowsTotal += value));\n\t\t\t\tif (rowsTotal <= i) {\n\t\t\t\t\tconst rows = headerCells[i - rowsTotal + rowCount[index]];\n\t\t\t\t\tif (typeof rows === 'object') {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...rows,\n\t\t\t\t\t\t\tasTd: false,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: {} as KoliBriTableDataType,\n\t\t\t\t\t\t});\n\t\t\t\t\t\tlet rowSpan = 1;\n\t\t\t\t\t\tif (typeof rows.rowSpan === 'number' && rows.rowSpan > 1) {\n\t\t\t\t\t\t\trowSpan = rows.rowSpan;\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowSpans[index].push(rowSpan);\n\t\t\t\t\t\tif (typeof rows.colSpan === 'number' && rows.colSpan > 1) {\n\t\t\t\t\t\t\tfor (let k = 1; k < rows.colSpan; k++) {\n\t\t\t\t\t\t\t\trowSpans[index + k].push(rowSpan);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\trowCount[index]++;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t\tfor (let j = 0; j < maxCols; j++) {\n\t\t\t\tif (this.horizontal === true) {\n\t\t\t\t\tconst row = isFoot ? this.state._dataFoot[i - startRow] : data[i];\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[j] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[j] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[j].key === 'string' &&\n\t\t\t\t\t\ttypeof row === 'object' &&\n\t\t\t\t\t\trow !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[j],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: row,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: row[primaryHeader[j].key as unknown as string] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tif (\n\t\t\t\t\t\ttypeof primaryHeader[i] === 'object' &&\n\t\t\t\t\t\tprimaryHeader[i] !== null &&\n\t\t\t\t\t\ttypeof primaryHeader[i].key === 'string' &&\n\t\t\t\t\t\ttypeof data[j] === 'object' &&\n\t\t\t\t\t\tdata[j] !== null\n\t\t\t\t\t) {\n\t\t\t\t\t\tdataRow.push({\n\t\t\t\t\t\t\t...primaryHeader[i],\n\t\t\t\t\t\t\tcolSpan: undefined,\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\t\t\t\tdata: data[j],\n\t\t\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n\t\t\t\t\t\t\tlabel: data[j][primaryHeader[i].key as unknown as number] as string,\n\t\t\t\t\t\t\trowSpan: undefined,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\tdataField.push(dataRow);\n\t\t}\n\t\tif (data.length === 0) {\n\t\t\tlet colspan = 0;\n\t\t\tlet rowspan = 0;\n\t\t\tif (Array.isArray(headers.horizontal) && headers.horizontal.length > 0) {\n\t\t\t\theaders.horizontal[0].forEach((col) => {\n\t\t\t\t\tcolspan += col.colSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tif (Array.isArray(headers.vertical) && headers.vertical.length > 0) {\n\t\t\t\tcolspan -= headers.vertical.length;\n\t\t\t\theaders.vertical[0].forEach((row) => {\n\t\t\t\t\trowspan += row.rowSpan || 1;\n\t\t\t\t});\n\t\t\t}\n\t\t\tconst emptyCell = {\n\t\t\t\tcolSpan: colspan,\n\t\t\t\tlabel: translate('kol-no-entries'),\n\t\t\t\trender: undefined,\n\t\t\t\trowSpan: Math.max(rowspan, 1),\n\t\t\t};\n\t\t\tif (dataField.length === 0) {\n\t\t\t\tdataField.push([emptyCell]);\n\t\t\t} else {\n\t\t\t\tdataField[0].push(emptyCell);\n\t\t\t}\n\t\t}\n\t\treturn dataField;\n\t}\n\n\tprivate selectDisplayedData(data: KoliBriTableDataType[], pageSize: number, page: number): KoliBriTableDataType[] {\n\t\tif (typeof pageSize === 'number' && pageSize > 0 && typeof page === 'number' && page > 0) {\n\t\t\tthis.pageStartSlice = pageSize * (page - 1);\n\t\t\tthis.pageEndSlice = pageSize * page > data.length ? data.length : pageSize * page;\n\t\t\treturn data.slice(this.pageStartSlice, this.pageEndSlice);\n\t\t} else {\n\t\t\tthis.pageStartSlice = 0;\n\t\t\tthis.pageEndSlice = data.length;\n\t\t\treturn data;\n\t\t}\n\t}\n\n\tprivate cellRender(col: KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el?: HTMLElement): void {\n\t\tif (el /* SSR instanceof HTMLElement */) {\n\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\tCELL_REFS.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tclearTimeout(CELL_REFS.get(el));\n\t\t\t\t\tconst html = col.render(\n\t\t\t\t\t\tel,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tasTd: col.asTd,\n\t\t\t\t\t\t\tlabel: col.label,\n\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t} as KoliBriTableHeaderCell,\n\t\t\t\t\t\tcol.data,\n\t\t\t\t\t\tthis.state._data\n\t\t\t\t\t);\n\t\t\t\t\tif (typeof html === 'string') {\n\t\t\t\t\t\tel.textContent = html;\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t}\n\n\t/**\n\t *\n\t * @param cell only used for old single sort. Can be removed when sort is removed.\n\t */\n\tprivate updateSortedData = (cell: KoliBriTableSelectedHead = this.sortedColumnHead) => {\n\t\tif (this.disableSort) {\n\t\t\tsetState(this, '_sortedData', this.state._data);\n\t\t\treturn;\n\t\t}\n\n\t\tlet sortedData: KoliBriTableDataType[] = this.state._data;\n\t\tif (this.sortData.length > 0) {\n\t\t\tsortedData = this.state._data.sort((a: KoliBriTableDataType, b: KoliBriTableDataType) => {\n\t\t\t\tfor (let index = 0; index < this.sortData.length; index++) {\n\t\t\t\t\tconst data = this.sortData[index];\n\t\t\t\t\tconst result = data.compareFn(a, b);\n\t\t\t\t\tif (result !== 0) {\n\t\t\t\t\t\treturn data.direction === 'ASC' ? result : -result;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn 0;\n\t\t\t});\n\n\t\t\tif (this.sortData.length === 1) {\n\t\t\t\tthis.ariaLive = translate(`kol-sort-${this.sortData[0].direction === 'ASC' ? 'ascending' : 'descending'}`, {\n\t\t\t\t\tplaceholders: { column: this.sortData[0].label, multi: '' },\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tlet sortText = '';\n\t\t\t\tfor (let index = 1; index < this.sortData.length - 1; index++) {\n\t\t\t\t\tconst data = this.sortData[index];\n\t\t\t\t\tsortText += translate(`kol-sort-then-${data.direction === 'ASC' ? 'ascending' : 'descending'}`, { placeholders: { column: data.label } });\n\t\t\t\t}\n\t\t\t\tsortText += translate(`kol-sort-then-last-${this.sortData[this.sortData.length - 1].direction === 'ASC' ? 'ascending' : 'descending'}`, {\n\t\t\t\t\tplaceholders: { column: this.sortData[this.sortData.length - 1].label },\n\t\t\t\t});\n\t\t\t\tthis.ariaLive = translate(`kol-sort-${this.sortData[0].direction === 'ASC' ? 'ascending' : 'descending'}`, {\n\t\t\t\t\tplaceholders: { column: this.sortData[0].label, multi: sortText },\n\t\t\t\t});\n\t\t\t}\n\t\t} else if (typeof this.sortFunction === 'function') {\n\t\t\tswitch (this.sortDirections.get(this.sortFunction)) {\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]);\n\t\t\t\t\tthis.ariaLive = translate('kol-sort-ascending', { placeholders: { column: cell.label } });\n\t\t\t\t\tthis.sortedColumnHead = { label: cell.label, key: cell.key, sortDirection: 'ASC' };\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'DESC':\n\t\t\t\t\tsortedData = this.sortFunction([...this.state._data]).reverse();\n\t\t\t\t\tthis.ariaLive = translate('kol-sort-descending', { placeholders: { column: cell.label } });\n\t\t\t\t\tthis.sortedColumnHead = { label: cell.label, key: cell.key, sortDirection: 'DESC' };\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'NOS':\n\t\t\t\tdefault:\n\t\t\t\t\tsortedData = [...this.state._data];\n\t\t\t\t\tthis.sortedColumnHead = { label: '', key: '', sortDirection: 'NOS' };\n\t\t\t\t\tthis.ariaLive = translate('kol-sort-none', { placeholders: { column: cell.label } });\n\t\t\t}\n\t\t} else {\n\t\t\tthis.ariaLive = translate('kol-table-sort-none');\n\t\t}\n\t\tsetState(this, '_sortedData', sortedData);\n\t};\n\n\tprivate readonly renderTableRow = (row: KoliBriTableCell[], rowIndex: number): JSX.Element => {\n\t\treturn <tr key={`tbody-${rowIndex}`}>{row.map((col, colIndex) => this.renderTableCell(col, rowIndex, colIndex))}</tr>;\n\t};\n\tprivate readonly renderTableCell = (cell: KoliBriTableCell, rowIndex: number, colIndex: number): JSX.Element => {\n\t\tif (cell.asTd === false) {\n\t\t\tconst headerCell: KoliBriTableHeaderCell = cell;\n\t\t\tlet sortDirection = undefined;\n\t\t\tlet shortSortDirection: KoliBriSortDirection = 'NOS';\n\t\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\t\t\tif (!this.disableSort) {\n\t\t\t\tif (headerCell.key) {\n\t\t\t\t\tconst data = this.sortData.find((value) => value.key === headerCell.key);\n\t\t\t\t\tif (data) {\n\t\t\t\t\t\tshortSortDirection = data.direction;\n\t\t\t\t\t\tswitch (data.direction) {\n\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\t\t\t\tsortDirection = 'ascending';\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\t\t\t\tsortDirection = 'descending';\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tif (headerCell.key === this.sortedColumnHead.key) {\n\t\t\t\t\tshortSortDirection = this.sortedColumnHead.sortDirection;\n\t\t\t\t\tswitch (this.sortedColumnHead.sortDirection) {\n\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\t\t\tsortDirection = 'ascending';\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\t\t\tsortDirection = 'descending';\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<th // role=\"rowheader\"\n\t\t\t\t\tkey={`tbody-${rowIndex}-${colIndex}-${headerCell.label}`}\n\t\t\t\t\tscope={typeof headerCell.rowSpan === 'number' && headerCell.rowSpan > 1 ? 'rowgroup' : 'row'}\n\t\t\t\t\tcolSpan={headerCell.colSpan}\n\t\t\t\t\trowSpan={headerCell.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: headerCell.textAlign,\n\t\t\t\t\t\twidth: headerCell.width,\n\t\t\t\t\t}}\n\t\t\t\t\taria-sort={sortDirection}\n\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\t\t\tdata-sort={`sort-${shortSortDirection}`}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t[headerCell.textAlign as string]: typeof headerCell.textAlign === 'string' && headerCell.textAlign.length > 0,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tstyle={{ textAlign: headerCell.textAlign }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{headerCell.label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{!this.disableSort && (typeof headerCell.compareFn === 'function' || typeof headerCell.sort === 'function') && (\n\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t_icons={sortButtonIcon}\n\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: headerCell.label } })}\n\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\tonClick: () => this.changeCellSort(headerCell),\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</th>\n\t\t\t);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\tkey={`tbody-${rowIndex}-${colIndex}-${cell.label}`}\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t[cell.textAlign as string]: typeof cell.textAlign === 'string' && cell.textAlign.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttextAlign: cell.textAlign,\n\t\t\t\t\t\twidth: cell.width,\n\t\t\t\t\t}}\n\t\t\t\t\tref={\n\t\t\t\t\t\ttypeof cell.render === 'function'\n\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\tthis.cellRender(cell as KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el);\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{typeof cell.render !== 'function' ? cell.label : ''}\n\t\t\t\t</td>\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly renderFoot = (): JSX.Element => {\n\t\tconst rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headers, true);\n\t\treturn <tfoot>{rows.map(this.renderTableRow)}</tfoot>;\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst displayedData: KoliBriTableDataType[] = this.selectDisplayedData(\n\t\t\tthis.state._sortedData,\n\t\t\tthis.showPagination ? this.state._pagination?._pageSize ?? 10 : this.state._sortedData.length,\n\t\t\tthis.state._pagination._page || 1\n\t\t);\n\t\tconst dataField = this.createDataField(displayedData, this.state._headers);\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div style={{ height: '0', width: '0', overflow: 'hidden' }} aria-live=\"assertive\">\n\t\t\t\t\t{this.ariaLive}\n\t\t\t\t</div>\n\t\t\t\t{this.pageEndSlice > 0 && this.showPagination && (\n\t\t\t\t\t<div class=\"pagination\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\tEinträge {this.pageEndSlice > 0 ? this.pageStartSlice + 1 : 0} bis {this.pageEndSlice} von{' '}\n\t\t\t\t\t\t\t{this.state._pagination._max || (Array.isArray(this.state._data) ? this.state._data.length : 0)} angezeigt\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<kol-pagination\n\t\t\t\t\t\t\t\t_boundaryCount={this.state._pagination._boundaryCount}\n\t\t\t\t\t\t\t\t_customClass={this.state._pagination._customClass}\n\t\t\t\t\t\t\t\t_on={this.handlePagination}\n\t\t\t\t\t\t\t\t_page={this.state._pagination._page}\n\t\t\t\t\t\t\t\t_pageSize={this.state._pagination._pageSize}\n\t\t\t\t\t\t\t\t_pageSizeOptions={this.state._pagination._pageSizeOptions || PAGINATION_OPTIONS}\n\t\t\t\t\t\t\t\t_siblingCount={this.state._pagination._siblingCount}\n\t\t\t\t\t\t\t\t_tooltipAlign=\"bottom\"\n\t\t\t\t\t\t\t\t_max={this.state._pagination._max || this.state._pagination._max || this.state._data.length}\n\t\t\t\t\t\t\t\t_label={translate('kol-table-pagination-label', { placeholders: { label: this.state._label } })}\n\t\t\t\t\t\t\t></kol-pagination>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div class=\"table\" tabindex=\"0\">\n\t\t\t\t\t<table\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tminWidth: this.state._minWidth,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<caption>{this.state._label}</caption>\n\t\t\t\t\t\t{Array.isArray(this.state._headers.horizontal) && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t{this.state._headers.horizontal.map((cols, rowIndex) => (\n\t\t\t\t\t\t\t\t\t<tr key={`thead-${rowIndex}`}>\n\t\t\t\t\t\t\t\t\t\t{cols.map((col, colIndex) => {\n\t\t\t\t\t\t\t\t\t\t\tif (col.asTd === true) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<td // role=\"gridcell\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${col.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={col.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={col.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tref={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttypeof col.render === 'function'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? (el) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.cellRender(col as KoliBriTableHeaderCellAndData & { render: KoliBriTableRender }, el);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{typeof col.render !== 'function' ? col.label : ''}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\tconst headerCell: KoliBriTableHeaderCell = col;\n\t\t\t\t\t\t\t\t\t\t\t\tlet sortDirection = undefined;\n\t\t\t\t\t\t\t\t\t\t\t\tlet shortSortDirection: KoliBriSortDirection = 'NOS';\n\t\t\t\t\t\t\t\t\t\t\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\t\t\t\t\t\t\t\t\t\t\t\tif (headerCell.key) {\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst data = this.sortData.find((value) => value.key === headerCell.key);\n\t\t\t\t\t\t\t\t\t\t\t\t\tif (data) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tshortSortDirection = data.direction;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tswitch (data.direction) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortDirection = 'ascending';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortDirection = 'descending';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tif (headerCell.key === this.sortedColumnHead.key) {\n\t\t\t\t\t\t\t\t\t\t\t\t\tshortSortDirection = this.sortedColumnHead.sortDirection;\n\t\t\t\t\t\t\t\t\t\t\t\t\tswitch (this.sortedColumnHead.sortDirection) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'ASC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortDirection = 'ascending';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcase 'DESC':\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsortDirection = 'descending';\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<th // role=\"columnheader\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${headerCell.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tscope={typeof headerCell.colSpan === 'number' && headerCell.colSpan > 1 ? 'colgroup' : 'col'}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolSpan={headerCell.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={headerCell.rowSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: col.width,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\taria-sort={sortDirection}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-sort={`sort-${shortSortDirection}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"w-full flex gap-1 items-center\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'w-full': true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[col.textAlign as string]: typeof col.textAlign === 'string' && col.textAlign.length > 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: col.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{col.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{!this.disableSort && (typeof headerCell.compareFn === 'function' || typeof headerCell.sort === 'function') && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<kol-button\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_icons={sortButtonIcon}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_label={translate('kol-change-order', { placeholders: { colLabel: col.label } })}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick: () => this.changeCellSort(headerCell),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_variant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t></kol-button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</thead>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<tbody>{dataField.map(this.renderTableRow)}</tbody>\n\t\t\t\t\t\t{this.state._dataFoot.length > 0 ? this.renderFoot() : ''}\n\t\t\t\t\t</table>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":";;;+VAAA,MAAMA,EAAkB,q+GC0BxB,MAAMC,EAAqB,CAAC,GAAI,GAAI,GAAI,KAExC,MAAMC,EAAY,IAAIC,I,MAgBTC,EAAQ,M,yBACZC,KAAAC,WAAa,KAQbD,KAAAE,eAAiE,IAAIJ,IACrEE,KAAAG,SAAuB,GACvBH,KAAAI,eAAiB,MACjBJ,KAAAK,eAAiB,EACjBL,KAAAM,aAAe,GACfN,KAAAO,YAAc,MAKdP,KAAAQ,iBAA6C,CAAEC,MAAO,GAAIC,IAAK,GAAIC,cAAe,OAClFX,KAAAY,SAAW,GAiHXZ,KAAAa,iBAAmB,CAACC,EAA2BC,KAStDf,KAAKE,eAAec,QACpBhB,KAAKE,eAAee,IAAIH,EAAMC,GAC9Bf,KAAKkB,aAAeJ,CAAI,EA+HRd,KAAAmB,iBAAqD,CACrEC,QAAS,CAACC,EAAcC,K,MACvB,WAAWC,EAAAvB,KAAKwB,MAAMC,YAAYC,OAAG,MAAAH,SAAA,SAAAA,EAAEH,WAAY,WAAY,CAC9DpB,KAAKwB,MAAMC,YAAYC,IAAIN,QAAQC,EAAOC,E,CAE3CK,EAAS3B,KAAM,cAAa4B,OAAAC,OAAAD,OAAAC,OAAA,GACxB7B,KAAKwB,MAAMC,aAAW,CACzBK,MAAOR,IACN,EAEHS,aAAc,CAACV,EAAcC,K,MAC5B,WAAWC,EAAAvB,KAAKwB,MAAMC,YAAYC,OAAG,MAAAH,SAAA,SAAAA,EAAEQ,gBAAiB,WAAY,CACnE/B,KAAKwB,MAAMC,YAAYC,IAAIK,aAAaV,EAAOC,E,CAEhDK,EAAS3B,KAAM,cAAa4B,OAAAC,OAAAD,OAAAC,OAAA,GACxB7B,KAAKwB,MAAMC,aAAW,CACzBK,MAAOR,IACN,EAEHU,iBAAkB,CAACX,EAAcY,K,MAChC,WAAWV,EAAAvB,KAAKwB,MAAMC,YAAYC,OAAG,MAAAH,SAAA,SAAAA,EAAES,oBAAqB,WAAY,CACvEhC,KAAKwB,MAAMC,YAAYC,IAAIM,iBAAiBX,EAAOY,E,CAEpDN,EAAS3B,KAAM,cAAa4B,OAAAC,OAAAD,OAAAC,OAAA,GACxB7B,KAAKwB,MAAMC,aAAW,CACzBS,UAAWD,KAEZN,EAAS3B,KAAM,YAAaiC,EAAS,GAItBjC,KAAAmC,sBAAgE,CAACC,EAAWC,EAAYC,EAAY5B,KACpH,GAAIA,IAAQ,cAAe,CAC1BV,KAAKI,eAAiBgC,IAAc,MAAQA,IAAc,WAAyBA,IAAc,UAAYA,IAAc,I,GAsPrHpC,KAAAuC,iBAAmB,CAACC,EAAiCxC,KAAKQ,oBACjE,GAAIR,KAAKO,YAAa,CACrBoB,EAAS3B,KAAM,cAAeA,KAAKwB,MAAMiB,OACzC,M,CAGD,IAAIC,EAAqC1C,KAAKwB,MAAMiB,MACpD,GAAIzC,KAAKG,SAASwC,OAAS,EAAG,CAC7BD,EAAa1C,KAAKwB,MAAMiB,MAAM3B,MAAK,CAAC8B,EAAyBC,KAC5D,IAAK,IAAIC,EAAQ,EAAGA,EAAQ9C,KAAKG,SAASwC,OAAQG,IAAS,CAC1D,MAAMC,EAAO/C,KAAKG,SAAS2C,GAC3B,MAAME,EAASD,EAAKE,UAAUL,EAAGC,GACjC,GAAIG,IAAW,EAAG,CACjB,OAAOD,EAAKhC,YAAc,MAAQiC,GAAUA,C,EAG9C,OAAO,CAAC,IAGT,GAAIhD,KAAKG,SAASwC,SAAW,EAAG,CAC/B3C,KAAKY,SAAWsC,EAAU,YAAYlD,KAAKG,SAAS,GAAGY,YAAc,MAAQ,YAAc,eAAgB,CAC1GoC,aAAc,CAAEC,OAAQpD,KAAKG,SAAS,GAAGM,MAAO4C,MAAO,K,KAElD,CACN,IAAIC,EAAW,GACf,IAAK,IAAIR,EAAQ,EAAGA,EAAQ9C,KAAKG,SAASwC,OAAS,EAAGG,IAAS,CAC9D,MAAMC,EAAO/C,KAAKG,SAAS2C,GAC3BQ,GAAYJ,EAAU,iBAAiBH,EAAKhC,YAAc,MAAQ,YAAc,eAAgB,CAAEoC,aAAc,CAAEC,OAAQL,EAAKtC,Q,CAEhI6C,GAAYJ,EAAU,sBAAsBlD,KAAKG,SAASH,KAAKG,SAASwC,OAAS,GAAG5B,YAAc,MAAQ,YAAc,eAAgB,CACvIoC,aAAc,CAAEC,OAAQpD,KAAKG,SAASH,KAAKG,SAASwC,OAAS,GAAGlC,SAEjET,KAAKY,SAAWsC,EAAU,YAAYlD,KAAKG,SAAS,GAAGY,YAAc,MAAQ,YAAc,eAAgB,CAC1GoC,aAAc,CAAEC,OAAQpD,KAAKG,SAAS,GAAGM,MAAO4C,MAAOC,I,OAGnD,UAAWtD,KAAKkB,eAAiB,WAAY,CACnD,OAAQlB,KAAKE,eAAeqD,IAAIvD,KAAKkB,eACpC,IAAK,MACJwB,EAAa1C,KAAKkB,aAAa,IAAIlB,KAAKwB,MAAMiB,QAC9CzC,KAAKY,SAAWsC,EAAU,qBAAsB,CAAEC,aAAc,CAAEC,OAAQZ,EAAK/B,SAC/ET,KAAKQ,iBAAmB,CAAEC,MAAO+B,EAAK/B,MAAOC,IAAK8B,EAAK9B,IAAKC,cAAe,OAC3E,MACD,IAAK,OACJ+B,EAAa1C,KAAKkB,aAAa,IAAIlB,KAAKwB,MAAMiB,QAAQe,UACtDxD,KAAKY,SAAWsC,EAAU,sBAAuB,CAAEC,aAAc,CAAEC,OAAQZ,EAAK/B,SAChFT,KAAKQ,iBAAmB,CAAEC,MAAO+B,EAAK/B,MAAOC,IAAK8B,EAAK9B,IAAKC,cAAe,QAC3E,MACD,IAAK,MACL,QACC+B,EAAa,IAAI1C,KAAKwB,MAAMiB,OAC5BzC,KAAKQ,iBAAmB,CAAEC,MAAO,GAAIC,IAAK,GAAIC,cAAe,OAC7DX,KAAKY,SAAWsC,EAAU,gBAAiB,CAAEC,aAAc,CAAEC,OAAQZ,EAAK/B,S,KAEtE,CACNT,KAAKY,SAAWsC,EAAU,sB,CAE3BvB,EAAS3B,KAAM,cAAe0C,EAAW,EAGzB1C,KAAAyD,eAAiB,CAACC,EAAyBC,IACpDC,EAAA,MAAIlD,IAAK,SAASiD,KAAaD,EAAIG,KAAI,CAACC,EAAKC,IAAa/D,KAAKgE,gBAAgBF,EAAKH,EAAUI,MAErF/D,KAAAgE,gBAAkB,CAACxB,EAAwBmB,EAAkBI,KAC7E,GAAIvB,EAAKyB,OAAS,MAAO,CACxB,MAAMC,EAAqC1B,EAC3C,IAAI7B,EAAgBwD,UACpB,IAAIC,EAA2C,MAC/C,IAAIC,EAAiB,uBACrB,IAAKrE,KAAKO,YAAa,CACtB,GAAI2D,EAAWxD,IAAK,CACnB,MAAMqC,EAAO/C,KAAKG,SAASmE,MAAMC,GAAUA,EAAM7D,MAAQwD,EAAWxD,MACpE,GAAIqC,EAAM,CACTqB,EAAqBrB,EAAKhC,UAC1B,OAAQgC,EAAKhC,WACZ,IAAK,MACJsD,EAAiB,6BACjB1D,EAAgB,YAChB,MACD,IAAK,OACJ0D,EAAiB,+BACjB1D,EAAgB,aAChB,M,EAIJ,GAAIuD,EAAWxD,MAAQV,KAAKQ,iBAAiBE,IAAK,CACjD0D,EAAqBpE,KAAKQ,iBAAiBG,cAC3C,OAAQX,KAAKQ,iBAAiBG,eAC7B,IAAK,MACJ0D,EAAiB,6BACjB1D,EAAgB,YAChB,MACD,IAAK,OACJ0D,EAAiB,+BACjB1D,EAAgB,aAChB,M,EAIJ,OACCiD,EAAA,MACClD,IAAK,SAASiD,KAAYI,KAAYG,EAAWzD,QACjD+D,aAAcN,EAAWO,UAAY,UAAYP,EAAWO,QAAU,EAAI,WAAa,MACvFC,QAASR,EAAWQ,QACpBD,QAASP,EAAWO,QACpBE,MAAO,CACNC,UAAWV,EAAWU,UACtBC,MAAOX,EAAWW,OAClB,YACUlE,EAAa,YAEb,QAAQyD,KAEnBR,EAAA,OAAKkB,MAAM,kCACVlB,EAAA,OACCkB,MAAO,CACN,SAAU,KACV,CAACZ,EAAWU,kBAA6BV,EAAWU,YAAc,UAAYV,EAAWU,UAAUjC,OAAS,GAE7GgC,MAAO,CAAEC,UAAWV,EAAWU,YAE9BV,EAAWzD,QAEXT,KAAKO,qBAAuB2D,EAAWjB,YAAc,mBAAqBiB,EAAWpD,OAAS,aAC/F8C,EAAA,cACCmB,YAAY,OACZC,OAAQX,EACRY,WAAU,KACVC,OAAQhC,EAAU,mBAAoB,CAAEC,aAAc,CAAEgC,SAAUjB,EAAWzD,SAC7EiB,IAAK,CACJN,QAAS,IAAMpB,KAAKoF,eAAelB,IAEpCmB,SAAS,W,KAMR,CACN,OACCzB,EAAA,MACClD,IAAK,SAASiD,KAAYI,KAAYvB,EAAK/B,QAC3CqE,MAAO,CACN,CAACtC,EAAKoC,kBAA6BpC,EAAKoC,YAAc,UAAYpC,EAAKoC,UAAUjC,OAAS,GAE3F+B,QAASlC,EAAKkC,QACdD,QAASjC,EAAKiC,QACdE,MAAO,CACNC,UAAWpC,EAAKoC,UAChBC,MAAOrC,EAAKqC,OAEbS,WACQ9C,EAAK+C,SAAW,WACnBC,IACDxF,KAAKyF,WAAWjD,EAAwEgD,EAAG,EAE3FrB,kBAGI3B,EAAK+C,SAAW,WAAa/C,EAAK/B,MAAQ,G,GAMrCT,KAAA0F,WAAa,KAC7B,MAAMC,EAA6B3F,KAAK4F,gBAAgB5F,KAAKwB,MAAMqE,UAAW7F,KAAKwB,MAAMsE,SAAU,MACnG,OAAOlC,EAAA,aAAQ+B,EAAK9B,IAAI7D,KAAKyD,gBAAwB,E,0LArpBtB,CAC/BsC,gBAAiB,MACjBb,OAAQ,IACRzC,MAAO,GACPoD,UAAW,GACXC,SAAU,CACT7F,WAAY,GACZ+F,SAAU,IAEXvE,YAAa,CACZK,MAAO,EACPI,UAAW,GACX+D,KAAM,GAEPC,YAAa,G,CAIP,sBAAAC,CAAuB5B,GAC7B6B,EAAepG,KAAM,mBAAmB,IAAM,MAAM,IAAIqG,IAAI,CAAC,YAAa9B,EAAO,CAChF+B,aAAc,O,CAKT,YAAAC,CAAahC,GACnBiC,EAA0BjC,GAAO,KAChCkC,EAAoBlC,GAAO,KAC1B,UAAWA,IAAU,YAAa,CACjCA,EAAQ,E,CAET,IACCA,EAAQmC,EAAkCnC,E,CAEzC,MAAOoC,G,CAGT,GAAIC,MAAMC,QAAQtC,IAAUA,EAAMD,MAAMwC,YAA6CA,IAAc,UAAYA,IAAc,UAAW3C,UAAW,CAClJxC,EAAS3B,KAAM,QAASuE,EAAO,CAC9BwC,WAAY,KAEXC,WAAWhH,KAAKuC,iBAAiB,G,IAInC,G,CAKG,gBAAA0E,CAAiB1C,GACvBiC,EAA0BjC,GAAO,KAChCkC,EAAoBlC,GAAO,KAC1B,UAAWA,IAAU,YAAa,CACjCA,EAAQ,E,CAET,IACCA,EAAQmC,EAAkCnC,E,CAEzC,MAAOoC,G,CAGT,GAAIC,MAAMC,QAAQtC,IAAUA,EAAMD,MAAMwC,YAA6CA,IAAc,UAAYA,IAAc,UAAW3C,UAAW,CAClJxC,EAAS3B,KAAM,YAAauE,EAAO,CAClCwC,WAAY,KACXC,WAAWhH,KAAKuC,iBAAiB,G,IAInC,G,CAqBI,cAAA6C,CAAelB,G,MACtB,UAAWA,EAAWjB,YAAc,WAAY,CAC/C,IAAKjD,KAAKwB,MAAMuE,iBAAmB7B,EAAWxD,OAAOa,EAAAvB,KAAKG,SAAS,MAAE,MAAAoB,SAAA,SAAAA,EAAEb,KAAK,CAE3EV,KAAKG,SAAW,E,CAGjB,MAAM2C,EAAQ9C,KAAKG,SAAS+G,WAAW3C,GAAUA,EAAM7D,MAAQwD,EAAWxD,MAC1E,GAAIoC,GAAS,EAAG,CACf,MAAMqE,EAAWnH,KAAKG,SAAS2C,GAC/B,OAAQqE,EAASpG,WAChB,IAAK,MACJoG,EAASpG,UAAY,OACrB,MACD,IAAK,OACJf,KAAKG,SAASiH,OAAOtE,EAAO,GAC5B,MACD,QACCqE,EAASpG,UAAY,MACrB,M,MAEI,GAAImD,EAAWxD,IAAK,CAC1BV,KAAKG,SAASkH,KAAK,CAClB5G,MAAOyD,EAAWzD,MAClBC,IAAKwD,EAAWxD,IAChBuC,UAAWiB,EAAWjB,UACtBlC,UAAW,O,CAIbf,KAAKuC,iBAAiB2B,E,MAChB,UAAWA,EAAWpD,OAAS,WAAY,CACjDd,KAAKkB,aAAegD,EAAWpD,KAC/B,OAAQd,KAAKE,eAAeqD,IAAIvD,KAAKkB,eACpC,IAAK,MACJlB,KAAKa,iBAAiBb,KAAKkB,aAAc,QACzC,MACD,IAAK,OACJlB,KAAKa,iBAAiBb,KAAKkB,aAAc,OACzC,MACD,QACClB,KAAKa,iBAAiBb,KAAKkB,aAAc,OAE3ClB,KAAKuC,iBAAiB2B,E,EAKjB,eAAAoD,CAAgB/C,GAWtBiC,EAA0BjC,GAAO,KAChCkC,EAAoBlC,GAAO,KAC1B,IACCA,EAAQmC,EAA+BnC,E,CAEtC,MAAOoC,G,CAGTP,EAAepG,KAAM,YAAauE,UAA0BA,IAAU,UAAYA,IAAU,MAAM,IAAI8B,IAAI,CAAC,wBAAyB9B,EAAO,CAC1IgD,MAAO,CACNC,YAAcpF,I,YACb,MAAMqF,EAAaC,IAClB,IAAIC,EAAiB,MACrBD,EAAQE,SAASpF,IAChB,MAAM9B,EAAM8B,EAAK9B,IACjB,IAAKA,EAAK,CACT,M,CAED,MAAMC,EAAgB6B,EAAK7B,cAC3B,GAAIA,IAAkB,OAASA,IAAkB,OAAQ,CACxD,UAAW6B,EAAKS,YAAc,WAAY,CACzC,GAAIjD,KAAKwB,MAAMuE,iBAAmB/F,KAAKG,SAASwC,SAAW,EAAG,CAC7D3C,KAAKG,SAASkH,KAAK,CAAE5G,MAAO+B,EAAK/B,MAAOC,MAAKuC,UAAWT,EAAKS,UAAWlC,UAAWJ,G,CAEpFgH,EAAiB,I,MACX,UAAWnF,EAAK1B,OAAS,WAAY,CAC3Cd,KAAKa,iBAAiB2B,EAAK1B,KAAMH,GACjCqG,YAAW,IAAMhH,KAAKuC,iBAAiB,CAAE7B,MAAKD,MAAO+B,EAAK/B,MAAOE,mB,MAIpE,GAAIgH,EAAgB,CACnBX,YAAW,IAAMhH,KAAKuC,oB,GAIxB,MAAMmF,EAA+BtF,GACrCb,EAAAmG,EAAQzH,cAAU,MAAAsB,SAAA,SAAAA,EAAEqG,QAAQH,IAC5BI,EAAAH,EAAQ1B,YAAQ,MAAA6B,SAAA,SAAAA,EAAED,QAAQH,GAE1B,GAAIC,EAAQzH,YAAcyH,EAAQ1B,YAAY8B,EAAAJ,EAAQzH,cAAU,MAAA6H,SAAA,SAAAA,EAAEnF,QAAS,KAAKoF,EAAAL,EAAQ1B,YAAQ,MAAA+B,SAAA,SAAAA,EAAEpF,QAAS,EAAG,CAC7G3C,KAAKO,YAAc,KACnByH,EACC,8J,KAKH,GACD,G,CAKG,aAAAC,CAAc1D,GACpB0D,EAAcjI,KAAMuE,E,CAId,gBAAA2D,CAAiB3D,GACvB4D,EAAYnI,KAAM,YAAauE,EAAO,CACrC+B,aAAcnC,W,CA0CT,kBAAAiE,CAAmB7D,GACzB,IACCA,EAAQmC,EAAuCnC,E,CAE9C,MAAOoC,G,CAGTP,EAAepG,KAAM,eAAe,IAAM,MAAM,IAAIqG,IAAI,CAAC,UAAW,2BAA4B9B,EAAO,CACtGgD,MAAO,CACNC,YAAaxH,KAAKmC,wB,CAKd,iBAAAkG,GACNrI,KAAKmG,uBAAuBnG,KAAK+F,iBACjC/F,KAAKuG,aAAavG,KAAKyC,OACvBzC,KAAKiH,iBAAiBjH,KAAK6F,WAC3B7F,KAAKsH,gBAAgBtH,KAAK8F,UAC1B9F,KAAKiI,cAAcjI,KAAKkF,QACxBlF,KAAKkI,iBAAiBlI,KAAKsI,WAC3BtI,KAAKoI,mBAAmBpI,KAAKyB,Y,CAGtB,eAAA8G,CAAgBC,EAA+CzF,GACtE,IAAI0F,EAAM,EACVD,EAAkBZ,SAASlE,IAC1B,IAAIgF,EAAQ,EACZhF,EAAIkE,SAAS9D,IAAG,IAAAvC,EAAK,OAACmH,IAASnH,EAAAuC,EAAIY,WAAO,MAAAnD,SAAA,EAAAA,EAAI,CAAC,IAC/C,GAAIkH,EAAMC,EAAO,CAChBD,EAAMC,C,KAGR,GAAID,IAAQ,EAAG,CACdA,EAAM1F,EAAKJ,M,CAEZ,OAAO8F,C,CAGA,eAAAE,CAAgBC,EAA6C7F,GACpE,IAAI0F,EAAM,EACVG,EAAgBhB,SAAS9D,IACxB,IAAI4E,EAAQ,EACZ5E,EAAI8D,SAASlE,IAAG,IAAAnC,EAAK,OAACmH,IAASnH,EAAAmC,EAAIe,WAAO,MAAAlD,SAAA,EAAAA,EAAI,CAAC,IAC/C,GAAIkH,EAAMC,EAAO,CAChBD,EAAMC,C,KAGR,GAAID,IAAQ,EAAG,CACdA,EAAM1F,EAAKJ,M,KACL,CACN8F,GAAOzI,KAAKwB,MAAMqE,UAAUlD,M,CAE7B,OAAO8F,C,CAGA,gBAAAI,CAAiBnB,GACxB,MAAMoB,EAA0C,GAChDpB,EAAQE,SAASmB,IAChBA,EAAMnB,SAASpF,IACd,UAAWA,EAAK9B,MAAQ,SAAU,CACjCoI,EAAczB,KAAK7E,E,IAEnB,IAEH,OAAOsG,C,CAGA,gBAAAE,CAAiBtB,G,QACxB,IAAIoB,EAA0C9I,KAAK6I,kBAAiBtH,EAAAmG,EAAQzH,cAAU,MAAAsB,SAAA,EAAAA,EAAI,IAC1FvB,KAAKC,WAAa,KAClB,GAAI6I,EAAcnG,SAAW,EAAG,CAC/BmG,EAAgB9I,KAAK6I,kBAAiBhB,EAAAH,EAAQ1B,YAAQ,MAAA6B,SAAA,EAAAA,EAAI,IAC1D,GAAIiB,EAAcnG,OAAS,EAAG,CAC7B3C,KAAKC,WAAa,K,EAGpB,OAAO6I,C,CAGA,eAAAlD,CAAgB7C,EAA8B2E,EAA8BuB,GACnFvB,EAAQzH,WAAa2G,MAAMC,QAAQa,IAAO,MAAPA,SAAO,SAAPA,EAASzH,YAAcyH,EAAQzH,WAAa,GAC/EyH,EAAQ1B,SAAWY,MAAMC,QAAQa,IAAO,MAAPA,SAAO,SAAPA,EAAS1B,UAAY0B,EAAQ1B,SAAW,GACzE,MAAM8C,EAAgB9I,KAAKgJ,iBAAiBtB,GAC5C,MAAMwB,EAAUlJ,KAAKuI,gBAAgBb,EAAQzH,WAAY8C,GACzD,IAAIoG,EAAUnJ,KAAK2I,gBAAgBjB,EAAQ1B,SAAUjD,GACrD,IAAIqG,EAAW,EACf,GAAIH,EAAQ,CACXG,EAAWD,EACXA,GAAWnJ,KAAKwB,MAAMqE,UAAUlD,M,CAEjC,MAAM0G,EAAkC,GAExC,MAAMC,EAAqB,GAC3B,MAAMC,EAAuB,GAC7B7B,EAAQ1B,SAAS4B,SAAQ,CAAC4B,EAAM1G,KAC/BwG,EAASxG,GAAS,EAClByG,EAASzG,GAAS,EAAE,IAGrB,IAAK,IAAI2G,EAAIL,EAAUK,EAAIN,EAASM,IAAK,CACxC,MAAMC,EAA2C,GACjDhC,EAAQ1B,SAAS4B,SAAQ,CAAC+B,EAAa7G,KACtC,IAAI8G,EAAY,EAChBL,EAASzG,GAAO8E,SAASrD,GAAWqF,GAAarF,IACjD,GAAIqF,GAAaH,EAAG,CACnB,MAAM9D,EAAOgE,EAAYF,EAAIG,EAAYN,EAASxG,IAClD,UAAW6C,IAAS,SAAU,CAC7B+D,EAAQrC,KAAIzF,OAAAC,OAAAD,OAAAC,OAAA,GACR8D,GAAI,CACP1B,KAAM,MAENlB,KAAM,MAEP,IAAI0B,EAAU,EACd,UAAWkB,EAAKlB,UAAY,UAAYkB,EAAKlB,QAAU,EAAG,CACzDA,EAAUkB,EAAKlB,O,CAEhB8E,EAASzG,GAAOuE,KAAK5C,GACrB,UAAWkB,EAAKjB,UAAY,UAAYiB,EAAKjB,QAAU,EAAG,CACzD,IAAK,IAAImF,EAAI,EAAGA,EAAIlE,EAAKjB,QAASmF,IAAK,CACtCN,EAASzG,EAAQ+G,GAAGxC,KAAK5C,E,EAG3B6E,EAASxG,I,MAIZ,IAAK,IAAIgH,EAAI,EAAGA,EAAIZ,EAASY,IAAK,CACjC,GAAI9J,KAAKC,aAAe,KAAM,CAC7B,MAAMyD,EAAMuF,EAASjJ,KAAKwB,MAAMqE,UAAU4D,EAAIL,GAAYrG,EAAK0G,GAC/D,UACQX,EAAcgB,KAAO,UAC5BhB,EAAcgB,KAAO,aACdhB,EAAcgB,GAAGpJ,MAAQ,iBACzBgD,IAAQ,UACfA,IAAQ,KACP,CACDgG,EAAQrC,KAAIzF,OAAAC,OAAAD,OAAAC,OAAA,GACRiH,EAAcgB,IAAE,CACnBpF,QAASP,UAETpB,KAAMW,EAENjD,MAAOiD,EAAIoF,EAAcgB,GAAGpJ,KAC5B+D,QAASN,Y,MAGL,CACN,UACQ2E,EAAcW,KAAO,UAC5BX,EAAcW,KAAO,aACdX,EAAcW,GAAG/I,MAAQ,iBACzBqC,EAAK+G,KAAO,UACnB/G,EAAK+G,KAAO,KACX,CACDJ,EAAQrC,KAAIzF,OAAAC,OAAAD,OAAAC,OAAA,GACRiH,EAAcW,IAAE,CACnB/E,QAASP,UAETpB,KAAMA,EAAK+G,GAEXrJ,MAAOsC,EAAK+G,GAAGhB,EAAcW,GAAG/I,KAChC+D,QAASN,Y,GAKbkF,EAAUhC,KAAKqC,E,CAEhB,GAAI3G,EAAKJ,SAAW,EAAG,CACtB,IAAIoH,EAAU,EACd,IAAIC,EAAU,EACd,GAAIpD,MAAMC,QAAQa,EAAQzH,aAAeyH,EAAQzH,WAAW0C,OAAS,EAAG,CACvE+E,EAAQzH,WAAW,GAAG2H,SAAS9D,IAC9BiG,GAAWjG,EAAIY,SAAW,CAAC,G,CAG7B,GAAIkC,MAAMC,QAAQa,EAAQ1B,WAAa0B,EAAQ1B,SAASrD,OAAS,EAAG,CACnEoH,GAAWrC,EAAQ1B,SAASrD,OAC5B+E,EAAQ1B,SAAS,GAAG4B,SAASlE,IAC5BsG,GAAWtG,EAAIe,SAAW,CAAC,G,CAG7B,MAAMwF,EAAY,CACjBvF,QAASqF,EACTtJ,MAAOyC,EAAU,kBACjBqC,OAAQpB,UACRM,QAASyF,KAAKzB,IAAIuB,EAAS,IAE5B,GAAIX,EAAU1G,SAAW,EAAG,CAC3B0G,EAAUhC,KAAK,CAAC4C,G,KACV,CACNZ,EAAU,GAAGhC,KAAK4C,E,EAGpB,OAAOZ,C,CAGA,mBAAAc,CAAoBpH,EAA8Bd,EAAkBX,GAC3E,UAAWW,IAAa,UAAYA,EAAW,UAAYX,IAAS,UAAYA,EAAO,EAAG,CACzFtB,KAAKK,eAAiB4B,GAAYX,EAAO,GACzCtB,KAAKM,aAAe2B,EAAWX,EAAOyB,EAAKJ,OAASI,EAAKJ,OAASV,EAAWX,EAC7E,OAAOyB,EAAKqH,MAAMpK,KAAKK,eAAgBL,KAAKM,a,KACtC,CACNN,KAAKK,eAAiB,EACtBL,KAAKM,aAAeyC,EAAKJ,OACzB,OAAOI,C,EAID,UAAA0C,CAAW3B,EAAqE0B,GACvF,GAAIA,EAAqC,CACxC6E,aAAaxK,EAAU0D,IAAIiC,IAC3B3F,EAAUoB,IACTuE,EACAwB,YAAW,KACVqD,aAAaxK,EAAU0D,IAAIiC,IAC3B,MAAM8E,EAAOxG,EAAIyB,OAChBC,EACA,CACCvB,KAAMH,EAAIG,KACVxD,MAAOqD,EAAIrD,MACXmE,UAAWd,EAAIc,UACfC,MAAOf,EAAIe,OAEZf,EAAIf,KACJ/C,KAAKwB,MAAMiB,OAEZ,UAAW6H,IAAS,SAAU,CAC7B9E,EAAG+E,YAAcD,C,OAsLf,MAAA/E,G,QACN,MAAMiF,EAAwCxK,KAAKmK,oBAClDnK,KAAKwB,MAAM0E,YACXlG,KAAKI,gBAAiByH,GAAAtG,EAAAvB,KAAKwB,MAAMC,eAAW,MAAAF,SAAA,SAAAA,EAAEW,aAAS,MAAA2F,SAAA,EAAAA,EAAI,GAAK7H,KAAKwB,MAAM0E,YAAYvD,OACvF3C,KAAKwB,MAAMC,YAAYK,OAAS,GAEjC,MAAMuH,EAAYrJ,KAAK4F,gBAAgB4E,EAAexK,KAAKwB,MAAMsE,UAEjE,OACClC,EAAC6G,EAAI,KACJ7G,EAAA,OAAKe,MAAO,CAAE+F,OAAQ,IAAK7F,MAAO,IAAK8F,SAAU,UAAU,YAAY,aACrE3K,KAAKY,UAENZ,KAAKM,aAAe,GAAKN,KAAKI,gBAC9BwD,EAAA,OAAKkB,MAAM,cACVlB,EAAA,wBACW5D,KAAKM,aAAe,EAAIN,KAAKK,eAAiB,EAAI,EAAC,QAAOL,KAAKM,aAAY,OAAM,IAC1FN,KAAKwB,MAAMC,YAAYwE,OAASW,MAAMC,QAAQ7G,KAAKwB,MAAMiB,OAASzC,KAAKwB,MAAMiB,MAAME,OAAS,GAAE,cAEhGiB,EAAA,WACCA,EAAA,kBACCgH,eAAgB5K,KAAKwB,MAAMC,YAAYmJ,eACvCC,aAAc7K,KAAKwB,MAAMC,YAAYoJ,aACrCnJ,IAAK1B,KAAKmB,iBACVW,MAAO9B,KAAKwB,MAAMC,YAAYK,MAC9BI,UAAWlC,KAAKwB,MAAMC,YAAYS,UAClC4I,iBAAkB9K,KAAKwB,MAAMC,YAAYqJ,kBAAoBlL,EAC7DmL,cAAe/K,KAAKwB,MAAMC,YAAYsJ,cACtCC,cAAc,SACd/E,KAAMjG,KAAKwB,MAAMC,YAAYwE,MAAQjG,KAAKwB,MAAMC,YAAYwE,MAAQjG,KAAKwB,MAAMiB,MAAME,OACrFuC,OAAQhC,EAAU,6BAA8B,CAAEC,aAAc,CAAE1C,MAAOT,KAAKwB,MAAM0D,cAKxFtB,EAAA,OAAKkB,MAAM,QAAQmG,SAAS,KAC3BrH,EAAA,SACCe,MAAO,CACNuG,SAAUlL,KAAKwB,MAAM8G,YAGtB1E,EAAA,eAAU5D,KAAKwB,MAAM0D,QACpB0B,MAAMC,QAAQ7G,KAAKwB,MAAMsE,SAAS7F,aAClC2D,EAAA,aACE5D,KAAKwB,MAAMsE,SAAS7F,WAAW4D,KAAI,CAACsH,EAAMxH,IAC1CC,EAAA,MAAIlD,IAAK,SAASiD,KAChBwH,EAAKtH,KAAI,CAACC,EAAKC,KACf,GAAID,EAAIG,OAAS,KAAM,CACtB,OACCL,EAAA,MACClD,IAAK,SAASiD,KAAYI,KAAYD,EAAIrD,QAC1CqE,MAAO,CACN,CAAChB,EAAIc,kBAA6Bd,EAAIc,YAAc,UAAYd,EAAIc,UAAUjC,OAAS,GAExF+B,QAASZ,EAAIY,QACbD,QAASX,EAAIW,QACbE,MAAO,CACNC,UAAWd,EAAIc,UACfC,MAAOf,EAAIe,OAEZS,WACQxB,EAAIyB,SAAW,WAClBC,IACDxF,KAAKyF,WAAW3B,EAAuE0B,EAAG,EAE1FrB,kBAGIL,EAAIyB,SAAW,WAAazB,EAAIrD,MAAQ,G,KAG5C,CACN,MAAMyD,EAAqCJ,EAC3C,IAAInD,EAAgBwD,UACpB,IAAIC,EAA2C,MAC/C,IAAIC,EAAiB,uBACrB,GAAIH,EAAWxD,IAAK,CACnB,MAAMqC,EAAO/C,KAAKG,SAASmE,MAAMC,GAAUA,EAAM7D,MAAQwD,EAAWxD,MACpE,GAAIqC,EAAM,CACTqB,EAAqBrB,EAAKhC,UAC1B,OAAQgC,EAAKhC,WACZ,IAAK,MACJsD,EAAiB,6BACjB1D,EAAgB,YAChB,MACD,IAAK,OACJ0D,EAAiB,+BACjB1D,EAAgB,aAChB,M,EAIJ,GAAIuD,EAAWxD,MAAQV,KAAKQ,iBAAiBE,IAAK,CACjD0D,EAAqBpE,KAAKQ,iBAAiBG,cAC3C,OAAQX,KAAKQ,iBAAiBG,eAC7B,IAAK,MACJ0D,EAAiB,6BACjB1D,EAAgB,YAChB,MACD,IAAK,OACJ0D,EAAiB,+BACjB1D,EAAgB,aAChB,M,CAGH,OACCiD,EAAA,MACClD,IAAK,SAASiD,KAAYI,KAAYG,EAAWzD,QACjD+D,aAAcN,EAAWQ,UAAY,UAAYR,EAAWQ,QAAU,EAAI,WAAa,MACvFA,QAASR,EAAWQ,QACpBD,QAASP,EAAWO,QACpBE,MAAO,CACNC,UAAWd,EAAIc,UACfC,MAAOf,EAAIe,OACX,YACUlE,EAAa,YACb,QAAQyD,KAEnBR,EAAA,OAAKkB,MAAM,kCACVlB,EAAA,OACCkB,MAAO,CACN,SAAU,KACV,CAAChB,EAAIc,kBAA6Bd,EAAIc,YAAc,UAAYd,EAAIc,UAAUjC,OAAS,GAExFgC,MAAO,CACNC,UAAWd,EAAIc,YAGfd,EAAIrD,QAEJT,KAAKO,qBAAuB2D,EAAWjB,YAAc,mBAAqBiB,EAAWpD,OAAS,aAC/F8C,EAAA,cACCmB,YAAY,OACZC,OAAQX,EACRY,WAAU,KACVC,OAAQhC,EAAU,mBAAoB,CAAEC,aAAc,CAAEgC,SAAUrB,EAAIrD,SACtEiB,IAAK,CACJN,QAAS,IAAMpB,KAAKoF,eAAelB,IAEpCmB,SAAS,W,SAYpBzB,EAAA,aAAQyF,EAAUxF,IAAI7D,KAAKyD,iBAC1BzD,KAAKwB,MAAMqE,UAAUlD,OAAS,EAAI3C,KAAK0F,aAAe,K"}

package/dist/kolibri/kol-tabs.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as n,H as i,g as e}from"./index-0bc40dc4.js";import{a as o}from"./i18n-1b5afe13.js";import{a as s}from"./alignment-32a9ec52.js";import{v as l}from"./label-cdb96413.js";import{d as a,f as r,c as h}from"./a11y.tipps-1e89ea61.js";import{L as d}from"./dev.utils-babc1742.js";import{s as u,e as b,c,k as p}from"./prop.validators-445950f8.js";import"./index-48743821.js";import"./reuse-b3566e4c.js";const f="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: block;\n\t}\n}\n\n@layer kol-component {\n\tkol-button-group-wc {\n\t\tdisplay: inline-flex;\n\t\tflex-wrap: wrap;\n\t}\n\n\tkol-button-group-wc button {\n\t\tborder-bottom-color: transparent;\n\t\tborder-bottom-style: solid;\n\t\tdisplay: block;\n\t}\n\n\tdiv.grid,\n\tdiv[role='tabpanel'] {\n\t\theight: 100%;\n\t}\n\n\t:host > .tabs-align-right {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\t}\n\n\t:host > .tabs-align-right kol-button-group-wc {\n\t\tdisplay: grid;\n\t\torder: 2;\n\t}\n\n\t:host > .tabs-align-left {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: auto 1fr;\n\t}\n\n\t:host > .tabs-align-left kol-button-group-wc {\n\t\tdisplay: grid;\n\t\torder: 0;\n\t}\n\n\t:host > .tabs-align-bottom {\n\t\tdisplay: grid;\n\t\tgrid-template-rows: 1fr auto;\n\t}\n\n\t:host > .tabs-align-bottom kol-button-group-wc {\n\t\torder: 2;\n\t}\n\n\t:host > .tabs-align-bottom kol-button-group-wc > div {\n\t\tdisplay: flex;\n\t}\n\n\t:host > .tabs-align-bottom > kol-button-group-wc > div > div:first-child {\n\t\tmargin: 0 1em 0 0;\n\t}\n\n\t:host > .tabs-align-bottom > kol-button-group-wc > div > div {\n\t\tmargin: 0 1em;\n\t}\n\n\t:host > .tabs-align-top {\n\t\tdisplay: grid;\n\t\tgrid-template-rows: auto 1fr;\n\t}\n\n\t:host > .tabs-align-top kol-button-group-wc {\n\t\torder: 0;\n\t}\n\n\t:host > .tabs-align-top kol-button-group-wc > div {\n\t\tdisplay: flex;\n\t}\n\n\t:host > .tabs-align-top > kol-button-group-wc > div > div:first-child {\n\t\tmargin: 0 1em 0 0;\n\t}\n\n\t:host > .tabs-align-top > kol-button-group-wc > div > div {\n\t\tmargin: 0 1em;\n\t}\n\n\t:host > div {\n\t\tdisplay: grid;\n\t}\n\n\t:host > .tabs-align-left kol-button-group-wc,\n\t:host > .tabs-align-top kol-button-group-wc {\n\t\torder: 0;\n\t}\n\n\t:host > .tabs-align-bottom kol-button-group-wc,\n\t:host > .tabs-align-right kol-button-group-wc {\n\t\torder: 1;\n\t}\n\n\t:host > div.tabs-align-left kol-button-group-wc > div,\n\t:host > div.tabs-align-left kol-button-group-wc > div > div,\n\t:host > div.tabs-align-right kol-button-group-wc > div,\n\t:host > div.tabs-align-right kol-button-group-wc > div > div {\n\t\tdisplay: grid;\n\t}\n\n\t:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,\n\t:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {\n\t\twidth: 100%;\n\t}\n\n\t:host > div.tabs-align-bottom kol-button-group-wc div,\n\t:host > div.tabs-align-top kol-button-group-wc div {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t}\n}\n",g=class{constructor(n){t(this,n),this.onCreateLabel=`${o("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,n,e)=>{if(e>0){if(n+e<t.length)return t[n+e]._disabled?this.nextPossibleTabIndex(t,n,e+1):n+e}else if(e<0&&n+e>=0)return t[n+e]._disabled?this.nextPossibleTabIndex(t,n,e-1):n+e;return n},this.onKeyDown=t=>{const n=setTimeout((()=>{clearTimeout(n);let e=null;switch(t.key){case"ArrowRight":e=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,1);break;case"ArrowLeft":e=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,-1)}null!==e&&this.onSelect(t,e,!0)}),250)},this.onClickSelect=(t,n)=>{this.onSelect(t,n,!0)},this.onMouseDown=t=>{t.preventDefault(),t.stopPropagation()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,n,e=!0,i)=>{if(t>n.length-1&&(t=n.length-1),t<0&&(t=0),Array.isArray(n)&&n[t]&&n[t]._disabled){if(!0===e){if(t<n.length-1)return this.selectNextNotDisabledTab(t+1,n,!0,i||t);t=i||t,e=!1}if(!1===e){if(t>0)return this.selectNextNotDisabledTab(t-1,n,!1,i||t);a("[KolTabs] Alle Tabs sind deaktiviert und somit kann kein Tab angezeigt werden.")}}return t},this.syncSelectedAndTabs=(t,n,e,i)=>{let a,o;a="_selected"===i?t:this.state._selected,o="_tabs"===i?t:this.state._tabs,o.length>0&&n.set("_selected",this.selectNextNotDisabledTab(a,o))},this.handleTabPanels=()=>{var t,n,e;if(this.tabPanelHost instanceof HTMLDivElement)for(let i=this.tabPanelHost.children.length;i<this.state._tabs.length;i++){const a=document.createElement("div");a.setAttribute("aria-labelledby",`${this.state._label.replace(/\s/g,"-")}-tab-${i}`),a.setAttribute("id",`tabpanel-${i}`),a.setAttribute("role","tabpanel"),a.setAttribute("hidden","");const o=document.createElement("slot");o.setAttribute("name",`tabpanel-slot-${i}`),a.appendChild(o),this.tabPanelHost.appendChild(a),(null===(t=this.host)||void 0===t?void 0:t.children)instanceof HTMLCollection&&(null===(n=this.host)||void 0===n?void 0:n.children[i])&&(null===(e=this.host)||void 0===e||e.children[i].setAttribute("slot",`tabpanel-slot-${i}`))}},this.onCreate=t=>{var n,e;t.preventDefault(),t.stopPropagation(),"function"==typeof(null===(n=this.state._on)||void 0===n?void 0:n.onCreate)&&(null===(e=this.state._on)||void 0===e||e.onCreate(t))},this._align="top",this._label=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this.state={_align:"top",_label:"…",_selected:0,_tabs:[]}}renderButtonGroup(){return n("kol-button-group-wc",{role:"tablist","aria-label":this.state._label,onKeyDown:this.onKeyDown},this.state._tabs.map(((t,e)=>n("kol-button-wc",{_disabled:t._disabled,_icons:t._icons,_hideLabel:t._hideLabel,_label:t._label,_on:this.callbacks,_tabIndex:this.state._selected===e?0:-1,_tooltipAlign:t._tooltipAlign,_variant:this.state._selected===e?"custom":void 0,_customClass:this.state._selected===e?"selected":void 0,_ariaControls:`tabpanel-${e}`,_ariaSelected:this.state._selected===e,_id:`${this.state._label.replace(/\s/g,"-")}-tab-${e}`,_role:"tab",_value:e}))),this.showCreateTab&&n("kol-button-wc",{class:"create-button",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return n(i,null,n("div",{ref:t=>{this.tabPanelsElement=t},class:{[`tabs-align-${this.state._align}`]:!0}},this.renderButtonGroup(),n("div",{ref:this.catchTabPanelHost})))}validateAlign(t){s(this,t)}validateLabel(t){l(this,t)}validateOn(t){if("object"==typeof t&&null!==t){r("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const n={};"function"!=typeof t.onCreate&&"object"!=typeof t.onCreate||("object"==typeof t.onCreate?("string"==typeof t.onCreate.label&&t.onCreate.label.length>0?this.onCreateLabel=t.onCreate.label:d.debug("[KolTabs] Der Label-Text für Neu in {\n  onCreate: {\n    label: string (!),\n    callback: Function\n  }\n} ist nicht korrekt gesetzt."),"function"==typeof t.onCreate.callback?n.onCreate=t.onCreate.callback:d.debug("[KolTabs] Die onCreate-Callback-Funktion für Neu in {\n  onCreate: {\n    label: string,\n    callback: Function (!)\n  }\n} ist nicht korrekt gesetzt.")):n.onCreate=t.onCreate,this.showCreateTab="function"==typeof n.onCreate),"function"==typeof t.onSelect&&(n.onSelect=t.onSelect),u(this,"_on",n)}}validateSelected(t){b(this,"_selected",t,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(t){c(this,"_tabs",(t=>"object"==typeof t&&null!==t&&"string"==typeof t._label&&t._label.length>0),t,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs}}),h("KolTabs",this.state._tabs.length)}componentWillLoad(){this.validateAlign(this._align),this.validateLabel(this._label),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs)}componentDidRender(){if(this.handleTabPanels(),this.tabPanelHost instanceof HTMLDivElement)for(let t=0;t<this.tabPanelHost.children.length;t++)t!==this.state._selected?this.tabPanelHost.children[t].setAttribute("hidden",""):this.tabPanelHost.children[t].removeAttribute("hidden")}onSelect(t,n,e=!1){var i,a;this._selected=n,"function"==typeof(null===(i=this._on)||void 0===i?void 0:i.onSelect)&&(null===(a=this._on)||void 0===a||a.onSelect(t,n)),!0===e&&(this.selectedTimeout=setTimeout((()=>{if(clearTimeout(this.selectedTimeout),this.tabPanelsElement){const t=p(`button#${this.state._label.replace(/\s/g,"-")}-tab-${n}`,this.tabPanelsElement);null==t||t.focus()}}),250))}get host(){return e(this)}static get watchers(){return{_align:["validateAlign"],_label:["validateLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"]}}};g.style={default:f};export{g as kol_tabs};
+import{r as t,h as n,H as i,g as e}from"./index-0bc40dc4.js";import{a as o}from"./i18n-99b63f3a.js";import{a as s}from"./alignment-cb8fa342.js";import{v as l}from"./label-7afcc6a9.js";import{d as a,f as r,c as h}from"./a11y.tipps-68791110.js";import{L as d}from"./dev.utils-8202a1bc.js";import{s as b,e as u,c,k as f}from"./prop.validators-3fb6bedf.js";import"./index-a4b1e92f.js";import"./reuse-b3566e4c.js";const p="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: block;\n\t}\n}\n\n@layer kol-component {\n\tkol-button-group-wc {\n\t\tdisplay: inline-flex;\n\t\tflex-wrap: wrap;\n\t}\n\n\tkol-button-group-wc button {\n\t\tborder-bottom-color: transparent;\n\t\tborder-bottom-style: solid;\n\t\tdisplay: block;\n\t}\n\n\tdiv.grid,\n\tdiv[role='tabpanel'] {\n\t\theight: 100%;\n\t}\n\n\t:host > .tabs-align-right {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 1fr auto;\n\t}\n\n\t:host > .tabs-align-right kol-button-group-wc {\n\t\tdisplay: grid;\n\t\torder: 2;\n\t}\n\n\t:host > .tabs-align-left {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: auto 1fr;\n\t}\n\n\t:host > .tabs-align-left kol-button-group-wc {\n\t\tdisplay: grid;\n\t\torder: 0;\n\t}\n\n\t:host > .tabs-align-bottom {\n\t\tdisplay: grid;\n\t\tgrid-template-rows: 1fr auto;\n\t}\n\n\t:host > .tabs-align-bottom kol-button-group-wc {\n\t\torder: 2;\n\t}\n\n\t:host > .tabs-align-bottom kol-button-group-wc > div {\n\t\tdisplay: flex;\n\t}\n\n\t:host > .tabs-align-bottom > kol-button-group-wc > div > div:first-child {\n\t\tmargin: 0 1em 0 0;\n\t}\n\n\t:host > .tabs-align-bottom > kol-button-group-wc > div > div {\n\t\tmargin: 0 1em;\n\t}\n\n\t:host > .tabs-align-top {\n\t\tdisplay: grid;\n\t\tgrid-template-rows: auto 1fr;\n\t}\n\n\t:host > .tabs-align-top kol-button-group-wc {\n\t\torder: 0;\n\t}\n\n\t:host > .tabs-align-top kol-button-group-wc > div {\n\t\tdisplay: flex;\n\t}\n\n\t:host > .tabs-align-top > kol-button-group-wc > div > div:first-child {\n\t\tmargin: 0 1em 0 0;\n\t}\n\n\t:host > .tabs-align-top > kol-button-group-wc > div > div {\n\t\tmargin: 0 1em;\n\t}\n\n\t:host > div {\n\t\tdisplay: grid;\n\t}\n\n\t:host > .tabs-align-left kol-button-group-wc,\n\t:host > .tabs-align-top kol-button-group-wc {\n\t\torder: 0;\n\t}\n\n\t:host > .tabs-align-bottom kol-button-group-wc,\n\t:host > .tabs-align-right kol-button-group-wc {\n\t\torder: 1;\n\t}\n\n\t:host > div.tabs-align-left kol-button-group-wc > div,\n\t:host > div.tabs-align-left kol-button-group-wc > div > div,\n\t:host > div.tabs-align-right kol-button-group-wc > div,\n\t:host > div.tabs-align-right kol-button-group-wc > div > div {\n\t\tdisplay: grid;\n\t}\n\n\t:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,\n\t:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {\n\t\twidth: 100%;\n\t}\n\n\t:host > div.tabs-align-bottom kol-button-group-wc div,\n\t:host > div.tabs-align-top kol-button-group-wc div {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t}\n}\n",g=class{constructor(n){t(this,n),this.onCreateLabel=`${o("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,n,e)=>{if(e>0){if(n+e<t.length)return t[n+e]._disabled?this.nextPossibleTabIndex(t,n,e+1):n+e}else if(e<0&&n+e>=0)return t[n+e]._disabled?this.nextPossibleTabIndex(t,n,e-1):n+e;return n},this.onKeyDown=t=>{const n=setTimeout((()=>{clearTimeout(n);let e=null;switch(t.key){case"ArrowRight":e=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,1);break;case"ArrowLeft":e=this.nextPossibleTabIndex(this.state._tabs,this.state._selected,-1)}null!==e&&this.onSelect(t,e,!0)}),250)},this.onClickSelect=(t,n)=>{this.onSelect(t,n,!0)},this.onMouseDown=t=>{t.preventDefault(),t.stopPropagation()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,n,e=!0,i)=>{if(t>n.length-1&&(t=n.length-1),t<0&&(t=0),Array.isArray(n)&&n[t]&&n[t]._disabled){if(!0===e){if(t<n.length-1)return this.selectNextNotDisabledTab(t+1,n,!0,i||t);t=i||t,e=!1}if(!1===e){if(t>0)return this.selectNextNotDisabledTab(t-1,n,!1,i||t);a("[KolTabs] Alle Tabs sind deaktiviert und somit kann kein Tab angezeigt werden.")}}return t},this.syncSelectedAndTabs=(t,n,e,i)=>{let a,o;a="_selected"===i?t:this.state._selected,o="_tabs"===i?t:this.state._tabs,o.length>0&&n.set("_selected",this.selectNextNotDisabledTab(a,o))},this.handleTabPanels=()=>{var t,n,e;if(this.tabPanelHost instanceof HTMLDivElement)for(let i=this.tabPanelHost.children.length;i<this.state._tabs.length;i++){const a=document.createElement("div");a.setAttribute("aria-labelledby",`${this.state._label.replace(/\s/g,"-")}-tab-${i}`),a.setAttribute("id",`tabpanel-${i}`),a.setAttribute("role","tabpanel"),a.setAttribute("hidden","");const o=document.createElement("slot");o.setAttribute("name",`tabpanel-slot-${i}`),a.appendChild(o),this.tabPanelHost.appendChild(a),(null===(t=this.host)||void 0===t?void 0:t.children)instanceof HTMLCollection&&(null===(n=this.host)||void 0===n?void 0:n.children[i])&&(null===(e=this.host)||void 0===e||e.children[i].setAttribute("slot",`tabpanel-slot-${i}`))}},this.onCreate=t=>{var n,e;t.preventDefault(),t.stopPropagation(),"function"==typeof(null===(n=this.state._on)||void 0===n?void 0:n.onCreate)&&(null===(e=this.state._on)||void 0===e||e.onCreate(t))},this._align="top",this._label=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this.state={_align:"top",_label:"…",_selected:0,_tabs:[]}}renderButtonGroup(){return n("kol-button-group-wc",{role:"tablist","aria-label":this.state._label,onKeyDown:this.onKeyDown},this.state._tabs.map(((t,e)=>n("kol-button-wc",{_disabled:t._disabled,_icons:t._icons,_hideLabel:t._hideLabel,_label:t._label,_on:this.callbacks,_tabIndex:this.state._selected===e?0:-1,_tooltipAlign:t._tooltipAlign,_variant:this.state._selected===e?"custom":void 0,_customClass:this.state._selected===e?"selected":void 0,_ariaControls:`tabpanel-${e}`,_ariaSelected:this.state._selected===e,_id:`${this.state._label.replace(/\s/g,"-")}-tab-${e}`,_role:"tab",_value:e}))),this.showCreateTab&&n("kol-button-wc",{class:"create-button",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return n(i,null,n("div",{ref:t=>{this.tabPanelsElement=t},class:{[`tabs-align-${this.state._align}`]:!0}},this.renderButtonGroup(),n("div",{ref:this.catchTabPanelHost})))}validateAlign(t){s(this,t)}validateLabel(t){l(this,t)}validateOn(t){if("object"==typeof t&&null!==t){r("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const n={};"function"!=typeof t.onCreate&&"object"!=typeof t.onCreate||("object"==typeof t.onCreate?("string"==typeof t.onCreate.label&&t.onCreate.label.length>0?this.onCreateLabel=t.onCreate.label:d.debug("[KolTabs] Der Label-Text für Neu in {\n  onCreate: {\n    label: string (!),\n    callback: Function\n  }\n} ist nicht korrekt gesetzt."),"function"==typeof t.onCreate.callback?n.onCreate=t.onCreate.callback:d.debug("[KolTabs] Die onCreate-Callback-Funktion für Neu in {\n  onCreate: {\n    label: string,\n    callback: Function (!)\n  }\n} ist nicht korrekt gesetzt.")):n.onCreate=t.onCreate,this.showCreateTab="function"==typeof n.onCreate),"function"==typeof t.onSelect&&(n.onSelect=t.onSelect),b(this,"_on",n)}}validateSelected(t){u(this,"_selected",t,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(t){c(this,"_tabs",(t=>"object"==typeof t&&null!==t&&"string"==typeof t._label&&t._label.length>0),t,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs}}),h("KolTabs",this.state._tabs.length)}componentWillLoad(){this.validateAlign(this._align),this.validateLabel(this._label),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs)}componentDidRender(){if(this.handleTabPanels(),this.tabPanelHost instanceof HTMLDivElement)for(let t=0;t<this.tabPanelHost.children.length;t++)t!==this.state._selected?this.tabPanelHost.children[t].setAttribute("hidden",""):this.tabPanelHost.children[t].removeAttribute("hidden")}onSelect(t,n,e=!1){var i,a;this._selected=n,"function"==typeof(null===(i=this._on)||void 0===i?void 0:i.onSelect)&&(null===(a=this._on)||void 0===a||a.onSelect(t,n)),!0===e&&(this.selectedTimeout=setTimeout((()=>{if(clearTimeout(this.selectedTimeout),this.tabPanelsElement){const t=f(`button#${this.state._label.replace(/\s/g,"-")}-tab-${n}`,this.tabPanelsElement);null==t||t.focus()}}),250))}get host(){return e(this)}static get watchers(){return{_align:["validateAlign"],_label:["validateLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"]}}};g.style={default:p};export{g as kol_tabs};

package/dist/kolibri/kol-textarea.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as t,F as e,H as n,r as i,g as a}from"./index-0bc40dc4.js";import{n as s}from"./dev.utils-babc1742.js";import{a as l,e as r,d as o,w as h,s as d}from"./prop.validators-445950f8.js";import{a as p,s as c}from"./reuse-b3566e4c.js";import{I as u,v as f,g as m}from"./controller-85e5be61.js";import{I as y}from"./InternalUnderlinedAccessKey-8b996006.js";import{v}from"./rows-0d6d152b.js";import{a as b}from"./a11y.tipps-1e89ea61.js";import"./hide-label-c9289ea1.js";import"./label-cdb96413.js";import"./events-2bb1065b.js";import"./tab-index-d2087b2a.js";import"./associated.controller-89ab9c94.js";const g=["both","horizontal","vertical","none"];class _ extends u{constructor(t,e,n){super(t,e,n),this.afterSyncCharCounter=()=>{"string"==typeof this.component._value&&this.component._value.length>0&&(this.component.state._currentLength=this.component._value.length)},this.component=t}validateHasCounter(t){l(this.component,"_hasCounter",t,{hooks:{afterPatch:this.afterSyncCharCounter}})}validateHideError(t){f(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideError&&b("Property hide-error for inputs: Only use when the error message is shown outside of the input component.")}}})}validateMaxLength(t){r(this.component,"_maxLength",t,{hooks:{afterPatch:this.afterSyncCharCounter},min:0})}validatePlaceholder(t){o(this.component,"_placeholder",t)}validateReadOnly(t){l(this.component,"_readOnly",t)}validateResize(t){h(this.component,"_resize",(t=>"string"==typeof t&&g.includes(t)),new Set(`String {${g.join(", ")}`),t)}validateRequired(t){l(this.component,"_required",t)}validateRows(t){v(this.component,t)}validateValue(t){o(this.component,"_value",t,{hooks:{afterPatch:this.afterSyncCharCounter}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateHasCounter(this.component._hasCounter),this.validateHideError(this.component._hideError),this.validateMaxLength(this.component._maxLength),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateResize(this.component._resize),this.validateRequired(this.component._required),this.validateRows(this.component._rows),this.validateValue(this.component._value)}}const x="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t.required label > span::after,\n\t.required legend > span::after {\n\t\tcontent: '*';\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: block;\n\t}\n}\n\n@layer kol-component {\n\tinput,\n\ttextarea {\n\t\tcursor: text;\n\t}\n\n\tinput[type='checkbox'],\n\tinput[type='color'],\n\tinput[type='file'],\n\tinput[type='radio'],\n\tinput[type='range'],\n\tlabel,\n\toption,\n\tselect {\n\t\tcursor: pointer;\n\t}\n\n\t/* input[type='checkbox'], */\n\t/* input[type='radio'], */\n\t/* input[type='range'], */\n\tinput[type='color'],\n\tinput[type='date'],\n\tinput[type='datetime-local'],\n\tinput[type='email'],\n\tinput[type='file'],\n\tinput[type='month'],\n\tinput[type='number'],\n\tinput[type='password'],\n\tinput[type='search'],\n\tinput[type='tel'],\n\tinput[type='text'],\n\tinput[type='time'],\n\tinput[type='url'],\n\tinput[type='week'],\n\tselect,\n\tselect[multiple] option,\n\ttextarea {\n\t\tfont-size: 1rem;\n\t\twidth: 100%;\n\t}\n\n\t/* needed hack for vertical alignment */\n\tinput[type='file'] {\n\t\tpadding: calc((var(--a11y-min-size) - 1rem) / 10) 0.5em;\n\t}\n\n\t/* needed hack for vertical alignment */\n\tselect[multiple] option {\n\t\tpadding: calc((var(--a11y-min-size) - 1rem) / 2) 0.5em;\n\t}\n\n\tkol-input.disabled :is(button, input, label, option, select, textarea) {\n\t\tcursor: not-allowed;\n\t\topacity: 0.5;\n\t}\n}\n\n@layer kol-component {\n\tkol-input {\n\t\tdisplay: grid;\n\t}\n\n\tkol-input .input-slot {\n\t\tflex-grow: 1;\n\t}\n\n\tinput:not([type='checkbox'], [type='radio']),\n\tselect:not([multiple], [size]) {\n\t\theight: 2.75em;\n\t}\n\n\tinput:focus,\n\toption:focus,\n\tselect:focus,\n\ttextarea:focus {\n\t\toutline: 0;\n\t}\n\n\t.input {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t.input > kol-icon {\n\t\tdisplay: grid;\n\t\theight: var(--a11y-min-size);\n\t\tplace-items: center;\n\t}\n\n\tkol-input.required .input-tooltip .span-label::after {\n\t\tcontent: '*';\n\t}\n}\n\n@layer kol-component {\n\t.error.hidden {\n\t\tdisplay: none;\n\t}\n}\n",k=t=>{t.style.overflow="hidden";const e=t.rows,n=t.clientHeight/e;t.rows=1;const a=Math.round(t.scrollHeight/n);return t.rows=e,a},w=class{render(){const{ariaDescribedBy:a}=m(this.state),i=c(this.state._label);return t(n,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{textarea:!0,"hide-label":!!this.state._hideLabel,"has-counter":!!this.state._hasCounter},_accessKey:this.state._accessKey,_alert:this.state._alert,_currentLength:this.state._currentLength,_disabled:this.state._disabled,_error:this.state._error,_hideError:this.state._hideError,_hasCounter:this.state._hasCounter,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:this.state._id,_label:this.state._label,_maxLength:this.state._maxLength,_readOnly:this.state._readOnly,_required:this.state._required,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},i?t("slot",{name:"expert"}):"string"==typeof this.state._accessKey?t(e,null,t(y,{accessKey:this.state._accessKey,label:this.state._label})," ",t("span",{class:"access-key-hint","aria-hidden":"true"},this.state._accessKey)):t("span",null,this.state._label)),t("div",{slot:"input"},t("textarea",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":a.length>0?a.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,maxlength:this.state._maxLength,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,rows:this.state._rows,placeholder:this.state._placeholder,spellcheck:"false"},this.controller.onFacade,{onKeyUp:this.onKeyUp,style:{resize:this.state._resize},value:this.state._value})))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,p(this.host,this.ref)},this.onKeyUp=()=>{this.ref instanceof HTMLTextAreaElement&&(d(this,"_currentLength",this.ref.value.length),this.state._adjustHeight&&(this._rows=k(this.ref)))},this._accessKey=void 0,this._adjustHeight=!1,this._alert=!0,this._disabled=!1,this._error=void 0,this._hasCounter=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._id=void 0,this._label=void 0,this._maxLength=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=!1,this._resize="vertical",this._required=!1,this._rows=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_adjustHeight:!1,_currentLength:0,_hasValue:!1,_hideError:!1,_id:`id-${s()}`,_label:"",_resize:"vertical"},this.controller=new _(this,"textarea",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAdjustHeight(t){this.controller.validateAdjustHeight(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideError(t){this.controller.validateHideError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateResize(t){this.controller.validateResize(t)}validateRequired(t){this.controller.validateRequired(t)}validateRows(t){this.controller.validateRows(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_adjustHeight:["validateAdjustHeight"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hasCounter:["validateHasCounter"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_resize:["validateResize"],_required:["validateRequired"],_rows:["validateRows"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};w.style={default:x};export{w as kol_textarea};
+import{h as t,F as e,H as n,r as i,g as a}from"./index-0bc40dc4.js";import{n as s}from"./dev.utils-8202a1bc.js";import{a as l,e as r,d as o,w as h,s as d}from"./prop.validators-3fb6bedf.js";import{a as p,s as u}from"./reuse-b3566e4c.js";import{I as c,v as f,g as m}from"./controller-8b71bf6d.js";import{I as y}from"./InternalUnderlinedAccessKey-8b996006.js";import{v}from"./rows-051ae081.js";import{a as b}from"./a11y.tipps-68791110.js";import"./hide-label-fbf92ea1.js";import"./label-7afcc6a9.js";import"./events-2bb1065b.js";import"./tab-index-95df106a.js";import"./associated.controller-d463ef08.js";const g=["both","horizontal","vertical","none"];class _ extends c{constructor(t,e,n){super(t,e,n),this.afterSyncCharCounter=()=>{"string"==typeof this.component._value&&this.component._value.length>0&&(this.component.state._currentLength=this.component._value.length)},this.component=t}validateHasCounter(t){l(this.component,"_hasCounter",t,{hooks:{afterPatch:this.afterSyncCharCounter}})}validateHideError(t){f(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideError&&b("Property hide-error for inputs: Only use when the error message is shown outside of the input component.")}}})}validateMaxLength(t){r(this.component,"_maxLength",t,{hooks:{afterPatch:this.afterSyncCharCounter},min:0})}validatePlaceholder(t){o(this.component,"_placeholder",t)}validateReadOnly(t){l(this.component,"_readOnly",t)}validateResize(t){h(this.component,"_resize",(t=>"string"==typeof t&&g.includes(t)),new Set(`String {${g.join(", ")}`),t)}validateRequired(t){l(this.component,"_required",t)}validateRows(t){v(this.component,t)}validateValue(t){o(this.component,"_value",t,{hooks:{afterPatch:this.afterSyncCharCounter}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateHasCounter(this.component._hasCounter),this.validateHideError(this.component._hideError),this.validateMaxLength(this.component._maxLength),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateResize(this.component._resize),this.validateRequired(this.component._required),this.validateRows(this.component._rows),this.validateValue(this.component._value)}}const x="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * Minimum size of interactive elements.\n\t\t */\n\t\t--a11y-min-size: 44px;\n\t\t/*\n\t\t * Verdana is an accessible font that can be used without requiring additional loading time.\n\t\t */\n\t\tfont-family: Verdana;\n\t}\n\n\t* {\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\thyphens: auto;\n\t\t/*\n\t\t * Letter spacing is required for all texts.\n\t\t */\n\t\tletter-spacing: inherit;\n\t\t/*\n\t\t * This rule enables the word dividing for all texts. That is important for high zoom levels.\n\t\t */\n\t\tword-break: break-word;\n\t\t/*\n\t\t * Word spacing is required for all texts.\n\t\t */\n\t\tword-spacing: inherit;\n\t}\n\n\t/*\n\t * All interactive elements should have a minimum size of 44px.\n\t */\n\t/* input:not([type='checkbox'], [type='radio'], [type='range']), */\n\t/* option, */\n\t/* select, */\n\t/* textarea, */\n\t[role='button'],\n\tbutton:not([role='link']),\n\tkol-input .input {\n\t\tmin-height: var(--a11y-min-size);\n\t\tmin-width: var(--a11y-min-size);\n\t}\n\n\t/*\n\t * Some interactive elements should not inherit the font-family and font-size.\n\t */\n\ta,\n\tbutton,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tinput,\n\toption,\n\tselect,\n\ttextarea {\n\t\t/*\n\t\t * All elements should inherit the font family from his parent element.\n\t\t */\n\t\tfont-family: inherit;\n\t\t/*\n\t\t * All elements should inherit the font size from his parent element.\n\t\t */\n\t\tfont-size: inherit;\n\t}\n}\n\n@layer kol-global {\n\t/*\n\t * Dieses CSS stellt sicher, dass der Standard-Style\n\t * von A und Button resettet werden.\n\t */\n\t:is(a, button) {\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%; /* 100% needed for custom width from outside */\n\t}\n}\n\n@layer kol-global {\n\t:host {\n\t\t/*\n\t\t * The max-width is needed to prevent the table from overflowing the\n\t\t * parent node, if the table is wider than the parent node.\n\t\t */\n\t\tmax-width: 100%;\n\t}\n\n\t* {\n\t\t/*\n\t\t * We prefer to box-sizing: border-box for all elements.\n\t\t */\n\t\tbox-sizing: border-box;\n\t}\n\n\t/* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n\tkol-span-wc {\n\t\tdisplay: grid;\n\t\tplace-items: center;\n\t}\n\n\t/* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n\tkol-span-wc > span {\n\t\tdisplay: flex;\n\t\tplace-items: center;\n\t}\n\n\ta,\n\tbutton {\n\t\tcursor: pointer;\n\t}\n\n\t/* This is the text label. */\n\t.icon-only > kol-span-wc > span > span {\n\t\tdisplay: none;\n\t}\n}\n\n@layer kol-component {\n\t.required label > span::after,\n\t.required legend > span::after {\n\t\tcontent: '*';\n\t}\n}\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: block;\n\t}\n}\n\n@layer kol-component {\n\tinput,\n\ttextarea {\n\t\tcursor: text;\n\t}\n\n\tinput[type='checkbox'],\n\tinput[type='color'],\n\tinput[type='file'],\n\tinput[type='radio'],\n\tinput[type='range'],\n\tlabel,\n\toption,\n\tselect {\n\t\tcursor: pointer;\n\t}\n\n\t/* input[type='checkbox'], */\n\t/* input[type='radio'], */\n\t/* input[type='range'], */\n\tinput[type='color'],\n\tinput[type='date'],\n\tinput[type='datetime-local'],\n\tinput[type='email'],\n\tinput[type='file'],\n\tinput[type='month'],\n\tinput[type='number'],\n\tinput[type='password'],\n\tinput[type='search'],\n\tinput[type='tel'],\n\tinput[type='text'],\n\tinput[type='time'],\n\tinput[type='url'],\n\tinput[type='week'],\n\tselect,\n\tselect[multiple] option,\n\ttextarea {\n\t\tfont-size: 1rem;\n\t\twidth: 100%;\n\t}\n\n\t/* needed hack for vertical alignment */\n\tinput[type='file'] {\n\t\tpadding: calc((var(--a11y-min-size) - 1rem) / 10) 0.5em;\n\t}\n\n\t/* needed hack for vertical alignment */\n\tselect[multiple] option {\n\t\tpadding: calc((var(--a11y-min-size) - 1rem) / 2) 0.5em;\n\t}\n\n\tkol-input.disabled :is(button, input, label, option, select, textarea) {\n\t\tcursor: not-allowed;\n\t\topacity: 0.5;\n\t}\n}\n\n@layer kol-component {\n\tkol-input {\n\t\tdisplay: grid;\n\t}\n\n\tkol-input .input-slot {\n\t\tflex-grow: 1;\n\t}\n\n\tinput:not([type='checkbox'], [type='radio']),\n\tselect:not([multiple], [size]) {\n\t\theight: 2.75em;\n\t}\n\n\tinput:focus,\n\toption:focus,\n\tselect:focus,\n\ttextarea:focus {\n\t\toutline: 0;\n\t}\n\n\t.input {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t.input > kol-icon {\n\t\tdisplay: grid;\n\t\theight: var(--a11y-min-size);\n\t\tplace-items: center;\n\t}\n\n\tkol-input.required .input-tooltip .span-label::after {\n\t\tcontent: '*';\n\t}\n}\n\n@layer kol-component {\n\t.error.hidden {\n\t\tdisplay: none;\n\t}\n}\n",k=t=>{t.style.overflow="hidden";const e=t.rows,n=t.clientHeight/e;t.rows=1;const a=Math.round(t.scrollHeight/n);return t.rows=e,a},w=class{async getValue(){var t;return null===(t=this.ref)||void 0===t?void 0:t.value}render(){const{ariaDescribedBy:a}=m(this.state),i=u(this.state._label);return t(n,{class:{"has-value":this.state._hasValue}},t("kol-input",{class:{textarea:!0,"hide-label":!!this.state._hideLabel,"has-counter":!!this.state._hasCounter},_accessKey:this.state._accessKey,_alert:this.state._alert,_currentLength:this.state._currentLength,_disabled:this.state._disabled,_error:this.state._error,_hideError:this.state._hideError,_hasCounter:this.state._hasCounter,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:this.state._id,_label:this.state._label,_maxLength:this.state._maxLength,_readOnly:this.state._readOnly,_required:this.state._required,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched,onClick:()=>{var t;return null===(t=this.ref)||void 0===t?void 0:t.focus()}},t("span",{slot:"label"},i?t("slot",{name:"expert"}):"string"==typeof this.state._accessKey?t(e,null,t(y,{accessKey:this.state._accessKey,label:this.state._label})," ",t("span",{class:"access-key-hint","aria-hidden":"true"},this.state._accessKey)):t("span",null,this.state._label)),t("div",{slot:"input"},t("textarea",Object.assign({ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":a.length>0?a.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,maxlength:this.state._maxLength,name:this.state._name,readOnly:this.state._readOnly,required:this.state._required,rows:this.state._rows,placeholder:this.state._placeholder,spellcheck:"false"},this.controller.onFacade,{onKeyUp:this.onKeyUp,style:{resize:this.state._resize},value:this.state._value})))))}constructor(t){i(this,t),this.catchRef=t=>{this.ref=t,p(this.host,this.ref)},this.onKeyUp=()=>{this.ref instanceof HTMLTextAreaElement&&(d(this,"_currentLength",this.ref.value.length),this.state._adjustHeight&&(this._rows=k(this.ref)))},this._accessKey=void 0,this._adjustHeight=!1,this._alert=!0,this._disabled=!1,this._error=void 0,this._hasCounter=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._id=void 0,this._label=void 0,this._maxLength=void 0,this._name=void 0,this._on=void 0,this._placeholder=void 0,this._readOnly=!1,this._resize="vertical",this._required=!1,this._rows=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_adjustHeight:!1,_currentLength:0,_hasValue:!1,_hideError:!1,_id:`id-${s()}`,_label:"",_resize:"vertical"},this.controller=new _(this,"textarea",this.host)}validateAccessKey(t){this.controller.validateAccessKey(t)}validateAdjustHeight(t){this.controller.validateAdjustHeight(t)}validateAlert(t){this.controller.validateAlert(t)}validateDisabled(t){this.controller.validateDisabled(t)}validateError(t){this.controller.validateError(t)}validateHasCounter(t){this.controller.validateHasCounter(t)}validateHideError(t){this.controller.validateHideError(t)}validateHideLabel(t){this.controller.validateHideLabel(t)}validateHint(t){this.controller.validateHint(t)}validateId(t){this.controller.validateId(t)}validateLabel(t){this.controller.validateLabel(t)}validateMaxLength(t){this.controller.validateMaxLength(t)}validateName(t){this.controller.validateName(t)}validateOn(t){this.controller.validateOn(t)}validatePlaceholder(t){this.controller.validatePlaceholder(t)}validateReadOnly(t){this.controller.validateReadOnly(t)}validateResize(t){this.controller.validateResize(t)}validateRequired(t){this.controller.validateRequired(t)}validateRows(t){this.controller.validateRows(t)}validateSyncValueBySelector(t){this.controller.validateSyncValueBySelector(t)}validateTabIndex(t){this.controller.validateTabIndex(t)}validateTouched(t){this.controller.validateTouched(t)}validateValue(t){this.controller.validateValue(t)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((t=>this.state._hasValue=!!t))}get host(){return a(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_adjustHeight:["validateAdjustHeight"],_alert:["validateAlert"],_disabled:["validateDisabled"],_error:["validateError"],_hasCounter:["validateHasCounter"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_resize:["validateResize"],_required:["validateRequired"],_rows:["validateRows"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};w.style={default:x};export{w as kol_textarea};