@svgrid/grid 1.1.0 → 1.1.2

package/dist/row-resize.test.js

@@ -0,0 +1,329 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { rowResize } from './row-resize';
+const STRIP_CLASS = 'sv-grid-row-resize-handle';
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+/** Build a host `<table>` with `rows` body rows. Each row carries the
+ *  `tr.sv-grid-row` class + a `.sv-row-gutter` cell holding a
+ *  `data-svgrid-row` marker, matching what SvGrid renders. Extra classes
+ *  let individual tests opt rows out (header / spacer / no-gutter). */
+function buildGrid(specs) {
+    const host = document.createElement('div');
+    const table = document.createElement('table');
+    const tbody = document.createElement('tbody');
+    const rows = [];
+    specs.forEach((spec, i) => {
+        const tr = document.createElement('tr');
+        tr.className = ['sv-grid-row', ...(spec.rowClasses ?? [])].join(' ');
+        const cell = document.createElement('td');
+        cell.className = 'sv-grid-cell';
+        if (spec.gutter !== false)
+            cell.classList.add('sv-row-gutter');
+        const marker = document.createElement('span');
+        marker.setAttribute('data-svgrid-row', String(spec.rowIndex ?? i));
+        cell.appendChild(marker);
+        tr.appendChild(cell);
+        tbody.appendChild(tr);
+        rows.push(tr);
+    });
+    table.appendChild(tbody);
+    host.appendChild(table);
+    document.body.appendChild(host);
+    return { host, rows };
+}
+function gutterOf(tr) {
+    return tr.querySelector('.sv-row-gutter');
+}
+function stripOf(tr) {
+    return tr.querySelector(`.${STRIP_CLASS}`);
+}
+/** Mock getBoundingClientRect so a TR reports a real height in jsdom
+ *  (which otherwise returns all-zero rects). */
+function mockRowHeight(tr, height) {
+    tr.getBoundingClientRect = () => ({ height, width: 100, top: 0, left: 0, right: 100, bottom: height, x: 0, y: 0, toJSON() { } });
+}
+function pointer(type, init = {}) {
+    return new PointerEvent(type, { bubbles: true, cancelable: true, pointerId: 1, ...init });
+}
+const hosts = [];
+function track(host) {
+    hosts.push(host);
+    return host;
+}
+beforeEach(() => {
+    // jsdom lacks pointer-capture methods on elements; stub them so the action's
+    // try/catch wrapped calls have something to invoke.
+    if (!HTMLElement.prototype.setPointerCapture) {
+        HTMLElement.prototype.setPointerCapture = function () { };
+    }
+    if (!HTMLElement.prototype.releasePointerCapture) {
+        HTMLElement.prototype.releasePointerCapture = function () { };
+    }
+});
+afterEach(() => {
+    while (hosts.length)
+        hosts.pop().remove();
+    document.body.innerHTML = '';
+    document.body.style.cursor = '';
+});
+// ---------------------------------------------------------------------------
+// decorate()
+// ---------------------------------------------------------------------------
+describe('rowResize - strip injection', () => {
+    it('injects a resize strip into every gutter cell', () => {
+        const { host, rows } = buildGrid([{}, {}, {}]);
+        track(host);
+        const action = rowResize(host, { onResize: vi.fn() });
+        for (const tr of rows) {
+            const strip = stripOf(tr);
+            expect(strip).not.toBeNull();
+            expect(strip.getAttribute('role')).toBe('separator');
+            expect(strip.getAttribute('aria-orientation')).toBe('horizontal');
+            expect(strip.getAttribute('aria-label')).toBe('Resize row');
+            expect(strip.style.cursor).toBe('row-resize');
+        }
+        // Gutter cells become a positioning context with visible overflow.
+        expect(gutterOf(rows[0]).style.position).toBe('relative');
+        expect(gutterOf(rows[0]).style.overflow).toBe('visible');
+        action.destroy();
+    });
+    it('does not double-inject a strip on re-decorate', async () => {
+        const { host, rows } = buildGrid([{}]);
+        track(host);
+        const action = rowResize(host, { onResize: vi.fn() });
+        expect(rows[0].querySelectorAll(`.${STRIP_CLASS}`).length).toBe(1);
+        // Trigger the MutationObserver by appending an unrelated node.
+        gutterOf(rows[0]).appendChild(document.createElement('span'));
+        await Promise.resolve();
+        await new Promise((r) => setTimeout(r, 0));
+        expect(rows[0].querySelectorAll(`.${STRIP_CLASS}`).length).toBe(1);
+        action.destroy();
+    });
+    it('skips header rows, spacer rows, and rows without a gutter cell', () => {
+        const { host, rows } = buildGrid([
+            { rowClasses: ['sv-grid-header-row'] },
+            { rowClasses: ['sv-grid-row-spacer'] },
+            { gutter: false },
+            {}, // normal row gets a strip
+        ]);
+        track(host);
+        const action = rowResize(host, { onResize: vi.fn() });
+        expect(stripOf(rows[0])).toBeNull();
+        expect(stripOf(rows[1])).toBeNull();
+        expect(stripOf(rows[2])).toBeNull();
+        expect(stripOf(rows[3])).not.toBeNull();
+        action.destroy();
+    });
+    it('does not override an already-positioned gutter cell', () => {
+        const { host, rows } = buildGrid([{}]);
+        track(host);
+        gutterOf(rows[0]).style.position = 'sticky';
+        const action = rowResize(host, { onResize: vi.fn() });
+        expect(gutterOf(rows[0]).style.position).toBe('sticky');
+        action.destroy();
+    });
+    it('injects no strips when created disabled', () => {
+        const { host, rows } = buildGrid([{}, {}]);
+        track(host);
+        const action = rowResize(host, { onResize: vi.fn(), disabled: true });
+        expect(stripOf(rows[0])).toBeNull();
+        expect(stripOf(rows[1])).toBeNull();
+        action.destroy();
+    });
+});
+// ---------------------------------------------------------------------------
+// Drag lifecycle
+// ---------------------------------------------------------------------------
+describe('rowResize - drag', () => {
+    it('reports the new height on pointerup and fires move callbacks', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        mockRowHeight(rows[0], 32);
+        const onResize = vi.fn();
+        const onResizeMove = vi.fn();
+        const action = rowResize(host, { onResize, onResizeMove });
+        const strip = stripOf(rows[0]);
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }));
+        expect(strip.classList.contains('is-resizing')).toBe(true);
+        expect(document.body.style.cursor).toBe('row-resize');
+        // Drag down 20px -> 52.
+        window.dispatchEvent(pointer('pointermove', { clientY: 120 }));
+        expect(onResizeMove).toHaveBeenLastCalledWith(0, 52);
+        expect(rows[0].style.height).toBe('52px');
+        window.dispatchEvent(pointer('pointerup', { clientY: 120 }));
+        expect(onResize).toHaveBeenCalledWith(0, 52);
+        expect(strip.classList.contains('is-resizing')).toBe(false);
+        expect(document.body.style.cursor).toBe('');
+        action.destroy();
+    });
+    it('clamps the height to the min bound', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        mockRowHeight(rows[0], 32);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize, min: 24 });
+        const strip = stripOf(rows[0]);
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }));
+        // Drag far up -> would be negative, clamps to 24.
+        window.dispatchEvent(pointer('pointerup', { clientY: 0 }));
+        expect(onResize).toHaveBeenCalledWith(0, 24);
+        action.destroy();
+    });
+    it('clamps the height to the max bound', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        mockRowHeight(rows[0], 32);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize, max: 50 });
+        const strip = stripOf(rows[0]);
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }));
+        window.dispatchEvent(pointer('pointerup', { clientY: 1000 }));
+        expect(onResize).toHaveBeenCalledWith(0, 50);
+        action.destroy();
+    });
+    it('works without an onResizeMove callback (optional)', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        mockRowHeight(rows[0], 30);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize });
+        const strip = stripOf(rows[0]);
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 50 }));
+        expect(() => window.dispatchEvent(pointer('pointermove', { clientY: 60 }))).not.toThrow();
+        window.dispatchEvent(pointer('pointerup', { clientY: 60 }));
+        expect(onResize).toHaveBeenCalledWith(0, 40);
+        action.destroy();
+    });
+    it('ignores pointermove / pointerup when no drag is active', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        const onResize = vi.fn();
+        const onResizeMove = vi.fn();
+        const action = rowResize(host, { onResize, onResizeMove });
+        // No pointerdown first - listeners were only attached on down, so these
+        // shouldn't do anything even if dispatched.
+        window.dispatchEvent(pointer('pointermove', { clientY: 10 }));
+        window.dispatchEvent(pointer('pointerup', { clientY: 10 }));
+        expect(onResize).not.toHaveBeenCalled();
+        expect(onResizeMove).not.toHaveBeenCalled();
+        action.destroy();
+    });
+});
+// ---------------------------------------------------------------------------
+// pointerdown guards
+// ---------------------------------------------------------------------------
+describe('rowResize - pointerdown guards', () => {
+    it('ignores pointerdown when disabled', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        mockRowHeight(rows[0], 32);
+        const onResize = vi.fn();
+        // Start enabled so a strip exists, then disable via update.
+        const action = rowResize(host, { onResize });
+        const strip = stripOf(rows[0]);
+        action.update({ onResize, disabled: true });
+        // update removes strips, but dispatch on the (now-detached) strip anyway:
+        // even if it were still in the DOM, current.disabled short-circuits.
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }));
+        window.dispatchEvent(pointer('pointerup', { clientY: 50 }));
+        expect(onResize).not.toHaveBeenCalled();
+        action.destroy();
+    });
+    it('ignores pointerdown on a non-strip target', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize });
+        gutterOf(rows[0]).dispatchEvent(pointer('pointerdown', { clientY: 10 }));
+        expect(document.body.style.cursor).toBe('');
+        action.destroy();
+    });
+    it('ignores a strip whose row has a non-finite row index', () => {
+        const { host, rows } = buildGrid([{}]);
+        track(host);
+        // Remove the data-svgrid-row marker so rowIndexOf returns NaN.
+        rows[0].querySelector('[data-svgrid-row]').removeAttribute('data-svgrid-row');
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize });
+        const strip = stripOf(rows[0]);
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }));
+        expect(document.body.style.cursor).toBe('');
+        expect(strip.classList.contains('is-resizing')).toBe(false);
+        action.destroy();
+    });
+    it('ignores a strip not inside a tr.sv-grid-row', () => {
+        const host = track(document.createElement('div'));
+        document.body.appendChild(host);
+        // A loose strip with no matching ancestor row.
+        const strip = document.createElement('div');
+        strip.className = STRIP_CLASS;
+        host.appendChild(strip);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize });
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }));
+        expect(document.body.style.cursor).toBe('');
+        action.destroy();
+    });
+});
+// ---------------------------------------------------------------------------
+// update() + destroy()
+// ---------------------------------------------------------------------------
+describe('rowResize - update + destroy', () => {
+    it('removes strips when toggled to disabled and restores when re-enabled', () => {
+        const { host, rows } = buildGrid([{}, {}]);
+        track(host);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize, disabled: false });
+        expect(stripOf(rows[0])).not.toBeNull();
+        action.update({ onResize, disabled: true });
+        expect(stripOf(rows[0])).toBeNull();
+        expect(stripOf(rows[1])).toBeNull();
+        action.update({ onResize, disabled: false });
+        expect(stripOf(rows[0])).not.toBeNull();
+        action.destroy();
+    });
+    it('does not repaint when disabled flag is unchanged on update', () => {
+        const { host, rows } = buildGrid([{}]);
+        track(host);
+        const action = rowResize(host, { onResize: vi.fn() });
+        const firstStrip = stripOf(rows[0]);
+        // Same disabled value -> decorate is NOT called, strip stays the same node.
+        action.update({ onResize: vi.fn() });
+        expect(stripOf(rows[0])).toBe(firstStrip);
+        action.destroy();
+    });
+    it('destroy removes all strips and detaches listeners', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        mockRowHeight(rows[0], 32);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize });
+        expect(stripOf(rows[0])).not.toBeNull();
+        action.destroy();
+        expect(stripOf(rows[0])).toBeNull();
+        // After destroy the pointerdown listener is gone; re-create a strip
+        // manually and confirm no drag starts.
+        const strip = document.createElement('div');
+        strip.className = STRIP_CLASS;
+        gutterOf(rows[0]).appendChild(strip);
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }));
+        expect(document.body.style.cursor).toBe('');
+    });
+    it('uses default min=20 / max=320 when bounds are omitted', () => {
+        const { host, rows } = buildGrid([{ rowIndex: 0 }]);
+        track(host);
+        mockRowHeight(rows[0], 100);
+        const onResize = vi.fn();
+        const action = rowResize(host, { onResize });
+        const strip = stripOf(rows[0]);
+        strip.dispatchEvent(pointer('pointerdown', { clientY: 0 }));
+        // Drag way past max -> clamps to 320.
+        window.dispatchEvent(pointer('pointermove', { clientY: 10000 }));
+        expect(rows[0].style.height).toBe('320px');
+        // Drag way below min -> clamps to 20.
+        window.dispatchEvent(pointer('pointerup', { clientY: -10000 }));
+        expect(onResize).toHaveBeenCalledWith(0, 20);
+        action.destroy();
+    });
+});

package/dist/scroll-sync.js

@@ -64,6 +64,9 @@ export function createScrollSync(ctx) {
         if (ctx.columnMenuFor || ctx.operatorMenuFor)
             ctx.closeMenus();
         scheduleScrollSync(container.scrollTop, container.scrollLeft);
+        // Mirror horizontal scroll to any aligned grids in the same group.
+        if (ctx.props.alignedGridGroup != null)
+            ctx.broadcastAlignedScroll(container.scrollLeft);
         if (ctx.props.onScrollBottomReached) {
             const { scrollTop, scrollHeight, clientHeight } = container;
             const atBottom = scrollTop + clientHeight >= scrollHeight - 32;

package/dist/scroll-sync.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/scroll-sync.test.js

@@ -0,0 +1,290 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { createScrollSync } from './scroll-sync';
+// ---------------------------------------------------------------------------
+// Fake controller `ctx` for the scroll-sync handlers. As with the other
+// controller-slice tests, the handlers read/write everything through `ctx`,
+// so a hand-rolled stub drives every branch. Where the handler reads real DOM
+// geometry (tooltip placement, scroll offsets) we build genuine elements and
+// stub getBoundingClientRect / scroll metrics.
+// ---------------------------------------------------------------------------
+function makeCtx(overrides = {}) {
+    const ctx = {
+        tooltip: null,
+        tooltipTimer: null,
+        scrollSyncRaf: null,
+        scrollVersion: 0,
+        pendingScrollTop: 0,
+        pendingScrollLeft: 0,
+        rowVirtualizationEnabled: false,
+        columnVirtualizationEnabled: false,
+        scrollBottomArmed: true,
+        columnMenuFor: null,
+        operatorMenuFor: null,
+        closeMenus: vi.fn(),
+        domToLogicalRowOffset: (n) => n,
+        virtualizer: { setScrollOffset: vi.fn() },
+        columnVirtualizer: { setHorizontalOffset: vi.fn() },
+        props: {},
+        ...overrides,
+    };
+    return ctx;
+}
+const syncFor = (overrides) => {
+    const ctx = makeCtx(overrides);
+    return { ctx, ss: createScrollSync(ctx) };
+};
+describe('showTooltipFor / hideTooltip', () => {
+    beforeEach(() => {
+        vi.useFakeTimers();
+    });
+    afterEach(() => {
+        vi.useRealTimers();
+    });
+    function anchorEl(rect) {
+        const el = document.createElement('div');
+        el.getBoundingClientRect = () => ({ left: 0, right: 0, top: 0, bottom: 0, width: 0, height: 0, x: 0, y: 0, ...rect });
+        return el;
+    }
+    it('does nothing when there is no text', () => {
+        const { ctx, ss } = syncFor();
+        ss.showTooltipFor(anchorEl({}), '');
+        expect(ctx.tooltipTimer).toBeNull();
+        vi.runAllTimers();
+        expect(ctx.tooltip).toBeNull();
+    });
+    it('schedules a tooltip after the debounce, positioned below the anchor', () => {
+        const { ctx, ss } = syncFor();
+        // Anchor near the top of a tall viewport -> tooltip appears below.
+        vi.stubGlobal('innerWidth', 1000);
+        vi.stubGlobal('innerHeight', 800);
+        const el = anchorEl({ left: 100, right: 140, top: 50, bottom: 70 });
+        ss.showTooltipFor(el, 'hello');
+        expect(ctx.tooltipTimer).not.toBeNull();
+        expect(ctx.tooltip).toBeNull(); // not yet flushed
+        vi.advanceTimersByTime(250);
+        expect(ctx.tooltip).toEqual({
+            text: 'hello',
+            x: 106, // left + 6, within clamp range
+            y: 76, // bottom + 6 since "below"
+            below: true,
+        });
+    });
+    it('flips above the anchor when there is no room below', () => {
+        const { ctx, ss } = syncFor();
+        vi.stubGlobal('innerWidth', 1000);
+        vi.stubGlobal('innerHeight', 200);
+        // bottom + 64 is NOT < 200, so the tooltip renders above.
+        const el = anchorEl({ left: 100, right: 140, top: 150, bottom: 170 });
+        ss.showTooltipFor(el, 'world');
+        vi.advanceTimersByTime(250);
+        expect(ctx.tooltip.below).toBe(false);
+        expect(ctx.tooltip.y).toBe(144); // top - 6
+    });
+    it('clamps x so a wide tooltip stays inside the viewport', () => {
+        const { ctx, ss } = syncFor();
+        vi.stubGlobal('innerWidth', 300);
+        vi.stubGlobal('innerHeight', 800);
+        const el = anchorEl({ left: 280, right: 300, top: 10, bottom: 30 });
+        ss.showTooltipFor(el, 'edge');
+        vi.advanceTimersByTime(250);
+        // x clamped to vw - 290 = 10.
+        expect(ctx.tooltip.x).toBe(10);
+    });
+    it('clears a pending timer before scheduling a new tooltip', () => {
+        const { ctx, ss } = syncFor();
+        const clearSpy = vi.spyOn(window, 'clearTimeout');
+        const el = anchorEl({ left: 10, right: 30, top: 10, bottom: 30 });
+        ss.showTooltipFor(el, 'first');
+        ss.showTooltipFor(el, 'second');
+        expect(clearSpy).toHaveBeenCalled();
+        clearSpy.mockRestore();
+    });
+    it('hideTooltip clears the pending timer and the tooltip', () => {
+        const { ctx, ss } = syncFor();
+        const el = anchorEl({ left: 10, right: 30, top: 10, bottom: 30 });
+        ss.showTooltipFor(el, 'gone');
+        ctx.tooltip = { text: 'x', x: 0, y: 0, below: true };
+        ss.hideTooltip();
+        expect(ctx.tooltipTimer).toBeNull();
+        expect(ctx.tooltip).toBeNull();
+    });
+    it('hideTooltip is safe when no timer is pending', () => {
+        const { ctx, ss } = syncFor();
+        ctx.tooltip = { text: 'x', x: 0, y: 0, below: true };
+        ss.hideTooltip();
+        expect(ctx.tooltip).toBeNull();
+    });
+});
+describe('scheduleScrollSync / flushScheduledScrollSync', () => {
+    let rafCb = null;
+    let rafCalls = 0;
+    beforeEach(() => {
+        rafCb = null;
+        rafCalls = 0;
+        vi.stubGlobal('requestAnimationFrame', (cb) => {
+            rafCb = cb;
+            rafCalls += 1;
+            return 42;
+        });
+    });
+    afterEach(() => {
+        vi.unstubAllGlobals();
+    });
+    it('records the pending offsets and schedules a single rAF', () => {
+        const { ctx, ss } = syncFor();
+        ss.scheduleScrollSync(120, 45);
+        expect(ctx.pendingScrollTop).toBe(120);
+        expect(ctx.pendingScrollLeft).toBe(45);
+        expect(ctx.scrollSyncRaf).toBe(42);
+        expect(rafCalls).toBe(1);
+    });
+    it('coalesces back-to-back calls into one frame (latest position wins)', () => {
+        const { ctx, ss } = syncFor();
+        ss.scheduleScrollSync(10, 0);
+        ss.scheduleScrollSync(200, 5); // raf already pending, must not re-schedule
+        expect(rafCalls).toBe(1);
+        expect(ctx.pendingScrollTop).toBe(200);
+        expect(ctx.pendingScrollLeft).toBe(5);
+    });
+    it('flush bumps scrollVersion and clears the raf handle', () => {
+        const { ctx, ss } = syncFor();
+        ss.scheduleScrollSync(50, 50);
+        rafCb?.(0);
+        expect(ctx.scrollVersion).toBe(1);
+        expect(ctx.scrollSyncRaf).toBeNull();
+    });
+    it('flush pushes the row offset through domToLogicalRowOffset when row virtualization is on', () => {
+        const setScrollOffset = vi.fn();
+        const { ss } = syncFor({
+            rowVirtualizationEnabled: true,
+            domToLogicalRowOffset: (n) => n * 2,
+            virtualizer: { setScrollOffset },
+        });
+        ss.scheduleScrollSync(30, 0);
+        rafCb?.(0);
+        expect(setScrollOffset).toHaveBeenCalledWith(60);
+    });
+    it('flush pushes the horizontal offset when column virtualization is on', () => {
+        const setHorizontalOffset = vi.fn();
+        const { ss } = syncFor({
+            columnVirtualizationEnabled: true,
+            columnVirtualizer: { setHorizontalOffset },
+        });
+        ss.scheduleScrollSync(0, 88);
+        rafCb?.(0);
+        expect(setHorizontalOffset).toHaveBeenCalledWith(88);
+    });
+    it('flush skips both virtualizers when neither is enabled', () => {
+        const { ctx, ss } = syncFor();
+        ss.scheduleScrollSync(5, 5);
+        rafCb?.(0);
+        expect(ctx.virtualizer.setScrollOffset).not.toHaveBeenCalled();
+        expect(ctx.columnVirtualizer.setHorizontalOffset).not.toHaveBeenCalled();
+    });
+});
+describe('onBodyScroll', () => {
+    let rafCb = null;
+    beforeEach(() => {
+        rafCb = null;
+        vi.stubGlobal('requestAnimationFrame', (cb) => {
+            rafCb = cb;
+            return 7;
+        });
+    });
+    afterEach(() => {
+        vi.unstubAllGlobals();
+    });
+    function scrollEvent(container) {
+        return { currentTarget: container };
+    }
+    function scroller(props) {
+        const el = document.createElement('div');
+        Object.defineProperty(el, 'scrollTop', { value: props.scrollTop ?? 0, configurable: true });
+        Object.defineProperty(el, 'scrollLeft', { value: props.scrollLeft ?? 0, configurable: true });
+        Object.defineProperty(el, 'scrollHeight', { value: props.scrollHeight ?? 0, configurable: true });
+        Object.defineProperty(el, 'clientHeight', { value: props.clientHeight ?? 0, configurable: true });
+        return el;
+    }
+    it('does nothing when there is no current target', () => {
+        const { ctx, ss } = syncFor();
+        ss.onBodyScroll(scrollEvent(null));
+        expect(ctx.pendingScrollTop).toBe(0);
+    });
+    it('records the container scroll offsets via scheduleScrollSync', () => {
+        const { ctx, ss } = syncFor();
+        const el = scroller({ scrollTop: 90, scrollLeft: 12 });
+        ss.onBodyScroll(scrollEvent(el));
+        expect(ctx.pendingScrollTop).toBe(90);
+        expect(ctx.pendingScrollLeft).toBe(12);
+        expect(ctx.scrollSyncRaf).toBe(7);
+    });
+    it('closes open column/operator menus on scroll', () => {
+        const closeMenus = vi.fn();
+        const { ss } = syncFor({ columnMenuFor: 'x', closeMenus });
+        ss.onBodyScroll(scrollEvent(scroller({})));
+        expect(closeMenus).toHaveBeenCalled();
+    });
+    it('closes menus when an operator menu is open', () => {
+        const closeMenus = vi.fn();
+        const { ss } = syncFor({ operatorMenuFor: 'op', closeMenus });
+        ss.onBodyScroll(scrollEvent(scroller({})));
+        expect(closeMenus).toHaveBeenCalled();
+    });
+    it('does not close menus when none are open', () => {
+        const closeMenus = vi.fn();
+        const { ss } = syncFor({ closeMenus });
+        ss.onBodyScroll(scrollEvent(scroller({})));
+        expect(closeMenus).not.toHaveBeenCalled();
+    });
+    it('fires onScrollBottomReached once when the scroll reaches the bottom', () => {
+        const onScrollBottomReached = vi.fn();
+        const { ctx, ss } = syncFor({
+            props: { onScrollBottomReached },
+            scrollBottomArmed: true,
+        });
+        // scrollTop + clientHeight >= scrollHeight - 32 -> at bottom.
+        const el = scroller({ scrollTop: 600, clientHeight: 400, scrollHeight: 1000 });
+        ss.onBodyScroll(scrollEvent(el));
+        expect(onScrollBottomReached).toHaveBeenCalledWith({
+            scrollTop: 600,
+            scrollHeight: 1000,
+            clientHeight: 400,
+        });
+        expect(ctx.scrollBottomArmed).toBe(false); // disarmed so it won't refire
+    });
+    it('does not refire onScrollBottomReached while still at the bottom (disarmed)', () => {
+        const onScrollBottomReached = vi.fn();
+        const { ss } = syncFor({
+            props: { onScrollBottomReached },
+            scrollBottomArmed: false,
+        });
+        const el = scroller({ scrollTop: 600, clientHeight: 400, scrollHeight: 1000 });
+        ss.onBodyScroll(scrollEvent(el));
+        expect(onScrollBottomReached).not.toHaveBeenCalled();
+    });
+    it('re-arms the trigger after scrolling away from the bottom', () => {
+        const onScrollBottomReached = vi.fn();
+        const { ctx, ss } = syncFor({
+            props: { onScrollBottomReached },
+            scrollBottomArmed: false,
+        });
+        // Not at bottom: scrollTop + clientHeight < scrollHeight - 32.
+        const el = scroller({ scrollTop: 100, clientHeight: 400, scrollHeight: 1000 });
+        ss.onBodyScroll(scrollEvent(el));
+        expect(ctx.scrollBottomArmed).toBe(true);
+        expect(onScrollBottomReached).not.toHaveBeenCalled();
+    });
+    it('skips the bottom-reached logic entirely when no callback is registered', () => {
+        const { ctx, ss } = syncFor({ scrollBottomArmed: true });
+        const el = scroller({ scrollTop: 600, clientHeight: 400, scrollHeight: 1000 });
+        ss.onBodyScroll(scrollEvent(el));
+        // Armed flag is untouched when there is no callback.
+        expect(ctx.scrollBottomArmed).toBe(true);
+    });
+});
+describe('createScrollSync wiring', () => {
+    it('exposes the documented handler surface', () => {
+        const { ss } = syncFor();
+        expect(Object.keys(ss).sort()).toEqual(['flushScheduledScrollSync', 'hideTooltip', 'onBodyScroll', 'scheduleScrollSync', 'showTooltipFor']);
+    });
+});

package/dist/selection.d.ts

@@ -6,7 +6,7 @@ export declare function createSelection<TFeatures extends TableFeatures = TableF
     toggleSelectAllRows: () => void;
     setActiveCell: (rowIndex: number, colIndex: number) => void;
     scrollActiveCellIntoView: (rowIndex: number, colIndex: number) => void;
-    setSelection: (rowIndex: number, colIndex: number) => void;
+    setSelection: (rowIndex: number, colIndex: number, additive?: boolean) => void;
     extendSelection: (rowIndex: number, colIndex: number) => void;
     isCellInSelectedRange: (rowIndex: number, colIndex: number) => boolean;
     getCellRangeEdges: (rowIndex: number, colIndex: number) => {
@@ -15,6 +15,12 @@ export declare function createSelection<TFeatures extends TableFeatures = TableF
         left: boolean;
         right: boolean;
     } | null;
+    getSelectionRects: () => {
+        minRow: number;
+        maxRow: number;
+        minCol: number;
+        maxCol: number;
+    }[];
     isInFillPreview: (rowIndex: number, colIndex: number) => boolean;
     findColumnById: (columnId: string) => any;
     onCellPointerDown: (rowIndex: number, colIndex: number, event: PointerEvent) => void;