<baht-rule-builder>

Edits a workflow’s rules without code: when all / any of field is value conditions hold, then show, hide, make mandatory / optional / read-only, set a value, or skip an approval step. Emits baht-change with { rules }; a rule it cannot represent is kept untouched.

Basic

HTMLReactAngular

Copy

<baht-rule-builder></baht-rule-builder>

<script>
  const el = document.querySelector('baht-rule-builder');
  el.workflow = {
    "workflow_id": "demo",
    "forms": [
      {
        "form_id": "r",
        "form_name": "Request",
        "order": 1,
        "fields": [
          {
            "key": "type",
            "type": "text",
            "label": "Type",
            "order": 1
          }
        ]
      },
      {
        "form_id": "m",
        "form_name": "Manager",
        "order": 2,
        "kind": "approval",
        "fields": []
      }
    ],
    "rules": [
      {
        "id": "standard-skips-manager",
        "when": {
          "field": "Request.type",
          "op": "eq",
          "value": "Standard"
        },
        "then": [
          {
            "action": "skipForm",
            "target": {
              "form": "Manager"
            }
          }
        ]
      }
    ]
  };
</script>

Props

Name	Type	Default	Description
workflowJS	WorkflowDefinition | null	null	The workflow whose fields, steps and rules it edits