@datorama/core 22.11.2 → 22.12.1-beta.1

package/bundle.scss

@@ -5206,7 +5206,7 @@ dato-list-v2 .checkmark {
     line-height: 19px;
 }
 
-.simple-bold, .dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label span {
+.simple-bold, .dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label span {
     font-size: 14px;
     font-weight: 600;
     line-height: 19px;
@@ -6223,7 +6223,7 @@ dato-grid-header span {
     border-left: none;
 }
 
-.ag-dato-core .ag-row-hover, .ag-dato-core .dato-grid.pivot-mode .ag-row.ag-row-group.ag-row-hover .ag-cell.ag-cell-value, .dato-grid.pivot-mode .ag-row.ag-row-group.ag-row-hover .ag-dato-core .ag-cell.ag-cell-value {
+.ag-dato-core .ag-row-hover, .ag-dato-core .dato-grid.pivot-style .ag-row.ag-row-group.ag-row-hover .ag-cell.ag-cell-value, .dato-grid.pivot-style .ag-row.ag-row-group.ag-row-hover .ag-dato-core .ag-cell.ag-cell-value {
     background-color: themify(accent-100);
 }
 
@@ -11287,7 +11287,7 @@ dato-button-group.is-round-edges dato-button:last-of-type button {
     line-height: 19px;
 }
 
-.simple-bold, .dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label span {
+.simple-bold, .dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label span {
     font-size: 14px;
     font-weight: 600;
     line-height: 19px;
@@ -11376,6 +11376,7 @@ dato-button-group.is-round-edges dato-button:last-of-type button {
 
 /* Header Theme */
 /* Row Theme */
+/* Row Group Theme */
 dato-input input {
     background-color: themify(primary-0);
     border: themify(primary-200) 1px solid;
@@ -12355,7 +12356,7 @@ dato-input input:disabled:hover {
     border-left: none;
 }
 
-.dato-grid .ag-row-hover, .dato-grid.pivot-mode .ag-row.ag-row-group.ag-row-hover .ag-cell.ag-cell-value {
+.dato-grid .ag-row-hover, .dato-grid.pivot-style .ag-row.ag-row-group.ag-row-hover .ag-cell.ag-cell-value {
     background-color: themify(accent-100);
 }
 
@@ -14060,38 +14061,19 @@ dato-input input:disabled:hover {
     fill: themify(accent-400);
 }
 
-.dato-grid:not(.pivot-mode) .ag-row {
+.dato-grid .ag-row {
     cursor: pointer;
 }
 
-.dato-grid:not(.pivot-mode) .ag-row.ag-row-group {
-    background-color: themify(primary-0);
-    border-bottom: solid 1px themify(primary-200);
-    height: 35px;
-}
-
-.dato-grid:not(.pivot-mode) .ag-row.ag-row-group span {
-    color: themify(primary-300);
-    font-weight: 600;
-}
-
-.dato-grid:not(.pivot-mode) .ag-row.ag-row-group:hover span {
-    color: themify(accent-400);
-}
-
-.dato-grid:not(.pivot-mode) .ag-row.ag-row-group:hover .da-grid-icon {
-    fill: themify(accent-400);
-}
-
-.dato-grid:not(.pivot-mode) .ag-row.ag-row-selected.ag-row-even {
+.dato-grid .ag-row.ag-row-selected.ag-row-even {
     background-color: themify(accent-180);
 }
 
-.dato-grid:not(.pivot-mode) .ag-row.actions-hovered:not(.ag-row-selected) {
+.dato-grid .ag-row.actions-hovered:not(.ag-row-selected) {
     background-color: themify(accent-100);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox {
+.dato-grid .ag-cell .ag-selection-checkbox {
     display: block;
     position: relative;
     cursor: pointer;
@@ -14104,7 +14086,7 @@ dato-input input:disabled:hover {
     margin-top: -1px;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon {
     height: 100%;
     width: 100%;
     border-radius: 2px;
@@ -14113,7 +14095,7 @@ dato-input input:disabled:hover {
     left: 0;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon:after {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon:after {
     content: "";
     position: absolute;
     display: none;
@@ -14127,52 +14109,52 @@ dato-input input:disabled:hover {
     box-sizing: border-box;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked {
     background-color: themify(accent-400);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:hover {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:hover {
     background-color: themify(accent-500);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:active {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:active {
     background-color: themify(accent-600);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:after {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:after {
     display: block;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked,
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked,
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate {
     background-color: themify(primary-0);
     border: solid 1px themify(primary-300);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked:hover,
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate:hover {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked:hover,
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate:hover {
     border-color: themify(accent-500);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked:active,
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate:active {
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked:active,
+.dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate:active {
     border-color: themify(accent-600);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .ag-selection-checkbox + span.ag-cell-value {
+.dato-grid .ag-cell .ag-selection-checkbox + span.ag-cell-value {
     display: inline;
     margin-left: 12px;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell .search-highlight {
+.dato-grid .ag-cell .search-highlight {
     background-color: #FDF2CF;
 }
 
-.dato-grid:not(.pivot-mode) .dato-editable-cell {
+.dato-grid .dato-editable-cell {
     padding: 2px 0;
 }
 
-.dato-grid:not(.pivot-mode) .dato-editable-cell .value-wrapper {
+.dato-grid .dato-editable-cell .value-wrapper {
     min-height: 31px;
     line-height: 29px;
     margin: 0 2px;
@@ -14181,69 +14163,69 @@ dato-input input:disabled:hover {
     border: 1px solid transparent;
 }
 
-.dato-grid:not(.pivot-mode) .dato-editable-cell:hover .value-wrapper {
+.dato-grid .dato-editable-cell:hover .value-wrapper {
     border-color: themify(accent-400);
 }
 
-.dato-grid:not(.pivot-mode) .dato-editable-cell.ag-cell-not-inline-editing {
+.dato-grid .dato-editable-cell.ag-cell-not-inline-editing {
     display: flex;
     align-items: center;
 }
 
-.dato-grid:not(.pivot-mode) .dato-editable-cell.ag-cell-not-inline-editing .ag-input-text-wrapper, .dato-grid:not(.pivot-mode) .dato-editable-cell.ag-cell-not-inline-editing > span {
+.dato-grid .dato-editable-cell.ag-cell-not-inline-editing .ag-input-text-wrapper, .dato-grid .dato-editable-cell.ag-cell-not-inline-editing > span {
     width: 100%;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell-highlight {
+.dato-grid .ag-cell-highlight {
     background-color: transparent !important;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell-highlight-animation {
+.dato-grid .ag-cell-highlight-animation {
     transition: background-color 1s;
 }
 
-.dato-grid:not(.pivot-mode) .ag-row-drag {
+.dato-grid .ag-row-drag {
     background-position-y: center;
 }
 
-.dato-grid:not(.pivot-mode) .ag-column-drag {
+.dato-grid .ag-column-drag {
     background-position-y: center;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell-range-selected-1:not(.ag-cell-focus) {
+.dato-grid .ag-cell-range-selected-1:not(.ag-cell-focus) {
     background-color: rgba(120, 120, 120, 0.4);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell-range-selected-2:not(.ag-cell-focus) {
+.dato-grid .ag-cell-range-selected-2:not(.ag-cell-focus) {
     background-color: rgba(110, 110, 110, 0.4);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell-range-selected-3:not(.ag-cell-focus) {
+.dato-grid .ag-cell-range-selected-3:not(.ag-cell-focus) {
     background-color: rgba(100, 100, 100, 0.4);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell-range-selected-4:not(.ag-cell-focus) {
+.dato-grid .ag-cell-range-selected-4:not(.ag-cell-focus) {
     background-color: rgba(89, 89, 89, 0.4);
 }
 
-.dato-grid:not(.pivot-mode) .ag-ltr .ag-has-focus .ag-cell-focus {
+.dato-grid .ag-ltr .ag-has-focus .ag-cell-focus {
     border-color: transparent;
 }
 
-.dato-grid:not(.pivot-mode) .ag-row.ag-row-even .ag-cell-inline-editing {
+.dato-grid .ag-row.ag-row-even .ag-cell-inline-editing {
     background-color: themify(accent-180);
 }
 
-.dato-grid:not(.pivot-mode) .ag-row.ag-row-odd .ag-cell-inline-editing {
+.dato-grid .ag-row.ag-row-odd .ag-cell-inline-editing {
     background-color: themify(accent-200);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing {
+.dato-grid .ag-cell.ag-cell-inline-editing {
     box-shadow: none;
     padding: 0 2px;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type] {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type] {
     height: 30px;
     min-height: 30px;
     line-height: 30px;
@@ -14256,107 +14238,126 @@ dato-input input:disabled:hover {
     color: themify(primary-600);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type].no-clear-btn {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type].no-clear-btn {
     padding-right: 10px;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:focus {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:focus {
     outline: none;
     box-shadow: none;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:hover {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:hover {
     transition: 0.3s all;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]::-webkit-input-placeholder {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]::-webkit-input-placeholder {
     color: themify(primary-300);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:-moz-placeholder {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:-moz-placeholder {
     color: themify(primary-300);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]::-moz-placeholder {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]::-moz-placeholder {
     color: themify(primary-300);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:-ms-input-placeholder {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:-ms-input-placeholder {
     color: themify(primary-300);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:hover {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:hover {
     border-color: themify(primary-300);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:focus {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type]:focus {
     border-color: themify(accent-400) !important;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type][disabled] {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type][disabled] {
     background-color: themify(primary-300, 0.1);
     cursor: not-allowed;
     border: 1px solid transparent;
     color: themify(primary-200);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type][disabled]:hover {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type][disabled]:hover {
     border: 1px solid transparent;
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type][disabled] ~ dato-icon path {
+.dato-grid .ag-cell.ag-cell-inline-editing input.ag-cell-edit-input[type][disabled] ~ dato-icon path {
     fill: themify(primary-200);
 }
 
-.dato-grid:not(.pivot-mode) .ag-cell.ag-cell-inline-editing .ag-input-text-wrapper {
+.dato-grid .ag-cell.ag-cell-inline-editing .ag-input-text-wrapper {
     width: 100%;
 }
 
-.dato-grid.pivot-mode .ag-row.ag-row-group {
+.dato-grid:not(.pivot-style) .ag-row.ag-row-group {
+    background-color: themify(primary-0);
+    border-bottom: solid 1px themify(primary-200);
+    height: 35px;
+}
+
+.dato-grid:not(.pivot-style) .ag-row.ag-row-group span {
+    color: themify(primary-300);
+    font-weight: 600;
+}
+
+.dato-grid:not(.pivot-style) .ag-row.ag-row-group:hover span {
+    color: themify(accent-400);
+}
+
+.dato-grid:not(.pivot-style) .ag-row.ag-row-group:hover .da-grid-icon {
+    fill: themify(accent-400);
+}
+
+.dato-grid.pivot-style .ag-row.ag-row-group {
     /**
         Because in pivot mode we style the cells themselves,
         we need to reflect the hover state to those cells also
        */
 }
 
-.dato-grid.pivot-mode .ag-row.ag-row-group .bottom-border {
+.dato-grid.pivot-style .ag-row.ag-row-group .bottom-border {
     border-bottom: 1px solid themify(primary-200);
 }
 
-.dato-grid.pivot-mode .ag-row.ag-row-group:not(.ag-row-hover) {
+.dato-grid.pivot-style .ag-row.ag-row-group:not(.ag-row-hover) {
     background-color: themify(primary-50);
 }
 
-.dato-grid.pivot-mode .ag-cell {
+.dato-grid.pivot-style .ag-cell {
     color: themify(primary-500);
 }
 
-.dato-grid.pivot-mode .ag-cell .ag-row-group-leaf-indent {
+.dato-grid.pivot-style .ag-cell .ag-row-group-leaf-indent {
     margin: 0 !important;
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-cell {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-cell {
     border: none;
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-cell dato-grid-column-header {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-cell dato-grid-column-header {
     display: block;
     height: 100%;
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-cell dato-grid-column-header > div {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-cell dato-grid-column-header > div {
     height: inherit;
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-cell dato-grid-column-header > div span {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-cell dato-grid-column-header > div span {
     color: themify(primary-500);
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-cell.top-border {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-cell.top-border {
     border-top: 1px solid themify(primary-200);
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-cell-resize {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-cell-resize {
     height: 100%;
     margin: 0;
     padding: 0;
@@ -14364,31 +14365,31 @@ dato-input input:disabled:hover {
     border-right: 1px solid themify(primary-200);
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell .ag-header-cell-resize {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell .ag-header-cell-resize {
     height: 100%;
     border: none;
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label {
     align-items: center;
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label span {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell .ag-header-group-cell-label span {
     height: auto;
     color: themify(primary-500);
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group {
     border-top: 1px solid themify(primary-200);
     border-right: 1px solid themify(primary-200);
     background-color: themify(primary-100);
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group.empty-pivot-header {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group.empty-pivot-header {
     display: none;
 }
 
-.dato-grid.pivot-mode .ag-header .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group.group-pivot-cell .ag-header-group-cell-label {
+.dato-grid.pivot-style .ag-header .ag-header-row .ag-header-group-cell.ag-header-group-cell-with-group.group-pivot-cell .ag-header-group-cell-label {
     justify-content: center;
 }
 
@@ -14412,6 +14413,7 @@ dato-grid-v2 ag-grid-angular .ag-floating-bottom {
 dato-grid-v2 ag-grid-angular .ag-floating-bottom .ag-row {
     background-color: themify(primary-0) !important;
     border: 1px solid themify(primary-200);
+    border-left: none;
 }
 
 dato-grid-v2 ag-grid-angular .ag-floating-bottom .ag-row .ag-cell {