renato-bohler / redux-form-input-masks

Input masking with redux-form made easy
https://bohler.dev/redux-form-input-masks/
MIT License
138 stars 10 forks source link

Value of Field in Store Depends on Field Display #55

Open StevenXL opened 6 years ago

StevenXL commented 6 years ago

What are you reporting?

What is the current behavior?

I have the following code:

import { createTextMask } from "redux-form-input-masks";

const ssnMask = createTextMask({
  pattern: "xxx-xx-999",
  maskDefinitions: {
    9: { regExp: /[0-9]/ },
    x: { regExp: /\d/, transform: () => "*" }
  }
});

What I am trying to express is the following: Allow only 9 numbers. Store that in the form's state. When you display it to the user, the first 6 numbers should be asteriks, the rest should not be transformed.

Am I unable to express the idea above in this library? I understand now that the transform property is expressing how to transform the input for storage, not how to transform it for display. However, the documentation reads Also, the value of the Fields in any application should be agnostic of how the Fields themselves are presented to the user.; so it seems from the documentation what I want should be possible. Maybe I am missing a feature that this library provides, but I can't figure it out.

renato-bohler commented 6 years ago

Interesting. I've never thought on this use case. It's definetely on the roadmap now.

Thanks for the feedback!