diff --git a/packages/main/src/ComboBox.ts b/packages/main/src/ComboBox.ts
index c7bc268c62c0..3288ddbbf033 100644
--- a/packages/main/src/ComboBox.ts
+++ b/packages/main/src/ComboBox.ts
@@ -60,6 +60,10 @@ import {
 	COMBOBOX_AVAILABLE_OPTIONS,
 	COMBOBOX_DIALOG_OK_BUTTON,
 	COMBOBOX_DIALOG_CANCEL_BUTTON,
+	COMBOBOX_LOADING,
+	COMBOBOX_LOADED,
+	COMBOBOX_LOADED_ITEMS,
+	COMBOBOX_LOADED_ITEM,
 	SELECT_OPTIONS,
 	LIST_ITEM_POSITION,
 	LIST_ITEM_GROUP_HEADER,
@@ -501,6 +505,8 @@ class ComboBox extends UI5Element implements IFormInputElement {
 	icon!: Slot<IIcon>;
 
 	_initialRendering = true;
+	_prevLoading: boolean;
+	_announceLoading?: boolean;
 	_itemFocused = false;
 	// used only for Safari fix (check onAfterRendering)
 	_autocomplete = false;
@@ -546,6 +552,7 @@ class ComboBox extends UI5Element implements IFormInputElement {
 
 		// when an initial value is set it should be considered as a _lastValue
 		this._lastValue = this.getAttribute("value") || "";
+		this._prevLoading = this.loading;
 	}
 
 	onBeforeRendering() {
@@ -596,6 +603,16 @@ class ComboBox extends UI5Element implements IFormInputElement {
 		});
 
 		this._selectMatchingItem();
+
+		if (!this._initialRendering) {
+			if (!this._prevLoading && this.loading) {
+				this._announceLoading = true;
+			} else if (this._prevLoading && !this.loading) {
+				this._announceLoading = false;
+			}
+		}
+
+		this._prevLoading = this.loading;
 		this._initialRendering = false;
 
 		this.style.setProperty("--_ui5-input-icons-count", `${this.iconsCount}`);
@@ -616,6 +633,15 @@ class ComboBox extends UI5Element implements IFormInputElement {
 
 		this.storeResponsivePopoverWidth();
 
+		if (this._announceLoading) {
+			announce(ComboBox.i18nBundle.getText(COMBOBOX_LOADING), InvisibleMessageMode.Polite);
+		} else if (this._announceLoading === false) {
+			const count = this._getItems().filter(item => !item.isGroupItem && item._isVisible).length;
+			const itemsLoadedMessage = count === 1 ? ComboBox.i18nBundle.getText(COMBOBOX_LOADED_ITEM) : ComboBox.i18nBundle.getText(COMBOBOX_LOADED_ITEMS, count);
+			announce(`${ComboBox.i18nBundle.getText(COMBOBOX_LOADED)}. ${itemsLoadedMessage}`, InvisibleMessageMode.Polite);
+		}
+		this._announceLoading = undefined;
+
 		if (!arraysAreEqual(this._valueStateLinks, this.linksInAriaValueStateHiddenText)) {
 			this._removeLinksEventListeners();
 			this._addLinksEventListeners();
diff --git a/packages/main/src/ComboBoxPopoverTemplate.tsx b/packages/main/src/ComboBoxPopoverTemplate.tsx
index b4dd0ebcc93d..61cebaf5a033 100644
--- a/packages/main/src/ComboBoxPopoverTemplate.tsx
+++ b/packages/main/src/ComboBoxPopoverTemplate.tsx
@@ -12,6 +12,8 @@ import generateHighlightedMarkupFirstMatch from "@ui5/webcomponents-base/dist/ut
 import type ComboBox from "./ComboBox.js";
 
 export default function ComboBoxPopoverTemplate(this: ComboBox) {
+	const loadingOnDesktopWithValueState = this.loading && !this._isPhone && this.hasValueState;
+	const loadingDelay = 100;
 	return (
 		<>
 			<ResponsivePopover
@@ -33,123 +35,121 @@ export default function ComboBoxPopoverTemplate(this: ComboBox) {
 				onKeyDown={this._handlePopoverKeydown}
 				onFocusOut={this._handlePopoverFocusout}
 			>
-				{this.loading &&
-					<BusyIndicator active={true} class="ui5-combobox-busy"/>
-				}
+				{this._isPhone &&
+					<>
+						<div slot="header" class="ui5-responsive-popover-header">
+							<div class="row">
+								<Title
+									level="H1"
+									wrappingType="None"
+									class="ui5-responsive-popover-header-text"
+								>
+									{this._headerTitleText}
+								</Title>
+							</div>
 
-				{!this.loading && this._isPhone &&
-				<>
-					<div slot="header" class="ui5-responsive-popover-header">
-						<div class="row">
-							<Title
-								level="H1"
-								wrappingType="None"
-								class="ui5-responsive-popover-header-text"
-							>
-								{this._headerTitleText}
-							</Title>
+							<div class="row">
+								<Input
+									open={this.openOnMobile}
+									placeholder={this.placeholder}
+									valueState={this.valueState}
+									showClearIcon={this.showClearIcon}
+									noTypeahead={this.noTypeahead}
+									onKeyDown={this._handleMobileKeydown}
+									onInput={this._handleMobileInput}
+									onChange={this._inputChange}
+								>
+									{!this.loading && this._filteredItems.flatMap(item => {
+										if (item.isGroupItem && item.items) {
+											// For group items, return all nested items
+											return item.items
+												.filter(nestedItem => !!nestedItem)
+												.map(nestedItem =>
+													<SuggestionItem text={nestedItem.text} additional-text={nestedItem.additionalText} markupText={generateHighlightedMarkupFirstMatch(nestedItem.text || "", this.filterValue)} />
+												);
+										}
+										// For regular items
+										return <SuggestionItem text={item.text} additional-text={item.additionalText} markupText={generateHighlightedMarkupFirstMatch(item.text || "", this.filterValue)} />;
+									})}
+								</Input>
+							</div>
 						</div>
 
-						<div class="row">
-							<Input
-								open={this.openOnMobile}
-								placeholder={this.placeholder}
-								valueState={this.valueState}
-								showClearIcon={this.showClearIcon}
-								noTypeahead={this.noTypeahead}
-								onKeyDown={this._handleMobileKeydown}
-								onInput={this._handleMobileInput}
-								onChange={this._inputChange}
-							>
-								{ this._filteredItems.flatMap(item => {
-									if (item.isGroupItem && item.items) {
-										// For group items, return all nested items
-										return item.items
-											.filter(nestedItem => !!nestedItem)
-											.map(nestedItem =>
-												<SuggestionItem text={nestedItem.text} additional-text={nestedItem.additionalText} markupText={generateHighlightedMarkupFirstMatch(nestedItem.text || "", this.filterValue)}/>
-											);
-									}
-									// For regular items
-									return <SuggestionItem text={item.text} additional-text={item.additionalText} markupText={generateHighlightedMarkupFirstMatch(item.text || "", this.filterValue)}/>;
-								})}
-							</Input>
-						</div>
-					</div>
-
-					{this.hasValueStateText &&
-					<div class={this.classes.popoverValueState} style={this.styles.popoverValueStateMessage}>
-						<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon}/>
-						{ this.open && valueStateMessage.call(this) }
-					</div>
-					}
-				</>
+						{this.hasValueStateText &&
+							<div class={this.classes.popoverValueState} style={this.styles.popoverValueStateMessage}>
+								<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon} />
+								{this.open && valueStateMessage.call(this)}
+							</div>
+						}
+					</>
 				}
 
 				{!this._isPhone && this.hasValueStateText &&
-				<div
-					slot="header"
-					class={{
-						"ui5-responsive-popover-header": true,
-						...this.classes.popoverValueState,
-					}}
-					style={this.styles.suggestionPopoverHeader}
-				>
-					<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon}/>
-					{ this.open && valueStateMessage.call(this) }
-				</div>
+					<div
+						slot="header"
+						class={{
+							"ui5-responsive-popover-header": true,
+							...this.classes.popoverValueState,
+						}}
+						style={this.styles.suggestionPopoverHeader}
+					>
+						<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon} />
+						{this.open && valueStateMessage.call(this)}
+					</div>
 				}
 
-				{!this.loading && !!this._filteredItems.length &&
-				<List
-					class="ui5-combobox-items-list"
-					separators="None"
-					accessibleRole="ListBox"
-					selectionMode="Single"
-					onItemClick={this._selectItem}
-					onItemFocused={this._onItemFocus}
-					onMouseDown={this._itemMousedown}
-				>
-					{ this._filteredItems.map(item => <slot name={item._individualSlot}></slot>)}
-				</List>
+				{(this._isPhone || !this.hasValueState) && this.loading && <BusyIndicator active={true} class="ui5-combobox-busy" delay={loadingDelay} />}
+				{((!this.loading && !!this._filteredItems.length) || loadingOnDesktopWithValueState) &&
+					<List
+						class="ui5-combobox-items-list"
+						separators="None"
+						accessibleRole="ListBox"
+						selectionMode="Single"
+						onItemClick={this._selectItem}
+						onItemFocused={this._onItemFocus}
+						onMouseDown={this._itemMousedown}
+					>
+						{loadingOnDesktopWithValueState && <BusyIndicator active={true} class="ui5-combobox-busy" delay={loadingDelay} />}
+						{!this.loading && this._filteredItems.map(item => <slot name={item._individualSlot}></slot>)}
+					</List>
 				}
 
 				{this._isPhone &&
-			<div slot="footer" class="ui5-responsive-popover-footer">
-				<Button
-					design="Emphasized"
-					onClick={this._closeRespPopover}
-				>{this._dialogOkButtonText}</Button>
-				<Button
-					class="ui5-responsive-popover-close-btn"
-					design="Transparent"
-					onClick={this._closeRespPopover}
-				>
-					{this._dialogCancelButtonText}
-				</Button>
-			</div>
+					<div slot="footer" class="ui5-responsive-popover-footer">
+						<Button
+							design="Emphasized"
+							onClick={this._closeRespPopover}
+						>{this._dialogOkButtonText}</Button>
+						<Button
+							class="ui5-responsive-popover-close-btn"
+							design="Transparent"
+							onClick={this._closeRespPopover}
+						>
+							{this._dialogCancelButtonText}
+						</Button>
+					</div>
 				}
 			</ResponsivePopover>
 
 			{this.shouldOpenValueStateMessagePopover &&
-		<Popover
-			preventFocusRestore={true}
-			preventInitialFocus={true}
-			hideArrow={true}
-			tabindex={-1}
-			class="ui5-valuestatemessage-popover"
-			horizontalAlign={PopoverHorizontalAlign.Start}
-			placement="Bottom"
-			opener={this}
-			open={this.valueStateOpen}
-			onClose={this._handleValueStatePopoverAfterClose}
-			onFocusOut={this._handleValueStatePopoverFocusout}
-		>
-			<div slot="header" class={this.classes.popoverValueState}>
-				<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon}/>
-				{ valueStateMessage.call(this) }
-			</div>
-		</Popover>
+				<Popover
+					preventFocusRestore={true}
+					preventInitialFocus={true}
+					hideArrow={true}
+					tabindex={-1}
+					class="ui5-valuestatemessage-popover"
+					horizontalAlign={PopoverHorizontalAlign.Start}
+					placement="Bottom"
+					opener={this}
+					open={this.valueStateOpen}
+					onClose={this._handleValueStatePopoverAfterClose}
+					onFocusOut={this._handleValueStatePopoverFocusout}
+				>
+					<div slot="header" class={this.classes.popoverValueState}>
+						<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon} />
+						{valueStateMessage.call(this)}
+					</div>
+				</Popover>
 			}
 		</>
 	);
@@ -158,7 +158,7 @@ export default function ComboBoxPopoverTemplate(this: ComboBox) {
 function valueStateMessage(this: ComboBox) {
 	return (
 		<>
-			{ this.shouldDisplayDefaultValueStateMessage ? this.valueStateDefaultText : <slot name="valueStateMessage"></slot> }
+			{this.shouldDisplayDefaultValueStateMessage ? this.valueStateDefaultText : <slot name="valueStateMessage"></slot>}
 		</>
 	);
 }
diff --git a/packages/main/src/MultiComboBox.ts b/packages/main/src/MultiComboBox.ts
index 085142308936..4383e77a6dd1 100644
--- a/packages/main/src/MultiComboBox.ts
+++ b/packages/main/src/MultiComboBox.ts
@@ -61,6 +61,8 @@ import type { IFormInputElement } from "@ui5/webcomponents-base/dist/features/In
 import MultiComboBoxItem, { isInstanceOfMultiComboBoxItem } from "./MultiComboBoxItem.js";
 import MultiComboBoxItemGroup, { isInstanceOfMultiComboBoxItemGroup } from "./MultiComboBoxItemGroup.js";
 import ListItemGroup from "./ListItemGroup.js";
+import InvisibleMessageMode from "@ui5/webcomponents-base/dist/types/InvisibleMessageMode.js";
+import announce from "@ui5/webcomponents-base/dist/util/InvisibleMessage.js";
 import Tokenizer, { getTokensCountText } from "./Tokenizer.js";
 import type { TokenizerTokenDeleteEventDetail } from "./Tokenizer.js";
 import Token from "./Token.js";
@@ -97,6 +99,10 @@ import {
 	MCB_SELECTED_ITEMS,
 	INPUT_CLEAR_ICON_ACC_NAME,
 	FORM_MIXED_TEXTFIELD_REQUIRED,
+	MULTICOMBOBOX_LOADING,
+	MULTICOMBOBOX_LOADED,
+	MULTICOMBOBOX_LOADED_ITEMS,
+	MULTICOMBOBOX_LOADED_ITEM,
 } from "./generated/i18n/i18n-defaults.js";
 
 // Templates
@@ -148,6 +154,10 @@ type MultiComboBoxValueStateChangeEventDetail = {
 	valueState: `${ValueState}`,
 }
 
+type MultiComboBoxLoadingStart = {
+	shouldOpenPicker: boolean;
+}
+
 /**
  * @class
  *
@@ -262,6 +272,13 @@ type MultiComboBoxValueStateChangeEventDetail = {
 	cancelable: true,
 })
 
+/*
+ * @public
+ */
+@event("load-started", {
+	bubbles: true,
+})
+
 /**
  * Fired before the value state of the component is updated internally.
  * The event is preventable, meaning that if it's default action is
@@ -281,6 +298,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 		input: void,
 		open: void,
 		close: void,
+		"load-started": MultiComboBoxLoadingStart,
 		"selection-change": MultiComboBoxSelectionChangeEventDetail,
 		"value-state-change": MultiComboBoxValueStateChangeEventDetail,
 	}
@@ -590,6 +608,8 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 	selectedItems: Array<IMultiComboBoxItem>;
 	_valueStateLinks: Array<HTMLElement>;
 	_composition?: InputComposition;
+	_prevLoading: boolean;
+	_announceLoading?: boolean;
 	_suppressNextLiveChange: boolean; // prevent unwanted live change events during IME composition
 	@i18n("@ui5/webcomponents")
 	static i18nBundle: I18nBundle;
@@ -643,6 +663,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 		this.currentItemIdx = -1;
 		this._valueStateLinks = [];
 		this._suppressNextLiveChange = false;
+		this._prevLoading = this.loading;
 	}
 
 	onEnterDOM() {
@@ -722,6 +743,9 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 	}
 
 	togglePopoverByDropdownIcon() {
+		if (!this.open && !this.loading && this._getItems().length === 0) {
+			this.fireDecoratorEvent("load-started", { shouldOpenPicker: false });
+		}
 		this._shouldFilterItems = false;
 		this.open = !this.open;
 		this.tokenizerOpen = false;
@@ -757,6 +781,8 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 			return;
 		}
 
+		this.fireDecoratorEvent("load-started", { shouldOpenPicker: true });
+
 		const input = e.target as HTMLInputElement;
 		const value: string = input.value;
 		const filteredItems: Array<IMultiComboBoxItem> = this._filterItems(value);
@@ -795,7 +821,7 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 		this.value = input.value;
 		this._filteredItems = filteredItems;
 
-		if (!isPhone()) {
+		if (!isPhone() && !this.loading) {
 			if (filteredItems.length === 0) {
 				this.open = false;
 			} else {
@@ -1215,6 +1241,10 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 	}
 
 	_onItemKeydown(e: KeyboardEvent) {
+		if (this.filterSelected) {
+			return;
+		}
+
 		const isFirstItemGroup = this.list?.getSlottedNodes<IMultiComboBoxItem>("items")[1] === e.target && this.list?.getSlottedNodes<IMultiComboBoxItem>("items")[0].hasAttribute("ui5-li-group");
 		const isFirstItem = this.list?.getSlottedNodes<IMultiComboBoxItem>("items")[0] === e.target || isFirstItemGroup;
 		const isArrowUp = isUp(e) || isUpCtrl(e);
@@ -1699,6 +1729,9 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 	_click() {
 		if (isPhone() && !this.readonly && !this._showMorePressed && !this._deleting) {
 			this.open = true;
+			if (this._getItems().length === 0) {
+				this.fireDecoratorEvent("load-started", { shouldOpenPicker: true });
+			}
 		}
 
 		this._showMorePressed = false;
@@ -1853,6 +1886,13 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 		const autoCompletedChars = input && (input.selectionEnd || 0) - (input.selectionStart || 0);
 		const value = input && input.value;
 
+		if (!this._prevLoading && this.loading) {
+			this._announceLoading = true;
+		} else if (this._prevLoading && !this.loading) {
+			this._announceLoading = false;
+		}
+		this._prevLoading = this.loading;
+
 		if (this.open) {
 			const list = this._getList();
 			const selectedListItemsCount = this.items.filter(item => item.selected).length;
@@ -1922,6 +1962,15 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 			this._addLinksEventListeners();
 			this._valueStateLinks = this.linksInAriaValueStateHiddenText;
 		}
+
+		if (this._announceLoading) {
+			announce(MultiComboBox.i18nBundle.getText(MULTICOMBOBOX_LOADING), InvisibleMessageMode.Polite);
+		} else if (this._announceLoading === false) {
+			const count = this._getItems().filter(item => item._isVisible).length;
+			const itemsLoadedMessage = count === 1 ? MultiComboBox.i18nBundle.getText(MULTICOMBOBOX_LOADED_ITEM) : MultiComboBox.i18nBundle.getText(MULTICOMBOBOX_LOADED_ITEMS, count);
+			announce(`${MultiComboBox.i18nBundle.getText(MULTICOMBOBOX_LOADED)}. ${itemsLoadedMessage}`, InvisibleMessageMode.Polite);
+		}
+		this._announceLoading = undefined;
 	}
 
 	get _isPhone() {
@@ -2372,8 +2421,8 @@ class MultiComboBox extends UI5Element implements IFormInputElement {
 		const remSizeIxPx = parseInt(getComputedStyle(document.documentElement).fontSize);
 		return {
 			popoverValueStateMessage: {
-				"width": `${this._listWidth || 0}px`,
-				"display": this._listWidth === 0 ? "none" : "inline-block",
+				"width": this._listWidth ? `${this._listWidth}px` : "100%",
+				"display": "inline-block",
 			},
 			popoverHeader: {
 				"max-width": isPhone() ? "100%" : `22rem`,
@@ -2392,6 +2441,7 @@ export default MultiComboBox;
 
 export type {
 	IMultiComboBoxItem,
+	MultiComboBoxLoadingStart,
 	MultiComboBoxSelectionChangeEventDetail,
 	MultiComboBoxValueStateChangeEventDetail,
 };
diff --git a/packages/main/src/MultiComboBoxPopoverTemplate.tsx b/packages/main/src/MultiComboBoxPopoverTemplate.tsx
index 0393b075a1f3..a630b8892145 100644
--- a/packages/main/src/MultiComboBoxPopoverTemplate.tsx
+++ b/packages/main/src/MultiComboBoxPopoverTemplate.tsx
@@ -13,6 +13,8 @@ import CheckBox from "./CheckBox.js";
 import Title from "./Title.js";
 import BusyIndicator from "./BusyIndicator.js";
 
+const LOADING_DELAY = 100;
+
 export default function MultiComboBoxPopoverTemplate(this: MultiComboBox) {
 	return (<>
 		<ResponsivePopover
@@ -33,91 +35,13 @@ export default function MultiComboBoxPopoverTemplate(this: MultiComboBox) {
 			open={this.open}
 			opener={this}
 		>
-			{this.loading &&
-				<BusyIndicator active={true} class="ui5-multi-combobox-busy"/>
-			}
-
-			{!this.loading && this._isPhone && <>
-				<div slot="header" class="ui5-responsive-popover-header" style={this.styles.popoverHeader}>
-					<div class="row">
-						<Title
-							level="H1"
-							wrappingType="None"
-							class="ui5-responsive-popover-header-text"
-						>
-							{this._headerTitleText}
-						</Title>
-					</div>
-					<div class="row">
-						<Input
-							onInput={this._handleMobileInput}
-							onKeyDown={this._onMobileInputKeydown}
-							placeholder={this.placeholder}
-							valueState={this._dialogInputValueState}
-							showClearIcon={this.showClearIcon}
-							noTypeahead={this.noTypeahead}
-						>
-							{this._filteredItems.map(item => (
-								<SuggestionItem text={item.text} additionalText={item.additionalText}></SuggestionItem>
-							))}
-						</Input>
-						<ToggleButton
-							slot="header"
-							class="ui5-multi-combobox-toggle-button"
-							icon={multiSelectAll}
-							design="Transparent"
-							pressed={this._showAllItemsButtonPressed}
-							disabled={this._getSelectedItems().length === 0}
-							onClick={this.filterSelectedItems}
-							accessibleName={this._showSelectedButtonAccessibleNameText}
-						></ToggleButton>
-					</div>
-				</div>				{this.hasValueStateMessage &&
-					<div class={this.classes.popoverValueState} style={this.styles.popoverValueStateMessage}>
-						<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon}></Icon>
-						{this.open && valueStateMessage.call(this)}
-					</div>
-				}
-
-				{selectAllWrapper.call(this)}
-			</>}
+			{this._isPhone && dialogHeader.call(this)}
 
-			{!this.loading && !this._isPhone && <>
-				{this.hasValueStateMessage &&
-					<div slot="header" onKeyDown={this._onListHeaderKeydown} class={this.classes.responsivePopoverHeaderValueState} style={this.styles.popoverValueStateMessage}>
-						<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon}></Icon>
-						{this.open && valueStateMessage.call(this)}
-					</div>
-				}
+			{!this._isPhone && popoverHeader.call(this)}
 
-				{selectAllWrapper.call(this)}
-			</>}
+			{popoverContent.call(this)}
 
-			{!this.loading && this.filterSelected ?
-				<List separators="None" selectionMode="Multiple" class="ui5-multi-combobox-all-items-list" accessibleRole="ListBox">
-					{this.selectedItems.map(item => <slot name={item._individualSlot}></slot>)}
-				</List>
-				: !this.loading &&
-				<List separators="None" selectionMode="Multiple" class="ui5-multi-combobox-all-items-list" accessibleRole="ListBox" onKeyDown={this._onItemKeydown}>
-					{this._filteredItems.map(item => <slot name={item._individualSlot}></slot>)}
-				</List>
-			}
-
-			{this._isPhone &&
-				<div slot="footer" class="ui5-responsive-popover-footer">
-					<Button
-						design="Emphasized"
-						onClick={this.handleOK}
-					>{this._dialogOkButton}</Button>
-					<Button
-						class="ui5-responsive-popover-close-btn"
-						design="Transparent"
-						onClick={this.handleCancel}
-					>
-						{this._dialogCancelButton}
-					</Button>
-				</div>
-			}
+			{this._isPhone && dialogFooter.call(this)}
 		</ResponsivePopover>
 
 		{this.hasValueStateMessage &&
@@ -161,3 +85,97 @@ function selectAllWrapper(this: MultiComboBox) {
 		);
 	}
 }
+
+function dialogHeader(this: MultiComboBox) {
+	return <>
+		<div slot="header" class="ui5-responsive-popover-header" style={this.styles.popoverHeader}>
+			<div class="row">
+				<Title
+					level="H1"
+					wrappingType="None"
+					class="ui5-responsive-popover-header-text"
+				>
+					{this._headerTitleText}
+				</Title>
+			</div>
+			<div class="row">
+				<Input
+					onInput={this._handleMobileInput}
+					onKeyDown={this._onMobileInputKeydown}
+					placeholder={this.placeholder}
+					valueState={this._dialogInputValueState}
+					showClearIcon={this.showClearIcon}
+					noTypeahead={this.noTypeahead}
+				>
+					{this._filteredItems.map(item => (
+						<SuggestionItem text={item.text} additionalText={item.additionalText}></SuggestionItem>
+					))}
+				</Input>
+				<ToggleButton
+					slot="header"
+					class="ui5-multi-combobox-toggle-button"
+					icon={multiSelectAll}
+					design="Transparent"
+					pressed={this._showAllItemsButtonPressed}
+					disabled={this._getSelectedItems().length === 0}
+					onClick={this.filterSelectedItems}
+					accessibleName={this._showSelectedButtonAccessibleNameText}
+				></ToggleButton>
+			</div>
+		</div>
+		{this.hasValueStateMessage &&
+			<div class={this.classes.popoverValueState} style={this.styles.popoverValueStateMessage}>
+				<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon}></Icon>
+				{this.open && valueStateMessage.call(this)}
+			</div>
+		}
+	</>;
+}
+
+function popoverHeader(this: MultiComboBox) {
+	return this.hasValueStateMessage &&
+		<div slot="header" onKeyDown={this._onListHeaderKeydown} class={this.classes.responsivePopoverHeaderValueState} style={this.styles.popoverValueStateMessage}>
+			<Icon class="ui5-input-value-state-message-icon" name={this._valueStateMessageIcon}></Icon>
+			{this.open && valueStateMessage.call(this)}
+		</div>;
+}
+
+function dialogFooter(this: MultiComboBox) {
+	return <>
+		<div slot="footer" class="ui5-responsive-popover-footer">
+			<Button
+				design="Emphasized"
+				onClick={this.handleOK}
+			>{this._dialogOkButton}</Button>
+			<Button
+				class="ui5-responsive-popover-close-btn"
+				design="Transparent"
+				onClick={this.handleCancel}
+			>
+				{this._dialogCancelButton}
+			</Button>
+		</div>
+	</>;
+}
+
+function popoverContent(this: MultiComboBox) {
+	if (this.loading && (this._isPhone || !this.hasValueState)) {
+		return <BusyIndicator active={true} class="ui5-multi-combobox-busy" delay={LOADING_DELAY} />;
+	}
+
+	return <>
+		{!this.loading && selectAllWrapper.call(this)}
+		<List separators="None"
+			selectionMode="Multiple"
+			class="ui5-multi-combobox-all-items-list"
+			accessibleRole="ListBox"
+			onKeyDown={this._onItemKeydown}>
+			{this.loading && !this._isPhone && this.hasValueState && <BusyIndicator active={true} class="ui5-multi-combobox-busy" delay={LOADING_DELAY} />}
+			{!this.loading &&
+				(this.filterSelected
+					? this.selectedItems.map(item => <slot name={item._individualSlot}></slot>)
+					: this._filteredItems.map(item => <slot name={item._individualSlot}></slot>)
+				)}
+		</List>
+	</>;
+}
diff --git a/packages/main/src/i18n/messagebundle.properties b/packages/main/src/i18n/messagebundle.properties
index b43e02c4c878..9cc79b6a6038 100644
--- a/packages/main/src/i18n/messagebundle.properties
+++ b/packages/main/src/i18n/messagebundle.properties
@@ -444,6 +444,30 @@ MULTICOMBOBOX_DIALOG_CANCEL_BUTTON=Cancel
 #XACT: ARIA announcement for Combo Box and Multi Combo Box available options
 COMBOBOX_AVAILABLE_OPTIONS=Available Options
 
+#XACT: ARIA announcement when MultiComboBox starts loading items
+MULTICOMBOBOX_LOADING=Loading data
+
+#XACT: ARIA announcement when MultiComboBox ends loading items
+MULTICOMBOBOX_LOADED=Data loaded
+
+#XACT: ARIA announcement when MultiComboBox finishes loading, {0} is the number of loaded items
+MULTICOMBOBOX_LOADED_ITEMS={0} results are available
+
+#XACT: ARIA announcement when MultiComboBox finishes loading and there is 1 item
+MULTICOMBOBOX_LOADED_ITEM=1 result is available
+
+#XACT: ARIA announcement when ComboBox starts loading items
+COMBOBOX_LOADING=Loading data
+
+#XACT: ARIA announcement when ComboBox ends loading items
+COMBOBOX_LOADED=Data loaded
+
+#XACT: ARIA announcement when ComboBox finishes loading, {0} is the number of loaded items
+COMBOBOX_LOADED_ITEMS={0} results are available
+
+#XACT: ARIA announcement when ComboBox finishes loading and there is 1 item
+COMBOBOX_LOADED_ITEM=1 result is available
+
 #XBUT: Combobox Dialog OK button on mobile devices
 COMBOBOX_DIALOG_OK_BUTTON=OK
 
diff --git a/packages/main/src/themes/ComboBoxPopover.css b/packages/main/src/themes/ComboBoxPopover.css
index 8e0921c82728..b7a685c7b95d 100644
--- a/packages/main/src/themes/ComboBoxPopover.css
+++ b/packages/main/src/themes/ComboBoxPopover.css
@@ -17,4 +17,9 @@
 
 [ui5-responsive-popover] [ui5-input] {
 	width: 100%;
+}
+
+
+.ui5-combobox-items-list:has(.ui5-combobox-busy[active]) {
+  	min-height: 1.6rem;
 }
\ No newline at end of file
diff --git a/packages/main/src/themes/MultiComboBoxPopover.css b/packages/main/src/themes/MultiComboBoxPopover.css
index 21115cc5c4a9..638ceefc7069 100644
--- a/packages/main/src/themes/MultiComboBoxPopover.css
+++ b/packages/main/src/themes/MultiComboBoxPopover.css
@@ -57,3 +57,7 @@
 [ui5-responsive-popover] [ui5-input] {
 	width: 100%;
 }
+
+.ui5-multi-combobox-all-items-list:has(.ui5-multi-combobox-busy[active]) {
+  	min-height: 1.6rem;
+}
diff --git a/packages/main/test/pages/ComboBox.html b/packages/main/test/pages/ComboBox.html
index 0d2e49ee54cf..9a66281d2222 100644
--- a/packages/main/test/pages/ComboBox.html
+++ b/packages/main/test/pages/ComboBox.html
@@ -191,17 +191,15 @@
 	</div>
 
 	<div class="demo-section">
-		<span>Toggle Loading State</span>
+		<span>Loading State</span>
 
 		<br />
 		<br />
 
-		<ui5-combobox id="toggle-loading-cb" class="combobox2auto">
-			<ui5-cb-item text="Item 1"></ui5-cb-item>
-			<ui5-cb-item text="Item 2"></ui5-cb-item>
-			<ui5-cb-item text="Item 3"></ui5-cb-item>
+		<ui5-combobox id="toggle-loading-cb" class="combobox2auto" value-state="Negative">
+			<div slot="valueStateMessage">Custom error value state message.</div>
 		</ui5-combobox>
-		<ui5-button id="toggle-loading-btn">Toggle Loading</ui5-button>
+		<ui5-button id="btn-clear">Clear items</ui5-button>
 	</div>
 
 	<div class="demo-section">
@@ -518,7 +516,7 @@ <h3>ComboBox Composition</h3>
 	</div>
 
 	<script type="module">
-		document.getElementById("lazy").addEventListener("ui5-input", async event => {
+		document.getElementById("lazy").addEventListener("input", async event => {
 			const { value } = event.target;
 
 			// set busy state
@@ -529,26 +527,31 @@ <h3>ComboBox Composition</h3>
 			}
 
 			// load data
-			const items = (await (await fetch(`https://restcountries.com/v3.1/name/${value}`)).json());
-
-			// cleanup old items
-			while (document.getElementById("lazy").firstChild) {
-				document.getElementById("lazy").removeChild(document.getElementById("lazy").firstChild);
-			}
+			try {
+				while (document.getElementById("lazy").firstChild) {
+					document.getElementById("lazy").removeChild(document.getElementById("lazy").firstChild);
+				}
 
-			// fill new items
-			items.map(data => {
-				const element = document.createElement("ui5-cb-item");
-				element.setAttribute("text", data.name.common);
+				const response = await fetch(`https://restcountries.com/v3.1/name/${value}`);
+				const items = await response.json();
+				// cleanup old items
 
-				document.getElementById("lazy").appendChild(element);
-			});
+				// fill new items
+				if (Array.isArray(items)) {
+					items.map(data => {
+						const element = document.createElement("ui5-cb-item");
+						element.setAttribute("text", data.name.common);
 
-			// remove busy state
-			event.target.loading = false;
+						document.getElementById("lazy").appendChild(element);
+					});
+				}
+			} catch {
 
-			// load the items once or turn off filtering
-		}, { once: true });
+			} finally {
+				// remove busy state
+				event.target.loading = false;
+			}
+		});
 	</script>
 
 	<script type="module">
@@ -651,10 +654,53 @@ <h3>ComboBox Composition</h3>
 			document.getElementById("combo").focus();
 		});
 
-		document.getElementById("toggle-loading-btn").addEventListener("click", function () {
-			const combo = document.getElementById("toggle-loading-cb");
-			combo.loading = !combo.loading;
-		});
+		const cbLazyLoad = document.getElementById("toggle-loading-cb"); 
+
+		const createItem = (cb, text) => {
+			const item = document.createElement("ui5-cb-item");
+			item.text = text;
+			cb.appendChild(item);
+		};
+
+		const createGroupItem = (cb, text) => {
+			const item = document.createElement("ui5-cb-item-group");
+			item.headerText = text;
+			cb.appendChild(item);
+			return item;
+		}
+
+		const fnClearItems = (control) => {
+			const itemSelector = "ui5-cb-item, ui5-cb-item-group";
+			let allClear = control.querySelectorAll(itemSelector).length === 0;
+			while (!allClear) {
+				const child = control.querySelector(itemSelector);
+				control.removeChild(child);
+				allClear = control.querySelectorAll(itemSelector).length === 0;
+			}
+			control.value = "";
+		} 
+
+		const fnLoadItems = (control) => { 
+			const { value, items } = control;
+			if(!items || !items.length){
+				control.loading = true;
+				setTimeout(() => {
+					const group = createGroupItem(control, 'Group 1');
+					createItem(group, `Child Item 1 ${value}`);
+					createItem(group, `Chidl Item 2 ${value}`);
+					// createItem(control, `Item 1 ${value}`);
+					// createItem(control, `Item 2 ${value}`);
+					// createItem(control, `Item 3 ${value}`);
+					// createItem(control, `Option ${value}`);
+					control.loading = false;
+				}, 3000);
+			}
+		};
+
+		document.getElementById("btn-clear").addEventListener("click", () => fnClearItems(cbLazyLoad));
+
+		cbLazyLoad.addEventListener("open", e => fnLoadItems(e.target));
+		cbLazyLoad.addEventListener("input", e => fnLoadItems(e.target));
 
 		document.getElementById("selected-value-cb").addEventListener("ui5-change", function (event) {
 			const combo = event.target;
diff --git a/packages/main/test/pages/MultiComboBox.html b/packages/main/test/pages/MultiComboBox.html
index 771510ff0411..94716a281abe 100644
--- a/packages/main/test/pages/MultiComboBox.html
+++ b/packages/main/test/pages/MultiComboBox.html
@@ -575,18 +575,13 @@ <h3>MultiComboBox in Compact</h3>
 	</div>
 
 	<div class="demo-section">
-		<ui5-label>Toggle Loading State:</ui5-label>
+		<ui5-label>Loading State:</ui5-label>
 		<br />
 		<br />
 
-		<ui5-multi-combobox id="toggle-loading-mcb">
-			<ui5-mcb-item text="Item 1"></ui5-mcb-item>
-			<ui5-mcb-item text="Item 2"></ui5-mcb-item>
-			<ui5-mcb-item text="Item 3"></ui5-mcb-item>
+		<ui5-multi-combobox id="toggle-loading-mcb"  show-select-all>
 		</ui5-multi-combobox>
 		<br /><br />
-
-		<ui5-button id="toggle-loading-btn">Toggle Loading</ui5-button>
 	</div>
 
 	<div class="demo-section">
@@ -889,10 +884,18 @@ <h3>MultiComboBox in Compact</h3>
 			document.getElementById("mcb-form-submit").textContent = ++submitCounter;
 		});
 
-		document.getElementById("toggle-loading-btn").addEventListener("click", function () {
-			const mcb = document.getElementById("toggle-loading-mcb");
-			mcb.loading = !mcb.loading;
+		document.getElementById("toggle-loading-mcb").addEventListener("load-started", (e) => {
+			const mcbControl = e.target;
+			mcbControl.loading = true;
+			mcbControl.open = e.detail.shouldOpenPicker;
+			setTimeout(() => {
+				mcbControl.appendChild(document.createElement("ui5-mcb-item")).text = "New Item";
+				mcbControl.appendChild(document.createElement("ui5-mcb-item")).text = "New Item 2";
+				mcbControl.loading = false;
+			}, 3000);
 		});
+
+		
 	</script>
 
 	<h1>Dialog Header Title from Label</h1>