From e03717c51486ee3244f4a2f90cc917f85883d830 Mon Sep 17 00:00:00 2001
From: Sudev Kiyada <sudev.kiyada@thomsonreuters.com>
Date: Thu, 29 May 2025 19:04:46 +0530
Subject: [PATCH 1/2] makes width prop reactive

---
 src/components/ScrollerBase/ScrollerBase.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ScrollerBase/ScrollerBase.svelte b/src/components/ScrollerBase/ScrollerBase.svelte
index 21c2d9f9..13a8c112 100644
--- a/src/components/ScrollerBase/ScrollerBase.svelte
+++ b/src/components/ScrollerBase/ScrollerBase.svelte
@@ -133,7 +133,7 @@
   let wh = $state(0);
   let fixed = $state(false);
   let offset_top = 0;
-  let width = 1;
+  let width = $state(1);
 
   let top_px = $derived(Math.round(top * wh));
   let bottom_px = $derived(Math.round(bottom * wh));

From 83740d7eaa5b22393bd3b00ca154cebfbced6928 Mon Sep 17 00:00:00 2001
From: MinamiFunakoshiTR <minami.funakoshi@thomsonreuters.com>
Date: Thu, 29 May 2025 12:07:00 -0700
Subject: [PATCH 2/2] adds bg colour, changes scroller base demo width to
 max-width

---
 src/components/ScrollerBase/demo/ScrollerDemo.svelte | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/ScrollerBase/demo/ScrollerDemo.svelte b/src/components/ScrollerBase/demo/ScrollerDemo.svelte
index 34f4383c..485f6850 100644
--- a/src/components/ScrollerBase/demo/ScrollerDemo.svelte
+++ b/src/components/ScrollerBase/demo/ScrollerDemo.svelte
@@ -63,8 +63,9 @@
   @use '../../../scss/mixins' as mixins;
 
   .scroller-demo-container {
-    width: mixins.$column-width-normal;
+    max-width: mixins.$column-width-normal;
     margin: auto;
+    background: #c5dfe8;
   }
 
   .step-foreground-container {