Skip to main content

@react-querybuilder/dnd

Components

FunctionDescription
InlineCombinatorDnDThe drag-and-drop-enabled inline combinator component.
QueryBuilderDnDContext provider to enable drag-and-drop. If the application already implements react-dnd, use QueryBuilderDndWithoutProvider instead.
QueryBuilderDndWithoutProviderContext provider to enable drag-and-drop. Only use this provider if the application already implements react-dnd, otherwise use QueryBuilderDnD.
RuleDnDRule component for drag-and-drop. Renders the provided rule component (Rule by default), but forwards the drag-and-drop context.
RuleGroupDnDRule group component for drag-and-drop. Renders the provided rule group component (RuleGroup by default), but forwards the drag-and-drop context so that child rules and groups will render within the appropriate drag-and-drop wrappers.

Props

NameDescription
QueryBuilderDndContextPropsQueryBuilderDndContext props.
QueryBuilderDndPropsQueryBuilderDnD props.
DndPropType of the dnd prop on QueryBuilderDnD/QueryBuilderDndWithoutProvider when passing raw react-dnd exports (legacy API).

UseInlineCombinatorDnDResult

Renames and re-exports AdapterUseInlineCombinatorDnDResult


UseRuleDnDResult

Renames and re-exports AdapterUseRuleDnDResult


UseRuleGroupDnDResult

Renames and re-exports AdapterUseRuleGroupDnDResult


Functions

FunctionDescription
isDndAdapterType guard to check if a value is a DndAdapter.

Interfaces

InterfaceDescription
AdapterUseInlineCombinatorDnDResultReturn type for the adapter's useInlineCombinatorDnD hook.
AdapterUseRuleDnDResultReturn type for the adapter's useRuleDnD hook. Matches the existing UseRuleDnD interface from react-querybuilder.
AdapterUseRuleGroupDnDResultReturn type for the adapter's useRuleGroupDnD hook. Matches the existing UseRuleGroupDnD interface from react-querybuilder.
CustomCanDropParamsParameters passed to custom canDrop functions.
DndAdapterInlineCombinatorDnDParamsParameters for the adapter's useInlineCombinatorDnD hook.
DndAdapterProviderPropsProps for the adapter's DnD context provider component.
DndAdapterRuleDnDParamsParameters for the adapter's useRuleDnD hook.
DndAdapterRuleGroupDnDParamsParameters for the adapter's useRuleGroupDnD hook.

DnD

NameDescription
DndAdapterThe DnD adapter interface. Implementations of this interface provide drag-and-drop functionality for react-querybuilder using a specific DnD library.
DndKitExportsThe @dnd-kit/core exports needed by the adapter.
PragmaticDndExportsThe @atlaskit/pragmatic-drag-and-drop exports needed by the adapter.
createDndKitAdapterCreates a DndAdapter backed by @dnd-kit/core.
createPragmaticDndAdapterCreates a DndAdapter backed by @atlaskit/pragmatic-drag-and-drop.
createReactDnDAdapterCreates a DndAdapter backed by react-dnd.

caution

API documentation is generated from the latest commit on the main branch. It may be somewhat inconsistent with official releases of React Query Builder.