Adding variables in React Native

Question

I'm experiencing inconsistencies when doing calculations using TextInputs (CustomInput) in React Native. For example; if I input '5' under Scope Height and calculate, I get a different number than if I replace the 'scopeHeight' variable with 5. The other input variables seem to work correctly.

const SignInScreen = () => {
    const [scopeHeight, setScopeHeight] = useState('');
    const [pelletWeight, setPelletWeight] = useState('');
    const [pelletSpeed, setPelletSpeed] = useState('');
    const [firstZero, setFirstZero] = useState('');
    const [secondZero, setSecondZero] = useState('');
    const [targetDistance, setTargetDistance] = useState('');
    const [joules, setJoules] = useState('');
    const [ftlb, setFtlb] = useState('');
    const [hold, setHold] = useState('');
    const {height} = useWindowDimensions();

    const onCalcPressed = () => {
        var footPound = ((pelletSpeed**2)*pelletWeight)/450240
        setFtlb(footPound.toFixed(1)+ " ft.lb");

        var joule = footPound*1.356
        setJoules(joule.toFixed(1) + " J");

        var pelletDrop = -490.33*((targetDistance/pelletSpeed)**2)
        var scopeDrop1 = ((-490.33*firstZero**2)/pelletSpeed**2)-scopeHeight
        var scopeDrop2 = targetDistance/firstZero
        var scopeDrop = (scopeDrop1*scopeDrop2)+scopeHeight
        var difference = pelletDrop-scopeDrop
        var hold = difference*32.8084/targetDistance

        setHold(hold.toFixed(2) + " MRAD");
    }

    return (
        <View style={styles.root}>
            <Image 
            source={Logo} 
            style={[styles.logo, {height: height * 0.3}]} 
            resizeMode="contain"
            />

            <Text style={[styles.baseText]}>Scope Height (cm)</Text>
            <CustomInput 
            placeholder="Scope Height (cm)" 
            value={scopeHeight} 
            setValue={setScopeHeight}
            />

            <Text style={[styles.baseText]}>Pellet Weight (grains)</Text>
            <CustomInput 
            placeholder="Pellet weight (grains)" 
            value={pelletWeight} 
            setValue={setPelletWeight} 
            />

            <Text style={[styles.baseText]}>Pellet Speed (ft/s)</Text>
            <CustomInput 
            placeholder="Pellet speed (feet/second)" 
            value={pelletSpeed} 
            setValue={setPelletSpeed} 
            />

            <Text style={[styles.baseText]}>First Zero (ft)</Text>
            <CustomInput 
            placeholder="First zero (feet)" 
            value={firstZero} 
            setValue={setFirstZero} 
            />

            <Text style={[styles.baseText]}>Second Zero (ft)</Text>
            <CustomInput 
            placeholder="Second zero (feet)" 
            value={secondZero} 
            setValue={setSecondZero} 
            />

            <Text style={[styles.baseText]}>Target Distance (ft)</Text>
            <CustomInput 
            placeholder="Target Distance (feet)" 
            value={targetDistance} 
            setValue={setTargetDistance} 
            />

            <CustomButton text="Calculate" onPress={onCalcPressed} />

            <Text style={{fontWeight: 'bold'}}>Energy</Text>
            <Text>{ftlb}</Text>
            <Text>{joules}</Text>
            <Text>{hold}</Text>
        </View>
    )
}

I've realized that the problem is that adding and subtracting the variables isn't working as I'd expected (scopeHeight + scopeHeight) returns '55' with a value of 5, rather than 10. Is there any way around this? Any help would be much appreciated!