Checkbox

Render a list of checkbox inputs, stored as an array of selected values. Extends Base.

const config = {
  components: {
    Example: {
      fields: {
        decorations: {
          type: "checkbox",
          options: [
            { label: "Underline", value: "underline" },
            { label: "Overline", value: "overline" },
            { label: "Strikethrough", value: "line-through" },
          ],
        },
      },
      defaultProps: {
        decorations: ["underline"],
      },
      render: ({ decorations }) => {
        return (
          <p style={{ textDecorationLine: decorations.join(" ") || "none" }}>
            Hello, world
          </p>
        );
      },
    },
  },
};

Params

Param	Example	Type	Status
`type`	`type: "checkbox"`	”checkbox”	Required
`options`	`options: [{ label: "Option 1", value: "option-1" }]`	Object[]	Required

Required params

`type`

The type of the field. Must be "checkbox" for Checkbox fields.

const config = {
  components: {
    Example: {
      fields: {
        decorations: {
          type: "checkbox",
          options: [
            { label: "Underline", value: "underline" },
            { label: "Overline", value: "overline" },
          ],
        },
      },
      // ...
    },
  },
};

`options`

The options for the checkbox field.

const config = {
  components: {
    Example: {
      fields: {
        decorations: {
          type: "checkbox",
          options: [
            { label: "Underline", value: "underline" },
            { label: "Overline", value: "overline" },
          ],
        },
      },
      // ...
    },
  },
};

Array

Custom