Password Unmask Button

Password unmask button component

HTML

<p>
    Password unmask button is a component that displays Mask or Unmask button SVG depending on unmask binding value.
    Also notice the invUnmask directive in password input field. The directive changes input type to mask/unmask password.
</p>
<div ng-controller="passwordUnmaskButtonExampleController as $ctrl">
    <ng-form class="c-form c-generalForm" autocomplete="off">
        <fieldset class="c-fieldset">
            <div class="c-fieldset-item">
                <label>Password</label>
                <div class="u-flex u-flexMiddle">
                    <input type="password"
                        inv-unmask="$ctrl.unmask"
                        ng-model="$ctrl.password"
                        name="password">
                    <password-unmask-button 
                        class="u-ml+"
                        unmask="$ctrl.unmask"
                        ng-click="$ctrl.unmask=!$ctrl.unmask">
                    </password-unmask-button>
                </div>
            </div>
        </fieldset>
    </ng-form>
</div>