diff --git a/src/Umbraco.Web.UI.Client/.gitignore b/src/Umbraco.Web.UI.Client/.gitignore
index def38d0c92..203142b8ae 100644
--- a/src/Umbraco.Web.UI.Client/.gitignore
+++ b/src/Umbraco.Web.UI.Client/.gitignore
@@ -15,7 +15,7 @@ types
 *.tgz
 
 ## testing
-/coverage/
+coverage/
 
 # Editor directories and files
 .vscode/*
@@ -32,9 +32,9 @@ types
 
 # eslint
 .eslintcache
-/test-results/
-/playwright-report/
-/playwright/.cache/
+test-results/
+playwright-report/
+playwright/.cache/
 
 # storybook
 storybook-static/
diff --git a/src/Umbraco.Web.UI.Client/.storybook/main.js b/src/Umbraco.Web.UI.Client/.storybook/main.js
index 41f0022362..8d47e61583 100644
--- a/src/Umbraco.Web.UI.Client/.storybook/main.js
+++ b/src/Umbraco.Web.UI.Client/.storybook/main.js
@@ -2,7 +2,7 @@ const tsconfigPaths = require('vite-tsconfig-paths').default;
 const { mergeConfig } = require('vite');
 
 module.exports = {
-	stories: ['../@(src|libs)/**/*.stories.@(js|jsx|ts|tsx|mdx)'],
+	stories: ['../@(src|libs|apps)/**/*.stories.@(js|jsx|ts|tsx|mdx)'],
 	addons: ['@storybook/addon-links', '@storybook/addon-essentials', '@storybook/addon-a11y'],
 	framework: '@storybook/web-components',
 	features: {
diff --git a/src/Umbraco.Web.UI.Client/.storybook/preview.js b/src/Umbraco.Web.UI.Client/.storybook/preview.js
index 10c6daa7b0..9e30c4c31a 100644
--- a/src/Umbraco.Web.UI.Client/.storybook/preview.js
+++ b/src/Umbraco.Web.UI.Client/.storybook/preview.js
@@ -1,5 +1,5 @@
-import '../src/core/css/custom-properties.css';
 import '@umbraco-ui/uui-css/dist/uui-css.css';
+import '../libs/css/custom-properties.css';
 
 import '@umbraco-ui/uui';
 import '@umbraco-ui/uui-modal';
@@ -23,7 +23,7 @@ import { UmbModalService } from '../src/core/modal';
 
 // TODO: Fix storybook manifest registrations.
 
-import { umbExtensionsRegistry } from '../libs/extensions-registry';
+import { umbExtensionsRegistry } from '../libs/extensions-api';
 
 import '../src/backoffice/shared/components/backoffice-frame/backoffice-notification-container.element';
 import '../libs/element/context-provider.element';
@@ -55,11 +55,11 @@ customElements.define('umb-storybook', UmbStoryBookElement);
 const storybookProvider = (story) => html` <umb-storybook>${story()}</umb-storybook> `;
 
 const dataTypeStoreProvider = (story) => html`
-	<umb-context-provider key=${UMB_DATA_TYPE_DETAIL_STORE_CONTEXT_TOKEN.toString()} .value=${new UmbDataTypeDetailStore()}>${story()}</umb-context-provider>
+	<umb-context-provider key=${UMB_DATA_TYPE_DETAIL_STORE_CONTEXT_TOKEN.toString()} .create=${host => new UmbDataTypeDetailStore(host)}>${story()}</umb-context-provider>
 `;
 
 const documentTypeStoreProvider = (story) => html`
-	<umb-context-provider key=${UMB_DOCUMENT_TYPE_DETAIL_STORE_CONTEXT_TOKEN.toString()} .value=${new UmbDocumentTypeDetailStore()}
+	<umb-context-provider key=${UMB_DOCUMENT_TYPE_DETAIL_STORE_CONTEXT_TOKEN.toString()} .create=${host => new UmbDocumentTypeDetailStore(host)}
 		>${story()}</umb-context-provider
 	>
 `;
diff --git a/src/Umbraco.Web.UI.Client/e2e/login.spec.ts b/src/Umbraco.Web.UI.Client/e2e/login.spec.ts
deleted file mode 100644
index 2b0598fa92..0000000000
--- a/src/Umbraco.Web.UI.Client/e2e/login.spec.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { expect, test } from './test';
-
-test('login', async ({ page }) => {
-	// Go to /login
-	await page.goto('/login');
-
-	// Fill input[name="email"]
-	await page.locator('input[name="email"]').fill('test@umbraco.com');
-
-	// Fill input[name="password"]
-	await page.locator('input[name="password"]').fill('test123456');
-
-	// Click [aria-label="Login"]
-	await page.locator('[aria-label="Login"]').click();
-
-	await expect(page).toHaveURL(`/section/content/dashboard/welcome`);
-});
diff --git a/src/Umbraco.Web.UI.Client/libs/element/context-provider.element.ts b/src/Umbraco.Web.UI.Client/libs/element/context-provider.element.ts
index 7155397b84..9d04a92ab2 100644
--- a/src/Umbraco.Web.UI.Client/libs/element/context-provider.element.ts
+++ b/src/Umbraco.Web.UI.Client/libs/element/context-provider.element.ts
@@ -1,9 +1,18 @@
 import { html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { UmbLitElement } from './lit-element.element';
+import type { UmbControllerHostInterface } from '@umbraco-cms/controller';
 
 @customElement('umb-context-provider')
 export class UmbContextProviderElement extends UmbLitElement {
+
+	/**
+	 * The value to provide to the context.
+	 * @required
+	 */
+	@property({ type: Object, attribute: false })
+	create?: (host:UmbControllerHostInterface) => unknown;
+
 	/**
 	 * The value to provide to the context.
 	 * @required
@@ -23,7 +32,9 @@ export class UmbContextProviderElement extends UmbLitElement {
 		if (!this.key) {
 			throw new Error('The key property is required.');
 		}
-		if (!this.value) {
+		if (this.create) {
+			this.value = this.create(this);
+		} else if (!this.value) {
 			throw new Error('The value property is required.');
 		}
 		this.provideContext(this.key, this.value);
diff --git a/src/Umbraco.Web.UI.Client/libs/extensions-api/index.ts b/src/Umbraco.Web.UI.Client/libs/extensions-api/index.ts
index 56e697161e..bd0c6626ca 100644
--- a/src/Umbraco.Web.UI.Client/libs/extensions-api/index.ts
+++ b/src/Umbraco.Web.UI.Client/libs/extensions-api/index.ts
@@ -1,3 +1,5 @@
+import { UmbExtensionRegistry } from './registry/extension.registry';
+
 export * from './registry/extension.registry';
 export * from './create-extension-element.function';
 export * from './has-default-export.function';
@@ -6,3 +8,5 @@ export * from './is-manifest-elementable-type.function';
 export * from './is-manifest-js-type.function';
 export * from './is-manifest-loader-type.function';
 export * from './load-extension.function';
+
+export const umbExtensionsRegistry = new UmbExtensionRegistry();
diff --git a/src/Umbraco.Web.UI.Client/libs/extensions-registry/index.ts b/src/Umbraco.Web.UI.Client/libs/extensions-registry/index.ts
index 2d31a26ce3..e9644dae47 100644
--- a/src/Umbraco.Web.UI.Client/libs/extensions-registry/index.ts
+++ b/src/Umbraco.Web.UI.Client/libs/extensions-registry/index.ts
@@ -1,4 +1 @@
-import { UmbExtensionRegistry } from '@umbraco-cms/extensions-api';
-
 export * from './models';
-export const umbExtensionsRegistry = new UmbExtensionRegistry();
diff --git a/src/Umbraco.Web.UI.Client/libs/observable-api/array-state.ts b/src/Umbraco.Web.UI.Client/libs/observable-api/array-state.ts
index e24fcb66c4..303e3b3874 100644
--- a/src/Umbraco.Web.UI.Client/libs/observable-api/array-state.ts
+++ b/src/Umbraco.Web.UI.Client/libs/observable-api/array-state.ts
@@ -1,5 +1,5 @@
 import { DeepState } from "./deep-state";
-import { appendToFrozenArray } from "./append-to-frozen-array.method";
+import { pushToUniqueArray } from "./push-to-unique-array.method";
 
 /**
  * @export
@@ -21,15 +21,15 @@ export class ArrayState<T> extends DeepState<T[]> {
 	/**
 	 * @method append
 	 * @param {unknown} unique - The unique value to remove.
-	 * @returns ArrayState<T>
+	 * @return {ArrayState<T>} Reference to it self.
 	 * @description - Remove some new data of this Subject.
 	 * @example <caption>Example remove entry with key '1'</caption>
 	 * const data = [
 	 * 	{ key: 1, value: 'foo'},
 	 * 	{ key: 2, value: 'bar'}
 	 * ];
-	 * const mySubject = new ArrayState(data, (x) => x.key);
-	 * mySubject.remove([1]);
+	 * const myState = new ArrayState(data, (x) => x.key);
+	 * myState.remove([1]);
 	 */
 	remove(uniques: unknown[]) {
 		let next = this.getValue();
@@ -51,7 +51,7 @@ export class ArrayState<T> extends DeepState<T[]> {
 	/**
 	 * @method filter
 	 * @param {unknown} filterMethod - The unique value to remove.
-	 * @returns ArrayState<T>
+	 * @return {ArrayState<T>} Reference to it self.
 	 * @description - Remove some new data of this Subject.
 	 * @example <caption>Example remove entry with key '1'</caption>
 	 * const data = [
@@ -59,8 +59,8 @@ export class ArrayState<T> extends DeepState<T[]> {
 	 * 	{ key: 2, value: 'bar'},
 	 * 	{ key: 3, value: 'poo'}
 	 * ];
-	 * const mySubject = new ArrayState(data, (x) => x.key);
-	 * mySubject.filter((entry) => entry.key !== 1);
+	 * const myState = new ArrayState(data, (x) => x.key);
+	 * myState.filter((entry) => entry.key !== 1);
 	 *
 	 * Result:
 	 *  [
@@ -75,48 +75,55 @@ export class ArrayState<T> extends DeepState<T[]> {
 	}
 
 	/**
-	 * @method append
-	 * @param {Partial<T>} partialData - A object containing some of the data for this Subject.
-	 * @returns ArrayState<T>
+	 * @method appendOne
+	 * @param {T} entry - new data to be added in this Subject.
+	 * @return {ArrayState<T>} Reference to it self.
 	 * @description - Append some new data to this Subject.
 	 * @example <caption>Example append some data.</caption>
 	 * const data = [
 	 * 	{ key: 1, value: 'foo'},
 	 * 	{ key: 2, value: 'bar'}
 	 * ];
-	 * const mySubject = new ArrayState(data);
-	 * mySubject.append({ key: 1, value: 'replaced-foo'});
+	 * const myState = new ArrayState(data);
+	 * myState.append({ key: 1, value: 'replaced-foo'});
 	 */
 	appendOne(entry: T) {
-		this.next(appendToFrozenArray(this.getValue(), entry, this._getUnique))
+		const next = [...this.getValue()];
+		if(this._getUnique) {
+			pushToUniqueArray(next, entry, this._getUnique);
+		} else {
+			next.push(entry);
+		}
+		this.next(next);
 		return this;
 	}
 
 	/**
 	 * @method append
 	 * @param {T[]} entries - A array of new data to be added in this Subject.
-	 * @returns ArrayState<T>
+	 * @return {ArrayState<T>} Reference to it self.
 	 * @description - Append some new data to this Subject, if it compares to existing data it will replace it.
 	 * @example <caption>Example append some data.</caption>
 	 * const data = [
 	 * 	{ key: 1, value: 'foo'},
 	 * 	{ key: 2, value: 'bar'}
 	 * ];
-	 * const mySubject = new ArrayState(data);
-	 * mySubject.append([
+	 * const myState = new ArrayState(data);
+	 * myState.append([
 	 * 	{ key: 1, value: 'replaced-foo'},
 	 * 	{ key: 3, value: 'another-bla'}
 	 * ]);
 	 */
 	append(entries: T[]) {
-		// TODO: stop calling appendOne for each but make sure to handle this in one.
-		entries.forEach(x => this.appendOne(x))
-
-		/*
-		const unFrozenDataSet = [...this.getValue()];
-
-		this.next(unFrozenDataSet);
-		*/
+		if(this._getUnique) {
+			const next = [...this.getValue()];
+			entries.forEach(entry => {
+				pushToUniqueArray(next, entry, this._getUnique!);
+			});
+			this.next(next);
+		} else {
+			this.next([...this.getValue(), ...entries]);
+		}
 		return this;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/libs/observable-api/object-state.ts b/src/Umbraco.Web.UI.Client/libs/observable-api/object-state.ts
index 5175616f20..e726a075bb 100644
--- a/src/Umbraco.Web.UI.Client/libs/observable-api/object-state.ts
+++ b/src/Umbraco.Web.UI.Client/libs/observable-api/object-state.ts
@@ -12,15 +12,17 @@ import { DeepState } from "./deep-state";
 export class ObjectState<T> extends DeepState<T> {
 
 	/**
-	 * @method append
-	 * @param {Partial<T>} partialData - A object containing some of the data for this Subject.
+	 * @method update
+	 * @param {Partial<T>} partialData - A object containing some of the data to update in this Subject.
 	 * @description - Append some new data to this Object.
+	 * @return {ObjectState<T>} Reference to it self.
 	 * @example <caption>Example append some data.</caption>
 	 * const data = {key: 'myKey', value: 'myInitialValue'};
-	 * const mySubject = new ObjectState(data)
-	 * mySubject.append({value: 'myNewValue'})
+	 * const myState = new ObjectState(data);
+	 * myState.update({value: 'myNewValue'});
 	 */
 	update(partialData: Partial<T>) {
 		this.next({ ...this.getValue(), ...partialData });
+		return this;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/libs/store/store-base.ts b/src/Umbraco.Web.UI.Client/libs/store/store-base.ts
index 97430508ce..0c640fe58e 100644
--- a/src/Umbraco.Web.UI.Client/libs/store/store-base.ts
+++ b/src/Umbraco.Web.UI.Client/libs/store/store-base.ts
@@ -1,11 +1,8 @@
-import { UmbContextProviderController } from "../context-api/provide/context-provider.controller";
-import { UmbControllerHostInterface } from "../controller/controller-host.mixin";
+import { UmbContextProviderController } from '@umbraco-cms/context-api';
+import { UmbControllerHostInterface } from '@umbraco-cms/controller';
 
 export class UmbStoreBase {
-
-
-	constructor (protected _host: UmbControllerHostInterface, public readonly storeAlias: string) {
+	constructor(protected _host: UmbControllerHostInterface, public readonly storeAlias: string) {
 		new UmbContextProviderController(_host, storeAlias, this);
 	}
-
 }
diff --git a/src/Umbraco.Web.UI.Client/package.json b/src/Umbraco.Web.UI.Client/package.json
index 3c8815594c..cb8786d6e5 100644
--- a/src/Umbraco.Web.UI.Client/package.json
+++ b/src/Umbraco.Web.UI.Client/package.json
@@ -34,8 +34,10 @@
 		"preview": "vite preview --open",
 		"test": "web-test-runner --coverage",
 		"test:watch": "web-test-runner --watch",
-		"test:e2e": "npx playwright test",
-		"lint": "eslint src libs e2e",
+		"auth:test:e2e": "npx playwright test --config apps/auth/",
+		"backoffice:test:e2e": "npx playwright test",
+		"test:e2e": "npm run auth:test:e2e && npm run backoffice:test:e2e",
+		"lint": "eslint src apps libs e2e",
 		"lint:fix": "npm run lint -- --fix",
 		"format": "prettier 'src/**/*.ts'",
 		"format:fix": "npm run format -- --write",
diff --git a/src/Umbraco.Web.UI.Client/public/login.jpeg b/src/Umbraco.Web.UI.Client/public/login.jpeg
deleted file mode 100644
index 412cd17865..0000000000
Binary files a/src/Umbraco.Web.UI.Client/public/login.jpeg and /dev/null differ
diff --git a/src/Umbraco.Web.UI.Client/src/app.ts b/src/Umbraco.Web.UI.Client/src/app.ts
index 386294ca18..1b27d767ff 100644
--- a/src/Umbraco.Web.UI.Client/src/app.ts
+++ b/src/Umbraco.Web.UI.Client/src/app.ts
@@ -1,5 +1,5 @@
 import '@umbraco-ui/uui-css/dist/uui-css.css';
-import './core/css/custom-properties.css';
+import '@umbraco-cms/css';
 
 // TODO: remove these imports when they are part of UUI
 import '@umbraco-ui/uui-color-swatch';
@@ -10,7 +10,6 @@ import '@umbraco-ui/uui-modal-dialog';
 import '@umbraco-ui/uui-modal-sidebar';
 import 'element-internals-polyfill';
 import 'router-slot';
-import './auth';
 
 import type { Guard, IRoute } from 'router-slot/model';
 
@@ -42,11 +41,7 @@ export class UmbApp extends UmbLitElement {
 	private umbracoUrl?: string;
 
 	@state()
-	private _routes: IRoute[] = [
-		{
-			path: 'login',
-			component: () => import('./auth/login/login.element'),
-		},
+	private _routes: IRoute<any>[] = [
 		{
 			path: 'install',
 			component: () => import('./installer/installer.element'),
diff --git a/src/Umbraco.Web.UI.Client/src/auth/auth-layout.element.ts b/src/Umbraco.Web.UI.Client/src/auth/auth-layout.element.ts
deleted file mode 100644
index 068b36878b..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/auth-layout.element.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-import { css, CSSResultGroup, html, LitElement } from 'lit';
-import { customElement } from 'lit/decorators.js';
-
-@customElement('umb-auth-layout')
-export class UmbAuthLayout extends LitElement {
-	static styles: CSSResultGroup = [
-		css`
-			#background {
-				position: fixed;
-				overflow: hidden;
-				background-position: 50%;
-				background-repeat: no-repeat;
-				background-size: cover;
-				background-image: url('login.jpeg');
-				width: 100vw;
-				height: 100vh;
-			}
-
-			#logo {
-				position: fixed;
-				top: var(--uui-size-space-5);
-				left: var(--uui-size-space-5);
-				height: 30px;
-			}
-
-			#logo img {
-				height: 100%;
-			}
-
-			#container {
-				position: relative;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				width: 100vw;
-				height: 100vh;
-			}
-
-			#box {
-				width: 500px;
-				padding: var(--uui-size-space-6) var(--uui-size-space-5) var(--uui-size-space-5) var(--uui-size-space-5);
-			}
-
-			#email,
-			#password {
-				width: 100%;
-			}
-		`,
-	];
-
-	render() {
-		return html`
-			<div id="background"></div>
-
-			<div id="logo">
-				<img src="/umbraco_logo_white.svg" alt="Umbraco" />
-			</div>
-
-			<div id="container">
-				<uui-box id="box">
-					<slot></slot>
-				</uui-box>
-			</div>
-		`;
-	}
-}
-
-declare global {
-	interface HTMLElementTagNameMap {
-		'umb-auth-layout': UmbAuthLayout;
-	}
-}
diff --git a/src/Umbraco.Web.UI.Client/src/auth/auth.ts b/src/Umbraco.Web.UI.Client/src/auth/auth.ts
deleted file mode 100644
index f1965e558e..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/auth.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export default function() {
-	sessionStorage.setItem('is-authenticated', 'true');
-	history.replaceState(null, '', 'section');
-}
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
deleted file mode 100644
index 0f0eed532c..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.element.ts
+++ /dev/null
@@ -1,99 +0,0 @@
-import { UUITextStyles } from '@umbraco-ui/uui-css';
-import { css, html, nothing } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
-import { UmbInputListBase } from '../../../backoffice/shared/components/input-list-base/input-list-base';
-import {
-	UmbUserGroupStore,
-	UMB_USER_GROUP_STORE_CONTEXT_TOKEN,
-} from '../../../backoffice/users/user-groups/user-group.store';
-import type { UserGroupEntity } from '@umbraco-cms/models';
-
-@customElement('umb-input-user-group')
-export class UmbInputPickerUserGroupElement extends UmbInputListBase {
-	static styles = [
-		UUITextStyles,
-		css`
-			:host {
-				display: flex;
-				flex-direction: column;
-				gap: var(--uui-size-space-4);
-			}
-			#user-group-list {
-				display: flex;
-				flex-direction: column;
-				gap: var(--uui-size-space-4);
-			}
-			.user-group {
-				display: flex;
-				align-items: center;
-				gap: var(--uui-size-space-2);
-			}
-			.user-group div {
-				display: flex;
-				align-items: center;
-				gap: var(--uui-size-4);
-			}
-			.user-group uui-button {
-				margin-left: auto;
-			}
-		`,
-	];
-
-	@state()
-	private _userGroups: Array<UserGroupEntity> = [];
-
-	private _userGroupStore?: UmbUserGroupStore;
-
-	connectedCallback(): void {
-		super.connectedCallback();
-		this.pickerLayout = 'umb-picker-layout-user-group';
-		this.consumeContext(UMB_USER_GROUP_STORE_CONTEXT_TOKEN, (usersContext) => {
-			this._userGroupStore = usersContext;
-			this._observeUserGroups();
-		});
-	}
-
-	private _observeUserGroups() {
-		if (this.value.length > 0 && this._userGroupStore) {
-			this.observe(this._userGroupStore.getByKeys(this.value), (userGroups) => (this._userGroups = userGroups));
-		} else {
-			this._userGroups = [];
-		}
-	}
-
-	selectionUpdated() {
-		this._observeUserGroups();
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
-	}
-
-	private _renderUserGroupList() {
-		if (this._userGroups.length === 0) return nothing;
-
-		return html`<div id="user-list">
-			${this._userGroups.map(
-				(userGroup) => html`
-					<div class="user-group">
-						<div>
-							<uui-icon .name=${userGroup.icon}></uui-icon>
-							<span>${userGroup.name}</span>
-						</div>
-						<uui-button
-							@click=${() => this.removeFromSelection(userGroup.key)}
-							label="remove"
-							color="danger"></uui-button>
-					</div>
-				`
-			)}
-		</div> `;
-	}
-
-	renderContent() {
-		return html`${this._renderUserGroupList()}`;
-	}
-}
-
-declare global {
-	interface HTMLElementTagNameMap {
-		'umb-input-user-group': UmbInputPickerUserGroupElement;
-	}
-}
diff --git a/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.test.ts b/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.test.ts
deleted file mode 100644
index 20550a4780..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user-group/input-user-group.test.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { expect, fixture, html } from '@open-wc/testing';
-//TODO: Test has been commented out while we figure out how to setup import maps for the test environment
-// import { UmbPickerUserGroupElement } from './picker-user-group.element';
-// import { defaultA11yConfig } from '@umbraco-cms/test-utils';
-
-// describe('UmbPickerLayoutUserGroupElement', () => {
-// 	let element: UmbPickerUserGroupElement;
-// 	beforeEach(async () => {
-// 		element = await fixture(html`<umb-input-user-group></umb-input-user-group>`);
-// 	});
-
-// 	it('is defined with its own instance', () => {
-// 		expect(element).to.be.instanceOf(UmbPickerUserGroupElement);
-// 	});
-
-// 	it('passes the a11y audit', async () => {
-// 		await expect(element).shadowDom.to.be.accessible(defaultA11yConfig);
-// 	});
-// });
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
deleted file mode 100644
index d1cde6e11c..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.element.ts
+++ /dev/null
@@ -1,94 +0,0 @@
-import { UUITextStyles } from '@umbraco-ui/uui-css';
-import { css, html, nothing, PropertyValueMap } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
-import { UmbInputListBase } from '../../../backoffice/shared/components/input-list-base/input-list-base';
-import { UmbUserStore, UMB_USER_STORE_CONTEXT_TOKEN } from '../../../backoffice/users/users/user.store';
-import type { UserEntity } from '@umbraco-cms/models';
-
-@customElement('umb-input-user')
-export class UmbPickerUserElement extends UmbInputListBase {
-	static styles = [
-		UUITextStyles,
-		css`
-			:host {
-				display: flex;
-				flex-direction: column;
-				gap: var(--uui-size-space-4);
-			}
-			#user-list {
-				display: flex;
-				flex-direction: column;
-				gap: var(--uui-size-space-4);
-			}
-			.user {
-				display: flex;
-				align-items: center;
-				gap: var(--uui-size-space-2);
-			}
-			.user uui-button {
-				margin-left: auto;
-			}
-		`,
-	];
-
-	@state()
-	private _users: Array<UserEntity> = [];
-
-	private _userStore?: UmbUserStore;
-
-	connectedCallback(): void {
-		super.connectedCallback();
-		this.pickerLayout = 'umb-picker-layout-user';
-		this.consumeContext(UMB_USER_STORE_CONTEXT_TOKEN, (userStore) => {
-			this._userStore = userStore;
-			this._observeUser();
-		});
-	}
-
-	protected updated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void {
-		super.updated(_changedProperties);
-		if (_changedProperties.has('value')) {
-			this._observeUser(); // TODO: This works, but it makes the value change twice.
-		}
-	}
-
-	private _observeUser() {
-		if (!this._userStore) return;
-
-		// TODO: Fix type mismatch:
-		this.observe<Array<UserEntity>>(this._userStore.getByKeys(this.value), (users) => {
-			this._users = users;
-		});
-	}
-
-	selectionUpdated() {
-		this._observeUser();
-		this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
-	}
-
-	private _renderUserList() {
-		if (this._users.length === 0) return nothing;
-
-		return html`<div id="user-list">
-			${this._users.map(
-				(user) => html`
-					<div class="user">
-						<uui-avatar .name=${user.name}></uui-avatar>
-						<div>${user.name}</div>
-						<uui-button @click=${() => this.removeFromSelection(user.key)} label="remove" color="danger"></uui-button>
-					</div>
-				`
-			)}
-		</div> `;
-	}
-
-	renderContent() {
-		return html`${this._renderUserList()}`;
-	}
-}
-
-declare global {
-	interface HTMLElementTagNameMap {
-		'umb-input-user': UmbPickerUserElement;
-	}
-}
diff --git a/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.test.ts b/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.test.ts
deleted file mode 100644
index 483a865475..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/components/input-user/input-user.test.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { expect, fixture, html } from '@open-wc/testing';
-//TODO: Test has been commented out while we figure out how to setup import maps for the test environment
-// import { UmbPickerUserElement } from './picker-user.element';
-// import { defaultA11yConfig } from '@umbraco-cms/test-utils';
-
-// describe('UmbPickerUserElement', () => {
-// 	let element: UmbPickerUserElement;
-// 	beforeEach(async () => {
-// 		element = await fixture(html`<umb-input-user></umb-input-user>`);
-// 	});
-
-// 	it('is defined with its own instance', () => {
-// 		expect(element).to.be.instanceOf(UmbPickerUserElement);
-// 	});
-
-// 	it('passes the a11y audit', async () => {
-// 		await expect(element).shadowDom.to.be.accessible(defaultA11yConfig);
-// 	});
-// });
diff --git a/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/external-login-provider-test.element.ts b/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/external-login-provider-test.element.ts
deleted file mode 100644
index e9a3ccb26c..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/external-login-provider-test.element.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import { css, html } from 'lit';
-import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
-import { customElement } from 'lit/decorators.js';
-import { UmbLitElement } from '@umbraco-cms/element';
-
-@customElement('umb-external-login-provider-test')
-export class UmbExternalLoginProviderTestElement extends UmbLitElement {
-	static styles = [
-		UUITextStyles,
-		css`
-			:host {
-				display: flex;
-				flex-direction: column;
-				gap: var(--uui-size-space-4);
-				padding: var(--uui-size-space-5);
-				border: 1px solid var(--uui-color-border);
-				background: var(--uui-color-surface-alt);
-				border-radius: var(--uui-border-radius);
-			}
-			p {
-				margin: 0;
-			}
-		`,
-	];
-
-	render() {
-		return html`
-			<b>Custom External Login Provider</b>
-			<p>This is an example of a custom external login provider using the external login provider extension point</p>
-			<uui-button label="My custom login provider" look="primary"></uui-button>
-		`;
-	}
-}
-
-export default UmbExternalLoginProviderTestElement;
-
-declare global {
-	interface HTMLElementTagNameMap {
-		'umb-external-login-provider-test': UmbExternalLoginProviderTestElement;
-	}
-}
diff --git a/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/external-login-provider-test2.element.ts b/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/external-login-provider-test2.element.ts
deleted file mode 100644
index a9ed172f2b..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/external-login-provider-test2.element.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import { css, html } from 'lit';
-import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
-import { customElement } from 'lit/decorators.js';
-import { UmbLitElement } from '@umbraco-cms/element';
-
-@customElement('umb-external-login-provider-test2')
-export class UmbExternalLoginProviderTest2Element extends UmbLitElement {
-	static styles = [
-		UUITextStyles,
-		css`
-			:host {
-				display: flex;
-				flex-direction: column;
-				gap: var(--uui-size-space-4);
-				padding: var(--uui-size-space-5);
-				border: 1px solid var(--uui-color-border);
-				background: var(--uui-color-surface-alt);
-				border-radius: var(--uui-border-radius);
-			}
-			p {
-				margin: 0;
-			}
-			uui-input {
-				width: 100%;
-			}
-		`,
-	];
-
-	render() {
-		return html`
-			<b>Another Custom External Login Provider</b>
-			<p>This is an example of another custom external login provider</p>
-			<uui-form-layout-item>
-				<uui-label id="emailLabel" for="email" slot="label" required>Email</uui-label>
-				<uui-input
-					type="email"
-					id="email"
-					name="email"
-					placeholder="Enter your email..."
-					required
-					required-message="Email is required"></uui-input>
-			</uui-form-layout-item>
-			<uui-button label="Custom login" look="primary"></uui-button>
-		`;
-	}
-}
-
-export default UmbExternalLoginProviderTest2Element;
-
-declare global {
-	interface HTMLElementTagNameMap {
-		'umb-external-login-provider-test2': UmbExternalLoginProviderTest2Element;
-	}
-}
diff --git a/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/manifests.ts b/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/manifests.ts
deleted file mode 100644
index 2e780045be..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/external-login-providers/manifests.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-// TODO: could these be renamed as login providers?
-import type { ManifestExternalLoginProvider } from '@umbraco-cms/models';
-
-export const manifests: Array<ManifestExternalLoginProvider> = [
-	{
-		type: 'externalLoginProvider',
-		alias: 'Umb.ExternalLoginProvider.Test',
-		name: 'Test External Login Provider',
-		elementName: 'umb-external-login-provider-test',
-		loader: () => import('./external-login-provider-test.element'),
-		weight: 2,
-		meta: {
-			label: 'Test External Login Provider',
-			pathname: 'test/test/test',
-		},
-	},
-	{
-		type: 'externalLoginProvider',
-		alias: 'Umb.ExternalLoginProvider.Test2',
-		name: 'Test External Login Provider 2',
-		elementName: 'umb-external-login-provider-test2',
-		loader: () => import('./external-login-provider-test2.element'),
-		weight: 1,
-		meta: {
-			label: 'Test External Login Provider 2',
-			pathname: 'test/test/test',
-		},
-	},
-];
diff --git a/src/Umbraco.Web.UI.Client/src/auth/index.ts b/src/Umbraco.Web.UI.Client/src/auth/index.ts
deleted file mode 100644
index 05973f455a..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/index.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { manifests as externalLoginProviders } from './external-login-providers/manifests';
-
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
-
-const registerExtensions = (manifests: Array<ManifestTypes>) => {
-	manifests.forEach((manifest) => {
-		if (umbExtensionsRegistry.isRegistered(manifest.alias)) return;
-		umbExtensionsRegistry.register(manifest);
-	});
-};
-
-registerExtensions([
-	...externalLoginProviders,
-]);
diff --git a/src/Umbraco.Web.UI.Client/src/auth/login/login.element.ts b/src/Umbraco.Web.UI.Client/src/auth/login/login.element.ts
deleted file mode 100644
index c2549c83c3..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/login/login.element.ts
+++ /dev/null
@@ -1,124 +0,0 @@
-import '../auth-layout.element';
-
-import { UUITextStyles } from '@umbraco-ui/uui-css';
-import { css, CSSResultGroup, html, LitElement } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { query } from 'router-slot';
-
-@customElement('umb-login')
-export default class UmbLogin extends LitElement {
-	static styles: CSSResultGroup = [
-		UUITextStyles,
-		css`
-			#email,
-			#password {
-				width: 100%;
-			}
-		`,
-	];
-
-	@state()
-	private _loggingIn = false;
-
-	private _handleSubmit = (e: SubmitEvent) => {
-		e.preventDefault();
-
-		const form = e.target as HTMLFormElement;
-		if (!form) return;
-
-		const isValid = form.checkValidity();
-		if (!isValid) return;
-
-		const formData = new FormData(form);
-
-		const username = formData.get('email') as string;
-		const password = formData.get('password') as string;
-		const persist = formData.has('persist');
-
-		this._login(username, password, persist);
-	};
-
-	private async _login(username: string, password: string, persist: boolean) {
-		// TODO: Move login to new login app
-		this._loggingIn = true;
-
-		try {
-			this._loggingIn = false;
-			let { redirectTo } = query();
-			if (!redirectTo) {
-				redirectTo = 'section';
-			}
-			sessionStorage.setItem('is-authenticated', 'true');
-			history.pushState(null, '', redirectTo);
-		} catch (error) {
-			console.log(error);
-			this._loggingIn = false;
-		}
-	}
-
-	private _greetings: Array<string> = [
-		'Happy super Sunday',
-		'Happy marvelous Monday',
-		'Happy tubular Tuesday',
-		'Happy wonderful Wednesday',
-		'Happy thunderous Thursday',
-		'Happy funky Friday',
-		'Happy Saturday',
-	];
-
-	@state()
-	private _greeting: string = this._greetings[new Date().getDay()];
-
-	render() {
-		return html`
-			<umb-auth-layout>
-				<div class="uui-text">
-					<h1 class="uui-h3">${this._greeting}</h1>
-					<uui-form>
-						<form id="LoginForm" name="login" @submit="${this._handleSubmit}">
-							<uui-form-layout-item>
-								<uui-label id="emailLabel" for="email" slot="label" required>Email</uui-label>
-								<uui-input
-									type="email"
-									id="email"
-									name="email"
-									placeholder="Enter your email..."
-									required
-									required-message="Email is required"></uui-input>
-							</uui-form-layout-item>
-
-							<uui-form-layout-item>
-								<uui-label id="passwordLabel" for="password" slot="label" required>Password</uui-label>
-								<uui-input-password
-									id="password"
-									name="password"
-									placeholder="Enter your password..."
-									required
-									required-message="Password is required"></uui-input-password>
-							</uui-form-layout-item>
-
-							<uui-form-layout-item>
-								<uui-checkbox name="persist" label="Remember me"> Remember me </uui-checkbox>
-							</uui-form-layout-item>
-
-							<uui-button
-								type="submit"
-								label="Login"
-								look="primary"
-								color="positive"
-								state=${ifDefined(this._loggingIn ? 'waiting' : undefined)}></uui-button>
-							<uui-button type="button" label="Forgot Password?"></uui-button>
-						</form>
-					</uui-form>
-				</div>
-			</umb-auth-layout>
-		`;
-	}
-}
-
-declare global {
-	interface HTMLElementTagNameMap {
-		'umb-login': UmbLogin;
-	}
-}
diff --git a/src/Umbraco.Web.UI.Client/src/auth/login/login.test.ts b/src/Umbraco.Web.UI.Client/src/auth/login/login.test.ts
deleted file mode 100644
index d937ffba1e..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/login/login.test.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { expect, fixture, html } from '@open-wc/testing';
-import UmbLogin from './login.element';
-import { defaultA11yConfig } from '@umbraco-cms/test-utils';
-
-describe('UmbLogin', () => {
-	let element: UmbLogin;
-
-	beforeEach(async () => {
-		element = await fixture(html`<umb-login></umb-login>`);
-	});
-
-	it('is defined with its own instance', () => {
-		expect(element).to.be.instanceOf(UmbLogin);
-	});
-
-	it('passes the a11y audit', async () => {
-		await expect(element).to.be.accessible(defaultA11yConfig);
-	});
-});
diff --git a/src/Umbraco.Web.UI.Client/src/auth/utils.test.ts b/src/Umbraco.Web.UI.Client/src/auth/utils.test.ts
deleted file mode 100644
index 8639f81945..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/utils.test.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { expect } from '@open-wc/testing';
-import type { UserStatus } from '@umbraco-cms/models';
-import { InterfaceColor, InterfaceLook } from '@umbraco-ui/uui-base/lib/types';
-
-import { getTagLookAndColor } from './utils';
-
-describe('UmbUserExtensions', () => {
-	it('returns correct look and color from a status string', () => {
-		const testCases: { status: UserStatus; look: InterfaceLook; color: InterfaceColor }[] = [
-			{ status: 'enabled', look: 'primary', color: 'positive' },
-			{ status: 'inactive', look: 'primary', color: 'warning' },
-			{ status: 'invited', look: 'primary', color: 'warning' },
-			{ status: 'disabled', look: 'primary', color: 'danger' },
-		];
-
-		testCases.forEach((testCase) => {
-			const { look, color } = getTagLookAndColor(testCase.status);
-			expect(look).to.equal(testCase.look);
-			expect(color).to.equal(testCase.color);
-		});
-	});
-});
diff --git a/src/Umbraco.Web.UI.Client/src/auth/utils.ts b/src/Umbraco.Web.UI.Client/src/auth/utils.ts
deleted file mode 100644
index c798404481..0000000000
--- a/src/Umbraco.Web.UI.Client/src/auth/utils.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import type { UserStatus } from '@umbraco-cms/models';
-import { InterfaceColor, InterfaceLook } from '@umbraco-ui/uui-base/lib/types';
-
-export const getTagLookAndColor = (status: UserStatus): { look: InterfaceLook; color: InterfaceColor } => {
-	switch ((status || '').toLowerCase()) {
-		case 'invited':
-		case 'inactive':
-			return { look: 'primary', color: 'warning' };
-		case 'enabled':
-			return { look: 'primary', color: 'positive' };
-		case 'disabled':
-			return { look: 'primary', color: 'danger' };
-		default:
-			return { look: 'secondary', color: 'default' };
-	}
-};
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 b76b29f580..3f89ad1f4b 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
@@ -46,9 +46,9 @@ export class UmbWorkspaceDocumentContext extends UmbWorkspaceContentContext<Docu
 		// TODO: make sure to check that we have a details model? otherwise fail? 8This can be relevant if we use the same context for tree actions?
 		const entry = {alias: alias, value: value};
 
-		const newDataSet = appendToFrozenArray((this._data.getValue() as DocumentDetails).data, entry, (x: any) => x.alias);
+		const newDataSet = appendToFrozenArray(this._data.getValue().data, entry, x => x.alias);
 
-		this.update({data: newDataSet});
+		this._data.update({data: newDataSet});
 	}
 
 	/*
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts
index 7ae0c80300..4c63eb521f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts
@@ -1,11 +1,11 @@
-
 import { manifests as dashboardManifests } from './dashboards/manifests';
 import { manifests as contentSectionManifests } from './section.manifests';
 import { manifests as documentBlueprintManifests } from './document-blueprints/manifests';
 import { manifests as documentTypeManifests } from './document-types/manifests';
 import { manifests as documentManifests } from './documents/manifests';
 
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts
index ee31b89a7e..2ee56ad17b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts
@@ -2,7 +2,8 @@ import { manifests as mediaSectionManifests } from './section.manifests';
 import { manifests as mediaManifests } from './media/manifests';
 import { manifests as mediaTypesManifests } from './media-types/manifests';
 
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts
index 2117c43085..4ffc37485b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts
@@ -2,7 +2,9 @@ import { manifests as memberSectionManifests } from './section.manifests';
 import { manifests as memberGroupManifests } from './member-groups/manifests';
 import { manifests as memberTypeManifests } from './member-types/manifests';
 import { manifests as memberManifests } from './members/manifests';
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts
index 2dbd35d36e..7a1e274f75 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts
@@ -2,7 +2,8 @@ import { manifests as packageBuilderManifests } from './package-builder/manifest
 import { manifests as packageRepoManifests } from './package-repo/manifests';
 import { manifests as packageSectionManifests } from './package-section/manifests';
 
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/created/created-packages-section-view.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/created/created-packages-section-view.element.ts
index 77cb8cb4d3..04925967b7 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/created/created-packages-section-view.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/created/created-packages-section-view.element.ts
@@ -3,7 +3,7 @@ import { customElement, state } from 'lit/decorators.js';
 import { IRoute, IRoutingInfo } from 'router-slot';
 import type { ManifestWorkspace } from '@umbraco-cms/models';
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-created-packages-section-view')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/installed-packages-section-view.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/installed-packages-section-view.element.ts
index e0f485e060..d5e7bfd180 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/installed-packages-section-view.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/installed-packages-section-view.element.ts
@@ -3,7 +3,7 @@ import { customElement, state } from 'lit/decorators.js';
 import { IRoute, IRoutingInfo } from 'router-slot';
 import type { ManifestWorkspace } from '@umbraco-cms/models';
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-installed-packages-section-view')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/packages-installed-item.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/packages-installed-item.element.ts
index 445c521893..0e80b2b45f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/packages-installed-item.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/packages/package-section/views/installed/packages-installed-item.element.ts
@@ -5,7 +5,7 @@ import { firstValueFrom, map } from 'rxjs';
 import { UmbModalService, UMB_MODAL_SERVICE_CONTEXT_TOKEN } from '../../../../../core/modal';
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
 
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import type { ManifestPackageView } from '@umbraco-cms/models';
 import { UmbLitElement } from '@umbraco-cms/element';
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts
index ee0be23f76..01360ce456 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts
@@ -1,6 +1,7 @@
 import { manifests as searchManifests } from '../search/manifests';
 
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts
index 3ad679fa59..15555d9fee 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts
@@ -5,7 +5,7 @@ import { UmbModalService, UMB_MODAL_SERVICE_CONTEXT_TOKEN } from '../../../../..
 import { UmbWorkspaceDataTypeContext } from '../../data-type-workspace.context';
 import { UmbLitElement } from '@umbraco-cms/element';
 import type { DataTypeDetails } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
 import '../../../../../shared/property-editors/shared/property-editor-config/property-editor-config.element';
 import '../../../../../shared/components/ref-property-editor-ui/ref-property-editor-ui.element';
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts
index 557c5f01e3..4fa338ebae 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/extensions/workspace/extension-root-workspace.element.ts
@@ -1,7 +1,7 @@
 import { html } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
 import { isManifestElementNameType } from '@umbraco-cms/extensions-api';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import type { ManifestBase } from '@umbraco-cms/models';
 import { UmbLitElement } from '@umbraco-cms/element';
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts
index 7c60e09fb9..de60d18c58 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts
@@ -5,7 +5,8 @@ import { manifests as extensionManifests } from './extensions/manifests';
 import { manifests as languageManifests } from './languages/manifests';
 import { manifests as logviewerManifests } from './logviewer/manifests';
 
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
@@ -20,5 +21,5 @@ registerExtensions([
 	...dataTypeManifests,
 	...extensionManifests,
 	...languageManifests,
-	...logviewerManifests
+	...logviewerManifests,
 ]);
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection-toolbar.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection-toolbar.element.ts
index fedfed7109..a3e6fcaa28 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection-toolbar.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection-toolbar.element.ts
@@ -5,7 +5,7 @@ import { map } from 'rxjs';
 import { TooltipMenuItem } from '../components/tooltip-menu';
 import '../components/tooltip-menu/tooltip-menu.element';
 import type { ManifestCollectionView } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-collection-toolbar')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection.element.ts
index 2a75c95f73..54d24df995 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/collection/collection.element.ts
@@ -7,7 +7,7 @@ import './collection-toolbar.element';
 import { UmbCollectionContext, UMB_COLLECTION_CONTEXT_TOKEN } from './collection.context';
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
 import type { ManifestCollectionView, MediaDetails } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 import type { UmbObserverController } from '@umbraco-cms/observable-api';
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/backoffice-frame/backoffice.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/backoffice-frame/backoffice.context.ts
index 818ab52d68..f6a6ce4c24 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/backoffice-frame/backoffice.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/backoffice-frame/backoffice.context.ts
@@ -1,10 +1,8 @@
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbContextToken } from '@umbraco-cms/context-api';
 import { StringState } from '@umbraco-cms/observable-api';
 
 export class UmbBackofficeContext {
-
-
 	#activeSectionAlias = new StringState(undefined);
 	public readonly activeSectionAlias = this.#activeSectionAlias.asObservable();
 
@@ -17,12 +15,9 @@ export class UmbBackofficeContext {
 		return umbExtensionsRegistry.extensionsOfType('section');
 	}
 
-
 	public setActiveSectionAlias(alias: string) {
 		this.#activeSectionAlias.next(alias);
 	}
-
 }
 
-
 export const UMB_BACKOFFICE_CONTEXT_TOKEN = new UmbContextToken<UmbBackofficeContext>('UmbBackofficeContext');
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.element.ts
index 04f4385abc..1f343618c7 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.element.ts
@@ -3,7 +3,7 @@ import type { TemplateResult } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { map } from 'rxjs';
 import { repeat } from 'lit/directives/repeat.js';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { createExtensionElement, isManifestElementableType } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.test.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.test.ts
index d29223e7e2..6fac7fe693 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.test.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/extension-slot/extension-slot.test.ts
@@ -1,29 +1,23 @@
-import { expect, fixture, html } from '@open-wc/testing';
-import { ManifestDashboard, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
-import { defaultA11yConfig } from '@umbraco-cms/test-utils';
 import { customElement } from 'lit/decorators.js';
+import { expect, fixture, html } from '@open-wc/testing';
 import { InitializedExtension, UmbExtensionSlotElement } from './extension-slot.element';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestDashboard } from '@umbraco-cms/extensions-registry';
+import { defaultA11yConfig } from '@umbraco-cms/test-utils';
 
 @customElement('test-extension-slot-manifest-element')
-class MyExtensionSlotManifestElement extends HTMLElement {
-
-}
+class MyExtensionSlotManifestElement extends HTMLElement {}
 
 function sleep(ms: number) {
-  return new Promise(resolve => setTimeout(resolve, ms));
+	return new Promise((resolve) => setTimeout(resolve, ms));
 }
 
 describe('UmbExtensionSlotElement', () => {
-
-
-  let element: UmbExtensionSlotElement;
+	let element: UmbExtensionSlotElement;
 
 	describe('general', () => {
-
 		beforeEach(async () => {
-			element = await fixture(
-				html`<umb-extension-slot></umb-extension-slot>`
-			);
+			element = await fixture(html`<umb-extension-slot></umb-extension-slot>`);
 		});
 
 		it('is defined with its own instance', () => {
@@ -49,12 +43,8 @@ describe('UmbExtensionSlotElement', () => {
 		});
 	});
 
-
-
 	describe('rendering', () => {
-
 		beforeEach(async () => {
-
 			umbExtensionsRegistry.register({
 				type: 'dashboard',
 				alias: 'unit-test-ext-slot-element-manifest',
@@ -62,10 +52,9 @@ describe('UmbExtensionSlotElement', () => {
 				elementName: 'test-extension-slot-manifest-element',
 				meta: {
 					sections: ['test'],
-					pathname: 'test/test'
-				}
+					pathname: 'test/test',
+				},
 			});
-
 		});
 
 		afterEach(async () => {
@@ -73,32 +62,30 @@ describe('UmbExtensionSlotElement', () => {
 		});
 
 		it('renders a manifest element', async () => {
-
 			element = await fixture(
-				html`<umb-extension-slot type='dashboard' .filter=${(x: ManifestDashboard) => x.alias === 'unit-test-ext-slot-element-manifest'}></umb-extension-slot>`
+				html`<umb-extension-slot
+					type="dashboard"
+					.filter=${(x: ManifestDashboard) => x.alias === 'unit-test-ext-slot-element-manifest'}></umb-extension-slot>`
 			);
 
-      await sleep(0);
+			await sleep(0);
 
 			expect(element.shadowRoot!.firstElementChild).to.be.instanceOf(MyExtensionSlotManifestElement);
 		});
 
 		it('use the render method', async () => {
-
 			element = await fixture(
-				html`
-					<umb-extension-slot
-						type='dashboard'
-						.filter=${(x: ManifestDashboard) => x.alias === 'unit-test-ext-slot-element-manifest'}
-						.renderMethod=${(manifest: InitializedExtension) => html`<bla>${manifest.component}</bla>`}>
-						</umb-extension-slot>`
+				html` <umb-extension-slot
+					type="dashboard"
+					.filter=${(x: ManifestDashboard) => x.alias === 'unit-test-ext-slot-element-manifest'}
+					.renderMethod=${(manifest: InitializedExtension) => html`<bla>${manifest.component}</bla>`}>
+				</umb-extension-slot>`
 			);
 
-      await sleep(0);
+			await sleep(0);
 
 			expect(element.shadowRoot!.firstElementChild?.nodeName).to.be.equal('BLA');
 			expect(element.shadowRoot!.firstElementChild?.firstElementChild).to.be.instanceOf(MyExtensionSlotManifestElement);
 		});
 	});
-
 });
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..70192a1689 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
@@ -3,7 +3,7 @@ import { css, html, nothing } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
 import { UmbInputListBase } from '../input-list-base/input-list-base';
 import type { ManifestSection } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
 @customElement('umb-input-section')
 export class UmbInputPickerSectionElement extends UmbInputListBase {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-dashboards/section-dashboards.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-dashboards/section-dashboards.element.ts
index 013f082bd8..7660f44778 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-dashboards/section-dashboards.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-dashboards/section-dashboards.element.ts
@@ -5,12 +5,8 @@ import { IRoutingInfo } from 'router-slot';
 import { first, map } from 'rxjs';
 import { UmbSectionContext, UMB_SECTION_CONTEXT_TOKEN } from '../section.context';
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
-import type {
-	ManifestDashboard,
-	ManifestDashboardCollection,
-	ManifestWithMeta,
-} from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import type { ManifestDashboard, ManifestDashboardCollection, ManifestWithMeta } from '@umbraco-cms/models';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-section-dashboards')
@@ -22,7 +18,6 @@ export class UmbSectionDashboardsElement extends UmbLitElement {
 				display: flex;
 				flex-direction: column;
 				height: 100%;
-				width: 100%;
 			}
 
 			#tabs {
@@ -32,15 +27,12 @@ export class UmbSectionDashboardsElement extends UmbLitElement {
 
 			#scroll-container {
 				flex: 1;
-				height: 100%;
-				padding: var(--uui-size-space-6) var(--uui-size-space-5);
 			}
 
 			#router-slot {
-				width: 100%;
 				box-sizing: border-box;
 				display: block;
-				padding:var(--uui-size-5);
+				padding: var(--uui-size-5);
 			}
 		`,
 	];
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-views/section-views.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-views/section-views.element.ts
index cca976d6a2..fe8129400f 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-views/section-views.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-views/section-views.element.ts
@@ -4,7 +4,7 @@ import { customElement, state } from 'lit/decorators.js';
 import { map, of } from 'rxjs';
 import { UmbSectionContext, UMB_SECTION_CONTEXT_TOKEN } from '../section.context';
 import type { ManifestSectionView } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 import { UmbObserverController } from '@umbraco-cms/observable-api';
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section.element.ts
index 4349c462a6..c60b1e147d 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section.element.ts
@@ -7,7 +7,7 @@ import type { UmbWorkspaceEntityElement } from '../workspace/workspace-entity-el
 import { UmbSectionContext, UMB_SECTION_CONTEXT_TOKEN } from './section.context';
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
 import type { ManifestSectionView, ManifestWorkspace, ManifestSidebarMenuItem } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 import './section-sidebar-menu/section-sidebar-menu.element.ts';
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/context-menu/tree-context-menu-page-action-list.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/context-menu/tree-context-menu-page-action-list.element.ts
index 8fa31cac09..b3c6a9ba7c 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/context-menu/tree-context-menu-page-action-list.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/context-menu/tree-context-menu-page-action-list.element.ts
@@ -3,8 +3,8 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, state } from 'lit/decorators.js';
 import { map } from 'rxjs';
 import { UmbSectionContext, UMB_SECTION_CONTEXT_TOKEN } from '../../section/section.context';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import type { Entity, ManifestTreeItemAction } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 @customElement('umb-tree-context-menu-page-action-list')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree-item.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree-item.element.ts
index 3b638b09bb..6ee43fcd8d 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree-item.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree-item.element.ts
@@ -13,7 +13,7 @@ import {
 import type { Entity } from '@umbraco-cms/models';
 import type { UmbTreeStore } from '@umbraco-cms/store';
 import { UmbLitElement } from '@umbraco-cms/element';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
 @customElement('umb-tree-item')
 export class UmbTreeItem extends UmbLitElement {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts
index 4e20274084..ecb978bd32 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts
@@ -4,7 +4,7 @@ import { map } from 'rxjs';
 import { repeat } from 'lit-html/directives/repeat.js';
 import { UmbTreeContextBase } from './tree.context';
 import type { Entity, ManifestTree } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbTreeStore } from '@umbraco-cms/store';
 import { UmbLitElement } from '@umbraco-cms/element';
 
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 8a8945effb..f1059664b9 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
@@ -4,7 +4,7 @@ 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 { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import type { DataTypePropertyData, ManifestPropertyEditorUI, ManifestTypes } from '@umbraco-cms/models';
 
 import '../../property-actions/shared/property-action-menu/property-action-menu.element';
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 76852a829f..b55c24255e 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
@@ -2,7 +2,7 @@ import { v4 as uuidv4 } from 'uuid';
 import { UmbNotificationService, UMB_NOTIFICATION_SERVICE_CONTEXT_TOKEN, UmbNotificationDefaultData } from '@umbraco-cms/notification';
 import { UmbControllerHostInterface } from '@umbraco-cms/controller';
 import { UmbContextConsumerController, UmbContextProviderController } from '@umbraco-cms/context-api';
-import { DeepState, UmbObserverController, createObservablePart } from '@umbraco-cms/observable-api';
+import { ObjectState, UmbObserverController, createObservablePart } from '@umbraco-cms/observable-api';
 import { UmbContentStore } from '@umbraco-cms/store';
 import type { ContentTreeItem } from '@umbraco-cms/backend-api';
 
@@ -33,7 +33,7 @@ export abstract class UmbWorkspaceContentContext<
 	constructor(host: UmbControllerHostInterface, defaultData: ContentTypeType, storeAlias: string, entityType: string) {
 		this._host = host;
 
-		this._data = new DeepState<ContentTypeType>(defaultData);
+		this._data = new ObjectState<ContentTypeType>(defaultData);
 		this.data = this._data.asObservable();
 		this.name = createObservablePart(this._data, (data) => data.name);
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-layout/workspace-layout.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-layout/workspace-layout.element.ts
index 72917fb40d..2f2bce50dc 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-layout/workspace-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-layout/workspace-layout.element.ts
@@ -5,8 +5,12 @@ import { IRoutingInfo, RouterSlot } from 'router-slot';
 import { map } from 'rxjs';
 
 import { createExtensionElement } from '@umbraco-cms/extensions-api';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
-import type { ManifestWorkspaceAction, ManifestWorkspaceView, ManifestWorkspaceViewCollection } from '@umbraco-cms/models';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import type {
+	ManifestWorkspaceAction,
+	ManifestWorkspaceView,
+	ManifestWorkspaceViewCollection,
+} from '@umbraco-cms/models';
 
 import '../../body-layout/body-layout.element';
 import '../../extension-slot/extension-slot.element';
@@ -46,7 +50,7 @@ export class UmbWorkspaceLayout extends UmbLitElement {
 			}
 			router-slot {
 				height: 100%;
-				flex:0;
+				flex: 0;
 			}
 
 			umb-extension-slot[slot='actions'] {
@@ -93,11 +97,7 @@ export class UmbWorkspaceLayout extends UmbLitElement {
 		this.observe(
 			umbExtensionsRegistry
 				.extensionsOfTypes<ManifestWorkspaceView>(['workspaceView', 'workspaceViewCollection'])
-				.pipe(
-					map((extensions) =>
-						extensions.filter((extension) => (extension).meta.workspaces.includes(this.alias))
-					)
-				),
+				.pipe(map((extensions) => extensions.filter((extension) => extension.meta.workspaces.includes(this.alias)))),
 			(workspaceViews) => {
 				this._workspaceViews = workspaceViews;
 				this._createRoutes();
@@ -106,11 +106,9 @@ export class UmbWorkspaceLayout extends UmbLitElement {
 	}
 
 	private async _createRoutes() {
-		
 		this._routes = [];
 
 		if (this._workspaceViews.length > 0) {
-
 			this._routes = this._workspaceViews.map((view) => {
 				return {
 					path: `view/${view.meta.pathname}`,
@@ -188,7 +186,8 @@ export class UmbWorkspaceLayout extends UmbLitElement {
 				<umb-extension-slot
 					slot="actions"
 					type="workspaceAction"
-					.filter=${(extension: ManifestWorkspaceAction) => extension.meta.workspaces.includes(this.alias)}></umb-extension-slot>
+					.filter=${(extension: ManifestWorkspaceAction) =>
+						extension.meta.workspaces.includes(this.alias)}></umb-extension-slot>
 				<slot name="actions" slot="actions"></slot>
 			</umb-body-layout>
 		`;
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts
index ac5b04cbdd..a714adc802 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts
@@ -6,7 +6,8 @@ import { manifests as propertyEditorUIManifests } from './property-editors/uis/m
 import { manifests as collectionBulkActionManifests } from './collection/bulk-actions/manifests';
 import { manifests as collectionViewManifests } from './collection/views/manifests';
 
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
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 6898826005..8988fad47c 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
@@ -4,7 +4,7 @@ import { map } from 'rxjs';
 import { UUITextStyles } from '@umbraco-ui/uui';
 import { UmbPropertyActionMenuContext } from './property-action-menu.context';
 import type { ManifestPropertyAction } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
 import '../property-action/property-action.element';
 import { UmbLitElement } from '@umbraco-cms/element';
@@ -41,8 +41,6 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 		`,
 	];
 
-
-
 	// TODO: we need to investigate context api vs values props and events
 	@property()
 	public value?: string;
@@ -78,16 +76,11 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 	private _observeActions(alias: string) {
 		this._actionsObserver?.destroy();
 		this._actionsObserver = this.observe(
-			umbExtensionsRegistry
-				.extensionsOfType('propertyAction')
-				.pipe(
-					map((propertyActions) => {
-						return propertyActions.filter((propertyAction) =>
-							propertyAction.meta.propertyEditors.includes(alias)
-						)
-					}
-					)
-				),
+			umbExtensionsRegistry.extensionsOfType('propertyAction').pipe(
+				map((propertyActions) => {
+					return propertyActions.filter((propertyAction) => propertyAction.meta.propertyEditors.includes(alias));
+				})
+			),
 			(manifests) => {
 				this._actions = manifests;
 			}
@@ -104,28 +97,28 @@ export class UmbPropertyActionMenuElement extends UmbLitElement {
 	}
 
 	render() {
-		return (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>
+		return 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>
+			  `
 			: '';
 	}
 }
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 216e33b789..90894acd9d 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
@@ -3,7 +3,7 @@ import { customElement, property, state } from 'lit/decorators.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import type { PropertyEditorConfigDefaultData, PropertyEditorConfigProperty } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
 import '../../../components/workspace-property/workspace-property.element';
 import { UmbLitElement } from '@umbraco-cms/element';
@@ -58,24 +58,30 @@ export class UmbPropertyEditorConfigElement extends UmbLitElement {
 	private _observePropertyEditorUIConfig() {
 		if (!this._propertyEditorUIAlias) return;
 
-		this.observe(umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUI', this.propertyEditorUIAlias), (manifest) => {
-			this._observePropertyEditorModelConfig(manifest?.meta.propertyEditorModel);
-			this._propertyEditorUIConfigProperties = manifest?.meta.config?.properties || [];
-			this._propertyEditorUIConfigDefaultData = manifest?.meta.config?.defaultData || [];
-			this._mergeConfigProperties();
-			this._mergeConfigDefaultData();
-		});
+		this.observe(
+			umbExtensionsRegistry.getByTypeAndAlias('propertyEditorUI', this.propertyEditorUIAlias),
+			(manifest) => {
+				this._observePropertyEditorModelConfig(manifest?.meta.propertyEditorModel);
+				this._propertyEditorUIConfigProperties = manifest?.meta.config?.properties || [];
+				this._propertyEditorUIConfigDefaultData = manifest?.meta.config?.defaultData || [];
+				this._mergeConfigProperties();
+				this._mergeConfigDefaultData();
+			}
+		);
 	}
 
 	private _observePropertyEditorModelConfig(propertyEditorModelAlias?: string) {
 		if (!propertyEditorModelAlias) return;
 
-		this.observe(umbExtensionsRegistry.getByTypeAndAlias('propertyEditorModel', propertyEditorModelAlias), (manifest) => {
-			this._propertyEditorModelConfigProperties = manifest?.meta.config?.properties || [];
-			this._propertyEditorModelConfigDefaultData = manifest?.meta.config?.defaultData || [];
-			this._mergeConfigProperties();
-			this._mergeConfigDefaultData();
-		});
+		this.observe(
+			umbExtensionsRegistry.getByTypeAndAlias('propertyEditorModel', propertyEditorModelAlias),
+			(manifest) => {
+				this._propertyEditorModelConfigProperties = manifest?.meta.config?.properties || [];
+				this._propertyEditorModelConfigDefaultData = manifest?.meta.config?.defaultData || [];
+				this._mergeConfigProperties();
+				this._mergeConfigDefaultData();
+			}
+		);
 	}
 
 	private _mergeConfigProperties() {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts
index f24674cbe7..669dd79c55 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts
@@ -1,7 +1,7 @@
 import { manifests as translationSectionManifests } from './section.manifest';
 import { manifests as dictionaryManifests } from './dictionary/manifests';
 import type { ManifestTypes } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts
index b8fb838d74..e799a8eff7 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts
@@ -2,7 +2,9 @@ import { manifests as userGroupManifests } from './user-groups/manifests';
 import { manifests as userManifests } from './users/manifests';
 import { manifests as userSectionManifests } from './user-section/manifests';
 import { manifests as currentUserManifests } from './current-user/manifests';
-import { ManifestTypes, umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
+import { ManifestTypes } from '@umbraco-cms/extensions-registry';
 
 const registerExtensions = (manifests: Array<ManifestTypes>) => {
 	manifests.forEach((manifest) => {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.element.ts
index 0d3633cc10..12af723b84 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/workspace/user-group-workspace.element.ts
@@ -4,15 +4,15 @@ import { css, html, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
 import { distinctUntilChanged } from 'rxjs';
+import { UmbUserStore, UMB_USER_STORE_CONTEXT_TOKEN } from '../../../users/users/user.store';
+import { UmbWorkspaceEntityElement } from '../../../shared/components/workspace/workspace-entity-element.interface';
 import { UmbWorkspaceUserGroupContext } from './user-group-workspace.context';
 import type { ManifestWorkspaceAction, UserGroupDetails } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
-import { UmbUserStore, UMB_USER_STORE_CONTEXT_TOKEN } from 'src/backoffice/users/users/user.store';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
-import '../../../../auth/components/input-user/input-user.element';
-import '../../../../backoffice/shared/components/input-section/input-section.element';
+import '../../../shared/components/input-user/input-user.element';
+import '../../../shared/components/input-section/input-section.element';
 import { UmbLitElement } from '@umbraco-cms/element';
-import { UmbWorkspaceEntityElement } from 'src/backoffice/shared/components/workspace/workspace-entity-element.interface';
 
 @customElement('umb-user-group-workspace')
 export class UmbUserGroupWorkspaceElement extends UmbLitElement implements UmbWorkspaceEntityElement {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/section-users.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/section-users.element.ts
index d3e84c8521..a96c131930 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/section-users.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/section-users.element.ts
@@ -1,6 +1,6 @@
 import { html, LitElement } from 'lit';
 import { customElement } from 'lit/decorators.js';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import type { ManifestSectionView } from '@umbraco-cms/models';
 
 @customElement('umb-users-section')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/user-groups/user-group-table-sections-column-layout.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/user-groups/user-group-table-sections-column-layout.element.ts
index 905a72a6aa..d63199aba5 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/user-groups/user-group-table-sections-column-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/user-groups/user-group-table-sections-column-layout.element.ts
@@ -1,6 +1,6 @@
 import { html } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbTableItem } from 'src/backoffice/shared/components/table';
 import { UmbLitElement } from '@umbraco-cms/element';
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/grid/workspace-view-users-grid.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/grid/workspace-view-users-grid.element.ts
index 45f52c2d8b..a7c3b4115c 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/grid/workspace-view-users-grid.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/grid/workspace-view-users-grid.element.ts
@@ -4,8 +4,8 @@ import { customElement, state } from 'lit/decorators.js';
 import { repeat } from 'lit/directives/repeat.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import type { UmbSectionViewUsersElement } from '../../section-view-users.element';
-import { getTagLookAndColor } from '../../../../../../../auth/utils';
 import { UmbUserGroupStore, UMB_USER_GROUP_STORE_CONTEXT_TOKEN } from '../../../../../user-groups/user-group.store';
+import { getTagLookAndColor } from '@umbraco-cms/utils';
 import type { UserDetails, UserEntity, UserGroupEntity } from '@umbraco-cms/models';
 import { UmbLitElement } from '@umbraco-cms/element';
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/table/column-layouts/status/user-table-status-column-layout.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/table/column-layouts/status/user-table-status-column-layout.element.ts
index 2b8ce26d92..385f5b6de8 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/table/column-layouts/status/user-table-status-column-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/list-view-layouts/table/column-layouts/status/user-table-status-column-layout.element.ts
@@ -1,6 +1,6 @@
 import { html, LitElement, nothing } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { getTagLookAndColor } from '../../../../../../../../../auth/utils';
+import { getTagLookAndColor } from '@umbraco-cms/utils';
 
 @customElement('umb-user-table-status-column-layout')
 export class UmbUserTableStatusColumnLayoutElement extends LitElement {
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/section-view-users.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/section-view-users.element.ts
index bcd4f3f8ad..1aaff75e64 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/section-view-users.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/section-view-users.element.ts
@@ -2,7 +2,7 @@ import { css, html } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, state } from 'lit/decorators.js';
 import type { IRoute, IRoutingInfo } from 'router-slot';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 
 import './list-view-layouts/table/workspace-view-users-table.element';
 import './list-view-layouts/grid/workspace-view-users-grid.element';
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-create.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-create.element.ts
index 6d8dbc9544..f7bf81b98b 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-create.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-create.element.ts
@@ -2,15 +2,15 @@ import { css, html, nothing } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, query, state } from 'lit/decorators.js';
 import { UUIInputPasswordElement } from '@umbraco-ui/uui';
-import { UmbInputPickerUserGroupElement } from 'src/auth/components/input-user-group/input-user-group.element';
+import { UmbInputPickerUserGroupElement } from '../../../../shared/components/input-user-group/input-user-group.element';
+import { UmbModalLayoutElement } from '../../../../../core/modal';
+import { UmbUserStore, UMB_USER_STORE_CONTEXT_TOKEN } from '../../../users/user.store';
 import type { UserDetails } from '@umbraco-cms/models';
 import {
 	UmbNotificationDefaultData,
 	UmbNotificationService,
 	UMB_NOTIFICATION_SERVICE_CONTEXT_TOKEN,
 } from '@umbraco-cms/notification';
-import { UmbModalLayoutElement } from 'src/core/modal';
-import { UmbUserStore, UMB_USER_STORE_CONTEXT_TOKEN } from 'src/backoffice/users/users/user.store';
 
 export type UsersViewType = 'list' | 'grid';
 @customElement('umb-workspace-view-users-create')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-invite.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-invite.element.ts
index 4a7ac4465b..6a5e16aca7 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-invite.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/user-section/views/users/workspace-view-users-invite.element.ts
@@ -1,10 +1,10 @@
 import { css, html, nothing } from 'lit';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { customElement, query, state } from 'lit/decorators.js';
-import { UmbInputPickerUserGroupElement } from 'src/auth/components/input-user-group/input-user-group.element';
+import { UmbInputPickerUserGroupElement } from '../../../../shared/components/input-user-group/input-user-group.element';
+import { UmbModalLayoutElement } from '../../../../../core/modal';
+import { UmbUserStore, UMB_USER_STORE_CONTEXT_TOKEN } from '../../../users/user.store';
 import type { UserDetails } from '@umbraco-cms/models';
-import { UmbModalLayoutElement } from 'src/core/modal';
-import { UmbUserStore, UMB_USER_STORE_CONTEXT_TOKEN } from 'src/backoffice/users/users/user.store';
 
 export type UsersViewType = 'list' | 'grid';
 @customElement('umb-workspace-view-users-invite')
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.element.ts
index f74cfba113..cb7f0f9d33 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace.element.ts
@@ -6,15 +6,15 @@ import { ifDefined } from 'lit/directives/if-defined.js';
 import { repeat } from 'lit/directives/repeat.js';
 
 import { distinctUntilChanged } from 'rxjs';
-import { getTagLookAndColor } from '../../../../auth/utils';
 
 import { UmbCurrentUserStore, UMB_CURRENT_USER_STORE_CONTEXT_TOKEN } from '../../current-user/current-user.store';
 import type { UmbModalService } from '../../../../core/modal';
 import type { UmbWorkspaceEntityElement } from '../../../shared/components/workspace/workspace-entity-element.interface';
 import { UmbWorkspaceUserContext } from './user-workspace.context';
+import { getTagLookAndColor } from '@umbraco-cms/utils';
 import type { UserDetails } from '@umbraco-cms/models';
 
-import '../../../../auth/components/input-user-group/input-user-group.element';
+import '../../../shared/components/input-user-group/input-user-group.element';
 import '../../../shared/property-editors/uis/document-picker/property-editor-ui-document-picker.element';
 import '../../../shared/components/workspace/workspace-layout/workspace-layout.element';
 import { UmbLitElement } from '@umbraco-cms/element';
diff --git a/src/Umbraco.Web.UI.Client/src/core/css/custom-properties.css b/src/Umbraco.Web.UI.Client/src/core/css/custom-properties.css
deleted file mode 100644
index 4f728ed1fd..0000000000
--- a/src/Umbraco.Web.UI.Client/src/core/css/custom-properties.css
+++ /dev/null
@@ -1,3 +0,0 @@
-:root {
-	--uui-color-positive: #1c874c;
-}
diff --git a/src/Umbraco.Web.UI.Client/src/core/modal/layouts/picker-section/picker-layout-section.element.ts b/src/Umbraco.Web.UI.Client/src/core/modal/layouts/picker-section/picker-layout-section.element.ts
index 303bec8507..6b2db6d328 100644
--- a/src/Umbraco.Web.UI.Client/src/core/modal/layouts/picker-section/picker-layout-section.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/modal/layouts/picker-section/picker-layout-section.element.ts
@@ -2,7 +2,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css';
 import { css, html } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
 import { UmbModalLayoutPickerBase } from '../modal-layout-picker-base';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import type { ManifestSection } from '@umbraco-cms/models';
 
 @customElement('umb-picker-layout-section')
diff --git a/src/Umbraco.Web.UI.Client/src/core/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts b/src/Umbraco.Web.UI.Client/src/core/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts
index fc1a76799d..c5004b4497 100644
--- a/src/Umbraco.Web.UI.Client/src/core/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/modal/layouts/property-editor-ui-picker/modal-layout-property-editor-ui-picker.element.ts
@@ -6,7 +6,7 @@ import { groupBy } from 'lodash-es';
 import type { UUIInputEvent } from '@umbraco-ui/uui';
 import type { UmbModalHandler } from '../../modal-handler';
 import type { ManifestPropertyEditorUI } from '@umbraco-cms/models';
-import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api';
 import { UmbLitElement } from '@umbraco-cms/element';
 
 export interface UmbModalPropertyEditorUIPickerData {
diff --git a/src/Umbraco.Web.UI.Client/src/core/test-utils/chai.ts b/src/Umbraco.Web.UI.Client/src/core/test-utils/chai.ts
deleted file mode 100644
index fc83ba86e8..0000000000
--- a/src/Umbraco.Web.UI.Client/src/core/test-utils/chai.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export const defaultA11yConfig = {
-	ignoredRules: [],
-};
diff --git a/src/Umbraco.Web.UI.Client/src/core/test-utils/index.ts b/src/Umbraco.Web.UI.Client/src/core/test-utils/index.ts
deleted file mode 100644
index 0d2296cc1c..0000000000
--- a/src/Umbraco.Web.UI.Client/src/core/test-utils/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './chai';
diff --git a/src/Umbraco.Web.UI.Client/src/core/utils/baseUrl.ts b/src/Umbraco.Web.UI.Client/src/core/utils/baseUrl.ts
deleted file mode 100644
index f1c058923d..0000000000
--- a/src/Umbraco.Web.UI.Client/src/core/utils/baseUrl.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-export function baseUrl(): string {
-	if (typeof document !== 'undefined') {
-		const baseElems = document.getElementsByTagName('base');
-		if (baseElems.length && baseElems[0].hasAttribute('href')) {
-			return baseElems[0].href.slice(0, -1);
-		}
-	}
-
-	return '';
-}
diff --git a/src/Umbraco.Web.UI.Client/src/core/utils/index.ts b/src/Umbraco.Web.UI.Client/src/core/utils/index.ts
deleted file mode 100644
index 1224e0ec12..0000000000
--- a/src/Umbraco.Web.UI.Client/src/core/utils/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export * from './baseUrl';
-export * from './umbraco-path';
diff --git a/src/Umbraco.Web.UI.Client/src/core/utils/umbraco-path.ts b/src/Umbraco.Web.UI.Client/src/core/utils/umbraco-path.ts
deleted file mode 100644
index 5e0043d3b2..0000000000
--- a/src/Umbraco.Web.UI.Client/src/core/utils/umbraco-path.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import type { Path } from 'msw';
-export function umbracoPath(path: string): Path {
-	return `/umbraco/management/api/v1${path}`;
-}
diff --git a/src/Umbraco.Web.UI.Client/tsconfig.json b/src/Umbraco.Web.UI.Client/tsconfig.json
index e82a3ad7e7..3a3e9d3560 100644
--- a/src/Umbraco.Web.UI.Client/tsconfig.json
+++ b/src/Umbraco.Web.UI.Client/tsconfig.json
@@ -20,6 +20,8 @@
 		"resolveJsonModule": true,
 		"baseUrl": ".",
 		"paths": {
+			"@umbraco-cms/css": ["libs/css/custom-properties.css"],
+			"@umbraco-cms/modal": ["src/core/modal"],
 			"@umbraco-cms/models": ["libs/models"],
 			"@umbraco-cms/backend-api": ["libs/backend-api"],
 			"@umbraco-cms/context-api": ["libs/context-api"],
@@ -29,15 +31,15 @@
 			"@umbraco-cms/extensions-registry": ["libs/extensions-registry"],
 			"@umbraco-cms/notification": ["libs/notification"],
 			"@umbraco-cms/observable-api": ["libs/observable-api"],
-			"@umbraco-cms/utils": ["src/core/utils"],
-			"@umbraco-cms/test-utils": ["src/core/test-utils"],
+			"@umbraco-cms/utils": ["libs/utils"],
+			"@umbraco-cms/test-utils": ["libs/test-utils"],
 			"@umbraco-cms/resources": ["libs/resources"],
 			"@umbraco-cms/store": ["libs/store"],
 			"@umbraco-cms/components/*": ["src/backoffice/components/*"],
 			"@umbraco-cms/sections/*": ["src/backoffice/sections/*"]
 		}
 	},
-	"include": ["src/**/*.ts", "libs/**/*.ts", "e2e/**/*.ts"],
+	"include": ["src/**/*.ts", "apps/**/*.ts", "libs/**/*.ts", "e2e/**/*.ts"],
 	"references": [
 		{
 			"path": "./tsconfig.node.json"
diff --git a/src/Umbraco.Web.UI.Client/web-test-runner.config.mjs b/src/Umbraco.Web.UI.Client/web-test-runner.config.mjs
index 3c4fbd61f3..69c726e3a3 100644
--- a/src/Umbraco.Web.UI.Client/web-test-runner.config.mjs
+++ b/src/Umbraco.Web.UI.Client/web-test-runner.config.mjs
@@ -4,7 +4,7 @@ import { importMapsPlugin } from '@web/dev-server-import-maps';
 
 export default {
 	nodeResolve: true,
-	files: ['src/**/*.test.ts', 'libs/**/*.test.ts'],
+	files: ['src/**/*.test.ts', 'apps/**/*.test.ts', 'libs/**/*.test.ts'],
 	plugins: [
 		esbuildPlugin({ ts: true, target: 'auto', json: true }),
 		importMapsPlugin({
@@ -12,6 +12,7 @@ export default {
 				importMap: {
 					imports: {
 						'src/': './src/',
+						'@umbraco-cms/css': './libs/css/custom-properties.css',
 						'@umbraco-cms/models': './libs/models/index.ts',
 						'@umbraco-cms/backend-api': './libs/backend-api/index.ts',
 						'@umbraco-cms/context-api': './libs/context-api/index.ts',
@@ -22,8 +23,8 @@ export default {
 						'@umbraco-cms/notification': './libs/notification/index.ts',
 						'@umbraco-cms/observable-api': './libs/observable-api/index.ts',
 						'@umbraco-cms/store': './libs/store/index.ts',
-						'@umbraco-cms/utils': './src/core/utils/index.ts',
-						'@umbraco-cms/test-utils': './src/core/test-utils/index.ts',
+						'@umbraco-cms/utils': './libs/utils/index.ts',
+						'@umbraco-cms/test-utils': './libs/test-utils/index.ts',
 						'@umbraco-cms/resources': './libs/resources/index.ts'
 					},
 				},
@@ -47,7 +48,7 @@ export default {
 				<title>Umbraco</title>
 				<base href="/" />
 				<link rel="stylesheet" href="node_modules/@umbraco-ui/uui-css/dist/uui-css.css">
-				<link rel="stylesheet" href="src/core/css/custom-properties.css">
+				<link rel="stylesheet" href="libs/css/custom-properties.css">
 			</head>
       <body>
         <script type="module" src="${testFramework}"></script>