vue2-excel-grid 1.0.0

package/src/utils/merge.js

@@ -0,0 +1,77 @@
+/**
+ * Merge cells utilities
+ */
+import { normalizeRange, rangesOverlap } from './selection.js'
+
+/**
+ * Check if a proposed merge overlaps any existing merges (other than itself).
+ * @param {Object} proposed - { startRow, startCol, endRow, endCol }
+ * @param {Array} existingMerges
+ * @returns {boolean}
+ */
+export function mergeHasConflict(proposed, existingMerges) {
+  const p = normalizeRange(proposed)
+  return existingMerges.some(m => rangesOverlap(p, normalizeRange(m)))
+}
+
+/**
+ * Find which merge (if any) covers cell (row, col).
+ * @param {number} row
+ * @param {number} col
+ * @param {Array} merges
+ * @returns {Object|null}
+ */
+export function findMergeAtCell(row, col, merges) {
+  return merges.find(m => {
+    const nm = normalizeRange(m)
+    return row >= nm.startRow && row <= nm.endRow && col >= nm.startCol && col <= nm.endCol
+  }) || null
+}
+
+/**
+ * Check whether a cell is the top-left (anchor) of a merge
+ */
+export function isMergeAnchor(row, col, merges) {
+  return merges.some(m => {
+    const nm = normalizeRange(m)
+    return nm.startRow === row && nm.startCol === col
+  })
+}
+
+/**
+ * Add a merge. Returns null and a conflict flag if it overlaps an existing merge.
+ * @returns {{ merges: Array, conflict: boolean }}
+ */
+export function addMerge(proposed, existingMerges) {
+  const p = normalizeRange(proposed)
+  // Single cell → no-op
+  if (p.startRow === p.endRow && p.startCol === p.endCol) {
+    return { merges: existingMerges, conflict: false }
+  }
+  if (mergeHasConflict(p, existingMerges)) {
+    return { merges: existingMerges, conflict: true }
+  }
+  return { merges: [...existingMerges, p], conflict: false }
+}
+
+/**
+ * Remove a merge that covers cell (row, col).
+ * @returns {Array} updated merges
+ */
+export function removeMergeAt(row, col, existingMerges) {
+  return existingMerges.filter(m => {
+    const nm = normalizeRange(m)
+    return !(row >= nm.startRow && row <= nm.endRow && col >= nm.startCol && col <= nm.endCol)
+  })
+}
+
+/**
+ * Resolve the effective (row, col) to navigate to when arrow-keying into a merge.
+ * Returns the anchor cell of the merge if (row, col) is inside one.
+ */
+export function resolveMergeAnchor(row, col, merges) {
+  const merge = findMergeAtCell(row, col, merges)
+  if (!merge) return { row, col }
+  const nm = normalizeRange(merge)
+  return { row: nm.startRow, col: nm.startCol }
+}

package/src/utils/outline.js

@@ -0,0 +1,109 @@
+/**
+ * Row/column grouping (outline) utilities
+ */
+
+/**
+ * Validate that a group range is valid (start <= end, no negative indices)
+ */
+export function validateGroup(startIndex, endIndex) {
+  return Number.isInteger(startIndex) && Number.isInteger(endIndex) && startIndex <= endIndex && startIndex >= 0
+}
+
+/**
+ * Add a group to a groups array (type: 'row' | 'column')
+ * @param {'row'|'column'} type
+ * @param {number} startIndex
+ * @param {number} endIndex
+ * @param {Array} groups
+ * @returns {Array} new groups array
+ */
+export function addGroup(type, startIndex, endIndex, groups) {
+  if (!validateGroup(startIndex, endIndex)) return groups
+  // Prevent exact duplicate
+  const dup = groups.find(g => g.type === type && g.startIndex === startIndex && g.endIndex === endIndex)
+  if (dup) return groups
+  return [...groups, { type, startIndex, endIndex }]
+}
+
+/**
+ * Remove a group (exact match by type + startIndex + endIndex)
+ */
+export function removeGroup(type, startIndex, endIndex, groups) {
+  return groups.filter(g => !(g.type === type && g.startIndex === startIndex && g.endIndex === endIndex))
+}
+
+/**
+ * Toggle collapse state of a group in collapsedGroups
+ * @param {{ type, startIndex, endIndex }} group
+ * @param {Array} collapsedGroups
+ * @returns {Array} updated collapsedGroups
+ */
+export function toggleGroupCollapse(group, collapsedGroups) {
+  const exists = collapsedGroups.find(
+    g => g.type === group.type && g.startIndex === group.startIndex && g.endIndex === group.endIndex
+  )
+  if (exists) {
+    return collapsedGroups.filter(g => !(g.type === group.type && g.startIndex === group.startIndex && g.endIndex === group.endIndex))
+  }
+  return [...collapsedGroups, { type: group.type, startIndex: group.startIndex, endIndex: group.endIndex }]
+}
+
+/**
+ * Check if a group is collapsed
+ */
+export function isGroupCollapsed(group, collapsedGroups) {
+  return collapsedGroups.some(
+    g => g.type === group.type && g.startIndex === group.startIndex && g.endIndex === group.endIndex
+  )
+}
+
+/**
+ * Get all row indices that are hidden due to collapsed groups
+ * @param {Array} groups
+ * @param {Array} collapsedGroups
+ * @returns {Set<number>}
+ */
+export function getCollapsedRowIndices(groups, collapsedGroups) {
+  const hidden = new Set()
+  for (const group of groups) {
+    if (group.type !== 'row') continue
+    if (isGroupCollapsed(group, collapsedGroups)) {
+      for (let i = group.startIndex; i <= group.endIndex; i++) {
+        hidden.add(i)
+      }
+    }
+  }
+  return hidden
+}
+
+/**
+ * Get all column indices hidden due to collapsed column groups
+ */
+export function getCollapsedColIndices(groups, collapsedGroups) {
+  const hidden = new Set()
+  for (const group of groups) {
+    if (group.type !== 'column') continue
+    if (isGroupCollapsed(group, collapsedGroups)) {
+      for (let i = group.startIndex; i <= group.endIndex; i++) {
+        hidden.add(i)
+      }
+    }
+  }
+  return hidden
+}
+
+/**
+ * Compute the nesting depth (outline level) for each index.
+ * Returns an array where element at position i = max nesting level for that index.
+ * Used for rendering "+/−" buttons at the right level offset.
+ */
+export function computeGroupDepths(type, groups, maxIndex) {
+  const depths = new Array(maxIndex + 1).fill(0)
+  for (const g of groups) {
+    if (g.type !== type) continue
+    for (let i = g.startIndex; i <= g.endIndex; i++) {
+      depths[i] = (depths[i] || 0) + 1
+    }
+  }
+  return depths
+}

package/src/utils/selection.js

@@ -0,0 +1,76 @@
+/**
+ * Cell selection utilities
+ */
+
+/**
+ * Normalize a range so startRow <= endRow and startCol <= endCol
+ */
+export function normalizeRange(range) {
+  return {
+    startRow: Math.min(range.startRow, range.endRow),
+    endRow: Math.max(range.startRow, range.endRow),
+    startCol: Math.min(range.startCol, range.endCol),
+    endCol: Math.max(range.startCol, range.endCol)
+  }
+}
+
+/**
+ * Check if a cell (row, col) is inside a normalized range
+ */
+export function isCellInRange(row, col, range) {
+  const r = normalizeRange(range)
+  return row >= r.startRow && row <= r.endRow && col >= r.startCol && col <= r.endCol
+}
+
+/**
+ * Check if a cell is inside any of the given ranges
+ */
+export function isCellInAnyRange(row, col, ranges) {
+  return ranges.some(range => isCellInRange(row, col, range))
+}
+
+/**
+ * Check whether two ranges overlap
+ */
+export function rangesOverlap(a, b) {
+  const ra = normalizeRange(a)
+  const rb = normalizeRange(b)
+  return !(ra.endRow < rb.startRow || ra.startRow > rb.endRow ||
+           ra.endCol < rb.startCol || ra.startCol > rb.endCol)
+}
+
+/**
+ * Build a range from activeCell to targetCell (for Shift+click / arrow+shift)
+ */
+export function buildRange(activeCell, targetCell) {
+  return {
+    startRow: activeCell.row,
+    startCol: activeCell.col,
+    endRow: targetCell.row,
+    endCol: targetCell.col
+  }
+}
+
+/**
+ * Get a single-cell range for a given cell
+ */
+export function singleCellRange(row, col) {
+  return { startRow: row, endRow: row, startCol: col, endCol: col }
+}
+
+/**
+ * Get the primary (active-cell-containing) range from a list of ranges
+ */
+export function getPrimaryRange(ranges, activeCell) {
+  if (!ranges || ranges.length === 0) return null
+  const found = ranges.find(r => isCellInRange(activeCell.row, activeCell.col, r))
+  return found ? normalizeRange(found) : normalizeRange(ranges[0])
+}
+
+/**
+ * Count cells in a range
+ */
+export function rangeSize(range) {
+  const r = normalizeRange(range)
+  return (r.endRow - r.startRow + 1) * (r.endCol - r.startCol + 1)
+}

package/src/utils/virtualScroll.js

@@ -0,0 +1,148 @@
+/**
+ * Virtual scrolling utilities
+ * Only DOM-visible rows are rendered to handle 200+ rows without lag.
+ */
+
+/**
+ * Calculate which rows should be rendered given scroll position and container height.
+ *
+ * @param {number} scrollTop       - current vertical scroll offset in px
+ * @param {number} containerHeight - visible container height in px
+ * @param {number} totalRows       - total number of data rows
+ * @param {number} rowHeight       - default row height in px
+ * @param {number[]} rowHeights    - per-row heights overrides (index → px), may be sparse
+ * @param {number} overscan        - extra rows to render above/below (default 5)
+ * @returns {{ startIndex, endIndex, offsetTop, totalHeight }}
+ */
+export function calcVisibleRows(scrollTop, containerHeight, totalRows, rowHeight, rowHeights = [], overscan = 5) {
+  if (totalRows === 0) return { startIndex: 0, endIndex: -1, offsetTop: 0, totalHeight: 0 }
+
+  // Build cumulative heights
+  let cumulative = 0
+  let startIndex = 0
+  let endIndex = 0
+  let offsetTop = 0
+  let foundStart = false
+
+  const cumulativeHeights = new Array(totalRows + 1)
+  cumulativeHeights[0] = 0
+  for (let i = 0; i < totalRows; i++) {
+    const h = rowHeights[i] !== undefined ? rowHeights[i] : rowHeight
+    cumulativeHeights[i + 1] = cumulativeHeights[i] + h
+  }
+  const totalHeight = cumulativeHeights[totalRows]
+
+  for (let i = 0; i < totalRows; i++) {
+    const rowBottom = cumulativeHeights[i + 1]
+    const rowTop = cumulativeHeights[i]
+
+    if (!foundStart && rowBottom > scrollTop) {
+      startIndex = i
+      offsetTop = rowTop
+      foundStart = true
+    }
+    if (foundStart && rowTop < scrollTop + containerHeight) {
+      endIndex = i
+    }
+  }
+
+  // If scrollTop is past all content, show the last rows
+  if (!foundStart && totalRows > 0) {
+    startIndex = totalRows - 1
+    endIndex = totalRows - 1
+    offsetTop = cumulativeHeights[totalRows - 1]
+  }
+
+  // Apply overscan
+  startIndex = Math.max(0, startIndex - overscan)
+  endIndex = Math.min(totalRows - 1, endIndex + overscan)
+
+  // Recalculate offsetTop with new startIndex
+  offsetTop = cumulativeHeights[startIndex]
+
+  return { startIndex, endIndex, offsetTop, totalHeight }
+}
+
+/**
+ * Build a cumulative-height lookup array from per-row heights.
+ * cumulativeHeights[i] = total px above row i.
+ * cumulativeHeights[totalRows] = total content height.
+ *
+ * Intended to be cached (e.g. as a Vue computed) and reused across scroll
+ * events so that findVisibleRange() can use O(log n) binary search.
+ *
+ * @param {number}   totalRows
+ * @param {number}   defaultHeight
+ * @param {Object}   rowHeightsMap  - sparse { index: px } overrides
+ * @param {Set}      hiddenSet      - Set of hidden row indices (height = 0)
+ * @returns {number[]} length = totalRows + 1
+ */
+export function buildCumulativeHeights(totalRows, defaultHeight, rowHeightsMap = {}, hiddenSet = new Set()) {
+  const cum = new Array(totalRows + 1)
+  cum[0] = 0
+  for (let i = 0; i < totalRows; i++) {
+    const h = hiddenSet.has(i) ? 0 : (rowHeightsMap[i] !== undefined ? rowHeightsMap[i] : defaultHeight)
+    cum[i + 1] = cum[i] + h
+  }
+  return cum
+}
+
+/**
+ * Find which rows are visible given a pre-built cumulativeHeights array.
+ * Uses binary search → O(log n) per frame (vs. O(n) in calcVisibleRows).
+ *
+ * @param {number}   scrollTop
+ * @param {number}   containerHeight
+ * @param {number}   totalRows
+ * @param {number[]} cumulativeHeights  - from buildCumulativeHeights()
+ * @param {number}   overscan           - extra rows above/below (default 5)
+ * @returns {{ startIndex, endIndex, offsetTop, totalHeight }}
+ */
+export function findVisibleRange(scrollTop, containerHeight, totalRows, cumulativeHeights, overscan = 5) {
+  if (totalRows === 0) return { startIndex: 0, endIndex: -1, offsetTop: 0, totalHeight: 0 }
+
+  const totalHeight = cumulativeHeights[totalRows]
+  const bottom = scrollTop + containerHeight
+
+  // Binary search: first row whose bottom edge > scrollTop
+  let lo = 0, hi = totalRows - 1
+  while (lo < hi) {
+    const mid = (lo + hi) >> 1
+    if (cumulativeHeights[mid + 1] <= scrollTop) lo = mid + 1
+    else hi = mid
+  }
+  let startIndex = lo
+
+  // Extend forward to cover the viewport bottom
+  let endIndex = startIndex
+  while (endIndex < totalRows - 1 && cumulativeHeights[endIndex + 1] < bottom) endIndex++
+
+  // Apply overscan
+  startIndex = Math.max(0, startIndex - overscan)
+  endIndex   = Math.min(totalRows - 1, endIndex + overscan)
+
+  return {
+    startIndex,
+    endIndex,
+    offsetTop:   cumulativeHeights[startIndex],
+    totalHeight
+  }
+}
+
+/**
+ * Get the top offset of a row
+ */
+export function getRowTop(rowIndex, rowHeight, rowHeights = []) {
+  let top = 0
+  for (let i = 0; i < rowIndex; i++) {
+    top += rowHeights[i] !== undefined ? rowHeights[i] : rowHeight
+  }
+  return top
+}
+
+/**
+ * Get the height of a specific row
+ */
+export function getRowHeight(rowIndex, rowHeight, rowHeights = []) {
+  return rowHeights[rowIndex] !== undefined ? rowHeights[rowIndex] : rowHeight
+}

package/src/utils/workerFactory.js

@@ -0,0 +1,4 @@
+// Rollup/library build fallback — no workers available in this context.
+// Webpack builds override this file via alias in vue.config.js.
+export function createExcelImportWorker() { return null }
+export function createExcelExportWorker() { return null }

package/src/utils/workerFactory.webpack.js

@@ -0,0 +1,7 @@
+// Webpack-only version — imported via vue.config.js alias.
+// worker-loader bundles each .worker.js file as a separate Web Worker entry.
+import ExcelImportWorker from './excelImportWorker.worker.js'
+import ExcelExportWorker from './excelExportWorker.worker.js'
+
+export function createExcelImportWorker() { return new ExcelImportWorker() }
+export function createExcelExportWorker() { return new ExcelExportWorker() }