@oracle/oraclejet 12.0.4 → 12.1.2

package/dist/js/libs/oj/debug_esm/ojtable.js

@@ -2018,6 +2018,7 @@ Table.prototype._clearAllComponentBusyStates = function () {
 Table.prototype._cleanComponent = function (isDestroy) {
   // cleanup needed for both, 'destroy()' and 'ReleaseResources()' calls
 
+  this._animateOnFetch = null;
   this._isEditPending = null;
   this._active = null;
   this._isTableTab = null;
@@ -2598,8 +2599,6 @@ Table.prototype._refreshTableBody = function (resultObject, startIndex, keepVisi
 
   var rows = this._getRowIdxRowArray(resultObject, startIndex);
   var checkFocus = $.contains(tableBody, document.activeElement);
-  var tableBodyRows;
-  var tableBodyRow;
   var resetFocus = false;
   var i;
 
@@ -2613,15 +2612,12 @@ Table.prototype._refreshTableBody = function (resultObject, startIndex, keepVisi
     }
     this._removeAllTableBodyRows();
   } else {
-    tableBodyRows = this._getTableBodyRows();
-    if (tableBodyRows.length > 0) {
-      var tableBodyRowsCount = tableBodyRows.length;
+    var tableBodyRowsCount = this._getTableBodyRows().length;
+    if (tableBodyRowsCount > 0) {
       for (i = tableBodyRowsCount - 1; i >= startIndex; i--) {
         if (checkFocus) {
-          tableBodyRow = this._getTableBodyRow(i);
-
-          if (tableBodyRow != null &&
-                $.contains(tableBodyRow, document.activeElement)) {
+          var tableBodyRow = this._getTableBodyRow(i);
+          if (tableBodyRow != null && $.contains(tableBodyRow, document.activeElement)) {
             resetFocus = true;
             checkFocus = false;
           }
@@ -2643,8 +2639,8 @@ Table.prototype._refreshTableBody = function (resultObject, startIndex, keepVisi
     this._refreshAddNewRowPlaceholder(tableBodyDocFrag, true);
   }
 
-  // if no data then bail
-  if (rows.length === 0 && this._getRawTableBodyRow(0) == null) {
+  // if no new rows, and no existing rows, show no data message
+  if (rows.length === 0 && this._getTableBodyRows().length === 0) {
     this._appendElementToTableBody(tableBodyDocFrag, tableBody);
     this._showNoDataMessage();
     return this._finalizeNonBodyRowRendering([tableBody]);
@@ -3133,19 +3129,25 @@ Table.prototype._showStatusMessage = function () {
   }
   var tempSkeletonRow = this._getTableTempSkeletonRow();
   if (!this._statusMessageShown && !tempSkeletonRow) {
-    this._showStatusTimeout = setTimeout(function () { // @HTMLUpdateOK
-      this._refreshTableStatusPosition(true);
-      this._showStatusTimeout = null;
-    }.bind(this), this._getShowStatusDelay());
-    if (this._isSkeletonSupport() && !this._isPagingModelDataProvider()) {
-      // clear any existing table rows (if a sort for example)
-      // skip this step if paging data since paging data should
-      // have already been fetched by the paging control
+    // clear any existing table rows (if a sort for example)
+    if (this._isSkeletonSupport()) {
+      var dataprovider = this._getData();
+      if (dataprovider instanceof oj.TableDataSourceAdapter) {
+        // if using legacy data source, and start index is greater than 0, leave current rows (paging loadMore case)
+        var adapterStartIndex = dataprovider._startIndex;
+        if (adapterStartIndex != null && adapterStartIndex > 0) {
+          return;
+        }
+      }
       if (this._isExternalScrollEnabled()) {
         this._bufferScrollerForLastRow();
       }
       this._removeAllTableBodyRows();
     }
+    this._showStatusTimeout = setTimeout(function () { // @HTMLUpdateOK
+      this._refreshTableStatusPosition(true);
+      this._showStatusTimeout = null;
+    }.bind(this), this._getShowStatusDelay());
   }
 };
 
@@ -5008,6 +5010,7 @@ Table.prototype._invokeDataFetchRows = function (options) {
   var dataprovider = this._getData();
   if (dataprovider != null) {
     return new Promise(function (resolve) {
+      this._animateOnFetch = false;
       this._noMoreData = false;
       this._setDataWaitingState();
       this._hasRefreshInQueue = false;
@@ -6587,6 +6590,26 @@ TableLayoutManager.prototype.registerScrollListeners = function () {
   }
 };
 
+/**
+ * @private
+ */
+TableLayoutManager.prototype.updateCurrentScrollState = function () {
+  var scroller = this.getScroller();
+  var newScrollLeft = this._table._getElementScrollLeft(scroller);
+  var newScrollTop = scroller.scrollTop;
+
+  if (newScrollLeft !== this._table._scrollLeft || newScrollTop !== this._table._scrollTop) {
+    this._handleScrollerScrollLeft(newScrollLeft);
+    this._handleScrollerScrollTop(newScrollTop);
+
+    this._table.option('scrollPosition', this._table._getCurrentScrollPosition(), {
+      _context: {
+        internalSet: true
+      }
+    });
+  }
+};
+
 /**
  * @private
  */
@@ -7340,7 +7363,7 @@ TableLayoutManager.prototype.removeDragOverIndicatorColumn = function () { };
 /**
  * @private
  */
- TableLayoutManager.prototype._getPageX = function (event) {
+TableLayoutManager.prototype._getPageX = function (event) {
   if (event.pageX !== undefined) {
     // MouseEvent has pageX on event itself
     return event.pageX;
@@ -7583,9 +7606,10 @@ TableLegacyLayoutManager.prototype.getHorizontalOverflowDiff = function (columnC
   if (isRTL) {
     horDiff.left = (scrollingElementRect.left - columnRect.left) + scrollbarWidth;
     horDiff.right = columnRect.right - scrollingElementRect.right;
+  } else {
+    horDiff.left = scrollingElementRect.left - columnRect.left;
+    horDiff.right = (columnRect.right - scrollingElementRect.right) + scrollbarWidth;
   }
-  horDiff.left = scrollingElementRect.left - columnRect.left;
-  horDiff.right = (columnRect.right - scrollingElementRect.right) + scrollbarWidth;
   return horDiff;
 };
 
@@ -8529,6 +8553,15 @@ TableStickyLayoutManager.prototype.getScroller = function () {
   return this._scroller;
 };
 
+/**
+ * Returns true iff the table scroller is set to 'html' (special case for scroll offset logic)
+ * @private
+ */
+TableStickyLayoutManager.prototype._isHTMLScroller = function () {
+  return (this._table.options.scrollPolicyOptions != null &&
+          this._table.options.scrollPolicyOptions.scroller === 'html');
+};
+
 /**
  * Returns the table scrollable content element
  * @return {Element} the table scrollable content element
@@ -8613,12 +8646,13 @@ TableStickyLayoutManager.prototype._handleScrollerScrollLeft = function (scrollL
  * @param {Element} tableBodyRow The row to be scrolled.
  * @private
  */
- TableStickyLayoutManager.prototype.getVerticalOverflowDiff = function (tableBodyRow) {
-  var rowRect = tableBodyRow.getBoundingClientRect();
-  var scrollingElementRect = this.getScroller().getBoundingClientRect();
-  var scrollBarHeight = this.getScrollBarHeight();
+TableStickyLayoutManager.prototype.getVerticalOverflowDiff = function (tableBodyRow) {
+  var scrollerTop;
+  var scrollerBottom;
   var scrollerTopOffset;
   var scrollerBottomOffset;
+
+  var rowRect = tableBodyRow.getBoundingClientRect();
   if (this._table._isExternalScrollEnabled()) {
     scrollerTopOffset = (this._table.options.scrollPolicyOptions.scrollerOffsetTop == null) ?
       0 : this._table.options.scrollPolicyOptions.scrollerOffsetTop;
@@ -8638,13 +8672,23 @@ TableStickyLayoutManager.prototype._handleScrollerScrollLeft = function (scrollL
   }
   var footer = this._table._getTableFooter();
   if (footer != null) {
-    scrollerBottomOffset -= footer.offsetHeight;
+    scrollerBottomOffset += footer.offsetHeight;
   }
 
-  var vertDiff = {};
-  vertDiff.top = (scrollingElementRect.top + scrollerTopOffset) - rowRect.top;
-  vertDiff.bottom = (rowRect.bottom - scrollingElementRect.bottom - scrollerBottomOffset) +
-    scrollBarHeight;
+  // special case for using overall page scroller with boundingClientRect values
+  if (this._isHTMLScroller()) {
+    scrollerTop = 0;
+    scrollerBottom = this.getScroller().clientHeight;
+  } else {
+    var scrollBarHeight = this.getScrollBarHeight();
+    var scrollingElementRect = this.getScroller().getBoundingClientRect();
+    scrollerTop = scrollingElementRect.top;
+    scrollerBottom = scrollingElementRect.bottom - scrollBarHeight;
+  }
+  var vertDiff = {
+    top: (scrollerTop + scrollerTopOffset) - rowRect.top,
+    bottom: (rowRect.bottom - scrollerBottom + scrollerBottomOffset)
+  };
   return vertDiff;
 };
 
@@ -8793,8 +8837,10 @@ TableStickyLayoutManager.prototype.refreshTableDimensions = function () {
   this._setupTableHeight(bottomSlotHeight);
 
   overallWidth = this._determineColumnWidths();
-  tableElem.style[Table.CSS_PROP._WIDTH] = overallWidth + Table.CSS_VAL._PX;
-  tableElem.style['table-layout'] = 'fixed';
+  if (overallWidth > 0) {
+    tableElem.style[Table.CSS_PROP._WIDTH] = overallWidth + Table.CSS_VAL._PX;
+    tableElem.style['table-layout'] = 'fixed';
+  }
   this._initializeFrozenColumns();
   this._updateAddRowTop();
 
@@ -9713,108 +9759,364 @@ TableStickyLayoutManager.prototype._getTableColumnDropIndicator = function () {
 };
 
 /**
- * Creates an accessibility-specific child DOM element that contains the
- * current context information for the Table.
  * @private
  */
-Table.prototype._createContextInfo = function () {
-  var contextInfo = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
-  contextInfo.id = this.createSubId('context');
-  contextInfo.classList.add(Table.CSS_CLASSES._TABLE_ACC_CONTEXT_INFO_CLASS);
-  contextInfo.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
-
-  // table context info
-  var tableContext = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
-  tableContext.id = this.createSubId('tableContext');
-  tableContext.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
-  contextInfo.appendChild(tableContext);
-
-  // row context info
-  var rowContext = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
-  rowContext.id = this.createSubId('rowContext');
-  rowContext.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
-  contextInfo.appendChild(rowContext);
+const TableFixedLayoutManager = function (table) {
+  TableFixedLayoutManager.superclass.constructor.call(this, table);
+};
 
-  // column context info
-  var columnContext = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
-  columnContext.id = this.createSubId('columnContext');
-  columnContext.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
-  contextInfo.appendChild(columnContext);
+// Subclass from oj.Object
+oj.Object.createSubclass(TableFixedLayoutManager, TableStickyLayoutManager, 'TableFixedLayoutManager');
 
-  this._getTableContainer().appendChild(contextInfo);
-  this._tableContextInfo = tableContext;
-  this._rowContextInfo = rowContext;
-  this._columnContextInfo = columnContext;
 
-  return contextInfo;
+/**
+ * @private
+ */
+TableFixedLayoutManager.prototype._clearAllCache = function () {
+  TableFixedLayoutManager.superclass._clearAllCache.call(this);
+  this._columnWeights = null;
+  this._columnMinWidths = null;
+  this._columnMaxWidths = null;
 };
 
 /**
- * Creates an accessibility-specific child DOM element that contains the
- * current state information for the Table.
+ * Ensures the preferred column width variables are populated. Also resets the inner Table element's styling
+ * if required. Returns true iff the inner Table element's styling was reset. Returns false otherwise.
  * @private
  */
-Table.prototype._createStateInfo = function () {
-  var stateInfo = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
-  stateInfo.id = this.createSubId('state');
-  stateInfo.classList.add(Table.CSS_CLASSES._TABLE_ACC_STATE_INFO_CLASS);
-  stateInfo.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
-  this._getTableContainer().appendChild(stateInfo);
-  this._stateInfo = stateInfo;
+TableFixedLayoutManager.prototype._initializeColumnLayouts = function () {
+  var i;
+  var isResetTableElemStyle = false;
 
-  return stateInfo;
+  // determine selector min width if needed
+  if (this._table._isDefaultSelectorEnabled()) {
+    if (this._selectorColWidth == null) {
+      isResetTableElemStyle = true;
+      var headerSelector = this._table._getTableSelectorColumn();
+      if (headerSelector != null) {
+        this._selectorColWidth = headerSelector.offsetWidth;
+      } else {
+        var tableBodyRow = this._table._getTableBodyRow(0);
+        var selectorCell = this._table._getTableBodySelectorCell(tableBodyRow);
+        if (selectorCell != null) {
+          this._selectorColWidth = selectorCell.offsetWidth;
+        }
+      }
+    }
+  } else if (this._selectorColWidth != null) {
+    isResetTableElemStyle = true;
+    this._selectorColWidth = null;
+  }
+
+  var columns = this._table._getColumnDefs();
+  var columnsCount = columns.length;
+
+
+  // determine column weights if needed
+  if (this._columnWeights == null) {
+    isResetTableElemStyle = true;
+    this._columnWeights = [];
+    // loop through columns to get the remaining column widths
+    for (i = 0; i < columnsCount; i++) {
+      var columnWeight = parseFloat(columns[i].weight);
+      // TODO: throw a warning here when weight is less than 1
+      if (columnWeight <= 1) {
+        columnWeight = 1;
+      }
+      this._columnWeights[i] = columnWeight;
+    }
+  }
+
+  // determine column min widths if needed
+  if (this._columnMinWidths == null) {
+    isResetTableElemStyle = true;
+    this._columnMinWidths = [];
+    // loop through columns to get the remaining column widths
+    for (i = 0; i < columnsCount; i++) {
+      var minWidth = this._getPixelStyleEquivalent(columns[i].minWidth);
+      // minWidth MUST be set and greater than 0 when fixed layout is specified
+      // TODO: throw a warning when it is not set or invalid
+      if (minWidth == null || minWidth <= 0) {
+        this._columnMinWidths[i] = 1;
+      } else {
+        this._columnMinWidths[i] = minWidth;
+      }
+    }
+  }
+
+  // determine column max widths if needed
+  if (this._columnMaxWidths == null) {
+    isResetTableElemStyle = true;
+    this._columnMaxWidths = [];
+    // loop through columns to get the remaining column widths
+    for (i = 0; i < columnsCount; i++) {
+      var maxWidth = this._getPixelStyleEquivalent(columns[i].maxWidth);
+      // maxWidth MUST be null or greater than 0
+      // TODO: throw a warning when it is nvalid
+      if (maxWidth != null && maxWidth <= 0) {
+        this._columnMaxWidths[i] = null;
+      } else {
+        this._columnMaxWidths[i] = maxWidth;
+      }
+    }
+  }
+
+  // determine column init widths if needed
+  if (this._columnInitWidths == null) {
+    isResetTableElemStyle = true;
+    this._resetTableElementStyling();
+
+    this._columnInitWidths = [];
+
+    // loop through columns to get the remaining column widths
+    for (i = 0; i < columnsCount; i++) {
+      // find column header cell width
+      var headerCell = this._table._getTableHeaderColumn(i);
+      if (headerCell != null) {
+        this._columnInitWidths[i] = headerCell.offsetWidth;
+      } else {
+        // find column table body cell widths
+        var tableBodyCell = this._table._getTableBodyCell(0, i, null);
+        if (tableBodyCell != null) {
+          this._columnInitWidths[i] = tableBodyCell.offsetWidth;
+        }
+      }
+    }
+  } else if (isResetTableElemStyle) {
+    this._resetTableElementStyling();
+  }
+  return isResetTableElemStyle;
 };
 
 /**
- * Creates an accessibility-specific child DOM element that contains the
- * current state information for the current row.
  * @private
  */
-Table.prototype._createRowStateInfo = function () {
-  var rowStateInfo = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
-  rowStateInfo.id = this.createSubId('rowState');
-  rowStateInfo.classList.add(Table.CSS_CLASSES._TABLE_ACC_ROW_STATE_INFO_CLASS);
-  rowStateInfo.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
-  this._getTableContainer().appendChild(rowStateInfo);
-  this._rowStateInfo = rowStateInfo;
+TableFixedLayoutManager.prototype._resetTableElementStyling = function () {
+  // reset styling on the table element
+  var tableElem = this._table._getTable();
+  tableElem.style = '';
 
-  return rowStateInfo;
+  // reset styling on each col group
+  this._removeHeaderColumnAndCellColumnWidths();
 };
 
 /**
- * Create a div element for the accessibility notifications
- * @return {Element} div DOM element
  * @private
  */
-Table.prototype._createTableStatusAccNotification = function () {
-  var tableContainer = this._getTableContainer();
-  var statusNotification = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
-  statusNotification.setAttribute(Table.DOM_ATTR._ROLE, 'status'); // @HTMLUpdateOK
-  statusNotification.classList.add(Table.CSS_CLASSES._TABLE_STATUS_ACC_NOTIFICATION_CLASS);
-  statusNotification.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
-  tableContainer.appendChild(statusNotification); // @HTMLUpdateOK
-  this._cacheDomElement(Table.CSS_CLASSES._TABLE_STATUS_ACC_NOTIFICATION_CLASS,
-                        statusNotification);
+TableFixedLayoutManager.prototype._removeTableDimensionsStyling = function () {
+  this.unregisterScrollListeners();
+};
 
-  this._accStatus = statusNotification;
-  return statusNotification;
+/**
+ * @private
+ */
+TableFixedLayoutManager.prototype._determineColumnWidths = function () {
+  var tableScroller = this._table._getTableScroller();
+  var initScrollerWidth = tableScroller.clientWidth;
+  return this._setAllColumnWidths(initScrollerWidth);
 };
 
 /**
  * @private
  */
-Table.prototype._updateAccStatusInfo = function (columnHint) {
-  var i;
-  var actionableElems;
-  var label = '';
-  var stateInfo = '';
-  var tableHeaderColumn;
+TableFixedLayoutManager.prototype._setAllColumnWidths = function (scrollerWidth) {
+  var columns = this._table._getColumnDefs();
+  var columnsCount = columns.length;
 
-  if (this._active == null) {
-    return;
-  }
+  var totalWidth = this._selectorColWidth != null ? this._selectorColWidth : 0;
+  var forcedTotal = totalWidth;
+  var freeWeightTotal = 0;
+  var columnWidths = [];
+  this._appliedColumnWidths = [];
 
-  // include overall Table aria-label if needed
+  var i;
+  var forcedColumnWidths = [];
+  for (i = 0; i < columnsCount; i++) {
+    var columnWidth = this._getPixelStyleEquivalent(columns[i].width);
+    if (columnWidth != null) {
+      forcedColumnWidths[i] = columnWidth;
+      forcedTotal += columnWidth;
+    } else {
+      if (this._columnInitWidths[i] > 0) {
+        columnWidth = this._columnMinWidths[i];
+        freeWeightTotal += this._columnWeights[i];
+      } else {
+        columnWidth = 0;
+      }
+      forcedColumnWidths[i] = false;
+    }
+    columnWidths[i] = columnWidth;
+    totalWidth += columnWidth;
+  }
+
+  // handle case where forced widths do not fill viewport
+  if (forcedTotal < scrollerWidth) {
+    var continueSizing = true;
+    // flag to check track whether full sizing run was successfull
+    while (continueSizing) {
+      var currentFreeWeightTotal = freeWeightTotal;
+      continueSizing = false;
+      var widthDiff = scrollerWidth - forcedTotal;
+      for (i = 0; i < columnsCount; i++) {
+        if (forcedColumnWidths[i] === false) {
+          var currentWidth = columnWidths[i];
+          // only adjust widths for columns that are visible
+          if (currentWidth > 0) {
+            // round width percentage update to nearest int, and subtract that from adjustable info
+            var currentWeight = this._columnWeights[i];
+            var newWidth = Math.floor((currentWeight / currentFreeWeightTotal) * widthDiff);
+
+            // if calculated width breaks min or max width requirement, force width as needed, and restart weight distribution logic
+            var minWidth = this._columnMinWidths[i];
+            var maxWidth = this._columnMaxWidths[i];
+            if (minWidth != null && newWidth < minWidth) {
+              forcedColumnWidths[i] = minWidth;
+              forcedTotal += minWidth;
+              freeWeightTotal -= currentWeight;
+              columnWidths[i] = minWidth;
+              continueSizing = true;
+              break;
+            } else if (maxWidth != null && newWidth > maxWidth) {
+              forcedColumnWidths[i] = maxWidth;
+              forcedTotal += maxWidth;
+              freeWeightTotal -= currentWeight;
+              columnWidths[i] = maxWidth;
+              continueSizing = true;
+              break;
+            }
+            columnWidths[i] = newWidth;
+            currentFreeWeightTotal -= currentWeight;
+            widthDiff -= newWidth;
+          }
+        }
+      }
+      totalWidth = scrollerWidth;
+    }
+  }
+
+  for (i = 0; i < columnsCount; i++) {
+    var tableCol = this._table._getTableCol(i);
+    var colWidth = columnWidths[i];
+    tableCol.style[Table.CSS_PROP._WIDTH] = colWidth + Table.CSS_VAL._PX;
+    if (colWidth === 0) {
+      // set the display value to none or else the following column will not be shown
+      tableCol.style[Table.CSS_PROP._DISPLAY] = Table.CSS_VAL._NONE;
+    }
+    this._appliedColumnWidths[i] = colWidth;
+  }
+  return totalWidth;
+};
+
+/**
+ * @private
+ */
+TableFixedLayoutManager.prototype._getMinWidthAutoEquivalent = function () {
+  return 100;
+};
+
+/**
+ * Creates an accessibility-specific child DOM element that contains the
+ * current context information for the Table.
+ * @private
+ */
+Table.prototype._createContextInfo = function () {
+  var contextInfo = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
+  contextInfo.id = this.createSubId('context');
+  contextInfo.classList.add(Table.CSS_CLASSES._TABLE_ACC_CONTEXT_INFO_CLASS);
+  contextInfo.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
+
+  // table context info
+  var tableContext = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
+  tableContext.id = this.createSubId('tableContext');
+  tableContext.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
+  contextInfo.appendChild(tableContext);
+
+  // row context info
+  var rowContext = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
+  rowContext.id = this.createSubId('rowContext');
+  rowContext.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
+  contextInfo.appendChild(rowContext);
+
+  // column context info
+  var columnContext = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
+  columnContext.id = this.createSubId('columnContext');
+  columnContext.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
+  contextInfo.appendChild(columnContext);
+
+  this._getTableContainer().appendChild(contextInfo);
+  this._tableContextInfo = tableContext;
+  this._rowContextInfo = rowContext;
+  this._columnContextInfo = columnContext;
+
+  return contextInfo;
+};
+
+/**
+ * Creates an accessibility-specific child DOM element that contains the
+ * current state information for the Table.
+ * @private
+ */
+Table.prototype._createStateInfo = function () {
+  var stateInfo = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
+  stateInfo.id = this.createSubId('state');
+  stateInfo.classList.add(Table.CSS_CLASSES._TABLE_ACC_STATE_INFO_CLASS);
+  stateInfo.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
+  this._getTableContainer().appendChild(stateInfo);
+  this._stateInfo = stateInfo;
+
+  return stateInfo;
+};
+
+/**
+ * Creates an accessibility-specific child DOM element that contains the
+ * current state information for the current row.
+ * @private
+ */
+Table.prototype._createRowStateInfo = function () {
+  var rowStateInfo = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
+  rowStateInfo.id = this.createSubId('rowState');
+  rowStateInfo.classList.add(Table.CSS_CLASSES._TABLE_ACC_ROW_STATE_INFO_CLASS);
+  rowStateInfo.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
+  this._getTableContainer().appendChild(rowStateInfo);
+  this._rowStateInfo = rowStateInfo;
+
+  return rowStateInfo;
+};
+
+/**
+ * Create a div element for the accessibility notifications
+ * @return {Element} div DOM element
+ * @private
+ */
+Table.prototype._createTableStatusAccNotification = function () {
+  var tableContainer = this._getTableContainer();
+  var statusNotification = document.createElement(Table.DOM_ELEMENT._DIV); // @HTMLUpdateOK
+  statusNotification.setAttribute(Table.DOM_ATTR._ROLE, 'status'); // @HTMLUpdateOK
+  statusNotification.classList.add(Table.CSS_CLASSES._TABLE_STATUS_ACC_NOTIFICATION_CLASS);
+  statusNotification.classList.add(Table.CSS_CLASSES._HIDDEN_CONTENT_ACC_CLASS);
+  tableContainer.appendChild(statusNotification); // @HTMLUpdateOK
+  this._cacheDomElement(Table.CSS_CLASSES._TABLE_STATUS_ACC_NOTIFICATION_CLASS,
+                        statusNotification);
+
+  this._accStatus = statusNotification;
+  return statusNotification;
+};
+
+/**
+ * @private
+ */
+Table.prototype._updateAccStatusInfo = function (columnHint) {
+  var i;
+  var actionableElems;
+  var label = '';
+  var stateInfo = '';
+  var tableHeaderColumn;
+
+  if (this._active == null) {
+    return;
+  }
+
+  // include overall Table aria-label if needed
   if (this._accFirstFocus !== false) {
     var columnCount = this._getColumnDefs().length;
     if (this._isDefaultSelectorEnabled()) {
@@ -15866,6 +16168,7 @@ Table.prototype._scrollRowIntoViewport = function (rowIdx) {
       $scrollingElement.scrollTop($scrollingElement.scrollTop() - topOverflowDiff);
     }
     this._skipScrollUpdate = false;
+    layoutManager.updateCurrentScrollState();
   } else if (hasTopOverflow) {
     if (Math.abs(bottomOverflowDiff) > Math.abs(topOverflowDiff)) {
       $scrollingElement.scrollTop($scrollingElement.scrollTop() - topOverflowDiff);
@@ -15873,6 +16176,7 @@ Table.prototype._scrollRowIntoViewport = function (rowIdx) {
       $scrollingElement.scrollTop($scrollingElement.scrollTop() + bottomOverflowDiff);
     }
     this._skipScrollUpdate = false;
+    layoutManager.updateCurrentScrollState();
   }
 };
 
@@ -15920,6 +16224,7 @@ Table.prototype._scrollColumnIntoViewport = function (columnIdx) {
       $scrollingElement.scrollLeft($scrollingElement.scrollLeft() + rightOverflowDiff);
     }
     this._skipScrollUpdate = false;
+    layoutManager.updateCurrentScrollState();
   } else if (hasRightOverflow) {
     if (Math.abs(leftOverflowDiff) > Math.abs(rightOverflowDiff)) {
       $scrollingElement.scrollLeft($scrollingElement.scrollLeft() + rightOverflowDiff);
@@ -15927,6 +16232,7 @@ Table.prototype._scrollColumnIntoViewport = function (columnIdx) {
       $scrollingElement.scrollLeft($scrollingElement.scrollLeft() - leftOverflowDiff);
     }
     this._skipScrollUpdate = false;
+    layoutManager.updateCurrentScrollState();
   }
 };
 
@@ -17191,7 +17497,7 @@ Table.prototype._applyActionableMode = function (boundaryElement, skipFocusShift
   if (element != null) {
     // enable all focusable elements
     enableAllFocusableElements(boundaryElement);
-    var tabbableElementsInFocusedElement = this._getTabbableElements(element);
+    var tabbableElementsInFocusedElement = getFocusableElementsInNode(element);
     // only set actionable mode if there are any tabbable elements in the row
     if (tabbableElementsInFocusedElement.length > 0) {
       // set active internal state to actionable BEFORE focus is set, otherwise screen reader
@@ -17453,7 +17759,6 @@ Table.prototype._setTableEditable = function (editable, cancelled, columnIdx, fo
             this._getTable().setAttribute(Table.DOM_ATTR._ARIA_LABELLEDBY, ''); // @HTMLUpdateOK
             this._accStatus.setAttribute(Table.DOM_ATTR._ARIA_LABELLEDBY, ''); // @HTMLUpdateOK
             // re-render the newly editable row
-            this._getLayoutManager().notifyTableUpdate(Table._UPDATE._ROW_REFRESH);
             return this._refreshRow(rowIdx, true).then(function () {
               // set focus on the column in the row
               this._setActiveRow(rowIdx, event);
@@ -17514,7 +17819,6 @@ Table.prototype._setTableEditable = function (editable, cancelled, columnIdx, fo
       this._accStatus.setAttribute(Table.DOM_ATTR._ARIA_LABELLEDBY, ''); // @HTMLUpdateOK
       // re-render the newly editable row
       this._queueTask(function () {
-        this._getLayoutManager().notifyTableUpdate(Table._UPDATE._ROW_REFRESH);
         return this._refreshRow(rowIdx, true).then(function () {
           // set focus on the column in the row
           this._setActiveRow(rowIdx, event);
@@ -17535,7 +17839,6 @@ Table.prototype._setTableEditable = function (editable, cancelled, columnIdx, fo
       if (prevEditableTableBodyRow != null) {
         this._queueTask(function () {
           // re-render the previously editable row, which will be read-only now
-          this._getLayoutManager().notifyTableUpdate(Table._UPDATE._ROW_REFRESH);
           return this._refreshRow(prevEditableRowIdx, false);
         }.bind(this));
       }
@@ -17848,20 +18151,6 @@ Table.prototype._handleKeydownUpDown = function (event, isExtend) {
   }
 };
 
-/**
- * Get tabbable elements within the element
- * @param {Element} element  DOM element
- * @param {boolean=} ignoreHidden ignore accessibility hidden elements
- * @return {Array|null} Array of DOM elements
- * @private
- */
-Table.prototype._getTabbableElements = function (element, ignoreHidden) {
-  var tabbableElements = ignoreHidden ?
-    $(element).find(':tabbable') :
-    $(element).find(':tabbable').not('.oj-helper-hidden-accessible');
-  return tabbableElements.toArray();
-};
-
 /**
  * Handler for Tab keydown.
  * @param {Object} event
@@ -17880,7 +18169,7 @@ Table.prototype._handleKeydownTab = function (event) {
     // If we are on an editable row and there are no more editable
     // elements to focus to then go to the next row
     var tableBodyRow = this._getTableBodyRow(focusedRowIdx);
-    var tabbableElementsInRow = this._getTabbableElements(tableBodyRow);
+    var tabbableElementsInRow = getFocusableElementsInNode(tableBodyRow);
     var tabbableElementsInRowCount = tabbableElementsInRow.length;
     var rowElementTabIndex = $(tabbableElementsInRow).index(currentFocusElement);
 
@@ -17908,7 +18197,8 @@ Table.prototype._handleKeydownTab = function (event) {
       activeBoundary = this._getActiveElement();
     }
 
-    tabbableElementsInFocusedElement = this._getTabbableElements(activeBoundary);
+    tabbableElementsInFocusedElement =
+      getFocusableElementsInNode(activeBoundary);
 
     // If only one tabbable element then stay on it
     if (tabbableElementsInFocusedElement.length > 1) {
@@ -19921,262 +20211,6 @@ Table.prototype._updateSelector = function (selected) {
   }
 };
 
-/**
- * @private
- */
-const TableFixedLayoutManager = function (table) {
-  TableFixedLayoutManager.superclass.constructor.call(this, table);
-};
-
-// Subclass from oj.Object
-oj.Object.createSubclass(TableFixedLayoutManager, TableStickyLayoutManager, 'TableFixedLayoutManager');
-
-
-/**
- * @private
- */
-TableFixedLayoutManager.prototype._clearAllCache = function () {
-  TableFixedLayoutManager.superclass._clearAllCache.call(this);
-  this._columnWeights = null;
-  this._columnMinWidths = null;
-  this._columnMaxWidths = null;
-};
-
-/**
- * Ensures the preferred column width variables are populated. Also resets the inner Table element's styling
- * if required. Returns true iff the inner Table element's styling was reset. Returns false otherwise.
- * @private
- */
-TableFixedLayoutManager.prototype._initializeColumnLayouts = function () {
-  var i;
-  var isResetTableElemStyle = false;
-
-  // determine selector min width if needed
-  if (this._table._isDefaultSelectorEnabled()) {
-    if (this._selectorColWidth == null) {
-      isResetTableElemStyle = true;
-      var headerSelector = this._table._getTableSelectorColumn();
-      if (headerSelector != null) {
-        this._selectorColWidth = headerSelector.offsetWidth;
-      } else {
-        var tableBodyRow = this._table._getTableBodyRow(0);
-        var selectorCell = this._table._getTableBodySelectorCell(tableBodyRow);
-        if (selectorCell != null) {
-          this._selectorColWidth = selectorCell.offsetWidth;
-        }
-      }
-    }
-  } else if (this._selectorColWidth != null) {
-    isResetTableElemStyle = true;
-    this._selectorColWidth = null;
-  }
-
-  var columns = this._table._getColumnDefs();
-  var columnsCount = columns.length;
-
-
-  // determine column weights if needed
-  if (this._columnWeights == null) {
-    isResetTableElemStyle = true;
-    this._columnWeights = [];
-    // loop through columns to get the remaining column widths
-    for (i = 0; i < columnsCount; i++) {
-      var columnWeight = parseFloat(columns[i].weight);
-      // TODO: throw a warning here when weight is less than 1
-      if (columnWeight <= 1) {
-        columnWeight = 1;
-      }
-      this._columnWeights[i] = columnWeight;
-    }
-  }
-
-  // determine column min widths if needed
-  if (this._columnMinWidths == null) {
-    isResetTableElemStyle = true;
-    this._columnMinWidths = [];
-    // loop through columns to get the remaining column widths
-    for (i = 0; i < columnsCount; i++) {
-      var minWidth = this._getPixelStyleEquivalent(columns[i].minWidth);
-      // minWidth MUST be set and greater than 0 when fixed layout is specified
-      // TODO: throw a warning when it is not set or invalid
-      if (minWidth == null || minWidth <= 0) {
-        this._columnMinWidths[i] = 1;
-      } else {
-        this._columnMinWidths[i] = minWidth;
-      }
-    }
-  }
-
-  // determine column max widths if needed
-  if (this._columnMaxWidths == null) {
-    isResetTableElemStyle = true;
-    this._columnMaxWidths = [];
-    // loop through columns to get the remaining column widths
-    for (i = 0; i < columnsCount; i++) {
-      var maxWidth = this._getPixelStyleEquivalent(columns[i].maxWidth);
-      // maxWidth MUST be null or greater than 0
-      // TODO: throw a warning when it is nvalid
-      if (maxWidth != null && maxWidth <= 0) {
-        this._columnMaxWidths[i] = null;
-      } else {
-        this._columnMaxWidths[i] = maxWidth;
-      }
-    }
-  }
-
-  // determine column init widths if needed
-  if (this._columnInitWidths == null) {
-    isResetTableElemStyle = true;
-    this._resetTableElementStyling();
-
-    this._columnInitWidths = [];
-
-    // loop through columns to get the remaining column widths
-    for (i = 0; i < columnsCount; i++) {
-      // find column header cell width
-      var headerCell = this._table._getTableHeaderColumn(i);
-      if (headerCell != null) {
-        this._columnInitWidths[i] = headerCell.offsetWidth;
-      } else {
-        // find column table body cell widths
-        var tableBodyCell = this._table._getTableBodyCell(0, i, null);
-        if (tableBodyCell != null) {
-          this._columnInitWidths[i] = tableBodyCell.offsetWidth;
-        }
-      }
-    }
-  } else if (isResetTableElemStyle) {
-    this._resetTableElementStyling();
-  }
-  return isResetTableElemStyle;
-};
-
-/**
- * @private
- */
-TableFixedLayoutManager.prototype._resetTableElementStyling = function () {
-  // reset styling on the table element
-  var tableElem = this._table._getTable();
-  tableElem.style = '';
-
-  // reset styling on each col group
-  this._removeHeaderColumnAndCellColumnWidths();
-};
-
-/**
- * @private
- */
-TableFixedLayoutManager.prototype._removeTableDimensionsStyling = function () {
-  this.unregisterScrollListeners();
-};
-
-/**
- * @private
- */
-TableFixedLayoutManager.prototype._determineColumnWidths = function () {
-  var tableScroller = this._table._getTableScroller();
-  var initScrollerWidth = tableScroller.clientWidth;
-  return this._setAllColumnWidths(initScrollerWidth);
-};
-
-/**
- * @private
- */
-TableFixedLayoutManager.prototype._setAllColumnWidths = function (scrollerWidth) {
-  var columns = this._table._getColumnDefs();
-  var columnsCount = columns.length;
-
-  var totalWidth = this._selectorColWidth != null ? this._selectorColWidth : 0;
-  var forcedTotal = totalWidth;
-  var freeWeightTotal = 0;
-  var columnWidths = [];
-  this._appliedColumnWidths = [];
-
-  var i;
-  var forcedColumnWidths = [];
-  for (i = 0; i < columnsCount; i++) {
-    var columnWidth = this._getPixelStyleEquivalent(columns[i].width);
-    if (columnWidth != null) {
-      forcedColumnWidths[i] = columnWidth;
-      forcedTotal += columnWidth;
-    } else {
-      if (this._columnInitWidths[i] > 0) {
-        columnWidth = this._columnMinWidths[i];
-        freeWeightTotal += this._columnWeights[i];
-      } else {
-        columnWidth = 0;
-      }
-      forcedColumnWidths[i] = false;
-    }
-    columnWidths[i] = columnWidth;
-    totalWidth += columnWidth;
-  }
-
-  // handle case where forced widths do not fill viewport
-  if (forcedTotal < scrollerWidth) {
-    var continueSizing = true;
-    // flag to check track whether full sizing run was successfull
-    while (continueSizing) {
-      var currentFreeWeightTotal = freeWeightTotal;
-      continueSizing = false;
-      var widthDiff = scrollerWidth - forcedTotal;
-      for (i = 0; i < columnsCount; i++) {
-        if (forcedColumnWidths[i] === false) {
-          var currentWidth = columnWidths[i];
-          // only adjust widths for columns that are visible
-          if (currentWidth > 0) {
-            // round width percentage update to nearest int, and subtract that from adjustable info
-            var currentWeight = this._columnWeights[i];
-            var newWidth = Math.floor((currentWeight / currentFreeWeightTotal) * widthDiff);
-
-            // if calculated width breaks min or max width requirement, force width as needed, and restart weight distribution logic
-            var minWidth = this._columnMinWidths[i];
-            var maxWidth = this._columnMaxWidths[i];
-            if (minWidth != null && newWidth < minWidth) {
-              forcedColumnWidths[i] = minWidth;
-              forcedTotal += minWidth;
-              freeWeightTotal -= currentWeight;
-              columnWidths[i] = minWidth;
-              continueSizing = true;
-              break;
-            } else if (maxWidth != null && newWidth > maxWidth) {
-              forcedColumnWidths[i] = maxWidth;
-              forcedTotal += maxWidth;
-              freeWeightTotal -= currentWeight;
-              columnWidths[i] = maxWidth;
-              continueSizing = true;
-              break;
-            }
-            columnWidths[i] = newWidth;
-            currentFreeWeightTotal -= currentWeight;
-            widthDiff -= newWidth;
-          }
-        }
-      }
-      totalWidth = scrollerWidth;
-    }
-  }
-
-  for (i = 0; i < columnsCount; i++) {
-    var tableCol = this._table._getTableCol(i);
-    var colWidth = columnWidths[i];
-    tableCol.style[Table.CSS_PROP._WIDTH] = colWidth + Table.CSS_VAL._PX;
-    if (colWidth === 0) {
-      // set the display value to none or else the following column will not be shown
-      tableCol.style[Table.CSS_PROP._DISPLAY] = Table.CSS_VAL._NONE;
-    }
-    this._appliedColumnWidths[i] = colWidth;
-  }
-  return totalWidth;
-};
-
-/**
- * @private
- */
-TableFixedLayoutManager.prototype._getMinWidthAutoEquivalent = function () {
-  return 100;
-};
-
 /**
  * @ojcomponent oj.ojTable
  * @augments oj.baseComponent
@@ -21492,7 +21526,7 @@ Table.prototype.options = {
    * <p>Changing the value of this attribute will not affect the value of the <a href="#selection">selection</a> or <a href="#selected">selected</a> attributes.
    *
    * <p>See the <a href="#selectionMode">selection-mode</a> attribute for usage examples.
-   * By default, this element does not allow any selection.
+   * By default, this element does not allow any selection. (As a note, the 'id' property of each column is required when column selection is enabled).
    *
    * @expose
    * @name selectionMode.column