Customization

Adapters

Available adapter entrypoints

  • MUI Covers mui/v9, legacy mui/v7, and the MUI-specific merge helper.
  • ANTD Covers antd/v6, legacy antd/v5, and the ANTD-specific merge helper.
  • Fluent UI Covers fluentui/v8 and the Fluent-UI-specific merge helper.
  • Mantine Covers mantine/v9, legacy mantine/v8, and the Mantine-specific merge helper.
  • Bootstrap Covers bootstrap/v5 and the Bootstrap-specific merge helper.
  • Radix Covers radix/v1, Radix Themes provider setup, and the Radix-specific merge helper.

Stylesheet order

  • Load the host-library stylesheet first when the host requires one, then load @vojtechportes/react-query-builder/styles.css exactly once.
  • Load application overrides last. Configure adapter controls through the host theme API and use public query-builder variables for the library's structural surfaces.

What adapters export

  • components A ready-to-pass object that matches IBuilderComponentsProps.
  • Individual mapped components Named exports such as MuiSelect, AntdSelect, BootstrapSelect, MantineSelect, FluentUiSelect, or RadixSelect for partial customization.
  • Adapter merge helpers createMuiComponents, createAntdComponents, createBootstrapComponents, createMantineComponents, createFluentUiComponents, and createRadixComponents merge adapter defaults with local overrides while preserving the nested form mapping.

Relationship to the Components API

  • Adapters are built on top of the same override surface documented in Components.
  • They are a convenience layer, not a separate rendering engine.
  • Each create*Components(base, overrides) helper returns a merged IBuilderComponentsProps object and handles shallow top-level merging plus nested form merging for you.
Documentation
© Vojtěch Václav Porteš 2026 - All library contents are available under the MIT license.
Loading privacy preferences...