[PM-16132][16249] Custom hidden field missing color and character count toggle (#13402)

* Add colored characters to custom hidden field

* Add character count toggle to hidden field

* Check correct variable for revealed hidden field

* Merge branch 'main' into vault/pm-16132/custom-hidden-field-missing-color-and-character-count-toggle

* Toggle character count on per field basis

---------

Co-authored-by: Daniel James Smith <djsmith85@users.noreply.github.com>
Co-authored-by: bnagawiecki <107435978+bnagawiecki@users.noreply.github.com>
Co-authored-by: Leslie Tilton <23057410+Banrion@users.noreply.github.com>

libs/vault/src/cipher-view/custom-fields/custom-fields-v2.component.html

@@ -51,6 +51,20 @@
           class="tw-font-mono"
           vaultAutosizeReadOnlyTextArea
         ></textarea>
+        <button
+          *ngIf="canViewPassword && revealedHiddenFields.includes(i)"
+          bitIconButton="bwi-numbered-list"
+          bitSuffix
+          type="button"
+          data-testid="toggle-hidden-field-value-count"
+          [appA11yTitle]="
+            (showHiddenValueCountFields.includes(i) ? 'hideCharacterCount' : 'showCharacterCount')
+              | i18n
+          "
+          [attr.aria-expanded]="showHiddenValueCountFields.includes(i)"
+          appStopClick
+          (click)="toggleCharacterCount(i)"
+        ></button>
         <button
           bitSuffix
           type="button"
@@ -71,6 +85,12 @@
           (click)="logCopyEvent()"
         ></button>
       </bit-form-field>
+      <div
+        *ngIf="showHiddenValueCountFields.includes(i) && revealedHiddenFields.includes(i)"
+        [ngClass]="{ 'tw-mt-3': true, 'tw-mb-2': true }"
+      >
+        <bit-color-password [password]="field.value" [showCount]="true"></bit-color-password>
+      </div>
       <bit-form-control *ngIf="field.type === fieldType.Boolean">
         <input
           bitCheckbox