From fb671e96f99508eabfb2c1972d7addbf3f61d016 Mon Sep 17 00:00:00 2001
From: MinamiFunakoshiTR <minami.funakoshi@thomsonreuters.com>
Date: Thu, 7 Aug 2025 10:49:07 -0400
Subject: [PATCH] moves necessary scroller video dependencies to dependencies

---
 package.json                                    |  8 ++++----
 pnpm-lock.yaml                                  | 12 ++++++------
 src/components/ScrollerVideo/ts/videoDecoder.ts |  4 ++--
 3 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/package.json b/package.json
index 75045277..ab7f100f 100644
--- a/package.json
+++ b/package.json
@@ -76,7 +76,6 @@
     "eslint-plugin-storybook": "^0.12.0",
     "knip": "^5.50.5",
     "mermaid": "^10.9.3",
-    "mp4box": "^0.5.4",
     "postcss": "^8.5.3",
     "prettier": "^3.5.3",
     "prettier-plugin-svelte": "^3.3.3",
@@ -93,7 +92,6 @@
     "svelte": "^5.28.1",
     "svelte-check": "^4.1.6",
     "typescript": "^5.8.3",
-    "ua-parser-js": "^2.0.3",
     "vite": "^6.3.2"
   },
   "dependencies": {
@@ -109,7 +107,9 @@
     "slugify": "^1.6.6",
     "storybook-addon-rtl": "^1.1.0",
     "svelte-fa": "^4.0.3",
-    "svelte-intersection-observer": "^1.0.0"
+    "svelte-intersection-observer": "^1.0.0",
+    "mp4box": "^0.5.4",
+    "ua-parser-js": "^2.0.3"
   },
   "exports": {
     ".": {
@@ -124,4 +124,4 @@
   "bugs": {
     "url": "https://github.com/reuters-graphics/graphics-components/issues"
   }
-}
+}
\ No newline at end of file
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 159563c7..ae7fbfab 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -29,6 +29,9 @@ importers:
       journalize:
         specifier: ^2.6.0
         version: 2.6.0
+      mp4box:
+        specifier: ^0.5.4
+        version: 0.5.4
       proper-url-join:
         specifier: ^2.1.2
         version: 2.1.2
@@ -47,6 +50,9 @@ importers:
       svelte-intersection-observer:
         specifier: ^1.0.0
         version: 1.0.0
+      ua-parser-js:
+        specifier: ^2.0.3
+        version: 2.0.3
     devDependencies:
       '@changesets/cli':
         specifier: ^2.29.2
@@ -168,9 +174,6 @@ importers:
       mermaid:
         specifier: ^10.9.3
         version: 10.9.3
-      mp4box:
-        specifier: ^0.5.4
-        version: 0.5.4
       postcss:
         specifier: ^8.5.3
         version: 8.5.3
@@ -219,9 +222,6 @@ importers:
       typescript:
         specifier: ^5.8.3
         version: 5.8.3
-      ua-parser-js:
-        specifier: ^2.0.3
-        version: 2.0.3
       vite:
         specifier: ^6.3.2
         version: 6.3.2(@types/node@22.14.1)(jiti@2.4.2)(sass@1.86.3)(yaml@2.7.1)
diff --git a/src/components/ScrollerVideo/ts/videoDecoder.ts b/src/components/ScrollerVideo/ts/videoDecoder.ts
index f303e7d2..d9758d44 100644
--- a/src/components/ScrollerVideo/ts/videoDecoder.ts
+++ b/src/components/ScrollerVideo/ts/videoDecoder.ts
@@ -1,4 +1,4 @@
-import * as MP4Box from 'mp4box';
+import { createFile } from 'mp4box';
 
 interface MP4BoxBuffer extends ArrayBuffer {
   fileStart: number;
@@ -133,7 +133,7 @@ const decodeVideo = (
 
     try {
       // Uses mp4box for demuxing
-      const mp4boxfile = MP4Box.createFile();
+      const mp4boxfile = createFile();
 
       // Holds the codec value
       let codec = 'N/A';