auth-form

On iPad

The same installed source at a regular width. It adapts its layout without a separate design.

Install

With the sweetui tool (brew install mangobyte-dev/tap/sweetui):

sweetui install auth-form --destination Sources/YourFeature/Components

Installs in order: input 0.5.1, button 0.5.2, card 0.2.1, auth-form 0.3.2. Point --destination at a folder inside the consuming target's sources.

Usage

@State private var email = ""
@State private var password = ""
@State private var isSubmitting = false
let formError: LocalizedStringResource? = nil

// Errors derive from state; nil hides the message and clears the invalid style.
var emailError: LocalizedStringResource? {
    email.isEmpty || email.contains("@") ? nil : "Enter a valid email address."
}
var passwordError: LocalizedStringResource? {
    password.isEmpty || password.count >= 8 ? nil : "Use at least 8 characters."
}

AuthForm(
    "Welcome back",
    identity: $email,
    identityError: emailError,
    password: $password,
    passwordError: passwordError,
    formError: formError,
    isSubmitting: isSubmitting,
    secondaryActionTitle: "Forgot password?",
    onSecondaryAction: { },
    onSubmit: { }
)

Accessibility contract

• Fields need accessibilityLabel = title (iOS 27: label+prompt alone shows placeholder, unnamed once typed).
• Focus: identity, password. Next key: identity to password. Return: submits.
• Invalid: not color alone; border increases; footnote under field is accessibility hint.
• Errors post AccessibilityNotification.Announcement on change; unchanged skipped, caller MUST announce same-result; VoiceOver timing unverified.
• Autofill fixed: identity .username (email/username), password .password; verify manually, saved credential.
• isSubmitting: controls disabled, shared opacity; submit spinner, title as label.
• Card title carries header trait.

Details