@expcat/tigercat-react 1.2.37 → 1.2.41

package/dist/{chunk-MIINT2WV.js → chunk-XUETAIF3.js}

@@ -1,7 +1,19 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
+var _chunk6Z4LLPZAjs = require('./chunk-6Z4LLPZA.js');
+
+
+var _chunkTMON4MPOjs = require('./chunk-TMON4MPO.js');
+
+
 var _chunkTDODFBBOjs = require('./chunk-TDODFBBO.js');
 
+
+var _chunkZRHDNGWOjs = require('./chunk-ZRHDNGWO.js');
+
+
+var _chunkF7H4ALKNjs = require('./chunk-F7H4ALKN.js');
+
 // src/components/Table.tsx
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
 
@@ -21,6 +33,9 @@ var _react = require('react'); var _react2 = _interopRequireDefault(_react);
 
 
 
+
+
+
 
 
 var _tigercatcore = require('@expcat/tigercat-core');
@@ -103,10 +118,13 @@ var LoadingSpinner = () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
 
 
 
+
 function useTableState(input) {
   const {
     columns,
     dataSource,
+    hiddenColumnKeys,
+    defaultHiddenColumnKeys,
     sort,
     defaultSort,
     filters,
@@ -128,6 +146,7 @@ function useTableState(input) {
     onSelectionChange,
     onSortChange,
     onFilterChange,
+    onHiddenColumnsChange,
     onPageChange,
     onExpandChange,
     onCellChange,
@@ -137,6 +156,7 @@ function useTableState(input) {
   } = input;
   const isSortControlled = sort !== void 0;
   const isFiltersControlled = filters !== void 0;
+  const isHiddenColumnsControlled = hiddenColumnKeys !== void 0;
   const paginationConfig = pagination !== false && typeof pagination === "object" ? pagination : null;
   const isCurrentPageControlled = _optionalChain([paginationConfig, 'optionalAccess', _ => _.current]) !== void 0;
   const isPageSizeControlled = _optionalChain([paginationConfig, 'optionalAccess', _2 => _2.pageSize]) !== void 0;
@@ -145,6 +165,9 @@ function useTableState(input) {
   const [uncontrolledSortState, setUncontrolledSortState] = _react.useState.call(void 0, 
     _nullishCoalesce(defaultSort, () => ( { key: null, direction: null }))
   );
+  const [uncontrolledHiddenColumnKeys, setUncontrolledHiddenColumnKeys] = _react.useState.call(void 0, 
+    _nullishCoalesce(_nullishCoalesce(defaultHiddenColumnKeys, () => ( hiddenColumnKeys)), () => ( []))
+  );
   const [uncontrolledFilterState, setUncontrolledFilterState] = _react.useState.call(void 0, 
     _nullishCoalesce(defaultFilters, () => ( {}))
   );
@@ -157,6 +180,7 @@ function useTableState(input) {
   const [uncontrolledSelectedRowKeys, setUncontrolledSelectedRowKeys] = _react.useState.call(void 0, _nullishCoalesce(_nullishCoalesce(_optionalChain([rowSelection, 'optionalAccess', _9 => _9.defaultSelectedRowKeys]), () => ( _optionalChain([rowSelection, 'optionalAccess', _10 => _10.selectedRowKeys]))), () => ( [])));
   const [uncontrolledExpandedRowKeys, setUncontrolledExpandedRowKeys] = _react.useState.call(void 0, _nullishCoalesce(_nullishCoalesce(_optionalChain([expandable, 'optionalAccess', _11 => _11.defaultExpandedRowKeys]), () => ( _optionalChain([expandable, 'optionalAccess', _12 => _12.expandedRowKeys]))), () => ( [])));
   const sortState = isSortControlled ? sort : uncontrolledSortState;
+  const effectiveHiddenColumnKeys = isHiddenColumnsControlled ? hiddenColumnKeys : uncontrolledHiddenColumnKeys;
   const filterState = isFiltersControlled ? filters : uncontrolledFilterState;
   const currentPage = isCurrentPageControlled ? paginationConfig.current : uncontrolledCurrentPage;
   const currentPageSize = isPageSizeControlled ? paginationConfig.pageSize : uncontrolledCurrentPageSize;
@@ -187,6 +211,11 @@ function useTableState(input) {
       setUncontrolledSelectedRowKeys(_nullishCoalesce(_optionalChain([rowSelection, 'optionalAccess', _17 => _17.selectedRowKeys]), () => ( [])));
     }
   }, [isSelectionControlled, _optionalChain([rowSelection, 'optionalAccess', _18 => _18.selectedRowKeys])]);
+  _react.useEffect.call(void 0, () => {
+    if (isHiddenColumnsControlled && hiddenColumnKeys) {
+      setUncontrolledHiddenColumnKeys(hiddenColumnKeys);
+    }
+  }, [isHiddenColumnsControlled, hiddenColumnKeys]);
   _react.useEffect.call(void 0, () => {
     if (isExpandControlled) {
       setUncontrolledExpandedRowKeys(_nullishCoalesce(_optionalChain([expandable, 'optionalAccess', _19 => _19.expandedRowKeys]), () => ( [])));
@@ -194,14 +223,15 @@ function useTableState(input) {
   }, [isExpandControlled, _optionalChain([expandable, 'optionalAccess', _20 => _20.expandedRowKeys])]);
   const [fixedOverrides, setFixedOverrides] = _react.useState.call(void 0, {});
   const displayColumns = _react.useMemo.call(void 0, () => {
-    return columns.map((column) => {
+    const mapped = columns.map((column) => {
       const hasOverride = Object.prototype.hasOwnProperty.call(fixedOverrides, column.key);
       return {
         ...column,
         fixed: hasOverride ? fixedOverrides[column.key] : column.fixed
       };
     });
-  }, [columns, fixedOverrides]);
+    return _tigercatcore.filterHiddenColumns.call(void 0, mapped, effectiveHiddenColumnKeys);
+  }, [columns, fixedOverrides, effectiveHiddenColumnKeys]);
   const totalColumnCount = _react.useMemo.call(void 0, () => {
     let count = displayColumns.length;
     if (rowSelection && rowSelection.showCheckbox !== false) count++;
@@ -219,9 +249,15 @@ function useTableState(input) {
     () => _tigercatcore.getFixedColumnOffsets.call(void 0, displayColumns, measuredColumnWidths),
     [displayColumns, measuredColumnWidths]
   );
+  function handleSetHiddenColumns(hiddenKeys) {
+    if (!isHiddenColumnsControlled) {
+      setUncontrolledHiddenColumnKeys(hiddenKeys);
+    }
+    _optionalChain([onHiddenColumnsChange, 'optionalCall', _21 => _21(hiddenKeys)]);
+  }
   function toggleColumnLock(columnKey) {
     setFixedOverrides((prev) => {
-      const original = _optionalChain([columns, 'access', _21 => _21.find, 'call', _22 => _22((c) => c.key === columnKey), 'optionalAccess', _23 => _23.fixed]);
+      const original = _optionalChain([columns, 'access', _22 => _22.find, 'call', _23 => _23((c) => c.key === columnKey), 'optionalAccess', _24 => _24.fixed]);
       const current = Object.prototype.hasOwnProperty.call(prev, columnKey) ? prev[columnKey] : original;
       const isLocked = current === "left" || current === "right";
       return {
@@ -239,7 +275,7 @@ function useTableState(input) {
     }
     if (sortState.key && sortState.direction) {
       const column = columnByKey[sortState.key];
-      data = _tigercatcore.sortData.call(void 0, data, sortState.key, sortState.direction, _optionalChain([column, 'optionalAccess', _24 => _24.sortFn]));
+      data = _tigercatcore.sortData.call(void 0, data, sortState.key, sortState.direction, _optionalChain([column, 'optionalAccess', _25 => _25.sortFn]));
     }
     return data;
   }, [dataSource, filterState, sortState, columnByKey, filterMode, advancedFilterRules]);
@@ -265,9 +301,20 @@ function useTableState(input) {
     if (pagination === false) {
       return null;
     }
-    const total = _optionalChain([paginationConfig, 'optionalAccess', _25 => _25.total]) !== void 0 && paginationConfig.total > 0 ? paginationConfig.total : processedData.length;
+    const total = _optionalChain([paginationConfig, 'optionalAccess', _26 => _26.total]) !== void 0 && paginationConfig.total > 0 ? paginationConfig.total : processedData.length;
     return _tigercatcore.calculatePagination.call(void 0, total, currentPage, currentPageSize);
-  }, [processedData.length, currentPage, currentPageSize, pagination, _optionalChain([paginationConfig, 'optionalAccess', _26 => _26.total])]);
+  }, [processedData.length, currentPage, currentPageSize, pagination, _optionalChain([paginationConfig, 'optionalAccess', _27 => _27.total])]);
+  function handleSetSort(newSortState) {
+    if (!isSortControlled) {
+      setUncontrolledSortState(newSortState);
+    }
+    _optionalChain([onSortChange, 'optionalCall', _28 => _28(newSortState)]);
+    _optionalChain([onChange, 'optionalCall', _29 => _29({
+      sort: newSortState,
+      filters: filterState,
+      pagination: pagination !== false ? { current: currentPage, pageSize: currentPageSize } : null
+    })]);
+  }
   function handleSort(columnKey) {
     const column = columnByKey[columnKey];
     if (!column || !column.sortable) return;
@@ -279,19 +326,10 @@ function useTableState(input) {
         newDirection = null;
       }
     }
-    const newSortState = {
+    handleSetSort({
       key: newDirection ? columnKey : null,
       direction: newDirection
-    };
-    if (!isSortControlled) {
-      setUncontrolledSortState(newSortState);
-    }
-    _optionalChain([onSortChange, 'optionalCall', _27 => _27(newSortState)]);
-    _optionalChain([onChange, 'optionalCall', _28 => _28({
-      sort: newSortState,
-      filters: filterState,
-      pagination: pagination !== false ? { current: currentPage, pageSize: currentPageSize } : null
-    })]);
+    });
   }
   function handleFilter(columnKey, value) {
     const newFilterState = { ...filterState, [columnKey]: value };
@@ -299,8 +337,8 @@ function useTableState(input) {
       setUncontrolledFilterState(newFilterState);
     }
     setUncontrolledCurrentPage(1);
-    _optionalChain([onFilterChange, 'optionalCall', _29 => _29(newFilterState)]);
-    _optionalChain([onChange, 'optionalCall', _30 => _30({
+    _optionalChain([onFilterChange, 'optionalCall', _30 => _30(newFilterState)]);
+    _optionalChain([onChange, 'optionalCall', _31 => _31({
       sort: sortState,
       filters: newFilterState,
       pagination: pagination !== false ? { current: 1, pageSize: currentPageSize } : null
@@ -308,8 +346,8 @@ function useTableState(input) {
   }
   function handlePageChange(page) {
     setUncontrolledCurrentPage(page);
-    _optionalChain([onPageChange, 'optionalCall', _31 => _31({ current: page, pageSize: currentPageSize })]);
-    _optionalChain([onChange, 'optionalCall', _32 => _32({
+    _optionalChain([onPageChange, 'optionalCall', _32 => _32({ current: page, pageSize: currentPageSize })]);
+    _optionalChain([onChange, 'optionalCall', _33 => _33({
       sort: sortState,
       filters: filterState,
       pagination: { current: page, pageSize: currentPageSize }
@@ -318,8 +356,8 @@ function useTableState(input) {
   function handlePageSizeChange(pageSize) {
     setUncontrolledCurrentPageSize(pageSize);
     setUncontrolledCurrentPage(1);
-    _optionalChain([onPageChange, 'optionalCall', _33 => _33({ current: 1, pageSize })]);
-    _optionalChain([onChange, 'optionalCall', _34 => _34({
+    _optionalChain([onPageChange, 'optionalCall', _34 => _34({ current: 1, pageSize })]);
+    _optionalChain([onChange, 'optionalCall', _35 => _35({
       sort: sortState,
       filters: filterState,
       pagination: { current: 1, pageSize }
@@ -331,12 +369,12 @@ function useTableState(input) {
     if (!isExpandControlled) {
       setUncontrolledExpandedRowKeys(newKeys);
     }
-    _optionalChain([onExpandChange, 'optionalCall', _35 => _35(newKeys, record, !isExpanded)]);
+    _optionalChain([onExpandChange, 'optionalCall', _36 => _36(newKeys, record, !isExpanded)]);
   }
   function handleRowClick(record, index, key) {
-    _optionalChain([onRowClick, 'optionalCall', _36 => _36(record, index)]);
-    if (_optionalChain([expandable, 'optionalAccess', _37 => _37.expandRowByClick])) {
-      const isExpandableRow = _optionalChain([expandable, 'optionalAccess', _38 => _38.rowExpandable]) ? expandable.rowExpandable(record) : true;
+    _optionalChain([onRowClick, 'optionalCall', _37 => _37(record, index)]);
+    if (_optionalChain([expandable, 'optionalAccess', _38 => _38.expandRowByClick])) {
+      const isExpandableRow = _optionalChain([expandable, 'optionalAccess', _39 => _39.rowExpandable]) ? expandable.rowExpandable(record) : true;
       if (isExpandableRow) {
         handleToggleExpand(key, record);
       }
@@ -344,7 +382,7 @@ function useTableState(input) {
   }
   function handleSelectRow(key, checked) {
     let newKeys;
-    if (_optionalChain([rowSelection, 'optionalAccess', _39 => _39.type]) === "radio") {
+    if (_optionalChain([rowSelection, 'optionalAccess', _40 => _40.type]) === "radio") {
       newKeys = checked ? [key] : [];
     } else {
       if (checked) {
@@ -356,7 +394,7 @@ function useTableState(input) {
     if (!isSelectionControlled) {
       setUncontrolledSelectedRowKeys(newKeys);
     }
-    _optionalChain([onSelectionChange, 'optionalCall', _40 => _40(newKeys)]);
+    _optionalChain([onSelectionChange, 'optionalCall', _41 => _41(newKeys)]);
   }
   function handleSelectAll(checked) {
     if (checked) {
@@ -364,12 +402,12 @@ function useTableState(input) {
       if (!isSelectionControlled) {
         setUncontrolledSelectedRowKeys(newKeys);
       }
-      _optionalChain([onSelectionChange, 'optionalCall', _41 => _41(newKeys)]);
+      _optionalChain([onSelectionChange, 'optionalCall', _42 => _42(newKeys)]);
     } else {
       if (!isSelectionControlled) {
         setUncontrolledSelectedRowKeys([]);
       }
-      _optionalChain([onSelectionChange, 'optionalCall', _42 => _42([])]);
+      _optionalChain([onSelectionChange, 'optionalCall', _43 => _43([])]);
     }
   }
   const allSelected = _react.useMemo.call(void 0, () => {
@@ -387,7 +425,7 @@ function useTableState(input) {
   function isCellEditable(columnKey, rowIndex) {
     if (!editable) return false;
     if (!editableCells) return true;
-    return !!_optionalChain([editableCells, 'access', _43 => _43.get, 'call', _44 => _44(columnKey), 'optionalAccess', _45 => _45.has, 'call', _46 => _46(rowIndex)]);
+    return !!_optionalChain([editableCells, 'access', _44 => _44.get, 'call', _45 => _45(columnKey), 'optionalAccess', _46 => _46.has, 'call', _47 => _47(rowIndex)]);
   }
   function startEditing(rowIndex, columnKey, currentValue) {
     setEditingCell({ rowIndex, columnKey });
@@ -395,7 +433,7 @@ function useTableState(input) {
   }
   function commitEdit() {
     if (editingCell) {
-      _optionalChain([onCellChange, 'optionalCall', _47 => _47(editingCell.rowIndex, editingCell.columnKey, editingValue)]);
+      _optionalChain([onCellChange, 'optionalCall', _48 => _48(editingCell.rowIndex, editingCell.columnKey, editingValue)]);
       setEditingCell(null);
     }
   }
@@ -405,7 +443,7 @@ function useTableState(input) {
   function handleExport() {
     const content = _tigercatcore.exportTableData.call(void 0, displayColumns, processedData, exportFormat);
     _tigercatcore.downloadTableExport.call(void 0, content, exportFilename, exportFormat);
-    _optionalChain([onExport, 'optionalCall', _48 => _48(content)]);
+    _optionalChain([onExport, 'optionalCall', _49 => _49(content)]);
   }
   const [dragColumnKey, setDragColumnKey] = _react.useState.call(void 0, null);
   function handleDragStart(columnKey) {
@@ -419,7 +457,7 @@ function useTableState(input) {
     if (fromIdx >= 0 && toIdx >= 0) {
       const [moved] = cols.splice(fromIdx, 1);
       cols.splice(toIdx, 0, moved);
-      _optionalChain([onColumnOrderChange, 'optionalCall', _49 => _49(cols)]);
+      _optionalChain([onColumnOrderChange, 'optionalCall', _50 => _50(cols)]);
     }
     setDragColumnKey(null);
   }
@@ -435,7 +473,7 @@ function useTableState(input) {
     if (fromIdx >= 0 && toIdx >= 0) {
       const [moved] = rows.splice(fromIdx, 1);
       rows.splice(toIdx, 0, moved);
-      _optionalChain([onRowOrderChange, 'optionalCall', _50 => _50(rows)]);
+      _optionalChain([onRowOrderChange, 'optionalCall', _51 => _51(rows)]);
     }
     setDragRowKey(null);
   }
@@ -460,14 +498,17 @@ function useTableState(input) {
     sortState,
     currentPage,
     currentPageSize,
+    hiddenColumnKeys: effectiveHiddenColumnKeys,
     editingCell,
     editingValue,
     setEditingValue,
     toggleColumnLock,
+    handleSetHiddenColumns,
     handleSort,
     handleFilter,
     handlePageChange,
     handlePageSizeChange,
+    handleSetSort,
     handleRowClick,
     handleToggleExpand,
     handleSelectRow,
@@ -498,7 +539,7 @@ function useTableState(input) {
 function renderTableHeader(ctx, view) {
   const { size, stickyHeader, rowSelection, expandable, columnLockable, columnDraggable } = view;
   const expandHeaderTh = expandable ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { className: _tigercatcore.getExpandIconCellClasses.call(void 0, size), "aria-label": "Expand" }) : null;
-  const expandAtStart = _optionalChain([expandable, 'optionalAccess', _51 => _51.expandIconPosition]) !== "end";
+  const expandAtStart = _optionalChain([expandable, 'optionalAccess', _52 => _52.expandIconPosition]) !== "end";
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "thead", { className: _tigercatcore.getTableHeaderClasses.call(void 0, stickyHeader), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tr", { children: [
     expandAtStart && expandHeaderTh,
     rowSelection && rowSelection.showCheckbox !== false && rowSelection.type !== "radio" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { className: _tigercatcore.getCheckboxCellClasses.call(void 0, size), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -636,7 +677,7 @@ function renderTableBody(ctx, view) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tbody", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tr", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { colSpan: ctx.totalColumnCount, className: _tigercatcore.tableEmptyStateClasses, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { role: "status", "aria-live": "polite", children: emptyText }) }) }) });
   }
   function getDelegatedRow(event) {
-    const row = _optionalChain([event, 'access', _52 => _52.target, 'optionalAccess', _53 => _53.closest, 'call', _54 => _54(
+    const row = _optionalChain([event, 'access', _53 => _53.target, 'optionalAccess', _54 => _54.closest, 'call', _55 => _55(
       "tr[data-tiger-table-row-index]"
     )]);
     if (!row) return null;
@@ -688,7 +729,7 @@ function renderTableBody(ctx, view) {
         children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ExpandIcon, { expanded: isExpanded })
       }
     ) }) : null;
-    const expandAtStart = _optionalChain([expandable, 'optionalAccess', _55 => _55.expandIconPosition]) !== "end";
+    const expandAtStart = _optionalChain([expandable, 'optionalAccess', _56 => _56.expandIconPosition]) !== "end";
     const rowNode = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
       "tr",
       {
@@ -703,10 +744,10 @@ function renderTableBody(ctx, view) {
           rowSelection && rowSelection.showCheckbox !== false && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { className: _tigercatcore.getCheckboxCellClasses.call(void 0, size), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "input",
             {
-              type: _optionalChain([rowSelection, 'optionalAccess', _56 => _56.type]) === "radio" ? "radio" : "checkbox",
-              className: _optionalChain([rowSelection, 'optionalAccess', _57 => _57.type]) === "radio" ? "border-gray-300 text-[var(--tiger-primary,#2563eb)] focus:ring-[var(--tiger-primary,#2563eb)]" : "rounded border-gray-300 text-[var(--tiger-primary,#2563eb)] focus:ring-[var(--tiger-primary,#2563eb)]",
+              type: _optionalChain([rowSelection, 'optionalAccess', _57 => _57.type]) === "radio" ? "radio" : "checkbox",
+              className: _optionalChain([rowSelection, 'optionalAccess', _58 => _58.type]) === "radio" ? "border-gray-300 text-[var(--tiger-primary,#2563eb)] focus:ring-[var(--tiger-primary,#2563eb)]" : "rounded border-gray-300 text-[var(--tiger-primary,#2563eb)] focus:ring-[var(--tiger-primary,#2563eb)]",
               checked: isSelected,
-              disabled: _optionalChain([rowSelection, 'optionalAccess', _58 => _58.getCheckboxProps, 'optionalCall', _59 => _59(record), 'optionalAccess', _60 => _60.disabled]),
+              disabled: _optionalChain([rowSelection, 'optionalAccess', _59 => _59.getCheckboxProps, 'optionalCall', _60 => _60(record), 'optionalAccess', _61 => _61.disabled]),
               onChange: (e) => ctx.handleSelectRow(key, e.target.checked),
               onClick: (e) => e.stopPropagation()
             }
@@ -730,7 +771,7 @@ function renderTableBody(ctx, view) {
               hoverable,
               fixedInfo: ctx.fixedColumnsInfo
             });
-            const isEditing = _optionalChain([ctx, 'access', _61 => _61.editingCell, 'optionalAccess', _62 => _62.rowIndex]) === index && _optionalChain([ctx, 'access', _63 => _63.editingCell, 'optionalAccess', _64 => _64.columnKey]) === column.key;
+            const isEditing = _optionalChain([ctx, 'access', _62 => _62.editingCell, 'optionalAccess', _63 => _63.rowIndex]) === index && _optionalChain([ctx, 'access', _64 => _64.editingCell, 'optionalAccess', _65 => _65.columnKey]) === column.key;
             const cellEditable = ctx.isCellEditable(column.key, index);
             return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "td",
@@ -817,7 +858,7 @@ function renderTableBody(ctx, view) {
 
 function renderSummaryRow(ctx, view) {
   const { size, rowSelection, expandable, summaryRow } = view;
-  if (!_optionalChain([summaryRow, 'optionalAccess', _65 => _65.show])) return null;
+  if (!_optionalChain([summaryRow, 'optionalAccess', _66 => _66.show])) return null;
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tfoot", { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "tr", { className: _tigercatcore.tableSummaryRowClasses, children: [
     rowSelection && rowSelection.showCheckbox !== false && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { className: _tigercatcore.getTableCellClasses.call(void 0, size, "left") }),
     expandable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { className: _tigercatcore.getTableCellClasses.call(void 0, size, "left") }),
@@ -850,7 +891,7 @@ function renderPagination(ctx, view) {
   const total = paginationConfig.total !== void 0 && paginationConfig.total > 0 ? paginationConfig.total : ctx.processedData.length;
   const locale = view.disableI18n ? void 0 : view.locale;
   const labels = _tigercatcore.getPaginationLabels.call(void 0, locale);
-  const localeCode = _optionalChain([locale, 'optionalAccess', _66 => _66.locale]);
+  const localeCode = _optionalChain([locale, 'optionalAccess', _67 => _67.locale]);
   const finalTotalText = paginationConfig.totalText ? paginationConfig.totalText(total, [startIndex, endIndex]) : _tigercatcore.formatPaginationTotal.call(void 0, labels.totalText, total, [startIndex, endIndex], localeCode);
   const finalPrevText = paginationConfig.prevText || labels.prevPageAriaLabel;
   const finalNextText = paginationConfig.nextText || labels.nextPageAriaLabel;
@@ -920,6 +961,8 @@ function Table({
   columns,
   columnLockable = false,
   dataSource = [],
+  hiddenColumnKeys,
+  defaultHiddenColumnKeys,
   sort,
   defaultSort,
   filters,
@@ -929,7 +972,9 @@ function Table({
   striped = false,
   hoverable = true,
   loading = false,
-  emptyText = "No data",
+  locale,
+  labels,
+  emptyText,
   pagination = {
     current: 1,
     pageSize: 10,
@@ -947,6 +992,8 @@ function Table({
   tableLayout = "auto",
   responsiveMode = "scroll",
   cardBreakpoint = "sm",
+  cardClassName,
+  renderCard,
   // v0.6.0 props
   virtual = false,
   autoVirtual = true,
@@ -970,6 +1017,7 @@ function Table({
   onSelectionChange,
   onSortChange,
   onFilterChange,
+  onHiddenColumnsChange,
   onPageChange,
   onExpandChange,
   onCellChange,
@@ -988,12 +1036,20 @@ function Table({
   const internalExpandable = expandable;
   const internalRowClassName = rowClassName;
   const paginationLocaleInput = pagination !== false && typeof pagination === "object" ? pagination.locale : void 0;
+  const tableLocaleInput = locale;
   const isPaginationI18nDisabled = paginationLocaleInput === false;
   const immediatePaginationLocale = _react.useMemo.call(void 0, 
     () => paginationLocaleInput && !isPaginationI18nDisabled ? _tigercatcore.getImmediateTigerLocale.call(void 0, paginationLocaleInput) : void 0,
     [isPaginationI18nDisabled, paginationLocaleInput]
   );
   const [resolvedPaginationLocale, setResolvedPaginationLocale] = _react.useState.call(void 0, immediatePaginationLocale);
+  const immediateTableLocale = _react.useMemo.call(void 0, 
+    () => tableLocaleInput ? _tigercatcore.getImmediateTigerLocale.call(void 0, tableLocaleInput) : void 0,
+    [tableLocaleInput]
+  );
+  const [resolvedTableLocale, setResolvedTableLocale] = _react.useState.call(void 0, 
+    immediateTableLocale
+  );
   _react.useEffect.call(void 0, () => {
     let active = true;
     setResolvedPaginationLocale(immediatePaginationLocale);
@@ -1008,13 +1064,41 @@ function Table({
       active = false;
     };
   }, [isPaginationI18nDisabled, paginationLocaleInput, immediatePaginationLocale]);
+  _react.useEffect.call(void 0, () => {
+    let active = true;
+    setResolvedTableLocale(immediateTableLocale);
+    if (tableLocaleInput && _tigercatcore.isLazyTigerLocale.call(void 0, tableLocaleInput)) {
+      _tigercatcore.resolveTigerLocale.call(void 0, tableLocaleInput).then((nextLocale) => {
+        if (active) setResolvedTableLocale(nextLocale);
+      }).catch(() => {
+        if (active) setResolvedTableLocale(immediateTableLocale);
+      });
+    }
+    return () => {
+      active = false;
+    };
+  }, [tableLocaleInput, immediateTableLocale]);
   const paginationLocale = _react.useMemo.call(void 0, 
     () => isPaginationI18nDisabled ? void 0 : _tigercatcore.mergeTigerLocale.call(void 0, config.locale, resolvedPaginationLocale),
     [config.locale, isPaginationI18nDisabled, resolvedPaginationLocale]
   );
+  const tableLocale = _react.useMemo.call(void 0, 
+    () => _tigercatcore.mergeTigerLocale.call(void 0, config.locale, resolvedTableLocale),
+    [config.locale, resolvedTableLocale]
+  );
+  const tableLabelOverrides = _react.useMemo.call(void 0, 
+    () => emptyText === void 0 ? labels : { ...labels, emptyText },
+    [emptyText, labels]
+  );
+  const tableLabels = _react.useMemo.call(void 0, 
+    () => _tigercatcore.getTableLabels.call(void 0, tableLocale, tableLabelOverrides),
+    [tableLabelOverrides, tableLocale]
+  );
   const ctx = useTableState({
     columns,
     dataSource,
+    hiddenColumnKeys,
+    defaultHiddenColumnKeys,
     sort,
     defaultSort,
     filters,
@@ -1036,6 +1120,7 @@ function Table({
     onSelectionChange,
     onSortChange,
     onFilterChange,
+    onHiddenColumnsChange,
     onPageChange,
     onExpandChange,
     onCellChange,
@@ -1129,7 +1214,7 @@ function Table({
                 hoverable,
                 striped,
                 loading,
-                emptyText,
+                emptyText: tableLabels.emptyText,
                 rowSelection: internalRowSelection,
                 expandable: internalExpandable,
                 rowClassName: internalRowClassName,
@@ -1144,68 +1229,141 @@ function Table({
             ]
           }
         ),
-        responsiveMode === "card" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        responsiveMode === "card" && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
           "div",
           {
             className: _tigercatcore.getTableResponsiveCardListClasses.call(void 0, cardBreakpoint),
             "data-tiger-table-mobile": "card",
-            children: ctx.paginatedData.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardClasses, children: emptyText }) : ctx.paginatedData.map((record, index) => {
-              const key = ctx.pageRowKeys[index];
-              const isExpanded = ctx.expandedRowKeySet.has(key);
-              const isRowExpandable = internalExpandable ? internalExpandable.rowExpandable ? internalExpandable.rowExpandable(record) : true : false;
-              const expandedContent = internalExpandable && isExpanded && isRowExpandable ? _optionalChain([internalExpandable, 'access', _67 => _67.expandedRowRender, 'optionalCall', _68 => _68(record, index)]) : null;
-              const expandedNode = expandedContent;
-              return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                "div",
+            children: [
+              _optionalChain([internalRowSelection, 'optionalAccess', _68 => _68.type]) !== "radio" && _optionalChain([internalRowSelection, 'optionalAccess', _69 => _69.showCheckbox]) !== false && internalRowSelection && ctx.paginatedData.length > 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-between rounded-[var(--tiger-radius-md,0.5rem)] border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] px-3 py-2", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _chunkF7H4ALKNjs.Checkbox,
                 {
-                  className: _tigercatcore.tableResponsiveCardClasses,
-                  onClick: () => ctx.handleRowClick(record, index, key),
-                  children: [
-                    _optionalChain([internalRowSelection, 'optionalAccess', _69 => _69.showCheckbox]) !== false && internalRowSelection || internalExpandable && isRowExpandable ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-2 flex items-center gap-3", children: [
-                      internalRowSelection && internalRowSelection.showCheckbox !== false && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        "input",
-                        {
-                          type: internalRowSelection.type === "radio" ? "radio" : "checkbox",
-                          checked: ctx.selectedRowKeySet.has(key),
-                          disabled: _optionalChain([internalRowSelection, 'access', _70 => _70.getCheckboxProps, 'optionalCall', _71 => _71(record), 'optionalAccess', _72 => _72.disabled]),
-                          onClick: (event) => event.stopPropagation(),
-                          onChange: (event) => ctx.handleSelectRow(key, event.target.checked)
-                        }
-                      ),
-                      internalExpandable && isRowExpandable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        "button",
-                        {
-                          type: "button",
-                          className: "text-sm text-[var(--tiger-primary,#2563eb)]",
-                          "aria-expanded": isExpanded,
-                          onClick: (event) => {
-                            event.stopPropagation();
-                            ctx.handleToggleExpand(key, record);
-                          },
-                          children: isExpanded ? "Collapse" : "Expand"
-                        }
-                      )
-                    ] }) : null,
-                    (() => {
-                      const { titleColumn, bodyColumns } = _tigercatcore.getCardColumns.call(void 0, ctx.displayColumns);
-                      const renderCellContent = (column) => {
-                        const dataKey = column.dataKey || column.key;
-                        return column.render ? column.render(record, index) : record[dataKey];
-                      };
-                      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-                        titleColumn && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardTitleClasses, children: renderCellContent(titleColumn) }),
-                        bodyColumns.map((column) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardRowClasses, children: [
-                          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardLabelClasses, children: column.title }),
-                          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardValueClasses, children: renderCellContent(column) })
-                        ] }, column.key))
-                      ] });
-                    })(),
-                    expandedNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mt-3 border-t border-[var(--tiger-border,#e5e7eb)] pt-3", children: expandedNode })
-                  ]
-                },
-                key
-              );
-            })
+                  size: "sm",
+                  checked: ctx.allSelected,
+                  indeterminate: ctx.someSelected,
+                  onChange: (checked) => ctx.handleSelectAll(checked),
+                  children: tableLabels.selectAllText
+                }
+              ) }) : null,
+              ctx.displayColumns.some((column) => column.sortable) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "rounded-[var(--tiger-radius-md,0.5rem)] border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] px-3 py-2", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _chunk6Z4LLPZAjs.Select,
+                {
+                  size: "sm",
+                  value: ctx.sortState.key && ctx.sortState.direction ? `${ctx.sortState.key}:${ctx.sortState.direction}` : "",
+                  options: [
+                    { label: tableLabels.clearSortText, value: "" },
+                    ...ctx.displayColumns.filter((column) => column.sortable).flatMap((column) => [
+                      {
+                        label: `${_tigercatcore.formatTableSortByText.call(void 0, tableLabels.sortByText, column.title)} \u2191`,
+                        value: `${column.key}:asc`
+                      },
+                      {
+                        label: `${_tigercatcore.formatTableSortByText.call(void 0, tableLabels.sortByText, column.title)} \u2193`,
+                        value: `${column.key}:desc`
+                      }
+                    ])
+                  ],
+                  clearable: false,
+                  onChange: (value) => {
+                    const nextValue = String(_nullishCoalesce(value, () => ( "")));
+                    if (!nextValue) {
+                      ctx.handleSetSort({ key: null, direction: null });
+                      return;
+                    }
+                    const separatorIndex = nextValue.lastIndexOf(":");
+                    const key = nextValue.slice(0, separatorIndex);
+                    const direction = nextValue.slice(separatorIndex + 1);
+                    ctx.handleSetSort({ key, direction });
+                  }
+                }
+              ) }) : null,
+              ctx.paginatedData.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardClasses, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZRHDNGWOjs.Empty, { showImage: false, description: tableLabels.emptyText }) }) : ctx.paginatedData.map((record, index) => {
+                const key = ctx.pageRowKeys[index];
+                const isExpanded = ctx.expandedRowKeySet.has(key);
+                const isSelected = ctx.selectedRowKeySet.has(key);
+                const isRowExpandable = internalExpandable ? internalExpandable.rowExpandable ? internalExpandable.rowExpandable(record) : true : false;
+                const expandedContent = internalExpandable && isExpanded && isRowExpandable ? _optionalChain([internalExpandable, 'access', _70 => _70.expandedRowRender, 'optionalCall', _71 => _71(record, index)]) : null;
+                const expandedNode = expandedContent;
+                const renderContext = {
+                  record,
+                  index,
+                  columns: ctx.displayColumns,
+                  selected: isSelected,
+                  expanded: isExpanded,
+                  toggleExpand: () => ctx.handleToggleExpand(key, record),
+                  selectRow: (checked) => ctx.handleSelectRow(key, checked)
+                };
+                const customCard = _optionalChain([renderCard, 'optionalCall', _72 => _72(renderContext)]);
+                const resolvedCardClassName = typeof cardClassName === "function" ? cardClassName(record, index) : cardClassName;
+                return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                  "div",
+                  {
+                    className: _tigercatcore.classNames.call(void 0, _tigercatcore.tableResponsiveCardClasses, resolvedCardClassName),
+                    onClick: () => ctx.handleRowClick(record, index, key),
+                    children: customCard !== void 0 && customCard !== null ? customCard : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+                      _optionalChain([internalRowSelection, 'optionalAccess', _73 => _73.showCheckbox]) !== false && internalRowSelection || internalExpandable && isRowExpandable ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-2 flex items-center gap-3", children: [
+                        internalRowSelection && internalRowSelection.showCheckbox !== false && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { onClick: (event) => event.stopPropagation(), children: internalRowSelection.type === "radio" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                          _chunkTMON4MPOjs.Radio,
+                          {
+                            value: key,
+                            checked: isSelected,
+                            disabled: _optionalChain([internalRowSelection, 'access', _74 => _74.getCheckboxProps, 'optionalCall', _75 => _75(record), 'optionalAccess', _76 => _76.disabled]),
+                            "aria-label": _tigercatcore.formatTableSelectRowAriaLabel.call(void 0, 
+                              tableLabels.selectRowAriaLabel,
+                              index + 1,
+                              _optionalChain([tableLocale, 'optionalAccess', _77 => _77.locale])
+                            ),
+                            onChange: () => ctx.handleSelectRow(key, true)
+                          }
+                        ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                          _chunkF7H4ALKNjs.Checkbox,
+                          {
+                            size: "sm",
+                            checked: isSelected,
+                            disabled: _optionalChain([internalRowSelection, 'access', _78 => _78.getCheckboxProps, 'optionalCall', _79 => _79(record), 'optionalAccess', _80 => _80.disabled]),
+                            "aria-label": _tigercatcore.formatTableSelectRowAriaLabel.call(void 0, 
+                              tableLabels.selectRowAriaLabel,
+                              index + 1,
+                              _optionalChain([tableLocale, 'optionalAccess', _81 => _81.locale])
+                            ),
+                            onChange: (checked) => ctx.handleSelectRow(key, checked)
+                          }
+                        ) }),
+                        internalExpandable && isRowExpandable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                          "button",
+                          {
+                            type: "button",
+                            className: "text-sm text-[var(--tiger-primary,#2563eb)]",
+                            "aria-expanded": isExpanded,
+                            onClick: (event) => {
+                              event.stopPropagation();
+                              ctx.handleToggleExpand(key, record);
+                            },
+                            children: isExpanded ? tableLabels.collapseText : tableLabels.expandText
+                          }
+                        )
+                      ] }) : null,
+                      (() => {
+                        const { titleColumn, bodyColumns } = _tigercatcore.getCardColumns.call(void 0, ctx.displayColumns);
+                        const renderCellContent = (column) => {
+                          const dataKey = column.dataKey || column.key;
+                          return column.render ? column.render(record, index) : record[dataKey];
+                        };
+                        return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+                          titleColumn && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardTitleClasses, children: renderCellContent(titleColumn) }),
+                          bodyColumns.map((column) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardRowClasses, children: [
+                            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardLabelClasses, children: column.title }),
+                            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardValueClasses, children: renderCellContent(column) })
+                          ] }, column.key))
+                        ] });
+                      })(),
+                      expandedNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mt-3 border-t border-[var(--tiger-border,#e5e7eb)] pt-3", children: expandedNode })
+                    ] })
+                  },
+                  key
+                );
+              })
+            ]
           }
         ),
         loading && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -1214,10 +1372,10 @@ function Table({
             className: _tigercatcore.tableLoadingOverlayClasses,
             role: "status",
             "aria-live": "polite",
-            "aria-label": "Loading",
+            "aria-label": tableLabels.loadingText,
             children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LoadingSpinner, {}),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: "Loading" })
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: tableLabels.loadingText })
             ]
           }
         ),