diff --git a/.gitignore b/.gitignore index e69de29b..e43b0f98 100644 --- a/.gitignore +++ b/.gitignore @@ -0,0 +1 @@ +.DS_Store diff --git a/components/SelectList.tsx b/components/SelectList.tsx index 5e7a6771..a77f2e5a 100644 --- a/components/SelectList.tsx +++ b/components/SelectList.tsx @@ -31,6 +31,7 @@ const SelectList: React.FC = ({ search = true, searchPlaceholder = "search", notFoundText = "No data found", + allowNewEntries = false, disabledItemStyles, disabledTextStyles, onSelect = () => {}, @@ -45,7 +46,8 @@ const SelectList: React.FC = ({ const [selectedval, setSelectedVal] = React.useState(""); const [height,setHeight] = React.useState(200) const animatedvalue = React.useRef(new Animated.Value(0)).current; - const [filtereddata,setFilteredData] = React.useState(data) + const [filtereddata,setFilteredData] = React.useState(data); + const [enteredVal, setEnteredVal] = React.useState(""); const slidedown = () => { @@ -143,6 +145,7 @@ const SelectList: React.FC = ({ let row = item.value.toLowerCase() return row.search(val.toLowerCase()) > -1; }); + setEnteredVal(val); setFilteredData(result) }} style={[{padding:0,height:20,flex:1,fontFamily},inputStyles]} @@ -222,15 +225,29 @@ const SelectList: React.FC = ({ ) } - }) : - { + (allowNewEntries) + ? + { + setSelected(enteredVal) + let key = data.length+1 + data.push({key:key,value:enteredVal}) + setSelected(key); + setSelectedVal(enteredVal); + slideup() + setTimeout(() => setFilteredData(data), 800) + + }}> + {enteredVal} + + : + { setSelected(undefined) setSelectedVal("") slideup() setTimeout(() => setFilteredData(data), 800) - + }}> {notFoundText} diff --git a/index.d.ts b/index.d.ts index 92ed702b..de4b4859 100644 --- a/index.d.ts +++ b/index.d.ts @@ -112,6 +112,11 @@ export interface SelectListProps { * Pass any JSX to this prop like Text, Image or Icon to show instead of close icon */ closeicon?: JSX.Element, + + /** + * Set to true if you want to allow adding new values + */ + allowNewEntries?: boolean, }