From 3fc407384ac8acf02af433e25f19ad83ea89937e Mon Sep 17 00:00:00 2001
From: Bram Vanhoutte <bram.vanhoutte.x@gmail.com>
Date: Sat, 23 May 2020 16:05:55 +0200
Subject: [PATCH] fix(input): remove useless container

---
 src/components/Input/Input.module.css |  5 +---
 src/components/Input/Input.tsx        | 35 +++++++++++++--------------
 2 files changed, 18 insertions(+), 22 deletions(-)

diff --git a/src/components/Input/Input.module.css b/src/components/Input/Input.module.css
index 10fa8353..bb1a04c1 100644
--- a/src/components/Input/Input.module.css
+++ b/src/components/Input/Input.module.css
@@ -1,7 +1,3 @@
-.container {
-  width: 100%;
-}
-
 .input {
   font: inherit;
   box-sizing: border-box;
@@ -10,6 +6,7 @@
   border-radius: var(--border-radius-small);
   border: 1px solid var(--color-neutral-4);
   padding: 6.5px 14px;
+  width: 100%;
 }
 
 .input::placeholder {
diff --git a/src/components/Input/Input.tsx b/src/components/Input/Input.tsx
index ec3da26f..02aabfe2 100644
--- a/src/components/Input/Input.tsx
+++ b/src/components/Input/Input.tsx
@@ -36,27 +36,26 @@ const Input = React.forwardRef<HTMLInputElement, Props>(
     }: Props,
     ref,
   ) => {
-    const mergedContainerClassName = classNames(cssReset.ventura, styles.container, className);
-    const mergedInputClassName = classNames(styles.input, {
+    const inputClassNames = classNames(cssReset.ventura, styles.input, {
       [styles.containsError]: Boolean(isInvalid),
+      className,
     });
+
     return (
-      <div className={mergedContainerClassName} data-testid="container">
-        <input
-          name={name}
-          value={value}
-          onChange={onChange}
-          placeholder={placeholder}
-          type={type}
-          spellCheck={spellCheck}
-          autoComplete={autoComplete ? 'on' : 'off'}
-          maxLength={maxLength}
-          ref={ref}
-          className={mergedInputClassName}
-          data-testid={`input-${name}`}
-          onBlur={onBlur}
-        />
-      </div>
+      <input
+        name={name}
+        value={value}
+        onChange={onChange}
+        placeholder={placeholder}
+        type={type}
+        spellCheck={spellCheck}
+        autoComplete={autoComplete ? 'on' : 'off'}
+        maxLength={maxLength}
+        ref={ref}
+        className={inputClassNames}
+        data-testid={`input-${name}`}
+        onBlur={onBlur}
+      />
     );
   },
 );