comins-table 0.2.0 → 0.2.2
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 +50 -0
- package/README.md +43 -339
- package/THIRD_PARTY_NOTICES.md +4 -0
- package/dist/{clipboard-CNrbmDue.js → clipboard-B_gA5e12.js} +5 -5
- package/dist/clipboard-B_gA5e12.js.map +1 -0
- package/dist/clipboard.js +2 -2
- package/dist/column-filter.d.ts +6 -1
- package/dist/column-filter.d.ts.map +1 -1
- package/dist/core/editing/export-structure.d.ts +6 -0
- package/dist/core/editing/export-structure.d.ts.map +1 -0
- package/dist/core/editing/export.d.ts +2 -2
- package/dist/core/editing/export.d.ts.map +1 -1
- package/dist/core/editing/import.d.ts +4 -0
- package/dist/core/editing/import.d.ts.map +1 -0
- package/dist/core/editing/xlsx-data.d.ts +12 -0
- package/dist/core/editing/xlsx-data.d.ts.map +1 -0
- package/dist/core/editing/xlsx-model.d.ts +103 -0
- package/dist/core/editing/xlsx-model.d.ts.map +1 -0
- package/dist/core/model.d.ts +2 -0
- package/dist/core/model.d.ts.map +1 -1
- package/dist/core/rows/filter-value.d.ts +12 -0
- package/dist/core/rows/filter-value.d.ts.map +1 -0
- package/dist/core/rows/filtering.d.ts +27 -7
- package/dist/core/rows/filtering.d.ts.map +1 -1
- package/dist/core/rows/values-filter.d.ts +46 -0
- package/dist/core/rows/values-filter.d.ts.map +1 -0
- package/dist/core/state/reconcile.d.ts.map +1 -1
- package/dist/{core-compat-B4I2OHGY.js → core-compat-BO-JJudO.js} +5 -3
- package/dist/core-compat-BO-JJudO.js.map +1 -0
- package/dist/core.d.ts +8 -1
- package/dist/core.d.ts.map +1 -1
- package/dist/core.js +3 -3
- package/dist/engine-iWefk5Rv.js +146 -0
- package/dist/engine-iWefk5Rv.js.map +1 -0
- package/dist/export-B_Q9_Whp.js +184 -0
- package/dist/export-B_Q9_Whp.js.map +1 -0
- package/dist/filtering.d.ts +23 -25
- package/dist/filtering.d.ts.map +1 -1
- package/dist/grouping.d.ts +8 -0
- package/dist/grouping.d.ts.map +1 -1
- package/dist/index.d.ts +44 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2620 -2230
- package/dist/index.js.map +1 -1
- package/dist/model.d.ts +30 -0
- package/dist/model.d.ts.map +1 -1
- package/dist/react/cell-tooltip.d.ts +20 -0
- package/dist/react/cell-tooltip.d.ts.map +1 -0
- package/dist/react/state.d.ts +1 -1
- package/dist/react/state.d.ts.map +1 -1
- package/dist/react/table-transfer.d.ts +4 -0
- package/dist/react/table-transfer.d.ts.map +1 -1
- package/dist/react/value-filter-types.d.ts +79 -0
- package/dist/react/value-filter-types.d.ts.map +1 -0
- package/dist/react/value-filter.d.ts +897 -0
- package/dist/react/value-filter.d.ts.map +1 -0
- package/dist/react-types.d.ts +10 -1
- package/dist/react-types.d.ts.map +1 -1
- package/dist/selection.js +1 -1
- package/dist/summary.d.ts +9 -0
- package/dist/summary.d.ts.map +1 -1
- package/dist/values-filter-pFAPWz1Q.js +497 -0
- package/dist/values-filter-pFAPWz1Q.js.map +1 -0
- package/dist/workbook-C7MXhUjt.js +349 -0
- package/dist/workbook-C7MXhUjt.js.map +1 -0
- package/dist/xlsx/engine.d.ts +5 -0
- package/dist/xlsx/engine.d.ts.map +1 -0
- package/dist/xlsx/errors.d.ts +12 -0
- package/dist/xlsx/errors.d.ts.map +1 -0
- package/dist/xlsx/export.d.ts +3 -0
- package/dist/xlsx/export.d.ts.map +1 -0
- package/dist/xlsx/styles.d.ts +37 -0
- package/dist/xlsx/styles.d.ts.map +1 -0
- package/dist/xlsx/text.d.ts +7 -0
- package/dist/xlsx/text.d.ts.map +1 -0
- package/dist/xlsx/workbook.d.ts +32 -0
- package/dist/xlsx/workbook.d.ts.map +1 -0
- package/dist/xlsx/xml.d.ts +14 -0
- package/dist/xlsx/xml.d.ts.map +1 -0
- package/dist/xlsx/zip.d.ts +9 -0
- package/dist/xlsx/zip.d.ts.map +1 -0
- package/dist/xlsx.d.ts +7 -0
- package/dist/xlsx.d.ts.map +1 -0
- package/dist/xlsx.js +39 -0
- package/dist/xlsx.js.map +1 -0
- package/dist/zip-Oz81THHH.js +62 -0
- package/dist/zip-Oz81THHH.js.map +1 -0
- package/package.json +19 -11
- package/styles.css +53 -0
- package/dist/clipboard-CNrbmDue.js.map +0 -1
- package/dist/core-compat-B4I2OHGY.js.map +0 -1
- package/dist/export-Cfk5Jz4a.js +0 -37
- package/dist/export-Cfk5Jz4a.js.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,55 @@
|
|
|
1
1
|
# Comins Table
|
|
2
2
|
|
|
3
|
+
## 0.2.2 - 2026-10-13
|
|
4
|
+
|
|
5
|
+
- Playground: display complete remote-loading responses and CSV/XLSX datasets, start file examples with 1000 rows, and reset article scrolling on page navigation.
|
|
6
|
+
|
|
7
|
+
- Add framework-neutral Excel Export styles: a default Comins theme, plain mode and header/body/column overrides for fonts, colors, borders, alignment, widths and number formats.
|
|
8
|
+
- Replace the XML parser and Export engine while preserving typed Import, literal text and byte-only package boundaries.
|
|
9
|
+
|
|
10
|
+
- Add `comins-table/xlsx` byte APIs for typed ordinary-row import/export, cached formula results and formatted dates.
|
|
11
|
+
- Validate actual inflated ZIP bytes/CRC, visible sheet selection and atomic mapping; add Worker-based Playground with cancellation and full virtualized datasets.
|
|
12
|
+
|
|
13
|
+
### Value list filtering
|
|
14
|
+
|
|
15
|
+
- Add framework-neutral value-list filtering, search-scoped selection, other-column facet counts and JSON-compatible controlled models.
|
|
16
|
+
- Add React filter trigger/option/panel render and class/style customization with native/custom control bindings.
|
|
17
|
+
- Preserve condition filtering, explicit empty selections and selected values missing from refreshed data; provide bilingual guides and Playground examples.
|
|
18
|
+
|
|
19
|
+
### Rendering customization
|
|
20
|
+
|
|
21
|
+
### Added
|
|
22
|
+
|
|
23
|
+
- Standard `render` paths for cell/header content, row details, group labels/content, Tree slots, transfer rejection tooltips, loading and empty content. Legacy APIs retain their 0.x behavior; removal targets 1.0.0.
|
|
24
|
+
- Summary `render` after aggregation and formatting, with original `value` and `formattedValue` payloads.
|
|
25
|
+
- Informational custom cell tooltips via `cell.tooltip.render`, including hover/focus, Escape and virtualization cleanup. Existing native string tooltips remain compatible.
|
|
26
|
+
|
|
27
|
+
### Changed
|
|
28
|
+
|
|
29
|
+
- Playground examples use standard rendering paths. English and Korean 0.2.2 migration guides document precedence, return values and content boundaries.
|
|
30
|
+
|
|
31
|
+
### Fixed
|
|
32
|
+
|
|
33
|
+
- The Playground Context Menu opener keeps its menu inside the viewport when the button is near the bottom edge.
|
|
34
|
+
|
|
35
|
+
## 0.2.1 - 2026-10-04
|
|
36
|
+
|
|
37
|
+
### Fixed
|
|
38
|
+
|
|
39
|
+
- Tree slot controls now isolate copy and paste events, preserving control clipboard content and preventing unintended edits to table cells.
|
|
40
|
+
- React selection callbacks now report selection cleared by input changes, including Tree collapse and external row replacement. Already empty selections retain their identity to avoid duplicate notifications.
|
|
41
|
+
|
|
42
|
+
### Added
|
|
43
|
+
|
|
44
|
+
- Tree/Group Export preparation helpers and opt-in `__rowId`, `__parentId`, `__depth`, `__groupId` management columns for CSV/JSON. Original rows remain unchanged; colliding export headers are rejected. Tree exports include collapsed descendants, and grouped exports follow explicit group order.
|
|
45
|
+
- A Tree/Group Export Playground sample with source tables, CSV/JSON previews, and CSV downloads containing the management columns.
|
|
46
|
+
- Framework-neutral `importCominsRowsFromCsv` with application-owned row mapping, quoted fields, optional headers, BOM handling, and configurable input limits. Malformed CSV is rejected before row mapping; values remain strings until the application converts them.
|
|
47
|
+
- React Tree Grid `treeSlots.leading`, `content`, and `trailing` callbacks with typed node context and `defaultContent`. Slots preserve disclosure and indentation; interactive controls keep their events separate from Table selection and callbacks.
|
|
48
|
+
|
|
49
|
+
### Changed
|
|
50
|
+
|
|
51
|
+
- A concise README with explicit Korean and English guides, the public website, and the representative GIF. Detailed state and Ref API contracts live in the language guides.
|
|
52
|
+
|
|
3
53
|
## 0.2.0 - 2026-10-02
|
|
4
54
|
|
|
5
55
|
### Changed
|
package/README.md
CHANGED
|
@@ -1,71 +1,32 @@
|
|
|
1
1
|
# Comins Table
|
|
2
2
|
|
|
3
|
-
<img src="example/public/comins-symbol.svg" width="64" height="64" alt="Comins"
|
|
3
|
+
<a href="https://comins-website.vercel.app/ko/"><img src="https://raw.githubusercontent.com/kim1124/comins-table/main/example/public/comins-symbol.svg" width="64" height="64" alt="Comins brand website" /></a>
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
A React data table backed by the framework-neutral TypeScript `comins-table/core`. Build data-heavy screens with application-owned data, virtualized rows, Tree Grid, grouping, and customizable cells.
|
|
6
6
|
|
|
7
7
|
[](https://www.npmjs.com/package/comins-table)
|
|
8
8
|
[](https://www.npmjs.com/package/comins-table)
|
|
9
9
|
[](https://github.com/kim1124/comins-table/actions/workflows/verify.yml)
|
|
10
10
|
[](LICENSE)
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
[한국어 가이드](https://github.com/kim1124/comins-table/blob/main/docs/ko/README.md)
|
|
13
|
+
· [English Guide](https://github.com/kim1124/comins-table/blob/main/docs/user/README.md)
|
|
14
|
+
· [Comins Brand](https://comins-website.vercel.app/ko/)
|
|
15
|
+
· [Changelog](https://github.com/kim1124/comins-table/blob/main/CHANGELOG.md)
|
|
13
16
|
|
|
14
|
-
|
|
17
|
+
0.2.2: standard `render` customization with 0.x compatibility, value list filters, and styled Excel import/export. [한국어 전환 안내](https://github.com/kim1124/comins-table/blob/main/docs/ko/27-migration-0.2.2.md) · [English migration](https://github.com/kim1124/comins-table/blob/main/docs/user/27-migration-0.2.2.md).
|
|
15
18
|
|
|
16
|
-
|
|
17
|
-
| --- | --- |
|
|
18
|
-
| Controlled data | Application-owned `data`, CRUD helpers, `onChangeData`, pagination, sorting, and layout callbacks |
|
|
19
|
-
| Rendering and scale | Fixed and automatic Row heights, variable-height virtualization, a tested 100,000-row route, bounded Viewport range loading, infinite scroll, append-mode lazy loading, loading, and empty states |
|
|
20
|
-
| Interaction | Accessible single and opt-in multi-column Header sorting, controlled Column Filtering, resize, responsive Column Pinning, 6-pixel horizontal column reorder, Cross-Table Row/Group Drag, Row and Cell selection, ranges, clipboard, and context menu callbacks |
|
|
21
|
-
| Data structure | Controlled client-side flat Row Grouping, flat Row Expand Details, Summary Row aggregation, and Tree Grid expand/fold and subtree drag |
|
|
22
|
-
| Custom UI | Cell/Header renderers, built-in button/input/checkbox/radio/select/toggle/progress/menu/Virtual List components, and CSS-variable themes |
|
|
19
|
+

|
|
23
20
|
|
|
24
|
-
|
|
21
|
+
The preview was recorded with 0.1.11. Feature-specific recordings and examples are available in the guides.
|
|
25
22
|
|
|
26
|
-
|
|
23
|
+
## Highlights
|
|
27
24
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
**
|
|
31
|
-
|
|
32
|
-
**
|
|
33
|
-
|
|
34
|
-
For migration, keep these data-ownership boundaries explicit:
|
|
35
|
-
|
|
36
|
-
- Local Row reordering needs `rowProps.draggable: true`; connect `onChangeData` when the application must retain the new order. Use stable Row IDs and keep the input array reference stable when relying on internal order.
|
|
37
|
-
- Tree movement still requires `treeRowDrag` and controlled `onChangeData`. Cross-Table transfers use the Coordinator; enabling a local Row handle does not enable transfers.
|
|
38
|
-
- OS paste and Fill require `cellSelection` and `onChangeData`; both remain opt-in. A two-field TSV updates two destination Cells. A trailing tab deliberately supplies an additional empty field.
|
|
39
|
-
- Viewport loading has no Row Drag handles. Reordering a partially loaded dataset belongs to the server, followed by a dataset reset.
|
|
40
|
-
|
|
41
|
-
### Feature catalog
|
|
42
|
-
|
|
43
|
-
This catalog is a consumer-oriented summary, not the complete status registry. Use the [Canonical Feature Manifest](https://github.com/kim1124/comins-table/blob/main/docs/feature-manifest.json) and the language indexes for every shipped, unsupported, and evidence-linked feature.
|
|
44
|
-
|
|
45
|
-
| Area | Shipped capabilities | Live examples | Guides |
|
|
46
|
-
| --- | --- | --- | --- |
|
|
47
|
-
| Getting started | Controlled data, CRUD, Core state, loading, and empty states | [`Getting Started`](http://127.0.0.1:4002/docs/getting-started), [`CRUD`](http://127.0.0.1:4002/examples/crud) | [Quick Start](https://github.com/kim1124/comins-table/blob/main/docs/user/01-quick-start.md), [Data And CRUD](https://github.com/kim1124/comins-table/blob/main/docs/user/02-data-and-crud.md) |
|
|
48
|
-
| Header and layout | Sort, multi-sort, resize, move, Header Groups, Filtering, and Pinning | [`Header`](http://127.0.0.1:4002/examples/header), [`Filtering`](http://127.0.0.1:4002/examples/column-filtering), [`Pinning`](http://127.0.0.1:4002/examples/column-pinning) | [Header](https://github.com/kim1124/comins-table/blob/main/docs/user/06-header.md), [Filtering](https://github.com/kim1124/comins-table/blob/main/docs/user/21-column-filtering.md), [Pinning](https://github.com/kim1124/comins-table/blob/main/docs/user/22-column-pinning.md) |
|
|
49
|
-
| Rows, cells, and selection | Row and Cell callbacks, selection, Clipboard, Context Menu, and Row Expand | [`Selection`](http://127.0.0.1:4002/examples/selection-clipboard), [`Row Expand`](http://127.0.0.1:4002/examples/row-expand) | [Row](https://github.com/kim1124/comins-table/blob/main/docs/user/07-row.md), [Cell](https://github.com/kim1124/comins-table/blob/main/docs/user/08-cell.md), [Selection](https://github.com/kim1124/comins-table/blob/main/docs/user/10-selection.md) |
|
|
50
|
-
| Structured rows | Summary Row, Tree Grid, Row Grouping, and Cross-Table Row/Group Drag | [`Summary`](http://127.0.0.1:4002/examples/summary-row), [`Tree`](http://127.0.0.1:4002/examples/tree-grid), [`Grouping`](http://127.0.0.1:4002/examples/row-grouping), [`Transfer`](http://127.0.0.1:4002/examples/cross-table-drag) | [Summary](https://github.com/kim1124/comins-table/blob/main/docs/user/18-summary-row.md), [Tree](https://github.com/kim1124/comins-table/blob/main/docs/user/17-tree-grid.md), [Grouping](https://github.com/kim1124/comins-table/blob/main/docs/user/20-row-grouping.md), [Transfer](https://github.com/kim1124/comins-table/blob/main/docs/user/23-cross-table-drag.md) |
|
|
51
|
-
| Loading and performance | Pagination, fixed/variable-height virtualization, automatic heights, Viewport Datasource, Infinite Scroll, and Lazy Load | [`Virtualization`](http://127.0.0.1:4002/performance/virtualization), [`Automatic height`](http://127.0.0.1:4002/performance/auto-row-height), [`Viewport`](http://127.0.0.1:4002/performance/viewport-datasource) | [Virtualization](https://github.com/kim1124/comins-table/blob/main/docs/user/11-virtualization.md), [Automatic height](https://github.com/kim1124/comins-table/blob/main/docs/user/24-auto-row-height.md), [Viewport](https://github.com/kim1124/comins-table/blob/main/docs/user/25-viewport-datasource.md), [Lazy Load](https://github.com/kim1124/comins-table/blob/main/docs/user/16-lazy-load.md) |
|
|
52
|
-
| Rendering and styling | Built-in components, custom renderers, themes, CSS variables, and export helpers | [`Components`](http://127.0.0.1:4002/examples/component), [`Theme`](http://127.0.0.1:4002/examples/theme), [`Export`](http://127.0.0.1:4002/examples/export) | [Cell](https://github.com/kim1124/comins-table/blob/main/docs/user/08-cell.md), [Styling](https://github.com/kim1124/comins-table/blob/main/docs/user/04-styling.md), [Export](https://github.com/kim1124/comins-table/blob/main/docs/user/14-export.md) |
|
|
53
|
-
| API and utilities | Ref controls, framework-independent Core helpers, Clipboard, and selection helpers | [`Ref API`](http://127.0.0.1:4002/api/ref), [`Props`](http://127.0.0.1:4002/api/props) | [Core State](https://github.com/kim1124/comins-table/blob/main/docs/user/03-core-state.md), [Clipboard](https://github.com/kim1124/comins-table/blob/main/docs/user/09-clipboard.md) |
|
|
54
|
-
|
|
55
|
-
## Support
|
|
56
|
-
|
|
57
|
-
| Surface | Support |
|
|
58
|
-
| --- | --- |
|
|
59
|
-
| React | `>=18.0.0 <20.0.0` |
|
|
60
|
-
| React DOM | `>=18.0.0 <20.0.0` |
|
|
61
|
-
| TypeScript | Declarations bundled with every JavaScript entry point; CSS available through the stylesheet export |
|
|
62
|
-
| Chrome and Edge | Current stable Chromium-based releases |
|
|
63
|
-
| Automated browser gate | Playwright-bundled Chromium |
|
|
64
|
-
| Firefox and Safari | Outside the supported contract until Firefox and WebKit projects are added |
|
|
65
|
-
| SSR | Client boundary required; server rendering is not currently supported |
|
|
66
|
-
| Runtime network behavior | No package-owned requests, remote assets, telemetry, or error reporting |
|
|
67
|
-
|
|
68
|
-
The Chrome and Edge row is the compatibility contract. The automated browser gate is evidence from Playwright-bundled Chromium only; it is not a claim that Firefox, Safari, or every installed Edge build was tested.
|
|
25
|
+
- **Application-owned data:** controlled updates with stable row IDs and reusable Core helpers.
|
|
26
|
+
- **Large datasets:** virtualization, automatic row heights, and bounded Viewport loading.
|
|
27
|
+
- **Table interactions:** sorting, filtering, column resizing and pinning, selection, clipboard, and Fill Handle.
|
|
28
|
+
- **Structured rows:** Tree Grid, row grouping, summaries, row details, and supported row/group drag operations.
|
|
29
|
+
- **Custom presentation:** cell/header renderers, built-in components, themes, and CSS variables.
|
|
69
30
|
|
|
70
31
|
## Installation
|
|
71
32
|
|
|
@@ -73,26 +34,7 @@ The Chrome and Edge row is the compatibility contract. The automated browser gat
|
|
|
73
34
|
npm install comins-table react react-dom
|
|
74
35
|
```
|
|
75
36
|
|
|
76
|
-
|
|
77
|
-
```tsx
|
|
78
|
-
import { CominsTable, type CominsTableColumn } from "comins-table";
|
|
79
|
-
import "comins-table/styles.css";
|
|
80
|
-
```
|
|
81
|
-
|
|
82
|
-
React and React DOM are peer dependencies. Import `comins-table/styles.css` when the default table shell, themes, and built-in component skin are required.
|
|
83
|
-
|
|
84
|
-
### Run the Playground locally
|
|
85
|
-
|
|
86
|
-
The Playground is a repository development server, not a command installed into a consumer application.
|
|
87
|
-
|
|
88
|
-
```bash
|
|
89
|
-
git clone https://github.com/kim1124/comins-table.git
|
|
90
|
-
cd comins-table
|
|
91
|
-
npm ci
|
|
92
|
-
npm run dev
|
|
93
|
-
```
|
|
94
|
-
|
|
95
|
-
Open [`http://127.0.0.1:4002/docs/getting-started`](http://127.0.0.1:4002/docs/getting-started).
|
|
37
|
+
React and React DOM `>=18.0.0 <20.0.0` are peer dependencies. TypeScript declarations are included for JavaScript entry points. Import `comins-table/styles.css` for the default table appearance.
|
|
96
38
|
|
|
97
39
|
## Quick Start
|
|
98
40
|
|
|
@@ -102,301 +44,63 @@ import { useState } from "react";
|
|
|
102
44
|
import { CominsTable, type CominsTableColumn } from "comins-table";
|
|
103
45
|
import "comins-table/styles.css";
|
|
104
46
|
|
|
105
|
-
type UserRow = {
|
|
106
|
-
active: boolean;
|
|
107
|
-
age: number;
|
|
108
|
-
id: string;
|
|
109
|
-
name: string;
|
|
110
|
-
role: string;
|
|
111
|
-
};
|
|
47
|
+
type UserRow = { id: string; name: string; age: number };
|
|
112
48
|
|
|
113
|
-
const columns:
|
|
49
|
+
const columns: CominsTableColumn<UserRow>[] = [
|
|
114
50
|
{ field: "name", label: "Name", sort: true },
|
|
115
51
|
{ field: "age", label: "Age", sort: true },
|
|
116
|
-
{ field: "role", label: "Role" },
|
|
117
|
-
{
|
|
118
|
-
field: "active",
|
|
119
|
-
label: "Active",
|
|
120
|
-
cell: {
|
|
121
|
-
format: ({ value }) => (value ? "Active" : "Inactive"),
|
|
122
|
-
},
|
|
123
|
-
},
|
|
124
52
|
];
|
|
125
53
|
|
|
126
54
|
export function UsersTable() {
|
|
127
55
|
const [data, setData] = useState<UserRow[]>([
|
|
128
|
-
{
|
|
56
|
+
{ id: "u-1", name: "Example user", age: 31 },
|
|
129
57
|
]);
|
|
130
58
|
|
|
131
59
|
return (
|
|
132
|
-
<CominsTable
|
|
60
|
+
<CominsTable
|
|
133
61
|
columns={columns}
|
|
134
62
|
data={data}
|
|
135
63
|
getRowId={(row) => row.id}
|
|
136
64
|
onChangeData={setData}
|
|
137
|
-
pagination={{ pageIndex: 0, pageSize: 30 }}
|
|
138
|
-
theme={{ density: "compact" }}
|
|
139
65
|
/>
|
|
140
66
|
);
|
|
141
67
|
}
|
|
142
68
|
```
|
|
143
69
|
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
Comins Table is a CSR-focused controlled component for application-owned data. The application owns the Row array or Viewport snapshot passed through `data`.
|
|
147
|
-
|
|
148
|
-
For table-owned data mutations, `onChangeData` emits the next flat Row array or Tree Grid node array; pass that array back through `data` to retain the mutation. Viewport mode uses a controlled block snapshot instead of a full array; `useCominsViewport` connects that snapshot and its callbacks. Other controlled models use their matching callback and value prop rather than `onChangeData`.
|
|
149
|
-
|
|
150
|
-
Selection, column layout, and sort are internal view state. `onChangeSelection`, `onChangeColumnLayout`, `onChangeSort`, and `onChangeSortModel` observe those changes so an application can coordinate or persist them externally; the table updates the corresponding view state even when a callback is omitted.
|
|
151
|
-
|
|
152
|
-
Where restoration is supported, use the supported Ref API: `setSelectedRow` and `setSelectedRows` restore Row selection by visible index, `setColumnLayout` restores layout, and `setSortState` and `clearSort` restore or clear sorting. `setSortModel` restores the complete ordered model; `getColumnLayout`, `getSortState`, and `getSortModel` read the current layout and sort state.
|
|
153
|
-
|
|
154
|
-
### Multi-column Sort
|
|
155
|
-
|
|
156
|
-
Set `multiSort` to opt into ordered multi-column sorting. Normal Header click or `Enter`/`Space` keeps single sorting; hold `Shift` while using the same input to add, update, or remove one rule without replacing the others. Active Headers display their 1-based priority.
|
|
157
|
-
|
|
158
|
-
<!-- comins-doc-example: fragment -->
|
|
159
|
-
```tsx
|
|
160
|
-
<CominsTable
|
|
161
|
-
columns={columns}
|
|
162
|
-
data={data}
|
|
163
|
-
multiSort
|
|
164
|
-
onChangeSortModel={(model) => saveSortModel(model)}
|
|
165
|
-
/>
|
|
166
|
-
```
|
|
167
|
-
|
|
168
|
-
`getSortModel()` and `setSortModel(model)` read and restore the full model. The existing `getSortState()`, `setSortState(rule)`, and `onChangeSort` APIs remain the single-rule compatibility surface. Two-level child Columns and Tree Grid sibling sets use the same ordered comparison rules.
|
|
169
|
-
|
|
170
|
-
## Package Entry Points
|
|
171
|
-
|
|
172
|
-
**0.2.0:** `/core` uses neutral state and string labels. Existing React state helpers and JSX/renderer/theme types belong to the root; `/clipboard` and `/selection` retain React-state contracts. Published 0.1.x behavior is not changed by this guide. See the [English migration guide](https://github.com/kim1124/comins-table/blob/main/docs/user/26-migration-0.2.0.md) or [한국어 마이그레이션](https://github.com/kim1124/comins-table/blob/main/docs/ko/26-migration-0.2.0.md). React peers and the client-only Table boundary remain unchanged; Vue support is not included.
|
|
173
|
-
|
|
174
|
-
| Import | Purpose |
|
|
175
|
-
| --- | --- |
|
|
176
|
-
| `comins-table` | React component, public types, and root helper exports |
|
|
177
|
-
| `comins-table/core` | Neutral state, row, column, pagination, sorting, layout, selection, clipboard, export, and virtualization helpers |
|
|
178
|
-
| `comins-table/clipboard` | React-state clipboard helper subset |
|
|
179
|
-
| `comins-table/selection` | React-state selection helper subset |
|
|
180
|
-
| `comins-table/styles.css` | Optional table shell, theme, and built-in component skin |
|
|
181
|
-
|
|
182
|
-
## Header And Layout
|
|
183
|
-
|
|
184
|
-
Sortable headers support pointer and keyboard activation and expose `aria-sort`. Columns support width constraints and resize interactions.
|
|
185
|
-
|
|
186
|
-
A left-button mouse interaction activates column movement after a 6-pixel horizontal drag, provided horizontal movement remains greater than vertical movement. The source becomes a source placeholder while a ghost and target marker show the proposed move. Pointer Up commits only over a valid target; vertical intent, pointer cancellation, `Escape`, and window blur cancel the pending move. Non-mouse pointers retain one-second long-press compatibility. Parent header groups move their children as one block.
|
|
187
|
-
|
|
188
|
-
Use `getColumnLayout()` and `setColumnLayout()` through the Ref API, or `serializeCominsColumnLayout()` and `applyCominsColumnLayout()` to persist and restore order, widths, and visibility. Import helpers from the root for React state or from `comins-table/core` for neutral state.
|
|
189
|
-
|
|
190
|
-
### Column Pinning
|
|
191
|
-
|
|
192
|
-
Set `pinned: "left"` or `pinned: "right"` on a Column or Header Group to keep its atomic block visible during horizontal scrolling and lock its configured position. Direct resize of an effective pinned block stops before it would consume the 48px center budget and demote itself; independent container resize can still temporarily demote inner pinned blocks without changing the persisted layout intent. Header, Body, Skeleton, and Summary use the same offsets. Group Rows and Row Details remain full-width spanning cells; Row Group inner content stays visible at the Body viewport start while horizontally scrolling. See the [Column Pinning guide](https://github.com/kim1124/comins-table/blob/main/docs/user/22-column-pinning.md) and [`/examples/column-pinning`](http://127.0.0.1:4002/examples/column-pinning).
|
|
193
|
-
|
|
194
|
-
When columns overflow horizontally, Comins Table renders one native horizontal scrollbar at the bottom of the complete Table. A configured Summary Row stays above that scrollbar, while Body trackpad or Shift-wheel input and direct scrollbar input keep Header, Body, and Summary `scrollLeft` synchronized.
|
|
195
|
-
|
|
196
|
-
## Rows, Cells, And Selection
|
|
197
|
-
|
|
198
|
-
Rows expose click, double-click, keyboard, and context-menu callbacks. Cells expose the corresponding Cell callbacks plus `format`, `renderer`, and props hooks.
|
|
199
|
-
|
|
200
|
-
A normal Row interaction selects one Row, `Ctrl`/`Cmd` toggles a Row, and `Shift` extends the visible Row range from the selection anchor. Cell selection supports a single Cell, visible `Ctrl`/`Cmd` discontiguous selection, and `Shift` or pointer-drag rectangular ranges. `CominsSelectionState.cell` is the active Cell, `cells` records the discontiguous set, and `range` records the rectangle. Built-in component interactions remain isolated from `onClickCell` and `onClickRow` callback payloads so component actions do not also trigger the owning Cell or Row action.
|
|
201
|
-
|
|
202
|
-
Set `rowSelectionOnClick={false}` to preserve selected Rows while clicking or right-clicking Cells. Application checkboxes or `setSelectedRows` can control the Row selection independently. `getSelectedRows()`, `getSelectedCells()`, and `getSelection()` read Row data, raw Cell values, and the selection snapshot separately. The default `rowSelectionOnClick={true}` keeps the existing Row-click behavior.
|
|
203
|
-
|
|
204
|
-
Row Drag exposes `onBeforeRowDrag`, `onRowDrag`, and `onAfterDragRow`. The before callback can cancel prior to listener registration, target updates emit only on identity or validity changes, and the after callback reports one `moved`, `cancelled`, or `rejected` result per started gesture. Data changes remain controlled through `onChangeData` or the Cross-Table Coordinator.
|
|
205
|
-
|
|
206
|
-
### Row Expand
|
|
207
|
-
|
|
208
|
-
See the [Row Expand guide](https://github.com/kim1124/comins-table/blob/main/docs/user/19-row-expand.md) and run the [`/examples/row-expand`](http://127.0.0.1:4002/examples/row-expand) Playground route.
|
|
209
|
-
|
|
210
|
-
<!-- comins-doc-example: fragment -->
|
|
211
|
-
```tsx
|
|
212
|
-
const [expandedRowIds, setExpandedRowIds] = useState<readonly string[]>([]);
|
|
213
|
-
|
|
214
|
-
<CominsTable
|
|
215
|
-
columns={columns}
|
|
216
|
-
data={data}
|
|
217
|
-
expandedRowIds={expandedRowIds}
|
|
218
|
-
getRowDetailHeight={() => "auto"}
|
|
219
|
-
getRowId={(row) => row.id}
|
|
220
|
-
onChangeExpandedRowIds={setExpandedRowIds}
|
|
221
|
-
renderRowDetail={({ row }) => <Detail row={row.data} />}
|
|
222
|
-
/>;
|
|
223
|
-
```
|
|
224
|
-
|
|
225
|
-
Row Expand is controlled by stable owner business Row IDs. An interactive disclosure requires the application to feed the next value from `onChangeExpandedRowIds` back into `expandedRowIds`; when that callback is omitted, the disclosure is disabled and read-only. A finite positive CSS pixel height is fixed and retains its inline height. Missing values, invalid numeric values, and `"auto"` use measured automatic height with no inline height. Before an automatic Detail has a matching-width measurement, a valid finite positive `estimatedRowDetailHeight` is used; otherwise the resolved `rowHeight` is the estimate. Details render as semantic owner-following Rows, stay outside selection and clipboard addressing, and preserve dormant IDs across sorting and pagination.
|
|
226
|
-
|
|
227
|
-
Owner data Rows can use `getRowHeight` independently of Detail height. Tree Grid Row Details and nested Details managed by Comins Table remain unsupported.
|
|
228
|
-
|
|
229
|
-
## Row Grouping
|
|
230
|
-
|
|
231
|
-
See the [Row Grouping guide](https://github.com/kim1124/comins-table/blob/main/docs/user/20-row-grouping.md) and run the [`/examples/row-grouping`](http://127.0.0.1:4002/examples/row-grouping) Playground route.
|
|
232
|
-
|
|
233
|
-
`rowGrouping.groups` is an application-owned single-depth Group model whose array order remains the actual display order, including empty Groups. Stable Group IDs control expansion, Group Drag reorders the `groups` model, and existing Row Drag can reorder within a Group or use `setRowGroupId` to move across Groups. Applications own Group CRUD and write `onChangeGroups`, `onChangeData`, and expansion callbacks back to their controlled state. Pure `moveCominsRowGroup` and `moveCominsRowToGroup` helpers provide the corresponding JavaScript model transitions.
|
|
234
|
-
|
|
235
|
-
Each synthetic Group Row is one full-width colspan Cell with a distinct neutral-gray background. Use `getGroupRowProps` for a typed per-Group `className` or `style`, and override `--comins-table-group-row-background` and `--comins-table-group-row-color` for theme-level styling. The Table owns disclosure and Drag controls while `renderGroupContent` can replace its inner label, count, aggregate, badge, or business-action content. Header sorting never reorders Groups; the existing Row sort policy runs independently inside every Group. Built-in `count`, `sum`, `avg`, `min`, and `max` aggregations remain available.
|
|
70
|
+
Your application owns `data`; connect `onChangeData` to retain table-side edits. See the [한국어 시작 가이드](https://github.com/kim1124/comins-table/blob/main/docs/ko/01-quick-start.md) or [English Quick Start](https://github.com/kim1124/comins-table/blob/main/docs/user/01-quick-start.md) for setup details.
|
|
236
71
|
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
## Cross-Table Row And Group Drag
|
|
240
|
-
|
|
241
|
-
See the [Cross-Table Drag guide](https://github.com/kim1124/comins-table/blob/main/docs/user/23-cross-table-drag.md) and run the [`/examples/cross-table-drag`](http://127.0.0.1:4002/examples/cross-table-drag) Playground route.
|
|
242
|
-
|
|
243
|
-
Create a `createCominsTableTransferCoordinator()` and pass the same Coordinator, `scope`, and unique `tableId` through `tableTransfer` to participating Tables. Existing Row Drag moves one Row between compatible flat or grouped Tables. Group Drag moves the Group plus every member Row; moving the last Row preserves the empty source Group, while moving a Group removes it from the source model.
|
|
244
|
-
|
|
245
|
-
Duplicate IDs reject by default. A rejected duplicate displays a post-drop, pointer-adjacent `Duplicate ID` Tooltip and a restrained target Table outline without intercepting pointer events. The target can replace the Tooltip body through `rejectionFeedback.renderTooltip`, change its duration, disable default feedback, and customize its CSS variables. `Coordinator.onTransferRejected` receives the structured duplicate conflict for application Toasts or logging.
|
|
246
|
-
|
|
247
|
-
The target can reject through `canTransfer` or explicitly return `"overwrite"` from `resolveConflict`; Group overwrite replaces the complete target Group bundle and never merges it. The Coordinator emits one immutable source/target result, and the application applies both controlled models atomically. Cross-Table Transfer is unavailable with Tree Grid, Column Filtering, Infinite Scroll, and Lazy Load.
|
|
248
|
-
|
|
249
|
-
## Automatic Heights and Viewport Loading
|
|
250
|
-
|
|
251
|
-
Use `getRowHeight={() => "auto"}` for content-driven business Row heights, or return a positive number for an individual Row. Omitting the callback keeps the numeric `rowHeight` default of 36. `estimatedRowHeight` supplies an initial estimate, not a height limit. Custom Renderers do not need per-Cell height calculations; use normal-flow content and enable wrapping where required. Automatic heights work with Flat, Grouped business, and Tree Rows, including `treeRowDrag` where that mode supports dragging.
|
|
252
|
-
|
|
253
|
-
`useCominsViewport({ rowCount, queryKey, getRows })` loads blocks around the scroll region and connects them to the Table through `tableProps`. It enables virtualization and can be combined with `getRowHeight={() => "auto"}`. The application supplies a known total count, globally stable Row IDs, and arbitrary `[startIndex, endIndex)` range requests. Change `queryKey` when server sorting, filtering, or index order changes.
|
|
254
|
-
|
|
255
|
-
Viewport bounds cached data and measured heights; distant scrolling does not fetch every earlier page or require a full dataset array. Unloaded heights are estimated, so scrollbar size can change as content is measured. Selection getters and copy operate on loaded data without fetching missing Rows. The application owns network requests and edit persistence. Tree, Row Grouping, Row Detail, Row Drag, append loading, pagination, built-in sorting/filtering, and automatic Summary aggregation are unavailable in Viewport mode.
|
|
256
|
-
|
|
257
|
-
### Tree subtree movement
|
|
258
|
-
|
|
259
|
-
Move Gamma and its child Epsilon to another parent, then fold and expand the hierarchy.
|
|
260
|
-
|
|
261
|
-

|
|
262
|
-
|
|
263
|
-
### Content-driven heights
|
|
264
|
-
|
|
265
|
-
Expand a Cell Renderer and narrow the Table. Row heights adjust automatically across 100,000 virtualized Rows.
|
|
266
|
-
|
|
267
|
-

|
|
268
|
-
|
|
269
|
-
### Load the visible region
|
|
270
|
-
|
|
271
|
-
Drag the scrollbar to a distant region of 1,000,000 Rows, inspect the bounded cache, and change the query. This recording uses a simulated asynchronous source with a 250 ms delay.
|
|
272
|
-
|
|
273
|
-

|
|
274
|
-
|
|
275
|
-
See [automatic height](https://github.com/kim1124/comins-table/blob/main/docs/user/24-auto-row-height.md), [Viewport Datasource](https://github.com/kim1124/comins-table/blob/main/docs/user/25-viewport-datasource.md), and [Tree drag](https://github.com/kim1124/comins-table/blob/main/docs/user/17-tree-grid.md) for examples, defaults, and combination limits.
|
|
276
|
-
|
|
277
|
-
## Column Filtering
|
|
278
|
-
|
|
279
|
-
See the [Column Filtering guide](https://github.com/kim1124/comins-table/blob/main/docs/user/21-column-filtering.md) and run the [`/examples/column-filtering`](http://127.0.0.1:4002/examples/column-filtering) Playground route.
|
|
280
|
-
|
|
281
|
-
Each Column opts into `text`, `number`, UTC calendar-day `date`, or `boolean` filtering through `columns[].filter`. The application owns the complete `columnFiltering.model` and the currently open Header Filter popover. Rules across Columns use AND; invalid rules are ignored, text comparison is case-insensitive by default, and `between` uses an inclusive normalized range.
|
|
282
|
-
|
|
283
|
-
Filtering runs before Row Grouping membership, sorting, flat pagination, virtualization, and Summary aggregation. Explicit Group positions and empty Groups remain visible while counts and aggregates use filtered leaf Rows. Header sorting does not change the Filter model. Selected Row and expanded Detail IDs remain dormant when hidden, while invalid hidden Cell/range addresses are cleared.
|
|
284
|
-
|
|
285
|
-
Column Filtering cannot be combined with Tree Grid, Infinite/Lazy Loading, `loadingMore`, or Row Drag. Group Drag remains available in the supported Row Grouping combination because it changes only the explicit Group model.
|
|
286
|
-
|
|
287
|
-
## Virtualization And Loading
|
|
288
|
-
|
|
289
|
-
Set `virtualized`, `rowHeight`, and `"buffer-size"` for fixed-height windowed rendering; add `getRowHeight` for numeric per-Row or measured automatic heights. The performance Playground includes a tested 100,000-row route while keeping only the current window and buffer mounted. With ordinary virtualization, the application still supplies the full array. Viewport Datasource additionally bounds loaded data; Infinite Scroll and Lazy Load append to an application-owned array.
|
|
290
|
-
|
|
291
|
-
`infiniteScroll` requests application-owned append loading near the body viewport boundary. `lazyLoad` supports asynchronous append-mode batches with an `AbortSignal`. When `loading` is true, an empty table renders skeleton Rows and a populated table keeps its Rows visible under a loading overlay. `emptyComponent` controls the no-data content.
|
|
292
|
-
|
|
293
|
-
## Summary Row
|
|
294
|
-
|
|
295
|
-
See the [Summary Row guide](https://github.com/kim1124/comins-table/blob/main/docs/user/18-summary-row.md) and run the [`/examples/summary-row`](http://127.0.0.1:4002/examples/summary-row) Playground route.
|
|
296
|
-
|
|
297
|
-
Configure `summary.columns` with built-in `count`, `sum`, `avg`, `min`, and `max` aggregation or a custom aggregator. The object form supports visible-column `colSpan`, post-aggregation `format`, and per-cell `className` and `style`; `summary.className` and `summary.style` apply to the footer Row.
|
|
298
|
-
|
|
299
|
-
## Tree Grid
|
|
300
|
-
|
|
301
|
-
See the [Tree Grid guide](https://github.com/kim1124/comins-table/blob/main/docs/user/17-tree-grid.md) and run the [`/examples/tree-grid`](http://127.0.0.1:4002/examples/tree-grid) Playground route.
|
|
302
|
-
|
|
303
|
-
Set `tree` and provide controlled `{ item, expand, children }` nodes. `defaultExpandAll` supplies the initial fallback expansion state and defaults to `true`; explicit node state wins. `expand(nodeIds?)` and `fold(nodeIds?)` update multiple node ids, while an omitted argument targets every branch and an empty array is a no-op. Descendant-only expansion is blocked while an ancestor remains folded unless both ids are included in the same call.
|
|
304
|
-
|
|
305
|
-
Tree Grid reuses `cell.components` and `cell.renderer`, so component cells and custom React renderers work against each node's `item`. The Tree Grid Playground includes an exactly 10,000-node virtual example.
|
|
306
|
-
|
|
307
|
-
Set `treeRowDrag={{}}` and connect `onChangeData` to reorder siblings at every depth. `treeRowDrag={{ allowReparent: true }}` also moves entire subtrees between parents or back to the root. Parent changes default to disabled. `canDrop` and Row guards restrict destinations and sources; cycles are rejected and sorting disables manual movement. `moveCominsTreeNode` exposes the immutable move helper. Handles support pointer dragging and Space, arrow keys, Enter, and Escape. The Playground drag example starts with parent changes and automatic heights enabled; these are example settings.
|
|
308
|
-
|
|
309
|
-
## Components And Renderers
|
|
310
|
-
|
|
311
|
-
Cell components include `button`, `input`, `checkbox`, `radio`, `select`, `toggle`, `progress`, and `virtual-list`; Header components also support `menu`. Use `cell.renderer` or `header.renderer` when the built-in component types are not sufficient.
|
|
312
|
-
|
|
313
|
-
Virtual List Item activation follows the normal Row selection modifiers. More selects its owning Row exclusively before expanding the virtualized list. Search is available only while exactly one Row is selected. Keyboard activation keeps the More button focused after expansion. Item and More actions remain isolated from the Row and Cell click callbacks.
|
|
314
|
-
|
|
315
|
-
## Clipboard And Export
|
|
316
|
-
|
|
317
|
-
Set `clipboard` to enable OS keyboard copy. It defaults to `false`, preserving the existing internal copy buffer. With OS copy enabled, the default priority is multiple selected Cells → selected Rows → one selected Cell. Five selected Rows and three selected Cells copy the three Cells while retaining all five selected Rows. Discontiguous Cells produce a TSV rectangle with unselected positions empty; internal paste skips those positions.
|
|
318
|
-
|
|
319
|
-
Call `copySelection("auto" | "cells" | "rows")` from a button or context menu to choose the target explicitly. This Ref method writes to the OS clipboard regardless of the `clipboard` prop, returns `Promise<string | null>`, and rejects if writing is unavailable or denied. Native text editing keeps its own copy behavior. Ctrl/Cmd+V uses the Table's internal buffer by default; enable `clipboardPaste` to import external TSV instead. See the [Clipboard guide](https://github.com/kim1124/comins-table/blob/main/docs/user/09-clipboard.md) for guards, TSV escaping, and loaded-data limits.
|
|
320
|
-
|
|
321
|
-

|
|
322
|
-
|
|
323
|
-
`copyCominsRow`, `copyCominsCell`, and `copyCominsCellRange` read Row or Cell selections. `pasteCominsRow`, `pasteCominsCell`, and `pasteCominsCellRange` apply clipboard data while respecting `props.copyable`, `props.pasteable`, and disabled guards. `fillCominsCellRange` accepts a single Cell or rectangular source pattern. Enable `clipboardPaste` for OS TSV paste and `fillHandle` for visual pattern repetition; both default to false and require `cellSelection` and `onChangeData`. Set `cell.parseClipboard` for typed external values, optional `cell.validateFill` for atomic Fill validation, and `onClipboardError` for rejected input. `parseCominsClipboardText` and `pasteCominsText` are available from the root, `/core`, and `/clipboard`. See the [Clipboard guide](https://github.com/kim1124/comins-table/blob/main/docs/user/09-clipboard.md) for limits, guards, native-editor behavior, and `fillSelection("down" | "right")` click alternatives.
|
|
324
|
-
|
|
325
|
-
Use `exportCominsRowsToCsv` and `exportCominsRowsToJson` with the exact rows and export columns the application wants to serialize. Export remains independent of visible pagination, filtering, and selection unless the application passes those rows.
|
|
326
|
-
|
|
327
|
-
## Styling And Themes
|
|
72
|
+
## Documentation
|
|
328
73
|
|
|
329
|
-
|
|
74
|
+
| Language | Guides | 0.2.0 migration |
|
|
75
|
+
| --- | --- | --- |
|
|
76
|
+
| 한국어 | [기능별 가이드](https://github.com/kim1124/comins-table/blob/main/docs/ko/README.md) | [Core 마이그레이션](https://github.com/kim1124/comins-table/blob/main/docs/ko/26-migration-0.2.0.md) |
|
|
77
|
+
| English | [Feature guides](https://github.com/kim1124/comins-table/blob/main/docs/user/README.md) | [Core migration](https://github.com/kim1124/comins-table/blob/main/docs/user/26-migration-0.2.0.md) |
|
|
330
78
|
|
|
331
|
-
|
|
79
|
+
The [documentation index](https://github.com/kim1124/comins-table/blob/main/docs/README.md) links API usage, feature limits, and runnable examples. Browse the public website in [한국어](https://comins-website.vercel.app/ko/) or [English](https://comins-website.vercel.app/en/).
|
|
332
80
|
|
|
333
|
-
|
|
81
|
+
## Run the Playground locally
|
|
334
82
|
|
|
335
|
-
|
|
83
|
+
Clone the repository to run the examples; the Playground is not installed into consumer applications.
|
|
336
84
|
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
tableRef.current?.setColumnLayout(savedLayout);
|
|
343
|
-
tableRef.current?.getSortState();
|
|
344
|
-
tableRef.current?.setSortState({ columnId: "age", direction: "desc" });
|
|
345
|
-
tableRef.current?.getSortModel();
|
|
346
|
-
tableRef.current?.setSortModel([
|
|
347
|
-
{ columnId: "team", direction: "asc" },
|
|
348
|
-
{ columnId: "age", direction: "desc" },
|
|
349
|
-
]);
|
|
350
|
-
tableRef.current?.clearSort();
|
|
351
|
-
tableRef.current?.setSelectedRow(0);
|
|
352
|
-
tableRef.current?.setSelectedRows([0, 1]);
|
|
353
|
-
tableRef.current?.getSelectedRows();
|
|
354
|
-
tableRef.current?.getSelectedCells();
|
|
355
|
-
tableRef.current?.getSelection();
|
|
356
|
-
// In a user-initiated handler; handle unavailable or denied clipboard access:
|
|
357
|
-
await tableRef.current?.copySelection("rows");
|
|
358
|
-
tableRef.current?.setMoveTargetRow(3, 1);
|
|
359
|
-
tableRef.current?.expand(["department-1", "team-1-1"]);
|
|
360
|
-
tableRef.current?.fold(["team-1-1"]);
|
|
361
|
-
tableRef.current?.expand(); // all Tree Grid branches
|
|
362
|
-
tableRef.current?.fold(); // all Tree Grid branches
|
|
85
|
+
```bash
|
|
86
|
+
git clone https://github.com/kim1124/comins-table.git
|
|
87
|
+
cd comins-table
|
|
88
|
+
npm ci
|
|
89
|
+
npm run dev
|
|
363
90
|
```
|
|
364
91
|
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
`getSelectedRows()` returns loaded selected business data in data order. `getSelectedCells()` returns `{ rowId, columnId, value }` for available selected Cells; ranges use projected display order. `getSelection()` copies the selection IDs and addresses, including Row IDs retained after Viewport cache eviction. Row objects and Cell values remain application-owned references.
|
|
368
|
-
|
|
369
|
-
## Playground
|
|
370
|
-
|
|
371
|
-
After the repository setup under Installation, the local Playground starts at [`/docs/getting-started`](http://127.0.0.1:4002/docs/getting-started). Key routes include [`/examples/selection-clipboard`](http://127.0.0.1:4002/examples/selection-clipboard), [`/examples/row-expand`](http://127.0.0.1:4002/examples/row-expand), [`/examples/row-grouping`](http://127.0.0.1:4002/examples/row-grouping), [`/examples/column-filtering`](http://127.0.0.1:4002/examples/column-filtering), [`/examples/column-pinning`](http://127.0.0.1:4002/examples/column-pinning), [`/examples/cross-table-drag`](http://127.0.0.1:4002/examples/cross-table-drag), [`/examples/summary-row`](http://127.0.0.1:4002/examples/summary-row), [`/examples/tree-grid`](http://127.0.0.1:4002/examples/tree-grid), [`/examples/component`](http://127.0.0.1:4002/examples/component), and [`/performance/virtualization`](http://127.0.0.1:4002/performance/virtualization).
|
|
92
|
+
Open [the Playground](http://127.0.0.1:4002/docs/getting-started). The [Playground guide](https://github.com/kim1124/comins-table/blob/main/docs/user/12-playground.md) lists examples and language controls.
|
|
372
93
|
|
|
373
|
-
##
|
|
374
|
-
|
|
375
|
-
Start with the [English Quick Start](https://github.com/kim1124/comins-table/blob/main/docs/user/01-quick-start.md), [documentation index](https://github.com/kim1124/comins-table/blob/main/docs/README.md), [English feature guides](https://github.com/kim1124/comins-table/blob/main/docs/user/README.md), or [Korean feature guides](https://github.com/kim1124/comins-table/blob/main/docs/ko/README.md). Use the [Design Contract](https://github.com/kim1124/comins-table/blob/main/DESIGN.md), [Componentization Guide](https://github.com/kim1124/comins-table/blob/main/docs/design/componentization.md), and [Canonical Feature Manifest](https://github.com/kim1124/comins-table/blob/main/docs/feature-manifest.json) for visual stability, extension ownership, complete feature status, and evidence mapping. Each category links the detailed usage contract, runnable Playground route, related features, and the matching guide in the other language.
|
|
376
|
-
|
|
377
|
-
Use the [source repository](https://github.com/kim1124/comins-table) for development context, review the [changelog](https://github.com/kim1124/comins-table/blob/main/CHANGELOG.md) for version history, and follow the [security policy](https://github.com/kim1124/comins-table/blob/main/SECURITY.md) for vulnerability reporting.
|
|
378
|
-
|
|
379
|
-
## Current Boundaries
|
|
94
|
+
## Version and support
|
|
380
95
|
|
|
381
|
-
|
|
96
|
+
**0.2.2** adds standard `render` customization, customizable value list filters, and framework-neutral Excel import/export with export styles. Existing 0.x rendering aliases remain compatible until 1.0.0. See the migration guides above and the [changelog](https://github.com/kim1124/comins-table/blob/main/CHANGELOG.md) for version history.
|
|
382
97
|
|
|
383
|
-
The
|
|
384
|
-
|
|
385
|
-
## Development
|
|
386
|
-
|
|
387
|
-
```bash
|
|
388
|
-
npm run lint
|
|
389
|
-
npm run test:run
|
|
390
|
-
npm run build
|
|
391
|
-
npm run test:e2e
|
|
392
|
-
npm run test:perf -- --workers=1
|
|
393
|
-
npm run test:consumer
|
|
394
|
-
npm run verify
|
|
395
|
-
npm run docs:readme-gif
|
|
396
|
-
```
|
|
98
|
+
The Table UI is client-only React; SSR and a Vue adapter are not currently supported. Chrome and Edge are the supported browser targets, with automated browser checks using Playwright Chromium. Firefox and Safari are outside the current support contract. Feature combinations and limits are documented in the corresponding guides.
|
|
397
99
|
|
|
398
|
-
|
|
100
|
+
The Table runtime makes no package-owned network requests and loads no remote assets, telemetry, or error reporting.
|
|
399
101
|
|
|
400
|
-
##
|
|
102
|
+
## License and support
|
|
401
103
|
|
|
402
|
-
|
|
104
|
+
[MIT](https://github.com/kim1124/comins-table/blob/main/LICENSE)
|
|
105
|
+
· [Issues](https://github.com/kim1124/comins-table/issues)
|
|
106
|
+
· [Report a security issue](https://github.com/kim1124/comins-table/blob/main/SECURITY.md)
|
package/THIRD_PARTY_NOTICES.md
CHANGED
|
@@ -119,3 +119,7 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
|
119
119
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
120
120
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
121
121
|
SOFTWARE.
|
|
122
|
+
|
|
123
|
+
## XLSX external runtime dependencies
|
|
124
|
+
|
|
125
|
+
The independent `comins-table/xlsx` entry imports SheetJS CE `xlsx` 0.20.3 (Apache-2.0, official supplier artifact), `@zip.js/zip.js` 2.23.0 (BSD-3-Clause) `@federicocarboni/saxe` 0.8.0 (Apache-2.0) and `write-excel-file` 4.1.1 (MIT), with `fflate` 0.8.3 (MIT) transitively. Comins preserves these as external imports and does not copy their source into its library chunks. Their installed packages contain the applicable license texts. Downstream applications that bundle them must preserve the corresponding license/notice obligations. The ZIP native JS entry includes a JavaScript fallback and does not request a runtime WASM asset.
|
|
@@ -25,7 +25,7 @@ function n(e, t) {
|
|
|
25
25
|
}
|
|
26
26
|
function r(e, t) {
|
|
27
27
|
return t.split(".").reduce((e, t) => {
|
|
28
|
-
if (
|
|
28
|
+
if (typeof e == "object" && e) return e[t];
|
|
29
29
|
}, e);
|
|
30
30
|
}
|
|
31
31
|
function i(e, t, n) {
|
|
@@ -240,7 +240,7 @@ function x(e, t, n = []) {
|
|
|
240
240
|
let b = Array.from({ length: v + 1 }, () => []), x = new Map(h.map((e) => [e.key, e]));
|
|
241
241
|
for (let e of h) {
|
|
242
242
|
let t = g.get(e.key);
|
|
243
|
-
|
|
243
|
+
t && !t.locked && b[_.get(e.key) ?? 0]?.push(e);
|
|
244
244
|
}
|
|
245
245
|
let S = [], C = 0;
|
|
246
246
|
for (let e of m) e.locked && (S.push(...b[C] ?? []), S.push(x.get(e.key) ?? e), C += 1);
|
|
@@ -896,7 +896,7 @@ function Fe(e, n, r, i = e.rowIds) {
|
|
|
896
896
|
let u = i[o + r], d = u === void 0 ? -1 : t(e, u), f = c[d];
|
|
897
897
|
f !== void 0 && u !== void 0 && n.forEach((t, n) => {
|
|
898
898
|
let r = a[s + n];
|
|
899
|
-
|
|
899
|
+
t && r && X(e, f, u, r, "paste") && (c[d] = q(c[d], r.field, t.value), l = !0);
|
|
900
900
|
});
|
|
901
901
|
}), l ? z(e, c) : e;
|
|
902
902
|
}
|
|
@@ -921,7 +921,7 @@ function $(e, t, n, i, a, o, s) {
|
|
|
921
921
|
let n = c[i + t];
|
|
922
922
|
if (!X(e, m, a, n, "paste", p)) continue;
|
|
923
923
|
let o = s(f, t, n, m, a, p);
|
|
924
|
-
|
|
924
|
+
o && !Object.is(r(u[p], n.field), o.value) && (u[p] = q(u[p], n.field, o.value), d = !0);
|
|
925
925
|
}
|
|
926
926
|
}
|
|
927
927
|
return d ? z(e, u) : e;
|
|
@@ -956,4 +956,4 @@ function Le(e, { source: t, target: n }, i = e.rowIds) {
|
|
|
956
956
|
//#endregion
|
|
957
957
|
export { f as $, fe as A, oe as B, xe as C, we as D, U as E, le as F, h as G, ie as H, ue as I, re as J, k as K, se as L, F as M, me as N, H as O, pe as P, p as Q, ce as R, ye as S, W as T, O as U, A as V, g as W, S as X, C as Y, m as Z, G as _, Ne as a, Oe as b, ke as c, V as d, c as et, Ce as f, Te as g, K as h, Fe as i, e as it, P as j, de as k, je as l, be as m, Me as n, a as nt, Ie as o, _e as p, ee as q, Le as r, u as rt, Ae as s, Pe as t, o as tt, q as u, Ee as v, Se as w, ve as x, De as y, ae as z };
|
|
958
958
|
|
|
959
|
-
//# sourceMappingURL=clipboard-
|
|
959
|
+
//# sourceMappingURL=clipboard-B_gA5e12.js.map
|