Contributions to react-querybuilder and associated packages are more than welcome!
First contribution? Learn how to contribute to an open source project on GitHub (free course).
This project requires Bun.
- Fork and clone this repository.
- Run
bun installto install dependencies. - Build the packages with
bun run build. - Create a branch for your PR with
git checkout -b your-branch-name.
To serve a hot-module-reloading (HMR) demo page locally, run bun start.
Your IDE should check for TypeScript and lint problems as you code, but to check manually run bun typecheck and/or bun lint.
Testing compatibility packages
Each compatibility package has its own start:*, build:*, and typecheck:* scripts.
| Package | Start script | Build script | Typecheck script |
|---|---|---|---|
| All packages | N/A | bun run build |
bun typecheck |
react-querybuilder |
bun start |
bun build:rqb |
bun typecheck:rqb |
@react-querybuilder/antd |
bun start:antd |
bun build:antd |
bun typecheck:antd |
@react-querybuilder/bootstrap |
bun start:bootstrap |
bun build:bootstrap |
bun typecheck:bootstrap |
@react-querybuilder/bulma |
bun start:bulma |
bun build:bulma |
bun typecheck:bulma |
@react-querybuilder/chakra |
bun start:chakra |
bun build:chakra |
bun typecheck:chakra |
@react-querybuilder/dnd |
bun start:dnd |
bun build:dnd |
bun typecheck:dnd |
@react-querybuilder/fluent |
bun start:fluent |
bun build:fluent |
bun typecheck:fluent |
@react-querybuilder/mantine |
bun start:mantine |
bun build:mantine |
bun typecheck:mantine |
@react-querybuilder/material |
bun start:material |
bun build:material |
bun typecheck:material |
@react-querybuilder/native |
bun start:native |
bun build:native |
bun typecheck:native |
@react-querybuilder/tremor |
bun start:tremor |
bun build:tremor |
bun typecheck:tremor |
To locally serve the documentation website, run bun web. (To skip regeneration of the TypeDoc API docs, run bun web:skiptypedoc.)
The website demo uses the static build of each package and therefore does not support HMR except for the website code itself. To update the website after making changes to one of the packages, run the package's build:* script. The change will be detected and the website will be reloaded automatically.
Before submitting a pull request, please do the following:
- Discuss the change you wish to make by creating a new issue, creating a discussion topic, or chatting with us on Discord.
- Run
bun checkallto make sure CI will run successfully. - If adding a new feature, add corresponding tests (we maintain 100% coverage).
- If changing behavior or adding a feature, update the documentation. You may need to update both the current (aka "next") docs and the latest versioned docs.
- If your editor doesn't automatically format code with Prettier when saving changes, run
bun pretty-print. - When addressing a bug, refer to an existing GitHub issue or provide a reproducible example. Any interactive demo or minimal repository is fine, including CodeSandbox or StackBlitz. You can use the CI base, the basic example (JS version), or any of the other examples as a starter template.
Some files committed to this repository are generated by scripts and should not be modified by hand. If you modify any of the following source files, regenerate the dependent files before committing your changes.
Run bun generate-parsers.
| Source file | Generated file |
|---|---|
| cel.jison | celParser.js |
| sql.jison | sqlParser.js |
Run bun generate-examples.
Sources:
- examples/_template - template example folder
- examples/exampleConfigs.ts - configurations for each example
- examples/generateExamples.ts - script to generate examples from template
Generated folders:
- examples/antd
- examples/basic-ts
- examples/basic
- examples/bootstrap
- examples/bulma
- examples/chakra
- examples/dnd
- examples/fluent
- examples/mantine
- examples/material
(The dependencies and Prettier configs of other examples will be updated, but they will not be completely regenerated like the ones listed above.)