diff --git a/src/Umbraco.Web.UI.Client/.storybook/preview.js b/src/Umbraco.Web.UI.Client/.storybook/preview.js
index 84d7f64230..29941bcc69 100644
--- a/src/Umbraco.Web.UI.Client/.storybook/preview.js
+++ b/src/Umbraco.Web.UI.Client/.storybook/preview.js
@@ -1,16 +1,52 @@
import '@umbraco-ui/uui';
import '@umbraco-ui/uui-css/dist/uui-css.css';
+import { html } from 'lit-html';
import { initialize, mswDecorator } from 'msw-storybook-addon';
import { onUnhandledRequest } from '../src/mocks/browser';
import { handlers } from '../src/mocks/handlers';
+import { UmbExtensionRegistry } from '../src/core/extension';
+import { internalManifests } from '../src/temp-internal-manifests';
+
+import '../src/core/context/context-provider.element';
+import { UmbNodeStore } from '../src/core/stores/node.store';
+import { UmbDataTypeStore } from '../src/core/stores/data-type.store';
+import { UmbDocumentTypeStore } from '../src/core/stores/document-type.store';
+
+const extensionRegistry = new UmbExtensionRegistry();
+internalManifests.forEach((manifest) => extensionRegistry.register(manifest));
+
+const extensionRegistryProvider = (story) => html`
+ ${story()}
+`;
+
+const nodeStoreProvider = (story) => html`
+ ${story()}
+`;
+
+const dataTypeStoreProvider = (story) => html`
+ ${story()}
+`;
+
+const documentTypeStoreProvider = (story) => html`
+ ${story()}
+`;
+
// Initialize MSW
-initialize({onUnhandledRequest});
+initialize({ onUnhandledRequest });
// Provide the MSW addon decorator globally
-export const decorators = [mswDecorator];
+export const decorators = [
+ mswDecorator,
+ extensionRegistryProvider,
+ nodeStoreProvider,
+ dataTypeStoreProvider,
+ documentTypeStoreProvider,
+];
export const parameters = {
actions: { argTypesRegex: '^on.*' },
@@ -23,7 +59,7 @@ export const parameters = {
},
msw: {
handlers: {
- global: handlers
- }
- }
+ global: handlers,
+ },
+ },
};