@public-ui/sample-react 3.0.0-rc.3 → 3.0.0-rc.4

package/dist/8177.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8177.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8177],{9248:(e,n,t)=>{t.d(n,{K:()=>r});var i=t(4600),o=t(5630),a=t(9060),l=t(3532),s=t(9339);const r=e=>{const{class:n,msg:t,required:r,disabled:d,touched:c,readonly:h,ariaDescribedBy:u,hideLabel:p,label:m,suggestions:_,value:b}=e,f=(0,i._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),v=(0,s.c)(t,c),g={"kol-input--disabled":Boolean(d),"kol-input--required":Boolean(r),"kol-input--touched":Boolean(c),"kol-input--readonly":Boolean(h),[`kol-input--${(null==t?void 0:t.type)||"error"}`]:v},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",g,n),required:r,disabled:d,readonly:h,type:"text",list:_?`${f.id}-list`:void 0},(0,l.d)({ariaDescribedBy:u,hideLabel:p,label:m})),f);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},y,{value:b})),_)}},7260:(e,n,t)=>{t.d(n,{K:()=>d,a:()=>r});var i=t(4600),o=t(5630),a=t(3532),l=t(9248),s=t(9339);const r=e=>{var{id:n,suggestions:t}=e,a=(0,i._)(e,["id","suggestions"]);return t?(0,o.h)("datalist",Object.assign({id:`${n}-list`},a),t.map((e=>(0,o.h)("option",{value:e})))):null},d=e=>{var{state:n}=e,t=(0,i._)(e,["state"]);return(0,o.h)(l.K,Object.assign({},function(e){const{ariaDescribedBy:n}=(0,a.g)(e),t={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:n};return"_type"in e&&(t.type=e._type),"_value"in e&&(t.value=e._value),"_required"in e&&(t.required=e._required),"_maxLength"in e&&(t.maxlength=e._maxLength),"_placeholder"in e&&(t.placeholder=e._placeholder),"_autoComplete"in e&&(t.autoComplete=e._autoComplete),"_spellCheck"in e&&(t.spellcheck=e._spellCheck),"_pattern"in e&&(t.pattern=e._pattern),"_readOnly"in e&&(t.readonly=e._readOnly),"_min"in e&&(t.min=e._min),"_max"in e&&(t.max=e._max),"_step"in e&&(t.step=e._step),"_multiple"in e&&(t.multiple=e._multiple),"_checked"in e&&(t.checked=e._checked),"_indeterminate"in e&&(t.indeterminate=e._indeterminate),"_touched"in e&&(t.touched=e._touched),"_msg"in e&&(t.msg=(0,s.a)(e._msg)),"_suggestions"in e&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(t.suggestions=(0,o.h)(r,{id:e._id,suggestions:e._suggestions})),t}(n),t))}},8177:(e,n,t)=>{t.r(n),t.d(n,{kol_input_file:()=>p});var i=t(5630),o=t(9060),a=t(4879),l=t(6100),s=t(5800),r=t(1559),d=t(7260),c=t(3532),h=(e,n,t)=>new Promise(((i,o)=>{var a=e=>{try{s(t.next(e))}catch(e){o(e)}},l=e=>{try{s(t.throw(e))}catch(e){o(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(a,l);s((t=t.apply(e,n)).next())}));class u extends l.I{constructor(e,n,t){super(e,n,t),this.component=e}validateAccept(e){(0,s.i)(this.component,"_accept",e)}validateMultiple(e){(0,s.b)(this.component,"_multiple",e)}validateRequired(e){(0,s.b)(this.component,"_required",e)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required)}}const p=class{getValue(){return h(this,null,(function*(){var e;return null===(e=this.inputRef)||void 0===e?void 0:e.files}))}kolFocus(){return h(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}getFormFieldProps(){return{state:this.state,class:(0,o.c)("kol-input-file","file"),tooltipAlign:this._tooltipAlign,onClick:()=>{var e;return null===(e=this.inputRef)||void 0===e?void 0:e.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"file",accept:this.state._accept,multiple:this.state._multiple},this.controller.onFacade),{onChange:this.onChange,onInput:this.onInput,onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1}})}render(){return(0,i.h)(c.K,Object.assign({key:"774da71f9d5ccca55974d83094375760754fbac9"},this.getFormFieldProps()),(0,i.h)(r.K,{key:"b36298bca849732dc75f597be932125683d13e46",state:this.state},(0,i.h)(d.K,Object.assign({key:"6f427984e8d4461886a8421fc8e77670c260074b"},this.getInputProps()))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onChange=e=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const n=this.inputRef.files;this.controller.onFacade.onChange(e,n),this.controller.setFormAssociatedValue(n)}},this.onInput=e=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const n=this.inputRef.files;this.controller.onFacade.onInput(e,!1,n)}},this._accept=void 0,this._accessKey=void 0,this._disabled=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this.state={_hideError:!1,_id:`id-${(0,a.n)()}`,_label:""},this.inputHasFocus=!1,this.controller=new u(this,"file",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccept(e){this.controller.validateAccept(e)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateDisabled(e){this.controller.validateDisabled(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)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"]}}};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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\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  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    cursor: pointer;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    height: calc(44rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n}"}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8177],{375:(e,n,t)=>{t.d(n,{K:()=>a});var i=t(6783),o=t(7662);const a=e=>{const{class:n,style:t,icons:a,label:l,onClick:s}=e;return(0,i.h)(o.d,{class:n,style:t,onClick:s,_icons:a,_label:l})}},3163:(e,n,t)=>{t.d(n,{K:()=>r});var i=t(4600),o=t(6783),a=t(9060),l=t(8625),s=t(5650);const r=e=>{const{class:n,msg:t,required:r,disabled:c,touched:d,readonly:h,ariaDescribedBy:u,hideLabel:p,label:m,suggestions:b,value:f}=e,_=(0,i._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),v=(0,s.c)(t,d),g={"kol-input--disabled":Boolean(c),"kol-input--required":Boolean(r),"kol-input--touched":Boolean(d),"kol-input--readonly":Boolean(h),[`kol-input--${(null==t?void 0:t.type)||"error"}`]:v},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",g,n),required:r,disabled:c,readonly:h,type:"text",list:b?`${_.id}-list`:void 0},(0,l.d)({ariaDescribedBy:u,hideLabel:p,label:m})),_);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},y,{value:f})),b)}},7146:(e,n,t)=>{t.d(n,{K:()=>c,a:()=>r});var i=t(4600),o=t(6783),a=t(8625),l=t(3163),s=t(5650);const r=e=>{var{id:n,suggestions:t}=e,a=(0,i._)(e,["id","suggestions"]);return t?(0,o.h)("datalist",Object.assign({id:`${n}-list`},a),t.map((e=>(0,o.h)("option",{value:e})))):null},c=e=>{var{state:n,customSuggestions:t}=e,c=(0,i._)(e,["state","customSuggestions"]);return(0,o.h)(l.K,Object.assign({},function(e,n){const{ariaDescribedBy:t}=(0,a.g)(e),i={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:t};return"_type"in e&&(i.type=e._type),"_value"in e&&(i.value=e._value),"_required"in e&&(i.required=e._required),"_maxLength"in e&&(i.maxlength=e._maxLength),"_placeholder"in e&&(i.placeholder=e._placeholder),"_autoComplete"in e&&(i.autoComplete=e._autoComplete),"_spellCheck"in e&&(i.spellcheck=e._spellCheck),"_pattern"in e&&(i.pattern=e._pattern),"_readOnly"in e&&(i.readonly=e._readOnly),"_min"in e&&(i.min=e._min),"_max"in e&&(i.max=e._max),"_step"in e&&(i.step=e._step),"_multiple"in e&&(i.multiple=e._multiple),"_checked"in e&&(i.checked=e._checked),"_indeterminate"in e&&(i.indeterminate=e._indeterminate),"_touched"in e&&(i.touched=e._touched),"_msg"in e&&(i.msg=(0,s.a)(e._msg)),"_suggestions"in e&&!n&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(i.suggestions=(0,o.h)(r,{id:e._id,suggestions:e._suggestions})),i}(n,t),c))}},5363:(e,n,t)=>{t.d(n,{I:()=>x,K:()=>k,a:()=>y});var i=t(6783),o=t(2587),a=t(665),l=t(4600),s=t(7662),r=t(375),c=t(9060),d=t(5650),h=t(8625),u=t(8973),p=t(5800),m=t(608);const b=(e,n)=>{var{position:t="start",class:o}=e,a=(0,l._)(e,["position","class"]);const s="kol-input-container__adornment",r=`${s}--${t}`;return(0,i.h)("div",Object.assign({class:(0,c.c)(s,r,o)},a),n)};function f(e){return!!e&&(Array.isArray(e)?e.length>0:Boolean(e))}const _=(e,n)=>{var{class:t}=e,o=(0,l._)(e,["class"]);return(0,i.h)("div",Object.assign({class:(0,c.c)("kol-input-container__container",t)},o),n)},v=(e,n)=>{const{class:t,startAdornment:o,endAdornment:a,disabled:s,msg:r,touched:h,containerProps:u,startAdornmentProps:p,endAdornmentProps:m}=e,v=(0,l._)(e,["class","startAdornment","endAdornment","disabled","msg","touched","containerProps","startAdornmentProps","endAdornmentProps"]),g=(0,d.c)(r,h),y={"kol-input-container--disabled":s,[`kol-input-container--${(null==r?void 0:r.type)||"error"}`]:g},k=Object.assign({class:(0,c.c)("kol-input-container",y,t)},v);return f(o)||f(a)?(0,i.h)("div",Object.assign({},k),(0,i.h)(b,Object.assign({},p,{position:"start"}),o),(0,i.h)(_,Object.assign({},u),n),(0,i.h)(b,Object.assign({},m,{position:"end"}),a)):(0,i.h)("div",Object.assign({},k),(0,i.h)(_,Object.assign({},u),n))},g=e=>{const{label:n,icons:t,hideLabel:o,disabled:a,onClick:r}=e,c=(0,l._)(e,["label","icons","hideLabel","disabled","onClick"]);return(0,i.h)(s.a,Object.assign({tabindex:0,_label:n,_disabled:a,_icons:t,_hideLabel:o,_on:{onClick:r}},c))},y=e=>{const{componentName:n="button",label:t,icon:o,onClick:a}=e,s=(0,l._)(e,["componentName","label","icon","onClick"]),c="button"===n?g:r.K;return(0,i.h)(c,Object.assign({label:t||"",hideLabel:!0,icons:`codicon codicon-${o}`,onClick:a},s))},k=({state:e,endAdornment:n},t)=>{const{icons:l,smartButton:s,disabled:r,msg:c,touched:h}=function(e){let n,t;return"_icons"in e&&(n=e._icons),"_smartButton"in e&&(t=e._smartButton),{icons:n,smartButton:t,disabled:e._disabled,msg:(0,d.a)(e._msg),touched:e._touched}}(e);let u=null==l?void 0:l.left;(0,o.i)(u)&&(u={icon:u});let p=null==l?void 0:l.right;(0,o.i)(p)&&(p={icon:p});const m=[],b=[];return n&&(Array.isArray(n)?b.push(...n):b.push(n)),u&&m.push((0,i.h)(y,Object.assign({componentName:"icon"},(0,a.i)(u)?u:{}))),(0,a.i)(s)&&b.push((0,i.h)(y,Object.assign({componentName:"button"},s,{hideLabel:!0,disabled:r}))),p&&b.push((0,i.h)(y,Object.assign({componentName:"icon"},(0,a.i)(p)?p:{}))),(0,i.h)(v,{disabled:r,msg:c,touched:h,startAdornment:m,endAdornment:b},t)},w=(e,n)=>{const t=e;"object"==typeof t&&null!==t&&((0,m.i)(t.right,1)&&(t.right={icon:t.right}),(0,m.i)(t.left,1)&&(t.left={icon:t.left}),n.set("_icons",t))};class x extends h.I{constructor(e,n,t){super(e,n,t),this.component=e}validateIcons(e){(0,p.o)(e,(()=>{try{e=(0,p.p)(e)}catch(e){}(0,p.w)(this.component,"_icons",(e=>"object"==typeof e&&null!==e&&((0,m.i)(e.left,1)||(0,u.i)(e.left)||(0,m.i)(e.right,1)||(0,u.i)(e.right))),new Set(["KoliBriHorizontalIcon"]),e,{hooks:{beforePatch:w},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcons(this.component._icons)}}},8973:(e,n,t)=>{t.d(n,{i:()=>l,v:()=>s});var i=t(5800),o=t(608);const a=(e,n,t)=>{(0,o.b)(t)?e[n]=t:(0,o.i)(t,1)&&(e[n]={icon:t})},l=e=>"object"==typeof e&&null!==e&&(void 0===e.style||(0,o.a)(e.style))&&(void 0===e.label||(0,o.i)(e.label))&&(0,o.i)(e.icon,1),s=(e,n,t={})=>{(0,i.o)(n,(()=>{var s;try{n=(0,i.p)(n)}catch(e){}(0,i.w)(e,"_icons",(e=>{const n="object"==typeof e&&null!==e&&0===Object.keys(e).length;return null===e||n||(0,o.i)(e,1)||"object"==typeof e&&null!==e&&((0,o.i)(e.left,1)||l(e.left)||(0,o.i)(e.right,1)||l(e.right)||(0,o.i)(e.top,1)||l(e.top)||(0,o.i)(e.bottom,1)||l(e.bottom))}),new Set(["KoliBriIcon"]),n,Object.assign(Object.assign({},t),{defaultValue:{},hooks:{afterPatch:null===(s=t.hooks)||void 0===s?void 0:s.afterPatch,beforePatch:(e,n,i,l)=>{var s,r;"function"==typeof(null===(s=t.hooks)||void 0===s?void 0:s.beforePatch)&&(null===(r=t.hooks)||void 0===r||r.beforePatch(e,n,i,l)),(e=>{var n,t,i;if(null===(n=e.nextState)||void 0===n?void 0:n.has("_icons")){const n=null===(t=e.nextState)||void 0===t?void 0:t.get("_icons");null===(i=e.nextState)||void 0===i||i.set("_icons",(e=>{let n={};return(0,o.i)(e,1)?n={left:{icon:e}}:"object"==typeof e&&null!==e&&(a(n,"top",e.top),a(n,"right",e.right),a(n,"bottom",e.bottom),a(n,"left",e.left)),n})(n))}})(i)}}}))}))}},665:(e,n,t)=>{function i(e){var n=typeof e;return null!=e&&("object"==n||"function"==n)}t.d(n,{i:()=>i})},8177:(e,n,t)=>{t.r(n),t.d(n,{kol_input_file:()=>u});var i=t(6783),o=t(9060),a=t(7336),l=t(5363),s=t(5800),r=t(7146),c=t(8625),d=(e,n,t)=>new Promise(((i,o)=>{var a=e=>{try{s(t.next(e))}catch(e){o(e)}},l=e=>{try{s(t.throw(e))}catch(e){o(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(a,l);s((t=t.apply(e,n)).next())}));class h extends l.I{constructor(e,n,t){super(e,n,t),this.component=e}validateAccept(e){(0,s.i)(this.component,"_accept",e)}validateMultiple(e){(0,s.b)(this.component,"_multiple",e)}validateRequired(e){(0,s.b)(this.component,"_required",e)}componentWillLoad(){super.componentWillLoad(),this.validateAccept(this.component._accept),this.validateMultiple(this.component._multiple),this.validateRequired(this.component._required)}}const u=class{getValue(){return d(this,null,(function*(){var e;return null===(e=this.inputRef)||void 0===e?void 0:e.files}))}kolFocus(){return d(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}getFormFieldProps(){return{state:this.state,class:(0,o.c)("kol-input-file","file"),tooltipAlign:this._tooltipAlign,onClick:()=>{var e;return null===(e=this.inputRef)||void 0===e?void 0:e.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"file",accept:this.state._accept,multiple:this.state._multiple},this.controller.onFacade),{onChange:this.onChange,onInput:this.onInput,onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1}})}render(){return(0,i.h)(c.K,Object.assign({key:"3c2a19696312a817df72cf8aba4e02ed60eb6768"},this.getFormFieldProps()),(0,i.h)(l.K,{key:"783aaf2dac305d6715be4e6d6cef68543d07b9b8",state:this.state},(0,i.h)(r.K,Object.assign({key:"e9c64850b8109420d3bb513ccacd19f77cde2f24"},this.getInputProps()))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onChange=e=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const n=this.inputRef.files;this.controller.onFacade.onChange(e,n),this.controller.setFormAssociatedValue(n)}},this.onInput=e=>{if(this.inputRef instanceof HTMLInputElement&&"file"===this.inputRef.type){const n=this.inputRef.files;this.controller.onFacade.onInput(e,!1,n)}},this._accept=void 0,this._accessKey=void 0,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this.state={_hideMsg:!1,_id:`id-${(0,a.n)()}`,_label:""},this.inputHasFocus=!1,this.controller=new h(this,"file",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccept(e){this.controller.validateAccept(e)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideMsg(e){this.controller.validateHideMsg(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)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_accept:["validateAccept"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_required:["validateRequired"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"]}}};u.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\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  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    cursor: pointer;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    height: calc(44rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n}"}}}]);

package/dist/8212.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8212.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8212],{9246:(t,e,n)=>{n.d(e,{a:()=>a,v:()=>l});var o=n(5800);const a=(t,e,n)=>{(0,o.w)(t,e,(t=>"string"==typeof t&&i.includes(t)),new Set(i),n,{defaultValue:"top"})},i=["left","right","top","bottom"],l=(t,e)=>{a(t,"_align",e)}},9060:(t,e,n)=>{function o(t){var e,n,a="";if("string"==typeof t||"number"==typeof t)a+=t;else if("object"==typeof t)if(Array.isArray(t)){var i=t.length;for(e=0;e<i;e++)t[e]&&(n=o(t[e]))&&(a&&(a+=" "),a+=n)}else for(n in t)t[n]&&(a&&(a+=" "),a+=n);return a}function a(){for(var t,e,n=0,a="",i=arguments.length;n<i;n++)(t=arguments[n])&&(e=o(t))&&(a&&(a+=" "),a+=e);return a}n.d(e,{c:()=>a})},3584:(t,e,n)=>{n.d(e,{t:()=>i});var o=n(8461),a=n(5687);let i=(t,e)=>{var n;return(null!==(n=(0,o.g)())&&void 0!==n?n:(0,o.i)("de")).translate(t,e)};"test"===a.p&&(i=t=>t)},8212:(t,e,n)=>{n.r(e),n.d(e,{kol_tabs:()=>f});var o=n(5630),a=n(3584),i=n(7767),l=n(8231),s=n(9060),r=n(5800),d=n(9246),c=n(1074),h=n(1732);const b=["select-automatic","select-manual"];var u,p;(p=u||(u={})).ArrowDown="ArrowDown",p.ArrowLeft="ArrowLeft",p.ArrowRight="ArrowRight",p.ArrowUp="ArrowUp",p.Enter="Enter",p.Space=" ";const f=class{constructor(t){(0,o.r)(this,t),this.onCreateLabel=`${(0,a.t)("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,e,n=1)=>{const o=e+n;return o<t.length?t[o]._disabled?this.nextPossibleTabIndex(t,e,n+1):o:e},this.prevPossibleTabIndex=(t,e,n=1)=>{const o=e-n;return o>=0?t[o]._disabled?this.prevPossibleTabIndex(t,e,n+1):o:e},this.onKeyDown=t=>{switch(t.key){case u.ArrowRight:this.goToNextTab(t);break;case u.ArrowLeft:this.goToPreviousTab(t);break;case u.Space:case u.Enter:this.activateFocusedTab(t)}},this.onClickSelect=(t,e)=>{this.selectNextTabEvent(t,e)},this.onMouseDown=t=>{t.preventDefault()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,e,n=!0,o)=>{if(t>e.length-1&&(t=e.length-1),t<0&&(t=0),Array.isArray(e)&&e[t]&&e[t]._disabled){if(!0===n){if(t<e.length-1)return this.selectNextNotDisabledTab(t+1,e,!0,o||t);t=o||t,n=!1}if(!1===n){if(t>0)return this.selectNextNotDisabledTab(t-1,e,!1,o||t);(0,r.j)("[KolTabs] All tabs are disabled, and therefore no tab can be displayed.")}}return t},this.syncSelectedAndTabs=(t,e,n,o)=>{let a,i;a="_selected"===o?t:this.state._selected,i="_tabs"===o?t:this.state._tabs,i.length>0&&e.set("_selected",this.selectNextNotDisabledTab(a,i))},this.handleTabPanels=()=>{var t,e,n;if(this.tabPanelHost instanceof HTMLDivElement)for(let o=this.tabPanelHost.children.length;o<this.state._tabs.length;o++){const a=document.createElement("div");a.setAttribute("class","kol-tab__panel"),a.setAttribute("aria-labelledby",`${this.state._label.replace(/\s/g,"-")}-tab-${o}`),a.setAttribute("id",`tabpanel-${o}`),a.setAttribute("role","tabpanel"),a.setAttribute("hidden","");const i=document.createElement("slot");i.setAttribute("name",`tabpanel-slot-${o}`),a.appendChild(i),this.tabPanelHost.appendChild(a),(null===(t=this.host)||void 0===t?void 0:t.children)instanceof HTMLCollection&&(null===(e=this.host)||void 0===e?void 0:e.children[o])&&(null===(n=this.host)||void 0===n||n.children[o].setAttribute("slot",`tabpanel-slot-${o}`))}},this.onCreate=t=>{var e,n;t.preventDefault(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onCreate)&&(null===(n=this.state._on)||void 0===n||n.onCreate(t))},this.onBlur=()=>{this.currentFocusIndex=void 0},this._align="top",this._behavior=void 0,this._label=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this.state={_align:"top",_label:"",_selected:0,_tabs:[]}}getCurrentFocusIndex(){return"number"==typeof this.currentFocusIndex?this.currentFocusIndex:this.state._selected}getKeyboardTabChangeMode(){return"select-manual"===this._behavior?"selectFocusOnly":"activateCompletely"}goToNextTab(t){const e=this.nextPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(t,e,this.getKeyboardTabChangeMode())}goToPreviousTab(t){const e=this.prevPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(t,e,this.getKeyboardTabChangeMode())}activateFocusedTab(t){"number"==typeof this.currentFocusIndex&&this.onSelect(t,this.currentFocusIndex)}selectNextTabEvent(t,e,n="activateCompletely"){var o,a;this.currentFocusIndex=e,this.focusTabById(e),"activateCompletely"===n&&(this._selected=e,null===(a=null===(o=this.state._tabs[e]._on)||void 0===o?void 0:o.onSelect)||void 0===a||a.call(o,t,e),this.onSelect(t,e))}renderButtonGroup(){return(0,o.h)("div",{"aria-label":this.state._label,class:"kol-tabs__button-group",role:"tablist",onKeyDown:this.onKeyDown,onBlur:this.onBlur},this.state._tabs.map(((t,e)=>(0,o.h)(i.a,{_disabled:t._disabled,_icons:t._icons,_hideLabel:t._hideLabel,_label:t._label,_on:this.callbacks,_tabIndex:this.state._selected===e?0:-1,_tooltipAlign:t._tooltipAlign,_variant:this.state._selected===e?"custom":void 0,_customClass:this.state._selected===e?"selected":void 0,_ariaControls:`tabpanel-${e}`,_ariaSelected:this.state._selected===e,_id:`${this.state._label.replace(/\s/g,"-")}-tab-${e}`,_role:"tab",_value:e}))),this.showCreateTab&&(0,o.h)(i.a,{class:"kol-tabs_button-create",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return(0,o.h)("div",{key:"536925b9b7b5b4b533e40979c6336c1244846be5",ref:t=>{this.tabPanelsElement=t},class:(0,s.c)("kol-tabs",`kol-tabs--align-${this.state._align}`)},this.renderButtonGroup(),(0,o.h)("div",{key:"29aacb950fa25e38b2480b03c1b1cb3d6d554036",class:"kol-tabs__content",ref:this.catchTabPanelHost}))}validateAlign(t){(0,d.v)(this,t)}validateBehavior(t){((t,e)=>{(0,r.w)(t,"_behavior",(t=>"string"==typeof t&&b.includes(t)),new Set([`KoliBriTabBehavior {${b.join(", ")}`]),e)})(this,t)}validateLabel(t){(0,c.v)(this,t,{required:!0})}validateOn(t){if("object"==typeof t&&null!==t){(0,r.f)("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onCreate&&"object"!=typeof t.onCreate||("object"==typeof t.onCreate?("string"==typeof t.onCreate.label&&t.onCreate.label.length>0?this.onCreateLabel=t.onCreate.label:h.L.debug("[KolTabs] The label text for New in {\n  onCreate: {\n    label: string (!),\n    callback: Function\n  }\n} is not set correctly."),"function"==typeof t.onCreate.callback?e.onCreate=t.onCreate.callback:h.L.debug("[KolTabs] The onCreate callback function for New in {\n  onCreate: {\n    label: string,\n    callback: Function (!)\n  }\n} is not set correctly.")):e.onCreate=t.onCreate,this.showCreateTab="function"==typeof e.onCreate),"function"==typeof t.onSelect&&(e.onSelect=t.onSelect),(0,r.s)(this,"_on",e)}}validateSelected(t){(0,r.k)(this,"_selected",t,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(t){(0,r.g)(this,"_tabs",(t=>"object"==typeof t&&null!==t&&"string"==typeof t._label&&t._label.length>0),t,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs}}),(0,r.h)("KolTabs",this.state._tabs.length)}componentWillLoad(){this.validateAlign(this._align),this.validateLabel(this._label),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs),this.validateBehavior(this._behavior)}componentDidRender(){if(this.handleTabPanels(),this.tabPanelHost instanceof HTMLDivElement)for(let t=0;t<this.tabPanelHost.children.length;t++)t!==this.state._selected?this.tabPanelHost.children[t].setAttribute("hidden",""):this.tabPanelHost.children[t].removeAttribute("hidden")}focusTabById(t){if(this.tabPanelsElement){const e=(0,r.v)(`button#${this.state._label.replace(/\s/g,"-")}-tab-${t}`,this.tabPanelsElement);null==e||e.focus()}}onSelect(t,e){var n,o;null===(o=null===(n=this._on)||void 0===n?void 0:n.onSelect)||void 0===o||o.call(n,t,e),this.host&&(0,l.d)(this.host,l.K.select,e),this.focusTabById(e)}get host(){return(0,o.g)(this)}static get watchers(){return{_align:["validateAlign"],_behavior:["validateBehavior"],_label:["validateLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"]}}};f.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\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  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-tabs {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    display: var(--display);\n    grid-template-rows: var(--grid-template-rows);\n    grid-template-columns: var(--grid-template-columns);\n  }\n  .kol-tabs--align-right {\n    --display: grid;\n    --grid-template-columns: 1fr auto;\n    --button-group-flex-direction: column;\n    --button-group-order: 2;\n  }\n  .kol-tabs--align-left {\n    --display: grid;\n    --grid-template-columns: auto 1fr;\n    --button-group-flex-direction: column;\n    --button-group-order: 0;\n  }\n  .kol-tabs--align-bottom {\n    --display: grid;\n    --grid-template-rows: 1fr auto;\n    --button-group-order: 2;\n  }\n  .kol-tabs__tabs-align-top {\n    --display: grid;\n    --grid-template-rows: auto 1fr;\n    --button-group-order: 0;\n  }\n  .kol-tabs__content {\n    overflow: auto;\n  }\n  .kol-tabs__button-group {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: var(--button-group-flex-direction);\n    order: var(--button-group-order);\n  }\n  .kol-tabs__button-group .kol-button {\n    border-bottom-color: transparent;\n    border-bottom-style: solid;\n    display: block;\n  }\n  .kol-tabs__panel {\n    height: 100%;\n  }\n}"}},1074:(t,e,n)=>{n.d(e,{a:()=>h,b:()=>s,c:()=>r,h:()=>a,v:()=>c});var o=n(5800);const a=[0,1,2,3,4,5,6],i=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(i))||void 0===e?void 0:e.length)||0}(t)>=e}function r(t){return l.test(t)}const d=new Set(["string"]),c=(t,e,n={})=>{(0,o.w)(t,"_label",(t=>"string"==typeof t),d,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,n,a,i)=>{var l,d;"function"==typeof(null===(l=t.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(d=t.hooks)||void 0===d||d.afterPatch(e,n,a,i)),"string"==typeof e&&!1===s(e,3)&&!1===r(e)&&(0,o.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,o.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(n))},h=c},5687:(t,e,n)=>{n.d(e,{b:()=>l,h:()=>a,p:()=>o,s:()=>i});let o="development";try{o="production"}catch(t){o="production"}const a=(t,e,n)=>{if(t&&e&&"string"==typeof n){const o=t.querySelector(`[slot="${n}"]`);o&&e.appendChild(o)}},i=t=>""===t,l=(t,e)=>t||e||""}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8212],{9246:(t,e,n)=>{n.d(e,{a:()=>a,v:()=>l});var o=n(5800);const a=(t,e,n)=>{(0,o.w)(t,e,(t=>"string"==typeof t&&i.includes(t)),new Set(i),n,{defaultValue:"top"})},i=["left","right","top","bottom"],l=(t,e)=>{a(t,"_align",e)}},9060:(t,e,n)=>{function o(t){var e,n,a="";if("string"==typeof t||"number"==typeof t)a+=t;else if("object"==typeof t)if(Array.isArray(t)){var i=t.length;for(e=0;e<i;e++)t[e]&&(n=o(t[e]))&&(a&&(a+=" "),a+=n)}else for(n in t)t[n]&&(a&&(a+=" "),a+=n);return a}function a(){for(var t,e,n=0,a="",i=arguments.length;n<i;n++)(t=arguments[n])&&(e=o(t))&&(a&&(a+=" "),a+=e);return a}n.d(e,{c:()=>a})},3584:(t,e,n)=>{n.d(e,{t:()=>i});var o=n(8461),a=n(5687);let i=(t,e)=>{var n;return(null!==(n=(0,o.g)())&&void 0!==n?n:(0,o.i)("de")).translate(t,e)};"test"===a.p&&(i=t=>t)},8212:(t,e,n)=>{n.r(e),n.d(e,{kol_tabs:()=>f});var o=n(6783),a=n(3584),i=n(7662),l=n(8231),s=n(9060),r=n(5800),d=n(9246),c=n(1074),h=n(1732);const b=["select-automatic","select-manual"];var u,p;(p=u||(u={})).ArrowDown="ArrowDown",p.ArrowLeft="ArrowLeft",p.ArrowRight="ArrowRight",p.ArrowUp="ArrowUp",p.Enter="Enter",p.Space=" ";const f=class{constructor(t){(0,o.r)(this,t),this.onCreateLabel=`${(0,a.t)("kol-new")} …`,this.showCreateTab=!1,this.nextPossibleTabIndex=(t,e,n=1)=>{const o=e+n;return o<t.length?t[o]._disabled?this.nextPossibleTabIndex(t,e,n+1):o:e},this.prevPossibleTabIndex=(t,e,n=1)=>{const o=e-n;return o>=0?t[o]._disabled?this.prevPossibleTabIndex(t,e,n+1):o:e},this.onKeyDown=t=>{switch(t.key){case u.ArrowRight:this.goToNextTab(t);break;case u.ArrowLeft:this.goToPreviousTab(t);break;case u.Space:case u.Enter:this.activateFocusedTab(t)}},this.onClickSelect=(t,e)=>{this.selectNextTabEvent(t,e)},this.onMouseDown=t=>{t.preventDefault()},this.callbacks={onClick:this.onClickSelect,onMouseDown:this.onMouseDown},this.catchTabPanelHost=t=>{this.tabPanelHost=t},this.selectNextNotDisabledTab=(t,e,n=!0,o)=>{if(t>e.length-1&&(t=e.length-1),t<0&&(t=0),Array.isArray(e)&&e[t]&&e[t]._disabled){if(!0===n){if(t<e.length-1)return this.selectNextNotDisabledTab(t+1,e,!0,o||t);t=o||t,n=!1}if(!1===n){if(t>0)return this.selectNextNotDisabledTab(t-1,e,!1,o||t);(0,r.j)("[KolTabs] All tabs are disabled, and therefore no tab can be displayed.")}}return t},this.syncSelectedAndTabs=(t,e,n,o)=>{let a,i;a="_selected"===o?t:this.state._selected,i="_tabs"===o?t:this.state._tabs,i.length>0&&e.set("_selected",this.selectNextNotDisabledTab(a,i))},this.handleTabPanels=()=>{var t,e,n;if(this.tabPanelHost instanceof HTMLDivElement)for(let o=this.tabPanelHost.children.length;o<this.state._tabs.length;o++){const a=document.createElement("div");a.setAttribute("class","kol-tab__panel"),a.setAttribute("aria-labelledby",`${this.state._label.replace(/\s/g,"-")}-tab-${o}`),a.setAttribute("id",`tabpanel-${o}`),a.setAttribute("role","tabpanel"),a.setAttribute("hidden","");const i=document.createElement("slot");i.setAttribute("name",`tabpanel-slot-${o}`),a.appendChild(i),this.tabPanelHost.appendChild(a),(null===(t=this.host)||void 0===t?void 0:t.children)instanceof HTMLCollection&&(null===(e=this.host)||void 0===e?void 0:e.children[o])&&(null===(n=this.host)||void 0===n||n.children[o].setAttribute("slot",`tabpanel-slot-${o}`))}},this.onCreate=t=>{var e,n;t.preventDefault(),"function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onCreate)&&(null===(n=this.state._on)||void 0===n||n.onCreate(t))},this.onBlur=()=>{this.currentFocusIndex=void 0},this._align="top",this._behavior=void 0,this._label=void 0,this._on=void 0,this._selected=0,this._tabs=void 0,this.state={_align:"top",_label:"",_selected:0,_tabs:[]}}getCurrentFocusIndex(){return"number"==typeof this.currentFocusIndex?this.currentFocusIndex:this.state._selected}getKeyboardTabChangeMode(){return"select-manual"===this._behavior?"selectFocusOnly":"activateCompletely"}goToNextTab(t){const e=this.nextPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(t,e,this.getKeyboardTabChangeMode())}goToPreviousTab(t){const e=this.prevPossibleTabIndex(this.state._tabs,this.getCurrentFocusIndex());this.selectNextTabEvent(t,e,this.getKeyboardTabChangeMode())}activateFocusedTab(t){"number"==typeof this.currentFocusIndex&&this.onSelect(t,this.currentFocusIndex)}selectNextTabEvent(t,e,n="activateCompletely"){var o,a;this.currentFocusIndex=e,this.focusTabById(e),"activateCompletely"===n&&(this._selected=e,null===(a=null===(o=this.state._tabs[e]._on)||void 0===o?void 0:o.onSelect)||void 0===a||a.call(o,t,e),this.onSelect(t,e))}renderButtonGroup(){return(0,o.h)("div",{"aria-label":this.state._label,class:"kol-tabs__button-group",role:"tablist",onKeyDown:this.onKeyDown,onBlur:this.onBlur},this.state._tabs.map(((t,e)=>(0,o.h)(i.a,{_disabled:t._disabled,_icons:t._icons,_hideLabel:t._hideLabel,_label:t._label,_on:this.callbacks,_tabIndex:this.state._selected===e?0:-1,_tooltipAlign:t._tooltipAlign,_variant:this.state._selected===e?"custom":void 0,_customClass:this.state._selected===e?"selected":void 0,_ariaControls:`tabpanel-${e}`,_ariaSelected:this.state._selected===e,_id:`${this.state._label.replace(/\s/g,"-")}-tab-${e}`,_role:"tab",_value:e}))),this.showCreateTab&&(0,o.h)(i.a,{class:"kol-tabs_button-create",_label:this.onCreateLabel,_on:{onClick:this.onCreate}}))}render(){return(0,o.h)("div",{key:"592fb62ac9fe48dbf63d7dfef9ce4e75406a2acf",ref:t=>{this.tabPanelsElement=t},class:(0,s.c)("kol-tabs",`kol-tabs--align-${this.state._align}`)},this.renderButtonGroup(),(0,o.h)("div",{key:"5102f215e596aabaa44212a86ca29b0224d58bf5",class:"kol-tabs__content",ref:this.catchTabPanelHost}))}validateAlign(t){(0,d.v)(this,t)}validateBehavior(t){((t,e)=>{(0,r.w)(t,"_behavior",(t=>"string"==typeof t&&b.includes(t)),new Set([`KoliBriTabBehavior {${b.join(", ")}`]),e)})(this,t)}validateLabel(t){(0,c.v)(this,t,{required:!0})}validateOn(t){if("object"==typeof t&&null!==t){(0,r.f)("[KolTabs] Prüfen, wie man auch einen EventCallback einzeln ändern kann.");const e={};"function"!=typeof t.onCreate&&"object"!=typeof t.onCreate||("object"==typeof t.onCreate?("string"==typeof t.onCreate.label&&t.onCreate.label.length>0?this.onCreateLabel=t.onCreate.label:h.L.debug("[KolTabs] The label text for New in {\n  onCreate: {\n    label: string (!),\n    callback: Function\n  }\n} is not set correctly."),"function"==typeof t.onCreate.callback?e.onCreate=t.onCreate.callback:h.L.debug("[KolTabs] The onCreate callback function for New in {\n  onCreate: {\n    label: string,\n    callback: Function (!)\n  }\n} is not set correctly.")):e.onCreate=t.onCreate,this.showCreateTab="function"==typeof e.onCreate),"function"==typeof t.onSelect&&(e.onSelect=t.onSelect),(0,r.s)(this,"_on",e)}}validateSelected(t){(0,r.k)(this,"_selected",t,{hooks:{beforePatch:this.syncSelectedAndTabs}})}validateTabs(t){(0,r.g)(this,"_tabs",(t=>"object"==typeof t&&null!==t&&"string"==typeof t._label&&t._label.length>0),t,void 0,{hooks:{beforePatch:this.syncSelectedAndTabs}}),(0,r.h)("KolTabs",this.state._tabs.length)}componentWillLoad(){this.validateAlign(this._align),this.validateLabel(this._label),this.validateOn(this._on),this.validateSelected(this._selected),this.validateTabs(this._tabs),this.validateBehavior(this._behavior)}componentDidRender(){if(this.handleTabPanels(),this.tabPanelHost instanceof HTMLDivElement)for(let t=0;t<this.tabPanelHost.children.length;t++)t!==this.state._selected?this.tabPanelHost.children[t].setAttribute("hidden",""):this.tabPanelHost.children[t].removeAttribute("hidden")}focusTabById(t){if(this.tabPanelsElement){const e=(0,r.v)(`button#${this.state._label.replace(/\s/g,"-")}-tab-${t}`,this.tabPanelsElement);null==e||e.focus()}}onSelect(t,e){var n,o;null===(o=null===(n=this._on)||void 0===n?void 0:n.onSelect)||void 0===o||o.call(n,t,e),this.host&&(0,l.d)(this.host,l.K.select,e),this.focusTabById(e)}get host(){return(0,o.g)(this)}static get watchers(){return{_align:["validateAlign"],_behavior:["validateBehavior"],_label:["validateLabel"],_on:["validateOn"],_selected:["validateSelected"],_tabs:["validateTabs"]}}};f.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\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  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-tabs {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    display: var(--display);\n    grid-template-rows: var(--grid-template-rows);\n    grid-template-columns: var(--grid-template-columns);\n  }\n  .kol-tabs--align-right {\n    --display: grid;\n    --grid-template-columns: 1fr auto;\n    --button-group-flex-direction: column;\n    --button-group-order: 2;\n  }\n  .kol-tabs--align-left {\n    --display: grid;\n    --grid-template-columns: auto 1fr;\n    --button-group-flex-direction: column;\n    --button-group-order: 0;\n  }\n  .kol-tabs--align-bottom {\n    --display: grid;\n    --grid-template-rows: 1fr auto;\n    --button-group-order: 2;\n  }\n  .kol-tabs__tabs-align-top {\n    --display: grid;\n    --grid-template-rows: auto 1fr;\n    --button-group-order: 0;\n  }\n  .kol-tabs__content {\n    overflow: auto;\n  }\n  .kol-tabs__button-group {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: var(--button-group-flex-direction);\n    order: var(--button-group-order);\n  }\n  .kol-tabs__button-group .kol-button {\n    border-bottom-color: transparent;\n    border-bottom-style: solid;\n    display: block;\n  }\n  .kol-tabs__panel {\n    height: 100%;\n  }\n}"}},1074:(t,e,n)=>{n.d(e,{a:()=>h,b:()=>s,c:()=>r,h:()=>a,v:()=>c});var o=n(5800);const a=[0,1,2,3,4,5,6],i=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(i))||void 0===e?void 0:e.length)||0}(t)>=e}function r(t){return l.test(t)}const d=new Set(["string"]),c=(t,e,n={})=>{(0,o.w)(t,"_label",(t=>"string"==typeof t),d,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,n,a,i)=>{var l,d;"function"==typeof(null===(l=t.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(d=t.hooks)||void 0===d||d.afterPatch(e,n,a,i)),"string"==typeof e&&!1===s(e,3)&&!1===r(e)&&(0,o.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,o.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(n))},h=c},5687:(t,e,n)=>{n.d(e,{b:()=>l,h:()=>a,p:()=>o,s:()=>i});let o="development";try{o="production"}catch(t){o="production"}const a=(t,e,n)=>{if(t&&e&&"string"==typeof n){const o=t.querySelector(`[slot="${n}"]`);o&&e.appendChild(o)}},i=t=>""===t,l=(t,e)=>t||e||""}}]);

package/dist/8243.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8243.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8243],{8101:(e,t,l)=>{l.d(t,{K:()=>h});var a=l(4600),o=l(5630),n=l(9060),s=l(3584),i=l(7767),r=l(3849);const c=({ariaLabel:e,icon:t})=>(0,o.h)(i.d,{class:"kol-alert__heading-icon",_label:e,_icons:t}),d=({type:e,label:t})=>{switch(e){case"error":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-error"),icon:"codicon codicon-error",label:t});case"info":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-info"),icon:"codicon codicon-info",label:t});case"warning":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-warning"),icon:"codicon codicon-warning",label:t});case"success":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-success"),icon:"codicon codicon-pass",label:t});default:return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-message"),icon:"codicon codicon-comment",label:t})}},h=(e,t)=>{var l,c;const{class:h={},type:v="default",variant:u="msg",label:b,hasCloser:_,alert:p,onAlertTimeout:f,onCloserClick:g,level:y}=e,k=(0,a._)(e,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);p&&((null===(l=navigator.userActivation)||void 0===l?void 0:l.hasBeenActive)&&(null===(c=null===navigator||void 0===navigator?void 0:navigator.vibrate)||void 0===c||c.call(navigator,[100,75,100,75,100])),setTimeout((()=>{null==f||f()}),1e4));const C=Object.assign({class:(0,n.c)("kol-alert",`kol-alert--${v}`,`kol-alert--${u}`,{"kol-alert--hasCloser":!!_},h),role:p?"alert":void 0},k);return(0,o.h)("div",Object.assign({},C),(0,o.h)("div",{class:"kol-alert__container"},(0,o.h)(d,{label:b,type:v}),(0,o.h)("div",{class:"kol-alert__container-content"},b?(0,o.h)(r.K,{class:"kol-alert__heading",level:y},b):null,"msg"===u&&(0,o.h)("div",{class:"kol-alert__content"},t)),_&&(0,o.h)(i.a,{class:"kol-alert__close-button close","data-testid":"alert-close-button",_ariaDescription:(null==b?void 0:b.trim())||"",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:(0,s.t)("kol-close-alert"),_on:{onClick:g},_tooltipAlign:"left"})),"card"===u&&(0,o.h)("div",{class:"kol-alert__content"},t))}},3849:(e,t,l)=>{l.d(t,{K:()=>d});var a=l(4600),o=l(5630),n=l(9060);const s=1;function i(e){return function(e){return e>=s&&e<=6}(e)?`h${e}`:"strong"}const r=(e,t)=>{var{class:l,level:r=s,variant:c}=e,d=(0,a._)(e,["class","level","variant"]);const h=i(r),v=c||h;return(0,o.h)(h,Object.assign({class:(0,n.c)("kol-headline",`kol-headline--${v}`,l)},d),t)},c=(e,t)=>{var{class:l,level:r=s}=e,c=(0,a._)(e,["class","level"]);const d=function(e){return 1===e?"span":i(e)}(r+1);return(0,o.h)(d,Object.assign({class:(0,n.c)("kol-headline kol-headline--group kol-headline--secondary",l)},c),t)},d=(e,t)=>{var{secondaryHeadline:l,level:i=s,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:v={}}=e,u=(0,a._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:i},u);if(!l)return(0,o.h)(r,Object.assign({class:(0,n.c)(d,"kol-headline--single")},b),t);const{class:_}=h,p=(0,a._)(h,["class"]),f=Object.assign({class:(0,n.c)("kol-heading-group",_)},p);return(0,o.h)("hgroup",Object.assign({},f),(0,o.h)(r,Object.assign({class:(0,n.c)(d,"kol-headline--group","kol-headline--primary")},b),t),(0,o.h)(c,Object.assign({level:i},v),l))}},9060:(e,t,l)=>{function a(e){var t,l,o="";if("string"==typeof e||"number"==typeof e)o+=e;else if("object"==typeof e)if(Array.isArray(e)){var n=e.length;for(t=0;t<n;t++)e[t]&&(l=a(e[t]))&&(o&&(o+=" "),o+=l)}else for(l in e)e[l]&&(o&&(o+=" "),o+=l);return o}function o(){for(var e,t,l=0,o="",n=arguments.length;l<n;l++)(e=arguments[l])&&(t=a(e))&&(o&&(o+=" "),o+=t);return o}l.d(t,{c:()=>o})},7419:(e,t,l)=>{l.d(t,{v:()=>o});var a=l(5800);const o=(e,t)=>{(0,a.b)(e,"_hasCloser",t)}},3584:(e,t,l)=>{l.d(t,{t:()=>n});var a=l(8461),o=l(5687);let n=(e,t)=>{var l;return(null!==(l=(0,a.g)())&&void 0!==l?l:(0,a.i)("de")).translate(e,t)};"test"===o.p&&(n=e=>e)},8243:(e,t,l)=>{l.r(t),l.d(t,{kol_alert_wc:()=>v});var a=l(5630),o=l(8228),n=l(8231),s=l(8101),i=l(5800),r=l(7419),c=l(1074);const d=["default","info","success","warning","error"],h=["card","msg"],v=class{constructor(e){(0,a.r)(this,e),this.close=()=>{var e,t;null===(t=null===(e=this._on)||void 0===e?void 0:e.onClose)||void 0===t||t.call(e,new Event("Close")),this.host&&(0,n.d)(this.host,n.K.close)},this.handleAlertTimeout=()=>{this.validateAlert(!1)},this.validateOnValue=e=>"object"==typeof e&&null!==e&&"function"==typeof e.onClose,this._alert=!1,this._hasCloser=!1,this._label=void 0,this._level=1,this._on=void 0,this._type="default",this._variant="msg",this.state={_level:1}}render(){const{_alert:e,_hasCloser:t,_label:l,_level:o,_type:n,_variant:i}=this.state,r={alert:e,hasCloser:t,label:l,level:o,type:n,variant:i,onCloserClick:this.close,onAlertTimeout:this.handleAlertTimeout};return(0,a.h)(s.K,Object.assign({key:"8d045b87e0ccf5ee926c8774da3d94bda07d9660"},r),(0,a.h)("slot",{key:"a665623f7355e2e30b728d37d3d9e59e9ad0f43f"}))}validateAlert(e){(0,i.b)(this,"_alert",e)}validateHasCloser(e){(0,r.v)(this,e)}validateLabel(e){(0,c.v)(this,e)}validateLevel(e){(0,o.w)(this,e)}validateOn(e){this.validateOnValue(e)&&(0,i.s)(this,"_on",{onClose:e.onClose})}validateType(e){(0,i.w)(this,"_type",(e=>"string"==typeof e&&d.includes(e)),new Set(`String {${d.join(", ")}`),e)}validateVariant(e){(0,i.w)(this,"_variant",(e=>"string"==typeof e&&h.includes(e)),new Set(`AlertVariant {${h.join(", ")}`),e)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateLabel(this._label),this.validateLevel(this._level),this.validateOn(this._on),this.validateType(this._type),this.validateVariant(this._variant)}get host(){return(0,a.g)(this)}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_type:["validateType"],_variant:["validateVariant"]}}}},1074:(e,t,l)=>{l.d(t,{a:()=>h,b:()=>i,c:()=>r,h:()=>o,v:()=>d});var a=l(5800);const o=[0,1,2,3,4,5,6],n=/[a-zA-Z0-9äöüÄÖÜß]/g,s=/^\d+$/;function i(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(n))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return s.test(e)}const c=new Set(["string"]),d=(e,t,l={})=>{(0,a.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,l,o,n)=>{var s,c;"function"==typeof(null===(s=e.hooks)||void 0===s?void 0:s.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,l,o,n)),"string"==typeof t&&!1===i(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}})}(l))},h=d},5687:(e,t,l)=>{l.d(t,{b:()=>s,h:()=>o,p:()=>a,s:()=>n});let a="development";try{a="production"}catch(e){a="production"}const o=(e,t,l)=>{if(e&&t&&"string"==typeof l){const a=e.querySelector(`[slot="${l}"]`);a&&t.appendChild(a)}},n=e=>""===e,s=(e,t)=>e||t||""},4600:(e,t,l)=>{function a(e,t){var l={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(l[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(e);o<a.length;o++)t.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(e,a[o])&&(l[a[o]]=e[a[o]])}return l}l.d(t,{_:()=>a}),"function"==typeof SuppressedError&&SuppressedError},8228:(e,t,l)=>{l.d(t,{w:()=>n});var a=l(1074),o=l(5800);const n=(e,t)=>{(0,o.w)(e,"_level",(e=>"number"==typeof e&&a.h.includes(e)),new Set([`Number {${a.h.join(", ")}`]),t,{defaultValue:1,required:!0})}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8243],{5626:(e,t,l)=>{l.d(t,{K:()=>h});var a=l(4600),o=l(6783),n=l(9060),s=l(3584),i=l(7662),r=l(3334);const c=({ariaLabel:e,icon:t})=>(0,o.h)(i.d,{class:"kol-alert__heading-icon",_label:e,_icons:t}),d=({type:e,label:t})=>{switch(e){case"error":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-error"),icon:"codicon codicon-error",label:t});case"info":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-info"),icon:"codicon codicon-info",label:t});case"warning":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-warning"),icon:"codicon codicon-warning",label:t});case"success":return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-success"),icon:"codicon codicon-pass",label:t});default:return(0,o.h)(c,{ariaLabel:(0,s.t)("kol-message"),icon:"codicon codicon-comment",label:t})}},h=(e,t)=>{var l,c;const{class:h={},type:v="default",variant:u="msg",label:b,hasCloser:_,alert:p,onAlertTimeout:f,onCloserClick:g,level:y}=e,k=(0,a._)(e,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);p&&((null===(l=navigator.userActivation)||void 0===l?void 0:l.hasBeenActive)&&(null===(c=null===navigator||void 0===navigator?void 0:navigator.vibrate)||void 0===c||c.call(navigator,[100,75,100,75,100])),setTimeout((()=>{null==f||f()}),1e4));const C=Object.assign({class:(0,n.c)("kol-alert",`kol-alert--${v}`,`kol-alert--${u}`,{"kol-alert--hasCloser":!!_},h),role:p?"alert":void 0},k);return(0,o.h)("div",Object.assign({},C),(0,o.h)("div",{class:"kol-alert__container"},(0,o.h)(d,{label:b,type:v}),(0,o.h)("div",{class:"kol-alert__container-content"},b?(0,o.h)(r.K,{class:"kol-alert__heading",level:y},b):null,"msg"===u&&(0,o.h)("div",{class:"kol-alert__content"},t)),_&&(0,o.h)(i.a,{class:"kol-alert__close-button close","data-testid":"alert-close-button",_ariaDescription:(null==b?void 0:b.trim())||"",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:(0,s.t)("kol-close-alert"),_on:{onClick:g},_tooltipAlign:"left"})),"card"===u&&(0,o.h)("div",{class:"kol-alert__content"},t))}},3334:(e,t,l)=>{l.d(t,{K:()=>d});var a=l(4600),o=l(6783),n=l(9060);const s=1;function i(e){return function(e){return e>=s&&e<=6}(e)?`h${e}`:"strong"}const r=(e,t)=>{var{class:l,level:r=s,variant:c}=e,d=(0,a._)(e,["class","level","variant"]);const h=i(r),v=c||h;return(0,o.h)(h,Object.assign({class:(0,n.c)("kol-headline",`kol-headline--${v}`,l)},d),t)},c=(e,t)=>{var{class:l,level:r=s}=e,c=(0,a._)(e,["class","level"]);const d=function(e){return 1===e?"span":i(e)}(r+1);return(0,o.h)(d,Object.assign({class:(0,n.c)("kol-headline kol-headline--group kol-headline--secondary",l)},c),t)},d=(e,t)=>{var{secondaryHeadline:l,level:i=s,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:v={}}=e,u=(0,a._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:i},u);if(!l)return(0,o.h)(r,Object.assign({class:(0,n.c)(d,"kol-headline--single")},b),t);const{class:_}=h,p=(0,a._)(h,["class"]),f=Object.assign({class:(0,n.c)("kol-heading-group",_)},p);return(0,o.h)("hgroup",Object.assign({},f),(0,o.h)(r,Object.assign({class:(0,n.c)(d,"kol-headline--group","kol-headline--primary")},b),t),(0,o.h)(c,Object.assign({level:i},v),l))}},9060:(e,t,l)=>{function a(e){var t,l,o="";if("string"==typeof e||"number"==typeof e)o+=e;else if("object"==typeof e)if(Array.isArray(e)){var n=e.length;for(t=0;t<n;t++)e[t]&&(l=a(e[t]))&&(o&&(o+=" "),o+=l)}else for(l in e)e[l]&&(o&&(o+=" "),o+=l);return o}function o(){for(var e,t,l=0,o="",n=arguments.length;l<n;l++)(e=arguments[l])&&(t=a(e))&&(o&&(o+=" "),o+=t);return o}l.d(t,{c:()=>o})},7419:(e,t,l)=>{l.d(t,{v:()=>o});var a=l(5800);const o=(e,t)=>{(0,a.b)(e,"_hasCloser",t)}},3584:(e,t,l)=>{l.d(t,{t:()=>n});var a=l(8461),o=l(5687);let n=(e,t)=>{var l;return(null!==(l=(0,a.g)())&&void 0!==l?l:(0,a.i)("de")).translate(e,t)};"test"===o.p&&(n=e=>e)},8243:(e,t,l)=>{l.r(t),l.d(t,{kol_alert_wc:()=>v});var a=l(6783),o=l(8228),n=l(8231),s=l(5626),i=l(5800),r=l(7419),c=l(1074);const d=["default","info","success","warning","error"],h=["card","msg"],v=class{constructor(e){(0,a.r)(this,e),this.close=()=>{var e,t;null===(t=null===(e=this._on)||void 0===e?void 0:e.onClose)||void 0===t||t.call(e,new Event("Close")),this.host&&(0,n.d)(this.host,n.K.close)},this.handleAlertTimeout=()=>{this.validateAlert(!1)},this.validateOnValue=e=>"object"==typeof e&&null!==e&&"function"==typeof e.onClose,this._alert=!1,this._hasCloser=!1,this._label=void 0,this._level=0,this._on=void 0,this._type="default",this._variant="msg",this.state={_level:0}}render(){const{_alert:e,_hasCloser:t,_label:l,_level:o,_type:n,_variant:i}=this.state,r={alert:e,hasCloser:t,label:l,level:o,type:n,variant:i,onCloserClick:this.close,onAlertTimeout:this.handleAlertTimeout};return(0,a.h)(s.K,Object.assign({key:"8d045b87e0ccf5ee926c8774da3d94bda07d9660"},r),(0,a.h)("slot",{key:"a665623f7355e2e30b728d37d3d9e59e9ad0f43f"}))}validateAlert(e){(0,i.b)(this,"_alert",e)}validateHasCloser(e){(0,r.v)(this,e)}validateLabel(e){(0,c.v)(this,e)}validateLevel(e){(0,o.w)(this,e)}validateOn(e){this.validateOnValue(e)&&(0,i.s)(this,"_on",{onClose:e.onClose})}validateType(e){(0,i.w)(this,"_type",(e=>"string"==typeof e&&d.includes(e)),new Set(`String {${d.join(", ")}`),e)}validateVariant(e){(0,i.w)(this,"_variant",(e=>"string"==typeof e&&h.includes(e)),new Set(`AlertVariant {${h.join(", ")}`),e)}componentWillLoad(){this.validateAlert(this._alert),this.validateHasCloser(this._hasCloser),this.validateLabel(this._label),this.validateLevel(this._level),this.validateOn(this._on),this.validateType(this._type),this.validateVariant(this._variant)}get host(){return(0,a.g)(this)}static get watchers(){return{_alert:["validateAlert"],_hasCloser:["validateHasCloser"],_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_type:["validateType"],_variant:["validateVariant"]}}}},1074:(e,t,l)=>{l.d(t,{a:()=>h,b:()=>i,c:()=>r,h:()=>o,v:()=>d});var a=l(5800);const o=[0,1,2,3,4,5,6],n=/[a-zA-Z0-9äöüÄÖÜß]/g,s=/^\d+$/;function i(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(n))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return s.test(e)}const c=new Set(["string"]),d=(e,t,l={})=>{(0,a.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,l,o,n)=>{var s,c;"function"==typeof(null===(s=e.hooks)||void 0===s?void 0:s.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,l,o,n)),"string"==typeof t&&!1===i(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}})}(l))},h=d},5687:(e,t,l)=>{l.d(t,{b:()=>s,h:()=>o,p:()=>a,s:()=>n});let a="development";try{a="production"}catch(e){a="production"}const o=(e,t,l)=>{if(e&&t&&"string"==typeof l){const a=e.querySelector(`[slot="${l}"]`);a&&t.appendChild(a)}},n=e=>""===e,s=(e,t)=>e||t||""},4600:(e,t,l)=>{function a(e,t){var l={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(l[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(e);o<a.length;o++)t.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(e,a[o])&&(l[a[o]]=e[a[o]])}return l}l.d(t,{_:()=>a}),"function"==typeof SuppressedError&&SuppressedError},8228:(e,t,l)=>{l.d(t,{w:()=>n});var a=l(1074),o=l(5800);const n=(e,t)=>{(0,o.w)(e,"_level",(e=>"number"==typeof e&&a.h.includes(e)),new Set([`Number {${a.h.join(", ")}`]),t,{defaultValue:1,required:!0})}}}]);

package/dist/8283.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8283.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8283],{8283:(n,e,t)=>{t.r(e),t.d(e,{kol_modal:()=>r});var o=t(5630),i=t(8231),a=t(1074),l=t(5800),s=(n,e,t)=>new Promise(((o,i)=>{var a=n=>{try{s(t.next(n))}catch(n){i(n)}},l=n=>{try{s(t.throw(n))}catch(n){i(n)}},s=n=>n.done?o(n.value):Promise.resolve(n.value).then(a,l);s((t=t.apply(n,e)).next())}));const r=class{constructor(n){(0,o.r)(this,n),this._label=void 0,this._on=void 0,this._width="100%",this.state={_label:"",_width:"100%"}}disconnectedCallback(){this.closeModal()}handleNativeCloseEvent(){var n,e;null===(e=null===(n=this.state._on)||void 0===n?void 0:n.onClose)||void 0===e||e.call(n),this.host&&(0,i.d)(this.host,i.K.close)}openModal(){return s(this,null,(function*(){var n;null===(n=this.refDialog)||void 0===n||n.showModal()}))}closeModal(){return s(this,null,(function*(){var n,e;null===(e=null===(n=this.refDialog)||void 0===n?void 0:n.close)||void 0===e||e.call(n)}))}render(){return(0,o.h)("dialog",{key:"6ed0460585f2e234eb8884f0bab78db164cf77a6",class:"kol-modal",ref:n=>{this.refDialog=n},style:{width:this.state._width},"aria-label":this.state._label,onClose:this.handleNativeCloseEvent.bind(this)},(0,o.h)("div",{key:"f011dad359d94c7a002e0280189b759b018085ed"},(0,o.h)("slot",{key:"357048c98ae2225aede805cade35ce5e25794488"})))}validateLabel(n){(0,a.v)(this,n,{required:!0})}validateOn(n){if("object"==typeof n&&null!==n){const e={};"function"!=typeof n.onClose&&!0!==n.onClose||(e.onClose=n.onClose),(0,l.s)(this,"_on",e)}}validateWidth(n){(0,l.i)(this,"_width",n,{defaultValue:"100%"})}componentWillLoad(){this.validateLabel(this._label),this.validateOn(this._on),this.validateWidth(this._width)}get host(){return(0,o.g)(this)}static get watchers(){return{_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"]}}};r.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .kol-modal {\n    border: 0;\n    padding: 0;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-modal::backdrop {\n    background-color: rgba(0, 0, 0, 0.33);\n  }\n}"}},1074:(n,e,t)=>{t.d(e,{a:()=>c,b:()=>s,c:()=>r,h:()=>i,v:()=>h});var o=t(5800);const i=[0,1,2,3,4,5,6],a=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(n,e=1){return function(n){var e;return"string"==typeof n&&(null===(e=n.match(a))||void 0===e?void 0:e.length)||0}(n)>=e}function r(n){return l.test(n)}const d=new Set(["string"]),h=(n,e,t={})=>{(0,o.w)(n,"_label",(n=>"string"==typeof n),d,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,i,a)=>{var l,d;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(d=n.hooks)||void 0===d||d.afterPatch(e,t,i,a)),"string"==typeof e&&!1===s(e,3)&&!1===r(e)&&(0,o.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,o.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=h}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8283],{9060:(n,t,e)=>{function o(n){var t,e,i="";if("string"==typeof n||"number"==typeof n)i+=n;else if("object"==typeof n)if(Array.isArray(n)){var a=n.length;for(t=0;t<a;t++)n[t]&&(e=o(n[t]))&&(i&&(i+=" "),i+=e)}else for(e in n)n[e]&&(i&&(i+=" "),i+=e);return i}function i(){for(var n,t,e=0,i="",a=arguments.length;e<a;e++)(n=arguments[e])&&(t=o(n))&&(i&&(i+=" "),i+=t);return i}e.d(t,{c:()=>i})},3584:(n,t,e)=>{e.d(t,{t:()=>a});var o=e(8461),i=e(5687);let a=(n,t)=>{var e;return(null!==(e=(0,o.g)())&&void 0!==e?e:(0,o.i)("de")).translate(n,t)};"test"===i.p&&(a=n=>n)},8283:(n,t,e)=>{e.r(t),e.d(t,{kol_modal:()=>b});var o=e(6783),i=e(8231),a=e(5800),l=e(7662),s=e(3584),r=e(9060),d=e(1074),c=(n,t,e)=>new Promise(((o,i)=>{var a=n=>{try{s(e.next(n))}catch(n){i(n)}},l=n=>{try{s(e.throw(n))}catch(n){i(n)}},s=n=>n.done?o(n.value):Promise.resolve(n.value).then(a,l);s((e=e.apply(n,t)).next())}));const h=["blank","card"],b=class{constructor(n){(0,o.r)(this,n),this.on={onClick:()=>c(this,null,(function*(){yield this.closeModal()}))},this._label=void 0,this._on=void 0,this._width="100%",this._variant="blank",this.state={_label:"",_width:"100%"}}disconnectedCallback(){this.closeModal()}handleNativeCloseEvent(){var n,t;null===(t=null===(n=this.state._on)||void 0===n?void 0:n.onClose)||void 0===t||t.call(n),this.host&&(0,i.d)(this.host,i.K.close)}openModal(){return c(this,null,(function*(){var n;null===(n=this.refDialog)||void 0===n||n.showModal()}))}closeModal(){return c(this,null,(function*(){var n,t;null===(t=null===(n=this.refDialog)||void 0===n?void 0:n.close)||void 0===t||t.call(n)}))}render(){return(0,o.h)("dialog",{key:"c5b2a309c6f2439231206b400deb6dfb7f09e233",class:(0,r.c)("kol-modal",{"kol-modal__card":"card"===this.state._variant}),ref:n=>{this.refDialog=n},style:{width:this.state._width},"aria-label":this.state._label,onClose:this.handleNativeCloseEvent.bind(this)},(0,o.h)("div",{key:"6cac7e41355946eb4630bb990e9ba91fbcc606b0",tabindex:"-1"},(0,o.h)("slot",{key:"630a8462624d9287c1f0bf1ebb0db526a5bf73cb"})),"card"===this.state._variant&&(0,o.h)(l.a,{key:"31f574b47b9cf7d580dba8c588361f20cc3aed67",class:"kol-modal__close-button","data-testid":"modal-close-button",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:(0,s.t)("kol-close"),_on:this.on,_tooltipAlign:"left"}))}validateLabel(n){(0,d.v)(this,n,{required:!0})}validateOn(n){if("object"==typeof n&&null!==n){const t={};"function"!=typeof n.onClose&&!0!==n.onClose||(t.onClose=n.onClose),(0,a.s)(this,"_on",t)}}validateWidth(n){(0,a.i)(this,"_width",n,{defaultValue:"100%"})}validateVariant(n){((n,t)=>{(0,a.w)(n,"_variant",(n=>"string"==typeof n&&h.includes(n)),new Set(h),t)})(this,n)}componentWillLoad(){this.validateLabel(this._label),this.validateOn(this._on),this.validateWidth(this._width),this.validateVariant(this._variant)}get host(){return(0,o.g)(this)}static get watchers(){return{_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"],_variant:["validateVariant"]}}};b.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\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-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-modal {\n    border: 0;\n    padding: 0;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    position: relative;\n  }\n  .kol-modal::backdrop {\n    background-color: rgba(0, 0, 0, 0.33);\n  }\n  .kol-modal__close-button {\n    position: absolute;\n    top: calc(1rem / var(--kolibri-root-font-size, 16));\n    right: calc(1rem / var(--kolibri-root-font-size, 16));\n    z-index: 1;\n  }\n}"}},1074:(n,t,e)=>{e.d(t,{a:()=>h,b:()=>s,c:()=>r,h:()=>i,v:()=>c});var o=e(5800);const i=[0,1,2,3,4,5,6],a=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(n,t=1){return function(n){var t;return"string"==typeof n&&(null===(t=n.match(a))||void 0===t?void 0:t.length)||0}(n)>=t}function r(n){return l.test(n)}const d=new Set(["string"]),c=(n,t,e={})=>{(0,o.w)(n,"_label",(n=>"string"==typeof n),d,t,function(n){var t;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(t,e,i,a)=>{var l,d;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(d=n.hooks)||void 0===d||d.afterPatch(t,e,i,a)),"string"==typeof t&&!1===s(t,3)&&!1===r(t)&&(0,o.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,o.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=n.hooks)||void 0===t?void 0:t.beforePatch}})}(e))},h=c},5687:(n,t,e)=>{e.d(t,{b:()=>l,h:()=>i,p:()=>o,s:()=>a});let o="development";try{o="production"}catch(n){o="production"}const i=(n,t,e)=>{if(n&&t&&"string"==typeof e){const o=n.querySelector(`[slot="${e}"]`);o&&t.appendChild(o)}},a=n=>""===n,l=(n,t)=>n||t||""}}]);

package/dist/8478.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8478.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8478],{3849:(n,e,t)=>{t.d(e,{K:()=>d});var o=t(4600),i=t(5630),a=t(9060);const l=1;function s(n){return function(n){return n>=l&&n<=6}(n)?`h${n}`:"strong"}const r=(n,e)=>{var{class:t,level:r=l,variant:c}=n,d=(0,o._)(n,["class","level","variant"]);const h=s(r),u=c||h;return(0,i.h)(h,Object.assign({class:(0,a.c)("kol-headline",`kol-headline--${u}`,t)},d),e)},c=(n,e)=>{var{class:t,level:r=l}=n,c=(0,o._)(n,["class","level"]);const d=function(n){return 1===n?"span":s(n)}(r+1);return(0,i.h)(d,Object.assign({class:(0,a.c)("kol-headline kol-headline--group kol-headline--secondary",t)},c),e)},d=(n,e)=>{var{secondaryHeadline:t,level:s=l,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=n,f=(0,o._)(n,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:s},f);if(!t)return(0,i.h)(r,Object.assign({class:(0,a.c)(d,"kol-headline--single")},b),e);const{class:p}=h,v=(0,o._)(h,["class"]),m=Object.assign({class:(0,a.c)("kol-heading-group",p)},v);return(0,i.h)("hgroup",Object.assign({},m),(0,i.h)(r,Object.assign({class:(0,a.c)(d,"kol-headline--group","kol-headline--primary")},b),e),(0,i.h)(c,Object.assign({level:s},u),t))}},9060:(n,e,t)=>{function o(n){var e,t,i="";if("string"==typeof n||"number"==typeof n)i+=n;else if("object"==typeof n)if(Array.isArray(n)){var a=n.length;for(e=0;e<a;e++)n[e]&&(t=o(n[e]))&&(i&&(i+=" "),i+=t)}else for(t in n)n[t]&&(i&&(i+=" "),i+=t);return i}function i(){for(var n,e,t=0,i="",a=arguments.length;t<a;t++)(n=arguments[t])&&(e=o(n))&&(i&&(i+=" "),i+=e);return i}t.d(e,{c:()=>i})},7419:(n,e,t)=>{t.d(e,{v:()=>i});var o=t(5800);const i=(n,e)=>{(0,o.b)(n,"_hasCloser",e)}},3584:(n,e,t)=>{t.d(e,{t:()=>a});var o=t(8461),i=t(5687);let a=(n,e)=>{var t;return(null!==(t=(0,o.g)())&&void 0!==t?t:(0,o.i)("de")).translate(n,e)};"test"===i.p&&(a=n=>n)},8478:(n,e,t)=>{t.r(e),t.d(e,{kol_card:()=>u});var o=t(5630),i=t(3584),a=t(8228),l=t(7767),s=t(8231),r=t(3849),c=t(7419),d=t(5800),h=t(1074);const u=class{constructor(n){(0,o.r)(this,n),this.close=()=>{var n;void 0!==(null===(n=this._on)||void 0===n?void 0:n.onClose)&&this._on.onClose(new Event("Close")),this.host&&(0,s.d)(this.host,s.K.close)},this.on={onClick:this.close},this.validateOnValue=n=>"object"==typeof n&&null!==n&&"function"==typeof n.onClose,this._on=void 0,this._hasCloser=!1,this._label=void 0,this._level=1,this.state={_label:""}}render(){return(0,o.h)("div",{key:"9b3f3c20c9f8873638f5b814a0bb975d35c6755f",class:"kol-card"},(0,o.h)("div",{key:"c27dd41fa36b132eb59a6f04079ea6f4449ccfa3",class:"kol-card__header"},(0,o.h)(r.K,{key:"2b20ac61c90422eed8000a20fd280e420a3a5baf",class:"kol-card__headline",level:this.state._level},this.state._label)),(0,o.h)("div",{key:"1603a72a02901b29effa7169aa8e50eb2c99ee05",class:"kol-card__content"},(0,o.h)("slot",{key:"97db416900df4d84d0d5060d9c0a0bf926c02dd3"})),this.state._hasCloser&&(0,o.h)(l.a,{key:"b3fd968a5063de19f354be783e37c2674ede03ef",class:"kol-card__close-button","data-testid":"card-close-button",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:(0,i.t)("kol-close"),_on:this.on,_tooltipAlign:"left"}))}validateOn(n){this.validateOnValue(n)&&(0,d.s)(this,"_on",{onClose:n.onClose})}validateHasCloser(n){(0,c.v)(this,n)}validateLabel(n){(0,h.v)(this,n,{required:!0})}validateLevel(n){(0,a.w)(this,n)}componentWillLoad(){this.validateHasCloser(this._hasCloser),this.validateLabel(this._label),this.validateLevel(this._level),this.validateOn(this._on)}get host(){return(0,o.g)(this)}static get watchers(){return{_on:["validateOn"],_hasCloser:["validateHasCloser"],_label:["validateLabel"],_level:["validateLevel"]}}};u.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\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-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-card {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    height: 100%;\n    position: relative;\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-card__close-button {\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n}"}},1074:(n,e,t)=>{t.d(e,{a:()=>h,b:()=>s,c:()=>r,h:()=>i,v:()=>d});var o=t(5800);const i=[0,1,2,3,4,5,6],a=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(n,e=1){return function(n){var e;return"string"==typeof n&&(null===(e=n.match(a))||void 0===e?void 0:e.length)||0}(n)>=e}function r(n){return l.test(n)}const c=new Set(["string"]),d=(n,e,t={})=>{(0,o.w)(n,"_label",(n=>"string"==typeof n),c,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,i,a)=>{var l,c;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(c=n.hooks)||void 0===c||c.afterPatch(e,t,i,a)),"string"==typeof e&&!1===s(e,3)&&!1===r(e)&&(0,o.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,o.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))},h=d},5687:(n,e,t)=>{t.d(e,{b:()=>l,h:()=>i,p:()=>o,s:()=>a});let o="development";try{o="production"}catch(n){o="production"}const i=(n,e,t)=>{if(n&&e&&"string"==typeof t){const o=n.querySelector(`[slot="${t}"]`);o&&e.appendChild(o)}},a=n=>""===n,l=(n,e)=>n||e||""},4600:(n,e,t)=>{function o(n,e){var t={};for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&e.indexOf(o)<0&&(t[o]=n[o]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(o=Object.getOwnPropertySymbols(n);i<o.length;i++)e.indexOf(o[i])<0&&Object.prototype.propertyIsEnumerable.call(n,o[i])&&(t[o[i]]=n[o[i]])}return t}t.d(e,{_:()=>o}),"function"==typeof SuppressedError&&SuppressedError},8228:(n,e,t)=>{t.d(e,{w:()=>a});var o=t(1074),i=t(5800);const a=(n,e)=>{(0,i.w)(n,"_level",(n=>"number"==typeof n&&o.h.includes(n)),new Set([`Number {${o.h.join(", ")}`]),e,{defaultValue:1,required:!0})}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8478],{3334:(n,e,t)=>{t.d(e,{K:()=>d});var o=t(4600),i=t(6783),a=t(9060);const l=1;function s(n){return function(n){return n>=l&&n<=6}(n)?`h${n}`:"strong"}const r=(n,e)=>{var{class:t,level:r=l,variant:c}=n,d=(0,o._)(n,["class","level","variant"]);const h=s(r),u=c||h;return(0,i.h)(h,Object.assign({class:(0,a.c)("kol-headline",`kol-headline--${u}`,t)},d),e)},c=(n,e)=>{var{class:t,level:r=l}=n,c=(0,o._)(n,["class","level"]);const d=function(n){return 1===n?"span":s(n)}(r+1);return(0,i.h)(d,Object.assign({class:(0,a.c)("kol-headline kol-headline--group kol-headline--secondary",t)},c),e)},d=(n,e)=>{var{secondaryHeadline:t,level:s=l,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=n,f=(0,o._)(n,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:s},f);if(!t)return(0,i.h)(r,Object.assign({class:(0,a.c)(d,"kol-headline--single")},b),e);const{class:p}=h,v=(0,o._)(h,["class"]),m=Object.assign({class:(0,a.c)("kol-heading-group",p)},v);return(0,i.h)("hgroup",Object.assign({},m),(0,i.h)(r,Object.assign({class:(0,a.c)(d,"kol-headline--group","kol-headline--primary")},b),e),(0,i.h)(c,Object.assign({level:s},u),t))}},9060:(n,e,t)=>{function o(n){var e,t,i="";if("string"==typeof n||"number"==typeof n)i+=n;else if("object"==typeof n)if(Array.isArray(n)){var a=n.length;for(e=0;e<a;e++)n[e]&&(t=o(n[e]))&&(i&&(i+=" "),i+=t)}else for(t in n)n[t]&&(i&&(i+=" "),i+=t);return i}function i(){for(var n,e,t=0,i="",a=arguments.length;t<a;t++)(n=arguments[t])&&(e=o(n))&&(i&&(i+=" "),i+=e);return i}t.d(e,{c:()=>i})},7419:(n,e,t)=>{t.d(e,{v:()=>i});var o=t(5800);const i=(n,e)=>{(0,o.b)(n,"_hasCloser",e)}},3584:(n,e,t)=>{t.d(e,{t:()=>a});var o=t(8461),i=t(5687);let a=(n,e)=>{var t;return(null!==(t=(0,o.g)())&&void 0!==t?t:(0,o.i)("de")).translate(n,e)};"test"===i.p&&(a=n=>n)},8478:(n,e,t)=>{t.r(e),t.d(e,{kol_card:()=>u});var o=t(6783),i=t(3584),a=t(8228),l=t(7662),s=t(8231),r=t(3334),c=t(7419),d=t(5800),h=t(1074);const u=class{constructor(n){(0,o.r)(this,n),this.close=()=>{var n;void 0!==(null===(n=this._on)||void 0===n?void 0:n.onClose)&&this._on.onClose(new Event("Close")),this.host&&(0,s.d)(this.host,s.K.close)},this.on={onClick:this.close},this.validateOnValue=n=>"object"==typeof n&&null!==n&&"function"==typeof n.onClose,this._on=void 0,this._hasCloser=!1,this._label=void 0,this._level=0,this.state={_label:""}}render(){return(0,o.h)("div",{key:"9b3f3c20c9f8873638f5b814a0bb975d35c6755f",class:"kol-card"},(0,o.h)("div",{key:"c27dd41fa36b132eb59a6f04079ea6f4449ccfa3",class:"kol-card__header"},(0,o.h)(r.K,{key:"2b20ac61c90422eed8000a20fd280e420a3a5baf",class:"kol-card__headline",level:this.state._level},this.state._label)),(0,o.h)("div",{key:"1603a72a02901b29effa7169aa8e50eb2c99ee05",class:"kol-card__content"},(0,o.h)("slot",{key:"97db416900df4d84d0d5060d9c0a0bf926c02dd3"})),this.state._hasCloser&&(0,o.h)(l.a,{key:"b3fd968a5063de19f354be783e37c2674ede03ef",class:"kol-card__close-button","data-testid":"card-close-button",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:(0,i.t)("kol-close"),_on:this.on,_tooltipAlign:"left"}))}validateOn(n){this.validateOnValue(n)&&(0,d.s)(this,"_on",{onClose:n.onClose})}validateHasCloser(n){(0,c.v)(this,n)}validateLabel(n){(0,h.v)(this,n,{required:!0})}validateLevel(n){(0,a.w)(this,n)}componentWillLoad(){this.validateHasCloser(this._hasCloser),this.validateLabel(this._label),this.validateLevel(this._level),this.validateOn(this._on)}get host(){return(0,o.g)(this)}static get watchers(){return{_on:["validateOn"],_hasCloser:["validateHasCloser"],_label:["validateLabel"],_level:["validateLevel"]}}};u.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\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-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-card {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    height: 100%;\n    position: relative;\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-card__close-button {\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n}"}},1074:(n,e,t)=>{t.d(e,{a:()=>h,b:()=>s,c:()=>r,h:()=>i,v:()=>d});var o=t(5800);const i=[0,1,2,3,4,5,6],a=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(n,e=1){return function(n){var e;return"string"==typeof n&&(null===(e=n.match(a))||void 0===e?void 0:e.length)||0}(n)>=e}function r(n){return l.test(n)}const c=new Set(["string"]),d=(n,e,t={})=>{(0,o.w)(n,"_label",(n=>"string"==typeof n),c,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,i,a)=>{var l,c;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(c=n.hooks)||void 0===c||c.afterPatch(e,t,i,a)),"string"==typeof e&&!1===s(e,3)&&!1===r(e)&&(0,o.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,o.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))},h=d},5687:(n,e,t)=>{t.d(e,{b:()=>l,h:()=>i,p:()=>o,s:()=>a});let o="development";try{o="production"}catch(n){o="production"}const i=(n,e,t)=>{if(n&&e&&"string"==typeof t){const o=n.querySelector(`[slot="${t}"]`);o&&e.appendChild(o)}},a=n=>""===n,l=(n,e)=>n||e||""},4600:(n,e,t)=>{function o(n,e){var t={};for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&e.indexOf(o)<0&&(t[o]=n[o]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(o=Object.getOwnPropertySymbols(n);i<o.length;i++)e.indexOf(o[i])<0&&Object.prototype.propertyIsEnumerable.call(n,o[i])&&(t[o[i]]=n[o[i]])}return t}t.d(e,{_:()=>o}),"function"==typeof SuppressedError&&SuppressedError},8228:(n,e,t)=>{t.d(e,{w:()=>a});var o=t(1074),i=t(5800);const a=(n,e)=>{(0,i.w)(n,"_level",(n=>"number"==typeof n&&o.h.includes(n)),new Set([`Number {${o.h.join(", ")}`]),e,{defaultValue:1,required:!0})}}}]);

package/dist/851.js

@@ -1,2 +1,2 @@
 /*! For license information please see 851.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[851],{851:(e,t,n)=>{n.r(t),n.d(t,{kol_progress:()=>d});var r,a,i=n(5630),o=n(1074),l=n(5800);(a=r||(r={})).bar="bar",a.cycle="cycle";const s=Object.keys(r),c=({state:e})=>{const t=e._label?"57%":"50%";return(0,i.h)("svg",{class:"kol-progress__cycle",width:"100",viewBox:"0 0 120 120",xmlns:"http://www.w3.org/2000/svg"},(0,i.h)("circle",{class:"kol-progress__cycle-background",cx:"60",cy:"60",r:"54.5",fill:"currentColor",stroke:"currentColor","stroke-width":"8"}),(0,i.h)("circle",{class:"kol-progress__cycle-whitespace",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"3"}),(0,i.h)("circle",{class:"kol-progress__cycle-border",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),(0,i.h)("circle",{class:"kol-progress__cycle-whitespace",cx:"60",cy:"60",r:"51",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),(0,i.h)("circle",{class:"kol-progress__cycle-border",cx:"60",cy:"60",r:"50",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),(0,i.h)("circle",{class:"kol-progress__cycle-progress",fill:"currentColor",stroke:"currentColor","stroke-linecap":"round","stroke-dasharray":`${Math.round(e._value/e._max*342)}px 342px`,"stroke-width":"6",cx:"60",cy:"60",r:"54.5"}),e._label&&(0,i.h)("text",{"aria-hidden":"true",x:"50%",y:"43%","text-anchor":"middle",fill:"currentColor"},e._label),(0,i.h)("text",{"aria-hidden":"true",x:"50%",y:t,"text-anchor":"middle",fill:"currentColor"},e._value,e._unit))},h=({state:e})=>{const t="var(--kolibri-text-label-padding, 45px)",n=e._value/e._max*100;return(0,i.h)("div",{class:"kol-progress__bar"},e._label&&(0,i.h)("div",null,e._label),(0,i.h)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"12",overflow:"visible"},(0,i.h)("rect",{class:"kol-progress__bar-background",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",style:{width:`calc(100% - 2px - ${t})`}}),(0,i.h)("rect",{class:"kol-progress__bar-border",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"1",style:{width:`calc(100% - 2px - ${t})`}}),(0,i.h)("rect",{class:"kol-progress__bar-progress",x:"2.5",y:"2.5",height:"7",rx:"3.5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",style:{width:`calc(${n}% - 5px - (${t} / 100 * ${n}))`}}),(0,i.h)("text",{"aria-hidden":"true","text-anchor":"end","dominant-baseline":"middle",fill:"currentColor",x:"100%",y:"50%"},e._value,e._unit)))},d=class{constructor(e){(0,i.r)(this,e),this._label=void 0,this._max=void 0,this._unit="%",this._value=void 0,this._variant=void 0,this.state={_max:100,_unit:"%",_value:0,_variant:"bar",_liveValue:0}}render(){return(0,i.h)("div",{key:"d9785ed35b0b5d6e0503d872b13ab0d2175a2e46",class:"kol-progress"},(e=>{switch(e._variant){case"cycle":return(0,i.h)(c,{state:e});case"bar":return(0,i.h)(h,{state:e});default:throw new Error(`Progress variant ${e._variant} not implemented.`)}})(this.state),(0,i.h)("progress",{key:"8e31ea2369ad26c59d1516388373baa8df781dff",class:"visually-hidden","aria-busy":this.state._value<this.state._max?"true":"false",max:this.state._max,value:this.state._value}),(0,i.h)("span",{key:"c4da69aaaf244ab486cee3e6d076265bf6fdba47","aria-live":"polite","aria-relevant":"removals text",class:"visually-hidden"},this.state._liveValue," von ",this.state._max," ",this.state._unit))}validateLabel(e){(0,o.v)(this,e)}validateMax(e){"number"!=typeof e&&(e=100),(0,l.k)(this,"_max",e,{required:!0})}validateUnit(e){(0,l.i)(this,"_unit",e)}validateValue(e){"number"!=typeof e&&(e=0),(0,l.k)(this,"_value",e,{required:!0})}validateVariant(e){(0,l.w)(this,"_variant",(e=>"string"==typeof e&&s.includes(e)),new Set(s),e)}componentWillLoad(){this.validateLabel(this._label),this.validateMax(this._max),this.validateUnit(this._unit),this.validateValue(this._value),this.validateVariant(this._variant),this.interval=setInterval((()=>{this.state._liveValue!==this.state._value&&(this.state=Object.assign(Object.assign({},this.state),{_liveValue:this.state._value}))}),5e3)}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_label:["validateLabel"],_max:["validateMax"],_unit:["validateUnit"],_value:["validateValue"],_variant:["validateVariant"]}}};d.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .kol-progress {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-progress__bar {\n    width: calc(150rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-progress__bar-border {\n    fill: transparent;\n    stroke: black;\n  }\n  .kol-progress__bar-background {\n    fill: lightgray;\n    stroke: white;\n  }\n  .kol-progress__bar-progress {\n    fill: #0075ff;\n    stroke: transparent;\n  }\n  @media (prefers-reduced-motion: no-preference) {\n    .kol-progress__bar-progress {\n      transition: 250ms ease-in-out 50ms;\n    }\n  }\n  .kol-progress__cycle-background {\n    fill: transparent;\n    stroke: lightgray;\n  }\n  .kol-progress__cycle-border {\n    fill: transparent;\n    stroke: black;\n  }\n  .kol-progress__cycle-whitespace {\n    fill: transparent;\n    stroke: white;\n  }\n  .kol-progress__cycle-progress {\n    fill: transparent;\n    stroke: #0075ff;\n    transform-origin: 50% 50%;\n    transform: rotate(-90deg);\n  }\n  @media (prefers-reduced-motion: no-preference) {\n    .kol-progress__cycle-progress {\n      transition: 250ms ease-in-out 50ms;\n    }\n  }\n}"}},1074:(e,t,n)=>{n.d(t,{a:()=>d,b:()=>l,c:()=>s,h:()=>a,v:()=>h});var r=n(5800);const a=[0,1,2,3,4,5,6],i=/[a-zA-Z0-9äöüÄÖÜß]/g,o=/^\d+$/;function l(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 s(e){return o.test(e)}const c=new Set(["string"]),h=(e,t,n={})=>{(0,r.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,n,a,i)=>{var o,c;"function"==typeof(null===(o=e.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,n,a,i)),"string"==typeof t&&!1===l(t,3)&&!1===s(t)&&(0,r.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,r.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(n))},d=h}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[851],{851:(e,t,n)=>{n.r(t),n.d(t,{kol_progress:()=>d});var r,a,i=n(6783),o=n(1074),l=n(5800);(a=r||(r={})).bar="bar",a.cycle="cycle";const s=Object.keys(r),c=({state:e})=>{const t=e._label?"57%":"50%";return(0,i.h)("svg",{class:"kol-progress__cycle",width:"100",viewBox:"0 0 120 120",xmlns:"http://www.w3.org/2000/svg"},(0,i.h)("circle",{class:"kol-progress__cycle-background",cx:"60",cy:"60",r:"54.5",fill:"currentColor",stroke:"currentColor","stroke-width":"8"}),(0,i.h)("circle",{class:"kol-progress__cycle-whitespace",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"3"}),(0,i.h)("circle",{class:"kol-progress__cycle-border",cx:"60",cy:"60",r:"59",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),(0,i.h)("circle",{class:"kol-progress__cycle-whitespace",cx:"60",cy:"60",r:"51",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),(0,i.h)("circle",{class:"kol-progress__cycle-border",cx:"60",cy:"60",r:"50",fill:"currentColor",stroke:"currentColor","stroke-width":"1"}),(0,i.h)("circle",{class:"kol-progress__cycle-progress",fill:"currentColor",stroke:"currentColor","stroke-linecap":"round","stroke-dasharray":`${Math.round(e._value/e._max*342)}px 342px`,"stroke-width":"6",cx:"60",cy:"60",r:"54.5"}),e._label&&(0,i.h)("text",{"aria-hidden":"true",x:"50%",y:"43%","text-anchor":"middle",fill:"currentColor"},e._label),(0,i.h)("text",{"aria-hidden":"true",x:"50%",y:t,"text-anchor":"middle",fill:"currentColor"},e._value,e._unit))},h=({state:e})=>{const t="var(--kolibri-text-label-padding, 45px)",n=e._value/e._max*100;return(0,i.h)("div",{class:"kol-progress__bar"},e._label&&(0,i.h)("div",null,e._label),(0,i.h)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"12",overflow:"visible"},(0,i.h)("rect",{class:"kol-progress__bar-background",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",style:{width:`calc(100% - 2px - ${t})`}}),(0,i.h)("rect",{class:"kol-progress__bar-border",x:"1",y:"1",height:"10",rx:"5",fill:"currentColor",stroke:"currentColor","stroke-width":"1",style:{width:`calc(100% - 2px - ${t})`}}),(0,i.h)("rect",{class:"kol-progress__bar-progress",x:"2.5",y:"2.5",height:"7",rx:"3.5",fill:"currentColor",stroke:"currentColor","stroke-width":"3",style:{width:`calc(${n}% - 5px - (${t} / 100 * ${n}))`}}),(0,i.h)("text",{"aria-hidden":"true","text-anchor":"end","dominant-baseline":"middle",fill:"currentColor",x:"100%",y:"50%"},e._value,e._unit)))},d=class{constructor(e){(0,i.r)(this,e),this._label=void 0,this._max=void 0,this._unit="%",this._value=void 0,this._variant=void 0,this.state={_max:100,_unit:"%",_value:0,_variant:"bar",_liveValue:0}}render(){return(0,i.h)("div",{key:"cc2c7a43ba0100f71f04669b0df3a8721e22b8a9",class:"kol-progress"},(e=>{switch(e._variant){case"cycle":return(0,i.h)(c,{state:e});case"bar":return(0,i.h)(h,{state:e});default:throw new Error(`Progress variant ${e._variant} not implemented.`)}})(this.state),(0,i.h)("progress",{key:"acd76a45d181c4e6899ef316ef04d2c159197e0b",class:"visually-hidden","aria-busy":this.state._value<this.state._max?"true":"false",max:this.state._max,value:this.state._value}),(0,i.h)("span",{key:"b73035f03d88014db6fcaa032a0671df7d52a848","aria-live":"polite","aria-relevant":"removals text",class:"visually-hidden"},this.state._liveValue," von ",this.state._max," ",this.state._unit))}validateLabel(e){(0,o.v)(this,e)}validateMax(e){"number"!=typeof e&&(e=100),(0,l.k)(this,"_max",e,{required:!0})}validateUnit(e){(0,l.i)(this,"_unit",e)}validateValue(e){"number"!=typeof e&&(e=0),(0,l.k)(this,"_value",e,{required:!0})}validateVariant(e){(0,l.w)(this,"_variant",(e=>"string"==typeof e&&s.includes(e)),new Set(s),e)}componentWillLoad(){this.validateLabel(this._label),this.validateMax(this._max),this.validateUnit(this._unit),this.validateValue(this._value),this.validateVariant(this._variant),this.interval=setInterval((()=>{this.state._liveValue!==this.state._value&&(this.state=Object.assign(Object.assign({},this.state),{_liveValue:this.state._value}))}),5e3)}disconnectedCallback(){clearInterval(this.interval)}static get watchers(){return{_label:["validateLabel"],_max:["validateMax"],_unit:["validateUnit"],_value:["validateValue"],_variant:["validateVariant"]}}};d.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .kol-progress {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-progress__bar {\n    width: calc(150rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-progress__bar-border {\n    fill: transparent;\n    stroke: black;\n  }\n  .kol-progress__bar-background {\n    fill: lightgray;\n    stroke: white;\n  }\n  .kol-progress__bar-progress {\n    fill: #0075ff;\n    stroke: transparent;\n  }\n  @media (prefers-reduced-motion: no-preference) {\n    .kol-progress__bar-progress {\n      transition: 250ms ease-in-out 50ms;\n    }\n  }\n  .kol-progress__cycle-background {\n    fill: transparent;\n    stroke: lightgray;\n  }\n  .kol-progress__cycle-border {\n    fill: transparent;\n    stroke: black;\n  }\n  .kol-progress__cycle-whitespace {\n    fill: transparent;\n    stroke: white;\n  }\n  .kol-progress__cycle-progress {\n    fill: transparent;\n    stroke: #0075ff;\n    transform-origin: 50% 50%;\n    transform: rotate(-90deg);\n  }\n  @media (prefers-reduced-motion: no-preference) {\n    .kol-progress__cycle-progress {\n      transition: 250ms ease-in-out 50ms;\n    }\n  }\n}"}},1074:(e,t,n)=>{n.d(t,{a:()=>d,b:()=>l,c:()=>s,h:()=>a,v:()=>h});var r=n(5800);const a=[0,1,2,3,4,5,6],i=/[a-zA-Z0-9äöüÄÖÜß]/g,o=/^\d+$/;function l(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 s(e){return o.test(e)}const c=new Set(["string"]),h=(e,t,n={})=>{(0,r.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,n,a,i)=>{var o,c;"function"==typeof(null===(o=e.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,n,a,i)),"string"==typeof t&&!1===l(t,3)&&!1===s(t)&&(0,r.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,r.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(n))},d=h}}]);

package/dist/8573.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8573.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8573],{9060:(e,t,i)=>{function n(e){var t,i,a="";if("string"==typeof e||"number"==typeof e)a+=e;else if("object"==typeof e)if(Array.isArray(e)){var l=e.length;for(t=0;t<l;t++)e[t]&&(i=n(e[t]))&&(a&&(a+=" "),a+=i)}else for(i in e)e[i]&&(a&&(a+=" "),a+=i);return a}function a(){for(var e,t,i=0,a="",l=arguments.length;i<l;i++)(e=arguments[i])&&(t=n(e))&&(a&&(a+=" "),a+=t);return a}i.d(t,{c:()=>a})},4879:(e,t,i)=>{i.d(t,{i:()=>s,n:()=>c,r:()=>r});var n=i(5630),a=i(5687),l=i(1732);const o=()=>{let e=(0,l.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,l.d)(),"KoliBri",{value:e,writable:!1})),e},s=()=>{(()=>{const e=(0,l.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const t=e.getAttribute("content");"string"==typeof t&&((0,l.s)(t.includes("dev-mode=true")),(0,l.b)(t.includes("experimental-mode=true")),(0,l.c)(t.includes("color-contrast-analysis=true")))}})(),l.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${n.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==o().adviceShown&&(Object.defineProperty(o(),"adviceShown",{get:function(){return!0}}),l.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"===a.p&&(c=()=>"nonce")},9506:(e,t,i)=>{i.d(t,{v:()=>a});var n=i(5800);const a=(e,t,i={})=>{(0,n.i)(e,"_href",t,i)}},8573:(e,t,i)=>{i.r(t),i.d(t,{kol_tree_item_wc:()=>u});var n=i(5630),a=i(7767),l=i(4879),o=i(9060),s=i(5800),r=i(1074),c=i(7688),h=i(9506),d=(e,t,i)=>new Promise(((n,a)=>{var l=e=>{try{s(i.next(e))}catch(e){a(e)}},o=e=>{try{s(i.throw(e))}catch(e){a(e)}},s=e=>e.done?n(e.value):Promise.resolve(e.value).then(l,o);s((i=i.apply(e,t)).next())}));const u=class{constructor(e){(0,n.r)(this,e),this.groupId=`tree-group-${(0,l.n)()}`,this.level=void 0,this.state={_active:!1,_hasChildren:!1,_href:"",_label:"",_open:!1},this._active=void 0,this._label=void 0,this._open=void 0,this._href=void 0}render(){const{_href:e,_active:t,_hasChildren:i,_open:l,_label:s}=this.state;return(0,n.h)(n.H,{key:"f8c9e515206db04afb8151d1271885110e40e1a4",onSlotchange:this.handleSlotchange.bind(this)},(0,n.h)("li",{key:"cd86323cb26384ee0f3a3b5c23bd7fec512db1e1",class:"kol-tree-item",style:{"--level":`${this.level}`}},(0,n.h)(a.f,{key:"bbfb74e6ab60543cdb30efca235f99ed78ea95d2",class:(0,o.c)("kol-tree-item__link",{"kol-tree-item__link--first-level":0===this.level,"kol-tree-item__link--active":t}),_href:e,_label:"",_role:"treeitem",_tabIndex:t?0:-1,_ariaExpanded:i?l:void 0,_ariaOwns:i?this.groupId:void 0,ref:e=>this.linkElement=e},(0,n.h)("span",{key:"0faba8ad9946ac707790f4134298477682719215",slot:"expert"},i&&(0,n.h)("span",{key:"5a51f2f3bbb8596758ecad1da3966671212e405b",class:"kol-tree-item__toggle-button",onClick:e=>l?void this.handleCollapseClick(e):void this.handleExpandClick(e)},(0,n.h)(a.d,{key:"42f50dee8ccdcb764f90c1685241d9aaa7e4fce7",class:"kol-tree-item__toggle-button-icon",_icons:"codicon codicon-"+(l?"chevron-down":"chevron-right"),_label:""}))," ",s)),(0,n.h)("ul",{key:"b0df6b5e84aa152a74b5f17014e360330d19afee",class:"kol-tree-item__children",hidden:!i||!l,role:"group",id:this.groupId},(0,n.h)("slot",{key:"1ce889bfd13e6357325249da2eef8fbe18840609"}))))}validateActive(e){((e,t)=>{(0,s.b)(e,"_active",t,void 0)})(this,e||!1)}validateLabel(e){(0,r.v)(this,e)}validateOpen(e){(0,c.v)(this,e)}validateHref(e){(0,h.v)(this,e)}componentWillLoad(){this.validateActive(this._active),this.validateLabel(this._label),this.validateOpen(this._open),this.validateHref(this._href),this.checkForChildren(),this.determineTreeItemDepth()}determineTreeItemDepth(){let e=0,t=this.host.parentNode.host.parentNode;for(;null!==t&&t.tagName.toLowerCase()!==a.r&&t!==document.body;)t=t.parentElement,e+=1;this.level=e}handleSlotchange(){this.checkForChildren()}checkForChildren(){var e,t;this.state=Object.assign(Object.assign({},this.state),{_hasChildren:Boolean(null===(t=null===(e=this.host.querySelector("slot"))||void 0===e?void 0:e.assignedElements)||void 0===t?void 0:t.call(e).length)})}focusLink(){return d(this,null,(function*(){yield this.linkElement.kolFocus()}))}handleExpandClick(e){return d(this,null,(function*(){e.preventDefault(),yield this.linkElement.kolFocus(),yield this.expand()}))}expand(){return d(this,null,(function*(){this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!0}))}))}handleCollapseClick(e){return d(this,null,(function*(){e.preventDefault(),this.linkElement.focus(),yield this.collapse()}))}collapse(){return d(this,null,(function*(){this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!1}))}))}isOpen(){return d(this,null,(function*(){var e;return null!==(e=this.state._open)&&void 0!==e&&e}))}get host(){return(0,n.g)(this)}static get watchers(){return{_active:["validateActive"],_label:["validateLabel"],_open:["validateOpen"],_href:["validateHref"]}}}},1074:(e,t,i)=>{i.d(t,{a:()=>d,b:()=>s,c:()=>r,h:()=>a,v:()=>h});var n=i(5800);const a=[0,1,2,3,4,5,6],l=/[a-zA-Z0-9äöüÄÖÜß]/g,o=/^\d+$/;function s(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(l))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return o.test(e)}const c=new Set(["string"]),h=(e,t,i={})=>{(0,n.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,i,a,l)=>{var o,c;"function"==typeof(null===(o=e.hooks)||void 0===o?void 0:o.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,i,a,l)),"string"==typeof t&&!1===s(t,3)&&!1===r(t)&&(0,n.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,n.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(i))},d=h},7688:(e,t,i)=>{i.d(t,{v:()=>a});var n=i(5800);const a=(e,t,i)=>{(0,n.b)(e,"_open",t,i)}},5687:(e,t,i)=>{i.d(t,{b:()=>o,h:()=>a,p:()=>n,s:()=>l});let n="development";try{n="production"}catch(e){n="production"}const a=(e,t,i)=>{if(e&&t&&"string"==typeof i){const n=e.querySelector(`[slot="${i}"]`);n&&t.appendChild(n)}},l=e=>""===e,o=(e,t)=>e||t||""}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8573],{9060:(e,t,i)=>{function n(e){var t,i,l="";if("string"==typeof e||"number"==typeof e)l+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(i=n(e[t]))&&(l&&(l+=" "),l+=i)}else for(i in e)e[i]&&(l&&(l+=" "),l+=i);return l}function l(){for(var e,t,i=0,l="",o=arguments.length;i<o;i++)(e=arguments[i])&&(t=n(e))&&(l&&(l+=" "),l+=t);return l}i.d(t,{c:()=>l})},7336:(e,t,i)=>{i.d(t,{i:()=>s,n:()=>c,r:()=>r});var n=i(6783),l=i(5687),o=i(1732);const a=()=>{let e=(0,o.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,o.d)(),"KoliBri",{value:e,writable:!1})),e},s=()=>{(()=>{const e=(0,o.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const t=e.getAttribute("content");"string"==typeof t&&((0,o.s)(t.includes("dev-mode=true")),(0,o.b)(t.includes("experimental-mode=true")),(0,o.c)(t.includes("color-contrast-analysis=true")))}})(),o.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${n.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==a().adviceShown&&(Object.defineProperty(a(),"adviceShown",{get:function(){return!0}}),o.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"===l.p&&(c=()=>"nonce")},9506:(e,t,i)=>{i.d(t,{v:()=>l});var n=i(5800);const l=(e,t,i={})=>{(0,n.i)(e,"_href",t,i)}},8573:(e,t,i)=>{i.r(t),i.d(t,{kol_tree_item_wc:()=>u});var n=i(6783),l=i(7662),o=i(7336),a=i(9060),s=i(5800),r=i(1074),c=i(7688),h=i(9506),d=(e,t,i)=>new Promise(((n,l)=>{var o=e=>{try{s(i.next(e))}catch(e){l(e)}},a=e=>{try{s(i.throw(e))}catch(e){l(e)}},s=e=>e.done?n(e.value):Promise.resolve(e.value).then(o,a);s((i=i.apply(e,t)).next())}));const u=class{constructor(e){(0,n.r)(this,e),this.groupId=`tree-group-${(0,o.n)()}`,this.level=void 0,this.state={_active:!1,_hasChildren:!1,_href:"",_label:"",_open:!1},this._active=void 0,this._label=void 0,this._open=void 0,this._href=void 0}render(){const{_href:e,_active:t,_hasChildren:i,_open:o,_label:s}=this.state;return(0,n.h)(n.H,{key:"e8cebee52ed0f115c3aa30e82e2e3ccf5d09e626",onSlotchange:this.handleSlotchange.bind(this)},(0,n.h)("li",{key:"c4b1d56ae69f55ca57ad8d863df02fe0d7ff4f00",class:"kol-tree-item",style:{"--level":`${this.level}`}},(0,n.h)(l.f,{key:"8e87e00dae2d0e6dcad5602e28b5642bc31702f5",class:(0,a.c)("kol-tree-item__link",{"kol-tree-item__link--first-level":0===this.level,"kol-tree-item__link--active":t}),_href:e,_label:"",_role:"treeitem",_tabIndex:t?0:-1,_ariaExpanded:i?o:void 0,_ariaOwns:i?this.groupId:void 0,ref:e=>this.linkElement=e},(0,n.h)("span",{key:"f037767f3e0142ec622d5e3dc03f303b30831abf",slot:"expert"},i&&(0,n.h)("span",{key:"a344ded5e01b484b686aeb71b4370fe37f3fd8b1",class:"kol-tree-item__toggle-button",onClick:e=>o?void this.handleCollapseClick(e):void this.handleExpandClick(e)},(0,n.h)(l.d,{key:"d84793747ce43c28fca27abde4c76f4a5feb060b",class:"kol-tree-item__toggle-button-icon",_icons:"codicon codicon-"+(o?"chevron-down":"chevron-right"),_label:""}))," ",s)),(0,n.h)("ul",{key:"828ff0900dc3f9018e939ef0d519cdcabbab652b",class:"kol-tree-item__children",hidden:!i||!o,role:"group",id:this.groupId},(0,n.h)("slot",{key:"7fd8f3b71eb060d42835e3d1b311ab4bb7930f99"}))))}validateActive(e){((e,t)=>{(0,s.b)(e,"_active",t,void 0)})(this,e||!1)}validateLabel(e){(0,r.v)(this,e)}validateOpen(e){(0,c.v)(this,e)}validateHref(e){(0,h.v)(this,e)}componentWillLoad(){this.validateActive(this._active),this.validateLabel(this._label),this.validateOpen(this._open),this.validateHref(this._href),this.checkForChildren(),this.determineTreeItemDepth()}determineTreeItemDepth(){let e=0,t=this.host.parentNode.host.parentNode;for(;null!==t&&t.tagName.toLowerCase()!==l.q&&t!==document.body;)t=t.parentElement,e+=1;this.level=e}handleSlotchange(){this.checkForChildren()}checkForChildren(){var e,t;this.state=Object.assign(Object.assign({},this.state),{_hasChildren:Boolean(null===(t=null===(e=this.host.querySelector("slot"))||void 0===e?void 0:e.assignedElements)||void 0===t?void 0:t.call(e).length)})}focusLink(){return d(this,null,(function*(){yield this.linkElement.kolFocus()}))}handleExpandClick(e){return d(this,null,(function*(){e.preventDefault(),yield this.linkElement.kolFocus(),yield this.expand()}))}expand(){return d(this,null,(function*(){this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!0}))}))}handleCollapseClick(e){return d(this,null,(function*(){e.preventDefault(),this.linkElement.focus(),yield this.collapse()}))}collapse(){return d(this,null,(function*(){this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!1}))}))}isOpen(){return d(this,null,(function*(){var e;return null!==(e=this.state._open)&&void 0!==e&&e}))}get host(){return(0,n.g)(this)}static get watchers(){return{_active:["validateActive"],_label:["validateLabel"],_open:["validateOpen"],_href:["validateHref"]}}}},1074:(e,t,i)=>{i.d(t,{a:()=>d,b:()=>s,c:()=>r,h:()=>l,v:()=>h});var n=i(5800);const l=[0,1,2,3,4,5,6],o=/[a-zA-Z0-9äöüÄÖÜß]/g,a=/^\d+$/;function s(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(o))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return a.test(e)}const c=new Set(["string"]),h=(e,t,i={})=>{(0,n.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,i,l,o)=>{var a,c;"function"==typeof(null===(a=e.hooks)||void 0===a?void 0:a.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,i,l,o)),"string"==typeof t&&!1===s(t,3)&&!1===r(t)&&(0,n.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,n.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(i))},d=h},7688:(e,t,i)=>{i.d(t,{v:()=>l});var n=i(5800);const l=(e,t,i)=>{(0,n.b)(e,"_open",t,i)}},5687:(e,t,i)=>{i.d(t,{b:()=>a,h:()=>l,p:()=>n,s:()=>o});let n="development";try{n="production"}catch(e){n="production"}const l=(e,t,i)=>{if(e&&t&&"string"==typeof i){const n=e.querySelector(`[slot="${i}"]`);n&&t.appendChild(n)}},o=e=>""===e,a=(e,t)=>e||t||""}}]);

package/dist/8728.js

@@ -1,2 +1,2 @@
 /*! For license information please see 8728.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8728],{9060:(n,e,i)=>{function t(n){var e,i,o="";if("string"==typeof n||"number"==typeof n)o+=n;else if("object"==typeof n)if(Array.isArray(n)){var r=n.length;for(e=0;e<r;e++)n[e]&&(i=t(n[e]))&&(o&&(o+=" "),o+=i)}else for(i in n)n[i]&&(o&&(o+=" "),o+=i);return o}function o(){for(var n,e,i=0,o="",r=arguments.length;i<r;i++)(n=arguments[i])&&(e=t(n))&&(o&&(o+=" "),o+=e);return o}i.d(e,{c:()=>o})},3584:(n,e,i)=>{i.d(e,{t:()=>r});var t=i(8461),o=i(5687);let r=(n,e)=>{var i;return(null!==(i=(0,t.g)())&&void 0!==i?i:(0,t.i)("de")).translate(n,e)};"test"===o.p&&(r=n=>n)},8728:(n,e,i)=>{i.r(e),i.d(e,{kol_spin:()=>d});var t=i(5630),o=i(3584),r=i(9060),a=i(8946),l=i(5800);const s=["cycle","dot","none"],d=class{constructor(n){(0,t.r)(this,n),this.showToggled=!1,this._show=!1,this._variant="dot",this.state={_variant:"dot"}}render(){return(0,t.h)(t.H,{key:"a9401254fe20503b0130fe2d1bacccde52d9812c",class:"kol-spin"},this.state._show?(0,t.h)("span",{"aria-busy":"true","aria-label":(0,o.t)("kol-action-running"),"aria-live":"polite",class:(0,r.c)("kol-spin__spinner",`kol-spin__spinner--${this.state._variant}`),role:"alert"},function(n){switch(n){case"cycle":return(0,t.h)("span",{class:"kol-spin__loader"});case"none":return(0,t.h)("slot",{name:"expert"});default:return(0,t.h)(t.F,null,(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--1"}),(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--2"}),(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--3"}),(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--neutral"}))}}(this.state._variant)):this.showToggled&&(0,t.h)("span",{"aria-label":(0,o.t)("kol-action-done"),"aria-busy":"false","aria-live":"polite",role:"alert"}))}validateShow(n){this.showToggled=!0===this.state._show&&!1===this._show,(0,a.v)(this,n)}validateVariant(n){((n,e)=>{(0,l.w)(n,"_variant",(n=>"string"==typeof n&&s.includes(n)),new Set(s),e)})(this,n)}componentWillLoad(){this.validateShow(this._show),this.validateVariant(this._variant)}static get watchers(){return{_show:["validateShow"],_variant:["validateVariant"]}}};d.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .kol-spin__spinner--cycle {\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n    height: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__loader {\n    display: block;\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n    position: relative;\n    animation: 2s linear infinite rotate;\n  }\n  .kol-spin__loader::before {\n    content: \"\";\n    box-sizing: border-box;\n    position: absolute;\n    inset: 0;\n    border-radius: 50%;\n    border: calc(5rem / var(--kolibri-root-font-size, 16)) solid #333;\n    animation: 3s linear infinite prixClipFix;\n  }\n  @keyframes rotate {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n  @keyframes prixClipFix {\n    0% {\n      border-color: #fff;\n      clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n    }\n    25% {\n      border-color: #666;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n    }\n    50% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);\n    }\n    75% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n    }\n    100% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .kol-spin__loader {\n      animation-duration: 4s;\n    }\n    .kol-spin__loader::before {\n      animation-duration: 6s;\n    }\n  }\n}\n@layer kol-component {\n  .kol-spin__spinner--dot {\n    height: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element {\n    animation-timing-function: cubic-bezier(0, 1, 1, 0);\n    border-radius: 50%;\n    border: calc(0.16rem / var(--kolibri-root-font-size, 16)) solid #fff;\n    height: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    top: calc(0.16rem / var(--kolibri-root-font-size, 16));\n    width: calc(12.8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--1 {\n    background-color: #000;\n    z-index: 0;\n    animation: 1s infinite spin1;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--2 {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--3 {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(17.6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--neutral {\n    background-color: #666;\n    z-index: 0;\n    animation: 1s infinite spin3;\n    left: calc(33.6rem / var(--kolibri-root-font-size, 16));\n  }\n  @keyframes spin1 {\n    0% {\n      transform: scale(0);\n    }\n    100% {\n      transform: scale(1);\n    }\n  }\n  @keyframes spin2 {\n    0% {\n      transform: translate(0, 0);\n    }\n    100% {\n      transform: translate(calc(16rem / var(--kolibri-root-font-size, 16)), 0);\n    }\n  }\n  @keyframes spin3 {\n    0% {\n      transform: scale(1);\n    }\n    100% {\n      transform: scale(0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .kol-spin__spinner-element {\n      animation-duration: 2s;\n    }\n  }\n}\n@layer kol-component {\n  .kol-spin {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner {\n    display: block;\n    padding: calc(2rem / var(--kolibri-root-font-size, 16));\n    position: relative;\n  }\n}"}},5687:(n,e,i)=>{i.d(e,{b:()=>a,h:()=>o,p:()=>t,s:()=>r});let t="development";try{t="production"}catch(n){t="production"}const o=(n,e,i)=>{if(n&&e&&"string"==typeof i){const t=n.querySelector(`[slot="${i}"]`);t&&e.appendChild(t)}},r=n=>""===n,a=(n,e)=>n||e||""},8946:(n,e,i)=>{i.d(e,{v:()=>o});var t=i(5800);const o=(n,e,i)=>{(0,t.b)(n,"_show",e,i)}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[8728],{9060:(n,e,i)=>{function t(n){var e,i,o="";if("string"==typeof n||"number"==typeof n)o+=n;else if("object"==typeof n)if(Array.isArray(n)){var r=n.length;for(e=0;e<r;e++)n[e]&&(i=t(n[e]))&&(o&&(o+=" "),o+=i)}else for(i in n)n[i]&&(o&&(o+=" "),o+=i);return o}function o(){for(var n,e,i=0,o="",r=arguments.length;i<r;i++)(n=arguments[i])&&(e=t(n))&&(o&&(o+=" "),o+=e);return o}i.d(e,{c:()=>o})},3584:(n,e,i)=>{i.d(e,{t:()=>r});var t=i(8461),o=i(5687);let r=(n,e)=>{var i;return(null!==(i=(0,t.g)())&&void 0!==i?i:(0,t.i)("de")).translate(n,e)};"test"===o.p&&(r=n=>n)},8728:(n,e,i)=>{i.r(e),i.d(e,{kol_spin:()=>d});var t=i(6783),o=i(3584),r=i(9060),a=i(8946),l=i(5800);const s=["cycle","dot","none"],d=class{constructor(n){(0,t.r)(this,n),this.showToggled=!1,this._show=!1,this._variant="dot",this.state={_variant:"dot"}}render(){return(0,t.h)(t.H,{key:"78146272c08f10d0bde3450838cf18acc290fdc6",class:"kol-spin"},this.state._show?(0,t.h)("span",{"aria-busy":"true","aria-label":(0,o.t)("kol-action-running"),"aria-live":"polite",class:(0,r.c)("kol-spin__spinner",`kol-spin__spinner--${this.state._variant}`),role:"alert"},function(n){switch(n){case"cycle":return(0,t.h)("span",{class:"kol-spin__loader"});case"none":return(0,t.h)("slot",{name:"expert"});default:return(0,t.h)(t.F,null,(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--1"}),(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--2"}),(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--3"}),(0,t.h)("span",{class:"kol-spin__spinner-element kol-spin__spinner-element--neutral"}))}}(this.state._variant)):this.showToggled&&(0,t.h)("span",{"aria-label":(0,o.t)("kol-action-done"),"aria-busy":"false","aria-live":"polite",role:"alert"}))}validateShow(n){this.showToggled=!0===this.state._show&&!1===this._show,(0,a.v)(this,n)}validateVariant(n){((n,e)=>{(0,l.w)(n,"_variant",(n=>"string"==typeof n&&s.includes(n)),new Set(s),e)})(this,n)}componentWillLoad(){this.validateShow(this._show),this.validateVariant(this._variant)}static get watchers(){return{_show:["validateShow"],_variant:["validateVariant"]}}};d.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: calc(44rem / var(--kolibri-root-font-size, 16));\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 rem(44).\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    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: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\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  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\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,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .kol-spin__spinner--cycle {\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n    height: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__loader {\n    display: block;\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n    position: relative;\n    animation: 2s linear infinite rotate;\n  }\n  .kol-spin__loader::before {\n    content: \"\";\n    box-sizing: border-box;\n    position: absolute;\n    inset: 0;\n    border-radius: 50%;\n    border: calc(5rem / var(--kolibri-root-font-size, 16)) solid #333;\n    animation: 3s linear infinite prixClipFix;\n  }\n  @keyframes rotate {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n  @keyframes prixClipFix {\n    0% {\n      border-color: #fff;\n      clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);\n    }\n    25% {\n      border-color: #666;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);\n    }\n    50% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);\n    }\n    75% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);\n    }\n    100% {\n      border-color: #000;\n      clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .kol-spin__loader {\n      animation-duration: 4s;\n    }\n    .kol-spin__loader::before {\n      animation-duration: 6s;\n    }\n  }\n}\n@layer kol-component {\n  .kol-spin__spinner--dot {\n    height: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: calc(48rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element {\n    animation-timing-function: cubic-bezier(0, 1, 1, 0);\n    border-radius: 50%;\n    border: calc(0.16rem / var(--kolibri-root-font-size, 16)) solid #fff;\n    height: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    top: calc(0.16rem / var(--kolibri-root-font-size, 16));\n    width: calc(12.8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--1 {\n    background-color: #000;\n    z-index: 0;\n    animation: 1s infinite spin1;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--2 {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(0.16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--3 {\n    background-color: #000;\n    z-index: 1;\n    animation: 1s infinite spin2;\n    left: calc(17.6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner-element--neutral {\n    background-color: #666;\n    z-index: 0;\n    animation: 1s infinite spin3;\n    left: calc(33.6rem / var(--kolibri-root-font-size, 16));\n  }\n  @keyframes spin1 {\n    0% {\n      transform: scale(0);\n    }\n    100% {\n      transform: scale(1);\n    }\n  }\n  @keyframes spin2 {\n    0% {\n      transform: translate(0, 0);\n    }\n    100% {\n      transform: translate(calc(16rem / var(--kolibri-root-font-size, 16)), 0);\n    }\n  }\n  @keyframes spin3 {\n    0% {\n      transform: scale(1);\n    }\n    100% {\n      transform: scale(0);\n    }\n  }\n  /* https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#toning_down_the_animation_scaling */\n  @media (prefers-reduced-motion) {\n    .kol-spin__spinner-element {\n      animation-duration: 2s;\n    }\n  }\n}\n@layer kol-component {\n  .kol-spin {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-spin__spinner {\n    display: block;\n    padding: calc(2rem / var(--kolibri-root-font-size, 16));\n    position: relative;\n  }\n}"}},5687:(n,e,i)=>{i.d(e,{b:()=>a,h:()=>o,p:()=>t,s:()=>r});let t="development";try{t="production"}catch(n){t="production"}const o=(n,e,i)=>{if(n&&e&&"string"==typeof i){const t=n.querySelector(`[slot="${i}"]`);t&&e.appendChild(t)}},r=n=>""===n,a=(n,e)=>n||e||""},8946:(n,e,i)=>{i.d(e,{v:()=>o});var t=i(5800);const o=(n,e,i)=>{(0,t.b)(n,"_show",e,i)}}}]);