@public-ui/components 2.0.0 → 2.0.2

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as n}from"./index-e9d20d00.js";const e="/*\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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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",i=class{constructor(n){t(this,n),this._accessKey=void 0,this._hideLabel=!1,this._icons=void 0,this._label=void 0}render(){return n("kol-span-wc",{_icons:this._icons,_hideLabel:this._hideLabel,_label:this._label,_accessKey:this._accessKey},n("slot",{name:"expert",slot:"expert"}))}};i.style={default:e};export{i as kol_span};
+import{r as t,h as n}from"./index-5dfe6d77.js";const e="/*\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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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",i=class{constructor(n){t(this,n),this._accessKey=void 0,this._hideLabel=!1,this._icons=void 0,this._label=void 0}render(){return n("kol-span-wc",{_icons:this._icons,_hideLabel:this._hideLabel,_label:this._label,_accessKey:this._accessKey},n("slot",{name:"expert",slot:"expert"}))}};i.style={default:e};export{i as kol_span};

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-e9d20d00.js";import{a as o}from"./i18n-e1b2767a.js";import{v as a}from"./show-0ced7b04.js";import{w as s}from"./prop.validators-2e3fde52.js";import"./index-c1312005.js";import"./dev.utils-61c61d76.js";import"./reuse-d79ab469.js";import"./a11y.tipps-e9cad37c.js";const r=["cycle","dot","none"],l=(t,n)=>{s(t,"_variant",(t=>"string"==typeof t&&r.includes(t)),new Set(r),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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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-5dfe6d77.js";import{a as o}from"./i18n-9a4c8edc.js";import{v as a}from"./show-9a06c90e.js";import{w as s}from"./prop.validators-c12923a5.js";import"./index-12eec578.js";import"./dev.utils-889226ab.js";import"./reuse-d79ab469.js";import"./a11y.tipps-f14bff66.js";const r=["cycle","dot","none"],l=(t,n)=>{s(t,"_variant",(t=>"string"==typeof t&&r.includes(t)),new Set(r),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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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};

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

@@ -1 +1 @@
-{"version":3,"names":["spinVariantPropTypeOptions","validateSpinVariant","component","value","watchValidator","includes","Set","defaultStyleCss","renderSpin","variant","h","class","name","Fragment","KolSpin","this","showToggled","_variant","render","Host","state","_show","translate","spin","role","validateShow","validateVariant","componentWillLoad"],"sources":["src/types/props/variant/spin.ts","src/components/spin/style.css?tag=kol-spin&mode=default&encapsulation=shadow","src/components/spin/component.tsx"],"sourcesContent":["import { Generic } from '@a11y-ui/core';\n\nimport { watchValidator } from '../../../utils/prop.validators';\n\n/* types */\n/**\n * Loading-spinner\n * - https://github.com/vineethtrv/css-loader\n */\nconst spinVariantPropTypeOptions = ['cycle', 'dot', 'none'] as const;\nexport type SpinVariantPropType = (typeof spinVariantPropTypeOptions)[number];\n\n/**\n * Defines the variant of spin navigation.\n */\nexport type PropSpinVariant = {\n\tvariant: SpinVariantPropType;\n};\n\n/* validator */\nexport const validateSpinVariant = (component: Generic.Element.Component, value?: SpinVariantPropType): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t'_variant',\n\t\t(value) => typeof value === 'string' && spinVariantPropTypeOptions.includes(value),\n\t\tnew Set(spinVariantPropTypeOptions),\n\t\tvalue\n\t);\n};\n","@import url(../style.css);\n@import url(cycle.css);\n@import url(dot.css);\n@layer kol-component {\n\t.spin {\n\t\tdisplay: block;\n\t\tpadding: 0.125rem;\n\t\tposition: relative;\n\t}\n}\n","import { Component, Fragment, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { ShowPropType, validateShow } from '../../types/props/show';\nimport { SpinVariantPropType, validateSpinVariant } from '../../types/props/variant/spin';\nimport { API, States } from './types';\n\nfunction renderSpin(variant: SpinVariantPropType): JSX.Element {\n\tswitch (variant) {\n\t\tcase 'cycle':\n\t\t\treturn <span class=\"loader\"></span>;\n\t\tcase 'none':\n\t\t\treturn <slot name=\"expert\"></slot>;\n\t\tdefault:\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t<span class=\"bg-spin-1\"></span>\n\t\t\t\t\t<span class=\"bg-spin-2\"></span>\n\t\t\t\t\t<span class=\"bg-spin-3\"></span>\n\t\t\t\t\t<span class=\"bg-neutral\"></span>\n\t\t\t\t</>\n\t\t\t);\n\t}\n}\n\n@Component({\n\ttag: 'kol-spin',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolSpin implements API {\n\tprivate showToggled = false;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._show ? (\n\t\t\t\t\t<span\n\t\t\t\t\t\taria-busy=\"true\"\n\t\t\t\t\t\taria-label={translate('kol-action-running')}\n\t\t\t\t\t\taria-live=\"polite\"\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\tspin: true,\n\t\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t\t\t/* [`spin--${this.state._variant}`]: true, witch benefit have this notation? */\n\t\t\t\t\t\t}}\n\t\t\t\t\t\trole=\"alert\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderSpin(this.state._variant)}\n\t\t\t\t\t</span>\n\t\t\t\t) : (\n\t\t\t\t\tthis.showToggled && <span aria-label={translate('kol-action-done')} aria-busy=\"false\" aria-live=\"polite\" role=\"alert\"></span>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Makes the element show up.\n\t * @TODO: Change type back to `ShowPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _show?: boolean = false;\n\n\t/**\n\t * Defines which variant should be used for presentation.\n\t */\n\t@Prop() public _variant?: SpinVariantPropType = 'dot';\n\n\t@State() public state: States = {\n\t\t_variant: 'dot',\n\t};\n\n\t@Watch('_show')\n\tpublic validateShow(value?: ShowPropType): void {\n\t\tthis.showToggled = this.state._show === true && this._show === false;\n\t\tvalidateShow(this, value);\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: SpinVariantPropType): void {\n\t\tvalidateSpinVariant(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateShow(this._show);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"mappings":";;;sTASA,MAAMA,EAA6B,CAAC,QAAS,MAAO,QAW7C,MAAMC,EAAsB,CAACC,EAAsCC,KACzEC,EACCF,EACA,YACCC,UAAiBA,IAAU,UAAYH,EAA2BK,SAASF,IAC5E,IAAIG,IAAIN,GACRG,EACA,EC3BF,MAAMI,EAAkB,yvNCOxB,SAASC,EAAWC,GACnB,OAAQA,GACP,IAAK,QACJ,OAAOC,EAAA,QAAMC,MAAM,WACpB,IAAK,OACJ,OAAOD,EAAA,QAAME,KAAK,WACnB,QACC,OACCF,EAAAG,EAAA,KACCH,EAAA,QAAMC,MAAM,cACZD,EAAA,QAAMC,MAAM,cACZD,EAAA,QAAMC,MAAM,cACZD,EAAA,QAAMC,MAAM,gBAIjB,C,MASaG,EAAO,M,yBACXC,KAAAC,YAAc,M,WA8B2C,M,cAKjB,M,WAEhB,CAC/BC,SAAU,M,CApCJ,MAAAC,GACN,OACCR,EAACS,EAAI,KACHJ,KAAKK,MAAMC,MACXX,EAAA,oBACW,OAAM,aACJY,EAAU,sBAAqB,YACjC,SACVX,MAAO,CACNY,KAAM,KACN,CAACR,KAAKK,MAAMH,UAAW,MAGxBO,KAAK,SAEJhB,EAAWO,KAAKK,MAAMH,WAGxBF,KAAKC,aAAeN,EAAA,qBAAkBY,EAAU,mBAAkB,YAAY,QAAO,YAAW,SAASE,KAAK,U,CAsB3G,YAAAC,CAAatB,GACnBY,KAAKC,YAAcD,KAAKK,MAAMC,QAAU,MAAQN,KAAKM,QAAU,MAC/DI,EAAaV,KAAMZ,E,CAIb,eAAAuB,CAAgBvB,GACtBF,EAAoBc,KAAMZ,E,CAGpB,iBAAAwB,GACNZ,KAAKU,aAAaV,KAAKM,OACvBN,KAAKW,gBAAgBX,KAAKE,S"}
+{"version":3,"names":["spinVariantPropTypeOptions","validateSpinVariant","component","value","watchValidator","includes","Set","defaultStyleCss","renderSpin","variant","h","class","name","Fragment","KolSpin","this","showToggled","_variant","render","Host","state","_show","translate","spin","role","validateShow","validateVariant","componentWillLoad"],"sources":["src/types/props/variant/spin.ts","src/components/spin/style.css?tag=kol-spin&mode=default&encapsulation=shadow","src/components/spin/component.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\n\nimport { watchValidator } from '../../../utils/prop.validators';\n\n/* types */\n/**\n * Loading-spinner\n * - https://github.com/vineethtrv/css-loader\n */\nconst spinVariantPropTypeOptions = ['cycle', 'dot', 'none'] as const;\nexport type SpinVariantPropType = (typeof spinVariantPropTypeOptions)[number];\n\n/**\n * Defines the variant of spin navigation.\n */\nexport type PropSpinVariant = {\n\tvariant: SpinVariantPropType;\n};\n\n/* validator */\nexport const validateSpinVariant = (component: Generic.Element.Component, value?: SpinVariantPropType): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t'_variant',\n\t\t(value) => typeof value === 'string' && spinVariantPropTypeOptions.includes(value),\n\t\tnew Set(spinVariantPropTypeOptions),\n\t\tvalue\n\t);\n};\n","@import url(../style.css);\n@import url(cycle.css);\n@import url(dot.css);\n@layer kol-component {\n\t.spin {\n\t\tdisplay: block;\n\t\tpadding: 0.125rem;\n\t\tposition: relative;\n\t}\n}\n","import { Component, Fragment, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { ShowPropType, validateShow } from '../../types/props/show';\nimport { SpinVariantPropType, validateSpinVariant } from '../../types/props/variant/spin';\nimport { API, States } from './types';\n\nfunction renderSpin(variant: SpinVariantPropType): JSX.Element {\n\tswitch (variant) {\n\t\tcase 'cycle':\n\t\t\treturn <span class=\"loader\"></span>;\n\t\tcase 'none':\n\t\t\treturn <slot name=\"expert\"></slot>;\n\t\tdefault:\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t<span class=\"bg-spin-1\"></span>\n\t\t\t\t\t<span class=\"bg-spin-2\"></span>\n\t\t\t\t\t<span class=\"bg-spin-3\"></span>\n\t\t\t\t\t<span class=\"bg-neutral\"></span>\n\t\t\t\t</>\n\t\t\t);\n\t}\n}\n\n@Component({\n\ttag: 'kol-spin',\n\tstyleUrls: {\n\t\tdefault: './style.css',\n\t},\n\tshadow: true,\n})\nexport class KolSpin implements API {\n\tprivate showToggled = false;\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{this.state._show ? (\n\t\t\t\t\t<span\n\t\t\t\t\t\taria-busy=\"true\"\n\t\t\t\t\t\taria-label={translate('kol-action-running')}\n\t\t\t\t\t\taria-live=\"polite\"\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\tspin: true,\n\t\t\t\t\t\t\t[this.state._variant]: true,\n\t\t\t\t\t\t\t/* [`spin--${this.state._variant}`]: true, witch benefit have this notation? */\n\t\t\t\t\t\t}}\n\t\t\t\t\t\trole=\"alert\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderSpin(this.state._variant)}\n\t\t\t\t\t</span>\n\t\t\t\t) : (\n\t\t\t\t\tthis.showToggled && <span aria-label={translate('kol-action-done')} aria-busy=\"false\" aria-live=\"polite\" role=\"alert\"></span>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Makes the element show up.\n\t * @TODO: Change type back to `ShowPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _show?: boolean = false;\n\n\t/**\n\t * Defines which variant should be used for presentation.\n\t */\n\t@Prop() public _variant?: SpinVariantPropType = 'dot';\n\n\t@State() public state: States = {\n\t\t_variant: 'dot',\n\t};\n\n\t@Watch('_show')\n\tpublic validateShow(value?: ShowPropType): void {\n\t\tthis.showToggled = this.state._show === true && this._show === false;\n\t\tvalidateShow(this, value);\n\t}\n\n\t@Watch('_variant')\n\tpublic validateVariant(value?: SpinVariantPropType): void {\n\t\tvalidateSpinVariant(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateShow(this._show);\n\t\tthis.validateVariant(this._variant);\n\t}\n}\n"],"mappings":";;;sTASA,MAAMA,EAA6B,CAAC,QAAS,MAAO,QAW7C,MAAMC,EAAsB,CAACC,EAAsCC,KACzEC,EACCF,EACA,YACCC,UAAiBA,IAAU,UAAYH,EAA2BK,SAASF,IAC5E,IAAIG,IAAIN,GACRG,EACA,EC3BF,MAAMI,EAAkB,yvNCOxB,SAASC,EAAWC,GACnB,OAAQA,GACP,IAAK,QACJ,OAAOC,EAAA,QAAMC,MAAM,WACpB,IAAK,OACJ,OAAOD,EAAA,QAAME,KAAK,WACnB,QACC,OACCF,EAAAG,EAAA,KACCH,EAAA,QAAMC,MAAM,cACZD,EAAA,QAAMC,MAAM,cACZD,EAAA,QAAMC,MAAM,cACZD,EAAA,QAAMC,MAAM,gBAIjB,C,MASaG,EAAO,M,yBACXC,KAAAC,YAAc,M,WA8B2C,M,cAKjB,M,WAEhB,CAC/BC,SAAU,M,CApCJ,MAAAC,GACN,OACCR,EAACS,EAAI,KACHJ,KAAKK,MAAMC,MACXX,EAAA,oBACW,OAAM,aACJY,EAAU,sBAAqB,YACjC,SACVX,MAAO,CACNY,KAAM,KACN,CAACR,KAAKK,MAAMH,UAAW,MAGxBO,KAAK,SAEJhB,EAAWO,KAAKK,MAAMH,WAGxBF,KAAKC,aAAeN,EAAA,qBAAkBY,EAAU,mBAAkB,YAAY,QAAO,YAAW,SAASE,KAAK,U,CAsB3G,YAAAC,CAAatB,GACnBY,KAAKC,YAAcD,KAAKK,MAAMC,QAAU,MAAQN,KAAKM,QAAU,MAC/DI,EAAaV,KAAMZ,E,CAIb,eAAAuB,CAAgBvB,GACtBF,EAAoBc,KAAMZ,E,CAGpB,iBAAAwB,GACNZ,KAAKU,aAAaV,KAAKM,OACvBN,KAAKW,gBAAgBX,KAAKE,S"}

package/dist/kolibri/kol-split-button.entry.js

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as n,H as e}from"./index-e9d20d00.js";const i="/*\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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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: flex;\n\t\tposition: relative;\n\t}\n\n\t.main-button {\n\t\tflex-grow: 1;\n\t\ttext-align: left;\n\t}\n\n\t.main-button kol-span-wc {\n\t\tplace-items: start;\n\t}\n\n\t.secondary-button button {\n\t\theight: 100%;\n\t}\n\n\t.horizontal-line {\n\t\tbackground-color: rgba(0, 0, 0, 0.2);\n\t\tborder-radius: 2px;\n\t\theight: 70%;\n\t\tmargin-block: auto;\n\t\twidth: 1px;\n\t}\n\n\t/* popover */\n\t.popover {\n\t\theight: 0;\n\t\tleft: 0;\n\t\tmin-width: 100%;\n\t\toverflow: hidden;\n\t\tposition: absolute;\n\t\ttop: 100%;\n\t\ttransition: height 0.3s ease-in-out;\n\t}\n\n\t.popover-content {\n\t\tinset: 0 0 auto 0;\n\t\tmin-width: 100%;\n\t\tposition: absolute;\n\t}\n}\n",o=class{constructor(n){t(this,n),this.clickButtonHandler={onClick:t=>{var n,e;"function"==typeof(null===(n=this._on)||void 0===n?void 0:n.onClick)?null===(e=this._on)||void 0===e||e.onClick(t,this._value):this.toggleDropdown()}},this.clickToggleHandler={onClick:()=>this.toggleDropdown()},this.openDropdown=()=>{this.dropdown&&this.dropdownContent&&(this.dropdown.style.height=`${this.dropdownContent.clientHeight}px`,this.state=Object.assign(Object.assign({},this.state),{_show:!0}))},this.closeDropdown=()=>{this.dropdown&&this.dropdownContent&&(this.dropdown.style.height="",this.state=Object.assign(Object.assign({},this.state),{_show:!1}))},this.toggleDropdown=t=>{("boolean"==typeof t?t:!this.state._show)?this.openDropdown():this.closeDropdown()},this.catchDropdownElements=t=>{t&&(this.dropdown=t,setTimeout((()=>{this.dropdownContent=t.firstChild})))},this._ariaControls=void 0,this._ariaExpanded=void 0,this._ariaSelected=void 0,this._customClass=void 0,this._disabled=!1,this._hideLabel=!1,this._icons=void 0,this._id=void 0,this._label=void 0,this._name=void 0,this._on=void 0,this._role=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._type="button",this._value=void 0,this._variant="normal",this.state={_show:!1}}render(){return n(e,null,n("kol-button-wc",{class:{"main-button":!0,button:!0,[this._variant]:"custom"!==this._variant,[this._customClass]:"custom"===this._variant&&"string"==typeof this._customClass&&this._customClass.length>0},_ariaControls:this._ariaControls,_ariaExpanded:this._ariaExpanded,_ariaSelected:this._ariaSelected,_customClass:this._customClass,_disabled:this._disabled,_icons:this._icons,_hideLabel:this._hideLabel,_label:this._label,_name:this._name,_on:this.clickButtonHandler,_role:this._role,_syncValueBySelector:this._syncValueBySelector,_tabIndex:this._tabIndex,_tooltipAlign:this._tooltipAlign,_type:this._type,_value:this._value,_variant:this._variant}),n("div",{class:"horizontal-line"}),n("kol-button-wc",{class:"secondary-button",_disabled:this._disabled,_hideLabel:!0,_icons:"codicon codicon-triangle-down",_label:"dropdown "+(this.state._show?"schließen":"öffnen"),_on:this.clickToggleHandler}),n("div",{class:"popover",ref:this.catchDropdownElements},n("div",{class:"popover-content"},n("slot",null))))}};o.style={default:i};export{o as kol_split_button};
+import{r as t,h as n,H as e}from"./index-5dfe6d77.js";const i="/*\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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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: flex;\n\t\tposition: relative;\n\t}\n\n\t.main-button {\n\t\tflex-grow: 1;\n\t\ttext-align: left;\n\t}\n\n\t.main-button kol-span-wc {\n\t\tplace-items: start;\n\t}\n\n\t.secondary-button button {\n\t\theight: 100%;\n\t}\n\n\t.horizontal-line {\n\t\tbackground-color: rgba(0, 0, 0, 0.2);\n\t\tborder-radius: 2px;\n\t\theight: 70%;\n\t\tmargin-block: auto;\n\t\twidth: 1px;\n\t}\n\n\t/* popover */\n\t.popover {\n\t\theight: 0;\n\t\tleft: 0;\n\t\tmin-width: 100%;\n\t\toverflow: hidden;\n\t\tposition: absolute;\n\t\ttop: 100%;\n\t\ttransition: height 0.3s ease-in-out;\n\t}\n\n\t.popover-content {\n\t\tinset: 0 0 auto 0;\n\t\tmin-width: 100%;\n\t\tposition: absolute;\n\t}\n}\n",o=class{constructor(n){t(this,n),this.clickButtonHandler={onClick:t=>{var n,e;"function"==typeof(null===(n=this._on)||void 0===n?void 0:n.onClick)?null===(e=this._on)||void 0===e||e.onClick(t,this._value):this.toggleDropdown()}},this.clickToggleHandler={onClick:()=>this.toggleDropdown()},this.openDropdown=()=>{this.dropdown&&this.dropdownContent&&(this.dropdown.style.height=`${this.dropdownContent.clientHeight}px`,this.state=Object.assign(Object.assign({},this.state),{_show:!0}))},this.closeDropdown=()=>{this.dropdown&&this.dropdownContent&&(this.dropdown.style.height="",this.state=Object.assign(Object.assign({},this.state),{_show:!1}))},this.toggleDropdown=t=>{("boolean"==typeof t?t:!this.state._show)?this.openDropdown():this.closeDropdown()},this.catchDropdownElements=t=>{t&&(this.dropdown=t,setTimeout((()=>{this.dropdownContent=t.firstChild})))},this._ariaControls=void 0,this._ariaExpanded=void 0,this._ariaSelected=void 0,this._customClass=void 0,this._disabled=!1,this._hideLabel=!1,this._icons=void 0,this._id=void 0,this._label=void 0,this._name=void 0,this._on=void 0,this._role=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._type="button",this._value=void 0,this._variant="normal",this.state={_show:!1}}render(){return n(e,null,n("kol-button-wc",{class:{"main-button":!0,button:!0,[this._variant]:"custom"!==this._variant,[this._customClass]:"custom"===this._variant&&"string"==typeof this._customClass&&this._customClass.length>0},_ariaControls:this._ariaControls,_ariaExpanded:this._ariaExpanded,_ariaSelected:this._ariaSelected,_customClass:this._customClass,_disabled:this._disabled,_icons:this._icons,_hideLabel:this._hideLabel,_label:this._label,_name:this._name,_on:this.clickButtonHandler,_role:this._role,_syncValueBySelector:this._syncValueBySelector,_tabIndex:this._tabIndex,_tooltipAlign:this._tooltipAlign,_type:this._type,_value:this._value,_variant:this._variant}),n("div",{class:"horizontal-line"}),n("kol-button-wc",{class:"secondary-button",_disabled:this._disabled,_hideLabel:!0,_icons:"codicon codicon-triangle-down",_label:"dropdown "+(this.state._show?"schließen":"öffnen"),_on:this.clickToggleHandler}),n("div",{class:"popover",ref:this.catchDropdownElements},n("div",{class:"popover-content"},n("slot",null))))}};o.style={default:i};export{o as kol_split_button};

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 e}from"./index-e9d20d00.js";import{a as i}from"./i18n-e1b2767a.js";import{v as a}from"./label-32f655e1.js";import{d as r}from"./prop.validators-2e3fde52.js";import"./index-c1312005.js";import"./dev.utils-61c61d76.js";import"./reuse-d79ab469.js";import"./a11y.tipps-e9cad37c.js";const l=class{constructor(t){s(this,t),this._label=void 0,this._symbol=void 0,this.state={_label:i("kol-warning"),_symbol:"…"}}render(){return t(e,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 i}from"./index-5dfe6d77.js";import{a}from"./i18n-9a4c8edc.js";import{v as e}from"./label-8258848f.js";import{d as r}from"./prop.validators-c12923a5.js";import"./index-12eec578.js";import"./dev.utils-889226ab.js";import"./reuse-d79ab469.js";import"./a11y.tipps-f14bff66.js";const l=class{constructor(t){s(this,t),this._label=void 0,this._symbol=void 0,this.state={_label:a("kol-warning"),_symbol:"…"}}render(){return t(i,null,t("span",{"aria-label":this.state._label,role:"term"},this.state._symbol))}validateLabel(t){e(this,t)}validateSymbol(t){r(this,"_symbol",t,{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-symbol.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["KolSymbol","_label","translate","_symbol","render","h","Host","this","state","role","validateLabel","value","validateSymbol","watchString","required","componentWillLoad"],"sources":["src/components/symbol/component.tsx"],"sourcesContent":["import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { watchString } from '../../utils/prop.validators';\nimport { API, States } from './types';\n\n@Component({\n\ttag: 'kol-symbol',\n\tshadow: false,\n})\nexport class KolSymbol implements API {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<span aria-label={this.state._label} role=\"term\">\n\t\t\t\t\t{this.state._symbol}\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Sets the visible or semantic label of the component (e.g. Aria label, Label, Headline, Caption, Summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Dieses Property gibt den String an der angezeigt werden soll.\n\t */\n\t@Prop() public _symbol!: string;\n\n\t@State() public state: States = {\n\t\t_label: translate('kol-warning'),\n\t\t_symbol: '…', // ⚠ required\n\t};\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_symbol')\n\tpublic validateSymbol(value?: string): void {\n\t\twatchString(this, '_symbol', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateSymbol(this._symbol);\n\t}\n}\n"],"mappings":";;;sTAWaA,EAAS,M,iFAqBW,CAC/BC,OAAQC,EAAU,eAClBC,QAAS,I,CAtBH,MAAAC,GACN,OACCC,EAACC,EAAI,KACJD,EAAA,qBAAkBE,KAAKC,MAAMP,OAAQQ,KAAK,QACxCF,KAAKC,MAAML,S,CAsBT,aAAAO,CAAcC,GACpBD,EAAcH,KAAMI,E,CAId,cAAAC,CAAeD,GACrBE,EAAYN,KAAM,UAAWI,EAAO,CACnCG,SAAU,M,CAIL,iBAAAC,GACNR,KAAKG,cAAcH,KAAKN,QACxBM,KAAKK,eAAeL,KAAKJ,Q"}
+{"version":3,"names":["KolSymbol","_label","translate","_symbol","render","h","Host","this","state","role","validateLabel","value","validateSymbol","watchString","required","componentWillLoad"],"sources":["src/components/symbol/component.tsx"],"sourcesContent":["import { Component, h, Host, JSX, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { LabelPropType, validateLabel } from '../../types/props/label';\nimport { watchString } from '../../utils/prop.validators';\nimport { API, States } from './types';\n\n@Component({\n\ttag: 'kol-symbol',\n\tshadow: false,\n})\nexport class KolSymbol implements API {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<span aria-label={this.state._label} role=\"term\">\n\t\t\t\t\t{this.state._symbol}\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Sets the visible or semantic label of the component (e.g. Aria label, Label, Headline, Caption, Summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Dieses Property gibt den String an der angezeigt werden soll.\n\t */\n\t@Prop() public _symbol!: string;\n\n\t@State() public state: States = {\n\t\t_label: translate('kol-warning'),\n\t\t_symbol: '…', // ⚠ required\n\t};\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_symbol')\n\tpublic validateSymbol(value?: string): void {\n\t\twatchString(this, '_symbol', value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateSymbol(this._symbol);\n\t}\n}\n"],"mappings":";;;iTAWaA,EAAS,M,iFAqBW,CAC/BC,OAAQC,EAAU,eAClBC,QAAS,I,CAtBH,MAAAC,GACN,OACCC,EAACC,EAAI,KACJD,EAAA,qBAAkBE,KAAKC,MAAMP,OAAQQ,KAAK,QACxCF,KAAKC,MAAML,S,CAsBT,aAAAO,CAAcC,GACpBD,EAAcH,KAAMI,E,CAId,cAAAC,CAAeD,GACrBE,EAAYN,KAAM,UAAWI,EAAO,CACnCG,SAAU,M,CAIL,iBAAAC,GACNR,KAAKG,cAAcH,KAAKN,QACxBM,KAAKK,eAAeL,KAAKJ,Q"}

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-e9d20d00.js";import{a as n}from"./i18n-e1b2767a.js";import{v as o}from"./label-32f655e1.js";import{d as s}from"./a11y.tipps-e9cad37c.js";import{s as a,w as l,g as r,d as h,p as d,o as c}from"./prop.validators-2e3fde52.js";import"./index-c1312005.js";import"./dev.utils-61c61d76.js";import"./reuse-d79ab469.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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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 n;"function"==typeof(null===(n=this.state._pagination._on)||void 0===n?void 0:n.onClick)&&this.state._pagination._on.onClick(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePage:(t,e)=>{var n;"function"==typeof(null===(n=this.state._pagination._on)||void 0===n?void 0:n.onChangePage)&&this.state._pagination._on.onChangePage(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePageSize:(t,e)=>{var n;"function"==typeof(null===(n=this.state._pagination._on)||void 0===n?void 0:n.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,n,i)=>{"_pagination"===i&&(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 n=0;n<this.sortData.length;n++){const i=this.sortData[n],a=i.compareFn(t,e);if(0!==a)return"ASC"===i.direction?a:-a}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,n)=>e("tr",{key:`tbody-${n}`},t.map(((t,e)=>this.renderTableCell(t,n,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 n=this.sortData.findIndex((e=>e.key===t.key));if(n>=0){const t=this.sortData[n];switch(t.direction){case"ASC":t.direction="DESC";break;case"DESC":this.sortData.splice(n,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,n,i,a;const o=t=>{let e=!1;t.forEach((t=>{const n=t.key;if(!n)return;const i=t.sortDirection;"ASC"!==i&&"DESC"!==i||("function"==typeof t.compareFn?((this.state._allowMultiSort||0===this.sortData.length)&&this.sortData.push({label:t.label,key:n,compareFn:t.compareFn,direction:i}),e=!0):"function"==typeof t.sort&&(this.setSortDirection(t.sort,i),setTimeout((()=>this.updateSortedData({key:n,label:t.label,sortDirection:i})))))})),e&&setTimeout((()=>this.updateSortedData()))},l=t;null===(e=l.horizontal)||void 0===e||e.forEach(o),null===(n=l.vertical)||void 0===n||n.forEach(o),l.horizontal&&l.vertical&&(null===(i=l.horizontal)||void 0===i?void 0:i.length)>0&&(null===(a=l.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){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 n=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var n;return e+=null!==(n=t.colSpan)&&void 0!==n?n:1})),n<e&&(n=e)})),0===n&&(n=e.length),n}getNumberOfRows(t,e){let n=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var n;return e+=null!==(n=t.rowSpan)&&void 0!==n?n:1})),n<e&&(n=e)})),0===n?n=e.length:n-=this.state._dataFoot.length,n}filterHeaderKeys(t){const e=[];return t.forEach((t=>{t.forEach((t=>{"string"==typeof t.key&&e.push(t)}))})),e}getPrimaryHeader(t){var e,n;let i=this.filterHeaderKeys(null!==(e=t.horizontal)&&void 0!==e?e:[]);return this.horizontal=!0,0===i.length&&(i=this.filterHeaderKeys(null!==(n=t.vertical)&&void 0!==n?n:[]),i.length>0&&(this.horizontal=!1)),i}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 n=1;n<a.colSpan;n++)d[e+n].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,n){return"number"==typeof e&&e>0&&"number"==typeof n&&n>0?(this.pageStartSlice=e*(n-1),this.pageEndSlice=e*n>t.length?t.length:e*n,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 n=t.render(e,{asTd:t.asTd,label:t.label,textAlign:t.textAlign,width:t.width},t.data,this.state._data);"string"==typeof n&&(e.textContent=n)}))))}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};
+import{r as t,h as e,H as i}from"./index-5dfe6d77.js";import{a as n}from"./i18n-9a4c8edc.js";import{v as o}from"./label-8258848f.js";import{d as s}from"./a11y.tipps-f14bff66.js";import{s as a,w as l,g as r,d as h,p as d,o as c}from"./prop.validators-c12923a5.js";import"./index-12eec578.js";import"./dev.utils-889226ab.js";import"./reuse-d79ab469.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 * No element should be used without a background and font color whose contrast ratio has\n\t\t * not been checked. By initially setting the background color to white and the font color\n\t\t * to black, the contrast ratio is ensured and explicit adjustment is forced.\n\t\t */\n\t\tbackground-color: white;\n\t\tcolor: black;\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/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n\tclip: rect(0 0 0 0);\n\tclip-path: inset(50%);\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twhite-space: nowrap;\n\twidth: 1px;\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\t/*\n\t * Ensure elements with hidden attribute to be actually not visible\n\t * @see https://meowni.ca/hidden.is.a.lie.html\n\t */\n\t[hidden] {\n\t\tdisplay: none !important;\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 n;"function"==typeof(null===(n=this.state._pagination._on)||void 0===n?void 0:n.onClick)&&this.state._pagination._on.onClick(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePage:(t,e)=>{var n;"function"==typeof(null===(n=this.state._pagination._on)||void 0===n?void 0:n.onChangePage)&&this.state._pagination._on.onChangePage(t,e),a(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:e}))},onChangePageSize:(t,e)=>{var n;"function"==typeof(null===(n=this.state._pagination._on)||void 0===n?void 0:n.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,n,i)=>{"_pagination"===i&&(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 n=0;n<this.sortData.length;n++){const i=this.sortData[n],a=i.compareFn(t,e);if(0!==a)return"ASC"===i.direction?a:-a}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,n)=>e("tr",{key:`tbody-${n}`},t.map(((t,e)=>this.renderTableCell(t,n,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 n=this.sortData.findIndex((e=>e.key===t.key));if(n>=0){const t=this.sortData[n];switch(t.direction){case"ASC":t.direction="DESC";break;case"DESC":this.sortData.splice(n,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,n,i,a;const o=t=>{let e=!1;t.forEach((t=>{const n=t.key;if(!n)return;const i=t.sortDirection;"ASC"!==i&&"DESC"!==i||("function"==typeof t.compareFn?((this.state._allowMultiSort||0===this.sortData.length)&&this.sortData.push({label:t.label,key:n,compareFn:t.compareFn,direction:i}),e=!0):"function"==typeof t.sort&&(this.setSortDirection(t.sort,i),setTimeout((()=>this.updateSortedData({key:n,label:t.label,sortDirection:i})))))})),e&&setTimeout((()=>this.updateSortedData()))},l=t;null===(e=l.horizontal)||void 0===e||e.forEach(o),null===(n=l.vertical)||void 0===n||n.forEach(o),l.horizontal&&l.vertical&&(null===(i=l.horizontal)||void 0===i?void 0:i.length)>0&&(null===(a=l.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){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 n=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var n;return e+=null!==(n=t.colSpan)&&void 0!==n?n:1})),n<e&&(n=e)})),0===n&&(n=e.length),n}getNumberOfRows(t,e){let n=0;return t.forEach((t=>{let e=0;t.forEach((t=>{var n;return e+=null!==(n=t.rowSpan)&&void 0!==n?n:1})),n<e&&(n=e)})),0===n?n=e.length:n-=this.state._dataFoot.length,n}filterHeaderKeys(t){const e=[];return t.forEach((t=>{t.forEach((t=>{"string"==typeof t.key&&e.push(t)}))})),e}getPrimaryHeader(t){var e,n;let i=this.filterHeaderKeys(null!==(e=t.horizontal)&&void 0!==e?e:[]);return this.horizontal=!0,0===i.length&&(i=this.filterHeaderKeys(null!==(n=t.vertical)&&void 0!==n?n:[]),i.length>0&&(this.horizontal=!1)),i}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 n=1;n<a.colSpan;n++)d[e+n].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,n){return"number"==typeof e&&e>0&&"number"==typeof n&&n>0?(this.pageStartSlice=e*(n-1),this.pageEndSlice=e*n>t.length?t.length:e*n,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 n=t.render(e,{asTd:t.asTd,label:t.label,textAlign:t.textAlign,width:t.width},t.data,this.state._data);"string"==typeof n&&(e.textContent=n)}))))}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","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":"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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 type { Generic } from 'adopted-style-sheets';\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":"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"}