@popmenu/table 0.53.0 → 0.54.0

package/build/components/Table/TableProps.d.ts

@@ -1,5 +1,5 @@
 import { TextFieldProps } from '@material-ui/core';
-import { Column, ColumnFiltersState, PaginationState } from '@tanstack/react-table';
+import { Column, ColumnFiltersState, PaginationState, SortingState } from '@tanstack/react-table';
 import { Dispatch, SetStateAction } from 'react';
 export interface ColumnFilter {
     id: string;
@@ -18,6 +18,8 @@ export interface TableProps<T = unknown> {
     searchable?: boolean;
     /** Makes columns sortable. For uncontrolled sorting only. */
     sortable?: boolean;
+    /** Sorting state. Expects the result of a React useState hook. Used only for manual sorting. */
+    sortingState?: [SortingState, Dispatch<SetStateAction<SortingState>>];
     /** Pagination state. Expects the result of a React useState hook. Used only for manual pagination. */
     paginationState?: [PaginationState, Dispatch<SetStateAction<PaginationState>>];
     /** GlobalFiltering state. Expects the result of a React useState hook. Used only for manual filtering. */

package/build/index.es.js

@@ -3259,14 +3259,16 @@ var defaultTableProps = {
     searchable: false,
 };
 var Table = function (props) {
-    var data = props.data, columns = props.columns, loading = props.loading, searchable = props.searchable, sortable = props.sortable, externalFilterState = props.filterState, externalGlobalFilterState = props.globalFilterState, externalPaginationState = props.paginationState, externalVisibilityState = props.visibilityState, pageCount = props.pageCount, GlobalFilterProps = props.GlobalFilterProps, Empty = props.Empty;
+    var data = props.data, columns = props.columns, loading = props.loading, searchable = props.searchable, sortable = props.sortable, externalFilterState = props.filterState, externalGlobalFilterState = props.globalFilterState, externalPaginationState = props.paginationState, externalSortingState = props.sortingState, externalVisibilityState = props.visibilityState, pageCount = props.pageCount, GlobalFilterProps = props.GlobalFilterProps, Empty = props.Empty;
     var classes = useStyles$6(props);
     var rootRef = useRef(null);
     // Prepare Empty State
     var isEmpty = data.length === 0;
     var isEmptyComponentValid = Empty && isValidElement(createElement(Empty));
     // Prepare Sorting
-    var _a = useState([]), sorting = _a[0], setSorting = _a[1];
+    var _a = externalSortingState || [], sorting = _a[0], setSorting = _a[1];
+    var isControlledColumnSort = Boolean(externalSortingState);
+    var controlledColumnSortOptions = { onSortingChange: setSorting, manualSorting: true };
     // Prepare Global Filtering
     var _b = externalGlobalFilterState || [], globalFilter = _b[0], setGlobalFilter = _b[1];
     var isControlledGlobalFilter = Boolean(externalGlobalFilterState);
@@ -3283,7 +3285,7 @@ var Table = function (props) {
     var columnVisibility = (externalVisibilityState || [])[0];
     var isControlledColumnVisibility = Boolean(externalVisibilityState);
     // Init table instance
-    var table = useReactTable(__assign$3(__assign$3(__assign$3({ data: data, columns: columns, state: __assign$3(__assign$3(__assign$3(__assign$3({ sorting: sorting }, (isControlledPagination && { pagination: pagination })), (isControlledGlobalFilter && { globalFilter: globalFilter })), (isControlledColumnFilters && { columnFilters: columnFilters })), (isControlledColumnVisibility && { columnVisibility: columnVisibility })), enableSorting: sortable, globalFilterFn: coercedValueIncludesString, onSortingChange: setSorting, getCoreRowModel: getCoreRowModel(), getSortedRowModel: getSortedRowModel(), getFilteredRowModel: getFilteredRowModel(), getPaginationRowModel: getPaginationRowModel() }, (isControlledPagination && controlledPaginationOptions)), (isControlledGlobalFilter && controlledGlobalFilterOptions)), (isControlledColumnFilters && controlledColumnFiltersOptions)));
+    var table = useReactTable(__assign$3(__assign$3(__assign$3(__assign$3({ data: data, columns: columns, state: __assign$3(__assign$3(__assign$3(__assign$3(__assign$3({}, (isControlledPagination && { pagination: pagination })), (isControlledGlobalFilter && { globalFilter: globalFilter })), (isControlledColumnFilters && { columnFilters: columnFilters })), (isControlledColumnVisibility && { columnVisibility: columnVisibility })), (isControlledColumnSort && { sorting: sorting })), enableSorting: sortable, globalFilterFn: coercedValueIncludesString, getCoreRowModel: getCoreRowModel(), getSortedRowModel: getSortedRowModel(), getFilteredRowModel: getFilteredRowModel(), getPaginationRowModel: getPaginationRowModel() }, (isControlledPagination && controlledPaginationOptions)), (isControlledGlobalFilter && controlledGlobalFilterOptions)), (isControlledColumnFilters && controlledColumnFiltersOptions)), (isControlledColumnSort && controlledColumnSortOptions)));
     var _f = useColumnFilters(table), selectedColumnFilters = _f.selectedColumnFilters, hasColumnFilters = _f.hasColumnFilters, deselectColumnFilter = _f.deselectColumnFilter, formatSelectedFilterText = _f.formatSelectedFilterText, resetColumnFilters = _f.resetColumnFilters;
     var handlePagination = function (_e, pageNumber) {
         var pageIndex = pageNumber - 1;