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

package/dist/4928.js

@@ -1,2 +1,2 @@
 /*! For license information please see 4928.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[4928],{4928:(n,e,t)=>{t.r(e),t.d(e,{kol_link:()=>a});var i=t(6970),o=t(7767);const a=class{constructor(n){(0,i.r)(this,n),this.catchRef=n=>{this.linkWcRef=n},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._ariaDescription=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._shortKey=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right"}kolFocus(){return n=this,e=function*(){var n;yield null===(n=this.linkWcRef)||void 0===n?void 0:n.kolFocus()},new Promise(((t,i)=>{var o=n=>{try{l(e.next(n))}catch(n){i(n)}},a=n=>{try{l(e.throw(n))}catch(n){i(n)}},l=n=>n.done?t(n.value):Promise.resolve(n.value).then(o,a);l((e=e.apply(n,null)).next())}));var n,e}render(){return(0,i.h)(o.f,{key:"a240300bd44e798de8ac60e7a920a46bb0ac1d86",ref:this.catchRef,_accessKey:this._accessKey,_ariaCurrentValue:this._ariaCurrentValue,_ariaDescription:this._ariaDescription,_disabled:this._disabled,_download:this._download,_hideLabel:this._hideLabel,_href:this._href,_icons:this._icons,_label:this._label,_on:this._on,_role:this._role,_shortKey:this._shortKey,_tabIndex:this._tabIndex,_target:this._target,_tooltipAlign:this._tooltipAlign},(0,i.h)("slot",{key:"e7b87695e7b16dee2edc1b6cdf05dcea46c8c4b4",name:"expert",slot:"expert"}))}static get delegatesFocus(){return!0}};a.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :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  :host {\n    display: inline-block;\n  }\n  .kol-link {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    align-items: baseline;\n    display: inline-flex;\n    place-items: center;\n    text-align: left;\n    text-decoration-line: none;\n  }\n  .kol-link__text .kol-span__label {\n    text-decoration-line: underline;\n  }\n  .kol-link:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-link__text .kol-span__label {\n    text-decoration-thickness: 0.2em;\n  }\n  .kol-link__icon {\n    display: inline-flex;\n    margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n}"}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[4928],{4928:(n,e,t)=>{t.r(e),t.d(e,{kol_link:()=>a});var i=t(5630),o=t(7767);const a=class{constructor(n){(0,i.r)(this,n),this.catchRef=n=>{this.linkWcRef=n},this._accessKey=void 0,this._ariaCurrentValue=void 0,this._ariaDescription=void 0,this._disabled=!1,this._download=void 0,this._hideLabel=!1,this._href=void 0,this._icons=void 0,this._label=void 0,this._on=void 0,this._role=void 0,this._shortKey=void 0,this._tabIndex=void 0,this._target=void 0,this._tooltipAlign="right"}kolFocus(){return n=this,e=function*(){var n;yield null===(n=this.linkWcRef)||void 0===n?void 0:n.kolFocus()},new Promise(((t,i)=>{var o=n=>{try{l(e.next(n))}catch(n){i(n)}},a=n=>{try{l(e.throw(n))}catch(n){i(n)}},l=n=>n.done?t(n.value):Promise.resolve(n.value).then(o,a);l((e=e.apply(n,null)).next())}));var n,e}render(){return(0,i.h)(o.f,{key:"08fcc3e8a5d1735df8ad6e8d7633f838204e7116",ref:this.catchRef,_accessKey:this._accessKey,_ariaCurrentValue:this._ariaCurrentValue,_ariaDescription:this._ariaDescription,_disabled:this._disabled,_download:this._download,_hideLabel:this._hideLabel,_href:this._href,_icons:this._icons,_label:this._label,_on:this._on,_role:this._role,_shortKey:this._shortKey,_tabIndex:this._tabIndex,_target:this._target,_tooltipAlign:this._tooltipAlign},(0,i.h)("slot",{key:"e2b7d9d3a195e135fec2d659f934f1cc9e37b7f1",name:"expert",slot:"expert"}))}static get delegatesFocus(){return!0}};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    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  :host {\n    display: inline-block;\n  }\n  .kol-link {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    align-items: baseline;\n    display: inline-flex;\n    place-items: center;\n    text-align: left;\n    text-decoration-line: none;\n  }\n  .kol-link__text .kol-span__label {\n    text-decoration-line: underline;\n  }\n  .kol-link:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-link__text .kol-span__label {\n    text-decoration-thickness: 0.2em;\n  }\n  .kol-link__icon {\n    display: inline-flex;\n    margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n}"}}}]);

package/dist/5000.js

@@ -1,2 +1,2 @@
 /*! For license information please see 5000.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5e3],{6755:(e,n,t)=>{t.d(n,{K:()=>r});var i=t(4600),o=t(6970),l=t(9060),a=t(7767),s=t(4916);const r=(e,n)=>{const{id:t,class:r,label:c,level:d=1,disabled:h,open:p,onClick:u,HeadingProps:b={},HeadingButtonProps:v={},ContentProps:f={}}=e,m=(0,i._)(e,["id","class","label","level","disabled","open","onClick","HeadingProps","HeadingButtonProps","ContentProps"]),g=p?"remove":"add";return(0,o.h)("div",Object.assign({id:t,class:(0,l.c)("collapsible",{"collapsible--disabled":!0===h,"collapsible--open":!0===p},r)},m),(0,o.h)(s.K,{ref:null==b?void 0:b.ref,level:d,class:(0,l.c)("collapsible__heading",null==b?void 0:b.class)},(0,o.h)(a.a,{class:(0,l.c)("collapsible__heading-button",null==v?void 0:v.class),ref:null==v?void 0:v.ref,slot:"expert",_ariaControls:`${t}-control`,_ariaExpanded:p,_disabled:h,_icons:(null==v?void 0:v._icons)||`codicon codicon-${g}`,_label:c,_on:{onClick:u}})),(0,o.h)("div",{class:(0,l.c)("collapsible__wrapper",null==f?void 0:f.wrapperClass)},(0,o.h)("div",{class:(0,l.c)("collapsible__wrapper-animation",null==f?void 0:f.animationClass)},(0,o.h)("div",{"aria-hidden":!1===p?"true":void 0,class:(0,l.c)("collapsible__content",null==f?void 0:f.class),id:`${t}-control`},n))))}},4916:(e,n,t)=>{t.d(n,{K:()=>d});var i=t(4600),o=t(6970),l=t(9060);const a=1;function s(e){return function(e){return e>=a&&e<=6}(e)?`h${e}`:"strong"}const r=(e,n)=>{var{class:t,level:r=a,variant:c}=e,d=(0,i._)(e,["class","level","variant"]);const h=s(r),p=c||h;return(0,o.h)(h,Object.assign({class:(0,l.c)("kol-headline",`kol-headline--${p}`,t)},d),n)},c=(e,n)=>{var{class:t,level:r=a}=e,c=(0,i._)(e,["class","level"]);const d=function(e){return 1===e?"span":s(e)}(r+1);return(0,o.h)(d,Object.assign({class:(0,l.c)("kol-headline kol-headline--group kol-headline--secondary",t)},c),n)},d=(e,n)=>{var{secondaryHeadline:t,level:s=a,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:p={}}=e,u=(0,i._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:s},u);if(!t)return(0,o.h)(r,Object.assign({class:(0,l.c)(d,"kol-headline--single")},b),n);const{class:v}=h,f=(0,i._)(h,["class"]),m=Object.assign({class:(0,l.c)("kol-heading-group",v)},f);return(0,o.h)("hgroup",Object.assign({},m),(0,o.h)(r,Object.assign({class:(0,l.c)(d,"kol-headline--group","kol-headline--primary")},b),n),(0,o.h)(c,Object.assign({level:s},p),t))}},9060:(e,n,t)=>{function i(e){var n,t,o="";if("string"==typeof e||"number"==typeof e)o+=e;else if("object"==typeof e)if(Array.isArray(e)){var l=e.length;for(n=0;n<l;n++)e[n]&&(t=i(e[n]))&&(o&&(o+=" "),o+=t)}else for(t in e)e[t]&&(o&&(o+=" "),o+=t);return o}function o(){for(var e,n,t=0,o="",l=arguments.length;t<l;t++)(e=arguments[t])&&(n=i(e))&&(o&&(o+=" "),o+=n);return o}t.d(n,{c:()=>o})},8125:(e,n,t)=>{t.d(n,{i:()=>s,n:()=>c,r:()=>r});var i=t(6970),o=t(5687),l=t(1732);const a=()=>{let e=(0,l.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,l.d)(),"KoliBri",{value:e,writable:!1})),e},s=()=>{(()=>{const e=(0,l.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const n=e.getAttribute("content");"string"==typeof n&&((0,l.s)(n.includes("dev-mode=true")),(0,l.b)(n.includes("experimental-mode=true")),(0,l.c)(n.includes("color-contrast-analysis=true")))}})(),l.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${i.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==a().adviceShown&&(Object.defineProperty(a(),"adviceShown",{get:function(){return!0}}),l.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===o.p&&(c=()=>"nonce")},3970:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(5800);const o=(e,n)=>{(0,i.b)(e,"_disabled",n,{hooks:{afterPatch:e=>{!0===e&&(0,i.c)()}}})}},5e3:(e,n,t)=>{t.r(n),t.d(n,{kol_accordion:()=>p});var i=t(6970),o=t(8125),l=t(8228),a=t(8231),s=t(5800),r=t(6755),c=t(3970),d=t(7688),h=t(1074);(0,s.f)("[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend"),(0,s.f)("[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.");const p=class{constructor(e){(0,i.r)(this,e),this.nonce=(0,o.n)(),this.catchRef=e=>{this.buttonWcRef=e},this.handleOnClick=e=>{this._open=!this._open,setTimeout((()=>{var n,t;null===(t=null===(n=this.state._on)||void 0===n?void 0:n.onClick)||void 0===t||t.call(n,e,!0===this._open),this.host&&(0,a.d)(this.host,a.K.click,!0===this._open)}))},this._disabled=!1,this._label=void 0,this._level=1,this._on=void 0,this._open=!1,this.state={_label:"",_level:1,_on:{}}}kolFocus(){return e=this,n=function*(){var e;yield null===(e=this.buttonWcRef)||void 0===e?void 0:e.kolFocus()},new Promise(((t,i)=>{var o=e=>{try{a(n.next(e))}catch(e){i(e)}},l=e=>{try{a(n.throw(e))}catch(e){i(e)}},a=e=>e.done?t(e.value):Promise.resolve(e.value).then(o,l);a((n=n.apply(e,null)).next())}));var e,n}render(){const{_open:e,_label:n,_disabled:t,_level:o}=this.state,l="kol-accordion",a={id:this.nonce,label:n,open:e,disabled:t,level:o,onClick:this.handleOnClick,class:l,HeadingProps:{class:`${l}__heading`},HeadingButtonProps:{ref:this.catchRef,class:`${l}__heading-button`},ContentProps:{class:`${l}__content`,wrapperClass:`${l}__wrapper`,animationClass:`${l}__wrapper-animation`}};return(0,i.h)(r.K,Object.assign({key:"1dbccb17356ce71203174127364c940a335db42d"},a),(0,i.h)("slot",{key:"a04b6c07d149b451f549400a506d7b97e6cf3ed7"}))}validateDisabled(e){(0,c.v)(this,e)}validateLabel(e){(0,h.v)(this,e,{required:!0})}validateLevel(e){(0,l.w)(this,e)}validateOn(e){var n;n=e,(0,s.w)(this,"_on",(e=>"object"==typeof e&&null!==e),new Set(["AccordionCallbacksPropType {Events.onClick}"]),n)}validateOpen(e){(0,d.v)(this,e)}componentWillLoad(){this.validateDisabled(this._disabled),this.validateLabel(this._label),this.validateLevel(this._level),this.validateOn(this._on),this.validateOpen(this._open)}get host(){return(0,i.g)(this)}static get watchers(){return{_disabled:["validateDisabled"],_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_open:["validateOpen"]}}};p.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));\n    /*\n     * No element should be used without a background and font color whose contrast ratio has\n     * not been checked. By initially setting the background color to white and the font color\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    background-color: white;\n    color: black;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /*\n   * All interactive elements should have a minimum size of rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  [role=button],\n  button:not([role=link]),\n  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n/* For animation technique see https://css-tricks.com/css-grid-can-do-auto-height-transitions/ */\n@layer kol-component {\n  .collapsible {\n    /* @see https://github.com/public-ui/kolibri/issues/5952 */\n    /*\n          * Inside a button, the caption text is always centered.\n          * So we have to align the text to the left.\n          */\n  }\n  .collapsible__wrapper {\n    display: grid;\n    grid-template-rows: 0fr;\n    overflow: hidden;\n    transition: grid-template-rows 0.3s;\n  }\n  .collapsible__wrapper-animation {\n    min-height: 0;\n    transition: visibility 0.3s;\n    /* This property is important to keep in sync with the visual transition (template-rows). Without it interactive elements within the accordion would stay focusable. */\n    visibility: hidden;\n  }\n  .collapsible--open .collapsible__wrapper {\n    grid-template-rows: 1fr;\n  }\n  .collapsible--open .collapsible__wrapper-animation {\n    visibility: visible;\n  }\n  @media (prefers-reduced-motion) {\n    .collapsible__wrapper-animation, .collapsible__wrapper {\n      transition-duration: 0s;\n    }\n  }\n  @media print {\n    :not(.collapsible--open) .collapsible__wrapper-animation {\n      display: none;\n    }\n  }\n  .collapsible__heading-button button .kol-span {\n    justify-items: start;\n  }\n}\n@layer kol-component {\n  .kol-accordion {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}"}},1074:(e,n,t)=>{t.d(n,{a:()=>h,b:()=>s,c:()=>r,h:()=>o,v:()=>d});var i=t(5800);const o=[0,1,2,3,4,5,6],l=/[a-zA-Z0-9äöüÄÖÜß]/g,a=/^\d+$/;function s(e,n=1){return function(e){var n;return"string"==typeof e&&(null===(n=e.match(l))||void 0===n?void 0:n.length)||0}(e)>=n}function r(e){return a.test(e)}const c=new Set(["string"]),d=(e,n,t={})=>{(0,i.w)(e,"_label",(e=>"string"==typeof e),c,n,function(e){var n;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(n,t,o,l)=>{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(n,t,o,l)),"string"==typeof n&&!1===s(n,3)&&!1===r(n)&&(0,i.a)(`The heading or label ("${n}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof n&&n.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(n=e.hooks)||void 0===n?void 0:n.beforePatch}})}(t))},h=d},7688:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(5800);const o=(e,n,t)=>{(0,i.b)(e,"_open",n,t)}},5687:(e,n,t)=>{t.d(n,{b:()=>a,h:()=>o,p:()=>i,s:()=>l});let i="development";try{i="production"}catch(e){i="production"}const o=(e,n,t)=>{if(e&&n&&"string"==typeof t){const i=e.querySelector(`[slot="${t}"]`);i&&n.appendChild(i)}},l=e=>""===e,a=(e,n)=>e||n||""},4600:(e,n,t)=>{function i(e,n){var t={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&n.indexOf(i)<0&&(t[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(i=Object.getOwnPropertySymbols(e);o<i.length;o++)n.indexOf(i[o])<0&&Object.prototype.propertyIsEnumerable.call(e,i[o])&&(t[i[o]]=e[i[o]])}return t}t.d(n,{_:()=>i}),"function"==typeof SuppressedError&&SuppressedError},8228:(e,n,t)=>{t.d(n,{w:()=>l});var i=t(1074),o=t(5800);const l=(e,n)=>{(0,o.w)(e,"_level",(e=>"number"==typeof e&&i.h.includes(e)),new Set([`Number {${i.h.join(", ")}`]),n,{defaultValue:1,required:!0})}}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5e3],{1716:(e,n,t)=>{t.d(n,{K:()=>r});var i=t(4600),o=t(5630),l=t(9060),a=t(7767),s=t(3849);const r=(e,n)=>{const{id:t,class:r,label:c,level:d=1,disabled:h,open:p,onClick:u,HeadingProps:b={},HeadingButtonProps:v={},ContentProps:f={}}=e,m=(0,i._)(e,["id","class","label","level","disabled","open","onClick","HeadingProps","HeadingButtonProps","ContentProps"]),g=p?"remove":"add";return(0,o.h)("div",Object.assign({id:t,class:(0,l.c)("collapsible",{"collapsible--disabled":!0===h,"collapsible--open":!0===p},r)},m),(0,o.h)(s.K,{ref:null==b?void 0:b.ref,level:d,class:(0,l.c)("collapsible__heading",null==b?void 0:b.class)},(0,o.h)(a.a,{class:(0,l.c)("collapsible__heading-button",null==v?void 0:v.class),ref:null==v?void 0:v.ref,slot:"expert",_ariaControls:`${t}-control`,_ariaExpanded:p,_disabled:h,_icons:(null==v?void 0:v._icons)||`codicon codicon-${g}`,_label:c,_on:{onClick:u}})),(0,o.h)("div",{class:(0,l.c)("collapsible__wrapper",null==f?void 0:f.wrapperClass)},(0,o.h)("div",{class:(0,l.c)("collapsible__wrapper-animation",null==f?void 0:f.animationClass)},(0,o.h)("div",{"aria-hidden":!1===p?"true":void 0,class:(0,l.c)("collapsible__content",null==f?void 0:f.class),id:`${t}-control`},n))))}},3849:(e,n,t)=>{t.d(n,{K:()=>d});var i=t(4600),o=t(5630),l=t(9060);const a=1;function s(e){return function(e){return e>=a&&e<=6}(e)?`h${e}`:"strong"}const r=(e,n)=>{var{class:t,level:r=a,variant:c}=e,d=(0,i._)(e,["class","level","variant"]);const h=s(r),p=c||h;return(0,o.h)(h,Object.assign({class:(0,l.c)("kol-headline",`kol-headline--${p}`,t)},d),n)},c=(e,n)=>{var{class:t,level:r=a}=e,c=(0,i._)(e,["class","level"]);const d=function(e){return 1===e?"span":s(e)}(r+1);return(0,o.h)(d,Object.assign({class:(0,l.c)("kol-headline kol-headline--group kol-headline--secondary",t)},c),n)},d=(e,n)=>{var{secondaryHeadline:t,level:s=a,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:p={}}=e,u=(0,i._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const b=Object.assign({level:s},u);if(!t)return(0,o.h)(r,Object.assign({class:(0,l.c)(d,"kol-headline--single")},b),n);const{class:v}=h,f=(0,i._)(h,["class"]),m=Object.assign({class:(0,l.c)("kol-heading-group",v)},f);return(0,o.h)("hgroup",Object.assign({},m),(0,o.h)(r,Object.assign({class:(0,l.c)(d,"kol-headline--group","kol-headline--primary")},b),n),(0,o.h)(c,Object.assign({level:s},p),t))}},9060:(e,n,t)=>{function i(e){var n,t,o="";if("string"==typeof e||"number"==typeof e)o+=e;else if("object"==typeof e)if(Array.isArray(e)){var l=e.length;for(n=0;n<l;n++)e[n]&&(t=i(e[n]))&&(o&&(o+=" "),o+=t)}else for(t in e)e[t]&&(o&&(o+=" "),o+=t);return o}function o(){for(var e,n,t=0,o="",l=arguments.length;t<l;t++)(e=arguments[t])&&(n=i(e))&&(o&&(o+=" "),o+=n);return o}t.d(n,{c:()=>o})},4879:(e,n,t)=>{t.d(n,{i:()=>s,n:()=>c,r:()=>r});var i=t(5630),o=t(5687),l=t(1732);const a=()=>{let e=(0,l.d)().KoliBri;return void 0===e&&(e={},Object.defineProperty((0,l.d)(),"KoliBri",{value:e,writable:!1})),e},s=()=>{(()=>{const e=(0,l.g)().querySelector('meta[name="kolibri"]');if(e&&e.hasAttribute("content")){const n=e.getAttribute("content");"string"==typeof n&&((0,l.s)(n.includes("dev-mode=true")),(0,l.b)(n.includes("experimental-mode=true")),(0,l.c)(n.includes("color-contrast-analysis=true")))}})(),l.L.debug(`\n,--. ,--.         ,--. ,--. ,-----.           ,--.\n|  .'   /  ,---.  |  | \`--' |  |) /_  ,--.--. \`--'\n|  .   '  | .-. | |  | ,--. |  .-.  \\ |  .--' ,--.\n|  |\\   \\ | '-' | |  | |  | |  '--' / |  |    |  |\n\`--' \`--´  \`---´  \`--' \`--' \`------´  \`--'    \`--'\n🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | ${i.E.kolibriVersion}\n\t`,{forceLog:!0})},r=()=>{!0!==a().adviceShown&&(Object.defineProperty(a(),"adviceShown",{get:function(){return!0}}),l.L.debug("\nYou are using the KoliBri component library. If you have any suggestions for improvement or find a problem, please contact us:\n\nTicket: https://github.com/public-ui/kolibri/issues/new/choose (for privacy reasons, please use email)\nEmail: kolibri@itzbund.de\n"))};let c=()=>Math.floor(16777215*Math.random()).toString(16);"test"===o.p&&(c=()=>"nonce")},3970:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(5800);const o=(e,n)=>{(0,i.b)(e,"_disabled",n,{hooks:{afterPatch:e=>{!0===e&&(0,i.c)()}}})}},5e3:(e,n,t)=>{t.r(n),t.d(n,{kol_accordion:()=>p});var i=t(5630),o=t(4879),l=t(8228),a=t(8231),s=t(5800),r=t(1716),c=t(3970),d=t(7688),h=t(1074);(0,s.f)("[KolAccordion] Anfrage nach einer KolAccordionGroup bei dem immer nur ein Accordion geöffnet ist.\n\n- onClick auf der KolAccordion anwenden\n- Click-Event prüft den _open-Status der Accordions\n- Logik Öffnet und Schließt entsprechend"),(0,s.f)("[KolAccordion] Tab-Sperre des Inhalts im geschlossenen Zustand.");const p=class{constructor(e){(0,i.r)(this,e),this.nonce=(0,o.n)(),this.catchRef=e=>{this.buttonWcRef=e},this.handleOnClick=e=>{this._open=!this._open,setTimeout((()=>{var n,t;null===(t=null===(n=this.state._on)||void 0===n?void 0:n.onClick)||void 0===t||t.call(n,e,!0===this._open),this.host&&(0,a.d)(this.host,a.K.click,!0===this._open)}))},this._disabled=!1,this._label=void 0,this._level=1,this._on=void 0,this._open=!1,this.state={_label:"",_level:1,_on:{}}}kolFocus(){return e=this,n=function*(){var e;yield null===(e=this.buttonWcRef)||void 0===e?void 0:e.kolFocus()},new Promise(((t,i)=>{var o=e=>{try{a(n.next(e))}catch(e){i(e)}},l=e=>{try{a(n.throw(e))}catch(e){i(e)}},a=e=>e.done?t(e.value):Promise.resolve(e.value).then(o,l);a((n=n.apply(e,null)).next())}));var e,n}render(){const{_open:e,_label:n,_disabled:t,_level:o}=this.state,l="kol-accordion",a={id:this.nonce,label:n,open:e,disabled:t,level:o,onClick:this.handleOnClick,class:l,HeadingProps:{class:`${l}__heading`},HeadingButtonProps:{ref:this.catchRef,class:`${l}__heading-button`},ContentProps:{class:`${l}__content`,wrapperClass:`${l}__wrapper`,animationClass:`${l}__wrapper-animation`}};return(0,i.h)(r.K,Object.assign({key:"1dbccb17356ce71203174127364c940a335db42d"},a),(0,i.h)("slot",{key:"a04b6c07d149b451f549400a506d7b97e6cf3ed7"}))}validateDisabled(e){(0,c.v)(this,e)}validateLabel(e){(0,h.v)(this,e,{required:!0})}validateLevel(e){(0,l.w)(this,e)}validateOn(e){var n;n=e,(0,s.w)(this,"_on",(e=>"object"==typeof e&&null!==e),new Set(["AccordionCallbacksPropType {Events.onClick}"]),n)}validateOpen(e){(0,d.v)(this,e)}componentWillLoad(){this.validateDisabled(this._disabled),this.validateLabel(this._label),this.validateLevel(this._level),this.validateOn(this._on),this.validateOpen(this._open)}get host(){return(0,i.g)(this)}static get watchers(){return{_disabled:["validateDisabled"],_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_open:["validateOpen"]}}};p.style={default:"/*\n * This file contains all rules for accessibility.\n */\n@layer kol-global {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     */\n    --a11y-min-size: 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/* For animation technique see https://css-tricks.com/css-grid-can-do-auto-height-transitions/ */\n@layer kol-component {\n  .collapsible {\n    /* @see https://github.com/public-ui/kolibri/issues/5952 */\n    /*\n          * Inside a button, the caption text is always centered.\n          * So we have to align the text to the left.\n          */\n  }\n  .collapsible__wrapper {\n    display: grid;\n    grid-template-rows: 0fr;\n    overflow: hidden;\n    transition: grid-template-rows 0.3s;\n  }\n  .collapsible__wrapper-animation {\n    min-height: 0;\n    transition: visibility 0.3s;\n    /* This property is important to keep in sync with the visual transition (template-rows). Without it interactive elements within the accordion would stay focusable. */\n    visibility: hidden;\n  }\n  .collapsible--open .collapsible__wrapper {\n    grid-template-rows: 1fr;\n  }\n  .collapsible--open .collapsible__wrapper-animation {\n    visibility: visible;\n  }\n  @media (prefers-reduced-motion) {\n    .collapsible__wrapper-animation, .collapsible__wrapper {\n      transition-duration: 0s;\n    }\n  }\n  @media print {\n    :not(.collapsible--open) .collapsible__wrapper-animation {\n      display: none;\n    }\n  }\n  .collapsible__heading-button button .kol-span {\n    justify-items: start;\n  }\n}\n@layer kol-component {\n  .kol-accordion {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}"}},1074:(e,n,t)=>{t.d(n,{a:()=>h,b:()=>s,c:()=>r,h:()=>o,v:()=>d});var i=t(5800);const o=[0,1,2,3,4,5,6],l=/[a-zA-Z0-9äöüÄÖÜß]/g,a=/^\d+$/;function s(e,n=1){return function(e){var n;return"string"==typeof e&&(null===(n=e.match(l))||void 0===n?void 0:n.length)||0}(e)>=n}function r(e){return a.test(e)}const c=new Set(["string"]),d=(e,n,t={})=>{(0,i.w)(e,"_label",(e=>"string"==typeof e),c,n,function(e){var n;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(n,t,o,l)=>{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(n,t,o,l)),"string"==typeof n&&!1===s(n,3)&&!1===r(n)&&(0,i.a)(`The heading or label ("${n}") is not accessible. A label should consist of at least three readable characters.`),"string"==typeof n&&n.length>80&&(0,i.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(n=e.hooks)||void 0===n?void 0:n.beforePatch}})}(t))},h=d},7688:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(5800);const o=(e,n,t)=>{(0,i.b)(e,"_open",n,t)}},5687:(e,n,t)=>{t.d(n,{b:()=>a,h:()=>o,p:()=>i,s:()=>l});let i="development";try{i="production"}catch(e){i="production"}const o=(e,n,t)=>{if(e&&n&&"string"==typeof t){const i=e.querySelector(`[slot="${t}"]`);i&&n.appendChild(i)}},l=e=>""===e,a=(e,n)=>e||n||""},4600:(e,n,t)=>{function i(e,n){var t={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&n.indexOf(i)<0&&(t[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(i=Object.getOwnPropertySymbols(e);o<i.length;o++)n.indexOf(i[o])<0&&Object.prototype.propertyIsEnumerable.call(e,i[o])&&(t[i[o]]=e[i[o]])}return t}t.d(n,{_:()=>i}),"function"==typeof SuppressedError&&SuppressedError},8228:(e,n,t)=>{t.d(n,{w:()=>l});var i=t(1074),o=t(5800);const l=(e,n)=>{(0,o.w)(e,"_level",(e=>"number"==typeof e&&i.h.includes(e)),new Set([`Number {${i.h.join(", ")}`]),n,{defaultValue:1,required:!0})}}}]);

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],{3364:(t,n,e)=>{e.d(n,{K:()=>h});var o=e(4600),a=e(6970),i=e(9060),s=e(3584),l=e(7767),r=e(4916);const c=({ariaLabel:t,icon:n})=>(0,a.h)(l.d,{class:"kol-alert__heading-icon",_label:t,_icons:n}),d=({type:t,label:n})=>{switch(t){case"error":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-error"),icon:"codicon codicon-error",label:n});case"info":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-info"),icon:"codicon codicon-info",label:n});case"warning":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-warning"),icon:"codicon codicon-warning",label:n});case"success":return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-success"),icon:"codicon codicon-pass",label:n});default:return(0,a.h)(c,{ariaLabel:(0,s.t)("kol-message"),icon:"codicon codicon-comment",label:n})}},h=(t,n)=>{var e,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===(e=navigator.userActivation)||void 0===e?void 0:e.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"},n)),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"},n))}},4916:(t,n,e)=>{e.d(n,{K:()=>d});var o=e(4600),a=e(6970),i=e(9060);const s=1;function l(t){return function(t){return t>=s&&t<=6}(t)?`h${t}`:"strong"}const r=(t,n)=>{var{class:e,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}`,e)},d),n)},c=(t,n)=>{var{class:e,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",e)},c),n)},d=(t,n)=>{var{secondaryHeadline:e,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(!e)return(0,a.h)(r,Object.assign({class:(0,i.c)(d,"kol-headline--single")},p),n);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),n),(0,a.h)(c,Object.assign({level:l},u),e))}},9060:(t,n,e)=>{function o(t){var n,e,a="";if("string"==typeof t||"number"==typeof t)a+=t;else if("object"==typeof t)if(Array.isArray(t)){var i=t.length;for(n=0;n<i;n++)t[n]&&(e=o(t[n]))&&(a&&(a+=" "),a+=e)}else for(e in t)t[e]&&(a&&(a+=" "),a+=e);return a}function a(){for(var t,n,e=0,a="",i=arguments.length;e<i;e++)(t=arguments[e])&&(n=o(t))&&(a&&(a+=" "),a+=n);return a}e.d(n,{c:()=>a})},8125:(t,n,e)=>{e.d(n,{i:()=>l,n:()=>c,r:()=>r});var o=e(6970),a=e(5687),i=e(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 n=t.getAttribute("content");"string"==typeof n&&((0,i.s)(n.includes("dev-mode=true")),(0,i.b)(n.includes("experimental-mode=true")),(0,i.c)(n.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,n,e)=>{e.d(n,{t:()=>i});var o=e(8461),a=e(5687);let i=(t,n)=>{var e;return(null!==(e=(0,o.g)())&&void 0!==e?e:(0,o.i)("de")).translate(t,n)};"test"===a.p&&(i=t=>t)},5151:(t,n,e)=>{e.r(n),e.d(n,{kol_toast_container:()=>u});var o=e(6970),a=e(3584),i=e(8125),s=e(7767),l=e(4600),r=e(9060),c=e(3364),d=(t,n,e)=>new Promise(((o,a)=>{var i=t=>{try{l(e.next(t))}catch(t){a(t)}},s=t=>{try{l(e.throw(t))}catch(t){a(t)}},l=t=>t.done?o(t.value):Promise.resolve(t.value).then(i,s);l((e=e.apply(t,n)).next())}));const h=t=>{var{status:n,toast:e,onClose:a}=t,i=(0,l._)(t,["status","toast","onClose"]);const{type:s,label:d,description:h,variant:u}=e;return(0,o.h)("div",{class:(0,r.c)("kol-toast-item",`kol-toast-item--${n}`)},(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 n={toast:t,status:"adding",id:`toast-${(0,i.n)()}`};return this.state=Object.assign(Object.assign({},this.state),{_toastStates:[n,...this.state._toastStates]}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map((t=>t.id===n.id&&"removing"!==t.status?Object.assign(Object.assign({},t),{status:"settled"}):t))})}),300),()=>{this.handleClose(n)}}))}handleClose(t){this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map((n=>(n.id===t.id&&(n.status="removing"),n)))}),setTimeout((()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.filter((n=>n.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((n=>t.every((t=>t.id!==n.id))))})}),300)}}))}handleToastRef(t,n){n&&"function"==typeof t.toast.render&&!this.knownRenderFunctions.has(t.toast.render)&&(this.knownRenderFunctions.add(t.toast.render),t.toast.render(n,{close:()=>this.handleClose(t)}))}render(){return(0,o.h)(o.H,{key:"4665e5c74b7af7edbc1ab32b84bd70af54dd8f34",class:"kol-toast-container"},this.state._toastStates.length>1&&(0,o.h)(s.i,{key:"b7d90bafabb41dc660585ada9d7573c5bc7c1818",_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:n=>this.handleToastRef(t,n),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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .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,n,e)=>{e.d(n,{b:()=>s,h:()=>a,p:()=>o,s:()=>i});let o="development";try{o="production"}catch(t){o="production"}const a=(t,n,e)=>{if(t&&n&&"string"==typeof e){const o=t.querySelector(`[slot="${e}"]`);o&&n.appendChild(o)}},i=t=>""===t,s=(t,n)=>t||n||""},4600:(t,n,e)=>{function o(t,n){var e={};for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&n.indexOf(o)<0&&(e[o]=t[o]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(t);a<o.length;a++)n.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(t,o[a])&&(e[o[a]]=t[o[a]])}return e}e.d(n,{_:()=>o}),"function"==typeof SuppressedError&&SuppressedError}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5151],{8101:(t,e,n)=>{n.d(e,{K:()=>h});var o=n(4600),a=n(5630),i=n(9060),s=n(3584),l=n(7767),r=n(3849);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))}},3849:(t,e,n)=>{n.d(e,{K:()=>d});var o=n(4600),a=n(5630),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})},4879:(t,e,n)=>{n.d(e,{i:()=>l,n:()=>c,r:()=>r});var o=n(5630),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(5630),a=n(3584),i=n(4879),s=n(7767),l=n(4600),r=n(9060),c=n(8101),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:"603050406b54aa7d5f2a48bb3ab477365474ecf8",class:"kol-toast-container"},this.state._toastStates.length>1&&(0,o.h)(s.i,{key:"56c9bb464828a2052f1d6b9f2cd7920fe7e12a01",_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],{9818:(e,t,n)=>{n.d(t,{K:()=>r,a:()=>s});var i=n(4600),o=n(6970),a=n(5278);const l=e=>{const{ariaDescribedBy:t,hideLabel:n,label:l,suggestions:s,value:r}=e,d=(0,i._)(e,["ariaDescribedBy","hideLabel","label","suggestions","value"]),c=Object.assign(Object.assign({type:"text",list:s?`${d.id}-list`:void 0},(0,a.g)({ariaDescribedBy:t,hideLabel:n,label:l})),d);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},c,{value:r})),s)},s=e=>{var{id:t,suggestions:n}=e,a=(0,i._)(e,["id","suggestions"]);return n?(0,o.h)("datalist",Object.assign({id:`${t}-list`},a),n.map((e=>(0,o.h)("option",{value:e})))):null},r=e=>{var{state:t}=e,n=(0,i._)(e,["state"]);return(0,o.h)(l,Object.assign({},function(e){const{ariaDescribedBy:t}=(0,a.a)(e),n={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:t};return"_type"in e&&(n.type=e._type),"_value"in e&&(n.value=e._value),"_required"in e&&(n.required=e._required),"_maxLength"in e&&(n.maxlength=e._maxLength),"_placeholder"in e&&(n.placeholder=e._placeholder),"_autoComplete"in e&&(n.autoComplete=e._autoComplete),"_spellCheck"in e&&(n.spellcheck=e._spellCheck),"_pattern"in e&&(n.pattern=e._pattern),"_readOnly"in e&&(n.readOnly=e._readOnly),"_min"in e&&(n.min=e._min),"_max"in e&&(n.max=e._max),"_step"in e&&(n.step=e._step),"_multiple"in e&&(n.multiple=e._multiple),"_checked"in e&&(n.checked=e._checked),"_indeterminate"in e&&(n.indeterminate=e._indeterminate),"_suggestions"in e&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(n.suggestions=(0,o.h)(s,{id:e._id,suggestions:e._suggestions})),n}(t),n))}},4657:(e,t,n)=>{n.d(t,{I:()=>r,a:()=>d});var i=n(975),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)}}},975:(e,t,n)=>{n.d(t,{I:()=>s});var i=n(5800),o=n(6809),a=n(1166);const l=["default","visibility-toggle"];class s extends o.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,i.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,i.w)(e,"_variant",(e=>"string"==typeof e&&l.includes(e)),new Set(l),t)})(this.component,e)}validateMaxLength(e){(0,i.k)(this.component,"_maxLength",e,{hooks:{afterPatch:this.afterSyncCharCounter},min:0})}validatePattern(e){(0,i.i)(this.component,"_pattern",e)}validatePlaceholder(e){(0,i.i)(this.component,"_placeholder",e)}validateReadOnly(e){(0,i.b)(this.component,"_readOnly",e)}validateRequired(e){(0,i.b)(this.component,"_required",e)}validateValue(e){(0,i.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)}}},2909:(e,t,n)=>{n.d(t,{a:()=>s,p:()=>r});var i=n(7767),o=n(5800),a=n(1732);const l=e=>{for((0,a.a)()&&((0,o.j)("↓ Search form element start."),a.L.debug(e));e instanceof HTMLElement&&"FORM"!==e.tagName&&e.tagName!==i.h.toUpperCase();){try{e=e.parentElement instanceof HTMLElement?e.parentElement:e.parentNode instanceof ShadowRoot?e.parentNode.host:null}catch(e){}(0,a.a)()&&(a.L.debug(e),(0,o.j)("↑ Search form element finished."))}return e},s=(e={})=>{var t,n;const a=l(e.form);if(a instanceof HTMLElement){const e=new Event("reset",{bubbles:!0,cancelable:!0});if("FORM"===a.tagName)(0,o.q)(e,a),a.dispatchEvent(e);else if(a.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",a));const i=a;"function"==typeof(null===(t=i._on)||void 0===t?void 0:t.onReset)&&(null===(n=i._on)||void 0===n||n.onReset(e))}}},r=(e={})=>{const t=l(e.form);if(t instanceof HTMLElement){const e=new SubmitEvent("submit",{bubbles:!0,cancelable:!0,submitter:t});if("FORM"===t.tagName)(0,a.a)()&&!1===t.noValidate&&(0,o.j)("If you have not focusable or hidden form fields in your form, you should enable noValidate for your form.",{force:!0}),setTimeout((()=>{"function"==typeof t.requestSubmit?t.requestSubmit():((0,o.q)(e,t),t.dispatchEvent(e))}));else if(t.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",t));const n=t;setTimeout((()=>{var t,i;"function"==typeof(null===(t=n._on)||void 0===t?void 0:t.onSubmit)&&(null===(i=n._on)||void 0===i||i.onSubmit(e))}))}}}},1166:(e,t,n)=>{n.d(t,{v:()=>o});var i=n(5800);const o=(e,t,n)=>{(0,i.b)(e,"_hasCounter",t,n)}},5171:(e,t,n)=>{n.r(t),n.d(t,{kol_input_email:()=>m});var i=n(6970),o=n(9060),a=n(8125),l=n(2909),s=n(4657),r=n(5800),d=n(2940),c=n(9818),h=n(5278),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:"33f8bcbb475cff0bafe8c77dbb761e002f3cd0dd"},this.getFormFieldProps()),(0,i.h)(d.K,{key:"c879be47efd808e2830fe4a73afb4fad3bdd87dc",state:this.state},(0,i.h)(c.K,Object.assign({key:"cfca5fdaa7498ed1d97b1483bcd79258a8ca0b71"},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._hideError=!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,_hideError:!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)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}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"],_hideError:["validateHideError"],_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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .required label > span::after,\n  .required legend > span::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  input,\n  textarea {\n    cursor: text;\n  }\n  input[type=checkbox],\n  input[type=color],\n  input[type=file],\n  input[type=radio],\n  input[type=range],\n  label,\n  option,\n  select {\n    cursor: pointer;\n  }\n  /* input[type='checkbox'], */\n  /* input[type='radio'], */\n  /* input[type='range'], */\n  input[type=color],\n  input[type=date],\n  input[type=datetime-local],\n  input[type=email],\n  input[type=file],\n  input[type=month],\n  input[type=number],\n  input[type=password],\n  input[type=search],\n  input[type=tel],\n  input[type=text],\n  input[type=time],\n  input[type=url],\n  input[type=week],\n  select,\n  select[multiple] option,\n  textarea {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: 100%;\n  }\n  /* needed hack for vertical alignment */\n  input[type=file] {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n  /* needed hack for vertical alignment */\n  select[multiple] option {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n  }\n  .input {\n    background-color: white;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    display: grid;\n  }\n  .kol-input .input-slot {\n    flex-grow: 1;\n  }\n  input:not([type=checkbox], [type=radio]),\n  select:not([multiple], [size]) {\n    height: 2.75em;\n  }\n  input:focus,\n  option:focus,\n  select:focus,\n  textarea:focus {\n    outline: 0;\n  }\n  .input {\n    display: flex;\n    align-items: center;\n  }\n  .input > .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n  .kol-input.required .input-tooltip .kol-span__label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .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    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\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],{9248:(e,t,n)=>{n.d(t,{K:()=>r});var i=n(4600),o=n(5630),a=n(9060),l=n(3532),s=n(9339);const r=e=>{const{class:t,msg:n,required:r,disabled:d,touched:c,readonly:h,ariaDescribedBy:u,hideLabel:p,label:m,suggestions:v,value:_}=e,f=(0,i._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),b=(0,s.c)(n,c),g={"kol-input--disabled":Boolean(d),"kol-input--required":Boolean(r),"kol-input--touched":Boolean(c),"kol-input--readonly":Boolean(h),[`kol-input--${(null==n?void 0:n.type)||"error"}`]:b},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",g,t),required:r,disabled:d,readonly:h,type:"text",list:v?`${f.id}-list`:void 0},(0,l.d)({ariaDescribedBy:u,hideLabel:p,label:m})),f);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},y,{value:_})),v)}},7260:(e,t,n)=>{n.d(t,{K:()=>d,a:()=>r});var i=n(4600),o=n(5630),a=n(3532),l=n(9248),s=n(9339);const r=e=>{var{id:t,suggestions:n}=e,a=(0,i._)(e,["id","suggestions"]);return n?(0,o.h)("datalist",Object.assign({id:`${t}-list`},a),n.map((e=>(0,o.h)("option",{value:e})))):null},d=e=>{var{state:t}=e,n=(0,i._)(e,["state"]);return(0,o.h)(l.K,Object.assign({},function(e){const{ariaDescribedBy:t}=(0,a.g)(e),n={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:t};return"_type"in e&&(n.type=e._type),"_value"in e&&(n.value=e._value),"_required"in e&&(n.required=e._required),"_maxLength"in e&&(n.maxlength=e._maxLength),"_placeholder"in e&&(n.placeholder=e._placeholder),"_autoComplete"in e&&(n.autoComplete=e._autoComplete),"_spellCheck"in e&&(n.spellcheck=e._spellCheck),"_pattern"in e&&(n.pattern=e._pattern),"_readOnly"in e&&(n.readonly=e._readOnly),"_min"in e&&(n.min=e._min),"_max"in e&&(n.max=e._max),"_step"in e&&(n.step=e._step),"_multiple"in e&&(n.multiple=e._multiple),"_checked"in e&&(n.checked=e._checked),"_indeterminate"in e&&(n.indeterminate=e._indeterminate),"_touched"in e&&(n.touched=e._touched),"_msg"in e&&(n.msg=(0,s.a)(e._msg)),"_suggestions"in e&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(n.suggestions=(0,o.h)(r,{id:e._id,suggestions:e._suggestions})),n}(t),n))}},840:(e,t,n)=>{n.d(t,{I:()=>r,a:()=>d});var i=n(1371),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)}}},1371:(e,t,n)=>{n.d(t,{I:()=>s});var i=n(5800),o=n(6100),a=n(1166);const l=["default","visibility-toggle"];class s extends o.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,i.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,i.w)(e,"_variant",(e=>"string"==typeof e&&l.includes(e)),new Set(l),t)})(this.component,e)}validateMaxLength(e){(0,i.k)(this.component,"_maxLength",e,{hooks:{afterPatch:this.afterSyncCharCounter},min:0})}validatePattern(e){(0,i.i)(this.component,"_pattern",e)}validatePlaceholder(e){(0,i.i)(this.component,"_placeholder",e)}validateReadOnly(e){(0,i.b)(this.component,"_readOnly",e)}validateRequired(e){(0,i.b)(this.component,"_required",e)}validateValue(e){(0,i.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)}}},2909:(e,t,n)=>{n.d(t,{a:()=>s,p:()=>r});var i=n(7767),o=n(5800),a=n(1732);const l=e=>{for((0,a.a)()&&((0,o.j)("↓ Search form element start."),a.L.debug(e));e instanceof HTMLElement&&"FORM"!==e.tagName&&e.tagName!==i.h.toUpperCase();){try{e=e.parentElement instanceof HTMLElement?e.parentElement:e.parentNode instanceof ShadowRoot?e.parentNode.host:null}catch(e){}(0,a.a)()&&(a.L.debug(e),(0,o.j)("↑ Search form element finished."))}return e},s=(e={})=>{var t,n;const a=l(e.form);if(a instanceof HTMLElement){const e=new Event("reset",{bubbles:!0,cancelable:!0});if("FORM"===a.tagName)(0,o.q)(e,a),a.dispatchEvent(e);else if(a.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",a));const i=a;"function"==typeof(null===(t=i._on)||void 0===t?void 0:t.onReset)&&(null===(n=i._on)||void 0===n||n.onReset(e))}}},r=(e={})=>{const t=l(e.form);if(t instanceof HTMLElement){const e=new SubmitEvent("submit",{bubbles:!0,cancelable:!0,submitter:t});if("FORM"===t.tagName)(0,a.a)()&&!1===t.noValidate&&(0,o.j)("If you have not focusable or hidden form fields in your form, you should enable noValidate for your form.",{force:!0}),setTimeout((()=>{"function"==typeof t.requestSubmit?t.requestSubmit():((0,o.q)(e,t),t.dispatchEvent(e))}));else if(t.tagName===i.h.toUpperCase()){(0,o.q)(e,o.K.querySelector("form",t));const n=t;setTimeout((()=>{var t,i;"function"==typeof(null===(t=n._on)||void 0===t?void 0:t.onSubmit)&&(null===(i=n._on)||void 0===i||i.onSubmit(e))}))}}}},1166:(e,t,n)=>{n.d(t,{v:()=>o});var i=n(5800);const o=(e,t,n)=>{(0,i.b)(e,"_hasCounter",t,n)}},5171:(e,t,n)=>{n.r(t),n.d(t,{kol_input_email:()=>m});var i=n(5630),o=n(9060),a=n(4879),l=n(2909),s=n(840),r=n(5800),d=n(1559),c=n(7260),h=n(3532),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:"3be7be530b947f873a12a5e709d6566af1f8d634"},this.getFormFieldProps()),(0,i.h)(d.K,{key:"40be1658fd7da6e647e6165e34653d4e7a3d9122",state:this.state},(0,i.h)(c.K,Object.assign({key:"fbd27a670f47acf6fb594ed89019acb7eb2b7866"},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._hideError=!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,_hideError:!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)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}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"],_hideError:["validateHideError"],_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__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/5792.js

@@ -1,2 +1,2 @@
 /*! For license information please see 5792.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5792],{3584:(t,e,a)=>{a.d(e,{t:()=>s});var l=a(8461),o=a(5687);let s=(t,e)=>{var a;return(null!==(a=(0,l.g)())&&void 0!==a?a:(0,l.i)("de")).translate(t,e)};"test"===o.p&&(s=t=>t)},5792:(t,e,a)=>{a.r(e),a.d(e,{kol_symbol:()=>i});var l=a(6970),o=a(3584),s=a(1074),r=a(5800);const i=class{constructor(t){(0,l.r)(this,t),this._label=void 0,this._symbol=void 0,this.state={_label:(0,o.t)("kol-warning"),_symbol:""}}render(){return(0,l.h)(l.H,{key:"a51efd25bdc3ff1db626dfd2b47f50b6c80484fd",class:"kol-symbol"},(0,l.h)("span",{key:"0d4e4eba09bc549ca887e643c18a13b111bc4be5","aria-label":this.state._label,role:"term"},this.state._symbol))}validateLabel(t){(0,s.v)(this,t,{required:!0})}validateSymbol(t){(0,r.i)(this,"_symbol",t,{required:!0})}componentWillLoad(){this.validateLabel(this._label),this.validateSymbol(this._symbol)}static get watchers(){return{_label:["validateLabel"],_symbol:["validateSymbol"]}}}},1074:(t,e,a)=>{a.d(e,{a:()=>d,b:()=>i,c:()=>n,h:()=>o,v:()=>b});var l=a(5800);const o=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,r=/^\d+$/;function i(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(s))||void 0===e?void 0:e.length)||0}(t)>=e}function n(t){return r.test(t)}const c=new Set(["string"]),b=(t,e,a={})=>{(0,l.w)(t,"_label",(t=>"string"==typeof t),c,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,a,o,s)=>{var r,c;"function"==typeof(null===(r=t.hooks)||void 0===r?void 0:r.afterPatch)&&(null===(c=t.hooks)||void 0===c||c.afterPatch(e,a,o,s)),"string"==typeof e&&!1===i(e,3)&&!1===n(e)&&(0,l.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,l.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(a))},d=b},5687:(t,e,a)=>{a.d(e,{b:()=>r,h:()=>o,p:()=>l,s:()=>s});let l="development";try{l="production"}catch(t){l="production"}const o=(t,e,a)=>{if(t&&e&&"string"==typeof a){const l=t.querySelector(`[slot="${a}"]`);l&&e.appendChild(l)}},s=t=>""===t,r=(t,e)=>t||e||""}}]);
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[5792],{3584:(e,t,a)=>{a.d(t,{t:()=>s});var l=a(8461),o=a(5687);let s=(e,t)=>{var a;return(null!==(a=(0,l.g)())&&void 0!==a?a:(0,l.i)("de")).translate(e,t)};"test"===o.p&&(s=e=>e)},5792:(e,t,a)=>{a.r(t),a.d(t,{kol_symbol:()=>i});var l=a(5630),o=a(3584),s=a(1074),r=a(5800);const i=class{constructor(e){(0,l.r)(this,e),this._label=void 0,this._symbol=void 0,this.state={_label:(0,o.t)("kol-warning"),_symbol:""}}render(){return(0,l.h)(l.H,{key:"2aeed4aecded7debd64cec5622e9ff5875a41fe7",class:"kol-symbol"},(0,l.h)("span",{key:"f8fd7c4233896ade7b659b47ed5ea4832c839e3f","aria-label":this.state._label,role:"term"},this.state._symbol))}validateLabel(e){(0,s.v)(this,e,{required:!0})}validateSymbol(e){(0,r.i)(this,"_symbol",e,{required:!0})}componentWillLoad(){this.validateLabel(this._label),this.validateSymbol(this._symbol)}static get watchers(){return{_label:["validateLabel"],_symbol:["validateSymbol"]}}}},1074:(e,t,a)=>{a.d(t,{a:()=>h,b:()=>i,c:()=>n,h:()=>o,v:()=>d});var l=a(5800);const o=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,r=/^\d+$/;function i(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 n(e){return r.test(e)}const c=new Set(["string"]),d=(e,t,a={})=>{(0,l.w)(e,"_label",(e=>"string"==typeof e),c,t,function(e){var t;return Object.assign(Object.assign({},e),{hooks:{afterPatch:(t,a,o,s)=>{var r,c;"function"==typeof(null===(r=e.hooks)||void 0===r?void 0:r.afterPatch)&&(null===(c=e.hooks)||void 0===c||c.afterPatch(t,a,o,s)),"string"==typeof t&&!1===i(t,3)&&!1===n(t)&&(0,l.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,l.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(t=e.hooks)||void 0===t?void 0:t.beforePatch}})}(a))},h=d},5687:(e,t,a)=>{a.d(t,{b:()=>r,h:()=>o,p:()=>l,s:()=>s});let l="development";try{l="production"}catch(e){l="production"}const o=(e,t,a)=>{if(e&&t&&"string"==typeof a){const l=e.querySelector(`[slot="${a}"]`);l&&t.appendChild(l)}},s=e=>""===e,r=(e,t)=>e||t||""}}]);

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],{9818:(e,n,t)=>{t.d(n,{K:()=>r,a:()=>s});var i=t(4600),o=t(6970),a=t(5278);const l=e=>{const{ariaDescribedBy:n,hideLabel:t,label:l,suggestions:s,value:r}=e,d=(0,i._)(e,["ariaDescribedBy","hideLabel","label","suggestions","value"]),c=Object.assign(Object.assign({type:"text",list:s?`${d.id}-list`:void 0},(0,a.g)({ariaDescribedBy:n,hideLabel:t,label:l})),d);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},c,{value:r})),s)},s=e=>{var{id:n,suggestions:t}=e,a=(0,i._)(e,["id","suggestions"]);return t?(0,o.h)("datalist",Object.assign({id:`${n}-list`},a),t.map((e=>(0,o.h)("option",{value:e})))):null},r=e=>{var{state:n}=e,t=(0,i._)(e,["state"]);return(0,o.h)(l,Object.assign({},function(e){const{ariaDescribedBy:n}=(0,a.a)(e),t={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:n};return"_type"in e&&(t.type=e._type),"_value"in e&&(t.value=e._value),"_required"in e&&(t.required=e._required),"_maxLength"in e&&(t.maxlength=e._maxLength),"_placeholder"in e&&(t.placeholder=e._placeholder),"_autoComplete"in e&&(t.autoComplete=e._autoComplete),"_spellCheck"in e&&(t.spellcheck=e._spellCheck),"_pattern"in e&&(t.pattern=e._pattern),"_readOnly"in e&&(t.readOnly=e._readOnly),"_min"in e&&(t.min=e._min),"_max"in e&&(t.max=e._max),"_step"in e&&(t.step=e._step),"_multiple"in e&&(t.multiple=e._multiple),"_checked"in e&&(t.checked=e._checked),"_indeterminate"in e&&(t.indeterminate=e._indeterminate),"_suggestions"in e&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(t.suggestions=(0,o.h)(s,{id:e._id,suggestions:e._suggestions})),t}(n),t))}},5876:(e,n,t)=>{t.r(n),t.d(n,{kol_input_color:()=>m});var i=t(6970),o=t(8125),a=t(6809),l=t(623),s=t(5800),r=t(2940),d=t(9818),c=t(5278),u=(e,n,t)=>new Promise(((i,o)=>{var a=e=>{try{s(t.next(e))}catch(e){o(e)}},l=e=>{try{s(t.throw(e))}catch(e){o(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(a,l);s((t=t.apply(e,n)).next())}));const h=["on","off"];class p extends a.I{constructor(e,n,t){super(e,n,t),this.component=e}validateAutoComplete(e){(0,s.w)(this.component,"_autoComplete",(e=>"string"==typeof e&&h.includes(e)),new Set(h),e)}validateSuggestions(e){(0,l.v)(this.component,e)}validateValue(e){(0,s.i)(this.component,"_value",e),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 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:"kol-input-color color",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,type:"color",slot:"input",state:this.state},this.controller.onFacade),{onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput})}render(){return(0,i.h)(c.K,Object.assign({key:"4dfe9bf7af2b4dbe95072f1ed9261b4fc6aa5087"},this.getFormFieldProps()),(0,i.h)(r.K,{key:"06837921cdd8ce6826ba80d716047000ab749f58",state:this.state},(0,i.h)(d.K,Object.assign({key:"bbacb6178291cfc2d0b13323e97bbbab04e656d4"},this.getInputProps()))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onBlur=e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1},this.onFocus=e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},this.onInput=e=>{var n,t;this._value=null!==(t=null===(n=this.inputRef)||void 0===n?void 0:n.value)&&void 0!==t?t:"",this.controller.onFacade.onInput(e)},this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._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",_hideError:!1,_id:`id-${(0,o.n)()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new p(this,"color",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)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateSuggestions(e){this.controller.validateSuggestions(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hideError:["validateHideError"],_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"]}}};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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    animation-duration: 0.5s;\n    animation-iteration-count: 1;\n    animation-name: fadeInOpacity;\n    animation-timing-function: ease-in;\n    box-sizing: border-box;\n    display: none;\n    position: fixed;\n    visibility: hidden;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    max-width: 90vw;\n    max-height: 90vh;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width);\n  }\n  .kol-tooltip__arrow {\n    background-color: #fff;\n    color: #000;\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\n    position: absolute;\n    transform: rotate(45deg);\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\n    z-index: 999;\n  }\n  .kol-tooltip__content {\n    background-color: #fff;\n    color: #000;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes fadeInOpacity {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .required label > span::after,\n  .required legend > span::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\n  input,\n  textarea {\n    cursor: text;\n  }\n  input[type=checkbox],\n  input[type=color],\n  input[type=file],\n  input[type=radio],\n  input[type=range],\n  label,\n  option,\n  select {\n    cursor: pointer;\n  }\n  /* input[type='checkbox'], */\n  /* input[type='radio'], */\n  /* input[type='range'], */\n  input[type=color],\n  input[type=date],\n  input[type=datetime-local],\n  input[type=email],\n  input[type=file],\n  input[type=month],\n  input[type=number],\n  input[type=password],\n  input[type=search],\n  input[type=tel],\n  input[type=text],\n  input[type=time],\n  input[type=url],\n  input[type=week],\n  select,\n  select[multiple] option,\n  textarea {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: 100%;\n  }\n  /* needed hack for vertical alignment */\n  input[type=file] {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\n  }\n  /* needed hack for vertical alignment */\n  select[multiple] option {\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\n  }\n  .input {\n    background-color: white;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    display: grid;\n  }\n  .kol-input .input-slot {\n    flex-grow: 1;\n  }\n  input:not([type=checkbox], [type=radio]),\n  select:not([multiple], [size]) {\n    height: 2.75em;\n  }\n  input:focus,\n  option:focus,\n  select:focus,\n  textarea:focus {\n    outline: 0;\n  }\n  .input {\n    display: flex;\n    align-items: center;\n  }\n  .input > .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n  .kol-input.required .input-tooltip .kol-span__label::after {\n    content: \"*\";\n  }\n}\n@layer kol-component {\n  .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    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  div.input {\n    cursor: pointer;\n  }\n}"}},623:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(5800);const o=(e,n)=>{(0,i.g)(e,"_suggestions",(e=>"string"==typeof e||"number"==typeof e),n,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([[5876],{9248:(e,n,t)=>{t.d(n,{K:()=>r});var i=t(4600),o=t(5630),a=t(9060),l=t(3532),s=t(9339);const r=e=>{const{class:n,msg:t,required:r,disabled:d,touched:c,readonly:h,ariaDescribedBy:u,hideLabel:p,label:m,suggestions:v,value:b}=e,_=(0,i._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),f=(0,s.c)(t,c),g={"kol-input--disabled":Boolean(d),"kol-input--required":Boolean(r),"kol-input--touched":Boolean(c),"kol-input--readonly":Boolean(h),[`kol-input--${(null==t?void 0:t.type)||"error"}`]:f},y=Object.assign(Object.assign({class:(0,a.c)("kol-input",g,n),required:r,disabled:d,readonly:h,type:"text",list:v?`${_.id}-list`:void 0},(0,l.d)({ariaDescribedBy:u,hideLabel:p,label:m})),_);return(0,o.h)(o.F,null,(0,o.h)("input",Object.assign({},y,{value:b})),v)}},7260:(e,n,t)=>{t.d(n,{K:()=>d,a:()=>r});var i=t(4600),o=t(5630),a=t(3532),l=t(9248),s=t(9339);const r=e=>{var{id:n,suggestions:t}=e,a=(0,i._)(e,["id","suggestions"]);return t?(0,o.h)("datalist",Object.assign({id:`${n}-list`},a),t.map((e=>(0,o.h)("option",{value:e})))):null},d=e=>{var{state:n}=e,t=(0,i._)(e,["state"]);return(0,o.h)(l.K,Object.assign({},function(e){const{ariaDescribedBy:n}=(0,a.g)(e),t={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:n};return"_type"in e&&(t.type=e._type),"_value"in e&&(t.value=e._value),"_required"in e&&(t.required=e._required),"_maxLength"in e&&(t.maxlength=e._maxLength),"_placeholder"in e&&(t.placeholder=e._placeholder),"_autoComplete"in e&&(t.autoComplete=e._autoComplete),"_spellCheck"in e&&(t.spellcheck=e._spellCheck),"_pattern"in e&&(t.pattern=e._pattern),"_readOnly"in e&&(t.readonly=e._readOnly),"_min"in e&&(t.min=e._min),"_max"in e&&(t.max=e._max),"_step"in e&&(t.step=e._step),"_multiple"in e&&(t.multiple=e._multiple),"_checked"in e&&(t.checked=e._checked),"_indeterminate"in e&&(t.indeterminate=e._indeterminate),"_touched"in e&&(t.touched=e._touched),"_msg"in e&&(t.msg=(0,s.a)(e._msg)),"_suggestions"in e&&Array.isArray(e._suggestions)&&e._suggestions.length>0&&(t.suggestions=(0,o.h)(r,{id:e._id,suggestions:e._suggestions})),t}(n),t))}},5876:(e,n,t)=>{t.r(n),t.d(n,{kol_input_color:()=>m});var i=t(5630),o=t(4879),a=t(6100),l=t(623),s=t(5800),r=t(1559),d=t(7260),c=t(3532),h=(e,n,t)=>new Promise(((i,o)=>{var a=e=>{try{s(t.next(e))}catch(e){o(e)}},l=e=>{try{s(t.throw(e))}catch(e){o(e)}},s=e=>e.done?i(e.value):Promise.resolve(e.value).then(a,l);s((t=t.apply(e,n)).next())}));const u=["on","off"];class p extends a.I{constructor(e,n,t){super(e,n,t),this.component=e}validateAutoComplete(e){(0,s.w)(this.component,"_autoComplete",(e=>"string"==typeof e&&u.includes(e)),new Set(u),e)}validateSuggestions(e){(0,l.v)(this.component,e)}validateValue(e){(0,s.i)(this.component,"_value",e),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 m=class{getValue(){return h(this,null,(function*(){var e;return null===(e=this.inputRef)||void 0===e?void 0:e.value}))}kolFocus(){return h(this,null,(function*(){var e;null===(e=this.inputRef)||void 0===e||e.focus()}))}getFormFieldProps(){return{state:this.state,class:"kol-input-color",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,type:"color",slot:"input",state:this.state},this.controller.onFacade),{onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput})}render(){return(0,i.h)(c.K,Object.assign({key:"9685b88440ba4fb5fa56d14dd3a60e6ec071e54b"},this.getFormFieldProps()),(0,i.h)(r.K,{key:"e237de181840ff7a8c03782d06b26792bf434355",state:this.state},(0,i.h)(d.K,Object.assign({key:"163688653e2b4d90a9336696486185c027dd84ed"},this.getInputProps()))))}constructor(e){(0,i.r)(this,e),this.catchRef=e=>{this.inputRef=e},this.onBlur=e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1},this.onFocus=e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},this.onInput=e=>{var n,t;this._value=null!==(t=null===(n=this.inputRef)||void 0===n?void 0:n.value)&&void 0!==t?t:"",this.controller.onFacade.onInput(e)},this._accessKey=void 0,this._autoComplete=void 0,this._disabled=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._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",_hideError:!1,_id:`id-${(0,o.n)()}`,_label:"",_suggestions:[]},this.inputHasFocus=!1,this.controller=new p(this,"color",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)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSmartButton(e){this.controller.validateSmartButton(e)}validateSuggestions(e){this.controller.validateSuggestions(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentWillLoad(){this._touched=!0===this._touched,this.controller.componentWillLoad()}static get delegatesFocus(){return!0}get host(){return(0,i.g)(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_autoComplete:["validateAutoComplete"],_disabled:["validateDisabled"],_hideError:["validateHideError"],_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"]}}};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__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n}\n@layer kol-component {\n  .kol-input {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    height: calc(44rem / var(--kolibri-root-font-size, 16));\n    min-width: var(--a11y-min-size);\n    width: 100%;\n  }\n  .kol-input:focus {\n    outline: none;\n  }\n}"}},623:(e,n,t)=>{t.d(n,{v:()=>o});var i=t(5800);const o=(e,n)=>{(0,i.g)(e,"_suggestions",(e=>"string"==typeof e||"number"==typeof e),n,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/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(6970),o=t(8231),a=t(9060),l=t(9246),s=t(5800),r=t(1074),d=t(7688),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,this._open=void 0,this._align=void 0,this._label=void 0,this._modal=void 0,this._on=void 0,this.state={_label:"",_open:!1,_align:"left"}}open(){return h(this,null,(function*(){var n,e;this.state=Object.assign(Object.assign({},this.state),{_open:!0}),this.state._modal?null===(n=this.dialogElement)||void 0===n||n.showModal():null===(e=this.dialogElement)||void 0===e||e.show()}))}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(){const n=this.state._modal;return(0,i.h)(i.H,{key:"58351f4d2f128b659f8d9d28cb99177655b82133",class:(0,a.c)("kol-drawer--modal",{"kol-drawer--modal":n})},(0,i.h)("dialog",{key:"053bbbf693182b18c2a8bb27c2fef58d0a8cd4e9",class:"kol-drawer__dialog",ref:this.getRef},this.renderDialogContent()))}validateLabel(n){(0,r.v)(this,n,{required:!0})}validateAlign(n){(0,l.v)(this,n)}validateModal(n){((n,e)=>{(0,s.b)(n,"_modal",e)})(this,n)}validateOpen(n){return h(this,null,(function*(){"boolean"==typeof n&&((0,d.v)(this,n),n?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,s.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(){return h(this,null,(function*(){this.validateLabel(this._label),yield this.validateOpen(this._open),this.validateAlign(this._align),this.validateModal(this._modal),this.validateOn(this._on)}))}get host(){return(0,i.g)(this)}static get watchers(){return{_label:["validateLabel"],_align:["validateAlign"],_modal:["validateModal"],_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  .kol-input .input {\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n  }\n}\n/**\n * Sometimes we need the semantic element for accessibility reasons,\n * but we don't want to show it.\n *\n * - https://www.a11yproject.com/posts/how-to-hide-content/\n */\n.visually-hidden {\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: calc(1rem / var(--kolibri-root-font-size, 16));\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: calc(1rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    border: none;\n    margin: 0;\n    padding: 0;\n    width: 100%; /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: grid;\n    place-items: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    place-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]:focus {\n    cursor: not-allowed;\n    opacity: 0.5;\n    outline: none;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n}\n@layer kol-component {\n  .kol-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(5630),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/6018.js

@@ -0,0 +1,2 @@
+/*! For license information please see 6018.js.LICENSE.txt */
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[6018],{8101:(e,l,o)=>{o.d(l,{K:()=>h});var t=o(4600),a=o(5630),i=o(9060),r=o(3584),n=o(7767),s=o(3849);const c=({ariaLabel:e,icon:l})=>(0,a.h)(n.d,{class:"kol-alert__heading-icon",_label:e,_icons:l}),d=({type:e,label:l})=>{switch(e){case"error":return(0,a.h)(c,{ariaLabel:(0,r.t)("kol-error"),icon:"codicon codicon-error",label:l});case"info":return(0,a.h)(c,{ariaLabel:(0,r.t)("kol-info"),icon:"codicon codicon-info",label:l});case"warning":return(0,a.h)(c,{ariaLabel:(0,r.t)("kol-warning"),icon:"codicon codicon-warning",label:l});case"success":return(0,a.h)(c,{ariaLabel:(0,r.t)("kol-success"),icon:"codicon codicon-pass",label:l});default:return(0,a.h)(c,{ariaLabel:(0,r.t)("kol-message"),icon:"codicon codicon-comment",label:l})}},h=(e,l)=>{var o,c;const{class:h={},type:u="default",variant:b="msg",label:p,hasCloser:g,alert:f,onAlertTimeout:_,onCloserClick:y,level:v}=e,m=(0,t._)(e,["class","type","variant","label","hasCloser","alert","onAlertTimeout","onCloserClick","level"]);f&&((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==_||_()}),1e4));const O=Object.assign({class:(0,i.c)("kol-alert",`kol-alert--${u}`,`kol-alert--${b}`,{"kol-alert--hasCloser":!!g},h),role:f?"alert":void 0},m);return(0,a.h)("div",Object.assign({},O),(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)(s.K,{class:"kol-alert__heading",level:v},p):null,"msg"===b&&(0,a.h)("div",{class:"kol-alert__content"},l)),g&&(0,a.h)(n.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,r.t)("kol-close-alert"),_on:{onClick:y},_tooltipAlign:"left"})),"card"===b&&(0,a.h)("div",{class:"kol-alert__content"},l))}},8715:(e,l,o)=>{o.d(l,{K:()=>h});var t=o(4600),a=o(5630),i=o(9060),r=o(3532),n=o(5687),s=o(9339);const c=(e,l)=>{var{class:o}=e,r=(0,t._)(e,["class"]);return(0,a.h)("div",Object.assign({class:(0,i.c)("kol-field-control__input",o)},r),l)},d=(e,l)=>{const{class:o,id:d,disabled:h,label:u,hideLabel:b,labelAlign:p,renderNoTooltip:g,hint:f,renderNoHint:_,tooltipAlign:y,accessKey:v,shortKey:m,msg:O,touched:k,required:j,readonly:L,fieldControlInputProps:K,fieldControlLabelProps:P,fieldControlTooltipProps:C,fieldControlHintProps:B}=e,A=(0,t._)(e,["class","id","disabled","label","hideLabel","labelAlign","renderNoTooltip","hint","renderNoHint","tooltipAlign","accessKey","shortKey","msg","touched","required","readonly","fieldControlInputProps","fieldControlLabelProps","fieldControlTooltipProps","fieldControlHintProps"]),$=!_,x=!g,q=(0,s.c)(O,k),w=(0,n.s)(u),F=x&&!w&&b,S=(0,n.b)(v,m),E=[(0,a.h)(a.F,null,(0,a.h)(c,Object.assign({},K),l),F&&(0,a.h)(r.a,Object.assign({},C||{},{id:d,label:u,hideLabel:b,align:y,badgeText:S}))),(0,a.h)(r.b,Object.assign({},P||{},{id:d,baseClassName:"kol-field-control",class:(0,i.c)(null==P?void 0:P.class,{"kol-field-control__label--visually-hidden":Boolean(b)}),hasExpertSlot:w,label:u,accessKey:v,shortKey:m}))];"left"===p&&E.reverse();const T={"kol-field-control--disabled":Boolean(h),"kol-field-control--required":Boolean(j),"kol-field-control--touched":Boolean(k),"kol-field-control--hide-label":Boolean(b),"kol-field-control--read-only":Boolean(L),[`kol-field-control--${(null==O?void 0:O.type)||"error"}`]:Boolean(q),[`kol-field-control--label-align-${p}`]:Boolean(p)};return(0,a.h)("div",Object.assign({class:(0,i.c)("kol-field-control",T,o)},A),E,$&&(0,a.h)(r.c,Object.assign({},B||{},{baseClassName:"kol-field-control",id:d,hint:f})))},h=(e,l)=>{var{state:o}=e,i=(0,t._)(e,["state"]);return(0,a.h)(d,Object.assign({},function(e){const l={accessKey:e._accessKey,shortKey:e._shortKey,id:e._id,disabled:e._disabled,msg:(0,s.a)(e._msg),hint:e._hint,label:e._label,hideLabel:e._hideLabel,touched:e._touched};return"_required"in e&&(l.required=e._required),"_readOnly"in e&&(l.readonly=e._readOnly),"_labelAlign"in e&&(l.labelAlign=e._labelAlign),l}(o),i),l)}},5924:(e,l,o)=>{o.d(l,{K:()=>n});var t=o(4600),a=o(9060),i=o(5630),r=o(8101);const n=e=>{var{alert:l,msg:o,hideError:n,id:s,class:c}=e,d=(0,t._)(e,["alert","msg","hideError","id","class"]);return(0,i.h)(r.K,Object.assign({id:`${s}-msg`,alert:l,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)}},3849:(e,l,o)=>{o.d(l,{K:()=>d});var t=o(4600),a=o(5630),i=o(9060);const r=1;function n(e){return function(e){return e>=r&&e<=6}(e)?`h${e}`:"strong"}const s=(e,l)=>{var{class:o,level:s=r,variant:c}=e,d=(0,t._)(e,["class","level","variant"]);const h=n(s),u=c||h;return(0,a.h)(h,Object.assign({class:(0,i.c)("kol-headline",`kol-headline--${u}`,o)},d),l)},c=(e,l)=>{var{class:o,level:s=r}=e,c=(0,t._)(e,["class","level"]);const d=function(e){return 1===e?"span":n(e)}(s+1);return(0,a.h)(d,Object.assign({class:(0,i.c)("kol-headline kol-headline--group kol-headline--secondary",o)},c),l)},d=(e,l)=>{var{secondaryHeadline:o,level:n=r,class:d,HeadingGroupProps:h={},SecondaryHeadlineProps:u={}}=e,b=(0,t._)(e,["secondaryHeadline","level","class","HeadingGroupProps","SecondaryHeadlineProps"]);const p=Object.assign({level:n},b);if(!o)return(0,a.h)(s,Object.assign({class:(0,i.c)(d,"kol-headline--single")},p),l);const{class:g}=h,f=(0,t._)(h,["class"]),_=Object.assign({class:(0,i.c)("kol-heading-group",g)},f);return(0,a.h)("hgroup",Object.assign({},_),(0,a.h)(s,Object.assign({class:(0,i.c)(d,"kol-headline--group","kol-headline--primary")},p),l),(0,a.h)(c,Object.assign({level:n},u),o))}},9248:(e,l,o)=>{o.d(l,{K:()=>s});var t=o(4600),a=o(5630),i=o(9060),r=o(3532),n=o(9339);const s=e=>{const{class:l,msg:o,required:s,disabled:c,touched:d,readonly:h,ariaDescribedBy:u,hideLabel:b,label:p,suggestions:g,value:f}=e,_=(0,t._)(e,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),y=(0,n.c)(o,d),v={"kol-input--disabled":Boolean(c),"kol-input--required":Boolean(s),"kol-input--touched":Boolean(d),"kol-input--readonly":Boolean(h),[`kol-input--${(null==o?void 0:o.type)||"error"}`]:y},m=Object.assign(Object.assign({class:(0,i.c)("kol-input",v,l),required:s,disabled:c,readonly:h,type:"text",list:g?`${_.id}-list`:void 0},(0,r.d)({ariaDescribedBy:u,hideLabel:b,label:p})),_);return(0,a.h)(a.F,null,(0,a.h)("input",Object.assign({},m,{value:f})),g)}},1295:(e,l,o)=>{o.d(l,{I:()=>h,a:()=>u,b:()=>n,f:()=>d,v:()=>s});var t=o(6548),a=o(5800),i=o(1074);const r=e=>{if("object"==typeof e&&null!==e){if("string"==typeof e.label&&e.label.length>0)return e.disabled=!0===e.disabled,e.label=`${e.label}`.trim(),!1===(0,i.b)(e.label,3)&&!1===(0,i.c)(e.label)&&(0,a.a)(`A differing Aria-Label (${e.label}) is not accessible. A differing Aria-Label should consist of at least three readable characters.`),!Array.isArray(e.options)||void 0===e.options.find((e=>!1===r(e)));if("number"==typeof e.label)return!0}return!1},n=(e,l,o={})=>{(0,a.g)(e,"_options",(e=>"object"==typeof e&&null!==e&&"string"==typeof e.label&&e.label.length>0),l,void 0,o)},s=(e,l,o={})=>{(0,a.g)(e,"_options",r,l,void 0,o)},c=["horizontal","vertical"],d=(e,l,o="")=>{l.forEach(((l,t)=>{const a=`${o}-${t}`;"object"==typeof l&&null!==l&&"string"==typeof l.label&&l.label.length>0&&(Array.isArray(l.options)?d(e,l.options,a):e.set(a,l))}))};class h extends t.I{constructor(e,l,o){super(e,l,o),this.component=e}validateRequired(e){((e,l)=>{(0,a.b)(e,"_required",l)})(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateRequired(this.component._required)}}class u extends h{constructor(e,l,o){super(e,l,o),this.keyOptionMap=new Map,this.getOptionByKey=e=>this.keyOptionMap.get(e),this.afterPatchOptions=(e,l,o,t)=>{"_value"===t&&this.setFormAssociatedValue(e)},this.beforePatchOptions=(e,l)=>{const o=l.has("_options")?l.get("_options"):this.component.state._options;Array.isArray(o)&&o.length>0&&(this.keyOptionMap.clear(),d(this.keyOptionMap,o))},this.component=e}validateOrientation(e){(0,a.w)(this.component,"_orientation",(e=>"string"==typeof e&&c.includes(e)),new Set([`Orientation {${c.join(", ")}`]),e,{defaultValue:"vertical"})}validateOptions(e){n(this.component,e,{hooks:{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions}})}validateValue(e){e=(0,a.m)(e),e=Array.isArray(e)?e[0]:e,(0,a.s)(this.component,"_value",e,{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions})}componentWillLoad(){super.componentWillLoad(),this.validateOrientation(this.component._orientation),this.validateOptions(this.component._options),this.validateValue(this.component._value)}}},3532:(e,l,o)=>{o.d(l,{K:()=>k,a:()=>_,b:()=>p,c:()=>g,d:()=>O,g:()=>j});var t=o(4600),a=o(5630),i=o(9060),r=o(5924),n=o(3584),s=o(7767),c=o(8615),d=o(2552),h=o(5687),u=o(9339);const b=({hasExpertSlot:e,accessKey:l,shortKey:o,label:t,showBadge:i=!0})=>{if(e)return(0,a.h)("slot",{name:"expert"});if(!t)return null;const r=(0,c.i)(l)||(0,c.i)(o);if(!i||!r)return(0,a.h)("span",null,t);const n=(0,h.b)(l,o);return(0,a.h)(a.F,null,(0,a.h)(d.I,{badgeText:n,label:t})," ",(0,a.h)("span",{class:"access-key-hint","aria-hidden":"true"},n))},p=e=>{var{component:l="label",id:o,baseClassName:r="kol-form-field",class:n,accessKey:s,shortKey:c,label:d,hideLabel:h,hasExpertSlot:u,showBadge:p}=e,g=(0,t._)(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge"]);const f=!u&&h;return(0,a.h)(l,Object.assign({},g,{class:(0,i.c)(`${r}__label`,n),id:f?void 0:`${o}-label`,hidden:f,htmlFor:o}),(0,a.h)("span",{class:(0,i.c)(`${r}__label-text`)},(0,a.h)(b,{hasExpertSlot:u,accessKey:s,shortKey:c,label:d,showBadge:p})))},g=e=>{var{id:l,class:o,hint:r,baseClassName:n="kol-form-field"}=e,s=(0,t._)(e,["id","class","hint","baseClassName"]);return r?(0,a.h)("span",Object.assign({class:(0,i.c)(`${n}__hint`,o),id:`${l}-hint`},s),r):null},f=e=>{var{currentLength:l,maxLength:o,class:r}=e,s=(0,t._)(e,["currentLength","maxLength","class"]);return(0,a.h)("span",Object.assign({class:(0,i.c)("kol-form-field__counter",r)},s,{"aria-atomic":"true","aria-live":"polite","data-testid":"input-counter"}),l,o&&(0,a.h)(a.F,null,(0,a.h)("span",{"aria-label":(0,n.t)("kol-of"),role:"img"},"/"),o)," ",(0,a.h)("span",null,(0,n.t)("kol-characters")))},_=({id:e,align:l,badgeText:o,hideLabel:t,label:r,class:n})=>(0,a.h)(s.g,{"aria-hidden":"true",class:(0,i.c)("kol-form-field__tooltip",n),_badgeText:o,_align:l,_id:t?`${e}-label`:void 0,_label:r});function y(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 v=(e,l)=>{var{class:o}=e,r=(0,t._)(e,["class"]);return(0,a.h)("div",Object.assign({class:(0,i.c)("kol-form-field__input",o)},r),l)},m=(e,l)=>{const{component:o="div",renderNoLabel:n,renderNoTooltip:s,renderNoHint:c,anotherChildren:d,id:b,required:m,alert:O,disabled:k,class:j,msg:L,hideError:K,hideLabel:P,label:C,hint:B,accessKey:A,shortKey:$,tooltipAlign:x,counter:q,readOnly:w,touched:F,formFieldLabelProps:S,formFieldHintProps:E,formFieldTooltipProps:T,formFieldMsgProps:N,formFieldCounterProps:H,formFieldInputProps:I}=e,M=(0,t._)(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideError","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldCounterProps","formFieldInputProps"]),D=!n,V=!c,W=!s,z=(0,h.s)(C),G=(0,u.c)(L,F),R=(0,h.b)(A,$),U=W&&!z&&P;let J={"kol-form-field--disabled":Boolean(k),"kol-form-field--required":Boolean(m),"kol-form-field--touched":Boolean(F),"kol-form-field--hide-label":Boolean(P),"kol-form-field--read-only":Boolean(w),"kol-form-field--hidden-error":Boolean(K)};return G&&(J=Object.assign(Object.assign({},J),{[`kol-form-field--${(null==L?void 0:L.type)||"error"}`]:!0,[`kol-form-field--${y(L)}`]:!0})),(0,a.h)(o,Object.assign({class:(0,i.c)("kol-form-field",J,j),role:"presentation"},M),D&&(0,a.h)(p,Object.assign({},S||{},{id:b,hasExpertSlot:z,hideLabel:P,label:C,accessKey:A,shortKey:$})),(0,a.h)(v,Object.assign({},I),l,U&&(0,a.h)(_,Object.assign({},T||{},{id:b,label:C,hideLabel:P,align:x,badgeText:R}))),q?(0,a.h)(f,Object.assign({},H||{},q)):null,G&&(0,a.h)(r.K,Object.assign({},N||{},{id:b,alert:O,msg:L,hideError:K})),V&&(0,a.h)(g,Object.assign({},E||{},{id:b,hint:B})),d)};function O({ariaDescribedBy:e,hideLabel:l,label:o}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":l&&o?o:void 0}}const k=(e,l)=>{var{state:o}=e,i=(0,t._)(e,["state"]);return(0,a.h)(m,Object.assign({},function(e){const l={id:e._id,disabled:e._disabled,msg:(0,u.a)(e._msg),hint:e._hint,label:e._label,hideLabel:e._hideLabel,hideError:e._hideError,touched:e._touched,accessKey:e._accessKey,shortKey:e._shortKey};return"_required"in e&&(l.required=e._required),"_readOnly"in e&&(l.readOnly=e._readOnly),"_hasCounter"in e&&"_currentLength"in e&&(l.counter=e._hasCounter?{currentLength:e._currentLength}:void 0,l.counter&&"_maxLength"in e&&(l.counter.maxLength=e._maxLength)),l}(o),i),l)},j=e=>{var l,o,t;const a=Boolean((null===(l=null==e?void 0:e._msg)||void 0===l?void 0:l._description)&&(null===(o=e._msg._description)||void 0===o?void 0:o.length)>0),i="error"===(null===(t=e._msg)||void 0===t?void 0:t._type)&&a&&!0===e._touched,r="string"==typeof e._hint&&e._hint.length>0,n=[];return a&&n.push(`${e._id}-msg`),r&&n.push(`${e._id}-hint`),{hasError:i,hasHint:r,ariaDescribedBy:n}}},8615:(e,l,o)=>{o.d(l,{i:()=>f});const t="object"==typeof o.g&&o.g&&o.g.Object===Object&&o.g;var a="object"==typeof self&&self&&self.Object===Object&&self;const i=(t||a||Function("return this")()).Symbol;var r=Object.prototype,n=r.hasOwnProperty,s=r.toString,c=i?i.toStringTag:void 0,d=Object.prototype.toString,h="[object Null]",u="[object Undefined]",b=i?i.toStringTag:void 0;const p=Array.isArray;var g="[object String]";function f(e){return"string"==typeof e||!p(e)&&function(e){return null!=e&&"object"==typeof e}(e)&&function(e){return null==e?void 0===e?u:h:b&&b in Object(e)?function(e){var l=n.call(e,c),o=e[c];try{e[c]=void 0;var t=!0}catch(e){}var a=s.call(e);return t&&(l?e[c]=o:delete e[c]),a}(e):function(e){return d.call(e)}(e)}(e)==g}},4600:(e,l,o)=>{function t(e,l){var o={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&l.indexOf(t)<0&&(o[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(t=Object.getOwnPropertySymbols(e);a<t.length;a++)l.indexOf(t[a])<0&&Object.prototype.propertyIsEnumerable.call(e,t[a])&&(o[t[a]]=e[t[a]])}return o}o.d(l,{_:()=>t}),"function"==typeof SuppressedError&&SuppressedError}}]);

package/dist/{1298.js → 6203.js}

@@ -1,2 +1,2 @@
-/*! For license information please see 1298.js.LICENSE.txt */
-"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[1298],{3922:(t,e,o)=>{o.d(e,{I:()=>i});var n=o(6970);const i=({badgeText:t,label:e})=>{const o=t;let[i,...s]=e.split(o);return 0===s.length&&(t=o.toUpperCase(),[i,...s]=e.split(o)),0===s.length&&(t=o.toLowerCase(),[i,...s]=e.split(o)),(0,n.h)(n.F,null,i,s.length?(0,n.h)(n.F,null,(0,n.h)("u",null,t),s.join(o)):null)}},9543:(t,e,o)=>{o.d(e,{a:()=>l,b:()=>r,c:()=>a,v:()=>i});var n=o(5800);const i=(t,e)=>{(0,n.i)(t,"_accessKey",e)},s={hooks:{afterPatch:t=>{-1!==t&&0!==t&&(0,n.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},a=(t,e)=>{(0,n.k)(t,"_tabIndex",e,s)},r=(t,e)=>{(0,n.i)(t,"_shortKey",e)},l=(t,e)=>{if(t&&e)throw new Error("AccessKey and ShortKey are used. Only one is allowed.")}},9246:(t,e,o)=>{o.d(e,{a:()=>i,v:()=>a});var n=o(5800);const i=(t,e,o)=>{(0,n.w)(t,e,(t=>"string"==typeof t&&s.includes(t)),new Set(s),o,{defaultValue:"top"})},s=["left","right","top","bottom"],a=(t,e)=>{i(t,"_align",e)}},4589:(t,e,o)=>{o.d(e,{A:()=>s});var n=o(1732),i=o(5800);class s{constructor(t,e,o){var s,a,r,l;if(this.experimentalMode=(0,n.a)(),this.setFormAssociatedValue=t=>{var e;const o=null===(e=this.formAssociated)||void 0===e?void 0:e.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(t);this.syncValue(t,n,this.formAssociated),this.syncValue(t,n,this.syncToOwnInput)},this.component=t,this.host=this.findHostWithShadowRoot(o),this.type=e,this.experimentalMode&&("KOL-BUTTON"===(l=null===(s=this.host)||void 0===s?void 0:s.tagName)||"KOL-COMBOBOX"===l||"KOL-INPUT-CHECKBOX"===l||"KOL-INPUT-COLOR"===l||"KOL-INPUT-DATE"===l||"KOL-INPUT-EMAIL"===l||"KOL-INPUT-FILE"===l||"KOL-INPUT-NUMBER"===l||"KOL-INPUT-PASSWORD"===l||"KOL-INPUT-RADIO"===l||"KOL-INPUT-RANGE"===l||"KOL-INPUT-TEXT"===l||"KOL-SELECT"===l||"KOL-SINGLE-SELECT"===l||"KOL-TEXTAREA"===l)&&t._name){switch(null===(a=this.host)||void 0===a||a.querySelectorAll("input,select,textarea").forEach((t=>{var e;null===(e=this.host)||void 0===e||e.removeChild(t)})),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===(r=this.host)||void 0===r||r.appendChild(this.formAssociated)}}findHostWithShadowRoot(t){for(;null===(null==t?void 0:t.shadowRoot)&&t!==document.body;)(t=null==t?void 0:t.parentNode).host&&(t=t.host);return t}setAttribute(t,e,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==e||e.setAttribute(t,`${o}`)}catch(o){null==e||e.removeAttribute(t)}}tryToStringifyValue(t){try{return"object"==typeof t&&null!==t?JSON.stringify(t).toString():null==t?null:t.toString()}catch(t){return(0,i.l)(`The form field raw value is not able to stringify! ${t}`),""}}syncValue(t,e,o){if(o)switch(this.type){case"file":o.files=t;break;case"select":o.querySelectorAll("option").forEach((t=>{o.removeChild(t)})),Array.isArray(t)&&t.forEach((t=>{const e=this.tryToStringifyValue(t);if("string"==typeof e){const t=document.createElement("option");t.setAttribute("value",e),t.setAttribute("selected",""),o.appendChild(t)}}));break;case"radio":"string"==typeof e&&(o.setAttribute("value",e),o.setAttribute("checked",""),o.value=e);break;default:"string"==typeof e?(o.setAttribute("value",e),o.value=e):(o.removeAttribute("value"),o.value="")}}validateName(t){((t,e,o)=>{(0,i.i)(t,"_name",e,o)})(this.component,t,{hooks:{afterPatch:()=>{this.setAttribute("name",this.formAssociated,this.component.state._name)}}}),void 0===t&&(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(t){if(this.experimentalMode&&"string"==typeof t){const e=document.querySelector(t);e&&(this.syncToOwnInput=e)}}componentWillLoad(){this.validateName(this.component._name),this.validateSyncValueBySelector(this.component._syncValueBySelector)}}},9060:(t,e,o)=>{function n(t){var e,o,i="";if("string"==typeof t||"number"==typeof t)i+=t;else if("object"==typeof t)if(Array.isArray(t)){var s=t.length;for(e=0;e<s;e++)t[e]&&(o=n(t[e]))&&(i&&(i+=" "),i+=o)}else for(o in t)t[o]&&(i&&(i+=" "),i+=o);return i}function i(){for(var t,e,o=0,i="",s=arguments.length;o<s;o++)(t=arguments[o])&&(e=n(t))&&(i&&(i+=" "),i+=e);return i}o.d(e,{c:()=>i})},608:(t,e,o)=>{o.d(e,{S:()=>a,a:()=>s,b:()=>n,i:()=>i});const n=t=>"object"==typeof t&&null!==t,i=(t,e=0)=>"string"==typeof t&&t.length>=e,s=t=>{if("object"!=typeof t||null===t)return i(t,1);for(const e in t)if(!1===i(e,1))return!1;return!0},a=new Event("StateChange")},8019:(t,e,o)=>{o.d(e,{I:()=>u});var n=o(8231),i=o(4589),s=o(5800),a=o(9543),r=o(356),l=o(6985),c=o(3641),h=o(1074);class d extends i.A{constructor(t,e,o){super(t,e,o),this.component=t}validateTouched(t){((t,e)=>{(0,s.b)(t,"_touched",e)})(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class u extends d{constructor(t,e,o){super(t,e,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=t}validateAccessKey(t){(0,a.v)(this.component,t),(0,a.a)(t,this.component._shortKey)}validateAdjustHeight(t){((t,e)=>{(0,s.b)(t,"_adjustHeight",e)})(this.component,t)}validateDisabled(t){(0,s.b)(this.component,"_disabled",t),!0===t&&(0,s.c)()}validateTooltipAlign(t){(0,r.v)(this.component,t)}validateHideError(t){((t,e,o)=>{(0,s.b)(t,"_hideError",e,o)})(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideError&&(0,s.a)("Property hide-error for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(t){(0,l.v)(this.component,t,{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(t){(0,s.i)(this.component,"_hint",t)}validateId(t){(0,s.i)(this.component,"_id",t,{minLength:1}),""!==t&&void 0!==t||(0,s.j)("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(t){(0,h.a)(this.component,t,{required:!0})}validateMsg(t){(0,c.v)(this.component,t)}validateOn(t){"object"==typeof t&&(0,s.s)(this.component,"_on",t)}validateShortKey(t){(0,a.b)(this.component,t),(0,a.a)(this.component._accessKey,t)}validateSmartButton(t){(0,s.o)(t,(()=>{try{t=(0,s.p)(t)}catch(t){}(0,s.s)(this.component,"_smartButton",t)}))}validateTabIndex(t){(0,a.c)(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideError(this.component._hideError),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(t,e){this.host&&(0,n.d)(this.host,t,e)}onBlur(t){var e;this.component._touched=!0,this.emitEvent(n.K.blur),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onBlur)&&this.component._on.onBlur(t)}onChange(t,e){var o;void 0===e&&(e=t.target.value),this.emitEvent(n.K.change,e),"function"==typeof(null===(o=this.component._on)||void 0===o?void 0:o.onChange)&&this.component._on.onChange(t,e),this.valueChangeListeners.forEach((t=>t(e)))}onInput(t,e=!0,o){var i;void 0===o&&(o=t.target.value),this.emitEvent(n.K.input,o),e&&this.setFormAssociatedValue(o),"function"==typeof(null===(i=this.component._on)||void 0===i?void 0:i.onInput)&&this.component._on.onInput(t,o)}onClick(t){var e;this.emitEvent(n.K.click),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onClick)&&this.component._on.onClick(t)}onFocus(t){var e;this.emitEvent(n.K.focus),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onFocus)&&this.component._on.onFocus(t)}addValueChangeListener(t){this.valueChangeListeners.push(t)}}},8125:(t,e,o)=>{o.d(e,{i:()=>r,n:()=>c,r:()=>l});var n=o(6970),i=o(5687),s=o(1732);const a=()=>{let t=(0,s.d)().KoliBri;return void 0===t&&(t={},Object.defineProperty((0,s.d)(),"KoliBri",{value:t,writable:!1})),t},r=()=>{(()=>{const t=(0,s.g)().querySelector('meta[name="kolibri"]');if(t&&t.hasAttribute("content")){const e=t.getAttribute("content");"string"==typeof e&&((0,s.s)(e.includes("dev-mode=true")),(0,s.b)(e.includes("experimental-mode=true")),(0,s.c)(e.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})},l=()=>{!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")},6985:(t,e,o)=>{o.d(e,{v:()=>i});var n=o(5800);const i=(t,e,o={})=>{(0,n.b)(t,"_hideLabel",e,o)}},3584:(t,e,o)=>{o.d(e,{t:()=>s});var n=o(8461),i=o(5687);let s=(t,e)=>{var o;return(null!==(o=(0,n.g)())&&void 0!==o?o:(0,n.i)("de")).translate(t,e)};"test"===i.p&&(s=t=>t)},1074:(t,e,o)=>{o.d(e,{a:()=>d,b:()=>r,c:()=>l,h:()=>i,v:()=>h});var n=o(5800);const i=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,a=/^\d+$/;function r(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(s))||void 0===e?void 0:e.length)||0}(t)>=e}function l(t){return a.test(t)}const c=new Set(["string"]),h=(t,e,o={})=>{(0,n.w)(t,"_label",(t=>"string"==typeof t),c,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,o,i,s)=>{var a,c;"function"==typeof(null===(a=t.hooks)||void 0===a?void 0:a.afterPatch)&&(null===(c=t.hooks)||void 0===c||c.afterPatch(e,o,i,s)),"string"==typeof e&&!1===r(e,3)&&!1===l(e)&&(0,n.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,n.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(o))},d=h},3641:(t,e,o)=>{o.d(e,{c:()=>a,v:()=>s});var n=o(5800),i=o(608);const s=(t,e)=>{(0,n.o)(e,(()=>{try{e=(0,n.p)(e)}catch(t){}(0,n.w)(t,"_msg",(t=>(0,i.b)(t)&&"string"==typeof(null==t?void 0:t._description)),new Set(["MsgPropType"]),e,{defaultValue:{_description:"",_type:"error"}})}))};function a(t){var e;if(t&&!function(t){return!t||"error"===t._type&&!t._description}(t))return e=t,Object.entries(e).reduce(((t,[e,o])=>{const n=e.startsWith("_")?e.slice(1):e;return Object.assign(Object.assign({},t),{[n]:o})}),{})}},5687:(t,e,o)=>{o.d(e,{b:()=>a,h:()=>i,p:()=>n,s:()=>s});let n="development";try{n="production"}catch(t){n="production"}const i=(t,e,o)=>{if(t&&e&&"string"==typeof o){const n=t.querySelector(`[slot="${o}"]`);n&&e.appendChild(n)}},s=t=>""===t,a=(t,e)=>t||e||""},356:(t,e,o)=>{o.d(e,{v:()=>i});var n=o(9246);const i=(t,e)=>{(0,n.a)(t,"_tooltipAlign",e)}}}]);
+/*! For license information please see 6203.js.LICENSE.txt */
+"use strict";(self.webpackChunk_public_ui_sample_react=self.webpackChunk_public_ui_sample_react||[]).push([[6203],{2552:(t,e,o)=>{o.d(e,{I:()=>i});var n=o(5630);const i=({badgeText:t,label:e})=>{const o=t;let[i,...s]=e.split(o);return 0===s.length&&(t=o.toUpperCase(),[i,...s]=e.split(o)),0===s.length&&(t=o.toLowerCase(),[i,...s]=e.split(o)),(0,n.h)(n.F,null,i,s.length?(0,n.h)(n.F,null,(0,n.h)("u",null,t),s.join(o)):null)}},9543:(t,e,o)=>{o.d(e,{a:()=>l,b:()=>r,c:()=>a,v:()=>i});var n=o(5800);const i=(t,e)=>{(0,n.i)(t,"_accessKey",e)},s={hooks:{afterPatch:t=>{-1!==t&&0!==t&&(0,n.a)("Don't Use Tabindex Greater than 0: https://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html")}}},a=(t,e)=>{(0,n.k)(t,"_tabIndex",e,s)},r=(t,e)=>{(0,n.i)(t,"_shortKey",e)},l=(t,e)=>{if(t&&e)throw new Error("AccessKey and ShortKey are used. Only one is allowed.")}},9246:(t,e,o)=>{o.d(e,{a:()=>i,v:()=>a});var n=o(5800);const i=(t,e,o)=>{(0,n.w)(t,e,(t=>"string"==typeof t&&s.includes(t)),new Set(s),o,{defaultValue:"top"})},s=["left","right","top","bottom"],a=(t,e)=>{i(t,"_align",e)}},6970:(t,e,o)=>{o.d(e,{A:()=>s});var n=o(1732),i=o(5800);class s{constructor(t,e,o){var s,a,r,l;if(this.experimentalMode=(0,n.a)(),this.setFormAssociatedValue=t=>{var e;const o=null===(e=this.formAssociated)||void 0===e?void 0:e.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(t);this.syncValue(t,n,this.formAssociated),this.syncValue(t,n,this.syncToOwnInput)},this.component=t,this.host=this.findHostWithShadowRoot(o),this.type=e,this.experimentalMode&&("KOL-BUTTON"===(l=null===(s=this.host)||void 0===s?void 0:s.tagName)||"KOL-COMBOBOX"===l||"KOL-INPUT-CHECKBOX"===l||"KOL-INPUT-COLOR"===l||"KOL-INPUT-DATE"===l||"KOL-INPUT-EMAIL"===l||"KOL-INPUT-FILE"===l||"KOL-INPUT-NUMBER"===l||"KOL-INPUT-PASSWORD"===l||"KOL-INPUT-RADIO"===l||"KOL-INPUT-RANGE"===l||"KOL-INPUT-TEXT"===l||"KOL-SELECT"===l||"KOL-SINGLE-SELECT"===l||"KOL-TEXTAREA"===l)&&t._name){switch(null===(a=this.host)||void 0===a||a.querySelectorAll("input,select,textarea").forEach((t=>{var e;null===(e=this.host)||void 0===e||e.removeChild(t)})),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===(r=this.host)||void 0===r||r.appendChild(this.formAssociated)}}findHostWithShadowRoot(t){for(;null===(null==t?void 0:t.shadowRoot)&&t!==document.body;)(t=null==t?void 0:t.parentNode).host&&(t=t.host);return t}setAttribute(t,e,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==e||e.setAttribute(t,`${o}`)}catch(o){null==e||e.removeAttribute(t)}}tryToStringifyValue(t){try{return"object"==typeof t&&null!==t?JSON.stringify(t).toString():null==t?null:t.toString()}catch(t){return(0,i.l)(`The form field raw value is not able to stringify! ${t}`),""}}syncValue(t,e,o){if(o)switch(this.type){case"file":o.files=t;break;case"select":o.querySelectorAll("option").forEach((t=>{o.removeChild(t)})),Array.isArray(t)&&t.forEach((t=>{const e=this.tryToStringifyValue(t);if("string"==typeof e){const t=document.createElement("option");t.setAttribute("value",e),t.setAttribute("selected",""),o.appendChild(t)}}));break;case"radio":"string"==typeof e&&(o.setAttribute("value",e),o.setAttribute("checked",""),o.value=e);break;default:"string"==typeof e?(o.setAttribute("value",e),o.value=e):(o.removeAttribute("value"),o.value="")}}validateName(t){((t,e,o)=>{(0,i.i)(t,"_name",e,o)})(this.component,t,{hooks:{afterPatch:()=>{this.setAttribute("name",this.formAssociated,this.component.state._name)}}}),void 0===t&&(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(t){if(this.experimentalMode&&"string"==typeof t){const e=document.querySelector(t);e&&(this.syncToOwnInput=e)}}componentWillLoad(){this.validateName(this.component._name),this.validateSyncValueBySelector(this.component._syncValueBySelector)}}},9060:(t,e,o)=>{function n(t){var e,o,i="";if("string"==typeof t||"number"==typeof t)i+=t;else if("object"==typeof t)if(Array.isArray(t)){var s=t.length;for(e=0;e<s;e++)t[e]&&(o=n(t[e]))&&(i&&(i+=" "),i+=o)}else for(o in t)t[o]&&(i&&(i+=" "),i+=o);return i}function i(){for(var t,e,o=0,i="",s=arguments.length;o<s;o++)(t=arguments[o])&&(e=n(t))&&(i&&(i+=" "),i+=e);return i}o.d(e,{c:()=>i})},608:(t,e,o)=>{o.d(e,{S:()=>a,a:()=>s,b:()=>n,i:()=>i});const n=t=>"object"==typeof t&&null!==t,i=(t,e=0)=>"string"==typeof t&&t.length>=e,s=t=>{if("object"!=typeof t||null===t)return i(t,1);for(const e in t)if(!1===i(e,1))return!1;return!0},a=new Event("StateChange")},6548:(t,e,o)=>{o.d(e,{I:()=>u});var n=o(8231),i=o(6970),s=o(5800),a=o(9543),r=o(356),l=o(6985),c=o(9339),h=o(1074);class d extends i.A{constructor(t,e,o){super(t,e,o),this.component=t}validateTouched(t){((t,e)=>{(0,s.b)(t,"_touched",e)})(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class u extends d{constructor(t,e,o){super(t,e,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=t}validateAccessKey(t){(0,a.v)(this.component,t),(0,a.a)(t,this.component._shortKey)}validateAdjustHeight(t){((t,e)=>{(0,s.b)(t,"_adjustHeight",e)})(this.component,t)}validateDisabled(t){(0,s.b)(this.component,"_disabled",t),!0===t&&(0,s.c)()}validateTooltipAlign(t){(0,r.v)(this.component,t)}validateHideError(t){((t,e,o)=>{(0,s.b)(t,"_hideError",e,o)})(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideError&&(0,s.a)("Property hide-error for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(t){(0,l.v)(this.component,t,{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(t){(0,s.i)(this.component,"_hint",t)}validateId(t){(0,s.i)(this.component,"_id",t,{minLength:1}),""!==t&&void 0!==t||(0,s.j)("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(t){(0,h.a)(this.component,t,{required:!0})}validateMsg(t){(0,c.v)(this.component,t)}validateOn(t){"object"==typeof t&&(0,s.s)(this.component,"_on",t)}validateShortKey(t){(0,a.b)(this.component,t),(0,a.a)(this.component._accessKey,t)}validateSmartButton(t){(0,s.o)(t,(()=>{try{t=(0,s.p)(t)}catch(t){}(0,s.s)(this.component,"_smartButton",t)}))}validateTabIndex(t){(0,a.c)(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideError(this.component._hideError),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(t,e){this.host&&(0,n.d)(this.host,t,e)}onBlur(t){var e;this.component._touched=!0,this.emitEvent(n.K.blur),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onBlur)&&this.component._on.onBlur(t)}onChange(t,e){var o;void 0===e&&(e=t.target.value),this.emitEvent(n.K.change,e),"function"==typeof(null===(o=this.component._on)||void 0===o?void 0:o.onChange)&&this.component._on.onChange(t,e),this.valueChangeListeners.forEach((t=>t(e)))}onInput(t,e=!0,o){var i;void 0===o&&(o=t.target.value),this.emitEvent(n.K.input,o),e&&this.setFormAssociatedValue(o),"function"==typeof(null===(i=this.component._on)||void 0===i?void 0:i.onInput)&&this.component._on.onInput(t,o)}onClick(t){var e;this.emitEvent(n.K.click),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onClick)&&this.component._on.onClick(t)}onFocus(t){var e;this.emitEvent(n.K.focus),"function"==typeof(null===(e=this.component._on)||void 0===e?void 0:e.onFocus)&&this.component._on.onFocus(t)}addValueChangeListener(t){this.valueChangeListeners.push(t)}}},4879:(t,e,o)=>{o.d(e,{i:()=>r,n:()=>c,r:()=>l});var n=o(5630),i=o(5687),s=o(1732);const a=()=>{let t=(0,s.d)().KoliBri;return void 0===t&&(t={},Object.defineProperty((0,s.d)(),"KoliBri",{value:t,writable:!1})),t},r=()=>{(()=>{const t=(0,s.g)().querySelector('meta[name="kolibri"]');if(t&&t.hasAttribute("content")){const e=t.getAttribute("content");"string"==typeof e&&((0,s.s)(e.includes("dev-mode=true")),(0,s.b)(e.includes("experimental-mode=true")),(0,s.c)(e.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})},l=()=>{!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")},6985:(t,e,o)=>{o.d(e,{v:()=>i});var n=o(5800);const i=(t,e,o={})=>{(0,n.b)(t,"_hideLabel",e,o)}},3584:(t,e,o)=>{o.d(e,{t:()=>s});var n=o(8461),i=o(5687);let s=(t,e)=>{var o;return(null!==(o=(0,n.g)())&&void 0!==o?o:(0,n.i)("de")).translate(t,e)};"test"===i.p&&(s=t=>t)},1074:(t,e,o)=>{o.d(e,{a:()=>d,b:()=>r,c:()=>l,h:()=>i,v:()=>h});var n=o(5800);const i=[0,1,2,3,4,5,6],s=/[a-zA-Z0-9äöüÄÖÜß]/g,a=/^\d+$/;function r(t,e=1){return function(t){var e;return"string"==typeof t&&(null===(e=t.match(s))||void 0===e?void 0:e.length)||0}(t)>=e}function l(t){return a.test(t)}const c=new Set(["string"]),h=(t,e,o={})=>{(0,n.w)(t,"_label",(t=>"string"==typeof t),c,e,function(t){var e;return Object.assign(Object.assign({},t),{hooks:{afterPatch:(e,o,i,s)=>{var a,c;"function"==typeof(null===(a=t.hooks)||void 0===a?void 0:a.afterPatch)&&(null===(c=t.hooks)||void 0===c||c.afterPatch(e,o,i,s)),"string"==typeof e&&!1===r(e,3)&&!1===l(e)&&(0,n.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,n.u)("A heading or label should not be longer than 80 characters.")},beforePatch:null===(e=t.hooks)||void 0===e?void 0:e.beforePatch}})}(o))},d=h},9339:(t,e,o)=>{o.d(e,{a:()=>a,c:()=>r,v:()=>s});var n=o(5800),i=o(608);const s=(t,e)=>{(0,n.o)(e,(()=>{try{e=(0,n.p)(e)}catch(t){}(0,n.w)(t,"_msg",(t=>(0,i.b)(t)&&"string"==typeof(null==t?void 0:t._description)),new Set(["MsgPropType"]),e,{defaultValue:{_description:"",_type:"error"}})}))};function a(t){var e;if(t&&!function(t){return!t||"error"===t._type&&!t._description}(t))return e=t,Object.entries(e).reduce(((t,[e,o])=>{const n=e.startsWith("_")?e.slice(1):e;return Object.assign(Object.assign({},t),{[n]:o})}),{})}function r(t,e){return Boolean((null==t?void 0:t.description)&&(null==t?void 0:t.description.length)>0)&&(!0===e||"error"!==(null==t?void 0:t.type))}},5687:(t,e,o)=>{o.d(e,{b:()=>a,h:()=>i,p:()=>n,s:()=>s});let n="development";try{n="production"}catch(t){n="production"}const i=(t,e,o)=>{if(t&&e&&"string"==typeof o){const n=t.querySelector(`[slot="${o}"]`);n&&e.appendChild(n)}},s=t=>""===t,a=(t,e)=>t||e||""},356:(t,e,o)=>{o.d(e,{v:()=>i});var n=o(9246);const i=(t,e)=>{(0,n.a)(t,"_tooltipAlign",e)}}}]);