@pingux/astro 2.238.0-alpha.0 → 2.239.0-alpha.0

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

@@ -1,29 +1,11 @@
 "use strict";
 
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-_Object$defineProperty(exports, "__esModule", {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
-var _set = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set"));
-var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/map"));
-var _setTimeout2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set-timeout"));
-var _map2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _focus = require("@react-aria/focus");
 var _interactions = require("@react-aria/interactions");
@@ -35,36 +17,28 @@ var _ = require("../..");
 var _hooks = require("../../hooks");
 var _TableBaseEmptyState = _interopRequireDefault(require("./TableBaseEmptyState"));
 var _react2 = require("@emotion/react");
-var _excluded = ["children", "items", "renderEmptyState", "loadingState"],
-  _excluded2 = ["caption", "selectionMode", "selectionBehavior", "hasSelectionCheckboxes", "isStickyHeader", "className", "isLastColumnSticky", "loadingState", "renderEmptyState", "onResizeStart", "onResize", "onResizeEnd", "onRowAction"],
-  _excluded3 = ["caption"],
-  _excluded4 = ["type", "children", "className", "isSticky"]; // Strips react-stately collection props that must not reach the DOM tbody element.
-function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context5, _context6; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context5 = ownKeys(Object(t), !0)).call(_context5, function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context6 = ownKeys(Object(t))).call(_context6, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
-var omitTableBodyProps = function omitTableBodyProps(_ref) {
-  var children = _ref.children,
-    items = _ref.items,
-    renderEmptyState = _ref.renderEmptyState,
-    loadingState = _ref.loadingState,
-    rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  return rest;
-};
-var LOADING_STATES = new _set["default"](['loading', 'sorting']);
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+// Strips react-stately collection props that must not reach the DOM tbody element.
+const omitTableBodyProps = ({
+  children,
+  items,
+  renderEmptyState,
+  loadingState,
+  ...rest
+}) => rest;
+const LOADING_STATES = new Set(['loading', 'sorting']);
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-var BoxCell = function BoxCell(props) {
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
-    as: "td",
-    display: "table-cell"
-  }, props));
-};
-function LoadingOrEmptyState(_ref2) {
-  var _renderEmptyState;
-  var loadingState = _ref2.loadingState,
-    collectionSize = _ref2.collectionSize,
-    colSpan = _ref2.colSpan,
-    renderEmptyState = _ref2.renderEmptyState;
+const BoxCell = props => (0, _react2.jsx)(_.Box, (0, _extends2.default)({
+  as: "td",
+  display: "table-cell"
+}, props));
+function LoadingOrEmptyState({
+  loadingState,
+  collectionSize,
+  colSpan,
+  renderEmptyState
+}) {
   if (collectionSize > 0) return null;
   if (loadingState && LOADING_STATES.has(loadingState)) {
     return (0, _react2.jsx)(_.Box, {
@@ -84,89 +58,81 @@ function LoadingOrEmptyState(_ref2) {
     sx: {
       textAlign: 'center'
     }
-  }, (_renderEmptyState = renderEmptyState === null || renderEmptyState === void 0 ? void 0 : renderEmptyState()) !== null && _renderEmptyState !== void 0 ? _renderEmptyState : (0, _react2.jsx)(_TableBaseEmptyState["default"], null)));
+  }, renderEmptyState?.() ?? (0, _react2.jsx)(_TableBaseEmptyState.default, null)));
 }
-var useHandleFocusRef = function useHandleFocusRef(ref) {
-  _react["default"].useEffect(function () {
-    var el = ref.current;
+const useHandleFocusRef = ref => {
+  _react.default.useEffect(() => {
+    const el = ref.current;
     if (!el) return;
-    var handleFocus = function handleFocus() {
-      var container = el.closest('.last-column-sticky');
+    const handleFocus = () => {
+      const container = el.closest('.last-column-sticky');
       if (!container) return;
-      var cellRect = el.getBoundingClientRect();
-      var contRect = container.getBoundingClientRect();
+      const cellRect = el.getBoundingClientRect();
+      const contRect = container.getBoundingClientRect();
       container.scrollLeft = cellRect.left + contRect.width;
     };
     el.addEventListener('focus', handleFocus);
 
     // eslint-disable-next-line consistent-return
-    return function () {
+    return () => {
       el.removeEventListener('focus', handleFocus);
     };
   }, []);
 };
-var TableBase = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var _context, _context3;
-  var caption = props.caption,
-    selectionMode = props.selectionMode,
-    selectionBehavior = props.selectionBehavior,
-    hasSelectionCheckboxes = props.hasSelectionCheckboxes,
-    _props$isStickyHeader = props.isStickyHeader,
-    isStickyHeader = _props$isStickyHeader === void 0 ? false : _props$isStickyHeader,
-    className = props.className,
-    isLastColumnSticky = props.isLastColumnSticky,
-    loadingState = props.loadingState,
-    renderEmptyState = props.renderEmptyState,
-    onResizeStart = props.onResizeStart,
-    onResize = props.onResize,
-    onResizeEnd = props.onResizeEnd,
-    onRowAction = props.onRowAction,
-    others = (0, _objectWithoutProperties2["default"])(props, _excluded2);
-  var tableRef = (0, _hooks.useLocalOrForwardRef)(ref);
-  var headerRef = (0, _react.useRef)(null);
-  var scrollRef = (0, _react.useRef)(null);
-  var bodyRef = (0, _react.useRef)(null);
+const TableBase = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  const {
+    caption,
+    selectionMode,
+    selectionBehavior,
+    hasSelectionCheckboxes,
+    isStickyHeader = false,
+    className,
+    isLastColumnSticky,
+    loadingState,
+    renderEmptyState,
+    onResizeStart,
+    onResize,
+    onResizeEnd,
+    onRowAction,
+    ...others
+  } = props;
+  const tableRef = (0, _hooks.useLocalOrForwardRef)(ref);
+  const headerRef = (0, _react.useRef)(null);
+  const scrollRef = (0, _react.useRef)(null);
+  const bodyRef = (0, _react.useRef)(null);
   // Map of row key -> <tr> DOM element, used to focus the clicked row after onRowAction fires.
-  var rowRefMap = (0, _react.useRef)(new _map["default"]());
+  const rowRefMap = (0, _react.useRef)(new Map());
   // Guard flag: set to true just before onRowAction fires so the subsequent blur
   // event (caused by an OverlayPanel FocusScope stealing focus) does not clear
   // activeRowKey prematurely. Resets to false after the blur handler runs.
-  var actionJustFired = (0, _react.useRef)(false);
-  var _useState = (0, _react.useState)(0),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    tableWidth = _useState2[0],
-    setTableWidth = _useState2[1];
-  var _useState3 = (0, _react.useState)(null),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    activeRowKey = _useState4[0],
-    setActiveRowKey = _useState4[1];
-  var registerRowRef = (0, _react.useCallback)(function (key, el) {
+  const actionJustFired = (0, _react.useRef)(false);
+  const [tableWidth, setTableWidth] = (0, _react.useState)(0);
+  const [activeRowKey, setActiveRowKey] = (0, _react.useState)(null);
+  const registerRowRef = (0, _react.useCallback)((key, el) => {
     if (el) {
       rowRefMap.current.set(key, el);
     } else {
-      rowRefMap.current["delete"](key);
+      rowRefMap.current.delete(key);
     }
   }, []);
-  var wrappedOnRowAction = (0, _react.useCallback)(function (key) {
+  const wrappedOnRowAction = (0, _react.useCallback)(key => {
     // Toggle off if clicking the already-active row
-    setActiveRowKey(function (prev) {
-      return prev === key ? null : key;
-    });
+    setActiveRowKey(prev => prev === key ? null : key);
     // Signal that a row action just fired so handleTableBlur skips the clear.
     // This prevents OverlayPanel's FocusScope autoFocus from triggering a false
     // positive blur that would remove the active-row highlight.
     actionJustFired.current = true;
-    onRowAction === null || onRowAction === void 0 || onRowAction(key);
+    onRowAction?.(key);
     // Move DOM focus to the clicked row's <tr> so React Aria can handle arrow-key
     // navigation from that row after a mouse click.
-    var rowEl = rowRefMap.current.get(key);
+    const rowEl = rowRefMap.current.get(key);
     if (rowEl) {
       rowEl.focus();
     }
     // Reset the guard after the current event loop tick so any FocusScope
     // autoFocus steal (which fires synchronously) is absorbed, but subsequent
     // genuine blur events (Tab away, click outside) are not.
-    (0, _setTimeout2["default"])(function () {
+    setTimeout(() => {
       actionJustFired.current = false;
     }, 0);
   }, [onRowAction]);
@@ -176,74 +142,76 @@ var TableBase = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   // navigation does not leave stale active-row highlights on multiple rows.
   // Skip when actionJustFired is true — that focus event is the programmatic
   // rowEl.focus() inside wrappedOnRowAction, not user navigation.
-  var handleRowFocus = (0, _react.useCallback)(function (key) {
+  const handleRowFocus = (0, _react.useCallback)(key => {
     if (actionJustFired.current) return;
-    setActiveRowKey(function (prev) {
-      return prev !== null && prev !== key ? null : prev;
-    });
+    setActiveRowKey(prev => prev !== null && prev !== key ? null : prev);
   }, []);
 
   // Clear activeRowKey when focus leaves the table entirely.
   // Skip the clear if a row action just fired (e.g. OverlayPanel FocusScope
   // autoFocus stealing focus) — that is not a genuine focus-out.
-  var handleTableBlur = (0, _react.useCallback)(function (e) {
+  const handleTableBlur = (0, _react.useCallback)(e => {
     if (actionJustFired.current) {
       actionJustFired.current = false;
       return;
     }
-    var relatedTarget = e.relatedTarget;
-    var scrollEl = scrollRef.current;
-    var focusMovedOutside = !relatedTarget || !scrollEl || !scrollEl.contains(relatedTarget);
+    const relatedTarget = e.relatedTarget;
+    const scrollEl = scrollRef.current;
+    const focusMovedOutside = !relatedTarget || !scrollEl || !scrollEl.contains(relatedTarget);
     if (focusMovedOutside) {
       setActiveRowKey(null);
     }
   }, []);
-  var state = (0, _table2.useTableState)(_objectSpread(_objectSpread({}, props), {}, {
+  const state = (0, _table2.useTableState)({
+    ...props,
     showSelectionCheckboxes: hasSelectionCheckboxes || selectionMode === 'multiple' && selectionBehavior !== 'replace'
-  }));
-  var collection = state.collection;
-  var _useTable = (0, _table.useTable)(_objectSpread(_objectSpread({}, props), {}, {
-      scrollRef: scrollRef,
-      onRowAction: onRowAction ? wrappedOnRowAction : undefined
-    }), state, tableRef),
-    gridProps = _useTable.gridProps;
-  var getDefaultWidth = (0, _react.useCallback)(function (node) {
+  });
+  const {
+    collection
+  } = state;
+  const {
+    gridProps
+  } = (0, _table.useTable)({
+    ...props,
+    scrollRef,
+    onRowAction: onRowAction ? wrappedOnRowAction : undefined
+  }, state, tableRef);
+  const getDefaultWidth = (0, _react.useCallback)(node => {
     if (node.props.isSelectionCell) {
       return 70;
     }
     return undefined;
   }, []);
-  var getDefaultMinWidth = (0, _react.useCallback)(function (node) {
+  const getDefaultMinWidth = (0, _react.useCallback)(node => {
     if (node.props.isSelectionCell) {
       return 70;
     }
     return 100;
   }, []);
-  var layoutState = (0, _table2.useTableColumnResizeState)({
-    getDefaultWidth: getDefaultWidth,
-    getDefaultMinWidth: getDefaultMinWidth,
-    tableWidth: tableWidth
+  const layoutState = (0, _table2.useTableColumnResizeState)({
+    getDefaultWidth,
+    getDefaultMinWidth,
+    tableWidth
   }, state);
-  (0, _react.useLayoutEffect)(function () {
+  (0, _react.useLayoutEffect)(() => {
     if (tableRef && tableRef.current) {
       setTableWidth(tableRef.current.clientWidth);
     }
   }, [tableRef]);
   (0, _utils.useResizeObserver)({
     ref: tableRef,
-    onResize: function onResize() {
-      return setTableWidth(tableRef.current.clientWidth);
-    }
+    onResize: () => setTableWidth(tableRef.current.clientWidth)
+  });
+  const {
+    classNames
+  } = (0, _hooks.useStatusClasses)(className, {
+    'has-caption': !!caption,
+    'is-last-column-sticky': isLastColumnSticky
   });
-  var _useStatusClasses = (0, _hooks.useStatusClasses)(className, {
-      'has-caption': !!caption,
-      'is-last-column-sticky': isLastColumnSticky
-    }),
-    classNames = _useStatusClasses.classNames;
   return (0, _react2.jsx)(_.Box, {
     ref: scrollRef,
     onBlur: handleTableBlur
-  }, (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  }, (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "table",
     display: "table",
     variant: "tableBase.container",
@@ -255,29 +223,24 @@ var TableBase = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     ref: headerRef,
     type: "thead",
     isSticky: isStickyHeader
-  }, (0, _map2["default"])(_context = collection.headerRows).call(_context, function (headerRow) {
-    var _context2;
-    return (0, _react2.jsx)(TableHeaderRow, {
-      key: headerRow.key,
-      item: headerRow,
-      state: state
-    }, (0, _map2["default"])(_context2 = (0, _from["default"])(headerRow.childNodes)).call(_context2, function (column) {
-      return column.props.isSelectionCell ? (0, _react2.jsx)(TableSelectAllCell, {
-        key: column.key,
-        column: column,
-        state: state,
-        layoutState: layoutState
-      }) : (0, _react2.jsx)(TableColumnHeader, {
-        key: column.key,
-        column: column,
-        state: state,
-        layoutState: layoutState,
-        onResizeStart: onResizeStart,
-        onResize: onResize,
-        onResizeEnd: onResizeEnd
-      });
-    }));
-  })), (0, _react2.jsx)(TableRowGroup, (0, _extends2["default"])({
+  }, collection.headerRows.map(headerRow => (0, _react2.jsx)(TableHeaderRow, {
+    key: headerRow.key,
+    item: headerRow,
+    state: state
+  }, Array.from(headerRow.childNodes).map(column => column.props.isSelectionCell ? (0, _react2.jsx)(TableSelectAllCell, {
+    key: column.key,
+    column: column,
+    state: state,
+    layoutState: layoutState
+  }) : (0, _react2.jsx)(TableColumnHeader, {
+    key: column.key,
+    column: column,
+    state: state,
+    layoutState: layoutState,
+    onResizeStart: onResizeStart,
+    onResize: onResize,
+    onResizeEnd: onResizeEnd
+  }))))), (0, _react2.jsx)(TableRowGroup, (0, _extends2.default)({
     ref: bodyRef,
     type: "tbody"
   }, omitTableBodyProps(collection.body.props)), (0, _react2.jsx)(LoadingOrEmptyState, {
@@ -285,40 +248,37 @@ var TableBase = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     collectionSize: collection.size,
     colSpan: collection.columns.length,
     renderEmptyState: renderEmptyState
-  }), (0, _map2["default"])(_context3 = (0, _from["default"])(collection.body.childNodes)).call(_context3, function (row) {
-    var _context4, _collection$getChildr, _collection$getChildr2;
-    return (0, _react2.jsx)(TableRow, {
-      key: row.key,
-      item: row,
-      state: state,
-      hasSelectionCheckboxes: hasSelectionCheckboxes,
-      hasActions: !!onRowAction,
-      isActiveRow: row.key === activeRowKey,
-      registerRef: registerRowRef,
-      onRowFocus: handleRowFocus
-    }, (0, _map2["default"])(_context4 = (0, _from["default"])((_collection$getChildr = (_collection$getChildr2 = collection.getChildren) === null || _collection$getChildr2 === void 0 ? void 0 : _collection$getChildr2.call(collection, row.key)) !== null && _collection$getChildr !== void 0 ? _collection$getChildr : [])).call(_context4, function (cell) {
-      return cell.props.isSelectionCell ? (0, _react2.jsx)(TableCheckboxCell, {
-        key: cell.key,
-        cell: cell,
-        state: state,
-        layoutState: layoutState
-      }) : (0, _react2.jsx)(TableCell, {
-        key: cell.key,
-        cell: cell,
-        state: state,
-        layoutState: layoutState,
-        hasActions: !!onRowAction
-      });
-    }));
-  }))));
+  }), Array.from(collection.body.childNodes).map(row => (0, _react2.jsx)(TableRow, {
+    key: row.key,
+    item: row,
+    state: state,
+    hasSelectionCheckboxes: hasSelectionCheckboxes,
+    hasActions: !!onRowAction,
+    isActiveRow: row.key === activeRowKey,
+    registerRef: registerRowRef,
+    onRowFocus: handleRowFocus
+  }, Array.from(collection.getChildren?.(row.key) ?? []).map(cell => cell.props.isSelectionCell ? (0, _react2.jsx)(TableCheckboxCell, {
+    key: cell.key,
+    cell: cell,
+    state: state,
+    layoutState: layoutState
+  }) : (0, _react2.jsx)(TableCell, {
+    key: cell.key,
+    cell: cell,
+    state: state,
+    layoutState: layoutState,
+    hasActions: !!onRowAction
+  })))))));
 });
-var TableCaption = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var caption = props.caption,
-    others = (0, _objectWithoutProperties2["default"])(props, _excluded3);
+const TableCaption = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  const {
+    caption,
+    ...others
+  } = props;
   if (!caption) {
     return null;
   }
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "caption",
     display: "table-caption",
     ref: ref,
@@ -326,37 +286,44 @@ var TableCaption = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     textAlign: "left"
   }, others), caption);
 });
-var TableRowGroup = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var type = props.type,
-    children = props.children,
-    className = props.className,
-    isSticky = props.isSticky,
-    others = (0, _objectWithoutProperties2["default"])(props, _excluded4);
-  var _useTableRowGroup = (0, _table.useTableRowGroup)(),
-    rowGroupProps = _useTableRowGroup.rowGroupProps;
-  var _useStatusClasses2 = (0, _hooks.useStatusClasses)(className, {
-      isSticky: isSticky && type === 'thead'
-    }),
-    classNames = _useStatusClasses2.classNames;
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+const TableRowGroup = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  const {
+    type,
+    children,
+    className,
+    isSticky,
+    ...others
+  } = props;
+  const {
+    rowGroupProps
+  } = (0, _table.useTableRowGroup)();
+  const {
+    classNames
+  } = (0, _hooks.useStatusClasses)(className, {
+    isSticky: isSticky && type === 'thead'
+  });
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: type,
     display: type === 'thead' ? 'table-header-group' : 'table-row-group',
     ref: ref,
     className: classNames,
-    variant: "tableBase.".concat(type),
+    variant: `tableBase.${type}`,
     tabIndex: "0"
   }, rowGroupProps, others), children);
 });
 function TableHeaderRow(props) {
-  var item = props.item,
-    state = props.state,
-    children = props.children;
-  var ref = (0, _react.useRef)(null);
-  var _useTableHeaderRow = (0, _table.useTableHeaderRow)({
-      node: item
-    }, state, ref),
-    rowProps = _useTableHeaderRow.rowProps;
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  const {
+    item,
+    state,
+    children
+  } = props;
+  const ref = (0, _react.useRef)(null);
+  const {
+    rowProps
+  } = (0, _table.useTableHeaderRow)({
+    node: item
+  }, state, ref);
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "tr",
     display: "table-row"
   }, rowProps, {
@@ -364,77 +331,88 @@ function TableHeaderRow(props) {
   }), children);
 }
 function Resizer(props) {
-  var column = props.column,
-    layoutState = props.layoutState,
-    triggerRef = props.triggerRef,
-    onResizeStart = props.onResizeStart,
-    onResize = props.onResize,
-    onResizeEnd = props.onResizeEnd;
-  var ref = (0, _react.useRef)(null);
-  var _useTableColumnResize = (0, _table.useTableColumnResize)({
-      column: column,
-      'aria-label': "".concat(column.textValue, " column width"),
-      triggerRef: triggerRef,
-      onResizeStart: onResizeStart,
-      onResize: onResize,
-      onResizeEnd: onResizeEnd
-    }, layoutState, ref),
-    resizerProps = _useTableColumnResize.resizerProps,
-    inputProps = _useTableColumnResize.inputProps,
-    isResizing = _useTableColumnResize.isResizing;
-  var _useFocusRing = (0, _focus.useFocusRing)(),
-    isFocusVisible = _useFocusRing.isFocusVisible,
-    focusProps = _useFocusRing.focusProps;
+  const {
+    column,
+    layoutState,
+    triggerRef,
+    onResizeStart,
+    onResize,
+    onResizeEnd
+  } = props;
+  const ref = (0, _react.useRef)(null);
+  const {
+    resizerProps,
+    inputProps,
+    isResizing
+  } = (0, _table.useTableColumnResize)({
+    column,
+    'aria-label': `${column.textValue} column width`,
+    triggerRef,
+    onResizeStart,
+    onResize,
+    onResizeEnd
+  }, layoutState, ref);
+  const {
+    isFocusVisible,
+    focusProps
+  } = (0, _focus.useFocusRing)();
 
   // The input must be nested inside the Box that carries resizerProps so that
   // keyboard events fired on the input (Enter to start resize, Escape/Tab to
   // end it) bubble up to the element with the keyboard handlers.
 
-  var _useStatusClasses3 = (0, _hooks.useStatusClasses)('resizer', {
-      isFocused: isFocusVisible,
-      isResizing: isResizing
-    }),
-    classNames = _useStatusClasses3.classNames;
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  const {
+    classNames
+  } = (0, _hooks.useStatusClasses)('resizer', {
+    isFocused: isFocusVisible,
+    isResizing
+  });
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     role: "presentation",
     variant: "tableBase.resizer",
     className: classNames
-  }, resizerProps), (0, _react2.jsx)("input", (0, _extends2["default"])({
+  }, resizerProps), (0, _react2.jsx)("input", (0, _extends2.default)({
     ref: ref
   }, (0, _utils.mergeProps)(inputProps, focusProps))));
 }
 function TableColumnHeader(props) {
-  var _column$props, _column$props2;
-  var column = props.column,
-    state = props.state,
-    className = props.className,
-    layoutState = props.layoutState,
-    onResizeStart = props.onResizeStart,
-    onResize = props.onResize,
-    onResizeEnd = props.onResizeEnd;
-  var ref = (0, _react.useRef)(null);
-  var _useTableColumnHeader = (0, _table.useTableColumnHeader)({
-      node: column
-    }, state, ref),
-    columnHeaderProps = _useTableColumnHeader.columnHeaderProps;
+  const {
+    column,
+    state,
+    className,
+    layoutState,
+    onResizeStart,
+    onResize,
+    onResizeEnd
+  } = props;
+  const ref = (0, _react.useRef)(null);
+  const {
+    columnHeaderProps
+  } = (0, _table.useTableColumnHeader)({
+    node: column
+  }, state, ref);
 
   // within: true catches keyboard focus on the resizer <input> child so the
   // <th> shows its focus ring even when the child is the active element.
-  var _useFocusRing2 = (0, _focus.useFocusRing)({
-      within: true
-    }),
-    isFocusVisible = _useFocusRing2.isFocusVisible,
-    focusProps = _useFocusRing2.focusProps;
-  var allowsSorting = (_column$props = column.props) === null || _column$props === void 0 ? void 0 : _column$props.allowsSorting;
-  var allowsResizing = (_column$props2 = column.props) === null || _column$props2 === void 0 ? void 0 : _column$props2.allowsResizing;
-  var _useGetTheme = (0, _hooks.useGetTheme)(),
-    icons = _useGetTheme.icons;
-  var Ascending = icons.Ascending,
-    Descending = icons.Descending;
-  var sortDescriptor = state.sortDescriptor;
-  var isSortedAscending = (sortDescriptor === null || sortDescriptor === void 0 ? void 0 : sortDescriptor.column) === column.key && (sortDescriptor === null || sortDescriptor === void 0 ? void 0 : sortDescriptor.direction) === 'ascending';
-  var arrowIcon = isSortedAscending ? Ascending : Descending;
-  var sortIcon = (0, _react2.jsx)(_.Icon, {
+  const {
+    isFocusVisible,
+    focusProps
+  } = (0, _focus.useFocusRing)({
+    within: true
+  });
+  const allowsSorting = column.props?.allowsSorting;
+  const allowsResizing = column.props?.allowsResizing;
+  const {
+    icons
+  } = (0, _hooks.useGetTheme)();
+  const {
+    Ascending,
+    Descending
+  } = icons;
+  const sortDescriptor = state.sortDescriptor;
+  const isSortedAscending = sortDescriptor?.column === column.key && sortDescriptor?.direction === 'ascending';
+  const arrowIcon = isSortedAscending ? Ascending : Descending;
+  const sortIcon = (0, _react2.jsx)(_.Icon, {
     icon: arrowIcon,
     size: "xs",
     "aria-hidden": "true",
@@ -442,29 +420,31 @@ function TableColumnHeader(props) {
       name: isSortedAscending ? 'Sort ascending' : 'Sort descending'
     }
   });
-  var _useStatusClasses4 = (0, _hooks.useStatusClasses)(className, {
-      isFocused: isFocusVisible
-    }),
-    classNames = _useStatusClasses4.classNames;
+  const {
+    classNames
+  } = (0, _hooks.useStatusClasses)(className, {
+    isFocused: isFocusVisible
+  });
   useHandleFocusRef(ref);
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "th",
     display: "table-cell",
     ref: ref,
     variant: "tableBase.head",
     className: classNames,
-    sx: _objectSpread({
-      width: layoutState === null || layoutState === void 0 ? void 0 : layoutState.getColumnWidth(column.key),
-      position: 'relative'
-    }, column.props.sx)
-  }, (0, _utils.mergeProps)(columnHeaderProps, column.props)), (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+    sx: {
+      width: layoutState?.getColumnWidth(column.key),
+      position: 'relative',
+      ...column.props.sx
+    }
+  }, (0, _utils.mergeProps)(columnHeaderProps, column.props)), (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "button",
     type: "button",
     isRow: true,
     gap: "sm",
     alignItems: "center",
     variant: "tableBase.sortButton",
-    "aria-label": "Sort by ".concat(column.textValue)
+    "aria-label": `Sort by ${column.textValue}`
   }, (0, _utils.mergeProps)(focusProps)), (0, _react2.jsx)(_.Text, {
     as: "h4",
     variant: "headText"
@@ -477,71 +457,78 @@ function TableColumnHeader(props) {
   }));
 }
 function TableRow(props) {
-  var item = props.item,
-    state = props.state,
-    children = props.children,
-    className = props.className,
-    hasSelectionCheckboxes = props.hasSelectionCheckboxes,
-    hasActions = props.hasActions,
-    isActiveRow = props.isActiveRow,
-    registerRef = props.registerRef,
-    onRowFocus = props.onRowFocus;
-  var ref = (0, _react.useRef)(null);
+  const {
+    item,
+    state,
+    children,
+    className,
+    hasSelectionCheckboxes,
+    hasActions,
+    isActiveRow,
+    registerRef,
+    onRowFocus
+  } = props;
+  const ref = (0, _react.useRef)(null);
 
   // Register this row's DOM element so wrappedOnRowAction can focus it programmatically.
-  var setRef = (0, _react.useCallback)(function (el) {
+  const setRef = (0, _react.useCallback)(el => {
     ref.current = el;
-    registerRef === null || registerRef === void 0 || registerRef(item.key, el);
+    registerRef?.(item.key, el);
   }, [item.key, registerRef]);
-  var _useTableRow = (0, _table.useTableRow)({
-      node: item
-    }, state, ref),
-    rowProps = _useTableRow.rowProps;
-  var isSelected = state.selectionManager.isSelected(item.key);
-  var isDisabled = state.disabledKeys.has(item.key);
-  var _useFocusRing3 = (0, _focus.useFocusRing)(),
-    isFocusVisible = _useFocusRing3.isFocusVisible,
-    focusProps = _useFocusRing3.focusProps;
-  var _useHover = (0, _interactions.useHover)({}),
-    hoverProps = _useHover.hoverProps,
-    isHovered = _useHover.isHovered;
+  const {
+    rowProps
+  } = (0, _table.useTableRow)({
+    node: item
+  }, state, ref);
+  const isSelected = state.selectionManager.isSelected(item.key);
+  const isDisabled = state.disabledKeys.has(item.key);
+  const {
+    isFocusVisible,
+    focusProps
+  } = (0, _focus.useFocusRing)();
+  const {
+    hoverProps,
+    isHovered
+  } = (0, _interactions.useHover)({});
 
   // allowTextSelectionOnPress: true prevents the press handler from suppressing
   // native text-selection drags (user-select: none is not applied on pointer down).
   // When hasSelectionCheckboxes is true, isDisabled: true disables the visual
   // isPressed state — selection is handled solely by the checkbox cells.
-  var _usePress = (0, _interactions.usePress)({
-      ref: ref,
-      allowTextSelectionOnPress: true,
-      isDisabled: !!hasSelectionCheckboxes
-    }),
-    pressProps = _usePress.pressProps,
-    isPressed = _usePress.isPressed;
+  const {
+    pressProps,
+    isPressed
+  } = (0, _interactions.usePress)({
+    ref,
+    allowTextSelectionOnPress: true,
+    isDisabled: !!hasSelectionCheckboxes
+  });
 
   // React Aria's useSelectableItem only maps Space to selection (not Enter).
   // Enter is reserved for "action" which is unused here, so we manually toggle
   // selection on Enter to match expected keyboard behavior.
-  var enterKeyProps = (0, _react.useCallback)(function (e) {
+  const enterKeyProps = (0, _react.useCallback)(e => {
     if (e.key !== 'Enter') return;
     if (isDisabled || state.selectionManager.selectionMode === 'none') return;
     e.preventDefault();
     state.selectionManager.toggleSelection(item.key);
   }, [isDisabled, item.key, state.selectionManager]);
-  var rowFocusProps = (0, _react.useCallback)(function (e) {
+  const rowFocusProps = (0, _react.useCallback)(e => {
     if (e.currentTarget === e.target) {
-      onRowFocus === null || onRowFocus === void 0 || onRowFocus(item.key);
+      onRowFocus?.(item.key);
     }
   }, [item.key, onRowFocus]);
-  var _useStatusClasses5 = (0, _hooks.useStatusClasses)(className, {
-      isSelected: isSelected,
-      isHovered: isHovered,
-      isPressed: isPressed,
-      isFocused: isFocusVisible || !!isActiveRow,
-      isDisabled: isDisabled,
-      'has-actions': hasActions
-    }),
-    classNames = _useStatusClasses5.classNames;
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  const {
+    classNames
+  } = (0, _hooks.useStatusClasses)(className, {
+    isSelected,
+    isHovered,
+    isPressed,
+    isFocused: isFocusVisible || !!isActiveRow,
+    isDisabled,
+    'has-actions': hasActions
+  });
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "tr",
     display: "table-row",
     className: classNames,
@@ -554,78 +541,86 @@ function TableRow(props) {
   }), children);
 }
 function TableCell(props) {
-  var cell = props.cell,
-    state = props.state,
-    className = props.className,
-    layoutState = props.layoutState,
-    hasActions = props.hasActions;
-  var ref = (0, _react.useRef)(null);
-  var _useTableCell = (0, _table.useTableCell)({
-      node: cell
-    }, state, ref),
-    gridCellProps = _useTableCell.gridCellProps;
-  var _useFocusRing4 = (0, _focus.useFocusRing)(),
-    isFocusVisible = _useFocusRing4.isFocusVisible,
-    focusProps = _useFocusRing4.focusProps;
-  var _useStatusClasses6 = (0, _hooks.useStatusClasses)(className, {
-      isFocused: isFocusVisible
-    }),
-    classNames = _useStatusClasses6.classNames;
+  const {
+    cell,
+    state,
+    className,
+    layoutState,
+    hasActions
+  } = props;
+  const ref = (0, _react.useRef)(null);
+  const {
+    gridCellProps
+  } = (0, _table.useTableCell)({
+    node: cell
+  }, state, ref);
+  const {
+    isFocusVisible,
+    focusProps
+  } = (0, _focus.useFocusRing)();
+  const {
+    classNames
+  } = (0, _hooks.useStatusClasses)(className, {
+    isFocused: isFocusVisible
+  });
   useHandleFocusRef(ref);
 
   // Prevents pointer events reaching the row's press handler, allowing native text-selection drags.
   // Skipped when the table has row actions so that clicks on cells bubble up
   // and trigger onRowAction.
-  var stopPointerPropagation = (0, _react.useCallback)(function (e) {
+  const stopPointerPropagation = (0, _react.useCallback)(e => {
     e.stopPropagation();
   }, []);
-  var pointerBlockers = hasActions ? {} : {
+  const pointerBlockers = hasActions ? {} : {
     onPointerDown: stopPointerPropagation,
     onMouseDown: stopPointerPropagation
   };
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "td",
     display: "table-cell",
     variant: "tableBase.data",
     ref: ref,
     className: classNames,
-    sx: _objectSpread({
-      width: layoutState === null || layoutState === void 0 ? void 0 : layoutState.getColumnWidth(cell.column.key)
-    }, cell.props.sx)
+    sx: {
+      width: layoutState?.getColumnWidth(cell.column.key),
+      ...cell.props.sx
+    }
   }, (0, _utils.mergeProps)(pointerBlockers, gridCellProps, focusProps, cell.props)), cell.rendered);
 }
 
 // Native checkboxes only toggle on Space, not Enter. This handler makes Enter
 // behave the same as Space by calling the checkbox's onChange callback.
-var handleCheckboxEnterKey = function handleCheckboxEnterKey(onChange, isSelected) {
-  return function (e) {
-    if (e.key === 'Enter') {
-      e.preventDefault();
-      onChange === null || onChange === void 0 || onChange(!isSelected);
-    }
-  };
+const handleCheckboxEnterKey = (onChange, isSelected) => e => {
+  if (e.key === 'Enter') {
+    e.preventDefault();
+    onChange?.(!isSelected);
+  }
 };
 function TableSelectAllCell(props) {
-  var column = props.column,
-    state = props.state,
-    layoutState = props.layoutState;
-  var ref = (0, _react.useRef)(null);
-  var _useTableColumnHeader2 = (0, _table.useTableColumnHeader)({
-      node: column
-    }, state, ref),
-    columnHeaderProps = _useTableColumnHeader2.columnHeaderProps;
-  var _useTableSelectAllChe = (0, _table.useTableSelectAllCheckbox)(state),
-    checkboxProps = _useTableSelectAllChe.checkboxProps;
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  const {
+    column,
+    state,
+    layoutState
+  } = props;
+  const ref = (0, _react.useRef)(null);
+  const {
+    columnHeaderProps
+  } = (0, _table.useTableColumnHeader)({
+    node: column
+  }, state, ref);
+  const {
+    checkboxProps
+  } = (0, _table.useTableSelectAllCheckbox)(state);
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "th",
     display: "table-cell",
     variant: "tableBase.head",
     sx: {
-      width: layoutState === null || layoutState === void 0 ? void 0 : layoutState.getColumnWidth(column.key)
+      width: layoutState?.getColumnWidth(column.key)
     }
   }, columnHeaderProps, {
     ref: ref
-  }), state.selectionManager.selectionMode === 'single' ? (0, _react2.jsx)(_visuallyHidden.VisuallyHidden, null, checkboxProps['aria-label']) : (0, _react2.jsx)(_.CheckboxField, (0, _extends2["default"])({
+  }), state.selectionManager.selectionMode === 'single' ? (0, _react2.jsx)(_visuallyHidden.VisuallyHidden, null, checkboxProps['aria-label']) : (0, _react2.jsx)(_.CheckboxField, (0, _extends2.default)({
     checkBoxProps: {
       'data-testid': 'select-all-checkbox',
       onKeyDown: handleCheckboxEnterKey(checkboxProps.onChange, checkboxProps.isSelected)
@@ -633,31 +628,36 @@ function TableSelectAllCell(props) {
   }, checkboxProps)));
 }
 function TableCheckboxCell(props) {
-  var cell = props.cell,
-    state = props.state,
-    layoutState = props.layoutState;
-  var ref = (0, _react.useRef)(null);
-  var _useTableCell2 = (0, _table.useTableCell)({
-      node: cell
-    }, state, ref),
-    gridCellProps = _useTableCell2.gridCellProps;
-  var _useTableSelectionChe = (0, _table.useTableSelectionCheckbox)({
-      key: String(cell.parentKey)
-    }, state),
-    checkboxProps = _useTableSelectionChe.checkboxProps;
-  return (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
+  const {
+    cell,
+    state,
+    layoutState
+  } = props;
+  const ref = (0, _react.useRef)(null);
+  const {
+    gridCellProps
+  } = (0, _table.useTableCell)({
+    node: cell
+  }, state, ref);
+  const {
+    checkboxProps
+  } = (0, _table.useTableSelectionCheckbox)({
+    key: String(cell.parentKey)
+  }, state);
+  return (0, _react2.jsx)(_.Box, (0, _extends2.default)({
     as: "td",
     display: "table-cell",
     variant: "tableBase.data",
-    sx: _objectSpread({
-      width: layoutState === null || layoutState === void 0 ? void 0 : layoutState.getColumnWidth(cell.column.key)
-    }, cell.props.sx)
+    sx: {
+      width: layoutState?.getColumnWidth(cell.column.key),
+      ...cell.props.sx
+    }
   }, gridCellProps, {
     ref: ref
-  }), (0, _react2.jsx)(_.CheckboxField, (0, _extends2["default"])({
+  }), (0, _react2.jsx)(_.CheckboxField, (0, _extends2.default)({
     checkBoxProps: {
       onKeyDown: handleCheckboxEnterKey(checkboxProps.onChange, checkboxProps.isSelected)
     }
   }, checkboxProps)));
 }
-var _default = exports["default"] = TableBase;
+var _default = exports.default = TableBase;