Dismiss of numeric Input not possible

Question

I am using an Input component with "decimal" keyboard. Unfortunately this keyboard has no button to dismiss itself. My workaround is to show an icon on the right side with an appropriate action on it. However, this is of poor usability.

What is the best way to tackle this?

<Input
            ref={purchasePriceInput}
            placeholder="Enter purchase price"
            returnKeyType={'next'}
            keyboardType = 'decimal-pad'
            onChangeText={value => setPurchasePrice(value)}
            label={'Purchase Price'}
            labelStyle={styles.label}
            rightIcon={<Icon
                        name='check'
                        type='font-awesome-5'
                        color='gray'
                        onPress={()=>{purchasePriceInput.current.blur()}}   //<-- my workaround
                      />}
           >
           {purchasePrice.toLocaleString()}
          </Input>

Answer 1

You only need to change returnKeyType="done"

returnKeyType determines how the return key should look.

The following values work across platforms:

• done
• go
• next
• search
• send

These values are just appearance.

So in your case, next works but it looks like a right arrow.