@svgrid/grid 1.1.0 → 1.1.1

package/dist/clipboard.js

@@ -5,7 +5,7 @@ import { parseEditorValue, } from "./index";
 import "./sv-grid-scrollbar";
 import { buildFillPattern } from "./fill-patterns";
 import { getCellKey, } from "./SvGrid.helpers";
-import { getColumnBaseValue, isGroupRow, } from "./cell-values";
+import { getColumnBaseValue, isGroupRow, toolPanelHeaderLabel, } from "./cell-values";
 export function createClipboard(ctx) {
     /** Read the raw underlying value for the cell at (rowIndex, columnId)
      *  for pattern extraction. */
@@ -244,35 +244,99 @@ export function createClipboard(ctx) {
         };
         ctx.grid.store.setState((prev) => ({ ...prev }));
     }
+    /**
+     * Write text to the OS clipboard, with a legacy fallback for insecure
+     * contexts. The async Clipboard API requires a secure context (HTTPS or
+     * localhost); on plain HTTP - e.g. a grid served by XAMPP/Apache over a LAN
+     * host - `navigator.clipboard` is undefined and copy/cut would silently do
+     * nothing. There we fall back to a temporary <textarea> + execCommand('copy'),
+     * which still works in an insecure context. This MUST be called synchronously
+     * from the user gesture (the keydown handler) so execCommand is allowed.
+     */
+    function writeClipboardText(text) {
+        if (navigator.clipboard?.writeText) {
+            void navigator.clipboard.writeText(text).catch(() => legacyCopyText(text));
+            return;
+        }
+        legacyCopyText(text);
+    }
+    function legacyCopyText(text) {
+        if (typeof document === "undefined")
+            return false;
+        const active = document.activeElement;
+        const ta = document.createElement("textarea");
+        ta.value = text;
+        ta.setAttribute("readonly", "");
+        // Offscreen but still selectable; opacity/0-size can suppress selection.
+        ta.style.cssText =
+            "position:fixed;top:0;left:-9999px;width:1px;height:1px;padding:0;border:0;";
+        document.body.appendChild(ta);
+        let ok = false;
+        try {
+            ta.select();
+            ta.setSelectionRange(0, text.length);
+            ok = document.execCommand("copy");
+        }
+        catch {
+            ok = false;
+        }
+        document.body.removeChild(ta);
+        // Restore focus to the grid root so keyboard nav keeps working afterward.
+        (active ?? ctx.gridRootEl)?.focus?.({
+            preventScroll: true,
+        });
+        return ok;
+    }
     function copySelectionToClipboard() {
-        const anchor = ctx.selectionRange.anchor;
-        const focus = ctx.selectionRange.focus;
-        if (!anchor || !focus)
+        // Copy every selected rectangle. Each range becomes a TSV block; multiple
+        // ranges are stacked and separated by a blank line (Sheets-style).
+        const rects = ctx.getSelectionRects();
+        if (!rects.length)
             return;
-        const minRow = Math.min(anchor.rowIndex, focus.rowIndex);
-        const maxRow = Math.max(anchor.rowIndex, focus.rowIndex);
-        const minCol = Math.min(anchor.colIndex, focus.colIndex);
-        const maxCol = Math.max(anchor.colIndex, focus.colIndex);
-        const lines = [];
-        for (let r = minRow; r <= maxRow; r += 1) {
-            const row = ctx.allRows[r];
-            if (!row || isGroupRow(row))
-                continue;
-            const cells = [];
-            for (let c = minCol; c <= maxCol; c += 1) {
-                const column = ctx.allColumns[c];
-                if (!column) {
-                    cells.push("");
+        // Optional: prepend a header row (Excel "copy with headers") and/or run
+        // each value through a consumer hook before it hits the clipboard.
+        const withHeaders = ctx.props.copyHeadersToClipboard === true;
+        const processCell = ctx.props.processCellForClipboard;
+        const blocks = [];
+        for (const rect of rects) {
+            const lines = [];
+            if (withHeaders) {
+                const header = [];
+                for (let c = rect.minCol; c <= rect.maxCol; c += 1) {
+                    const column = ctx.allColumns[c];
+                    header.push(column ? toolPanelHeaderLabel(column) : "");
+                }
+                lines.push(header.join("\t"));
+            }
+            for (let r = rect.minRow; r <= rect.maxRow; r += 1) {
+                const row = ctx.allRows[r];
+                if (!row || isGroupRow(row))
                     continue;
+                const cells = [];
+                for (let c = rect.minCol; c <= rect.maxCol; c += 1) {
+                    const column = ctx.allColumns[c];
+                    if (!column) {
+                        cells.push("");
+                        continue;
+                    }
+                    const base = getColumnBaseValue(row, column);
+                    let value = ctx.getCellDisplayValue(row.id, column.id, base);
+                    if (processCell) {
+                        value = processCell({
+                            value,
+                            column,
+                            row: row.original,
+                            rowIndex: r,
+                            columnId: column.id,
+                        });
+                    }
+                    cells.push(String(value ?? ""));
                 }
-                const base = getColumnBaseValue(row, column);
-                const display = ctx.getCellDisplayValue(row.id, column.id, base);
-                cells.push(String(display ?? ""));
+                lines.push(cells.join("\t"));
             }
-            lines.push(cells.join("\t"));
+            blocks.push(lines.join("\n"));
         }
-        const text = lines.join("\n");
-        void navigator.clipboard?.writeText(text).catch(() => { });
+        writeClipboardText(blocks.join("\n\n"));
     }
     /**
      * Clear every editable cell in the current selection range. Used by

package/dist/clipboard.test.d.ts

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