Skip to main content
Version: v6

Rule

The Rule component represents query conditions. Rule calls the useRule hook to prepare the subcomponent props.

Subcomponents

Rule renders elements in this order:

  • Drag handle1
  • Field selector
  • Operator selector2
  • Value source selector3 4
  • Value editor4
  • Clone rule button5
  • Lock rule button6
  • Remove rule button

Footnotes

  1. Only rendered if enableDragAndDrop is true.

  2. Only rendered if autoSelectField is true or the rule's field doesn't match translations.fields.placeholderName.

  3. Only rendered if the rule's operator is neither "null" nor "notNull" and the derived valueSources array has more than one element.

  4. Only rendered when (1) the arity property of the rule's operator is not "unary" or < 2, and (2) autoSelectOperator is true or the rule's operator doesn't match translations.operators.placeholderName. 2

  5. Only rendered if showCloneButtons is true.

  6. Only rendered if showLockButtons is true.