I’m currently using oh-input-item to have the user enter a password.
Is there a quick means to turn the clear text into stars, eventually with an ‘eye’ icon to switch like we all know this from websites or browsers, actually ?
If you set the type to “password” I think that will give you what you are after. However, how this actually gets rendered will differ from one browser to the next. I’m not sure how deep down it gets implemented (f7? Vue? the browser itself?).
That is correct. The f7 inputs (and therefore the oh inputs as well) give you access to all the standard input types. This includes the password type. To toggle between password visibiliy or not, just toggle the input type between password and text:
uid: pwd
props:
parameterGroups: []
parameters: []
tags: []
component: f7-card
config:
title: =(!!vars.view)?("Password visible"):("Password hidden")
slots:
default:
- component: oh-input
config:
type: =(!!vars.view)?("text"):("password")
variable: pwd
- component: oh-button
config:
iconF7: =(!!vars.view)?("eye_slash"):("eye")
action: variable
actionVariable: view
actionVariableValue: =!vars.view
Thanks both of you, it was as easy as setting type: password, that’s getting me the eye icon switcher even without adding js for that.
Duh, should have found out myself.