Skip to content

USAGE.md

Latest commit

 

History

History
88 lines (60 loc) · 3.02 KB

USAGE.md

File metadata and controls

88 lines (60 loc) · 3.02 KB

Usage

Table of contents

Basic usage

Use the PasswordType from the bundle in your form builders:

use Nowo\PasswordToggleBundle\Form\Type\PasswordType;

$builder->add('password', PasswordType::class);

With options

Override any default (from config) per field:

$builder->add('password', PasswordType::class, [
    'toggle' => true,
    'visible_icon' => 'tabler:eye-off',
    'hidden_icon' => 'tabler:eye',
    'visible_label' => 'Show',
    'hidden_label' => 'Hide',
    'button_classes' => ['input-group-text', 'cursor-pointer'],
    'toggle_container_classes' => ['form-password-toggle'],
]);

Disabling the toggle

For a specific field, render a simple password input without the toggle button:

$builder->add('password', PasswordType::class, [
    'toggle' => false,
]);

When toggle is false, the field renders as a standard password input, compatible with any styling or JavaScript framework.

Styling

  • Option 1: Include the bundle CSS:
    <link rel="stylesheet" href="{{ asset('bundles/nowopasswordtoggle/css/toggle_password.css') }}">
  • Option 2: Import the SCSS in your build (Webpack Encore, Vite, etc.):
    @import '@nowo-tech/password-toggle-bundle/src/Resources/public/css/toggle_password.scss';
  • Option 3: Style the classes yourself: .input-group-text.cursor-pointer, .form-password-toggle, etc.

See the main README for more styling details.

Overriding bundle templates

The bundle registers its Twig views so that @NowoPasswordToggleBundle/... works, and it adds its view path after the application paths. Your overrides in templates/bundles/NowoPasswordToggleBundle/ are therefore checked first.

Using the bundle's form theme: add the bundle's widget to your form themes (e.g. in config/packages/twig.yaml):

twig:
  form_themes:
    - '@NowoPasswordToggleBundle/Form/toggle_password_widget.html.twig'

To override: create a file under templates/bundles/NowoPasswordToggleBundle/ with the same relative path as in the bundle; Twig will use your copy instead of the bundle's.

Example: to override the password toggle widget, create templates/bundles/NowoPasswordToggleBundle/Form/toggle_password_widget.html.twig. You can copy the original from vendor/nowo-tech/password-toggle-bundle/src/Resources/views/Form/toggle_password_widget.html.twig and adjust as needed.

Templates you can override:

Path (relative to Resources/views/) Purpose
Form/toggle_password_widget.html.twig Form widget for the password field with visibility toggle.

After adding or changing overrides, clear the Twig cache if needed: php bin/console cache:clear.

See also