@datarailsshared/dr_renderer 1.3.27 → 1.3.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datarailsshared/dr_renderer",
-  "version": "1.3.27",
+  "version": "1.3.30",
   "description": "DataRails charts and tables renderer",
   "keywords": [
     "datarails",

package/src/dr_pivottable.js

@@ -514,8 +514,8 @@ let initDRPivotTable = function($, window, document) {
         isColHideOnExpand = (ref5 = opts.colSubtotalDisplay) != null ? ref5.hideOnExpand : !opts.chartOptions.table_options.show_subtotals_for_columns;
         isColDisableExpandCollapse = (ref6 = opts.colSubtotalDisplay) != null ? ref6.disableExpandCollapse : void 0;
         colDisableAfter = (ref7 = opts.colSubtotalDisplay) != null ? ref7.disableAfter != null ? ref7.disableAfter : ref7.disableAfter = 9999 : void 0;
-        arrowCollapsed = opts.arrowCollapsed != null ? opts.arrowCollapsed : opts.arrowCollapsed = '<i class="fa fa-plus dr-icon-add"></i> ';
-        arrowExpanded = opts.arrowExpanded != null ? opts.arrowExpanded : opts.arrowExpanded = '<i class="fa fa-minus dr-icon-minus"></i> ';
+        arrowCollapsed = opts.arrowCollapsed != null ? opts.arrowCollapsed : opts.arrowCollapsed = '<i class="dr-icon-add"></i> ';
+        arrowExpanded = opts.arrowExpanded != null ? opts.arrowExpanded : opts.arrowExpanded = '<i class="dr-icon-minus"></i> ';
         colAttrs = pivotData.colAttrs;
         rowAttrs = pivotData.rowAttrs;
         rowKeys = pivotData.getRowKeys();
@@ -2476,7 +2476,12 @@ let initDRPivotTable = function($, window, document) {
             }
 
             if (tooMuch) {
-                const defaultPlaceholder = $('<div class="noData"><i class="fa fa-info"></i> There are too many rows to display in the table.<br>Please filter or change the table type in options.</div>');
+                const defaultPlaceholder = $(`
+                        <div class="noData--table-many-rows">
+                            <span><i class="noData-icon dr-icon-info"></i> There are too many rows to display in the table.</span>
+                            <span>Please filter or change the table type in options.</span>
+                        </div>
+                `);
 
                 resultsArr.push($.pivotUtilities.errorHandling.getErrorPlaceholder(error_params) || defaultPlaceholder);
             } else {

package/src/highcharts_renderer.js

@@ -4294,7 +4294,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
         let ret_str = '';
         if (options && options.total_value_options && options.total_value_options.filter_options && options.total_value_options.filter_options.axis == tr_axis) {
             //TODO add tooltip with description of filter
-            ret_str += '<i class="fa fa-filter"></i>';
+            ret_str += '<i class="dr-icon-filter-old"></i>';
         }
 
         return ret_str;

package/src/pivot.css

@@ -5,6 +5,17 @@
   flex-direction: column;
 }
 
+.pivot-wrapper .noData--table-many-rows {
+    display: flex;
+    flex-direction: column;
+}
+.pivot-wrapper .noData--table-many-rows > *:first-child {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    line-height: 25px;
+}
+
 table.pvtTable {
     font-size: 8pt;
     text-align: left;
@@ -228,16 +239,27 @@ table.pvtTable.newPvtTable thead tr th {
   border-right: 1px solid #fff;
 }
 
-table.pvtTable.newPvtTable thead tr th .fa,
-table.pvtTable.newPvtTable thead tr th .dr-icon-add,
-table.pvtTable.newPvtTable thead tr th .dr-icon-minus {
-  padding: 2px;
-  background-color: #ffffff;
-  border-radius: 2px;
-  margin-right: 2px;
-  margin-left: 1px;
-  font-size: 8px;
-  color: #151a41;
+table.pvtTable.newPvtTable thead tr th i,
+table.pvtTable.newPvtTable tbody tr th i {
+    position: relative;
+    bottom: -1px;
+    background-color: #ffffff;
+    border-radius: 2px;
+    margin-right: 2px;
+    margin-left: 1px;
+    font-weight: bold;
+    font-size: 10px;
+    color: #151a41;
+}
+
+table.pvtTable.newPvtTable tbody tr th i {
+    bottom: -2px;
+    background-color: #dfe6ec;
+}
+
+table.pvtTable.newPvtTable thead tr th .dr-icon-filter-old,
+table.pvtTable.newPvtTable tbody tr th .dr-icon-filter-old {
+    font-weight: normal;
 }
 
 table.pvtTable.newPvtTable.colorized tr th.colTotal,
@@ -261,14 +283,6 @@ table.pvtTable.newPvtTable tbody tr td.rowTotal {
   border-color: #ffffff !important;
 }
 
-table.pvtTable.newPvtTable tbody tr th .fa {
-  padding: 2px;
-  background-color: #dfe6ec;
-  border-radius: 2px;
-  margin-right: 2px;
-  font-size: 8px;
-}
-
 table.pvtTable.newPvtTable tbody tr th,
 table.pvtTable.newPvtTable tbody tr td {
   border: 1px solid #dfe6ec;

package/tests/highcharts_renderer.test.js

@@ -917,7 +917,7 @@ describe('highcharts_renderer', () => {
 
         it('should return filter icon for matching axis', () => {
             const axis = 'row'
-            const expected = '<i class="fa fa-filter"></i>'
+            const expected = '<i class="dr-icon-filter-old"></i>'
             const result = highchartsRenderer.getIconsForTotalOptions(options, axis)
             expect(result).toEqual(expected)
         });