@extable/core 0.1.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/README.md +6 -0
  2. package/dist/actionValue.d.ts +10 -0
  3. package/dist/dataModel.d.ts +9 -2
  4. package/dist/fillHandle.d.ts +1 -1
  5. package/dist/index.css +1 -1
  6. package/dist/index.d.ts +8 -21
  7. package/dist/index.js +3120 -1661
  8. package/dist/index.js.map +1 -1
  9. package/dist/renderers.d.ts +18 -0
  10. package/dist/selectionManager.d.ts +15 -2
  11. package/dist/types.d.ts +57 -43
  12. package/package.json +7 -1
package/README.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @extable/core
2
2
 
3
+ [![npm](https://img.shields.io/npm/v/@extable/core?color=2b6cb0&label=npm)](https://www.npmjs.com/package/@extable/core)
4
+ [![TypeScript](https://img.shields.io/badge/TypeScript-5.6-3178c6?logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
5
+ [![License](https://img.shields.io/npm/l/@extable/core)](../LICENSE)
6
+ [![CI](https://github.com/shibukawa/extable/actions/workflows/test.yml/badge.svg)](https://github.com/shibukawa/extable/actions/workflows/test.yml)
7
+ [![Bundle Size](https://img.shields.io/bundlephobia/minzip/@extable/core?label=bundle%20size)](https://bundlephobia.com/package/@extable/core)
8
+
3
9
  ![screenshot](../docs/public/assets/screenshot.webp)
4
10
 
5
11
  Excel-like HTML table component with a fixed column schema and built-in multi-user editing support.
package/dist/actionValue.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ import type { ButtonActionValue } from "./types";
2
+ export type LinkActionValue = {
3
+ label: string;
4
+ href: string;
5
+ target?: string;
6
+ };
7
+ export declare function resolveButtonAction(value: unknown): ButtonActionValue | null;
8
+ export declare function getButtonLabel(value: unknown): string;
9
+ export declare function resolveLinkAction(value: unknown): LinkActionValue | null;
10
+ export declare function getLinkLabel(value: unknown): string;
package/dist/dataModel.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import type { CellDiagnostic, ColumnSchema, ConditionalStyleFn, InternalRow, RowObject, Schema, StyleDelta, View } from "./types";
1
+ import type { CellDiagnostic, ColumnSchema, ColumnType, ConditionalStyleFn, InternalRow, RowObject, Schema, StyleDelta, View } from "./types";
2
2
  export declare class DataModel {
3
3
  private schema;
4
4
  private view;
@@ -44,7 +44,14 @@ export declare class DataModel {
44
44
  getCell(rowId: string, key: string): unknown;
45
45
  getRawCell(rowId: string, key: string): unknown;
46
46
  isRowReadonly(rowId: string): boolean;
47
+ private isActionType;
48
+ private supportsConditionalReadonly;
47
49
  isColumnReadonly(colKey: string): boolean;
50
+ getCellInteraction(rowId: string, colKey: string): {
51
+ readonly: boolean;
52
+ disabled: boolean;
53
+ muted: boolean;
54
+ };
48
55
  isReadonly(rowId: string, colKey: string): boolean;
49
56
  setCell(rowId: string, key: string, value: unknown, committed: boolean): void;
50
57
  applyPending(rowId: string): void;
@@ -61,7 +68,7 @@ export declare class DataModel {
61
68
  getRowIndex(rowId: string): number;
62
69
  getBaseRowIndex(rowId: string): number;
63
70
  getColumnIndex(colKey: string): number;
64
- getColumnByIndex(colIndex: number): ColumnSchema<any, any, import("./types").ColumnType, string>;
71
+ getColumnByIndex(colIndex: number): ColumnSchema<any, any, ColumnType, string>;
65
72
  getRowByIndex(rowIndex: number): InternalRow;
66
73
  private rebuildBaseIndex;
67
74
  private getFilterSortKey;
package/dist/fillHandle.d.ts CHANGED
@@ -9,7 +9,7 @@ export interface FillHandleSource {
9
9
  mode: FillHandleMode;
10
10
  }
11
11
  export declare function getFillHandleSource(dataModel: DataModel, ranges: SelectionRange[]): FillHandleSource | null;
12
- export declare function makeFillValueGetter(dataModel: DataModel, source: FillHandleSource): ((offsetFromEnd: number) => unknown) | null;
12
+ export declare function makeFillValueGetter(dataModel: DataModel, source: FillHandleSource, langs?: readonly string[]): ((offsetFromEnd: number) => unknown) | null;
13
13
  export declare const FILL_HANDLE_VISUAL_SIZE_PX = 12;
14
14
  export declare const FILL_HANDLE_HIT_SIZE_PX = 14;
15
15
  export declare function getFillHandleRect(cellRect: DOMRect, size?: number): DOMRect;
package/dist/index.css CHANGED
@@ -1 +1 @@
1
- .extable-root{--extable-border: 1px solid #dadce0;--extable-accent: #3b82f6;--extable-invalid: #ef4444;--extable-header-bg: #e5e7eb;border:1px solid #d0d7de;box-sizing:border-box}.extable-root .extable-shell{display:flex;width:100%;height:100%;min-width:0;min-height:0;position:relative;font-family:Inter,Segoe UI,system-ui,-apple-system,Helvetica Neue,sans-serif;overflow:visible}.extable-root .extable-viewport{flex:1;flex-basis:0;min-width:0;min-height:0;overflow:auto;position:relative;overscroll-behavior:contain;background:#f8fafc;border:none;box-sizing:border-box}.extable-root .extable-overlay-layer{position:sticky;top:0;left:0;width:0;height:0;pointer-events:none;z-index:20}.extable-root.extable-loading .extable-shell:after{content:"";position:absolute;inset:0;background:#ffffffa6;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:20}.extable-root.extable-loading .extable-shell:before{content:"";position:absolute;left:50%;top:50%;width:28px;height:28px;margin-left:-14px;margin-top:-14px;border-radius:9999px;border:3px solid rgba(148,163,184,.5);border-top-color:#3b82f6e6;animation:extable-spin .9s linear infinite;z-index:21}.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]{border-collapse:collapse;width:100%;background:transparent;table-layout:fixed;font-size:14px;line-height:16px}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) thead th{position:sticky;top:0;z-index:5}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) th{position:relative;background:var(--extable-header-bg);border:1px solid #d0d7de;padding:4px 8px;font-weight:700;text-align:left}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) thead th:not(.extable-row-header):after{content:"";position:absolute;top:0;right:-3px;width:6px;height:100%;cursor:col-resize}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) td{border:1px solid #d0d7de;padding:6px 8px;min-width:80px;cursor:cell;font-weight:400}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) td:focus-within{outline:2px solid #2b7fff;outline-offset:-1px}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) td.pending{color:#b91c1c}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) input{border:none;padding:2px 4px;width:100%;box-sizing:border-box;background:#fff;font:inherit}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) input:focus{outline:none}.extable-root table[data-extable-renderer=canvas-html-overlay]{opacity:0}.extable-root .extable-cell{border:var(--extable-border);padding:4px 8px;position:relative}.extable-root .extable-cell.invalid{outline:1px solid var(--extable-invalid)}.extable-root .extable-diag-warning:before,.extable-root .extable-diag-error:before{content:"";position:absolute;top:0;right:0;width:10px;height:10px;background:linear-gradient(225deg,#f59e0b 50%,transparent 50%)}.extable-root .extable-diag-error:before{background:linear-gradient(225deg,#ef4444 50%,transparent 50%)}.extable-root .extable-row-header{position:sticky;left:0;background:var(--extable-header-bg);text-align:center;vertical-align:middle;line-height:24px;padding:0;border:var(--extable-border);font-weight:600;color:#334155;z-index:4;cursor:default}.extable-root .extable-corner{position:sticky;top:0;left:0;z-index:6;background:var(--extable-header-bg);padding:0}.extable-root .extable-corner:after{content:"";position:absolute;top:4px;left:4px;width:12px;height:12px;background:linear-gradient(135deg,#9ca3af 50%,transparent 50%)}.extable-root .extable-active-row-header,.extable-root .extable-active-col-header{background:#3b82f629}.extable-root .extable-selected{background:#3b82f61f!important}.extable-root td.extable-selected{cursor:cell}.extable-root td.extable-active-cell.extable-editable{cursor:text}.extable-root td.extable-active-cell.extable-readonly,.extable-root td.extable-active-cell.extable-boolean{cursor:default}.extable-root .extable-all-selected td,.extable-root .extable-all-selected th{background:#3b82f614!important}.extable-root .extable-active-cell{outline:2px solid var(--extable-accent);outline-offset:-2px;position:relative}.extable-root .extable-active-cell:after{content:"";position:absolute;width:12px;height:12px;right:1px;bottom:1px;background:var(--extable-accent);border:1px solid #ffffff;cursor:crosshair;opacity:0}.extable-root[data-extable-fill-handle="1"] .extable-active-cell:after{opacity:1}.extable-root .extable-readonly-muted{background:#f3f4f6!important;color:#94a3b8!important}.extable-root td.extable-selected.extable-readonly-muted{background:#3b82f61f!important}.extable-root .extable-all-selected td.extable-readonly-muted,.extable-root .extable-all-selected th.extable-readonly-muted{background:#3b82f614!important}.extable-root.extable-readonly-all .extable-readonly-muted{background:inherit!important;color:inherit!important}.extable-root.extable-readonly-all table[data-extable-renderer=html] tbody td,.extable-root.extable-readonly-all table[data-extable-renderer=canvas-html-overlay] tbody td{cursor:cell}.extable-root.extable-readonly-all td.extable-active-cell{cursor:cell!important}.extable-root.extable-readonly-all .extable-active-cell:after{cursor:cell}.extable-root .extable-col-header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;cursor:default}.extable-root .extable-col-header-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.extable-root .extable-filter-sort-trigger{flex:0 0 auto;width:22px;height:22px;padding:0;border:1px solid rgba(148,163,184,.55);border-radius:6px;background:#ffffffb3;cursor:pointer;opacity:0;display:inline-flex;align-items:center;justify-content:center;line-height:1;color:#0f172abf}.extable-root .extable-filter-sort-trigger:hover,.extable-root .extable-filter-sort-trigger:focus-visible{opacity:1;outline:none;background:#ffffffeb;border-color:#3b82f6b3;color:#0f172aeb}.extable-root th:hover .extable-filter-sort-trigger{opacity:.55}.extable-root th[data-extable-fs-active="1"] .extable-filter-sort-trigger,.extable-root th[data-extable-sort-dir] .extable-filter-sort-trigger{opacity:.75}.extable-root th:hover[data-extable-fs-active="1"] .extable-filter-sort-trigger,.extable-root th:hover[data-extable-sort-dir] .extable-filter-sort-trigger{opacity:1}.extable-root .cell-nowrap{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.extable-root .cell-wrap{white-space:pre-wrap;text-overflow:clip;overflow-wrap:anywhere}.extable-root .align-left{text-align:left}.extable-root .align-right{text-align:right}.extable-root td[data-extable-diag-message]:hover:after{content:attr(data-extable-diag-message);position:absolute;top:6px;left:calc(100% + 10px);max-width:360px;padding:8px 10px;border-radius:10px;background:#111827;color:#f8fafc;font-size:12px;line-height:1.25;box-shadow:0 12px 28px #00000047;border:1px solid rgba(148,163,184,.35);white-space:pre-wrap;z-index:20}.extable-root td[data-extable-diag-message]:hover:before{content:"";position:absolute;top:14px;left:calc(100% + 2px);width:0;height:0;border:7px solid transparent;border-right-color:#111827;z-index:21}.extable-root .extable-context-menu{border:none;padding:6px 0;border-radius:8px;background:#fffffffa;box-shadow:0 18px 38px #00000040,0 8px 12px #0000002e;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);min-width:200px;position:fixed;margin:0;inset:auto;z-index:1000;pointer-events:auto}.extable-root .extable-context-menu::backdrop{background:transparent}.extable-root .extable-context-menu hr.extable-context-sep{border:0;border-top:1px solid #e5e7eb;margin:6px 0}.extable-root .extable-context-menu button{display:flex;gap:8px;align-items:center;width:100%;padding:8px 14px;background:transparent;border:none;font:inherit;text-align:left;cursor:pointer}.extable-root .extable-context-menu button:hover,.extable-root .extable-context-menu button:focus-visible{background:#3b82f61f;outline:none}.extable-root .extable-search-sidebar,.extable-root .extable-filter-sort-sidebar{flex:0 0 0px;width:0px;min-width:0;border-left:0px solid #e5e7eb;background:#fffffffa;border:1px solid rgba(148,163,184,.45);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;display:flex;flex-direction:column;gap:10px;padding:0;transform:translate(12px);opacity:0;pointer-events:none;transition:flex-basis .18s ease-out,width .18s ease-out,padding .18s ease-out,border-left-width .18s ease-out,opacity .18s ease-out,transform .18s ease-out}.extable-root.extable-search-open .extable-search-sidebar,.extable-root.extable-filter-sort-open .extable-filter-sort-sidebar{flex-basis:440px;width:440px;padding:12px;border-left-width:1px;opacity:1;transform:translate(0);pointer-events:auto}.extable-root .extable-search-sidebar input,.extable-root .extable-search-sidebar button{border-radius:8px;border:1px solid rgba(148,163,184,.7);background:#fff;font-family:inherit;font-size:.85rem}.extable-root .extable-search-sidebar input[type=checkbox],.extable-root .extable-filter-sort-sidebar input[type=checkbox]{width:16px;height:16px;accent-color:#0f172a;vertical-align:middle}.extable-root .extable-search-sidebar input{padding:6px 8px}.extable-root .extable-search-sidebar button{padding:6px 10px;cursor:pointer}@keyframes extable-spin{to{transform:rotate(360deg)}}.extable-root .extable-filter-sort-header{display:flex;flex-direction:column;gap:8px}.extable-root .extable-filter-sort-row{display:flex;align-items:center;gap:10px;justify-content:space-between;flex-wrap:wrap}.extable-root .extable-filter-sort-title{font-weight:700;color:#0f172a}.extable-root .extable-filter-sort-close{width:28px;height:28px;border-radius:8px;border:1px solid rgba(148,163,184,.5);background:#fffc;cursor:pointer}.extable-root .extable-filter-sort-body{display:flex;flex-direction:column;gap:12px;min-height:0;flex:1;overflow:hidden;border:1px solid rgba(148,163,184,.35);border-radius:0;padding:10px;background:#f8fafcb3}.extable-root .extable-filter-sort-section{display:flex;flex-direction:column;gap:8px;border:1px solid rgba(148,163,184,.25);border-radius:10px;padding:10px;background:#fff}.extable-root .extable-filter-sort-section-filter{flex:1;min-height:0}.extable-root .extable-filter-sort-section-sort{flex:0 0 auto}.extable-root .extable-filter-sort-section-title{font-weight:700;color:#0f172a}.extable-root .extable-filter-sort-values{min-height:0;flex:1;overflow:auto;border:1px solid rgba(148,163,184,.35);border-radius:10px;padding:8px;background:#ffffffe6}.extable-root .extable-filter-sort-values label{display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:center;padding:6px;border-radius:8px}.extable-root .extable-filter-sort-values label:hover{background:#3b82f614}.extable-root .extable-filter-sort-actions{display:flex;gap:8px;flex-wrap:nowrap}.extable-root .extable-filter-sort-actions label{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.extable-root .extable-filter-sort-actions[data-align=split]{justify-content:space-between}.extable-root .extable-filter-sort-actions[data-align=split] button[data-extable-fs=select-none]{margin-right:auto}.extable-root .extable-filter-sort-actions[data-align=right]{justify-content:flex-end}.extable-root .extable-filter-sort-actions button{padding:6px 10px;border-radius:10px;border:1px solid rgba(148,163,184,.55);background:#ffffffe6;cursor:pointer}.extable-root .extable-filter-sort-actions button:hover,.extable-root .extable-filter-sort-actions button:focus-visible{outline:none;border-color:#3b82f6b3}.extable-root .extable-filter-sort-actions button[data-extable-fs=apply-filter],.extable-root .extable-filter-sort-actions button[data-active="1"]{background:#0f172a;color:#f8fafc;border-color:#0f172a}.extable-tooltip{position:absolute;pointer-events:none;z-index:9999;display:none;max-width:360px;padding:8px 10px;border-radius:10px;background:#111827;color:#f8fafc;font-size:12px;line-height:1.25;box-shadow:0 12px 28px #00000047;border:1px solid rgba(148,163,184,.35);white-space:pre-wrap}.extable-tooltip[data-visible="1"]{display:block}.extable-tooltip:after{content:"";position:absolute;top:10px;width:0;height:0;border:7px solid transparent}.extable-tooltip[data-side=right]:after{left:-14px;border-right-color:#111827}.extable-tooltip[data-side=left]:after{right:-14px;border-left-color:#111827}.extable-root .extable-search-header{display:flex;flex-direction:column;gap:8px}.extable-root .extable-search-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.extable-root .extable-search-row label{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.extable-root .extable-search-label{flex:1;display:flex;gap:8px;align-items:center}.extable-root .extable-search-title{font-weight:700;color:#0f172a}.extable-root .extable-search-close{border:none;background:transparent;font-size:18px;line-height:1;padding:6px 8px;cursor:pointer}.extable-root .extable-search-status{justify-content:space-between;font-size:12px;color:#475569}.extable-root .extable-search-error{color:#b91c1c}.extable-root .extable-search-body{display:flex;flex-direction:column;gap:10px;min-height:0}.extable-root .extable-search-body label{display:inline-flex;align-items:center;gap:4px;font-size:.85rem}.extable-root .extable-search-actions{display:flex;gap:8px;flex-wrap:wrap}.extable-root .extable-search-actions button{padding:6px 10px;border-radius:8px;border:1px solid #d0d7de;background:#fff;cursor:pointer}.extable-root .extable-search-actions button:disabled{opacity:.5;cursor:default}.extable-root .extable-search-results{flex:1;min-height:0;overflow:auto;border:1px solid #e5e7eb;border-radius:10px;background:#fff;font-size:13px}.extable-root .extable-search-table{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}.extable-root .extable-search-table th,.extable-root .extable-search-table td{border-bottom:1px solid #eef2f7;padding:6px 8px;vertical-align:middle;line-height:1.4}.extable-root .extable-search-table td{color:#1f2937}.extable-root .extable-search-table th{position:sticky;top:0;background:#fff;z-index:1;text-align:left;color:#334155;font-weight:700}.extable-root .extable-search-table th:first-child,.extable-root .extable-search-table td:first-child{width:72px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.extable-root .extable-search-table th:nth-child(2),.extable-root .extable-search-table td:nth-child(2){width:auto;min-width:0}.extable-root .extable-search-table td:nth-child(2){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.extable-root .extable-search-result-row{cursor:pointer}.extable-root .extable-search-result-row:hover,.extable-root .extable-search-result-row:focus-visible{outline:none;background:#3b82f614}.extable-root .extable-search-result-row[data-active="1"]{background:#3b82f61f}.extable-root .extable-search-sidebar[data-extable-fr-readonly="1"] [data-extable-fr=replace-row],.extable-root .extable-search-sidebar[data-extable-fr-readonly="1"] [data-extable-fr=replace-toggle-row],.extable-root .extable-search-sidebar[data-extable-fr-readonly="1"] [data-extable-fr-only=replace]{display:none!important}.extable-root .extable-toast{border-radius:8px;padding:10px 14px;background:#19191ceb;color:#f8fafc;box-shadow:0 12px 30px #00000047,0 6px 12px #0000002e;font-size:13px;max-width:320px;line-height:1.4}.extable-root .extable-toast[data-variant=error]{background:#dc2626eb}
1
+ .extable-root{--extable-border: 1px solid #dadce0;--extable-accent: #3b82f6;--extable-invalid: #ef4444;--extable-header-bg: #e5e7eb;border:1px solid #d0d7de;box-sizing:border-box}.extable-root .extable-shell{display:flex;width:100%;height:100%;min-width:0;min-height:0;position:relative;font-family:Inter,Segoe UI,system-ui,-apple-system,Helvetica Neue,sans-serif;overflow:visible}.extable-root .extable-viewport{flex:1;flex-basis:0;min-width:0;min-height:0;overflow:auto;position:relative;overscroll-behavior:contain;background:#f8fafc;border:none;box-sizing:border-box}.extable-root .extable-overlay-layer{position:sticky;top:0;left:0;width:0;height:0;pointer-events:none;z-index:20}.extable-root.extable-loading .extable-shell:after{content:"";position:absolute;inset:0;background:#ffffffa6;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:20}.extable-root.extable-loading .extable-shell:before{content:"";position:absolute;left:50%;top:50%;width:28px;height:28px;margin-left:-14px;margin-top:-14px;border-radius:9999px;border:3px solid rgba(148,163,184,.5);border-top-color:#3b82f6e6;animation:extable-spin .9s linear infinite;z-index:21}.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]{border-collapse:collapse;width:100%;background:transparent;table-layout:fixed;font-size:14px;line-height:16px}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) thead th{position:sticky;top:0;z-index:5}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) th{position:relative;background:var(--extable-header-bg);border:1px solid #d0d7de;padding:4px 8px;font-weight:700;text-align:left}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) thead th:not(.extable-row-header):after{content:"";position:absolute;top:0;right:-3px;width:6px;height:100%;cursor:col-resize}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) td{border:1px solid #d0d7de;padding:6px 8px;min-width:80px;cursor:cell;font-weight:400}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) td:focus-within{outline:2px solid #2b7fff;outline-offset:-1px}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) td.pending{color:#b91c1c}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) input{border:none;padding:2px 4px;width:100%;box-sizing:border-box;background:#fff;font:inherit}:is(.extable-root table[data-extable-renderer=html],.extable-root table[data-extable-renderer=canvas-html-overlay]) input:focus{outline:none}.extable-root table[data-extable-renderer=canvas-html-overlay]{opacity:0}.extable-root .extable-cell{border:var(--extable-border);padding:4px 8px;position:relative}.extable-root .extable-cell.invalid{outline:1px solid var(--extable-invalid)}.extable-root .extable-diag-warning:before,.extable-root .extable-diag-error:before{content:"";position:absolute;top:0;right:0;width:10px;height:10px;background:linear-gradient(225deg,#f59e0b 50%,transparent 50%)}.extable-root .extable-diag-error:before{background:linear-gradient(225deg,#ef4444 50%,transparent 50%)}.extable-root .extable-row-header{position:sticky;left:0;background:var(--extable-header-bg);text-align:center;vertical-align:middle;line-height:24px;padding:0;border:var(--extable-border);font-weight:600;color:#334155;z-index:4;cursor:default}.extable-root .extable-corner{position:sticky;top:0;left:0;z-index:6;background:var(--extable-header-bg);padding:0}.extable-root .extable-corner:after{content:"";position:absolute;top:4px;left:4px;width:12px;height:12px;background:linear-gradient(135deg,#9ca3af 50%,transparent 50%)}.extable-root .extable-active-row-header,.extable-root .extable-active-col-header{background:#3b82f629}.extable-root .extable-selected{background:#3b82f61f!important}.extable-root td.extable-selected{cursor:cell}.extable-root td.extable-active-cell.extable-editable{cursor:text}.extable-root td.extable-active-cell.extable-readonly,.extable-root td.extable-active-cell.extable-boolean{cursor:default}.extable-root .extable-all-selected td,.extable-root .extable-all-selected th{background:#3b82f614!important}.extable-root .extable-active-cell{outline:2px solid var(--extable-accent);outline-offset:-2px;position:relative}.extable-root .extable-active-cell:after{content:"";position:absolute;width:12px;height:12px;right:1px;bottom:1px;background:var(--extable-accent);border:1px solid #ffffff;cursor:crosshair;opacity:0}.extable-root[data-extable-fill-handle="1"] .extable-active-cell:after{opacity:1}.extable-root .extable-readonly-muted{background:#f3f4f6!important;color:#94a3b8!important}.extable-root td.extable-disabled{cursor:default}.extable-root .extable-action-button,.extable-root .extable-action-link{display:inline-flex;align-items:center;gap:4px;max-width:100%;font:inherit;color:inherit;background:transparent;border:none;padding:0;cursor:pointer;text-decoration:none}.extable-root .extable-action-button{padding:2px 8px;border-radius:6px;border:1px solid #cbd5e1;background:#f8fafc}.extable-root .extable-action-link{color:#2563eb;text-decoration:underline;text-underline-offset:2px}.extable-root .extable-action-disabled{color:#94a3b8;border-color:#e2e8f0;background:#f3f4f6;cursor:default;text-decoration:none}.extable-root td.extable-selected.extable-readonly-muted{background:#3b82f61f!important}.extable-root .extable-all-selected td.extable-readonly-muted,.extable-root .extable-all-selected th.extable-readonly-muted{background:#3b82f614!important}.extable-root.extable-readonly-all .extable-readonly-muted{background:inherit!important;color:inherit!important}.extable-root.extable-readonly-all table[data-extable-renderer=html] tbody td,.extable-root.extable-readonly-all table[data-extable-renderer=canvas-html-overlay] tbody td{cursor:cell}.extable-root.extable-readonly-all td.extable-active-cell{cursor:cell!important}.extable-root.extable-readonly-all .extable-active-cell:after{cursor:cell}.extable-root .extable-col-header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;cursor:default}.extable-root .extable-col-header-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.extable-root .extable-filter-sort-trigger{flex:0 0 auto;width:22px;height:22px;padding:0;border:1px solid rgba(148,163,184,.55);border-radius:6px;background:#ffffffb3;cursor:pointer;opacity:0;display:inline-flex;align-items:center;justify-content:center;line-height:1;color:#0f172abf}.extable-root .extable-filter-sort-trigger:hover,.extable-root .extable-filter-sort-trigger:focus-visible{opacity:1;outline:none;background:#ffffffeb;border-color:#3b82f6b3;color:#0f172aeb}.extable-root th:hover .extable-filter-sort-trigger{opacity:.55}.extable-root th[data-extable-fs-active="1"] .extable-filter-sort-trigger,.extable-root th[data-extable-sort-dir] .extable-filter-sort-trigger{opacity:.75}.extable-root th:hover[data-extable-fs-active="1"] .extable-filter-sort-trigger,.extable-root th:hover[data-extable-sort-dir] .extable-filter-sort-trigger{opacity:1}.extable-root .cell-nowrap{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.extable-root .cell-wrap{white-space:pre-wrap;text-overflow:clip;overflow-wrap:anywhere}.extable-root .align-left{text-align:left}.extable-root .align-right{text-align:right}.extable-root td[data-extable-diag-message]:hover:after{content:attr(data-extable-diag-message);position:absolute;top:6px;left:calc(100% + 10px);max-width:360px;padding:8px 10px;border-radius:10px;background:#111827;color:#f8fafc;font-size:12px;line-height:1.25;box-shadow:0 12px 28px #00000047;border:1px solid rgba(148,163,184,.35);white-space:pre-wrap;z-index:20}.extable-root td[data-extable-diag-message]:hover:before{content:"";position:absolute;top:14px;left:calc(100% + 2px);width:0;height:0;border:7px solid transparent;border-right-color:#111827;z-index:21}.extable-root .extable-context-menu{border:none;padding:6px 0;border-radius:8px;background:#fffffffa;box-shadow:0 18px 38px #00000040,0 8px 12px #0000002e;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);min-width:200px;position:fixed;margin:0;inset:auto;z-index:1000;pointer-events:auto}.extable-root .extable-context-menu::backdrop{background:transparent}.extable-root .extable-context-menu hr.extable-context-sep{border:0;border-top:1px solid #e5e7eb;margin:6px 0}.extable-root .extable-context-menu button{display:flex;gap:8px;align-items:center;width:100%;padding:8px 14px;background:transparent;border:none;font:inherit;text-align:left;cursor:pointer}.extable-root .extable-context-menu button:hover,.extable-root .extable-context-menu button:focus-visible{background:#3b82f61f;outline:none}.extable-root .extable-filter-sort-sidebar{flex:0 0 0px;width:0px;min-width:0;border:1px solid rgba(148,163,184,.45);background:#fffffffa;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;flex-direction:column;gap:10px;padding:0;transform:translate(12px);opacity:0;pointer-events:none;overflow:hidden;visibility:hidden;transition:flex-basis .18s ease-out,width .18s ease-out,padding .18s ease-out,border-width .18s ease-out,opacity .18s ease-out,transform .18s ease-out,visibility 0s linear .18s;border-width:0}.extable-root.extable-filter-sort-open .extable-filter-sort-sidebar{flex-basis:440px;width:440px;padding:12px;opacity:1;transform:translate(0);pointer-events:auto;visibility:visible;border-width:1px;transition:flex-basis .18s ease-out,width .18s ease-out,padding .18s ease-out,border-width .18s ease-out,opacity .18s ease-out,transform .18s ease-out,visibility 0s linear 0s}.extable-root .extable-filter-sort-sidebar input[type=checkbox]{width:16px;height:16px;accent-color:#0f172a;vertical-align:middle}@keyframes extable-spin{to{transform:rotate(360deg)}}.extable-root .extable-filter-sort-header{display:flex;flex-direction:column;gap:8px}.extable-root .extable-filter-sort-row{display:flex;align-items:center;gap:10px;justify-content:space-between;flex-wrap:wrap}.extable-root .extable-filter-sort-title{font-weight:700;color:#0f172a}.extable-root .extable-filter-sort-close{width:28px;height:28px;border-radius:8px;border:1px solid rgba(148,163,184,.5);background:#fffc;cursor:pointer}.extable-root .extable-filter-sort-body{display:flex;flex-direction:column;gap:12px;min-height:0;flex:1;overflow:hidden;border:1px solid rgba(148,163,184,.35);border-radius:0;padding:10px;background:#f8fafcb3}.extable-root .extable-filter-sort-section{display:flex;flex-direction:column;gap:8px;border:1px solid rgba(148,163,184,.25);border-radius:10px;padding:10px;background:#fff}.extable-root .extable-filter-sort-section-filter{flex:1;min-height:0}.extable-root .extable-filter-sort-section-sort{flex:0 0 auto}.extable-root .extable-filter-sort-section-title{font-weight:700;color:#0f172a}.extable-root .extable-filter-sort-values{min-height:0;flex:1;overflow:auto;border:1px solid rgba(148,163,184,.35);border-radius:10px;padding:8px;background:#ffffffe6}.extable-root .extable-filter-sort-values label{display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:center;padding:6px;border-radius:8px}.extable-root .extable-filter-sort-values label:hover{background:#3b82f614}.extable-root .extable-filter-sort-actions{display:flex;gap:8px;flex-wrap:nowrap}.extable-root .extable-filter-sort-actions label{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.extable-root .extable-filter-sort-actions[data-align=split]{justify-content:space-between}.extable-root .extable-filter-sort-actions[data-align=split] button[data-extable-fs=select-none]{margin-right:auto}.extable-root .extable-filter-sort-actions[data-align=right]{justify-content:flex-end}.extable-root .extable-filter-sort-actions button{padding:6px 10px;border-radius:10px;border:1px solid rgba(148,163,184,.55);background:#ffffffe6;cursor:pointer}.extable-root .extable-filter-sort-actions button:hover,.extable-root .extable-filter-sort-actions button:focus-visible{outline:none;border-color:#3b82f6b3}.extable-root .extable-filter-sort-actions button[data-extable-fs=apply-filter],.extable-root .extable-filter-sort-actions button[data-active="1"]{background:#0f172a;color:#f8fafc;border-color:#0f172a}.extable-tooltip{position:absolute;pointer-events:none;z-index:9999;display:none;max-width:360px;padding:8px 10px;border-radius:10px;background:#111827;color:#f8fafc;font-size:12px;line-height:1.25;box-shadow:0 12px 28px #00000047;border:1px solid rgba(148,163,184,.35);white-space:pre-wrap}.extable-tooltip[data-visible="1"]{display:block}.extable-tooltip:after{content:"";position:absolute;top:10px;width:0;height:0;border:7px solid transparent}.extable-tooltip[data-side=right]:after{left:-14px;border-right-color:#111827}.extable-tooltip[data-side=left]:after{right:-14px;border-left-color:#111827}.extable-root .extable-toast{border-radius:8px;padding:10px 14px;background:#19191ceb;color:#f8fafc;box-shadow:0 12px 30px #00000047,0 6px 12px #0000002e;font-size:13px;max-width:320px;line-height:1.4}.extable-root .extable-toast[data-variant=error]{background:#dc2626eb}
package/dist/index.d.ts CHANGED
@@ -1,9 +1,6 @@
1
1
  import "./styles.css";
2
- import { type FindReplaceMode } from "./findReplace";
3
- import type { CoreOptions, InternalRow, NullableData, Schema, SelectionListener, SelectionSnapshot, TableConfig, TableState, TableStateListener, UndoRedoHistory, Updater, View, RowStateSnapshot, RowStateListener } from "./types";
2
+ import type { CommitHandler, CoreOptions, InternalRow, NullableData, Schema, SelectionListener, SelectionSnapshot, TableConfig, TableState, TableStateListener, UndoRedoHistory, Updater, View, RowStateSnapshot, RowStateListener } from "./types";
4
3
  export * from "./types";
5
- export type { FindReplaceMatch, FindReplaceMode, FindReplaceOptions, FindReplaceState, } from "./findReplace";
6
- export { FindReplaceController } from "./findReplace";
7
4
  export interface CoreInit<T extends object = Record<string, unknown>> {
8
5
  root: HTMLElement;
9
6
  defaultData: NullableData<T>;
@@ -18,7 +15,6 @@ export declare class ExtableCore<T extends object = Record<string, unknown>, R e
18
15
  private viewportResizeObserver;
19
16
  private dataModel;
20
17
  private dataLoaded;
21
- private loadingEnabled;
22
18
  private commandQueue;
23
19
  private lockManager;
24
20
  private renderer;
@@ -38,12 +34,7 @@ export declare class ExtableCore<T extends object = Record<string, unknown>, R e
38
34
  private handleGlobalPointer;
39
35
  private toast;
40
36
  private toastTimer;
41
- private findReplace;
42
- private findReplaceSidebar;
43
- private findReplaceSidebarUnsub;
44
- private findReplaceEnabled;
45
- private findReplaceUiEnabled;
46
- private findReplaceEnableSearch;
37
+ private sequenceLangs?;
47
38
  private mounted;
48
39
  private isCellReadonly;
49
40
  private resolveRowId;
@@ -58,12 +49,12 @@ export declare class ExtableCore<T extends object = Record<string, unknown>, R e
58
49
  private selectionListeners;
59
50
  private lastTableState;
60
51
  private lastSelectionSnapshot;
52
+ private lastAction;
61
53
  private selectionRanges;
62
54
  private activeCell;
63
55
  private activeErrors;
64
56
  private rowStateListeners;
65
57
  private lastRowStates;
66
- private isSearchPanelVisible;
67
58
  private isFilterSortPanelVisible;
68
59
  private safeRender;
69
60
  constructor(init: CoreInit<T>);
@@ -120,7 +111,11 @@ export declare class ExtableCore<T extends object = Record<string, unknown>, R e
120
111
  private applyInverse;
121
112
  private applyForward;
122
113
  commit(): Promise<RowStateSnapshot<T, R>[]>;
114
+ commit(handler: CommitHandler): Promise<RowStateSnapshot<T, R>[]>;
123
115
  private sendCommit;
116
+ private clearCommitErrors;
117
+ private recordCommitError;
118
+ private finalizeCommit;
124
119
  private handleServerEvent;
125
120
  private applyCommand;
126
121
  private ensureContextMenu;
@@ -133,26 +128,18 @@ export declare class ExtableCore<T extends object = Record<string, unknown>, R e
133
128
  private bindViewport;
134
129
  private unbindViewport;
135
130
  remount(target: HTMLElement): void;
136
- showSearchPanel(mode?: FindReplaceMode): void;
137
- hideSearchPanel(): void;
138
- toggleSearchPanel(mode?: FindReplaceMode): void;
139
- private updateFindReplaceReadonlyUI;
140
131
  getTableState(): TableState;
141
132
  subscribeTableState(listener: TableStateListener): () => boolean;
142
133
  private emitTableState;
143
134
  getSelectionSnapshot(): SelectionSnapshot;
144
135
  subscribeSelection(listener: SelectionListener): () => boolean;
136
+ private emitAction;
145
137
  private emitSelection;
146
138
  private getRowStateSnapshot;
147
139
  subscribeRowState(listener: RowStateListener<T, R>): () => boolean;
148
140
  private emitRowState;
149
141
  setCellValue<K extends keyof T & string>(row: number | string, colKey: K, next: Updater<T[K]>): void;
150
142
  setValueToSelection(next: Updater<unknown>): void;
151
- openFindReplaceDialog(mode?: FindReplaceMode): void;
152
- closeFindReplaceDialog(): void;
153
- private ensureFindReplace;
154
- private ensureFindReplaceSidebar;
155
- private teardownFindReplace;
156
143
  private stableValueKey;
157
144
  private ensureFilterSort;
158
145
  private ensureFilterSortEscape;