@deephaven/iris-grid 0.13.3-beta.2 → 0.13.5

package/dist/IrisGridTableModel.js

@@ -1,3 +1,7 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
@@ -6,49 +10,285 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 /* eslint class-methods-use-this: "off" */
 import memoize from 'memoize-one';
-import { GridRange, GridUtils } from '@deephaven/grid';
+import throttle from 'lodash.throttle';
+import { GridRange, GridUtils, memoizeClear } from '@deephaven/grid';
+import dh from '@deephaven/jsapi-shim';
+import { Formatter, FormatterUtils, TableUtils } from '@deephaven/jsapi-utils';
 import Log from '@deephaven/log';
-import { Formatter, TableUtils } from '@deephaven/jsapi-utils';
-import { EventShimCustomEvent, PromiseUtils, assertNotNull } from '@deephaven/utils';
+import { PromiseUtils } from '@deephaven/utils';
 import IrisGridModel from "./IrisGridModel.js";
-import IrisGridTableModelTemplate from "./IrisGridTableModelTemplate.js";
+import AggregationOperation from "./sidebar/aggregations/AggregationOperation.js";
+import IrisGridUtils from "./IrisGridUtils.js";
+import MissingKeyError from "./MissingKeyError.js";
 var log = Log.module('IrisGridTableModel');
-var EMPTY_ARRAY = Object.freeze([]);
+var SET_VIEWPORT_THROTTLE = 150;
+var APPLY_VIEWPORT_THROTTLE = 0;
 /**
  * Model for a grid showing an iris data table
  */
 
-class IrisGridTableModel extends IrisGridTableModelTemplate {
+class IrisGridTableModel extends IrisGridModel {
   /**
-   * @param table Iris data table to be used in the model
-   * @param formatter The formatter to use when getting formats
-   * @param inputTable Iris input table associated with this table
+   * @param {dh.Table} table Iris data table to be used in the model
+   * @param {Formatter} formatter The formatter to use when getting formats
+   * @param {dh.InputTable} inputTable Iris input table associated with this table
    */
   constructor(table) {
-    var formatter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new Formatter();
-    var inputTable = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
-    super(table, formatter, inputTable);
-
-    _defineProperty(this, "userFrozenColumns", void 0);
+    var _formatter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new Formatter();
 
-    _defineProperty(this, "customColumnList", void 0);
+    var inputTable = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+    super();
 
-    _defineProperty(this, "formatColumnList", void 0);
+    _defineProperty(this, "getMemoizedColumnMap", memoize(tableColumns => {
+      var columnMap = new Map();
+      tableColumns.forEach(col => columnMap.set(col.name, col));
+      return columnMap;
+    }));
 
-    _defineProperty(this, "getMemoizedFrontColumns", memoize(layoutHintsFrontColumns => layoutHintsFrontColumns !== null && layoutHintsFrontColumns !== void 0 ? layoutHintsFrontColumns : EMPTY_ARRAY));
+    _defineProperty(this, "getMemoizedFrontColumns", memoize(layoutHintsFrontColumns => layoutHintsFrontColumns !== null && layoutHintsFrontColumns !== void 0 ? layoutHintsFrontColumns : []));
 
-    _defineProperty(this, "getMemoizedBackColumns", memoize(layoutHintsBackColumns => layoutHintsBackColumns !== null && layoutHintsBackColumns !== void 0 ? layoutHintsBackColumns : EMPTY_ARRAY));
+    _defineProperty(this, "getMemoizedBackColumns", memoize(layoutHintsBackColumns => layoutHintsBackColumns !== null && layoutHintsBackColumns !== void 0 ? layoutHintsBackColumns : []));
 
     _defineProperty(this, "getMemoizedFrozenColumns", memoize((layoutHintsFrozenColumns, userFrozenColumns) => {
       var _ref;
 
-      return (_ref = userFrozenColumns !== null && userFrozenColumns !== void 0 ? userFrozenColumns : layoutHintsFrozenColumns) !== null && _ref !== void 0 ? _ref : EMPTY_ARRAY;
+      return (_ref = userFrozenColumns !== null && userFrozenColumns !== void 0 ? userFrozenColumns : layoutHintsFrozenColumns) !== null && _ref !== void 0 ? _ref : [];
+    }));
+
+    _defineProperty(this, "getColumnIndicesByNameMap", memoize(columns => {
+      var indices = new Map();
+      columns.forEach((_ref2, i) => {
+        var {
+          name
+        } = _ref2;
+        return indices.set(name, i);
+      });
+      return indices;
     }));
 
     _defineProperty(this, "getCachedFilterableColumnSet", memoize(columns => new Set(columns.map((_, index) => index))));
 
+    _defineProperty(this, "getCachedFormattedString", memoizeClear((formatter, value, columnType, columnName, formatOverride) => formatter.getFormattedString(value, columnType, columnName, formatOverride), {
+      max: 10000
+    }));
+
+    _defineProperty(this, "getCachedCustomColumnFormatFlag", memoizeClear(FormatterUtils.isCustomColumnFormatDefined, {
+      max: 10000
+    }));
+
+    _defineProperty(this, "getCachedViewportRowRange", memoize((top, bottom) => {
+      var viewHeight = bottom - top;
+      var viewportTop = Math.max(0, top - viewHeight * IrisGridTableModel.ROW_BUFFER_PAGES);
+      var viewportBottom = bottom + viewHeight * IrisGridTableModel.ROW_BUFFER_PAGES;
+      return [viewportTop, viewportBottom];
+    }));
+
+    _defineProperty(this, "getCachedPendingErrors", memoize((pendingDataMap, columns, keyColumnCount) => {
+      var map = new Map();
+      pendingDataMap.forEach((row, rowIndex) => {
+        var {
+          data: rowData
+        } = row;
+
+        for (var i = 0; i < keyColumnCount; i += 1) {
+          if (!rowData.has(i)) {
+            if (!map.has(rowIndex)) {
+              map.set(rowIndex, []);
+            }
+
+            map.get(rowIndex).push(new MissingKeyError(rowIndex, columns[i].name));
+          }
+        }
+      });
+      return map;
+    }));
+
+    this.handleTableDisconnect = this.handleTableDisconnect.bind(this);
+    this.handleTableReconnect = this.handleTableReconnect.bind(this);
+    this.handleTableUpdate = this.handleTableUpdate.bind(this);
+    this.handleTotalsUpdate = this.handleTotalsUpdate.bind(this);
+    this.handleRequestFailed = this.handleRequestFailed.bind(this);
+    this.handleCustomColumnsChanged = this.handleCustomColumnsChanged.bind(this);
+    this.setViewport = throttle(this.setViewport.bind(this), SET_VIEWPORT_THROTTLE);
+    this.applyViewport = throttle(this.applyViewport.bind(this), APPLY_VIEWPORT_THROTTLE, {
+      leading: false
+    });
+    this.irisFormatter = _formatter;
+    this.inputTable = inputTable;
+    this.listenerCount = 0;
+    this.subscription = null;
+    this.table = table;
+    this.viewport = null;
+    this.viewportData = null;
+    this.formattedStringData = [];
+    this.pendingStringData = [];
+    this.isSaveInProgress = false;
+    this.totalsTable = null;
+    this.totalsTablePromise = null;
+    this.totals = null;
+    this.totalsDataMap = null;
     this.customColumnList = [];
-    this.formatColumnList = [];
+    this.formatColumnList = []; // Map from new row index to their values. Only for input tables that can have new rows added.
+    // The index of these rows start at 0, and they are appended at the end of the regular table data.
+    // These rows can be sparse, so using a map instead of an array.
+
+    this.pendingNewDataMap = new Map();
+    this.pendingNewRowCount = 0;
+    this.userFrozenColumns = null;
+  }
+
+  close() {
+    this.table.close();
+
+    if (this.totalsTable !== null) {
+      this.totalsTable.close();
+    }
+
+    if (this.totalsTablePromise !== null) {
+      this.totalsTablePromise.cancel();
+    }
+  }
+
+  startListening() {
+    super.startListening();
+    this.table.addEventListener(dh.Table.EVENT_DISCONNECT, this.handleTableDisconnect);
+    this.table.addEventListener(dh.Table.EVENT_RECONNECT, this.handleTableReconnect);
+    this.table.addEventListener(dh.Table.EVENT_UPDATED, this.handleTableUpdate);
+    this.table.addEventListener(dh.Client.EVENT_REQUEST_FAILED, this.handleRequestFailed);
+    this.table.addEventListener(dh.Table.EVENT_CUSTOMCOLUMNSCHANGED, this.handleCustomColumnsChanged);
+
+    if (this.totalsTable != null) {
+      this.addTotalsListeners(this.totalsTable);
+    }
+
+    this.applyViewport();
+  }
+
+  stopListening() {
+    super.stopListening();
+    this.table.removeEventListener(dh.Table.EVENT_DISCONNECT, this.handleTableDisconnect);
+    this.table.removeEventListener(dh.Table.EVENT_RECONNECT, this.handleTableReconnect);
+    this.table.removeEventListener(dh.Table.EVENT_UPDATED, this.handleTableUpdate);
+    this.table.removeEventListener(dh.Client.EVENT_REQUEST_FAILED, this.handleRequestFailed);
+    this.table.removeEventListener(dh.Table.EVENT_CUSTOMCOLUMNSCHANGED, this.handleCustomColumnsChanged);
+
+    if (this.totalsTable != null) {
+      this.removeTotalsListeners(this.totalsTable);
+    }
+
+    this.closeSubscription();
+  }
+
+  addTotalsListeners(totalsTable) {
+    totalsTable.addEventListener(dh.Table.EVENT_UPDATED, this.handleTotalsUpdate); // Totals table only has one row of data
+
+    totalsTable.setViewport(0, 0);
+  }
+
+  removeTotalsListeners(totalsTable) {
+    totalsTable.removeEventListener(dh.Table.EVENT_UPDATED, this.handleTotalsUpdate);
+  }
+
+  handleTableDisconnect() {
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.DISCONNECT));
+  }
+
+  handleTableReconnect() {
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.RECONNECT));
+  }
+
+  handleTableUpdate(event) {
+    this.copyViewportData(event.detail);
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.UPDATED));
+  }
+
+  handleTotalsUpdate(event) {
+    this.copyTotalsData(event.detail);
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.UPDATED));
+  }
+
+  handleRequestFailed(event) {
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.REQUEST_FAILED, event));
+  }
+
+  handleCustomColumnsChanged() {
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.COLUMNS_CHANGED, {
+      detail: this.columns
+    }));
+  }
+
+  get rowCount() {
+    var _this$totals$operatio, _this$totals, _this$totals$operatio2;
+
+    return this.table.size + ((_this$totals$operatio = (_this$totals = this.totals) === null || _this$totals === void 0 ? void 0 : (_this$totals$operatio2 = _this$totals.operationOrder) === null || _this$totals$operatio2 === void 0 ? void 0 : _this$totals$operatio2.length) !== null && _this$totals$operatio !== void 0 ? _this$totals$operatio : 0) + this.pendingNewRowCount;
+  }
+
+  get pendingDataErrors() {
+    var _this$inputTable$keyC, _this$inputTable;
+
+    return this.getCachedPendingErrors(this.pendingNewDataMap, this.columns, (_this$inputTable$keyC = (_this$inputTable = this.inputTable) === null || _this$inputTable === void 0 ? void 0 : _this$inputTable.keyColumns.length) !== null && _this$inputTable$keyC !== void 0 ? _this$inputTable$keyC : 0);
+  }
+
+  get pendingDataMap() {
+    return this.pendingNewDataMap;
+  }
+
+  set pendingDataMap(map) {
+    if (map === this.pendingNewDataMap) {
+      return;
+    }
+
+    map.forEach((row, rowIndex) => {
+      if (!IrisGridUtils.isValidIndex(rowIndex)) {
+        throw new Error('Invalid rowIndex', rowIndex);
+      }
+
+      var {
+        data
+      } = row;
+      data.forEach((value, columnIndex) => {
+        if (!IrisGridUtils.isValidIndex(columnIndex)) {
+          throw new Error('Invalid columnIndex', columnIndex);
+        }
+      });
+    });
+    this.pendingNewDataMap = map;
+    this.pendingNewRowCount = Math.max(this.pendingNewRowCount, this.maxPendingDataRow);
+    this.formattedStringData = [];
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.PENDING_DATA_UPDATED));
+  }
+
+  get pendingRowCount() {
+    return this.pendingNewRowCount;
+  }
+
+  set pendingRowCount(count) {
+    if (count === this.pendingNewRowCount) {
+      return;
+    }
+
+    this.pendingNewRowCount = Math.max(0, count, this.maxPendingDataRow);
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.UPDATED));
+  }
+
+  get maxPendingDataRow() {
+    return this.pendingNewDataMap.size > 0 ? Math.max(...this.pendingNewDataMap.keys()) + 1 : 0;
+  }
+
+  get columnCount() {
+    return this.columns.length;
+  }
+
+  get floatingBottomRowCount() {
+    var _this$totals2, _this$totals$operatio3, _this$totals3, _this$totals3$operati;
+
+    return (_this$totals2 = this.totals) !== null && _this$totals2 !== void 0 && _this$totals2.showOnTop ? 0 : (_this$totals$operatio3 = (_this$totals3 = this.totals) === null || _this$totals3 === void 0 ? void 0 : (_this$totals3$operati = _this$totals3.operationOrder) === null || _this$totals3$operati === void 0 ? void 0 : _this$totals3$operati.length) !== null && _this$totals$operatio3 !== void 0 ? _this$totals$operatio3 : 0;
+  }
+
+  get floatingTopRowCount() {
+    var _this$totals4, _this$totals$operatio4, _this$totals5, _this$totals5$operati;
+
+    return (_this$totals4 = this.totals) !== null && _this$totals4 !== void 0 && _this$totals4.showOnTop ? (_this$totals$operatio4 = (_this$totals5 = this.totals) === null || _this$totals5 === void 0 ? void 0 : (_this$totals5$operati = _this$totals5.operationOrder) === null || _this$totals5$operati === void 0 ? void 0 : _this$totals5$operati.length) !== null && _this$totals$operatio4 !== void 0 ? _this$totals$operatio4 : 0 : 0;
   }
 
   get isExportAvailable() {
@@ -78,6 +318,205 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
   get isFormatColumnsAvailable() {
     return this.table.applyCustomColumns != null;
   }
+
+  get isChartBuilderAvailable() {
+    return true;
+  }
+
+  get isTotalsAvailable() {
+    return this.table.getTotalsTable != null;
+  }
+
+  get isEditable() {
+    return !this.isSaveInProgress && this.inputTable != null;
+  }
+
+  cacheFormattedValue(x, y, text) {
+    if (this.formattedStringData[x] == null) {
+      this.formattedStringData[x] = [];
+    }
+
+    this.formattedStringData[x][y] = text;
+  }
+
+  cachePendingValue(x, y, text) {
+    if (this.pendingStringData[x] == null) {
+      this.pendingStringData[x] = [];
+    }
+
+    this.pendingStringData[x][y] = text;
+  }
+
+  clearPendingValue(x, y) {
+    var column = this.pendingStringData[x];
+
+    if (column != null) {
+      delete column[y];
+    }
+  }
+
+  textValueForCell(x, y) {
+    var _this$pendingStringDa, _this$formattedString;
+
+    // First check if there's any pending values we should read from
+    if (((_this$pendingStringDa = this.pendingStringData[x]) === null || _this$pendingStringDa === void 0 ? void 0 : _this$pendingStringDa[y]) !== undefined) {
+      return this.pendingStringData[x][y];
+    } // Use a separate cache from memoization just for the strings that are currently displayed
+
+
+    if (((_this$formattedString = this.formattedStringData[x]) === null || _this$formattedString === void 0 ? void 0 : _this$formattedString[y]) === undefined) {
+      var _this$totalsColumn;
+
+      var value = this.valueForCell(x, y);
+
+      if (value == null) {
+        return null;
+      }
+
+      var column = (_this$totalsColumn = this.totalsColumn(x, y)) !== null && _this$totalsColumn !== void 0 ? _this$totalsColumn : this.columns[x];
+      var hasCustomColumnFormat = this.getCachedCustomColumnFormatFlag(this.formatter, column.name, column.type);
+      var formatOverride = null;
+
+      if (!hasCustomColumnFormat) {
+        var formatForCell = this.formatForCell(x, y);
+
+        if ((formatForCell === null || formatForCell === void 0 ? void 0 : formatForCell.formatString) != null) {
+          formatOverride = formatForCell;
+        }
+      }
+
+      var text = this.displayString(value, column.type, column.name, formatOverride);
+      this.cacheFormattedValue(x, y, text);
+    }
+
+    return this.formattedStringData[x][y];
+  }
+
+  textForCell(x, y) {
+    var text = this.textValueForCell(x, y);
+
+    if (text == null && this.isKeyColumn(x)) {
+      var pendingRow = this.pendingRow(y);
+
+      if (this.pendingDataMap.has(pendingRow)) {
+        // Asterisk to show a value is required for a key column on a row that has some data entered
+        return '*';
+      }
+    }
+
+    return text;
+  }
+
+  truncationCharForCell(x) {
+    var column = this.columns[x];
+    var {
+      type
+    } = column;
+
+    if (TableUtils.isNumberType(type) && this.formatter.truncateNumbersWithPound) {
+      return '#';
+    }
+
+    return undefined;
+  }
+
+  colorForCell(x, y, theme) {
+    var data = this.dataForCell(x, y);
+
+    if (data) {
+      var {
+        format,
+        value
+      } = data;
+
+      if (value == null || value === '') {
+        return theme.nullStringColor;
+      }
+
+      if (format && format.color) {
+        return format.color;
+      }
+
+      if (this.isPendingRow(y)) {
+        // Data entered in a pending row
+        return theme.pendingTextColor;
+      } // Fallback to formatting based on the value/type of the cell
+
+
+      if (value != null) {
+        var _this$totalsColumn2;
+
+        var column = (_this$totalsColumn2 = this.totalsColumn(x, y)) !== null && _this$totalsColumn2 !== void 0 ? _this$totalsColumn2 : this.columns[x];
+
+        if (TableUtils.isDateType(column.type) || column.name === 'Date') {
+          return theme.dateColor;
+        }
+
+        if (TableUtils.isNumberType(column.type)) {
+          if (value > 0) {
+            return theme.positiveNumberColor;
+          }
+
+          if (value < 0) {
+            return theme.negativeNumberColor;
+          }
+
+          return theme.zeroNumberColor;
+        }
+      }
+    } else if (this.isPendingRow(y) && this.isKeyColumn(x)) {
+      return theme.errorTextColor;
+    }
+
+    return theme.textColor;
+  }
+
+  backgroundColorForCell(x, y) {
+    var _this$formatForCell;
+
+    return (_this$formatForCell = this.formatForCell(x, y)) === null || _this$formatForCell === void 0 ? void 0 : _this$formatForCell.backgroundColor;
+  }
+
+  textAlignForCell(x) {
+    var column = this.columns[x];
+    var {
+      type
+    } = column;
+
+    if (TableUtils.isNumberType(type)) {
+      return 'right';
+    }
+
+    if (TableUtils.isDateType(type) || column.name === 'Date') {
+      return 'center';
+    }
+
+    return 'left';
+  }
+
+  textForColumnHeader(x) {
+    var column = this.columns[x];
+    return "".concat(column.name);
+  }
+
+  textForRowFooter(y) {
+    var totalsRow = this.totalsRow(y);
+
+    if (totalsRow != null) {
+      return this.totals.operationOrder[totalsRow];
+    }
+
+    return '';
+  }
+  /**
+   * Returns an array of the columns in the model
+   * The order of model columns should never change once established
+   */
+
+
+  get columns() {
+    return this.table.columns;
+  }
   /**
    * Used to get the initial moved columns based on layout hints
    */
@@ -89,7 +528,7 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
     if (this.frontColumns.length || this.backColumns.length || this.frozenColumns.length) {
       var usedColumns = new Set();
 
-      var moveColumn = (name, toIndex) => {
+      var moveColumn = (name, index) => {
         if (usedColumns.has(name)) {
           throw new Error("Column specified in multiple layout hints: ".concat(name));
         }
@@ -101,7 +540,7 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
         }
 
         var visibleIndex = GridUtils.getVisibleIndex(modelIndex, movedColumns);
-        movedColumns = GridUtils.moveItem(visibleIndex, toIndex, movedColumns);
+        movedColumns = GridUtils.moveItem(visibleIndex, index, movedColumns);
       };
 
       var frontIndex = 0;
@@ -123,6 +562,10 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
     return movedColumns;
   }
 
+  get columnMap() {
+    return this.getMemoizedColumnMap(this.table.columns);
+  }
+
   get frontColumns() {
     var _this$layoutHints;
 
@@ -149,10 +592,308 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
     return this.frozenColumns.length;
   }
 
+  get groupedColumns() {
+    return [];
+  }
+
   get description() {
     return this.table.description;
   }
 
+  row(y) {
+    var _this$totals$operatio5, _this$totals6, _this$totals6$operati, _this$totals$showOnTo, _this$totals7, _this$viewportData$of, _this$viewportData, _this$viewportData$ro, _this$viewportData2, _this$viewportData2$r;
+
+    var totalsRowCount = (_this$totals$operatio5 = (_this$totals6 = this.totals) === null || _this$totals6 === void 0 ? void 0 : (_this$totals6$operati = _this$totals6.operationOrder) === null || _this$totals6$operati === void 0 ? void 0 : _this$totals6$operati.length) !== null && _this$totals$operatio5 !== void 0 ? _this$totals$operatio5 : 0;
+    var showOnTop = (_this$totals$showOnTo = (_this$totals7 = this.totals) === null || _this$totals7 === void 0 ? void 0 : _this$totals7.showOnTop) !== null && _this$totals$showOnTo !== void 0 ? _this$totals$showOnTo : false;
+    var totalsRow = this.totalsRow(y);
+
+    if (totalsRow != null) {
+      var _this$totalsDataMap$g, _this$totalsDataMap;
+
+      var operation = this.totals.operationOrder[totalsRow];
+      return (_this$totalsDataMap$g = (_this$totalsDataMap = this.totalsDataMap) === null || _this$totalsDataMap === void 0 ? void 0 : _this$totalsDataMap.get(operation)) !== null && _this$totalsDataMap$g !== void 0 ? _this$totalsDataMap$g : null;
+    }
+
+    var pendingRow = this.pendingRow(y);
+
+    if (pendingRow != null) {
+      var _this$pendingNewDataM;
+
+      return (_this$pendingNewDataM = this.pendingNewDataMap.get(pendingRow)) !== null && _this$pendingNewDataM !== void 0 ? _this$pendingNewDataM : null;
+    }
+
+    var offset = (_this$viewportData$of = (_this$viewportData = this.viewportData) === null || _this$viewportData === void 0 ? void 0 : _this$viewportData.offset) !== null && _this$viewportData$of !== void 0 ? _this$viewportData$of : 0;
+    var viewportY = (showOnTop ? y - totalsRowCount : y) - offset;
+    return (_this$viewportData$ro = (_this$viewportData2 = this.viewportData) === null || _this$viewportData2 === void 0 ? void 0 : (_this$viewportData2$r = _this$viewportData2.rows) === null || _this$viewportData2$r === void 0 ? void 0 : _this$viewportData2$r[viewportY]) !== null && _this$viewportData$ro !== void 0 ? _this$viewportData$ro : null;
+  }
+  /**
+   * Retrieve the totals column if this is a totals row, or null otherwise
+   * @param {ModelIndex} x Column index to get the totals column from
+   * @param {ModelIndex} y Row index to get the totals column from
+   * @returns {dh.Column | null}
+   */
+
+
+  totalsColumn(x, y) {
+    var totalsRow = this.totalsRow(y);
+    if (totalsRow == null) return null;
+    var operation = this.totals.operationOrder[totalsRow];
+    var tableColumn = this.columns[x]; // If there's exactly one operation applied to this column, the totals table result column will just be the same
+    // If there's more than one operation, the totals table column will be the original name with two underscores and the operation appended
+
+    var operations = this.totals.operationMap[tableColumn.name];
+    var isOnlyOperation = (operations === null || operations === void 0 ? void 0 : operations.length) === 1 && operations[0] === operation;
+    var matchName = isOnlyOperation ? tableColumn.name : "".concat(tableColumn.name, "__").concat(operation);
+    return this.totalsTable.columns.find(column => column.name === matchName);
+  }
+  /**
+   * Translate from the row in the model to a row in the totals table.
+   * If the row is not a totals row, return null
+   * @param {number} y The row in the model to get the totals row for
+   * @returns {number|null} The row within the totals table if it's a totals row, null otherwise
+   */
+
+
+  totalsRow(y) {
+    var _this$totals$operatio6, _this$totals8, _this$totals8$operati, _this$totals$showOnTo2, _this$totals9;
+
+    var totalsRowCount = (_this$totals$operatio6 = (_this$totals8 = this.totals) === null || _this$totals8 === void 0 ? void 0 : (_this$totals8$operati = _this$totals8.operationOrder) === null || _this$totals8$operati === void 0 ? void 0 : _this$totals8$operati.length) !== null && _this$totals$operatio6 !== void 0 ? _this$totals$operatio6 : 0;
+    var showOnTop = (_this$totals$showOnTo2 = (_this$totals9 = this.totals) === null || _this$totals9 === void 0 ? void 0 : _this$totals9.showOnTop) !== null && _this$totals$showOnTo2 !== void 0 ? _this$totals$showOnTo2 : false;
+    var totalsRow = showOnTop ? y : y - this.table.size;
+
+    if (totalsRow >= 0 && totalsRow < totalsRowCount) {
+      return totalsRow;
+    }
+
+    return null;
+  }
+  /**
+   * Translate from the row in the model to a pending input row.
+   * If the row is not a pending input row, return null
+   * @param {number} y The row in the model to get the pending row for
+   * @returns {number|null} The row within the pending input rows if it's a pending row, null otherwise
+   */
+
+
+  pendingRow(y) {
+    var pendingRow = y - this.floatingTopRowCount - this.table.size;
+
+    if (pendingRow >= 0 && pendingRow < this.pendingNewRowCount) {
+      return pendingRow;
+    }
+
+    return null;
+  }
+  /**
+   * Check if a row is a totals table row
+   * @param {number} y The row in the model to check if it's a totals table row
+   * @returns {boolean} True if the row is a totals row, false if not
+   */
+
+
+  isTotalsRow(y) {
+    return this.totalsRow(y) != null;
+  }
+  /**
+   * Check if a row is a pending input row
+   * @param {number} y The row in the model to check if it's a pending new row
+   * @returns {boolean} True if the row is a pending new row, false if not
+   */
+
+
+  isPendingRow(y) {
+    return this.pendingRow(y) != null;
+  }
+
+  dataForCell(x, y) {
+    var _this$row;
+
+    return (_this$row = this.row(y)) === null || _this$row === void 0 ? void 0 : _this$row.data.get(x);
+  }
+
+  formatForCell(x, y) {
+    var _this$dataForCell;
+
+    return (_this$dataForCell = this.dataForCell(x, y)) === null || _this$dataForCell === void 0 ? void 0 : _this$dataForCell.format;
+  }
+
+  valueForCell(x, y) {
+    var data = this.dataForCell(x, y);
+
+    if (data) {
+      var _data$value;
+
+      return (_data$value = data.value) !== null && _data$value !== void 0 ? _data$value : null;
+    }
+
+    return undefined;
+  }
+
+  copyViewportData(data) {
+    if (!data) {
+      log.warn('invalid data!');
+      return;
+    }
+
+    this.viewportData = this.extractViewportData(data);
+    this.formattedStringData = [];
+  }
+
+  copyTotalsData(totalsData) {
+    var _this$totals$defaultO,
+        _this$totals10,
+        _this$totals11,
+        _this = this;
+
+    if (!totalsData) {
+      log.warn('invalid data!');
+      return;
+    }
+
+    var {
+      columns,
+      rows
+    } = totalsData;
+
+    if (rows.length !== 1) {
+      log.error('Unexpected number of rows received for totals table, ignoring update');
+      return;
+    }
+
+    var dataMap = new Map();
+    var row = rows[0];
+    var defaultOperation = (_this$totals$defaultO = (_this$totals10 = this.totals) === null || _this$totals10 === void 0 ? void 0 : _this$totals10.defaultOperation) !== null && _this$totals$defaultO !== void 0 ? _this$totals$defaultO : AggregationOperation.SUM;
+    var operationMap = (_this$totals11 = this.totals) === null || _this$totals11 === void 0 ? void 0 : _this$totals11.operationMap;
+
+    var _loop = function _loop(c) {
+      var _operationMap$name$, _operationMap$name;
+
+      var column = columns[c];
+      var [name, operation = (_operationMap$name$ = operationMap === null || operationMap === void 0 ? void 0 : (_operationMap$name = operationMap[name]) === null || _operationMap$name === void 0 ? void 0 : _operationMap$name[0]) !== null && _operationMap$name$ !== void 0 ? _operationMap$name$ : defaultOperation] = column.name.split('__');
+
+      if (!dataMap.has(operation)) {
+        dataMap.set(operation, {
+          data: new Map()
+        });
+      }
+
+      var {
+        data: rowData
+      } = dataMap.get(operation);
+
+      var columnIndex = _this.columns.findIndex(col => col.name === name);
+
+      rowData.set(columnIndex, {
+        value: row.get(column),
+        format: row.getFormat(column)
+      });
+    };
+
+    for (var c = 0; c < columns.length; c += 1) {
+      _loop(c);
+    }
+
+    log.debug2('copyTotalsData', dataMap);
+    this.totalsDataMap = dataMap;
+    this.formattedStringData = [];
+  }
+  /**
+   * Gets the model index for a column from its name
+   * @param {string} name The column name
+   * @returns {number | undefined} The ModelIndex if it exists
+   */
+
+
+  getColumnIndexByName(name) {
+    return this.getColumnIndicesByNameMap(this.columns).get(name);
+  }
+
+  /**
+   * Copies all the viewport data into an object that we can reference later.
+   * @param {ViewportData} data The data to copy from
+   */
+  extractViewportData(data) {
+    var newData = {
+      offset: data.offset,
+      rows: []
+    };
+    var {
+      columns
+    } = data;
+
+    for (var r = 0; r < data.rows.length; r += 1) {
+      var row = data.rows[r];
+      var newRow = this.extractViewportRow(row, columns);
+      newData.rows.push(newRow);
+    }
+
+    return newData;
+  }
+
+  extractViewportRow(row, columns) {
+    var data = new Map();
+
+    for (var c = 0; c < columns.length; c += 1) {
+      var column = columns[c];
+      data.set(this.getColumnIndexByName(column.name), {
+        value: row.get(column),
+        format: row.getFormat(column)
+      });
+    }
+
+    return {
+      data
+    };
+  }
+
+  closeSubscription() {
+    log.debug2('closeSubscription', this.subscription);
+
+    if (this.subscription) {
+      this.subscription.close();
+      this.subscription = null;
+    }
+
+    this.setViewport.cancel();
+    this.applyViewport.cancel();
+  }
+
+  get filter() {
+    return this.table.filter;
+  }
+
+  set filter(filter) {
+    this.closeSubscription();
+    this.table.applyFilter(filter);
+    this.applyViewport();
+  }
+
+  get formatter() {
+    return this.irisFormatter;
+  }
+
+  set formatter(formatter) {
+    this.irisFormatter = formatter;
+    this.formattedStringData = [];
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.FORMATTER_UPDATED));
+  }
+
+  displayString(value, columnType) {
+    var columnName = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
+    var formatOverride = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+    return this.getCachedFormattedString(this.formatter, value, columnType, columnName, formatOverride);
+  }
+
+  get sort() {
+    return this.table.sort;
+  }
+
+  set sort(sort) {
+    this.closeSubscription();
+    this.table.applySort(sort);
+    this.applyViewport();
+  }
+
   get customColumns() {
     return this.customColumnList;
   }
@@ -203,9 +944,7 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
 
   updateFrozenColumns(columns) {
     this.userFrozenColumns = columns;
-    this.dispatchEvent(new EventShimCustomEvent(IrisGridModel.EVENT.TABLE_CHANGED, {
-      detail: this.table
-    }));
+    this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.TABLE_CHANGED));
   }
 
   set totalsConfig(totalsConfig) {
@@ -226,7 +965,7 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
     this.setTotalsTable(null);
 
     if (totalsConfig == null) {
-      this.dispatchEvent(new EventShimCustomEvent(IrisGridModel.EVENT.UPDATED));
+      this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.UPDATED));
       return;
     }
 
@@ -241,12 +980,199 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
 
       log.error('Unable to set next totalsTable', err);
       this.totalsTablePromise = null;
-      this.dispatchEvent(new EventShimCustomEvent(IrisGridModel.EVENT.REQUEST_FAILED, {
+      this.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.REQUEST_FAILED, {
         detail: err
       }));
     });
   }
 
+  setTotalsTable(totalsTable) {
+    log.debug('setTotalsTable', totalsTable);
+
+    if (this.totalsTable !== null) {
+      if (this.listenerCount > 0) {
+        this.removeTotalsListeners(this.totalsTable);
+      }
+
+      this.totalsTable.close();
+    }
+
+    this.totalsTable = totalsTable;
+    this.totalsDataMap = null;
+
+    if (this.listenerCount > 0 && this.totalsTable != null) {
+      this.addTotalsListeners(totalsTable);
+    }
+  }
+
+  setViewport(top, bottom, columns) {
+    if (bottom < top) {
+      log.error('Invalid viewport', top, bottom);
+      return;
+    }
+
+    var {
+      viewport
+    } = this;
+
+    if (viewport != null && viewport.top === top && viewport.bottom === bottom && viewport.columns === columns) {
+      log.debug2('Ignoring duplicate viewport', viewport);
+      return;
+    }
+
+    this.viewport = {
+      top,
+      bottom,
+      columns
+    };
+    log.debug2('setViewport', this.viewport);
+    this.applyViewport();
+  }
+  /**
+   * Applies the current viewport to the underlying table.
+   */
+
+
+  applyViewport() {
+    if (!this.viewport) {
+      return;
+    }
+
+    log.debug2('applyViewport', this.viewport);
+    var {
+      top,
+      bottom,
+      columns
+    } = this.viewport;
+    var [viewportTop, viewportBottom] = this.getCachedViewportRowRange(top, bottom);
+    this.applyBufferedViewport(viewportTop, viewportBottom, columns);
+  }
+
+  applyBufferedViewport(viewportTop, viewportBottom, columns) {
+    log.debug2('applyBufferedViewport', viewportTop, viewportBottom, columns);
+
+    if (this.subscription == null) {
+      log.debug2('applyBufferedViewport creating new subscription');
+      this.subscription = this.table.setViewport(viewportTop, viewportBottom, columns);
+    } else {
+      log.debug2('applyBufferedViewport using existing subscription');
+      this.subscription.setViewport(viewportTop, viewportBottom, columns);
+    }
+  }
+
+  snapshot(ranges) {
+    var _arguments = arguments,
+        _this2 = this;
+
+    return _asyncToGenerator(function* () {
+      var includeHeaders = _arguments.length > 1 && _arguments[1] !== undefined ? _arguments[1] : false;
+      var formatValue = _arguments.length > 2 && _arguments[2] !== undefined ? _arguments[2] : value => value;
+
+      if (_this2.subscription == null) {
+        throw new Error('No subscription available');
+      }
+
+      var consolidated = GridRange.consolidate(ranges);
+
+      if (!IrisGridUtils.isValidSnapshotRanges(consolidated)) {
+        throw new Error('Invalid snapshot ranges', ranges);
+      } // Need to separate out the floating ranges as they're from a different source
+
+
+      var topFloatingRowsSet = new Set();
+      var tableRanges = [];
+      var bottomFloatingRowsSet = new Set();
+
+      for (var i = 0; i < consolidated.length; i += 1) {
+        var range = consolidated[i]; // Get the rows that are in the top aggregations section
+
+        for (var r = range.startRow; r <= range.endRow && r < _this2.floatingTopRowCount; r += 1) {
+          topFloatingRowsSet.add(r);
+        } // Separate out the range that is part of the actual table (ie. not the floating ranges, not aggregations)
+
+
+        if (range.endRow >= _this2.floatingTopRowCount && range.startRow <= _this2.floatingTopRowCount + _this2.table.size) {
+          tableRanges.push(new GridRange(range.startColumn, Math.min(Math.max(0, range.startRow - _this2.floatingTopRowCount)), range.endColumn, Math.min(Math.max(0, range.endRow - _this2.floatingTopRowCount), _this2.table.size - _this2.floatingTopRowCount)));
+        } // Get the rows that are in the bottom aggregations section
+
+
+        for (var _r = Math.max(range.startRow, _this2.floatingTopRowCount + _this2.table.size); _r <= range.endRow && _r < _this2.floatingTopRowCount + _this2.table.size + _this2.floatingBottomRowCount; _r += 1) {
+          bottomFloatingRowsSet.add(_r);
+        }
+      }
+
+      var columns = IrisGridUtils.columnsFromRanges(consolidated, _this2.columns);
+      var result = [];
+
+      if (includeHeaders) {
+        result.push(columns.map(c => c.name));
+      }
+
+      var topFloatingRows = [...topFloatingRowsSet].sort();
+
+      var _loop2 = function _loop2(_i) {
+        var row = topFloatingRows[_i];
+        var rowData = columns.map(column => formatValue(_this2.valueForCell(_this2.getColumnIndexByName(column.name), row), column));
+
+        if (includeHeaders) {
+          rowData.push(_this2.textForRowFooter(row));
+        }
+
+        result.push(rowData);
+      };
+
+      for (var _i = 0; _i < topFloatingRows.length; _i += 1) {
+        _loop2(_i);
+      }
+
+      if (tableRanges.length > 0) {
+        var rangeSet = IrisGridUtils.rangeSetFromRanges(tableRanges);
+        var snapshot = yield _this2.subscription.snapshot(rangeSet, columns);
+        result.push(...snapshot.rows.map(rowData => columns.map(column => formatValue(rowData.get(column), column))));
+      }
+
+      var bottomFloatingRows = [...bottomFloatingRowsSet].sort();
+
+      var _loop3 = function _loop3(_i2) {
+        var row = bottomFloatingRows[_i2];
+        var rowData = columns.map(column => formatValue(_this2.valueForCell(_this2.getColumnIndexByName(column.name), row), column));
+
+        if (includeHeaders) {
+          rowData.push(_this2.textForRowFooter(row));
+        }
+
+        result.push(rowData);
+      };
+
+      for (var _i2 = 0; _i2 < bottomFloatingRows.length; _i2 += 1) {
+        _loop3(_i2);
+      }
+
+      return result;
+    })();
+  }
+  /**
+   * Get a text snapshot of the provided ranges
+   * @param {GridRange[]} ranges The ranges to get the snapshot for
+   * @param {boolean} includeHeaders Whether to include the headers in the snapshot or not
+   * @param {(unknown, dh.Column) => string} formatValue Function for formatting the raw value into a string
+   * @returns {string} A formatted string of all the data, columns separated by `\t` and rows separated by `\n`
+   */
+
+
+  textSnapshot(ranges) {
+    var _arguments2 = arguments,
+        _this3 = this;
+
+    return _asyncToGenerator(function* () {
+      var includeHeaders = _arguments2.length > 1 && _arguments2[1] !== undefined ? _arguments2[1] : false;
+      var formatValue = _arguments2.length > 2 && _arguments2[2] !== undefined ? _arguments2[2] : value => "".concat(value);
+      log.debug2('textSnapshot', ranges, includeHeaders);
+      var data = yield _this3.snapshot(ranges, includeHeaders, formatValue);
+      return data.map(row => row.join('\t')).join('\n');
+    })();
+  }
+
   get isFilterRequired() {
     return this.table.isUncoalesced;
   }
@@ -255,11 +1181,30 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
     return this.getCachedFilterableColumnSet(this.columns).has(columnIndex);
   }
 
+  valuesTable(column) {
+    var _this4 = this;
+
+    return _asyncToGenerator(function* () {
+      var table = null;
+
+      try {
+        table = yield _this4.table.copy();
+        table.applyFilter([]);
+        table.applySort([]);
+        return table.selectDistinct([column]);
+      } finally {
+        if (table != null) {
+          table.close();
+        }
+      }
+    })();
+  }
+
   export() {
-    var _this = this;
+    var _this5 = this;
 
     return _asyncToGenerator(function* () {
-      return _this.table.freeze();
+      return _this5.table.freeze();
     })();
   }
 
@@ -281,69 +1226,436 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
     return this.frozenColumns.includes(this.columns[modelIndex].name);
   }
 
-  delete(ranges) {
-    var _superprop_getPendingDataMap = () => super.pendingDataMap,
-        _superprop_setPendingDataMap = _value => super.pendingDataMap = _value,
-        _this2 = this;
+  isKeyColumn(x) {
+    var _this$inputTable$keyC2, _this$inputTable2;
+
+    return x < ((_this$inputTable$keyC2 = (_this$inputTable2 = this.inputTable) === null || _this$inputTable2 === void 0 ? void 0 : _this$inputTable2.keyColumns.length) !== null && _this$inputTable$keyC2 !== void 0 ? _this$inputTable$keyC2 : 0);
+  }
+
+  isRowMovable() {
+    return false;
+  }
+
+  isEditableRange(range) {
+    return this.inputTable != null && GridRange.isBounded(range) && (this.isPendingRow(range.startRow) && this.isPendingRow(range.endRow) || range.startColumn >= this.inputTable.keyColumns.length && range.endColumn >= this.inputTable.keyColumns.length) && range.startRow >= this.floatingTopRowCount && range.startRow < this.floatingTopRowCount + this.table.size + this.pendingRowCount && range.endRow < this.floatingTopRowCount + this.table.size + this.pendingRowCount;
+  }
+
+  isDeletableRange(range) {
+    return this.inputTable != null && range.startRow != null && range.endRow != null && range.startRow >= this.floatingTopRowCount && range.startRow < this.floatingTopRowCount + this.table.size + this.pendingRowCount && range.endRow < this.floatingTopRowCount + this.table.size + this.pendingRowCount;
+  }
+
+  isEditableRanges(ranges) {
+    return ranges.every(range => this.isEditableRange(range));
+  }
+
+  isDeletableRanges(ranges) {
+    return ranges.every(range => this.isDeletableRange(range));
+  }
+  /**
+   * @returns {GridRange} A range corresponding to the underlying table
+   */
+
+
+  getTableAreaRange() {
+    return new GridRange(null, this.floatingTopRowCount, null, this.floatingTopRowCount + this.table.size - 1);
+  }
+  /**
+   * @returns {GridRange} A range corresponding to the pending new rows
+   */
+
+
+  getPendingAreaRange() {
+    return new GridRange(null, this.floatingTopRowCount + this.table.size, null, this.floatingTopRowCount + this.table.size + this.pendingNewRowCount - 1);
+  }
+  /**
+   * Set value in an editable table
+   * @param {number} x The column to set
+   * @param {number} y The row to set
+   * @param {string} value The value to set
+   * @returns {Promise<void>} A promise that resolves successfully when the operation is complete, or rejects if there's an error
+   */
+
+
+  setValueForCell(x, y, text) {
+    var _this6 = this;
 
     return _asyncToGenerator(function* () {
-      var _this2$inputTable;
+      // Cache the value in our pending string cache so that it stays displayed until our edit has been completed
+      return _this6.setValueForRanges([new GridRange(x, y, x, y)], text);
+    })();
+  }
+  /**
+   * Set value in an editable table
+   * @param {GridRange[]} ranges The ranges to set
+   * @param {string} value The values to set
+   * @returns {Promise<void>} A promise that resolves successfully when the operation is complete, or rejects if there's an error
+   */
 
-      if (!_this2.isDeletableRanges(ranges)) {
-        throw new Error("Undeletable ranges ".concat(ranges));
+
+  setValueForRanges(ranges, text) {
+    var _this7 = this;
+
+    return _asyncToGenerator(function* () {
+      if (!_this7.isEditableRanges(ranges)) {
+        throw new Error('Uneditable ranges', ranges);
+      }
+
+      try {
+        // Cache the value in our pending string cache so that it stays displayed until our edit has been completed
+        var columnSet = new Set(); // Formatted text for each column
+        // Since there could be different formatting for each column, but the value will be the same across rows
+
+        var formattedText = [];
+        GridRange.forEachCell(ranges, (x, y) => {
+          var column = _this7.columns[x];
+          columnSet.add(column);
+
+          if (formattedText[x] === undefined) {
+            var value = TableUtils.makeValue(column.type, text, _this7.formatter.timeZone);
+            formattedText[x] = value != null ? _this7.displayString(value, column.type, column.name) : null;
+          }
+
+          _this7.cachePendingValue(x, y, formattedText[x]);
+        }); // Take care of updates to the pending new area first, as they can be updated synchronously
+
+        var pendingAreaRange = _this7.getPendingAreaRange();
+
+        var pendingRanges = ranges.map(range => GridRange.intersection(pendingAreaRange, range)).filter(range => range != null).map(range => GridRange.offset(range, 0, -(_this7.floatingTopRowCount + _this7.table.size)));
+
+        if (pendingRanges.length > 0) {
+          var newDataMap = new Map(_this7.pendingNewDataMap);
+          GridRange.forEachCell(pendingRanges, (columnIndex, rowIndex) => {
+            if (!newDataMap.has(rowIndex)) {
+              newDataMap.set(rowIndex, {
+                data: new Map()
+              });
+            }
+
+            var column = _this7.columns[columnIndex];
+            var row = newDataMap.get(rowIndex);
+            var {
+              data: rowData
+            } = row;
+            var newRowData = new Map(rowData);
+            var value = TableUtils.makeValue(column.type, text, _this7.formatter.timeZone);
+
+            if (value != null) {
+              newRowData.set(columnIndex, {
+                value
+              });
+            } else {
+              newRowData.delete(columnIndex);
+            }
+
+            if (newRowData.size > 0) {
+              newDataMap.set(rowIndex, _objectSpread(_objectSpread({}, row), {}, {
+                data: newRowData
+              }));
+            } else {
+              newDataMap.delete(rowIndex);
+            }
+          });
+          _this7.pendingDataMap = newDataMap;
+        }
+
+        _this7.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.UPDATED));
+
+        var tableAreaRange = _this7.getTableAreaRange();
+
+        var tableRanges = ranges.map(range => GridRange.intersection(tableAreaRange, range)).filter(range => range != null);
+
+        if (tableRanges.length > 0) {
+          // Get a snapshot of the full rows, as we need to write a full row when editing
+          var data = yield _this7.snapshot(tableRanges.map(range => new GridRange(null, range.startRow, null, range.endRow)));
+          var newRows = data.map(row => {
+            var newRow = {};
+
+            for (var c = 0; c < _this7.columns.length; c += 1) {
+              newRow[_this7.columns[c].name] = row[c];
+            }
+
+            columnSet.forEach(column => {
+              newRow[column.name] = TableUtils.makeValue(column.type, text, _this7.formatter.timeZone);
+            });
+            return newRow;
+          });
+          var result = yield _this7.inputTable.addRows(newRows);
+          log.debug('setValueForRanges(', ranges, ',', text, ') set tableRanges', tableRanges, 'result', result);
+        } // Add the changes to the formatted cache so it's still displayed until the update event is received
+        // The update event could be received on the next tick, after the input rows have been committed,
+        // so make sure we don't display stale data
+
+
+        GridRange.forEachCell(ranges, (x, y) => {
+          _this7.cacheFormattedValue(x, y, formattedText[x]);
+        });
+      } catch (err) {
+        log.error('Unable to set ranges', ranges, text, err);
+      } finally {
+        GridRange.forEachCell(ranges, (x, y) => {
+          _this7.clearPendingValue(x, y);
+        });
+      }
+    })();
+  }
+
+  setValues() {
+    var _arguments3 = arguments,
+        _this8 = this;
+
+    return _asyncToGenerator(function* () {
+      var edits = _arguments3.length > 0 && _arguments3[0] !== undefined ? _arguments3[0] : [];
+      log.debug('setValues(', edits, ')');
+
+      if (!edits.every(edit => {
+        var _edit$column, _edit$row;
+
+        return _this8.isEditableRange(GridRange.makeCell((_edit$column = edit.column) !== null && _edit$column !== void 0 ? _edit$column : edit.x, (_edit$row = edit.row) !== null && _edit$row !== void 0 ? _edit$row : edit.y));
+      })) {
+        throw new Error('Uneditable ranges', edits);
+      }
+
+      try {
+        var newDataMap = new Map(_this8.pendingNewDataMap); // Cache the display values
+
+        edits.forEach(edit => {
+          var _edit$column2, _edit$row2;
+
+          var {
+            text
+          } = edit;
+          var x = (_edit$column2 = edit.column) !== null && _edit$column2 !== void 0 ? _edit$column2 : edit.x;
+          var y = (_edit$row2 = edit.row) !== null && _edit$row2 !== void 0 ? _edit$row2 : edit.y;
+          var column = _this8.columns[x];
+          var value = TableUtils.makeValue(column.type, text, _this8.formatter.timeZone);
+          var formattedText = value != null ? _this8.displayString(value, column.type, column.name) : null;
+
+          _this8.cachePendingValue(x, y, formattedText); // Take care of updates to the pending new area as well, as that can be updated synchronously
+
+
+          var pendingRow = _this8.pendingRow(y);
+
+          if (pendingRow != null) {
+            if (!newDataMap.has(pendingRow)) {
+              newDataMap.set(pendingRow, {
+                data: new Map()
+              });
+            }
+
+            var row = newDataMap.get(pendingRow);
+            var {
+              data: rowData
+            } = row;
+            var newRowData = new Map(rowData);
+
+            if (value != null) {
+              newRowData.set(x, {
+                value
+              });
+            } else {
+              newRowData.delete(x);
+            }
+
+            if (newRowData.size > 0) {
+              newDataMap.set(pendingRow, _objectSpread(_objectSpread({}, row), {}, {
+                data: newRowData
+              }));
+            } else {
+              newDataMap.delete(pendingRow);
+            }
+          }
+        });
+        _this8.pendingDataMap = newDataMap; // Send an update right after setting the pending map so the values are displayed immediately
+
+        _this8.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.UPDATED)); // Need to group by row...
+
+
+        var rowEditMap = edits.reduce((rowMap, edit) => {
+          var _edit$row3;
+
+          var y = (_edit$row3 = edit.row) !== null && _edit$row3 !== void 0 ? _edit$row3 : edit.y;
+
+          if (!rowMap.has(y)) {
+            rowMap.set(y, []);
+          }
+
+          rowMap.get(y).push(edit);
+          return rowMap;
+        }, new Map());
+        var ranges = GridRange.consolidate(edits.map(edit => {
+          var _edit$column3, _edit$row4;
+
+          return GridRange.makeCell((_edit$column3 = edit.column) !== null && _edit$column3 !== void 0 ? _edit$column3 : edit.x, (_edit$row4 = edit.row) !== null && _edit$row4 !== void 0 ? _edit$row4 : edit.y);
+        }));
+
+        var tableAreaRange = _this8.getTableAreaRange();
+
+        var tableRanges = ranges.map(range => GridRange.intersection(tableAreaRange, range)).filter(range => range != null);
+
+        if (tableRanges.length > 0) {
+          // Get a snapshot of the full rows, as we need to write a full row when editing
+          var data = yield _this8.snapshot(tableRanges.map(range => new GridRange(null, range.startRow, null, range.endRow)));
+          var newRows = data.map((row, dataIndex) => {
+            var rowIndex = null;
+            var r = dataIndex;
+
+            for (var i = 0; i < tableRanges.length; i += 1) {
+              var range = tableRanges[i];
+              var rangeRowCount = GridRange.rowCount([range]);
+
+              if (r < rangeRowCount) {
+                rowIndex = range.startRow + r;
+                break;
+              }
+
+              r -= rangeRowCount;
+            }
+
+            var newRow = {};
+
+            for (var c = 0; c < _this8.columns.length; c += 1) {
+              newRow[_this8.columns[c].name] = row[c];
+            }
+
+            var rowEdits = rowEditMap.get(rowIndex);
+
+            if (rowEdits != null) {
+              rowEdits.forEach(edit => {
+                var _edit$column4;
+
+                var column = _this8.columns[(_edit$column4 = edit.column) !== null && _edit$column4 !== void 0 ? _edit$column4 : edit.x];
+                newRow[column.name] = TableUtils.makeValue(column.type, edit.text, _this8.formatter.timeZone);
+              });
+            }
+
+            return newRow;
+          });
+          log.info('setValues setting tableRanges', tableRanges);
+          var result = yield _this8.inputTable.addRows(newRows);
+          log.info('setValues set tableRanges', tableRanges, 'SUCCESS', result);
+        } // We've sent the changes to the server, but have not yet got an update with those changes committed
+        // Add the changes to the formatted cache so it's still displayed until the update event is received
+        // The update event could be received on the next tick, after the input rows have been committed,
+        // so make sure we don't display stale data
+
+
+        edits.forEach(edit => {
+          var _edit$column5, _edit$row5;
+
+          var {
+            text
+          } = edit;
+          var x = (_edit$column5 = edit.column) !== null && _edit$column5 !== void 0 ? _edit$column5 : edit.x;
+          var y = (_edit$row5 = edit.row) !== null && _edit$row5 !== void 0 ? _edit$row5 : edit.y;
+          var column = _this8.columns[x];
+          var value = TableUtils.makeValue(column.type, text, _this8.formatter.timeZone);
+          var formattedText = value != null ? _this8.displayString(value, column.type, column.name) : null;
+
+          _this8.cacheFormattedValue(x, y, formattedText);
+        });
+      } finally {
+        edits.forEach(edit => {
+          _this8.clearPendingValue(edit.column, edit.row);
+        });
+      }
+    })();
+  }
+
+  commitPending() {
+    var _this9 = this;
+
+    return _asyncToGenerator(function* () {
+      if (_this9.pendingNewDataMap.size <= 0) {
+        throw new Error('No pending changes to commit');
+      }
+
+      try {
+        var _this9$viewport$botto, _this9$viewport;
+
+        _this9.isSaveInProgress = true;
+        var newRows = [];
+
+        _this9.pendingNewDataMap.forEach(row => {
+          var newRow = {};
+          row.data.forEach((_ref3, columnIndex) => {
+            var {
+              value
+            } = _ref3;
+            var column = _this9.columns[columnIndex];
+            newRow[column.name] = value;
+          });
+          newRows.push(newRow);
+        });
+
+        var result = yield _this9.inputTable.addRows(newRows);
+        log.debug('commitPending()', _this9.pendingNewDataMap, 'result', result);
+        _this9.pendingNewDataMap = new Map();
+        _this9.pendingNewDataErrors = new Map();
+        _this9.pendingNewRowCount = Math.max(0, ((_this9$viewport$botto = (_this9$viewport = _this9.viewport) === null || _this9$viewport === void 0 ? void 0 : _this9$viewport.bottom) !== null && _this9$viewport$botto !== void 0 ? _this9$viewport$botto : 0) - _this9.table.size);
+        _this9.formattedStringData = [];
+
+        _this9.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.PENDING_DATA_UPDATED));
+
+        return result;
+      } finally {
+        _this9.isSaveInProgress = false;
+      }
+    })();
+  }
+
+  editValueForCell(x, y) {
+    return this.textValueForCell(x, y);
+  }
+
+  delete(ranges) {
+    var _this10 = this;
+
+    return _asyncToGenerator(function* () {
+      if (!_this10.isDeletableRanges(ranges)) {
+        throw new Error('Undeletable ranges', ranges);
       }
 
-      assertNotNull(_this2.inputTable);
       var {
         keyColumns
-      } = _this2.inputTable;
+      } = _this10.inputTable;
 
       if (keyColumns.length === 0) {
         throw new Error('No key columns to allow deletion');
       }
 
-      var pendingAreaRange = _this2.getPendingAreaRange();
+      var pendingAreaRange = _this10.getPendingAreaRange();
 
-      var pendingRanges = ranges.map(range => GridRange.intersection(pendingAreaRange, range)).filter(range => range != null).map(range => {
-        assertNotNull(range);
-        return GridRange.offset(range, 0, -(_this2.floatingTopRowCount + _this2.table.size));
-      });
+      var pendingRanges = ranges.map(range => GridRange.intersection(pendingAreaRange, range)).filter(range => range != null).map(range => GridRange.offset(range, 0, -(_this10.floatingTopRowCount + _this10.table.size)));
 
       if (pendingRanges.length > 0) {
-        var newDataMap = new Map(_superprop_getPendingDataMap());
+        var newDataMap = new Map(_this10.pendingNewDataMap);
 
         for (var i = 0; i < pendingRanges.length; i += 1) {
           var pendingRange = pendingRanges[i];
-          assertNotNull(pendingRange.startRow);
-          assertNotNull(pendingRange.endRow);
 
           for (var r = pendingRange.startRow; r <= pendingRange.endRow; r += 1) {
             newDataMap.delete(r);
           }
         }
 
-        _superprop_setPendingDataMap(newDataMap);
-
-        _this2.formattedStringData = [];
+        _this10.pendingNewDataMap = newDataMap;
+        _this10.formattedStringData = [];
 
-        _this2.dispatchEvent(new EventShimCustomEvent(IrisGridModel.EVENT.PENDING_DATA_UPDATED));
+        _this10.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.PENDING_DATA_UPDATED));
 
-        _this2.dispatchEvent(new EventShimCustomEvent(IrisGridModel.EVENT.UPDATED));
+        _this10.dispatchEvent(new CustomEvent(IrisGridModel.EVENT.UPDATED));
       }
 
-      var tableAreaRange = _this2.getTableAreaRange();
+      var tableAreaRange = _this10.getTableAreaRange();
 
       var tableRanges = ranges.map(range => GridRange.intersection(tableAreaRange, range)).filter(range => range != null);
 
       if (tableRanges.length <= 0) {
-        return;
+        return null;
       }
 
       var [data, deleteTable] = yield Promise.all([// Need to get the key values of each row
-      _this2.snapshot(tableRanges.map(range => {
-        assertNotNull(range);
-        return new GridRange(0, range.startRow, keyColumns.length - 1, range.endRow);
-      })), _this2.table.copy()]); // Now copy the existing table and filter it on the values in the snapshot for the key columns in the input table
+      _this10.snapshot(tableRanges.map(range => new GridRange(0, range.startRow, keyColumns.length - 1, range.endRow))), _this10.table.copy()]); // Now copy the existing table and filter it on the values in the snapshot for the key columns in the input table
 
       var filters = data.map(row => {
         var columnFilters = [];
@@ -362,11 +1674,22 @@ class IrisGridTableModel extends IrisGridTableModelTemplate {
       });
       var filter = filters.reduce((agg, curr) => agg ? agg.or(curr) : curr);
       deleteTable.applyFilter([filter]);
-      yield (_this2$inputTable = _this2.inputTable) === null || _this2$inputTable === void 0 ? void 0 : _this2$inputTable.deleteTable(deleteTable);
+      var result = yield _this10.inputTable.deleteTable(deleteTable);
       deleteTable.close();
+      return result;
     })();
   }
 
+  isValidForCell(x, y, value) {
+    try {
+      var column = this.columns[x];
+      TableUtils.makeValue(column.type, value, this.formatter.timeZone);
+      return true;
+    } catch (e) {
+      return false;
+    }
+  }
+
 }
 
 _defineProperty(IrisGridTableModel, "ROW_BUFFER_PAGES", 1);