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.
 
 
 
 
 
 

89 lines
2.3 KiB

import React from "react";
import { connect } from "react-redux";
import Svg, { Path } from "react-native-svg";
import SelectDropdown from "react-native-select-dropdown";
//styles
import fontSize from "../constants/fontSize";
import Colors from "../constants/Colors";
function Select({
iconPosition,
options,
onChange,
name,
width,
defaultValue,
theme,
}) {
return (
<SelectDropdown
data={options}
buttonStyle={{
width: width,
borderWidth: 1,
borderColor: Colors.theme1.gray2077 + "66",
borderRadius: 2,
height: 48,
backgroundColor:
theme === "light" ? Colors.theme1.white : Colors.theme1.gray2077,
fontFamily: "Regular",
}}
rowTextStyle={{
fontSize: fontSize.sm,
fontFamily: "Regular",
color: theme === "light" ? Colors.theme1.gray20 : Colors.theme1.grayF9,
}}
defaultButtonText={defaultValue}
statusBarTranslucent={true}
buttonTextStyle={{
textAlign: "center",
justifyContent: "flex-end",
flex: 0,
fontSize: fontSize.tiny,
color: theme === "light" ? Colors.theme1.gray2077 : Colors.theme1.white,
fontFamily: "Regular",
// display: 'inline'
}}
dropdownIconPosition={iconPosition}
onSelect={(selectedItem) => {
onChange(name, selectedItem);
}}
renderDropdownIcon={() => (
<Svg
data-name="vuesax/linear/arrow-down"
xmlns="http://www.w3.org/2000/svg"
width={16.081}
height={16.081}
>
<Path
d="m13.347 5.997-4.368 4.369a1.331 1.331 0 0 1-1.876 0L2.734 5.997"
fill="none"
stroke={
theme === "light"
? Colors.theme1.gray2077 + "66"
: Colors.theme1.white
}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</Svg>
)}
dropdownStyle={{
backgroundColor:
theme === "light" ? Colors.theme1.white : Colors.theme1.gray2077,
}}
/>
);
}
const mapStateToProps = (state) => ({
theme: state.publicApi.theme,
});
export default connect(mapStateToProps)(Select);
Select.defaultProps = {
options: ["1", "2", "3"],
iconPosition: "left",
};