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

package/dist/5151.js

@@ -1,2 +1,2 @@
 /*! For license information please see 5151.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5151],{5626:(t,e,n)=>{n.d(e,{K:()=>h});var o=n(4600),a=n(6783),i=n(9060),s=n(3584),l=n(7662),r=n(3334);const c=({ariaLabel:t,icon:e})=>(0,a.h)(l.d,{class:"kol-alert__heading-icon",_label:t,_icons:e}),d=({type:t,label:e})=>{switch(t){case"error":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-error"),icon:"codicon codicon-error",label:e});case"info":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-info"),icon:"codicon codicon-info",label:e});case"warning":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-warning"),icon:"codicon codicon-warning",label:e});case"success":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-success"),icon:"codicon codicon-pass",label:e});default:return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-message"),icon:"codicon codicon-comment",label:e})}},h=(t,e)=>{var n,c;const{class:h={},type:u="default",variant:b="msg",label:p,hasCloser:f,alert:m,onAlertTimeout:g,onCloserClick:v,level:k}=t,y=(0,o._)(t,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);m&&((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==g||g()}),1e4));const _=Object.assign({class:(0,i.c)("kol-alert",`kol-alert--${u}`,`kol-alert--${b}`,{"kol-alert--hasCloser":!!f},h),role:m?"alert":void 0},y);return(0,a.h)("div",Object.assign({},_),(0,a.h)("div",{class:"kol-alert__container"},(0,a.h)(d,{label:p,type:u}),(0,a.h)("div",{class:"kol-alert__container-content"},p?(0,a.h)(r.K,{class:"kol-alert__heading",level:k},p):null,"msg"===b&&(0,a.h)("div",{class:"kol-alert__content"},e)),f&&(0,a.h)(l.a,{class:"kol-alert__close-button close","data-testid":"alert-close-button",_ariaDescription:(null==p?void 0:p.trim())||"",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:(0,s.t)("kol-close-alert"),_on:{onClick:v},_tooltipAlign:"left"})),"card"===b&&(0,a.h)("div",{class:"kol-alert__content"},e))}},3334:(t,e,n)=>{n.d(e,{K:()=>d});var o=n(4600),a=n(6783),i=n(9060);const s=1;function l(t){return function(t){return t>=s&&t<=6}(t)?`h${t}`:"strong"}const r=(t,e)=>{var{class:n,level:r=s,variant:c}=t,d=(0,o._)(t,["class","level","variant"]);const h=l(r),u=c||h;return(0,a.h)(h,Object.assign({class:(0,i.c)("kol-headline",`kol-headline--${u}`,n)},d),e)},c=(t,e)=>{var{class:n,level:r=s}=t,c=(0,o._)(t,["class","level"]);const d=function(t){return 1===t?"span":l(t)}(r+1);return(0,a.h)(d,Object.assign({class:(0,i.c)("kol-headline kol-headline--group kol-headline--secondary",n)},c),e)},d=(t,e)=>{var{secondaryHeadline:n,level:l=s,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=t,b=(0,o._)(t,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const p=Object.assign({level:l},b);if(!n)return(0,a.h)(r,Object.assign({class:(0,i.c)(d,"kol-headline--single")},p),e);const{class:f}=h,m=(0,o._)(h,["class"]),g=Object.assign({class:(0,i.c)("kol-heading-group",f)},m);return(0,a.h)("hgroup",Object.assign({},g),(0,a.h)(r,Object.assign({class:(0,i.c)(d,"kol-headline--group","kol-headline--primary")},p),e),(0,a.h)(c,Object.assign({level:l},u),n))}},9060:(t,e,n)=>{function o(t){var e,n,a="";if("string"==typeof t||"number"==typeof t)a+=t;else if("object"==typeof t)if(Array.isArray(t)){var i=t.length;for(e=0;e<i;e++)t[e]&&(n=o(t[e]))&&(a&&(a+=" "),a+=n)}else for(n in t)t[n]&&(a&&(a+=" "),a+=n);return a}function a(){for(var t,e,n=0,a="",i=arguments.length;n<i;n++)(t=arguments[n])&&(e=o(t))&&(a&&(a+=" "),a+=e);return a}n.d(e,{c:()=>a})},7336:(t,e,n)=>{n.d(e,{i:()=>l,n:()=>c,r:()=>r});var o=n(6783),a=n(5687),i=n(1732);const s=()=>{let t=(0,i.d)().KoliBri;return void 0===t&&(t={},Object.defineProperty((0,i.d)(),"KoliBri",{value:t,writable:!1})),t},l=()=>{(()=>{const t=(0,i.g)().querySelector('meta[name="kolibri"]');if(t&&t.hasAttribute("content")){const e=t.getAttribute("content");"string"==typeof e&&((0,i.s)(e.includes("dev-mode=true")),(0,i.b)(e.includes("experimental-mode=true")),(0,i.c)(e.includes("color-contrast-analysis=true")))}})(),i.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${o.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==s().adviceShown&&(Object.defineProperty(s(),"adviceShown",{get:function(){return!0}}),i.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===a.p&&(c=()=>"nonce")},3584:(t,e,n)=>{n.d(e,{t:()=>i});var o=n(8461),a=n(5687);let i=(t,e)=>{var n;return(null!==(n=(0,o.g)())&&void 0!==n?n:(0,o.i)("de")).translate(t,e)};"test"===a.p&&(i=t=>t)},5151:(t,e,n)=>{n.r(e),n.d(e,{kol_toast_container:()=>u});var o=n(6783),a=n(3584),i=n(7336),s=n(7662),l=n(4600),r=n(9060),c=n(5626),d=(t,e,n)=>new Promise(((o,a)=>{var i=t=>{try{l(n.next(t))}catch(t){a(t)}},s=t=>{try{l(n.throw(t))}catch(t){a(t)}},l=t=>t.done?o(t.value):Promise.resolve(t.value).then(i,s);l((n=n.apply(t,e)).next())}));const h=t=>{var{status:e,toast:n,onClose:a}=t,i=(0,l._)(t,["status","toast","onClose"]);const{type:s,label:d,description:h,variant:u}=n;return(0,o.h)("div",{class:(0,r.c)("kol-toast-item",`kol-toast-item--${e}`)},(0,o.h)(c.K,{class:"kol-toast-item__alert",alert:!0,label:d,level:0,hasCloser:!0,type:s,variant:u||"card",onCloserClick:a},(0,o.h)("div",Object.assign({},i),h)))},u=class{constructor(t){(0,o.r)(this,t),this.knownRenderFunctions=new Set,this.state={_toastStates:[]}}enqueue(t){return d(this,null,(function*(){const e={toast:t,status:"adding",id:`toast-${(0,i.n)()}`};return this.state=Object.assign(Object.assign({},this.state),{_toastStates:[e,...this.state._toastStates]}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map((t=>t.id===e.id&&"removing"!==t.status?Object.assign(Object.assign({},t),{status:"settled"}):t))})}),300),()=>{this.handleClose(e)}}))}handleClose(t){this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map((e=>(e.id===t.id&&(e.status="removing"),e)))}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.filter((e=>e.id!==t.id))})}),300)}closeAll(t=!1){return d(this,null,(function*(){if(t)this.state=Object.assign(Object.assign({},this.state),{_toastStates:[]});else{const t=[...this.state._toastStates];this.state=Object.assign(Object.assign({},this.state),{_toastStates:t.map((t=>Object.assign(Object.assign({},t),{status:"removing"})))}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.filter((e=>t.every((t=>t.id!==e.id))))})}),300)}}))}handleToastRef(t,e){e&&"function"==typeof t.toast.render&&!this.knownRenderFunctions.has(t.toast.render)&&(this.knownRenderFunctions.add(t.toast.render),t.toast.render(e,{close:()=>this.handleClose(t)}))}render(){return(0,o.h)(o.H,{key:"4446bc4544f05d74ee8afd3757d8c0b7ce58d6c4",class:"kol-toast-container"},this.state._toastStates.length>1&&(0,o.h)(s.i,{key:"923a3ae7f4463e710bebbe94ffb7d55812510f70",_label:(0,a.t)("kol-toast-close-all"),class:"kol-toast-container__button-close-all",_on:{onClick:()=>{this.closeAll()}}}),this.state._toastStates.map((t=>(0,o.h)(h,{key:t.id,onClose:()=>this.handleClose(t),ref:e=>this.handleToastRef(t,e),toast:t.toast,status:t.status}))))}};u.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  :host {\n    display: flex;\n    flex-direction: column;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    position: fixed;\n    z-index: 200;\n  }\n  .kol-toast-container__close-all {\n    align-self: flex-end;\n  }\n}"}},5687:(t,e,n)=>{n.d(e,{b:()=>s,h:()=>a,p:()=>o,s:()=>i});let o="development";try{o="production"}catch(t){o="production"}const a=(t,e,n)=>{if(t&&e&&"string"==typeof n){const o=t.querySelector(`[slot="${n}"]`);o&&e.appendChild(o)}},i=t=>""===t,s=(t,e)=>t||e||""},4600:(t,e,n)=>{function o(t,e){var n={};for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&e.indexOf(o)<0&&(n[o]=t[o]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(t);a<o.length;a++)e.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(t,o[a])&&(n[o[a]]=t[o[a]])}return n}n.d(e,{_:()=>o}),"function"==typeof SuppressedError&&SuppressedError}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5151],{7754:(t,e,n)=>{n.d(e,{K:()=>h});var o=n(4600),a=n(6922),i=n(9060),s=n(3584),l=n(7662),r=n(6576);const c=({ariaLabel:t,icon:e})=>(0,a.h)(l.d,{class:"kol-alert__heading-icon",_label:t,_icons:e}),d=({type:t,label:e})=>{switch(t){case"error":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-error"),icon:"codicon codicon-error",label:e});case"info":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-info"),icon:"codicon codicon-info",label:e});case"warning":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-warning"),icon:"codicon codicon-warning",label:e});case"success":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-success"),icon:"codicon codicon-pass",label:e});default:return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-message"),icon:"codicon codicon-comment",label:e})}},h=(t,e)=>{var n,c;const{class:h={},type:u="default",variant:b="msg",label:p,hasCloser:f,alert:m,onAlertTimeout:g,onCloserClick:v,level:k}=t,y=(0,o._)(t,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);m&&((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==g||g()}),1e4));const _=Object.assign({class:(0,i.c)("kol-alert",`kol-alert--${u}`,`kol-alert--${b}`,{"kol-alert--hasCloser":!!f},h),role:m?"alert":void 0},y);return(0,a.h)("div",Object.assign({},_),(0,a.h)("div",{class:"kol-alert__container"},(0,a.h)(d,{label:p,type:u}),(0,a.h)("div",{class:"kol-alert__container-content"},p?(0,a.h)(r.K,{class:"kol-alert__heading",level:k},p):null,"msg"===b&&(0,a.h)("div",{class:"kol-alert__content"},e)),f&&(0,a.h)(l.a,{class:"kol-alert__close-button close","data-testid":"alert-close-button",_ariaDescription:(null==p?void 0:p.trim())||"",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:(0,s.t)("kol-close-alert"),_on:{onClick:v},_tooltipAlign:"left"})),"card"===b&&(0,a.h)("div",{class:"kol-alert__content"},e))}},6576:(t,e,n)=>{n.d(e,{K:()=>d});var o=n(4600),a=n(6922),i=n(9060);const s=1;function l(t){return function(t){return t>=s&&t<=6}(t)?`h${t}`:"strong"}const r=(t,e)=>{var{class:n,level:r=s,variant:c}=t,d=(0,o._)(t,["class","level","variant"]);const h=l(r),u=c||h;return(0,a.h)(h,Object.assign({class:(0,i.c)("kol-headline",`kol-headline--${u}`,n)},d),e)},c=(t,e)=>{var{class:n,level:r=s}=t,c=(0,o._)(t,["class","level"]);const d=function(t){return 1===t?"span":l(t)}(r+1);return(0,a.h)(d,Object.assign({class:(0,i.c)("kol-headline kol-headline--group kol-headline--secondary",n)},c),e)},d=(t,e)=>{var{secondaryHeadline:n,level:l=s,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=t,b=(0,o._)(t,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const p=Object.assign({level:l},b);if(!n)return(0,a.h)(r,Object.assign({class:(0,i.c)(d,"kol-headline--single")},p),e);const{class:f}=h,m=(0,o._)(h,["class"]),g=Object.assign({class:(0,i.c)("kol-heading-group",f)},m);return(0,a.h)("hgroup",Object.assign({},g),(0,a.h)(r,Object.assign({class:(0,i.c)(d,"kol-headline--group","kol-headline--primary")},p),e),(0,a.h)(c,Object.assign({level:l},u),n))}},9060:(t,e,n)=>{function o(t){var e,n,a="";if("string"==typeof t||"number"==typeof t)a+=t;else if("object"==typeof t)if(Array.isArray(t)){var i=t.length;for(e=0;e<i;e++)t[e]&&(n=o(t[e]))&&(a&&(a+=" "),a+=n)}else for(n in t)t[n]&&(a&&(a+=" "),a+=n);return a}function a(){for(var t,e,n=0,a="",i=arguments.length;n<i;n++)(t=arguments[n])&&(e=o(t))&&(a&&(a+=" "),a+=e);return a}n.d(e,{c:()=>a})},4215:(t,e,n)=>{n.d(e,{i:()=>l,n:()=>c,r:()=>r});var o=n(6922),a=n(5687),i=n(1732);const s=()=>{let t=(0,i.d)().KoliBri;return void 0===t&&(t={},Object.defineProperty((0,i.d)(),"KoliBri",{value:t,writable:!1})),t},l=()=>{(()=>{const t=(0,i.g)().querySelector('meta[name="kolibri"]');if(t&&t.hasAttribute("content")){const e=t.getAttribute("content");"string"==typeof e&&((0,i.s)(e.includes("dev-mode=true")),(0,i.b)(e.includes("experimental-mode=true")),(0,i.c)(e.includes("color-contrast-analysis=true")))}})(),i.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${o.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==s().adviceShown&&(Object.defineProperty(s(),"adviceShown",{get:function(){return!0}}),i.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===a.p&&(c=()=>"nonce")},3584:(t,e,n)=>{n.d(e,{t:()=>i});var o=n(8461),a=n(5687);let i=(t,e)=>{var n;return(null!==(n=(0,o.g)())&&void 0!==n?n:(0,o.i)("de")).translate(t,e)};"test"===a.p&&(i=t=>t)},5151:(t,e,n)=>{n.r(e),n.d(e,{kol_toast_container:()=>u});var o=n(6922),a=n(3584),i=n(4215),s=n(7662),l=n(4600),r=n(9060),c=n(7754),d=(t,e,n)=>new Promise(((o,a)=>{var i=t=>{try{l(n.next(t))}catch(t){a(t)}},s=t=>{try{l(n.throw(t))}catch(t){a(t)}},l=t=>t.done?o(t.value):Promise.resolve(t.value).then(i,s);l((n=n.apply(t,e)).next())}));const h=t=>{var{status:e,toast:n,onClose:a}=t,i=(0,l._)(t,["status","toast","onClose"]);const{type:s,label:d,description:h,variant:u}=n;return(0,o.h)("div",{class:(0,r.c)("kol-toast-item",`kol-toast-item--${e}`)},(0,o.h)(c.K,{class:"kol-toast-item__alert",alert:!0,label:d,level:0,hasCloser:!0,type:s,variant:u||"card",onCloserClick:a},(0,o.h)("div",Object.assign({},i),h)))},u=class{constructor(t){(0,o.r)(this,t),this.knownRenderFunctions=new Set,this.state={_toastStates:[]}}enqueue(t){return d(this,null,(function*(){const e={toast:t,status:"adding",id:`toast-${(0,i.n)()}`};return this.state=Object.assign(Object.assign({},this.state),{_toastStates:[e,...this.state._toastStates]}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map((t=>t.id===e.id&&"removing"!==t.status?Object.assign(Object.assign({},t),{status:"settled"}):t))})}),300),()=>{this.handleClose(e)}}))}handleClose(t){this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map((e=>(e.id===t.id&&(e.status="removing"),e)))}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.filter((e=>e.id!==t.id))})}),300)}closeAll(t=!1){return d(this,null,(function*(){if(t)this.state=Object.assign(Object.assign({},this.state),{_toastStates:[]});else{const t=[...this.state._toastStates];this.state=Object.assign(Object.assign({},this.state),{_toastStates:t.map((t=>Object.assign(Object.assign({},t),{status:"removing"})))}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.filter((e=>t.every((t=>t.id!==e.id))))})}),300)}}))}handleToastRef(t,e){e&&"function"==typeof t.toast.render&&!this.knownRenderFunctions.has(t.toast.render)&&(this.knownRenderFunctions.add(t.toast.render),t.toast.render(e,{close:()=>this.handleClose(t)}))}render(){return(0,o.h)(o.H,{key:"4446bc4544f05d74ee8afd3757d8c0b7ce58d6c4",class:"kol-toast-container"},this.state._toastStates.length>1&&(0,o.h)(s.i,{key:"923a3ae7f4463e710bebbe94ffb7d55812510f70",_label:(0,a.t)("kol-toast-close-all"),class:"kol-toast-container__button-close-all",_on:{onClick:()=>{this.closeAll()}}}),this.state._toastStates.map((t=>(0,o.h)(h,{key:t.id,onClose:()=>this.handleClose(t),ref:e=>this.handleToastRef(t,e),toast:t.toast,status:t.status}))))}};u.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  :host {\n    display: flex;\n    flex-direction: column;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    position: fixed;\n    z-index: 200;\n  }\n  .kol-toast-container__close-all {\n    align-self: flex-end;\n  }\n}"}},5687:(t,e,n)=>{n.d(e,{b:()=>s,h:()=>a,p:()=>o,s:()=>i});let o="development";try{o="production"}catch(t){o="production"}const a=(t,e,n)=>{if(t&&e&&"string"==typeof n){const o=t.querySelector(`[slot="${n}"]`);o&&e.appendChild(o)}},i=t=>""===t,s=(t,e)=>t||e||""},4600:(t,e,n)=>{function o(t,e){var n={};for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&e.indexOf(o)<0&&(n[o]=t[o]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(t);a<o.length;a++)e.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(t,o[a])&&(n[o[a]]=t[o[a]])}return n}n.d(e,{_:()=>o}),"function"==typeof SuppressedError&&SuppressedError}}]);

package/dist/5171.js

@@ -1,2 +1,2 @@
 /*! For license information please see 5171.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5171],{4667:(e,t,n)=>{n.d(t,{I:()=>r,a:()=>d});var i=n(970),o=n(1799),a=n(5800),l=n(623);const s=["text","search","url","tel"];class r extends i.I{constructor(e,t,n){super(e,t,n),this.component=e}validateSuggestions(e){(0,l.v)(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateSuggestions(this.component._suggestions)}}class d extends r{constructor(e,t,n){super(e,t,n),this.hasError=!1,this.component=e}validateSpellCheck(e){(0,o.v)(this.component,e)}validateType(e){(0,a.w)(this.component,"_type",(e=>"string"==typeof e&&s.includes(e)),new Set([`String {${s.join(", ")}`]),e)}componentWillLoad(){super.componentWillLoad(),this.validateSpellCheck(this.component._spellCheck),this.validateType(this.component._type)}}},5171:(e,t,n)=>{n.r(t),n.d(t,{kol_input_email:()=>m});var i=n(6783),o=n(9060),a=n(7336),l=n(9574),s=n(4667),r=n(5800),d=n(5363),c=n(7146),h=n(8625),u=(e,t,n)=>new Promise(((i,o)=>{var a=e=>{try{s(n.next(e))}catch(e){o(e)}},l=e=>{try{s(n.throw(e))}catch(e){o(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(a,l);s((n=n.apply(e,t)).next())}));class p extends s.I{constructor(e,t,n){super(e,t,n),this.component=e}validateMultiple(e){((e,t)=>{(0,r.b)(e,"_multiple",t)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const m=class{getValue(){return u(this,null,(function*(){var e;return null===(e=this.inputRef)||void 0===e?void 0:e.value}))}kolFocus(){return u(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}getFormFieldProps(){return{state:this.state,class:(0,o.c)("kol-input-email","email",{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,onClick:()=>{var e;return null===(e=this.inputRef)||void 0===e?void 0:e.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"email"},this.controller.onFacade),{onInput:this.onInput,onKeyDown:this.onKeyDown,onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1}})}render(){return(0,i.h)(h.K,Object.assign({key:"1da21bd08b98eaa5d1fd8b0570a5305b753fb3d8"},this.getFormFieldProps()),(0,i.h)(d.K,{key:"e4a2763de575dd266cd0367a5221d2f301b09bc8",state:this.state},(0,i.h)(c.K,Object.assign({key:"6ca6d3beed387300f7ed049a3d32f4bff1d3a2eb"},this.getInputProps()))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onKeyDown=e=>{"Enter"!==e.code&&"NumpadEnter"!==e.code||(0,l.p)({form:this.host,ref:this.inputRef})},this.onInput=e=>{const t=e.target.value;(0,r.s)(this,"_currentLength",t.length),this._value=t,this.controller.onFacade.onInput(e)},this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hasCounter=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._maxLength=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=!1,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_hasValue:!1,_hideMsg:!1,_id:`id-${(0,a.n)()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new p(this,"email",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAutoComplete(e){this.controller.validateAutoComplete(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHasCounter(e){this.controller.validateHasCounter(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)}validateMaxLength(e){this.controller.validateMaxLength(e)}validateMsg(e){this.controller.validateMsg(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validatePattern(e){this.controller.validatePattern(e)}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateReadOnly(e){this.controller.validateReadOnly(e)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSuggestions(e){this.controller.validateSuggestions(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((e=>this.state._hasValue=!!e))}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hasCounter:["validateHasCounter"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};m.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    cursor: pointer;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    height: calc(44rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}"}},1799:(e,t,n)=>{n.d(t,{v:()=>o});var i=n(5800);const o=(e,t)=>{(0,i.b)(e,"_spellCheck",t,{defaultValue:void 0})}},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([[5171],{5618:(e,t,n)=>{n.d(t,{I:()=>r,a:()=>d});var i=n(8657),o=n(1799),a=n(5800),l=n(623);const s=["text","search","url","tel"];class r extends i.I{constructor(e,t,n){super(e,t,n),this.component=e}validateSuggestions(e){(0,l.v)(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateSuggestions(this.component._suggestions)}}class d extends r{constructor(e,t,n){super(e,t,n),this.hasError=!1,this.component=e}validateSpellCheck(e){(0,o.v)(this.component,e)}validateType(e){(0,a.w)(this.component,"_type",(e=>"string"==typeof e&&s.includes(e)),new Set([`String {${s.join(", ")}`]),e)}componentWillLoad(){super.componentWillLoad(),this.validateSpellCheck(this.component._spellCheck),this.validateType(this.component._type)}}},5171:(e,t,n)=>{n.r(t),n.d(t,{kol_input_email:()=>m});var i=n(6922),o=n(9060),a=n(4215),l=n(9574),s=n(5618),r=n(5800),d=n(7055),c=n(531),h=n(3623),u=(e,t,n)=>new Promise(((i,o)=>{var a=e=>{try{s(n.next(e))}catch(e){o(e)}},l=e=>{try{s(n.throw(e))}catch(e){o(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(a,l);s((n=n.apply(e,t)).next())}));class p extends s.I{constructor(e,t,n){super(e,t,n),this.component=e}validateMultiple(e){((e,t)=>{(0,r.b)(e,"_multiple",t)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateMultiple(this.component._multiple)}}const m=class{getValue(){return u(this,null,(function*(){var e;return null===(e=this.inputRef)||void 0===e?void 0:e.value}))}kolFocus(){return u(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}getFormFieldProps(){return{state:this.state,class:(0,o.c)("kol-input-email","email",{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,onClick:()=>{var e;return null===(e=this.inputRef)||void 0===e?void 0:e.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,state:this.state,type:"email"},this.controller.onFacade),{onInput:this.onInput,onKeyDown:this.onKeyDown,onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1}})}render(){return(0,i.h)(h.K,Object.assign({key:"1da21bd08b98eaa5d1fd8b0570a5305b753fb3d8"},this.getFormFieldProps()),(0,i.h)(d.K,{key:"e4a2763de575dd266cd0367a5221d2f301b09bc8",state:this.state},(0,i.h)(c.K,Object.assign({key:"6ca6d3beed387300f7ed049a3d32f4bff1d3a2eb"},this.getInputProps()))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onKeyDown=e=>{"Enter"!==e.code&&"NumpadEnter"!==e.code||(0,l.p)({form:this.host,ref:this.inputRef})},this.onInput=e=>{const t=e.target.value;(0,r.s)(this,"_currentLength",t.length),this._value=t,this.controller.onFacade.onInput(e)},this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hasCounter=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._maxLength=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._pattern=void 0,this._placeholder=void 0,this._readOnly=!1,this._required=!1,this._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_currentLength:0,_hasValue:!1,_hideMsg:!1,_id:`id-${(0,a.n)()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new p(this,"email",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAutoComplete(e){this.controller.validateAutoComplete(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHasCounter(e){this.controller.validateHasCounter(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)}validateMaxLength(e){this.controller.validateMaxLength(e)}validateMsg(e){this.controller.validateMsg(e)}validateMultiple(e){this.controller.validateMultiple(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validatePattern(e){this.controller.validatePattern(e)}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateReadOnly(e){this.controller.validateReadOnly(e)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSuggestions(e){this.controller.validateSuggestions(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener((e=>this.state._hasValue=!!e))}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hasCounter:["validateHasCounter"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_msg:["validateMsg"],_multiple:["validateMultiple"],_name:["validateName"],_on:["validateOn"],_pattern:["validatePattern"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_required:["validateRequired"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_smartButton:["validateSmartButton"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};m.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    cursor: pointer;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    height: calc(44rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}"}},1799:(e,t,n)=>{n.d(t,{v:()=>o});var i=n(5800);const o=(e,t)=>{(0,i.b)(e,"_spellCheck",t,{defaultValue:void 0})}},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/{9244.js → 5718.js}

@@ -1,2 +1,2 @@
-/*! For license information please see 9244.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[9244],{375:(e,t,n)=>{n.d(t,{K:()=>a});var o=n(6783),i=n(7662);const a=e=>{const{class:t,style:n,icons:a,label:s,onClick:l}=e;return(0,o.h)(i.d,{class:t,style:n,onClick:l,_icons:a,_label:s})}},3163:(e,t,n)=>{n.d(t,{K:()=>c});var o=n(4600),i=n(6783),a=n(9060),s=n(8625),l=n(5650);const c=e=>{const{class:t,msg:n,required:c,disabled:r,touched:d,readonly:u,ariaDescribedBy:h,hideLabel:p,label:m,suggestions:b,value:_}=e,g=(0,o._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),v=(0,l.c)(n,d),f={"kol-input--disabled":Boolean(r),"kol-input--required":Boolean(c),"kol-input--touched":Boolean(d),"kol-input--readonly":Boolean(u),[`kol-input--${(null==n?void 0:n.type)||"error"}`]:v},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",f,t),required:c,disabled:r,readonly:u,type:"text",list:b?`${g.id}-list`:void 0},(0,s.d)({ariaDescribedBy:h,hideLabel:p,label:m})),g);return(0,i.h)(i.F,null,(0,i.h)("input",Object.assign({},y,{value:_})),b)}},7146:(e,t,n)=>{n.d(t,{K:()=>r,a:()=>c});var o=n(4600),i=n(6783),a=n(8625),s=n(3163),l=n(5650);const c=e=>{var{id:t,suggestions:n}=e,a=(0,o._)(e,["id","suggestions"]);return n?(0,i.h)("datalist",Object.assign({id:`${t}-list`},a),n.map((e=>(0,i.h)("option",{value:e})))):null},r=e=>{var{state:t,customSuggestions:n}=e,r=(0,o._)(e,["state","customSuggestions"]);return(0,i.h)(s.K,Object.assign({},function(e,t){const{ariaDescribedBy:n}=(0,a.g)(e),o={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:n};return"_type"in e&&(o.type=e._type),"_value"in e&&(o.value=e._value),"_required"in e&&(o.required=e._required),"_maxLength"in e&&(o.maxlength=e._maxLength),"_placeholder"in e&&(o.placeholder=e._placeholder),"_autoComplete"in e&&(o.autoComplete=e._autoComplete),"_spellCheck"in e&&(o.spellcheck=e._spellCheck),"_pattern"in e&&(o.pattern=e._pattern),"_readOnly"in e&&(o.readonly=e._readOnly),"_min"in e&&(o.min=e._min),"_max"in e&&(o.max=e._max),"_step"in e&&(o.step=e._step),"_multiple"in e&&(o.multiple=e._multiple),"_checked"in e&&(o.checked=e._checked),"_indeterminate"in e&&(o.indeterminate=e._indeterminate),"_touched"in e&&(o.touched=e._touched),"_msg"in e&&(o.msg=(0,l.a)(e._msg)),"_suggestions"in e&&!t&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(o.suggestions=(0,i.h)(c,{id:e._id,suggestions:e._suggestions})),o}(t,n),r))}},9574:(e,t,n)=>{n.d(t,{a:()=>l,p:()=>c});var o=n(7662),i=n(5800),a=n(1732);const s=e=>{for((0,a.a)()&&((0,i.j)("↓ Search form element start."),a.L.debug(e));e instanceof HTMLElement&&"FORM"!==e.tagName&&e.tagName!==o.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,i.j)("↑ Search form element finished."))}return e},l=(e={})=>{var t,n;const a=s(e.form);if(a instanceof HTMLElement){const e=new Event("reset",{bubbles:!0,cancelable:!0});if("FORM"===a.tagName)(0,i.q)(e,a),a.dispatchEvent(e);else if(a.tagName===o.h.toUpperCase()){(0,i.q)(e,i.K.querySelector("form",a));const o=a;"function"==typeof(null===(t=o._on)||void 0===t?void 0:t.onReset)&&(null===(n=o._on)||void 0===n||n.onReset(e))}}},c=(e={})=>{const t=s(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,i.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,i.q)(e,t),t.dispatchEvent(e))}));else if(t.tagName===o.h.toUpperCase()){(0,i.q)(e,i.K.querySelector("form",t));const n=t;setTimeout((()=>{var t,o;"function"==typeof(null===(t=n._on)||void 0===t?void 0:t.onSubmit)&&(null===(o=n._on)||void 0===o||o.onSubmit(e))}))}}}},970:(e,t,n)=>{n.d(t,{I:()=>l});var o=n(5800),i=n(5363),a=n(1166);const s=["default","visibility-toggle"];class l extends i.I{constructor(e,t,n){super(e,t,n),this.afterSyncCharCounter=()=>{"string"==typeof this.component._value&&this.component._value.length>0&&(this.component.state._currentLength=this.component._value.length)},this.component=e}validateAutoComplete(e){(0,o.w)(this.component,"_autoComplete",(e=>"string"==typeof e&&("on"===e||"off"===e)),new Set(["on | off"]),e)}validateHasCounter(e){(0,a.v)(this.component,e,{hooks:{afterPatch:this.afterSyncCharCounter}})}validateVariant(e){((e,t)=>{(0,o.w)(e,"_variant",(e=>"string"==typeof e&&s.includes(e)),new Set(s),t)})(this.component,e)}validateMaxLength(e){(0,o.k)(this.component,"_maxLength",e,{hooks:{afterPatch:this.afterSyncCharCounter},min:0})}validatePattern(e){(0,o.i)(this.component,"_pattern",e)}validatePlaceholder(e){(0,o.i)(this.component,"_placeholder",e)}validateReadOnly(e){(0,o.b)(this.component,"_readOnly",e)}validateRequired(e){(0,o.b)(this.component,"_required",e)}validateValue(e){(0,o.i)(this.component,"_value",e,{hooks:{afterPatch:this.afterSyncCharCounter}}),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateHasCounter(this.component._hasCounter),this.validateMaxLength(this.component._maxLength),this.validatePattern(this.component._pattern),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateValue(this.component._value),this.validateVariant(this.component._variant)}}},5363:(e,t,n)=>{n.d(t,{I:()=>j,K:()=>k,a:()=>y});var o=n(6783),i=n(2587),a=n(665),s=n(4600),l=n(7662),c=n(375),r=n(9060),d=n(5650),u=n(8625),h=n(8973),p=n(5800),m=n(608);const b=(e,t)=>{var{position:n="start",class:i}=e,a=(0,s._)(e,["position","class"]);const l="kol-input-container__adornment",c=`${l}--${n}`;return(0,o.h)("div",Object.assign({class:(0,r.c)(l,c,i)},a),t)};function _(e){return!!e&&(Array.isArray(e)?e.length>0:Boolean(e))}const g=(e,t)=>{var{class:n}=e,i=(0,s._)(e,["class"]);return(0,o.h)("div",Object.assign({class:(0,r.c)("kol-input-container__container",n)},i),t)},v=(e,t)=>{const{class:n,startAdornment:i,endAdornment:a,disabled:l,msg:c,touched:u,containerProps:h,startAdornmentProps:p,endAdornmentProps:m}=e,v=(0,s._)(e,["class","startAdornment","endAdornment","disabled","msg","touched","containerProps","startAdornmentProps","endAdornmentProps"]),f=(0,d.c)(c,u),y={"kol-input-container--disabled":l,[`kol-input-container--${(null==c?void 0:c.type)||"error"}`]:f},k=Object.assign({class:(0,r.c)("kol-input-container",y,n)},v);return _(i)||_(a)?(0,o.h)("div",Object.assign({},k),(0,o.h)(b,Object.assign({},p,{position:"start"}),i),(0,o.h)(g,Object.assign({},h),t),(0,o.h)(b,Object.assign({},m,{position:"end"}),a)):(0,o.h)("div",Object.assign({},k),(0,o.h)(g,Object.assign({},h),t))},f=e=>{const{label:t,icons:n,hideLabel:i,disabled:a,onClick:c}=e,r=(0,s._)(e,["label","icons","hideLabel","disabled","onClick"]);return(0,o.h)(l.a,Object.assign({tabindex:0,_label:t,_disabled:a,_icons:n,_hideLabel:i,_on:{onClick:c}},r))},y=e=>{const{componentName:t="button",label:n,icon:i,onClick:a}=e,l=(0,s._)(e,["componentName","label","icon","onClick"]),r="button"===t?f:c.K;return(0,o.h)(r,Object.assign({label:n||"",hideLabel:!0,icons:`codicon codicon-${i}`,onClick:a},l))},k=({state:e,endAdornment:t},n)=>{const{icons:s,smartButton:l,disabled:c,msg:r,touched:u}=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,d.a)(e._msg),touched:e._touched}}(e);let h=null==s?void 0:s.left;(0,i.i)(h)&&(h={icon:h});let p=null==s?void 0:s.right;(0,i.i)(p)&&(p={icon:p});const m=[],b=[];return t&&(Array.isArray(t)?b.push(...t):b.push(t)),h&&m.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(h)?h:{}))),(0,a.i)(l)&&b.push((0,o.h)(y,Object.assign({componentName:"button"},l,{hideLabel:!0,disabled:c}))),p&&b.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(p)?p:{}))),(0,o.h)(v,{disabled:c,msg:r,touched:u,startAdornment:m,endAdornment:b},n)},C=(e,t)=>{const n=e;"object"==typeof n&&null!==n&&((0,m.i)(n.right,1)&&(n.right={icon:n.right}),(0,m.i)(n.left,1)&&(n.left={icon:n.left}),t.set("_icons",n))};class j extends u.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,m.i)(e.left,1)||(0,h.i)(e.left)||(0,m.i)(e.right,1)||(0,h.i)(e.right))),new Set(["KoliBriHorizontalIcon"]),e,{hooks:{beforePatch:C},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcons(this.component._icons)}}},1166:(e,t,n)=>{n.d(t,{v:()=>i});var o=n(5800);const i=(e,t,n)=>{(0,o.b)(e,"_hasCounter",t,n)}},8973:(e,t,n)=>{n.d(t,{i:()=>s,v:()=>l});var o=n(5800),i=n(608);const a=(e,t,n)=>{(0,i.b)(n)?e[t]=n:(0,i.i)(n,1)&&(e[t]={icon:n})},s=e=>"object"==typeof e&&null!==e&&(void 0===e.style||(0,i.a)(e.style))&&(void 0===e.label||(0,i.i)(e.label))&&(0,i.i)(e.icon,1),l=(e,t,n={})=>{(0,o.o)(t,(()=>{var l;try{t=(0,o.p)(t)}catch(e){}(0,o.w)(e,"_icons",(e=>{const t="object"==typeof e&&null!==e&&0===Object.keys(e).length;return null===e||t||(0,i.i)(e,1)||"object"==typeof e&&null!==e&&((0,i.i)(e.left,1)||s(e.left)||(0,i.i)(e.right,1)||s(e.right)||(0,i.i)(e.top,1)||s(e.top)||(0,i.i)(e.bottom,1)||s(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,o,s)=>{var l,c;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.beforePatch)&&(null===(c=n.hooks)||void 0===c||c.beforePatch(e,t,o,s)),(e=>{var t,n,o;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===(o=e.nextState)||void 0===o||o.set("_icons",(e=>{let t={};return(0,i.i)(e,1)?t={left:{icon:e}}:"object"==typeof e&&null!==e&&(a(t,"top",e.top),a(t,"right",e.right),a(t,"bottom",e.bottom),a(t,"left",e.left)),t})(t))}})(o)}}}))}))}},665:(e,t,n)=>{function o(e){var t=typeof e;return null!=e&&("object"==t||"function"==t)}n.d(t,{i:()=>o})}}]);
+/*! For license information please see 5718.js.LICENSE.txt */
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5718],{781:(e,t,n)=>{n.d(t,{K:()=>a});var o=n(6922),i=n(7662);const a=e=>{const{class:t,style:n,icons:a,label:s,onClick:l}=e;return(0,o.h)(i.d,{class:t,style:n,onClick:l,_icons:a,_label:s})}},3556:(e,t,n)=>{n.d(t,{K:()=>c});var o=n(4600),i=n(6922),a=n(9060),s=n(3623),l=n(8439);const c=e=>{const{class:t,msg:n,required:c,disabled:r,touched:d,readonly:u,ariaDescribedBy:h,hideLabel:p,label:m,suggestions:b,value:_}=e,g=(0,o._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),v=(0,l.c)(n,d),f={"kol-input--disabled":Boolean(r),"kol-input--required":Boolean(c),"kol-input--touched":Boolean(d),"kol-input--readonly":Boolean(u),[`kol-input--${(null==n?void 0:n.type)||"error"}`]:v},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",f,t),required:c,disabled:r,readonly:u,type:"text",list:b?`${g.id}-list`:void 0},(0,s.d)({ariaDescribedBy:h,hideLabel:p,label:m})),g);return(0,i.h)(i.F,null,(0,i.h)("input",Object.assign({},y,{value:_})),b)}},531:(e,t,n)=>{n.d(t,{K:()=>r,a:()=>c});var o=n(4600),i=n(6922),a=n(3623),s=n(3556),l=n(8439);const c=e=>{var{id:t,suggestions:n}=e,a=(0,o._)(e,["id","suggestions"]);return n?(0,i.h)("datalist",Object.assign({id:`${t}-list`},a),n.map((e=>(0,i.h)("option",{value:e})))):null},r=e=>{var{state:t,customSuggestions:n}=e,r=(0,o._)(e,["state","customSuggestions"]);return(0,i.h)(s.K,Object.assign({},function(e,t){const{ariaDescribedBy:n}=(0,a.g)(e),o={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:n};return"_type"in e&&(o.type=e._type),"_value"in e&&(o.value=e._value),"_required"in e&&(o.required=e._required),"_maxLength"in e&&(o.maxlength=e._maxLength),"_placeholder"in e&&(o.placeholder=e._placeholder),"_autoComplete"in e&&(o.autoComplete=e._autoComplete),"_spellCheck"in e&&(o.spellcheck=e._spellCheck),"_pattern"in e&&(o.pattern=e._pattern),"_readOnly"in e&&(o.readonly=e._readOnly),"_min"in e&&(o.min=e._min),"_max"in e&&(o.max=e._max),"_step"in e&&(o.step=e._step),"_multiple"in e&&(o.multiple=e._multiple),"_checked"in e&&(o.checked=e._checked),"_indeterminate"in e&&(o.indeterminate=e._indeterminate),"_touched"in e&&(o.touched=e._touched),"_msg"in e&&(o.msg=(0,l.a)(e._msg)),"_suggestions"in e&&!t&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(o.suggestions=(0,i.h)(c,{id:e._id,suggestions:e._suggestions})),o}(t,n),r))}},9574:(e,t,n)=>{n.d(t,{a:()=>l,p:()=>c});var o=n(7662),i=n(5800),a=n(1732);const s=e=>{for((0,a.a)()&&((0,i.j)("↓ Search form element start."),a.L.debug(e));e instanceof HTMLElement&&"FORM"!==e.tagName&&e.tagName!==o.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,i.j)("↑ Search form element finished."))}return e},l=(e={})=>{var t,n;const a=s(e.form);if(a instanceof HTMLElement){const e=new Event("reset",{bubbles:!0,cancelable:!0});if("FORM"===a.tagName)(0,i.q)(e,a),a.dispatchEvent(e);else if(a.tagName===o.h.toUpperCase()){(0,i.q)(e,i.K.querySelector("form",a));const o=a;"function"==typeof(null===(t=o._on)||void 0===t?void 0:t.onReset)&&(null===(n=o._on)||void 0===n||n.onReset(e))}}},c=(e={})=>{const t=s(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,i.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,i.q)(e,t),t.dispatchEvent(e))}));else if(t.tagName===o.h.toUpperCase()){(0,i.q)(e,i.K.querySelector("form",t));const n=t;setTimeout((()=>{var t,o;"function"==typeof(null===(t=n._on)||void 0===t?void 0:t.onSubmit)&&(null===(o=n._on)||void 0===o||o.onSubmit(e))}))}}}},8657:(e,t,n)=>{n.d(t,{I:()=>l});var o=n(5800),i=n(7055),a=n(1166);const s=["default","visibility-toggle"];class l extends i.I{constructor(e,t,n){super(e,t,n),this.afterSyncCharCounter=()=>{"string"==typeof this.component._value&&this.component._value.length>0&&(this.component.state._currentLength=this.component._value.length)},this.component=e}validateAutoComplete(e){(0,o.w)(this.component,"_autoComplete",(e=>"string"==typeof e&&("on"===e||"off"===e)),new Set(["on | off"]),e)}validateHasCounter(e){(0,a.v)(this.component,e,{hooks:{afterPatch:this.afterSyncCharCounter}})}validateVariant(e){((e,t)=>{(0,o.w)(e,"_variant",(e=>"string"==typeof e&&s.includes(e)),new Set(s),t)})(this.component,e)}validateMaxLength(e){(0,o.k)(this.component,"_maxLength",e,{hooks:{afterPatch:this.afterSyncCharCounter},min:0})}validatePattern(e){(0,o.i)(this.component,"_pattern",e)}validatePlaceholder(e){(0,o.i)(this.component,"_placeholder",e)}validateReadOnly(e){(0,o.b)(this.component,"_readOnly",e)}validateRequired(e){(0,o.b)(this.component,"_required",e)}validateValue(e){(0,o.i)(this.component,"_value",e,{hooks:{afterPatch:this.afterSyncCharCounter}}),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateHasCounter(this.component._hasCounter),this.validateMaxLength(this.component._maxLength),this.validatePattern(this.component._pattern),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateValue(this.component._value),this.validateVariant(this.component._variant)}}},7055:(e,t,n)=>{n.d(t,{I:()=>j,K:()=>k,a:()=>y});var o=n(6922),i=n(8788),a=n(665),s=n(4600),l=n(7662),c=n(781),r=n(9060),d=n(8439),u=n(3623),h=n(8973),p=n(5800),m=n(608);const b=(e,t)=>{var{position:n="start",class:i}=e,a=(0,s._)(e,["position","class"]);const l="kol-input-container__adornment",c=`${l}--${n}`;return(0,o.h)("div",Object.assign({class:(0,r.c)(l,c,i)},a),t)};function _(e){return!!e&&(Array.isArray(e)?e.length>0:Boolean(e))}const g=(e,t)=>{var{class:n}=e,i=(0,s._)(e,["class"]);return(0,o.h)("div",Object.assign({class:(0,r.c)("kol-input-container__container",n)},i),t)},v=(e,t)=>{const{class:n,startAdornment:i,endAdornment:a,disabled:l,msg:c,touched:u,containerProps:h,startAdornmentProps:p,endAdornmentProps:m}=e,v=(0,s._)(e,["class","startAdornment","endAdornment","disabled","msg","touched","containerProps","startAdornmentProps","endAdornmentProps"]),f=(0,d.c)(c,u),y={"kol-input-container--disabled":l,[`kol-input-container--${(null==c?void 0:c.type)||"error"}`]:f},k=Object.assign({class:(0,r.c)("kol-input-container",y,n)},v);return _(i)||_(a)?(0,o.h)("div",Object.assign({},k),(0,o.h)(b,Object.assign({},p,{position:"start"}),i),(0,o.h)(g,Object.assign({},h),t),(0,o.h)(b,Object.assign({},m,{position:"end"}),a)):(0,o.h)("div",Object.assign({},k),(0,o.h)(g,Object.assign({},h),t))},f=e=>{const{label:t,icons:n,hideLabel:i,disabled:a,onClick:c}=e,r=(0,s._)(e,["label","icons","hideLabel","disabled","onClick"]);return(0,o.h)(l.a,Object.assign({tabindex:0,_label:t,_disabled:a,_icons:n,_hideLabel:i,_on:{onClick:c}},r))},y=e=>{const{componentName:t="button",label:n,icon:i,onClick:a}=e,l=(0,s._)(e,["componentName","label","icon","onClick"]),r="button"===t?f:c.K;return(0,o.h)(r,Object.assign({label:n||"",hideLabel:!0,icons:`codicon codicon-${i}`,onClick:a},l))},k=({state:e,endAdornment:t},n)=>{const{icons:s,smartButton:l,disabled:c,msg:r,touched:u}=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,d.a)(e._msg),touched:e._touched}}(e);let h=null==s?void 0:s.left;(0,i.i)(h)&&(h={icon:h});let p=null==s?void 0:s.right;(0,i.i)(p)&&(p={icon:p});const m=[],b=[];return t&&(Array.isArray(t)?b.push(...t):b.push(t)),h&&m.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(h)?h:{}))),(0,a.i)(l)&&b.push((0,o.h)(y,Object.assign({componentName:"button"},l,{hideLabel:!0,disabled:c}))),p&&b.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(p)?p:{}))),(0,o.h)(v,{disabled:c,msg:r,touched:u,startAdornment:m,endAdornment:b},n)},C=(e,t)=>{const n=e;"object"==typeof n&&null!==n&&((0,m.i)(n.right,1)&&(n.right={icon:n.right}),(0,m.i)(n.left,1)&&(n.left={icon:n.left}),t.set("_icons",n))};class j extends u.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,m.i)(e.left,1)||(0,h.i)(e.left)||(0,m.i)(e.right,1)||(0,h.i)(e.right))),new Set(["KoliBriHorizontalIcon"]),e,{hooks:{beforePatch:C},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcons(this.component._icons)}}},1166:(e,t,n)=>{n.d(t,{v:()=>i});var o=n(5800);const i=(e,t,n)=>{(0,o.b)(e,"_hasCounter",t,n)}},8973:(e,t,n)=>{n.d(t,{i:()=>s,v:()=>l});var o=n(5800),i=n(608);const a=(e,t,n)=>{(0,i.b)(n)?e[t]=n:(0,i.i)(n,1)&&(e[t]={icon:n})},s=e=>"object"==typeof e&&null!==e&&(void 0===e.style||(0,i.a)(e.style))&&(void 0===e.label||(0,i.i)(e.label))&&(0,i.i)(e.icon,1),l=(e,t,n={})=>{(0,o.o)(t,(()=>{var l;try{t=(0,o.p)(t)}catch(e){}(0,o.w)(e,"_icons",(e=>{const t="object"==typeof e&&null!==e&&0===Object.keys(e).length;return null===e||t||(0,i.i)(e,1)||"object"==typeof e&&null!==e&&((0,i.i)(e.left,1)||s(e.left)||(0,i.i)(e.right,1)||s(e.right)||(0,i.i)(e.top,1)||s(e.top)||(0,i.i)(e.bottom,1)||s(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,o,s)=>{var l,c;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.beforePatch)&&(null===(c=n.hooks)||void 0===c||c.beforePatch(e,t,o,s)),(e=>{var t,n,o;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===(o=e.nextState)||void 0===o||o.set("_icons",(e=>{let t={};return(0,i.i)(e,1)?t={left:{icon:e}}:"object"==typeof e&&null!==e&&(a(t,"top",e.top),a(t,"right",e.right),a(t,"bottom",e.bottom),a(t,"left",e.left)),t})(t))}})(o)}}}))}))}},665:(e,t,n)=>{function o(e){var t=typeof e;return null!=e&&("object"==t||"function"==t)}n.d(t,{i:()=>o})}}]);

package/dist/{9296.js → 5781.js}

@@ -1,2 +1,2 @@
-/*! For license information please see 9296.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[9296],{5626:(e,t,o)=>{o.d(t,{K:()=>h});var n=o(4600),i=o(6783),s=o(9060),a=o(3584),l=o(7662),r=o(3334);const c=({ariaLabel:e,icon:t})=>(0,i.h)(l.d,{class:"kol-alert__heading-icon",_label:e,_icons:t}),d=({type:e,label:t})=>{switch(e){case"error":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-error"),icon:"codicon codicon-error",label:t});case"info":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-info"),icon:"codicon codicon-info",label:t});case"warning":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-warning"),icon:"codicon codicon-warning",label:t});case"success":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-success"),icon:"codicon codicon-pass",label:t});default:return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-message"),icon:"codicon codicon-comment",label:t})}},h=(e,t)=>{var o,c;const{class:h={},type:u="default",variant:p="msg",label:b,hasCloser:f,alert:m,onAlertTimeout:v,onCloserClick:g,level:y}=e,_=(0,n._)(e,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);m&&((null===(o=navigator.userActivation)||void 0===o?void 0:o.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==v||v()}),1e4));const O=Object.assign({class:(0,s.c)("kol-alert",`kol-alert--${u}`,`kol-alert--${p}`,{"kol-alert--hasCloser":!!f},h),role:m?"alert":void 0},_);return(0,i.h)("div",Object.assign({},O),(0,i.h)("div",{class:"kol-alert__container"},(0,i.h)(d,{label:b,type:u}),(0,i.h)("div",{class:"kol-alert__container-content"},b?(0,i.h)(r.K,{class:"kol-alert__heading",level:y},b):null,"msg"===p&&(0,i.h)("div",{class:"kol-alert__content"},t)),f&&(0,i.h)(l.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,a.t)("kol-close-alert"),_on:{onClick:g},_tooltipAlign:"left"})),"card"===p&&(0,i.h)("div",{class:"kol-alert__content"},t))}},5650:(e,t,o)=>{o.d(t,{K:()=>u,a:()=>d,c:()=>h,v:()=>c});var n=o(5800),i=o(608),s=o(4600),a=o(9060),l=o(6783),r=o(5626);const c=(e,t)=>{(0,n.o)(t,(()=>{try{t=(0,n.p)(t)}catch(e){}(0,n.w)(e,"_msg",(e=>(0,i.b)(e)&&"string"==typeof(null==e?void 0:e._description)),new Set(["MsgPropType"]),t,{defaultValue:{_description:"",_type:"error"}})}))};function d(e){var t;if(e&&!function(e){return!e||"error"===e._type&&!e._description}(e))return t=e,Object.entries(t).reduce(((e,[t,o])=>{const n=t.startsWith("_")?t.slice(1):t;return Object.assign(Object.assign({},e),{[n]:o})}),{})}function h(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))}const u=e=>{var{alert:t,msg:o,hideMsg:n,id:i,class:c}=e,d=(0,s._)(e,["alert","msg","hideMsg","id","class"]);return(0,l.h)(r.K,Object.assign({id:`${i}-msg`,alert:t,type:"error",class:(0,a.c)("kol-form-field__msg",{"visually-hidden":!0===n},c)},o,d,{"aria-hidden":"true"}),(null==o?void 0:o.description)||void 0)}},3334:(e,t,o)=>{o.d(t,{K:()=>d});var n=o(4600),i=o(6783),s=o(9060);const a=1;function l(e){return function(e){return e>=a&&e<=6}(e)?`h${e}`:"strong"}const r=(e,t)=>{var{class:o,level:r=a,variant:c}=e,d=(0,n._)(e,["class","level","variant"]);const h=l(r),u=c||h;return(0,i.h)(h,Object.assign({class:(0,s.c)("kol-headline",`kol-headline--${u}`,o)},d),t)},c=(e,t)=>{var{class:o,level:r=a}=e,c=(0,n._)(e,["class","level"]);const d=function(e){return 1===e?"span":l(e)}(r+1);return(0,i.h)(d,Object.assign({class:(0,s.c)("kol-headline kol-headline--group kol-headline--secondary",o)},c),t)},d=(e,t)=>{var{secondaryHeadline:o,level:l=a,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=e,p=(0,n._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:l},p);if(!o)return(0,i.h)(r,Object.assign({class:(0,s.c)(d,"kol-headline--single")},b),t);const{class:f}=h,m=(0,n._)(h,["class"]),v=Object.assign({class:(0,s.c)("kol-heading-group",f)},m);return(0,i.h)("hgroup",Object.assign({},v),(0,i.h)(r,Object.assign({class:(0,s.c)(d,"kol-headline--group","kol-headline--primary")},b),t),(0,i.h)(c,Object.assign({level:l},u),o))}},2587:(e,t,o)=>{o.d(t,{I:()=>g,i:()=>v});var n=o(6783);const i="object"==typeof o.g&&o.g&&o.g.Object===Object&&o.g;var s="object"==typeof self&&self&&self.Object===Object&&self;const a=(i||s||Function("return this")()).Symbol;var l=Object.prototype,r=l.hasOwnProperty,c=l.toString,d=a?a.toStringTag:void 0,h=Object.prototype.toString,u="[object Null]",p="[object Undefined]",b=a?a.toStringTag:void 0;const f=Array.isArray;var m="[object String]";function v(e){return"string"==typeof e||!f(e)&&function(e){return null!=e&&"object"==typeof e}(e)&&function(e){return null==e?void 0===e?p:u:b&&b in Object(e)?function(e){var t=r.call(e,d),o=e[d];try{e[d]=void 0;var n=!0}catch(e){}var i=c.call(e);return n&&(t?e[d]=o:delete e[d]),i}(e):function(e){return h.call(e)}(e)}(e)==m}const g=({badgeText:e,label:t})=>{const o=e;let[i,...s]=t.split(o);return 0===s.length&&(e=o.toUpperCase(),[i,...s]=t.split(o)),0===s.length&&(e=o.toLowerCase(),[i,...s]=t.split(o)),(0,n.h)(n.F,null,i,s.length?(0,n.h)(n.F,null,(0,n.h)("u",null,e),s.join(o)):null)}},9543:(e,t,o)=>{o.d(t,{a:()=>r,b:()=>l,c:()=>a,v:()=>i});var n=o(5800);const i=(e,t)=>{(0,n.i)(e,"_accessKey",t)},s={hooks:{afterPatch:e=>{-1!==e&&0!==e&&(0,n.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},a=(e,t)=>{(0,n.k)(e,"_tabIndex",t,s)},l=(e,t)=>{(0,n.i)(e,"_shortKey",t)},r=(e,t)=>{if(e&&t)throw new Error("AccessKey and ShortKey are used. Only one is allowed.")}},9246:(e,t,o)=>{o.d(t,{a:()=>i,v:()=>a});var n=o(5800);const i=(e,t,o)=>{(0,n.w)(e,t,(e=>"string"==typeof e&&s.includes(e)),new Set(s),o,{defaultValue:"top"})},s=["left","right","top","bottom"],a=(e,t)=>{i(e,"_align",t)}},6970:(e,t,o)=>{o.d(t,{A:()=>s});var n=o(1732),i=o(5800);class s{constructor(e,t,o){var s,a,l,r;if(this.experimentalMode=(0,n.a)(),this.setFormAssociatedValue=e=>{var t;const o=null===(t=this.formAssociated)||void 0===t?void 0:t.getAttribute("name");null!==o&&""!==o||(0,i.j)(` The form field (${this.type}) must have a name attribute to be form-associated. Please define the _name attribute.`);const n=this.tryToStringifyValue(e);this.syncValue(e,n,this.formAssociated),this.syncValue(e,n,this.syncToOwnInput)},this.component=e,this.host=this.findHostWithShadowRoot(o),this.type=t,this.experimentalMode&&("KOL-BUTTON"===(r=null===(s=this.host)||void 0===s?void 0:s.tagName)||"KOL-COMBOBOX"===r||"KOL-INPUT-CHECKBOX"===r||"KOL-INPUT-COLOR"===r||"KOL-INPUT-DATE"===r||"KOL-INPUT-EMAIL"===r||"KOL-INPUT-FILE"===r||"KOL-INPUT-NUMBER"===r||"KOL-INPUT-PASSWORD"===r||"KOL-INPUT-RADIO"===r||"KOL-INPUT-RANGE"===r||"KOL-INPUT-TEXT"===r||"KOL-SELECT"===r||"KOL-SINGLE-SELECT"===r||"KOL-TEXTAREA"===r)&&e._name){switch(null===(a=this.host)||void 0===a||a.querySelectorAll("input,select,textarea").forEach((e=>{var t;null===(t=this.host)||void 0===t||t.removeChild(e)})),this.type){case"button":case"color":case"date":case"email":case"file":case"number":case"password":case"radio":case"range":case"text":this.formAssociated=document.createElement("input"),this.formAssociated.setAttribute("type",this.type);break;case"select":this.formAssociated=document.createElement("select"),this.formAssociated.setAttribute("multiple","");break;case"textarea":this.formAssociated=document.createElement("textarea");break;default:this.formAssociated=document.createElement("input"),this.formAssociated.setAttribute("type","hidden")}this.formAssociated.setAttribute("data-form-associated",""),this.formAssociated.setAttribute("hidden",""),null===(l=this.host)||void 0===l||l.appendChild(this.formAssociated)}}findHostWithShadowRoot(e){for(;null===(null==e?void 0:e.shadowRoot)&&e!==document.body;)(e=null==e?void 0:e.parentNode).host&&(e=e.host);return e}setAttribute(e,t,o){if(this.experimentalMode)try{if("boolean"!=typeof(o="object"==typeof o&&null!==o?JSON.stringify(o):o)&&"number"!=typeof o&&"string"!=typeof o)throw new Error("Invalid value type: "+typeof o);null==t||t.setAttribute(e,`${o}`)}catch(o){null==t||t.removeAttribute(e)}}tryToStringifyValue(e){try{return"object"==typeof e&&null!==e?JSON.stringify(e).toString():null==e?null:e.toString()}catch(e){return(0,i.l)(`The form field raw value is not able to stringify! ${e}`),""}}syncValue(e,t,o){if(o)switch(this.type){case"file":o.files=e;break;case"select":o.querySelectorAll("option").forEach((e=>{o.removeChild(e)})),Array.isArray(e)&&e.forEach((e=>{const t=this.tryToStringifyValue(e);if("string"==typeof t){const e=document.createElement("option");e.setAttribute("value",t),e.setAttribute("selected",""),o.appendChild(e)}}));break;case"radio":"string"==typeof t&&(o.setAttribute("value",t),o.setAttribute("checked",""),o.value=t);break;default:"string"==typeof t?(o.setAttribute("value",t),o.value=t):(o.removeAttribute("value"),o.value="")}}validateName(e){((e,t,o)=>{(0,i.i)(e,"_name",t,o)})(this.component,e,{hooks:{afterPatch:()=>{this.setAttribute("name",this.formAssociated,this.component.state._name)}}}),void 0===e&&(0,i.j)("A name on input fields or switches is not strictly required, but it might be relevant for the autocomplete function and for the static submission of the input field.")}validateSyncValueBySelector(e){if(this.experimentalMode&&"string"==typeof e){const t=document.querySelector(e);t&&(this.syncToOwnInput=t)}}componentWillLoad(){this.validateName(this.component._name),this.validateSyncValueBySelector(this.component._syncValueBySelector)}}},9060:(e,t,o)=>{function n(e){var t,o,i="";if("string"==typeof e||"number"==typeof e)i+=e;else if("object"==typeof e)if(Array.isArray(e)){var s=e.length;for(t=0;t<s;t++)e[t]&&(o=n(e[t]))&&(i&&(i+=" "),i+=o)}else for(o in e)e[o]&&(i&&(i+=" "),i+=o);return i}function i(){for(var e,t,o=0,i="",s=arguments.length;o<s;o++)(e=arguments[o])&&(t=n(e))&&(i&&(i+=" "),i+=t);return i}o.d(t,{c:()=>i})},608:(e,t,o)=>{o.d(t,{S:()=>a,a:()=>s,b:()=>n,i:()=>i});const n=e=>"object"==typeof e&&null!==e,i=(e,t=0)=>"string"==typeof e&&e.length>=t,s=e=>{if("object"!=typeof e||null===e)return i(e,1);for(const t in e)if(!1===i(t,1))return!1;return!0},a=new Event("StateChange")},7336:(e,t,o)=>{o.d(t,{i:()=>l,n:()=>c,r:()=>r});var n=o(6783),i=o(5687),s=o(1732);const a=()=>{let e=(0,s.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,s.d)(),"KoliBri",{value:e,writable:!1})),e},l=()=>{(()=>{const e=(0,s.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const t=e.getAttribute("content");"string"==typeof t&&((0,s.s)(t.includes("dev-mode=true")),(0,s.b)(t.includes("experimental-mode=true")),(0,s.c)(t.includes("color-contrast-analysis=true")))}})(),s.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${n.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==a().adviceShown&&(Object.defineProperty(a(),"adviceShown",{get:function(){return!0}}),s.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===i.p&&(c=()=>"nonce")},8625:(e,t,o)=>{o.d(t,{I:()=>T,K:()=>C,a:()=>k,b:()=>y,c:()=>_,d:()=>K,g:()=>P});var n=o(8231),i=o(6970),s=o(5800),a=o(9543),l=o(356),r=o(6985),c=o(5650),d=o(1074),h=o(4600),u=o(6783),p=o(9060),b=o(3584),f=o(7662),m=o(2587),v=o(5687);const g=({hasExpertSlot:e,accessKey:t,shortKey:o,label:n,showBadge:i=!0})=>{if(e)return(0,u.h)("slot",{name:"expert"});if(!n)return null;const s=(0,m.i)(t)||(0,m.i)(o);if(!i||!s)return(0,u.h)("span",null,n);const a=(0,v.b)(t,o);return(0,u.h)(u.F,null,(0,u.h)(m.I,{badgeText:a,label:n})," ",(0,u.h)("span",{class:"access-key-hint","aria-hidden":"true"},a))},y=e=>{var{component:t="label",id:o,baseClassName:n="kol-form-field",class:i,accessKey:s,shortKey:a,label:l,hideLabel:r,hasExpertSlot:c,showBadge:d}=e,b=(0,h._)(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge"]);const f=!c&&r;return(0,u.h)(t,Object.assign({},b,{class:(0,p.c)(`${n}__label`,i),id:f?void 0:`${o}-label`,hidden:f,htmlFor:o}),(0,u.h)("span",{class:(0,p.c)(`${n}__label-text`)},(0,u.h)(g,{hasExpertSlot:c,accessKey:s,shortKey:a,label:l,showBadge:d})))},_=e=>{var{id:t,class:o,hint:n,baseClassName:i="kol-form-field"}=e,s=(0,h._)(e,["id","class","hint","baseClassName"]);return n?(0,u.h)("span",Object.assign({class:(0,p.c)(`${i}__hint`,o),id:`${t}-hint`},s),n):null},O=e=>{var{currentLength:t,maxLength:o,class:n}=e,i=(0,h._)(e,["currentLength","maxLength","class"]);return(0,u.h)("span",Object.assign({class:(0,p.c)("kol-form-field__counter",n)},i,{"aria-atomic":"true","aria-live":"polite","data-testid":"input-counter"}),t,o&&(0,u.h)(u.F,null,(0,u.h)("span",{"aria-label":(0,b.t)("kol-of"),role:"img"},"/"),o)," ",(0,u.h)("span",null,(0,b.t)("kol-characters")))},k=({id:e,align:t,badgeText:o,hideLabel:n,label:i,class:s})=>(0,u.h)(f.g,{"aria-hidden":"true",class:(0,p.c)("kol-form-field__tooltip",s),_badgeText:o,_align:t,_id:n?`${e}-label`:void 0,_label:i});function L(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 A=(e,t)=>{var{class:o}=e,n=(0,h._)(e,["class"]);return(0,u.h)("div",Object.assign({class:(0,p.c)("kol-form-field__input",o)},n),t)},j=(e,t)=>{const{component:o="div",renderNoLabel:n,renderNoTooltip:i,renderNoHint:s,anotherChildren:a,id:l,required:r,alert:d,disabled:b,class:f,msg:m,hideMsg:g,hideLabel:j,label:K,hint:S,accessKey:T,shortKey:C,tooltipAlign:P,counter:w,readOnly:E,touched:x,formFieldLabelProps:I,formFieldHintProps:B,formFieldTooltipProps:N,formFieldMsgProps:M,formFieldCounterProps:F,formFieldInputProps:H}=e,$=(0,h._)(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideMsg","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldCounterProps","formFieldInputProps"]),q=!n,U=!s,V=!i,D=(0,v.s)(K),R=(0,c.c)(m,x),W=(0,v.b)(T,C),G=V&&!D&&j;let X={"kol-form-field--disabled":Boolean(b),"kol-form-field--required":Boolean(r),"kol-form-field--touched":Boolean(x),"kol-form-field--hide-label":Boolean(j),"kol-form-field--read-only":Boolean(E),"kol-form-field--hidden-msg":Boolean(g)};return R&&(X=Object.assign(Object.assign({},X),{[`kol-form-field--${(null==m?void 0:m.type)||"error"}`]:!0,[`kol-form-field--${L(m)}`]:!0})),(0,u.h)(o,Object.assign({class:(0,p.c)("kol-form-field",X,f),role:"presentation"},$),q&&(0,u.h)(y,Object.assign({},I||{},{id:l,hasExpertSlot:D,hideLabel:j,label:K,accessKey:T,shortKey:C})),(0,u.h)(A,Object.assign({},H),t,G&&(0,u.h)(k,Object.assign({},N||{},{id:l,label:K,hideLabel:j,align:P,badgeText:W}))),w?(0,u.h)(O,Object.assign({},F||{},w)):null,R&&(0,u.h)(c.K,Object.assign({},M||{},{id:l,alert:d,msg:m,hideMsg:g})),U&&(0,u.h)(_,Object.assign({},B||{},{id:l,hint:S})),a)};function K({ariaDescribedBy:e,hideLabel:t,label:o}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":t&&o?o:void 0}}class S extends i.A{constructor(e,t,o){super(e,t,o),this.component=e}validateTouched(e){((e,t)=>{(0,s.b)(e,"_touched",t)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class T extends S{constructor(e,t,o){super(e,t,o),this.valueChangeListeners=[],this.onFacade={onBlur:this.onBlur.bind(this),onChange:this.onChange.bind(this),onClick:this.onClick.bind(this),onFocus:this.onFocus.bind(this),onInput:this.onInput.bind(this)},this.component=e}validateAccessKey(e){(0,a.v)(this.component,e),(0,a.a)(e,this.component._shortKey)}validateAdjustHeight(e){((e,t)=>{(0,s.b)(e,"_adjustHeight",t)})(this.component,e)}validateDisabled(e){(0,s.b)(this.component,"_disabled",e),!0===e&&(0,s.c)()}validateTooltipAlign(e){(0,l.v)(this.component,e)}validateHideMsg(e){((e,t,o)=>{(0,s.b)(e,"_hideMsg",t,o)})(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideMsg&&(0,s.a)("Property _hideMsg for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(e){(0,r.v)(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&(0,s.a)("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(e){(0,s.i)(this.component,"_hint",e)}validateId(e){(0,s.i)(this.component,"_id",e,{minLength:1}),""!==e&&void 0!==e||(0,s.j)("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(e){(0,d.a)(this.component,e,{required:!0})}validateMsg(e){(0,c.v)(this.component,e)}validateOn(e){"object"==typeof e&&(0,s.s)(this.component,"_on",e)}validateShortKey(e){(0,a.b)(this.component,e),(0,a.a)(this.component._accessKey,e)}validateSmartButton(e){(0,s.o)(e,(()=>{try{e=(0,s.p)(e)}catch(e){}(0,s.s)(this.component,"_smartButton",e)}))}validateTabIndex(e){(0,a.c)(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideMsg(this.component._hideMsg),this.validateHideLabel(this.component._hideLabel),this.validateHint(this.component._hint),this.validateId(this.component._id),this.validateLabel(this.component._label),this.validateShortKey(this.component._shortKey),this.validateSmartButton(this.component._smartButton),this.validateOn(this.component._on),this.validateTabIndex(this.component._tabIndex),(0,a.a)(this.component._accessKey,this.component._shortKey)}emitEvent(e,t){this.host&&(0,n.d)(this.host,e,t)}onBlur(e){var t;this.component._touched=!0,this.emitEvent(n.K.blur),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onBlur)&&this.component._on.onBlur(e)}onChange(e,t){var o;void 0===t&&(t=e.target.value),this.emitEvent(n.K.change,t),"function"==typeof(null===(o=this.component._on)||void 0===o?void 0:o.onChange)&&this.component._on.onChange(e,t),this.valueChangeListeners.forEach((e=>e(t)))}onInput(e,t=!0,o){var i;void 0===o&&(o=e.target.value),this.emitEvent(n.K.input,o),t&&this.setFormAssociatedValue(o),"function"==typeof(null===(i=this.component._on)||void 0===i?void 0:i.onInput)&&this.component._on.onInput(e,o)}onClick(e){var t;this.emitEvent(n.K.click),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onClick)&&this.component._on.onClick(e)}onFocus(e){var t;this.emitEvent(n.K.focus),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onFocus)&&this.component._on.onFocus(e)}addValueChangeListener(e){this.valueChangeListeners.push(e)}}const C=(e,t)=>{var{state:o}=e,n=(0,h._)(e,["state"]);return(0,u.h)(j,Object.assign({},function(e){const t={id:e._id,disabled:e._disabled,msg:(0,c.a)(e._msg),hint:e._hint,label:e._label,hideLabel:e._hideLabel,hideMsg:e._hideMsg,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}(o),n),t)},P=e=>{var t,o,n;const i=Boolean((null===(t=null==e?void 0:e._msg)||void 0===t?void 0:t._description)&&(null===(o=e._msg._description)||void 0===o?void 0:o.length)>0),s="error"===(null===(n=e._msg)||void 0===n?void 0:n._type)&&i&&!0===e._touched,a="string"==typeof e._hint&&e._hint.length>0,l=[];return i&&l.push(`${e._id}-msg`),a&&l.push(`${e._id}-hint`),{hasError:s,hasHint:a,ariaDescribedBy:l}}},6985:(e,t,o)=>{o.d(t,{v:()=>i});var n=o(5800);const i=(e,t,o={})=>{(0,n.b)(e,"_hideLabel",t,o)}},3584:(e,t,o)=>{o.d(t,{t:()=>s});var n=o(8461),i=o(5687);let s=(e,t)=>{var o;return(null!==(o=(0,n.g)())&&void 0!==o?o:(0,n.i)("de")).translate(e,t)};"test"===i.p&&(s=e=>e)},1074:(e,t,o)=>{o.d(t,{a:()=>h,b:()=>l,c:()=>r,h:()=>i,v:()=>d});var n=o(5800);const i=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,a=/^\d+$/;function l(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(s))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return a.test(e)}const c=new Set(["string"]),d=(e,t,o={})=>{(0,n.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,o,i,s)=>{var a,c;"function"==typeof(null===(a=e.hooks)||void 0===a?void 0:a.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,o,i,s)),"string"==typeof t&&!1===l(t,3)&&!1===r(t)&&(0,n.a)(`The heading or label ("${t}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof t&&t.length>80&&(0,n.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(o))},h=d},5687:(e,t,o)=>{o.d(t,{b:()=>a,h:()=>i,p:()=>n,s:()=>s});let n="development";try{n="production"}catch(e){n="production"}const i=(e,t,o)=>{if(e&&t&&"string"==typeof o){const n=e.querySelector(`[slot="${o}"]`);n&&t.appendChild(n)}},s=e=>""===e,a=(e,t)=>e||t||""},356:(e,t,o)=>{o.d(t,{v:()=>i});var n=o(9246);const i=(e,t)=>{(0,n.a)(e,"_tooltipAlign",t)}},4600:(e,t,o)=>{function n(e,t){var o={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(n=Object.getOwnPropertySymbols(e);i<n.length;i++)t.indexOf(n[i])<0&&Object.prototype.propertyIsEnumerable.call(e,n[i])&&(o[n[i]]=e[n[i]])}return o}o.d(t,{_:()=>n}),"function"==typeof SuppressedError&&SuppressedError}}]);
+/*! For license information please see 5781.js.LICENSE.txt */
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5781],{7754:(e,t,o)=>{o.d(t,{K:()=>h});var n=o(4600),i=o(6922),s=o(9060),a=o(3584),l=o(7662),r=o(6576);const c=({ariaLabel:e,icon:t})=>(0,i.h)(l.d,{class:"kol-alert__heading-icon",_label:e,_icons:t}),d=({type:e,label:t})=>{switch(e){case"error":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-error"),icon:"codicon codicon-error",label:t});case"info":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-info"),icon:"codicon codicon-info",label:t});case"warning":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-warning"),icon:"codicon codicon-warning",label:t});case"success":return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-success"),icon:"codicon codicon-pass",label:t});default:return(0,i.h)(c,{ariaLabel:(0,a.t)("kol-message"),icon:"codicon codicon-comment",label:t})}},h=(e,t)=>{var o,c;const{class:h={},type:u="default",variant:p="msg",label:b,hasCloser:f,alert:m,onAlertTimeout:v,onCloserClick:g,level:y}=e,_=(0,n._)(e,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);m&&((null===(o=navigator.userActivation)||void 0===o?void 0:o.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==v||v()}),1e4));const O=Object.assign({class:(0,s.c)("kol-alert",`kol-alert--${u}`,`kol-alert--${p}`,{"kol-alert--hasCloser":!!f},h),role:m?"alert":void 0},_);return(0,i.h)("div",Object.assign({},O),(0,i.h)("div",{class:"kol-alert__container"},(0,i.h)(d,{label:b,type:u}),(0,i.h)("div",{class:"kol-alert__container-content"},b?(0,i.h)(r.K,{class:"kol-alert__heading",level:y},b):null,"msg"===p&&(0,i.h)("div",{class:"kol-alert__content"},t)),f&&(0,i.h)(l.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,a.t)("kol-close-alert"),_on:{onClick:g},_tooltipAlign:"left"})),"card"===p&&(0,i.h)("div",{class:"kol-alert__content"},t))}},8439:(e,t,o)=>{o.d(t,{K:()=>u,a:()=>d,c:()=>h,v:()=>c});var n=o(5800),i=o(608),s=o(4600),a=o(9060),l=o(6922),r=o(7754);const c=(e,t)=>{(0,n.o)(t,(()=>{try{t=(0,n.p)(t)}catch(e){}(0,n.w)(e,"_msg",(e=>(0,i.b)(e)&&"string"==typeof(null==e?void 0:e._description)),new Set(["MsgPropType"]),t,{defaultValue:{_description:"",_type:"error"}})}))};function d(e){var t;if(e&&!function(e){return!e||"error"===e._type&&!e._description}(e))return t=e,Object.entries(t).reduce(((e,[t,o])=>{const n=t.startsWith("_")?t.slice(1):t;return Object.assign(Object.assign({},e),{[n]:o})}),{})}function h(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))}const u=e=>{var{alert:t,msg:o,hideMsg:n,id:i,class:c}=e,d=(0,s._)(e,["alert","msg","hideMsg","id","class"]);return(0,l.h)(r.K,Object.assign({id:`${i}-msg`,alert:t,type:"error",class:(0,a.c)("kol-form-field__msg",{"visually-hidden":!0===n},c)},o,d,{"aria-hidden":"true"}),(null==o?void 0:o.description)||void 0)}},6576:(e,t,o)=>{o.d(t,{K:()=>d});var n=o(4600),i=o(6922),s=o(9060);const a=1;function l(e){return function(e){return e>=a&&e<=6}(e)?`h${e}`:"strong"}const r=(e,t)=>{var{class:o,level:r=a,variant:c}=e,d=(0,n._)(e,["class","level","variant"]);const h=l(r),u=c||h;return(0,i.h)(h,Object.assign({class:(0,s.c)("kol-headline",`kol-headline--${u}`,o)},d),t)},c=(e,t)=>{var{class:o,level:r=a}=e,c=(0,n._)(e,["class","level"]);const d=function(e){return 1===e?"span":l(e)}(r+1);return(0,i.h)(d,Object.assign({class:(0,s.c)("kol-headline kol-headline--group kol-headline--secondary",o)},c),t)},d=(e,t)=>{var{secondaryHeadline:o,level:l=a,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=e,p=(0,n._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:l},p);if(!o)return(0,i.h)(r,Object.assign({class:(0,s.c)(d,"kol-headline--single")},b),t);const{class:f}=h,m=(0,n._)(h,["class"]),v=Object.assign({class:(0,s.c)("kol-heading-group",f)},m);return(0,i.h)("hgroup",Object.assign({},v),(0,i.h)(r,Object.assign({class:(0,s.c)(d,"kol-headline--group","kol-headline--primary")},b),t),(0,i.h)(c,Object.assign({level:l},u),o))}},8788:(e,t,o)=>{o.d(t,{I:()=>g,i:()=>v});var n=o(6922);const i="object"==typeof o.g&&o.g&&o.g.Object===Object&&o.g;var s="object"==typeof self&&self&&self.Object===Object&&self;const a=(i||s||Function("return this")()).Symbol;var l=Object.prototype,r=l.hasOwnProperty,c=l.toString,d=a?a.toStringTag:void 0,h=Object.prototype.toString,u="[object Null]",p="[object Undefined]",b=a?a.toStringTag:void 0;const f=Array.isArray;var m="[object String]";function v(e){return"string"==typeof e||!f(e)&&function(e){return null!=e&&"object"==typeof e}(e)&&function(e){return null==e?void 0===e?p:u:b&&b in Object(e)?function(e){var t=r.call(e,d),o=e[d];try{e[d]=void 0;var n=!0}catch(e){}var i=c.call(e);return n&&(t?e[d]=o:delete e[d]),i}(e):function(e){return h.call(e)}(e)}(e)==m}const g=({badgeText:e,label:t})=>{const o=e;let[i,...s]=t.split(o);return 0===s.length&&(e=o.toUpperCase(),[i,...s]=t.split(o)),0===s.length&&(e=o.toLowerCase(),[i,...s]=t.split(o)),(0,n.h)(n.F,null,i,s.length?(0,n.h)(n.F,null,(0,n.h)("u",null,e),s.join(o)):null)}},9543:(e,t,o)=>{o.d(t,{a:()=>r,b:()=>l,c:()=>a,v:()=>i});var n=o(5800);const i=(e,t)=>{(0,n.i)(e,"_accessKey",t)},s={hooks:{afterPatch:e=>{-1!==e&&0!==e&&(0,n.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},a=(e,t)=>{(0,n.k)(e,"_tabIndex",t,s)},l=(e,t)=>{(0,n.i)(e,"_shortKey",t)},r=(e,t)=>{if(e&&t)throw new Error("AccessKey and ShortKey are used. Only one is allowed.")}},9246:(e,t,o)=>{o.d(t,{a:()=>i,v:()=>a});var n=o(5800);const i=(e,t,o)=>{(0,n.w)(e,t,(e=>"string"==typeof e&&s.includes(e)),new Set(s),o,{defaultValue:"top"})},s=["left","right","top","bottom"],a=(e,t)=>{i(e,"_align",t)}},6970:(e,t,o)=>{o.d(t,{A:()=>s});var n=o(1732),i=o(5800);class s{constructor(e,t,o){var s,a,l,r;if(this.experimentalMode=(0,n.a)(),this.setFormAssociatedValue=e=>{var t;const o=null===(t=this.formAssociated)||void 0===t?void 0:t.getAttribute("name");null!==o&&""!==o||(0,i.j)(` The form field (${this.type}) must have a name attribute to be form-associated. Please define the _name attribute.`);const n=this.tryToStringifyValue(e);this.syncValue(e,n,this.formAssociated),this.syncValue(e,n,this.syncToOwnInput)},this.component=e,this.host=this.findHostWithShadowRoot(o),this.type=t,this.experimentalMode&&("KOL-BUTTON"===(r=null===(s=this.host)||void 0===s?void 0:s.tagName)||"KOL-COMBOBOX"===r||"KOL-INPUT-CHECKBOX"===r||"KOL-INPUT-COLOR"===r||"KOL-INPUT-DATE"===r||"KOL-INPUT-EMAIL"===r||"KOL-INPUT-FILE"===r||"KOL-INPUT-NUMBER"===r||"KOL-INPUT-PASSWORD"===r||"KOL-INPUT-RADIO"===r||"KOL-INPUT-RANGE"===r||"KOL-INPUT-TEXT"===r||"KOL-SELECT"===r||"KOL-SINGLE-SELECT"===r||"KOL-TEXTAREA"===r)&&e._name){switch(null===(a=this.host)||void 0===a||a.querySelectorAll("input,select,textarea").forEach((e=>{var t;null===(t=this.host)||void 0===t||t.removeChild(e)})),this.type){case"button":case"color":case"date":case"email":case"file":case"number":case"password":case"radio":case"range":case"text":this.formAssociated=document.createElement("input"),this.formAssociated.setAttribute("type",this.type);break;case"select":this.formAssociated=document.createElement("select"),this.formAssociated.setAttribute("multiple","");break;case"textarea":this.formAssociated=document.createElement("textarea");break;default:this.formAssociated=document.createElement("input"),this.formAssociated.setAttribute("type","hidden")}this.formAssociated.setAttribute("data-form-associated",""),this.formAssociated.setAttribute("hidden",""),null===(l=this.host)||void 0===l||l.appendChild(this.formAssociated)}}findHostWithShadowRoot(e){for(;null===(null==e?void 0:e.shadowRoot)&&e!==document.body;)(e=null==e?void 0:e.parentNode).host&&(e=e.host);return e}setAttribute(e,t,o){if(this.experimentalMode)try{if("boolean"!=typeof(o="object"==typeof o&&null!==o?JSON.stringify(o):o)&&"number"!=typeof o&&"string"!=typeof o)throw new Error("Invalid value type: "+typeof o);null==t||t.setAttribute(e,`${o}`)}catch(o){null==t||t.removeAttribute(e)}}tryToStringifyValue(e){try{return"object"==typeof e&&null!==e?JSON.stringify(e).toString():null==e?null:e.toString()}catch(e){return(0,i.l)(`The form field raw value is not able to stringify! ${e}`),""}}syncValue(e,t,o){if(o)switch(this.type){case"file":o.files=e;break;case"select":o.querySelectorAll("option").forEach((e=>{o.removeChild(e)})),Array.isArray(e)&&e.forEach((e=>{const t=this.tryToStringifyValue(e);if("string"==typeof t){const e=document.createElement("option");e.setAttribute("value",t),e.setAttribute("selected",""),o.appendChild(e)}}));break;case"radio":"string"==typeof t&&(o.setAttribute("value",t),o.setAttribute("checked",""),o.value=t);break;default:"string"==typeof t?(o.setAttribute("value",t),o.value=t):(o.removeAttribute("value"),o.value="")}}validateName(e){((e,t,o)=>{(0,i.i)(e,"_name",t,o)})(this.component,e,{hooks:{afterPatch:()=>{this.setAttribute("name",this.formAssociated,this.component.state._name)}}}),void 0===e&&(0,i.j)("A name on input fields or switches is not strictly required, but it might be relevant for the autocomplete function and for the static submission of the input field.")}validateSyncValueBySelector(e){if(this.experimentalMode&&"string"==typeof e){const t=document.querySelector(e);t&&(this.syncToOwnInput=t)}}componentWillLoad(){this.validateName(this.component._name),this.validateSyncValueBySelector(this.component._syncValueBySelector)}}},9060:(e,t,o)=>{function n(e){var t,o,i="";if("string"==typeof e||"number"==typeof e)i+=e;else if("object"==typeof e)if(Array.isArray(e)){var s=e.length;for(t=0;t<s;t++)e[t]&&(o=n(e[t]))&&(i&&(i+=" "),i+=o)}else for(o in e)e[o]&&(i&&(i+=" "),i+=o);return i}function i(){for(var e,t,o=0,i="",s=arguments.length;o<s;o++)(e=arguments[o])&&(t=n(e))&&(i&&(i+=" "),i+=t);return i}o.d(t,{c:()=>i})},608:(e,t,o)=>{o.d(t,{S:()=>a,a:()=>s,b:()=>n,i:()=>i});const n=e=>"object"==typeof e&&null!==e,i=(e,t=0)=>"string"==typeof e&&e.length>=t,s=e=>{if("object"!=typeof e||null===e)return i(e,1);for(const t in e)if(!1===i(t,1))return!1;return!0},a=new Event("StateChange")},4215:(e,t,o)=>{o.d(t,{i:()=>l,n:()=>c,r:()=>r});var n=o(6922),i=o(5687),s=o(1732);const a=()=>{let e=(0,s.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,s.d)(),"KoliBri",{value:e,writable:!1})),e},l=()=>{(()=>{const e=(0,s.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const t=e.getAttribute("content");"string"==typeof t&&((0,s.s)(t.includes("dev-mode=true")),(0,s.b)(t.includes("experimental-mode=true")),(0,s.c)(t.includes("color-contrast-analysis=true")))}})(),s.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${n.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==a().adviceShown&&(Object.defineProperty(a(),"adviceShown",{get:function(){return!0}}),s.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===i.p&&(c=()=>"nonce")},3623:(e,t,o)=>{o.d(t,{I:()=>T,K:()=>C,a:()=>k,b:()=>y,c:()=>_,d:()=>K,g:()=>P});var n=o(8231),i=o(6970),s=o(5800),a=o(9543),l=o(356),r=o(6985),c=o(8439),d=o(1074),h=o(4600),u=o(6922),p=o(9060),b=o(3584),f=o(7662),m=o(8788),v=o(5687);const g=({hasExpertSlot:e,accessKey:t,shortKey:o,label:n,showBadge:i=!0})=>{if(e)return(0,u.h)("slot",{name:"expert"});if(!n)return null;const s=(0,m.i)(t)||(0,m.i)(o);if(!i||!s)return(0,u.h)("span",null,n);const a=(0,v.b)(t,o);return(0,u.h)(u.F,null,(0,u.h)(m.I,{badgeText:a,label:n})," ",(0,u.h)("span",{class:"access-key-hint","aria-hidden":"true"},a))},y=e=>{var{component:t="label",id:o,baseClassName:n="kol-form-field",class:i,accessKey:s,shortKey:a,label:l,hideLabel:r,hasExpertSlot:c,showBadge:d}=e,b=(0,h._)(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge"]);const f=!c&&r;return(0,u.h)(t,Object.assign({},b,{class:(0,p.c)(`${n}__label`,i),id:f?void 0:`${o}-label`,hidden:f,htmlFor:o}),(0,u.h)("span",{class:(0,p.c)(`${n}__label-text`)},(0,u.h)(g,{hasExpertSlot:c,accessKey:s,shortKey:a,label:l,showBadge:d})))},_=e=>{var{id:t,class:o,hint:n,baseClassName:i="kol-form-field"}=e,s=(0,h._)(e,["id","class","hint","baseClassName"]);return n?(0,u.h)("span",Object.assign({class:(0,p.c)(`${i}__hint`,o),id:`${t}-hint`},s),n):null},O=e=>{var{currentLength:t,maxLength:o,class:n}=e,i=(0,h._)(e,["currentLength","maxLength","class"]);return(0,u.h)("span",Object.assign({class:(0,p.c)("kol-form-field__counter",n)},i,{"aria-atomic":"true","aria-live":"polite","data-testid":"input-counter"}),t,o&&(0,u.h)(u.F,null,(0,u.h)("span",{"aria-label":(0,b.t)("kol-of"),role:"img"},"/"),o)," ",(0,u.h)("span",null,(0,b.t)("kol-characters")))},k=({id:e,align:t,badgeText:o,hideLabel:n,label:i,class:s})=>(0,u.h)(f.g,{"aria-hidden":"true",class:(0,p.c)("kol-form-field__tooltip",s),_badgeText:o,_align:t,_id:n?`${e}-label`:void 0,_label:i});function L(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 A=(e,t)=>{var{class:o}=e,n=(0,h._)(e,["class"]);return(0,u.h)("div",Object.assign({class:(0,p.c)("kol-form-field__input",o)},n),t)},j=(e,t)=>{const{component:o="div",renderNoLabel:n,renderNoTooltip:i,renderNoHint:s,anotherChildren:a,id:l,required:r,alert:d,disabled:b,class:f,msg:m,hideMsg:g,hideLabel:j,label:K,hint:S,accessKey:T,shortKey:C,tooltipAlign:P,counter:w,readOnly:E,touched:x,formFieldLabelProps:I,formFieldHintProps:B,formFieldTooltipProps:N,formFieldMsgProps:M,formFieldCounterProps:F,formFieldInputProps:H}=e,$=(0,h._)(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideMsg","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldCounterProps","formFieldInputProps"]),q=!n,U=!s,V=!i,D=(0,v.s)(K),R=(0,c.c)(m,x),W=(0,v.b)(T,C),G=V&&!D&&j;let X={"kol-form-field--disabled":Boolean(b),"kol-form-field--required":Boolean(r),"kol-form-field--touched":Boolean(x),"kol-form-field--hide-label":Boolean(j),"kol-form-field--read-only":Boolean(E),"kol-form-field--hidden-msg":Boolean(g)};return R&&(X=Object.assign(Object.assign({},X),{[`kol-form-field--${(null==m?void 0:m.type)||"error"}`]:!0,[`kol-form-field--${L(m)}`]:!0})),(0,u.h)(o,Object.assign({class:(0,p.c)("kol-form-field",X,f),role:"presentation"},$),q&&(0,u.h)(y,Object.assign({},I||{},{id:l,hasExpertSlot:D,hideLabel:j,label:K,accessKey:T,shortKey:C})),(0,u.h)(A,Object.assign({},H),t,G&&(0,u.h)(k,Object.assign({},N||{},{id:l,label:K,hideLabel:j,align:P,badgeText:W}))),w?(0,u.h)(O,Object.assign({},F||{},w)):null,R&&(0,u.h)(c.K,Object.assign({},M||{},{id:l,alert:d,msg:m,hideMsg:g})),U&&(0,u.h)(_,Object.assign({},B||{},{id:l,hint:S})),a)};function K({ariaDescribedBy:e,hideLabel:t,label:o}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":t&&o?o:void 0}}class S extends i.A{constructor(e,t,o){super(e,t,o),this.component=e}validateTouched(e){((e,t)=>{(0,s.b)(e,"_touched",t)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class T extends S{constructor(e,t,o){super(e,t,o),this.valueChangeListeners=[],this.onFacade={onBlur:this.onBlur.bind(this),onChange:this.onChange.bind(this),onClick:this.onClick.bind(this),onFocus:this.onFocus.bind(this),onInput:this.onInput.bind(this)},this.component=e}validateAccessKey(e){(0,a.v)(this.component,e),(0,a.a)(e,this.component._shortKey)}validateAdjustHeight(e){((e,t)=>{(0,s.b)(e,"_adjustHeight",t)})(this.component,e)}validateDisabled(e){(0,s.b)(this.component,"_disabled",e),!0===e&&(0,s.c)()}validateTooltipAlign(e){(0,l.v)(this.component,e)}validateHideMsg(e){((e,t,o)=>{(0,s.b)(e,"_hideMsg",t,o)})(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideMsg&&(0,s.a)("Property _hideMsg for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(e){(0,r.v)(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&(0,s.a)("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(e){(0,s.i)(this.component,"_hint",e)}validateId(e){(0,s.i)(this.component,"_id",e,{minLength:1}),""!==e&&void 0!==e||(0,s.j)("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(e){(0,d.a)(this.component,e,{required:!0})}validateMsg(e){(0,c.v)(this.component,e)}validateOn(e){"object"==typeof e&&(0,s.s)(this.component,"_on",e)}validateShortKey(e){(0,a.b)(this.component,e),(0,a.a)(this.component._accessKey,e)}validateSmartButton(e){(0,s.o)(e,(()=>{try{e=(0,s.p)(e)}catch(e){}(0,s.s)(this.component,"_smartButton",e)}))}validateTabIndex(e){(0,a.c)(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideMsg(this.component._hideMsg),this.validateHideLabel(this.component._hideLabel),this.validateHint(this.component._hint),this.validateId(this.component._id),this.validateLabel(this.component._label),this.validateShortKey(this.component._shortKey),this.validateSmartButton(this.component._smartButton),this.validateOn(this.component._on),this.validateTabIndex(this.component._tabIndex),(0,a.a)(this.component._accessKey,this.component._shortKey)}emitEvent(e,t){this.host&&(0,n.d)(this.host,e,t)}onBlur(e){var t;this.component._touched=!0,this.emitEvent(n.K.blur),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onBlur)&&this.component._on.onBlur(e)}onChange(e,t){var o;void 0===t&&(t=e.target.value),this.emitEvent(n.K.change,t),"function"==typeof(null===(o=this.component._on)||void 0===o?void 0:o.onChange)&&this.component._on.onChange(e,t),this.valueChangeListeners.forEach((e=>e(t)))}onInput(e,t=!0,o){var i;void 0===o&&(o=e.target.value),this.emitEvent(n.K.input,o),t&&this.setFormAssociatedValue(o),"function"==typeof(null===(i=this.component._on)||void 0===i?void 0:i.onInput)&&this.component._on.onInput(e,o)}onClick(e){var t;this.emitEvent(n.K.click),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onClick)&&this.component._on.onClick(e)}onFocus(e){var t;this.emitEvent(n.K.focus),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onFocus)&&this.component._on.onFocus(e)}addValueChangeListener(e){this.valueChangeListeners.push(e)}}const C=(e,t)=>{var{state:o}=e,n=(0,h._)(e,["state"]);return(0,u.h)(j,Object.assign({},function(e){const t={id:e._id,disabled:e._disabled,msg:(0,c.a)(e._msg),hint:e._hint,label:e._label,hideLabel:e._hideLabel,hideMsg:e._hideMsg,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}(o),n),t)},P=e=>{var t,o,n;const i=Boolean((null===(t=null==e?void 0:e._msg)||void 0===t?void 0:t._description)&&(null===(o=e._msg._description)||void 0===o?void 0:o.length)>0),s="error"===(null===(n=e._msg)||void 0===n?void 0:n._type)&&i&&!0===e._touched,a="string"==typeof e._hint&&e._hint.length>0,l=[];return i&&l.push(`${e._id}-msg`),a&&l.push(`${e._id}-hint`),{hasError:s,hasHint:a,ariaDescribedBy:l}}},6985:(e,t,o)=>{o.d(t,{v:()=>i});var n=o(5800);const i=(e,t,o={})=>{(0,n.b)(e,"_hideLabel",t,o)}},3584:(e,t,o)=>{o.d(t,{t:()=>s});var n=o(8461),i=o(5687);let s=(e,t)=>{var o;return(null!==(o=(0,n.g)())&&void 0!==o?o:(0,n.i)("de")).translate(e,t)};"test"===i.p&&(s=e=>e)},1074:(e,t,o)=>{o.d(t,{a:()=>h,b:()=>l,c:()=>r,h:()=>i,v:()=>d});var n=o(5800);const i=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,a=/^\d+$/;function l(e,t=1){return function(e){var t;return"string"==typeof e&&(null===(t=e.match(s))||void 0===t?void 0:t.length)||0}(e)>=t}function r(e){return a.test(e)}const c=new Set(["string"]),d=(e,t,o={})=>{(0,n.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,o,i,s)=>{var a,c;"function"==typeof(null===(a=e.hooks)||void 0===a?void 0:a.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,o,i,s)),"string"==typeof t&&!1===l(t,3)&&!1===r(t)&&(0,n.a)(`The heading or label ("${t}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof t&&t.length>80&&(0,n.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(o))},h=d},5687:(e,t,o)=>{o.d(t,{b:()=>a,h:()=>i,p:()=>n,s:()=>s});let n="development";try{n="production"}catch(e){n="production"}const i=(e,t,o)=>{if(e&&t&&"string"==typeof o){const n=e.querySelector(`[slot="${o}"]`);n&&t.appendChild(n)}},s=e=>""===e,a=(e,t)=>e||t||""},356:(e,t,o)=>{o.d(t,{v:()=>i});var n=o(9246);const i=(e,t)=>{(0,n.a)(e,"_tooltipAlign",t)}},4600:(e,t,o)=>{function n(e,t){var o={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(n=Object.getOwnPropertySymbols(e);i<n.length;i++)t.indexOf(n[i])<0&&Object.prototype.propertyIsEnumerable.call(e,n[i])&&(o[n[i]]=e[n[i]])}return o}o.d(t,{_:()=>n}),"function"==typeof SuppressedError&&SuppressedError}}]);

package/dist/5876.js

@@ -1,2 +1,2 @@
 /*! For license information please see 5876.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5876],{375:(n,e,t)=>{t.d(e,{K:()=>a});var o=t(6783),i=t(7662);const a=n=>{const{class:e,style:t,icons:a,label:l,onClick:s}=n;return(0,o.h)(i.d,{class:e,style:t,onClick:s,_icons:a,_label:l})}},3163:(n,e,t)=>{t.d(e,{K:()=>r});var o=t(4600),i=t(6783),a=t(9060),l=t(8625),s=t(5650);const r=n=>{const{class:e,msg:t,required:r,disabled:d,touched:c,readonly:h,ariaDescribedBy:u,hideLabel:p,label:m,suggestions:b,value:v}=n,_=(0,o._)(n,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),g=(0,s.c)(t,c),f={"kol-input--disabled":Boolean(d),"kol-input--required":Boolean(r),"kol-input--touched":Boolean(c),"kol-input--readonly":Boolean(h),[`kol-input--${(null==t?void 0:t.type)||"error"}`]:g},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",f,e),required:r,disabled:d,readonly:h,type:"text",list:b?`${_.id}-list`:void 0},(0,l.d)({ariaDescribedBy:u,hideLabel:p,label:m})),_);return(0,i.h)(i.F,null,(0,i.h)("input",Object.assign({},y,{value:v})),b)}},7146:(n,e,t)=>{t.d(e,{K:()=>d,a:()=>r});var o=t(4600),i=t(6783),a=t(8625),l=t(3163),s=t(5650);const r=n=>{var{id:e,suggestions:t}=n,a=(0,o._)(n,["id","suggestions"]);return t?(0,i.h)("datalist",Object.assign({id:`${e}-list`},a),t.map((n=>(0,i.h)("option",{value:n})))):null},d=n=>{var{state:e,customSuggestions:t}=n,d=(0,o._)(n,["state","customSuggestions"]);return(0,i.h)(l.K,Object.assign({},function(n,e){const{ariaDescribedBy:t}=(0,a.g)(n),o={id:n._id,hideLabel:n._hideLabel,label:n._label,accessKey:n._accessKey,disabled:n._disabled,name:n._name,ariaDescribedBy:t};return"_type"in n&&(o.type=n._type),"_value"in n&&(o.value=n._value),"_required"in n&&(o.required=n._required),"_maxLength"in n&&(o.maxlength=n._maxLength),"_placeholder"in n&&(o.placeholder=n._placeholder),"_autoComplete"in n&&(o.autoComplete=n._autoComplete),"_spellCheck"in n&&(o.spellcheck=n._spellCheck),"_pattern"in n&&(o.pattern=n._pattern),"_readOnly"in n&&(o.readonly=n._readOnly),"_min"in n&&(o.min=n._min),"_max"in n&&(o.max=n._max),"_step"in n&&(o.step=n._step),"_multiple"in n&&(o.multiple=n._multiple),"_checked"in n&&(o.checked=n._checked),"_indeterminate"in n&&(o.indeterminate=n._indeterminate),"_touched"in n&&(o.touched=n._touched),"_msg"in n&&(o.msg=(0,s.a)(n._msg)),"_suggestions"in n&&!e&&Array.isArray(n._suggestions)&&n._suggestions.length>0&&(o.suggestions=(0,i.h)(r,{id:n._id,suggestions:n._suggestions})),o}(e,t),d))}},5363:(n,e,t)=>{t.d(e,{I:()=>x,K:()=>k,a:()=>y});var o=t(6783),i=t(2587),a=t(665),l=t(4600),s=t(7662),r=t(375),d=t(9060),c=t(5650),h=t(8625),u=t(8973),p=t(5800),m=t(608);const b=(n,e)=>{var{position:t="start",class:i}=n,a=(0,l._)(n,["position","class"]);const s="kol-input-container__adornment",r=`${s}--${t}`;return(0,o.h)("div",Object.assign({class:(0,d.c)(s,r,i)},a),e)};function v(n){return!!n&&(Array.isArray(n)?n.length>0:Boolean(n))}const _=(n,e)=>{var{class:t}=n,i=(0,l._)(n,["class"]);return(0,o.h)("div",Object.assign({class:(0,d.c)("kol-input-container__container",t)},i),e)},g=(n,e)=>{const{class:t,startAdornment:i,endAdornment:a,disabled:s,msg:r,touched:h,containerProps:u,startAdornmentProps:p,endAdornmentProps:m}=n,g=(0,l._)(n,["class","startAdornment","endAdornment","disabled","msg","touched","containerProps","startAdornmentProps","endAdornmentProps"]),f=(0,c.c)(r,h),y={"kol-input-container--disabled":s,[`kol-input-container--${(null==r?void 0:r.type)||"error"}`]:f},k=Object.assign({class:(0,d.c)("kol-input-container",y,t)},g);return v(i)||v(a)?(0,o.h)("div",Object.assign({},k),(0,o.h)(b,Object.assign({},p,{position:"start"}),i),(0,o.h)(_,Object.assign({},u),e),(0,o.h)(b,Object.assign({},m,{position:"end"}),a)):(0,o.h)("div",Object.assign({},k),(0,o.h)(_,Object.assign({},u),e))},f=n=>{const{label:e,icons:t,hideLabel:i,disabled:a,onClick:r}=n,d=(0,l._)(n,["label","icons","hideLabel","disabled","onClick"]);return(0,o.h)(s.a,Object.assign({tabindex:0,_label:e,_disabled:a,_icons:t,_hideLabel:i,_on:{onClick:r}},d))},y=n=>{const{componentName:e="button",label:t,icon:i,onClick:a}=n,s=(0,l._)(n,["componentName","label","icon","onClick"]),d="button"===e?f:r.K;return(0,o.h)(d,Object.assign({label:t||"",hideLabel:!0,icons:`codicon codicon-${i}`,onClick:a},s))},k=({state:n,endAdornment:e},t)=>{const{icons:l,smartButton:s,disabled:r,msg:d,touched:h}=function(n){let e,t;return"_icons"in n&&(e=n._icons),"_smartButton"in n&&(t=n._smartButton),{icons:e,smartButton:t,disabled:n._disabled,msg:(0,c.a)(n._msg),touched:n._touched}}(n);let u=null==l?void 0:l.left;(0,i.i)(u)&&(u={icon:u});let p=null==l?void 0:l.right;(0,i.i)(p)&&(p={icon:p});const m=[],b=[];return e&&(Array.isArray(e)?b.push(...e):b.push(e)),u&&m.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(u)?u:{}))),(0,a.i)(s)&&b.push((0,o.h)(y,Object.assign({componentName:"button"},s,{hideLabel:!0,disabled:r}))),p&&b.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(p)?p:{}))),(0,o.h)(g,{disabled:r,msg:d,touched:h,startAdornment:m,endAdornment:b},t)},w=(n,e)=>{const t=n;"object"==typeof t&&null!==t&&((0,m.i)(t.right,1)&&(t.right={icon:t.right}),(0,m.i)(t.left,1)&&(t.left={icon:t.left}),e.set("_icons",t))};class x extends h.I{constructor(n,e,t){super(n,e,t),this.component=n}validateIcons(n){(0,p.o)(n,(()=>{try{n=(0,p.p)(n)}catch(n){}(0,p.w)(this.component,"_icons",(n=>"object"==typeof n&&null!==n&&((0,m.i)(n.left,1)||(0,u.i)(n.left)||(0,m.i)(n.right,1)||(0,u.i)(n.right))),new Set(["KoliBriHorizontalIcon"]),n,{hooks:{beforePatch:w},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcons(this.component._icons)}}},8973:(n,e,t)=>{t.d(e,{i:()=>l,v:()=>s});var o=t(5800),i=t(608);const a=(n,e,t)=>{(0,i.b)(t)?n[e]=t:(0,i.i)(t,1)&&(n[e]={icon:t})},l=n=>"object"==typeof n&&null!==n&&(void 0===n.style||(0,i.a)(n.style))&&(void 0===n.label||(0,i.i)(n.label))&&(0,i.i)(n.icon,1),s=(n,e,t={})=>{(0,o.o)(e,(()=>{var s;try{e=(0,o.p)(e)}catch(n){}(0,o.w)(n,"_icons",(n=>{const e="object"==typeof n&&null!==n&&0===Object.keys(n).length;return null===n||e||(0,i.i)(n,1)||"object"==typeof n&&null!==n&&((0,i.i)(n.left,1)||l(n.left)||(0,i.i)(n.right,1)||l(n.right)||(0,i.i)(n.top,1)||l(n.top)||(0,i.i)(n.bottom,1)||l(n.bottom))}),new Set(["KoliBriIcon"]),e,Object.assign(Object.assign({},t),{defaultValue:{},hooks:{afterPatch:null===(s=t.hooks)||void 0===s?void 0:s.afterPatch,beforePatch:(n,e,o,l)=>{var s,r;"function"==typeof(null===(s=t.hooks)||void 0===s?void 0:s.beforePatch)&&(null===(r=t.hooks)||void 0===r||r.beforePatch(n,e,o,l)),(n=>{var e,t,o;if(null===(e=n.nextState)||void 0===e?void 0:e.has("_icons")){const e=null===(t=n.nextState)||void 0===t?void 0:t.get("_icons");null===(o=n.nextState)||void 0===o||o.set("_icons",(n=>{let e={};return(0,i.i)(n,1)?e={left:{icon:n}}:"object"==typeof n&&null!==n&&(a(e,"top",n.top),a(e,"right",n.right),a(e,"bottom",n.bottom),a(e,"left",n.left)),e})(e))}})(o)}}}))}))}},665:(n,e,t)=>{function o(n){var e=typeof n;return null!=n&&("object"==e||"function"==e)}t.d(e,{i:()=>o})},5876:(n,e,t)=>{t.r(e),t.d(e,{kol_input_color:()=>p});var o=t(6783),i=t(7336),a=t(5363),l=t(623),s=t(5800),r=t(7146),d=t(8625),c=(n,e,t)=>new Promise(((o,i)=>{var a=n=>{try{s(t.next(n))}catch(n){i(n)}},l=n=>{try{s(t.throw(n))}catch(n){i(n)}},s=n=>n.done?o(n.value):Promise.resolve(n.value).then(a,l);s((t=t.apply(n,e)).next())}));const h=["on","off"];class u extends a.I{constructor(n,e,t){super(n,e,t),this.component=n}validateAutoComplete(n){(0,s.w)(this.component,"_autoComplete",(n=>"string"==typeof n&&h.includes(n)),new Set(h),n)}validateSuggestions(n){(0,l.v)(this.component,n)}validateValue(n){(0,s.i)(this.component,"_value",n),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateSuggestions(this.component._suggestions),this.validateValue(this.component._value)}}const p=class{getValue(){return c(this,null,(function*(){var n;return null===(n=this.inputRef)||void 0===n?void 0:n.value}))}kolFocus(){return c(this,null,(function*(){var n;null===(n=this.inputRef)||void 0===n||n.focus()}))}getFormFieldProps(){return{state:this.state,class:"kol-input-color",tooltipAlign:this._tooltipAlign,onClick:()=>{var n;return null===(n=this.inputRef)||void 0===n?void 0:n.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,type:"color",slot:"input",state:this.state},this.controller.onFacade),{onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput})}render(){return(0,o.h)(d.K,Object.assign({key:"2cc074d267724a8844cb3a74173a4158d5085dec"},this.getFormFieldProps()),(0,o.h)(a.K,{key:"97ab0641e442efdf1cae0db8b98ddc495dcbbb83",state:this.state},(0,o.h)(r.K,Object.assign({key:"04f39017c2a6c0056d7c72d2dbc868f6af0eb495"},this.getInputProps()))))}constructor(n){(0,o.r)(this,n),this.catchRef=n=>{this.inputRef=n},this.onBlur=n=>{this.controller.onFacade.onBlur(n),this.inputHasFocus=!1},this.onFocus=n=>{this.controller.onFacade.onFocus(n),this.inputHasFocus=!0},this.onInput=n=>{var e,t;this._value=null!==(t=null===(e=this.inputRef)||void 0===e?void 0:e.value)&&void 0!==t?t:"",this.controller.onFacade.onInput(n)},this._accessKey=void 0,this._autoComplete=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._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_hideMsg:!1,_id:`id-${(0,i.n)()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new u(this,"color",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(n){this.controller.validateAccessKey(n)}validateAutoComplete(n){this.controller.validateAutoComplete(n)}validateDisabled(n){this.controller.validateDisabled(n)}validateHideMsg(n){this.controller.validateHideMsg(n)}validateHideLabel(n){this.controller.validateHideLabel(n)}validateHint(n){this.controller.validateHint(n)}validateIcons(n){this.controller.validateIcons(n)}validateId(n){this.controller.validateId(n)}validateLabel(n){this.controller.validateLabel(n)}validateMsg(n){this.controller.validateMsg(n)}validateName(n){this.controller.validateName(n)}validateOn(n){this.controller.validateOn(n)}validateShortKey(n){this.controller.validateShortKey(n)}validateSmartButton(n){this.controller.validateSmartButton(n)}validateSuggestions(n){this.controller.validateSuggestions(n)}validateSyncValueBySelector(n){this.controller.validateSyncValueBySelector(n)}validateTabIndex(n){this.controller.validateTabIndex(n)}validateTouched(n){this.controller.validateTouched(n)}validateValue(n){this.controller.validateValue(n)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}static get delegatesFocus(){return!0}get host(){return(0,o.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};p.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    cursor: pointer;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__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:(n,e,t)=>{t.d(e,{v:()=>i});var o=t(5800);const i=(n,e)=>{(0,o.g)(n,"_suggestions",(n=>"string"==typeof n||"number"==typeof n),e,void 0,{hooks:{afterPatch:n=>{Array.isArray(n)&&n.length&&(0,o.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([[5876],{781:(n,e,t)=>{t.d(e,{K:()=>a});var o=t(6922),i=t(7662);const a=n=>{const{class:e,style:t,icons:a,label:l,onClick:s}=n;return(0,o.h)(i.d,{class:e,style:t,onClick:s,_icons:a,_label:l})}},3556:(n,e,t)=>{t.d(e,{K:()=>r});var o=t(4600),i=t(6922),a=t(9060),l=t(3623),s=t(8439);const r=n=>{const{class:e,msg:t,required:r,disabled:d,touched:c,readonly:h,ariaDescribedBy:u,hideLabel:p,label:m,suggestions:b,value:v}=n,_=(0,o._)(n,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),g=(0,s.c)(t,c),f={"kol-input--disabled":Boolean(d),"kol-input--required":Boolean(r),"kol-input--touched":Boolean(c),"kol-input--readonly":Boolean(h),[`kol-input--${(null==t?void 0:t.type)||"error"}`]:g},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",f,e),required:r,disabled:d,readonly:h,type:"text",list:b?`${_.id}-list`:void 0},(0,l.d)({ariaDescribedBy:u,hideLabel:p,label:m})),_);return(0,i.h)(i.F,null,(0,i.h)("input",Object.assign({},y,{value:v})),b)}},531:(n,e,t)=>{t.d(e,{K:()=>d,a:()=>r});var o=t(4600),i=t(6922),a=t(3623),l=t(3556),s=t(8439);const r=n=>{var{id:e,suggestions:t}=n,a=(0,o._)(n,["id","suggestions"]);return t?(0,i.h)("datalist",Object.assign({id:`${e}-list`},a),t.map((n=>(0,i.h)("option",{value:n})))):null},d=n=>{var{state:e,customSuggestions:t}=n,d=(0,o._)(n,["state","customSuggestions"]);return(0,i.h)(l.K,Object.assign({},function(n,e){const{ariaDescribedBy:t}=(0,a.g)(n),o={id:n._id,hideLabel:n._hideLabel,label:n._label,accessKey:n._accessKey,disabled:n._disabled,name:n._name,ariaDescribedBy:t};return"_type"in n&&(o.type=n._type),"_value"in n&&(o.value=n._value),"_required"in n&&(o.required=n._required),"_maxLength"in n&&(o.maxlength=n._maxLength),"_placeholder"in n&&(o.placeholder=n._placeholder),"_autoComplete"in n&&(o.autoComplete=n._autoComplete),"_spellCheck"in n&&(o.spellcheck=n._spellCheck),"_pattern"in n&&(o.pattern=n._pattern),"_readOnly"in n&&(o.readonly=n._readOnly),"_min"in n&&(o.min=n._min),"_max"in n&&(o.max=n._max),"_step"in n&&(o.step=n._step),"_multiple"in n&&(o.multiple=n._multiple),"_checked"in n&&(o.checked=n._checked),"_indeterminate"in n&&(o.indeterminate=n._indeterminate),"_touched"in n&&(o.touched=n._touched),"_msg"in n&&(o.msg=(0,s.a)(n._msg)),"_suggestions"in n&&!e&&Array.isArray(n._suggestions)&&n._suggestions.length>0&&(o.suggestions=(0,i.h)(r,{id:n._id,suggestions:n._suggestions})),o}(e,t),d))}},7055:(n,e,t)=>{t.d(e,{I:()=>x,K:()=>k,a:()=>y});var o=t(6922),i=t(8788),a=t(665),l=t(4600),s=t(7662),r=t(781),d=t(9060),c=t(8439),h=t(3623),u=t(8973),p=t(5800),m=t(608);const b=(n,e)=>{var{position:t="start",class:i}=n,a=(0,l._)(n,["position","class"]);const s="kol-input-container__adornment",r=`${s}--${t}`;return(0,o.h)("div",Object.assign({class:(0,d.c)(s,r,i)},a),e)};function v(n){return!!n&&(Array.isArray(n)?n.length>0:Boolean(n))}const _=(n,e)=>{var{class:t}=n,i=(0,l._)(n,["class"]);return(0,o.h)("div",Object.assign({class:(0,d.c)("kol-input-container__container",t)},i),e)},g=(n,e)=>{const{class:t,startAdornment:i,endAdornment:a,disabled:s,msg:r,touched:h,containerProps:u,startAdornmentProps:p,endAdornmentProps:m}=n,g=(0,l._)(n,["class","startAdornment","endAdornment","disabled","msg","touched","containerProps","startAdornmentProps","endAdornmentProps"]),f=(0,c.c)(r,h),y={"kol-input-container--disabled":s,[`kol-input-container--${(null==r?void 0:r.type)||"error"}`]:f},k=Object.assign({class:(0,d.c)("kol-input-container",y,t)},g);return v(i)||v(a)?(0,o.h)("div",Object.assign({},k),(0,o.h)(b,Object.assign({},p,{position:"start"}),i),(0,o.h)(_,Object.assign({},u),e),(0,o.h)(b,Object.assign({},m,{position:"end"}),a)):(0,o.h)("div",Object.assign({},k),(0,o.h)(_,Object.assign({},u),e))},f=n=>{const{label:e,icons:t,hideLabel:i,disabled:a,onClick:r}=n,d=(0,l._)(n,["label","icons","hideLabel","disabled","onClick"]);return(0,o.h)(s.a,Object.assign({tabindex:0,_label:e,_disabled:a,_icons:t,_hideLabel:i,_on:{onClick:r}},d))},y=n=>{const{componentName:e="button",label:t,icon:i,onClick:a}=n,s=(0,l._)(n,["componentName","label","icon","onClick"]),d="button"===e?f:r.K;return(0,o.h)(d,Object.assign({label:t||"",hideLabel:!0,icons:`codicon codicon-${i}`,onClick:a},s))},k=({state:n,endAdornment:e},t)=>{const{icons:l,smartButton:s,disabled:r,msg:d,touched:h}=function(n){let e,t;return"_icons"in n&&(e=n._icons),"_smartButton"in n&&(t=n._smartButton),{icons:e,smartButton:t,disabled:n._disabled,msg:(0,c.a)(n._msg),touched:n._touched}}(n);let u=null==l?void 0:l.left;(0,i.i)(u)&&(u={icon:u});let p=null==l?void 0:l.right;(0,i.i)(p)&&(p={icon:p});const m=[],b=[];return e&&(Array.isArray(e)?b.push(...e):b.push(e)),u&&m.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(u)?u:{}))),(0,a.i)(s)&&b.push((0,o.h)(y,Object.assign({componentName:"button"},s,{hideLabel:!0,disabled:r}))),p&&b.push((0,o.h)(y,Object.assign({componentName:"icon"},(0,a.i)(p)?p:{}))),(0,o.h)(g,{disabled:r,msg:d,touched:h,startAdornment:m,endAdornment:b},t)},w=(n,e)=>{const t=n;"object"==typeof t&&null!==t&&((0,m.i)(t.right,1)&&(t.right={icon:t.right}),(0,m.i)(t.left,1)&&(t.left={icon:t.left}),e.set("_icons",t))};class x extends h.I{constructor(n,e,t){super(n,e,t),this.component=n}validateIcons(n){(0,p.o)(n,(()=>{try{n=(0,p.p)(n)}catch(n){}(0,p.w)(this.component,"_icons",(n=>"object"==typeof n&&null!==n&&((0,m.i)(n.left,1)||(0,u.i)(n.left)||(0,m.i)(n.right,1)||(0,u.i)(n.right))),new Set(["KoliBriHorizontalIcon"]),n,{hooks:{beforePatch:w},required:!0})}))}componentWillLoad(){super.componentWillLoad(),this.validateIcons(this.component._icons)}}},8973:(n,e,t)=>{t.d(e,{i:()=>l,v:()=>s});var o=t(5800),i=t(608);const a=(n,e,t)=>{(0,i.b)(t)?n[e]=t:(0,i.i)(t,1)&&(n[e]={icon:t})},l=n=>"object"==typeof n&&null!==n&&(void 0===n.style||(0,i.a)(n.style))&&(void 0===n.label||(0,i.i)(n.label))&&(0,i.i)(n.icon,1),s=(n,e,t={})=>{(0,o.o)(e,(()=>{var s;try{e=(0,o.p)(e)}catch(n){}(0,o.w)(n,"_icons",(n=>{const e="object"==typeof n&&null!==n&&0===Object.keys(n).length;return null===n||e||(0,i.i)(n,1)||"object"==typeof n&&null!==n&&((0,i.i)(n.left,1)||l(n.left)||(0,i.i)(n.right,1)||l(n.right)||(0,i.i)(n.top,1)||l(n.top)||(0,i.i)(n.bottom,1)||l(n.bottom))}),new Set(["KoliBriIcon"]),e,Object.assign(Object.assign({},t),{defaultValue:{},hooks:{afterPatch:null===(s=t.hooks)||void 0===s?void 0:s.afterPatch,beforePatch:(n,e,o,l)=>{var s,r;"function"==typeof(null===(s=t.hooks)||void 0===s?void 0:s.beforePatch)&&(null===(r=t.hooks)||void 0===r||r.beforePatch(n,e,o,l)),(n=>{var e,t,o;if(null===(e=n.nextState)||void 0===e?void 0:e.has("_icons")){const e=null===(t=n.nextState)||void 0===t?void 0:t.get("_icons");null===(o=n.nextState)||void 0===o||o.set("_icons",(n=>{let e={};return(0,i.i)(n,1)?e={left:{icon:n}}:"object"==typeof n&&null!==n&&(a(e,"top",n.top),a(e,"right",n.right),a(e,"bottom",n.bottom),a(e,"left",n.left)),e})(e))}})(o)}}}))}))}},665:(n,e,t)=>{function o(n){var e=typeof n;return null!=n&&("object"==e||"function"==e)}t.d(e,{i:()=>o})},5876:(n,e,t)=>{t.r(e),t.d(e,{kol_input_color:()=>p});var o=t(6922),i=t(4215),a=t(7055),l=t(623),s=t(5800),r=t(531),d=t(3623),c=(n,e,t)=>new Promise(((o,i)=>{var a=n=>{try{s(t.next(n))}catch(n){i(n)}},l=n=>{try{s(t.throw(n))}catch(n){i(n)}},s=n=>n.done?o(n.value):Promise.resolve(n.value).then(a,l);s((t=t.apply(n,e)).next())}));const h=["on","off"];class u extends a.I{constructor(n,e,t){super(n,e,t),this.component=n}validateAutoComplete(n){(0,s.w)(this.component,"_autoComplete",(n=>"string"==typeof n&&h.includes(n)),new Set(h),n)}validateSuggestions(n){(0,l.v)(this.component,n)}validateValue(n){(0,s.i)(this.component,"_value",n),this.setFormAssociatedValue(this.component.state._value)}componentWillLoad(){super.componentWillLoad(),this.validateAutoComplete(this.component._autoComplete),this.validateSuggestions(this.component._suggestions),this.validateValue(this.component._value)}}const p=class{getValue(){return c(this,null,(function*(){var n;return null===(n=this.inputRef)||void 0===n?void 0:n.value}))}kolFocus(){return c(this,null,(function*(){var n;null===(n=this.inputRef)||void 0===n||n.focus()}))}getFormFieldProps(){return{state:this.state,class:"kol-input-color",tooltipAlign:this._tooltipAlign,onClick:()=>{var n;return null===(n=this.inputRef)||void 0===n?void 0:n.focus()},alert:this.showAsAlert()}}getInputProps(){return Object.assign(Object.assign({ref:this.catchRef,type:"color",slot:"input",state:this.state},this.controller.onFacade),{onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput})}render(){return(0,o.h)(d.K,Object.assign({key:"2cc074d267724a8844cb3a74173a4158d5085dec"},this.getFormFieldProps()),(0,o.h)(a.K,{key:"97ab0641e442efdf1cae0db8b98ddc495dcbbb83",state:this.state},(0,o.h)(r.K,Object.assign({key:"04f39017c2a6c0056d7c72d2dbc868f6af0eb495"},this.getInputProps()))))}constructor(n){(0,o.r)(this,n),this.catchRef=n=>{this.inputRef=n},this.onBlur=n=>{this.controller.onFacade.onBlur(n),this.inputHasFocus=!1},this.onFocus=n=>{this.controller.onFacade.onFocus(n),this.inputHasFocus=!0},this.onInput=n=>{var e,t;this._value=null!==(t=null===(e=this.inputRef)||void 0===e?void 0:e.value)&&void 0!==t?t:"",this.controller.onFacade.onInput(n)},this._accessKey=void 0,this._autoComplete=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._shortKey=void 0,this._smartButton=void 0,this._suggestions=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this.state={_autoComplete:"off",_hideMsg:!1,_id:`id-${(0,i.n)()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new u(this,"color",this.host)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validateAccessKey(n){this.controller.validateAccessKey(n)}validateAutoComplete(n){this.controller.validateAutoComplete(n)}validateDisabled(n){this.controller.validateDisabled(n)}validateHideMsg(n){this.controller.validateHideMsg(n)}validateHideLabel(n){this.controller.validateHideLabel(n)}validateHint(n){this.controller.validateHint(n)}validateIcons(n){this.controller.validateIcons(n)}validateId(n){this.controller.validateId(n)}validateLabel(n){this.controller.validateLabel(n)}validateMsg(n){this.controller.validateMsg(n)}validateName(n){this.controller.validateName(n)}validateOn(n){this.controller.validateOn(n)}validateShortKey(n){this.controller.validateShortKey(n)}validateSmartButton(n){this.controller.validateSmartButton(n)}validateSuggestions(n){this.controller.validateSuggestions(n)}validateSyncValueBySelector(n){this.controller.validateSyncValueBySelector(n)}validateTabIndex(n){this.controller.validateTabIndex(n)}validateTouched(n){this.controller.validateTouched(n)}validateValue(n){this.controller.validateValue(n)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}static get delegatesFocus(){return!0}get host(){return(0,o.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_shortKey:["validateShortKey"],_smartButton:["validateSmartButton"],_suggestions:["validateSuggestions"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"]}}};p.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]) {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    place-items: center;\n    display: flex;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__close-button {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n}\n@layer kol-component {\n  .kol-form-field {\n    display: grid;\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .kol-input-container {\n    align-items: center;\n    background-color: white;\n    cursor: pointer;\n    display: grid;\n    grid-template-columns: 1fr;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__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:(n,e,t)=>{t.d(e,{v:()=>i});var o=t(5800);const i=(n,e)=>{(0,o.g)(n,"_suggestions",(n=>"string"==typeof n||"number"==typeof n),e,void 0,{hooks:{afterPatch:n=>{Array.isArray(n)&&n.length&&(0,o.a)("Property suggestions: Options have accessibility issues in how browsers implemented them and should not be used for now.")}}})}}}]);

package/dist/597.js

@@ -1,2 +1,2 @@
 /*! For license information please see 597.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[597],{9246:(n,e,t)=>{t.d(e,{a:()=>o,v:()=>l});var i=t(5800);const o=(n,e,t)=>{(0,i.w)(n,e,(n=>"string"==typeof n&&a.includes(n)),new Set(a),t,{defaultValue:"top"})},a=["left","right","top","bottom"],l=(n,e)=>{o(n,"_align",e)}},9060:(n,e,t)=>{function i(n){var e,t,o="";if("string"==typeof n||"number"==typeof n)o+=n;else if("object"==typeof n)if(Array.isArray(n)){var a=n.length;for(e=0;e<a;e++)n[e]&&(t=i(n[e]))&&(o&&(o+=" "),o+=t)}else for(t in n)n[t]&&(o&&(o+=" "),o+=t);return o}function o(){for(var n,e,t=0,o="",a=arguments.length;t<a;t++)(n=arguments[t])&&(e=i(n))&&(o&&(o+=" "),o+=e);return o}t.d(e,{c:()=>o})},597:(n,e,t)=>{t.r(e),t.d(e,{kol_drawer:()=>c});var i=t(6783),o=t(8231),a=t(9060),l=t(9246),s=t(1074),r=t(7688),d=t(5800),h=(n,e,t)=>new Promise(((i,o)=>{var a=n=>{try{s(t.next(n))}catch(n){o(n)}},l=n=>{try{s(t.throw(n))}catch(n){o(n)}},s=n=>n.done?i(n.value):Promise.resolve(n.value).then(a,l);s((t=t.apply(n,e)).next())}));const c=class{constructor(n){(0,i.r)(this,n),this.getWrapperRef=n=>this.dialogWrapperElement=n,this.getRef=n=>{this.dialogElement=n,setTimeout((()=>{this.openOrCloseBasedOnState()}))},this._open=void 0,this._align=void 0,this._label=void 0,this._on=void 0,this.state={_label:"",_open:!1,_align:"left"}}open(){return h(this,null,(function*(){var n;this.state=Object.assign(Object.assign({},this.state),{_open:!0}),null===(n=this.dialogElement)||void 0===n||n.showModal()}))}close(){return h(this,null,(function*(){this.state=Object.assign(Object.assign({},this.state),{_open:!1});const n=this.dialogWrapperElement;n&&"none"===window.getComputedStyle(n).animationName&&this.handleCloseDialog()}))}renderDialogContent(){const n=this.state._align;return(0,i.h)("div",{ref:this.getWrapperRef,class:(0,a.c)("kol-drawer__wrapper",`kol-drawer__wrapper--${n}`,{"kol-drawer__wrapper--open":this.state._open,"kol-drawer__wrapper--is-closing":!1===this.state._open}),"aria-label":this.state._label},(0,i.h)("div",{class:"kol-drawer__content"},(0,i.h)("slot",null)))}render(){return(0,i.h)(i.H,{key:"cdcc1b49ef03474e9079cac14741a67b0cd3d850",class:"kol-drawer"},(0,i.h)("dialog",{key:"8a171b8b858e0a5e25cef1f28addcd72adcfe76c",class:"kol-drawer__dialog",ref:this.getRef},this.renderDialogContent()))}validateLabel(n){(0,s.v)(this,n,{required:!0})}validateAlign(n){(0,l.v)(this,n)}validateOpen(n){"boolean"==typeof n&&((0,r.v)(this,n),this.dialogElement&&this.openOrCloseBasedOnState())}openOrCloseBasedOnState(){return h(this,null,(function*(){this.state._open?yield this.open():yield this.close()}))}validateOn(n){if("object"==typeof n&&null!==n){const e={};"function"==typeof n.onClose&&(e.onClose=n.onClose),(0,d.s)(this,"_on",e)}}handleCloseDialog(){var n,e,t;null===(n=this.dialogElement)||void 0===n||n.close(),null===(t=null===(e=this._on)||void 0===e?void 0:e.onClose)||void 0===t||t.call(e),this.host&&(0,o.d)(this.host,o.K.close)}handleClose(){(()=>{h(this,null,(function*(){yield this.close(),this.handleCloseDialog()}))})()}handleAnimationEnd(n){n.animationName.includes("slideOut")&&this.handleCloseDialog()}componentDidLoad(){var n,e;null===(n=this.dialogElement)||void 0===n||n.addEventListener("animationend",this.handleAnimationEnd.bind(this)),null===(e=this.dialogElement)||void 0===e||e.addEventListener("close",this.handleClose.bind(this))}disconnectedCallback(){var n,e;null===(n=this.dialogElement)||void 0===n||n.removeEventListener("animationend",this.handleAnimationEnd.bind(this)),null===(e=this.dialogElement)||void 0===e||e.removeEventListener("close",this.handleClose.bind(this))}componentWillLoad(){this.validateLabel(this._label),this.validateOpen(this._open),this.validateAlign(this._align),this.validateOn(this._on)}get host(){return(0,i.g)(this)}static get watchers(){return{_label:["validateLabel"],_align:["validateAlign"],_open:["validateOpen"],_on:["validateOn"]}}};c.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-drawer {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-drawer__dialog {\n    padding: 0;\n    border: none;\n  }\n  .kol-drawer__wrapper {\n    position: fixed;\n    width: auto;\n    overflow: auto;\n    background-color: white;\n  }\n  .kol-drawer__wrapper--left {\n    top: 0;\n    left: 0;\n    height: 100vh;\n    max-height: 100%;\n  }\n  .kol-drawer__wrapper--right {\n    top: 0;\n    right: 0;\n    height: 100vh;\n    max-height: 100%;\n  }\n  .kol-drawer__wrapper--top {\n    left: 0;\n    top: 0;\n    width: 100vw;\n    max-width: 100%;\n  }\n  .kol-drawer__wrapper--bottom {\n    left: 0;\n    bottom: 0;\n    width: 100vw;\n    max-width: 100%;\n  }\n  .kol-drawer__content {\n    position: relative;\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}"}},1074:(n,e,t)=>{t.d(e,{a:()=>c,b:()=>s,c:()=>r,h:()=>o,v:()=>h});var i=t(5800);const o=[0,1,2,3,4,5,6],a=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(n,e=1){return function(n){var e;return"string"==typeof n&&(null===(e=n.match(a))||void 0===e?void 0:e.length)||0}(n)>=e}function r(n){return l.test(n)}const d=new Set(["string"]),h=(n,e,t={})=>{(0,i.w)(n,"_label",(n=>"string"==typeof n),d,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,o,a)=>{var l,d;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(d=n.hooks)||void 0===d||d.afterPatch(e,t,o,a)),"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},7688:(n,e,t)=>{t.d(e,{v:()=>o});var i=t(5800);const o=(n,e,t)=>{(0,i.b)(n,"_open",e,t)}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[597],{9246:(n,e,t)=>{t.d(e,{a:()=>o,v:()=>l});var i=t(5800);const o=(n,e,t)=>{(0,i.w)(n,e,(n=>"string"==typeof n&&a.includes(n)),new Set(a),t,{defaultValue:"top"})},a=["left","right","top","bottom"],l=(n,e)=>{o(n,"_align",e)}},9060:(n,e,t)=>{function i(n){var e,t,o="";if("string"==typeof n||"number"==typeof n)o+=n;else if("object"==typeof n)if(Array.isArray(n)){var a=n.length;for(e=0;e<a;e++)n[e]&&(t=i(n[e]))&&(o&&(o+=" "),o+=t)}else for(t in n)n[t]&&(o&&(o+=" "),o+=t);return o}function o(){for(var n,e,t=0,o="",a=arguments.length;t<a;t++)(n=arguments[t])&&(e=i(n))&&(o&&(o+=" "),o+=e);return o}t.d(e,{c:()=>o})},597:(n,e,t)=>{t.r(e),t.d(e,{kol_drawer:()=>c});var i=t(6922),o=t(8231),a=t(9060),l=t(9246),s=t(1074),r=t(7688),d=t(5800),h=(n,e,t)=>new Promise(((i,o)=>{var a=n=>{try{s(t.next(n))}catch(n){o(n)}},l=n=>{try{s(t.throw(n))}catch(n){o(n)}},s=n=>n.done?i(n.value):Promise.resolve(n.value).then(a,l);s((t=t.apply(n,e)).next())}));const c=class{constructor(n){(0,i.r)(this,n),this.getWrapperRef=n=>this.dialogWrapperElement=n,this.getRef=n=>{this.dialogElement=n,setTimeout((()=>{this.openOrCloseBasedOnState()}))},this._open=void 0,this._align=void 0,this._label=void 0,this._on=void 0,this.state={_label:"",_open:!1,_align:"left"}}open(){return h(this,null,(function*(){var n;this.state=Object.assign(Object.assign({},this.state),{_open:!0}),null===(n=this.dialogElement)||void 0===n||n.showModal()}))}close(){return h(this,null,(function*(){this.state=Object.assign(Object.assign({},this.state),{_open:!1});const n=this.dialogWrapperElement;n&&"none"===window.getComputedStyle(n).animationName&&this.handleCloseDialog()}))}renderDialogContent(){const n=this.state._align;return(0,i.h)("div",{ref:this.getWrapperRef,class:(0,a.c)("kol-drawer__wrapper",`kol-drawer__wrapper--${n}`,{"kol-drawer__wrapper--open":this.state._open,"kol-drawer__wrapper--is-closing":!1===this.state._open}),"aria-label":this.state._label},(0,i.h)("div",{class:"kol-drawer__content"},(0,i.h)("slot",null)))}render(){return(0,i.h)(i.H,{key:"cdcc1b49ef03474e9079cac14741a67b0cd3d850",class:"kol-drawer"},(0,i.h)("dialog",{key:"8a171b8b858e0a5e25cef1f28addcd72adcfe76c",class:"kol-drawer__dialog",ref:this.getRef},this.renderDialogContent()))}validateLabel(n){(0,s.v)(this,n,{required:!0})}validateAlign(n){(0,l.v)(this,n)}validateOpen(n){"boolean"==typeof n&&((0,r.v)(this,n),this.dialogElement&&this.openOrCloseBasedOnState())}openOrCloseBasedOnState(){return h(this,null,(function*(){this.state._open?yield this.open():yield this.close()}))}validateOn(n){if("object"==typeof n&&null!==n){const e={};"function"==typeof n.onClose&&(e.onClose=n.onClose),(0,d.s)(this,"_on",e)}}handleCloseDialog(){var n,e,t;null===(n=this.dialogElement)||void 0===n||n.close(),null===(t=null===(e=this._on)||void 0===e?void 0:e.onClose)||void 0===t||t.call(e),this.host&&(0,o.d)(this.host,o.K.close)}handleClose(){(()=>{h(this,null,(function*(){yield this.close(),this.handleCloseDialog()}))})()}handleAnimationEnd(n){n.animationName.includes("slideOut")&&this.handleCloseDialog()}componentDidLoad(){var n,e;null===(n=this.dialogElement)||void 0===n||n.addEventListener("animationend",this.handleAnimationEnd.bind(this)),null===(e=this.dialogElement)||void 0===e||e.addEventListener("close",this.handleClose.bind(this))}disconnectedCallback(){var n,e;null===(n=this.dialogElement)||void 0===n||n.removeEventListener("animationend",this.handleAnimationEnd.bind(this)),null===(e=this.dialogElement)||void 0===e||e.removeEventListener("close",this.handleClose.bind(this))}componentWillLoad(){this.validateLabel(this._label),this.validateOpen(this._open),this.validateAlign(this._align),this.validateOn(this._on)}get host(){return(0,i.g)(this)}static get watchers(){return{_label:["validateLabel"],_align:["validateAlign"],_open:["validateOpen"],_on:["validateOn"]}}};c.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-drawer {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-drawer__dialog {\n    padding: 0;\n    border: none;\n  }\n  .kol-drawer__wrapper {\n    position: fixed;\n    width: auto;\n    overflow: auto;\n    background-color: white;\n  }\n  .kol-drawer__wrapper--left {\n    top: 0;\n    left: 0;\n    height: 100vh;\n    max-height: 100%;\n  }\n  .kol-drawer__wrapper--right {\n    top: 0;\n    right: 0;\n    height: 100vh;\n    max-height: 100%;\n  }\n  .kol-drawer__wrapper--top {\n    left: 0;\n    top: 0;\n    width: 100vw;\n    max-width: 100%;\n  }\n  .kol-drawer__wrapper--bottom {\n    left: 0;\n    bottom: 0;\n    width: 100vw;\n    max-width: 100%;\n  }\n  .kol-drawer__content {\n    position: relative;\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}"}},1074:(n,e,t)=>{t.d(e,{a:()=>c,b:()=>s,c:()=>r,h:()=>o,v:()=>h});var i=t(5800);const o=[0,1,2,3,4,5,6],a=/[a-zA-Z0-9äöüÄÖÜß]/g,l=/^\d+$/;function s(n,e=1){return function(n){var e;return"string"==typeof n&&(null===(e=n.match(a))||void 0===e?void 0:e.length)||0}(n)>=e}function r(n){return l.test(n)}const d=new Set(["string"]),h=(n,e,t={})=>{(0,i.w)(n,"_label",(n=>"string"==typeof n),d,e,function(n){var e;return Object.assign(Object.assign({},n),{hooks:{afterPatch:(e,t,o,a)=>{var l,d;"function"==typeof(null===(l=n.hooks)||void 0===l?void 0:l.afterPatch)&&(null===(d=n.hooks)||void 0===d||d.afterPatch(e,t,o,a)),"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},7688:(n,e,t)=>{t.d(e,{v:()=>o});var i=t(5800);const o=(n,e,t)=>{(0,i.b)(n,"_open",e,t)}}}]);

package/dist/6451.js

@@ -1,2 +1,2 @@
 /*! For license information please see 6451.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[6451],{6451:(s,c,e)=>{e.r(c),e.d(c,{test_component:()=>u});var t=e(6783);const u=class{constructor(s){(0,t.r)(this,s)}}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[6451],{6451:(s,c,e)=>{e.r(c),e.d(c,{test_component:()=>u});var t=e(6922);const u=class{constructor(s){(0,t.r)(this,s)}}}}]);

package/dist/6480.js

@@ -1,2 +1,2 @@
 /*! For license information please see 6480.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[6480],{6480:(n,e,t)=>{t.r(e),t.d(e,{kol_alert:()=>a});var o=t(6783),i=t(7662);const a=class{constructor(n){(0,o.r)(this,n),this._alert=!1,this._hasCloser=!1,this._label=void 0,this._level=0,this._on=void 0,this._type="default",this._variant="msg",this.state={_level:0}}render(){return(0,o.h)(i.b,{key:"bf0dcf3d99c23b32dce354988410b4e0534cce82",_alert:this._alert,_hasCloser:this._hasCloser,_label:this._label,_level:this._level,_on:this._on,_type:this._type,_variant:this._variant},(0,o.h)("slot",{key:"1248b1be19f50c8c2e33e234fd3c5aba760f866a"}))}};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  :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-alert {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}"}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[6480],{6480:(n,e,t)=>{t.r(e),t.d(e,{kol_alert:()=>a});var o=t(6922),i=t(7662);const a=class{constructor(n){(0,o.r)(this,n),this._alert=!1,this._hasCloser=!1,this._label=void 0,this._level=0,this._on=void 0,this._type="default",this._variant="msg",this.state={_level:0}}render(){return(0,o.h)(i.b,{key:"bf0dcf3d99c23b32dce354988410b4e0534cce82",_alert:this._alert,_hasCloser:this._hasCloser,_label:this._label,_level:this._level,_on:this._on,_type:this._type,_variant:this._variant},(0,o.h)("slot",{key:"1248b1be19f50c8c2e33e234fd3c5aba760f866a"}))}};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  :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-alert {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}"}}}]);