You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
56 lines
1.5 KiB
56 lines
1.5 KiB
import React, { useState } from "react"; |
|
import { |
|
TextInput, |
|
View, |
|
Dimensions, |
|
StyleSheet, |
|
Pressable, |
|
Appearance, |
|
} from "react-native"; |
|
import tw from "tailwind-rn"; |
|
import { AntDesign } from "@expo/vector-icons"; |
|
|
|
//style |
|
import Colors from "../constants/Colors"; |
|
import fontSize from "../constants/fontSize"; |
|
|
|
const width = Dimensions.get("window").width; |
|
|
|
const Search = ({ placeholder, textAlign, direction, onChange, value }) => { |
|
const colorScheme = Appearance.getColorScheme(); |
|
const styles = StyleSheet.create({ |
|
inputStyle: { |
|
fontSize: fontSize.tiny, |
|
color: Colors.theme1[colorScheme].gray2077, |
|
borderWidth: 0.5, |
|
borderColor: Colors.theme1[colorScheme].gray20 + '88', |
|
paddingVertical: 10, |
|
paddingHorizontal: 10, |
|
direction: direction, |
|
textAlign: textAlign, |
|
backgroundColor: Colors.theme1[colorScheme].white, |
|
fontFamily: "regular", |
|
}, |
|
}); |
|
return ( |
|
<View style={[{ marginTop: 18 }, tw("w-full relative")]}> |
|
<TextInput |
|
style={[styles.inputStyle, tw("rounded-md")]} |
|
onChangeText={(text) => onChange(text)} |
|
placeholder={placeholder} |
|
placeholderTextColor={Colors.theme1[colorScheme].gray20 + '88'} |
|
value={value} |
|
/> |
|
<Pressable style={tw("absolute left-3 top-3")}> |
|
<AntDesign name="search1" size={20} color="#52796F" /> |
|
</Pressable> |
|
</View> |
|
); |
|
}; |
|
|
|
export default Search; |
|
|
|
Search.defaultProps = { |
|
direction: "rtl", |
|
textAlign: "right", |
|
};
|
|
|