@public-ui/components 2.1.7-rc.2 → 2.1.8-rc.0

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e,H as i,F as t}from"./index-bd96e8df.js";import{t as o}from"./i18n-80da5843.js";import{v as a}from"./show-d234ff64.js";import{w as r}from"./prop.validators-f89d26b4.js";import"./i18n-ece780dd.js";import"./reuse-523ba2ac.js";import"./index-db4aa6e4.js";import"./dev.utils-fab45cbc.js";const s=["cycle","dot","none"],l=(n,e)=>{r(n,"_variant",(n=>"string"==typeof n&&s.includes(n)),new Set(s),e)},d="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 44px;\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of 44px.\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\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  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n  .kol-span-wc {\n    display: grid;\n    place-items: center;\n  }\n  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  .kol-span-wc > span {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  /* This is the text label. */\n  .hide-label > .kol-span-wc > span > span {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span-wc,\n  [disabled]:focus .kol-span-wc {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .spin.cycle {\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n    height: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.cycle > .loader {\n    display: block;\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n    position: relative;\n    animation: 2s linear infinite rotate;\n  }\n  .spin.cycle > .loader::before {\n    content: \"\";\n    box-sizing: border-box;\n    position: absolute;\n    inset: 0px;\n    border-radius: 50%;\n    border: 5px solid #333;\n    animation: 3s linear infinite prixClipFix;\n  }\n  @keyframes rotate {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n  @keyframes prixClipFix {\n    0% {\n      border-color: #fff;\n      clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n    }\n    25% {\n      border-color: #666;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n    }\n    50% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);\n    }\n    75% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n    }\n    100% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .spin.cycle > .loader {\n      animation-duration: 4s;\n    }\n    .spin.cycle > .loader::before {\n      animation-duration: 6s;\n    }\n  }\n}\n@layer kol-component {\n  .spin.dot {\n    height: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span {\n    animation-timing-function: cubic-bezier(0, 1, 1, 0);\n    border-radius: 50%;\n    border: calc(0.16rem / var(--kolibri-root-font-size, 16)) solid #fff;\n    height: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    top: calc(0.16rem / var(--kolibri-root-font-size, 16));\n    width: calc(12.8rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:first-child {\n    background-color: #000;\n    z-index: 0;\n    animation: 1s infinite spin1;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:nth-child(2) {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:nth-child(3) {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(17.6rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:nth-child(4) {\n    background-color: #666;\n    z-index: 0;\n    animation: 1s infinite spin3;\n    left: calc(33.6rem / var(--kolibri-root-font-size, 16));\n  }\n  @keyframes spin1 {\n    0% {\n      transform: scale(0);\n    }\n    100% {\n      transform: scale(1);\n    }\n  }\n  @keyframes spin2 {\n    0% {\n      transform: translate(0, 0);\n    }\n    100% {\n      transform: translate(calc(16rem / var(--kolibri-root-font-size, 16)), 0);\n    }\n  }\n  @keyframes spin3 {\n    0% {\n      transform: scale(1);\n    }\n    100% {\n      transform: scale(0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .spin.dot > span:first-child,\n    .spin.dot > span:nth-child(2),\n    .spin.dot > span:nth-child(3),\n    .spin.dot > span:nth-child(4) {\n      animation-duration: 2s;\n    }\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin {\n    display: block;\n    padding: calc(2rem / var(--kolibri-root-font-size, 16));\n    position: relative;\n  }\n}",c=d;function p(n){switch(n){case"cycle":return e("span",{class:"loader"});case"none":return e("slot",{name:"expert"});default:return e(t,null,e("span",{class:"bg-spin-1"}),e("span",{class:"bg-spin-2"}),e("span",{class:"bg-spin-3"}),e("span",{class:"bg-neutral"}))}}const h=class{constructor(e){n(this,e),this.showToggled=!1,this._show=!1,this._variant="dot",this.state={_variant:"dot"}}render(){return e(i,{key:"36a0d00ecd7fddbb57232798eb8cb2f4156a4469",class:"kol-spin"},this.state._show?e("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&&e("span",{"aria-label":o("kol-action-done"),"aria-busy":"false","aria-live":"polite",role:"alert"}))}validateShow(n){this.showToggled=!0===this.state._show&&!1===this._show,a(this,n)}validateVariant(n){l(this,n)}componentWillLoad(){this.validateShow(this._show),this.validateVariant(this._variant)}static get watchers(){return{_show:["validateShow"],_variant:["validateVariant"]}}};h.style={default:c};export{h as kol_spin};
+import{r as n,h as e,H as i,F as t}from"./index-cf24d1fe.js";import{t as o}from"./i18n-8640d789.js";import{v as a}from"./show-430cafc2.js";import{w as r}from"./prop.validators-5a58fa40.js";import"./i18n-7ea9f137.js";import"./reuse-523ba2ac.js";import"./index-5728f164.js";import"./dev.utils-fab45cbc.js";const s=["cycle","dot","none"],l=(n,e)=>{r(n,"_variant",(n=>"string"==typeof n&&s.includes(n)),new Set(s),e)},d="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 44px;\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of 44px.\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\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  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n  .kol-span-wc {\n    display: grid;\n    place-items: center;\n  }\n  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  .kol-span-wc > span {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  /* This is the text label. */\n  .hide-label > .kol-span-wc > span > span {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span-wc,\n  [disabled]:focus .kol-span-wc {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .spin.cycle {\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n    height: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.cycle > .loader {\n    display: block;\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n    position: relative;\n    animation: 2s linear infinite rotate;\n  }\n  .spin.cycle > .loader::before {\n    content: \"\";\n    box-sizing: border-box;\n    position: absolute;\n    inset: 0px;\n    border-radius: 50%;\n    border: 5px solid #333;\n    animation: 3s linear infinite prixClipFix;\n  }\n  @keyframes rotate {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n  @keyframes prixClipFix {\n    0% {\n      border-color: #fff;\n      clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n    }\n    25% {\n      border-color: #666;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n    }\n    50% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);\n    }\n    75% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n    }\n    100% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .spin.cycle > .loader {\n      animation-duration: 4s;\n    }\n    .spin.cycle > .loader::before {\n      animation-duration: 6s;\n    }\n  }\n}\n@layer kol-component {\n  .spin.dot {\n    height: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span {\n    animation-timing-function: cubic-bezier(0, 1, 1, 0);\n    border-radius: 50%;\n    border: calc(0.16rem / var(--kolibri-root-font-size, 16)) solid #fff;\n    height: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    top: calc(0.16rem / var(--kolibri-root-font-size, 16));\n    width: calc(12.8rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:first-child {\n    background-color: #000;\n    z-index: 0;\n    animation: 1s infinite spin1;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:nth-child(2) {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:nth-child(3) {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(17.6rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin.dot > span:nth-child(4) {\n    background-color: #666;\n    z-index: 0;\n    animation: 1s infinite spin3;\n    left: calc(33.6rem / var(--kolibri-root-font-size, 16));\n  }\n  @keyframes spin1 {\n    0% {\n      transform: scale(0);\n    }\n    100% {\n      transform: scale(1);\n    }\n  }\n  @keyframes spin2 {\n    0% {\n      transform: translate(0, 0);\n    }\n    100% {\n      transform: translate(calc(16rem / var(--kolibri-root-font-size, 16)), 0);\n    }\n  }\n  @keyframes spin3 {\n    0% {\n      transform: scale(1);\n    }\n    100% {\n      transform: scale(0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .spin.dot > span:first-child,\n    .spin.dot > span:nth-child(2),\n    .spin.dot > span:nth-child(3),\n    .spin.dot > span:nth-child(4) {\n      animation-duration: 2s;\n    }\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .spin {\n    display: block;\n    padding: calc(2rem / var(--kolibri-root-font-size, 16));\n    position: relative;\n  }\n}",c=d;function p(n){switch(n){case"cycle":return e("span",{class:"loader"});case"none":return e("slot",{name:"expert"});default:return e(t,null,e("span",{class:"bg-spin-1"}),e("span",{class:"bg-spin-2"}),e("span",{class:"bg-spin-3"}),e("span",{class:"bg-neutral"}))}}const h=class{constructor(e){n(this,e),this.showToggled=!1,this._show=!1,this._variant="dot",this.state={_variant:"dot"}}render(){return e(i,{key:"1341f6f7b72ff1c95f3a73f163364342172d5cad",class:"kol-spin"},this.state._show?e("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&&e("span",{"aria-label":o("kol-action-done"),"aria-busy":"false","aria-live":"polite",role:"alert"}))}validateShow(n){this.showToggled=!0===this.state._show&&!1===this._show,a(this,n)}validateVariant(n){l(this,n)}componentWillLoad(){this.validateShow(this._show),this.validateVariant(this._variant)}static get watchers(){return{_show:["validateShow"],_variant:["validateVariant"]}}};h.style={default:c};export{h as kol_spin};

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e,H as t}from"./index-bd96e8df.js";import{t as i}from"./i18n-80da5843.js";import{c as s}from"./component-names-3e0158fe.js";import"./i18n-ece780dd.js";import"./reuse-523ba2ac.js";const o="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 44px;\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of 44px.\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\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  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n  .kol-span-wc {\n    display: grid;\n    place-items: center;\n  }\n  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  .kol-span-wc > span {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  /* This is the text label. */\n  .hide-label > .kol-span-wc > span > span {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span-wc,\n  [disabled]:focus .kol-span-wc {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: flex;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    position: relative;\n  }\n  .main-button {\n    flex-grow: 1;\n    text-align: left;\n  }\n  /* popover */\n  .popover {\n    height: 0;\n    left: 0;\n    min-width: 100%;\n    overflow: hidden;\n    position: absolute;\n    top: 100%;\n    transition: height 0.3s ease-in-out;\n  }\n  .popover-content {\n    inset: 0 0 auto 0;\n    min-width: 100%;\n    position: absolute;\n  }\n}",a=o,l=class{constructor(t){n(this,t),this.clickButtonHandler={onClick:n=>{var t,e;"function"==typeof(null===(t=this._on)||void 0===t?void 0:t.onClick)?null===(e=this._on)||void 0===e||e.onClick(n,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=n=>{("boolean"==typeof n?n:!this.state._show)?this.openDropdown():this.closeDropdown()},this.catchDropdownElements=n=>{n&&(this.dropdown=n,setTimeout((()=>{this.dropdownContent=n.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(){const n="kol-split-button-dropdown-label";return e(t,{key:"57c0996a78d88aea41fe2a363d45482f7c5ed056",class:"kol-split-button"},e(s,{key:"764b00607eb4243193beb6c9a478ddd2396d0276",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}),e("div",{key:"f4b869a38a12c26b45eeb7af2894c2fbbd4267c5",class:"horizontal-line"}),e(s,{key:"263999f6c54fec861b0f62185e96011f45694bce",class:"secondary-button",_disabled:this._disabled,_hideLabel:!0,_icons:"codicon codicon-triangle-down",_label:this.state._show?i(`${n}-close`):i(`${n}-open`),_on:this.clickToggleHandler}),e("div",{key:"5b3dc0a97c45ae4cd968c665649c94b9088285a6",class:"popover",ref:this.catchDropdownElements},e("div",{key:"62b6a8ee4c3074dbf85c31206d4dd1b2377593f7",class:"popover-content"},e("slot",{key:"14155229d44998fde6453b853b7f7271449d66b2"}))))}};l.style={default:a};export{l as kol_split_button};
+import{r as n,h as e,H as t}from"./index-cf24d1fe.js";import{t as i}from"./i18n-8640d789.js";import{q as o,c as s}from"./component-names-0a8a1a6c.js";import"./i18n-7ea9f137.js";import"./reuse-523ba2ac.js";const a="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 44px;\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of 44px.\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\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  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n  .kol-span-wc {\n    display: grid;\n    place-items: center;\n  }\n  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  .kol-span-wc > span {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  /* This is the text label. */\n  .hide-label > .kol-span-wc > span > span {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span-wc,\n  [disabled]:focus .kol-span-wc {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: flex;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    position: relative;\n  }\n  .split-button-root {\n    display: flex;\n    position: relative;\n  }\n  .main-button {\n    flex-grow: 1;\n    text-align: left;\n  }\n  .kol-popover .popover {\n    margin-top: calc(2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-popover .arrow {\n    display: none;\n  }\n}",l=a,r=class{constructor(e){n(this,e),this.clickButtonHandler={onClick:n=>{var e,t;"function"==typeof(null===(e=this._on)||void 0===e?void 0:e.onClick)?null===(t=this._on)||void 0===t||t.onClick(n,this._value):this.toggleDropdown()}},this.clickToggleHandler={onClick:()=>this.toggleDropdown()},this.toggleDropdown=()=>{this.state=Object.assign(Object.assign({},this.state),{_show:!this.state._show})},this.handleOnClose=()=>{this.state=Object.assign(Object.assign({},this.state),{_show:!1})},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(){const n="kol-split-button-dropdown-label";return e(t,{key:"37ae6c094c635a1bc78d02370e730ccf1ec2cdc0",class:"kol-split-button"},e("div",{key:"ed9ac9cc52557bc2387384da318969459239cb78",class:"split-button-root"},e(s,{key:"a84ee1b2813033b3efbe3de9efff5580ecea9a10",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}),e("div",{key:"f9339fd48f7356ae13778c0106b5a5df9eacbaaa",class:"horizontal-line"}),e(s,{key:"7094c820ed1d5310d7c64c3c1fbe31b8be9c56d6",class:"secondary-button",_disabled:this._disabled,_hideLabel:!0,_icons:"codicon codicon-triangle-down",_label:this.state._show?i(`${n}-close`):i(`${n}-open`),_on:this.clickToggleHandler})),e(o,{key:"826390e11aea4835fe3b1e44902901b915d740d6",_show:this.state._show,_on:{onClose:this.handleOnClose},_align:"bottom"},e("slot",{key:"8156ebb3e9cc9b7171e566b15511114348e38ebb"})))}closePopup(){this.handleOnClose()}};r.style={default:l};export{r as kol_split_button};

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

@@ -1 +1 @@
-{"version":3,"names":["defaultStyleCss","KolSplitButtonDefaultStyle0","KolSplitButton","this","clickButtonHandler","onClick","e","_a","_on","_b","_value","toggleDropdown","clickToggleHandler","openDropdown","dropdown","dropdownContent","style","height","clientHeight","state","Object","assign","_show","closeDropdown","value","openIt","catchDropdownElements","setTimeout","firstChild","render","i18nDropdownLabel","h","Host","key","class","KolButtonWcTag","button","_variant","_customClass","length","_ariaControls","_ariaExpanded","_ariaSelected","_disabled","_icons","_hideLabel","_label","_name","_role","_syncValueBySelector","_tabIndex","_tooltipAlign","_type","translate","ref"],"sources":["src/components/split-button/style.scss?tag=kol-split-button&mode=default&encapsulation=shadow","src/components/split-button/shadow.tsx"],"sourcesContent":["@import '../@shared/mixins';\n@import '../style';\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: flex;\n\t\tfont-size: rem(16);\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/* 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","import type {\n\tAlternativeButtonLinkRolePropType,\n\tButtonCallbacksPropType,\n\tButtonTypePropType,\n\tButtonVariantPropType,\n\tCustomClassPropType,\n\tIconsPropType,\n\tLabelPropType,\n\tNamePropType,\n\tSplitButtonProps,\n\tSplitButtonStates,\n\tStencilUnknown,\n\tStringified,\n\tSyncValueBySelectorPropType,\n\tTooltipAlignPropType,\n} from '../../schema';\nimport type { JSX } from '@stencil/core';\nimport { Component, h, Host, Prop, State } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { KolButtonWcTag } from '../../core/component-names';\n\n/**\n * @slot - Ermöglicht das Einfügen beliebigen HTMLs in das dropdown.\n */\n@Component({\n\ttag: 'kol-split-button',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolSplitButton implements SplitButtonProps /*, SplitButtonAPI*/ {\n\tprivate dropdown: HTMLDivElement | undefined;\n\tprivate dropdownContent: HTMLDivElement | undefined;\n\n\tprivate readonly clickButtonHandler = {\n\t\tonClick: (e: MouseEvent) => {\n\t\t\tif (typeof this._on?.onClick === 'function') {\n\t\t\t\t// TODO: this._on is not validated\n\t\t\t\tthis._on?.onClick(e, this._value);\n\t\t\t} else {\n\t\t\t\tthis.toggleDropdown();\n\t\t\t}\n\t\t},\n\t};\n\tprivate readonly clickToggleHandler = { onClick: () => this.toggleDropdown() };\n\n\tprivate readonly openDropdown = () => {\n\t\tif (this.dropdown && this.dropdownContent) {\n\t\t\tthis.dropdown.style.height = `${this.dropdownContent.clientHeight}px`;\n\t\t\tthis.state = { ...this.state, _show: true };\n\t\t}\n\t};\n\tprivate readonly closeDropdown = () => {\n\t\tif (this.dropdown && this.dropdownContent) {\n\t\t\tthis.dropdown.style.height = ``;\n\t\t\tthis.state = { ...this.state, _show: false };\n\t\t}\n\t};\n\tprivate readonly toggleDropdown = (value?: boolean) => {\n\t\tconst openIt = typeof value === 'boolean' ? value : !this.state._show;\n\t\tif (openIt) this.openDropdown();\n\t\telse this.closeDropdown();\n\t};\n\n\tprivate readonly catchDropdownElements = (e?: HTMLDivElement | null) => {\n\t\tif (e) {\n\t\t\tthis.dropdown = e;\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.dropdownContent = e.firstChild as HTMLDivElement;\n\t\t\t});\n\t\t}\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst i18nDropdownLabel = 'kol-split-button-dropdown-label';\n\t\treturn (\n\t\t\t<Host class=\"kol-split-button\">\n\t\t\t\t<KolButtonWcTag\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t'main-button': true,\n\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t}}\n\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t_customClass={this._customClass}\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_icons={this._icons}\n\t\t\t\t\t_hideLabel={this._hideLabel}\n\t\t\t\t\t_label={this._label}\n\t\t\t\t\t_name={this._name}\n\t\t\t\t\t_on={this.clickButtonHandler}\n\t\t\t\t\t_role={this._role}\n\t\t\t\t\t_syncValueBySelector={this._syncValueBySelector}\n\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t_type={this._type}\n\t\t\t\t\t_value={this._value}\n\t\t\t\t\t_variant={this._variant}\n\t\t\t\t></KolButtonWcTag>\n\t\t\t\t<div class=\"horizontal-line\"></div>\n\t\t\t\t<KolButtonWcTag\n\t\t\t\t\tclass=\"secondary-button\"\n\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t_hideLabel\n\t\t\t\t\t_icons=\"codicon codicon-triangle-down\"\n\t\t\t\t\t_label={this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`)}\n\t\t\t\t\t_on={this.clickToggleHandler}\n\t\t\t\t></KolButtonWcTag>\n\t\t\t\t<div class=\"popover\" ref={this.catchDropdownElements}>\n\t\t\t\t\t<div class=\"popover-content\">\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop() public _ariaExpanded?: boolean;\n\n\t/**\n\t * Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop() public _ariaSelected?: boolean;\n\n\t/**\n\t * Defines the custom class attribute if _variant=\"custom\" is set.\n\t */\n\t@Prop() public _customClass?: CustomClassPropType;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: IconsPropType;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: string;\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!: LabelPropType;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Defines the callback functions for button events.\n\t */\n\t@Prop() public _on?: ButtonCallbacksPropType<StencilUnknown>;\n\n\t/**\n\t * Defines the role of the components primary element.\n\t */\n\t@Prop() public _role?: AlternativeButtonLinkRolePropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Defines either the type of the component or of the components interactive element.\n\t */\n\t@Prop() public _type?: ButtonTypePropType = 'button';\n\n\t/**\n\t * Defines the value that the button emits on click.\n\t */\n\t@Prop() public _value?: Stringified<StencilUnknown>;\n\n\t/**\n\t * Defines which variant should be used for presentation.\n\t */\n\t@Prop() public _variant?: ButtonVariantPropType = 'normal';\n\n\t@State() public state: SplitButtonStates = {\n\t\t_show: false,\n\t};\n}\n"],"mappings":";;;sMAAA,MAAMA,EAAkB,89IACxB,MAAAC,EAAeD,E,MC+BFE,EAAc,M,yBAITC,KAAAC,mBAAqB,CACrCC,QAAUC,I,QACT,WAAWC,EAAAJ,KAAKK,OAAG,MAAAD,SAAA,SAAAA,EAAEF,WAAY,WAAY,EAE5CI,EAAAN,KAAKK,OAAG,MAAAC,SAAA,SAAAA,EAAEJ,QAAQC,EAAGH,KAAKO,O,KACpB,CACNP,KAAKQ,gB,IAISR,KAAAS,mBAAqB,CAAEP,QAAS,IAAMF,KAAKQ,kBAE3CR,KAAAU,aAAe,KAC/B,GAAIV,KAAKW,UAAYX,KAAKY,gBAAiB,CAC1CZ,KAAKW,SAASE,MAAMC,OAAS,GAAGd,KAAKY,gBAAgBG,iBACrDf,KAAKgB,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GAAQlB,KAAKgB,OAAK,CAAEG,MAAO,M,GAGtBnB,KAAAoB,cAAgB,KAChC,GAAIpB,KAAKW,UAAYX,KAAKY,gBAAiB,CAC1CZ,KAAKW,SAASE,MAAMC,OAAS,GAC7Bd,KAAKgB,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GAAQlB,KAAKgB,OAAK,CAAEG,MAAO,O,GAGtBnB,KAAAQ,eAAkBa,IAClC,MAAMC,SAAgBD,IAAU,UAAYA,GAASrB,KAAKgB,MAAMG,MAChE,GAAIG,EAAQtB,KAAKU,oBACZV,KAAKoB,eAAe,EAGTpB,KAAAuB,sBAAyBpB,IACzC,GAAIA,EAAG,CACNH,KAAKW,SAAWR,EAChBqB,YAAW,KACVxB,KAAKY,gBAAkBT,EAAEsB,UAA4B,G,qIA2EnB,M,gBAOC,M,4MA8CgB,M,WAKV,S,oCAUM,S,WAEP,CAC1CN,MAAO,M,CA7ID,MAAAO,GACN,MAAMC,EAAoB,kCAC1B,OACCC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,oBACXH,EAACI,EAAc,CAAAF,IAAA,2CACdC,MAAO,CACN,cAAe,KACfE,OAAQ,KACR,CAACjC,KAAKkC,UAAqBlC,KAAKkC,WAAa,SAC7C,CAAClC,KAAKmC,cAAyBnC,KAAKkC,WAAa,iBAAmBlC,KAAKmC,eAAiB,UAAYnC,KAAKmC,aAAaC,OAAS,GAElIC,cAAerC,KAAKqC,cACpBC,cAAetC,KAAKsC,cACpBC,cAAevC,KAAKuC,cACpBJ,aAAcnC,KAAKmC,aACnBK,UAAWxC,KAAKwC,UAChBC,OAAQzC,KAAKyC,OACbC,WAAY1C,KAAK0C,WACjBC,OAAQ3C,KAAK2C,OACbC,MAAO5C,KAAK4C,MACZvC,IAAKL,KAAKC,mBACV4C,MAAO7C,KAAK6C,MACZC,qBAAsB9C,KAAK8C,qBAC3BC,UAAW/C,KAAK+C,UAChBC,cAAehD,KAAKgD,cACpBC,MAAOjD,KAAKiD,MACZ1C,OAAQP,KAAKO,OACb2B,SAAUlC,KAAKkC,WAEhBN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oBACXH,EAACI,EAAc,CAAAF,IAAA,2CACdC,MAAM,mBACNS,UAAWxC,KAAKwC,UAChBE,WAAU,KACVD,OAAO,gCACPE,OAAQ3C,KAAKgB,MAAMG,MAAQ+B,EAAU,GAAGvB,WAA6BuB,EAAU,GAAGvB,UAClFtB,IAAKL,KAAKS,qBAEXmB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUoB,IAAKnD,KAAKuB,uBAC9BK,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mBACVH,EAAA,QAAAE,IAAA,+C","ignoreList":[]}
+{"version":3,"names":["defaultStyleCss","KolSplitButtonDefaultStyle0","KolSplitButton","this","clickButtonHandler","onClick","e","_a","_on","_b","_value","toggleDropdown","clickToggleHandler","state","Object","assign","_show","handleOnClose","render","i18nDropdownLabel","h","Host","key","class","KolButtonWcTag","button","_variant","_customClass","length","_ariaControls","_ariaExpanded","_ariaSelected","_disabled","_icons","_hideLabel","_label","_name","_role","_syncValueBySelector","_tabIndex","_tooltipAlign","_type","translate","KolPopoverWcTag","onClose","_align","closePopup"],"sources":["src/components/split-button/style.scss?tag=kol-split-button&mode=default&encapsulation=shadow","src/components/split-button/shadow.tsx"],"sourcesContent":["@import '../@shared/mixins';\n@import '../style';\n\n@layer kol-component {\n\t:host {\n\t\tdisplay: flex;\n\t\tfont-size: rem(16);\n\t\tposition: relative;\n\t}\n\n\t.split-button-root {\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.kol-popover {\n\t\t.popover {\n\t\t\tmargin-top: rem(2);\n\t\t}\n\n\t\t.arrow {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n}\n","import type {\n\tAlternativeButtonLinkRolePropType,\n\tButtonCallbacksPropType,\n\tButtonTypePropType,\n\tButtonVariantPropType,\n\tCustomClassPropType,\n\tIconsPropType,\n\tLabelPropType,\n\tNamePropType,\n\tSplitButtonProps,\n\tSplitButtonStates,\n\tStencilUnknown,\n\tStringified,\n\tSyncValueBySelectorPropType,\n\tTooltipAlignPropType,\n} from '../../schema';\nimport type { JSX } from '@stencil/core';\nimport { Component, h, Host, Method, Prop, State } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { KolButtonWcTag, KolPopoverWcTag } from '../../core/component-names';\n\n/**\n * @slot - Ermöglicht das Einfügen beliebigen HTMLs in das dropdown.\n */\n@Component({\n\ttag: 'kol-split-button',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolSplitButton implements SplitButtonProps /*, SplitButtonAPI*/ {\n\tprivate readonly clickButtonHandler = {\n\t\tonClick: (e: MouseEvent) => {\n\t\t\tif (typeof this._on?.onClick === 'function') {\n\t\t\t\t// TODO: this._on is not validated\n\t\t\t\tthis._on?.onClick(e, this._value);\n\t\t\t} else {\n\t\t\t\tthis.toggleDropdown();\n\t\t\t}\n\t\t},\n\t};\n\tprivate readonly clickToggleHandler = { onClick: () => this.toggleDropdown() };\n\n\tprivate readonly toggleDropdown = () => {\n\t\tthis.state = { ...this.state, _show: !this.state._show };\n\t};\n\n\tprivate readonly handleOnClose = () => {\n\t\tthis.state = { ...this.state, _show: false };\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst i18nDropdownLabel = 'kol-split-button-dropdown-label';\n\t\treturn (\n\t\t\t<Host class=\"kol-split-button\">\n\t\t\t\t<div class=\"split-button-root\">\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t'main-button': true,\n\t\t\t\t\t\t\tbutton: true,\n\t\t\t\t\t\t\t[this._variant as string]: this._variant !== 'custom',\n\t\t\t\t\t\t\t[this._customClass as string]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\t_ariaControls={this._ariaControls}\n\t\t\t\t\t\t_ariaExpanded={this._ariaExpanded}\n\t\t\t\t\t\t_ariaSelected={this._ariaSelected}\n\t\t\t\t\t\t_customClass={this._customClass}\n\t\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t\t_icons={this._icons}\n\t\t\t\t\t\t_hideLabel={this._hideLabel}\n\t\t\t\t\t\t_label={this._label}\n\t\t\t\t\t\t_name={this._name}\n\t\t\t\t\t\t_on={this.clickButtonHandler}\n\t\t\t\t\t\t_role={this._role}\n\t\t\t\t\t\t_syncValueBySelector={this._syncValueBySelector}\n\t\t\t\t\t\t_tabIndex={this._tabIndex}\n\t\t\t\t\t\t_tooltipAlign={this._tooltipAlign}\n\t\t\t\t\t\t_type={this._type}\n\t\t\t\t\t\t_value={this._value}\n\t\t\t\t\t\t_variant={this._variant}\n\t\t\t\t\t></KolButtonWcTag>\n\t\t\t\t\t<div class=\"horizontal-line\"></div>\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass=\"secondary-button\"\n\t\t\t\t\t\t_disabled={this._disabled}\n\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t_icons=\"codicon codicon-triangle-down\"\n\t\t\t\t\t\t_label={this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`)}\n\t\t\t\t\t\t_on={this.clickToggleHandler}\n\t\t\t\t\t></KolButtonWcTag>\n\t\t\t\t</div>\n\t\t\t\t<KolPopoverWcTag _show={this.state._show} _on={{ onClose: this.handleOnClose }} _align=\"bottom\">\n\t\t\t\t\t<slot />\n\t\t\t\t</KolPopoverWcTag>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Method()\n\tpublic closePopup() {\n\t\tthis.handleOnClose();\n\t}\n\n\t/**\n\t * Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)\n\t */\n\t@Prop() public _ariaControls?: string;\n\n\t/**\n\t * Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)\n\t */\n\t@Prop() public _ariaExpanded?: boolean;\n\n\t/**\n\t * Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)\n\t */\n\t@Prop() public _ariaSelected?: boolean;\n\n\t/**\n\t * Defines the custom class attribute if _variant=\"custom\" is set.\n\t */\n\t@Prop() public _customClass?: CustomClassPropType;\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t */\n\t@Prop() public _disabled?: boolean = false;\n\n\t/**\n\t * Hides the caption by default and displays the caption text with a tooltip when the\n\t * interactive element is focused or the mouse is over it.\n\t * @TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hideLabel?: boolean = false;\n\n\t/**\n\t * Defines the icon classnames (e.g. `_icons=\"fa-solid fa-user\"`).\n\t */\n\t@Prop() public _icons?: IconsPropType;\n\n\t/**\n\t * Defines the internal ID of the primary component element.\n\t */\n\t@Prop() public _id?: string;\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!: LabelPropType;\n\n\t/**\n\t * Defines the technical name of an input field.\n\t */\n\t@Prop() public _name?: NamePropType;\n\n\t/**\n\t * Defines the callback functions for button events.\n\t */\n\t@Prop() public _on?: ButtonCallbacksPropType<StencilUnknown>;\n\n\t/**\n\t * Defines the role of the components primary element.\n\t */\n\t@Prop() public _role?: AlternativeButtonLinkRolePropType;\n\n\t/**\n\t * Selector for synchronizing the value with another input element.\n\t * @internal\n\t */\n\t@Prop() public _syncValueBySelector?: SyncValueBySelectorPropType;\n\n\t/**\n\t * Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)\n\t */\n\t@Prop() public _tabIndex?: number;\n\n\t/**\n\t * Defines where to show the Tooltip preferably: top, right, bottom or left.\n\t */\n\t@Prop() public _tooltipAlign?: TooltipAlignPropType = 'top';\n\n\t/**\n\t * Defines either the type of the component or of the components interactive element.\n\t */\n\t@Prop() public _type?: ButtonTypePropType = 'button';\n\n\t/**\n\t * Defines the value that the button emits on click.\n\t */\n\t@Prop() public _value?: Stringified<StencilUnknown>;\n\n\t/**\n\t * Defines which variant should be used for presentation.\n\t */\n\t@Prop() public _variant?: ButtonVariantPropType = 'normal';\n\n\t@State() public state: SplitButtonStates = {\n\t\t_show: false,\n\t};\n}\n"],"mappings":";;;6MAAA,MAAMA,EAAkB,u5IACxB,MAAAC,EAAeD,E,MC+BFE,EAAc,M,yBACTC,KAAAC,mBAAqB,CACrCC,QAAUC,I,QACT,WAAWC,EAAAJ,KAAKK,OAAG,MAAAD,SAAA,SAAAA,EAAEF,WAAY,WAAY,EAE5CI,EAAAN,KAAKK,OAAG,MAAAC,SAAA,SAAAA,EAAEJ,QAAQC,EAAGH,KAAKO,O,KACpB,CACNP,KAAKQ,gB,IAISR,KAAAS,mBAAqB,CAAEP,QAAS,IAAMF,KAAKQ,kBAE3CR,KAAAQ,eAAiB,KACjCR,KAAKU,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GAAQZ,KAAKU,OAAK,CAAEG,OAAQb,KAAKU,MAAMG,OAAO,EAGxCb,KAAAc,cAAgB,KAChCd,KAAKU,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GAAQZ,KAAKU,OAAK,CAAEG,MAAO,OAAO,E,kIA8ER,M,gBAOC,M,4MA8CgB,M,WAKV,S,oCAUM,S,WAEP,CAC1CA,MAAO,M,CAlJD,MAAAE,GACN,MAAMC,EAAoB,kCAC1B,OACCC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,oBACXH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qBACVH,EAACI,EAAc,CAAAF,IAAA,2CACdC,MAAO,CACN,cAAe,KACfE,OAAQ,KACR,CAACtB,KAAKuB,UAAqBvB,KAAKuB,WAAa,SAC7C,CAACvB,KAAKwB,cAAyBxB,KAAKuB,WAAa,iBAAmBvB,KAAKwB,eAAiB,UAAYxB,KAAKwB,aAAaC,OAAS,GAElIC,cAAe1B,KAAK0B,cACpBC,cAAe3B,KAAK2B,cACpBC,cAAe5B,KAAK4B,cACpBJ,aAAcxB,KAAKwB,aACnBK,UAAW7B,KAAK6B,UAChBC,OAAQ9B,KAAK8B,OACbC,WAAY/B,KAAK+B,WACjBC,OAAQhC,KAAKgC,OACbC,MAAOjC,KAAKiC,MACZ5B,IAAKL,KAAKC,mBACViC,MAAOlC,KAAKkC,MACZC,qBAAsBnC,KAAKmC,qBAC3BC,UAAWpC,KAAKoC,UAChBC,cAAerC,KAAKqC,cACpBC,MAAOtC,KAAKsC,MACZ/B,OAAQP,KAAKO,OACbgB,SAAUvB,KAAKuB,WAEhBN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oBACXH,EAACI,EAAc,CAAAF,IAAA,2CACdC,MAAM,mBACNS,UAAW7B,KAAK6B,UAChBE,WAAU,KACVD,OAAO,gCACPE,OAAQhC,KAAKU,MAAMG,MAAQ0B,EAAU,GAAGvB,WAA6BuB,EAAU,GAAGvB,UAClFX,IAAKL,KAAKS,sBAGZQ,EAACuB,EAAe,CAAArB,IAAA,2CAACN,MAAOb,KAAKU,MAAMG,MAAOR,IAAK,CAAEoC,QAASzC,KAAKc,eAAiB4B,OAAO,UACtFzB,EAAA,QAAAE,IAAA,8C,CAOG,UAAAwB,GACN3C,KAAKc,e","ignoreList":[]}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as e,h as s,H as t}from"./index-bd96e8df.js";import{t as a}from"./i18n-80da5843.js";import{v as i}from"./label-37acddfe.js";import{i as r}from"./prop.validators-f89d26b4.js";import"./i18n-ece780dd.js";import"./reuse-523ba2ac.js";import"./index-db4aa6e4.js";import"./dev.utils-fab45cbc.js";const o=class{constructor(s){e(this,s),this._label=void 0,this._symbol=void 0,this.state={_label:a("kol-warning"),_symbol:""}}render(){return s(t,{key:"2711e2082f70710031e13f8f657f2f12a78bf71e",class:"kol-symbol"},s("span",{key:"e89bc00f1b8dab5bd7e703c41b4d46bc598004e4","aria-label":this.state._label,role:"term"},this.state._symbol))}validateLabel(a){i(this,a,{required:!0})}validateSymbol(a){r(this,"_symbol",a,{required:!0})}componentWillLoad(){this.validateLabel(this._label),this.validateSymbol(this._symbol)}static get watchers(){return{_label:["validateLabel"],_symbol:["validateSymbol"]}}};export{o as kol_symbol};
+import{r as a,h as e,H as s}from"./index-cf24d1fe.js";import{t}from"./i18n-8640d789.js";import{v as i}from"./label-084ed1e7.js";import{i as r}from"./prop.validators-5a58fa40.js";import"./i18n-7ea9f137.js";import"./reuse-523ba2ac.js";import"./index-5728f164.js";import"./dev.utils-fab45cbc.js";const o=class{constructor(s){a(this,s),this._label=void 0,this._symbol=void 0,this.state={_label:t("kol-warning"),_symbol:""}}render(){return e(s,{key:"0cf724ad64920f8a2a9818302ad4ec9d428c52b2",class:"kol-symbol"},e("span",{key:"46cacaa73fc9b86e9f008d69216dd4b14ca58210","aria-label":this.state._label,role:"term"},this.state._symbol))}validateLabel(a){i(this,a,{required:!0})}validateSymbol(a){r(this,"_symbol",a,{required:!0})}componentWillLoad(){this.validateLabel(this._label),this.validateSymbol(this._symbol)}static get watchers(){return{_label:["validateLabel"],_symbol:["validateSymbol"]}}};export{o as kol_symbol};

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

@@ -1 +1 @@
-{"version":3,"names":["KolSymbol","_label","translate","_symbol","render","h","Host","key","class","this","state","role","validateLabel","value","required","validateSymbol","watchString","componentWillLoad"],"sources":["src/components/symbol/component.tsx"],"sourcesContent":["import type { LabelPropType, SymbolAPI, SymbolStates } from '../../schema';\nimport { validateLabel, watchString } from '../../schema';\nimport { Component, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\n\nimport type { JSX } from '@stencil/core';\n@Component({\n\ttag: 'kol-symbol',\n\tshadow: false,\n})\nexport class KolSymbol implements SymbolAPI {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host class=\"kol-symbol\">\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: SymbolStates = {\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\t\trequired: true,\n\t\t});\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":";;;gTAWaA,EAAS,M,iFAqBiB,CACrCC,OAAQC,EAAU,eAClBC,QAAS,G,CAtBH,MAAAC,GACN,OACCC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,cACXH,EAAA,QAAAE,IAAA,wDAAkBE,KAAKC,MAAMT,OAAQU,KAAK,QACxCF,KAAKC,MAAMP,S,CAsBT,aAAAS,CAAcC,GACpBD,EAAcH,KAAMI,EAAO,CAC1BC,SAAU,M,CAKL,cAAAC,CAAeF,GACrBG,EAAYP,KAAM,UAAWI,EAAO,CACnCC,SAAU,M,CAIL,iBAAAG,GACNR,KAAKG,cAAcH,KAAKR,QACxBQ,KAAKM,eAAeN,KAAKN,Q","ignoreList":[]}
+{"version":3,"names":["KolSymbol","_label","translate","_symbol","render","h","Host","key","class","this","state","role","validateLabel","value","required","validateSymbol","watchString","componentWillLoad"],"sources":["src/components/symbol/component.tsx"],"sourcesContent":["import type { LabelPropType, SymbolAPI, SymbolStates } from '../../schema';\nimport { validateLabel, watchString } from '../../schema';\nimport { Component, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { translate } from '../../i18n';\n\nimport type { JSX } from '@stencil/core';\n@Component({\n\ttag: 'kol-symbol',\n\tshadow: false,\n})\nexport class KolSymbol implements SymbolAPI {\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host class=\"kol-symbol\">\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: SymbolStates = {\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\t\trequired: true,\n\t\t});\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":";;;2SAWaA,EAAS,M,iFAqBiB,CACrCC,OAAQC,EAAU,eAClBC,QAAS,G,CAtBH,MAAAC,GACN,OACCC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,cACXH,EAAA,QAAAE,IAAA,wDAAkBE,KAAKC,MAAMT,OAAQU,KAAK,QACxCF,KAAKC,MAAMP,S,CAsBT,aAAAS,CAAcC,GACpBD,EAAcH,KAAMI,EAAO,CAC1BC,SAAU,M,CAKL,cAAAC,CAAeF,GACrBG,EAAYP,KAAM,UAAWI,EAAO,CACnCC,SAAU,M,CAIL,iBAAAG,GACNR,KAAKG,cAAcH,KAAKR,QACxBQ,KAAKM,eAAeN,KAAKN,Q","ignoreList":[]}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as n,H as i,g as e}from"./index-bd96e8df.js";import{t as o}from"./i18n-80da5843.js";import{t as a,r as s}from"./component-names-3e0158fe.js";import{t as l}from"./events-29e84d75.js";import{v as h,a as r,b as d,c,E as u}from"./events-9570402d.js";import{w as p,s as f,t as b,i as m,p as g,o as v,j as y}from"./prop.validators-f89d26b4.js";import{v as w}from"./label-37acddfe.js";import"./i18n-ece780dd.js";import"./reuse-523ba2ac.js";import"./common-54bf85ba.js";import"./index-db4aa6e4.js";import"./dev.utils-fab45cbc.js";const k=["top","bottom","both"],_=(t,n)=>{p(t,"_paginationPosition",(t=>"string"==typeof t&&k.includes(t)),new Set([`PaginationPositionPropType {${k.join(", ")}`]),n,{defaultValue:"bottom"})},S="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 44px;\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of 44px.\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\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  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n  .kol-span-wc {\n    display: grid;\n    place-items: center;\n  }\n  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  .kol-span-wc > span {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  /* This is the text label. */\n  .hide-label > .kol-span-wc > span > span {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span-wc,\n  [disabled]:focus .kol-span-wc {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :root {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  div.pagination .kol-pagination {\n    display: flex;\n    flex-wrap: wrap;\n  }\n  div.pagination,\n  div.pagination > div:last-child {\n    display: grid;\n    place-items: center;\n  }\n  @media (max-width: 1024px) {\n    div.pagination .kol-pagination {\n      flex-direction: column;\n    }\n  }\n  @media (min-width: 1024px) {\n    div.pagination,\n    div.pagination > div:last-child {\n      grid-auto-flow: column;\n    }\n    div.pagination .kol-pagination {\n      display: flex;\n    }\n  }\n}\n@layer kol-component {\n  :host,\n  .kol-table-stateless-wc {\n    display: block;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .table {\n    max-width: 100%;\n    overflow-x: auto;\n    overflow-y: hidden;\n  }\n  table {\n    width: 100%;\n  }\n  caption {\n    text-align: start;\n  }\n  .focus-element {\n    font-size: 0;\n  }\n  .focus-element:focus {\n    outline: 0 !important;\n  }\n  .table:has(.focus-element:focus) {\n    /* @see https://remysharp.com/til/css/focus-ring-default-styles */\n    outline: 5px auto Highlight;\n    outline: 5px auto -webkit-focus-ring-color;\n    outline-offset: 2px;\n  }\n  .table-sort-button .button {\n    color: inherit;\n  }\n  tbody th,\n  th.align-left {\n    text-align: left;\n  }\n  tbody th .table-sort-button .button-inner,\n  th.align-left .table-sort-button .button-inner {\n    justify-items: start;\n  }\n  th.align-center {\n    text-align: center;\n  }\n  th.align-center .table-sort-button .button-inner {\n    justify-items: center;\n  }\n  th.align-right {\n    text-align: right;\n  }\n  th.align-right .table-sort-button .button-inner {\n    justify-items: end;\n  }\n  .selection-header-cell {\n    width: 0;\n  }\n  .selection-cell {\n    width: var(--a11y-min-size);\n    height: var(--a11y-min-size);\n    white-space: nowrap;\n  }\n  .input label {\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    height: var(--a11y-min-size);\n    justify-content: center;\n    position: relative;\n    width: var(--a11y-min-size);\n  }\n  .input .icon {\n    display: block;\n    inset: auto;\n    position: absolute;\n    z-index: 1;\n  }\n  .input input {\n    appearance: none;\n    border-style: solid;\n    cursor: pointer;\n    margin: 0;\n  }\n  .input input:before {\n    content: \"\";\n  }\n  .input input[type=checkbox] {\n    position: relative;\n    display: flex;\n    height: calc(var(--a11y-min-size) / 2);\n    width: calc(var(--a11y-min-size) / 2);\n    align-items: center;\n    justify-content: center;\n    background-color: rgb(255, 255, 255);\n    border-width: 2px;\n    line-height: 24px;\n    transition: all 0.5s ease 0s;\n  }\n  .input input[type=radio] {\n    display: flex;\n    border-width: 2px;\n    border-radius: 100%;\n    height: 1.5em;\n    min-height: 1.5em;\n    min-width: 1.5em;\n    padding: 0;\n    width: 1.5em;\n  }\n  .input input[type=radio]:before {\n    border-radius: 100%;\n    margin: auto;\n    height: 0.75em;\n    width: 0.75em;\n  }\n  .input input[type=radio]:checked:before {\n    background-color: #000;\n  }\n  @media (forced-colors: active) {\n    .input input[type=radio]:checked:before {\n      /* Give it a visible background in forced colors mode */\n      background: selectedItem !important;\n    }\n  }\n}",x=S,j=[10,20,50,100],z=t=>!0===t||""===t||"object"==typeof t&&null!==t,C=class{constructor(n){t(this,n),this.catchRef=t=>{this.tableWcRef=t},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.setSortDirection=(t,n)=>{this.sortDirections.clear(),this.sortDirections.set(t,n),this.sortFunction=t},this.handlePagination={onClick:(t,n)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onClick)&&this.state._pagination._on.onClick(t,n),f(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:n}))},onChangePage:(t,n)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePage)&&this.state._pagination._on.onChangePage(t,n),f(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:n}))},onChangePageSize:(t,n)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePageSize)&&this.state._pagination._on.onChangePageSize(t,n),f(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_pageSize:n})),f(this,"_pageSize",n)}},this.onSelectionChange=t=>{t.stopPropagation()},this.updateSortedData=(t=this.sortedColumnHead)=>{if(this.disableSort)return void f(this,"_sortedData",this.state._data);let n=this.state._data;if(this.sortData.length>0)n=this.state._data.sort(((t,n)=>{for(let e=0;e<this.sortData.length;e++){const i=this.sortData[e],a=i.compareFn(t,n);if(0!==a)return"ASC"===i.direction?a:-a}return 0}));else if("function"==typeof this.sortFunction)switch(this.sortDirections.get(this.sortFunction)){case"ASC":n=this.sortFunction([...this.state._data]),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"ASC"};break;case"DESC":n=this.sortFunction([...this.state._data]).reverse(),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"DESC"};break;default:n=[...this.state._data],this.sortedColumnHead={label:"",key:"",sortDirection:"NOS"}}f(this,"_sortedData",n)},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._paginationPosition="bottom",this._selection=void 0,this._on=void 0,this.state={_allowMultiSort:!1,_data:[],_dataFoot:[],_headers:{horizontal:[],vertical:[]},_label:"",_pagination:{_page:1,_pageSize:10,_max:0},_sortedData:[],_paginationPosition:"bottom"}}validateAllowMultiSort(t){p(this,"_allowMultiSort",(()=>!0),new Set(["boolean"]),t,{defaultValue:!1})}validateData(t){h(this,t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}validateDataFoot(t){r(this,t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}validatePaginationPosition(t){_(this,t)}changeCellSort(t){var n;if("function"==typeof t.compareFn){this.state._allowMultiSort||t.key==(null===(n=this.sortData[0])||void 0===n?void 0:n.key)||(this.sortData=[]);const e=this.sortData.findIndex((n=>n.key===t.key));if(e>=0){const t=this.sortData[e];switch(t.direction){case"ASC":t.direction="DESC";break;case"DESC":this.sortData.splice(e,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){b(t,(()=>{v(t,(()=>{try{t=g(t)}catch(t){}p(this,"_headers",(t=>"object"==typeof t&&null!==t),new Set(["KoliBriTableHeaders"]),t,{hooks:{beforePatch:t=>{var n,e,i,a;const o=t=>{let n=!1;t.forEach((t=>{const e=t.key;if(!e)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:e,compareFn:t.compareFn,direction:i}),n=!0):"function"==typeof t.sort&&(this.setSortDirection(t.sort,i),setTimeout((()=>this.updateSortedData({key:e,label:t.label,sortDirection:i})))))})),n&&setTimeout((()=>this.updateSortedData()))},s=t;null===(n=s.horizontal)||void 0===n||n.forEach(o),null===(e=s.vertical)||void 0===e||e.forEach(o),s.horizontal&&s.vertical&&(null===(i=s.horizontal)||void 0===i?void 0:i.length)>0&&(null===(a=s.vertical)||void 0===a?void 0:a.length)>0&&(this.disableSort=!0,y("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){w(this,t,{required:!0})}validateMinWidth(t){m(this,"_minWidth",t,{defaultValue:void 0})}validateSelection(t){d(this,t)}validateOn(t){c(this,t)}validatePagination(t){try{t=g(t)}catch(t){}this.showPagination=z(t),p(this,"_pagination",z,new Set(["boolean","KoliBriTablePagination"]),t,{defaultValue:{_page:1,_pageSize:10,_max:0}})}componentDidLoad(){var t;null===(t=this.tableWcRef)||void 0===t||t.addEventListener("kol-selection-change",this.onSelectionChange)}disconnectedCallback(){var t;null===(t=this.tableWcRef)||void 0===t||t.removeEventListener("kol-selection-change",this.onSelectionChange)}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),this.validatePaginationPosition(this._paginationPosition),this.validateSelection(this._selection),this.validateOn(this._on)}selectDisplayedData(t,n,e){return"number"==typeof n&&n>0&&"number"==typeof e&&e>0?(this.pageStartSlice=n*(e-1),this.pageEndSlice=n*e>t.length?t.length:n*e,t.slice(this.pageStartSlice,this.pageEndSlice)):(this.pageStartSlice=0,this.pageEndSlice=t.length,t)}renderPagination(){return n("div",{class:"pagination"},n("span",null,o("kol-table-visible-range",{placeholders:{start:this.pageEndSlice>0?(this.pageStartSlice+1).toString():"0",end:this.pageEndSlice.toString(),total:this.state._pagination&&this.state._pagination._max>0?this.state._pagination._max.toString():Array.isArray(this.state._data)?this.state._data.length.toString():"0"}})),n("div",null,n(a,{_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||j,_siblingCount:this.state._pagination._siblingCount,_tooltipAlign:"bottom",_max:this.state._pagination._max||this.state._pagination._max||this.state._data.length,_label:o("kol-table-pagination-label",{placeholders:{label:this.state._label}})})))}getHeaderCellSortState(t){if(!this.disableSort&&("function"==typeof t.compareFn||"function"==typeof t.sort)){if(t.key===this.sortedColumnHead.key)return this.sortedColumnHead.sortDirection;if(t.key){const n=this.sortData.find((n=>n.key===t.key));if(null==n?void 0:n.direction)return n.direction}return"NOS"}}handleSort({key:t}){const n=[...(this.state._headers.horizontal||[]).flat(),...(this.state._headers.vertical||[]).flat()].find((n=>n.key===t));n&&this.changeCellSort(n)}getSelectedData(t){var n;const e=this.state._selection;if(e){const i=null!==(n=e.keyPropertyName)&&void 0!==n?n:"id",a=this.state._sortedData.filter((n=>t.includes(n[i])));if(!1===(null==e?void 0:e.multiple))return a[0];if(i)return a}return null}handleSelectionChange(t,n){var e;const i=this.state._selection;i&&(this.state=Object.assign(Object.assign({},this.state),{_selection:Object.assign(Object.assign({},i),{selectedKeys:"object"==typeof n?n:[n]})}));const a=this.getSelectedData(n);l("selection-change",this.host,a),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e[u.onSelectionChange])&&this.state._on[u.onSelectionChange](t,a)}async getSelection(){var t;const n=(null===(t=this.state._selection)||void 0===t?void 0:t.selectedKeys)||[];return this.getSelectedData(n)}render(){var t,e,a,o;const l=this.selectDisplayedData(this.state._sortedData,this.showPagination?null!==(e=null===(t=this.state._pagination)||void 0===t?void 0:t._pageSize)&&void 0!==e?e:10:this.state._sortedData.length,this.state._pagination._page||1),r="top"===this._paginationPosition||"both"===this._paginationPosition?this.renderPagination():null,h="bottom"===this._paginationPosition||"both"===this._paginationPosition?this.renderPagination():null,d={horizontal:null===(a=this.state._headers.horizontal)||void 0===a?void 0:a.map((t=>t.map((t=>Object.assign(Object.assign({},t),{sortDirection:this.getHeaderCellSortState(t)}))))),vertical:null===(o=this.state._headers.vertical)||void 0===o?void 0:o.map((t=>t.map((t=>Object.assign(Object.assign({},t),{sortDirection:this.getHeaderCellSortState(t)})))))};return n(i,{key:"2aa8202c7e3365f58dc723cd101a9903eb1badad",class:"kol-table-stateful"},this.pageEndSlice>0&&this.showPagination&&r,n(s,{key:"e8246a742b129c27a624907a486bf1462ff35f35",ref:this.catchRef,_data:l,_headerCells:d,_label:this.state._label,_dataFoot:this.state._dataFoot,_minWidth:this.state._minWidth,_on:{onSort:(t,n)=>{this.handleSort(n)},onSelectionChange:(t,n)=>{this.handleSelectionChange(t,n)}},_selection:this.state._selection}),this.pageEndSlice>0&&this.showPagination&&h)}get host(){return e(this)}static get watchers(){return{_allowMultiSort:["validateAllowMultiSort"],_data:["validateData"],_dataFoot:["validateDataFoot"],_paginationPosition:["validatePaginationPosition"],_headers:["validateHeaders"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_selection:["validateSelection"],_on:["validateOn"],_pagination:["validatePagination"]}}};C.style={default:x};export{C as kol_table_stateful};
+import{r as t,h as n,H as i,g as e}from"./index-cf24d1fe.js";import{t as o}from"./i18n-8640d789.js";import{u as a,t as s}from"./component-names-0a8a1a6c.js";import{t as l}from"./events-29e84d75.js";import{v as h,a as r,b as d,c,E as u}from"./events-476662bc.js";import{w as p,s as f,t as b,i as m,p as g,o as v,j as y}from"./prop.validators-5a58fa40.js";import{v as w}from"./label-084ed1e7.js";import"./i18n-7ea9f137.js";import"./reuse-523ba2ac.js";import"./common-54bf85ba.js";import"./index-5728f164.js";import"./dev.utils-fab45cbc.js";const k=["top","bottom","both"],_=(t,n)=>{p(t,"_paginationPosition",(t=>"string"==typeof t&&k.includes(t)),new Set([`PaginationPositionPropType {${k.join(", ")}`]),n,{defaultValue:"bottom"})},S="/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 44px;\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of 44px.\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\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  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n  .kol-span-wc {\n    display: grid;\n    place-items: center;\n  }\n  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  .kol-span-wc > span {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  /* This is the text label. */\n  .hide-label > .kol-span-wc > span > span {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span-wc,\n  [disabled]:focus .kol-span-wc {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :root {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  div.pagination .kol-pagination {\n    display: flex;\n    flex-wrap: wrap;\n  }\n  div.pagination,\n  div.pagination > div:last-child {\n    display: grid;\n    place-items: center;\n  }\n  @media (max-width: 1024px) {\n    div.pagination .kol-pagination {\n      flex-direction: column;\n    }\n  }\n  @media (min-width: 1024px) {\n    div.pagination,\n    div.pagination > div:last-child {\n      grid-auto-flow: column;\n    }\n    div.pagination .kol-pagination {\n      display: flex;\n    }\n  }\n}\n@layer kol-component {\n  :host,\n  .kol-table-stateless-wc {\n    display: block;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .table {\n    max-width: 100%;\n    overflow-x: auto;\n    overflow-y: hidden;\n  }\n  table {\n    width: 100%;\n  }\n  caption {\n    text-align: start;\n  }\n  .focus-element {\n    font-size: 0;\n  }\n  .focus-element:focus {\n    outline: 0 !important;\n  }\n  .table:has(.focus-element:focus) {\n    /* @see https://remysharp.com/til/css/focus-ring-default-styles */\n    outline: 5px auto Highlight;\n    outline: 5px auto -webkit-focus-ring-color;\n    outline-offset: 2px;\n  }\n  .table-sort-button .button {\n    color: inherit;\n  }\n  tbody th,\n  th.align-left {\n    text-align: left;\n  }\n  tbody th .table-sort-button .button-inner,\n  th.align-left .table-sort-button .button-inner {\n    justify-items: start;\n  }\n  th.align-center {\n    text-align: center;\n  }\n  th.align-center .table-sort-button .button-inner {\n    justify-items: center;\n  }\n  th.align-right {\n    text-align: right;\n  }\n  th.align-right .table-sort-button .button-inner {\n    justify-items: end;\n  }\n  .selection-header-cell {\n    width: 0;\n  }\n  .selection-cell {\n    width: var(--a11y-min-size);\n    height: var(--a11y-min-size);\n    white-space: nowrap;\n  }\n  .input label {\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    height: var(--a11y-min-size);\n    justify-content: center;\n    position: relative;\n    width: var(--a11y-min-size);\n  }\n  .input .icon {\n    display: block;\n    inset: auto;\n    position: absolute;\n    z-index: 1;\n  }\n  .input input {\n    appearance: none;\n    border-style: solid;\n    cursor: pointer;\n    margin: 0;\n  }\n  .input input:before {\n    content: \"\";\n  }\n  .input input[type=checkbox] {\n    position: relative;\n    display: flex;\n    height: calc(var(--a11y-min-size) / 2);\n    width: calc(var(--a11y-min-size) / 2);\n    align-items: center;\n    justify-content: center;\n    background-color: rgb(255, 255, 255);\n    border-width: 2px;\n    line-height: 24px;\n    transition: all 0.5s ease 0s;\n  }\n  .input input[type=radio] {\n    display: flex;\n    border-width: 2px;\n    border-radius: 100%;\n    height: 1.5em;\n    min-height: 1.5em;\n    min-width: 1.5em;\n    padding: 0;\n    width: 1.5em;\n  }\n  .input input[type=radio]:before {\n    border-radius: 100%;\n    margin: auto;\n    height: 0.75em;\n    width: 0.75em;\n  }\n  .input input[type=radio]:checked:before {\n    background-color: #000;\n  }\n  @media (forced-colors: active) {\n    .input input[type=radio]:checked:before {\n      /* Give it a visible background in forced colors mode */\n      background: selectedItem !important;\n    }\n  }\n}",x=S,j=[10,20,50,100],z=t=>!0===t||""===t||"object"==typeof t&&null!==t,C=class{constructor(n){t(this,n),this.catchRef=t=>{this.tableWcRef=t},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.setSortDirection=(t,n)=>{this.sortDirections.clear(),this.sortDirections.set(t,n),this.sortFunction=t},this.handlePagination={onClick:(t,n)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onClick)&&this.state._pagination._on.onClick(t,n),f(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:n}))},onChangePage:(t,n)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePage)&&this.state._pagination._on.onChangePage(t,n),f(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_page:n}))},onChangePageSize:(t,n)=>{var e;"function"==typeof(null===(e=this.state._pagination._on)||void 0===e?void 0:e.onChangePageSize)&&this.state._pagination._on.onChangePageSize(t,n),f(this,"_pagination",Object.assign(Object.assign({},this.state._pagination),{_pageSize:n})),f(this,"_pageSize",n)}},this.onSelectionChange=t=>{t.stopPropagation()},this.updateSortedData=(t=this.sortedColumnHead)=>{if(this.disableSort)return void f(this,"_sortedData",this.state._data);let n=this.state._data;if(this.sortData.length>0)n=this.state._data.sort(((t,n)=>{for(let e=0;e<this.sortData.length;e++){const i=this.sortData[e],a=i.compareFn(t,n);if(0!==a)return"ASC"===i.direction?a:-a}return 0}));else if("function"==typeof this.sortFunction)switch(this.sortDirections.get(this.sortFunction)){case"ASC":n=this.sortFunction([...this.state._data]),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"ASC"};break;case"DESC":n=this.sortFunction([...this.state._data]).reverse(),this.sortedColumnHead={label:t.label,key:t.key,sortDirection:"DESC"};break;default:n=[...this.state._data],this.sortedColumnHead={label:"",key:"",sortDirection:"NOS"}}f(this,"_sortedData",n)},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._paginationPosition="bottom",this._selection=void 0,this._on=void 0,this.state={_allowMultiSort:!1,_data:[],_dataFoot:[],_headers:{horizontal:[],vertical:[]},_label:"",_pagination:{_page:1,_pageSize:10,_max:0},_sortedData:[],_paginationPosition:"bottom"}}validateAllowMultiSort(t){p(this,"_allowMultiSort",(()=>!0),new Set(["boolean"]),t,{defaultValue:!1})}validateData(t){h(this,t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}validateDataFoot(t){r(this,t,{afterPatch:()=>{setTimeout(this.updateSortedData)}})}validatePaginationPosition(t){_(this,t)}changeCellSort(t){var n;if("function"==typeof t.compareFn){this.state._allowMultiSort||t.key==(null===(n=this.sortData[0])||void 0===n?void 0:n.key)||(this.sortData=[]);const e=this.sortData.findIndex((n=>n.key===t.key));if(e>=0){const t=this.sortData[e];switch(t.direction){case"ASC":t.direction="DESC";break;case"DESC":this.sortData.splice(e,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){b(t,(()=>{v(t,(()=>{try{t=g(t)}catch(t){}p(this,"_headers",(t=>"object"==typeof t&&null!==t),new Set(["KoliBriTableHeaders"]),t,{hooks:{beforePatch:t=>{var n,e,i,a;const o=t=>{let n=!1;t.forEach((t=>{const e=t.key;if(!e)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:e,compareFn:t.compareFn,direction:i}),n=!0):"function"==typeof t.sort&&(this.setSortDirection(t.sort,i),setTimeout((()=>this.updateSortedData({key:e,label:t.label,sortDirection:i})))))})),n&&setTimeout((()=>this.updateSortedData()))},s=t;null===(n=s.horizontal)||void 0===n||n.forEach(o),null===(e=s.vertical)||void 0===e||e.forEach(o),s.horizontal&&s.vertical&&(null===(i=s.horizontal)||void 0===i?void 0:i.length)>0&&(null===(a=s.vertical)||void 0===a?void 0:a.length)>0&&(this.disableSort=!0,y("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){w(this,t,{required:!0})}validateMinWidth(t){m(this,"_minWidth",t,{defaultValue:void 0})}validateSelection(t){d(this,t)}validateOn(t){c(this,t)}validatePagination(t){try{t=g(t)}catch(t){}this.showPagination=z(t),p(this,"_pagination",z,new Set(["boolean","KoliBriTablePagination"]),t,{defaultValue:{_page:1,_pageSize:10,_max:0}})}componentDidLoad(){var t;null===(t=this.tableWcRef)||void 0===t||t.addEventListener("kol-selection-change",this.onSelectionChange)}disconnectedCallback(){var t;null===(t=this.tableWcRef)||void 0===t||t.removeEventListener("kol-selection-change",this.onSelectionChange)}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),this.validatePaginationPosition(this._paginationPosition),this.validateSelection(this._selection),this.validateOn(this._on)}selectDisplayedData(t,n,e){return"number"==typeof n&&n>0&&"number"==typeof e&&e>0?(this.pageStartSlice=n*(e-1),this.pageEndSlice=n*e>t.length?t.length:n*e,t.slice(this.pageStartSlice,this.pageEndSlice)):(this.pageStartSlice=0,this.pageEndSlice=t.length,t)}renderPagination(){return n("div",{class:"pagination"},n("span",null,o("kol-table-visible-range",{placeholders:{start:this.pageEndSlice>0?(this.pageStartSlice+1).toString():"0",end:this.pageEndSlice.toString(),total:this.state._pagination&&this.state._pagination._max>0?this.state._pagination._max.toString():Array.isArray(this.state._data)?this.state._data.length.toString():"0"}})),n("div",null,n(a,{_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||j,_siblingCount:this.state._pagination._siblingCount,_tooltipAlign:"bottom",_max:this.state._pagination._max||this.state._pagination._max||this.state._data.length,_label:o("kol-table-pagination-label",{placeholders:{label:this.state._label}})})))}getHeaderCellSortState(t){if(!this.disableSort&&("function"==typeof t.compareFn||"function"==typeof t.sort)){if(t.key===this.sortedColumnHead.key)return this.sortedColumnHead.sortDirection;if(t.key){const n=this.sortData.find((n=>n.key===t.key));if(null==n?void 0:n.direction)return n.direction}return"NOS"}}handleSort({key:t}){const n=[...(this.state._headers.horizontal||[]).flat(),...(this.state._headers.vertical||[]).flat()].find((n=>n.key===t));n&&this.changeCellSort(n)}getSelectedData(t){var n;const e=this.state._selection;if(e){const i=null!==(n=e.keyPropertyName)&&void 0!==n?n:"id",a=this.state._sortedData.filter((n=>t.includes(n[i])));if(!1===(null==e?void 0:e.multiple))return a[0];if(i)return a}return null}handleSelectionChange(t,n){var e;const i=this.state._selection;i&&(this.state=Object.assign(Object.assign({},this.state),{_selection:Object.assign(Object.assign({},i),{selectedKeys:"object"==typeof n?n:[n]})}));const a=this.getSelectedData(n);l("selection-change",this.host,a),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e[u.onSelectionChange])&&this.state._on[u.onSelectionChange](t,a)}async getSelection(){var t;const n=(null===(t=this.state._selection)||void 0===t?void 0:t.selectedKeys)||[];return this.getSelectedData(n)}render(){var t,e,a,o;const l=this.selectDisplayedData(this.state._sortedData,this.showPagination?null!==(e=null===(t=this.state._pagination)||void 0===t?void 0:t._pageSize)&&void 0!==e?e:10:this.state._sortedData.length,this.state._pagination._page||1),r="top"===this._paginationPosition||"both"===this._paginationPosition?this.renderPagination():null,h="bottom"===this._paginationPosition||"both"===this._paginationPosition?this.renderPagination():null,d={horizontal:null===(a=this.state._headers.horizontal)||void 0===a?void 0:a.map((t=>t.map((t=>Object.assign(Object.assign({},t),{sortDirection:this.getHeaderCellSortState(t)}))))),vertical:null===(o=this.state._headers.vertical)||void 0===o?void 0:o.map((t=>t.map((t=>Object.assign(Object.assign({},t),{sortDirection:this.getHeaderCellSortState(t)})))))};return n(i,{key:"06dd5f12e9182fe2db630dcdd0f2645d4867b8e5",class:"kol-table-stateful"},this.pageEndSlice>0&&this.showPagination&&r,n(s,{key:"565eef88ba587eb4aa76b629c01c1d9e1ccf5d98",ref:this.catchRef,_data:l,_headerCells:d,_label:this.state._label,_dataFoot:this.state._dataFoot,_minWidth:this.state._minWidth,_on:{onSort:(t,n)=>{this.handleSort(n)},onSelectionChange:(t,n)=>{this.handleSelectionChange(t,n)}},_selection:this.state._selection}),this.pageEndSlice>0&&this.showPagination&&h)}get host(){return e(this)}static get watchers(){return{_allowMultiSort:["validateAllowMultiSort"],_data:["validateData"],_dataFoot:["validateDataFoot"],_paginationPosition:["validatePaginationPosition"],_headers:["validateHeaders"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_selection:["validateSelection"],_on:["validateOn"],_pagination:["validatePagination"]}}};C.style={default:x};export{C as kol_table_stateful};

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as e,h as t,H as i,g as n}from"./index-bd96e8df.js";import{g as s,a as o,c as l}from"./component-names-3e0158fe.js";import{t as a}from"./i18n-80da5843.js";import{t as d}from"./events-29e84d75.js";import{n as c}from"./dev.utils-cb789c3d.js";import{t as r,o as h,p as f,w as u,i as b}from"./prop.validators-f89d26b4.js";import{v,a as p,d as y,b as m,E as k}from"./events-9570402d.js";import{v as g}from"./label-37acddfe.js";import"./i18n-ece780dd.js";import"./reuse-523ba2ac.js";import"./dev.utils-fab45cbc.js";import"./index-db4aa6e4.js";import"./common-54bf85ba.js";const _=(e,t)=>{r(t,(()=>{h(t,(()=>{try{t=f(t)}catch(e){}u(e,"_headerCells",(e=>"object"==typeof e&&null!==e),new Set(["TableHeaderCellsPropType"]),t)}))}))},j=class{constructor(a){e(this,a),this.horizontal=!0,this.cellsToRenderTimeouts=new Map,this.dataToKeyMap=new Map,this.renderTableRow=(e,a)=>{var i,l;let o=String(a);return this.horizontal&&(null===(i=e[0])||void 0===i?void 0:i.data)&&(o=null!==(l=this.getDataKey(e[0].data))&&void 0!==l?l:o),t("tr",{key:`row-${o}`},this.renderSelectionCell(e,a),e.map(((e,t)=>this.renderTableCell(e,a,t))))},this.renderTableCell=(e,a,i)=>{let l=`${a}-${i}-${e.label}`;if(e.data){const t=this.getDataKey(e.data);l=t?`${t}-${this.horizontal?i:a}`:l}return!1===e.asTd?this.renderHeadingCell(e,a,i):t("td",{key:`cell-${l}`,class:{[e.textAlign]:"string"==typeof e.textAlign&&e.textAlign.length>0},colSpan:e.colSpan,rowSpan:e.rowSpan,style:{textAlign:e.textAlign,width:e.width},ref:"function"==typeof e.render?t=>{this.cellRender(e,t)}:void 0},"function"!=typeof e.render?e.label:"")},this.state={_data:[],_label:"",_headerCells:{horizontal:[],vertical:[]}},this.tableDivElementHasScrollbar=!1,this._data=void 0,this._dataFoot=void 0,this._headerCells=void 0,this._label=void 0,this._minWidth=void 0,this._on=void 0,this._selection=void 0}validateData(e){v(this,e,{beforePatch:e=>{this.updateDataToKeyMap(e)}})}validateDataFoot(e){p(this,e)}validateHeaderCells(e){_(this,e)}validateLabel(e){g(this,e,{required:!0})}validateMinWidth(e){b(this,"_minWidth",e,{defaultValue:void 0})}validateOn(e){y(this,e)}validateSelection(e){m(this,e)}componentDidRender(){this.checkDivElementScrollbar()}componentDidLoad(){this.tableDivElement&&ResizeObserver&&(this.tableDivElementResizeObserver=new ResizeObserver(this.checkDivElementScrollbar.bind(this)),this.tableDivElementResizeObserver.observe(this.tableDivElement))}disconnectedCallback(){var e;null===(e=this.tableDivElementResizeObserver)||void 0===e||e.disconnect()}checkDivElementScrollbar(){this.tableDivElement&&(this.tableDivElementHasScrollbar=this.tableDivElement.scrollWidth>this.tableDivElement.clientWidth)}updateDataToKeyMap(e){e.forEach((e=>{this.dataToKeyMap.has(e)||this.dataToKeyMap.set(e,c())})),this.dataToKeyMap.forEach(((t,a)=>{e.includes(a)||this.dataToKeyMap.delete(a)}))}getDataKey(e){return this.dataToKeyMap.get(e)}cellRender(e,t){t&&(clearTimeout(this.cellsToRenderTimeouts.get(t)),this.cellsToRenderTimeouts.set(t,setTimeout((()=>{if("function"==typeof e.render){const a=e.render(t,e,e.data,this.state._data);"string"==typeof a&&(t.textContent=a)}}))))}getNumberOfCols(e,t){let a=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var a;return t+=null!==(a=e.colSpan)&&void 0!==a?a:1})),a<t&&(a=t)})),0===a&&(a=t.length),a}getNumberOfRows(e,t){var a;let i=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var a;return t+=null!==(a=e.rowSpan)&&void 0!==a?a:1})),i<t&&(i=t)})),0===i?i=t.length:i-=(null===(a=this.state._dataFoot)||void 0===a?void 0:a.length)||0,i}filterHeaderKeys(e){const t=[];return e.forEach((e=>{e.forEach((e=>{"string"==typeof e.key&&t.push(e)}))})),t}getPrimaryHeader(e){var t,a;let i=this.filterHeaderKeys(null!==(t=e.horizontal)&&void 0!==t?t:[]);return this.horizontal=!0,0===i.length&&(i=this.filterHeaderKeys(null!==(a=e.vertical)&&void 0!==a?a:[]),i.length>0&&(this.horizontal=!1)),i}createDataField(e,t,i){var l;t.horizontal=Array.isArray(null==t?void 0:t.horizontal)?t.horizontal:[],t.vertical=Array.isArray(null==t?void 0:t.vertical)?t.vertical:[];const o=this.getPrimaryHeader(t),n=this.getNumberOfCols(t.horizontal,e);let s=this.getNumberOfRows(t.vertical,e),r=0;i&&(r=s,s+=(null===(l=this.state._dataFoot)||void 0===l?void 0:l.length)||0);const d=[],c=[],h=[];t.vertical.forEach(((e,t)=>{c[t]=0,h[t]=[]}));for(let a=r;a<s;a++){const l=[];t.vertical.forEach(((e,t)=>{let i=0;if(h[t].forEach((e=>i+=e)),i<=a){const o=e[a-i+c[t]];if("object"==typeof o){l.push(Object.assign(Object.assign({},o),{asTd:!1,data:{}}));let e=1;if("number"==typeof o.rowSpan&&o.rowSpan>1&&(e=o.rowSpan),h[t].push(e),"number"==typeof o.colSpan&&o.colSpan>1)for(let a=1;a<o.colSpan;a++)h[t+a].push(e);c[t]++}}}));for(let t=0;t<n;t++)if(!0===this.horizontal){const n=i&&this.state._dataFoot?this.state._dataFoot[a-r]:e[a];"object"==typeof o[t]&&null!==o[t]&&"string"==typeof o[t].key&&"object"==typeof n&&null!==n&&l.push(Object.assign(Object.assign({},o[t]),{colSpan:void 0,data:n,label:n[o[t].key],rowSpan:void 0}))}else"object"==typeof o[a]&&null!==o[a]&&"string"==typeof o[a].key&&"object"==typeof e[t]&&null!==e[t]&&l.push(Object.assign(Object.assign({},o[a]),{colSpan:void 0,data:e[t],label:e[t][o[a].key],rowSpan:void 0}));d.push(l)}if(0===e.length){let e=0,i=0;Array.isArray(t.horizontal)&&t.horizontal.length>0&&t.horizontal[0].forEach((t=>{e+=t.colSpan||1})),Array.isArray(t.vertical)&&t.vertical.length>0&&(e-=t.vertical.length,t.vertical[0].forEach((e=>{i+=e.rowSpan||1})));const l={colSpan:e,label:a("kol-no-entries"),render:void 0,rowSpan:Math.max(i,1)};0===d.length?d.push([l]):d[0].push(l)}return d}componentWillLoad(){this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaderCells(this._headerCells),this.validateLabel(this._label),this.validateMinWidth(this._minWidth),this.validateOn(this._on),this.validateSelection(this._selection)}renderSelectionCell(e,a){var i,l;const n=this.state._selection;if(!n)return"";const r=null!==(i=n.keyPropertyName)&&void 0!==i?i:"id",c=e.find((e=>e.key===r));if(!c)return"";const h=n.multiple||void 0===n.multiple,v=(null==c?void 0:c.data)[r],b=null===(l=null==n?void 0:n.selectedKeys)||void 0===l?void 0:l.includes(v),p=n.label(c.data),u={name:"selection",checked:b,id:v,"aria-label":p};return t("td",{key:`tbody-${a}-selection`,class:"selection-cell"},t("div",{class:"input "+(b?"checked":"")},h?t("label",{class:"checkbox-container"},t(s,{class:"icon",_icons:"codicon "+(b?"codicon-check":""),_label:""}),t("input",Object.assign({},u,{type:"checkbox",onInput:e=>{var t,a,i;const l=b?null===(a=null==n?void 0:n.selectedKeys)||void 0===a?void 0:a.filter((e=>e!==v)):[...null!==(t=null==n?void 0:n.selectedKeys)&&void 0!==t?t:[],v];d("selection-change",this.host,l),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i[k.onSelectionChange])&&this.state._on[k.onSelectionChange](e,null!=l?l:[])}}))):t("label",{class:"radio-container"},t("input",Object.assign({},u,{type:"radio",onInput:e=>{var t;d("selection-change",this.host,v),"function"==typeof(null===(t=this.state._on)||void 0===t?void 0:t[k.onSelectionChange])&&this.state._on[k.onSelectionChange](e,v)}}))),t(o,{"aria-hidden":"true",class:"input-tooltip",_align:"right",_id:`${v}-label`,_label:p})))}renderHeadingSelectionCell(){var e,i;const l=this.state._selection;if(!l||!l.multiple&&void 0!==l.multiple)return t("th",{key:"thead-0"});const n=null!==(e=l.keyPropertyName)&&void 0!==e?e:"id",r=null===(i=l.selectedKeys)||void 0===i?void 0:i.length,c=r===this.state._data.length,h=0!==r&&!c;let v="kol-table-selection-indeterminate";c&&!h&&(v="kol-table-selection-none"),0===r&&(v="kol-table-selection-all");const b=a(v);return t("th",{key:"thead-0-selection",class:"selection-cell selection-control"},t("div",{class:"input "+(h?"indeterminate":c?"checked":"")},t("label",{class:"checkbox-container"},t(s,{class:"icon",_icons:"codicon "+(h?"codicon-remove":c?"codicon-check":""),_label:""}),t("input",{name:"selection",checked:c&&!h,"aria-label":b,type:"checkbox",onInput:e=>{var t;const a=c?[]:this.state._data.map((e=>null==e?void 0:e[n]));d("selection-change",this.host,a),"function"==typeof(null===(t=this.state._on)||void 0===t?void 0:t[k.onSelectionChange])&&this.state._on[k.onSelectionChange](e,a)}})),t(o,{"aria-hidden":"true",class:"input-tooltip",_align:"right",_id:`${v}-label`,_label:b})))}renderHeadingCell(e,a,i){let o,n="codicon codicon-fold";if(e.sortDirection)switch(e.sortDirection){case"ASC":n="codicon codicon-chevron-up",o="ascending";break;case"DESC":n="codicon codicon-chevron-down",o="descending"}return t("th",{key:`${a}-${i}-${e.label}`,class:e.textAlign?`align-${e.textAlign}`:void 0,scope:"number"==typeof e.colSpan&&e.colSpan>1?"colgroup":"col",colSpan:e.colSpan,rowSpan:e.rowSpan,style:{width:e.width},"aria-sort":o,"data-sort":`sort-${e.sortDirection}`},e.sortDirection?t(l,{class:"table-sort-button",exportparts:"icon",_icons:{right:n},_label:e.label,_on:{onClick:t=>{var a;"function"==typeof(null===(a=this.state._on)||void 0===a?void 0:a.onSort)&&e.key&&e.sortDirection&&this.state._on.onSort(t,{key:e.key,currentSortDirection:e.sortDirection})}}}):e.label)}renderFoot(){if(!this.state._dataFoot||0===this.state._dataFoot.length)return"";const e=this.createDataField(this.state._dataFoot,this.state._headerCells,!0);return t("tfoot",null,e.map(this.renderTableRow))}render(){const e=this.createDataField(this.state._data,this.state._headerCells);return t(i,{key:"87dc1d0e790e52e414db08ea5b34f014fa0f3561",class:"kol-table-stateless-wc"},t("div",{key:"cdd6ab82350d2fdb3541465b8239e3a777d8a41e",ref:e=>this.tableDivElement=e,class:"table",tabindex:this.tableDivElementHasScrollbar?"-1":void 0},t("table",{key:"cd20c1634fd296efd2ad1123b3e37d6a16296760",style:{minWidth:this.state._minWidth}},t("div",{key:"1eb00a568a349153390927ef529e07869449bcae",class:"focus-element",tabindex:this.tableDivElementHasScrollbar?"0":void 0,"aria-describedby":"caption"}," "),t("caption",{key:"03f5cab82e45a63f5921222d8cf183345e181200",id:"caption"},this.state._label),Array.isArray(this.state._headerCells.horizontal)&&t("thead",{key:"0639b763bd7c7cec26827e7dfb289a30b78e9559"},this.state._headerCells.horizontal.map(((e,a)=>t("tr",{key:`thead-${a}`},this.state._selection&&this.renderHeadingSelectionCell(),e.map(((e,i)=>!0===e.asTd?t("td",{key:`thead-${a}-${i}-${e.label}`,class:{[e.textAlign]:"string"==typeof e.textAlign&&e.textAlign.length>0},colSpan:e.colSpan,rowSpan:e.rowSpan,style:{textAlign:e.textAlign,width:e.width},ref:"function"==typeof e.render?t=>{this.cellRender(e,t)}:void 0},"function"!=typeof e.render?e.label:""):this.renderHeadingCell(e,a,i))))))),t("tbody",{key:"71857813b524157809d357d1061ef2bc32c08a28"},e.map(this.renderTableRow)),this.renderFoot())))}get host(){return n(this)}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headerCells:["validateHeaderCells"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_on:["validateOn"],_selection:["validateSelection"]}}};export{j as kol_table_stateless_wc};
+import{r as e,h as t,H as i,g as s}from"./index-cf24d1fe.js";import{g as n,a as o,c as l}from"./component-names-0a8a1a6c.js";import{t as a}from"./i18n-8640d789.js";import{t as d}from"./events-29e84d75.js";import{n as c}from"./dev.utils-44ef1bde.js";import{t as r,o as h,p as f,w as u,i as b}from"./prop.validators-5a58fa40.js";import{v,a as p,d as y,b as m,E as k}from"./events-476662bc.js";import{v as g}from"./label-084ed1e7.js";import"./i18n-7ea9f137.js";import"./reuse-523ba2ac.js";import"./dev.utils-fab45cbc.js";import"./index-5728f164.js";import"./common-54bf85ba.js";const w=(e,t)=>{r(t,(()=>{h(t,(()=>{try{t=f(t)}catch(e){}u(e,"_headerCells",(e=>"object"==typeof e&&null!==e),new Set(["TableHeaderCellsPropType"]),t)}))}))},_=class{constructor(a){e(this,a),this.horizontal=!0,this.cellsToRenderTimeouts=new Map,this.dataToKeyMap=new Map,this.checkboxRefs=[],this.renderTableRow=(e,a)=>{var i,l;let o=String(a);return this.horizontal&&(null===(i=e[0])||void 0===i?void 0:i.data)&&(o=null!==(l=this.getDataKey(e[0].data))&&void 0!==l?l:o),t("tr",{key:`row-${o}`},this.renderSelectionCell(e,a),e.map(((e,t)=>this.renderTableCell(e,a,t))))},this.renderTableCell=(e,a,i)=>{let l=`${a}-${i}-${e.label}`;if(e.data){const t=this.getDataKey(e.data);l=t?`${t}-${this.horizontal?i:a}`:l}return!1===e.asTd?this.renderHeadingCell(e,a,i):t("td",{key:`cell-${l}`,class:{[e.textAlign]:"string"==typeof e.textAlign&&e.textAlign.length>0},colSpan:e.colSpan,rowSpan:e.rowSpan,style:{textAlign:e.textAlign,width:e.width},ref:"function"==typeof e.render?t=>{this.cellRender(e,t)}:void 0},"function"!=typeof e.render?e.label:"")},this.state={_data:[],_label:"",_headerCells:{horizontal:[],vertical:[]}},this.tableDivElementHasScrollbar=!1,this._data=void 0,this._dataFoot=void 0,this._headerCells=void 0,this._label=void 0,this._minWidth=void 0,this._on=void 0,this._selection=void 0}validateData(e){v(this,e,{beforePatch:e=>{this.updateDataToKeyMap(e)}})}validateDataFoot(e){p(this,e)}validateHeaderCells(e){w(this,e)}validateLabel(e){g(this,e,{required:!0})}validateMinWidth(e){b(this,"_minWidth",e,{defaultValue:void 0})}validateOn(e){y(this,e)}validateSelection(e){m(this,e)}handleKeyDown(e){var t;if("ArrowUp"===e.key||"ArrowDown"===e.key){const a=null===(t=this.tableDivElement)||void 0===t?void 0:t.querySelector(":focus");let i=this.checkboxRefs.indexOf(a);i>-1&&(e.preventDefault(),"ArrowDown"===e.key?(i=(i+1)%this.checkboxRefs.length,this.checkboxRefs[i].focus()):"ArrowUp"===e.key&&(e.preventDefault(),i=(i+this.checkboxRefs.length-1)%this.checkboxRefs.length,this.checkboxRefs[i].focus()))}}componentDidRender(){this.checkDivElementScrollbar()}componentDidLoad(){this.tableDivElement&&ResizeObserver&&(this.tableDivElementResizeObserver=new ResizeObserver(this.checkDivElementScrollbar.bind(this)),this.tableDivElementResizeObserver.observe(this.tableDivElement))}disconnectedCallback(){var e;null===(e=this.tableDivElementResizeObserver)||void 0===e||e.disconnect()}checkDivElementScrollbar(){this.tableDivElement&&(this.tableDivElementHasScrollbar=this.tableDivElement.scrollWidth>this.tableDivElement.clientWidth)}updateDataToKeyMap(e){e.forEach((e=>{this.dataToKeyMap.has(e)||this.dataToKeyMap.set(e,c())})),this.dataToKeyMap.forEach(((t,a)=>{e.includes(a)||this.dataToKeyMap.delete(a)}))}getDataKey(e){return this.dataToKeyMap.get(e)}cellRender(e,t){t&&(clearTimeout(this.cellsToRenderTimeouts.get(t)),this.cellsToRenderTimeouts.set(t,setTimeout((()=>{if("function"==typeof e.render){const a=e.render(t,e,e.data,this.state._data);"string"==typeof a&&(t.textContent=a)}}))))}getNumberOfCols(e,t){let a=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var a;return t+=null!==(a=e.colSpan)&&void 0!==a?a:1})),a<t&&(a=t)})),0===a&&(a=t.length),a}getNumberOfRows(e,t){var a;let i=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var a;return t+=null!==(a=e.rowSpan)&&void 0!==a?a:1})),i<t&&(i=t)})),0===i?i=t.length:i-=(null===(a=this.state._dataFoot)||void 0===a?void 0:a.length)||0,i}filterHeaderKeys(e){const t=[];return e.forEach((e=>{e.forEach((e=>{"string"==typeof e.key&&t.push(e)}))})),t}getPrimaryHeader(e){var t,a;let i=this.filterHeaderKeys(null!==(t=e.horizontal)&&void 0!==t?t:[]);return this.horizontal=!0,0===i.length&&(i=this.filterHeaderKeys(null!==(a=e.vertical)&&void 0!==a?a:[]),i.length>0&&(this.horizontal=!1)),i}createDataField(e,t,i){var l;t.horizontal=Array.isArray(null==t?void 0:t.horizontal)?t.horizontal:[],t.vertical=Array.isArray(null==t?void 0:t.vertical)?t.vertical:[];const o=this.getPrimaryHeader(t),n=this.getNumberOfCols(t.horizontal,e);let s=this.getNumberOfRows(t.vertical,e),r=0;i&&(r=s,s+=(null===(l=this.state._dataFoot)||void 0===l?void 0:l.length)||0);const c=[],d=[],h=[];t.vertical.forEach(((e,t)=>{d[t]=0,h[t]=[]}));for(let a=r;a<s;a++){const l=[];t.vertical.forEach(((e,t)=>{let i=0;if(h[t].forEach((e=>i+=e)),i<=a){const o=e[a-i+d[t]];if("object"==typeof o){l.push(Object.assign(Object.assign({},o),{asTd:!1,data:{}}));let e=1;if("number"==typeof o.rowSpan&&o.rowSpan>1&&(e=o.rowSpan),h[t].push(e),"number"==typeof o.colSpan&&o.colSpan>1)for(let a=1;a<o.colSpan;a++)h[t+a].push(e);d[t]++}}}));for(let t=0;t<n;t++)if(!0===this.horizontal){const n=i&&this.state._dataFoot?this.state._dataFoot[a-r]:e[a];"object"==typeof o[t]&&null!==o[t]&&"string"==typeof o[t].key&&"object"==typeof n&&null!==n&&l.push(Object.assign(Object.assign({},o[t]),{colSpan:void 0,data:n,label:n[o[t].key],rowSpan:void 0}))}else"object"==typeof o[a]&&null!==o[a]&&"string"==typeof o[a].key&&"object"==typeof e[t]&&null!==e[t]&&l.push(Object.assign(Object.assign({},o[a]),{colSpan:void 0,data:e[t],label:e[t][o[a].key],rowSpan:void 0}));c.push(l)}if(0===e.length){let e=0,i=0;Array.isArray(t.horizontal)&&t.horizontal.length>0&&t.horizontal[0].forEach((t=>{e+=t.colSpan||1})),Array.isArray(t.vertical)&&t.vertical.length>0&&(e-=t.vertical.length,t.vertical[0].forEach((e=>{i+=e.rowSpan||1})));const l={colSpan:e,label:a("kol-no-entries"),render:void 0,rowSpan:Math.max(i,1)};0===c.length?c.push([l]):c[0].push(l)}return c}componentWillLoad(){this.validateData(this._data),this.validateDataFoot(this._dataFoot),this.validateHeaderCells(this._headerCells),this.validateLabel(this._label),this.validateMinWidth(this._minWidth),this.validateOn(this._on),this.validateSelection(this._selection)}renderSelectionCell(e,a){var i,l,s;const r=this.state._selection;if(!r)return"";const c=null!==(i=r.keyPropertyName)&&void 0!==i?i:"id",h=null===(l=e[0])||void 0===l?void 0:l.data;if(!h)return"";const b=h[c],v=r.multiple||void 0===r.multiple,p=null===(s=null==r?void 0:r.selectedKeys)||void 0===s?void 0:s.includes(b),f=r.label(h),u={name:"selection",checked:p,id:b,"aria-label":f};return t("td",{key:`tbody-${a}-selection`,class:"selection-cell"},t("div",{class:"input "+(p?"checked":"")},v?t("label",{class:"checkbox-container"},t(n,{class:"icon",_icons:"codicon "+(p?"codicon-check":""),_label:""}),t("input",Object.assign({ref:e=>e&&this.checkboxRefs.push(e)},u,{type:"checkbox",onInput:e=>{var t,a,i;const l=p?null===(a=null==r?void 0:r.selectedKeys)||void 0===a?void 0:a.filter((e=>e!==b)):[...null!==(t=null==r?void 0:r.selectedKeys)&&void 0!==t?t:[],b];d("selection-change",this.host,l),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i[k.onSelectionChange])&&this.state._on[k.onSelectionChange](e,null!=l?l:[])}}))):t("label",{class:"radio-container"},t("input",Object.assign({},u,{type:"radio",onInput:e=>{var t;d("selection-change",this.host,b),"function"==typeof(null===(t=this.state._on)||void 0===t?void 0:t[k.onSelectionChange])&&this.state._on[k.onSelectionChange](e,b)}}))),t(o,{"aria-hidden":"true",class:"input-tooltip",_align:"right",_id:`${b}-label`,_label:f})))}renderHeadingSelectionCell(){var e,i;const l=this.state._selection;if(!l||!l.multiple&&void 0!==l.multiple)return t("th",{key:"thead-0"});const s=null!==(e=l.keyPropertyName)&&void 0!==e?e:"id",r=null===(i=l.selectedKeys)||void 0===i?void 0:i.length,c=r===this.state._data.length,h=0!==r&&!c;let b="kol-table-selection-indeterminate";c&&!h&&(b="kol-table-selection-none"),0===r&&(b="kol-table-selection-all");const v=a(b);return t("th",{key:"thead-0-selection",class:"selection-cell selection-control"},t("div",{class:"input "+(h?"indeterminate":c?"checked":"")},t("label",{class:"checkbox-container"},t(n,{class:"icon",_icons:"codicon "+(h?"codicon-remove":c?"codicon-check":""),_label:""}),t("input",{ref:e=>e&&this.checkboxRefs.push(e),name:"selection",checked:c&&!h,"aria-label":v,type:"checkbox",onInput:e=>{var t;const a=c?[]:this.state._data.map((e=>null==e?void 0:e[s]));d("selection-change",this.host,a),"function"==typeof(null===(t=this.state._on)||void 0===t?void 0:t[k.onSelectionChange])&&this.state._on[k.onSelectionChange](e,a)}})),t(o,{"aria-hidden":"true",class:"input-tooltip",_align:"right",_id:`${b}-label`,_label:v})))}renderHeadingCell(e,a,i){let o,n="codicon codicon-fold";if(e.sortDirection)switch(e.sortDirection){case"ASC":n="codicon codicon-chevron-up",o="ascending";break;case"DESC":n="codicon codicon-chevron-down",o="descending"}return t("th",{key:`${a}-${i}-${e.label}`,class:e.textAlign?`align-${e.textAlign}`:void 0,scope:"number"==typeof e.colSpan&&e.colSpan>1?"colgroup":"col",colSpan:e.colSpan,rowSpan:e.rowSpan,style:{width:e.width},"aria-sort":o,"data-sort":`sort-${e.sortDirection}`},e.sortDirection?t(l,{class:"table-sort-button",exportparts:"icon",_icons:{right:n},_label:e.label,_on:{onClick:t=>{var a;"function"==typeof(null===(a=this.state._on)||void 0===a?void 0:a.onSort)&&e.key&&e.sortDirection&&this.state._on.onSort(t,{key:e.key,currentSortDirection:e.sortDirection})}}}):e.label)}renderFoot(){if(!this.state._dataFoot||0===this.state._dataFoot.length)return"";const e=this.createDataField(this.state._dataFoot,this.state._headerCells,!0);return t("tfoot",null,e.map(this.renderTableRow))}render(){const e=this.createDataField(this.state._data,this.state._headerCells);return this.checkboxRefs=[],t(i,{key:"66ebed2cce21d0ef2cea19a2caa4e009eef86696",class:"kol-table-stateless-wc"},t("div",{key:"ef33e6adc481fe20c0652f904db977227555cf30",ref:e=>this.tableDivElement=e,class:"table",tabindex:this.tableDivElementHasScrollbar?"-1":void 0},t("table",{key:"0fcd965cd0a3dd40f67c73a31095f2eabee38d8c",style:{minWidth:this.state._minWidth}},t("div",{key:"afebb06ed38627d456f8e84f20db0b68de32a1b1",class:"focus-element",tabindex:this.tableDivElementHasScrollbar?"0":void 0,"aria-describedby":"caption"}," "),t("caption",{key:"69bb4c1346b1dd7b34ede6440bbd79d5ca19c14f",id:"caption"},this.state._label),Array.isArray(this.state._headerCells.horizontal)&&t("thead",{key:"b8078c25bc20ebe2452eb775d0a510d3310b3c95"},this.state._headerCells.horizontal.map(((e,a)=>t("tr",{key:`thead-${a}`},this.state._selection&&this.renderHeadingSelectionCell(),e.map(((e,i)=>!0===e.asTd?t("td",{key:`thead-${a}-${i}-${e.label}`,class:{[e.textAlign]:"string"==typeof e.textAlign&&e.textAlign.length>0},colSpan:e.colSpan,rowSpan:e.rowSpan,style:{textAlign:e.textAlign,width:e.width},ref:"function"==typeof e.render?t=>{this.cellRender(e,t)}:void 0},"function"!=typeof e.render?e.label:""):this.renderHeadingCell(e,a,i))))))),t("tbody",{key:"d872fa8369b3d7ca120d7f87dc72a7d9abdb82d9"},e.map(this.renderTableRow)),this.renderFoot())))}get host(){return s(this)}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headerCells:["validateHeaderCells"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_on:["validateOn"],_selection:["validateSelection"]}}};export{_ as kol_table_stateless_wc};

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

@@ -1 +1 @@
-{"version":3,"names":["validateTableHeaderCells","component","value","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","watchValidator","Set","KolTableStateless","this","horizontal","cellsToRenderTimeouts","Map","dataToKeyMap","renderTableRow","row","rowIndex","key","String","_a","data","_b","getDataKey","h","renderSelectionCell","map","cell","colIndex","renderTableCell","label","dataKey","asTd","renderHeadingCell","class","textAlign","length","colSpan","rowSpan","style","width","ref","render","el","cellRender","undefined","_data","_label","_headerCells","vertical","validateData","validateTableData","beforePatch","nextValue","updateDataToKeyMap","validateDataFoot","validateTableDataFoot","validateHeaderCells","validateLabel","required","validateMinWidth","watchString","defaultValue","validateOn","validateTableCallbacks","validateSelection","validateTableSelection","componentDidRender","checkDivElementScrollbar","componentDidLoad","tableDivElement","ResizeObserver","tableDivElementResizeObserver","bind","observe","disconnectedCallback","disconnect","tableDivElementHasScrollbar","scrollWidth","clientWidth","forEach","has","set","nonce","_","includes","delete","get","clearTimeout","setTimeout","renderContent","state","textContent","getNumberOfCols","horizontalHeaders","max","count","col","getNumberOfRows","verticalHeaders","_dataFoot","filterHeaderKeys","headers","primaryHeader","cells","push","getPrimaryHeader","createDataField","isFoot","Array","isArray","maxCols","maxRows","startRow","dataField","rowCount","rowSpans","_row","index","i","dataRow","headerCells","rowsTotal","rows","Object","assign","k","j","colspan","rowspan","emptyCell","translate","Math","componentWillLoad","_minWidth","_on","_selection","selection","keyPropertyName","keyCell","find","isMultiple","multiple","keyProperty","selected","selectedKeys","props","name","checked","id","KolIconTag","_icons","type","onInput","event","updatedSelectedKeys","filter","tryToDispatchKoliBriEvent","host","_c","Events","onSelectionChange","KolTooltipWcTag","_align","_id","renderHeadingSelectionCell","selectedKeyLength","dataLength","isChecked","indeterminate","translationKey","selections","ariaSort","sortButtonIcon","sortDirection","scope","KolButtonWcTag","exportparts","right","onClick","onSort","currentSortDirection","renderFoot","Host","element","tabindex","minWidth","cols"],"sources":["src/schema/props/table-header-cells.ts","src/components/table-stateless/component.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, watchValidator } from '../utils';\nimport type { KoliBriTableHeaderCell, Stringified } from '../types';\n\n/* types */\nexport type TableHeaderCells = {\n\thorizontal?: KoliBriTableHeaderCell[][];\n\tvertical?: KoliBriTableHeaderCell[][];\n};\n\nexport type TableHeaderCellsPropType = Stringified<TableHeaderCells>;\n\n/**\n * Defines the horizontal and vertical table header cells.\n */\nexport type PropTableHeaderCells = {\n\theaderCells: TableHeaderCellsPropType;\n};\n\n/* validator */\nexport const validateTableHeaderCells = (component: Generic.Element.Component, value?: TableHeaderCellsPropType): void => {\n\temptyStringByArrayHandler(value, () => {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<TableHeaderCells>(value);\n\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t} catch (e) {\n\t\t\t\t// value keeps the original data\n\t\t\t}\n\t\t\twatchValidator(component, '_headerCells', (value): boolean => typeof value === 'object' && value !== null, new Set(['TableHeaderCellsPropType']), value);\n\t\t});\n\t});\n};\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport type {\n\tKoliBriTableCell,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaderCellWithLogic,\n\tKoliBriTableHeaders,\n\tKoliBriTableRender,\n\tLabelPropType,\n\tTableCallbacksPropType,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCellsPropType,\n\tTableSelectionPropType,\n\tTableStatelessAPI,\n\tTableStatelessStates,\n} from '../../schema';\nimport {\n\tvalidateLabel,\n\tvalidateTableCallbacks,\n\tvalidateTableData,\n\tvalidateTableDataFoot,\n\tvalidateTableHeaderCells,\n\tvalidateTableSelection,\n\twatchString,\n} from '../../schema';\nimport { KolButtonWcTag, KolIconTag, KolTooltipWcTag } from '../../core/component-names';\nimport type { TranslationKey } from '../../i18n';\nimport { translate } from '../../i18n';\nimport { tryToDispatchKoliBriEvent } from '../../utils/events';\nimport { Events } from '../../schema/enums';\nimport { nonce } from '../../utils/dev.utils';\n\n@Component({\n\ttag: 'kol-table-stateless-wc',\n\tshadow: false,\n})\nexport class KolTableStateless implements TableStatelessAPI {\n\t@Element() private readonly host?: HTMLKolTableStatelessWcElement;\n\n\t@State() public state: TableStatelessStates = {\n\t\t_data: [],\n\t\t_label: '',\n\t\t_headerCells: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t};\n\n\tprivate tableDivElement?: HTMLDivElement;\n\tprivate tableDivElementResizeObserver?: ResizeObserver;\n\tprivate horizontal = true;\n\tprivate cellsToRenderTimeouts = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\tprivate dataToKeyMap = new Map<KoliBriTableDataType, string>();\n\n\t@State()\n\tprivate tableDivElementHasScrollbar = false;\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: TableDataPropType;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: TableDataFootPropType;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headerCells!: TableHeaderCellsPropType;\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 the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableCallbacksPropType;\n\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\n\t@Watch('_data')\n\tpublic validateData(value?: TableDataPropType) {\n\t\tvalidateTableData(this, value, {\n\t\t\tbeforePatch: (nextValue) => {\n\t\t\t\tthis.updateDataToKeyMap(nextValue as KoliBriTableDataType[]);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: TableDataFootPropType) {\n\t\tvalidateTableDataFoot(this, value);\n\t}\n\n\t@Watch('_headerCells')\n\tpublic validateHeaderCells(value?: TableHeaderCellsPropType) {\n\t\tvalidateTableHeaderCells(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\n\t\t});\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\t@Watch('_on')\n\tpublic validateOn(value?: TableCallbacksPropType): void {\n\t\tvalidateTableCallbacks(this, value);\n\t}\n\n\t@Watch('_selection')\n\tpublic validateSelection(value?: TableSelectionPropType): void {\n\t\tvalidateTableSelection(this, value);\n\t}\n\n\tpublic componentDidRender(): void {\n\t\tthis.checkDivElementScrollbar();\n\t}\n\n\tpublic componentDidLoad() {\n\t\tif (this.tableDivElement && ResizeObserver) {\n\t\t\tthis.tableDivElementResizeObserver = new ResizeObserver(this.checkDivElementScrollbar.bind(this));\n\t\t\tthis.tableDivElementResizeObserver.observe(this.tableDivElement);\n\t\t}\n\t}\n\n\tpublic disconnectedCallback() {\n\t\tthis.tableDivElementResizeObserver?.disconnect();\n\t}\n\n\tprivate checkDivElementScrollbar() {\n\t\tif (this.tableDivElement) {\n\t\t\tthis.tableDivElementHasScrollbar = this.tableDivElement.scrollWidth > this.tableDivElement.clientWidth;\n\t\t}\n\t}\n\n\tprivate updateDataToKeyMap(data: KoliBriTableDataType[]) {\n\t\tdata.forEach((data) => {\n\t\t\tif (!this.dataToKeyMap.has(data)) {\n\t\t\t\tthis.dataToKeyMap.set(data, nonce());\n\t\t\t}\n\t\t});\n\n\t\t/* Cleanup old values from map */\n\t\tthis.dataToKeyMap.forEach((_, key) => {\n\t\t\tif (!data.includes(key)) {\n\t\t\t\tthis.dataToKeyMap.delete(key);\n\t\t\t}\n\t\t});\n\t}\n\n\tprivate getDataKey(data: KoliBriTableDataType) {\n\t\treturn this.dataToKeyMap.get(data);\n\t}\n\n\tprivate cellRender(cell: KoliBriTableCell, el?: HTMLElement): void {\n\t\tif (el) {\n\t\t\tclearTimeout(this.cellsToRenderTimeouts.get(el));\n\t\t\tthis.cellsToRenderTimeouts.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tif (typeof cell.render === 'function') {\n\t\t\t\t\t\tconst renderContent = cell.render(el, cell, cell.data, this.state._data);\n\t\t\t\t\t\tif (typeof renderContent === 'string') {\n\t\t\t\t\t\t\tel.textContent = renderContent;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t);\n\t\t}\n\t}\n\n\tprivate 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 || 0;\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 & KoliBriTableDataType)[][] {\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 || 0;\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: KoliBriTableHeaderCellWithLogic[] = [];\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 ? 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\tpublic componentWillLoad(): void {\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaderCells(this._headerCells);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateSelection(this._selection);\n\t}\n\n\tprivate renderSelectionCell(row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection) return '';\n\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\tconst keyCell = row.find((cell) => cell.key === keyPropertyName);\n\n\t\tif (!keyCell) return '';\n\t\tconst isMultiple = selection.multiple || selection.multiple === undefined;\n\t\tconst keyProperty = (keyCell?.data as KoliBriTableDataType)[keyPropertyName] as string;\n\t\tconst selected = selection?.selectedKeys?.includes(keyProperty);\n\t\tconst label = selection.label(keyCell.data as KoliBriTableDataType);\n\t\tconst props = {\n\t\t\tname: 'selection',\n\t\t\tchecked: selected,\n\t\t\tid: keyProperty,\n\t\t\t['aria-label']: label,\n\t\t};\n\t\treturn (\n\t\t\t<td key={`tbody-${rowIndex}-selection`} class=\"selection-cell\">\n\t\t\t\t<div class={`input ${selected ? 'checked' : ''}`}>\n\t\t\t\t\t{isMultiple ? (\n\t\t\t\t\t\t<label class=\"checkbox-container\">\n\t\t\t\t\t\t\t<KolIconTag class=\"icon\" _icons={`codicon ${selected ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\tconst updatedSelectedKeys = !selected\n\t\t\t\t\t\t\t\t\t\t? [...(selection?.selectedKeys ?? []), keyProperty]\n\t\t\t\t\t\t\t\t\t\t: selection?.selectedKeys?.filter((key) => key !== keyProperty);\n\t\t\t\t\t\t\t\t\ttryToDispatchKoliBriEvent('selection-change', this.host, updatedSelectedKeys);\n\t\t\t\t\t\t\t\t\tif (typeof this.state._on?.[Events.onSelectionChange] === 'function') {\n\t\t\t\t\t\t\t\t\t\tthis.state._on[Events.onSelectionChange](event, updatedSelectedKeys ?? []);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<label class=\"radio-container\">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\ttryToDispatchKoliBriEvent('selection-change', this.host, keyProperty);\n\t\t\t\t\t\t\t\t\tif (typeof this.state._on?.[Events.onSelectionChange] === 'function') {\n\t\t\t\t\t\t\t\t\t\tthis.state._on[Events.onSelectionChange](event, keyProperty);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t)}\n\t\t\t\t\t<KolTooltipWcTag aria-hidden=\"true\" class=\"input-tooltip\" _align=\"right\" _id={`${keyProperty}-label`} _label={label}></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</td>\n\t\t);\n\t}\n\n\tprivate readonly renderTableRow = (row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number): JSX.Element => {\n\t\tlet key = String(rowIndex);\n\t\tif (this.horizontal && row[0]?.data) {\n\t\t\tkey = this.getDataKey(row[0].data) ?? key;\n\t\t}\n\n\t\treturn (\n\t\t\t<tr key={`row-${key}`}>\n\t\t\t\t{this.renderSelectionCell(row, rowIndex)}\n\t\t\t\t{row.map((cell, colIndex) => this.renderTableCell(cell, rowIndex, colIndex))}\n\t\t\t</tr>\n\t\t);\n\t};\n\n\tprivate readonly renderTableCell = (cell: KoliBriTableCell, rowIndex: number, colIndex: number): JSX.Element => {\n\t\tlet key = `${rowIndex}-${colIndex}-${cell.label}`;\n\t\tif (cell.data) {\n\t\t\tconst dataKey = this.getDataKey(cell.data);\n\t\t\tkey = dataKey ? `${dataKey}-${this.horizontal ? colIndex : rowIndex}` : key;\n\t\t}\n\n\t\tif (cell.asTd === false) {\n\t\t\treturn this.renderHeadingCell(cell, rowIndex, colIndex);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<td\n\t\t\t\t\tkey={`cell-${key}`}\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 KoliBriTableHeaderCellWithLogic & { render: KoliBriTableRender }, el);\n\t\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 renderHeadingSelectionCell(): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection || (!selection.multiple && selection.multiple !== undefined)) return <th key={`thead-0`}></th>;\n\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\tconst selectedKeyLength = selection.selectedKeys?.length;\n\t\tconst dataLength = this.state._data.length;\n\t\tconst isChecked = selectedKeyLength === dataLength;\n\t\tconst indeterminate = selectedKeyLength !== 0 && !isChecked;\n\t\tlet translationKey = 'kol-table-selection-indeterminate' as TranslationKey;\n\t\tif (isChecked && !indeterminate) {\n\t\t\ttranslationKey = 'kol-table-selection-none';\n\t\t}\n\t\tif (selectedKeyLength === 0) {\n\t\t\ttranslationKey = 'kol-table-selection-all';\n\t\t}\n\t\tconst label = translate(translationKey);\n\t\treturn (\n\t\t\t<th key={`thead-0-selection`} class=\"selection-cell selection-control\">\n\t\t\t\t<div class={`input ${indeterminate ? 'indeterminate' : isChecked ? 'checked' : ''}`}>\n\t\t\t\t\t<label class=\"checkbox-container\">\n\t\t\t\t\t\t<KolIconTag class=\"icon\" _icons={`codicon ${indeterminate ? 'codicon-remove' : isChecked ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tname=\"selection\"\n\t\t\t\t\t\t\tchecked={isChecked && !indeterminate}\n\t\t\t\t\t\t\taria-label={label}\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\tconst selections = !isChecked ? this.state._data.map((el) => el?.[keyPropertyName] as string) : [];\n\t\t\t\t\t\t\t\ttryToDispatchKoliBriEvent('selection-change', this.host, selections);\n\t\t\t\t\t\t\t\tif (typeof this.state._on?.[Events.onSelectionChange] === 'function') {\n\t\t\t\t\t\t\t\t\tthis.state._on[Events.onSelectionChange](event, selections);\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</label>\n\t\t\t\t\t<KolTooltipWcTag aria-hidden=\"true\" class=\"input-tooltip\" _align=\"right\" _id={`${translationKey}-label`} _label={label}></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</th>\n\t\t);\n\t}\n\n\tprivate renderHeadingCell(cell: KoliBriTableHeaderCell, rowIndex: number, colIndex: number): JSX.Element {\n\t\tlet ariaSort = undefined;\n\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\n\t\tif (cell.sortDirection) {\n\t\t\tswitch (cell.sortDirection) {\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\tariaSort = 'ascending';\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'DESC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\tariaSort = 'descending';\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\treturn (\n\t\t\t<th\n\t\t\t\tkey={`${rowIndex}-${colIndex}-${cell.label}`}\n\t\t\t\tclass={cell.textAlign ? `align-${cell.textAlign}` : undefined}\n\t\t\t\tscope={typeof cell.colSpan === 'number' && cell.colSpan > 1 ? 'colgroup' : 'col'}\n\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: cell.width,\n\t\t\t\t}}\n\t\t\t\taria-sort={ariaSort}\n\t\t\t\tdata-sort={`sort-${cell.sortDirection}`}\n\t\t\t>\n\t\t\t\t{cell.sortDirection ? (\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass=\"table-sort-button\"\n\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t_icons={{ right: sortButtonIcon }}\n\t\t\t\t\t\t_label={cell.label}\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonClick: (event: MouseEvent) => {\n\t\t\t\t\t\t\t\tif (typeof this.state._on?.onSort === 'function' && cell.key && cell.sortDirection) {\n\t\t\t\t\t\t\t\t\tthis.state._on.onSort(event, {\n\t\t\t\t\t\t\t\t\t\tkey: cell.key,\n\t\t\t\t\t\t\t\t\t\tcurrentSortDirection: cell.sortDirection,\n\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t></KolButtonWcTag>\n\t\t\t\t) : (\n\t\t\t\t\tcell.label\n\t\t\t\t)}\n\t\t\t</th>\n\t\t);\n\t}\n\n\tprivate renderFoot(): JSX.Element {\n\t\tif (!this.state._dataFoot || this.state._dataFoot.length === 0) {\n\t\t\treturn '';\n\t\t}\n\n\t\tconst rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headerCells, true);\n\t\treturn <tfoot>{rows.map(this.renderTableRow)}</tfoot>;\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst dataField = this.createDataField(this.state._data, this.state._headerCells);\n\n\t\treturn (\n\t\t\t<Host class=\"kol-table-stateless-wc\">\n\t\t\t\t{/* Firefox automatically makes the following div focusable when it has a scrollbar. We implement a similar behavior cross-browser by allowing the\n\t\t\t\t * <div class=\"focus-element\"> to receive focus. Hence, we disable focus for the div to avoid having two focusable elements by setting `tabindex=\"-1\"`\n\t\t\t\t */}\n\t\t\t\t{/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n\t\t\t\t<div ref={(element) => (this.tableDivElement = element)} class=\"table\" tabindex={this.tableDivElementHasScrollbar ? '-1' : undefined}>\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{/*\n\t\t\t\t\t\t * The following element allows the table to receive focus without providing redundant content to screen readers.\n\t\t\t\t\t\t * The `div` is technically not allowed here. But any allowed element would mutate the table semantics. Additionally, the `&nbsp;` is necessary to\n\t\t\t\t\t\t * prevent screen readers from just reading \"blank\".\n\t\t\t\t\t\t */}\n\t\t\t\t\t\t{/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n\t\t\t\t\t\t<div class=\"focus-element\" tabindex={this.tableDivElementHasScrollbar ? '0' : undefined} aria-describedby=\"caption\">\n\t\t\t\t\t\t\t&nbsp;\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<caption id=\"caption\">{this.state._label}</caption>\n\n\t\t\t\t\t\t{Array.isArray(this.state._headerCells.horizontal) && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t{this.state._headerCells.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{this.state._selection && this.renderHeadingSelectionCell()}\n\t\t\t\t\t\t\t\t\t\t{cols.map((cell, colIndex) => {\n\t\t\t\t\t\t\t\t\t\t\tif (cell.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\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${cell.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[cell.textAlign as string]: typeof cell.textAlign === 'string' && cell.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={cell.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={cell.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: cell.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: cell.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 cell.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(cell, el);\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: 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 cell.render !== 'function' ? cell.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\treturn this.renderHeadingCell(cell, rowIndex, colIndex);\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.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":";;;+jBAoBO,MAAMA,EAA2B,CAACC,EAAsCC,KAC9EC,EAA0BD,GAAO,KAChCE,EAAoBF,GAAO,KAC1B,IACCA,EAAQG,EAA4BH,E,CAEnC,MAAOI,G,CAGTC,EAAeN,EAAW,gBAAiBC,UAA0BA,IAAU,UAAYA,IAAU,MAAM,IAAIM,IAAI,CAAC,6BAA8BN,EAAM,GACvJ,GACD,E,MCQUO,EAAiB,M,yBAcrBC,KAAAC,WAAa,KACbD,KAAAE,sBAAwB,IAAIC,IAC5BH,KAAAI,aAAe,IAAID,IA8XVH,KAAAK,eAAiB,CAACC,EAAkDC,K,QACpF,IAAIC,EAAMC,OAAOF,GACjB,GAAIP,KAAKC,cAAcS,EAAAJ,EAAI,MAAE,MAAAI,SAAA,SAAAA,EAAEC,MAAM,CACpCH,GAAMI,EAAAZ,KAAKa,WAAWP,EAAI,GAAGK,SAAK,MAAAC,SAAA,EAAAA,EAAIJ,C,CAGvC,OACCM,EAAA,MAAIN,IAAK,OAAOA,KACdR,KAAKe,oBAAoBT,EAAKC,GAC9BD,EAAIU,KAAI,CAACC,EAAMC,IAAalB,KAAKmB,gBAAgBF,EAAMV,EAAUW,KAC9D,EAIUlB,KAAAmB,gBAAkB,CAACF,EAAwBV,EAAkBW,KAC7E,IAAIV,EAAM,GAAGD,KAAYW,KAAYD,EAAKG,QAC1C,GAAIH,EAAKN,KAAM,CACd,MAAMU,EAAUrB,KAAKa,WAAWI,EAAKN,MACrCH,EAAMa,EAAU,GAAGA,KAAWrB,KAAKC,WAAaiB,EAAWX,IAAaC,C,CAGzE,GAAIS,EAAKK,OAAS,MAAO,CACxB,OAAOtB,KAAKuB,kBAAkBN,EAAMV,EAAUW,E,KACxC,CACN,OACCJ,EAAA,MACCN,IAAK,QAAQA,IACbgB,MAAO,CACN,CAACP,EAAKQ,kBAA6BR,EAAKQ,YAAc,UAAYR,EAAKQ,UAAUC,OAAS,GAE3FC,QAASV,EAAKU,QACdC,QAASX,EAAKW,QACdC,MAAO,CACNJ,UAAWR,EAAKQ,UAChBK,MAAOb,EAAKa,OAEbC,WACQd,EAAKe,SAAW,WACnBC,IACDjC,KAAKkC,WAAWjB,EAA0EgB,EAAG,EAE7FE,kBAGIlB,EAAKe,SAAW,WAAaf,EAAKG,MAAQ,G,cAvbR,CAC7CgB,MAAO,GACPC,OAAQ,GACRC,aAAc,CACbrC,WAAY,GACZsC,SAAU,K,iCAW0B,M,sKAsC/B,YAAAC,CAAahD,GACnBiD,EAAkBzC,KAAMR,EAAO,CAC9BkD,YAAcC,IACb3C,KAAK4C,mBAAmBD,EAAoC,G,CAMxD,gBAAAE,CAAiBrD,GACvBsD,EAAsB9C,KAAMR,E,CAItB,mBAAAuD,CAAoBvD,GAC1BF,EAAyBU,KAAMR,E,CAIzB,aAAAwD,CAAcxD,GACpBwD,EAAchD,KAAMR,EAAO,CAC1ByD,SAAU,M,CAKL,gBAAAC,CAAiB1D,GACvB2D,EAAYnD,KAAM,YAAaR,EAAO,CACrC4D,aAAcjB,W,CAKT,UAAAkB,CAAW7D,GACjB8D,EAAuBtD,KAAMR,E,CAIvB,iBAAA+D,CAAkB/D,GACxBgE,EAAuBxD,KAAMR,E,CAGvB,kBAAAiE,GACNzD,KAAK0D,0B,CAGC,gBAAAC,GACN,GAAI3D,KAAK4D,iBAAmBC,eAAgB,CAC3C7D,KAAK8D,8BAAgC,IAAID,eAAe7D,KAAK0D,yBAAyBK,KAAK/D,OAC3FA,KAAK8D,8BAA8BE,QAAQhE,KAAK4D,gB,EAI3C,oBAAAK,G,OACNvD,EAAAV,KAAK8D,iCAA6B,MAAApD,SAAA,SAAAA,EAAEwD,Y,CAG7B,wBAAAR,GACP,GAAI1D,KAAK4D,gBAAiB,CACzB5D,KAAKmE,4BAA8BnE,KAAK4D,gBAAgBQ,YAAcpE,KAAK4D,gBAAgBS,W,EAIrF,kBAAAzB,CAAmBjC,GAC1BA,EAAK2D,SAAS3D,IACb,IAAKX,KAAKI,aAAamE,IAAI5D,GAAO,CACjCX,KAAKI,aAAaoE,IAAI7D,EAAM8D,I,KAK9BzE,KAAKI,aAAakE,SAAQ,CAACI,EAAGlE,KAC7B,IAAKG,EAAKgE,SAASnE,GAAM,CACxBR,KAAKI,aAAawE,OAAOpE,E,KAKpB,UAAAK,CAAWF,GAClB,OAAOX,KAAKI,aAAayE,IAAIlE,E,CAGtB,UAAAuB,CAAWjB,EAAwBgB,GAC1C,GAAIA,EAAI,CACP6C,aAAa9E,KAAKE,sBAAsB2E,IAAI5C,IAC5CjC,KAAKE,sBAAsBsE,IAC1BvC,EACA8C,YAAW,KACV,UAAW9D,EAAKe,SAAW,WAAY,CACtC,MAAMgD,EAAgB/D,EAAKe,OAAOC,EAAIhB,EAAMA,EAAKN,KAAMX,KAAKiF,MAAM7C,OAClE,UAAW4C,IAAkB,SAAU,CACtC/C,EAAGiD,YAAcF,C,QAQf,eAAAG,CAAgBC,EAA+CzE,GACtE,IAAI0E,EAAM,EACVD,EAAkBd,SAAShE,IAC1B,IAAIgF,EAAQ,EACZhF,EAAIgE,SAASiB,IAAG,IAAA7E,EAAK,OAAC4E,IAAS5E,EAAA6E,EAAI5D,WAAO,MAAAjB,SAAA,EAAAA,EAAI,CAAC,IAC/C,GAAI2E,EAAMC,EAAO,CAChBD,EAAMC,C,KAGR,GAAID,IAAQ,EAAG,CACdA,EAAM1E,EAAKe,M,CAEZ,OAAO2D,C,CAGA,eAAAG,CAAgBC,EAA6C9E,G,MACpE,IAAI0E,EAAM,EACVI,EAAgBnB,SAASiB,IACxB,IAAID,EAAQ,EACZC,EAAIjB,SAAShE,IAAG,IAAAI,EAAK,OAAC4E,IAAS5E,EAAAJ,EAAIsB,WAAO,MAAAlB,SAAA,EAAAA,EAAI,CAAC,IAC/C,GAAI2E,EAAMC,EAAO,CAChBD,EAAMC,C,KAGR,GAAID,IAAQ,EAAG,CACdA,EAAM1E,EAAKe,M,KACL,CACN2D,KAAO3E,EAAAV,KAAKiF,MAAMS,aAAS,MAAAhF,SAAA,SAAAA,EAAEgB,SAAU,C,CAExC,OAAO2D,C,CAGA,gBAAAM,CAAiBC,GACxB,MAAMC,EAA0C,GAChDD,EAAQtB,SAASwB,IAChBA,EAAMxB,SAASrD,IACd,UAAWA,EAAKT,MAAQ,SAAU,CACjCqF,EAAcE,KAAK9E,E,IAEnB,IAEH,OAAO4E,C,CAGA,gBAAAG,CAAiBJ,G,QACxB,IAAIC,EAA0C7F,KAAK2F,kBAAiBjF,EAAAkF,EAAQ3F,cAAU,MAAAS,SAAA,EAAAA,EAAI,IAC1FV,KAAKC,WAAa,KAClB,GAAI4F,EAAcnE,SAAW,EAAG,CAC/BmE,EAAgB7F,KAAK2F,kBAAiB/E,EAAAgF,EAAQrD,YAAQ,MAAA3B,SAAA,EAAAA,EAAI,IAC1D,GAAIiF,EAAcnE,OAAS,EAAG,CAC7B1B,KAAKC,WAAa,K,EAGpB,OAAO4F,C,CAGA,eAAAI,CAAgBtF,EAA8BiF,EAA8BM,G,MACnFN,EAAQ3F,WAAakG,MAAMC,QAAQR,IAAO,MAAPA,SAAO,SAAPA,EAAS3F,YAAc2F,EAAQ3F,WAAa,GAC/E2F,EAAQrD,SAAW4D,MAAMC,QAAQR,IAAO,MAAPA,SAAO,SAAPA,EAASrD,UAAYqD,EAAQrD,SAAW,GACzE,MAAMsD,EAAgB7F,KAAKgG,iBAAiBJ,GAC5C,MAAMS,EAAUrG,KAAKmF,gBAAgBS,EAAQ3F,WAAYU,GACzD,IAAI2F,EAAUtG,KAAKwF,gBAAgBI,EAAQrD,SAAU5B,GACrD,IAAI4F,EAAW,EACf,GAAIL,EAAQ,CACXK,EAAWD,EACXA,KAAW5F,EAAAV,KAAKiF,MAAMS,aAAS,MAAAhF,SAAA,SAAAA,EAAEgB,SAAU,C,CAE5C,MAAM8E,EAAkC,GAExC,MAAMC,EAAqB,GAC3B,MAAMC,EAAuB,GAC7Bd,EAAQrD,SAAS+B,SAAQ,CAACqC,EAAMC,KAC/BH,EAASG,GAAS,EAClBF,EAASE,GAAS,EAAE,IAGrB,IAAK,IAAIC,EAAIN,EAAUM,EAAIP,EAASO,IAAK,CACxC,MAAMC,EAA6C,GACnDlB,EAAQrD,SAAS+B,SAAQ,CAACyC,EAAaH,KACtC,IAAII,EAAY,EAChBN,EAASE,GAAOtC,SAAS9E,GAAWwH,GAAaxH,IACjD,GAAIwH,GAAaH,EAAG,CACnB,MAAMI,EAAOF,EAAYF,EAAIG,EAAYP,EAASG,IAClD,UAAWK,IAAS,SAAU,CAC7BH,EAAQf,KAAImB,OAAAC,OAAAD,OAAAC,OAAA,GACRF,GAAI,CACP3F,KAAM,MAENX,KAAM,MAEP,IAAIiB,EAAU,EACd,UAAWqF,EAAKrF,UAAY,UAAYqF,EAAKrF,QAAU,EAAG,CACzDA,EAAUqF,EAAKrF,O,CAEhB8E,EAASE,GAAOb,KAAKnE,GACrB,UAAWqF,EAAKtF,UAAY,UAAYsF,EAAKtF,QAAU,EAAG,CACzD,IAAK,IAAIyF,EAAI,EAAGA,EAAIH,EAAKtF,QAASyF,IAAK,CACtCV,EAASE,EAAQQ,GAAGrB,KAAKnE,E,EAG3B6E,EAASG,I,MAIZ,IAAK,IAAIS,EAAI,EAAGA,EAAIhB,EAASgB,IAAK,CACjC,GAAIrH,KAAKC,aAAe,KAAM,CAC7B,MAAMK,EAAM4F,GAAUlG,KAAKiF,MAAMS,UAAY1F,KAAKiF,MAAMS,UAAUmB,EAAIN,GAAY5F,EAAKkG,GACvF,UACQhB,EAAcwB,KAAO,UAC5BxB,EAAcwB,KAAO,aACdxB,EAAcwB,GAAG7G,MAAQ,iBACzBF,IAAQ,UACfA,IAAQ,KACP,CACDwG,EAAQf,KAAImB,OAAAC,OAAAD,OAAAC,OAAA,GACRtB,EAAcwB,IAAE,CACnB1F,QAASQ,UAETxB,KAAML,EAENc,MAAOd,EAAIuF,EAAcwB,GAAG7G,KAC5BoB,QAASO,Y,MAGL,CACN,UACQ0D,EAAcgB,KAAO,UAC5BhB,EAAcgB,KAAO,aACdhB,EAAcgB,GAAGrG,MAAQ,iBACzBG,EAAK0G,KAAO,UACnB1G,EAAK0G,KAAO,KACX,CACDP,EAAQf,KAAImB,OAAAC,OAAAD,OAAAC,OAAA,GACRtB,EAAcgB,IAAE,CACnBlF,QAASQ,UAETxB,KAAMA,EAAK0G,GAEXjG,MAAOT,EAAK0G,GAAGxB,EAAcgB,GAAGrG,KAChCoB,QAASO,Y,GAKbqE,EAAUT,KAAKe,E,CAEhB,GAAInG,EAAKe,SAAW,EAAG,CACtB,IAAI4F,EAAU,EACd,IAAIC,EAAU,EACd,GAAIpB,MAAMC,QAAQR,EAAQ3F,aAAe2F,EAAQ3F,WAAWyB,OAAS,EAAG,CACvEkE,EAAQ3F,WAAW,GAAGqE,SAASiB,IAC9B+B,GAAW/B,EAAI5D,SAAW,CAAC,G,CAG7B,GAAIwE,MAAMC,QAAQR,EAAQrD,WAAaqD,EAAQrD,SAASb,OAAS,EAAG,CACnE4F,GAAW1B,EAAQrD,SAASb,OAC5BkE,EAAQrD,SAAS,GAAG+B,SAAShE,IAC5BiH,GAAWjH,EAAIsB,SAAW,CAAC,G,CAG7B,MAAM4F,EAAY,CACjB7F,QAAS2F,EACTlG,MAAOqG,EAAU,kBACjBzF,OAAQG,UACRP,QAAS8F,KAAKrC,IAAIkC,EAAS,IAE5B,GAAIf,EAAU9E,SAAW,EAAG,CAC3B8E,EAAUT,KAAK,CAACyB,G,KACV,CACNhB,EAAU,GAAGT,KAAKyB,E,EAGpB,OAAOhB,C,CAGD,iBAAAmB,GACN3H,KAAKwC,aAAaxC,KAAKoC,OACvBpC,KAAK6C,iBAAiB7C,KAAK0F,WAC3B1F,KAAK+C,oBAAoB/C,KAAKsC,cAC9BtC,KAAKgD,cAAchD,KAAKqC,QACxBrC,KAAKkD,iBAAiBlD,KAAK4H,WAC3B5H,KAAKqD,WAAWrD,KAAK6H,KACrB7H,KAAKuD,kBAAkBvD,KAAK8H,W,CAGrB,mBAAA/G,CAAoBT,EAAkDC,G,QAC7E,MAAMwH,EAAY/H,KAAKiF,MAAM6C,WAC7B,IAAKC,EAAW,MAAO,GACvB,MAAMC,GAAkBtH,EAAAqH,EAAUC,mBAAe,MAAAtH,SAAA,EAAAA,EAAI,KACrD,MAAMuH,EAAU3H,EAAI4H,MAAMjH,GAASA,EAAKT,MAAQwH,IAEhD,IAAKC,EAAS,MAAO,GACrB,MAAME,EAAaJ,EAAUK,UAAYL,EAAUK,WAAajG,UAChE,MAAMkG,GAAeJ,IAAO,MAAPA,SAAO,SAAPA,EAAStH,MAA8BqH,GAC5D,MAAMM,GAAW1H,EAAAmH,IAAS,MAATA,SAAS,SAATA,EAAWQ,gBAAY,MAAA3H,SAAA,SAAAA,EAAE+D,SAAS0D,GACnD,MAAMjH,EAAQ2G,EAAU3G,MAAM6G,EAAQtH,MACtC,MAAM6H,EAAQ,CACbC,KAAM,YACNC,QAASJ,EACTK,GAAIN,EACJ,CAAC,cAAejH,GAEjB,OACCN,EAAA,MAAIN,IAAK,SAASD,cAAsBiB,MAAM,kBAC7CV,EAAA,OAAKU,MAAO,SAAS8G,EAAW,UAAY,MAC1CH,EACArH,EAAA,SAAOU,MAAM,sBACZV,EAAC8H,EAAU,CAACpH,MAAM,OAAOqH,OAAQ,WAAWP,EAAW,gBAAkB,KAAMjG,OAAO,KACtFvB,EAAA,QAAAoG,OAAAC,OAAA,GACKqB,EAAK,CACTM,KAAK,WACLC,QAAUC,I,UACT,MAAMC,GAAuBX,EAC1B,KAAK5H,EAAAqH,IAAS,MAATA,SAAS,SAATA,EAAWQ,gBAAY,MAAA7H,SAAA,EAAAA,EAAI,GAAK2H,IACrCzH,EAAAmH,IAAS,MAATA,SAAS,SAATA,EAAWQ,gBAAY,MAAA3H,SAAA,SAAAA,EAAEsI,QAAQ1I,GAAQA,IAAQ6H,IACpDc,EAA0B,mBAAoBnJ,KAAKoJ,KAAMH,GACzD,WAAWI,EAAArJ,KAAKiF,MAAM4C,OAAG,MAAAwB,SAAA,SAAAA,EAAGC,EAAOC,sBAAuB,WAAY,CACrEvJ,KAAKiF,MAAM4C,IAAIyB,EAAOC,mBAAmBP,EAAOC,IAAmB,MAAnBA,SAAmB,EAAnBA,EAAuB,G,OAM3EnI,EAAA,SAAOU,MAAM,mBACZV,EAAA,QAAAoG,OAAAC,OAAA,GACKqB,EAAK,CACTM,KAAK,QACLC,QAAUC,I,MACTG,EAA0B,mBAAoBnJ,KAAKoJ,KAAMf,GACzD,WAAW3H,EAAAV,KAAKiF,MAAM4C,OAAG,MAAAnH,SAAA,SAAAA,EAAG4I,EAAOC,sBAAuB,WAAY,CACrEvJ,KAAKiF,MAAM4C,IAAIyB,EAAOC,mBAAmBP,EAAOX,E,OAMrDvH,EAAC0I,EAAe,eAAa,OAAOhI,MAAM,gBAAgBiI,OAAO,QAAQC,IAAK,GAAGrB,UAAqBhG,OAAQjB,K,CAwD1G,0BAAAuI,G,QACP,MAAM5B,EAAY/H,KAAKiF,MAAM6C,WAC7B,IAAKC,IAAeA,EAAUK,UAAYL,EAAUK,WAAajG,UAAY,OAAOrB,EAAA,MAAIN,IAAK,YAC7F,MAAMwH,GAAkBtH,EAAAqH,EAAUC,mBAAe,MAAAtH,SAAA,EAAAA,EAAI,KACrD,MAAMkJ,GAAoBhJ,EAAAmH,EAAUQ,gBAAY,MAAA3H,SAAA,SAAAA,EAAEc,OAClD,MAAMmI,EAAa7J,KAAKiF,MAAM7C,MAAMV,OACpC,MAAMoI,EAAYF,IAAsBC,EACxC,MAAME,EAAgBH,IAAsB,IAAME,EAClD,IAAIE,EAAiB,oCACrB,GAAIF,IAAcC,EAAe,CAChCC,EAAiB,0B,CAElB,GAAIJ,IAAsB,EAAG,CAC5BI,EAAiB,yB,CAElB,MAAM5I,EAAQqG,EAAUuC,GACxB,OACClJ,EAAA,MAAIN,IAAK,oBAAqBgB,MAAM,oCACnCV,EAAA,OAAKU,MAAO,SAASuI,EAAgB,gBAAkBD,EAAY,UAAY,MAC9EhJ,EAAA,SAAOU,MAAM,sBACZV,EAAC8H,EAAU,CAACpH,MAAM,OAAOqH,OAAQ,WAAWkB,EAAgB,iBAAmBD,EAAY,gBAAkB,KAAMzH,OAAO,KAC1HvB,EAAA,SACC2H,KAAK,YACLC,QAASoB,IAAcC,EAAa,aACxB3I,EACZ0H,KAAK,WACLC,QAAUC,I,MACT,MAAMiB,GAAcH,EAAY9J,KAAKiF,MAAM7C,MAAMpB,KAAKiB,GAAOA,IAAE,MAAFA,SAAE,SAAFA,EAAK+F,KAA8B,GAChGmB,EAA0B,mBAAoBnJ,KAAKoJ,KAAMa,GACzD,WAAWvJ,EAAAV,KAAKiF,MAAM4C,OAAG,MAAAnH,SAAA,SAAAA,EAAG4I,EAAOC,sBAAuB,WAAY,CACrEvJ,KAAKiF,MAAM4C,IAAIyB,EAAOC,mBAAmBP,EAAOiB,E,MAKpDnJ,EAAC0I,EAAe,eAAa,OAAOhI,MAAM,gBAAgBiI,OAAO,QAAQC,IAAK,GAAGM,UAAwB3H,OAAQjB,K,CAM7G,iBAAAG,CAAkBN,EAA8BV,EAAkBW,GACzE,IAAIgJ,EAAW/H,UACf,IAAIgI,EAAiB,uBAErB,GAAIlJ,EAAKmJ,cAAe,CACvB,OAAQnJ,EAAKmJ,eACZ,IAAK,MACJD,EAAiB,6BACjBD,EAAW,YACX,MACD,IAAK,OACJC,EAAiB,+BACjBD,EAAW,aACX,M,CAIH,OACCpJ,EAAA,MACCN,IAAK,GAAGD,KAAYW,KAAYD,EAAKG,QACrCI,MAAOP,EAAKQ,UAAY,SAASR,EAAKQ,YAAcU,UACpDkI,aAAcpJ,EAAKU,UAAY,UAAYV,EAAKU,QAAU,EAAI,WAAa,MAC3EA,QAASV,EAAKU,QACdC,QAASX,EAAKW,QACdC,MAAO,CACNC,MAAOb,EAAKa,OACZ,YACUoI,EAAQ,YACR,QAAQjJ,EAAKmJ,iBAEvBnJ,EAAKmJ,cACLtJ,EAACwJ,EAAc,CACd9I,MAAM,oBACN+I,YAAY,OACZ1B,OAAQ,CAAE2B,MAAOL,GACjB9H,OAAQpB,EAAKG,MACbyG,IAAK,CACJ4C,QAAUzB,I,MACT,WAAWtI,EAAAV,KAAKiF,MAAM4C,OAAG,MAAAnH,SAAA,SAAAA,EAAEgK,UAAW,YAAczJ,EAAKT,KAAOS,EAAKmJ,cAAe,CACnFpK,KAAKiF,MAAM4C,IAAI6C,OAAO1B,EAAO,CAC5BxI,IAAKS,EAAKT,IACVmK,qBAAsB1J,EAAKmJ,e,MAOhCnJ,EAAU,M,CAMN,UAAA2J,GACP,IAAK5K,KAAKiF,MAAMS,WAAa1F,KAAKiF,MAAMS,UAAUhE,SAAW,EAAG,CAC/D,MAAO,E,CAGR,MAAMuF,EAA6BjH,KAAKiG,gBAAgBjG,KAAKiF,MAAMS,UAAW1F,KAAKiF,MAAM3C,aAAc,MACvG,OAAOxB,EAAA,aAAQmG,EAAKjG,IAAIhB,KAAKK,gB,CAGvB,MAAA2B,GACN,MAAMwE,EAAYxG,KAAKiG,gBAAgBjG,KAAKiF,MAAM7C,MAAOpC,KAAKiF,MAAM3C,cAEpE,OACCxB,EAAC+J,EAAI,CAAArK,IAAA,2CAACgB,MAAM,0BAKXV,EAAA,OAAAN,IAAA,2CAAKuB,IAAM+I,GAAa9K,KAAK4D,gBAAkBkH,EAAUtJ,MAAM,QAAQuJ,SAAU/K,KAAKmE,4BAA8B,KAAOhC,WAC1HrB,EAAA,SAAAN,IAAA,2CACCqB,MAAO,CACNmJ,SAAUhL,KAAKiF,MAAM2C,YAStB9G,EAAA,OAAAN,IAAA,2CAAKgB,MAAM,gBAAgBuJ,SAAU/K,KAAKmE,4BAA8B,IAAMhC,UAAS,mBAAmB,WAAS,KAInHrB,EAAA,WAAAN,IAAA,2CAASmI,GAAG,WAAW3I,KAAKiF,MAAM5C,QAEjC8D,MAAMC,QAAQpG,KAAKiF,MAAM3C,aAAarC,aACtCa,EAAA,SAAAN,IAAA,4CACER,KAAKiF,MAAM3C,aAAarC,WAAWe,KAAI,CAACiK,EAAM1K,IAC9CO,EAAA,MAAIN,IAAK,SAASD,KAChBP,KAAKiF,MAAM6C,YAAc9H,KAAK2J,6BAC9BsB,EAAKjK,KAAI,CAACC,EAAMC,KAChB,GAAID,EAAKK,OAAS,KAAM,CACvB,OACCR,EAAA,MACCN,IAAK,SAASD,KAAYW,KAAYD,EAAKG,QAC3CI,MAAO,CACN,CAACP,EAAKQ,kBAA6BR,EAAKQ,YAAc,UAAYR,EAAKQ,UAAUC,OAAS,GAE3FC,QAASV,EAAKU,QACdC,QAASX,EAAKW,QACdC,MAAO,CACNJ,UAAWR,EAAKQ,UAChBK,MAAOb,EAAKa,OAEbC,WACQd,EAAKe,SAAW,WACnBC,IACDjC,KAAKkC,WAAWjB,EAAMgB,EAAG,EAEzBE,kBAGIlB,EAAKe,SAAW,WAAaf,EAAKG,MAAQ,G,KAG9C,CACN,OAAOpB,KAAKuB,kBAAkBN,EAAMV,EAAUW,E,SAOpDJ,EAAA,SAAAN,IAAA,4CAAQgG,EAAUxF,IAAIhB,KAAKK,iBAC1BL,KAAK4K,e","ignoreList":[]}
+{"version":3,"names":["validateTableHeaderCells","component","value","emptyStringByArrayHandler","objectObjectHandler","parseJson","e","watchValidator","Set","KolTableStateless","this","horizontal","cellsToRenderTimeouts","Map","dataToKeyMap","checkboxRefs","renderTableRow","row","rowIndex","key","String","_a","data","_b","getDataKey","h","renderSelectionCell","map","cell","colIndex","renderTableCell","label","dataKey","asTd","renderHeadingCell","class","textAlign","length","colSpan","rowSpan","style","width","ref","render","el","cellRender","undefined","_data","_label","_headerCells","vertical","validateData","validateTableData","beforePatch","nextValue","updateDataToKeyMap","validateDataFoot","validateTableDataFoot","validateHeaderCells","validateLabel","required","validateMinWidth","watchString","defaultValue","validateOn","validateTableCallbacks","validateSelection","validateTableSelection","handleKeyDown","event","focusedElement","tableDivElement","querySelector","index","indexOf","preventDefault","focus","componentDidRender","checkDivElementScrollbar","componentDidLoad","ResizeObserver","tableDivElementResizeObserver","bind","observe","disconnectedCallback","disconnect","tableDivElementHasScrollbar","scrollWidth","clientWidth","forEach","has","set","nonce","_","includes","delete","get","clearTimeout","setTimeout","renderContent","state","textContent","getNumberOfCols","horizontalHeaders","max","count","col","getNumberOfRows","verticalHeaders","_dataFoot","filterHeaderKeys","headers","primaryHeader","cells","push","getPrimaryHeader","createDataField","isFoot","Array","isArray","maxCols","maxRows","startRow","dataField","rowCount","rowSpans","_row","i","dataRow","headerCells","rowsTotal","rows","Object","assign","k","j","colspan","rowspan","emptyCell","translate","Math","componentWillLoad","_minWidth","_on","_selection","selection","keyPropertyName","firstCellData","keyProperty","isMultiple","multiple","selected","_c","selectedKeys","props","name","checked","id","KolIconTag","_icons","type","onInput","updatedSelectedKeys","filter","tryToDispatchKoliBriEvent","host","Events","onSelectionChange","KolTooltipWcTag","_align","_id","renderHeadingSelectionCell","selectedKeyLength","dataLength","isChecked","indeterminate","translationKey","selections","ariaSort","sortButtonIcon","sortDirection","scope","KolButtonWcTag","exportparts","right","onClick","onSort","currentSortDirection","renderFoot","Host","element","tabindex","minWidth","cols"],"sources":["src/schema/props/table-header-cells.ts","src/components/table-stateless/component.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport { emptyStringByArrayHandler, objectObjectHandler, parseJson, watchValidator } from '../utils';\nimport type { KoliBriTableHeaderCell, Stringified } from '../types';\n\n/* types */\nexport type TableHeaderCells = {\n\thorizontal?: KoliBriTableHeaderCell[][];\n\tvertical?: KoliBriTableHeaderCell[][];\n};\n\nexport type TableHeaderCellsPropType = Stringified<TableHeaderCells>;\n\n/**\n * Defines the horizontal and vertical table header cells.\n */\nexport type PropTableHeaderCells = {\n\theaderCells: TableHeaderCellsPropType;\n};\n\n/* validator */\nexport const validateTableHeaderCells = (component: Generic.Element.Component, value?: TableHeaderCellsPropType): void => {\n\temptyStringByArrayHandler(value, () => {\n\t\tobjectObjectHandler(value, () => {\n\t\t\ttry {\n\t\t\t\tvalue = parseJson<TableHeaderCells>(value);\n\t\t\t\t// eslint-disable-next-line no-empty\n\t\t\t} catch (e) {\n\t\t\t\t// value keeps the original data\n\t\t\t}\n\t\t\twatchValidator(component, '_headerCells', (value): boolean => typeof value === 'object' && value !== null, new Set(['TableHeaderCellsPropType']), value);\n\t\t});\n\t});\n};\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\n\nimport type {\n\tKoliBriTableCell,\n\tKoliBriTableDataType,\n\tKoliBriTableHeaderCell,\n\tKoliBriTableHeaderCellWithLogic,\n\tKoliBriTableHeaders,\n\tKoliBriTableRender,\n\tLabelPropType,\n\tTableCallbacksPropType,\n\tTableDataFootPropType,\n\tTableDataPropType,\n\tTableHeaderCellsPropType,\n\tTableSelectionPropType,\n\tTableStatelessAPI,\n\tTableStatelessStates,\n} from '../../schema';\nimport {\n\tvalidateLabel,\n\tvalidateTableCallbacks,\n\tvalidateTableData,\n\tvalidateTableDataFoot,\n\tvalidateTableHeaderCells,\n\tvalidateTableSelection,\n\twatchString,\n} from '../../schema';\nimport { KolButtonWcTag, KolIconTag, KolTooltipWcTag } from '../../core/component-names';\nimport type { TranslationKey } from '../../i18n';\nimport { translate } from '../../i18n';\nimport { tryToDispatchKoliBriEvent } from '../../utils/events';\nimport { Events } from '../../schema/enums';\nimport { nonce } from '../../utils/dev.utils';\n\n@Component({\n\ttag: 'kol-table-stateless-wc',\n\tshadow: false,\n})\nexport class KolTableStateless implements TableStatelessAPI {\n\t@Element() private readonly host?: HTMLKolTableStatelessWcElement;\n\n\t@State() public state: TableStatelessStates = {\n\t\t_data: [],\n\t\t_label: '',\n\t\t_headerCells: {\n\t\t\thorizontal: [],\n\t\t\tvertical: [],\n\t\t},\n\t};\n\n\tprivate tableDivElement?: HTMLDivElement;\n\tprivate tableDivElementResizeObserver?: ResizeObserver;\n\tprivate horizontal = true;\n\tprivate cellsToRenderTimeouts = new Map<HTMLElement, ReturnType<typeof setTimeout>>();\n\tprivate dataToKeyMap = new Map<KoliBriTableDataType, string>();\n\n\tprivate checkboxRefs: HTMLInputElement[] = [];\n\n\t@State()\n\tprivate tableDivElementHasScrollbar = false;\n\n\t/**\n\t * Defines the primary table data.\n\t */\n\t@Prop() public _data!: TableDataPropType;\n\n\t/**\n\t * Defines the data for the table footer.\n\t */\n\t@Prop() public _dataFoot?: TableDataFootPropType;\n\n\t/**\n\t * Defines the horizontal and vertical table headers.\n\t */\n\t@Prop() public _headerCells!: TableHeaderCellsPropType;\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 the callback functions for table events.\n\t */\n\t@Prop() public _on?: TableCallbacksPropType;\n\n\t/**\n\t * Defines how rows can be selected and the current selection.\n\t */\n\t@Prop() public _selection?: TableSelectionPropType;\n\n\t@Watch('_data')\n\tpublic validateData(value?: TableDataPropType) {\n\t\tvalidateTableData(this, value, {\n\t\t\tbeforePatch: (nextValue) => {\n\t\t\t\tthis.updateDataToKeyMap(nextValue as KoliBriTableDataType[]);\n\t\t\t},\n\t\t});\n\t}\n\n\t@Watch('_dataFoot')\n\tpublic validateDataFoot(value?: TableDataFootPropType) {\n\t\tvalidateTableDataFoot(this, value);\n\t}\n\n\t@Watch('_headerCells')\n\tpublic validateHeaderCells(value?: TableHeaderCellsPropType) {\n\t\tvalidateTableHeaderCells(this, value);\n\t}\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\n\t\t});\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\t@Watch('_on')\n\tpublic validateOn(value?: TableCallbacksPropType): void {\n\t\tvalidateTableCallbacks(this, value);\n\t}\n\n\t@Watch('_selection')\n\tpublic validateSelection(value?: TableSelectionPropType): void {\n\t\tvalidateTableSelection(this, value);\n\t}\n\n\t@Listen('keydown')\n\tpublic handleKeyDown(event: KeyboardEvent) {\n\t\tif (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n\t\t\tconst focusedElement = this.tableDivElement?.querySelector(':focus') as HTMLInputElement;\n\t\t\tlet index = this.checkboxRefs.indexOf(focusedElement);\n\n\t\t\tif (index > -1) {\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tindex = (index + 1) % this.checkboxRefs.length;\n\t\t\t\t\tthis.checkboxRefs[index].focus();\n\t\t\t\t} else if (event.key === 'ArrowUp') {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tindex = (index + this.checkboxRefs.length - 1) % this.checkboxRefs.length;\n\t\t\t\t\tthis.checkboxRefs[index].focus();\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tpublic componentDidRender(): void {\n\t\tthis.checkDivElementScrollbar();\n\t}\n\n\tpublic componentDidLoad() {\n\t\tif (this.tableDivElement && ResizeObserver) {\n\t\t\tthis.tableDivElementResizeObserver = new ResizeObserver(this.checkDivElementScrollbar.bind(this));\n\t\t\tthis.tableDivElementResizeObserver.observe(this.tableDivElement);\n\t\t}\n\t}\n\n\tpublic disconnectedCallback() {\n\t\tthis.tableDivElementResizeObserver?.disconnect();\n\t}\n\n\tprivate checkDivElementScrollbar() {\n\t\tif (this.tableDivElement) {\n\t\t\tthis.tableDivElementHasScrollbar = this.tableDivElement.scrollWidth > this.tableDivElement.clientWidth;\n\t\t}\n\t}\n\n\tprivate updateDataToKeyMap(data: KoliBriTableDataType[]) {\n\t\tdata.forEach((data) => {\n\t\t\tif (!this.dataToKeyMap.has(data)) {\n\t\t\t\tthis.dataToKeyMap.set(data, nonce());\n\t\t\t}\n\t\t});\n\n\t\t/* Cleanup old values from map */\n\t\tthis.dataToKeyMap.forEach((_, key) => {\n\t\t\tif (!data.includes(key)) {\n\t\t\t\tthis.dataToKeyMap.delete(key);\n\t\t\t}\n\t\t});\n\t}\n\n\tprivate getDataKey(data: KoliBriTableDataType) {\n\t\treturn this.dataToKeyMap.get(data);\n\t}\n\n\tprivate cellRender(cell: KoliBriTableCell, el?: HTMLElement): void {\n\t\tif (el) {\n\t\t\tclearTimeout(this.cellsToRenderTimeouts.get(el));\n\t\t\tthis.cellsToRenderTimeouts.set(\n\t\t\t\tel,\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tif (typeof cell.render === 'function') {\n\t\t\t\t\t\tconst renderContent = cell.render(el, cell, cell.data, this.state._data);\n\t\t\t\t\t\tif (typeof renderContent === 'string') {\n\t\t\t\t\t\t\tel.textContent = renderContent;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t);\n\t\t}\n\t}\n\n\tprivate 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 || 0;\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 & KoliBriTableDataType)[][] {\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 || 0;\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: KoliBriTableHeaderCellWithLogic[] = [];\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 ? 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\tpublic componentWillLoad(): void {\n\t\tthis.validateData(this._data);\n\t\tthis.validateDataFoot(this._dataFoot);\n\t\tthis.validateHeaderCells(this._headerCells);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateMinWidth(this._minWidth);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateSelection(this._selection);\n\t}\n\n\tprivate renderSelectionCell(row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection) return '';\n\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\tconst firstCellData = row[0]?.data;\n\n\t\tif (!firstCellData) return '';\n\t\tconst keyProperty = firstCellData[keyPropertyName] as string;\n\t\tconst isMultiple = selection.multiple || selection.multiple === undefined;\n\t\tconst selected = selection?.selectedKeys?.includes(keyProperty);\n\t\tconst label = selection.label(firstCellData);\n\t\tconst props = {\n\t\t\tname: 'selection',\n\t\t\tchecked: selected,\n\t\t\tid: keyProperty,\n\t\t\t['aria-label']: label,\n\t\t};\n\t\treturn (\n\t\t\t<td key={`tbody-${rowIndex}-selection`} class=\"selection-cell\">\n\t\t\t\t<div class={`input ${selected ? 'checked' : ''}`}>\n\t\t\t\t\t{isMultiple ? (\n\t\t\t\t\t\t<label class=\"checkbox-container\">\n\t\t\t\t\t\t\t<KolIconTag class=\"icon\" _icons={`codicon ${selected ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tref={(el) => el && this.checkboxRefs.push(el)}\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\tconst updatedSelectedKeys = !selected\n\t\t\t\t\t\t\t\t\t\t? [...(selection?.selectedKeys ?? []), keyProperty]\n\t\t\t\t\t\t\t\t\t\t: selection?.selectedKeys?.filter((key) => key !== keyProperty);\n\t\t\t\t\t\t\t\t\ttryToDispatchKoliBriEvent('selection-change', this.host, updatedSelectedKeys);\n\t\t\t\t\t\t\t\t\tif (typeof this.state._on?.[Events.onSelectionChange] === 'function') {\n\t\t\t\t\t\t\t\t\t\tthis.state._on[Events.onSelectionChange](event, updatedSelectedKeys ?? []);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<label class=\"radio-container\">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\t\ttryToDispatchKoliBriEvent('selection-change', this.host, keyProperty);\n\t\t\t\t\t\t\t\t\tif (typeof this.state._on?.[Events.onSelectionChange] === 'function') {\n\t\t\t\t\t\t\t\t\t\tthis.state._on[Events.onSelectionChange](event, keyProperty);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t)}\n\t\t\t\t\t<KolTooltipWcTag aria-hidden=\"true\" class=\"input-tooltip\" _align=\"right\" _id={`${keyProperty}-label`} _label={label}></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</td>\n\t\t);\n\t}\n\n\tprivate readonly renderTableRow = (row: (KoliBriTableCell & KoliBriTableDataType)[], rowIndex: number): JSX.Element => {\n\t\tlet key = String(rowIndex);\n\t\tif (this.horizontal && row[0]?.data) {\n\t\t\tkey = this.getDataKey(row[0].data) ?? key;\n\t\t}\n\n\t\treturn (\n\t\t\t<tr key={`row-${key}`}>\n\t\t\t\t{this.renderSelectionCell(row, rowIndex)}\n\t\t\t\t{row.map((cell, colIndex) => this.renderTableCell(cell, rowIndex, colIndex))}\n\t\t\t</tr>\n\t\t);\n\t};\n\n\tprivate readonly renderTableCell = (cell: KoliBriTableCell, rowIndex: number, colIndex: number): JSX.Element => {\n\t\tlet key = `${rowIndex}-${colIndex}-${cell.label}`;\n\t\tif (cell.data) {\n\t\t\tconst dataKey = this.getDataKey(cell.data);\n\t\t\tkey = dataKey ? `${dataKey}-${this.horizontal ? colIndex : rowIndex}` : key;\n\t\t}\n\n\t\tif (cell.asTd === false) {\n\t\t\treturn this.renderHeadingCell(cell, rowIndex, colIndex);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<td\n\t\t\t\t\tkey={`cell-${key}`}\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 KoliBriTableHeaderCellWithLogic & { render: KoliBriTableRender }, el);\n\t\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 renderHeadingSelectionCell(): JSX.Element {\n\t\tconst selection = this.state._selection;\n\t\tif (!selection || (!selection.multiple && selection.multiple !== undefined)) return <th key={`thead-0`}></th>;\n\t\tconst keyPropertyName = selection.keyPropertyName ?? 'id';\n\t\tconst selectedKeyLength = selection.selectedKeys?.length;\n\t\tconst dataLength = this.state._data.length;\n\t\tconst isChecked = selectedKeyLength === dataLength;\n\t\tconst indeterminate = selectedKeyLength !== 0 && !isChecked;\n\t\tlet translationKey = 'kol-table-selection-indeterminate' as TranslationKey;\n\t\tif (isChecked && !indeterminate) {\n\t\t\ttranslationKey = 'kol-table-selection-none';\n\t\t}\n\t\tif (selectedKeyLength === 0) {\n\t\t\ttranslationKey = 'kol-table-selection-all';\n\t\t}\n\t\tconst label = translate(translationKey);\n\t\treturn (\n\t\t\t<th key={`thead-0-selection`} class=\"selection-cell selection-control\">\n\t\t\t\t<div class={`input ${indeterminate ? 'indeterminate' : isChecked ? 'checked' : ''}`}>\n\t\t\t\t\t<label class=\"checkbox-container\">\n\t\t\t\t\t\t<KolIconTag class=\"icon\" _icons={`codicon ${indeterminate ? 'codicon-remove' : isChecked ? 'codicon-check' : ''}`} _label=\"\" />\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tref={(el) => el && this.checkboxRefs.push(el)}\n\t\t\t\t\t\t\tname=\"selection\"\n\t\t\t\t\t\t\tchecked={isChecked && !indeterminate}\n\t\t\t\t\t\t\taria-label={label}\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tonInput={(event: Event) => {\n\t\t\t\t\t\t\t\tconst selections = !isChecked ? this.state._data.map((el) => el?.[keyPropertyName] as string) : [];\n\t\t\t\t\t\t\t\ttryToDispatchKoliBriEvent('selection-change', this.host, selections);\n\t\t\t\t\t\t\t\tif (typeof this.state._on?.[Events.onSelectionChange] === 'function') {\n\t\t\t\t\t\t\t\t\tthis.state._on[Events.onSelectionChange](event, selections);\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</label>\n\t\t\t\t\t<KolTooltipWcTag aria-hidden=\"true\" class=\"input-tooltip\" _align=\"right\" _id={`${translationKey}-label`} _label={label}></KolTooltipWcTag>\n\t\t\t\t</div>\n\t\t\t</th>\n\t\t);\n\t}\n\n\tprivate renderHeadingCell(cell: KoliBriTableHeaderCell, rowIndex: number, colIndex: number): JSX.Element {\n\t\tlet ariaSort = undefined;\n\t\tlet sortButtonIcon = 'codicon codicon-fold';\n\n\t\tif (cell.sortDirection) {\n\t\t\tswitch (cell.sortDirection) {\n\t\t\t\tcase 'ASC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-up';\n\t\t\t\t\tariaSort = 'ascending';\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'DESC':\n\t\t\t\t\tsortButtonIcon = 'codicon codicon-chevron-down';\n\t\t\t\t\tariaSort = 'descending';\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\treturn (\n\t\t\t<th\n\t\t\t\tkey={`${rowIndex}-${colIndex}-${cell.label}`}\n\t\t\t\tclass={cell.textAlign ? `align-${cell.textAlign}` : undefined}\n\t\t\t\tscope={typeof cell.colSpan === 'number' && cell.colSpan > 1 ? 'colgroup' : 'col'}\n\t\t\t\tcolSpan={cell.colSpan}\n\t\t\t\trowSpan={cell.rowSpan}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: cell.width,\n\t\t\t\t}}\n\t\t\t\taria-sort={ariaSort}\n\t\t\t\tdata-sort={`sort-${cell.sortDirection}`}\n\t\t\t>\n\t\t\t\t{cell.sortDirection ? (\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass=\"table-sort-button\"\n\t\t\t\t\t\texportparts=\"icon\"\n\t\t\t\t\t\t_icons={{ right: sortButtonIcon }}\n\t\t\t\t\t\t_label={cell.label}\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonClick: (event: MouseEvent) => {\n\t\t\t\t\t\t\t\tif (typeof this.state._on?.onSort === 'function' && cell.key && cell.sortDirection) {\n\t\t\t\t\t\t\t\t\tthis.state._on.onSort(event, {\n\t\t\t\t\t\t\t\t\t\tkey: cell.key,\n\t\t\t\t\t\t\t\t\t\tcurrentSortDirection: cell.sortDirection,\n\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t></KolButtonWcTag>\n\t\t\t\t) : (\n\t\t\t\t\tcell.label\n\t\t\t\t)}\n\t\t\t</th>\n\t\t);\n\t}\n\n\tprivate renderFoot(): JSX.Element {\n\t\tif (!this.state._dataFoot || this.state._dataFoot.length === 0) {\n\t\t\treturn '';\n\t\t}\n\n\t\tconst rows: KoliBriTableCell[][] = this.createDataField(this.state._dataFoot, this.state._headerCells, true);\n\t\treturn <tfoot>{rows.map(this.renderTableRow)}</tfoot>;\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst dataField = this.createDataField(this.state._data, this.state._headerCells);\n\t\tthis.checkboxRefs = [];\n\n\t\treturn (\n\t\t\t<Host class=\"kol-table-stateless-wc\">\n\t\t\t\t{/* Firefox automatically makes the following div focusable when it has a scrollbar. We implement a similar behavior cross-browser by allowing the\n\t\t\t\t * <div class=\"focus-element\"> to receive focus. Hence, we disable focus for the div to avoid having two focusable elements by setting `tabindex=\"-1\"`\n\t\t\t\t */}\n\t\t\t\t{/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n\t\t\t\t<div ref={(element) => (this.tableDivElement = element)} class=\"table\" tabindex={this.tableDivElementHasScrollbar ? '-1' : undefined}>\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{/*\n\t\t\t\t\t\t * The following element allows the table to receive focus without providing redundant content to screen readers.\n\t\t\t\t\t\t * The `div` is technically not allowed here. But any allowed element would mutate the table semantics. Additionally, the `&nbsp;` is necessary to\n\t\t\t\t\t\t * prevent screen readers from just reading \"blank\".\n\t\t\t\t\t\t */}\n\t\t\t\t\t\t{/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n\t\t\t\t\t\t<div class=\"focus-element\" tabindex={this.tableDivElementHasScrollbar ? '0' : undefined} aria-describedby=\"caption\">\n\t\t\t\t\t\t\t&nbsp;\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<caption id=\"caption\">{this.state._label}</caption>\n\n\t\t\t\t\t\t{Array.isArray(this.state._headerCells.horizontal) && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t{this.state._headerCells.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{this.state._selection && this.renderHeadingSelectionCell()}\n\t\t\t\t\t\t\t\t\t\t{cols.map((cell, colIndex) => {\n\t\t\t\t\t\t\t\t\t\t\tif (cell.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\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`thead-${rowIndex}-${colIndex}-${cell.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[cell.textAlign as string]: typeof cell.textAlign === 'string' && cell.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={cell.colSpan}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\trowSpan={cell.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: cell.textAlign,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth: cell.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 cell.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(cell, el);\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: 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 cell.render !== 'function' ? cell.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\treturn this.renderHeadingCell(cell, rowIndex, colIndex);\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.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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","ignoreList":[]}