Controls

.controlSize(size: "mini" | "small" | "regular" | "large" | "extraLarge")

ProgressView()
    .controlSize("small")

VStack([
    Button("Submit", () => submit()),
    ProgressView({ value: 0.5 })
])
    .controlSize("large")

ProgressView()
    .controlSize("mini")

.pickerStyle(style: PickerStyle): Component

const body = () => {
    const [size, setSize] = useState("m")
    return Picker("Size", { value: size, setValue: setSize }, [
        Text("S").tag("s"),
        Text("M").tag("m"),
        Text("L").tag("l"),
    ]).pickerStyle("segmented")
}

const body = () => {
    const [selection, setSelection] = useState("a")
    return Picker("Option", { value: selection, setValue: setSelection }, [
        Text("Alpha").tag("a"),
        Text("Beta").tag("b"),
        Text("Gamma").tag("g"),
    ]).pickerStyle("wheel")
}

const body = () => {
    const [color, setColor] = useState("red")
    return Picker("Color", { value: color, setValue: setColor }, [
        Text("Red").tag("red"),
        Text("Green").tag("green"),
        Text("Blue").tag("blue"),
    ]).pickerStyle("menu")
}

.buttonStyle(style: ButtonStyleComponent)

Button("Tap me", () => handleTap())
    .buttonStyle(
        defineButtonStyle((config) =>
            Text(config.label)
                .padding(12)
                .background(
                    config.isPressed
                        ? Color("gray")
                        : Color("blue")
                )
                .foregroundStyle(Color("white"))
                .cornerRadius(8)
        )
    )