@pingux/astro 2.238.0 → 2.239.0-alpha.0

package/lib/cjs/components/TableBase/TableBase.test.js

@@ -1,1408 +0,0 @@
-"use strict";
-
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-var _Symbol = require("@babel/runtime-corejs3/core-js-stable/symbol");
-var _Object$create = require("@babel/runtime-corejs3/core-js-stable/object/create");
-var _bindInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/bind");
-var _Object$getPrototypeOf = require("@babel/runtime-corejs3/core-js-stable/object/get-prototype-of");
-var _Object$setPrototypeOf = require("@babel/runtime-corejs3/core-js-stable/object/set-prototype-of");
-var _Symbol$asyncIterator = require("@babel/runtime-corejs3/core-js-stable/symbol/async-iterator");
-var _Promise = require("@babel/runtime-corejs3/core-js-stable/promise");
-var _Symbol$iterator = require("@babel/runtime-corejs3/core-js-stable/symbol/iterator");
-var _reverseInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/reverse");
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
-var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
-var _sort2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/sort"));
-var _parseInt2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/parse-int"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/asyncToGenerator"));
-var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
-var _reactStately = require("react-stately");
-var _react2 = require("@testing-library/react");
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-var _jestAxe = require("jest-axe");
-var _index = require("../../index");
-var _universalComponentTest = require("../../utils/testUtils/universalComponentTest");
-var _TableBase = _interopRequireDefault(require("./TableBase"));
-var _react3 = require("@emotion/react");
-function _regeneratorRuntime() { "use strict"; var r = _regenerator(), e = r.m(_regeneratorRuntime), t = (_Object$getPrototypeOf ? _Object$getPrototypeOf(e) : e.__proto__).constructor; function n(r) { var e = "function" == typeof r && r.constructor; return !!e && (e === t || "GeneratorFunction" === (e.displayName || e.name)); } var o = { "throw": 1, "return": 2, "break": 3, "continue": 3 }; function a(r) { var e, t; return function (n) { e || (e = { stop: function stop() { return t(n.a, 2); }, "catch": function _catch() { return n.v; }, abrupt: function abrupt(r, e) { return t(n.a, o[r], e); }, delegateYield: function delegateYield(r, o, a) { return e.resultName = o, t(n.d, _regeneratorValues(r), a); }, finish: function finish(r) { return t(n.f, r); } }, t = function t(r, _t, o) { n.p = e.prev, n.n = e.next; try { return r(_t, o); } finally { e.next = n.n; } }), e.resultName && (e[e.resultName] = n.v, e.resultName = void 0), e.sent = n.v, e.next = n.n; try { return r.call(this, e); } finally { n.p = e.prev, n.n = e.next; } }; } return (_regeneratorRuntime = function _regeneratorRuntime() { return { wrap: function wrap(e, t, n, o) { return r.w(a(e), t, n, o && _reverseInstanceProperty(o).call(o)); }, isGeneratorFunction: n, mark: r.m, awrap: function awrap(r, e) { return new _OverloadYield(r, e); }, AsyncIterator: _regeneratorAsyncIterator, async: function async(r, e, t, o, u) { return (n(e) ? _regeneratorAsyncGen : _regeneratorAsync)(a(r), e, t, o, u); }, keys: _regeneratorKeys, values: _regeneratorValues }; })(); }
-function _regeneratorValues(e) { if (null != e) { var t = e["function" == typeof _Symbol && _Symbol$iterator || "@@iterator"], r = 0; if (t) return t.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) return { next: function next() { return e && r >= e.length && (e = void 0), { value: e && e[r++], done: !e }; } }; } throw new TypeError(_typeof(e) + " is not iterable"); }
-function _regeneratorKeys(e) { var n = Object(e), r = []; for (var t in n) r.unshift(t); return function e() { for (; r.length;) if ((t = r.pop()) in n) return e.value = t, e.done = !1, e; return e.done = !0, e; }; }
-function _regeneratorAsync(n, e, r, t, o) { var a = _regeneratorAsyncGen(n, e, r, t, o); return a.next().then(function (n) { return n.done ? n.value : a.next(); }); }
-function _regeneratorAsyncGen(r, e, t, o, n) { return new _regeneratorAsyncIterator(_regenerator().w(r, e, t, o), n || _Promise); }
-function _regeneratorAsyncIterator(t, e) { function n(r, o, i, f) { try { var c = t[r](o), u = c.value; return u instanceof _OverloadYield ? e.resolve(u.v).then(function (t) { n("next", t, i, f); }, function (t) { n("throw", t, i, f); }) : e.resolve(u).then(function (t) { c.value = t, i(c); }, function (t) { return n("throw", t, i, f); }); } catch (t) { f(t); } } var r; this.next || (_regeneratorDefine2(_regeneratorAsyncIterator.prototype), _regeneratorDefine2(_regeneratorAsyncIterator.prototype, "function" == typeof _Symbol && _Symbol$asyncIterator || "@asyncIterator", function () { return this; })), _regeneratorDefine2(this, "_invoke", function (t, o, i) { function f() { return new e(function (e, r) { n(t, i, e, r); }); } return r = r ? r.then(f, f) : f(); }, !0); }
-function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof _Symbol ? _Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = _Object$create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: _bindInstanceProperty(d).call(d, e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = _Object$getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(c); function f(e) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = _Object$create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
-function _regeneratorDefine2(e, r, n, t) { var i = _Object$defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
-function _OverloadYield(e, d) { this.v = e, this.k = d; }
-var testId = 'test-table';
-var defaultProps = {
-  'aria-label': 'table',
-  'data-testid': testId,
-  caption: 'Populations of Countries'
-};
-var headers = [{
-  key: 'country',
-  name: 'Country'
-}, {
-  key: 'population',
-  name: 'Population'
-}, {
-  key: 'continent',
-  name: 'Continent'
-}];
-var objects = [{
-  key: '1',
-  country: 'USA',
-  population: '320,000,000',
-  continent: 'South America'
-}, {
-  key: '2',
-  country: 'Canada',
-  population: '37,000,000',
-  continent: 'North America'
-}, {
-  key: '3',
-  country: 'China',
-  population: '1,398,000,000',
-  continent: 'Asia'
-}, {
-  key: '4',
-  country: 'France',
-  population: '67,000,000',
-  continent: 'Europe'
-}];
-var getComponent = function getComponent() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], (0, _extends2["default"])({}, defaultProps, props), (0, _react3.jsx)(_index.THead, {
-    columns: headers
-  }, function (head) {
-    return (0, _react3.jsx)(_index.Column, {
-      key: head.key
-    }, head.name);
-  }), (0, _react3.jsx)(_index.TBody, {
-    items: objects
-  }, function (row) {
-    return (0, _react3.jsx)(_index.Row, {
-      key: row.key
-    }, function (columnKey) {
-      return (0, _react3.jsx)(_index.Cell, null, row[columnKey]);
-    });
-  })));
-};
-(0, _universalComponentTest.universalComponentTests)({
-  renderComponent: function renderComponent(props) {
-    return (0, _react3.jsx)(_TableBase["default"], (0, _extends2["default"])({}, defaultProps, props), (0, _react3.jsx)(_index.THead, {
-      columns: headers
-    }, function (head) {
-      return (0, _react3.jsx)(_index.Column, {
-        key: head.key
-      }, head.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: objects
-    }, function (row) {
-      return (0, _react3.jsx)(_index.Row, {
-        key: row.key
-      }, function (columnKey) {
-        return (0, _react3.jsx)(_index.Cell, null, row[columnKey]);
-      });
-    }));
-  }
-});
-test('default table', function () {
-  getComponent();
-  var table = _react2.screen.getByTestId(testId);
-  expect(table).toBeInTheDocument();
-});
-test('renders caption', function () {
-  getComponent();
-  var caption = _react2.screen.getByText(defaultProps.caption);
-  expect(caption).toBeInTheDocument();
-});
-test('renders table headers', function () {
-  getComponent();
-  var headerCells = _react2.screen.getAllByRole('columnheader');
-  expect(headerCells).toHaveLength(headers.length);
-  (0, _forEach["default"])(headers).call(headers, function (header) {
-    expect(_react2.screen.getByText(header.name)).toBeInTheDocument();
-  });
-});
-test('renders table rows', function () {
-  getComponent();
-  var rows = _react2.screen.getAllByRole('row');
-  expect(rows).toHaveLength(objects.length + 1);
-  (0, _forEach["default"])(objects).call(objects, function (object) {
-    expect(_react2.screen.getByText(object.country)).toBeInTheDocument();
-    expect(_react2.screen.getByText(object.population)).toBeInTheDocument();
-    expect(_react2.screen.getByText(object.continent)).toBeInTheDocument();
-  });
-});
-test('renders sticky header', function () {
-  getComponent({
-    isStickyHeader: true
-  });
-  var stickyHeader = _react2.screen.getAllByRole('rowgroup');
-  expect(stickyHeader[0]).toHaveClass('is-sticky');
-});
-test('renders checkbox in case of multi selection', function () {
-  getComponent({
-    selectionMode: 'multiple'
-  });
-  var checkboxes = _react2.screen.getAllByRole('checkbox');
-  expect(checkboxes).toHaveLength(objects.length + 1);
-});
-test('should change selection on mouse press', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-  var rows;
-  return _regeneratorRuntime().wrap(function _callee$(_context) {
-    while (1) switch (_context.prev = _context.next) {
-      case 0:
-        getComponent({
-          selectionMode: 'multiple'
-        });
-        rows = _react2.screen.getAllByRole('row');
-        expect(rows[1]).not.toHaveClass('is-selected');
-        _context.next = 5;
-        return _userEvent["default"].click(rows[1]);
-      case 5:
-        expect(rows[1]).toHaveClass('is-selected');
-      case 6:
-      case "end":
-        return _context.stop();
-    }
-  }, _callee);
-})));
-test('should NOT change selection on row body click when hasSelectionCheckboxes is true', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-  var rows, firstBodyRowCells;
-  return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-    while (1) switch (_context2.prev = _context2.next) {
-      case 0:
-        getComponent({
-          selectionMode: 'multiple',
-          hasSelectionCheckboxes: true
-        });
-        rows = _react2.screen.getAllByRole('row'); // Click on a cell (the actual user target) — cell-level stopPropagation prevents
-        // the row's press handler from firing, so no selection is triggered.
-        firstBodyRowCells = rows[1].querySelectorAll('td');
-        expect(rows[1]).not.toHaveClass('is-selected');
-        _context2.next = 6;
-        return _userEvent["default"].click(firstBodyRowCells[1]);
-      case 6:
-        expect(rows[1]).not.toHaveClass('is-selected');
-      case 7:
-      case "end":
-        return _context2.stop();
-    }
-  }, _callee2);
-})));
-test('should change selection via checkbox when hasSelectionCheckboxes is true', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
-  var rows, firstRowCheckbox;
-  return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-    while (1) switch (_context3.prev = _context3.next) {
-      case 0:
-        getComponent({
-          selectionMode: 'multiple',
-          hasSelectionCheckboxes: true
-        });
-        rows = _react2.screen.getAllByRole('row');
-        firstRowCheckbox = (0, _react2.within)(rows[1]).getByRole('checkbox');
-        expect(rows[1]).not.toHaveClass('is-selected');
-        _context3.next = 6;
-        return _userEvent["default"].click(firstRowCheckbox);
-      case 6:
-        expect(rows[1]).toHaveClass('is-selected');
-      case 7:
-      case "end":
-        return _context3.stop();
-    }
-  }, _callee3);
-})));
-test('mousedown on a cell does not bubble to row via React synthetic event', function () {
-  // Verify that the cell-level stopPropagation approach prevents the row's React
-  // onMouseDown handler from firing. We test this with a simple isolated component
-  // that matches the structure used in TableCell (mergeProps with stopPropagation).
-  // The full integration is covered by the hasSelectionCheckboxes test above.
-  var rowSpy = jest.fn();
-  (0, _react2.render)((0, _react3.jsx)("table", null, (0, _react3.jsx)("tbody", null, (0, _react3.jsx)("tr", {
-    "data-testid": "test-row",
-    onMouseDown: rowSpy
-  }, (0, _react3.jsx)("td", {
-    "data-testid": "test-cell",
-    onMouseDown: function onMouseDown(e) {
-      return e.stopPropagation();
-    }
-  }, "cell content")))));
-  _react2.fireEvent.mouseDown(_react2.screen.getByTestId('test-cell'));
-  // The row's React onMouseDown should not have fired because stopPropagation
-  // was called on the td's synthetic onMouseDown handler.
-  expect(rowSpy).not.toHaveBeenCalled();
-});
-test('should toggle selection on Enter key when row is focused', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
-  var rows;
-  return _regeneratorRuntime().wrap(function _callee4$(_context4) {
-    while (1) switch (_context4.prev = _context4.next) {
-      case 0:
-        getComponent({
-          selectionMode: 'multiple'
-        });
-        rows = _react2.screen.getAllByRole('row');
-        _context4.next = 4;
-        return _userEvent["default"].tab();
-      case 4:
-        expect(rows[1]).toHaveFocus();
-        expect(rows[1]).not.toHaveClass('is-selected');
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'Enter'
-        });
-        expect(rows[1]).toHaveClass('is-selected');
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'Enter'
-        });
-        expect(rows[1]).not.toHaveClass('is-selected');
-      case 10:
-      case "end":
-        return _context4.stop();
-    }
-  }, _callee4);
-})));
-test('Enter key should toggle selection on focused row with checkboxes', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
-  var rows;
-  return _regeneratorRuntime().wrap(function _callee5$(_context5) {
-    while (1) switch (_context5.prev = _context5.next) {
-      case 0:
-        getComponent({
-          selectionMode: 'multiple'
-        });
-        rows = _react2.screen.getAllByRole('row');
-        _context5.next = 4;
-        return _userEvent["default"].tab();
-      case 4:
-        expect(rows[1]).toHaveFocus();
-        expect(rows[1]).not.toHaveClass('is-selected');
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'Enter'
-        });
-        expect(rows[1]).toHaveClass('is-selected');
-      case 8:
-      case "end":
-        return _context5.stop();
-    }
-  }, _callee5);
-})));
-test('Enter key should not change selection when selectionMode is none', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
-  var rows;
-  return _regeneratorRuntime().wrap(function _callee6$(_context6) {
-    while (1) switch (_context6.prev = _context6.next) {
-      case 0:
-        getComponent();
-        rows = _react2.screen.getAllByRole('row');
-        _context6.next = 4;
-        return _userEvent["default"].tab();
-      case 4:
-        expect(rows[1]).toHaveFocus();
-        expect(rows[1]).not.toHaveClass('is-selected');
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'Enter'
-        });
-        expect(rows[1]).not.toHaveClass('is-selected');
-      case 8:
-      case "end":
-        return _context6.stop();
-    }
-  }, _callee6);
-})));
-test('Enter key should toggle a row checkbox when the checkbox input is focused', function () {
-  getComponent({
-    selectionMode: 'multiple'
-  });
-  var rows = _react2.screen.getAllByRole('row');
-  var checkboxes = _react2.screen.getAllByRole('checkbox');
-  expect(rows[1]).not.toHaveClass('is-selected');
-  // focus() triggers React Aria focus state updates and must be wrapped in act
-  (0, _react2.act)(function () {
-    checkboxes[1].focus();
-  });
-  _react2.fireEvent.keyDown(checkboxes[1], {
-    key: 'Enter'
-  });
-  expect(rows[1]).toHaveClass('is-selected');
-  _react2.fireEvent.keyDown(checkboxes[1], {
-    key: 'Enter'
-  });
-  expect(rows[1]).not.toHaveClass('is-selected');
-});
-test('Enter key should toggle select-all checkbox when it is focused', function () {
-  var _context7, _context8;
-  getComponent({
-    selectionMode: 'multiple'
-  });
-  var rows = _react2.screen.getAllByRole('row');
-  var selectAllCheckbox = _react2.screen.getByTestId('select-all-checkbox');
-  (0, _forEach["default"])(_context7 = (0, _slice["default"])(rows).call(rows, 1)).call(_context7, function (row) {
-    return expect(row).not.toHaveClass('is-selected');
-  });
-  (0, _react2.act)(function () {
-    selectAllCheckbox.focus();
-  });
-  _react2.fireEvent.keyDown(selectAllCheckbox, {
-    key: 'Enter'
-  });
-  (0, _forEach["default"])(_context8 = (0, _slice["default"])(rows).call(rows, 1)).call(_context8, function (row) {
-    return expect(row).toHaveClass('is-selected');
-  });
-});
-test('should change select all checkbox on mouse press', function () {
-  getComponent({
-    selectionMode: 'multiple'
-  });
-  var rows = _react2.screen.getAllByRole('row');
-  (0, _forEach["default"])(rows).call(rows, /*#__PURE__*/function () {
-    var _ref7 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee7(element) {
-      return _regeneratorRuntime().wrap(function _callee7$(_context9) {
-        while (1) switch (_context9.prev = _context9.next) {
-          case 0:
-            _context9.next = 2;
-            return _userEvent["default"].click(element);
-          case 2:
-          case "end":
-            return _context9.stop();
-        }
-      }, _callee7);
-    }));
-    return function (_x) {
-      return _ref7.apply(this, arguments);
-    };
-  }());
-  var headerCheckbox = _react2.screen.getByTestId('select-all-checkbox');
-  expect(headerCheckbox).toBeChecked();
-});
-test('should checked checkboxes if selected keys are provided', function () {
-  getComponent({
-    selectionMode: 'multiple',
-    selectedKeys: ['1', '3']
-  });
-  var checkboxes = _react2.screen.getAllByRole('checkbox');
-  var rows = _react2.screen.getAllByRole('row');
-  expect(checkboxes[1]).toBeChecked();
-  expect(rows[1]).toHaveClass('is-selected');
-  expect(checkboxes[2]).not.toBeChecked();
-  expect(rows[2]).not.toHaveClass('is-selected');
-  expect(checkboxes[3]).toBeChecked();
-  expect(rows[3]).toHaveClass('is-selected');
-  var headerCheckbox = _react2.screen.getByTestId('select-all-checkbox');
-  expect(headerCheckbox).toBePartiallyChecked();
-});
-test('tab key should focus on the first cell of the first row', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
-  var rows;
-  return _regeneratorRuntime().wrap(function _callee8$(_context0) {
-    while (1) switch (_context0.prev = _context0.next) {
-      case 0:
-        getComponent();
-        rows = _react2.screen.getAllByRole('row');
-        _context0.next = 4;
-        return _userEvent["default"].tab();
-      case 4:
-        expect(rows[1]).toHaveFocus();
-      case 5:
-      case "end":
-        return _context0.stop();
-    }
-  }, _callee8);
-})));
-test('Arrow Down key should focus the next row', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee9() {
-  var rows;
-  return _regeneratorRuntime().wrap(function _callee9$(_context1) {
-    while (1) switch (_context1.prev = _context1.next) {
-      case 0:
-        getComponent();
-        rows = _react2.screen.getAllByRole('row');
-        _context1.next = 4;
-        return _userEvent["default"].tab();
-      case 4:
-        expect(rows[1]).toHaveFocus();
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'ArrowDown'
-        });
-        _react2.fireEvent.keyUp(rows[1], {
-          key: 'ArrowDown'
-        });
-        expect(rows[2]).toHaveFocus();
-        _react2.fireEvent.keyDown(rows[2], {
-          key: 'ArrowDown'
-        });
-        _react2.fireEvent.keyUp(rows[2], {
-          key: 'ArrowDown'
-        });
-        expect(rows[3]).toHaveFocus();
-      case 11:
-      case "end":
-        return _context1.stop();
-    }
-  }, _callee9);
-})));
-test('Arrow Up key should focus the next row', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee0() {
-  var rows, columnheader, headerButton;
-  return _regeneratorRuntime().wrap(function _callee0$(_context10) {
-    while (1) switch (_context10.prev = _context10.next) {
-      case 0:
-        getComponent();
-        rows = _react2.screen.getAllByRole('row');
-        _context10.next = 4;
-        return _userEvent["default"].tab();
-      case 4:
-        expect(rows[1]).toHaveFocus();
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'ArrowUp'
-        });
-        _react2.fireEvent.keyUp(rows[1], {
-          key: 'ArrowUp'
-        });
-
-        // Column header content is rendered inside a focusable button, so focus
-        // moves into that child (focusMode: 'child') rather than the <th> itself.
-        columnheader = _react2.screen.getAllByRole('columnheader');
-        headerButton = (0, _react2.within)(columnheader[0]).getByRole('button');
-        expect(headerButton).toHaveFocus();
-        expect(columnheader[0]).toHaveClass('is-focused');
-      case 11:
-      case "end":
-        return _context10.stop();
-    }
-  }, _callee0);
-})));
-test('Arrow Right move the focus to next cell', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee1() {
-  var rows, firstRow, tableCells;
-  return _regeneratorRuntime().wrap(function _callee1$(_context11) {
-    while (1) switch (_context11.prev = _context11.next) {
-      case 0:
-        getComponent();
-        rows = _react2.screen.getAllByRole('row');
-        firstRow = _react2.screen.getAllByRole('row')[1];
-        tableCells = firstRow.querySelectorAll('td');
-        _context11.next = 6;
-        return _userEvent["default"].tab();
-      case 6:
-        expect(rows[1]).toHaveFocus();
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'ArrowRight'
-        });
-        _react2.fireEvent.keyUp(rows[1], {
-          key: 'ArrowRight'
-        });
-        expect(tableCells[0]).toHaveFocus();
-        _react2.fireEvent.keyDown(tableCells[0], {
-          key: 'ArrowRight'
-        });
-        _react2.fireEvent.keyUp(tableCells[0], {
-          key: 'ArrowRight'
-        });
-        expect(tableCells[1]).toHaveFocus();
-        _react2.fireEvent.keyDown(tableCells[1], {
-          key: 'ArrowRight'
-        });
-        _react2.fireEvent.keyUp(tableCells[1], {
-          key: 'ArrowRight'
-        });
-        expect(tableCells[2]).toHaveFocus();
-        _react2.fireEvent.keyDown(tableCells[2], {
-          key: 'ArrowRight'
-        });
-        _react2.fireEvent.keyUp(tableCells[2], {
-          key: 'ArrowRight'
-        });
-        expect(rows[1]).toHaveFocus();
-      case 19:
-      case "end":
-        return _context11.stop();
-    }
-  }, _callee1);
-})));
-test('Arrow Left move the focus to next cell', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee10() {
-  var rows, firstRow, tableCells;
-  return _regeneratorRuntime().wrap(function _callee10$(_context12) {
-    while (1) switch (_context12.prev = _context12.next) {
-      case 0:
-        getComponent();
-        rows = _react2.screen.getAllByRole('row');
-        firstRow = _react2.screen.getAllByRole('row')[1];
-        tableCells = firstRow.querySelectorAll('td');
-        _context12.next = 6;
-        return _userEvent["default"].tab();
-      case 6:
-        expect(rows[1]).toHaveFocus();
-        _react2.fireEvent.keyDown(rows[1], {
-          key: 'ArrowLeft'
-        });
-        _react2.fireEvent.keyUp(rows[1], {
-          key: 'ArrowLeft'
-        });
-        expect(tableCells[2]).toHaveFocus();
-        _react2.fireEvent.keyDown(tableCells[2], {
-          key: 'ArrowLeft'
-        });
-        _react2.fireEvent.keyUp(tableCells[2], {
-          key: 'ArrowLeft'
-        });
-        expect(tableCells[1]).toHaveFocus();
-        _react2.fireEvent.keyDown(tableCells[1], {
-          key: 'ArrowLeft'
-        });
-        _react2.fireEvent.keyUp(tableCells[1], {
-          key: 'ArrowLeft'
-        });
-        expect(tableCells[0]).toHaveFocus();
-        _react2.fireEvent.keyDown(tableCells[0], {
-          key: 'ArrowLeft'
-        });
-        _react2.fireEvent.keyUp(tableCells[0], {
-          key: 'ArrowLeft'
-        });
-        expect(rows[1]).toHaveFocus();
-      case 19:
-      case "end":
-        return _context12.stop();
-    }
-  }, _callee10);
-})));
-var renderWithLoadingState = function renderWithLoadingState(loadingState) {
-  return (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], {
-    "aria-label": "table",
-    loadingState: loadingState
-  }, (0, _react3.jsx)(_index.THead, {
-    columns: headers
-  }, function (head) {
-    return (0, _react3.jsx)(_index.Column, {
-      key: head.key
-    }, head.name);
-  }), (0, _react3.jsx)(_index.TBody, {
-    items: []
-  }, function () {
-    return (0, _react3.jsx)(_index.Row, null, (0, _react3.jsx)(_index.Cell, null, "A"), (0, _react3.jsx)(_index.Cell, null, "B"), (0, _react3.jsx)(_index.Cell, null, "C"));
-  })));
-};
-describe('Loading state', function () {
-  test('renders Loader when loadingState is "loading"', function () {
-    renderWithLoadingState('loading');
-    expect(_react2.screen.getByRole('alert')).toBeInTheDocument();
-  });
-  test('renders Loader when loadingState is "sorting"', function () {
-    renderWithLoadingState('sorting');
-    expect(_react2.screen.getByRole('alert')).toBeInTheDocument();
-  });
-  test('does not render Loader when loadingState is absent', function () {
-    renderWithLoadingState();
-    expect(_react2.screen.queryByRole('alert')).not.toBeInTheDocument();
-  });
-  test('does not render Loader when loadingState is "loadingMore", renders empty state instead (Constraint #6)', function () {
-    renderWithLoadingState('loadingMore');
-    expect(_react2.screen.queryByRole('alert')).not.toBeInTheDocument();
-    expect(_react2.screen.getByText('No items exist')).toBeInTheDocument();
-  });
-});
-describe('Empty state', function () {
-  test('renders default empty state when items is empty and no loadingState', function () {
-    (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], {
-      "aria-label": "table"
-    }, (0, _react3.jsx)(_index.THead, {
-      columns: headers
-    }, function (head) {
-      return (0, _react3.jsx)(_index.Column, {
-        key: head.key
-      }, head.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: []
-    }, function () {
-      return (0, _react3.jsx)(_index.Row, null, (0, _react3.jsx)(_index.Cell, null), (0, _react3.jsx)(_index.Cell, null), (0, _react3.jsx)(_index.Cell, null));
-    })));
-    expect(_react2.screen.getByText('No items exist')).toBeInTheDocument();
-  });
-  test('renders custom renderEmptyState and not default empty state', function () {
-    (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], {
-      "aria-label": "table",
-      renderEmptyState: function renderEmptyState() {
-        return (0, _react3.jsx)("div", null, "Custom");
-      }
-    }, (0, _react3.jsx)(_index.THead, {
-      columns: headers
-    }, function (head) {
-      return (0, _react3.jsx)(_index.Column, {
-        key: head.key
-      }, head.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: []
-    }, function () {
-      return (0, _react3.jsx)(_index.Row, null, (0, _react3.jsx)(_index.Cell, null), (0, _react3.jsx)(_index.Cell, null), (0, _react3.jsx)(_index.Cell, null));
-    })));
-    expect(_react2.screen.getByText('Custom')).toBeInTheDocument();
-    expect(_react2.screen.queryByText('No items exist')).not.toBeInTheDocument();
-  });
-  test('renders Loader and not empty state when loadingState is "loading" and items is empty', function () {
-    (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], {
-      "aria-label": "table",
-      loadingState: "loading",
-      renderEmptyState: function renderEmptyState() {
-        return (0, _react3.jsx)("div", null, "Custom");
-      }
-    }, (0, _react3.jsx)(_index.THead, {
-      columns: headers
-    }, function (head) {
-      return (0, _react3.jsx)(_index.Column, {
-        key: head.key
-      }, head.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: []
-    }, function () {
-      return (0, _react3.jsx)(_index.Row, null, (0, _react3.jsx)(_index.Cell, null), (0, _react3.jsx)(_index.Cell, null), (0, _react3.jsx)(_index.Cell, null));
-    })));
-    expect(_react2.screen.getByRole('alert')).toBeInTheDocument();
-    expect(_react2.screen.queryByText('Custom')).not.toBeInTheDocument();
-    expect(_react2.screen.queryByText('No items exist')).not.toBeInTheDocument();
-  });
-});
-describe('Resizable columns', function () {
-  var resizableHeaders = [{
-    key: 'name',
-    name: 'Name'
-  }, {
-    key: 'value',
-    name: 'Value'
-  }];
-  var resizableObjects = [{
-    key: '1',
-    name: 'Alpha',
-    value: '10'
-  }, {
-    key: '2',
-    name: 'Beta',
-    value: '20'
-  }];
-  test('renders resize slider input for a resizable column', function () {
-    (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], {
-      "aria-label": "resizable table"
-    }, (0, _react3.jsx)(_index.THead, {
-      columns: resizableHeaders
-    }, function (head) {
-      return (0, _react3.jsx)(_index.Column, {
-        key: head.key,
-        allowsResizing: true
-      }, head.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: resizableObjects
-    }, function (row) {
-      return (0, _react3.jsx)(_index.Row, {
-        key: row.key
-      }, function (columnKey) {
-        return (0, _react3.jsx)(_index.Cell, null, row[columnKey]);
-      });
-    })));
-
-    // Each resizable column renders a visually-hidden <input type="range">
-    // accessible as role="slider" with an aria-label containing the column name
-    var slider = _react2.screen.getByRole('slider', {
-      name: /Name column width/i
-    });
-    expect(slider).toBeInTheDocument();
-    expect(_react2.screen.getByRole('slider', {
-      name: /Value column width/i
-    })).toBeInTheDocument();
-  });
-  test('resizable table has no accessibility violations', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee11() {
-    var _render, container, results;
-    return _regeneratorRuntime().wrap(function _callee11$(_context13) {
-      while (1) switch (_context13.prev = _context13.next) {
-        case 0:
-          jest.useRealTimers();
-          _render = (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], {
-            "aria-label": "resizable table"
-          }, (0, _react3.jsx)(_index.THead, {
-            columns: resizableHeaders
-          }, function (head) {
-            return (0, _react3.jsx)(_index.Column, {
-              key: head.key,
-              allowsResizing: true
-            }, head.name);
-          }), (0, _react3.jsx)(_index.TBody, {
-            items: resizableObjects
-          }, function (row) {
-            return (0, _react3.jsx)(_index.Row, {
-              key: row.key
-            }, function (columnKey) {
-              return (0, _react3.jsx)(_index.Cell, null, row[columnKey]);
-            });
-          }))), container = _render.container;
-          _context13.next = 4;
-          return (0, _jestAxe.axe)(container);
-        case 4:
-          results = _context13.sent;
-          jest.useFakeTimers();
-          expect(results).toHaveNoViolations();
-        case 7:
-        case "end":
-          return _context13.stop();
-      }
-    }, _callee11);
-  })));
-  test('does not render resize slider input for a non-resizable column', function () {
-    (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], {
-      "aria-label": "non-resizable table"
-    }, (0, _react3.jsx)(_index.THead, {
-      columns: resizableHeaders
-    }, function (head) {
-      return (0, _react3.jsx)(_index.Column, {
-        key: head.key
-      }, head.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: resizableObjects
-    }, function (row) {
-      return (0, _react3.jsx)(_index.Row, {
-        key: row.key
-      }, function (columnKey) {
-        return (0, _react3.jsx)(_index.Cell, null, row[columnKey]);
-      });
-    })));
-    expect(_react2.screen.queryByRole('slider')).not.toBeInTheDocument();
-  });
-  describe('keyboard resizing', function () {
-    var getResizableWithCallbacks = function getResizableWithCallbacks() {
-      var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      return (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], (0, _extends2["default"])({
-        "aria-label": "resizable table"
-      }, props), (0, _react3.jsx)(_index.THead, {
-        columns: resizableHeaders
-      }, function (head) {
-        return (0, _react3.jsx)(_index.Column, {
-          key: head.key,
-          allowsResizing: true
-        }, head.name);
-      }), (0, _react3.jsx)(_index.TBody, {
-        items: resizableObjects
-      }, function (row) {
-        return (0, _react3.jsx)(_index.Row, {
-          key: row.key
-        }, function (columnKey) {
-          return (0, _react3.jsx)(_index.Cell, null, row[columnKey]);
-        });
-      })));
-    };
-    test('Enter on resizer input starts resize and calls onResizeStart', function () {
-      var onResizeStart = jest.fn();
-      getResizableWithCallbacks({
-        onResizeStart: onResizeStart
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      expect(onResizeStart).toHaveBeenCalledTimes(1);
-    });
-    test('ArrowRight during active resize calls onResize', function () {
-      var onResize = jest.fn();
-      getResizableWithCallbacks({
-        onResize: onResize
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'ArrowRight'
-      });
-      expect(onResize).toHaveBeenCalledTimes(1);
-    });
-    test('ArrowLeft during active resize calls onResize', function () {
-      var onResize = jest.fn();
-      getResizableWithCallbacks({
-        onResize: onResize
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'ArrowLeft'
-      });
-      expect(onResize).toHaveBeenCalledTimes(1);
-    });
-    test('multiple ArrowRight presses each call onResize', function () {
-      var onResize = jest.fn();
-      getResizableWithCallbacks({
-        onResize: onResize
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'ArrowRight'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'ArrowRight'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'ArrowRight'
-      });
-      expect(onResize).toHaveBeenCalledTimes(3);
-    });
-    test('Escape ends resize and calls onResizeEnd', function () {
-      var onResizeEnd = jest.fn();
-      getResizableWithCallbacks({
-        onResizeEnd: onResizeEnd
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Escape'
-      });
-      expect(onResizeEnd).toHaveBeenCalledTimes(1);
-    });
-    test('Space ends resize and calls onResizeEnd', function () {
-      var onResizeEnd = jest.fn();
-      getResizableWithCallbacks({
-        onResizeEnd: onResizeEnd
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: ' '
-      });
-      expect(onResizeEnd).toHaveBeenCalledTimes(1);
-    });
-    test('second Enter ends resize and calls onResizeEnd', function () {
-      var onResizeEnd = jest.fn();
-      getResizableWithCallbacks({
-        onResizeEnd: onResizeEnd
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      expect(onResizeEnd).toHaveBeenCalledTimes(1);
-    });
-    test('ArrowRight before resize starts does not call onResize', function () {
-      var onResize = jest.fn();
-      getResizableWithCallbacks({
-        onResize: onResize
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'ArrowRight'
-      });
-      expect(onResize).not.toHaveBeenCalled();
-    });
-    test('onResize is not called after resize ends', function () {
-      var onResize = jest.fn();
-      getResizableWithCallbacks({
-        onResize: onResize
-      });
-      var slider = _react2.screen.getByRole('slider', {
-        name: /Name column width/i
-      });
-      (0, _react2.act)(function () {
-        slider.focus();
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Enter'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'Escape'
-      });
-      _react2.fireEvent.keyDown(slider, {
-        key: 'ArrowRight'
-      });
-      expect(onResize).not.toHaveBeenCalled();
-    });
-  });
-});
-describe('Sorting and resizing together', function () {
-  var combinedHeaders = [{
-    key: 'name',
-    name: 'Name'
-  }, {
-    key: 'value',
-    name: 'Value'
-  }];
-  var combinedObjects = [{
-    key: '1',
-    name: 'Alpha',
-    value: '10'
-  }, {
-    key: '2',
-    name: 'Beta',
-    value: '20'
-  }];
-  var getCombinedTable = function getCombinedTable() {
-    var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    return (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], (0, _extends2["default"])({
-      "aria-label": "sortable and resizable table"
-    }, props), (0, _react3.jsx)(_index.THead, {
-      columns: combinedHeaders
-    }, function (head) {
-      return (0, _react3.jsx)(_index.Column, {
-        key: head.key,
-        allowsSorting: true,
-        allowsResizing: true
-      }, head.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: combinedObjects
-    }, function (row) {
-      return (0, _react3.jsx)(_index.Row, {
-        key: row.key
-      }, function (columnKey) {
-        return (0, _react3.jsx)(_index.Cell, null, row[columnKey]);
-      });
-    })));
-  };
-  test('renders both the sort button and resize slider for a column that allows both', function () {
-    getCombinedTable();
-    var columnheaders = _react2.screen.getAllByRole('columnheader');
-    var sortButton = (0, _react2.within)(columnheaders[0]).getByRole('button', {
-      name: /Sort by Name/i
-    });
-    expect(sortButton).toBeInTheDocument();
-    var slider = (0, _react2.within)(columnheaders[0]).getByRole('slider', {
-      name: /Name column width/i
-    });
-    expect(slider).toBeInTheDocument();
-  });
-  test('resizable table with sorting has no accessibility violations', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee12() {
-    var _getCombinedTable, container, results;
-    return _regeneratorRuntime().wrap(function _callee12$(_context14) {
-      while (1) switch (_context14.prev = _context14.next) {
-        case 0:
-          jest.useRealTimers();
-          _getCombinedTable = getCombinedTable({
-            sortDescriptor: {
-              column: 'name',
-              direction: 'ascending'
-            }
-          }), container = _getCombinedTable.container;
-          _context14.next = 4;
-          return (0, _jestAxe.axe)(container);
-        case 4:
-          results = _context14.sent;
-          jest.useFakeTimers();
-          expect(results).toHaveNoViolations();
-        case 7:
-        case "end":
-          return _context14.stop();
-      }
-    }, _callee12);
-  })));
-  test('clicking the sort button calls onSortChange without triggering a resize', function () {
-    // TableBase forwards unrecognized props (including onSortChange) onto the
-    // underlying <table> DOM node, which logs a React "unknown prop" warning.
-    // Suppressed here since it's orthogonal to the sort/resize behavior under test.
-    jest.spyOn(console, 'error').mockImplementation();
-    var onSortChange = jest.fn();
-    var onResize = jest.fn();
-    getCombinedTable({
-      onSortChange: onSortChange,
-      onResize: onResize
-    });
-    var columnheaders = _react2.screen.getAllByRole('columnheader');
-    var sortButton = (0, _react2.within)(columnheaders[0]).getByRole('button', {
-      name: /Sort by Name/i
-    });
-    _react2.fireEvent.click(sortButton);
-    expect(onSortChange).toHaveBeenCalledWith({
-      column: 'name',
-      direction: 'ascending'
-    });
-    expect(onResize).not.toHaveBeenCalled();
-  });
-  test('sets aria-sort on a column header that also allows resizing', function () {
-    getCombinedTable({
-      sortDescriptor: {
-        column: 'name',
-        direction: 'ascending'
-      }
-    });
-    var columnheaders = _react2.screen.getAllByRole('columnheader');
-    expect(columnheaders[0]).toHaveAttribute('aria-sort', 'ascending');
-    expect(columnheaders[1]).toHaveAttribute('aria-sort', 'none');
-  });
-  test('resizing via the slider does not call onSortChange', function () {
-    jest.spyOn(console, 'error').mockImplementation();
-    var onSortChange = jest.fn();
-    var onResize = jest.fn();
-    getCombinedTable({
-      onSortChange: onSortChange,
-      onResize: onResize
-    });
-    var columnheaders = _react2.screen.getAllByRole('columnheader');
-    var slider = (0, _react2.within)(columnheaders[0]).getByRole('slider', {
-      name: /Name column width/i
-    });
-    (0, _react2.act)(function () {
-      slider.focus();
-    });
-    _react2.fireEvent.keyDown(slider, {
-      key: 'Enter'
-    });
-    _react2.fireEvent.keyDown(slider, {
-      key: 'ArrowRight'
-    });
-    expect(onResize).toHaveBeenCalledTimes(1);
-    expect(onSortChange).not.toHaveBeenCalled();
-  });
-  test('sort button and resize slider are independently focusable within the same column header', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee13() {
-    var columnheaders, sortButton, slider, rows;
-    return _regeneratorRuntime().wrap(function _callee13$(_context15) {
-      while (1) switch (_context15.prev = _context15.next) {
-        case 0:
-          getCombinedTable();
-          columnheaders = _react2.screen.getAllByRole('columnheader');
-          sortButton = (0, _react2.within)(columnheaders[0]).getByRole('button', {
-            name: /Sort by Name/i
-          });
-          slider = (0, _react2.within)(columnheaders[0]).getByRole('slider', {
-            name: /Name column width/i
-          });
-          rows = _react2.screen.getAllByRole('row'); // Tab into the first body row, then ArrowUp moves focus into the
-          // column header's focusable child (the sort button, per focusMode: 'child').
-          _context15.next = 7;
-          return _userEvent["default"].tab();
-        case 7:
-          expect(rows[1]).toHaveFocus();
-          _react2.fireEvent.keyDown(rows[1], {
-            key: 'ArrowUp'
-          });
-          _react2.fireEvent.keyUp(rows[1], {
-            key: 'ArrowUp'
-          });
-          expect(sortButton).toHaveFocus();
-          _react2.fireEvent.keyDown(columnheaders[0], {
-            key: 'ArrowRight'
-          });
-          _react2.fireEvent.keyUp(columnheaders[0], {
-            key: 'ArrowRight'
-          });
-          expect(slider).toHaveFocus();
-        case 14:
-        case "end":
-          return _context15.stop();
-      }
-    }, _callee13);
-  })));
-  test('resizing a column does not change its sort state', function () {
-    jest.spyOn(console, 'error').mockImplementation();
-    var onSortChange = jest.fn();
-    getCombinedTable({
-      onSortChange: onSortChange,
-      sortDescriptor: {
-        column: 'name',
-        direction: 'ascending'
-      }
-    });
-    var columnheaders = _react2.screen.getAllByRole('columnheader');
-    var slider = (0, _react2.within)(columnheaders[0]).getByRole('slider', {
-      name: /Name column width/i
-    });
-    (0, _react2.act)(function () {
-      slider.focus();
-    });
-    _react2.fireEvent.keyDown(slider, {
-      key: 'Enter'
-    });
-    _react2.fireEvent.keyDown(slider, {
-      key: 'ArrowRight'
-    });
-    _react2.fireEvent.keyDown(slider, {
-      key: 'Escape'
-    });
-    expect(columnheaders[0]).toHaveAttribute('aria-sort', 'ascending');
-    expect(onSortChange).not.toHaveBeenCalled();
-  });
-});
-describe('Sortable Table with useAsyncList', function () {
-  var dataTestId = 'sortableTable';
-  var defaultTableProps = {
-    'aria-label': 'Custom table with sortable content',
-    width: '100%',
-    height: '100%',
-    'data-testid': dataTestId
-  };
-  function load() {
-    return _load.apply(this, arguments);
-  }
-  function _load() {
-    _load = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee22() {
-      return _regeneratorRuntime().wrap(function _callee22$(_context26) {
-        while (1) switch (_context26.prev = _context26.next) {
-          case 0:
-            return _context26.abrupt("return", {
-              items: objects
-            });
-          case 1:
-          case "end":
-            return _context26.stop();
-        }
-      }, _callee22);
-    }));
-    return _load.apply(this, arguments);
-  }
-  function sort(_x2) {
-    return _sort.apply(this, arguments);
-  }
-  function _sort() {
-    _sort = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee23(list) {
-      var _context27;
-      return _regeneratorRuntime().wrap(function _callee23$(_context28) {
-        while (1) switch (_context28.prev = _context28.next) {
-          case 0:
-            // eslint-disable-next-line no-param-reassign
-            list.items = (0, _sort2["default"])(_context27 = list.items).call(_context27, function (a, b) {
-              var first = a[list.sortDescriptor.column];
-              var second = b[list.sortDescriptor.column];
-              var cmp = ((0, _parseInt2["default"])(first) || first) < ((0, _parseInt2["default"])(second) || second) // eslint-disable-line
-              ? -1 : 1;
-              if (list.sortDescriptor.direction === 'descending') {
-                cmp *= -1;
-              }
-              return cmp;
-            });
-            return _context28.abrupt("return", list);
-          case 2:
-          case "end":
-            return _context28.stop();
-        }
-      }, _callee23);
-    }));
-    return _sort.apply(this, arguments);
-  }
-  var sortableDataTable = function sortableDataTable(_ref14) {
-    var result = _ref14.result;
-    return (0, _react2.render)((0, _react3.jsx)(_TableBase["default"], (0, _extends2["default"])({}, defaultTableProps, {
-      sortDescriptor: result.current.sortDescriptor
-    }), (0, _react3.jsx)(_index.THead, {
-      columns: headers
-    }, function (column) {
-      return (0, _react3.jsx)(_index.Column, {
-        allowsSorting: true
-      }, column.name);
-    }), (0, _react3.jsx)(_index.TBody, {
-      items: result.current.items
-    }, function (item) {
-      return (0, _react3.jsx)(_index.Row, null, function (columnKey) {
-        return (0, _react3.jsx)(_index.Cell, null, item[columnKey]);
-      });
-    })));
-  };
-  test('sort by country column A => Z', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee17() {
-    var _renderHook, result, sortableTable, rowgroups, thead, headerCells, tRows;
-    return _regeneratorRuntime().wrap(function _callee17$(_context20) {
-      while (1) switch (_context20.prev = _context20.next) {
-        case 0:
-          _renderHook = (0, _react2.renderHook)(function () {
-            return (0, _reactStately.useAsyncList)({
-              load: load,
-              sort: sort,
-              initialSortDescriptor: {
-                column: 'country',
-                direction: 'ascending'
-              }
-            });
-          }), result = _renderHook.result;
-          _context20.next = 3;
-          return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee14() {
-            return _regeneratorRuntime().wrap(function _callee14$(_context16) {
-              while (1) switch (_context16.prev = _context16.next) {
-                case 0:
-                  jest.runOnlyPendingTimers();
-                case 1:
-                case "end":
-                  return _context16.stop();
-              }
-            }, _callee14);
-          })));
-        case 3:
-          _context20.next = 5;
-          return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee15() {
-            var _context17;
-            return _regeneratorRuntime().wrap(function _callee15$(_context18) {
-              while (1) switch (_context18.prev = _context18.next) {
-                case 0:
-                  (0, _sort2["default"])(_context17 = result.current).call(_context17, {
-                    column: 'country',
-                    direction: 'ascending'
-                  });
-                case 1:
-                case "end":
-                  return _context18.stop();
-              }
-            }, _callee15);
-          })));
-        case 5:
-          _context20.next = 7;
-          return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee16() {
-            return _regeneratorRuntime().wrap(function _callee16$(_context19) {
-              while (1) switch (_context19.prev = _context19.next) {
-                case 0:
-                  jest.runOnlyPendingTimers();
-                case 1:
-                case "end":
-                  return _context19.stop();
-              }
-            }, _callee16);
-          })));
-        case 7:
-          sortableDataTable({
-            result: result
-          });
-          sortableTable = _react2.screen.getByTestId(dataTestId);
-          expect(sortableTable).toBeInTheDocument();
-          expect(sortableTable).toBeVisible();
-          expect(sortableTable).toHaveAttribute('aria-label', 'Custom table with sortable content');
-          expect(sortableTable).toHaveAttribute('data-testid', dataTestId);
-          rowgroups = (0, _react2.within)(sortableTable).getAllByRole('rowgroup'); // verify first header column is sorted a -> z
-          thead = (0, _react2.within)(rowgroups[0]).getByRole('row');
-          headerCells = (0, _react2.within)(thead).getAllByRole('columnheader');
-          expect(headerCells[0]).toHaveTextContent('Country');
-          expect(headerCells[0]).toHaveAttribute('aria-sort', 'ascending');
-          tRows = (0, _react2.within)(rowgroups[1]).getAllByRole('row'); // verify country column is sorted a -> z
-          expect(tRows).toHaveLength(4);
-          expect(tRows[0]).toHaveAttribute('data-key', '2');
-          expect(tRows[0]).toHaveTextContent('Canada');
-          expect(tRows[1]).toHaveAttribute('data-key', '3');
-          expect(tRows[1]).toHaveTextContent('China');
-          expect(tRows[2]).toHaveAttribute('data-key', '4');
-          expect(tRows[2]).toHaveTextContent('France');
-          expect(tRows[3]).toHaveAttribute('data-key', '1');
-          expect(tRows[3]).toHaveTextContent('USA');
-        case 28:
-        case "end":
-          return _context20.stop();
-      }
-    }, _callee17);
-  })));
-  test('sort by country column Z => A', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee21() {
-    var _renderHook2, result, sortableTable, rowgroups, tRows;
-    return _regeneratorRuntime().wrap(function _callee21$(_context25) {
-      while (1) switch (_context25.prev = _context25.next) {
-        case 0:
-          _renderHook2 = (0, _react2.renderHook)(function () {
-            return (0, _reactStately.useAsyncList)({
-              load: load,
-              sort: sort,
-              initialSortDescriptor: {
-                column: 'country',
-                direction: 'descending'
-              }
-            });
-          }), result = _renderHook2.result;
-          _context25.next = 3;
-          return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee18() {
-            return _regeneratorRuntime().wrap(function _callee18$(_context21) {
-              while (1) switch (_context21.prev = _context21.next) {
-                case 0:
-                  jest.runOnlyPendingTimers();
-                case 1:
-                case "end":
-                  return _context21.stop();
-              }
-            }, _callee18);
-          })));
-        case 3:
-          _context25.next = 5;
-          return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee19() {
-            var _context22;
-            return _regeneratorRuntime().wrap(function _callee19$(_context23) {
-              while (1) switch (_context23.prev = _context23.next) {
-                case 0:
-                  (0, _sort2["default"])(_context22 = result.current).call(_context22, {
-                    column: 'country',
-                    direction: 'descending'
-                  });
-                case 1:
-                case "end":
-                  return _context23.stop();
-              }
-            }, _callee19);
-          })));
-        case 5:
-          _context25.next = 7;
-          return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regeneratorRuntime().mark(function _callee20() {
-            return _regeneratorRuntime().wrap(function _callee20$(_context24) {
-              while (1) switch (_context24.prev = _context24.next) {
-                case 0:
-                  jest.runOnlyPendingTimers();
-                case 1:
-                case "end":
-                  return _context24.stop();
-              }
-            }, _callee20);
-          })));
-        case 7:
-          sortableDataTable({
-            result: result
-          });
-          sortableTable = _react2.screen.getByTestId(dataTestId);
-          expect(sortableTable).toBeInTheDocument();
-          expect(sortableTable).toBeVisible();
-          expect(sortableTable).toHaveAttribute('aria-label', 'Custom table with sortable content');
-          expect(sortableTable).toHaveAttribute('data-testid', dataTestId);
-          rowgroups = (0, _react2.within)(sortableTable).getAllByRole('rowgroup');
-          tRows = (0, _react2.within)(rowgroups[1]).getAllByRole('row'); // verify country column is sorted z -> a
-          expect(tRows).toHaveLength(4);
-          expect(tRows[0]).toHaveAttribute('data-key', '1');
-          expect(tRows[0]).toHaveTextContent('USA');
-          expect(tRows[1]).toHaveAttribute('data-key', '4');
-          expect(tRows[1]).toHaveTextContent('France');
-          expect(tRows[2]).toHaveAttribute('data-key', '3');
-          expect(tRows[2]).toHaveTextContent('China');
-          expect(tRows[3]).toHaveAttribute('data-key', '2');
-          expect(tRows[3]).toHaveTextContent('Canada');
-        case 24:
-        case "end":
-          return _context25.stop();
-      }
-    }, _callee21);
-  })));
-});