react-datasheet-grid - npm Package Compare versions

Comparing version 2.0.11 to 3.0.0

dist/columns/checkboxColumn.js

@@ -75,3 +75,7 @@ "use strict";
     },
+    isCellEmpty: function (_a) {
+        var rowData = _a.rowData;
+        return !rowData;
+    },
 };
 //# sourceMappingURL=checkboxColumn.js.map

dist/columns/dateColumn.js

@@ -71,3 +71,7 @@ "use strict";
     minWidth: 170,
+    isCellEmpty: function (_a) {
+        var rowData = _a.rowData;
+        return !rowData;
+    },
 };
 //# sourceMappingURL=dateColumn.js.map

dist/columns/floatColumn.js

@@ -100,3 +100,7 @@ "use strict";
     },
+    isCellEmpty: function (_a) {
+        var rowData = _a.rowData;
+        return rowData === null || rowData === undefined;
+    },
 };
 //# sourceMappingURL=floatColumn.js.map

dist/columns/intColumn.js

@@ -91,3 +91,7 @@ "use strict";
     },
+    isCellEmpty: function (_a) {
+        var rowData = _a.rowData;
+        return rowData === null || rowData === undefined;
+    },
 };
 //# sourceMappingURL=intColumn.js.map

dist/columns/keyColumn.js

@@ -99,4 +99,8 @@ "use strict";
         }
-        : column.cellClassName })); };
+        : column.cellClassName, isCellEmpty: function (_a) {
+        var _b, _c;
+        var rowData = _a.rowData, rowIndex = _a.rowIndex;
+        return (_c = (_b = column.isCellEmpty) === null || _b === void 0 ? void 0 : _b.call(column, { rowData: rowData[key], rowIndex: rowIndex })) !== null && _c !== void 0 ? _c : false;
+    } })); };
 exports.keyColumn = keyColumn;
 //# sourceMappingURL=keyColumn.js.map

dist/columns/percentColumn.js

@@ -108,3 +108,7 @@ "use strict";
     },
+    isCellEmpty: function (_a) {
+        var rowData = _a.rowData;
+        return rowData === null || rowData === undefined;
+    },
 };
 //# sourceMappingURL=percentColumn.js.map

dist/columns/textColumn.js

@@ -69,3 +69,7 @@ "use strict";
     },
+    isCellEmpty: function (_a) {
+        var rowData = _a.rowData;
+        return !rowData;
+    },
 };
 //# sourceMappingURL=textColumn.js.map

dist/components/DataSheetGrid.js

@@ -123,10 +123,6 @@ "use strict";
 };
-var DEFAULT_IS_ROW_EMPTY = function (_a) {
-    var rowData = _a.rowData;
-    return Object.values(rowData).every(function (value) { return !value; });
-};
 // eslint-disable-next-line react/display-name
 exports.DataSheetGrid = react_1.default.memo(react_1.default.forwardRef(function (_a, ref) {
     var _b, _c, _d, _e;
-    var _f = _a.data, data = _f === void 0 ? DEFAULT_DATA : _f, className = _a.className, style = _a.style, _g = _a.height, maxHeight = _g === void 0 ? 400 : _g, _h = _a.onChange, onChange = _h === void 0 ? DEFAULT_ON_CHANGE : _h, _j = _a.columns, rawColumns = _j === void 0 ? DEFAULT_COLUMNS : _j, _k = _a.rowHeight, rowHeight = _k === void 0 ? 40 : _k, _l = _a.headerRowHeight, headerRowHeight = _l === void 0 ? rowHeight : _l, gutterColumn = _a.gutterColumn, stickyRightColumn = _a.stickyRightColumn, _m = _a.addRowsComponent, AddRowsComponent = _m === void 0 ? AddRows_1.AddRows : _m, _o = _a.createRow, createRow = _o === void 0 ? DEFAULT_CREATE_ROW : _o, _p = _a.autoAddRow, autoAddRow = _p === void 0 ? false : _p, _q = _a.lockRows, lockRows = _q === void 0 ? false : _q, _r = _a.duplicateRow, duplicateRow = _r === void 0 ? DEFAULT_DUPLICATE_ROW : _r, _s = _a.isRowEmpty, isRowEmpty = _s === void 0 ? DEFAULT_IS_ROW_EMPTY : _s, _t = _a.contextMenuComponent, ContextMenuComponent = _t === void 0 ? ContextMenu_1.ContextMenu : _t, _u = _a.disableContextMenu, disableContextMenuRaw = _u === void 0 ? false : _u;
+    var _f = _a.data, data = _f === void 0 ? DEFAULT_DATA : _f, className = _a.className, style = _a.style, _g = _a.height, maxHeight = _g === void 0 ? 400 : _g, _h = _a.onChange, onChange = _h === void 0 ? DEFAULT_ON_CHANGE : _h, _j = _a.columns, rawColumns = _j === void 0 ? DEFAULT_COLUMNS : _j, _k = _a.rowHeight, rowHeight = _k === void 0 ? 40 : _k, _l = _a.headerRowHeight, headerRowHeight = _l === void 0 ? rowHeight : _l, gutterColumn = _a.gutterColumn, stickyRightColumn = _a.stickyRightColumn, _m = _a.addRowsComponent, AddRowsComponent = _m === void 0 ? AddRows_1.AddRows : _m, _o = _a.createRow, createRow = _o === void 0 ? DEFAULT_CREATE_ROW : _o, _p = _a.autoAddRow, autoAddRow = _p === void 0 ? false : _p, _q = _a.lockRows, lockRows = _q === void 0 ? false : _q, _r = _a.duplicateRow, duplicateRow = _r === void 0 ? DEFAULT_DUPLICATE_ROW : _r, _s = _a.contextMenuComponent, ContextMenuComponent = _s === void 0 ? ContextMenu_1.ContextMenu : _s, _t = _a.disableContextMenu, disableContextMenuRaw = _t === void 0 ? false : _t;
     var disableContextMenu = disableContextMenuRaw || lockRows;
@@ -142,24 +138,24 @@ var columns = useColumns_1.useColumns(rawColumns, gutterColumn, stickyRightColumn);
     }, [headerRowHeight, rowHeight]);
-    var _v = __read(useDebounceState_1.useDebounceState(0, 100), 2), heightDiff = _v[0], setHeightDiff = _v[1];
+    var _u = __read(useDebounceState_1.useDebounceState(0, 100), 2), heightDiff = _u[0], setHeightDiff = _u[1];
     // Height of the list (including scrollbars and borders) to display
     var displayHeight = Math.min(maxHeight, headerRowHeight + data.length * rowHeight + heightDiff);
     // Width and height of the scrollable area
-    var _w = react_resize_detector_1.useResizeDetector({
+    var _v = react_resize_detector_1.useResizeDetector({
         targetRef: outerRef,
         refreshMode: 'throttle',
         refreshRate: 100,
-    }), width = _w.width, height = _w.height;
+    }), width = _v.width, height = _v.height;
     setHeightDiff(height ? displayHeight - height : 0);
     var edges = useEdges_1.useEdges(outerRef, width, height);
-    var _x = useColumnWidths_1.useColumnWidths(columns, width), fullWidth = _x.fullWidth, contentWidth = _x.totalWidth, columnWidths = _x.columnWidths, columnRights = _x.columnRights;
+    var _w = useColumnWidths_1.useColumnWidths(columns, width), fullWidth = _w.fullWidth, contentWidth = _w.totalWidth, columnWidths = _w.columnWidths, columnRights = _w.columnRights;
     // x,y coordinates of the right click
-    var _y = __read(react_1.useState(null), 2), contextMenu = _y[0], setContextMenu = _y[1];
+    var _x = __read(react_1.useState(null), 2), contextMenu = _x[0], setContextMenu = _x[1];
     // Items of the context menu
-    var _z = __read(react_1.useState([]), 2), contextMenuItems = _z[0], setContextMenuItems = _z[1];
+    var _y = __read(react_1.useState([]), 2), contextMenuItems = _y[0], setContextMenuItems = _y[1];
     // True when the active cell is being edited
-    var _0 = __read(react_1.useState(false), 2), editing = _0[0], setEditing = _0[1];
+    var _z = __read(react_1.useState(false), 2), editing = _z[0], setEditing = _z[1];
     // Highlighted cell, null when not focused
-    var _1 = __read(useDeepEqualState_1.useDeepEqualState(null), 2), activeCell = _1[0], setActiveCell = _1[1];
+    var _0 = __read(useDeepEqualState_1.useDeepEqualState(null), 2), activeCell = _0[0], setActiveCell = _0[1];
     // The selection cell and the active cell are the two corners of the selection, null when nothing is selected
-    var _2 = __read(useDeepEqualState_1.useDeepEqualState(null), 2), selectionCell = _2[0], setSelectionCell = _2[1];
+    var _1 = __read(useDeepEqualState_1.useDeepEqualState(null), 2), selectionCell = _1[0], setSelectionCell = _1[1];
     // Min and max of the current selection (rectangle defined by the active cell and the selection cell), null when nothing is selected
@@ -180,3 +176,3 @@ var selection = react_1.useMemo(function () {
     // Behavior of the selection when the user drags the mouse around
-    var _3 = __read(useDeepEqualState_1.useDeepEqualState({
+    var _2 = __read(useDeepEqualState_1.useDeepEqualState({
         // True when the position of the cursor should impact the columns of the selection
@@ -188,3 +184,3 @@ columns: false,
         active: false,
-    }), 2), selectionMode = _3[0], setSelectionMode = _3[1];
+    }), 2), selectionMode = _2[0], setSelectionMode = _2[1];
     var getInnerBoundingClientRect = useGetBoundingClientRect_1.useGetBoundingClientRect(innerRef);
@@ -379,3 +375,5 @@ var getOuterBoundingClientRect = useGetBoundingClientRect_1.useGetBoundingClientRect(outerRef);
             .every(function (rowData, i) {
-            return isRowEmpty({ rowData: rowData, rowIndex: i + min.row });
+            return columns.every(function (column) {
+                return column.isCellEmpty({ rowData: rowData, rowIndex: i + min.row });
+            });
         })) {
@@ -417,3 +415,2 @@ if (smartDelete) {
         isCellDisabled,
-        isRowEmpty,
         onChange,
@@ -420,0 +417,0 @@ selection === null || selection === void 0 ? void 0 : selection.max,

dist/components/StaticDataSheetGrid.js

@@ -49,3 +49,3 @@ "use strict";
 exports.StaticDataSheetGrid = react_2.default.forwardRef(function (_a, ref) {
-    var columns = _a.columns, gutterColumn = _a.gutterColumn, stickyRightColumn = _a.stickyRightColumn, addRowsComponent = _a.addRowsComponent, createRow = _a.createRow, duplicateRow = _a.duplicateRow, isRowEmpty = _a.isRowEmpty, rest = __rest(_a, ["columns", "gutterColumn", "stickyRightColumn", "addRowsComponent", "createRow", "duplicateRow", "isRowEmpty"]);
+    var columns = _a.columns, gutterColumn = _a.gutterColumn, stickyRightColumn = _a.stickyRightColumn, addRowsComponent = _a.addRowsComponent, createRow = _a.createRow, duplicateRow = _a.duplicateRow, rest = __rest(_a, ["columns", "gutterColumn", "stickyRightColumn", "addRowsComponent", "createRow", "duplicateRow"]);
     var _b = __read(react_1.useState({
@@ -58,3 +58,2 @@ columns: columns,
         duplicateRow: duplicateRow,
-        isRowEmpty: isRowEmpty,
     }), 1), staticProps = _b[0];
@@ -61,0 +60,0 @@ return react_2.default.createElement(DataSheetGrid_1.DataSheetGrid, __assign({}, staticProps, rest, { ref: ref }));

dist/hooks/useColumns.js

@@ -57,2 +57,3 @@ "use strict";
 var defaultComponent = function () { return react_1.default.createElement(react_1.default.Fragment, null); };
+var defaultIsCellEmpty = function () { return false; };
 var identityRow = function (_a) {
@@ -67,11 +68,12 @@ var rowData = _a.rowData;
 };
+var cellAlwaysEmpty = function () { return true; };
 var useColumns = function (columns, gutterColumn, stickyRightColumn) {
     return react_1.useMemo(function () {
         var partialColumns = __spreadArray([
-            __assign({ width: '0 0 40px', minWidth: 0, title: react_1.default.createElement("div", { className: "dsg-corner-indicator" }), component: defaultGutterComponent }, gutterColumn)
+            __assign({ width: '0 0 40px', minWidth: 0, title: react_1.default.createElement("div", { className: "dsg-corner-indicator" }), component: defaultGutterComponent, isCellEmpty: cellAlwaysEmpty }, gutterColumn)
         ], __read(columns));
         if (stickyRightColumn) {
-            partialColumns.push(__assign({ width: '0 0 40px', minWidth: 0 }, stickyRightColumn));
+            partialColumns.push(__assign(__assign({ width: '0 0 40px', minWidth: 0 }, stickyRightColumn), { isCellEmpty: cellAlwaysEmpty }));
         }
-        return partialColumns.map(function (column) { return (__assign({ width: 1, minWidth: 100, renderWhenScrolling: true, component: defaultComponent, disableKeys: false, disabled: false, keepFocus: false, deleteValue: identityRow, copyValue: defaultCopyValue, pasteValue: identityRow }, column)); });
+        return partialColumns.map(function (column) { return (__assign({ width: 1, minWidth: 100, renderWhenScrolling: true, component: defaultComponent, disableKeys: false, disabled: false, keepFocus: false, deleteValue: identityRow, copyValue: defaultCopyValue, pasteValue: identityRow, isCellEmpty: defaultIsCellEmpty }, column)); });
     }, [gutterColumn, stickyRightColumn, columns]);
@@ -78,0 +80,0 @@ };

dist/types.d.ts

@@ -61,2 +61,6 @@ import React from 'react';
     }) => T;
+    isCellEmpty: (opt: {
+        rowData: T;
+        rowIndex: number;
+    }) => boolean;
 };
@@ -165,6 +169,2 @@ export declare type ListItemData<T> = {
     }) => T;
-    isRowEmpty?: ({ rowData }: {
-        rowData: T;
-        rowIndex: number;
-    }) => boolean;
     autoAddRow?: boolean;
@@ -171,0 +171,0 @@ lockRows?: boolean;

package.json

 {
   "name": "react-datasheet-grid",
-  "version": "2.0.11",
+  "version": "3.0.0",
   "description": "An Excel-like React component to create beautiful spreadsheets.",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

243305

increased by0.67%

Lines of code

3326

increased by0.79%

No dependency changes