fix(search-form): Show ellipsis when placeholder overflows (#2927)

Add ellipsis to placeholder text in the search form. [category:Components]
Workday · Sep 17, 2024 · 677270f · 677270f
1 parent f4c1db6
commit 677270f
Showing 1 changed file with 3 additions and 0 deletions.
diff --git a/modules/labs-react/search-form/lib/SearchForm.tsx b/modules/labs-react/search-form/lib/SearchForm.tsx
@@ -263,6 +263,9 @@ const SearchInput = styled(TextInput)<
     '&::placeholder': {
       color: inputColors.placeholderColor,
     },
+    '&:placeholder-shown': {
+      textOverflow: 'ellipsis',
+    },
     '&:not([disabled])': {
       '&:focus, &:active': {
         outline: 'none',