<baht-workflow>

The L2 engine: multi-step wizard with declarative rules (show/hide/skip/compute). Owns Next/Back/Submit.

Two-step wizard

Toggle "company" off → billing step is skipped. Author rules like this in the Builder.

<baht-workflow></baht-workflow>

<script>
  const el = document.querySelector('baht-workflow');
  el.workflow = {
    "workflow_id": "signup",
    "forms": [
      {
        "form_id": "account",
        "form_name": "account",
        "order": 1,
        "fields": [
          {
            "order": 1,
            "type": "text",
            "key": "email",
            "label": "Email",
            "required": true,
            "value": ""
          },
          {
            "order": 2,
            "type": "toggle",
            "key": "company",
            "label": "Signing up as a company",
            "value": false
          }
        ]
      },
      {
        "form_id": "billing",
        "form_name": "billing",
        "order": 2,
        "fields": [
          {
            "order": 1,
            "type": "text",
            "key": "taxId",
            "label": "Tax ID",
            "value": ""
          }
        ]
      }
    ],
    "rules": [
      {
        "id": "skip-billing",
        "when": {
          "field": "account.company",
          "op": "eq",
          "value": false
        },
        "then": [
          {
            "action": "skipForm",
            "target": {
              "form": "billing"
            }
          }
        ]
      }
    ]
  };
</script>

Props

Name	Type	Default	Description
`workflow`JS	`WorkflowDefinition`	`—`	{ workflow_id, forms[], rules[] }
`value`JS	`NestedData`	`{}`	Nested per-form data
`registry`JS	`Registry`	`{}`	Formatters / validators / rules
`validate-gate`	`boolean`	`true`	Block Next while invalid
`next-label`	`string \| undefined`	`'Next'`	Next button text
`submit-label`	`string \| undefined`	`'Submit'`	Submit button text
`back-label`	`string \| undefined`	`'Back'`	Back button text
`show-back`	`boolean`	`true`	Show Back button
`flags`JS	`FeatureFlags`	`{}`	Feature-flag values (spec 01 §12): flag-off steps/fields/rules vanish.
`show-steps`	`boolean`	`false`	Render a <baht-steps> progress indicator above the current form.
`steps-variant`	`'default' \| 'sidebar'`	`'default'`	'default' horizontal markers, or 'sidebar' vertical nav list — forwarded to <baht-steps>.
`currentFormName`JS	`string \| null`	`—`

Events

Event	detail	Description
`name`	CustomEvent
`baht-next`	`{ form_name, order, valid, errors[], data }`	Next pressed
`baht-submit`	`{ valid, errors[], data }`	Submit pressed
`baht-complete`	`{ data }`	Workflow finished
`baht-data-change`	`{ data }`	Any data changed
`baht-step-change`	`{ form_name, order, direction }`	Step navigation