@syncfusion/ej2-querybuilder 30.2.6 → 31.1.22

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 (86) hide show
  1. package/dist/ej2-querybuilder.min.js +3 -3
  2. package/dist/ej2-querybuilder.umd.min.js +3 -3
  3. package/dist/ej2-querybuilder.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-querybuilder.es2015.js +256 -166
  5. package/dist/es6/ej2-querybuilder.es2015.js.map +1 -1
  6. package/dist/es6/ej2-querybuilder.es5.js +260 -169
  7. package/dist/es6/ej2-querybuilder.es5.js.map +1 -1
  8. package/dist/global/ej2-querybuilder.min.js +3 -3
  9. package/dist/global/ej2-querybuilder.min.js.map +1 -1
  10. package/dist/global/index.d.ts +2 -2
  11. package/package.json +7 -7
  12. package/src/query-builder/query-builder.d.ts +7 -0
  13. package/src/query-builder/query-builder.js +260 -168
  14. package/styles/bds-lite.css +37 -0
  15. package/styles/bds.css +36 -0
  16. package/styles/bootstrap-dark-lite.css +37 -0
  17. package/styles/bootstrap-dark.css +36 -0
  18. package/styles/bootstrap-lite.css +37 -0
  19. package/styles/bootstrap.css +36 -0
  20. package/styles/bootstrap4-lite.css +45 -0
  21. package/styles/bootstrap4.css +44 -0
  22. package/styles/bootstrap5-dark-lite.css +37 -0
  23. package/styles/bootstrap5-dark.css +36 -0
  24. package/styles/bootstrap5-lite.css +37 -0
  25. package/styles/bootstrap5.3-lite.css +37 -0
  26. package/styles/bootstrap5.3.css +36 -0
  27. package/styles/bootstrap5.css +36 -0
  28. package/styles/fabric-dark-lite.css +37 -0
  29. package/styles/fabric-dark.css +36 -0
  30. package/styles/fabric-lite.css +37 -0
  31. package/styles/fabric.css +36 -0
  32. package/styles/fluent-dark-lite.css +37 -0
  33. package/styles/fluent-dark.css +36 -0
  34. package/styles/fluent-lite.css +37 -0
  35. package/styles/fluent.css +36 -0
  36. package/styles/fluent2-lite.css +37 -0
  37. package/styles/fluent2.css +36 -0
  38. package/styles/highcontrast-light-lite.css +37 -0
  39. package/styles/highcontrast-light.css +36 -0
  40. package/styles/highcontrast-lite.css +37 -0
  41. package/styles/highcontrast.css +36 -0
  42. package/styles/material-dark-lite.css +37 -0
  43. package/styles/material-dark.css +36 -0
  44. package/styles/material-lite.css +37 -0
  45. package/styles/material.css +36 -0
  46. package/styles/material3-dark-lite.css +37 -0
  47. package/styles/material3-dark.css +36 -0
  48. package/styles/material3-lite.css +37 -0
  49. package/styles/material3.css +36 -0
  50. package/styles/query-builder/_bootstrap-dark-definition.scss +2 -0
  51. package/styles/query-builder/_bootstrap-definition.scss +2 -0
  52. package/styles/query-builder/_bootstrap4-definition.scss +1 -0
  53. package/styles/query-builder/_fabric-dark-definition.scss +2 -0
  54. package/styles/query-builder/_fabric-definition.scss +2 -0
  55. package/styles/query-builder/_highcontrast-definition.scss +2 -0
  56. package/styles/query-builder/_highcontrast-light-definition.scss +2 -0
  57. package/styles/query-builder/_material-dark-definition.scss +1 -0
  58. package/styles/query-builder/_material-definition.scss +1 -0
  59. package/styles/query-builder/_theme.scss +23 -0
  60. package/styles/query-builder/bds.css +36 -0
  61. package/styles/query-builder/bootstrap-dark.css +36 -0
  62. package/styles/query-builder/bootstrap.css +36 -0
  63. package/styles/query-builder/bootstrap4.css +44 -0
  64. package/styles/query-builder/bootstrap5-dark.css +36 -0
  65. package/styles/query-builder/bootstrap5.3.css +36 -0
  66. package/styles/query-builder/bootstrap5.css +36 -0
  67. package/styles/query-builder/fabric-dark.css +36 -0
  68. package/styles/query-builder/fabric.css +36 -0
  69. package/styles/query-builder/fluent-dark.css +36 -0
  70. package/styles/query-builder/fluent.css +36 -0
  71. package/styles/query-builder/fluent2.css +36 -0
  72. package/styles/query-builder/highcontrast-light.css +36 -0
  73. package/styles/query-builder/highcontrast.css +36 -0
  74. package/styles/query-builder/material-dark.css +36 -0
  75. package/styles/query-builder/material.css +36 -0
  76. package/styles/query-builder/material3-dark.css +36 -0
  77. package/styles/query-builder/material3.css +36 -0
  78. package/styles/query-builder/tailwind-dark.css +36 -0
  79. package/styles/query-builder/tailwind.css +36 -0
  80. package/styles/query-builder/tailwind3.css +36 -0
  81. package/styles/tailwind-dark-lite.css +37 -0
  82. package/styles/tailwind-dark.css +36 -0
  83. package/styles/tailwind-lite.css +37 -0
  84. package/styles/tailwind.css +36 -0
  85. package/styles/tailwind3-lite.css +37 -0
  86. package/styles/tailwind3.css +36 -0
package/styles/query-builder/fluent.css CHANGED
@@ -764,6 +764,42 @@
764
764
  color: #d13438;
765
765
  }
766
766
 
767
+ .querybuilder-spinner::before {
768
+ content: "";
769
+ position: absolute;
770
+ left: 50%;
771
+ -webkit-transform: translateX(-50%);
772
+ transform: translateX(-50%);
773
+ width: 16px;
774
+ height: 16px;
775
+ border: 2px solid #c7e0f4;
776
+ border-top: 2px solid #0078d4;
777
+ border-radius: 50%;
778
+ -webkit-animation: spin 1s linear infinite;
779
+ animation: spin 1s linear infinite;
780
+ }
781
+
782
+ @-webkit-keyframes spin {
783
+ 0% {
784
+ -webkit-transform: translateX(-50%) rotate(0deg);
785
+ transform: translateX(-50%) rotate(0deg);
786
+ }
787
+ 100% {
788
+ -webkit-transform: translateX(-50%) rotate(360deg);
789
+ transform: translateX(-50%) rotate(360deg);
790
+ }
791
+ }
792
+
793
+ @keyframes spin {
794
+ 0% {
795
+ -webkit-transform: translateX(-50%) rotate(0deg);
796
+ transform: translateX(-50%) rotate(0deg);
797
+ }
798
+ 100% {
799
+ -webkit-transform: translateX(-50%) rotate(360deg);
800
+ transform: translateX(-50%) rotate(360deg);
801
+ }
802
+ }
767
803
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
768
804
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
769
805
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/fluent2.css CHANGED
@@ -776,6 +776,42 @@
776
776
  background: var(--color-sf-content-bg-color-alt1) !important; /* stylelint-disable-line declaration-no-important */
777
777
  }
778
778
 
779
+ .querybuilder-spinner::before {
780
+ content: "";
781
+ position: absolute;
782
+ left: 50%;
783
+ -webkit-transform: translateX(-50%);
784
+ transform: translateX(-50%);
785
+ width: 16px;
786
+ height: 16px;
787
+ border: 2px solid var(--color-sf-primary-light);
788
+ border-top: 2px solid var(--color-sf-primary);
789
+ border-radius: 50%;
790
+ -webkit-animation: spin 1s linear infinite;
791
+ animation: spin 1s linear infinite;
792
+ }
793
+
794
+ @-webkit-keyframes spin {
795
+ 0% {
796
+ -webkit-transform: translateX(-50%) rotate(0deg);
797
+ transform: translateX(-50%) rotate(0deg);
798
+ }
799
+ 100% {
800
+ -webkit-transform: translateX(-50%) rotate(360deg);
801
+ transform: translateX(-50%) rotate(360deg);
802
+ }
803
+ }
804
+
805
+ @keyframes spin {
806
+ 0% {
807
+ -webkit-transform: translateX(-50%) rotate(0deg);
808
+ transform: translateX(-50%) rotate(0deg);
809
+ }
810
+ 100% {
811
+ -webkit-transform: translateX(-50%) rotate(360deg);
812
+ transform: translateX(-50%) rotate(360deg);
813
+ }
814
+ }
779
815
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
780
816
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
781
817
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/highcontrast-light.css CHANGED
@@ -778,6 +778,42 @@
778
778
  color: #000;
779
779
  }
780
780
 
781
+ .querybuilder-spinner::before {
782
+ content: "";
783
+ position: absolute;
784
+ left: 50%;
785
+ -webkit-transform: translateX(-50%);
786
+ transform: translateX(-50%);
787
+ width: 16px;
788
+ height: 16px;
789
+ border: 2px solid #ffd739;
790
+ border-top: 2px solid #ffd939;
791
+ border-radius: 50%;
792
+ -webkit-animation: spin 1s linear infinite;
793
+ animation: spin 1s linear infinite;
794
+ }
795
+
796
+ @-webkit-keyframes spin {
797
+ 0% {
798
+ -webkit-transform: translateX(-50%) rotate(0deg);
799
+ transform: translateX(-50%) rotate(0deg);
800
+ }
801
+ 100% {
802
+ -webkit-transform: translateX(-50%) rotate(360deg);
803
+ transform: translateX(-50%) rotate(360deg);
804
+ }
805
+ }
806
+
807
+ @keyframes spin {
808
+ 0% {
809
+ -webkit-transform: translateX(-50%) rotate(0deg);
810
+ transform: translateX(-50%) rotate(0deg);
811
+ }
812
+ 100% {
813
+ -webkit-transform: translateX(-50%) rotate(360deg);
814
+ transform: translateX(-50%) rotate(360deg);
815
+ }
816
+ }
781
817
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
782
818
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
783
819
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/highcontrast.css CHANGED
@@ -806,6 +806,42 @@
806
806
  color: #fff;
807
807
  }
808
808
 
809
+ .querybuilder-spinner::before {
810
+ content: "";
811
+ position: absolute;
812
+ left: 50%;
813
+ -webkit-transform: translateX(-50%);
814
+ transform: translateX(-50%);
815
+ width: 16px;
816
+ height: 16px;
817
+ border: 2px solid #ffd739;
818
+ border-top: 2px solid #ffd939;
819
+ border-radius: 50%;
820
+ -webkit-animation: spin 1s linear infinite;
821
+ animation: spin 1s linear infinite;
822
+ }
823
+
824
+ @-webkit-keyframes spin {
825
+ 0% {
826
+ -webkit-transform: translateX(-50%) rotate(0deg);
827
+ transform: translateX(-50%) rotate(0deg);
828
+ }
829
+ 100% {
830
+ -webkit-transform: translateX(-50%) rotate(360deg);
831
+ transform: translateX(-50%) rotate(360deg);
832
+ }
833
+ }
834
+
835
+ @keyframes spin {
836
+ 0% {
837
+ -webkit-transform: translateX(-50%) rotate(0deg);
838
+ transform: translateX(-50%) rotate(0deg);
839
+ }
840
+ 100% {
841
+ -webkit-transform: translateX(-50%) rotate(360deg);
842
+ transform: translateX(-50%) rotate(360deg);
843
+ }
844
+ }
809
845
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
810
846
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
811
847
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/material-dark.css CHANGED
@@ -730,6 +730,42 @@
730
730
  color: #f44336;
731
731
  }
732
732
 
733
+ .querybuilder-spinner::before {
734
+ content: "";
735
+ position: absolute;
736
+ left: 50%;
737
+ -webkit-transform: translateX(-50%);
738
+ transform: translateX(-50%);
739
+ width: 16px;
740
+ height: 16px;
741
+ border: 2px solid #7986cb;
742
+ border-top: 2px solid #3f51b5;
743
+ border-radius: 50%;
744
+ -webkit-animation: spin 1s linear infinite;
745
+ animation: spin 1s linear infinite;
746
+ }
747
+
748
+ @-webkit-keyframes spin {
749
+ 0% {
750
+ -webkit-transform: translateX(-50%) rotate(0deg);
751
+ transform: translateX(-50%) rotate(0deg);
752
+ }
753
+ 100% {
754
+ -webkit-transform: translateX(-50%) rotate(360deg);
755
+ transform: translateX(-50%) rotate(360deg);
756
+ }
757
+ }
758
+
759
+ @keyframes spin {
760
+ 0% {
761
+ -webkit-transform: translateX(-50%) rotate(0deg);
762
+ transform: translateX(-50%) rotate(0deg);
763
+ }
764
+ 100% {
765
+ -webkit-transform: translateX(-50%) rotate(360deg);
766
+ transform: translateX(-50%) rotate(360deg);
767
+ }
768
+ }
733
769
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
734
770
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
735
771
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/material.css CHANGED
@@ -745,6 +745,42 @@
745
745
  color: #f44336;
746
746
  }
747
747
 
748
+ .querybuilder-spinner::before {
749
+ content: "";
750
+ position: absolute;
751
+ left: 50%;
752
+ -webkit-transform: translateX(-50%);
753
+ transform: translateX(-50%);
754
+ width: 16px;
755
+ height: 16px;
756
+ border: 2px solid #7986cb;
757
+ border-top: 2px solid #3f51b5;
758
+ border-radius: 50%;
759
+ -webkit-animation: spin 1s linear infinite;
760
+ animation: spin 1s linear infinite;
761
+ }
762
+
763
+ @-webkit-keyframes spin {
764
+ 0% {
765
+ -webkit-transform: translateX(-50%) rotate(0deg);
766
+ transform: translateX(-50%) rotate(0deg);
767
+ }
768
+ 100% {
769
+ -webkit-transform: translateX(-50%) rotate(360deg);
770
+ transform: translateX(-50%) rotate(360deg);
771
+ }
772
+ }
773
+
774
+ @keyframes spin {
775
+ 0% {
776
+ -webkit-transform: translateX(-50%) rotate(0deg);
777
+ transform: translateX(-50%) rotate(0deg);
778
+ }
779
+ 100% {
780
+ -webkit-transform: translateX(-50%) rotate(360deg);
781
+ transform: translateX(-50%) rotate(360deg);
782
+ }
783
+ }
748
784
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
749
785
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
750
786
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/material3-dark.css CHANGED
@@ -743,6 +743,42 @@
743
743
  color: rgba(var(--color-sf-error));
744
744
  }
745
745
 
746
+ .querybuilder-spinner::before {
747
+ content: "";
748
+ position: absolute;
749
+ left: 50%;
750
+ -webkit-transform: translateX(-50%);
751
+ transform: translateX(-50%);
752
+ width: 16px;
753
+ height: 16px;
754
+ border: 2px solid var(--color-sf-primary-container);
755
+ border-top: 2px solid var(--color-sf-primary);
756
+ border-radius: 50%;
757
+ -webkit-animation: spin 1s linear infinite;
758
+ animation: spin 1s linear infinite;
759
+ }
760
+
761
+ @-webkit-keyframes spin {
762
+ 0% {
763
+ -webkit-transform: translateX(-50%) rotate(0deg);
764
+ transform: translateX(-50%) rotate(0deg);
765
+ }
766
+ 100% {
767
+ -webkit-transform: translateX(-50%) rotate(360deg);
768
+ transform: translateX(-50%) rotate(360deg);
769
+ }
770
+ }
771
+
772
+ @keyframes spin {
773
+ 0% {
774
+ -webkit-transform: translateX(-50%) rotate(0deg);
775
+ transform: translateX(-50%) rotate(0deg);
776
+ }
777
+ 100% {
778
+ -webkit-transform: translateX(-50%) rotate(360deg);
779
+ transform: translateX(-50%) rotate(360deg);
780
+ }
781
+ }
746
782
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
747
783
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
748
784
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/material3.css CHANGED
@@ -745,6 +745,42 @@
745
745
  color: rgba(var(--color-sf-error));
746
746
  }
747
747
 
748
+ .querybuilder-spinner::before {
749
+ content: "";
750
+ position: absolute;
751
+ left: 50%;
752
+ -webkit-transform: translateX(-50%);
753
+ transform: translateX(-50%);
754
+ width: 16px;
755
+ height: 16px;
756
+ border: 2px solid var(--color-sf-primary-container);
757
+ border-top: 2px solid var(--color-sf-primary);
758
+ border-radius: 50%;
759
+ -webkit-animation: spin 1s linear infinite;
760
+ animation: spin 1s linear infinite;
761
+ }
762
+
763
+ @-webkit-keyframes spin {
764
+ 0% {
765
+ -webkit-transform: translateX(-50%) rotate(0deg);
766
+ transform: translateX(-50%) rotate(0deg);
767
+ }
768
+ 100% {
769
+ -webkit-transform: translateX(-50%) rotate(360deg);
770
+ transform: translateX(-50%) rotate(360deg);
771
+ }
772
+ }
773
+
774
+ @keyframes spin {
775
+ 0% {
776
+ -webkit-transform: translateX(-50%) rotate(0deg);
777
+ transform: translateX(-50%) rotate(0deg);
778
+ }
779
+ 100% {
780
+ -webkit-transform: translateX(-50%) rotate(360deg);
781
+ transform: translateX(-50%) rotate(360deg);
782
+ }
783
+ }
748
784
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
749
785
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
750
786
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/tailwind-dark.css CHANGED
@@ -731,6 +731,42 @@
731
731
  color: #f87171;
732
732
  }
733
733
 
734
+ .querybuilder-spinner::before {
735
+ content: "";
736
+ position: absolute;
737
+ left: 50%;
738
+ -webkit-transform: translateX(-50%);
739
+ transform: translateX(-50%);
740
+ width: 16px;
741
+ height: 16px;
742
+ border: 2px solid #0891b2;
743
+ border-top: 2px solid #22d3ee;
744
+ border-radius: 50%;
745
+ -webkit-animation: spin 1s linear infinite;
746
+ animation: spin 1s linear infinite;
747
+ }
748
+
749
+ @-webkit-keyframes spin {
750
+ 0% {
751
+ -webkit-transform: translateX(-50%) rotate(0deg);
752
+ transform: translateX(-50%) rotate(0deg);
753
+ }
754
+ 100% {
755
+ -webkit-transform: translateX(-50%) rotate(360deg);
756
+ transform: translateX(-50%) rotate(360deg);
757
+ }
758
+ }
759
+
760
+ @keyframes spin {
761
+ 0% {
762
+ -webkit-transform: translateX(-50%) rotate(0deg);
763
+ transform: translateX(-50%) rotate(0deg);
764
+ }
765
+ 100% {
766
+ -webkit-transform: translateX(-50%) rotate(360deg);
767
+ transform: translateX(-50%) rotate(360deg);
768
+ }
769
+ }
734
770
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
735
771
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
736
772
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/tailwind.css CHANGED
@@ -731,6 +731,42 @@
731
731
  color: #dc2626;
732
732
  }
733
733
 
734
+ .querybuilder-spinner::before {
735
+ content: "";
736
+ position: absolute;
737
+ left: 50%;
738
+ -webkit-transform: translateX(-50%);
739
+ transform: translateX(-50%);
740
+ width: 16px;
741
+ height: 16px;
742
+ border: 2px solid #818cf8;
743
+ border-top: 2px solid #4f46e5;
744
+ border-radius: 50%;
745
+ -webkit-animation: spin 1s linear infinite;
746
+ animation: spin 1s linear infinite;
747
+ }
748
+
749
+ @-webkit-keyframes spin {
750
+ 0% {
751
+ -webkit-transform: translateX(-50%) rotate(0deg);
752
+ transform: translateX(-50%) rotate(0deg);
753
+ }
754
+ 100% {
755
+ -webkit-transform: translateX(-50%) rotate(360deg);
756
+ transform: translateX(-50%) rotate(360deg);
757
+ }
758
+ }
759
+
760
+ @keyframes spin {
761
+ 0% {
762
+ -webkit-transform: translateX(-50%) rotate(0deg);
763
+ transform: translateX(-50%) rotate(0deg);
764
+ }
765
+ 100% {
766
+ -webkit-transform: translateX(-50%) rotate(360deg);
767
+ transform: translateX(-50%) rotate(360deg);
768
+ }
769
+ }
734
770
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
735
771
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
736
772
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/query-builder/tailwind3.css CHANGED
@@ -780,6 +780,42 @@
780
780
  color: var(--color-sf-danger-bg-color);
781
781
  }
782
782
 
783
+ .querybuilder-spinner::before {
784
+ content: "";
785
+ position: absolute;
786
+ left: 50%;
787
+ -webkit-transform: translateX(-50%);
788
+ transform: translateX(-50%);
789
+ width: 16px;
790
+ height: 16px;
791
+ border: 2px solid var(--color-sf-primary-light);
792
+ border-top: 2px solid var(--color-sf-primary);
793
+ border-radius: 50%;
794
+ -webkit-animation: spin 1s linear infinite;
795
+ animation: spin 1s linear infinite;
796
+ }
797
+
798
+ @-webkit-keyframes spin {
799
+ 0% {
800
+ -webkit-transform: translateX(-50%) rotate(0deg);
801
+ transform: translateX(-50%) rotate(0deg);
802
+ }
803
+ 100% {
804
+ -webkit-transform: translateX(-50%) rotate(360deg);
805
+ transform: translateX(-50%) rotate(360deg);
806
+ }
807
+ }
808
+
809
+ @keyframes spin {
810
+ 0% {
811
+ -webkit-transform: translateX(-50%) rotate(0deg);
812
+ transform: translateX(-50%) rotate(0deg);
813
+ }
814
+ 100% {
815
+ -webkit-transform: translateX(-50%) rotate(360deg);
816
+ transform: translateX(-50%) rotate(360deg);
817
+ }
818
+ }
783
819
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
784
820
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
785
821
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/tailwind-dark-lite.css CHANGED
@@ -729,4 +729,41 @@
729
729
  .e-tooltip-wrap.e-querybuilder-error .e-tip-content,
730
730
  .e-tooltip-wrap.e-querybuilder-error .e-tip-content label {
731
731
  color: #f87171;
732
+ }
733
+
734
+ .querybuilder-spinner::before {
735
+ content: "";
736
+ position: absolute;
737
+ left: 50%;
738
+ -webkit-transform: translateX(-50%);
739
+ transform: translateX(-50%);
740
+ width: 16px;
741
+ height: 16px;
742
+ border: 2px solid #0891b2;
743
+ border-top: 2px solid #22d3ee;
744
+ border-radius: 50%;
745
+ -webkit-animation: spin 1s linear infinite;
746
+ animation: spin 1s linear infinite;
747
+ }
748
+
749
+ @-webkit-keyframes spin {
750
+ 0% {
751
+ -webkit-transform: translateX(-50%) rotate(0deg);
752
+ transform: translateX(-50%) rotate(0deg);
753
+ }
754
+ 100% {
755
+ -webkit-transform: translateX(-50%) rotate(360deg);
756
+ transform: translateX(-50%) rotate(360deg);
757
+ }
758
+ }
759
+
760
+ @keyframes spin {
761
+ 0% {
762
+ -webkit-transform: translateX(-50%) rotate(0deg);
763
+ transform: translateX(-50%) rotate(0deg);
764
+ }
765
+ 100% {
766
+ -webkit-transform: translateX(-50%) rotate(360deg);
767
+ transform: translateX(-50%) rotate(360deg);
768
+ }
732
769
  }
package/styles/tailwind-dark.css CHANGED
@@ -731,6 +731,42 @@
731
731
  color: #f87171;
732
732
  }
733
733
 
734
+ .querybuilder-spinner::before {
735
+ content: "";
736
+ position: absolute;
737
+ left: 50%;
738
+ -webkit-transform: translateX(-50%);
739
+ transform: translateX(-50%);
740
+ width: 16px;
741
+ height: 16px;
742
+ border: 2px solid #0891b2;
743
+ border-top: 2px solid #22d3ee;
744
+ border-radius: 50%;
745
+ -webkit-animation: spin 1s linear infinite;
746
+ animation: spin 1s linear infinite;
747
+ }
748
+
749
+ @-webkit-keyframes spin {
750
+ 0% {
751
+ -webkit-transform: translateX(-50%) rotate(0deg);
752
+ transform: translateX(-50%) rotate(0deg);
753
+ }
754
+ 100% {
755
+ -webkit-transform: translateX(-50%) rotate(360deg);
756
+ transform: translateX(-50%) rotate(360deg);
757
+ }
758
+ }
759
+
760
+ @keyframes spin {
761
+ 0% {
762
+ -webkit-transform: translateX(-50%) rotate(0deg);
763
+ transform: translateX(-50%) rotate(0deg);
764
+ }
765
+ 100% {
766
+ -webkit-transform: translateX(-50%) rotate(360deg);
767
+ transform: translateX(-50%) rotate(360deg);
768
+ }
769
+ }
734
770
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
735
771
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
736
772
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/tailwind-lite.css CHANGED
@@ -729,4 +729,41 @@
729
729
  .e-tooltip-wrap.e-querybuilder-error .e-tip-content,
730
730
  .e-tooltip-wrap.e-querybuilder-error .e-tip-content label {
731
731
  color: #dc2626;
732
+ }
733
+
734
+ .querybuilder-spinner::before {
735
+ content: "";
736
+ position: absolute;
737
+ left: 50%;
738
+ -webkit-transform: translateX(-50%);
739
+ transform: translateX(-50%);
740
+ width: 16px;
741
+ height: 16px;
742
+ border: 2px solid #818cf8;
743
+ border-top: 2px solid #4f46e5;
744
+ border-radius: 50%;
745
+ -webkit-animation: spin 1s linear infinite;
746
+ animation: spin 1s linear infinite;
747
+ }
748
+
749
+ @-webkit-keyframes spin {
750
+ 0% {
751
+ -webkit-transform: translateX(-50%) rotate(0deg);
752
+ transform: translateX(-50%) rotate(0deg);
753
+ }
754
+ 100% {
755
+ -webkit-transform: translateX(-50%) rotate(360deg);
756
+ transform: translateX(-50%) rotate(360deg);
757
+ }
758
+ }
759
+
760
+ @keyframes spin {
761
+ 0% {
762
+ -webkit-transform: translateX(-50%) rotate(0deg);
763
+ transform: translateX(-50%) rotate(0deg);
764
+ }
765
+ 100% {
766
+ -webkit-transform: translateX(-50%) rotate(360deg);
767
+ transform: translateX(-50%) rotate(360deg);
768
+ }
732
769
  }
package/styles/tailwind.css CHANGED
@@ -731,6 +731,42 @@
731
731
  color: #dc2626;
732
732
  }
733
733
 
734
+ .querybuilder-spinner::before {
735
+ content: "";
736
+ position: absolute;
737
+ left: 50%;
738
+ -webkit-transform: translateX(-50%);
739
+ transform: translateX(-50%);
740
+ width: 16px;
741
+ height: 16px;
742
+ border: 2px solid #818cf8;
743
+ border-top: 2px solid #4f46e5;
744
+ border-radius: 50%;
745
+ -webkit-animation: spin 1s linear infinite;
746
+ animation: spin 1s linear infinite;
747
+ }
748
+
749
+ @-webkit-keyframes spin {
750
+ 0% {
751
+ -webkit-transform: translateX(-50%) rotate(0deg);
752
+ transform: translateX(-50%) rotate(0deg);
753
+ }
754
+ 100% {
755
+ -webkit-transform: translateX(-50%) rotate(360deg);
756
+ transform: translateX(-50%) rotate(360deg);
757
+ }
758
+ }
759
+
760
+ @keyframes spin {
761
+ 0% {
762
+ -webkit-transform: translateX(-50%) rotate(0deg);
763
+ transform: translateX(-50%) rotate(0deg);
764
+ }
765
+ 100% {
766
+ -webkit-transform: translateX(-50%) rotate(360deg);
767
+ transform: translateX(-50%) rotate(360deg);
768
+ }
769
+ }
734
770
  .e-query-builder.e-device.e-multi-connector .e-rule-list .e-group-container,
735
771
  .e-bigger.e-query-builder.e-multi-connector .e-rule-list .e-group-container,
736
772
  .e-bigger .e-query-builder.e-multi-connector .e-rule-list .e-group-container {
package/styles/tailwind3-lite.css CHANGED
@@ -778,4 +778,41 @@
778
778
  .e-tooltip-wrap.e-querybuilder-error .e-tip-content,
779
779
  .e-tooltip-wrap.e-querybuilder-error .e-tip-content label {
780
780
  color: var(--color-sf-danger-bg-color);
781
+ }
782
+
783
+ .querybuilder-spinner::before {
784
+ content: "";
785
+ position: absolute;
786
+ left: 50%;
787
+ -webkit-transform: translateX(-50%);
788
+ transform: translateX(-50%);
789
+ width: 16px;
790
+ height: 16px;
791
+ border: 2px solid var(--color-sf-primary-light);
792
+ border-top: 2px solid var(--color-sf-primary);
793
+ border-radius: 50%;
794
+ -webkit-animation: spin 1s linear infinite;
795
+ animation: spin 1s linear infinite;
796
+ }
797
+
798
+ @-webkit-keyframes spin {
799
+ 0% {
800
+ -webkit-transform: translateX(-50%) rotate(0deg);
801
+ transform: translateX(-50%) rotate(0deg);
802
+ }
803
+ 100% {
804
+ -webkit-transform: translateX(-50%) rotate(360deg);
805
+ transform: translateX(-50%) rotate(360deg);
806
+ }
807
+ }
808
+
809
+ @keyframes spin {
810
+ 0% {
811
+ -webkit-transform: translateX(-50%) rotate(0deg);
812
+ transform: translateX(-50%) rotate(0deg);
813
+ }
814
+ 100% {
815
+ -webkit-transform: translateX(-50%) rotate(360deg);
816
+ transform: translateX(-50%) rotate(360deg);
817
+ }
781
818
  }