From 2684fbb784d659782f9704a2d984e2ae745cbaf4 Mon Sep 17 00:00:00 2001
From: matijs <matijs@gmail.com>
Date: Wed, 18 Dec 2024 09:40:17 +0100
Subject: [PATCH] fix: Storybook viewMode

Use the Storybook API and make sure TS knows about DOM
---
 packages/storybook-shared/src/StoryRootDecorator.tsx | 4 ++--
 packages/storybook-shared/tsconfig.json              | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/storybook-shared/src/StoryRootDecorator.tsx b/packages/storybook-shared/src/StoryRootDecorator.tsx
index fdfac543..f0c533d6 100644
--- a/packages/storybook-shared/src/StoryRootDecorator.tsx
+++ b/packages/storybook-shared/src/StoryRootDecorator.tsx
@@ -15,10 +15,10 @@ export const StoryRootDecorator: Decorator = (Story, context) => {
   //
   // - Page title: https://nldesignsystem.nl/wcag/2.4.2
   // - Language of the page: https://nldesignsystem.nl/wcag/3.1.1
-  const viewMode = typeof location !== 'undefined' ? new URLSearchParams(location.search).get('viewMode') : '';
+  const { viewMode } = context;
 
   useEffect(() => {
-    if (viewMode === 'story' && typeof document !== 'undefined') {
+    if (viewMode === 'story') {
       document.title = title || context.name;
       document.documentElement.lang = lang;
       document.documentElement.dir = dir || '';
diff --git a/packages/storybook-shared/tsconfig.json b/packages/storybook-shared/tsconfig.json
index 1fd6930b..5b26143e 100644
--- a/packages/storybook-shared/tsconfig.json
+++ b/packages/storybook-shared/tsconfig.json
@@ -2,6 +2,7 @@
   "extends": "@nl-design-system/tsconfig",
   "compilerOptions": {
     "allowSyntheticDefaultImports": true,
+    "lib": ["DOM"],
     "module": "esnext",
     "moduleResolution": "bundler"
   }