Merge branch 'next' into fix/color-border-in-menu

storybookjs · Jul 16, 2020 · c17097a · c17097a
2 parents 514428e + 6136e49
commit c17097a
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/addons/storyshots/storyshots-puppeteer/README.md b/addons/storyshots/storyshots-puppeteer/README.md
@@ -10,7 +10,7 @@ npm install @storybook/addon-storyshots-puppeteer puppeteer --save-dev
 
 ⚠️ As of Storybook 5.3 `puppeteer` is no more included in addon dependencies and must be added to your project directly.
 
-## Configure Storyshots for Puppeteeer tests
+## Configure Storyshots for Puppeteer tests
 
 ⚠️ **React-native** is **not supported** by this test function.
 

diff --git a/lib/components/src/ScrollArea/ScrollArea.tsx b/lib/components/src/ScrollArea/ScrollArea.tsx
@@ -11,7 +11,7 @@ export interface ScrollProps {
 }
 
 const Scroll = styled(({ vertical, horizontal, ...rest }: ScrollProps) => (
-  <OverlayScrollbarsComponent options={{ scrollbars: { autoHide: 'scroll' } }} {...rest} />
+  <OverlayScrollbarsComponent options={{ scrollbars: { autoHide: 'leave' } }} {...rest} />
 ))<ScrollProps>(
   ({ vertical }) =>
     !vertical

diff --git a/lib/components/src/bar/bar.tsx b/lib/components/src/bar/bar.tsx
@@ -36,7 +36,7 @@ const Side = styled.div<SideProps>(
 Side.displayName = 'Side';
 
 export const Bar = styled(({ children, className }) => (
-  <ScrollArea horizontal className={className}>
+  <ScrollArea horizontal vertical={false} className={className}>
     {children}
   </ScrollArea>
 ))(
@@ -45,8 +45,9 @@ export const Bar = styled(({ children, className }) => (
     width: '100%',
     height: 40,
     flexShrink: 0,
+    overflow: 'auto',
+    overflowY: 'hidden',
   }),
-
   ({ theme, border }) =>
     border
       ? {
@@ -65,7 +66,6 @@ const BarInner = styled.div<{ bgColor: string }>(({ bgColor }) => ({
   flexShrink: 0,
   height: 40,
   backgroundColor: bgColor || '',
-  overflowX: 'auto',
 }));
 
 export interface FlexBarProps {