@iyulab/flex-table 0.31.1 → 0.31.5

package/CHANGELOG.md

@@ -1,5 +1,55 @@
 # Changelog
 
+## [0.31.5] - 2026-09-04
+
+### Fixed
+
+- **`0.31.3` and `0.31.4` both failed to reach npm for the same reason**: the
+  publish and demo-deploy workflows pinned Node 22, and npm's dependency
+  resolver crashes with a null-pointer error during a lockfile-less install
+  on that runner (this repo doesn't commit a `package-lock.json`) — the CI
+  workflow, which already runs Node 24, never hit it. Both workflows now run
+  Node 24 to match CI. No package code changed; this release exists to get
+  `0.31.3`'s content onto the registry with a working pipeline.
+
+## [0.31.4] - 2026-09-04
+
+### Fixed
+
+- **`0.31.3`'s release pipeline never actually published to npm** — the
+  publish step's `npm install` crashed with a null-pointer error inside
+  npm's own dependency-resolution engine, unrelated to this package's
+  dependency graph (the lockfile is byte-for-byte unchanged from the prior,
+  successfully published `0.31.2`, and two separate retries reproduced the
+  identical crash). No package code changed; this release exists to get
+  `0.31.3`'s content onto the registry with a working pipeline.
+
+## [0.31.3] - 2026-09-04
+
+### Fixed
+
+- **Header resize/reorder drag and row-number drag reorder could spuriously
+  toggle column sort or extend row selection on drop.** A native `click`
+  event the browser synthesizes after `mouseup` bubbles to the header
+  cell's own sort listener (or the row-number cell's select listener)
+  even though `stopPropagation()` on the drag handle's `mousedown` had
+  already fired — that call only blocks the `mousedown` itself, not the
+  separate `click` that follows. Both interactions now track whether the
+  gesture that just ended was a genuine resize/drag and skip the next
+  click when it was.
+
+## [0.31.2] - 2026-09-02
+
+### Fixed
+
+- **`ColumnDefinition`'s README reference was missing three real, shipped
+  fields**: `headerAlign` (per-column header alignment, added in a later
+  commit than the rest of the snippet), `options`/`autocomplete` (select-type
+  columns and autocomplete editing, since `0.13.0`). The `select` value of
+  `ColumnType` was also missing from its inline comment. None of these had
+  any mention anywhere in the README — a consumer had no way to discover
+  select columns or autocomplete existed short of reading the source.
+
 ## [0.31.1] - 2026-09-01
 
 ### Fixed

package/README.md

@@ -107,13 +107,16 @@ npm install @iyulab/flex-table
 interface ColumnDefinition {
   key: string;             // Unique key matching data property names
   header: string;          // Display header text
-  type?: ColumnType;       // 'text' | 'number' | 'boolean' | 'date' | 'datetime'
-  width?: number;          // Column width in pixels (default: 120)
+  type?: ColumnType;       // 'text' | 'number' | 'boolean' | 'date' | 'datetime' | 'select' (any other string falls back to 'text')
+  width?: number;          // Column width in pixels (default: auto)
   minWidth?: number;       // Minimum width in pixels (default: 40, enforced in rendering)
   hidden?: boolean;        // Hide column from view
   sortable?: boolean;      // Enable sorting (default: true)
+  headerAlign?: 'start' | 'center' | 'end'; // Header label alignment (default: 'start'), independent of cell content alignment
   editable?: boolean;      // Per-column edit control (follows global editable)
   pinned?: 'left' | 'right'; // Freeze column during horizontal scroll
+  options?: string[] | SelectOption[]; // Allowed values for type: 'select' (SelectOption = { label, value })
+  autocomplete?: boolean | 'strict'; // Suggest existing column values while editing; 'strict' rejects values not in the list
   format?: string | ((value, row, col) => string); // Display format, see "format vs renderer" below
   renderer?: CellRenderer; // Custom cell render: (value, row, col) => TemplateResult | string
   editor?: CellEditor;     // Custom cell editor: (value, row, col) => TemplateResult

package/dist/{flex-table-BH1lOINr.js → flex-table-D4W1C_QA.js}

@@ -1497,7 +1497,7 @@ async function K(e) {
 	};
 }
 //#endregion
-//#region \0@oxc-project+runtime@0.147.0/helpers/esm/decorate.js
+//#region \0@oxc-project+runtime@0.148.0/helpers/esm/decorate.js
 function q(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);
@@ -1515,7 +1515,7 @@ var J = {
 	lte: "≤"
 }, Y = 120, X = 40, Z = 32, Q = 5, $ = class extends n {
 	constructor(...e) {
-		super(...e), this.columns = [], this._data = [], this._inUndoRedo = !1, this.clearUndoOnDataChange = !1, this.clearSelectionOnDataChange = !1, this._rowHeightFromCss = Z, this.showRowNumbers = !1, this.theme = void 0, this.maxRows = 0, this.editable = !0, this.showFilters = !1, this.showContextMenu = !1, this.frozenRows = 0, this.emptyMessage = "No data", this.noMatchingMessage = "No matching data", this.loading = !1, this.importEnabled = !1, this.selectable = !1, this.dataMode = "client", this.footerData = null, this.stylesheets = [], this._scrollTop = 0, this._scrollLeft = 0, this._viewportHeight = 0, this._viewportWidth = 0, this._colLeftOffsets = [], this._totalRowWidth = 0, this._baseStyleSheets = [], this._activeCell = null, this._editingCell = null, this._sortCriteria = [], this._selection = new x(), this._editing = new S(), this._rowSelection = new C(), this._undo = new E(), this._filters = [], this._filteredIndices = [], this._sortedIndices = [], this._openFilterKey = null, this._rowSelectionVersion = 0, this._lastCheckboxRowIndex = null, this._checkboxShiftPending = !1, this._autocompleteState = null, this._headerMenu = null, this._bodyContextMenu = null, this._commentPopup = 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._comments = /* @__PURE__ */ new Map(), this._isDragOver = !1, this._onCommentPopupOutsideClick = () => {
+		super(...e), this.columns = [], this._data = [], this._inUndoRedo = !1, this.clearUndoOnDataChange = !1, this.clearSelectionOnDataChange = !1, this._rowHeightFromCss = Z, this.showRowNumbers = !1, this.theme = void 0, this.maxRows = 0, this.editable = !0, this.showFilters = !1, this.showContextMenu = !1, this.frozenRows = 0, this.emptyMessage = "No data", this.noMatchingMessage = "No matching data", this.loading = !1, this.importEnabled = !1, this.selectable = !1, this.dataMode = "client", this.footerData = null, this.stylesheets = [], this._scrollTop = 0, this._scrollLeft = 0, this._viewportHeight = 0, this._viewportWidth = 0, this._colLeftOffsets = [], this._totalRowWidth = 0, this._baseStyleSheets = [], this._activeCell = null, this._editingCell = null, this._sortCriteria = [], this._selection = new x(), this._editing = new S(), this._rowSelection = new C(), this._undo = new E(), this._filters = [], this._filteredIndices = [], this._sortedIndices = [], this._openFilterKey = null, this._rowSelectionVersion = 0, this._lastCheckboxRowIndex = null, this._checkboxShiftPending = !1, this._autocompleteState = null, this._headerMenu = null, this._bodyContextMenu = null, this._commentPopup = null, this._viewDirty = !0, this._isDragging = !1, this._wasDrag = !1, this._resizing = null, this._resizeCleanup = null, this._wasHeaderDrag = !1, this._wasRowDrag = !1, 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._comments = /* @__PURE__ */ new Map(), this._isDragOver = !1, this._onCommentPopupOutsideClick = () => {
 			this._commitCommentPopup();
 		}, this._invalidCells = /* @__PURE__ */ new Map(), this._textFilterState = /* @__PURE__ */ new Map(), this._numberFilterState = /* @__PURE__ */ new Map(), this._dateFilterState = /* @__PURE__ */ new Map(), this._emptyFilterState = /* @__PURE__ */ new Map();
 	}
@@ -2069,7 +2069,7 @@ var J = {
 		this._readDensityTokens(), this._measureViewport(), this.shadowRoot && Array.isArray(this.shadowRoot.adoptedStyleSheets) && (this._baseStyleSheets = [...this.shadowRoot.adoptedStyleSheets]), this._syncStylesheets();
 	}
 	_syncStylesheets() {
-		!this.shadowRoot || !Array.isArray(this.shadowRoot.adoptedStyleSheets) || (this.shadowRoot.adoptedStyleSheets = [...this._baseStyleSheets, ...this.stylesheets]);
+		this.shadowRoot && Array.isArray(this.shadowRoot.adoptedStyleSheets) && (this.shadowRoot.adoptedStyleSheets = [...this._baseStyleSheets, ...this.stylesheets]);
 	}
 	_readDensityTokens() {
 		let e = getComputedStyle(this).getPropertyValue("--ft-row-height").trim();
@@ -2222,6 +2222,10 @@ var J = {
 		this._isDragging && (this._wasDrag = !0, this._selection.setActiveWithRange(e, t), this._activeCell = this._selection.activeCell ? { ...this._selection.activeCell } : null, this._dispatchSelectionEvent(), this.requestUpdate());
 	}
 	_onRowNumberClick(e) {
+		if (this._wasRowDrag) {
+			this._wasRowDrag = !1;
+			return;
+		}
 		this._editing.current && this._commitEdit();
 		let t = this.visibleColumns.length - 1;
 		this._selection.setActive(e, 0), this._selection.setActiveWithRange(e, t), this._activeCell = this._selection.activeCell ? { ...this._selection.activeCell } : null, this._dispatchSelectionEvent(), this.requestUpdate();
@@ -2739,6 +2743,10 @@ var J = {
 		}));
 	}
 	_onHeaderClick(t, n) {
+		if (this._wasHeaderDrag) {
+			this._wasHeaderDrag = !1;
+			return;
+		}
 		let r = this.visibleColumns.indexOf(n);
 		if (t.ctrlKey || t.metaKey) {
 			this._selectColumn(r);
@@ -2821,7 +2829,7 @@ var J = {
         ` : ""}
         <div class="ft-resize-handle"
           @mousedown=${(e) => {
-			e.stopPropagation(), this._onResizeStart(e, t);
+			e.stopPropagation(), this._wasHeaderDrag = !0, this._onResizeStart(e, t);
 		}}
           @dblclick=${(e) => this._onResizeAutoFit(e, t)}></div>
       </div>
@@ -3379,7 +3387,7 @@ var J = {
 			let t = Math.abs(e.clientX - this._colDrag.startX);
 			!this._colDrag.active && t > 5 && (this._colDrag.active = !0, this._startColumnGhost(e), this.requestUpdate()), this._colDrag.active && this._updateColumnDrag(e);
 		}, i = (e) => {
-			document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", i), this._colDrag?.active && this._finishColumnDrag(), this._colDrag?.ghost && this._colDrag.ghost.remove(), this._colDrag = null, this._colDragIndicatorLeft = null, this.requestUpdate();
+			document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", i), this._colDrag?.active && (this._wasHeaderDrag = !0, this._finishColumnDrag()), this._colDrag?.ghost && this._colDrag.ghost.remove(), this._colDrag = null, this._colDragIndicatorLeft = null, this.requestUpdate();
 		};
 		document.addEventListener("mousemove", r), document.addEventListener("mouseup", i);
 	}
@@ -3546,7 +3554,7 @@ var J = {
 			let n = Math.abs(e.clientY - this._rowDrag.startY);
 			!this._rowDrag.active && n > 5 && (this._rowDrag.active = !0, this._startRowGhost(e, t), this.requestUpdate()), this._rowDrag.active && this._updateRowDrag(e);
 		}, r = () => {
-			document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", r), this._rowDrag?.active && this._finishRowDrag(), this._rowDrag?.ghost && this._rowDrag.ghost.remove(), this._rowDrag = null, this._rowDragIndicatorY = null, this.requestUpdate();
+			document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", r), this._rowDrag?.active && (this._wasRowDrag = !0, this._finishRowDrag()), this._rowDrag?.ghost && this._rowDrag.ghost.remove(), this._rowDrag = null, this._rowDragIndicatorY = null, this.requestUpdate();
 		};
 		document.addEventListener("mousemove", n), document.addEventListener("mouseup", r);
 	}

package/dist/flex-table.d.ts

@@ -128,6 +128,13 @@ export declare class FlexTable extends LitElement {
     private _wasDrag;
     private _resizing;
     private _resizeCleanup;
+    /** Set by a resize or a real column-drag reorder; consumed once by the next header `click` to
+     * suppress the browser's synthetic click that follows mouseup (same pattern as `_wasDrag` for
+     * cell-selection drags below). */
+    private _wasHeaderDrag;
+    /** Same as `_wasHeaderDrag`, for the row-number gutter's real row-drag reorder vs. its own
+     * `click`-to-select-row listener. */
+    private _wasRowDrag;
     private _colDrag;
     private _colDragIndicatorLeft;
     private _fillDrag;

package/dist/flex-table.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, r, t as i } from "./flex-table-BH1lOINr.js";
+import { a as e, i as t, n, r, t as i } from "./flex-table-D4W1C_QA.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-BH1lOINr.js";
+import { t as e } from "./flex-table-D4W1C_QA.js";
 import t from "react";
 import { createComponent as n } from "@lit/react";
 var r = n({

package/package.json

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