<div id="div_id_password" class="field-wrapper mb-3">
<label for="id_password" class="label-class block text-gray-900 text-sm mb-2">
Password<span class="asteriskField">*</span>
</label>
<div
data-controller="password-strength password-visibility"
>
<div class="relative">
<input
data-password-visibility-target="input"
type="password"
name="password"
data-action="keyup->password-strength#estimateStrength" class=" bg-white focus:outline-none border border-gray-300 rounded-lg py-2 px-4 block w-full appearance-none leading-normal text-gray-700" required id="id_password"
>
<button type="button" data-action="password-visibility#toggle" class="flex absolute inset-y-0 right-0 items-center pr-3 text-gray-500 cursor-pointer">
<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" width="24" height="24" class="w-6 h-6" data-password-visibility-target="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
</svg>
<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" width="24" height="24" class="hidden w-6 h-6" data-password-visibility-target="icon">
<path stroke-linecap="round" stroke-linejoin="round" d="M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88" />
</svg>
</button>
</div>
<div>
<span data-password-strength-target="strengthIndicator" class="hidden mt-1 text-xs text-red-600"></span>
</div>
</div>
</div>def password(self, **kwargs):
class TestForm(forms.Form):
password = forms.CharField(
widget=HammerPasswordWidget(
attrs={"data-action": "keyup->password-strength#estimateStrength"},
),
)
form = TestForm()
template = Template(
"""
{% load formify %}
{% render_field form.password %}
""",
)
return template.render(Context({"form": form}))