@public-ui/hydrate 3.0.9-rc.3 → 3.0.10-rc.0

package/dist/index.mjs

@@ -144,7 +144,7 @@ function _mergeNamespaces(n, m) {
 
 const NAMESPACE = 'kolibri';
 const BUILD = /* kolibri */ { hydratedSelectorName: "hydrated", slotRelocation: true, state: true, updatable: true};
-const Env = /* kolibri */ {"kolibriVersion":"3.0.9-rc.3"};
+const Env = /* kolibri */ {"kolibriVersion":"3.0.10-rc.0"};
 
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
@@ -6329,9 +6329,12 @@ class KolAccordion {
             _on: {},
         };
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
         const { _open, _label, _disabled, _level } = this.state;
@@ -6355,7 +6358,7 @@ class KolAccordion {
                 animationClass: `${rootClass}__wrapper-animation`,
             },
         };
-        return (hAsync(KolCollapsibleFc, Object.assign({ key: '750cf0bb226ec5139c7098bd44e2a64546888a32' }, props), hAsync("slot", { key: '08908025b6753ebe36defc6e2d210736eabff629' })));
+        return (hAsync(KolCollapsibleFc, Object.assign({ key: '4ab810c8ca65c74d9dd4911410289d301b88b747' }, props), hAsync("slot", { key: '8b395959dbca7708ef79080e80b7fbf94fa3e535' })));
     }
     validateDisabled(value) {
         validateDisabled(this, value);
@@ -6402,6 +6405,7 @@ class KolAccordion {
             "_on": [16],
             "_open": [1540],
             "state": [32],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -18592,18 +18596,21 @@ class KolBadge {
     renderSmartButton(props) {
         return (hAsync(KolButtonWcTag, { ref: this.catchSmartButtonRef, class: "kol-badge__smart-button", _ariaControls: this.id, _ariaDescription: props._ariaDescription, _buttonVariant: props._variant, _customClass: props._customClass, _disabled: props._disabled, _hideLabel: true, _icons: props._icons, _id: props._id, _label: props._label, _on: props._on, _tooltipAlign: props._tooltipAlign }));
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.smartButtonRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.smartButtonRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
         const hasSmartButton = typeof this.state._smartButton === 'object' && this.state._smartButton !== null;
-        return (hAsync("span", { key: '1783be722727cb3b05b54342718cc09a753f9470', class: clsx('kol-badge', {
+        return (hAsync("span", { key: 'aa434ba6ebe2fd58562931d192cc7747b3d4c429', class: clsx('kol-badge', {
                 'kol-badge--has-smart-button': typeof this.state._smartButton === 'object' && this.state._smartButton !== null,
             }), style: {
                 backgroundColor: this.bgColorStr,
                 color: this.colorStr,
-            } }, hAsync(KolSpanFc, { key: '273924ed45d55804ef6a0636604b4f7a9fb7257c', class: "kol-badge__label", id: hasSmartButton ? this.id : undefined, allowMarkdown: true, icons: this.state._icons, label: this._label }), hasSmartButton && this.renderSmartButton(this.state._smartButton)));
+            } }, hAsync(KolSpanFc, { key: 'fa0dd9eadb49f101a9e85348187cfecd9958dfc4', class: "kol-badge__label", id: hasSmartButton ? this.id : undefined, allowMarkdown: true, icons: this.state._icons, label: this._label }), hasSmartButton && this.renderSmartButton(this.state._smartButton)));
     }
     validateIcons(value) {
         validateIcons(this, value);
@@ -18648,6 +18655,7 @@ class KolBadge {
             "_label": [1],
             "_smartButton": [1, "_smart-button"],
             "state": [32],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -18750,12 +18758,15 @@ class KolButton {
     async getValue() {
         return this._value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
-        return (hAsync(KolButtonWcTag, { key: 'd48c2b2f907e42ff87337bd7916595876082436d', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline, _label: this._label, _name: this._name, _on: this._on, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _buttonVariant: this._variant }, hAsync("slot", { key: '9d93698e6a0700a79af93e8f0f5f8e4775e5e024', name: "expert", slot: "expert" })));
+        return (hAsync(KolButtonWcTag, { key: '04885e75c1664f013521070617765c168714c6db', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline, _label: this._label, _name: this._name, _on: this._on, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _buttonVariant: this._variant }, hAsync("slot", { key: '5f2085cc413dfee10d13ecc5b0a681645b4052ee', name: "expert", slot: "expert" })));
     }
     static get style() { return {
         default: defaultStyleCss$G
@@ -18786,6 +18797,7 @@ class KolButton {
             "_value": [8],
             "_variant": [1],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -18812,12 +18824,15 @@ class KolButtonLink {
     async getValue() {
         return this._value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
-        return (hAsync(KolButtonWcTag, { key: 'ebfebfefff5331deafba6a34909b2512a2572710', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline !== undefined ? this._inline : this._variant === 'inline' ? true : this._variant === 'standalone' ? false : undefined, _label: this._label, _name: this._name, _on: this._on, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value }, hAsync("slot", { key: '7d01aa85397de0121baf8b694c85d9e854cfbbfa', name: "expert", slot: "expert" })));
+        return (hAsync(KolButtonWcTag, { key: 'fcbd8b1c16714336207186854cdec13ad4b51af5', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline !== undefined ? this._inline : this._variant === 'inline' ? true : this._variant === 'standalone' ? false : undefined, _label: this._label, _name: this._name, _on: this._on, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value }, hAsync("slot", { key: '137fbfe36f98126f0291b21a358fd4386ba53eb0', name: "expert", slot: "expert" })));
     }
     static get style() { return {
         default: defaultStyleCss$F
@@ -18847,6 +18862,7 @@ class KolButtonLink {
             "_type": [1],
             "_value": [8],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -19120,9 +19136,12 @@ class AssociatedInputController {
 }
 
 class KolButtonWc {
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.buttonRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.buttonRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
         var _a;
@@ -19131,14 +19150,14 @@ class KolButtonWc {
         const badgeText = this.state._accessKey || this.state._shortKey;
         const isDisabled = this.state._disabled === true;
         const hideLabel = this.state._hideLabel === true;
-        return (hAsync(Host, { key: 'fb9fe1c0e76de97770affa7a0d091854e227e2bd' }, hAsync("button", { key: '97132be4e8e29fdd3d66674e9d68cadd799d7b5c', ref: (ref) => (this.buttonRef = ref), accessKey: this.state._accessKey, "aria-controls": this.state._ariaControls, "aria-description": ariaDescription || undefined, "aria-expanded": mapBoolean2String(this.state._ariaExpanded), "aria-haspopup": this._ariaHasPopup, "aria-keyshortcuts": this.state._shortKey, "aria-label": hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-selected": mapStringOrBoolean2String(this.state._ariaSelected), class: clsx('kol-button', {
+        return (hAsync(Host, { key: '0d3d25815145b6edb52f339e7c856fd562a9d8c4' }, hAsync("button", { key: '8645454cf97c128e930ddb3968e1a4ec8865664e', ref: (ref) => (this.buttonRef = ref), accessKey: this.state._accessKey, "aria-controls": this.state._ariaControls, "aria-description": ariaDescription || undefined, "aria-expanded": mapBoolean2String(this.state._ariaExpanded), "aria-haspopup": this._ariaHasPopup, "aria-keyshortcuts": this.state._shortKey, "aria-label": hideLabel && typeof this.state._label === 'string' ? this.state._label : undefined, "aria-selected": mapStringOrBoolean2String(this.state._ariaSelected), class: clsx('kol-button', {
                 'kol-button--disabled': isDisabled,
                 [`kol-button--${this.state._buttonVariant}`]: this.state._buttonVariant !== 'custom',
                 'kol-button--inline': this.state._inline === true,
                 'kol-button--standalone': this.state._inline === false,
                 'kol-button--hide-label': hideLabel,
                 [this.state._customClass]: this.state._buttonVariant === 'custom' && typeof this.state._customClass === 'string' && this.state._customClass.length > 0,
-            }), disabled: isDisabled, id: this.state._id, name: this.state._name, onClick: this.onClick, onMouseDown: this.onMouseDown, role: this.state._role, tabIndex: this.state._tabIndex, type: this.state._type }, hAsync(KolSpanFc, { key: 'fbd2188192ab9c349baa587086afe2f7b1275768', class: "kol-button__text", badgeText: badgeText, icons: this.state._icons, hideLabel: hideLabel, label: hasExpertSlot ? '' : this.state._label }, hAsync("slot", { key: 'b8fac8325037390ad93136fb0c7b6be935233933', name: "expert", slot: "expert" }))), hideLabel && (hAsync(KolTooltipWcTag, { key: '59c048aec59c738ef86190bdbdac6ecbc7a09035', ref: (ref) => (this.tooltipRef = ref), "aria-hidden": "true", hidden: hasExpertSlot, class: "kol-button__tooltip", _badgeText: badgeText, _align: this.state._tooltipAlign, _label: typeof this.state._label === 'string' ? this.state._label : '' }))));
+            }), disabled: isDisabled, id: this.state._id, name: this.state._name, onClick: this.onClick, onMouseDown: this.onMouseDown, role: this.state._role, tabIndex: this.state._tabIndex, type: this.state._type }, hAsync(KolSpanFc, { key: '5c9c0d4b1128b1c693f20efd92b3a6ee85a78a23', class: "kol-button__text", badgeText: badgeText, icons: this.state._icons, hideLabel: hideLabel, label: hasExpertSlot ? '' : this.state._label }, hAsync("slot", { key: '3c30ccb15fe9026b96e1e606be9c5d5566ef875f', name: "expert", slot: "expert" }))), hideLabel && (hAsync(KolTooltipWcTag, { key: '9bd70dbe2ca962b34cb59c2a1dd32055a854b286', ref: (ref) => (this.tooltipRef = ref), "aria-hidden": "true", hidden: hasExpertSlot, class: "kol-button__tooltip", _badgeText: badgeText, _align: this.state._tooltipAlign, _label: typeof this.state._label === 'string' ? this.state._label : '' }))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -19343,6 +19362,7 @@ class KolButtonWc {
             "_value": [8],
             "_buttonVariant": [1, "_button-variant"],
             "state": [32],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -19937,9 +19957,12 @@ class KolCombobox {
     async getValue() {
         return this.state._value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     selectOption(option) {
         var _a;
@@ -20046,15 +20069,15 @@ class KolCombobox {
     }
     render() {
         const isDisabled = this.state._disabled === true;
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '0d9f276131000a7a398df8167b7ab687bf191bf8' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '4bf740e369911ad5af8dc96498a7f895d09e7d86', state: this.state }, hAsync("div", { key: '839fb3245b49c1fc922e61898f0e966b3f8946d7', class: "kol-combobox__group" }, hAsync(InputStateWrapper, Object.assign({ key: 'c51fa942fe784d4b409e40c07b9f62ba623e8220' }, this.getInputProps())), this.state._value && !this.state._hideClearButton && (hAsync(KolButtonWcTag, { key: '7121cc55857a492973ab7ea3b6cb68654dc30fcc', _icons: "codicon codicon-close", _label: this.translateDeleteSelection, _hideLabel: true, _disabled: isDisabled, "data-testid": "combobox-delete", class: clsx('kol-combobox__delete', {
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'c5afe28a1d16ea7880bf51e27eea443ce569a8ff' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'dbccf31419288c4bec6e081c5a4c7dcf56c42f9c', state: this.state }, hAsync("div", { key: '99e682a31fdc8dbbcb92621b6618108c433f321e', class: "kol-combobox__group" }, hAsync(InputStateWrapper, Object.assign({ key: 'c9da0b608dabe6adc24221722287fe373273ece4' }, this.getInputProps())), this.state._value && !this.state._hideClearButton && (hAsync(KolButtonWcTag, { key: '58e6def1c6e17c1e0e7ad8540700de3576164eef', _icons: "codicon codicon-close", _label: this.translateDeleteSelection, _hideLabel: true, _disabled: isDisabled, "data-testid": "combobox-delete", class: clsx('kol-combobox__delete', {
                 'kol-combobox__delete--disabled': isDisabled,
             }), _on: {
                 onClick: () => {
                     this.clearSelection();
                 },
-            } })), hAsync(KolIconTag, { key: '6b4af46bfe72c9da959729263c8f0adae6c92f81', _icons: "codicon codicon-triangle-down", _label: "", class: clsx('kol-custom-suggestions-toggle', {
+            } })), hAsync(KolIconTag, { key: 'e6b4d8abc7b46bcf94c6abdd3b3929a655cdda11', _icons: "codicon codicon-triangle-down", _label: "", class: clsx('kol-custom-suggestions-toggle', {
                 'kol-custom-suggestions-toggle--disabled': isDisabled,
-            }), onClick: this.toggleListbox.bind(this) })), this._isOpen && !isDisabled && (hAsync(CustomSuggestionsOptionsGroupFc, { key: 'ffbaa34f6801783d5255b82d6df3df643b53913f', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleKeyDownDropdown.bind(this) }, Array.isArray(this._filteredSuggestions) &&
+            }), onClick: this.toggleListbox.bind(this) })), this._isOpen && !isDisabled && (hAsync(CustomSuggestionsOptionsGroupFc, { key: 'e6fb48734b7c3e4f0abc466a9be4ba4fcedd5c36', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleKeyDownDropdown.bind(this) }, Array.isArray(this._filteredSuggestions) &&
             this._filteredSuggestions.length > 0 &&
             this._filteredSuggestions.map((option, index) => (hAsync(CustomSuggestionsOptionFc, { disabled: false, index: index, option: option, searchTerm: this.state._value, ref: (el) => {
                     if (el)
@@ -20363,6 +20386,7 @@ class KolCombobox {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": [[0, "keydown", "handleKeyDown"], [8, "click", "handleWindowClick"], [1, "mousemove", "handleMouseEvent"], [8, "focusout", "handleFocusOut"], [8, "blur", "handleWindowBlur"]],
@@ -20400,9 +20424,12 @@ class KolDetails {
             _on: {},
         };
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
         const { _open, _label, _disabled, _level } = this.state;
@@ -20427,7 +20454,7 @@ class KolDetails {
                 animationClass: `${rootClass}__wrapper-animation`,
             },
         };
-        return (hAsync(KolCollapsibleFc, Object.assign({ key: 'e149779c3d5053267bcd2785b061c3862c1ab806' }, props), hAsync("slot", { key: 'ba4278e16e1cd27c08ecc5aef1d47d8427d94575' })));
+        return (hAsync(KolCollapsibleFc, Object.assign({ key: 'ea189966b0a9072b03f4296f71c8c7e5c25eb4c8' }, props), hAsync("slot", { key: '4a369f362fc6db0109baa6a4048eae8b2d640f78' })));
     }
     validateDisabled(value) {
         validateDisabled(this, value);
@@ -20474,6 +20501,7 @@ class KolDetails {
             "_on": [16],
             "_open": [1540],
             "state": [32],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -21210,9 +21238,12 @@ class KolInputCheckbox {
     async getValue() {
         return this.getModelValue();
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     getFormFieldProps() {
         return {
@@ -21261,7 +21292,7 @@ class KolInputCheckbox {
         return this.state._icons.unchecked;
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'ea78897d3814398c2b65d1a345d910d874a08098' }, this.getFormFieldProps(), { renderNoLabel: true }), hAsync(FieldControlStateWrapper, Object.assign({ key: '6b5bee7c4aa84f1a204f1ce6aafd5981e48d64b5' }, this.getFieldControlProps(), { renderNoHint: true }), hAsync(CheckboxStateWrapper, Object.assign({ key: '4f8275511a19f813c31ae714c448133588480339' }, this.getInputProps())))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'cc0ffae3ec39155469c69de197ded8237de408ba' }, this.getFormFieldProps(), { renderNoLabel: true }), hAsync(FieldControlStateWrapper, Object.assign({ key: '44e9e3efa2ead54cac40be2247c5a01c29927f74' }, this.getFieldControlProps(), { renderNoHint: true }), hAsync(CheckboxStateWrapper, Object.assign({ key: 'add2135c5daca032c59c192cb59c45422c453914' }, this.getInputProps())))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -21435,6 +21466,7 @@ class KolInputCheckbox {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -21473,9 +21505,12 @@ class KolInputColor {
         var _a;
         return (_a = this.refInputText) === null || _a === void 0 ? void 0 : _a.value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.refInputText) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.refInputText) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     get hasSuggestions() {
         return Array.isArray(this.state._suggestions) && this.state._suggestions.length > 0;
@@ -21499,7 +21534,7 @@ class KolInputColor {
         return Object.assign(Object.assign({ state: Object.assign(Object.assign({}, other), { _suggestions: [] }) }, this.controller.onFacade), { onBlur: this.onBlur, onFocus: this.onFocus });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'a9a8baf58305f955d0820faff80c814487da8a56' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '38b01dba706ac81df9c7c3c02087593b22da143c', state: this.state, class: "kol-input-color__inputs-wrapper" }, hAsync("div", { key: '0c566fb29b89078f3063a1e169c78869a2dfc0d1', class: "kol-input-color__inputs-wrapper" }, hAsync(InputStateWrapper, Object.assign({ key: 'ab44bc1b7a58d70e7492d0ab9e225073df28846e', class: "kol-input-color__input kol-input-color__input--color" }, this.getInputColorProps())), hAsync(InputStateWrapper, Object.assign({ key: '5ff9950fe9f98ee0f42d3bd52d5bf5a3d8649736', class: "kol-input-color__input kol-input-color__input--text" }, this.getInputTextProps()))))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '07425efeb1819802cf6d4d5ac80ec66805c3181b' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '12e13d63cfbcc8281439d1138b7c1701f58da5a2', state: this.state, class: "kol-input-color__inputs-wrapper" }, hAsync("div", { key: '03daa1de5b4457d4a6dcea7f625733c5220272c5', class: "kol-input-color__inputs-wrapper" }, hAsync(InputStateWrapper, Object.assign({ key: '3f02cb3c793566c942368e31ed4bb243ac94b9a3', class: "kol-input-color__input kol-input-color__input--color" }, this.getInputColorProps())), hAsync(InputStateWrapper, Object.assign({ key: 'bcdec98b332975ef3513976a81d97cfe472060bb', class: "kol-input-color__input kol-input-color__input--text" }, this.getInputTextProps()))))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -21668,6 +21703,7 @@ class KolInputColor {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -21832,9 +21868,12 @@ class KolInputDate {
         var _a;
         return this.inputRef && this.remapValue((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.value);
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     async reset() {
         this.state = Object.assign(Object.assign({}, this.state), { _value: null });
@@ -21874,7 +21913,7 @@ class KolInputDate {
         return Object.assign(Object.assign({ ref: this.catchRef, state: this.state }, this.controller.onFacade), { onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown, onChange: this.onChange, onInput: this.onInput });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '948a0677c26b943797ca51d4152dd9bf39ef4e17' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '1a192d4a5044def41d8e4bcb14f721a2a233ad60', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: 'eeddd14ae717e39a8f4c6693ddd80ab14125dc47' }, this.getInputProps())))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '1e8bc172c374000fe352895606f9eec87bb21e92' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'c03c72257382a9e1282e933fc175d55c156d8db8', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: '0a6b0bcadcc0bd107ddf7fd67f3250b5ccb21701' }, this.getInputProps())))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -22091,6 +22130,7 @@ class KolInputDate {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64],
             "reset": [64]
         },
@@ -22225,9 +22265,12 @@ class KolInputEmail {
         var _a;
         return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     getFormFieldProps() {
         return {
@@ -22251,7 +22294,7 @@ class KolInputEmail {
             } });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'f6847f7adcceccc5156ca7108293e863ace8fb1f' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'dc180e9fc68c63016dedde5680ce2ee2c1118519', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: '73735b308bd8c3ecdb4261bed785dc0686ead067' }, this.getInputProps())))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'bcd5bb2ce1dc31c18614a9d956577ba9c3517b6e' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'fc088e01b4d3341fb870e5d0a13898aaf1a7b287', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: 'b204fe11a8858f3d8146c9f689cdad19d8d16b9a' }, this.getInputProps())))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -22446,6 +22489,7 @@ class KolInputEmail {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -22483,9 +22527,12 @@ class KolInputFile {
         var _a;
         return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.files;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     async reset() {
         this.controller.setFormAssociatedValue('');
@@ -22513,7 +22560,7 @@ class KolInputFile {
             } });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '558fc9257273a3587a1b6a02025c14513c02d191' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '81d0a3762e019cb406b92598e270bd5949cc5fae', state: this.state }, hAsync("span", { key: '4efe43a4882d3b3b179ae25065f83e962e3df615', class: clsx('kol-input-container__filename', { 'kol-input-container__filename--has-file': this.hasFileSelected }) }, this.filename), hAsync(InputStateWrapper, Object.assign({ key: '49ba7e1659a3d0390f3de9be34a50618fdcf2252' }, this.getInputProps())), hAsync(KolButtonWcTag, { key: 'fb7260d1a845f5c65b3a6f9856e1b44634280108', class: "kol-input-container__button", _label: this.translateDataBrowseText, _buttonVariant: "primary", _disabled: this._disabled }))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '7deee0c8c3bf1f1c01672bcce64738117081422f' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '43825237a7bf2b2d56da97790c1b544241ebad2d', state: this.state }, hAsync("span", { key: 'e2c2d541070fdf8607d2ddfeb9a806cdf3730d61', class: clsx('kol-input-container__filename', { 'kol-input-container__filename--has-file': this.hasFileSelected }) }, this.filename), hAsync(InputStateWrapper, Object.assign({ key: 'ba08af270d798fc274d85176c5aaa880540a321d' }, this.getInputProps())), hAsync(KolButtonWcTag, { key: '48746427ef21a0e1d0ea5c907ccbb53beec85f7d', class: "kol-input-container__button", _label: this.translateDataBrowseText, _buttonVariant: "primary", _disabled: this._disabled }))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -22700,6 +22747,7 @@ class KolInputFile {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64],
             "reset": [64]
         },
@@ -22762,9 +22810,12 @@ class KolInputNumber {
     async getValue() {
         return this.remapValue(this.state._value);
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     setInitialValueType(value) {
         if (this.controller.isNumberString(value)) {
@@ -22806,7 +22857,7 @@ class KolInputNumber {
             } });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '5e33361f11d47a3a5dc39797a291258ab5e27c54' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '2035ec896170fdb2cf473d15ca87f32242c0e500', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: '6d9b49fc92337ef6078c1ff3d32fb02fb21bf860' }, this.getInputProps())))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '60f3ab5d10c2382ed837f5a1b7b872141bcae69e' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '818c2e4227f8a27231c17d9971187522938d8e3f', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: 'd42c7b5454f2282771436f736f1f1a78e614b6c4' }, this.getInputProps())))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -23002,6 +23053,7 @@ class KolInputNumber {
             "_initialValueType": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -23017,9 +23069,12 @@ class KolInputPassword {
         var _a;
         return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     getFormFieldProps() {
         return {
@@ -23053,7 +23108,7 @@ class KolInputPassword {
             }, icon: `codicon codicon-eye-${this._passwordVisible ? 'closed' : 'watch'}`, disabled: this._disabled }));
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '20803f39ce7c575e6f4fe341e8be9cf7cce43288' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'a74adf9d03c50218965183a42ebf38a92b451e1f', state: this.state, endAdornment: this.getShowPasswordButton() }, hAsync(InputStateWrapper, Object.assign({ key: 'b364562f0b6834c37643a567ecdfc3a66aee3f48' }, this.getInputProps())))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'dfecc1fc1f5b43297449e1e705fa110119e6d509' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '0ac3083a7ab3c671656745de60c2275d76748a2e', state: this.state, endAdornment: this.getShowPasswordButton() }, hAsync(InputStateWrapper, Object.assign({ key: 'a68a8e309aa062a8e2b7270aafaa352442147790' }, this.getInputProps())))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -23250,6 +23305,7 @@ class KolInputPassword {
             "_passwordVisible": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -23305,9 +23361,12 @@ class KolInputRadio {
     async getValue() {
         return this._value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.getFocusableInput()) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.getFocusableInput()) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     getFocusableInput() {
         const options = this.state._options;
@@ -23344,7 +23403,7 @@ class KolInputRadio {
         };
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '9e2b42643b7eec87fcef68c4e8bf471e67738689' }, this.getFormFieldProps()), this.state._options.map((option, index) => this.renderOption(option, index))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '1a5ada4341373c623af39a98c98c71de59b89bb4' }, this.getFormFieldProps()), this.state._options.map((option, index) => this.renderOption(option, index))));
     }
     calculateDisabled(option) {
         return Boolean(this.state._disabled) || Boolean(option.disabled);
@@ -23541,6 +23600,7 @@ class KolInputRadio {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -23588,9 +23648,12 @@ class InputRangeController extends InputIconController {
 const defaultStyleCss$o = "/*\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}\n@layer kol-component {\n  :host {\n    display: block;\n  }\n}\n@layer kol-component {\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 {\n    display: grid;\n  }\n  .kol-alert__container {\n    display: flex;\n    place-items: center;\n  }\n  .kol-alert__container-content {\n    flex-grow: 1;\n  }\n  .kol-alert__closer {\n    /* Visible with forced colors */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field {\n    display: grid;\n  }\n  .kol-form-field:not(.kol-form-field--disabled) .kol-form-field__label {\n    cursor: pointer;\n  }\n  .kol-form-field--disabled .kol-form-field__label {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    content: \"*\"/\"\";\n  }\n  .kol-form-field--disabled .kol-form-field__hint {\n    opacity: 0.5;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    content: \"*\"/\"\";\n  }\n  .kol-input-container {\n    background-color: 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;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--end) {\n    grid-template-columns: 1fr auto;\n  }\n  .kol-input-container:has(> .kol-input-container__adornment--start):has(> .kol-input-container__adornment--end) {\n    grid-template-columns: auto 1fr auto;\n  }\n  .kol-input-container__container {\n    position: relative;\n  }\n  .kol-input-container__adornment {\n    display: flex;\n    align-items: center;\n  }\n  .kol-input-container__adornment .kol-icon {\n    display: grid;\n    height: var(--a11y-min-size);\n    place-items: center;\n  }\n  .kol-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-input-range__inputs-wrapper {\n    display: flex;\n    flex-grow: 1;\n    flex-direction: row;\n    align-items: center;\n  }\n  .kol-input-range__input--number {\n    width: var(--kolibri-input-range--input-number--width);\n  }\n  .kol-input-range__input--range {\n    background-color: #d3d3d3;\n    display: inline-block;\n    /* Design-Hack - related with flex-grow */\n    width: 0;\n    height: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n    margin: 0;\n    padding: 0;\n    flex-grow: 1;\n    line-height: 1.5;\n    appearance: none;\n    border: 1px solid #000;\n  }\n  .kol-input-range__input:not(:disabled).kol-input-range__input--range::-webkit-slider-thumb {\n    cursor: pointer;\n  }\n  .kol-input-range__input--range::-webkit-slider-thumb {\n    background-color: #000;\n    border-radius: 20px;\n    width: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n    -webkit-appearance: none;\n  }\n  @media (prefers-contrast: more) or (forced-colors: active) {\n    .kol-input-range__input--range::-webkit-slider-thumb {\n      outline: 1px solid currentColor;\n    }\n  }\n  .kol-input-range__input:not(:disabled).kol-input-range__input--range::-moz-range-thumb {\n    cursor: pointer;\n  }\n  .kol-input-range__input--range::-moz-range-thumb {\n    background-color: #000;\n    border-radius: 20px;\n    width: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n    -moz-appearance: none;\n  }\n}";
 
 class KolInputRange {
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.refInputNumber) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.refInputNumber) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     getSanitizedFloatValue(value) {
         const floatValue = parseFloat(value);
@@ -23660,7 +23723,7 @@ class KolInputRange {
         const inputsWrapperStyle = {
             '--kolibri-input-range--input-number--width': `calc(${String(this.state._max).length}ch + 2em)`,
         };
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '2b79d0c28561a4f0035f6e35afdb0ff9957d0ed8' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '9c544b7bae6dc2abb3e297015216c88872a78b8e', state: this.state }, hAsync("div", { key: '6fc42d92419cc0a65cf37b7af227fea0ef53c7a9', class: "kol-input-range__inputs-wrapper", style: inputsWrapperStyle }, hAsync(InputStateWrapper, Object.assign({ key: 'b31e2cf0b5ffefdc0a274e6186a1b62865ba15d4', class: "kol-input-range__input kol-input-range__input--range" }, this.getInputRangeProps())), hAsync(InputStateWrapper, Object.assign({ key: 'd05addcf1b45132df1903bc05b4742fd0e48a5fc', class: "kol-input-range__input kol-input-range__input--number" }, this.getInputNumberProps()))), this.hasSuggestions && hAsync(SuggestionsFc, { key: 'ebb28556a2f6f6fa0545e681ff4a7854f9058167', id: this.state._id, suggestions: this.state._suggestions }))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'a910d0bb8de191e293db17e94c60583f4c2c77d8' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'da96a03aa89386f355fcfbba0cf2d57bbd234a95', state: this.state }, hAsync("div", { key: 'c24b4097a08283a425c5304bbdf57ff898528495', class: "kol-input-range__inputs-wrapper", style: inputsWrapperStyle }, hAsync(InputStateWrapper, Object.assign({ key: '600e5633f2e19b187da6f0159f72dd4e2dd45672', class: "kol-input-range__input kol-input-range__input--range" }, this.getInputRangeProps())), hAsync(InputStateWrapper, Object.assign({ key: 'ead61404d1106e6a7beac4847b05f88e452f5edd', class: "kol-input-range__input kol-input-range__input--number" }, this.getInputNumberProps()))), this.hasSuggestions && hAsync(SuggestionsFc, { key: 'f07c941fe69b6d31ccba62af4d3a567ce5e456e7', id: this.state._id, suggestions: this.state._suggestions }))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -23845,6 +23908,7 @@ class KolInputRange {
             "state": [32],
             "_initialValueType": [32],
             "inputHasFocus": [32],
+            "focus": [64],
             "kolFocus": [64],
             "getValue": [64]
         },
@@ -23861,9 +23925,12 @@ class KolInputText {
         var _a;
         return (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     async selectionStart() {
         var _a;
@@ -23906,7 +23973,7 @@ class KolInputText {
         return Object.assign(Object.assign({ ref: this.catchRef, state: this.state, ariaDescribedBy }, this.controller.onFacade), { onBlur: this.onBlur, onChange: this.onChange, onFocus: this.onFocus, onInput: this.onInput, onKeyDown: this.onKeyDown });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '7aa95da7581005eb7dae4f5d4e166b32ac0a12b9' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'ae8aebf9a3c9c21fd2b0ab85873fff2714208824', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: 'c46a7a83ecaa4f48f06e1cd3d35494a9fe7c3f8d' }, this.getInputProps())))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'd86ef7efc8ffb8893f60c3f5d129a1bf368f39d3' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '7038d9b03bedb83fa603ec889404c9aa2f376543', state: this.state }, hAsync(InputStateWrapper, Object.assign({ key: 'ea63bc12e147832944b1f450d9d65bed39989dd0' }, this.getInputProps())))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -24126,6 +24193,7 @@ class KolInputText {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64],
             "selectionStart": [64],
             "selectioconEnd": [64],
@@ -24225,12 +24293,15 @@ class KolLink {
         this._variant = 'inline';
         this._tooltipAlign = 'right';
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
-        return (hAsync(KolLinkWcTag, { key: '32f4d596c230ce59c8ac1b0796472d3f5b356612', ref: this.catchRef, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _inline: this._inline !== undefined ? this._inline : this._variant === 'inline' ? true : this._variant === 'standalone' ? false : undefined, _label: this._label, _on: this._on, _shortKey: this._shortKey, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: 'e722786c07ed893d1d81d980d31b2b83e207501a', name: "expert", slot: "expert" })));
+        return (hAsync(KolLinkWcTag, { key: '23a5ea0ad3023e264f7bf477e783683001c176d2', ref: this.catchRef, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _inline: this._inline !== undefined ? this._inline : this._variant === 'inline' ? true : this._variant === 'standalone' ? false : undefined, _label: this._label, _on: this._on, _shortKey: this._shortKey, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: 'a96c6b26f1f69e70a8968a947af50ee8f904bfb6', name: "expert", slot: "expert" })));
     }
     static get style() { return {
         default: defaultStyleCss$l
@@ -24257,6 +24328,7 @@ class KolLink {
             "_shortKey": [1, "_short-key"],
             "_target": [1],
             "_tooltipAlign": [1, "_tooltip-align"],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -24278,12 +24350,15 @@ class KolLinkButton {
         this._tooltipAlign = 'right';
         this._variant = 'normal';
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
-        return (hAsync(KolLinkWcTag, { key: '3e35c1a02a7989ee062aee31462d4b9792fbbd59', ref: this.catchRef, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _customClass: this._customClass, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _label: this._label, _on: this._on, _shortKey: this._shortKey, _target: this._target, _tooltipAlign: this._tooltipAlign, _buttonVariant: this._variant }, hAsync("slot", { key: 'ec540b986bf137e66131aa4edef252e6d4f6f24e', name: "expert", slot: "expert" })));
+        return (hAsync(KolLinkWcTag, { key: 'a50c7113048bd52f614eac349eda9b9a351db611', ref: this.catchRef, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _customClass: this._customClass, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _label: this._label, _on: this._on, _shortKey: this._shortKey, _target: this._target, _tooltipAlign: this._tooltipAlign, _buttonVariant: this._variant }, hAsync("slot", { key: '38a6bece6ad8af57eaab0a86ca45b3c98a81124b', name: "expert", slot: "expert" })));
     }
     static get style() { return {
         default: defaultStyleCss$k
@@ -24309,6 +24384,7 @@ class KolLinkButton {
             "_target": [1],
             "_tooltipAlign": [1, "_tooltip-align"],
             "_variant": [1],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -24376,16 +24452,19 @@ class KolLinkWc {
             _icons: {},
         };
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.anchorRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.anchorRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
         var _a;
         const { isExternal, tagAttrs } = this.getRenderValues();
         const hasExpertSlot = showExpertSlot(this.state._label);
         const ariaDescription = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim();
-        return (hAsync(Host, { key: '892c5cc729d746dc7b1f046d1b43f198752d2806' }, hAsync("a", Object.assign({ key: '66793d9388bdd0b7d291fc1d137ba269cfd2b228', ref: this.catchRef }, tagAttrs, { accessKey: this.state._accessKey, "aria-current": this.state._ariaCurrent, "aria-controls": this.state._ariaControls, "aria-description": ariaDescription || undefined, "aria-disabled": this.state._disabled ? 'true' : undefined, "aria-expanded": typeof this.state._ariaExpanded === 'boolean' ? String(this.state._ariaExpanded) : undefined, "aria-owns": this.state._ariaOwns, "aria-label": this.state._hideLabel && typeof this.state._label === 'string'
+        return (hAsync(Host, { key: 'ee0556d521befa51a659f1094aaf5ac1865a791d' }, hAsync("a", Object.assign({ key: '667457adb4151768c5c06492d8c5123436021cea', ref: this.catchRef }, tagAttrs, { accessKey: this.state._accessKey, "aria-current": this.state._ariaCurrent, "aria-controls": this.state._ariaControls, "aria-description": ariaDescription || undefined, "aria-disabled": this.state._disabled ? 'true' : undefined, "aria-expanded": typeof this.state._ariaExpanded === 'boolean' ? String(this.state._ariaExpanded) : undefined, "aria-owns": this.state._ariaOwns, "aria-label": this.state._hideLabel && typeof this.state._label === 'string'
                 ? `${this.state._label}${isExternal ? ` (${this.translateOpenLinkInTab})` : ''}`
                 : undefined, "aria-keyshortcuts": this.state._shortKey, class: clsx('kol-link', {
                 'kol-link--disabled': this.state._disabled === true,
@@ -24395,7 +24474,7 @@ class KolLinkWc {
                 'kol-link--inline': this.state._inline === true,
                 'kol-link--standalone': this.state._inline === false,
                 [this.state._customClass]: this.state._buttonVariant === 'custom' && typeof this.state._customClass === 'string' && this.state._customClass.length > 0,
-            }) }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick, role: this.state._role, tabIndex: this.state._disabled ? -1 : this.state._tabIndex }), hAsync(KolSpanFc, { key: '5c7d16010d9be97330357727cd077a5938d34e7f', class: "kol-link__text", badgeText: this.state._accessKey || this.state._shortKey, icons: this.state._icons, hideLabel: this.state._hideLabel, label: hasExpertSlot ? '' : this.state._label || this.state._href }, hAsync("slot", { key: 'b01d5620e864c978c8e87b5601b8736334af2959', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { key: '4a817ada365a0c78003c921049be05705dd532ea', class: "kol-link__icon", _label: this.state._hideLabel ? '' : this.translateOpenLinkInTab, _icons: 'codicon codicon-link-external', "aria-hidden": this.state._hideLabel }))), this.state._hideLabel === true && (hAsync(KolTooltipWcTag, { key: '509f958cb96c22e1f037c9c82bd74ef4e89e0b3d', "aria-hidden": "true", class: "kol-link__tooltip", ref: (ref) => (this.tooltipRef = ref), hidden: hasExpertSlot, _badgeText: this.state._accessKey || this.state._shortKey, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href }))));
+            }) }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick, role: this.state._role, tabIndex: this.state._disabled ? -1 : this.state._tabIndex }), hAsync(KolSpanFc, { key: '61ee7232a2c97863f71b98637c1f0026ba695d36', class: "kol-link__text", badgeText: this.state._accessKey || this.state._shortKey, icons: this.state._icons, hideLabel: this.state._hideLabel, label: hasExpertSlot ? '' : this.state._label || this.state._href }, hAsync("slot", { key: '58ddc8b7ade66d1c6f2a203716e904955ba0ea29', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { key: '43951151785257140a4328b45b418e185b0e1b71', class: "kol-link__icon", _label: this.state._hideLabel ? '' : this.translateOpenLinkInTab, _icons: 'codicon codicon-link-external', "aria-hidden": this.state._hideLabel }))), this.state._hideLabel === true && (hAsync(KolTooltipWcTag, { key: '1417866df9586f4c670f6cb2bdf60851818a11e4', "aria-hidden": "true", class: "kol-link__tooltip", ref: (ref) => (this.tooltipRef = ref), hidden: hasExpertSlot, _badgeText: this.state._accessKey || this.state._shortKey, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href }))));
     }
     validateAccessKey(value) {
         validateAccessKey(this, value);
@@ -24546,6 +24625,7 @@ class KolLinkWc {
             "_tooltipAlign": [1, "_tooltip-align"],
             "_buttonVariant": [1, "_button-variant"],
             "state": [32],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -27162,12 +27242,15 @@ let KolPopoverButton$1 = class KolPopoverButton {
         var _a;
         void ((_a = this.ref) === null || _a === void 0 ? void 0 : _a.showPopover());
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.ref) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.ref) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
-        return (hAsync(KolPopoverButtonWcTag, { key: 'be19658765366007a44c6bbb72adb9c24f130a02', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline, _label: this._label, _name: this._name, _on: this._on, _popoverAlign: this._popoverAlign, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }, hAsync("slot", { key: '0e75a52b0ea083a4dad9ba209911fcdf01c5cd5b', name: "expert", slot: "expert" }), hAsync("slot", { key: 'dede1a8a8d21416611598c6d21171d4c190da780' })));
+        return (hAsync(KolPopoverButtonWcTag, { key: '1d3afde57cc37f626f7a35788899ae443d0f8c26', ref: this.catchRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline, _label: this._label, _name: this._name, _on: this._on, _popoverAlign: this._popoverAlign, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }, hAsync("slot", { key: 'b1fa37c8b4d5f290a4020176459f9a9450fb147e', name: "expert", slot: "expert" }), hAsync("slot", { key: '62fac80f4873cf7c0a93b8f6495c4a14bf914848' })));
     }
     static get style() { return {
         default: defaultStyleCss$g
@@ -27200,6 +27283,7 @@ let KolPopoverButton$1 = class KolPopoverButton {
             "_variant": [1],
             "hidePopover": [64],
             "showPopover": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -27233,9 +27317,12 @@ class KolPopoverButton {
         var _a;
         void ((_a = this.refPopover) === null || _a === void 0 ? void 0 : _a.showPopover());
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.refButton) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.refButton) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     handleBeforeToggle(event) {
         if (event.newState === 'closed') {
@@ -27291,11 +27378,11 @@ class KolPopoverButton {
         (_c = this.cleanupAutoPositioning) === null || _c === void 0 ? void 0 : _c.call(this);
     }
     render() {
-        return (hAsync("div", { key: '874282cd81b305d92a155d8c848a5004e128db80', class: clsx('kol-popover-button', {
+        return (hAsync("div", { key: '32a785aba018c6cbd915d91380b28a5e6db05088', class: clsx('kol-popover-button', {
                 'kol-popover-button--open': this.popoverOpen,
                 'kol-popover-button--inline': this.state._inline === true,
                 'kol-popover-button--standalone': this.state._inline === false,
-            }) }, hAsync(KolButtonWcTag, { key: 'ae45f6997d3dac685229bfec19111fe3f63df687', _accessKey: this._accessKey, "_aria-controls": "popover", _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this.popoverOpen, _ariaHasPopup: 'dialog', _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline, _label: this._label, _name: this._name, _on: this._on, _role: this._role, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _buttonVariant: this._variant, "data-testid": "popover-button", class: "kol-popover-button__button", ref: (element) => (this.refButton = element), onClick: this.handleButtonClick.bind(this) }, hAsync("slot", { key: '5fdf299465dc56f94bfb739a6d66b03353687e1f', name: "expert", slot: "expert" })), hAsync("div", { key: 'f3e492c4f3a403b36b8e073599377c56823d0d7b', ref: (element) => (this.refPopover = element), "data-testid": "popover-content", popover: "auto", id: "popover", class: "kol-popover-button__popover" }, hAsync("slot", { key: '26ce33d67f396c08acdbc3782e4395344b37da8f' }))));
+            }) }, hAsync(KolButtonWcTag, { key: 'dc421640367e726bc5f6de43065d6fe888375b1c', _accessKey: this._accessKey, "_aria-controls": "popover", _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this.popoverOpen, _ariaHasPopup: 'dialog', _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _hideLabel: this._hideLabel, _icons: this._icons, _id: this._id, _inline: this._inline, _label: this._label, _name: this._name, _on: this._on, _role: this._role, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _buttonVariant: this._variant, "data-testid": "popover-button", class: "kol-popover-button__button", ref: (element) => (this.refButton = element), onClick: this.handleButtonClick.bind(this) }, hAsync("slot", { key: '1fd63443f543963f56e2646f88320e50f34430b0', name: "expert", slot: "expert" })), hAsync("div", { key: 'a1cec965c9b92cbe79ce6b09cf84fd0ae619eb33', ref: (element) => (this.refPopover = element), "data-testid": "popover-content", popover: "auto", id: "popover", class: "kol-popover-button__popover" }, hAsync("slot", { key: 'bc9c769a2036a69596497cc3a522b121b885f88b' }))));
     }
     validateInline(value) {
         validateInline(this, value, {
@@ -27344,6 +27431,7 @@ class KolPopoverButton {
             "popoverOpen": [32],
             "hidePopover": [64],
             "showPopover": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -27543,12 +27631,15 @@ class KolSelect {
         var _a;
         return (_a = this.selectWcRef) === null || _a === void 0 ? void 0 : _a.getValue();
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.selectWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.selectWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
-        return (hAsync(Host, { key: '0d395dee2532c2a584f3bea2296e2c683e7e5acc', class: "kol-select" }, hAsync(KolSelectWcTag, { key: '86d7ddcc1bc8df6adc4e56266182fb6162015076', ref: this.catchRef, _accessKey: this._accessKey, _disabled: this._disabled, _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 }, hAsync("slot", { key: 'f33ffa61e68105f707d945c9fc75f462e3f7d57d', name: "expert", slot: "expert" }))));
+        return (hAsync(Host, { key: '79b2cc9bb971a19d28ad336fb0c2eabea48ee4b4', class: "kol-select" }, hAsync(KolSelectWcTag, { key: '52bf10514527602adf6be51070c617be0f2079d3', ref: this.catchRef, _accessKey: this._accessKey, _disabled: this._disabled, _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 }, hAsync("slot", { key: '1143357c41df4471403e29fd8d263ce765191455', name: "expert", slot: "expert" }))));
     }
     static get style() { return {
         default: defaultStyleCss$d
@@ -27579,6 +27670,7 @@ class KolSelect {
             "_touched": [1540],
             "_value": [1544],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -27784,9 +27876,12 @@ class KolSelectWc {
             return Array.isArray(this.state._value) && this.state._value.length > 0 ? this.state._value[0] : this.state._value;
         }
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.selectRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     getFormFieldProps() {
         return {
@@ -27809,11 +27904,11 @@ class KolSelectWc {
             } });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '149de6c2a2a155d9869e4d09118d7b511058b606' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '84abd564f808296ad32ea68165780862e7808fd0', state: this.state }, hAsync("form", { key: '3d143d2d857793ef6e744def1eada9346983f4d5', onSubmit: (event) => {
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '809e5c7953715be68d2b22a5ff1c5a031951c733' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'cf898096d4ff2695e4d6065828c9349b383a645b', state: this.state }, hAsync("form", { key: 'a9c6f5786c3a62c2d4285c8087f1cc1131f178fe', onSubmit: (event) => {
                 event.preventDefault();
                 propagateSubmitEventToForm({
                     form: this.host});
-            } }, hAsync("input", { key: '4f654dceadd96f6074e22a56aefec34944ab2faa', type: "submit", hidden: true }), hAsync(SelectStateWrapper, Object.assign({ key: 'e576920b9756ed1f8fce70c13c070749d463e839' }, this.getSelectProps()))))));
+            } }, hAsync("input", { key: '76d68fa0755e7770a5fea3dbfdcf22a244cd808d', type: "submit", hidden: true }), hAsync(SelectStateWrapper, Object.assign({ key: 'c81b30d32fbcecd2202511bd0e9834d9b7c5190d' }, this.getSelectProps()))))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -27983,6 +28078,7 @@ class KolSelectWc {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -28049,9 +28145,12 @@ class KolSingleSelect {
     async getValue() {
         return this._value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     onBlur() {
         var _a, _b, _c;
@@ -28215,7 +28314,7 @@ class KolSingleSelect {
     render() {
         var _a;
         const isDisabled = this.state._disabled === true;
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '022bd32dfdbc965f0311456da17cf56032cdbb4e' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '65092ea7e9b0a6a6beab48b75cb2129a5240e94e', state: this.state }, hAsync("div", { key: 'aa18c4f22ac372d12d21d3098666630874f35d9a', class: "kol-single-select__group" }, hAsync(InputStateWrapper, Object.assign({ key: '357c2dd70789f13cc3d6f6f71503a4f588eadde4' }, this.getInputProps())), this._inputValue && !this.state._hideClearButton && (hAsync(KolButtonWcTag, { key: '36713c8e322d38ff76f3fa4d8eddc52995dd1551', _icons: "codicon codicon-close", _label: this.translateDeleteSelection, _hideLabel: true, _buttonVariant: "ghost", _disabled: isDisabled, "data-testid": "single-select-delete", class: clsx('kol-single-select__delete', {
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: 'a8f37dd81bcd050534fe3171b330483cc13914b5' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'a699579be7c019859cc6166169e1c9a801bb443c', state: this.state }, hAsync("div", { key: 'c5340be07f80de622cf6fccdfc0f55d9bf232e27', class: "kol-single-select__group" }, hAsync(InputStateWrapper, Object.assign({ key: '8f9b7377e48d004661acbf5f0f2bbe36c9298fd7' }, this.getInputProps())), this._inputValue && !this.state._hideClearButton && (hAsync(KolButtonWcTag, { key: 'cef3caacc0bb51c0b4760ac6f734ee44087b25d1', _icons: "codicon codicon-close", _label: this.translateDeleteSelection, _hideLabel: true, _buttonVariant: "ghost", _disabled: isDisabled, "data-testid": "single-select-delete", class: clsx('kol-single-select__delete', {
                 'kol-single-select__delete--disabled': isDisabled,
             }), _on: {
                 onClick: () => {
@@ -28223,9 +28322,9 @@ class KolSingleSelect {
                     this.clearSelection();
                     (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
                 },
-            } })), hAsync(KolIconTag, { key: '9edf8cc32fcd57b8dc1b6c5c2bb848e5331b4c84', _icons: "codicon codicon-triangle-down", _label: "", class: clsx('kol-custom-suggestions-toggle', {
+            } })), hAsync(KolIconTag, { key: '4ca81413133d6ad53061ab833255ae48c37fd85a', _icons: "codicon codicon-triangle-down", _label: "", class: clsx('kol-custom-suggestions-toggle', {
                 'kol-custom-suggestions-toggle--disabled': isDisabled,
-            }), onClick: this.toggleListbox.bind(this) })), this._isOpen && !isDisabled && (hAsync(CustomSuggestionsOptionsGroupFc, { key: '2d6d172165735e5a9f9dae7b5c11839ffe6a76eb', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleKeyDownDropdown.bind(this), style: { '--visible-options': `${(_a = this._rows) !== null && _a !== void 0 ? _a : 5}` } }, Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0 ? (this._filteredOptions.map((option, index) => (hAsync(CustomSuggestionsOptionFc, { index: index, option: option.label, searchTerm: this._inputValue, ref: (el) => {
+            }), onClick: this.toggleListbox.bind(this) })), this._isOpen && !isDisabled && (hAsync(CustomSuggestionsOptionsGroupFc, { key: '410bb602f1a0c347f69dce17ce1b7b7e0f1ddc94', blockSuggestionMouseOver: this.blockSuggestionMouseOver, onKeyDown: this.handleKeyDownDropdown.bind(this), style: { '--visible-options': `${(_a = this._rows) !== null && _a !== void 0 ? _a : 5}` } }, Array.isArray(this._filteredOptions) && this._filteredOptions.length > 0 ? (this._filteredOptions.map((option, index) => (hAsync(CustomSuggestionsOptionFc, { index: index, option: option.label, searchTerm: this._inputValue, ref: (el) => {
                 if (el)
                     this.refOptions[index] = el;
             }, selected: this._value === option.value, disabled: option.disabled ? true : false, onClick: (event) => {
@@ -28569,6 +28668,7 @@ class KolSingleSelect {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": [[8, "focusout", "handleFocusOut"], [8, "blur", "handleWindowBlur"], [0, "keydown", "handleKeyDown"], [1, "mousemove", "handleMouseEvent"]],
@@ -28592,6 +28692,13 @@ class KolSkipNav {
             return (hAsync("li", { class: "kol-skip-nav__list-item", key: index }, hAsync(KolLinkWcTag, Object.assign({}, link, { ref: index === 0 ? (el) => (this.firstLinkRef = el) : undefined }))));
         }))));
     }
+    async focus() {
+        var _a;
+        return Promise.resolve((_a = this.firstLinkRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
+    }
     validateLabel(value, _oldValue, initial = false) {
         if (!initial) {
             removeNavLabel(this.state._label);
@@ -28611,10 +28718,6 @@ class KolSkipNav {
     disconnectedCallback() {
         removeNavLabel(this.state._label);
     }
-    async kolFocus() {
-        var _a;
-        await ((_a = this.firstLinkRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
-    }
     static get watchers() { return {
         "_label": ["validateLabel"],
         "_links": ["validateLinks"]
@@ -28629,6 +28732,7 @@ class KolSkipNav {
             "_label": [1],
             "_links": [1],
             "state": [32],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -28745,16 +28849,19 @@ class KolSplitButton {
     async getValue() {
         return this._value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        await ((_a = this.primaryButtonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
+        return Promise.resolve((_a = this.primaryButtonWcRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     render() {
         const i18nDropdownLabel = 'kol-split-button-dropdown-label';
-        return (hAsync("div", { key: '156668962e6ff2011625d1128a20a9dba6e24a9b', class: "kol-split-button" }, hAsync("div", { key: 'a273dc653d3c0a1efb5e3c83bd0e5f2ee2478e79', class: "kol-split-button__root" }, hAsync(KolButtonWcTag, { key: '88f61eecb6fdce911538179e721eae5af2c41c0f', class: clsx('kol-split-button__button', {
+        return (hAsync("div", { key: 'fd28aa257b89ec88249c2f7eb4f1178abd5b70f1', class: "kol-split-button" }, hAsync("div", { key: '7abb8684272b4cb0145124cfb74189f1f4d2e06c', class: "kol-split-button__root" }, hAsync(KolButtonWcTag, { key: '808d218153cb14a95b7640fe0312f9386922168e', class: clsx('kol-split-button__button', {
                 [this._variant]: this._variant !== 'custom',
                 [this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
-            }), ref: this.catchPrimaryRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _id: this._id, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _buttonVariant: this._variant }), hAsync("div", { key: '609e38bd0f8c2c80e831b0f933cec91d8d590d93', class: "kol-split-button__horizontal-line" }), hAsync(KolButtonWcTag, { key: '95da68081863776d4ea3ae7f67cc4752b6299d72', class: "kol-split-button__secondary-button", _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`), _on: this.clickToggleHandler })), hAsync(KolPopoverWcTag, { key: 'b8ca42df85abdfbd34c9df79c416b78aada35a56', _show: this.state._show, _on: { onClose: this.handleOnClose }, _align: "bottom" }, hAsync("slot", { key: '3af62ecf99ccdd770b926535d51f875426408103' }))));
+            }), ref: this.catchPrimaryRef, _accessKey: this._accessKey, _ariaControls: this._ariaControls, _ariaDescription: this._ariaDescription, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _id: this._id, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _buttonVariant: this._variant }), hAsync("div", { key: '1f4dec3081093baf3435447615be0f466fa47890', class: "kol-split-button__horizontal-line" }), hAsync(KolButtonWcTag, { key: 'e0545b6a2565cecb3e65e79635771ebcac12c1cc', class: "kol-split-button__secondary-button", _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`), _on: this.clickToggleHandler })), hAsync(KolPopoverWcTag, { key: 'af16aee240137561a45847448a8144de33a100f5', _show: this.state._show, _on: { onClose: this.handleOnClose }, _align: "bottom" }, hAsync("slot", { key: '0c2ffbeaf67e040c2c101829332b90df397200fa' }))));
     }
     async closePopup() {
         this.handleOnClose();
@@ -28789,6 +28896,7 @@ class KolSplitButton {
             "_variant": [1],
             "state": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64],
             "closePopup": [64]
         },
@@ -30393,9 +30501,12 @@ class KolTextarea {
         var _a;
         return (_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.value;
     }
-    async kolFocus() {
+    async focus() {
         var _a;
-        (_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.focus();
+        return Promise.resolve((_a = this.textareaRef) === null || _a === void 0 ? void 0 : _a.focus());
+    }
+    async kolFocus() {
+        return this.focus();
     }
     getFormFieldProps() {
         return {
@@ -30421,7 +30532,7 @@ class KolTextarea {
             } });
     }
     render() {
-        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '2c2f033030f99e33507c059de0820cc72de7a599' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: 'b64d16f3b7484d98ef5c85f0a2fd41a90bc2469a', state: this.state }, hAsync(TextAreaStateWrapper, Object.assign({ key: 'dec62bcfd41aaf9af259d7c40bb194d5dd157e8b' }, this.getTextAreaProps())))));
+        return (hAsync(FormFieldStateWrapper, Object.assign({ key: '8c0e36e0f3518438ad47719a0487838b50458bfa' }, this.getFormFieldProps()), hAsync(InputContainerStateWrapperFc, { key: '46550d2a7fe6d389b92205e55da49cd30e525fb3', state: this.state }, hAsync(TextAreaStateWrapper, Object.assign({ key: '95bfd7318945abbd30a807e2f705946d8e2dabf1' }, this.getTextAreaProps())))));
     }
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -30622,6 +30733,7 @@ class KolTextarea {
             "state": [32],
             "inputHasFocus": [32],
             "getValue": [64],
+            "focus": [64],
             "kolFocus": [64]
         },
         "$listeners$": undefined,
@@ -30794,7 +30906,7 @@ class KolToolbar {
         if ((_d = (_c = this.state._items) === null || _c === void 0 ? void 0 : _c[nextIndex]) === null || _d === void 0 ? void 0 : _d._disabled)
             return;
         this.currentIndex = nextIndex;
-        void ((_e = this.getCurrentToolbarItem(nextIndex)) === null || _e === void 0 ? void 0 : _e.kolFocus());
+        void ((_e = this.getCurrentToolbarItem(nextIndex)) === null || _e === void 0 ? void 0 : _e.focus());
     }
     handleBlur(event) {
         if (event.target === this.host)
@@ -31087,27 +31199,27 @@ class KolTreeItem {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
+    async focus() {
+        var _a;
+        return Promise.resolve((_a = this.element) === null || _a === void 0 ? void 0 : _a.focus());
+    }
     async focusLink() {
-        if (this.element) {
-            await this.element.focusLink();
-        }
+        return this.focus();
     }
     async expand() {
-        if (this.element) {
-            await this.element.expand();
-        }
+        var _a;
+        return Promise.resolve((_a = this.element) === null || _a === void 0 ? void 0 : _a.expand());
     }
     async collapse() {
-        if (this.element) {
-            await this.element.collapse();
-        }
+        var _a;
+        return Promise.resolve((_a = this.element) === null || _a === void 0 ? void 0 : _a.collapse());
     }
     async isOpen() {
         var _a, _b;
         return (_b = (await ((_a = this.element) === null || _a === void 0 ? void 0 : _a.isOpen()))) !== null && _b !== void 0 ? _b : false;
     }
     render() {
-        return (hAsync(KolTreeItemWcTag, { key: '87d60840b65ed567e5e6075f362e33933563c5c9', _active: this._active, _label: this._label, _open: this._open, _href: this._href, ref: (element) => (this.element = element) }, hAsync("slot", { key: 'b0b1d7110cc70ee74fe026e0bedd2620fc423c1d' })));
+        return (hAsync(KolTreeItemWcTag, { key: '10423bea3abc1e93d76d9cc740af25991e1944cf', _active: this._active, _label: this._label, _open: this._open, _href: this._href, ref: (element) => (this.element = element) }, hAsync("slot", { key: 'efc07e646a66d0034caab0ff546529a70098c836' })));
     }
     static get style() { return {
         default: defaultStyleCss$1
@@ -31120,6 +31232,7 @@ class KolTreeItem {
             "_label": [1],
             "_open": [4],
             "_href": [1],
+            "focus": [64],
             "focusLink": [64],
             "expand": [64],
             "collapse": [64],
@@ -31188,12 +31301,17 @@ class KolTreeItemWc {
         var _a, _b;
         this.state = Object.assign(Object.assign({}, this.state), { _hasChildren: Boolean((_b = (_a = this.host.querySelector('slot')) === null || _a === void 0 ? void 0 : _a.assignedElements) === null || _b === void 0 ? void 0 : _b.call(_a).length) });
     }
+    async focus() {
+        var _a;
+        return Promise.resolve((_a = this.linkElement) === null || _a === void 0 ? void 0 : _a.focus());
+    }
     async focusLink() {
-        await this.linkElement.kolFocus();
+        return this.focus();
     }
     async handleExpandClick(event) {
+        var _a;
         event.preventDefault();
-        await this.linkElement.kolFocus();
+        await ((_a = this.linkElement) === null || _a === void 0 ? void 0 : _a.focus());
         await this.expand();
     }
     async expand() {
@@ -31202,8 +31320,9 @@ class KolTreeItemWc {
         }
     }
     async handleCollapseClick(event) {
+        var _a;
         event.preventDefault();
-        this.linkElement.focus();
+        await ((_a = this.linkElement) === null || _a === void 0 ? void 0 : _a.focus());
         await this.collapse();
     }
     async collapse() {
@@ -31232,6 +31351,7 @@ class KolTreeItemWc {
             "_href": [1],
             "level": [32],
             "state": [32],
+            "focus": [64],
             "focusLink": [64],
             "expand": [64],
             "collapse": [64],
@@ -31317,7 +31437,7 @@ class KolTreeWc {
         return elementsWithInclude.filter((element) => element.include).map((element) => element.value);
     }
     async handleKeyDown(event) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         const openItems = await this.getOpenTreeItemElements();
         const currentTreeItem = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.closest(KolTreeItemTag);
         const hasModifierKeyPressed = event.metaKey || event.altKey || event.ctrlKey || event.shiftKey;
@@ -31327,12 +31447,12 @@ class KolTreeWc {
         const currentIndex = openItems === null || openItems === void 0 ? void 0 : openItems.findIndex((elem) => elem === currentTreeItem);
         switch (event.key) {
             case 'ArrowDown': {
-                await ((_b = openItems[currentIndex + 1]) === null || _b === void 0 ? void 0 : _b.focusLink());
+                await ((_b = openItems[currentIndex + 1]) === null || _b === void 0 ? void 0 : _b.focus());
                 event.preventDefault();
                 break;
             }
             case 'ArrowUp': {
-                await ((_c = openItems[currentIndex - 1]) === null || _c === void 0 ? void 0 : _c.focusLink());
+                await ((_c = openItems[currentIndex - 1]) === null || _c === void 0 ? void 0 : _c.focus());
                 event.preventDefault();
                 break;
             }
@@ -31340,7 +31460,7 @@ class KolTreeWc {
             case 'ArrowRight': {
                 event.preventDefault();
                 if (await currentTreeItem.isOpen()) {
-                    await ((_d = openItems[currentIndex + 1]) === null || _d === void 0 ? void 0 : _d.focusLink());
+                    await ((_d = openItems[currentIndex + 1]) === null || _d === void 0 ? void 0 : _d.focus());
                 }
                 else {
                     await currentTreeItem.expand();
@@ -31355,17 +31475,17 @@ class KolTreeWc {
                 }
                 else {
                     const parentIndex = openItems.findIndex((item) => item === currentTreeItem.parentElement);
-                    parentIndex !== -1 && (await ((_e = openItems[parentIndex]) === null || _e === void 0 ? void 0 : _e.focusLink()));
+                    parentIndex !== -1 && (await ((_e = openItems[parentIndex]) === null || _e === void 0 ? void 0 : _e.focus()));
                 }
                 break;
             }
             case 'Home': {
-                await ((_f = openItems[0]) === null || _f === void 0 ? void 0 : _f.focusLink());
+                await ((_f = openItems[0]) === null || _f === void 0 ? void 0 : _f.focus());
                 event.preventDefault();
                 break;
             }
             case 'End': {
-                await ((_g = openItems[openItems.length - 1]) === null || _g === void 0 ? void 0 : _g.focusLink());
+                await ((_g = openItems[openItems.length - 1]) === null || _g === void 0 ? void 0 : _g.focus());
                 event.preventDefault();
                 break;
             }
@@ -31378,14 +31498,14 @@ class KolTreeWc {
                         .slice(startIndex, startIndex + openItems.length)
                         .findIndex((item) => { var _a; return (_a = item.getAttribute('_label')) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase().startsWith(char); });
                     if (matchIndex !== -1) {
-                        await wrapAroundItems[startIndex + matchIndex].focusLink();
+                        await ((_j = wrapAroundItems[startIndex + matchIndex]) === null || _j === void 0 ? void 0 : _j.focus());
                         event.preventDefault();
                     }
                 }
                 break;
             }
             case '*': {
-                const siblings = (_j = currentTreeItem.parentElement) === null || _j === void 0 ? void 0 : _j.querySelectorAll(KolTreeItemTag);
+                const siblings = (_k = currentTreeItem.parentElement) === null || _k === void 0 ? void 0 : _k.querySelectorAll(KolTreeItemTag);
                 siblings === null || siblings === void 0 ? void 0 : siblings.forEach((element) => {
                     void element.expand();
                 });