Skip to content

Radio ​

The radio input is very similar to the dropdown especially for simple use-cases.

ts
const Radio = {
    type: "radio",
    value: "test",
    options: [
        {name: "First", value: 33},
        {name: "Another", value: "test"},
        {name: "Something", value: 66},
        {name: "Last", value: "last"}
    ]
}

Radio Basic

A key feature here is that the label does not need to match the value or even be of the same type.

Advanced ​

The radio input itself does not have advanced options, but the individual options do. They can add both a color and description optionally.

ts
const RadioAdvanced = {
    options: [
        {name: "First", value: 33, description: "This is additional info", color: "#ff0000"},
        {name: "Another", value: "test", color: "#00ff00"},
        {name: "Something", value: 66, description: "It does not have to be used on every option", color: "#0000ff"},
        {name: "Last", value: "last", color: "#ffffff"}
    ]
}

Radio Advanced