@hrforte/react-pivottable 1.0.0 → 1.0.1

package/dist/TableRenderers.js

@@ -0,0 +1,1067 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
+exports.applyCellFormatting = applyCellFormatting;
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+var _Utilities = require('./Utilities');
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
+
+// helper function for setting row/col-span in pivotTableRenderer
+var spanSize = function spanSize(arr, i, j) {
+  var x = void 0;
+  if (i !== 0) {
+    var asc = void 0,
+        end = void 0;
+    var noDraw = true;
+    for (x = 0, end = j, asc = end >= 0; asc ? x <= end : x >= end; asc ? x++ : x--) {
+      if (arr[i - 1][x] !== arr[i][x]) {
+        noDraw = false;
+      }
+    }
+    if (noDraw) {
+      return -1;
+    }
+  }
+  var len = 0;
+  while (i + len < arr.length) {
+    var asc1 = void 0,
+        end1 = void 0;
+    var stop = false;
+    for (x = 0, end1 = j, asc1 = end1 >= 0; asc1 ? x <= end1 : x >= end1; asc1 ? x++ : x--) {
+      if (arr[i][x] !== arr[i + len][x]) {
+        stop = true;
+      }
+    }
+    if (stop) {
+      break;
+    }
+    len++;
+  }
+  return len;
+};
+
+// ==> Calculate the positions for GroupSegments <==
+function buildHeaderGroupSegments(rowAttrs, rowGroupConfig) {
+  var attrToGroup = {};
+  (rowGroupConfig || []).forEach(function (_ref) {
+    var label = _ref.label,
+        match = _ref.match;
+
+    match.forEach(function (name) {
+      attrToGroup[name] = label;
+    });
+  });
+
+  var segments = [];
+  rowAttrs.forEach(function (name) {
+    // eslint-disable-next-line no-undefined
+    var group = attrToGroup[name] !== undefined ? attrToGroup[name] : null;
+    var last = segments[segments.length - 1];
+    if (group !== null && last && last.group === group) {
+      last.span += 1;
+    } else {
+      segments.push({ group: group, span: 1 });
+    }
+  });
+  return segments;
+}
+
+// Style cho ô có nhãn nhóm trong group header
+var groupLabelStyle = {
+  textAlign: 'center'
+};
+
+function redColorScaleGenerator(values) {
+  var min = Math.min.apply(Math, values);
+  var max = Math.max.apply(Math, values);
+  return function (x) {
+    // eslint-disable-next-line no-magic-numbers
+    var nonRed = 255 - Math.round(255 * (x - min) / (max - min));
+    return { backgroundColor: 'rgb(255,' + nonRed + ',' + nonRed + ')' };
+  };
+}
+
+// Conditional formatting evaluation function
+function evaluateCondition(value, condition) {
+  if (!condition || !condition.type) {
+    return false;
+  }
+
+  var type = condition.type,
+      conditionValue = condition.value;
+
+  var numValue = typeof value === 'number' ? value : parseFloat(value);
+  var numConditionValue = typeof conditionValue === 'number' ? conditionValue : parseFloat(conditionValue);
+
+  switch (type) {
+    case 'greaterThan':
+      return !isNaN(numValue) && !isNaN(numConditionValue) && numValue > numConditionValue;
+    case 'lessThan':
+      return !isNaN(numValue) && !isNaN(numConditionValue) && numValue < numConditionValue;
+    case 'greaterThanOrEqual':
+      return !isNaN(numValue) && !isNaN(numConditionValue) && numValue >= numConditionValue;
+    case 'lessThanOrEqual':
+      return !isNaN(numValue) && !isNaN(numConditionValue) && numValue <= numConditionValue;
+    case 'equal':
+      if (typeof value === 'string' && typeof conditionValue === 'string') {
+        return value === conditionValue;
+      }
+      return !isNaN(numValue) && !isNaN(numConditionValue) && numValue === numConditionValue;
+    case 'notEqual':
+      if (typeof value === 'string' && typeof conditionValue === 'string') {
+        return value !== conditionValue;
+      }
+      return isNaN(numValue) || isNaN(numConditionValue) || numValue !== numConditionValue;
+    case 'empty':
+      // Check for null, undefined, empty string, whitespace-only strings, or NaN
+      if (value === null || value === undefined) {
+        return true;
+      }
+      if (typeof value === 'string') {
+        return value.trim() === '';
+      }
+      if (typeof value === 'number') {
+        return isNaN(value);
+      }
+      return false;
+    case 'notEmpty':
+      // Check that value is not null, undefined, empty/whitespace string, or NaN
+      if (value === null || value === undefined) {
+        return false;
+      }
+      if (typeof value === 'string') {
+        return value.trim() !== '';
+      }
+      if (typeof value === 'number') {
+        return !isNaN(value);
+      }
+      // Other types (boolean, object, etc.) are considered not empty
+      return true;
+    case 'contains':
+      // Convert both values to strings for comparison
+      // This handles cases where values are numbers (from aggregators) or conditionValue is parsed as number
+      var valueStr = String(value || '');
+      var conditionValueStr = String(conditionValue || '');
+      if (valueStr && conditionValueStr) {
+        return valueStr.toLowerCase().includes(conditionValueStr.toLowerCase());
+      }
+      return false;
+    case 'notContains':
+      // Convert both values to strings for comparison
+      // This handles cases where values are numbers (from aggregators) or conditionValue is parsed as number
+      var valueStr2 = String(value || '');
+      var conditionValueStr2 = String(conditionValue || '');
+      if (valueStr2 && conditionValueStr2) {
+        return !valueStr2.toLowerCase().includes(conditionValueStr2.toLowerCase());
+      }
+      return true;
+    default:
+      return false;
+  }
+}
+
+// Apply conditional formatting rules to a value
+function getConditionalFormattingStyle(value, conditionalFormatting) {
+  if (!conditionalFormatting || !Array.isArray(conditionalFormatting.rules)) {
+    return {};
+  }
+
+  // Evaluate rules in order, return first matching rule's style
+  var _iteratorNormalCompletion = true;
+  var _didIteratorError = false;
+  var _iteratorError = undefined;
+
+  try {
+    for (var _iterator = conditionalFormatting.rules[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+      var rule = _step.value;
+
+      if (evaluateCondition(value, rule.condition)) {
+        // Return a copy of the style object to avoid mutations
+        return rule.style ? Object.assign({}, rule.style) : {};
+      }
+    }
+  } catch (err) {
+    _didIteratorError = true;
+    _iteratorError = err;
+  } finally {
+    try {
+      if (!_iteratorNormalCompletion && _iterator.return) {
+        _iterator.return();
+      }
+    } finally {
+      if (_didIteratorError) {
+        throw _iteratorError;
+      }
+    }
+  }
+
+  return {};
+}
+
+// Merge styles, with conditional formatting taking precedence
+function mergeStyles() {
+  for (var _len = arguments.length, styles = Array(_len), _key = 0; _key < _len; _key++) {
+    styles[_key] = arguments[_key];
+  }
+
+  return Object.assign.apply(Object, [{}].concat(_toConsumableArray(styles.filter(function (s) {
+    return s && (typeof s === 'undefined' ? 'undefined' : _typeof(s)) === 'object';
+  }))));
+}
+
+// Helper function to check if a string contains special characters (like -, /, etc.)
+// This prevents formatting of date strings or formatted strings
+// Only pure numeric strings (with optional decimal point and minus sign) should be formatted
+function containsSpecialCharacters(str) {
+  if (typeof str !== 'string') {
+    return false;
+  }
+  var trimmed = str.trim();
+  // Check if string contains any special characters that indicate it's not a raw number
+  // Allow: digits, decimal point, minus sign at start, plus sign at start, spaces
+  // Disallow: hyphens in middle, slashes, and other special characters
+  var pureNumericPattern = /^-?\d*\.?\d+$/;
+  return !pureNumericPattern.test(trimmed);
+}
+
+// Helper function to check if an aggregation should skip formatting
+// Aggregations like Count, First, Last should not be formatted
+// Aggregations like Sum, Average should be formatted
+function shouldSkipFormattingForAggregation(aggregatorName) {
+  if (!aggregatorName) {
+    return false;
+  }
+
+  var name = aggregatorName.toLowerCase();
+  // Skip formatting for these aggregation types
+  var skipFormattingAggregations = ['count', 'count unique values', 'list unique values', 'first', 'last', 'minimum', 'maximum'];
+  return skipFormattingAggregations.includes(name);
+}
+
+// Apply cell formatting rules to a value
+function applyCellFormatting(value, cellFormatting, defaultFormatter) {
+  var aggregatorName = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+
+  // Don't format if aggregation type should skip formatting (e.g., Count, First, Last)
+  // Only use defaultFormatter if value is numeric, otherwise return as-is
+  var isNumeric = typeof value === 'number' && !isNaN(value) && isFinite(value) || typeof value === 'string' && value.trim() !== '' && !containsSpecialCharacters(value) && !isNaN(parseFloat(value)) && isFinite(parseFloat(value));
+  if (shouldSkipFormattingForAggregation(aggregatorName)) {
+    if (isNumeric && defaultFormatter) {
+      return defaultFormatter(value);
+    }
+    // Return raw value for non-numeric values (dates, strings, etc.)
+    return value;
+  }
+
+  // If no cellFormatting rules, always use default formatter to return to original format
+  // This ensures values return to their original format when cellFormatting is cleared
+  // Check for all possible cases: null, undefined, empty object, empty rules array
+  var hasFormattingRules = cellFormatting && (typeof cellFormatting === 'undefined' ? 'undefined' : _typeof(cellFormatting)) === 'object' && Array.isArray(cellFormatting.rules) && cellFormatting.rules.length > 0 && cellFormatting.rules.some(function (rule) {
+    return rule && rule.format;
+  });
+
+  if (!hasFormattingRules) {
+    // When cellFormatting rules are cleared, return the raw value (not formatted)
+    // This ensures all cells (regular, Totals, Aggregation) return to their original unformatted state
+    // Return the raw numeric value for numbers, or the value as-is for other types
+    if (isNumeric) {
+      // Return raw numeric value without any formatting
+      if (typeof value === 'number') {
+        return value;
+      }
+      // For string numbers, return the parsed numeric value
+      return parseFloat(value);
+    }
+    // For non-numeric values (dates, strings, etc.), return as-is
+    return value;
+  }
+
+  // Don't format if it contains special characters (dates, formatted strings, etc.)
+  // Only check this when cellFormatting rules exist
+  if (containsSpecialCharacters(value)) {
+    return defaultFormatter ? defaultFormatter(value) : String(value);
+  }
+
+  // Check if value is a number - only apply custom formatting to raw numbers
+  // Handle both number type and string numbers (e.g., "123.45")
+  // Exclude strings with special characters from formatting
+  var numericValue = value;
+
+  // Convert string numbers to actual numbers for formatting
+  if (isNumeric && typeof value === 'string') {
+    numericValue = parseFloat(value);
+  }
+
+  // Use the first rule (all rules apply to all values)
+  var matchingRule = cellFormatting.rules[0];
+
+  // If we found a matching rule and value is numeric, apply its formatting
+  if (matchingRule && matchingRule.format && isNumeric) {
+    var format = matchingRule.format;
+    var formatter = (0, _Utilities.numberFormat)({
+      digitsAfterDecimal: 'decimalPlaces' in format ? format.decimalPlaces : 2,
+      thousandsSep: 'thousandsSep' in format ? format.thousandsSep : ',',
+      decimalSep: 'decimalSep' in format ? format.decimalSep : '.',
+      prefix: 'prefix' in format ? format.prefix : '',
+      suffix: 'suffix' in format ? format.suffix : '',
+      showOriginal: 'showOriginal' in format ? format.showOriginal : false
+    });
+    return formatter(numericValue);
+  }
+
+  // Not numeric or no matching rule, use default formatter
+  return defaultFormatter ? defaultFormatter(value) : String(value);
+}
+
+function makeRenderer() {
+  var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+
+  var TableRenderer = function (_React$PureComponent) {
+    _inherits(TableRenderer, _React$PureComponent);
+
+    function TableRenderer() {
+      _classCallCheck(this, TableRenderer);
+
+      return _possibleConstructorReturn(this, (TableRenderer.__proto__ || Object.getPrototypeOf(TableRenderer)).apply(this, arguments));
+    }
+
+    _createClass(TableRenderer, [{
+      key: 'render',
+      value: function render() {
+        var _this2 = this;
+
+        var pivotData = new _Utilities.PivotData(this.props);
+        var colAttrs = pivotData.props.cols;
+        var rowAttrs = pivotData.props.rows;
+        var aggregations = pivotData.getAggregations();
+        var primaryAggregation = pivotData.getPrimaryAggregation();
+        var hasMultipleAggregators = aggregations.length > 1;
+        var tableOptions = this.props.tableOptions || {};
+        var aggregationDisplayMode = tableOptions.aggregationDisplayMode === 'column' ? 'column' : 'row';
+        var isColumnAggregationMode = aggregationDisplayMode === 'column' && hasMultipleAggregators;
+        var rowAttrsToRender = hasMultipleAggregators && !isColumnAggregationMode ? rowAttrs.concat(['Values']) : rowAttrs;
+        var colAttrsToRender = colAttrs;
+        var hasColumnAttributes = colAttrsToRender.length > 0;
+        var showTotalsColumn = !isColumnAggregationMode;
+        var shouldRenderRowHeaderPlaceholder = rowAttrsToRender.length !== 0;
+
+        // --- Row group header (rowGroupConfig) ---
+        var rowGroupConfig = this.props.rowGroupConfig;
+        var hasHeaderGroup = Boolean(rowGroupConfig && rowGroupConfig.length);
+        var headerGroupSegments = hasHeaderGroup ? buildHeaderGroupSegments(rowAttrs, rowGroupConfig) : [];
+        // extraSpan accounts for the synthetic "Values" column added when there
+        // are multiple aggregators shown as rows; it isn't part of any group.
+        var headerGroupExtraSpan = rowAttrsToRender.length - rowAttrs.length;
+        var renderGroupSegments = function renderGroupSegments(rowSpan) {
+          var extraSpan = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+
+          var cells = headerGroupSegments.map(function (seg, idx) {
+            return _react2.default.createElement(
+              'th',
+              {
+                key: 'hgSeg' + idx,
+                colSpan: seg.span,
+                rowSpan: rowSpan
+                // eslint-disable-next-line no-undefined
+                , style: seg.group ? groupLabelStyle : undefined
+              },
+              seg.group || ''
+            );
+          });
+          if (extraSpan > 0) {
+            cells.push(_react2.default.createElement('th', { key: 'hgSegExtra', colSpan: extraSpan, rowSpan: rowSpan }));
+          }
+          return cells;
+        };
+        // --- End row group header ---
+
+        var rowKeys = pivotData.getRowKeys();
+        var baseRowKeys = hasMultipleAggregators && !isColumnAggregationMode && rowKeys.length === 0 ? [[]] : rowKeys;
+        var renderedRows = hasMultipleAggregators && !isColumnAggregationMode ? baseRowKeys.reduce(function (acc, rowKey) {
+          aggregations.forEach(function (agg) {
+            acc.push({
+              displayKey: rowKey.concat([agg.label || agg.aggregatorName]),
+              actualKey: rowKey,
+              aggregationKey: agg.key
+            });
+          });
+          return acc;
+        }, []) : baseRowKeys.map(function (rowKey) {
+          return {
+            displayKey: rowKey,
+            actualKey: rowKey,
+            aggregationKey: primaryAggregation.key
+          };
+        });
+        var rowKeyValues = renderedRows.map(function (r) {
+          return r.displayKey;
+        });
+        var colKeys = pivotData.getColKeys();
+        var baseColKeys = isColumnAggregationMode && colKeys.length === 0 ? [[]] : colKeys;
+        var columnMeta = isColumnAggregationMode ? baseColKeys.reduce(function (acc, colKey) {
+          aggregations.forEach(function (agg) {
+            acc.push({
+              displayKey: colKey.concat([agg.label || agg.aggregatorName]),
+              actualKey: colKey,
+              aggregationKey: agg.key
+            });
+          });
+          return acc;
+        }, []) : colKeys.map(function (colKey) {
+          return {
+            displayKey: colKey,
+            actualKey: colKey,
+            aggregationKey: primaryAggregation.key
+          };
+        });
+        var colKeyValues = columnMeta.map(function (col) {
+          return col.displayKey;
+        });
+
+        var renderAggregatorHeaderCells = function renderAggregatorHeaderCells() {
+          return columnMeta.map(function (colMeta, idx) {
+            var label = colMeta.displayKey[colMeta.displayKey.length - 1] || '';
+            // Calculate colspan/rowspan so aggregator headers line up with column groups
+            // aggregator index is the last element in displayKey (after column attrs)
+            var aggIndex = colAttrsToRender.length;
+            // When there are column attributes, each aggregator should appear once per column group,
+            // so each aggregator header should have colSpan = 1.
+            // When there are no column attributes, use spanSize to merge identical aggregator labels.
+            var colSpan = void 0;
+            if (hasColumnAttributes) {
+              // Each aggregator appears once per column group, so colSpan is always 1
+              // This ensures aggregator headers are listed in each column group and align
+              // correctly with the column groups above (which have colSpan = number of aggregators)
+              colSpan = 1;
+            } else {
+              // Use spanSize to merge identical aggregator labels when there are no column attributes
+              colSpan = spanSize(colKeyValues, idx, aggIndex);
+              // If spanSize returned -1 it means this cell is merged into a previous one
+              if (colSpan === -1) {
+                return null;
+              }
+            }
+
+            // When there are column attributes, rowSpan should account for the row header row
+            // When there are no column attributes, rowSpan is 1
+            var rowSpan = hasColumnAttributes && rowAttrsToRender.length !== 0 ? 1 : 1;
+
+            return _react2.default.createElement(
+              'th',
+              {
+                className: 'pvtColLabel',
+                key: 'agg-label-' + idx,
+                colSpan: colSpan,
+                rowSpan: rowSpan
+              },
+              label
+            );
+          });
+        };
+
+        var valueCellColors = function valueCellColors() {};
+        var rowTotalColors = function rowTotalColors() {};
+        var colTotalColors = function colTotalColors() {};
+        if (opts.heatmapMode && !hasMultipleAggregators) {
+          var colorScaleGenerator = this.props.tableColorScaleGenerator;
+          var rowTotalValues = colKeys.map(function (x) {
+            return pivotData.getAggregator([], x, primaryAggregation.key).value();
+          });
+          rowTotalColors = colorScaleGenerator(rowTotalValues);
+          var colTotalValues = rowKeys.map(function (x) {
+            return pivotData.getAggregator(x, [], primaryAggregation.key).value();
+          });
+          colTotalColors = colorScaleGenerator(colTotalValues);
+
+          if (opts.heatmapMode === 'full') {
+            var allValues = [];
+            rowKeys.map(function (r) {
+              return colKeys.map(function (c) {
+                return allValues.push(pivotData.getAggregator(r, c, primaryAggregation.key).value());
+              });
+            });
+            var colorScale = colorScaleGenerator(allValues);
+            valueCellColors = function valueCellColors(r, c, v) {
+              return colorScale(v);
+            };
+          } else if (opts.heatmapMode === 'row') {
+            var rowColorScales = {};
+            rowKeys.map(function (r) {
+              var rowValues = colKeys.map(function (x) {
+                return pivotData.getAggregator(r, x, primaryAggregation.key).value();
+              });
+              rowColorScales[r] = colorScaleGenerator(rowValues);
+            });
+            valueCellColors = function valueCellColors(r, c, v) {
+              return rowColorScales[r](v);
+            };
+          } else if (opts.heatmapMode === 'col') {
+            var colColorScales = {};
+            colKeys.map(function (c) {
+              var colValues = rowKeys.map(function (x) {
+                return pivotData.getAggregator(x, c, primaryAggregation.key).value();
+              });
+              colColorScales[c] = colorScaleGenerator(colValues);
+            });
+            valueCellColors = function valueCellColors(r, c, v) {
+              return colColorScales[c](v);
+            };
+          }
+        }
+
+        // Get conditional formatting from tableOptions
+        var conditionalFormatting = tableOptions.conditionalFormatting || null;
+
+        // Get cell formatting from tableOptions
+        var cellFormatting = tableOptions.cellFormatting || null;
+
+        // Create lookup map from aggregationKey to aggregatorName
+        var aggregationNameLookup = {};
+        aggregations.forEach(function (agg) {
+          aggregationNameLookup[agg.key] = agg.aggregatorName;
+        });
+
+        // Helper function to get cell style with conditional formatting
+        var getCellStyle = function getCellStyle(value) {
+          var heatmapStyle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+          var conditionalStyle = getConditionalFormattingStyle(value, conditionalFormatting);
+          return mergeStyles(heatmapStyle, conditionalStyle);
+        };
+
+        // Helper function to format cell value with cell formatting rules
+        var formatCellValue = function formatCellValue(value, aggregator, aggregationKey) {
+          var aggregatorName = aggregationKey ? aggregationNameLookup[aggregationKey] : null;
+
+          return applyCellFormatting(value, cellFormatting, aggregator.format.bind(aggregator), aggregatorName);
+        };
+
+        // Helper function to format label text if it's numeric
+        // Used for both row and column labels
+        var formatLabel = function formatLabel(txt) {
+          // Check if txt is numeric (number or numeric string)
+          // Also exclude 'null' string which is used for missing values
+          if (txt === 'null' || txt === null || typeof txt === 'undefined') {
+            return txt;
+          }
+
+          // Don't format if it contains special characters (dates, formatted strings, etc.)
+          if (containsSpecialCharacters(txt)) {
+            return txt;
+          }
+
+          // Check if txt is numeric (number or numeric string)
+          // A string is numeric if it can be parsed as a finite number
+          // Exclude strings with special characters from formatting
+          var isNumeric = false;
+          var numericValue = null;
+
+          if (typeof txt === 'number') {
+            isNumeric = !isNaN(txt) && isFinite(txt);
+            if (isNumeric) {
+              numericValue = txt;
+            }
+          } else if (typeof txt === 'string' && txt.trim() !== '' && txt !== 'null' && !containsSpecialCharacters(txt)) {
+            var parsed = parseFloat(txt.trim());
+            isNumeric = !isNaN(parsed) && isFinite(parsed);
+            if (isNumeric) {
+              numericValue = parsed;
+            }
+          }
+
+          if (isNumeric && numericValue !== null && cellFormatting && Array.isArray(cellFormatting.rules) && cellFormatting.rules.length > 0) {
+            var matchingRule = cellFormatting.rules[0];
+            if (matchingRule && matchingRule.format) {
+              var format = matchingRule.format;
+              var formatter = (0, _Utilities.numberFormat)({
+                digitsAfterDecimal: 'decimalPlaces' in format ? format.decimalPlaces : 2,
+                thousandsSep: 'thousandsSep' in format ? format.thousandsSep : ',',
+                decimalSep: 'decimalSep' in format ? format.decimalSep : '.',
+                prefix: 'prefix' in format ? format.prefix : '',
+                suffix: 'suffix' in format ? format.suffix : '',
+                showOriginal: 'showOriginal' in format ? format.showOriginal : false
+              });
+              return formatter(numericValue);
+            }
+          }
+
+          // Not numeric or no formatting rules, return as-is
+          return txt;
+        };
+
+        // Helper function to format row label text if it's numeric
+        // Only formats if it's a numeric value, not aggregation labels
+        var formatRowLabel = function formatRowLabel(txt, index, isLastElement, hasMultipleAggregators, rowAttrsLength) {
+          // Don't format the last element if it's an aggregation label (when multiple aggregators)
+          // The last element is an aggregation label only if:
+          // 1. There are multiple aggregators
+          // 2. AND it's beyond the row attributes (index >= rowAttrsLength)
+          if (hasMultipleAggregators && isLastElement && index >= rowAttrsLength) {
+            return txt;
+          }
+
+          return formatLabel(txt);
+        };
+
+        var getClickHandler = tableOptions && tableOptions.clickCallback ? function (value, rowValues, colValues) {
+          var filters = {};
+          var _iteratorNormalCompletion2 = true;
+          var _didIteratorError2 = false;
+          var _iteratorError2 = undefined;
+
+          try {
+            for (var _iterator2 = Object.keys(colAttrs || {})[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
+              var i = _step2.value;
+
+              var attr = colAttrs[i];
+              if (colValues[i] !== null) {
+                filters[attr] = colValues[i];
+              }
+            }
+          } catch (err) {
+            _didIteratorError2 = true;
+            _iteratorError2 = err;
+          } finally {
+            try {
+              if (!_iteratorNormalCompletion2 && _iterator2.return) {
+                _iterator2.return();
+              }
+            } finally {
+              if (_didIteratorError2) {
+                throw _iteratorError2;
+              }
+            }
+          }
+
+          var _iteratorNormalCompletion3 = true;
+          var _didIteratorError3 = false;
+          var _iteratorError3 = undefined;
+
+          try {
+            for (var _iterator3 = Object.keys(rowAttrs || {})[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {
+              var _i = _step3.value;
+
+              var attr = rowAttrs[_i];
+              if (rowValues[_i] !== null) {
+                filters[attr] = rowValues[_i];
+              }
+            }
+          } catch (err) {
+            _didIteratorError3 = true;
+            _iteratorError3 = err;
+          } finally {
+            try {
+              if (!_iteratorNormalCompletion3 && _iterator3.return) {
+                _iterator3.return();
+              }
+            } finally {
+              if (_didIteratorError3) {
+                throw _iteratorError3;
+              }
+            }
+          }
+
+          return function (e) {
+            return tableOptions.clickCallback(e, value, filters, pivotData);
+          };
+        } : null;
+
+        var handleColSort = function handleColSort(attr, e) {
+          e.stopPropagation();
+          if (_this2.props.onColSort) {
+            var currentSort = _this2.props.colSorts && _this2.props.colSorts[attr];
+            var nextSort = 'ASC';
+            if (currentSort === 'ASC') {
+              nextSort = 'DESC';
+            } else if (currentSort === 'DESC') {
+              nextSort = null;
+            }
+            _this2.props.onColSort(attr, nextSort);
+          }
+        };
+
+        var handleRowSort = function handleRowSort(attr, e) {
+          e.stopPropagation();
+          if (_this2.props.onRowSort) {
+            var currentSort = _this2.props.rowSorts && _this2.props.rowSorts[attr];
+            var nextSort = 'ASC';
+            if (currentSort === 'ASC') {
+              nextSort = 'DESC';
+            } else if (currentSort === 'DESC') {
+              nextSort = null;
+            }
+            _this2.props.onRowSort(attr, nextSort);
+          }
+        };
+
+        var getSortButton = function getSortButton(attr, isCol) {
+          var currentSort = isCol ? _this2.props.colSorts && _this2.props.colSorts[attr] : _this2.props.rowSorts && _this2.props.rowSorts[attr];
+          var handleSort = isCol ? handleColSort : handleRowSort;
+          var sortIcon = '';
+          if (currentSort !== null) {
+            if (isCol) {
+              sortIcon = _this2.props.colSortIcons[currentSort] || _this2.props.colSortIcons.DEFAULT;
+            } else {
+              sortIcon = _this2.props.rowSortIcons[currentSort] || _this2.props.rowSortIcons.DEFAULT;
+            }
+          }
+          return _react2.default.createElement(
+            'button',
+            {
+              type: 'button',
+              className: 'pvtSortButton',
+              onClick: function onClick(e) {
+                return handleSort(attr, e);
+              },
+              title: currentSort === 'ASC' ? 'Sort Descending' : currentSort === 'DESC' ? 'Clear Sort' : 'Sort Ascending'
+            },
+            sortIcon
+          );
+        };
+
+        var totalRowAggregations = isColumnAggregationMode ? [primaryAggregation] : hasMultipleAggregators ? aggregations : [primaryAggregation];
+        var totalsLabelText = 'Totals';
+
+        return _react2.default.createElement(
+          'table',
+          { className: 'pvtTable' },
+          _react2.default.createElement(
+            'thead',
+            null,
+            colAttrsToRender.map(function (c, j) {
+
+              return _react2.default.createElement(
+                'tr',
+                { key: 'colAttr' + j },
+                shouldRenderRowHeaderPlaceholder && (isColumnAggregationMode || j === 0) && !(isColumnAggregationMode && hasColumnAttributes && rowAttrsToRender.length === 1) && (hasHeaderGroup && j === 0 && !isColumnAggregationMode ? renderGroupSegments(colAttrsToRender.length, headerGroupExtraSpan) : _react2.default.createElement('th', {
+                  colSpan: isColumnAggregationMode && hasColumnAttributes ? rowAttrsToRender.length - 1 : rowAttrsToRender.length,
+                  rowSpan: isColumnAggregationMode && hasColumnAttributes ? 1 : colAttrsToRender.length
+                })),
+                c ? _react2.default.createElement(
+                  'th',
+                  { className: 'pvtAxisLabel' },
+                  c,
+                  colAttrs.includes(c) && getSortButton(c, true)
+                ) : null,
+                colKeyValues.map(function (colKey, i) {
+                  var x = spanSize(colKeyValues, i, j);
+
+                  if (x === -1) {
+                    return null;
+                  }
+
+                  var formattedColLabel = formatLabel(colKey[j]);
+                  return _react2.default.createElement(
+                    'th',
+                    {
+                      className: 'pvtColLabel',
+                      key: 'colKey' + i,
+                      colSpan: x,
+                      rowSpan: j === colAttrsToRender.length - 1 && rowAttrsToRender.length !== 0 && !isColumnAggregationMode ? 2 : 1
+                    },
+                    formattedColLabel
+                  );
+                }),
+                showTotalsColumn && j === 0 && _react2.default.createElement(
+                  'th',
+                  {
+                    className: 'pvtTotalLabel',
+                    rowSpan: colAttrsToRender.length + (rowAttrsToRender.length === 0 ? 0 : 1)
+                  },
+                  totalsLabelText
+                )
+              );
+            }),
+            hasHeaderGroup && colAttrsToRender.length === 0 && rowAttrsToRender.length !== 0 && _react2.default.createElement(
+              'tr',
+              null,
+              renderGroupSegments(1, headerGroupExtraSpan),
+              _react2.default.createElement('th', null)
+            ),
+            isColumnAggregationMode && hasColumnAttributes && _react2.default.createElement(
+              'tr',
+              null,
+              rowAttrsToRender.length !== 0 && rowAttrsToRender.map(function (r, i) {
+                var isRowAttr = i < rowAttrs.length;
+                var attr = isRowAttr ? rowAttrs[i] : null;
+                return _react2.default.createElement(
+                  'th',
+                  { className: 'pvtAxisLabel', key: 'rowAttr-agg-' + i },
+                  r,
+                  isRowAttr && attr && getSortButton(attr, false)
+                );
+              }),
+              renderAggregatorHeaderCells()
+            ),
+            rowAttrsToRender.length !== 0 && !(isColumnAggregationMode && hasColumnAttributes) && _react2.default.createElement(
+              'tr',
+              null,
+              rowAttrsToRender.map(function (r, i) {
+                var isRowAttr = i < rowAttrs.length;
+                var attr = isRowAttr ? rowAttrs[i] : null;
+                return _react2.default.createElement(
+                  'th',
+                  { className: 'pvtAxisLabel', key: 'rowAttr' + i },
+                  r,
+                  isRowAttr && attr && getSortButton(attr, false)
+                );
+              }),
+              isColumnAggregationMode && !hasColumnAttributes ? renderAggregatorHeaderCells() : null,
+              showTotalsColumn && _react2.default.createElement(
+                'th',
+                { className: 'pvtTotalLabel' },
+                colAttrs.length === 0 ? totalsLabelText : null
+              )
+            )
+          ),
+          _react2.default.createElement(
+            'tbody',
+            null,
+            renderedRows.map(function (rowMeta, i) {
+              var totalAggregator = pivotData.getAggregator(rowMeta.actualKey, [], rowMeta.aggregationKey);
+              var displayKey = rowMeta.displayKey;
+              return _react2.default.createElement(
+                'tr',
+                { key: 'rowKeyRow' + i },
+                displayKey.map(function (txt, j) {
+                  var x = spanSize(rowKeyValues, i, j);
+                  if (x === -1) {
+                    return null;
+                  }
+                  var isLastElement = j === displayKey.length - 1;
+                  var formattedTxt = formatRowLabel(txt, j, isLastElement, hasMultipleAggregators, rowAttrs.length);
+                  return _react2.default.createElement(
+                    'th',
+                    {
+                      key: 'rowKeyLabel' + i + '-' + j,
+                      className: 'pvtRowLabel',
+                      rowSpan: x,
+                      colSpan: showTotalsColumn && j === rowAttrsToRender.length - 1 && colAttrsToRender.length !== 0 ? 2 : 1
+                    },
+                    formattedTxt
+                  );
+                }),
+                columnMeta.map(function (colMeta, j) {
+                  var aggregationKeyForCell = isColumnAggregationMode ? colMeta.aggregationKey : rowMeta.aggregationKey;
+                  var aggregator = pivotData.getAggregator(rowMeta.actualKey, colMeta.actualKey, aggregationKeyForCell);
+                  var value = aggregator.value();
+                  var heatmapStyle = valueCellColors(rowMeta.actualKey, colMeta.actualKey, value) || {};
+                  return _react2.default.createElement(
+                    'td',
+                    {
+                      className: 'pvtVal',
+                      key: 'pvtVal' + i + '-' + j,
+                      onClick: getClickHandler && getClickHandler(value, rowMeta.actualKey, colMeta.actualKey),
+                      style: getCellStyle(value, heatmapStyle)
+                    },
+                    formatCellValue(value, aggregator, aggregationKeyForCell)
+                  );
+                }),
+                showTotalsColumn && _react2.default.createElement(
+                  'td',
+                  {
+                    className: 'pvtTotal',
+                    onClick: getClickHandler && getClickHandler(totalAggregator.value(), rowMeta.actualKey, [null]),
+                    style: getCellStyle(totalAggregator.value(), colTotalColors(totalAggregator.value()) || {})
+                  },
+                  formatCellValue(totalAggregator.value(), totalAggregator, rowMeta.aggregationKey)
+                )
+              );
+            }),
+            totalRowAggregations.map(function (agg) {
+              var grandTotalAggregator = pivotData.getAggregator([], [], isColumnAggregationMode ? primaryAggregation.key : agg.key);
+              var totalLabel = hasMultipleAggregators && !isColumnAggregationMode ? 'Totals \u2013 ' + (agg.label || agg.aggregatorName) : totalsLabelText;
+              return _react2.default.createElement(
+                'tr',
+                { key: 'totalRow-' + agg.key },
+                _react2.default.createElement(
+                  'th',
+                  {
+                    className: 'pvtTotalLabel',
+                    colSpan: rowAttrsToRender.length + (colAttrs.length === 0 || isColumnAggregationMode && hasColumnAttributes ? 0 : 1)
+                  },
+                  totalLabel
+                ),
+                columnMeta.map(function (colMeta, i) {
+                  var totalAggregator = pivotData.getAggregator([], colMeta.actualKey, isColumnAggregationMode ? colMeta.aggregationKey : agg.key);
+                  var totalValue = totalAggregator.value();
+                  return _react2.default.createElement(
+                    'td',
+                    {
+                      className: 'pvtTotal',
+                      key: 'total' + agg.key + '-' + i,
+                      onClick: getClickHandler && getClickHandler(totalValue, [null], colMeta.actualKey),
+                      style: getCellStyle(totalValue, rowTotalColors(totalValue) || {})
+                    },
+                    formatCellValue(totalValue, totalAggregator, agg.key)
+                  );
+                }),
+                showTotalsColumn && _react2.default.createElement(
+                  'td',
+                  {
+                    onClick: getClickHandler && getClickHandler(grandTotalAggregator.value(), [null], [null]),
+                    className: 'pvtGrandTotal',
+                    style: getCellStyle(grandTotalAggregator.value(), {})
+                  },
+                  formatCellValue(grandTotalAggregator.value(), grandTotalAggregator, isColumnAggregationMode ? primaryAggregation.key : agg.key)
+                )
+              );
+            })
+          )
+        );
+      }
+    }]);
+
+    return TableRenderer;
+  }(_react2.default.PureComponent);
+
+  TableRenderer.defaultProps = _Utilities.PivotData.defaultProps;
+  TableRenderer.propTypes = _Utilities.PivotData.propTypes;
+  TableRenderer.defaultProps.tableColorScaleGenerator = redColorScaleGenerator;
+  TableRenderer.defaultProps.tableOptions = {};
+  TableRenderer.defaultProps.colSorts = {};
+  TableRenderer.defaultProps.rowSorts = {};
+  TableRenderer.defaultProps.rowGroupConfig = null;
+  TableRenderer.propTypes.tableColorScaleGenerator = _propTypes2.default.func;
+  TableRenderer.propTypes.tableOptions = _propTypes2.default.object;
+  TableRenderer.propTypes.colSorts = _propTypes2.default.objectOf(_propTypes2.default.oneOf(['ASC', 'DESC']));
+  TableRenderer.propTypes.rowSorts = _propTypes2.default.objectOf(_propTypes2.default.oneOf(['ASC', 'DESC']));
+  TableRenderer.propTypes.onColSort = _propTypes2.default.func;
+  TableRenderer.propTypes.onRowSort = _propTypes2.default.func;
+  TableRenderer.propTypes.rowGroupConfig = _propTypes2.default.arrayOf(_propTypes2.default.shape({
+    label: _propTypes2.default.string.isRequired,
+    match: _propTypes2.default.arrayOf(_propTypes2.default.string).isRequired
+  }));
+  TableRenderer.defaultProps.colSortIcons = {
+    ASC: '→',
+    DESC: '←',
+    DEFAULT: '↔'
+  };
+  TableRenderer.defaultProps.rowSortIcons = {
+    ASC: '↑',
+    DESC: '↓',
+    DEFAULT: '⇅'
+  };
+  TableRenderer.propTypes.colSortIcons = _propTypes2.default.shape({
+    ASC: _propTypes2.default.node,
+    DESC: _propTypes2.default.node,
+    DEFAULT: _propTypes2.default.node
+  });
+  TableRenderer.propTypes.rowSortIcons = _propTypes2.default.shape({
+    ASC: _propTypes2.default.node,
+    DESC: _propTypes2.default.node,
+    DEFAULT: _propTypes2.default.node
+  });
+  return TableRenderer;
+}
+
+var TSVExportRenderer = function (_React$PureComponent2) {
+  _inherits(TSVExportRenderer, _React$PureComponent2);
+
+  function TSVExportRenderer() {
+    _classCallCheck(this, TSVExportRenderer);
+
+    return _possibleConstructorReturn(this, (TSVExportRenderer.__proto__ || Object.getPrototypeOf(TSVExportRenderer)).apply(this, arguments));
+  }
+
+  _createClass(TSVExportRenderer, [{
+    key: 'render',
+    value: function render() {
+      var pivotData = new _Utilities.PivotData(this.props);
+      var rowAttrs = pivotData.props.rows;
+      var aggregations = pivotData.getAggregations();
+      var hasMultipleAggregators = aggregations.length > 1;
+      var rowKeys = pivotData.getRowKeys();
+      var colKeys = pivotData.getColKeys();
+      var safeRowKeys = rowKeys.length === 0 ? [[]] : rowKeys;
+      var safeColKeys = colKeys.length === 0 ? [[]] : colKeys;
+
+      var rowEntries = hasMultipleAggregators ? safeRowKeys.reduce(function (acc, rowKey) {
+        aggregations.forEach(function (agg) {
+          acc.push({ rowKey: rowKey, aggregationKey: agg.key, label: agg.label });
+        });
+        return acc;
+      }, []) : safeRowKeys.map(function (rowKey) {
+        return {
+          rowKey: rowKey,
+          aggregationKey: aggregations[0].key,
+          label: aggregations[0].label || aggregations[0].aggregatorName
+        };
+      });
+
+      var headerRow = rowAttrs.slice();
+      if (hasMultipleAggregators) {
+        headerRow.push('Values');
+      }
+      if (safeColKeys.length === 1 && safeColKeys[0].length === 0) {
+        headerRow.push(hasMultipleAggregators ? 'Value' : aggregations[0].label || aggregations[0].aggregatorName);
+      } else {
+        safeColKeys.map(function (c) {
+          return headerRow.push(c.join('-'));
+        });
+      }
+
+      var result = rowEntries.map(function (entry) {
+        var row = entry.rowKey.map(function (x) {
+          return x;
+        });
+        if (hasMultipleAggregators) {
+          row.push(entry.label || '');
+        }
+        safeColKeys.map(function (colKey) {
+          var v = pivotData.getAggregator(entry.rowKey, colKey, entry.aggregationKey).value();
+          row.push(v ? v : '');
+        });
+        return row;
+      });
+
+      result.unshift(headerRow);
+
+      return _react2.default.createElement('textarea', {
+        value: result.map(function (r) {
+          return r.join('\t');
+        }).join('\n'),
+        style: { width: window.innerWidth / 2, height: window.innerHeight / 2 },
+        readOnly: true
+      });
+    }
+  }]);
+
+  return TSVExportRenderer;
+}(_react2.default.PureComponent);
+
+TSVExportRenderer.defaultProps = _Utilities.PivotData.defaultProps;
+TSVExportRenderer.propTypes = _Utilities.PivotData.propTypes;
+
+exports.default = {
+  Table: makeRenderer(),
+  'Table Heatmap': makeRenderer({ heatmapMode: 'full' }),
+  'Table Col Heatmap': makeRenderer({ heatmapMode: 'col' }),
+  'Table Row Heatmap': makeRenderer({ heatmapMode: 'row' }),
+  'Exportable TSV': TSVExportRenderer
+};
+//# sourceMappingURL=TableRenderers.js.map