In IOS dropdown not working

[arindampal024]

import React, { useEffect, useReducer, useState } from "react"; import { View, StyleSheet } from "react-native"; import { SelectList } from "react-native-dropdown-select-list"; import { TouchableWithoutFeedback } from "react-native-gesture-handler"; import { HelperText } from "react-native-paper";

const INPUT_CHANGE = "INPUT_CHANGE"; const INPUT_FOCUS = "INPUT_FOCUS";

const inputReducer = (state: any, action: any) => { switch (action.type) { case INPUT_CHANGE: return { ...state, value: action.value, isValid: action.isValid, errorMessage: action.errorMessage, }; case INPUT_FOCUS: return { ...state, isValid: action.isValid, errorMessage: action.errorMessage, touched: true, }; default: return state; } };

const SearchableDropdown = ({ data, onSelect, label, initialValue, isRequired, id, onInputChange }) => { const initialState = { value: Object.keys(initialValue).length > 0 ? initialValue.name : "", isValid: true, errorMessage: null, touched: false, };

const [inputState, dispatch] = useReducer(inputReducer, initialState);

useEffect(() => {
    if (inputState.touched) {
        onInputChange(id, inputState.value, inputState.isValid);
    }
}, [inputState, onInputChange, id]);

const handleSelectItem = (item: any) => {
    if (isRequired && !item) {
        dispatch({
            type: INPUT_CHANGE,
            value: "",
            isValid: false,
            errorMessage: label + "is required",
            touched: true,
        });
    } else {
        dispatch({
            type: INPUT_CHANGE,
            value: item,
            isValid: true,
            errorMessage: "",
            touched: true,
        });
    }
    onSelect(item);
};

const handleTouch = () => {
    if (!inputState.value && isRequired) {
        dispatch({
            type: INPUT_FOCUS,
            isValid: false,
            errorMessage: label + " is required",
        });
    }
};

return (
    <View style={styles.formControl}>
        <TouchableWithoutFeedback onPress={handleTouch}>
            <SelectList
                data={data}
                setSelected={(val: any) => handleSelectItem(val)}
                save="value"
                placeholder={label}
                defaultOption={initialValue ? initialValue : {}}
                boxStyles={
                    !inputState.isValid && inputState.touched && styles.errorStyle
                }
            />
        </TouchableWithoutFeedback>
        {!inputState.isValid && inputState.touched && (
            <HelperText type="error">
                {inputState.errorMessage && inputState.errorMessage}
            </HelperText>
        )}
    </View>
);

};

export default SearchableDropdown;

const styles = StyleSheet.create({ formControl: { width: "100%", padding: 10, }, errorStyle: { borderColor: "red", }, normalStyle: {}, });

I have create this Component

[AdelRedaa97]

A lot of changes were made in v4.0, take a look here https://github.com/AdelRedaa97/react-native-select-dropdown?tab=readme-ov-file#-major-changes

Feel free to open the issue again if it still exists