@public-ui/sample-react 2.2.19-rc.0 → 2.2.19

package/dist/assets/kol-select.entry-BtfUQlBF.js

@@ -0,0 +1,349 @@
+import{r as i,h as e,a6 as o,H as a}from"./index-BnWQwThm.js";const l=`@charset "UTF-8";
+/*
+ * This file contains all rules for accessibility.
+ */
+@layer kol-a11y {
+  :host {
+    /*
+     * Minimum size of interactive elements.
+     */
+    --a11y-min-size: calc(44rem / var(--kolibri-root-font-size, 16));
+    color: black;
+    /*
+     * No element should be used without a background and font color whose contrast ratio has
+     * not been checked. By initially setting the background color to white and the font color
+     * to black, the contrast ratio is ensured and explicit adjustment is forced.
+     */
+    background-color: white;
+    /*
+     * Verdana is an accessible font that can be used without requiring additional loading time.
+     */
+    font-family: Verdana;
+    /*
+     * Letter spacing is required for all texts.
+     */
+    letter-spacing: inherit;
+    /*
+     * Word spacing is required for all texts.
+     */
+    word-spacing: inherit;
+  }
+  * {
+    /*
+     * This rule enables the word dividing for all texts. That is important for high zoom levels.
+     */
+    hyphens: auto;
+    /*
+     * This rule enables the word dividing for all texts. That is important for high zoom levels.
+     */
+    word-break: break-word;
+  }
+  /*
+   * All interactive elements should have a minimum size of rem(44).
+   */
+  /* input:not([type='checkbox'], [type='radio'], [type='range']), */
+  /* option, */
+  /* select, */
+  /* textarea, */
+  button,
+  .kol-input .input {
+    min-width: var(--a11y-min-size);
+    min-height: var(--a11y-min-size);
+  }
+  /*
+   * Some interactive elements should not inherit the font-family and font-size.
+   */
+  a,
+  button,
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  input,
+  option,
+  select,
+  textarea {
+    /*
+     * All elements should inherit the font family from his parent element.
+     */
+    font-family: inherit;
+    /*
+     * All elements should inherit the font size from his parent element.
+     */
+    font-size: inherit;
+    /*
+     * Letter spacing is required for all texts.
+     */
+    letter-spacing: inherit;
+    /*
+     * Word spacing is required for all texts.
+     */
+    word-spacing: inherit;
+  }
+  /**
+  * Sometimes we need the semantic element for accessibility reasons,
+  * but we don't want to show it.
+  *
+  * - https://www.a11yproject.com/posts/how-to-hide-content/
+  */
+  .visually-hidden {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    white-space: nowrap;
+    clip-path: inset(50%);
+  }
+}
+@layer kol-global {
+  /*
+   * Dieses CSS stellt sicher, dass der Standard-Style
+   * von A und Button resettet werden.
+   */
+  :is(a, button) {
+    background-color: transparent;
+    width: 100%; /* 100% needed for custom width from outside */
+    margin: 0;
+    padding: 0;
+    border: none;
+  }
+  /*
+   * Ensure elements with hidden attribute to be actually not visible
+   * @see https://meowni.ca/hidden.is.a.lie.html
+   */
+  [hidden] {
+    display: none !important;
+  }
+}
+@layer kol-global {
+  :host {
+    /*
+     * The max-width is needed to prevent the table from overflowing the
+     * parent node, if the table is wider than the parent node.
+     */
+    max-width: 100%;
+    font-size: calc(16rem / var(--kolibri-root-font-size, 16));
+  }
+  * {
+    /*
+     * We prefer to box-sizing: border-box for all elements.
+     */
+    box-sizing: border-box;
+  }
+  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */
+  .kol-span-wc {
+    display: grid;
+    place-items: center;
+  }
+  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */
+  .kol-span-wc > span {
+    display: flex;
+    place-items: center;
+  }
+  a,
+  button {
+    cursor: pointer;
+  }
+  /* This is the text label. */
+  .hide-label > .kol-span-wc > span > span {
+    display: none;
+  }
+  /* Reset browser agent style. */
+  button:disabled {
+    color: unset;
+  }
+  .disabled label,
+  .disabled:focus-within label,
+  [aria-disabled=true],
+  [aria-disabled=true]:focus,
+  [disabled],
+  [disabled]:focus {
+    opacity: 0.5;
+    outline: none;
+    cursor: not-allowed;
+  }
+  [aria-disabled=true]:focus .kol-span-wc,
+  [disabled]:focus .kol-span-wc {
+    outline: none !important;
+  }
+  .badge-text-hint {
+    color: black;
+    background-color: lightgray;
+  }
+}
+@layer kol-component {
+  :host {
+    display: block;
+  }
+}
+@layer kol-component {
+  .kol-tooltip-wc {
+    display: contents;
+  }
+  .kol-tooltip-wc .tooltip-floating {
+    opacity: 0;
+    display: none;
+    position: fixed;
+    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */
+    top: 0;
+    left: 0;
+    /* Can be used to specify the tooltip-width from the outside. Unset by default. */
+    width: var(--kol-tooltip-width, unset);
+    max-width: 90vw;
+    max-height: 90vh;
+    animation-direction: normal;
+    /* Can be used to specify the animation duration from the outside. 250ms by default. */
+    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);
+    animation-fill-mode: forwards;
+    animation-iteration-count: 1;
+    animation-timing-function: ease-in;
+  }
+  .kol-tooltip-wc .tooltip-floating.hide {
+    animation-name: hideTooltip;
+  }
+  .kol-tooltip-wc .tooltip-floating.show {
+    animation-name: showTooltip;
+  }
+  /* Shared between content and arrow */
+  .kol-tooltip-wc .tooltip-area {
+    color: #000;
+    background-color: #fff;
+  }
+  .kol-tooltip-wc .tooltip-arrow {
+    transform: rotate(45deg);
+    position: absolute;
+    z-index: 999;
+    width: calc(10rem / var(--kolibri-root-font-size, 16));
+    height: calc(10rem / var(--kolibri-root-font-size, 16));
+  }
+  .kol-tooltip-wc .tooltip-content {
+    position: relative;
+    z-index: 1000;
+  }
+  @keyframes hideTooltip {
+    0% {
+      opacity: 1;
+    }
+    100% {
+      opacity: 0;
+      display: none;
+    }
+  }
+  @keyframes showTooltip {
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  }
+}
+@layer kol-component {
+  .required label > span::after,
+  .required legend > span::after {
+    content: "*";
+  }
+}
+@layer kol-component {
+  input,
+  textarea {
+    cursor: text;
+  }
+  input[type=checkbox],
+  input[type=color],
+  input[type=file],
+  input[type=radio],
+  input[type=range],
+  label,
+  option,
+  select {
+    cursor: pointer;
+  }
+  /* input[type='checkbox'], */
+  /* input[type='radio'], */
+  /* input[type='range'], */
+  input[type=color],
+  input[type=date],
+  input[type=datetime-local],
+  input[type=email],
+  input[type=file],
+  input[type=month],
+  input[type=number],
+  input[type=password],
+  input[type=search],
+  input[type=tel],
+  input[type=text],
+  input[type=time],
+  input[type=url],
+  input[type=week],
+  option,
+  select,
+  textarea {
+    background-color: transparent;
+    width: 100%;
+  }
+  /* needed hack for vertical alignment */
+  input[type=file] {
+    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;
+  }
+  /* needed hack for vertical alignment */
+  select[multiple] option {
+    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;
+  }
+}
+@layer kol-component {
+  .kol-alert-wc {
+    display: grid;
+  }
+  .kol-alert-wc .heading {
+    display: flex;
+    place-items: center;
+  }
+  .kol-alert-wc .heading > div {
+    flex-grow: 1;
+  }
+  .close {
+    /* Visible with forced colors */
+    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));
+  }
+}
+@layer kol-component {
+  .kol-input {
+    display: grid;
+  }
+  .kol-input .input-slot {
+    flex-grow: 1;
+  }
+  input:focus,
+  option:focus,
+  select:focus,
+  textarea:focus {
+    outline: 0;
+  }
+  .input {
+    background-color: white;
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+  }
+  button:not([role=link]) {
+    min-height: auto;
+  }
+  .input > .kol-icon {
+    display: grid;
+    place-items: center;
+  }
+  .kol-input.required .input-tooltip .span-label::after {
+    content: "*";
+  }
+}
+@layer kol-component {
+  option:checked::before {
+    content: "✓ ";
+  }
+}`,s=l,r=class{constructor(n){i(this,n),this.catchRef=t=>{this.selectWcRef=t},this._accessKey=void 0,this._alert=void 0,this._disabled=!1,this._error=void 0,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._multiple=!1,this._name=void 0,this._on=void 0,this._options=void 0,this._required=!1,this._shortKey=void 0,this._rows=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0}async getValue(){var n;return(n=this.selectWcRef)===null||n===void 0?void 0:n.getValue()}async focus(){await this.kolFocus()}async kolFocus(){var n;await((n=this.selectWcRef)===null||n===void 0?void 0:n.kolFocus())}render(){return e(a,{key:"9cc63f5b7e127bf93174926609b541fa48a13d13",class:"kol-select"},e(o,{key:"a3fe9555d9398ef493be9820c035abe07e86a4dc",ref:this.catchRef,_accessKey:this._accessKey,_alert:this._alert,_disabled:this._disabled,_error:this._error,_hideError:this._hideError,_hideLabel:this._hideLabel,_hint:this._hint,_icons:this._icons,_id:this._id,_label:this._label,_msg:this._msg,_multiple:this._multiple,_name:this._name,_on:this._on,_options:this._options,_required:this._required,_rows:this._rows,_shortKey:this._shortKey,_syncValueBySelector:this._syncValueBySelector,_tabIndex:this._tabIndex,_tooltipAlign:this._tooltipAlign,_touched:this._touched,_value:this._value},e("slot",{key:"343f2420fb7d7df5aa315c609653d370a369290b",name:"expert",slot:"expert"})))}};r.style={default:s};export{r as kol_select};
+//# sourceMappingURL=kol-select.entry-BtfUQlBF.js.map

package/dist/assets/kol-select.entry-BtfUQlBF.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kol-select.entry-BtfUQlBF.js","sources":["../../../../components/dist/esm/kol-select.entry.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { r as registerInstance, h, H as Host } from './index-efad7e81.js';\nimport { n as KolSelectWcTag } from './component-names-ad1568d0.js';\n\nconst defaultStyleCss = \"@charset \\\"UTF-8\\\";\\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(44rem / var(--kolibri-root-font-size, 16));\\n    color: black;\\n    /*\\n     * No element should be used without a background and font color whose contrast ratio has\\n     * not been checked. By initially setting the background color to white and the font color\\n     * to black, the contrast ratio is ensured and explicit adjustment is forced.\\n     */\\n    background-color: white;\\n    /*\\n     * Verdana is an accessible font that can be used without requiring additional loading time.\\n     */\\n    font-family: Verdana;\\n    /*\\n     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\n  }\\n  * {\\n    /*\\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\\n     */\\n    hyphens: auto;\\n    /*\\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\\n     */\\n    word-break: break-word;\\n  }\\n  /*\\n   * All interactive elements should have a minimum size of rem(44).\\n   */\\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\\n  /* option, */\\n  /* select, */\\n  /* textarea, */\\n  button,\\n  .kol-input .input {\\n    min-width: var(--a11y-min-size);\\n    min-height: var(--a11y-min-size);\\n  }\\n  /*\\n   * Some interactive elements should not inherit the font-family and font-size.\\n   */\\n  a,\\n  button,\\n  h1,\\n  h2,\\n  h3,\\n  h4,\\n  h5,\\n  h6,\\n  input,\\n  option,\\n  select,\\n  textarea {\\n    /*\\n     * All elements should inherit the font family from his parent element.\\n     */\\n    font-family: inherit;\\n    /*\\n     * All elements should inherit the font size from his parent element.\\n     */\\n    font-size: inherit;\\n    /*\\n     * Letter spacing is required for all texts.\\n     */\\n    letter-spacing: inherit;\\n    /*\\n     * Word spacing is required for all texts.\\n     */\\n    word-spacing: inherit;\\n  }\\n  /**\\n  * Sometimes we need the semantic element for accessibility reasons,\\n  * but we don't want to show it.\\n  *\\n  * - https://www.a11yproject.com/posts/how-to-hide-content/\\n  */\\n  .visually-hidden {\\n    position: fixed;\\n    top: 0;\\n    left: 0;\\n    width: 1px;\\n    height: 1px;\\n    overflow: hidden;\\n    white-space: nowrap;\\n    clip-path: inset(50%);\\n  }\\n}\\n@layer kol-global {\\n  /*\\n   * Dieses CSS stellt sicher, dass der Standard-Style\\n   * von A und Button resettet werden.\\n   */\\n  :is(a, button) {\\n    background-color: transparent;\\n    width: 100%; /* 100% needed for custom width from outside */\\n    margin: 0;\\n    padding: 0;\\n    border: none;\\n  }\\n  /*\\n   * Ensure elements with hidden attribute to be actually not visible\\n   * @see https://meowni.ca/hidden.is.a.lie.html\\n   */\\n  [hidden] {\\n    display: none !important;\\n  }\\n}\\n@layer kol-global {\\n  :host {\\n    /*\\n     * The max-width is needed to prevent the table from overflowing the\\n     * parent node, if the table is wider than the parent node.\\n     */\\n    max-width: 100%;\\n    font-size: calc(16rem / 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  /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\\n  .kol-span-wc {\\n    display: grid;\\n    place-items: center;\\n  }\\n  /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\\n  .kol-span-wc > span {\\n    display: flex;\\n    place-items: center;\\n  }\\n  a,\\n  button {\\n    cursor: pointer;\\n  }\\n  /* This is the text label. */\\n  .hide-label > .kol-span-wc > span > span {\\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-wc,\\n  [disabled]:focus .kol-span-wc {\\n    outline: none !important;\\n  }\\n  .badge-text-hint {\\n    color: black;\\n    background-color: lightgray;\\n  }\\n}\\n@layer kol-component {\\n  :host {\\n    display: block;\\n  }\\n}\\n@layer kol-component {\\n  .kol-tooltip-wc {\\n    display: contents;\\n  }\\n  .kol-tooltip-wc .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, unset);\\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-wc .tooltip-floating.hide {\\n    animation-name: hideTooltip;\\n  }\\n  .kol-tooltip-wc .tooltip-floating.show {\\n    animation-name: showTooltip;\\n  }\\n  /* Shared between content and arrow */\\n  .kol-tooltip-wc .tooltip-area {\\n    color: #000;\\n    background-color: #fff;\\n  }\\n  .kol-tooltip-wc .tooltip-arrow {\\n    transform: rotate(45deg);\\n    position: absolute;\\n    z-index: 999;\\n    width: calc(10rem / var(--kolibri-root-font-size, 16));\\n    height: calc(10rem / var(--kolibri-root-font-size, 16));\\n  }\\n  .kol-tooltip-wc .tooltip-content {\\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  .required label > span::after,\\n  .required legend > span::after {\\n    content: \\\"*\\\";\\n  }\\n}\\n@layer kol-component {\\n  input,\\n  textarea {\\n    cursor: text;\\n  }\\n  input[type=checkbox],\\n  input[type=color],\\n  input[type=file],\\n  input[type=radio],\\n  input[type=range],\\n  label,\\n  option,\\n  select {\\n    cursor: pointer;\\n  }\\n  /* input[type='checkbox'], */\\n  /* input[type='radio'], */\\n  /* input[type='range'], */\\n  input[type=color],\\n  input[type=date],\\n  input[type=datetime-local],\\n  input[type=email],\\n  input[type=file],\\n  input[type=month],\\n  input[type=number],\\n  input[type=password],\\n  input[type=search],\\n  input[type=tel],\\n  input[type=text],\\n  input[type=time],\\n  input[type=url],\\n  input[type=week],\\n  option,\\n  select,\\n  textarea {\\n    background-color: transparent;\\n    width: 100%;\\n  }\\n  /* needed hack for vertical alignment */\\n  input[type=file] {\\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 10) 0.5em;\\n  }\\n  /* needed hack for vertical alignment */\\n  select[multiple] option {\\n    padding: calc((var(--a11y-min-size) - (16rem / var(--kolibri-root-font-size, 16))) / 2) 0.5em;\\n  }\\n}\\n@layer kol-component {\\n  .kol-alert-wc {\\n    display: grid;\\n  }\\n  .kol-alert-wc .heading {\\n    display: flex;\\n    place-items: center;\\n  }\\n  .kol-alert-wc .heading > div {\\n    flex-grow: 1;\\n  }\\n  .close {\\n    /* Visible with forced colors */\\n    outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\\n  }\\n}\\n@layer kol-component {\\n  .kol-input {\\n    display: grid;\\n  }\\n  .kol-input .input-slot {\\n    flex-grow: 1;\\n  }\\n  input:focus,\\n  option:focus,\\n  select:focus,\\n  textarea:focus {\\n    outline: 0;\\n  }\\n  .input {\\n    background-color: white;\\n    display: flex;\\n    align-items: center;\\n    cursor: pointer;\\n  }\\n  button:not([role=link]) {\\n    min-height: auto;\\n  }\\n  .input > .kol-icon {\\n    display: grid;\\n    place-items: center;\\n  }\\n  .kol-input.required .input-tooltip .span-label::after {\\n    content: \\\"*\\\";\\n  }\\n}\\n@layer kol-component {\\n  option:checked::before {\\n    content: \\\"✓ \\\";\\n  }\\n}\";\nconst KolSelectDefaultStyle0 = defaultStyleCss;\n\nconst KolSelect = class {\n    constructor(hostRef) {\n        registerInstance(this, hostRef);\n        this.catchRef = (ref) => {\n            this.selectWcRef = ref;\n        };\n        this._accessKey = undefined;\n        this._alert = undefined;\n        this._disabled = false;\n        this._error = undefined;\n        this._hideError = false;\n        this._hideLabel = false;\n        this._hint = '';\n        this._icons = undefined;\n        this._id = undefined;\n        this._label = undefined;\n        this._msg = undefined;\n        this._multiple = false;\n        this._name = undefined;\n        this._on = undefined;\n        this._options = undefined;\n        this._required = false;\n        this._shortKey = undefined;\n        this._rows = undefined;\n        this._syncValueBySelector = undefined;\n        this._tabIndex = undefined;\n        this._tooltipAlign = 'top';\n        this._touched = false;\n        this._value = undefined;\n    }\n    async getValue() {\n        var _a;\n        return (_a = this.selectWcRef) === null || _a === void 0 ? void 0 : _a.getValue();\n    }\n    async focus() {\n        await this.kolFocus();\n    }\n    async kolFocus() {\n        var _a;\n        await ((_a = this.selectWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());\n    }\n    render() {\n        return (h(Host, { key: '9cc63f5b7e127bf93174926609b541fa48a13d13', class: \"kol-select\" }, h(KolSelectWcTag, { key: 'a3fe9555d9398ef493be9820c035abe07e86a4dc', ref: this.catchRef, _accessKey: this._accessKey, _alert: this._alert, _disabled: this._disabled, _error: this._error, _hideError: this._hideError, _hideLabel: this._hideLabel, _hint: this._hint, _icons: this._icons, _id: this._id, _label: this._label, _msg: this._msg, _multiple: this._multiple, _name: this._name, _on: this._on, _options: this._options, _required: this._required, _rows: this._rows, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _touched: this._touched, _value: this._value }, h(\"slot\", { key: '343f2420fb7d7df5aa315c609653d370a369290b', name: \"expert\", slot: \"expert\" }))));\n    }\n};\nKolSelect.style = {\n    default: KolSelectDefaultStyle0\n};\n\nexport { KolSelect as kol_select };\n\n//# sourceMappingURL=kol-select.entry.js.map"],"names":["defaultStyleCss","KolSelectDefaultStyle0","KolSelect","hostRef","registerInstance","ref","_a","h","Host","KolSelectWcTag"],"mappings":"8DAMA,MAAMA,EAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAClBC,EAAyBD,EAEzBE,EAAY,KAAM,CACpB,YAAYC,EAAS,CACjBC,EAAiB,KAAMD,CAAO,EAC9B,KAAK,SAAYE,GAAQ,CACrB,KAAK,YAAcA,CACvB,EACA,KAAK,WAAa,OAClB,KAAK,OAAS,OACd,KAAK,UAAY,GACjB,KAAK,OAAS,OACd,KAAK,WAAa,GAClB,KAAK,WAAa,GAClB,KAAK,MAAQ,GACb,KAAK,OAAS,OACd,KAAK,IAAM,OACX,KAAK,OAAS,OACd,KAAK,KAAO,OACZ,KAAK,UAAY,GACjB,KAAK,MAAQ,OACb,KAAK,IAAM,OACX,KAAK,SAAW,OAChB,KAAK,UAAY,GACjB,KAAK,UAAY,OACjB,KAAK,MAAQ,OACb,KAAK,qBAAuB,OAC5B,KAAK,UAAY,OACjB,KAAK,cAAgB,MACrB,KAAK,SAAW,GAChB,KAAK,OAAS,MAClB,CACA,MAAM,UAAW,CACb,IAAIC,EACJ,OAAQA,EAAK,KAAK,eAAiB,MAAQA,IAAO,OAAS,OAASA,EAAG,SAAQ,CACnF,CACA,MAAM,OAAQ,CACV,MAAM,KAAK,SAAQ,CACvB,CACA,MAAM,UAAW,CACb,IAAIA,EACJ,OAAQA,EAAK,KAAK,eAAiB,MAAQA,IAAO,OAAS,OAASA,EAAG,WAC3E,CACA,QAAS,CACL,OAAQC,EAAEC,EAAM,CAAE,IAAK,2CAA4C,MAAO,cAAgBD,EAAEE,EAAgB,CAAE,IAAK,2CAA4C,IAAK,KAAK,SAAU,WAAY,KAAK,WAAY,OAAQ,KAAK,OAAQ,UAAW,KAAK,UAAW,OAAQ,KAAK,OAAQ,WAAY,KAAK,WAAY,WAAY,KAAK,WAAY,MAAO,KAAK,MAAO,OAAQ,KAAK,OAAQ,IAAK,KAAK,IAAK,OAAQ,KAAK,OAAQ,KAAM,KAAK,KAAM,UAAW,KAAK,UAAW,MAAO,KAAK,MAAO,IAAK,KAAK,IAAK,SAAU,KAAK,SAAU,UAAW,KAAK,UAAW,MAAO,KAAK,MAAO,UAAW,KAAK,UAAW,qBAAsB,KAAK,qBAAsB,UAAW,KAAK,UAAW,cAAe,KAAK,cAAe,SAAU,KAAK,SAAU,OAAQ,KAAK,MAAM,EAAIF,EAAE,OAAQ,CAAE,IAAK,2CAA4C,KAAM,SAAU,KAAM,QAAQ,CAAE,CAAC,CAAC,CAC70B,CACJ,EACAL,EAAU,MAAQ,CACd,QAASD,CACb"}

package/dist/assets/{kol-single-select.entry-oZjRE15o.js → kol-single-select.entry-C5g8ij1Y.js}

@@ -1,4 +1,4 @@
-import{v as f,h as a,x as _,F as b,y as h,e as c,H as v,r as m,m as g,q as u,w as y,t as w,B as O}from"./index-CuVaZDbz.js";import{c as p}from"./clsx-09a06a12-B-dksMZM.js";import{t as d}from"./i18n-92411229-Cfm4uRHi.js";import{n as k}from"./dev.utils-47c3024f-C4J3ELKO.js";import{t as x}from"./events-29e84d75-CETYymUM.js";import{g as I}from"./controller-628ce6cc-C5c1kvSZ.js";import{I as S}from"./InternalUnderlinedBadgeText-64832a6c-Bh8ThDSf.js";import{I as V}from"./controller-icon-2d458d9b-cwJyI47P.js";import{f as C,b as A}from"./controller-ea7356ee-BsAkXfr2.js";import"./associated.controller-d302adf7-IWbmVqUN.js";import"./access-and-short-key-914780a7-DpB6vjpI.js";import"./hide-label-0d754c8e-Cwb07x68.js";import"./label-7d1ce375-BtKh8zOM.js";import"./tooltip-align-6964dd71-ioB4e8kB.js";import"./align-f3101425-pxLvIy2b.js";import"./icons-adcda9b0-ixCq6Ftq.js";class E extends V{constructor(t,i,n){super(t,i,n),this.keyOptionMap=new Map,this.afterPatchOptions=(s,l,o,r)=>{r==="_value"&&this.setFormAssociatedValue(s)},this.beforePatchOptions=(s,l)=>{const o=l.has("_options")?l.get("_options"):this.component.state._options;Array.isArray(o)&&o.length>0&&(this.keyOptionMap.clear(),C(this.keyOptionMap,o))},this.component=t}validateOptions(t){A(this.component,t,{hooks:{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions}})}validateRequired(t){u(this.component,"_required",t)}validateValue(t){y(this.component,"_value",i=>i!==void 0,new Set(["StencilUnknown"]),t)}validatePlaceholder(t){w(this.component,"_placeholder",t)}validateHideClearButton(t){u(this.component,"_hideClearButton",t)}validateRows(t){O(this.component,"_rows",t)}componentWillLoad(){super.componentWillLoad(),this.validateOptions(this.component._options),this.validateRequired(this.component._required),this.validateValue(this.component._value),this.validatePlaceholder(this.component._placeholder),this.validateHideClearButton(this.component._hideClearButton),this.validateRows(this.component._rows)}}const K=`/*
+import{v as f,h as a,x as _,F as v,y as h,e as c,H as b,r as m,m as g,q as u,w as y,t as w,B as O}from"./index-BnWQwThm.js";import{c as p}from"./clsx-09a06a12-B-dksMZM.js";import{t as d}from"./i18n-c0cd260c-Dpeh-TC-.js";import{n as k}from"./dev.utils-49eee6de-r4sFKo2j.js";import{t as x}from"./events-29e84d75-CETYymUM.js";import{g as I}from"./controller-a9871d80-sbqPhWaY.js";import{I as S}from"./InternalUnderlinedBadgeText-9f73fba4-Cmzp0bd5.js";import{I as V}from"./controller-icon-c319fa44-BJ0EfvQG.js";import{f as C,b as A}from"./controller-55f5b740-BjeA6jXQ.js";import"./associated.controller-d302adf7-DN32QDnF.js";import"./access-and-short-key-914780a7-C8MWsfus.js";import"./hide-label-0d754c8e-dD9kSAOS.js";import"./label-7d1ce375-jnwIcbOt.js";import"./tooltip-align-6964dd71-OzEFfAdD.js";import"./align-f3101425-QQ9Y8SbR.js";import"./icons-adcda9b0-WXW7qQqQ.js";class E extends V{constructor(t,i,n){super(t,i,n),this.keyOptionMap=new Map,this.afterPatchOptions=(s,l,o,r)=>{r==="_value"&&this.setFormAssociatedValue(s)},this.beforePatchOptions=(s,l)=>{const o=l.has("_options")?l.get("_options"):this.component.state._options;Array.isArray(o)&&o.length>0&&(this.keyOptionMap.clear(),C(this.keyOptionMap,o))},this.component=t}validateOptions(t){A(this.component,t,{hooks:{afterPatch:this.afterPatchOptions,beforePatch:this.beforePatchOptions}})}validateRequired(t){u(this.component,"_required",t)}validateValue(t){y(this.component,"_value",i=>i!==void 0,new Set(["StencilUnknown"]),t)}validatePlaceholder(t){w(this.component,"_placeholder",t)}validateHideClearButton(t){u(this.component,"_hideClearButton",t)}validateRows(t){O(this.component,"_rows",t)}componentWillLoad(){super.componentWillLoad(),this.validateOptions(this.component._options),this.validateRequired(this.component._required),this.validateValue(this.component._value),this.validatePlaceholder(this.component._placeholder),this.validateHideClearButton(this.component._hideClearButton),this.validateRows(this.component._rows)}}const K=`/*
  * This file contains all rules for accessibility.
  */
 @layer kol-a11y {
@@ -386,5 +386,5 @@ import{v as f,h as a,x as _,F as b,y as h,e as c,H as v,r as m,m as g,q as u,w a
     justify-content: center;
     cursor: default;
   }
-}`,B=K,z=class{async getValue(){return this._value}async kolFocus(){var e;(e=this.refInput)===null||e===void 0||e.focus()}onBlur(){var e,t,i;const n=(e=this.state._options)===null||e===void 0?void 0:e.find(s=>{var l,o;return((l=s.label)===null||l===void 0?void 0:l.toLowerCase())===((o=this._inputValue)===null||o===void 0?void 0:o.toLowerCase())});n?this.selectOption(n):(this._inputValue=(i=(t=this.state._options)===null||t===void 0?void 0:t.find(s=>s.value===this._value))===null||i===void 0?void 0:i.label,this._filteredOptions=[...this.state._options]),this._isOpen=!1,this._hasOpened=!1}createEventWithTarget(e,t){const i=new CustomEvent(e,{bubbles:!0,detail:t});return this.refInput&&(Object.defineProperty(i,"target",{value:this.refInput}),Object.defineProperty(i,"currentTarget",{value:this.refInput})),i}clearSelection(){if(!this.state._disabled){this._focusedOptionIndex=-1,this._value=null,this._inputValue="",this._filteredOptions=[...this.state._options];const t=this.createEventWithTarget("input",{name:this.state._name,value:null}),i=this.createEventWithTarget("change",{name:this.state._name,value:null});this.controller.onFacade.onInput(t,!0,{value:null}),this.controller.onFacade.onChange(i,{value:null})}}selectOption(e){var t,i;if(e.value===this._value){this._inputValue=e.label,this._filteredOptions=[...this.state._options];return}this._value=e.value,this._inputValue=e.label;const n=this.createEventWithTarget("input",{name:(t=this.state._name)!==null&&t!==void 0?t:"",value:e.value}),s=this.createEventWithTarget("change",{name:(i=this.state._name)!==null&&i!==void 0?i:"",value:e.value});this.controller.onFacade.onInput(n,!1,e.value),this.controller.onFacade.onChange(s,e.value),this._filteredOptions=[...this.state._options],this.controller.setFormAssociatedValue(this._value)}onInput(e){const t=e.target;this._inputValue=t.value,this._isOpen=!0,this.setFilteredOptionsByQuery(t.value),this._focusedOptionIndex=-1}handleKeyDownDropdown(e){e.key.length===1&&/[a-z0-9]/i.test(e.key)&&(e.preventDefault(),this._isOpen=!0,this.focusSuggestionStartingWith(e.key))}setFilteredOptionsByQuery(e){e?.trim()===""?this._filteredOptions=[...this.state._options]:Array.isArray(this.state._options)&&this.state._options.length>0&&e.length>0&&(this._filteredOptions=this.state._options.filter(t=>{var i,n;return(n=(i=t.label)===null||i===void 0?void 0:i.toLowerCase())===null||n===void 0?void 0:n.includes(e?.toLowerCase())}))}moveFocus(e){if(!this._filteredOptions)return;let t=this._focusedOptionIndex+e,i=0,n=!1;const s=this._filteredOptions.length;for(;i<s;){if(t>=this._filteredOptions.length&&(t=0),t<0&&(t=this._filteredOptions.length-1),!this._filteredOptions[t].disabled){n=!0;break}t+=e,i++}n&&(this._focusedOptionIndex=t,this.focusOption(this._focusedOptionIndex))}focusOption(e){if(this.refOptions){const t=this.refOptions[e];t?.focus()}}focusSuggestionStartingWith(e){const t=e.toLowerCase(),i=Array.isArray(this._filteredOptions)&&this._filteredOptions.findIndex(n=>n.label.toLowerCase().startsWith(t)&&!n.disabled);typeof i=="number"&&i>=0&&(this._focusedOptionIndex=i,this.focusOption(i))}render(){var e;const t=f(this.state._label),{ariaDescribedBy:i}=I(this.state);return a(v,{key:"eb08407aee51dbd63e5f60f502ce1ae55fda755c",class:"kol-single-select"},a("div",{key:"2a3df79dbea8777b23db99e9a6e59ad209b9eb4d",class:`single-select ${this.state._disabled===!0?"disabled":""} `},a(_,{key:"0a05e6a16d4f41ca518a0b02fa395c9589aeeb91",_accessKey:this.state._accessKey,_alert:this.showAsAlert(),_disabled:this.state._disabled,_hideError:this.state._hideError,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icons:this.state._icons,_id:this.state._id,_label:this.state._label,_msg:this.state._msg,_required:this.state._required,_shortKey:this.state._shortKey,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched,role:"presentation"},a("span",{key:"00fb8faa11342f56a731e8cbe6fa9b627469dda0",slot:"label"},t?a("slot",{name:"expert"}):typeof this.state._accessKey=="string"||typeof this.state._shortKey=="string"?a(b,null,a(S,{badgeText:h(this.state._accessKey||this.state._shortKey),label:this.state._label})," ",a("kbd",{class:"badge-text-hint","aria-hidden":"true"},h(this.state._accessKey||this.state._shortKey))):a("span",null,this.state._label)),a("div",{key:"fc68fcaa0d244d36617b866d33431e114914efd0",slot:"input"},a("div",{key:"a6bd25b065ba04658a752abd9ce0fe2892eb8ebd",class:"single-select__group"},a("input",Object.assign({key:"6d6c3deeabc4f28c802d477e988f05149992b891",ref:this.catchRef,class:"single-select__input","data-testid":"single-select-input",type:"text","aria-autocomplete":"both","aria-controls":"listbox",value:this._inputValue,accessKey:this.state._accessKey,"aria-keyshortcuts":this.state._shortKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&typeof this.state._label=="string"?this.state._label:void 0,"aria-activedescendant":this._isOpen&&this._focusedOptionIndex>=0?`option-${this._focusedOptionIndex}`:void 0,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off",disabled:this.state._disabled,name:this.state._name,required:this.state._required},this.controller.onFacade,{onInput:this.onInput.bind(this),onChange:this.onChange.bind(this),onClick:this.toggleListbox.bind(this),onFocus:n=>{this.controller.onFacade.onFocus(n),this.inputHasFocus=!0},onBlur:n=>{this.controller.onFacade.onBlur(n),this.inputHasFocus=!1},placeholder:this.state._placeholder})),this._inputValue&&!this.state._hideClearButton&&a(c,{key:"7c9cb0d5de633700ac46b5e1116c5c5255cfb220",_icons:"codicon codicon-close",_label:d("kol-delete-selection"),onClick:()=>{var n;this.clearSelection(),(n=this.refInput)===null||n===void 0||n.focus()},class:"single-select__delete"}),a("button",{key:"b3406ac5995db4c2e1600ee378b9020bfb8f0b0a",tabindex:"-1",class:"single-select__button",onClick:this.toggleListbox.bind(this),disabled:this.state._disabled},a(c,{key:"979b6ab3a87ecc47225aeab0412ab297a83884cf",_icons:"codicon codicon-triangle-down",_label:d("kol-dropdown")}))),this._isOpen&&this.state._disabled!==!0&&a("ul",{key:"127bbec729c3a33349afa88435aa41dc4f070dae",role:"listbox",class:p("single-select__listbox",this.blockSuggestionMouseOver&&"single-select__listbox--cursor-hidden"),style:{"--visible-options":`${(e=this._rows)!==null&&e!==void 0?e:5}`},onKeyDown:this.handleKeyDownDropdown.bind(this)},Array.isArray(this._filteredOptions)&&this._filteredOptions.length>0?this._filteredOptions.map((n,s)=>{var l;return a("li",{id:`option-${s}`,key:`-${s}`,ref:o=>{o&&(this.refOptions[s]=o)},tabIndex:-1,role:"option","aria-selected":this._value===n.value?"true":void 0,"aria-disabled":n.disabled?"true":void 0,onClick:o=>{var r;n.disabled||(this.selectOption(n),(r=this.refInput)===null||r===void 0||r.focus(),this.toggleListbox(o),this._isOpen=!1,this._hasOpened=!1)},onMouseOver:()=>{this.blockSuggestionMouseOver||(this._focusedOptionIndex=s,this.focusOption(s))},onFocus:()=>{n.disabled||(this._focusedOptionIndex=s,this.focusOption(s))},class:p("single-select__item",{"single-select__item--disabled":n.disabled}),onKeyDown:o=>{var r;n.disabled||(o.key==="Enter"||o.key==="NumpadEnter")&&(this.selectOption(n),(r=this.refInput)===null||r===void 0||r.focus(),this.toggleListbox(o),o.preventDefault())}},a("input",{class:"visually-hidden",type:"radio",disabled:(l=n.disabled)!==null&&l!==void 0?l:void 0,name:"options",id:`option-radio-${s}`,value:n.value,checked:this._value===n.value||s===this._focusedOptionIndex}),a("label",{htmlFor:`option-radio-${s}`,class:"radio-label"},n.label))}):a("li",{class:"single-select__no-results-message"},d("kol-no-results-message")," "))))))}handleFocusOut(){setTimeout(()=>{var e;!((e=this.host)===null||e===void 0)&&e.contains(document.activeElement)||this.onBlur()},0)}handleWindowBlur(){this.onBlur()}handleKeyDown(e){var t,i;const n=(s,l)=>{var o;e.preventDefault(),s!==void 0&&(this._isOpen=s,s||(o=this.refInput)===null||o===void 0||o.focus()),l?.()};switch(e.key){case"Down":case"ArrowDown":{this.blockSuggestionMouseOver=!0,n(!0,()=>this.moveFocus(1));break}case"Up":case"ArrowUp":{this.blockSuggestionMouseOver=!0,n(!0,()=>this.moveFocus(-1));break}case"Tab":this._isOpen&&(this._isOpen=!this._isOpen,(t=this.refInput)===null||t===void 0||t.focus());break;case"Esc":case"Escape":{this._hasOpened=!1,this._isOpen=!1,n(!1);break}case" ":{this._isOpen?Array.isArray(this._filteredOptions)&&this._filteredOptions.length>0&&(this.selectOption(this._filteredOptions[this._focusedOptionIndex]),(i=this.refInput)===null||i===void 0||i.focus(),n(!1)):this.toggleListbox(e);break}case"NumpadEnter":case"Enter":{this.toggleListbox(e),this._hasOpened=!1,this._isOpen=!1;break}case"Home":{this.blockSuggestionMouseOver=!0,n(void 0,()=>{this._isOpen&&(this._focusedOptionIndex=0,this.focusOption(this._focusedOptionIndex))});break}case"End":{this.blockSuggestionMouseOver=!0,n(void 0,()=>{this._isOpen&&(this._focusedOptionIndex=this._filteredOptions?this._filteredOptions.length-1:0,this.focusOption(this._focusedOptionIndex))});break}case"PageUp":{this.blockSuggestionMouseOver=!0,n(void 0,()=>this._isOpen&&this.moveFocus(-10));break}case"PageDown":{this.blockSuggestionMouseOver=!0,n(void 0,()=>this._isOpen&&this.moveFocus(10));break}}}constructor(e){m(this,e),this.refOptions=[],this.catchRef=t=>{this.refInput=t},this.toggleListbox=t=>{var i;if(t?.preventDefault(),!this.state._disabled&&!this._hasOpened){this._isOpen=!0,this._hasOpened=!0,(i=this.refInput)===null||i===void 0||i.focus();const n=Array.isArray(this._filteredOptions)?this._filteredOptions.findIndex(l=>l.label===this._inputValue):-1,s=this.refOptions[n];s?.scrollIntoView({block:"nearest"}),this.focusOption(this._focusedOptionIndex)}},this._focusedOptionIndex=-1,this._isOpen=!1,this._hasOpened=!1,this._filteredOptions=[],this._inputValue="",this.blockSuggestionMouseOver=!1,this._accessKey=void 0,this._placeholder=void 0,this._alert=void 0,this._disabled=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._options=void 0,this._required=!1,this._shortKey=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this._hideClearButton=!1,this._rows=void 0,this.state={_hideError:!1,_id:`id-${k()}`,_label:"",_options:[],_hideClearButton:!1},this.inputHasFocus=!1,this.controller=new E(this,"single-select",this.host)}showAsAlert(){return this.state._alert===void 0?!!this.state._touched&&!this.inputHasFocus:this.state._alert}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateOptions(e){this.controller.validateOptions(e),this._filteredOptions=e,this.updateInputValue(this._value)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e),this.oldValue=e,this.updateInputValue(e)}validateHideClearButton(e){this.controller.validateHideClearButton(e)}validateRows(e){this.controller.validateRows(e)}handleMouseEvent(){this.blockSuggestionMouseOver=!1}updateInputValue(e){if(Array.isArray(this._options)){const t=this._options.find(i=>i.value===e);this._inputValue=t?String(t.label):""}}componentWillLoad(){this.refOptions=[],this._touched=this._touched===!0,this.controller.componentWillLoad(),this.oldValue=this._value,this._filteredOptions=this.state._options,this.updateInputValue(this._value)}onChange(e){var t,i,n,s;this.oldValue!==((t=this.refInput)===null||t===void 0?void 0:t.value)&&(this.oldValue=(i=this.refInput)===null||i===void 0?void 0:i.value),x("change",this.host,this._value),typeof((n=this.state._on)===null||n===void 0?void 0:n.onChange)=="function"&&!this._isOpen&&this.state._on.onChange(e,this._value&&this.oldValue!==((s=this.refInput)===null||s===void 0?void 0:s.value))}static get delegatesFocus(){return!0}get host(){return g(this)}static get watchers(){return{_placeholder:["validatePlaceholder"],_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_options:["validateOptions"],_required:["validateRequired"],_shortKey:["validateShortKey"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"],"_hideClearButton ":["validateHideClearButton"],_rows:["validateRows"]}}};z.style={default:B};export{z as kol_single_select};
-//# sourceMappingURL=kol-single-select.entry-oZjRE15o.js.map
+}`,B=K,z=class{async getValue(){return this._value}async kolFocus(){var e;(e=this.refInput)===null||e===void 0||e.focus()}onBlur(){var e,t,i;const n=(e=this.state._options)===null||e===void 0?void 0:e.find(s=>{var l,o;return((l=s.label)===null||l===void 0?void 0:l.toLowerCase())===((o=this._inputValue)===null||o===void 0?void 0:o.toLowerCase())});n?this.selectOption(n):(this._inputValue=(i=(t=this.state._options)===null||t===void 0?void 0:t.find(s=>s.value===this._value))===null||i===void 0?void 0:i.label,this._filteredOptions=[...this.state._options]),this._isOpen=!1,this._hasOpened=!1}createEventWithTarget(e,t){const i=new CustomEvent(e,{bubbles:!0,detail:t});return this.refInput&&(Object.defineProperty(i,"target",{value:this.refInput}),Object.defineProperty(i,"currentTarget",{value:this.refInput})),i}clearSelection(){if(!this.state._disabled){this._focusedOptionIndex=-1,this._value=null,this._inputValue="",this._filteredOptions=[...this.state._options];const t=this.createEventWithTarget("input",{name:this.state._name,value:null}),i=this.createEventWithTarget("change",{name:this.state._name,value:null});this.controller.onFacade.onInput(t,!0,{value:null}),this.controller.onFacade.onChange(i,{value:null})}}selectOption(e){var t,i;if(e.value===this._value){this._inputValue=e.label,this._filteredOptions=[...this.state._options];return}this._value=e.value,this._inputValue=e.label;const n=this.createEventWithTarget("input",{name:(t=this.state._name)!==null&&t!==void 0?t:"",value:e.value}),s=this.createEventWithTarget("change",{name:(i=this.state._name)!==null&&i!==void 0?i:"",value:e.value});this.controller.onFacade.onInput(n,!1,e.value),this.controller.onFacade.onChange(s,e.value),this._filteredOptions=[...this.state._options],this.controller.setFormAssociatedValue(this._value)}onInput(e){const t=e.target;this._inputValue=t.value,this._isOpen=!0,this.setFilteredOptionsByQuery(t.value),this._focusedOptionIndex=-1}handleKeyDownDropdown(e){e.key.length===1&&/[a-z0-9]/i.test(e.key)&&(e.preventDefault(),this._isOpen=!0,this.focusSuggestionStartingWith(e.key))}setFilteredOptionsByQuery(e){e?.trim()===""?this._filteredOptions=[...this.state._options]:Array.isArray(this.state._options)&&this.state._options.length>0&&e.length>0&&(this._filteredOptions=this.state._options.filter(t=>{var i,n;return(n=(i=t.label)===null||i===void 0?void 0:i.toLowerCase())===null||n===void 0?void 0:n.includes(e?.toLowerCase())}))}moveFocus(e){if(!this._filteredOptions)return;let t=this._focusedOptionIndex+e,i=0,n=!1;const s=this._filteredOptions.length;for(;i<s;){if(t>=this._filteredOptions.length&&(t=0),t<0&&(t=this._filteredOptions.length-1),!this._filteredOptions[t].disabled){n=!0;break}t+=e,i++}n&&(this._focusedOptionIndex=t,this.focusOption(this._focusedOptionIndex))}focusOption(e){if(this.refOptions){const t=this.refOptions[e];t?.focus()}}focusSuggestionStartingWith(e){const t=e.toLowerCase(),i=Array.isArray(this._filteredOptions)&&this._filteredOptions.findIndex(n=>n.label.toLowerCase().startsWith(t)&&!n.disabled);typeof i=="number"&&i>=0&&(this._focusedOptionIndex=i,this.focusOption(i))}render(){var e;const t=f(this.state._label),{ariaDescribedBy:i}=I(this.state);return a(b,{key:"7180098d193a24c598e7a5d994e0faa7de779b40",class:"kol-single-select"},a("div",{key:"9fa7035c951a732dac6cf834b6d3a7fb210aa2e3",class:`single-select ${this.state._disabled===!0?"disabled":""} `},a(_,{key:"7a387335c227a1c72112c05d052247f4122b3618",_accessKey:this.state._accessKey,_alert:this.showAsAlert(),_disabled:this.state._disabled,_hideError:this.state._hideError,_hideLabel:this.state._hideLabel,_hint:this.state._hint,_icons:this.state._icons,_id:this.state._id,_label:this.state._label,_msg:this.state._msg,_required:this.state._required,_shortKey:this.state._shortKey,_tooltipAlign:this._tooltipAlign,_touched:this.state._touched,role:"presentation"},a("span",{key:"2f47e4f853340ab4710bebce19cc65b9234509c3",slot:"label"},t?a("slot",{name:"expert"}):typeof this.state._accessKey=="string"||typeof this.state._shortKey=="string"?a(v,null,a(S,{badgeText:h(this.state._accessKey||this.state._shortKey),label:this.state._label})," ",a("kbd",{class:"badge-text-hint","aria-hidden":"true"},h(this.state._accessKey||this.state._shortKey))):a("span",null,this.state._label)),a("div",{key:"9d7cec91578868224a7a91198345f8d4da5f21fa",slot:"input"},a("div",{key:"14e28f986822de92d05622eae4d3b12f64168d89",class:"single-select__group"},a("input",Object.assign({key:"e4f8f97dc7212cb34ddccff893bbfd04743602e9",ref:this.catchRef,class:"single-select__input","data-testid":"single-select-input",type:"text","aria-autocomplete":"both","aria-controls":"listbox",value:this._inputValue,accessKey:this.state._accessKey,"aria-keyshortcuts":this.state._shortKey,"aria-describedby":i.length>0?i.join(" "):void 0,"aria-label":this.state._hideLabel&&typeof this.state._label=="string"?this.state._label:void 0,"aria-activedescendant":this._isOpen&&this._focusedOptionIndex>=0?`option-${this._focusedOptionIndex}`:void 0,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off",disabled:this.state._disabled,name:this.state._name,required:this.state._required},this.controller.onFacade,{onInput:this.onInput.bind(this),onChange:this.onChange.bind(this),onClick:this.toggleListbox.bind(this),onFocus:n=>{this.controller.onFacade.onFocus(n),this.inputHasFocus=!0},onBlur:n=>{this.controller.onFacade.onBlur(n),this.inputHasFocus=!1},placeholder:this.state._placeholder})),this._inputValue&&!this.state._hideClearButton&&a(c,{key:"56f9c3f1ed3773092b83a8d025ebfa9ca6f71cd9",_icons:"codicon codicon-close",_label:d("kol-delete-selection"),onClick:()=>{var n;this.clearSelection(),(n=this.refInput)===null||n===void 0||n.focus()},class:"single-select__delete"}),a("button",{key:"120d09eccca8b3b8555e185ef2380edc7a402da1",tabindex:"-1",class:"single-select__button",onClick:this.toggleListbox.bind(this),disabled:this.state._disabled},a(c,{key:"59dff271a5219a84e3e8e0a18d3bf7e9e8b7fa5c",_icons:"codicon codicon-triangle-down",_label:d("kol-dropdown")}))),this._isOpen&&this.state._disabled!==!0&&a("ul",{key:"e4101ba05c1af934d188a1508c81cb14ef26d75e",role:"listbox",class:p("single-select__listbox",this.blockSuggestionMouseOver&&"single-select__listbox--cursor-hidden"),style:{"--visible-options":`${(e=this._rows)!==null&&e!==void 0?e:5}`},onKeyDown:this.handleKeyDownDropdown.bind(this)},Array.isArray(this._filteredOptions)&&this._filteredOptions.length>0?this._filteredOptions.map((n,s)=>{var l;return a("li",{id:`option-${s}`,key:`-${s}`,ref:o=>{o&&(this.refOptions[s]=o)},tabIndex:-1,role:"option","aria-selected":this._value===n.value?"true":void 0,"aria-disabled":n.disabled?"true":void 0,onClick:o=>{var r;n.disabled||(this.selectOption(n),(r=this.refInput)===null||r===void 0||r.focus(),this.toggleListbox(o),this._isOpen=!1,this._hasOpened=!1)},onMouseOver:()=>{this.blockSuggestionMouseOver||(this._focusedOptionIndex=s,this.focusOption(s))},onFocus:()=>{n.disabled||(this._focusedOptionIndex=s,this.focusOption(s))},class:p("single-select__item",{"single-select__item--disabled":n.disabled}),onKeyDown:o=>{var r;n.disabled||(o.key==="Enter"||o.key==="NumpadEnter")&&(this.selectOption(n),(r=this.refInput)===null||r===void 0||r.focus(),this.toggleListbox(o),o.preventDefault())}},a("input",{class:"visually-hidden",type:"radio",disabled:(l=n.disabled)!==null&&l!==void 0?l:void 0,name:"options",id:`option-radio-${s}`,value:n.value,checked:this._value===n.value||s===this._focusedOptionIndex}),a("label",{htmlFor:`option-radio-${s}`,class:"radio-label"},n.label))}):a("li",{class:"single-select__no-results-message"},d("kol-no-results-message")," "))))))}handleFocusOut(){setTimeout(()=>{var e;!((e=this.host)===null||e===void 0)&&e.contains(document.activeElement)||this.onBlur()},0)}handleWindowBlur(){this.onBlur()}handleKeyDown(e){var t,i;const n=(s,l)=>{var o;e.preventDefault(),s!==void 0&&(this._isOpen=s,s||(o=this.refInput)===null||o===void 0||o.focus()),l?.()};switch(e.key){case"Down":case"ArrowDown":{this.blockSuggestionMouseOver=!0,n(!0,()=>this.moveFocus(1));break}case"Up":case"ArrowUp":{this.blockSuggestionMouseOver=!0,n(!0,()=>this.moveFocus(-1));break}case"Tab":this._isOpen&&(this._isOpen=!this._isOpen,(t=this.refInput)===null||t===void 0||t.focus());break;case"Esc":case"Escape":{this._hasOpened=!1,this._isOpen=!1,n(!1);break}case" ":{this._isOpen?Array.isArray(this._filteredOptions)&&this._filteredOptions.length>0&&(this.selectOption(this._filteredOptions[this._focusedOptionIndex]),(i=this.refInput)===null||i===void 0||i.focus(),n(!1)):this.toggleListbox(e);break}case"NumpadEnter":case"Enter":{this.toggleListbox(e),this._hasOpened=!1,this._isOpen=!1;break}case"Home":{this.blockSuggestionMouseOver=!0,n(void 0,()=>{this._isOpen&&(this._focusedOptionIndex=0,this.focusOption(this._focusedOptionIndex))});break}case"End":{this.blockSuggestionMouseOver=!0,n(void 0,()=>{this._isOpen&&(this._focusedOptionIndex=this._filteredOptions?this._filteredOptions.length-1:0,this.focusOption(this._focusedOptionIndex))});break}case"PageUp":{this.blockSuggestionMouseOver=!0,n(void 0,()=>this._isOpen&&this.moveFocus(-10));break}case"PageDown":{this.blockSuggestionMouseOver=!0,n(void 0,()=>this._isOpen&&this.moveFocus(10));break}}}constructor(e){m(this,e),this.refOptions=[],this.catchRef=t=>{this.refInput=t},this.toggleListbox=t=>{var i;if(t?.preventDefault(),!this.state._disabled&&!this._hasOpened){this._isOpen=!0,this._hasOpened=!0,(i=this.refInput)===null||i===void 0||i.focus();const n=Array.isArray(this._filteredOptions)?this._filteredOptions.findIndex(l=>l.label===this._inputValue):-1,s=this.refOptions[n];s?.scrollIntoView({block:"nearest"}),this.focusOption(this._focusedOptionIndex)}},this._focusedOptionIndex=-1,this._isOpen=!1,this._hasOpened=!1,this._filteredOptions=[],this._inputValue="",this.blockSuggestionMouseOver=!1,this._accessKey=void 0,this._placeholder=void 0,this._alert=void 0,this._disabled=!1,this._hideError=!1,this._hideLabel=!1,this._hint="",this._icons=void 0,this._id=void 0,this._label=void 0,this._msg=void 0,this._name=void 0,this._on=void 0,this._options=void 0,this._required=!1,this._shortKey=void 0,this._syncValueBySelector=void 0,this._tabIndex=void 0,this._tooltipAlign="top",this._touched=!1,this._value=void 0,this._hideClearButton=!1,this._rows=void 0,this.state={_hideError:!1,_id:`id-${k()}`,_label:"",_options:[],_hideClearButton:!1},this.inputHasFocus=!1,this.controller=new E(this,"single-select",this.host)}showAsAlert(){return this.state._alert===void 0?!!this.state._touched&&!this.inputHasFocus:this.state._alert}validatePlaceholder(e){this.controller.validatePlaceholder(e)}validateAccessKey(e){this.controller.validateAccessKey(e)}validateAlert(e){this.controller.validateAlert(e)}validateDisabled(e){this.controller.validateDisabled(e)}validateHideError(e){this.controller.validateHideError(e)}validateHideLabel(e){this.controller.validateHideLabel(e)}validateHint(e){this.controller.validateHint(e)}validateIcons(e){this.controller.validateIcons(e)}validateId(e){this.controller.validateId(e)}validateLabel(e){this.controller.validateLabel(e)}validateMsg(e){this.controller.validateMsg(e)}validateName(e){this.controller.validateName(e)}validateOn(e){this.controller.validateOn(e)}validateOptions(e){this.controller.validateOptions(e),this._filteredOptions=e,this.updateInputValue(this._value)}validateRequired(e){this.controller.validateRequired(e)}validateShortKey(e){this.controller.validateShortKey(e)}validateSyncValueBySelector(e){this.controller.validateSyncValueBySelector(e)}validateTabIndex(e){this.controller.validateTabIndex(e)}validateTouched(e){this.controller.validateTouched(e)}validateValue(e){this.controller.validateValue(e),this.oldValue=e,this.updateInputValue(e)}validateHideClearButton(e){this.controller.validateHideClearButton(e)}validateRows(e){this.controller.validateRows(e)}handleMouseEvent(){this.blockSuggestionMouseOver=!1}updateInputValue(e){if(Array.isArray(this._options)){const t=this._options.find(i=>i.value===e);this._inputValue=t?String(t.label):""}}componentWillLoad(){this.refOptions=[],this._touched=this._touched===!0,this.controller.componentWillLoad(),this.oldValue=this._value,this._filteredOptions=this.state._options,this.updateInputValue(this._value)}onChange(e){var t,i,n,s;this.oldValue!==((t=this.refInput)===null||t===void 0?void 0:t.value)&&(this.oldValue=(i=this.refInput)===null||i===void 0?void 0:i.value),x("change",this.host,this._value),typeof((n=this.state._on)===null||n===void 0?void 0:n.onChange)=="function"&&!this._isOpen&&this.state._on.onChange(e,this._value&&this.oldValue!==((s=this.refInput)===null||s===void 0?void 0:s.value))}static get delegatesFocus(){return!0}get host(){return g(this)}static get watchers(){return{_placeholder:["validatePlaceholder"],_accessKey:["validateAccessKey"],_alert:["validateAlert"],_disabled:["validateDisabled"],_hideError:["validateHideError"],_hideLabel:["validateHideLabel"],_hint:["validateHint"],_icons:["validateIcons"],_id:["validateId"],_label:["validateLabel"],_msg:["validateMsg"],_name:["validateName"],_on:["validateOn"],_options:["validateOptions"],_required:["validateRequired"],_shortKey:["validateShortKey"],_syncValueBySelector:["validateSyncValueBySelector"],_tabIndex:["validateTabIndex"],_touched:["validateTouched"],_value:["validateValue"],"_hideClearButton ":["validateHideClearButton"],_rows:["validateRows"]}}};z.style={default:B};export{z as kol_single_select};
+//# sourceMappingURL=kol-single-select.entry-C5g8ij1Y.js.map