@iyulab/flex-table 0.28.0 → 0.30.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,30 @@
1
1
  # Changelog
2
2
 
3
+ ## [0.30.0] - 2026-08-28
4
+
5
+ ### Added
6
+
7
+ - **`buildSearchExpression` and `parseOrderBy` are now exported from
8
+ `./odata`.** Both were already implemented as pure, tested functions used
9
+ internally by `useODataSource`, but the public barrel only re-exported
10
+ the hook itself. A consumer needing the same `$search`/`$orderby`
11
+ encoding without the pagination hook (a typeahead, a standalone sort
12
+ control) had to reimplement the OData 4.0 search-quoting workaround
13
+ from scratch.
14
+
15
+ ## [0.29.0] - 2026-08-28
16
+
17
+ ### Added
18
+
19
+ - **`row-activate` event, fired on Enter for a non-editable cell.** The internal
20
+ keydown handler always consumed Enter/F2 regardless of a column's editability,
21
+ so a host attaching its own `keydown` listener to the grid had no reliable way
22
+ to react to Enter in a read-only grid (registration order dependent). Enter on
23
+ a non-editable cell now dispatches `row-activate` (`{ row, index, col, key }`)
24
+ instead of attempting to start an edit — mirroring the existing `row-add`/
25
+ `row-delete` detail shape. F2 is unaffected (edit-only key). Mapped through to
26
+ the React wrapper as `onRowActivate`.
27
+
3
28
  ## [0.28.0] - 2026-08-23
4
29
 
5
30
  ### Added
package/README.md CHANGED
@@ -76,7 +76,7 @@ npm install @iyulab/flex-table
76
76
  | `rowHeight` | `row-height` | `number` | `32` | Row height in pixels. Falls back to the `--ft-row-height` token when not set — see [Density](#density-and-header-hierarchy) |
77
77
  | `showRowNumbers` | `show-row-numbers` | `boolean` | `false` | Show row number column |
78
78
  | `theme` | `theme` | `'light' \| 'dark'` | auto | Force theme; auto-detects `prefers-color-scheme` |
79
- | `editable` | `editable` | `boolean` | `true` | Global read-only mode when `false` |
79
+ | `editable` | `editable` | `boolean` | `true` | Global read-only mode when `false`. Defaults to `true` — a purely read-only grid should set this explicitly rather than relying on per-column `editable: false` alone, since it's also what makes Enter fire `row-activate` (see [Events](#events)) instead of entering edit mode |
80
80
  | `showFilters` | `show-filters` | `boolean` | `false` | Show built-in header filter dropdowns |
81
81
  | `maxRows` | `max-rows` | `number` | `0` | Max row count (0 = unlimited); blocks `addRow()` and paste expansion |
82
82
  | `maxUndoSize` | `max-undo-size` | `number` | `100` | Max undo history stack size |
@@ -234,6 +234,7 @@ All events use `CustomEvent` with `bubbles: true, composed: true`.
234
234
  |-------|--------|-------------|
235
235
  | `row-add` | `{ row, index }` | Row added |
236
236
  | `row-delete` | `{ indices, rows }` | Rows deleted |
237
+ | `row-activate` | `{ row, index, col, key }` | Enter pressed on a non-editable cell — the grid's own contract for "activate this row" (e.g. navigate to a detail view), guaranteed even though the internal Enter handler prevents the keystroke from reliably reaching a listener the host attaches to the same element |
237
238
  | `batch-update` | `{ changes: [{ row, key, oldValue, newValue }] }` | Batch update applied |
238
239
 
239
240
  ### Column Events
@@ -306,6 +307,7 @@ flex-table {
306
307
  --ft-row-even-bg: #fff; /* --u-bg-color */
307
308
  --ft-row-odd-bg: #fafafa; /* --u-bg-color-raised */
308
309
  --ft-row-hover-bg: #f0f4ff; /* --u-bg-color-hover */
310
+ --ft-row-odd-hover-bg: #f0f4ff; /* --u-bg-color-raised-hover — odd row's hover, independent of --ft-row-hover-bg */
309
311
  --ft-editor-bg: #fff; /* --u-input-bg-color */
310
312
  --ft-sort-indicator-color: #5f6368;/* --u-txt-color-weak */
311
313
  --ft-empty-color: #5f6368; /* --u-txt-color-weak */
@@ -604,6 +606,16 @@ The hook returns:
604
606
 
605
607
  Terms are always quoted because OData 4.0 only allows letters in an unquoted `searchWord`, so `2026` or `ZT-E2E-A` would be rejected by servers that follow it (4.01 relaxed this, but [Microsoft.OData still lexes as 4.0](https://github.com/OData/odata.net/issues/2445)). Quoting keeps any term valid regardless of server version. Since a `$search` phrase cannot contain `"` and OData defines no escape for it, double quotes are stripped from the term.
606
608
 
609
+ The quoting/escaping logic above is also available standalone as `buildSearchExpression(term)`, for consumers that need the same `$search` encoding without the pagination hook (e.g. a typeahead/combobox that isn't a table). `parseOrderBy(orderBy)` (`'a asc, b desc'` → `SortCriteria[]`) is exported the same way, for consumers driving a sort UI that isn't `useODataSource` either:
610
+
611
+ ```ts
612
+ import { buildSearchExpression, parseOrderBy } from '@iyulab/flex-table/odata';
613
+
614
+ buildSearchExpression('red shirt'); // '"red" AND "shirt"'
615
+ buildSearchExpression(''); // undefined
616
+ parseOrderBy('name desc'); // [{ key: 'name', direction: 'desc' }]
617
+ ```
618
+
607
619
  ## Development
608
620
 
609
621
  ```bash
@@ -1546,7 +1546,7 @@ async function xe(e) {
1546
1546
  };
1547
1547
  }
1548
1548
  //#endregion
1549
- //#region \0@oxc-project+runtime@0.146.0/helpers/esm/decorate.js
1549
+ //#region \0@oxc-project+runtime@0.147.0/helpers/esm/decorate.js
1550
1550
  function q(e, t, n, r) {
1551
1551
  var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
1552
1552
  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
@@ -2281,6 +2281,20 @@ var J = {
2281
2281
  _isCellEditable(e) {
2282
2282
  return !(!this.editable || e.editable === !1);
2283
2283
  }
2284
+ _fireRowActivate(e) {
2285
+ if (!this._activeCell) return;
2286
+ let t = this._toDataIndex(this._activeCell.row), n = this.data[t];
2287
+ n && this.dispatchEvent(new CustomEvent("row-activate", {
2288
+ detail: {
2289
+ row: n,
2290
+ index: t,
2291
+ col: this._activeCell.col,
2292
+ key: e?.key
2293
+ },
2294
+ bubbles: !0,
2295
+ composed: !0
2296
+ }));
2297
+ }
2284
2298
  _startEdit() {
2285
2299
  if (!this._activeCell) return;
2286
2300
  let e = this.visibleColumns[this._activeCell.col];
@@ -2456,7 +2470,9 @@ var J = {
2456
2470
  }
2457
2471
  if (t.length !== 0 && this._visibleRowCount !== 0) {
2458
2472
  if ((e.key === "Enter" || e.key === "F2") && this._activeCell) {
2459
- e.preventDefault(), this._startEdit();
2473
+ e.preventDefault();
2474
+ let n = t[this._activeCell.col];
2475
+ n && this._isCellEditable(n) ? this._startEdit() : e.key === "Enter" && this._fireRowActivate(n);
2460
2476
  return;
2461
2477
  }
2462
2478
  if (!this._selection.activeCell) {
@@ -333,6 +333,13 @@ export declare class FlexTable extends LitElement {
333
333
  private _onCellDblClick;
334
334
  /** Check if a column is editable based on global + per-column settings */
335
335
  private _isCellEditable;
336
+ /**
337
+ * Enter가 non-editable 셀에서 눌렸을 때 "이 행을 확정한다"는 신호를 호스트에
338
+ * 공식적으로 알린다. 그리드가 자체 `keydown` 핸들러에서 Enter를 먼저 처리하므로,
339
+ * 호스트가 같은 엘리먼트에 직접 붙인 리스너는 등록 순서에 의존하게 되어 안전한
340
+ * 공개 계약이 못 된다 — 이 이벤트가 유일한 보장된 훅이다.
341
+ */
342
+ private _fireRowActivate;
336
343
  private _startEdit;
337
344
  private _commitEdit;
338
345
  private _applyEdit;
@@ -1,2 +1,2 @@
1
- import { a as e, i as t, n, r, t as i } from "./flex-table-BQvkNkCu.js";
1
+ import { a as e, i as t, n, r, t as i } from "./flex-table-DuQWDNlT.js";
2
2
  export { i as FlexTable, t as RowSelectionState, r as UndoStack, n as exportData, e as renderCell };
@@ -1,2 +1,2 @@
1
- export { useODataSource } from './use-odata-source.js';
1
+ export { useODataSource, buildSearchExpression, parseOrderBy } from './use-odata-source.js';
2
2
  export type { UseODataSourceOptions, UseODataSourceResult } from './types.js';
@@ -80,4 +80,4 @@ function s(e) {
80
80
  });
81
81
  }
82
82
  //#endregion
83
- export { o as useODataSource };
83
+ export { a as buildSearchExpression, s as parseOrderBy, o as useODataSource };
@@ -0,0 +1 @@
1
+ export {};
package/dist/react.d.ts CHANGED
@@ -11,6 +11,7 @@ declare const FlexTableReactBase: import("@lit/react").ReactWebComponent<FlexTab
11
11
  onFilterChange: EventName<CustomEvent>;
12
12
  onRowAdd: EventName<CustomEvent>;
13
13
  onRowDelete: EventName<CustomEvent>;
14
+ onRowActivate: EventName<CustomEvent>;
14
15
  onColumnResize: EventName<CustomEvent>;
15
16
  onColumnSelect: EventName<CustomEvent>;
16
17
  onColumnAdd: EventName<CustomEvent>;
package/dist/react.js CHANGED
@@ -1,4 +1,4 @@
1
- import { t as e } from "./flex-table-BQvkNkCu.js";
1
+ import { t as e } from "./flex-table-DuQWDNlT.js";
2
2
  import t from "react";
3
3
  import { createComponent as n } from "@lit/react";
4
4
  var r = n({
@@ -14,6 +14,7 @@ var r = n({
14
14
  onFilterChange: "filter-change",
15
15
  onRowAdd: "row-add",
16
16
  onRowDelete: "row-delete",
17
+ onRowActivate: "row-activate",
17
18
  onColumnResize: "column-resize",
18
19
  onColumnSelect: "column-select",
19
20
  onColumnAdd: "column-add",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@iyulab/flex-table",
3
- "version": "0.28.0",
3
+ "version": "0.30.0",
4
4
  "description": "A minimalist, input-centric data grid web component",
5
5
  "type": "module",
6
6
  "main": "./dist/flex-table.js",