@public-ui/sample-react 2.1.4 → 2.1.5-rc.0

package/dist/7856.js

@@ -1,2 +1,2 @@
 /*! For license information please see 7856.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[7856],{7988:(e,n,t)=>{t.d(n,{c:()=>s,h:()=>m,v:()=>f});var r=t(3713),a=t(7238),o={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]},l={red:0,orange:60,yellow:120,green:180,blue:240,purple:300},i=function(e){var n,t,r=[],a=1;if("string"==typeof e)if(e=e.toLowerCase(),o[e])r=o[e].slice(),t="rgb";else if("transparent"===e)a=0,t="rgb",r=[0,0,0];else if(/^#[A-Fa-f0-9]+$/.test(e)){var i=e.slice(1);a=1,(u=i.length)<=4?(r=[parseInt(i[0]+i[0],16),parseInt(i[1]+i[1],16),parseInt(i[2]+i[2],16)],4===u&&(a=parseInt(i[3]+i[3],16)/255)):(r=[parseInt(i[0]+i[1],16),parseInt(i[2]+i[3],16),parseInt(i[4]+i[5],16)],8===u&&(a=parseInt(i[6]+i[7],16)/255)),r[0]||(r[0]=0),r[1]||(r[1]=0),r[2]||(r[2]=0),t="rgb"}else if(n=/^((?:rgb|hs[lvb]|hwb|cmyk?|xy[zy]|gray|lab|lchu?v?|[ly]uv|lms)a?)\s*\(([^\)]*)\)/.exec(e)){var s=n[1],d="rgb"===s;t=i=s.replace(/a$/,"");var u="cmyk"===i?4:"gray"===i?1:3;r=n[2].trim().split(/\s*[,\/]\s*|\s+/).map((function(e,n){if(/%$/.test(e))return n===u?parseFloat(e)/100:"rgb"===i?255*parseFloat(e)/100:parseFloat(e);if("h"===i[n]){if(/deg$/.test(e))return parseFloat(e);if(void 0!==l[e])return l[e]}return parseFloat(e)})),s===i&&r.push(1),a=d||void 0===r[u]?1:r[u],r=r.slice(0,u)}else e.length>10&&/[0-9](?:\s|\/)/.test(e)&&(r=e.match(/([0-9]+)/g).map((function(e){return parseFloat(e)})),t=e.match(/([a-z])/gi).join("").toLowerCase());else isNaN(e)?Array.isArray(e)||e.length?(r=[e[0],e[1],e[2]],t="rgb",a=4===e.length?e[3]:1):e instanceof Object&&(null!=e.r||null!=e.red||null!=e.R?(t="rgb",r=[e.r||e.red||e.R||0,e.g||e.green||e.G||0,e.b||e.blue||e.B||0]):(t="hsl",r=[e.h||e.hue||e.H||0,e.s||e.saturation||e.S||0,e.l||e.lightness||e.L||e.b||e.brightness]),a=e.a||e.alpha||e.opacity||1,null!=e.opacity&&(a/=100)):(t="rgb",r=[e>>>16,(65280&e)>>>8,255&e]);return{space:t,values:r,alpha:a}};const s=function(e){var n;Array.isArray(e)&&e.raw&&(e=String.raw.apply(null,arguments));var t=i(e);if(!t.space)return[];var r=[0,0,0],a="h"===t.space[0]?[360,100,100]:[255,255,255];return(n=Array(3))[0]=Math.min(Math.max(t.values[0],r[0]),a[0]),n[1]=Math.min(Math.max(t.values[1],r[1]),a[1]),n[2]=Math.min(Math.max(t.values[2],r[2]),a[2]),"h"===t.space[0]&&(n=function(e){var n,t,r,a,o,l=e[0]/360,i=e[1]/100,s=e[2]/100,d=0;if(0===i)return[o=255*s,o,o];for(n=2*s-(t=s<.5?s*(1+i):s+i-s*i),a=[0,0,0];d<3;)(r=l+1/3*-(d-1))<0?r++:r>1&&r--,o=6*r<1?n+6*(t-n)*r:2*r<1?t:3*r<2?n+(t-n)*(2/3-r)*6:n,a[d++]=255*o;return a}(n)),n.push(Math.min(Math.max(t.alpha,0),1)),n},d=(e,n,t,r=1)=>{const o=[Math.max(Math.min(Math.round(n[0]+r*Math.max(1,n[0]/100)),255),0),Math.max(Math.min(Math.round(n[1]+r*Math.max(1,n[1]/100)),255),0),Math.max(Math.min(Math.round(n[2]+r*Math.max(1,n[2]/100)),255),0)],l=(0,a.d)(a.r.hex(`rgba(${e.join(",")},1)`),a.r.hex(`rgba(${o.join(",")},1)`)),i=o[0]+o[1]+o[2];return 0===i||765===i||l>t?{background:e,foreground:o,contrast:l}:d(e,o,t,r)},u=new Map,c=(e,n=7)=>{let t=[0,0,0,1],r=[255,255,255,1];"string"==typeof e?(t=s(e),r=t):"object"==typeof e&&null!==e&&"string"==typeof e.background&&"string"==typeof e.foreground&&(t=s(e.background),r="string"==typeof e.foreground?s(e.foreground):t);const o=(299*t[0]+587*t[1]+114*t[2])/1e3>=128?-1:1;const l=((e,n,t,r=1)=>{if(u.has(e))return u.get(e);const a=d(e,n,t,r);return u.set(e,a),a})([t[0],t[1],t[2]],[r[0],r[1],r[2]],n,o);return r=[...l.foreground,1],{background:a.r.hex(`rgba(${t.join(",")})`),foreground:a.r.hex(`rgba(${r.join(",")})`),contrast:l.contrast}},h=/^#((\d|[a-f]){8}|(\d|[a-f]){6}|(\d|[a-f]){3,4})$/i;function g(e){if(e)if("string"==typeof e){if(function(e){return h.test(e)}(e))return{type:"string",valid:!0,value:e};{const n=function(e){if(e.startsWith("{"))try{const n=JSON.parse(e);if(p(n))return{type:"ColorPair",value:n}}catch(e){return{type:null,value:null}}return{type:null,value:null}}(e);if(n.value)return{type:n.type,valid:!0,value:n.value}}}else{const n=e;if(p(n))return{type:"ColorPair",valid:!0,value:n}}return{type:null,valid:!1,value:""}}function p(e){return!("object"!=typeof e||!e||"string"!=typeof e.backgroundColor||!("string"==typeof e.foregroundColor||e.foregroundColor&&"string"==typeof e.foregroundColor.primary&&"string"==typeof e.foregroundColor.secondary&&"string"==typeof e.foregroundColor.neutral))}function b(e){const n=g(e);switch(n.type){case null:return!1;case"string":case"ColorPair":return n.valid}}const f=(e,n,t)=>{(0,a.w)(e,"_color",b,new Set(["rgb in hex","ColorPair"]),n,t)},m=e=>{var n;let t;const o=g(e);switch(o.type){case"string":t=c(o.value);break;case"ColorPair":{const e=o.value;let r="";"string"==typeof e.foregroundColor?r=e.foregroundColor:(null===(n=e.foregroundColor)||void 0===n?void 0:n.primary)&&(r=e.foregroundColor.primary),r&&"string"==typeof r||(r="#fff"),t=c({background:e.backgroundColor,foreground:r});break}case null:r.L.warn(`_color was empty or invalid (${JSON.stringify(e)})`,{forceLog:!0}),t=c({background:"#000",foreground:"#000"})}return t.contrast<7&&(0,a.a)(`[KolBadge] The contrast of ${t.contrast} (≥7, AAA) is to low, between the color pair ${t.background} and ${t.foreground}.`),{backgroundColor:t.background,foregroundColor:t.foreground}}},7519:(e,n,t)=>{t.d(n,{t:()=>o});var r=t(9177),a=t(8796);let o=(e,n)=>{var t;return(null!==(t=(0,r.g)())&&void 0!==t?t:(0,r.i)("de")).translate(e,n)};"test"===a.p&&(o=e=>e)},7856:(e,n,t)=>{t.r(n),t.d(n,{kol_kolibri:()=>i});var r=t(6509),a=t(7988),o=t(7519),l=t(7238);const i=class{constructor(e){(0,r.r)(this,e),this.handleColorChange=(e,n)=>{if("string"==typeof e){const t=(0,a.c)(e);n.set("_color",{red:t[0],green:t[1],blue:t[2]})}else(0,l.j)("[KolKolibri] You used the complex color schema. For the KoliBri we use need the color as hex string.")},this._color="#003c78",this._labeled=!0,this.state={_color:{red:0,green:60,blue:120},_labeled:!0}}render(){const e=`rgb(${this.state._color.red},${this.state._color.green},${this.state._color.blue})`;return(0,r.h)(r.H,{key:"848156de9170117ffdedde1a12f72b2c24fb2a11",class:"kol-kolibri"},(0,r.h)("svg",{key:"7cde143186c9d70d2b62759e0b8682b66ca55338",role:"img","aria-label":(0,o.t)("kol-kolibri-logo"),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 600 600",fill:e},(0,r.h)("path",{key:"a544b4892fce5dae895546901452dad04acbc72a",d:"M353 322L213 304V434L353 322Z"}),(0,r.h)("path",{key:"73ad3de5b24cf887e7b5791ba5d449eae04226e3",d:"M209 564V304L149 434L209 564Z"}),(0,r.h)("path",{key:"a0585763be4aff3f61ecc1d3534bddac28d976a4",d:"M357 316L417 250L361 210L275 244L357 316Z"}),(0,r.h)("path",{key:"8138d7a57e0230ea9699e9f5d19fc54f8d095bf1",d:"M329 218L237 92L250 222L272 241L329 218Z"}),(0,r.h)("path",{key:"3cc8481cf01928f0f39bcc45e6de53e90398ad40",d:"M353 318L35 36L213 300L353 318Z"}),(0,r.h)("path",{key:"c4a97edf0bf361a5bf34f6a468daf984eda0736e",d:"M391 286L565 272L421 252L391 286Z"}),!0===this.state._labeled&&(0,r.h)("text",{key:"cdb74da516faf671d98402d5f83352c07086ae37",x:"250",y:"525",fill:e},"KoliBri")))}validateColor(e){(0,a.v)(this,e,{defaultValue:"#003c78",hooks:{beforePatch:this.handleColorChange}})}validateLabeled(e){(0,l.b)(this,"_labeled",e,{defaultValue:!0})}componentWillLoad(){this.validateColor(this._color),this.validateLabeled(this._labeled)}static get watchers(){return{_color:["validateColor"],_labeled:["validateLabeled"]}}};i.style={default:"/*\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: inline-block;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  text {\n    font-size: 90px;\n    letter-spacing: normal;\n    word-spacing: normal;\n  }\n  svg {\n    max-height: 100%;\n  }\n}"}},8796:(e,n,t)=>{t.d(n,{S:()=>l,a:()=>o,b:()=>r,c:()=>i,h:()=>d,i:()=>a,p:()=>s,s:()=>u});const r=e=>"object"==typeof e&&null!==e,a=(e,n=0)=>"string"==typeof e&&e.length>=n,o=e=>{if("object"!=typeof e||null===e)return a(e,1);for(const n in e)if(!1===a(n,1))return!1;return!0},l=new Event("StateChange"),i=(e,n)=>{r(e)&&e&&(e.focus=e=>null==n?void 0:n.focus(e))};let s="development";try{s="production"}catch(e){s="production"}const d=(e,n,t)=>{if(e&&n&&"string"==typeof t){const r=e.querySelector(`[slot="${t}"]`);r&&n.appendChild(r)}},u=e=>""===e}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[7856],{7988:(e,n,t)=>{t.d(n,{c:()=>s,h:()=>m,v:()=>f});var r=t(3713),a=t(7238),o={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]},l={red:0,orange:60,yellow:120,green:180,blue:240,purple:300},i=function(e){var n,t,r=[],a=1;if("string"==typeof e)if(e=e.toLowerCase(),o[e])r=o[e].slice(),t="rgb";else if("transparent"===e)a=0,t="rgb",r=[0,0,0];else if(/^#[A-Fa-f0-9]+$/.test(e)){var i=e.slice(1);a=1,(u=i.length)<=4?(r=[parseInt(i[0]+i[0],16),parseInt(i[1]+i[1],16),parseInt(i[2]+i[2],16)],4===u&&(a=parseInt(i[3]+i[3],16)/255)):(r=[parseInt(i[0]+i[1],16),parseInt(i[2]+i[3],16),parseInt(i[4]+i[5],16)],8===u&&(a=parseInt(i[6]+i[7],16)/255)),r[0]||(r[0]=0),r[1]||(r[1]=0),r[2]||(r[2]=0),t="rgb"}else if(n=/^((?:rgb|hs[lvb]|hwb|cmyk?|xy[zy]|gray|lab|lchu?v?|[ly]uv|lms)a?)\s*\(([^\)]*)\)/.exec(e)){var s=n[1],d="rgb"===s;t=i=s.replace(/a$/,"");var u="cmyk"===i?4:"gray"===i?1:3;r=n[2].trim().split(/\s*[,\/]\s*|\s+/).map((function(e,n){if(/%$/.test(e))return n===u?parseFloat(e)/100:"rgb"===i?255*parseFloat(e)/100:parseFloat(e);if("h"===i[n]){if(/deg$/.test(e))return parseFloat(e);if(void 0!==l[e])return l[e]}return parseFloat(e)})),s===i&&r.push(1),a=d||void 0===r[u]?1:r[u],r=r.slice(0,u)}else e.length>10&&/[0-9](?:\s|\/)/.test(e)&&(r=e.match(/([0-9]+)/g).map((function(e){return parseFloat(e)})),t=e.match(/([a-z])/gi).join("").toLowerCase());else isNaN(e)?Array.isArray(e)||e.length?(r=[e[0],e[1],e[2]],t="rgb",a=4===e.length?e[3]:1):e instanceof Object&&(null!=e.r||null!=e.red||null!=e.R?(t="rgb",r=[e.r||e.red||e.R||0,e.g||e.green||e.G||0,e.b||e.blue||e.B||0]):(t="hsl",r=[e.h||e.hue||e.H||0,e.s||e.saturation||e.S||0,e.l||e.lightness||e.L||e.b||e.brightness]),a=e.a||e.alpha||e.opacity||1,null!=e.opacity&&(a/=100)):(t="rgb",r=[e>>>16,(65280&e)>>>8,255&e]);return{space:t,values:r,alpha:a}};const s=function(e){var n;Array.isArray(e)&&e.raw&&(e=String.raw.apply(null,arguments));var t=i(e);if(!t.space)return[];var r=[0,0,0],a="h"===t.space[0]?[360,100,100]:[255,255,255];return(n=Array(3))[0]=Math.min(Math.max(t.values[0],r[0]),a[0]),n[1]=Math.min(Math.max(t.values[1],r[1]),a[1]),n[2]=Math.min(Math.max(t.values[2],r[2]),a[2]),"h"===t.space[0]&&(n=function(e){var n,t,r,a,o,l=e[0]/360,i=e[1]/100,s=e[2]/100,d=0;if(0===i)return[o=255*s,o,o];for(n=2*s-(t=s<.5?s*(1+i):s+i-s*i),a=[0,0,0];d<3;)(r=l+1/3*-(d-1))<0?r++:r>1&&r--,o=6*r<1?n+6*(t-n)*r:2*r<1?t:3*r<2?n+(t-n)*(2/3-r)*6:n,a[d++]=255*o;return a}(n)),n.push(Math.min(Math.max(t.alpha,0),1)),n},d=(e,n,t,r=1)=>{const o=[Math.max(Math.min(Math.round(n[0]+r*Math.max(1,n[0]/100)),255),0),Math.max(Math.min(Math.round(n[1]+r*Math.max(1,n[1]/100)),255),0),Math.max(Math.min(Math.round(n[2]+r*Math.max(1,n[2]/100)),255),0)],l=(0,a.d)(a.r.hex(`rgba(${e.join(",")},1)`),a.r.hex(`rgba(${o.join(",")},1)`)),i=o[0]+o[1]+o[2];return 0===i||765===i||l>t?{background:e,foreground:o,contrast:l}:d(e,o,t,r)},u=new Map,c=(e,n=7)=>{let t=[0,0,0,1],r=[255,255,255,1];"string"==typeof e?(t=s(e),r=t):"object"==typeof e&&null!==e&&"string"==typeof e.background&&"string"==typeof e.foreground&&(t=s(e.background),r="string"==typeof e.foreground?s(e.foreground):t);const o=(299*t[0]+587*t[1]+114*t[2])/1e3>=128?-1:1;const l=((e,n,t,r=1)=>{if(u.has(e))return u.get(e);const a=d(e,n,t,r);return u.set(e,a),a})([t[0],t[1],t[2]],[r[0],r[1],r[2]],n,o);return r=[...l.foreground,1],{background:a.r.hex(`rgba(${t.join(",")})`),foreground:a.r.hex(`rgba(${r.join(",")})`),contrast:l.contrast}},h=/^#((\d|[a-f]){8}|(\d|[a-f]){6}|(\d|[a-f]){3,4})$/i;function g(e){if(e)if("string"==typeof e){if(function(e){return h.test(e)}(e))return{type:"string",valid:!0,value:e};{const n=function(e){if(e.startsWith("{"))try{const n=JSON.parse(e);if(p(n))return{type:"ColorPair",value:n}}catch(e){return{type:null,value:null}}return{type:null,value:null}}(e);if(n.value)return{type:n.type,valid:!0,value:n.value}}}else{const n=e;if(p(n))return{type:"ColorPair",valid:!0,value:n}}return{type:null,valid:!1,value:""}}function p(e){return!("object"!=typeof e||!e||"string"!=typeof e.backgroundColor||!("string"==typeof e.foregroundColor||e.foregroundColor&&"string"==typeof e.foregroundColor.primary&&"string"==typeof e.foregroundColor.secondary&&"string"==typeof e.foregroundColor.neutral))}function b(e){const n=g(e);switch(n.type){case null:return!1;case"string":case"ColorPair":return n.valid}}const f=(e,n,t)=>{(0,a.w)(e,"_color",b,new Set(["rgb in hex","ColorPair"]),n,t)},m=e=>{var n;let t;const o=g(e);switch(o.type){case"string":t=c(o.value);break;case"ColorPair":{const e=o.value;let r="";"string"==typeof e.foregroundColor?r=e.foregroundColor:(null===(n=e.foregroundColor)||void 0===n?void 0:n.primary)&&(r=e.foregroundColor.primary),r&&"string"==typeof r||(r="#fff"),t=c({background:e.backgroundColor,foreground:r});break}case null:r.L.warn(`_color was empty or invalid (${JSON.stringify(e)})`,{forceLog:!0}),t=c({background:"#000",foreground:"#000"})}return t.contrast<7&&(0,a.a)(`[KolBadge] The contrast of ${t.contrast} (≥7, AAA) is to low, between the color pair ${t.background} and ${t.foreground}.`),{backgroundColor:t.background,foregroundColor:t.foreground}}},736:(e,n,t)=>{t.d(n,{t:()=>o});var r=t(5675),a=t(8796);let o=(e,n)=>{var t;return(null!==(t=(0,r.g)())&&void 0!==t?t:(0,r.i)("de")).translate(e,n)};"test"===a.p&&(o=e=>e)},7856:(e,n,t)=>{t.r(n),t.d(n,{kol_kolibri:()=>i});var r=t(9944),a=t(7988),o=t(736),l=t(7238);const i=class{constructor(e){(0,r.r)(this,e),this.handleColorChange=(e,n)=>{if("string"==typeof e){const t=(0,a.c)(e);n.set("_color",{red:t[0],green:t[1],blue:t[2]})}else(0,l.j)("[KolKolibri] You used the complex color schema. For the KoliBri we use need the color as hex string.")},this._color="#003c78",this._labeled=!0,this.state={_color:{red:0,green:60,blue:120},_labeled:!0}}render(){const e=`rgb(${this.state._color.red},${this.state._color.green},${this.state._color.blue})`;return(0,r.h)(r.H,{key:"848156de9170117ffdedde1a12f72b2c24fb2a11",class:"kol-kolibri"},(0,r.h)("svg",{key:"7cde143186c9d70d2b62759e0b8682b66ca55338",role:"img","aria-label":(0,o.t)("kol-kolibri-logo"),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 600 600",fill:e},(0,r.h)("path",{key:"a544b4892fce5dae895546901452dad04acbc72a",d:"M353 322L213 304V434L353 322Z"}),(0,r.h)("path",{key:"73ad3de5b24cf887e7b5791ba5d449eae04226e3",d:"M209 564V304L149 434L209 564Z"}),(0,r.h)("path",{key:"a0585763be4aff3f61ecc1d3534bddac28d976a4",d:"M357 316L417 250L361 210L275 244L357 316Z"}),(0,r.h)("path",{key:"8138d7a57e0230ea9699e9f5d19fc54f8d095bf1",d:"M329 218L237 92L250 222L272 241L329 218Z"}),(0,r.h)("path",{key:"3cc8481cf01928f0f39bcc45e6de53e90398ad40",d:"M353 318L35 36L213 300L353 318Z"}),(0,r.h)("path",{key:"c4a97edf0bf361a5bf34f6a468daf984eda0736e",d:"M391 286L565 272L421 252L391 286Z"}),!0===this.state._labeled&&(0,r.h)("text",{key:"cdb74da516faf671d98402d5f83352c07086ae37",x:"250",y:"525",fill:e},"KoliBri")))}validateColor(e){(0,a.v)(this,e,{defaultValue:"#003c78",hooks:{beforePatch:this.handleColorChange}})}validateLabeled(e){(0,l.b)(this,"_labeled",e,{defaultValue:!0})}componentWillLoad(){this.validateColor(this._color),this.validateLabeled(this._labeled)}static get watchers(){return{_color:["validateColor"],_labeled:["validateLabeled"]}}};i.style={default:"/*\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: inline-block;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  text {\n    font-size: 90px;\n    letter-spacing: normal;\n    word-spacing: normal;\n  }\n  svg {\n    max-height: 100%;\n  }\n}"}},8796:(e,n,t)=>{t.d(n,{S:()=>l,a:()=>o,b:()=>r,c:()=>i,h:()=>d,i:()=>a,p:()=>s,s:()=>u});const r=e=>"object"==typeof e&&null!==e,a=(e,n=0)=>"string"==typeof e&&e.length>=n,o=e=>{if("object"!=typeof e||null===e)return a(e,1);for(const n in e)if(!1===a(n,1))return!1;return!0},l=new Event("StateChange"),i=(e,n)=>{r(e)&&e&&(e.focus=e=>null==n?void 0:n.focus(e))};let s="development";try{s="production"}catch(e){s="production"}const d=(e,n,t)=>{if(e&&n&&"string"==typeof t){const r=e.querySelector(`[slot="${t}"]`);r&&n.appendChild(r)}},u=e=>""===e}}]);

package/dist/8002.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8002.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8002],{8746:(n,e,t)=>{t.d(e,{v:()=>a});var i=t(7238);const a=(n,e)=>{(0,i.b)(n,"_disabled",e,{hooks:{afterPatch:n=>{!0===n&&(0,i.c)()}}})}},5237:(n,e,t)=>{function i(n){n.stopImmediatePropagation(),n.stopPropagation()}function a(n,e,t){e&&function(n,e,t){const i=n.dispatchEvent(function(n,e){return new CustomEvent(`kol-${n}`,{bubbles:!0,cancelable:!0,composed:!0,detail:e})}(e,t))}(e,n,t)}function s(n){n.preventDefault(),i(n)}t.d(e,{p:()=>s,s:()=>i,t:()=>a})},8002:(n,e,t)=>{t.r(e),t.d(e,{kol_details:()=>p});var i=t(6509),a=t(5237),s=t(2781),o=t(8746),l=t(5893),d=t(7238),h=t(3654),r=(n,e,t)=>new Promise(((i,a)=>{var s=n=>{try{l(t.next(n))}catch(n){a(n)}},o=n=>{try{l(t.throw(n))}catch(n){a(n)}},l=n=>n.done?i(n.value):Promise.resolve(n.value).then(s,o);l((t=t.apply(n,e)).next())}));class c{constructor(n,e,t){this.detailsElement=n,this.summaryElement=e,this.contentElement=t,this.isClosing=!1,this.isExpanding=!1,this.summaryElement.addEventListener("click",this.handleSummaryClick.bind(this))}handleSummaryClick(n){n.preventDefault(),this.isClosing||!this.detailsElement.open?this.open():(this.isExpanding||this.detailsElement.open)&&this.collapse()}open(){this.detailsElement.open=!0,window.requestAnimationFrame(this.expand.bind(this))}expand(){this.isExpanding=!0,this.animateContentHeight("expand")}collapse(){this.isClosing=!0,this.animateContentHeight("collapse")}animateContentHeight(n){let e="expand"===n?0:this.contentElement.offsetHeight,t="expand"===n?this.contentElement.offsetHeight:0;this.animation&&(e=this.contentElement.offsetHeight,this.animation.cancel(),"expand"===n&&(t=this.contentElement.offsetHeight)),this.animation=this.contentElement.animate({height:[`${e}px`,`${t}px`]},{duration:matchMedia("(prefers-reduced-motion)").matches?0:250,easing:"ease-out"}),this.animation.addEventListener("finish",(()=>{this.onAnimationFinish()}),{once:!0}),this.animation.addEventListener("cancel",(()=>{"expand"===n?this.isExpanding=!1:this.isClosing=!1}),{once:!0})}onAnimationFinish(){this.detailsElement.open=this.isExpanding,this.animation=void 0,this.isClosing=!1,this.isExpanding=!1}}const p=class{constructor(n){(0,i.r)(this,n),this.catchDetails=n=>{this.detailsElement=n},this.catchSummary=n=>{this.summaryElement=n},this.preventToggleIfDisabled=n=>{!0===this.state._disabled&&(0,a.p)(n)},this.handleToggle=n=>{clearTimeout(this.toggleTimeout),this.toggleTimeout=setTimeout((()=>{var e,t,i,s;Boolean(null===(e=this.detailsElement)||void 0===e?void 0:e.open)!==this.state._open&&(this._open=Boolean(null===(t=this.detailsElement)||void 0===t?void 0:t.open),(0,a.t)("toggle",this.host,this._open),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onToggle)&&(null===(s=this.state._on)||void 0===s||s.onToggle(n,this._open)))}),25)},this._disabled=!1,this._label=void 0,this._on=void 0,this._open=!1,this.state={_label:"",_on:{}}}focus(){return r(this,null,(function*(){yield this.kolFocus()}))}kolFocus(){return r(this,null,(function*(){var n;null===(n=this.summaryElement)||void 0===n||n.focus()}))}render(){return(0,i.h)(i.H,{key:"c81f22ea30774221c48f71dba31670c1a227ff05",class:"kol-details"},(0,i.h)("details",{key:"1f638cd9c47d989195b15708096a9c2652a3b97a",ref:this.catchDetails,class:{disabled:!0===this.state._disabled,open:!0===this.state._open},onToggle:this.handleToggle},(0,i.h)("summary",{key:"b78004a89667175bf308f0a239780c15b39d313c",ref:this.catchSummary,"aria-disabled":this.state._disabled?"true":void 0,onClick:this.preventToggleIfDisabled,onKeyPress:this.preventToggleIfDisabled,tabIndex:this.state._disabled?-1:void 0},(0,i.h)(s.g,{key:"69310b844d6f1b5feba60fc77aec6b4b3ba3ed3f",_label:"",_icons:"codicon codicon-chevron-right",class:"icon "+(this.state._open?"is-open":"")}),(0,i.h)("span",{key:"b2cfadced810939b201c79a31051a854a276375a"},this.state._label)),(0,i.h)("div",{key:"3f237b2a06e1f72f11879d3d96c3557efb14810c","aria-hidden":!1===this.state._open?"true":void 0,class:"content",ref:n=>this.contentElement=n},(0,i.h)(s.j,{key:"85386e4ed2bd9566df2c2cbea897fc67985b0d3f"},(0,i.h)("slot",{key:"06ae87dccb0fcc5833d28d56887a7f5eefb82211"})))))}validateDisabled(n){(0,o.v)(this,n)}validateLabel(n){(0,l.v)(this,n,{required:!0})}validateOn(n){"object"==typeof n&&null!==n&&"function"==typeof n.onToggle&&(0,d.s)(this,"_on",n)}validateOpen(n){(0,h.v)(this,n)}componentWillLoad(){this.validateDisabled(this._disabled),this.validateLabel(this._label),this.validateOn(this._on),this.validateOpen(this._open)}componentDidLoad(){if(this.detailsElement&&this.summaryElement&&this.contentElement){const n=new c(this.detailsElement,this.summaryElement,this.contentElement);this.state._open&&n.open()}}get host(){return(0,i.g)(this)}static get watchers(){return{_disabled:["validateDisabled"],_label:["validateLabel"],_on:["validateOn"],_open:["validateOpen"]}}};p.style={default:"/*\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  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  details {\n    display: grid;\n  }\n  details > summary {\n    cursor: pointer;\n    display: flex;\n    place-items: center;\n  }\n  details > summary > span {\n    border-bottom-color: grey;\n    border-bottom-style: solid;\n  }\n  details > summary:focus > span,\n  details > summary:hover > span,\n  details[open] > summary > span {\n    border-bottom-color: #000;\n  }\n  .content {\n    overflow: hidden;\n  }\n  details > .kol-indented-text {\n    margin: 0.25em 0 0 0.5em;\n  }\n  .icon.is-open::part(icon) {\n    transform: rotate(90deg);\n  }\n}"}},5893:(n,e,t)=>{t.d(e,{a:()=>c,b:()=>l,c:()=>d,h:()=>a,v:()=>r});var i=t(7238);const a=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,o=/^\d+$/;function l(n,e=1){return function(n){var e;return"string"==typeof n&&(null===(e=n.match(s))||void 0===e?void 0:e.length)||0}(n)>=e}function d(n){return o.test(n)}const h=new Set(["string"]),r=(n,e,t={})=>{(0,i.w)(n,"_label",(n=>"string"==typeof n),h,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,a,s)=>{var o,h;"function"==typeof(null===(o=n.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(h=n.hooks)||void 0===h||h.afterPatch(e,t,a,s)),"string"==typeof e&&!1===l(e,3)&&!1===d(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=n.hooks)||void 0===e?void 0:e.beforePatch}})}(t))},c=r},3654:(n,e,t)=>{t.d(e,{v:()=>a});var i=t(7238);const a=(n,e,t)=>{(0,i.b)(n,"_open",e,t)}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8002],{8746:(n,e,t)=>{t.d(e,{v:()=>a});var i=t(7238);const a=(n,e)=>{(0,i.b)(n,"_disabled",e,{hooks:{afterPatch:n=>{!0===n&&(0,i.c)()}}})}},5237:(n,e,t)=>{function i(n){n.stopImmediatePropagation(),n.stopPropagation()}function a(n,e,t){e&&function(n,e,t){const i=n.dispatchEvent(function(n,e){return new CustomEvent(`kol-${n}`,{bubbles:!0,cancelable:!0,composed:!0,detail:e})}(e,t))}(e,n,t)}function s(n){n.preventDefault(),i(n)}t.d(e,{p:()=>s,s:()=>i,t:()=>a})},8002:(n,e,t)=>{t.r(e),t.d(e,{kol_details:()=>p});var i=t(9944),a=t(5237),s=t(9494),o=t(8746),l=t(5893),d=t(7238),h=t(3654),r=(n,e,t)=>new Promise(((i,a)=>{var s=n=>{try{l(t.next(n))}catch(n){a(n)}},o=n=>{try{l(t.throw(n))}catch(n){a(n)}},l=n=>n.done?i(n.value):Promise.resolve(n.value).then(s,o);l((t=t.apply(n,e)).next())}));class c{constructor(n,e,t){this.detailsElement=n,this.summaryElement=e,this.contentElement=t,this.isClosing=!1,this.isExpanding=!1,this.summaryElement.addEventListener("click",this.handleSummaryClick.bind(this))}handleSummaryClick(n){n.preventDefault(),this.isClosing||!this.detailsElement.open?this.open():(this.isExpanding||this.detailsElement.open)&&this.collapse()}open(){this.detailsElement.open=!0,window.requestAnimationFrame(this.expand.bind(this))}expand(){this.isExpanding=!0,this.animateContentHeight("expand")}collapse(){this.isClosing=!0,this.animateContentHeight("collapse")}animateContentHeight(n){let e="expand"===n?0:this.contentElement.offsetHeight,t="expand"===n?this.contentElement.offsetHeight:0;this.animation&&(e=this.contentElement.offsetHeight,this.animation.cancel(),"expand"===n&&(t=this.contentElement.offsetHeight)),this.animation=this.contentElement.animate({height:[`${e}px`,`${t}px`]},{duration:matchMedia("(prefers-reduced-motion)").matches?0:250,easing:"ease-out"}),this.animation.addEventListener("finish",(()=>{this.onAnimationFinish()}),{once:!0}),this.animation.addEventListener("cancel",(()=>{"expand"===n?this.isExpanding=!1:this.isClosing=!1}),{once:!0})}onAnimationFinish(){this.detailsElement.open=this.isExpanding,this.animation=void 0,this.isClosing=!1,this.isExpanding=!1}}const p=class{constructor(n){(0,i.r)(this,n),this.catchDetails=n=>{this.detailsElement=n},this.catchSummary=n=>{this.summaryElement=n},this.preventToggleIfDisabled=n=>{!0===this.state._disabled&&(0,a.p)(n)},this.handleToggle=n=>{clearTimeout(this.toggleTimeout),this.toggleTimeout=setTimeout((()=>{var e,t,i,s;Boolean(null===(e=this.detailsElement)||void 0===e?void 0:e.open)!==this.state._open&&(this._open=Boolean(null===(t=this.detailsElement)||void 0===t?void 0:t.open),(0,a.t)("toggle",this.host,this._open),"function"==typeof(null===(i=this.state._on)||void 0===i?void 0:i.onToggle)&&(null===(s=this.state._on)||void 0===s||s.onToggle(n,this._open)))}),25)},this._disabled=!1,this._label=void 0,this._on=void 0,this._open=!1,this.state={_label:"",_on:{}}}focus(){return r(this,null,(function*(){yield this.kolFocus()}))}kolFocus(){return r(this,null,(function*(){var n;null===(n=this.summaryElement)||void 0===n||n.focus()}))}render(){return(0,i.h)(i.H,{key:"c81f22ea30774221c48f71dba31670c1a227ff05",class:"kol-details"},(0,i.h)("details",{key:"1f638cd9c47d989195b15708096a9c2652a3b97a",ref:this.catchDetails,class:{disabled:!0===this.state._disabled,open:!0===this.state._open},onToggle:this.handleToggle},(0,i.h)("summary",{key:"b78004a89667175bf308f0a239780c15b39d313c",ref:this.catchSummary,"aria-disabled":this.state._disabled?"true":void 0,onClick:this.preventToggleIfDisabled,onKeyPress:this.preventToggleIfDisabled,tabIndex:this.state._disabled?-1:void 0},(0,i.h)(s.g,{key:"69310b844d6f1b5feba60fc77aec6b4b3ba3ed3f",_label:"",_icons:"codicon codicon-chevron-right",class:"icon "+(this.state._open?"is-open":"")}),(0,i.h)("span",{key:"b2cfadced810939b201c79a31051a854a276375a"},this.state._label)),(0,i.h)("div",{key:"3f237b2a06e1f72f11879d3d96c3557efb14810c","aria-hidden":!1===this.state._open?"true":void 0,class:"content",ref:n=>this.contentElement=n},(0,i.h)(s.j,{key:"85386e4ed2bd9566df2c2cbea897fc67985b0d3f"},(0,i.h)("slot",{key:"06ae87dccb0fcc5833d28d56887a7f5eefb82211"})))))}validateDisabled(n){(0,o.v)(this,n)}validateLabel(n){(0,l.v)(this,n,{required:!0})}validateOn(n){"object"==typeof n&&null!==n&&"function"==typeof n.onToggle&&(0,d.s)(this,"_on",n)}validateOpen(n){(0,h.v)(this,n)}componentWillLoad(){this.validateDisabled(this._disabled),this.validateLabel(this._label),this.validateOn(this._on),this.validateOpen(this._open)}componentDidLoad(){if(this.detailsElement&&this.summaryElement&&this.contentElement){const n=new c(this.detailsElement,this.summaryElement,this.contentElement);this.state._open&&n.open()}}get host(){return(0,i.g)(this)}static get watchers(){return{_disabled:["validateDisabled"],_label:["validateLabel"],_on:["validateOn"],_open:["validateOpen"]}}};p.style={default:"/*\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  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  details {\n    display: grid;\n  }\n  details > summary {\n    cursor: pointer;\n    display: flex;\n    place-items: center;\n  }\n  details > summary > span {\n    border-bottom-color: grey;\n    border-bottom-style: solid;\n  }\n  details > summary:focus > span,\n  details > summary:hover > span,\n  details[open] > summary > span {\n    border-bottom-color: #000;\n  }\n  .content {\n    overflow: hidden;\n  }\n  details > .kol-indented-text {\n    margin: 0.25em 0 0 0.5em;\n  }\n  .icon.is-open::part(icon) {\n    transform: rotate(90deg);\n  }\n}"}},5893:(n,e,t)=>{t.d(e,{a:()=>c,b:()=>l,c:()=>d,h:()=>a,v:()=>r});var i=t(7238);const a=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,o=/^\d+$/;function l(n,e=1){return function(n){var e;return"string"==typeof n&&(null===(e=n.match(s))||void 0===e?void 0:e.length)||0}(n)>=e}function d(n){return o.test(n)}const h=new Set(["string"]),r=(n,e,t={})=>{(0,i.w)(n,"_label",(n=>"string"==typeof n),h,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,a,s)=>{var o,h;"function"==typeof(null===(o=n.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(h=n.hooks)||void 0===h||h.afterPatch(e,t,a,s)),"string"==typeof e&&!1===l(e,3)&&!1===d(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=n.hooks)||void 0===e?void 0:e.beforePatch}})}(t))},c=r},3654:(n,e,t)=>{t.d(e,{v:()=>a});var i=t(7238);const a=(n,e,t)=>{(0,i.b)(n,"_open",e,t)}}}]);

package/dist/8189.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8189.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8189],{7519:(n,t,e)=>{e.d(t,{t:()=>s});var i=e(9177),o=e(8796);let s=(n,t)=>{var e;return(null!==(e=(0,i.g)())&&void 0!==e?e:(0,i.i)("de")).translate(n,t)};"test"===o.p&&(s=n=>n)},8189:(n,t,e)=>{e.r(t),e.d(t,{kol_split_button:()=>a});var i=e(6509),o=e(7519),s=e(2781);const a=class{constructor(n){(0,i.r)(this,n),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(0,i.h)(i.H,{key:"a527306b3af651544bf317a61dee2398c1390034",class:"kol-split-button"},(0,i.h)(s.c,{key:"8b72ca7871e344472433e3e63cbcc3282ae653b7",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}),(0,i.h)("div",{key:"40a3ce6bc755a453d9823706b89bed3638aa7608",class:"horizontal-line"}),(0,i.h)(s.c,{key:"4ad3cc5acdb289695cc73edc65b285aed4b7aa94",class:"secondary-button",_disabled:this._disabled,_hideLabel:!0,_icons:"codicon codicon-triangle-down",_label:this.state._show?(0,o.t)(`${n}-close`):(0,o.t)(`${n}-open`),_on:this.clickToggleHandler}),(0,i.h)("div",{key:"056b57cd9712ef379f49c894f749c32d43404986",class:"popover",ref:this.catchDropdownElements},(0,i.h)("div",{key:"814797a3e331a3e0352da52e82dfa33b3f27eddf",class:"popover-content"},(0,i.h)("slot",{key:"3ba6188d4b04dac4703cbe3d486d487c983a3324"}))))}};a.style={default:"/*\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}"}},8796:(n,t,e)=>{e.d(t,{S:()=>a,a:()=>s,b:()=>i,c:()=>l,h:()=>r,i:()=>o,p:()=>d,s:()=>h});const i=n=>"object"==typeof n&&null!==n,o=(n,t=0)=>"string"==typeof n&&n.length>=t,s=n=>{if("object"!=typeof n||null===n)return o(n,1);for(const t in n)if(!1===o(t,1))return!1;return!0},a=new Event("StateChange"),l=(n,t)=>{i(n)&&n&&(n.focus=n=>null==t?void 0:t.focus(n))};let d="development";try{d="production"}catch(n){d="production"}const r=(n,t,e)=>{if(n&&t&&"string"==typeof e){const i=n.querySelector(`[slot="${e}"]`);i&&t.appendChild(i)}},h=n=>""===n}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8189],{736:(n,t,e)=>{e.d(t,{t:()=>s});var i=e(5675),o=e(8796);let s=(n,t)=>{var e;return(null!==(e=(0,i.g)())&&void 0!==e?e:(0,i.i)("de")).translate(n,t)};"test"===o.p&&(s=n=>n)},8189:(n,t,e)=>{e.r(t),e.d(t,{kol_split_button:()=>a});var i=e(9944),o=e(736),s=e(9494);const a=class{constructor(n){(0,i.r)(this,n),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(0,i.h)(i.H,{key:"5a64a4a751b51c8852063bc917c1bbf986bca867",class:"kol-split-button"},(0,i.h)(s.c,{key:"ab8baa7f5a5f4de4d0bf79c8d8d5376640cdb516",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}),(0,i.h)("div",{key:"246e21fea2320d7a1c6e53ed54d17515a53ba8c8",class:"horizontal-line"}),(0,i.h)(s.c,{key:"ca5f0ba735ac3638cc7256c7a7cd8fc7ab9d3fc6",class:"secondary-button",_disabled:this._disabled,_hideLabel:!0,_icons:"codicon codicon-triangle-down",_label:this.state._show?(0,o.t)(`${n}-close`):(0,o.t)(`${n}-open`),_on:this.clickToggleHandler}),(0,i.h)("div",{key:"9855493347ef418b84ba215bcb7f32170a09f140",class:"popover",ref:this.catchDropdownElements},(0,i.h)("div",{key:"f476df593c9956b8262510944c57c99f1bead60d",class:"popover-content"},(0,i.h)("slot",{key:"7021bef08ce563c515e416b35f8f84b6a7acd05c"}))))}};a.style={default:"/*\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}"}},8796:(n,t,e)=>{e.d(t,{S:()=>a,a:()=>s,b:()=>i,c:()=>l,h:()=>d,i:()=>o,p:()=>r,s:()=>h});const i=n=>"object"==typeof n&&null!==n,o=(n,t=0)=>"string"==typeof n&&n.length>=t,s=n=>{if("object"!=typeof n||null===n)return o(n,1);for(const t in n)if(!1===o(t,1))return!1;return!0},a=new Event("StateChange"),l=(n,t)=>{i(n)&&n&&(n.focus=n=>null==t?void 0:t.focus(n))};let r="development";try{r="production"}catch(n){r="production"}const d=(n,t,e)=>{if(n&&t&&"string"==typeof e){const i=n.querySelector(`[slot="${e}"]`);i&&t.appendChild(i)}},h=n=>""===n}}]);

package/dist/8264.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8264.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8264],{7519:(t,e,r)=>{r.d(e,{t:()=>s});var i=r(9177),o=r(8796);let s=(t,e)=>{var r;return(null!==(r=(0,i.g)())&&void 0!==r?r:(0,i.i)("de")).translate(t,e)};"test"===o.p&&(s=t=>t)},8264:(t,e,r)=>{r.r(e),r.d(e,{kol_form:()=>a});var i=r(6509),o=r(7519),s=r(2781),n=r(7238);const a=class{constructor(t){(0,i.r)(this,t),this.onSubmit=t=>{var e,r;t.preventDefault(),t.stopPropagation(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onSubmit)&&(null===(r=this.state._on)||void 0===r||r.onSubmit(t))},this.onReset=t=>{var e,r;t.preventDefault(),t.stopPropagation(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onReset)&&(null===(r=this.state._on)||void 0===r||r.onReset(t))},this.handleLinkClick=t=>{var e;const r=null===(e=t.target)||void 0===e?void 0:e.href;if(r){const t=new URL(r),e=document.querySelector(t.hash);e&&"function"==typeof e.focus&&(e.scrollIntoView({behavior:"smooth"}),e.focus())}},this._on=void 0,this._requiredText=!0,this._errorList=void 0,this.state={}}render(){return(0,i.h)(i.H,{key:"005270f9d4c739b5f2b399546d91dc8559bb45db",class:"kol-form"},this._errorList&&this._errorList.length>0&&(0,i.h)(s.k,{key:"7acdf57b3f0954ee26df575334f7521d1898a597",_type:"error"},(0,o.t)("kol-error-list-message"),(0,i.h)("nav",{key:"f16799bcbb7f60baec798674acb9f38c28424ce0","aria-label":(0,o.t)("kol-error-list")},(0,i.h)("ul",{key:"8c86a5fa750031073142d383d1806bcae7a9eec6"},this._errorList.map(((t,e)=>(0,i.h)("li",{key:e},(0,i.h)(s.h,{_href:t.selector,_label:t.message,_on:{onClick:this.handleLinkClick},ref:t=>{0===e&&(this.errorListElement=t)}}))))))),(0,i.h)("form",{key:"a626ea1dc80b465abfc4153b4c2217a462e3faf0",method:"post",onSubmit:this.onSubmit,onReset:this.onReset,autoComplete:"off",noValidate:!0},!0===this.state._requiredText?(0,i.h)("p",null,(0,i.h)(s.j,null,(0,o.t)("kol-form-description"))):"string"==typeof this.state._requiredText&&this.state._requiredText.length>0?(0,i.h)("p",null,(0,i.h)(s.j,null,this.state._requiredText)):null,(0,i.h)("slot",{key:"05b129e368edc5151a8e3b19bc696b749be3db2a"})))}focusErrorList(){return t=this,e=function*(){return setTimeout((()=>{var t;this._errorList&&this._errorList.length>0&&(null===(t=this.errorListElement)||void 0===t||t.focus())}),300),Promise.resolve()},new Promise(((r,i)=>{var o=t=>{try{n(e.next(t))}catch(t){i(t)}},s=t=>{try{n(e.throw(t))}catch(t){i(t)}},n=t=>t.done?r(t.value):Promise.resolve(t.value).then(o,s);n((e=e.apply(t,null)).next())}));var t,e}validateOn(t){"object"==typeof t&&null!==t&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validateRequiredText(t){"boolean"==typeof t?(0,n.b)(this,"_requiredText",t):(0,n.i)(this,"_requiredText",t)}validateErrorList(t){((t,e)=>{(0,n.w)(t,"errorList",(t=>"object"==typeof t),new Set(["Object"]),e)})(this,t)}componentWillLoad(){this.validateOn(this._on),this.validateRequiredText(this._requiredText),this.validateErrorList(this._errorList)}static get watchers(){return{_on:["validateOn"],_requiredText:["validateRequiredText"],_errorList:["validateErrorList"]}}}},8796:(t,e,r)=>{r.d(e,{S:()=>n,a:()=>s,b:()=>i,c:()=>a,h:()=>h,i:()=>o,p:()=>l,s:()=>u});const i=t=>"object"==typeof t&&null!==t,o=(t,e=0)=>"string"==typeof t&&t.length>=e,s=t=>{if("object"!=typeof t||null===t)return o(t,1);for(const e in t)if(!1===o(e,1))return!1;return!0},n=new Event("StateChange"),a=(t,e)=>{i(t)&&t&&(t.focus=t=>null==e?void 0:e.focus(t))};let l="development";try{l="production"}catch(t){l="production"}const h=(t,e,r)=>{if(t&&e&&"string"==typeof r){const i=t.querySelector(`[slot="${r}"]`);i&&e.appendChild(i)}},u=t=>""===t}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8264],{736:(t,e,r)=>{r.d(e,{t:()=>s});var i=r(5675),o=r(8796);let s=(t,e)=>{var r;return(null!==(r=(0,i.g)())&&void 0!==r?r:(0,i.i)("de")).translate(t,e)};"test"===o.p&&(s=t=>t)},8264:(t,e,r)=>{r.r(e),r.d(e,{kol_form:()=>a});var i=r(9944),o=r(736),s=r(9494),n=r(7238);const a=class{constructor(t){(0,i.r)(this,t),this.onSubmit=t=>{var e,r;t.preventDefault(),t.stopPropagation(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onSubmit)&&(null===(r=this.state._on)||void 0===r||r.onSubmit(t))},this.onReset=t=>{var e,r;t.preventDefault(),t.stopPropagation(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onReset)&&(null===(r=this.state._on)||void 0===r||r.onReset(t))},this.handleLinkClick=t=>{var e;const r=null===(e=t.target)||void 0===e?void 0:e.href;if(r){const t=new URL(r),e=document.querySelector(t.hash);e&&"function"==typeof e.focus&&(e.scrollIntoView({behavior:"smooth"}),e.focus())}},this._on=void 0,this._requiredText=!0,this._errorList=void 0,this.state={}}render(){return(0,i.h)(i.H,{key:"005270f9d4c739b5f2b399546d91dc8559bb45db",class:"kol-form"},this._errorList&&this._errorList.length>0&&(0,i.h)(s.k,{key:"7acdf57b3f0954ee26df575334f7521d1898a597",_type:"error"},(0,o.t)("kol-error-list-message"),(0,i.h)("nav",{key:"f16799bcbb7f60baec798674acb9f38c28424ce0","aria-label":(0,o.t)("kol-error-list")},(0,i.h)("ul",{key:"8c86a5fa750031073142d383d1806bcae7a9eec6"},this._errorList.map(((t,e)=>(0,i.h)("li",{key:e},(0,i.h)(s.h,{_href:t.selector,_label:t.message,_on:{onClick:this.handleLinkClick},ref:t=>{0===e&&(this.errorListElement=t)}}))))))),(0,i.h)("form",{key:"a626ea1dc80b465abfc4153b4c2217a462e3faf0",method:"post",onSubmit:this.onSubmit,onReset:this.onReset,autoComplete:"off",noValidate:!0},!0===this.state._requiredText?(0,i.h)("p",null,(0,i.h)(s.j,null,(0,o.t)("kol-form-description"))):"string"==typeof this.state._requiredText&&this.state._requiredText.length>0?(0,i.h)("p",null,(0,i.h)(s.j,null,this.state._requiredText)):null,(0,i.h)("slot",{key:"05b129e368edc5151a8e3b19bc696b749be3db2a"})))}focusErrorList(){return t=this,e=function*(){return setTimeout((()=>{var t;this._errorList&&this._errorList.length>0&&(null===(t=this.errorListElement)||void 0===t||t.focus())}),300),Promise.resolve()},new Promise(((r,i)=>{var o=t=>{try{n(e.next(t))}catch(t){i(t)}},s=t=>{try{n(e.throw(t))}catch(t){i(t)}},n=t=>t.done?r(t.value):Promise.resolve(t.value).then(o,s);n((e=e.apply(t,null)).next())}));var t,e}validateOn(t){"object"==typeof t&&null!==t&&(this.state=Object.assign(Object.assign({},this.state),{_on:t}))}validateRequiredText(t){"boolean"==typeof t?(0,n.b)(this,"_requiredText",t):(0,n.i)(this,"_requiredText",t)}validateErrorList(t){((t,e)=>{(0,n.w)(t,"errorList",(t=>"object"==typeof t),new Set(["Object"]),e)})(this,t)}componentWillLoad(){this.validateOn(this._on),this.validateRequiredText(this._requiredText),this.validateErrorList(this._errorList)}static get watchers(){return{_on:["validateOn"],_requiredText:["validateRequiredText"],_errorList:["validateErrorList"]}}}},8796:(t,e,r)=>{r.d(e,{S:()=>n,a:()=>s,b:()=>i,c:()=>a,h:()=>h,i:()=>o,p:()=>l,s:()=>u});const i=t=>"object"==typeof t&&null!==t,o=(t,e=0)=>"string"==typeof t&&t.length>=e,s=t=>{if("object"!=typeof t||null===t)return o(t,1);for(const e in t)if(!1===o(e,1))return!1;return!0},n=new Event("StateChange"),a=(t,e)=>{i(t)&&t&&(t.focus=t=>null==e?void 0:e.focus(t))};let l="development";try{l="production"}catch(t){l="production"}const h=(t,e,r)=>{if(t&&e&&"string"==typeof r){const i=t.querySelector(`[slot="${r}"]`);i&&e.appendChild(i)}},u=t=>""===t}}]);

package/dist/8384.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8384.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8384],{7990:(e,t,o)=>{o.d(t,{i:()=>s,n:()=>c,r:()=>r});var a=o(6509),n=o(8796),i=o(3713);const l=()=>{let e=(0,i.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,i.d)(),"KoliBri",{value:e,writable:!1})),e},s=()=>{(()=>{const e=(0,i.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const t=e.getAttribute("content");"string"==typeof t&&((0,i.s)(t.includes("dev-mode=true")),(0,i.b)(t.includes("experimental-mode=true")),(0,i.c)(t.includes("color-contrast-analysis=true")))}})(),i.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${a.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==l().adviceShown&&(Object.defineProperty(l(),"adviceShown",{get:function(){return!0}}),i.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===n.p&&(c=()=>"nonce")},5237:(e,t,o)=>{function a(e){e.stopImmediatePropagation(),e.stopPropagation()}function n(e,t,o){t&&function(e,t,o){const a=e.dispatchEvent(function(e,t){return new CustomEvent(`kol-${e}`,{bubbles:!0,cancelable:!0,composed:!0,detail:t})}(t,o))}(t,e,o)}function i(e){e.preventDefault(),a(e)}o.d(t,{p:()=>i,s:()=>a,t:()=>n})},4890:(e,t,o)=>{o.d(t,{E:()=>d,a:()=>r,b:()=>c,c:()=>l,d:()=>i,v:()=>s});var a=o(7238),n=o(8796);const i=(e,t)=>{(0,a.w)(e,"_on",(e=>"object"==typeof e&&null!==e),new Set(["TableCallbacksPropType {Events.onSort, Events.onSelectionChange}"]),t)},l=(e,t)=>{(0,a.w)(e,"_on",(e=>"object"==typeof e&&null!==e),new Set(["TableStatefulCallbacksPropType {Events.onSelectionChange}"]),t)},s=(e,t,o)=>{(0,a.t)(t,(()=>{(0,a.o)(t,(()=>{void 0===t&&(t=[]);try{t=(0,a.p)(t)}catch(e){}Array.isArray(t)&&t.every((e=>"object"==typeof e&&null!==e))&&(0,a.s)(e,"_data",t,o)}))}))},r=(e,t,o)=>{(0,a.t)(t,(()=>{(0,a.o)(t,(()=>{void 0===t&&(t=[]);try{t=(0,a.p)(t)}catch(e){}Array.isArray(t)&&t.every((e=>"object"==typeof e&&null!==e))&&(0,a.s)(e,"_dataFoot",t,o)}))}))},c=(e,t)=>{var o;(o="string"==typeof t?(()=>{try{return(0,a.p)(t)}catch(e){return}})():t)&&(0,n.b)(o)&&"function"==typeof o.label&&(!o.selectedKeys||Array.isArray(o.selectedKeys))&&(0,a.s)(e,"_selection",t)};var d,h;(h=d||(d={})).onBlur="onBlur",h.onChange="onChange",h.onClick="onClick",h.onDblClick="onDblClick",h.onFocus="onFocus",h.onInput="onInput",h.onKeyDown="onKeyDown",h.onKeyPress="onKeyPress",h.onKeyUp="onKeyUp",h.onMouseDown="onMouseDown",h.onMouseMove="onMouseMove",h.onMouseOut="onMouseOut",h.onMouseOver="onMouseOver",h.onMouseUp="onMouseUp",h.onReset="onReset",h.onSelect="onSelect",h.onSort="onSort",h.onSelectionChange="onSelectionChange",h.onSubmit="onSubmit"},7519:(e,t,o)=>{o.d(t,{t:()=>i});var a=o(9177),n=o(8796);let i=(e,t)=>{var o;return(null!==(o=(0,a.g)())&&void 0!==o?o:(0,a.i)("de")).translate(e,t)};"test"===n.p&&(i=e=>e)},8384:(e,t,o)=>{o.r(t),o.d(t,{kol_table_stateless_wc:()=>h});var a=o(6509),n=o(2781),i=o(7519),l=o(5237),s=o(7990),r=o(7238),c=o(4890),d=o(5893);const h=class{constructor(e){(0,a.r)(this,e),this.horizontal=!0,this.cellsToRenderTimeouts=new Map,this.dataToKeyMap=new Map,this.renderTableRow=(e,t)=>{var o,n;let i=String(t);return this.horizontal&&(null===(o=e[0])||void 0===o?void 0:o.data)&&(i=null!==(n=this.getDataKey(e[0].data))&&void 0!==n?n:i),(0,a.h)("tr",{key:`row-${i}`},this.renderSelectionCell(e,t),e.map(((e,o)=>this.renderTableCell(e,t,o))))},this.renderTableCell=(e,t,o)=>{let n=`${t}-${o}-${e.label}`;if(e.data){const a=this.getDataKey(e.data);n=this.horizontal?a?`${a}-${o}`:n:a?`${a}-${t}`:n}return!1===e.asTd?this.renderHeadingCell(e,t,o):(0,a.h)("td",{key:`cell-${n}`,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){(0,c.v)(this,e,{beforePatch:e=>{this.updateDataToKeyMap(e)}})}validateDataFoot(e){(0,c.a)(this,e)}validateHeaderCells(e){((e,t)=>{(0,r.t)(t,(()=>{(0,r.o)(t,(()=>{try{t=(0,r.p)(t)}catch(e){}(0,r.w)(e,"_headerCells",(e=>"object"==typeof e&&null!==e),new Set(["TableHeaderCellsPropType"]),t)}))}))})(this,e)}validateLabel(e){(0,d.v)(this,e,{required:!0})}validateMinWidth(e){(0,r.i)(this,"_minWidth",e,{defaultValue:void 0})}validateOn(e){(0,c.d)(this,e)}validateSelection(e){(0,c.b)(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,(0,s.n)())})),this.dataToKeyMap.forEach(((t,o)=>{e.includes(o)||this.dataToKeyMap.delete(o)}))}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 o=e.render(t,e,e.data,this.state._data);"string"==typeof o&&(t.textContent=o)}}))))}getNumberOfCols(e,t){let o=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var o;return t+=null!==(o=e.colSpan)&&void 0!==o?o:1})),o<t&&(o=t)})),0===o&&(o=t.length),o}getNumberOfRows(e,t){var o;let a=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var o;return t+=null!==(o=e.rowSpan)&&void 0!==o?o:1})),a<t&&(a=t)})),0===a?a=t.length:a-=(null===(o=this.state._dataFoot)||void 0===o?void 0:o.length)||0,a}filterHeaderKeys(e){const t=[];return e.forEach((e=>{e.forEach((e=>{"string"==typeof e.key&&t.push(e)}))})),t}getPrimaryHeader(e){var t,o;let a=this.filterHeaderKeys(null!==(t=e.horizontal)&&void 0!==t?t:[]);return this.horizontal=!0,0===a.length&&(a=this.filterHeaderKeys(null!==(o=e.vertical)&&void 0!==o?o:[]),a.length>0&&(this.horizontal=!1)),a}createDataField(e,t,o){var a;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 n=this.getPrimaryHeader(t),l=this.getNumberOfCols(t.horizontal,e);let s=this.getNumberOfRows(t.vertical,e),r=0;o&&(r=s,s+=(null===(a=this.state._dataFoot)||void 0===a?void 0:a.length)||0);const c=[],d=[],h=[];t.vertical.forEach(((e,t)=>{d[t]=0,h[t]=[]}));for(let a=r;a<s;a++){const i=[];t.vertical.forEach(((e,t)=>{let o=0;if(h[t].forEach((e=>o+=e)),o<=a){const n=e[a-o+d[t]];if("object"==typeof n){i.push(Object.assign(Object.assign({},n),{asTd:!1,data:{}}));let e=1;if("number"==typeof n.rowSpan&&n.rowSpan>1&&(e=n.rowSpan),h[t].push(e),"number"==typeof n.colSpan&&n.colSpan>1)for(let o=1;o<n.colSpan;o++)h[t+o].push(e);d[t]++}}}));for(let t=0;t<l;t++)if(!0===this.horizontal){const l=o&&this.state._dataFoot?this.state._dataFoot[a-r]:e[a];"object"==typeof n[t]&&null!==n[t]&&"string"==typeof n[t].key&&"object"==typeof l&&null!==l&&i.push(Object.assign(Object.assign({},n[t]),{colSpan:void 0,data:l,label:l[n[t].key],rowSpan:void 0}))}else"object"==typeof n[a]&&null!==n[a]&&"string"==typeof n[a].key&&"object"==typeof e[t]&&null!==e[t]&&i.push(Object.assign(Object.assign({},n[a]),{colSpan:void 0,data:e[t],label:e[t][n[a].key],rowSpan:void 0}));c.push(i)}if(0===e.length){let e=0,o=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=>{o+=e.rowSpan||1})));const a={colSpan:e,label:(0,i.t)("kol-no-entries"),render:void 0,rowSpan:Math.max(o,1)};0===c.length?c.push([a]):c[0].push(a)}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,t){var o,i,s;if(this.state._selection){const r=null!==(o=this.state._selection.keyPropertyName)&&void 0!==o?o:"id",d=e.find((e=>e.key===r));if(d){const e=(null==d?void 0:d.data)[r],o=null===(s=null===(i=this.state._selection)||void 0===i?void 0:i.selectedKeys)||void 0===s?void 0:s.includes(e),h=this.state._selection.label(d.data);return(0,a.h)("td",{key:`tbody-${t}-selection`,class:"selection-cell"},(0,a.h)(n.x,{_label:h,_hideLabel:!0,_checked:o,_tooltipAlign:"right",_on:{onInput:(t,o)=>{var a,n;if(null===(a=this.state._selection)||void 0===a?void 0:a.selectedKeys){const a=o?[...this.state._selection.selectedKeys,e]:this.state._selection.selectedKeys.filter((t=>t!==e));(0,l.t)("selection-change",this.host,a),"function"==typeof(null===(n=this.state._on)||void 0===n?void 0:n[c.E.onSelectionChange])&&this.state._on[c.E.onSelectionChange](t,a)}}}}))}}return""}renderHeadingCell(e,t,o){let i,l="codicon codicon-fold";if(e.sortDirection)switch(e.sortDirection){case"ASC":l="codicon codicon-chevron-up",i="ascending";break;case"DESC":l="codicon codicon-chevron-down",i="descending"}return(0,a.h)("th",{key:`${t}-${o}-${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":i,"data-sort":`sort-${e.sortDirection}`},e.sortDirection?(0,a.h)(n.c,{class:"table-sort-button",exportparts:"icon",_icons:{right:l},_label:e.label,_on:{onClick:t=>{var o;"function"==typeof(null===(o=this.state._on)||void 0===o?void 0:o.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(0,a.h)("tfoot",null,e.map(this.renderTableRow))}render(){const e=this.createDataField(this.state._data,this.state._headerCells);return(0,a.h)(a.H,{key:"6ff227efb6562cc4802f7f3cdcc07da9b15f6144",class:"kol-table-stateless-wc"},(0,a.h)("div",{key:"f85881b7a6221b40b72d938398111391b6d1a66e",ref:e=>this.tableDivElement=e,class:"table",tabindex:this.tableDivElementHasScrollbar?"-1":void 0},(0,a.h)("table",{key:"855e72ca4c4770fda2cedd5c894ec81c9207405f",style:{minWidth:this.state._minWidth}},(0,a.h)("div",{key:"a793e72c2157d6a857111b2fe96e0463d43e18ba",class:"focus-element",tabindex:this.tableDivElementHasScrollbar?"0":void 0,"aria-describedby":"caption"}," "),(0,a.h)("caption",{key:"cb84389391bcaa93093d86d7b96e41265befad1c",id:"caption"},this.state._label),Array.isArray(this.state._headerCells.horizontal)&&(0,a.h)("thead",{key:"887ede1cde2c05062e7279143e75cf76c5e30f4a"},this.state._headerCells.horizontal.map(((e,t)=>(0,a.h)("tr",{key:`thead-${t}`},this.state._selection&&(0,a.h)("td",{key:"thead-selection",class:"selection-header-cell"}),e.map(((e,o)=>!0===e.asTd?(0,a.h)("td",{key:`thead-${t}-${o}-${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,t,o))))))),(0,a.h)("tbody",{key:"87c7b41c699b02f2fe8802befd7f5d5013b2d4be"},e.map(this.renderTableRow)),this.renderFoot())))}get host(){return(0,a.g)(this)}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headerCells:["validateHeaderCells"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_on:["validateOn"],_selection:["validateSelection"]}}}},5893:(e,t,o)=>{o.d(t,{a:()=>h,b:()=>s,c:()=>r,h:()=>n,v:()=>d});var a=o(7238);const n=[0,1,2,3,4,5,6],i=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(i))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return l.test(e)}const c=new Set(["string"]),d=(e,t,o={})=>{(0,a.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,o,n,i)=>{var l,c;"function"==typeof(null===(l=e.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,o,n,i)),"string"==typeof t&&!1===s(t,3)&&!1===r(t)&&(0,a.a)(`The heading or label ("${t}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof t&&t.length>80&&(0,a.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(o))},h=d},8796:(e,t,o)=>{o.d(t,{S:()=>l,a:()=>i,b:()=>a,c:()=>s,h:()=>c,i:()=>n,p:()=>r,s:()=>d});const a=e=>"object"==typeof e&&null!==e,n=(e,t=0)=>"string"==typeof e&&e.length>=t,i=e=>{if("object"!=typeof e||null===e)return n(e,1);for(const t in e)if(!1===n(t,1))return!1;return!0},l=new Event("StateChange"),s=(e,t)=>{a(e)&&e&&(e.focus=e=>null==t?void 0:t.focus(e))};let r="development";try{r="production"}catch(e){r="production"}const c=(e,t,o)=>{if(e&&t&&"string"==typeof o){const a=e.querySelector(`[slot="${o}"]`);a&&t.appendChild(a)}},d=e=>""===e}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8384],{3246:(e,t,o)=>{o.d(t,{i:()=>s,n:()=>c,r:()=>r});var a=o(9944),n=o(8796),i=o(3713);const l=()=>{let e=(0,i.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,i.d)(),"KoliBri",{value:e,writable:!1})),e},s=()=>{(()=>{const e=(0,i.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const t=e.getAttribute("content");"string"==typeof t&&((0,i.s)(t.includes("dev-mode=true")),(0,i.b)(t.includes("experimental-mode=true")),(0,i.c)(t.includes("color-contrast-analysis=true")))}})(),i.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${a.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==l().adviceShown&&(Object.defineProperty(l(),"adviceShown",{get:function(){return!0}}),i.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===n.p&&(c=()=>"nonce")},5237:(e,t,o)=>{function a(e){e.stopImmediatePropagation(),e.stopPropagation()}function n(e,t,o){t&&function(e,t,o){const a=e.dispatchEvent(function(e,t){return new CustomEvent(`kol-${e}`,{bubbles:!0,cancelable:!0,composed:!0,detail:t})}(t,o))}(t,e,o)}function i(e){e.preventDefault(),a(e)}o.d(t,{p:()=>i,s:()=>a,t:()=>n})},4890:(e,t,o)=>{o.d(t,{E:()=>d,a:()=>r,b:()=>c,c:()=>l,d:()=>i,v:()=>s});var a=o(7238),n=o(8796);const i=(e,t)=>{(0,a.w)(e,"_on",(e=>"object"==typeof e&&null!==e),new Set(["TableCallbacksPropType {Events.onSort, Events.onSelectionChange}"]),t)},l=(e,t)=>{(0,a.w)(e,"_on",(e=>"object"==typeof e&&null!==e),new Set(["TableStatefulCallbacksPropType {Events.onSelectionChange}"]),t)},s=(e,t,o)=>{(0,a.t)(t,(()=>{(0,a.o)(t,(()=>{void 0===t&&(t=[]);try{t=(0,a.p)(t)}catch(e){}Array.isArray(t)&&t.every((e=>"object"==typeof e&&null!==e))&&(0,a.s)(e,"_data",t,o)}))}))},r=(e,t,o)=>{(0,a.t)(t,(()=>{(0,a.o)(t,(()=>{void 0===t&&(t=[]);try{t=(0,a.p)(t)}catch(e){}Array.isArray(t)&&t.every((e=>"object"==typeof e&&null!==e))&&(0,a.s)(e,"_dataFoot",t,o)}))}))},c=(e,t)=>{var o;(o="string"==typeof t?(()=>{try{return(0,a.p)(t)}catch(e){return}})():t)&&(0,n.b)(o)&&"function"==typeof o.label&&(!o.selectedKeys||Array.isArray(o.selectedKeys))&&(0,a.s)(e,"_selection",t)};var d,h;(h=d||(d={})).onBlur="onBlur",h.onChange="onChange",h.onClick="onClick",h.onDblClick="onDblClick",h.onFocus="onFocus",h.onInput="onInput",h.onKeyDown="onKeyDown",h.onKeyPress="onKeyPress",h.onKeyUp="onKeyUp",h.onMouseDown="onMouseDown",h.onMouseMove="onMouseMove",h.onMouseOut="onMouseOut",h.onMouseOver="onMouseOver",h.onMouseUp="onMouseUp",h.onReset="onReset",h.onSelect="onSelect",h.onSort="onSort",h.onSelectionChange="onSelectionChange",h.onSubmit="onSubmit"},736:(e,t,o)=>{o.d(t,{t:()=>i});var a=o(5675),n=o(8796);let i=(e,t)=>{var o;return(null!==(o=(0,a.g)())&&void 0!==o?o:(0,a.i)("de")).translate(e,t)};"test"===n.p&&(i=e=>e)},8384:(e,t,o)=>{o.r(t),o.d(t,{kol_table_stateless_wc:()=>h});var a=o(9944),n=o(9494),i=o(736),l=o(5237),s=o(3246),r=o(7238),c=o(4890),d=o(5893);const h=class{constructor(e){(0,a.r)(this,e),this.horizontal=!0,this.cellsToRenderTimeouts=new Map,this.dataToKeyMap=new Map,this.renderTableRow=(e,t)=>{var o,n;let i=String(t);return this.horizontal&&(null===(o=e[0])||void 0===o?void 0:o.data)&&(i=null!==(n=this.getDataKey(e[0].data))&&void 0!==n?n:i),(0,a.h)("tr",{key:`row-${i}`},this.renderSelectionCell(e,t),e.map(((e,o)=>this.renderTableCell(e,t,o))))},this.renderTableCell=(e,t,o)=>{let n=`${t}-${o}-${e.label}`;if(e.data){const a=this.getDataKey(e.data);n=a?`${a}-${this.horizontal?o:t}`:n}return!1===e.asTd?this.renderHeadingCell(e,t,o):(0,a.h)("td",{key:`cell-${n}`,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){(0,c.v)(this,e,{beforePatch:e=>{this.updateDataToKeyMap(e)}})}validateDataFoot(e){(0,c.a)(this,e)}validateHeaderCells(e){((e,t)=>{(0,r.t)(t,(()=>{(0,r.o)(t,(()=>{try{t=(0,r.p)(t)}catch(e){}(0,r.w)(e,"_headerCells",(e=>"object"==typeof e&&null!==e),new Set(["TableHeaderCellsPropType"]),t)}))}))})(this,e)}validateLabel(e){(0,d.v)(this,e,{required:!0})}validateMinWidth(e){(0,r.i)(this,"_minWidth",e,{defaultValue:void 0})}validateOn(e){(0,c.d)(this,e)}validateSelection(e){(0,c.b)(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,(0,s.n)())})),this.dataToKeyMap.forEach(((t,o)=>{e.includes(o)||this.dataToKeyMap.delete(o)}))}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 o=e.render(t,e,e.data,this.state._data);"string"==typeof o&&(t.textContent=o)}}))))}getNumberOfCols(e,t){let o=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var o;return t+=null!==(o=e.colSpan)&&void 0!==o?o:1})),o<t&&(o=t)})),0===o&&(o=t.length),o}getNumberOfRows(e,t){var o;let a=0;return e.forEach((e=>{let t=0;e.forEach((e=>{var o;return t+=null!==(o=e.rowSpan)&&void 0!==o?o:1})),a<t&&(a=t)})),0===a?a=t.length:a-=(null===(o=this.state._dataFoot)||void 0===o?void 0:o.length)||0,a}filterHeaderKeys(e){const t=[];return e.forEach((e=>{e.forEach((e=>{"string"==typeof e.key&&t.push(e)}))})),t}getPrimaryHeader(e){var t,o;let a=this.filterHeaderKeys(null!==(t=e.horizontal)&&void 0!==t?t:[]);return this.horizontal=!0,0===a.length&&(a=this.filterHeaderKeys(null!==(o=e.vertical)&&void 0!==o?o:[]),a.length>0&&(this.horizontal=!1)),a}createDataField(e,t,o){var a;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 n=this.getPrimaryHeader(t),l=this.getNumberOfCols(t.horizontal,e);let s=this.getNumberOfRows(t.vertical,e),r=0;o&&(r=s,s+=(null===(a=this.state._dataFoot)||void 0===a?void 0:a.length)||0);const c=[],d=[],h=[];t.vertical.forEach(((e,t)=>{d[t]=0,h[t]=[]}));for(let a=r;a<s;a++){const i=[];t.vertical.forEach(((e,t)=>{let o=0;if(h[t].forEach((e=>o+=e)),o<=a){const n=e[a-o+d[t]];if("object"==typeof n){i.push(Object.assign(Object.assign({},n),{asTd:!1,data:{}}));let e=1;if("number"==typeof n.rowSpan&&n.rowSpan>1&&(e=n.rowSpan),h[t].push(e),"number"==typeof n.colSpan&&n.colSpan>1)for(let o=1;o<n.colSpan;o++)h[t+o].push(e);d[t]++}}}));for(let t=0;t<l;t++)if(!0===this.horizontal){const l=o&&this.state._dataFoot?this.state._dataFoot[a-r]:e[a];"object"==typeof n[t]&&null!==n[t]&&"string"==typeof n[t].key&&"object"==typeof l&&null!==l&&i.push(Object.assign(Object.assign({},n[t]),{colSpan:void 0,data:l,label:l[n[t].key],rowSpan:void 0}))}else"object"==typeof n[a]&&null!==n[a]&&"string"==typeof n[a].key&&"object"==typeof e[t]&&null!==e[t]&&i.push(Object.assign(Object.assign({},n[a]),{colSpan:void 0,data:e[t],label:e[t][n[a].key],rowSpan:void 0}));c.push(i)}if(0===e.length){let e=0,o=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=>{o+=e.rowSpan||1})));const a={colSpan:e,label:(0,i.t)("kol-no-entries"),render:void 0,rowSpan:Math.max(o,1)};0===c.length?c.push([a]):c[0].push(a)}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,t){var o,i,s;if(!this.state._selection)return"";const r=null!==(o=this.state._selection.keyPropertyName)&&void 0!==o?o:"id",d=e.find((e=>e.key===r));if(!d)return"";const h=(null==d?void 0:d.data)[r],u=null===(s=null===(i=this.state._selection)||void 0===i?void 0:i.selectedKeys)||void 0===s?void 0:s.includes(h),v=this.state._selection.label(d.data);return(0,a.h)("td",{key:`tbody-${t}-selection`,class:"selection-cell"},(0,a.h)(n.x,{_label:v,_hideLabel:!0,_checked:u,_tooltipAlign:"right",_on:{onInput:(e,t)=>{var o,a,n,i,s;const r=t?[...null!==(a=null===(o=this.state._selection)||void 0===o?void 0:o.selectedKeys)&&void 0!==a?a:[],h]:null===(i=null===(n=this.state._selection)||void 0===n?void 0:n.selectedKeys)||void 0===i?void 0:i.filter((e=>e!==h));(0,l.t)("selection-change",this.host,r),"function"==typeof(null===(s=this.state._on)||void 0===s?void 0:s[c.E.onSelectionChange])&&this.state._on[c.E.onSelectionChange](e,null!=r?r:[])}}}))}renderHeadingSelectionCell(){var e;if(!this.state._selection)return"";const t=null===(e=this.state._selection.selectedKeys)||void 0===e?void 0:e.length,o=t===this.state._data.length,s=0!==t&&!o;let r="kol-table-selection-intermediate";return o&&!s&&(r="kol-table-selection-none"),0===t&&(r="kol-table-selection-all"),(0,a.h)("th",{key:"thead-0-selection",class:"selection-cell selection-control"},(0,a.h)(n.x,{_label:(0,i.t)(r),_hideLabel:!0,_checked:o&&!s,_indeterminate:s,_tooltipAlign:"right",_on:{onInput:(e,t)=>{var a;let n=[];!t&&o||(n=this.state._data),(0,l.t)("selection-change",this.host,n),"function"==typeof(null===(a=this.state._on)||void 0===a?void 0:a[c.E.onSelectionChange])&&this.state._on[c.E.onSelectionChange](e,n.map((e=>null==e?void 0:e.id)))}}}))}renderHeadingCell(e,t,o){let i,l="codicon codicon-fold";if(e.sortDirection)switch(e.sortDirection){case"ASC":l="codicon codicon-chevron-up",i="ascending";break;case"DESC":l="codicon codicon-chevron-down",i="descending"}return(0,a.h)("th",{key:`${t}-${o}-${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":i,"data-sort":`sort-${e.sortDirection}`},e.sortDirection?(0,a.h)(n.c,{class:"table-sort-button",exportparts:"icon",_icons:{right:l},_label:e.label,_on:{onClick:t=>{var o;"function"==typeof(null===(o=this.state._on)||void 0===o?void 0:o.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(0,a.h)("tfoot",null,e.map(this.renderTableRow))}render(){const e=this.createDataField(this.state._data,this.state._headerCells);return(0,a.h)(a.H,{key:"66506c625a129e21c0f90d7db4859e25ebf929ad",class:"kol-table-stateless-wc"},(0,a.h)("div",{key:"1ef318d8570a5a6179dbdfa0d2f9e93552c4357a",ref:e=>this.tableDivElement=e,class:"table",tabindex:this.tableDivElementHasScrollbar?"-1":void 0},(0,a.h)("table",{key:"ebb6d3e06ab196020138f44dfffab92ac706cad5",style:{minWidth:this.state._minWidth}},(0,a.h)("div",{key:"ec760f18bd7f6da915c54524413409c0ac84a154",class:"focus-element",tabindex:this.tableDivElementHasScrollbar?"0":void 0,"aria-describedby":"caption"}," "),(0,a.h)("caption",{key:"03dbef2ff5c0ee9d09e3e837508966b1a769591e",id:"caption"},this.state._label),Array.isArray(this.state._headerCells.horizontal)&&(0,a.h)("thead",{key:"9b3b2097e4cff4c993bafe6e76356e26976d4924"},this.state._headerCells.horizontal.map(((e,t)=>(0,a.h)("tr",{key:`thead-${t}`},this.state._selection&&this.renderHeadingSelectionCell(),e.map(((e,o)=>!0===e.asTd?(0,a.h)("td",{key:`thead-${t}-${o}-${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,t,o))))))),(0,a.h)("tbody",{key:"f0e6616484ae198a065ebeeab1d5fd41e7bd5093"},e.map(this.renderTableRow)),this.renderFoot())))}get host(){return(0,a.g)(this)}static get watchers(){return{_data:["validateData"],_dataFoot:["validateDataFoot"],_headerCells:["validateHeaderCells"],_label:["validateLabel"],_minWidth:["validateMinWidth"],_on:["validateOn"],_selection:["validateSelection"]}}}},5893:(e,t,o)=>{o.d(t,{a:()=>h,b:()=>s,c:()=>r,h:()=>n,v:()=>d});var a=o(7238);const n=[0,1,2,3,4,5,6],i=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(i))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return l.test(e)}const c=new Set(["string"]),d=(e,t,o={})=>{(0,a.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,o,n,i)=>{var l,c;"function"==typeof(null===(l=e.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,o,n,i)),"string"==typeof t&&!1===s(t,3)&&!1===r(t)&&(0,a.a)(`The heading or label ("${t}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof t&&t.length>80&&(0,a.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(o))},h=d},8796:(e,t,o)=>{o.d(t,{S:()=>l,a:()=>i,b:()=>a,c:()=>s,h:()=>c,i:()=>n,p:()=>r,s:()=>d});const a=e=>"object"==typeof e&&null!==e,n=(e,t=0)=>"string"==typeof e&&e.length>=t,i=e=>{if("object"!=typeof e||null===e)return n(e,1);for(const t in e)if(!1===n(t,1))return!1;return!0},l=new Event("StateChange"),s=(e,t)=>{a(e)&&e&&(e.focus=e=>null==t?void 0:t.focus(e))};let r="development";try{r="production"}catch(e){r="production"}const c=(e,t,o)=>{if(e&&t&&"string"==typeof o){const a=e.querySelector(`[slot="${o}"]`);a&&t.appendChild(a)}},d=e=>""===e}}]);

package/dist/8389.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8389.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8389],{1730:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e)=>{(0,i.i)(t,"_accessKey",e)}},7216:(t,e,a)=>{a.d(e,{a:()=>o,v:()=>s});var i=a(7238);const s=(t,e,a)=>{(0,i.w)(t,e,(t=>"string"==typeof t&&l.includes(t)),new Set(l),a,{defaultValue:"top"})},l=["left","right","top","bottom"],o=(t,e)=>{s(t,"_align",e)}},1201:(t,e,a)=>{a.d(e,{a:()=>s,v:()=>l});var i=a(7238);const s=(t,e)=>{(0,i.i)(t,"_role",e)},l=(t,e)=>{(0,i.b)(t,"_ariaExpanded",e)}},8746:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e)=>{(0,i.b)(t,"_disabled",e,{hooks:{afterPatch:t=>{!0===t&&(0,i.c)()}}})}},5237:(t,e,a)=>{function i(t){t.stopImmediatePropagation(),t.stopPropagation()}function s(t,e,a){e&&function(t,e,a){const i=t.dispatchEvent(function(t,e){return new CustomEvent(`kol-${t}`,{bubbles:!0,cancelable:!0,composed:!0,detail:e})}(e,a))}(e,t,a)}function l(t){t.preventDefault(),i(t)}a.d(e,{p:()=>l,s:()=>i,t:()=>s})},4174:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e,a={})=>{(0,i.b)(t,"_hideLabel",e,a)}},1845:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e,a={})=>{(0,i.i)(t,"_href",e,a)}},7519:(t,e,a)=>{a.d(e,{t:()=>l});var i=a(9177),s=a(8796);let l=(t,e)=>{var a;return(null!==(a=(0,i.g)())&&void 0!==a?a:(0,i.i)("de")).translate(t,e)};"test"===s.p&&(l=t=>t)},4451:(t,e,a)=>{a.d(e,{i:()=>o,v:()=>n});var i=a(7238),s=a(8796);const l=(t,e,a)=>{(0,s.b)(a)?t[e]=a:(0,s.i)(a,1)&&(t[e]={icon:a})},o=t=>"object"==typeof t&&null!==t&&(void 0===t.style||(0,s.a)(t.style))&&(void 0===t.label||(0,s.i)(t.label))&&(0,s.i)(t.icon,1),n=(t,e,a={})=>{(0,i.o)(e,(()=>{var n;try{e=(0,i.p)(e)}catch(t){}(0,i.w)(t,"_icons",(t=>{const e="object"==typeof t&&null!==t&&0===Object.keys(t).length;return null===t||e||(0,s.i)(t,1)||"object"==typeof t&&null!==t&&((0,s.i)(t.left,1)||o(t.left)||(0,s.i)(t.right,1)||o(t.right)||(0,s.i)(t.top,1)||o(t.top)||(0,s.i)(t.bottom,1)||o(t.bottom))}),new Set(["KoliBriIcon"]),e,Object.assign(Object.assign({},a),{defaultValue:{},hooks:{afterPatch:null===(n=a.hooks)||void 0===n?void 0:n.afterPatch,beforePatch:(t,e,i,o)=>{var n,r;"function"==typeof(null===(n=a.hooks)||void 0===n?void 0:n.beforePatch)&&(null===(r=a.hooks)||void 0===r||r.beforePatch(t,e,i,o)),(t=>{var e,a,i;if(null===(e=t.nextState)||void 0===e?void 0:e.has("_icons")){const e=null===(a=t.nextState)||void 0===a?void 0:a.get("_icons");null===(i=t.nextState)||void 0===i||i.set("_icons",(t=>{let e={};return(0,s.i)(t,1)?e={left:{icon:t}}:"object"==typeof t&&null!==t&&(l(e,"top",t.top),l(e,"right",t.right),l(e,"bottom",t.bottom),l(e,"left",t.left)),e})(e))}})(i)}}}))}))}},8389:(t,e,a)=>{a.r(e),a.d(e,{kol_link_wc:()=>k});var i=a(6509),s=a(67),l=a(5237),o=a(2781),n=a(7519),r=a(7238),d=a(1845),h=a(8796),c=a(1730),v=a(1201),_=a(8746),b=a(4174),u=a(4451),f=a(5893),p=a(3008),g=a(4539);const y=["date","location","page","step","time","true","false"],k=class{constructor(t){(0,i.r)(this,t),this.catchRef=t=>{this.anchorRef=t},this.onClick=t=>{var e,a;!0===this.state._disabled?(0,l.p)(t):"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onClick)&&(t.preventDefault(),t.stopPropagation(),(0,r.q)(t,this.anchorRef),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._href))},this.getRenderValues=()=>{const t="string"==typeof this.state._target&&"_self"!==this.state._target,e={href:"string"==typeof this.state._href&&this.state._href.length>0?this.state._href:"javascript:void(0);",target:"string"==typeof this.state._target&&this.state._target.length>0?this.state._target:void 0,rel:t?"noopener":void 0,download:"string"==typeof this.state._download?this.state._download:void 0};return!0!==this.state._hideLabel||this.state._label||(0,r.j)("[KolLink] An aria-label must be set when _hide-label is set."),{isExternal:t,tagAttrs:e}},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._ariaExpanded=void 0,this._ariaOwns=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right",this.state={_ariaCurrentValue:"page",_href:"",_icons:{}}}kolFocus(){return t=this,e=function*(){var t;null===(t=this.anchorRef)||void 0===t||t.focus()},new Promise(((a,i)=>{var s=t=>{try{o(e.next(t))}catch(t){i(t)}},l=t=>{try{o(e.throw(t))}catch(t){i(t)}},o=t=>t.done?a(t.value):Promise.resolve(t.value).then(s,l);o((e=e.apply(t,null)).next())}));var t,e}render(){const{isExternal:t,tagAttrs:e}=this.getRenderValues(),a=(0,h.s)(this.state._label);return(0,i.h)(i.H,{key:"bceb6e1bb9b3314ea1ed597aa5254f5dff33f350",class:"kol-link-wc"},(0,i.h)("a",Object.assign({key:"234f8304ea72e23c337c5f8049c71f6e3d1dd0e0",ref:this.catchRef},e,{accessKey:this.state._accessKey,"aria-current":this.state._ariaCurrent,"aria-disabled":this.state._disabled?"true":void 0,"aria-expanded":this.state._ariaExpanded?"true":void 0,"aria-owns":this.state._ariaOwns,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?`${this.state._label}${t?` (${(0,n.t)("kol-open-link-in-tab")})`:""}`:void 0,class:{disabled:!0===this.state._disabled,"external-link":t,"hide-label":!0===this.state._hideLabel}},this.state._on,{onClick:this.onClick,onKeyPress:this.onClick,role:this.state._role,tabIndex:this.state._disabled?-1:this.state._tabIndex}),(0,i.h)(o.f,{key:"199d2afb7615f7654674ea33284de0e376da713c",_accessKey:this.state._accessKey,_icons:this.state._icons,_hideLabel:this.state._hideLabel,_label:a?"":this.state._label||this.state._href},(0,i.h)("slot",{key:"341e514c5974572683e1c29852e33e686efc85e4",name:"expert",slot:"expert"})),t&&(0,i.h)(o.g,{key:"abf9e01ab96cc7b418430cbc39746659c50bf60f",class:"external-link-icon",_label:this.state._hideLabel?"":(0,n.t)("kol-open-link-in-tab"),_icons:"codicon codicon-link-external","aria-hidden":this.state._hideLabel})),(0,i.h)(o.a,{key:"d9501a785b3f27bafd87e8b0dc622588fd17d251","aria-hidden":"true",hidden:a||!this.state._hideLabel,_accessKey:this.state._accessKey,_align:this.state._tooltipAlign,_label:this.state._label||this.state._href}))}validateAccessKey(t){(0,c.v)(this,t)}validateAriaCurrentValue(t){((t,e)=>{(0,r.w)(t,"_ariaCurrentValue",(t=>"string"==typeof t&&y.includes(t)),new Set([`AriaCurrentValue {${y.join(", ")}`]),e,{defaultValue:"page"})})(this,t)}validateAriaExpanded(t){(0,v.v)(this,t)}validateAriaOwns(t){((t,e)=>{(0,r.i)(t,"_ariaOwns",e,{defaultValue:void 0})})(this,t)}validateDisabled(t){(0,_.v)(this,t)}validateDownload(t){((t,e)=>{(0,r.i)(t,"_download",e)})(this,t)}validateHideLabel(t){(0,b.v)(this,t)}validateHref(t){(0,d.v)(this,t,{required:!0})}validateIcons(t){(0,u.v)(this,t)}validateLabel(t){(0,f.a)(this,t)}validateOn(t){((t,e)=>{"object"==typeof e&&"function"==typeof(null==e?void 0:e.onClick)&&(t.state=Object.assign(Object.assign({},t.state),{_on:e}))})(this,t)}validateRole(t){(0,v.a)(this,t)}validateTabIndex(t){(0,p.v)(this,t)}validateTarget(t){((t,e)=>{(0,r.i)(t,"_target",e)})(this,t)}validateTooltipAlign(t){(0,g.v)(this,t)}componentWillLoad(){this.validateAccessKey(this._accessKey),this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaOwns(this._ariaOwns),this.validateDisabled(this._disabled),this.validateDownload(this._download),this.validateHideLabel(this._hideLabel),this.validateHref(this._href),this.validateIcons(this._icons),this.validateLabel(this._label),this.validateOn(this._on),this.validateRole(this._role),this.validateTabIndex(this._tabIndex),this.validateTarget(this._target),this.validateTooltipAlign(this._tooltipAlign),this.unsubscribeOnLocationChange=(0,s.o)((t=>{this.state._ariaCurrent=t===this.state._href?this.state._ariaCurrentValue:void 0}))}disconnectedCallback(){this.unsubscribeOnLocationChange&&this.unsubscribeOnLocationChange()}static get watchers(){return{_accessKey:["validateAccessKey"],_ariaCurrentValue:["validateAriaCurrentValue"],_ariaExpanded:["validateAriaExpanded"],_ariaOwns:["validateAriaOwns"],_disabled:["validateDisabled"],_download:["validateDownload"],_hideLabel:["validateHideLabel"],_href:["validateHref"],_icons:["validateIcons"],_label:["validateLabel"],_on:["validateOn"],_role:["validateRole"],_tabIndex:["validateTabIndex"],_target:["validateTarget"],_tooltipAlign:["validateTooltipAlign"]}}}},5893:(t,e,a)=>{a.d(e,{a:()=>c,b:()=>n,c:()=>r,h:()=>s,v:()=>h});var i=a(7238);const s=[0,1,2,3,4,5,6],l=/[a-zA-Z0-9äöüÄÖÜß]/g,o=/^\d+$/;function n(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(l))||void 0===e?void 0:e.length)||0}(t)>=e}function r(t){return o.test(t)}const d=new Set(["string"]),h=(t,e,a={})=>{(0,i.w)(t,"_label",(t=>"string"==typeof t),d,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,a,s,l)=>{var o,d;"function"==typeof(null===(o=t.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(d=t.hooks)||void 0===d||d.afterPatch(e,a,s,l)),"string"==typeof e&&!1===n(e,3)&&!1===r(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(a))},c=h},8796:(t,e,a)=>{a.d(e,{S:()=>o,a:()=>l,b:()=>i,c:()=>n,h:()=>d,i:()=>s,p:()=>r,s:()=>h});const i=t=>"object"==typeof t&&null!==t,s=(t,e=0)=>"string"==typeof t&&t.length>=e,l=t=>{if("object"!=typeof t||null===t)return s(t,1);for(const e in t)if(!1===s(e,1))return!1;return!0},o=new Event("StateChange"),n=(t,e)=>{i(t)&&t&&(t.focus=t=>null==e?void 0:e.focus(t))};let r="development";try{r="production"}catch(t){r="production"}const d=(t,e,a)=>{if(t&&e&&"string"==typeof a){const i=t.querySelector(`[slot="${a}"]`);i&&e.appendChild(i)}},h=t=>""===t},3008:(t,e,a)=>{a.d(e,{v:()=>l});var i=a(7238);const s={hooks:{afterPatch:t=>{-1!==t&&0!==t&&(0,i.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},l=(t,e)=>{(0,i.k)(t,"_tabIndex",e,s)}},4539:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7216);const s=(t,e)=>{(0,i.v)(t,"_tooltipAlign",e)}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8389],{1730:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e)=>{(0,i.i)(t,"_accessKey",e)}},7216:(t,e,a)=>{a.d(e,{a:()=>o,v:()=>s});var i=a(7238);const s=(t,e,a)=>{(0,i.w)(t,e,(t=>"string"==typeof t&&l.includes(t)),new Set(l),a,{defaultValue:"top"})},l=["left","right","top","bottom"],o=(t,e)=>{s(t,"_align",e)}},1201:(t,e,a)=>{a.d(e,{a:()=>s,v:()=>l});var i=a(7238);const s=(t,e)=>{(0,i.i)(t,"_role",e)},l=(t,e)=>{(0,i.b)(t,"_ariaExpanded",e)}},8746:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e)=>{(0,i.b)(t,"_disabled",e,{hooks:{afterPatch:t=>{!0===t&&(0,i.c)()}}})}},5237:(t,e,a)=>{function i(t){t.stopImmediatePropagation(),t.stopPropagation()}function s(t,e,a){e&&function(t,e,a){const i=t.dispatchEvent(function(t,e){return new CustomEvent(`kol-${t}`,{bubbles:!0,cancelable:!0,composed:!0,detail:e})}(e,a))}(e,t,a)}function l(t){t.preventDefault(),i(t)}a.d(e,{p:()=>l,s:()=>i,t:()=>s})},4174:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e,a={})=>{(0,i.b)(t,"_hideLabel",e,a)}},1845:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7238);const s=(t,e,a={})=>{(0,i.i)(t,"_href",e,a)}},736:(t,e,a)=>{a.d(e,{t:()=>l});var i=a(5675),s=a(8796);let l=(t,e)=>{var a;return(null!==(a=(0,i.g)())&&void 0!==a?a:(0,i.i)("de")).translate(t,e)};"test"===s.p&&(l=t=>t)},4451:(t,e,a)=>{a.d(e,{i:()=>o,v:()=>n});var i=a(7238),s=a(8796);const l=(t,e,a)=>{(0,s.b)(a)?t[e]=a:(0,s.i)(a,1)&&(t[e]={icon:a})},o=t=>"object"==typeof t&&null!==t&&(void 0===t.style||(0,s.a)(t.style))&&(void 0===t.label||(0,s.i)(t.label))&&(0,s.i)(t.icon,1),n=(t,e,a={})=>{(0,i.o)(e,(()=>{var n;try{e=(0,i.p)(e)}catch(t){}(0,i.w)(t,"_icons",(t=>{const e="object"==typeof t&&null!==t&&0===Object.keys(t).length;return null===t||e||(0,s.i)(t,1)||"object"==typeof t&&null!==t&&((0,s.i)(t.left,1)||o(t.left)||(0,s.i)(t.right,1)||o(t.right)||(0,s.i)(t.top,1)||o(t.top)||(0,s.i)(t.bottom,1)||o(t.bottom))}),new Set(["KoliBriIcon"]),e,Object.assign(Object.assign({},a),{defaultValue:{},hooks:{afterPatch:null===(n=a.hooks)||void 0===n?void 0:n.afterPatch,beforePatch:(t,e,i,o)=>{var n,r;"function"==typeof(null===(n=a.hooks)||void 0===n?void 0:n.beforePatch)&&(null===(r=a.hooks)||void 0===r||r.beforePatch(t,e,i,o)),(t=>{var e,a,i;if(null===(e=t.nextState)||void 0===e?void 0:e.has("_icons")){const e=null===(a=t.nextState)||void 0===a?void 0:a.get("_icons");null===(i=t.nextState)||void 0===i||i.set("_icons",(t=>{let e={};return(0,s.i)(t,1)?e={left:{icon:t}}:"object"==typeof t&&null!==t&&(l(e,"top",t.top),l(e,"right",t.right),l(e,"bottom",t.bottom),l(e,"left",t.left)),e})(e))}})(i)}}}))}))}},8389:(t,e,a)=>{a.r(e),a.d(e,{kol_link_wc:()=>k});var i=a(9944),s=a(67),l=a(5237),o=a(9494),n=a(736),r=a(7238),d=a(1845),h=a(8796),c=a(1730),v=a(1201),_=a(8746),b=a(4174),u=a(4451),f=a(5893),p=a(3008),g=a(4539);const y=["date","location","page","step","time","true","false"],k=class{constructor(t){(0,i.r)(this,t),this.catchRef=t=>{this.anchorRef=t},this.onClick=t=>{var e,a;!0===this.state._disabled?(0,l.p)(t):"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onClick)&&(t.preventDefault(),t.stopPropagation(),(0,r.q)(t,this.anchorRef),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._href))},this.getRenderValues=()=>{const t="string"==typeof this.state._target&&"_self"!==this.state._target,e={href:"string"==typeof this.state._href&&this.state._href.length>0?this.state._href:"javascript:void(0);",target:"string"==typeof this.state._target&&this.state._target.length>0?this.state._target:void 0,rel:t?"noopener":void 0,download:"string"==typeof this.state._download?this.state._download:void 0};return!0!==this.state._hideLabel||this.state._label||(0,r.j)("[KolLink] An aria-label must be set when _hide-label is set."),{isExternal:t,tagAttrs:e}},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._ariaExpanded=void 0,this._ariaOwns=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right",this.state={_ariaCurrentValue:"page",_href:"",_icons:{}}}kolFocus(){return t=this,e=function*(){var t;null===(t=this.anchorRef)||void 0===t||t.focus()},new Promise(((a,i)=>{var s=t=>{try{o(e.next(t))}catch(t){i(t)}},l=t=>{try{o(e.throw(t))}catch(t){i(t)}},o=t=>t.done?a(t.value):Promise.resolve(t.value).then(s,l);o((e=e.apply(t,null)).next())}));var t,e}render(){const{isExternal:t,tagAttrs:e}=this.getRenderValues(),a=(0,h.s)(this.state._label);return(0,i.h)(i.H,{key:"bceb6e1bb9b3314ea1ed597aa5254f5dff33f350",class:"kol-link-wc"},(0,i.h)("a",Object.assign({key:"234f8304ea72e23c337c5f8049c71f6e3d1dd0e0",ref:this.catchRef},e,{accessKey:this.state._accessKey,"aria-current":this.state._ariaCurrent,"aria-disabled":this.state._disabled?"true":void 0,"aria-expanded":this.state._ariaExpanded?"true":void 0,"aria-owns":this.state._ariaOwns,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?`${this.state._label}${t?` (${(0,n.t)("kol-open-link-in-tab")})`:""}`:void 0,class:{disabled:!0===this.state._disabled,"external-link":t,"hide-label":!0===this.state._hideLabel}},this.state._on,{onClick:this.onClick,onKeyPress:this.onClick,role:this.state._role,tabIndex:this.state._disabled?-1:this.state._tabIndex}),(0,i.h)(o.f,{key:"199d2afb7615f7654674ea33284de0e376da713c",_accessKey:this.state._accessKey,_icons:this.state._icons,_hideLabel:this.state._hideLabel,_label:a?"":this.state._label||this.state._href},(0,i.h)("slot",{key:"341e514c5974572683e1c29852e33e686efc85e4",name:"expert",slot:"expert"})),t&&(0,i.h)(o.g,{key:"abf9e01ab96cc7b418430cbc39746659c50bf60f",class:"external-link-icon",_label:this.state._hideLabel?"":(0,n.t)("kol-open-link-in-tab"),_icons:"codicon codicon-link-external","aria-hidden":this.state._hideLabel})),(0,i.h)(o.a,{key:"d9501a785b3f27bafd87e8b0dc622588fd17d251","aria-hidden":"true",hidden:a||!this.state._hideLabel,_accessKey:this.state._accessKey,_align:this.state._tooltipAlign,_label:this.state._label||this.state._href}))}validateAccessKey(t){(0,c.v)(this,t)}validateAriaCurrentValue(t){((t,e)=>{(0,r.w)(t,"_ariaCurrentValue",(t=>"string"==typeof t&&y.includes(t)),new Set([`AriaCurrentValue {${y.join(", ")}`]),e,{defaultValue:"page"})})(this,t)}validateAriaExpanded(t){(0,v.v)(this,t)}validateAriaOwns(t){((t,e)=>{(0,r.i)(t,"_ariaOwns",e,{defaultValue:void 0})})(this,t)}validateDisabled(t){(0,_.v)(this,t)}validateDownload(t){((t,e)=>{(0,r.i)(t,"_download",e)})(this,t)}validateHideLabel(t){(0,b.v)(this,t)}validateHref(t){(0,d.v)(this,t,{required:!0})}validateIcons(t){(0,u.v)(this,t)}validateLabel(t){(0,f.a)(this,t)}validateOn(t){((t,e)=>{"object"==typeof e&&"function"==typeof(null==e?void 0:e.onClick)&&(t.state=Object.assign(Object.assign({},t.state),{_on:e}))})(this,t)}validateRole(t){(0,v.a)(this,t)}validateTabIndex(t){(0,p.v)(this,t)}validateTarget(t){((t,e)=>{(0,r.i)(t,"_target",e)})(this,t)}validateTooltipAlign(t){(0,g.v)(this,t)}componentWillLoad(){this.validateAccessKey(this._accessKey),this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaOwns(this._ariaOwns),this.validateDisabled(this._disabled),this.validateDownload(this._download),this.validateHideLabel(this._hideLabel),this.validateHref(this._href),this.validateIcons(this._icons),this.validateLabel(this._label),this.validateOn(this._on),this.validateRole(this._role),this.validateTabIndex(this._tabIndex),this.validateTarget(this._target),this.validateTooltipAlign(this._tooltipAlign),this.unsubscribeOnLocationChange=(0,s.o)((t=>{this.state._ariaCurrent=t===this.state._href?this.state._ariaCurrentValue:void 0}))}disconnectedCallback(){this.unsubscribeOnLocationChange&&this.unsubscribeOnLocationChange()}static get watchers(){return{_accessKey:["validateAccessKey"],_ariaCurrentValue:["validateAriaCurrentValue"],_ariaExpanded:["validateAriaExpanded"],_ariaOwns:["validateAriaOwns"],_disabled:["validateDisabled"],_download:["validateDownload"],_hideLabel:["validateHideLabel"],_href:["validateHref"],_icons:["validateIcons"],_label:["validateLabel"],_on:["validateOn"],_role:["validateRole"],_tabIndex:["validateTabIndex"],_target:["validateTarget"],_tooltipAlign:["validateTooltipAlign"]}}}},5893:(t,e,a)=>{a.d(e,{a:()=>c,b:()=>n,c:()=>r,h:()=>s,v:()=>h});var i=a(7238);const s=[0,1,2,3,4,5,6],l=/[a-zA-Z0-9äöüÄÖÜß]/g,o=/^\d+$/;function n(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(l))||void 0===e?void 0:e.length)||0}(t)>=e}function r(t){return o.test(t)}const d=new Set(["string"]),h=(t,e,a={})=>{(0,i.w)(t,"_label",(t=>"string"==typeof t),d,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,a,s,l)=>{var o,d;"function"==typeof(null===(o=t.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(d=t.hooks)||void 0===d||d.afterPatch(e,a,s,l)),"string"==typeof e&&!1===n(e,3)&&!1===r(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(a))},c=h},8796:(t,e,a)=>{a.d(e,{S:()=>o,a:()=>l,b:()=>i,c:()=>n,h:()=>d,i:()=>s,p:()=>r,s:()=>h});const i=t=>"object"==typeof t&&null!==t,s=(t,e=0)=>"string"==typeof t&&t.length>=e,l=t=>{if("object"!=typeof t||null===t)return s(t,1);for(const e in t)if(!1===s(e,1))return!1;return!0},o=new Event("StateChange"),n=(t,e)=>{i(t)&&t&&(t.focus=t=>null==e?void 0:e.focus(t))};let r="development";try{r="production"}catch(t){r="production"}const d=(t,e,a)=>{if(t&&e&&"string"==typeof a){const i=t.querySelector(`[slot="${a}"]`);i&&e.appendChild(i)}},h=t=>""===t},3008:(t,e,a)=>{a.d(e,{v:()=>l});var i=a(7238);const s={hooks:{afterPatch:t=>{-1!==t&&0!==t&&(0,i.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},l=(t,e)=>{(0,i.k)(t,"_tabIndex",e,s)}},4539:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(7216);const s=(t,e)=>{(0,i.v)(t,"_tooltipAlign",e)}}}]);

package/dist/8515.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8515.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8515],{8515:(n,e,t)=>{t.r(e),t.d(e,{kol_link_button:()=>s});var i=t(6509),o=t(2781),a=(n,e,t)=>new Promise(((i,o)=>{var a=n=>{try{l(t.next(n))}catch(n){o(n)}},s=n=>{try{l(t.throw(n))}catch(n){o(n)}},l=n=>n.done?i(n.value):Promise.resolve(n.value).then(a,s);l((t=t.apply(n,e)).next())}));const s=class{constructor(n){(0,i.r)(this,n),this.catchRef=n=>{this.linkWcRef=n},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._customClass=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right",this._variant="normal"}focus(){return a(this,null,(function*(){yield this.kolFocus()}))}kolFocus(){return a(this,null,(function*(){var n;yield null===(n=this.linkWcRef)||void 0===n?void 0:n.kolFocus()}))}render(){return(0,i.h)(i.H,{key:"e6ab08377be0ad810ea3d7c0f690231663aa790d",class:"kol-link-button"},(0,i.h)(o.n,{key:"dd6e0237ef4fa62c42f8c4ce51efa5f3dbfcd49d",ref:this.catchRef,class:{button:!0,[this._variant]:"custom"!==this._variant,[this._customClass]:"custom"===this._variant&&"string"==typeof this._customClass&&this._customClass.length>0},_accessKey:this._accessKey,_ariaCurrentValue:this._ariaCurrentValue,_disabled:this._disabled,_download:this._download,_hideLabel:this._hideLabel,_href:this._href,_icons:this._icons,_label:this._label,_on:this._on,_role:"button",_tabIndex:this._tabIndex,_target:this._target,_tooltipAlign:this._tooltipAlign},(0,i.h)("slot",{key:"de5b3af7fb665c288e9cffa7da4f59dcd57e9093",name:"expert",slot:"expert"})))}};s.style={default:"@charset \"UTF-8\";\n/*\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    font-style: calc(16rem / var(--kolibri-root-font-size, 16));\n    display: inline-block;\n  }\n  :is(a, button) {\n    display: inline-flex;\n    place-items: center;\n    text-align: center;\n    text-decoration-line: none;\n  }\n  :is(a, button)::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: \"​\";\n  }\n  /* TODO: Why we need this? */\n  :is(a, button) > .kol-span-wc {\n    margin: auto;\n    width: 100%;\n  }\n}"}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8515],{8515:(n,e,t)=>{t.r(e),t.d(e,{kol_link_button:()=>s});var i=t(9944),o=t(9494),a=(n,e,t)=>new Promise(((i,o)=>{var a=n=>{try{l(t.next(n))}catch(n){o(n)}},s=n=>{try{l(t.throw(n))}catch(n){o(n)}},l=n=>n.done?i(n.value):Promise.resolve(n.value).then(a,s);l((t=t.apply(n,e)).next())}));const s=class{constructor(n){(0,i.r)(this,n),this.catchRef=n=>{this.linkWcRef=n},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._customClass=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right",this._variant="normal"}focus(){return a(this,null,(function*(){yield this.kolFocus()}))}kolFocus(){return a(this,null,(function*(){var n;yield null===(n=this.linkWcRef)||void 0===n?void 0:n.kolFocus()}))}render(){return(0,i.h)(i.H,{key:"e6ab08377be0ad810ea3d7c0f690231663aa790d",class:"kol-link-button"},(0,i.h)(o.n,{key:"dd6e0237ef4fa62c42f8c4ce51efa5f3dbfcd49d",ref:this.catchRef,class:{button:!0,[this._variant]:"custom"!==this._variant,[this._customClass]:"custom"===this._variant&&"string"==typeof this._customClass&&this._customClass.length>0},_accessKey:this._accessKey,_ariaCurrentValue:this._ariaCurrentValue,_disabled:this._disabled,_download:this._download,_hideLabel:this._hideLabel,_href:this._href,_icons:this._icons,_label:this._label,_on:this._on,_role:"button",_tabIndex:this._tabIndex,_target:this._target,_tooltipAlign:this._tooltipAlign},(0,i.h)("slot",{key:"de5b3af7fb665c288e9cffa7da4f59dcd57e9093",name:"expert",slot:"expert"})))}};s.style={default:"@charset \"UTF-8\";\n/*\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    font-style: calc(16rem / var(--kolibri-root-font-size, 16));\n    display: inline-block;\n  }\n  :is(a, button) {\n    display: inline-flex;\n    place-items: center;\n    text-align: center;\n    text-decoration-line: none;\n  }\n  :is(a, button)::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: \"​\";\n  }\n  /* TODO: Why we need this? */\n  :is(a, button) > .kol-span-wc {\n    margin: auto;\n    width: 100%;\n  }\n}"}}}]);

package/dist/8557.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8557.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8557],{8557:(n,e,t)=>{t.r(e),t.d(e,{kol_indented_text:()=>o});var i=t(6509);const o=class{constructor(n){(0,i.r)(this,n),this.state={}}render(){return(0,i.h)(i.H,{key:"674c96016710a7da20d2818387457838785b3356",class:"kol-indented-text-wc"},(0,i.h)("div",{key:"b8f4bc81340ef597d42df3ab5e997a4eacb12267"},(0,i.h)("slot",{key:"29084aadeed639db76fed6a9a3bdf46facf5ef52"})))}};o.style={default:"/*\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  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  :host > div {\n    border-left-style: solid;\n    padding-left: 0.5em;\n  }\n}"}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8557],{8557:(n,e,t)=>{t.r(e),t.d(e,{kol_indented_text:()=>o});var i=t(9944);const o=class{constructor(n){(0,i.r)(this,n),this.state={}}render(){return(0,i.h)(i.H,{key:"674c96016710a7da20d2818387457838785b3356",class:"kol-indented-text-wc"},(0,i.h)("div",{key:"b8f4bc81340ef597d42df3ab5e997a4eacb12267"},(0,i.h)("slot",{key:"29084aadeed639db76fed6a9a3bdf46facf5ef52"})))}};o.style={default:"/*\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  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  :host > div {\n    border-left-style: solid;\n    padding-left: 0.5em;\n  }\n}"}}}]);

package/dist/8588.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8588.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8588],{7424:(e,n,t)=>{t.d(n,{I:()=>c,a:()=>h,f:()=>d,v:()=>s});var i=t(8154),a=t(7238),o=t(5893);const l=e=>{if("object"==typeof e&&null!==e){if("string"==typeof e.label&&e.label.length>0)return e.disabled=!0===e.disabled,e.label=`${e.label}`.trim(),!1===(0,o.b)(e.label,3)&&!1===(0,o.c)(e.label)&&(0,a.a)(`A differing Aria-Label (${e.label}) is not accessible. A differing Aria-Label should consist of at least three readable characters.`),!Array.isArray(e.options)||void 0===e.options.find((e=>!1===l(e)));if("number"==typeof e.label)return!0}return!1},s=(e,n,t={})=>{(0,a.g)(e,"_options",l,n,void 0,t)},r=["horizontal","vertical"],d=(e,n,t="")=>{n.forEach(((n,i)=>{const a=`${t}-${i}`;"object"==typeof n&&null!==n&&"string"==typeof n.label&&n.label.length>0&&(Array.isArray(n.options)?d(e,n.options,a):e.set(a,n))}))};class c extends i.I{constructor(e,n,t){super(e,n,t),this.component=e}validateRequired(e){((e,n)=>{(0,a.b)(e,"_required",n)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateRequired(this.component._required)}}class h extends c{constructor(e,n,t){super(e,n,t),this.keyOptionMap=new Map,this.getOptionByKey=e=>this.keyOptionMap.get(e),this.afterPatchOptions=(e,n,t,i)=>{"_value"===i&&this.setFormAssociatedValue(e)},this.beforePatchOptions=(e,n)=>{const t=n.has("_options")?n.get("_options"):this.component.state._options;Array.isArray(t)&&t.length>0&&(this.keyOptionMap.clear(),d(this.keyOptionMap,t))},this.component=e}validateOrientation(e){(0,a.w)(this.component,"_orientation",(e=>"string"==typeof e&&r.includes(e)),new Set([`Orientation {${r.join(", ")}`]),e,{defaultValue:"vertical"})}validateOptions(e){((e,n,t={})=>{(0,a.g)(e,"_options",(e=>"object"==typeof e&&null!==e&&"string"==typeof e.label&&e.label.length>0),n,void 0,t)})(this.component,e,{hooks:{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions}})}validateValue(e){e=(0,a.m)(e),e=Array.isArray(e)?e[0]:e,(0,a.s)(this.component,"_value",e,{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions})}componentWillLoad(){super.componentWillLoad(),this.validateOrientation(this.component._orientation),this.validateOptions(this.component._options),this.validateValue(this.component._value)}}},8588:(e,n,t)=>{t.r(n),t.d(n,{kol_input_checkbox:()=>m});var i=t(6509),a=t(7990),o=t(5237),l=t(8154),s=t(1885),r=t(7424),d=t(7238),c=t(8796),h=t(2781),p=(e,n,t)=>new Promise(((i,a)=>{var o=e=>{try{s(t.next(e))}catch(e){a(e)}},l=e=>{try{s(t.throw(e))}catch(e){a(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(o,l);s((t=t.apply(e,n)).next())}));const u=["button","default","switch"];class b extends r.I{constructor(e,n,t){super(e,n,t),this.setFormAssociatedCheckboxValue=e=>{this.component._checked?this.setFormAssociatedValue(e):this.setFormAssociatedValue(null)},this.component=e}validateChecked(e){((e,n)=>{(0,d.b)(e,"_checked",n)})(this.component,e),this.setFormAssociatedCheckboxValue(this.component.state._value)}validateIcons(e){(0,d.w)(this.component,"_icons",(e=>"object"==typeof e&&null!==e&&((0,c.i)(e.checked,1)||(0,c.i)(e.indeterminate,1)||(0,c.i)(e.unchecked,1))),new Set(["InputCheckboxIcons"]),e,{hooks:{beforePatch:(e,n,t)=>{n.set("_icons",Object.assign(Object.assign({},t.state._icons),e))}}})}validateIndeterminate(e){((e,n)=>{(0,d.b)(e,"_indeterminate",n)})(this.component,e)}validateValue(e){(0,d.s)(this.component,"_value",e),this.setFormAssociatedCheckboxValue(this.component.state._value)}validateVariant(e){(0,d.w)(this.component,"_variant",(e=>"string"==typeof e&&u.includes(e)),new Set([`String {${u.join(", ")}`]),e)}componentWillLoad(){super.componentWillLoad(),this.validateChecked(this.component._checked),this.validateIcons(this.component._icons),this.validateIndeterminate(this.component._indeterminate),this.validateValue(this.component._value),this.validateVariant(this.component._variant)}}const m=class{getModelValue(){return this._checked?this.state._value:null}getValue(){return p(this,null,(function*(){return this.getModelValue()}))}focus(){return p(this,null,(function*(){yield this.kolFocus()}))}kolFocus(){return p(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}render(){const{ariaDescribedBy:e}=(0,l.g)(this.state),n=(0,c.s)(this.state._label);return(0,i.h)(i.H,{key:"dc370837af55af47703a694a130c8741c33486cb",class:"kol-input-checkbox"},(0,i.h)(h.l,{key:"3ca714b19dac1f42d3e64c8476b128b972cfdca1",class:{checkbox:!0,[this.state._variant]:!0,"hide-label":!!this.state._hideLabel,checked:this.state._checked,indeterminate:this.state._indeterminate},"data-role":"button"===this.state._variant?"button":void 0,_accessKey:this.state._accessKey,_alert:this.state._alert,_disabled:this.state._disabled,_msg:this.state._msg,_hideError:this.state._hideError,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:this.state._id,_label:this.state._label,_required:this.state._required,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched},(0,i.h)("span",{key:"2bff685d8c0317cacc948f0c805fef10fb653636",slot:"label"},n?(0,i.h)("slot",{name:"expert"}):"string"==typeof this.state._accessKey?(0,i.h)(i.F,null,(0,i.h)(s.I,{accessKey:this.state._accessKey,label:this.state._label})," ",(0,i.h)("span",{class:"access-key-hint","aria-hidden":"true"},this.state._accessKey)):(0,i.h)("span",null,this.state._label)),(0,i.h)("label",{key:"635658a3307d58a6070e1111897b8f0b283edb89",slot:"input",class:"checkbox-container"},(0,i.h)(h.g,{key:"860eaaaa13aadbb5611270163afebe8cbb2a6781",class:"icon",_icons:this.state._indeterminate?this.state._icons.indeterminate:this.state._checked?this.state._icons.checked:this.state._icons.unchecked,_label:""}),(0,i.h)("input",Object.assign({key:"a5490285924abde52bfb7270b05d0cff4e4cbcbd",class:"checkbox-input-element"+("button"===this.state._variant?" visually-hidden":""),ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,checked:this.state._checked,disabled:this.state._disabled,id:this.state._id,indeterminate:this.state._indeterminate,name:this.state._name,required:this.state._required,tabIndex:this.state._tabIndex,type:"checkbox"},this.controller.onFacade,{onInput:this.onInput,onChange:this.onChange,onClick:void 0})))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onInput=e=>{var n;this._checked=!this._checked,this._indeterminate=!1;const t=this.getModelValue();(0,o.t)("input",this.host,t),"function"==typeof(null===(n=this._on)||void 0===n?void 0:n.onInput)&&this._on.onInput(e,t)},this.onChange=e=>{var n;const t=this.getModelValue();(0,o.t)("change",this.host,t),this.controller.setFormAssociatedCheckboxValue(t),"function"==typeof(null===(n=this._on)||void 0===n?void 0:n.onChange)&&this._on.onChange(e,t)},this._accessKey=void 0,this._alert=!0,this._checked=!1,this._hideError=!1,this._disabled=!1,this._error=void 0,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._indeterminate=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._required=!1,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=!0,this._variant="default",this.state={_checked:!1,_hideError:!1,_icons:{checked:"codicon codicon-check",indeterminate:"codicon codicon-remove",unchecked:"codicon codicon-close"},_id:`id-${(0,a.n)()}`,_indeterminate:!1,_label:"",_value:!0,_variant:"default"},this.controller=new b(this,"checkbox",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateChecked(e){this.controller.validateChecked(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateIndeterminate(e){this.controller.validateIndeterminate(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}validateVariant(e){this.controller.validateVariant(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_checked:["validateChecked"],_disabled:["validateDisabled"],_error:["validateError"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_indeterminate:["validateIndeterminate"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"],_variant:["validateVariant"]}}};m.style={default:"/*\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  .required label > span::after,\n  .required legend > span::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  input,\n  textarea {\n    cursor: text;\n  }\n  input[type=checkbox],\n  input[type=color],\n  input[type=file],\n  input[type=radio],\n  input[type=range],\n  label,\n  option,\n  select {\n    cursor: pointer;\n  }\n  /* input[type='checkbox'], */\n  /* input[type='radio'], */\n  /* input[type='range'], */\n  input[type=color],\n  input[type=date],\n  input[type=datetime-local],\n  input[type=email],\n  input[type=file],\n  input[type=month],\n  input[type=number],\n  input[type=password],\n  input[type=search],\n  input[type=tel],\n  input[type=text],\n  input[type=time],\n  input[type=url],\n  input[type=week],\n  select,\n  select[multiple] option,\n  textarea {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: 100%;\n  }\n  /* needed hack for vertical alignment */\n  input[type=file] {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n  /* needed hack for vertical alignment */\n  select[multiple] option {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  label {\n    cursor: pointer;\n  }\n  .kol-input {\n    align-items: center;\n    display: grid;\n    justify-items: left;\n  }\n  .kol-input.default,\n  .kol-input.switch {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input .input {\n    align-items: center;\n    display: grid;\n    order: 1;\n  }\n  .kol-input .input div {\n    display: inline-flex;\n  }\n  .kol-input .input input {\n    margin: 0;\n  }\n  .kol-input label {\n    order: 2;\n  }\n  .kol-input .hint,\n  .kol-input.error > .kol-alert {\n    grid-column: span 2;\n  }\n  .kol-input .kol-alert.error {\n    order: 3;\n  }\n  .kol-input .hint {\n    order: 4;\n  }\n  input {\n    border-style: solid;\n    border-width: 2px;\n    line-height: 24px;\n  }\n  input[type=checkbox] {\n    appearance: none;\n    background-color: #fff;\n    cursor: pointer;\n    transition: 0.5s;\n  }\n  input[type=checkbox]:before {\n    content: \"\";\n    cursor: pointer;\n  }\n  input[type=checkbox]:disabled:before {\n    cursor: not-allowed;\n  }\n  .kol-input.required .tooltip-content .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .button {\n    display: grid;\n    grid-template-columns: var(--a11y-min-size) auto;\n    grid-template-areas: \"error error\" \"input label\" \"hint hint\";\n  }\n  .button:focus-within {\n    /* override global `[tabindex]:focus` style */\n    cursor: inherit;\n    outline-color: black;\n    outline-style: solid;\n  }\n  .button > .error {\n    grid-area: error;\n  }\n  .button > label {\n    grid-area: label;\n  }\n  .button > .input {\n    grid-area: input;\n  }\n  .button > .hint {\n    grid-area: hint;\n  }\n  .button .icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--a11y-min-size);\n    height: var(--a11y-min-size);\n  }\n}\n@layer kol-component {\n  .default .checkbox-container {\n    align-items: center;\n    display: flex;\n    height: var(--a11y-min-size);\n    justify-content: center;\n    position: relative;\n    width: var(--a11y-min-size);\n  }\n  .default .icon {\n    display: block;\n    inset: auto;\n    position: absolute;\n    z-index: 1;\n  }\n  .default:not(.checked):not(.indeterminate) .icon::part(icon) {\n    display: none;\n  }\n  .default .checkbox-input-element {\n    width: 22px;\n    height: 22px;\n  }\n}\n@layer kol-component {\n  .switch .input {\n    position: relative;\n  }\n  .switch input[type=checkbox] {\n    display: inline-block;\n    height: 1.7em;\n    min-width: 3.2em;\n    position: relative;\n    width: 3.2em;\n  }\n  .switch input[type=checkbox]::before {\n    background-color: #000;\n    height: 1.2em;\n    left: calc(0.25em - 2px);\n    top: calc(0.25em - 2px);\n    position: absolute;\n    transition: 0.5s;\n    width: 1.2em;\n  }\n  .switch input[type=checkbox]:checked::before {\n    transform: translateX(1.5em);\n  }\n  .switch input[type=checkbox]:indeterminate::before {\n    transform: translateX(0.75em);\n  }\n  .switch .icon {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1.2em;\n    height: 1.2em;\n    position: absolute;\n    z-index: 1;\n    top: 50%;\n    left: 4px;\n    transform: translate(0, -50%);\n    transition: 0.5s;\n    color: #000;\n  }\n  .switch.checked .icon {\n    transform: translate(1.5em, -50%);\n  }\n  .switch.indeterminate .icon {\n    transform: translate(0.75em, -50%);\n  }\n}\n/*\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  .kol-alert-wc {\n    display: grid;\n  }\n  .kol-alert-wc .heading {\n    display: flex;\n    place-items: center;\n  }\n  .kol-alert-wc .heading > div {\n    flex-grow: 1;\n  }\n  .close {\n    /* Visible with forced colors */\n    outline: transparent solid 1px;\n  }\n}"}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8588],{7424:(e,n,t)=>{t.d(n,{I:()=>c,a:()=>h,f:()=>d,v:()=>s});var i=t(8154),a=t(7238),o=t(5893);const l=e=>{if("object"==typeof e&&null!==e){if("string"==typeof e.label&&e.label.length>0)return e.disabled=!0===e.disabled,e.label=`${e.label}`.trim(),!1===(0,o.b)(e.label,3)&&!1===(0,o.c)(e.label)&&(0,a.a)(`A differing Aria-Label (${e.label}) is not accessible. A differing Aria-Label should consist of at least three readable characters.`),!Array.isArray(e.options)||void 0===e.options.find((e=>!1===l(e)));if("number"==typeof e.label)return!0}return!1},s=(e,n,t={})=>{(0,a.g)(e,"_options",l,n,void 0,t)},r=["horizontal","vertical"],d=(e,n,t="")=>{n.forEach(((n,i)=>{const a=`${t}-${i}`;"object"==typeof n&&null!==n&&"string"==typeof n.label&&n.label.length>0&&(Array.isArray(n.options)?d(e,n.options,a):e.set(a,n))}))};class c extends i.I{constructor(e,n,t){super(e,n,t),this.component=e}validateRequired(e){((e,n)=>{(0,a.b)(e,"_required",n)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateRequired(this.component._required)}}class h extends c{constructor(e,n,t){super(e,n,t),this.keyOptionMap=new Map,this.getOptionByKey=e=>this.keyOptionMap.get(e),this.afterPatchOptions=(e,n,t,i)=>{"_value"===i&&this.setFormAssociatedValue(e)},this.beforePatchOptions=(e,n)=>{const t=n.has("_options")?n.get("_options"):this.component.state._options;Array.isArray(t)&&t.length>0&&(this.keyOptionMap.clear(),d(this.keyOptionMap,t))},this.component=e}validateOrientation(e){(0,a.w)(this.component,"_orientation",(e=>"string"==typeof e&&r.includes(e)),new Set([`Orientation {${r.join(", ")}`]),e,{defaultValue:"vertical"})}validateOptions(e){((e,n,t={})=>{(0,a.g)(e,"_options",(e=>"object"==typeof e&&null!==e&&"string"==typeof e.label&&e.label.length>0),n,void 0,t)})(this.component,e,{hooks:{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions}})}validateValue(e){e=(0,a.m)(e),e=Array.isArray(e)?e[0]:e,(0,a.s)(this.component,"_value",e,{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions})}componentWillLoad(){super.componentWillLoad(),this.validateOrientation(this.component._orientation),this.validateOptions(this.component._options),this.validateValue(this.component._value)}}},8588:(e,n,t)=>{t.r(n),t.d(n,{kol_input_checkbox:()=>m});var i=t(9944),a=t(3246),o=t(5237),l=t(8154),s=t(4242),r=t(7424),d=t(7238),c=t(8796),h=t(9494),p=(e,n,t)=>new Promise(((i,a)=>{var o=e=>{try{s(t.next(e))}catch(e){a(e)}},l=e=>{try{s(t.throw(e))}catch(e){a(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(o,l);s((t=t.apply(e,n)).next())}));const u=["button","default","switch"];class b extends r.I{constructor(e,n,t){super(e,n,t),this.setFormAssociatedCheckboxValue=e=>{this.component._checked?this.setFormAssociatedValue(e):this.setFormAssociatedValue(null)},this.component=e}validateChecked(e){((e,n)=>{(0,d.b)(e,"_checked",n)})(this.component,e),this.setFormAssociatedCheckboxValue(this.component.state._value)}validateIcons(e){(0,d.w)(this.component,"_icons",(e=>"object"==typeof e&&null!==e&&((0,c.i)(e.checked,1)||(0,c.i)(e.indeterminate,1)||(0,c.i)(e.unchecked,1))),new Set(["InputCheckboxIcons"]),e,{hooks:{beforePatch:(e,n,t)=>{n.set("_icons",Object.assign(Object.assign({},t.state._icons),e))}}})}validateIndeterminate(e){((e,n)=>{(0,d.b)(e,"_indeterminate",n)})(this.component,e)}validateValue(e){(0,d.s)(this.component,"_value",e),this.setFormAssociatedCheckboxValue(this.component.state._value)}validateVariant(e){(0,d.w)(this.component,"_variant",(e=>"string"==typeof e&&u.includes(e)),new Set([`String {${u.join(", ")}`]),e)}componentWillLoad(){super.componentWillLoad(),this.validateChecked(this.component._checked),this.validateIcons(this.component._icons),this.validateIndeterminate(this.component._indeterminate),this.validateValue(this.component._value),this.validateVariant(this.component._variant)}}const m=class{getModelValue(){return this._checked?this.state._value:null}getValue(){return p(this,null,(function*(){return this.getModelValue()}))}focus(){return p(this,null,(function*(){yield this.kolFocus()}))}kolFocus(){return p(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}render(){const{ariaDescribedBy:e}=(0,l.g)(this.state),n=(0,c.s)(this.state._label);return(0,i.h)(i.H,{key:"dc370837af55af47703a694a130c8741c33486cb",class:"kol-input-checkbox"},(0,i.h)(h.l,{key:"3ca714b19dac1f42d3e64c8476b128b972cfdca1",class:{checkbox:!0,[this.state._variant]:!0,"hide-label":!!this.state._hideLabel,checked:this.state._checked,indeterminate:this.state._indeterminate},"data-role":"button"===this.state._variant?"button":void 0,_accessKey:this.state._accessKey,_alert:this.state._alert,_disabled:this.state._disabled,_msg:this.state._msg,_hideError:this.state._hideError,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_id:this.state._id,_label:this.state._label,_required:this.state._required,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched},(0,i.h)("span",{key:"2bff685d8c0317cacc948f0c805fef10fb653636",slot:"label"},n?(0,i.h)("slot",{name:"expert"}):"string"==typeof this.state._accessKey?(0,i.h)(i.F,null,(0,i.h)(s.I,{accessKey:this.state._accessKey,label:this.state._label})," ",(0,i.h)("span",{class:"access-key-hint","aria-hidden":"true"},this.state._accessKey)):(0,i.h)("span",null,this.state._label)),(0,i.h)("label",{key:"635658a3307d58a6070e1111897b8f0b283edb89",slot:"input",class:"checkbox-container"},(0,i.h)(h.g,{key:"860eaaaa13aadbb5611270163afebe8cbb2a6781",class:"icon",_icons:this.state._indeterminate?this.state._icons.indeterminate:this.state._checked?this.state._icons.checked:this.state._icons.unchecked,_label:""}),(0,i.h)("input",Object.assign({key:"a5490285924abde52bfb7270b05d0cff4e4cbcbd",class:"checkbox-input-element"+("button"===this.state._variant?" visually-hidden":""),ref:this.catchRef,title:"",accessKey:this.state._accessKey,"aria-describedby":e.length>0?e.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,checked:this.state._checked,disabled:this.state._disabled,id:this.state._id,indeterminate:this.state._indeterminate,name:this.state._name,required:this.state._required,tabIndex:this.state._tabIndex,type:"checkbox"},this.controller.onFacade,{onInput:this.onInput,onChange:this.onChange,onClick:void 0})))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onInput=e=>{var n;this._checked=!this._checked,this._indeterminate=!1;const t=this.getModelValue();(0,o.t)("input",this.host,t),"function"==typeof(null===(n=this._on)||void 0===n?void 0:n.onInput)&&this._on.onInput(e,t)},this.onChange=e=>{var n;const t=this.getModelValue();(0,o.t)("change",this.host,t),this.controller.setFormAssociatedCheckboxValue(t),"function"==typeof(null===(n=this._on)||void 0===n?void 0:n.onChange)&&this._on.onChange(e,t)},this._accessKey=void 0,this._alert=!0,this._checked=!1,this._hideError=!1,this._disabled=!1,this._error=void 0,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._indeterminate=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._required=!1,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=!0,this._variant="default",this.state={_checked:!1,_hideError:!1,_icons:{checked:"codicon codicon-check",indeterminate:"codicon codicon-remove",unchecked:"codicon codicon-close"},_id:`id-${(0,a.n)()}`,_indeterminate:!1,_label:"",_value:!0,_variant:"default"},this.controller=new b(this,"checkbox",this.host)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateChecked(e){this.controller.validateChecked(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateError(e){this.controller.validateError(e)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateIndeterminate(e){this.controller.validateIndeterminate(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}validateVariant(e){this.controller.validateVariant(e)}componentWillLoad(){this._alert=!0===this._alert,this._touched=!0===this._touched,this.controller.componentWillLoad()}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_alert:["validateAlert"],_checked:["validateChecked"],_disabled:["validateDisabled"],_error:["validateError"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_indeterminate:["validateIndeterminate"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"],_variant:["validateVariant"]}}};m.style={default:"/*\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  .required label > span::after,\n  .required legend > span::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  input,\n  textarea {\n    cursor: text;\n  }\n  input[type=checkbox],\n  input[type=color],\n  input[type=file],\n  input[type=radio],\n  input[type=range],\n  label,\n  option,\n  select {\n    cursor: pointer;\n  }\n  /* input[type='checkbox'], */\n  /* input[type='radio'], */\n  /* input[type='range'], */\n  input[type=color],\n  input[type=date],\n  input[type=datetime-local],\n  input[type=email],\n  input[type=file],\n  input[type=month],\n  input[type=number],\n  input[type=password],\n  input[type=search],\n  input[type=tel],\n  input[type=text],\n  input[type=time],\n  input[type=url],\n  input[type=week],\n  select,\n  select[multiple] option,\n  textarea {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: 100%;\n  }\n  /* needed hack for vertical alignment */\n  input[type=file] {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n  /* needed hack for vertical alignment */\n  select[multiple] option {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  label {\n    cursor: pointer;\n  }\n  .kol-input {\n    align-items: center;\n    display: grid;\n    justify-items: left;\n  }\n  .kol-input.default,\n  .kol-input.switch {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input .input {\n    align-items: center;\n    display: grid;\n    order: 1;\n  }\n  .kol-input .input div {\n    display: inline-flex;\n  }\n  .kol-input .input input {\n    margin: 0;\n  }\n  .kol-input label {\n    order: 2;\n  }\n  .kol-input .hint,\n  .kol-input.error > .kol-alert {\n    grid-column: span 2;\n  }\n  .kol-input .kol-alert.error {\n    order: 3;\n  }\n  .kol-input .hint {\n    order: 4;\n  }\n  input {\n    border-style: solid;\n    border-width: 2px;\n    line-height: 24px;\n  }\n  input[type=checkbox] {\n    appearance: none;\n    background-color: #fff;\n    cursor: pointer;\n    transition: 0.5s;\n  }\n  input[type=checkbox]:before {\n    content: \"\";\n    cursor: pointer;\n  }\n  input[type=checkbox]:disabled:before {\n    cursor: not-allowed;\n  }\n  .kol-input.required .tooltip-content .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .button {\n    display: grid;\n    grid-template-columns: var(--a11y-min-size) auto;\n    grid-template-areas: \"error error\" \"input label\" \"hint hint\";\n  }\n  .button:focus-within {\n    /* override global `[tabindex]:focus` style */\n    cursor: inherit;\n    outline-color: black;\n    outline-style: solid;\n  }\n  .button > .error {\n    grid-area: error;\n  }\n  .button > label {\n    grid-area: label;\n  }\n  .button > .input {\n    grid-area: input;\n  }\n  .button > .hint {\n    grid-area: hint;\n  }\n  .button .icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--a11y-min-size);\n    height: var(--a11y-min-size);\n  }\n}\n@layer kol-component {\n  .default .checkbox-container {\n    align-items: center;\n    display: flex;\n    height: var(--a11y-min-size);\n    justify-content: center;\n    position: relative;\n    width: var(--a11y-min-size);\n  }\n  .default .icon {\n    display: block;\n    inset: auto;\n    position: absolute;\n    z-index: 1;\n  }\n  .default:not(.checked):not(.indeterminate) .icon::part(icon) {\n    display: none;\n  }\n  .default .checkbox-input-element {\n    width: 22px;\n    height: 22px;\n  }\n}\n@layer kol-component {\n  .switch .input {\n    position: relative;\n  }\n  .switch input[type=checkbox] {\n    display: inline-block;\n    height: 1.7em;\n    min-width: 3.2em;\n    position: relative;\n    width: 3.2em;\n  }\n  .switch input[type=checkbox]::before {\n    background-color: #000;\n    height: 1.2em;\n    left: calc(0.25em - 2px);\n    top: calc(0.25em - 2px);\n    position: absolute;\n    transition: 0.5s;\n    width: 1.2em;\n  }\n  .switch input[type=checkbox]:checked::before {\n    transform: translateX(1.5em);\n  }\n  .switch input[type=checkbox]:indeterminate::before {\n    transform: translateX(0.75em);\n  }\n  .switch .icon {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1.2em;\n    height: 1.2em;\n    position: absolute;\n    z-index: 1;\n    top: 50%;\n    left: 4px;\n    transform: translate(0, -50%);\n    transition: 0.5s;\n    color: #000;\n  }\n  .switch.checked .icon {\n    transform: translate(1.5em, -50%);\n  }\n  .switch.indeterminate .icon {\n    transform: translate(0.75em, -50%);\n  }\n}\n/*\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  .kol-alert-wc {\n    display: grid;\n  }\n  .kol-alert-wc .heading {\n    display: flex;\n    place-items: center;\n  }\n  .kol-alert-wc .heading > div {\n    flex-grow: 1;\n  }\n  .close {\n    /* Visible with forced colors */\n    outline: transparent solid 1px;\n  }\n}"}}}]);

package/dist/8724.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8724.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8724],{8724:(e,n,t)=>{t.r(n),t.d(n,{kol_popover_wc:()=>l});var i=t(6509),o=t(9905),s=t(3713),a=t(7216),r=t(7881);const l=class{constructor(e){(0,i.r)(this,e),this.hidePopoverByEscape=e=>{"Escape"===e.key&&this.hidePopover()},this.hidePopoverByClickOutside=e=>{this.host&&!this.host.contains(e.target)&&this.hidePopover()},this.catchHostAndTriggerElement=e=>{e&&(this.host=e,this.triggerElement=e.previousElementSibling)},this.catchPopoverElement=e=>{this.popoverElement=e},this.catchArrowElement=e=>{this.arrowElement=e},this._align="top",this._show=!1,this.state={_align:"top",_show:!1,_visible:!1}}showPopover(){return e=this,n=function*(){this.addListenersToBody(),this.triggerElement&&this.popoverElement&&(yield(0,o.a)({align:this._align,referenceElement:this.triggerElement,arrowElement:this.arrowElement,floatingElement:this.popoverElement}),this.state=Object.assign(Object.assign({},this.state),{_visible:!0}))},new Promise(((t,i)=>{var o=e=>{try{a(n.next(e))}catch(e){i(e)}},s=e=>{try{a(n.throw(e))}catch(e){i(e)}},a=e=>e.done?t(e.value):Promise.resolve(e.value).then(o,s);a((n=n.apply(e,null)).next())}));var e,n}hidePopover(){var e;this.state=Object.assign(Object.assign({},this.state),{_visible:!1}),this._show=!1,null===(e=this.triggerElement)||void 0===e||e.focus(),this.removeListenersToBody()}addListenersToBody(){var e;const n=(0,s.g)().body;n.addEventListener("keyup",this.hidePopoverByEscape),n.addEventListener("click",this.hidePopoverByClickOutside),null===(e=document.scrollingElement)||void 0===e||e.addEventListener("scroll",(()=>{this.showPopover()}),{passive:!0})}removeListenersToBody(){var e;const n=(0,s.g)().body;n.removeEventListener("keyup",this.hidePopoverByEscape),n.removeEventListener("click",this.hidePopoverByClickOutside),null===(e=document.scrollingElement)||void 0===e||e.removeEventListener("scroll",(()=>{this.showPopover()}))}render(){return(0,i.h)(i.H,{key:"dcd0715b7b5ecee1797490a75861bb3660964c20",ref:this.catchHostAndTriggerElement,class:"kol-popover-wc"},(0,i.h)("div",{key:"e5808e300a3b8a0382209c2d1e08e9d8b5628c5a",class:{popover:!0,show:this.state._visible},ref:this.catchPopoverElement,hidden:!this.state._show},(0,i.h)("div",{key:"57c5027c81f48377698c2e83a0437f7096e3f2b2",class:`arrow ${this.state._align}`,ref:this.catchArrowElement}),(0,i.h)("slot",{key:"4a353c9f9ff9dad823e92b583be96c6fe45b3eb6"})))}validateAlign(e){(0,a.a)(this,e)}validateShow(e){(0,r.v)(this,e),e&&this.showPopover()}componentWillLoad(){this.validateAlign(this._align),this.validateShow(this._show)}static get watchers(){return{_align:["validateAlign"],_show:["validateShow"]}}};l.style="/*\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    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-popover {\n    height: 0;\n    position: absolute;\n  }\n  .kol-popover .popover {\n    background-color: #fff;\n    min-height: max-content;\n    min-width: max-content;\n    opacity: 0;\n    position: absolute;\n  }\n  .kol-popover .show {\n    animation: 0.3s ease-in forwards fadeInOpacity;\n  }\n  .kol-popover .disappear {\n    animation: 0.3s ease-in backwards fadeInOpacity;\n  }\n  .kol-popover .arrow {\n    background-color: inherit;\n    height: var(--font-size);\n    position: absolute;\n    rotate: 0.125turn;\n    width: var(--font-size);\n    z-index: -1;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}"},7881:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(7238);const o=(e,n,t)=>{(0,i.b)(e,"_show",n,t)}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8724],{8724:(e,n,t)=>{t.r(n),t.d(n,{kol_popover_wc:()=>l});var i=t(9944),o=t(9905),s=t(3713),a=t(7216),r=t(7881);const l=class{constructor(e){(0,i.r)(this,e),this.hidePopoverByEscape=e=>{"Escape"===e.key&&this.hidePopover()},this.hidePopoverByClickOutside=e=>{this.host&&!this.host.contains(e.target)&&this.hidePopover()},this.catchHostAndTriggerElement=e=>{e&&(this.host=e,this.triggerElement=e.previousElementSibling)},this.catchPopoverElement=e=>{this.popoverElement=e},this.catchArrowElement=e=>{this.arrowElement=e},this._align="top",this._show=!1,this.state={_align:"top",_show:!1,_visible:!1}}showPopover(){return e=this,n=function*(){this.addListenersToBody(),this.triggerElement&&this.popoverElement&&(yield(0,o.a)({align:this._align,referenceElement:this.triggerElement,arrowElement:this.arrowElement,floatingElement:this.popoverElement}),this.state=Object.assign(Object.assign({},this.state),{_visible:!0}))},new Promise(((t,i)=>{var o=e=>{try{a(n.next(e))}catch(e){i(e)}},s=e=>{try{a(n.throw(e))}catch(e){i(e)}},a=e=>e.done?t(e.value):Promise.resolve(e.value).then(o,s);a((n=n.apply(e,null)).next())}));var e,n}hidePopover(){var e;this.state=Object.assign(Object.assign({},this.state),{_visible:!1}),this._show=!1,null===(e=this.triggerElement)||void 0===e||e.focus(),this.removeListenersToBody()}addListenersToBody(){var e;const n=(0,s.g)().body;n.addEventListener("keyup",this.hidePopoverByEscape),n.addEventListener("click",this.hidePopoverByClickOutside),null===(e=document.scrollingElement)||void 0===e||e.addEventListener("scroll",(()=>{this.showPopover()}),{passive:!0})}removeListenersToBody(){var e;const n=(0,s.g)().body;n.removeEventListener("keyup",this.hidePopoverByEscape),n.removeEventListener("click",this.hidePopoverByClickOutside),null===(e=document.scrollingElement)||void 0===e||e.removeEventListener("scroll",(()=>{this.showPopover()}))}render(){return(0,i.h)(i.H,{key:"dcd0715b7b5ecee1797490a75861bb3660964c20",ref:this.catchHostAndTriggerElement,class:"kol-popover-wc"},(0,i.h)("div",{key:"e5808e300a3b8a0382209c2d1e08e9d8b5628c5a",class:{popover:!0,show:this.state._visible},ref:this.catchPopoverElement,hidden:!this.state._show},(0,i.h)("div",{key:"57c5027c81f48377698c2e83a0437f7096e3f2b2",class:`arrow ${this.state._align}`,ref:this.catchArrowElement}),(0,i.h)("slot",{key:"4a353c9f9ff9dad823e92b583be96c6fe45b3eb6"})))}validateAlign(e){(0,a.a)(this,e)}validateShow(e){(0,r.v)(this,e),e&&this.showPopover()}componentWillLoad(){this.validateAlign(this._align),this.validateShow(this._show)}static get watchers(){return{_align:["validateAlign"],_show:["validateShow"]}}};l.style="/*\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    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-popover {\n    height: 0;\n    position: absolute;\n  }\n  .kol-popover .popover {\n    background-color: #fff;\n    min-height: max-content;\n    min-width: max-content;\n    opacity: 0;\n    position: absolute;\n  }\n  .kol-popover .show {\n    animation: 0.3s ease-in forwards fadeInOpacity;\n  }\n  .kol-popover .disappear {\n    animation: 0.3s ease-in backwards fadeInOpacity;\n  }\n  .kol-popover .arrow {\n    background-color: inherit;\n    height: var(--font-size);\n    position: absolute;\n    rotate: 0.125turn;\n    width: var(--font-size);\n    z-index: -1;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}"},7881:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(7238);const o=(e,n,t)=>{(0,i.b)(e,"_show",n,t)}}}]);