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 handle¹
• Field selector
• Operator selector²
• Value source selector^{3 4}
• Value editor⁴
• Clone rule button⁵
• Lock rule button⁶
• Remove rule button

---

1. The default styles hide this element if enableDragAndDrop is false, but it is always rendered.↩
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.↩
5. Only rendered if showCloneButtons is true.↩
6. Only rendered if showLockButtons is true.↩