@public-ui/sample-react 4.0.0-alpha.0 → 4.0.0-alpha.2

package/dist/assets/kol-textarea.entry-NdPFrl_g.js

@@ -0,0 +1,312 @@
+import{h as o,r as y,g as k,n as x,w}from"./index-D7AUPAYP.js";import{c as d}from"./clsx-eK3rPvPS-BT_IL7Fz.js";import{F as L,g as R,c as z,d as S}from"./FormFieldStateWrapper-DBc4KUdQ-CVkWtyyV.js";import{I as C,a as H}from"./controller-icon-C8-i4mlh-BGpCnuog.js";import{_ as h}from"./tslib.es6-CxX45GIN-BAJoBDh7.js";import{n as B}from"./dev.utils-BJDuEPOn-TJbx-Gcl.js";import{a as T,v as A,b as M}from"./max-length-behavior-BmNWss6T-DVacXf_-.js";import{v as O}from"./placeholder-6URRds0_-DeOoTXqf.js";import{v as q}from"./read-only-CcRldJ9w-CwNO7sH7.js";import{v as F}from"./required-G86n77y0-GePRNKdB.js";import{v as V}from"./rows-P4l3PNiA-CGKfsbZZ.js";import{v as j}from"./spell-check-DIsLAYgk-BuKzSCNU.js";import"./isObject-DvSELytj-B0RigBxT.js";import"./Alert-COUNttIM-CvH_qEya.js";import"./i18n-CdSCDnmA-D76H1NpQ.js";import"./access-and-short-key-bcID78Ha-L8u4_6ia.js";import"./disabled-BydergHu-B1DLdE7n.js";import"./hide-label-DRunOux4-oo1N_oyu.js";import"./label-CdtNxOKu-xHQWPYNA.js";import"./tooltip-align-_VI7LehI-B43QQEAJ.js";import"./align-CyK0wp7d-Bgi-SsTU.js";import"./associated.controller-BKIODHIT-DcF9U5JZ.js";import"./InternalUnderlinedBadgeText-Bcop6gIY-DcZYTeCS.js";import"./reuse-CX4AQDkS-Cyh-fyjG.js";import"./Icon-DhhnLcqx-Duv7memP.js";import"./icons-72ER78AW-CdwN4BiP.js";import"./Heading-DDR2LlZW-C6b5Q_9R.js";/*!
+ * KoliBri - The accessible HTML-Standard
+ */const c=["vertical","none"],I=e=>typeof e=="string"&&c.includes(e),P=(e,t)=>{w(e,"_resize",I,new Set(c),t,{defaultValue:"vertical"})},K=e=>{const{class:t,msg:n,touched:a,readonly:l,disabled:i,required:s,ariaDescribedBy:u,hideLabel:p,label:m}=e,f=h(e,["class","msg","touched","readonly","disabled","required","ariaDescribedBy","hideLabel","label"]),v=z(n,a),g=typeof n=="string"?"error":n?._type,_={"kol-textarea--disabled":!!i,"kol-textarea--required":!!s,"kol-textarea--touched":!!a,"kol-textarea--readonly":!!l,[`kol-textarea--${g||"error"}`]:v},b=Object.assign(Object.assign({class:d("kol-textarea",_,t),required:s,disabled:i,readonly:l},S({ariaDescribedBy:u,hideLabel:p,label:m})),f);return o("textarea",Object.assign({},b))};function D(e,t){var n;const l=[...R(e).ariaDescribedBy,...(n=t.ariaDescribedBy)!==null&&n!==void 0?n:[]],i=Object.assign(Object.assign({id:e._id,hideLabel:e._hideLabel,label:e._label,value:e._value,accessKey:e._accessKey,disabled:e._disabled,name:e._name,rows:e._rows,readonly:e._readOnly,required:e._required,placeholder:e._placeholder,touched:e._touched,msg:e._msg},t),{ariaDescribedBy:l});return"_maxLength"in e&&"_maxLengthBehavior"in e&&e._maxLengthBehavior==="hard"&&(i.maxLength=e._maxLength),"_shortKey"in e&&(i["aria-keyshortcuts"]=e._shortKey),i}const W=e=>{var{state:t}=e,n=h(e,["state"]);return o(K,Object.assign({},D(t,n)))};class N extends H{constructor(t,n,a){super(t,n,a),this.afterSyncCharCounter=()=>{typeof this.component._value=="string"&&(this.component.state._currentLength=this.component._value.length,this.updateCurrentLengthDebounced(this.component._value.length))},this.component=t}validateHasCounter(t){T(this.component,t)}validateMaxLengthBehavior(t){A(this.component,t)}validateMaxLength(t){M(this.component,t,{hooks:{afterPatch:this.afterSyncCharCounter}})}validatePlaceholder(t){O(this.component,t)}validateReadOnly(t){q(this.component,t)}validateResize(t){P(this.component,t)}validateRequired(t){F(this.component,t)}validateRows(t){V(this.component,t)}validateSpellCheck(t){j(this.component,t)}validateValue(t){x(this.component,"_value",t,{hooks:{afterPatch:this.afterSyncCharCounter}}),this.setFormAssociatedValue(this.component._value)}componentWillLoad(){super.componentWillLoad(),this.validateHasCounter(this.component._hasCounter),this.validateMaxLengthBehavior(this.component._maxLengthBehavior),this.validateMaxLength(this.component._maxLength),this.validatePlaceholder(this.component._placeholder),this.validateReadOnly(this.component._readOnly),this.validateRequired(this.component._required),this.validateResize(this.component._resize),this.validateRows(this.component._rows),this.validateSpellCheck(this.component._spellCheck),this.validateValue(this.component._value)}}const E=`/*
+* This file defines the layer order for all CSS layers used in KoliBri.
+* The order is important as it determines the cascade priority.
+*
+* Layer order (lowest to highest priority):
+* 1. kol-a11y - Accessibility defaults and requirements
+* 2. kol-global - Global component styles and resets
+* 3. kol-component - Component-specific styles
+* 4. kol-theme-global - Theme-specific global styles
+* 5. kol-theme-component - Theme-specific component styles
+*/
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+/* forward the rem function */
+/*
+ * This file contains all rules for accessibility.
+ */
+@layer kol-a11y {
+  :host {
+    /*
+     * Minimum size of interactive elements.
+     */
+    --a11y-min-size: calc(44 * 1rem / var(--kolibri-root-font-size, 16));
+    /*
+     * No element should be used without verifying the contrast ratio of its background and font colors.
+     * By initially setting the background color to white and the font color to black,
+     * the contrast ratio is ensured and explicit adjustment is forced.
+     */
+    color: black;
+    background-color: white;
+    /*
+     * Verdana is an accessible font that can be used without requiring additional loading time.
+     */
+    font-family: Verdana;
+    /*
+     * Letter spacing is required for all texts.
+     */
+    letter-spacing: inherit;
+    /*
+     * Word spacing is required for all texts.
+     */
+    word-spacing: inherit;
+  }
+  * {
+    /*
+     * This rule enables the word dividing for all texts. That is important for high zoom levels.
+     */
+    hyphens: auto;
+    /*
+     * This rule enables the word dividing for all texts. That is important for high zoom levels.
+     */
+    word-break: break-word;
+  }
+  /*
+   * All interactive elements should have a minimum size of to-rem(44).
+   */
+  /* input:not([type='checkbox'], [type='radio'], [type='range']), */
+  /* option, */
+  /* select, */
+  /* textarea, */
+  button,
+  .kol-input .input {
+    min-width: var(--a11y-min-size);
+    min-height: var(--a11y-min-size);
+  }
+  /*
+   * Some interactive elements should not inherit the font-family and font-size.
+   */
+  a,
+  button,
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  input,
+  option,
+  select,
+  textarea {
+    /*
+     * All elements should inherit the font family from his parent element.
+     */
+    font-family: inherit;
+    /*
+     * All elements should inherit the font size from his parent element.
+     */
+    font-size: inherit;
+    /*
+     * Letter spacing is required for all texts.
+     */
+    letter-spacing: inherit;
+    /*
+     * Word spacing is required for all texts.
+     */
+    word-spacing: inherit;
+  }
+  /**
+  * Sometimes we need the semantic element for accessibility reasons,
+  * but we don't want to show it.
+  *
+  * - https://www.a11yproject.com/posts/how-to-hide-content/
+  */
+  .visually-hidden {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    white-space: nowrap;
+    clip-path: inset(50%);
+  }
+}
+@layer kol-global {
+  /*
+   * Dieses CSS stellt sicher, dass der Standard-Style
+   * von A und Button resettet werden.
+   */
+  :is(a, button) {
+    background-color: transparent;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    border: none;
+    /* 100% needed for custom width from outside */
+  }
+  /*
+   * Ensure elements with hidden attribute to be actually not visible
+   * @see https://meowni.ca/hidden.is.a.lie.html
+   */
+  [hidden] {
+    display: none !important;
+  }
+  .badge-text-hint {
+    color: black;
+    background-color: lightgray;
+  }
+}
+@layer kol-global {
+  :host {
+    /*
+     * The max-width is needed to prevent the table from overflowing the
+     * parent node, if the table is wider than the parent node.
+     */
+    max-width: 100%;
+    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));
+  }
+  * {
+    /*
+     * We prefer to box-sizing: border-box for all elements.
+     */
+    box-sizing: border-box;
+  }
+  .kol-span {
+    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */
+    display: grid;
+    place-items: center;
+    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */
+  }
+  .kol-span__container {
+    display: flex;
+    place-items: center;
+  }
+  a,
+  button {
+    cursor: pointer;
+  }
+  .kol-span .kol-span__label--hide-label .kol-span__label {
+    display: none;
+  }
+  /* Reset browser agent style. */
+  button:disabled {
+    color: unset;
+  }
+  .disabled label,
+  .disabled:focus-within label,
+  [aria-disabled=true],
+  [aria-disabled=true]:focus,
+  [disabled],
+  [disabled]:focus {
+    opacity: 0.5;
+    outline: none;
+    cursor: not-allowed;
+  }
+  [aria-disabled=true]:focus .kol-span,
+  [disabled]:focus .kol-span {
+    outline: none !important;
+  }
+}
+@layer kol-component {
+  :host {
+    display: block;
+  }
+}
+@layer kol-component {
+  @keyframes fadeInOpacity {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  }
+  .kol-tooltip {
+    display: contents;
+  }
+  .kol-tooltip__floating {
+    display: none;
+    position: fixed;
+    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */
+    top: 0;
+    left: 0;
+    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */
+    width: var(--kol-tooltip-width, max-content);
+    min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));
+    max-width: 90vw;
+    max-height: 90vh;
+    visibility: hidden;
+    animation-duration: 0.25s;
+    animation-iteration-count: 1;
+    animation-name: fadeInOpacity;
+    animation-timing-function: ease-in;
+  }
+  .kol-tooltip__arrow {
+    transform: rotate(45deg);
+    color: #000;
+    background-color: #fff;
+    position: absolute;
+    z-index: 999;
+    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));
+    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));
+  }
+  .kol-tooltip__content {
+    color: #000;
+    background-color: #fff;
+    position: relative;
+    z-index: 1000;
+  }
+}
+@layer kol-component {
+  .kol-alert {
+    display: grid;
+  }
+  .kol-alert__container {
+    display: flex;
+    place-items: center;
+  }
+  .kol-alert__container-content {
+    flex-grow: 1;
+  }
+  .kol-alert__closer {
+    /* Visible with forced colors */
+    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));
+  }
+  .kol-form-field {
+    display: grid;
+  }
+  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {
+    cursor: pointer;
+  }
+  .kol-form-field--disabled .kol-form-field__label {
+    opacity: 0.5;
+  }
+  .kol-form-field--required .kol-form-field__label-text::after {
+    content: "*";
+  }
+  .kol-form-field--disabled .kol-form-field__hint {
+    opacity: 0.5;
+  }
+  .kol-form-field--required .kol-form-field__tooltip .span-label::after {
+    content: "*";
+  }
+  .kol-input-container {
+    background-color: white;
+    display: grid;
+    width: 100%;
+    min-width: var(--a11y-min-size);
+    min-height: var(--a11y-min-size);
+    align-items: center;
+    grid-template-columns: 1fr;
+  }
+  .kol-input-container:has(> .kol-input-container__adornment--start) {
+    grid-template-columns: auto 1fr;
+  }
+  .kol-input-container:has(> .kol-input-container__adornment--end) {
+    grid-template-columns: 1fr auto;
+  }
+  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {
+    grid-template-columns: auto 1fr auto;
+  }
+  .kol-input-container__container {
+    position: relative;
+  }
+  .kol-input-container__adornment {
+    display: flex;
+    align-items: center;
+  }
+  .kol-input-container__adornment .kol-icon {
+    display: grid;
+    height: var(--a11y-min-size);
+    place-items: center;
+  }
+  .kol-textarea {
+    width: 100%;
+  }
+  .kol-textarea:focus {
+    outline: none;
+  }
+}`,r=e=>{e.style.overflow="hidden";const t=e.rows,n=e.clientHeight/t;e.rows=1;const a=Math.round(e.scrollHeight/n);return e.rows=t,a},$=class{async getValue(){var e;return(e=this.textareaRef)===null||e===void 0?void 0:e.value}async kolFocus(){var e;(e=this.textareaRef)===null||e===void 0||e.focus()}getFormFieldProps(){return{state:this.state,class:d("kol-form-field-textarea",{"kol-form-field--has-value":this.state._hasValue,"kol-form-field--has-counter":this.controller.hasSoftCharacterLimit()||this.controller.hasCounter()}),tooltipAlign:this._tooltipAlign,onClick:()=>{var e;return(e=this.textareaRef)===null||e===void 0?void 0:e.focus()},alert:this.showAsAlert()}}getTextAreaProps(){const e=typeof this.state._maxLength=="number"?[`${this.state._id}-character-limit-hint`]:void 0;return Object.assign(Object.assign({ref:this.catchRef,state:this.state,style:{resize:this.state._resize},ariaDescribedBy:e},this.controller.onFacade),{onInput:this.onInput,onFocus:t=>{this.controller.onFacade.onFocus(t),this.inputHasFocus=!0},onBlur:t=>{this.controller.onFacade.onBlur(t),this.inputHasFocus=!1}})}render(){return o(L,Object.assign({key:"59ad033cb8e22831871f37a99c924258fd827f87"},this.getFormFieldProps()),o(C,{key:"d0872947a090d08e0e1f63c40e861bd5ea311eea",state:this.state},o(W,Object.assign({key:"f66fb8dea2d4463ca6f8d8b80078f83e53781c8b"},this.getTextAreaProps()))))}constructor(e){y(this,e),this.catchRef=t=>{this.textareaRef=t},this._adjustHeight=!1,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._hasCounter=!1,this._maxLengthBehavior="hard",this._readOnly=!1,this._resize="vertical",this._required=!1,this._tooltipAlign="top",this._touched=!1,this.state={_adjustHeight:!1,_currentLength:0,_currentLengthDebounced:0,_hasValue:!1,_hideMsg:!1,_id:`id-${B()}`,_label:"",_resize:"vertical"},this.inputHasFocus=!1,this.onInput=t=>{this.textareaRef instanceof HTMLTextAreaElement&&(this._value=this.textareaRef.value,this.state._adjustHeight&&(this._rows=r(this.textareaRef)),this.controller.onFacade.onInput(t))},this.controller=new N(this,"textarea",this.host)}showAsAlert(){return!!this.state._touched&&!this.inputHasFocus}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAdjustHeight(e){this.controller.validateAdjustHeight(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideMsg(e){this.controller.validateHideMsg(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHasCounter(e){this.controller.validateHasCounter(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)}validateMaxLengthBehavior(e){this.controller.validateMaxLengthBehavior(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateReadOnly(e){this.controller.validateReadOnly(e)}validateResize(e){this.controller.validateResize(e)}validateRequired(e){this.controller.validateRequired(e)}validateRows(e){this.controller.validateRows(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSpellCheck(e){this.controller.validateSpellCheck(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e)}componentDidLoad(){setTimeout(()=>{var e;this._adjustHeight===!0&&this.textareaRef?this._rows=!((e=this.state)===null||e===void 0)&&e._rows&&this.state._rows>r(this.textareaRef)?this.state._rows:r(this.textareaRef):this._rows||(this._rows=1)},0)}componentWillLoad(){this._touched=this._touched===!0,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 k(this)}static get watchers(){return{_accessKey:["validateAccessKey"],_adjustHeight:["validateAdjustHeight"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hasCounter:["validateHasCounter"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_maxLength:["validateMaxLength"],_maxLengthBehavior:["validateMaxLengthBehavior"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_placeholder:["validatePlaceholder"],_readOnly:["validateReadOnly"],_resize:["validateResize"],_required:["validateRequired"],_rows:["validateRows"],_shortKey:["validateShortKey"],_spellCheck:["validateSpellCheck"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"],_value:["validateValue"]}}};$.style={default:E};export{$ as kol_textarea};
+//# sourceMappingURL=kol-textarea.entry-NdPFrl_g.js.map

package/dist/assets/kol-textarea.entry-NdPFrl_g.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kol-textarea.entry-NdPFrl_g.js","sources":["../../../../components/dist/esm/kol-textarea.entry.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { h, r as registerInstance, g as getElement } from './index-C1-ki8o1.js';\nimport { c as clsx } from './clsx-eK3rPvPS.js';\nimport { d as getDefaultProps, c as checkHasMsg, g as getRenderStates, F as FormFieldStateWrapper } from './FormFieldStateWrapper-DBc4KUdQ.js';\nimport { I as InputIconController, a as InputContainerStateWrapperFc } from './controller-icon-C8-i4mlh.js';\nimport { _ as __rest } from './tslib.es6-CxX45GIN.js';\nimport { w as watchValidator, e as watchString } from './common-8fBdMvJM.js';\nimport { n as nonce } from './dev.utils-BJDuEPOn.js';\nimport { a as validateHasCounter, v as validateMaxLengthBehavior, b as validateMaxLength } from './max-length-behavior-BmNWss6T.js';\nimport { v as validatePlaceholder } from './placeholder-6URRds0_.js';\nimport { v as validateReadOnly } from './read-only-CcRldJ9w.js';\nimport { v as validateRequired } from './required-G86n77y0.js';\nimport { v as validateRows } from './rows-P4l3PNiA.js';\nimport { v as validateSpellCheck } from './spell-check-DIsLAYgk.js';\nimport './access-and-short-key-bcID78Ha.js';\nimport './disabled-BydergHu.js';\nimport './hide-label-DRunOux4.js';\nimport './label-CdtNxOKu.js';\nimport './tooltip-align-_VI7LehI.js';\nimport './align-CyK0wp7d.js';\nimport './events-CoPFQEiC.js';\nimport './associated.controller-BKIODHIT.js';\nimport './bootstrap-BiRnv4fV.js';\nimport './component-names-CkE54Ym7.js';\nimport './i18n-ZF6JbdVP.js';\nimport './isObject-DvSELytj.js';\nimport './Alert-COUNttIM.js';\nimport './i18n-CdSCDnmA.js';\nimport './bem-CHTjklyp.js';\nimport './browser-Ba2Wl_kh.js';\nimport './Heading-DDR2LlZW.js';\nimport './InternalUnderlinedBadgeText-Bcop6gIY.js';\nimport './reuse-CX4AQDkS.js';\nimport './Icon-DhhnLcqx.js';\nimport './icons-72ER78AW.js';\n\nconst textareaResizeOptions = ['vertical', 'none'];\nconst isTextareaResizePropType = (value) => {\n    return typeof value === 'string' && textareaResizeOptions.includes(value);\n};\nconst validateResizeTextarea = (component, value) => {\n    watchValidator(component, '_resize', isTextareaResizePropType, new Set(textareaResizeOptions), value, {\n        defaultValue: 'vertical',\n    });\n};\n\nconst TextAreaFc = (props) => {\n    const { class: classNames, msg, touched, readonly, disabled, required, ariaDescribedBy, hideLabel, label } = props, other = __rest(props, [\"class\", \"msg\", \"touched\", \"readonly\", \"disabled\", \"required\", \"ariaDescribedBy\", \"hideLabel\", \"label\"]);\n    const showMsg = checkHasMsg(msg, touched);\n    const msgType = typeof msg === 'string' ? 'error' : msg === null || msg === void 0 ? void 0 : msg._type;\n    const stateCssClasses = {\n        ['kol-textarea--disabled']: Boolean(disabled),\n        ['kol-textarea--required']: Boolean(required),\n        ['kol-textarea--touched']: Boolean(touched),\n        ['kol-textarea--readonly']: Boolean(readonly),\n        [`kol-textarea--${msgType || 'error'}`]: showMsg,\n    };\n    const inputProps = Object.assign(Object.assign({ class: clsx('kol-textarea', stateCssClasses, classNames), required: required, disabled: disabled, readonly: readonly }, getDefaultProps({ ariaDescribedBy, hideLabel, label })), other);\n    return h(\"textarea\", Object.assign({}, inputProps));\n};\n\nfunction getTextAreaProps(state, other) {\n    var _a;\n    const renderStates = getRenderStates(state);\n    const ariaDescribedBy = [...renderStates.ariaDescribedBy, ...((_a = other.ariaDescribedBy) !== null && _a !== void 0 ? _a : [])];\n    const props = Object.assign(Object.assign({ id: state._id, hideLabel: state._hideLabel, label: state._label, value: state._value, accessKey: state._accessKey, disabled: state._disabled, name: state._name, rows: state._rows, readonly: state._readOnly, required: state._required, placeholder: state._placeholder, touched: state._touched, msg: state._msg }, other), { ariaDescribedBy });\n    if ('_maxLength' in state && '_maxLengthBehavior' in state && state._maxLengthBehavior === 'hard') {\n        props.maxLength = state._maxLength;\n    }\n    if ('_shortKey' in state)\n        props['aria-keyshortcuts'] = state._shortKey;\n    return props;\n}\nconst TextAreaStateWrapper = (_a) => {\n    var { state } = _a, other = __rest(_a, [\"state\"]);\n    return h(TextAreaFc, Object.assign({}, getTextAreaProps(state, other)));\n};\n\nclass TextareaController extends InputIconController {\n    constructor(component, name, host) {\n        super(component, name, host);\n        this.afterSyncCharCounter = () => {\n            if (typeof this.component._value === 'string') {\n                this.component.state._currentLength = this.component._value.length;\n                this.updateCurrentLengthDebounced(this.component._value.length);\n            }\n        };\n        this.component = component;\n    }\n    validateHasCounter(value) {\n        validateHasCounter(this.component, value);\n    }\n    validateMaxLengthBehavior(value) {\n        validateMaxLengthBehavior(this.component, value);\n    }\n    validateMaxLength(value) {\n        validateMaxLength(this.component, value, {\n            hooks: { afterPatch: this.afterSyncCharCounter },\n        });\n    }\n    validatePlaceholder(value) {\n        validatePlaceholder(this.component, value);\n    }\n    validateReadOnly(value) {\n        validateReadOnly(this.component, value);\n    }\n    validateResize(value) {\n        validateResizeTextarea(this.component, value);\n    }\n    validateRequired(value) {\n        validateRequired(this.component, value);\n    }\n    validateRows(value) {\n        validateRows(this.component, value);\n    }\n    validateSpellCheck(value) {\n        validateSpellCheck(this.component, value);\n    }\n    validateValue(value) {\n        watchString(this.component, '_value', value, {\n            hooks: {\n                afterPatch: this.afterSyncCharCounter,\n            },\n        });\n        this.setFormAssociatedValue(this.component._value);\n    }\n    componentWillLoad() {\n        super.componentWillLoad();\n        this.validateHasCounter(this.component._hasCounter);\n        this.validateMaxLengthBehavior(this.component._maxLengthBehavior);\n        this.validateMaxLength(this.component._maxLength);\n        this.validatePlaceholder(this.component._placeholder);\n        this.validateReadOnly(this.component._readOnly);\n        this.validateRequired(this.component._required);\n        this.validateResize(this.component._resize);\n        this.validateRows(this.component._rows);\n        this.validateSpellCheck(this.component._spellCheck);\n        this.validateValue(this.component._value);\n    }\n}\n\nconst defaultStyleCss = \"/*\\n* This file defines the layer order for all CSS layers used in KoliBri.\\n* The order is important as it determines the cascade priority.\\n*\\n* Layer order (lowest to highest priority):\\n* 1. kol-a11y - Accessibility defaults and requirements\\n* 2. kol-global - Global component styles and resets\\n* 3. kol-component - Component-specific styles\\n* 4. kol-theme-global - Theme-specific global styles\\n* 5. kol-theme-component - Theme-specific component styles\\n*/\\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;\\n/* forward the rem function */\\n/*\\n * This file contains all rules for accessibility.\\n */\\n@layer kol-a11y {\\n  :host {\\n    /*\\n     * Minimum size of interactive elements.\\n     */\\n    --a11y-min-size: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\\n    /*\\n     * No element should be used without verifying the contrast ratio of its background and font colors.\\n     * By initially setting the background color to white and the font color to black,\\n     * the contrast ratio is ensured and explicit adjustment is forced.\\n     */\\n    color: black;\\n    background-color: white;\\n    /*\\n     * Verdana is an accessible font that can be used without requiring additional loading time.\\n     */\\n    font-family: Verdana;\\n    /*\\n     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\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     * This rule enables the word dividing for all texts. That is important for high zoom levels.\\n     */\\n    word-break: break-word;\\n  }\\n  /*\\n   * All interactive elements should have a minimum size of to-rem(44).\\n   */\\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\\n  /* option, */\\n  /* select, */\\n  /* textarea, */\\n  button,\\n  .kol-input .input {\\n    min-width: var(--a11y-min-size);\\n    min-height: 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     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\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    position: fixed;\\n    top: 0;\\n    left: 0;\\n    width: 1px;\\n    height: 1px;\\n    overflow: hidden;\\n    white-space: nowrap;\\n    clip-path: inset(50%);\\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    width: 100%;\\n    margin: 0;\\n    padding: 0;\\n    border: none;\\n    /* 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  .badge-text-hint {\\n    color: black;\\n    background-color: lightgray;\\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    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\\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    opacity: 0.5;\\n    outline: none;\\n    cursor: not-allowed;\\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  @keyframes fadeInOpacity {\\n    0% {\\n      opacity: 0;\\n    }\\n    100% {\\n      opacity: 1;\\n    }\\n  }\\n  .kol-tooltip {\\n    display: contents;\\n  }\\n  .kol-tooltip__floating {\\n    display: none;\\n    position: fixed;\\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\\n    top: 0;\\n    left: 0;\\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\\n    width: var(--kol-tooltip-width, max-content);\\n    min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\\n    max-width: 90vw;\\n    max-height: 90vh;\\n    visibility: hidden;\\n    animation-duration: 0.25s;\\n    animation-iteration-count: 1;\\n    animation-name: fadeInOpacity;\\n    animation-timing-function: ease-in;\\n  }\\n  .kol-tooltip__arrow {\\n    transform: rotate(45deg);\\n    color: #000;\\n    background-color: #fff;\\n    position: absolute;\\n    z-index: 999;\\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\\n  }\\n  .kol-tooltip__content {\\n    color: #000;\\n    background-color: #fff;\\n    position: relative;\\n    z-index: 1000;\\n  }\\n}\\n@layer kol-component {\\n  .kol-alert {\\n    display: grid;\\n  }\\n  .kol-alert__container {\\n    display: flex;\\n    place-items: center;\\n  }\\n  .kol-alert__container-content {\\n    flex-grow: 1;\\n  }\\n  .kol-alert__closer {\\n    /* Visible with forced colors */\\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\\n  }\\n  .kol-form-field {\\n    display: grid;\\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  .kol-input-container {\\n    background-color: white;\\n    display: grid;\\n    width: 100%;\\n    min-width: var(--a11y-min-size);\\n    min-height: var(--a11y-min-size);\\n    align-items: center;\\n    grid-template-columns: 1fr;\\n  }\\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\\n    grid-template-columns: auto 1fr;\\n  }\\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\\n    grid-template-columns: 1fr auto;\\n  }\\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\\n    grid-template-columns: auto 1fr auto;\\n  }\\n  .kol-input-container__container {\\n    position: relative;\\n  }\\n  .kol-input-container__adornment {\\n    display: flex;\\n    align-items: center;\\n  }\\n  .kol-input-container__adornment .kol-icon {\\n    display: grid;\\n    height: var(--a11y-min-size);\\n    place-items: center;\\n  }\\n  .kol-textarea {\\n    width: 100%;\\n  }\\n  .kol-textarea:focus {\\n    outline: none;\\n  }\\n}\";\n\nconst increaseTextareaHeight = (el) => {\n    el.style.overflow = 'hidden';\n    const currentRows = el.rows;\n    const rowHeight = el.clientHeight / currentRows;\n    el.rows = 1;\n    const nextRows = Math.round(el.scrollHeight / rowHeight);\n    el.rows = currentRows;\n    return nextRows;\n};\nconst KolTextarea = class {\n    async getValue() {\n        var _a;\n        return (_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.value;\n    }\n    async kolFocus() {\n        var _a;\n        (_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.focus();\n    }\n    getFormFieldProps() {\n        return {\n            state: this.state,\n            class: clsx('kol-form-field-textarea', {\n                'kol-form-field--has-value': this.state._hasValue,\n                'kol-form-field--has-counter': this.controller.hasSoftCharacterLimit() || this.controller.hasCounter(),\n            }),\n            tooltipAlign: this._tooltipAlign,\n            onClick: () => { var _a; return (_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.focus(); },\n            alert: this.showAsAlert(),\n        };\n    }\n    getTextAreaProps() {\n        const ariaDescribedBy = typeof this.state._maxLength === 'number' ? [`${this.state._id}-character-limit-hint`] : undefined;\n        return Object.assign(Object.assign({ ref: this.catchRef, state: this.state, style: {\n                resize: this.state._resize,\n            }, ariaDescribedBy }, this.controller.onFacade), { onInput: this.onInput, onFocus: (event) => {\n                this.controller.onFacade.onFocus(event);\n                this.inputHasFocus = true;\n            }, onBlur: (event) => {\n                this.controller.onFacade.onBlur(event);\n                this.inputHasFocus = false;\n            } });\n    }\n    render() {\n        return (h(FormFieldStateWrapper, Object.assign({ key: '59ad033cb8e22831871f37a99c924258fd827f87' }, this.getFormFieldProps()), h(InputContainerStateWrapperFc, { key: 'd0872947a090d08e0e1f63c40e861bd5ea311eea', state: this.state }, h(TextAreaStateWrapper, Object.assign({ key: 'f66fb8dea2d4463ca6f8d8b80078f83e53781c8b' }, this.getTextAreaProps())))));\n    }\n    constructor(hostRef) {\n        registerInstance(this, hostRef);\n        this.catchRef = (ref) => {\n            this.textareaRef = ref;\n        };\n        this._adjustHeight = false;\n        this._disabled = false;\n        this._hideMsg = false;\n        this._hideLabel = false;\n        this._hint = '';\n        this._hasCounter = false;\n        this._maxLengthBehavior = 'hard';\n        this._readOnly = false;\n        this._resize = 'vertical';\n        this._required = false;\n        this._tooltipAlign = 'top';\n        this._touched = false;\n        this.state = {\n            _adjustHeight: false,\n            _currentLength: 0,\n            _currentLengthDebounced: 0,\n            _hasValue: false,\n            _hideMsg: false,\n            _id: `id-${nonce()}`,\n            _label: '',\n            _resize: 'vertical',\n        };\n        this.inputHasFocus = false;\n        this.onInput = (event) => {\n            if (this.textareaRef instanceof HTMLTextAreaElement) {\n                this._value = this.textareaRef.value;\n                if (this.state._adjustHeight) {\n                    this._rows = increaseTextareaHeight(this.textareaRef);\n                }\n                this.controller.onFacade.onInput(event);\n            }\n        };\n        this.controller = new TextareaController(this, 'textarea', this.host);\n    }\n    showAsAlert() {\n        return Boolean(this.state._touched) && !this.inputHasFocus;\n    }\n    validateAccessKey(value) {\n        this.controller.validateAccessKey(value);\n    }\n    validateAdjustHeight(value) {\n        this.controller.validateAdjustHeight(value);\n    }\n    validateDisabled(value) {\n        this.controller.validateDisabled(value);\n    }\n    validateHideMsg(value) {\n        this.controller.validateHideMsg(value);\n    }\n    validateHideLabel(value) {\n        this.controller.validateHideLabel(value);\n    }\n    validateHasCounter(value) {\n        this.controller.validateHasCounter(value);\n    }\n    validateHint(value) {\n        this.controller.validateHint(value);\n    }\n    validateIcons(value) {\n        this.controller.validateIcons(value);\n    }\n    validateId(value) {\n        this.controller.validateId(value);\n    }\n    validateLabel(value) {\n        this.controller.validateLabel(value);\n    }\n    validateMaxLength(value) {\n        this.controller.validateMaxLength(value);\n    }\n    validateMaxLengthBehavior(value) {\n        this.controller.validateMaxLengthBehavior(value);\n    }\n    validateMsg(value) {\n        this.controller.validateMsg(value);\n    }\n    validateName(value) {\n        this.controller.validateName(value);\n    }\n    validateOn(value) {\n        this.controller.validateOn(value);\n    }\n    validatePlaceholder(value) {\n        this.controller.validatePlaceholder(value);\n    }\n    validateReadOnly(value) {\n        this.controller.validateReadOnly(value);\n    }\n    validateResize(value) {\n        this.controller.validateResize(value);\n    }\n    validateRequired(value) {\n        this.controller.validateRequired(value);\n    }\n    validateRows(value) {\n        this.controller.validateRows(value);\n    }\n    validateShortKey(value) {\n        this.controller.validateShortKey(value);\n    }\n    validateSpellCheck(value) {\n        this.controller.validateSpellCheck(value);\n    }\n    validateSyncValueBySelector(value) {\n        this.controller.validateSyncValueBySelector(value);\n    }\n    validateTouched(value) {\n        this.controller.validateTouched(value);\n    }\n    validateValue(value) {\n        this.controller.validateValue(value);\n    }\n    componentDidLoad() {\n        setTimeout(() => {\n            var _a;\n            if (this._adjustHeight === true && this.textareaRef) {\n                this._rows =\n                    ((_a = this.state) === null || _a === void 0 ? void 0 : _a._rows) && this.state._rows > increaseTextareaHeight(this.textareaRef) ? this.state._rows : increaseTextareaHeight(this.textareaRef);\n            }\n            else if (!this._rows) {\n                this._rows = 1;\n            }\n        }, 0);\n    }\n    componentWillLoad() {\n        this._touched = this._touched === true;\n        this.controller.componentWillLoad();\n        this.state._hasValue = !!this.state._value;\n        this.controller.addValueChangeListener((v) => (this.state._hasValue = !!v));\n    }\n    static get delegatesFocus() { return true; }\n    get host() { return getElement(this); }\n    static get watchers() { return {\n        \"_accessKey\": [\"validateAccessKey\"],\n        \"_adjustHeight\": [\"validateAdjustHeight\"],\n        \"_disabled\": [\"validateDisabled\"],\n        \"_hideMsg\": [\"validateHideMsg\"],\n        \"_hideLabel\": [\"validateHideLabel\"],\n        \"_hasCounter\": [\"validateHasCounter\"],\n        \"_hint\": [\"validateHint\"],\n        \"_icons\": [\"validateIcons\"],\n        \"_id\": [\"validateId\"],\n        \"_label\": [\"validateLabel\"],\n        \"_maxLength\": [\"validateMaxLength\"],\n        \"_maxLengthBehavior\": [\"validateMaxLengthBehavior\"],\n        \"_msg\": [\"validateMsg\"],\n        \"_name\": [\"validateName\"],\n        \"_on\": [\"validateOn\"],\n        \"_placeholder\": [\"validatePlaceholder\"],\n        \"_readOnly\": [\"validateReadOnly\"],\n        \"_resize\": [\"validateResize\"],\n        \"_required\": [\"validateRequired\"],\n        \"_rows\": [\"validateRows\"],\n        \"_shortKey\": [\"validateShortKey\"],\n        \"_spellCheck\": [\"validateSpellCheck\"],\n        \"_syncValueBySelector\": [\"validateSyncValueBySelector\"],\n        \"_touched\": [\"validateTouched\"],\n        \"_value\": [\"validateValue\"]\n    }; }\n};\nKolTextarea.style = {\n    default: defaultStyleCss\n};\n\nexport { KolTextarea as kol_textarea };\n//# sourceMappingURL=kol-textarea.entry.js.map\n"],"names":["textareaResizeOptions","isTextareaResizePropType","value","validateResizeTextarea","component","watchValidator","TextAreaFc","props","classNames","msg","touched","readonly","disabled","required","ariaDescribedBy","hideLabel","label","other","__rest","showMsg","checkHasMsg","msgType","stateCssClasses","inputProps","clsx","getDefaultProps","h","getTextAreaProps","state","_a","getRenderStates","TextAreaStateWrapper","TextareaController","InputIconController","name","host","validateHasCounter","validateMaxLengthBehavior","validateMaxLength","validatePlaceholder","validateReadOnly","validateRequired","validateRows","validateSpellCheck","watchString","defaultStyleCss","increaseTextareaHeight","el","currentRows","rowHeight","nextRows","KolTextarea","event","FormFieldStateWrapper","InputContainerStateWrapperFc","hostRef","registerInstance","ref","nonce","v","getElement"],"mappings":"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"}

package/dist/assets/kol-toast-container.entry-B0i59PZA.js

@@ -0,0 +1,267 @@
+import{r as h,h as s,ad as m,H as p}from"./index-D7AUPAYP.js";import{t as f}from"./i18n-CdSCDnmA-D76H1NpQ.js";import{n as b}from"./dev.utils-BJDuEPOn-TJbx-Gcl.js";import{K as u}from"./Alert-COUNttIM-CvH_qEya.js";import"./markdown-DL-PkOqb-B25Jvl4K.js";import{_ as g}from"./tslib.es6-CxX45GIN-BAJoBDh7.js";import{c as y}from"./clsx-eK3rPvPS-BT_IL7Fz.js";import"./Heading-DDR2LlZW-C6b5Q_9R.js";/*!
+ * KoliBri - The accessible HTML-Standard
+ */const k=n=>{var{status:t,toast:e,onClose:o}=n,i=g(n,["status","toast","onClose"]);const{type:l,label:r,description:d,variant:c}=e;return s("div",{class:y("kol-toast-item",`kol-toast-item--${t}`)},s(u,{class:"kol-toast-item__alert",alert:!0,label:r,level:0,hasCloser:!0,type:l,variant:c||"card",onCloserClick:o},s("div",Object.assign({},i),d)))},w=`/*
+* This file defines the layer order for all CSS layers used in KoliBri.
+* The order is important as it determines the cascade priority.
+*
+* Layer order (lowest to highest priority):
+* 1. kol-a11y - Accessibility defaults and requirements
+* 2. kol-global - Global component styles and resets
+* 3. kol-component - Component-specific styles
+* 4. kol-theme-global - Theme-specific global styles
+* 5. kol-theme-component - Theme-specific component styles
+*/
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+/* forward the rem function */
+/*
+ * This file contains all rules for accessibility.
+ */
+@layer kol-a11y {
+  :host {
+    /*
+     * Minimum size of interactive elements.
+     */
+    --a11y-min-size: calc(44 * 1rem / var(--kolibri-root-font-size, 16));
+    /*
+     * No element should be used without verifying the contrast ratio of its background and font colors.
+     * By initially setting the background color to white and the font color to black,
+     * the contrast ratio is ensured and explicit adjustment is forced.
+     */
+    color: black;
+    background-color: white;
+    /*
+     * Verdana is an accessible font that can be used without requiring additional loading time.
+     */
+    font-family: Verdana;
+    /*
+     * Letter spacing is required for all texts.
+     */
+    letter-spacing: inherit;
+    /*
+     * Word spacing is required for all texts.
+     */
+    word-spacing: inherit;
+  }
+  * {
+    /*
+     * This rule enables the word dividing for all texts. That is important for high zoom levels.
+     */
+    hyphens: auto;
+    /*
+     * This rule enables the word dividing for all texts. That is important for high zoom levels.
+     */
+    word-break: break-word;
+  }
+  /*
+   * All interactive elements should have a minimum size of to-rem(44).
+   */
+  /* input:not([type='checkbox'], [type='radio'], [type='range']), */
+  /* option, */
+  /* select, */
+  /* textarea, */
+  button,
+  .kol-input .input {
+    min-width: var(--a11y-min-size);
+    min-height: var(--a11y-min-size);
+  }
+  /*
+   * Some interactive elements should not inherit the font-family and font-size.
+   */
+  a,
+  button,
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  input,
+  option,
+  select,
+  textarea {
+    /*
+     * All elements should inherit the font family from his parent element.
+     */
+    font-family: inherit;
+    /*
+     * All elements should inherit the font size from his parent element.
+     */
+    font-size: inherit;
+    /*
+     * Letter spacing is required for all texts.
+     */
+    letter-spacing: inherit;
+    /*
+     * Word spacing is required for all texts.
+     */
+    word-spacing: inherit;
+  }
+  /**
+  * Sometimes we need the semantic element for accessibility reasons,
+  * but we don't want to show it.
+  *
+  * - https://www.a11yproject.com/posts/how-to-hide-content/
+  */
+  .visually-hidden {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    white-space: nowrap;
+    clip-path: inset(50%);
+  }
+}
+@layer kol-global {
+  /*
+   * Dieses CSS stellt sicher, dass der Standard-Style
+   * von A und Button resettet werden.
+   */
+  :is(a, button) {
+    background-color: transparent;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    border: none;
+    /* 100% needed for custom width from outside */
+  }
+  /*
+   * Ensure elements with hidden attribute to be actually not visible
+   * @see https://meowni.ca/hidden.is.a.lie.html
+   */
+  [hidden] {
+    display: none !important;
+  }
+  .badge-text-hint {
+    color: black;
+    background-color: lightgray;
+  }
+}
+@layer kol-global {
+  :host {
+    /*
+     * The max-width is needed to prevent the table from overflowing the
+     * parent node, if the table is wider than the parent node.
+     */
+    max-width: 100%;
+    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));
+  }
+  * {
+    /*
+     * We prefer to box-sizing: border-box for all elements.
+     */
+    box-sizing: border-box;
+  }
+  .kol-span {
+    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */
+    display: grid;
+    place-items: center;
+    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */
+  }
+  .kol-span__container {
+    display: flex;
+    place-items: center;
+  }
+  a,
+  button {
+    cursor: pointer;
+  }
+  .kol-span .kol-span__label--hide-label .kol-span__label {
+    display: none;
+  }
+  /* Reset browser agent style. */
+  button:disabled {
+    color: unset;
+  }
+  .disabled label,
+  .disabled:focus-within label,
+  [aria-disabled=true],
+  [aria-disabled=true]:focus,
+  [disabled],
+  [disabled]:focus {
+    opacity: 0.5;
+    outline: none;
+    cursor: not-allowed;
+  }
+  [aria-disabled=true]:focus .kol-span,
+  [disabled]:focus .kol-span {
+    outline: none !important;
+  }
+}
+@layer kol-component {
+  :host {
+    display: block;
+  }
+}
+@layer kol-component {
+  @keyframes fadeInOpacity {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  }
+  .kol-tooltip {
+    display: contents;
+  }
+  .kol-tooltip__floating {
+    display: none;
+    position: fixed;
+    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */
+    top: 0;
+    left: 0;
+    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */
+    width: var(--kol-tooltip-width, max-content);
+    min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));
+    max-width: 90vw;
+    max-height: 90vh;
+    visibility: hidden;
+    animation-duration: 0.25s;
+    animation-iteration-count: 1;
+    animation-name: fadeInOpacity;
+    animation-timing-function: ease-in;
+  }
+  .kol-tooltip__arrow {
+    transform: rotate(45deg);
+    color: #000;
+    background-color: #fff;
+    position: absolute;
+    z-index: 999;
+    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));
+    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));
+  }
+  .kol-tooltip__content {
+    color: #000;
+    background-color: #fff;
+    position: relative;
+    z-index: 1000;
+  }
+}
+@layer kol-component {
+  .kol-alert {
+    display: grid;
+  }
+  .kol-alert__container {
+    display: flex;
+    place-items: center;
+  }
+  .kol-alert__container-content {
+    flex-grow: 1;
+  }
+  .kol-alert__closer {
+    /* Visible with forced colors */
+    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));
+  }
+  :host {
+    display: flex;
+    position: fixed;
+    z-index: 200;
+    flex-direction: column;
+  }
+  .kol-toast-container__close-all {
+    align-self: flex-end;
+  }
+}`,a=300,_=class{constructor(n){h(this,n),this.state={_toastStates:[]},this.translateToastCloseAll=f("kol-toast-close-all"),this.knownRenderFunctions=new Set}async enqueue(n){const t={toast:Object.assign(Object.assign({},n),{variant:"card"}),status:"adding",id:`toast-${b()}`};return this.state=Object.assign(Object.assign({},this.state),{_toastStates:[t,...this.state._toastStates]}),setTimeout(()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map(e=>e.id===t.id&&e.status!=="removing"?Object.assign(Object.assign({},e),{status:"settled"}):e)})},a),()=>{this.handleClose(t)}}handleClose(n){this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.map(t=>(t.id===n.id&&(t.status="removing"),t))}),setTimeout(()=>{var t,e;this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.filter(o=>o.id!==n.id)}),(e=(t=n.toast).onClose)===null||e===void 0||e.call(t)},a)}async closeAll(n=!1){if(n)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(e=>Object.assign(Object.assign({},e),{status:"removing"}))}),setTimeout(()=>{this.state=Object.assign(Object.assign({},this.state),{_toastStates:this.state._toastStates.filter(e=>t.every(o=>o.id!==e.id))}),t.forEach(e=>{var o,i;(i=(o=e.toast).onClose)===null||i===void 0||i.call(o)})},a)}}handleToastRef(n,t){t&&typeof n.toast.render=="function"&&!this.knownRenderFunctions.has(n.toast.render)&&(this.knownRenderFunctions.add(n.toast.render),n.toast.render(t,{close:()=>this.handleClose(n)}))}render(){return s(p,{key:"59038f1cc016df1fb76b2436b4ad4598700e66a9",class:"kol-toast-container"},this.state._toastStates.length>1&&s(m,{key:"d2aea02a378c5631da3d47e8ab947e81eaa4174b",_label:this.translateToastCloseAll,class:"kol-toast-container__button-close-all",_on:{onClick:()=>{this.closeAll()}}}),this.state._toastStates.map(n=>s(k,{key:n.id,onClose:()=>this.handleClose(n),ref:t=>this.handleToastRef(n,t),toast:n.toast,status:n.status})))}};_.style={default:w};export{_ as kol_toast_container};
+//# sourceMappingURL=kol-toast-container.entry-B0i59PZA.js.map