react-querybuilder
Version:
React Query Builder component for constructing queries and filters, with utilities for executing them in various database and evaluation contexts
75 lines (74 loc) • 2.96 kB
text/typescript
import type { MouseEvent } from "react";
import * as React from "react";
import type { UseFields } from "../hooks/index.mjs";
import type { ActionElementEventHandler, FlexibleOptionList, FullField, FullOperator, FullOption, InputType, MatchModeOptions, Option, OptionList, RuleProps, RuleType, ValidationResult, ValueChangeEventHandler, ValueEditorType, ValueSourceFullOptions, ValueSources } from "../types/index.mjs";
import type { UseRuleGroup } from "./RuleGroup.mjs";
/**
* Default component to display {@link RuleType} objects. This is
* actually a small wrapper around {@link RuleComponents}.
*
* @group Components
*/
export declare const Rule: React.MemoExoticComponent<(r: RuleProps) => React.JSX.Element>;
interface RuleComponentsProps extends UseRule {
subQuery?: UseRuleGroup;
groupComponentsWrapper?: React.ComponentType<{
children: React.ReactNode;
className: string;
}>;
}
/**
* Renders a `React.Fragment` containing an array of form controls for managing a {@link RuleType}.
*
* @group Components
*/
export declare const RuleComponents: React.MemoExoticComponent<(r: RuleComponentsProps) => React.JSX.Element>;
export declare const RuleWithSubQueryGroupComponentsWrapper: (props: React.PropsWithChildren<unknown>) => React.JSX.Element;
export declare const RuleComponentsWithSubQuery: React.MemoExoticComponent<(r: RuleComponentsProps) => React.JSX.Element>;
export interface UseRule extends RuleProps {
classNames: {
shiftActions: string;
dragHandle: string;
fields: string;
matchMode: string;
matchThreshold: string;
operators: string;
valueSource: string;
value: string;
cloneRule: string;
lockRule: string;
removeRule: string;
};
cloneRule: ActionElementEventHandler;
fieldData: FullField<string, string, string, FullOption, FullOption>;
generateOnChangeHandler: (prop: Exclude<keyof RuleType, "id" | "path">) => ValueChangeEventHandler;
onChangeValueSource: ValueChangeEventHandler;
onChangeField: ValueChangeEventHandler;
onChangeMatchMode: ValueChangeEventHandler;
onChangeOperator: ValueChangeEventHandler;
onChangeValue: ValueChangeEventHandler;
hideValueControls: boolean;
inputType: InputType | null;
matchModes: MatchModeOptions;
operators: OptionList<FullOperator>;
outerClassName: string;
removeRule: ActionElementEventHandler;
shiftRuleUp: (event?: MouseEvent, _context?: any) => void;
shiftRuleDown: (event?: MouseEvent, _context?: any) => void;
subproperties: UseFields<FullField>;
subQueryBuilderProps: Record<string, unknown>;
toggleLockRule: ActionElementEventHandler;
validationResult: boolean | ValidationResult;
valueEditorSeparator: React.ReactNode;
valueEditorType: ValueEditorType;
values: FlexibleOptionList<Option<string>>;
valueSourceOptions: ValueSourceFullOptions;
valueSources: ValueSources;
}
/**
* Prepares all values and methods used by the {@link Rule} component.
*
* @group Hooks
*/
export declare const useRule: (props: RuleProps) => UseRule;
export {};