sheet-happens 0.0.27 → 0.0.29

package/dist/index.js

@@ -1623,7 +1623,7 @@ var makeCellLayout = function makeCellLayout(freeze, indent, offset, columns, ro
   };
 
   var getBaseOriginFor = function getBaseOriginFor(index, freeze, offset) {
-    return index < freeze ? 0 : offset;
+    return index < freeze ? 0 : offset + freeze;
   };
 
   var columnToPixel = function columnToPixel(column, anchor) {
@@ -1633,8 +1633,9 @@ var makeCellLayout = function makeCellLayout(freeze, indent, offset, columns, ro
 
     var base = getBaseOriginFor(column, freezeX, offsetX);
     var relative = columns.getStart(column) - columns.getStart(base);
+    var adjust = column < freezeX ? 0 : columns.getStart(freezeX) - columns.getStart(0);
     var size = column < 0 ? indentX : columns.getSize(column);
-    return column < 0 ? 0 : indentX + relative + anchor * size;
+    return column < 0 ? 0 : indentX + relative + adjust + anchor * size;
   };
 
   var rowToPixel = function rowToPixel(row, anchor) {
@@ -1644,8 +1645,9 @@ var makeCellLayout = function makeCellLayout(freeze, indent, offset, columns, ro
 
     var base = getBaseOriginFor(row, freezeY, offsetY);
     var relative = rows.getStart(row) - rows.getStart(base);
+    var adjust = row < freezeY ? 0 : rows.getStart(freezeY) - rows.getStart(0);
     var size = row < 0 ? indentY : rows.getSize(row);
-    return row < 0 ? 0 : indentY + relative + anchor * size;
+    return row < 0 ? 0 : indentY + relative + adjust + anchor * size;
   };
 
   var cellToPixel = function cellToPixel(cell, anchor) {
@@ -2563,7 +2565,7 @@ var excelHeaderString = function excelHeaderString(num) {
 };
 
 var Sheet = React.forwardRef(function (props, ref) {
-  var _props$secondarySelec, _props$inputComponent;
+  var _props$selection, _props$secondarySelec, _props$inputComponent;
 
   var canvasRef = React.useRef(null);
   var overlayRef = React.useRef(null);
@@ -2576,7 +2578,9 @@ var Sheet = React.forwardRef(function (props, ref) {
       dataOffset = _useState2[0],
       setDataOffset = _useState2[1];
 
-  var _useState3 = React.useState(NO_SELECTION),
+  var selectionProp = (_props$selection = props.selection) != null ? _props$selection : NO_SELECTION;
+
+  var _useState3 = React.useState(selectionProp),
       selection = _useState3[0],
       setSelection = _useState3[1];
 
@@ -2596,13 +2600,22 @@ var Sheet = React.forwardRef(function (props, ref) {
       editCell = _useState7[0],
       setEditCell = _useState7[1];
 
-  var _useState8 = React.useState(''),
-      editValue = _useState8[0],
-      setEditValue = _useState8[1];
+  var _useState8 = React.useState(selectionProp),
+      lastSelectionProp = _useState8[0],
+      setLastSelectionProp = _useState8[1];
 
-  var _useState9 = React.useState(false),
-      arrowKeyCommitMode = _useState9[0],
-      setArrowKeyCommitMode = _useState9[1];
+  if (lastSelectionProp !== selectionProp) {
+    setLastSelectionProp(selectionProp);
+    setSelection(selectionProp);
+  }
+
+  var _useState9 = React.useState(''),
+      editValue = _useState9[0],
+      setEditValue = _useState9[1];
+
+  var _useState10 = React.useState(false),
+      arrowKeyCommitMode = _useState10[0],
+      setArrowKeyCommitMode = _useState10[1];
 
   var _useResizeObserver = useResizeObserver({
     ref: canvasRef
@@ -2765,6 +2778,7 @@ var Sheet = React.forwardRef(function (props, ref) {
     setEditCell(editCell);
     setEditValue(val);
     setArrowKeyCommitMode(arrowKeyCommitMode);
+    setLastEditKey(editKeys.apply(void 0, editCell));
   };
 
   var hitmapRef = React.useRef(NO_CLICKABLES);
@@ -2910,16 +2924,9 @@ var Sheet = React.forwardRef(function (props, ref) {
     e.preventDefault();
   };
 
-  var editKey = editKeys ? editKeys.apply(void 0, editCell) : '';
-
-  var _useState10 = React.useState(editKey),
-      lastEditKey = _useState10[0],
-      setLastEditKey = _useState10[1];
-
-  if (editMode && lastEditKey !== editKey) {
-    setLastEditKey(editKey);
-    setEditCell(NO_CELL);
-  }
+  var _useState11 = React.useState(''),
+      lastEditKey = _useState11[0],
+      setLastEditKey = _useState11[1];
 
   var editTextPosition = ORIGIN;
   var editTextWidth = 0;
@@ -2933,6 +2940,12 @@ var Sheet = React.forwardRef(function (props, ref) {
     editTextWidth = cellWidth(editCellX) - 3;
     editTextHeight = cellHeight(editCellY) - 3;
     editTextTextAlign = style.textAlign || DEFAULT_CELL_STYLE.textAlign || 'left';
+    var editKey = editKeys.apply(void 0, editCell);
+
+    if (editKey !== lastEditKey) {
+      setLastEditKey('');
+      setEditCell(NO_CELL);
+    }
   }
 
   var _editTextPosition = editTextPosition,
@@ -2983,6 +2996,16 @@ var Sheet = React.forwardRef(function (props, ref) {
     canvasStyles.width = 'calc(100%)';
   }
 
+  var userRendered = React.useMemo(function () {
+    var _props$render;
+
+    return (_props$render = props.render) === null || _props$render === void 0 ? void 0 : _props$render.call(props, {
+      visibleCells: visibleCells,
+      cellLayout: cellLayout,
+      selection: selection,
+      editMode: editMode
+    });
+  }, [props.render, visibleCells, cellLayout, selection, editMode]);
   return React__default.createElement("div", {
     style: {
       position: 'relative',
@@ -3016,7 +3039,13 @@ var Sheet = React.forwardRef(function (props, ref) {
       height: 1,
       backgroundColor: 'rgba(0,0,0,0.0)'
     }
-  })), React__default.createElement("textarea", {
+  }), userRendered ? React__default.createElement("div", {
+    style: {
+      position: 'sticky',
+      left: 0,
+      top: 0
+    }
+  }, userRendered) : null), React__default.createElement("textarea", {
     style: {
       position: 'absolute',
       top: 0,