presseportale/resources/views/components/password-input.blade.php
Kevin Adametz 9fadfe6458 5.5: <x-password-input> + 6 Auth-Passwortfelder umgestellt
Self-contained Alpine-Toggle (Anzeigen/Verbergen) pro Feld; Props name/label/
autocomplete/placeholder/required/autofocus/show-error, id default auth-<name>,
Slot :labelAction fuer den 'Passwort vergessen?'-Link (login). Ersetzt die
field-pw-wrap-Bloecke in login, register (2), reset-password (2), confirm-
password (1). Die nun ungenutzten form-level x-data={showPassword...} entfernt.

Nebeneffekt/Bugfix: register+reset nutzten :placeholder="__(...)" auf rohem
<input> -> wurde als Alpine-Bind woertlich ausgegeben und schlug fehl (leerer
Platzhalter). Als Component-Prop wird __() korrekt in PHP aufgeloest, der
Hinweistext (z. B. 'Mindestens 8 Zeichen') erscheint jetzt.

Bestaetigungsfelder ohne Fehleranzeige (show-error=false, wie zuvor).
116 Auth-Tests gruen, alle Views kompilieren.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-02 09:04:26 +00:00

72 lines
2.2 KiB
PHP

@props([
/** Feldname: wire:model-Ziel + @error-Key (z. B. 'password', 'password_confirmation') */
'name',
/** Label-Text (bereits übersetzt) */
'label',
/** DOM-id; Standard: auth-<name mit Bindestrichen> */
'id' => null,
/** autocomplete-Hinweis (current-password | new-password) */
'autocomplete' => 'current-password',
/** Platzhalter im Feld */
'placeholder' => '••••••••••',
/** Pflichtfeld */
'required' => true,
/** Autofokus setzen (z. B. Passwort-Bestätigungsseite) */
'autofocus' => false,
/** aria-invalid + Fehlermeldung anzeigen (bei Bestätigungsfeldern aus) */
'showError' => true,
])
@php
$id ??= 'auth-'.str_replace('_', '-', $name);
@endphp
{{--
Passwort-Feld mit Anzeigen/Verbergen-Umschalter (self-contained Alpine).
Optionaler Slot :labelAction für Zusatzlink in der Label-Zeile (z. B.
„Passwort vergessen?"). Ersetzt die kopierten field-pw-wrap-Blöcke der
Auth-Seiten.
--}}
<div x-data="{ show: false }">
@isset($labelAction)
<div class="flex items-baseline justify-between mb-1.5">
<label class="field-label !mb-0" for="{{ $id }}">{{ $label }}</label>
{{ $labelAction }}
</div>
@else
<label class="field-label" for="{{ $id }}">{{ $label }}</label>
@endisset
<div class="field-pw-wrap">
<input
id="{{ $id }}"
wire:model="{{ $name }}"
:type="show ? 'text' : 'password'"
autocomplete="{{ $autocomplete }}"
@if ($required) required @endif
@if ($autofocus) autofocus @endif
class="field-input pr-[72px]"
placeholder="{{ $placeholder }}"
@if ($showError) @error($name) aria-invalid="true" @enderror @endif
/>
<button
type="button"
class="field-affix"
@click="show = !show"
x-text="show ? '{{ __('Verbergen') }}' : '{{ __('Anzeigen') }}'"
>{{ __('Anzeigen') }}</button>
</div>
@if ($showError)
@error($name)
<p class="field-error">{{ $message }}</p>
@enderror
@endif
</div>