@iyulab/flex-table 0.46.0 → 0.48.0

package/CHANGELOG.md

@@ -1,5 +1,62 @@
 # Changelog
 
+## [0.48.0] - 2026-10-06
+
+### Fixed
+
+- **Ctrl+X no longer clears cells that never reached the clipboard.** The keys called the async
+  Clipboard API; when the write was refused — no permission, a page outside a secure context, a
+  browser without it — the table still cleared the cut range and fired `clipboard-cut`
+  (`clipboard-copy` for Ctrl+C). Ctrl+C, Ctrl+X and Ctrl+V now go through the browser's own
+  copy/cut/paste and `clipboardData`: they need no clipboard permission, work on any page, and a cut
+  range is cleared only once its text is on the clipboard.
+- The context menu's Copy, which still writes through the Clipboard API, fires `clipboard-copy` only
+  when the write succeeds; a refused write fires `clipboard-error` alone.
+
+### Changed
+
+- `clipboard-error` is now only the context menu's Copy (`action: 'copy'`). Paste no longer reads
+  through the Clipboard API, so it has no permission to be refused and never reports `'paste'`.
+- Copy, cut and paste typed in a text field inside the grid (the cell editor, the find panel) are
+  that field's own and leave the cells alone.
+
+### Documentation
+
+- README: the keyboard table covers every key the grid handles, and the column example uses
+  `appearance="plain"` (the `variant` attribute was removed in `@iyulab/components` 2.0).
+
+### Tests
+
+- Real key input for Ctrl+C/X/V, Ctrl+Click on a header, and the column menu's Space / Home / End /
+  Escape, alongside the rest of the keyboard table.
+
+## [0.47.0] - 2026-10-05
+
+### Changed
+
+- **Breaking: `error` from `useODataSource` and `useArraySource` is a structured failure, not a
+  string** — `SourceError | null`, where `SourceError` is `{ message, status?, code?, details?, body? }`
+  (exported from `@iyulab/flex-table/react` with `SourceErrorDetail`). The message alone lost which
+  failure it was, so an app could not tell a 403 the server marked with its own code (for example
+  "password change required") from any other 403, or a 404 from a 409, without wrapping `fetcher`
+  to watch the status. Now `status` is the HTTP status, `code` the server's rejection code (OData
+  `error.code`), `details` the OData `error.details` entries, and `body` the parsed response (or its
+  text). A failure with no response — a network error, or a `@odata.nextLink` the hook refused — has
+  a `message` only. The message itself is unchanged.
+
+  Migration: render `error.message` where you rendered `error`
+  (`{source.error && <p role="alert">{source.error.message}</p>}`), and compare `error?.message`
+  where you compared the string.
+
+- **Date and datetime column filters use `u-date-picker`** for their From and To bounds, like the
+  cell editor since 0.46. The native date inputs they replace showed the browser's UI language
+  (`10/02/2026` in an English browser) while the table shows ISO; the bounds now read and show
+  `YYYY-MM-DD` (`YYYY-MM-DD HH:mm`) everywhere, with a calendar beside each. The bounds are labelled
+  (**From**, **To**), each calendar stops at the other bound, and either bound may still stay empty.
+  A bound now applies when it is committed — Enter, leaving the box, or a day picked in the calendar —
+  rather than on every keystroke. While a calendar is open, Escape closes the calendar and the next
+  Escape closes the filter. Opening the filter from the column menu focuses the From bound.
+
 ## [0.46.0] - 2026-10-05
 
 ### Changed

package/README.md

@@ -50,7 +50,7 @@ npm install @iyulab/flex-table
 - **Range Selection** — Shift+Arrow, Shift+Click for multi-cell selection
 - **Column Selection** — Ctrl+Click header or `selectColumn()` API
 - **Row Selection** — Checkbox-based row selection (`selectable`, single/multi mode)
-- **Clipboard** — Ctrl+C/X/V with TSV format (Excel/Google Sheets compatible, RFC 4180)
+- **Clipboard** — Ctrl+C/X/V with TSV format (Excel/Google Sheets compatible, RFC 4180), through the browser's own copy/cut/paste — no clipboard permission needed
 - **Sorting** — Click header to sort (asc/desc/none), Shift+click for multi-sort
 - **Column Menu** — A 24×24 button in every header opens the column's menu: sort, filter, hide/show, auto-fit, wider/narrower (also opens on header right-click)
 - **Column Resize** — Drag header border, double-click to auto-fit, Alt+Arrow keyboard resize, or the column menu
@@ -208,7 +208,7 @@ hover) always show them, and they are not printed.
 
 ```ts
 { key: 'actions', label: '', width: 72, editable: false, reveal: 'hover',
-  render: (_, row) => html`<u-button size="sm" variant="ghost" aria-label="Edit">…</u-button>` }
+  render: (_, row) => html`<u-button size="sm" appearance="plain" aria-label="Edit">…</u-button>` }
 ```
 
 ### Merging Repeated Values
@@ -334,7 +334,7 @@ All events use `CustomEvent` with `bubbles: true, composed: true`.
 | `clipboard-copy` | `{ range, text }` | Range copied as TSV |
 | `clipboard-cut` | `{ range, text }` | Range cut as TSV |
 | `clipboard-paste` | `{ changes, addedRows }` | Data pasted from clipboard |
-| `clipboard-error` | `{ action, error }` | Clipboard API failed (`action`: `'copy'` or `'paste'`) |
+| `clipboard-error` | `{ action, error }` | The context menu's Copy could not write to the clipboard (`action`: `'copy'`); no `clipboard-copy` follows |
 
 ### State Events
 
@@ -429,13 +429,16 @@ package dependency; CSS custom properties are resolved at render time, not impor
 |-----|--------|
 | Arrow keys | Navigate cells |
 | Tab / Shift+Tab | Move to next/previous cell |
-| Enter / F2 | Start editing |
-| Escape | Cancel edit / clear selection |
+| Enter / F2 | Start editing (Enter on a non-editable cell fires `row-activate`) |
+| Typing a printable character | Start editing an editable cell with that character |
+| Escape | Cancel edit / clear selection / close the find panel |
 | Home / End | Row start/end |
 | Ctrl+Home / Ctrl+End | Table start/end |
-| Shift+Arrow | Extend selection range |
+| Shift+Arrow / Shift+Click | Extend selection range |
 | Ctrl+C / Ctrl+X | Copy/Cut selection as TSV |
 | Ctrl+V | Paste TSV data |
+| Ctrl+D / Ctrl+R | Fill down / fill right |
+| Ctrl+F / Ctrl+H | Find / find and replace |
 | Delete / Backspace | Clear selected cells |
 | Ctrl+Z | Undo |
 | Ctrl+Shift+Z / Ctrl+Y | Redo |
@@ -684,8 +687,13 @@ button is highlighted while its column has an active filter.
 - **text**: case-insensitive substring search
 - **number**: min/max range inputs
 - **boolean**: All / True / False select
-- **date**: from/to date range picker (`<input type="date">`)
-- **datetime**: from/to datetime range picker (`<input type="datetime-local">`)
+- **date**: **From** and **To** `u-date-picker`s (`@iyulab/components`) — the cell editor's control, so the
+  bounds read and show `YYYY-MM-DD` in every browser language, with a calendar beside each. Either
+  bound may stay empty; the end day is inclusive, and each calendar stops at the other bound.
+- **datetime**: the same pickers with a time (`YYYY-MM-DD HH:mm`)
+
+A bound applies when it is committed — Enter, leaving the box, or a day picked in its calendar. While a
+calendar is open, Escape closes the calendar; the next Escape closes the filter.
 
 Filters set via the UI and the programmatic API (`setFilter()`) share the same filter state. Filter dropdowns automatically flip upward when near the viewport bottom.
 
@@ -787,7 +795,7 @@ The hook returns:
 |---|---|
 | `data` / `totalCount` | Current page rows and the server's total (`@odata.count`). When the server pages its response (`@odata.nextLink`, e.g. a page size smaller than `pageSize`), the hook follows the link until the page is filled; a link outside the request's origin, or one that returns to a page already read, is reported through `error` instead of showing a short page |
 | `loading` | A request is in flight |
-| `error` | Message of the last failed request, or `null`. **Render this** — a failed request otherwise leaves the grid silently empty |
+| `error` | The last failed request, or `null`: `{ message, status?, code?, details?, body? }`. **Render `error.message`** — a failed request otherwise leaves the grid silently empty. Branch on `status` (HTTP), `code` (the server's rejection code, OData `error.code`) and `details` (OData `error.details`); `body` is the parsed response (or its text). A failure with no response — a network error, or a `@odata.nextLink` the hook refused — has a `message` only |
 | `page` / `setPage` | Zero-based page index |
 | `sortCriteria` / `onSortChange` | Bind `onSortChange` to the table's `sort-change` event |
 | `search` / `setSearch` | Current search term and its setter (resets to page 0) |

package/dist/array/types.d.ts

@@ -1,4 +1,5 @@
 import type { SortCriteria } from '../core/sorting.js';
+import type { SourceError } from '../core/source-error.js';
 export interface UseArraySourceOptions<T> {
     /** 페이지당 행 수. `useODataSource`와 동일 기본값. */
     pageSize?: number;
@@ -36,7 +37,7 @@ export interface UseArraySourceResult<T> {
     /** 항상 `false` — 로컬 배열은 동기 처리라 로딩 상태가 없다. `useODataSource`와의 반환 형태 동일성을 위해 유지. */
     loading: boolean;
     /** 항상 `null` — 로컬 배열 처리는 실패하지 않는다. 위와 같은 이유로 유지. */
-    error: string | null;
+    error: SourceError | null;
     page: number;
     setPage: (page: number) => void;
     sortCriteria: SortCriteria[];

package/dist/core/source-error.d.ts

@@ -0,0 +1,35 @@
+/** OData v4 오류 봉투의 `error.details` 항목 — 필드별 검증 실패 상세. */
+export interface SourceErrorDetail {
+    code: string;
+    message: string;
+    target?: string;
+}
+/**
+ * 데이터 소스 훅(`useODataSource`/`useArraySource`)의 실패 값.
+ *
+ * 문자열 하나가 아니라 구조로 싣는 이유: 소비자는 «어떤 실패인가» 로 갈라야 한다 — 403 중에서도
+ * 서버가 코드로 구분한 거절(«비밀번호를 바꿔야 한다»), 404(지워진 행), 409(동시성), 429(제한).
+ * 메시지만 남기면 그 정보가 소스 경계에서 사라지고, 소비자는 전송(`fetcher`)을 감싸 상태를
+ * 엿보는 것 말고는 길이 없다.
+ */
+export interface SourceError {
+    /** 보여 줄 문장 — 서버가 준 메시지가 있으면 그것, 없으면 `Request failed (<status>)`. */
+    message: string;
+    /** HTTP 상태. 응답이 없던 실패(네트워크 오류 · `@odata.nextLink` 검사)에는 없다. */
+    status?: number;
+    /** 서버가 정한 거절 코드 — OData 오류 봉투의 `error.code`(또는 최상위 `code`). */
+    code?: string;
+    /** 오류 봉투의 `error.details` 중 `code`·`message` 가 둘 다 문자열인 항목. */
+    details?: SourceErrorDetail[];
+    /** 응답 본문 — JSON 이면 파싱한 값, 아니면 텍스트. 비어 있으면 없다. */
+    body?: unknown;
+}
+/** 실패 응답을 `SourceError` 로 읽는다. 본문을 읽을 수 없어도 상태와 기본 문장은 남긴다. */
+export declare function readFailedResponse(res: Response): Promise<SourceError>;
+/** 실패 응답을 실어 나르는 내부 예외 — `catch` 가 상태를 잃지 않고 `SourceError` 를 꺼낸다. */
+export declare class SourceRequestError extends Error {
+    readonly failure: SourceError;
+    constructor(failure: SourceError);
+}
+/** 잡힌 예외를 `SourceError` 로 — 응답이 있던 실패는 그 구조 그대로, 나머지는 메시지만. */
+export declare function toSourceError(err: unknown): SourceError;

package/dist/{flex-table-DIQhqj12.js → flex-table-B8ehfxqn.js}

@@ -567,6 +567,19 @@ var v = r`
     width: 50%;
   }
 
+  /* Date bounds stack: side by side, half of the dropdown is narrower than a date (and far narrower
+     than a date and a time) plus the calendar button. */
+  .ft-filter-range-dates {
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  .ft-filter-date {
+    display: block;
+    width: 100%;
+    min-width: 0;
+  }
+
   .ft-filter-actions {
     margin-top: 6px;
     text-align: right;
@@ -1842,16 +1855,20 @@ function K(e, t, n, r) {
 }
 //#endregion
 //#region src/flex-table.ts
-var q = {
+var q = [
+	"copy",
+	"cut",
+	"paste"
+], J = {
 	eq: "=",
 	neq: "≠",
 	gt: ">",
 	lt: "<",
 	gte: "≥",
 	lte: "≤"
-}, J = 120, Y = 40, X = 20, Z = 32, Q = 5, qe = 200, $ = class extends n {
+}, Y = 120, X = 40, qe = 20, Je = 32, Z = 5, Ye = 200, Q = class extends n {
 	constructor(...e) {
-		super(...e), this.columns = [], this._data = [], this._inUndoRedo = !1, this.clearUndoOnDataChange = !1, this.clearSelectionOnDataChange = !1, this._rowHeightFromCss = Z, this._targetFloor = 0, 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 ne(), this._editing = new re(), this._rowSelection = new j(), this._undo = new M(), 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._warnedUnconstrained = !1, this._onCommentPopupOutsideClick = () => {
+		super(...e), this.columns = [], this._data = [], this._inUndoRedo = !1, this.clearUndoOnDataChange = !1, this.clearSelectionOnDataChange = !1, this._rowHeightFromCss = Je, this._targetFloor = 0, 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 ne(), this._editing = new re(), this._rowSelection = new j(), this._undo = new M(), 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._warnedUnconstrained = !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();
 	}
@@ -1866,7 +1883,7 @@ var q = {
 		this._data = e, n && !this._inUndoRedo && (this.clearUndoOnDataChange && this._undo.clear(), this.clearSelectionOnDataChange && this._rowSelection.selectedCount > 0 && (this._rowSelection.deselectAll(), this._rowSelectionVersion++, this._dispatchRowSelectionEvent())), this.requestUpdate("data", t);
 	}
 	get rowHeight() {
-		let e = this._rowHeightExplicit ?? this._rowHeightFromCss ?? Z;
+		let e = this._rowHeightExplicit ?? this._rowHeightFromCss ?? Je;
 		return Math.max(e, this._targetFloor);
 	}
 	set rowHeight(e) {
@@ -2391,8 +2408,8 @@ var q = {
 		return this._columnWidths.get(e);
 	}
 	_getColWidth(e) {
-		let t = this._columnWidths.get(e.key) ?? e.width ?? J;
-		return Math.max(t, e.minWidth ?? Y);
+		let t = this._columnWidths.get(e.key) ?? e.width ?? Y;
+		return Math.max(t, e.minWidth ?? X);
 	}
 	get headerHeight() {
 		return this.rowHeight + 8;
@@ -2418,17 +2435,21 @@ var q = {
 		return Math.max(0, this._visibleRowCount - this._frozenRowCount) * this.rowHeight;
 	}
 	get visibleRange() {
-		let e = this._frozenRowCount, t = e + Math.floor(Math.max(0, this._scrollTop) / this.rowHeight), n = Math.max(e, t - Q), r = Math.max(0, this._viewportHeight - this.headerHeight - this.frozenRowsHeight), i = Math.ceil(r / this.rowHeight) + 1;
+		let e = this._frozenRowCount, t = e + Math.floor(Math.max(0, this._scrollTop) / this.rowHeight), n = Math.max(e, t - Z), r = Math.max(0, this._viewportHeight - this.headerHeight - this.frozenRowsHeight), i = Math.ceil(r / this.rowHeight) + 1;
 		return {
 			start: n,
-			end: Math.min(this._visibleRowCount, t + i + Q)
+			end: Math.min(this._visibleRowCount, t + i + Z)
 		};
 	}
 	connectedCallback() {
-		super.connectedCallback(), this._onScroll = this._onScroll.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onDocumentClick = this._onDocumentClick.bind(this), this._onContextMenu = this._onContextMenu.bind(this), this._onDragover = this._onDragover.bind(this), this._onDragleave = this._onDragleave.bind(this), this._onDrop = this._onDrop.bind(this), this.addEventListener("scroll", this._onScroll, { passive: !0 }), this.addEventListener("keydown", this._onKeyDown), this.addEventListener("contextmenu", this._onContextMenu), this.addEventListener("dragover", this._onDragover), this.addEventListener("dragleave", this._onDragleave), this.addEventListener("drop", this._onDrop), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "0"), this.setAttribute("role", "grid"), typeof ResizeObserver < "u" && (this._hostResizeObserver = new ResizeObserver(() => this._measureViewport()), this._hostResizeObserver.observe(this));
+		super.connectedCallback(), this._onScroll = this._onScroll.bind(this), this._onKeyDown = this._onKeyDown.bind(this), this._onDocumentClick = this._onDocumentClick.bind(this), this._onContextMenu = this._onContextMenu.bind(this), this._onDragover = this._onDragover.bind(this), this._onDragleave = this._onDragleave.bind(this), this._onDrop = this._onDrop.bind(this), this._onClipboard = this._onClipboard.bind(this), this.addEventListener("scroll", this._onScroll, { passive: !0 }), this.addEventListener("keydown", this._onKeyDown);
+		for (let e of q) this.addEventListener(e, this._onClipboard);
+		this.addEventListener("contextmenu", this._onContextMenu), this.addEventListener("dragover", this._onDragover), this.addEventListener("dragleave", this._onDragleave), this.addEventListener("drop", this._onDrop), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "0"), this.setAttribute("role", "grid"), typeof ResizeObserver < "u" && (this._hostResizeObserver = new ResizeObserver(() => this._measureViewport()), this._hostResizeObserver.observe(this));
 	}
 	disconnectedCallback() {
-		super.disconnectedCallback(), this.removeEventListener("scroll", this._onScroll), this.removeEventListener("keydown", this._onKeyDown), this.removeEventListener("contextmenu", this._onContextMenu), this.removeEventListener("dragover", this._onDragover), this.removeEventListener("dragleave", this._onDragleave), this.removeEventListener("drop", this._onDrop), document.removeEventListener("click", this._onDocumentClick), document.removeEventListener("mousedown", this._onCommentPopupOutsideClick), this._isDragging = !1, this._wasDrag = !1, this._resizeCleanup &&= (this._resizeCleanup(), null), this._hostResizeObserver &&= (this._hostResizeObserver.disconnect(), null);
+		super.disconnectedCallback(), this.removeEventListener("scroll", this._onScroll), this.removeEventListener("keydown", this._onKeyDown);
+		for (let e of q) this.removeEventListener(e, this._onClipboard);
+		this.removeEventListener("contextmenu", this._onContextMenu), this.removeEventListener("dragover", this._onDragover), this.removeEventListener("dragleave", this._onDragleave), this.removeEventListener("drop", this._onDrop), document.removeEventListener("click", this._onDocumentClick), document.removeEventListener("mousedown", this._onCommentPopupOutsideClick), this._isDragging = !1, this._wasDrag = !1, this._resizeCleanup &&= (this._resizeCleanup(), null), this._hostResizeObserver &&= (this._hostResizeObserver.disconnect(), null);
 	}
 	firstUpdated() {
 		this._readDensityTokens(), this._measureViewport(), this.shadowRoot && Array.isArray(this.shadowRoot.adoptedStyleSheets) && (this._baseStyleSheets = [...this.shadowRoot.adoptedStyleSheets]), this._syncStylesheets();
@@ -2464,13 +2485,13 @@ var q = {
 			i = r;
 			break;
 		}
-		i = Math.max(0, i - Q);
+		i = Math.max(0, i - Z);
 		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 + Q), {
+		return a = Math.min(e.length, a + Z), {
 			start: i,
 			end: a
 		};
@@ -2530,7 +2551,7 @@ var q = {
 		e !== this._viewportHeight && (this._viewportHeight = e), t !== this._viewportWidth && (this._viewportWidth = t), this._warnIfUnconstrained();
 	}
 	_warnIfUnconstrained() {
-		this._warnedUnconstrained || process.env.NODE_ENV === "production" || this._visibleRowCount < qe || this.scrollHeight > this.clientHeight + 1 || (this._warnedUnconstrained = !0, console.warn(`[@iyulab/flex-table] ${this._visibleRowCount} rows but the host has no height constraint — it grew to fit every row, so virtual scrolling is off and all rows are rendered. Give the host a height (e.g. height: 400px, or flex: 1 1 auto with min-height: 0 inside a sized parent) so it becomes the scroll container.`));
+		this._warnedUnconstrained || process.env.NODE_ENV === "production" || this._visibleRowCount < Ye || this.scrollHeight > this.clientHeight + 1 || (this._warnedUnconstrained = !0, console.warn(`[@iyulab/flex-table] ${this._visibleRowCount} rows but the host has no height constraint — it grew to fit every row, so virtual scrolling is off and all rows are rendered. Give the host a height (e.g. height: 400px, or flex: 1 1 auto with min-height: 0 inside a sized parent) so it becomes the scroll container.`));
 	}
 	_onScroll() {
 		this._scrollTop = this.scrollTop, this._scrollLeft = this.scrollLeft;
@@ -2766,7 +2787,7 @@ var q = {
 	_onEditorKeyDown(e) {
 		if (_(e)) return;
 		let t = e.currentTarget;
-		if (!(t?.localName === "u-date-picker" && (e.composedPath().some((e) => e instanceof Element && e.part?.contains("popover")) || e.key === "Escape" && Ye(t)))) {
+		if (!(t?.localName === "u-date-picker" && (e.composedPath().some((e) => e instanceof Element && e.part?.contains("popover")) || e.key === "Escape" && $(t)))) {
 			if (this._autocompleteState && this._autocompleteState.candidates.length > 0) {
 				if (e.key === "ArrowDown") {
 					e.preventDefault(), e.stopPropagation();
@@ -2822,7 +2843,7 @@ var q = {
 		this._activeCell = this._selection.activeCell ? { ...this._selection.activeCell } : null, this._scrollToActiveCell(), this._dispatchSelectionEvent();
 	}
 	_onKeyDown(e) {
-		if (this._editing.current) return;
+		if (this._editing.current || this._openFilterKey && e.composedPath().some((e) => e instanceof Element && e.classList.contains("ft-filter-dropdown"))) return;
 		let t = this.visibleColumns;
 		if ((e.ctrlKey || e.metaKey) && !e.altKey) {
 			let t = e.key.toLowerCase();
@@ -2874,9 +2895,9 @@ var q = {
 		switch (e.key.toLowerCase()) {
 			case "z": return e.preventDefault(), e.shiftKey ? this.redo() : this.undo(), !0;
 			case "y": return e.preventDefault(), this.redo(), !0;
-			case "c": return e.preventDefault(), this._handleCopy(!1), !0;
-			case "x": return e.preventDefault(), this._handleCopy(this.editable), !0;
-			case "v": return e.preventDefault(), this.editable && this._handlePaste(), !0;
+			case "c":
+			case "x":
+			case "v": return !0;
 			case "d": return e.preventDefault(), this.editable && this._handleFillDown(), !0;
 			case "r": return e.preventDefault(), this.editable && this._handleFillRight(), !0;
 			case "f": return e.preventDefault(), this._toggleFindPanel("find"), !0;
@@ -2888,12 +2909,12 @@ var q = {
 		if (!e.altKey || !this._activeCell || e.key !== "ArrowLeft" && e.key !== "ArrowRight") return !1;
 		e.preventDefault();
 		let n = t[this._activeCell.col];
-		return n && this._resizeColumnBy(n.key, e.key === "ArrowRight" ? X : -20), !0;
+		return n && this._resizeColumnBy(n.key, e.key === "ArrowRight" ? qe : -20), !0;
 	}
 	_resizeColumnBy(e, t) {
 		let n = this.visibleColumns.findIndex((t) => t.key === e), r = this.visibleColumns[n];
 		if (!r) return;
-		let i = this._columnWidths.get(r.key) ?? r.width ?? J, a = r.minWidth ?? Y, o = Math.max(a, i + t);
+		let i = this._columnWidths.get(r.key) ?? r.width ?? Y, a = r.minWidth ?? X, o = Math.max(a, i + t);
 		this._columnWidths.set(r.key, o), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-resize", {
 			detail: {
 				key: r.key,
@@ -2919,35 +2940,55 @@ var q = {
 			default: return !1;
 		}
 	}
-	async _handleCopy(e) {
-		let t = this._selection.getEffectiveRange();
-		if (!t) return;
-		let n = this.visibleColumns, r = oe(this._sortedIndices.map((e) => this.data[e]), n, t);
-		try {
-			await navigator.clipboard.writeText(r);
-		} catch (e) {
-			this.dispatchEvent(new CustomEvent("clipboard-error", {
-				detail: {
-					action: "copy",
-					error: e
-				},
-				bubbles: !0,
-				composed: !0
-			}));
+	_selectionTsv() {
+		let e = this._selection.getEffectiveRange();
+		return e ? {
+			range: e,
+			text: oe(this._sortedIndices.map((e) => this.data[e]), this.visibleColumns, e)
+		} : null;
+	}
+	_onClipboard(e) {
+		let t = e.composedPath()[0];
+		if (t instanceof HTMLInputElement || t instanceof HTMLTextAreaElement || t instanceof HTMLElement && t.isContentEditable || !e.clipboardData) return;
+		if (e.type === "paste") {
+			if (!this.editable || !this._activeCell) return;
+			e.preventDefault(), this._pasteText(e.clipboardData.getData("text/plain"));
+			return;
 		}
-		e && this._clearRange(t), this.dispatchEvent(new CustomEvent(e ? "clipboard-cut" : "clipboard-copy", {
+		let n = this._selectionTsv();
+		n && (e.preventDefault(), e.clipboardData.setData("text/plain", n.text), this._afterCopy(n.range, n.text, e.type === "cut" && this.editable));
+	}
+	async _copyFromMenu() {
+		let e = this._selectionTsv();
+		if (e) {
+			try {
+				await navigator.clipboard.writeText(e.text);
+			} catch (e) {
+				this.dispatchEvent(new CustomEvent("clipboard-error", {
+					detail: {
+						action: "copy",
+						error: e
+					},
+					bubbles: !0,
+					composed: !0
+				}));
+				return;
+			}
+			this._afterCopy(e.range, e.text, !1);
+		}
+	}
+	_afterCopy(e, t, n) {
+		n && this._clearRange(e), this.dispatchEvent(new CustomEvent(n ? "clipboard-cut" : "clipboard-copy", {
 			detail: {
-				range: t,
-				text: r
+				range: e,
+				text: t
 			},
 			bubbles: !0,
 			composed: !0
 		}));
 	}
-	async _handlePaste() {
+	_pasteText(e) {
 		if (!this._activeCell) return;
-		let e = await this._readClipboardText();
-		if (e == null) return;
 		let t = h(e);
 		if (t.length === 0) return;
 		let n = this._expandRowsForPaste(this._activeCell.row, t.length), r = this._applyPasteData(this._activeCell, t);
@@ -2975,20 +3016,6 @@ var q = {
 			composed: !0
 		}));
 	}
-	async _readClipboardText() {
-		try {
-			return await navigator.clipboard.readText();
-		} catch (e) {
-			return this.dispatchEvent(new CustomEvent("clipboard-error", {
-				detail: {
-					action: "paste",
-					error: e
-				},
-				bubbles: !0,
-				composed: !0
-			})), null;
-		}
-	}
 	_selectPastedRange(e, t) {
 		let n = Math.max(...t.map((e) => e.length)), r = Math.min(e.row + t.length, this._visibleRowCount) - 1, i = Math.min(e.col + n, this.visibleColumns.length) - 1;
 		(r !== e.row || i !== e.col) && (this._selection.setDimensions(this._visibleRowCount, this.visibleColumns.length), this._selection.setActive(e.row, e.col), this._selection.setActiveWithRange(r, i), this._activeCell = {
@@ -3349,8 +3376,9 @@ var q = {
 	_openFilterFromMenu(e) {
 		this._headerMenu = null, this._openFilterKey = e, requestAnimationFrame(() => {
 			document.addEventListener("click", this._onDocumentClick, { once: !0 });
-		}), this.updateComplete.then(() => {
-			this.shadowRoot?.querySelector(".ft-filter-dropdown input, .ft-filter-dropdown select")?.focus();
+		}), this.updateComplete.then(async () => {
+			let e = this.shadowRoot?.querySelector(".ft-filter-dropdown input, .ft-filter-dropdown select, .ft-filter-dropdown u-date-picker");
+			await e?.updateComplete, e?.focus();
 		});
 	}
 	_showHiddenBefore(e) {
@@ -3386,7 +3414,7 @@ var q = {
         ${r.map((e) => c("show", A("showColumn", { header: e.label }), () => this._setColumnHidden(e.key, !1)))}
         <div class="ft-header-menu-separator" role="separator"></div>
         ${c("autofit", A("autoFitWidth"), () => this._autoFitColumn(e))}
-        ${c("wider", A("wider"), () => this._resizeColumnBy(e, X), !0)}
+        ${c("wider", A("wider"), () => this._resizeColumnBy(e, qe), !0)}
         ${c("narrower", A("narrower"), () => this._resizeColumnBy(e, -20), !0)}
       </div>
     `;
@@ -3409,7 +3437,7 @@ var q = {
         style="position: fixed; left: ${n}px; top: ${r}px; z-index: var(--u-layer-floating, 1000);"
         @mousedown=${(e) => e.stopPropagation()}
         @keydown=${(e) => this._onMenuKeydown(e, ".ft-body-context-menu", l)}>
-        ${d(A("copy"), () => this._handleCopy(!1))}
+        ${d(A("copy"), () => this._copyFromMenu())}
         ${f}
         ${d(A("insertRowAbove"), () => this.addRow(void 0, t))}
         ${d(A("insertRowBelow"), () => this.addRow(void 0, t + 1))}
@@ -3675,7 +3703,7 @@ var q = {
           @keydown=${(e) => {
 			e.key === "Escape" && (this._openFilterKey = null), e.stopPropagation();
 		}}>
-          ${Object.keys(q).map((e) => i`<option value=${e}>${q[e]}</option>`)}
+          ${Object.keys(J).map((e) => i`<option value=${e}>${J[e]}</option>`)}
         </select>
         <input class="ft-filter-input ft-num-cond-input" type="text" inputmode="decimal" placeholder=${A("valuePlaceholder")}
           .value=${n.text ?? (n.value == null ? "" : P(n.value))}
@@ -3737,21 +3765,21 @@ var q = {
 		return n ? n.error : null;
 	}
 	_renderDateFilter(e) {
-		let t = e.type === "datetime" ? "datetime-local" : "date", n = this._dateFilterState.get(e.key) ?? {};
+		let t = e.type === "datetime", n = this._dateFilterState.get(e.key) ?? {}, r = (e) => e?.slice(0, 10), o = (e) => {
+			e.key === "Escape" && $(e.currentTarget) || (e.stopPropagation(), e.key === "Escape" && (this._openFilterKey = null));
+		};
 		return i`
-      <div class="ft-filter-range">
-        <input class="ft-filter-input" type=${t} placeholder=${A("fromPlaceholder")}
-          .value=${n.from ?? ""}
-          @input=${(t) => this._applyDateFilter(e.key, t, "from")}
-          @keydown=${(e) => {
-			e.key === "Escape" && (this._openFilterKey = null), e.stopPropagation();
-		}}>
-        <input class="ft-filter-input" type=${t} placeholder=${A("toPlaceholder")}
-          .value=${n.to ?? ""}
-          @input=${(t) => this._applyDateFilter(e.key, t, "to")}
-          @keydown=${(e) => {
-			e.key === "Escape" && (this._openFilterKey = null), e.stopPropagation();
-		}}>
+      <div class="ft-filter-range ft-filter-range-dates">
+        <u-date-picker class="ft-filter-date" size="sm" clearable
+          mode=${t ? "datetime" : "date"} label=${A("fromPlaceholder")}
+          .value=${n.from ?? ""} max=${r(n.to) ?? a}
+          @change=${(t) => this._applyDateFilter(e.key, t, "from")}
+          @keydown=${o}></u-date-picker>
+        <u-date-picker class="ft-filter-date" size="sm" clearable
+          mode=${t ? "datetime" : "date"} label=${A("toPlaceholder")}
+          .value=${n.to ?? ""} min=${r(n.from) ?? a}
+          @change=${(t) => this._applyDateFilter(e.key, t, "to")}
+          @keydown=${o}></u-date-picker>
       </div>
       ${this._renderEmptyFilterRow(e.key, () => {
 			this._dateFilterState.delete(e.key);
@@ -3759,7 +3787,7 @@ var q = {
     `;
 	}
 	_applyDateFilter(e, t, n) {
-		let r = t.target.value, i = this._dateFilterState.get(e) ?? {};
+		let r = t.target.value ?? "", i = this._dateFilterState.get(e) ?? {};
 		r === "" ? delete i[n] : i[n] = r, this._dateFilterState.set(e, i), this._emptyFilterState.delete(e), this._applyFilterForKey(e);
 	}
 	_renderBooleanFilter(e) {
@@ -3787,7 +3815,7 @@ var q = {
 		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 ?? Y, s = Math.max(o, i + 8);
+		let o = n.minWidth ?? X, s = Math.max(o, i + 8);
 		this._columnWidths.set(n.key, s), this.requestUpdate(), this.dispatchEvent(new CustomEvent("column-resize", {
 			detail: {
 				key: n.key,
@@ -3800,7 +3828,7 @@ var q = {
 	}
 	_onResizeStart(e, t) {
 		e.preventDefault(), e.stopPropagation();
-		let n = this.visibleColumns[t], r = this._columnWidths.get(n.key) ?? n.width ?? J;
+		let n = this.visibleColumns[t], r = this._columnWidths.get(n.key) ?? n.width ?? Y;
 		this._resizing = {
 			colIndex: t,
 			startX: e.clientX,
@@ -3808,13 +3836,13 @@ var q = {
 		};
 		let i = (e) => {
 			if (!this._resizing) return;
-			let t = e.clientX - this._resizing.startX, r = n.minWidth ?? Y, i = Math.max(r, this._resizing.startWidth + t);
+			let t = e.clientX - this._resizing.startX, r = n.minWidth ?? X, 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) ?? J;
+				let e = this._columnWidths.get(n.key) ?? Y;
 				this.dispatchEvent(new CustomEvent("column-resize", {
 					detail: {
 						key: n.key,
@@ -4450,7 +4478,7 @@ var q = {
 			return i`
         <u-date-picker class="ft-editor ft-editor-${t.type}" size="sm"
           mode=${e ? "datetime" : "date"} ?confirm=${e}
-          .value=${Je(n, e)}
+          .value=${Xe(n, e)}
           @keydown=${this._onEditorKeyDown}
           @change=${() => this._commitEdit()}
           @blur=${() => this._commitEdit()}></u-date-picker>
@@ -4497,62 +4525,62 @@ var q = {
     `;
 	}
 };
-K([s({ type: Array })], $.prototype, "columns", void 0), K([s({
+K([s({ type: Array })], Q.prototype, "columns", void 0), K([s({
 	type: Array,
 	hasChanged: () => !0
-})], $.prototype, "data", null), K([s({
+})], Q.prototype, "data", null), K([s({
 	type: Boolean,
 	attribute: "clear-undo-on-data-change"
-})], $.prototype, "clearUndoOnDataChange", void 0), K([s({
+})], Q.prototype, "clearUndoOnDataChange", void 0), K([s({
 	type: Boolean,
 	attribute: "clear-selection-on-data-change"
-})], $.prototype, "clearSelectionOnDataChange", void 0), K([s({
+})], Q.prototype, "clearSelectionOnDataChange", void 0), K([s({
 	type: Number,
 	attribute: "row-height"
-})], $.prototype, "rowHeight", null), K([s({
+})], Q.prototype, "rowHeight", null), K([s({
 	type: Boolean,
 	attribute: "show-row-numbers"
-})], $.prototype, "showRowNumbers", void 0), K([s({
+})], Q.prototype, "showRowNumbers", void 0), K([s({
 	type: String,
 	reflect: !0
-})], $.prototype, "theme", void 0), K([s({
+})], Q.prototype, "theme", void 0), K([s({
 	type: Number,
 	attribute: "max-rows"
-})], $.prototype, "maxRows", void 0), K([s({ type: Boolean })], $.prototype, "editable", void 0), K([s({
+})], Q.prototype, "maxRows", void 0), K([s({ type: Boolean })], Q.prototype, "editable", void 0), K([s({
 	type: Boolean,
 	attribute: "show-filters"
-})], $.prototype, "showFilters", void 0), K([s({
+})], Q.prototype, "showFilters", void 0), K([s({
 	type: Boolean,
 	attribute: "show-context-menu"
-})], $.prototype, "showContextMenu", void 0), K([s({
+})], Q.prototype, "showContextMenu", void 0), K([s({
 	type: Number,
 	attribute: "frozen-rows"
-})], $.prototype, "frozenRows", void 0), K([s({
+})], Q.prototype, "frozenRows", void 0), K([s({
 	type: String,
 	attribute: "empty-message"
-})], $.prototype, "emptyMessage", void 0), K([s({
+})], Q.prototype, "emptyMessage", void 0), K([s({
 	type: String,
 	attribute: "no-matching-message"
-})], $.prototype, "noMatchingMessage", void 0), K([s({
+})], Q.prototype, "noMatchingMessage", void 0), K([s({
 	type: Boolean,
 	reflect: !0
-})], $.prototype, "loading", void 0), K([s({
+})], Q.prototype, "loading", void 0), K([s({
 	type: Boolean,
 	attribute: "import-enabled"
-})], $.prototype, "importEnabled", void 0), K([s({ type: Boolean })], $.prototype, "selectable", void 0), K([s({
+})], Q.prototype, "importEnabled", void 0), K([s({ type: Boolean })], Q.prototype, "selectable", void 0), K([s({
 	type: String,
 	attribute: "selection-mode"
-})], $.prototype, "selectionMode", null), K([s({
+})], Q.prototype, "selectionMode", null), K([s({
 	type: String,
 	attribute: "data-mode"
-})], $.prototype, "dataMode", void 0), K([s({
+})], Q.prototype, "dataMode", void 0), K([s({
 	type: Object,
 	attribute: "footer-data"
-})], $.prototype, "footerData", void 0), K([s({ attribute: !1 })], $.prototype, "stylesheets", void 0), K([s({
+})], Q.prototype, "footerData", void 0), K([s({ attribute: !1 })], Q.prototype, "stylesheets", void 0), K([s({
 	type: Number,
 	attribute: "max-undo-size"
-})], $.prototype, "maxUndoSize", null), K([c()], $.prototype, "_scrollTop", void 0), K([c()], $.prototype, "_scrollLeft", void 0), K([c()], $.prototype, "_viewportHeight", void 0), K([c()], $.prototype, "_viewportWidth", void 0), K([c()], $.prototype, "_activeCell", void 0), K([c()], $.prototype, "_editingCell", void 0), K([c()], $.prototype, "_sortCriteria", void 0), K([c()], $.prototype, "_openFilterKey", void 0), K([c()], $.prototype, "_rowSelectionVersion", void 0), K([c()], $.prototype, "_autocompleteState", void 0), K([c()], $.prototype, "_headerMenu", void 0), K([c()], $.prototype, "_bodyContextMenu", void 0), K([c()], $.prototype, "_commentPopup", void 0), K([c()], $.prototype, "_isDragOver", void 0), $ = K([o("flex-table")], $);
-function Je(e, t) {
+})], Q.prototype, "maxUndoSize", null), K([c()], Q.prototype, "_scrollTop", void 0), K([c()], Q.prototype, "_scrollLeft", void 0), K([c()], Q.prototype, "_viewportHeight", void 0), K([c()], Q.prototype, "_viewportWidth", void 0), K([c()], Q.prototype, "_activeCell", void 0), K([c()], Q.prototype, "_editingCell", void 0), K([c()], Q.prototype, "_sortCriteria", void 0), K([c()], Q.prototype, "_openFilterKey", void 0), K([c()], Q.prototype, "_rowSelectionVersion", void 0), K([c()], Q.prototype, "_autocompleteState", void 0), K([c()], Q.prototype, "_headerMenu", void 0), K([c()], Q.prototype, "_bodyContextMenu", void 0), K([c()], Q.prototype, "_commentPopup", void 0), K([c()], Q.prototype, "_isDragOver", void 0), Q = K([o("flex-table")], Q);
+function Xe(e, t) {
 	if (t) {
 		let t = ce(e);
 		return /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}$/.test(t) ? t.replace(" ", "T") : void 0;
@@ -4560,7 +4588,7 @@ function Je(e, t) {
 	let n = se(e);
 	return /^\d{4}-\d{2}-\d{2}$/.test(n) ? n : void 0;
 }
-function Ye(e) {
+function $(e) {
 	try {
 		return e.matches(":state(open)");
 	} catch {
@@ -4568,4 +4596,4 @@ function Ye(e) {
 	}
 }
 //#endregion
-export { j as a, M as i, G as n, k as o, V as r, C as s, $ as t };
+export { j as a, M as i, G as n, k as o, V as r, C as s, Q as t };

package/dist/flex-table.d.ts

@@ -393,9 +393,20 @@ export declare class FlexTable extends LitElement {
     /** Widen (positive) or narrow (negative) a visible column by `delta` px, never below its minimum. */
     private _resizeColumnBy;
     private _handleNavigation;
-    private _handleCopy;
-    private _handlePaste;
-    private _readClipboardText;
+    /**
+     * The selection as TSV in display (sorted) order, or `null` without a selection.
+     */
+    private _selectionTsv;
+    /**
+     * The browser's copy / cut / paste on the grid. Events from a text field inside the grid (the cell
+     * editor, the find panel, a filter input) are that field's own and pass through untouched.
+     */
+    private _onClipboard;
+    /** The context menu's Copy — no clipboard event to fill, so it goes through the async Clipboard API. */
+    private _copyFromMenu;
+    /** Runs once the text is on the clipboard — only then is a cut range cleared. */
+    private _afterCopy;
+    private _pasteText;
     /**
      * After a paste, the cells it wrote are the selection — as in spreadsheets — so the reader sees
      * what changed and can copy, clear or undo it as one block. The active cell stays where the
@@ -492,6 +503,12 @@ export declare class FlexTable extends LitElement {
     private _numberFilterState;
     private _dateFilterState;
     private _emptyFilterState;
+    /**
+     * From/to bounds as two `u-date-picker`s — the cell editor's control, for the same reason: the native
+     * date inputs show the browser's UI language (`10/02/2026` in an English browser) while the table
+     * shows ISO. Two pickers, not one `u-date-range-picker`: either bound may be left open ("from this
+     * day on"), which a range value cannot say. Each bound's calendar stops at the other bound.
+     */
     private _renderDateFilter;
     private _applyDateFilter;
     private _renderBooleanFilter;

package/dist/flex-table.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, o as r, r as i, s as a, t as o } from "./flex-table-DIQhqj12.js";
+import { a as e, i as t, n, o as r, r as i, s as a, t as o } from "./flex-table-B8ehfxqn.js";
 export { o as FlexTable, e as RowSelectionState, t as UndoStack, n as effectiveAlign, i as exportData, r as flexTableLocale, a as renderCell };

package/dist/odata/types.d.ts

@@ -1,4 +1,5 @@
 import type { SortCriteria } from '../core/sorting.js';
+import type { SourceError } from '../core/source-error.js';
 export interface UseODataSourceOptions {
     pageSize?: number;
     defaultOrderBy?: string;
@@ -43,7 +44,11 @@ export interface UseODataSourceResult<T> {
     data: T[];
     totalCount: number;
     loading: boolean;
-    error: string | null;
+    /**
+     * 마지막 요청의 실패, 없으면 `null`. 화면에는 `error.message` 를 그린다. «어떤 실패인가» 는
+     * `status`(HTTP) · `code`(서버의 거절 코드) · `details` 로 가른다 — 401 은 `onUnauthorized` 도 부른다.
+     */
+    error: SourceError | null;
     page: number;
     setPage: (page: number) => void;
     sortCriteria: SortCriteria[];

package/dist/react.d.ts

@@ -69,3 +69,4 @@ export { useODataSource } from './odata/use-odata-source.js';
 export type { UseODataSourceOptions, UseODataSourceResult } from './odata/types.js';
 export { useArraySource } from './array/use-array-source.js';
 export type { UseArraySourceOptions, UseArraySourceResult } from './array/types.js';
+export type { SourceError, SourceErrorDetail } from './core/source-error.js';

package/dist/react.js

@@ -1,47 +1,74 @@
-import { t as e } from "./flex-table-DIQhqj12.js";
+import { t as e } from "./flex-table-B8ehfxqn.js";
 import { i as t, t as n } from "./query-Dw4iO0ir.js";
 import { t as r } from "./view-DiLr-TdY.js";
 import i, { useCallback as a, useEffect as o, useMemo as s, useRef as c, useState as l } from "react";
 import { createComponent as u } from "@lit/react";
+//#region src/core/source-error.ts
+async function d(e) {
+	let t = await e.text().catch(() => ""), n = {
+		message: `Request failed (${e.status})`,
+		status: e.status
+	};
+	if (!t) return n;
+	let r = t;
+	try {
+		r = JSON.parse(t);
+	} catch {}
+	if (n.body = r, !r || typeof r != "object") return n;
+	let i = r, a = i.error && typeof i.error == "object" ? i.error : i;
+	typeof a.message == "string" && a.message ? n.message = a.message : typeof i.message == "string" && i.message && (n.message = i.message), typeof a.code == "string" && a.code && (n.code = a.code);
+	let o = f(a.details);
+	return o && (n.details = o), n;
+}
+function f(e) {
+	if (!Array.isArray(e)) return;
+	let t = e.filter((e) => {
+		if (!e || typeof e != "object") return !1;
+		let t = e;
+		return typeof t.code == "string" && typeof t.message == "string";
+	});
+	return t.length > 0 ? t : void 0;
+}
+var p = class extends Error {
+	constructor(e) {
+		super(e.message), this.name = "SourceRequestError", this.failure = e;
+	}
+};
+function m(e) {
+	return e instanceof p ? e.failure : e instanceof Error ? { message: e.message } : { message: String(e) };
+}
+//#endregion
 //#region src/odata/use-odata-source.ts
-function d(e, r = {}) {
-	let { pageSize: i = 20, defaultOrderBy: s, initialPage: u = 0, initialSearch: d = "", initialSort: f, fixedFilter: p, baseUrl: m, fetcher: h = fetch, onUnauthorized: g, enabled: _ = !0 } = r, v = p ? JSON.stringify(p) : "", [y, b] = l([]), [x, S] = l(0), [C, w] = l(!1), [T, E] = l(null), D = t({
+function h(e, r = {}) {
+	let { pageSize: i = 20, defaultOrderBy: s, initialPage: u = 0, initialSearch: f = "", initialSort: h, fixedFilter: g, baseUrl: _, fetcher: v = fetch, onUnauthorized: y, enabled: b = !0 } = r, x = g ? JSON.stringify(g) : "", [S, C] = l([]), [w, T] = l(0), [E, D] = l(!1), [O, k] = l(null), A = t({
 		defaultOrderBy: s,
 		initialPage: u,
-		initialSearch: d,
-		initialSort: f
-	}), [O, k] = l(D.page), [A, j] = l(D.sortCriteria), [M, N] = l(D.search), [P, F] = l(0), [I, L] = l(v);
-	v !== I && (L(v), k(0));
-	let R = c(null), z = a(() => {
-		F((e) => e + 1);
-	}, []), B = a((e) => {
-		N(e), k(0);
-	}, []), V = a((e) => {
+		initialSearch: f,
+		initialSort: h
+	}), [j, M] = l(A.page), [N, P] = l(A.sortCriteria), [F, I] = l(A.search), [L, R] = l(0), [z, B] = l(x);
+	x !== z && (B(x), M(0));
+	let V = c(null), H = a(() => {
+		R((e) => e + 1);
+	}, []), U = a((e) => {
+		I(e), M(0);
+	}, []), W = a((e) => {
 		let t = e.detail?.criteria;
-		t && (j(t), k(0));
+		t && (P(t), M(0));
 	}, []);
 	return o(() => {
-		if (R.current?.abort(), !_) return;
+		if (V.current?.abort(), !b) return;
 		let t = new AbortController();
-		R.current = t, w(!0), E(null);
+		V.current = t, D(!0), k(null);
 		let r = n({
-			page: O,
+			page: j,
 			pageSize: i,
-			sortCriteria: A,
+			sortCriteria: N,
 			defaultOrderBy: s,
-			search: M,
-			fixedFilter: p
-		}), a = `${m ?? window.location.origin}${e}${r}`, o = async (e) => {
-			let n = await h(e, { signal: t.signal });
-			if (!n.ok) {
-				n.status === 401 && g && g(n);
-				let e = await n.text().catch(() => ""), t = `Request failed (${n.status})`;
-				try {
-					let n = JSON.parse(e);
-					t = n?.error?.message ?? n?.message ?? t;
-				} catch {}
-				throw Error(t);
-			}
+			search: F,
+			fixedFilter: g
+		}), a = `${_ ?? window.location.origin}${e}${r}`, o = async (e) => {
+			let n = await v(e, { signal: t.signal });
+			if (!n.ok) throw n.status === 401 && y && y(n), new p(await d(n));
 			return n.json();
 		};
 		return (async () => {
@@ -61,42 +88,42 @@ function d(e, r = {}) {
 		})().then(({ count: e, rows: n }) => {
 			if (t.signal.aborted) return;
 			let r = e ?? 0;
-			b(n), S(r), E(null);
+			C(n), T(r), k(null);
 			let a = r === 0 ? 0 : Math.ceil(r / i) - 1;
-			O > a && k(a);
+			j > a && M(a);
 		}).catch((e) => {
-			t.signal.aborted || e.name !== "AbortError" && (E(e.message), b([]), S(0));
+			t.signal.aborted || e.name !== "AbortError" && (k(m(e)), C([]), T(0));
 		}).finally(() => {
-			t.signal.aborted || w(!1);
+			t.signal.aborted || D(!1);
 		}), () => t.abort();
 	}, [
-		_,
+		b,
 		e,
-		O,
+		j,
 		i,
-		A,
-		M,
-		v,
+		N,
+		F,
+		x,
 		s,
-		P,
-		m
+		L,
+		_
 	]), {
-		data: y,
-		totalCount: x,
-		loading: C || !_,
-		error: T,
-		page: O,
-		setPage: k,
-		sortCriteria: A,
-		onSortChange: V,
-		search: M,
-		setSearch: B,
-		refresh: z
+		data: S,
+		totalCount: w,
+		loading: E || !b,
+		error: O,
+		page: j,
+		setPage: M,
+		sortCriteria: N,
+		onSortChange: W,
+		search: F,
+		setSearch: U,
+		refresh: H
 	};
 }
 //#endregion
 //#region src/array/use-array-source.ts
-function f(e, n = {}) {
+function g(e, n = {}) {
 	let { pageSize: i = 20, defaultOrderBy: o, initialPage: c = 0, initialSearch: u = "", initialSort: d, columns: f, searchFields: p } = n, m = t({
 		defaultOrderBy: o,
 		initialPage: c,
@@ -137,7 +164,7 @@ function f(e, n = {}) {
 		refresh: C
 	};
 }
-var p = u({
+var _ = u({
 	tagName: "flex-table",
 	elementClass: e,
 	react: i,
@@ -176,4 +203,4 @@ var p = u({
 	}
 });
 //#endregion
-export { p as FlexTableReact, f as useArraySource, d as useODataSource };
+export { _ as FlexTableReact, g as useArraySource, h as useODataSource };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iyulab/flex-table",
-  "version": "0.46.0",
+  "version": "0.48.0",
   "description": "A minimalist, input-centric data grid web component",
   "type": "module",
   "main": "./dist/flex-table.js",
@@ -45,6 +45,7 @@
     "build": "npm run typecheck && vite build && tsc --emitDeclarationOnly",
     "build:demo": "vite build --config vite.config.demo.ts",
     "typecheck": "tsc --noEmit && tsc -p tsconfig.test.json",
+    "pretest": "node -e \"if(require('fs').existsSync('../../scripts/sibling-dist-check.js'))require('child_process').execFileSync('node',['../../scripts/sibling-dist-check.js'],{stdio:'inherit'})\"",
     "test": "vitest run",
     "test:watch": "vitest",
     "lint": "eslint src/",

package/skills/iyulab-flex-table/SKILL.md

@@ -127,7 +127,7 @@ Server paging from OData or an in-memory array uses the same binding — see `re
 - Styles for elements returned by `render` must be passed through the `stylesheets` property
   (constructable `CSSStyleSheet[]`); document CSS does not cross the shadow boundary.
 - `useODataSource` `fetcher` / `onUnauthorized` must be stable references (`useCallback`).
-- Always render `error` from `useODataSource`; a failed request otherwise leaves the grid empty.
+- Always render `error.message` from `useODataSource`; a failed request otherwise leaves the grid empty. Branch on `error.status` / `error.code` rather than parsing the message.
 
 ## References
 

package/skills/iyulab-flex-table/references/api.md

@@ -159,7 +159,7 @@ All are `CustomEvent`s with `bubbles: true, composed: true`. `row`/`index` are d
 | `selection-change` | `{ selectedIndices, selectedRows }` |
 | `clipboard-copy` / `clipboard-cut` | `{ range, text }` (TSV) |
 | `clipboard-paste` | `{ changes, addedRows }` |
-| `clipboard-error` | `{ action: 'copy' \| 'paste', error }` |
+| `clipboard-error` | `{ action: 'copy', error }` — the context menu's Copy could not write; no `clipboard-copy` follows |
 | `fill-handle-apply` | `{ sourceRange, targetRange, cells }` |
 | `find-replace` | `{ type: 'replace' \| 'replace-all', cells }` |
 | `comment-change` | `{ dataIndex, colKey, text }` |

package/skills/iyulab-flex-table/references/react.md

@@ -73,7 +73,7 @@ function Orders() {
   return (
     <>
       <input value={source.search} onChange={(e) => source.setSearch(e.target.value)} />
-      {source.error && <p role="alert">{source.error}</p>}
+      {source.error && <p role="alert">{source.error.message}</p>}
       <FlexTableReact<Order>
         dataMode="server"
         columns={columns}
@@ -111,7 +111,7 @@ function Orders() {
 |---|---|
 | `data`, `totalCount` | Current page and `@odata.count`; `@odata.nextLink` is followed to fill a page |
 | `loading` | Request in flight |
-| `error` | `string \| null` — render it |
+| `error` | `SourceError \| null` — `{ message, status?, code?, details?, body? }`; render `error.message`, branch on `status` / `code` (OData `error.code`) |
 | `page`, `setPage` | Zero-based |
 | `sortCriteria`, `onSortChange` | Pass `onSortChange` to the table's `sort-change` (resets to page 0) |
 | `search`, `setSearch` | Literal text (resets to page 0) |