@extend-ai/react-xlsx 0.8.2 → 0.8.3

package/dist/index.js

@@ -20956,7 +20956,7 @@ function XlsxGrid({
   renderImageSelection,
   renderTableHeaderMenu,
   enableGestureZoom = true,
-  experimentalCanvas = false,
+  experimentalCanvas = true,
   selectionColor,
   selectionFillColor,
   selectionHeaderColor,
@@ -22396,17 +22396,17 @@ function XlsxGrid({
   }, []);
   const resolvePointerCellFromClient = React4.useCallback((clientX, clientY) => {
     const geometryCell = resolvePointerCellFromGeometry(clientX, clientY);
-    if (geometryCell && !worksheet?.isMergedSecondary(geometryCell.row, geometryCell.col)) {
-      return resolveMergeAnchorCell(geometryCell);
+    if (geometryCell) {
+      return geometryCell;
     }
-    const resolvedCell = resolvePointerCellFromHitTest(clientX, clientY) ?? geometryCell;
+    const resolvedCell = resolvePointerCellFromHitTest(clientX, clientY);
     return resolvedCell ? resolveMergeAnchorCell(resolvedCell) : null;
-  }, [resolveMergeAnchorCell, resolvePointerCellFromGeometry, resolvePointerCellFromHitTest, worksheet]);
+  }, [resolveMergeAnchorCell, resolvePointerCellFromGeometry, resolvePointerCellFromHitTest]);
   const resolveDraggedSelectionCell = React4.useCallback((dragState, clientX, clientY) => {
     const geometryCell = resolvePointerCellFromGeometry(clientX, clientY);
     const hitCell = resolvePointerCellFromHitTest(clientX, clientY);
-    const actualRow = hitCell && rowIndexByActual.has(hitCell.row) ? hitCell.row : geometryCell?.row;
-    const actualCol = hitCell?.col ?? geometryCell?.col;
+    const actualRow = geometryCell?.row ?? (hitCell && rowIndexByActual.has(hitCell.row) ? hitCell.row : void 0);
+    const actualCol = geometryCell?.col ?? hitCell?.col;
     if (actualRow === void 0 || actualCol === void 0) {
       return null;
     }
@@ -22416,8 +22416,8 @@ function XlsxGrid({
     if (dragState.axis === "column") {
       return { row: dragState.originCell.row, col: actualCol };
     }
-    return resolveMergeAnchorCell({ row: actualRow, col: actualCol });
-  }, [resolveMergeAnchorCell, resolvePointerCellFromGeometry, resolvePointerCellFromHitTest, rowIndexByActual]);
+    return { row: actualRow, col: actualCol };
+  }, [resolvePointerCellFromGeometry, resolvePointerCellFromHitTest, rowIndexByActual]);
   const resolveCellPointerOrigin = React4.useCallback((cell, rect, clientX, clientY) => {
     const rowIndex = rowIndexByActual.get(cell.row);
     const colIndex = colIndexByActual.get(cell.col);
@@ -22435,6 +22435,40 @@ function XlsxGrid({
       originContentY: (rowPrefixSums[rowIndex] ?? 0) + clampContentOffset((clientY - rect.top) / contentScaleY, displayHeight)
     };
   }, [colIndexByActual, colPrefixSums, displayDefaultColWidth, displayDefaultRowHeight, displayEffectiveColWidths, displayEffectiveRowHeights, rowIndexByActual, rowPrefixSums]);
+  const resolveCellPointerOriginFromClient = React4.useCallback((cell, clientX, clientY) => {
+    const scroller = scrollRef.current;
+    const rowIndex = rowIndexByActual.get(cell.row);
+    const colIndex = colIndexByActual.get(cell.col);
+    if (!scroller || rowIndex === void 0 || colIndex === void 0) {
+      return null;
+    }
+    const scrollerRect = cachedScrollerRectRef.current ?? scroller.getBoundingClientRect();
+    const pointerOffsetX = clientX - scrollerRect.left;
+    const pointerOffsetY = clientY - scrollerRect.top;
+    const localX = pointerOffsetX + (pointerOffsetX >= frozenPaneRight ? scroller.scrollLeft : 0);
+    const localY = pointerOffsetY + (pointerOffsetY >= frozenPaneBottom ? scroller.scrollTop : 0);
+    const displayWidth = displayEffectiveColWidths[colIndex] ?? displayDefaultColWidth;
+    const displayHeight = displayEffectiveRowHeights[rowIndex] ?? displayDefaultRowHeight;
+    return {
+      contentScaleX: 1,
+      contentScaleY: 1,
+      originContentX: (colPrefixSums[colIndex] ?? 0) + clampContentOffset(localX - displayRowHeaderWidth - (colPrefixSums[colIndex] ?? 0), displayWidth),
+      originContentY: (rowPrefixSums[rowIndex] ?? 0) + clampContentOffset(localY - displayHeaderHeight - (rowPrefixSums[rowIndex] ?? 0), displayHeight)
+    };
+  }, [
+    colIndexByActual,
+    colPrefixSums,
+    displayDefaultColWidth,
+    displayDefaultRowHeight,
+    displayEffectiveColWidths,
+    displayEffectiveRowHeights,
+    displayHeaderHeight,
+    displayRowHeaderWidth,
+    frozenPaneBottom,
+    frozenPaneRight,
+    rowIndexByActual,
+    rowPrefixSums
+  ]);
   const resolveRowPointerOrigin = React4.useCallback((actualRow, rect, clientY) => {
     const rowIndex = rowIndexByActual.get(actualRow);
     if (rowIndex === void 0) {
@@ -23183,10 +23217,11 @@ function XlsxGrid({
   }, [resolveMountedCellOverlayRect]);
   const resolveGeometryOverlayRect = React4.useCallback((range) => {
     const normalized = normalizeRange2(range);
-    const startCell = resolveMergeAnchorCell(normalized.start);
     const isSingleCellSelection = normalized.start.row === normalized.end.row && normalized.start.col === normalized.end.col;
-    const merge = isSingleCellSelection ? worksheet?.getMergeSpan(startCell.row, startCell.col) : null;
-    const endCell = isSingleCellSelection ? {
+    const isMergedSecondarySelection = isSingleCellSelection ? worksheet?.isMergedSecondary(normalized.start.row, normalized.start.col) === true : false;
+    const startCell = isSingleCellSelection && !isMergedSecondarySelection ? resolveMergeAnchorCell(normalized.start) : normalized.start;
+    const merge = isSingleCellSelection && !isMergedSecondarySelection ? worksheet?.getMergeSpan(startCell.row, startCell.col) : null;
+    const endCell = isSingleCellSelection && !isMergedSecondarySelection ? {
       row: startCell.row + Math.max(1, merge?.rowSpan ?? 1) - 1,
       col: startCell.col + Math.max(1, merge?.colSpan ?? 1) - 1
     } : normalized.end;
@@ -23818,13 +23853,14 @@ function XlsxGrid({
     }
     event.preventDefault();
     focusGrid();
+    const targetCell = event.currentTarget.colSpan > 1 || event.currentTarget.rowSpan > 1 ? resolvePointerCellFromGeometry(event.clientX, event.clientY) ?? cell : cell;
     const currentSelection = selectionRef.current;
-    const anchor = event.shiftKey && currentSelection ? currentSelection.start : cell;
-    const initialRange = normalizeRange2({ start: anchor, end: cell });
-    const isActive = isSameCell(activeCellRef.current, cell);
+    const anchor = event.shiftKey && currentSelection ? currentSelection.start : targetCell;
+    const initialRange = normalizeRange2({ start: anchor, end: targetCell });
+    const isActive = isSameCell(activeCellRef.current, targetCell);
     const committedOnPointerDown = !isActive || !editingCellRef.current;
-    const pointerOrigin = resolveCellPointerOrigin(cell, event.currentTarget.getBoundingClientRect(), event.clientX, event.clientY);
-    const originOverlayRect = resolveMountedCellOverlayRect(event.currentTarget);
+    const pointerOrigin = targetCell.row === cell.row && targetCell.col === cell.col ? resolveCellPointerOrigin(cell, event.currentTarget.getBoundingClientRect(), event.clientX, event.clientY) : resolveCellPointerOriginFromClient(targetCell, event.clientX, event.clientY);
+    const originOverlayRect = targetCell.row === cell.row && targetCell.col === cell.col ? resolveMountedCellOverlayRect(event.currentTarget) : resolveOverlayRect(initialRange);
     if (!pointerOrigin) {
       return;
     }
@@ -23832,7 +23868,7 @@ function XlsxGrid({
       event.pointerId,
       anchor,
       "cell",
-      cell,
+      targetCell,
       pointerOrigin,
       originOverlayRect,
       committedOnPointerDown,
@@ -23840,11 +23876,25 @@ function XlsxGrid({
       event.clientX,
       event.clientY
     );
-    applyPreviewOverlayFromElement(event.currentTarget, initialRange);
+    if (targetCell.row === cell.row && targetCell.col === cell.col) {
+      applyPreviewOverlayFromElement(event.currentTarget, initialRange);
+    } else {
+      applyPreviewOverlay(initialRange);
+    }
     if (committedOnPointerDown) {
       commitSelectionRange(initialRange);
     }
-  }, [applyPreviewOverlayFromElement, commitSelectionRange, focusGrid, resolveCellPointerOrigin, resolveMountedCellOverlayRect]);
+  }, [
+    applyPreviewOverlay,
+    applyPreviewOverlayFromElement,
+    commitSelectionRange,
+    focusGrid,
+    resolveCellPointerOrigin,
+    resolveCellPointerOriginFromClient,
+    resolveMountedCellOverlayRect,
+    resolveOverlayRect,
+    resolvePointerCellFromGeometry
+  ]);
   const handleRowPointerDown = React4.useCallback((event, actualRow) => {
     if (event.button !== 0 || firstVisibleCol === void 0 || lastVisibleCol === void 0) {
       return;
@@ -27089,7 +27139,7 @@ function XlsxViewerInner({
   enableCanvasSelectionAnimation = true,
   enableGestureZoom = true,
   errorState,
-  experimentalCanvas = false,
+  experimentalCanvas = true,
   fileTooLargeState,
   height,
   isDark = false,