@openui5/sap.ui.webc.main 1.98.0 → 1.101.0

package/src/sap/ui/webc/main/thirdparty/ColorPalette.js

@@ -1,4 +1,4 @@
-sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/delegate/ItemNavigation', 'sap/ui/webc/common/thirdparty/base/types/CSSColor', 'sap/ui/webc/common/thirdparty/base/types/ItemNavigationBehavior', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/FeaturesRegistry', './generated/templates/ColorPaletteTemplate.lit', './generated/templates/ColorPaletteDialogTemplate.lit', './ColorPaletteItem', './generated/i18n/i18n-defaults', './generated/themes/ColorPalette.css', './generated/themes/ColorPaletteStaticArea.css'], function (UI5Element, litRender, i18nBundle, ItemNavigation, CSSColor, ItemNavigationBehavior, Device, Keys, FeaturesRegistry, ColorPaletteTemplate_lit, ColorPaletteDialogTemplate_lit, ColorPaletteItem, i18nDefaults, ColorPalette_css, ColorPaletteStaticArea_css) { 'use strict';
+sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/delegate/ItemNavigation', 'sap/ui/webc/common/thirdparty/base/types/CSSColor', 'sap/ui/webc/common/thirdparty/base/types/ItemNavigationBehavior', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/FeaturesRegistry', './generated/templates/ColorPaletteTemplate.lit', './generated/templates/ColorPaletteDialogTemplate.lit', './ColorPaletteItem', './Button', './generated/i18n/i18n-defaults', './generated/themes/ColorPalette.css', './generated/themes/ColorPaletteStaticArea.css'], function (UI5Element, litRender, i18nBundle, ItemNavigation, CSSColor, ItemNavigationBehavior, Device, Keys, FeaturesRegistry, ColorPaletteTemplate_lit, ColorPaletteDialogTemplate_lit, ColorPaletteItem, Button, i18nDefaults, ColorPalette_css, ColorPaletteStaticArea_css) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -70,7 +70,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		}
 		static get dependencies() {
 			const ColorPaletteMoreColors = FeaturesRegistry.getFeature("ColorPaletteMoreColors");
-			return [ColorPaletteItem].concat(ColorPaletteMoreColors ? ColorPaletteMoreColors.dependencies : []);
+			return [ColorPaletteItem, Button].concat(ColorPaletteMoreColors ? ColorPaletteMoreColors.dependencies : []);
 		}
 		static async onDefine() {
 			const ColorPaletteMoreColors = FeaturesRegistry.getFeature("ColorPaletteMoreColors");
@@ -130,18 +130,18 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			});
 		}
 		_onclick(event) {
-			if (event.target.localName === "ui5-color-palette-item") {
+			if (event.target.hasAttribute("ui5-color-palette-item")) {
 				this.selectColor(event.target);
 			}
 		}
 		_onkeyup(event) {
-			if (Keys.isSpace(event) && event.target.localName === "ui5-color-palette-item") {
+			if (Keys.isSpace(event) && event.target.hasAttribute("ui5-color-palette-item")) {
 				event.preventDefault();
 				this.selectColor(event.target);
 			}
 		}
 		_onkeydown(event) {
-			if (Keys.isEnter(event) && event.target.localName === "ui5-color-palette-item") {
+			if (Keys.isEnter(event) && event.target.hasAttribute("ui5-color-palette-item")) {
 				this.selectColor(event.target);
 			}
 		}

package/src/sap/ui/webc/main/thirdparty/ColorPalettePopover.js

@@ -1,4 +1,4 @@
-sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/types/CSSColor', './generated/templates/ColorPalettePopoverTemplate.lit', './generated/themes/ColorPalettePopover.css', './generated/themes/ResponsivePopoverCommon.css', './generated/i18n/i18n-defaults', './Button', './ResponsivePopover', './ColorPalette'], function (UI5Element, litRender, i18nBundle, CSSColor, ColorPalettePopoverTemplate_lit, ColorPalettePopover_css, ResponsivePopoverCommon_css, i18nDefaults, Button, ResponsivePopover, ColorPalette) { 'use strict';
+sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/types/CSSColor', './generated/templates/ColorPalettePopoverTemplate.lit', './generated/themes/ColorPalettePopover.css', './generated/themes/ResponsivePopoverCommon.css', './generated/i18n/i18n-defaults', './Button', './Title', './ResponsivePopover', './ColorPalette'], function (UI5Element, litRender, i18nBundle, CSSColor, ColorPalettePopoverTemplate_lit, ColorPalettePopover_css, ResponsivePopoverCommon_css, i18nDefaults, Button, Title, ResponsivePopover, ColorPalette) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -57,6 +57,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return [
 				ResponsivePopover,
 				Button,
+				Title,
 				ColorPalette,
 			];
 		}
@@ -73,10 +74,14 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		_colorPalette() {
 			return this.responsivePopover.content[0].querySelector("[ui5-color-palette]");
 		}
-		closePopover() {
-			this.responsivePopover.close();
+		showAt(opener) {
+			this._openPopover(opener);
 		}
 		openPopover(opener) {
+			console.warn("The method 'openPopover' is deprecated and will be removed in future, use 'showAt' instead.");
+			this._openPopover(opener);
+		}
+		_openPopover(opener) {
 			this._respPopover();
 			this.responsivePopover.showAt(opener, true);
 			if (this.showDefaultColor) {
@@ -85,6 +90,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				this._colorPalette().focusColorElement(this._colorPalette().colorPaletteNavigationElements[0], this._colorPalette()._itemNavigation);
 			}
 		}
+		closePopover() {
+			this.responsivePopover.close();
+		}
 		onSelectedColor(event) {
 			this.closePopover();
 			this.fireEvent("item-click", event.detail);

package/src/sap/ui/webc/main/thirdparty/ColorPicker.js

@@ -1,4 +1,4 @@
-sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/types/CSSColor', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/Render', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/types/Float', 'sap/ui/webc/common/thirdparty/base/util/ColorConversion', './generated/templates/ColorPickerTemplate.lit', './Input', './Slider', './Label', './generated/themes/ColorPicker.css'], function (UI5Element, CSSColor, Device, Render, litRender, Integer, Float, ColorConversion, ColorPickerTemplate_lit, Input, Slider, Label, ColorPicker_css) { 'use strict';
+sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/types/CSSColor', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/Render', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/types/Float', 'sap/ui/webc/common/thirdparty/base/util/ColorConversion', './generated/templates/ColorPickerTemplate.lit', './Input', './Slider', './Label', './generated/themes/ColorPicker.css'], function (UI5Element, Keys, CSSColor, Device, Render, litRender, Integer, Float, ColorConversion, ColorPickerTemplate_lit, Input, Slider, Label, ColorPicker_css) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -37,6 +37,12 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				type: Integer__default,
 				defaultValue: 0,
 			},
+			_isSelectedColorChanged: {
+				type: Boolean,
+			},
+			 _isHueValueChanged: {
+				type: Boolean,
+			},
 			_wrongHEX: {
 				type: Boolean,
 			},
@@ -190,6 +196,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.selectedHue = event.target.value;
 			this._hue = this.selectedHue;
 			this._setMainColor(this._hue);
+			this._isHueValueChanged = true;
 			const tempColor = this._calculateColorFromCoordinates(this._selectedCoordinates.x + 6.5, this._selectedCoordinates.y + 6.5);
 			if (tempColor) {
 				this._setColor(ColorConversion.HSLToRGB(tempColor));
@@ -201,6 +208,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			if (newValue.length === 3) {
 				newValue = `${newValue[0]}${newValue[0]}${newValue[1]}${newValue[1]}${newValue[2]}${newValue[2]}`;
 			}
+			if (newValue === this.hex) {
+				return;
+			}
 			this.hex = newValue;
 			if (newValue.length !== 6 || !hexRegex.test(newValue)) {
 				this._wrongHEX = true;
@@ -275,13 +285,19 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				x: x - 6.5,
 				y: y - 6.5,
 			};
+			this._isSelectedColorChanged = true;
 			const tempColor = this._calculateColorFromCoordinates(x, y);
 			if (tempColor) {
 				this._setColor(ColorConversion.HSLToRGB(tempColor));
 			}
 		}
+		_onkeydown(event) {
+			if (Keys.isEnter(event)) {
+				this._handleHEXChange(event);
+			}
+		}
 		_calculateColorFromCoordinates(x, y) {
-			const h = Math.round(this._hue / 4.25),
+			const h = this._hue / 4.25,
 				s = 1 - +(Math.round((y / 256) + "e+2") + "e-2"),
 				l = +(Math.round((x / 256) + "e+2") + "e-2");
 			if (!s || !l) {
@@ -322,7 +338,14 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				x: ((Math.round(hslColours.l * 100) * 2.56)) - 6.5,
 				y: (256 - (Math.round(hslColours.s * 100) * 2.56)) - 6.5,
 			};
-			this._hue = this.selectedHue ? this.selectedHue : Math.round(hslColours.h * 4.25);
+			if (this._isSelectedColorChanged) {
+				this._isSelectedColorChanged = false;
+			} else if (this._isHueValueChanged) {
+				this._isHueValueChanged = false;
+				this._hue = this.selectedHue ? this.selectedHue : this._hue;
+			} else {
+				this._hue = Math.round(hslColours.h * 4.25);
+			}
 			this._setMainColor(this._hue);
 		}
 		get inputsDisabled() {

package/src/sap/ui/webc/main/thirdparty/ComboBox.js

@@ -1,4 +1,4 @@
-sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/util/AriaLabelHelper', 'sap/ui/webc/common/thirdparty/base/util/InvisibleMessage', 'sap/ui/webc/common/thirdparty/icons/slim-arrow-down', 'sap/ui/webc/common/thirdparty/icons/decline', 'sap/ui/webc/common/thirdparty/icons/not-editable', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/Keys', './ComboBoxFilters-f59100bd', './generated/i18n/i18n-defaults', './generated/templates/ComboBoxTemplate.lit', './generated/templates/ComboBoxPopoverTemplate.lit', './generated/themes/ComboBox.css', './generated/themes/ComboBoxPopover.css', './generated/themes/ResponsivePopoverCommon.css', './generated/themes/ValueStateMessage.css', './generated/themes/Suggestions.css', './ComboBoxItem', './Icon', './Popover', './ResponsivePopover', './List', './BusyIndicator', './Button', './StandardListItem', './ComboBoxGroupItem'], function (UI5Element, litRender, ValueState, Device, Integer, AriaLabelHelper, announce, slimArrowDown, decline, notEditable, i18nBundle, Keys, ComboBoxFilters, i18nDefaults, ComboBoxTemplate_lit, ComboBoxPopoverTemplate_lit, ComboBox_css, ComboBoxPopover_css, ResponsivePopoverCommon_css, ValueStateMessage_css, Suggestions_css, ComboBoxItem, Icon, Popover, ResponsivePopover, List, BusyIndicator, Button, StandardListItem, ComboBoxGroupItem) { 'use strict';
+sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/util/AriaLabelHelper', 'sap/ui/webc/common/thirdparty/base/util/InvisibleMessage', 'sap/ui/webc/common/thirdparty/icons/slim-arrow-down', 'sap/ui/webc/common/thirdparty/icons/decline', 'sap/ui/webc/common/thirdparty/icons/not-editable', 'sap/ui/webc/common/thirdparty/icons/error', 'sap/ui/webc/common/thirdparty/icons/alert', 'sap/ui/webc/common/thirdparty/icons/sys-enter-2', 'sap/ui/webc/common/thirdparty/icons/information', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/Keys', './_chunks/ComboBoxFilters', './generated/i18n/i18n-defaults', './generated/templates/ComboBoxTemplate.lit', './generated/templates/ComboBoxPopoverTemplate.lit', './generated/themes/ComboBox.css', './generated/themes/ComboBoxPopover.css', './generated/themes/ResponsivePopoverCommon.css', './generated/themes/ValueStateMessage.css', './generated/themes/Suggestions.css', './ComboBoxItem', './Icon', './Popover', './ResponsivePopover', './List', './BusyIndicator', './Button', './StandardListItem', './ComboBoxGroupItem', './GroupHeaderListItem'], function (UI5Element, litRender, ValueState, Device, Integer, AriaLabelHelper, announce, slimArrowDown, decline, notEditable, error, alert, sysEnter2, information, i18nBundle, Keys, ComboBoxFilters, i18nDefaults, ComboBoxTemplate_lit, ComboBoxPopoverTemplate_lit, ComboBox_css, ComboBoxPopover_css, ResponsivePopoverCommon_css, ValueStateMessage_css, Suggestions_css, ComboBoxItem, Icon, Popover, ResponsivePopover, List, BusyIndicator, Button, StandardListItem, ComboBoxGroupItem, GroupHeaderListItem) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -166,7 +166,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				event.stopImmediatePropagation();
 				return;
 			}
-			if (!this.shadowRoot.contains(event.relatedTarget)) {
+			if (!this.shadowRoot.contains(event.relatedTarget) && (this.staticAreaItem !== event.relatedTarget)) {
 				this.focused = false;
 				!Device.isPhone() && this._closeRespPopover(event);
 			}
@@ -217,6 +217,8 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return staticAreaItem.querySelector(".ui5-valuestatemessage-popover");
 		}
 		_resetFilter() {
+			this._userTypedValue = null;
+			this.inner.setSelectionRange(0, this.value.length);
 			this._filteredItems = this._filterItems("");
 			this._selectMatchingItem();
 		}
@@ -268,28 +270,24 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				return item;
 			});
 		}
-		async handleArrowKeyPress(event) {
-			if (this.readonly || !this._filteredItems.length) {
+		handleNavKeyPress(event) {
+			if (this.focused && (Keys.isHome(event) || Keys.isEnd(event)) && this.value) {
 				return;
 			}
 			const isOpen = this.open;
-			const isArrowDown = Keys.isDown(event);
-			const isArrowUp = Keys.isUp(event);
 			const currentItem = this._filteredItems.find(item => {
 				return isOpen ? item.focused : item.selected;
 			});
 			const indexOfItem = this._filteredItems.indexOf(currentItem);
 			event.preventDefault();
-			if ((this.focused === true && isArrowUp && isOpen) || (this._filteredItems.length - 1 === indexOfItem && isArrowDown)) {
+			if (this.focused && isOpen && (Keys.isUp(event) || Keys.isPageUp(event) || Keys.isPageDown(event))) {
 				return;
 			}
-			this._isKeyNavigation = true;
-			if (isArrowDown) {
-				this._handleArrowDown(event, indexOfItem);
-			}
-			if (isArrowUp) {
-				this._handleArrowUp(event, indexOfItem);
+			if (this._filteredItems.length - 1 === indexOfItem && Keys.isDown(event)) {
+				return;
 			}
+			this._isKeyNavigation = true;
+			this[`_handle${event.key}`](event, indexOfItem);
 		}
 		_handleItemNavigation(event, indexOfItem, isForward) {
 			const isOpen = this.open;
@@ -302,7 +300,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this._clearFocus();
 			if (isOpen) {
 				this._itemFocused = true;
-				this.value = isGroupItem ? this.filterValue : currentItem.text;
+				this.value = isGroupItem ? "" : currentItem.text;
 				this.focused = false;
 				currentItem.focused = true;
 			} else {
@@ -317,7 +315,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			}
 			this._announceSelectedItem(indexOfItem);
 			const item = this._getFirstMatchingItem(this.value);
-			this._applyAtomicValueAndSelection(item, "", true);
+			this._applyAtomicValueAndSelection(item, (this.open ? this._userTypedValue : null), true);
 			if ((item && !item.selected)) {
 				this.fireEvent("selection-change", {
 					item,
@@ -359,12 +357,47 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			indexOfItem = !isOpen && this.hasValueState && indexOfItem === -1 ? 0 : indexOfItem;
 			this._handleItemNavigation(event, --indexOfItem, false );
 		}
+		_handlePageUp(event, indexOfItem) {
+			const isProposedIndexValid = indexOfItem - ComboBox.SKIP_ITEMS_SIZE > -1;
+			indexOfItem = isProposedIndexValid ? indexOfItem - ComboBox.SKIP_ITEMS_SIZE : 0;
+			const shouldMoveForward = this._filteredItems[indexOfItem].isGroupItem && !this.open;
+			if (!isProposedIndexValid && this.hasValueStateText && this.open) {
+				this._clearFocus();
+				this._itemFocused = false;
+				this._isValueStateFocused = true;
+				return;
+			}
+			this._handleItemNavigation(event, indexOfItem, shouldMoveForward);
+		}
+		_handlePageDown(event, indexOfItem) {
+			const itemsLength = this._filteredItems.length;
+			const isProposedIndexValid = indexOfItem + ComboBox.SKIP_ITEMS_SIZE < itemsLength;
+			indexOfItem = isProposedIndexValid ? indexOfItem + ComboBox.SKIP_ITEMS_SIZE : itemsLength - 1;
+			const shouldMoveForward = this._filteredItems[indexOfItem].isGroupItem && !this.open;
+			this._handleItemNavigation(event, indexOfItem, shouldMoveForward);
+		}
+		_handleHome(event, indexOfItem) {
+			const shouldMoveForward = this._filteredItems[0].isGroupItem && !this.open;
+			if (this.hasValueStateText && this.open) {
+				this._clearFocus();
+				this._itemFocused = false;
+				this._isValueStateFocused = true;
+				return;
+			}
+			this._handleItemNavigation(event, 0, shouldMoveForward);
+		}
+		_handleEnd(event, indexOfItem) {
+			this._handleItemNavigation(event, this._filteredItems.length - 1, true );
+		}
+		_keyup(event) {
+			this._userTypedValue = this.value.substring(0, this.inner.selectionStart);
+		}
 		_keydown(event) {
-			const isArrowKey = Keys.isDown(event) || Keys.isUp(event);
+			const isNavKey = Keys.isDown(event) || Keys.isUp(event) || Keys.isPageUp(event) || Keys.isPageDown(event) || Keys.isHome(event) || Keys.isEnd(event);
 			this._autocomplete = !(Keys.isBackSpace(event) || Keys.isDelete(event));
 			this._isKeyNavigation = false;
-			if (isArrowKey) {
-				this.handleArrowKeyPress(event);
+			if (isNavKey && !this.readonly && this._filteredItems.length) {
+				this.handleNavKeyPress(event);
 			}
 			if (Keys.isEnter(event)) {
 				this._fireChangeEvent();
@@ -390,6 +423,8 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 					this._itemFocused = true;
 					selectedItem.focused = true;
 					this.focused = false;
+				} else if (this.open && this._filteredItems.length) {
+					this._handleItemNavigation(event, 0, true );
 				} else {
 					this.focused = true;
 				}
@@ -445,6 +480,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			const value = (item && item.text) || "";
 			this.inner.value = value;
 			if (highlightValue) {
+				filterValue = filterValue || "";
 				this.inner.setSelectionRange(filterValue.length, value.length);
 			}
 			this.value = value;
@@ -542,12 +578,15 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			};
 		}
 		get shouldOpenValueStateMessagePopover() {
-			return this.focused && this.hasValueStateText && !this._iconPressed
+			return this.focused && !this.readonly && this.hasValueStateText && !this._iconPressed
 				&& !this.open && !this._isPhone;
 		}
 		get shouldDisplayDefaultValueStateMessage() {
 			return !this.valueStateMessage.length && this.hasValueStateText;
 		}
+		get _valueStatePopoverHorizontalAlign() {
+			return this.effectiveDir !== "rtl" ? "Left" : "Right";
+		}
 		get _valueStateMessageIcon() {
 			const iconPerValueState = {
 				Error: "error",
@@ -578,6 +617,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				BusyIndicator,
 				Button,
 				StandardListItem,
+				GroupHeaderListItem,
 				Popover,
 				ComboBoxGroupItem,
 			];
@@ -613,6 +653,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			};
 		}
 	}
+	ComboBox.SKIP_ITEMS_SIZE = 10;
 	ComboBox.define();
 
 	return ComboBox;

package/src/sap/ui/webc/main/thirdparty/ComboBoxFilters.js

@@ -1,4 +1,4 @@
-sap.ui.define(['exports', './ComboBoxFilters-f59100bd'], function (exports, ComboBoxFilters) { 'use strict';
+sap.ui.define(['exports', './_chunks/ComboBoxFilters'], function (exports, ComboBoxFilters) { 'use strict';
 
 
 

package/src/sap/ui/webc/main/thirdparty/DateComponentBase.js

@@ -73,19 +73,17 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.getFormat().format(localDate, true);
 		}
 		getFormat() {
-			let dateFormat;
-			if (this._isPattern) {
-				dateFormat = DateFormat__default.getInstance({
+			return this._isPattern
+				? DateFormat__default.getInstance({
+					strictParsing: true,
 					pattern: this._formatPattern,
 					calendarType: this._primaryCalendarType,
-				});
-			} else {
-				dateFormat = DateFormat__default.getInstance({
+				})
+				: DateFormat__default.getInstance({
+					strictParsing: true,
 					style: this._formatPattern,
 					calendarType: this._primaryCalendarType,
 				});
-			}
-			return dateFormat;
 		}
 		static async onDefine() {
 			[DateComponentBase.i18nBundle] = await Promise.all([

package/src/sap/ui/webc/main/thirdparty/DatePicker.js

@@ -1,4 +1,4 @@
-sap.ui.define(['sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/webc/common/thirdparty/localization/dates/CalendarDate', 'sap/ui/webc/common/thirdparty/localization/dates/modifyDateBy', 'sap/ui/webc/common/thirdparty/localization/dates/getRoundedTimestamp', 'sap/ui/webc/common/thirdparty/localization/dates/getTodayUTCTimestamp', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/util/AriaLabelHelper', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/icons/appointment-2', 'sap/ui/webc/common/thirdparty/icons/decline', './generated/i18n/i18n-defaults', './DateComponentBase', './Icon', './Button', './ResponsivePopover', './Calendar', './CalendarDate', './Input', './types/InputType', './generated/templates/DatePickerTemplate.lit', './generated/templates/DatePickerPopoverTemplate.lit', 'sap/ui/webc/common/thirdparty/localization/features/calendar/Gregorian', './generated/themes/DatePicker.css', './generated/themes/DatePickerPopover.css', './generated/themes/ResponsivePopoverCommon.css'], function (FeaturesRegistry, CalendarDate, modifyDateBy, getRoundedTimestamp, getTodayUTCTimestamp, ValueState, AriaLabelHelper, Keys, Device, appointment2, decline, i18nDefaults, DateComponentBase, Icon, Button, ResponsivePopover, Calendar, CalendarDate$1, Input, InputType, DatePickerTemplate_lit, DatePickerPopoverTemplate_lit, Gregorian, DatePicker_css, DatePickerPopover_css, ResponsivePopoverCommon_css) { 'use strict';
+sap.ui.define(['sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/webc/common/thirdparty/localization/dates/CalendarDate', 'sap/ui/webc/common/thirdparty/localization/dates/modifyDateBy', 'sap/ui/webc/common/thirdparty/localization/dates/getRoundedTimestamp', 'sap/ui/webc/common/thirdparty/localization/dates/getTodayUTCTimestamp', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/util/AriaLabelHelper', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/icons/appointment-2', 'sap/ui/webc/common/thirdparty/icons/decline', './types/HasPopup', './generated/i18n/i18n-defaults', './DateComponentBase', './Icon', './Button', './ResponsivePopover', './Calendar', './CalendarDate', './Input', './types/InputType', './generated/templates/DatePickerTemplate.lit', './generated/templates/DatePickerPopoverTemplate.lit', 'sap/ui/webc/common/thirdparty/localization/features/calendar/Gregorian', './generated/themes/DatePicker.css', './generated/themes/DatePickerPopover.css', './generated/themes/ResponsivePopoverCommon.css'], function (FeaturesRegistry, CalendarDate, modifyDateBy, getRoundedTimestamp, getTodayUTCTimestamp, ValueState, AriaLabelHelper, Keys, Device, appointment2, decline, HasPopup, i18nDefaults, DateComponentBase, Icon, Button, ResponsivePopover, Calendar, CalendarDate$1, Input, InputType, DatePickerTemplate_lit, DatePickerPopoverTemplate_lit, Gregorian, DatePicker_css, DatePickerPopover_css, ResponsivePopoverCommon_css) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -125,6 +125,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/we
 			} else if (this.name) {
 				console.warn(`In order for the "name" property to have effect, you should also: import "@ui5/webcomponents/dist/features/InputElementsFormSupport.js";`);
 			}
+			this.value = this.normalizeValue(this.value);
 			this.liveValue = this.value;
 		}
 		get _calendarSelectionMode() {
@@ -201,6 +202,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/we
 				return;
 			}
 			if (updateValue) {
+				this._getInput().getInputDOMRef().then(innnerInput => {
+					innnerInput.value = value;
+				});
 				this.value = value;
 				this._updateValueState();
 			}
@@ -282,11 +286,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/we
 		get accInfo() {
 			return {
 				"ariaRoledescription": this.dateAriaDescription,
-				"ariaHasPopup": "true",
+				"ariaHasPopup": HasPopup.Grid,
 				"ariaAutoComplete": "none",
-				"role": "combobox",
 				"ariaControls": `${this._id}-responsive-popover`,
-				"ariaExpanded": this.isOpen(),
 				"ariaRequired": this.required,
 				"ariaLabel": AriaLabelHelper.getEffectiveAriaLabelText(this),
 			};

package/src/sap/ui/webc/main/thirdparty/DateRangePicker.js

@@ -25,6 +25,16 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Render', 'sap/ui/webc/common/
 		static get styles() {
 			return [DatePicker.styles, DateRangePicker_css];
 		}
+		constructor() {
+			super();
+			this._prevDelimiter = null;
+		}
+		get dateValue() {
+			return null;
+		}
+		get dateValueUTC() {
+			return null;
+		}
 		get _startDateTimestamp() {
 			return this._extractFirstTimestamp(this.value);
 		}
@@ -131,7 +141,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Render', 'sap/ui/webc/common/
 		}
 		_splitValueByDelimiter(value) {
 			const valuesArray = [];
-			const partsArray = value.split(this._effectiveDelimiter);
+			const partsArray = value.split(this._prevDelimiter || this._effectiveDelimiter);
 			valuesArray[0] = partsArray.slice(0, partsArray.length / 2).join(this._effectiveDelimiter);
 			valuesArray[1] = partsArray.slice(partsArray.length / 2).join(this._effectiveDelimiter);
 			return valuesArray;
@@ -154,6 +164,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Render', 'sap/ui/webc/common/
 			return undefined;
 		}
 		_buildValue(firstDateTimestamp, lastDateTimestamp) {
+			this._prevDelimiter = this._effectiveDelimiter;
 			if (firstDateTimestamp) {
 				const firstDateString = this._getStringFromTimestamp(firstDateTimestamp * 1000);
 				if (!lastDateTimestamp) {

package/src/sap/ui/webc/main/thirdparty/Dialog.js

@@ -20,9 +20,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/
 			headerText: {
 				type: String,
 			},
-			accessibleName: {
-				type: String,
-			},
 			stretch: {
 				type: Boolean,
 			},
@@ -77,18 +74,11 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/
 		}
 		get _ariaLabelledBy() {
 			let ariaLabelledById;
-			if (this.headerText !== "" && !this.accessibleName) {
+			if (this.headerText !== "" && !this._ariaLabel) {
 				ariaLabelledById = "ui5-popup-header-text";
 			}
 			return ariaLabelledById;
 		}
-		get _ariaLabel() {
-			let ariaLabel;
-			if (this.header.length > 0 && !!this.accessibleName) {
-				ariaLabel = this.accessibleName;
-			}
-			return this.accessibleName ? this.accessibleName : ariaLabel;
-		}
 		get _ariaModal() {
 			return true;
 		}
@@ -104,6 +94,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/
 		get _headerTabIndex() {
 			return this._movable ? "0" : undefined;
 		}
+		get _showResizeHandle() {
+			return this.resizable && this.onDesktop;
+		}
 		_show() {
 			super._show();
 			this._center();
@@ -112,23 +105,36 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/
 			this._isRTL = this.effectiveDir === "rtl";
 			this.onPhone = Device.isPhone();
 			this.onDesktop = Device.isDesktop();
-			this._detachResizeHandlers();
 		}
 		onAfterRendering() {
+			if (!this.isOpen() && this.open) {
+				this.show();
+			} else if (this.isOpen() && !this.open) {
+				this.close();
+			}
+		}
+		onEnterDOM() {
+			super.onEnterDOM();
 			this._attachResizeHandlers();
 		}
 		onExitDOM() {
 			super.onExitDOM();
 			this._detachResizeHandlers();
 		}
+		_resize() {
+			super._resize();
+			if (this._resizeHandlersAttached) {
+				this._center();
+			}
+		}
 		_attachResizeHandlers() {
-			ResizeHandler__default.register(this, this._screenResizeHandler);
-			ResizeHandler__default.register(document.body, this._screenResizeHandler);
-			this._resizeHandlersAttached = true;
+			if (!this._resizeHandlersAttached) {
+				ResizeHandler__default.register(document.body, this._screenResizeHandler);
+				this._resizeHandlersAttached = true;
+			}
 		}
 		_detachResizeHandlers() {
 			if (this._resizeHandlersAttached) {
-				ResizeHandler__default.deregister(this, this._screenResizeHandler);
 				ResizeHandler__default.deregister(document.body, this._screenResizeHandler);
 				this._resizeHandlersAttached = false;
 			}

package/src/sap/ui/webc/main/thirdparty/FileUploader.js

@@ -1,4 +1,4 @@
-sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/Keys', './generated/i18n/i18n-defaults', './Input', './Popover', './generated/templates/FileUploaderTemplate.lit', './generated/templates/FileUploaderPopoverTemplate.lit', './generated/themes/FileUploader.css', './generated/themes/ResponsivePopoverCommon.css', './generated/themes/ValueStateMessage.css'], function (UI5Element, ValueState, FeaturesRegistry, litRender, i18nBundle, Keys, i18nDefaults, Input, Popover, FileUploaderTemplate_lit, FileUploaderPopoverTemplate_lit, FileUploader_css, ResponsivePopoverCommon_css, ValueStateMessage_css) { 'use strict';
+sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/Keys', './generated/i18n/i18n-defaults', './Input', './Popover', './Icon', './generated/templates/FileUploaderTemplate.lit', './generated/templates/FileUploaderPopoverTemplate.lit', './generated/themes/FileUploader.css', './generated/themes/ResponsivePopoverCommon.css', './generated/themes/ValueStateMessage.css'], function (UI5Element, ValueState, FeaturesRegistry, litRender, i18nBundle, Keys, i18nDefaults, Input, Popover, Icon, FileUploaderTemplate_lit, FileUploaderPopoverTemplate_lit, FileUploader_css, ResponsivePopoverCommon_css, ValueStateMessage_css) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -275,7 +275,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.shadowRoot.querySelector(".ui5-file-uploader-input");
 		}
 		static get dependencies() {
-			return [Input, Popover];
+			return [Input, Popover, Icon];
 		}
 		static async onDefine() {
 			FileUploader.i18nBundle = await i18nBundle.getI18nBundle("@ui5/webcomponents");

package/src/sap/ui/webc/main/thirdparty/Icon.js

@@ -26,7 +26,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			showTooltip: {
 				type: Boolean,
 			},
-			role: {
+			accessibleRole: {
 				type: String,
 			},
 			ariaHidden: {
@@ -72,12 +72,12 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		static async onDefine() {
 			this.createGlobalStyle();
 		}
-		_onfocusin(event) {
+		_onFocusInHandler(event) {
 			if (this.interactive) {
 				this.focused = true;
 			}
 		}
-		_onfocusout(event) {
+		_onFocusOutHandler(event) {
 			this.focused = false;
 		}
 		_onkeydown(event) {
@@ -119,14 +119,14 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.ariaHidden;
 		}
 		get tabIndex() {
-			return this.interactive ? "0" : "-1";
+			return this.interactive ? "0" : undefined;
 		}
 		get isDecorative() {
 			return this.effectiveAccessibleRole === PRESENTATION_ROLE;
 		}
 		get effectiveAccessibleRole() {
-			if (this.role) {
-				return this.role;
+			if (this.accessibleRole) {
+				return this.accessibleRole;
 			}
 			if (this.interactive) {
 				return "button";
@@ -172,6 +172,8 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.ltr = iconData.ltr;
 			this.packageName = iconData.packageName;
 			this._onclick = this.interactive ? this._onClickHandler.bind(this) : undefined;
+			this._onfocusout = this.interactive ? this._onFocusOutHandler.bind(this) : undefined;
+			this._onfocusin = this.interactive ? this._onFocusInHandler.bind(this) : undefined;
 			if (this.accessibleName) {
 				this.effectiveAccessibleName = this.accessibleName;
 			} else if (this.accData) {