fix: input overflow issues fixed

GeekyAnts · Nov 12, 2021 · 3294c9f · 3294c9f
1 parent b449f5d
commit 3294c9f
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 2 deletions.
diff --git a/src/components/primitives/Input/Input.tsx b/src/components/primitives/Input/Input.tsx
@@ -19,7 +19,12 @@ const Input = (props: IInputProps, ref: any) => {
     return null;
   }
 
-  if (props.InputLeftElement || props.InputRightElement)
+  if (
+    props.InputLeftElement ||
+    props.InputRightElement ||
+    props.leftElement ||
+    props.rightElement
+  )
     return <InputAdvanced {...props} ref={ref} inputProps={inputProps} />;
   else return <InputBase {...props} ref={ref} inputProps={inputProps} />;
 };

diff --git a/src/components/primitives/Input/InputAdvanced.tsx b/src/components/primitives/Input/InputAdvanced.tsx
@@ -97,7 +97,6 @@ const InputAdvance = (
       flexDirection="row"
       alignItems="center"
       justifyContent="space-between"
-      overflow="hidden"
       {...layoutProps}
       ref={mergeRefs([_ref, wrapperRef])}
     >

diff --git a/src/theme/components/input.ts b/src/theme/components/input.ts
@@ -31,6 +31,7 @@ const baseStyle = (props: Record<string, any>) => {
     fontFamily: 'body',
     p: '2',
     borderRadius: 'sm',
+    overflow: 'auto',
     color: mode('coolGray.800', 'warmGray.50')(props),
     placeholderTextColor: 'muted.400',
     background: 'transparent',