binding and events approach

src/Umbraco.Web.UI.Client/src/packages/core/workspace/workspace-context/workspace-context.ts

@@ -33,6 +33,14 @@ export abstract class UmbWorkspaceContext<T, EntityType extends UmbEntityBase>
 		this.#isNew.next(isNew);
 	}
 
+	protected saveComplete(data: EntityType) {
+		// TODO: Should we make a Event class for this=?
+		this.host.dispatchEvent(new CustomEvent('workspace-submit', { composed: true, bubbles: true, detail: { data } }));
+
+		// If it went well, then its not new anymore?.
+		this.setIsNew(false);
+	}
+
 	abstract getEntityId(): string | undefined; // COnsider if this should go away now that we have getUnique()
 	abstract getEntityType(): string; // TODO: consider of this should be on the repository because a repo is responsible for one entity type
 	abstract getData(): EntityType | undefined;

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

@@ -1,6 +1,6 @@
 import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
 import { css, CSSResultGroup, html, customElement, property } from '@umbraco-cms/backoffice/external/lit';
-import { UmbModalHandler, UmbWorkspaceData } from '@umbraco-cms/backoffice/modal';
+import { UmbModalHandler, UmbWorkspaceData, UmbWorkspaceResult } from '@umbraco-cms/backoffice/modal';
 import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
 
 @customElement('umb-workspace-modal')
@@ -11,17 +11,22 @@ export class UmbWorkspaceModalElement extends UmbLitElement {
 	@property()
 	data?: UmbWorkspaceData;
 
-	private _close() {
-		this.modalHandler?.submit();
-	}
+	private _reject = (event: CustomEvent) => {
+		event.stopPropagation();
+		this.modalHandler?.reject();
+	};
+
+	private _submit = (event: CustomEvent<UmbWorkspaceResult>) => {
+		event.stopPropagation();
+		this.modalHandler?.submit(event.detail);
+	};
 
-	/**
-	 * TODO:
-	 * It seems like the router-slot cannot find the right parent router-slot as the modal element is injected via a slot. and therefor its search through parentNodes would never get to the router-slot cause its DOM existance is not within the slot, thats only the rendering.
-	 * We can fix this by changing the router-slot to use an event to find its parent.
-	 */
 	render() {
-		return html`<umb-workspace .entityType=${this.data?.entityType}></umb-workspace>`;
+		return html`<umb-workspace
+			.entityType=${this.data?.entityType}
+			.preset=${this.data?.preset}
+			@workspace-submit=${this._submit}
+			@workspace-reject=${this._reject}></umb-workspace>`;
 	}
 
 	static styles: CSSResultGroup = [

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

@@ -8,10 +8,14 @@ export class UmbWorkspaceElement extends UmbLitElement {
 	@property({ type: String, attribute: 'entity-type' })
 	entityType = '';
 
+	@property({ type: Object, attribute: false })
+	preset?: Record<string, unknown>;
+
 	render() {
 		if (!this.entityType) return nothing;
 		return html`<umb-extension-slot
 			type="workspace"
+			.props=${{ preset: this.preset }}
 			.filter=${(manifest: ManifestWorkspace) => manifest.meta.entityType === this.entityType}></umb-extension-slot>`;
 	}
 

src/Umbraco.Web.UI.Client/src/packages/settings/data-types/modals/data-type-picker-flow/data-type-picker-flow-modal.element.ts

@@ -95,8 +95,9 @@ export class UmbDataTypePickerFlowModalElement extends UmbLitElement {
 	}
 
 	private _createDataType(propertyEditorUiAlias: string) {
+		// TODO: Could be nice with a more pretty way to prepend to the URL:
 		// Open create modal:
-		this._createDataTypeModal.open({ uiAlias: propertyEditorUiAlias });
+		this._createDataTypeModal.open({ uiAlias: propertyEditorUiAlias }, 'create/null');
 	}
 
 	async #init() {

src/Umbraco.Web.UI.Client/src/packages/settings/data-types/workspace/data-type-workspace.element.ts

@@ -1,10 +1,11 @@
 import { UmbDataTypeWorkspaceContext } from './data-type-workspace.context.js';
 import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
-import { html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
+import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit';
 import type { UmbRoute } from '@umbraco-cms/backoffice/router';
 import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
 
 import './data-type-workspace-editor.element.js';
+import type { DataTypeResponseModel } from '@umbraco-cms/backoffice/backend-api';
 
 @customElement('umb-data-type-workspace')
 export class UmbDataTypeWorkspaceElement extends UmbLitElement {
@@ -12,8 +13,12 @@ export class UmbDataTypeWorkspaceElement extends UmbLitElement {
 
 	#element = document.createElement('umb-data-type-workspace-editor');
 
-	@state()
-	_routes: UmbRoute[] = [
+	@property({ type: Object, attribute: false })
+	public set preset(value: Partial<DataTypeResponseModel>) {
+		this.#workspaceContext.setPreset(value);
+	}
+
+	private _routes: UmbRoute[] = [
 		{
 			path: 'create/:parentId',
 			component: () => this.#element,