From 0b16e46672d2940716173d2bc887d891f51ff241 Mon Sep 17 00:00:00 2001
From: Karine Brandelli <karinebrandelli@live.com>
Date: Fri, 3 May 2024 10:39:41 -0300
Subject: [PATCH 1/3] chore: adjusts for hermes

---
 src/core/data-display/data-table/rows.tsx                 | 8 ++++----
 .../auto-complete-lab/autocomplete-lab.stories.tsx        | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/core/data-display/data-table/rows.tsx b/src/core/data-display/data-table/rows.tsx
index 4a78fe75..226c6398 100644
--- a/src/core/data-display/data-table/rows.tsx
+++ b/src/core/data-display/data-table/rows.tsx
@@ -205,10 +205,10 @@ export const StatefulRow = <D extends Data>({
 
     return (
         <>
-            {columns.map(column => (
+            {columns.map((column, i) => (
                 <TableCell
                     align={column.align}
-                    key={column.title}
+                    key={`${column.title}-${i}`}
                     style={column.cellStyle}>
                     {getCorrectViewMode(column, mode, isEditable(column))}
                 </TableCell>
@@ -237,11 +237,11 @@ export const NewRow = <D extends Data>({
 
     return (
         <TableRow data-testid='table-row'>
-            {columns.map(column => (
+            {columns.map((column, i) => (
                 <TableCell
                     style={column.cellStyle}
                     align={column.align}
-                    key={column.title}>
+                    key={`${column.title}-${i}`}>
                     {isEditable(column)
                         ? renderEditMode(
                               column,
diff --git a/src/experimental/auto-complete-lab/autocomplete-lab.stories.tsx b/src/experimental/auto-complete-lab/autocomplete-lab.stories.tsx
index 63320b28..cf4f53fe 100644
--- a/src/experimental/auto-complete-lab/autocomplete-lab.stories.tsx
+++ b/src/experimental/auto-complete-lab/autocomplete-lab.stories.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
-import { Autocomplete as AutocompleteLab } from '@material-ui/lab'
 import type { Meta } from '@storybook/react'
 import { default as AutoComplete } from '@/core/inputs/auto-complete'
 import { TextField } from '@/core/inputs/text-field'
+import { Autocomplete as AutocompleteLab } from '.'
 
 export default {
     title: 'Experimental/AutoCompleteLab',

From b9661bc5cb8a842dd5bc89a89532acef284abe84 Mon Sep 17 00:00:00 2001
From: Karine Brandelli <karinebrandelli@live.com>
Date: Fri, 3 May 2024 10:49:45 -0300
Subject: [PATCH 2/3] fix: adjust textfield character counter position

---
 package.json                         |  2 +-
 src/core/inputs/text-field/index.tsx | 12 ++++++------
 src/core/inputs/text-field/styles.ts |  5 ++---
 3 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/package.json b/package.json
index 6ec8c08d..4c34f988 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "flipper-ui",
-    "version": "0.31.5",
+    "version": "0.31.6",
     "description": "",
     "main": "dist/index.js",
     "homepage": "https://flipper-ui.ngi.com.br/",
diff --git a/src/core/inputs/text-field/index.tsx b/src/core/inputs/text-field/index.tsx
index f38f3e52..2434a378 100644
--- a/src/core/inputs/text-field/index.tsx
+++ b/src/core/inputs/text-field/index.tsx
@@ -303,6 +303,12 @@ export const TextField = ({
                                 ? classes.outlinedMultiline
                                 : ''
                     },
+                    endAdornment: characters && (
+                        <CharactersCount>
+                            {otherProps.value?.toString().length}/
+                            {otherProps.inputProps?.maxLength}
+                        </CharactersCount>
+                    ),
                     ...InputProps
                 }}
                 SelectProps={{
@@ -319,12 +325,6 @@ export const TextField = ({
                 {...otherProps}>
                 {options ? renderOptions(options, classes) : children}
             </MuiTextField>
-            {characters && (
-                <CharactersCount>
-                    {otherProps.value?.toString().length}/
-                    {otherProps.inputProps?.maxLength}
-                </CharactersCount>
-            )}
             {onHelperClick && (
                 <HelperBox
                     helperIcon={helperIcon}
diff --git a/src/core/inputs/text-field/styles.ts b/src/core/inputs/text-field/styles.ts
index 89ca3bd4..a97ddc17 100644
--- a/src/core/inputs/text-field/styles.ts
+++ b/src/core/inputs/text-field/styles.ts
@@ -11,9 +11,9 @@ export const Helper = styled.div`
 `
 
 export const TextFieldWrapper = styled.div`
+    width: 100%;
     display: flex;
     flex-direction: rows;
-    width: 100%;
     align-items: center;
     button {
         display: none;
@@ -24,14 +24,13 @@ export const TextFieldWrapper = styled.div`
 `
 
 export const StaticTextFieldWrapper = styled.div`
+    width: 100%;
     display: flex;
     flex-direction: rows;
-    width: 100%;
     align-items: center;
 `
 
 export const CharactersCount = styled.span`
-    margin-left: -35px;
     color: ${grays.g3};
     font-size: 14px;
     font-family:

From fcaaa65c7752ecae4837e96a68580b7733e95807 Mon Sep 17 00:00:00 2001
From: Karine Brandelli <karinebrandelli@live.com>
Date: Fri, 3 May 2024 11:03:34 -0300
Subject: [PATCH 3/3] test: update snapshots

---
 .../auto-complete/__snapshots__/auto-complete.spec.tsx.snap     | 2 +-
 src/core/inputs/date-time/__snapshots__/date-time.spec.tsx.snap | 2 +-
 .../inputs/mask-field/__snapshots__/mask-field.spec.tsx.snap    | 2 +-
 .../inputs/text-field/__snapshots__/text-field.spec.tsx.snap    | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/core/inputs/auto-complete/__snapshots__/auto-complete.spec.tsx.snap b/src/core/inputs/auto-complete/__snapshots__/auto-complete.spec.tsx.snap
index 8639ba37..1d3e4cbd 100644
--- a/src/core/inputs/auto-complete/__snapshots__/auto-complete.spec.tsx.snap
+++ b/src/core/inputs/auto-complete/__snapshots__/auto-complete.spec.tsx.snap
@@ -6,7 +6,7 @@ exports[`AutoComplete should match snapshot 1`] = `
     style="position: relative;"
   >
     <div
-      class="sc-dmyCSP kvMDoa"
+      class="sc-dmyCSP jvASYa"
     >
       <div
         class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
diff --git a/src/core/inputs/date-time/__snapshots__/date-time.spec.tsx.snap b/src/core/inputs/date-time/__snapshots__/date-time.spec.tsx.snap
index c14492cd..e9a0bcff 100644
--- a/src/core/inputs/date-time/__snapshots__/date-time.spec.tsx.snap
+++ b/src/core/inputs/date-time/__snapshots__/date-time.spec.tsx.snap
@@ -14,7 +14,7 @@ exports[`DateTime should match snapshot 1`] = `
         class="MuiInputBase-input MuiOutlinedInput-input makeStyles-outlinedInput-49 MuiInputBase-inputAdornedEnd MuiOutlinedInput-inputAdornedEnd"
         role="date-picker"
         type="text"
-        value="03042024"
+        value="03052024"
       />
       <div
         class="MuiInputAdornment-root MuiInputAdornment-positionEnd"
diff --git a/src/core/inputs/mask-field/__snapshots__/mask-field.spec.tsx.snap b/src/core/inputs/mask-field/__snapshots__/mask-field.spec.tsx.snap
index 18ba331e..dd3725cd 100644
--- a/src/core/inputs/mask-field/__snapshots__/mask-field.spec.tsx.snap
+++ b/src/core/inputs/mask-field/__snapshots__/mask-field.spec.tsx.snap
@@ -3,7 +3,7 @@
 exports[`MaskField should match snapshot 1`] = `
 <div>
   <div
-    class="sc-dmyCSP kvMDoa"
+    class="sc-dmyCSP jvASYa"
   >
     <div
       class="MuiFormControl-root MuiTextField-root"
diff --git a/src/core/inputs/text-field/__snapshots__/text-field.spec.tsx.snap b/src/core/inputs/text-field/__snapshots__/text-field.spec.tsx.snap
index 90a5d1e5..e900fe84 100644
--- a/src/core/inputs/text-field/__snapshots__/text-field.spec.tsx.snap
+++ b/src/core/inputs/text-field/__snapshots__/text-field.spec.tsx.snap
@@ -3,7 +3,7 @@
 exports[`TextField should match snapshot 1`] = `
 <div>
   <div
-    class="sc-hLQSwg dhfXCV"
+    class="sc-hLQSwg gdgoxJ"
   >
     <div
       class="MuiFormControl-root MuiTextField-root"