From 7ea9248b6b8a4a5beb337de2cd4d548a862d7cc4 Mon Sep 17 00:00:00 2001
From: Nikita Lobachev <nikita@miro.com>
Date: Thu, 28 Nov 2024 10:53:10 +0100
Subject: [PATCH] Replace inline styling with a css rule in storybook

---
 packages/react/menu/src/Menu.stories.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/react/menu/src/Menu.stories.tsx b/packages/react/menu/src/Menu.stories.tsx
index ad5c74951..bab48fe5e 100644
--- a/packages/react/menu/src/Menu.stories.tsx
+++ b/packages/react/menu/src/Menu.stories.tsx
@@ -74,7 +74,7 @@ export const Submenus = () => {
           Scrollable
         </label>
       </div>
-      <MenuWithAnchor style={scrollable ? { overflow: 'scroll', height: 100 } : undefined}>
+      <MenuWithAnchor className={scrollable ? scrollableMenuClass() : undefined}>
         <Menu.Item className={itemClass()} onSelect={() => window.alert('undo')}>
           Undo
         </Menu.Item>
@@ -520,6 +520,11 @@ const animatedItemIndicatorClass = css({
   },
 });
 
+const scrollableMenuClass = css({
+  overflow: 'scroll',
+  height: 100,
+});
+
 export const TickIcon = () => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
@@ -542,4 +547,5 @@ export const classes = {
   itemClass,
   separatorClass,
   subTriggerClass,
+  scrollableMenuClass,
 };