Underline OTP

// Underline OTP · syxUI · https://syxui.dev/components/inp-otp-underline
// Free in any project. Keep this line and credit syxUI where a person can read it.

import SwiftUI

let inpBlue = Color(red: 0.0, green: 0.47, blue: 1.0)

// Underline OTP field
struct UnderlineOTPField: View {
    let digits = ["4", "2", "9", "", "", ""]
    var body: some View {
        HStack(spacing: 14) {
            ForEach(Array(digits.enumerated()), id: \.offset) { i, d in
                VStack(spacing: 8) {
                    Text(d).font(.system(size: 24, weight: .semibold)).frame(height: 30)
                    Rectangle().fill(i == 3 ? inpBlue : Color.primary.opacity(0.2)).frame(height: i == 3 ? 2.5 : 1.5)
                }.frame(width: 34)
            }
        }.frame(width: 300)
    }
}