Update NumericInput value in React-Native

Question

I'm trying to update a NumericInput value imported from react-native-numeric-input library but its not displaying the changes. The same value is updating the MultiSlider from '@ptomasroos/react-native-multi-slider' correctly but not the NumericValue.

Thanks in advance

This is how the custom component is being called and passing initValue.

<PlusMinusSlider
                        label="Slope (%)"
                        initValue={props.currentValues.inclination.toFixed(1)}
                        minValue={0}
                        maxValue={100}
                        step={0.1}
                        onValueChange={value => {
                            const action: SetInclinationAction = {
                                type: InputValuesActionTypes.SetInclination,
                                value: value,
                            };
                            props.dispatch(action);
                        }}
                        key={106}
                    />

This is the full component PlusMinusSlider.

export type Props = {
    label: string;
    initValue: number;
    minValue: number;
    maxValue: number;
    step?: number;
    onValueChange?: (value: number) => void;
};

const toRoundedString = (num: number): string => {
    return (Math.round(num * 10) / 10).toFixed(1);
};

const PlusMinusSlider: React.FC<Props> = ({
    label,
    initValue,
    minValue,
    maxValue,  
    step = 1,
    onValueChange,
}) => {
    const colorScheme = useColorScheme();
    if (typeof initValue === 'string') {
        initValue = parseFloat(initValue);
    }

    const [value, setValue] = useState(initValue);

    if (typeof value === 'string') {
        setValue(parseFloat(value));
    }
    useEffect(() => {
            setValue(initValue);
      }, [initValue]); 

    let numInputRef: NumericInput | null;

    const updateValue = (newValue: number) => {
        if (newValue < minValue) {
            newValue = minValue;
        } else if (newValue > maxValue) {
            newValue = maxValue;
        }

        if (onValueChange) {
            onValueChange(newValue);
        }
        numInputRef?.setState({ value: newValue });
        setValue(newValue);
    };

    const toStringValue = (newValue: number): string => {
        let stringValue: string;
        if (newValue % 1 === 0) {
            stringValue = newValue.toString();
        } else {
            stringValue = toRoundedString(newValue);
        }
        return stringValue;
    };

    return (
        <View style={styles.mainContainer}>
            <Text style={styles.label}>{label}</Text>
            <View style={styles.inputsContainer}>
                <NumericInput
                    onChange={newValue => updateValue(newValue)}
                    minValue={minValue}
                    maxValue={maxValue}
                    value={value}
                    step={step}
                    valueType={'real'}
                    rounded
                    leftButtonBackgroundColor={Colors[colorScheme].primary}
                    rightButtonBackgroundColor={Colors[colorScheme].primary}
                    textColor={Colors[colorScheme].text}
                    // @ts-ignore
                    iconStyle={{ color: Colors[colorScheme].text }}
                    ref={ref => (numInputRef = ref)}
                />
                <MultiSlider
                    sliderLength={220}
                    min={minValue}
                    max={maxValue}
                    step={step}
                    values={[value]}
                    touchDimensions={{
                        height: 48,
                        width: 48,
                        borderRadius: 50,
                        slipDisplacement: 30,
                    }}
                    markerStyle={{
                        backgroundColor: Colors[colorScheme].slider,
                        height: 20,
                        width: 20,
                        borderRadius: 50,
                    }}
                    selectedStyle={{
                        backgroundColor: Colors[colorScheme].slider,
                    }}
                    onValuesChange={values => {
                        const localValue = values[0];
                        updateValue(localValue);
                        const stringValue = toStringValue(localValue);
                        numInputRef?.setState({
                            stringValue: stringValue,
                        });
                    }}
                />
            </View>
        </View>
    );
};