@syncfusion/ej2-querybuilder 20.1.48 → 20.1.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/dist/ej2-querybuilder.umd.min.js +2 -2
  3. package/dist/ej2-querybuilder.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-querybuilder.es2015.js +76 -26
  5. package/dist/es6/ej2-querybuilder.es2015.js.map +1 -1
  6. package/dist/es6/ej2-querybuilder.es5.js +72 -22
  7. package/dist/es6/ej2-querybuilder.es5.js.map +1 -1
  8. package/dist/global/ej2-querybuilder.min.js +2 -2
  9. package/dist/global/ej2-querybuilder.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +11 -11
  12. package/src/query-builder/query-builder.d.ts +2 -0
  13. package/src/query-builder/query-builder.js +72 -22
  14. package/styles/bootstrap-dark.css +31 -214
  15. package/styles/bootstrap.css +31 -214
  16. package/styles/bootstrap4.css +32 -221
  17. package/styles/bootstrap5-dark.css +32 -213
  18. package/styles/bootstrap5.css +32 -213
  19. package/styles/fabric-dark.css +31 -210
  20. package/styles/fabric.css +31 -210
  21. package/styles/fluent-dark.css +31 -212
  22. package/styles/fluent.css +31 -212
  23. package/styles/highcontrast-light.css +32 -252
  24. package/styles/highcontrast.css +32 -252
  25. package/styles/material-dark.css +27 -199
  26. package/styles/material.css +27 -199
  27. package/styles/query-builder/bootstrap-dark.css +31 -214
  28. package/styles/query-builder/bootstrap.css +31 -214
  29. package/styles/query-builder/bootstrap4.css +32 -221
  30. package/styles/query-builder/bootstrap5-dark.css +32 -213
  31. package/styles/query-builder/bootstrap5.css +32 -213
  32. package/styles/query-builder/fabric-dark.css +31 -210
  33. package/styles/query-builder/fabric.css +31 -210
  34. package/styles/query-builder/fluent-dark.css +31 -212
  35. package/styles/query-builder/fluent.css +31 -212
  36. package/styles/query-builder/highcontrast-light.css +32 -252
  37. package/styles/query-builder/highcontrast.css +32 -252
  38. package/styles/query-builder/material-dark.css +27 -199
  39. package/styles/query-builder/material.css +27 -199
  40. package/styles/query-builder/tailwind-dark.css +28 -200
  41. package/styles/query-builder/tailwind.css +28 -200
  42. package/styles/tailwind-dark.css +28 -200
  43. package/styles/tailwind.css +28 -200
@@ -329,7 +329,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
329
329
  };
330
330
  QueryBuilder.prototype.updateSubFieldsFromColumns = function (col, field) {
331
331
  for (var i = 0; i < col.length; i++) {
332
- if (this.separator != '' && col[i].field.indexOf(this.separator) < 0) {
332
+ if (this.separator !== '' && col[i].field.indexOf(this.separator) < 0) {
333
333
  col[i].field = field ? field + this.separator + col[i].field : col[i].field;
334
334
  }
335
335
  if (col[i].operators) {
@@ -556,7 +556,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
556
556
  var template = void 0;
557
557
  args.fields = this.fields;
558
558
  args.columns = this.columns;
559
- if (rule.field === "") {
559
+ if (rule.field === '') {
560
560
  rule.field = column.field;
561
561
  }
562
562
  args.operators = this.getOperators(rule.field);
@@ -683,7 +683,6 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
683
683
  }
684
684
  }
685
685
  else {
686
- var dropdowntree = void 0;
687
686
  var ddlField = void 0;
688
687
  var ddlValue = this.isImportRules ? rule.field : rule.field;
689
688
  ddlField = {
@@ -697,11 +696,13 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
697
696
  if (this.fieldModel) {
698
697
  ddlField = __assign({}, ddlField, this.fieldModel);
699
698
  }
700
- dropdowntree = new DropDownTree(ddlField);
699
+ var dropdowntree = new DropDownTree(ddlField);
701
700
  dropdowntree.appendTo('#' + ruleElem.id + '_filterkey');
702
701
  if (!isNullOrUndefined(dropdowntree.value)) {
703
- dropdowntree.element.value = dropdowntree.value[0];
702
+ var value = this.getLabelFromColumn(dropdowntree.value[0]);
703
+ dropdowntree.element.value = value;
704
704
  }
705
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
705
706
  var ddlVal = this.isImportRules ?
706
707
  this.GetRootColumnName(rule.field) : dropdowntree.value;
707
708
  this.selectedColumn = this.getColumn(ddlVal);
@@ -736,17 +737,20 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
736
737
  else {
737
738
  groupElem = closest(target, '.e-group-container');
738
739
  rules = this.getParentGroup(groupElem);
740
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
739
741
  var custom = rule.custom;
740
742
  if (Object.keys(rule).length) {
741
743
  rules.rules.push({
742
744
  'field': rule.field, 'type': rule.type, 'label': rule.label, 'operator': rule.operator, value: rule.value
743
745
  });
744
746
  if (custom) {
747
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
745
748
  rules.rules[rules.rules.length - 1].custom = custom;
746
749
  }
747
750
  }
748
751
  else {
749
752
  if (custom) {
753
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
750
754
  newRule.custom = custom;
751
755
  }
752
756
  rules.rules.push(newRule);
@@ -813,17 +817,17 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
813
817
  }
814
818
  }
815
819
  else {
816
- dropDownObj = getComponent(ruleElemCln[i].querySelector('.e-rule-field input.e-control'), 'dropdownlist');
820
+ dropDownObj = getComponent(ruleElemCln[i].querySelector('.e-rule-field .e-control'), 'dropdownlist');
817
821
  this.selectedColumn = dropDownObj.getDataByValue(dropDownObj.value);
818
822
  validateRule = !isNullOrUndefined(dropDownObj.index) && this.selectedColumn.validation;
819
823
  }
820
- fieldElem = tempElem.querySelector('.e-rule-field input.e-control');
824
+ fieldElem = tempElem.querySelector('.e-rule-field .e-control');
821
825
  if (validateRule && validateRule.isRequired) {
822
826
  while (indexElem && indexElem.previousElementSibling !== null) {
823
827
  indexElem = indexElem.previousElementSibling;
824
828
  index++;
825
829
  }
826
- fieldElem = tempElem.querySelector('.e-rule-operator input.e-control');
830
+ fieldElem = tempElem.querySelector('.e-rule-operator .e-control');
827
831
  if (!rule.rules[index].operator) {
828
832
  if (fieldElem.parentElement.className.indexOf('e-tooltip') < 0) {
829
833
  this.renderToolTip(fieldElem.parentElement);
@@ -836,7 +840,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
836
840
  if (excludeOprs.indexOf(rule.rules[index].operator) < 0 && (isNullOrUndefined(rule.rules[index].value) &&
837
841
  rule.rules[index].type !== 'date') || rule.rules[index].value === '' ||
838
842
  (rule.rules[index].value instanceof Array && valArray.length < 1)) {
839
- var valElem = tempElem.querySelectorAll('.e-rule-value input.e-control');
843
+ var valElem = tempElem.querySelectorAll('.e-rule-value .e-control');
840
844
  isValid = false;
841
845
  for (var j = 0, jLen = valElem.length; j < jLen; j++) {
842
846
  var element = valElem[j];
@@ -1361,7 +1365,8 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1361
1365
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
1362
1366
  ddt.value = args.value[0];
1363
1367
  ddt.dataBind();
1364
- ddtElem.value = args.value[0];
1368
+ var result = this.getLabelFromColumn(args.value[0]);
1369
+ ddtElem.value = result;
1365
1370
  }
1366
1371
  }
1367
1372
  }
@@ -1391,7 +1396,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1391
1396
  };
1392
1397
  QueryBuilder.prototype.changeRule = function (rule, ddlArgs) {
1393
1398
  if (!ddlArgs.itemData) {
1394
- if (this.fieldMode === "DropdownTree") {
1399
+ if (this.fieldMode === 'DropdownTree') {
1395
1400
  var ddt = getComponent(ddlArgs.element, 'dropdowntree');
1396
1401
  if (ddt.value == null) {
1397
1402
  return;
@@ -1415,6 +1420,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1415
1420
  QueryBuilder.prototype.changeFilter = function (flt, dl, grID, rl, tmpRl, dArg) {
1416
1421
  var _this = this;
1417
1422
  if (flt) {
1423
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
1418
1424
  var ddlValue = void 0;
1419
1425
  if (this.fieldMode === 'DropdownTree') {
1420
1426
  ddlValue = (dl.value[0]);
@@ -1441,7 +1447,9 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1441
1447
  this.changeOperator(flt, operatorElem, dl, grID, rl, tmpRl, dArg);
1442
1448
  }
1443
1449
  };
1444
- QueryBuilder.prototype.changeOperator = function (flt, opr, dl, grID, rl, tmpRl, dArg) {
1450
+ QueryBuilder.prototype.changeOperator = function (
1451
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
1452
+ flt, opr, dl, grID, rl, tmpRl, dArg) {
1445
1453
  var _this = this;
1446
1454
  var ruleElem;
1447
1455
  var ruleID;
@@ -1823,7 +1831,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1823
1831
  var original = {};
1824
1832
  var result = [];
1825
1833
  var nest = [];
1826
- var value = "";
1834
+ var value = '';
1827
1835
  var isNested = field.indexOf(this.separator);
1828
1836
  var _loop_2 = function (i, iLen) {
1829
1837
  if (isNested === 0) {
@@ -1831,6 +1839,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1831
1839
  }
1832
1840
  else {
1833
1841
  nest = field.split(this_2.separator);
1842
+ // eslint-disable-next-line @typescript-eslint/tslint/config
1834
1843
  nest.forEach(function (element) {
1835
1844
  if (value) {
1836
1845
  value = value[element];
@@ -1844,7 +1853,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1844
1853
  value = dataSource[i][field].toString();
1845
1854
  }
1846
1855
  var data = {};
1847
- if (!(value in original) && !isNullOrUndefined(value)) {
1856
+ if (!(value in original)) {
1848
1857
  original[value] = 1;
1849
1858
  if (isNested === 0) {
1850
1859
  data[field] = value;
@@ -1878,7 +1887,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1878
1887
  }
1879
1888
  var fieldValue = this.selectedRule.field;
1880
1889
  var isNested = this.selectedRule.field.indexOf(this.separator);
1881
- if (isNested !== 0 && this.fieldMode !== "DropdownTree") {
1890
+ if (isNested !== 0 && this.fieldMode !== 'DropdownTree') {
1882
1891
  var nest = this.selectedRule.field.split(this.separator);
1883
1892
  fieldValue = nest[nest.length - 1];
1884
1893
  }
@@ -1990,10 +1999,10 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
1990
1999
  };
1991
2000
  QueryBuilder.prototype.getItemData = function (parentId) {
1992
2001
  var fieldObj = getComponent(document.getElementById(parentId + '_filterkey'), 'dropdownlist');
1993
- if (this.fieldMode === "DropdownTree") {
2002
+ if (this.fieldMode === 'DropdownTree') {
1994
2003
  fieldObj = getComponent(document.getElementById(parentId + '_filterkey'), 'dropdowntree');
1995
2004
  }
1996
- return this.fieldMode === "DropdownTree" ? this.getColumn(fieldObj.value[0]) : this.getColumn(fieldObj.value);
2005
+ return this.fieldMode === 'DropdownTree' ? this.getColumn(fieldObj.value[0]) : this.getColumn(fieldObj.value);
1997
2006
  };
1998
2007
  QueryBuilder.prototype.setDefaultValue = function (parentId, isArryValue, isNumber) {
1999
2008
  var itemData = this.getItemData(parentId);
@@ -2324,6 +2333,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
2324
2333
  };
2325
2334
  QueryBuilder.prototype.getPreviousItemData = function (prevItemData, column) {
2326
2335
  if (this.isFieldClose && prevItemData) {
2336
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
2327
2337
  prevItemData = this.getColumn(prevItemData.value);
2328
2338
  }
2329
2339
  if (column.template && prevItemData && Object.keys(prevItemData).length < 4) {
@@ -2337,6 +2347,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
2337
2347
  var filtObj = this.fieldMode === 'DropdownTree' ? getComponent(filtElem, 'dropdowntree')
2338
2348
  : getComponent(filtElem, 'dropdownlist');
2339
2349
  var column = this.fieldMode === 'DropdownTree' ? this.getColumn(filtObj.value[0])
2350
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
2340
2351
  : this.getColumn(filtObj.value);
2341
2352
  this.selectedRule = column;
2342
2353
  if (isRender) {
@@ -2581,7 +2592,9 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
2581
2592
  }
2582
2593
  dropDownObj = this.fieldMode === 'DropdownTree' ? getComponent(target, 'dropdowntree') :
2583
2594
  getComponent(target, 'dropdownlist');
2595
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
2584
2596
  var column = this.fieldMode === 'DropdownTree' ? this.getColumn(dropDownObj.value[0])
2597
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
2585
2598
  : this.getColumn(dropDownObj.value);
2586
2599
  if (!this.isImportRules && rule.rules[index].field && rule.rules[index].field.toLowerCase() !== column.field.toLowerCase()) {
2587
2600
  if (!(ruleElem.querySelectorAll('.e-template')) && !(operator.indexOf('null') > -1)
@@ -2608,8 +2621,8 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
2608
2621
  if (elementCln.length < 1) {
2609
2622
  elementCln = valueContainer.querySelectorAll('.e-template');
2610
2623
  }
2624
+ eventsArgs = { groupID: groupID, ruleID: ruleID, value: rule.rules[index].field, type: 'field' };
2611
2625
  for (var i_1 = 0; i_1 < elementCln.length; i_1++) {
2612
- eventsArgs = { groupID: groupID, ruleID: ruleID, value: rule.rules[index].field, type: 'field' };
2613
2626
  if (operator.indexOf('null') > -1 || operator.indexOf('empty') > -1) {
2614
2627
  rule.rules[index].value = null;
2615
2628
  continue;
@@ -3518,11 +3531,18 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
3518
3531
  }
3519
3532
  }
3520
3533
  var isTemplateRendered = clnruleElem.querySelector('.e-template-value');
3534
+ // eslint-disable
3521
3535
  try {
3522
3536
  detach(clnruleElem);
3523
3537
  }
3524
3538
  catch (err) {
3539
+ // eslint-disable-next-line no-ex-assign
3540
+ err = [];
3541
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
3542
+ var error = 'error';
3543
+ err[error] = error;
3525
3544
  }
3545
+ // eslint-enable
3526
3546
  if (column && column.ruleTemplate) {
3527
3547
  this.clearQBTemplate([clnruleElem.id]);
3528
3548
  }
@@ -3932,8 +3952,8 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
3932
3952
  }
3933
3953
  }
3934
3954
  if (this.dataSource instanceof DataManager) {
3935
- if (!isNullOrUndefined(pred) && (pred.operator === "isnull" || pred.operator === "notnull")) {
3936
- pred.operator = pred.operator === "isnull" ? "equal" : "notequal";
3955
+ if (!isNullOrUndefined(pred) && (pred.operator === 'isnull' || pred.operator === 'notnull')) {
3956
+ pred.operator = pred.operator === 'isnull' ? 'equal' : 'notequal';
3937
3957
  }
3938
3958
  }
3939
3959
  return pred;
@@ -4440,7 +4460,7 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
4440
4460
  }
4441
4461
  queryStr += rule.field + ' ' + this.operators[rule.operator] + ' ' + valueStr;
4442
4462
  }
4443
- if (rule.condition && rule.condition != '') {
4463
+ if (rule.condition && rule.condition !== '') {
4444
4464
  condition = rule.condition;
4445
4465
  }
4446
4466
  }
@@ -4581,7 +4601,6 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
4581
4601
  this.parser.push(['Literal', matchValue]);
4582
4602
  return matchValue.length + 2;
4583
4603
  }
4584
- // eslint-disable-next-line
4585
4604
  if (this.checkNumberLiteral(sqlString)) {
4586
4605
  matchValue = /^[0-9]+(\.[0-9]+)?/.exec(sqlString)[0];
4587
4606
  this.parser.push(['Literal', matchValue]);
@@ -4676,6 +4695,37 @@ var QueryBuilder = /** @__PURE__ @class */ (function (_super) {
4676
4695
  var columnData = this.getColumn(rules.field);
4677
4696
  return columnData.type;
4678
4697
  };
4698
+ QueryBuilder.prototype.getLabelFromColumn = function (field) {
4699
+ var label = '';
4700
+ var l = 0;
4701
+ if (this.separator !== '') {
4702
+ var fieldColl = field.split(this.separator);
4703
+ for (var i = 0; i < fieldColl.length; i++) {
4704
+ label += this.getLabelFromField(fieldColl, i + 1);
4705
+ l++;
4706
+ if (l < fieldColl.length) {
4707
+ label += this.separator;
4708
+ }
4709
+ }
4710
+ return label;
4711
+ }
4712
+ else {
4713
+ var labelItem = this.getColumn(field).label;
4714
+ return labelItem;
4715
+ }
4716
+ };
4717
+ QueryBuilder.prototype.getLabelFromField = function (field, startIdx) {
4718
+ var fieldName = '';
4719
+ var j = 0;
4720
+ for (var k = 0; k < startIdx; k++) {
4721
+ fieldName += field[k];
4722
+ j++;
4723
+ if (j < startIdx) {
4724
+ fieldName += this.separator;
4725
+ }
4726
+ }
4727
+ return this.getColumn(fieldName).label;
4728
+ };
4679
4729
  QueryBuilder.prototype.processParser = function (parser, rules, levelColl) {
4680
4730
  var j;
4681
4731
  var jLen;