From f79041576296a0e5e1238f7dc3e39fc797cab7b1 Mon Sep 17 00:00:00 2001
From: WX <42308734@qq.com>
Date: Sat, 8 Apr 2023 17:33:42 +0800
Subject: [PATCH] =?UTF-8?q?fix(SearchInputBar):=20=E6=98=8E=E6=9A=97?=
 =?UTF-8?q?=E4=B8=BB=E9=A2=98=E8=89=B2=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/core/src/SearchInputBar/index.tsx | 31 +++++++++++++++-------
 1 file changed, 22 insertions(+), 9 deletions(-)

diff --git a/packages/core/src/SearchInputBar/index.tsx b/packages/core/src/SearchInputBar/index.tsx
index ec830bd6f..0b3c545cd 100644
--- a/packages/core/src/SearchInputBar/index.tsx
+++ b/packages/core/src/SearchInputBar/index.tsx
@@ -9,13 +9,15 @@ import {
   TextInput,
   TextInputFocusEventData,
   TextInputProps,
-  Text,
   TextStyle,
   TouchableWithoutFeedbackProps,
 } from 'react-native';
 import Icon, { IconsProps } from '../Icon';
 import Loader from '../Loader';
 import { colors } from '../utils';
+import Text from '../Typography/Text';
+import { Theme } from '../theme';
+import { useTheme } from '@shopify/restyle';
 
 export interface SearchInputBarProps extends TextInputProps {
   /** 容器样式 */
@@ -49,7 +51,7 @@ interface SearchInputBarState {
 
 const SearchInputBar = (props: SearchInputBarProps) => {
   const inputRef = React.createRef<TextInput>();
-
+  const theme = useTheme<Theme>();
   const [state, setState] = useState<SearchInputBarState>({
     showIcon: false,
   });
@@ -76,7 +78,7 @@ const SearchInputBar = (props: SearchInputBarProps) => {
         searchRender
       ) : (
         <TouchableOpacity {...touchProps} style={[styles.search, { paddingHorizontal: 10 }]}>
-          <Text>{actionName}</Text>
+          <Text color="primary_background">{actionName}</Text>
         </TouchableOpacity>
       );
     }
@@ -98,16 +100,23 @@ const SearchInputBar = (props: SearchInputBarProps) => {
   return (
     <Loader loading={loading} rounded={5} maskColor="transparent">
       <View style={[styles.centerFlex]}>
-        <View style={StyleSheet.flatten([styles.searchContainer, styles.centerFlex, containerStyle])}>
+        <View
+          style={StyleSheet.flatten([
+            { backgroundColor: theme.colors.mask || '#fff' },
+            styles.searchContainer,
+            styles.centerFlex,
+            containerStyle,
+          ])}
+        >
           <TouchableOpacity onPress={() => needFocus('search')}>
-            <Icon name="search" size={14} color={colors.colorsPalette.grey40} height={'100%'} {...searchIcon} />
+            <Icon name="search" size={14} color={theme.colors.text} height={'100%'} {...searchIcon} />
           </TouchableOpacity>
           <TextInput
             {...other}
             value={value}
             onChangeText={onChangeText}
             ref={inputRef}
-            style={[styles.textInput, inputStyle]}
+            style={[{ color: theme.colors.primary_text || '#A6ACB1' }, styles.textInput, inputStyle]}
             onFocus={(e: NativeSyntheticEvent<TextInputFocusEventData>) => {
               if (showActionButton !== null) {
                 setState({ showIcon: true });
@@ -123,7 +132,13 @@ const SearchInputBar = (props: SearchInputBarProps) => {
           />
           {Boolean(value) && (
             <TouchableOpacity style={{}} onPress={() => needFocus('close')}>
-              <Icon name="close" size={14} color={colors.colorsPalette.grey40} height={'100%'} {...closeIcon} />
+              <Icon
+                name="close"
+                size={14}
+                color={theme.colors.primary_text || '#A6ACB1'}
+                height={'100%'}
+                {...closeIcon}
+              />
             </TouchableOpacity>
           )}
         </View>
@@ -146,7 +161,6 @@ const styles = StyleSheet.create({
     borderRadius: 5,
     flex: 1,
     paddingHorizontal: 15,
-    backgroundColor: colors.colorsPalette.grey70,
   },
   textInput: {
     paddingVertical: 0,
@@ -155,7 +169,6 @@ const styles = StyleSheet.create({
     fontSize: 14,
     fontWeight: '400',
     paddingLeft: 10,
-    color: colors.colorsPalette.grey40,
   },
   search: {
     justifyContent: 'center',