Subscription Plan Choice with Checkmark

import SwiftUI

struct SubscriptionPlanBanner: View {
    
    @State private var isSelected: Bool = false
    
    let planTitle: String = "Compot Pro Annual Subscription"
    let planPrice: String = "$9.99/year, then $29.99/year"
    let planDescription: String = "Unlock all content and unlimited features."
    
    var body: some View {
            VStack(alignment: .leading, spacing: 4) {
                HStack {
                    Text(planTitle)
                    Spacer()
                    Image(systemName: isSelected ? "checkmark.circle.fill" : "circle")
                        .foregroundStyle(isSelected ? Color.accentColor : Color.gray)
                        .symbolRenderingMode(.multicolor)
                }
                .font(.system(size: 17, weight: .bold))
                Text(planPrice)
                    .font(.system(size: 13, weight: .regular))
                Divider()
                    .padding(.vertical, 4)
                Text(planDescription)
                    .font(.system(size: 13, weight: .regular))
            }
            .padding()
            .frame(maxWidth: .infinity, alignment: .leading)
            .background {
                RoundedRectangle(cornerRadius: 15.0, style: .continuous)
                    .fill(.ultraThinMaterial)
                    .stroke(isSelected ? Color.accentColor : Color.gray, lineWidth: 2.0)
            }
            .onTapGesture {
                isSelected.toggle()
            }
    }
}

#Preview {
    SubscriptionPlanBanner()
}