@iyulab/flex-table 0.13.0 → 0.14.0

package/dist/export/export.d.ts

@@ -1,12 +1,13 @@
 import type { ColumnDefinition, DataRow } from '../models/types.js';
-export type ExportFormat = 'csv' | 'tsv' | 'json';
+export type ExportFormat = 'csv' | 'tsv' | 'json' | 'xlsx';
 /**
  * Export data to the specified format.
+ * Returns string for text formats (csv/tsv/json) or Uint8Array for xlsx.
  */
-export declare function exportData(data: DataRow[], columns: ColumnDefinition[], format: ExportFormat): string;
+export declare function exportData(data: DataRow[], columns: ColumnDefinition[], format: ExportFormat): string | Uint8Array;
 /**
  * Trigger a file download in the browser.
  */
-export declare function downloadFile(content: string, filename: string, mimeType: string): void;
+export declare function downloadFile(content: string | Uint8Array, filename: string, mimeType: string): void;
 export declare function getExportMimeType(format: ExportFormat): string;
 export declare function getExportExtension(format: ExportFormat): string;

package/dist/export/xlsx-writer.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Minimal XLSX writer — no external dependencies.
+ * Generates OOXML (.xlsx) files using ZIP STORE method (no compression).
+ * Supports string, number, boolean, and date cell types.
+ */
+import type { ColumnDefinition, DataRow } from '../models/types.js';
+/**
+ * Build an XLSX file as a Uint8Array.
+ */
+export declare function buildXlsx(data: DataRow[], columns: ColumnDefinition[]): Uint8Array;

package/dist/{flex-table-zJST_6sy.js → flex-table-fp3j2egA.js}

@@ -519,6 +519,42 @@ var s = t`
     color: white;
   }
 
+  /* Body context menu */
+  .ft-body-context-menu {
+    background: var(--ft-editor-bg, #fff);
+    border: 1px solid var(--ft-border-color);
+    box-shadow: 0 2px 8px rgba(0,0,0,0.16);
+    min-width: 180px;
+    border-radius: 4px;
+    overflow: hidden;
+    padding: 4px 0;
+  }
+
+  .ft-context-menu-item {
+    padding: 6px 14px;
+    cursor: pointer;
+    font-size: var(--ft-font-size, 14px);
+    color: var(--ft-text-color);
+    white-space: nowrap;
+    user-select: none;
+  }
+
+  .ft-context-menu-item:hover {
+    background: var(--ft-selection-bg);
+    color: var(--ft-active-color);
+  }
+
+  .ft-context-menu-item.ft-context-menu-danger:hover {
+    background: #fdd;
+    color: #c0392b;
+  }
+
+  .ft-context-menu-separator {
+    height: 1px;
+    background: var(--ft-border-color);
+    margin: 4px 0;
+  }
+
   /* Find / Replace panel */
   .ft-find-panel {
     position: sticky;
@@ -866,13 +902,13 @@ function S(e, t, n) {
 			if (c && l) continue;
 			if (c) return 1;
 			if (l) return -1;
-			let u = C(t, s, i.get(a) ?? "text");
+			let u = ee(t, s, i.get(a) ?? "text");
 			if (u !== 0) return o === "asc" ? u : -u;
 		}
 		return n - r;
 	}), r;
 }
-function C(e, t, n) {
+function ee(e, t, n) {
 	switch (n) {
 		case "number": {
 			let n = Number(e), r = Number(t);
@@ -887,7 +923,7 @@ function C(e, t, n) {
 		default: return String(e).localeCompare(String(t));
 	}
 }
-function w(e, t, n) {
+function C(e, t, n) {
 	let r = e.find((e) => e.key === t);
 	return n ? r ? r.direction === "asc" ? e.map((e) => e.key === t ? {
 		...e,
@@ -905,7 +941,7 @@ function w(e, t, n) {
 }
 //#endregion
 //#region src/core/filtering.ts
-function T(e, t, n) {
+function w(e, t, n) {
 	if (t.length === 0) return Array.from({ length: e.length }, (e, t) => t);
 	let r = [];
 	for (let i = 0; i < e.length; i++) {
@@ -924,9 +960,9 @@ function T(e, t, n) {
 }
 //#endregion
 //#region src/core/undo.ts
-var E = 100, D = class {
+var T = 100, E = class {
 	constructor() {
-		this._undoStack = [], this._redoStack = [], this._maxSize = E;
+		this._undoStack = [], this._redoStack = [], this._maxSize = T;
 	}
 	get maxSize() {
 		return this._maxSize;
@@ -963,7 +999,7 @@ var E = 100, D = class {
 };
 //#endregion
 //#region src/clipboard/clipboard.ts
-function O(e, t, n) {
+function te(e, t, n) {
 	let r = [];
 	for (let i = n.startRow; i <= n.endRow; i++) {
 		let a = e[i], o = [];
@@ -975,7 +1011,7 @@ function O(e, t, n) {
 	}
 	return r.join("\n");
 }
-function k(e) {
+function ne(e) {
 	let t = e.replace(/\r\n/g, "\n").replace(/\r/g, "\n"), n = [], r = [], i = 0, a = t.length;
 	for (; i <= a;) {
 		if (i === a) {
@@ -1004,7 +1040,7 @@ function k(e) {
 	}
 	return n;
 }
-function A(e, t) {
+function D(e, t) {
 	if (e === "") return null;
 	switch (t.type) {
 		case "number": {
@@ -1016,24 +1052,122 @@ function A(e, t) {
 	}
 }
 //#endregion
+//#region src/export/xlsx-writer.ts
+var re = (() => {
+	let e = new Uint32Array(256);
+	for (let t = 0; t < 256; t++) {
+		let n = t;
+		for (let e = 0; e < 8; e++) n = n & 1 ? 3988292384 ^ n >>> 1 : n >>> 1;
+		e[t] = n;
+	}
+	return e;
+})();
+function O(e) {
+	let t = 4294967295;
+	for (let n = 0; n < e.length; n++) t = re[(t ^ e[n]) & 255] ^ t >>> 8;
+	return (t ^ 4294967295) >>> 0;
+}
+var k = new TextEncoder();
+function A(e) {
+	let t = [], n = [], r = 0;
+	for (let i of e) {
+		let e = k.encode(i.name), a = O(i.data), o = i.data.length, s = new ArrayBuffer(30 + e.length), c = new DataView(s);
+		c.setUint32(0, 67324752, !0), c.setUint16(4, 20, !0), c.setUint16(6, 0, !0), c.setUint16(8, 0, !0), c.setUint16(10, 0, !0), c.setUint16(12, 33, !0), c.setUint32(14, a, !0), c.setUint32(18, o, !0), c.setUint32(22, o, !0), c.setUint16(26, e.length, !0), c.setUint16(28, 0, !0), new Uint8Array(s, 30).set(e), t.push(new Uint8Array(s)), t.push(i.data);
+		let l = new ArrayBuffer(46 + e.length), u = new DataView(l);
+		u.setUint32(0, 33639248, !0), u.setUint16(4, 20, !0), u.setUint16(6, 20, !0), u.setUint16(8, 0, !0), u.setUint16(10, 0, !0), u.setUint16(12, 0, !0), u.setUint16(14, 33, !0), u.setUint32(16, a, !0), u.setUint32(20, o, !0), u.setUint32(24, o, !0), u.setUint16(28, e.length, !0), u.setUint16(30, 0, !0), u.setUint16(32, 0, !0), u.setUint16(34, 0, !0), u.setUint16(36, 0, !0), u.setUint32(38, 0, !0), u.setUint32(42, r, !0), new Uint8Array(l, 46).set(e), n.push(new Uint8Array(l)), r += 30 + e.length + o;
+	}
+	let i = j(n), a = /* @__PURE__ */ new ArrayBuffer(22), o = new DataView(a);
+	return o.setUint32(0, 101010256, !0), o.setUint16(4, 0, !0), o.setUint16(6, 0, !0), o.setUint16(8, e.length, !0), o.setUint16(10, e.length, !0), o.setUint32(12, i.length, !0), o.setUint32(16, r, !0), o.setUint16(20, 0, !0), j([
+		...t,
+		i,
+		new Uint8Array(a)
+	]);
+}
+function j(e) {
+	let t = e.reduce((e, t) => e + t.length, 0), n = new Uint8Array(t), r = 0;
+	for (let t of e) n.set(t, r), r += t.length;
+	return n;
+}
+function M(e) {
+	return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function N(e) {
+	let t = "";
+	for (e++; e > 0;) t = String.fromCharCode(64 + (e % 26 || 26)) + t, e = Math.floor((e - 1) / 26);
+	return t;
+}
+function P(e, t) {
+	return N(t) + (e + 1);
+}
+function F(e) {
+	let t = Date.UTC(1899, 11, 30);
+	return (e.getTime() - t) / 864e5;
+}
+var I = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>\n<Types xmlns=\"http://schemas.openxmlformats.org/package/2006/content-types\">\n  <Default Extension=\"rels\" ContentType=\"application/vnd.openxmlformats-package.relationships+xml\"/>\n  <Default Extension=\"xml\" ContentType=\"application/xml\"/>\n  <Override PartName=\"/xl/workbook.xml\" ContentType=\"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet.main+xml\"/>\n  <Override PartName=\"/xl/worksheets/sheet1.xml\" ContentType=\"application/vnd.openxmlformats-officedocument.spreadsheetml.worksheet+xml\"/>\n  <Override PartName=\"/xl/styles.xml\" ContentType=\"application/vnd.openxmlformats-officedocument.spreadsheetml.styles+xml\"/>\n</Types>", L = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>\n<Relationships xmlns=\"http://schemas.openxmlformats.org/package/2006/relationships\">\n  <Relationship Id=\"rId1\" Type=\"http://schemas.openxmlformats.org/officeDocument/2006/relationships/officeDocument\" Target=\"xl/workbook.xml\"/>\n</Relationships>", R = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>\n<workbook xmlns=\"http://schemas.openxmlformats.org/spreadsheetml/2006/main\" xmlns:r=\"http://schemas.openxmlformats.org/officeDocument/2006/relationships\">\n  <sheets><sheet name=\"Sheet1\" sheetId=\"1\" r:id=\"rId1\"/></sheets>\n</workbook>", z = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>\n<Relationships xmlns=\"http://schemas.openxmlformats.org/package/2006/relationships\">\n  <Relationship Id=\"rId1\" Type=\"http://schemas.openxmlformats.org/officeDocument/2006/relationships/worksheet\" Target=\"worksheets/sheet1.xml\"/>\n  <Relationship Id=\"rId2\" Type=\"http://schemas.openxmlformats.org/officeDocument/2006/relationships/styles\" Target=\"styles.xml\"/>\n</Relationships>", B = "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>\n<styleSheet xmlns=\"http://schemas.openxmlformats.org/spreadsheetml/2006/main\">\n  <numFmts count=\"1\"><numFmt numFmtId=\"164\" formatCode=\"yyyy-mm-dd\"/></numFmts>\n  <fonts count=\"2\">\n    <font><sz val=\"11\"/><name val=\"Calibri\"/></font>\n    <font><sz val=\"11\"/><b/><name val=\"Calibri\"/></font>\n  </fonts>\n  <fills count=\"2\">\n    <fill><patternFill patternType=\"none\"/></fill>\n    <fill><patternFill patternType=\"gray125\"/></fill>\n  </fills>\n  <borders count=\"1\"><border><left/><right/><top/><bottom/><diagonal/></border></borders>\n  <cellStyleXfs count=\"1\"><xf numFmtId=\"0\" fontId=\"0\" fillId=\"0\" borderId=\"0\"/></cellStyleXfs>\n  <cellXfs count=\"3\">\n    <xf numFmtId=\"0\" fontId=\"0\" fillId=\"0\" borderId=\"0\" xfId=\"0\"/>\n    <xf numFmtId=\"164\" fontId=\"0\" fillId=\"0\" borderId=\"0\" xfId=\"0\" applyNumberFormat=\"1\"/>\n    <xf numFmtId=\"0\" fontId=\"1\" fillId=\"0\" borderId=\"0\" xfId=\"0\" applyFont=\"1\"/>\n  </cellXfs>\n</styleSheet>";
+function V(e, t) {
+	let n = [], r = t.map((e, t) => `<c r="${P(0, t)}" t="str" s="2"><v>${M(e.header)}</v></c>`);
+	return n.push(`<row r="1">${r.join("")}</row>`), e.forEach((e, r) => {
+		let i = t.map((t, n) => {
+			let i = P(r + 1, n), a = e[t.key];
+			if (a == null) return `<c r="${i}" t="str"><v></v></c>`;
+			let o = t.type ?? "text";
+			return o === "number" && typeof a == "number" ? `<c r="${i}"><v>${a}</v></c>` : (o === "date" || o === "datetime") && a instanceof Date ? `<c r="${i}" s="1"><v>${F(a).toFixed(6)}</v></c>` : o === "boolean" ? `<c r="${i}" t="b"><v>${+!!a}</v></c>` : `<c r="${i}" t="str"><v>${M(String(a))}</v></c>`;
+		});
+		n.push(`<row r="${r + 2}">${i.join("")}</row>`);
+	}), `<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<worksheet xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main">
+  <sheetData>${n.join("")}</sheetData>
+</worksheet>`;
+}
+function H(e, t) {
+	let n = V(e, t);
+	return A([
+		{
+			name: "[Content_Types].xml",
+			data: k.encode(I)
+		},
+		{
+			name: "_rels/.rels",
+			data: k.encode(L)
+		},
+		{
+			name: "xl/workbook.xml",
+			data: k.encode(R)
+		},
+		{
+			name: "xl/_rels/workbook.xml.rels",
+			data: k.encode(z)
+		},
+		{
+			name: "xl/worksheets/sheet1.xml",
+			data: k.encode(n)
+		},
+		{
+			name: "xl/styles.xml",
+			data: k.encode(B)
+		}
+	]);
+}
+//#endregion
 //#region src/export/export.ts
-function j(e, t, n) {
+function U(e, t, n) {
 	switch (n) {
-		case "csv": return N(e, t, ",");
-		case "tsv": return N(e, t, "	");
-		case "json": return F(e, t);
+		case "csv": return G(e, t, ",");
+		case "tsv": return G(e, t, "	");
+		case "json": return q(e, t);
+		case "xlsx": return H(e, t);
 	}
 }
-function M(e, t) {
+function W(e, t) {
 	return e == null ? "" : (t.type === "date" || t.type === "datetime") && e instanceof Date ? e.toISOString() : String(e);
 }
-function N(e, t, n) {
-	return [t.map((e) => P(e.header, n)).join(n), ...e.map((e) => t.map((t) => P(M(e[t.key], t), n)).join(n))].join("\n");
+function G(e, t, n) {
+	return [t.map((e) => K(e.header, n)).join(n), ...e.map((e) => t.map((t) => K(W(e[t.key], t), n)).join(n))].join("\n");
 }
-function P(e, t) {
+function K(e, t) {
 	return e.includes(t) || e.includes("\"") || e.includes("\n") || e.includes("\r") ? "\"" + e.replace(/"/g, "\"\"") + "\"" : e;
 }
-function F(e, t) {
+function q(e, t) {
 	let n = e.map((e) => {
 		let n = {};
 		for (let r of t) {
@@ -1044,28 +1178,30 @@ function F(e, t) {
 	});
 	return JSON.stringify(n, null, 2);
 }
-function I(e, t, n) {
+function J(e, t, n) {
 	let r = new Blob([e], { type: n }), i = URL.createObjectURL(r), a = document.createElement("a");
 	a.href = i, a.download = t, a.style.display = "none", document.body.appendChild(a), a.click(), document.body.removeChild(a), setTimeout(() => URL.revokeObjectURL(i), 100);
 }
-var L = {
+var ie = {
 	csv: "text/csv;charset=utf-8",
 	tsv: "text/tab-separated-values;charset=utf-8",
-	json: "application/json;charset=utf-8"
-}, R = {
+	json: "application/json;charset=utf-8",
+	xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+}, ae = {
 	csv: ".csv",
 	tsv: ".tsv",
-	json: ".json"
+	json: ".json",
+	xlsx: ".xlsx"
 };
-function z(e) {
-	return L[e];
+function oe(e) {
+	return ie[e];
 }
-function B(e) {
-	return R[e];
+function se(e) {
+	return ae[e];
 }
 //#endregion
 //#region \0@oxc-project+runtime@0.130.0/helpers/decorate.js
-function V(e, t, n, r) {
+function Y(e, t, n, r) {
 	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
 	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
 	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
@@ -1073,9 +1209,9 @@ function V(e, t, n, r) {
 }
 //#endregion
 //#region src/flex-table.ts
-var H = 120, U = 40, W = 32, G = 5, K = class extends e {
+var X = 120, Z = 40, ce = 32, Q = 5, $ = class extends e {
 	constructor(...e) {
-		super(...e), this.columns = [], this.data = [], this.rowHeight = W, this.showRowNumbers = !1, this.theme = void 0, this.maxRows = 0, this.editable = !0, this.showFilters = !1, this.selectable = !1, this.dataMode = "client", this.footerData = null, this._scrollTop = 0, this._scrollLeft = 0, this._viewportHeight = 0, this._viewportWidth = 0, this._colLeftOffsets = [], this._totalRowWidth = 0, this._activeCell = null, this._editingCell = null, this._sortCriteria = [], this._selection = new y(), this._editing = new b(), this._rowSelection = new x(), this._undo = new D(), this._filters = [], this._filteredIndices = [], this._sortedIndices = [], this._openFilterKey = null, this._rowSelectionVersion = 0, this._autocompleteState = null, this._headerMenu = null, this._viewDirty = !0, this._isDragging = !1, this._wasDrag = !1, this._resizing = null, this._resizeCleanup = null, this._colDrag = null, this._colDragIndicatorLeft = null, this._fillDrag = null, this._rowDrag = null, this._rowDragIndicatorY = null, this._findState = null, this._columnWidths = /* @__PURE__ */ new Map(), this._hostResizeObserver = null, this._invalidCells = /* @__PURE__ */ new Map(), this._textFilterState = /* @__PURE__ */ new Map(), this._numberFilterState = /* @__PURE__ */ new Map(), this._dateFilterState = /* @__PURE__ */ new Map();
+		super(...e), this.columns = [], this.data = [], this.rowHeight = ce, this.showRowNumbers = !1, this.theme = void 0, this.maxRows = 0, this.editable = !0, this.showFilters = !1, this.showContextMenu = !1, this.selectable = !1, this.dataMode = "client", this.footerData = null, this._scrollTop = 0, this._scrollLeft = 0, this._viewportHeight = 0, this._viewportWidth = 0, this._colLeftOffsets = [], this._totalRowWidth = 0, this._activeCell = null, this._editingCell = null, this._sortCriteria = [], this._selection = new y(), this._editing = new b(), this._rowSelection = new x(), this._undo = new E(), this._filters = [], this._filteredIndices = [], this._sortedIndices = [], this._openFilterKey = null, this._rowSelectionVersion = 0, this._autocompleteState = null, this._headerMenu = null, this._bodyContextMenu = null, this._viewDirty = !0, this._isDragging = !1, this._wasDrag = !1, this._resizing = null, this._resizeCleanup = null, this._colDrag = null, this._colDragIndicatorLeft = null, this._fillDrag = null, this._rowDrag = null, this._rowDragIndicatorY = null, this._findState = null, this._columnWidths = /* @__PURE__ */ new Map(), this._hostResizeObserver = null, this._invalidCells = /* @__PURE__ */ new Map(), this._textFilterState = /* @__PURE__ */ new Map(), this._numberFilterState = /* @__PURE__ */ new Map(), this._dateFilterState = /* @__PURE__ */ new Map();
 	}
 	static {
 		this.styles = s;
@@ -1384,12 +1520,12 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 			if (!t) return "";
 			let n = this.visibleColumns.slice(t.startCol, t.endCol + 1), r = [];
 			for (let e = t.startRow; e <= t.endRow; e++) r.push(this.data[this._toDataIndex(e)]);
-			return j(r, n, e);
+			return U(r, n, e);
 		}
-		return j(this._sortedIndices.map((e) => this.data[e]), this.visibleColumns, e);
+		return U(this._sortedIndices.map((e) => this.data[e]), this.visibleColumns, e);
 	}
 	exportToFile(e, t) {
-		I(this.exportToString(e), t ?? `export${B(e)}`, z(e));
+		J(this.exportToString(e), t ?? `export${se(e)}`, oe(e));
 	}
 	_getSelectedDataRows() {
 		let e = this._selection.getEffectiveRange();
@@ -1402,8 +1538,8 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		return this._columnWidths.get(e);
 	}
 	_getColWidth(e) {
-		let t = this._columnWidths.get(e.key) ?? e.width ?? H;
-		return Math.max(t, e.minWidth ?? U);
+		let t = this._columnWidths.get(e.key) ?? e.width ?? X;
+		return Math.max(t, e.minWidth ?? Z);
 	}
 	get headerHeight() {
 		return this.rowHeight + 8;
@@ -1415,10 +1551,10 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		return this._visibleRowCount * this.rowHeight;
 	}
 	get visibleRange() {
-		let e = Math.max(0, this._scrollTop - this.headerHeight), t = Math.max(0, Math.floor(e / this.rowHeight) - G), n = Math.ceil(this._viewportHeight / this.rowHeight);
+		let e = Math.max(0, this._scrollTop - this.headerHeight), t = Math.max(0, Math.floor(e / this.rowHeight) - Q), n = Math.ceil(this._viewportHeight / this.rowHeight);
 		return {
 			start: t,
-			end: Math.min(this._visibleRowCount, Math.floor(e / this.rowHeight) + n + G)
+			end: Math.min(this._visibleRowCount, Math.floor(e / this.rowHeight) + n + Q)
 		};
 	}
 	connectedCallback() {
@@ -1451,13 +1587,13 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 			i = r;
 			break;
 		}
-		i = Math.max(0, i - G);
+		i = Math.max(0, i - Q);
 		let a = e.length;
 		for (let e = i; e < t.length; e++) if (t[e] > r) {
 			a = e;
 			break;
 		}
-		return a = Math.min(e.length, a + G), {
+		return a = Math.min(e.length, a + Q), {
 			start: i,
 			end: a
 		};
@@ -1473,7 +1609,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 			this._filteredIndices = Array.from({ length: this.data.length }, (e, t) => t), this._sortedIndices = this._filteredIndices;
 			return;
 		}
-		if (this._filteredIndices = T(this.data, this._filters, (e, t, n) => {
+		if (this._filteredIndices = w(this.data, this._filters, (e, t, n) => {
 			this.dispatchEvent(new CustomEvent("filter-error", {
 				detail: {
 					error: e,
@@ -1506,17 +1642,19 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		this._scrollTop = this.scrollTop, this._scrollLeft = this.scrollLeft;
 	}
 	_onDocumentClick() {
-		this._openFilterKey &&= null, this._headerMenu &&= null;
+		this._openFilterKey &&= null, this._headerMenu &&= null, this._bodyContextMenu &&= null;
 	}
 	_onContextMenu(e) {
 		let t = e.composedPath().find((e) => e instanceof HTMLElement && e.classList.contains("ft-cell"));
 		if (!t) return;
+		e.preventDefault();
 		let n = t.parentElement;
 		if (!n || !n.classList.contains("ft-row")) return;
 		let r = parseInt(t.dataset.colIndex ?? "-1", 10), i = n.style.top, a = Math.round(parseInt(i, 10) / this.rowHeight);
 		if (r < 0 || a < 0) return;
 		let o = this._toDataIndex(a), s = this.visibleColumns[r];
-		s && this.dispatchEvent(new CustomEvent("context-menu", {
+		if (!s) return;
+		let c = new CustomEvent("context-menu", {
 			detail: {
 				x: e.clientX,
 				y: e.clientY,
@@ -1527,7 +1665,17 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 				rowData: this.data[o]
 			},
 			bubbles: !0,
-			composed: !0
+			composed: !0,
+			cancelable: !0
+		});
+		this.dispatchEvent(c), this.showContextMenu && !c.defaultPrevented && (this._bodyContextMenu = {
+			rowIndex: a,
+			colIndex: r,
+			dataIndex: o,
+			x: e.clientX,
+			y: e.clientY
+		}, requestAnimationFrame(() => {
+			document.addEventListener("click", this._onDocumentClick, { once: !0 });
 		}));
 	}
 	_onCellClickEvent(e, t, n) {
@@ -1600,7 +1748,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		}
 		let t = this.shadowRoot?.querySelector(".ft-editor");
 		if (t) {
-			let n = A(t.value, e);
+			let n = D(t.value, e);
 			this._applyEdit(n);
 		} else this._cancelEdit();
 	}
@@ -1793,7 +1941,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		e.preventDefault();
 		let n = t[this._activeCell.col];
 		if (!n) return !0;
-		let r = this._columnWidths.get(n.key) ?? n.width ?? H, i = e.key === "ArrowRight" ? 20 : -20, a = n.minWidth ?? U, o = Math.max(a, r + i);
+		let r = this._columnWidths.get(n.key) ?? n.width ?? X, i = e.key === "ArrowRight" ? 20 : -20, a = n.minWidth ?? Z, o = Math.max(a, r + i);
 		return this._columnWidths.set(n.key, o), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-resize", {
 			detail: {
 				key: n.key,
@@ -1822,7 +1970,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 	async _handleCopy(e) {
 		let t = this._selection.getEffectiveRange();
 		if (!t) return;
-		let n = this.visibleColumns, r = O(this._sortedIndices.map((e) => this.data[e]), n, t);
+		let n = this.visibleColumns, r = te(this._sortedIndices.map((e) => this.data[e]), n, t);
 		try {
 			await navigator.clipboard.writeText(r);
 		} catch (e) {
@@ -1848,7 +1996,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		if (!this._activeCell) return;
 		let e = await this._readClipboardText();
 		if (e == null) return;
-		let t = k(e);
+		let t = ne(e);
 		if (t.length === 0) return;
 		let n = this._expandRowsForPaste(this._activeCell.row, t.length), r = this._applyPasteData(this._activeCell, t);
 		if (r.length > 0 || n.length > 0) {
@@ -1906,7 +2054,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 			for (let a = 0; a < t[i].length; a++) {
 				let s = e.col + a;
 				if (s >= n.length) break;
-				let c = n[s], l = this.data[o][c.key], u = A(t[i][a], c);
+				let c = n[s], l = this.data[o][c.key], u = D(t[i][a], c);
 				this.data[o][c.key] = u, r.push({
 					row: o,
 					col: s,
@@ -1971,7 +2119,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 			for (let r = e.startCol + 1; r <= e.endCol; r++) {
 				let e = t[r];
 				if (!e || !this._isCellEditable(e)) continue;
-				let a = A(o == null ? "" : String(o), e);
+				let a = D(o == null ? "" : String(o), e);
 				n.push({
 					row: i,
 					key: e.key,
@@ -2062,7 +2210,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 			this._selectColumn(n);
 			return;
 		}
-		t.sortable !== !1 && (this._sortCriteria = w(this._sortCriteria, t.key, e.shiftKey), this.dataMode !== "server" && this._recomputeView(), this.requestUpdate(), this.dispatchEvent(new CustomEvent("sort-change", {
+		t.sortable !== !1 && (this._sortCriteria = C(this._sortCriteria, t.key, e.shiftKey), this.dataMode !== "server" && this._recomputeView(), this.requestUpdate(), this.dispatchEvent(new CustomEvent("sort-change", {
 			detail: { criteria: [...this._sortCriteria] },
 			bubbles: !0,
 			composed: !0
@@ -2194,6 +2342,89 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
       </div>
     ` : r;
 	}
+	_renderBodyContextMenu() {
+		if (!this._bodyContextMenu) return r;
+		let { colIndex: e, dataIndex: t, x: i, y: a } = this._bodyContextMenu, o = this.visibleColumns[e];
+		if (!o) return r;
+		let s = this.data[t]?.[o.key], c = this._filters.some((e) => e.key === o.key), l = () => {
+			this._bodyContextMenu = null;
+		};
+		return n`
+      <div class="ft-body-context-menu" style="position: fixed; left: ${i + 200 > window.innerWidth ? i - 200 : i}px; top: ${a + 280 > window.innerHeight ? a - 280 : a}px; z-index: 200;"
+        @mousedown=${(e) => e.stopPropagation()}>
+        <div class="ft-context-menu-item"
+          @click=${() => {
+			this._handleCopy(!1), l();
+		}}>
+          Copy
+        </div>
+        <div class="ft-context-menu-separator"></div>
+        <div class="ft-context-menu-item"
+          @click=${() => {
+			this.addRow(void 0, t), l();
+		}}>
+          Insert row above
+        </div>
+        <div class="ft-context-menu-item"
+          @click=${() => {
+			this.addRow(void 0, t + 1), l();
+		}}>
+          Insert row below
+        </div>
+        <div class="ft-context-menu-item ft-context-menu-danger"
+          @click=${() => {
+			this.deleteRows([t]), l();
+		}}>
+          Delete row
+        </div>
+        <div class="ft-context-menu-separator"></div>
+        <div class="ft-context-menu-item"
+          @click=${() => {
+			this._setColumnHidden(o.key, !0), l();
+		}}>
+          Hide column
+        </div>
+        <div class="ft-context-menu-separator"></div>
+        <div class="ft-context-menu-item"
+          @click=${() => {
+			this._applySortFromMenu(o.key, "asc"), l();
+		}}>
+          Sort ascending ↑
+        </div>
+        <div class="ft-context-menu-item"
+          @click=${() => {
+			this._applySortFromMenu(o.key, "desc"), l();
+		}}>
+          Sort descending ↓
+        </div>
+        <div class="ft-context-menu-separator"></div>
+        <div class="ft-context-menu-item"
+          @click=${() => {
+			this.setFilter(o.key, (e) => e === s), l();
+		}}>
+          Filter by this value
+        </div>
+        ${c ? n`
+          <div class="ft-context-menu-item"
+            @click=${() => {
+			this.removeFilter(o.key), l();
+		}}>
+            Clear filter
+          </div>
+        ` : ""}
+      </div>
+    `;
+	}
+	_applySortFromMenu(e, t) {
+		this.columns.find((t) => t.key === e) && (this._sortCriteria = [{
+			key: e,
+			direction: t
+		}], this._sortedIndices = S(this.data, this._sortCriteria, this.columns), this.dispatchEvent(new CustomEvent("sort-change", {
+			detail: { sortCriteria: [...this._sortCriteria] },
+			bubbles: !0,
+			composed: !0
+		})), this.requestUpdate());
+	}
 	_adjustFilterDropdown() {
 		if (!this._openFilterKey) return;
 		let e = this.shadowRoot?.querySelector(".ft-filter-dropdown");
@@ -2334,7 +2565,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		if (!n) return;
 		let r = this.shadowRoot?.querySelectorAll(`.ft-cell[data-col-index="${t}"]`), i = 0, a = this.shadowRoot?.querySelector(`.ft-header-cell[data-col-index="${t}"]`);
 		if (a && (i = Math.max(i, a.scrollWidth)), r) for (let e of r) i = Math.max(i, e.scrollWidth);
-		let o = n.minWidth ?? U, s = Math.max(o, i + 8);
+		let o = n.minWidth ?? Z, s = Math.max(o, i + 8);
 		this._columnWidths.set(n.key, s), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-resize", {
 			detail: {
 				key: n.key,
@@ -2347,7 +2578,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 	}
 	_onResizeStart(e, t) {
 		e.preventDefault(), e.stopPropagation();
-		let n = this.visibleColumns[t], r = this._columnWidths.get(n.key) ?? n.width ?? H;
+		let n = this.visibleColumns[t], r = this._columnWidths.get(n.key) ?? n.width ?? X;
 		this._resizing = {
 			colIndex: t,
 			startX: e.clientX,
@@ -2355,13 +2586,13 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		};
 		let i = (e) => {
 			if (!this._resizing) return;
-			let t = e.clientX - this._resizing.startX, r = n.minWidth ?? U, i = Math.max(r, this._resizing.startWidth + t);
+			let t = e.clientX - this._resizing.startX, r = n.minWidth ?? Z, i = Math.max(r, this._resizing.startWidth + t);
 			this._columnWidths.set(n.key, i), this.requestUpdate();
 		}, a = () => {
 			document.removeEventListener("mousemove", i), document.removeEventListener("mouseup", o), this._resizeCleanup = null;
 		}, o = () => {
 			if (a(), this._resizing) {
-				let e = this._columnWidths.get(n.key) ?? H;
+				let e = this._columnWidths.get(n.key) ?? X;
 				this.dispatchEvent(new CustomEvent("column-resize", {
 					detail: {
 						key: n.key,
@@ -2812,6 +3043,7 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
       ${_}
       ${g}
       ${this._renderHeaderContextMenu()}
+      ${this._renderBodyContextMenu()}
     `;
 	}
 	_onSelectAllChange(e) {
@@ -2991,36 +3223,39 @@ var H = 120, U = 40, W = 32, G = 5, K = class extends e {
 		return isNaN(t.getTime()) ? "" : `${t.getFullYear()}-${String(t.getMonth() + 1).padStart(2, "0")}-${String(t.getDate()).padStart(2, "0")}T${String(t.getHours()).padStart(2, "0")}:${String(t.getMinutes()).padStart(2, "0")}`;
 	}
 };
-V([a({ type: Array })], K.prototype, "columns", void 0), V([a({
+Y([a({ type: Array })], $.prototype, "columns", void 0), Y([a({
 	type: Array,
 	hasChanged: () => !0
-})], K.prototype, "data", void 0), V([a({
+})], $.prototype, "data", void 0), Y([a({
 	type: Number,
 	attribute: "row-height"
-})], K.prototype, "rowHeight", void 0), V([a({
+})], $.prototype, "rowHeight", void 0), Y([a({
 	type: Boolean,
 	attribute: "show-row-numbers"
-})], K.prototype, "showRowNumbers", void 0), V([a({
+})], $.prototype, "showRowNumbers", void 0), Y([a({
 	type: String,
 	reflect: !0
-})], K.prototype, "theme", void 0), V([a({
+})], $.prototype, "theme", void 0), Y([a({
 	type: Number,
 	attribute: "max-rows"
-})], K.prototype, "maxRows", void 0), V([a({ type: Boolean })], K.prototype, "editable", void 0), V([a({
+})], $.prototype, "maxRows", void 0), Y([a({ type: Boolean })], $.prototype, "editable", void 0), Y([a({
 	type: Boolean,
 	attribute: "show-filters"
-})], K.prototype, "showFilters", void 0), V([a({ type: Boolean })], K.prototype, "selectable", void 0), V([a({
+})], $.prototype, "showFilters", void 0), Y([a({
+	type: Boolean,
+	attribute: "show-context-menu"
+})], $.prototype, "showContextMenu", void 0), Y([a({ type: Boolean })], $.prototype, "selectable", void 0), Y([a({
 	type: String,
 	attribute: "selection-mode"
-})], K.prototype, "selectionMode", null), V([a({
+})], $.prototype, "selectionMode", null), Y([a({
 	type: String,
 	attribute: "data-mode"
-})], K.prototype, "dataMode", void 0), V([a({
+})], $.prototype, "dataMode", void 0), Y([a({
 	type: Object,
 	attribute: "footer-data"
-})], K.prototype, "footerData", void 0), V([a({
+})], $.prototype, "footerData", void 0), Y([a({
 	type: Number,
 	attribute: "max-undo-size"
-})], K.prototype, "maxUndoSize", null), V([o()], K.prototype, "_scrollTop", void 0), V([o()], K.prototype, "_scrollLeft", void 0), V([o()], K.prototype, "_viewportHeight", void 0), V([o()], K.prototype, "_viewportWidth", void 0), V([o()], K.prototype, "_activeCell", void 0), V([o()], K.prototype, "_editingCell", void 0), V([o()], K.prototype, "_sortCriteria", void 0), V([o()], K.prototype, "_openFilterKey", void 0), V([o()], K.prototype, "_rowSelectionVersion", void 0), V([o()], K.prototype, "_autocompleteState", void 0), V([o()], K.prototype, "_headerMenu", void 0), K = V([i("flex-table")], K);
+})], $.prototype, "maxUndoSize", null), Y([o()], $.prototype, "_scrollTop", void 0), Y([o()], $.prototype, "_scrollLeft", void 0), Y([o()], $.prototype, "_viewportHeight", void 0), Y([o()], $.prototype, "_viewportWidth", void 0), Y([o()], $.prototype, "_activeCell", void 0), Y([o()], $.prototype, "_editingCell", void 0), Y([o()], $.prototype, "_sortCriteria", void 0), Y([o()], $.prototype, "_openFilterKey", void 0), Y([o()], $.prototype, "_rowSelectionVersion", void 0), Y([o()], $.prototype, "_autocompleteState", void 0), Y([o()], $.prototype, "_headerMenu", void 0), Y([o()], $.prototype, "_bodyContextMenu", void 0), $ = Y([i("flex-table")], $);
 //#endregion
-export { f as a, x as i, j as n, D as r, K as t };
+export { f as a, x as i, U as n, E as r, $ as t };

package/dist/flex-table.d.ts

@@ -15,6 +15,8 @@ export declare class FlexTable extends LitElement {
     maxRows: number;
     editable: boolean;
     showFilters: boolean;
+    /** Enable built-in context menu on cell right-click. */
+    showContextMenu: boolean;
     /** Enable row-level checkbox selection. */
     selectable: boolean;
     /** Row selection mode: 'single' or 'multi' (default: 'multi'). */
@@ -46,6 +48,7 @@ export declare class FlexTable extends LitElement {
     private _rowSelectionVersion;
     private _autocompleteState;
     private _headerMenu;
+    private _bodyContextMenu;
     private _viewDirty;
     private _isDragging;
     private _wasDrag;
@@ -152,7 +155,7 @@ export declare class FlexTable extends LitElement {
      */
     exportToString(format: ExportFormat, options?: {
         selectionOnly?: boolean;
-    }): string;
+    }): string | Uint8Array;
     /**
      * Export table data and trigger file download.
      */
@@ -228,6 +231,8 @@ export declare class FlexTable extends LitElement {
     private _onHeaderContextMenu;
     private _showHiddenBefore;
     private _renderHeaderContextMenu;
+    private _renderBodyContextMenu;
+    private _applySortFromMenu;
     private _adjustFilterDropdown;
     private _onFilterBtnClick;
     private _renderFilterDropdown;

package/dist/flex-table.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, r, t as i } from "./flex-table-zJST_6sy.js";
+import { a as e, i as t, n, r, t as i } from "./flex-table-fp3j2egA.js";
 export { i as FlexTable, t as RowSelectionState, r as UndoStack, n as exportData, e as renderCell };

package/dist/react.js

@@ -1,4 +1,4 @@
-import { t as e } from "./flex-table-zJST_6sy.js";
+import { t as e } from "./flex-table-fp3j2egA.js";
 import t from "react";
 import { createComponent as n } from "@lit/react";
 //#region src/react.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iyulab/flex-table",
-  "version": "0.13.0",
+  "version": "0.14.0",
   "description": "A minimalist, input-centric data grid web component",
   "type": "module",
   "main": "./dist/flex-table.js",