provide context

src/Umbraco.Web.UI.Client/src/packages/core/components/backoffice-modal-container/backoffice-modal-container.element.ts

@@ -52,14 +52,17 @@ export class UmbBackofficeModalContainerElement extends UmbLitElement {
 		});
 	}
 
+	#renderModal(key: string) {
+		const element = this._modalElementMap.get(key);
+		if (!element) return;
+		return html`${element.render()}`;
+	}
+
 	render() {
 		return html`
 			<uui-modal-container>
 				${this._modalHandlers.length > 0
-					? repeat(
-							this._modalHandlers,
-							(modalHandler) => html`${this._modalElementMap.get(modalHandler.key)?.modalElement}`,
-					  )
+					? repeat(this._modalHandlers, (modalHandler) => this.#renderModal(modalHandler.key))
 					: ''}
 			</uui-modal-container>
 		`;

src/Umbraco.Web.UI.Client/src/packages/core/modal/modal.element.ts

@@ -8,7 +8,7 @@ import { UmbObserverController } from '@umbraco-cms/backoffice/observable-api';
 import { UUIDialogElement, UUIModalDialogElement, UUIModalSidebarElement } from '@umbraco-cms/backoffice/external/uui';
 import { UmbRouterSlotElement } from '@umbraco-cms/backoffice/router';
 import { createExtensionElement } from '@umbraco-cms/backoffice/extension-api';
-import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
+import { UmbContextProvider, UmbContextToken } from '@umbraco-cms/backoffice/context-api';
 
 @customElement('umb-modal')
 export class UmbModalElement extends UmbLitElement {
@@ -25,8 +25,6 @@ export class UmbModalElement extends UmbLitElement {
 		}
 
 		this.#createModalElement();
-
-		this.provideContext(UMB_MODAL_CONTEXT_TOKEN, this.#modalHandler);
 	}
 
 	public modalElement?: UUIModalDialogElement | UUIModalSidebarElement;
@@ -67,6 +65,9 @@ export class UmbModalElement extends UmbLitElement {
 
 		this.modalElement.appendChild(this.#modalRouterElement);
 		this.#observeModal(this.#modalHandler.alias.toString());
+
+		const provider = new UmbContextProvider(this.modalElement, UMB_MODAL_CONTEXT_TOKEN, this.#modalHandler);
+		provider.hostConnected();
 	}
 
 	#createContainerElement() {