<Logic>

Start of documentation content

A <Logic> can be used to optionally display their children. See the 'Logic Rules' section for more.

Use of <Logic>

<Logic rules={[]}>[any nodes to conditonally display]</Logic>

Logic rules

<Page>s and <Logic> can have rules, which is an array of conditional rules.

[
  {
    type: 'ConditionalRule',
    target: { type: 'TargetByField', id: 'stable-field-id' },
    comparison: '=',
    matchesValue: 'chosen value',
  },
  {
    type: 'ConditionalRule',
    target: { type: 'TargetByField', id: 'stable-field-id2' },
    comparison: '=',
    matchesValue: 'chosen value',
  },
]

In the array of rules all logic rules must match for a condition to be true.

<Logic>'s props

PropAboutType
hideInAnswerSummary

Whether to hide any answers below this.

boolean
rules

An array of Conditional Rules.

All rules need to pass for the condition to be valid.

E.g.

[
  {
   type: 'ConditionalRule',
   target: { type: 'TargetByField', id: 'cat-or-dog' },
   comparison: '=',
   matchesValue: 'Dogs',
  },
  {
   type: 'ConditionalRule',
   target: { type: 'TargetByField', id: 'animal-name' },
   comparison: '=',
   matchesValue: 'tama',
  },
]
ConditionalRule[]
id

Component Id.

Must be unique within the form.

string
meta

Arbitrary metadata on this node.

This is useful when developing custom controls as it allows you to pass down metadata/extensions.

string
childrenById

Used to indicate children ids of this component.

If used in React this is non-editable.

string[]
hasChildrenById

Non-editable.

Used to indicate that this component can have children.

true
hasTagsById

Non-editable.

Used to indicate that this component isn't a form field with tags by id.

false
isFormField

Non-editable.

Used to indicate that this component isn't a form field.

false
isMultichoice

Non-editable.

Used to indicate that this component isn't a multichoice form field like <Select>, <Radios> or <Checkboxes>.

false
type

Non-editable.

Type of component of "Logic".

"Logic"