From 13428d60e7d3ea6a24c0df8871ea13e2dec0d5fd Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Fri, 2 Aug 2024 10:59:33 +0700
Subject: [PATCH] feat: make scroll area type auto for make default visible
 scrollbar (#3220)

---
 joi/src/core/ScrollArea/index.tsx   | 2 +-
 joi/src/core/ScrollArea/styles.scss | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/joi/src/core/ScrollArea/index.tsx b/joi/src/core/ScrollArea/index.tsx
index f1f241d9d5..c7fe71572a 100644
--- a/joi/src/core/ScrollArea/index.tsx
+++ b/joi/src/core/ScrollArea/index.tsx
@@ -9,7 +9,7 @@ const ScrollArea = React.forwardRef<
   React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>
 >(({ className, children, onScroll, ...props }, ref) => (
   <ScrollAreaPrimitive.Root
-    type="scroll"
+    type="auto"
     className={twMerge('scroll-area__root', className)}
     {...props}
   >
diff --git a/joi/src/core/ScrollArea/styles.scss b/joi/src/core/ScrollArea/styles.scss
index cb5832c53d..20d9665411 100644
--- a/joi/src/core/ScrollArea/styles.scss
+++ b/joi/src/core/ScrollArea/styles.scss
@@ -44,17 +44,17 @@
 }
 
 .scroll-area__bar[data-orientation='vertical'] {
-  width: 8px;
+  width: 10px;
 }
 
 .scroll-area__bar[data-orientation='horizontal'] {
   flex-direction: column;
-  height: 8px;
+  height: 10px;
 }
 
 ::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
+  width: 10px;
+  height: 10px;
 }
 ::-webkit-scrollbar-track,
 ::-webkit-scrollbar-thumb {