Parsing and Formatting

Supported Formats

Supported formats and their primary use cases.

SQL

Formatting and predicate parsing for builder-compatible SQL expressions.

SQL formatter

import { formatQuery } from '@vojtechportes/react-query-builder/formatQuery';

const sql = formatQuery(data, 'SQL', {
  fields,
  wrapWhereClause: true,
});

// WHERE (CUSTOMER_COUNTRY = 'CZ' AND ORDER_TOTAL BETWEEN 1000 AND 5000)

Parsing scope

SQL support is aimed at builder-compatible predicates. It is not meant to be a full SQL parser for arbitrary queries with joins, projections, or nested subqueries.

Mongo

Formatting returns a serialized JSON filter document. Parsing expects a JSON object string and can infer fields from the document shape.

Mongo formatter

const mongo = formatQuery(data, 'Mongo');
// { "$and": [ ... ] }

Field inference

Mongo parsing can infer field names and basic types from the filter document.

AQL

ArangoDB-style filter expressions with optional filter-clause wrapping and configurable variable names.

JSONata and JsonLogic

JSON-oriented expression formats for rules evaluated against object-shaped data.

CEL and SpEL

Expression languages used in application and policy evaluation environments.

Prisma and Django

Framework-oriented filter output for backend query layers.

OData, RSQL, Dynamo, and Elasticsearch

API and datastore integrations with format-specific output conventions.

Advanced: Field-To-Field Comparisons

Most formats on this page can be explored with ordinary literal-based rules. If you specifically need one field to compare against another, start with Field Comparisons and then use the native field-reference support only in formats that have a direct right-hand-side field form.

Supported native field-to-field formats in this feature are SQL, Mongo, AQL, JSONata, JsonLogic, CEL, SpEL, Prisma, OData, Dynamo, and Django.
String-style field references are also supported where the target format has a native form for them, such as contains, startsWith, and endsWith in CEL, OData, Django, and SpEL.
Elasticsearch and RSQL intentionally reject field comparisons because supporting them would require invented syntax or non-native backend semantics.

Formatting a field comparison

import { type DenormalizedQuery } from '@vojtechportes/react-query-builder';
import { formatQuery } from '@vojtechportes/react-query-builder/formatQuery';

const data: DenormalizedQuery = [
  {
    type: 'GROUP',
    value: 'AND',
    isNegated: false,
    children: [
      {
        field: 'ORDER_TOTAL',
        operator: 'LARGER_EQUAL',
        valueSource: 'field',
        valueField: 'ORDER_APPROVAL_LIMIT',
      },
    ],
  },
];

const sql = formatQuery(data, 'SQL', {
  fields,
  wrapWhereClause: true,
});

// WHERE ORDER_TOTAL >= ORDER_APPROVAL_LIMIT

Parsing a field comparison

import { parseQuery } from '@vojtechportes/react-query-builder/parseQuery';

const result = parseQuery(
  'WHERE ORDER_TOTAL >= ORDER_APPROVAL_LIMIT',
  'SQL'
);

console.log(result.data[0]);
// {
//   type: 'GROUP',
//   value: 'AND',
//   isNegated: false,
//   children: [
//     {
//       field: 'ORDER_TOTAL',
//       operator: 'LARGER_EQUAL',
//       valueSource: 'field',
//       valueField: 'ORDER_APPROVAL_LIMIT',
//     },
//   ],
// }

API reference

formatQuery and parseQuery.