@syncfusion/ej2-vue-pivotview 22.2.11 → 23.1.36

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 (61) hide show
  1. package/CHANGELOG.md +15 -60
  2. package/dist/ej2-vue-pivotview.umd.min.js +1 -1
  3. package/dist/global/ej2-vue-pivotview.min.js +2 -2
  4. package/package.json +9 -9
  5. package/src/pivotfieldlist/pivotfieldlist.component.d.ts +3 -1
  6. package/src/pivotview/pivotview.component.d.ts +3 -1
  7. package/styles/bootstrap-dark.css +56 -20
  8. package/styles/bootstrap.css +57 -21
  9. package/styles/bootstrap4.css +56 -20
  10. package/styles/bootstrap5-dark.css +56 -22
  11. package/styles/bootstrap5.css +56 -22
  12. package/styles/fabric-dark.css +56 -22
  13. package/styles/fabric.css +56 -20
  14. package/styles/fluent-dark.css +56 -21
  15. package/styles/fluent.css +56 -21
  16. package/styles/highcontrast-light.css +55 -20
  17. package/styles/highcontrast.css +55 -20
  18. package/styles/material-dark.css +55 -20
  19. package/styles/material.css +55 -20
  20. package/styles/material3-dark.css +55 -22
  21. package/styles/material3.css +55 -21
  22. package/styles/pivotfieldlist/bootstrap-dark.css +1 -1
  23. package/styles/pivotfieldlist/bootstrap.css +1 -1
  24. package/styles/pivotfieldlist/bootstrap4.css +1 -1
  25. package/styles/pivotfieldlist/bootstrap5-dark.css +1 -1
  26. package/styles/pivotfieldlist/bootstrap5.css +1 -1
  27. package/styles/pivotfieldlist/fabric-dark.css +1 -1
  28. package/styles/pivotfieldlist/fabric.css +1 -1
  29. package/styles/pivotfieldlist/fluent-dark.css +1 -1
  30. package/styles/pivotfieldlist/fluent.css +1 -1
  31. package/styles/pivotfieldlist/highcontrast-light.css +1 -1
  32. package/styles/pivotfieldlist/highcontrast.css +1 -1
  33. package/styles/pivotfieldlist/material-dark.css +1 -2
  34. package/styles/pivotfieldlist/material.css +1 -2
  35. package/styles/pivotfieldlist/material3-dark.css +1 -2
  36. package/styles/pivotfieldlist/material3-dark.scss +1 -1
  37. package/styles/pivotfieldlist/material3.css +1 -2
  38. package/styles/pivotfieldlist/material3.scss +1 -1
  39. package/styles/pivotfieldlist/tailwind-dark.css +1 -2
  40. package/styles/pivotfieldlist/tailwind.css +1 -2
  41. package/styles/pivotview/bootstrap-dark.css +55 -19
  42. package/styles/pivotview/bootstrap.css +56 -20
  43. package/styles/pivotview/bootstrap4.css +55 -19
  44. package/styles/pivotview/bootstrap5-dark.css +55 -21
  45. package/styles/pivotview/bootstrap5.css +55 -21
  46. package/styles/pivotview/fabric-dark.css +55 -21
  47. package/styles/pivotview/fabric.css +55 -19
  48. package/styles/pivotview/fluent-dark.css +55 -20
  49. package/styles/pivotview/fluent.css +55 -20
  50. package/styles/pivotview/highcontrast-light.css +54 -19
  51. package/styles/pivotview/highcontrast.css +54 -19
  52. package/styles/pivotview/material-dark.css +54 -19
  53. package/styles/pivotview/material.css +54 -19
  54. package/styles/pivotview/material3-dark.css +54 -20
  55. package/styles/pivotview/material3-dark.scss +1 -1
  56. package/styles/pivotview/material3.css +54 -20
  57. package/styles/pivotview/material3.scss +1 -1
  58. package/styles/pivotview/tailwind-dark.css +54 -21
  59. package/styles/pivotview/tailwind.css +54 -21
  60. package/styles/tailwind-dark.css +55 -23
  61. package/styles/tailwind.css +55 -23
@@ -1,8 +1,6 @@
1
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
2
1
  /*! component's theme wise override definitions and variables */
3
2
  /*! component's common definitions and variables */
4
3
  /* pivot-pager */
5
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
6
4
  .e-pivotview .e-expand::before {
7
5
  content: "\e75c";
8
6
  }
@@ -160,6 +158,8 @@
160
158
  /* stylelint-disable */
161
159
  /* stylelint-enable */
162
160
  /* stylelint-enable */
161
+ /* stylelint-disable */
162
+ /* stylelint-enable */
163
163
  }
164
164
  .e-pivotview .e-value-field-settings,
165
165
  .e-pivotview .e-member-editor-dialog,
@@ -637,6 +637,9 @@
637
637
  .e-pivotview .e-frozenscrollbar {
638
638
  background: #232e3e;
639
639
  }
640
+ .e-pivotview .e-headercontent .e-columnheader .e-headercell.e-leftfreeze {
641
+ -webkit-transform: translate3d(0, 0, 0);
642
+ }
640
643
 
641
644
  .e-pivotview-disable-icon {
642
645
  visibility: hidden;
@@ -917,7 +920,6 @@
917
920
 
918
921
  /*! PivotView theme */
919
922
  .e-pivotview {
920
- /* stylelint-enable */
921
923
  /* stylelint-enable */
922
924
  /* stylelint-disable */
923
925
  /* stylelint-enable */
@@ -928,6 +930,8 @@
928
930
  /* stylelint-enable */
929
931
  }
930
932
  .e-pivotview .e-pivotcell-container {
933
+ -ms-flex-align: center;
934
+ align-items: center;
931
935
  display: -ms-flexbox;
932
936
  display: flex;
933
937
  }
@@ -973,14 +977,23 @@
973
977
  -ms-user-select: none;
974
978
  user-select: none;
975
979
  }
980
+ .e-pivotview .e-grid .e-content-virtualtable {
981
+ overflow-x: auto;
982
+ scrollbar-width: none; /* firefox */
983
+ }
984
+ .e-pivotview .e-grid .e-content-virtualtable::-webkit-scrollbar {
985
+ display: none; /* safari, chrome and edge */
986
+ }
976
987
  .e-pivotview .e-gtot,
977
988
  .e-pivotview .e-gtot.e-rowsheader,
978
989
  .e-pivotview .e-gtot.e-columnsheader,
979
990
  .e-pivotview .e-grid .e-content,
980
- .e-pivotview .e-grid .e-gridheader,
981
- .e-pivotview .e-headercell {
991
+ .e-pivotview .e-grid .e-gridheader {
982
992
  background: #232e3e;
983
993
  }
994
+ .e-pivotview .e-headercell:not(.e-columnsheader) {
995
+ background: #232e3e !important;
996
+ }
984
997
  .e-pivotview .e-grid .e-gridheader {
985
998
  border-bottom-width: 1px;
986
999
  }
@@ -1077,9 +1090,6 @@
1077
1090
  .e-pivotview .e-drop-indicator {
1078
1091
  display: block;
1079
1092
  }
1080
- .e-pivotview div.e-cellvalue {
1081
- margin-top: 2px;
1082
- }
1083
1093
  .e-pivotview .e-sortfilterdiv .e-value-sort-icon {
1084
1094
  float: right;
1085
1095
  }
@@ -1089,10 +1099,17 @@
1089
1099
  .e-pivotview .e-sortfilterdiv:not(.e-value-sort-icon) {
1090
1100
  display: none;
1091
1101
  }
1102
+ .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv, .e-pivotview .e-headercelldiv .e-sortfilterdiv {
1103
+ margin: -18px 0 !important;
1104
+ }
1105
+ .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-pivotview .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
1106
+ margin: 0 !important;
1107
+ }
1092
1108
  .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv, .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-pivotview .e-headercelldiv .e-sortfilterdiv, .e-pivotview .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
1093
1109
  margin: 0 !important;
1094
1110
  margin-left: auto !important;
1095
- margin-top: 2px !important;
1111
+ padding-bottom: 0 !important;
1112
+ padding-top: 0 !important;
1096
1113
  }
1097
1114
  .e-pivotview .e-rowsheader .e-sortfilterdiv {
1098
1115
  margin: -4px 0 !important;
@@ -1128,9 +1145,25 @@
1128
1145
  }
1129
1146
  .e-pivotview.sf-pivotview .e-spinner-pane.e-pivot-outer-spinner .e-spinner-inner {
1130
1147
  visibility: hidden !important;
1148
+ /* stylelint-enable */
1149
+ }
1150
+ .e-pivotview.sf-pivotview .e-grid .e-pivot-content-loader {
1151
+ position: absolute;
1152
+ z-index: 10;
1153
+ color: #22d3ee;
1154
+ font-size: 20px;
1155
+ text-align: center;
1156
+ padding: 10%;
1157
+ }
1158
+ .e-pivotview.sf-pivotview .e-grid .e-pivot-content-loader.e-hide-loader {
1159
+ display: none;
1160
+ }
1161
+ .e-pivotview.sf-pivotview .e-grid .e-virtual-pivot-content {
1162
+ visibility: hidden;
1131
1163
  }
1132
1164
  .e-pivotview .e-grid .e-headercelldiv,
1133
1165
  .e-pivotview .e-grid .e-columnsheader {
1166
+ /* stylelint-disable */
1134
1167
  padding-left: 8px !important;
1135
1168
  text-transform: none;
1136
1169
  padding-top: 0px !important;
@@ -1154,6 +1187,14 @@
1154
1187
  border-left: 0;
1155
1188
  border-right-width: 1px;
1156
1189
  }
1190
+ .e-pivotview .e-leftfreeze.e-freezeleftborder {
1191
+ border-left-color: #4b5563 !important;
1192
+ border-right-color: #4b5563 !important;
1193
+ border-right-width: 1px !important;
1194
+ }
1195
+ .e-pivotview .e-leftfreeze.e-freezeleftborder:not(.e-gtot) {
1196
+ background: #232e3e;
1197
+ }
1157
1198
  .e-pivotview .e-stackedheadercelldiv {
1158
1199
  display: block;
1159
1200
  }
@@ -1161,9 +1202,6 @@
1161
1202
  .e-pivotview .e-stackedheadercelldiv.e-cellvalue {
1162
1203
  display: inline-block;
1163
1204
  padding-left: 12px !important;
1164
- margin-top: 5px;
1165
- margin-top: 2px;
1166
- padding-left: 8px !important;
1167
1205
  }
1168
1206
  .e-pivotview .e-stackedheadercelldiv {
1169
1207
  padding: 0 0 0 1px !important;
@@ -1660,8 +1698,6 @@
1660
1698
  cursor: pointer;
1661
1699
  display: inline-block;
1662
1700
  height: 18px;
1663
- margin-top: 0;
1664
- margin-bottom: 0;
1665
1701
  text-align: center;
1666
1702
  width: 18px;
1667
1703
  vertical-align: middle;
@@ -1670,8 +1706,6 @@
1670
1706
  .e-pivotview th .e-collapse {
1671
1707
  font-size: 10px !important;
1672
1708
  margin-left: 0px;
1673
- margin-top: 0;
1674
- margin-bottom: 0;
1675
1709
  }
1676
1710
  .e-pivotview .e-expand::before {
1677
1711
  font-size: 18px;
@@ -2035,6 +2069,10 @@
2035
2069
  border-left-width: 1px;
2036
2070
  border-right: 0;
2037
2071
  }
2072
+ .e-pivotview.e-rtl .e-leftfreeze.e-freezeleftborder {
2073
+ border-left-width: 1px;
2074
+ border-right: 0;
2075
+ }
2038
2076
  .e-pivotview.e-rtl .e-rowsheader .e-cellvalue {
2039
2077
  margin-left: 0;
2040
2078
  margin-right: 7px;
@@ -2269,12 +2307,6 @@
2269
2307
  .e-bigger.e-pivotview .e-bigger .e-stackedheadercelldiv {
2270
2308
  padding-left: 16px !important;
2271
2309
  }
2272
- .e-bigger .e-pivotview th .e-expand,
2273
- .e-bigger .e-pivotview th .e-collapse,
2274
- .e-bigger.e-pivotview th .e-expand,
2275
- .e-bigger.e-pivotview th .e-collapse {
2276
- margin-top: 0;
2277
- }
2278
2310
  .e-bigger .e-pivotview .e-grouping-bar,
2279
2311
  .e-bigger.e-pivotview .e-grouping-bar {
2280
2312
  /* stylelint-enable */
@@ -3269,7 +3301,7 @@
3269
3301
  width: 100% !important;
3270
3302
  }
3271
3303
  .e-pivot-formatting-dialog.e-device .e-format-condition-button .e-add-icon {
3272
- margin-left: 0;
3304
+ margin-left: 0 !important;
3273
3305
  }
3274
3306
  .e-pivot-formatting-dialog.e-device .e-format-value1,
3275
3307
  .e-pivot-formatting-dialog.e-device .e-format-value2,
@@ -1,10 +1,8 @@
1
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
2
1
  /*! component's theme wise override definitions and variables */
3
2
  /*! component's common definitions and variables */
4
3
  /*! component's theme wise override definitions and variables */
5
4
  /*! component's common definitions and variables */
6
5
  /* pivot-pager */
7
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
8
6
  .e-pivotview .e-expand::before {
9
7
  content: "\e75c";
10
8
  }
@@ -162,6 +160,8 @@
162
160
  /* stylelint-disable */
163
161
  /* stylelint-enable */
164
162
  /* stylelint-enable */
163
+ /* stylelint-disable */
164
+ /* stylelint-enable */
165
165
  }
166
166
  .e-pivotview .e-value-field-settings,
167
167
  .e-pivotview .e-member-editor-dialog,
@@ -639,6 +639,9 @@
639
639
  .e-pivotview .e-frozenscrollbar {
640
640
  background: #f9fafb;
641
641
  }
642
+ .e-pivotview .e-headercontent .e-columnheader .e-headercell.e-leftfreeze {
643
+ -webkit-transform: translate3d(0, 0, 0);
644
+ }
642
645
 
643
646
  .e-pivotview-disable-icon {
644
647
  visibility: hidden;
@@ -919,7 +922,6 @@
919
922
 
920
923
  /*! PivotView theme */
921
924
  .e-pivotview {
922
- /* stylelint-enable */
923
925
  /* stylelint-enable */
924
926
  /* stylelint-disable */
925
927
  /* stylelint-enable */
@@ -930,6 +932,8 @@
930
932
  /* stylelint-enable */
931
933
  }
932
934
  .e-pivotview .e-pivotcell-container {
935
+ -ms-flex-align: center;
936
+ align-items: center;
933
937
  display: -ms-flexbox;
934
938
  display: flex;
935
939
  }
@@ -975,14 +979,23 @@
975
979
  -ms-user-select: none;
976
980
  user-select: none;
977
981
  }
982
+ .e-pivotview .e-grid .e-content-virtualtable {
983
+ overflow-x: auto;
984
+ scrollbar-width: none; /* firefox */
985
+ }
986
+ .e-pivotview .e-grid .e-content-virtualtable::-webkit-scrollbar {
987
+ display: none; /* safari, chrome and edge */
988
+ }
978
989
  .e-pivotview .e-gtot,
979
990
  .e-pivotview .e-gtot.e-rowsheader,
980
991
  .e-pivotview .e-gtot.e-columnsheader,
981
992
  .e-pivotview .e-grid .e-content,
982
- .e-pivotview .e-grid .e-gridheader,
983
- .e-pivotview .e-headercell {
993
+ .e-pivotview .e-grid .e-gridheader {
984
994
  background: #f9fafb;
985
995
  }
996
+ .e-pivotview .e-headercell:not(.e-columnsheader) {
997
+ background: #f9fafb !important;
998
+ }
986
999
  .e-pivotview .e-grid .e-gridheader {
987
1000
  border-bottom-width: 1px;
988
1001
  }
@@ -1079,9 +1092,6 @@
1079
1092
  .e-pivotview .e-drop-indicator {
1080
1093
  display: block;
1081
1094
  }
1082
- .e-pivotview div.e-cellvalue {
1083
- margin-top: 2px;
1084
- }
1085
1095
  .e-pivotview .e-sortfilterdiv .e-value-sort-icon {
1086
1096
  float: right;
1087
1097
  }
@@ -1091,10 +1101,17 @@
1091
1101
  .e-pivotview .e-sortfilterdiv:not(.e-value-sort-icon) {
1092
1102
  display: none;
1093
1103
  }
1104
+ .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv, .e-pivotview .e-headercelldiv .e-sortfilterdiv {
1105
+ margin: -18px 0 !important;
1106
+ }
1107
+ .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-pivotview .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
1108
+ margin: 0 !important;
1109
+ }
1094
1110
  .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv, .e-pivotview .e-stackedheadercelldiv .e-sortfilterdiv.e-value-sort-align, .e-pivotview .e-headercelldiv .e-sortfilterdiv, .e-pivotview .e-headercelldiv .e-sortfilterdiv.e-value-sort-align {
1095
1111
  margin: 0 !important;
1096
1112
  margin-left: auto !important;
1097
- margin-top: 2px !important;
1113
+ padding-bottom: 0 !important;
1114
+ padding-top: 0 !important;
1098
1115
  }
1099
1116
  .e-pivotview .e-rowsheader .e-sortfilterdiv {
1100
1117
  margin: -4px 0 !important;
@@ -1130,9 +1147,25 @@
1130
1147
  }
1131
1148
  .e-pivotview.sf-pivotview .e-spinner-pane.e-pivot-outer-spinner .e-spinner-inner {
1132
1149
  visibility: hidden !important;
1150
+ /* stylelint-enable */
1151
+ }
1152
+ .e-pivotview.sf-pivotview .e-grid .e-pivot-content-loader {
1153
+ position: absolute;
1154
+ z-index: 10;
1155
+ color: #4f46e5;
1156
+ font-size: 20px;
1157
+ text-align: center;
1158
+ padding: 10%;
1159
+ }
1160
+ .e-pivotview.sf-pivotview .e-grid .e-pivot-content-loader.e-hide-loader {
1161
+ display: none;
1162
+ }
1163
+ .e-pivotview.sf-pivotview .e-grid .e-virtual-pivot-content {
1164
+ visibility: hidden;
1133
1165
  }
1134
1166
  .e-pivotview .e-grid .e-headercelldiv,
1135
1167
  .e-pivotview .e-grid .e-columnsheader {
1168
+ /* stylelint-disable */
1136
1169
  padding-left: 8px !important;
1137
1170
  text-transform: none;
1138
1171
  padding-top: 0px !important;
@@ -1156,6 +1189,14 @@
1156
1189
  border-left: 0;
1157
1190
  border-right-width: 1px;
1158
1191
  }
1192
+ .e-pivotview .e-leftfreeze.e-freezeleftborder {
1193
+ border-left-color: #e5e7eb !important;
1194
+ border-right-color: #e5e7eb !important;
1195
+ border-right-width: 1px !important;
1196
+ }
1197
+ .e-pivotview .e-leftfreeze.e-freezeleftborder:not(.e-gtot) {
1198
+ background: #f9fafb;
1199
+ }
1159
1200
  .e-pivotview .e-stackedheadercelldiv {
1160
1201
  display: block;
1161
1202
  }
@@ -1163,9 +1204,6 @@
1163
1204
  .e-pivotview .e-stackedheadercelldiv.e-cellvalue {
1164
1205
  display: inline-block;
1165
1206
  padding-left: 12px !important;
1166
- margin-top: 5px;
1167
- margin-top: 2px;
1168
- padding-left: 8px !important;
1169
1207
  }
1170
1208
  .e-pivotview .e-stackedheadercelldiv {
1171
1209
  padding: 0 0 0 1px !important;
@@ -1662,8 +1700,6 @@
1662
1700
  cursor: pointer;
1663
1701
  display: inline-block;
1664
1702
  height: 18px;
1665
- margin-top: 0;
1666
- margin-bottom: 0;
1667
1703
  text-align: center;
1668
1704
  width: 18px;
1669
1705
  vertical-align: middle;
@@ -1672,8 +1708,6 @@
1672
1708
  .e-pivotview th .e-collapse {
1673
1709
  font-size: 10px !important;
1674
1710
  margin-left: 0px;
1675
- margin-top: 0;
1676
- margin-bottom: 0;
1677
1711
  }
1678
1712
  .e-pivotview .e-expand::before {
1679
1713
  font-size: 18px;
@@ -2037,6 +2071,10 @@
2037
2071
  border-left-width: 1px;
2038
2072
  border-right: 0;
2039
2073
  }
2074
+ .e-pivotview.e-rtl .e-leftfreeze.e-freezeleftborder {
2075
+ border-left-width: 1px;
2076
+ border-right: 0;
2077
+ }
2040
2078
  .e-pivotview.e-rtl .e-rowsheader .e-cellvalue {
2041
2079
  margin-left: 0;
2042
2080
  margin-right: 7px;
@@ -2271,12 +2309,6 @@
2271
2309
  .e-bigger.e-pivotview .e-bigger .e-stackedheadercelldiv {
2272
2310
  padding-left: 16px !important;
2273
2311
  }
2274
- .e-bigger .e-pivotview th .e-expand,
2275
- .e-bigger .e-pivotview th .e-collapse,
2276
- .e-bigger.e-pivotview th .e-expand,
2277
- .e-bigger.e-pivotview th .e-collapse {
2278
- margin-top: 0;
2279
- }
2280
2312
  .e-bigger .e-pivotview .e-grouping-bar,
2281
2313
  .e-bigger.e-pivotview .e-grouping-bar {
2282
2314
  /* stylelint-enable */
@@ -3272,7 +3304,7 @@
3272
3304
  width: 100% !important;
3273
3305
  }
3274
3306
  .e-pivot-formatting-dialog.e-device .e-format-condition-button .e-add-icon {
3275
- margin-left: 0;
3307
+ margin-left: 0 !important;
3276
3308
  }
3277
3309
  .e-pivot-formatting-dialog.e-device .e-format-value1,
3278
3310
  .e-pivot-formatting-dialog.e-device .e-format-value2,