@react-querybuilder/datetime

Augments react-querybuilder with enhanced date/time functionality.

To see this in action, check out the react-querybuilder demo with the "date/time" option enabled.

Full documentation

Installation

``bash
npm i react-querybuilder @react-querybuilder/datetime


OR yarn add / pnpm add / bun add


`

Usage

To add date/time functionality to formatQuery, import a rule processor from @react-querybuilder/datetime/dayjs, @react-querybuilder/datetime/date-fns, or @react-querybuilder/datetime/luxon—depending on which library you wish to use or are already using—and pass it to the ruleProcessor option.

`ts
import { formatQuery } from 'react-querybuilder';
import {
datetimeRuleProcessorMongoDBQuery,
datetimeRuleProcessorSQL,
} from '@react-querybuilder/datetime/dayjs';

// SQL
formatQuery(query, { preset: 'postgresql', fields, ruleProcessor: datetimeRuleProcessorSQL });

// MongoDB
formatQuery(query, {
format: 'mongodb_query',
fields,
ruleProcessor: datetimeRuleProcessorMongoDBQuery,
});
`

The date/time rule processors will fallback to using the default rule processors if the rule's field configuration does not have a datatype value of "date", "datetime", "datetimeoffset", or "timestamp", or if the operator is specific to string comparisons ("contains", "beginsWith", "endsWith", etc.). You can provide a custom isDateField function to override this behavior through the context` option.