sheet-happens 0.0.17 → 0.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1 -0
- package/dist/index.js +26 -15
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +26 -15
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
package/dist/index.modern.js
CHANGED
|
@@ -81,7 +81,7 @@ var scrollSpeed = 30;
|
|
|
81
81
|
var resizeColumnRowMouseThreshold = 4;
|
|
82
82
|
var minimumColumnWidth = 50;
|
|
83
83
|
var minimumRowHeight = 22;
|
|
84
|
-
var rowColHeaderSelectionColor = '#
|
|
84
|
+
var rowColHeaderSelectionColor = '#cccccc';
|
|
85
85
|
var maxSearchableRowOrCol = 65536;
|
|
86
86
|
var defaultCellStyle = {
|
|
87
87
|
textAlign: 'left',
|
|
@@ -111,14 +111,7 @@ function resizeCanvas(canvas) {
|
|
|
111
111
|
width = _canvas$getBoundingCl.width,
|
|
112
112
|
height = _canvas$getBoundingCl.height;
|
|
113
113
|
|
|
114
|
-
var
|
|
115
|
-
_window$devicePixelRa = _window.devicePixelRatio,
|
|
116
|
-
ratio = _window$devicePixelRa === void 0 ? 1 : _window$devicePixelRa;
|
|
117
|
-
|
|
118
|
-
if (ratio < 1) {
|
|
119
|
-
ratio = 1;
|
|
120
|
-
}
|
|
121
|
-
|
|
114
|
+
var ratio = 2;
|
|
122
115
|
var newCanvasWidth = Math.round(width * ratio);
|
|
123
116
|
var newCanvasHeight = Math.round(height * ratio);
|
|
124
117
|
|
|
@@ -500,7 +493,7 @@ function findInDisplayData(displayData, start, direction) {
|
|
|
500
493
|
return i;
|
|
501
494
|
}
|
|
502
495
|
|
|
503
|
-
function renderOnCanvas(context, rowSizes, columnSizes, cellStyle, cellWidth, cellHeight, selection, knobDragInProgress, columnHeaders, columnHeaderStyle, knobArea, displayData, dataOffset, knobCoordinates) {
|
|
496
|
+
function renderOnCanvas(context, rowSizes, columnSizes, cellStyle, cellWidth, cellHeight, selection, knobDragInProgress, columnHeaders, columnHeaderStyle, knobArea, displayData, dataOffset, knobCoordinates, hideGridlines) {
|
|
504
497
|
resizeCanvas(context.canvas);
|
|
505
498
|
context.clearRect(0, 0, context.canvas.width, context.canvas.height);
|
|
506
499
|
context.fillStyle = 'white';
|
|
@@ -612,23 +605,41 @@ function renderOnCanvas(context, rowSizes, columnSizes, cellStyle, cellWidth, ce
|
|
|
612
605
|
context.strokeStyle = gridColor;
|
|
613
606
|
context.lineWidth = 1;
|
|
614
607
|
var startX = rowHeaderWidth;
|
|
608
|
+
var startY = columnHeaderHeight;
|
|
609
|
+
var xGridlineEnd = hideGridlines ? rowHeaderWidth : context.canvas.width;
|
|
610
|
+
var yGridlineEnd = hideGridlines ? columnHeaderHeight : context.canvas.height;
|
|
611
|
+
var first = true;
|
|
615
612
|
|
|
616
613
|
for (var _iterator3 = _createForOfIteratorHelperLoose(columnSizes.index), _step3; !(_step3 = _iterator3()).done;) {
|
|
617
614
|
var col = _step3.value;
|
|
618
615
|
context.beginPath();
|
|
619
616
|
context.moveTo(startX, 0);
|
|
620
|
-
|
|
617
|
+
|
|
618
|
+
if (first) {
|
|
619
|
+
context.lineTo(startX, context.canvas.height);
|
|
620
|
+
first = false;
|
|
621
|
+
} else {
|
|
622
|
+
context.lineTo(startX, yGridlineEnd);
|
|
623
|
+
}
|
|
624
|
+
|
|
621
625
|
context.stroke();
|
|
622
626
|
startX += cellWidth(col);
|
|
623
627
|
}
|
|
624
628
|
|
|
625
|
-
|
|
629
|
+
first = true;
|
|
626
630
|
|
|
627
631
|
for (var _iterator4 = _createForOfIteratorHelperLoose(rowSizes.index), _step4; !(_step4 = _iterator4()).done;) {
|
|
628
632
|
var row = _step4.value;
|
|
629
633
|
context.beginPath();
|
|
630
634
|
context.moveTo(0, startY);
|
|
631
|
-
|
|
635
|
+
|
|
636
|
+
if (first) {
|
|
637
|
+
context.lineTo(context.canvas.width, startY);
|
|
638
|
+
first = false;
|
|
639
|
+
} else {
|
|
640
|
+
context.lineTo(xGridlineEnd, startY);
|
|
641
|
+
}
|
|
642
|
+
|
|
632
643
|
context.stroke();
|
|
633
644
|
startY += cellHeight(row);
|
|
634
645
|
}
|
|
@@ -1241,12 +1252,12 @@ function Sheet(props) {
|
|
|
1241
1252
|
}
|
|
1242
1253
|
|
|
1243
1254
|
var animationFrameId = window.requestAnimationFrame(function () {
|
|
1244
|
-
renderOnCanvas(context, rowSizes, columnSizes, cellStyle, cellWidth, cellHeight, selection, knobDragInProgress, columnHeaders, columnHeaderStyle, knobArea, displayData, dataOffset, knobCoordinates);
|
|
1255
|
+
renderOnCanvas(context, rowSizes, columnSizes, cellStyle, cellWidth, cellHeight, selection, knobDragInProgress, columnHeaders, columnHeaderStyle, knobArea, displayData, dataOffset, knobCoordinates, props.hideGridlines || false);
|
|
1245
1256
|
});
|
|
1246
1257
|
return function () {
|
|
1247
1258
|
window.cancelAnimationFrame(animationFrameId);
|
|
1248
1259
|
};
|
|
1249
|
-
}, [canvasRef, rowSizes, columnSizes, cellStyle, cellWidth, cellHeight, selection, knobDragInProgress, columnHeaders, columnHeaderStyle, knobArea, displayData, dataOffset, knobCoordinates]);
|
|
1260
|
+
}, [canvasRef, rowSizes, columnSizes, cellStyle, cellWidth, cellHeight, selection, knobDragInProgress, columnHeaders, columnHeaderStyle, knobArea, displayData, dataOffset, knobCoordinates, props.hideGridlines]);
|
|
1250
1261
|
|
|
1251
1262
|
var setFocusToTextArea = function setFocusToTextArea() {
|
|
1252
1263
|
if (copyPasteTextAreaRef.current) {
|