From c01ffc9cf9ce4b9eff399f8905980b97435054cd Mon Sep 17 00:00:00 2001
From: Karina Maulitova <karinamaulitova@gmail.com>
Date: Fri, 26 Jan 2024 12:49:07 +0100
Subject: [PATCH 1/2] feat: add error message wrap for inputs

---
 packages/input/Input.tsx      | 2 +-
 packages/input/InputStyles.ts | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/input/Input.tsx b/packages/input/Input.tsx
index 9375fd19..c6800fe5 100644
--- a/packages/input/Input.tsx
+++ b/packages/input/Input.tsx
@@ -93,7 +93,7 @@ export const Input = forwardRef(
         </InputContentStyle>
 
         {hasErrorMessage && (
-          <InputMessageStyle $variant='error' $bordered>
+          <InputMessageStyle $variant='error' $bordered $wrap>
             {error}
           </InputMessageStyle>
         )}
diff --git a/packages/input/InputStyles.ts b/packages/input/InputStyles.ts
index 56da5891..80d0b36d 100644
--- a/packages/input/InputStyles.ts
+++ b/packages/input/InputStyles.ts
@@ -293,6 +293,7 @@ const messageVariants = {
 export const InputMessageStyle = styled.span<{
   $variant: InputMessageVariants
   $bordered?: boolean
+  $wrap?: boolean
 }>`
   margin-top: ${({ $bordered }) => ($bordered ? 5 : 6)}px;
   left: ${({ $bordered }) => ($bordered ? -1 : 0)}px;
@@ -303,7 +304,7 @@ export const InputMessageStyle = styled.span<{
   font-size: ${({ theme }) => theme.fontSizesMap.xxs}px;
   border-radius: ${({ theme }) => theme.borderRadiusesMap.sm}px;
   padding: 6px 10px;
-  white-space: nowrap;
+  white-space: ${({ $wrap }) => ($wrap ? 'wrap' : 'nowrap')};
   overflow: hidden;
   box-sizing: border-box;
   text-overflow: ellipsis;

From 62bd9b808a00a8bf480ee06f9da2a1281aa5b76b Mon Sep 17 00:00:00 2001
From: Karina Maulitova <karinamaulitova@gmail.com>
Date: Fri, 26 Jan 2024 12:51:11 +0100
Subject: [PATCH 2/2] feat: add warning message wrap for inputs

---
 packages/input/Input.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/input/Input.tsx b/packages/input/Input.tsx
index c6800fe5..a4c30507 100644
--- a/packages/input/Input.tsx
+++ b/packages/input/Input.tsx
@@ -98,7 +98,7 @@ export const Input = forwardRef(
           </InputMessageStyle>
         )}
         {hasWarningMessage && (
-          <InputMessageStyle $variant='warning' $bordered>
+          <InputMessageStyle $variant='warning' $bordered $wrap>
             {warning}
           </InputMessageStyle>
         )}