@public-ui/components 4.1.2-rc.5 → 4.1.2-rc.7

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h as n,r as e,g as t}from"./index-BOCBxrrO.js";import{c as i}from"./component-names-C64MXeC1.js";import{a as o,F as s}from"./FormFieldStateWrapper-CQSqcO-4.js";import{I as a,a as l}from"./controller-icon-Be5G1l9V.js";import{I as r}from"./InputStateWrapper-DhDCsPkX.js";import{C as h,a as c}from"./CustomSuggestionsOptionsGroup-CEQ4Jh_V.js";import{t as d}from"./i18n-DvMeCREp.js";import{I as f}from"./component-vO2V8iwo.js";import{c as u}from"./clsx-COFh-Vc8.js";import{n as m}from"./dev.utils-C2fl1BE9.js";import{d as b,s as p}from"./element-focus-y2O-Z32P.js";import{e as k,g}from"./common-BIkdAxr0.js";import{v as y}from"./placeholder-D8vH7TM6.js";import{v}from"./required-Dt9l4wUg.js";import{v as w}from"./suggestions-CAPtcaUM.js";import"./access-and-short-key-CPX70LXd.js";import"./disabled-BdPI9eda.js";import"./hide-label-ByItyHgV.js";import"./label-Cw7rCjUo.js";import"./tooltip-align-DodV1tEH.js";import"./align-DDUsWnWP.js";import"./events-DHTi_wtD.js";import"./associated.controller-DKliwG01.js";import"./bootstrap-7FNy-lUW.js";import"./i18n-B0tfVPMa.js";import"./isObject-BJgq02Md.js";import"./isArray-CcrBs4JM.js";import"./tslib.es6-CxX45GIN.js";import"./component-PkMaDN8_.js";import"./bem-registry-ClssJ_nC.js";import"./Alert-CqPvVKJP.js";import"./Heading-CdHsieJ-.js";import"./icons-CmA8Oww0.js";import"./Input-BArbuEyo.js";class _ extends a{constructor(e,n,t){super(e,n,t),this.component=e}validateHasClearButton(e){k(this.component,"_hasClearButton",e)}validatePlaceholder(e){y(this.component,e)}validateRequired(e){v(this.component,e)}validateSuggestions(e){w(this.component,e)}validateValue(e){g(this.component,"_value",e)}componentWillLoad(){super.componentWillLoad(),this.validateHasClearButton(this.component._hasClearButton),this.validatePlaceholder(this.component._placeholder),this.validateRequired(this.component._required),this.validateSuggestions(this.component._suggestions),this.validateValue(this.component._value)}}const x='@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: lightgray;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: 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    opacity: 0.5;\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1774619801488"); /* IE9*/\n  src: url("kolicons.eot?t=1774619801488#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1774619801488") format("woff2"), url("kolicons.woff?t=1774619801488") format("woff"), url("kolicons.ttf?t=1774619801488") format("truetype"), url("kolicons.svg?t=1774619801488#kolicons") format("svg"); /* iOS 4.1- */\n}\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\n.kolicon-alert-error::before {\n  content: "\\ea01";\n}\n\n.kolicon-alert-info::before {\n  content: "\\ea02";\n}\n\n.kolicon-alert-success::before {\n  content: "\\ea03";\n}\n\n.kolicon-alert-warning::before {\n  content: "\\ea04";\n}\n\n.kolicon-check::before {\n  content: "\\ea05";\n}\n\n.kolicon-chevron-double-left::before {\n  content: "\\ea06";\n}\n\n.kolicon-chevron-double-right::before {\n  content: "\\ea07";\n}\n\n.kolicon-chevron-down::before {\n  content: "\\ea08";\n}\n\n.kolicon-chevron-left::before {\n  content: "\\ea09";\n}\n\n.kolicon-chevron-right::before {\n  content: "\\ea0a";\n}\n\n.kolicon-chevron-up::before {\n  content: "\\ea0b";\n}\n\n.kolicon-cogwheel::before {\n  content: "\\ea0c";\n}\n\n.kolicon-cross::before {\n  content: "\\ea0d";\n}\n\n.kolicon-eye-closed::before {\n  content: "\\ea0e";\n}\n\n.kolicon-eye::before {\n  content: "\\ea0f";\n}\n\n.kolicon-house::before {\n  content: "\\ea10";\n}\n\n.kolicon-kolibri::before {\n  content: "\\ea11";\n}\n\n.kolicon-link-external::before {\n  content: "\\ea12";\n}\n\n.kolicon-link::before {\n  content: "\\ea13";\n}\n\n.kolicon-minus::before {\n  content: "\\ea14";\n}\n\n.kolicon-plus::before {\n  content: "\\ea15";\n}\n\n.kolicon-settings::before {\n  content: "\\ea16";\n}\n\n.kolicon-sort-asc::before {\n  content: "\\ea17";\n}\n\n.kolicon-sort-desc::before {\n  content: "\\ea18";\n}\n\n.kolicon-sort-neutral::before {\n  content: "\\ea19";\n}\n\n.kolicon-up::before {\n  content: "\\ea1a";\n}\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: #000;\n    background-color: #fff;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: #000;\n    background-color: #fff;\n    position: relative;\n    z-index: 1000;\n  }\n  @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-alert .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-alert :host {\n    display: inline-block;\n  }\n  .kol-alert .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-alert .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-alert .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    display: flex;\n    place-items: center;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-custom-suggestions-option {\n    line-height: 1.5;\n    white-space: normal;\n    cursor: pointer;\n    overflow-wrap: break-word;\n  }\n  .kol-custom-suggestions-options-group--cursor-hidden .kol-custom-suggestions-option {\n    cursor: none !important;\n  }\n  .kol-custom-suggestions-option--disabled:focus, .kol-custom-suggestions-option--disabled:focus * {\n    cursor: not-allowed;\n  }\n  .kol-custom-suggestions-options-group {\n    background-color: white;\n    display: block;\n    position: absolute;\n    z-index: 2;\n    max-height: calc(250 * 1rem / var(--kolibri-root-font-size, 16));\n    margin: 0;\n    padding: 0;\n    overflow-x: hidden;\n    overflow-y: auto;\n    list-style-type: none;\n  }\n  .kol-input-container:has(.kol-custom-suggestions-options-group--open) {\n    z-index: 10;\n  }\n  .kol-custom-suggestions-toggle {\n    display: flex;\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    justify-content: center;\n    cursor: default;\n  }\n  .kol-custom-suggestions-toggle.kol-custom-suggestions-toggle--disabled {\n    cursor: not-allowed;\n  }\n  .kol-form-field {\n    display: grid;\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field__label-text {\n    flex-flow: row;\n    align-items: flex-start;\n    justify-content: flex-start;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text:not(:has(> [name]))::after,\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: "*"/"";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-input-container {\n    background-color: transparent;\n    display: grid;\n    width: 100%;\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    grid-template-columns: 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    min-height: var(--a11y-min-size);\n    place-items: center;\n  }\n  .kol-input {\n    background-color: transparent;\n    width: 100%;\n    min-width: var(--a11y-min-size);\n  }\n  .kol-input:focus {\n    outline: none;\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  .kol-combobox__delete .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-combobox__delete :host {\n    display: inline-block;\n  }\n  .kol-combobox__delete .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-combobox__delete .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-combobox__delete .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-custom-suggestions-toggle:not(.kol-custom-suggestions-toggle--disabled) {\n    cursor: pointer;\n  }\n  .kol-custom-suggestions-toggle--disabled {\n    opacity: 0.5;\n  }\n}',j=class{async getValue(){return this.state._value}async focus(){return b(this.host,()=>p(this.refInput))}selectOption(e){var n;this.controller.onFacade.onInput(new CustomEvent("input",{bubbles:!0,detail:{name:this.state._name,value:e}}),!0,e),this.controller.onFacade.onChange(new CustomEvent("change",{bubbles:!0,detail:{name:this.state._name,value:e}}),e),this.controller.setFormAssociatedValue(e),this.state._value=e,null===(n=this.refInput)||void 0===n||n.focus()}clearSelection(){var e;if(!0===this.state._disabled)return;const n="";this._focusedOptionIndex=-1,this._value=n,this.state._value=n,this._filteredSuggestions=[...this.state._suggestions],this._isOpen=!1;const t={name:this.state._name,value:n};this.controller.onFacade.onInput(new CustomEvent("input",{bubbles:!0,detail:t}),!0,n),this.controller.onFacade.onChange(new CustomEvent("change",{bubbles:!0,detail:t}),n),this.controller.setFormAssociatedValue(n),null===(e=this.refInput)||void 0===e||e.focus()}onInput(e){const n=e.target;this.state._value=n.value,this._value=n.value,this.controller.onFacade.onInput(e),this.setFilteredSuggestionsByQuery(n.value),this._focusedOptionIndex=-1}handleKeyDownDropdown(e){1===e.key.length&&/[a-z0-9]/i.test(e.key)&&(this._isOpen=!0,this.focusSuggestionStartingWith(e.key))}setFilteredSuggestionsByQuery(e){""===e.trim()?this._filteredSuggestions=[...this.state._suggestions]:(this._filteredSuggestions=Array.isArray(this.state._suggestions)?this.state._suggestions.filter(n=>n.toLowerCase().includes(e.toLowerCase())):this._filteredSuggestions,this._isOpen=!!(this._filteredSuggestions&&this._filteredSuggestions.length>0))}moveFocus(e){if(!this._filteredSuggestions)return;let n=this._focusedOptionIndex+e;n>=this._filteredSuggestions.length&&(n=0),n<0&&(n=this._filteredSuggestions.length-1),this.focusOption(n)}focusOption(e){if(this._focusedOptionIndex=e,this.refSuggestions){const n=this.refSuggestions[e];null==n||n.focus()}}selectFocusedOption(){return!!(this._filteredSuggestions&&this._focusedOptionIndex>=0&&this._focusedOptionIndex<this._filteredSuggestions.length)&&(this.selectOption(this._filteredSuggestions[this._focusedOptionIndex]),!0)}focusSuggestionStartingWith(e){const n=e.toLowerCase(),t=Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.findIndex(e=>e.toLowerCase().startsWith(n));"number"==typeof t&&this.focusOption(t)}getFormFieldProps(){return{state:this.state,class:u("kol-combobox",{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,alert:this.showAsAlert()}}getInputProps(){const{ariaDescribedBy:e}=o(this.state),n=!0===this.state._disabled;return Object.assign(Object.assign({ref:this.setInputRef,state:this.state,class:"kol-combobox__input",type:"text",role:"combobox","aria-activedescendant":this._isOpen&&this._focusedOptionIndex>=0?`option-${this._focusedOptionIndex}`:void 0,"aria-autocomplete":"both","aria-controls":"listbox","aria-describedby":e.length>0?e.join(" "):void 0,"aria-expanded":this._isOpen?"true":"false","aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,"aria-labelledby":this.state._id,"aria-keyshortcuts":this.state._shortKey,value:this.state._value,accessKey:this.state._accessKey,autocapitalize:"off",autocorrect:"off",disabled:n,customSuggestions:!0,id:this.state._id,name:this.state._name,required:this.state._required},this.controller.onFacade),{onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1},onChange:this.onChange.bind(this),onInput:this.onInput.bind(this),placeholder:this.state._placeholder})}render(){const e=!0===this.state._disabled;return n(s,Object.assign({key:"18570374ba517b18fb5dfccf4f06d0840dee6ffb"},this.getFormFieldProps()),n(l,{key:"0e43a5b6959d139b43b73d8aebdd4d7b134a1f92",state:this.state},n("div",{key:"9cd649351593c1b37ad0c4ae0d7c6165ffc81a2b",class:"kol-combobox__group"},n(r,Object.assign({key:"a4ff93175cd809b828612da2fc13bf02d716f006"},this.getInputProps())),this.state._value&&this.state._hasClearButton&&n(i,{key:"3c1d0ea0a04b267ccdc745abed0ab8d72ba0e8f4",_icons:"kolicon-cross",_label:this.translateDeleteSelection,_hideLabel:!0,_variant:"ghost",_disabled:e,"data-testid":"combobox-delete",class:"kol-combobox__delete",hidden:e,_on:{onClick:()=>{this.clearSelection()}}}),n(f,{key:"b032e4ea2b0f750d1120e6c6b3fcfd0412294d46",icons:"kolicon-chevron-down",label:"",class:u("kol-custom-suggestions-toggle",{"kol-custom-suggestions-toggle--disabled":e}),onClick:this.toggleListbox.bind(this)})),n(h,{key:"ba0afa72a06ceae39b2a008ad279ba0fe4ebf79c",blockSuggestionMouseOver:this.blockSuggestionMouseOver,onKeyDown:this.handleKeyDownDropdown.bind(this),hidden:!this._isOpen||e},Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.map((e,t)=>n(c,{disabled:!1,index:t,option:e,searchTerm:this.state._value,ref:e=>{e&&(this.refSuggestions[t]=e)},selected:this.state._value===e,onClick:()=>{this.selectOption(e),this.toggleListbox(),this._isOpen=!1},onMouseOver:()=>{this.blockSuggestionMouseOver||this.focusOption(t)},onFocus:()=>{this.focusOption(t)},onKeyDown:n=>{"Enter"!==n.key&&"NumpadEnter"!==n.key||(this.selectOption(e),this.toggleListbox(),n.preventDefault())}})))))}handleKeyDown(e){var n,t;const o=(n,t)=>{var o;e.preventDefault(),void 0!==n&&(this._isOpen=n,n||null===(o=this.refInput)||void 0===o||o.focus()),null==t||t()};switch(e.key){case"Down":case"ArrowDown":this.blockSuggestionMouseOver=!0,o(!0,()=>this.moveFocus(1));break;case"Up":case"ArrowUp":this.blockSuggestionMouseOver=!0,o(!0,()=>this.moveFocus(-1));break;case"Tab":this._isOpen&&(this._isOpen=!1,null===(n=this.refInput)||void 0===n||n.focus());break;case"Esc":case"Escape":this._isOpen=!1,e.preventDefault(),null===(t=this.refInput)||void 0===t||t.focus();break;case" ":case"Enter":case"NumpadEnter":this._isOpen?this.selectFocusedOption()&&(this._isOpen=!1):this.toggleListbox(),e.preventDefault();break;case"Home":this.blockSuggestionMouseOver=!0,o(void 0,()=>{this._isOpen&&this.focusOption(0)});break;case"End":this.blockSuggestionMouseOver=!0,o(void 0,()=>{this._isOpen&&this.focusOption(this._filteredSuggestions?this._filteredSuggestions.length-1:0)});break;case"PageUp":this.blockSuggestionMouseOver=!0,o(void 0,()=>this._isOpen&&this.moveFocus(-10));break;case"PageDown":this.blockSuggestionMouseOver=!0,o(void 0,()=>this._isOpen&&this.moveFocus(10))}}handleWindowClick(e){void 0===this.host||this.host.contains(e.target)||(this._isOpen=!1)}constructor(n){e(this,n),this.refSuggestions=[],this._focusedOptionIndex=-1,this.translateDeleteSelection=d("kol-delete-selection"),this.toggleListbox=()=>{var e;if(!0===this.state._disabled)this._isOpen=!1;else if(null===(e=this.refInput)||void 0===e||e.focus(),this._isOpen)this._isOpen=!1;else if(Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0){this._isOpen=!0;const e=this._filteredSuggestions.findIndex(e=>e===this.state._value);this._focusedOptionIndex=e>=0?e:-1,this.focusOption(this._focusedOptionIndex)}},this.setInputRef=e=>{this.refInput=e},this.blockSuggestionMouseOver=!1,this._isOpen=!1,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._hasClearButton=!0,this._required=!1,this._tooltipAlign="top",this._touched=!1,this.state={_hasValue:!1,_hasClearButton:!0,_hideMsg:!1,_id:`id-${m()}`,_label:"",_suggestions:[],_value:""},this.inputHasFocus=!1,this.controller=new _(this,"combobox",this.host),this.onInput=this.onInput.bind(this)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideMsg(e){this.controller.validateHideMsg(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSuggestions(e){this.controller.validateSuggestions(e),this._filteredSuggestions=e}validateHasClearButton(e){this.controller.validateHasClearButton(e)}validateRequired(e){this.controller.validateRequired(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e),this.controller.setFormAssociatedValue(e)}componentWillLoad(){this.refSuggestions=[],this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener(e=>this.state._hasValue=!!e),this._filteredSuggestions=this.state._suggestions}handleMouseEvent(){this.blockSuggestionMouseOver=!1}handleFocusOut(e){setTimeout(()=>{var n;(null===(n=this.host)||void 0===n?void 0:n.contains(document.activeElement))||this.onBlur(e)})}handleWindowBlur(e){this.onBlur(e)}onBlur(e){this._isOpen&&e instanceof FocusEvent&&e.view===window&&(this._isOpen=!1)}onChange(e){this.controller.onFacade.onChange(e),this.controller.setFormAssociatedValue(this.state._value)}get host(){return t(this)}static get watchers(){return{_placeholder:["validatePlaceholder"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_hasClearButton:["validateHasClearButton"],_required:["validateRequired"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"],_value:["validateValue"]}}};j.style={default:x};export{j as kol_combobox};
+import{h as n,r as e,g as t}from"./index-BPtT34o3.js";import{c as i}from"./component-names-pgL1e5No.js";import{a as o,F as s}from"./FormFieldStateWrapper-D9-nbrAT.js";import{I as a,a as l}from"./controller-icon-LTaTMYty.js";import{I as r}from"./InputStateWrapper-BO-OfVb2.js";import{C as h,a as c}from"./CustomSuggestionsOptionsGroup-KAi-Zhy-.js";import{t as d}from"./i18n-CSCkYcOW.js";import{I as f}from"./component-CL5w48zL.js";import{c as u}from"./clsx-COFh-Vc8.js";import{n as m}from"./dev.utils-CfUO8naH.js";import{d as p,s as b}from"./element-click-BTxuJDNT.js";import{d as k,s as g}from"./element-focus-BKUtVrWY.js";import{e as y,g as v}from"./common-5ExJH6NU.js";import{v as w}from"./placeholder-DsAnRKrf.js";import{v as _}from"./required-Ds8VBM7N.js";import{v as x}from"./suggestions-Bu6noihP.js";import"./access-and-short-key-BzpC9FZP.js";import"./disabled-Cp_Z3qUn.js";import"./hide-label-BvUdILkE.js";import"./label-Cd37SRqu.js";import"./tooltip-align-D0H6p6J-.js";import"./align-BmVteuP6.js";import"./events-DHTi_wtD.js";import"./associated.controller-8xCU8Tb0.js";import"./bootstrap-BFbfb2g4.js";import"./i18n-B2d_exHc.js";import"./isObject-BJgq02Md.js";import"./isArray-CcrBs4JM.js";import"./tslib.es6-CxX45GIN.js";import"./component-JM2Le9Vy.js";import"./bem-registry-DTQ0cuzY.js";import"./Alert-BCOTrqr_.js";import"./Heading-CdhA3sYv.js";import"./icons-Cl5Luo4Z.js";import"./Input-ZDG0uZKh.js";class z extends a{constructor(e,t,n){super(e,t,n),this.component=e}validateHasClearButton(e){y(this.component,"_hasClearButton",e)}validatePlaceholder(e){w(this.component,e)}validateRequired(e){_(this.component,e)}validateSuggestions(e){x(this.component,e)}validateValue(e){v(this.component,"_value",e)}componentWillLoad(){super.componentWillLoad(),this.validateHasClearButton(this.component._hasClearButton),this.validatePlaceholder(this.component._placeholder),this.validateRequired(this.component._required),this.validateSuggestions(this.component._suggestions),this.validateValue(this.component._value)}}const j='@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: lightgray;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: 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    opacity: 0.5;\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1774956515321"); /* IE9*/\n  src: url("kolicons.eot?t=1774956515321#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1774956515321") format("woff2"), url("kolicons.woff?t=1774956515321") format("woff"), url("kolicons.ttf?t=1774956515321") format("truetype"), url("kolicons.svg?t=1774956515321#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: #000;\n    background-color: #fff;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: #000;\n    background-color: #fff;\n    position: relative;\n    z-index: 1000;\n  }\n  @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-alert .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-alert :host {\n    display: inline-block;\n  }\n  .kol-alert .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-alert .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-alert .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-alert {\n    display: grid;\n  }\n  .kol-alert__container {\n    display: flex;\n    place-items: center;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-custom-suggestions-option {\n    line-height: 1.5;\n    white-space: normal;\n    cursor: pointer;\n    overflow-wrap: break-word;\n  }\n  .kol-custom-suggestions-options-group--cursor-hidden .kol-custom-suggestions-option {\n    cursor: none !important;\n  }\n  .kol-custom-suggestions-option--disabled:focus, .kol-custom-suggestions-option--disabled:focus * {\n    cursor: not-allowed;\n  }\n  .kol-custom-suggestions-options-group {\n    background-color: white;\n    display: block;\n    position: absolute;\n    z-index: 2;\n    max-height: calc(250 * 1rem / var(--kolibri-root-font-size, 16));\n    margin: 0;\n    padding: 0;\n    overflow-x: hidden;\n    overflow-y: auto;\n    list-style-type: none;\n  }\n  .kol-input-container:has(.kol-custom-suggestions-options-group--open) {\n    z-index: 10;\n  }\n  .kol-custom-suggestions-toggle {\n    display: flex;\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    justify-content: center;\n    cursor: default;\n  }\n  .kol-custom-suggestions-toggle.kol-custom-suggestions-toggle--disabled {\n    cursor: not-allowed;\n  }\n  .kol-form-field {\n    display: grid;\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field__label-text {\n    flex-flow: row;\n    align-items: flex-start;\n    justify-content: flex-start;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text:not(:has(> [name]))::after,\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: "*"/"";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-input-container {\n    background-color: transparent;\n    display: grid;\n    width: 100%;\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    grid-template-columns: 1fr;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    min-height: var(--a11y-min-size);\n    place-items: center;\n  }\n  .kol-input {\n    background-color: transparent;\n    width: 100%;\n    min-width: var(--a11y-min-size);\n  }\n  .kol-input:focus {\n    outline: none;\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  .kol-combobox__delete .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-combobox__delete :host {\n    display: inline-block;\n  }\n  .kol-combobox__delete .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-combobox__delete .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "​";\n  }\n  .kol-combobox__delete .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-custom-suggestions-toggle:not(.kol-custom-suggestions-toggle--disabled) {\n    cursor: pointer;\n  }\n  .kol-custom-suggestions-toggle--disabled {\n    opacity: 0.5;\n  }\n}',C=class{async getValue(){return this.state._value}async focus(){return k(this.host,()=>g(this.refInput))}async click(){return p(this.host,async()=>b(this.refInput))}selectOption(e){var t;this.controller.onFacade.onInput(new CustomEvent("input",{bubbles:!0,detail:{name:this.state._name,value:e}}),!0,e),this.controller.onFacade.onChange(new CustomEvent("change",{bubbles:!0,detail:{name:this.state._name,value:e}}),e),this.controller.setFormAssociatedValue(e),this.state._value=e,null===(t=this.refInput)||void 0===t||t.focus()}clearSelection(){var e;if(!0===this.state._disabled)return;const t="";this._focusedOptionIndex=-1,this._value=t,this.state._value=t,this._filteredSuggestions=[...this.state._suggestions],this._isOpen=!1;const n={name:this.state._name,value:t};this.controller.onFacade.onInput(new CustomEvent("input",{bubbles:!0,detail:n}),!0,t),this.controller.onFacade.onChange(new CustomEvent("change",{bubbles:!0,detail:n}),t),this.controller.setFormAssociatedValue(t),null===(e=this.refInput)||void 0===e||e.focus()}onInput(e){const t=e.target;this.state._value=t.value,this._value=t.value,this.controller.onFacade.onInput(e),this.setFilteredSuggestionsByQuery(t.value),this._focusedOptionIndex=-1}handleKeyDownDropdown(e){1===e.key.length&&/[a-z0-9]/i.test(e.key)&&(this._isOpen=!0,this.focusSuggestionStartingWith(e.key))}setFilteredSuggestionsByQuery(e){""===e.trim()?this._filteredSuggestions=[...this.state._suggestions]:(this._filteredSuggestions=Array.isArray(this.state._suggestions)?this.state._suggestions.filter(t=>t.toLowerCase().includes(e.toLowerCase())):this._filteredSuggestions,this._isOpen=!!(this._filteredSuggestions&&this._filteredSuggestions.length>0))}moveFocus(e){if(!this._filteredSuggestions)return;let t=this._focusedOptionIndex+e;t>=this._filteredSuggestions.length&&(t=0),t<0&&(t=this._filteredSuggestions.length-1),this.focusOption(t)}focusOption(e){if(this._focusedOptionIndex=e,this.refSuggestions){const t=this.refSuggestions[e];null==t||t.focus()}}selectFocusedOption(){return!!(this._filteredSuggestions&&this._focusedOptionIndex>=0&&this._focusedOptionIndex<this._filteredSuggestions.length)&&(this.selectOption(this._filteredSuggestions[this._focusedOptionIndex]),!0)}focusSuggestionStartingWith(e){const t=e.toLowerCase(),n=Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.findIndex(e=>e.toLowerCase().startsWith(t));"number"==typeof n&&this.focusOption(n)}getFormFieldProps(){return{state:this.state,class:u("kol-combobox",{"has-value":this.state._hasValue}),tooltipAlign:this._tooltipAlign,alert:this.showAsAlert()}}getInputProps(){const{ariaDescribedBy:e}=o(this.state),t=!0===this.state._disabled;return Object.assign(Object.assign({ref:this.setInputRef,state:this.state,class:"kol-combobox__input",type:"text",role:"combobox","aria-activedescendant":this._isOpen&&this._focusedOptionIndex>=0?`option-${this._focusedOptionIndex}`:void 0,"aria-autocomplete":"both","aria-controls":"listbox","aria-describedby":e.length>0?e.join(" "):void 0,"aria-expanded":this._isOpen?"true":"false","aria-label":this.state._hideLabel&&"string"==typeof this.state._label?this.state._label:void 0,"aria-labelledby":this.state._id,"aria-keyshortcuts":this.state._shortKey,value:this.state._value,accessKey:this.state._accessKey,autocapitalize:"off",autocorrect:"off",disabled:t,customSuggestions:!0,id:this.state._id,name:this.state._name,required:this.state._required},this.controller.onFacade),{onFocus:e=>{this.controller.onFacade.onFocus(e),this.inputHasFocus=!0},onBlur:e=>{this.controller.onFacade.onBlur(e),this.inputHasFocus=!1},onChange:this.onChange.bind(this),onInput:this.onInput.bind(this),placeholder:this.state._placeholder})}render(){const e=!0===this.state._disabled;return n(s,Object.assign({key:"fb3b1f18430438112be19ff6b61fa71b308c5352"},this.getFormFieldProps()),n(l,{key:"54743cc78d59c6bacc66769ec1c3af75c48e84ac",state:this.state},n("div",{key:"bf40816f69d1eb07f68d6de36cc68851fcc98f06",class:"kol-combobox__group"},n(r,Object.assign({key:"f6e0221067bf8222f0b454ef6168acfd42fc53cf"},this.getInputProps())),this.state._value&&this.state._hasClearButton&&n(i,{key:"8e893ee44e4eb50c7ad051e5908c0cdb582c9100",_icons:"kolicon-cross",_label:this.translateDeleteSelection,_hideLabel:!0,_variant:"ghost",_disabled:e,"data-testid":"combobox-delete",class:"kol-combobox__delete",hidden:e,_on:{onClick:()=>{this.clearSelection()}}}),n(f,{key:"014fdd5453f79d75b878962c9ee08a5d03e31182",icons:"kolicon-chevron-down",label:"",class:u("kol-custom-suggestions-toggle",{"kol-custom-suggestions-toggle--disabled":e}),onClick:this.toggleListbox.bind(this)})),n(h,{key:"26f8e274a56b0cd4acb26f886f5016c22c93c628",blockSuggestionMouseOver:this.blockSuggestionMouseOver,onKeyDown:this.handleKeyDownDropdown.bind(this),hidden:!this._isOpen||e},Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0&&this._filteredSuggestions.map((e,t)=>n(c,{disabled:!1,index:t,option:e,searchTerm:this.state._value,ref:e=>{e&&(this.refSuggestions[t]=e)},selected:this.state._value===e,onClick:()=>{this.selectOption(e),this.toggleListbox(),this._isOpen=!1},onMouseOver:()=>{this.blockSuggestionMouseOver||this.focusOption(t)},onFocus:()=>{this.focusOption(t)},onKeyDown:t=>{"Enter"!==t.key&&"NumpadEnter"!==t.key||(this.selectOption(e),this.toggleListbox(),t.preventDefault())}})))))}handleKeyDown(e){var t,n;const o=(t,n)=>{var o;e.preventDefault(),void 0!==t&&(this._isOpen=t,t||null===(o=this.refInput)||void 0===o||o.focus()),null==n||n()};switch(e.key){case"Down":case"ArrowDown":this.blockSuggestionMouseOver=!0,o(!0,()=>this.moveFocus(1));break;case"Up":case"ArrowUp":this.blockSuggestionMouseOver=!0,o(!0,()=>this.moveFocus(-1));break;case"Tab":this._isOpen&&(this._isOpen=!1,null===(t=this.refInput)||void 0===t||t.focus());break;case"Esc":case"Escape":this._isOpen=!1,e.preventDefault(),null===(n=this.refInput)||void 0===n||n.focus();break;case" ":case"Enter":case"NumpadEnter":this._isOpen?this.selectFocusedOption()&&(this._isOpen=!1):this.toggleListbox(),e.preventDefault();break;case"Home":this.blockSuggestionMouseOver=!0,o(void 0,()=>{this._isOpen&&this.focusOption(0)});break;case"End":this.blockSuggestionMouseOver=!0,o(void 0,()=>{this._isOpen&&this.focusOption(this._filteredSuggestions?this._filteredSuggestions.length-1:0)});break;case"PageUp":this.blockSuggestionMouseOver=!0,o(void 0,()=>this._isOpen&&this.moveFocus(-10));break;case"PageDown":this.blockSuggestionMouseOver=!0,o(void 0,()=>this._isOpen&&this.moveFocus(10))}}handleWindowClick(e){void 0===this.host||this.host.contains(e.target)||(this._isOpen=!1)}constructor(t){e(this,t),this.refSuggestions=[],this._focusedOptionIndex=-1,this.translateDeleteSelection=d("kol-delete-selection"),this.toggleListbox=()=>{var e;if(!0===this.state._disabled)this._isOpen=!1;else if(null===(e=this.refInput)||void 0===e||e.focus(),this._isOpen)this._isOpen=!1;else if(Array.isArray(this._filteredSuggestions)&&this._filteredSuggestions.length>0){this._isOpen=!0;const e=this._filteredSuggestions.findIndex(e=>e===this.state._value);this._focusedOptionIndex=e>=0?e:-1,this.focusOption(this._focusedOptionIndex)}},this.setInputRef=e=>{this.refInput=e},this.blockSuggestionMouseOver=!1,this._isOpen=!1,this._disabled=!1,this._hideMsg=!1,this._hideLabel=!1,this._hint="",this._hasClearButton=!0,this._required=!1,this._tooltipAlign="top",this._touched=!1,this.state={_hasValue:!1,_hasClearButton:!0,_hideMsg:!1,_id:`id-${m()}`,_label:"",_suggestions:[],_value:""},this.inputHasFocus=!1,this.controller=new z(this,"combobox",this.host),this.onInput=this.onInput.bind(this)}showAsAlert(){return Boolean(this.state._touched)&&!this.inputHasFocus}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideMsg(e){this.controller.validateHideMsg(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSuggestions(e){this.controller.validateSuggestions(e),this._filteredSuggestions=e}validateHasClearButton(e){this.controller.validateHasClearButton(e)}validateRequired(e){this.controller.validateRequired(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e),this.controller.setFormAssociatedValue(e)}componentWillLoad(){this.refSuggestions=[],this._touched=!0===this._touched,this.controller.componentWillLoad(),this.state._hasValue=!!this.state._value,this.controller.addValueChangeListener(e=>this.state._hasValue=!!e),this._filteredSuggestions=this.state._suggestions}handleMouseEvent(){this.blockSuggestionMouseOver=!1}handleFocusOut(e){setTimeout(()=>{var t;(null===(t=this.host)||void 0===t?void 0:t.contains(document.activeElement))||this.onBlur(e)})}handleWindowBlur(e){this.onBlur(e)}onBlur(e){this._isOpen&&e instanceof FocusEvent&&e.view===window&&(this._isOpen=!1)}onChange(e){this.controller.onFacade.onChange(e),this.controller.setFormAssociatedValue(this.state._value)}get host(){return t(this)}static get watchers(){return{_placeholder:["validatePlaceholder"],_accessKey:["validateAccessKey"],_disabled:["validateDisabled"],_hideMsg:["validateHideMsg"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_shortKey:["validateShortKey"],_suggestions:["validateSuggestions"],_hasClearButton:["validateHasClearButton"],_required:["validateRequired"],_syncValueBySelector:["validateSyncValueBySelector"],_touched:["validateTouched"],_value:["validateValue"]}}};C.style={default:j};export{C as kol_combobox};

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

@@ -1 +1 @@
-{"version":3,"names":["h","registerInstance","getElement","KolButtonWcTag","getRenderStates","FormFieldStateWrapper","InputIconController","InputContainerStateWrapperFc","InputStateWrapper","CustomSuggestionsOptionsGroupFc","CustomSuggestionsOptionFc","translate","IconFC","clsx","nonce","delegateFocus","setFocus","watchBoolean","watchString","validatePlaceholder","validateRequired","validateSuggestions","ComboboxController","constructor","component","name","host","super","this","validateHasClearButton","value","validateValue","componentWillLoad","_hasClearButton","_placeholder","_required","_suggestions","_value","defaultStyleCss","KolCombobox","getValue","state","focus","refInput","selectOption","option","_a","controller","onFacade","onInput","CustomEvent","bubbles","detail","_name","onChange","setFormAssociatedValue","clearSelection","isDisabled","_disabled","emptyValue","_focusedOptionIndex","_filteredSuggestions","_isOpen","event","target","setFilteredSuggestionsByQuery","handleKeyDownDropdown","key","length","test","focusSuggestionStartingWith","query","trim","Array","isArray","filter","toLowerCase","includes","moveFocus","delta","newIndex","focusOption","index","refSuggestions","optionElement","selectFocusedOption","char","charLowerCase","findIndex","startsWith","getFormFieldProps","class","_hasValue","tooltipAlign","_tooltipAlign","alert","showAsAlert","getInputProps","ariaDescribedBy","Object","assign","ref","setInputRef","type","role","undefined","join","_hideLabel","_label","_id","_shortKey","accessKey","_accessKey","autocapitalize","autocorrect","disabled","customSuggestions","id","required","onFocus","inputHasFocus","onBlur","bind","placeholder","render","_icons","translateDeleteSelection","_variant","hidden","_on","onClick","icons","label","toggleListbox","blockSuggestionMouseOver","onKeyDown","map","searchTerm","el","selected","onMouseOver","e","preventDefault","handleKeyDown","_b","handleEvent","isOpen","callback","handleWindowClick","contains","hostRef","selectedIndex","_hideMsg","_hint","_touched","Boolean","validateAccessKey","validateDisabled","validateHideMsg","validateHideLabel","validateHint","validateIcons","validateLabel","validateMsg","validateName","validateOn","validateShortKey","validateSyncValueBySelector","validateTouched","addValueChangeListener","v","handleMouseEvent","handleFocusOut","setTimeout","document","activeElement","handleWindowBlur","FocusEvent","view","window","watchers","_msg","_syncValueBySelector","style","default"],"sources":["0"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["h","registerInstance","getElement","KolButtonWcTag","getRenderStates","FormFieldStateWrapper","InputIconController","InputContainerStateWrapperFc","InputStateWrapper","CustomSuggestionsOptionsGroupFc","CustomSuggestionsOptionFc","translate","IconFC","clsx","nonce","delegateClick","setClick","delegateFocus","setFocus","watchBoolean","watchString","validatePlaceholder","validateRequired","validateSuggestions","ComboboxController","constructor","component","name","host","super","this","validateHasClearButton","value","validateValue","componentWillLoad","_hasClearButton","_placeholder","_required","_suggestions","_value","defaultStyleCss","KolCombobox","getValue","state","focus","refInput","click","async","selectOption","option","_a","controller","onFacade","onInput","CustomEvent","bubbles","detail","_name","onChange","setFormAssociatedValue","clearSelection","isDisabled","_disabled","emptyValue","_focusedOptionIndex","_filteredSuggestions","_isOpen","event","target","setFilteredSuggestionsByQuery","handleKeyDownDropdown","key","length","test","focusSuggestionStartingWith","query","trim","Array","isArray","filter","toLowerCase","includes","moveFocus","delta","newIndex","focusOption","index","refSuggestions","optionElement","selectFocusedOption","char","charLowerCase","findIndex","startsWith","getFormFieldProps","class","_hasValue","tooltipAlign","_tooltipAlign","alert","showAsAlert","getInputProps","ariaDescribedBy","Object","assign","ref","setInputRef","type","role","undefined","join","_hideLabel","_label","_id","_shortKey","accessKey","_accessKey","autocapitalize","autocorrect","disabled","customSuggestions","id","required","onFocus","inputHasFocus","onBlur","bind","placeholder","render","_icons","translateDeleteSelection","_variant","hidden","_on","onClick","icons","label","toggleListbox","blockSuggestionMouseOver","onKeyDown","map","searchTerm","el","selected","onMouseOver","e","preventDefault","handleKeyDown","_b","handleEvent","isOpen","callback","handleWindowClick","contains","hostRef","selectedIndex","_hideMsg","_hint","_touched","Boolean","validateAccessKey","validateDisabled","validateHideMsg","validateHideLabel","validateHint","validateIcons","validateLabel","validateMsg","validateName","validateOn","validateShortKey","validateSyncValueBySelector","validateTouched","addValueChangeListener","v","handleMouseEvent","handleFocusOut","setTimeout","document","activeElement","handleWindowBlur","FocusEvent","view","window","watchers","_msg","_syncValueBySelector","style","default"],"sources":["0"],"mappings":";;;YAGSA,OAAQC,OAAuBC,MAAkB,kCAC5CC,MAAsB,4CACtBC,OAAsBC,MAA6B,kDACnDC,OAA0BC,MAAoC,4CAC9DC,MAAyB,8CACzBC,OAAsCC,MAAiC,0DACvEC,MAAiB,iCACjBC,MAAc,sCACdC,MAAY,iCACZC,MAAa,sCACbC,OAAoBC,MAAgB,0CACpCC,OAAoBC,MAAgB,0CACpCC,OAAmBC,MAAmB,mCACtCC,MAA2B,wCAC3BC,MAAwB,qCACxBC,MAA2B,kCAClC,2CACA,+BACA,iCACA,4BACA,oCACA,4BACA,6BACA,4CACA,gCACA,2BACA,+BACA,8BACA,gCACA,gCACA,mCACA,4BACA,8BACA,4BACA,sBAEP,MAAMC,UAA2BlB,EAC7B,WAAAmB,CAAYC,EAAWC,EAAMC,GACzBC,MAAMH,EAAWC,EAAMC,GACvBE,KAAKJ,UAAYA,CACrB,CACA,sBAAAK,CAAuBC,GACnBb,EAAaW,KAAKJ,UAAW,kBAAmBM,EACpD,CACA,mBAAAX,CAAoBW,GAChBX,EAAoBS,KAAKJ,UAAWM,EACxC,CACA,gBAAAV,CAAiBU,GACbV,EAAiBQ,KAAKJ,UAAWM,EACrC,CACA,mBAAAT,CAAoBS,GAChBT,EAAoBO,KAAKJ,UAAWM,EACxC,CACA,aAAAC,CAAcD,GACVZ,EAAYU,KAAKJ,UAAW,SAAUM,EAC1C,CACA,iBAAAE,GACIL,MAAMK,oBACNJ,KAAKC,uBAAuBD,KAAKJ,UAAUS,iBAC3CL,KAAKT,oBAAoBS,KAAKJ,UAAUU,cACxCN,KAAKR,iBAAiBQ,KAAKJ,UAAUW,WACrCP,KAAKP,oBAAoBO,KAAKJ,UAAUY,cACxCR,KAAKG,cAAcH,KAAKJ,UAAUa,OACtC,EAGJ,MAAMC,EAAkB,qybAExB,MAAMC,EAAc,MAChB,cAAMC,GACF,OAAOZ,KAAKa,MAAMJ,MACtB,CACA,WAAMK,GACF,OAAO3B,EAAca,KAAKF,MAAM,IAAMV,EAASY,KAAKe,WACxD,CACA,WAAMC,GACF,OAAO/B,EAAce,KAAKF,MAAMmB,SAAY/B,EAASc,KAAKe,WAC9D,CACA,YAAAG,CAAaC,GACT,IAAIC,EACJpB,KAAKqB,WAAWC,SAASC,QAAQ,IAAIC,YAAY,QAAS,CAAEC,QAAS,KAAMC,OAAQ,CAAE7B,KAAMG,KAAKa,MAAMc,MAAOzB,MAAOiB,KAAa,KAAMA,GACvInB,KAAKqB,WAAWC,SAASM,SAAS,IAAIJ,YAAY,SAAU,CAAEC,QAAS,KAAMC,OAAQ,CAAE7B,KAAMG,KAAKa,MAAMc,MAAOzB,MAAOiB,KAAaA,GACnInB,KAAKqB,WAAWQ,uBAAuBV,GACvCnB,KAAKa,MAAMJ,OAASU,GACnBC,EAAKpB,KAAKe,YAAc,MAAQK,SAAY,OAAS,EAAIA,EAAGN,OACjE,CACA,cAAAgB,GACI,IAAIV,EACJ,MAAMW,EAAa/B,KAAKa,MAAMmB,YAAc,KAC5C,GAAID,EAAY,CACZ,MACJ,CACA,MAAME,EAAa,GACnBjC,KAAKkC,qBAAuB,EAC5BlC,KAAKS,OAASwB,EACdjC,KAAKa,MAAMJ,OAASwB,EACpBjC,KAAKmC,qBAAuB,IAAInC,KAAKa,MAAML,cAC3CR,KAAKoC,QAAU,MACf,MAAMV,EAAS,CAAE7B,KAAMG,KAAKa,MAAMc,MAAOzB,MAAO+B,GAChDjC,KAAKqB,WAAWC,SAASC,QAAQ,IAAIC,YAAY,QAAS,CAAEC,QAAS,KAAMC,WAAW,KAAMO,GAC5FjC,KAAKqB,WAAWC,SAASM,SAAS,IAAIJ,YAAY,SAAU,CAAEC,QAAS,KAAMC,WAAWO,GACxFjC,KAAKqB,WAAWQ,uBAAuBI,IACtCb,EAAKpB,KAAKe,YAAc,MAAQK,SAAY,OAAS,EAAIA,EAAGN,OACjE,CACA,OAAAS,CAAQc,GACJ,MAAMC,EAASD,EAAMC,OACrBtC,KAAKa,MAAMJ,OAAS6B,EAAOpC,MAC3BF,KAAKS,OAAS6B,EAAOpC,MACrBF,KAAKqB,WAAWC,SAASC,QAAQc,GACjCrC,KAAKuC,8BAA8BD,EAAOpC,OAC1CF,KAAKkC,qBAAuB,CAChC,CACA,qBAAAM,CAAsBH,GAClB,GAAIA,EAAMI,IAAIC,SAAW,GAAK,YAAYC,KAAKN,EAAMI,KAAM,CACvDzC,KAAKoC,QAAU,KACfpC,KAAK4C,4BAA4BP,EAAMI,IAC3C,CACJ,CACA,6BAAAF,CAA8BM,GAC1B,GAAIA,EAAMC,SAAW,GAAI,CACrB9C,KAAKmC,qBAAuB,IAAInC,KAAKa,MAAML,aAC/C,KACK,CACDR,KAAKmC,qBAAuBY,MAAMC,QAAQhD,KAAKa,MAAML,cAC/CR,KAAKa,MAAML,aAAayC,QAAQ9B,GACvBA,EAAO+B,cAAcC,SAASN,EAAMK,iBAE7ClD,KAAKmC,qBACXnC,KAAKoC,QAAUpC,KAAKmC,sBAAwBnC,KAAKmC,qBAAqBO,OAAS,EAAI,KAAO,KAC9F,CACJ,CACA,SAAAU,CAAUC,GACN,IAAKrD,KAAKmC,qBAAsB,CAC5B,MACJ,CACA,IAAImB,EAAWtD,KAAKkC,oBAAsBmB,EAC1C,GAAIC,GAAYtD,KAAKmC,qBAAqBO,OAAQ,CAC9CY,EAAW,CACf,CACA,GAAIA,EAAW,EAAG,CACdA,EAAWtD,KAAKmC,qBAAqBO,OAAS,CAClD,CACA1C,KAAKuD,YAAYD,EACrB,CACA,WAAAC,CAAYC,GACRxD,KAAKkC,oBAAsBsB,EAC3B,GAAIxD,KAAKyD,eAAgB,CACrB,MAAMC,EAAgB1D,KAAKyD,eAAeD,GAC1CE,IAAkB,MAAQA,SAAuB,OAAS,EAAIA,EAAc5C,OAChF,CACJ,CACA,mBAAA6C,GACI,GAAI3D,KAAKmC,sBAAwBnC,KAAKkC,qBAAuB,GAAKlC,KAAKkC,oBAAsBlC,KAAKmC,qBAAqBO,OAAQ,CAC3H1C,KAAKkB,aAAalB,KAAKmC,qBAAqBnC,KAAKkC,sBACjD,OAAO,IACX,CACA,OAAO,KACX,CACA,2BAAAU,CAA4BgB,GACxB,MAAMC,EAAgBD,EAAKV,cAC3B,MAAMM,EAAQT,MAAMC,QAAQhD,KAAKmC,uBAC7BnC,KAAKmC,qBAAqBO,OAAS,GACnC1C,KAAKmC,qBAAqB2B,WAAW3C,GAAWA,EAAO+B,cAAca,WAAWF,KACpF,UAAWL,IAAU,SAAU,CAC3BxD,KAAKuD,YAAYC,EACrB,CACJ,CACA,iBAAAQ,GACI,MAAO,CACHnD,MAAOb,KAAKa,MACZoD,MAAOlF,EAAK,eAAgB,CACxB,YAAaiB,KAAKa,MAAMqD,YAE5BC,aAAcnE,KAAKoE,cACnBC,MAAOrE,KAAKsE,cAEpB,CACA,aAAAC,GACI,MAAMC,gBAAEA,GAAoBlG,EAAgB0B,KAAKa,OACjD,MAAMkB,EAAa/B,KAAKa,MAAMmB,YAAc,KAC5C,OAAOyC,OAAOC,OAAOD,OAAOC,OAAO,CAAEC,IAAK3E,KAAK4E,YAAa/D,MAAOb,KAAKa,MAAOoD,MAAO,sBAAuBY,KAAM,OAAQC,KAAM,WAAY,wBAAyB9E,KAAKoC,SAAWpC,KAAKkC,qBAAuB,EAAI,UAAUlC,KAAKkC,sBAAwB6C,UAAW,oBAAqB,OAAQ,gBAAiB,UAAW,mBAAoBP,EAAgB9B,OAAS,EAAI8B,EAAgBQ,KAAK,KAAOD,UAAW,gBAAiB/E,KAAKoC,QAAU,OAAS,QAAS,aAAcpC,KAAKa,MAAMoE,mBAAqBjF,KAAKa,MAAMqE,SAAW,SAAWlF,KAAKa,MAAMqE,OAASH,UAAW,kBAAmB/E,KAAKa,MAAMsE,IAAK,oBAAqBnF,KAAKa,MAAMuE,UAAWlF,MAAOF,KAAKa,MAAMJ,OAAQ4E,UAAWrF,KAAKa,MAAMyE,WAAYC,eAAgB,MAAOC,YAAa,MAAOC,SAAU1D,EAAY2D,kBAAmB,KAAMC,GAAI3F,KAAKa,MAAMsE,IAAKtF,KAAMG,KAAKa,MAAMc,MAAOiE,SAAU5F,KAAKa,MAAMN,WAAaP,KAAKqB,WAAWC,UAAW,CAAEuE,QAAUxD,IAC14BrC,KAAKqB,WAAWC,SAASuE,QAAQxD,GACjCrC,KAAK8F,cAAgB,IAAI,EAC1BC,OAAS1D,IACRrC,KAAKqB,WAAWC,SAASyE,OAAO1D,GAChCrC,KAAK8F,cAAgB,KAAK,EAC3BlE,SAAU5B,KAAK4B,SAASoE,KAAKhG,MAAOuB,QAASvB,KAAKuB,QAAQyE,KAAKhG,MAAOiG,YAAajG,KAAKa,MAAMP,cACzG,CACA,MAAA4F,GACI,MAAMnE,EAAa/B,KAAKa,MAAMmB,YAAc,KAC5C,OAAQ9D,EAAEK,EAAuBkG,OAAOC,OAAO,CAAEjC,IAAK,4CAA8CzC,KAAKgE,qBAAsB9F,EAAEO,EAA8B,CAAEgE,IAAK,2CAA4C5B,MAAOb,KAAKa,OAAS3C,EAAE,MAAO,CAAEuE,IAAK,2CAA4CwB,MAAO,uBAAyB/F,EAAEQ,EAAmB+F,OAAOC,OAAO,CAAEjC,IAAK,4CAA8CzC,KAAKuE,kBAAmBvE,KAAKa,MAAMJ,QAAUT,KAAKa,MAAMR,iBAAoBnC,EAAEG,EAAgB,CAAEoE,IAAK,2CAA4C0D,OAAQ,gBAAiBjB,OAAQlF,KAAKoG,yBAA0BnB,WAAY,KAAMoB,SAAU,QAASrE,UAAWD,EAAY,cAAe,kBAAmBkC,MAAO,uBAAwBqC,OAAQvE,EAAYwE,IAAK,CAC1vBC,QAAS,KACLxG,KAAK8B,gBAAgB,KAEtB5D,EAAEY,EAAQ,CAAE2D,IAAK,2CAA4CgE,MAAO,uBAAwBC,MAAO,GAAIzC,MAAOlF,EAAK,gCAAiC,CACvJ,0CAA2CgD,IAC3CyE,QAASxG,KAAK2G,cAAcX,KAAKhG,SAAW9B,EAAES,EAAiC,CAAE8D,IAAK,2CAA4CmE,yBAA0B5G,KAAK4G,yBAA0BC,UAAW7G,KAAKwC,sBAAsBwD,KAAKhG,MAAOsG,QAAStG,KAAKoC,SAAWL,GAAcgB,MAAMC,QAAQhD,KAAKmC,uBAC3SnC,KAAKmC,qBAAqBO,OAAS,GACnC1C,KAAKmC,qBAAqB2E,KAAI,CAAC3F,EAAQqC,IAAWtF,EAAEU,EAA2B,CAAE6G,SAAU,MAAOjC,MAAOA,EAAOrC,OAAQA,EAAQ4F,WAAY/G,KAAKa,MAAMJ,OAAQkE,IAAMqC,IAC7J,GAAIA,EACAhH,KAAKyD,eAAeD,GAASwD,CAAE,EACpCC,SAAUjH,KAAKa,MAAMJ,SAAWU,EAAQqF,QAAS,KAChDxG,KAAKkB,aAAaC,GAClBnB,KAAK2G,gBACL3G,KAAKoC,QAAU,KAAK,EACrB8E,YAAa,KACZ,IAAKlH,KAAK4G,yBAA0B,CAChC5G,KAAKuD,YAAYC,EACrB,GACDqC,QAAS,KACR7F,KAAKuD,YAAYC,EAAM,EACxBqD,UAAYM,IACX,GAAIA,EAAE1E,MAAQ,SAAW0E,EAAE1E,MAAQ,cAAe,CAC9CzC,KAAKkB,aAAaC,GAClBnB,KAAK2G,gBACLQ,EAAEC,gBACN,SAEhB,CACA,aAAAC,CAAchF,GACV,IAAIjB,EAAIkG,EACR,MAAMC,EAAc,CAACC,EAAQC,KACzB,IAAIrG,EACJiB,EAAM+E,iBACN,GAAII,IAAWzC,UAAW,CACtB/E,KAAKoC,QAAUoF,EACf,IAAKA,EAAQ,EACRpG,EAAKpB,KAAKe,YAAc,MAAQK,SAAY,OAAS,EAAIA,EAAGN,OACjE,CACJ,CACA2G,IAAa,MAAQA,SAAkB,OAAS,EAAIA,GAAU,EAElE,OAAQpF,EAAMI,KACV,IAAK,OACL,IAAK,YAAa,CACdzC,KAAK4G,yBAA2B,KAChCW,EAAY,MAAM,IAAMvH,KAAKoD,UAAU,KACvC,KACJ,CACA,IAAK,KACL,IAAK,UAAW,CACZpD,KAAK4G,yBAA2B,KAChCW,EAAY,MAAM,IAAMvH,KAAKoD,WAAW,KACxC,KACJ,CACA,IAAK,MACD,GAAIpD,KAAKoC,QAAS,CACdpC,KAAKoC,QAAU,OACdhB,EAAKpB,KAAKe,YAAc,MAAQK,SAAY,OAAS,EAAIA,EAAGN,OACjE,CACA,MACJ,IAAK,MACL,IAAK,SAAU,CACXd,KAAKoC,QAAU,MACfC,EAAM+E,kBACLE,EAAKtH,KAAKe,YAAc,MAAQuG,SAAY,OAAS,EAAIA,EAAGxG,QAC7D,KACJ,CACA,IAAK,IACL,IAAK,QACL,IAAK,cAAe,CAChB,GAAId,KAAKoC,QAAS,CACd,GAAIpC,KAAK2D,sBAAuB,CAC5B3D,KAAKoC,QAAU,KACnB,CACJ,KACK,CACDpC,KAAK2G,eACT,CACAtE,EAAM+E,iBACN,KACJ,CACA,IAAK,OAAQ,CACTpH,KAAK4G,yBAA2B,KAChCW,EAAYxC,WAAW,KACnB,GAAI/E,KAAKoC,QAAS,CACdpC,KAAKuD,YAAY,EACrB,KAEJ,KACJ,CACA,IAAK,MAAO,CACRvD,KAAK4G,yBAA2B,KAChCW,EAAYxC,WAAW,KACnB,GAAI/E,KAAKoC,QAAS,CACdpC,KAAKuD,YAAYvD,KAAKmC,qBAAuBnC,KAAKmC,qBAAqBO,OAAS,EAAI,EACxF,KAEJ,KACJ,CACA,IAAK,SAAU,CACX1C,KAAK4G,yBAA2B,KAChCW,EAAYxC,WAAW,IAAM/E,KAAKoC,SAAWpC,KAAKoD,WAAW,MAC7D,KACJ,CACA,IAAK,WAAY,CACbpD,KAAK4G,yBAA2B,KAChCW,EAAYxC,WAAW,IAAM/E,KAAKoC,SAAWpC,KAAKoD,UAAU,MAC5D,KACJ,EAER,CACA,iBAAAsE,CAAkBrF,GACd,GAAIrC,KAAKF,OAASiF,YAAc/E,KAAKF,KAAK6H,SAAStF,EAAMC,QAAS,CAC9DtC,KAAKoC,QAAU,KACnB,CACJ,CACA,WAAAzC,CAAYiI,GACRzJ,EAAiB6B,KAAM4H,GACvB5H,KAAKyD,eAAiB,GACtBzD,KAAKkC,qBAAuB,EAC5BlC,KAAKoG,yBAA2BvH,EAAU,wBAC1CmB,KAAK2G,cAAgB,KACjB,IAAIvF,EACJ,MAAMW,EAAa/B,KAAKa,MAAMmB,YAAc,KAC5C,GAAID,EAAY,CACZ/B,KAAKoC,QAAU,KACnB,KACK,EACAhB,EAAKpB,KAAKe,YAAc,MAAQK,SAAY,OAAS,EAAIA,EAAGN,QAC7D,GAAId,KAAKoC,QAAS,CACdpC,KAAKoC,QAAU,KACnB,MACK,GAAIW,MAAMC,QAAQhD,KAAKmC,uBAAyBnC,KAAKmC,qBAAqBO,OAAS,EAAG,CACvF1C,KAAKoC,QAAU,KACf,MAAMyF,EAAgB7H,KAAKmC,qBAAqB2B,WAAW3C,GAAWA,IAAWnB,KAAKa,MAAMJ,SAC5FT,KAAKkC,oBAAsB2F,GAAiB,EAAIA,GAAiB,EACjE7H,KAAKuD,YAAYvD,KAAKkC,oBAC1B,CACJ,GAEJlC,KAAK4E,YAAeD,IAChB3E,KAAKe,SAAW4D,CAAG,EAEvB3E,KAAK4G,yBAA2B,MAChC5G,KAAKoC,QAAU,MACfpC,KAAKgC,UAAY,MACjBhC,KAAK8H,SAAW,MAChB9H,KAAKiF,WAAa,MAClBjF,KAAK+H,MAAQ,GACb/H,KAAKK,gBAAkB,KACvBL,KAAKO,UAAY,MACjBP,KAAKoE,cAAgB,MACrBpE,KAAKgI,SAAW,MAChBhI,KAAKa,MAAQ,CACTqD,UAAW,MACX7D,gBAAiB,KACjByH,SAAU,MACV3C,IAAK,MAAMnG,MACXkG,OAAQ,GACR1E,aAAc,GACdC,OAAQ,IAEZT,KAAK8F,cAAgB,MACrB9F,KAAKqB,WAAa,IAAI3B,EAAmBM,KAAM,WAAYA,KAAKF,MAChEE,KAAKuB,QAAUvB,KAAKuB,QAAQyE,KAAKhG,KACrC,CACA,WAAAsE,GACI,OAAO2D,QAAQjI,KAAKa,MAAMmH,YAAchI,KAAK8F,aACjD,CACA,mBAAAvG,CAAoBW,GAChBF,KAAKqB,WAAW9B,oBAAoBW,EACxC,CACA,iBAAAgI,CAAkBhI,GACdF,KAAKqB,WAAW6G,kBAAkBhI,EACtC,CACA,gBAAAiI,CAAiBjI,GACbF,KAAKqB,WAAW8G,iBAAiBjI,EACrC,CACA,eAAAkI,CAAgBlI,GACZF,KAAKqB,WAAW+G,gBAAgBlI,EACpC,CACA,iBAAAmI,CAAkBnI,GACdF,KAAKqB,WAAWgH,kBAAkBnI,EACtC,CACA,YAAAoI,CAAapI,GACTF,KAAKqB,WAAWiH,aAAapI,EACjC,CACA,aAAAqI,CAAcrI,GACVF,KAAKqB,WAAWkH,cAAcrI,EAClC,CACA,aAAAsI,CAActI,GACVF,KAAKqB,WAAWmH,cAActI,EAClC,CACA,WAAAuI,CAAYvI,GACRF,KAAKqB,WAAWoH,YAAYvI,EAChC,CACA,YAAAwI,CAAaxI,GACTF,KAAKqB,WAAWqH,aAAaxI,EACjC,CACA,UAAAyI,CAAWzI,GACPF,KAAKqB,WAAWsH,WAAWzI,EAC/B,CACA,gBAAA0I,CAAiB1I,GACbF,KAAKqB,WAAWuH,iBAAiB1I,EACrC,CACA,mBAAAT,CAAoBS,GAChBF,KAAKqB,WAAW5B,oBAAoBS,GACpCF,KAAKmC,qBAAuBjC,CAChC,CACA,sBAAAD,CAAuBC,GACnBF,KAAKqB,WAAWpB,uBAAuBC,EAC3C,CACA,gBAAAV,CAAiBU,GACbF,KAAKqB,WAAW7B,iBAAiBU,EACrC,CACA,2BAAA2I,CAA4B3I,GACxBF,KAAKqB,WAAWwH,4BAA4B3I,EAChD,CACA,eAAA4I,CAAgB5I,GACZF,KAAKqB,WAAWyH,gBAAgB5I,EACpC,CACA,aAAAC,CAAcD,GACVF,KAAKqB,WAAWlB,cAAcD,GAC9BF,KAAKqB,WAAWQ,uBAAuB3B,EAC3C,CACA,iBAAAE,GACIJ,KAAKyD,eAAiB,GACtBzD,KAAKgI,SAAWhI,KAAKgI,WAAa,KAClChI,KAAKqB,WAAWjB,oBAChBJ,KAAKa,MAAMqD,YAAclE,KAAKa,MAAMJ,OACpCT,KAAKqB,WAAW0H,wBAAwBC,GAAOhJ,KAAKa,MAAMqD,YAAc8E,IACxEhJ,KAAKmC,qBAAuBnC,KAAKa,MAAML,YAC3C,CACA,gBAAAyI,GACIjJ,KAAK4G,yBAA2B,KACpC,CACA,cAAAsC,CAAe7G,GACX8G,YAAW,KACP,IAAI/H,EACJ,MAAOA,EAAKpB,KAAKF,QAAU,MAAQsB,SAAY,OAAS,EAAIA,EAAGuG,SAASyB,SAASC,gBAAiB,CAC9FrJ,KAAK+F,OAAO1D,EAChB,IAER,CACA,gBAAAiH,CAAiBjH,GACbrC,KAAK+F,OAAO1D,EAChB,CACA,MAAA0D,CAAO1D,GACH,GAAIrC,KAAKoC,QAAS,CACd,GAAIC,aAAiBkH,YAAclH,EAAMmH,OAASC,OAAQ,CACtDzJ,KAAKoC,QAAU,KACnB,CACJ,CACJ,CACA,QAAAR,CAASS,GACLrC,KAAKqB,WAAWC,SAASM,SAASS,GAClCrC,KAAKqB,WAAWQ,uBAAuB7B,KAAKa,MAAMJ,OACtD,CACA,QAAIX,GAAS,OAAO1B,EAAW4B,KAAO,CACtC,mBAAW0J,GAAa,MAAO,CAC3BpJ,aAAgB,CAAC,uBACjBgF,WAAc,CAAC,qBACftD,UAAa,CAAC,oBACd8F,SAAY,CAAC,mBACb7C,WAAc,CAAC,qBACf8C,MAAS,CAAC,gBACV5B,OAAU,CAAC,iBACXjB,OAAU,CAAC,iBACXyE,KAAQ,CAAC,eACThI,MAAS,CAAC,gBACV4E,IAAO,CAAC,cACRnB,UAAa,CAAC,oBACd5E,aAAgB,CAAC,uBACjBH,gBAAmB,CAAC,0BACpBE,UAAa,CAAC,oBACdqJ,qBAAwB,CAAC,+BACzB5B,SAAY,CAAC,mBACbvH,OAAU,CAAC,iBACZ,GAEPE,EAAYkJ,MAAQ,CAChBC,QAASpJ,UAGJC","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"kol-details.entry.esm.js","sources":["src/schema/props/details-callbacks.ts","src/components/details/style.scss?tag=kol-details&mode=default&encapsulation=shadow","src/components/details/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport type { Callback } from '../enums';\nimport type { EventValueOrEventCallback } from '../types/callbacks';\nimport { watchValidator } from '../utils';\n\n/* types */\nexport type DetailsCallbacksPropType<T> = {\n\t[Callback.onToggle]?: EventValueOrEventCallback<MouseEvent, T>;\n};\n\n/**\n * Defines the callback functions for detail events.\n */\nexport type PropDetailsCallbacks<T> = {\n\ton: DetailsCallbacksPropType<T>;\n};\n\n/* validator */\nexport const validateDetailsCallbacks = (component: Generic.Element.Component, value?: DetailsCallbacksPropType<boolean>): void => {\n\twatchValidator(component, `_on`, (value) => typeof value === 'object' && value !== null, new Set(['DetailsCallbacksPropType {Events.onToggle}']), value);\n};\n","@use '../@shared/mixins' as *;\n@use '../@shared/global' as *;\n@use '../host-display-block' as *;\n@use '../@shared/collapsible.mixin' as *;\n@use '../@shared/icon.mixin' as *;\n@use '../@shared/button.mixin' as *;\n\n@layer kol-component {\n\t@include kol-button-styles('kol-button');\n\t@include kol-icon-styles();\n\t.kol-details {\n\t\t.collapsible--open &__heading-button {\n\t\t\t.kol-icon {\n\t\t\t\ttransform: rotate(90deg);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, h, type JSX, Method, Prop, State, Watch } from '@stencil/core';\nimport KolCollapsibleFc, { type CollapsibleProps } from '../../functional-components/Collapsible';\nimport type { DetailsAPI, DetailsCallbacksPropType, DetailsStates, DisabledPropType, FocusableElement, HeadingLevel, LabelPropType } from '../../schema';\nimport { validateDetailsCallbacks, validateDisabled, validateLabel, validateOpen } from '../../schema';\nimport { nonce } from '../../utils/dev.utils';\nimport { delegateFocus, setFocus } from '../../utils/element-focus';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\nimport { watchHeadingLevel } from '../heading/validation';\n\n/**\n * The **Details** component allows additional information to be initially shown with a short introductory text,\n * which is only fully expanded after the user clicks on an arrow icon.\n *\n * By default, the **Details** component is displayed as a single-line layout element consisting of an arrow icon\n * followed by a short introductory text. The actual content is revealed below after clicking the header area. The arrow icon\n * changes its orientation from **_right_** to **_down_**.\n * The component can also be closed again to hide the content.\n *\n * @slot - The content displayed in the detail description.\n */\n@Component({\n\ttag: 'kol-details',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolDetails implements DetailsAPI, FocusableElement {\n\t@Element() private readonly host?: HTMLKolDetailsElement;\n\n\tprivate readonly nonce = nonce();\n\tprivate buttonWcRef?: HTMLKolButtonWcElement;\n\n\tprivate readonly setButtonWcRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.buttonWcRef = ref;\n\t};\n\n\t/**\n\t * Sets focus on the internal element.\n\t */\n\t@Method()\n\tpublic async focus(): Promise<void> {\n\t\treturn delegateFocus(this.host!, () => setFocus(this.buttonWcRef!));\n\t}\n\n\tprivate toggleTimeout?: ReturnType<typeof setTimeout>;\n\n\tprivate handleOnClick = (event: MouseEvent) => {\n\t\tthis._open = !this._open;\n\n\t\t/**\n\t\t * Der Timeout wird benötigt, damit das Event\n\t\t * vom Button- auf das Accordion-Event wechselt.\n\t\t * So ist es dem Anwendenden möglich das _open-\n\t\t * Attribute abzufragen.\n\t\t */\n\n\t\tclearTimeout(this.toggleTimeout);\n\n\t\tthis.toggleTimeout = setTimeout(() => {\n\t\t\tif (this.host) {\n\t\t\t\tdispatchDomEvent(this.host, KolEvent.toggle, Boolean(this._open));\n\t\t\t}\n\t\t\tthis.state._on?.onToggle?.(event, Boolean(this._open));\n\t\t}, 25);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { _open, _label, _disabled, _level } = this.state;\n\n\t\tconst rootClass = 'kol-details';\n\n\t\tconst props: CollapsibleProps = {\n\t\t\tid: this.nonce,\n\t\t\tlabel: _label,\n\t\t\topen: _open,\n\t\t\tdisabled: _disabled,\n\t\t\tlevel: _level,\n\t\t\tonClick: this.handleOnClick,\n\t\t\tclass: rootClass,\n\t\t\tHeadingProps: { class: `${rootClass}__heading` },\n\t\t\tHeadingButtonProps: {\n\t\t\t\tref: this.setButtonWcRef,\n\t\t\t\tclass: `${rootClass}__heading-button`,\n\t\t\t\t_icons: 'kolicon-chevron-right',\n\t\t\t},\n\t\t\tContentProps: {\n\t\t\t\tclass: `${rootClass}__content indented-text`,\n\t\t\t\twrapperClass: `${rootClass}__wrapper`,\n\t\t\t\tanimationClass: `${rootClass}__wrapper-animation`,\n\t\t\t},\n\t\t};\n\n\t\treturn (\n\t\t\t<KolCollapsibleFc {...props}>\n\t\t\t\t<slot />\n\t\t\t</KolCollapsibleFc>\n\t\t);\n\t}\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t */\n\t@Prop() public _disabled?: 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 * Defines the callback functions for details.\n\t */\n\t@Prop() public _on?: DetailsCallbacksPropType<boolean>;\n\n\t/**\n\t * Opens/expands the element when truthy, closes/collapses when falsy.\n\t * @TODO: Change type back to `OpenPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t@State() public state: DetailsStates = {\n\t\t_label: '', // ⚠ required\n\t\t_level: 0,\n\t\t_on: {},\n\t};\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: DisabledPropType): void {\n\t\tvalidateDisabled(this, value);\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('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(on?: DetailsCallbacksPropType<boolean>) {\n\t\tvalidateDetailsCallbacks(this, on);\n\t}\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\tvalidateOpen(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateOpen(this._open);\n\t}\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"kol-details.entry.esm.js","sources":["src/schema/props/details-callbacks.ts","src/components/details/style.scss?tag=kol-details&mode=default&encapsulation=shadow","src/components/details/shadow.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\nimport type { Callback } from '../enums';\nimport type { EventValueOrEventCallback } from '../types/callbacks';\nimport { watchValidator } from '../utils';\n\n/* types */\nexport type DetailsCallbacksPropType<T> = {\n\t[Callback.onToggle]?: EventValueOrEventCallback<MouseEvent, T>;\n};\n\n/**\n * Defines the callback functions for detail events.\n */\nexport type PropDetailsCallbacks<T> = {\n\ton: DetailsCallbacksPropType<T>;\n};\n\n/* validator */\nexport const validateDetailsCallbacks = (component: Generic.Element.Component, value?: DetailsCallbacksPropType<boolean>): void => {\n\twatchValidator(component, `_on`, (value) => typeof value === 'object' && value !== null, new Set(['DetailsCallbacksPropType {Events.onToggle}']), value);\n};\n","@use '../@shared/mixins' as *;\n@use '../@shared/global' as *;\n@use '../host-display-block' as *;\n@use '../@shared/collapsible.mixin' as *;\n@use '../@shared/icon.mixin' as *;\n@use '../@shared/button.mixin' as *;\n\n@layer kol-component {\n\t@include kol-button-styles('kol-button');\n\t@include kol-icon-styles();\n\t.kol-details {\n\t\t.collapsible--open &__heading-button {\n\t\t\t.kol-icon {\n\t\t\t\ttransform: rotate(90deg);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, h, type JSX, Method, Prop, State, Watch } from '@stencil/core';\nimport KolCollapsibleFc, { type CollapsibleProps } from '../../functional-components/Collapsible';\nimport type { DetailsAPI, DetailsCallbacksPropType, DetailsStates, DisabledPropType, FocusableElement, HeadingLevel, LabelPropType } from '../../schema';\nimport { validateDetailsCallbacks, validateDisabled, validateLabel, validateOpen } from '../../schema';\nimport { nonce } from '../../utils/dev.utils';\nimport { delegateClick, setClick } from '../../utils/element-click';\nimport { delegateFocus, setFocus } from '../../utils/element-focus';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\nimport { watchHeadingLevel } from '../heading/validation';\n\n/**\n * The **Details** component allows additional information to be initially shown with a short introductory text,\n * which is only fully expanded after the user clicks on an arrow icon.\n *\n * By default, the **Details** component is displayed as a single-line layout element consisting of an arrow icon\n * followed by a short introductory text. The actual content is revealed below after clicking the header area. The arrow icon\n * changes its orientation from **_right_** to **_down_**.\n * The component can also be closed again to hide the content.\n *\n * @slot - The content displayed in the detail description.\n */\n@Component({\n\ttag: 'kol-details',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolDetails implements DetailsAPI, FocusableElement {\n\t@Element() private readonly host?: HTMLKolDetailsElement;\n\n\tprivate readonly nonce = nonce();\n\tprivate buttonWcRef?: HTMLKolButtonWcElement;\n\n\tprivate readonly setButtonWcRef = (ref?: HTMLKolButtonWcElement) => {\n\t\tthis.buttonWcRef = ref;\n\t};\n\n\t/**\n\t * Sets focus on the internal element.\n\t */\n\t@Method()\n\tpublic async focus(): Promise<void> {\n\t\treturn delegateFocus(this.host!, () => setFocus(this.buttonWcRef!));\n\t}\n\n\t/**\n\t * Triggers a click on the summary/toggle button.\n\t */\n\t@Method()\n\tpublic async click(): Promise<void> {\n\t\treturn delegateClick(this.host!, async () => setClick(this.buttonWcRef!));\n\t}\n\n\tprivate toggleTimeout?: ReturnType<typeof setTimeout>;\n\n\tprivate handleOnClick = (event: MouseEvent) => {\n\t\tthis._open = !this._open;\n\n\t\t/**\n\t\t * Der Timeout wird benötigt, damit das Event\n\t\t * vom Button- auf das Accordion-Event wechselt.\n\t\t * So ist es dem Anwendenden möglich das _open-\n\t\t * Attribute abzufragen.\n\t\t */\n\n\t\tclearTimeout(this.toggleTimeout);\n\n\t\tthis.toggleTimeout = setTimeout(() => {\n\t\t\tif (this.host) {\n\t\t\t\tdispatchDomEvent(this.host, KolEvent.toggle, Boolean(this._open));\n\t\t\t}\n\t\t\tthis.state._on?.onToggle?.(event, Boolean(this._open));\n\t\t}, 25);\n\t};\n\n\tpublic render(): JSX.Element {\n\t\tconst { _open, _label, _disabled, _level } = this.state;\n\n\t\tconst rootClass = 'kol-details';\n\n\t\tconst props: CollapsibleProps = {\n\t\t\tid: this.nonce,\n\t\t\tlabel: _label,\n\t\t\topen: _open,\n\t\t\tdisabled: _disabled,\n\t\t\tlevel: _level,\n\t\t\tonClick: this.handleOnClick,\n\t\t\tclass: rootClass,\n\t\t\tHeadingProps: { class: `${rootClass}__heading` },\n\t\t\tHeadingButtonProps: {\n\t\t\t\tref: this.setButtonWcRef,\n\t\t\t\tclass: `${rootClass}__heading-button`,\n\t\t\t\t_icons: 'kolicon-chevron-right',\n\t\t\t},\n\t\t\tContentProps: {\n\t\t\t\tclass: `${rootClass}__content indented-text`,\n\t\t\t\twrapperClass: `${rootClass}__wrapper`,\n\t\t\t\tanimationClass: `${rootClass}__wrapper-animation`,\n\t\t\t},\n\t\t};\n\n\t\treturn (\n\t\t\t<KolCollapsibleFc {...props}>\n\t\t\t\t<slot />\n\t\t\t</KolCollapsibleFc>\n\t\t);\n\t}\n\n\t/**\n\t * Makes the element not focusable and ignore all events.\n\t */\n\t@Prop() public _disabled?: 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 * Defines the callback functions for details.\n\t */\n\t@Prop() public _on?: DetailsCallbacksPropType<boolean>;\n\n\t/**\n\t * Opens/expands the element when truthy, closes/collapses when falsy.\n\t * @TODO: Change type back to `OpenPropType` after Stencil#4663 has been resolved.\n\t */\n\t@Prop({ mutable: true, reflect: true }) public _open?: boolean = false;\n\n\t@State() public state: DetailsStates = {\n\t\t_label: '', // ⚠ required\n\t\t_level: 0,\n\t\t_on: {},\n\t};\n\n\t@Watch('_disabled')\n\tpublic validateDisabled(value?: DisabledPropType): void {\n\t\tvalidateDisabled(this, value);\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('_level')\n\tpublic validateLevel(value?: HeadingLevel): void {\n\t\twatchHeadingLevel(this, value);\n\t}\n\n\t@Watch('_on')\n\tpublic validateOn(on?: DetailsCallbacksPropType<boolean>) {\n\t\tvalidateDetailsCallbacks(this, on);\n\t}\n\n\t@Watch('_open')\n\tpublic validateOpen(value?: boolean): void {\n\t\tvalidateOpen(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateDisabled(this._disabled);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateLevel(this._level);\n\t\tthis.validateOn(this._on);\n\t\tthis.validateOpen(this._open);\n\t}\n}\n"],"names":[],"mappings":"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"}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e,g as t}from"./index-BOCBxrrO.js";import{K as o}from"./Collapsible-DiUh8-C2.js";import{b as i}from"./common-BIkdAxr0.js";import{v as l}from"./disabled-BdPI9eda.js";import{v as a}from"./label-Cw7rCjUo.js";import{v as s}from"./open-BhLtfnQI.js";import{n as r}from"./dev.utils-C2fl1BE9.js";import{d as c,s as d}from"./element-focus-y2O-Z32P.js";import{d as h,K as p}from"./events-DHTi_wtD.js";import{w as m}from"./validation-s-zBxvaI.js";import"./tslib.es6-CxX45GIN.js";import"./component-names-C64MXeC1.js";import"./clsx-COFh-Vc8.js";import"./Heading-CdHsieJ-.js";import"./level-C5jpNYbv.js";import"./normalizers-MuBx2xIG.js";import"./_Uint8Array-UP73qmmG.js";import"./isArray-CcrBs4JM.js";import"./isObject-BJgq02Md.js";const f=(n,e)=>{i(n,"_on",n=>"object"==typeof n&&null!==n,new Set(["DetailsCallbacksPropType {Events.onToggle}"]),e)},b='@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: lightgray;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: 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    opacity: 0.5;\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .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--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=1774619801488"); /* IE9*/\n  src: url("kolicons.eot?t=1774619801488#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1774619801488") format("woff2"), url("kolicons.woff?t=1774619801488") format("woff"), url("kolicons.ttf?t=1774619801488") format("truetype"), url("kolicons.svg?t=1774619801488#kolicons") format("svg"); /* iOS 4.1- */\n}\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\n.kolicon-alert-error::before {\n  content: "\\ea01";\n}\n\n.kolicon-alert-info::before {\n  content: "\\ea02";\n}\n\n.kolicon-alert-success::before {\n  content: "\\ea03";\n}\n\n.kolicon-alert-warning::before {\n  content: "\\ea04";\n}\n\n.kolicon-check::before {\n  content: "\\ea05";\n}\n\n.kolicon-chevron-double-left::before {\n  content: "\\ea06";\n}\n\n.kolicon-chevron-double-right::before {\n  content: "\\ea07";\n}\n\n.kolicon-chevron-down::before {\n  content: "\\ea08";\n}\n\n.kolicon-chevron-left::before {\n  content: "\\ea09";\n}\n\n.kolicon-chevron-right::before {\n  content: "\\ea0a";\n}\n\n.kolicon-chevron-up::before {\n  content: "\\ea0b";\n}\n\n.kolicon-cogwheel::before {\n  content: "\\ea0c";\n}\n\n.kolicon-cross::before {\n  content: "\\ea0d";\n}\n\n.kolicon-eye-closed::before {\n  content: "\\ea0e";\n}\n\n.kolicon-eye::before {\n  content: "\\ea0f";\n}\n\n.kolicon-house::before {\n  content: "\\ea10";\n}\n\n.kolicon-kolibri::before {\n  content: "\\ea11";\n}\n\n.kolicon-link-external::before {\n  content: "\\ea12";\n}\n\n.kolicon-link::before {\n  content: "\\ea13";\n}\n\n.kolicon-minus::before {\n  content: "\\ea14";\n}\n\n.kolicon-plus::before {\n  content: "\\ea15";\n}\n\n.kolicon-settings::before {\n  content: "\\ea16";\n}\n\n.kolicon-sort-asc::before {\n  content: "\\ea17";\n}\n\n.kolicon-sort-desc::before {\n  content: "\\ea18";\n}\n\n.kolicon-sort-neutral::before {\n  content: "\\ea19";\n}\n\n.kolicon-up::before {\n  content: "\\ea1a";\n}\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: #000;\n    background-color: #fff;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: #000;\n    background-color: #fff;\n    position: relative;\n    z-index: 1000;\n  }\n  @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}',u=class{constructor(e){n(this,e),this.nonce=r(),this.setButtonWcRef=n=>{this.buttonWcRef=n},this.handleOnClick=n=>{this._open=!this._open,clearTimeout(this.toggleTimeout),this.toggleTimeout=setTimeout(()=>{var e,t;this.host&&h(this.host,p.toggle,Boolean(this._open)),null===(t=null===(e=this.state._on)||void 0===e?void 0:e.onToggle)||void 0===t||t.call(e,n,Boolean(this._open))},25)},this._disabled=!1,this._level=0,this._open=!1,this.state={_label:"",_level:0,_on:{}}}async focus(){return c(this.host,()=>d(this.buttonWcRef))}render(){const{_open:n,_label:t,_disabled:i,_level:l}=this.state,a="kol-details",s={id:this.nonce,label:t,open:n,disabled:i,level:l,onClick:this.handleOnClick,class:a,HeadingProps:{class:`${a}__heading`},HeadingButtonProps:{ref:this.setButtonWcRef,class:`${a}__heading-button`,_icons:"kolicon-chevron-right"},ContentProps:{class:`${a}__content indented-text`,wrapperClass:`${a}__wrapper`,animationClass:`${a}__wrapper-animation`}};return e(o,Object.assign({key:"36bc75219c50c7f11bb7eb8796c45d592bc3edab"},s),e("slot",{key:"2146045f2acbdb457bc20dc7108058c67463244d"}))}validateDisabled(n){l(this,n)}validateLabel(n){a(this,n,{required:!0})}validateLevel(n){m(this,n)}validateOn(n){f(this,n)}validateOpen(n){s(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"]}}};u.style={default:b};export{u as kol_details};
+import{r as n,h as e,g as t}from"./index-BPtT34o3.js";import{K as o}from"./Collapsible-Cxiz2gVO.js";import{b as i}from"./common-5ExJH6NU.js";import{v as l}from"./disabled-Cp_Z3qUn.js";import{v as a}from"./label-Cd37SRqu.js";import{v as s}from"./open-CQYEMxrb.js";import{n as r}from"./dev.utils-CfUO8naH.js";import{d as c,s as d}from"./element-click-BTxuJDNT.js";import{d as h,s as p}from"./element-focus-BKUtVrWY.js";import{d as m,K as f}from"./events-DHTi_wtD.js";import{w as b}from"./validation-1WO5IiaK.js";import"./tslib.es6-CxX45GIN.js";import"./component-names-pgL1e5No.js";import"./clsx-COFh-Vc8.js";import"./Heading-CdhA3sYv.js";import"./level-BxYUNJ1-.js";import"./normalizers-KEHwXLG5.js";import"./_Uint8Array-UP73qmmG.js";import"./isArray-CcrBs4JM.js";import"./isObject-BJgq02Md.js";const u=(n,e)=>{i(n,"_on",n=>"object"==typeof n&&null!==n,new Set(["DetailsCallbacksPropType {Events.onToggle}"]),e)},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: lightgray;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: 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    opacity: 0.5;\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .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--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=1774956515321"); /* IE9*/\n  src: url("kolicons.eot?t=1774956515321#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1774956515321") format("woff2"), url("kolicons.woff?t=1774956515321") format("woff"), url("kolicons.ttf?t=1774956515321") format("truetype"), url("kolicons.svg?t=1774956515321#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: #000;\n    background-color: #fff;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: #000;\n    background-color: #fff;\n    position: relative;\n    z-index: 1000;\n  }\n  @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}',g=class{constructor(e){n(this,e),this.nonce=r(),this.setButtonWcRef=n=>{this.buttonWcRef=n},this.handleOnClick=n=>{this._open=!this._open,clearTimeout(this.toggleTimeout),this.toggleTimeout=setTimeout(()=>{var e,t;this.host&&m(this.host,f.toggle,Boolean(this._open)),null===(t=null===(e=this.state._on)||void 0===e?void 0:e.onToggle)||void 0===t||t.call(e,n,Boolean(this._open))},25)},this._disabled=!1,this._level=0,this._open=!1,this.state={_label:"",_level:0,_on:{}}}async focus(){return h(this.host,()=>p(this.buttonWcRef))}async click(){return c(this.host,async()=>d(this.buttonWcRef))}render(){const{_open:n,_label:t,_disabled:i,_level:l}=this.state,a="kol-details",s={id:this.nonce,label:t,open:n,disabled:i,level:l,onClick:this.handleOnClick,class:a,HeadingProps:{class:`${a}__heading`},HeadingButtonProps:{ref:this.setButtonWcRef,class:`${a}__heading-button`,_icons:"kolicon-chevron-right"},ContentProps:{class:`${a}__content indented-text`,wrapperClass:`${a}__wrapper`,animationClass:`${a}__wrapper-animation`}};return e(o,Object.assign({key:"3c99d7ecc7dbbae70baa196aa2d45a1746212830"},s),e("slot",{key:"5d9579bb486d5d1c0fced9d8dfc44f384034ef07"}))}validateDisabled(n){l(this,n)}validateLabel(n){a(this,n,{required:!0})}validateLevel(n){b(this,n)}validateOn(n){u(this,n)}validateOpen(n){s(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"]}}};g.style={default:k};export{g as kol_details};

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

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

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as t,h as a,g as i}from"./index-BOCBxrrO.js";import{e as s}from"./component-names-C64MXeC1.js";import{g as o,b as l,s as e}from"./common-BIkdAxr0.js";import{v as d}from"./label-Cw7rCjUo.js";import{c as n}from"./clsx-COFh-Vc8.js";import{d as r,K as c}from"./events-DHTi_wtD.js";import{h}from"./tooltip-open-tracking-rBbBgPWP.js";const b=(a,t,i)=>{o(a,"_width",t,Object.assign({defaultValue:"100%"},i))},f=["blank","card"],v=(a,t)=>{l(a,"_variant",a=>"string"==typeof a&&f.includes(a),new Set(f),t)},_=class{constructor(a){t(this,a),this.on={onClose:async()=>{await this.closeModal()}},this._width="100%",this._variant="blank",this.state={_label:"",_width:"100%"}}disconnectedCallback(){this.closeModal()}handleNativeCloseEvent(){var a,t;null===(t=null===(a=this.state._on)||void 0===a?void 0:a.onClose)||void 0===t||t.call(a),this.host&&r(this.host,c.close)}async openModal(){var a;null===(a=this.refDialog)||void 0===a||a.showModal()}async closeModal(){var a,t;null===(t=null===(a=this.refDialog)||void 0===a?void 0:a.close)||void 0===t||t.call(a)}render(){return a("dialog",{key:"79eabc223c45b893a37583629c11036c2abcff99","aria-label":this.state._label,class:n("kol-dialog","kol-modal",{"kol-dialog__blank":"blank"===this.state._variant,"kol-dialog__card":"card"===this.state._variant,"kol-modal__blank":"blank"===this.state._variant,"kol-modal__card":"card"===this.state._variant}),onCancel:h,onClose:this.handleNativeCloseEvent.bind(this),ref:a=>{this.refDialog=a},style:{width:this.state._width}},"blank"===this.state._variant&&a("slot",{key:"27c411d199e0ad7c9812febdbf3792cf44c3ddc7"}),"card"===this.state._variant&&a(s,{key:"49c0e69ab921e40845dcf25eeabd92d52cf1c4ff",_label:this.state._label,_hasCloser:!0,_on:this.on},a("slot",{key:"46213ef9acb4b3b07d54c22fdc98dfc4597bb42e"})))}validateLabel(a){d(this,a,{required:!0})}validateOn(a){if("object"==typeof a&&null!==a){const t={};"function"!=typeof a.onClose&&!0!==a.onClose||(t.onClose=a.onClose),e(this,"_on",t)}}validateWidth(a){b(this,a)}validateVariant(a){v(this,a)}componentWillLoad(){this.validateLabel(this._label),this.validateOn(this._on),this.validateWidth(this._width),this.validateVariant(this._variant)}get host(){return i(this)}static get watchers(){return{_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"],_variant:["validateVariant"]}}};export{_ as kol_dialog_wc};
+import{r as t,h as a,g as i}from"./index-BPtT34o3.js";import{e as s}from"./component-names-pgL1e5No.js";import{g as o,b as l,s as e}from"./common-5ExJH6NU.js";import{v as d}from"./label-Cd37SRqu.js";import{c as n}from"./clsx-COFh-Vc8.js";import{d as c,K as r}from"./events-DHTi_wtD.js";import{h}from"./tooltip-open-tracking-rBbBgPWP.js";const b=(a,t,i)=>{o(a,"_width",t,Object.assign({defaultValue:"100%"},i))},f=["blank","card"],v=(a,t)=>{l(a,"_variant",a=>"string"==typeof a&&f.includes(a),new Set(f),t)},_=class{constructor(a){t(this,a),this.on={onClose:async()=>{await this.closeModal()}},this._width="100%",this._variant="blank",this.state={_label:"",_width:"100%"}}disconnectedCallback(){this.closeModal()}handleNativeCloseEvent(){var a,t;null===(t=null===(a=this.state._on)||void 0===a?void 0:a.onClose)||void 0===t||t.call(a),this.host&&c(this.host,r.close)}async openModal(){var a;null===(a=this.refDialog)||void 0===a||a.showModal()}async closeModal(){var a,t;null===(t=null===(a=this.refDialog)||void 0===a?void 0:a.close)||void 0===t||t.call(a)}render(){return a("dialog",{key:"79eabc223c45b893a37583629c11036c2abcff99","aria-label":this.state._label,class:n("kol-dialog","kol-modal",{"kol-dialog__blank":"blank"===this.state._variant,"kol-dialog__card":"card"===this.state._variant,"kol-modal__blank":"blank"===this.state._variant,"kol-modal__card":"card"===this.state._variant}),onCancel:h,onClose:this.handleNativeCloseEvent.bind(this),ref:a=>{this.refDialog=a},style:{width:this.state._width}},"blank"===this.state._variant&&a("slot",{key:"27c411d199e0ad7c9812febdbf3792cf44c3ddc7"}),"card"===this.state._variant&&a(s,{key:"49c0e69ab921e40845dcf25eeabd92d52cf1c4ff",_label:this.state._label,_hasCloser:!0,_on:this.on},a("slot",{key:"46213ef9acb4b3b07d54c22fdc98dfc4597bb42e"})))}validateLabel(a){d(this,a,{required:!0})}validateOn(a){if("object"==typeof a&&null!==a){const t={};"function"!=typeof a.onClose&&!0!==a.onClose||(t.onClose=a.onClose),e(this,"_on",t)}}validateWidth(a){b(this,a)}validateVariant(a){v(this,a)}componentWillLoad(){this.validateLabel(this._label),this.validateOn(this._on),this.validateWidth(this._width),this.validateVariant(this._variant)}get host(){return i(this)}static get watchers(){return{_label:["validateLabel"],_on:["validateOn"],_width:["validateWidth"],_variant:["validateVariant"]}}};export{_ as kol_dialog_wc};

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@include kol-card;\n\n@layer kol-component {\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\n\t\t&::backdrop {\n\t\t\tbackground-color: rgb(0, 0, 0, 0.1);\n\t\t}\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, 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 */\n\t@Method()\n\tpublic async openModal() {\n\t\tawait this.dialogRef?.openModal();\n\t}\n\n\t/**\n\t * Closes the dialog.\n\t */\n\t@Method()\n\tpublic async closeModal() {\n\t\tawait this.dialogRef?.closeModal();\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolDialogWcTag ref={this.catchRef} _label={this._label} _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 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,w4VAAw4V;;MCgBn5V,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;AAuCc,QAAA,IAAM,CAAA,MAAA,GAAY,MAAM;AAKxB,QAAA,IAAQ,CAAA,QAAA,GAA0B,OAAO;AACxD;AAvCO,IAAA,MAAM,SAAS,GAAA;;AACrB,QAAA,OAAM,MAAA,IAAI,CAAC,SAAS,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,SAAS,EAAE,CAAA;;AAO3B,IAAA,MAAM,UAAU,GAAA;;AACtB,QAAA,OAAM,MAAA,IAAI,CAAC,SAAS,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,EAAE,CAAA;;IAG5B,MAAM,GAAA;QACZ,QACC,CAAA,CAAC,cAAc,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,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,EACnH,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@include kol-card;\n\n@layer kol-component {\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\n\t\t&::backdrop {\n\t\t\tbackground-color: rgb(0, 0, 0, 0.1);\n\t\t}\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, 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 */\n\t@Method()\n\tpublic async openModal() {\n\t\tawait this.dialogRef?.openModal();\n\t}\n\n\t/**\n\t * Closes the dialog.\n\t */\n\t@Method()\n\tpublic async closeModal() {\n\t\tawait this.dialogRef?.closeModal();\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<KolDialogWcTag ref={this.catchRef} _label={this._label} _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 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,6hWAA6hW;;MCgBxiW,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;AAuCc,QAAA,IAAM,CAAA,MAAA,GAAY,MAAM;AAKxB,QAAA,IAAQ,CAAA,QAAA,GAA0B,OAAO;AACxD;AAvCO,IAAA,MAAM,SAAS,GAAA;;AACrB,QAAA,OAAM,MAAA,IAAI,CAAC,SAAS,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,SAAS,EAAE,CAAA;;AAO3B,IAAA,MAAM,UAAU,GAAA;;AACtB,QAAA,OAAM,MAAA,IAAI,CAAC,SAAS,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,EAAE,CAAA;;IAG5B,MAAM,GAAA;QACZ,QACC,CAAA,CAAC,cAAc,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,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,EACnH,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACQ;;;;;;;;;"}

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

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{r as n,h as e}from"./index-BOCBxrrO.js";import{f as o}from"./component-names-C64MXeC1.js";import"./common-BIkdAxr0.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: lightgray;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: 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    opacity: 0.5;\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1774619801488"); /* IE9*/\n  src: url("kolicons.eot?t=1774619801488#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1774619801488") format("woff2"), url("kolicons.woff?t=1774619801488") format("woff"), url("kolicons.ttf?t=1774619801488") format("truetype"), url("kolicons.svg?t=1774619801488#kolicons") format("svg"); /* iOS 4.1- */\n}\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\n.kolicon-alert-error::before {\n  content: "\\ea01";\n}\n\n.kolicon-alert-info::before {\n  content: "\\ea02";\n}\n\n.kolicon-alert-success::before {\n  content: "\\ea03";\n}\n\n.kolicon-alert-warning::before {\n  content: "\\ea04";\n}\n\n.kolicon-check::before {\n  content: "\\ea05";\n}\n\n.kolicon-chevron-double-left::before {\n  content: "\\ea06";\n}\n\n.kolicon-chevron-double-right::before {\n  content: "\\ea07";\n}\n\n.kolicon-chevron-down::before {\n  content: "\\ea08";\n}\n\n.kolicon-chevron-left::before {\n  content: "\\ea09";\n}\n\n.kolicon-chevron-right::before {\n  content: "\\ea0a";\n}\n\n.kolicon-chevron-up::before {\n  content: "\\ea0b";\n}\n\n.kolicon-cogwheel::before {\n  content: "\\ea0c";\n}\n\n.kolicon-cross::before {\n  content: "\\ea0d";\n}\n\n.kolicon-eye-closed::before {\n  content: "\\ea0e";\n}\n\n.kolicon-eye::before {\n  content: "\\ea0f";\n}\n\n.kolicon-house::before {\n  content: "\\ea10";\n}\n\n.kolicon-kolibri::before {\n  content: "\\ea11";\n}\n\n.kolicon-link-external::before {\n  content: "\\ea12";\n}\n\n.kolicon-link::before {\n  content: "\\ea13";\n}\n\n.kolicon-minus::before {\n  content: "\\ea14";\n}\n\n.kolicon-plus::before {\n  content: "\\ea15";\n}\n\n.kolicon-settings::before {\n  content: "\\ea16";\n}\n\n.kolicon-sort-asc::before {\n  content: "\\ea17";\n}\n\n.kolicon-sort-desc::before {\n  content: "\\ea18";\n}\n\n.kolicon-sort-neutral::before {\n  content: "\\ea19";\n}\n\n.kolicon-up::before {\n  content: "\\ea1a";\n}\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: #000;\n    background-color: #fff;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: #000;\n    background-color: #fff;\n    position: relative;\n    z-index: 1000;\n  }\n  @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.kol-icon {\n  color: inherit;\n  display: inline-block;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: inherit;\n}\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\n@layer kol-component {\n  .kol-dialog,\n  .kol-modal {\n    min-height: var(--a11y-min-size);\n    padding: 0;\n    border: 0;\n  }\n  .kol-dialog::backdrop,\n  .kol-modal::backdrop {\n    background-color: rgba(0, 0, 0, 0.1);\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}',i=class{constructor(e){n(this,e),this.catchRef=n=>{this.dialogRef=n},this._width="100%",this._variant="blank"}async openModal(){var n;await(null===(n=this.dialogRef)||void 0===n?void 0:n.openModal())}async closeModal(){var n;await(null===(n=this.dialogRef)||void 0===n?void 0:n.closeModal())}render(){return e(o,{key:"24744fff4cfebb9ef188926e5390064ce7ec6931",ref:this.catchRef,_label:this._label,_on:this._on,_variant:this._variant,_width:this._width},e("slot",{key:"c8844dc7d6b9d16567ce400ae10f992018c6849d"}))}};i.style={default:t};export{i as kol_dialog};
+import{r as n,h as e}from"./index-BPtT34o3.js";import{f as o}from"./component-names-pgL1e5No.js";import"./common-5ExJH6NU.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: lightgray;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: 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    opacity: 0.5;\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: "kolicons";\n  src: url("kolicons.eot?t=1774956515321"); /* IE9*/\n  src: url("kolicons.eot?t=1774956515321#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1774956515321") format("woff2"), url("kolicons.woff?t=1774956515321") format("woff"), url("kolicons.ttf?t=1774956515321") format("truetype"), url("kolicons.svg?t=1774956515321#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: #000;\n    background-color: #fff;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: #000;\n    background-color: #fff;\n    position: relative;\n    z-index: 1000;\n  }\n  @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.kol-icon {\n  color: inherit;\n  display: inline-block;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: inherit;\n}\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\n@layer kol-component {\n  .kol-dialog,\n  .kol-modal {\n    min-height: var(--a11y-min-size);\n    padding: 0;\n    border: 0;\n  }\n  .kol-dialog::backdrop,\n  .kol-modal::backdrop {\n    background-color: rgba(0, 0, 0, 0.1);\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}',i=class{constructor(e){n(this,e),this.catchRef=n=>{this.dialogRef=n},this._width="100%",this._variant="blank"}async openModal(){var n;await(null===(n=this.dialogRef)||void 0===n?void 0:n.openModal())}async closeModal(){var n;await(null===(n=this.dialogRef)||void 0===n?void 0:n.closeModal())}render(){return e(o,{key:"24744fff4cfebb9ef188926e5390064ce7ec6931",ref:this.catchRef,_label:this._label,_on:this._on,_variant:this._variant,_width:this._width},e("slot",{key:"c8844dc7d6b9d16567ce400ae10f992018c6849d"}))}};i.style={default:t};export{i as kol_dialog};

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

@@ -1 +1 @@
-{"version":3,"names":["registerInstance","h","KolDialogWcTag","defaultStyleCss","KolDialog","constructor","hostRef","this","catchRef","ref","dialogRef","_width","_variant","openModal","_a","closeModal","render","key","_label","_on","style","default"],"sources":["0"],"mappings":";;;YAGcA,OAAkBC,MAAS,kCAC3BC,MAAsB,sCAC7B,uBAEP,MAAMC,EAAkB,szVAExB,MAAMC,EAAY,MACd,WAAAC,CAAYC,GACRN,EAAiBO,KAAMD,GACvBC,KAAKC,SAAYC,IACbF,KAAKG,UAAYD,CAAG,EAExBF,KAAKI,OAAS,OACdJ,KAAKK,SAAW,OACpB,CACA,eAAMC,GACF,IAAIC,SACIA,EAAKP,KAAKG,aAAe,MAAQI,SAAY,OAAS,EAAIA,EAAGD,YACzE,CACA,gBAAME,GACF,IAAID,SACIA,EAAKP,KAAKG,aAAe,MAAQI,SAAY,OAAS,EAAIA,EAAGC,aACzE,CACA,MAAAC,GACI,OAAQf,EAAEC,EAAgB,CAAEe,IAAK,2CAA4CR,IAAKF,KAAKC,SAAUU,OAAQX,KAAKW,OAAQC,IAAKZ,KAAKY,IAAKP,SAAUL,KAAKK,SAAUD,OAAQJ,KAAKI,QAAUV,EAAE,OAAQ,CAAEgB,IAAK,6CAC1M,GAEJb,EAAUgB,MAAQ,CACdC,QAASlB,UAGJC","ignoreList":[]}
+{"version":3,"names":["registerInstance","h","KolDialogWcTag","defaultStyleCss","KolDialog","constructor","hostRef","this","catchRef","ref","dialogRef","_width","_variant","openModal","_a","closeModal","render","key","_label","_on","style","default"],"sources":["0"],"mappings":";;;YAGcA,OAAkBC,MAAS,kCAC3BC,MAAsB,sCAC7B,uBAEP,MAAMC,EAAkB,28VAExB,MAAMC,EAAY,MACd,WAAAC,CAAYC,GACRN,EAAiBO,KAAMD,GACvBC,KAAKC,SAAYC,IACbF,KAAKG,UAAYD,CAAG,EAExBF,KAAKI,OAAS,OACdJ,KAAKK,SAAW,OACpB,CACA,eAAMC,GACF,IAAIC,SACIA,EAAKP,KAAKG,aAAe,MAAQI,SAAY,OAAS,EAAIA,EAAGD,YACzE,CACA,gBAAME,GACF,IAAID,SACIA,EAAKP,KAAKG,aAAe,MAAQI,SAAY,OAAS,EAAIA,EAAGC,aACzE,CACA,MAAAC,GACI,OAAQf,EAAEC,EAAgB,CAAEe,IAAK,2CAA4CR,IAAKF,KAAKC,SAAUU,OAAQX,KAAKW,OAAQC,IAAKZ,KAAKY,IAAKP,SAAUL,KAAKK,SAAUD,OAAQJ,KAAKI,QAAUV,EAAE,OAAQ,CAAEgB,IAAK,6CAC1M,GAEJb,EAAUgB,MAAQ,CACdC,QAASlB,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 { AlignPropType, DrawerAPI, DrawerStates, HasCloserPropType, KoliBriModalEventCallbacks, LabelPropType, OpenPropType } from '../../schema';\nimport { setState, validateAlign, validateHasCloser, validateLabel, validateOpen } from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\nimport { handleCancelOverlay } from '../../utils/tooltip-open-tracking';\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\n\t/**\n\t * Opens the drawer.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tasync open() {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_open: true,\n\t\t};\n\t\tthis.dialogElement?.showModal();\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\tasync close() {\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) return;\n\t\tconst computedStyle = window.getComputedStyle(wrapper);\n\t\tif (computedStyle.animationName === 'none') {\n\t\t\tthis.handleCloseDialog();\n\t\t}\n\t}\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_label={this.state._label}\n\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t_on={{\n\t\t\t\t\tonClose: () => {\n\t\t\t\t\t\tvoid this.close();\n\t\t\t\t\t},\n\t\t\t\t}}\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 aria-label={this.state._label} class=\"kol-drawer__dialog\" onCancel={handleCancelOverlay} ref={this.getRef}>\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 * 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('_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.open();\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.onClose === 'function') {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tsetState<KoliBriModalEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\tprivate handleCloseDialog() {\n\t\tthis.dialogElement?.close();\n\t\tthis._on?.onClose?.();\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.close);\n\t\t}\n\t}\n\n\tprivate handleClose() {\n\t\tvoid (async () => {\n\t\t\tawait this.close();\n\t\t\tthis.handleCloseDialog();\n\t\t})();\n\t}\n\n\tprivate handleAnimationEnd(e: Event): void {\n\t\tconst animationEvent = e as AnimationEvent;\n\t\tif (animationEvent.animationName.includes('slideOut')) {\n\t\t\tthis.handleCloseDialog();\n\t\t}\n\t}\n\n\tpublic componentDidLoad(): void {\n\t\tthis.dialogElement?.addEventListener('animationend', this.handleAnimationEnd.bind(this));\n\t\tthis.dialogElement?.addEventListener('close', this.handleClose.bind(this));\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.dialogElement?.removeEventListener('animationend', this.handleAnimationEnd.bind(this));\n\t\tthis.dialogElement?.removeEventListener('close', this.handleClose.bind(this));\n\t}\n\n\tpublic componentWillLoad() {\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateAlign(this._align);\n\t\tthis.validateHasCloser(this._hasCloser);\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 { AlignPropType, DrawerAPI, DrawerStates, HasCloserPropType, KoliBriModalEventCallbacks, LabelPropType, OpenPropType } from '../../schema';\nimport { setState, validateAlign, validateHasCloser, validateLabel, validateOpen } from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { dispatchDomEvent, KolEvent } from '../../utils/events';\nimport { handleCancelOverlay } from '../../utils/tooltip-open-tracking';\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\n\t/**\n\t * Opens the drawer.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tasync open() {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_open: true,\n\t\t};\n\t\tthis.dialogElement?.showModal();\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\tasync close() {\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) return;\n\t\tconst computedStyle = window.getComputedStyle(wrapper);\n\t\tif (computedStyle.animationName === 'none') {\n\t\t\tthis.handleCloseDialog();\n\t\t}\n\t}\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_label={this.state._label}\n\t\t\t\t_hasCloser={this.state._hasCloser}\n\t\t\t\t_on={{\n\t\t\t\t\tonClose: () => {\n\t\t\t\t\t\tvoid this.close();\n\t\t\t\t\t},\n\t\t\t\t}}\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 aria-label={this.state._label} class=\"kol-drawer__dialog\" onCancel={handleCancelOverlay} ref={this.getRef}>\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 * 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('_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.open();\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.onClose === 'function') {\n\t\t\t\tcallbacks.onClose = value.onClose;\n\t\t\t}\n\t\t\tsetState<KoliBriModalEventCallbacks>(this, '_on', callbacks);\n\t\t}\n\t}\n\n\tprivate handleCloseDialog() {\n\t\tthis.dialogElement?.close();\n\t\tthis._on?.onClose?.();\n\t\tif (this.host) {\n\t\t\tdispatchDomEvent(this.host, KolEvent.close);\n\t\t}\n\t}\n\n\tprivate handleClose() {\n\t\tvoid (async () => {\n\t\t\tawait this.close();\n\t\t\tthis.handleCloseDialog();\n\t\t})();\n\t}\n\n\tprivate handleAnimationEnd(e: Event): void {\n\t\tconst animationEvent = e as AnimationEvent;\n\t\tif (animationEvent.animationName.includes('slideOut')) {\n\t\t\tthis.handleCloseDialog();\n\t\t}\n\t}\n\n\tpublic componentDidLoad(): void {\n\t\tthis.dialogElement?.addEventListener('animationend', this.handleAnimationEnd.bind(this));\n\t\tthis.dialogElement?.addEventListener('close', this.handleClose.bind(this));\n\t}\n\n\tpublic disconnectedCallback(): void {\n\t\tthis.dialogElement?.removeEventListener('animationend', this.handleAnimationEnd.bind(this));\n\t\tthis.dialogElement?.removeEventListener('close', this.handleClose.bind(this));\n\t}\n\n\tpublic componentWillLoad() {\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateAlign(this._align);\n\t\tthis.validateHasCloser(this._hasCloser);\n\t\tthis.validateOn(this._on);\n\t}\n}\n"],"names":[],"mappings":"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"}