@syncfusion/ej2-vue-querybuilder 20.1.48 → 20.1.51

package/package.json

@@ -1,14 +1,8 @@
 {
-  "_args": [
-    [
-      "@syncfusion/ej2-vue-querybuilder@19.4.55",
-      "D:\\Augest 2021\\vue package publish\\vue source from nexus"
-    ]
-  ],
   "_from": "@syncfusion/ej2-vue-querybuilder@*",
-  "_id": "@syncfusion/ej2-vue-querybuilder@19.4.55",
+  "_id": "@syncfusion/ej2-vue-querybuilder@20.1.48",
   "_inBundle": false,
-  "_integrity": "sha512-nJsIYlJu0bZk1OmIa9zBsN4z4tT46RTkUtM0UVAquNysbsG8UhVsDxXuvBHYzCSdPVp4vmxSMHCOQec1Mi3jCA==",
+  "_integrity": "sha512-Pk5fxCjw81KHB15luI2bDrN9ggao36/pQgEyb/6YLrFdt4mhnc8N/zUnXBcxVX+s6R8a26e0WOMhz/AHDjDLFA==",
   "_location": "/@syncfusion/ej2-vue-querybuilder",
   "_phantomChildren": {},
   "_requested": {
@@ -25,8 +19,8 @@
   "_requiredBy": [
     "/"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-vue-querybuilder/-/ej2-vue-querybuilder-19.4.55.tgz",
-  "_shasum": "31894a347e4fa33f237a955bc0b85d5b2349e6a3",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-vue-querybuilder/-/ej2-vue-querybuilder-20.1.48.tgz",
+  "_shasum": "bce4bfad855b25a0377f772b0d22b300c7956b29",
   "_spec": "@syncfusion/ej2-vue-querybuilder@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -37,9 +31,9 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~20.1.48",
-    "@syncfusion/ej2-querybuilder": "20.1.48",
-    "@syncfusion/ej2-vue-base": "~20.1.48"
+    "@syncfusion/ej2-base": "~20.1.50",
+    "@syncfusion/ej2-querybuilder": "20.1.51",
+    "@syncfusion/ej2-vue-base": "~20.1.51"
   },
   "deprecated": false,
   "description": "Essential JS 2 QueryBuilder for Vue",
@@ -70,6 +64,6 @@
     "type": "git",
     "url": "git+https://github.com/syncfusion/ej2-vue-ui-components.git"
   },
-  "version": "20.1.48",
+  "version": "20.1.51",
   "sideEffects": false
 }

package/src/query-builder/columns.directive.d.ts

@@ -1,7 +1,9 @@
 export declare const isExecute: any;
 declare let vueImport: any;
 export declare class ColumnsDirective extends vueImport {
-    render(): void;
+    constructor();
+    render(createElement: any): void;
+    updated(): void;
     getTag(): string;
 }
 export declare const ColumnsPlugin: {

package/src/query-builder/columns.directive.js

@@ -19,7 +19,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { EJComponentDecorator, allVue, gh } from '@syncfusion/ej2-vue-base';
 import * as Vue3 from 'vue-class-component';
+import { isNullOrUndefined } from '@syncfusion/ej2-base';
 import Vue from 'vue';
+import { Options } from 'vue-class-component';
 export var isExecute = gh ? false : true;
 var vueImport;
 if (!isExecute || parseInt(allVue.version) < 3) {
@@ -31,16 +33,36 @@ else {
 var ColumnsDirective = /** @class */ (function (_super) {
     __extends(ColumnsDirective, _super);
     function ColumnsDirective() {
-        return _super !== null && _super.apply(this, arguments) || this;
+        return _super.call(this, arguments) || this;
     }
-    ColumnsDirective.prototype.render = function () {
+    ColumnsDirective.prototype.render = function (createElement) {
+        if (gh) {
+            var h = gh || createElement;
+            var slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     };
+    ColumnsDirective.prototype.updated = function () {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    };
     ColumnsDirective.prototype.getTag = function () {
         return 'e-columns';
     };
     ColumnsDirective = __decorate([
         EJComponentDecorator({}, isExecute)
+        ,Options({
+            inject: {
+                custom: {
+                    default: null
+                }
+            }
+        })
     ], ColumnsDirective);
     return ColumnsDirective;
 }(vueImport));

package/src/query-builder/querybuilder.component.d.ts

@@ -28,6 +28,7 @@ export declare class QueryBuilderComponent extends ComponentBase {
     clearTemplate(templateNames?: string[]): any;
     setProperties(prop: any, muteOnChange: boolean): void;
     render(createElement: any): any;
+    custom(): void;
     addGroups(groups: Object[], groupID: string): void;
     addRules(rule: Object[], groupID: string): void;
     deleteGroup(target: Object | string): void;

package/src/query-builder/querybuilder.component.js

@@ -56,6 +56,7 @@ var QueryBuilderComponent = /** @class */ (function (_super) {
         _this.ej2Instances._setProperties = _this.ej2Instances.setProperties;
         _this.ej2Instances.setProperties = _this.setProperties;
         _this.ej2Instances.clearTemplate = _this.clearTemplate;
+        _this.updated = _this.updated;
         return _this;
     }
     QueryBuilderComponent.prototype.clearTemplate = function (templateNames) {
@@ -114,6 +115,9 @@ var QueryBuilderComponent = /** @class */ (function (_super) {
         }
         return h('div', slots);
     };
+    QueryBuilderComponent.prototype.custom = function () {
+        this.updated();
+    };
     QueryBuilderComponent.prototype.addGroups = function (groups, groupID) {
         return this.ej2Instances.addGroups(groups, groupID);
     };
@@ -184,7 +188,12 @@ var QueryBuilderComponent = /** @class */ (function (_super) {
         ,Options({
             props: props,
             watch: watch,
-            emits: emitProbs
+            emits: emitProbs,
+            provide: function provide() {
+                return {
+                    custom: this.custom
+                };
+            }
         })
     ], QueryBuilderComponent);
     return QueryBuilderComponent;

package/styles/bootstrap5-dark.css

@@ -90,6 +90,13 @@
   color: #adb5bd;
 }
 
+.e-input-group.e-ddl.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon,
+.e-input-group.e-control-wrapper.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon,
+.e-float-input.e-ddl.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon,
+.e-float-input.e-control-wrapper.e-ddl.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon {
+  background: #343a40;
+}
+
 .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon,
 .e-input-group.e-disabled.e-ddl .e-control.e-dropdownlist ~ .e-input-group-icon,
 .e-control.e-dropdownlist .e-input-group.e-disabled.e-ddl .e-input-group-icon,
@@ -152,7 +159,7 @@
 }
 
 .e-multiselect .e-input-group-icon.e-ddl-icon {
-  border-radius: 0 4px 4px 0;
+  border-radius: 0 2px 2px 0;
   border-right-width: 0;
 }
 
@@ -200,7 +207,7 @@
 }
 
 .e-query-builder .e-collapse-rule::before {
-  content: '\e853';
+  content: '\e80e';
 }
 
 .e-query-builder {
@@ -326,7 +333,7 @@
 
 .e-query-builder .e-rule-list > ::after,
 .e-query-builder .e-rule-list > ::before {
-  border-style: dashed;
+  border-style: dotted;
   content: '';
   left: -12px;
   position: absolute;
@@ -500,8 +507,8 @@
 .e-query-builder .e-group-body .e-rule-container.e-joined-rule {
   border-top-left-radius: 0;
   border-top-right-radius: 0;
-  border-top-style: dashed;
-  border-top-width: 1px;
+  border-top-style: dotted;
+  border-top-width: 2px;
   margin-top: 0;
 }
 
@@ -510,12 +517,12 @@
 }
 
 .e-query-builder .e-group-body .e-rule-container .e-rule-filter {
-  padding: 8px 0 8px 8px;
+  padding: 8px 8px 8px 8px;
   width: auto;
 }
 
 .e-query-builder .e-group-body .e-rule-container .e-rule-sub-filter {
-  padding: 8px 0 8px 8px;
+  padding: 8px 8px 8px 8px;
   width: auto;
 }
 
@@ -541,7 +548,7 @@
 
 .e-query-builder .e-group-body .e-rule-container .e-operator,
 .e-query-builder .e-group-body .e-rule-container .e-value {
-  padding: 8px 0 8px 8px;
+  padding: 8px 8px 8px 8px;
 }
 
 .e-query-builder .e-group-body .e-rule-container .e-operator .e-radio-wrapper,
@@ -808,7 +815,7 @@
 .e-bigger.e-query-builder .e-group-body .e-horizontal-mode .e-rule-delete,
 .e-bigger .e-query-builder .e-group-body .e-horizontal-mode .e-rule-delete {
   display: inline-block;
-  margin-left: 10px;
+  margin-left: 16px;
 }
 
 .e-query-builder.e-device .e-group-body .e-horizontal-mode .e-rule-filter,
@@ -879,7 +886,7 @@
 *.e-bigger .e-group-body .e-rule-container .e-rule-sub-filter,
 *.e-bigger .e-group-body .e-rule-container .e-operator,
 *.e-bigger .e-group-body .e-rule-container .e-value {
-  padding: 10px 0 10px 10px;
+  padding: 16px 16px 16px 16px;
 }
 
 .e-query-builder {
@@ -891,6 +898,13 @@
   border-color: #444c54;
 }
 
+.e-query-builder .e-group-header .e-dropdown-btn.e-add-btn,
+.e-query-builder .e-deletegroup {
+  background-color: #212529;
+  box-shadow: none;
+  color: #adb5bd;
+}
+
 .e-query-builder .e-group-container {
   border-color: #444c54;
 }
@@ -922,6 +936,8 @@
 
 .e-query-builder .e-removerule.e-btn.e-round {
   background-color: #6c757d;
+  background-color: #212529;
+  color: #adb5bd;
 }
 
 .e-query-builder .e-removerule.e-btn.e-round.e-readonly {

package/styles/bootstrap5.css

@@ -90,6 +90,13 @@
   color: #6c757d;
 }
 
+.e-input-group.e-ddl.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon,
+.e-input-group.e-control-wrapper.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon,
+.e-float-input.e-ddl.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon,
+.e-float-input.e-control-wrapper.e-ddl.e-readonly .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon.e-search-icon {
+  background: #e9ecef;
+}
+
 .e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon,
 .e-input-group.e-disabled.e-ddl .e-control.e-dropdownlist ~ .e-input-group-icon,
 .e-control.e-dropdownlist .e-input-group.e-disabled.e-ddl .e-input-group-icon,
@@ -152,7 +159,7 @@
 }
 
 .e-multiselect .e-input-group-icon.e-ddl-icon {
-  border-radius: 0 4px 4px 0;
+  border-radius: 0 2px 2px 0;
   border-right-width: 0;
 }
 
@@ -200,7 +207,7 @@
 }
 
 .e-query-builder .e-collapse-rule::before {
-  content: '\e853';
+  content: '\e80e';
 }
 
 .e-query-builder {
@@ -326,7 +333,7 @@
 
 .e-query-builder .e-rule-list > ::after,
 .e-query-builder .e-rule-list > ::before {
-  border-style: dashed;
+  border-style: dotted;
   content: '';
   left: -12px;
   position: absolute;
@@ -500,8 +507,8 @@
 .e-query-builder .e-group-body .e-rule-container.e-joined-rule {
   border-top-left-radius: 0;
   border-top-right-radius: 0;
-  border-top-style: dashed;
-  border-top-width: 1px;
+  border-top-style: dotted;
+  border-top-width: 2px;
   margin-top: 0;
 }
 
@@ -510,12 +517,12 @@
 }
 
 .e-query-builder .e-group-body .e-rule-container .e-rule-filter {
-  padding: 8px 0 8px 8px;
+  padding: 8px 8px 8px 8px;
   width: auto;
 }
 
 .e-query-builder .e-group-body .e-rule-container .e-rule-sub-filter {
-  padding: 8px 0 8px 8px;
+  padding: 8px 8px 8px 8px;
   width: auto;
 }
 
@@ -541,7 +548,7 @@
 
 .e-query-builder .e-group-body .e-rule-container .e-operator,
 .e-query-builder .e-group-body .e-rule-container .e-value {
-  padding: 8px 0 8px 8px;
+  padding: 8px 8px 8px 8px;
 }
 
 .e-query-builder .e-group-body .e-rule-container .e-operator .e-radio-wrapper,
@@ -808,7 +815,7 @@
 .e-bigger.e-query-builder .e-group-body .e-horizontal-mode .e-rule-delete,
 .e-bigger .e-query-builder .e-group-body .e-horizontal-mode .e-rule-delete {
   display: inline-block;
-  margin-left: 10px;
+  margin-left: 16px;
 }
 
 .e-query-builder.e-device .e-group-body .e-horizontal-mode .e-rule-filter,
@@ -879,7 +886,7 @@
 *.e-bigger .e-group-body .e-rule-container .e-rule-sub-filter,
 *.e-bigger .e-group-body .e-rule-container .e-operator,
 *.e-bigger .e-group-body .e-rule-container .e-value {
-  padding: 10px 0 10px 10px;
+  padding: 16px 16px 16px 16px;
 }
 
 .e-query-builder {
@@ -891,6 +898,13 @@
   border-color: #dee2e6;
 }
 
+.e-query-builder .e-group-header .e-dropdown-btn.e-add-btn,
+.e-query-builder .e-deletegroup {
+  background-color: #fff;
+  box-shadow: none;
+  color: #6c757d;
+}
+
 .e-query-builder .e-group-container {
   border-color: #dee2e6;
 }
@@ -922,6 +936,8 @@
 
 .e-query-builder .e-removerule.e-btn.e-round {
   background-color: #6c757d;
+  background-color: #fff;
+  color: #6c757d;
 }
 
 .e-query-builder .e-removerule.e-btn.e-round.e-readonly {