From f296f9985640a463907e2c16f8c34368eb215e86 Mon Sep 17 00:00:00 2001
From: Haider Alshamma <haidera@nulogy.com>
Date: Fri, 22 Nov 2024 13:03:56 -0500
Subject: [PATCH] fix: Use a specific width and height for Chromatic

---
 src/BottomSheet/stories/BottomSheet.actions.story.tsx  | 4 ++++
 src/BottomSheet/stories/BottomSheet.content.story.tsx  | 4 ++++
 src/BottomSheet/stories/BottomSheet.features.story.tsx | 4 ++++
 src/BottomSheet/stories/BottomSheet.parts.story.tsx    | 4 ++++
 src/BottomSheet/stories/BottomSheet.story.tsx          | 4 ++++
 5 files changed, 20 insertions(+)

diff --git a/src/BottomSheet/stories/BottomSheet.actions.story.tsx b/src/BottomSheet/stories/BottomSheet.actions.story.tsx
index ac903be44..8fd93c200 100644
--- a/src/BottomSheet/stories/BottomSheet.actions.story.tsx
+++ b/src/BottomSheet/stories/BottomSheet.actions.story.tsx
@@ -5,6 +5,10 @@ import BottomSheet from "../BottomSheet";
 
 export default {
   title: "Components/BottomSheet/Actions",
+  // decorators: [(storyFn) => <div style={{ width: "800px", height: "800px" }}>{storyFn()}</div>],
+  parameters: {
+    chromatic: { delay: 300 },
+  },
 };
 
 export const WithAHiddenCloseButton = () => {
diff --git a/src/BottomSheet/stories/BottomSheet.content.story.tsx b/src/BottomSheet/stories/BottomSheet.content.story.tsx
index b9692c03d..9292cc05f 100644
--- a/src/BottomSheet/stories/BottomSheet.content.story.tsx
+++ b/src/BottomSheet/stories/BottomSheet.content.story.tsx
@@ -7,6 +7,10 @@ import BottomSheet from "../BottomSheet";
 
 export default {
   title: "Components/BottomSheet/Content",
+  // decorators: [(storyFn) => <div style={{ width: "800px", height: "800px" }}>{storyFn()}</div>],
+  parameters: {
+    chromatic: { delay: 300 },
+  },
 };
 
 export const WithHelpText = () => {
diff --git a/src/BottomSheet/stories/BottomSheet.features.story.tsx b/src/BottomSheet/stories/BottomSheet.features.story.tsx
index 145954ce0..79df5ee80 100644
--- a/src/BottomSheet/stories/BottomSheet.features.story.tsx
+++ b/src/BottomSheet/stories/BottomSheet.features.story.tsx
@@ -13,6 +13,10 @@ import BottomSheet from "../BottomSheet";
 
 export default {
   title: "Components/BottomSheet/Features",
+  // decorators: [(storyFn) => <div style={{ width: "800px", height: "800px" }}>{storyFn()}</div>],
+  parameters: {
+    chromatic: { delay: 300 },
+  },
 };
 
 export const WithCustomWidths = () => {
diff --git a/src/BottomSheet/stories/BottomSheet.parts.story.tsx b/src/BottomSheet/stories/BottomSheet.parts.story.tsx
index 30108a119..abf7b0df2 100644
--- a/src/BottomSheet/stories/BottomSheet.parts.story.tsx
+++ b/src/BottomSheet/stories/BottomSheet.parts.story.tsx
@@ -8,6 +8,10 @@ import { BottomSheetParts as BottomSheet } from "../BottomSheet.parts";
 
 export default {
   title: "Components/BottomSheet/Parts",
+  // decorators: [(storyFn) => <div style={{ width: "800px", height: "800px" }}>{storyFn()}</div>],
+  parameters: {
+    chromatic: { delay: 300 },
+  },
 };
 
 export const RenderedUsingCompositionalAPI = () => {
diff --git a/src/BottomSheet/stories/BottomSheet.story.tsx b/src/BottomSheet/stories/BottomSheet.story.tsx
index 549ceccc6..e7e08f42b 100644
--- a/src/BottomSheet/stories/BottomSheet.story.tsx
+++ b/src/BottomSheet/stories/BottomSheet.story.tsx
@@ -5,6 +5,10 @@ import BottomSheet from "../BottomSheet";
 
 export default {
   title: "Components/BottomSheet",
+  // decorators: [(storyFn) => <div style={{ width: "800px", height: "800px" }}>{storyFn()}</div>],
+  parameters: {
+    chromatic: { delay: 300 },
+  },
 };
 
 export const BasicUsage = () => {