Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ability to unmask currency as a float #34

Open
DinsmoreDesign opened this issue Jul 27, 2021 · 6 comments
Open

Ability to unmask currency as a float #34

DinsmoreDesign opened this issue Jul 27, 2021 · 6 comments
Labels
enhancement New feature or request

Comments

@DinsmoreDesign
Copy link

DinsmoreDesign commented Jul 27, 2021

Describe the Feature

Currently, if you type in a value using currency masking, ie:

type="currency"
options={{
    prefix: '$',
    decimalSeparator: '.',
    groupSeparator: ',',
    precision: 2
}}

And type in the input something like "$4,732.55" then try to unmask it through the onChange event:

onChangeText={(text, rawText) => {
  console.log(text) // $4,732.55
  console.log(rawText) // 473255
}}

You get the completely unmasked string, which isn't what I'd think most people would expect. I expect the string returned to be 4732.55, but it looks like the library removes all the separators and prefixes. Right now, I have a function that checks if the length of the value is greater than whatever the precision is and if it is, return the value with the decimal at -${precision}, instead, but I don't really know if returning an unmasked value without the precision included is helpful to anyone and it should probably just be built into the library.

Possible Implementation

Right now I'm taking the unmasked value and running this function on it:

interface IParseCurrency {
    value: string;
    precision?: number;
}

const parseCurrency = ({ value, precision }: IParseCurrency) => {
    const numberVal = Number(value);

    if (!precision || !numberVal) {
        return value;
    }

    const cutoffIndex = value.length - precision;
    const initialSubstring = value.substring(0, cutoffIndex);
    const endingSubstring = value.substring(cutoffIndex, value.length);

    return `${initialSubstring || 0}.${endingSubstring.length < 2 ? '0' + endingSubstring : endingSubstring}`;
};

Which seems to return everything how I'd expect. I assume the library is probably doing the masking with some sort of Regex pattern though, which would be a lot more simple to implement in reverse.

@DinsmoreDesign DinsmoreDesign added the enhancement New feature or request label Jul 27, 2021
@nandorojo
Copy link

Yeah that cannot be the expected behavior at all. Periods should definitely be part of the raw text.

@stonedauwg
Copy link

@DinsmoreDesign will you be implementing this enhancement? I too would like to see this altered

@DinsmoreDesign
Copy link
Author

@DinsmoreDesign will you be implementing this enhancement? I too would like to see this altered

Unfortunately, I'm no longer working on React Native projects. I'm surprised this hasn't been fixed yet, it's been almost 2 years since I posted the issue. I'd suggest using a different library altogether if the package isn't being maintained, or you're welcome to steal my solution if you have to use it.

@akinncar
Copy link
Owner

the library is open source, you can create a PR whenever you want!

@akinncar
Copy link
Owner

akinncar commented May 25, 2023

we also support Issuehunt to budget desired issues from the community, or my GitHub sponsors to get special features requests or reviews/test
if you cannot give your time creating a PR or pay for maintainers contributors to implement it, I understand that the feature is not that important for you, so why would it be for me?

@stonedauwg
Copy link

stonedauwg commented May 25, 2023

the feature is not that important for you, so why would it be for me?

Ouch. Was just asking a question

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

4 participants