@canvas-components/pivot-table 0.1.7 → 0.1.9

package/dist/index.cjs

@@ -995,7 +995,7 @@ function computePivotScrollbarLayout(params) {
   }
   if (hasVertical) {
     const fullHeight = Math.max(
-      params.bodyHeight - VERTICAL_TOP_INSET - (hasHorizontal ? SCROLLBAR_THICKNESS : 0),
+      params.bodyHeight - VERTICAL_TOP_INSET,
       0
     );
     const buttonSize = Math.min(SCROLLBAR_THICKNESS, fullHeight / 3);
@@ -1051,6 +1051,7 @@ var DEFAULT_ROW_HEIGHT = 40;
 var DEFAULT_COLUMN_WIDTH = 120;
 var DEFAULT_HEADER_SIZE = 40;
 var DEFAULT_ROW_DIMENSION_WIDTH2 = 140;
+var SCROLLBAR_THICKNESS2 = 10;
 function buildPivotLayoutSnapshot(params) {
   const { model, options, visibleRowNodes, visibleColumnNodes, width, height } = params;
   const indicatorLayout = options.indicatorLayout ?? "columns";
@@ -1083,8 +1084,8 @@ function buildPivotLayoutSnapshot(params) {
   const columnHeaderHeight = columnHeaderLevels * DEFAULT_HEADER_SIZE;
   const reportFilterHeight = (options.filterDimensions?.length ?? 0) * rowHeight;
   const tableHeaderHeight = reportFilterHeight + columnHeaderHeight;
-  const bodyWidth = Math.max(width - rowHeaderWidth, 0);
-  const availableBodyHeight = Math.max(height - tableHeaderHeight, 0);
+  const rawBodyWidth = Math.max(width - rowHeaderWidth, 0);
+  const rawAvailableBodyHeight = Math.max(height - tableHeaderHeight, 0);
   const rowSlots = createPivotAxisSlots({
     nodes: visibleRowNodes,
     indicators: options.indicators.map((indicator) => indicator.key),
@@ -1107,19 +1108,52 @@ function buildPivotLayoutSnapshot(params) {
   const columnOffsets = createOffsets(columnWidths);
   const totalBodyWidth = columnOffsets[columnOffsets.length - 1] ?? 0;
   const totalBodyHeight = rowSlots.length * rowHeight;
+  let hasHorizontalScrollbar = totalBodyWidth > rawBodyWidth;
+  let hasVerticalScrollbar = totalBodyHeight > rawAvailableBodyHeight;
+  for (let index = 0; index < 2; index += 1) {
+    hasHorizontalScrollbar = totalBodyWidth > Math.max(
+      rawBodyWidth - (hasVerticalScrollbar ? SCROLLBAR_THICKNESS2 : 0),
+      0
+    );
+    hasVerticalScrollbar = totalBodyHeight > Math.max(
+      rawAvailableBodyHeight - (hasHorizontalScrollbar ? SCROLLBAR_THICKNESS2 : 0),
+      0
+    );
+  }
+  const bodyWidth = Math.max(
+    rawBodyWidth - (hasVerticalScrollbar ? SCROLLBAR_THICKNESS2 : 0),
+    0
+  );
+  const availableBodyHeight = Math.max(
+    rawAvailableBodyHeight - (hasHorizontalScrollbar ? SCROLLBAR_THICKNESS2 : 0),
+    0
+  );
+  const frozenBottomRowRange = resolveFrozenBottomRowRange(rowSlots);
+  const frozenBottomRowCount = frozenBottomRowRange ? frozenBottomRowRange.end - frozenBottomRowRange.start : 0;
+  const frozenBottomHeight = frozenBottomRowCount * rowHeight;
+  const scrollableRowCount = frozenBottomRowRange?.start ?? rowSlots.length;
+  const totalScrollableBodyHeight = scrollableRowCount * rowHeight;
   const tableWidth = rowHeaderWidth + Math.min(bodyWidth, totalBodyWidth);
   const bodyHeight = Math.min(availableBodyHeight, totalBodyHeight);
-  const fittedHeight = tableHeaderHeight + bodyHeight;
+  const visibleFrozenBottomHeight = Math.min(frozenBottomHeight, bodyHeight);
+  const scrollableBodyHeight = Math.max(
+    bodyHeight - visibleFrozenBottomHeight,
+    0
+  );
+  const fittedHeight = tableHeaderHeight + bodyHeight + (hasHorizontalScrollbar ? SCROLLBAR_THICKNESS2 : 0);
   const maxScrollLeft = Math.max(totalBodyWidth - bodyWidth, 0);
-  const maxScrollTop = Math.max(totalBodyHeight - bodyHeight, 0);
+  const maxScrollTop = Math.max(
+    totalScrollableBodyHeight - scrollableBodyHeight,
+    0
+  );
   const scroll = {
     left: utils.clamp(params.scroll.left, 0, maxScrollLeft),
     top: utils.clamp(params.scroll.top, 0, maxScrollTop)
   };
   const visibleRowRange = resolveVisibleRange({
-    count: rowSlots.length,
+    count: scrollableRowCount,
     itemSize: rowHeight,
-    viewportSize: bodyHeight,
+    viewportSize: scrollableBodyHeight,
     offset: scroll.top,
     overscan: options.overscanRowCount ?? 1
   });
@@ -1154,6 +1188,23 @@ function buildPivotLayoutSnapshot(params) {
     dimensionCount: options.rows.length,
     indicators: options.indicators
   });
+  if (frozenBottomRowRange) {
+    rowHeaderCells.push(
+      ...buildRowHeaderCells({
+        model,
+        options,
+        slots: rowSlots,
+        range: frozenBottomRowRange,
+        rowHeight,
+        rowDimensionWidths,
+        columnHeaderHeight: tableHeaderHeight,
+        scrollTop: frozenBottomRowRange.start * rowHeight - scrollableBodyHeight,
+        expandedNodeIds: params.expandedRowNodeIds,
+        dimensionCount: options.rows.length,
+        indicators: options.indicators
+      })
+    );
+  }
   const columnHeaderCells = buildColumnHeaderCells({
     model,
     options,
@@ -1180,14 +1231,34 @@ function buildPivotLayoutSnapshot(params) {
     columnHeaderHeight: tableHeaderHeight,
     scroll
   });
+  if (frozenBottomRowRange) {
+    bodyCells.push(
+      ...buildBodyCells({
+        model,
+        rowSlots,
+        columnSlots,
+        rowRange: frozenBottomRowRange,
+        columnRange: visibleColumnRange,
+        rowHeight,
+        columnWidths,
+        columnOffsets,
+        rowHeaderWidth,
+        columnHeaderHeight: tableHeaderHeight,
+        scroll: {
+          left: scroll.left,
+          top: frozenBottomRowRange.start * rowHeight - scrollableBodyHeight
+        }
+      })
+    );
+  }
   const scrollbar = computePivotScrollbarLayout({
-    width,
+    width: tableWidth + (hasVerticalScrollbar ? SCROLLBAR_THICKNESS2 : 0),
     height: fittedHeight,
     bodyTop: tableHeaderHeight,
-    bodyHeight,
+    bodyHeight: scrollableBodyHeight,
     bodyWidth,
     totalBodyWidth,
-    totalBodyHeight,
+    totalBodyHeight: totalScrollableBodyHeight,
     scrollLeft: scroll.left,
     scrollTop: scroll.top,
     maxScrollLeft,
@@ -1239,6 +1310,7 @@ function buildPivotLayoutSnapshot(params) {
     rowSlots,
     columnSlots,
     visibleRowRange,
+    frozenBottomRowRange,
     visibleColumnRange,
     reportFilterCells,
     rowFieldHeaderCells,
@@ -1373,6 +1445,13 @@ function createAxisSlot(node, indicatorKey) {
     kind: node?.kind ?? "empty"
   };
 }
+function resolveFrozenBottomRowRange(slots) {
+  let start = slots.length;
+  while (start > 0 && slots[start - 1]?.kind === "grandTotal") {
+    start -= 1;
+  }
+  return start < slots.length ? { start, end: slots.length } : null;
+}
 function buildRowHeaderCells(params) {
   const cells = [];
   for (let rowIndex = params.range.start; rowIndex < params.range.end; rowIndex += 1) {
@@ -2613,22 +2692,6 @@ function createPivotDomHost(container) {
     }
   };
 }
-async function writePivotClipboardText(text, ownerDocument) {
-  const syncCopied = utils.copyTextSync(text, ownerDocument);
-  logPivotClipboard("sync-copy-result", { copied: syncCopied });
-  if (syncCopied) return true;
-  const copied = await utils.copyText(text, ownerDocument);
-  logPivotClipboard("copy-result", { copied });
-  return copied;
-}
-function copyPivotClipboardTextSync(text, ownerDocument) {
-  const copied = utils.copyTextSync(text, ownerDocument);
-  logPivotClipboard("sync-copy-result", { copied });
-  return copied;
-}
-function logPivotClipboard(stage, detail) {
-  console.info(`[PivotTable:clipboard] ${stage}`, detail);
-}
 
 // src/adapters/canvas-host.ts
 function resizePivotCanvas(canvas, width, height) {
@@ -2651,8 +2714,8 @@ function resolvePivotSelectionRect(layout, selection) {
   const kind = resolvePivotSelectionKind(selection);
   const startX = kind === "row" || kind === "row-cell" ? layout.rowHeaderRect.x : layout.bodyRect.x + (layout.columnOffsets[indexes.startColumnIndex] ?? 0) - layout.scroll.left;
   const endX = layout.bodyRect.x + (layout.columnOffsets[indexes.endColumnIndex] ?? 0) + (layout.columnWidths[indexes.endColumnIndex] ?? layout.columnWidth) - layout.scroll.left;
-  const startY = kind === "column" ? layout.columnHeaderRect.y : layout.bodyRect.y + indexes.startRowIndex * layout.rowHeight - layout.scroll.top;
-  const endY = layout.bodyRect.y + (indexes.endRowIndex + 1) * layout.rowHeight - layout.scroll.top;
+  const startY = kind === "column" ? layout.columnHeaderRect.y : resolvePivotRowTop(layout, indexes.startRowIndex);
+  const endY = resolvePivotRowTop(layout, indexes.endRowIndex) + layout.rowHeight;
   const clipRect = resolvePivotSelectionClipRect(layout, selection);
   const visibleStartX = Math.max(startX, clipRect.x);
   const visibleEndX = Math.min(endX, clipRect.x + clipRect.width);
@@ -2666,6 +2729,13 @@ function resolvePivotSelectionRect(layout, selection) {
     height: visibleEndY - visibleStartY
   };
 }
+function resolvePivotRowTop(layout, rowIndex) {
+  const frozenRange = layout.frozenBottomRowRange;
+  if (frozenRange && rowIndex >= frozenRange.start && rowIndex < frozenRange.end) {
+    return layout.bodyRect.y + layout.bodyRect.height - (frozenRange.end - rowIndex) * layout.rowHeight;
+  }
+  return layout.bodyRect.y + rowIndex * layout.rowHeight - layout.scroll.top;
+}
 function resolvePivotSelectionClipRect(layout, selection) {
   const kind = resolvePivotSelectionKind(selection);
   if (kind === "row" || kind === "row-cell") {
@@ -2810,26 +2880,29 @@ var defaultPivotTableTheme = {
 };
 
 // src/rendering/draw-scrollbars.ts
-function drawPivotScrollbars(context, layout) {
+function drawPivotScrollbars(context, layout, borderColor) {
   context.save();
   if (layout.horizontal) {
-    drawAxis(context, layout.horizontal, "horizontal");
+    drawAxis(context, layout.horizontal, "horizontal", borderColor);
   }
   if (layout.vertical) {
-    drawAxis(context, layout.vertical, "vertical");
+    drawAxis(context, layout.vertical, "vertical", borderColor);
   }
   context.restore();
 }
-function drawAxis(context, layout, axis) {
-  drawTrack(context, layout.track);
+function drawAxis(context, layout, axis, borderColor) {
+  drawTrack(context, layout.track, borderColor);
   drawButton(context, layout.decreaseButton, axis, "decrease");
   drawButton(context, layout.increaseButton, axis, "increase");
   drawThumb(context, layout.thumb);
 }
-function drawTrack(context, rect) {
+function drawTrack(context, rect, borderColor) {
   context.fillStyle = "rgba(148, 163, 184, 0.16)";
+  context.strokeStyle = borderColor;
+  context.lineWidth = 1;
   roundRect(context, rect, rect.height / 2);
   context.fill();
+  context.stroke();
 }
 function drawThumb(context, rect) {
   context.fillStyle = "rgba(100, 116, 139, 0.8)";
@@ -2993,7 +3066,7 @@ function renderPivotTable(params) {
   });
   withClip(context, layout.cornerRect, () => {
     fillRect(context, layout.cornerRect, theme.cornerBackgroundColor);
-    drawCorner(context, layout, theme);
+    drawCorner(context, layout, theme, params.selection?.textSelection);
   });
   withClip(context, layout.rowHeaderRect, () => {
     layout.rowHeaderCells.forEach((cell) => {
@@ -3007,7 +3080,9 @@ function renderPivotTable(params) {
         cell,
         theme,
         !areaSelection && isHeaderSelected(cell, selectionPathKeys.row),
-        contentRect
+        contentRect,
+        void 0,
+        params.selection?.textSelection
       );
     });
     layout.rowHeaderCells.forEach(
@@ -3027,7 +3102,10 @@ function renderPivotTable(params) {
         context,
         cell,
         theme,
-        !areaSelection && isHeaderSelected(cell, selectionPathKeys.column)
+        !areaSelection && isHeaderSelected(cell, selectionPathKeys.column),
+        cell.rect,
+        void 0,
+        params.selection?.textSelection
       )
     );
     layout.columnHeaderCells.forEach(
@@ -3062,7 +3140,8 @@ function renderPivotTable(params) {
             activeNodePathKey
           )
         },
-        visibleIndicatorMaxima.get(cell.indicatorKey) ?? 0
+        visibleIndicatorMaxima.get(cell.indicatorKey) ?? 0,
+        params.selection?.textSelection
       )
     );
     layout.bodyCells.forEach(
@@ -3091,7 +3170,7 @@ function renderPivotTable(params) {
     theme.borderColor
   );
   if (options.debug) drawDebugOverlay(context, layout, theme);
-  drawPivotScrollbars(context, layout.scrollbar);
+  drawPivotScrollbars(context, layout.scrollbar, theme.borderColor);
   drawPivotViewportRightBorder(
     context,
     { x: 0, y: 0, width: layout.tableWidth, height: contentHeight },
@@ -3203,7 +3282,7 @@ function drawReportFilterCell(context, cell, theme) {
     skipRight: true
   });
 }
-function drawCorner(context, layout, theme) {
+function drawCorner(context, layout, theme, textSelection) {
   layout.rowFieldHeaderCells.forEach(
     (cell) => drawHeaderCell(
       context,
@@ -3211,7 +3290,8 @@ function drawCorner(context, layout, theme) {
       theme,
       false,
       cell.rect,
-      theme.cornerBackgroundColor
+      theme.cornerBackgroundColor,
+      textSelection
     )
   );
   if (layout.rowFieldHeaderCells.length === 0) {
@@ -3228,7 +3308,7 @@ function drawCorner(context, layout, theme) {
     })
   );
 }
-function drawHeaderCell(context, cell, theme, selected, contentRect = cell.rect, backgroundColor) {
+function drawHeaderCell(context, cell, theme, selected, contentRect = cell.rect, backgroundColor, textSelection) {
   const background = backgroundColor ?? (selected ? theme.selectionBackgroundColor : cell.kind === "grandTotal" ? theme.grandTotalBackgroundColor : cell.kind === "subtotal" ? theme.subtotalBackgroundColor : cell.axis === "row" ? theme.rowHeaderBackgroundColor : theme.columnHeaderBackgroundColor);
   fillRect(context, cell.rect, background);
   const iconPadding = cell.expandable ? 18 : 0;
@@ -3250,6 +3330,13 @@ function drawHeaderCell(context, cell, theme, selected, contentRect = cell.rect,
       cell.filterable ? 32 : 10
     );
   }
+  drawHeaderTextSelectionBackground(
+    context,
+    cell,
+    contentRect,
+    textSelection,
+    theme.fontSize
+  );
   drawText(
     context,
     cell.label,
@@ -3262,13 +3349,46 @@ function drawHeaderCell(context, cell, theme, selected, contentRect = cell.rect,
     cell.align ?? "left"
   );
 }
+function drawHeaderTextSelectionBackground(context, cell, contentRect, selection, fontSize) {
+  if (!selection) return;
+  const index = selection.fragments.findIndex(
+    (fragment) => fragment.region === "header" && fragment.key === `header:${cell.axis}:${cell.nodeId ?? ""}:${cell.label}`
+  );
+  if (index < 0) return;
+  const range = resolveTextSelectionRange(selection, index, cell.label.length);
+  if (!range) return;
+  const width = context.measureText(cell.label).width;
+  const align = cell.align ?? "left";
+  const origin = align === "right" ? contentRect.x + contentRect.width - 10 - width : align === "center" ? contentRect.x + contentRect.width / 2 - width / 2 : contentRect.x + 10 + (cell.expandable ? 18 : 0);
+  context.save();
+  context.fillStyle = "#99c2ff";
+  context.fillRect(
+    origin + context.measureText(cell.label.slice(0, range.start)).width,
+    contentRect.y + (contentRect.height - fontSize) / 2,
+    context.measureText(cell.label.slice(range.start, range.end)).width,
+    fontSize
+  );
+  context.restore();
+}
+function resolveTextSelectionRange(selection, index, length) {
+  const forward = selection.anchorFragmentIndex <= selection.focusFragmentIndex;
+  const startIndex = forward ? selection.anchorFragmentIndex : selection.focusFragmentIndex;
+  const endIndex = forward ? selection.focusFragmentIndex : selection.anchorFragmentIndex;
+  if (index < startIndex || index > endIndex) return null;
+  const start = index === startIndex ? forward ? selection.anchorOffset : selection.focusOffset : 0;
+  const end = index === endIndex ? forward ? selection.focusOffset : selection.anchorOffset : length;
+  return {
+    start: Math.max(0, Math.min(start, length)),
+    end: Math.max(0, Math.min(end, length))
+  };
+}
 function isHeaderSelected(cell, selectedPathKey) {
   if (!selectedPathKey || !cell.nodeId) {
     return false;
   }
   return Boolean(isPathRelated2(selectedPathKey, cell.pathKey));
 }
-function drawBodyCell(context, cell, options, theme, state, visibleMaximum) {
+function drawBodyCell(context, cell, options, theme, state, visibleMaximum, textSelection) {
   const indicator = options.indicators.find(
     (item) => item.key === cell.indicatorKey
   );
@@ -3298,15 +3418,54 @@ function drawBodyCell(context, cell, options, theme, state, visibleMaximum) {
       "#3370ff"
     );
   }
+  const text = resolveBodyDisplayText(cell, indicator);
+  const padding = 10;
+  const align = indicator?.align ?? "right";
+  drawTextSelectionBackground(
+    context,
+    cell,
+    text,
+    align,
+    padding,
+    textSelection,
+    theme.fontSize
+  );
   drawText(
     context,
-    resolveBodyDisplayText(cell, indicator),
+    text,
     cell.rect,
     theme.textColor,
     10,
     indicator?.align ?? "right"
   );
 }
+function drawTextSelectionBackground(context, cell, text, align, padding, selection, fontSize) {
+  if (!selection) return;
+  const index = selection.fragments.findIndex(
+    (fragment) => fragment.rowIndex === cell.rowIndex && fragment.columnIndex === cell.columnIndex && fragment.text === text
+  );
+  if (index < 0) return;
+  const forward = selection.anchorFragmentIndex < selection.focusFragmentIndex || selection.anchorFragmentIndex === selection.focusFragmentIndex && selection.anchorOffset <= selection.focusOffset;
+  const startIndex = forward ? selection.anchorFragmentIndex : selection.focusFragmentIndex;
+  const endIndex = forward ? selection.focusFragmentIndex : selection.anchorFragmentIndex;
+  if (index < startIndex || index > endIndex) return;
+  const start = index === startIndex ? forward ? selection.anchorOffset : selection.focusOffset : 0;
+  const end = index === endIndex ? forward ? selection.focusOffset : selection.anchorOffset : text.length;
+  if (start >= end) return;
+  const availableWidth = Math.max(cell.rect.width - padding * 2, 0);
+  const shown = truncateText(context, text, availableWidth);
+  const textWidth = context.measureText(shown).width;
+  const origin = align === "right" ? cell.rect.x + cell.rect.width - padding - textWidth : align === "center" ? cell.rect.x + cell.rect.width / 2 - textWidth / 2 : cell.rect.x + padding;
+  context.save();
+  context.fillStyle = "#99c2ff";
+  context.fillRect(
+    origin + context.measureText(shown.slice(0, start)).width,
+    cell.rect.y + (cell.rect.height - fontSize) / 2,
+    context.measureText(shown.slice(start, end)).width,
+    fontSize
+  );
+  context.restore();
+}
 function resolveSelectionPathKeys(layout, selection, activeNodePathKey) {
   const activeNode = selection?.activeNode;
   if (activeNode) {
@@ -3529,7 +3688,7 @@ function hitTestPivotLayout(layout, x, y) {
       onSortIcon: false
     };
   }
-  const bodyCell = layout.bodyCells.find((cell) => contains(cell.rect, x, y));
+  const bodyCell = findLastContaining(layout.bodyCells, x, y);
   if (bodyCell) {
     return {
       region: "body",
@@ -3539,9 +3698,7 @@ function hitTestPivotLayout(layout, x, y) {
       onSortIcon: false
     };
   }
-  const rowHeaderCell = layout.rowHeaderCells.find(
-    (cell) => contains(cell.rect, x, y)
-  );
+  const rowHeaderCell = findLastContaining(layout.rowHeaderCells, x, y);
   if (rowHeaderCell) {
     return {
       region: "rowHeader",
@@ -3594,6 +3751,68 @@ function isSortIconHit(cell, x) {
 function contains(rect, x, y) {
   return x >= rect.x && x < rect.x + rect.width && y >= rect.y && y < rect.y + rect.height;
 }
+function findLastContaining(cells, x, y) {
+  for (let index = cells.length - 1; index >= 0; index -= 1) {
+    const cell = cells[index];
+    if (cell && contains(cell.rect, x, y)) return cell;
+  }
+  return void 0;
+}
+
+// src/interaction/text-selection.ts
+function resolvePivotTextOffset(params) {
+  const boundaries = [0];
+  let offset = 0;
+  for (const character of params.text) {
+    offset += character.length;
+    boundaries.push(offset);
+  }
+  const relativeX = params.pointerX - params.textOriginX;
+  if (relativeX <= 0 || boundaries.length === 1) return 0;
+  if (relativeX >= params.measureText(params.text)) return params.text.length;
+  let low = 1;
+  let high = boundaries.length - 1;
+  while (low < high) {
+    const middle = Math.floor((low + high) / 2);
+    const boundary = boundaries[middle] ?? params.text.length;
+    if (params.measureText(params.text.slice(0, boundary)) < relativeX) {
+      low = middle + 1;
+    } else {
+      high = middle;
+    }
+  }
+  const end = boundaries[low] ?? params.text.length;
+  const start = boundaries[Math.max(low - 1, 0)] ?? 0;
+  const startWidth = params.measureText(params.text.slice(0, start));
+  const endWidth = params.measureText(params.text.slice(0, end));
+  return relativeX - startWidth <= endWidth - relativeX ? start : end;
+}
+function getPivotSelectedText(selection) {
+  const textSelection = selection.textSelection;
+  if (!textSelection) return null;
+  const forward = textSelection.anchorFragmentIndex < textSelection.focusFragmentIndex || textSelection.anchorFragmentIndex === textSelection.focusFragmentIndex && textSelection.anchorOffset <= textSelection.focusOffset;
+  const startIndex = forward ? textSelection.anchorFragmentIndex : textSelection.focusFragmentIndex;
+  const endIndex = forward ? textSelection.focusFragmentIndex : textSelection.anchorFragmentIndex;
+  const startOffset = forward ? textSelection.anchorOffset : textSelection.focusOffset;
+  const endOffset = forward ? textSelection.focusOffset : textSelection.anchorOffset;
+  const selected = textSelection.fragments.slice(startIndex, endIndex + 1).map((fragment, index) => {
+    const absoluteIndex = startIndex + index;
+    const start = absoluteIndex === startIndex ? startOffset : 0;
+    const end = absoluteIndex === endIndex ? endOffset : fragment.text.length;
+    return {
+      fragment,
+      text: fragment.text.slice(
+        Math.max(0, Math.min(start, fragment.text.length)),
+        Math.max(0, Math.min(end, fragment.text.length))
+      )
+    };
+  });
+  return selected.reduce((result, item, index) => {
+    const previous = selected[index - 1]?.fragment;
+    const separator = previous ? previous.rowIndex === item.fragment.rowIndex ? "	" : "\n" : "";
+    return `${result}${separator}${item.text}`;
+  }, "") || null;
+}
 
 // src/features/clipboard/pivot-selection-copy.ts
 function createPivotSelectionText(params) {
@@ -3775,6 +3994,16 @@ function createAddress(rowSlot, columnSlot, indicatorKey) {
 // src/domain/interaction/row-selection.ts
 function resolvePivotRowIndexAtY(layout, y) {
   if (layout.rowSlots.length === 0 || layout.rowHeight <= 0) return null;
+  const frozenRange = layout.frozenBottomRowRange;
+  if (frozenRange) {
+    const frozenTop = layout.bodyRect.y + layout.bodyRect.height - (frozenRange.end - frozenRange.start) * layout.rowHeight;
+    if (y >= frozenTop) {
+      return Math.min(
+        frozenRange.start + Math.floor((y - frozenTop) / layout.rowHeight),
+        frozenRange.end - 1
+      );
+    }
+  }
   const index = Math.floor(
     (y - layout.bodyRect.y + layout.scroll.top) / layout.rowHeight
   );
@@ -3898,6 +4127,8 @@ var PivotTable = class {
     __publicField(this, "suppressNextClick", false);
     __publicField(this, "scrollbarDrag", null);
     __publicField(this, "cellSelectionDrag", null);
+    __publicField(this, "textSelectionDrag", null);
+    __publicField(this, "headerTextSelectionDrag", null);
     __publicField(this, "rowHeaderSelectionDrag", null);
     __publicField(this, "handlePointerMove", (event) => {
       if (this.scrollbarDrag) {
@@ -3918,10 +4149,22 @@ var PivotTable = class {
         return;
       }
       if (this.cellSelectionDrag?.pointerId === event.pointerId) {
+        if (this.textSelectionDrag?.pointerId === event.pointerId) {
+          this.updateTextSelectionDrag(event);
+          if (this.textSelectionDrag.dragged) return;
+        }
         this.updateCellSelectionDrag(event);
         return;
       }
+      if (this.headerTextSelectionDrag?.pointerId === event.pointerId) {
+        this.updateHeaderTextSelectionDrag(event);
+        return;
+      }
       if (this.rowHeaderSelectionDrag?.pointerId === event.pointerId) {
+        if (this.headerTextSelectionDrag?.pointerId === event.pointerId) {
+          this.updateHeaderTextSelectionDrag(event);
+          if (this.headerTextSelectionDrag.dragged) return;
+        }
         this.updateRowHeaderSelectionDrag(event);
         return;
       }
@@ -3968,6 +4211,7 @@ var PivotTable = class {
         this.openReportFilterPanel(hit.reportFilterCell);
         return;
       }
+      if (hit.reportFilterCell) return;
       if (hit.bodyCell) {
         this.selectCell(toCellAddress(hit.bodyCell), event.shiftKey);
         return;
@@ -4009,52 +4253,20 @@ var PivotTable = class {
       this.scheduleRender();
       return;
     });
-    __publicField(this, "handleDocumentKeyDown", (event) => {
-      const root = this.host?.root;
-      const activeElement = this.container.ownerDocument.activeElement;
-      const belongsToTable = Boolean(
-        root && (activeElement === root || activeElement instanceof Element && root.contains(activeElement))
-      );
+    __publicField(this, "handleKeyDown", (event) => {
       const isCopyShortcut = (event.ctrlKey || event.metaKey) && !event.altKey && (event.key.toLocaleLowerCase() === "c" || event.code === "KeyC");
       if (isCopyShortcut) {
-        logPivotClipboard("keydown-captured", {
-          belongsToTable,
-          key: event.key,
-          code: event.code,
-          ctrlKey: event.ctrlKey,
-          metaKey: event.metaKey,
-          defaultPrevented: event.defaultPrevented,
-          activeElement: describeElement(activeElement),
-          eventTarget: describeElement(event.target),
-          protocol: this.container.ownerDocument.location?.protocol ?? "unknown",
-          isSecureContext: this.container.ownerDocument.defaultView?.isSecureContext ?? false
-        });
-      }
-      if (!belongsToTable) return;
-      if (isCopyShortcut) {
-        const text = this.createSelectionTsv();
-        const selection = this.core?.getSelection() ?? null;
-        logPivotClipboard("selection-resolved", {
-          hasLayout: Boolean(this.layout),
-          selection,
-          textLength: text.length,
-          textPreview: text.slice(0, 120)
-        });
+        const text = getPivotSelectedText(
+          this.core?.getSelection() ?? {
+            }
+        ) ?? this.createSelectionTsv();
         if (!text) {
-          logPivotClipboard("copy-aborted", { reason: "empty-selection-text" });
           return;
         }
         event.preventDefault();
-        const copied = copyPivotClipboardTextSync(
-          text,
-          this.container.ownerDocument
-        );
-        if (!copied) {
-          void writePivotClipboardText(text, this.container.ownerDocument).then(
-            (fallbackCopied) => logPivotClipboard("fallback-complete", {
-              copied: fallbackCopied
-            })
-          );
+        const ownerDocument = this.host?.canvas.ownerDocument ?? globalThis.document;
+        if (!utils.copyTextSync(text, ownerDocument)) {
+          void utils.copyText(text, ownerDocument);
         }
         return;
       }
@@ -4067,16 +4279,6 @@ var PivotTable = class {
       event.preventDefault();
       this.selectCell(next, event.shiftKey);
     });
-    __publicField(this, "handleCopy", (event) => {
-      const text = this.createSelectionTsv();
-      logPivotClipboard("copy-event", {
-        textLength: text.length,
-        hasClipboardData: Boolean(event.clipboardData)
-      });
-      if (!text) return;
-      event.preventDefault();
-      event.clipboardData?.setData("text/plain", text);
-    });
     __publicField(this, "handleWheel", (event) => {
       if (!this.layout) return;
       const delta = resolvePivotWheelScrollDelta({
@@ -4148,13 +4350,13 @@ var PivotTable = class {
             endColumnIndex: hit.bodyCell.columnIndex
           }) : "";
           if (text) {
-            void writePivotClipboardText(text, this.container.ownerDocument);
+            this.copyPivotText(text);
           }
         },
         onCopySelection: selectionRange ? () => {
           const text = this.createSelectionTsv();
           if (text) {
-            void writePivotClipboardText(text, this.container.ownerDocument);
+            this.copyPivotText(text);
           }
         } : void 0,
         customSelection: {
@@ -4177,7 +4379,7 @@ var PivotTable = class {
             endColumnIndex: range.endColumn - 1
           });
           if (text) {
-            void writePivotClipboardText(text, this.container.ownerDocument);
+            this.copyPivotText(text);
           }
         },
         onExportCsv: () => downloadBlob(
@@ -4209,6 +4411,24 @@ var PivotTable = class {
           const address = toCellAddress(cellHit.bodyCell);
           this.host.root.focus({ preventScroll: true });
           const selection = this.selectCell(address, event.shiftKey);
+          const text = this.resolveBodyText(cellHit.bodyCell);
+          const textOriginX = this.resolveBodyTextOriginX(cellHit.bodyCell, text);
+          const anchorOffset = text ? resolvePivotTextOffset({
+            text,
+            pointerX: event.clientX - this.host.root.getBoundingClientRect().left,
+            textOriginX,
+            measureText: (value) => this.measurePivotText(value)
+          }) : 0;
+          const anchorFragmentIndex = this.resolveTextFragmentIndex(
+            `body:${cellHit.bodyCell.rowIndex}:${cellHit.bodyCell.columnIndex}`,
+            this.createTextSelectionFragments("column")
+          );
+          this.textSelectionDrag = text ? {
+            pointerId: event.pointerId,
+            anchorFragmentIndex,
+            anchorOffset,
+            dragged: false
+          } : null;
           this.cellSelectionDrag = {
             pointerId: event.pointerId,
             anchor: selection?.anchorCell ?? address,
@@ -4220,6 +4440,37 @@ var PivotTable = class {
           this.suppressNextClick = true;
           return;
         }
+        if (cellHit?.headerCell && !cellHit.onExpandIcon && !cellHit.onFilterIcon && !cellHit.onSortIcon) {
+          const header = cellHit.headerCell;
+          const text = header.label;
+          const rootRect2 = this.host.root.getBoundingClientRect();
+          const originX = header.rect.x + 10 + (header.expandable ? 18 : 0);
+          const fragments = this.createTextSelectionFragments(header.axis);
+          const key = `header:${header.axis}:${header.nodeId ?? ""}:${header.label}`;
+          const anchorFragmentIndex = fragments.findIndex(
+            (fragment) => fragment.key === key
+          );
+          this.host.root.focus({ preventScroll: true });
+          if (header.nodeId) {
+            this.selectNode(header.axis, header.nodeId);
+          }
+          this.textSelectionDrag = null;
+          this.headerTextSelectionDrag = {
+            pointerId: event.pointerId,
+            fragments,
+            anchorFragmentIndex: Math.max(anchorFragmentIndex, 0),
+            anchorOffset: resolvePivotTextOffset({
+              text,
+              pointerX: event.clientX - rootRect2.left,
+              textOriginX: originX,
+              measureText: (value) => this.measurePivotText(value)
+            }),
+            dragged: false
+          };
+          event.preventDefault();
+          this.host.root.setPointerCapture(event.pointerId);
+          return;
+        }
         if (cellHit?.region === "rowHeader" && cellHit.headerCell && !cellHit.onExpandIcon && !cellHit.onFilterIcon && !cellHit.onSortIcon) {
           const rootRect2 = this.host.root.getBoundingClientRect();
           const rowIndex = resolvePivotRowIndexAtY(
@@ -4269,6 +4520,14 @@ var PivotTable = class {
       if (!this.host) return;
       const endedCellSelection = this.cellSelectionDrag?.pointerId === event.pointerId;
       if (endedCellSelection) this.cellSelectionDrag = null;
+      if (this.textSelectionDrag?.pointerId === event.pointerId) {
+        if (this.textSelectionDrag.dragged) this.suppressNextClick = true;
+        this.textSelectionDrag = null;
+      }
+      if (this.headerTextSelectionDrag?.pointerId === event.pointerId) {
+        if (this.headerTextSelectionDrag.dragged) this.suppressNextClick = true;
+        this.headerTextSelectionDrag = null;
+      }
       const endedRowHeaderSelection = this.rowHeaderSelectionDrag?.pointerId === event.pointerId;
       if (endedRowHeaderSelection) {
         if (this.rowHeaderSelectionDrag?.dragged) this.suppressNextClick = true;
@@ -4300,12 +4559,7 @@ var PivotTable = class {
     this.host.root.addEventListener("pointermove", this.handlePointerMove);
     this.host.root.addEventListener("pointerleave", this.handlePointerLeave);
     this.host.root.addEventListener("click", this.handleClick);
-    this.container.ownerDocument.addEventListener(
-      "keydown",
-      this.handleDocumentKeyDown,
-      true
-    );
-    this.host.root.addEventListener("copy", this.handleCopy);
+    this.host.root.addEventListener("keydown", this.handleKeyDown);
     this.host.root.addEventListener("wheel", this.handleWheel, {
       passive: false
     });
@@ -4455,11 +4709,16 @@ var PivotTable = class {
       (slot) => (slot.nodeId ?? "") === address.columnNodeId && (!slot.indicatorKey || slot.indicatorKey === address.indicatorKey)
     );
     if (rowIndex < 0 || columnIndex < 0) return false;
-    const top = resolveVisibleOffset({
+    const frozenRange = this.layout.frozenBottomRowRange;
+    const frozenBottomHeight = frozenRange ? (frozenRange.end - frozenRange.start) * this.layout.rowHeight : 0;
+    const top = frozenRange && rowIndex >= frozenRange.start ? this.scroll.top : resolveVisibleOffset({
       current: this.scroll.top,
       itemStart: rowIndex * this.layout.rowHeight,
       itemSize: this.layout.rowHeight,
-      viewportSize: this.layout.bodyRect.height
+      viewportSize: Math.max(
+        this.layout.bodyRect.height - frozenBottomHeight,
+        0
+      )
     });
     const left = resolveVisibleOffset({
       current: this.scroll.left,
@@ -4531,12 +4790,7 @@ var PivotTable = class {
       this.handlePointerLeave
     );
     this.host?.root.removeEventListener("click", this.handleClick);
-    this.container.ownerDocument.removeEventListener(
-      "keydown",
-      this.handleDocumentKeyDown,
-      true
-    );
-    this.host?.root.removeEventListener("copy", this.handleCopy);
+    this.host?.root.removeEventListener("keydown", this.handleKeyDown);
     this.host?.root.removeEventListener("wheel", this.handleWheel);
     this.host?.root.removeEventListener("contextmenu", this.handleContextMenu);
     this.host?.root.removeEventListener("pointerdown", this.handlePointerDown);
@@ -4648,6 +4902,194 @@ var PivotTable = class {
       activeNode: null
     });
   }
+  updateTextSelectionDrag(event) {
+    const drag = this.textSelectionDrag;
+    if (!drag || !this.layout || !this.host) return;
+    const rootRect = this.host.root.getBoundingClientRect();
+    const x = event.clientX - rootRect.left;
+    const y = event.clientY - rootRect.top;
+    const hitResult = hitTestPivotLayout(this.layout, x, y);
+    const hit = hitResult?.bodyCell;
+    const header = hitResult?.headerCell;
+    if (!hit && !header) return;
+    const fragments = this.createTextSelectionFragments(
+      header?.axis ?? "column"
+    );
+    const focusKey = header ? `header:${header.axis}:${header.nodeId ?? ""}:${header.label}` : `body:${hit?.rowIndex}:${hit?.columnIndex}`;
+    const focusIndex = this.resolveTextFragmentIndex(focusKey, fragments);
+    const text = header ? header.label : this.resolveBodyText(hit);
+    if (!text || focusIndex < 0) return;
+    const textOriginX = header ? header.rect.x + 10 + (header.expandable ? 18 : 0) : this.resolveBodyTextOriginX(hit, text);
+    const focusOffset = resolvePivotTextOffset({
+      text,
+      pointerX: x,
+      textOriginX,
+      measureText: (value) => this.measurePivotText(value)
+    });
+    if (focusIndex === drag.anchorFragmentIndex && focusOffset === drag.anchorOffset)
+      return;
+    drag.dragged = true;
+    this.setSelection({
+      activeCell: hit ? toCellAddress(hit) : this.core?.getSelection().activeCell ?? null,
+      anchorCell: this.core?.getSelection().anchorCell ?? (hit ? toCellAddress(hit) : null),
+      ranges: this.core?.getSelection().ranges ?? [],
+      activeNode: null,
+      textSelection: {
+        fragments: fragments.map((fragment) => ({
+          rowIndex: fragment.rowIndex ?? -1,
+          columnIndex: fragment.columnIndex ?? -1,
+          text: fragment.text,
+          region: fragment.key.startsWith("header:") ? "header" : "body",
+          key: fragment.key
+        })),
+        anchorFragmentIndex: drag.anchorFragmentIndex,
+        focusFragmentIndex: focusIndex,
+        anchorOffset: drag.anchorOffset,
+        focusOffset
+      }
+    });
+  }
+  updateHeaderTextSelectionDrag(event) {
+    const drag = this.headerTextSelectionDrag;
+    if (!drag || !this.host || !this.layout) return;
+    const rootRect = this.host.root.getBoundingClientRect();
+    const localX = event.clientX - rootRect.left;
+    const localY = event.clientY - rootRect.top;
+    const hit = hitTestPivotLayout(this.layout, localX, localY);
+    const header = hit?.headerCell;
+    const body = hit?.bodyCell;
+    if (!header && !body) return;
+    const key = header ? `header:${header.axis}:${header.nodeId ?? ""}:${header.label}` : `body:${body?.rowIndex}:${body?.columnIndex}`;
+    const focusFragmentIndex = drag.fragments.findIndex(
+      (fragment) => fragment.key === key
+    );
+    if (focusFragmentIndex < 0) return;
+    const focusFragment = drag.fragments[focusFragmentIndex];
+    const focusOffset = resolvePivotTextOffset({
+      text: focusFragment.text,
+      pointerX: localX,
+      textOriginX: focusFragment.originX,
+      measureText: (value) => this.measurePivotText(value)
+    });
+    if (focusFragmentIndex === drag.anchorFragmentIndex && focusOffset === drag.anchorOffset)
+      return;
+    drag.dragged = true;
+    const selection = this.core?.getSelection();
+    if (!selection) return;
+    this.setSelection({
+      ...selection,
+      textSelection: {
+        fragments: drag.fragments.map((fragment) => ({
+          rowIndex: fragment.rowIndex ?? -1,
+          columnIndex: fragment.columnIndex ?? -1,
+          text: fragment.text,
+          region: "header",
+          key: fragment.key
+        })),
+        anchorFragmentIndex: drag.anchorFragmentIndex,
+        focusFragmentIndex,
+        anchorOffset: drag.anchorOffset,
+        focusOffset
+      }
+    });
+  }
+  createTextSelectionFragments(axis) {
+    const bodyFragments = (this.layout?.bodyCells ?? []).map((cell) => ({
+      key: `body:${cell.rowIndex}:${cell.columnIndex}`,
+      text: this.resolveBodyText(cell),
+      originX: this.resolveBodyTextOriginX(cell, this.resolveBodyText(cell)),
+      rowIndex: cell.rowIndex,
+      columnIndex: cell.columnIndex
+    })).filter((fragment) => fragment.text.length > 0);
+    if (this.layout) {
+      const columnHeaders = this.createHeaderTextFragments("column");
+      const rowHeaders = this.layout.rowHeaderCells.filter((cell) => cell.label).map((cell) => ({
+        key: `header:${cell.axis}:${cell.nodeId ?? ""}:${cell.label}`,
+        text: cell.label,
+        rowIndex: void 0,
+        columnIndex: void 0,
+        originX: cell.rect.x + 10
+      }));
+      const rows = Array.from(
+        { length: this.layout.rowSlots.length },
+        (_, rowIndex) => [
+          rowHeaders[rowIndex],
+          ...bodyFragments.filter((fragment) => fragment.rowIndex === rowIndex)
+        ]
+      ).flat();
+      if (axis === "column") {
+        return [...columnHeaders, ...rows].filter(
+          (fragment) => Boolean(fragment)
+        );
+      }
+      const rowHeadersTitle = this.layout.rowFieldHeaderCells.filter((cell) => cell.label).map((cell) => ({
+        key: `header:${cell.axis}:${cell.nodeId ?? ""}:${cell.label}`,
+        text: cell.label,
+        rowIndex: void 0,
+        columnIndex: void 0,
+        originX: cell.rect.x + 10 + (cell.expandable ? 18 : 0)
+      }));
+      return [...rowHeadersTitle, ...columnHeaders, ...rows].filter(
+        (fragment) => Boolean(fragment)
+      );
+    }
+    return [...this.createHeaderTextFragments(axis), ...bodyFragments];
+  }
+  createHeaderTextFragments(axis) {
+    if (!this.layout) return [];
+    return (axis === "column" ? this.layout.columnHeaderCells : [...this.layout.rowHeaderCells, ...this.layout.rowFieldHeaderCells]).filter((cell) => cell.label).map((cell) => ({
+      key: `header:${cell.axis}:${cell.nodeId ?? ""}:${cell.label}`,
+      text: cell.label,
+      rowIndex: void 0,
+      columnIndex: void 0,
+      originX: cell.rect.x + 10 + (cell.expandable ? 18 : 0)
+    }));
+  }
+  resolveBodyText(cell) {
+    const indicator = this.options.indicators.find(
+      (item) => item.key === cell.indicatorKey
+    );
+    if (!indicator || indicator.formatter || typeof cell.value !== "number")
+      return cell.formattedValue;
+    if (indicator.cellType === "percent")
+      return `${(cell.value * 100).toFixed(indicator.precision ?? 2)}%`;
+    if (indicator.cellType === "money")
+      return cell.value.toLocaleString("zh-CN", {
+        style: "currency",
+        currency: "CNY",
+        minimumFractionDigits: indicator.precision ?? 2,
+        maximumFractionDigits: indicator.precision ?? 2
+      });
+    return cell.formattedValue;
+  }
+  createBodyTextFragments() {
+    return (this.layout?.bodyCells ?? []).map((cell) => ({
+      rowIndex: cell.rowIndex,
+      columnIndex: cell.columnIndex,
+      text: this.resolveBodyText(cell)
+    })).filter((fragment) => fragment.text.length > 0);
+  }
+  resolveTextFragmentIndex(key, fragments) {
+    return fragments.findIndex((fragment) => fragment.key === key);
+  }
+  resolveBodyFragmentIndex(cell) {
+    if (!this.layout) return -1;
+    return this.layout.bodyCells.slice(0, this.layout.bodyCells.indexOf(cell) + 1).filter((item) => this.resolveBodyText(item).length > 0).length - 1;
+  }
+  resolveBodyTextOriginX(cell, text) {
+    const indicator = this.options.indicators.find(
+      (item) => item.key === cell.indicatorKey
+    );
+    const width = this.measurePivotText(text);
+    const align = indicator?.align ?? "right";
+    return align === "right" ? cell.rect.x + cell.rect.width - 10 - width : align === "center" ? cell.rect.x + cell.rect.width / 2 - width / 2 : cell.rect.x + 10;
+  }
+  measurePivotText(text) {
+    const context = this.host?.canvas.getContext("2d");
+    if (!context) return text.length * 8;
+    context.font = `${this.options.theme?.fontSize ?? 13}px ${this.options.theme?.fontFamily ?? "sans-serif"}`;
+    return context.measureText(text).width;
+  }
   updateRowHeaderSelectionDrag(event) {
     const drag = this.rowHeaderSelectionDrag;
     if (!drag || !this.layout || !this.host) return;
@@ -4886,6 +5328,14 @@ var PivotTable = class {
       selection: this.core.getSelection()
     });
   }
+  /** 复制表格选区文本；同步复制失败时回退到异步实现。 */
+  copyPivotText(text) {
+    if (!text) return;
+    const ownerDocument = this.host?.canvas.ownerDocument ?? globalThis.document;
+    if (!utils.copyTextSync(text, ownerDocument)) {
+      void utils.copyText(text, ownerDocument);
+    }
+  }
   scheduleRender() {
     if (this.frameId !== null) return;
     this.frameId = requestAnimationFrame(() => {
@@ -4929,12 +5379,6 @@ var PivotTable = class {
     });
   }
 };
-function describeElement(value) {
-  if (!(value instanceof Element)) return String(value);
-  const id = value.id ? `#${value.id}` : "";
-  const className = typeof value.className === "string" && value.className ? `.${value.className.trim().replace(/\s+/g, ".")}` : "";
-  return `${value.tagName.toLocaleLowerCase()}${id}${className}`;
-}
 function toCellAddress(cell) {
   return {
     rowNodeId: cell.rowNodeId ?? "",