@public-ui/sample-react 2.2.15-rc.0 → 2.2.15

package/dist/assets/{kol-table-stateless.entry-BVKzgd9D.js → kol-table-stateless.entry-CEx8UpaF.js}

@@ -1,4 +1,4 @@
-import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
+import{r as e,h as n,ac as i,H as o}from"./index-BUU9OKG2.js";/*!
  * KoliBri - The accessible HTML-Standard
  */const a=`/*
  * This file contains all rules for accessibility.
@@ -9,13 +9,13 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
      * Minimum size of interactive elements.
      */
     --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));
+    color: black;
     /*
      * No element should be used without a background and font color whose contrast ratio has
      * not been checked. By initially setting the background color to white and the font color
      * to black, the contrast ratio is ensured and explicit adjustment is forced.
      */
     background-color: white;
-    color: black;
     /*
      * Verdana is an accessible font that can be used without requiring additional loading time.
      */
@@ -46,11 +46,10 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
   /* option, */
   /* select, */
   /* textarea, */
-  [role=button],
-  button:not([role=link]),
+  button,
   .kol-input .input {
-    min-height: var(--a11y-min-size);
     min-width: var(--a11y-min-size);
+    min-height: var(--a11y-min-size);
   }
   /*
    * Some interactive elements should not inherit the font-family and font-size.
@@ -96,7 +95,6 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
     height: 1px;
     overflow: hidden;
     white-space: nowrap;
-    clip: rect(0 0 0 0);
     clip-path: inset(50%);
   }
 }
@@ -107,10 +105,10 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
    */
   :is(a, button) {
     background-color: transparent;
-    border: none;
+    width: 100%; /* 100% needed for custom width from outside */
     margin: 0;
     padding: 0;
-    width: 100%; /* 100% needed for custom width from outside */
+    border: none;
   }
   /*
    * Ensure elements with hidden attribute to be actually not visible
@@ -122,12 +120,12 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
 }
 @layer kol-global {
   :host {
-    font-size: calc(16rem / var(--kolibri-root-font-size, 16));
     /*
      * The max-width is needed to prevent the table from overflowing the
      * parent node, if the table is wider than the parent node.
      */
     max-width: 100%;
+    font-size: calc(16rem / var(--kolibri-root-font-size, 16));
   }
   * {
     /*
@@ -163,17 +161,17 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
   [aria-disabled=true]:focus,
   [disabled],
   [disabled]:focus {
-    cursor: not-allowed;
     opacity: 0.5;
     outline: none;
+    cursor: not-allowed;
   }
   [aria-disabled=true]:focus .kol-span-wc,
   [disabled]:focus .kol-span-wc {
     outline: none !important;
   }
   .badge-text-hint {
-    background-color: lightgray;
     color: black;
+    background-color: lightgray;
   }
 }
 @layer kol-component {
@@ -187,32 +185,32 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
     contain: layout;
   }
   .kol-tooltip-wc .tooltip-floating {
-    animation-duration: 0.25s;
-    animation-iteration-count: 1;
-    animation-name: fadeInOpacity;
-    animation-timing-function: ease-in;
     display: none;
     position: fixed;
-    visibility: hidden;
     /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */
     top: 0;
     left: 0;
-    max-width: 90vw;
-    max-height: 90vh;
     /* Can be used to specify the tooltip-width from the outside. Unset by default.  */
     width: var(--kol-tooltip-width);
+    max-width: 90vw;
+    max-height: 90vh;
+    visibility: hidden;
+    animation-duration: 0.25s;
+    animation-iteration-count: 1;
+    animation-name: fadeInOpacity;
+    animation-timing-function: ease-in;
   }
   /* Shared between content and arrow */
   .kol-tooltip-wc .tooltip-area {
-    background-color: #fff;
     color: #000;
+    background-color: #fff;
   }
   .kol-tooltip-wc .tooltip-arrow {
-    height: calc(10rem / var(--kolibri-root-font-size, 16));
-    position: absolute;
     transform: rotate(45deg);
-    width: calc(10rem / var(--kolibri-root-font-size, 16));
+    position: absolute;
     z-index: 999;
+    width: calc(10rem / var(--kolibri-root-font-size, 16));
+    height: calc(10rem / var(--kolibri-root-font-size, 16));
   }
   .kol-tooltip-wc .tooltip-content {
     position: relative;
@@ -288,56 +286,56 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
     white-space: nowrap;
   }
   .input label {
-    align-items: center;
-    cursor: pointer;
     display: flex;
-    height: var(--a11y-min-size);
-    justify-content: center;
     position: relative;
     width: var(--a11y-min-size);
+    height: var(--a11y-min-size);
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
   }
   .input .icon {
     display: block;
-    inset: auto;
     position: absolute;
+    inset: auto;
     z-index: 1;
   }
   .input input {
-    appearance: none;
     border-style: solid;
-    cursor: pointer;
     margin: 0;
+    appearance: none;
+    cursor: pointer;
   }
   .input input:before {
     content: "";
   }
   .input input[type=checkbox] {
-    position: relative;
+    background-color: rgb(255, 255, 255);
     display: flex;
-    height: calc(var(--a11y-min-size) / 2);
+    position: relative;
     width: calc(var(--a11y-min-size) / 2);
+    height: calc(var(--a11y-min-size) / 2);
+    border-width: 2px;
     align-items: center;
     justify-content: center;
-    background-color: rgb(255, 255, 255);
-    border-width: 2px;
     line-height: 1.5;
     transition: all 0.5s ease 0s;
   }
   .input input[type=radio] {
-    display: flex;
-    border-width: 2px;
     border-radius: 100%;
+    display: flex;
+    width: 1.5em;
+    min-width: 1.5em;
     height: 1.5em;
     min-height: 1.5em;
-    min-width: 1.5em;
     padding: 0;
-    width: 1.5em;
+    border-width: 2px;
   }
   .input input[type=radio]:before {
     border-radius: 100%;
-    margin: auto;
-    height: 0.75em;
     width: 0.75em;
+    height: 0.75em;
+    margin: auto;
   }
   .input input[type=radio]:checked:before {
     background-color: #000;
@@ -349,4 +347,4 @@ import{r as e,h as n,ac as i,H as o}from"./index-CJwtOLCA.js";/*!
     }
   }
 }`,l=a,s=class{constructor(t){e(this,t),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}render(){return n(o,{key:"2d25f540b5e5fcac0456fa73c78ef6a9a0e0c88f",class:"kol-table-stateless"},n(i,{key:"041c506989c903ca0121bdc5d04d2ca979fbc5fe",_data:this._data,_dataFoot:this._dataFoot,_headerCells:this._headerCells,_label:this._label,_minWidth:this._minWidth,_on:this._on,_selection:this._selection}))}};s.style={default:l};export{s as kol_table_stateless};
-//# sourceMappingURL=kol-table-stateless.entry-BVKzgd9D.js.map
+//# sourceMappingURL=kol-table-stateless.entry-CEx8UpaF.js.map

package/dist/assets/kol-table-stateless.entry-CEx8UpaF.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kol-table-stateless.entry-CEx8UpaF.js","sources":["../../../../components/dist/esm/kol-table-stateless.entry.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { r as registerInstance, h, H as Host } from './index-546fd190.js';\nimport { r as KolTableStatelessWcTag } from './component-names-4cb1c62b.js';\n\nconst defaultStyleCss = \"/*\\n * This file contains all rules for accessibility.\\n */\\n@layer kol-a11y {\\n  :host {\\n    /*\\n     * Minimum size of interactive elements.\\n     */\\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\\n    color: black;\\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    /*\\n     * Verdana is an accessible font that can be used without requiring additional loading time.\\n     */\\n    font-family: Verdana;\\n    /*\\n     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\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     * This rule enables the word dividing for all texts. That is important for high zoom levels.\\n     */\\n    word-break: break-word;\\n  }\\n  /*\\n   * All interactive elements should have a minimum size of rem(44).\\n   */\\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\\n  /* option, */\\n  /* select, */\\n  /* textarea, */\\n  button,\\n  .kol-input .input {\\n    min-width: var(--a11y-min-size);\\n    min-height: 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     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\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    position: absolute;\\n    width: 1px;\\n    height: 1px;\\n    overflow: hidden;\\n    white-space: nowrap;\\n    clip-path: inset(50%);\\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    width: 100%; /* 100% needed for custom width from outside */\\n    margin: 0;\\n    padding: 0;\\n    border: none;\\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    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\\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    opacity: 0.5;\\n    outline: none;\\n    cursor: not-allowed;\\n  }\\n  [aria-disabled=true]:focus .kol-span-wc,\\n  [disabled]:focus .kol-span-wc {\\n    outline: none !important;\\n  }\\n  .badge-text-hint {\\n    color: black;\\n    background-color: lightgray;\\n  }\\n}\\n@layer kol-component {\\n  :host {\\n    display: block;\\n  }\\n}\\n@layer kol-component {\\n  .kol-tooltip-wc {\\n    display: contents;\\n    contain: layout;\\n  }\\n  .kol-tooltip-wc .tooltip-floating {\\n    display: none;\\n    position: fixed;\\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\\n    top: 0;\\n    left: 0;\\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\\n    width: var(--kol-tooltip-width);\\n    max-width: 90vw;\\n    max-height: 90vh;\\n    visibility: hidden;\\n    animation-duration: 0.25s;\\n    animation-iteration-count: 1;\\n    animation-name: fadeInOpacity;\\n    animation-timing-function: ease-in;\\n  }\\n  /* Shared between content and arrow */\\n  .kol-tooltip-wc .tooltip-area {\\n    color: #000;\\n    background-color: #fff;\\n  }\\n  .kol-tooltip-wc .tooltip-arrow {\\n    transform: rotate(45deg);\\n    position: absolute;\\n    z-index: 999;\\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\\n  }\\n  .kol-tooltip-wc .tooltip-content {\\n    position: relative;\\n    z-index: 1000;\\n  }\\n  @keyframes fadeInOpacity {\\n    0% {\\n      opacity: 0;\\n    }\\n    100% {\\n      opacity: 1;\\n    }\\n  }\\n}\\n@layer kol-component {\\n  :host,\\n  .kol-table-stateless-wc {\\n    display: block;\\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: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  tr.foot-spacer,\\n  tr.head-spacer {\\n    display: none;\\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    display: flex;\\n    position: relative;\\n    width: var(--a11y-min-size);\\n    height: var(--a11y-min-size);\\n    align-items: center;\\n    justify-content: center;\\n    cursor: pointer;\\n  }\\n  .input .icon {\\n    display: block;\\n    position: absolute;\\n    inset: auto;\\n    z-index: 1;\\n  }\\n  .input input {\\n    border-style: solid;\\n    margin: 0;\\n    appearance: none;\\n    cursor: pointer;\\n  }\\n  .input input:before {\\n    content: \\\"\\\";\\n  }\\n  .input input[type=checkbox] {\\n    background-color: rgb(255, 255, 255);\\n    display: flex;\\n    position: relative;\\n    width: calc(var(--a11y-min-size) / 2);\\n    height: calc(var(--a11y-min-size) / 2);\\n    border-width: 2px;\\n    align-items: center;\\n    justify-content: center;\\n    line-height: 1.5;\\n    transition: all 0.5s ease 0s;\\n  }\\n  .input input[type=radio] {\\n    border-radius: 100%;\\n    display: flex;\\n    width: 1.5em;\\n    min-width: 1.5em;\\n    height: 1.5em;\\n    min-height: 1.5em;\\n    padding: 0;\\n    border-width: 2px;\\n  }\\n  .input input[type=radio]:before {\\n    border-radius: 100%;\\n    width: 0.75em;\\n    height: 0.75em;\\n    margin: auto;\\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-color: selectedItem !important;\\n    }\\n  }\\n}\";\nconst KolTableStatelessDefaultStyle0 = defaultStyleCss;\n\nconst KolTableStateless = class {\n    constructor(hostRef) {\n        registerInstance(this, hostRef);\n        this._data = undefined;\n        this._dataFoot = undefined;\n        this._headerCells = undefined;\n        this._label = undefined;\n        this._minWidth = undefined;\n        this._on = undefined;\n        this._selection = undefined;\n    }\n    render() {\n        return (h(Host, { key: '2d25f540b5e5fcac0456fa73c78ef6a9a0e0c88f', class: \"kol-table-stateless\" }, h(KolTableStatelessWcTag, { key: '041c506989c903ca0121bdc5d04d2ca979fbc5fe', _data: this._data, _dataFoot: this._dataFoot, _headerCells: this._headerCells, _label: this._label, _minWidth: this._minWidth, _on: this._on, _selection: this._selection })));\n    }\n};\nKolTableStateless.style = {\n    default: KolTableStatelessDefaultStyle0\n};\n\nexport { KolTableStateless as kol_table_stateless };\n\n//# sourceMappingURL=kol-table-stateless.entry.js.map"],"names":["defaultStyleCss","KolTableStatelessDefaultStyle0","KolTableStateless","hostRef","registerInstance","h","Host","KolTableStatelessWcTag"],"mappings":"8DAAA;AAAA;AAAA,GAMA,MAAMA,EAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAClBC,EAAiCD,EAEjCE,EAAoB,KAAM,CAC5B,YAAYC,EAAS,CACjBC,EAAiB,KAAMD,CAAO,EAC9B,KAAK,MAAQ,OACb,KAAK,UAAY,OACjB,KAAK,aAAe,OACpB,KAAK,OAAS,OACd,KAAK,UAAY,OACjB,KAAK,IAAM,OACX,KAAK,WAAa,MACtB,CACA,QAAS,CACL,OAAQE,EAAEC,EAAM,CAAE,IAAK,2CAA4C,MAAO,qBAAqB,EAAID,EAAEE,EAAwB,CAAE,IAAK,2CAA4C,MAAO,KAAK,MAAO,UAAW,KAAK,UAAW,aAAc,KAAK,aAAc,OAAQ,KAAK,OAAQ,UAAW,KAAK,UAAW,IAAK,KAAK,IAAK,WAAY,KAAK,UAAU,CAAE,CAAC,CAChW,CACJ,EACAL,EAAkB,MAAQ,CACtB,QAASD,CACb"}

package/dist/assets/{kol-table.entry-ELE2iebM.js → kol-table.entry-Dp5ugewx.js}

@@ -1,4 +1,4 @@
-import{r as i,h as n,a9 as e}from"./index-CJwtOLCA.js";/*!
+import{r as i,h as n,a9 as e}from"./index-BUU9OKG2.js";/*!
  * KoliBri - The accessible HTML-Standard
  */const o=class{constructor(t){i(this,t),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}render(){return n(e,{key:"58a3df411bde84a518f848d1e88bd39d495f070c",_allowMultiSort:this._allowMultiSort,_data:this._data,_dataFoot:this._dataFoot,_headers:this._headers,_label:this._label,_minWidth:this._minWidth,_pagination:this._pagination,_paginationPosition:this._paginationPosition,_selection:this._selection,_on:this._on})}};export{o as kol_table};
-//# sourceMappingURL=kol-table.entry-ELE2iebM.js.map
+//# sourceMappingURL=kol-table.entry-Dp5ugewx.js.map

package/dist/assets/{kol-table.entry-ELE2iebM.js.map → kol-table.entry-Dp5ugewx.js.map}

@@ -1 +1 @@
-{"version":3,"file":"kol-table.entry-ELE2iebM.js","sources":["../../../../components/dist/esm/kol-table.entry.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { r as registerInstance, h } from './index-1766e6f4.js';\nimport { p as KolTableStatefulTag } from './component-names-4cb1c62b.js';\n\nconst KolTable = class {\n    constructor(hostRef) {\n        registerInstance(this, hostRef);\n        this._allowMultiSort = undefined;\n        this._data = undefined;\n        this._dataFoot = undefined;\n        this._headers = undefined;\n        this._label = undefined;\n        this._minWidth = undefined;\n        this._pagination = undefined;\n        this._paginationPosition = 'bottom';\n        this._selection = undefined;\n        this._on = undefined;\n    }\n    render() {\n        return (h(KolTableStatefulTag, { key: '58a3df411bde84a518f848d1e88bd39d495f070c', _allowMultiSort: this._allowMultiSort, _data: this._data, _dataFoot: this._dataFoot, _headers: this._headers, _label: this._label, _minWidth: this._minWidth, _pagination: this._pagination, _paginationPosition: this._paginationPosition, _selection: this._selection, _on: this._on }));\n    }\n};\n\nexport { KolTable as kol_table };\n\n//# sourceMappingURL=kol-table.entry.js.map"],"names":["KolTable","hostRef","registerInstance","h","KolTableStatefulTag"],"mappings":"uDAAA;AAAA;AAAA,GAMK,MAACA,EAAW,KAAM,CACnB,YAAYC,EAAS,CACjBC,EAAiB,KAAMD,CAAO,EAC9B,KAAK,gBAAkB,OACvB,KAAK,MAAQ,OACb,KAAK,UAAY,OACjB,KAAK,SAAW,OAChB,KAAK,OAAS,OACd,KAAK,UAAY,OACjB,KAAK,YAAc,OACnB,KAAK,oBAAsB,SAC3B,KAAK,WAAa,OAClB,KAAK,IAAM,MACnB,CACI,QAAS,CACL,OAAQE,EAAEC,EAAqB,CAAE,IAAK,2CAA4C,gBAAiB,KAAK,gBAAiB,MAAO,KAAK,MAAO,UAAW,KAAK,UAAW,SAAU,KAAK,SAAU,OAAQ,KAAK,OAAQ,UAAW,KAAK,UAAW,YAAa,KAAK,YAAa,oBAAqB,KAAK,oBAAqB,WAAY,KAAK,WAAY,IAAK,KAAK,IAAK,CAClX,CACA"}
+{"version":3,"file":"kol-table.entry-Dp5ugewx.js","sources":["../../../../components/dist/esm/kol-table.entry.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { r as registerInstance, h } from './index-546fd190.js';\nimport { p as KolTableStatefulTag } from './component-names-4cb1c62b.js';\n\nconst KolTable = class {\n    constructor(hostRef) {\n        registerInstance(this, hostRef);\n        this._allowMultiSort = undefined;\n        this._data = undefined;\n        this._dataFoot = undefined;\n        this._headers = undefined;\n        this._label = undefined;\n        this._minWidth = undefined;\n        this._pagination = undefined;\n        this._paginationPosition = 'bottom';\n        this._selection = undefined;\n        this._on = undefined;\n    }\n    render() {\n        return (h(KolTableStatefulTag, { key: '58a3df411bde84a518f848d1e88bd39d495f070c', _allowMultiSort: this._allowMultiSort, _data: this._data, _dataFoot: this._dataFoot, _headers: this._headers, _label: this._label, _minWidth: this._minWidth, _pagination: this._pagination, _paginationPosition: this._paginationPosition, _selection: this._selection, _on: this._on }));\n    }\n};\n\nexport { KolTable as kol_table };\n\n//# sourceMappingURL=kol-table.entry.js.map"],"names":["KolTable","hostRef","registerInstance","h","KolTableStatefulTag"],"mappings":"uDAAA;AAAA;AAAA,GAMK,MAACA,EAAW,KAAM,CACnB,YAAYC,EAAS,CACjBC,EAAiB,KAAMD,CAAO,EAC9B,KAAK,gBAAkB,OACvB,KAAK,MAAQ,OACb,KAAK,UAAY,OACjB,KAAK,SAAW,OAChB,KAAK,OAAS,OACd,KAAK,UAAY,OACjB,KAAK,YAAc,OACnB,KAAK,oBAAsB,SAC3B,KAAK,WAAa,OAClB,KAAK,IAAM,MACf,CACA,QAAS,CACL,OAAQE,EAAEC,EAAqB,CAAE,IAAK,2CAA4C,gBAAiB,KAAK,gBAAiB,MAAO,KAAK,MAAO,UAAW,KAAK,UAAW,SAAU,KAAK,SAAU,OAAQ,KAAK,OAAQ,UAAW,KAAK,UAAW,YAAa,KAAK,YAAa,oBAAqB,KAAK,oBAAqB,WAAY,KAAK,WAAY,IAAK,KAAK,IAAK,CAC9W,CACJ"}

package/dist/assets/{kol-tabs.entry-CUvgeQkO.js → kol-tabs.entry-CiKVzQ_A.js}

@@ -1,4 +1,4 @@
-import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y as _,ad as w,m as k,w as T}from"./index-CJwtOLCA.js";import{t as x}from"./i18n-820d85c7-BH6ws-IX.js";import{K as r}from"./keyboard-77e19a81-D1ah5412.js";import{v as C}from"./align-bc8d98ac-DfD8j5LE.js";import{v as P}from"./label-51d66c9d-CT4N_dB0.js";/*!
+import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y as _,ad as w,m as k,w as T}from"./index-BUU9OKG2.js";import{t as x}from"./i18n-b4507b80-Ky9eA4Kp.js";import{K as r}from"./keyboard-77e19a81-D1ah5412.js";import{v as C}from"./align-ef25bf72-DQjfye0x.js";import{v as P}from"./label-2d7e2d68-BaoWgDXa.js";/*!
  * KoliBri - The accessible HTML-Standard
  */const b=["select-automatic","select-manual"],S=(e,t)=>{T(e,"_behavior",n=>typeof n=="string"&&b.includes(n),new Set([`KoliBriTabBehavior {${b.join(", ")}`]),t)},A=`/*
  * This file contains all rules for accessibility.
@@ -9,13 +9,13 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
      * Minimum size of interactive elements.
      */
     --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));
+    color: black;
     /*
      * No element should be used without a background and font color whose contrast ratio has
      * not been checked. By initially setting the background color to white and the font color
      * to black, the contrast ratio is ensured and explicit adjustment is forced.
      */
     background-color: white;
-    color: black;
     /*
      * Verdana is an accessible font that can be used without requiring additional loading time.
      */
@@ -46,11 +46,10 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
   /* option, */
   /* select, */
   /* textarea, */
-  [role=button],
-  button:not([role=link]),
+  button,
   .kol-input .input {
-    min-height: var(--a11y-min-size);
     min-width: var(--a11y-min-size);
+    min-height: var(--a11y-min-size);
   }
   /*
    * Some interactive elements should not inherit the font-family and font-size.
@@ -96,7 +95,6 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
     height: 1px;
     overflow: hidden;
     white-space: nowrap;
-    clip: rect(0 0 0 0);
     clip-path: inset(50%);
   }
 }
@@ -107,10 +105,10 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
    */
   :is(a, button) {
     background-color: transparent;
-    border: none;
+    width: 100%; /* 100% needed for custom width from outside */
     margin: 0;
     padding: 0;
-    width: 100%; /* 100% needed for custom width from outside */
+    border: none;
   }
   /*
    * Ensure elements with hidden attribute to be actually not visible
@@ -122,12 +120,12 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
 }
 @layer kol-global {
   :host {
-    font-size: calc(16rem / var(--kolibri-root-font-size, 16));
     /*
      * The max-width is needed to prevent the table from overflowing the
      * parent node, if the table is wider than the parent node.
      */
     max-width: 100%;
+    font-size: calc(16rem / var(--kolibri-root-font-size, 16));
   }
   * {
     /*
@@ -163,17 +161,17 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
   [aria-disabled=true]:focus,
   [disabled],
   [disabled]:focus {
-    cursor: not-allowed;
     opacity: 0.5;
     outline: none;
+    cursor: not-allowed;
   }
   [aria-disabled=true]:focus .kol-span-wc,
   [disabled]:focus .kol-span-wc {
     outline: none !important;
   }
   .badge-text-hint {
-    background-color: lightgray;
     color: black;
+    background-color: lightgray;
   }
 }
 @layer kol-component {
@@ -187,32 +185,32 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
     contain: layout;
   }
   .kol-tooltip-wc .tooltip-floating {
-    animation-duration: 0.25s;
-    animation-iteration-count: 1;
-    animation-name: fadeInOpacity;
-    animation-timing-function: ease-in;
     display: none;
     position: fixed;
-    visibility: hidden;
     /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */
     top: 0;
     left: 0;
-    max-width: 90vw;
-    max-height: 90vh;
     /* Can be used to specify the tooltip-width from the outside. Unset by default.  */
     width: var(--kol-tooltip-width);
+    max-width: 90vw;
+    max-height: 90vh;
+    visibility: hidden;
+    animation-duration: 0.25s;
+    animation-iteration-count: 1;
+    animation-name: fadeInOpacity;
+    animation-timing-function: ease-in;
   }
   /* Shared between content and arrow */
   .kol-tooltip-wc .tooltip-area {
-    background-color: #fff;
     color: #000;
+    background-color: #fff;
   }
   .kol-tooltip-wc .tooltip-arrow {
-    height: calc(10rem / var(--kolibri-root-font-size, 16));
-    position: absolute;
     transform: rotate(45deg);
-    width: calc(10rem / var(--kolibri-root-font-size, 16));
+    position: absolute;
     z-index: 999;
+    width: calc(10rem / var(--kolibri-root-font-size, 16));
+    height: calc(10rem / var(--kolibri-root-font-size, 16));
   }
   .kol-tooltip-wc .tooltip-content {
     position: relative;
@@ -237,8 +235,8 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
   }
   .tabs-button-group button {
     border-bottom-color: transparent;
-    border-bottom-style: solid;
     display: block;
+    border-bottom-style: solid;
   }
   div.grid,
   div[role=tabpanel] {
@@ -249,8 +247,8 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
     grid-template-columns: 1fr auto;
   }
   :host > .tabs-align-right .tabs-button-group {
-    flex-direction: column;
     order: 2;
+    flex-direction: column;
   }
   :host > .tabs-align-right .tabs-button-group .kol-button-wc {
     width: 100%;
@@ -260,8 +258,8 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
     grid-template-columns: auto 1fr;
   }
   :host > .tabs-align-left .tabs-button-group {
-    flex-direction: column;
     order: 0;
+    flex-direction: column;
   }
   :host > .tabs-align-left .tabs-button-group .kol-button-wc {
     width: 100%;
@@ -296,7 +294,7 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
   :host > .tabs-align-top .tabs-button-group > div > div:first-child {
     margin: 0 1em 0 0;
   }
-}`,z=A,B=class{constructor(e){u(this,e),this.onCreateLabel=`${x("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,n,i=1)=>{const a=n+i;return a<t.length?t[a]._disabled?this.nextPossibleTabIndex(t,n,i+1):a:n},this.prevPossibleTabIndex=(t,n,i=1)=>{const a=n-i;return a>=0?t[a]._disabled?this.prevPossibleTabIndex(t,n,i+1):a:n},this.onKeyDown=t=>{switch(t.key){case r.ArrowRight:this.goToNextTab(t);break;case r.ArrowLeft:this.goToPreviousTab(t);break;case r.Space:case r.Enter:this.activateFocusedTab(t);break}},this.onClickSelect=(t,n)=>{this.selectNextTabEvent(t,n)},this.onMouseDown=t=>{t.preventDefault(),t.stopPropagation()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,n,i=!0,a)=>{if(t>n.length-1&&(t=n.length-1),t<0&&(t=0),Array.isArray(n)&&n[t]&&n[t]._disabled){if(i===!0){if(t<n.length-1)return this.selectNextNotDisabledTab(t+1,n,!0,a||t);t=a||t,i=!1}if(i===!1){if(t>0)return this.selectNextNotDisabledTab(t-1,n,!1,a||t);p("[KolTabs] All tabs are disabled, and therefore no tab can be displayed.")}}return t},this.syncSelectedAndTabs=(t,n,i,a)=>{let o;a==="_selected"?o=t:o=this.state._selected;let s;a==="_tabs"?s=t:s=this.state._tabs,s.length>0&&n.set("_selected",this.selectNextNotDisabledTab(o,s))},this.refreshTabPanels=()=>{var t,n,i,a;if(this.tabPanelHost){for(;this.tabPanelHost.firstChild;)this.tabPanelHost.removeChild(this.tabPanelHost.firstChild);for(let o=0;o<((t=this.state._tabs)===null||t===void 0?void 0:t.length);o++){const s=document.createElement("div");s.setAttribute("aria-labelledby",`${this.state._label.replace(/\s/g,"-")}-tab-${o}`),s.setAttribute("id",`tabpanel-${o}`),s.setAttribute("role","tabpanel"),s.setAttribute("hidden","");const d=document.createElement("slot");d.setAttribute("name",`tabpanel-slot-${o}`),s.appendChild(d),(n=this.tabPanelHost)===null||n===void 0||n.appendChild(s),typeof HTMLCollection<"u"&&((i=this.host)===null||i===void 0?void 0:i.children)instanceof HTMLCollection&&(!((a=this.host)===null||a===void 0)&&a.children[o])&&this.host.children[o].setAttribute("slot",`tabpanel-slot-${o}`)}this.updateVisiblePanel()}},this.updateVisiblePanel=()=>{this.tabPanelHost&&Array.from(this.tabPanelHost.children).forEach((t,n)=>{n===this.state._selected?t.removeAttribute("hidden"):t.setAttribute("hidden","")})},this.onCreate=t=>{var n,i;t.preventDefault(),t.stopPropagation(),typeof((n=this.state._on)===null||n===void 0?void 0:n.onCreate)=="function"&&((i=this.state._on)===null||i===void 0||i.onCreate(t))},this.onBlur=()=>{this.currentFocusIndex=void 0},this._align="top",this._behavior=void 0,this._label=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this.state={_align:"top",_label:"",_selected:0,_tabs:[]}}getCurrentFocusIndex(){return typeof this.currentFocusIndex=="number"?this.currentFocusIndex:this.state._selected}getKeyboardTabChangeMode(){return this._behavior==="select-manual"?"selectFocusOnly":"activateCompletely"}goToNextTab(e){const t=this.nextPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(e,t,this.getKeyboardTabChangeMode())}goToPreviousTab(e){const t=this.prevPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(e,t,this.getKeyboardTabChangeMode())}activateFocusedTab(e){typeof this.currentFocusIndex=="number"&&this.onSelect(e,this.currentFocusIndex)}selectNextTabEvent(e,t,n="activateCompletely"){var i,a;this.currentFocusIndex=t,this.focusTabById(t),n==="activateCompletely"&&(this._selected=t,(a=(i=this.state._tabs[t]._on)===null||i===void 0?void 0:i.onSelect)===null||a===void 0||a.call(i,e,t),this.onSelect(e,t))}renderButtonGroup(){return l("div",{"aria-label":this.state._label,class:"tabs-button-group kol-button-group-wc",role:"tablist",onKeyDown:this.onKeyDown,onBlur:this.onBlur},this.state._tabs.map((e,t)=>l(h,{_disabled:e._disabled,_icons:e._icons,_hideLabel:e._hideLabel,_label:e._label,_on:this.callbacks,_tabIndex:this.state._selected===t?0:-1,_tooltipAlign:e._tooltipAlign,_variant:this.state._selected===t?"custom":void 0,_customClass:this.state._selected===t?"selected":void 0,_ariaControls:`tabpanel-${t}`,_ariaSelected:this.state._selected===t,_id:`${this.state._label.replace(/\s/g,"-")}-tab-${t}`,_role:"tab",_value:t})),this.showCreateTab&&l(h,{class:"create-button",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return l(f,{key:"a02c752d8022d3dc07d3a0a79041ba56f22ed4e7",class:"kol-tabs"},l("div",{key:"e1c4253e3c988ca91585157b68777f0d8768bc92",ref:e=>{this.tabPanelsElement=e},class:{[`tabs-align-${this.state._align}`]:!0}},this.renderButtonGroup(),l("div",{key:"bca598b8f2a7263c0e330c363a58d41beed85519",class:"tabs-content",ref:this.catchTabPanelHost})))}validateAlign(e){C(this,e)}validateBehavior(e){S(this,e)}validateLabel(e){P(this,e,{required:!0})}validateOn(e){if(typeof e=="object"&&e!==null){g("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const t={};(typeof e.onCreate=="function"||typeof e.onCreate=="object")&&(typeof e.onCreate=="object"?(typeof e.onCreate.label=="string"&&e.onCreate.label.length>0?this.onCreateLabel=e.onCreate.label:c.debug(`[KolTabs] The label text for New in {
+}`,z=A,B=class{constructor(e){u(this,e),this.onCreateLabel=`${x("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,n,a=1)=>{const i=n+a;return i<t.length?t[i]._disabled?this.nextPossibleTabIndex(t,n,a+1):i:n},this.prevPossibleTabIndex=(t,n,a=1)=>{const i=n-a;return i>=0?t[i]._disabled?this.prevPossibleTabIndex(t,n,a+1):i:n},this.onKeyDown=t=>{switch(t.key){case r.ArrowRight:this.goToNextTab(t);break;case r.ArrowLeft:this.goToPreviousTab(t);break;case r.Space:case r.Enter:this.activateFocusedTab(t);break}},this.onClickSelect=(t,n)=>{this.selectNextTabEvent(t,n)},this.onMouseDown=t=>{t.preventDefault(),t.stopPropagation()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,n,a=!0,i)=>{if(t>n.length-1&&(t=n.length-1),t<0&&(t=0),Array.isArray(n)&&n[t]&&n[t]._disabled){if(a===!0){if(t<n.length-1)return this.selectNextNotDisabledTab(t+1,n,!0,i||t);t=i||t,a=!1}if(a===!1){if(t>0)return this.selectNextNotDisabledTab(t-1,n,!1,i||t);p("[KolTabs] All tabs are disabled, and therefore no tab can be displayed.")}}return t},this.syncSelectedAndTabs=(t,n,a,i)=>{let o;i==="_selected"?o=t:o=this.state._selected;let s;i==="_tabs"?s=t:s=this.state._tabs,s.length>0&&n.set("_selected",this.selectNextNotDisabledTab(o,s))},this.refreshTabPanels=()=>{var t,n,a,i;if(this.tabPanelHost){for(;this.tabPanelHost.firstChild;)this.tabPanelHost.removeChild(this.tabPanelHost.firstChild);for(let o=0;o<((t=this.state._tabs)===null||t===void 0?void 0:t.length);o++){const s=document.createElement("div");s.setAttribute("aria-labelledby",`${this.state._label.replace(/\s/g,"-")}-tab-${o}`),s.setAttribute("id",`tabpanel-${o}`),s.setAttribute("role","tabpanel"),s.setAttribute("hidden","");const d=document.createElement("slot");d.setAttribute("name",`tabpanel-slot-${o}`),s.appendChild(d),(n=this.tabPanelHost)===null||n===void 0||n.appendChild(s),typeof HTMLCollection<"u"&&((a=this.host)===null||a===void 0?void 0:a.children)instanceof HTMLCollection&&(!((i=this.host)===null||i===void 0)&&i.children[o])&&this.host.children[o].setAttribute("slot",`tabpanel-slot-${o}`)}this.updateVisiblePanel()}},this.updateVisiblePanel=()=>{this.tabPanelHost&&Array.from(this.tabPanelHost.children).forEach((t,n)=>{n===this.state._selected?t.removeAttribute("hidden"):t.setAttribute("hidden","")})},this.onCreate=t=>{var n,a;t.preventDefault(),t.stopPropagation(),typeof((n=this.state._on)===null||n===void 0?void 0:n.onCreate)=="function"&&((a=this.state._on)===null||a===void 0||a.onCreate(t))},this.onBlur=()=>{this.currentFocusIndex=void 0},this._align="top",this._behavior=void 0,this._label=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this.state={_align:"top",_label:"",_selected:0,_tabs:[]}}getCurrentFocusIndex(){return typeof this.currentFocusIndex=="number"?this.currentFocusIndex:this.state._selected}getKeyboardTabChangeMode(){return this._behavior==="select-manual"?"selectFocusOnly":"activateCompletely"}goToNextTab(e){const t=this.nextPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(e,t,this.getKeyboardTabChangeMode())}goToPreviousTab(e){const t=this.prevPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(e,t,this.getKeyboardTabChangeMode())}activateFocusedTab(e){typeof this.currentFocusIndex=="number"&&this.onSelect(e,this.currentFocusIndex)}selectNextTabEvent(e,t,n="activateCompletely"){var a,i;this.currentFocusIndex=t,this.focusTabById(t),n==="activateCompletely"&&(this._selected=t,(i=(a=this.state._tabs[t]._on)===null||a===void 0?void 0:a.onSelect)===null||i===void 0||i.call(a,e,t),this.onSelect(e,t))}renderButtonGroup(){return l("div",{"aria-label":this.state._label,class:"tabs-button-group kol-button-group-wc",role:"tablist",onKeyDown:this.onKeyDown,onBlur:this.onBlur},this.state._tabs.map((e,t)=>l(h,{_disabled:e._disabled,_icons:e._icons,_hideLabel:e._hideLabel,_label:e._label,_on:this.callbacks,_tabIndex:this.state._selected===t?0:-1,_tooltipAlign:e._tooltipAlign,_variant:this.state._selected===t?"custom":void 0,_customClass:this.state._selected===t?"selected":void 0,_ariaControls:`tabpanel-${t}`,_ariaSelected:this.state._selected===t,_id:`${this.state._label.replace(/\s/g,"-")}-tab-${t}`,_role:"tab",_value:t})),this.showCreateTab&&l(h,{class:"create-button",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return l(f,{key:"a02c752d8022d3dc07d3a0a79041ba56f22ed4e7",class:"kol-tabs"},l("div",{key:"e1c4253e3c988ca91585157b68777f0d8768bc92",ref:e=>{this.tabPanelsElement=e},class:{[`tabs-align-${this.state._align}`]:!0}},this.renderButtonGroup(),l("div",{key:"bca598b8f2a7263c0e330c363a58d41beed85519",class:"tabs-content",ref:this.catchTabPanelHost})))}validateAlign(e){C(this,e)}validateBehavior(e){S(this,e)}validateLabel(e){P(this,e,{required:!0})}validateOn(e){if(typeof e=="object"&&e!==null){g("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const t={};(typeof e.onCreate=="function"||typeof e.onCreate=="object")&&(typeof e.onCreate=="object"?(typeof e.onCreate.label=="string"&&e.onCreate.label.length>0?this.onCreateLabel=e.onCreate.label:c.debug(`[KolTabs] The label text for New in {
   onCreate: {
     label: string (!),
     callback: Function
@@ -306,5 +304,5 @@ import{r as u,C as p,h as l,c as h,H as f,f as g,L as c,s as m,B as y,X as v,Y a
     label: string,
     callback: Function (!)
   }
-} is not set correctly.`)):t.onCreate=e.onCreate,this.showCreateTab=typeof t.onCreate=="function"),typeof e.onSelect=="function"&&(t.onSelect=e.onSelect),m(this,"_on",t)}}validateSelected(e){y(this,"_selected",e,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(e){v(this,"_tabs",t=>typeof t=="object"&&t!==null&&typeof t._label=="string"&&t._label.length>0,e,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs,afterPatch:this.refreshTabPanels}}),_("KolTabs",this.state._tabs.length)}componentWillLoad(){this.validateAlign(this._align),this.validateLabel(this._label),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs),this.validateBehavior(this._behavior)}componentDidRender(){this.refreshTabPanels()}focusTabById(e){if(this.tabPanelsElement){const t=w(`button#${this.state._label.replace(/\s/g,"-")}-tab-${e}`,this.tabPanelsElement);t==null||t.focus()}}onSelect(e,t){var n,i;(i=(n=this._on)===null||n===void 0?void 0:n.onSelect)===null||i===void 0||i.call(n,e,t),this.focusTabById(t)}get host(){return k(this)}static get watchers(){return{_align:["validateAlign"],_behavior:["validateBehavior"],_label:["validateLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"]}}};B.style={default:z};export{B as kol_tabs};
-//# sourceMappingURL=kol-tabs.entry-CUvgeQkO.js.map
+} is not set correctly.`)):t.onCreate=e.onCreate,this.showCreateTab=typeof t.onCreate=="function"),typeof e.onSelect=="function"&&(t.onSelect=e.onSelect),m(this,"_on",t)}}validateSelected(e){y(this,"_selected",e,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(e){v(this,"_tabs",t=>typeof t=="object"&&t!==null&&typeof t._label=="string"&&t._label.length>0,e,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs,afterPatch:this.refreshTabPanels}}),_("KolTabs",this.state._tabs.length)}componentWillLoad(){this.validateAlign(this._align),this.validateLabel(this._label),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs),this.validateBehavior(this._behavior)}componentDidRender(){this.refreshTabPanels()}focusTabById(e){if(this.tabPanelsElement){const t=w(`button#${this.state._label.replace(/\s/g,"-")}-tab-${e}`,this.tabPanelsElement);t?.focus()}}onSelect(e,t){var n,a;(a=(n=this._on)===null||n===void 0?void 0:n.onSelect)===null||a===void 0||a.call(n,e,t),this.focusTabById(t)}get host(){return k(this)}static get watchers(){return{_align:["validateAlign"],_behavior:["validateBehavior"],_label:["validateLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"]}}};B.style={default:z};export{B as kol_tabs};
+//# sourceMappingURL=kol-tabs.entry-CiKVzQ_A.js.map

package/dist/assets/kol-tabs.entry-CiKVzQ_A.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kol-tabs.entry-CiKVzQ_A.js","sources":["../../../../components/dist/esm/kol-tabs.entry.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { r as registerInstance, h, H as Host, g as getElement } from './index-546fd190.js';\nimport { w as watchValidator, C as devHint, h as featureHint, L as Log, m as setState, F as watchNumber, v as watchJsonArrayString, x as uiUxHintMillerscheZahl, N as koliBriQuerySelector } from './index-50898179.js';\nimport { t as translate } from './i18n-b4507b80.js';\nimport { c as KolButtonWcTag } from './component-names-4cb1c62b.js';\nimport { K as KeyboardKey } from './keyboard-77e19a81.js';\nimport { a as validateAlign } from './align-ef25bf72.js';\nimport { v as validateLabel } from './label-2d7e2d68.js';\nimport './i18n-b14e6088.js';\n\nconst tabBehaviorPropTypeOptions = ['select-automatic', 'select-manual'];\nconst validateTabBehavior = (component, value) => {\n    watchValidator(component, `_behavior`, (value) => typeof value === 'string' && tabBehaviorPropTypeOptions.includes(value), new Set([`KoliBriTabBehavior {${tabBehaviorPropTypeOptions.join(', ')}`]), value);\n};\n\nconst defaultStyleCss = \"/*\\n * This file contains all rules for accessibility.\\n */\\n@layer kol-a11y {\\n  :host {\\n    /*\\n     * Minimum size of interactive elements.\\n     */\\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\\n    color: black;\\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    /*\\n     * Verdana is an accessible font that can be used without requiring additional loading time.\\n     */\\n    font-family: Verdana;\\n    /*\\n     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\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     * This rule enables the word dividing for all texts. That is important for high zoom levels.\\n     */\\n    word-break: break-word;\\n  }\\n  /*\\n   * All interactive elements should have a minimum size of rem(44).\\n   */\\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\\n  /* option, */\\n  /* select, */\\n  /* textarea, */\\n  button,\\n  .kol-input .input {\\n    min-width: var(--a11y-min-size);\\n    min-height: 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     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\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    position: absolute;\\n    width: 1px;\\n    height: 1px;\\n    overflow: hidden;\\n    white-space: nowrap;\\n    clip-path: inset(50%);\\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    width: 100%; /* 100% needed for custom width from outside */\\n    margin: 0;\\n    padding: 0;\\n    border: none;\\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    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\\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    opacity: 0.5;\\n    outline: none;\\n    cursor: not-allowed;\\n  }\\n  [aria-disabled=true]:focus .kol-span-wc,\\n  [disabled]:focus .kol-span-wc {\\n    outline: none !important;\\n  }\\n  .badge-text-hint {\\n    color: black;\\n    background-color: lightgray;\\n  }\\n}\\n@layer kol-component {\\n  :host {\\n    display: block;\\n  }\\n}\\n@layer kol-component {\\n  .kol-tooltip-wc {\\n    display: contents;\\n    contain: layout;\\n  }\\n  .kol-tooltip-wc .tooltip-floating {\\n    display: none;\\n    position: fixed;\\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\\n    top: 0;\\n    left: 0;\\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\\n    width: var(--kol-tooltip-width);\\n    max-width: 90vw;\\n    max-height: 90vh;\\n    visibility: hidden;\\n    animation-duration: 0.25s;\\n    animation-iteration-count: 1;\\n    animation-name: fadeInOpacity;\\n    animation-timing-function: ease-in;\\n  }\\n  /* Shared between content and arrow */\\n  .kol-tooltip-wc .tooltip-area {\\n    color: #000;\\n    background-color: #fff;\\n  }\\n  .kol-tooltip-wc .tooltip-arrow {\\n    transform: rotate(45deg);\\n    position: absolute;\\n    z-index: 999;\\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\\n  }\\n  .kol-tooltip-wc .tooltip-content {\\n    position: relative;\\n    z-index: 1000;\\n  }\\n  @keyframes fadeInOpacity {\\n    0% {\\n      opacity: 0;\\n    }\\n    100% {\\n      opacity: 1;\\n    }\\n  }\\n}\\n@layer kol-component {\\n  :host > div {\\n    display: grid;\\n  }\\n  .tabs-button-group {\\n    display: flex;\\n    flex-wrap: wrap;\\n  }\\n  .tabs-button-group button {\\n    border-bottom-color: transparent;\\n    display: block;\\n    border-bottom-style: solid;\\n  }\\n  div.grid,\\n  div[role=tabpanel] {\\n    height: 100%;\\n  }\\n  :host > .tabs-align-right {\\n    display: grid;\\n    grid-template-columns: 1fr auto;\\n  }\\n  :host > .tabs-align-right .tabs-button-group {\\n    order: 2;\\n    flex-direction: column;\\n  }\\n  :host > .tabs-align-right .tabs-button-group .kol-button-wc {\\n    width: 100%;\\n  }\\n  :host > .tabs-align-left {\\n    display: grid;\\n    grid-template-columns: auto 1fr;\\n  }\\n  :host > .tabs-align-left .tabs-button-group {\\n    order: 0;\\n    flex-direction: column;\\n  }\\n  :host > .tabs-align-left .tabs-button-group .kol-button-wc {\\n    width: 100%;\\n  }\\n  :host > .tabs-align-bottom {\\n    display: grid;\\n    grid-template-rows: 1fr auto;\\n  }\\n  :host > .tabs-align-bottom .tabs-button-group {\\n    order: 2;\\n  }\\n  :host > .tabs-align-bottom .tabs-button-group > div {\\n    display: flex;\\n    margin: 0 1em;\\n  }\\n  :host > .tabs-align-bottom .tabs-button-group > div > div:first-child {\\n    margin: 0 1em 0 0;\\n  }\\n  :host > .tabs-align-top {\\n    display: grid;\\n    grid-template-rows: auto 1fr;\\n  }\\n  :host > .tabs-align-top .tabs-button-group {\\n    order: 0;\\n  }\\n  :host > .tabs-align-top .tabs-button-group > div {\\n    display: flex;\\n  }\\n  :host > .tabs-align-top .tabs-button-group > div > div {\\n    margin: 0 1em;\\n  }\\n  :host > .tabs-align-top .tabs-button-group > div > div:first-child {\\n    margin: 0 1em 0 0;\\n  }\\n}\";\nconst KolTabsDefaultStyle0 = defaultStyleCss;\n\nconst KolTabs = class {\n    constructor(hostRef) {\n        registerInstance(this, hostRef);\n        this.onCreateLabel = `${translate('kol-new')} …`;\n        this.showCreateTab = false;\n        this.nextPossibleTabIndex = (tabs, offset, step = 1) => {\n            const nextOffset = offset + step;\n            if (nextOffset < tabs.length) {\n                if (tabs[nextOffset]._disabled) {\n                    return this.nextPossibleTabIndex(tabs, offset, step + 1);\n                }\n                return nextOffset;\n            }\n            return offset;\n        };\n        this.prevPossibleTabIndex = (tabs, offset, step = 1) => {\n            const nextOffset = offset - step;\n            if (nextOffset >= 0) {\n                if (tabs[nextOffset]._disabled) {\n                    return this.prevPossibleTabIndex(tabs, offset, step + 1);\n                }\n                return nextOffset;\n            }\n            return offset;\n        };\n        this.onKeyDown = (event) => {\n            switch (event.key) {\n                case KeyboardKey.ArrowRight:\n                    this.goToNextTab(event);\n                    break;\n                case KeyboardKey.ArrowLeft:\n                    this.goToPreviousTab(event);\n                    break;\n                case KeyboardKey.Space:\n                case KeyboardKey.Enter:\n                    this.activateFocusedTab(event);\n                    break;\n            }\n        };\n        this.onClickSelect = (event, index) => {\n            this.selectNextTabEvent(event, index);\n        };\n        this.onMouseDown = (event) => {\n            event.preventDefault();\n            event.stopPropagation();\n        };\n        this.callbacks = {\n            onClick: this.onClickSelect,\n            onMouseDown: this.onMouseDown,\n        };\n        this.catchTabPanelHost = (el) => {\n            this.tabPanelHost = el;\n        };\n        this.selectNextNotDisabledTab = (selected, tabs, upOrDown = true, initialSelected) => {\n            if (selected > tabs.length - 1) {\n                selected = tabs.length - 1;\n            }\n            if (selected < 0) {\n                selected = 0;\n            }\n            if (Array.isArray(tabs) && tabs[selected]) {\n                if (tabs[selected]._disabled) {\n                    if (upOrDown === true) {\n                        if (selected < tabs.length - 1) {\n                            return this.selectNextNotDisabledTab(selected + 1, tabs, true, initialSelected || selected);\n                        }\n                        else {\n                            selected = initialSelected || selected;\n                            upOrDown = false;\n                        }\n                    }\n                    if (upOrDown === false) {\n                        if (selected > 0) {\n                            return this.selectNextNotDisabledTab(selected - 1, tabs, false, initialSelected || selected);\n                        }\n                        else {\n                            devHint(`[KolTabs] All tabs are disabled, and therefore no tab can be displayed.`);\n                        }\n                    }\n                }\n            }\n            return selected;\n        };\n        this.syncSelectedAndTabs = (nextValue, nextState, _component, key) => {\n            let selected;\n            if (key === '_selected') {\n                selected = nextValue;\n            }\n            else {\n                selected = this.state._selected;\n            }\n            let tabs;\n            if (key === '_tabs') {\n                tabs = nextValue;\n            }\n            else {\n                tabs = this.state._tabs;\n            }\n            if (tabs.length > 0) {\n                nextState.set('_selected', this.selectNextNotDisabledTab(selected, tabs));\n            }\n        };\n        this.refreshTabPanels = () => {\n            var _a, _b, _c, _d;\n            if (!this.tabPanelHost)\n                return;\n            while (this.tabPanelHost.firstChild) {\n                this.tabPanelHost.removeChild(this.tabPanelHost.firstChild);\n            }\n            for (let i = 0; i < ((_a = this.state._tabs) === null || _a === void 0 ? void 0 : _a.length); i++) {\n                const div = document.createElement('div');\n                div.setAttribute('aria-labelledby', `${this.state._label.replace(/\\s/g, '-')}-tab-${i}`);\n                div.setAttribute('id', `tabpanel-${i}`);\n                div.setAttribute('role', 'tabpanel');\n                div.setAttribute('hidden', '');\n                const slot = document.createElement('slot');\n                slot.setAttribute('name', `tabpanel-slot-${i}`);\n                div.appendChild(slot);\n                (_b = this.tabPanelHost) === null || _b === void 0 ? void 0 : _b.appendChild(div);\n                if (typeof HTMLCollection !== 'undefined' && ((_c = this.host) === null || _c === void 0 ? void 0 : _c.children) instanceof HTMLCollection && ((_d = this.host) === null || _d === void 0 ? void 0 : _d.children[i])) {\n                    this.host.children[i].setAttribute('slot', `tabpanel-slot-${i}`);\n                }\n            }\n            this.updateVisiblePanel();\n        };\n        this.updateVisiblePanel = () => {\n            if (!this.tabPanelHost)\n                return;\n            Array.from(this.tabPanelHost.children).forEach((child, i) => {\n                if (i === this.state._selected) {\n                    child.removeAttribute('hidden');\n                }\n                else {\n                    child.setAttribute('hidden', '');\n                }\n            });\n        };\n        this.onCreate = (event) => {\n            var _a, _b;\n            event.preventDefault();\n            event.stopPropagation();\n            if (typeof ((_a = this.state._on) === null || _a === void 0 ? void 0 : _a.onCreate) === 'function') {\n                (_b = this.state._on) === null || _b === void 0 ? void 0 : _b.onCreate(event);\n            }\n        };\n        this.onBlur = () => {\n            this.currentFocusIndex = undefined;\n        };\n        this._align = 'top';\n        this._behavior = undefined;\n        this._label = undefined;\n        this._on = undefined;\n        this._selected = 0;\n        this._tabs = undefined;\n        this.state = {\n            _align: 'top',\n            _label: '',\n            _selected: 0,\n            _tabs: [],\n        };\n    }\n    getCurrentFocusIndex() {\n        if (typeof this.currentFocusIndex === 'number') {\n            return this.currentFocusIndex;\n        }\n        return this.state._selected;\n    }\n    getKeyboardTabChangeMode() {\n        if (this._behavior === 'select-manual') {\n            return 'selectFocusOnly';\n        }\n        return 'activateCompletely';\n    }\n    goToNextTab(event) {\n        const nextFocusIndex = this.nextPossibleTabIndex(this.state._tabs, this.getCurrentFocusIndex());\n        this.selectNextTabEvent(event, nextFocusIndex, this.getKeyboardTabChangeMode());\n    }\n    goToPreviousTab(event) {\n        const nextFocusIndex = this.prevPossibleTabIndex(this.state._tabs, this.getCurrentFocusIndex());\n        this.selectNextTabEvent(event, nextFocusIndex, this.getKeyboardTabChangeMode());\n    }\n    activateFocusedTab(event) {\n        if (typeof this.currentFocusIndex === 'number') {\n            this.onSelect(event, this.currentFocusIndex);\n        }\n    }\n    selectNextTabEvent(event, nextTabIndex, changeMode = 'activateCompletely') {\n        var _a, _b;\n        this.currentFocusIndex = nextTabIndex;\n        this.focusTabById(nextTabIndex);\n        if (changeMode === 'activateCompletely') {\n            this._selected = nextTabIndex;\n            const tab = this.state._tabs[nextTabIndex];\n            (_b = (_a = tab._on) === null || _a === void 0 ? void 0 : _a.onSelect) === null || _b === void 0 ? void 0 : _b.call(_a, event, nextTabIndex);\n            this.onSelect(event, nextTabIndex);\n        }\n    }\n    renderButtonGroup() {\n        return (h(\"div\", { \"aria-label\": this.state._label, class: \"tabs-button-group kol-button-group-wc\", role: \"tablist\", onKeyDown: this.onKeyDown, onBlur: this.onBlur }, this.state._tabs.map((button, index) => (h(KolButtonWcTag, { _disabled: button._disabled, _icons: button._icons, _hideLabel: button._hideLabel, _label: button._label, _on: this.callbacks, _tabIndex: this.state._selected === index ? 0 : -1, _tooltipAlign: button._tooltipAlign, _variant: this.state._selected === index ? 'custom' : undefined, _customClass: this.state._selected === index ? 'selected' : undefined, _ariaControls: `tabpanel-${index}`, _ariaSelected: this.state._selected === index, _id: `${this.state._label.replace(/\\s/g, '-')}-tab-${index}`, _role: \"tab\", _value: index }))), this.showCreateTab && (h(KolButtonWcTag, { class: \"create-button\", _label: this.onCreateLabel, _on: {\n                onClick: this.onCreate,\n            } }))));\n    }\n    render() {\n        return (h(Host, { key: 'a02c752d8022d3dc07d3a0a79041ba56f22ed4e7', class: \"kol-tabs\" }, h(\"div\", { key: 'e1c4253e3c988ca91585157b68777f0d8768bc92', ref: (el) => {\n                this.tabPanelsElement = el;\n            }, class: {\n                [`tabs-align-${this.state._align}`]: true,\n            } }, this.renderButtonGroup(), h(\"div\", { key: 'bca598b8f2a7263c0e330c363a58d41beed85519', class: \"tabs-content\", ref: this.catchTabPanelHost }))));\n    }\n    validateAlign(value) {\n        validateAlign(this, value);\n    }\n    validateBehavior(value) {\n        validateTabBehavior(this, value);\n    }\n    validateLabel(value) {\n        validateLabel(this, value, {\n            required: true,\n        });\n    }\n    validateOn(value) {\n        if (typeof value === 'object' && value !== null) {\n            featureHint('[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.');\n            const callbacks = {};\n            if (typeof value.onCreate === 'function' || typeof value.onCreate === 'object') {\n                if (typeof value.onCreate === 'object') {\n                    if (typeof value.onCreate.label === 'string' && value.onCreate.label.length > 0) {\n                        this.onCreateLabel = value.onCreate.label;\n                    }\n                    else {\n                        Log.debug(`[KolTabs] The label text for New in {\n  onCreate: {\n    label: string (!),\n    callback: Function\n  }\n} is not set correctly.`);\n                    }\n                    if (typeof value.onCreate.callback === 'function') {\n                        callbacks.onCreate = value.onCreate.callback;\n                    }\n                    else {\n                        Log.debug(`[KolTabs] The onCreate callback function for New in {\n  onCreate: {\n    label: string,\n    callback: Function (!)\n  }\n} is not set correctly.`);\n                    }\n                }\n                else {\n                    callbacks.onCreate = value.onCreate;\n                }\n                this.showCreateTab = typeof callbacks.onCreate === 'function';\n            }\n            if (typeof value.onSelect === 'function') {\n                callbacks.onSelect = value.onSelect;\n            }\n            setState(this, '_on', callbacks);\n        }\n    }\n    validateSelected(value) {\n        watchNumber(this, '_selected', value, {\n            hooks: {\n                beforePatch: this.syncSelectedAndTabs,\n            },\n        });\n    }\n    validateTabs(value) {\n        watchJsonArrayString(this, '_tabs', (item) => typeof item === 'object' && item !== null && typeof item._label === 'string' && item._label.length > 0, value, undefined, {\n            hooks: {\n                beforePatch: this.syncSelectedAndTabs,\n                afterPatch: this.refreshTabPanels,\n            },\n        });\n        uiUxHintMillerscheZahl('KolTabs', this.state._tabs.length);\n    }\n    componentWillLoad() {\n        this.validateAlign(this._align);\n        this.validateLabel(this._label);\n        this.validateOn(this._on);\n        this.validateSelected(this._selected);\n        this.validateTabs(this._tabs);\n        this.validateBehavior(this._behavior);\n    }\n    componentDidRender() {\n        this.refreshTabPanels();\n    }\n    focusTabById(index) {\n        if (this.tabPanelsElement) {\n            const button = koliBriQuerySelector(`button#${this.state._label.replace(/\\s/g, '-')}-tab-${index}`, this.tabPanelsElement);\n            button === null || button === void 0 ? void 0 : button.focus();\n        }\n    }\n    onSelect(event, index) {\n        var _a, _b;\n        (_b = (_a = this._on) === null || _a === void 0 ? void 0 : _a.onSelect) === null || _b === void 0 ? void 0 : _b.call(_a, event, index);\n        this.focusTabById(index);\n    }\n    get host() { return getElement(this); }\n    static get watchers() { return {\n        \"_align\": [\"validateAlign\"],\n        \"_behavior\": [\"validateBehavior\"],\n        \"_label\": [\"validateLabel\"],\n        \"_on\": [\"validateOn\"],\n        \"_selected\": [\"validateSelected\"],\n        \"_tabs\": [\"validateTabs\"]\n    }; }\n};\nKolTabs.style = {\n    default: KolTabsDefaultStyle0\n};\n\nexport { KolTabs as kol_tabs };\n\n//# sourceMappingURL=kol-tabs.entry.js.map"],"names":["tabBehaviorPropTypeOptions","validateTabBehavior","component","value","watchValidator","defaultStyleCss","KolTabsDefaultStyle0","KolTabs","hostRef","registerInstance","translate","tabs","offset","step","nextOffset","event","KeyboardKey","index","el","selected","upOrDown","initialSelected","devHint","nextValue","nextState","_component","key","_a","_b","_c","_d","i","div","slot","child","nextFocusIndex","nextTabIndex","changeMode","h","button","KolButtonWcTag","Host","validateAlign","validateLabel","featureHint","callbacks","Log","setState","watchNumber","watchJsonArrayString","item","uiUxHintMillerscheZahl","koliBriQuerySelector","getElement"],"mappings":"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"}