@public-ui/hydrate 2.2.11-d5dad25b9084a461f833a47372b0ec3c24bc5d73.0 → 2.2.11-rc.1

package/dist/index.js

@@ -5335,11 +5335,9 @@ class KolButton {
         await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
     }
     render() {
-        return (hAsync(Host, { key: '2cac05d30f6702e069cff37e7c5d98ec3051d029', class: "kol-button" }, hAsync(KolButtonWcTag, { key: '66045543c52d960eacd13fbafd78d0afc5a6aa38', ref: this.catchRef, class: {
+        return (hAsync(Host, { key: '2cac05d30f6702e069cff37e7c5d98ec3051d029', class: "kol-button" }, hAsync(KolButtonWcTag, { key: 'af027f003e52c388d21a390e9c3757ef253c8cb8', ref: this.catchRef, class: {
                 button: true,
-                [this._variant]: this._variant !== 'custom',
-                [this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
-            }, _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, _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, _variant: this._variant }, hAsync("slot", { key: '2af46572e2480c4b9ce5ec1cf9d57fb7e9ae898b', name: "expert", slot: "expert" }))));
+            }, _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, _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, _variant: this._variant }, hAsync("slot", { key: 'bb85820948d8ec3f2bcb3229d3ace056dacb9668', name: "expert", slot: "expert" }))));
     }
     static get delegatesFocus() { return true; }
     static get style() { return {
@@ -6438,6 +6436,8 @@ class KolCombobox {
                 }, "data-index": index, tabIndex: -1, role: "option", "aria-selected": this.state._value === option ? 'true' : undefined, onClick: () => {
                     this.selectOption(option);
                     this.toggleListbox();
+                    this._isOpen = false;
+                    this._hasOpened = false;
                 }, onMouseOver: () => {
                     if (!this.blockSuggestionMouseOver) {
                         this.focusOption(index);
@@ -6480,7 +6480,7 @@ class KolCombobox {
             }
             case 'Tab':
                 if (this._isOpen) {
-                    this._isOpen = !this._isOpen;
+                    this._isOpen = false;
                     (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
                 }
                 break;
@@ -6488,13 +6488,21 @@ class KolCombobox {
             case 'Escape': {
                 this._hasOpened = false;
                 this._isOpen = false;
-                handleEvent(false);
+                event.preventDefault();
                 (_b = this.refInput) === null || _b === void 0 ? void 0 : _b.focus();
                 break;
             }
             case 'NumpadEnter':
             case 'Enter': {
-                this.toggleListbox();
+                if (this._isOpen && this._focusedOptionIndex >= 0) {
+                    this._filteredSuggestions && this.selectOption(this._filteredSuggestions[this._focusedOptionIndex]);
+                    this._isOpen = false;
+                    this._hasOpened = false;
+                }
+                else {
+                    this.toggleListbox();
+                }
+                event.preventDefault();
                 break;
             }
             case 'Home': {
@@ -10813,11 +10821,9 @@ class KolLinkButton {
         await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
     }
     render() {
-        return (hAsync(Host, { key: '17537a98e3d3e082a833b0fd8970d8ed6d5121f0', class: "kol-link-button" }, hAsync(KolLinkWcTag, { key: '43c8c70e85b0bb2ef1db7b643ef0d7e5ee01023d', ref: this.catchRef, class: {
+        return (hAsync(Host, { key: '17537a98e3d3e082a833b0fd8970d8ed6d5121f0', class: "kol-link-button" }, hAsync(KolLinkWcTag, { key: '12115da0c3ed106c7b2954296f5a2529e074897a', ref: this.catchRef, class: {
                 button: true,
-                [this._variant]: this._variant !== 'custom',
-                [this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
-            }, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaDescription: this._ariaDescription, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _label: this._label, _on: this._on, _role: "button", _shortKey: this._shortKey, _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: 'e151c7bb451e3a092885d7a41414084e9ffb58d3', name: "expert", slot: "expert" }))));
+            }, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _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, _role: "button", _shortKey: this._shortKey, _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign, _variant: this._variant }, hAsync("slot", { key: '9fdb0b15c70fa8c22cfe4e5b28893c5d793a6d51', name: "expert", slot: "expert" }))));
     }
     static get delegatesFocus() { return true; }
     static get style() { return {
@@ -11009,6 +11015,7 @@ class KolLinkWc {
         this._ariaDescription = undefined;
         this._ariaExpanded = undefined;
         this._ariaOwns = undefined;
+        this._customClass = undefined;
         this._disabled = false;
         this._download = undefined;
         this._hideLabel = false;
@@ -11021,6 +11028,7 @@ class KolLinkWc {
         this._tabIndex = undefined;
         this._target = undefined;
         this._tooltipAlign = 'right';
+        this._variant = 'normal';
         this.state = {
             _ariaCurrentValue: 'page',
             _href: '',
@@ -11036,13 +11044,15 @@ class KolLinkWc {
         const { isExternal, tagAttrs } = this.getRenderValues();
         const hasExpertSlot = showExpertSlot(this.state._label);
         const hasAriaDescription = Boolean((_b = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim()) === null || _b === void 0 ? void 0 : _b.length);
-        return (hAsync(Host, { key: '5da2a89adb469aa00911016bf83da8bc811d6afb', class: "kol-link-wc" }, hAsync("a", Object.assign({ key: '5ba27442fb12021bcd40b2bbea3458ba90319ee7', ref: this.catchRef }, tagAttrs, { accessKey: this.state._accessKey, "aria-current": this.state._ariaCurrent, "aria-describedby": hasAriaDescription ? this.internalDescriptionById : 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: '1d30bedcd820dec1c26c0eff106acc80bedb5cb3', class: "kol-link-wc" }, hAsync("a", Object.assign({ key: 'efc2b3393b67b4744cec4ea94b95014324d899f3', ref: this.catchRef }, tagAttrs, { accessKey: this.state._accessKey, "aria-current": this.state._ariaCurrent, "aria-describedby": hasAriaDescription ? this.internalDescriptionById : 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 ? ` (${translate('kol-open-link-in-tab')})` : ''}`
                 : undefined, class: {
                 disabled: this.state._disabled === true,
                 'external-link': isExternal,
                 'hide-label': this.state._hideLabel === true,
-            } }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick, role: this.state._role, tabIndex: this.state._disabled ? -1 : this.state._tabIndex }), hAsync(KolSpanWcTag, { key: 'cff45aabbf830b45a1606d21b310946fc4107c25', _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: 'e1e4856db3aae514a7cfab6221171f64a9ad786e', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { key: '3baff63f0c231d434d7b7b00bd561ce9c4388c44', class: "external-link-icon", _label: this.state._hideLabel ? '' : translate('kol-open-link-in-tab'), _icons: 'codicon codicon-link-external', "aria-hidden": this.state._hideLabel }))), hAsync(KolTooltipWcTag, { key: 'e40f46350a2b28542eddc16bf75378cc66e5eb42', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _badgeText: this.state._accessKey || this.state._shortKey, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href }), hasAriaDescription && (hAsync("span", { key: 'da48986516bb270a3077d5c98c5603e55f9a9f42', class: "visually-hidden", id: this.internalDescriptionById }, this.state._ariaDescription))));
+                [this.state._variant]: this.state._variant !== 'custom',
+                [this.state._customClass]: this.state._variant === '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(KolSpanWcTag, { key: '02c28b7d44741668ee5847e454769195810a0958', _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: '14536938fdd95503bdfdc0bec1e56221a6e075f7', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { key: '6624f9d9590bedd38e696d322f988a7ab0d0a6e6', class: "external-link-icon", _label: this.state._hideLabel ? '' : translate('kol-open-link-in-tab'), _icons: 'codicon codicon-link-external', "aria-hidden": this.state._hideLabel }))), hAsync(KolTooltipWcTag, { key: 'c4aea7ed08c840b8352626122c7f5a2c44dbe01a', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _badgeText: this.state._accessKey || this.state._shortKey, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href }), hasAriaDescription && (hAsync("span", { key: 'c2481878f8b0801390a63af0f33ce30ed9024f5e', class: "visually-hidden", id: this.internalDescriptionById }, this.state._ariaDescription))));
     }
     validateAccessKey(value) {
         validateAccessKey(this, value);
@@ -11060,6 +11070,9 @@ class KolLinkWc {
     validateAriaOwns(value) {
         validateAriaOwns(this, value);
     }
+    validateCustomClass(value) {
+        validateCustomClass(this, value);
+    }
     validateDisabled(value) {
         validateDisabled(this, value);
     }
@@ -11099,12 +11112,16 @@ class KolLinkWc {
     validateTooltipAlign(value) {
         validateTooltipAlign(this, value);
     }
+    validateVariant(value) {
+        validateButtonVariant(this, value);
+    }
     componentWillLoad() {
         this.validateAccessKey(this._accessKey);
         this.validateAriaCurrentValue(this._ariaCurrentValue);
         this.validateAriaDescription(this._ariaDescription);
         this.validateAriaExpanded(this._ariaExpanded);
         this.validateAriaOwns(this._ariaOwns);
+        this.validateCustomClass(this._customClass);
         this.validateDisabled(this._disabled);
         this.validateDownload(this._download);
         this.validateHideLabel(this._hideLabel);
@@ -11117,6 +11134,7 @@ class KolLinkWc {
         this.validateTabIndex(this._tabIndex);
         this.validateTarget(this._target);
         this.validateTooltipAlign(this._tooltipAlign);
+        this.validateVariant(this._variant);
         this.unsubscribeOnLocationChange = onLocationChange((location) => {
             this.state._ariaCurrent = location === this.state._href ? this.state._ariaCurrentValue : undefined;
         });
@@ -11133,6 +11151,7 @@ class KolLinkWc {
         "_ariaDescription": ["validateAriaDescription"],
         "_ariaExpanded": ["validateAriaExpanded"],
         "_ariaOwns": ["validateAriaOwns"],
+        "_customClass": ["validateCustomClass"],
         "_disabled": ["validateDisabled"],
         "_download": ["validateDownload"],
         "_hideLabel": ["validateHideLabel"],
@@ -11144,7 +11163,8 @@ class KolLinkWc {
         "_shortKey": ["validateShortKey"],
         "_tabIndex": ["validateTabIndex"],
         "_target": ["validateTarget"],
-        "_tooltipAlign": ["validateTooltipAlign"]
+        "_tooltipAlign": ["validateTooltipAlign"],
+        "_variant": ["validateVariant"]
     }; }
     static get cmpMeta() { return {
         "$flags$": 4,
@@ -11155,6 +11175,7 @@ class KolLinkWc {
             "_ariaDescription": [1, "_aria-description"],
             "_ariaExpanded": [4, "_aria-expanded"],
             "_ariaOwns": [1, "_aria-owns"],
+            "_customClass": [1, "_custom-class"],
             "_disabled": [4],
             "_download": [1],
             "_hideLabel": [4, "_hide-label"],
@@ -11167,6 +11188,7 @@ class KolLinkWc {
             "_tabIndex": [2, "_tab-index"],
             "_target": [1],
             "_tooltipAlign": [1, "_tooltip-align"],
+            "_variant": [1],
             "state": [32],
             "kolFocus": [64]
         },
@@ -14340,13 +14362,11 @@ class KolPopoverButton {
         (_b = this.refPopover) === null || _b === void 0 ? void 0 : _b.removeEventListener('beforetoggle', this.handleBeforeToggle.bind(this));
     }
     render() {
-        return (hAsync("div", { key: 'e37abb8082b4a79421acf0d18d54088af227db75', class: "kol-popover-button" }, hAsync(KolButtonWcTag, { key: 'ce7f7a12aa80b3209a213f96f0798f3342821d00', _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, _label: this._label, _name: this._name, _on: Object.assign(Object.assign({}, this._on), { onClick: (event, value) => {
+        return (hAsync("div", { key: 'e37abb8082b4a79421acf0d18d54088af227db75', class: "kol-popover-button" }, hAsync(KolButtonWcTag, { key: 'e20b23b48f106137393b3bc47ea49c2d8b75f83a', _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, _label: this._label, _name: this._name, _on: Object.assign(Object.assign({}, this._on), { onClick: (event, value) => {
                     var _a, _b;
                     this.handleButtonClick();
                     (_b = (_a = this._on) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event, value);
-                } }), _role: this._role, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant, "data-testid": "popover-button", class: clsx('kol-popover-button__button', {
-                [this._variant]: this._variant !== 'custom',
-            }), ref: (element) => (this.refButton = element) }, hAsync("slot", { key: 'a5761c899b808a407bc33d45da89bfdc6b5b7c70', name: "expert", slot: "expert" })), hAsync("div", { key: 'ed889b69d3707834aa1e621d94d1889d277d84d3', ref: (element) => (this.refPopover = element), "data-testid": "popover-content", popover: "auto", id: "popover", class: "kol-popover-button__popover" }, hAsync("slot", { key: '14e8af2ad55b838415564b7a576586435cb54a67' }))));
+                } }), _role: this._role, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant, "data-testid": "popover-button", class: clsx('kol-popover-button__button'), ref: (element) => (this.refButton = element) }, hAsync("slot", { key: '4d0e91ca18454baa0dbbf215dfef99ab2c6a1884', name: "expert", slot: "expert" })), hAsync("div", { key: 'bc2ec76aa27e820cc1f3ff327a5465b9db402a10', ref: (element) => (this.refPopover = element), "data-testid": "popover-content", popover: "auto", id: "popover", class: "kol-popover-button__popover" }, hAsync("slot", { key: '8f4c33b71619fd768142be64c928111e04889798' }))));
     }
     validatePopoverAlign(value) {
         validatePopoverAlign(this, value);
@@ -15078,6 +15098,8 @@ class KolSingleSelect {
                 this.selectOption(option);
                 (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
                 this.toggleListbox(event);
+                this._isOpen = false;
+                this._hasOpened = false;
             }, onMouseOver: () => {
                 if (!this.blockSuggestionMouseOver) {
                     this._focusedOptionIndex = index;
@@ -15162,6 +15184,8 @@ class KolSingleSelect {
             case 'NumpadEnter':
             case 'Enter': {
                 this.toggleListbox(event);
+                this._hasOpened = false;
+                this._isOpen = false;
                 break;
             }
             case 'Home': {
@@ -23996,12 +24020,10 @@ class KolSplitButton {
     }
     render() {
         const i18nDropdownLabel = 'kol-split-button-dropdown-label';
-        return (hAsync(Host, { key: 'bf0b8bbd7c2dc4fc85d7277dd92d16e2ce288d76', class: "kol-split-button" }, hAsync("div", { key: '74daf437028dc1c2add23932d7cd52782ccc1e4c', class: "split-button-root" }, hAsync(KolButtonWcTag, { key: 'bbceebf8897931f5bcfe964fffcd574477265162', class: {
+        return (hAsync(Host, { key: 'bf0b8bbd7c2dc4fc85d7277dd92d16e2ce288d76', class: "kol-split-button" }, hAsync("div", { key: '74daf437028dc1c2add23932d7cd52782ccc1e4c', class: "split-button-root" }, hAsync(KolButtonWcTag, { key: '3bf984a61b273d36574f0846a102bc35700c9caf', class: {
                 'main-button': true,
                 button: true,
-                [this._variant]: this._variant !== 'custom',
-                [this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
-            }, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }), hAsync("div", { key: '9108c4d0319dd944bfb2ebd9d9c5cf4b6d08112b', class: "horizontal-line" }), hAsync(KolButtonWcTag, { key: '310f0b697003718509adfb6b0b702260856a486c', class: { 'secondary-button': true, [this._variant]: this._variant !== 'custom' }, _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`), _on: this.clickToggleHandler, _variant: this._variant })), hAsync(KolPopoverWcTag, { key: 'f855e820d841dbe82103d882fcd18a904e183a91', _show: this.state._show, _on: { onClose: this.handleOnClose }, _align: "bottom" }, hAsync("slot", { key: '038addd2ccea0fa2d995957ef34805d715f943d1' }))));
+            }, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }), hAsync("div", { key: 'a3f4b6dbd1a16d95024ab0825dcc5012b5ccd0af', class: "horizontal-line" }), hAsync(KolButtonWcTag, { key: 'd046ecef26cc8872fd17271258fd98b1daafa342', class: { 'secondary-button': true, [this._variant]: this._variant !== 'custom' }, _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`), _on: this.clickToggleHandler, _variant: this._variant })), hAsync(KolPopoverWcTag, { key: '2b0eeafd1d2f2ef8960b932adb6a34315bce0910', _show: this.state._show, _on: { onClose: this.handleOnClose }, _align: "bottom" }, hAsync("slot", { key: 'f5eba083e4760144334a4ad225086781782f3809' }))));
     }
     async closePopup() {
         this.handleOnClose();

package/dist/index.mjs

@@ -5331,11 +5331,9 @@ class KolButton {
         await ((_a = this.buttonWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
     }
     render() {
-        return (hAsync(Host, { key: '2cac05d30f6702e069cff37e7c5d98ec3051d029', class: "kol-button" }, hAsync(KolButtonWcTag, { key: '66045543c52d960eacd13fbafd78d0afc5a6aa38', ref: this.catchRef, class: {
+        return (hAsync(Host, { key: '2cac05d30f6702e069cff37e7c5d98ec3051d029', class: "kol-button" }, hAsync(KolButtonWcTag, { key: 'af027f003e52c388d21a390e9c3757ef253c8cb8', ref: this.catchRef, class: {
                 button: true,
-                [this._variant]: this._variant !== 'custom',
-                [this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
-            }, _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, _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, _variant: this._variant }, hAsync("slot", { key: '2af46572e2480c4b9ce5ec1cf9d57fb7e9ae898b', name: "expert", slot: "expert" }))));
+            }, _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, _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, _variant: this._variant }, hAsync("slot", { key: 'bb85820948d8ec3f2bcb3229d3ace056dacb9668', name: "expert", slot: "expert" }))));
     }
     static get delegatesFocus() { return true; }
     static get style() { return {
@@ -6434,6 +6432,8 @@ class KolCombobox {
                 }, "data-index": index, tabIndex: -1, role: "option", "aria-selected": this.state._value === option ? 'true' : undefined, onClick: () => {
                     this.selectOption(option);
                     this.toggleListbox();
+                    this._isOpen = false;
+                    this._hasOpened = false;
                 }, onMouseOver: () => {
                     if (!this.blockSuggestionMouseOver) {
                         this.focusOption(index);
@@ -6476,7 +6476,7 @@ class KolCombobox {
             }
             case 'Tab':
                 if (this._isOpen) {
-                    this._isOpen = !this._isOpen;
+                    this._isOpen = false;
                     (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
                 }
                 break;
@@ -6484,13 +6484,21 @@ class KolCombobox {
             case 'Escape': {
                 this._hasOpened = false;
                 this._isOpen = false;
-                handleEvent(false);
+                event.preventDefault();
                 (_b = this.refInput) === null || _b === void 0 ? void 0 : _b.focus();
                 break;
             }
             case 'NumpadEnter':
             case 'Enter': {
-                this.toggleListbox();
+                if (this._isOpen && this._focusedOptionIndex >= 0) {
+                    this._filteredSuggestions && this.selectOption(this._filteredSuggestions[this._focusedOptionIndex]);
+                    this._isOpen = false;
+                    this._hasOpened = false;
+                }
+                else {
+                    this.toggleListbox();
+                }
+                event.preventDefault();
                 break;
             }
             case 'Home': {
@@ -10809,11 +10817,9 @@ class KolLinkButton {
         await ((_a = this.linkWcRef) === null || _a === void 0 ? void 0 : _a.kolFocus());
     }
     render() {
-        return (hAsync(Host, { key: '17537a98e3d3e082a833b0fd8970d8ed6d5121f0', class: "kol-link-button" }, hAsync(KolLinkWcTag, { key: '43c8c70e85b0bb2ef1db7b643ef0d7e5ee01023d', ref: this.catchRef, class: {
+        return (hAsync(Host, { key: '17537a98e3d3e082a833b0fd8970d8ed6d5121f0', class: "kol-link-button" }, hAsync(KolLinkWcTag, { key: '12115da0c3ed106c7b2954296f5a2529e074897a', ref: this.catchRef, class: {
                 button: true,
-                [this._variant]: this._variant !== 'custom',
-                [this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
-            }, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _ariaDescription: this._ariaDescription, _disabled: this._disabled, _download: this._download, _hideLabel: this._hideLabel, _href: this._href, _icons: this._icons, _label: this._label, _on: this._on, _role: "button", _shortKey: this._shortKey, _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign }, hAsync("slot", { key: 'e151c7bb451e3a092885d7a41414084e9ffb58d3', name: "expert", slot: "expert" }))));
+            }, _accessKey: this._accessKey, _ariaCurrentValue: this._ariaCurrentValue, _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, _role: "button", _shortKey: this._shortKey, _tabIndex: this._tabIndex, _target: this._target, _tooltipAlign: this._tooltipAlign, _variant: this._variant }, hAsync("slot", { key: '9fdb0b15c70fa8c22cfe4e5b28893c5d793a6d51', name: "expert", slot: "expert" }))));
     }
     static get delegatesFocus() { return true; }
     static get style() { return {
@@ -11005,6 +11011,7 @@ class KolLinkWc {
         this._ariaDescription = undefined;
         this._ariaExpanded = undefined;
         this._ariaOwns = undefined;
+        this._customClass = undefined;
         this._disabled = false;
         this._download = undefined;
         this._hideLabel = false;
@@ -11017,6 +11024,7 @@ class KolLinkWc {
         this._tabIndex = undefined;
         this._target = undefined;
         this._tooltipAlign = 'right';
+        this._variant = 'normal';
         this.state = {
             _ariaCurrentValue: 'page',
             _href: '',
@@ -11032,13 +11040,15 @@ class KolLinkWc {
         const { isExternal, tagAttrs } = this.getRenderValues();
         const hasExpertSlot = showExpertSlot(this.state._label);
         const hasAriaDescription = Boolean((_b = (_a = this.state._ariaDescription) === null || _a === void 0 ? void 0 : _a.trim()) === null || _b === void 0 ? void 0 : _b.length);
-        return (hAsync(Host, { key: '5da2a89adb469aa00911016bf83da8bc811d6afb', class: "kol-link-wc" }, hAsync("a", Object.assign({ key: '5ba27442fb12021bcd40b2bbea3458ba90319ee7', ref: this.catchRef }, tagAttrs, { accessKey: this.state._accessKey, "aria-current": this.state._ariaCurrent, "aria-describedby": hasAriaDescription ? this.internalDescriptionById : 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: '1d30bedcd820dec1c26c0eff106acc80bedb5cb3', class: "kol-link-wc" }, hAsync("a", Object.assign({ key: 'efc2b3393b67b4744cec4ea94b95014324d899f3', ref: this.catchRef }, tagAttrs, { accessKey: this.state._accessKey, "aria-current": this.state._ariaCurrent, "aria-describedby": hasAriaDescription ? this.internalDescriptionById : 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 ? ` (${translate('kol-open-link-in-tab')})` : ''}`
                 : undefined, class: {
                 disabled: this.state._disabled === true,
                 'external-link': isExternal,
                 'hide-label': this.state._hideLabel === true,
-            } }, this.state._on, { onClick: this.onClick, onKeyPress: this.onClick, role: this.state._role, tabIndex: this.state._disabled ? -1 : this.state._tabIndex }), hAsync(KolSpanWcTag, { key: 'cff45aabbf830b45a1606d21b310946fc4107c25', _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: 'e1e4856db3aae514a7cfab6221171f64a9ad786e', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { key: '3baff63f0c231d434d7b7b00bd561ce9c4388c44', class: "external-link-icon", _label: this.state._hideLabel ? '' : translate('kol-open-link-in-tab'), _icons: 'codicon codicon-link-external', "aria-hidden": this.state._hideLabel }))), hAsync(KolTooltipWcTag, { key: 'e40f46350a2b28542eddc16bf75378cc66e5eb42', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _badgeText: this.state._accessKey || this.state._shortKey, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href }), hasAriaDescription && (hAsync("span", { key: 'da48986516bb270a3077d5c98c5603e55f9a9f42', class: "visually-hidden", id: this.internalDescriptionById }, this.state._ariaDescription))));
+                [this.state._variant]: this.state._variant !== 'custom',
+                [this.state._customClass]: this.state._variant === '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(KolSpanWcTag, { key: '02c28b7d44741668ee5847e454769195810a0958', _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: '14536938fdd95503bdfdc0bec1e56221a6e075f7', name: "expert", slot: "expert" })), isExternal && (hAsync(KolIconTag, { key: '6624f9d9590bedd38e696d322f988a7ab0d0a6e6', class: "external-link-icon", _label: this.state._hideLabel ? '' : translate('kol-open-link-in-tab'), _icons: 'codicon codicon-link-external', "aria-hidden": this.state._hideLabel }))), hAsync(KolTooltipWcTag, { key: 'c4aea7ed08c840b8352626122c7f5a2c44dbe01a', "aria-hidden": "true", hidden: hasExpertSlot || !this.state._hideLabel, _badgeText: this.state._accessKey || this.state._shortKey, _align: this.state._tooltipAlign, _label: this.state._label || this.state._href }), hasAriaDescription && (hAsync("span", { key: 'c2481878f8b0801390a63af0f33ce30ed9024f5e', class: "visually-hidden", id: this.internalDescriptionById }, this.state._ariaDescription))));
     }
     validateAccessKey(value) {
         validateAccessKey(this, value);
@@ -11056,6 +11066,9 @@ class KolLinkWc {
     validateAriaOwns(value) {
         validateAriaOwns(this, value);
     }
+    validateCustomClass(value) {
+        validateCustomClass(this, value);
+    }
     validateDisabled(value) {
         validateDisabled(this, value);
     }
@@ -11095,12 +11108,16 @@ class KolLinkWc {
     validateTooltipAlign(value) {
         validateTooltipAlign(this, value);
     }
+    validateVariant(value) {
+        validateButtonVariant(this, value);
+    }
     componentWillLoad() {
         this.validateAccessKey(this._accessKey);
         this.validateAriaCurrentValue(this._ariaCurrentValue);
         this.validateAriaDescription(this._ariaDescription);
         this.validateAriaExpanded(this._ariaExpanded);
         this.validateAriaOwns(this._ariaOwns);
+        this.validateCustomClass(this._customClass);
         this.validateDisabled(this._disabled);
         this.validateDownload(this._download);
         this.validateHideLabel(this._hideLabel);
@@ -11113,6 +11130,7 @@ class KolLinkWc {
         this.validateTabIndex(this._tabIndex);
         this.validateTarget(this._target);
         this.validateTooltipAlign(this._tooltipAlign);
+        this.validateVariant(this._variant);
         this.unsubscribeOnLocationChange = onLocationChange((location) => {
             this.state._ariaCurrent = location === this.state._href ? this.state._ariaCurrentValue : undefined;
         });
@@ -11129,6 +11147,7 @@ class KolLinkWc {
         "_ariaDescription": ["validateAriaDescription"],
         "_ariaExpanded": ["validateAriaExpanded"],
         "_ariaOwns": ["validateAriaOwns"],
+        "_customClass": ["validateCustomClass"],
         "_disabled": ["validateDisabled"],
         "_download": ["validateDownload"],
         "_hideLabel": ["validateHideLabel"],
@@ -11140,7 +11159,8 @@ class KolLinkWc {
         "_shortKey": ["validateShortKey"],
         "_tabIndex": ["validateTabIndex"],
         "_target": ["validateTarget"],
-        "_tooltipAlign": ["validateTooltipAlign"]
+        "_tooltipAlign": ["validateTooltipAlign"],
+        "_variant": ["validateVariant"]
     }; }
     static get cmpMeta() { return {
         "$flags$": 4,
@@ -11151,6 +11171,7 @@ class KolLinkWc {
             "_ariaDescription": [1, "_aria-description"],
             "_ariaExpanded": [4, "_aria-expanded"],
             "_ariaOwns": [1, "_aria-owns"],
+            "_customClass": [1, "_custom-class"],
             "_disabled": [4],
             "_download": [1],
             "_hideLabel": [4, "_hide-label"],
@@ -11163,6 +11184,7 @@ class KolLinkWc {
             "_tabIndex": [2, "_tab-index"],
             "_target": [1],
             "_tooltipAlign": [1, "_tooltip-align"],
+            "_variant": [1],
             "state": [32],
             "kolFocus": [64]
         },
@@ -14336,13 +14358,11 @@ class KolPopoverButton {
         (_b = this.refPopover) === null || _b === void 0 ? void 0 : _b.removeEventListener('beforetoggle', this.handleBeforeToggle.bind(this));
     }
     render() {
-        return (hAsync("div", { key: 'e37abb8082b4a79421acf0d18d54088af227db75', class: "kol-popover-button" }, hAsync(KolButtonWcTag, { key: 'ce7f7a12aa80b3209a213f96f0798f3342821d00', _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, _label: this._label, _name: this._name, _on: Object.assign(Object.assign({}, this._on), { onClick: (event, value) => {
+        return (hAsync("div", { key: 'e37abb8082b4a79421acf0d18d54088af227db75', class: "kol-popover-button" }, hAsync(KolButtonWcTag, { key: 'e20b23b48f106137393b3bc47ea49c2d8b75f83a', _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, _label: this._label, _name: this._name, _on: Object.assign(Object.assign({}, this._on), { onClick: (event, value) => {
                     var _a, _b;
                     this.handleButtonClick();
                     (_b = (_a = this._on) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event, value);
-                } }), _role: this._role, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant, "data-testid": "popover-button", class: clsx('kol-popover-button__button', {
-                [this._variant]: this._variant !== 'custom',
-            }), ref: (element) => (this.refButton = element) }, hAsync("slot", { key: 'a5761c899b808a407bc33d45da89bfdc6b5b7c70', name: "expert", slot: "expert" })), hAsync("div", { key: 'ed889b69d3707834aa1e621d94d1889d277d84d3', ref: (element) => (this.refPopover = element), "data-testid": "popover-content", popover: "auto", id: "popover", class: "kol-popover-button__popover" }, hAsync("slot", { key: '14e8af2ad55b838415564b7a576586435cb54a67' }))));
+                } }), _role: this._role, _shortKey: this._shortKey, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant, "data-testid": "popover-button", class: clsx('kol-popover-button__button'), ref: (element) => (this.refButton = element) }, hAsync("slot", { key: '4d0e91ca18454baa0dbbf215dfef99ab2c6a1884', name: "expert", slot: "expert" })), hAsync("div", { key: 'bc2ec76aa27e820cc1f3ff327a5465b9db402a10', ref: (element) => (this.refPopover = element), "data-testid": "popover-content", popover: "auto", id: "popover", class: "kol-popover-button__popover" }, hAsync("slot", { key: '8f4c33b71619fd768142be64c928111e04889798' }))));
     }
     validatePopoverAlign(value) {
         validatePopoverAlign(this, value);
@@ -15074,6 +15094,8 @@ class KolSingleSelect {
                 this.selectOption(option);
                 (_a = this.refInput) === null || _a === void 0 ? void 0 : _a.focus();
                 this.toggleListbox(event);
+                this._isOpen = false;
+                this._hasOpened = false;
             }, onMouseOver: () => {
                 if (!this.blockSuggestionMouseOver) {
                     this._focusedOptionIndex = index;
@@ -15158,6 +15180,8 @@ class KolSingleSelect {
             case 'NumpadEnter':
             case 'Enter': {
                 this.toggleListbox(event);
+                this._hasOpened = false;
+                this._isOpen = false;
                 break;
             }
             case 'Home': {
@@ -23992,12 +24016,10 @@ class KolSplitButton {
     }
     render() {
         const i18nDropdownLabel = 'kol-split-button-dropdown-label';
-        return (hAsync(Host, { key: 'bf0b8bbd7c2dc4fc85d7277dd92d16e2ce288d76', class: "kol-split-button" }, hAsync("div", { key: '74daf437028dc1c2add23932d7cd52782ccc1e4c', class: "split-button-root" }, hAsync(KolButtonWcTag, { key: 'bbceebf8897931f5bcfe964fffcd574477265162', class: {
+        return (hAsync(Host, { key: 'bf0b8bbd7c2dc4fc85d7277dd92d16e2ce288d76', class: "kol-split-button" }, hAsync("div", { key: '74daf437028dc1c2add23932d7cd52782ccc1e4c', class: "split-button-root" }, hAsync(KolButtonWcTag, { key: '3bf984a61b273d36574f0846a102bc35700c9caf', class: {
                 'main-button': true,
                 button: true,
-                [this._variant]: this._variant !== 'custom',
-                [this._customClass]: this._variant === 'custom' && typeof this._customClass === 'string' && this._customClass.length > 0,
-            }, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }), hAsync("div", { key: '9108c4d0319dd944bfb2ebd9d9c5cf4b6d08112b', class: "horizontal-line" }), hAsync(KolButtonWcTag, { key: '310f0b697003718509adfb6b0b702260856a486c', class: { 'secondary-button': true, [this._variant]: this._variant !== 'custom' }, _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`), _on: this.clickToggleHandler, _variant: this._variant })), hAsync(KolPopoverWcTag, { key: 'f855e820d841dbe82103d882fcd18a904e183a91', _show: this.state._show, _on: { onClose: this.handleOnClose }, _align: "bottom" }, hAsync("slot", { key: '038addd2ccea0fa2d995957ef34805d715f943d1' }))));
+            }, _ariaControls: this._ariaControls, _ariaExpanded: this._ariaExpanded, _ariaSelected: this._ariaSelected, _customClass: this._customClass, _disabled: this._disabled, _icons: this._icons, _hideLabel: this._hideLabel, _label: this._label, _name: this._name, _on: this.clickButtonHandler, _role: this._role, _syncValueBySelector: this._syncValueBySelector, _tabIndex: this._tabIndex, _tooltipAlign: this._tooltipAlign, _type: this._type, _value: this._value, _variant: this._variant }), hAsync("div", { key: 'a3f4b6dbd1a16d95024ab0825dcc5012b5ccd0af', class: "horizontal-line" }), hAsync(KolButtonWcTag, { key: 'd046ecef26cc8872fd17271258fd98b1daafa342', class: { 'secondary-button': true, [this._variant]: this._variant !== 'custom' }, _disabled: this._disabled, _hideLabel: true, _icons: "codicon codicon-triangle-down", _label: this.state._show ? translate(`${i18nDropdownLabel}-close`) : translate(`${i18nDropdownLabel}-open`), _on: this.clickToggleHandler, _variant: this._variant })), hAsync(KolPopoverWcTag, { key: '2b0eeafd1d2f2ef8960b932adb6a34315bce0910', _show: this.state._show, _on: { onClose: this.handleOnClose }, _align: "bottom" }, hAsync("slot", { key: 'f5eba083e4760144334a4ad225086781782f3809' }))));
     }
     async closePopup() {
         this.handleOnClose();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@public-ui/hydrate",
-  "version": "2.2.11-d5dad25b9084a461f833a47372b0ec3c24bc5d73.0",
+  "version": "2.2.11-rc.1",
   "license": "EUPL-1.2",
   "homepage": "https://public-ui.github.io",
   "repository": {
@@ -46,10 +46,10 @@
   ],
   "devDependencies": {
     "rimraf": "6.0.1",
-    "@public-ui/components": "2.2.11-d5dad25b9084a461f833a47372b0ec3c24bc5d73.0"
+    "@public-ui/components": "2.2.11-rc.1"
   },
   "peerDependencies": {
-    "@public-ui/components": "2.2.11-d5dad25b9084a461f833a47372b0ec3c24bc5d73.0"
+    "@public-ui/components": "2.2.11-rc.1"
   },
   "sideEffects": false,
   "type": "commonjs",