@velas/react-native-input-currency-amount

react-native-input-currency-amount

React native text input for entering cryptocurrency amount in format "1,000,000.0000"

There are 3 components:

1. InputAmount value/onChangeText props will accept/pass string
2. InputAmountFraction value/onChangeValue props will accept/pass Fraction
3. InputCurrencyAmount value/onChangeValue props will accept/pass CurrencyAmount

Fraction and CurrencyAmount implementations should be compatible with uniswap's implementation. Uniswap forks should also work fine. You will need to implement IFractionType, IFraction, ICurrencyAmount interfaces if you need to support custom types. Please feel free to open issue/PR if you encounter problem with any version or fork of Uniswap.

All these components accepts additional props and pass them to underline TextInput component.

Installation

npm:

npm install @velas/react-native-input-currency-amount

yarn:

yarn add @velas/react-native-input-currency-amount

Usage

    <Text>Text input amount</Text>
    {/* value is string */}
    <InputAmount value={value} onChangeText={setValue} maxFractionLength={2} />

    <Text>Text input amount fraction (Pancake's fraction)</Text>
    {/* valueFraction is of type Fraction. For example, https://github.com/Uniswap/sdk-core/blob/main/src/entities/fractions/fraction.ts or https://github.com/pancakeswap/pancake-swap-sdk/blob/master/src/entities/fractions/fraction.ts. */}
    <InputAmountFraction
        value={valueFraction}
        onChangeValue={setValueFraction}
        fractionType={Fraction}
        maxFractionLength={10}
    />

    <Text>Text input currency amount (Pancake's fraction)</Text>
    {/* valueCurrencyAmount is of any type that implements ICurrencyAmount interface. Basic Uniswap's  CurrencyAmount already implements it. */}
    <InputCurrencyAmount
        value={valueCurrencyAmount}
        onChangeValue={setValueCurrencyAmount}
        currencyAmountCreator={(str) => new SomeCurrencyAmount(str)}
        decimals={SomeCurrency.decimals}
    />

See example project

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

---