@react-awesome-query-builder/ui
This package has core React components like <Query>
<Builder>
and CSS, provides config with basic (vanilla) widgets.
Installation
npm i @react-awesome-query-builder/ui --save
Usage
Use BasicConfig
.
User-friendly query builder for React. Core React UI
This package has core React components like <Query>
<Builder>
and CSS, provides config with basic (vanilla) widgets.
npm i @react-awesome-query-builder/ui --save
Use BasicConfig
.
fieldSettings.fetchSelectedValuesOnInit
(see description in CONFIG.adoc
) (PR #1184)fieldSettings.allowCustomValues
is true (MIU/antd) (PR #1176) (issue #1150)CollectionUtils.containsAny
(PR #1174) (issue #1007)SqlUtils.loadFromSql
) (PR #1103) (issue #911, #593)Utils.isValidTree
for prod build.
Removed checkTree
, isValidTree
from Utils.Import
and getTreeBadFields
from Utils.TreeUtils
. (PR #1091) (issue #1075)customOperatorSelectProps
(issue #1094) (PR #1098)DefaultUtils
typings to index.d.ts
(PR #1078) (issue #1079)exportPreserveGroups
(PR #1077) (issue #1074)@mui/x-date-pickers
v7 (PR #1088) (issue #1087)reverseOperatorsForNot
and canShortMongoQuery
.query-builder
(PR #1070) (issue #1018)excludeOperators
(affects prox1
at example) (PR #1072)tooltip
for operator config (PR #1011) (issue #261)optimizeRenderWithInternals
from settings
(PR #1054)TreeStore
- 2nd arg action
can be undefined (PR #1054) (issue #1056)config.settings
: caseValueField
, renderBeforeCaseValue
, renderAfterCaseValue
, renderSwitchPrefix
, defaultCaseLabel
, addCaseLabel
, addDefaultCaseLabel
(PR #1062)@babel/runtime
is now dep for core package (PR #1051) (issue #964)Utils.validateTree
returns array of errors (PR #1034)Utils.sanitizeTree
returns object {fixedTree, fixedErrors}
(PR #1034)removeIncompleteRulesOnLoad
by default is falseremoveEmptyRulesOnLoad
(default true) (PR #1034)Utils.validateAndFixTree
and Utils.checkTree
(and removed type defs).Utils.sanitizeTree().fixedTree
instead (PR #1034)Utils.validateTree
now checks LHS and RHS are completed (issues #977, #781) (PR #1034)select_any_in
operator from JsonLogic (issue #1005) (PR #1034)validateValue
in fieldSettings
config can now return object {error, fixedValue}
, error can be {key, args}
for i18n (PR #1034)optimizeRenderWithInternals
to settings
, default is false
(PR #1034)RuleGroupExtProperties
(issue #1021) (PR #1034)onInit
prop to <Query>
. Added 4th argument actions
to onInit
and onChange
(PR #1034)pnpm i
requires Node 18+multiselect
(PR #997)immutable
from v3 to v4 (PR #997)funcs
in field/arg config during validation of function value (PR #997)renderIcon
(issues #319, #872) (PR #962)FieldCascader
(issue #969) (PR #973)ItemBuilderProps
(PR #959)maxNesting
when moving group into group (PR #959)fieldSeparator
(issue #958) (PR #960)fieldSources: ["field", "func"]
in settings
fieldName
(PR #900) (issues #929, #609)@mui/x-date-pickers
v6 (PR #951) (issue #910)pnpm i
requires Node 16+@fluentui/react
. Fixed date/time widgetsgroupTitle
(PR #953) (issue #600)Utils.Autocomplete
(PR #953) (issue #934)fieldItemKeysForSearch
and listKeysForSearch
(PR #954) (issue #931)defaultField
and defaultOperator
(PR #956) (issue #763)compressConfig()
, decompressConfig()
settings.useConfigCompress
ctx
propertysandbox_next
to demonstrate new server-side featuresmongoFormatOp1
, mongoFormatOp2
) in CoreConfig.ctx.utils
(PR #866) (issue #890)onChange
callback now equals original config, not extended config (PR #866) (issue #364)loadTree()
(PR #917) (issue #356)allowCustomValues
for MUI (PR #947) (issue #327)strictNullChecks
(PR #948) (issue #945)Config
: should have render settings like renderSize
(PR #909) (issue #879)renderBeforeWidget
: RuleProps
instead of wrong FieldProps
(PR #909) (issue #879)listValues
renamed to treeValues
in TreeSelectFieldSettings
listValues
is still supported in JS (PR #909)BootstrapFieldSelect
for fields with 2+ level nesting (PR #898) (issue #868)UNSAFE_componentWillReceiveProps
(PR #901) (issue #390)React.StrictMode
(PR #902) (issue #789)children1
: tuple -> array (PR #885) (issue #881)flex
ible styles for low-widthstyles.scss
now has vars that can be overridden to change colos and sizescompact_styles.css
replaces styles.css
, don't use them together@react-awesome-query-builder/fluent
package (PR #727)is_null
and is_not_null
ops from SpEL (PR #831) (issue #794)cars.size() == 2
multiselect_contains
operator (PR #813) (issue #702)ReactDOM.createRoot()
(PR #815) (issue #792)id
for JsonRule
(PR #799) (issue #791)groupOperators
(PR #798)not
operation at the root not detected when importing from SpEL (PR #767) (issue #766)@fortawesome/react-fontawesome 0.2.x
(issue #757)loadFromSpel
for select_not_equals
op (PR #761) (issue #704)renderItem
(PR #729)allowSelfNesting
(PR #698)greater
op (PR #749) (issue #744)children1
is now array in result of getTree()
to preserve items order (PR #672) (issues #589, #670)Utils.getTree(tree, true, false)
will behave same as before this change.index.d.ts
(PR #671) (issue #669)getTotalRulesCountInTree()
== 1 (should be 0) for clear tree (PR #673) (issue #583)removeInvalidMultiSelectValuesOnLoad
(true by default, false for AntDesign)removeIncompleteRulesOnLoad
and removeEmptyGroupsOnLoad
now default to true
, set them to false
in your settings
to preserve the current behaviourloadFromSpel
for select_equals
op (PR #740) (issue #704)loadFromSpel
for is_empty
and is_not_empty
ops (PR #713) (issues #714, #699)removeIncompleteRulesOnLoad
(default false) (PR #661) (issue #642)id
in fixPathsInTree()
(PR #665) (issue #664)loadFromSpel
and spelFormat
in Utils
(PR #613)excludeOperators
for type config (PR #613)excludeOperators: ["proximity"]
in demonot_between
op for text format (!(num >= 3 && num <= 4)
-> (num < 3 || num > 4)
) (PR #613)Like
-> Contains
. Moved is_empty
, is_null
to end of operators list (PR #613)Utils._loadFromJsonLogic()
that returns [tree, errors]
(issue #621)reactstrap
) (PR #604)is_null
and is_not_null
operators (issue #494) (PR #522)is_empty
and is_not_empty
(issue #494) (PR #573)is_null
/is_not_null
.is_empty
- now it's just strict comparing with empty string.is_null
(and export to SQL was wrong because of non-existent operator IS EMPTY
).fieldDef
for functions to format operators (PR #573)jsonLogic
to widget TS def (PR #572)TreeUtils
(PR #597)showLock
and canDeleteLocked
config options, custom JsonLogic op locked
, setLock
action, lockLabel
and lockedLabel
.renderSwitch
. (issue #377) (PR #490)Object.freeze
) by using clone
(issue #345) (PR #490)not
(issue #548) (PR #559)webpack-dev-server
from 3.11.2 to 4.4.0 (PR #540)FieldItems
type definition from map to array (issues #550, #363) (PR #551)customProps
to vanilla widgets (PR #546)allowCustomValues
(PR #545)material-ui
version 4.12.3 and use new createTheme
instead of deprecated createMuiTheme
(issue #463) (PR #531)not: false
in new group (issue #512)canLeaveEmptyGroup=true
(issue #504)forceShowConj
(issue #474)groupId
(id of the parent Item - Group, RuleGroup, RuleGroupExt etc) to field's, operartor's and widget's props (PR #510)actionMeta
to onChange()
to get info about action (PR #445) (issue #351)run actions
in demo app) (PR #445)shouldCreateEmptyGroup
(default false
) (PR #445)canLeaveEmptyGroup
is true by default (PR #445) (issue #504)isForDisplay=true
- don't wrap strings with "
, replace ==
with =
(PR #518)hideOperator
(PR #523) (issue #292)cancelText
(PR #524) (issue #520)id
to field's, operartor's and widget's props. Added config of the selected field to the operator props as fieldConfig
(issue #502) (PR #503)select
(MaterialUI only) (PR #471)BasicFuncs
(exported with lib)RELATIVE_DATETIME
, NOW
, UPPER
showPrefix
for func args (false by default)mongoFormatValue
for all types in basic config (now dates are exported as Date
objects)textarea
widgettests
install-all
, clean
, reinstall
, build-all
, check-hot
, tsc
, eslint
, smoke
, resmoke
.
Renamed sandbox_ts
to sandbox-ts
, sandbox_js
to sandbox-js
.prepublish
to prepare
in package.json
useGroupsAsArrays
.
Instead added field config mode
for type !group
with values:
some
(default, corresponding useGroupsAsArrays = true),
array
(new, user can choose one of group operators),
struct
(obsolete, corresponding useGroupsAsArrays = false).!group
and mode=array
:conjunctions
, showNot
, operators
, defaultOperator
, initialEmptyWhere
some
, none
, all
or operators with 1 integer opearnd (for count): equal
, not_equal
, less
, between
, ..addSubRuleLabel
hideConjForOne
fieldName
to override field key for import/exportjsonLogicVar
and settings jsonLogic.groupVarKey
, jsonLogic.altVarKey
to override JsonLogic var key if need!group
fields are treated as arrays (added setting useGroupsAsArrays
= true)maxNumberOfRules
maxNesting
and canLeaveEmptyGroup
settings during drag-n-dropnot_like
op to JsonLogicshowErrorMessage
in config.settingsQbUtils.isValidTree()
validateValue
moved from widget settings to field's fieldSettings
starts_with
, ends_with
operators for text typefuncs
in configvalidateValue
canShortMongoQuery
to config.settings
renderConjs
, renderButton
, renderButtonGroup
, renderProvider
, renderValueSources
, renderConfirm
antd
and vanilla
in demo.immutableFieldsMode
, immutableOpsMode
, immutableValuesMode
FieldTreeSelect
!group
treeselect
and treemultiselect
typeslistValues
from {<value>: <title>}
to [{value, title}]
(old is supported).
Tree select also use listValues
, format is compatible with simple select - [{value, title, parent}]
config.settings
: renderBeforeWidget
, renderAfterWidget
, renderBeforeActions
, renderAfterActions
$eq
and $and
in MongoDb query exportsqlFormatFunc
, mongoFormatFunc
, renderBrackets
, renderSeps
(for func), funcs
(for field)qb-lite
for query builder (see readme if you wanna use it)type == '!struct'
and subfields
)funcs
in config
$expr
mongoFormatOp
- inserted arg useExpr
at 4th positionhideForSelect
, hideForCompare
for field configexamples
uses TS, sandbox
uses JS)field
widget slightly changed format of formatValue()
and sqlFormatValue()
functions - argument rightFieldDef
is now last onedefaultValue
in field configfieldSettings
will be now passed to widget propslistValues
and allowCustomValues
moved inside fieldSettings
QbUtils.sqlFormat()
(issue #29)like
and not_like
operatorsstring op, Object opDef
to end of formatValue()
, mongoFormatValue()
allowCustomValues
(issue #88)renderFieldAndOpAsDropdown
, replaced by renderField
(issue #109)renderOperator
(issue #89)Immutable.Map
), and loaded with loadTree
(old format is supported) (issue #61)canRegroup
readonlyMode
-> immutableGroupsMode
get_children
-> renderBuilder
<Preview />
component and .query-preview
class