@ackplus/react-tanstack-data-table 1.1.11 → 1.1.12

package/dist/lib/components/toolbar/data-table-toolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-table-toolbar.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/toolbar/data-table-toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKH,YAAY,EACZ,OAAO,EACV,MAAM,eAAe,CAAC;AACvB,OAAc,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAYvD,MAAM,WAAW,qBAAsB,SAAQ,YAAY;IACvD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,KAAK,GAAE,qBAA0B,GAAG,YAAY,CA2LhF"}
+{"version":3,"file":"data-table-toolbar.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/toolbar/data-table-toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKH,YAAY,EACZ,OAAO,EACV,MAAM,eAAe,CAAC;AACvB,OAAc,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAavD,MAAM,WAAW,qBAAsB,SAAQ,YAAY;IACvD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,KAAK,GAAE,qBAA0B,GAAG,YAAY,CAwMhF"}

package/dist/lib/components/toolbar/data-table-toolbar.js

@@ -15,9 +15,10 @@ const table_export_control_1 = require("./table-export-control");
 const table_search_control_1 = require("./table-search-control");
 const table_size_control_1 = require("./table-size-control");
 const data_table_context_1 = require("../../contexts/data-table-context");
+const table_refresh_control_1 = require("./table-refresh-control");
 const slot_helpers_1 = require("../../utils/slot-helpers");
 function DataTableToolbar(props = {}) {
-    const { extraFilter = null, enableGlobalFilter = true, title, subtitle, enableColumnVisibility = true, enableExport = true, enableReset = true, enableColumnFilter = true, enableTableSizeControl = true, enableColumnPinning = true, titleSx, subtitleSx, containerSx, leftSectionSx, rightSectionSx, ...otherProps } = props;
+    const { extraFilter = null, enableGlobalFilter = true, title, subtitle, enableColumnVisibility = true, enableExport = true, enableReset = true, enableRefresh = false, enableColumnFilter = true, enableTableSizeControl = true, enableColumnPinning = true, titleSx, subtitleSx, containerSx, leftSectionSx, rightSectionSx, ...otherProps } = props;
     const { table, slots, slotProps = {} } = (0, data_table_context_1.useDataTableContext)();
     // Extract slot-specific props with enhanced merging
     const toolbarSlotProps = (0, slot_helpers_1.extractSlotProps)(slotProps, 'toolbar');
@@ -28,6 +29,7 @@ function DataTableToolbar(props = {}) {
     const columnVisibilityControlSlotProps = (0, slot_helpers_1.extractSlotProps)(slotProps, 'columnVisibilityControl');
     const resetButtonSlotProps = (0, slot_helpers_1.extractSlotProps)(slotProps, 'resetButton');
     const exportButtonSlotProps = (0, slot_helpers_1.extractSlotProps)(slotProps, 'exportButton');
+    const refreshButtonSlotProps = (0, slot_helpers_1.extractSlotProps)(slotProps, 'refreshButton');
     const ToolbarSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'toolbar', material_1.Toolbar);
     const TableSearchControlSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'searchInput', table_search_control_1.TableSearchControl);
     const TableSizeControlSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'tableSizeControl', table_size_control_1.TableSizeControl);
@@ -36,6 +38,7 @@ function DataTableToolbar(props = {}) {
     const ColumnVisibilityControlSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'columnVisibilityControl', column_visibility_control_1.ColumnVisibilityControl);
     const ColumnResetControlSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'resetButton', column_reset_control_1.ColumnResetControl);
     const TableExportControlSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'exportButton', table_export_control_1.TableExportControl);
+    const TableRefreshControlSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'refreshButton', table_refresh_control_1.TableRefreshControl);
     // Merge all props for maximum flexibility
     const mergedToolbarProps = (0, slot_helpers_1.mergeSlotProps)({
         // Default toolbar props
@@ -48,5 +51,5 @@ function DataTableToolbar(props = {}) {
             }, children: [(title || subtitle) ? ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { mb: 2 }, children: [title ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", component: "div", sx: titleSx, children: title })) : null, subtitle ? ((0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", color: "text.secondary", sx: subtitleSx, children: subtitle })) : null] })) : null, (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", spacing: 2, justifyContent: "space-between", alignItems: "center", children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", spacing: 0.5, alignItems: "center", sx: {
                                 flex: 1,
                                 ...leftSectionSx,
-                            }, children: [enableTableSizeControl ? ((0, jsx_runtime_1.jsx)(TableSizeControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, tableSizeControlSlotProps, props.tableSizeControlProps || {}) })) : null, enableColumnFilter ? ((0, jsx_runtime_1.jsx)(ColumnCustomFilterControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, columnCustomFilterControlSlotProps, props.columnFilterProps || {}) })) : null, enableColumnPinning ? ((0, jsx_runtime_1.jsx)(ColumnPinningControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, columnPinningControlSlotProps, props.columnPinningProps || {}) })) : null, enableColumnVisibility ? ((0, jsx_runtime_1.jsx)(ColumnVisibilityControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, columnVisibilityControlSlotProps, props.columnVisibilityProps || {}) })) : null, enableReset ? ((0, jsx_runtime_1.jsx)(ColumnResetControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, resetButtonSlotProps, props.resetButtonProps || {}) })) : null, enableExport ? ((0, jsx_runtime_1.jsx)(TableExportControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, exportButtonSlotProps, props.exportButtonProps || {}) })) : null, enableGlobalFilter ? ((0, jsx_runtime_1.jsx)(TableSearchControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, searchInputSlotProps, props.searchInputProps || {}) })) : null] }), (0, jsx_runtime_1.jsx)(material_1.Stack, { direction: "row", spacing: 1, alignItems: "center", sx: rightSectionSx, children: extraFilter })] })] }) }));
+                            }, children: [enableTableSizeControl ? ((0, jsx_runtime_1.jsx)(TableSizeControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, tableSizeControlSlotProps, props.tableSizeControlProps || {}) })) : null, enableColumnFilter ? ((0, jsx_runtime_1.jsx)(ColumnCustomFilterControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, columnCustomFilterControlSlotProps, props.columnFilterProps || {}) })) : null, enableColumnPinning ? ((0, jsx_runtime_1.jsx)(ColumnPinningControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, columnPinningControlSlotProps, props.columnPinningProps || {}) })) : null, enableColumnVisibility ? ((0, jsx_runtime_1.jsx)(ColumnVisibilityControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, columnVisibilityControlSlotProps, props.columnVisibilityProps || {}) })) : null, enableReset ? ((0, jsx_runtime_1.jsx)(ColumnResetControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, resetButtonSlotProps, props.resetButtonProps || {}) })) : null, enableExport ? ((0, jsx_runtime_1.jsx)(TableExportControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, exportButtonSlotProps, props.exportButtonProps || {}) })) : null, enableGlobalFilter ? ((0, jsx_runtime_1.jsx)(TableSearchControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, searchInputSlotProps, props.searchInputProps || {}) })) : null, enableRefresh ? ((0, jsx_runtime_1.jsx)(TableRefreshControlSlot, { ...(0, slot_helpers_1.mergeSlotProps)({}, refreshButtonSlotProps, props.refreshButtonProps || {}) })) : null] }), (0, jsx_runtime_1.jsx)(material_1.Stack, { direction: "row", spacing: 1, alignItems: "center", sx: rightSectionSx, children: extraFilter })] })] }) }));
 }

package/dist/lib/components/toolbar/table-refresh-control.d.ts

@@ -0,0 +1,15 @@
+import { ReactElement } from 'react';
+import { IconButtonProps } from '@mui/material';
+export interface TableRefreshControlProps {
+    iconButtonProps?: IconButtonProps;
+    tooltipProps?: any;
+    /** optional override */
+    onRefresh?: () => void | Promise<void>;
+    /** disable + show spinner if true */
+    loading?: boolean;
+    /** use spinner instead of icon while loading */
+    showSpinnerWhileLoading?: boolean;
+    [key: string]: any;
+}
+export declare function TableRefreshControl(props?: TableRefreshControlProps): ReactElement;
+//# sourceMappingURL=table-refresh-control.d.ts.map

package/dist/lib/components/toolbar/table-refresh-control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-refresh-control.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/toolbar/table-refresh-control.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAe,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAuB,eAAe,EAAoB,MAAM,eAAe,CAAC;AAKvF,MAAM,WAAW,wBAAwB;IACrC,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,YAAY,CAAC,EAAE,GAAG,CAAC;IAEnB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAEvC,qCAAqC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,gDAAgD;IAChD,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAElC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACtB;AAED,wBAAgB,mBAAmB,CAAC,KAAK,GAAE,wBAA6B,GAAG,YAAY,CAkCtF"}

package/dist/lib/components/toolbar/table-refresh-control.js

@@ -0,0 +1,61 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableRefreshControl = TableRefreshControl;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const icons_material_1 = require("@mui/icons-material");
+const material_1 = require("@mui/material");
+const data_table_context_1 = require("../../contexts/data-table-context");
+const slot_helpers_1 = require("../../utils/slot-helpers");
+function TableRefreshControl(props = {}) {
+    const { apiRef, slots, slotProps } = (0, data_table_context_1.useDataTableContext)();
+    const refreshIconSlotProps = (0, slot_helpers_1.extractSlotProps)(slotProps, 'refreshIcon');
+    const RefreshIconSlot = (0, slot_helpers_1.getSlotComponent)(slots, 'refreshIcon', icons_material_1.Refresh);
+    const handleRefresh = (0, react_1.useCallback)(() => {
+        var _a, _b, _c;
+        if (props.onRefresh)
+            return props.onRefresh();
+        // Default: use internal api
+        (_c = (_b = (_a = apiRef === null || apiRef === void 0 ? void 0 : apiRef.current) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.reload) === null || _c === void 0 ? void 0 : _c.call(_b);
+    }, [props, apiRef]);
+    const mergedIconButtonProps = (0, slot_helpers_1.mergeSlotProps)({
+        size: 'small',
+        onClick: handleRefresh,
+        disabled: !!props.loading,
+        sx: { flexShrink: 0 },
+    }, refreshIconSlotProps, props.iconButtonProps || {});
+    return ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: "Refresh data", ...props.tooltipProps, children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { ...mergedIconButtonProps, children: props.loading && props.showSpinnerWhileLoading ? ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 16 })) : ((0, jsx_runtime_1.jsx)(RefreshIconSlot, { ...refreshIconSlotProps })) }) }));
+}

package/dist/lib/data-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/lib/data-table.tsx"],"names":[],"mappings":"AA8EA;;GAEG;AACH,eAAO,MAAM,SAAS,KAszDpB,CAAC"}
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/lib/data-table.tsx"],"names":[],"mappings":"AA8EA;;GAEG;AACH,eAAO,MAAM,SAAS,KAmrDpB,CAAC"}