@syncfusion/ej2-vue-spreadsheet 19.4.56 → 20.1.50

package/styles/fluent.scss

@@ -0,0 +1,2 @@
+@import 'spreadsheet/fluent.scss';
+@import 'ribbon/fluent.scss';

package/styles/highcontrast-light.css

@@ -226,10 +226,18 @@
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-input.e-dialog-input {
   float: left;
   margin-right: 2.8%;
-  margin-right: 2.8%;
   width: 80%;
 }
 
+.e-spreadsheet .e-custom-format-dlg .e-footer-content {
+  padding: 0;
+}
+
+.e-spreadsheet .e-custom-format-dlg .e-dlg-content {
+  display: inline-table;
+  padding-top: 3px;
+}
+
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-custom-sample {
   margin: 10px 10px 10px 0;
 }
@@ -613,8 +621,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-t {
   background-color: #400074;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 0;
   transform: translate(-50%, -50%);
 }
@@ -631,8 +639,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-b {
   background-color: #400074;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 100%;
   transform: translate(-50%, -50%);
 }
@@ -1427,7 +1435,6 @@
 .e-spreadsheet .e-title-dlg .e-title-dlg-content .e-input {
   font-size: 14px;
   line-height: 30px;
-  padding-top: 10px;
 }
 
 .e-spreadsheet .e-datavalidation-dlg .e-validation-dlg {
@@ -1763,8 +1770,9 @@
   bottom: 0;
   float: right;
   height: 18px;
+  margin-right: -1px;
   padding: 0;
-  position: absolute;
+  position: relative;
   right: 0;
   width: 20px;
   z-index: 2;

package/styles/highcontrast.css

@@ -916,10 +916,18 @@
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-input.e-dialog-input {
   float: left;
   margin-right: 2.8%;
-  margin-right: 2.8%;
   width: 80%;
 }
 
+.e-spreadsheet .e-custom-format-dlg .e-footer-content {
+  padding: 0;
+}
+
+.e-spreadsheet .e-custom-format-dlg .e-dlg-content {
+  display: inline-table;
+  padding-top: 3px;
+}
+
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-custom-sample {
   margin: 10px 10px 10px 0;
 }
@@ -1303,8 +1311,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-t {
   background-color: #685708;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 0;
   transform: translate(-50%, -50%);
 }
@@ -1321,8 +1329,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-b {
   background-color: #685708;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 100%;
   transform: translate(-50%, -50%);
 }
@@ -2129,7 +2137,6 @@
 .e-spreadsheet .e-title-dlg .e-title-dlg-content .e-input {
   font-size: 14px;
   line-height: 30px;
-  padding-top: 10px;
 }
 
 .e-spreadsheet .e-datavalidation-dlg .e-validation-dlg {
@@ -2465,8 +2472,9 @@
   bottom: 0;
   float: right;
   height: 18px;
+  margin-right: -1px;
   padding: 0;
-  position: absolute;
+  position: relative;
   right: 0;
   width: 20px;
   z-index: 2;

package/styles/material-dark.css

@@ -952,10 +952,18 @@
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-input.e-dialog-input {
   float: left;
   margin-right: 2.8%;
-  margin-right: 2.8%;
   width: 80%;
 }
 
+.e-spreadsheet .e-custom-format-dlg .e-footer-content {
+  padding: 0;
+}
+
+.e-spreadsheet .e-custom-format-dlg .e-dlg-content {
+  display: inline-table;
+  padding-top: 3px;
+}
+
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-custom-sample {
   margin: 10px 10px 10px 0;
 }
@@ -1339,8 +1347,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-t {
   background-color: #00b0ff;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 0;
   transform: translate(-50%, -50%);
 }
@@ -1357,8 +1365,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-b {
   background-color: #00b0ff;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 100%;
   transform: translate(-50%, -50%);
 }
@@ -2153,7 +2161,6 @@
 .e-spreadsheet .e-title-dlg .e-title-dlg-content .e-input {
   font-size: 14px;
   line-height: 30px;
-  padding-top: 10px;
 }
 
 .e-spreadsheet .e-datavalidation-dlg .e-validation-dlg {
@@ -2488,13 +2495,12 @@
   bottom: 0;
   float: right;
   height: 18px;
+  margin-right: -1px;
   padding: 0;
-  position: absolute;
+  position: relative;
   right: 0;
   width: 20px;
   z-index: 2;
-  bottom: .5px;
-  right: .5px;
 }
 
 .e-colorpicker-wrapper.e-border-colorpicker {

package/styles/material.css

@@ -979,10 +979,18 @@
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-input.e-dialog-input {
   float: left;
   margin-right: 2.8%;
-  margin-right: 2.8%;
   width: 80%;
 }
 
+.e-spreadsheet .e-custom-format-dlg .e-footer-content {
+  padding: 0;
+}
+
+.e-spreadsheet .e-custom-format-dlg .e-dlg-content {
+  display: inline-table;
+  padding-top: 3px;
+}
+
 .e-spreadsheet .e-dlg-content .e-custom-dialog .e-custom-sample {
   margin: 10px 10px 10px 0;
 }
@@ -1366,8 +1374,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-t {
   background-color: #e3165b;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 0;
   transform: translate(-50%, -50%);
 }
@@ -1384,8 +1392,8 @@
 .e-spreadsheet .e-sheet .e-ss-overlay-active .e-ss-overlay-b {
   background-color: #e3165b;
   cursor: ns-resize;
-  left: 50%;
   position: absolute;
+  right: 50%;
   top: 100%;
   transform: translate(-50%, -50%);
 }
@@ -2194,7 +2202,6 @@
 .e-spreadsheet .e-title-dlg .e-title-dlg-content .e-input {
   font-size: 14px;
   line-height: 30px;
-  padding-top: 10px;
 }
 
 .e-spreadsheet .e-datavalidation-dlg .e-validation-dlg {
@@ -2529,13 +2536,12 @@
   bottom: 0;
   float: right;
   height: 18px;
+  margin-right: -1px;
   padding: 0;
-  position: absolute;
+  position: relative;
   right: 0;
   width: 20px;
   z-index: 2;
-  bottom: .5px;
-  right: .5px;
 }
 
 .e-colorpicker-wrapper.e-border-colorpicker {

package/styles/ribbon/fluent-dark.css

@@ -0,0 +1,218 @@
+.e-ribbon .e-drop-icon::before {
+  content: '\e729';
+}
+
+.e-ribbon .e-menu-wrapper.e-file-menu ul .e-menu-item .e-caret::before {
+  content: '\e729';
+}
+
+.e-ribbon {
+  border: 1px solid #292827;
+  position: relative;
+}
+
+.e-ribbon .e-tab .e-content .e-toolbar {
+  border-left-width: 0;
+  border-right-width: 0;
+}
+
+.e-ribbon .e-tab .e-tab-header {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
+  height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
+  height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-hscroll {
+  display: inline-block !important;
+  width: calc(100% - 28px);
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-tab-wrap {
+  padding: 0;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-text-wrap {
+  vertical-align: top;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-indicator {
+  z-index: 1;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item.e-hide {
+  display: none;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item {
+  -webkit-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item .e-tab-text {
+  text-transform: none;
+}
+
+.e-ribbon .e-tab.e-sheet-tab .e-tab-header .e-tab-text {
+  white-space: pre;
+}
+
+.e-ribbon .e-drop-icon {
+  cursor: pointer;
+  font-family: 'e-icons';
+  margin: 8px 4px;
+  position: absolute;
+  right: 0;
+  text-align: center;
+  top: 0;
+  transform: rotate(180deg);
+  transition: transform 300ms ease;
+  width: 18px;
+  font-size: 10px;
+}
+
+.e-ribbon .e-drop-icon.e-disabled {
+  cursor: default;
+  pointer-events: none;
+}
+
+.e-ribbon.e-collapsed .e-content,
+.e-ribbon.e-collapsed .e-indicator,
+.e-ribbon.e-collapsed .e-tab-header .e-toolbar-item.e-active .e-text-wrap::before {
+  display: none;
+}
+
+.e-ribbon.e-collapsed .e-drop-icon {
+  transform: rotate(0deg);
+}
+
+.e-ribbon .e-content .e-toolbar.e-overlay .e-toolbar-items .e-toolbar-item.e-overlay {
+  opacity: 1;
+}
+
+.e-ribbon .e-menu-wrapper {
+  border-width: 0;
+}
+
+.e-ribbon .e-menu-wrapper ul.e-menu {
+  padding: 0;
+}
+
+.e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon {
+  height: 35px;
+  line-height: 35px;
+}
+
+.e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon .e-caret {
+  line-height: 38px;
+}
+
+.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu,
+.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu {
+  padding: 0;
+}
+
+.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon,
+.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon {
+  height: 41px;
+  line-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret,
+.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret {
+  line-height: 44px;
+}
+
+.e-bigger .e-ribbon .e-drop-icon,
+.e-bigger.e-ribbon .e-drop-icon {
+  font-size: 12px;
+  margin: 16px 5px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header,
+.e-bigger.e-ribbon .e-tab .e-tab-header {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator),
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
+  height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
+  height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-items,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-items {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-ribbon {
+  background-color: #201f1e;
+}
+
+.e-ribbon .e-tab .e-tab-header {
+  background-color: inherit;
+}
+
+.e-ribbon .e-tab .e-toolbar,
+.e-ribbon .e-tab .e-toolbar-items {
+  background-color: #201f1e;
+}
+
+.e-ribbon .e-tab .e-hscroll .e-scroll-nav.e-scroll-left-nav,
+.e-ribbon .e-tab .e-hscroll .e-scroll-nav.e-scroll-right-nav {
+  background-color: #201f1e;
+}
+
+.e-ribbon .e-drop-icon {
+  color: #a19f9d;
+}
+
+.e-ribbon .e-tab .e-content .e-toolbar {
+  border-bottom-color: transparent;
+  border-top-color: transparent;
+  box-shadow: none;
+}
+
+.e-ribbon .e-menu-wrapper {
+  background-color: transparent;
+}

package/styles/ribbon/fluent-dark.scss

@@ -0,0 +1 @@
+@import 'ej2-spreadsheet/styles/ribbon/fluent-dark.scss';

package/styles/ribbon/fluent.css

@@ -0,0 +1,218 @@
+.e-ribbon .e-drop-icon::before {
+  content: '\e729';
+}
+
+.e-ribbon .e-menu-wrapper.e-file-menu ul .e-menu-item .e-caret::before {
+  content: '\e729';
+}
+
+.e-ribbon {
+  border: 1px solid #edebe9;
+  position: relative;
+}
+
+.e-ribbon .e-tab .e-content .e-toolbar {
+  border-left-width: 0;
+  border-right-width: 0;
+}
+
+.e-ribbon .e-tab .e-tab-header {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
+  height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
+  height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
+  height: 35px;
+  min-height: 35px;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-hscroll {
+  display: inline-block !important;
+  width: calc(100% - 28px);
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-tab-wrap {
+  padding: 0;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item:nth-child(2) .e-text-wrap {
+  vertical-align: top;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-indicator {
+  z-index: 1;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-toolbar-item.e-hide {
+  display: none;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item {
+  -webkit-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+
+.e-ribbon .e-tab .e-tab-header .e-toolbar-item .e-tab-text {
+  text-transform: none;
+}
+
+.e-ribbon .e-tab.e-sheet-tab .e-tab-header .e-tab-text {
+  white-space: pre;
+}
+
+.e-ribbon .e-drop-icon {
+  cursor: pointer;
+  font-family: 'e-icons';
+  margin: 8px 4px;
+  position: absolute;
+  right: 0;
+  text-align: center;
+  top: 0;
+  transform: rotate(180deg);
+  transition: transform 300ms ease;
+  width: 18px;
+  font-size: 10px;
+}
+
+.e-ribbon .e-drop-icon.e-disabled {
+  cursor: default;
+  pointer-events: none;
+}
+
+.e-ribbon.e-collapsed .e-content,
+.e-ribbon.e-collapsed .e-indicator,
+.e-ribbon.e-collapsed .e-tab-header .e-toolbar-item.e-active .e-text-wrap::before {
+  display: none;
+}
+
+.e-ribbon.e-collapsed .e-drop-icon {
+  transform: rotate(0deg);
+}
+
+.e-ribbon .e-content .e-toolbar.e-overlay .e-toolbar-items .e-toolbar-item.e-overlay {
+  opacity: 1;
+}
+
+.e-ribbon .e-menu-wrapper {
+  border-width: 0;
+}
+
+.e-ribbon .e-menu-wrapper ul.e-menu {
+  padding: 0;
+}
+
+.e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon {
+  height: 35px;
+  line-height: 35px;
+}
+
+.e-ribbon .e-menu-wrapper ul .e-menu-item.e-menu-caret-icon .e-caret {
+  line-height: 38px;
+}
+
+.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu,
+.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu {
+  padding: 0;
+}
+
+.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon,
+.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon {
+  height: 41px;
+  line-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret,
+.e-bigger.e-ribbon .e-menu-wrapper.e-file-menu ul.e-menu .e-menu-item.e-menu-caret-icon .e-caret {
+  line-height: 44px;
+}
+
+.e-bigger .e-ribbon .e-drop-icon,
+.e-bigger.e-ribbon .e-drop-icon {
+  font-size: 12px;
+  margin: 16px 5px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header,
+.e-bigger.e-ribbon .e-tab .e-tab-header {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator),
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-tab-wrap {
+  height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-item:not(.e-separator) .e-text-wrap {
+  height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-items,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-items {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-bigger .e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav,
+.e-bigger.e-ribbon .e-tab .e-tab-header .e-toolbar-items .e-scroll-nav {
+  height: 41px;
+  min-height: 41px;
+}
+
+.e-ribbon {
+  background-color: #faf9f8;
+}
+
+.e-ribbon .e-tab .e-tab-header {
+  background-color: inherit;
+}
+
+.e-ribbon .e-tab .e-toolbar,
+.e-ribbon .e-tab .e-toolbar-items {
+  background-color: #faf9f8;
+}
+
+.e-ribbon .e-tab .e-hscroll .e-scroll-nav.e-scroll-left-nav,
+.e-ribbon .e-tab .e-hscroll .e-scroll-nav.e-scroll-right-nav {
+  background-color: #faf9f8;
+}
+
+.e-ribbon .e-drop-icon {
+  color: #605e5c;
+}
+
+.e-ribbon .e-tab .e-content .e-toolbar {
+  border-bottom-color: transparent;
+  border-top-color: transparent;
+  box-shadow: none;
+}
+
+.e-ribbon .e-menu-wrapper {
+  background-color: transparent;
+}

package/styles/ribbon/fluent.scss

@@ -0,0 +1 @@
+@import 'ej2-spreadsheet/styles/ribbon/fluent.scss';

package/styles/ribbon/tailwind-dark.css

@@ -1,10 +1,10 @@
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
 .e-ribbon .e-drop-icon::before {
-  content: '\e706';
+  content: '\e729';
 }
 
 .e-ribbon .e-menu-wrapper.e-file-menu ul .e-menu-item .e-caret::before {
-  content: '\e706';
+  content: '\e729';
 }
 
 .e-ribbon {

package/styles/ribbon/tailwind.css

@@ -1,10 +1,10 @@
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
 .e-ribbon .e-drop-icon::before {
-  content: '\e706';
+  content: '\e729';
 }
 
 .e-ribbon .e-menu-wrapper.e-file-menu ul .e-menu-item .e-caret::before {
-  content: '\e706';
+  content: '\e729';
 }
 
 .e-ribbon {