@ishibashi0112/spreadsheet-grid-core 0.40.0 → 0.41.1
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/README.md +25 -0
- package/dist/controllers/asyncSelectOptionsSource.cjs +1 -0
- package/dist/controllers/asyncSelectOptionsSource.d.ts +32 -0
- package/dist/controllers/asyncSelectOptionsSource.js +90 -0
- package/dist/controllers/autoHeightMeasurer.cjs +1 -1
- package/dist/controllers/autoHeightMeasurer.js +19 -19
- package/dist/controllers/columnAutosizeRunner.cjs +1 -1
- package/dist/controllers/columnAutosizeRunner.js +7 -7
- package/dist/controllers/filterPopoverController.cjs +1 -1
- package/dist/controllers/filterPopoverController.js +7 -7
- package/dist/controllers/pointerInteractionsController.cjs +1 -1
- package/dist/controllers/pointerInteractionsController.js +71 -71
- package/dist/controllers/selectOptionsCollector.cjs +1 -1
- package/dist/controllers/selectOptionsCollector.d.ts +4 -1
- package/dist/controllers/selectOptionsCollector.js +7 -7
- package/dist/engine/columnCommands.cjs +1 -1
- package/dist/engine/columnCommands.js +54 -54
- package/dist/engine/filterPopoverCommands.cjs +1 -1
- package/dist/engine/filterPopoverCommands.d.ts +5 -2
- package/dist/engine/filterPopoverCommands.js +12 -12
- package/dist/engine/notifiers.cjs +1 -1
- package/dist/engine/notifiers.d.ts +3 -1
- package/dist/engine/notifiers.js +11 -11
- package/dist/engine/rowPipeline.cjs +1 -1
- package/dist/engine/rowPipeline.d.ts +2 -0
- package/dist/engine/rowPipeline.js +19 -19
- package/dist/logic/gridHeight.cjs +1 -0
- package/dist/logic/gridHeight.d.ts +12 -0
- package/dist/logic/gridHeight.js +32 -0
- package/dist/logic/gridState.cjs +1 -1
- package/dist/logic/gridState.d.ts +5 -0
- package/dist/logic/gridState.js +10 -7
- package/dist/model/gridTypes.core.d.ts +1024 -0
- package/package.json +1 -1
|
@@ -109,6 +109,17 @@ export type GridSelectFilterOption = {
|
|
|
109
109
|
label: string;
|
|
110
110
|
value: string;
|
|
111
111
|
};
|
|
112
|
+
export type GetFilterOptionsParams<T, F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
113
|
+
columnKey: string;
|
|
114
|
+
column: GridColumn<T, F>;
|
|
115
|
+
columnFilters: Record<string, ColumnFilterValue>;
|
|
116
|
+
globalText: string;
|
|
117
|
+
signal: AbortSignal;
|
|
118
|
+
};
|
|
119
|
+
export type GetFilterOptionsResult = {
|
|
120
|
+
options: GridSelectFilterOption[];
|
|
121
|
+
truncated?: boolean;
|
|
122
|
+
};
|
|
112
123
|
export type ColumnFilterUiType = 'text' | 'textSet' | 'number' | 'numberSet' | 'date' | 'dateSet' | 'select' | 'set' | 'custom';
|
|
113
124
|
export type ColumnFilterTypeOption = ColumnFilterUiType | 'auto';
|
|
114
125
|
export type SetColumnFilterValue = {
|
|
@@ -244,14 +255,47 @@ export type DetailRowRenderContext<T> = {
|
|
|
244
255
|
sourceRowIndex: number;
|
|
245
256
|
collapse: () => void;
|
|
246
257
|
};
|
|
258
|
+
/**
|
|
259
|
+
* 展開行(Master/Detail)の設定です(`detailRow` prop)。指定したときだけ機能が有効になります。
|
|
260
|
+
*
|
|
261
|
+
* 各フィールドの説明は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
262
|
+
* の「展開行(Master/Detail)」節と同じ内容です。
|
|
263
|
+
*/
|
|
247
264
|
export type DetailRowOptions<T, F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
265
|
+
/**
|
|
266
|
+
* 展開行の中身。`ctx = { row, rowKey, rowIndex, sourceRowIndex, collapse }`(`rowIndex` はビュー行
|
|
267
|
+
* index、`collapse()` はその展開行を閉じる)。帯の内側のカード要素(`.ssg-detail-card`、
|
|
268
|
+
* `data-ssg-detail` 属性つき)に描画される。
|
|
269
|
+
*/
|
|
248
270
|
render: (ctx: DetailRowRenderContext<T>) => F['node'];
|
|
271
|
+
/**
|
|
272
|
+
* 帯の高さ(px)。**固定高**で、中身が超えるとカード内でスクロールする(auto 高は非対応)。
|
|
273
|
+
*
|
|
274
|
+
* @defaultValue `200`
|
|
275
|
+
*/
|
|
249
276
|
height?: number;
|
|
277
|
+
/**
|
|
278
|
+
* 行ごとの展開可否。`false` の行はトグルが描画されず、命令的 API / `ctx.detail.toggle()`
|
|
279
|
+
* からの展開も no-op。
|
|
280
|
+
*
|
|
281
|
+
* @defaultValue 全行展開可
|
|
282
|
+
*/
|
|
250
283
|
isExpandable?: (row: T, ctx: {
|
|
251
284
|
rowKey: GridRowKey;
|
|
252
285
|
sourceRowIndex: number;
|
|
253
286
|
}) => boolean;
|
|
287
|
+
/**
|
|
288
|
+
* 専用トグル列(幅 28px・タイトル無し、行ヘッダーの右隣 = 先頭列。左固定列があるときは左固定側)
|
|
289
|
+
* を自動挿入する。`false` にすると列は挿入されず、任意の列の `renderCell` から
|
|
290
|
+
* `ctx.detail.toggle()` でトグルを自前配置する(下記)。
|
|
291
|
+
*
|
|
292
|
+
* @defaultValue `true`
|
|
293
|
+
*/
|
|
254
294
|
showToggleColumn?: boolean;
|
|
295
|
+
/**
|
|
296
|
+
* カード要素へ追加する class(または `{ className, style }`。`classNames.detailCard`
|
|
297
|
+
* に加えて付与)。
|
|
298
|
+
*/
|
|
255
299
|
className?: GridSlotProps<F>;
|
|
256
300
|
};
|
|
257
301
|
export type LabelRowSortMode = 'section' | 'follow' | 'hide';
|
|
@@ -270,15 +314,58 @@ export type LabelRowRenderContext<T> = {
|
|
|
270
314
|
label: string;
|
|
271
315
|
sectionRowCount: number | undefined;
|
|
272
316
|
};
|
|
317
|
+
/**
|
|
318
|
+
* ラベル行(見出し / 区切り行)の設定です(`labelRow` prop)。指定したときだけ機能が有効になります。
|
|
319
|
+
*
|
|
320
|
+
* 各フィールドの説明は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
321
|
+
* の「ラベル行(見出し / 区切り行)」節と同じ内容です。
|
|
322
|
+
*/
|
|
273
323
|
export type LabelRowOptions<T, F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
324
|
+
/**
|
|
325
|
+
* ラベル行の識別。`rows` / 本関数が変わったときに全行を 1 パス評価するため純粋・軽量であること。
|
|
326
|
+
*/
|
|
274
327
|
isLabelRow: (row: T, sourceIndex: number) => boolean;
|
|
328
|
+
/** 表示文字列。既定描画(`render` 未指定時)/ エクスポート / `aria-label` に使う。 */
|
|
275
329
|
getLabel: (row: T) => string;
|
|
330
|
+
/**
|
|
331
|
+
* 中身の React 描画(装飾)。
|
|
332
|
+
* `ctx = { row, rowKey, rowIndex, sourceRowIndex, label, sectionRowCount }`(`sectionRowCount`
|
|
333
|
+
* はフィルター後のセクション内データ行数。serverSide では `undefined`)。
|
|
334
|
+
*/
|
|
276
335
|
render?: (ctx: LabelRowRenderContext<T>) => F['node'];
|
|
336
|
+
/**
|
|
337
|
+
* ラベル行の高さ(px)。行ごとに変えるときは関数。
|
|
338
|
+
*
|
|
339
|
+
* @defaultValue `rowHeight`
|
|
340
|
+
*/
|
|
277
341
|
height?: number | ((row: T) => number);
|
|
342
|
+
/** 行要素へ追加する class(または `{ className, style }`)。`classNames.labelRow` に加えて付与。 */
|
|
278
343
|
className?: GridSlotProps<F> | ((row: T) => GridSlotProps<F> | undefined);
|
|
344
|
+
/**
|
|
345
|
+
* 縦スクロール中、現在セクションのラベル行を列ヘッダー直下に固定する。
|
|
346
|
+
* 次のラベル行が到達すると押し上げられて交代する(clientSide のみ)。
|
|
347
|
+
*
|
|
348
|
+
* @defaultValue `false`
|
|
349
|
+
*/
|
|
279
350
|
sticky?: boolean;
|
|
351
|
+
/**
|
|
352
|
+
* ソート / フィルター適用時の扱い(下記)。
|
|
353
|
+
*
|
|
354
|
+
* @defaultValue `'section'`
|
|
355
|
+
*/
|
|
280
356
|
sortMode?: LabelRowSortMode;
|
|
357
|
+
/**
|
|
358
|
+
* フィルターで中身が 0 件になったセクションのラベル行を残す。
|
|
359
|
+
*
|
|
360
|
+
* @defaultValue `false`
|
|
361
|
+
*/
|
|
281
362
|
keepEmptySections?: boolean;
|
|
363
|
+
/**
|
|
364
|
+
* エクスポート(`includeLabelRows: true`)時の出力値。文字列は先頭列(他列は空)、
|
|
365
|
+
* 配列は列順にそのまま。
|
|
366
|
+
*
|
|
367
|
+
* @defaultValue `getLabel` を先頭列へ
|
|
368
|
+
*/
|
|
282
369
|
exportText?: (row: T) => string | ReadonlyArray<string | number | null | undefined>;
|
|
283
370
|
};
|
|
284
371
|
export type RowDragContext = {
|
|
@@ -407,41 +494,200 @@ export type GridGroupRow = {
|
|
|
407
494
|
leafCount: number;
|
|
408
495
|
aggregates: Record<string, unknown>;
|
|
409
496
|
};
|
|
497
|
+
/**
|
|
498
|
+
* 列定義です(`columns` prop の要素)。
|
|
499
|
+
*
|
|
500
|
+
* 各フィールドの説明は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
501
|
+
* の「GridColumn props」表と同じ内容です。
|
|
502
|
+
* 説明中の「〜節」「下記」は同ファイル内の節を指します。
|
|
503
|
+
*/
|
|
410
504
|
export type GridColumn<T, F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
505
|
+
/** 型推論用の内部マーカーです(実行時には存在しません)。指定しないでください。 */
|
|
411
506
|
readonly __framework?: F;
|
|
507
|
+
/** 列の一意キー。 */
|
|
412
508
|
key: string;
|
|
509
|
+
/**
|
|
510
|
+
* ヘッダーの表示ラベル。**未指定 / 空文字(`''`)のときは `key` を表示**(列メニュー /
|
|
511
|
+
* フィルターパネル / CSV ヘッダー等の列名表示も同じフォールバック)。
|
|
512
|
+
* ボタン専用列などで見出しを空にしたい場合は空白 1 文字(`' '`)等を指定する。
|
|
513
|
+
*/
|
|
413
514
|
title?: string;
|
|
515
|
+
/** 列幅(px)。 */
|
|
414
516
|
width: number;
|
|
517
|
+
/** リサイズ時の下限幅。flex 配分時の下限クランプにも使用(flex 列で未指定なら内部既定 50px)。 */
|
|
415
518
|
minWidth?: number;
|
|
519
|
+
/**
|
|
520
|
+
* 上限幅。**未指定なら上限なし**(autoSize は内容にぴったり合わせ、
|
|
521
|
+
* 手動リサイズも自由に広げられます。既定の上限は設けません)。指定すると autoSize / 手動リサイズ /
|
|
522
|
+
* flex 配分の上限クランプに使われます。
|
|
523
|
+
*/
|
|
416
524
|
maxWidth?: number;
|
|
525
|
+
/**
|
|
526
|
+
* 折り返し時(= `autoHeight` 列)の CSS `word-break`。`'auto-phrase'` は Chromium(Chrome / Edge)で
|
|
527
|
+
* BudouX による文節折り返し(Firefox / 一部 Safari 未対応)。**nowrap(非 `autoHeight`)
|
|
528
|
+
* 列では折り返し自体が起きないため効果なし**。既定(未指定)はブラウザ標準=禁則つき文字折り返し。
|
|
529
|
+
* 詳細は「日本語テキストの折り返し」節。
|
|
530
|
+
*/
|
|
417
531
|
wordBreak?: 'normal' | 'break-all' | 'keep-all' | 'break-word' | 'auto-phrase';
|
|
532
|
+
/**
|
|
533
|
+
* 折り返し時の CSS `line-break`(禁則処理の強さ)。`'strict'` で禁則を厳格化。`wordBreak` 同様、
|
|
534
|
+
* 折り返す列でのみ効果あり。
|
|
535
|
+
*/
|
|
418
536
|
lineBreak?: 'auto' | 'loose' | 'normal' | 'strict' | 'anywhere';
|
|
537
|
+
/**
|
|
538
|
+
* center 列(非 pinned)の伸縮比。余り幅(コンテナ幅 − 行ヘッダー − pinned 合計 − `width`
|
|
539
|
+
* 固定列の合計)を flex 比で配分し `minWidth`/`maxWidth` でクランプ。
|
|
540
|
+
* コンテナ追従でリアクティブに伸縮。手動リサイズで固定 px へ変化(`columns` 変化まで固定 → 以後
|
|
541
|
+
* flex 復帰)。pinned 列では無視。詳細は下記「flex と autoSize」節。
|
|
542
|
+
*/
|
|
419
543
|
flex?: number;
|
|
544
|
+
/**
|
|
545
|
+
* この列の手動リサイズ可否。`false` でヘッダーのリサイズハンドルを非表示。
|
|
546
|
+
* リサイズハンドルの**ダブルクリック**でその列を内容幅へ autoSize(`false`
|
|
547
|
+
* 時はハンドルが無いため不可。列メニューからの autoSize は引き続き可能)。
|
|
548
|
+
*
|
|
549
|
+
* @defaultValue グリッドの `enableColumnResize` を継承
|
|
550
|
+
*/
|
|
420
551
|
resizable?: boolean;
|
|
552
|
+
/**
|
|
553
|
+
* `true` で autoSize の対象外(列メニュー / 境界ダブルクリック /
|
|
554
|
+
* すべての列の自動調整すべてでスキップ)。consumer 指定の `width` を維持(固定幅優先)。
|
|
555
|
+
* テキストで測れないカスタムUI列や固定で見せたい列向けの per-column opt-in。
|
|
556
|
+
*
|
|
557
|
+
* @defaultValue `false`
|
|
558
|
+
*/
|
|
421
559
|
suppressAutoSize?: boolean;
|
|
560
|
+
/**
|
|
561
|
+
* autoSize の幅見積もり。指定列は「セル内容の content 幅(px・セルの padding/border を除く)」
|
|
562
|
+
* をこの関数から得て、**全行の最大 + セル枠**で確定します(テキスト/候補/実 DOM 計測を使わず、
|
|
563
|
+
* React mount もしません)。テキスト長が実描画幅と相関しない renderCell
|
|
564
|
+
* カスタムUI列(横並びバッジ等)向けの opt-in。返す値は `renderCell` の実描画幅と一致させること。
|
|
565
|
+
*/
|
|
422
566
|
estimateCellWidth?: (row: T, column: GridColumn<T, F>) => number;
|
|
567
|
+
/**
|
|
568
|
+
* この列が auto-height 行の高さを駆動(グリッドの `autoHeight` 有効時のみ)。**autoSize
|
|
569
|
+
* の対象外**(折り返し前提のため。下記「flex と autoSize」の制約を参照)。
|
|
570
|
+
*/
|
|
423
571
|
autoHeight?: boolean;
|
|
572
|
+
/** 列の表示/非表示。 */
|
|
424
573
|
visible?: boolean;
|
|
574
|
+
/** この列の編集を許可。 */
|
|
425
575
|
editable?: boolean;
|
|
576
|
+
/** この列を読み取り専用にする。 */
|
|
426
577
|
readOnly?: boolean;
|
|
578
|
+
/**
|
|
579
|
+
* 列固定の方向。
|
|
580
|
+
*
|
|
581
|
+
* @defaultValue undefined = 中央スクロール
|
|
582
|
+
*/
|
|
427
583
|
pinned?: GridColumnPinned;
|
|
584
|
+
/**
|
|
585
|
+
* `true` でこの列を行グルーピングの対象にする(複数指定時は `columns` 配列の出現順が階層順)。
|
|
586
|
+
* 有効時はグループ元列が表示から外れ、先頭に自動グループ列(ツリー表示)が注入される。**clientSide
|
|
587
|
+
* 限定**(serverSide では無視 + 開発時警告)。詳細は「行グルーピング + 集計」節。
|
|
588
|
+
*/
|
|
428
589
|
rowGroup?: boolean;
|
|
590
|
+
/**
|
|
591
|
+
* グルーピング時のこの列の集計。組み込みは値駆動の数値集計(`Number()`
|
|
592
|
+
* で有限になる値のみ対象・空値除外、`count` は配下 leaf 行数)。
|
|
593
|
+
* 関数でカスタム集計可(返り値がグループ行に表示)。`rowGroup` 列がないときは無視。
|
|
594
|
+
*/
|
|
429
595
|
aggFunc?: GridAggFuncName | GridAggFunc<T, F>;
|
|
596
|
+
/**
|
|
597
|
+
* 値アクセサ。
|
|
598
|
+
*
|
|
599
|
+
* @defaultValue `row[key]`
|
|
600
|
+
*/
|
|
430
601
|
getValue?: (row: T) => unknown;
|
|
602
|
+
/** 値ライター(新しい行を返す)。 */
|
|
431
603
|
setValue?: (row: T, value: unknown) => T;
|
|
604
|
+
/**
|
|
605
|
+
* カスタムセル描画。
|
|
606
|
+
*
|
|
607
|
+
* @defaultValue プレーン `<span>`
|
|
608
|
+
*/
|
|
432
609
|
renderCell?: (ctx: CellRenderContext<T, F>) => F['node'];
|
|
610
|
+
/**
|
|
611
|
+
* セルへ付与する追加 class(条件付きスタイル)。`GridSlotProps` = `string | { className?, style? }`
|
|
612
|
+
* で、StyleX の `stylex.props(...)` をそのまま返せる(`style` はセルへインライン付与。座標 /
|
|
613
|
+
* 寸法はグリッドが後勝ち)。関数版は値 / 状態に応じて返せる。`ctx` には view の `rowIndex` に加え
|
|
614
|
+
* source 基準の `sourceRowIndex` / `rowKey` が入る(ソート / フィルター ON でも source
|
|
615
|
+
* 行基準のデータと突き合わせ可能。「補助型」節参照)。基底 `.ssg-body-cell` は未レイヤー・特異度
|
|
616
|
+
* (0,1,0)。確実な上書きは `.ssg-body-cell.my-class` の連結を推奨。
|
|
617
|
+
*/
|
|
433
618
|
cellClassName?: GridSlotProps<F> | ((ctx: CellStyleContext<T, F>) => GridSlotProps<F> | undefined);
|
|
619
|
+
/**
|
|
620
|
+
* セル内容の水平寄せ(UI 表示のみ・元の値は不変)。セル表示と編集 input に反映。
|
|
621
|
+
*
|
|
622
|
+
* @defaultValue `'left'`
|
|
623
|
+
*/
|
|
434
624
|
align?: 'left' | 'center' | 'right';
|
|
625
|
+
/**
|
|
626
|
+
* セル表示値の整形(UI 表示のみ)。`renderCell` 未指定の既定セルが返り値を表示。組み込み
|
|
627
|
+
* `numberFormatter` 等を渡せる。元の値/編集/コピー/ソート/フィルターには影響しない。
|
|
628
|
+
*/
|
|
435
629
|
valueFormatter?: CellValueFormatter<T, F>;
|
|
630
|
+
/** カスタムヘッダー描画。 */
|
|
436
631
|
renderHeader?: (ctx: HeaderRenderContext<T, F>) => F['node'];
|
|
632
|
+
/**
|
|
633
|
+
* フィルター UI の種別。`'auto'` は列の値から `numberSet` / `textSet` / `dateSet` を自動判定する
|
|
634
|
+
* opt-in(下記「filterType: 'auto'(自動判定)」節)。`'numberSet'` / `'textSet'` / `'dateSet'`
|
|
635
|
+
* は条件(演算子 + 値)と Set 一覧を 1 つの popover に縦に並べて **AND
|
|
636
|
+
* 結合**する複合フィルター(条件を適用すると Set 候補が連動して絞られる。
|
|
637
|
+
* 候補外になった値の選択は破棄せず保持)。numberSet の演算子は 以上 / より大きい / 以下 / 未満 /
|
|
638
|
+
* に等しい / に等しくない / 範囲 / 空白 / 空白でない、textSet は を含む / に等しい / で始まる /
|
|
639
|
+
* で終わる / 空白 / 空白でない(判定は大文字小文字無視)。dateSet は 範囲 / 以降 / 以前 / に等しい
|
|
640
|
+
* / に等しくない / 空白 / 空白でない + 相対プリセット(今日 / 今月 / 過去 30
|
|
641
|
+
* 日。**相対のまま保存され評価のたびに解決**)で、Set 部分は年 / 月 / 日の 3 階層ツリー(親は 3
|
|
642
|
+
* 状態チェック)になる。
|
|
643
|
+
*/
|
|
437
644
|
filterType?: ColumnFilterTypeOption;
|
|
645
|
+
/**
|
|
646
|
+
* select / set / numberSet / textSet / dateSet の候補(readonly / `as const` 配列も可)。
|
|
647
|
+
*
|
|
648
|
+
* @defaultValue rows から自動収集
|
|
649
|
+
*/
|
|
438
650
|
filterOptions?: readonly GridSelectFilterOption[];
|
|
651
|
+
/**
|
|
652
|
+
* dateSet の相対プリセットチップの構成。`false` / `[]` でチップ行を非表示(オプトアウト)。
|
|
653
|
+
* 配列はビルトイン ID(`'today'` / `'thisMonth'` / `'last30days'`)の再利用とカスタム定義
|
|
654
|
+
* `{ id, label, resolve }` を表示順のまま混在可。詳細は下記「dateSet
|
|
655
|
+
* の相対プリセット(dateFilterPresets)」節。
|
|
656
|
+
*
|
|
657
|
+
* @defaultValue ビルトイン 3 種
|
|
658
|
+
*/
|
|
439
659
|
dateFilterPresets?: false | readonly DateFilterPresetOption[];
|
|
660
|
+
/** カスタムフィルター述語。 */
|
|
440
661
|
filterFn?: (row: T, filterValue: unknown) => boolean;
|
|
662
|
+
/**
|
|
663
|
+
* セルエディタ種別(判別共用体)。
|
|
664
|
+
* `{ type: 'text' | 'number' | 'select' | 'date' | 'checkbox' | 'custom', ... }`。
|
|
665
|
+
* 詳細は「セルエディタ」節。
|
|
666
|
+
*
|
|
667
|
+
* @defaultValue text 相当
|
|
668
|
+
*/
|
|
441
669
|
editor?: GridColumnEditor<T, F>;
|
|
670
|
+
/**
|
|
671
|
+
* セル値の検証。`true`=有効 / `false`=無効(既定メッセージ)/
|
|
672
|
+
* `string`・`{ message }`=無効+メッセージ。**純粋・軽量であること**(描画中の可視セルごとに毎レンダー評価。
|
|
673
|
+
* `cellClassName` 関数と同コスト階級)。詳細は「バリデーション」節。
|
|
674
|
+
*/
|
|
442
675
|
validate?: (ctx: CellValidationContext<T, F>) => CellValidationResult;
|
|
676
|
+
/**
|
|
677
|
+
* 検証 NG 時の動作。`'mark'`=値は入るがセルに invalid 表示 / `'reject'`=書き込み自体を拒否。
|
|
678
|
+
*
|
|
679
|
+
* @defaultValue `'mark'`
|
|
680
|
+
*/
|
|
443
681
|
validationMode?: GridValidationMode;
|
|
682
|
+
/**
|
|
683
|
+
* 「文字列 → セル値」のパーサ(貼り付け / クリア / エディタ commit
|
|
684
|
+
* で共通)。**明示指定が常に優先**。未指定で `editor` が number / date / checkbox
|
|
685
|
+
* のときは種別の既定パーサが自動供給されます(「セルエディタ」節の表参照)。
|
|
686
|
+
*
|
|
687
|
+
* @defaultValue editor 既定パーサ
|
|
688
|
+
*/
|
|
444
689
|
parseClipboardValue?: (raw: string, row: T) => unknown;
|
|
690
|
+
/** コピー時のフォーマッタ。 */
|
|
445
691
|
formatClipboardValue?: (value: unknown, row: T) => string;
|
|
446
692
|
};
|
|
447
693
|
export type ColumnResizeDragState = {
|
|
@@ -530,12 +776,37 @@ export type GridContextMenuTarget<T, F extends GridFrameworkTypes = GridFramewor
|
|
|
530
776
|
rowKey: GridRowKey;
|
|
531
777
|
row: T;
|
|
532
778
|
};
|
|
779
|
+
/**
|
|
780
|
+
* `getContextMenuItems` / `onContextMenuOpen` へ渡る右クリックの文脈です。
|
|
781
|
+
*
|
|
782
|
+
* 各フィールドの説明は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
783
|
+
* の「コンテキストメニュー」節と同じ内容です。
|
|
784
|
+
*/
|
|
533
785
|
export type GridContextMenuParams<T, F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
786
|
+
/**
|
|
787
|
+
* 右クリック対象。`{ type:'cell', rowIndex, colIndex, rowKey, row, column, value }` か
|
|
788
|
+
* `{ type:'rowHeader', rowIndex, rowKey, row }`(行NO ガター)。`rowIndex` はビュー行 index、
|
|
789
|
+
* `colIndex` は論理列 index(視覚順 左→中央→右 = `handle.selectCell` と同一空間)。
|
|
790
|
+
*/
|
|
534
791
|
target: GridContextMenuTarget<T, F>;
|
|
792
|
+
/**
|
|
793
|
+
* `clientX` / `clientY`: 右クリックのビューポート座標(メニュー配置に使用済み。
|
|
794
|
+
* 分岐の判断材料にも)。
|
|
795
|
+
*/
|
|
535
796
|
clientX: number;
|
|
797
|
+
/**
|
|
798
|
+
* `clientX` / `clientY`: 右クリックのビューポート座標(メニュー配置に使用済み。
|
|
799
|
+
* 分岐の判断材料にも)。
|
|
800
|
+
*/
|
|
536
801
|
clientY: number;
|
|
802
|
+
/** 現在のセル範囲選択。チェックボックス行選択は `handle.getRowSelection()` で別途取得。 */
|
|
537
803
|
selection: GridSelection;
|
|
804
|
+
/** 現在のアクティブセル。 */
|
|
538
805
|
activeCell: CellCoord | null;
|
|
806
|
+
/**
|
|
807
|
+
* 対象(cell はそのセル / rowHeader はその行)が `selection` に含まれるか。「選択範囲への操作」
|
|
808
|
+
* か「単一対象への操作」かを分岐する簡便値。
|
|
809
|
+
*/
|
|
539
810
|
isTargetSelected: boolean;
|
|
540
811
|
};
|
|
541
812
|
export type GridContextMenuActionItem<F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
@@ -573,34 +844,110 @@ export type GridResolvedSlot<F extends GridFrameworkTypes = GridFrameworkTypes>
|
|
|
573
844
|
style?: F['style'];
|
|
574
845
|
};
|
|
575
846
|
export type GridResolvedSlots<F extends GridFrameworkTypes = GridFrameworkTypes> = Partial<Record<keyof GridClassNames<F>, GridResolvedSlot<F>>>;
|
|
847
|
+
/**
|
|
848
|
+
* パーツ別スロット(`classNames` prop)です。各値は class 文字列か `{ className, style }` です。
|
|
849
|
+
*
|
|
850
|
+
* 各スロットの付与先は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
851
|
+
* の「パーツ別スロット」節と同じ内容です。
|
|
852
|
+
*/
|
|
576
853
|
export type GridClassNames<F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
854
|
+
/** 付与先: ルート要素 `.ssg-root`(`className` / `style` prop と同じ要素) */
|
|
577
855
|
root?: GridSlotProps<F>;
|
|
856
|
+
/**
|
|
857
|
+
* `toolbar` / `statusBar`: 付与先: 既定トップバー `.ssg-bar--top` / 既定ボトムバー
|
|
858
|
+
* `.ssg-bar--bottom`(`renderTopBar` / `renderBottomBar` 指定時は対象外)
|
|
859
|
+
*/
|
|
578
860
|
toolbar?: GridSlotProps<F>;
|
|
861
|
+
/**
|
|
862
|
+
* `toolbar` / `statusBar`: 付与先: 既定トップバー `.ssg-bar--top` / 既定ボトムバー
|
|
863
|
+
* `.ssg-bar--bottom`(`renderTopBar` / `renderBottomBar` 指定時は対象外)
|
|
864
|
+
*/
|
|
579
865
|
statusBar?: GridSlotProps<F>;
|
|
866
|
+
/**
|
|
867
|
+
* `headerRow` / `headerCell`: 付与先: ヘッダー行 /
|
|
868
|
+
* 列ヘッダーセル(コーナー・行ヘッダーセルは含まない)
|
|
869
|
+
*/
|
|
580
870
|
headerRow?: GridSlotProps<F>;
|
|
871
|
+
/**
|
|
872
|
+
* `headerRow` / `headerCell`: 付与先: ヘッダー行 /
|
|
873
|
+
* 列ヘッダーセル(コーナー・行ヘッダーセルは含まない)
|
|
874
|
+
*/
|
|
581
875
|
headerCell?: GridSlotProps<F>;
|
|
876
|
+
/** `bodyRow` / `bodyCell`: 付与先: 本体行(データ / スケルトン / グループ行)/ データセル */
|
|
582
877
|
bodyRow?: GridSlotProps<F>;
|
|
878
|
+
/** `bodyRow` / `bodyCell`: 付与先: 本体行(データ / スケルトン / グループ行)/ データセル */
|
|
583
879
|
bodyCell?: GridSlotProps<F>;
|
|
880
|
+
/**
|
|
881
|
+
* `rowHeaderCell` / `cornerCell`: 付与先: 行ヘッダー「#」セルとコーナーセル(`rowHeaderCell`
|
|
882
|
+
* は両方、`cornerCell` はコーナーのみ)
|
|
883
|
+
*/
|
|
584
884
|
rowHeaderCell?: GridSlotProps<F>;
|
|
885
|
+
/** 付与先: ヘッダーのアイコンボタン `.ssg-icon-btn` */
|
|
585
886
|
iconButton?: GridSlotProps<F>;
|
|
887
|
+
/**
|
|
888
|
+
* `rowHeaderCell` / `cornerCell`: 付与先: 行ヘッダー「#」セルとコーナーセル(`rowHeaderCell`
|
|
889
|
+
* は両方、`cornerCell` はコーナーのみ)
|
|
890
|
+
*/
|
|
586
891
|
cornerCell?: GridSlotProps<F>;
|
|
892
|
+
/**
|
|
893
|
+
* `groupRow` / `groupCell`: 付与先: グループ行 / グループ行のセル(`bodyRow` / `bodyCell`
|
|
894
|
+
* に加えて付与)
|
|
895
|
+
*/
|
|
587
896
|
groupRow?: GridSlotProps<F>;
|
|
897
|
+
/**
|
|
898
|
+
* `groupRow` / `groupCell`: 付与先: グループ行 / グループ行のセル(`bodyRow` / `bodyCell`
|
|
899
|
+
* に加えて付与)
|
|
900
|
+
*/
|
|
588
901
|
groupCell?: GridSlotProps<F>;
|
|
902
|
+
/**
|
|
903
|
+
* `detailBand` / `detailCard`: 付与先: 展開行の帯 / カード(`detailRow.className` に加えて付与)
|
|
904
|
+
*/
|
|
589
905
|
detailBand?: GridSlotProps<F>;
|
|
906
|
+
/**
|
|
907
|
+
* `detailBand` / `detailCard`: 付与先: 展開行の帯 / カード(`detailRow.className` に加えて付与)
|
|
908
|
+
*/
|
|
590
909
|
detailCard?: GridSlotProps<F>;
|
|
910
|
+
/**
|
|
911
|
+
* `labelRow` / `labelRowContent`: 付与先: ラベル行(見出し / 区切り行)の行要素
|
|
912
|
+
* `.ssg-body-row[data-ssg-label-row]`(`bodyRow` / `labelRow.className` に加えて付与。
|
|
913
|
+
* 縦固定の複製にも付く)/ 中身の器 `.ssg-label-row-content`
|
|
914
|
+
*/
|
|
591
915
|
labelRow?: GridSlotProps<F>;
|
|
916
|
+
/**
|
|
917
|
+
* `labelRow` / `labelRowContent`: 付与先: ラベル行(見出し / 区切り行)の行要素
|
|
918
|
+
* `.ssg-body-row[data-ssg-label-row]`(`bodyRow` / `labelRow.className` に加えて付与。
|
|
919
|
+
* 縦固定の複製にも付く)/ 中身の器 `.ssg-label-row-content`
|
|
920
|
+
*/
|
|
592
921
|
labelRowContent?: GridSlotProps<F>;
|
|
922
|
+
/**
|
|
923
|
+
* 付与先: ポータル系パネルの root(列メニュー / フィルター / コンテキストメニュー / select
|
|
924
|
+
* エディタ候補 / ツールパネル。`document.body` 直下)
|
|
925
|
+
*/
|
|
593
926
|
popover?: GridSlotProps<F>;
|
|
927
|
+
/** 付与先: メニュー項目 `.ssg-menu-item`(列メニュー / コンテキストメニュー) */
|
|
594
928
|
menuItem?: GridSlotProps<F>;
|
|
929
|
+
/**
|
|
930
|
+
* 付与先: カスタムツールチップ `.ssg-tooltip`(body 直下のシングルトン。
|
|
931
|
+
* 複数グリッド同居時は最後に更新したグリッドの値)
|
|
932
|
+
*/
|
|
595
933
|
tooltip?: GridSlotProps<F>;
|
|
934
|
+
/** 付与先: 列 / 行ドラッグのゴースト `[data-grid-drag-ghost]` */
|
|
596
935
|
dragGhost?: GridSlotProps<F>;
|
|
936
|
+
/** 付与先: 行選択 / checkbox 列のチェックボックス glyph `.ssg-row-checkbox` */
|
|
597
937
|
checkbox?: GridSlotProps<F>;
|
|
938
|
+
/** 付与先: セルエディタの枠 `.ssg-cell-editor` */
|
|
598
939
|
cellEditor?: GridSlotProps<F>;
|
|
940
|
+
/** 付与先: 0 行時の空状態 `.ssg-empty-state` */
|
|
599
941
|
emptyState?: GridSlotProps<F>;
|
|
942
|
+
/** 付与先: フィルターチップバー `.ssg-filter-chip-bar` */
|
|
600
943
|
filterChipBar?: GridSlotProps<F>;
|
|
944
|
+
/** 付与先: SSRM のエラーバー `.ssg-ssrm-error-bar` */
|
|
601
945
|
errorBar?: GridSlotProps<F>;
|
|
946
|
+
/** 付与先: スクロール位置インジケーター `.ssg-scroll-hint` */
|
|
602
947
|
scrollHint?: GridSlotProps<F>;
|
|
948
|
+
/** `activeCellOverlay` / `selectionOverlay`: 付与先: アクティブセル枠 / 範囲選択の塗り */
|
|
603
949
|
activeCellOverlay?: GridSlotProps<F>;
|
|
950
|
+
/** `activeCellOverlay` / `selectionOverlay`: 付与先: アクティブセル枠 / 範囲選択の塗り */
|
|
604
951
|
selectionOverlay?: GridSlotProps<F>;
|
|
605
952
|
};
|
|
606
953
|
export type ScrollAlign = 'auto' | 'start' | 'center' | 'end';
|
|
@@ -663,68 +1010,192 @@ export type GridState = {
|
|
|
663
1010
|
sort: GridSortState;
|
|
664
1011
|
columns?: GridColumnState[];
|
|
665
1012
|
};
|
|
1013
|
+
/**
|
|
1014
|
+
* 命令的 API です(`ref` prop で受け取るハンドル)。状態は props で controlled のまま、props で表現しづらい
|
|
1015
|
+
* 一発操作(スクロール / 選択 / エクスポート / 状態の保存・復元など)だけを提供します。
|
|
1016
|
+
* `viewRowIndex` / `colIndex` はビュー座標(フィルター / ソート適用後の表示 index。`colIndex` は固定列を含む
|
|
1017
|
+
* 左→中央→右の視覚順)です。
|
|
1018
|
+
*
|
|
1019
|
+
* 各メソッドの説明は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
1020
|
+
* の「命令的 API」節の表と同じ内容です。
|
|
1021
|
+
*/
|
|
666
1022
|
export type SpreadsheetGridHandle<T> = {
|
|
1023
|
+
/**
|
|
1024
|
+
* 指定行を可視域へ。`align`(既定 `'auto'`): `'auto'`(最小スクロール) / `'start'` / `'center'` /
|
|
1025
|
+
* `'end'`。
|
|
1026
|
+
*/
|
|
667
1027
|
scrollToRow: (viewRowIndex: number, options?: {
|
|
668
1028
|
align?: ScrollAlign;
|
|
669
1029
|
}) => void;
|
|
1030
|
+
/** 指定セルを縦横とも可視域へ。固定列(左右ピン)は常に可視のため横スクロールしない。 */
|
|
670
1031
|
scrollToCell: (viewRowIndex: number, colIndex: number, options?: {
|
|
671
1032
|
align?: ScrollAlign;
|
|
672
1033
|
}) => void;
|
|
1034
|
+
/** `scrollToTop()` / `scrollToBottom()`: 先頭 / 末尾へ。 */
|
|
673
1035
|
scrollToTop: () => void;
|
|
1036
|
+
/** `scrollToTop()` / `scrollToBottom()`: 先頭 / 末尾へ。 */
|
|
674
1037
|
scrollToBottom: () => void;
|
|
1038
|
+
/** 現在描画中の行ウィンドウ `{ startIndex, endIndex }`(end 排他)。空は `null`。 */
|
|
675
1039
|
getVisibleRowRange: () => {
|
|
676
1040
|
startIndex: number;
|
|
677
1041
|
endIndex: number;
|
|
678
1042
|
} | null;
|
|
1043
|
+
/**
|
|
1044
|
+
* 現在のスクロール位置 `{ top, left }`(px)。値はスクロールコンテナの生の `scrollTop` /
|
|
1045
|
+
* `scrollLeft` で、`setScrollPosition` / `onScroll` と同一基準(往復で一貫)。未マウント時は
|
|
1046
|
+
* `null`。
|
|
1047
|
+
*/
|
|
679
1048
|
getScrollPosition: () => GridScrollPosition | null;
|
|
1049
|
+
/**
|
|
1050
|
+
* スクロール位置の設定(px)。省略側は現状維持・スクロール可能範囲へクランプ。`behavior` は
|
|
1051
|
+
* `'auto'`(既定・即時)/ `'smooth'`。2 グリッドの双方向同期では `'auto'` を推奨(`'smooth'`
|
|
1052
|
+
* は途中フレームの `onScroll` が `source:'user'` になり得る)。
|
|
1053
|
+
*/
|
|
680
1054
|
setScrollPosition: (position: {
|
|
681
1055
|
top?: number;
|
|
682
1056
|
left?: number;
|
|
683
1057
|
}, options?: {
|
|
684
1058
|
behavior?: 'auto' | 'smooth';
|
|
685
1059
|
}) => void;
|
|
1060
|
+
/** 現在のアクティブセル `{ row, col }`(なければ `null`)。 */
|
|
686
1061
|
getActiveCell: () => CellCoord | null;
|
|
1062
|
+
/** アクティブセル設定(`null` で解除)。`scrollIntoView` で可視化も行う。 */
|
|
687
1063
|
setActiveCell: (cell: CellCoord | null, options?: {
|
|
688
1064
|
scrollIntoView?: boolean;
|
|
689
1065
|
}) => void;
|
|
1066
|
+
/** 現在の選択状態(`GridSelection`)。 */
|
|
690
1067
|
getSelection: () => GridSelection;
|
|
1068
|
+
/** 単一セル選択(クリック相当)。 */
|
|
691
1069
|
selectCell: (viewRowIndex: number, colIndex: number, options?: {
|
|
692
1070
|
scrollIntoView?: boolean;
|
|
693
1071
|
}) => void;
|
|
1072
|
+
/** セル範囲選択(ドラッグ相当)。アンカーは `range.start`。 */
|
|
694
1073
|
selectRange: (range: CellRange, options?: {
|
|
695
1074
|
scrollIntoView?: boolean;
|
|
696
1075
|
}) => void;
|
|
1076
|
+
/** 選択解除。 */
|
|
697
1077
|
clearSelection: () => void;
|
|
1078
|
+
/** 選択に交差する行(distinct)を返す。serverSide はロード済み行のみ。 */
|
|
698
1079
|
getSelectedRows: () => T[];
|
|
1080
|
+
/** CSV 文字列を返す(純粋・副作用なし)。 */
|
|
699
1081
|
exportCsv: (options?: CsvExportOptions) => string;
|
|
1082
|
+
/**
|
|
1083
|
+
* `exportCsv` の結果を `.csv` としてダウンロード(`filename` 既定 `'export.csv'`、`bom` 既定
|
|
1084
|
+
* `true`)。
|
|
1085
|
+
*/
|
|
700
1086
|
downloadCsv: (filename?: string, options?: CsvExportOptions) => void;
|
|
1087
|
+
/** 列メタ + 2 次元セルの、シリアライズ非依存な整形済みデータを返す(純粋・副作用なし)。 */
|
|
701
1088
|
getExportData: (options?: GridExportOptions) => GridExportData;
|
|
1089
|
+
/**
|
|
1090
|
+
* 永続化対象(手動リサイズ幅 / フィルター / ソート)のスナップショット `GridState`
|
|
1091
|
+
* を返す(純粋・副作用なし)。新規オブジェクトなのでそのまま `JSON.stringify` して保存できる。
|
|
1092
|
+
*/
|
|
702
1093
|
getState: () => GridState;
|
|
1094
|
+
/**
|
|
1095
|
+
* `getState()` の値(または互換な部分形)を適用する。外部入力は内部で防御的に正規化され、幅 reset /
|
|
1096
|
+
* フィルター一括 / ソート set の 3 dispatch(1 イベント = 1 再レンダー)で反映。clientSide /
|
|
1097
|
+
* serverSide 双方に効く(SSRM は `filters`/`sort` 変化がクエリへ載り再取得)。
|
|
1098
|
+
*/
|
|
703
1099
|
applyState: (state: GridState) => void;
|
|
1100
|
+
/** 現在の行選択記述子(`RowSelectionModel`)。 */
|
|
704
1101
|
getRowSelection: () => RowSelectionModel;
|
|
1102
|
+
/**
|
|
1103
|
+
* 行選択記述子を設定。controlled 時は `onRowSelectionChange` 経由で親へ委譲(内部 state
|
|
1104
|
+
* は書かない)。
|
|
1105
|
+
*/
|
|
705
1106
|
setRowSelection: (model: RowSelectionModel) => void;
|
|
1107
|
+
/**
|
|
1108
|
+
* 選択中の行キー配列。`include` はそのまま O(選択数)、`exclude`
|
|
1109
|
+
* は現在の全行から除外を差し引いて列挙(O(行数))。serverSide はロード済みキーのみ。
|
|
1110
|
+
*/
|
|
706
1111
|
getSelectedRowKeys: () => GridRowKey[];
|
|
1112
|
+
/**
|
|
1113
|
+
* 選択中の行データ。行の探索が要るため O(行数)。キーで足りるなら `getSelectedRowKeys()` を推奨。
|
|
1114
|
+
* serverSide はロード済み行のみ。
|
|
1115
|
+
*/
|
|
707
1116
|
getSelectedRowData: () => T[];
|
|
1117
|
+
/** 選択件数。`exclude` は 総行数 − 除外数 で一定コスト。 */
|
|
708
1118
|
getSelectedRowCount: () => number;
|
|
1119
|
+
/** 指定キーが選択中かを O(1) 判定。 */
|
|
709
1120
|
isRowSelected: (rowKey: GridRowKey) => boolean;
|
|
1121
|
+
/** 全行を選択(exclude モード=キーを列挙しない)。 */
|
|
710
1122
|
selectAllRows: () => void;
|
|
1123
|
+
/** 行選択をすべて解除。 */
|
|
711
1124
|
clearRowSelection: () => void;
|
|
1125
|
+
/** 直近のグリッド編集を取り消す(`Ctrl/Cmd+Z` 相当)。無効条件下・履歴が空のときは no-op。 */
|
|
712
1126
|
undo: () => void;
|
|
1127
|
+
/**
|
|
1128
|
+
* undo で取り消した編集をやり直す(`Ctrl/Cmd+Shift+Z` / `Ctrl/Cmd+Y` 相当)。undo
|
|
1129
|
+
* 後に新しい編集が入った時点で redo 系譜は破棄される。
|
|
1130
|
+
*/
|
|
713
1131
|
redo: () => void;
|
|
1132
|
+
/** `canUndo()` / `canRedo()`: undo / redo 可能かを返す(無効条件下では常に `false`)。 */
|
|
714
1133
|
canUndo: () => boolean;
|
|
1134
|
+
/** `canUndo()` / `canRedo()`: undo / redo 可能かを返す(無効条件下では常に `false`)。 */
|
|
715
1135
|
canRedo: () => boolean;
|
|
1136
|
+
/**
|
|
1137
|
+
* 編集履歴を破棄する(rows は変更しない)。rows
|
|
1138
|
+
* の外部差し替えはグリッド側でも自動検知して破棄するため、通常は呼ばなくてよい。
|
|
1139
|
+
*/
|
|
716
1140
|
clearUndoHistory: () => void;
|
|
1141
|
+
/**
|
|
1142
|
+
* 指定グループを開閉する(`collapsed: true` = 折りたたみ)。`groupKey` は `getGroupRows()`
|
|
1143
|
+
* の記述子から取得。同一イベント内の連続呼び出しも正しく積み重なる。
|
|
1144
|
+
*/
|
|
717
1145
|
setGroupCollapsed: (groupKey: string, collapsed: boolean) => void;
|
|
1146
|
+
/** `expandAllGroups()` / `collapseAllGroups()`: すべてのグループを展開 / 折りたたむ。 */
|
|
718
1147
|
expandAllGroups: () => void;
|
|
1148
|
+
/** `expandAllGroups()` / `collapseAllGroups()`: すべてのグループを展開 / 折りたたむ。 */
|
|
719
1149
|
collapseAllGroups: () => void;
|
|
1150
|
+
/** 全グループ行の記述子(`GridGroupRow[]`)を DFS 順(表示順)で返す。開閉状態に関わらず全件。 */
|
|
720
1151
|
getGroupRows: () => GridGroupRow[];
|
|
1152
|
+
/**
|
|
1153
|
+
* 指定行キー(`rowKeyGetter` の値)の展開行を開閉する。`isExpandable` が `false` の行は no-op。
|
|
1154
|
+
* 行がまだロードされていない / フィルターで除外中でもキーは保持され、
|
|
1155
|
+
* 表示可能になった時点で帯が出る。同一イベント内の連続呼び出しも正しく積み重なる。
|
|
1156
|
+
*/
|
|
721
1157
|
setDetailRowExpanded: (rowKey: GridRowKey, expanded: boolean) => void;
|
|
1158
|
+
/** 展開中の行キーを返す(`GridRowKey[]`)。 */
|
|
722
1159
|
getExpandedDetailRowKeys: () => GridRowKey[];
|
|
1160
|
+
/**
|
|
1161
|
+
* すべての展開行を閉じる。「すべて開く」
|
|
1162
|
+
* は提供しない(表示中の全行をまとめて開くと帯の合計高が大きくなりやすいため。必要なら
|
|
1163
|
+
* `setDetailRowExpanded` を行ごとに呼ぶ)。
|
|
1164
|
+
*/
|
|
723
1165
|
collapseAllDetailRows: () => void;
|
|
1166
|
+
/**
|
|
1167
|
+
* 指定行キーの行を元 `rows` 配列の `toIndex` へ移動する(clientSide + `onRowsChange` 指定時のみ。
|
|
1168
|
+
* `enableRowDrag` / ソート / フィルターの状態には依存しない)。`onRowsChange`(履歴ラッパ経由 =
|
|
1169
|
+
* undo 対象)→ `onRowMove` の順に呼ばれる。未知のキー / 同一位置 / 範囲外は no-op。serverSide
|
|
1170
|
+
* では開発時警告 + no-op。
|
|
1171
|
+
*/
|
|
724
1172
|
moveRow: (rowKey: GridRowKey, toIndex: number) => void;
|
|
1173
|
+
/**
|
|
1174
|
+
* `validate` 指定列 × 全ソース行をオンデマンドで全走査し、invalid セルの一覧(`GridInvalidCell[]`
|
|
1175
|
+
* = `{ rowKey, sourceRowIndex, columnKey, message }`)を返す。保存前チェック用。invalid
|
|
1176
|
+
* 表示は表示時導出のため状態を持たず、**呼ばれた時だけ計算**する(明示的な呼び出し =
|
|
1177
|
+
* 明示的なコスト)。**`showValidationMarks`
|
|
1178
|
+
* の表示状態と無関係に常に動作する**(マーク非表示中の送信前チェックに使える)。
|
|
1179
|
+
* 非表示列も対象(見えない列の不正値も検出)。clientSide 専用で、serverSide
|
|
1180
|
+
* は全行を保持しないため空配列 + `console.warn`。
|
|
1181
|
+
*/
|
|
725
1182
|
getInvalidCells: () => GridInvalidCell[];
|
|
1183
|
+
/**
|
|
1184
|
+
* serverSide(`dataSource`)のソフトリフレッシュ。クエリ(フィルター/ソート/グローバル)
|
|
1185
|
+
* を変えずにキャッシュを破棄し、**スクロール位置を保ったまま現在の可視レンジを即時**(debounce
|
|
1186
|
+
* なし)取り直す。件数は到着ブロックの `totalRowCount` で追従。宣言的に扱いたい場合は同挙動の
|
|
1187
|
+
* `serverSideRefreshToken` prop もある(「serverSide モード」の節を参照)。clientSide(`rows`)
|
|
1188
|
+
* では警告付き no-op。
|
|
1189
|
+
*/
|
|
726
1190
|
refreshServerSide: () => void;
|
|
1191
|
+
/**
|
|
1192
|
+
* フィルター管理パネル(適用中の列フィルターの一覧 / 該当列へジャンプして編集 / 個別・全クリア /
|
|
1193
|
+
* 追加)を開く。`enableColumnFilter=false` のときは何もしない。列メニューの「フィルターを管理…」/
|
|
1194
|
+
* 既定トップバーの **Filters chip クリック**(`enableColumnFilter=true` 時にクリック可能)
|
|
1195
|
+
* と同じパネル。
|
|
1196
|
+
*/
|
|
727
1197
|
openFilterManager: () => void;
|
|
1198
|
+
/** フィルター管理パネルを閉じる(開いていなければ何もしない)。 */
|
|
728
1199
|
closeFilterManager: () => void;
|
|
729
1200
|
};
|
|
730
1201
|
export type GridDensity = 'compact' | 'standard' | 'comfortable';
|
|
@@ -735,97 +1206,650 @@ export type ScrollHintRenderArgs<T> = {
|
|
|
735
1206
|
rowIndex: number;
|
|
736
1207
|
rowData: T | undefined;
|
|
737
1208
|
};
|
|
1209
|
+
/**
|
|
1210
|
+
* スクロール位置インジケーターの設定です(`scrollHint` prop。`true` は全項目既定値と同義)。
|
|
1211
|
+
*
|
|
1212
|
+
* 各フィールドの説明は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
1213
|
+
* の「スクロール位置インジケーター」節と同じ内容です。
|
|
1214
|
+
*/
|
|
738
1215
|
export type ScrollHintOptions<T = unknown, F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
1216
|
+
/**
|
|
1217
|
+
* 行番号バブルの表示。
|
|
1218
|
+
*
|
|
1219
|
+
* @defaultValue `true`
|
|
1220
|
+
*/
|
|
739
1221
|
bubble?: boolean;
|
|
1222
|
+
/**
|
|
1223
|
+
* ルーラー + ジャンプ先プレビューの表示。
|
|
1224
|
+
*
|
|
1225
|
+
* @defaultValue `true`
|
|
1226
|
+
*/
|
|
740
1227
|
ruler?: boolean;
|
|
1228
|
+
/**
|
|
1229
|
+
* カスタム縦スクロールバー(専用ガター・常時表示)。`false`
|
|
1230
|
+
* でネイティブバーのまま(バブル等は疑似サム位置に表示)。
|
|
1231
|
+
*
|
|
1232
|
+
* @defaultValue `true`
|
|
1233
|
+
*/
|
|
741
1234
|
scrollbar?: boolean;
|
|
1235
|
+
/**
|
|
1236
|
+
* バブル / ルーラーの表示トリガー(スクロールバー自体は常時表示)。`'scroll'` =
|
|
1237
|
+
* スクロール中のみ(停止約 1 秒でフェードアウト)/ `'hover'` = グリッドホバー中 + スクロール中 /
|
|
1238
|
+
* `'always'` = 常時。
|
|
1239
|
+
*
|
|
1240
|
+
* @defaultValue `'scroll'`
|
|
1241
|
+
*/
|
|
742
1242
|
trigger?: ScrollHintTrigger;
|
|
1243
|
+
/**
|
|
1244
|
+
* **データ量ゲート**。表示行数(フィルター / グルーピング適用後のビュー行数。SSRM
|
|
1245
|
+
* はサーバー総行数)がこの値未満のあいだ、scrollHint 全体(カスタムスクロールバー含む)を自動 OFF
|
|
1246
|
+
* にしてネイティブスクロールバー表示のままにする。`0` = 常時有効(従来挙動)。
|
|
1247
|
+
*
|
|
1248
|
+
* @defaultValue `0`
|
|
1249
|
+
*/
|
|
743
1250
|
minRows?: number;
|
|
1251
|
+
/** 行番号に添えて表示する列 key(= 行オブジェクトのフィールド名)。 */
|
|
744
1252
|
hintColumn?: string;
|
|
1253
|
+
/**
|
|
1254
|
+
* 表示内容の完全カスタム(`hintColumn` より優先)。`null` / `undefined`
|
|
1255
|
+
* を返すと行番号のみの既定表示。
|
|
1256
|
+
*/
|
|
745
1257
|
renderHint?: (args: ScrollHintRenderArgs<T>) => F['node'];
|
|
746
1258
|
};
|
|
1259
|
+
/**
|
|
1260
|
+
* `SpreadsheetGrid` の props です(React 版では `ref` prop が加わります)。
|
|
1261
|
+
*
|
|
1262
|
+
* 各フィールドの説明は React 版パッケージ `@ishibashi0112/spreadsheet-grid` に同梱の `API_REFERENCE.md`
|
|
1263
|
+
* の「SpreadsheetGrid props」表と同じ内容です。
|
|
1264
|
+
* 説明中の「〜節」「下記」は同ファイル内の節を指します。
|
|
1265
|
+
*/
|
|
747
1266
|
export type SpreadsheetGridProps<T, F extends GridFrameworkTypes = GridFrameworkTypes> = {
|
|
1267
|
+
/**
|
|
1268
|
+
* 永続スライス(手動リサイズ幅 / フィルター / ソート)が**実際に変化したとき**に最新 `GridState`
|
|
1269
|
+
* を渡して呼ばれる。保存タイミングの signal(例: localStorage 自動保存)。発火規約は「状態の保存 /
|
|
1270
|
+
* 復元」節を参照。
|
|
1271
|
+
*/
|
|
748
1272
|
onStateChange?: (state: GridState) => void;
|
|
1273
|
+
/**
|
|
1274
|
+
* フィルター状態(`globalText` + `columnFilters`)が**実際に変化したとき**だけ、
|
|
1275
|
+
* そのスライスの複製を渡して呼ばれる。`onStateChange` は列幅 / 列メタでも呼ばれるため、記述子から
|
|
1276
|
+
* WHERE を組み立てるなどフィルターだけを追いたい用途向け。規約は `onStateChange`
|
|
1277
|
+
* と同じ(初回非発火 / 同値非発火 / `applyState` でも発火)。
|
|
1278
|
+
*/
|
|
1279
|
+
onFiltersChange?: (filters: GridFilterState) => void;
|
|
1280
|
+
/**
|
|
1281
|
+
* ソート状態が**実際に変化したとき**だけ、その複製を渡して呼ばれる(ORDER BY の組み立てなど)。
|
|
1282
|
+
* 規約は `onFiltersChange` と同じ。
|
|
1283
|
+
*/
|
|
1284
|
+
onSortChange?: (sort: GridSortState) => void;
|
|
1285
|
+
/**
|
|
1286
|
+
* スクロール位置の変化通知(rAF で 1 フレーム 1 回に間引き・縦横どちらの変化でも発火)。`params` は
|
|
1287
|
+
* `{ top, left, source }`(px)。`source: 'api'` は `setScrollPosition` / `scrollTo*` 系由来、
|
|
1288
|
+
* `'user'` はそれ以外。2 グリッドの双方向スクロール同期は `source === 'user'`
|
|
1289
|
+
* のときだけ相手へ反映することでループを止められる。インライン関数可(latest-ref 経由)。
|
|
1290
|
+
*/
|
|
749
1291
|
onScroll?: (params: GridScrollEventParams) => void;
|
|
1292
|
+
/**
|
|
1293
|
+
* clientSide モードの行データ。readonly 配列も受け付ける(グリッドは入力配列を破壊的に変更しない。
|
|
1294
|
+
* 編集結果は `onRowsChange` が新配列で返す)。`dataSource` を指定した場合は無視され serverSide
|
|
1295
|
+
* モードになる(両者は排他)。
|
|
1296
|
+
*/
|
|
750
1297
|
rows?: readonly T[];
|
|
1298
|
+
/**
|
|
1299
|
+
* serverSide(SSRM)モードのデータ供給口。指定すると可視窓近傍のブロックだけを `getRows`
|
|
1300
|
+
* で都度取得し、`rows` 系の clientSide パイプラインをバイパスする。`updateRows`(任意)
|
|
1301
|
+
* を持たせるとセル編集の書き戻し(楽観更新つき)が有効になる(「セル編集の書き戻し」節)。
|
|
1302
|
+
*/
|
|
751
1303
|
dataSource?: ServerSideDataSource<T>;
|
|
1304
|
+
/**
|
|
1305
|
+
* serverSide のソフトリフレッシュ用トークン。値を増やすと、クエリ(フィルター/ソート/グローバル)
|
|
1306
|
+
* を変えずにキャッシュを破棄して現在の可視レンジをサーバから取り直す。スクロール位置は保持し、
|
|
1307
|
+
* 件数は到着ブロックの `totalRowCount` で追従する(clientSide では無視)。
|
|
1308
|
+
* 命令的に呼びたい場合は同挙動のハンドル `refreshServerSide()` を使う。
|
|
1309
|
+
*/
|
|
752
1310
|
serverSideRefreshToken?: number;
|
|
1311
|
+
/**
|
|
1312
|
+
* serverSide の `getRows` が reject したときの通知(abort は正常キャンセルのため通知しない)。
|
|
1313
|
+
* `params` は失敗した要求の view 空間レンジ `{ startIndex, endIndex }`。
|
|
1314
|
+
* グリッド内蔵のエラーバー(再試行 UI)とは独立に呼ばれる(利用側トースト / ログ用)。
|
|
1315
|
+
* インライン関数可(latest-ref 経由で読む)。
|
|
1316
|
+
*/
|
|
753
1317
|
onServerSideLoadError?: (error: unknown, params: ServerSideLoadErrorParams) => void;
|
|
1318
|
+
/**
|
|
1319
|
+
* serverSide の `dataSource.updateRows` が reject したときの通知。
|
|
1320
|
+
* グリッド側は楽観更新をロールバック済みで、`params.updates` に失敗した行更新(`rowKey` /
|
|
1321
|
+
* `changes` / `previousRow`)が入る(利用側トースト / リトライ導線用)。
|
|
1322
|
+
* グリッド内蔵の保存失敗バーとは独立に呼ばれる。インライン関数可(latest-ref 経由で読む)。
|
|
1323
|
+
* 詳細は「セル編集の書き戻し」節。
|
|
1324
|
+
*/
|
|
754
1325
|
onServerSideWriteError?: (error: unknown, params: ServerSideWriteErrorParams<T>) => void;
|
|
1326
|
+
/** 列定義の配列。readonly 配列も受け付ける。 */
|
|
755
1327
|
columns: readonly GridColumn<T, F>[];
|
|
1328
|
+
/** 行が変化したとき呼ばれる(rows を controlled にする)。 */
|
|
756
1329
|
onRowsChange?: (nextRows: T[]) => void;
|
|
1330
|
+
/** 列が変化したとき呼ばれる。列メニューの固定切替はこれが指定されている場合のみ反映。 */
|
|
757
1331
|
onColumnsChange?: (nextColumns: GridColumn<T, F>[]) => void;
|
|
1332
|
+
/**
|
|
1333
|
+
* 安定した行キーを返す。
|
|
1334
|
+
*
|
|
1335
|
+
* @defaultValue index ベース
|
|
1336
|
+
*/
|
|
758
1337
|
rowKeyGetter?: (row: T, index: number) => GridRowKey;
|
|
1338
|
+
/**
|
|
1339
|
+
* コピー(`Ctrl/Cmd+C` の TSV)/ `exportCsv` / `getExportData` の対象行フィルタ。`false`
|
|
1340
|
+
* の行は出力から**行ごと**除く(行単位のみ。全体選択かの判定と貼り付けには影響しない)。
|
|
1341
|
+
* `ctx.viewRowIndex` はフィルター / ソート適用後のビュー行 index(scope `'raw'` のみ rows
|
|
1342
|
+
* 配列のソース index)、`ctx.rowKey` は `rowKeyGetter` の値。用途:
|
|
1343
|
+
* プレースホルダ行など表示上の詰め物を出力から除く。
|
|
1344
|
+
*
|
|
1345
|
+
* @defaultValue 全行 true
|
|
1346
|
+
*/
|
|
759
1347
|
isRowExportable?: (row: T, ctx: {
|
|
760
1348
|
viewRowIndex: number;
|
|
761
1349
|
rowKey: GridRowKey;
|
|
762
1350
|
}) => boolean;
|
|
1351
|
+
/** 行追加時に使う新規行ファクトリ。 */
|
|
763
1352
|
createRow?: () => T;
|
|
1353
|
+
/** 列追加時に使う列ファクトリ。 */
|
|
764
1354
|
createOverflowColumn?: (columnIndex: number) => GridColumn<T, F>;
|
|
1355
|
+
/**
|
|
1356
|
+
* uniform 行の行高(px)。未指定時は density プリセット(compact: `28` / comfortable: `44`)
|
|
1357
|
+
* から解決。明示指定が常に優先。
|
|
1358
|
+
*
|
|
1359
|
+
* @defaultValue density 依存(standard: `36`)
|
|
1360
|
+
*/
|
|
765
1361
|
rowHeight?: number;
|
|
1362
|
+
/**
|
|
1363
|
+
* auto-height 行(可変行高)を有効化する**大本のスイッチ**。これに加えて**少なくとも1列に
|
|
1364
|
+
* `column.autoHeight: true`** が必要(その列が折り返して行高を駆動)。両方 true かつ**行数 ≤ 50,
|
|
1365
|
+
* 000**のとき有効(超過時は uniform `rowHeight` へフォールバック)。詳細は「auto-height 行」節。
|
|
1366
|
+
*
|
|
1367
|
+
* @defaultValue `false`
|
|
1368
|
+
*/
|
|
766
1369
|
autoHeight?: boolean;
|
|
1370
|
+
/**
|
|
1371
|
+
* 未測定行の推定行高(px)。
|
|
1372
|
+
*
|
|
1373
|
+
* @defaultValue `rowHeight`
|
|
1374
|
+
*/
|
|
767
1375
|
estimateRowHeight?: number;
|
|
1376
|
+
/**
|
|
1377
|
+
* ヘッダー行の高さ(px)。未指定時は density プリセット(compact: `32` / comfortable: `48`)
|
|
1378
|
+
* から解決。明示指定が常に優先。
|
|
1379
|
+
*
|
|
1380
|
+
* @defaultValue density 依存(standard: `40`)
|
|
1381
|
+
*/
|
|
768
1382
|
headerHeight?: number;
|
|
1383
|
+
/**
|
|
1384
|
+
* 密度プリセット。rowHeight / headerHeight の既定値と寸法トークン(セル横 padding / バー padding /
|
|
1385
|
+
* アイコンボタン寸法 / セル文字の相対拡縮)を一括切替。`'standard'` は従来と同値。
|
|
1386
|
+
* 個別調整はトークン(`--ssg-cell-pad-x` 等)の上書きで可能。popover / menu 等のポータルは対象外。
|
|
1387
|
+
*
|
|
1388
|
+
* @defaultValue `'standard'`
|
|
1389
|
+
*/
|
|
769
1390
|
density?: GridDensity;
|
|
1391
|
+
/**
|
|
1392
|
+
* カラーテーマ。`'dark'` でダークプリセット(`.ssg-theme-dark` のトークン一括上書き。Mantine dark
|
|
1393
|
+
* 系パレット)をグリッド本体・全ポータル(popover / menu / panel)
|
|
1394
|
+
* ・ドラッグゴースト・ツールチップへ適用。`'auto'` は `prefers-color-scheme` へ追従(Mantine /
|
|
1395
|
+
* HeroUI 等クラスベース dark 運用では、利用側カラースキームの解決値を `'light' | 'dark'`
|
|
1396
|
+
* で渡す使い方を推奨)。個別の色調整はトークン(`--ssg-*`)の上書きで可能。
|
|
1397
|
+
*
|
|
1398
|
+
* @defaultValue `'light'`
|
|
1399
|
+
*/
|
|
770
1400
|
theme?: GridTheme;
|
|
1401
|
+
/**
|
|
1402
|
+
* 行番号列の幅(px)。
|
|
1403
|
+
*
|
|
1404
|
+
* @defaultValue `56`
|
|
1405
|
+
*/
|
|
771
1406
|
rowHeaderWidth?: number;
|
|
1407
|
+
/**
|
|
1408
|
+
* グリッドの明示高さ。**値の種類で何の高さかが変わる**。① `%` を含む文字列(`'100%'` / `'50%'` /
|
|
1409
|
+
* `'calc(100% - 40px)'`):
|
|
1410
|
+
* トップバー・フィルターチップバー・ボトムバーを含む**グリッド全体**の高さ。`'100%'`
|
|
1411
|
+
* でグリッドが親要素に収まり、バーを除いた残りがスクロール領域になる(ルートに
|
|
1412
|
+
* `ssg-root--fill-height` が付く)。親要素が確定高さを持つ前提で、親が高さ `auto`
|
|
1413
|
+
* だと全行分まで伸びて仮想化が効かない。② `number`(px)/ `%` を含まない文字列(`'400px'` / `'50vh'`
|
|
1414
|
+
* / `'calc(100vh - 120px)'`): **スクロール領域だけ**の高さ(グリッド全体はバーの分だけ高くなる)。③
|
|
1415
|
+
* 未指定: スクロール領域は内容の高さで `maxHeight` によりクリップ。ルートへの
|
|
1416
|
+
* `style={{ height }}` だけではスクロール領域は決まらないため、高さはこの prop で指定する。
|
|
1417
|
+
*/
|
|
772
1418
|
height?: number | string;
|
|
1419
|
+
/**
|
|
1420
|
+
* **スクロール領域**の高さ上限(バーは含まない。`height` の種類に関わらず同じ)。
|
|
1421
|
+
* `height`・`maxHeight` が**共に未指定のときのみ**既定の 480px が効く(従来挙動)。数値の
|
|
1422
|
+
* `height` と併用するとスクロール領域 = `min(height, maxHeight)`、`%` の `height` と併用すると
|
|
1423
|
+
* `min(maxHeight, 親の高さ − バー)`(親が大きければグリッド全体はバー + `maxHeight` に縮む)。
|
|
1424
|
+
*
|
|
1425
|
+
* @defaultValue `—`(既定 480px)
|
|
1426
|
+
*/
|
|
773
1427
|
maxHeight?: number | string;
|
|
1428
|
+
/**
|
|
1429
|
+
* グリッド全体の編集を無効化。
|
|
1430
|
+
*
|
|
1431
|
+
* @defaultValue `false`
|
|
1432
|
+
*/
|
|
774
1433
|
readOnly?: boolean;
|
|
1434
|
+
/**
|
|
1435
|
+
* readonly セルの組み込み淡色表示(背景 + 文字色)を有効化。`false` でもセマンティッククラス
|
|
1436
|
+
* `.ssg-body-cell--readonly` は常時付与され、利用側 CSS のフックに使える。
|
|
1437
|
+
*
|
|
1438
|
+
* @defaultValue `false`
|
|
1439
|
+
*/
|
|
775
1440
|
dimReadOnlyCells?: boolean;
|
|
1441
|
+
/** セル単位の編集可否ゲート。 */
|
|
776
1442
|
canEditCell?: (rowIndex: number, colIndex: number, row: T, column: GridColumn<T, F>) => boolean;
|
|
1443
|
+
/**
|
|
1444
|
+
* グリッド編集(セル編集 / ペースト / `renderCell` の `setValue`)の取り消し/やり直し。`Ctrl/Cmd+Z`
|
|
1445
|
+
* = undo、`Ctrl/Cmd+Shift+Z` / `Ctrl/Cmd+Y` = redo(ハンドルの `undo()` / `redo()` でも可)。
|
|
1446
|
+
* clientSide(`rows` + `onRowsChange`)専用で、serverSide(`dataSource`)/ `readOnly` /
|
|
1447
|
+
* `onRowsChange` 未指定時は無効。履歴は「変更前 rows 配列」
|
|
1448
|
+
* の参照スナップショット(未変更行は構造共有されるため低コスト)。**`onRowsChange`
|
|
1449
|
+
* で受け取った配列は参照そのまま `rows` へ戻すのが前提**(map 等で作り直すと毎回「外部変更」
|
|
1450
|
+
* と見なされ履歴が消える)。rows が grid 起点以外(親の直接 setState 等)
|
|
1451
|
+
* で差し替わると履歴は自動破棄。エディタ内の文字入力の取り消しは input のネイティブ undo
|
|
1452
|
+
* に委譲(グリッドの undo は**確定済みの編集**が対象)。
|
|
1453
|
+
*
|
|
1454
|
+
* @defaultValue `true`
|
|
1455
|
+
*/
|
|
777
1456
|
enableUndoRedo?: boolean;
|
|
1457
|
+
/**
|
|
1458
|
+
* `Delete` / `Backspace` キーによる選択セル(なければアクティブセル)の値クリア。`false`
|
|
1459
|
+
* でキーは何もしない(素通し)。ペースト・エディタでの上書き・undo/redo
|
|
1460
|
+
* には影響しない(クリアのキーボード操作だけの opt-out)。
|
|
1461
|
+
*
|
|
1462
|
+
* @defaultValue `true`
|
|
1463
|
+
*/
|
|
778
1464
|
enableClearOnDelete?: boolean;
|
|
1465
|
+
/**
|
|
1466
|
+
* 組み込みエディタ(text / number / select / date)の `Enter`
|
|
1467
|
+
* 確定後にアクティブセルをどこへ移すか(`'down'` | `'up'` | `'right'` | `'left'` | `'none'`。Excel
|
|
1468
|
+
* の「Enter キーを押したら、セルを移動する(方向)」相当)。`'none'` は移動せずその場に留まる。`Tab`
|
|
1469
|
+
* / `Shift+Tab`(右 / 左)と `Escape` には影響しない。custom エディタはキーバインドが consumer
|
|
1470
|
+
* 責務のため対象外(`ctx.commit(value, direction)` の direction で指定)。
|
|
1471
|
+
*
|
|
1472
|
+
* @defaultValue `'down'`
|
|
1473
|
+
*/
|
|
779
1474
|
editorEnterMove?: EditorEnterMove;
|
|
1475
|
+
/**
|
|
1476
|
+
* 保持する undo ステップ数の上限。超過分は古い順に破棄。
|
|
1477
|
+
*
|
|
1478
|
+
* @defaultValue `100`
|
|
1479
|
+
*/
|
|
780
1480
|
undoHistoryLimit?: number;
|
|
1481
|
+
/**
|
|
1482
|
+
* undo / redo 可能状態が**変化したとき**に呼ばれる(ツールバーの undo/redo ボタンの disabled
|
|
1483
|
+
* 表示などリアクティブな UI 用)。初回マウントでは発火せず、同値では再発火しない。
|
|
1484
|
+
* 毎レンダーのインライン関数でも問題ない。
|
|
1485
|
+
*/
|
|
781
1486
|
onUndoRedoStateChange?: (state: UndoRedoState) => void;
|
|
1487
|
+
/**
|
|
1488
|
+
* 複数セル範囲選択。
|
|
1489
|
+
*
|
|
1490
|
+
* @defaultValue `true`
|
|
1491
|
+
*/
|
|
782
1492
|
enableRangeSelection?: boolean;
|
|
1493
|
+
/**
|
|
1494
|
+
* チェックボックス行選択の有効化(マスタースイッチ)。`true` で行ヘッダ(行NO)
|
|
1495
|
+
* ガターが行選択のヒット領域になり、Excel 風のガター起点セル範囲選択は
|
|
1496
|
+
* off(ボディ側セルのドラッグ範囲選択は不変)。判定は O(1)・全選択は除外集合でキーを列挙しない(1M
|
|
1497
|
+
* 行でも一定コスト)。
|
|
1498
|
+
*
|
|
1499
|
+
* @defaultValue `false`
|
|
1500
|
+
*/
|
|
783
1501
|
enableRowSelection?: boolean;
|
|
1502
|
+
/**
|
|
1503
|
+
* 単一/複数の選択モード。single は常に 1 行。multiple はクリックでトグル、
|
|
1504
|
+
* shift+クリック/ガタードラッグで範囲選択。
|
|
1505
|
+
*
|
|
1506
|
+
* @defaultValue `'multiple'`
|
|
1507
|
+
*/
|
|
784
1508
|
rowSelectionMode?: RowSelectionMode;
|
|
1509
|
+
/**
|
|
1510
|
+
* ヘッダ左上コーナーの全選択チェック(tri-state: none/some/all)の有効化。
|
|
1511
|
+
*
|
|
1512
|
+
* @defaultValue `enableRowSelection && multiple`
|
|
1513
|
+
*/
|
|
785
1514
|
enableSelectAllRows?: boolean;
|
|
1515
|
+
/**
|
|
1516
|
+
* **controlled** の行選択記述子。`{ type:'include', rowKeys }`=これらを選択 /
|
|
1517
|
+
* `{ type:'exclude', rowKeys }`=全選択のうち除外。全選択をキー列挙せず表現できる。指定時は
|
|
1518
|
+
* controlled(内部 state を使わない)。
|
|
1519
|
+
*/
|
|
786
1520
|
rowSelection?: RowSelectionModel;
|
|
1521
|
+
/**
|
|
1522
|
+
* controlled 簡易版(`{ type:'include', rowKeys }` の糖衣)。`rowSelection` と併用時は
|
|
1523
|
+
* `rowSelection` を優先。全選択(exclude)は表現不可。
|
|
1524
|
+
*/
|
|
787
1525
|
selectedRowKeys?: GridRowKey[];
|
|
1526
|
+
/** 行選択変化の通知(controlled/uncontrolled いずれでも発火)。 */
|
|
788
1527
|
onRowSelectionChange?: (model: RowSelectionModel) => void;
|
|
1528
|
+
/**
|
|
1529
|
+
* グローバルフィルター**機能**の有効化。`false` で機能が無効になり、
|
|
1530
|
+
* 既定トップバーのフィルター入力欄も出ない(summary は `showTopBarSummary` に従う。
|
|
1531
|
+
* トップバー自体を消すには `showTopBar=false`)。
|
|
1532
|
+
*
|
|
1533
|
+
* @defaultValue `true`
|
|
1534
|
+
*/
|
|
789
1535
|
enableGlobalFilter?: boolean;
|
|
1536
|
+
/**
|
|
1537
|
+
* 列ごとのフィルター。
|
|
1538
|
+
*
|
|
1539
|
+
* @defaultValue `true`
|
|
1540
|
+
*/
|
|
790
1541
|
enableColumnFilter?: boolean;
|
|
1542
|
+
/**
|
|
1543
|
+
* dateSet フィルター条件の日付入力を利用側コンポーネント(Mantine `DatePickerInput` 等)
|
|
1544
|
+
* へ差し替えるスロット。既定は内製フィールド(自由入力 + ドリルアップカレンダー。下記「dateSet
|
|
1545
|
+
* の日付入力(既定 UI)」節)。詳細は「日付入力の差し替え(renderFilterDateInput)」節。
|
|
1546
|
+
*
|
|
1547
|
+
* @defaultValue 内製の日付フィールド
|
|
1548
|
+
*/
|
|
791
1549
|
renderFilterDateInput?: (ctx: FilterDateInputContext) => F['node'];
|
|
1550
|
+
/**
|
|
1551
|
+
* set / select / 複合(numberSet / textSet / dateSet)列の候補を**非同期に供給**する(DB の DISTINCT
|
|
1552
|
+
* など)。popover を開くたびに
|
|
1553
|
+
* `{ columnKey, column, columnFilters(自列を除く他列の有効フィルター), globalText, signal }`
|
|
1554
|
+
* で呼ばれ、閉じる / 列切替で `signal` が abort される(ライブラリはキャッシュしない)。読み込み中
|
|
1555
|
+
* / 失敗(再試行)/ 打ち切り(`truncated`)の表示は popover が持つ。優先順位は
|
|
1556
|
+
* `column.filterOptions`(静的)> `getFilterOptions` > rows 自動収集。非同期候補の列は反転(exclude)
|
|
1557
|
+
* 可。clientSide / serverSide 両対応。詳細は「ソートとフィルター」ガイド。
|
|
1558
|
+
*/
|
|
1559
|
+
getFilterOptions?: (params: GetFilterOptionsParams<T, F>) => Promise<GetFilterOptionsResult>;
|
|
1560
|
+
/**
|
|
1561
|
+
* ヘッダークリックでのソート。
|
|
1562
|
+
*
|
|
1563
|
+
* @defaultValue `true`
|
|
1564
|
+
*/
|
|
792
1565
|
enableSorting?: boolean;
|
|
1566
|
+
/**
|
|
1567
|
+
* 列 / グローバルフィルターの**絞り込みをグリッドで行わない**(手動フィルターモード)。フィルター
|
|
1568
|
+
* UI(popover / チップバー / フィルター管理 / フィルター中の印)と状態(`GridState.filters` /
|
|
1569
|
+
* `onStateChange`)は従来どおり動き、`rows` は渡した件数・順のまま表示される(絞り込みはサーバ側
|
|
1570
|
+
* WHERE 等の外部責務)。`rows` が 0 件でフィルターが載っているときは `noMatchingRowsText` を表示。
|
|
1571
|
+
* serverSide(`dataSource`)では無視。詳細は「ソートとフィルター」ガイド。
|
|
1572
|
+
*
|
|
1573
|
+
* @defaultValue `false`
|
|
1574
|
+
*/
|
|
1575
|
+
manualFiltering?: boolean;
|
|
1576
|
+
/**
|
|
1577
|
+
* ソートの**並べ替えをグリッドで行わない**(手動ソートモード)。ソート UI と状態(`GridState.sort` /
|
|
1578
|
+
* `onStateChange`)は従来どおり動き、`rows` は渡した順のまま。再マウントなしで切り替え可(`false`
|
|
1579
|
+
* へ戻すと即座にクライアントソートが適用)。手動ソート中はラベル行の `sortMode` 連動 /
|
|
1580
|
+
* 行ドラッグの無効化は起きない(並べ替えていない扱い)。serverSide では無視。
|
|
1581
|
+
*
|
|
1582
|
+
* @defaultValue `false`
|
|
1583
|
+
*/
|
|
1584
|
+
manualSorting?: boolean;
|
|
1585
|
+
/**
|
|
1586
|
+
* 列幅の手動リサイズ可否のグリッド既定。各列 `resizable`
|
|
1587
|
+
* 未指定時に継承(`column.resizable ?? enableColumnResize`)。
|
|
1588
|
+
*
|
|
1589
|
+
* @defaultValue `true`
|
|
1590
|
+
*/
|
|
793
1591
|
enableColumnResize?: boolean;
|
|
1592
|
+
/**
|
|
1593
|
+
* データ投入時に全列幅を内容へ自動フィット。`'onMount'`=初回にデータが載った一度きり /
|
|
1594
|
+
* `'onDataChange'`=`rows`(参照)が変わるたび(= データ差し替えのたび。手動リサイズは上書き) /
|
|
1595
|
+
* `false`=無効。計測は列メニュー「すべての列の幅を自動調整」と同一エンジン(`suppressAutoSize` /
|
|
1596
|
+
* `autoHeight` 列は除外)。フィルター / ソート / 列並べ替えでは再フィットしません。
|
|
1597
|
+
* serverSide(`dataSource`)では無効。詳細は「flex と autoSize」節。
|
|
1598
|
+
*
|
|
1599
|
+
* @defaultValue `false`
|
|
1600
|
+
*/
|
|
794
1601
|
autoSizeColumns?: AutoSizeColumnsMode;
|
|
1602
|
+
/**
|
|
1603
|
+
* セル内容が省略(…)される列で、ホバー時に全文ツールチップを表示。
|
|
1604
|
+
* 対象は既定テキストセルのみ(`renderCell` 列 / `autoHeight` 折り返し列は対象外)。表示はホバー時に
|
|
1605
|
+
* `scrollWidth > clientWidth` を判定し、実際にクリップされているセルのみ。
|
|
1606
|
+
* 既存のカスタムツールチップ(`data-ssg-tooltip`)を共有。詳細は「ツールチップ」節。
|
|
1607
|
+
*
|
|
1608
|
+
* @defaultValue `false`
|
|
1609
|
+
*/
|
|
795
1610
|
showCellOverflowTooltip?: boolean;
|
|
1611
|
+
/**
|
|
1612
|
+
* invalid マーク(背景 + 右上マーカー + ホバーツールチップ)の表示可否。`false` で非表示 +
|
|
1613
|
+
* 可視セルの `validate` 評価スキップ。`getInvalidCells()` と `validationMode: 'reject'`
|
|
1614
|
+
* の書き込み拒否には影響しない(独立経路)。「送信時にだけマークを出す」UX は利用側 state で本 prop
|
|
1615
|
+
* を切り替えて実現(「バリデーション」節のレシピ参照)。
|
|
1616
|
+
*
|
|
1617
|
+
* @defaultValue `true`
|
|
1618
|
+
*/
|
|
796
1619
|
showValidationMarks?: boolean;
|
|
1620
|
+
/**
|
|
1621
|
+
* 行ホバー時に行全体を薄くハイライト。
|
|
1622
|
+
*
|
|
1623
|
+
* @defaultValue `true`
|
|
1624
|
+
*/
|
|
797
1625
|
enableRowHover?: boolean;
|
|
1626
|
+
/**
|
|
1627
|
+
* 行ホバーの controlled 値(ビュー行 index / `null` = ホバーなし)。指定時は内部 state
|
|
1628
|
+
* を使わずこの値でハイライトし、pointer 由来の変化は `onHoveredRowChange` で通知のみ(optionally
|
|
1629
|
+
* controlled)。`enableRowHover: false` のときは無視(ハイライトも通知もしない)。一時的な UI
|
|
1630
|
+
* 状態のため `GridState` / ハンドルには載らない。
|
|
1631
|
+
*/
|
|
798
1632
|
hoveredRowIndex?: number | null;
|
|
1633
|
+
/**
|
|
1634
|
+
* 行ホバーが変わったときの通知(uncontrolled でも呼ばれる)。`viewRowIndex` はフィルター /
|
|
1635
|
+
* ソート適用後のビュー行 index。同値では発火しない(pointerenter
|
|
1636
|
+
* は同一行内のセル跨ぎでも来るため)。用途: 複数グリッド間のホバー同期など。
|
|
1637
|
+
*/
|
|
799
1638
|
onHoveredRowChange?: (viewRowIndex: number | null, ctx: {
|
|
800
1639
|
source: 'pointer';
|
|
801
1640
|
}) => void;
|
|
1641
|
+
/**
|
|
1642
|
+
* 列ヘッダーのホバー時にヘッダーセルを薄くハイライト。
|
|
1643
|
+
*
|
|
1644
|
+
* @defaultValue `true`
|
|
1645
|
+
*/
|
|
802
1646
|
enableColumnHeaderHover?: boolean;
|
|
1647
|
+
/**
|
|
1648
|
+
* 列メニュー(⋮ + ヘッダー右クリック)。
|
|
1649
|
+
*
|
|
1650
|
+
* @defaultValue `true`
|
|
1651
|
+
*/
|
|
803
1652
|
enableColumnMenu?: boolean;
|
|
1653
|
+
/**
|
|
1654
|
+
* フィルター結果 0 行時のオーバーレイ文言。
|
|
1655
|
+
*
|
|
1656
|
+
* @defaultValue `'一致する行がありません'`
|
|
1657
|
+
*/
|
|
804
1658
|
noMatchingRowsText?: string;
|
|
1659
|
+
/**
|
|
1660
|
+
* rows が 0 件のときの文言。
|
|
1661
|
+
*
|
|
1662
|
+
* @defaultValue `'表示する行がありません'`
|
|
1663
|
+
*/
|
|
805
1664
|
noRowsText?: string;
|
|
1665
|
+
/**
|
|
1666
|
+
* 上部バー(ツールバー)の表示有無。`false` で `renderTopBar` / `enableGlobalFilter`
|
|
1667
|
+
* に関わらず一切描画しない(表示のマスタースイッチ。矛盾指定時は `renderTopBar` より優先)。
|
|
1668
|
+
*
|
|
1669
|
+
* @defaultValue `true`
|
|
1670
|
+
*/
|
|
806
1671
|
showTopBar?: boolean;
|
|
1672
|
+
/**
|
|
1673
|
+
* 既定トップバーの summary chips(件数/フィルター/ソート)の表示有無。`renderTopBar`
|
|
1674
|
+
* 未指定時のみ有効。これと `showTopBarFilter`
|
|
1675
|
+
* がともに非表示なら既定トップバーは描画されない(空バーを出さない)。
|
|
1676
|
+
*
|
|
1677
|
+
* @defaultValue `true`
|
|
1678
|
+
*/
|
|
807
1679
|
showTopBarSummary?: boolean;
|
|
1680
|
+
/**
|
|
1681
|
+
* 既定トップバーの Rows / Columns 件数 chips の表示有無。`showTopBarSummary=true`(かつ
|
|
1682
|
+
* `renderTopBar` 未指定)のときのみ有効。Filter / Sort chips は対象外。
|
|
1683
|
+
*
|
|
1684
|
+
* @defaultValue `true`
|
|
1685
|
+
*/
|
|
808
1686
|
showTopBarCounts?: boolean;
|
|
1687
|
+
/**
|
|
1688
|
+
* 既定トップバーのグローバルフィルター入力欄の表示有無。`renderTopBar` 未指定時のみ有効。
|
|
1689
|
+
* `enableGlobalFilter=false` のときは本値に関わらず非表示。
|
|
1690
|
+
*
|
|
1691
|
+
* @defaultValue `true`
|
|
1692
|
+
*/
|
|
809
1693
|
showTopBarFilter?: boolean;
|
|
1694
|
+
/**
|
|
1695
|
+
* 既定トップバーのグローバルフィルター入力の placeholder。`renderTopBar` 未指定時のみ有効。
|
|
1696
|
+
*
|
|
1697
|
+
* @defaultValue `'グローバルフィルター'`
|
|
1698
|
+
*/
|
|
810
1699
|
globalFilterPlaceholder?: string;
|
|
1700
|
+
/**
|
|
1701
|
+
* 既定トップバーのグローバルフィルター入力の左アイコン。`renderTopBar` 未指定時のみ有効。
|
|
1702
|
+
* `undefined`=組み込みの検索(虫眼鏡)アイコン / `null`(など falsy)=アイコン無し / 任意
|
|
1703
|
+
* `ReactNode`=差し替え。クリアボタンは入力枠の内側右に `×` で表示され、入力が空のときは出ない。
|
|
1704
|
+
*
|
|
1705
|
+
* @defaultValue 組み込み検索アイコン
|
|
1706
|
+
*/
|
|
811
1707
|
globalFilterIcon?: F['node'];
|
|
1708
|
+
/**
|
|
1709
|
+
* 下部バー(ステータスバー)の表示有無。`false` で `renderBottomBar`
|
|
1710
|
+
* に関わらず一切描画しない(表示のマスタースイッチ。矛盾指定時は `renderBottomBar` より優先)。
|
|
1711
|
+
*
|
|
1712
|
+
* @defaultValue `true`
|
|
1713
|
+
*/
|
|
812
1714
|
showBottomBar?: boolean;
|
|
1715
|
+
/**
|
|
1716
|
+
* 既定ボトムバーの Rows / Columns 件数 chips(左側)の表示有無。`renderBottomBar`
|
|
1717
|
+
* 未指定時のみ有効。右側の Active / Selection / 選択統計 / Cols は対象外。
|
|
1718
|
+
*
|
|
1719
|
+
* @defaultValue `true`
|
|
1720
|
+
*/
|
|
813
1721
|
showBottomBarCounts?: boolean;
|
|
1722
|
+
/**
|
|
1723
|
+
* フィルターチップバー(適用中の列フィルターをトップバー直下にチップで常時表示)
|
|
1724
|
+
* の表示有無(opt-in)。有効フィルター 0 件時はバーごと非表示(空バーは出さない)。`showTopBar`
|
|
1725
|
+
* とは独立。チップ本体クリックで対象列へジャンプしてフィルター popover を開き、× で個別クリア、
|
|
1726
|
+
* 「すべてクリア」は列フィルターのみ対象(グローバルフィルターは対象外)。
|
|
1727
|
+
*
|
|
1728
|
+
* @defaultValue `false`
|
|
1729
|
+
*/
|
|
814
1730
|
showFilterChipBar?: boolean;
|
|
1731
|
+
/**
|
|
1732
|
+
* 上部バーの差し替え。未指定時は内蔵トップバー(summary chips + フィルター入力。内訳は
|
|
1733
|
+
* `showTopBarSummary` / `showTopBarFilter` で制御。フィルター入力は `enableGlobalFilter=true`
|
|
1734
|
+
* が前提)。`showTopBar=false` 時は本指定に関わらず描画されない。
|
|
1735
|
+
*
|
|
1736
|
+
* @defaultValue 内蔵トップバー
|
|
1737
|
+
*/
|
|
815
1738
|
renderTopBar?: (context: SpreadsheetGridSlotContext<T, F>) => F['node'];
|
|
1739
|
+
/**
|
|
1740
|
+
* 下部バーの差し替え。未指定時は内蔵ステータスバー。`showBottomBar=false`
|
|
1741
|
+
* 時は本指定に関わらず描画されない。
|
|
1742
|
+
*
|
|
1743
|
+
* @defaultValue 内蔵ボトムバー
|
|
1744
|
+
*/
|
|
816
1745
|
renderBottomBar?: (context: SpreadsheetGridSlotContext<T, F>) => F['node'];
|
|
1746
|
+
/** ルート要素の class。 */
|
|
817
1747
|
className?: string;
|
|
1748
|
+
/**
|
|
1749
|
+
* ルート要素(`.ssg-root`)のインライン style。`classNames.root` の style とマージされ、
|
|
1750
|
+
* こちらが後勝ち。
|
|
1751
|
+
*/
|
|
818
1752
|
style?: F['style'];
|
|
1753
|
+
/**
|
|
1754
|
+
* パーツ別の追加スロット。各値は `GridSlotProps`(`string | { className?, style? }`)で、StyleX の
|
|
1755
|
+
* `stylex.props(...)` の戻り値をそのまま渡せる。全 25
|
|
1756
|
+
* スロット配線済み(一覧と規則は「パーツ別スロット」節)。
|
|
1757
|
+
* レンダー毎に新しいオブジェクトを渡してもよい(内容の署名で memo)。基底 class
|
|
1758
|
+
* は未レイヤー・特異度 (0,1,0)
|
|
1759
|
+
* のため同特異度のクラスは読み込み順で決まる(確実な上書きは連結セレクタか `style.layer.css`)。
|
|
1760
|
+
*/
|
|
819
1761
|
classNames?: GridClassNames<F>;
|
|
1762
|
+
/**
|
|
1763
|
+
* 行ごとの追加 class(または `{ className, style }`)。行コンテナ + 行ヘッダー「#」セル +
|
|
1764
|
+
* 各データセルに付与され、Tailwind / StyleX での行ハイライトに使える。`style`
|
|
1765
|
+
* はインラインで付与され、座標 / 寸法はグリッドが後勝ち(返した style は内容比較で memo される)。
|
|
1766
|
+
* 第 3 引数 `ctx` は `{ row, rowIndex, sourceRowIndex, rowKey, isSelected }`(「補助型」節参照)。
|
|
1767
|
+
* 既存の 2 引数関数もそのまま動く(後方互換)。グループ行は対象外。
|
|
1768
|
+
*/
|
|
820
1769
|
getRowClassName?: (row: T, rowIndex: number, ctx: RowStyleContext<T>) => GridSlotProps<F> | undefined;
|
|
1770
|
+
/**
|
|
1771
|
+
* **展開行(Master/Detail)**。マスター行の直下に、行順(view index)を変えずに全幅の帯を差し込み、
|
|
1772
|
+
* その中(カード)へ `render` の返す任意の React 要素(自前のサブグリッド / フォーム / 集計パネル等)
|
|
1773
|
+
* を描画する。指定時のみ有効で、未指定なら既存の描画・状態・イベント経路は一切変わらない。
|
|
1774
|
+
* `{ render, height?, isExpandable?, showToggleColumn?, className? }`。clientSide / serverSide
|
|
1775
|
+
* の両方で使える(serverSide の制約は節内)。詳細は「展開行(Master/Detail)」節を参照。
|
|
1776
|
+
*
|
|
1777
|
+
* @defaultValue —(無効)
|
|
1778
|
+
*/
|
|
821
1779
|
detailRow?: DetailRowOptions<T, F>;
|
|
1780
|
+
/**
|
|
1781
|
+
* 展開中の展開行のマスター行キー集合が**変化したとき**に呼ばれる(開閉の永続化・外部同期用)。
|
|
1782
|
+
* 初回マウントでは発火しない。インライン関数可(latest-ref 経由)。
|
|
1783
|
+
*/
|
|
822
1784
|
onExpandedDetailRowKeysChange?: (keys: GridRowKey[]) => void;
|
|
1785
|
+
/**
|
|
1786
|
+
* **ラベル行(見出し / 区切り行)**。`rows` の中で `isLabelRow(row)` が true
|
|
1787
|
+
* の行を「行数に数えない見出し」として、3 ペインを跨ぐ全幅の帯で描画する(中身は `render` で任意の
|
|
1788
|
+
* React 要素に差し替え可。横スクロールしても左端に留まる)。編集 / 選択 / コピー /
|
|
1789
|
+
* エクスポートの既定対象外で、行番号も消費しない。ソート /
|
|
1790
|
+
* フィルターは既定でラベル行から次のラベル行までの区間(セクション)に閉じる(`sortMode`)。
|
|
1791
|
+
* `sticky: true` で現在セクションのラベルを列ヘッダー直下に固定。
|
|
1792
|
+
* `{ isLabelRow, getLabel, render?, height?, className?, sticky?, sortMode?, keepEmptySections?, exportText? }`。
|
|
1793
|
+
* 行グルーピング(`rowGroup`)とは別機能で併用不可。詳細は「ラベル行(見出し / 区切り行)」節。
|
|
1794
|
+
*
|
|
1795
|
+
* @defaultValue —(無効)
|
|
1796
|
+
*/
|
|
823
1797
|
labelRow?: LabelRowOptions<T, F>;
|
|
1798
|
+
/**
|
|
1799
|
+
* **行ドラッグ並び替え**。先頭にドラッグハンドル列(幅 28px・タイトル無しの合成列。
|
|
1800
|
+
* 左固定列があれば左固定側)を挿入し、ハンドル(⋮⋮)を掴んで行を上下へ動かせる。確定時は
|
|
1801
|
+
* `onRowsChange` へ移動後の**新配列**を渡し(履歴ラッパ経由 = undo/redo 対象)、続けて `onRowMove`
|
|
1802
|
+
* を呼ぶ。clientSide(`rows` + `onRowsChange`)専用で、`dataSource`(serverSide)/ 行グルーピング中 /
|
|
1803
|
+
* `onRowsChange` 未指定ではハンドル列を出さない。ソート / フィルター適用中はハンドルを淡色 +
|
|
1804
|
+
* 理由ツールチップにして操作を無効化する(列は残る)。詳細は「行ドラッグ並び替え」節。
|
|
1805
|
+
*
|
|
1806
|
+
* @defaultValue `false`
|
|
1807
|
+
*/
|
|
824
1808
|
enableRowDrag?: boolean;
|
|
1809
|
+
/**
|
|
1810
|
+
* 行ごとのドラッグ可否。`false` の行にはハンドルを描画しない。
|
|
1811
|
+
* `ctx = { rowKey, sourceRowIndex }`。
|
|
1812
|
+
*
|
|
1813
|
+
* @defaultValue 全行可
|
|
1814
|
+
*/
|
|
825
1815
|
isRowDraggable?: (row: T, ctx: RowDragContext) => boolean;
|
|
1816
|
+
/**
|
|
1817
|
+
* 行移動の確定後(`onRowsChange` の直後)に呼ばれる。
|
|
1818
|
+
* `params = { rowKey, fromIndex, toIndex, rows }`(index は元 `rows` 配列基準、`rows` は
|
|
1819
|
+
* `onRowsChange` と同じ新配列参照)。ハンドルの `moveRow()` による移動でも呼ばれる。
|
|
1820
|
+
*/
|
|
826
1821
|
onRowMove?: (params: RowMoveParams<T>) => void;
|
|
1822
|
+
/**
|
|
1823
|
+
* コンテキストメニュー機能の有効化(マスタースイッチ)。他機能の `enable*` と同じく**既定 OFF**。
|
|
1824
|
+
* `false` のあいだは `getContextMenuItems` を渡しても発火せず、
|
|
1825
|
+
* 右クリックはブラウザ標準メニューのまま。現状はまだ機能 / UI に改善余地があるため既定 OFF
|
|
1826
|
+
* で提供する(利用側で明示 opt-in)。
|
|
1827
|
+
*
|
|
1828
|
+
* @defaultValue `false`
|
|
1829
|
+
*/
|
|
827
1830
|
enableContextMenu?: boolean;
|
|
1831
|
+
/**
|
|
1832
|
+
* セル/行の**完全カスタム**コンテキストメニュー。右クリック時のみ呼ばれ、
|
|
1833
|
+
* 返した項目でメニューを描画する(ライブラリは固定の既定項目を持たない)。opt-in は
|
|
1834
|
+
* `enableContextMenu={true}` かつ本コールバックの指定の両方。**未指定、または `[]`
|
|
1835
|
+
* を返したときはブラウザ標準の右クリックメニューへフォールスルー**(空パネルは出さない)。SSRM
|
|
1836
|
+
* 未ロード行では開かない。ヘッダー右クリックは列メニュー(`enableColumnMenu`)が担当し、
|
|
1837
|
+
* 本メニューはボディ(セル / 行NO ガター)専用。詳細は「コンテキストメニュー」節を参照。
|
|
1838
|
+
*/
|
|
828
1839
|
getContextMenuItems?: (params: GridContextMenuParams<T, F>) => GridContextMenuItem<F>[];
|
|
1840
|
+
/** */
|
|
829
1841
|
onContextMenuOpen?: (params: GridContextMenuParams<T, F>) => void;
|
|
1842
|
+
/**
|
|
1843
|
+
* **スクロール位置インジケーター**。スクロール中にスクロールバー脇へ行番号バブル(「行 N /
|
|
1844
|
+
* 総行数」+ 任意の列値)と行目盛りルーラーを表示し、スクロールバー帯のホバーで「行 N へ」
|
|
1845
|
+
* のジャンプ先プレビューを出す。`true`
|
|
1846
|
+
* は全既定(`{ bubble: true, ruler: true, scrollbar: true, trigger: 'scroll', minRows: 0 }`)
|
|
1847
|
+
* と同義。`minRows` で「表示行数がしきい値以上のときだけ有効」のデータ量ゲートも掛けられる。
|
|
1848
|
+
* 表示は総行数とスクロール位置のみで駆動されるため **clientSide / SSRM の全構成で動作**。
|
|
1849
|
+
* オーバーレイは `pointer-events: none` で既存操作へ一切干渉しない。
|
|
1850
|
+
* 詳細は「スクロール位置インジケーター」節を参照。
|
|
1851
|
+
*
|
|
1852
|
+
* @defaultValue —(無効)
|
|
1853
|
+
*/
|
|
830
1854
|
scrollHint?: boolean | ScrollHintOptions<T, F>;
|
|
831
1855
|
};
|