Docs
API Reference
Radio

Radio

Render a radio input with a list of options. Extends Base.

Interactive Demo
Example

Hello, world

const config = {
  components: {
    Example: {
      fields: {
        textAlign: {
          type: "radio",
          options: [
            { label: "Left", value: "left" },
            { label: "Right", value: "right" },
          ],
        },
      },
      defaultProps: {
        textAlign: "left",
      },
      render: ({ textAlign }) => {
        return <p style={{ textAlign }}>Hello, world</p>;
      },
    },
  },
};

Params

ParamExampleTypeStatus
typetype: "radio""radio"Required
optionsoptions: [{ label: "Option 1", value: "option-1" }]Object[]Required

Required params

type

The type of the field. Must be "radio" for Array fields.

const config = {
  components: {
    Example: {
      fields: {
        textAlign: {
          type: "radio",
          options: [
            { label: "Left", value: "left" },
            { label: "Right", value: "right" },
          ],
        },
      },
      // ...
    },
  },
};

options

The options for the radio field. The value can be a String, Number or Boolean.

const config = {
  components: {
    Example: {
      fields: {
        textAlign: {
          type: "radio",
          options: [
            { label: "Left", value: "left" },
            { label: "Right", value: "right" },
          ],
        },
      },
      // ...
    },
  },
};