@iyulab/flex-table 0.62.0 → 0.63.0

package/dist/flex-table.d.ts

@@ -1,6 +1,7 @@
 import { LitElement, type PropertyValues } from 'lit';
 import '@iyulab/components/dist/components/date-picker/UDatePicker.js';
 import type { ExportFormat } from './export/export.js';
+import type { ImportReport } from './export/import.js';
 import type { CellPosition, CellRange } from './core/selection.js';
 import type { SortCriteria } from './core/sorting.js';
 import type { FilterPredicate } from './core/filtering.js';
@@ -381,14 +382,14 @@ export declare class FlexTable extends LitElement {
      */
     clearComments(): void;
     /**
-     * Import data from an xlsx or csv File.
-     * Dispatches 'data-import' event with { count } on success.
+     * Imports an `.xlsx`, `.csv` or `.tsv` file — the first row is the header, matched to columns by `label` or
+     * `importAliases`, and each cell is read as its column's type. Replaces `data` (undoable) and fires `data-import`.
+     * Returns the report of what came in and what did not (headers no column matched, columns the file lacks, cells
+     * that are not their column's type — those keep their text); `null` for a file type it does not read.
+     * A CSV may be separated by commas or semicolons; a leading byte-order mark is not part of the first header.
      */
-    importFromFile(file: File): Promise<void>;
+    importFromFile(file: File): Promise<ImportReport | null>;
     private _applyImportedSheet;
-    private _applyImportedRows;
-    /** Map header text → column key using exact header match (case-insensitive fallback). */
-    private _buildHeaderColumnMap;
     private _onDragover;
     private _onDragleave;
     private _onDrop;

package/dist/flex-table.js

@@ -1,3 +1,4 @@
-import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./flex-table-CbBVOhRQ.js";
-import { t as c } from "./locale-D9g0ksXq.js";
-export { s as FlexTable, o as RowSelectionState, i as UndoStack, a as downloadBlob, r as effectiveAlign, n as exportData, e as exportDataBlob, c as flexTableLocale, t as renderCell };
+import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./flex-table-BufHlQ2v.js";
+import { t as c } from "./locale-Covm8PfH.js";
+import { i as l, r as u } from "./sorting-BJszwEHw.js";
+export { s as FlexTable, o as RowSelectionState, i as UndoStack, a as downloadBlob, r as effectiveAlign, n as exportData, e as exportDataBlob, c as flexTableLocale, u as getCellValue, t as renderCell, l as setCellValue };

package/dist/index.d.ts

@@ -2,6 +2,7 @@ export { FlexTable } from './flex-table.js';
 export type { TableExportOptions } from './flex-table.js';
 export type { ColumnDefinition, ColumnType, ColumnAlign, DataRow, CellRenderer, CellEditor, CellValidator, SelectionMode, DataMode, CellStyle, ConditionalRule } from './models/types.js';
 export { effectiveAlign } from './models/types.js';
+export { getCellValue, setCellValue } from './core/cell-value.js';
 export type { CellPosition, CellRange } from './core/selection.js';
 export type { FlexTableEventMap, CellChange } from './events.js';
 export type { SortCriteria, SortDirection } from './core/sorting.js';
@@ -11,6 +12,7 @@ export { UndoStack } from './core/undo.js';
 export type { UndoAction } from './core/undo.js';
 export type { ExportFormat, ExportOptions } from './export/export.js';
 export { exportData, exportDataBlob, downloadBlob } from './export/export.js';
+export type { ImportReport } from './export/import.js';
 export { renderCell } from './renderers/cell-renderer.js';
 export { flexTableLocale } from './locale.js';
 export type { FlexTableMessageKey } from './locale.js';

package/dist/{locale-D9g0ksXq.js → locale-Covm8PfH.js}

@@ -66,6 +66,8 @@ t.register("en", {
 	deleteComment: "Delete Comment",
 	booleanTrue: "True",
 	booleanFalse: "False",
+	booleanTrueWords: "yes,y",
+	booleanFalseWords: "no,n",
 	dropFileToImport: "Drop file to import (.xlsx / .csv)",
 	notANumber: "Enter a number",
 	notADate: "Enter a date as YYYY-MM-DD",
@@ -139,6 +141,8 @@ t.register("en", {
 	deleteComment: "메모 삭제",
 	booleanTrue: "참",
 	booleanFalse: "거짓",
+	booleanTrueWords: "예,네,yes,y",
+	booleanFalseWords: "아니오,아니요,no,n",
 	dropFileToImport: "가져올 파일을 놓으세요 (.xlsx / .csv)",
 	notANumber: "숫자를 입력하세요",
 	notADate: "날짜를 YYYY-MM-DD 로 입력하세요",

package/dist/locale.d.ts

@@ -25,7 +25,7 @@
  *   (아이콘 자리의 글리프)는 어느 로케일에서도 같은 것을 뜻하며, 번역하면 오히려 읽히지 않는다.
  *   그 판단은 «번역하지 않기로 한 것»이지 «빠뜨린 것»이 아니다.
  */
-export type FlexTableMessageKey = 'showHiddenColumns' | 'columnMenu' | 'cellActions' | 'noColumnsDefined' | 'addCommentPlaceholder' | 'cancel' | 'save' | 'noData' | 'noMatchingData' | 'clear' | 'blankCells' | 'emptyOnly' | 'nonEmptyOnly' | 'blankAll' | 'all' | 'contains' | 'startsWith' | 'endsWith' | 'wildcard' | 'searchPlaceholder' | 'valuePlaceholder' | 'fromPlaceholder' | 'toPlaceholder' | 'findPlaceholder' | 'findPrevious' | 'findNext' | 'matchCase' | 'wholeCell' | 'closeFind' | 'findNoResults' | 'replaceWithPlaceholder' | 'replace' | 'replaceAll' | 'findInput' | 'replaceInput' | 'filterFor' | 'filterMatchMode' | 'filterText' | 'conditionOperator' | 'conditionValue' | 'conditionJoin' | 'sortAscending' | 'sortDescending' | 'filter' | 'clearFilter' | 'hideColumn' | 'showColumn' | 'autoFitWidth' | 'wider' | 'narrower' | 'columnMenuFor' | 'columnMenuRegion' | 'copy' | 'insertRowAbove' | 'insertRowBelow' | 'deleteRow' | 'selectRow' | 'selectAllRows' | 'filterByThisValue' | 'addComment' | 'editComment' | 'deleteComment' | 'booleanTrue' | 'booleanFalse' | 'dropFileToImport' | 'notANumber' | 'notADate' | 'notADateTime' | 'notInList' | 'requestFailed' | 'networkFailed' | 'tooManyRows';
+export type FlexTableMessageKey = 'showHiddenColumns' | 'columnMenu' | 'cellActions' | 'noColumnsDefined' | 'addCommentPlaceholder' | 'cancel' | 'save' | 'noData' | 'noMatchingData' | 'clear' | 'blankCells' | 'emptyOnly' | 'nonEmptyOnly' | 'blankAll' | 'all' | 'contains' | 'startsWith' | 'endsWith' | 'wildcard' | 'searchPlaceholder' | 'valuePlaceholder' | 'fromPlaceholder' | 'toPlaceholder' | 'findPlaceholder' | 'findPrevious' | 'findNext' | 'matchCase' | 'wholeCell' | 'closeFind' | 'findNoResults' | 'replaceWithPlaceholder' | 'replace' | 'replaceAll' | 'findInput' | 'replaceInput' | 'filterFor' | 'filterMatchMode' | 'filterText' | 'conditionOperator' | 'conditionValue' | 'conditionJoin' | 'sortAscending' | 'sortDescending' | 'filter' | 'clearFilter' | 'hideColumn' | 'showColumn' | 'autoFitWidth' | 'wider' | 'narrower' | 'columnMenuFor' | 'columnMenuRegion' | 'copy' | 'insertRowAbove' | 'insertRowBelow' | 'deleteRow' | 'selectRow' | 'selectAllRows' | 'filterByThisValue' | 'addComment' | 'editComment' | 'deleteComment' | 'booleanTrue' | 'booleanFalse' | 'booleanTrueWords' | 'booleanFalseWords' | 'dropFileToImport' | 'notANumber' | 'notADate' | 'notADateTime' | 'notInList' | 'requestFailed' | 'networkFailed' | 'tooManyRows';
 /** 이 패키지의 chrome 문자열 묶음. 소비자가 `register()` 로 언어를 더하거나 문구를 덮을 수 있다. */
 export declare const flexTableLocale: import("@iyulab/components/dist/utilities/Locale.js").LocaleNamespace<FlexTableMessageKey>;
 /** 짧은 조회 별칭 — 렌더 코드가 읽히게 유지한다. */

package/dist/models/types.d.ts

@@ -108,6 +108,11 @@ export interface ColumnDefinition<T = DataRow> {
      * code shown as a label: `exportValue: (v) => statusLabel(v)`. A returned `Date` becomes a date cell in XLSX.
      */
     exportValue?: (value: unknown, row: T) => string | number | boolean | Date | null | undefined;
+    /**
+     * Other headers an imported file may give this column (`importFromFile`) — a template a person made says
+     * «관리 번호» where the label is «관리번호». Matched like the label: exactly, then ignoring case and surrounding spaces.
+     */
+    importAliases?: string[];
     /** Per-column conditional formatting rules applied during cell rendering */
     conditionalRules?: ConditionalRule<T>[];
     /**

package/dist/odata/index.js

@@ -1,5 +1,5 @@
-import { c as e, l as t, n, r, s as i, t as a } from "../fetch-all-J37bOtgc.js";
-import { t as o } from "../source-DNPtWmC3.js";
+import { c as e, l as t, n, r, s as i, t as a } from "../fetch-all-DkdNzWrF.js";
+import { t as o } from "../source-dm6qXFh1.js";
 //#region src/odata/controller.ts
 var s = class {
 	constructor(e, t, n = {}) {

package/dist/odata/query.d.ts

@@ -65,7 +65,13 @@ export interface ODataQueryState {
     search?: string;
     /** odata-query 의 필터 객체(`{ IsActive: true }` 등). */
     fixedFilter?: Record<string, unknown>;
+    /** `$expand` — 문자열(`'Customer($select=Name)'`) 또는 배열(쉼표로 잇는다). */
+    expand?: string | string[];
+    /** `$select` — 받을 속성 이름. */
+    select?: string[];
 }
+/** 열 키(점 경로 `Customer.Name`)를 `$orderby` 의 속성 경로(`Customer/Name`)로. */
+export declare function orderByPath(key: string): string;
 /**
  * 표 상태를 OData 쿼리 문자열(`?$top=…&$skip=…&$count=true…`)로 만든다.
  *

package/dist/odata/source.d.ts

@@ -19,6 +19,13 @@ export interface ODataSourceOptions {
     initialSort?: SortCriteria[];
     /** 고정 필터. 값(직렬화)이 바뀌면 페이지가 첫 장으로 돌아간다 — 참조만 다른 같은 값은 아무 일도 없다. */
     fixedFilter?: Record<string, unknown>;
+    /**
+     * `$expand` — 참조(navigation)를 함께 받는다: `'Customer($select=Name),Owner'` 또는 `['Customer', 'Owner']`. 열은 점 경로
+     * 키(`Customer.Name`)로 그 값을 읽고, 그 열의 서버 정렬은 `$orderby=Customer/Name` 이 된다. 페이지 읽기와 `fetchAll` 이 같은 값을 낸다.
+     */
+    expand?: string | string[];
+    /** `$select` — 받을 속성 이름. 생략하면 `$select` 없이 전부. */
+    select?: string[];
     /** 기본값: `window.location.origin`. 프록시/BFF 등 다른 origin 으로 요청해야 할 때 지정. */
     baseUrl?: string;
     /** 커스텀 fetch transport(예: 인증 헤더를 주입하는 `HttpClient` 래퍼). 기본값: 전역 `fetch`. */

package/dist/react.js

@@ -1,7 +1,7 @@
-import { t as e } from "./flex-table-CbBVOhRQ.js";
-import { n as t, r as n, u as r } from "./fetch-all-J37bOtgc.js";
-import { t as i } from "./source-DNPtWmC3.js";
-import { n as a, t as o } from "./view-BtoXdUGF.js";
+import { t as e } from "./flex-table-BufHlQ2v.js";
+import { n as t, r as n, u as r } from "./fetch-all-DkdNzWrF.js";
+import { t as i } from "./source-dm6qXFh1.js";
+import { n as a, t as o } from "./view-DuDIMoXV.js";
 import s, { useCallback as c, useEffect as l, useMemo as u, useState as d, useSyncExternalStore as f } from "react";
 import { createComponent as p } from "@lit/react";
 //#region src/odata/use-odata-source.ts

package/dist/sorting-BJszwEHw.js

@@ -0,0 +1,75 @@
+//#region src/core/cell-value.ts
+function e(e, t) {
+	if (e == null) return;
+	if (t in e || !t.includes(".")) return e[t];
+	let n = e;
+	for (let e of t.split(".")) {
+		if (typeof n != "object" || !n) return;
+		n = n[e];
+	}
+	return n;
+}
+function t(e, t, n) {
+	if (t in e || !t.includes(".")) {
+		e[t] = n;
+		return;
+	}
+	let r = t.split("."), i = e;
+	for (let e of r.slice(0, -1)) {
+		let t = i[e];
+		(typeof t != "object" || !t) && (i[e] = {}), i = i[e];
+	}
+	i[r[r.length - 1]] = n;
+}
+//#endregion
+//#region src/core/sorting.ts
+function n(t, n, i) {
+	let a = Array.from({ length: t.length }, (e, t) => t);
+	if (n.length === 0) return a;
+	let o = /* @__PURE__ */ new Map();
+	for (let e of i) o.set(e.key, e.type ?? "text");
+	return a.sort((i, a) => {
+		for (let { key: s, direction: c } of n) {
+			let n = e(t[i], s), l = e(t[a], s), u = n == null, d = l == null;
+			if (u && d) continue;
+			if (u) return 1;
+			if (d) return -1;
+			let f = r(n, l, o.get(s) ?? "text");
+			if (f !== 0) return c === "asc" ? f : -f;
+		}
+		return i - a;
+	}), a;
+}
+function r(e, t, n) {
+	switch (n) {
+		case "number": {
+			let n = Number(e), r = Number(t);
+			return isNaN(n) && isNaN(r) ? 0 : isNaN(n) ? 1 : isNaN(r) ? -1 : n - r;
+		}
+		case "boolean": return !!e - +!!t;
+		case "date":
+		case "datetime": {
+			let n = new Date(e).getTime(), r = new Date(t).getTime();
+			return (isNaN(n) ? 0 : n) - (isNaN(r) ? 0 : r);
+		}
+		default: return String(e).localeCompare(String(t));
+	}
+}
+function i(e, t, n) {
+	let r = e.find((e) => e.key === t);
+	return n ? r ? r.direction === "asc" ? e.map((e) => e.key === t ? {
+		...e,
+		direction: "desc"
+	} : e) : e.filter((e) => e.key !== t) : [...e, {
+		key: t,
+		direction: "asc"
+	}] : r ? r.direction === "asc" ? [{
+		key: t,
+		direction: "desc"
+	}] : [] : [{
+		key: t,
+		direction: "asc"
+	}];
+}
+//#endregion
+export { t as i, i as n, e as r, n as t };

package/dist/{source-DNPtWmC3.js → source-dm6qXFh1.js}

@@ -1,4 +1,4 @@
-import { a as e, i as t, n, o as r, r as i, s as a, t as o, u as s } from "./fetch-all-J37bOtgc.js";
+import { a as e, i as t, n, o as r, r as i, s as a, t as o, u as s } from "./fetch-all-DkdNzWrF.js";
 //#region src/odata/source.ts
 function c(e, t = {}) {
 	let i = e, c = t, d = u(t.fixedFilter), f = s({
@@ -48,6 +48,8 @@ function c(e, t = {}) {
 			b(),
 			c.defaultOrderBy,
 			d,
+			c.expand,
+			c.select,
 			p.page,
 			p.sortCriteria,
 			p.search
@@ -82,7 +84,9 @@ function c(e, t = {}) {
 			sortCriteria: n,
 			defaultOrderBy: c.defaultOrderBy,
 			search: o,
-			fixedFilter: c.fixedFilter
+			fixedFilter: c.fixedFilter,
+			expand: c.expand,
+			select: c.select
 		});
 		l(`${c.baseUrl ?? window.location.origin}${i}${f}`, {
 			fetcher: u,
@@ -147,7 +151,9 @@ function c(e, t = {}) {
 				sortCriteria: s,
 				defaultOrderBy: c.defaultOrderBy,
 				search: u,
-				fixedFilter: c.fixedFilter
+				fixedFilter: c.fixedFilter,
+				expand: c.expand,
+				select: c.select
 			}), { rows: f } = await l(`${c.baseUrl ?? window.location.origin}${i}${d}`, {
 				fetcher: c.fetcher ?? fetch,
 				signal: t,

package/dist/{view-BtoXdUGF.js → view-DuDIMoXV.js}

@@ -1,5 +1,5 @@
-import { t as e } from "./sorting-CjfjRxwL.js";
-import { n as t, t as n } from "./fetch-all-J37bOtgc.js";
+import { t as e } from "./sorting-BJszwEHw.js";
+import { n as t, t as n } from "./fetch-all-DkdNzWrF.js";
 //#region src/array/view.ts
 function r(t, { search: n, sortCriteria: r, page: i, pageSize: a, columns: o, searchFields: s }) {
 	let c = n.trim().toLowerCase(), l = c ? t.filter((e) => (s ? s(e) : Object.values(e)).some((e) => e != null && String(e).toLowerCase().includes(c))) : t, u = l;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iyulab/flex-table",
-  "version": "0.62.0",
+  "version": "0.63.0",
   "description": "A minimalist, input-centric data grid web component",
   "type": "module",
   "main": "./dist/flex-table.js",
@@ -74,7 +74,7 @@
     "odata-query": "^8.1.0"
   },
   "peerDependencies": {
-    "@iyulab/components": ">=2.15.0",
+    "@iyulab/components": ">=2.18.0",
     "@lit/react": "^1.0.8",
     "react": "^18.0.0 || ^19.0.0"
   },

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

@@ -50,7 +50,7 @@ Replacing `data` with the same array reference does not trigger the clear-on-cha
 
 | Field | Type | Notes |
 |---|---|---|
-| `key` | `string` | Property name in the row (required) |
+| `key` | `string` | Property name in the row, or a dot path into a nested record (`'Customer.Name'`) — display, sort, filter, copy, edit, import and export all read it the same way; a property named by the whole key (`'@odata.etag'`) wins over the path (required) |
 | `label` | `string` | Header text (required) |
 | `type` | `ColumnType` | `'text' \| 'number' \| 'boolean' \| 'date' \| 'datetime' \| 'select'`; other strings act as text |
 | `width` / `minWidth` | `number` | px; `minWidth` defaults to 40 |
@@ -130,7 +130,7 @@ Enter/Escape and blur-to-commit behavior.
 | `undo()` / `redo()` / `clearUndoHistory()` | |
 | `setComment(dataIndex, colKey, text)` | `null` or `''` removes; undoable |
 | `getComment(dataIndex, colKey)` / `clearComments()` | |
-| `importFromFile(file)` | `Promise<void>`; `.xlsx`, `.csv`, `.tsv`; fires `data-import` |
+| `importFromFile(file)` | `Promise<ImportReport \| null>`; `.xlsx`, `.csv` (comma or semicolon), `.tsv`; headers match `label` or `importAliases`; fires `data-import` with the same report — `{ count, unmatchedHeaders, missingColumns, coercionFailures }`; a cell that is not its column's type keeps its text and is reported (an unread boolean is not `false`) |
 | `exportToString(format, { selectionOnly? } \| { rows })` | `string \| Uint8Array`; format `'csv' \| 'tsv' \| 'json' \| 'xlsx'` (xlsx returns uncompressed bytes — synchronous). `rows`: export these rows with the visible columns |
 | `exportToBlob(format, options?)` | `Promise<Blob>` typed with the format's MIME; xlsx is DEFLATE-compressed |
 | `exportToFile(format, filename?, options?)` | `Promise<void>` — triggers a download (xlsx compressed); CSV/TSV start with a UTF-8 BOM unless `{ bom: false }` |
@@ -176,7 +176,7 @@ cast, and the React `on*` props carry the same types.
 | `fill-handle-apply` | `{ sourceRange, targetRange, cells }` |
 | `find-replace` | `{ type: 'replace' \| 'replace-all', cells }` |
 | `comment-change` | `{ dataIndex, id, colKey, text }` |
-| `data-import` | `{ count }` |
+| `data-import` | `ImportReport` — `{ count, unmatchedHeaders, missingColumns, coercionFailures }` |
 | `undo-state-change` | `{ canUndo, canRedo }` |
 | `context-menu` | `{ x, y, row, col, key, value, rowData }` — cancelable; `preventDefault()` suppresses the built-in menu |
 | `header-context-menu` | `{ key, label, x, y }` |

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

@@ -97,6 +97,8 @@ function Orders() {
 | `initialSearch` | `''` | First render only |
 | `initialSort` | — | `SortCriteria[]`; overrides `defaultOrderBy`; `[]` means no sort |
 | `fixedFilter` | — | odata-query filter object, always applied; value change resets to page 0 (compared by value) |
+| `expand` | — | `$expand` string or array; columns read it with dot-path keys (`'Customer.Name'` → server sort `Customer/Name`); `fetchAll` sends it too |
+| `select` | — | `$select` property names |
 | `baseUrl` | `window.location.origin` | For proxy/BFF setups |
 | `fetcher` | global `fetch` | `(input, init) => Promise<Response>`; read when each request starts |
 | `onUnauthorized` | — | `(response) => void` on 401 only (403 surfaces as `error`); read when each request starts |

package/dist/sorting-CjfjRxwL.js

@@ -1,51 +0,0 @@
-//#region src/core/sorting.ts
-function e(e, n, r) {
-	let i = Array.from({ length: e.length }, (e, t) => t);
-	if (n.length === 0) return i;
-	let a = /* @__PURE__ */ new Map();
-	for (let e of r) a.set(e.key, e.type ?? "text");
-	return i.sort((r, i) => {
-		for (let { key: o, direction: s } of n) {
-			let n = e[r][o], c = e[i][o], l = n == null, u = c == null;
-			if (l && u) continue;
-			if (l) return 1;
-			if (u) return -1;
-			let d = t(n, c, a.get(o) ?? "text");
-			if (d !== 0) return s === "asc" ? d : -d;
-		}
-		return r - i;
-	}), i;
-}
-function t(e, t, n) {
-	switch (n) {
-		case "number": {
-			let n = Number(e), r = Number(t);
-			return isNaN(n) && isNaN(r) ? 0 : isNaN(n) ? 1 : isNaN(r) ? -1 : n - r;
-		}
-		case "boolean": return !!e - +!!t;
-		case "date":
-		case "datetime": {
-			let n = new Date(e).getTime(), r = new Date(t).getTime();
-			return (isNaN(n) ? 0 : n) - (isNaN(r) ? 0 : r);
-		}
-		default: return String(e).localeCompare(String(t));
-	}
-}
-function n(e, t, n) {
-	let r = e.find((e) => e.key === t);
-	return n ? r ? r.direction === "asc" ? e.map((e) => e.key === t ? {
-		...e,
-		direction: "desc"
-	} : e) : e.filter((e) => e.key !== t) : [...e, {
-		key: t,
-		direction: "asc"
-	}] : r ? r.direction === "asc" ? [{
-		key: t,
-		direction: "desc"
-	}] : [] : [{
-		key: t,
-		direction: "asc"
-	}];
-}
-//#endregion
-export { n, e as t };