synapse-react-client 3.3.7 → 3.3.8

package/dist/umd/synapse-react-client.development.js

@@ -20,7 +20,7 @@ var __privateWrapper = (obj, member, setter, getter) => ({
     return __privateGet(obj, member, getter);
   }
 });
-/*! SRC v3.3.7 */
+/*! SRC v3.3.8 */
 
   var _focused, _cleanup, _setup, _a2, _online, _cleanup2, _setup2, _b, _gcTimeout, _c, _initialState, _revertState, _cache, _promise, _retryer, _observers, _defaultOptions, _abortSignalConsumed, _Query_instances, setOptions_fn, dispatch_fn, _d, _queries, _e2, _observers2, _defaultOptions2, _mutationCache, _retryer2, _Mutation_instances, dispatch_fn2, _f, _mutations, _mutationId, _resuming, _g, _queryCache, _mutationCache2, _defaultOptions3, _queryDefaults, _mutationDefaults, _mountCount, _unsubscribeFocus, _unsubscribeOnline, _h, _client, _currentQuery, _currentQueryInitialState, _currentResult, _currentResultState, _currentResultOptions, _selectError, _selectFn, _selectResult, _lastQueryWithDefinedData, _staleTimeoutId, _refetchIntervalId, _currentRefetchInterval, _trackedProps, _QueryObserver_instances, executeFetch_fn, updateStaleTimeout_fn, computeRefetchInterval_fn, updateRefetchInterval_fn, updateTimers_fn, clearStaleTimeout_fn, clearRefetchInterval_fn, updateQuery_fn, notify_fn, _i, _client2, _result, _queries2, _observers3, _options, _combinedResult, _QueriesObserver_instances, setResult_fn, combineResult_fn, findMatchingObservers_fn, onUpdate_fn, notify_fn2, _j, _client3, _currentResult2, _currentMutation, _mutateOptions, _MutationObserver_instances, updateResult_fn, notify_fn3, _k, _l;
   function _interopNamespaceDefault(e2) {
@@ -40861,6 +40861,26 @@ Please use another name.` : formatMuiErrorMessage$1(18));
     RestrictionLevel2["CONTROLLED_BY_ACT"] = "CONTROLLED_BY_ACT";
     return RestrictionLevel2;
   })(RestrictionLevel || {});
+  var SearchFieldName = /* @__PURE__ */ ((SearchFieldName2) => {
+    SearchFieldName2["ID"] = "Id";
+    SearchFieldName2["NAME"] = "Name";
+    SearchFieldName2["DESCRIPTION"] = "Description";
+    SearchFieldName2["ENTITY_TYPE"] = "EntityType";
+    SearchFieldName2["MODIFIED_BY"] = "ModifiedBy";
+    SearchFieldName2["MODIFIED_ON"] = "ModifiedOn";
+    SearchFieldName2["CREATED_BY"] = "CreatedBy";
+    SearchFieldName2["CREATED_ON"] = "CreatedOn";
+    SearchFieldName2["CONSORTIUM"] = "Consortium";
+    SearchFieldName2["DIAGNOSIS"] = "Diagnosis";
+    SearchFieldName2["ORGAN"] = "Organ";
+    SearchFieldName2["TISSUE"] = "Tissue";
+    return SearchFieldName2;
+  })(SearchFieldName || {});
+  var SearchFacetSort = /* @__PURE__ */ ((SearchFacetSort2) => {
+    SearchFacetSort2["ALPHA"] = "ALPHA";
+    SearchFacetSort2["COUNT"] = "COUNT";
+    return SearchFacetSort2;
+  })(SearchFacetSort || {});
   var SubscriptionObjectType = /* @__PURE__ */ ((SubscriptionObjectType2) => {
     SubscriptionObjectType2["FORUM"] = "FORUM";
     SubscriptionObjectType2["THREAD"] = "THREAD";
@@ -53624,9 +53644,6 @@ Please use another name.` : formatMuiErrorMessage$1(18));
     return response.responseBody;
   };
   const getQueryTableAsyncJobResults = async (queryBundleRequest, accessToken, setCurrentAsyncStatus) => {
-    console.log(
-      `Querying ${getEndpoint(BackendDestinationEnum.PORTAL_ENDPOINT)}Synapse:${queryBundleRequest.entityId}`
-    );
     const asyncJobId = await doPost(
       TABLE_QUERY_ASYNC_START(queryBundleRequest.entityId),
       queryBundleRequest,
@@ -94680,650 +94697,6 @@ ${e2.message}`);
       )
     ] });
   };
-  var resizeObservers = [];
-  var hasActiveObservations = function() {
-    return resizeObservers.some(function(ro) {
-      return ro.activeTargets.length > 0;
-    });
-  };
-  var hasSkippedObservations = function() {
-    return resizeObservers.some(function(ro) {
-      return ro.skippedTargets.length > 0;
-    });
-  };
-  var msg = "ResizeObserver loop completed with undelivered notifications.";
-  var deliverResizeLoopError = function() {
-    var event;
-    if (typeof ErrorEvent === "function") {
-      event = new ErrorEvent("error", {
-        message: msg
-      });
-    } else {
-      event = document.createEvent("Event");
-      event.initEvent("error", false, false);
-      event.message = msg;
-    }
-    window.dispatchEvent(event);
-  };
-  var ResizeObserverBoxOptions;
-  (function(ResizeObserverBoxOptions2) {
-    ResizeObserverBoxOptions2["BORDER_BOX"] = "border-box";
-    ResizeObserverBoxOptions2["CONTENT_BOX"] = "content-box";
-    ResizeObserverBoxOptions2["DEVICE_PIXEL_CONTENT_BOX"] = "device-pixel-content-box";
-  })(ResizeObserverBoxOptions || (ResizeObserverBoxOptions = {}));
-  var freeze = function(obj) {
-    return Object.freeze(obj);
-  };
-  var ResizeObserverSize = /* @__PURE__ */ function() {
-    function ResizeObserverSize2(inlineSize, blockSize) {
-      this.inlineSize = inlineSize;
-      this.blockSize = blockSize;
-      freeze(this);
-    }
-    return ResizeObserverSize2;
-  }();
-  var DOMRectReadOnly$1 = function() {
-    function DOMRectReadOnly2(x2, y2, width2, height2) {
-      this.x = x2;
-      this.y = y2;
-      this.width = width2;
-      this.height = height2;
-      this.top = this.y;
-      this.left = this.x;
-      this.bottom = this.top + this.height;
-      this.right = this.left + this.width;
-      return freeze(this);
-    }
-    DOMRectReadOnly2.prototype.toJSON = function() {
-      var _a3 = this, x2 = _a3.x, y2 = _a3.y, top2 = _a3.top, right2 = _a3.right, bottom2 = _a3.bottom, left2 = _a3.left, width2 = _a3.width, height2 = _a3.height;
-      return { x: x2, y: y2, top: top2, right: right2, bottom: bottom2, left: left2, width: width2, height: height2 };
-    };
-    DOMRectReadOnly2.fromRect = function(rectangle) {
-      return new DOMRectReadOnly2(rectangle.x, rectangle.y, rectangle.width, rectangle.height);
-    };
-    return DOMRectReadOnly2;
-  }();
-  var isSVG = function(target) {
-    return target instanceof SVGElement && "getBBox" in target;
-  };
-  var isHidden = function(target) {
-    if (isSVG(target)) {
-      var _a3 = target.getBBox(), width2 = _a3.width, height2 = _a3.height;
-      return !width2 && !height2;
-    }
-    var _b2 = target, offsetWidth = _b2.offsetWidth, offsetHeight = _b2.offsetHeight;
-    return !(offsetWidth || offsetHeight || target.getClientRects().length);
-  };
-  var isElement$1 = function(obj) {
-    var _a3;
-    if (obj instanceof Element) {
-      return true;
-    }
-    var scope2 = (_a3 = obj === null || obj === void 0 ? void 0 : obj.ownerDocument) === null || _a3 === void 0 ? void 0 : _a3.defaultView;
-    return !!(scope2 && obj instanceof scope2.Element);
-  };
-  var isReplacedElement = function(target) {
-    switch (target.tagName) {
-      case "INPUT":
-        if (target.type !== "image") {
-          break;
-        }
-      case "VIDEO":
-      case "AUDIO":
-      case "EMBED":
-      case "OBJECT":
-      case "CANVAS":
-      case "IFRAME":
-      case "IMG":
-        return true;
-    }
-    return false;
-  };
-  var global$1 = typeof window !== "undefined" ? window : {};
-  var cache = /* @__PURE__ */ new WeakMap();
-  var scrollRegexp = /auto|scroll/;
-  var verticalRegexp = /^tb|vertical/;
-  var IE = /msie|trident/i.test(global$1.navigator && global$1.navigator.userAgent);
-  var parseDimension = function(pixel) {
-    return parseFloat(pixel || "0");
-  };
-  var size$1 = function(inlineSize, blockSize, switchSizes) {
-    if (inlineSize === void 0) {
-      inlineSize = 0;
-    }
-    if (blockSize === void 0) {
-      blockSize = 0;
-    }
-    if (switchSizes === void 0) {
-      switchSizes = false;
-    }
-    return new ResizeObserverSize((switchSizes ? blockSize : inlineSize) || 0, (switchSizes ? inlineSize : blockSize) || 0);
-  };
-  var zeroBoxes = freeze({
-    devicePixelContentBoxSize: size$1(),
-    borderBoxSize: size$1(),
-    contentBoxSize: size$1(),
-    contentRect: new DOMRectReadOnly$1(0, 0, 0, 0)
-  });
-  var calculateBoxSizes = function(target, forceRecalculation) {
-    if (forceRecalculation === void 0) {
-      forceRecalculation = false;
-    }
-    if (cache.has(target) && !forceRecalculation) {
-      return cache.get(target);
-    }
-    if (isHidden(target)) {
-      cache.set(target, zeroBoxes);
-      return zeroBoxes;
-    }
-    var cs = getComputedStyle(target);
-    var svg2 = isSVG(target) && target.ownerSVGElement && target.getBBox();
-    var removePadding = !IE && cs.boxSizing === "border-box";
-    var switchSizes = verticalRegexp.test(cs.writingMode || "");
-    var canScrollVertically = !svg2 && scrollRegexp.test(cs.overflowY || "");
-    var canScrollHorizontally = !svg2 && scrollRegexp.test(cs.overflowX || "");
-    var paddingTop = svg2 ? 0 : parseDimension(cs.paddingTop);
-    var paddingRight = svg2 ? 0 : parseDimension(cs.paddingRight);
-    var paddingBottom = svg2 ? 0 : parseDimension(cs.paddingBottom);
-    var paddingLeft = svg2 ? 0 : parseDimension(cs.paddingLeft);
-    var borderTop2 = svg2 ? 0 : parseDimension(cs.borderTopWidth);
-    var borderRight2 = svg2 ? 0 : parseDimension(cs.borderRightWidth);
-    var borderBottom2 = svg2 ? 0 : parseDimension(cs.borderBottomWidth);
-    var borderLeft2 = svg2 ? 0 : parseDimension(cs.borderLeftWidth);
-    var horizontalPadding = paddingLeft + paddingRight;
-    var verticalPadding = paddingTop + paddingBottom;
-    var horizontalBorderArea = borderLeft2 + borderRight2;
-    var verticalBorderArea = borderTop2 + borderBottom2;
-    var horizontalScrollbarThickness = !canScrollHorizontally ? 0 : target.offsetHeight - verticalBorderArea - target.clientHeight;
-    var verticalScrollbarThickness = !canScrollVertically ? 0 : target.offsetWidth - horizontalBorderArea - target.clientWidth;
-    var widthReduction = removePadding ? horizontalPadding + horizontalBorderArea : 0;
-    var heightReduction = removePadding ? verticalPadding + verticalBorderArea : 0;
-    var contentWidth = svg2 ? svg2.width : parseDimension(cs.width) - widthReduction - verticalScrollbarThickness;
-    var contentHeight = svg2 ? svg2.height : parseDimension(cs.height) - heightReduction - horizontalScrollbarThickness;
-    var borderBoxWidth = contentWidth + horizontalPadding + verticalScrollbarThickness + horizontalBorderArea;
-    var borderBoxHeight = contentHeight + verticalPadding + horizontalScrollbarThickness + verticalBorderArea;
-    var boxes = freeze({
-      devicePixelContentBoxSize: size$1(Math.round(contentWidth * devicePixelRatio), Math.round(contentHeight * devicePixelRatio), switchSizes),
-      borderBoxSize: size$1(borderBoxWidth, borderBoxHeight, switchSizes),
-      contentBoxSize: size$1(contentWidth, contentHeight, switchSizes),
-      contentRect: new DOMRectReadOnly$1(paddingLeft, paddingTop, contentWidth, contentHeight)
-    });
-    cache.set(target, boxes);
-    return boxes;
-  };
-  var calculateBoxSize = function(target, observedBox, forceRecalculation) {
-    var _a3 = calculateBoxSizes(target, forceRecalculation), borderBoxSize = _a3.borderBoxSize, contentBoxSize = _a3.contentBoxSize, devicePixelContentBoxSize = _a3.devicePixelContentBoxSize;
-    switch (observedBox) {
-      case ResizeObserverBoxOptions.DEVICE_PIXEL_CONTENT_BOX:
-        return devicePixelContentBoxSize;
-      case ResizeObserverBoxOptions.BORDER_BOX:
-        return borderBoxSize;
-      default:
-        return contentBoxSize;
-    }
-  };
-  var ResizeObserverEntry = /* @__PURE__ */ function() {
-    function ResizeObserverEntry2(target) {
-      var boxes = calculateBoxSizes(target);
-      this.target = target;
-      this.contentRect = boxes.contentRect;
-      this.borderBoxSize = freeze([boxes.borderBoxSize]);
-      this.contentBoxSize = freeze([boxes.contentBoxSize]);
-      this.devicePixelContentBoxSize = freeze([boxes.devicePixelContentBoxSize]);
-    }
-    return ResizeObserverEntry2;
-  }();
-  var calculateDepthForNode = function(node2) {
-    if (isHidden(node2)) {
-      return Infinity;
-    }
-    var depth = 0;
-    var parent2 = node2.parentNode;
-    while (parent2) {
-      depth += 1;
-      parent2 = parent2.parentNode;
-    }
-    return depth;
-  };
-  var broadcastActiveObservations = function() {
-    var shallowestDepth = Infinity;
-    var callbacks2 = [];
-    resizeObservers.forEach(function processObserver(ro) {
-      if (ro.activeTargets.length === 0) {
-        return;
-      }
-      var entries = [];
-      ro.activeTargets.forEach(function processTarget(ot) {
-        var entry = new ResizeObserverEntry(ot.target);
-        var targetDepth = calculateDepthForNode(ot.target);
-        entries.push(entry);
-        ot.lastReportedSize = calculateBoxSize(ot.target, ot.observedBox);
-        if (targetDepth < shallowestDepth) {
-          shallowestDepth = targetDepth;
-        }
-      });
-      callbacks2.push(function resizeObserverCallback() {
-        ro.callback.call(ro.observer, entries, ro.observer);
-      });
-      ro.activeTargets.splice(0, ro.activeTargets.length);
-    });
-    for (var _i2 = 0, callbacks_1 = callbacks2; _i2 < callbacks_1.length; _i2++) {
-      var callback = callbacks_1[_i2];
-      callback();
-    }
-    return shallowestDepth;
-  };
-  var gatherActiveObservationsAtDepth = function(depth) {
-    resizeObservers.forEach(function processObserver(ro) {
-      ro.activeTargets.splice(0, ro.activeTargets.length);
-      ro.skippedTargets.splice(0, ro.skippedTargets.length);
-      ro.observationTargets.forEach(function processTarget(ot) {
-        if (ot.isActive()) {
-          if (calculateDepthForNode(ot.target) > depth) {
-            ro.activeTargets.push(ot);
-          } else {
-            ro.skippedTargets.push(ot);
-          }
-        }
-      });
-    });
-  };
-  var process = function() {
-    var depth = 0;
-    gatherActiveObservationsAtDepth(depth);
-    while (hasActiveObservations()) {
-      depth = broadcastActiveObservations();
-      gatherActiveObservationsAtDepth(depth);
-    }
-    if (hasSkippedObservations()) {
-      deliverResizeLoopError();
-    }
-    return depth > 0;
-  };
-  var trigger;
-  var callbacks = [];
-  var notify = function() {
-    return callbacks.splice(0).forEach(function(cb) {
-      return cb();
-    });
-  };
-  var queueMicroTask = function(callback) {
-    if (!trigger) {
-      var toggle_1 = 0;
-      var el_1 = document.createTextNode("");
-      var config2 = { characterData: true };
-      new MutationObserver(function() {
-        return notify();
-      }).observe(el_1, config2);
-      trigger = function() {
-        el_1.textContent = "".concat(toggle_1 ? toggle_1-- : toggle_1++);
-      };
-    }
-    callbacks.push(callback);
-    trigger();
-  };
-  var queueResizeObserver = function(cb) {
-    queueMicroTask(function ResizeObserver2() {
-      requestAnimationFrame(cb);
-    });
-  };
-  var watching = 0;
-  var isWatching = function() {
-    return !!watching;
-  };
-  var CATCH_PERIOD = 250;
-  var observerConfig = { attributes: true, characterData: true, childList: true, subtree: true };
-  var events = [
-    "resize",
-    "load",
-    "transitionend",
-    "animationend",
-    "animationstart",
-    "animationiteration",
-    "keyup",
-    "keydown",
-    "mouseup",
-    "mousedown",
-    "mouseover",
-    "mouseout",
-    "blur",
-    "focus"
-  ];
-  var time = function(timeout2) {
-    if (timeout2 === void 0) {
-      timeout2 = 0;
-    }
-    return Date.now() + timeout2;
-  };
-  var scheduled = false;
-  var Scheduler = function() {
-    function Scheduler2() {
-      var _this = this;
-      this.stopped = true;
-      this.listener = function() {
-        return _this.schedule();
-      };
-    }
-    Scheduler2.prototype.run = function(timeout2) {
-      var _this = this;
-      if (timeout2 === void 0) {
-        timeout2 = CATCH_PERIOD;
-      }
-      if (scheduled) {
-        return;
-      }
-      scheduled = true;
-      var until = time(timeout2);
-      queueResizeObserver(function() {
-        var elementsHaveResized = false;
-        try {
-          elementsHaveResized = process();
-        } finally {
-          scheduled = false;
-          timeout2 = until - time();
-          if (!isWatching()) {
-            return;
-          }
-          if (elementsHaveResized) {
-            _this.run(1e3);
-          } else if (timeout2 > 0) {
-            _this.run(timeout2);
-          } else {
-            _this.start();
-          }
-        }
-      });
-    };
-    Scheduler2.prototype.schedule = function() {
-      this.stop();
-      this.run();
-    };
-    Scheduler2.prototype.observe = function() {
-      var _this = this;
-      var cb = function() {
-        return _this.observer && _this.observer.observe(document.body, observerConfig);
-      };
-      document.body ? cb() : global$1.addEventListener("DOMContentLoaded", cb);
-    };
-    Scheduler2.prototype.start = function() {
-      var _this = this;
-      if (this.stopped) {
-        this.stopped = false;
-        this.observer = new MutationObserver(this.listener);
-        this.observe();
-        events.forEach(function(name) {
-          return global$1.addEventListener(name, _this.listener, true);
-        });
-      }
-    };
-    Scheduler2.prototype.stop = function() {
-      var _this = this;
-      if (!this.stopped) {
-        this.observer && this.observer.disconnect();
-        events.forEach(function(name) {
-          return global$1.removeEventListener(name, _this.listener, true);
-        });
-        this.stopped = true;
-      }
-    };
-    return Scheduler2;
-  }();
-  var scheduler = new Scheduler();
-  var updateCount = function(n2) {
-    !watching && n2 > 0 && scheduler.start();
-    watching += n2;
-    !watching && scheduler.stop();
-  };
-  var skipNotifyOnElement = function(target) {
-    return !isSVG(target) && !isReplacedElement(target) && getComputedStyle(target).display === "inline";
-  };
-  var ResizeObservation = function() {
-    function ResizeObservation2(target, observedBox) {
-      this.target = target;
-      this.observedBox = observedBox || ResizeObserverBoxOptions.CONTENT_BOX;
-      this.lastReportedSize = {
-        inlineSize: 0,
-        blockSize: 0
-      };
-    }
-    ResizeObservation2.prototype.isActive = function() {
-      var size2 = calculateBoxSize(this.target, this.observedBox, true);
-      if (skipNotifyOnElement(this.target)) {
-        this.lastReportedSize = size2;
-      }
-      if (this.lastReportedSize.inlineSize !== size2.inlineSize || this.lastReportedSize.blockSize !== size2.blockSize) {
-        return true;
-      }
-      return false;
-    };
-    return ResizeObservation2;
-  }();
-  var ResizeObserverDetail = /* @__PURE__ */ function() {
-    function ResizeObserverDetail2(resizeObserver, callback) {
-      this.activeTargets = [];
-      this.skippedTargets = [];
-      this.observationTargets = [];
-      this.observer = resizeObserver;
-      this.callback = callback;
-    }
-    return ResizeObserverDetail2;
-  }();
-  var observerMap = /* @__PURE__ */ new WeakMap();
-  var getObservationIndex = function(observationTargets, target) {
-    for (var i2 = 0; i2 < observationTargets.length; i2 += 1) {
-      if (observationTargets[i2].target === target) {
-        return i2;
-      }
-    }
-    return -1;
-  };
-  var ResizeObserverController = function() {
-    function ResizeObserverController2() {
-    }
-    ResizeObserverController2.connect = function(resizeObserver, callback) {
-      var detail = new ResizeObserverDetail(resizeObserver, callback);
-      observerMap.set(resizeObserver, detail);
-    };
-    ResizeObserverController2.observe = function(resizeObserver, target, options2) {
-      var detail = observerMap.get(resizeObserver);
-      var firstObservation = detail.observationTargets.length === 0;
-      if (getObservationIndex(detail.observationTargets, target) < 0) {
-        firstObservation && resizeObservers.push(detail);
-        detail.observationTargets.push(new ResizeObservation(target, options2 && options2.box));
-        updateCount(1);
-        scheduler.schedule();
-      }
-    };
-    ResizeObserverController2.unobserve = function(resizeObserver, target) {
-      var detail = observerMap.get(resizeObserver);
-      var index2 = getObservationIndex(detail.observationTargets, target);
-      var lastObservation = detail.observationTargets.length === 1;
-      if (index2 >= 0) {
-        lastObservation && resizeObservers.splice(resizeObservers.indexOf(detail), 1);
-        detail.observationTargets.splice(index2, 1);
-        updateCount(-1);
-      }
-    };
-    ResizeObserverController2.disconnect = function(resizeObserver) {
-      var _this = this;
-      var detail = observerMap.get(resizeObserver);
-      detail.observationTargets.slice().forEach(function(ot) {
-        return _this.unobserve(resizeObserver, ot.target);
-      });
-      detail.activeTargets.splice(0, detail.activeTargets.length);
-    };
-    return ResizeObserverController2;
-  }();
-  var ResizeObserver$2 = function() {
-    function ResizeObserver2(callback) {
-      if (arguments.length === 0) {
-        throw new TypeError("Failed to construct 'ResizeObserver': 1 argument required, but only 0 present.");
-      }
-      if (typeof callback !== "function") {
-        throw new TypeError("Failed to construct 'ResizeObserver': The callback provided as parameter 1 is not a function.");
-      }
-      ResizeObserverController.connect(this, callback);
-    }
-    ResizeObserver2.prototype.observe = function(target, options2) {
-      if (arguments.length === 0) {
-        throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': 1 argument required, but only 0 present.");
-      }
-      if (!isElement$1(target)) {
-        throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': parameter 1 is not of type 'Element");
-      }
-      ResizeObserverController.observe(this, target, options2);
-    };
-    ResizeObserver2.prototype.unobserve = function(target) {
-      if (arguments.length === 0) {
-        throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': 1 argument required, but only 0 present.");
-      }
-      if (!isElement$1(target)) {
-        throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': parameter 1 is not of type 'Element");
-      }
-      ResizeObserverController.unobserve(this, target);
-    };
-    ResizeObserver2.prototype.disconnect = function() {
-      ResizeObserverController.disconnect(this);
-    };
-    ResizeObserver2.toString = function() {
-      return "function ResizeObserver () { [polyfill code] }";
-    };
-    return ResizeObserver2;
-  }();
-  const usePassiveLayoutEffect = React$2[typeof document !== "undefined" && document.createElement !== void 0 ? "useLayoutEffect" : "useEffect"];
-  const useLatest = (current) => {
-    const storedValue = React__namespace.useRef(current);
-    React__namespace.useEffect(() => {
-      storedValue.current = current;
-    });
-    return storedValue;
-  };
-  const ResizeObserver$1 = typeof window !== "undefined" && "ResizeObserver" in window ? (
-    // @ts-ignore
-    window.ResizeObserver
-  ) : ResizeObserver$2;
-  function _ref$1() {
-  }
-  function useResizeObserver(target, callback) {
-    const resizeObserver = getResizeObserver();
-    const storedCallback = useLatest(callback);
-    usePassiveLayoutEffect(() => {
-      let didUnsubscribe = false;
-      const targetEl = target && "current" in target ? target.current : target;
-      if (!targetEl) return _ref$1;
-      function cb(entry, observer) {
-        if (didUnsubscribe) return;
-        storedCallback.current(entry, observer);
-      }
-      resizeObserver.subscribe(targetEl, cb);
-      return () => {
-        didUnsubscribe = true;
-        resizeObserver.unsubscribe(targetEl, cb);
-      };
-    }, [target, resizeObserver, storedCallback]);
-    return resizeObserver.observer;
-  }
-  function createResizeObserver() {
-    let ticking = false;
-    let allEntries = [];
-    const callbacks2 = /* @__PURE__ */ new Map();
-    const observer = new ResizeObserver$1((entries, obs) => {
-      allEntries = allEntries.concat(entries);
-      function _ref22() {
-        const triggered = /* @__PURE__ */ new Set();
-        for (let i2 = 0; i2 < allEntries.length; i2++) {
-          if (triggered.has(allEntries[i2].target)) continue;
-          triggered.add(allEntries[i2].target);
-          const cbs = callbacks2.get(allEntries[i2].target);
-          cbs === null || cbs === void 0 ? void 0 : cbs.forEach((cb) => cb(allEntries[i2], obs));
-        }
-        allEntries = [];
-        ticking = false;
-      }
-      if (!ticking) {
-        window.requestAnimationFrame(_ref22);
-      }
-      ticking = true;
-    });
-    return {
-      observer,
-      subscribe(target, callback) {
-        var _callbacks$get;
-        observer.observe(target);
-        const cbs = (_callbacks$get = callbacks2.get(target)) !== null && _callbacks$get !== void 0 ? _callbacks$get : [];
-        cbs.push(callback);
-        callbacks2.set(target, cbs);
-      },
-      unsubscribe(target, callback) {
-        var _callbacks$get2;
-        const cbs = (_callbacks$get2 = callbacks2.get(target)) !== null && _callbacks$get2 !== void 0 ? _callbacks$get2 : [];
-        if (cbs.length === 1) {
-          observer.unobserve(target);
-          callbacks2.delete(target);
-          return;
-        }
-        const cbIndex = cbs.indexOf(callback);
-        if (cbIndex !== -1) cbs.splice(cbIndex, 1);
-        callbacks2.set(target, cbs);
-      }
-    };
-  }
-  let _resizeObserver;
-  const getResizeObserver = () => !_resizeObserver ? _resizeObserver = createResizeObserver() : _resizeObserver;
-  function ExpandCollapseButton(props) {
-    const { isExpanded, ...buttonProps } = props;
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("button", { ...buttonProps, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-      IconSvg,
-      {
-        icon: isExpanded ? "minusBoxOutline" : "addBoxOutline",
-        sx: {
-          color: "grey.600",
-          height: "16px",
-          verticalAlign: "top",
-          "&:hover": {
-            color: "grey.700"
-          }
-        }
-      }
-    ) });
-  }
-  function ExpandableTableDataCell(props) {
-    const [isExpanded, setIsExpanded] = React$2.useState(false);
-    const [isOverflowingWhenNotExpanded, setIsOverflowingWhenNotExpanded] = React$2.useState(false);
-    const tdRef = React$2.useRef(null);
-    useResizeObserver(tdRef, ({ target }) => {
-      if (!isExpanded) {
-        if (target) {
-          const contentElement = target.getElementsByTagName("p")[0];
-          if (contentElement) {
-            setIsOverflowingWhenNotExpanded(
-              contentElement.scrollHeight > contentElement.clientHeight || contentElement.scrollWidth > contentElement.clientWidth
-            );
-          }
-        }
-      }
-    });
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "td",
-      {
-        ...props,
-        className: `ExpandableTableData ${props.className ? props.className : ""}`,
-        "aria-expanded": isExpanded,
-        ref: tdRef,
-        children: [
-          isOverflowingWhenNotExpanded && /* @__PURE__ */ jsxRuntimeExports.jsx(
-            ExpandCollapseButton,
-            {
-              isExpanded,
-              className: "ExpandableTableData__expandButton",
-              onClick: () => setIsExpanded(!isExpanded)
-            }
-          ),
-          props.children
-        ]
-      }
-    );
-  }
   /**
      * table-core
      *
@@ -99677,7 +99050,7 @@ ${e2.message}`);
     })(typeof window === "object" ? window : commonjsGlobal);
   })(uaParser, uaParser.exports);
   var uaParserExports = uaParser.exports;
-  function DirectDownloadIcon(props) {
+  const DirectDownloadIcon = React$2.forwardRef(function DirectDownloadIcon2(props, ref2) {
     const {
       isExternalFile,
       onClick,
@@ -99693,6 +99066,7 @@ ${e2.message}`);
       return /* @__PURE__ */ jsxRuntimeExports.jsx(
         "button",
         {
+          ref: ref2,
           className: "btn-download-icon",
           onClick: (event) => {
             if (onClick) {
@@ -99717,6 +99091,7 @@ ${e2.message}`);
       return /* @__PURE__ */ jsxRuntimeExports.jsxs(
         "button",
         {
+          ref: ref2,
           className: "btn-download-icon",
           onClick: (event) => {
             getDownloadLink();
@@ -99730,7 +99105,7 @@ ${e2.message}`);
       );
     }
     return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {});
-  }
+  });
   function DirectDownload(props) {
     var _a3;
     const { accessToken } = useSynapseContext();
@@ -99833,7 +99208,7 @@ ${e2.message}`);
         title: isExternalFile ? "Navigate to external link" : "Download this file individually",
         enterNextDelay: TOOLTIP_DELAY_SHOW,
         placement: "left",
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(
           DirectDownloadIcon,
           {
             isExternalFile,
@@ -99846,7 +99221,7 @@ ${e2.message}`);
             fileName,
             iconSvgPropOverrides
           }
-        ) })
+        )
       }
     );
   }
@@ -102438,7 +101813,7 @@ ${e2.message}`);
   function _EMOTION_STRINGIFIED_CSS_ERROR__$2() {
     return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
   }
-  var _ref = dist$1.process.env.NODE_ENV === "production" ? {
+  var _ref$1 = dist$1.process.env.NODE_ENV === "production" ? {
     name: "7pg0cj-a11yText",
     styles: "label:a11yText;z-index:9999;border:0;clip:rect(1px, 1px, 1px, 1px);height:1px;width:1px;position:absolute;overflow:hidden;padding:0;white-space:nowrap"
   } : {
@@ -102449,7 +101824,7 @@ ${e2.message}`);
   };
   var A11yText = function A11yText2(props) {
     return jsx("span", _extends$3({
-      css: _ref
+      css: _ref$1
     }, props));
   };
   var A11yText$1 = A11yText;
@@ -113037,6 +112412,23 @@ ${e2.message}`);
     }
     return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: String(value) });
   }
+  function ExpandCollapseButton(props) {
+    const { isExpanded, ...buttonProps } = props;
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("button", { ...buttonProps, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      IconSvg,
+      {
+        icon: isExpanded ? "minusBoxOutline" : "addBoxOutline",
+        sx: {
+          color: "grey.600",
+          height: "16px",
+          verticalAlign: "top",
+          "&:hover": {
+            color: "grey.700"
+          }
+        }
+      }
+    ) });
+  }
   function JSONArrayRenderer(props) {
     const { value } = props;
     const [expanded, setExpanded] = React$2.useState(false);
@@ -114779,21 +114171,22 @@ ${e2.message}`);
     }
   });
   const getEntityOrRowId = (props) => {
-    var _a3;
+    var _a3, _b2;
     const { row, table: table2 } = props;
-    const rowEntityIDColumnIndex = table2.options.meta.rowEntityIDColumnIndex;
-    const entityId = rowEntityIDColumnIndex !== void 0 ? row.original.values[rowEntityIDColumnIndex] : (_a3 = row.original.rowId) == null ? void 0 : _a3.toString();
+    const rowEntityIDColumnIndex = (_a3 = table2.options.meta) == null ? void 0 : _a3.rowEntityIDColumnIndex;
+    const entityId = rowEntityIDColumnIndex !== void 0 ? row.original.values[rowEntityIDColumnIndex] : (_b2 = row.original.rowId) == null ? void 0 : _b2.toString();
     return entityId;
   };
   const isRowEntityColumn = (props) => {
+    var _a3;
     const { table: table2 } = props;
-    return table2.options.meta.rowEntityVersionColumnIndex !== void 0;
+    return ((_a3 = table2.options.meta) == null ? void 0 : _a3.rowEntityVersionColumnIndex) !== void 0;
   };
   const getEntityOrRowVersion = (props) => {
-    var _a3;
+    var _a3, _b2;
     const { row, table: table2 } = props;
-    const rowEntityVersionColumnIndex = table2.options.meta.rowEntityVersionColumnIndex;
-    const versionNumber = rowEntityVersionColumnIndex !== void 0 ? row.original.values[rowEntityVersionColumnIndex] : (_a3 = row.original.versionNumber) == null ? void 0 : _a3.toString();
+    const rowEntityVersionColumnIndex = (_a3 = table2.options.meta) == null ? void 0 : _a3.rowEntityVersionColumnIndex;
+    const versionNumber = rowEntityVersionColumnIndex !== void 0 ? row.original.values[rowEntityVersionColumnIndex] : (_b2 = row.original.versionNumber) == null ? void 0 : _b2.toString();
     return versionNumber;
   };
   function AccessCell(props) {
@@ -115039,6 +114432,762 @@ ${e2.message}`);
       dataHasBeenPrefetched: !isLoadingEntityData && !isLoadingFileHandleData && !isLoadingUserGroupData
     };
   }
+  const StyledTableContainer = styled(Box)(({ theme: theme3, density = "default" }) => ({
+    overflow: "auto",
+    paddingLeft: "2px",
+    th: {
+      height: "38px",
+      backgroundColor: theme3.palette.grey[200],
+      borderRight: "1px solid",
+      borderColor: theme3.palette.grey[400]
+    },
+    ["th:first-of-type"]: {
+      paddingLeft: "10px"
+    },
+    ["td:first-of-type"]: {
+      paddingLeft: "10px"
+    },
+    ["tr:nth-of-type(2n)"]: {
+      backgroundColor: theme3.palette.grey[100]
+    },
+    ["th,td"]: {
+      position: "relative",
+      paddingLeft: theme3.spacing(density === "compact" ? 0 : 1),
+      paddingRight: theme3.spacing(density === "compact" ? 0 : 1)
+    },
+    td: {
+      paddingTop: theme3.spacing(density === "compact" ? 0 : 1),
+      paddingBottom: theme3.spacing(density === "compact" ? 0 : 1)
+    },
+    ".resizer": {
+      position: "absolute",
+      right: 0,
+      top: 0,
+      height: "100%",
+      width: "3px",
+      padding: 0,
+      background: "rgba(0, 0, 0, 0.5)",
+      cursor: "col-resize",
+      userSelect: "none",
+      touchAction: "none"
+    },
+    ".resizer.isResizing": {
+      background: theme3.palette.primary.main,
+      opacity: 1
+    },
+    "@media (hover: hover)": {
+      ".resizer": {
+        opacity: 0,
+        "*:hover > .resizer": {
+          opacity: 1
+        }
+      }
+    }
+  }));
+  function getColumnSizeCssVariable(columnId) {
+    return `--col-${columnId}-size`;
+  }
+  function getHeaderSizeCssVariable(headerId) {
+    return `--header-${headerId}-size`;
+  }
+  var resizeObservers = [];
+  var hasActiveObservations = function() {
+    return resizeObservers.some(function(ro) {
+      return ro.activeTargets.length > 0;
+    });
+  };
+  var hasSkippedObservations = function() {
+    return resizeObservers.some(function(ro) {
+      return ro.skippedTargets.length > 0;
+    });
+  };
+  var msg = "ResizeObserver loop completed with undelivered notifications.";
+  var deliverResizeLoopError = function() {
+    var event;
+    if (typeof ErrorEvent === "function") {
+      event = new ErrorEvent("error", {
+        message: msg
+      });
+    } else {
+      event = document.createEvent("Event");
+      event.initEvent("error", false, false);
+      event.message = msg;
+    }
+    window.dispatchEvent(event);
+  };
+  var ResizeObserverBoxOptions;
+  (function(ResizeObserverBoxOptions2) {
+    ResizeObserverBoxOptions2["BORDER_BOX"] = "border-box";
+    ResizeObserverBoxOptions2["CONTENT_BOX"] = "content-box";
+    ResizeObserverBoxOptions2["DEVICE_PIXEL_CONTENT_BOX"] = "device-pixel-content-box";
+  })(ResizeObserverBoxOptions || (ResizeObserverBoxOptions = {}));
+  var freeze = function(obj) {
+    return Object.freeze(obj);
+  };
+  var ResizeObserverSize = /* @__PURE__ */ function() {
+    function ResizeObserverSize2(inlineSize, blockSize) {
+      this.inlineSize = inlineSize;
+      this.blockSize = blockSize;
+      freeze(this);
+    }
+    return ResizeObserverSize2;
+  }();
+  var DOMRectReadOnly$1 = function() {
+    function DOMRectReadOnly2(x2, y2, width2, height2) {
+      this.x = x2;
+      this.y = y2;
+      this.width = width2;
+      this.height = height2;
+      this.top = this.y;
+      this.left = this.x;
+      this.bottom = this.top + this.height;
+      this.right = this.left + this.width;
+      return freeze(this);
+    }
+    DOMRectReadOnly2.prototype.toJSON = function() {
+      var _a3 = this, x2 = _a3.x, y2 = _a3.y, top2 = _a3.top, right2 = _a3.right, bottom2 = _a3.bottom, left2 = _a3.left, width2 = _a3.width, height2 = _a3.height;
+      return { x: x2, y: y2, top: top2, right: right2, bottom: bottom2, left: left2, width: width2, height: height2 };
+    };
+    DOMRectReadOnly2.fromRect = function(rectangle) {
+      return new DOMRectReadOnly2(rectangle.x, rectangle.y, rectangle.width, rectangle.height);
+    };
+    return DOMRectReadOnly2;
+  }();
+  var isSVG = function(target) {
+    return target instanceof SVGElement && "getBBox" in target;
+  };
+  var isHidden = function(target) {
+    if (isSVG(target)) {
+      var _a3 = target.getBBox(), width2 = _a3.width, height2 = _a3.height;
+      return !width2 && !height2;
+    }
+    var _b2 = target, offsetWidth = _b2.offsetWidth, offsetHeight = _b2.offsetHeight;
+    return !(offsetWidth || offsetHeight || target.getClientRects().length);
+  };
+  var isElement$1 = function(obj) {
+    var _a3;
+    if (obj instanceof Element) {
+      return true;
+    }
+    var scope2 = (_a3 = obj === null || obj === void 0 ? void 0 : obj.ownerDocument) === null || _a3 === void 0 ? void 0 : _a3.defaultView;
+    return !!(scope2 && obj instanceof scope2.Element);
+  };
+  var isReplacedElement = function(target) {
+    switch (target.tagName) {
+      case "INPUT":
+        if (target.type !== "image") {
+          break;
+        }
+      case "VIDEO":
+      case "AUDIO":
+      case "EMBED":
+      case "OBJECT":
+      case "CANVAS":
+      case "IFRAME":
+      case "IMG":
+        return true;
+    }
+    return false;
+  };
+  var global$1 = typeof window !== "undefined" ? window : {};
+  var cache = /* @__PURE__ */ new WeakMap();
+  var scrollRegexp = /auto|scroll/;
+  var verticalRegexp = /^tb|vertical/;
+  var IE = /msie|trident/i.test(global$1.navigator && global$1.navigator.userAgent);
+  var parseDimension = function(pixel) {
+    return parseFloat(pixel || "0");
+  };
+  var size$1 = function(inlineSize, blockSize, switchSizes) {
+    if (inlineSize === void 0) {
+      inlineSize = 0;
+    }
+    if (blockSize === void 0) {
+      blockSize = 0;
+    }
+    if (switchSizes === void 0) {
+      switchSizes = false;
+    }
+    return new ResizeObserverSize((switchSizes ? blockSize : inlineSize) || 0, (switchSizes ? inlineSize : blockSize) || 0);
+  };
+  var zeroBoxes = freeze({
+    devicePixelContentBoxSize: size$1(),
+    borderBoxSize: size$1(),
+    contentBoxSize: size$1(),
+    contentRect: new DOMRectReadOnly$1(0, 0, 0, 0)
+  });
+  var calculateBoxSizes = function(target, forceRecalculation) {
+    if (forceRecalculation === void 0) {
+      forceRecalculation = false;
+    }
+    if (cache.has(target) && !forceRecalculation) {
+      return cache.get(target);
+    }
+    if (isHidden(target)) {
+      cache.set(target, zeroBoxes);
+      return zeroBoxes;
+    }
+    var cs = getComputedStyle(target);
+    var svg2 = isSVG(target) && target.ownerSVGElement && target.getBBox();
+    var removePadding = !IE && cs.boxSizing === "border-box";
+    var switchSizes = verticalRegexp.test(cs.writingMode || "");
+    var canScrollVertically = !svg2 && scrollRegexp.test(cs.overflowY || "");
+    var canScrollHorizontally = !svg2 && scrollRegexp.test(cs.overflowX || "");
+    var paddingTop = svg2 ? 0 : parseDimension(cs.paddingTop);
+    var paddingRight = svg2 ? 0 : parseDimension(cs.paddingRight);
+    var paddingBottom = svg2 ? 0 : parseDimension(cs.paddingBottom);
+    var paddingLeft = svg2 ? 0 : parseDimension(cs.paddingLeft);
+    var borderTop2 = svg2 ? 0 : parseDimension(cs.borderTopWidth);
+    var borderRight2 = svg2 ? 0 : parseDimension(cs.borderRightWidth);
+    var borderBottom2 = svg2 ? 0 : parseDimension(cs.borderBottomWidth);
+    var borderLeft2 = svg2 ? 0 : parseDimension(cs.borderLeftWidth);
+    var horizontalPadding = paddingLeft + paddingRight;
+    var verticalPadding = paddingTop + paddingBottom;
+    var horizontalBorderArea = borderLeft2 + borderRight2;
+    var verticalBorderArea = borderTop2 + borderBottom2;
+    var horizontalScrollbarThickness = !canScrollHorizontally ? 0 : target.offsetHeight - verticalBorderArea - target.clientHeight;
+    var verticalScrollbarThickness = !canScrollVertically ? 0 : target.offsetWidth - horizontalBorderArea - target.clientWidth;
+    var widthReduction = removePadding ? horizontalPadding + horizontalBorderArea : 0;
+    var heightReduction = removePadding ? verticalPadding + verticalBorderArea : 0;
+    var contentWidth = svg2 ? svg2.width : parseDimension(cs.width) - widthReduction - verticalScrollbarThickness;
+    var contentHeight = svg2 ? svg2.height : parseDimension(cs.height) - heightReduction - horizontalScrollbarThickness;
+    var borderBoxWidth = contentWidth + horizontalPadding + verticalScrollbarThickness + horizontalBorderArea;
+    var borderBoxHeight = contentHeight + verticalPadding + horizontalScrollbarThickness + verticalBorderArea;
+    var boxes = freeze({
+      devicePixelContentBoxSize: size$1(Math.round(contentWidth * devicePixelRatio), Math.round(contentHeight * devicePixelRatio), switchSizes),
+      borderBoxSize: size$1(borderBoxWidth, borderBoxHeight, switchSizes),
+      contentBoxSize: size$1(contentWidth, contentHeight, switchSizes),
+      contentRect: new DOMRectReadOnly$1(paddingLeft, paddingTop, contentWidth, contentHeight)
+    });
+    cache.set(target, boxes);
+    return boxes;
+  };
+  var calculateBoxSize = function(target, observedBox, forceRecalculation) {
+    var _a3 = calculateBoxSizes(target, forceRecalculation), borderBoxSize = _a3.borderBoxSize, contentBoxSize = _a3.contentBoxSize, devicePixelContentBoxSize = _a3.devicePixelContentBoxSize;
+    switch (observedBox) {
+      case ResizeObserverBoxOptions.DEVICE_PIXEL_CONTENT_BOX:
+        return devicePixelContentBoxSize;
+      case ResizeObserverBoxOptions.BORDER_BOX:
+        return borderBoxSize;
+      default:
+        return contentBoxSize;
+    }
+  };
+  var ResizeObserverEntry = /* @__PURE__ */ function() {
+    function ResizeObserverEntry2(target) {
+      var boxes = calculateBoxSizes(target);
+      this.target = target;
+      this.contentRect = boxes.contentRect;
+      this.borderBoxSize = freeze([boxes.borderBoxSize]);
+      this.contentBoxSize = freeze([boxes.contentBoxSize]);
+      this.devicePixelContentBoxSize = freeze([boxes.devicePixelContentBoxSize]);
+    }
+    return ResizeObserverEntry2;
+  }();
+  var calculateDepthForNode = function(node2) {
+    if (isHidden(node2)) {
+      return Infinity;
+    }
+    var depth = 0;
+    var parent2 = node2.parentNode;
+    while (parent2) {
+      depth += 1;
+      parent2 = parent2.parentNode;
+    }
+    return depth;
+  };
+  var broadcastActiveObservations = function() {
+    var shallowestDepth = Infinity;
+    var callbacks2 = [];
+    resizeObservers.forEach(function processObserver(ro) {
+      if (ro.activeTargets.length === 0) {
+        return;
+      }
+      var entries = [];
+      ro.activeTargets.forEach(function processTarget(ot) {
+        var entry = new ResizeObserverEntry(ot.target);
+        var targetDepth = calculateDepthForNode(ot.target);
+        entries.push(entry);
+        ot.lastReportedSize = calculateBoxSize(ot.target, ot.observedBox);
+        if (targetDepth < shallowestDepth) {
+          shallowestDepth = targetDepth;
+        }
+      });
+      callbacks2.push(function resizeObserverCallback() {
+        ro.callback.call(ro.observer, entries, ro.observer);
+      });
+      ro.activeTargets.splice(0, ro.activeTargets.length);
+    });
+    for (var _i2 = 0, callbacks_1 = callbacks2; _i2 < callbacks_1.length; _i2++) {
+      var callback = callbacks_1[_i2];
+      callback();
+    }
+    return shallowestDepth;
+  };
+  var gatherActiveObservationsAtDepth = function(depth) {
+    resizeObservers.forEach(function processObserver(ro) {
+      ro.activeTargets.splice(0, ro.activeTargets.length);
+      ro.skippedTargets.splice(0, ro.skippedTargets.length);
+      ro.observationTargets.forEach(function processTarget(ot) {
+        if (ot.isActive()) {
+          if (calculateDepthForNode(ot.target) > depth) {
+            ro.activeTargets.push(ot);
+          } else {
+            ro.skippedTargets.push(ot);
+          }
+        }
+      });
+    });
+  };
+  var process = function() {
+    var depth = 0;
+    gatherActiveObservationsAtDepth(depth);
+    while (hasActiveObservations()) {
+      depth = broadcastActiveObservations();
+      gatherActiveObservationsAtDepth(depth);
+    }
+    if (hasSkippedObservations()) {
+      deliverResizeLoopError();
+    }
+    return depth > 0;
+  };
+  var trigger;
+  var callbacks = [];
+  var notify = function() {
+    return callbacks.splice(0).forEach(function(cb) {
+      return cb();
+    });
+  };
+  var queueMicroTask = function(callback) {
+    if (!trigger) {
+      var toggle_1 = 0;
+      var el_1 = document.createTextNode("");
+      var config2 = { characterData: true };
+      new MutationObserver(function() {
+        return notify();
+      }).observe(el_1, config2);
+      trigger = function() {
+        el_1.textContent = "".concat(toggle_1 ? toggle_1-- : toggle_1++);
+      };
+    }
+    callbacks.push(callback);
+    trigger();
+  };
+  var queueResizeObserver = function(cb) {
+    queueMicroTask(function ResizeObserver2() {
+      requestAnimationFrame(cb);
+    });
+  };
+  var watching = 0;
+  var isWatching = function() {
+    return !!watching;
+  };
+  var CATCH_PERIOD = 250;
+  var observerConfig = { attributes: true, characterData: true, childList: true, subtree: true };
+  var events = [
+    "resize",
+    "load",
+    "transitionend",
+    "animationend",
+    "animationstart",
+    "animationiteration",
+    "keyup",
+    "keydown",
+    "mouseup",
+    "mousedown",
+    "mouseover",
+    "mouseout",
+    "blur",
+    "focus"
+  ];
+  var time = function(timeout2) {
+    if (timeout2 === void 0) {
+      timeout2 = 0;
+    }
+    return Date.now() + timeout2;
+  };
+  var scheduled = false;
+  var Scheduler = function() {
+    function Scheduler2() {
+      var _this = this;
+      this.stopped = true;
+      this.listener = function() {
+        return _this.schedule();
+      };
+    }
+    Scheduler2.prototype.run = function(timeout2) {
+      var _this = this;
+      if (timeout2 === void 0) {
+        timeout2 = CATCH_PERIOD;
+      }
+      if (scheduled) {
+        return;
+      }
+      scheduled = true;
+      var until = time(timeout2);
+      queueResizeObserver(function() {
+        var elementsHaveResized = false;
+        try {
+          elementsHaveResized = process();
+        } finally {
+          scheduled = false;
+          timeout2 = until - time();
+          if (!isWatching()) {
+            return;
+          }
+          if (elementsHaveResized) {
+            _this.run(1e3);
+          } else if (timeout2 > 0) {
+            _this.run(timeout2);
+          } else {
+            _this.start();
+          }
+        }
+      });
+    };
+    Scheduler2.prototype.schedule = function() {
+      this.stop();
+      this.run();
+    };
+    Scheduler2.prototype.observe = function() {
+      var _this = this;
+      var cb = function() {
+        return _this.observer && _this.observer.observe(document.body, observerConfig);
+      };
+      document.body ? cb() : global$1.addEventListener("DOMContentLoaded", cb);
+    };
+    Scheduler2.prototype.start = function() {
+      var _this = this;
+      if (this.stopped) {
+        this.stopped = false;
+        this.observer = new MutationObserver(this.listener);
+        this.observe();
+        events.forEach(function(name) {
+          return global$1.addEventListener(name, _this.listener, true);
+        });
+      }
+    };
+    Scheduler2.prototype.stop = function() {
+      var _this = this;
+      if (!this.stopped) {
+        this.observer && this.observer.disconnect();
+        events.forEach(function(name) {
+          return global$1.removeEventListener(name, _this.listener, true);
+        });
+        this.stopped = true;
+      }
+    };
+    return Scheduler2;
+  }();
+  var scheduler = new Scheduler();
+  var updateCount = function(n2) {
+    !watching && n2 > 0 && scheduler.start();
+    watching += n2;
+    !watching && scheduler.stop();
+  };
+  var skipNotifyOnElement = function(target) {
+    return !isSVG(target) && !isReplacedElement(target) && getComputedStyle(target).display === "inline";
+  };
+  var ResizeObservation = function() {
+    function ResizeObservation2(target, observedBox) {
+      this.target = target;
+      this.observedBox = observedBox || ResizeObserverBoxOptions.CONTENT_BOX;
+      this.lastReportedSize = {
+        inlineSize: 0,
+        blockSize: 0
+      };
+    }
+    ResizeObservation2.prototype.isActive = function() {
+      var size2 = calculateBoxSize(this.target, this.observedBox, true);
+      if (skipNotifyOnElement(this.target)) {
+        this.lastReportedSize = size2;
+      }
+      if (this.lastReportedSize.inlineSize !== size2.inlineSize || this.lastReportedSize.blockSize !== size2.blockSize) {
+        return true;
+      }
+      return false;
+    };
+    return ResizeObservation2;
+  }();
+  var ResizeObserverDetail = /* @__PURE__ */ function() {
+    function ResizeObserverDetail2(resizeObserver, callback) {
+      this.activeTargets = [];
+      this.skippedTargets = [];
+      this.observationTargets = [];
+      this.observer = resizeObserver;
+      this.callback = callback;
+    }
+    return ResizeObserverDetail2;
+  }();
+  var observerMap = /* @__PURE__ */ new WeakMap();
+  var getObservationIndex = function(observationTargets, target) {
+    for (var i2 = 0; i2 < observationTargets.length; i2 += 1) {
+      if (observationTargets[i2].target === target) {
+        return i2;
+      }
+    }
+    return -1;
+  };
+  var ResizeObserverController = function() {
+    function ResizeObserverController2() {
+    }
+    ResizeObserverController2.connect = function(resizeObserver, callback) {
+      var detail = new ResizeObserverDetail(resizeObserver, callback);
+      observerMap.set(resizeObserver, detail);
+    };
+    ResizeObserverController2.observe = function(resizeObserver, target, options2) {
+      var detail = observerMap.get(resizeObserver);
+      var firstObservation = detail.observationTargets.length === 0;
+      if (getObservationIndex(detail.observationTargets, target) < 0) {
+        firstObservation && resizeObservers.push(detail);
+        detail.observationTargets.push(new ResizeObservation(target, options2 && options2.box));
+        updateCount(1);
+        scheduler.schedule();
+      }
+    };
+    ResizeObserverController2.unobserve = function(resizeObserver, target) {
+      var detail = observerMap.get(resizeObserver);
+      var index2 = getObservationIndex(detail.observationTargets, target);
+      var lastObservation = detail.observationTargets.length === 1;
+      if (index2 >= 0) {
+        lastObservation && resizeObservers.splice(resizeObservers.indexOf(detail), 1);
+        detail.observationTargets.splice(index2, 1);
+        updateCount(-1);
+      }
+    };
+    ResizeObserverController2.disconnect = function(resizeObserver) {
+      var _this = this;
+      var detail = observerMap.get(resizeObserver);
+      detail.observationTargets.slice().forEach(function(ot) {
+        return _this.unobserve(resizeObserver, ot.target);
+      });
+      detail.activeTargets.splice(0, detail.activeTargets.length);
+    };
+    return ResizeObserverController2;
+  }();
+  var ResizeObserver$2 = function() {
+    function ResizeObserver2(callback) {
+      if (arguments.length === 0) {
+        throw new TypeError("Failed to construct 'ResizeObserver': 1 argument required, but only 0 present.");
+      }
+      if (typeof callback !== "function") {
+        throw new TypeError("Failed to construct 'ResizeObserver': The callback provided as parameter 1 is not a function.");
+      }
+      ResizeObserverController.connect(this, callback);
+    }
+    ResizeObserver2.prototype.observe = function(target, options2) {
+      if (arguments.length === 0) {
+        throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': 1 argument required, but only 0 present.");
+      }
+      if (!isElement$1(target)) {
+        throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': parameter 1 is not of type 'Element");
+      }
+      ResizeObserverController.observe(this, target, options2);
+    };
+    ResizeObserver2.prototype.unobserve = function(target) {
+      if (arguments.length === 0) {
+        throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': 1 argument required, but only 0 present.");
+      }
+      if (!isElement$1(target)) {
+        throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': parameter 1 is not of type 'Element");
+      }
+      ResizeObserverController.unobserve(this, target);
+    };
+    ResizeObserver2.prototype.disconnect = function() {
+      ResizeObserverController.disconnect(this);
+    };
+    ResizeObserver2.toString = function() {
+      return "function ResizeObserver () { [polyfill code] }";
+    };
+    return ResizeObserver2;
+  }();
+  const usePassiveLayoutEffect = React$2[typeof document !== "undefined" && document.createElement !== void 0 ? "useLayoutEffect" : "useEffect"];
+  const useLatest = (current) => {
+    const storedValue = React__namespace.useRef(current);
+    React__namespace.useEffect(() => {
+      storedValue.current = current;
+    });
+    return storedValue;
+  };
+  const ResizeObserver$1 = typeof window !== "undefined" && "ResizeObserver" in window ? (
+    // @ts-ignore
+    window.ResizeObserver
+  ) : ResizeObserver$2;
+  function _ref() {
+  }
+  function useResizeObserver(target, callback) {
+    const resizeObserver = getResizeObserver();
+    const storedCallback = useLatest(callback);
+    usePassiveLayoutEffect(() => {
+      let didUnsubscribe = false;
+      const targetEl = target && "current" in target ? target.current : target;
+      if (!targetEl) return _ref;
+      function cb(entry, observer) {
+        if (didUnsubscribe) return;
+        storedCallback.current(entry, observer);
+      }
+      resizeObserver.subscribe(targetEl, cb);
+      return () => {
+        didUnsubscribe = true;
+        resizeObserver.unsubscribe(targetEl, cb);
+      };
+    }, [target, resizeObserver, storedCallback]);
+    return resizeObserver.observer;
+  }
+  function createResizeObserver() {
+    let ticking = false;
+    let allEntries = [];
+    const callbacks2 = /* @__PURE__ */ new Map();
+    const observer = new ResizeObserver$1((entries, obs) => {
+      allEntries = allEntries.concat(entries);
+      function _ref22() {
+        const triggered = /* @__PURE__ */ new Set();
+        for (let i2 = 0; i2 < allEntries.length; i2++) {
+          if (triggered.has(allEntries[i2].target)) continue;
+          triggered.add(allEntries[i2].target);
+          const cbs = callbacks2.get(allEntries[i2].target);
+          cbs === null || cbs === void 0 ? void 0 : cbs.forEach((cb) => cb(allEntries[i2], obs));
+        }
+        allEntries = [];
+        ticking = false;
+      }
+      if (!ticking) {
+        window.requestAnimationFrame(_ref22);
+      }
+      ticking = true;
+    });
+    return {
+      observer,
+      subscribe(target, callback) {
+        var _callbacks$get;
+        observer.observe(target);
+        const cbs = (_callbacks$get = callbacks2.get(target)) !== null && _callbacks$get !== void 0 ? _callbacks$get : [];
+        cbs.push(callback);
+        callbacks2.set(target, cbs);
+      },
+      unsubscribe(target, callback) {
+        var _callbacks$get2;
+        const cbs = (_callbacks$get2 = callbacks2.get(target)) !== null && _callbacks$get2 !== void 0 ? _callbacks$get2 : [];
+        if (cbs.length === 1) {
+          observer.unobserve(target);
+          callbacks2.delete(target);
+          return;
+        }
+        const cbIndex = cbs.indexOf(callback);
+        if (cbIndex !== -1) cbs.splice(cbIndex, 1);
+        callbacks2.set(target, cbs);
+      }
+    };
+  }
+  let _resizeObserver;
+  const getResizeObserver = () => !_resizeObserver ? _resizeObserver = createResizeObserver() : _resizeObserver;
+  function ExpandableTableDataCell(props) {
+    const [isExpanded, setIsExpanded] = React$2.useState(false);
+    const [isOverflowingWhenNotExpanded, setIsOverflowingWhenNotExpanded] = React$2.useState(false);
+    const tdRef = React$2.useRef(null);
+    useResizeObserver(tdRef, ({ target }) => {
+      if (!isExpanded) {
+        if (target) {
+          const contentElement = target.getElementsByTagName("p")[0];
+          if (contentElement) {
+            setIsOverflowingWhenNotExpanded(
+              contentElement.scrollHeight > contentElement.clientHeight || contentElement.scrollWidth > contentElement.clientWidth
+            );
+          }
+        }
+      }
+    });
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "td",
+      {
+        ...props,
+        className: `ExpandableTableData ${props.className ? props.className : ""}`,
+        "aria-expanded": isExpanded,
+        ref: tdRef,
+        children: [
+          isOverflowingWhenNotExpanded && /* @__PURE__ */ jsxRuntimeExports.jsx(
+            ExpandCollapseButton,
+            {
+              isExpanded,
+              className: "ExpandableTableData__expandButton",
+              onClick: () => setIsExpanded(!isExpanded)
+            }
+          ),
+          props.children
+        ]
+      }
+    );
+  }
+  function CellRenderer(cell) {
+    var _a3, _b2, _c2;
+    const getWrapInExpandableTd = (_a3 = cell.getContext().table.options.meta) == null ? void 0 : _a3.getWrapInExpandableTd;
+    const wrapInExpandableTd = getWrapInExpandableTd && getWrapInExpandableTd(cell);
+    const TableDataCellElement = wrapInExpandableTd ? ExpandableTableDataCell : "td";
+    const renderPlaceholderData = (_b2 = cell.getContext().table.options.meta) == null ? void 0 : _b2.renderPlaceholderData;
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      TableDataCellElement,
+      {
+        style: {
+          width: `calc(var(${getColumnSizeCssVariable(cell.column.id)}) * 1px)`,
+          textAlign: (_c2 = cell.column.columnDef.meta) == null ? void 0 : _c2.textAlign
+        },
+        children: renderPlaceholderData ? /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { width: "80%", height: "20px" }) }) : flexRender(cell.column.columnDef.cell, cell.getContext())
+      },
+      cell.id
+    );
+  }
+  function TableBody(props) {
+    const { table: table2 } = props;
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", { children: table2.getRowModel().rows.map((row) => /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { children: row.getVisibleCells().map(CellRenderer) }, row.id)) });
+  }
+  const MemoizedTableBody = React$2.memo(TableBody, (prev2, next2) => {
+    return prev2.table.options.data === next2.table.options.data;
+  });
+  function StyledTanStackTable(props) {
+    const { table: table2, styledTableContainerProps, fullWidth = true } = props;
+    const columnSizeVars = React$2.useMemo(() => {
+      const headers = table2.getFlatHeaders();
+      const colSizes = {};
+      for (let i2 = 0; i2 < headers.length; i2++) {
+        const header = headers[i2];
+        colSizes[getHeaderSizeCssVariable(header.id)] = header.getSize();
+        colSizes[getColumnSizeCssVariable(header.column.id)] = header.column.getSize();
+      }
+      return colSizes;
+    }, [table2.getState().columnSizingInfo, table2.getState().columnSizing]);
+    const tableWidth = fullWidth ? "100%" : table2.getTotalSize();
+    const TableBodyElement = table2.getState().columnSizingInfo.isResizingColumn ? MemoizedTableBody : TableBody;
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(StyledTableContainer, { ...styledTableContainerProps, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("table", { style: { ...columnSizeVars, width: tableWidth }, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("thead", { children: table2.getHeaderGroups().map((headerGroup) => {
+        return /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "th",
+          {
+            colSpan: header.colSpan,
+            style: {
+              width: `calc(var(${getHeaderSizeCssVariable(
+                header.id
+              )}) * 1px)`
+            },
+            children: [
+              header.isPlaceholder ? null : flexRender(
+                header.column.columnDef.header,
+                header.getContext()
+              ),
+              header.column.getCanResize() && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "div",
+                {
+                  className: `resizer ${header.column.getIsResizing() ? "isResizing" : ""}`,
+                  onMouseDown: header.getResizeHandler(),
+                  onTouchStart: header.getResizeHandler()
+                }
+              )
+            ]
+          },
+          header.id
+        )) }, headerGroup.id);
+      }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(TableBodyElement, { table: table2 })
+    ] }) });
+  }
   const columnHelper$3 = createColumnHelper();
   function SynapseTable(props) {
     var _a3, _b2, _c2, _d2;
@@ -115118,14 +115267,16 @@ ${e2.message}`);
       ]
     );
     const columnVisibility = React$2.useMemo(
-      () => ((data == null ? void 0 : data.selectColumns) ?? []).reduce((prev2, curr) => {
+      () => selectColumns.reduce((prev2, curr) => {
         return {
           ...prev2,
           [curr.name]: columnsToShowInTable.includes(curr.name)
         };
       }, prependColumnVisibility),
-      [columnsToShowInTable, data == null ? void 0 : data.selectColumns, prependColumnVisibility]
+      [columnsToShowInTable, selectColumns, prependColumnVisibility]
     );
+    const { dataHasBeenPrefetched } = usePrefetchTableData();
+    const renderTableDataPlaceholder = !dataHasBeenPrefetched;
     const table2 = useReactTable({
       data: ((_c2 = data == null ? void 0 : data.queryResult) == null ? void 0 : _c2.queryResults.rows) ?? [],
       columns: columns2,
@@ -115142,10 +115293,19 @@ ${e2.message}`);
       meta: {
         // make the rowEntityIDColumnIndex available to all cell renderers
         rowEntityIDColumnIndex,
-        rowEntityVersionColumnIndex
+        rowEntityVersionColumnIndex,
+        renderPlaceholderData: renderTableDataPlaceholder,
+        getWrapInExpandableTd: (cell) => {
+          const selectColumn = selectColumns.find(
+            (cm) => cm.name === cell.column.id
+          );
+          return Boolean(
+            selectColumn && /* JSON handles its own overflow*/
+            selectColumn.columnType !== ColumnTypeEnum.JSON
+          );
+        }
       }
     });
-    const { dataHasBeenPrefetched } = usePrefetchTableData();
     if (!data && isLoadingNewBundle) {
       return loadingScreen;
     } else if (!data) {
@@ -115166,59 +115326,15 @@ ${e2.message}`);
         }
       ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "div",
+        StyledTanStackTable,
         {
-          className: "SynapseTable SRC-overflowAuto",
-          "data-testid": "SynapseTable",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsxs("table", { style: { width: table2.getTotalSize() }, children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("thead", { children: table2.getHeaderGroups().map((headerGroup) => {
-              return /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
-                "th",
-                {
-                  colSpan: header.colSpan,
-                  style: { width: header.getSize() },
-                  children: [
-                    header.isPlaceholder ? null : flexRender(
-                      header.column.columnDef.header,
-                      header.getContext()
-                    ),
-                    header.column.getCanResize() && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                      "div",
-                      {
-                        className: `resizer ${header.column.getIsResizing() ? "isResizing" : ""}`,
-                        onMouseDown: header.getResizeHandler(),
-                        onTouchStart: header.getResizeHandler()
-                      }
-                    )
-                  ]
-                },
-                header.id
-              )) }, headerGroup.id);
-            }) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", { children: table2.getRowModel().rows.map((row) => /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { children: row.getVisibleCells().map((cell) => {
-              var _a4;
-              const selectColumn = selectColumns.find(
-                (cm) => cm.name === cell.column.id
-              );
-              const shouldWrapInExpandable = selectColumn && selectColumn.columnType !== ColumnTypeEnum.JSON;
-              const TableDataCellElement = shouldWrapInExpandable ? ExpandableTableDataCell : "td";
-              const renderPlaceholder = !dataHasBeenPrefetched;
-              return /* @__PURE__ */ jsxRuntimeExports.jsx(
-                TableDataCellElement,
-                {
-                  style: {
-                    width: cell.column.getSize(),
-                    textAlign: (_a4 = cell.column.columnDef.meta) == null ? void 0 : _a4.textAlign
-                  },
-                  children: renderPlaceholder ? /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { width: "80%", height: "20px" }) }) : flexRender(
-                    cell.column.columnDef.cell,
-                    cell.getContext()
-                  )
-                },
-                cell.id
-              );
-            }) }, row.id)) })
-          ] })
+          styledTableContainerProps: {
+            className: "SynapseTable",
+            ["data-testid"]: "SynapseTable",
+            density: "default"
+          },
+          table: table2,
+          fullWidth: false
         }
       ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { sx: { mt: 2, textAlign: "right" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(TablePagination, {}) })
@@ -116367,8 +116483,7 @@ ${e2.message}`);
                 accessType
               ),
               onRemove: () => removeResourceAccessItem(resourceAccess.principalId)
-            },
-            resourceAccess.principalId
+            }
           ) }, resourceAccess.principalId);
         }) })
       ] }),
@@ -116519,10 +116634,15 @@ ${e2.message}`);
     };
   }
   const PRINCIPAL_ALREADY_ADDED_ERROR_MESSAGE = "User or team already has permissions.";
+  const EMPTY_ARRAY$2 = [];
   function useUpdateAcl(options2 = {}) {
-    const { onChange = noop$9, onError = noop$9 } = options2;
+    const {
+      initialResourceAccessList = EMPTY_ARRAY$2,
+      onChange = noop$9,
+      onError = noop$9
+    } = options2;
     const [isDirty2, setIsDirty] = React$2.useState(false);
-    const [resourceAccessList, setResourceAccessList] = React$2.useState([]);
+    const [resourceAccessList, setResourceAccessList] = React$2.useState(initialResourceAccessList);
     const [hasSorted, setHasSorted] = React$2.useState(false);
     const { sortedResourceAccessList, isLoading: isLoadingSortedList } = useSortResourceAccessList(resourceAccessList);
     React$2.useEffect(() => {
@@ -116839,11 +116959,11 @@ ${getEndpoint(
       updateResourceAccessItem,
       removeResourceAccessItem,
       resetDirtyState
-    } = useUpdateAcl();
+    } = useUpdateAcl({ initialResourceAccessList: originalResourceAccess });
     React$2.useEffect(() => {
       if (originalResourceAccess) {
         resetDirtyState();
-        setResourceAccessList(originalResourceAccess);
+        setResourceAccessList([...originalResourceAccess]);
       }
     }, [originalResourceAccess, resetDirtyState, setResourceAccessList]);
     React$2.useEffect(() => {
@@ -125385,13 +125505,13 @@ query = syn.tableQuery("${clientSql}")${"\n"}query.asDataFrame()`
                 }
               ) }, requester.userId))
             ] }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("td", { children: item.accessRequirementReviewerIds.length === 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(UserOrTeamBadge, { principalId: ACT_TEAM_ID }) : item.accessRequirementReviewerIds.map((reviewerId2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+            /* @__PURE__ */ jsxRuntimeExports.jsx("td", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Stack$6, { gap: 1, children: item.accessRequirementReviewerIds.length === 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(UserOrTeamBadge, { principalId: ACT_TEAM_ID }) : item.accessRequirementReviewerIds.map((reviewerId2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
               UserOrTeamBadge,
               {
                 principalId: reviewerId2
               },
               reviewerId2
-            )) }),
+            )) }) }),
             /* @__PURE__ */ jsxRuntimeExports.jsx("td", { children: formatDate(dayjs(item.createdOn)) })
           ] }, item.id);
         }) })
@@ -154231,72 +154351,6 @@ query = syn.tableQuery("${clientSql}")${"\n"}query.asDataFrame()`
     });
     return { table: table2, isLoading, hasNextPage: hasNextPage2, fetchNextPage };
   }
-  const StyledTableContainer = styled(Box)(({ theme: theme3, density = "default" }) => ({
-    overflow: "auto",
-    paddingLeft: "2px",
-    th: {
-      height: "38px",
-      backgroundColor: theme3.palette.grey[200]
-    },
-    ["th:first-of-type"]: {
-      paddingLeft: "10px"
-    },
-    ["td:first-of-type"]: {
-      paddingLeft: "10px"
-    },
-    ["tr:nth-of-type(2n)"]: {
-      backgroundColor: theme3.palette.grey[100]
-    },
-    ["th,td"]: {
-      paddingLeft: theme3.spacing(density === "compact" ? 0 : 1),
-      paddingRight: theme3.spacing(density === "compact" ? 0 : 1)
-    },
-    td: {
-      paddingTop: theme3.spacing(density === "compact" ? 0 : 1),
-      paddingBottom: theme3.spacing(density === "compact" ? 0 : 1)
-    }
-  }));
-  function StyledTanStackTable(props) {
-    const { table: table2, styledTableContainerProps } = props;
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(StyledTableContainer, { ...styledTableContainerProps, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("table", { style: { width: "100%" }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("thead", { children: table2.getHeaderGroups().map((headerGroup) => {
-        return /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
-          "th",
-          {
-            colSpan: header.colSpan,
-            style: { width: header.getSize() },
-            children: [
-              header.isPlaceholder ? null : flexRender(
-                header.column.columnDef.header,
-                header.getContext()
-              ),
-              header.column.getCanResize() && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                "div",
-                {
-                  className: `resizer ${header.column.getIsResizing() ? "isResizing" : ""}`,
-                  onMouseDown: header.getResizeHandler(),
-                  onTouchStart: header.getResizeHandler()
-                }
-              )
-            ]
-          },
-          header.id
-        )) }, headerGroup.id);
-      }) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", { children: table2.getRowModel().rows.map((row) => /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { children: row.getVisibleCells().map((cell) => {
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "td",
-          {
-            style: {
-              width: cell.column.getSize()
-            },
-            children: flexRender(cell.column.columnDef.cell, cell.getContext())
-          },
-          cell.id
-        );
-      }) }, row.id)) })
-    ] }) });
-  }
   function AccessRequirementTable(props) {
     const {
       nameOrID,
@@ -154996,7 +155050,7 @@ query = syn.tableQuery("${clientSql}")${"\n"}query.asDataFrame()`
       parseInt(submission == null ? void 0 : submission.accessRequirementId),
       { enabled: !!submission }
     );
-    const { data: acl } = useGetAccessRequirementACL(
+    const { data: acl, isLoading: isLoadingACL } = useGetAccessRequirementACL(
       submission == null ? void 0 : submission.accessRequirementId,
       { enabled: !!submission, throwOnError: true }
     );
@@ -155007,6 +155061,7 @@ query = syn.tableQuery("${clientSql}")${"\n"}query.asDataFrame()`
         newState: SubmissionState.APPROVED
       });
     }
+    const reviewerIds = acl == null ? void 0 : acl.resourceAccess.filter((ra) => ra.accessType.includes(ACCESS_TYPE.REVIEW_SUBMISSIONS)).map((ra) => ra.principalId);
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "SubmissionPage", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         ApproveConfirmationModal,
@@ -155066,15 +155121,13 @@ query = syn.tableQuery("${clientSql}")${"\n"}query.asDataFrame()`
         /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "smallText1", children: (accessRequirement == null ? void 0 : accessRequirement.name) ?? /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { width: 100 }) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
         /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "dataFieldKey", children: "Assigned Reviewer" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "smallText1", children: acl !== void 0 ? acl !== null ? acl.resourceAccess.map((ra) => {
-          return /* @__PURE__ */ jsxRuntimeExports.jsx(
-            UserOrTeamBadge,
-            {
-              principalId: ra.principalId
-            },
-            ra.principalId
-          );
-        }) : /* @__PURE__ */ jsxRuntimeExports.jsx(UserOrTeamBadge, { principalId: ACT_TEAM_ID }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { width: 100 }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs(Typography, { variant: "smallText1", children: [
+          isLoadingACL && /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { width: 100 }),
+          !isLoadingACL && !isEmpty$1(reviewerIds) && reviewerIds.map((id2) => {
+            return /* @__PURE__ */ jsxRuntimeExports.jsx(UserOrTeamBadge, { principalId: id2 }, id2);
+          }),
+          !isLoadingACL && isEmpty$1(reviewerIds) && /* @__PURE__ */ jsxRuntimeExports.jsx(UserOrTeamBadge, { principalId: ACT_TEAM_ID })
+        ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
         /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "dataFieldKey", children: "Conditions" }),
         accessRequirement ? /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "smallText1", component: "div", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("ul", { children: [
@@ -162692,7 +162745,7 @@ dl_list_file_entities = syn.get_download_list()`;
       (selectColumn) => selectColumn.name == "N_UNIQUE_USERS"
     );
     const egressSizeColIndex = headers == null ? void 0 : headers.findIndex(
-      (selectColumn) => selectColumn.name == "TOTAL_DATA_SIZE_GIB"
+      (selectColumn) => selectColumn.name == "ESTIMATED_PROJECT_SIZE_IN_GIB"
     );
     if (!rowSet || rowSet.rows.length == 0) {
       return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {});
@@ -162710,7 +162763,7 @@ dl_list_file_entities = syn.get_download_list()`;
           children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "body1", sx: { ml: "15px" }, children: "Rank" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "body1", children: "Project" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "body1", children: "Data Downloaded" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "body1", children: "Project Data" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "body1", children: "Unique Teams" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(Box, {})
           ]
@@ -164260,19 +164313,101 @@ dl_list_file_entities = syn.get_download_list()`;
     width: "16px",
     transition: "fill 1s ease-in-out"
   }));
+  const searchValues = [
+    "Alzheimer's Disease",
+    "Neurofibromatosis mouse models",
+    "Cancer",
+    "UK Biobank",
+    "Single-cell analysis of breast cancer",
+    "ROSMAP Religious Orders Study and Memory and Aging Project",
+    "Retinal regeneration studies",
+    "Machine Learning datasets"
+  ];
+  const projectKeyValue = {
+    key: "node_type",
+    value: "project",
+    not: false
+  };
+  const SynapseSearchChips = ({ gotoPlace }) => {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: searchValues.map((value) => {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Chip,
+        {
+          label: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            Typography,
+            {
+              variant: "body1",
+              sx: {
+                fontSize: "18px",
+                fontWeight: 400,
+                p: "10px"
+              },
+              children: value
+            }
+          ),
+          onClick: () => {
+            const searchQuery = {
+              queryTerm: [value],
+              booleanQuery: value == "Cancer" ? [projectKeyValue] : void 0,
+              // match existing facet options in SWC search
+              facetOptions: [
+                {
+                  name: SearchFieldName.ENTITY_TYPE,
+                  maxResultCount: 300,
+                  sortType: SearchFacetSort.COUNT
+                },
+                {
+                  name: SearchFieldName.CONSORTIUM,
+                  maxResultCount: 300,
+                  sortType: SearchFacetSort.COUNT
+                },
+                {
+                  name: SearchFieldName.MODIFIED_ON,
+                  maxResultCount: 300,
+                  sortType: SearchFacetSort.COUNT
+                },
+                {
+                  name: SearchFieldName.MODIFIED_BY,
+                  maxResultCount: 300,
+                  sortType: SearchFacetSort.COUNT
+                },
+                {
+                  name: SearchFieldName.CREATED_ON,
+                  maxResultCount: 300,
+                  sortType: SearchFacetSort.COUNT
+                },
+                {
+                  name: SearchFieldName.TISSUE,
+                  maxResultCount: 300,
+                  sortType: SearchFacetSort.COUNT
+                },
+                {
+                  name: SearchFieldName.CREATED_BY,
+                  maxResultCount: 300,
+                  sortType: SearchFacetSort.COUNT
+                }
+              ],
+              start: 0,
+              size: 30
+            };
+            gotoPlace(`/Search:${JSON.stringify(searchQuery)}`);
+          },
+          variant: "outlined",
+          sx: {
+            color: "secondary.600",
+            backgroundColor: "secondary.100",
+            borderWidth: "0px",
+            "&:hover": { backgroundColor: "#B5D3CE !important" }
+          }
+        },
+        value
+      );
+    }) });
+  };
   const synapseInActionTable = "syn61670075";
   const past30DaysDownloadMetricsTable = "syn61597084";
   const generalStatsMetricsTable = "syn61588163";
   const featuredDatasetsTable = "syn61609402";
-  const popularSearches = [
-    "Alzheimer's Disease",
-    "Parkinson",
-    "Neurofibromatosis",
-    "HTAN",
-    "ukb-ppp",
-    "ROSMAP",
-    "GENIE"
-  ];
   const darkTextColor = "#22252A";
   const homepageBodyText = {
     fontSize: "24px",
@@ -164453,34 +164588,7 @@ dl_list_file_entities = syn.get_download_list()`;
             mt: "30px",
             flexWrap: "wrap"
           },
-          children: popularSearches.map((value) => {
-            return /* @__PURE__ */ jsxRuntimeExports.jsx(
-              Chip,
-              {
-                label: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                  Typography,
-                  {
-                    variant: "body1",
-                    sx: {
-                      fontSize: "18px",
-                      fontWeight: 400,
-                      p: "10px"
-                    },
-                    children: value
-                  }
-                ),
-                onClick: () => gotoPlace(`/Search:${encodeURIComponent(value)}`),
-                variant: "outlined",
-                sx: {
-                  color: "secondary.600",
-                  backgroundColor: "secondary.100",
-                  borderWidth: "0px",
-                  "&:hover": { backgroundColor: "#B5D3CE !important" }
-                }
-              },
-              value
-            );
-          })
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(SynapseSearchChips, { gotoPlace })
         }
       ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -165256,7 +165364,7 @@ dl_list_file_entities = syn.get_download_list()`;
                 {
                   className: "synapseIcon",
                   rel: "noopener noreferrer",
-                  onClick: () => gotoPlace("/Home:0"),
+                  onClick: () => gotoPlace("/Home:x"),
                   "aria-label": "Synapse Home",
                   children: /* @__PURE__ */ jsxRuntimeExports.jsx(SynapseIconWhite, {})
                 }
@@ -179482,7 +179590,9 @@ dl_list_file_entities = syn.get_download_list()`;
   }(React$2.Component);
   a.defaultProps = { disabled: false, offColor: "#888", onColor: "#080", offHandleColor: "#fff", onHandleColor: "#fff", uncheckedIcon: n, checkedIcon: o, boxShadow: null, activeBoxShadow: "0 0 2px 3px #3bf", height: 28, width: 56 };
   const experimentalModeText = "This mode gives you early access to features that are still in development. Please note that we do not guarantee an absence of errors, and that the data created using these features may be lost during product upgrade.";
-  const ExperimentalMode = () => {
+  const ExperimentalMode = ({
+    onExperimentalModeToggle
+  }) => {
     const [isExperimentalModeOn, setIsExperimentalModeOn] = React$2.useState(false);
     const cookies2 = new UniversalCookies();
     let mounted = true;
@@ -179500,10 +179610,16 @@ dl_list_file_entities = syn.get_download_list()`;
     const createExperimentalModeCookie = () => {
       cookies2.set(EXPERIMENTAL_MODE_COOKIE, { path: "/" });
       setIsExperimentalModeOn(true);
+      if (onExperimentalModeToggle) {
+        onExperimentalModeToggle(true);
+      }
     };
     const deleteExperimentalModeCookie = () => {
       document.cookie = `${EXPERIMENTAL_MODE_COOKIE}= ; expires = Thu, 01 Jan 1970 00:00:00 GMT`;
       setIsExperimentalModeOn(false);
+      if (onExperimentalModeToggle) {
+        onExperimentalModeToggle(false);
+      }
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(Typography, { variant: "body1", children: "Experimental Mode" }),
@@ -179535,7 +179651,8 @@ dl_list_file_entities = syn.get_download_list()`;
     portalVersion,
     srcVersion,
     repoVersion,
-    gotoPlace
+    gotoPlace,
+    onExperimentalModeToggle
   }) => {
     const { accessToken } = useSynapseContext();
     const registrationUrl = useOneSageURL("/register1");
@@ -179878,7 +179995,7 @@ dl_list_file_entities = syn.get_download_list()`;
                 ]
               }
             ),
-            /* @__PURE__ */ jsxRuntimeExports.jsx(ExperimentalMode, {})
+            /* @__PURE__ */ jsxRuntimeExports.jsx(ExperimentalMode, { onExperimentalModeToggle })
           ]
         }
       )
@@ -180083,7 +180200,7 @@ dl_list_file_entities = syn.get_download_list()`;
       )
     ] });
   };
-  const version = "3.3.7";
+  const version = "3.3.8";
   const SynapseEnums = {
     BackendDestinationEnum
   };