Sesame-iOS/Sesame-Watch Watch App/Settings/SettingsNumberInputView.swift

import SwiftUI

struct SettingsNumberInputView<Value>: View where Value: FixedWidthInteger {

    let title: String

    @Binding
    var value: Value

    @State
    private var text: String = ""

    let footnote: String

    var body: some View {
        VStack(alignment: .leading) {
            TextField(title, text: $text)
                .onSubmit {
                    guard let newValue = Value(text) else {
                        return
                    }
                    value = newValue
                }
                .foregroundColor(.accentColor)
            Text(footnote)
                .font(.footnote)
                .foregroundColor(.secondary)
            Spacer()
        }
        .navigationTitle(title)
        .navigationBarBackButtonHidden(false)
        .onAppear {
            text = "\(value)"
        }
    }
}

struct SettingsNumberInputView_Previews: PreviewProvider {
    static var previews: some View {
        SettingsNumberInputView(
            title: "Title",
            value: .constant(0),
            footnote: "Some more text explaining the purpose of the text field.")
    }
}