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

[Feature Request] Show trailing character(s) of mask #42

Open
theianjohnson opened this issue Dec 12, 2024 · 2 comments
Open

[Feature Request] Show trailing character(s) of mask #42

theianjohnson opened this issue Dec 12, 2024 · 2 comments

Comments

@theianjohnson
Copy link

Example, given the mask

<InputMask mask="(___) ___-____" replacement={{ _: /\d/ }} />;

Currently if the user has entered "123" the displayed value will be "(123" and if the user thinks they need to type the trailing ")" they won't be able to

Ideally any following mask character(s) would be added, so if the user has entered "123" the displayed value would be "(123) " and the user would know they could continue entering numbers

Alternatively allowing the user to enter the mask characters literally would also solve this problem, though less elegantly in my opinion

@GoncharukBro
Copy link
Collaborator

The use of the mask was provided in such a way that the cursor position is set only after the character entered by the user, in your example these are numbers. This
approach is aimed at the unhindered deletion of characters using «backspace».

We will consider the possibility of entering mask characters, thanks for the suggestion.

@theianjohnson
Copy link
Author

The preferred solution wouldn't require them entering mask characters, it'd be -

  1. Leading mask character(s) would be automatically added, so if the user has entered "123" the displayed value would be "(123) " and the user would know they could continue entering numbers

If the input contained "(123) " and they hit backspace it would remove all mask characters +1 entered character, ie the input would then contain "(12" as expected

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

No branches or pull requests

2 participants