@openui5/sap.ui.webc.main 1.96.1 → 1.97.1

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

@@ -26,20 +26,17 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/i18nBundle', './ListItemBase'
 		static get styles() {
 			return [ListItemBase.styles, GroupHeaderListItem_css];
 		}
-		constructor() {
-			super();
-			this.i18nBundle = i18nBundle.getI18nBundle("@ui5/webcomponents");
-		}
 		get group() {
 			return true;
 		}
 		get groupHeaderText() {
-			return this.i18nBundle.getText(i18nDefaults.GROUP_HEADER_TEXT);
+			return GroupHeaderListItem.i18nBundle.getText(i18nDefaults.GROUP_HEADER_TEXT);
+		}
+		get ariaLabelText() {
+			return [this.textContent, this.accessibleName].filter(Boolean).join(" ");
 		}
 		static async onDefine() {
-			await Promise.all([
-				i18nBundle.fetchI18nBundle("@ui5/webcomponents"),
-			]);
+			GroupHeaderListItem.i18nBundle = await i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 	}
 	GroupHeaderListItem.define();

package/src/sap/ui/webc/main/thirdparty/Icon.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/asset-registries/Icons', 'sap/ui/webc/common/thirdparty/base/util/createStyleInHead', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/asset-registries/i18n', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/isLegacyBrowser', './generated/templates/IconTemplate.lit', './generated/themes/Icon.css'], function (UI5Element, litRender, Icons, createStyleInHead, i18nBundle, i18n, Keys, isLegacyBrowser, IconTemplate_lit, Icon_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/asset-registries/Icons', 'sap/ui/webc/common/thirdparty/base/util/createStyleInHead', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/isLegacyBrowser', './generated/templates/IconTemplate.lit', './generated/themes/Icon.css'], function (UI5Element, litRender, Icons, createStyleInHead, i18nBundle, Keys, isLegacyBrowser, IconTemplate_lit, Icon_css) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -8,6 +8,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 	var isLegacyBrowser__default = /*#__PURE__*/_interopDefaultLegacy(isLegacyBrowser);
 
 	const ICON_NOT_FOUND = "ICON_NOT_FOUND";
+	const PRESENTATION_ROLE = "presentation";
 	const metadata = {
 		tag: "ui5-icon",
 		languageAware: true,
@@ -94,11 +95,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				this.fireEvent("click");
 			}
 		}
-		_onclick(event) {
-			if (this.interactive) {
-				event.stopPropagation();
-				this.fireEvent("click");
-			}
+		_onClickHandler(event) {
+			event.stopPropagation();
+			this.fireEvent("click");
 		}
 		get _dir() {
 			if (!this.effectiveDir) {
@@ -111,6 +110,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		}
 		get effectiveAriaHidden() {
 			if (this.ariaHidden === "") {
+				if (this.isDecorative) {
+					return true;
+				}
 				return;
 			}
 			return this.ariaHidden;
@@ -118,6 +120,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		get tabIndex() {
 			return this.interactive ? "0" : "-1";
 		}
+		get isDecorative() {
+			return this.effectiveAccessibleRole === PRESENTATION_ROLE;
+		}
 		get effectiveAccessibleRole() {
 			if (this.role) {
 				return this.role;
@@ -125,7 +130,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			if (this.interactive) {
 				return "button";
 			}
-			return this.effectiveAccessibleName ? "img" : "presentation";
+			return this.effectiveAccessibleName ? "img" : PRESENTATION_ROLE;
 		}
 		static createGlobalStyle() {
 			if (isLegacyBrowser__default()) {
@@ -165,13 +170,11 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.accData = iconData.accData;
 			this.ltr = iconData.ltr;
 			this.packageName = iconData.packageName;
+			this._onclick = this.interactive ? this._onClickHandler.bind(this) : undefined;
 			if (this.accessibleName) {
 				this.effectiveAccessibleName = this.accessibleName;
 			} else if (this.accData) {
-				if (!i18n.getI18nBundleData(this.packageName)) {
-					await i18n.fetchI18nBundle(this.packageName);
-				}
-				const i18nBundle$1 = i18nBundle.getI18nBundle(this.packageName);
+				const i18nBundle$1 = await i18nBundle.getI18nBundle(this.packageName);
 				this.effectiveAccessibleName = i18nBundle$1.getText(this.accData) || undefined;
 			}
 		}

package/src/sap/ui/webc/main/thirdparty/Input.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/delegate/ResizeHandler', 'sap/ui/webc/common/thirdparty/base/Render', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/util/AriaLabelHelper', 'sap/ui/webc/common/thirdparty/base/util/Caret', 'sap/ui/webc/common/thirdparty/icons/decline', './types/InputType', './Popover', './generated/templates/InputTemplate.lit', './generated/templates/InputPopoverTemplate.lit', './generated/i18n/i18n-defaults', './generated/themes/Input.css', './generated/themes/ResponsivePopoverCommon.css', './generated/themes/ValueStateMessage.css'], function (UI5Element, litRender, ResizeHandler, Render, Device, ValueState, FeaturesRegistry, Keys, Integer, i18nBundle, AriaLabelHelper, Caret, decline, InputType, Popover, InputTemplate_lit, InputPopoverTemplate_lit, i18nDefaults, Input_css, ResponsivePopoverCommon_css, ValueStateMessage_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/delegate/ResizeHandler', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/common/thirdparty/base/types/ValueState', 'sap/ui/webc/common/thirdparty/base/FeaturesRegistry', 'sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/util/AriaLabelHelper', 'sap/ui/webc/common/thirdparty/base/util/Caret', 'sap/ui/webc/common/thirdparty/icons/decline', './types/InputType', './Popover', './generated/templates/InputTemplate.lit', './generated/templates/InputPopoverTemplate.lit', './generated/i18n/i18n-defaults', './generated/themes/Input.css', './generated/themes/ResponsivePopoverCommon.css', './generated/themes/ValueStateMessage.css', './generated/themes/Suggestions.css'], function (UI5Element, litRender, ResizeHandler, Device, ValueState, FeaturesRegistry, Keys, Integer, i18nBundle, AriaLabelHelper, Caret, decline, InputType, Popover, InputTemplate_lit, InputPopoverTemplate_lit, i18nDefaults, Input_css, ResponsivePopoverCommon_css, ValueStateMessage_css, Suggestions_css) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -74,6 +74,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			focused: {
 				type: Boolean,
 			},
+			open: {
+				type: Boolean,
+			},
 			_input: {
 				type: Object,
 			},
@@ -137,7 +140,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return Input_css;
 		}
 		static get staticAreaStyles() {
-			return [ResponsivePopoverCommon_css, ValueStateMessage_css];
+			return [ResponsivePopoverCommon_css, ValueStateMessage_css, Suggestions_css];
 		}
 		constructor() {
 			super();
@@ -149,6 +152,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.previousValue = undefined;
 			this.firstRendering = true;
 			this.highlightValue = "";
+			this.lastConfirmedValue = "";
 			this._backspaceKeyDown = false;
 			this.EVENT_CHANGE = "change";
 			this.EVENT_INPUT = "input";
@@ -156,7 +160,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.ACTION_ENTER = "enter";
 			this.ACTION_USER_INPUT = "input";
 			this.suggestionsTexts = [];
-			this.i18nBundle = i18nBundle.getI18nBundle("@ui5/webcomponents");
 			this._handleResizeBound = this._handleResize.bind(this);
 		}
 		onEnterDOM() {
@@ -170,6 +173,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				this.enableSuggestions();
 				this.suggestionsTexts = this.Suggestions.defaultSlotProperties(this.highlightValue);
 			}
+			this.open = this.open && (!!this.suggestionItems.length || this._isPhone);
 			const FormSupport = FeaturesRegistry.getFeature("FormSupport");
 			if (FormSupport) {
 				FormSupport.syncNativeHiddenInput(this);
@@ -178,21 +182,17 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			}
 		}
 		async onAfterRendering() {
-			if (!this.firstRendering && !Device.isPhone() && this.Suggestions) {
-				const shouldOpenSuggestions = this.shouldOpenSuggestions();
-				this.Suggestions.toggle(shouldOpenSuggestions, {
-					preventFocusRestore: !this.hasSuggestionItemSelected,
+			if (this.Suggestions) {
+				this.Suggestions.toggle(this.open, {
+					preventFocusRestore: true,
 				});
-				await Render.renderFinished();
 				this._listWidth = await this.Suggestions._getListWidth();
-				if (!Device.isPhone() && shouldOpenSuggestions) {
-					(await this.getInputDOMRef()).focus();
-				}
 			}
-			if (!this.firstRendering && this.hasValueStateMessage) {
-				this.toggle(this.shouldDisplayOnlyValueStateMessage);
+			if (this.shouldDisplayOnlyValueStateMessage) {
+				this.openPopover();
+			} else {
+				this.closePopover();
 			}
-			this.firstRendering = false;
 		}
 		_onkeydown(event) {
 			if (Keys.isUp(event)) {
@@ -250,12 +250,18 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			const itemPressed = !!(this.Suggestions && this.Suggestions.onEnter(event));
 			if (!itemPressed) {
 				this.fireEventByAction(this.ACTION_ENTER);
+				this.lastConfirmedValue = this.value;
 			}
 		}
 		_handleEscape() {
 			if (this.showSuggestions && this.Suggestions && this.Suggestions._isItemOnTarget()) {
 				this.value = this.valueBeforeItemPreview;
 				this.suggestionSelectionCanceled = true;
+				this.open = false;
+			} else if (this.Suggestions && this.Suggestions.isOpened()) {
+				this.closePopover();
+			} else {
+				this.value = this.lastConfirmedValue ? this.lastConfirmedValue : this.previousValue;
 			}
 		}
 		async _onfocusin(event) {
@@ -278,12 +284,14 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			}
 			this.closePopover();
 			this.previousValue = "";
+			this.lastConfirmedValue = "";
 			this.focused = false;
+			this.open = false;
 		}
 		_click(event) {
 			if (Device.isPhone() && !this.readonly && this.Suggestions) {
-				this.Suggestions.open();
-				this.isRespPopoverOpen = true;
+				this.blur();
+				this.open = true;
 			}
 		}
 		_handleChange(event) {
@@ -325,6 +333,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.hasSuggestionItemSelected = false;
 			if (this.Suggestions) {
 				this.Suggestions.updateSelectedItemPosition(null);
+				if (!this._isPhone) {
+					this.open = !!inputDomRef.value;
+				}
 			}
 		}
 		_handleResize() {
@@ -342,13 +353,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.announceSelectedItem();
 			if (Device.isPhone()) {
 				this.blur();
-			}
-		}
-		toggle(isToggled) {
-			if (isToggled && !this.isRespPopoverOpen) {
-				this.openPopover();
-			} else {
-				this.closePopover();
+				this.focused = false;
 			}
 		}
 		isValueStateOpened() {
@@ -398,6 +403,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			if (fireInput) {
 				this.value = itemText;
 				this.valueBeforeItemSelection = itemText;
+				this.lastConfirmedValue = itemText;
 				this.fireEvent(this.EVENT_INPUT);
 				this.fireEvent(this.EVENT_CHANGE);
 				this._changeFired = true;
@@ -459,8 +465,8 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return "";
 		}
 		async getInputDOMRef() {
-			if (Device.isPhone() && this.Suggestions && this.suggestionItems.length) {
-				await this.Suggestions._respPopover();
+			if (Device.isPhone() && this.Suggestions) {
+				await this.Suggestions._getSuggestionPopover();
 				return this.Suggestions && this.Suggestions.responsivePopover.querySelector(".ui5-input-inner-phone");
 			}
 			return this.nativeInput;
@@ -517,12 +523,11 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		onOpen() {}
 		onClose() {}
 		valueStateTextMappings() {
-			const i18nBundle = this.i18nBundle;
 			return {
-				"Success": i18nBundle.getText(i18nDefaults.VALUE_STATE_SUCCESS),
-				"Information": i18nBundle.getText(i18nDefaults.VALUE_STATE_INFORMATION),
-				"Error": i18nBundle.getText(i18nDefaults.VALUE_STATE_ERROR),
-				"Warning": i18nBundle.getText(i18nDefaults.VALUE_STATE_WARNING),
+				"Success": Input.i18nBundle.getText(i18nDefaults.VALUE_STATE_SUCCESS),
+				"Information": Input.i18nBundle.getText(i18nDefaults.VALUE_STATE_INFORMATION),
+				"Error": Input.i18nBundle.getText(i18nDefaults.VALUE_STATE_ERROR),
+				"Warning": Input.i18nBundle.getText(i18nDefaults.VALUE_STATE_WARNING),
 			};
 		}
 		announceSelectedItem() {
@@ -537,7 +542,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.readonly && !this.disabled;
 		}
 		get _headerTitleText() {
-			return this.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_TITLE);
+			return Input.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_TITLE);
 		}
 		get inputType() {
 			return this.type.toLowerCase();
@@ -591,8 +596,13 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		}
 		get classes() {
 			return {
+				popover: {
+					"ui5-suggestions-popover": !this.isPhone && this.showSuggestions,
+					"ui5-suggestions-popover-with-value-state-header": !this.isPhone && this.showSuggestions && this.hasValueStateMessage,
+				},
 				popoverValueState: {
 					"ui5-valuestatemessage-root": true,
+					"ui5-valuestatemessage-header": true,
 					"ui5-responsive-popover-header": !this.isValueStateOpened(),
 					"ui5-valuestatemessage--success": this.valueState === ValueState__default.Success,
 					"ui5-valuestatemessage--error": this.valueState === ValueState__default.Error,
@@ -602,6 +612,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			};
 		}
 		get styles() {
+			const remSizeIxPx = parseInt(getComputedStyle(document.documentElement).fontSize);
 			const stylesObject = {
 				popoverHeader: {
 					"max-width": `${this._inputWidth}px`,
@@ -609,10 +620,10 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				suggestionPopoverHeader: {
 					"display": this._listWidth === 0 ? "none" : "inline-block",
 					"width": `${this._listWidth}px`,
-					"padding": "0.925rem 1rem",
 				},
 				suggestionsPopover: {
-					"max-width": `${this._inputWidth}px`,
+					"min-width": `${this._inputWidth}px`,
+					"max-width": (this._inputWidth / remSizeIxPx) > 40 ? `${this._inputWidth}px` : "40rem",
 				},
 				innerInput: {},
 			};
@@ -628,7 +639,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.getSlottedNodes("valueStateMessage").map(el => el.cloneNode(true));
 		}
 		get shouldDisplayOnlyValueStateMessage() {
-			return this.hasValueStateMessage && !this.shouldOpenSuggestions() && this.focused;
+			return this.hasValueStateMessage && !this.open && this.focused;
 		}
 		get shouldDisplayDefaultValueStateMessage() {
 			return !this.valueStateMessage.length && this.hasValueStateMessage;
@@ -645,17 +656,17 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.valueStateTextMappings()[this.valueState];
 		}
 		get suggestionsText() {
-			return this.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS);
+			return Input.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS);
 		}
 		get availableSuggestionsCount() {
 			if (this.showSuggestions && (this.value || this.Suggestions.isOpened())) {
 				switch (this.suggestionsTexts.length) {
 				case 0:
-					return this.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_NO_HIT);
+					return Input.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_NO_HIT);
 				case 1:
-					return this.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_ONE_HIT);
+					return Input.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_ONE_HIT);
 				default:
-					return this.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_MORE_HITS, this.suggestionsTexts.length);
+					return Input.i18nBundle.getText(i18nDefaults.INPUT_SUGGESTIONS_MORE_HITS, this.suggestionsTexts.length);
 				}
 			}
 			return undefined;
@@ -669,6 +680,20 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		get _placeholder() {
 			return this.placeholder;
 		}
+		get _valueStateInputIcon() {
+			const iconPerValueState = {
+				Error: `<path xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" d="M10 20C4.47715 20 0 15.5228 0 10C0 4.47715 4.47715 0 10 0C15.5228 0 20 4.47715 20 10C20 15.5228 15.5228 20 10 20ZM7.70711 13.7071C7.31658 14.0976 6.68342 14.0976 6.29289 13.7071C5.90237 13.3166 5.90237 12.6834 6.29289 12.2929L8.58579 10L6.29289 7.70711C5.90237 7.31658 5.90237 6.68342 6.29289 6.29289C6.68342 5.90237 7.31658 5.90237 7.70711 6.29289L10 8.58579L12.2929 6.29289C12.6834 5.90237 13.3166 5.90237 13.7071 6.29289C14.0976 6.68342 14.0976 7.31658 13.7071 7.70711L11.4142 10L13.7071 12.2929C14.0976 12.6834 14.0976 13.3166 13.7071 13.7071C13.3166 14.0976 12.6834 14.0976 12.2929 13.7071L10 11.4142L7.70711 13.7071Z" fill="#EE3939"/>`,
+				Warning: `<path xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" d="M11.8619 0.49298C11.6823 0.187541 11.3544 0 11 0C10.6456 0 10.3177 0.187541 10.1381 0.49298L0.138066 17.493C-0.0438112 17.8022 -0.0461447 18.1851 0.13195 18.4965C0.310046 18.8079 0.641283 19 1 19H21C21.3587 19 21.69 18.8079 21.868 18.4965C22.0461 18.1851 22.0438 17.8022 21.8619 17.493L11.8619 0.49298ZM11 6C11.5523 6 12 6.44772 12 7V10C12 10.5523 11.5523 11 11 11C10.4477 11 10 10.5523 10 10V7C10 6.44772 10.4477 6 11 6ZM11 16C11.8284 16 12.5 15.3284 12.5 14.5C12.5 13.6716 11.8284 13 11 13C10.1716 13 9.5 13.6716 9.5 14.5C9.5 15.3284 10.1716 16 11 16Z" fill="#F58B00"/>`,
+				Success: `<path xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" d="M0 10C0 15.5228 4.47715 20 10 20C15.5228 20 20 15.5228 20 10C20 4.47715 15.5228 0 10 0C4.47715 0 0 4.47715 0 10ZM14.7071 6.29289C14.3166 5.90237 13.6834 5.90237 13.2929 6.29289L8 11.5858L6.70711 10.2929C6.31658 9.90237 5.68342 9.90237 5.29289 10.2929C4.90237 10.6834 4.90237 11.3166 5.29289 11.7071L7.29289 13.7071C7.68342 14.0976 8.31658 14.0976 8.70711 13.7071L14.7071 7.70711C15.0976 7.31658 15.0976 6.68342 14.7071 6.29289Z" fill="#36A41D"/>`,
+				Information: `<path xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" d="M3 0C1.34315 0 0 1.34315 0 3V15C0 16.6569 1.34315 18 3 18H15C16.6569 18 18 16.6569 18 15V3C18 1.34315 16.6569 0 15 0H3ZM9 6.5C9.82843 6.5 10.5 5.82843 10.5 5C10.5 4.17157 9.82843 3.5 9 3.5C8.17157 3.5 7.5 4.17157 7.5 5C7.5 5.82843 8.17157 6.5 9 6.5ZM9 8.5C9.55228 8.5 10 8.94772 10 9.5V13.5C10 14.0523 9.55228 14.5 9 14.5C8.44771 14.5 8 14.0523 8 13.5V9.5C8 8.94772 8.44771 8.5 9 8.5Z" fill="#1B90FF"/>`,
+			};
+			const result = `
+		<svg xmlns="http://www.w3.org/2000/svg" width="24" height="20" viewBox="0 0 20 20" fill="none">
+			${iconPerValueState[this.valueState]};
+		</svg>
+		`;
+			return this.valueState !== ValueState__default.None ? result : "";
+		}
 		getCaretPosition() {
 			return Caret.getCaretPosition(this.nativeInput);
 		}
@@ -689,7 +714,11 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return [Popover].concat(Suggestions ? Suggestions.dependencies : []);
 		}
 		static async onDefine() {
-			await i18nBundle.fetchI18nBundle("@ui5/webcomponents");
+			const Suggestions = FeaturesRegistry.getFeature("InputSuggestions");
+			[Input.i18nBundle] = await Promise.all([
+				i18nBundle.getI18nBundle("@ui5/webcomponents"),
+				Suggestions ? Suggestions.init() : Promise.resolve(),
+			]);
 		}
 	}
 	Input.define();

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

@@ -62,7 +62,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		constructor() {
 			super();
 			this._dummyAnchor = document.createElement("a");
-			this.i18nBundle = i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 		static get metadata() {
 			return metadata;
@@ -108,7 +107,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			};
 		}
 		get linkTypeText() {
-			return this.i18nBundle.getText(Link.typeTextMappings()[this.design]);
+			return Link.i18nBundle.getText(Link.typeTextMappings()[this.design]);
 		}
 		get parsedRef() {
 			return (this.href && this.href.length > 0) ? this.href : undefined;
@@ -117,7 +116,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.accessibleRole || "link";
 		}
 		static async onDefine() {
-			await i18nBundle.fetchI18nBundle("@ui5/webcomponents");
+			Link.i18nBundle = await i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 		_onclick(event) {
 			event.isMarked = "link";

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

@@ -46,7 +46,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				type: ListSeparators,
 				defaultValue: ListSeparators.All,
 			},
-			 growing: {
+			growing: {
 				type: ListGrowingMode,
 				defaultValue: ListGrowingMode.None,
 			},
@@ -64,14 +64,14 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 				type: String,
 				defaultValue: "",
 			},
-			 accessibleRole: {
+			accessibleRole: {
 				type: String,
-				defaultValue: "listbox",
+				defaultValue: "list",
 			},
-			 _inViewport: {
+			_inViewport: {
 				type: Boolean,
 			},
-			 _loadMoreActive: {
+			_loadMoreActive: {
 				type: Boolean,
 			},
 		},
@@ -120,7 +120,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return List_css;
 		}
 		static async onDefine() {
-			await i18nBundle.fetchI18nBundle("@ui5/webcomponents");
+			List.i18nBundle = await i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 		static get dependencies() {
 			return [BusyIndicator];
@@ -142,7 +142,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			this.addEventListener("ui5-_selection-requested", this.onSelectionRequested.bind(this));
 			this.addEventListener("ui5-_focus-requested", this.focusUploadCollectionItem.bind(this));
 			this._handleResize = this.checkListInViewport.bind(this);
-			this.i18nBundle = i18nBundle.getI18nBundle("@ui5/webcomponents");
 			this.initialIntersection = true;
 		}
 		onExitDOM() {
@@ -176,6 +175,9 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		get headerID() {
 			return `${this._id}-header`;
 		}
+		get modeLabelID() {
+			return `${this._id}-modeLabel`;
+		}
 		get listEndDOM() {
 			return this.shadowRoot.querySelector(".ui5-list-end-marker");
 		}
@@ -185,6 +187,17 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		get showNoDataText() {
 			return !this.hasData && this.noDataText;
 		}
+		get isDelete() {
+			return this.mode === ListMode.Delete;
+		}
+		get isSingleSelect() {
+			return [
+				ListMode.SingleSelect,
+				ListMode.SingleSelectBegin,
+				ListMode.SingleSelectEnd,
+				ListMode.SingleSelectAuto,
+			].includes(this.mode);
+		}
 		get isMultiSelect() {
 			return this.mode === ListMode.MultiSelect;
 		}
@@ -192,11 +205,30 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			if (this.accessibleNameRef || this.accessibleName) {
 				return undefined;
 			}
-			return this.shouldRenderH1 ? this.headerID : undefined;
+			const ids = [];
+			if (this.isMultiSelect || this.isSingleSelect || this.isDelete) {
+				ids.push(this.modeLabelID);
+			}
+			if (this.shouldRenderH1) {
+				ids.push(this.headerID);
+			}
+			return ids.length ? ids.join(" ") : undefined;
 		}
 		get ariaLabelТxt() {
 			return AriaLabelHelper.getEffectiveAriaLabelText(this);
 		}
+		get ariaLabelModeText() {
+			if (this.isMultiSelect) {
+				return List.i18nBundle.getText(i18nDefaults.ARIA_LABEL_LIST_MULTISELECTABLE);
+			}
+			if (this.isSingleSelect) {
+				return List.i18nBundle.getText(i18nDefaults.ARIA_LABEL_LIST_SELECTABLE);
+			}
+			if (this.isDelete) {
+				return List.i18nBundle.getText(i18nDefaults.ARIA_LABEL_LIST_DELETABLE);
+			}
+			return undefined;
+		}
 		get grows() {
 			return this.growing !== ListGrowingMode.None;
 		}
@@ -210,7 +242,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.growing === ListGrowingMode.Button;
 		}
 		get _growingButtonText() {
-			return this.i18nBundle.getText(i18nDefaults.LOAD_MORE_TEXT);
+			return List.i18nBundle.getText(i18nDefaults.LOAD_MORE_TEXT);
 		}
 		get busyIndPosition() {
 			if (Device.isIE() || !this.grows) {
@@ -318,9 +350,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return this.getSlottedNodes("items").filter(item => !item.disabled);
 		}
 		_onkeydown(event) {
-			if (Keys.isSpace(event)) {
-				event.preventDefault();
-			}
 			if (Keys.isTabNext(event)) {
 				this._handleTabNext(event);
 			}

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

@@ -18,7 +18,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/th
 			},
 			role: {
 				type: String,
-				defaultValue: "option",
+				defaultValue: "listitem",
 			},
 			_mode: {
 				type: ListMode,
@@ -58,7 +58,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/th
 					this.active = false;
 				}
 			};
-			this.i18nBundle = i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 		onBeforeRendering(...params) {
 			this.actionable = (this.type === ListItemType.Active) && (this._mode !== ListMode.Delete);
@@ -196,22 +195,28 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/Keys', 'sap/ui/webc/common/th
 			}
 			return undefined;
 		}
+		get ariaSelectedText() {
+			let ariaSelectedText;
+			if (this.ariaSelected !== undefined) {
+				ariaSelectedText = this.ariaSelected ? ListItem.i18nBundle.getText(i18nDefaults.LIST_ITEM_SELECTED) : ListItem.i18nBundle.getText(i18nDefaults.LIST_ITEM_NOT_SELECTED);
+			}
+			return ariaSelectedText;
+		}
 		get deleteText() {
-			return this.i18nBundle.getText(i18nDefaults.DELETE);
+			return ListItem.i18nBundle.getText(i18nDefaults.DELETE);
 		}
 		get _accInfo() {
 			return {
 				role: this.role,
 				ariaExpanded: undefined,
 				ariaLevel: undefined,
-				ariaLabel: this.i18nBundle.getText(i18nDefaults.ARIA_LABEL_LIST_ITEM_CHECKBOX),
-				listItemAriaLabel: undefined,
+				ariaLabel: ListItem.i18nBundle.getText(i18nDefaults.ARIA_LABEL_LIST_ITEM_CHECKBOX),
+				ariaLabelRadioButton: ListItem.i18nBundle.getText(i18nDefaults.ARIA_LABEL_LIST_ITEM_RADIO_BUTTON),
+				ariaSelectedText: this.ariaSelectedText,
 			};
 		}
 		static async onDefine() {
-			await Promise.all([
-				i18nBundle.fetchI18nBundle("@ui5/webcomponents"),
-			]);
+			ListItem.i18nBundle = await i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 	}
 

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

@@ -48,7 +48,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		}
 		constructor() {
 			super();
-			this.i18nBundle = i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 		_closeClick() {
 			this.fireEvent("close", {});
@@ -60,7 +59,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			];
 		}
 		static async onDefine() {
-			await i18nBundle.fetchI18nBundle("@ui5/webcomponents");
+			MessageStrip.i18nBundle = await i18nBundle.getI18nBundle("@ui5/webcomponents");
 		}
 		static designClassesMappings() {
 			return {
@@ -82,7 +81,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return `Message Strip ${this.design} ${this.hideCloseButton ? "" : "closable"}`;
 		}
 		get _closeButtonText() {
-			return this.i18nBundle.getText(i18nDefaults.MESSAGE_STRIP_CLOSE_BUTTON);
+			return MessageStrip.i18nBundle.getText(i18nDefaults.MESSAGE_STRIP_CLOSE_BUTTON);
 		}
 		get classes() {
 			return {