chore: fix invalid css color prop on text components (#5388)

* chore: fix

* chore: fix snapshot tests

src/components/SearchModal/CurrencyList/__snapshots__/index.test.tsx.snap

@@ -171,7 +171,7 @@ exports[`renders currency rows correctly when currencies list is non-empty 1`] =
             </div>
           </div>
           <div
-            class="c10 css-1j6a53a"
+            class="c10 css-yfjwjl"
           >
             DAI
           </div>
@@ -246,7 +246,7 @@ exports[`renders currency rows correctly when currencies list is non-empty 1`] =
             </div>
           </div>
           <div
-            class="c10 css-1j6a53a"
+            class="c10 css-yfjwjl"
           >
             USDC
           </div>
@@ -321,7 +321,7 @@ exports[`renders currency rows correctly when currencies list is non-empty 1`] =
             </div>
           </div>
           <div
-            class="c10 css-1j6a53a"
+            class="c10 css-yfjwjl"
           >
             WBTC
           </div>

src/theme/components/text.tsx

@@ -5,7 +5,9 @@
 import { Text, TextProps as TextPropsOriginal } from 'rebass'
 import styled from 'styled-components/macro'
 
-const TextWrapper = styled(Text)<{ color: keyof string }>`
+const TextWrapper = styled(Text).withConfig({
+  shouldForwardProp: (prop) => prop !== 'color',
+})<{ color: keyof string }>`
   color: ${({ color, theme }) => (theme as any)[color]};
 `