diff --git a/src/Umbraco.Web.UI.Client/.storybook/main.ts b/src/Umbraco.Web.UI.Client/.storybook/main.ts
index d99db4dad5..58d9e365e4 100644
--- a/src/Umbraco.Web.UI.Client/.storybook/main.ts
+++ b/src/Umbraco.Web.UI.Client/.storybook/main.ts
@@ -1,21 +1,18 @@
 import { StorybookConfig } from '@storybook/web-components-vite';
 
 const config: StorybookConfig = {
-  stories: ['../@(src|libs|apps)/**/*.stories.mdx', '../@(src|libs|apps)/**/*.stories.@(js|jsx|ts|tsx)'],
-  addons: ['@storybook/addon-links', '@storybook/addon-essentials', '@storybook/addon-a11y'],
-  framework: { 
-    name: '@storybook/web-components-vite',
-    options: {}
-   },
-   features: {
-    storyStoreV7: true
-  },
-  staticDirs: ['../public-assets'],
-  typescript: {
-    check: true,
-  },
-  docs: {
-    autodocs: true
-  }
+	stories: ['../@(src|libs|apps)/**/*.mdx', '../@(src|libs|apps)/**/*.stories.@(js|jsx|ts|tsx)'],
+	addons: ['@storybook/addon-links', '@storybook/addon-essentials', '@storybook/addon-a11y'],
+	framework: {
+		name: '@storybook/web-components-vite',
+		options: {},
+	},
+	staticDirs: ['../public-assets'],
+	typescript: {
+		check: true,
+	},
+	docs: {
+		autodocs: true,
+	},
 };
-export default config;
\ No newline at end of file
+export default config;
diff --git a/src/Umbraco.Web.UI.Client/libs/notification/notification.stories.mdx b/src/Umbraco.Web.UI.Client/libs/notification/notification.mdx
similarity index 100%
rename from src/Umbraco.Web.UI.Client/libs/notification/notification.stories.mdx
rename to src/Umbraco.Web.UI.Client/libs/notification/notification.mdx
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.stories.mdx b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.mdx
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.stories.mdx
rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.mdx
diff --git a/src/Umbraco.Web.UI.Client/src/core/modal/modal.stories.mdx b/src/Umbraco.Web.UI.Client/src/core/modal/modal.mdx
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/core/modal/modal.stories.mdx
rename to src/Umbraco.Web.UI.Client/src/core/modal/modal.mdx
diff --git a/src/Umbraco.Web.UI.Client/src/stories/contextapi.mdx b/src/Umbraco.Web.UI.Client/src/stories/contextapi.mdx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/Umbraco.Web.UI.Client/src/stories/getting-started.stories.mdx b/src/Umbraco.Web.UI.Client/src/stories/getting-started.stories.mdx
deleted file mode 100644
index b8b3e78376..0000000000
--- a/src/Umbraco.Web.UI.Client/src/stories/getting-started.stories.mdx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Meta } from '@storybook/blocks';
-
-<Meta title="Guides/Getting Started" />
-
-# Getting started
-This section contains a set of guide which will ease the learning of the Umbraco CMS (Backoffice).
-In this document you will get a overview of the articles — Enabling you to get started with the parts that makes sense for you.
-
-# Terminology
-There is a few words that covers certain concepts, which is good to learn to easilier decode the purpose of code.
-
-
-[Go to Resource Guide](/?path=/story/guides-resource--page)
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/stories/gettingstarted.mdx b/src/Umbraco.Web.UI.Client/src/stories/gettingstarted.mdx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/Umbraco.Web.UI.Client/src/stories/store.stories.mdx b/src/Umbraco.Web.UI.Client/src/stories/store.mdx
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/stories/store.stories.mdx
rename to src/Umbraco.Web.UI.Client/src/stories/store.mdx
diff --git a/src/Umbraco.Web.UI.Client/src/stories/umb-element.stories.mdx b/src/Umbraco.Web.UI.Client/src/stories/umb-element.stories.mdx
deleted file mode 100644
index be0ac5d44e..0000000000
--- a/src/Umbraco.Web.UI.Client/src/stories/umb-element.stories.mdx
+++ /dev/null
@@ -1,39 +0,0 @@
-import { Meta } from '@storybook/addon-docs';
-
-<Meta title="Guides/Umbraco Element" parameters={{ previewTabs: { canvas: { hidden: true } } }} />
-
-# Umbraco Element
-
-This element can be used as the base of any Element.
-Do this if you need to Observe Data, Consume or Provide a Context API or use a Resource.
-The Element implements the Controller Host and provides a few shortcut methods for initializing some Controllers.
-
-The methods are (_note this can be out of date, we need to look into how we can ensure this Doc originates from code._)
-
-```
-observe<T>(source: Observable<T>, callback: (_value: T) => void, unique?: string): UmbObserverController<T>
-
-provideContext<R = unknown>(alias: string | UmbContextToken<R>, instance: R): UmbContextProviderController<R>
-
-consumeContext<R = unknown>(alias: string | UmbContextToken<R>, callback: UmbContextCallback<R>): UmbContextConsumerController<R>
-```
-
-Use these for an smooth consumption, like this request for a Context API using a simple string context, where the callback value is unknown
-
-```
-this.consumeContext('requestThisContextAlias', (context) => {
-	// Notice this is a subscription, as context might change or a new one appears.
-	console.log("I've got the context", context);
-});
-```
-
-Or use the UmbContextToken type to define the type of the context, like this
-
-```
-const contextAlias = new UmbContextToken<SomeType>('description of context for debugging purposes');
-
-this.consumeContext(contextAlias, (context) => {
-	// Notice this is a subscription, as context might change or a new one appears, but the value is strongly typed
-	console.log("I've got the context", context);
-});
-```
diff --git a/src/Umbraco.Web.UI.Client/src/stories/umbelement.mdx b/src/Umbraco.Web.UI.Client/src/stories/umbelement.mdx
new file mode 100644
index 0000000000..e69de29bb2