@umituz/web-canvas 1.1.1 → 1.2.1

package/dist/index.js

@@ -1010,7 +1010,76 @@ ${project.appMetadata.whatsNew}`;
   }
 };
 
+// src/infrastructure/services/minimalXlsx.ts
+var XML_HEADER = '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';
+function escapeXml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&apos;");
+}
+function safeSheetName(name, index) {
+  const cleaned = name.replace(/[:\\/?*[\]]/g, " ").slice(0, 31).trim();
+  return cleaned.length > 0 ? cleaned : `Sheet${index + 1}`;
+}
+function columnName(index) {
+  let name = "";
+  let n = index;
+  while (n >= 0) {
+    name = String.fromCharCode(65 + n % 26) + name;
+    n = Math.floor(n / 26) - 1;
+  }
+  return name;
+}
+function cellXml(value, row, column) {
+  const ref = `${columnName(column)}${row}`;
+  if (typeof value === "number" && Number.isFinite(value)) {
+    return `<c r="${ref}"><v>${value}</v></c>`;
+  }
+  const text = value === null || value === void 0 ? "" : typeof value === "boolean" ? value ? "TRUE" : "FALSE" : String(value);
+  return `<c r="${ref}" t="inlineStr"><is><t xml:space="preserve">${escapeXml(text)}</t></is></c>`;
+}
+function sheetXml(rows) {
+  const body = rows.map((row, rowIndex) => {
+    const cells = row.map((value, columnIndex) => cellXml(value, rowIndex + 1, columnIndex)).join("");
+    return `<row r="${rowIndex + 1}">${cells}</row>`;
+  }).join("");
+  return `${XML_HEADER}<worksheet xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main"><sheetData>${body}</sheetData></worksheet>`;
+}
+async function writeXlsxBlob(sheets, JSZip) {
+  const zip = new JSZip();
+  const safeNames = sheets.map((sheet, index) => safeSheetName(sheet.name, index));
+  zip.file(
+    "[Content_Types].xml",
+    `${XML_HEADER}<Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types"><Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/><Default Extension="xml" ContentType="application/xml"/><Override PartName="/xl/workbook.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet.main+xml"/>` + safeNames.map(
+      (_, index) => `<Override PartName="/xl/worksheets/sheet${index + 1}.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.worksheet+xml"/>`
+    ).join("") + "</Types>"
+  );
+  zip.file(
+    "_rels/.rels",
+    `${XML_HEADER}<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"><Relationship Id="rId1" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/officeDocument" Target="xl/workbook.xml"/></Relationships>`
+  );
+  zip.file(
+    "xl/workbook.xml",
+    `${XML_HEADER}<workbook xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main" xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships"><sheets>` + safeNames.map((name, index) => `<sheet name="${escapeXml(name)}" sheetId="${index + 1}" r:id="rId${index + 1}"/>`).join("") + "</sheets></workbook>"
+  );
+  zip.file(
+    "xl/_rels/workbook.xml.rels",
+    `${XML_HEADER}<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships">` + safeNames.map(
+      (_, index) => `<Relationship Id="rId${index + 1}" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/worksheet" Target="worksheets/sheet${index + 1}.xml"/>`
+    ).join("") + "</Relationships>"
+  );
+  sheets.forEach((sheet, index) => {
+    zip.file(`xl/worksheets/sheet${index + 1}.xml`, sheetXml(sheet.rows));
+  });
+  return zip.generateAsync({ type: "blob" });
+}
+
 // src/application/services/ReportService.ts
+function recordsToSheet(name, records) {
+  const headers = [...new Set(records.flatMap((record) => Object.keys(record)))];
+  return {
+    name,
+    rows: [headers, ...records.map((record) => headers.map((header) => record[header]))]
+  };
+}
 var ReportService = class _ReportService {
   static getInstance() {
     if (!_ReportService.instance) {
@@ -1056,31 +1125,19 @@ var ReportService = class _ReportService {
    * Export data to Excel
    */
   async exportToExcel(data, options = {}) {
-    const XLSX = await import("xlsx");
-    const wb = XLSX.utils.book_new();
+    const JSZip = (await import("jszip")).default;
     const apps = data.items.filter((i) => i.type === "app").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
     const campaigns = data.items.filter((i) => i.type === "campaign").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
     const posts = data.items.filter((i) => i.type === "post").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
+    const sheets = [];
     if (apps.length > 0) {
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(apps),
-        options.sheetName || "Apps"
-      );
+      sheets.push(recordsToSheet(options.sheetName || "Apps", apps));
     }
     if (campaigns.length > 0) {
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(campaigns),
-        "Campaigns"
-      );
+      sheets.push(recordsToSheet("Campaigns", campaigns));
     }
     if (posts.length > 0) {
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(posts),
-        "Posts"
-      );
+      sheets.push(recordsToSheet("Posts", posts));
     }
     if (options.includeSummary !== false) {
       const summary = [
@@ -1098,13 +1155,18 @@ var ReportService = class _ReportService {
           Value: (/* @__PURE__ */ new Date()).toLocaleDateString()
         }
       ];
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(summary),
-        "Summary"
-      );
+      sheets.push(recordsToSheet("Summary", summary));
+    }
+    if (sheets.length === 0) {
+      sheets.push({ name: options.sheetName || "Sheet1", rows: [] });
     }
-    XLSX.writeFile(wb, options.filename || "report.xlsx");
+    const blob = await writeXlsxBlob(sheets, JSZip);
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    link.href = url;
+    link.download = options.filename || "report.xlsx";
+    link.click();
+    URL.revokeObjectURL(url);
   }
   /**
    * Export data to CSV
@@ -1744,19 +1806,28 @@ function useReportExport() {
 var import_react4 = require("react");
 var DEFAULT_BRUSH_SIZE = 3;
 var DEFAULT_COLOR = "#1a1a1a";
+var DEFAULT_KEYBOARD_STEP = 4;
+var KEYBOARD_FAST_FACTOR = 4;
 function widthFor(stroke, point) {
   if (!stroke.dynamic) return stroke.size;
   return stroke.size * (0.5 + Math.min(1, Math.max(0, point.pressure)));
 }
 function useFreehandCanvas(options = {}) {
-  const { brushSize = DEFAULT_BRUSH_SIZE, color = DEFAULT_COLOR, pressureEnabled = true } = options;
-  const optionsRef = (0, import_react4.useRef)({ brushSize, color, pressureEnabled, onStrokeEnd: options.onStrokeEnd });
-  optionsRef.current = { brushSize, color, pressureEnabled, onStrokeEnd: options.onStrokeEnd };
+  const {
+    brushSize = DEFAULT_BRUSH_SIZE,
+    color = DEFAULT_COLOR,
+    pressureEnabled = true,
+    keyboard = false,
+    keyboardStep = DEFAULT_KEYBOARD_STEP
+  } = options;
+  const optionsRef = (0, import_react4.useRef)({ brushSize, color, pressureEnabled, keyboardStep, onStrokeEnd: options.onStrokeEnd });
+  optionsRef.current = { brushSize, color, pressureEnabled, keyboardStep, onStrokeEnd: options.onStrokeEnd };
   const canvasRef = (0, import_react4.useRef)(null);
   const strokesRef = (0, import_react4.useRef)([]);
   const activeStrokeRef = (0, import_react4.useRef)(null);
   const activePointerIdRef = (0, import_react4.useRef)(null);
   const dprRef = (0, import_react4.useRef)(1);
+  const penRef = (0, import_react4.useRef)(null);
   const [strokeCount, setStrokeCount] = (0, import_react4.useState)(0);
   const redraw = (0, import_react4.useCallback)(() => {
     const canvas = canvasRef.current;
@@ -1789,6 +1860,18 @@ function useFreehandCanvas(options = {}) {
         ctx.stroke();
       }
     }
+    const pen = penRef.current;
+    if (pen?.engaged && !pen.down) {
+      const reach = 5;
+      ctx.strokeStyle = "rgba(35, 37, 43, 0.55)";
+      ctx.lineWidth = 1;
+      ctx.beginPath();
+      ctx.moveTo(pen.x - reach, pen.y);
+      ctx.lineTo(pen.x + reach, pen.y);
+      ctx.moveTo(pen.x, pen.y - reach);
+      ctx.lineTo(pen.x, pen.y + reach);
+      ctx.stroke();
+    }
   }, []);
   const syncDimensions = (0, import_react4.useCallback)(() => {
     const canvas = canvasRef.current;
@@ -1807,6 +1890,8 @@ function useFreehandCanvas(options = {}) {
     if (!canvas) return;
     const el = canvas;
     el.style.touchAction = "none";
+    if (keyboard && !el.hasAttribute("tabindex")) el.tabIndex = 0;
+    if (!penRef.current) penRef.current = { x: el.clientWidth / 2, y: el.clientHeight / 2, down: false, engaged: false };
     syncDimensions();
     redraw();
     const observer = new ResizeObserver(() => {
@@ -1855,6 +1940,7 @@ function useFreehandCanvas(options = {}) {
         points: [pointFrom(event)]
       };
       activeStrokeRef.current = stroke;
+      penRef.current = { x: stroke.points[0].x, y: stroke.points[0].y, down: false, engaged: false };
       drawDot(stroke, stroke.points[0]);
     }
     function onPointerMove(event) {
@@ -1878,18 +1964,81 @@ function useFreehandCanvas(options = {}) {
       setStrokeCount(strokesRef.current.length);
       optionsRef.current.onStrokeEnd?.(stroke);
     }
+    function clampPen(pen) {
+      pen.x = Math.min(Math.max(pen.x, 0), Math.max(0, el.clientWidth - 1));
+      pen.y = Math.min(Math.max(pen.y, 0), Math.max(0, el.clientHeight - 1));
+    }
+    function startKeyboardStroke(pen) {
+      const { brushSize: size, color: ink } = optionsRef.current;
+      const stroke = {
+        size,
+        color: ink,
+        dynamic: false,
+        points: [{ x: pen.x, y: pen.y, pressure: 0.5 }]
+      };
+      activeStrokeRef.current = stroke;
+      pen.down = true;
+      drawDot(stroke, stroke.points[0]);
+    }
+    function commitKeyboardStroke(pen) {
+      const stroke = activeStrokeRef.current;
+      if (!stroke) return;
+      activeStrokeRef.current = null;
+      pen.down = false;
+      strokesRef.current = [...strokesRef.current, stroke];
+      setStrokeCount(strokesRef.current.length);
+      optionsRef.current.onStrokeEnd?.(stroke);
+      redraw();
+    }
+    function onKeyDown(event) {
+      const pen = penRef.current;
+      if (!pen) return;
+      const fast = event.shiftKey ? KEYBOARD_FAST_FACTOR : 1;
+      const step = optionsRef.current.keyboardStep * fast;
+      if (event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "ArrowUp" || event.key === "ArrowDown") {
+        event.preventDefault();
+        pen.engaged = true;
+        pen.x += event.key === "ArrowLeft" ? -step : event.key === "ArrowRight" ? step : 0;
+        pen.y += event.key === "ArrowUp" ? -step : event.key === "ArrowDown" ? step : 0;
+        clampPen(pen);
+        const stroke = activeStrokeRef.current;
+        if (pen.down && stroke) {
+          const point = { x: pen.x, y: pen.y, pressure: 0.5 };
+          const previous = stroke.points[stroke.points.length - 1];
+          stroke.points.push(point);
+          drawSegment(stroke, previous, point);
+        } else {
+          redraw();
+        }
+        return;
+      }
+      if (event.key === " " || event.key === "Enter") {
+        event.preventDefault();
+        pen.engaged = true;
+        if (pen.down) commitKeyboardStroke(pen);
+        else startKeyboardStroke(pen);
+        return;
+      }
+      if (event.key === "Escape" && pen.down) {
+        activeStrokeRef.current = null;
+        pen.down = false;
+        redraw();
+      }
+    }
     el.addEventListener("pointerdown", onPointerDown);
     el.addEventListener("pointermove", onPointerMove);
     el.addEventListener("pointerup", commit);
     el.addEventListener("pointercancel", commit);
+    if (keyboard) el.addEventListener("keydown", onKeyDown);
     return () => {
       observer.disconnect();
       el.removeEventListener("pointerdown", onPointerDown);
       el.removeEventListener("pointermove", onPointerMove);
       el.removeEventListener("pointerup", commit);
       el.removeEventListener("pointercancel", commit);
+      el.removeEventListener("keydown", onKeyDown);
     };
-  }, [redraw, syncDimensions]);
+  }, [redraw, syncDimensions, keyboard]);
   const undo = (0, import_react4.useCallback)(() => {
     if (strokesRef.current.length === 0) return;
     strokesRef.current = strokesRef.current.slice(0, -1);

package/dist/index.mjs

@@ -3,11 +3,11 @@ import {
   useFreehandCanvas,
   useReportExport,
   useScreenshotStudio
-} from "./chunk-YKXOSUMF.mjs";
+} from "./chunk-7YLVULSN.mjs";
 import {
   ReportService,
   ScreenshotStudioService
-} from "./chunk-DNKRSL6D.mjs";
+} from "./chunk-P6RJ75US.mjs";
 import {
   CanvasRenderer,
   DeviceConfigService,

package/dist/presentation/index.d.mts

@@ -106,40 +106,14 @@ interface UseReportExportReturn {
  */
 declare function useReportExport(): UseReportExportReturn;
 
-/**
- * useFreehandCanvas Hook
- * React hook for pointer-based freehand drawing on a canvas
- */
-
-/**
- * Return value of the useFreehandCanvas hook
- */
 interface UseFreehandCanvasReturn {
-    /** Ref to attach to the <canvas> element that captures drawing. */
     canvasRef: React.RefObject<HTMLCanvasElement | null>;
-    /** Remove the most recent stroke. */
     undo: () => void;
-    /** Remove all strokes. */
     clear: () => void;
-    /** Number of committed strokes. */
     strokeCount: number;
-    /** True when no strokes are committed. */
     isEmpty: boolean;
-    /** Snapshot of committed strokes (safe to serialize). */
     getStrokes: () => FreehandStroke[];
 }
-/**
- * useFreehandCanvas hook
- *
- * Attaches pointer-event drawing to a canvas element. The canvas is sized to
- * its CSS box at device-pixel resolution (and re-rendered on resize), strokes
- * are replayed from captured points so undo/clear are lossless, and stylus
- * pressure modulates line width when the pointer reports it.
- *
- * The canvas gets `touch-action: none` applied so drawing works on touch
- * screens without scrolling the page. Consumers typically layer the canvas
- * over their own guide content (e.g. a faint glyph to trace).
- */
 declare function useFreehandCanvas(options?: UseFreehandCanvasOptions): UseFreehandCanvasReturn;
 
 export { type UseCanvasExportOptions, type UseCanvasExportReturn, type UseFreehandCanvasReturn, type UseReportExportReturn, type UseScreenshotStudioOptions, type UseScreenshotStudioReturn, useCanvasExport, useFreehandCanvas, useReportExport, useScreenshotStudio };

package/dist/presentation/index.d.ts

@@ -106,40 +106,14 @@ interface UseReportExportReturn {
  */
 declare function useReportExport(): UseReportExportReturn;
 
-/**
- * useFreehandCanvas Hook
- * React hook for pointer-based freehand drawing on a canvas
- */
-
-/**
- * Return value of the useFreehandCanvas hook
- */
 interface UseFreehandCanvasReturn {
-    /** Ref to attach to the <canvas> element that captures drawing. */
     canvasRef: React.RefObject<HTMLCanvasElement | null>;
-    /** Remove the most recent stroke. */
     undo: () => void;
-    /** Remove all strokes. */
     clear: () => void;
-    /** Number of committed strokes. */
     strokeCount: number;
-    /** True when no strokes are committed. */
     isEmpty: boolean;
-    /** Snapshot of committed strokes (safe to serialize). */
     getStrokes: () => FreehandStroke[];
 }
-/**
- * useFreehandCanvas hook
- *
- * Attaches pointer-event drawing to a canvas element. The canvas is sized to
- * its CSS box at device-pixel resolution (and re-rendered on resize), strokes
- * are replayed from captured points so undo/clear are lossless, and stylus
- * pressure modulates line width when the pointer reports it.
- *
- * The canvas gets `touch-action: none` applied so drawing works on touch
- * screens without scrolling the page. Consumers typically layer the canvas
- * over their own guide content (e.g. a faint glyph to trace).
- */
 declare function useFreehandCanvas(options?: UseFreehandCanvasOptions): UseFreehandCanvasReturn;
 
 export { type UseCanvasExportOptions, type UseCanvasExportReturn, type UseFreehandCanvasReturn, type UseReportExportReturn, type UseScreenshotStudioOptions, type UseScreenshotStudioReturn, useCanvasExport, useFreehandCanvas, useReportExport, useScreenshotStudio };

package/dist/presentation/index.js

@@ -1482,7 +1482,76 @@ function useCanvasExport(options = {}) {
 // src/presentation/hooks/useReportExport.ts
 var import_react3 = require("react");
 
+// src/infrastructure/services/minimalXlsx.ts
+var XML_HEADER = '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';
+function escapeXml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&apos;");
+}
+function safeSheetName(name, index) {
+  const cleaned = name.replace(/[:\\/?*[\]]/g, " ").slice(0, 31).trim();
+  return cleaned.length > 0 ? cleaned : `Sheet${index + 1}`;
+}
+function columnName(index) {
+  let name = "";
+  let n = index;
+  while (n >= 0) {
+    name = String.fromCharCode(65 + n % 26) + name;
+    n = Math.floor(n / 26) - 1;
+  }
+  return name;
+}
+function cellXml(value, row, column) {
+  const ref = `${columnName(column)}${row}`;
+  if (typeof value === "number" && Number.isFinite(value)) {
+    return `<c r="${ref}"><v>${value}</v></c>`;
+  }
+  const text = value === null || value === void 0 ? "" : typeof value === "boolean" ? value ? "TRUE" : "FALSE" : String(value);
+  return `<c r="${ref}" t="inlineStr"><is><t xml:space="preserve">${escapeXml(text)}</t></is></c>`;
+}
+function sheetXml(rows) {
+  const body = rows.map((row, rowIndex) => {
+    const cells = row.map((value, columnIndex) => cellXml(value, rowIndex + 1, columnIndex)).join("");
+    return `<row r="${rowIndex + 1}">${cells}</row>`;
+  }).join("");
+  return `${XML_HEADER}<worksheet xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main"><sheetData>${body}</sheetData></worksheet>`;
+}
+async function writeXlsxBlob(sheets, JSZip) {
+  const zip = new JSZip();
+  const safeNames = sheets.map((sheet, index) => safeSheetName(sheet.name, index));
+  zip.file(
+    "[Content_Types].xml",
+    `${XML_HEADER}<Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types"><Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/><Default Extension="xml" ContentType="application/xml"/><Override PartName="/xl/workbook.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet.main+xml"/>` + safeNames.map(
+      (_, index) => `<Override PartName="/xl/worksheets/sheet${index + 1}.xml" ContentType="application/vnd.openxmlformats-officedocument.spreadsheetml.worksheet+xml"/>`
+    ).join("") + "</Types>"
+  );
+  zip.file(
+    "_rels/.rels",
+    `${XML_HEADER}<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"><Relationship Id="rId1" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/officeDocument" Target="xl/workbook.xml"/></Relationships>`
+  );
+  zip.file(
+    "xl/workbook.xml",
+    `${XML_HEADER}<workbook xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main" xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships"><sheets>` + safeNames.map((name, index) => `<sheet name="${escapeXml(name)}" sheetId="${index + 1}" r:id="rId${index + 1}"/>`).join("") + "</sheets></workbook>"
+  );
+  zip.file(
+    "xl/_rels/workbook.xml.rels",
+    `${XML_HEADER}<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships">` + safeNames.map(
+      (_, index) => `<Relationship Id="rId${index + 1}" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/worksheet" Target="worksheets/sheet${index + 1}.xml"/>`
+    ).join("") + "</Relationships>"
+  );
+  sheets.forEach((sheet, index) => {
+    zip.file(`xl/worksheets/sheet${index + 1}.xml`, sheetXml(sheet.rows));
+  });
+  return zip.generateAsync({ type: "blob" });
+}
+
 // src/application/services/ReportService.ts
+function recordsToSheet(name, records) {
+  const headers = [...new Set(records.flatMap((record) => Object.keys(record)))];
+  return {
+    name,
+    rows: [headers, ...records.map((record) => headers.map((header) => record[header]))]
+  };
+}
 var ReportService = class _ReportService {
   static getInstance() {
     if (!_ReportService.instance) {
@@ -1528,31 +1597,19 @@ var ReportService = class _ReportService {
    * Export data to Excel
    */
   async exportToExcel(data, options = {}) {
-    const XLSX = await import("xlsx");
-    const wb = XLSX.utils.book_new();
+    const JSZip = (await import("jszip")).default;
     const apps = data.items.filter((i) => i.type === "app").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
     const campaigns = data.items.filter((i) => i.type === "campaign").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
     const posts = data.items.filter((i) => i.type === "post").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
+    const sheets = [];
     if (apps.length > 0) {
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(apps),
-        options.sheetName || "Apps"
-      );
+      sheets.push(recordsToSheet(options.sheetName || "Apps", apps));
     }
     if (campaigns.length > 0) {
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(campaigns),
-        "Campaigns"
-      );
+      sheets.push(recordsToSheet("Campaigns", campaigns));
     }
     if (posts.length > 0) {
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(posts),
-        "Posts"
-      );
+      sheets.push(recordsToSheet("Posts", posts));
     }
     if (options.includeSummary !== false) {
       const summary = [
@@ -1570,13 +1627,18 @@ var ReportService = class _ReportService {
           Value: (/* @__PURE__ */ new Date()).toLocaleDateString()
         }
       ];
-      XLSX.utils.book_append_sheet(
-        wb,
-        XLSX.utils.json_to_sheet(summary),
-        "Summary"
-      );
+      sheets.push(recordsToSheet("Summary", summary));
+    }
+    if (sheets.length === 0) {
+      sheets.push({ name: options.sheetName || "Sheet1", rows: [] });
     }
-    XLSX.writeFile(wb, options.filename || "report.xlsx");
+    const blob = await writeXlsxBlob(sheets, JSZip);
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    link.href = url;
+    link.download = options.filename || "report.xlsx";
+    link.click();
+    URL.revokeObjectURL(url);
   }
   /**
    * Export data to CSV
@@ -1738,19 +1800,28 @@ function useReportExport() {
 var import_react4 = require("react");
 var DEFAULT_BRUSH_SIZE = 3;
 var DEFAULT_COLOR = "#1a1a1a";
+var DEFAULT_KEYBOARD_STEP = 4;
+var KEYBOARD_FAST_FACTOR = 4;
 function widthFor(stroke, point) {
   if (!stroke.dynamic) return stroke.size;
   return stroke.size * (0.5 + Math.min(1, Math.max(0, point.pressure)));
 }
 function useFreehandCanvas(options = {}) {
-  const { brushSize = DEFAULT_BRUSH_SIZE, color = DEFAULT_COLOR, pressureEnabled = true } = options;
-  const optionsRef = (0, import_react4.useRef)({ brushSize, color, pressureEnabled, onStrokeEnd: options.onStrokeEnd });
-  optionsRef.current = { brushSize, color, pressureEnabled, onStrokeEnd: options.onStrokeEnd };
+  const {
+    brushSize = DEFAULT_BRUSH_SIZE,
+    color = DEFAULT_COLOR,
+    pressureEnabled = true,
+    keyboard = false,
+    keyboardStep = DEFAULT_KEYBOARD_STEP
+  } = options;
+  const optionsRef = (0, import_react4.useRef)({ brushSize, color, pressureEnabled, keyboardStep, onStrokeEnd: options.onStrokeEnd });
+  optionsRef.current = { brushSize, color, pressureEnabled, keyboardStep, onStrokeEnd: options.onStrokeEnd };
   const canvasRef = (0, import_react4.useRef)(null);
   const strokesRef = (0, import_react4.useRef)([]);
   const activeStrokeRef = (0, import_react4.useRef)(null);
   const activePointerIdRef = (0, import_react4.useRef)(null);
   const dprRef = (0, import_react4.useRef)(1);
+  const penRef = (0, import_react4.useRef)(null);
   const [strokeCount, setStrokeCount] = (0, import_react4.useState)(0);
   const redraw = (0, import_react4.useCallback)(() => {
     const canvas = canvasRef.current;
@@ -1783,6 +1854,18 @@ function useFreehandCanvas(options = {}) {
         ctx.stroke();
       }
     }
+    const pen = penRef.current;
+    if (pen?.engaged && !pen.down) {
+      const reach = 5;
+      ctx.strokeStyle = "rgba(35, 37, 43, 0.55)";
+      ctx.lineWidth = 1;
+      ctx.beginPath();
+      ctx.moveTo(pen.x - reach, pen.y);
+      ctx.lineTo(pen.x + reach, pen.y);
+      ctx.moveTo(pen.x, pen.y - reach);
+      ctx.lineTo(pen.x, pen.y + reach);
+      ctx.stroke();
+    }
   }, []);
   const syncDimensions = (0, import_react4.useCallback)(() => {
     const canvas = canvasRef.current;
@@ -1801,6 +1884,8 @@ function useFreehandCanvas(options = {}) {
     if (!canvas) return;
     const el = canvas;
     el.style.touchAction = "none";
+    if (keyboard && !el.hasAttribute("tabindex")) el.tabIndex = 0;
+    if (!penRef.current) penRef.current = { x: el.clientWidth / 2, y: el.clientHeight / 2, down: false, engaged: false };
     syncDimensions();
     redraw();
     const observer = new ResizeObserver(() => {
@@ -1849,6 +1934,7 @@ function useFreehandCanvas(options = {}) {
         points: [pointFrom(event)]
       };
       activeStrokeRef.current = stroke;
+      penRef.current = { x: stroke.points[0].x, y: stroke.points[0].y, down: false, engaged: false };
       drawDot(stroke, stroke.points[0]);
     }
     function onPointerMove(event) {
@@ -1872,18 +1958,81 @@ function useFreehandCanvas(options = {}) {
       setStrokeCount(strokesRef.current.length);
       optionsRef.current.onStrokeEnd?.(stroke);
     }
+    function clampPen(pen) {
+      pen.x = Math.min(Math.max(pen.x, 0), Math.max(0, el.clientWidth - 1));
+      pen.y = Math.min(Math.max(pen.y, 0), Math.max(0, el.clientHeight - 1));
+    }
+    function startKeyboardStroke(pen) {
+      const { brushSize: size, color: ink } = optionsRef.current;
+      const stroke = {
+        size,
+        color: ink,
+        dynamic: false,
+        points: [{ x: pen.x, y: pen.y, pressure: 0.5 }]
+      };
+      activeStrokeRef.current = stroke;
+      pen.down = true;
+      drawDot(stroke, stroke.points[0]);
+    }
+    function commitKeyboardStroke(pen) {
+      const stroke = activeStrokeRef.current;
+      if (!stroke) return;
+      activeStrokeRef.current = null;
+      pen.down = false;
+      strokesRef.current = [...strokesRef.current, stroke];
+      setStrokeCount(strokesRef.current.length);
+      optionsRef.current.onStrokeEnd?.(stroke);
+      redraw();
+    }
+    function onKeyDown(event) {
+      const pen = penRef.current;
+      if (!pen) return;
+      const fast = event.shiftKey ? KEYBOARD_FAST_FACTOR : 1;
+      const step = optionsRef.current.keyboardStep * fast;
+      if (event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "ArrowUp" || event.key === "ArrowDown") {
+        event.preventDefault();
+        pen.engaged = true;
+        pen.x += event.key === "ArrowLeft" ? -step : event.key === "ArrowRight" ? step : 0;
+        pen.y += event.key === "ArrowUp" ? -step : event.key === "ArrowDown" ? step : 0;
+        clampPen(pen);
+        const stroke = activeStrokeRef.current;
+        if (pen.down && stroke) {
+          const point = { x: pen.x, y: pen.y, pressure: 0.5 };
+          const previous = stroke.points[stroke.points.length - 1];
+          stroke.points.push(point);
+          drawSegment(stroke, previous, point);
+        } else {
+          redraw();
+        }
+        return;
+      }
+      if (event.key === " " || event.key === "Enter") {
+        event.preventDefault();
+        pen.engaged = true;
+        if (pen.down) commitKeyboardStroke(pen);
+        else startKeyboardStroke(pen);
+        return;
+      }
+      if (event.key === "Escape" && pen.down) {
+        activeStrokeRef.current = null;
+        pen.down = false;
+        redraw();
+      }
+    }
     el.addEventListener("pointerdown", onPointerDown);
     el.addEventListener("pointermove", onPointerMove);
     el.addEventListener("pointerup", commit);
     el.addEventListener("pointercancel", commit);
+    if (keyboard) el.addEventListener("keydown", onKeyDown);
     return () => {
       observer.disconnect();
       el.removeEventListener("pointerdown", onPointerDown);
       el.removeEventListener("pointermove", onPointerMove);
       el.removeEventListener("pointerup", commit);
       el.removeEventListener("pointercancel", commit);
+      el.removeEventListener("keydown", onKeyDown);
     };
-  }, [redraw, syncDimensions]);
+  }, [redraw, syncDimensions, keyboard]);
   const undo = (0, import_react4.useCallback)(() => {
     if (strokesRef.current.length === 0) return;
     strokesRef.current = strokesRef.current.slice(0, -1);