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

package/dist/1744.js

@@ -1,2 +1,2 @@
 /*! For license information please see 1744.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[1744],{3364:(e,t,n)=>{n.d(t,{K:()=>h});var i=n(4600),o=n(6970),a=n(9060),l=n(3584),r=n(7767),s=n(4916);const c=({ariaLabel:e,icon:t})=>(0,o.h)(r.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,l.t)("kol-error"),icon:"codicon codicon-error",label:t});case"info":return(0,o.h)(c,{ariaLabel:(0,l.t)("kol-info"),icon:"codicon codicon-info",label:t});case"warning":return(0,o.h)(c,{ariaLabel:(0,l.t)("kol-warning"),icon:"codicon codicon-warning",label:t});case"success":return(0,o.h)(c,{ariaLabel:(0,l.t)("kol-success"),icon:"codicon codicon-pass",label:t});default:return(0,o.h)(c,{ariaLabel:(0,l.t)("kol-message"),icon:"codicon codicon-comment",label:t})}},h=(e,t)=>{var n,c;const{class:h={},type:u="default",variant:p="msg",label:b,hasCloser:v,alert:g,onAlertTimeout:m,onCloserClick:f,level:y}=e,_=(0,i._)(e,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);g&&((null===(n=navigator.userActivation)||void 0===n?void 0:n.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==m||m()}),1e4));const k=Object.assign({class:(0,a.c)("kol-alert",`kol-alert--${u}`,`kol-alert--${p}`,{"kol-alert--hasCloser":!!v},h),role:g?"alert":void 0},_);return(0,o.h)("div",Object.assign({},k),(0,o.h)("div",{class:"kol-alert__container"},(0,o.h)(d,{label:b,type:u}),(0,o.h)("div",{class:"kol-alert__container-content"},b?(0,o.h)(s.K,{class:"kol-alert__heading",level:y},b):null,"msg"===p&&(0,o.h)("div",{class:"kol-alert__content"},t)),v&&(0,o.h)(r.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,l.t)("kol-close-alert"),_on:{onClick:f},_tooltipAlign:"left"})),"card"===p&&(0,o.h)("div",{class:"kol-alert__content"},t))}},5117:(e,t,n)=>{n.d(t,{K:()=>r});var i=n(4600),o=n(9060),a=n(6970),l=n(3364);const r=e=>{var{alert:t,msg:n,hideError:r,id:s,class:c}=e,d=(0,i._)(e,["alert","msg","hideError","id","class"]);return(0,a.h)(l.K,Object.assign({id:`${s}-error`,alert:t,type:"error",class:(0,o.c)({error:!0,"visually-hidden":!0===r},c)},n,d,{"aria-hidden":"true"}),(null==n?void 0:n.description)||void 0)}},4916:(e,t,n)=>{n.d(t,{K:()=>d});var i=n(4600),o=n(6970),a=n(9060);const l=1;function r(e){return function(e){return e>=l&&e<=6}(e)?`h${e}`:"strong"}const s=(e,t)=>{var{class:n,level:s=l,variant:c}=e,d=(0,i._)(e,["class","level","variant"]);const h=r(s),u=c||h;return(0,o.h)(h,Object.assign({class:(0,a.c)("kol-headline",`kol-headline--${u}`,n)},d),t)},c=(e,t)=>{var{class:n,level:s=l}=e,c=(0,i._)(e,["class","level"]);const d=function(e){return 1===e?"span":r(e)}(s+1);return(0,o.h)(d,Object.assign({class:(0,a.c)("kol-headline kol-headline--group kol-headline--secondary",n)},c),t)},d=(e,t)=>{var{secondaryHeadline:n,level:r=l,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=e,p=(0,i._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:r},p);if(!n)return(0,o.h)(s,Object.assign({class:(0,a.c)(d,"kol-headline--single")},b),t);const{class:v}=h,g=(0,i._)(h,["class"]),m=Object.assign({class:(0,a.c)("kol-heading-group",v)},g);return(0,o.h)("hgroup",Object.assign({},m),(0,o.h)(s,Object.assign({class:(0,a.c)(d,"kol-headline--group","kol-headline--primary")},b),t),(0,o.h)(c,Object.assign({level:r},u),n))}},9818:(e,t,n)=>{n.d(t,{K:()=>s,a:()=>r});var i=n(4600),o=n(6970),a=n(5278);const l=e=>{const{ariaDescribedBy:t,hideLabel:n,label:l,suggestions:r,value:s}=e,c=(0,i._)(e,["ariaDescribedBy","hideLabel","label","suggestions","value"]),d=Object.assign(Object.assign({type:"text",list:r?`${c.id}-list`:void 0},(0,a.g)({ariaDescribedBy:t,hideLabel:n,label:l})),c);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},d,{value:s})),r)},r=e=>{var{id:t,suggestions:n}=e,a=(0,i._)(e,["id","suggestions"]);return n?(0,o.h)("datalist",Object.assign({id:`${t}-list`},a),n.map((e=>(0,o.h)("option",{value:e})))):null},s=e=>{var{state:t}=e,n=(0,i._)(e,["state"]);return(0,o.h)(l,Object.assign({},function(e){const{ariaDescribedBy:t}=(0,a.a)(e),n={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:t};return"_type"in e&&(n.type=e._type),"_value"in e&&(n.value=e._value),"_required"in e&&(n.required=e._required),"_maxLength"in e&&(n.maxlength=e._maxLength),"_placeholder"in e&&(n.placeholder=e._placeholder),"_autoComplete"in e&&(n.autoComplete=e._autoComplete),"_spellCheck"in e&&(n.spellcheck=e._spellCheck),"_pattern"in e&&(n.pattern=e._pattern),"_readOnly"in e&&(n.readOnly=e._readOnly),"_min"in e&&(n.min=e._min),"_max"in e&&(n.max=e._max),"_step"in e&&(n.step=e._step),"_multiple"in e&&(n.multiple=e._multiple),"_checked"in e&&(n.checked=e._checked),"_indeterminate"in e&&(n.indeterminate=e._indeterminate),"_suggestions"in e&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(n.suggestions=(0,o.h)(r,{id:e._id,suggestions:e._suggestions})),n}(t),n))}},3708:(e,t,n)=>{n.d(t,{I:()=>h,a:()=>u,b:()=>r,f:()=>d,v:()=>s});var i=n(8019),o=n(5800),a=n(1074);const l=e=>{if("object"==typeof e&&null!==e){if("string"==typeof e.label&&e.label.length>0)return e.disabled=!0===e.disabled,e.label=`${e.label}`.trim(),!1===(0,a.b)(e.label,3)&&!1===(0,a.c)(e.label)&&(0,o.a)(`A differing Aria-Label (${e.label}) is not accessible. A differing Aria-Label should consist of at least three readable characters.`),!Array.isArray(e.options)||void 0===e.options.find((e=>!1===l(e)));if("number"==typeof e.label)return!0}return!1},r=(e,t,n={})=>{(0,o.g)(e,"_options",(e=>"object"==typeof e&&null!==e&&"string"==typeof e.label&&e.label.length>0),t,void 0,n)},s=(e,t,n={})=>{(0,o.g)(e,"_options",l,t,void 0,n)},c=["horizontal","vertical"],d=(e,t,n="")=>{t.forEach(((t,i)=>{const o=`${n}-${i}`;"object"==typeof t&&null!==t&&"string"==typeof t.label&&t.label.length>0&&(Array.isArray(t.options)?d(e,t.options,o):e.set(o,t))}))};class h extends i.I{constructor(e,t,n){super(e,t,n),this.component=e}validateRequired(e){((e,t)=>{(0,o.b)(e,"_required",t)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateRequired(this.component._required)}}class u extends h{constructor(e,t,n){super(e,t,n),this.keyOptionMap=new Map,this.getOptionByKey=e=>this.keyOptionMap.get(e),this.afterPatchOptions=(e,t,n,i)=>{"_value"===i&&this.setFormAssociatedValue(e)},this.beforePatchOptions=(e,t)=>{const n=t.has("_options")?t.get("_options"):this.component.state._options;Array.isArray(n)&&n.length>0&&(this.keyOptionMap.clear(),d(this.keyOptionMap,n))},this.component=e}validateOrientation(e){(0,o.w)(this.component,"_orientation",(e=>"string"==typeof e&&c.includes(e)),new Set([`Orientation {${c.join(", ")}`]),e,{defaultValue:"vertical"})}validateOptions(e){r(this.component,e,{hooks:{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions}})}validateValue(e){e=(0,o.m)(e),e=Array.isArray(e)?e[0]:e,(0,o.s)(this.component,"_value",e,{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions})}componentWillLoad(){super.componentWillLoad(),this.validateOrientation(this.component._orientation),this.validateOptions(this.component._options),this.validateValue(this.component._value)}}},2909:(e,t,n)=>{n.d(t,{a:()=>r,p:()=>s});var i=n(7767),o=n(5800),a=n(1732);const l=e=>{for((0,a.a)()&&((0,o.j)("↓ Search form element start."),a.L.debug(e));e instanceof HTMLElement&&"FORM"!==e.tagName&&e.tagName!==i.h.toUpperCase();){try{e=e.parentElement instanceof HTMLElement?e.parentElement:e.parentNode instanceof ShadowRoot?e.parentNode.host:null}catch(e){}(0,a.a)()&&(a.L.debug(e),(0,o.j)("↑ Search form element finished."))}return e},r=(e={})=>{var t,n;const a=l(e.form);if(a instanceof HTMLElement){const e=new Event("reset",{bubbles:!0,cancelable:!0});if("FORM"===a.tagName)(0,o.q)(e,a),a.dispatchEvent(e);else if(a.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",a));const i=a;"function"==typeof(null===(t=i._on)||void 0===t?void 0:t.onReset)&&(null===(n=i._on)||void 0===n||n.onReset(e))}}},s=(e={})=>{const t=l(e.form);if(t instanceof HTMLElement){const e=new SubmitEvent("submit",{bubbles:!0,cancelable:!0,submitter:t});if("FORM"===t.tagName)(0,a.a)()&&!1===t.noValidate&&(0,o.j)("If you have not focusable or hidden form fields in your form, you should enable noValidate for your form.",{force:!0}),setTimeout((()=>{"function"==typeof t.requestSubmit?t.requestSubmit():((0,o.q)(e,t),t.dispatchEvent(e))}));else if(t.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",t));const n=t;setTimeout((()=>{var t,i;"function"==typeof(null===(t=n._on)||void 0===t?void 0:t.onSubmit)&&(null===(i=n._on)||void 0===i||i.onSubmit(e))}))}}}},5278:(e,t,n)=>{n.d(t,{K:()=>k,a:()=>O,b:()=>v,g:()=>_});var i=n(4600),o=n(6970),a=n(9060),l=n(8615),r=n(3922),s=n(5687),c=n(7767),d=n(3584),h=n(5117),u=n(3641);const p=({hasExpertSlot:e,accessKey:t,shortKey:n,label:i})=>{if(e)return(0,o.h)("slot",{name:"expert"});if(!i)return null;if(!(0,l.i)(t)&&!(0,l.i)(n))return(0,o.h)("span",null,i);const a=(0,s.b)(t,n);return(0,o.h)(o.F,null,(0,o.h)(r.I,{badgeText:a,label:i})," ",(0,o.h)("span",{class:"access-key-hint","aria-hidden":"true"},a))},b=e=>{var{component:t="label",id:n,class:l,accessKey:r,shortKey:s,label:c,hideLabel:d,hasExpertSlot:h}=e,u=(0,i._)(e,["component","id","class","accessKey","shortKey","label","hideLabel","hasExpertSlot"]);const b=!h&&d;return(0,o.h)(t,Object.assign({},u,{class:(0,a.c)("input-label",l),id:b?void 0:`${n}-label`,hidden:b,htmlFor:n}),(0,o.h)("span",{class:"input-label-span"},(0,o.h)(p,{hasExpertSlot:h,accessKey:r,shortKey:s,label:c})))},v=e=>{var{id:t,class:n,hint:l}=e,r=(0,i._)(e,["id","class","hint"]);return l?(0,o.h)("span",Object.assign({class:(0,a.c)("hint",n),id:`${t}-hint`},r),l):null},g=e=>{var{currentLength:t,maxLength:n,class:l}=e,r=(0,i._)(e,["currentLength","maxLength","class"]);return(0,o.h)("span",Object.assign({class:(0,a.c)("counter",l)},r,{"aria-atomic":"true","aria-live":"polite","data-testid":"input-counter"}),t,n&&(0,o.h)(o.F,null,(0,o.h)("span",{"aria-label":(0,d.t)("kol-of"),role:"img"},"/"),n)," ",(0,o.h)("span",null,(0,d.t)("kol-characters")))},m=({id:e,align:t,badgeText:n,hideLabel:i,label:l,class:r})=>(0,o.h)(c.g,{"aria-hidden":"true",class:(0,a.c)("input-tooltip",r),_badgeText:n,_align:t,_id:i?`${e}-label`:void 0,_label:l});function f(e){return(null==e?void 0:e.type)&&{default:"msg-type-default",info:"msg-type-info",success:"msg-type-success",warning:"msg-type-warning",error:"msg-type-error"}[null==e?void 0:e.type]||""}const y=(e,t)=>{const{component:n="div",renderNoLabel:l,renderNoHint:r,anotherChildren:c,id:d,required:u,alert:p,disabled:y,class:_,msg:k,hideError:O,hideLabel:w,label:L,hint:x,accessKey:j,shortKey:K,tooltipAlign:S,counter:A,readOnly:z,touched:F,reverseLabelInput:E,formFieldLabelProps:P,formFieldHintProps:C,formFieldTooltipProps:T,formFieldMsgProps:q,formFieldCounterProps:H}=e,B=(0,i._)(e,["component","renderNoLabel","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideError","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","reverseLabelInput","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldCounterProps"]),I=!l,$=!r,M=(0,s.s)(L),N=function(e,t){return Boolean((null==e?void 0:e.description)&&(null==e?void 0:e.description.length)>0)&&(!0===t||"error"!==(null==e?void 0:e.type))}(k,F),R=(0,s.b)(j,K),V=!M&&w;let D={disabled:Boolean(y),required:Boolean(u),touched:Boolean(F),"hide-label":Boolean(w),"read-only":Boolean(z),"hidden-error":Boolean(O)};N&&(D=Object.assign(Object.assign({},D),{[(null==k?void 0:k.type)||"error"]:!0,[f(k)]:!0}));const W=[(0,o.h)(o.F,null,I&&(0,o.h)(b,Object.assign({},P||{},{id:d,hasExpertSlot:M,hideLabel:w,label:L,accessKey:j,shortKey:K})),$&&(0,o.h)(v,Object.assign({},C||{},{id:d,hint:x}))),(0,o.h)(o.F,null,t,V&&(0,o.h)(m,Object.assign({},T||{},{id:d,label:L,hideLabel:w,align:S,badgeText:R})))];return E&&W.reverse(),(0,o.h)(n,Object.assign({class:(0,a.c)("kol-input",D,_),role:"presentation"},B),W,N&&(0,o.h)(h.K,Object.assign({},q||{},{id:d,alert:p,msg:k,hideError:O})),A?(0,o.h)(g,Object.assign({},H||{},A)):null,c)};function _({ariaDescribedBy:e,hideLabel:t,label:n}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":t&&n?n:void 0}}const k=(e,t)=>{var{state:n}=e,a=(0,i._)(e,["state"]);return(0,o.h)(y,Object.assign({},function(e){const t={id:e._id,disabled:e._disabled,msg:(0,u.c)(e._msg),hint:e._hint,label:e._label,hideLabel:e._hideLabel,hideError:e._hideError,touched:e._touched,accessKey:e._accessKey,shortKey:e._shortKey};return"_required"in e&&(t.required=e._required),"_readOnly"in e&&(t.readOnly=e._readOnly),"_hasCounter"in e&&"_currentLength"in e&&(t.counter=e._hasCounter?{currentLength:e._currentLength}:void 0,t.counter&&"_maxLength"in e&&(t.counter.maxLength=e._maxLength)),t}(n),a),t)},O=e=>{var t,n;const i=Boolean("error"===(null===(t=e._msg)||void 0===t?void 0:t._type)&&e._msg._description&&(null===(n=e._msg._description)||void 0===n?void 0:n.length)>0)&&!0===e._touched,o="string"==typeof e._hint&&e._hint.length>0,a=[];return!0===i&&a.push(`${e._id}-error`),!0===o&&a.push(`${e._id}-hint`),{hasError:i,hasHint:o,ariaDescribedBy:a}}},8615:(e,t,n)=>{n.d(t,{i:()=>g});const i="object"==typeof n.g&&n.g&&n.g.Object===Object&&n.g;var o="object"==typeof self&&self&&self.Object===Object&&self;const a=(i||o||Function("return this")()).Symbol;var l=Object.prototype,r=l.hasOwnProperty,s=l.toString,c=a?a.toStringTag:void 0,d=Object.prototype.toString,h="[object Null]",u="[object Undefined]",p=a?a.toStringTag:void 0;const b=Array.isArray;var v="[object String]";function g(e){return"string"==typeof e||!b(e)&&function(e){return null!=e&&"object"==typeof e}(e)&&function(e){return null==e?void 0===e?u:h:p&&p in Object(e)?function(e){var t=r.call(e,c),n=e[c];try{e[c]=void 0;var i=!0}catch(e){}var o=s.call(e);return i&&(t?e[c]=n:delete e[c]),o}(e):function(e){return d.call(e)}(e)}(e)==v}},1744:(e,t,n)=>{n.r(t),n.d(t,{kol_input_radio:()=>h});var i=n(6970),o=n(9060),a=n(8125),l=n(3708),r=n(2909),s=n(5278),c=n(9818),d=(e,t,n)=>new Promise(((i,o)=>{var a=e=>{try{r(n.next(e))}catch(e){o(e)}},l=e=>{try{r(n.throw(e))}catch(e){o(e)}},r=e=>e.done?i(e.value):Promise.resolve(e.value).then(a,l);r((n=n.apply(e,t)).next())}));const h=class{getValue(){return d(this,null,(function*(){return this._value}))}kolFocus(){return d(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}getFormFieldProps(){return{state:this.state,component:"fieldset",formFieldLabelProps:{component:"legend",class:"block w-full mb-1 leading-normal"},class:(0,o.c)("kol-input-radio","fieldset",this.state._orientation),tooltipAlign:this._tooltipAlign,onClick:()=>{var e;return null===(e=this.inputRef)||void 0===e?void 0:e.focus()},alert:this.showAsAlert(),renderNoHint:!0,anotherChildren:(0,i.h)(s.b,{hint:this.state._hint}),hideLabel:!1}}render(){return(0,i.h)(s.K,Object.assign({key:"47937cec0b367bec192b63678d95c2318c49137f"},this.getFormFieldProps()),this.state._options.map(((e,t)=>this.renderOption(e,t))))}getOptionProps(e){const t={state:this.state,hint:e.hint,label:e.label,msg:void 0};return e.disabled&&(t.disabled=!0),t}getInputProps(e,t,n){const i=Object.assign(Object.assign({state:this.state,ref:this.state._value===e.value?this.catchRef:void 0,class:(0,o.c)("radio",{disabled:Boolean(this.state._disabled||e.disabled)}),"aria-label":this.state._hideLabel&&"string"==typeof e.label?e.label:void 0,type:"radio",name:this.state._name||this.state._id,value:`-${t}`,checked:n},this.controller.onFacade),{onChange:this.onChange,onClick:void 0,onInput:this.onInput,onKeyDown:this.onKeyDown.bind(this),onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1}});return e.disabled&&(i.disabled=!0),i}renderOption(e,t){const n=`${this.state._id}-${t}`,o=this.state._value===e.value;return(0,i.h)(s.K,Object.assign({key:n},this.getOptionProps(e),{renderNoLabel:!0}),(0,i.h)("div",{class:"radio-input-wrapper"},(0,i.h)(c.K,Object.assign({},this.getInputProps(e,t,o))),(0,i.h)("label",{class:"radio-label",htmlFor:`${n}`,style:{height:this.state._hideLabel?"0":void 0,margin:this.state._hideLabel?"0":void 0,padding:this.state._hideLabel?"0":void 0,visibility:this.state._hideLabel?"hidden":void 0}},(0,i.h)("span",null,(0,i.h)("span",{class:"radio-label-span-inner"},e.label)))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onInput=e=>{if(e.target instanceof HTMLInputElement){const t=this.controller.getOptionByKey(e.target.value);void 0!==t&&this.controller.onFacade.onInput(e,!0,t.value)}},this.onChange=e=>{if(e.target instanceof HTMLInputElement){const t=this.controller.getOptionByKey(e.target.value);void 0!==t&&(this.controller.onFacade.onChange(e,t.value),this._value=t.value)}},this.onKeyDown=e=>{"Enter"!==e.code&&"NumpadEnter"!==e.code||(0,r.p)({form:this.host,ref:this.inputRef})},this._accessKey=void 0,this._disabled=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._id=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._options=void 0,this._orientation="vertical",this._required=!1,this._shortKey=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_hideError:!1,_id:`id-${(0,a.n)()}`,_label:"",_options:[],_orientation:"vertical"},this.inputHasFocus=!1,this.controller=new l.a(this,"radio",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(e){this.controller.validateAccessKey(e)}validateTooltipAlign(e){this.controller.validateTooltipAlign(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHideError(e){this.controller.validateHideError(e)}validateHint(e){this.controller.validateHint(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateOptions(e){this.controller.validateOptions(e)}validateOrientation(e){this.controller.validateOrientation(e)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}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{_accessKey:["validateAccessKey"],_tooltipAlign:["validateTooltipAlign"],_disabled:["validateDisabled"],_hideLabel:["validateHideLabel"],_hideError:["validateHideError"],_hint:["validateHint"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_options:["validateOptions"],_orientation:["validateOrientation"],_required:["validateRequired"],_shortKey:["validateShortKey"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};h.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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 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  .required label > span::after,\n  .required legend > span::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  input,\n  textarea {\n    cursor: text;\n  }\n  input[type=checkbox],\n  input[type=color],\n  input[type=file],\n  input[type=radio],\n  input[type=range],\n  label,\n  option,\n  select {\n    cursor: pointer;\n  }\n  /* input[type='checkbox'], */\n  /* input[type='radio'], */\n  /* input[type='range'], */\n  input[type=color],\n  input[type=date],\n  input[type=datetime-local],\n  input[type=email],\n  input[type=file],\n  input[type=month],\n  input[type=number],\n  input[type=password],\n  input[type=search],\n  input[type=tel],\n  input[type=text],\n  input[type=time],\n  input[type=url],\n  input[type=week],\n  select,\n  select[multiple] option,\n  textarea {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: 100%;\n  }\n  /* needed hack for vertical alignment */\n  input[type=file] {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n  /* needed hack for vertical alignment */\n  select[multiple] option {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n  }\n  .input {\n    background-color: white;\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  :host {\n    --border-width: calc(2rem / var(--kolibri-root-font-size, 16));\n    --input-size: 1.5em;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input .icons {\n    display: none;\n  }\n  label {\n    cursor: pointer;\n  }\n  input {\n    appearance: none;\n    border-width: var(--border-width);\n    border-style: solid;\n    border-radius: 100%;\n    cursor: pointer;\n    display: flex;\n    height: var(--input-size);\n    margin: 0;\n    min-height: var(--input-size);\n    min-width: var(--input-size);\n    padding: 0;\n    width: var(--input-size);\n  }\n  input:before {\n    border-radius: 100%;\n    content: \"\";\n    margin: auto;\n    height: calc(var(--input-size) / 2);\n    width: calc(var(--input-size) / 2);\n  }\n  input:checked:before {\n    background-color: #000;\n  }\n  @media (forced-colors: active) {\n    input:checked:before {\n      /* Give it a visible background in forced colors mode */\n      background-color: selectedItem !important;\n    }\n  }\n  fieldset {\n    display: flex;\n  }\n  fieldset.vertical {\n    flex-direction: column;\n  }\n  fieldset .input-slot {\n    align-items: center;\n    display: flex;\n  }\n  /* required star is on fieldset legend */\n  .required label > span::after {\n    content: \"\";\n  }\n}"}},4600:(e,t,n)=>{function i(e,t){var n={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&t.indexOf(i)<0&&(n[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(i=Object.getOwnPropertySymbols(e);o<i.length;o++)t.indexOf(i[o])<0&&Object.prototype.propertyIsEnumerable.call(e,i[o])&&(n[i[o]]=e[i[o]])}return n}n.d(t,{_:()=>i}),"function"==typeof SuppressedError&&SuppressedError}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[1744],{4444:(e,n,t)=>{t.d(n,{K:()=>h});var i=t(4600),o=t(6783),l=t(9060),a=t(8625),r=t(5687),s=t(5650);const d=(e,n)=>{var{class:t}=e,a=(0,i._)(e,["class"]);return(0,o.h)("div",Object.assign({class:(0,l.c)("kol-field-control__input",t)},a),n)},c=(e,n)=>{const{class:t,id:c,disabled:h,label:u,hideLabel:p,labelAlign:b,renderNoTooltip:f,hint:m,renderNoHint:_,tooltipAlign:g,accessKey:v,shortKey:y,msg:k,touched:w,required:x,readonly:O,fieldControlInputProps:L,fieldControlLabelProps:z,fieldControlTooltipProps:A,fieldControlHintProps:K}=e,q=(0,i._)(e,["class","id","disabled","label","hideLabel","labelAlign","renderNoTooltip","hint","renderNoHint","tooltipAlign","accessKey","shortKey","msg","touched","required","readonly","fieldControlInputProps","fieldControlLabelProps","fieldControlTooltipProps","fieldControlHintProps"]),S=!_,B=!f,P=(0,s.c)(k,w),T=(0,r.s)(u),C=B&&!T&&p,j=(0,r.b)(v,y),F=[(0,o.h)(o.F,null,(0,o.h)(d,Object.assign({},L),n),C&&(0,o.h)(a.a,Object.assign({},A||{},{id:c,label:u,hideLabel:p,align:g,badgeText:j}))),(0,o.h)(a.b,Object.assign({},z||{},{id:c,baseClassName:"kol-field-control",class:(0,l.c)(null==z?void 0:z.class,{"kol-field-control__label--visually-hidden":Boolean(p)}),hasExpertSlot:T,label:u,accessKey:v,shortKey:y}))];"left"===b&&F.reverse();const I={"kol-field-control--disabled":Boolean(h),"kol-field-control--required":Boolean(x),"kol-field-control--touched":Boolean(w),"kol-field-control--hide-label":Boolean(p),"kol-field-control--read-only":Boolean(O),[`kol-field-control--${(null==k?void 0:k.type)||"error"}`]:Boolean(P),[`kol-field-control--label-align-${b}`]:Boolean(b)};return(0,o.h)("div",Object.assign({class:(0,l.c)("kol-field-control",I,t)},q),F,S&&(0,o.h)(a.c,Object.assign({},K||{},{baseClassName:"kol-field-control",id:c,hint:m})))},h=(e,n)=>{var{state:t}=e,l=(0,i._)(e,["state"]);return(0,o.h)(c,Object.assign({},function(e){const n={accessKey:e._accessKey,shortKey:e._shortKey,id:e._id,disabled:e._disabled,msg:(0,s.a)(e._msg),hint:e._hint,label:e._label,hideLabel:e._hideLabel,touched:e._touched};return"_required"in e&&(n.required=e._required),"_readOnly"in e&&(n.readonly=e._readOnly),"_labelAlign"in e&&(n.labelAlign=e._labelAlign),n}(t),l),n)}},3163:(e,n,t)=>{t.d(n,{K:()=>s});var i=t(4600),o=t(6783),l=t(9060),a=t(8625),r=t(5650);const s=e=>{const{class:n,msg:t,required:s,disabled:d,touched:c,readonly:h,ariaDescribedBy:u,hideLabel:p,label:b,suggestions:f,value:m}=e,_=(0,i._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),g=(0,r.c)(t,c),v={"kol-input--disabled":Boolean(d),"kol-input--required":Boolean(s),"kol-input--touched":Boolean(c),"kol-input--readonly":Boolean(h),[`kol-input--${(null==t?void 0:t.type)||"error"}`]:g},y=Object.assign(Object.assign({class:(0,l.c)("kol-input",v,n),required:s,disabled:d,readonly:h,type:"text",list:f?`${_.id}-list`:void 0},(0,a.d)({ariaDescribedBy:u,hideLabel:p,label:b})),_);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},y,{value:m})),f)}},7146:(e,n,t)=>{t.d(n,{K:()=>d,a:()=>s});var i=t(4600),o=t(6783),l=t(8625),a=t(3163),r=t(5650);const s=e=>{var{id:n,suggestions:t}=e,l=(0,i._)(e,["id","suggestions"]);return t?(0,o.h)("datalist",Object.assign({id:`${n}-list`},l),t.map((e=>(0,o.h)("option",{value:e})))):null},d=e=>{var{state:n,customSuggestions:t}=e,d=(0,i._)(e,["state","customSuggestions"]);return(0,o.h)(a.K,Object.assign({},function(e,n){const{ariaDescribedBy:t}=(0,l.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,r.a)(e._msg)),"_suggestions"in e&&!n&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(i.suggestions=(0,o.h)(s,{id:e._id,suggestions:e._suggestions})),i}(n,t),d))}},9574:(e,n,t)=>{t.d(n,{a:()=>r,p:()=>s});var i=t(7662),o=t(5800),l=t(1732);const a=e=>{for((0,l.a)()&&((0,o.j)("↓ Search form element start."),l.L.debug(e));e instanceof HTMLElement&&"FORM"!==e.tagName&&e.tagName!==i.h.toUpperCase();){try{e=e.parentElement instanceof HTMLElement?e.parentElement:e.parentNode instanceof ShadowRoot?e.parentNode.host:null}catch(e){}(0,l.a)()&&(l.L.debug(e),(0,o.j)("↑ Search form element finished."))}return e},r=(e={})=>{var n,t;const l=a(e.form);if(l instanceof HTMLElement){const e=new Event("reset",{bubbles:!0,cancelable:!0});if("FORM"===l.tagName)(0,o.q)(e,l),l.dispatchEvent(e);else if(l.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",l));const i=l;"function"==typeof(null===(n=i._on)||void 0===n?void 0:n.onReset)&&(null===(t=i._on)||void 0===t||t.onReset(e))}}},s=(e={})=>{const n=a(e.form);if(n instanceof HTMLElement){const e=new SubmitEvent("submit",{bubbles:!0,cancelable:!0,submitter:n});if("FORM"===n.tagName)(0,l.a)()&&!1===n.noValidate&&(0,o.j)("If you have not focusable or hidden form fields in your form, you should enable noValidate for your form.",{force:!0}),setTimeout((()=>{"function"==typeof n.requestSubmit?n.requestSubmit():((0,o.q)(e,n),n.dispatchEvent(e))}));else if(n.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",n));const t=n;setTimeout((()=>{var n,i;"function"==typeof(null===(n=t._on)||void 0===n?void 0:n.onSubmit)&&(null===(i=t._on)||void 0===i||i.onSubmit(e))}))}}}},7358:(e,n,t)=>{t.d(n,{I:()=>h,a:()=>u,b:()=>r,f:()=>c,v:()=>s});var i=t(8625),o=t(5800),l=t(1074);const a=e=>{if("object"==typeof e&&null!==e){if("string"==typeof e.label&&e.label.length>0)return e.disabled=!0===e.disabled,e.label=`${e.label}`.trim(),!1===(0,l.b)(e.label,3)&&!1===(0,l.c)(e.label)&&(0,o.a)(`A differing Aria-Label (${e.label}) is not accessible. A differing Aria-Label should consist of at least three readable characters.`),!Array.isArray(e.options)||void 0===e.options.find((e=>!1===a(e)));if("number"==typeof e.label)return!0}return!1},r=(e,n,t={})=>{(0,o.g)(e,"_options",(e=>"object"==typeof e&&null!==e&&"string"==typeof e.label&&e.label.length>0),n,void 0,t)},s=(e,n,t={})=>{(0,o.g)(e,"_options",a,n,void 0,t)},d=["horizontal","vertical"],c=(e,n,t="")=>{n.forEach(((n,i)=>{const o=`${t}-${i}`;"object"==typeof n&&null!==n&&"string"==typeof n.label&&n.label.length>0&&(Array.isArray(n.options)?c(e,n.options,o):e.set(o,n))}))};class h extends i.I{constructor(e,n,t){super(e,n,t),this.component=e}validateRequired(e){((e,n)=>{(0,o.b)(e,"_required",n)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateRequired(this.component._required)}}class u extends h{constructor(e,n,t){super(e,n,t),this.keyOptionMap=new Map,this.getOptionByKey=e=>this.keyOptionMap.get(e),this.afterPatchOptions=(e,n,t,i)=>{"_value"===i&&this.setFormAssociatedValue(e)},this.beforePatchOptions=(e,n)=>{const t=n.has("_options")?n.get("_options"):this.component.state._options;Array.isArray(t)&&t.length>0&&(this.keyOptionMap.clear(),c(this.keyOptionMap,t))},this.component=e}validateOrientation(e){(0,o.w)(this.component,"_orientation",(e=>"string"==typeof e&&d.includes(e)),new Set([`Orientation {${d.join(", ")}`]),e,{defaultValue:"vertical"})}validateOptions(e){r(this.component,e,{hooks:{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions}})}validateValue(e){e=(0,o.m)(e),e=Array.isArray(e)?e[0]:e,(0,o.s)(this.component,"_value",e,{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions})}componentWillLoad(){super.componentWillLoad(),this.validateOrientation(this.component._orientation),this.validateOptions(this.component._options),this.validateValue(this.component._value)}}},1744:(e,n,t)=>{t.r(n),t.d(n,{kol_input_radio:()=>u});var i=t(6783),o=t(9060),l=t(7336),a=t(7358),r=t(9574),s=t(8625),d=t(7146),c=t(4444),h=(e,n,t)=>new Promise(((i,o)=>{var l=e=>{try{r(t.next(e))}catch(e){o(e)}},a=e=>{try{r(t.throw(e))}catch(e){o(e)}},r=e=>e.done?i(e.value):Promise.resolve(e.value).then(l,a);r((t=t.apply(e,n)).next())}));const u=class{getValue(){return h(this,null,(function*(){return this._value}))}kolFocus(){return h(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}getFormFieldProps(){return{state:this.state,component:"fieldset",class:(0,o.c)("kol-form-field--radio"),formFieldLabelProps:{component:"legend",class:"kol-form-field__label--legend"},formFieldInputProps:{class:`kol-form-field__input--orientation-${this.state._orientation}`},tooltipAlign:this._tooltipAlign,alert:this.showAsAlert(),hideLabel:!1}}render(){return(0,i.h)(s.K,Object.assign({key:"d0a65a6642e9adc5ac017d8d42f1e867fa2ba0f6"},this.getFormFieldProps()),this.state._options.map(((e,n)=>this.renderOption(e,n))))}getOptionProps(e,n){const t={state:this.state,id:n,hint:e.hint,label:e.label,required:!1,fieldControlLabelProps:{showBadge:!1}};return e.disabled&&(t.disabled=!0),t}getInputProps(e,n,t,i){const l=Object.assign(Object.assign({state:this.state,id:n,ref:this.state._value===e.value?this.catchRef:void 0,class:(0,o.c)("kol-input-radio",{"kol-input-radio--disabled":Boolean(this.state._disabled||e.disabled)}),"aria-label":this.state._hideLabel&&"string"==typeof e.label?e.label:void 0,type:"radio",name:this.state._name||this.state._id,value:`-${t}`,checked:i},this.controller.onFacade),{onChange:this.onChange,onClick:void 0,onInput:this.onInput,onKeyDown:this.onKeyDown.bind(this),onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1}});return e.disabled&&(l.disabled=!0),l}renderOption(e,n){const t=`${this.state._id}-${n}`,o=this.state._value===e.value;return(0,i.h)(c.K,Object.assign({key:t},this.getOptionProps(e,t)),(0,i.h)(d.K,Object.assign({},this.getInputProps(e,t,n,o))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onInput=e=>{if(e.target instanceof HTMLInputElement){const n=this.controller.getOptionByKey(e.target.value);void 0!==n&&this.controller.onFacade.onInput(e,!0,n.value)}},this.onChange=e=>{if(e.target instanceof HTMLInputElement){const n=this.controller.getOptionByKey(e.target.value);void 0!==n&&(this.controller.onFacade.onChange(e,n.value),this._value=n.value)}},this.onKeyDown=e=>{"Enter"!==e.code&&"NumpadEnter"!==e.code||(0,r.p)({form:this.host,ref:this.inputRef})},this._accessKey=void 0,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._id=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._options=void 0,this._orientation="vertical",this._required=!1,this._shortKey=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_hideMsg:!1,_id:`id-${(0,l.n)()}`,_label:"",_options:[],_orientation:"vertical"},this.inputHasFocus=!1,this.controller=new a.a(this,"radio",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(e){this.controller.validateAccessKey(e)}validateTooltipAlign(e){this.controller.validateTooltipAlign(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHideMsg(e){this.controller.validateHideMsg(e)}validateHint(e){this.controller.validateHint(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateOptions(e){this.controller.validateOptions(e)}validateOrientation(e){this.controller.validateOrientation(e)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}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{_accessKey:["validateAccessKey"],_tooltipAlign:["validateTooltipAlign"],_disabled:["validateDisabled"],_hideLabel:["validateHideLabel"],_hideMsg:["validateHideMsg"],_hint:["validateHint"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_options:["validateOptions"],_orientation:["validateOrientation"],_required:["validateRequired"],_shortKey:["validateShortKey"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};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    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-field-control {\n    min-height: var(--a11y-min-size);\n    display: grid;\n    grid-template-columns: auto 1fr;\n    grid-template-areas: "input label";\n    grid-template-rows: auto;\n    align-items: center;\n    justify-content: left;\n  }\n  .kol-field-control:has(.kol-field-control__hint) {\n    grid-template-columns: auto 1fr;\n    grid-template-areas: "input label" "hint hint";\n    grid-template-rows: auto auto;\n  }\n  .kol-field-control--label-align-left:not(.kol-field-control--hide-label) {\n    grid-template-columns: 1fr auto;\n    grid-template-areas: "label input";\n    grid-template-rows: auto;\n  }\n  .kol-field-control--label-align-left:not(.kol-field-control--hide-label):has(.kol-field-control__hint) {\n    grid-template-columns: 1fr auto;\n    grid-template-areas: "label input" "hint hint";\n    grid-template-rows: auto auto;\n  }\n  .kol-field-control__input {\n    grid-area: input;\n    display: flex;\n    min-height: var(--a11y-min-size);\n    align-items: center;\n  }\n  .kol-field-control__label {\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    flex-grow: 1;\n    grid-area: label;\n    min-height: var(--a11y-min-size);\n  }\n  .kol-field-control__label--visually-hidden {\n    height: 0;\n    margin: 0;\n    padding: 0;\n    visibility: hidden;\n  }\n  .kol-field-control__label-text::after {\n    content: "";\n  }\n  .kol-field-control__tooltip .span-label::after {\n    content: "";\n  }\n  .kol-field-control__hint {\n    grid-area: hint;\n  }\n  .kol-field-control--disabled .kol-field-control__label {\n    cursor: not-allowed;\n    opacity: 0.5;\n  }\n  .kol-field-control--required .kol-field-control__label-text::after {\n    content: "*";\n  }\n  .kol-field-control--required .kol-field-control__tooltip .span-label::after {\n    content: "*";\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-form-field {\n    --border-width: calc(2rem / var(--kolibri-root-font-size, 16));\n    --input-size: 1.5em;\n  }\n  .kol-form-field__label {\n    display: contents;\n  }\n  .kol-form-field__input {\n    display: flex;\n    flex-direction: column;\n  }\n  .kol-form-field__input--orientation-horizontal {\n    flex-direction: row;\n    flex-wrap: wrap;\n    align-items: flex-start;\n  }\n  .kol-form-field--disabled {\n    opacity: unset;\n  }\n  .kol-input-radio {\n    appearance: none;\n    border-width: var(--border-width);\n    border-style: solid;\n    border-radius: 100%;\n    cursor: pointer;\n    display: flex;\n    height: var(--input-size);\n    margin: 0;\n    min-height: var(--input-size);\n    min-width: var(--input-size);\n    padding: 0;\n    width: var(--input-size);\n  }\n  .kol-input-radio:before {\n    border-radius: 100%;\n    content: "";\n    margin: auto;\n    height: calc(var(--input-size) / 2);\n    width: calc(var(--input-size) / 2);\n  }\n  .kol-input-radio:checked:before {\n    background-color: #000;\n  }\n  @media (forced-colors: active) {\n    .kol-input-radio:checked:before {\n      /* Give it a visible background in forced colors mode */\n      background-color: selectedItem !important;\n    }\n  }\n  .kol-input-radio:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n}'}}}]);

package/dist/1791.js

@@ -1,2 +1,2 @@
 /*! For license information please see 1791.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[1791],{1791:(n,e,t)=>{t.r(e),t.d(e,{kol_skip_nav:()=>r});var i=t(6970),a=t(1820),o=t(5606),l=t(7767),s=t(1074);const r=class{constructor(n){(0,i.r)(this,n),this._label=void 0,this._links=void 0,this.state={_label:"",_links:[]}}render(){return(0,i.h)("nav",{key:"82d952489df5fdb81bf65f721cd887518f5f65a7",class:"kol-skip-nav","aria-label":this.state._label},(0,i.h)("ul",{key:"8960f8d4cfcade4414147bf68d3f5cfa93ae0cda",class:"kol-skip-nav__list"},this.state._links.map(((n,e)=>(0,i.h)("li",{class:"kol-skip-nav__list-item",key:e},(0,i.h)(l.f,Object.assign({},n)))))))}validateLabel(n,e,t=!1){t||(0,a.r)(this.state._label),(0,s.v)(this,n,{required:!0}),(0,a.a)(this.state._label)}validateLinks(n){(0,o.w)("KolSkipNav",this,n)}componentWillLoad(){this.validateLabel(this._label,void 0,!0),this.validateLinks(this._links)}disconnectedCallback(){(0,a.r)(this.state._label)}static get watchers(){return{_label:["validateLabel"],_links:["validateLinks"]}}};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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 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-skip-nav {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-skip-nav__list {\n    display: grid;\n    list-style: none;\n    place-items: center;\n  }\n  .kol-skip-nav__list-item {\n    height: 0;\n  }\n  .kol-skip-nav .kol-link {\n    left: calc(-99999rem / var(--kolibri-root-font-size, 16));\n    overflow: hidden;\n    position: absolute;\n    z-index: 9999999;\n    line-height: 1;\n  }\n  .kol-skip-nav .kol-link:focus {\n    background-color: #fff;\n    left: unset;\n    position: unset;\n  }\n}"}},1074:(n,e,t)=>{t.d(e,{a:()=>c,b:()=>s,c:()=>r,h:()=>a,v:()=>h});var i=t(5800);const a=[0,1,2,3,4,5,6],o=/[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(o))||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,i.w)(n,"_label",(n=>"string"==typeof n),d,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,a,o)=>{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,a,o)),"string"==typeof e&&!1===s(e,3)&&!1===r(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=n.hooks)||void 0===e?void 0:e.beforePatch}})}(t))},c=h},1820:(n,e,t)=>{t.d(e,{a:()=>o,r:()=>l});var i=t(1732);const a=new Set;function o(n){a.has(n)?i.L.error(`There already is a nav element with the label "${n}"`,{forceLog:!0}):a.add(n)}function l(n){a.delete(n)}},5606:(n,e,t)=>{t.d(e,{w:()=>a});var i=t(5800);const a=(n,e,t)=>{(0,i.g)(e,"_links",(n=>"object"==typeof n&&("string"==typeof n._href||"string"==typeof n._label)),t),(0,i.h)(n,e.state._links.length)}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[1791],{1791:(n,e,t)=>{t.r(e),t.d(e,{kol_skip_nav:()=>r});var i=t(6783),a=t(1820),o=t(5606),l=t(7662),s=t(1074);const r=class{constructor(n){(0,i.r)(this,n),this._label=void 0,this._links=void 0,this.state={_label:"",_links:[]}}render(){return(0,i.h)("nav",{key:"bdb9b836ec6c9f4bb0d2e72a2e3779be9013f069",class:"kol-skip-nav","aria-label":this.state._label},(0,i.h)("ul",{key:"a29040214a801b13f3e6ad81b6c42d7ad685e38e",class:"kol-skip-nav__list"},this.state._links.map(((n,e)=>(0,i.h)("li",{class:"kol-skip-nav__list-item",key:e},(0,i.h)(l.f,Object.assign({},n)))))))}validateLabel(n,e,t=!1){t||(0,a.r)(this.state._label),(0,s.v)(this,n,{required:!0}),(0,a.a)(this.state._label)}validateLinks(n){(0,o.w)("KolSkipNav",this,n)}componentWillLoad(){this.validateLabel(this._label,void 0,!0),this.validateLinks(this._links)}disconnectedCallback(){(0,a.r)(this.state._label)}static get watchers(){return{_label:["validateLabel"],_links:["validateLinks"]}}};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-skip-nav {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-skip-nav__list {\n    display: grid;\n    list-style: none;\n    place-items: center;\n  }\n  .kol-skip-nav__list-item {\n    height: 0;\n  }\n  .kol-skip-nav .kol-link {\n    left: calc(-99999rem / var(--kolibri-root-font-size, 16));\n    overflow: hidden;\n    position: absolute;\n    z-index: 9999999;\n    line-height: 1;\n  }\n  .kol-skip-nav .kol-link:focus {\n    background-color: #fff;\n    left: unset;\n    position: unset;\n  }\n}"}},1074:(n,e,t)=>{t.d(e,{a:()=>c,b:()=>s,c:()=>r,h:()=>a,v:()=>h});var i=t(5800);const a=[0,1,2,3,4,5,6],o=/[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(o))||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,i.w)(n,"_label",(n=>"string"==typeof n),d,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,a,o)=>{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,a,o)),"string"==typeof e&&!1===s(e,3)&&!1===r(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=n.hooks)||void 0===e?void 0:e.beforePatch}})}(t))},c=h},1820:(n,e,t)=>{t.d(e,{a:()=>o,r:()=>l});var i=t(1732);const a=new Set;function o(n){a.has(n)?i.L.error(`There already is a nav element with the label "${n}"`,{forceLog:!0}):a.add(n)}function l(n){a.delete(n)}},5606:(n,e,t)=>{t.d(e,{w:()=>a});var i=t(5800);const a=(n,e,t)=>{(0,i.g)(e,"_links",(n=>"object"==typeof n&&("string"==typeof n._href||"string"==typeof n._label)),t),(0,i.h)(n,e.state._links.length)}}}]);

package/dist/2078.js

@@ -1,2 +1,2 @@
 /*! For license information please see 2078.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[2078],{2078:(n,e,t)=>{t.r(e),t.d(e,{kol_tree_item:()=>a});var i=t(6970),o=t(7767),l=(n,e,t)=>new Promise(((i,o)=>{var l=n=>{try{r(t.next(n))}catch(n){o(n)}},a=n=>{try{r(t.throw(n))}catch(n){o(n)}},r=n=>n.done?i(n.value):Promise.resolve(n.value).then(l,a);r((t=t.apply(n,e)).next())}));const a=class{constructor(n){(0,i.r)(this,n),this._active=void 0,this._label=void 0,this._open=void 0,this._href=void 0}focusLink(){return l(this,null,(function*(){this.element&&(yield this.element.focusLink())}))}expand(){return l(this,null,(function*(){this.element&&(yield this.element.expand())}))}collapse(){return l(this,null,(function*(){this.element&&(yield this.element.collapse())}))}isOpen(){return l(this,null,(function*(){var n,e;return null!==(e=yield null===(n=this.element)||void 0===n?void 0:n.isOpen())&&void 0!==e&&e}))}render(){return(0,i.h)(o.o,{key:"ad7c1e6721135ae63af2e1de4f5b21bbfc8ccb13",_active:this._active,_label:this._label,_open:this._open,_href:this._href,ref:n=>this.element=n},(0,i.h)("slot",{key:"85e23379c85e6623a8a4a4de24a62fd1b6b13175"}))}};a.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 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-tree-item {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tree-item__link .kol-link {\n    padding-right: calc(6rem / var(--kolibri-root-font-size, 16));\n    padding-left: calc((22.4rem / var(--kolibri-root-font-size, 16)) * var(--level));\n    padding-top: calc(6.4rem / var(--kolibri-root-font-size, 16));\n    padding-bottom: calc(6.4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tree-item__link--first-level .kol-link {\n    padding-left: calc(6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tree-item__children {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n  .kol-tree-item .kol-span {\n    place-items: unset;\n  }\n}"}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[2078],{2078:(n,e,t)=>{t.r(e),t.d(e,{kol_tree_item:()=>a});var i=t(6783),o=t(7662),l=(n,e,t)=>new Promise(((i,o)=>{var l=n=>{try{r(t.next(n))}catch(n){o(n)}},a=n=>{try{r(t.throw(n))}catch(n){o(n)}},r=n=>n.done?i(n.value):Promise.resolve(n.value).then(l,a);r((t=t.apply(n,e)).next())}));const a=class{constructor(n){(0,i.r)(this,n),this._active=void 0,this._label=void 0,this._open=void 0,this._href=void 0}focusLink(){return l(this,null,(function*(){this.element&&(yield this.element.focusLink())}))}expand(){return l(this,null,(function*(){this.element&&(yield this.element.expand())}))}collapse(){return l(this,null,(function*(){this.element&&(yield this.element.collapse())}))}isOpen(){return l(this,null,(function*(){var n,e;return null!==(e=yield null===(n=this.element)||void 0===n?void 0:n.isOpen())&&void 0!==e&&e}))}render(){return(0,i.h)(o.o,{key:"59e322059558664a9ca5d03a7a98bafa9b84cb98",_active:this._active,_label:this._label,_open:this._open,_href:this._href,ref:n=>this.element=n},(0,i.h)("slot",{key:"728328010d981a229607662273528d35587ef1e4"}))}};a.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 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-tree-item {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tree-item__link .kol-link {\n    padding-right: calc(6rem / var(--kolibri-root-font-size, 16));\n    padding-left: calc((22.4rem / var(--kolibri-root-font-size, 16)) * var(--level));\n    padding-top: calc(6.4rem / var(--kolibri-root-font-size, 16));\n    padding-bottom: calc(6.4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tree-item__link--first-level .kol-link {\n    padding-left: calc(6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tree-item__children {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n  .kol-tree-item .kol-span {\n    place-items: unset;\n  }\n}"}}}]);

package/dist/2115.js

@@ -1,2 +1,2 @@
 /*! For license information please see 2115.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[2115],{1560:(e,t,n)=>{n.d(t,{g:()=>i});const i=e=>{var t,n;const i=Boolean("error"===(null===(t=e._msg)||void 0===t?void 0:t._type)&&e._msg._description&&(null===(n=e._msg._description)||void 0===n?void 0:n.length)>0)&&!0===e._touched,o="string"==typeof e._hint&&e._hint.length>0,s=[];return!0===i&&s.push(`${e._id}-error`),!0===o&&s.push(`${e._id}-hint`),{hasError:i,hasHint:o,ariaDescribedBy:s}}},6809:(e,t,n)=>{n.d(t,{I:()=>r});var i=n(8019),o=n(8973),s=n(5800),a=n(608);const l=(e,t)=>{const n=e;"object"==typeof n&&null!==n&&((0,a.i)(n.right,1)&&(n.right={icon:n.right}),(0,a.i)(n.left,1)&&(n.left={icon:n.left}),t.set("_icons",n))};class r extends i.I{constructor(e,t,n){super(e,t,n),this.component=e}validateIcons(e){(0,s.o)(e,(()=>{try{e=(0,s.p)(e)}catch(e){}(0,s.w)(this.component,"_icons",(e=>"object"==typeof e&&null!==e&&((0,a.i)(e.left,1)||(0,o.i)(e.left)||(0,a.i)(e.right,1)||(0,o.i)(e.right))),new Set(["KoliBriHorizontalIcon"]),e,{hooks:{beforePatch:l},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcons(this.component._icons)}}},8973:(e,t,n)=>{n.d(t,{i:()=>a,v:()=>l});var i=n(5800),o=n(608);const s=(e,t,n)=>{(0,o.b)(n)?e[t]=n:(0,o.i)(n,1)&&(e[t]={icon:n})},a=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),l=(e,t,n={})=>{(0,i.o)(t,(()=>{var l;try{t=(0,i.p)(t)}catch(e){}(0,i.w)(e,"_icons",(e=>{const t="object"==typeof e&&null!==e&&0===Object.keys(e).length;return null===e||t||(0,o.i)(e,1)||"object"==typeof e&&null!==e&&((0,o.i)(e.left,1)||a(e.left)||(0,o.i)(e.right,1)||a(e.right)||(0,o.i)(e.top,1)||a(e.top)||(0,o.i)(e.bottom,1)||a(e.bottom))}),new Set(["KoliBriIcon"]),t,Object.assign(Object.assign({},n),{defaultValue:{},hooks:{afterPatch:null===(l=n.hooks)||void 0===l?void 0:l.afterPatch,beforePatch:(e,t,i,a)=>{var l,r;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.beforePatch)&&(null===(r=n.hooks)||void 0===r||r.beforePatch(e,t,i,a)),(e=>{var t,n,i;if(null===(t=e.nextState)||void 0===t?void 0:t.has("_icons")){const t=null===(n=e.nextState)||void 0===n?void 0:n.get("_icons");null===(i=e.nextState)||void 0===i||i.set("_icons",(e=>{let t={};return(0,o.i)(e,1)?t={left:{icon:e}}:"object"==typeof e&&null!==e&&(s(t,"top",e.top),s(t,"right",e.right),s(t,"bottom",e.bottom),s(t,"left",e.left)),t})(t))}})(i)}}}))}))}},2115:(e,t,n)=>{n.r(t),n.d(t,{kol_combobox:()=>f});var i=n(6970),o=n(8125),s=n(6809),a=n(5800),l=n(623),r=n(7767),d=n(1560),h=n(3584),c=n(9060),u=n(3922),p=n(5687),b=(e,t,n)=>new Promise(((i,o)=>{var s=e=>{try{l(n.next(e))}catch(e){o(e)}},a=e=>{try{l(n.throw(e))}catch(e){o(e)}},l=e=>e.done?i(e.value):Promise.resolve(e.value).then(s,a);l((n=n.apply(e,t)).next())}));class g extends s.I{constructor(e,t,n){super(e,t,n),this.component=e}validatePlaceholder(e){(0,a.i)(this.component,"_placeholder",e)}validateRequired(e){(0,a.b)(this.component,"_required",e)}validateSuggestions(e){(0,l.v)(this.component,e)}validateValue(e){(0,a.i)(this.component,"_value",e)}componentWillLoad(){super.componentWillLoad(),this.validatePlaceholder(this.component._placeholder),this.validateRequired(this.component._required),this.validateSuggestions(this.component._suggestions),this.validateValue(this.component._value)}}const f=class{getValue(){return b(this,null,(function*(){return this.state._value}))}kolFocus(){return b(this,null,(function*(){var e;null===(e=this.refInput)||void 0===e||e.focus()}))}selectOption(e,t){var n;this.controller.onFacade.onInput(e,!0,t),this.controller.onFacade.onChange(e,t),this.controller.setFormAssociatedValue(t),this.state._value=t,null===(n=this.refInput)||void 0===n||n.focus()}onInput(e){const t=e.target;this.state._value=t.value,this._value=t.value,this.controller.onFacade.onInput(e),this.setFilteredSuggestionsByQuery(t.value),this._focusedOptionIndex=-1}handleKeyDownDropdown(e){1===e.key.length&&/[a-z0-9]/i.test(e.key)&&(this._isOpen=!0,this.focusSuggestionStartingWith(e.key))}setFilteredSuggestionsByQuery(e){""===e.trim()?this._filteredSuggestions=[...this._suggestions]:(this._filteredSuggestions=Array.isArray(this._suggestions)?this._suggestions.filter((t=>t.toLowerCase().includes(e.toLowerCase()))):this._filteredSuggestions,this._isOpen=!!(this._filteredSuggestions&&this._filteredSuggestions.length>0))}moveFocus(e){if(!this._filteredSuggestions)return;let t=this._focusedOptionIndex+e;t>=this._filteredSuggestions.length&&(t=0),t<0&&(t=this._filteredSuggestions.length-1),this.focusOption(t)}focusOption(e){if(this._focusedOptionIndex=e,this.refSuggestions){const t=this.refSuggestions[e];null==t||t.focus()}}focusSuggestionStartingWith(e){const t=e.toLowerCase(),n=Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.findIndex((e=>e.toLowerCase().startsWith(t)));"number"==typeof n&&this.focusOption(n)}render(){const e=(0,p.s)(this.state._label),{ariaDescribedBy:t}=(0,d.g)(this.state);return(0,i.h)(i.H,{key:"61a2d80d0db88efd668d18fb63b85477ee8f4bc1",class:"kol-combobox"},(0,i.h)("div",{key:"2d45394ba9ce6fb8e0abf3cab58017fc527f7304",class:(0,c.c)("combobox",this.state._disabled&&"combobox--disabled")},(0,i.h)(r.q,{key:"43cba75c8c521e34a6de7c14873c767c7ea5a32d",_accessKey:this.state._accessKey,_alert:this.showAsAlert(),_disabled:this.state._disabled,_hideError:this.state._hideError,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icons:this.state._icons,_id:this.state._id,_label:this.state._label,_msg:this.state._msg,_required:this.state._required,_shortKey:this.state._shortKey,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched,onClick:()=>{var e;return null===(e=this.refInput)||void 0===e?void 0:e.focus()},role:"presentation"},(0,i.h)("span",{key:"7dab59a79c1d927c7a71451476d2a028e4ed7564",slot:"label"},e?(0,i.h)("slot",{name:"expert"}):"string"==typeof this.state._accessKey||"string"==typeof this.state._shortKey?(0,i.h)(i.F,null,(0,i.h)(u.I,{badgeText:(0,p.b)(this.state._accessKey,this.state._shortKey),label:this.state._label})," ",(0,i.h)("span",{class:"access-key-hint","aria-hidden":"true"},(0,p.b)(this.state._accessKey,this.state._shortKey))):(0,i.h)("span",null,this.state._label)),(0,i.h)("div",{key:"fb3a1ebdd94879fbfd9706a2fa3dee9877d8bfda",slot:"input"},(0,i.h)("div",{key:"d983c82fa1c15fe1f20fe9ff4d9ab80109ea3010",class:"combobox__group"},(0,i.h)("input",Object.assign({key:"f59624b078a069fe3dde2387a9a05c1bca746be2",ref:this.catchRef,class:"combobox__input",type:"text",role:"combobox","aria-autocomplete":"both","aria-expanded":this._isOpen?"true":"false","aria-controls":"listbox",value:this.state._value,accessKey:this.state._accessKey,"aria-describedby":t.length>0?t.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,"aria-labelledby":this.state._id,"aria-activedescendant":this._isOpen&&this._focusedOptionIndex>=0?`option-${this._focusedOptionIndex}`:void 0,autoCapitalize:"off",autoCorrect:"off",disabled:this.state._disabled,id:this.state._id,name:this.state._name,required:this.state._required},this.controller.onFacade,{onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1},onChange:this.onChange.bind(this),onInput:this.onInput.bind(this),placeholder:this.state._placeholder})),(0,i.h)("button",{key:"5dc5933ce8caaac5e4862ea42ee706337bffc6e2",tabindex:"-1",class:"combobox__icon",onClick:this.toggleListbox.bind(this),disabled:this.state._disabled},(0,i.h)(r.d,{key:"be266de66dea89e632ddcb9048bec7206f6e2536",_icons:"codicon codicon-triangle-down",_label:(0,h.t)("kol-dropdown")}))),this._isOpen&&!(!0===this.state._disabled)&&(0,i.h)("ul",{key:"d779c4ffba45bee6f0c5cb653cf9dbac6110f470",role:"listbox",class:(0,c.c)("combobox__listbox",this.blockSuggestionMouseOver&&"combobox__listbox--cursor-hidden"),onKeyDown:this.handleKeyDownDropdown.bind(this)},Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.map(((e,t)=>(0,i.h)("li",{id:`option-${t}`,key:`-${t}`,ref:e=>{e&&(this.refSuggestions[t]=e)},"data-index":t,tabIndex:-1,role:"option","aria-selected":this.state._value===e?"true":void 0,onClick:t=>{this.selectOption(t,e),this.toggleListbox()},onMouseOver:()=>{this.blockSuggestionMouseOver||this.focusOption(t)},onFocus:()=>{this.focusOption(t)},class:"combobox__item",onKeyDown:t=>{"Enter"!==t.key&&"NumpadEnter"!==t.key||(this.selectOption(t,e),this.toggleListbox(),t.preventDefault())}},e))))))))}handleKeyDown(e){var t,n;const i=(t,n)=>{var i;e.preventDefault(),void 0!==t&&(this._isOpen=t,t||null===(i=this.refInput)||void 0===i||i.focus()),null==n||n()};switch(e.key){case"Down":case"ArrowDown":this.blockSuggestionMouseOver=!0,i(!0,(()=>this.moveFocus(1)));break;case"Up":case"ArrowUp":this.blockSuggestionMouseOver=!0,i(!0,(()=>this.moveFocus(-1)));break;case"Tab":this._isOpen&&(this._isOpen=!this._isOpen,null===(t=this.refInput)||void 0===t||t.focus());break;case"Esc":case"Escape":i(!1),null===(n=this.refInput)||void 0===n||n.focus();break;case"NumpadEnter":case"Enter":this.toggleListbox();break;case"Home":this.blockSuggestionMouseOver=!0,i(void 0,(()=>{this._isOpen&&this.focusOption(0)}));break;case"End":this.blockSuggestionMouseOver=!0,i(void 0,(()=>{this._isOpen&&this.focusOption(this._filteredSuggestions?this._filteredSuggestions.length-1:0)}));break;case"PageUp":this.blockSuggestionMouseOver=!0,i(void 0,(()=>this._isOpen&&this.moveFocus(-10)));break;case"PageDown":this.blockSuggestionMouseOver=!0,i(void 0,(()=>this._isOpen&&this.moveFocus(10)))}}handleWindowClick(e){null==this.host||this.host.contains(e.target)||(this._isOpen=!1)}constructor(e){(0,i.r)(this,e),this.refSuggestions=[],this._focusedOptionIndex=-1,this.toggleListbox=()=>{var e;if(!0===this.state._disabled)this._isOpen=!1;else if(this._isOpen=!this._isOpen,null===(e=this.refInput)||void 0===e||e.focus(),this._isOpen&&Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0){const e=this._filteredSuggestions.findIndex((e=>e===this.state._value));this._focusedOptionIndex=e>=0?e:0,this.focusOption(this._focusedOptionIndex)}},this.catchRef=e=>{this.refInput=e},this.blockSuggestionMouseOver=!1,this._isOpen=!1,this._filteredSuggestions=void 0,this._accessKey=void 0,this._placeholder=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._name=void 0,this._on=void 0,this._suggestions=void 0,this._required=!1,this._shortKey=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_hasValue:!1,_hideError:!1,_id:`id-${(0,o.n)()}`,_label:"",_suggestions:[],_value:""},this.inputHasFocus=!1,this.controller=new g(this,"combobox",this.host),this.onInput=this.onInput.bind(this)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validatePlaceholder(e){this.controller.validatePlaceholder(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)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSuggestions(e){this.controller.validateSuggestions(e),this._filteredSuggestions=e}validateRequired(e){this.controller.validateRequired(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e),this.controller.setFormAssociatedValue(e)}componentWillLoad(){this.refSuggestions=[],this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((e=>this.state._hasValue=!!e)),this._filteredSuggestions=this.state._suggestions}handleMouseEvent(){this.blockSuggestionMouseOver=!1}handleFocusOut(){setTimeout((()=>{var e;(null===(e=this.host)||void 0===e?void 0:e.contains(document.activeElement))||this.onBlur()}),0)}handleWindowBlur(){this.onBlur()}onBlur(){var e;this._isOpen&&(this._isOpen=!this._isOpen,null===(e=this.refInput)||void 0===e||e.focus())}onChange(e){this.controller.onFacade.onChange(e),this.controller.setFormAssociatedValue(this.state._value)}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_placeholder:["validatePlaceholder"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_required:["validateRequired"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 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  .required label > span::after,\n  .required legend > span::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  input,\n  textarea {\n    cursor: text;\n  }\n  input[type=checkbox],\n  input[type=color],\n  input[type=file],\n  input[type=radio],\n  input[type=range],\n  label,\n  option,\n  select {\n    cursor: pointer;\n  }\n  /* input[type='checkbox'], */\n  /* input[type='radio'], */\n  /* input[type='range'], */\n  input[type=color],\n  input[type=date],\n  input[type=datetime-local],\n  input[type=email],\n  input[type=file],\n  input[type=month],\n  input[type=number],\n  input[type=password],\n  input[type=search],\n  input[type=tel],\n  input[type=text],\n  input[type=time],\n  input[type=url],\n  input[type=week],\n  select,\n  select[multiple] option,\n  textarea {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: 100%;\n  }\n  /* needed hack for vertical alignment */\n  input[type=file] {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n  /* needed hack for vertical alignment */\n  select[multiple] option {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n  }\n  .input {\n    background-color: white;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    display: grid;\n  }\n  .kol-input .input-slot {\n    flex-grow: 1;\n  }\n  input:not([type=checkbox], [type=radio]),\n  select:not([multiple], [size]) {\n    height: 2.75em;\n  }\n  input:focus,\n  option:focus,\n  select:focus,\n  textarea:focus {\n    outline: 0;\n  }\n  .input {\n    display: flex;\n    align-items: center;\n  }\n  .input > .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n  .kol-input.required .input-tooltip .kol-span__label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .combobox {\n    position: relative;\n  }\n  .combobox--disabled, .combobox--disabled * {\n    cursor: not-allowed !important;\n  }\n  .combobox--disabled {\n    opacity: 0.5;\n    outline: none;\n  }\n  .combobox__group {\n    display: inline-flex;\n    align-items: center;\n    cursor: pointer;\n  }\n  .combobox__input {\n    flex-grow: 1;\n  }\n  .combobox__icon {\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .combobox__listbox {\n    display: block;\n    position: absolute;\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow-y: auto;\n    overflow-x: hidden;\n    z-index: 2;\n    background-color: white;\n    max-height: calc(250rem / var(--kolibri-root-font-size, 16));\n  }\n  .combobox__item {\n    cursor: pointer;\n  }\n  .combobox__listbox--cursor-hidden .combobox__item {\n    cursor: none !important;\n  }\n}"}},623:(e,t,n)=>{n.d(t,{v:()=>o});var i=n(5800);const o=(e,t)=>{(0,i.g)(e,"_suggestions",(e=>"string"==typeof e||"number"==typeof e),t,void 0,{hooks:{afterPatch:e=>{Array.isArray(e)&&e.length&&(0,i.a)("Property suggestions: Options have accessibility issues in how browsers implemented them and should not be used for now.")}}})}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[2115],{3661:(e,t,n)=>{n.d(t,{C:()=>r,a:()=>c,b:()=>d,g:()=>l});var i=n(6783),o=n(7662),s=n(3584),a=n(9060);const l=e=>{var t,n;const i=Boolean("error"===(null===(t=e._msg)||void 0===t?void 0:t._type)&&e._msg._description&&(null===(n=e._msg._description)||void 0===n?void 0:n.length)>0)&&!0===e._touched,o="string"==typeof e._hint&&e._hint.length>0,s=[];return!0===i&&s.push(`${e._id}-error`),!0===o&&s.push(`${e._id}-hint`),{hasError:i,hasHint:o,ariaDescribedBy:s}},r=({onClick:e,disabled:t})=>(0,i.h)("button",{tabindex:"-1",class:"kol-custom-suggestions-toggle",onClick:e,disabled:t},(0,i.h)(o.d,{_icons:"codicon codicon-triangle-down",_label:(0,s.t)("kol-dropdown")})),d=({index:e,ref:t,selected:n,onClick:o,onMouseOver:s,onFocus:a,onKeyDown:l,option:r})=>(0,i.h)("li",{id:`option-${e}`,key:`-${e}`,ref:t,"data-index":e,tabIndex:-1,role:"option","aria-selected":n?"true":void 0,onClick:o,onMouseOver:s,onFocus:a,class:"kol-custom-suggestions-option",onKeyDown:l},r),c=({blockSuggestionMouseOver:e,onKeyDown:t},n)=>(0,i.h)("ul",{role:"listbox",class:(0,a.c)("kol-custom-suggestions-options-group",{"kol-custom-suggestions-options-group--cursor-hidden":e}),onKeyDown:t},n)},375:(e,t,n)=>{n.d(t,{K:()=>s});var i=n(6783),o=n(7662);const s=e=>{const{class:t,style:n,icons:s,label:a,onClick:l}=e;return(0,i.h)(o.d,{class:t,style:n,onClick:l,_icons:s,_label:a})}},3163:(e,t,n)=>{n.d(t,{K:()=>r});var i=n(4600),o=n(6783),s=n(9060),a=n(8625),l=n(5650);const r=e=>{const{class:t,msg:n,required:r,disabled:d,touched:c,readonly:h,ariaDescribedBy:u,hideLabel:p,label:g,suggestions:b,value:_}=e,m=(0,i._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),f=(0,l.c)(n,c),v={"kol-input--disabled":Boolean(d),"kol-input--required":Boolean(r),"kol-input--touched":Boolean(c),"kol-input--readonly":Boolean(h),[`kol-input--${(null==n?void 0:n.type)||"error"}`]:f},y=Object.assign(Object.assign({class:(0,s.c)("kol-input",v,t),required:r,disabled:d,readonly:h,type:"text",list:b?`${m.id}-list`:void 0},(0,a.d)({ariaDescribedBy:u,hideLabel:p,label:g})),m);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},y,{value:_})),b)}},7146:(e,t,n)=>{n.d(t,{K:()=>d,a:()=>r});var i=n(4600),o=n(6783),s=n(8625),a=n(3163),l=n(5650);const r=e=>{var{id:t,suggestions:n}=e,s=(0,i._)(e,["id","suggestions"]);return n?(0,o.h)("datalist",Object.assign({id:`${t}-list`},s),n.map((e=>(0,o.h)("option",{value:e})))):null},d=e=>{var{state:t,customSuggestions:n}=e,d=(0,i._)(e,["state","customSuggestions"]);return(0,o.h)(a.K,Object.assign({},function(e,t){const{ariaDescribedBy:n}=(0,s.g)(e),i={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:n};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,l.a)(e._msg)),"_suggestions"in e&&!t&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(i.suggestions=(0,o.h)(r,{id:e._id,suggestions:e._suggestions})),i}(t,n),d))}},5363:(e,t,n)=>{n.d(t,{I:()=>O,K:()=>k,a:()=>y});var i=n(6783),o=n(2587),s=n(665),a=n(4600),l=n(7662),r=n(375),d=n(9060),c=n(5650),h=n(8625),u=n(8973),p=n(5800),g=n(608);const b=(e,t)=>{var{position:n="start",class:o}=e,s=(0,a._)(e,["position","class"]);const l="kol-input-container__adornment",r=`${l}--${n}`;return(0,i.h)("div",Object.assign({class:(0,d.c)(l,r,o)},s),t)};function _(e){return!!e&&(Array.isArray(e)?e.length>0:Boolean(e))}const m=(e,t)=>{var{class:n}=e,o=(0,a._)(e,["class"]);return(0,i.h)("div",Object.assign({class:(0,d.c)("kol-input-container__container",n)},o),t)},f=(e,t)=>{const{class:n,startAdornment:o,endAdornment:s,disabled:l,msg:r,touched:h,containerProps:u,startAdornmentProps:p,endAdornmentProps:g}=e,f=(0,a._)(e,["class","startAdornment","endAdornment","disabled","msg","touched","containerProps","startAdornmentProps","endAdornmentProps"]),v=(0,c.c)(r,h),y={"kol-input-container--disabled":l,[`kol-input-container--${(null==r?void 0:r.type)||"error"}`]:v},k=Object.assign({class:(0,d.c)("kol-input-container",y,n)},f);return _(o)||_(s)?(0,i.h)("div",Object.assign({},k),(0,i.h)(b,Object.assign({},p,{position:"start"}),o),(0,i.h)(m,Object.assign({},u),t),(0,i.h)(b,Object.assign({},g,{position:"end"}),s)):(0,i.h)("div",Object.assign({},k),(0,i.h)(m,Object.assign({},u),t))},v=e=>{const{label:t,icons:n,hideLabel:o,disabled:s,onClick:r}=e,d=(0,a._)(e,["label","icons","hideLabel","disabled","onClick"]);return(0,i.h)(l.a,Object.assign({tabindex:0,_label:t,_disabled:s,_icons:n,_hideLabel:o,_on:{onClick:r}},d))},y=e=>{const{componentName:t="button",label:n,icon:o,onClick:s}=e,l=(0,a._)(e,["componentName","label","icon","onClick"]),d="button"===t?v:r.K;return(0,i.h)(d,Object.assign({label:n||"",hideLabel:!0,icons:`codicon codicon-${o}`,onClick:s},l))},k=({state:e,endAdornment:t},n)=>{const{icons:a,smartButton:l,disabled:r,msg:d,touched:h}=function(e){let t,n;return"_icons"in e&&(t=e._icons),"_smartButton"in e&&(n=e._smartButton),{icons:t,smartButton:n,disabled:e._disabled,msg:(0,c.a)(e._msg),touched:e._touched}}(e);let u=null==a?void 0:a.left;(0,o.i)(u)&&(u={icon:u});let p=null==a?void 0:a.right;(0,o.i)(p)&&(p={icon:p});const g=[],b=[];return t&&(Array.isArray(t)?b.push(...t):b.push(t)),u&&g.push((0,i.h)(y,Object.assign({componentName:"icon"},(0,s.i)(u)?u:{}))),(0,s.i)(l)&&b.push((0,i.h)(y,Object.assign({componentName:"button"},l,{hideLabel:!0,disabled:r}))),p&&b.push((0,i.h)(y,Object.assign({componentName:"icon"},(0,s.i)(p)?p:{}))),(0,i.h)(f,{disabled:r,msg:d,touched:h,startAdornment:g,endAdornment:b},n)},w=(e,t)=>{const n=e;"object"==typeof n&&null!==n&&((0,g.i)(n.right,1)&&(n.right={icon:n.right}),(0,g.i)(n.left,1)&&(n.left={icon:n.left}),t.set("_icons",n))};class O extends h.I{constructor(e,t,n){super(e,t,n),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,g.i)(e.left,1)||(0,u.i)(e.left)||(0,g.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,t,n)=>{n.d(t,{i:()=>a,v:()=>l});var i=n(5800),o=n(608);const s=(e,t,n)=>{(0,o.b)(n)?e[t]=n:(0,o.i)(n,1)&&(e[t]={icon:n})},a=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),l=(e,t,n={})=>{(0,i.o)(t,(()=>{var l;try{t=(0,i.p)(t)}catch(e){}(0,i.w)(e,"_icons",(e=>{const t="object"==typeof e&&null!==e&&0===Object.keys(e).length;return null===e||t||(0,o.i)(e,1)||"object"==typeof e&&null!==e&&((0,o.i)(e.left,1)||a(e.left)||(0,o.i)(e.right,1)||a(e.right)||(0,o.i)(e.top,1)||a(e.top)||(0,o.i)(e.bottom,1)||a(e.bottom))}),new Set(["KoliBriIcon"]),t,Object.assign(Object.assign({},n),{defaultValue:{},hooks:{afterPatch:null===(l=n.hooks)||void 0===l?void 0:l.afterPatch,beforePatch:(e,t,i,a)=>{var l,r;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.beforePatch)&&(null===(r=n.hooks)||void 0===r||r.beforePatch(e,t,i,a)),(e=>{var t,n,i;if(null===(t=e.nextState)||void 0===t?void 0:t.has("_icons")){const t=null===(n=e.nextState)||void 0===n?void 0:n.get("_icons");null===(i=e.nextState)||void 0===i||i.set("_icons",(e=>{let t={};return(0,o.i)(e,1)?t={left:{icon:e}}:"object"==typeof e&&null!==e&&(s(t,"top",e.top),s(t,"right",e.right),s(t,"bottom",e.bottom),s(t,"left",e.left)),t})(t))}})(i)}}}))}))}},665:(e,t,n)=>{function i(e){var t=typeof e;return null!=e&&("object"==t||"function"==t)}n.d(t,{i:()=>i})},2115:(e,t,n)=>{n.r(t),n.d(t,{kol_combobox:()=>g});var i=n(6783),o=n(7336),s=n(5363),a=n(5800),l=n(623),r=n(3661),d=n(9060),c=n(7146),h=n(8625),u=(e,t,n)=>new Promise(((i,o)=>{var s=e=>{try{l(n.next(e))}catch(e){o(e)}},a=e=>{try{l(n.throw(e))}catch(e){o(e)}},l=e=>e.done?i(e.value):Promise.resolve(e.value).then(s,a);l((n=n.apply(e,t)).next())}));class p extends s.I{constructor(e,t,n){super(e,t,n),this.component=e}validatePlaceholder(e){(0,a.i)(this.component,"_placeholder",e)}validateRequired(e){(0,a.b)(this.component,"_required",e)}validateSuggestions(e){(0,l.v)(this.component,e)}validateValue(e){(0,a.i)(this.component,"_value",e)}componentWillLoad(){super.componentWillLoad(),this.validatePlaceholder(this.component._placeholder),this.validateRequired(this.component._required),this.validateSuggestions(this.component._suggestions),this.validateValue(this.component._value)}}const g=class{getValue(){return u(this,null,(function*(){return this.state._value}))}kolFocus(){return u(this,null,(function*(){var e;null===(e=this.refInput)||void 0===e||e.focus()}))}selectOption(e,t){var n;this.controller.onFacade.onInput(e,!0,t),this.controller.onFacade.onChange(e,t),this.controller.setFormAssociatedValue(t),this.state._value=t,null===(n=this.refInput)||void 0===n||n.focus()}onInput(e){const t=e.target;this.state._value=t.value,this._value=t.value,this.controller.onFacade.onInput(e),this.setFilteredSuggestionsByQuery(t.value),this._focusedOptionIndex=-1}handleKeyDownDropdown(e){1===e.key.length&&/[a-z0-9]/i.test(e.key)&&(this._isOpen=!0,this.focusSuggestionStartingWith(e.key))}setFilteredSuggestionsByQuery(e){""===e.trim()?this._filteredSuggestions=[...this._suggestions]:(this._filteredSuggestions=Array.isArray(this._suggestions)?this._suggestions.filter((t=>t.toLowerCase().includes(e.toLowerCase()))):this._filteredSuggestions,this._isOpen=!!(this._filteredSuggestions&&this._filteredSuggestions.length>0))}moveFocus(e){if(!this._filteredSuggestions)return;let t=this._focusedOptionIndex+e;t>=this._filteredSuggestions.length&&(t=0),t<0&&(t=this._filteredSuggestions.length-1),this.focusOption(t)}focusOption(e){if(this._focusedOptionIndex=e,this.refSuggestions){const t=this.refSuggestions[e];null==t||t.focus()}}focusSuggestionStartingWith(e){const t=e.toLowerCase(),n=Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.findIndex((e=>e.toLowerCase().startsWith(t)));"number"==typeof n&&this.focusOption(n)}getFormFieldProps(){return{state:this.state,class:(0,d.c)("kol-combobox",{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,onClick:()=>{var e;return null===(e=this.refInput)||void 0===e?void 0:e.focus()},alert:this.showAsAlert()}}getInputProps(){const{ariaDescribedBy:e}=(0,r.g)(this.state);return Object.assign(Object.assign({ref:this.catchRef,state:this.state,class:"kol-combobox__input",type:"text",role:"combobox","aria-autocomplete":"both","aria-expanded":this._isOpen?"true":"false","aria-controls":"listbox","aria-describedby":e.length>0?e.join(" "):void 0,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,"aria-labelledby":this.state._id,"aria-activedescendant":this._isOpen&&this._focusedOptionIndex>=0?`option-${this._focusedOptionIndex}`:void 0,value:this.state._value,accessKey:this.state._accessKey,autocapitalize:"off",autocorrect:"off",disabled:this.state._disabled,customSuggestions:!0,id:this.state._id,name:this.state._name,required:this.state._required},this.controller.onFacade),{onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1},onChange:this.onChange.bind(this),onInput:this.onInput.bind(this),placeholder:this.state._placeholder})}render(){return(0,i.h)(h.K,Object.assign({key:"4a5847a07661537d4af1651d63cc02213f8faba4"},this.getFormFieldProps()),(0,i.h)(s.K,{key:"f5f23700d41e0f08b5e4d042f29cfc3fcd2e2edc",state:this.state},(0,i.h)("div",{key:"422e81dc9ae35f1b3ac2bb77525eaa7ce23011ea",class:"kol-combobox__group"},(0,i.h)(c.K,Object.assign({key:"b0a5a69ffaafe1443f24692a0cec9cb368b329ad"},this.getInputProps())),(0,i.h)(r.C,{key:"6a5ab0dc9ba9c4fc0aa2e06b06bbaed5558efb10",onClick:this.toggleListbox.bind(this),disabled:this.state._disabled})),this._isOpen&&!(!0===this.state._disabled)&&(0,i.h)(r.a,{key:"65a14c8a44817ab31d4fca050df4b70fdb0ecb69",blockSuggestionMouseOver:this.blockSuggestionMouseOver,onKeyDown:this.handleKeyDownDropdown.bind(this)},Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.map(((e,t)=>(0,i.h)(r.b,{index:t,option:e,ref:e=>{e&&(this.refSuggestions[t]=e)},selected:this.state._value===e,onClick:t=>{this.selectOption(t,e),this.toggleListbox()},onMouseOver:()=>{this.blockSuggestionMouseOver||this.focusOption(t)},onFocus:()=>{this.focusOption(t)},onKeyDown:t=>{"Enter"!==t.key&&"NumpadEnter"!==t.key||(this.selectOption(t,e),this.toggleListbox(),t.preventDefault())}}))))))}handleKeyDown(e){var t,n;const i=(t,n)=>{var i;e.preventDefault(),void 0!==t&&(this._isOpen=t,t||null===(i=this.refInput)||void 0===i||i.focus()),null==n||n()};switch(e.key){case"Down":case"ArrowDown":this.blockSuggestionMouseOver=!0,i(!0,(()=>this.moveFocus(1)));break;case"Up":case"ArrowUp":this.blockSuggestionMouseOver=!0,i(!0,(()=>this.moveFocus(-1)));break;case"Tab":this._isOpen&&(this._isOpen=!this._isOpen,null===(t=this.refInput)||void 0===t||t.focus());break;case"Esc":case"Escape":i(!1),null===(n=this.refInput)||void 0===n||n.focus();break;case"NumpadEnter":case"Enter":this.toggleListbox();break;case"Home":this.blockSuggestionMouseOver=!0,i(void 0,(()=>{this._isOpen&&this.focusOption(0)}));break;case"End":this.blockSuggestionMouseOver=!0,i(void 0,(()=>{this._isOpen&&this.focusOption(this._filteredSuggestions?this._filteredSuggestions.length-1:0)}));break;case"PageUp":this.blockSuggestionMouseOver=!0,i(void 0,(()=>this._isOpen&&this.moveFocus(-10)));break;case"PageDown":this.blockSuggestionMouseOver=!0,i(void 0,(()=>this._isOpen&&this.moveFocus(10)))}}handleWindowClick(e){null==this.host||this.host.contains(e.target)||(this._isOpen=!1)}constructor(e){(0,i.r)(this,e),this.refSuggestions=[],this._focusedOptionIndex=-1,this.toggleListbox=()=>{var e;if(!0===this.state._disabled)this._isOpen=!1;else if(this._isOpen=!this._isOpen,null===(e=this.refInput)||void 0===e||e.focus(),this._isOpen&&Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0){const e=this._filteredSuggestions.findIndex((e=>e===this.state._value));this._focusedOptionIndex=e>=0?e:0,this.focusOption(this._focusedOptionIndex)}},this.catchRef=e=>{this.refInput=e},this.blockSuggestionMouseOver=!1,this._isOpen=!1,this._filteredSuggestions=void 0,this._accessKey=void 0,this._placeholder=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._name=void 0,this._on=void 0,this._suggestions=void 0,this._required=!1,this._shortKey=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_hasValue:!1,_hideMsg:!1,_id:`id-${(0,o.n)()}`,_label:"",_suggestions:[],_value:""},this.inputHasFocus=!1,this.controller=new p(this,"combobox",this.host),this.onInput=this.onInput.bind(this)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validatePlaceholder(e){this.controller.validatePlaceholder(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)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSuggestions(e){this.controller.validateSuggestions(e),this._filteredSuggestions=e}validateRequired(e){this.controller.validateRequired(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e),this.controller.setFormAssociatedValue(e)}componentWillLoad(){this.refSuggestions=[],this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((e=>this.state._hasValue=!!e)),this._filteredSuggestions=this.state._suggestions}handleMouseEvent(){this.blockSuggestionMouseOver=!1}handleFocusOut(){setTimeout((()=>{var e;(null===(e=this.host)||void 0===e?void 0:e.contains(document.activeElement))||this.onBlur()}),0)}handleWindowBlur(){this.onBlur()}onBlur(){var e;this._isOpen&&(this._isOpen=!this._isOpen,null===(e=this.refInput)||void 0===e||e.focus())}onChange(e){this.controller.onFacade.onChange(e),this.controller.setFormAssociatedValue(this.state._value)}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_placeholder:["validatePlaceholder"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_required:["validateRequired"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};g.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-custom-suggestions-option {\n    cursor: pointer;\n  }\n  .kol-custom-suggestions-options-group--cursor-hidden .kol-custom-suggestions-option {\n    cursor: none !important;\n  }\n}\n@layer kol-component {\n  .kol-custom-suggestions-options-group {\n    display: block;\n    position: absolute;\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow-y: auto;\n    overflow-x: hidden;\n    z-index: 2;\n    background-color: white;\n    max-height: calc(250rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-custom-suggestions-toggle {\n    align-items: center;\n    cursor: pointer;\n    display: flex;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\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}"}},623:(e,t,n)=>{n.d(t,{v:()=>o});var i=n(5800);const o=(e,t)=>{(0,i.g)(e,"_suggestions",(e=>"string"==typeof e||"number"==typeof e),t,void 0,{hooks:{afterPatch:e=>{Array.isArray(e)&&e.length&&(0,i.a)("Property suggestions: Options have accessibility issues in how browsers implemented them and should not be used for now.")}}})}}}]);

package/dist/2195.js

@@ -1,2 +1,2 @@
 /*! For license information please see 2195.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[2195],{9543:(t,e,a)=>{a.d(e,{a:()=>r,b:()=>l,c:()=>n,v:()=>s});var i=a(5800);const s=(t,e)=>{(0,i.i)(t,"_accessKey",e)},o={hooks:{afterPatch:t=>{-1!==t&&0!==t&&(0,i.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},n=(t,e)=>{(0,i.k)(t,"_tabIndex",e,o)},l=(t,e)=>{(0,i.i)(t,"_shortKey",e)},r=(t,e)=>{if(t&&e)throw new Error("AccessKey and ShortKey are used. Only one is allowed.")}},9246:(t,e,a)=>{a.d(e,{a:()=>s,v:()=>n});var i=a(5800);const s=(t,e,a)=>{(0,i.w)(t,e,(t=>"string"==typeof t&&o.includes(t)),new Set(o),a,{defaultValue:"top"})},o=["left","right","top","bottom"],n=(t,e)=>{s(t,"_align",e)}},6566:(t,e,a)=>{a.d(e,{a:()=>l,b:()=>o,c:()=>d,v:()=>n});var i=a(5800);const s=["button","link","tab","treeitem"],o=(t,e)=>{(0,i.w)(t,"_role",(t=>"string"==typeof t&&s.includes(t)),new Set([`KoliBriAlternativeButtonLinkRole {${s.join(", ")}`]),e)},n=(t,e)=>{(0,i.i)(t,"_ariaDescription",e)},l=(t,e)=>{(0,i.b)(t,"_ariaExpanded",e)},r=["primary","secondary","normal","tertiary","danger","ghost","custom"],d=(t,e)=>{(0,i.w)(t,"_variant",(t=>"string"==typeof t&&r.includes(t)),new Set([`KoliBriButtonVariant {${r.join(", ")}`]),e,{defaultValue:"normal"})}},608:(t,e,a)=>{a.d(e,{S:()=>n,a:()=>o,b:()=>i,i:()=>s});const i=t=>"object"==typeof t&&null!==t,s=(t,e=0)=>"string"==typeof t&&t.length>=e,o=t=>{if("object"!=typeof t||null===t)return s(t,1);for(const e in t)if(!1===s(e,1))return!1;return!0},n=new Event("StateChange")},2774:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e)=>{(0,i.i)(t,"_customClass",e,{defaultValue:void 0})}},8125:(t,e,a)=>{a.d(e,{i:()=>l,n:()=>d,r:()=>r});var i=a(6970),s=a(5687),o=a(1732);const n=()=>{let t=(0,o.d)().KoliBri;return void 0===t&&(t={},Object.defineProperty((0,o.d)(),"KoliBri",{value:t,writable:!1})),t},l=()=>{(()=>{const t=(0,o.g)().querySelector('meta[name="kolibri"]');if(t&&t.hasAttribute("content")){const e=t.getAttribute("content");"string"==typeof e&&((0,o.s)(e.includes("dev-mode=true")),(0,o.b)(e.includes("experimental-mode=true")),(0,o.c)(e.includes("color-contrast-analysis=true")))}})(),o.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${i.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==n().adviceShown&&(Object.defineProperty(n(),"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 d=()=>Math.floor(16777215*Math.random()).toString(16);"test"===s.p&&(d=()=>"nonce")},3970:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e)=>{(0,i.b)(t,"_disabled",e,{hooks:{afterPatch:t=>{!0===t&&(0,i.c)()}}})}},6985:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e,a={})=>{(0,i.b)(t,"_hideLabel",e,a)}},9506:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e,a={})=>{(0,i.i)(t,"_href",e,a)}},3584:(t,e,a)=>{a.d(e,{t:()=>o});var i=a(8461),s=a(5687);let o=(t,e)=>{var a;return(null!==(a=(0,i.g)())&&void 0!==a?a:(0,i.i)("de")).translate(t,e)};"test"===s.p&&(o=t=>t)},8973:(t,e,a)=>{a.d(e,{i:()=>n,v:()=>l});var i=a(5800),s=a(608);const o=(t,e,a)=>{(0,s.b)(a)?t[e]=a:(0,s.i)(a,1)&&(t[e]={icon:a})},n=t=>"object"==typeof t&&null!==t&&(void 0===t.style||(0,s.a)(t.style))&&(void 0===t.label||(0,s.i)(t.label))&&(0,s.i)(t.icon,1),l=(t,e,a={})=>{(0,i.o)(e,(()=>{var l;try{e=(0,i.p)(e)}catch(t){}(0,i.w)(t,"_icons",(t=>{const e="object"==typeof t&&null!==t&&0===Object.keys(t).length;return null===t||e||(0,s.i)(t,1)||"object"==typeof t&&null!==t&&((0,s.i)(t.left,1)||n(t.left)||(0,s.i)(t.right,1)||n(t.right)||(0,s.i)(t.top,1)||n(t.top)||(0,s.i)(t.bottom,1)||n(t.bottom))}),new Set(["KoliBriIcon"]),e,Object.assign(Object.assign({},a),{defaultValue:{},hooks:{afterPatch:null===(l=a.hooks)||void 0===l?void 0:l.afterPatch,beforePatch:(t,e,i,n)=>{var l,r;"function"==typeof(null===(l=a.hooks)||void 0===l?void 0:l.beforePatch)&&(null===(r=a.hooks)||void 0===r||r.beforePatch(t,e,i,n)),(t=>{var e,a,i;if(null===(e=t.nextState)||void 0===e?void 0:e.has("_icons")){const e=null===(a=t.nextState)||void 0===a?void 0:a.get("_icons");null===(i=t.nextState)||void 0===i||i.set("_icons",(t=>{let e={};return(0,s.i)(t,1)?e={left:{icon:t}}:"object"==typeof t&&null!==t&&(o(e,"top",t.top),o(e,"right",t.right),o(e,"bottom",t.bottom),o(e,"left",t.left)),e})(e))}})(i)}}}))}))}},2195:(t,e,a)=>{a.r(e),a.d(e,{kol_link_wc:()=>C});var i=a(6970),s=a(1521),o=a(8231),n=a(8125),l=a(7767),r=a(3584),d=a(9543),h=a(9060),c=a(9542),v=a(5800),_=a(9506),u=a(5687),b=a(6566),f=a(2774),p=a(3970),g=a(6985),y=a(8973),k=a(1074),m=a(356);const w=["date","location","page","step","time","true","false"],C=class{constructor(t){(0,i.r)(this,t),this.internalDescriptionById=(0,n.n)(),this.catchRef=t=>{this.anchorRef=t},this.onClick=t=>{var e,a;!0===this.state._disabled?t.preventDefault():("function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onClick)&&(t.preventDefault(),(0,v.q)(t,this.anchorRef),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._href)),this.host&&(0,o.d)(this.host,o.K.click,this.state._href))},this.getRenderValues=()=>{const t="string"==typeof this.state._target&&"_self"!==this.state._target,e={href:"string"==typeof this.state._href&&this.state._href.length>0?this.state._href:"javascript:void(0);",target:"string"==typeof this.state._target&&this.state._target.length>0?this.state._target:void 0,rel:t?"noopener":void 0,download:"string"==typeof this.state._download?this.state._download:void 0};return!0!==this.state._hideLabel||this.state._label||(0,v.j)("[KolLink] An aria-label must be set when _hide-label is set."),{isExternal:t,tagAttrs:e}},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._ariaDescription=void 0,this._ariaExpanded=void 0,this._ariaOwns=void 0,this._customClass=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._shortKey=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right",this._variant="normal",this.state={_ariaCurrentValue:"page",_href:"",_icons:{}}}kolFocus(){return t=this,e=function*(){var t;null===(t=this.anchorRef)||void 0===t||t.focus()},new Promise(((a,i)=>{var s=t=>{try{n(e.next(t))}catch(t){i(t)}},o=t=>{try{n(e.throw(t))}catch(t){i(t)}},n=t=>t.done?a(t.value):Promise.resolve(t.value).then(s,o);n((e=e.apply(t,null)).next())}));var t,e}render(){var t,e;const{isExternal:a,tagAttrs:s}=this.getRenderValues(),o=(0,u.s)(this.state._label),n=Boolean(null===(e=null===(t=this.state._ariaDescription)||void 0===t?void 0:t.trim())||void 0===e?void 0:e.length);return(0,i.h)(i.H,{key:"9614d0e0bbc44f8e9c33abbf5ee22003a707b053"},(0,i.h)("a",Object.assign({key:"857aa8c3cbaff93d929f23070da34ed1f5381be8",ref:this.catchRef},s,{accessKey:this.state._accessKey,"aria-current":this.state._ariaCurrent,"aria-describedby":n?this.internalDescriptionById:void 0,"aria-disabled":this.state._disabled?"true":void 0,"aria-expanded":"boolean"==typeof this.state._ariaExpanded?String(this.state._ariaExpanded):void 0,"aria-owns":this.state._ariaOwns,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?`${this.state._label}${a?` (${(0,r.t)("kol-open-link-in-tab")})`:""}`:void 0,class:(0,h.c)("kol-link",{"kol-link--disabled":!0===this.state._disabled,"kol-link--external-link":a,"kol-link--hide-label":!0===this.state._hideLabel,[`kol-link--${this.state._variant}`]:"button"===this.state._role&&"custom"!==this.state._variant,[this.state._customClass]:"custom"===this.state._variant&&"string"==typeof this.state._customClass&&this.state._customClass.length>0})},this.state._on,{onClick:this.onClick,onKeyPress:this.onClick,role:this.state._role,tabIndex:this.state._disabled?-1:this.state._tabIndex}),(0,i.h)(c.K,{key:"70d8cd8e7549d0d0056879ba436f4c5d034b3733",class:"kol-link__text",badgeText:this.state._accessKey||this.state._shortKey,icons:this.state._icons,hideLabel:this.state._hideLabel,label:o?"":this.state._label||this.state._href},(0,i.h)("slot",{key:"0d0247e999664db2a53b39ffa0010a479e16fb8a",name:"expert",slot:"expert"})),a&&(0,i.h)(l.d,{key:"ef20217653b7f8818f0b68d1e726b6a2d9bdc41c",class:"kol-link__icon",_label:this.state._hideLabel?"":(0,r.t)("kol-open-link-in-tab"),_icons:"codicon codicon-link-external","aria-hidden":this.state._hideLabel})),(0,i.h)(l.g,{key:"58cf566683ea3af172323899876ee830e318ff83","aria-hidden":"true",class:"kol-link__tooltip",hidden:o||!this.state._hideLabel,_badgeText:this.state._accessKey||this.state._shortKey,_align:this.state._tooltipAlign,_label:this.state._label||this.state._href}),n&&(0,i.h)("span",{key:"e746153b2e0fa48dcc0e5e7226f3f76387c2161a",class:"visually-hidden",id:this.internalDescriptionById},this.state._ariaDescription))}validateAccessKey(t){(0,d.v)(this,t),(0,d.a)(t,this._shortKey)}validateAriaCurrentValue(t){((t,e)=>{(0,v.w)(t,"_ariaCurrentValue",(t=>"string"==typeof t&&w.includes(t)),new Set([`AriaCurrentValue {${w.join(", ")}`]),e,{defaultValue:"page"})})(this,t)}validateAriaDescription(t){(0,b.v)(this,t)}validateAriaExpanded(t){(0,b.a)(this,t)}validateAriaOwns(t){((t,e)=>{(0,v.i)(t,"_ariaOwns",e,{defaultValue:void 0})})(this,t)}validateCustomClass(t){(0,f.v)(this,t)}validateDisabled(t){(0,p.v)(this,t)}validateDownload(t){((t,e)=>{(0,v.i)(t,"_download",e)})(this,t)}validateHideLabel(t){(0,g.v)(this,t)}validateHref(t){(0,_.v)(this,t,{required:!0})}validateIcons(t){(0,y.v)(this,t)}validateLabel(t){(0,k.a)(this,t)}validateOn(t){((t,e)=>{"object"==typeof e&&"function"==typeof(null==e?void 0:e.onClick)&&(t.state=Object.assign(Object.assign({},t.state),{_on:e}))})(this,t)}validateRole(t){(0,b.b)(this,t)}validateShortKey(t){(0,d.b)(this,t),(0,d.a)(this._accessKey,t)}validateTabIndex(t){(0,d.c)(this,t)}validateTarget(t){((t,e)=>{(0,v.i)(t,"_target",e)})(this,t)}validateTooltipAlign(t){(0,m.v)(this,t)}validateVariant(t){(0,b.c)(this,t)}componentWillLoad(){this.validateAccessKey(this._accessKey),this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaDescription(this._ariaDescription),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaOwns(this._ariaOwns),this.validateCustomClass(this._customClass),this.validateDisabled(this._disabled),this.validateDownload(this._download),this.validateHideLabel(this._hideLabel),this.validateHref(this._href),this.validateIcons(this._icons),this.validateLabel(this._label),this.validateOn(this._on),this.validateRole(this._role),this.validateShortKey(this._shortKey),this.validateTabIndex(this._tabIndex),this.validateTarget(this._target),this.validateTooltipAlign(this._tooltipAlign),this.validateVariant(this._variant),this.unsubscribeOnLocationChange=(0,s.o)((t=>{this.state._ariaCurrent=t===this.state._href?this.state._ariaCurrentValue:void 0})),(0,d.a)(this._accessKey,this._shortKey)}disconnectedCallback(){this.unsubscribeOnLocationChange&&this.unsubscribeOnLocationChange()}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_ariaCurrentValue:["validateAriaCurrentValue"],_ariaDescription:["validateAriaDescription"],_ariaExpanded:["validateAriaExpanded"],_ariaOwns:["validateAriaOwns"],_customClass:["validateCustomClass"],_disabled:["validateDisabled"],_download:["validateDownload"],_hideLabel:["validateHideLabel"],_href:["validateHref"],_icons:["validateIcons"],_label:["validateLabel"],_on:["validateOn"],_role:["validateRole"],_shortKey:["validateShortKey"],_tabIndex:["validateTabIndex"],_target:["validateTarget"],_tooltipAlign:["validateTooltipAlign"],_variant:["validateVariant"]}}}},1074:(t,e,a)=>{a.d(e,{a:()=>c,b:()=>l,c:()=>r,h:()=>s,v:()=>h});var i=a(5800);const s=[0,1,2,3,4,5,6],o=/[a-zA-Z0-9äöüÄÖÜß]/g,n=/^\d+$/;function l(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(o))||void 0===e?void 0:e.length)||0}(t)>=e}function r(t){return n.test(t)}const d=new Set(["string"]),h=(t,e,a={})=>{(0,i.w)(t,"_label",(t=>"string"==typeof t),d,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,a,s,o)=>{var n,d;"function"==typeof(null===(n=t.hooks)||void 0===n?void 0:n.afterPatch)&&(null===(d=t.hooks)||void 0===d||d.afterPatch(e,a,s,o)),"string"==typeof e&&!1===l(e,3)&&!1===r(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(a))},c=h},356:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(9246);const s=(t,e)=>{(0,i.a)(t,"_tooltipAlign",e)}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[2195],{9543:(t,e,a)=>{a.d(e,{a:()=>r,b:()=>l,c:()=>n,v:()=>s});var i=a(5800);const s=(t,e)=>{(0,i.i)(t,"_accessKey",e)},o={hooks:{afterPatch:t=>{-1!==t&&0!==t&&(0,i.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},n=(t,e)=>{(0,i.k)(t,"_tabIndex",e,o)},l=(t,e)=>{(0,i.i)(t,"_shortKey",e)},r=(t,e)=>{if(t&&e)throw new Error("AccessKey and ShortKey are used. Only one is allowed.")}},9246:(t,e,a)=>{a.d(e,{a:()=>s,v:()=>n});var i=a(5800);const s=(t,e,a)=>{(0,i.w)(t,e,(t=>"string"==typeof t&&o.includes(t)),new Set(o),a,{defaultValue:"top"})},o=["left","right","top","bottom"],n=(t,e)=>{s(t,"_align",e)}},6566:(t,e,a)=>{a.d(e,{a:()=>l,b:()=>o,c:()=>d,v:()=>n});var i=a(5800);const s=["button","link","tab","treeitem"],o=(t,e)=>{(0,i.w)(t,"_role",(t=>"string"==typeof t&&s.includes(t)),new Set([`KoliBriAlternativeButtonLinkRole {${s.join(", ")}`]),e)},n=(t,e)=>{(0,i.i)(t,"_ariaDescription",e)},l=(t,e)=>{(0,i.b)(t,"_ariaExpanded",e)},r=["primary","secondary","normal","tertiary","danger","ghost","custom"],d=(t,e)=>{(0,i.w)(t,"_variant",(t=>"string"==typeof t&&r.includes(t)),new Set([`KoliBriButtonVariant {${r.join(", ")}`]),e,{defaultValue:"normal"})}},608:(t,e,a)=>{a.d(e,{S:()=>n,a:()=>o,b:()=>i,i:()=>s});const i=t=>"object"==typeof t&&null!==t,s=(t,e=0)=>"string"==typeof t&&t.length>=e,o=t=>{if("object"!=typeof t||null===t)return s(t,1);for(const e in t)if(!1===s(e,1))return!1;return!0},n=new Event("StateChange")},2774:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e)=>{(0,i.i)(t,"_customClass",e,{defaultValue:void 0})}},7336:(t,e,a)=>{a.d(e,{i:()=>l,n:()=>d,r:()=>r});var i=a(6783),s=a(5687),o=a(1732);const n=()=>{let t=(0,o.d)().KoliBri;return void 0===t&&(t={},Object.defineProperty((0,o.d)(),"KoliBri",{value:t,writable:!1})),t},l=()=>{(()=>{const t=(0,o.g)().querySelector('meta[name="kolibri"]');if(t&&t.hasAttribute("content")){const e=t.getAttribute("content");"string"==typeof e&&((0,o.s)(e.includes("dev-mode=true")),(0,o.b)(e.includes("experimental-mode=true")),(0,o.c)(e.includes("color-contrast-analysis=true")))}})(),o.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${i.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==n().adviceShown&&(Object.defineProperty(n(),"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 d=()=>Math.floor(16777215*Math.random()).toString(16);"test"===s.p&&(d=()=>"nonce")},3970:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e)=>{(0,i.b)(t,"_disabled",e,{hooks:{afterPatch:t=>{!0===t&&(0,i.c)()}}})}},6985:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e,a={})=>{(0,i.b)(t,"_hideLabel",e,a)}},9506:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(5800);const s=(t,e,a={})=>{(0,i.i)(t,"_href",e,a)}},3584:(t,e,a)=>{a.d(e,{t:()=>o});var i=a(8461),s=a(5687);let o=(t,e)=>{var a;return(null!==(a=(0,i.g)())&&void 0!==a?a:(0,i.i)("de")).translate(t,e)};"test"===s.p&&(o=t=>t)},8973:(t,e,a)=>{a.d(e,{i:()=>n,v:()=>l});var i=a(5800),s=a(608);const o=(t,e,a)=>{(0,s.b)(a)?t[e]=a:(0,s.i)(a,1)&&(t[e]={icon:a})},n=t=>"object"==typeof t&&null!==t&&(void 0===t.style||(0,s.a)(t.style))&&(void 0===t.label||(0,s.i)(t.label))&&(0,s.i)(t.icon,1),l=(t,e,a={})=>{(0,i.o)(e,(()=>{var l;try{e=(0,i.p)(e)}catch(t){}(0,i.w)(t,"_icons",(t=>{const e="object"==typeof t&&null!==t&&0===Object.keys(t).length;return null===t||e||(0,s.i)(t,1)||"object"==typeof t&&null!==t&&((0,s.i)(t.left,1)||n(t.left)||(0,s.i)(t.right,1)||n(t.right)||(0,s.i)(t.top,1)||n(t.top)||(0,s.i)(t.bottom,1)||n(t.bottom))}),new Set(["KoliBriIcon"]),e,Object.assign(Object.assign({},a),{defaultValue:{},hooks:{afterPatch:null===(l=a.hooks)||void 0===l?void 0:l.afterPatch,beforePatch:(t,e,i,n)=>{var l,r;"function"==typeof(null===(l=a.hooks)||void 0===l?void 0:l.beforePatch)&&(null===(r=a.hooks)||void 0===r||r.beforePatch(t,e,i,n)),(t=>{var e,a,i;if(null===(e=t.nextState)||void 0===e?void 0:e.has("_icons")){const e=null===(a=t.nextState)||void 0===a?void 0:a.get("_icons");null===(i=t.nextState)||void 0===i||i.set("_icons",(t=>{let e={};return(0,s.i)(t,1)?e={left:{icon:t}}:"object"==typeof t&&null!==t&&(o(e,"top",t.top),o(e,"right",t.right),o(e,"bottom",t.bottom),o(e,"left",t.left)),e})(e))}})(i)}}}))}))}},2195:(t,e,a)=>{a.r(e),a.d(e,{kol_link_wc:()=>C});var i=a(6783),s=a(1521),o=a(8231),n=a(7336),l=a(7662),r=a(3584),d=a(9543),h=a(9060),c=a(6368),v=a(5800),_=a(9506),u=a(5687),b=a(6566),f=a(2774),p=a(3970),g=a(6985),y=a(8973),k=a(1074),m=a(356);const w=["date","location","page","step","time","true","false"],C=class{constructor(t){(0,i.r)(this,t),this.internalDescriptionById=(0,n.n)(),this.catchRef=t=>{this.anchorRef=t},this.onClick=t=>{var e,a;!0===this.state._disabled?t.preventDefault():("function"==typeof(null===(e=this.state._on)||void 0===e?void 0:e.onClick)&&(t.preventDefault(),(0,v.q)(t,this.anchorRef),null===(a=this.state._on)||void 0===a||a.onClick(t,this.state._href)),this.host&&(0,o.d)(this.host,o.K.click,this.state._href))},this.getRenderValues=()=>{const t="string"==typeof this.state._target&&"_self"!==this.state._target,e={href:"string"==typeof this.state._href&&this.state._href.length>0?this.state._href:"javascript:void(0);",target:"string"==typeof this.state._target&&this.state._target.length>0?this.state._target:void 0,rel:t?"noopener":void 0,download:"string"==typeof this.state._download?this.state._download:void 0};return!0!==this.state._hideLabel||this.state._label||(0,v.j)("[KolLink] An aria-label must be set when _hide-label is set."),{isExternal:t,tagAttrs:e}},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._ariaDescription=void 0,this._ariaExpanded=void 0,this._ariaOwns=void 0,this._customClass=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._shortKey=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right",this._variant="normal",this.state={_ariaCurrentValue:"page",_href:"",_icons:{}}}kolFocus(){return t=this,e=function*(){var t;null===(t=this.anchorRef)||void 0===t||t.focus()},new Promise(((a,i)=>{var s=t=>{try{n(e.next(t))}catch(t){i(t)}},o=t=>{try{n(e.throw(t))}catch(t){i(t)}},n=t=>t.done?a(t.value):Promise.resolve(t.value).then(s,o);n((e=e.apply(t,null)).next())}));var t,e}render(){var t,e;const{isExternal:a,tagAttrs:s}=this.getRenderValues(),o=(0,u.s)(this.state._label),n=Boolean(null===(e=null===(t=this.state._ariaDescription)||void 0===t?void 0:t.trim())||void 0===e?void 0:e.length);return(0,i.h)(i.H,{key:"b36c32d41cd637fddcb7b2d7242e537c006698aa"},(0,i.h)("a",Object.assign({key:"e7b1dd6d0ba278f09b49090d8e27697efa38f014",ref:this.catchRef},s,{accessKey:this.state._accessKey,"aria-current":this.state._ariaCurrent,"aria-describedby":n?this.internalDescriptionById:void 0,"aria-disabled":this.state._disabled?"true":void 0,"aria-expanded":"boolean"==typeof this.state._ariaExpanded?String(this.state._ariaExpanded):void 0,"aria-owns":this.state._ariaOwns,"aria-label":this.state._hideLabel&&"string"==typeof this.state._label?`${this.state._label}${a?` (${(0,r.t)("kol-open-link-in-tab")})`:""}`:void 0,class:(0,h.c)("kol-link",{"kol-link--disabled":!0===this.state._disabled,"kol-link--external-link":a,"kol-link--hide-label":!0===this.state._hideLabel,[`kol-link--${this.state._variant}`]:"button"===this.state._role&&"custom"!==this.state._variant,[this.state._customClass]:"custom"===this.state._variant&&"string"==typeof this.state._customClass&&this.state._customClass.length>0})},this.state._on,{onClick:this.onClick,onKeyPress:this.onClick,role:this.state._role,tabIndex:this.state._disabled?-1:this.state._tabIndex}),(0,i.h)(c.K,{key:"491d819ae928e993fc1ea5b4850fa419e3120fd0",class:"kol-link__text",badgeText:this.state._accessKey||this.state._shortKey,icons:this.state._icons,hideLabel:this.state._hideLabel,label:o?"":this.state._label||this.state._href},(0,i.h)("slot",{key:"363b0f22f8f24b8d29f5646d3fc916e6384ff37b",name:"expert",slot:"expert"})),a&&(0,i.h)(l.d,{key:"ebf7e3c19fb025d776a37fde5d406d0498c7d6d1",class:"kol-link__icon",_label:this.state._hideLabel?"":(0,r.t)("kol-open-link-in-tab"),_icons:"codicon codicon-link-external","aria-hidden":this.state._hideLabel})),(0,i.h)(l.g,{key:"82b1b8743a22f9ec83ab6cd01f661238112018cd","aria-hidden":"true",class:"kol-link__tooltip",hidden:o||!this.state._hideLabel,_badgeText:this.state._accessKey||this.state._shortKey,_align:this.state._tooltipAlign,_label:this.state._label||this.state._href}),n&&(0,i.h)("span",{key:"92af77be20df69e2ef60891adf012e3a879dcbbd",class:"visually-hidden",id:this.internalDescriptionById},this.state._ariaDescription))}validateAccessKey(t){(0,d.v)(this,t),(0,d.a)(t,this._shortKey)}validateAriaCurrentValue(t){((t,e)=>{(0,v.w)(t,"_ariaCurrentValue",(t=>"string"==typeof t&&w.includes(t)),new Set([`AriaCurrentValue {${w.join(", ")}`]),e,{defaultValue:"page"})})(this,t)}validateAriaDescription(t){(0,b.v)(this,t)}validateAriaExpanded(t){(0,b.a)(this,t)}validateAriaOwns(t){((t,e)=>{(0,v.i)(t,"_ariaOwns",e,{defaultValue:void 0})})(this,t)}validateCustomClass(t){(0,f.v)(this,t)}validateDisabled(t){(0,p.v)(this,t)}validateDownload(t){((t,e)=>{(0,v.i)(t,"_download",e)})(this,t)}validateHideLabel(t){(0,g.v)(this,t)}validateHref(t){(0,_.v)(this,t,{required:!0})}validateIcons(t){(0,y.v)(this,t)}validateLabel(t){(0,k.a)(this,t)}validateOn(t){((t,e)=>{"object"==typeof e&&"function"==typeof(null==e?void 0:e.onClick)&&(t.state=Object.assign(Object.assign({},t.state),{_on:e}))})(this,t)}validateRole(t){(0,b.b)(this,t)}validateShortKey(t){(0,d.b)(this,t),(0,d.a)(this._accessKey,t)}validateTabIndex(t){(0,d.c)(this,t)}validateTarget(t){((t,e)=>{(0,v.i)(t,"_target",e)})(this,t)}validateTooltipAlign(t){(0,m.v)(this,t)}validateVariant(t){(0,b.c)(this,t)}componentWillLoad(){this.validateAccessKey(this._accessKey),this.validateAriaCurrentValue(this._ariaCurrentValue),this.validateAriaDescription(this._ariaDescription),this.validateAriaExpanded(this._ariaExpanded),this.validateAriaOwns(this._ariaOwns),this.validateCustomClass(this._customClass),this.validateDisabled(this._disabled),this.validateDownload(this._download),this.validateHideLabel(this._hideLabel),this.validateHref(this._href),this.validateIcons(this._icons),this.validateLabel(this._label),this.validateOn(this._on),this.validateRole(this._role),this.validateShortKey(this._shortKey),this.validateTabIndex(this._tabIndex),this.validateTarget(this._target),this.validateTooltipAlign(this._tooltipAlign),this.validateVariant(this._variant),this.unsubscribeOnLocationChange=(0,s.o)((t=>{this.state._ariaCurrent=t===this.state._href?this.state._ariaCurrentValue:void 0})),(0,d.a)(this._accessKey,this._shortKey)}disconnectedCallback(){this.unsubscribeOnLocationChange&&this.unsubscribeOnLocationChange()}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_ariaCurrentValue:["validateAriaCurrentValue"],_ariaDescription:["validateAriaDescription"],_ariaExpanded:["validateAriaExpanded"],_ariaOwns:["validateAriaOwns"],_customClass:["validateCustomClass"],_disabled:["validateDisabled"],_download:["validateDownload"],_hideLabel:["validateHideLabel"],_href:["validateHref"],_icons:["validateIcons"],_label:["validateLabel"],_on:["validateOn"],_role:["validateRole"],_shortKey:["validateShortKey"],_tabIndex:["validateTabIndex"],_target:["validateTarget"],_tooltipAlign:["validateTooltipAlign"],_variant:["validateVariant"]}}}},1074:(t,e,a)=>{a.d(e,{a:()=>c,b:()=>l,c:()=>r,h:()=>s,v:()=>h});var i=a(5800);const s=[0,1,2,3,4,5,6],o=/[a-zA-Z0-9äöüÄÖÜß]/g,n=/^\d+$/;function l(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(o))||void 0===e?void 0:e.length)||0}(t)>=e}function r(t){return n.test(t)}const d=new Set(["string"]),h=(t,e,a={})=>{(0,i.w)(t,"_label",(t=>"string"==typeof t),d,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,a,s,o)=>{var n,d;"function"==typeof(null===(n=t.hooks)||void 0===n?void 0:n.afterPatch)&&(null===(d=t.hooks)||void 0===d||d.afterPatch(e,a,s,o)),"string"==typeof e&&!1===l(e,3)&&!1===r(e)&&(0,i.a)(`The heading or label ("${e}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof e&&e.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(a))},c=h},356:(t,e,a)=>{a.d(e,{v:()=>s});var i=a(9246);const s=(t,e)=>{(0,i.a)(t,"_tooltipAlign",e)}}}]);