CngxSensitiveValue

Masks a sensitive field with reveal-on-demand and a compliance audit hook.

Place on the <input>. Masked by default (type="password", the browser's native dot rendering), it exposes revealed() / toggle() / show() / hide() for a consumer-owned reveal button, announces every reveal/hide through the shared live region, and emits audit on each toggle so compliance logging captures who unmasked the field and when. The audit hook is a plain output(), not async state.

Masking uses the platform password rendering (a •-style dot); a custom mask glyph would require reimplementing the input's edit model and is out of scope.

<input cngxInput cngxSensitiveValue #sv="cngxSensitiveValue" (audit)="log($event)" />
<button type="button" (click)="sv.toggle()"
  [attr.aria-label]="sv.revealed() ? 'Hide value' : 'Reveal value'">
  {{ sv.revealed() ? 'Hide' : 'Reveal' }}
</button>

https://cngxjs.github.io/cngx/examples/#/forms/input/sensitive-value