From 583782176d02358addac6d7049e39eb94969dd61 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 16:31:08 +0100
Subject: [PATCH 01/47] initial property context concept

---
 .../settings/data-types/data-type.store.ts    |   7 +-
 .../content-property.element.ts               |  21 +---
 .../entity-property.element.ts                |  99 +++++++++------
 .../workspace-property.context.ts             | 114 +++++++++++++-----
 .../property-editor-ui-textarea.element.ts    |  10 +-
 .../src/core/mocks/data/data-type.data.ts     |   2 +-
 .../observable-api/unique-behavior-subject.ts |  37 ++++++
 7 files changed, 202 insertions(+), 88 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/data-type.store.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/data-type.store.ts
index 95c9d089f0..6db9082713 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/data-type.store.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/data-type.store.ts
@@ -10,6 +10,11 @@ const isDataTypeDetails = (dataType: DataTypeDetails | FolderTreeItem): dataType
 // TODO: can we make is easy to reuse store methods across different stores?
 
 export type UmbDataTypeStoreItemType = DataTypeDetails | FolderTreeItem;
+
+// TODO: research how we write names of global consts.
+export const STORE_ALIAS = 'umbDataTypeStore';
+
+
 /**
  * @export
  * @class UmbDataTypesStore
@@ -18,7 +23,7 @@ export type UmbDataTypeStoreItemType = DataTypeDetails | FolderTreeItem;
  */
 export class UmbDataTypeStore extends UmbDataStoreBase<UmbDataTypeStoreItemType> {
 	
-	public readonly storeAlias = 'umbDataTypeStore';
+	public readonly storeAlias = STORE_ALIAS;
 
 	/**
 	 * @description - Request a Data Type by key. The Data Type is added to the store and is returned as an Observable.
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index 8ee254f491..e45e277e67 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -2,11 +2,9 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { css, html } from 'lit';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { customElement, property, state } from 'lit/decorators.js';
-import { EMPTY, of, switchMap } from 'rxjs';
 
 import { UmbDataTypeStore } from '../../../settings/data-types/data-type.store';
-import type { ContentProperty, ManifestTypes } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ContentProperty } from '@umbraco-cms/models';
 
 import '../entity-property/entity-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
@@ -33,7 +31,7 @@ export class UmbContentPropertyElement extends UmbLitElement {
 	}
 
 	@property()
-	value?: string;
+	value?: object;
 
 	@state()
 	private _propertyEditorUIAlias?: string;
@@ -56,17 +54,10 @@ export class UmbContentPropertyElement extends UmbLitElement {
 		if (!this._dataTypeStore || !this._property) return;
 
 		this.observe(
-			this._dataTypeStore.getByKey(this._property.dataTypeKey).pipe(
-				switchMap((dataType) => {
-					if (!dataType?.propertyEditorUIAlias) return EMPTY;
-					this._dataTypeData = dataType.data;
-					return umbExtensionsRegistry.getByAlias(dataType.propertyEditorUIAlias) ?? of(null);
-				})
-			),
-			(manifest) => {
-				if (manifest?.type === 'propertyEditorUI') {
-					this._propertyEditorUIAlias = manifest.alias;
-				}
+			this._dataTypeStore.getByKey(this._property.dataTypeKey),
+			(dataType) => {
+				this._dataTypeData = dataType?.data;
+				this._propertyEditorUIAlias = dataType?.propertyEditorUIAlias || undefined;
 			}
 		);
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
index 5817a831d4..9a734308e6 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
@@ -1,10 +1,11 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
-import { css, html, PropertyValueMap } from 'lit';
+import { css, html } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
+import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { UmbWorkspacePropertyContext } from './workspace-property.context';
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
 import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
-import type { ManifestPropertyEditorUI, ManifestTypes } from '@umbraco-cms/models';
+import type { DataTypePropertyData, ManifestPropertyEditorUI, ManifestTypes } from '@umbraco-cms/models';
 
 import '../../property-actions/shared/property-action-menu/property-action-menu.element';
 import 'src/backoffice/shared/components/workspace/workspace-property-layout/workspace-property-layout.element';
@@ -48,6 +49,12 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 		`,
 	];
 
+	@state()
+	private _label?:string;
+
+	@state()
+	private _description?:string;
+
 	/**
 	 * Label. Name of the property
 	 * @type {string}
@@ -55,7 +62,9 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 	 * @default ''
 	 */
 	@property({ type: String })
-	public label = '';
+	public set label(label: string) {
+		this._propertyContext.setLabel(label);
+	}
 
 	/**
 	 * Description: render a description underneath the label.
@@ -64,7 +73,9 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 	 * @default ''
 	 */
 	@property({ type: String })
-	public description = '';
+	public set description(description: string) {
+		this._propertyContext.setDescription(description);
+	}
 
 	/**
 	 * Alias
@@ -74,7 +85,9 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 	 * @default ''
 	 */
 	@property({ type: String })
-	public alias = '';
+	public set alias(alias: string) {
+		this._propertyContext.setAlias(alias);
+	}
 
 	/**
 	 * Property Editor UI Alias. Render the Property Editor UI registered for this alias.
@@ -101,7 +114,9 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 	 * @default ''
 	 */
 	@property({ type: Object, attribute: false })
-	public value?: any;
+	public set value(value: object) {
+		this._propertyContext.setValue(value);
+	}
 
 	/**
 	 * Config. Configuration to pass to the Property Editor UI. This is also the configuration data stored on the Data Type.
@@ -111,15 +126,16 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 	 * @default ''
 	 */
 	@property({ type: Object, attribute: false })
-	public config?: any;
+	public set config(value: DataTypePropertyData[]) {
+		this._propertyContext.setConfig(value);
+	}
 
 	// TODO: make interface for UMBPropertyEditorElement
 	@state()
 	private _element?: { value?: any; config?: any } & HTMLElement; // TODO: invent interface for propertyEditorUI.
 
 
-	// TODO: How to get proper default value?
-	private _propertyContext = new UmbWorkspacePropertyContext<string>("");
+	private _propertyContext = new UmbWorkspacePropertyContext(this);
 
 	private propertyEditorUIObserver?: UmbObserverController<ManifestTypes>;
 
@@ -127,66 +143,73 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 	constructor() {
 		super();
 
-		this.provideContext('umbPropertyContext',  this._propertyContext);
-		
-		this._observePropertyEditorUI();
+
+		this.observe(this._propertyContext.label, (label) => {
+			console.log("_propertyContext replied with label", label)
+			this._label = label;
+		});
+		this.observe(this._propertyContext.label, (description) => {
+			this._description = description;
+		});
+
+		// TODO: move event to context. maybe rename to property-editor-value-change.
 		this.addEventListener('property-editor-change', this._onPropertyEditorChange as any as EventListener);
+
+
 	}
 
 	private _observePropertyEditorUI() {
 		this.propertyEditorUIObserver?.destroy();
 		this.propertyEditorUIObserver = this.observe(umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUI', this.propertyEditorUIAlias), (manifest) => {
-			this._gotEditor(manifest);
+			this._gotEditorUI(manifest);
 		});
 	}
 
-	private _gotEditor(propertyEditorUIManifest?: ManifestPropertyEditorUI | null) {
-		if (!propertyEditorUIManifest) {
-			// TODO: if dataTypeKey didn't exist in store, we should do some nice UI.
+	private _gotEditorUI(manifest?: ManifestPropertyEditorUI | null) {
+		if (!manifest) {
+			// TODO: if propertyEditorUIAlias didn't exist in store, we should do some nice fail UI.
 			return;
 		}
 
-		createExtensionElement(propertyEditorUIManifest)
+		createExtensionElement(manifest)
 			.then((el) => {
 				const oldValue = this._element;
 				this._element = el;
 
-				if (this._element) {
-					this._element.value = this.value; // Be aware its duplicated code
-					this._element.config = this.config; // Be aware its duplicated code
-				}
+				this.observe(this._propertyContext.value, (value) => {
+					if(this._element) {
+						this._element.value = value;
+					}
+				});
+				this.observe(this._propertyContext.config, (config) => {
+					if(this._element) {
+						this._element.config = config;
+					}
+				});
+
 				this.requestUpdate('element', oldValue);
+				
 			})
 			.catch(() => {
 				// TODO: loading JS failed so we should do some nice UI. (This does only happen if extension has a js prop, otherwise we concluded that no source was needed resolved the load.)
 			});
 	}
 
+
+
 	private _onPropertyEditorChange = (e: CustomEvent) => {
 		const target = e.composedPath()[0] as any;
 		this.value = target.value;
+
+		// TODO: update context.
+
 		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 		e.stopPropagation();
 	};
 
-	/** Lit does not currently handle dynamic tag names, therefor we are doing some manual rendering */
-	// TODO: Refactor into a base class for dynamic-tag element? we will be using this a lot for extensions.
-	// This could potentially hook into Lit and parse all properties defined in the specific class on to the dynamic-element. (see static elementProperties: PropertyDeclarationMap;)
-	willUpdate(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>) {
-		super.willUpdate(changedProperties);
-
-		if (changedProperties.has('value') && this._element) {
-			this._element.value = this.value; // Be aware its duplicated code
-		}
-
-		if (changedProperties.has('config') && this._element) {
-			this._element.config = this.config; // Be aware its duplicated code
-		}
-	}
-
 	render() {
 		return html`
-			<umb-workspace-property-layout id="layout" label="${this.label}" description="${this.description}">
+			<umb-workspace-property-layout id="layout" label="${ifDefined(this._label)}" description="${ifDefined(this._description)}">
 				${this._renderPropertyActionMenu()}
 				<div slot="editor">${this._element}</div>
 			</umb-workspace-property-layout>
@@ -198,7 +221,7 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 			? html`<umb-property-action-menu
 					slot="property-action-menu"
 					id="property-action-menu"
-					.propertyEditorUIAlias="${this.propertyEditorUIAlias}"
+					.propertyEditorUIAlias="${this._propertyEditorUIAlias}"
 					.value="${this.value}"></umb-property-action-menu>`
 			: ''}`;
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
index 6b165db95c..a2aaa992f1 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
@@ -1,60 +1,114 @@
-import { BehaviorSubject, Observable } from "rxjs";
+import { distinctUntilChanged, map, Observable, of, shareReplay } from "rxjs";
+import type { DataTypeDetails } from "@umbraco-cms/models";
+import { UmbControllerHostInterface } from "src/core/controller/controller-host.mixin";
+import { naiveObjectComparison, UniqueBehaviorSubject } from "src/core/observable-api/unique-behavior-subject";
+import { UmbContextProviderController } from "src/core/context-api/provide/context-provider.controller";
+
+
+
+
+
+//TODO: Property-Context: move these methods out:
+type MappingFunction<T, R> = (mappable: T) => R;
+type MemoizationFunction<R> = (previousResult: R, currentResult: R) => boolean;
+
+function defaultMemoization(previousValue: any, currentValue: any): boolean {
+  if (typeof previousValue === 'object' && typeof currentValue === 'object') {
+    return naiveObjectComparison(previousValue, currentValue);
+  }
+  return previousValue === currentValue;
+}
+//TODO: Property-Context: rename this method.
+export function select$<T, R> (
+	source$: Observable<T>,
+	mappingFunction: MappingFunction<T, R>,
+	memoizationFunction?: MemoizationFunction<R>
+): Observable<R> {
+	return source$.pipe(
+	  map(mappingFunction),
+	  distinctUntilChanged(memoizationFunction || defaultMemoization),
+	  shareReplay(1) // TODO: investigate what happens if this was removed.
+	)
+}
+
+
+
 
 export type WorkspacePropertyData<ValueType> = {
-    alias?: string | null;
-    label?: string | null;
-    value?: ValueType | null;
+	alias?: string;
+	label?: string;
+	description?: string;
+	value?: ValueType | null;
+	config?: DataTypeDetails['data'];// This could potentially then come from hardcoded JS object and not the DataType store.
 };
 
-
-
 export class UmbWorkspacePropertyContext<ValueType> {
 
+	//private _host: UmbControllerHostInterface;
 
-	private _data: BehaviorSubject<WorkspacePropertyData<ValueType>>;
-	public readonly data: Observable<WorkspacePropertyData<ValueType>>;
+	private _data: UniqueBehaviorSubject<WorkspacePropertyData<ValueType>>;
+
+	public readonly alias: Observable<WorkspacePropertyData<ValueType>['alias']>;
+	public readonly label: Observable<WorkspacePropertyData<ValueType>['label']>;
+	public readonly description: Observable<WorkspacePropertyData<ValueType>['description']>;
+	public readonly value: Observable<WorkspacePropertyData<ValueType>['value']>;
+	public readonly config: Observable<WorkspacePropertyData<ValueType>['config']>;
 
 
-	#defaultValue!: ValueType | null;
+	constructor(host:UmbControllerHostInterface) {
 
-
-	constructor(defaultValue: ValueType | null) {
-
-		this.#defaultValue = defaultValue;
+		//this._host = host;
 
 		// TODO: How do we connect this value with parent context?
 		// Ensuring the property editor value-property is updated...
+		// How about consuming a workspace context? When received maybe assuming these will fit or test if it likes to accept this property..
 
-		this._data = new BehaviorSubject({value: defaultValue} as WorkspacePropertyData<ValueType>);
-		this.data = this._data.asObservable();
+		this._data = new UniqueBehaviorSubject({} as WorkspacePropertyData<ValueType>);
+
+		this.alias = select$(this._data, data => data.alias);
+		this.label = select$(this._data, data => data.label);
+		this.description = select$(this._data, data => data.description);
+		this.value = select$(this._data, data => data.value);
+		this.config = select$(this._data, data => data.config);
+
+
+		new UmbContextProviderController(host, 'umbPropertyContext', this);
+	
 	}
 
-    /*
-	hostConnected() {
-
-	}
-
-	hostDisconnected() {
-		
-	}
-    */
-
-	public getData() {
+	/*public getData() {
 		return this._data.getValue();
+	}*/
+
+
+
+	public update(data: Partial<WorkspacePropertyData<ValueType>>) {
+		this._data.next({ ...this._data.getValue(), ...data });
 	}
 
 	
-	public update(data: Partial<WorkspacePropertyData<ValueType>>) {
-		this._data.next({ ...this.getData(), ...data });
+	public setAlias(alias: WorkspacePropertyData<ValueType>['alias']) {
+		this.update({alias: alias});
+	}
+	public setLabel(label: WorkspacePropertyData<ValueType>['label']) {
+		this.update({label: label});
+	}
+	public setDescription(description: WorkspacePropertyData<ValueType>['description']) {
+		this.update({description: description});
+	}
+	public setValue(value: WorkspacePropertyData<ValueType>['value']) {
+		this.update({value: value});
+	}
+	public setConfig(config: WorkspacePropertyData<ValueType>['config']) {
+		this.update({config: config});
 	}
 
 	public resetValue() {
 		console.log("property context reset")
 		
-		this.update({value: this.#defaultValue})
+		this.update({value: null});
 	}
 
-
 	// TODO: how can we make sure to call this.
 	public destroy(): void {
 		this._data.unsubscribe();
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
index 2378ec6e56..c572bd38ac 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
@@ -1,7 +1,7 @@
 import { css, html } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, property } from 'lit/decorators.js';
-import { UmbWorkspacePropertyContext } from 'src/backoffice/shared/components/entity-property/workspace-property.context';
+import type { UmbWorkspacePropertyContext } from 'src/backoffice/shared/components/entity-property/workspace-property.context';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-property-editor-ui-textarea')
@@ -26,8 +26,11 @@ export class UmbPropertyEditorUITextareaElement extends UmbLitElement {
 	constructor() {
 		super();
 
-		this.consumeContext('umbPropertyContext', (instance) => {
+		this.consumeContext('umbPropertyContext', (instance: UmbWorkspacePropertyContext<string>) => {
 			this.propertyContext = instance;
+			this.observe(this.propertyContext.value, (value) => {
+				console.log("Context says value changed", value)
+			});
 		});
 	}
 
@@ -40,7 +43,8 @@ export class UmbPropertyEditorUITextareaElement extends UmbLitElement {
 		return html`
 			<uui-textarea .value=${this.value} @input=${this.onInput}></uui-textarea>
 			${this.config?.map((property: any) => html`<div>${property.alias}: ${property.value}</div>`)}
-			<button @click=${() => this.propertyContext?.resetValue()}>Reset</button>`;
+			<button @click=${() => this.propertyContext?.resetValue()}>Reset</button>
+			<button @click=${() => this.propertyContext?.setLabel('random' + Math.random()*10)}>Label change</button>`;
 	}
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts b/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts
index 251443bc37..cba74783f3 100644
--- a/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts
@@ -32,7 +32,7 @@ export const data: Array<DataTypeDetails> = [
 		parentKey: null,
 		isFolder: false,
 		propertyEditorModelAlias: 'Umbraco.TextArea',
-		propertyEditorUIAlias: 'Umb.PropertyEditorUI.Textarea',
+		propertyEditorUIAlias: 'Umb.PropertyEditorUI.TextArea',
 		data: [
 			{
 				alias: 'maxChars',
diff --git a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
new file mode 100644
index 0000000000..db6043a999
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
@@ -0,0 +1,37 @@
+import { BehaviorSubject } from "rxjs";
+
+
+function deepFreeze<T>(inObj: T): T {
+    Object.freeze(inObj);
+  
+    Object.getOwnPropertyNames(inObj).forEach(function (prop) {
+      // eslint-disable-next-line no-prototype-builtins
+      if ((inObj as any).hasOwnProperty(prop)
+        && (inObj as any)[prop] != null
+        && typeof (inObj as any)[prop] === 'object'
+        && !Object.isFrozen((inObj as any)[prop])) {
+          deepFreeze((inObj as any)[prop]);
+        }
+    });
+    return inObj;
+}
+
+
+export function naiveObjectComparison(objOne: any, objTwo: any): boolean {
+    return JSON.stringify(objOne) === JSON.stringify(objTwo);
+}
+
+
+
+export class UniqueBehaviorSubject<T> extends BehaviorSubject<T> {
+    constructor(initialData: T) {
+        super(deepFreeze(initialData));
+    }
+
+    next(newData: T): void {
+        const frozenData = deepFreeze(newData);
+        if (!naiveObjectComparison(frozenData, this.getValue())) {
+        super.next(frozenData);
+        }
+    }
+}
\ No newline at end of file

From 2544a67bc819abb80248705308b99b20d5932f01 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 16:31:43 +0100
Subject: [PATCH 02/47] clean up

---
 .../components/entity-property/workspace-property.context.ts    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
index a2aaa992f1..35a560c3f6 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
@@ -1,4 +1,4 @@
-import { distinctUntilChanged, map, Observable, of, shareReplay } from "rxjs";
+import { distinctUntilChanged, map, Observable, shareReplay } from "rxjs";
 import type { DataTypeDetails } from "@umbraco-cms/models";
 import { UmbControllerHostInterface } from "src/core/controller/controller-host.mixin";
 import { naiveObjectComparison, UniqueBehaviorSubject } from "src/core/observable-api/unique-behavior-subject";

From e9b91b6804ed6e68e0f3a6c69e5a5f7506d18a47 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 16:32:37 +0100
Subject: [PATCH 03/47] CreateObservablePart

---
 .../entity-property/workspace-property.context.ts   | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
index 35a560c3f6..405f2a031e 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
@@ -18,8 +18,7 @@ function defaultMemoization(previousValue: any, currentValue: any): boolean {
   }
   return previousValue === currentValue;
 }
-//TODO: Property-Context: rename this method.
-export function select$<T, R> (
+export function CreateObservablePart<T, R> (
 	source$: Observable<T>,
 	mappingFunction: MappingFunction<T, R>,
 	memoizationFunction?: MemoizationFunction<R>
@@ -65,11 +64,11 @@ export class UmbWorkspacePropertyContext<ValueType> {
 
 		this._data = new UniqueBehaviorSubject({} as WorkspacePropertyData<ValueType>);
 
-		this.alias = select$(this._data, data => data.alias);
-		this.label = select$(this._data, data => data.label);
-		this.description = select$(this._data, data => data.description);
-		this.value = select$(this._data, data => data.value);
-		this.config = select$(this._data, data => data.config);
+		this.alias = CreateObservablePart(this._data, data => data.alias);
+		this.label = CreateObservablePart(this._data, data => data.label);
+		this.description = CreateObservablePart(this._data, data => data.description);
+		this.value = CreateObservablePart(this._data, data => data.value);
+		this.config = CreateObservablePart(this._data, data => data.config);
 
 
 		new UmbContextProviderController(host, 'umbPropertyContext', this);

From 94aeb1f86d1c5c43f56950a86236542cfb94aaa4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 16:35:54 +0100
Subject: [PATCH 04/47] note

---
 .../components/entity-property/workspace-property.context.ts    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
index 405f2a031e..dc9e4fa241 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
@@ -26,7 +26,7 @@ export function CreateObservablePart<T, R> (
 	return source$.pipe(
 	  map(mappingFunction),
 	  distinctUntilChanged(memoizationFunction || defaultMemoization),
-	  shareReplay(1) // TODO: investigate what happens if this was removed.
+	  shareReplay(1) // TODO: investigate what happens if this was removed. (its suppose to only give the first subscriber the current value, but i want to test this)
 	)
 }
 

From 0212c9760632591bbec835a6b86835c70cf9fd52 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 16:40:50 +0100
Subject: [PATCH 05/47] notes and console.logs for next week

---
 .../components/entity-property/entity-property.element.ts       | 1 +
 .../workspace/workspace-content/workspace-content.element.ts    | 2 ++
 .../uis/textarea/property-editor-ui-textarea.element.ts         | 2 +-
 3 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
index 9a734308e6..21af1c3690 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
@@ -202,6 +202,7 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 		this.value = target.value;
 
 		// TODO: update context.
+		//TODO: Property-Context: Figure out the requirements for this. Cause currently the alias-prop(getter) is required, but its not obvious.
 
 		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 		e.stopPropagation();
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
index 25294a57b5..3c17210782 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
@@ -77,6 +77,8 @@ export class UmbWorkspaceContentElement extends UmbLitElement {
 	private _onPropertyValueChange = (e: Event) => {
 		const target = e.composedPath()[0] as any;
 
+		console.log("_onPropertyValueChange", target.alias, target);
+
 		// TODO: Set value.
 		const property = this._content?.properties.find((x) => x.alias === target.alias);
 		if (property) {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
index c572bd38ac..6f3cc9d3a4 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
@@ -29,7 +29,7 @@ export class UmbPropertyEditorUITextareaElement extends UmbLitElement {
 		this.consumeContext('umbPropertyContext', (instance: UmbWorkspacePropertyContext<string>) => {
 			this.propertyContext = instance;
 			this.observe(this.propertyContext.value, (value) => {
-				console.log("Context says value changed", value)
+				console.log("Context says value changed", value);
 			});
 		});
 	}

From 9a927c5ff8dc74f7bd0c8f67a4272ad5c35cfa76 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 18:58:02 +0100
Subject: [PATCH 06/47] rename entity-property to property

---
 .../content-property/content-property.element.ts     |  6 +++---
 .../entity-property.element.ts                       |  9 ++++-----
 .../entity-propery.stories.ts                        | 12 ++++++------
 .../workspace-property.context.ts                    |  0
 .../property-editor-config.element.ts                |  6 +++---
 .../textarea/property-editor-ui-textarea.element.ts  |  2 +-
 6 files changed, 17 insertions(+), 18 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/backoffice/shared/components/{entity-property => property}/entity-property.element.ts (96%)
 rename src/Umbraco.Web.UI.Client/src/backoffice/shared/components/{entity-property => property}/entity-propery.stories.ts (56%)
 rename src/Umbraco.Web.UI.Client/src/backoffice/shared/components/{entity-property => property}/workspace-property.context.ts (100%)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index e45e277e67..555af8a7e8 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -6,7 +6,7 @@ import { customElement, property, state } from 'lit/decorators.js';
 import { UmbDataTypeStore } from '../../../settings/data-types/data-type.store';
 import type { ContentProperty } from '@umbraco-cms/models';
 
-import '../entity-property/entity-property.element';
+import '../property/entity-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-content-property')
@@ -63,13 +63,13 @@ export class UmbContentPropertyElement extends UmbLitElement {
 	}
 
 	render() {
-		return html`<umb-entity-property
+		return html`<umb-property
 			label=${ifDefined(this.property?.label)}
 			description=${ifDefined(this.property?.description)}
 			alias="${ifDefined(this.property?.alias)}"
 			property-editor-ui-alias="${ifDefined(this._propertyEditorUIAlias)}"
 			.value="${this.value}"
-			.config="${this._dataTypeData}"></umb-entity-property>`;
+			.config="${this._dataTypeData}"></umb-property>`;
 	}
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-property.element.ts
similarity index 96%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-property.element.ts
index 21af1c3690..5337cd842a 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-property.element.ts
@@ -13,14 +13,13 @@ import { UmbObserverController } from 'src/core/observable-api/observer.controll
 import { UmbLitElement } from '@umbraco-cms/element';
 
 /**
- *  @element umb-entity-property
+ *  @element umb-property
  *  @description - Component for displaying a entity property. The Element will render a Property Editor based on the Property Editor UI alias passed to the element.
  *  The element will also render all Property Actions related to the Property Editor.
  */
 
-// TODO: get rid of the other mixins:
-@customElement('umb-entity-property')
-export class UmbEntityPropertyElement extends UmbLitElement {
+@customElement('umb-property')
+export class UmbPropertyElement extends UmbLitElement {
 	static styles = [
 		UUITextStyles,
 		css`
@@ -230,6 +229,6 @@ export class UmbEntityPropertyElement extends UmbLitElement {
 
 declare global {
 	interface HTMLElementTagNameMap {
-		'umb-entity-property': UmbEntityPropertyElement;
+		'umb-property': UmbPropertyElement;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-propery.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-propery.stories.ts
similarity index 56%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-propery.stories.ts
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-propery.stories.ts
index f0e4721217..60d407b46a 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/entity-propery.stories.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-propery.stories.ts
@@ -1,20 +1,20 @@
 import { Meta, Story } from '@storybook/web-components';
 import { html } from 'lit-html';
 
-import type { UmbEntityPropertyElement } from './entity-property.element';
+import type { UmbPropertyElement } from './entity-property.element';
 import './entity-property.element';
 
 export default {
 	title: 'Components/Entity Property',
-	component: 'umb-entity-property',
-	id: 'umb-entity-property',
+	component: 'umb-property',
+	id: 'umb-property',
 } as Meta;
 
-export const AAAOverview: Story<UmbEntityPropertyElement> = () =>
-	html` <umb-entity-property
+export const AAAOverview: Story<UmbPropertyElement> = () =>
+	html` <umb-property
 		label="Property"
 		description="Description"
 		alias="textProperty"
 		property-editor-ui-alias="Umb.PropertyEditorUI.TextBox"
-		.value="${'Hello'}"></umb-entity-property>`;
+		.value="${'Hello'}"></umb-property>`;
 AAAOverview.storyName = 'Overview';
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/entity-property/workspace-property.context.ts
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
index f6dc453062..3a3e951ed3 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
@@ -5,7 +5,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import type { PropertyEditorConfigDefaultData, PropertyEditorConfigProperty } from '@umbraco-cms/models';
 import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 
-import '../../../components/entity-property/entity-property.element';
+import '../../../components/property/entity-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 /**
@@ -104,12 +104,12 @@ export class UmbPropertyEditorConfigElement extends UmbLitElement {
 				? html`
 						${this._properties?.map(
 							(property) => html`
-								<umb-entity-property
+								<umb-property
 									label="${property.label}"
 									description="${ifDefined(property.description)}"
 									alias="${property.alias}"
 									property-editor-ui-alias="${property.propertyEditorUI}"
-									.value=${this._getValue(property)}></umb-entity-property>
+									.value=${this._getValue(property)}></umb-property>
 							`
 						)}
 				  `
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
index 6f3cc9d3a4..098c8a750e 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
@@ -1,7 +1,7 @@
 import { css, html } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, property } from 'lit/decorators.js';
-import type { UmbWorkspacePropertyContext } from 'src/backoffice/shared/components/entity-property/workspace-property.context';
+import type { UmbWorkspacePropertyContext } from 'src/backoffice/shared/components/property/workspace-property.context';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-property-editor-ui-textarea')

From 1cf31a7cb0f9d16533073130f28aa45ccdecd170 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 19:00:37 +0100
Subject: [PATCH 07/47] rename files

---
 .../components/content-property/content-property.element.ts   | 2 +-
 .../{entity-property.element.ts => property.element.ts}       | 4 ++--
 .../{entity-propery.stories.ts => propery.stories.ts}         | 4 ++--
 .../property-editor-config/property-editor-config.element.ts  | 2 +-
 4 files changed, 6 insertions(+), 6 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/{entity-property.element.ts => property.element.ts} (99%)
 rename src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/{entity-propery.stories.ts => propery.stories.ts} (82%)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index 555af8a7e8..9f3bfca1ae 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -6,7 +6,7 @@ import { customElement, property, state } from 'lit/decorators.js';
 import { UmbDataTypeStore } from '../../../settings/data-types/data-type.store';
 import type { ContentProperty } from '@umbraco-cms/models';
 
-import '../property/entity-property.element';
+import '../property/property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-content-property')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
similarity index 99%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-property.element.ts
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
index 5337cd842a..972bcfcd49 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
@@ -108,12 +108,12 @@ export class UmbPropertyElement extends UmbLitElement {
 	/**
 	 * Property Editor UI Alias. Render the Property Editor UI registered for this alias.
 	 * @public
-	 * @type {string}
+	 * @type {object}
 	 * @attr
 	 * @default ''
 	 */
 	@property({ type: Object, attribute: false })
-	public set value(value: object) {
+	public set value(value: object | string) {
 		this._propertyContext.setValue(value);
 	}
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-propery.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/propery.stories.ts
similarity index 82%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-propery.stories.ts
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/propery.stories.ts
index 60d407b46a..2f71c32d96 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/entity-propery.stories.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/propery.stories.ts
@@ -1,8 +1,8 @@
 import { Meta, Story } from '@storybook/web-components';
 import { html } from 'lit-html';
 
-import type { UmbPropertyElement } from './entity-property.element';
-import './entity-property.element';
+import type { UmbPropertyElement } from './property.element';
+import './property.element';
 
 export default {
 	title: 'Components/Entity Property',
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
index 3a3e951ed3..5e85d4d446 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
@@ -5,7 +5,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import type { PropertyEditorConfigDefaultData, PropertyEditorConfigProperty } from '@umbraco-cms/models';
 import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 
-import '../../../components/property/entity-property.element';
+import '../../../components/property/property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 /**

From ffc4196220f03247af250a784f1e00b2af913592 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 19:01:40 +0100
Subject: [PATCH 08/47] change jsDocs

---
 .../backoffice/shared/components/property/property.element.ts   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
index 972bcfcd49..53de152dc0 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
@@ -110,7 +110,7 @@ export class UmbPropertyElement extends UmbLitElement {
 	 * @public
 	 * @type {object}
 	 * @attr
-	 * @default ''
+	 * @default undefined
 	 */
 	@property({ type: Object, attribute: false })
 	public set value(value: object | string) {

From 90ea3802b4dbdb66b9ef648861288455dbf1d2bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 19:02:37 +0100
Subject: [PATCH 09/47] remove console.log

---
 .../shared/components/property/workspace-property.context.ts    | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
index dc9e4fa241..d1cfea7707 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
@@ -103,8 +103,6 @@ export class UmbWorkspacePropertyContext<ValueType> {
 	}
 
 	public resetValue() {
-		console.log("property context reset")
-		
 		this.update({value: null});
 	}
 

From 309a0d423b317dcb72cd209df461e4902e1c1795 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 19:05:45 +0100
Subject: [PATCH 10/47] simpler code for a rxJS context

---
 .../property/workspace-property.context.ts    | 25 +++++++------------
 1 file changed, 9 insertions(+), 16 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
index d1cfea7707..7d9fdac5dd 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
@@ -45,14 +45,15 @@ export class UmbWorkspacePropertyContext<ValueType> {
 
 	//private _host: UmbControllerHostInterface;
 
-	private _data: UniqueBehaviorSubject<WorkspacePropertyData<ValueType>>;
+	private _providerController: UmbContextProviderController;
 
-	public readonly alias: Observable<WorkspacePropertyData<ValueType>['alias']>;
-	public readonly label: Observable<WorkspacePropertyData<ValueType>['label']>;
-	public readonly description: Observable<WorkspacePropertyData<ValueType>['description']>;
-	public readonly value: Observable<WorkspacePropertyData<ValueType>['value']>;
-	public readonly config: Observable<WorkspacePropertyData<ValueType>['config']>;
+	private _data: UniqueBehaviorSubject<WorkspacePropertyData<ValueType>> = new UniqueBehaviorSubject({} as WorkspacePropertyData<ValueType>);
 
+	public readonly alias = CreateObservablePart(this._data, data => data.alias);
+	public readonly label = CreateObservablePart(this._data, data => data.label);
+	public readonly description = CreateObservablePart(this._data, data => data.description);
+	public readonly value = CreateObservablePart(this._data, data => data.value);
+	public readonly config = CreateObservablePart(this._data, data => data.config);
 
 	constructor(host:UmbControllerHostInterface) {
 
@@ -62,16 +63,7 @@ export class UmbWorkspacePropertyContext<ValueType> {
 		// Ensuring the property editor value-property is updated...
 		// How about consuming a workspace context? When received maybe assuming these will fit or test if it likes to accept this property..
 
-		this._data = new UniqueBehaviorSubject({} as WorkspacePropertyData<ValueType>);
-
-		this.alias = CreateObservablePart(this._data, data => data.alias);
-		this.label = CreateObservablePart(this._data, data => data.label);
-		this.description = CreateObservablePart(this._data, data => data.description);
-		this.value = CreateObservablePart(this._data, data => data.value);
-		this.config = CreateObservablePart(this._data, data => data.config);
-
-
-		new UmbContextProviderController(host, 'umbPropertyContext', this);
+		this._providerController = new UmbContextProviderController(host, 'umbPropertyContext', this);
 	
 	}
 
@@ -109,6 +101,7 @@ export class UmbWorkspacePropertyContext<ValueType> {
 	// TODO: how can we make sure to call this.
 	public destroy(): void {
 		this._data.unsubscribe();
+		this._providerController.destroy(); // This would also be handled by the controller host, but if someone wanted to replace/remove this context without the host being destroyed. Then we have clean up out selfs here.
 	}
 
 }

From aa0fe613caaaf74d2d04a1456a730810c2fa12fc Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri, 6 Jan 2023 18:10:39 +0000
Subject: [PATCH 11/47] Bump @playwright/test from 1.29.1 to 1.29.2

Bumps [@playwright/test](https://github.com/Microsoft/playwright) from 1.29.1 to 1.29.2.
- [Release notes](https://github.com/Microsoft/playwright/releases)
- [Commits](https://github.com/Microsoft/playwright/compare/v1.29.1...v1.29.2)

---
updated-dependencies:
- dependency-name: "@playwright/test"
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 src/Umbraco.Web.UI.Client/package-lock.json | 30 ++++++++++-----------
 src/Umbraco.Web.UI.Client/package.json      |  2 +-
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/package-lock.json b/src/Umbraco.Web.UI.Client/package-lock.json
index 6606d01495..eb440f0fda 100644
--- a/src/Umbraco.Web.UI.Client/package-lock.json
+++ b/src/Umbraco.Web.UI.Client/package-lock.json
@@ -29,7 +29,7 @@
 				"@babel/core": "^7.20.12",
 				"@mdx-js/react": "^2.2.1",
 				"@open-wc/testing": "^3.1.7",
-				"@playwright/test": "^1.29.1",
+				"@playwright/test": "^1.29.2",
 				"@storybook/addon-a11y": "^6.5.15",
 				"@storybook/addon-actions": "^6.5.14",
 				"@storybook/addon-essentials": "^6.5.15",
@@ -2897,13 +2897,13 @@
 			"dev": true
 		},
 		"node_modules/@playwright/test": {
-			"version": "1.29.1",
-			"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.29.1.tgz",
-			"integrity": "sha512-iQxk2DX5U9wOGV3+/Jh9OHPsw5H3mleUL2S4BgQuwtlAfK3PnKvn38m4Rg9zIViGHVW24opSm99HQm/UFLEy6w==",
+			"version": "1.29.2",
+			"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.29.2.tgz",
+			"integrity": "sha512-+3/GPwOgcoF0xLz/opTnahel1/y42PdcgZ4hs+BZGIUjtmEFSXGg+nFoaH3NSmuc7a6GSFwXDJ5L7VXpqzigNg==",
 			"dev": true,
 			"dependencies": {
 				"@types/node": "*",
-				"playwright-core": "1.29.1"
+				"playwright-core": "1.29.2"
 			},
 			"bin": {
 				"playwright": "cli.js"
@@ -2913,9 +2913,9 @@
 			}
 		},
 		"node_modules/@playwright/test/node_modules/playwright-core": {
-			"version": "1.29.1",
-			"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.29.1.tgz",
-			"integrity": "sha512-20Ai3d+lMkWpI9YZYlxk8gxatfgax5STW8GaMozAHwigLiyiKQrdkt7gaoT9UQR8FIVDg6qVXs9IoZUQrDjIIg==",
+			"version": "1.29.2",
+			"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.29.2.tgz",
+			"integrity": "sha512-94QXm4PMgFoHAhlCuoWyaBYKb92yOcGVHdQLoxQ7Wjlc7Flg4aC/jbFW7xMR52OfXMVkWicue4WXE7QEegbIRA==",
 			"dev": true,
 			"bin": {
 				"playwright": "cli.js"
@@ -30476,19 +30476,19 @@
 			}
 		},
 		"@playwright/test": {
-			"version": "1.29.1",
-			"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.29.1.tgz",
-			"integrity": "sha512-iQxk2DX5U9wOGV3+/Jh9OHPsw5H3mleUL2S4BgQuwtlAfK3PnKvn38m4Rg9zIViGHVW24opSm99HQm/UFLEy6w==",
+			"version": "1.29.2",
+			"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.29.2.tgz",
+			"integrity": "sha512-+3/GPwOgcoF0xLz/opTnahel1/y42PdcgZ4hs+BZGIUjtmEFSXGg+nFoaH3NSmuc7a6GSFwXDJ5L7VXpqzigNg==",
 			"dev": true,
 			"requires": {
 				"@types/node": "*",
-				"playwright-core": "1.29.1"
+				"playwright-core": "1.29.2"
 			},
 			"dependencies": {
 				"playwright-core": {
-					"version": "1.29.1",
-					"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.29.1.tgz",
-					"integrity": "sha512-20Ai3d+lMkWpI9YZYlxk8gxatfgax5STW8GaMozAHwigLiyiKQrdkt7gaoT9UQR8FIVDg6qVXs9IoZUQrDjIIg==",
+					"version": "1.29.2",
+					"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.29.2.tgz",
+					"integrity": "sha512-94QXm4PMgFoHAhlCuoWyaBYKb92yOcGVHdQLoxQ7Wjlc7Flg4aC/jbFW7xMR52OfXMVkWicue4WXE7QEegbIRA==",
 					"dev": true
 				}
 			}
diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 2f0ec3c4c4..34909907be 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -74,7 +74,7 @@
 		"@babel/core": "^7.20.12",
 		"@mdx-js/react": "^2.2.1",
 		"@open-wc/testing": "^3.1.7",
-		"@playwright/test": "^1.29.1",
+		"@playwright/test": "^1.29.2",
 		"@storybook/addon-a11y": "^6.5.15",
 		"@storybook/addon-actions": "^6.5.14",
 		"@storybook/addon-essentials": "^6.5.15",

From d951d4072047ad5ebbb0608203a63e390d04580e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 19:10:49 +0100
Subject: [PATCH 12/47] simpler argument name

---
 .../property-action-menu/property-action-menu.element.ts      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
index ef4caef8e7..8e232f5e76 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
@@ -75,8 +75,8 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 						)
 					)
 				),
-			(propertyActionManifests) => {
-				this._actions = propertyActionManifests;
+			(manifests) => {
+				this._actions = manifests;
 			}
 		);
 	}

From 767998e37bd96c53c6a02a595726b0d2e15591f7 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri, 6 Jan 2023 18:11:41 +0000
Subject: [PATCH 13/47] Bump element-internals-polyfill from 1.1.17 to 1.1.18

Bumps [element-internals-polyfill](https://github.com/calebdwilliams/element-internals-polyfill) from 1.1.17 to 1.1.18.
- [Release notes](https://github.com/calebdwilliams/element-internals-polyfill/releases)
- [Changelog](https://github.com/calebdwilliams/element-internals-polyfill/blob/main/CHANGELOG.md)
- [Commits](https://github.com/calebdwilliams/element-internals-polyfill/compare/v1.1.17...v1.1.18)

---
updated-dependencies:
- dependency-name: element-internals-polyfill
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 src/Umbraco.Web.UI.Client/package-lock.json | 14 +++++++-------
 src/Umbraco.Web.UI.Client/package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/package-lock.json b/src/Umbraco.Web.UI.Client/package-lock.json
index 6606d01495..168aefb9f0 100644
--- a/src/Umbraco.Web.UI.Client/package-lock.json
+++ b/src/Umbraco.Web.UI.Client/package-lock.json
@@ -17,7 +17,7 @@
 				"@umbraco-ui/uui-modal-container": "file:umbraco-ui-uui-modal-container-0.0.0.tgz",
 				"@umbraco-ui/uui-modal-dialog": "file:umbraco-ui-uui-modal-dialog-0.0.0.tgz",
 				"@umbraco-ui/uui-modal-sidebar": "file:umbraco-ui-uui-modal-sidebar-0.0.0.tgz",
-				"element-internals-polyfill": "^1.1.17",
+				"element-internals-polyfill": "^1.1.18",
 				"lit": "^2.5.0",
 				"lodash": "^4.17.21",
 				"openapi-typescript-fetch": "^1.1.3",
@@ -11810,9 +11810,9 @@
 			"dev": true
 		},
 		"node_modules/element-internals-polyfill": {
-			"version": "1.1.17",
-			"resolved": "https://registry.npmjs.org/element-internals-polyfill/-/element-internals-polyfill-1.1.17.tgz",
-			"integrity": "sha512-sMDJyJiwvcHB6wLnyG+y/9FRxi/9OyI8bmjyw18K6b5iVlBjmA5CJVTFz4K2I7R53yqevK8WkTrfBmSHJXH9Rw=="
+			"version": "1.1.18",
+			"resolved": "https://registry.npmjs.org/element-internals-polyfill/-/element-internals-polyfill-1.1.18.tgz",
+			"integrity": "sha512-ULyzpzblTZfMPEt83NphWeREajgaKQBNSTXvNBcjTeriIy7GsuAHFUZ0CpHnlDIVdvPlWcewfu7n7vVfiifZlQ=="
 		},
 		"node_modules/element-resize-detector": {
 			"version": "1.2.4",
@@ -37472,9 +37472,9 @@
 			"dev": true
 		},
 		"element-internals-polyfill": {
-			"version": "1.1.17",
-			"resolved": "https://registry.npmjs.org/element-internals-polyfill/-/element-internals-polyfill-1.1.17.tgz",
-			"integrity": "sha512-sMDJyJiwvcHB6wLnyG+y/9FRxi/9OyI8bmjyw18K6b5iVlBjmA5CJVTFz4K2I7R53yqevK8WkTrfBmSHJXH9Rw=="
+			"version": "1.1.18",
+			"resolved": "https://registry.npmjs.org/element-internals-polyfill/-/element-internals-polyfill-1.1.18.tgz",
+			"integrity": "sha512-ULyzpzblTZfMPEt83NphWeREajgaKQBNSTXvNBcjTeriIy7GsuAHFUZ0CpHnlDIVdvPlWcewfu7n7vVfiifZlQ=="
 		},
 		"element-resize-detector": {
 			"version": "1.2.4",
diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 2f0ec3c4c4..3475a01ac4 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -62,7 +62,7 @@
 		"@umbraco-ui/uui-modal-sidebar": "file:umbraco-ui-uui-modal-sidebar-0.0.0.tgz",
 		"@umbraco-ui/uui-color-swatches": "file:umbraco-ui-uui-color-swatches-2.0.0.tgz",
 		"@umbraco-ui/uui-color-swatch": "file:umbraco-ui-uui-color-swatch-0.0.0.tgz",
-		"element-internals-polyfill": "^1.1.17",
+		"element-internals-polyfill": "^1.1.18",
 		"lit": "^2.5.0",
 		"lodash": "^4.17.21",
 		"openapi-typescript-fetch": "^1.1.3",

From e1d85df27c8d3f1864b6e0e7b6ea9cce9c1eff00 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 19:14:49 +0100
Subject: [PATCH 14/47] move responsibility for providing menu context

---
 .../property-action-menu/property-action-menu.context.ts   | 7 +++++++
 .../property-action-menu/property-action-menu.element.ts   | 4 +---
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts
index 1face67dbd..1cfbbac557 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts
@@ -1,9 +1,16 @@
 import { Observable, ReplaySubject } from 'rxjs';
+import { UmbContextProviderController } from 'src/core/context-api/provide/context-provider.controller';
+import { UmbControllerHostInterface } from 'src/core/controller/controller-host.mixin';
 
 export class UmbPropertyActionMenuContext {
+
 	private _isOpen: ReplaySubject<boolean> = new ReplaySubject(1);
 	public readonly isOpen: Observable<boolean> = this._isOpen.asObservable();
 
+	constructor(host: UmbControllerHostInterface) {
+		new UmbContextProviderController(host, 'umbPropertyActionMenu', this);
+	}
+
 	open() {
 		this._isOpen.next(true);
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
index 8e232f5e76..8c92aa08b9 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
@@ -53,15 +53,13 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 	@state()
 	private _open = false;
 
-	private _propertyActionMenuContext = new UmbPropertyActionMenuContext();
+	private _propertyActionMenuContext = new UmbPropertyActionMenuContext(this);
 
 	connectedCallback(): void {
 		super.connectedCallback();
 
 		this._observePropertyActions();
 		this._observePropertyActionMenuOpenState();
-
-		this.provideContext('umbPropertyActionMenu', this._propertyActionMenuContext);
 	}
 
 	private _observePropertyActions() {

From 6c9f17c2a46c1467c50770465be0233d44d3a206 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 19:16:35 +0100
Subject: [PATCH 15/47] simpler render method

---
 .../property-action-menu.element.ts           | 47 +++++++++----------
 1 file changed, 23 insertions(+), 24 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
index 8c92aa08b9..5510e8c53f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
@@ -95,30 +95,29 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 	}
 
 	render() {
-		return html`
-			${this._actions.length > 0
-				? html`
-						<uui-popover id="popover" placement="bottom-start" .open=${this._open} @close="${this._handleClose}">
-							<uui-button
-								id="popover-trigger"
-								slot="trigger"
-								look="secondary"
-								label="More"
-								@click="${this._toggleMenu}"
-								compact>
-								<uui-symbol-more id="more-symbol"></uui-symbol-more>
-							</uui-button>
+		if (this._actions.length > 0) {
+			html`
+				<uui-popover id="popover" placement="bottom-start" .open=${this._open} @close="${this._handleClose}">
+					<uui-button
+						id="popover-trigger"
+						slot="trigger"
+						look="secondary"
+						label="More"
+						@click="${this._toggleMenu}"
+						compact>
+						<uui-symbol-more id="more-symbol"></uui-symbol-more>
+					</uui-button>
 
-							<div slot="popover" id="dropdown">
-								${this._actions.map(
-									(action) => html`
-										<umb-property-action .propertyAction=${action} .value="${this.value}"></umb-property-action>
-									`
-								)}
-							</div>
-						</uui-popover>
-				  `
-				: ''}
-		`;
+					<div slot="popover" id="dropdown">
+						${this._actions.map(
+							(action) => html`
+								<umb-property-action .propertyAction=${action} .value="${this.value}"></umb-property-action>
+							`
+						)}
+					</div>
+				</uui-popover>
+			`;
+		}
+		return '';
 	}
 }

From 0453bd293bf9c886d6c8d412fc8139f504472842 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 20:14:54 +0100
Subject: [PATCH 16/47] refactoring of property -> context communication

---
 .../content-property.element.ts               |  2 +-
 .../components/property/property.element.ts   | 17 +++---
 .../property/workspace-property.context.ts    |  6 +++
 .../workspace-content.context.ts              | 53 ++++++++++++++++---
 .../workspace-content.element.ts              | 48 -----------------
 .../clear/property-action-clear.element.ts    |  2 +-
 .../property-action-menu.context.ts           | 12 +++--
 .../property-action-menu.element.ts           | 49 +++++++++--------
 ...operty-editor-ui-content-picker.element.ts |  2 +-
 .../property-editor-ui-number.element.ts      |  2 +-
 .../property-editor-ui-text-box.element.ts    |  2 +-
 .../property-editor-ui-textarea.element.ts    |  2 +-
 .../src/core/models/index.ts                  | 10 +++-
 13 files changed, 111 insertions(+), 96 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index 9f3bfca1ae..90f55497ca 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -31,7 +31,7 @@ export class UmbContentPropertyElement extends UmbLitElement {
 	}
 
 	@property()
-	value?: object;
+	value?: object | string;
 
 	@state()
 	private _propertyEditorUIAlias?: string;
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
index 53de152dc0..45ba7d01ec 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
@@ -84,6 +84,9 @@ export class UmbPropertyElement extends UmbLitElement {
 	 * @default ''
 	 */
 	@property({ type: String })
+	public get alias(): string {
+		return this._propertyContext.getAlias() || '';
+	}
 	public set alias(alias: string) {
 		this._propertyContext.setAlias(alias);
 	}
@@ -108,11 +111,14 @@ export class UmbPropertyElement extends UmbLitElement {
 	/**
 	 * Property Editor UI Alias. Render the Property Editor UI registered for this alias.
 	 * @public
-	 * @type {object}
+	 * @type {object | string}
 	 * @attr
 	 * @default undefined
 	 */
-	@property({ type: Object, attribute: false })
+	@property({ attribute: false })
+	public get value() {
+		return this._propertyContext.getValue() as any;
+	}
 	public set value(value: object | string) {
 		this._propertyContext.setValue(value);
 	}
@@ -144,7 +150,6 @@ export class UmbPropertyElement extends UmbLitElement {
 
 
 		this.observe(this._propertyContext.label, (label) => {
-			console.log("_propertyContext replied with label", label)
 			this._label = label;
 		});
 		this.observe(this._propertyContext.label, (description) => {
@@ -152,7 +157,7 @@ export class UmbPropertyElement extends UmbLitElement {
 		});
 
 		// TODO: move event to context. maybe rename to property-editor-value-change.
-		this.addEventListener('property-editor-change', this._onPropertyEditorChange as any as EventListener);
+		this.addEventListener('property-editor-value-change', this._onPropertyEditorChange as any as EventListener);
 
 
 	}
@@ -200,9 +205,9 @@ export class UmbPropertyElement extends UmbLitElement {
 		const target = e.composedPath()[0] as any;
 		this.value = target.value;
 
-		// TODO: update context.
 		//TODO: Property-Context: Figure out the requirements for this. Cause currently the alias-prop(getter) is required, but its not obvious.
-
+		
+		// TODO: Confusing with the little detail of the event name that changed here..
 		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 		e.stopPropagation();
 	};
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
index 7d9fdac5dd..836c8941dd 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
@@ -81,6 +81,9 @@ export class UmbWorkspacePropertyContext<ValueType> {
 	public setAlias(alias: WorkspacePropertyData<ValueType>['alias']) {
 		this.update({alias: alias});
 	}
+	public getAlias() {
+		return this._data.getValue().alias;
+	}
 	public setLabel(label: WorkspacePropertyData<ValueType>['label']) {
 		this.update({label: label});
 	}
@@ -90,6 +93,9 @@ export class UmbWorkspacePropertyContext<ValueType> {
 	public setValue(value: WorkspacePropertyData<ValueType>['value']) {
 		this.update({value: value});
 	}
+	public getValue() {
+		return this._data.getValue().value;
+	}
 	public setConfig(config: WorkspacePropertyData<ValueType>['config']) {
 		this.update({config: config});
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 9d491762c9..8586e736c5 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -3,16 +3,16 @@ import { UmbNotificationService } from '../../../../../core/notification';
 import { UmbNotificationDefaultData } from '../../../../../core/notification/layouts/default';
 import { UmbWorkspaceContext } from '../workspace-context/workspace.context';
 import { UmbNodeStoreBase } from '@umbraco-cms/stores/store';
-import { ContentTreeItem } from '@umbraco-cms/backend-api';
 import { UmbControllerHostInterface } from 'src/core/controller/controller-host.mixin';
 import { UmbContextConsumerController } from 'src/core/context-api/consume/context-consumer.controller';
 import { UmbObserverController } from '@umbraco-cms/observable-api';
 import { UmbContextProviderController } from 'src/core/context-api/provide/context-provider.controller';
+import type { ContentDetails } from '@umbraco-cms/models';
 
 // TODO: Consider if its right to have this many class-inheritance of WorkspaceContext
 // TODO: Could we extract this code into a 'Manager' of its own, which will be instantiated by the concrete Workspace Context. This will be more transparent and 'reuseable'
 export class UmbWorkspaceContentContext<
-	ContentTypeType extends ContentTreeItem = ContentTreeItem,
+	ContentTypeType extends ContentDetails = ContentDetails,
 	StoreType extends UmbNodeStoreBase<ContentTypeType> = UmbNodeStoreBase<ContentTypeType>
 > extends UmbWorkspaceContext<ContentTypeType> {
 
@@ -34,6 +34,10 @@ export class UmbWorkspaceContentContext<
 	) {
 		super(host, defaultData);
 
+		this.entityType = entityType;
+
+		host.addEventListener('property-value-change', this._onPropertyValueChange);
+
 		new UmbContextConsumerController(
 			host,
 			'umbNotificationService',
@@ -42,15 +46,13 @@ export class UmbWorkspaceContentContext<
 			}
 		);
 
-		this.entityType = entityType;
-
 		new UmbContextConsumerController(host, storeAlias, (_instance: StoreType) => {
 			this._store = _instance;
 			if (!this._store) {
 				// TODO: make sure to break the application in a good way.
 				return;
 			}
-			this._readyToLoad();
+			this._observeStore();
 
 			// TODO: first provide when we have umbNotificationService as well.
 			new UmbContextProviderController(this._host, 'umbWorkspaceContext', this);
@@ -60,7 +62,7 @@ export class UmbWorkspaceContentContext<
 	load(entityKey: string) {
 		this.#isNew = false;
 		this.entityKey = entityKey;
-		this._readyToLoad();
+		this._observeStore();
 	}
 
 	create(parentKey: string | null) {
@@ -69,7 +71,7 @@ export class UmbWorkspaceContentContext<
 		console.log("I'm new, and I will be created under ", parentKey)
 	}
 
-	protected _readyToLoad(): void {
+	protected _observeStore(): void {
 		if(!this._store || !this.entityKey) {
 			return;
 		}
@@ -88,6 +90,43 @@ export class UmbWorkspaceContentContext<
 		return this._store;
 	}
 
+
+
+
+	
+	//TODO: Property-Context: I would like ot investigate how this would work as methods. That do require that a property-context gets the workspace context. But this connection would be more safe.
+	private _onPropertyValueChange = (e: Event) => {
+		const target = e.composedPath()[0] as any;
+
+		console.log("_onPropertyValueChange context", target.alias, target);
+
+		const property = this.getData().data.find((x) => x.alias === target.alias);
+		if (property) {
+			this._setPropertyValue(property.alias, target.value);
+		} else {
+			console.error('property was not found', target.alias);
+		}
+
+		// We need to stop the event, so it does not bubble up to parent workspace contexts.
+		e.stopPropagation();
+	};
+
+	private _setPropertyValue(alias: string, value: unknown) {
+
+		console.log("about to change prop", this.getData());
+		const newDataSet = this.getData().data.map((entry) => {
+			if (entry.alias === alias) {
+				return {alias: alias, value: value};
+			}
+			return entry;
+		});
+
+
+		const part = {data: newDataSet};
+		console.log("result", part)
+		this.update(part as Partial<ContentTypeType>);
+	}
+
 	public save(): Promise<void> {
 		if(!this._store) {
 			// TODO: more beautiful error:
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
index 3c17210782..4e2ae00635 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
@@ -49,54 +49,6 @@ export class UmbWorkspaceContentElement extends UmbLitElement {
 	@property()
 	alias!: string;
 
-	// TODO: use a NodeDetails type here:
-	@state()
-	_content?: ContentTypeTypes;
-
-	private _workspaceContext?: UmbWorkspaceContentContext<ContentTypeTypes, UmbNodeStoreBase<ContentTypeTypes>>;
-
-	constructor() {
-		super();
-
-		this.consumeContext('umbWorkspaceContext', (instance) => {
-			this._workspaceContext = instance;
-			this._observeWorkspace();
-		});
-
-		this.addEventListener('property-value-change', this._onPropertyValueChange);
-	}
-
-	private async _observeWorkspace() {
-		if (!this._workspaceContext) return;
-
-		this.observe(this._workspaceContext.data.pipe(distinctUntilChanged()), (data) => {
-			this._content = data;
-		});
-	}
-
-	private _onPropertyValueChange = (e: Event) => {
-		const target = e.composedPath()[0] as any;
-
-		console.log("_onPropertyValueChange", target.alias, target);
-
-		// TODO: Set value.
-		const property = this._content?.properties.find((x) => x.alias === target.alias);
-		if (property) {
-			this._setPropertyValue(property.alias, target.value);
-		} else {
-			console.error('property was not found', target.alias);
-		}
-	};
-
-	// TODO: How do we ensure this is a change of this document and not nested documents? Should the event be stopped at this spot at avoid such.
-	private _setPropertyValue(alias: string, value: unknown) {
-		this._content?.data.forEach((data) => {
-			if (data.alias === alias) {
-				data.value = value;
-			}
-		});
-	}
-
 	render() {
 		return html`
 			<umb-workspace-layout alias=${this.alias}>
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
index 5371832894..11a2fe8fbe 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
@@ -29,7 +29,7 @@ export class UmbPropertyActionClearElement extends UmbLitElement implements UmbP
 	private _clearValue() {
 		// TODO: how do we want to update the value? Testing an event based approach. We need to test an api based approach too.
 		this.value = '';
-		this.dispatchEvent(new CustomEvent('property-editor-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts
index 1cfbbac557..4cd8caa24a 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.context.ts
@@ -1,20 +1,22 @@
-import { Observable, ReplaySubject } from 'rxjs';
+import { BehaviorSubject } from 'rxjs';
 import { UmbContextProviderController } from 'src/core/context-api/provide/context-provider.controller';
-import { UmbControllerHostInterface } from 'src/core/controller/controller-host.mixin';
+import type { UmbControllerHostInterface } from 'src/core/controller/controller-host.mixin';
 
 export class UmbPropertyActionMenuContext {
 
-	private _isOpen: ReplaySubject<boolean> = new ReplaySubject(1);
-	public readonly isOpen: Observable<boolean> = this._isOpen.asObservable();
+	private _isOpen = new BehaviorSubject(false);
+	public readonly isOpen = this._isOpen.asObservable();
 
 	constructor(host: UmbControllerHostInterface) {
 		new UmbContextProviderController(host, 'umbPropertyActionMenu', this);
 	}
 
+	toggle() {
+		this._isOpen.next(!this._isOpen.getValue());
+	}
 	open() {
 		this._isOpen.next(true);
 	}
-
 	close() {
 		this._isOpen.next(false);
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
index 5510e8c53f..ca15dbce7d 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
@@ -8,6 +8,7 @@ import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 
 import '../property-action/property-action.element';
 import { UmbLitElement } from '@umbraco-cms/element';
+import { UmbObserverController } from '@umbraco-cms/observable-api';
 
 @customElement('umb-property-action-menu')
 export class UmbPropertyActionMenuElement extends UmbLitElement {
@@ -40,13 +41,19 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 		`,
 	];
 
-	@property()
-	public propertyEditorUIAlias = '';
+
 
 	// TODO: we need to investigate context api vs values props and events
 	@property()
 	public value?: string;
 
+	@property()
+	set propertyEditorUIAlias(alias: string) {
+		this._observeActions(alias);
+	}
+
+	private _actionsObserver?: UmbObserverController<ManifestPropertyAction[]>;
+
 	@state()
 	private _actions: Array<ManifestPropertyAction> = [];
 
@@ -55,22 +62,25 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 
 	private _propertyActionMenuContext = new UmbPropertyActionMenuContext(this);
 
-	connectedCallback(): void {
-		super.connectedCallback();
+	constructor() {
+		super();
 
-		this._observePropertyActions();
-		this._observePropertyActionMenuOpenState();
+		this.observe(this._propertyActionMenuContext.isOpen, (value) => {
+			this._open = value;
+		});
 	}
 
-	private _observePropertyActions() {
-		this.observe(
+	private _observeActions(alias: string) {
+		this._actionsObserver?.destroy();
+		this._actionsObserver = this.observe(
 			umbExtensionsRegistry
 				.extensionsOfType('propertyAction')
 				.pipe(
-					map((propertyActions) =>
-						propertyActions.filter((propertyAction) =>
-							propertyAction.meta.propertyEditors.includes(this.propertyEditorUIAlias)
+					map((propertyActions) => {
+						return propertyActions.filter((propertyAction) =>
+							propertyAction.meta.propertyEditors.includes(alias)
 						)
+					}
 					)
 				),
 			(manifests) => {
@@ -79,23 +89,17 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 		);
 	}
 
-	private _observePropertyActionMenuOpenState() {
-		this.observe(this._propertyActionMenuContext.isOpen, (value) => {
-			this._open = value;
-		});
-	}
-
 	private _toggleMenu() {
-		this._open ? this._propertyActionMenuContext.close() : this._propertyActionMenuContext.open();
+		this._propertyActionMenuContext.toggle();
 	}
 
 	private _handleClose(event: CustomEvent) {
-		this._open = false;
+		this._propertyActionMenuContext.close();
 		event.stopPropagation();
 	}
 
 	render() {
-		if (this._actions.length > 0) {
+		return (this._actions.length > 0) ?
 			html`
 				<uui-popover id="popover" placement="bottom-start" .open=${this._open} @close="${this._handleClose}">
 					<uui-button
@@ -116,8 +120,7 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 						)}
 					</div>
 				</uui-popover>
-			`;
-		}
-		return '';
+			`
+			: '';
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
index 7e0f41cf04..4d2b95ebfd 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
@@ -90,7 +90,7 @@ export class UmbPropertyEditorUIContentPickerElement extends UmbLitElement {
 	private _setValue(newValue: Array<string>) {
 		this.value = newValue;
 		this._observePickedDocuments();
-		this.dispatchEvent(new CustomEvent('property-editor-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
 	}
 
 	private _renderItem(item: FolderTreeItem) {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
index 8461d2c513..969495f270 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUINumberElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-editor-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
index 4ea729ad37..c59f03d66f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUITextBoxElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-editor-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
index 098c8a750e..48101e960b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
@@ -36,7 +36,7 @@ export class UmbPropertyEditorUITextareaElement extends UmbLitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-editor-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/core/models/index.ts b/src/Umbraco.Web.UI.Client/src/core/models/index.ts
index cd8f53325d..e8fb169d3f 100644
--- a/src/Umbraco.Web.UI.Client/src/core/models/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/models/index.ts
@@ -24,6 +24,14 @@ export interface Entity {
 	parentKey: string;
 }
 
+export interface ContentDetails {
+	key: string; // TODO: Remove this when the backend is fixed
+	isTrashed: boolean; // TODO: remove only temp part of refactor
+	properties: Array<ContentProperty>;
+	data: Array<ContentPropertyData>;
+	//layout?: any; // TODO: define layout type - make it non-optional
+}
+
 export interface UserEntity extends Entity {
 	type: 'user';
 }
@@ -95,7 +103,7 @@ export interface ContentPropertyData {
 }
 
 // Documents
-export interface DocumentDetails extends DocumentTreeItem {
+export interface DocumentDetails extends DocumentTreeItem, ContentDetails {
 	key: string; // TODO: Remove this when the backend is fixed
 	isTrashed: boolean; // TODO: remove only temp part of refactor
 	properties: Array<ContentProperty>;

From 19dbe6002e1d79b1d6dd2970c439066c5ab8ffb9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 20:16:45 +0100
Subject: [PATCH 17/47] comments

---
 .../backoffice/shared/components/property/property.element.ts  | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
index 45ba7d01ec..09e27c1e6f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
@@ -156,7 +156,6 @@ export class UmbPropertyElement extends UmbLitElement {
 			this._description = description;
 		});
 
-		// TODO: move event to context. maybe rename to property-editor-value-change.
 		this.addEventListener('property-editor-value-change', this._onPropertyEditorChange as any as EventListener);
 
 
@@ -206,8 +205,8 @@ export class UmbPropertyElement extends UmbLitElement {
 		this.value = target.value;
 
 		//TODO: Property-Context: Figure out the requirements for this. Cause currently the alias-prop(getter) is required, but its not obvious.
+		// Could it make more sense to parse this on as part of the event? alias?, value?
 		
-		// TODO: Confusing with the little detail of the event name that changed here..
 		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 		e.stopPropagation();
 	};

From 5189df66e8b35aee20491b6b3465984b291e8aa8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 20:29:34 +0100
Subject: [PATCH 18/47] type unknown for value to element

---
 .../content-property/content-property.element.ts          | 4 ++--
 .../shared/components/property/property.element.ts        | 8 ++++----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index 90f55497ca..2cba83ac04 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -68,8 +68,8 @@ export class UmbContentPropertyElement extends UmbLitElement {
 			description=${ifDefined(this.property?.description)}
 			alias="${ifDefined(this.property?.alias)}"
 			property-editor-ui-alias="${ifDefined(this._propertyEditorUIAlias)}"
-			.value="${this.value}"
-			.config="${this._dataTypeData}"></umb-property>`;
+			.value=${this.value}
+			.config=${this._dataTypeData}></umb-property>`;
 	}
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
index 09e27c1e6f..7176436901 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
@@ -111,15 +111,15 @@ export class UmbPropertyElement extends UmbLitElement {
 	/**
 	 * Property Editor UI Alias. Render the Property Editor UI registered for this alias.
 	 * @public
-	 * @type {object | string}
+	 * @type {unknown}
 	 * @attr
 	 * @default undefined
 	 */
-	@property({ attribute: false })
+	@property({attribute: false })
 	public get value() {
-		return this._propertyContext.getValue() as any;
+		return this._propertyContext.getValue();
 	}
-	public set value(value: object | string) {
+	public set value(value) {
 		this._propertyContext.setValue(value);
 	}
 

From eeba6ecc4c67472b6c3d5411b3055077a94f36bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 20:30:53 +0100
Subject: [PATCH 19/47] remove console.logs

---
 .../workspace-content/workspace-content.context.ts        | 8 +-------
 1 file changed, 1 insertion(+), 7 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 8586e736c5..9ddbd0587f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -98,8 +98,6 @@ export class UmbWorkspaceContentContext<
 	private _onPropertyValueChange = (e: Event) => {
 		const target = e.composedPath()[0] as any;
 
-		console.log("_onPropertyValueChange context", target.alias, target);
-
 		const property = this.getData().data.find((x) => x.alias === target.alias);
 		if (property) {
 			this._setPropertyValue(property.alias, target.value);
@@ -112,8 +110,6 @@ export class UmbWorkspaceContentContext<
 	};
 
 	private _setPropertyValue(alias: string, value: unknown) {
-
-		console.log("about to change prop", this.getData());
 		const newDataSet = this.getData().data.map((entry) => {
 			if (entry.alias === alias) {
 				return {alias: alias, value: value};
@@ -122,9 +118,7 @@ export class UmbWorkspaceContentContext<
 		});
 
 
-		const part = {data: newDataSet};
-		console.log("result", part)
-		this.update(part as Partial<ContentTypeType>);
+		this.update({data: newDataSet} as Partial<ContentTypeType>);
 	}
 
 	public save(): Promise<void> {

From 95d7f65ee8fd01b034e613686ccd3352c9a47555 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 20:36:05 +0100
Subject: [PATCH 20/47] remove the workspace-context base class

---
 .../workspace-content.context.ts              |  31 ++++-
 .../notes-from-structure-talk.txt             | 131 ------------------
 .../workspace-context/workspace.context.ts    |  40 ------
 3 files changed, 28 insertions(+), 174 deletions(-)
 delete mode 100644 src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/notes-from-structure-talk.txt
 delete mode 100644 src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/workspace.context.ts

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 9ddbd0587f..4bbbb6245b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -1,7 +1,7 @@
 import { v4 as uuidv4 } from 'uuid';
+import { BehaviorSubject, Observable } from 'rxjs';
 import { UmbNotificationService } from '../../../../../core/notification';
 import { UmbNotificationDefaultData } from '../../../../../core/notification/layouts/default';
-import { UmbWorkspaceContext } from '../workspace-context/workspace.context';
 import { UmbNodeStoreBase } from '@umbraco-cms/stores/store';
 import { UmbControllerHostInterface } from 'src/core/controller/controller-host.mixin';
 import { UmbContextConsumerController } from 'src/core/context-api/consume/context-consumer.controller';
@@ -14,7 +14,14 @@ import type { ContentDetails } from '@umbraco-cms/models';
 export class UmbWorkspaceContentContext<
 	ContentTypeType extends ContentDetails = ContentDetails,
 	StoreType extends UmbNodeStoreBase<ContentTypeType> = UmbNodeStoreBase<ContentTypeType>
-> extends UmbWorkspaceContext<ContentTypeType> {
+> {
+
+	protected _host: UmbControllerHostInterface;
+
+	// TODO: figure out how fine grained we want to make our observables.
+	// TODO: add interface
+	protected _data!:BehaviorSubject<ContentTypeType>;
+	public readonly data: Observable<ContentTypeType>;
 
 	protected _notificationService?: UmbNotificationService;
 
@@ -32,8 +39,10 @@ export class UmbWorkspaceContentContext<
 		storeAlias: string,
 		entityType: string
 	) {
-		super(host, defaultData);
 
+		this._host = host;
+		this._data = new BehaviorSubject<ContentTypeType>(defaultData);
+		this.data = this._data.asObservable();
 		this.entityType = entityType;
 
 		host.addEventListener('property-value-change', this._onPropertyValueChange);
@@ -59,6 +68,14 @@ export class UmbWorkspaceContentContext<
 		});
 	}
 
+
+	public getData() {
+		return this._data.getValue();
+	}
+	public update(data: Partial<ContentTypeType>) {
+		this._data.next({ ...this.getData(), ...data });
+	}
+
 	load(entityKey: string) {
 		this.#isNew = false;
 		this.entityKey = entityKey;
@@ -137,4 +154,12 @@ export class UmbWorkspaceContentContext<
 				this._notificationService?.peek('danger', { data });
 			});
 	}
+
+
+
+	// TODO: how can we make sure to call this.
+	public destroy(): void {
+		this._host.removeEventListener('property-value-change', this._onPropertyValueChange);
+		this._data.unsubscribe();
+	}
 }
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/notes-from-structure-talk.txt b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/notes-from-structure-talk.txt
deleted file mode 100644
index ff458e753e..0000000000
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/notes-from-structure-talk.txt
+++ /dev/null
@@ -1,131 +0,0 @@
-
-CollectionContext {
-
-	// RxJS store..
-	this._data = new BehaviorSubject<BlockType>(defaultData);
-	this.data = this._data.asObservable();
-
-	getStore();
-
-}
-
-
-DocumentCollectionContext extends CollectionContext {
-
-	// RxJS store..
-	this._data = new BehaviorSubject<BlockType>(defaultData);
-	this.data = this._data.asObservable();
-
-	getStore();
-	publish();
-	update();
-
-}
-
-
-MediaCollectionContext extends CollectionContext {
-
-	// RxJS store..
-	this._data = new BehaviorSubject<BlockType>(defaultData);
-	this.data = this._data.asObservable();
-
-	getStore();
-	update();
-	save();
-
-}
-
-
-VendrCollectionContext extends CollectionContext {
-
-	// RxJS store..
-	this._data = new BehaviorSubject<BlockType>(defaultData);
-	this.data = this._data.asObservable();
-
-	getStore();
-	update();
-	save();
-
-}
-
-
-
-
-
-
-
-DocumentContext {
-
-	// Validation?
-
-	// RxJS store..
-	this._data = new BehaviorSubject<BlockType>(defaultData);
-	this.data = this._data.asObservable();
-
-	getStore();
-
-	setPublishDate()
-
-	addVariant(name) {
-		this.data.name = name;
-	}
-
-	save() {
-		this.backendStore.save()
-	}
-
-}
-
-
-PropertyContext {
-
-	// Validation?
-
-}
-
-
-BlockContext {
-
-	// Validation?
-
-	this._data = new BehaviorSubject<BlockType>(defaultData);
-	this.data = this._data.asObservable();
-
-	this._liveEditing = true;
-
-	setName(name) {
-		this.update({name: name})
-		if(this._liveEditing) {
-			this.save();
-		}
-	}
-
-	save() {
-		//
-		this.parentData.block[123] = this.data.getData();
-		this.parentDatarxJS.update(this.parentData);
-	}
-
-}
-
-
-var myBlockContext = new BlockContext(documentData.blocks[1]);
-
-
-// Property Editor Edit Element Name:
-
-myBlockContext.data.subscribe((blockData) => {
-	this.input.value = blockData.name;
-})
-this.input.addEventListener("change", () => {
-	myBlockContext.setName(this.input.value);
-	// RXJS update?? ^^
-})
-
-
-
-
-blockContext.setName('sdaafgdss');
-// Does does other update?
-
-
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/workspace.context.ts
deleted file mode 100644
index 1277e47ace..0000000000
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-context/workspace.context.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import { BehaviorSubject, Observable } from "rxjs";
-import { UmbControllerHostInterface } from "src/core/controller/controller-host.mixin";
-
-
-export abstract class UmbWorkspaceContext<DataType> {
-
-	protected _host: UmbControllerHostInterface;
-
-	// TODO: figure out how fine grained we want to make our observables.
-	// TODO: add interface
-	protected _data!:BehaviorSubject<DataType>;
-	public readonly data: Observable<DataType>;
-
-
-	constructor(host:UmbControllerHostInterface, defaultData: DataType) {
-		this._host = host;
-
-		this._data = new BehaviorSubject<DataType>(defaultData);
-		this.data = this._data.asObservable();
-	}
-
-
-	public getData() {
-		return this._data.getValue();
-	}
-
-	public update(data: Partial<DataType>) {
-		this._data.next({ ...this.getData(), ...data });
-	}
-
-
-
-
-	// TODO: how can we make sure to call this.
-	public destroy(): void {
-		this._data.unsubscribe();
-	}
-
-}
-

From ed264b237df154b6a784a4b8ed8a6913b6ff1079 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 20:47:55 +0100
Subject: [PATCH 21/47] clean up

---
 .../workspace-content/workspace-content.element.ts        | 8 +-------
 1 file changed, 1 insertion(+), 7 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
index 4e2ae00635..0593b4ae60 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.element.ts
@@ -1,9 +1,6 @@
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { css, html } from 'lit';
-import { customElement, property, state } from 'lit/decorators.js';
-import { distinctUntilChanged } from 'rxjs';
-import type { UmbWorkspaceContentContext } from './workspace-content.context';
-import type { DocumentDetails, MediaDetails } from '@umbraco-cms/models';
+import { customElement, property } from 'lit/decorators.js';
 
 import '../workspace-layout/workspace-layout.element';
 import '../../variant-selector/variant-selector.element';
@@ -12,11 +9,8 @@ import '../../variant-selector/variant-selector.element';
 // TODO: Make this dynamic, use load-extensions method to loop over extensions for this node.
 import './views/edit/workspace-view-content-edit.element';
 import './views/info/workspace-view-content-info.element';
-import type { UmbNodeStoreBase } from '@umbraco-cms/stores/store';
 import { UmbLitElement } from '@umbraco-cms/element';
 
-type ContentTypeTypes = DocumentDetails | MediaDetails;
-
 /**
  * TODO: IMPORTANT TODO: Get rid of the content workspace. Instead we aim to get separate components that can be composed by each workspace.
  * Example. Document Workspace would use a Variant-component(variant component would talk directly to the workspace-context)

From 13c5fd84234fa8a03acc262cf01601d205e9473e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Fri, 6 Jan 2023 20:48:02 +0100
Subject: [PATCH 22/47] notes for next week

---
 .../views/edit/workspace-view-content-edit.element.ts | 11 +++++++++++
 .../workspace-content/workspace-content.context.ts    |  3 +++
 2 files changed, 14 insertions(+)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
index c45c5074b1..06f5900457 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
@@ -40,11 +40,22 @@ export class UmbWorkspaceViewContentEditElement extends UmbLitElement {
 	private _observeContent() {
 		if (!this._workspaceContext) return;
 
+		/*
+		TODO: Property-Context: This observer gets all changes, We need to fix this. it should be simpler.
+		It should look at length and aliases? as long as they are identical nothing should change. 
+		As they would update them selfs?
+
+		Should use a Observable for this._workspaceContext.properties
+		*/
 		this.observe(
 			this._workspaceContext.data.pipe(distinctUntilChanged()),
 			(content) => {
 				this._properties = content.properties;
 				this._data = content.data;
+				/*
+				Maybe we should not give the value, but the umb-content-property should get the context and observe its own data.
+				This would become a more specific Observer therefor better performance?.. Note to self: Debate with Mads how he sees this perspective.
+				*/
 			}
 		);
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 4bbbb6245b..3ab1531a50 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -41,6 +41,9 @@ export class UmbWorkspaceContentContext<
 	) {
 
 		this._host = host;
+
+		//TODO: Use the UniqueBehaviorSubject, and separate observables for each part?
+
 		this._data = new BehaviorSubject<ContentTypeType>(defaultData);
 		this.data = this._data.asObservable();
 		this.entityType = entityType;

From c18ee7414a8380c20a62c4100abe7107bac0e0bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 11:39:58 +0100
Subject: [PATCH 23/47] use repeat directive from Lit

---
 .../views/edit/workspace-view-content-edit.element.ts | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
index 06f5900457..c7ce842c6d 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
@@ -7,6 +7,7 @@ import type { ContentProperty, ContentPropertyData, DocumentDetails, MediaDetail
 
 import '../../../../content-property/content-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
+import { repeat } from 'lit/directives/repeat.js';
 
 @customElement('umb-workspace-view-content-edit')
 export class UmbWorkspaceViewContentEditElement extends UmbLitElement {
@@ -63,12 +64,14 @@ export class UmbWorkspaceViewContentEditElement extends UmbLitElement {
 	render() {
 		return html`
 			<uui-box>
-				${this._properties?.map(
-					(property: ContentProperty) => html`
-						<umb-content-property
+				${repeat(
+					this._properties,
+					(property) => property.alias,
+					(property) => 
+						html`<umb-content-property
 							.property=${property}
 							.value=${this._data.find((data) => data.alias === property.alias)?.value}></umb-content-property>
-					`
+						`
 				)}
 			</uui-box>
 		`;

From a8c006297b2e9f2a249e666ba2a07d38b36e1a99 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 11:40:15 +0100
Subject: [PATCH 24/47] move action to textArea for testing purpose

---
 .../src/backoffice/shared/property-actions/manifests.ts         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts
index 1b5a1b4307..5b1fce9d23 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts
@@ -16,7 +16,7 @@ export const manifests: Array<ManifestPropertyAction> = [
 		name: 'Clear Property Action',
 		loader: () => import('./clear/property-action-clear.element'),
 		meta: {
-			propertyEditors: ['Umb.PropertyEditorUI.TextBox'],
+			propertyEditors: ['Umb.PropertyEditorUI.TextArea'],
 		},
 	},
 ];

From 4c914ec390c120a65342b07996c60d6670dac568 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 14:50:15 +0100
Subject: [PATCH 25/47] simpler implementation

---
 .../components/property/property.element.ts   | 24 ++------
 .../property/workspace-property.context.ts    | 55 +++++++++----------
 .../workspace-view-content-edit.element.ts    |  2 +-
 .../workspace-content.context.ts              | 20 +------
 .../clear/property-action-clear.element.ts    |  3 +-
 ...operty-editor-ui-content-picker.element.ts |  2 +-
 .../property-editor-ui-number.element.ts      |  2 +-
 .../property-editor-ui-text-box.element.ts    |  2 +-
 .../property-editor-ui-textarea.element.ts    |  5 +-
 .../observable-api/unique-behavior-subject.ts |  6 +-
 10 files changed, 44 insertions(+), 77 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
index 7176436901..1fcdc0b210 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
@@ -84,9 +84,6 @@ export class UmbPropertyElement extends UmbLitElement {
 	 * @default ''
 	 */
 	@property({ type: String })
-	public get alias(): string {
-		return this._propertyContext.getAlias() || '';
-	}
 	public set alias(alias: string) {
 		this._propertyContext.setAlias(alias);
 	}
@@ -100,9 +97,6 @@ export class UmbPropertyElement extends UmbLitElement {
 	 */
 	private _propertyEditorUIAlias = '';
 	@property({ type: String, attribute: 'property-editor-ui-alias' })
-	public get propertyEditorUIAlias(): string {
-		return this._propertyEditorUIAlias;
-	}
 	public set propertyEditorUIAlias(value: string) {
 		this._propertyEditorUIAlias = value;
 		this._observePropertyEditorUI();
@@ -116,10 +110,7 @@ export class UmbPropertyElement extends UmbLitElement {
 	 * @default undefined
 	 */
 	@property({attribute: false })
-	public get value() {
-		return this._propertyContext.getValue();
-	}
-	public set value(value) {
+	public set value(value: unknown) {
 		this._propertyContext.setValue(value);
 	}
 
@@ -148,7 +139,6 @@ export class UmbPropertyElement extends UmbLitElement {
 	constructor() {
 		super();
 
-
 		this.observe(this._propertyContext.label, (label) => {
 			this._label = label;
 		});
@@ -156,7 +146,8 @@ export class UmbPropertyElement extends UmbLitElement {
 			this._description = description;
 		});
 
-		this.addEventListener('property-editor-value-change', this._onPropertyEditorChange as any as EventListener);
+		// TODO: maybe this would be called change.
+		this.addEventListener('change', this._onPropertyEditorChange as any as EventListener);
 
 
 	}
@@ -202,13 +193,10 @@ export class UmbPropertyElement extends UmbLitElement {
 
 	private _onPropertyEditorChange = (e: CustomEvent) => {
 		const target = e.composedPath()[0] as any;
-		this.value = target.value;
 
-		//TODO: Property-Context: Figure out the requirements for this. Cause currently the alias-prop(getter) is required, but its not obvious.
-		// Could it make more sense to parse this on as part of the event? alias?, value?
-		
-		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
-		e.stopPropagation();
+		this.value = target.value;// Sets value in context.
+
+		console.log("property Context got `change` event from element with value of ", this.value);
 	};
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
index 836c8941dd..7336617ae4 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
@@ -1,8 +1,10 @@
 import { distinctUntilChanged, map, Observable, shareReplay } from "rxjs";
+import { UmbWorkspaceContentContext } from "../workspace/workspace-content/workspace-content.context";
 import type { DataTypeDetails } from "@umbraco-cms/models";
 import { UmbControllerHostInterface } from "src/core/controller/controller-host.mixin";
 import { naiveObjectComparison, UniqueBehaviorSubject } from "src/core/observable-api/unique-behavior-subject";
 import { UmbContextProviderController } from "src/core/context-api/provide/context-provider.controller";
+import { UmbContextConsumerController } from "src/core/context-api/consume/context-consumer.controller";
 
 
 
@@ -26,13 +28,14 @@ export function CreateObservablePart<T, R> (
 	return source$.pipe(
 	  map(mappingFunction),
 	  distinctUntilChanged(memoizationFunction || defaultMemoization),
-	  shareReplay(1) // TODO: investigate what happens if this was removed. (its suppose to only give the first subscriber the current value, but i want to test this)
+	  shareReplay(1)
 	)
 }
 
 
 
 
+
 export type WorkspacePropertyData<ValueType> = {
 	alias?: string;
 	label?: string;
@@ -43,7 +46,6 @@ export type WorkspacePropertyData<ValueType> = {
 
 export class UmbWorkspacePropertyContext<ValueType> {
 
-	//private _host: UmbControllerHostInterface;
 
 	private _providerController: UmbContextProviderController;
 
@@ -55,53 +57,46 @@ export class UmbWorkspacePropertyContext<ValueType> {
 	public readonly value = CreateObservablePart(this._data, data => data.value);
 	public readonly config = CreateObservablePart(this._data, data => data.config);
 
+	private _workspaceContext?: UmbWorkspaceContentContext;
+
+
 	constructor(host:UmbControllerHostInterface) {
 
-		//this._host = host;
-
-		// TODO: How do we connect this value with parent context?
-		// Ensuring the property editor value-property is updated...
-		// How about consuming a workspace context? When received maybe assuming these will fit or test if it likes to accept this property..
+		new UmbContextConsumerController(host, 'umbWorkspaceContext', (workspaceContext) => {
+			this._workspaceContext = workspaceContext;
+		});
 
 		this._providerController = new UmbContextProviderController(host, 'umbPropertyContext', this);
+
 	
 	}
-
-	/*public getData() {
-		return this._data.getValue();
-	}*/
-
-
-
-	public update(data: Partial<WorkspacePropertyData<ValueType>>) {
-		this._data.next({ ...this._data.getValue(), ...data });
-	}
-
 	
 	public setAlias(alias: WorkspacePropertyData<ValueType>['alias']) {
-		this.update({alias: alias});
-	}
-	public getAlias() {
-		return this._data.getValue().alias;
+		this._data.update({alias: alias});
 	}
 	public setLabel(label: WorkspacePropertyData<ValueType>['label']) {
-		this.update({label: label});
+		this._data.update({label: label});
 	}
 	public setDescription(description: WorkspacePropertyData<ValueType>['description']) {
-		this.update({description: description});
+		this._data.update({description: description});
 	}
 	public setValue(value: WorkspacePropertyData<ValueType>['value']) {
-		this.update({value: value});
-	}
-	public getValue() {
-		return this._data.getValue().value;
+
+		if(value === this._data.getValue().value) return;
+
+		this._data.update({value: value});
+
+		const alias = this._data.getValue().alias;
+		if(alias) {
+			this._workspaceContext?.setPropertyValue(alias, value);
+		}
 	}
 	public setConfig(config: WorkspacePropertyData<ValueType>['config']) {
-		this.update({config: config});
+		this._data.update({config: config});
 	}
 
 	public resetValue() {
-		this.update({value: null});
+		this.setValue(null);
 	}
 
 	// TODO: how can we make sure to call this.
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
index c7ce842c6d..e004fa983a 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.element.ts
@@ -2,12 +2,12 @@ import { css, html } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, state } from 'lit/decorators.js';
 import { distinctUntilChanged } from 'rxjs';
+import { repeat } from 'lit/directives/repeat.js';
 import type { UmbWorkspaceContentContext } from '../../workspace-content.context';
 import type { ContentProperty, ContentPropertyData, DocumentDetails, MediaDetails } from '@umbraco-cms/models';
 
 import '../../../../content-property/content-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
-import { repeat } from 'lit/directives/repeat.js';
 
 @customElement('umb-workspace-view-content-edit')
 export class UmbWorkspaceViewContentEditElement extends UmbLitElement {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 3ab1531a50..620aa23c0d 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -48,8 +48,6 @@ export class UmbWorkspaceContentContext<
 		this.data = this._data.asObservable();
 		this.entityType = entityType;
 
-		host.addEventListener('property-value-change', this._onPropertyValueChange);
-
 		new UmbContextConsumerController(
 			host,
 			'umbNotificationService',
@@ -114,22 +112,7 @@ export class UmbWorkspaceContentContext<
 
 
 	
-	//TODO: Property-Context: I would like ot investigate how this would work as methods. That do require that a property-context gets the workspace context. But this connection would be more safe.
-	private _onPropertyValueChange = (e: Event) => {
-		const target = e.composedPath()[0] as any;
-
-		const property = this.getData().data.find((x) => x.alias === target.alias);
-		if (property) {
-			this._setPropertyValue(property.alias, target.value);
-		} else {
-			console.error('property was not found', target.alias);
-		}
-
-		// We need to stop the event, so it does not bubble up to parent workspace contexts.
-		e.stopPropagation();
-	};
-
-	private _setPropertyValue(alias: string, value: unknown) {
+	public setPropertyValue(alias: string, value: unknown) {
 		const newDataSet = this.getData().data.map((entry) => {
 			if (entry.alias === alias) {
 				return {alias: alias, value: value};
@@ -162,7 +145,6 @@ export class UmbWorkspaceContentContext<
 
 	// TODO: how can we make sure to call this.
 	public destroy(): void {
-		this._host.removeEventListener('property-value-change', this._onPropertyValueChange);
 		this._data.unsubscribe();
 	}
 }
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
index 11a2fe8fbe..53b92491fe 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
@@ -6,6 +6,7 @@ import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-property-action-clear')
 export class UmbPropertyActionClearElement extends UmbLitElement implements UmbPropertyAction {
+	
 	@property()
 	value = '';
 
@@ -29,7 +30,7 @@ export class UmbPropertyActionClearElement extends UmbLitElement implements UmbP
 	private _clearValue() {
 		// TODO: how do we want to update the value? Testing an event based approach. We need to test an api based approach too.
 		this.value = '';
-		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
index 4d2b95ebfd..e8030b3049 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
@@ -90,7 +90,7 @@ export class UmbPropertyEditorUIContentPickerElement extends UmbLitElement {
 	private _setValue(newValue: Array<string>) {
 		this.value = newValue;
 		this._observePickedDocuments();
-		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	private _renderItem(item: FolderTreeItem) {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
index 969495f270..42d35c2c8e 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUINumberElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
index c59f03d66f..104f87accb 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUITextBoxElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
index 48101e960b..5086dabdb9 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
@@ -28,15 +28,12 @@ export class UmbPropertyEditorUITextareaElement extends UmbLitElement {
 
 		this.consumeContext('umbPropertyContext', (instance: UmbWorkspacePropertyContext<string>) => {
 			this.propertyContext = instance;
-			this.observe(this.propertyContext.value, (value) => {
-				console.log("Context says value changed", value);
-			});
 		});
 	}
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-editor-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
index db6043a999..e2c29f6a43 100644
--- a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
@@ -31,7 +31,11 @@ export class UniqueBehaviorSubject<T> extends BehaviorSubject<T> {
     next(newData: T): void {
         const frozenData = deepFreeze(newData);
         if (!naiveObjectComparison(frozenData, this.getValue())) {
-        super.next(frozenData);
+            super.next(frozenData);
         }
     }
+
+    update(data: Partial<T>) {
+		this.next({ ...this.getValue(), ...data });
+	}
 }
\ No newline at end of file

From 5b2d1da273d4bfc9087f06fae02a7dd4fb55b1af Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 15:17:19 +0100
Subject: [PATCH 26/47] rename property to workspace-property

---
 .../content-property.element.ts               |  6 +++---
 .../components/property/propery.stories.ts    | 20 -------------------
 .../workspace-property.context.ts             |  0
 .../workspace-property.element.ts}            |  8 ++++----
 .../workspace-property.stories.ts             | 20 +++++++++++++++++++
 .../property-editor-config.element.ts         |  6 +++---
 .../property-editor-ui-textarea.element.ts    |  2 +-
 7 files changed, 31 insertions(+), 31 deletions(-)
 delete mode 100644 src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/propery.stories.ts
 rename src/Umbraco.Web.UI.Client/src/backoffice/shared/components/{property => workspace-property}/workspace-property.context.ts (100%)
 rename src/Umbraco.Web.UI.Client/src/backoffice/shared/components/{property/property.element.ts => workspace-property/workspace-property.element.ts} (96%)
 create mode 100644 src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.stories.ts

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index 2cba83ac04..ec52058b4c 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -6,7 +6,7 @@ import { customElement, property, state } from 'lit/decorators.js';
 import { UmbDataTypeStore } from '../../../settings/data-types/data-type.store';
 import type { ContentProperty } from '@umbraco-cms/models';
 
-import '../property/property.element';
+import '../workspace-property/workspace-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-content-property')
@@ -63,13 +63,13 @@ export class UmbContentPropertyElement extends UmbLitElement {
 	}
 
 	render() {
-		return html`<umb-property
+		return html`<umb-workspace-property
 			label=${ifDefined(this.property?.label)}
 			description=${ifDefined(this.property?.description)}
 			alias="${ifDefined(this.property?.alias)}"
 			property-editor-ui-alias="${ifDefined(this._propertyEditorUIAlias)}"
 			.value=${this.value}
-			.config=${this._dataTypeData}></umb-property>`;
+			.config=${this._dataTypeData}></umb-workspace-property>`;
 	}
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/propery.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/propery.stories.ts
deleted file mode 100644
index 2f71c32d96..0000000000
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/propery.stories.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Meta, Story } from '@storybook/web-components';
-import { html } from 'lit-html';
-
-import type { UmbPropertyElement } from './property.element';
-import './property.element';
-
-export default {
-	title: 'Components/Entity Property',
-	component: 'umb-property',
-	id: 'umb-property',
-} as Meta;
-
-export const AAAOverview: Story<UmbPropertyElement> = () =>
-	html` <umb-property
-		label="Property"
-		description="Description"
-		alias="textProperty"
-		property-editor-ui-alias="Umb.PropertyEditorUI.TextBox"
-		.value="${'Hello'}"></umb-property>`;
-AAAOverview.storyName = 'Overview';
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/workspace-property.context.ts
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
similarity index 96%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
index 1fcdc0b210..99e20e80df 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/property/property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
@@ -13,13 +13,13 @@ import { UmbObserverController } from 'src/core/observable-api/observer.controll
 import { UmbLitElement } from '@umbraco-cms/element';
 
 /**
- *  @element umb-property
+ *  @element umb-workspace-property
  *  @description - Component for displaying a entity property. The Element will render a Property Editor based on the Property Editor UI alias passed to the element.
  *  The element will also render all Property Actions related to the Property Editor.
  */
 
-@customElement('umb-property')
-export class UmbPropertyElement extends UmbLitElement {
+@customElement('umb-workspace-property')
+export class UmbWorkspacePropertyElement extends UmbLitElement {
 	static styles = [
 		UUITextStyles,
 		css`
@@ -221,6 +221,6 @@ export class UmbPropertyElement extends UmbLitElement {
 
 declare global {
 	interface HTMLElementTagNameMap {
-		'umb-property': UmbPropertyElement;
+		'umb-workspace-property': UmbWorkspacePropertyElement;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.stories.ts
new file mode 100644
index 0000000000..9897607990
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.stories.ts
@@ -0,0 +1,20 @@
+import { Meta, Story } from '@storybook/web-components';
+import { html } from 'lit-html';
+
+import type { UmbWorkspacePropertyElement } from './workspace-property.element';
+import './workspace-property.element';
+
+export default {
+	title: 'Components/Entity Property',
+	component: 'umb-workspace-property',
+	id: 'umb-workspace-property',
+} as Meta;
+
+export const AAAOverview: Story<UmbWorkspacePropertyElement> = () =>
+	html` <umb-workspace-property
+		label="Property"
+		description="Description"
+		alias="textProperty"
+		property-editor-ui-alias="Umb.PropertyEditorUI.TextBox"
+		.value="${'Hello'}"></umb-workspace-property>`;
+AAAOverview.storyName = 'Overview';
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
index 5e85d4d446..216e33b789 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/shared/property-editor-config/property-editor-config.element.ts
@@ -5,7 +5,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import type { PropertyEditorConfigDefaultData, PropertyEditorConfigProperty } from '@umbraco-cms/models';
 import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 
-import '../../../components/property/property.element';
+import '../../../components/workspace-property/workspace-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 /**
@@ -104,12 +104,12 @@ export class UmbPropertyEditorConfigElement extends UmbLitElement {
 				? html`
 						${this._properties?.map(
 							(property) => html`
-								<umb-property
+								<umb-workspace-property
 									label="${property.label}"
 									description="${ifDefined(property.description)}"
 									alias="${property.alias}"
 									property-editor-ui-alias="${property.propertyEditorUI}"
-									.value=${this._getValue(property)}></umb-property>
+									.value=${this._getValue(property)}></umb-workspace-property>
 							`
 						)}
 				  `
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
index 5086dabdb9..36537cdb84 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
@@ -1,7 +1,7 @@
 import { css, html } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, property } from 'lit/decorators.js';
-import type { UmbWorkspacePropertyContext } from 'src/backoffice/shared/components/property/workspace-property.context';
+import type { UmbWorkspacePropertyContext } from 'src/backoffice/shared/components/workspace-property/workspace-property.context';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-property-editor-ui-textarea')

From 913cce2133512d7caabc0668f35d1e33175b21fd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 15:45:17 +0100
Subject: [PATCH 27/47] fix type compliance

---
 .../document-types/document-type.store.ts     |  2 +-
 .../document-type-workspace.context.ts        |  5 +++++
 .../documents/documents/document.store.ts     |  2 +-
 .../workspace/document-workspace.context.ts   | 20 ++++++++++++++++--
 .../workspace/media-workspace.context.ts      |  4 ++++
 .../workspace-content.context.ts              | 21 ++++---------------
 .../workspace/user-group-workspace.context.ts |  5 +++++
 .../users/workspace/user-workspace.context.ts |  4 ++++
 .../src/core/models/index.ts                  |  7 +++----
 9 files changed, 45 insertions(+), 25 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/document-type.store.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/document-type.store.ts
index 3e4f355374..6bfc435fed 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/document-type.store.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/document-type.store.ts
@@ -3,7 +3,7 @@ import { UmbDataStoreBase } from '../../../core/stores/store';
 import { ApiError, DocumentTypeResource, DocumentTypeTreeItem, ProblemDetails } from '@umbraco-cms/backend-api';
 import type { DocumentTypeDetails } from '@umbraco-cms/models';
 
-const isDocumentTypeDetails = (
+export const isDocumentTypeDetails = (
 	documentType: DocumentTypeDetails | DocumentTypeTreeItem
 ): documentType is DocumentTypeDetails => {
 	return (documentType as DocumentTypeDetails).properties !== undefined;
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/document-type-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/document-type-workspace.context.ts
index 86d909b900..519cf7110f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/document-type-workspace.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/document-type-workspace.context.ts
@@ -23,4 +23,9 @@ export class UmbWorkspaceDocumentTypeContext extends UmbWorkspaceContentContext<
 	constructor(host: UmbControllerHostInterface) {
 		super(host, DefaultDocumentTypeData, 'umbDocumentTypeStore', 'documentType');
 	}
+
+
+	public setPropertyValue(alias: string, value: unknown) {
+		throw new Error("setPropertyValue is not implemented for UmbWorkspaceDocumentTypeContext")
+	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/document.store.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/document.store.ts
index a42b8deb66..39c9bb050e 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/document.store.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/document.store.ts
@@ -3,7 +3,7 @@ import { UmbNodeStoreBase } from '../../../core/stores/store';
 import type { DocumentDetails } from '@umbraco-cms/models';
 import { ApiError, DocumentResource, DocumentTreeItem, FolderTreeItem, ProblemDetails } from '@umbraco-cms/backend-api';
 
-const isDocumentDetails = (document: DocumentDetails | DocumentTreeItem): document is DocumentDetails => {
+export const isDocumentDetails = (document: DocumentDetails | DocumentTreeItem): document is DocumentDetails => {
 	return (document as DocumentDetails).data !== undefined;
 };
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts
index 6d18c7adb8..da1b8b5d3d 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts
@@ -1,7 +1,8 @@
 import { UmbWorkspaceContentContext } from '../../../shared/components/workspace/workspace-content/workspace-content.context';
-import { STORE_ALIAS } from 'src/backoffice/documents/documents/document.store';
+import { isDocumentDetails, STORE_ALIAS } from 'src/backoffice/documents/documents/document.store';
 import type { UmbDocumentStore, UmbDocumentStoreItemType } from 'src/backoffice/documents/documents/document.store';
 import { UmbControllerHostInterface } from 'src/core/controller/controller-host.mixin';
+import type { DocumentDetails } from '@umbraco-cms/models';
 
 const DefaultDocumentData = {
 	key: '',
@@ -37,8 +38,23 @@ export class UmbWorkspaceDocumentContext extends UmbWorkspaceContentContext<UmbD
 		super(host, DefaultDocumentData, STORE_ALIAS, 'document');
 	}
 
+	public setPropertyValue(alias: string, value: unknown) {
+		const data = this.getData();
+		// TODO: make sure to check that we have a details model:
+		// TODO: make a Method to cast
+		if(isDocumentDetails(data)) {
+			const newDataSet = (data as DocumentDetails).data.map((entry) => {
+				if (entry.alias === alias) {
+					return {alias: alias, value: value};
+				}
+				return entry;
+			});
 
 
+			this.update({data: newDataSet} as Partial<UmbDocumentStoreItemType>);
+		}
+	}
+
 	/*
 	concept notes:
 
@@ -51,4 +67,4 @@ export class UmbWorkspaceDocumentContext extends UmbWorkspaceContentContext<UmbD
 	}
 	*/
 
-}
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/media/media/workspace/media-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/media/media/workspace/media-workspace.context.ts
index ca40faedcf..bf594f2c61 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/media/media/workspace/media-workspace.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/media/media/workspace/media-workspace.context.ts
@@ -35,4 +35,8 @@ export class UmbWorkspaceMediaContext extends UmbWorkspaceContentContext<UmbMedi
 	constructor(host: UmbControllerHostInterface) {
 		super(host, DefaultMediaData, 'umbMediaStore', 'media');
 	}
+
+	public setPropertyValue(alias: string, value: unknown) {
+		throw new Error("setPropertyValue is not implemented for UmbWorkspaceMediaContext")
+	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 620aa23c0d..0aad0a639b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -7,12 +7,12 @@ import { UmbControllerHostInterface } from 'src/core/controller/controller-host.
 import { UmbContextConsumerController } from 'src/core/context-api/consume/context-consumer.controller';
 import { UmbObserverController } from '@umbraco-cms/observable-api';
 import { UmbContextProviderController } from 'src/core/context-api/provide/context-provider.controller';
-import type { ContentDetails } from '@umbraco-cms/models';
+import { EntityTreeItem } from '@umbraco-cms/backend-api';
 
 // TODO: Consider if its right to have this many class-inheritance of WorkspaceContext
 // TODO: Could we extract this code into a 'Manager' of its own, which will be instantiated by the concrete Workspace Context. This will be more transparent and 'reuseable'
-export class UmbWorkspaceContentContext<
-	ContentTypeType extends ContentDetails = ContentDetails,
+export abstract class UmbWorkspaceContentContext<
+	ContentTypeType extends EntityTreeItem = EntityTreeItem,
 	StoreType extends UmbNodeStoreBase<ContentTypeType> = UmbNodeStoreBase<ContentTypeType>
 > {
 
@@ -108,22 +108,9 @@ export class UmbWorkspaceContentContext<
 		return this._store;
 	}
 
+	abstract setPropertyValue(alias: string, value: unknown):void;
 
 
-
-	
-	public setPropertyValue(alias: string, value: unknown) {
-		const newDataSet = this.getData().data.map((entry) => {
-			if (entry.alias === alias) {
-				return {alias: alias, value: value};
-			}
-			return entry;
-		});
-
-
-		this.update({data: newDataSet} as Partial<ContentTypeType>);
-	}
-
 	public save(): Promise<void> {
 		if(!this._store) {
 			// TODO: more beautiful error:
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.context.ts
index beea232e4b..067c239697 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.context.ts
@@ -21,4 +21,9 @@ export class UmbWorkspaceUserGroupContext extends UmbWorkspaceContentContext<
 	constructor(host: UmbControllerHostInterface) {
 		super(host, DefaultDataTypeData, 'umbUserStore', 'userGroup');
 	}
+
+
+	public setPropertyValue(alias: string, value: unknown) {
+		throw new Error("setPropertyValue is not implemented for UmbWorkspaceUserGroupContext")
+	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.context.ts
index 2016e0609b..5e59f0246c 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.context.ts
@@ -24,4 +24,8 @@ export class UmbWorkspaceUserContext extends UmbWorkspaceContentContext<UmbUserS
 	constructor(host: UmbControllerHostInterface) {
 		super(host, DefaultDataTypeData, 'umbUserStore', 'user');
 	}
+
+	public setPropertyValue(alias: string, value: unknown) {
+		throw new Error("setPropertyValue is not implemented for UmbWorkspaceUserContext")
+	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/core/models/index.ts b/src/Umbraco.Web.UI.Client/src/core/models/index.ts
index af3bacde17..6fe815ed33 100644
--- a/src/Umbraco.Web.UI.Client/src/core/models/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/models/index.ts
@@ -24,11 +24,10 @@ export interface Entity {
 	parentKey: string | null;
 }
 
-export interface ContentDetails {
-	key: string; // TODO: Remove this when the backend is fixed
+export interface ContentDetails extends ContentTreeItem {
 	isTrashed: boolean; // TODO: remove only temp part of refactor
 	properties: Array<ContentProperty>;
-	data: Array<ContentPropertyData>;
+	//data: Array<ContentPropertyData>;
 	//layout?: any; // TODO: define layout type - make it non-optional
 }
 
@@ -103,7 +102,7 @@ export interface ContentPropertyData {
 }
 
 // Documents
-export interface DocumentDetails extends DocumentTreeItem, ContentDetails {
+export interface DocumentDetails extends DocumentTreeItem {
 	key: string; // TODO: Remove this when the backend is fixed
 	isTrashed: boolean; // TODO: remove only temp part of refactor
 	properties: Array<ContentProperty>;

From 16e5945ac8fe96668c90baf7dce4746ec480ee8a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 15:52:17 +0100
Subject: [PATCH 28/47] move method

---
 .../workspace-property.element.ts              | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
index 99e20e80df..575745ac63 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
@@ -149,9 +149,14 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 		// TODO: maybe this would be called change.
 		this.addEventListener('change', this._onPropertyEditorChange as any as EventListener);
 
-
 	}
 
+	private _onPropertyEditorChange = (e: CustomEvent) => {
+		const target = e.composedPath()[0] as any;
+
+		this.value = target.value;// Sets value in context.
+	};
+
 	private _observePropertyEditorUI() {
 		this.propertyEditorUIObserver?.destroy();
 		this.propertyEditorUIObserver = this.observe(umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUI', this.propertyEditorUIAlias), (manifest) => {
@@ -188,16 +193,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 				// TODO: loading JS failed so we should do some nice UI. (This does only happen if extension has a js prop, otherwise we concluded that no source was needed resolved the load.)
 			});
 	}
-
-
-
-	private _onPropertyEditorChange = (e: CustomEvent) => {
-		const target = e.composedPath()[0] as any;
-
-		this.value = target.value;// Sets value in context.
-
-		console.log("property Context got `change` event from element with value of ", this.value);
-	};
+	
 
 	render() {
 		return html`

From b0ac74e1a5f55d8cf0fe72d699b700cbb8adc181 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 16:07:14 +0100
Subject: [PATCH 29/47] correct actions

---
 .../workspace-property.context.ts             |  2 +-
 .../workspace-property.element.ts             |  4 ++--
 .../clear/property-action-clear.element.ts    | 24 +++++++++++++------
 .../property-action-menu.element.ts           |  2 ++
 4 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
index 7336617ae4..d4f7d19981 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
@@ -44,7 +44,7 @@ export type WorkspacePropertyData<ValueType> = {
 	config?: DataTypeDetails['data'];// This could potentially then come from hardcoded JS object and not the DataType store.
 };
 
-export class UmbWorkspacePropertyContext<ValueType> {
+export class UmbWorkspacePropertyContext<ValueType = unknown> {
 
 
 	private _providerController: UmbContextProviderController;
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
index 575745ac63..e15b03cf6d 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
@@ -159,7 +159,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 
 	private _observePropertyEditorUI() {
 		this.propertyEditorUIObserver?.destroy();
-		this.propertyEditorUIObserver = this.observe(umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUI', this.propertyEditorUIAlias), (manifest) => {
+		this.propertyEditorUIObserver = this.observe(umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUI', this._propertyEditorUIAlias), (manifest) => {
 			this._gotEditorUI(manifest);
 		});
 	}
@@ -205,7 +205,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 	}
 
 	private _renderPropertyActionMenu() {
-		return html`${this.propertyEditorUIAlias
+		return html`${this._propertyEditorUIAlias
 			? html`<umb-property-action-menu
 					slot="property-action-menu"
 					id="property-action-menu"
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
index 53b92491fe..da748fa52b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
@@ -1,7 +1,8 @@
 import { html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { UmbPropertyActionMenuContext } from '../shared/property-action-menu/property-action-menu.context';
+//import type { UmbPropertyActionMenuContext } from '../shared/property-action-menu/property-action-menu.context';
 import { UmbPropertyAction } from '../shared/property-action/property-action.model';
+import type { UmbWorkspacePropertyContext } from '../../components/workspace-property/workspace-property.context';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-property-action-clear')
@@ -10,27 +11,36 @@ export class UmbPropertyActionClearElement extends UmbLitElement implements UmbP
 	@property()
 	value = '';
 
-	private _propertyActionMenuContext?: UmbPropertyActionMenuContext;
+	// THESE OUT COMMENTED CODE IS USED FOR THE EXAMPLE BELOW, TODO: Should be transferred to some documentation.
+	//private _propertyActionMenuContext?: UmbPropertyActionMenuContext;
+	private _propertyContext?: UmbWorkspacePropertyContext;
 
 	constructor() {
 		super();
 
+		/*
 		this.consumeContext('umbPropertyActionMenu', (propertyActionsContext: UmbPropertyActionMenuContext) => {
 			this._propertyActionMenuContext = propertyActionsContext;
 		});
+		*/
+		this.consumeContext('umbPropertyContext', (propertyContext: UmbWorkspacePropertyContext) => {
+			this._propertyContext = propertyContext;
+		});
 	}
 
 	private _handleLabelClick() {
 		this._clearValue();
-		// TODO: how do we want to close the menu? Testing an event based approach and context api approach
-		// this.dispatchEvent(new CustomEvent('close', { bubbles: true, composed: true }));
-		this._propertyActionMenuContext?.close();
+		this.dispatchEvent(new CustomEvent('close', { bubbles: true, composed: true }));
+		// Or you can do this:
+		//this._propertyActionMenuContext?.close();
 	}
 
 	private _clearValue() {
 		// TODO: how do we want to update the value? Testing an event based approach. We need to test an api based approach too.
-		this.value = '';
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		//this.value = '';
+		//this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		// Or you can do this:
+		this._propertyContext?.resetValue('');
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
index ca15dbce7d..03db4e593a 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
@@ -68,6 +68,8 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 		this.observe(this._propertyActionMenuContext.isOpen, (value) => {
 			this._open = value;
 		});
+
+		this.addEventListener('close', this._propertyActionMenuContext.close);
 	}
 
 	private _observeActions(alias: string) {

From 259e2a534af3d352969f599b7e1afb174942e10f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 16:09:19 +0100
Subject: [PATCH 30/47] comments

---
 .../workspace-property/workspace-property.context.ts          | 2 +-
 .../property-actions/clear/property-action-clear.element.ts   | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
index d4f7d19981..c2727af359 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
@@ -96,7 +96,7 @@ export class UmbWorkspacePropertyContext<ValueType = unknown> {
 	}
 
 	public resetValue() {
-		this.setValue(null);
+		this.setValue(null);// TODO: Consider if this can be configured/provided from Property Editor or DataType Configuration or even locally specified in DocumentType.
 	}
 
 	// TODO: how can we make sure to call this.
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
index da748fa52b..bfa19bce97 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
@@ -37,10 +37,10 @@ export class UmbPropertyActionClearElement extends UmbLitElement implements UmbP
 
 	private _clearValue() {
 		// TODO: how do we want to update the value? Testing an event based approach. We need to test an api based approach too.
-		//this.value = '';
+		//this.value = '';// This is though bad as it assumes we are dealing with a string. So wouldn't work as a generalized element.
 		//this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 		// Or you can do this:
-		this._propertyContext?.resetValue('');
+		this._propertyContext?.resetValue();// This resets value to what the property wants.
 	}
 
 	render() {

From cdda5e5f4ee502b6b7313b73748afb1b46f2de6b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 16:10:14 +0100
Subject: [PATCH 31/47] stop event.

---
 .../property-action-menu/property-action-menu.element.ts     | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
index 03db4e593a..6898826005 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/shared/property-action-menu/property-action-menu.element.ts
@@ -69,7 +69,10 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 			this._open = value;
 		});
 
-		this.addEventListener('close', this._propertyActionMenuContext.close);
+		this.addEventListener('close', (e) => {
+			this._propertyActionMenuContext.close();
+			e.stopPropagation();
+		});
 	}
 
 	private _observeActions(alias: string) {

From 329cd3a1bdfa458df4cd8a641c49ded5c422c8c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 16:11:03 +0100
Subject: [PATCH 32/47] revert change

---
 .../src/backoffice/shared/property-actions/manifests.ts         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts
index 5b1fce9d23..1b5a1b4307 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/manifests.ts
@@ -16,7 +16,7 @@ export const manifests: Array<ManifestPropertyAction> = [
 		name: 'Clear Property Action',
 		loader: () => import('./clear/property-action-clear.element'),
 		meta: {
-			propertyEditors: ['Umb.PropertyEditorUI.TextArea'],
+			propertyEditors: ['Umb.PropertyEditorUI.TextBox'],
 		},
 	},
 ];

From b161e91d3238544e2093d1d3973e410b22d1965a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 9 Jan 2023 19:14:43 +0100
Subject: [PATCH 33/47] move CreateObservablePart

---
 .../workspace-property.context.ts             | 23 +---------------
 .../observable-api/unique-behavior-subject.ts | 26 ++++++++++++++++++-
 2 files changed, 26 insertions(+), 23 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
index c2727af359..31cbb8f77e 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
@@ -1,8 +1,7 @@
-import { distinctUntilChanged, map, Observable, shareReplay } from "rxjs";
 import { UmbWorkspaceContentContext } from "../workspace/workspace-content/workspace-content.context";
 import type { DataTypeDetails } from "@umbraco-cms/models";
 import { UmbControllerHostInterface } from "src/core/controller/controller-host.mixin";
-import { naiveObjectComparison, UniqueBehaviorSubject } from "src/core/observable-api/unique-behavior-subject";
+import { CreateObservablePart, UniqueBehaviorSubject } from "src/core/observable-api/unique-behavior-subject";
 import { UmbContextProviderController } from "src/core/context-api/provide/context-provider.controller";
 import { UmbContextConsumerController } from "src/core/context-api/consume/context-consumer.controller";
 
@@ -10,27 +9,7 @@ import { UmbContextConsumerController } from "src/core/context-api/consume/conte
 
 
 
-//TODO: Property-Context: move these methods out:
-type MappingFunction<T, R> = (mappable: T) => R;
-type MemoizationFunction<R> = (previousResult: R, currentResult: R) => boolean;
 
-function defaultMemoization(previousValue: any, currentValue: any): boolean {
-  if (typeof previousValue === 'object' && typeof currentValue === 'object') {
-    return naiveObjectComparison(previousValue, currentValue);
-  }
-  return previousValue === currentValue;
-}
-export function CreateObservablePart<T, R> (
-	source$: Observable<T>,
-	mappingFunction: MappingFunction<T, R>,
-	memoizationFunction?: MemoizationFunction<R>
-): Observable<R> {
-	return source$.pipe(
-	  map(mappingFunction),
-	  distinctUntilChanged(memoizationFunction || defaultMemoization),
-	  shareReplay(1)
-	)
-}
 
 
 
diff --git a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
index e2c29f6a43..15e755eee4 100644
--- a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
@@ -1,4 +1,4 @@
-import { BehaviorSubject } from "rxjs";
+import { BehaviorSubject, distinctUntilChanged, map, Observable, shareReplay } from "rxjs";
 
 
 function deepFreeze<T>(inObj: T): T {
@@ -23,6 +23,30 @@ export function naiveObjectComparison(objOne: any, objTwo: any): boolean {
 
 
 
+
+type MappingFunction<T, R> = (mappable: T) => R;
+type MemoizationFunction<R> = (previousResult: R, currentResult: R) => boolean;
+
+function defaultMemoization(previousValue: any, currentValue: any): boolean {
+  if (typeof previousValue === 'object' && typeof currentValue === 'object') {
+    return naiveObjectComparison(previousValue, currentValue);
+  }
+  return previousValue === currentValue;
+}
+export function CreateObservablePart<T, R> (
+	source$: Observable<T>,
+	mappingFunction: MappingFunction<T, R>,
+	memoizationFunction?: MemoizationFunction<R>
+): Observable<R> {
+	return source$.pipe(
+	  map(mappingFunction),
+	  distinctUntilChanged(memoizationFunction || defaultMemoization),
+	  shareReplay(1)
+	)
+}
+
+
+
 export class UniqueBehaviorSubject<T> extends BehaviorSubject<T> {
     constructor(initialData: T) {
         super(deepFreeze(initialData));

From b050934f6831946b41ea2fd682227507874e5404 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Mon, 9 Jan 2023 18:39:43 +0000
Subject: [PATCH 34/47] Bump @typescript-eslint/eslint-plugin from 5.48.0 to
 5.48.1

Bumps [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/eslint-plugin) from 5.48.0 to 5.48.1.
- [Release notes](https://github.com/typescript-eslint/typescript-eslint/releases)
- [Changelog](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/CHANGELOG.md)
- [Commits](https://github.com/typescript-eslint/typescript-eslint/commits/v5.48.1/packages/eslint-plugin)

---
updated-dependencies:
- dependency-name: "@typescript-eslint/eslint-plugin"
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 src/Umbraco.Web.UI.Client/package-lock.json | 372 ++++++++++++++++++--
 src/Umbraco.Web.UI.Client/package.json      |   2 +-
 2 files changed, 338 insertions(+), 36 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/package-lock.json b/src/Umbraco.Web.UI.Client/package-lock.json
index 6606d01495..2e8229427d 100644
--- a/src/Umbraco.Web.UI.Client/package-lock.json
+++ b/src/Umbraco.Web.UI.Client/package-lock.json
@@ -41,7 +41,7 @@
 				"@types/lodash-es": "^4.17.6",
 				"@types/mocha": "^10.0.0",
 				"@types/uuid": "^9.0.0",
-				"@typescript-eslint/eslint-plugin": "^5.48.0",
+				"@typescript-eslint/eslint-plugin": "^5.48.1",
 				"@typescript-eslint/parser": "^5.48.0",
 				"@web/dev-server-esbuild": "^0.3.3",
 				"@web/dev-server-import-maps": "^0.0.7",
@@ -6375,14 +6375,14 @@
 			}
 		},
 		"node_modules/@typescript-eslint/eslint-plugin": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.48.0.tgz",
-			"integrity": "sha512-SVLafp0NXpoJY7ut6VFVUU9I+YeFsDzeQwtK0WZ+xbRN3mtxJ08je+6Oi2N89qDn087COdO0u3blKZNv9VetRQ==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.48.1.tgz",
+			"integrity": "sha512-9nY5K1Rp2ppmpb9s9S2aBiF3xo5uExCehMDmYmmFqqyxgenbHJ3qbarcLt4ITgaD6r/2ypdlcFRdcuVPnks+fQ==",
 			"dev": true,
 			"dependencies": {
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/type-utils": "5.48.0",
-				"@typescript-eslint/utils": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/type-utils": "5.48.1",
+				"@typescript-eslint/utils": "5.48.1",
 				"debug": "^4.3.4",
 				"ignore": "^5.2.0",
 				"natural-compare-lite": "^1.4.0",
@@ -6407,6 +6407,53 @@
 				}
 			}
 		},
+		"node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/scope-manager": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+			"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/types": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+			"dev": true,
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/visitor-keys": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"eslint-visitor-keys": "^3.3.0"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
 		"node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
 			"version": "7.3.8",
 			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -6467,13 +6514,13 @@
 			}
 		},
 		"node_modules/@typescript-eslint/type-utils": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.48.0.tgz",
-			"integrity": "sha512-vbtPO5sJyFjtHkGlGK4Sthmta0Bbls4Onv0bEqOGm7hP9h8UpRsHJwsrCiWtCUndTRNQO/qe6Ijz9rnT/DB+7g==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.48.1.tgz",
+			"integrity": "sha512-Hyr8HU8Alcuva1ppmqSYtM/Gp0q4JOp1F+/JH5D1IZm/bUBrV0edoewQZiEc1r6I8L4JL21broddxK8HAcZiqQ==",
 			"dev": true,
 			"dependencies": {
-				"@typescript-eslint/typescript-estree": "5.48.0",
-				"@typescript-eslint/utils": "5.48.0",
+				"@typescript-eslint/typescript-estree": "5.48.1",
+				"@typescript-eslint/utils": "5.48.1",
 				"debug": "^4.3.4",
 				"tsutils": "^3.21.0"
 			},
@@ -6493,6 +6540,78 @@
 				}
 			}
 		},
+		"node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/types": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+			"dev": true,
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/typescript-estree": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
+			"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1",
+				"debug": "^4.3.4",
+				"globby": "^11.1.0",
+				"is-glob": "^4.0.3",
+				"semver": "^7.3.7",
+				"tsutils": "^3.21.0"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			},
+			"peerDependenciesMeta": {
+				"typescript": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/visitor-keys": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"eslint-visitor-keys": "^3.3.0"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/type-utils/node_modules/semver": {
+			"version": "7.3.8",
+			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+			"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+			"dev": true,
+			"dependencies": {
+				"lru-cache": "^6.0.0"
+			},
+			"bin": {
+				"semver": "bin/semver.js"
+			},
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/@typescript-eslint/types": {
 			"version": "5.48.0",
 			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.0.tgz",
@@ -6549,16 +6668,16 @@
 			}
 		},
 		"node_modules/@typescript-eslint/utils": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.48.0.tgz",
-			"integrity": "sha512-x2jrMcPaMfsHRRIkL+x96++xdzvrdBCnYRd5QiW5Wgo1OB4kDYPbC1XjWP/TNqlfK93K/lUL92erq5zPLgFScQ==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.48.1.tgz",
+			"integrity": "sha512-SmQuSrCGUOdmGMwivW14Z0Lj8dxG1mOFZ7soeJ0TQZEJcs3n5Ndgkg0A4bcMFzBELqLJ6GTHnEU+iIoaD6hFGA==",
 			"dev": true,
 			"dependencies": {
 				"@types/json-schema": "^7.0.9",
 				"@types/semver": "^7.3.12",
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/typescript-estree": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/typescript-estree": "5.48.1",
 				"eslint-scope": "^5.1.1",
 				"eslint-utils": "^3.0.0",
 				"semver": "^7.3.7"
@@ -6574,6 +6693,80 @@
 				"eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
 			}
 		},
+		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/scope-manager": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+			"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/types": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+			"dev": true,
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/typescript-estree": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
+			"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1",
+				"debug": "^4.3.4",
+				"globby": "^11.1.0",
+				"is-glob": "^4.0.3",
+				"semver": "^7.3.7",
+				"tsutils": "^3.21.0"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			},
+			"peerDependenciesMeta": {
+				"typescript": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/visitor-keys": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"eslint-visitor-keys": "^3.3.0"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
 		"node_modules/@typescript-eslint/utils/node_modules/semver": {
 			"version": "7.3.8",
 			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -33057,14 +33250,14 @@
 			}
 		},
 		"@typescript-eslint/eslint-plugin": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.48.0.tgz",
-			"integrity": "sha512-SVLafp0NXpoJY7ut6VFVUU9I+YeFsDzeQwtK0WZ+xbRN3mtxJ08je+6Oi2N89qDn087COdO0u3blKZNv9VetRQ==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.48.1.tgz",
+			"integrity": "sha512-9nY5K1Rp2ppmpb9s9S2aBiF3xo5uExCehMDmYmmFqqyxgenbHJ3qbarcLt4ITgaD6r/2ypdlcFRdcuVPnks+fQ==",
 			"dev": true,
 			"requires": {
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/type-utils": "5.48.0",
-				"@typescript-eslint/utils": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/type-utils": "5.48.1",
+				"@typescript-eslint/utils": "5.48.1",
 				"debug": "^4.3.4",
 				"ignore": "^5.2.0",
 				"natural-compare-lite": "^1.4.0",
@@ -33073,6 +33266,32 @@
 				"tsutils": "^3.21.0"
 			},
 			"dependencies": {
+				"@typescript-eslint/scope-manager": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+					"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"@typescript-eslint/visitor-keys": "5.48.1"
+					}
+				},
+				"@typescript-eslint/types": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+					"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+					"dev": true
+				},
+				"@typescript-eslint/visitor-keys": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+					"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"eslint-visitor-keys": "^3.3.0"
+					}
+				},
 				"semver": {
 					"version": "7.3.8",
 					"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -33107,15 +33326,57 @@
 			}
 		},
 		"@typescript-eslint/type-utils": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.48.0.tgz",
-			"integrity": "sha512-vbtPO5sJyFjtHkGlGK4Sthmta0Bbls4Onv0bEqOGm7hP9h8UpRsHJwsrCiWtCUndTRNQO/qe6Ijz9rnT/DB+7g==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-5.48.1.tgz",
+			"integrity": "sha512-Hyr8HU8Alcuva1ppmqSYtM/Gp0q4JOp1F+/JH5D1IZm/bUBrV0edoewQZiEc1r6I8L4JL21broddxK8HAcZiqQ==",
 			"dev": true,
 			"requires": {
-				"@typescript-eslint/typescript-estree": "5.48.0",
-				"@typescript-eslint/utils": "5.48.0",
+				"@typescript-eslint/typescript-estree": "5.48.1",
+				"@typescript-eslint/utils": "5.48.1",
 				"debug": "^4.3.4",
 				"tsutils": "^3.21.0"
+			},
+			"dependencies": {
+				"@typescript-eslint/types": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+					"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+					"dev": true
+				},
+				"@typescript-eslint/typescript-estree": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
+					"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"@typescript-eslint/visitor-keys": "5.48.1",
+						"debug": "^4.3.4",
+						"globby": "^11.1.0",
+						"is-glob": "^4.0.3",
+						"semver": "^7.3.7",
+						"tsutils": "^3.21.0"
+					}
+				},
+				"@typescript-eslint/visitor-keys": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+					"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"eslint-visitor-keys": "^3.3.0"
+					}
+				},
+				"semver": {
+					"version": "7.3.8",
+					"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+					"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+					"dev": true,
+					"requires": {
+						"lru-cache": "^6.0.0"
+					}
+				}
 			}
 		},
 		"@typescript-eslint/types": {
@@ -33151,21 +33412,62 @@
 			}
 		},
 		"@typescript-eslint/utils": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.48.0.tgz",
-			"integrity": "sha512-x2jrMcPaMfsHRRIkL+x96++xdzvrdBCnYRd5QiW5Wgo1OB4kDYPbC1XjWP/TNqlfK93K/lUL92erq5zPLgFScQ==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.48.1.tgz",
+			"integrity": "sha512-SmQuSrCGUOdmGMwivW14Z0Lj8dxG1mOFZ7soeJ0TQZEJcs3n5Ndgkg0A4bcMFzBELqLJ6GTHnEU+iIoaD6hFGA==",
 			"dev": true,
 			"requires": {
 				"@types/json-schema": "^7.0.9",
 				"@types/semver": "^7.3.12",
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/typescript-estree": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/typescript-estree": "5.48.1",
 				"eslint-scope": "^5.1.1",
 				"eslint-utils": "^3.0.0",
 				"semver": "^7.3.7"
 			},
 			"dependencies": {
+				"@typescript-eslint/scope-manager": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+					"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"@typescript-eslint/visitor-keys": "5.48.1"
+					}
+				},
+				"@typescript-eslint/types": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+					"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+					"dev": true
+				},
+				"@typescript-eslint/typescript-estree": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
+					"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"@typescript-eslint/visitor-keys": "5.48.1",
+						"debug": "^4.3.4",
+						"globby": "^11.1.0",
+						"is-glob": "^4.0.3",
+						"semver": "^7.3.7",
+						"tsutils": "^3.21.0"
+					}
+				},
+				"@typescript-eslint/visitor-keys": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+					"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"eslint-visitor-keys": "^3.3.0"
+					}
+				},
 				"semver": {
 					"version": "7.3.8",
 					"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 2f0ec3c4c4..a99d13c7d3 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -86,7 +86,7 @@
 		"@types/lodash-es": "^4.17.6",
 		"@types/mocha": "^10.0.0",
 		"@types/uuid": "^9.0.0",
-		"@typescript-eslint/eslint-plugin": "^5.48.0",
+		"@typescript-eslint/eslint-plugin": "^5.48.1",
 		"@typescript-eslint/parser": "^5.48.0",
 		"@web/dev-server-esbuild": "^0.3.3",
 		"@web/dev-server-import-maps": "^0.0.7",

From e485573348d023ae59487d28353af1a9f79ea8d6 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Mon, 9 Jan 2023 18:40:59 +0000
Subject: [PATCH 35/47] Bump @typescript-eslint/parser from 5.48.0 to 5.48.1

Bumps [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/parser) from 5.48.0 to 5.48.1.
- [Release notes](https://github.com/typescript-eslint/typescript-eslint/releases)
- [Changelog](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/parser/CHANGELOG.md)
- [Commits](https://github.com/typescript-eslint/typescript-eslint/commits/v5.48.1/packages/parser)

---
updated-dependencies:
- dependency-name: "@typescript-eslint/parser"
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 src/Umbraco.Web.UI.Client/package-lock.json | 167 ++++++++++++++++++--
 src/Umbraco.Web.UI.Client/package.json      |   2 +-
 2 files changed, 155 insertions(+), 14 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/package-lock.json b/src/Umbraco.Web.UI.Client/package-lock.json
index 6606d01495..364d28e408 100644
--- a/src/Umbraco.Web.UI.Client/package-lock.json
+++ b/src/Umbraco.Web.UI.Client/package-lock.json
@@ -42,7 +42,7 @@
 				"@types/mocha": "^10.0.0",
 				"@types/uuid": "^9.0.0",
 				"@typescript-eslint/eslint-plugin": "^5.48.0",
-				"@typescript-eslint/parser": "^5.48.0",
+				"@typescript-eslint/parser": "^5.48.1",
 				"@web/dev-server-esbuild": "^0.3.3",
 				"@web/dev-server-import-maps": "^0.0.7",
 				"@web/test-runner": "^0.15.0",
@@ -6423,14 +6423,14 @@
 			}
 		},
 		"node_modules/@typescript-eslint/parser": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.0.tgz",
-			"integrity": "sha512-1mxNA8qfgxX8kBvRDIHEzrRGrKHQfQlbW6iHyfHYS0Q4X1af+S6mkLNtgCOsGVl8+/LUPrqdHMssAemkrQ01qg==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.1.tgz",
+			"integrity": "sha512-4yg+FJR/V1M9Xoq56SF9Iygqm+r5LMXvheo6DQ7/yUWynQ4YfCRnsKuRgqH4EQ5Ya76rVwlEpw4Xu+TgWQUcdA==",
 			"dev": true,
 			"dependencies": {
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/typescript-estree": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/typescript-estree": "5.48.1",
 				"debug": "^4.3.4"
 			},
 			"engines": {
@@ -6449,6 +6449,95 @@
 				}
 			}
 		},
+		"node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/scope-manager": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+			"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/types": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+			"dev": true,
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/typescript-estree": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
+			"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1",
+				"debug": "^4.3.4",
+				"globby": "^11.1.0",
+				"is-glob": "^4.0.3",
+				"semver": "^7.3.7",
+				"tsutils": "^3.21.0"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			},
+			"peerDependenciesMeta": {
+				"typescript": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/visitor-keys": {
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+			"dev": true,
+			"dependencies": {
+				"@typescript-eslint/types": "5.48.1",
+				"eslint-visitor-keys": "^3.3.0"
+			},
+			"engines": {
+				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/typescript-eslint"
+			}
+		},
+		"node_modules/@typescript-eslint/parser/node_modules/semver": {
+			"version": "7.3.8",
+			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+			"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+			"dev": true,
+			"dependencies": {
+				"lru-cache": "^6.0.0"
+			},
+			"bin": {
+				"semver": "bin/semver.js"
+			},
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/@typescript-eslint/scope-manager": {
 			"version": "5.48.0",
 			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.0.tgz",
@@ -33085,15 +33174,67 @@
 			}
 		},
 		"@typescript-eslint/parser": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.0.tgz",
-			"integrity": "sha512-1mxNA8qfgxX8kBvRDIHEzrRGrKHQfQlbW6iHyfHYS0Q4X1af+S6mkLNtgCOsGVl8+/LUPrqdHMssAemkrQ01qg==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.1.tgz",
+			"integrity": "sha512-4yg+FJR/V1M9Xoq56SF9Iygqm+r5LMXvheo6DQ7/yUWynQ4YfCRnsKuRgqH4EQ5Ya76rVwlEpw4Xu+TgWQUcdA==",
 			"dev": true,
 			"requires": {
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/typescript-estree": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/typescript-estree": "5.48.1",
 				"debug": "^4.3.4"
+			},
+			"dependencies": {
+				"@typescript-eslint/scope-manager": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+					"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"@typescript-eslint/visitor-keys": "5.48.1"
+					}
+				},
+				"@typescript-eslint/types": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+					"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
+					"dev": true
+				},
+				"@typescript-eslint/typescript-estree": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
+					"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"@typescript-eslint/visitor-keys": "5.48.1",
+						"debug": "^4.3.4",
+						"globby": "^11.1.0",
+						"is-glob": "^4.0.3",
+						"semver": "^7.3.7",
+						"tsutils": "^3.21.0"
+					}
+				},
+				"@typescript-eslint/visitor-keys": {
+					"version": "5.48.1",
+					"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+					"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
+					"dev": true,
+					"requires": {
+						"@typescript-eslint/types": "5.48.1",
+						"eslint-visitor-keys": "^3.3.0"
+					}
+				},
+				"semver": {
+					"version": "7.3.8",
+					"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+					"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+					"dev": true,
+					"requires": {
+						"lru-cache": "^6.0.0"
+					}
+				}
 			}
 		},
 		"@typescript-eslint/scope-manager": {
diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 2f0ec3c4c4..84755763e2 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -87,7 +87,7 @@
 		"@types/mocha": "^10.0.0",
 		"@types/uuid": "^9.0.0",
 		"@typescript-eslint/eslint-plugin": "^5.48.0",
-		"@typescript-eslint/parser": "^5.48.0",
+		"@typescript-eslint/parser": "^5.48.1",
 		"@web/dev-server-esbuild": "^0.3.3",
 		"@web/dev-server-import-maps": "^0.0.7",
 		"@web/test-runner": "^0.15.0",

From e3d32e960930a00a5da2d502deb1641a5ab48ddc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 11:12:26 +0100
Subject: [PATCH 36/47] call on constructor

---
 .../dashboard-performance-profiling.element.ts                | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/dashboards/performance-profiling/dashboard-performance-profiling.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/dashboards/performance-profiling/dashboard-performance-profiling.element.ts
index 00ca529b57..6ac5a4205c 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/dashboards/performance-profiling/dashboard-performance-profiling.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/dashboards/performance-profiling/dashboard-performance-profiling.element.ts
@@ -30,8 +30,8 @@ export class UmbDashboardPerformanceProfilingElement extends UmbLitElement {
 	@state()
 	private _profilingPerformance = false;
 
-	connectedCallback(): void {
-		super.connectedCallback();
+	constructor() {
+		super();
 		this._getProfilingStatus();
 		this._profilingPerformance = localStorage.getItem('profilingPerformance') === 'true';
 	}

From c70acfd2fe6840ac47c93cdacd9b939fb8e389a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 11:33:02 +0100
Subject: [PATCH 37/47] make sure property changes is unique

---
 .../content-property.element.ts               | 33 ++++++++++++-------
 .../workspace-property.element.ts             |  1 +
 2 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index ec52058b4c..19262c35d2 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -4,10 +4,11 @@ import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { customElement, property, state } from 'lit/decorators.js';
 
 import { UmbDataTypeStore } from '../../../settings/data-types/data-type.store';
-import type { ContentProperty } from '@umbraco-cms/models';
+import type { ContentProperty, DataTypeDetails } from '@umbraco-cms/models';
 
 import '../workspace-property/workspace-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
+import { UmbObserverController } from '@umbraco-cms/observable-api';
 
 @customElement('umb-content-property')
 export class UmbContentPropertyElement extends UmbLitElement {
@@ -20,14 +21,18 @@ export class UmbContentPropertyElement extends UmbLitElement {
 		`,
 	];
 
+	// TODO: Consider if we just need to get the DataType Key?..
 	private _property?: ContentProperty;
 	@property({ type: Object, attribute: false })
 	public get property(): ContentProperty | undefined {
 		return this._property;
 	}
 	public set property(value: ContentProperty | undefined) {
+		const oldProperty = this._property;
 		this._property = value;
-		this._observeDataType();
+		if(this._property?.dataTypeKey !== oldProperty?.dataTypeKey) {
+			this._observeDataType(this._property?.dataTypeKey);
+		}
 	}
 
 	@property()
@@ -40,26 +45,30 @@ export class UmbContentPropertyElement extends UmbLitElement {
 	private _dataTypeData?: any;
 
 	private _dataTypeStore?: UmbDataTypeStore;
+	private _dataTypeObserver?: UmbObserverController<DataTypeDetails | null>;
 
 	constructor() {
 		super();
 
 		this.consumeContext('umbDataTypeStore', (instance) => {
 			this._dataTypeStore = instance;
-			this._observeDataType();
+			this._observeDataType(this._property?.dataTypeKey);
 		});
 	}
 
-	private _observeDataType() {
-		if (!this._dataTypeStore || !this._property) return;
+	private _observeDataType(dataTypeKey?: string) {
+		if (!this._dataTypeStore) return;
 
-		this.observe(
-			this._dataTypeStore.getByKey(this._property.dataTypeKey),
-			(dataType) => {
-				this._dataTypeData = dataType?.data;
-				this._propertyEditorUIAlias = dataType?.propertyEditorUIAlias || undefined;
-			}
-		);
+		this._dataTypeObserver?.destroy();
+		if(dataTypeKey) {
+			this._dataTypeObserver = this.observe(
+				this._dataTypeStore.getByKey(dataTypeKey),
+				(dataType) => {
+					this._dataTypeData = dataType?.data;
+					this._propertyEditorUIAlias = dataType?.propertyEditorUIAlias || undefined;
+				}
+			);
+		}
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
index e15b03cf6d..a0047bf386 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
@@ -98,6 +98,7 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 	private _propertyEditorUIAlias = '';
 	@property({ type: String, attribute: 'property-editor-ui-alias' })
 	public set propertyEditorUIAlias(value: string) {
+		if(this._propertyEditorUIAlias === value) return;
 		this._propertyEditorUIAlias = value;
 		this._observePropertyEditorUI();
 	}

From 6753410982e8f850ff81565269b1f5c07ba92536 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 11:46:06 +0100
Subject: [PATCH 38/47] change property setting

---
 .../components/content-property/content-property.element.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
index 19262c35d2..233e42ab64 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/content-property/content-property.element.ts
@@ -73,9 +73,9 @@ export class UmbContentPropertyElement extends UmbLitElement {
 
 	render() {
 		return html`<umb-workspace-property
-			label=${ifDefined(this.property?.label)}
-			description=${ifDefined(this.property?.description)}
-			alias="${ifDefined(this.property?.alias)}"
+			alias=${ifDefined(this._property?.alias)}
+			label=${ifDefined(this._property?.label)}
+			description=${ifDefined(this._property?.description)}
 			property-editor-ui-alias="${ifDefined(this._propertyEditorUIAlias)}"
 			.value=${this.value}
 			.config=${this._dataTypeData}></umb-workspace-property>`;

From e1e78083b18a9a589483ef655264796a368533f5 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 10 Jan 2023 12:34:05 +0000
Subject: [PATCH 39/47] Bump @typescript-eslint/parser from 5.48.0 to 5.48.1

Bumps [@typescript-eslint/parser](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/parser) from 5.48.0 to 5.48.1.
- [Release notes](https://github.com/typescript-eslint/typescript-eslint/releases)
- [Changelog](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/parser/CHANGELOG.md)
- [Commits](https://github.com/typescript-eslint/typescript-eslint/commits/v5.48.1/packages/parser)

---
updated-dependencies:
- dependency-name: "@typescript-eslint/parser"
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 src/Umbraco.Web.UI.Client/package-lock.json | 384 +++-----------------
 src/Umbraco.Web.UI.Client/package.json      |   2 +-
 2 files changed, 42 insertions(+), 344 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/package-lock.json b/src/Umbraco.Web.UI.Client/package-lock.json
index 8c29d4a247..54a7c28c35 100644
--- a/src/Umbraco.Web.UI.Client/package-lock.json
+++ b/src/Umbraco.Web.UI.Client/package-lock.json
@@ -42,7 +42,7 @@
 				"@types/mocha": "^10.0.0",
 				"@types/uuid": "^9.0.0",
 				"@typescript-eslint/eslint-plugin": "^5.48.1",
-				"@typescript-eslint/parser": "^5.48.0",
+				"@typescript-eslint/parser": "^5.48.1",
 				"@web/dev-server-esbuild": "^0.3.3",
 				"@web/dev-server-import-maps": "^0.0.7",
 				"@web/test-runner": "^0.15.0",
@@ -6407,53 +6407,6 @@
 				}
 			}
 		},
-		"node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/scope-manager": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
-			"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
-			"dev": true,
-			"dependencies": {
-				"@typescript-eslint/types": "5.48.1",
-				"@typescript-eslint/visitor-keys": "5.48.1"
-			},
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
-		"node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/types": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
-			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
-			"dev": true,
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
-		"node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/visitor-keys": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
-			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
-			"dev": true,
-			"dependencies": {
-				"@typescript-eslint/types": "5.48.1",
-				"eslint-visitor-keys": "^3.3.0"
-			},
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
 		"node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
 			"version": "7.3.8",
 			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -6470,14 +6423,14 @@
 			}
 		},
 		"node_modules/@typescript-eslint/parser": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.0.tgz",
-			"integrity": "sha512-1mxNA8qfgxX8kBvRDIHEzrRGrKHQfQlbW6iHyfHYS0Q4X1af+S6mkLNtgCOsGVl8+/LUPrqdHMssAemkrQ01qg==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.1.tgz",
+			"integrity": "sha512-4yg+FJR/V1M9Xoq56SF9Iygqm+r5LMXvheo6DQ7/yUWynQ4YfCRnsKuRgqH4EQ5Ya76rVwlEpw4Xu+TgWQUcdA==",
 			"dev": true,
 			"dependencies": {
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/typescript-estree": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/typescript-estree": "5.48.1",
 				"debug": "^4.3.4"
 			},
 			"engines": {
@@ -6497,13 +6450,13 @@
 			}
 		},
 		"node_modules/@typescript-eslint/scope-manager": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.0.tgz",
-			"integrity": "sha512-0AA4LviDtVtZqlyUQnZMVHydDATpD9SAX/RC5qh6cBd3xmyWvmXYF+WT1oOmxkeMnWDlUVTwdODeucUnjz3gow==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+			"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
 			"dev": true,
 			"dependencies": {
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/visitor-keys": "5.48.0"
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1"
 			},
 			"engines": {
 				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
@@ -6540,7 +6493,7 @@
 				}
 			}
 		},
-		"node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/types": {
+		"node_modules/@typescript-eslint/types": {
 			"version": "5.48.1",
 			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
 			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
@@ -6553,7 +6506,7 @@
 				"url": "https://opencollective.com/typescript-eslint"
 			}
 		},
-		"node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/typescript-estree": {
+		"node_modules/@typescript-eslint/typescript-estree": {
 			"version": "5.48.1",
 			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
 			"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
@@ -6580,78 +6533,6 @@
 				}
 			}
 		},
-		"node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/visitor-keys": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
-			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
-			"dev": true,
-			"dependencies": {
-				"@typescript-eslint/types": "5.48.1",
-				"eslint-visitor-keys": "^3.3.0"
-			},
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
-		"node_modules/@typescript-eslint/type-utils/node_modules/semver": {
-			"version": "7.3.8",
-			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
-			"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
-			"dev": true,
-			"dependencies": {
-				"lru-cache": "^6.0.0"
-			},
-			"bin": {
-				"semver": "bin/semver.js"
-			},
-			"engines": {
-				"node": ">=10"
-			}
-		},
-		"node_modules/@typescript-eslint/types": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.0.tgz",
-			"integrity": "sha512-UTe67B0Ypius0fnEE518NB2N8gGutIlTojeTg4nt0GQvikReVkurqxd2LvYa9q9M5MQ6rtpNyWTBxdscw40Xhw==",
-			"dev": true,
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
-		"node_modules/@typescript-eslint/typescript-estree": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.0.tgz",
-			"integrity": "sha512-7pjd94vvIjI1zTz6aq/5wwE/YrfIyEPLtGJmRfyNR9NYIW+rOvzzUv3Cmq2hRKpvt6e9vpvPUQ7puzX7VSmsEw==",
-			"dev": true,
-			"dependencies": {
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/visitor-keys": "5.48.0",
-				"debug": "^4.3.4",
-				"globby": "^11.1.0",
-				"is-glob": "^4.0.3",
-				"semver": "^7.3.7",
-				"tsutils": "^3.21.0"
-			},
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			},
-			"peerDependenciesMeta": {
-				"typescript": {
-					"optional": true
-				}
-			}
-		},
 		"node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
 			"version": "7.3.8",
 			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -6693,80 +6574,6 @@
 				"eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
 			}
 		},
-		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/scope-manager": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
-			"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
-			"dev": true,
-			"dependencies": {
-				"@typescript-eslint/types": "5.48.1",
-				"@typescript-eslint/visitor-keys": "5.48.1"
-			},
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
-		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/types": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
-			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
-			"dev": true,
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
-		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/typescript-estree": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
-			"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
-			"dev": true,
-			"dependencies": {
-				"@typescript-eslint/types": "5.48.1",
-				"@typescript-eslint/visitor-keys": "5.48.1",
-				"debug": "^4.3.4",
-				"globby": "^11.1.0",
-				"is-glob": "^4.0.3",
-				"semver": "^7.3.7",
-				"tsutils": "^3.21.0"
-			},
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			},
-			"peerDependenciesMeta": {
-				"typescript": {
-					"optional": true
-				}
-			}
-		},
-		"node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/visitor-keys": {
-			"version": "5.48.1",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
-			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
-			"dev": true,
-			"dependencies": {
-				"@typescript-eslint/types": "5.48.1",
-				"eslint-visitor-keys": "^3.3.0"
-			},
-			"engines": {
-				"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-			},
-			"funding": {
-				"type": "opencollective",
-				"url": "https://opencollective.com/typescript-eslint"
-			}
-		},
 		"node_modules/@typescript-eslint/utils/node_modules/semver": {
 			"version": "7.3.8",
 			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -6783,12 +6590,12 @@
 			}
 		},
 		"node_modules/@typescript-eslint/visitor-keys": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.0.tgz",
-			"integrity": "sha512-5motVPz5EgxQ0bHjut3chzBkJ3Z3sheYVcSwS5BpHZpLqSptSmELNtGixmgj65+rIfhvtQTz5i9OP2vtzdDH7Q==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
 			"dev": true,
 			"dependencies": {
-				"@typescript-eslint/types": "5.48.0",
+				"@typescript-eslint/types": "5.48.1",
 				"eslint-visitor-keys": "^3.3.0"
 			},
 			"engines": {
@@ -33266,32 +33073,6 @@
 				"tsutils": "^3.21.0"
 			},
 			"dependencies": {
-				"@typescript-eslint/scope-manager": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
-					"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
-					"dev": true,
-					"requires": {
-						"@typescript-eslint/types": "5.48.1",
-						"@typescript-eslint/visitor-keys": "5.48.1"
-					}
-				},
-				"@typescript-eslint/types": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
-					"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
-					"dev": true
-				},
-				"@typescript-eslint/visitor-keys": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
-					"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
-					"dev": true,
-					"requires": {
-						"@typescript-eslint/types": "5.48.1",
-						"eslint-visitor-keys": "^3.3.0"
-					}
-				},
 				"semver": {
 					"version": "7.3.8",
 					"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -33304,25 +33085,25 @@
 			}
 		},
 		"@typescript-eslint/parser": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.0.tgz",
-			"integrity": "sha512-1mxNA8qfgxX8kBvRDIHEzrRGrKHQfQlbW6iHyfHYS0Q4X1af+S6mkLNtgCOsGVl8+/LUPrqdHMssAemkrQ01qg==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.48.1.tgz",
+			"integrity": "sha512-4yg+FJR/V1M9Xoq56SF9Iygqm+r5LMXvheo6DQ7/yUWynQ4YfCRnsKuRgqH4EQ5Ya76rVwlEpw4Xu+TgWQUcdA==",
 			"dev": true,
 			"requires": {
-				"@typescript-eslint/scope-manager": "5.48.0",
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/typescript-estree": "5.48.0",
+				"@typescript-eslint/scope-manager": "5.48.1",
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/typescript-estree": "5.48.1",
 				"debug": "^4.3.4"
 			}
 		},
 		"@typescript-eslint/scope-manager": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.0.tgz",
-			"integrity": "sha512-0AA4LviDtVtZqlyUQnZMVHydDATpD9SAX/RC5qh6cBd3xmyWvmXYF+WT1oOmxkeMnWDlUVTwdODeucUnjz3gow==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
+			"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
 			"dev": true,
 			"requires": {
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/visitor-keys": "5.48.0"
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1"
 			}
 		},
 		"@typescript-eslint/type-utils": {
@@ -33335,64 +33116,22 @@
 				"@typescript-eslint/utils": "5.48.1",
 				"debug": "^4.3.4",
 				"tsutils": "^3.21.0"
-			},
-			"dependencies": {
-				"@typescript-eslint/types": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
-					"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
-					"dev": true
-				},
-				"@typescript-eslint/typescript-estree": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
-					"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
-					"dev": true,
-					"requires": {
-						"@typescript-eslint/types": "5.48.1",
-						"@typescript-eslint/visitor-keys": "5.48.1",
-						"debug": "^4.3.4",
-						"globby": "^11.1.0",
-						"is-glob": "^4.0.3",
-						"semver": "^7.3.7",
-						"tsutils": "^3.21.0"
-					}
-				},
-				"@typescript-eslint/visitor-keys": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
-					"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
-					"dev": true,
-					"requires": {
-						"@typescript-eslint/types": "5.48.1",
-						"eslint-visitor-keys": "^3.3.0"
-					}
-				},
-				"semver": {
-					"version": "7.3.8",
-					"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
-					"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
-					"dev": true,
-					"requires": {
-						"lru-cache": "^6.0.0"
-					}
-				}
 			}
 		},
 		"@typescript-eslint/types": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.0.tgz",
-			"integrity": "sha512-UTe67B0Ypius0fnEE518NB2N8gGutIlTojeTg4nt0GQvikReVkurqxd2LvYa9q9M5MQ6rtpNyWTBxdscw40Xhw==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
+			"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
 			"dev": true
 		},
 		"@typescript-eslint/typescript-estree": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.0.tgz",
-			"integrity": "sha512-7pjd94vvIjI1zTz6aq/5wwE/YrfIyEPLtGJmRfyNR9NYIW+rOvzzUv3Cmq2hRKpvt6e9vpvPUQ7puzX7VSmsEw==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
+			"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
 			"dev": true,
 			"requires": {
-				"@typescript-eslint/types": "5.48.0",
-				"@typescript-eslint/visitor-keys": "5.48.0",
+				"@typescript-eslint/types": "5.48.1",
+				"@typescript-eslint/visitor-keys": "5.48.1",
 				"debug": "^4.3.4",
 				"globby": "^11.1.0",
 				"is-glob": "^4.0.3",
@@ -33427,47 +33166,6 @@
 				"semver": "^7.3.7"
 			},
 			"dependencies": {
-				"@typescript-eslint/scope-manager": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-5.48.1.tgz",
-					"integrity": "sha512-S035ueRrbxRMKvSTv9vJKIWgr86BD8s3RqoRZmsSh/s8HhIs90g6UlK8ZabUSjUZQkhVxt7nmZ63VJ9dcZhtDQ==",
-					"dev": true,
-					"requires": {
-						"@typescript-eslint/types": "5.48.1",
-						"@typescript-eslint/visitor-keys": "5.48.1"
-					}
-				},
-				"@typescript-eslint/types": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-5.48.1.tgz",
-					"integrity": "sha512-xHyDLU6MSuEEdIlzrrAerCGS3T7AA/L8Hggd0RCYBi0w3JMvGYxlLlXHeg50JI9Tfg5MrtsfuNxbS/3zF1/ATg==",
-					"dev": true
-				},
-				"@typescript-eslint/typescript-estree": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-5.48.1.tgz",
-					"integrity": "sha512-Hut+Osk5FYr+sgFh8J/FHjqX6HFcDzTlWLrFqGoK5kVUN3VBHF/QzZmAsIXCQ8T/W9nQNBTqalxi1P3LSqWnRA==",
-					"dev": true,
-					"requires": {
-						"@typescript-eslint/types": "5.48.1",
-						"@typescript-eslint/visitor-keys": "5.48.1",
-						"debug": "^4.3.4",
-						"globby": "^11.1.0",
-						"is-glob": "^4.0.3",
-						"semver": "^7.3.7",
-						"tsutils": "^3.21.0"
-					}
-				},
-				"@typescript-eslint/visitor-keys": {
-					"version": "5.48.1",
-					"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
-					"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
-					"dev": true,
-					"requires": {
-						"@typescript-eslint/types": "5.48.1",
-						"eslint-visitor-keys": "^3.3.0"
-					}
-				},
 				"semver": {
 					"version": "7.3.8",
 					"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
@@ -33480,12 +33178,12 @@
 			}
 		},
 		"@typescript-eslint/visitor-keys": {
-			"version": "5.48.0",
-			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.0.tgz",
-			"integrity": "sha512-5motVPz5EgxQ0bHjut3chzBkJ3Z3sheYVcSwS5BpHZpLqSptSmELNtGixmgj65+rIfhvtQTz5i9OP2vtzdDH7Q==",
+			"version": "5.48.1",
+			"resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.48.1.tgz",
+			"integrity": "sha512-Ns0XBwmfuX7ZknznfXozgnydyR8F6ev/KEGePP4i74uL3ArsKbEhJ7raeKr1JSa997DBDwol/4a0Y+At82c9dA==",
 			"dev": true,
 			"requires": {
-				"@typescript-eslint/types": "5.48.0",
+				"@typescript-eslint/types": "5.48.1",
 				"eslint-visitor-keys": "^3.3.0"
 			}
 		},
diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 600eb48cfc..d71a1eadcb 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -87,7 +87,7 @@
 		"@types/mocha": "^10.0.0",
 		"@types/uuid": "^9.0.0",
 		"@typescript-eslint/eslint-plugin": "^5.48.1",
-		"@typescript-eslint/parser": "^5.48.0",
+		"@typescript-eslint/parser": "^5.48.1",
 		"@web/dev-server-esbuild": "^0.3.3",
 		"@web/dev-server-import-maps": "^0.0.7",
 		"@web/test-runner": "^0.15.0",

From 134069851fe1312436bfec23602e29170cbe743f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 14:24:09 +0100
Subject: [PATCH 40/47] added comment

---
 .../observable-api/unique-behavior-subject.ts | 52 ++++++++++---------
 1 file changed, 27 insertions(+), 25 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
index 15e755eee4..d6e7d58fdc 100644
--- a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
@@ -28,38 +28,40 @@ type MappingFunction<T, R> = (mappable: T) => R;
 type MemoizationFunction<R> = (previousResult: R, currentResult: R) => boolean;
 
 function defaultMemoization(previousValue: any, currentValue: any): boolean {
-  if (typeof previousValue === 'object' && typeof currentValue === 'object') {
-    return naiveObjectComparison(previousValue, currentValue);
-  }
-  return previousValue === currentValue;
+if (typeof previousValue === 'object' && typeof currentValue === 'object') {
+  return naiveObjectComparison(previousValue, currentValue);
+}
+return previousValue === currentValue;
 }
 export function CreateObservablePart<T, R> (
-	source$: Observable<T>,
-	mappingFunction: MappingFunction<T, R>,
-	memoizationFunction?: MemoizationFunction<R>
+source$: Observable<T>,
+mappingFunction: MappingFunction<T, R>,
+memoizationFunction?: MemoizationFunction<R>
 ): Observable<R> {
-	return source$.pipe(
-	  map(mappingFunction),
-	  distinctUntilChanged(memoizationFunction || defaultMemoization),
-	  shareReplay(1)
-	)
+return source$.pipe(
+map(mappingFunction),
+distinctUntilChanged(memoizationFunction || defaultMemoization),
+shareReplay(1)
+)
 }
 
 
-
+// TODO: Write JSDocs
+// TODO: Write comments about what it is and how it works.
 export class UniqueBehaviorSubject<T> extends BehaviorSubject<T> {
-    constructor(initialData: T) {
-        super(deepFreeze(initialData));
-    }
+constructor(initialData: T) {
 
-    next(newData: T): void {
-        const frozenData = deepFreeze(newData);
-        if (!naiveObjectComparison(frozenData, this.getValue())) {
-            super.next(frozenData);
-        }
-    }
+super(deepFreeze(initialData));
+}
 
-    update(data: Partial<T>) {
-		this.next({ ...this.getValue(), ...data });
-	}
+next(newData: T): void {
+const frozenData = deepFreeze(newData);
+if (!naiveObjectComparison(frozenData, this.getValue())) {
+super.next(frozenData);
+}
+}
+
+update(data: Partial<T>) {
+this.next({ ...this.getValue(), ...data });
+}
 }
\ No newline at end of file

From b1baa70c4730b02dde402aa29db6a1ee09a51573 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 14:30:40 +0100
Subject: [PATCH 41/47] add Alias to Import

---
 .../documents/workspace/document-workspace.context.ts         | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts
index da1b8b5d3d..45c863497f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/documents/workspace/document-workspace.context.ts
@@ -1,5 +1,5 @@
 import { UmbWorkspaceContentContext } from '../../../shared/components/workspace/workspace-content/workspace-content.context';
-import { isDocumentDetails, STORE_ALIAS } from 'src/backoffice/documents/documents/document.store';
+import { isDocumentDetails, STORE_ALIAS as DOCUMENT_STORE_ALIAS } from 'src/backoffice/documents/documents/document.store';
 import type { UmbDocumentStore, UmbDocumentStoreItemType } from 'src/backoffice/documents/documents/document.store';
 import { UmbControllerHostInterface } from 'src/core/controller/controller-host.mixin';
 import type { DocumentDetails } from '@umbraco-cms/models';
@@ -35,7 +35,7 @@ const DefaultDocumentData = {
 
 export class UmbWorkspaceDocumentContext extends UmbWorkspaceContentContext<UmbDocumentStoreItemType, UmbDocumentStore> {
 	constructor(host: UmbControllerHostInterface) {
-		super(host, DefaultDocumentData, STORE_ALIAS, 'document');
+		super(host, DefaultDocumentData, DOCUMENT_STORE_ALIAS, 'document');
 	}
 
 	public setPropertyValue(alias: string, value: unknown) {

From 8bdc14f818cfae35d4785ce5d57e0a94951735a0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 15:34:05 +0100
Subject: [PATCH 42/47] refactor property editor chang event

---
 .../input-user-group.element.ts               |  2 +-
 .../input-user/input-user.element.ts          |  2 +-
 .../input-section/input-section.element.ts    |  2 +-
 .../workspace-property.element.ts             | 41 ++++++++++++-------
 .../clear/property-action-clear.element.ts    |  4 +-
 ...operty-editor-ui-content-picker.element.ts |  2 +-
 .../property-editor-ui-number.element.ts      |  2 +-
 .../property-editor-ui-text-box.element.ts    |  2 +-
 .../property-editor-ui-textarea.element.ts    | 10 ++---
 9 files changed, 38 insertions(+), 29 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts b/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts
index f1133821f4..7f92e52413 100644
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts
@@ -63,7 +63,7 @@ export class UmbInputPickerUserGroupElement extends UmbInputListBase {
 
 	selectionUpdated() {
 		this._observeUserGroups();
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 	}
 
 	private _renderUserGroupList() {
diff --git a/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts b/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts
index dd99d8520d..16d035b2f4 100644
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts
@@ -63,7 +63,7 @@ export class UmbPickerUserElement extends UmbInputListBase {
 
 	selectionUpdated() {
 		this._observeUser();
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 	}
 
 	private _renderUserList() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts
index 8d26ad21e2..26e3295df2 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts
@@ -58,7 +58,7 @@ export class UmbInputPickerSectionElement extends UmbInputListBase {
 	selectionUpdated() {
 		this._observeSections();
 		// TODO: Use proper event class:
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 	}
 
 	renderContent() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
index a0047bf386..16cfea9da7 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.element.ts
@@ -136,6 +136,9 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 
 	private propertyEditorUIObserver?: UmbObserverController<ManifestTypes>;
 
+	private _valueObserver?: UmbObserverController<unknown>;
+	private _configObserver?: UmbObserverController<unknown>;
+
 
 	constructor() {
 		super();
@@ -147,15 +150,13 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 			this._description = description;
 		});
 
-		// TODO: maybe this would be called change.
-		this.addEventListener('change', this._onPropertyEditorChange as any as EventListener);
-
 	}
 
 	private _onPropertyEditorChange = (e: CustomEvent) => {
 		const target = e.composedPath()[0] as any;
 
 		this.value = target.value;// Sets value in context.
+		e.stopPropagation();
 	};
 
 	private _observePropertyEditorUI() {
@@ -174,27 +175,37 @@ export class UmbWorkspacePropertyElement extends UmbLitElement {
 		createExtensionElement(manifest)
 			.then((el) => {
 				const oldValue = this._element;
+
+				oldValue?.removeEventListener('change', this._onPropertyEditorChange as any as EventListener);
+
 				this._element = el;
 
-				this.observe(this._propertyContext.value, (value) => {
-					if(this._element) {
-						this._element.value = value;
-					}
-				});
-				this.observe(this._propertyContext.config, (config) => {
-					if(this._element) {
-						this._element.config = config;
-					}
-				});
+				this._valueObserver?.destroy();
+				this._configObserver?.destroy();
+
+				if(this._element) {
+					this._element.addEventListener('change', this._onPropertyEditorChange as any as EventListener);
+
+					this._valueObserver = this.observe(this._propertyContext.value, (value) => {
+						if(this._element) {
+							this._element.value = value;
+						}
+					});
+					this._configObserver = this.observe(this._propertyContext.config, (config) => {
+						if(this._element) {
+							this._element.config = config;
+						}
+					});
+				}
 
 				this.requestUpdate('element', oldValue);
-				
+
 			})
 			.catch(() => {
 				// TODO: loading JS failed so we should do some nice UI. (This does only happen if extension has a js prop, otherwise we concluded that no source was needed resolved the load.)
 			});
 	}
-	
+
 
 	render() {
 		return html`
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
index bfa19bce97..b5e81487e1 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
@@ -7,7 +7,7 @@ import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-property-action-clear')
 export class UmbPropertyActionClearElement extends UmbLitElement implements UmbPropertyAction {
-	
+
 	@property()
 	value = '';
 
@@ -38,7 +38,7 @@ export class UmbPropertyActionClearElement extends UmbLitElement implements UmbP
 	private _clearValue() {
 		// TODO: how do we want to update the value? Testing an event based approach. We need to test an api based approach too.
 		//this.value = '';// This is though bad as it assumes we are dealing with a string. So wouldn't work as a generalized element.
-		//this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		//this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 		// Or you can do this:
 		this._propertyContext?.resetValue();// This resets value to what the property wants.
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
index e8030b3049..9ce4bfc0d5 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
@@ -90,7 +90,7 @@ export class UmbPropertyEditorUIContentPickerElement extends UmbLitElement {
 	private _setValue(newValue: Array<string>) {
 		this.value = newValue;
 		this._observePickedDocuments();
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 	}
 
 	private _renderItem(item: FolderTreeItem) {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
index 42d35c2c8e..fb1e450df1 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUINumberElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
index 104f87accb..8845fd53e5 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUITextBoxElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
index 36537cdb84..df1980458f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/textarea/property-editor-ui-textarea.element.ts
@@ -3,6 +3,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, property } from 'lit/decorators.js';
 import type { UmbWorkspacePropertyContext } from 'src/backoffice/shared/components/workspace-property/workspace-property.context';
 import { UmbLitElement } from '@umbraco-cms/element';
+import { UUITextareaElement } from '@umbraco-ui/uui';
 
 @customElement('umb-property-editor-ui-textarea')
 export class UmbPropertyEditorUITextareaElement extends UmbLitElement {
@@ -32,16 +33,13 @@ export class UmbPropertyEditorUITextareaElement extends UmbLitElement {
 	}
 
 	private onInput(e: InputEvent) {
-		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+		this.value = (e.target as UUITextareaElement).value as string;
+		this.dispatchEvent(new CustomEvent('property-value-change'));
 	}
 
 	render() {
 		return html`
-			<uui-textarea .value=${this.value} @input=${this.onInput}></uui-textarea>
-			${this.config?.map((property: any) => html`<div>${property.alias}: ${property.value}</div>`)}
-			<button @click=${() => this.propertyContext?.resetValue()}>Reset</button>
-			<button @click=${() => this.propertyContext?.setLabel('random' + Math.random()*10)}>Label change</button>`;
+			<uui-textarea .value=${this.value} @input=${this.onInput}></uui-textarea>`;
 	}
 }
 

From 9a02b4026de317b328cdc2d9b44eae5d1986a213 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 15:47:03 +0100
Subject: [PATCH 43/47] simpler initialization of Subject

---
 .../workspace-property/workspace-property.context.ts       | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
index 31cbb8f77e..9dcbc36281 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace-property/workspace-property.context.ts
@@ -15,6 +15,7 @@ import { UmbContextConsumerController } from "src/core/context-api/consume/conte
 
 
 
+// If we get this from the server then we can consider using TypeScripts Partial<> around the model from the Management-API.
 export type WorkspacePropertyData<ValueType> = {
 	alias?: string;
 	label?: string;
@@ -28,7 +29,7 @@ export class UmbWorkspacePropertyContext<ValueType = unknown> {
 
 	private _providerController: UmbContextProviderController;
 
-	private _data: UniqueBehaviorSubject<WorkspacePropertyData<ValueType>> = new UniqueBehaviorSubject({} as WorkspacePropertyData<ValueType>);
+	private _data = new UniqueBehaviorSubject<WorkspacePropertyData<ValueType>>({});
 
 	public readonly alias = CreateObservablePart(this._data, data => data.alias);
 	public readonly label = CreateObservablePart(this._data, data => data.label);
@@ -47,9 +48,9 @@ export class UmbWorkspacePropertyContext<ValueType = unknown> {
 
 		this._providerController = new UmbContextProviderController(host, 'umbPropertyContext', this);
 
-	
+
 	}
-	
+
 	public setAlias(alias: WorkspacePropertyData<ValueType>['alias']) {
 		this._data.update({alias: alias});
 	}

From af83aabe6dcb5343be5d2805b0748c19c6f51dad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 15:51:27 +0100
Subject: [PATCH 44/47] JSDocs

---
 .../workspace-content/workspace-content.context.ts         | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 0aad0a639b..8febc888ab 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -8,11 +8,12 @@ import { UmbContextConsumerController } from 'src/core/context-api/consume/conte
 import { UmbObserverController } from '@umbraco-cms/observable-api';
 import { UmbContextProviderController } from 'src/core/context-api/provide/context-provider.controller';
 import { EntityTreeItem } from '@umbraco-cms/backend-api';
+import { ContentDetails } from '@umbraco-cms/models';
 
 // TODO: Consider if its right to have this many class-inheritance of WorkspaceContext
 // TODO: Could we extract this code into a 'Manager' of its own, which will be instantiated by the concrete Workspace Context. This will be more transparent and 'reuseable'
 export abstract class UmbWorkspaceContentContext<
-	ContentTypeType extends EntityTreeItem = EntityTreeItem,
+	ContentTypeType extends ContentDetails = ContentDetails,
 	StoreType extends UmbNodeStoreBase<ContentTypeType> = UmbNodeStoreBase<ContentTypeType>
 > {
 
@@ -96,7 +97,7 @@ export abstract class UmbWorkspaceContentContext<
 
 		if(!this.#isNew) {
 			this._storeSubscription?.destroy();
-			this._storeSubscription = new UmbObserverController(this._host, this._store.getByKey(this.entityKey), 
+			this._storeSubscription = new UmbObserverController(this._host, this._store.getByKey(this.entityKey),
 			(content) => {
 				if (!content) return; // TODO: Handle nicely if there is no content data.
 				this.update(content as any);
@@ -134,4 +135,4 @@ export abstract class UmbWorkspaceContentContext<
 	public destroy(): void {
 		this._data.unsubscribe();
 	}
-}
\ No newline at end of file
+}

From 25fd0bc0754835964c021db657ca2d9d64b03726 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 15:51:52 +0100
Subject: [PATCH 45/47] revert

---
 .../workspace/workspace-content/workspace-content.context.ts   | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
index 8febc888ab..0eac7ff837 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/workspace-content.context.ts
@@ -8,12 +8,11 @@ import { UmbContextConsumerController } from 'src/core/context-api/consume/conte
 import { UmbObserverController } from '@umbraco-cms/observable-api';
 import { UmbContextProviderController } from 'src/core/context-api/provide/context-provider.controller';
 import { EntityTreeItem } from '@umbraco-cms/backend-api';
-import { ContentDetails } from '@umbraco-cms/models';
 
 // TODO: Consider if its right to have this many class-inheritance of WorkspaceContext
 // TODO: Could we extract this code into a 'Manager' of its own, which will be instantiated by the concrete Workspace Context. This will be more transparent and 'reuseable'
 export abstract class UmbWorkspaceContentContext<
-	ContentTypeType extends ContentDetails = ContentDetails,
+	ContentTypeType extends EntityTreeItem = EntityTreeItem,
 	StoreType extends UmbNodeStoreBase<ContentTypeType> = UmbNodeStoreBase<ContentTypeType>
 > {
 

From 19d83cc7304ba2244736028caac63c5a04f92d75 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 15:52:00 +0100
Subject: [PATCH 46/47] JSDocs

---
 .../observable-api/unique-behavior-subject.ts | 79 ++++++++++++-------
 1 file changed, 50 insertions(+), 29 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
index d6e7d58fdc..c3a763b325 100644
--- a/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/observable-api/unique-behavior-subject.ts
@@ -3,7 +3,7 @@ import { BehaviorSubject, distinctUntilChanged, map, Observable, shareReplay } f
 
 function deepFreeze<T>(inObj: T): T {
     Object.freeze(inObj);
-  
+
     Object.getOwnPropertyNames(inObj).forEach(function (prop) {
       // eslint-disable-next-line no-prototype-builtins
       if ((inObj as any).hasOwnProperty(prop)
@@ -28,40 +28,61 @@ type MappingFunction<T, R> = (mappable: T) => R;
 type MemoizationFunction<R> = (previousResult: R, currentResult: R) => boolean;
 
 function defaultMemoization(previousValue: any, currentValue: any): boolean {
-if (typeof previousValue === 'object' && typeof currentValue === 'object') {
-  return naiveObjectComparison(previousValue, currentValue);
-}
-return previousValue === currentValue;
+  if (typeof previousValue === 'object' && typeof currentValue === 'object') {
+    return naiveObjectComparison(previousValue, currentValue);
+  }
+  return previousValue === currentValue;
 }
+
+/**
+ * @export
+ * @method CreateObservablePart
+ * @param {Observable<T>} source - RxJS Subject to use for this Observable.
+ * @param {(mappable: T) => R} mappingFunction - Method to return the part for this Observable to return.
+ * @param {(previousResult: R, currentResult: R) => boolean} [memoizationFunction] - Method to Compare if the data has changed. Should return true when data is different.
+ * @description - Creates a RxJS Observable from RxJS Subject.
+ * @example <caption>Example create a Observable for part of the data Subject.</caption>
+ * public readonly myPart = CreateObservablePart(this._data, (data) => data.myPart);
+ */
 export function CreateObservablePart<T, R> (
-source$: Observable<T>,
-mappingFunction: MappingFunction<T, R>,
-memoizationFunction?: MemoizationFunction<R>
-): Observable<R> {
-return source$.pipe(
-map(mappingFunction),
-distinctUntilChanged(memoizationFunction || defaultMemoization),
-shareReplay(1)
-)
+  source$: Observable<T>,
+    mappingFunction: MappingFunction<T, R>,
+    memoizationFunction?: MemoizationFunction<R>
+  ): Observable<R> {
+  return source$.pipe(
+    map(mappingFunction),
+    distinctUntilChanged(memoizationFunction || defaultMemoization),
+    shareReplay(1)
+  )
 }
 
 
-// TODO: Write JSDocs
-// TODO: Write comments about what it is and how it works.
+/**
+ * @export
+ * @class UniqueBehaviorSubject
+ * @extends {BehaviorSubject<T>}
+ * @description - A RxJS BehaviorSubject which deepFreezes the data to ensure its not manipulated from any implementations.
+ * Additionally the Subject ensures the data is unique, not updating any Observes unless there is an actual change of the content.
+ */
 export class UniqueBehaviorSubject<T> extends BehaviorSubject<T> {
-constructor(initialData: T) {
+  constructor(initialData: T) {
+    super(deepFreeze(initialData));
+  }
 
-super(deepFreeze(initialData));
-}
+  next(newData: T): void {
+    const frozenData = deepFreeze(newData);
+		// Only update data if its different than current data.
+    if (!naiveObjectComparison(frozenData, this.getValue())) {
+      super.next(frozenData);
+    }
+  }
 
-next(newData: T): void {
-const frozenData = deepFreeze(newData);
-if (!naiveObjectComparison(frozenData, this.getValue())) {
-super.next(frozenData);
+	/**
+	 * Partial update data set, only works for Objects.
+	 * TODO: consider moving this into a specific class for Objects?
+	 * Consider doing similar for Array?
+	 */
+  update(data: Partial<T>) {
+    this.next({ ...this.getValue(), ...data });
+  }
 }
-}
-
-update(data: Partial<T>) {
-this.next({ ...this.getValue(), ...data });
-}
-}
\ No newline at end of file

From ce8f692c2b83eb8c6aa304fac827fd168a6e8744 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 10 Jan 2023 16:03:27 +0100
Subject: [PATCH 47/47] correct events

---
 .../components/input-user-group/input-user-group.element.ts     | 2 +-
 .../src/auth/components/input-user/input-user.element.ts        | 2 +-
 .../shared/components/input-section/input-section.element.ts    | 2 +-
 .../property-actions/clear/property-action-clear.element.ts     | 2 +-
 .../content-picker/property-editor-ui-content-picker.element.ts | 2 +-
 .../uis/number/property-editor-ui-number.element.ts             | 2 +-
 .../uis/text-box/property-editor-ui-text-box.element.ts         | 2 +-
 7 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts b/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts
index 7f92e52413..f1133821f4 100644
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts
@@ -63,7 +63,7 @@ export class UmbInputPickerUserGroupElement extends UmbInputListBase {
 
 	selectionUpdated() {
 		this._observeUserGroups();
-		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	private _renderUserGroupList() {
diff --git a/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts b/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts
index 16d035b2f4..dd99d8520d 100644
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts
@@ -63,7 +63,7 @@ export class UmbPickerUserElement extends UmbInputListBase {
 
 	selectionUpdated() {
 		this._observeUser();
-		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	private _renderUserList() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts
index 26e3295df2..8d26ad21e2 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.element.ts
@@ -58,7 +58,7 @@ export class UmbInputPickerSectionElement extends UmbInputListBase {
 	selectionUpdated() {
 		this._observeSections();
 		// TODO: Use proper event class:
-		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
 	}
 
 	renderContent() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
index b5e81487e1..6df5a91cc9 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-actions/clear/property-action-clear.element.ts
@@ -38,7 +38,7 @@ export class UmbPropertyActionClearElement extends UmbLitElement implements UmbP
 	private _clearValue() {
 		// TODO: how do we want to update the value? Testing an event based approach. We need to test an api based approach too.
 		//this.value = '';// This is though bad as it assumes we are dealing with a string. So wouldn't work as a generalized element.
-		//this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
+		//this.dispatchEvent(new CustomEvent('property-value-change'));
 		// Or you can do this:
 		this._propertyContext?.resetValue();// This resets value to what the property wants.
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
index 9ce4bfc0d5..e3d5dfa1c4 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/content-picker/property-editor-ui-content-picker.element.ts
@@ -90,7 +90,7 @@ export class UmbPropertyEditorUIContentPickerElement extends UmbLitElement {
 	private _setValue(newValue: Array<string>) {
 		this.value = newValue;
 		this._observePickedDocuments();
-		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change'));
 	}
 
 	private _renderItem(item: FolderTreeItem) {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
index fb1e450df1..7c704fbc8c 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUINumberElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change'));
 	}
 
 	render() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
index 8845fd53e5..302a353da3 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/text-box/property-editor-ui-text-box.element.ts
@@ -21,7 +21,7 @@ export class UmbPropertyEditorUITextBoxElement extends LitElement {
 
 	private onInput(e: InputEvent) {
 		this.value = (e.target as HTMLInputElement).value;
-		this.dispatchEvent(new CustomEvent('property-value-change', { bubbles: true, composed: true }));
+		this.dispatchEvent(new CustomEvent('property-value-change'));
 	}
 
 	render() {