Open
Description
Describe the bug
I am using the Password component with the following configuration:
<Password value={value} onChange={(e) => setValue(e.target.value)} toggleMask className={'w-full'} />1. Expected Behavior: The password input field should expand to the full width of its container due to the className={'w-full'} property.
2. Actual Behavior: The input field does not take up the full width of its container as expected. Here is the visual output:
3. Additional Feature Requests:
• Custom Classes for Icons: I would like the ability to assign custom CSS classes to the “show” and “hide” icons used for toggling the password mask.
• Callback for Icon Clicks: It would be helpful if clicking the toggle mask icons could trigger a callback function, allowing developers to execute custom logic.
Please let me know if further clarification or a reproducible repository is required. Thank you for your support!
Reproducer
No response
System Information
System:
OS: macOS 15.2 (24C101)
Chip: Apple M4 Pro
Binaries:
Node: 22.12.0
yarn: 4.5.3
Browsers:
Brave: Version 1.74.48 Chromium: 132.0.6834.83 (Official Build) (arm64)
npmPackages:
primereact: 10.9.1
react: 19.0.0
tailwindcss: 3.4.17Steps to reproduce the behavior
No response
Expected behavior
No response