Input: A method for obscuring sensitive data by default with user reveal method

[PilotBob]

Is your feature request related to a problem or use case? Please describe.
Per our internal security department, sensitive PII data should be obscured rather than openly display on web pages. Some examples of this date are social security numbers, bank account numbers, drivers license numbers. etc.

Describe the solution you'd like
The recommendation is displaying these with a * similar to password type and allow a way for the user to view the data,,, either by hovering the mouse over the field, an icon for temp reveal, or clicking an icon for permanent reveal while the page is still loaded.

This should ideally support both inputs and display areas like spans/etc.

Describe alternatives you've considered
Implementing this field by field is possible. But, a feature built-into the framework would prevent duplication.

Additional context
Add any other context or screenshots about the feature request here.
And what application do you work on? [e.g. {Infor XYZ}]

[tmcconechy]

Similar patterns might be...

• seen sometimes is an input with an eye to "show password"
• instead of *** do we hide it with something else visually on the field like "Hidden text" or a "redacted" strike through

Can you get design to take a look at this @inforandy ?

[PilotBob]

@tmcconechy Any ETA on this?

[tmcconechy]

Going to slot it in for next sprint and see if some designers can be wrangled. I think its a quick design question? I think we should just put an icon in the field at the far left (right on RTL) that you press down to show the password.

Problem is we do not have a suitable icon i can think of (reveal/show?). What about a text/hide show button. Thinking something like this...

What do you think @kevinwhitedesign @inforandy ?
Or course with our text/input styles. Some more ideas here https://www.lukew.com/ff/entry.asp?1941

[tmcconechy]

Lets implement this as:

• new password component
• localize strings
• toggle type when clicked
• review with design when done

[jbrcna]

QA Passed
could also be toggled by pressing CTRL + R
v4.34.0-dev
https://master-enterprise.demo.design.infor.com/components/input/example-password.html

https://master-enterprise.demo.design.infor.com/components/input/example-password.html?locale=es-ES
https://master-enterprise.demo.design.infor.com/components/input/example-password.html?locale=ar-SA