Components

multicheckbox

A group of independent checkboxes. Use when the user may select one or more options from a fixed, always-visible list.

Read Form Rules before using this component — keys, labels, required fields, expressions, visibility, and validation all follow shared conventions.

When to use

Selecting multiple service categories, infrastructure types, or attributes
Multi-item declarations where the user confirms each item
Any "select all that apply" question with a short, fixed list

When NOT to use

Instead of `multicheckbox`, use…	For…
`checkbox`	A single opt-in / opt-out toggle
`radio`	Picking exactly one option from 2–5 alternatives
`customdropdown`	Choosing one or a few options from a long list

Props

Prop	Type	Required?	Description
`label`	`string`	required	Visible label. Title Case for nouns, Sentence case for questions. Must be unique across the form.
`required`	`boolean`	required	Always `false`. The expression controls the runtime value — never set this to `true` directly.
`defaultRequired`	`boolean`	required	`true` for required fields, `false` for optional ones. This is the value the expression reads.
`options`	`array`	required	Array of `{ label, value }` objects. `label` is shown; `value` is stored in the model. Values must be unique.
`type`	`string`	optional	Set to `"array"` so selected values are stored as an array (recommended).
`formCheck`	`string`	optional	Layout style. Always `"default"`.
`hideLabel`	`boolean`	optional	Suppress the outer label wrapper. Useful for self-declaration groups where the option labels are the full statements.
`tooltip`	`string`	optional	Short help text shown as an icon tooltip next to the label.
`hint`	`string`	optional	Subtle help text rendered below the field, always visible.
`hideField`	`boolean`	optional	Hides the field and excludes its value from submission. Use `expressions["props.hideField"]` to toggle. Do not use `hide` directly.

The required mechanism

Every multicheckbox field must include this exact expression, regardless of whether the field is required or optional. Never omit it, never change it.

"expressions": {
  "props.required": "!(field?.props?.hideField || field?.hide) && field?.props?.defaultRequired"
}

The expression reads defaultRequired and automatically becomes false when the field is hidden — preventing hidden fields from blocking form submission.

To make a field required: set defaultRequired: true.
To make a field optional: set defaultRequired: false.

Examples

Required multi-select list

{
  "key": "SERVICES_REQUESTED",
  "type": "multicheckbox",
  "props": {
    "type": "array",
    "label": "Services Requested",
    "required": false,
    "defaultRequired": true,
    "options": [
      { "label": "Construction", "value": "CONSTRUCTION" },
      { "label": "Electrical", "value": "ELECTRICAL" },
      { "label": "Plumbing", "value": "PLUMBING" }
    ]
  },
  "expressions": {
    "props.required": "!(field?.props?.hideField || field?.hide) && field?.props?.defaultRequired"
  },
  "validation": {
    "messages": {
      "required": "Please select at least one service."
    }
  }
}

Self-declaration group

{
  "key": "SELF_DECLARATION_OF_CONFORMITY",
  "type": "multicheckbox",
  "props": {
    "type": "array",
    "label": "Self-Declaration of Conformity",
    "required": false,
    "defaultRequired": true,
    "formCheck": "default",
    "hideLabel": true,
    "options": [
      {
        "label": "I declare that all information provided is correct",
        "value": "I declare that all information provided is correct"
      },
      {
        "label": "I understand that false declarations may lead to penalties",
        "value": "I understand that false declarations may lead to penalties"
      }
    ]
  },
  "expressions": {
    "props.required": "!(field?.props?.hideField || field?.hide) && field?.props?.defaultRequired"
  },
  "validation": {
    "messages": {
      "required": "This field is required."
    }
  }
}

Optional multi-select

{
  "key": "PREFERRED_NOTIFICATION_CHANNELS",
  "type": "multicheckbox",
  "props": {
    "type": "array",
    "label": "Preferred Notification Channels",
    "required": false,
    "defaultRequired": false,
    "options": [
      { "label": "Email", "value": "EMAIL" },
      { "label": "SMS", "value": "SMS" }
    ]
  },
  "expressions": {
    "props.required": "!(field?.props?.hideField || field?.hide) && field?.props?.defaultRequired"
  }
}

Checklist

input

Single-line text field. Use for free-text answers where the user types a value directly.

radio

A group of mutually exclusive radio buttons. Use when the user must pick exactly one option from a small, always-visible list.

multicheckbox

On this page