RuleBuilder
Rule Builder

RuleBuilder

Visual editor for a WHEN/THEN rule: a nestable all/any/none condition tree plus the actions it fires.

Props

RuleBuilderProps props
PropTypeDefaultDescription
fieldsRuleField[]—Fields the conditions may test. The first is used for new rows.
actionsRuleActionDef[]—Actions the THEN side may fire. Omit to render conditions only.
valueRule—Controlled rule value.
defaultValueRule—Initial rule when uncontrolled.
onChange(rule: Rule) => void—Called when the rule changes.
maxDepthnumber3Deepest nesting level for groups.
readOnlyboolean—Displays static values instead of editing controls.
headerReactNode—Header slot above WHEN (rule name, enable switch, status tag).
footerReactNode—Footer slot below THEN (Save/Test buttons, validation summary).
labels{ when?: ReactNode; then?: ReactNode }—Custom labels for the WHEN and THEN section headings.

Field & Action definitions

FIELDSTSX
const FIELDS: RuleField[] = [
  {
    key: "request.method",
    label: "Method",
    type: "enum",
    options: [
      { value: "GET", label: "GET" },
      { value: "POST", label: "POST" },
    ],
  },
  {
    key: "request.path",
    label: "Path",
    type: "string",
    placeholder: "/api/users",
  },
  { key: "response.status", label: "Status code", type: "number" },
  { key: "auth.mfa", label: "MFA enabled", type: "bool" },
];
ACTIONSTSX
const ACTIONS: RuleActionDef[] = [
  { type: "allow", label: "Allow", tone: "ok" },
  { type: "block", label: "Block", tone: "danger" },
  {
    type: "rate_limit",
    label: "Rate limit",
    tone: "info",
    params: [
      { key: "requests", label: "Requests", type: "number" },
      { key: "window", label: "Window", type: "text" },
    ],
  },
];

Examples

Interactive rule builder

RuleBuilder

Helper functions

createRule, createGroup, createCondition

Factory functions for building a rule tree programmatically:

FactoriesTSX
import { createRule, createGroup, createCondition } from "@solarius/onset";

// Create a new rule with one blank condition
const rule = createRule(fields);

// Create a group with a combinator
const group = createGroup("any", [createCondition(fields[0])]);

// Create a single condition
const condition = createCondition(fields[0]);

compileRule

Walk the rule tree and emit it as a target language. Reference compilers live in rule-compilers.ts — dslRuleCompiler, typescriptRuleCompiler, and jsonRuleCompiler.

compileRuleTSX
import { compileRule, dslRuleCompiler } from "@solarius/onset";

const dsl = compileRule(rule, dslRuleCompiler, {
  fields: FIELDS,
  actions: ACTIONS,
  name: "access-rule",
});
// "rule access-rule { when { all { request.method is 'POST' } } then { allow } }"

evaluateRule

Run a rule tree against a context object. The semantics match compileRule, so live preview and generated code agree.

evaluateRuleTSX
import { evaluateRule } from "@solarius/onset";

const ctx = {
  request: { method: "POST", path: "/login" },
  auth: { mfa: true },
};

// Evaluate the WHEN-tree (rule.when) against the context
const matches = evaluateRule(rule.when, ctx);
// and count the conditions for display
const total = countConditions(rule.when);