@react-query-builder-express/core
v6.6.3-dev.3
Published
User-friendly query builder for React. Core
Downloads
77
Readme
@react-query-builder-express/core
This package has core functionality to import/export/store query, provides utils and core config. Can be used on server-side, does not require React.
Installation
npm i @react-query-builder-express/core --save
Usage
import {
CoreConfig, Utils,
// types
TreeStore, TreeState, TreeActions, InputAction, JsonTree
} from '@react-query-builder-express/core';
// config
const config = {
...CoreConfig,
fields: {
name: {
label: 'Name',
type: 'text',
},
age: {
label: 'Age',
type: 'number',
}
}
};
// load from JSON
const initialTree = Utils.loadTree({
id: '00001',
type: 'group',
children1: [
{
id: '00002',
type: 'rule',
properties: {
field: 'age',
operator: 'greater_or_equal',
value: [18],
valueSrc: ['value']
}
}
]
});
// or import from jsonLogic
// const initialTree = Utils.loadFromJsonLogic({
// 'and': [
// {
// '<=': [
// {var: 'age'},
// 18
// ]
// }
// ]
// }, config);
// create store to manipulate tree on backend
const reducer = TreeStore(config);
let state: TreeState = reducer({tree: initialTree});
// add rule `name == 'denis'`
const rootPath = [ state.tree.get('id') as string ];
const action = TreeActions.tree.addRule(config, rootPath, {
field: 'name',
operator: 'equal',
value: ['denis'],
valueSrc: ['value'],
valueType: ['text']
});
state = reducer(state, action);
// export
const tree = Utils.getTree(state.tree);
const { logic } = Utils.jsonLogicFormat(state.tree, config);
const sql = Utils.sqlFormat(state.tree, config);
const spel = Utils.sqlFormat(state.tree, config);
const mongo = Utils.mongodbFormat(state.tree, config);
const elastic = Utils.elasticSearchFormat(state.tree, config);
console.log({ tree, logic, sql, spel, mongo, elastic });