@public-ui/components 4.3.0-rc.1 → 4.3.0-rc.3

package/dist/kolibri/kol-details.entry.js

@@ -1,5 +1,5 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e,g as t}from"./index-DqvPZ16l.js";import{_ as o}from"./tslib.es6-QNbPBOk5.js";import{K as i}from"./Collapsible-OjK6lDr2.js";import{b as l}from"./common-DEEjER7G.js";import{v as a}from"./disabled-CtaJsBT2.js";import{v as s}from"./label-Cg7TG_7b.js";import{v as r}from"./open-Djbpz6kg.js";import{c}from"./dev.utils-Cv9uCwkA.js";import{d,a as h,c as p}from"./element-interaction-C5-6aPzz.js";import{d as m,K as f}from"./events-BhfZTW2e.js";import{w as b}from"./validation-VhuthteS.js";import"./component-names-Dy77vq43.js";import"./clsx-COFh-Vc8.js";import"./Heading-C9p_CRv4.js";import"./element-focus-BQXzaLL9.js";import"./level-CfQolHx4.js";import"./normalizers-pgU77mXp.js";import"./_Uint8Array-kJHDjtoP.js";import"./isArray-CcrBs4JM.js";const u=(n,e)=>{l(n,`_on`,(n=>typeof n==="object"&&n!==null),new Set(["DetailsCallbacksPropType {Events.onToggle}"]),e)};const k='@charset "UTF-8";\n/* forward the rem function */\n/*\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/*\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     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\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 text color from his parent element.\n     */\n    color: inherit;\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: white;\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: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: 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    align-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    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  .hastooltip {\n    z-index: 900 !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  @media (prefers-reduced-motion) {\n    .collapsible__wrapper-animation, .collapsible__wrapper {\n      transition: none !important;\n    }\n  }\n  .collapsible {\n    /* @see https://github.com/public-ui/kolibri/issues/5952 */\n  }\n  @media print {\n    :not(.collapsible--open) .collapsible__wrapper-animation {\n      display: none;\n    }\n  }\n  .collapsible__wrapper {\n    /* Forces the element into its own GPU compositing layer (via 3D transform). Helps prevent rendering/layout bugs (e.g. #7511) and may improve animation performance. */\n    transform: translateZ(0);\n    display: grid;\n    grid-template-columns: minmax(0, 1fr);\n    grid-template-rows: 0fr;\n    transition: grid-template-rows 0.3s;\n  }\n  .collapsible__wrapper-animation {\n    opacity: 0;\n    transform: scaleY(0);\n    transform-origin: top;\n    min-height: 0;\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    transition: transform 0.3s, opacity 0.3s, visibility 0.3s;\n  }\n  .collapsible--open .collapsible__wrapper {\n    grid-template-rows: 1fr;\n  }\n  .collapsible--open .collapsible__wrapper-animation {\n    opacity: 1;\n    transform: scaleY(1);\n    visibility: visible;\n  }\n  .collapsible {\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__heading-button button .kol-span {\n    align-items: flex-start;\n  }\n  .collapsible__heading-button button .kol-span__container {\n    text-align: left;\n  }\n  .collapsible--open:focus-within {\n    position: relative;\n    z-index: 100;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1780919027063"); /* IE9*/\n  src: url("kolicons.eot?t=1780919027063#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1780919027063") format("woff2"), url("kolicons.woff?t=1780919027063") format("woff"), url("kolicons.ttf?t=1780919027063") format("truetype"), url("kolicons.svg?t=1780919027063#kolicons") format("svg"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=" kolicon-"] {\n    font-family: "kolicons";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: "\\ea01";\n  }\n  .kolicon-alert-info::before {\n    content: "\\ea02";\n  }\n  .kolicon-alert-success::before {\n    content: "\\ea03";\n  }\n  .kolicon-alert-warning::before {\n    content: "\\ea04";\n  }\n  .kolicon-check::before {\n    content: "\\ea05";\n  }\n  .kolicon-chevron-double-left::before {\n    content: "\\ea06";\n  }\n  .kolicon-chevron-double-right::before {\n    content: "\\ea07";\n  }\n  .kolicon-chevron-down::before {\n    content: "\\ea08";\n  }\n  .kolicon-chevron-left::before {\n    content: "\\ea09";\n  }\n  .kolicon-chevron-right::before {\n    content: "\\ea0a";\n  }\n  .kolicon-chevron-up::before {\n    content: "\\ea0b";\n  }\n  .kolicon-cogwheel::before {\n    content: "\\ea0c";\n  }\n  .kolicon-cross::before {\n    content: "\\ea0d";\n  }\n  .kolicon-eye-closed::before {\n    content: "\\ea0e";\n  }\n  .kolicon-eye::before {\n    content: "\\ea0f";\n  }\n  .kolicon-house::before {\n    content: "\\ea10";\n  }\n  .kolicon-kolibri::before {\n    content: "\\ea11";\n  }\n  .kolicon-link-external::before {\n    content: "\\ea12";\n  }\n  .kolicon-link::before {\n    content: "\\ea13";\n  }\n  .kolicon-minus::before {\n    content: "\\ea14";\n  }\n  .kolicon-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\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    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\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: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  :host {\n    display: inline-block;\n  }\n  .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .collapsible--open .kol-details__heading-button .kol-icon {\n    transform: rotate(90deg);\n  }\n}';const g=class{constructor(e){n(this,e);this.id=c("details");this.ctaRef=p();this.handleOnClick=n=>{this._open=!this._open;clearTimeout(this.toggleTimeout);this.toggleTimeout=setTimeout((()=>{var e,t;if(this.host){m(this.host,f.toggle,Boolean(this._open))}(t=(e=this.state._on)===null||e===void 0?void 0:e.onToggle)===null||t===void 0?void 0:t.call(e,n,Boolean(this._open))}),25)};this._disabled=false;this._level=0;this._open=false;this.state={_label:"",_level:0,_on:{}}}async focus(n){}async click(){}render(){const{_open:n,_label:t,_disabled:o,_level:l}=this.state;const a="kol-details";const s={id:this.id,label:t,open:n,disabled:o,level:l,onClick:this.handleOnClick,class:a,HeadingProps:{class:`${a}__heading`},HeadingButtonProps:{ref:this.ctaRef,class:`${a}__heading-button`,_icons:"kolicon-chevron-right"},ContentProps:{class:`${a}__content indented-text`,wrapperClass:`${a}__wrapper`,animationClass:`${a}__wrapper-animation`}};return e(i,Object.assign({key:"94f65d0a81d4de069789b27d0c9268f87e0f1e65"},s),e("slot",{key:"6f90244c5dba596fe510b51093c8bc5602956fce"}))}validateDisabled(n){a(this,n)}validateLabel(n){s(this,n,{required:true})}validateLevel(n){b(this,n)}validateOn(n){u(this,n)}validateOpen(n){r(this,n)}componentWillLoad(){this.validateDisabled(this._disabled);this.validateLabel(this._label);this.validateLevel(this._level);this.validateOn(this._on);this.validateOpen(this._open)}get host(){return t(this)}static get watchers(){return{_disabled:["validateDisabled"],_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_open:["validateOpen"]}}};o([d("ctaRef")],g.prototype,"focus",null);o([h("ctaRef")],g.prototype,"click",null);g.style={default:k};export{g as kol_details};
+import{r as n,h as e,g as t}from"./index-CfYfRjdO.js";import{_ as o}from"./tslib.es6-QNbPBOk5.js";import{K as i}from"./Collapsible-CqU4taX6.js";import{b as l}from"./common-Cbb6Axov.js";import{v as a}from"./disabled-DfW4ft-F.js";import{v as s}from"./label-We78Dt9U.js";import{v as r}from"./open-DJPD9Hvv.js";import{c}from"./dev.utils-CBuLoTMV.js";import{d,a as h,c as p}from"./element-interaction-C5-6aPzz.js";import{d as m,K as f}from"./events-BhfZTW2e.js";import{w as b}from"./validation-BVCCGUzN.js";import"./component-names-Dy77vq43.js";import"./clsx-COFh-Vc8.js";import"./Heading-Bi9MCxAk.js";import"./element-focus-BQXzaLL9.js";import"./level-DRQEJIoR.js";import"./normalizers-iLdS6AQE.js";import"./_Uint8Array-kJHDjtoP.js";import"./isArray-CcrBs4JM.js";const u=(n,e)=>{l(n,`_on`,(n=>typeof n==="object"&&n!==null),new Set(["DetailsCallbacksPropType {Events.onToggle}"]),e)};const k='@charset "UTF-8";\n/* forward the rem function */\n/*\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/*\n * This file contains all rules for accessibility.\n */\n@layer kol-a11y {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     *\n     * The `max(…, 44px)` floor guarantees the WCAG 2.5.5 (AAA) target size of 44px:\n     * `to-rem(44)` runs the value through a `calc()` rem round-trip which can lose\n     * sub-pixel precision and resolve to e.g. 43.99px depending on the browser\'s\n     * rounding, dropping just below the required minimum.\n     */\n    --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px);\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     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\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 text color from his parent element.\n     */\n    color: inherit;\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: white;\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: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: 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    align-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    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  .hastooltip {\n    z-index: 900 !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  @media (prefers-reduced-motion) {\n    .collapsible__wrapper-animation, .collapsible__wrapper {\n      transition: none !important;\n    }\n  }\n  .collapsible {\n    /* @see https://github.com/public-ui/kolibri/issues/5952 */\n  }\n  @media print {\n    :not(.collapsible--open) .collapsible__wrapper-animation {\n      display: none;\n    }\n  }\n  .collapsible__wrapper {\n    /* Forces the element into its own GPU compositing layer (via 3D transform). Helps prevent rendering/layout bugs (e.g. #7511) and may improve animation performance. */\n    transform: translateZ(0);\n    display: grid;\n    grid-template-columns: minmax(0, 1fr);\n    grid-template-rows: 0fr;\n    transition: grid-template-rows 0.3s;\n  }\n  .collapsible__wrapper-animation {\n    opacity: 0;\n    transform: scaleY(0);\n    transform-origin: top;\n    min-height: 0;\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    transition: transform 0.3s, opacity 0.3s, visibility 0.3s;\n  }\n  .collapsible--open .collapsible__wrapper {\n    grid-template-rows: 1fr;\n  }\n  .collapsible--open .collapsible__wrapper-animation {\n    opacity: 1;\n    transform: scaleY(1);\n    visibility: visible;\n  }\n  .collapsible {\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__heading-button button .kol-span {\n    align-items: flex-start;\n  }\n  .collapsible__heading-button button .kol-span__container {\n    text-align: left;\n  }\n  .collapsible--open:focus-within {\n    position: relative;\n    z-index: 100;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1783496448056"); /* IE9*/\n  src: url("kolicons.eot?t=1783496448056#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1783496448056") format("woff2"), url("kolicons.woff?t=1783496448056") format("woff"), url("kolicons.ttf?t=1783496448056") format("truetype"), url("kolicons.svg?t=1783496448056#kolicons") format("svg"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=" kolicon-"] {\n    font-family: "kolicons";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: "\\ea01";\n  }\n  .kolicon-alert-info::before {\n    content: "\\ea02";\n  }\n  .kolicon-alert-success::before {\n    content: "\\ea03";\n  }\n  .kolicon-alert-warning::before {\n    content: "\\ea04";\n  }\n  .kolicon-check::before {\n    content: "\\ea05";\n  }\n  .kolicon-chevron-double-left::before {\n    content: "\\ea06";\n  }\n  .kolicon-chevron-double-right::before {\n    content: "\\ea07";\n  }\n  .kolicon-chevron-down::before {\n    content: "\\ea08";\n  }\n  .kolicon-chevron-left::before {\n    content: "\\ea09";\n  }\n  .kolicon-chevron-right::before {\n    content: "\\ea0a";\n  }\n  .kolicon-chevron-up::before {\n    content: "\\ea0b";\n  }\n  .kolicon-cogwheel::before {\n    content: "\\ea0c";\n  }\n  .kolicon-cross::before {\n    content: "\\ea0d";\n  }\n  .kolicon-eye-closed::before {\n    content: "\\ea0e";\n  }\n  .kolicon-eye::before {\n    content: "\\ea0f";\n  }\n  .kolicon-house::before {\n    content: "\\ea10";\n  }\n  .kolicon-kolibri::before {\n    content: "\\ea11";\n  }\n  .kolicon-link-external::before {\n    content: "\\ea12";\n  }\n  .kolicon-link::before {\n    content: "\\ea13";\n  }\n  .kolicon-minus::before {\n    content: "\\ea14";\n  }\n  .kolicon-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\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    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\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: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  :host {\n    display: inline-block;\n  }\n  .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .collapsible--open .kol-details__heading-button .kol-icon {\n    transform: rotate(90deg);\n  }\n}';const g=class{constructor(e){n(this,e);this.id=c("details");this.ctaRef=p();this.handleOnClick=n=>{this._open=!this._open;clearTimeout(this.toggleTimeout);this.toggleTimeout=setTimeout((()=>{var e,t;if(this.host){m(this.host,f.toggle,Boolean(this._open))}(t=(e=this.state._on)===null||e===void 0?void 0:e.onToggle)===null||t===void 0?void 0:t.call(e,n,Boolean(this._open))}),25)};this._disabled=false;this._level=0;this._open=false;this.state={_label:"",_level:0,_on:{}}}async focus(n){}async click(){}render(){const{_open:n,_label:t,_disabled:o,_level:l}=this.state;const a="kol-details";const s={id:this.id,label:t,open:n,disabled:o,level:l,onClick:this.handleOnClick,class:a,HeadingProps:{class:`${a}__heading`},HeadingButtonProps:{ref:this.ctaRef,class:`${a}__heading-button`,_icons:"kolicon-chevron-right"},ContentProps:{class:`${a}__content indented-text`,wrapperClass:`${a}__wrapper`,animationClass:`${a}__wrapper-animation`}};return e(i,Object.assign({key:"ef8a48734ffed34c090994e6139e088f2018746d"},s),e("slot",{key:"f83bdcdf3b1ed258741428d6ae6b25c1d3f7120e"}))}validateDisabled(n){a(this,n)}validateLabel(n){s(this,n,{required:true})}validateLevel(n){b(this,n)}validateOn(n){u(this,n)}validateOpen(n){r(this,n)}componentWillLoad(){this.validateDisabled(this._disabled);this.validateLabel(this._label);this.validateLevel(this._level);this.validateOn(this._on);this.validateOpen(this._open)}get host(){return t(this)}static get watchers(){return{_disabled:["validateDisabled"],_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_open:["validateOpen"]}}};o([d("ctaRef")],g.prototype,"focus",null);o([h("ctaRef")],g.prototype,"click",null);g.style={default:k};export{g as kol_details};
 //# sourceMappingURL=kol-details.entry.js.map

package/dist/kolibri/kol-details.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["registerInstance","h","getElement","__decorate","KolCollapsibleFc","watchValidator","validateDisabled","validateLabel","validateOpen","createUniqueId","delegateFocus","delegateClick","createCtaRef","dispatchDomEvent","KolEvent","watchHeadingLevel","validateDetailsCallbacks","component","value","Set","defaultStyleCss","KolDetails","constructor","hostRef","this","id","ctaRef","handleOnClick","event","_open","clearTimeout","toggleTimeout","setTimeout","_a","_b","host","toggle","Boolean","state","_on","onToggle","call","_disabled","_level","_label","focus","options","click","render","rootClass","props","label","open","disabled","level","onClick","class","HeadingProps","HeadingButtonProps","ref","_icons","ContentProps","wrapperClass","animationClass","Object","assign","key","required","validateLevel","validateOn","on","componentWillLoad","watchers","prototype","style","default"],"sources":["0"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["registerInstance","h","getElement","__decorate","KolCollapsibleFc","watchValidator","validateDisabled","validateLabel","validateOpen","createUniqueId","delegateFocus","delegateClick","createCtaRef","dispatchDomEvent","KolEvent","watchHeadingLevel","validateDetailsCallbacks","component","value","Set","defaultStyleCss","KolDetails","constructor","hostRef","this","id","ctaRef","handleOnClick","event","_open","clearTimeout","toggleTimeout","setTimeout","_a","_b","host","toggle","Boolean","state","_on","onToggle","call","_disabled","_level","_label","focus","options","click","render","rootClass","props","label","open","disabled","level","onClick","class","HeadingProps","HeadingButtonProps","ref","_icons","ContentProps","wrapperClass","animationClass","Object","assign","key","required","validateLevel","validateOn","on","componentWillLoad","watchers","prototype","style","default"],"sources":["0"],"mappings":"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","ignoreList":[]}

package/dist/kolibri/kol-dialog-wc.entry.js

@@ -1,5 +1,5 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as i,h as t,g as s}from"./index-DqvPZ16l.js";import{d as a}from"./component-names-Dy77vq43.js";import{g as o,b as l,s as e}from"./common-DEEjER7G.js";import{v as d}from"./label-Cg7TG_7b.js";import{c as r}from"./clsx-COFh-Vc8.js";import{c as n}from"./dev.utils-Cv9uCwkA.js";import{d as h,K as v}from"./events-BhfZTW2e.js";import{h as c}from"./tooltip-open-tracking-D3tCiiGP.js";import{w as f}from"./validation-VhuthteS.js";import"./level-CfQolHx4.js";import"./normalizers-pgU77mXp.js";import"./_Uint8Array-kJHDjtoP.js";import"./isArray-CcrBs4JM.js";const u=(i,t,s)=>{o(i,"_width",t,Object.assign({defaultValue:"100%"},s))};const b=["blank","card"];const m=(i,t)=>{l(i,"_variant",(i=>typeof i==="string"&&b.includes(i)),new Set(b),t)};const _=class{constructor(t){i(this,t);this.cardHeadingId=n("dialog-heading");this.isModal=true;this._cardOn={onClose:()=>void this.close()};this.handleCancelEvent=i=>{var t,s;c(i);if(i.defaultPrevented)return;(s=(t=this.state._on)===null||t===void 0?void 0:t.onCancel)===null||s===void 0?void 0:s.call(t,i);if(i.defaultPrevented)return;if(this.host&&!h(this.host,v.cancel)){i.preventDefault()}};this._level=0;this._width="100%";this._variant="blank";this.state={_label:"",_width:"100%"}}disconnectedCallback(){void this.close()}handleNativeCloseEvent(i){var t;if(i.target!==this.refDialog){return}if(typeof((t=this.state._on)===null||t===void 0?void 0:t.onClose)==="function"){this.state._on.onClose()}if(this.host){h(this.host,v.close)}}async show(i=false){var t,s,a,o,l;if((t=this.refDialog)===null||t===void 0?void 0:t.open){return}this.isModal=i;if(i){(a=(s=this.refDialog)===null||s===void 0?void 0:s.showModal)===null||a===void 0?void 0:a.call(s)}else{(l=(o=this.refDialog)===null||o===void 0?void 0:o.show)===null||l===void 0?void 0:l.call(o)}}showModal(){return this.show(true)}openModal(){return this.showModal()}async close(){var i,t;(t=(i=this.refDialog)===null||i===void 0?void 0:i.close)===null||t===void 0?void 0:t.call(i)}closeModal(){return this.close()}render(){return t("dialog",{key:"740fd9b18343e873a7961173848be648bbd0ff8a","aria-label":this.state._variant==="blank"?this.state._label:undefined,"aria-labelledby":this.state._variant==="card"?this.cardHeadingId:undefined,"aria-modal":this.isModal?"true":"false",class:r("kol-dialog","kol-modal",{"kol-dialog__blank":this.state._variant==="blank","kol-dialog__card":this.state._variant==="card","kol-modal__blank":this.state._variant==="blank","kol-modal__card":this.state._variant==="card"}),onCancel:this.handleCancelEvent,onClose:this.handleNativeCloseEvent.bind(this),ref:i=>{this.refDialog=i},style:{width:this.state._width}},this.state._variant==="blank"&&t("slot",{key:"183bbb7224ca0ec06bbd84e354fa7b58882a4879"}),this.state._variant==="card"&&t(a,{key:"e0270ea31e33d61760aa8fca356c08f88a56fffe",_hasCloser:true,_headingId:this.cardHeadingId,_label:this.state._label,_level:this._level,_on:this._cardOn},t("slot",{key:"a18c03fd1f0cdcc25a8bddfffd5b0753fc81cdb5"})))}validateLabel(i){d(this,i,{required:true})}validateLevel(i){f(this,i)}validateOn(i){if(typeof i==="object"&&i!==null){const t={};if(typeof i.onCancel==="function"){t.onCancel=i.onCancel}if(typeof i.onClose==="function"){t.onClose=i.onClose}e(this,"_on",t)}}validateWidth(i){u(this,i)}validateVariant(i){m(this,i)}componentWillLoad(){this.validateLabel(this._label);this.validateLevel(this._level);this.validateOn(this._on);this.validateWidth(this._width);this.validateVariant(this._variant)}get host(){return s(this)}static get watchers(){return{_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_width:["validateWidth"],_variant:["validateVariant"]}}};export{_ as kol_dialog_wc};
+import{r as i,h as t,g as s}from"./index-CfYfRjdO.js";import{d as a}from"./component-names-Dy77vq43.js";import{g as o,b as e,s as l}from"./common-Cbb6Axov.js";import{v as d}from"./label-We78Dt9U.js";import{c as r}from"./clsx-COFh-Vc8.js";import{c as n}from"./dev.utils-CBuLoTMV.js";import{d as h,K as c}from"./events-BhfZTW2e.js";import{h as v}from"./tooltip-open-tracking-D3tCiiGP.js";import{w as f}from"./validation-BVCCGUzN.js";import"./level-DRQEJIoR.js";import"./normalizers-iLdS6AQE.js";import"./_Uint8Array-kJHDjtoP.js";import"./isArray-CcrBs4JM.js";const u=(i,t,s)=>{o(i,"_width",t,Object.assign({defaultValue:"100%"},s))};const b=["blank","card"];const m=(i,t)=>{e(i,"_variant",(i=>typeof i==="string"&&b.includes(i)),new Set(b),t)};const _=class{constructor(t){i(this,t);this.cardHeadingId=n("dialog-heading");this.isModal=true;this._cardOn={onClose:()=>void this.close()};this.handleCancelEvent=i=>{var t,s;v(i);if(i.defaultPrevented)return;(s=(t=this.state._on)===null||t===void 0?void 0:t.onCancel)===null||s===void 0?void 0:s.call(t,i);if(i.defaultPrevented)return;if(this.host&&!h(this.host,c.cancel)){i.preventDefault()}};this._level=0;this._width="100%";this._variant="blank";this.state={_label:"",_width:"100%"}}disconnectedCallback(){void this.close()}handleNativeCloseEvent(i){var t;if(i.target!==this.refDialog){return}if(typeof((t=this.state._on)===null||t===void 0?void 0:t.onClose)==="function"){this.state._on.onClose()}if(this.host){h(this.host,c.close)}}async show(i=false){var t,s,a,o,e;if((t=this.refDialog)===null||t===void 0?void 0:t.open){return}this.isModal=i;if(i){(a=(s=this.refDialog)===null||s===void 0?void 0:s.showModal)===null||a===void 0?void 0:a.call(s)}else{(e=(o=this.refDialog)===null||o===void 0?void 0:o.show)===null||e===void 0?void 0:e.call(o)}}showModal(){return this.show(true)}openModal(){return this.showModal()}async close(){var i,t;(t=(i=this.refDialog)===null||i===void 0?void 0:i.close)===null||t===void 0?void 0:t.call(i)}closeModal(){return this.close()}render(){return t("dialog",{key:"b622c4990e105ebbb64d26e211ff6dc37208a10a","aria-label":this.state._variant==="blank"?this.state._label:undefined,"aria-labelledby":this.state._variant==="card"?this.cardHeadingId:undefined,"aria-modal":this.isModal?"true":"false",class:r("kol-dialog","kol-modal",{"kol-dialog__blank":this.state._variant==="blank","kol-dialog__card":this.state._variant==="card","kol-modal__blank":this.state._variant==="blank","kol-modal__card":this.state._variant==="card"}),onCancel:this.handleCancelEvent,onClose:this.handleNativeCloseEvent.bind(this),ref:i=>{this.refDialog=i},style:{width:this.state._width}},this.state._variant==="blank"&&t("slot",{key:"850a1ade034d6444cf1f665e788c140a7b0c90b8"}),this.state._variant==="card"&&t(a,{key:"d4ee4734987ccde37930a628b11a6ddf540143bd",_hasCloser:true,_headingId:this.cardHeadingId,_label:this.state._label,_level:this._level,_on:this._cardOn},t("slot",{key:"cdecd18053b687089733f88d6b6314c64d27d206"})))}validateLabel(i){d(this,i,{required:true})}validateLevel(i){f(this,i)}validateOn(i){if(typeof i==="object"&&i!==null){const t={};if(typeof i.onCancel==="function"){t.onCancel=i.onCancel}if(typeof i.onClose==="function"){t.onClose=i.onClose}l(this,"_on",t)}}validateWidth(i){u(this,i)}validateVariant(i){m(this,i)}componentWillLoad(){this.validateLabel(this._label);this.validateLevel(this._level);this.validateOn(this._on);this.validateWidth(this._width);this.validateVariant(this._variant)}get host(){return s(this)}static get watchers(){return{_label:["validateLabel"],_level:["validateLevel"],_on:["validateOn"],_width:["validateWidth"],_variant:["validateVariant"]}}};export{_ as kol_dialog_wc};
 //# sourceMappingURL=kol-dialog-wc.entry.js.map

package/dist/kolibri/kol-dialog.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"kol-dialog.entry.esm.js","sources":["src/components/dialog/style.scss?tag=kol-dialog&mode=default&encapsulation=shadow","src/components/dialog/shadow.tsx"],"sourcesContent":["@use '../@shared/global' as *;\n@use '../@shared/card.mixin' as *;\n@use '../@shared/mixins' as *;\n@use '../tooltip/style.scss' as *;\n\n@layer kol-component {\n\t@include kol-card;\n\n\t.kol-dialog,\n\t.kol-modal {\n\t\tmin-height: var(--a11y-min-size);\n\t\tpadding: 0;\n\t\tborder: 0;\n\t}\n\n\t.kol-dialog__close-button,\n\t.kol-modal__close-button {\n\t\tposition: absolute;\n\t\ttop: to-rem(1);\n\t\tright: to-rem(1);\n\t\tz-index: 1;\n\t}\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, h, Method, Prop } from '@stencil/core';\nimport { KolDialogWcTag } from '../../core/component-names';\nimport type { DialogProps, HeadingLevel, KoliBriDialogEventCallbacks, LabelPropType } from '../../schema';\nimport type { ModalVariantPropType } from '../../schema/props/variant/modal';\n\n/**\n * @slot - The dialog's contents.\n */\n@Component({\n\ttag: 'kol-dialog',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolDialog implements DialogProps {\n\tprivate dialogRef?: HTMLKolDialogWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolDialogWcElement) => {\n\t\tthis.dialogRef = ref;\n\t};\n\n\t/**\n\t * Opens the dialog.\n\t * @deprecated Use showModal() instead.\n\t */\n\t@Method()\n\tpublic openModal(): Promise<void> {\n\t\treturn this.showModal();\n\t}\n\n\t/**\n\t * Opens the dialog as a modal.\n\t */\n\t@Method()\n\tpublic showModal(): Promise<void> {\n\t\treturn this.dialogRef?.showModal() ?? Promise.resolve();\n\t}\n\n\t/**\n\t * Opens the dialog. Pass true to open as a modal dialog.\n\t */\n\t@Method()\n\tpublic show(modal: boolean = false): Promise<void> {\n\t\treturn this.dialogRef?.show(modal) ?? Promise.resolve();\n\t}\n\n\t/**\n\t * Closes the dialog.\n\t */\n\t@Method()\n\tpublic close(): Promise<void> {\n\t\treturn this.dialogRef?.close() ?? Promise.resolve();\n\t}\n\n\t/**\n\t * Closes the dialog.\n\t * @deprecated Use close() instead.\n\t */\n\t@Method()\n\tpublic closeModal(): Promise<void> {\n\t\treturn this.close();\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolDialogWcTag ref={this.catchRef} _label={this._label} _level={this._level} _on={this._on} _variant={this._variant} _width={this._width}>\n\t\t\t\t<slot />\n\t\t\t</KolDialogWcTag>\n\t\t);\n\t}\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text.\n\t */\n\t@Prop() public _level?: HeadingLevel = 0;\n\n\t/**\n\t * Defines the modal callback functions.\n\t */\n\t@Prop() public _on?: KoliBriDialogEventCallbacks;\n\n\t/**\n\t * Defines the width of the modal. (max-width: 100%)\n\t */\n\t@Prop() public _width?: string = '100%';\n\n\t/**\n\t * Defines the variant of the modal.\n\t */\n\t@Prop() public _variant?: ModalVariantPropType = 'blank';\n}\n"],"names":[],"mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,wgWAAwgW;;MCgBnhW,SAAS,GAAA,MAAA;AAPtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAUkB,QAAA,IAAA,CAAA,QAAQ,GAAG,CAAC,GAA4B,KAAI;AAC5D,YAAA,IAAI,CAAC,SAAS,GAAG,GAAG;AACrB,SAAC;AA4Dc,QAAA,IAAM,CAAA,MAAA,GAAkB,CAAC;AAUzB,QAAA,IAAM,CAAA,MAAA,GAAY,MAAM;AAKxB,QAAA,IAAQ,CAAA,QAAA,GAA0B,OAAO;AACxD;IArEO,SAAS,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,SAAS,EAAE;;IAOjB,SAAS,GAAA;;QACf,OAAO,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,EAAE,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAA,OAAO,CAAC,OAAO,EAAE;;IAOjD,IAAI,CAAC,QAAiB,KAAK,EAAA;;QACjC,OAAO,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAI,CAAC,KAAK,CAAC,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAA,OAAO,CAAC,OAAO,EAAE;;IAOjD,KAAK,GAAA;;QACX,OAAO,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK,EAAE,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAA,OAAO,CAAC,OAAO,EAAE;;IAQ7C,UAAU,GAAA;AAChB,QAAA,OAAO,IAAI,CAAC,KAAK,EAAE;;IAGb,MAAM,GAAA;QACZ,QACC,CAAC,CAAA,cAAc,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EACxI,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACQ;;;;;;;;;"}
+{"version":3,"file":"kol-dialog.entry.esm.js","sources":["src/components/dialog/style.scss?tag=kol-dialog&mode=default&encapsulation=shadow","src/components/dialog/shadow.tsx"],"sourcesContent":["@use '../@shared/global' as *;\n@use '../@shared/card.mixin' as *;\n@use '../@shared/mixins' as *;\n@use '../tooltip/style.scss' as *;\n\n@layer kol-component {\n\t@include kol-card;\n\n\t.kol-dialog,\n\t.kol-modal {\n\t\tmin-height: var(--a11y-min-size);\n\t\tpadding: 0;\n\t\tborder: 0;\n\t}\n\n\t.kol-dialog__close-button,\n\t.kol-modal__close-button {\n\t\tposition: absolute;\n\t\ttop: to-rem(1);\n\t\tright: to-rem(1);\n\t\tz-index: 1;\n\t}\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, h, Method, Prop } from '@stencil/core';\nimport { KolDialogWcTag } from '../../core/component-names';\nimport type { DialogProps, HeadingLevel, KoliBriDialogEventCallbacks, LabelPropType } from '../../schema';\nimport type { ModalVariantPropType } from '../../schema/props/variant/modal';\n\n/**\n * @slot - The dialog's contents.\n */\n@Component({\n\ttag: 'kol-dialog',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolDialog implements DialogProps {\n\tprivate dialogRef?: HTMLKolDialogWcElement;\n\n\tprivate readonly catchRef = (ref?: HTMLKolDialogWcElement) => {\n\t\tthis.dialogRef = ref;\n\t};\n\n\t/**\n\t * Opens the dialog.\n\t * @deprecated Use showModal() instead.\n\t */\n\t@Method()\n\tpublic openModal(): Promise<void> {\n\t\treturn this.showModal();\n\t}\n\n\t/**\n\t * Opens the dialog as a modal.\n\t */\n\t@Method()\n\tpublic showModal(): Promise<void> {\n\t\treturn this.dialogRef?.showModal() ?? Promise.resolve();\n\t}\n\n\t/**\n\t * Opens the dialog. Pass true to open as a modal dialog.\n\t */\n\t@Method()\n\tpublic show(modal: boolean = false): Promise<void> {\n\t\treturn this.dialogRef?.show(modal) ?? Promise.resolve();\n\t}\n\n\t/**\n\t * Closes the dialog.\n\t */\n\t@Method()\n\tpublic close(): Promise<void> {\n\t\treturn this.dialogRef?.close() ?? Promise.resolve();\n\t}\n\n\t/**\n\t * Closes the dialog.\n\t * @deprecated Use close() instead.\n\t */\n\t@Method()\n\tpublic closeModal(): Promise<void> {\n\t\treturn this.close();\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolDialogWcTag ref={this.catchRef} _label={this._label} _level={this._level} _on={this._on} _variant={this._variant} _width={this._width}>\n\t\t\t\t<slot />\n\t\t\t</KolDialogWcTag>\n\t\t);\n\t}\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text.\n\t */\n\t@Prop() public _level?: HeadingLevel = 0;\n\n\t/**\n\t * Defines the modal callback functions.\n\t */\n\t@Prop() public _on?: KoliBriDialogEventCallbacks;\n\n\t/**\n\t * Defines the width of the modal. (max-width: 100%)\n\t */\n\t@Prop() public _width?: string = '100%';\n\n\t/**\n\t * Defines the variant of the modal.\n\t */\n\t@Prop() public _variant?: ModalVariantPropType = 'blank';\n}\n"],"names":[],"mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,yzWAAyzW;;MCgBp0W,SAAS,GAAA,MAAA;AAPtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAUkB,QAAA,IAAA,CAAA,QAAQ,GAAG,CAAC,GAA4B,KAAI;AAC5D,YAAA,IAAI,CAAC,SAAS,GAAG,GAAG;AACrB,SAAC;AA4Dc,QAAA,IAAM,CAAA,MAAA,GAAkB,CAAC;AAUzB,QAAA,IAAM,CAAA,MAAA,GAAY,MAAM;AAKxB,QAAA,IAAQ,CAAA,QAAA,GAA0B,OAAO;AACxD;IArEO,SAAS,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,SAAS,EAAE;;IAOjB,SAAS,GAAA;;QACf,OAAO,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,EAAE,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAA,OAAO,CAAC,OAAO,EAAE;;IAOjD,IAAI,CAAC,QAAiB,KAAK,EAAA;;QACjC,OAAO,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAI,CAAC,KAAK,CAAC,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAA,OAAO,CAAC,OAAO,EAAE;;IAOjD,KAAK,GAAA;;QACX,OAAO,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,KAAK,EAAE,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAA,OAAO,CAAC,OAAO,EAAE;;IAQ7C,UAAU,GAAA;AAChB,QAAA,OAAO,IAAI,CAAC,KAAK,EAAE;;IAGb,MAAM,GAAA;QACZ,QACC,CAAC,CAAA,cAAc,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EACxI,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACQ;;;;;;;;;"}

package/dist/kolibri/kol-dialog.entry.js

@@ -1,5 +1,5 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e}from"./index-DqvPZ16l.js";import{e as o}from"./component-names-Dy77vq43.js";import"./common-DEEjER7G.js";const t='@charset "UTF-8";\n/*\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     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\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 text color from his parent element.\n     */\n    color: inherit;\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: white;\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: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: 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    align-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    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  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1780919027063"); /* IE9*/\n  src: url("kolicons.eot?t=1780919027063#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1780919027063") format("woff2"), url("kolicons.woff?t=1780919027063") format("woff"), url("kolicons.ttf?t=1780919027063") format("truetype"), url("kolicons.svg?t=1780919027063#kolicons") format("svg"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=" kolicon-"] {\n    font-family: "kolicons";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: "\\ea01";\n  }\n  .kolicon-alert-info::before {\n    content: "\\ea02";\n  }\n  .kolicon-alert-success::before {\n    content: "\\ea03";\n  }\n  .kolicon-alert-warning::before {\n    content: "\\ea04";\n  }\n  .kolicon-check::before {\n    content: "\\ea05";\n  }\n  .kolicon-chevron-double-left::before {\n    content: "\\ea06";\n  }\n  .kolicon-chevron-double-right::before {\n    content: "\\ea07";\n  }\n  .kolicon-chevron-down::before {\n    content: "\\ea08";\n  }\n  .kolicon-chevron-left::before {\n    content: "\\ea09";\n  }\n  .kolicon-chevron-right::before {\n    content: "\\ea0a";\n  }\n  .kolicon-chevron-up::before {\n    content: "\\ea0b";\n  }\n  .kolicon-cogwheel::before {\n    content: "\\ea0c";\n  }\n  .kolicon-cross::before {\n    content: "\\ea0d";\n  }\n  .kolicon-eye-closed::before {\n    content: "\\ea0e";\n  }\n  .kolicon-eye::before {\n    content: "\\ea0f";\n  }\n  .kolicon-house::before {\n    content: "\\ea10";\n  }\n  .kolicon-kolibri::before {\n    content: "\\ea11";\n  }\n  .kolicon-link-external::before {\n    content: "\\ea12";\n  }\n  .kolicon-link::before {\n    content: "\\ea13";\n  }\n  .kolicon-minus::before {\n    content: "\\ea14";\n  }\n  .kolicon-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\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    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\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: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card :host {\n    display: inline-block;\n  }\n  .kol-card .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-card .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-card .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-card {\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    display: grid;\n    height: 100%;\n    overflow: visible;\n    grid-template-areas: "header  close" "content content";\n    grid-template-columns: 1fr min-content;\n    grid-template-rows: min-content 1fr;\n  }\n  .kol-card__header {\n    align-self: start;\n    grid-area: header;\n  }\n  .kol-card__content {\n    align-self: stretch;\n    grid-area: content;\n  }\n  .kol-card__close-button {\n    grid-area: close;\n  }\n  .kol-dialog,\n  .kol-modal {\n    min-height: var(--a11y-min-size);\n    padding: 0;\n    border: 0;\n  }\n  .kol-dialog__close-button,\n  .kol-modal__close-button {\n    position: absolute;\n    top: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    right: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    z-index: 1;\n  }\n}';const i=class{constructor(e){n(this,e);this.catchRef=n=>{this.dialogRef=n};this._level=0;this._width="100%";this._variant="blank"}openModal(){return this.showModal()}showModal(){var n,e;return(e=(n=this.dialogRef)===null||n===void 0?void 0:n.showModal())!==null&&e!==void 0?e:Promise.resolve()}show(n=false){var e,o;return(o=(e=this.dialogRef)===null||e===void 0?void 0:e.show(n))!==null&&o!==void 0?o:Promise.resolve()}close(){var n,e;return(e=(n=this.dialogRef)===null||n===void 0?void 0:n.close())!==null&&e!==void 0?e:Promise.resolve()}closeModal(){return this.close()}render(){return e(o,{key:"a17abd1f58ac28397c5645822518998209c455e9",ref:this.catchRef,_label:this._label,_level:this._level,_on:this._on,_variant:this._variant,_width:this._width},e("slot",{key:"bc9895ef49e81444df9ce3d2634ae950bfc0f115"}))}};i.style={default:t};export{i as kol_dialog};
+import{r as n,h as e}from"./index-CfYfRjdO.js";import{e as o}from"./component-names-Dy77vq43.js";import"./common-Cbb6Axov.js";const t='@charset "UTF-8";\n/*\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     * The `max(…, 44px)` floor guarantees the WCAG 2.5.5 (AAA) target size of 44px:\n     * `to-rem(44)` runs the value through a `calc()` rem round-trip which can lose\n     * sub-pixel precision and resolve to e.g. 43.99px depending on the browser\'s\n     * rounding, dropping just below the required minimum.\n     */\n    --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px);\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     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\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 text color from his parent element.\n     */\n    color: inherit;\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: white;\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: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: 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    align-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    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  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1783496448056"); /* IE9*/\n  src: url("kolicons.eot?t=1783496448056#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1783496448056") format("woff2"), url("kolicons.woff?t=1783496448056") format("woff"), url("kolicons.ttf?t=1783496448056") format("truetype"), url("kolicons.svg?t=1783496448056#kolicons") format("svg"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=" kolicon-"] {\n    font-family: "kolicons";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: "\\ea01";\n  }\n  .kolicon-alert-info::before {\n    content: "\\ea02";\n  }\n  .kolicon-alert-success::before {\n    content: "\\ea03";\n  }\n  .kolicon-alert-warning::before {\n    content: "\\ea04";\n  }\n  .kolicon-check::before {\n    content: "\\ea05";\n  }\n  .kolicon-chevron-double-left::before {\n    content: "\\ea06";\n  }\n  .kolicon-chevron-double-right::before {\n    content: "\\ea07";\n  }\n  .kolicon-chevron-down::before {\n    content: "\\ea08";\n  }\n  .kolicon-chevron-left::before {\n    content: "\\ea09";\n  }\n  .kolicon-chevron-right::before {\n    content: "\\ea0a";\n  }\n  .kolicon-chevron-up::before {\n    content: "\\ea0b";\n  }\n  .kolicon-cogwheel::before {\n    content: "\\ea0c";\n  }\n  .kolicon-cross::before {\n    content: "\\ea0d";\n  }\n  .kolicon-eye-closed::before {\n    content: "\\ea0e";\n  }\n  .kolicon-eye::before {\n    content: "\\ea0f";\n  }\n  .kolicon-house::before {\n    content: "\\ea10";\n  }\n  .kolicon-kolibri::before {\n    content: "\\ea11";\n  }\n  .kolicon-link-external::before {\n    content: "\\ea12";\n  }\n  .kolicon-link::before {\n    content: "\\ea13";\n  }\n  .kolicon-minus::before {\n    content: "\\ea14";\n  }\n  .kolicon-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\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    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\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: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card :host {\n    display: inline-block;\n  }\n  .kol-card .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-card .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-card .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-card {\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    display: grid;\n    height: 100%;\n    overflow: visible;\n    grid-template-areas: "header  close" "content content";\n    grid-template-columns: 1fr min-content;\n    grid-template-rows: min-content 1fr;\n  }\n  .kol-card__header {\n    align-self: start;\n    grid-area: header;\n  }\n  .kol-card__content {\n    align-self: stretch;\n    grid-area: content;\n  }\n  .kol-card__close-button {\n    grid-area: close;\n  }\n  .kol-dialog,\n  .kol-modal {\n    min-height: var(--a11y-min-size);\n    padding: 0;\n    border: 0;\n  }\n  .kol-dialog__close-button,\n  .kol-modal__close-button {\n    position: absolute;\n    top: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    right: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    z-index: 1;\n  }\n}';const i=class{constructor(e){n(this,e);this.catchRef=n=>{this.dialogRef=n};this._level=0;this._width="100%";this._variant="blank"}openModal(){return this.showModal()}showModal(){var n,e;return(e=(n=this.dialogRef)===null||n===void 0?void 0:n.showModal())!==null&&e!==void 0?e:Promise.resolve()}show(n=false){var e,o;return(o=(e=this.dialogRef)===null||e===void 0?void 0:e.show(n))!==null&&o!==void 0?o:Promise.resolve()}close(){var n,e;return(e=(n=this.dialogRef)===null||n===void 0?void 0:n.close())!==null&&e!==void 0?e:Promise.resolve()}closeModal(){return this.close()}render(){return e(o,{key:"150e1d8672c53f3398d974bdb49d82386ccc45b5",ref:this.catchRef,_label:this._label,_level:this._level,_on:this._on,_variant:this._variant,_width:this._width},e("slot",{key:"aee06f0dc639103bf837b36be0c249640c453c3c"}))}};i.style={default:t};export{i as kol_dialog};
 //# sourceMappingURL=kol-dialog.entry.js.map

package/dist/kolibri/kol-dialog.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["registerInstance","h","KolDialogWcTag","defaultStyleCss","KolDialog","constructor","hostRef","this","catchRef","ref","dialogRef","_level","_width","_variant","openModal","showModal","_a","_b","Promise","resolve","show","modal","close","closeModal","render","key","_label","_on","style","default"],"sources":["0"],"mappings":";;;YAGcA,OAAkBC,MAAS,kCAC3BC,MAAsB,sCAC7B,uBAEP,MAAMC,EAAkB,s7VAExB,MAAMC,EAAY,MACd,WAAAC,CAAYC,GACRN,EAAiBO,KAAMD,GACvBC,KAAKC,SAAYC,IACbF,KAAKG,UAAYD,CAAG,EAExBF,KAAKI,OAAS,EACdJ,KAAKK,OAAS,OACdL,KAAKM,SAAW,OACpB,CACA,SAAAC,GACI,OAAOP,KAAKQ,WAChB,CACA,SAAAA,GACI,IAAIC,EAAIC,EACR,OAAQA,GAAMD,EAAKT,KAAKG,aAAe,MAAQM,SAAY,OAAS,EAAIA,EAAGD,eAAiB,MAAQE,SAAY,EAAIA,EAAKC,QAAQC,SACrI,CACA,IAAAC,CAAKC,EAAQ,OACT,IAAIL,EAAIC,EACR,OAAQA,GAAMD,EAAKT,KAAKG,aAAe,MAAQM,SAAY,OAAS,EAAIA,EAAGI,KAAKC,MAAY,MAAQJ,SAAY,EAAIA,EAAKC,QAAQC,SACrI,CACA,KAAAG,GACI,IAAIN,EAAIC,EACR,OAAQA,GAAMD,EAAKT,KAAKG,aAAe,MAAQM,SAAY,OAAS,EAAIA,EAAGM,WAAa,MAAQL,SAAY,EAAIA,EAAKC,QAAQC,SACjI,CACA,UAAAI,GACI,OAAOhB,KAAKe,OAChB,CACA,MAAAE,GACI,OAAQvB,EAAEC,EAAgB,CAAEuB,IAAK,2CAA4ChB,IAAKF,KAAKC,SAAUkB,OAAQnB,KAAKmB,OAAQf,OAAQJ,KAAKI,OAAQgB,IAAKpB,KAAKoB,IAAKd,SAAUN,KAAKM,SAAUD,OAAQL,KAAKK,QAAUX,EAAE,OAAQ,CAAEwB,IAAK,6CAC/N,GAEJrB,EAAUwB,MAAQ,CACdC,QAAS1B,UAGJC","ignoreList":[]}
+{"version":3,"names":["registerInstance","h","KolDialogWcTag","defaultStyleCss","KolDialog","constructor","hostRef","this","catchRef","ref","dialogRef","_level","_width","_variant","openModal","showModal","_a","_b","Promise","resolve","show","modal","close","closeModal","render","key","_label","_on","style","default"],"sources":["0"],"mappings":";;;YAGcA,OAAkBC,MAAS,kCAC3BC,MAAsB,sCAC7B,uBAEP,MAAMC,EAAkB,wuWAExB,MAAMC,EAAY,MACd,WAAAC,CAAYC,GACRN,EAAiBO,KAAMD,GACvBC,KAAKC,SAAYC,IACbF,KAAKG,UAAYD,CAAG,EAExBF,KAAKI,OAAS,EACdJ,KAAKK,OAAS,OACdL,KAAKM,SAAW,OACpB,CACA,SAAAC,GACI,OAAOP,KAAKQ,WAChB,CACA,SAAAA,GACI,IAAIC,EAAIC,EACR,OAAQA,GAAMD,EAAKT,KAAKG,aAAe,MAAQM,SAAY,OAAS,EAAIA,EAAGD,eAAiB,MAAQE,SAAY,EAAIA,EAAKC,QAAQC,SACrI,CACA,IAAAC,CAAKC,EAAQ,OACT,IAAIL,EAAIC,EACR,OAAQA,GAAMD,EAAKT,KAAKG,aAAe,MAAQM,SAAY,OAAS,EAAIA,EAAGI,KAAKC,MAAY,MAAQJ,SAAY,EAAIA,EAAKC,QAAQC,SACrI,CACA,KAAAG,GACI,IAAIN,EAAIC,EACR,OAAQA,GAAMD,EAAKT,KAAKG,aAAe,MAAQM,SAAY,OAAS,EAAIA,EAAGM,WAAa,MAAQL,SAAY,EAAIA,EAAKC,QAAQC,SACjI,CACA,UAAAI,GACI,OAAOhB,KAAKe,OAChB,CACA,MAAAE,GACI,OAAQvB,EAAEC,EAAgB,CAAEuB,IAAK,2CAA4ChB,IAAKF,KAAKC,SAAUkB,OAAQnB,KAAKmB,OAAQf,OAAQJ,KAAKI,OAAQgB,IAAKpB,KAAKoB,IAAKd,SAAUN,KAAKM,SAAUD,OAAQL,KAAKK,QAAUX,EAAE,OAAQ,CAAEwB,IAAK,6CAC/N,GAEJrB,EAAUwB,MAAQ,CACdC,QAAS1B,UAGJC","ignoreList":[]}

package/dist/kolibri/kol-drawer.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"kol-drawer.entry.esm.js","sources":["src/components/drawer/style.scss?tag=kol-drawer&mode=default&encapsulation=shadow","src/components/drawer/shadow.tsx"],"sourcesContent":["@use '../@shared/global' as *;\n@use '../@shared/card.mixin' as *;\n@use '../@shared/mixins' as *;\n@use '../tooltip/style.scss' as *;\n\n@layer kol-component {\n\t@include kol-card;\n\n\t.kol-drawer {\n\t\t$root: &;\n\n\t\t&__dialog {\n\t\t\tpadding: 0;\n\t\t\tborder: none;\n\t\t}\n\n\t\t&__wrapper {\n\t\t\tposition: fixed;\n\t\t\toverflow: auto;\n\n\t\t\t&--left,\n\t\t\t&--right {\n\t\t\t\ttop: 0;\n\t\t\t\tmax-width: 100vw;\n\t\t\t\theight: 100vh;\n\n\t\t\t\t#{$root}__content {\n\t\t\t\t\theight: 100%;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&--left {\n\t\t\t\tleft: 0;\n\t\t\t}\n\n\t\t\t&--right {\n\t\t\t\tright: 0;\n\t\t\t}\n\n\t\t\t&--bottom,\n\t\t\t&--top {\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100vw;\n\t\t\t\tmax-height: 100vh;\n\n\t\t\t\t#{$root}__content {\n\t\t\t\t\twidth: 100%;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&--bottom {\n\t\t\t\tbottom: 0;\n\t\t\t}\n\n\t\t\t&--top {\n\t\t\t\ttop: 0;\n\t\t\t}\n\t\t}\n\n\t\t&__content {\n\t\t\tposition: relative;\n\t\t}\n\t}\n\n\t.kol-drawer__dialog .kol-card__content {\n\t\toverflow-y: auto;\n\t}\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { KolCardWcTag } from '../../core/component-names';\nimport type {\n\tAlignPropType,\n\tDrawerAPI,\n\tDrawerStates,\n\tHasCloserPropType,\n\tHeadingLevel,\n\tKoliBriModalEventCallbacks,\n\tLabelPropType,\n\tOpenPropType,\n} from '../../schema';\nimport { setState, validateAlign, validateHasCloser, validateLabel, validateOpen } from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { createUniqueId } from '../../utils/dev.utils';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\nimport { handleCancelOverlay } from '../../utils/tooltip-open-tracking';\nimport { watchHeadingLevel } from '../heading/validation';\n\n/**\n * @slot - The Content of drawer.\n */\n@Component({\n\ttag: 'kol-drawer',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolDrawer implements DrawerAPI {\n\t@Element() private readonly host?: HTMLKolDetailsElement;\n\tprivate dialogElement?: HTMLDialogElement;\n\tprivate dialogWrapperElement?: HTMLKolCardWcElement;\n\tprivate readonly cardHeadingId = createUniqueId('drawer-heading');\n\n\t@State() private isModal: boolean = true;\n\n\t/**\n\t * Opens the drawer. Pass true to open as a modal drawer.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async show(modal: boolean = false): Promise<void> {\n\t\tif (this.dialogElement?.open) {\n\t\t\treturn;\n\t\t}\n\t\tthis.isModal = modal;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_open: true,\n\t\t};\n\t\tif (modal) {\n\t\t\tthis.dialogElement?.showModal?.();\n\t\t} else {\n\t\t\tthis.dialogElement?.show?.();\n\t\t}\n\t\tthis._on?.onToggle?.(true);\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.toggle);\n\t\t}\n\t}\n\n\t/**\n\t * Opens the drawer as a modal.\n\t */\n\t@Method()\n\tpublic showModal(): Promise<void> {\n\t\treturn this.show(true);\n\t}\n\n\t/**\n\t * Opens the drawer.\n\t * @deprecated Use show() or showModal() instead.\n\t */\n\t@Method()\n\tpublic open(): Promise<void> {\n\t\treturn this.show(false);\n\t}\n\n\t/**\n\t * Closes the drawer.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async close(): Promise<void> {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_open: false,\n\t\t};\n\t\tconst wrapper = this.dialogWrapperElement;\n\t\tif (!wrapper) {\n\t\t\treturn;\n\t\t}\n\t\tif (window.getComputedStyle(wrapper).animationName === 'none') {\n\t\t\tthis.dialogElement?.close?.();\n\t\t}\n\t}\n\n\tprivate readonly _cardOn = { onClose: () => void this.close() };\n\n\tprivate getWrapperRef = (el: HTMLKolCardWcElement | undefined) => (this.dialogWrapperElement = el as HTMLKolCardWcElement);\n\tprivate renderDialogContent() {\n\t\tconst align = this.state._align as string;\n\t\treturn (\n\t\t\t<KolCardWcTag\n\t\t\t\tref={this.getWrapperRef}\n\t\t\t\tclass={clsx(`kol-drawer__wrapper`, `kol-drawer__wrapper--${align}`, {\n\t\t\t\t\t'kol-drawer__wrapper--open': this.state._open,\n\t\t\t\t\t'kol-drawer__wrapper--is-closing': this.state._open === false,\n\t\t\t\t})}\n\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t_headingId={this.cardHeadingId}\n\t\t\t\t_label={this.state._label}\n\t\t\t\t_level={this._level}\n\t\t\t\t_on={this._cardOn}\n\t\t\t>\n\t\t\t\t<div class=\"kol-drawer__content\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</KolCardWcTag>\n\t\t);\n\t}\n\n\tprivate getRef = (el: HTMLDialogElement | undefined) => {\n\t\tthis.dialogElement = el as HTMLDialogElement;\n\t\tsetTimeout(() => {\n\t\t\tvoid this.openOrCloseBasedOnState(); // handle initial state as soon as element is ready\n\t\t});\n\t};\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host class=\"kol-drawer\">\n\t\t\t\t<dialog\n\t\t\t\t\taria-labelledby={this.cardHeadingId}\n\t\t\t\t\taria-modal={this.isModal ? 'true' : 'false'}\n\t\t\t\t\tclass=\"kol-drawer__dialog\"\n\t\t\t\t\tonCancel={this.handleCancelEvent}\n\t\t\t\t\tref={this.getRef}\n\t\t\t\t>\n\t\t\t\t\t{this.renderDialogContent()}\n\t\t\t\t</dialog>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Opens/expands the element when truthy, closes/collapses when falsy.\n\t */\n\t@Prop() public _open?: OpenPropType;\n\n\t/**\n\t * Defines the visual orientation of the component.\n\t */\n\t@Prop() public _align?: AlignPropType;\n\n\t/**\n\t * Defines whether the element can be closed.\n\t * @TODO: Change type back to `HasCloserPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hasCloser?: boolean = false;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text.\n\t */\n\t@Prop() public _level?: HeadingLevel = 0;\n\n\t/**\n\t * Specifies the EventCallback function to be called when the drawer is closing.\n\t */\n\t@Prop() public _on?: KoliBriModalEventCallbacks;\n\n\t@State() public state: DrawerStates = {\n\t\t_label: '', // ⚠ required\n\t\t_open: false,\n\t\t_align: 'left',\n\t};\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_align')\n\tpublic validateAlign(value?: AlignPropType): void {\n\t\tvalidateAlign(this, value);\n\t}\n\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: HasCloserPropType): void {\n\t\tvalidateHasCloser(this, value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: OpenPropType) {\n\t\tif (typeof value === 'boolean') {\n\t\t\tvalidateOpen(this, value);\n\n\t\t\tif (this.dialogElement) {\n\t\t\t\t// handle property changes but not the initial validateOpen call\n\t\t\t\tvoid this.openOrCloseBasedOnState();\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate async openOrCloseBasedOnState() {\n\t\tif (this.state._open) {\n\t\t\tawait this.show(this.isModal);\n\t\t} else {\n\t\t\tawait this.close();\n\t\t}\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriModalEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tconst callbacks: KoliBriModalEventCallbacks = {};\n\t\t\tif (typeof value.onCancel === 'function') {\n\t\t\t\tcallbacks.onCancel = value.onCancel;\n\t\t\t}\n\t\t\tif (typeof value.onClose === 'function') {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tif (typeof value.onToggle === 'function') {\n\t\t\t\tcallbacks.onToggle = value.onToggle;\n\t\t\t}\n\t\t\tsetState<KoliBriModalEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\tprivate handleCancelEvent = (event: Event): void => {\n\t\thandleCancelOverlay(event);\n\t\tif (event.defaultPrevented) return;\n\n\t\tthis.state._on?.onCancel?.(event);\n\t\tif (event.defaultPrevented) return;\n\n\t\tif (this.host && !dispatchDomEvent(this.host, KolEvent.cancel)) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tprivate handleCloseDialog() {\n\t\tthis._on?.onClose?.();\n\t\tthis._on?.onToggle?.(false);\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.close);\n\t\t\tdispatchDomEvent(this.host, KolEvent.toggle);\n\t\t}\n\t}\n\n\tprivate readonly handleClose = () => {\n\t\tvoid (async () => {\n\t\t\tawait this.close();\n\t\t\tthis.handleCloseDialog();\n\t\t})();\n\t};\n\n\tprivate readonly handleAnimationEnd = (e: Event): void => {\n\t\tconst animationEvent = e as AnimationEvent;\n\t\tif (animationEvent.animationName.includes('slideOut')) {\n\t\t\tthis.dialogElement?.close?.();\n\t\t}\n\t};\n\n\tpublic componentDidLoad(): void {\n\t\tthis.dialogElement?.addEventListener('animationend', this.handleAnimationEnd);\n\t\tthis.dialogElement?.addEventListener('close', this.handleClose);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.dialogElement?.removeEventListener('animationend', this.handleAnimationEnd);\n\t\tthis.dialogElement?.removeEventListener('close', this.handleClose);\n\t}\n\n\tpublic componentWillLoad() {\n\t\tthis.validateAlign(this._align);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t}\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"kol-drawer.entry.esm.js","sources":["src/components/drawer/style.scss?tag=kol-drawer&mode=default&encapsulation=shadow","src/components/drawer/shadow.tsx"],"sourcesContent":["@use '../@shared/global' as *;\n@use '../@shared/card.mixin' as *;\n@use '../@shared/mixins' as *;\n@use '../tooltip/style.scss' as *;\n\n@layer kol-component {\n\t@include kol-card;\n\n\t.kol-drawer {\n\t\t$root: &;\n\n\t\t&__dialog {\n\t\t\tpadding: 0;\n\t\t\tborder: none;\n\t\t}\n\n\t\t&__wrapper {\n\t\t\tposition: fixed;\n\t\t\toverflow: auto;\n\n\t\t\t&--left,\n\t\t\t&--right {\n\t\t\t\ttop: 0;\n\t\t\t\tmax-width: 100vw;\n\t\t\t\theight: 100vh;\n\n\t\t\t\t#{$root}__content {\n\t\t\t\t\theight: 100%;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&--left {\n\t\t\t\tleft: 0;\n\t\t\t}\n\n\t\t\t&--right {\n\t\t\t\tright: 0;\n\t\t\t}\n\n\t\t\t&--bottom,\n\t\t\t&--top {\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100vw;\n\t\t\t\tmax-height: 100vh;\n\n\t\t\t\t#{$root}__content {\n\t\t\t\t\twidth: 100%;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&--bottom {\n\t\t\t\tbottom: 0;\n\t\t\t}\n\n\t\t\t&--top {\n\t\t\t\ttop: 0;\n\t\t\t}\n\t\t}\n\n\t\t&__content {\n\t\t\tposition: relative;\n\t\t}\n\t}\n\n\t.kol-drawer__dialog .kol-card__content {\n\t\toverflow-y: auto;\n\t}\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { KolCardWcTag } from '../../core/component-names';\nimport type {\n\tAlignPropType,\n\tDrawerAPI,\n\tDrawerStates,\n\tHasCloserPropType,\n\tHeadingLevel,\n\tKoliBriModalEventCallbacks,\n\tLabelPropType,\n\tOpenPropType,\n} from '../../schema';\nimport { setState, validateAlign, validateHasCloser, validateLabel, validateOpen } from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { createUniqueId } from '../../utils/dev.utils';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\nimport { handleCancelOverlay } from '../../utils/tooltip-open-tracking';\nimport { watchHeadingLevel } from '../heading/validation';\n\n/**\n * @slot - The Content of drawer.\n */\n@Component({\n\ttag: 'kol-drawer',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolDrawer implements DrawerAPI {\n\t@Element() private readonly host?: HTMLKolDetailsElement;\n\tprivate dialogElement?: HTMLDialogElement;\n\tprivate dialogWrapperElement?: HTMLKolCardWcElement;\n\tprivate readonly cardHeadingId = createUniqueId('drawer-heading');\n\n\t@State() private isModal: boolean = true;\n\n\t/**\n\t * Opens the drawer. Pass true to open as a modal drawer.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async show(modal: boolean = false): Promise<void> {\n\t\tif (this.dialogElement?.open) {\n\t\t\treturn;\n\t\t}\n\t\tthis.isModal = modal;\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_open: true,\n\t\t};\n\t\tif (modal) {\n\t\t\tthis.dialogElement?.showModal?.();\n\t\t} else {\n\t\t\tthis.dialogElement?.show?.();\n\t\t}\n\t\tthis._on?.onToggle?.(true);\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.toggle);\n\t\t}\n\t}\n\n\t/**\n\t * Opens the drawer as a modal.\n\t */\n\t@Method()\n\tpublic showModal(): Promise<void> {\n\t\treturn this.show(true);\n\t}\n\n\t/**\n\t * Opens the drawer.\n\t * @deprecated Use show() or showModal() instead.\n\t */\n\t@Method()\n\tpublic open(): Promise<void> {\n\t\treturn this.show(false);\n\t}\n\n\t/**\n\t * Closes the drawer.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async close(): Promise<void> {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_open: false,\n\t\t};\n\t\tconst wrapper = this.dialogWrapperElement;\n\t\tif (!wrapper) {\n\t\t\treturn;\n\t\t}\n\t\tif (window.getComputedStyle(wrapper).animationName === 'none') {\n\t\t\tthis.dialogElement?.close?.();\n\t\t}\n\t}\n\n\tprivate readonly _cardOn = { onClose: () => void this.close() };\n\n\tprivate getWrapperRef = (el: HTMLKolCardWcElement | undefined) => (this.dialogWrapperElement = el as HTMLKolCardWcElement);\n\tprivate renderDialogContent() {\n\t\tconst align = this.state._align as string;\n\t\treturn (\n\t\t\t<KolCardWcTag\n\t\t\t\tref={this.getWrapperRef}\n\t\t\t\tclass={clsx(`kol-drawer__wrapper`, `kol-drawer__wrapper--${align}`, {\n\t\t\t\t\t'kol-drawer__wrapper--open': this.state._open,\n\t\t\t\t\t'kol-drawer__wrapper--is-closing': this.state._open === false,\n\t\t\t\t})}\n\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t_headingId={this.cardHeadingId}\n\t\t\t\t_label={this.state._label}\n\t\t\t\t_level={this._level}\n\t\t\t\t_on={this._cardOn}\n\t\t\t>\n\t\t\t\t<div class=\"kol-drawer__content\">\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</KolCardWcTag>\n\t\t);\n\t}\n\n\tprivate getRef = (el: HTMLDialogElement | undefined) => {\n\t\tthis.dialogElement = el as HTMLDialogElement;\n\t\tsetTimeout(() => {\n\t\t\tvoid this.openOrCloseBasedOnState(); // handle initial state as soon as element is ready\n\t\t});\n\t};\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host class=\"kol-drawer\">\n\t\t\t\t<dialog\n\t\t\t\t\taria-labelledby={this.cardHeadingId}\n\t\t\t\t\taria-modal={this.isModal ? 'true' : 'false'}\n\t\t\t\t\tclass=\"kol-drawer__dialog\"\n\t\t\t\t\tonCancel={this.handleCancelEvent}\n\t\t\t\t\tref={this.getRef}\n\t\t\t\t>\n\t\t\t\t\t{this.renderDialogContent()}\n\t\t\t\t</dialog>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t/**\n\t * Opens/expands the element when truthy, closes/collapses when falsy.\n\t */\n\t@Prop() public _open?: OpenPropType;\n\n\t/**\n\t * Defines the visual orientation of the component.\n\t */\n\t@Prop() public _align?: AlignPropType;\n\n\t/**\n\t * Defines whether the element can be closed.\n\t * @TODO: Change type back to `HasCloserPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop() public _hasCloser?: boolean = false;\n\n\t/**\n\t * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t */\n\t@Prop() public _label!: LabelPropType;\n\n\t/**\n\t * Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text.\n\t */\n\t@Prop() public _level?: HeadingLevel = 0;\n\n\t/**\n\t * Specifies the EventCallback function to be called when the drawer is closing.\n\t */\n\t@Prop() public _on?: KoliBriModalEventCallbacks;\n\n\t@State() public state: DrawerStates = {\n\t\t_label: '', // ⚠ required\n\t\t_open: false,\n\t\t_align: 'left',\n\t};\n\n\t@Watch('_label')\n\tpublic validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value, {\n\t\t\trequired: true,\n\t\t});\n\t}\n\n\t@Watch('_align')\n\tpublic validateAlign(value?: AlignPropType): void {\n\t\tvalidateAlign(this, value);\n\t}\n\n\t@Watch('_hasCloser')\n\tpublic validateHasCloser(value?: HasCloserPropType): void {\n\t\tvalidateHasCloser(this, value);\n\t}\n\n\t@Watch('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: OpenPropType) {\n\t\tif (typeof value === 'boolean') {\n\t\t\tvalidateOpen(this, value);\n\n\t\t\tif (this.dialogElement) {\n\t\t\t\t// handle property changes but not the initial validateOpen call\n\t\t\t\tvoid this.openOrCloseBasedOnState();\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate async openOrCloseBasedOnState() {\n\t\tif (this.state._open) {\n\t\t\tawait this.show(this.isModal);\n\t\t} else {\n\t\t\tawait this.close();\n\t\t}\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriModalEventCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tconst callbacks: KoliBriModalEventCallbacks = {};\n\t\t\tif (typeof value.onCancel === 'function') {\n\t\t\t\tcallbacks.onCancel = value.onCancel;\n\t\t\t}\n\t\t\tif (typeof value.onClose === 'function') {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tif (typeof value.onToggle === 'function') {\n\t\t\t\tcallbacks.onToggle = value.onToggle;\n\t\t\t}\n\t\t\tsetState<KoliBriModalEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\tprivate handleCancelEvent = (event: Event): void => {\n\t\thandleCancelOverlay(event);\n\t\tif (event.defaultPrevented) return;\n\n\t\tthis.state._on?.onCancel?.(event);\n\t\tif (event.defaultPrevented) return;\n\n\t\tif (this.host && !dispatchDomEvent(this.host, KolEvent.cancel)) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tprivate handleCloseDialog() {\n\t\tthis._on?.onClose?.();\n\t\tthis._on?.onToggle?.(false);\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.close);\n\t\t\tdispatchDomEvent(this.host, KolEvent.toggle);\n\t\t}\n\t}\n\n\tprivate readonly handleClose = () => {\n\t\tvoid (async () => {\n\t\t\tawait this.close();\n\t\t\tthis.handleCloseDialog();\n\t\t})();\n\t};\n\n\tprivate readonly handleAnimationEnd = (e: Event): void => {\n\t\tconst animationEvent = e as AnimationEvent;\n\t\tif (animationEvent.animationName.includes('slideOut')) {\n\t\t\tthis.dialogElement?.close?.();\n\t\t}\n\t};\n\n\tpublic componentDidLoad(): void {\n\t\tthis.dialogElement?.addEventListener('animationend', this.handleAnimationEnd);\n\t\tthis.dialogElement?.addEventListener('close', this.handleClose);\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.dialogElement?.removeEventListener('animationend', this.handleAnimationEnd);\n\t\tthis.dialogElement?.removeEventListener('close', this.handleClose);\n\t}\n\n\tpublic componentWillLoad() {\n\t\tthis.validateAlign(this._align);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t}\n}\n"],"names":[],"mappings":"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"}

package/dist/kolibri/kol-drawer.entry.js

@@ -1,5 +1,5 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e,H as o,g as t}from"./index-DqvPZ16l.js";import{d as i}from"./component-names-Dy77vq43.js";import{s as l}from"./common-DEEjER7G.js";import{v as r}from"./align-ChLoh-Dq.js";import{v as a}from"./has-closer-GBI76y-L.js";import{v as s}from"./label-Cg7TG_7b.js";import{v as d}from"./open-Djbpz6kg.js";import{c}from"./clsx-COFh-Vc8.js";import{c as h}from"./dev.utils-Cv9uCwkA.js";import{d as f,K as p}from"./events-BhfZTW2e.js";import{h as m}from"./tooltip-open-tracking-D3tCiiGP.js";import{w as u}from"./validation-VhuthteS.js";import"./level-CfQolHx4.js";import"./normalizers-pgU77mXp.js";import"./_Uint8Array-kJHDjtoP.js";import"./isArray-CcrBs4JM.js";const b='@charset "UTF-8";\n/*\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     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\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 text color from his parent element.\n     */\n    color: inherit;\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: white;\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: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: 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    align-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    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  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1780919027063"); /* IE9*/\n  src: url("kolicons.eot?t=1780919027063#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1780919027063") format("woff2"), url("kolicons.woff?t=1780919027063") format("woff"), url("kolicons.ttf?t=1780919027063") format("truetype"), url("kolicons.svg?t=1780919027063#kolicons") format("svg"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=" kolicon-"] {\n    font-family: "kolicons";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: "\\ea01";\n  }\n  .kolicon-alert-info::before {\n    content: "\\ea02";\n  }\n  .kolicon-alert-success::before {\n    content: "\\ea03";\n  }\n  .kolicon-alert-warning::before {\n    content: "\\ea04";\n  }\n  .kolicon-check::before {\n    content: "\\ea05";\n  }\n  .kolicon-chevron-double-left::before {\n    content: "\\ea06";\n  }\n  .kolicon-chevron-double-right::before {\n    content: "\\ea07";\n  }\n  .kolicon-chevron-down::before {\n    content: "\\ea08";\n  }\n  .kolicon-chevron-left::before {\n    content: "\\ea09";\n  }\n  .kolicon-chevron-right::before {\n    content: "\\ea0a";\n  }\n  .kolicon-chevron-up::before {\n    content: "\\ea0b";\n  }\n  .kolicon-cogwheel::before {\n    content: "\\ea0c";\n  }\n  .kolicon-cross::before {\n    content: "\\ea0d";\n  }\n  .kolicon-eye-closed::before {\n    content: "\\ea0e";\n  }\n  .kolicon-eye::before {\n    content: "\\ea0f";\n  }\n  .kolicon-house::before {\n    content: "\\ea10";\n  }\n  .kolicon-kolibri::before {\n    content: "\\ea11";\n  }\n  .kolicon-link-external::before {\n    content: "\\ea12";\n  }\n  .kolicon-link::before {\n    content: "\\ea13";\n  }\n  .kolicon-minus::before {\n    content: "\\ea14";\n  }\n  .kolicon-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\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    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\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: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card :host {\n    display: inline-block;\n  }\n  .kol-card .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-card .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-card .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-card {\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    display: grid;\n    height: 100%;\n    overflow: visible;\n    grid-template-areas: "header  close" "content content";\n    grid-template-columns: 1fr min-content;\n    grid-template-rows: min-content 1fr;\n  }\n  .kol-card__header {\n    align-self: start;\n    grid-area: header;\n  }\n  .kol-card__content {\n    align-self: stretch;\n    grid-area: content;\n  }\n  .kol-card__close-button {\n    grid-area: close;\n  }\n  .kol-drawer__dialog {\n    padding: 0;\n    border: none;\n  }\n  .kol-drawer__wrapper {\n    position: fixed;\n    overflow: auto;\n  }\n  .kol-drawer__wrapper--left, .kol-drawer__wrapper--right {\n    top: 0;\n    max-width: 100vw;\n    height: 100vh;\n  }\n  .kol-drawer__wrapper--left .kol-drawer__content, .kol-drawer__wrapper--right .kol-drawer__content {\n    height: 100%;\n  }\n  .kol-drawer__wrapper--left {\n    left: 0;\n  }\n  .kol-drawer__wrapper--right {\n    right: 0;\n  }\n  .kol-drawer__wrapper--bottom, .kol-drawer__wrapper--top {\n    left: 0;\n    width: 100vw;\n    max-height: 100vh;\n  }\n  .kol-drawer__wrapper--bottom .kol-drawer__content, .kol-drawer__wrapper--top .kol-drawer__content {\n    width: 100%;\n  }\n  .kol-drawer__wrapper--bottom {\n    bottom: 0;\n  }\n  .kol-drawer__wrapper--top {\n    top: 0;\n  }\n  .kol-drawer__content {\n    position: relative;\n  }\n  .kol-drawer__dialog .kol-card__content {\n    overflow-y: auto;\n  }\n}';const k=class{constructor(e){n(this,e);this.cardHeadingId=h("drawer-heading");this.isModal=true;this._cardOn={onClose:()=>void this.close()};this.getWrapperRef=n=>this.dialogWrapperElement=n;this.getRef=n=>{this.dialogElement=n;setTimeout((()=>{void this.openOrCloseBasedOnState()}))};this._hasCloser=false;this._level=0;this.state={_label:"",_open:false,_align:"left"};this.handleCancelEvent=n=>{var e,o;m(n);if(n.defaultPrevented)return;(o=(e=this.state._on)===null||e===void 0?void 0:e.onCancel)===null||o===void 0?void 0:o.call(e,n);if(n.defaultPrevented)return;if(this.host&&!f(this.host,p.cancel)){n.preventDefault()}};this.handleClose=()=>{void(async()=>{await this.close();this.handleCloseDialog()})()};this.handleAnimationEnd=n=>{var e,o;const t=n;if(t.animationName.includes("slideOut")){(o=(e=this.dialogElement)===null||e===void 0?void 0:e.close)===null||o===void 0?void 0:o.call(e)}}}async show(n=false){var e,o,t,i,l,r,a;if((e=this.dialogElement)===null||e===void 0?void 0:e.open){return}this.isModal=n;this.state=Object.assign(Object.assign({},this.state),{_open:true});if(n){(t=(o=this.dialogElement)===null||o===void 0?void 0:o.showModal)===null||t===void 0?void 0:t.call(o)}else{(l=(i=this.dialogElement)===null||i===void 0?void 0:i.show)===null||l===void 0?void 0:l.call(i)}(a=(r=this._on)===null||r===void 0?void 0:r.onToggle)===null||a===void 0?void 0:a.call(r,true);if(this.host){f(this.host,p.toggle)}}showModal(){return this.show(true)}open(){return this.show(false)}async close(){var n,e;this.state=Object.assign(Object.assign({},this.state),{_open:false});const o=this.dialogWrapperElement;if(!o){return}if(window.getComputedStyle(o).animationName==="none"){(e=(n=this.dialogElement)===null||n===void 0?void 0:n.close)===null||e===void 0?void 0:e.call(n)}}renderDialogContent(){const n=this.state._align;return e(i,{ref:this.getWrapperRef,class:c(`kol-drawer__wrapper`,`kol-drawer__wrapper--${n}`,{"kol-drawer__wrapper--open":this.state._open,"kol-drawer__wrapper--is-closing":this.state._open===false}),_hasCloser:this.state._hasCloser,_headingId:this.cardHeadingId,_label:this.state._label,_level:this._level,_on:this._cardOn},e("div",{class:"kol-drawer__content"},e("slot",null)))}render(){return e(o,{key:"9ddd7432cb3f0a79b4020144378e951d76d6429b",class:"kol-drawer"},e("dialog",{key:"4187cc6a21ca4471a30f1db9f860d5a141372157","aria-labelledby":this.cardHeadingId,"aria-modal":this.isModal?"true":"false",class:"kol-drawer__dialog",onCancel:this.handleCancelEvent,ref:this.getRef},this.renderDialogContent()))}validateLabel(n){s(this,n,{required:true})}validateAlign(n){r(this,n)}validateHasCloser(n){a(this,n)}validateLevel(n){u(this,n)}validateOpen(n){if(typeof n==="boolean"){d(this,n);if(this.dialogElement){void this.openOrCloseBasedOnState()}}}async openOrCloseBasedOnState(){if(this.state._open){await this.show(this.isModal)}else{await this.close()}}validateOn(n){if(typeof n==="object"&&n!==null){const e={};if(typeof n.onCancel==="function"){e.onCancel=n.onCancel}if(typeof n.onClose==="function"){e.onClose=n.onClose}if(typeof n.onToggle==="function"){e.onToggle=n.onToggle}l(this,"_on",e)}}handleCloseDialog(){var n,e,o,t;(e=(n=this._on)===null||n===void 0?void 0:n.onClose)===null||e===void 0?void 0:e.call(n);(t=(o=this._on)===null||o===void 0?void 0:o.onToggle)===null||t===void 0?void 0:t.call(o,false);if(this.host){f(this.host,p.close);f(this.host,p.toggle)}}componentDidLoad(){var n,e;(n=this.dialogElement)===null||n===void 0?void 0:n.addEventListener("animationend",this.handleAnimationEnd);(e=this.dialogElement)===null||e===void 0?void 0:e.addEventListener("close",this.handleClose)}disconnectedCallback(){var n,e;(n=this.dialogElement)===null||n===void 0?void 0:n.removeEventListener("animationend",this.handleAnimationEnd);(e=this.dialogElement)===null||e===void 0?void 0:e.removeEventListener("close",this.handleClose)}componentWillLoad(){this.validateAlign(this._align);this.validateHasCloser(this._hasCloser);this.validateLabel(this._label);this.validateOpen(this._open);this.validateLevel(this._level);this.validateOn(this._on)}get host(){return t(this)}static get watchers(){return{_label:["validateLabel"],_align:["validateAlign"],_hasCloser:["validateHasCloser"],_level:["validateLevel"],_open:["validateOpen"],_on:["validateOn"]}}};k.style={default:b};export{k as kol_drawer};
+import{r as n,h as e,H as o,g as t}from"./index-CfYfRjdO.js";import{d as i}from"./component-names-Dy77vq43.js";import{s as l}from"./common-Cbb6Axov.js";import{v as r}from"./align-BdqBkiyq.js";import{v as a}from"./has-closer-BHa3nc5C.js";import{v as s}from"./label-We78Dt9U.js";import{v as d}from"./open-DJPD9Hvv.js";import{c}from"./clsx-COFh-Vc8.js";import{c as h}from"./dev.utils-CBuLoTMV.js";import{d as f,K as p}from"./events-BhfZTW2e.js";import{h as m}from"./tooltip-open-tracking-D3tCiiGP.js";import{w as u}from"./validation-BVCCGUzN.js";import"./level-DRQEJIoR.js";import"./normalizers-iLdS6AQE.js";import"./_Uint8Array-kJHDjtoP.js";import"./isArray-CcrBs4JM.js";const b='@charset "UTF-8";\n/*\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     * The `max(…, 44px)` floor guarantees the WCAG 2.5.5 (AAA) target size of 44px:\n     * `to-rem(44)` runs the value through a `calc()` rem round-trip which can lose\n     * sub-pixel precision and resolve to e.g. 43.99px depending on the browser\'s\n     * rounding, dropping just below the required minimum.\n     */\n    --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px);\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     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\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 text color from his parent element.\n     */\n    color: inherit;\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: white;\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: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: 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    align-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    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  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1783496448056"); /* IE9*/\n  src: url("kolicons.eot?t=1783496448056#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1783496448056") format("woff2"), url("kolicons.woff?t=1783496448056") format("woff"), url("kolicons.ttf?t=1783496448056") format("truetype"), url("kolicons.svg?t=1783496448056#kolicons") format("svg"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=" kolicon-"] {\n    font-family: "kolicons";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: "\\ea01";\n  }\n  .kolicon-alert-info::before {\n    content: "\\ea02";\n  }\n  .kolicon-alert-success::before {\n    content: "\\ea03";\n  }\n  .kolicon-alert-warning::before {\n    content: "\\ea04";\n  }\n  .kolicon-check::before {\n    content: "\\ea05";\n  }\n  .kolicon-chevron-double-left::before {\n    content: "\\ea06";\n  }\n  .kolicon-chevron-double-right::before {\n    content: "\\ea07";\n  }\n  .kolicon-chevron-down::before {\n    content: "\\ea08";\n  }\n  .kolicon-chevron-left::before {\n    content: "\\ea09";\n  }\n  .kolicon-chevron-right::before {\n    content: "\\ea0a";\n  }\n  .kolicon-chevron-up::before {\n    content: "\\ea0b";\n  }\n  .kolicon-cogwheel::before {\n    content: "\\ea0c";\n  }\n  .kolicon-cross::before {\n    content: "\\ea0d";\n  }\n  .kolicon-eye-closed::before {\n    content: "\\ea0e";\n  }\n  .kolicon-eye::before {\n    content: "\\ea0f";\n  }\n  .kolicon-house::before {\n    content: "\\ea10";\n  }\n  .kolicon-kolibri::before {\n    content: "\\ea11";\n  }\n  .kolicon-link-external::before {\n    content: "\\ea12";\n  }\n  .kolicon-link::before {\n    content: "\\ea13";\n  }\n  .kolicon-minus::before {\n    content: "\\ea14";\n  }\n  .kolicon-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\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    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\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: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-card :host {\n    display: inline-block;\n  }\n  .kol-card .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-card .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-card .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-card {\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    display: grid;\n    height: 100%;\n    overflow: visible;\n    grid-template-areas: "header  close" "content content";\n    grid-template-columns: 1fr min-content;\n    grid-template-rows: min-content 1fr;\n  }\n  .kol-card__header {\n    align-self: start;\n    grid-area: header;\n  }\n  .kol-card__content {\n    align-self: stretch;\n    grid-area: content;\n  }\n  .kol-card__close-button {\n    grid-area: close;\n  }\n  .kol-drawer__dialog {\n    padding: 0;\n    border: none;\n  }\n  .kol-drawer__wrapper {\n    position: fixed;\n    overflow: auto;\n  }\n  .kol-drawer__wrapper--left, .kol-drawer__wrapper--right {\n    top: 0;\n    max-width: 100vw;\n    height: 100vh;\n  }\n  .kol-drawer__wrapper--left .kol-drawer__content, .kol-drawer__wrapper--right .kol-drawer__content {\n    height: 100%;\n  }\n  .kol-drawer__wrapper--left {\n    left: 0;\n  }\n  .kol-drawer__wrapper--right {\n    right: 0;\n  }\n  .kol-drawer__wrapper--bottom, .kol-drawer__wrapper--top {\n    left: 0;\n    width: 100vw;\n    max-height: 100vh;\n  }\n  .kol-drawer__wrapper--bottom .kol-drawer__content, .kol-drawer__wrapper--top .kol-drawer__content {\n    width: 100%;\n  }\n  .kol-drawer__wrapper--bottom {\n    bottom: 0;\n  }\n  .kol-drawer__wrapper--top {\n    top: 0;\n  }\n  .kol-drawer__content {\n    position: relative;\n  }\n  .kol-drawer__dialog .kol-card__content {\n    overflow-y: auto;\n  }\n}';const k=class{constructor(e){n(this,e);this.cardHeadingId=h("drawer-heading");this.isModal=true;this._cardOn={onClose:()=>void this.close()};this.getWrapperRef=n=>this.dialogWrapperElement=n;this.getRef=n=>{this.dialogElement=n;setTimeout((()=>{void this.openOrCloseBasedOnState()}))};this._hasCloser=false;this._level=0;this.state={_label:"",_open:false,_align:"left"};this.handleCancelEvent=n=>{var e,o;m(n);if(n.defaultPrevented)return;(o=(e=this.state._on)===null||e===void 0?void 0:e.onCancel)===null||o===void 0?void 0:o.call(e,n);if(n.defaultPrevented)return;if(this.host&&!f(this.host,p.cancel)){n.preventDefault()}};this.handleClose=()=>{void(async()=>{await this.close();this.handleCloseDialog()})()};this.handleAnimationEnd=n=>{var e,o;const t=n;if(t.animationName.includes("slideOut")){(o=(e=this.dialogElement)===null||e===void 0?void 0:e.close)===null||o===void 0?void 0:o.call(e)}}}async show(n=false){var e,o,t,i,l,r,a;if((e=this.dialogElement)===null||e===void 0?void 0:e.open){return}this.isModal=n;this.state=Object.assign(Object.assign({},this.state),{_open:true});if(n){(t=(o=this.dialogElement)===null||o===void 0?void 0:o.showModal)===null||t===void 0?void 0:t.call(o)}else{(l=(i=this.dialogElement)===null||i===void 0?void 0:i.show)===null||l===void 0?void 0:l.call(i)}(a=(r=this._on)===null||r===void 0?void 0:r.onToggle)===null||a===void 0?void 0:a.call(r,true);if(this.host){f(this.host,p.toggle)}}showModal(){return this.show(true)}open(){return this.show(false)}async close(){var n,e;this.state=Object.assign(Object.assign({},this.state),{_open:false});const o=this.dialogWrapperElement;if(!o){return}if(window.getComputedStyle(o).animationName==="none"){(e=(n=this.dialogElement)===null||n===void 0?void 0:n.close)===null||e===void 0?void 0:e.call(n)}}renderDialogContent(){const n=this.state._align;return e(i,{ref:this.getWrapperRef,class:c(`kol-drawer__wrapper`,`kol-drawer__wrapper--${n}`,{"kol-drawer__wrapper--open":this.state._open,"kol-drawer__wrapper--is-closing":this.state._open===false}),_hasCloser:this.state._hasCloser,_headingId:this.cardHeadingId,_label:this.state._label,_level:this._level,_on:this._cardOn},e("div",{class:"kol-drawer__content"},e("slot",null)))}render(){return e(o,{key:"14aa4c6b978a89943fe8d83901ede517d8ff6032",class:"kol-drawer"},e("dialog",{key:"db250f54f95e8658e6929c3cfd4b2afd21ca62ab","aria-labelledby":this.cardHeadingId,"aria-modal":this.isModal?"true":"false",class:"kol-drawer__dialog",onCancel:this.handleCancelEvent,ref:this.getRef},this.renderDialogContent()))}validateLabel(n){s(this,n,{required:true})}validateAlign(n){r(this,n)}validateHasCloser(n){a(this,n)}validateLevel(n){u(this,n)}validateOpen(n){if(typeof n==="boolean"){d(this,n);if(this.dialogElement){void this.openOrCloseBasedOnState()}}}async openOrCloseBasedOnState(){if(this.state._open){await this.show(this.isModal)}else{await this.close()}}validateOn(n){if(typeof n==="object"&&n!==null){const e={};if(typeof n.onCancel==="function"){e.onCancel=n.onCancel}if(typeof n.onClose==="function"){e.onClose=n.onClose}if(typeof n.onToggle==="function"){e.onToggle=n.onToggle}l(this,"_on",e)}}handleCloseDialog(){var n,e,o,t;(e=(n=this._on)===null||n===void 0?void 0:n.onClose)===null||e===void 0?void 0:e.call(n);(t=(o=this._on)===null||o===void 0?void 0:o.onToggle)===null||t===void 0?void 0:t.call(o,false);if(this.host){f(this.host,p.close);f(this.host,p.toggle)}}componentDidLoad(){var n,e;(n=this.dialogElement)===null||n===void 0?void 0:n.addEventListener("animationend",this.handleAnimationEnd);(e=this.dialogElement)===null||e===void 0?void 0:e.addEventListener("close",this.handleClose)}disconnectedCallback(){var n,e;(n=this.dialogElement)===null||n===void 0?void 0:n.removeEventListener("animationend",this.handleAnimationEnd);(e=this.dialogElement)===null||e===void 0?void 0:e.removeEventListener("close",this.handleClose)}componentWillLoad(){this.validateAlign(this._align);this.validateHasCloser(this._hasCloser);this.validateLabel(this._label);this.validateOpen(this._open);this.validateLevel(this._level);this.validateOn(this._on)}get host(){return t(this)}static get watchers(){return{_label:["validateLabel"],_align:["validateAlign"],_hasCloser:["validateHasCloser"],_level:["validateLevel"],_open:["validateOpen"],_on:["validateOn"]}}};k.style={default:b};export{k as kol_drawer};
 //# sourceMappingURL=kol-drawer.entry.js.map

package/dist/kolibri/kol-drawer.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["registerInstance","h","Host","getElement","KolCardWcTag","setState","validateAlign","validateHasCloser","validateLabel","validateOpen","clsx","createUniqueId","dispatchDomEvent","KolEvent","handleCancelOverlay","watchHeadingLevel","defaultStyleCss","KolDrawer","constructor","hostRef","this","cardHeadingId","isModal","_cardOn","onClose","close","getWrapperRef","el","dialogWrapperElement","getRef","dialogElement","setTimeout","openOrCloseBasedOnState","_hasCloser","_level","state","_label","_open","_align","handleCancelEvent","event","_a","_b","defaultPrevented","_on","onCancel","call","host","cancel","preventDefault","handleClose","handleCloseDialog","handleAnimationEnd","e","animationEvent","animationName","includes","show","modal","_c","_d","_e","_f","_g","open","Object","assign","showModal","onToggle","toggle","wrapper","window","getComputedStyle","renderDialogContent","align","ref","class","_headingId","render","key","value","required","validateLevel","validateOn","callbacks","componentDidLoad","addEventListener","disconnectedCallback","removeEventListener","componentWillLoad","watchers","style","default"],"sources":["0"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["registerInstance","h","Host","getElement","KolCardWcTag","setState","validateAlign","validateHasCloser","validateLabel","validateOpen","clsx","createUniqueId","dispatchDomEvent","KolEvent","handleCancelOverlay","watchHeadingLevel","defaultStyleCss","KolDrawer","constructor","hostRef","this","cardHeadingId","isModal","_cardOn","onClose","close","getWrapperRef","el","dialogWrapperElement","getRef","dialogElement","setTimeout","openOrCloseBasedOnState","_hasCloser","_level","state","_label","_open","_align","handleCancelEvent","event","_a","_b","defaultPrevented","_on","onCancel","call","host","cancel","preventDefault","handleClose","handleCloseDialog","handleAnimationEnd","e","animationEvent","animationName","includes","show","modal","_c","_d","_e","_f","_g","open","Object","assign","showModal","onToggle","toggle","wrapper","window","getComputedStyle","renderDialogContent","align","ref","class","_headingId","render","key","value","required","validateLevel","validateOn","callbacks","componentDidLoad","addEventListener","disconnectedCallback","removeEventListener","componentWillLoad","watchers","style","default"],"sources":["0"],"mappings":"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","ignoreList":[]}

package/dist/kolibri/kol-form.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"kol-form.entry.esm.js","sources":["src/schema/props/error-list.ts","src/components/form/style.scss?tag=kol-form&mode=default&encapsulation=shadow","src/components/form/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport type { EventCallback } from '../types';\nimport { watchValidator } from '../utils';\n\n/* types */\nexport type ErrorListPropType = {\n\tmessage: string;\n\tselector: string | EventCallback<Event>;\n};\n\nexport type PropErrorList = {\n\terrorList: ErrorListPropType[];\n};\n\n/* validator */\nexport const validateErrorList = (component: Generic.Element.Component, value?: ErrorListPropType[]): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t'errorList',\n\t\t(value): boolean => Array.isArray(value) && value.find((v) => !(typeof v === 'string' || typeof v === 'function')) === undefined,\n\t\tnew Set(['string', 'function']),\n\t\tvalue,\n\t);\n};\n","@use '../@shared/mixins' as *;\n@use '../@shared/global' as *;\n@use '../host-display-block' as *;\n@use '../@shared/link.mixin' as *;\n@use '../@shared/alert.mixin' as *;\n\n@layer kol-component {\n\t@include kol-link-styles('kol-link');\n\t@include kol-alert;\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { validateErrorList, watchBoolean, watchString } from '../../schema';\n\nimport { translate } from '../../i18n';\n\nimport { KolLinkWcTag } from '../../core/component-names';\nimport KolAlertFc from '../../functional-components/Alert';\nimport type { ErrorListPropType, FormAPI, FormStates, KoliBriFormCallbacks, Stringified } from '../../schema';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\n\n/**\n * The **Form** component is used to wrap all input fields, correctly position the required-fields hint text, and forward the `submit` and `reset` events.\n *\n * @slot - The content of the form.\n */\n@Component({\n\ttag: 'kol-form',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolForm implements FormAPI {\n\t@Element() private readonly host?: HTMLKolFormElement;\n\terrorListBlock?: HTMLElement;\n\terrorListFirstLink?: HTMLElement;\n\tprivate readonly translateErrorListMessage = translate('kol-error-list-message');\n\tprivate readonly translateErrorList = translate('kol-error-list');\n\tprivate readonly translateFormDescription = translate('kol-form-description');\n\n\t/* Hint: This method may not be used at all while events are handled in form/controller#propagateSubmitEventToForm */\n\tprivate readonly onSubmit = (event: Event) => {\n\t\tevent.preventDefault();\n\n\t\tif (typeof this.state._on?.onSubmit === 'function') {\n\t\t\tthis.state._on?.onSubmit(event as SubmitEvent);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.submit);\n\t\t}\n\t};\n\n\tprivate readonly onReset = (event: Event) => {\n\t\tevent.preventDefault();\n\t\tif (typeof this.state._on?.onReset === 'function') {\n\t\t\tthis.state._on?.onReset(event);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.reset);\n\t\t}\n\t};\n\n\tprivate readonly handleLinkClick = (selector: string) => {\n\t\tconst targetElement = document.querySelector<HTMLElement>(selector);\n\t\tif (targetElement && typeof targetElement.focus === 'function') {\n\t\t\ttargetElement.scrollIntoView({ behavior: 'smooth' });\n\t\t\ttargetElement.focus();\n\t\t}\n\t};\n\n\tprivate readonly setBlockElement = (el?: HTMLElement) => (this.errorListBlock = el);\n\n\tprivate readonly setFirstLinkElement = (el?: HTMLKolLinkWcElement) => (this.errorListFirstLink = el as HTMLElement);\n\n\tprivate renderErrorList(errorList?: ErrorListPropType[]): JSX.Element {\n\t\treturn (\n\t\t\t<KolAlertFc class=\"kol-form__alert\" ref={this.setBlockElement} type=\"error\" variant=\"card\" label={this.translateErrorListMessage}>\n\t\t\t\t<nav aria-label={this.translateErrorList}>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t{errorList?.map((error, index) => (\n\t\t\t\t\t\t\t<li key={index}>\n\t\t\t\t\t\t\t\t<KolLinkWcTag\n\t\t\t\t\t\t\t\t\tclass=\"kol-form__link\"\n\t\t\t\t\t\t\t\t\t_href=\"\"\n\t\t\t\t\t\t\t\t\t_label={error.message}\n\t\t\t\t\t\t\t\t\t_on={{ onClick: typeof error.selector === 'string' ? () => this.handleLinkClick(String(error.selector)) : error.selector }}\n\t\t\t\t\t\t\t\t\tref={index === 0 ? this.setFirstLinkElement : undefined}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</ul>\n\t\t\t\t</nav>\n\t\t\t</KolAlertFc>\n\t\t);\n\t}\n\n\tprivate renderFormElement(): JSX.Element {\n\t\treturn (\n\t\t\t<form class=\"kol-form\" method=\"post\" onSubmit={this.onSubmit} onReset={this.onReset} noValidate>\n\t\t\t\t{this.state._requiredText === true ? (\n\t\t\t\t\t<p>\n\t\t\t\t\t\t<div class=\"kol-form__mandatory-fields-hint\">{this.translateFormDescription}</div>\n\t\t\t\t\t</p>\n\t\t\t\t) : typeof this.state._requiredText === 'string' && this.state._requiredText.length > 0 ? (\n\t\t\t\t\t<p>\n\t\t\t\t\t\t<div class=\"kol-form__mandatory-fields-hint\">{this.state._requiredText}</div>\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t\t<slot />\n\t\t\t</form>\n\t\t);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst hasErrorList = Array.isArray(this._errorList) && this._errorList.length > 0;\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{hasErrorList && this.renderErrorList(this._errorList)}\n\t\t\t\t{this.renderFormElement()}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate scrollToErrorList(): void {\n\t\tthis.errorListBlock?.scrollIntoView({\n\t\t\tbehavior: 'smooth',\n\t\t\tblock: 'start',\n\t\t});\n\t\tsetTimeout(() => {\n\t\t\tthis.errorListFirstLink?.querySelector('a')?.focus();\n\t\t}, 250);\n\t}\n\n\t/**\n\t * Scrolls to the error list and focuses the first link.\n\t */\n\t@Method()\n\tasync focusErrorList(): Promise<void> {\n\t\tthis.scrollToErrorList();\n\t\treturn Promise.resolve();\n\t}\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Form-Events an.\n\t */\n\t@Prop() public _on?: KoliBriFormCallbacks;\n\n\t/**\n\t * Defines whether the mandatory-fields-hint should be shown. A string overrides the default text.\n\t */\n\t@Prop() public _requiredText?: Stringified<boolean> = true;\n\t/**\n\t * A list of error objects that each describe an issue encountered in the form.\n\t * Each error object contains a message and a selector for identifying the form element related to the error.\n\t */\n\t@Prop() public _errorList?: ErrorListPropType[];\n\n\t@State() public state: FormStates = {};\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriFormCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t@Watch('_requiredText')\n\tpublic validateRequiredText(value?: Stringified<boolean>): void {\n\t\tif (typeof value === 'boolean') {\n\t\t\twatchBoolean(this, '_requiredText', value);\n\t\t} else {\n\t\t\twatchString(this, '_requiredText', value);\n\t\t}\n\t}\n\n\t@Watch('_errorList')\n\tpublic validateErrorList(value?: ErrorListPropType[]): void {\n\t\tvalidateErrorList(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRequiredText(this._requiredText);\n\t\tthis.validateErrorList(this._errorList);\n\t}\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"kol-form.entry.esm.js","sources":["src/schema/props/error-list.ts","src/components/form/style.scss?tag=kol-form&mode=default&encapsulation=shadow","src/components/form/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport type { KolFocusOptions } from '../interfaces';\nimport type { EventCallback } from '../types';\nimport { watchValidator } from '../utils';\n\n/* types */\nexport type ErrorListPropType = {\n\tmessage: string;\n\tselector: string | EventCallback<Event>;\n\toptions?: KolFocusOptions;\n};\n\nexport type PropErrorList = {\n\terrorList: ErrorListPropType[];\n};\n\n/* validator */\nexport const validateErrorList = (component: Generic.Element.Component, value?: ErrorListPropType[]): void => {\n\twatchValidator(\n\t\tcomponent,\n\t\t'errorList',\n\t\t(value): boolean => Array.isArray(value) && value.find((v) => !(typeof v === 'string' || typeof v === 'function')) === undefined,\n\t\tnew Set(['string', 'function']),\n\t\tvalue,\n\t);\n};\n","@use '../@shared/mixins' as *;\n@use '../@shared/global' as *;\n@use '../host-display-block' as *;\n@use '../@shared/link.mixin' as *;\n@use '../@shared/alert.mixin' as *;\n\n@layer kol-component {\n\t@include kol-link-styles('kol-link');\n\t@include kol-alert;\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { validateErrorList, watchBoolean, watchString } from '../../schema';\n\nimport { translate } from '../../i18n';\n\nimport { KolLinkWcTag } from '../../core/component-names';\nimport KolAlertFc from '../../functional-components/Alert';\nimport type { ErrorListPropType, FormAPI, FormStates, KolFocusOptions, KoliBriFormCallbacks, Stringified } from '../../schema';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\n\n/**\n * The **Form** component is used to wrap all input fields, correctly position the required-fields hint text, and forward the `submit` and `reset` events.\n *\n * @slot - The content of the form.\n */\n@Component({\n\ttag: 'kol-form',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolForm implements FormAPI {\n\t@Element() private readonly host?: HTMLKolFormElement;\n\terrorListBlock?: HTMLElement;\n\terrorListFirstLink?: HTMLElement;\n\tscrollOptionsFallback: KolFocusOptions = {\n\t\tbehavior: 'smooth',\n\t\tblock: 'nearest',\n\t};\n\tprivate readonly translateErrorListMessage = translate('kol-error-list-message');\n\tprivate readonly translateErrorList = translate('kol-error-list');\n\tprivate readonly translateFormDescription = translate('kol-form-description');\n\n\t/* Hint: This method may not be used at all while events are handled in form/controller#propagateSubmitEventToForm */\n\tprivate readonly onSubmit = (event: Event) => {\n\t\tevent.preventDefault();\n\n\t\tif (typeof this.state._on?.onSubmit === 'function') {\n\t\t\tthis.state._on?.onSubmit(event as SubmitEvent);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.submit);\n\t\t}\n\t};\n\n\tprivate readonly onReset = (event: Event) => {\n\t\tevent.preventDefault();\n\t\tif (typeof this.state._on?.onReset === 'function') {\n\t\t\tthis.state._on?.onReset(event);\n\t\t}\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.reset);\n\t\t}\n\t};\n\n\tprivate readonly handleLinkClick = (selector: string, options?: KolFocusOptions) => {\n\t\tconst targetElement = document.querySelector<HTMLElement>(selector);\n\t\tif (targetElement && typeof targetElement.focus === 'function') {\n\t\t\ttargetElement.focus(options ? options : this.scrollOptionsFallback);\n\t\t}\n\t};\n\n\tprivate readonly setBlockElement = (el?: HTMLElement) => (this.errorListBlock = el);\n\n\tprivate readonly setFirstLinkElement = (el?: HTMLKolLinkWcElement) => (this.errorListFirstLink = el as HTMLElement);\n\n\tprivate renderErrorList(errorList?: ErrorListPropType[]): JSX.Element {\n\t\treturn (\n\t\t\t<KolAlertFc class=\"kol-form__alert\" ref={this.setBlockElement} type=\"error\" variant=\"card\" label={this.translateErrorListMessage}>\n\t\t\t\t<nav aria-label={this.translateErrorList}>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t{errorList?.map((error, index) => (\n\t\t\t\t\t\t\t<li key={index}>\n\t\t\t\t\t\t\t\t<KolLinkWcTag\n\t\t\t\t\t\t\t\t\tclass=\"kol-form__link\"\n\t\t\t\t\t\t\t\t\t_href=\"\"\n\t\t\t\t\t\t\t\t\t_label={error.message}\n\t\t\t\t\t\t\t\t\t_on={{ onClick: typeof error.selector === 'string' ? () => this.handleLinkClick(String(error.selector), error.options) : error.selector }}\n\t\t\t\t\t\t\t\t\tref={index === 0 ? this.setFirstLinkElement : undefined}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</ul>\n\t\t\t\t</nav>\n\t\t\t</KolAlertFc>\n\t\t);\n\t}\n\n\tprivate renderFormElement(): JSX.Element {\n\t\treturn (\n\t\t\t<form class=\"kol-form\" method=\"post\" onSubmit={this.onSubmit} onReset={this.onReset} noValidate>\n\t\t\t\t{this.state._requiredText === true ? (\n\t\t\t\t\t<p>\n\t\t\t\t\t\t<div class=\"kol-form__mandatory-fields-hint\">{this.translateFormDescription}</div>\n\t\t\t\t\t</p>\n\t\t\t\t) : typeof this.state._requiredText === 'string' && this.state._requiredText.length > 0 ? (\n\t\t\t\t\t<p>\n\t\t\t\t\t\t<div class=\"kol-form__mandatory-fields-hint\">{this.state._requiredText}</div>\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t\t<slot />\n\t\t\t</form>\n\t\t);\n\t}\n\n\tpublic render(): JSX.Element {\n\t\tconst hasErrorList = Array.isArray(this._errorList) && this._errorList.length > 0;\n\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t{hasErrorList && this.renderErrorList(this._errorList)}\n\t\t\t\t{this.renderFormElement()}\n\t\t\t</Host>\n\t\t);\n\t}\n\n\tprivate scrollToErrorList(options?: KolFocusOptions): void {\n\t\tsetTimeout(() => {\n\t\t\tthis.errorListFirstLink?.querySelector('a')?.focus(options ? options : this.scrollOptionsFallback);\n\t\t}, 250);\n\t}\n\n\t/**\n\t * Scrolls to the error list and focuses the first link.\n\t */\n\t@Method()\n\tasync focusErrorList(options?: KolFocusOptions): Promise<void> {\n\t\tthis.scrollToErrorList(options);\n\t\treturn Promise.resolve();\n\t}\n\n\t/**\n\t * Gibt die EventCallback-Funktionen für die Form-Events an.\n\t */\n\t@Prop() public _on?: KoliBriFormCallbacks;\n\n\t/**\n\t * Defines whether the mandatory-fields-hint should be shown. A string overrides the default text.\n\t */\n\t@Prop() public _requiredText?: Stringified<boolean> = true;\n\t/**\n\t * A list of error objects that each describe an issue encountered in the form.\n\t * Each error object contains a message and a selector for identifying the form element related to the error.\n\t */\n\t@Prop() public _errorList?: ErrorListPropType[];\n\n\t@State() public state: FormStates = {};\n\n\t@Watch('_on')\n\tpublic validateOn(value?: KoliBriFormCallbacks): void {\n\t\tif (typeof value === 'object' && value !== null) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_on: value,\n\t\t\t};\n\t\t}\n\t}\n\n\t@Watch('_requiredText')\n\tpublic validateRequiredText(value?: Stringified<boolean>): void {\n\t\tif (typeof value === 'boolean') {\n\t\t\twatchBoolean(this, '_requiredText', value);\n\t\t} else {\n\t\t\twatchString(this, '_requiredText', value);\n\t\t}\n\t}\n\n\t@Watch('_errorList')\n\tpublic validateErrorList(value?: ErrorListPropType[]): void {\n\t\tvalidateErrorList(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateOn(this._on);\n\t\tthis.validateRequiredText(this._requiredText);\n\t\tthis.validateErrorList(this._errorList);\n\t}\n}\n"],"names":[],"mappings":"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"}