@pdg/react-table 1.0.28 → 1.0.30

package/dist/Table/Table.types.d.ts

@@ -16,6 +16,13 @@ export interface TableColumn<T = TableItem> {
     ellipsis?: boolean;
     dateFormat?: string;
     tooltipProps?: Omit<TooltipProps, 'children' | 'title'>;
+    display?: {
+        xs?: boolean;
+        sm?: boolean;
+        md?: boolean;
+        lg?: boolean;
+        xl?: boolean;
+    };
     head?: {
         className?: CommonSxProps['className'];
         style?: CommonSxProps['style'];
@@ -48,6 +55,7 @@ export interface TableColumn<T = TableItem> {
     onInitChecked?(item: T): boolean;
     onCheckDisabled?(item: T): boolean;
     onCheckChange?(item: T, checked: boolean): void;
+    onCheckDisabledChange?(item: T, checkDisabled: boolean): void;
 }
 export interface TableProps<T = TableItem> extends CommonSxProps {
     columns?: (TableColumn<T> | false | undefined | null)[];

package/dist/TableBodyCell/TableBodyCell.types.d.ts

@@ -1,7 +1,7 @@
 import { TableColumn, TableItem, TableProps } from '../Table/Table.types';
 export interface TableBodyCellCommands {
-    setCheckDisabled(disabled: boolean): void;
     setChecked(checked: boolean): void;
+    setCheckDisabled(disabled: boolean): void;
 }
 export interface TableBodyCellProps {
     index: number;

package/dist/TableHeadCell/TableHeadCell.types.d.ts

@@ -1,6 +1,7 @@
 import { TableColumn, TableProps } from '../Table/Table.types';
 export interface TableHeadCellCommands {
     setChecked(checked: boolean): void;
+    setCheckDisabled(checkDisabled: boolean): void;
 }
 export interface TableHeadCellProps {
     column: TableColumn;

package/dist/index.esm.js

@@ -8420,6 +8420,7 @@ var TableCommonCell = function (_a) {
         var _a, _b, _c, _d, _e, _f;
         var sx;
         var getSx;
+        var displaySx;
         switch (type) {
             case 'head':
                 sx = (_a = column.head) === null || _a === void 0 ? void 0 : _a.sx;
@@ -8436,6 +8437,20 @@ var TableCommonCell = function (_a) {
                 getSx = ((_e = column.footer) === null || _e === void 0 ? void 0 : _e.onGetSx) ? (_f = column.footer) === null || _f === void 0 ? void 0 : _f.onGetSx() : undefined;
                 break;
         }
+        if (column.display) {
+            var display = {};
+            if (column.display.xs !== undefined)
+                display.xs = column.display.xs ? 'table-cell' : 'none';
+            if (column.display.sm !== undefined)
+                display.sm = column.display.sm ? 'table-cell' : 'none';
+            if (column.display.md !== undefined)
+                display.md = column.display.md ? 'table-cell' : 'none';
+            if (column.display.lg !== undefined)
+                display.lg = column.display.lg ? 'table-cell' : 'none';
+            if (column.display.xl !== undefined)
+                display.xl = column.display.xl ? 'table-cell' : 'none';
+            displaySx = { display: display };
+        }
         var sxList = [];
         if (getSx)
             sxList.push(getSx);
@@ -8443,6 +8458,8 @@ var TableCommonCell = function (_a) {
             sxList.push(sx);
         if (initSx)
             sxList.push(initSx);
+        if (displaySx)
+            sxList.push(displaySx);
         if (sxList.length > 0) {
             if (sxList.length === 1) {
                 return sxList[0];
@@ -8515,9 +8532,17 @@ var TableBodyCell = function (_a) {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [checked]);
+    useEffect(function () {
+        if (column.type === 'check') {
+            setItemColumnChecked(item, column, checked);
+            column.onCheckChange && column.onCheckChange(item, checked);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [checked]);
     useEffect(function () {
         if (column.type === 'check') {
             setItemColumnCheckDisabled(item, column, checkDisabled);
+            column.onCheckDisabledChange && column.onCheckDisabledChange(item, checkDisabled);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [checkDisabled]);
@@ -8652,6 +8677,7 @@ TableBodyRow.defaultProps = TableBodyRowDefaultProps;var TableHeadCell = functio
     var _b = useTableState(), setHeadColumnChecked = _b.setHeadColumnChecked, setHeadColumnCommands = _b.setHeadColumnCommands;
     // State -------------------------------------------------------------------------------------------------------------
     var _c = useState(false), checked = _c[0], setChecked = _c[1];
+    var _d = useState(false), checkDisabled = _d[0], setCheckDisabled = _d[1];
     // Effect ------------------------------------------------------------------------------------------------------------
     useEffect(function () {
         if (column.type === 'check') {
@@ -8665,13 +8691,18 @@ TableBodyRow.defaultProps = TableBodyRowDefaultProps;var TableHeadCell = functio
                     setChecked(checked);
                 }
             },
+            setCheckDisabled: function (checkDisabled) {
+                if (column.type === 'check') {
+                    setCheckDisabled(checkDisabled);
+                }
+            },
         });
     }, [setHeadColumnCommands, column]);
     // Memo --------------------------------------------------------------------------------------------------------------
     var data = useMemo(function () {
         var _a, _b;
         if (column.type === 'check') {
-            return (React__default.createElement(Checkbox, { checked: checked, onChange: function (e, newChecked) {
+            return (React__default.createElement(Checkbox, { checked: checked, disabled: checkDisabled, onChange: function (e, newChecked) {
                     setChecked(newChecked);
                     onCheckChange && onCheckChange(column, newChecked);
                 } }));
@@ -8684,7 +8715,7 @@ TableBodyRow.defaultProps = TableBodyRowDefaultProps;var TableHeadCell = functio
                 return column.label;
             }
         }
-    }, [checked, column, onCheckChange]);
+    }, [checkDisabled, checked, column, onCheckChange]);
     // Render ------------------------------------------------------------------------------------------------------------
     return (React__default.createElement(TableCommonCell, { type: 'head', className: 'TableHeadCell', column: column, defaultAlign: defaultAlign }, data));
 };var TableFooterCell = function (_a) {
@@ -8944,17 +8975,27 @@ var Table = React__default.forwardRef(function (_a, ref) {
         var headColumnData = localHeaderDataRef.current[column.id];
         if (headColumnData) {
             updateHeadCheckTimer.current = setTimeout(function () {
-                var _a;
+                var _a, _b;
                 updateHeadCheckTimer.current = undefined;
-                var allChecked = !Object.keys(localBodyDataRef.current).find(function (key) {
+                var enabledCheckExists = !!Object.keys(localBodyDataRef.current).find(function (key) {
                     var columnData = localBodyDataRef.current[key].columns[column.id];
                     if (columnData) {
                         if (!columnData.checkDisabled) {
-                            return !columnData.checked;
+                            return true;
                         }
                     }
                 });
-                (_a = headColumnData.commands) === null || _a === void 0 ? void 0 : _a.setChecked(allChecked);
+                var allChecked = enabledCheckExists &&
+                    !Object.keys(localBodyDataRef.current).find(function (key) {
+                        var columnData = localBodyDataRef.current[key].columns[column.id];
+                        if (columnData) {
+                            if (!columnData.checkDisabled) {
+                                return !columnData.checked;
+                            }
+                        }
+                    });
+                (_a = headColumnData.commands) === null || _a === void 0 ? void 0 : _a.setCheckDisabled(!enabledCheckExists);
+                (_b = headColumnData.commands) === null || _b === void 0 ? void 0 : _b.setChecked(allChecked);
             }, 100);
         }
     }, []);
@@ -9176,8 +9217,9 @@ var Table = React__default.forwardRef(function (_a, ref) {
         var data = (_a = localBodyDataRef.current[item.id]) === null || _a === void 0 ? void 0 : _a.columns[column.id];
         if (data) {
             data.checkDisabled = disabled;
+            updateHeadCheck(column);
         }
-    }, []);
+    }, [updateHeadCheck]);
     var TableContextSetItemColumnCommands = useCallback(function (item, column, commands) {
         var _a;
         var data = (_a = localBodyDataRef.current[item.id]) === null || _a === void 0 ? void 0 : _a.columns[column.id];