https://dashboard.tastevinapp.com/assets/controllers/password_fiel…2f0d5724602d70b87b852e6fb9713c779784f5a3.js

1import { Controller } from "@hotwired/stimulus"
2
3// UI v3 password-field controller. Pairs with shared/ui/_password_field.
4// Three behaviors:
5//   - toggle: flip input type between "password" and "text" so the user can
6//     verify what they JUST typed. Safe because the partial always renders
7//     value="" — the only thing visible in "text" mode is fresh user input.
8//   - clear: flip the sibling hidden `<field>_clear` flag to "1" and visually
9//     mark the stored secret as scheduled for removal. The controller-side
10//     strong-params allowlist (Phase 7) consumes the flag and nils the column.
11//   - storedValue: when true, the partial rendered the "Set" badge + Clear
12//     control; user typing into the input means "overwrite the stored secret".
13export default class extends Controller {
14  static targets = ["input", "toggleButton", "clearFlag", "clearButton", "showIcon", "hideIcon"]
15  static values  = { stored: { type: Boolean, default: false } }
16
17  toggle(event) {
18    if (event) event.preventDefault()
19    if (!this.hasInputTarget) return
20    const showing = this.inputTarget.type === "text"
21    this.inputTarget.type = showing ? "password" : "text"
22    if (this.hasToggleButtonTarget) {
23      this.toggleButtonTarget.setAttribute("aria-pressed", String(!showing))
24    }
25    // Monochrome Phosphor eye / eye-slash swap (#2181): eye while masked,
26    // eye-slash while revealed.
27    if (this.hasShowIconTarget) this.showIconTarget.hidden = !showing
28    if (this.hasHideIconTarget) this.hideIconTarget.hidden = showing
29  }
30
31  clear(event) {
32    if (event) event.preventDefault()
33    if (this.hasClearFlagTarget) this.clearFlagTarget.value = "1"
34    if (this.hasInputTarget) {
35      this.inputTarget.value = ""
36      this.inputTarget.placeholder = ""
37      this.inputTarget.disabled = true
38    }
39    if (this.hasClearButtonTarget) this.clearButtonTarget.disabled = true
40    this.element.classList.add("ui-password-field--clearing")
41    this.element.dispatchEvent(new CustomEvent("password-field:cleared", { bubbles: true }))
42  }
43};