@canvas-components/list-table 0.2.5 → 0.2.6

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 CHANGED
@@ -80,7 +80,7 @@ table.mount();
80
80
  | `carouselScroll` | `ListTableCarouselScrollOptions` | 自动轮播滚动配置 |
81
81
  | `stretchColumns` | `boolean` | 列总宽不足时是否拉伸补齐 |
82
82
  | `resizable` | `boolean` | 是否开启列宽拖拽 |
83
- | `storageKey` | `string` | 持久化键 |
83
+ | `storageKey` | `string` | 列配置、查询、缩放和密度持久化键 |
84
84
  | `draggable` | `boolean` | 是否开启列拖拽排序 |
85
85
  | `tableId` | `string` | 表格唯一标识 |
86
86
  | `rowDrag` | `ListTableRowDragOptions` | 行拖拽配置 |
package/dist/index.cjs CHANGED
@@ -239,11 +239,18 @@ var CanvasRenderer = class {
239
239
  height: Math.max(height, 0)
240
240
  } : this.resolveCoverSize(width, height);
241
241
  this.ctx.fillRect(0, safeTop, cover.width, cover.height);
242
+ const centerX = cover.width / 2;
243
+ const centerY = safeTop + cover.height / 2;
244
+ const showImage = cover.width >= 80 && cover.height >= 72;
245
+ if (showImage) {
246
+ const imageTop = centerY - 36;
247
+ drawSimpleEmptyIllustration(this.ctx, centerX - 32, imageTop);
248
+ }
242
249
  this.ctx.fillStyle = this.theme.emptyTextColor;
243
250
  this.ctx.font = `${this.theme.fontSize}px ${this.theme.fontFamily}`;
244
251
  this.ctx.textAlign = "center";
245
252
  this.ctx.textBaseline = "middle";
246
- this.ctx.fillText(text, cover.width / 2, safeTop + cover.height / 2);
253
+ this.ctx.fillText(text, centerX, showImage ? centerY + 28 : centerY);
247
254
  this.ctx.restore();
248
255
  }
249
256
  /**
@@ -257,6 +264,49 @@ var CanvasRenderer = class {
257
264
  };
258
265
  }
259
266
  };
267
+ function drawSimpleEmptyIllustration(ctx, left, top) {
268
+ ctx.save();
269
+ ctx.translate(left, top + 1);
270
+ ctx.beginPath();
271
+ ctx.ellipse(32, 33, 32, 7, 0, 0, Math.PI * 2);
272
+ ctx.fillStyle = "#f5f5f5";
273
+ ctx.fill();
274
+ ctx.strokeStyle = "#d9d9d9";
275
+ ctx.lineWidth = 1;
276
+ ctx.beginPath();
277
+ ctx.moveTo(55, 12.76);
278
+ ctx.lineTo(44.854, 1.258);
279
+ ctx.bezierCurveTo(44.367, 0.474, 43.656, 0, 42.907, 0);
280
+ ctx.lineTo(21.093, 0);
281
+ ctx.bezierCurveTo(20.344, 0, 19.633, 0.474, 19.146, 1.257);
282
+ ctx.lineTo(9, 12.761);
283
+ ctx.lineTo(9, 22);
284
+ ctx.lineTo(55, 22);
285
+ ctx.lineTo(55, 12.76);
286
+ ctx.closePath();
287
+ ctx.stroke();
288
+ ctx.beginPath();
289
+ ctx.moveTo(41.613, 15.931);
290
+ ctx.bezierCurveTo(41.613, 14.326, 42.607, 13.001, 43.84, 13);
291
+ ctx.lineTo(55, 13);
292
+ ctx.lineTo(55, 31.137);
293
+ ctx.bezierCurveTo(55, 33.26, 53.68, 35, 52.05, 35);
294
+ ctx.lineTo(11.95, 35);
295
+ ctx.bezierCurveTo(10.32, 35, 9, 33.259, 9, 31.137);
296
+ ctx.lineTo(9, 13);
297
+ ctx.lineTo(20.16, 13);
298
+ ctx.bezierCurveTo(21.393, 13, 22.387, 14.323, 22.387, 15.928);
299
+ ctx.lineTo(22.387, 15.95);
300
+ ctx.bezierCurveTo(22.387, 17.555, 23.392, 18.851, 24.624, 18.851);
301
+ ctx.lineTo(39.376, 18.851);
302
+ ctx.bezierCurveTo(40.608, 18.851, 41.613, 17.543, 41.613, 15.938);
303
+ ctx.lineTo(41.613, 15.931);
304
+ ctx.closePath();
305
+ ctx.fillStyle = "#fafafa";
306
+ ctx.fill();
307
+ ctx.stroke();
308
+ ctx.restore();
309
+ }
260
310
 
261
311
  // src/domain/columns/compute-column-widths.ts
262
312
  function computeColumnWidths(columns) {
@@ -930,10 +980,11 @@ function collectLeafColumns(columns) {
930
980
  }
931
981
 
932
982
  // src/domain/constants.ts
933
- var DEFAULT_ROW_HEIGHT = 40;
934
- var DEFAULT_HEADER_ROW_HEIGHT = 42;
983
+ var DEFAULT_ROW_HEIGHT = 32;
984
+ var DEFAULT_HEADER_ROW_HEIGHT = DEFAULT_ROW_HEIGHT;
935
985
  var HORIZONTAL_SCROLL_STEP = 120;
936
- var DEFAULT_SUMMARY_ROW_HEIGHT = 40;
986
+ var DEFAULT_SUMMARY_ROW_HEIGHT = DEFAULT_ROW_HEIGHT;
987
+ var DEFAULT_EMPTY_BODY_HEIGHT = 96;
937
988
  var DEFAULT_PAGINATION_PAGE_SIZE = 10;
938
989
  var FALLBACK_TABLE_WIDTH = 320;
939
990
  var FALLBACK_TABLE_HEIGHT = 240;
@@ -1507,8 +1558,8 @@ var defaultListTableTheme = {
1507
1558
  hoverBackgroundColor: "#edf4ff",
1508
1559
  selectionBackgroundColor: "#dbeafe",
1509
1560
  textSelectionBackgroundColor: "#99c2ff",
1510
- emptyBackgroundColor: "#f8fafc",
1511
- emptyTextColor: "#63748a",
1561
+ emptyBackgroundColor: "#ffffff",
1562
+ emptyTextColor: "#8c8c8c",
1512
1563
  debugStrokeColor: "#ef4444",
1513
1564
  debugFillColor: "rgba(239, 68, 68, 0.08)",
1514
1565
  fontFamily: '"Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif',
@@ -8013,15 +8064,11 @@ function resolvePointerHitWithScrollbars(result, x, y, scrollbarLayout) {
8013
8064
  return result;
8014
8065
  }
8015
8066
  function resolveScrollbarVisibility(params) {
8016
- const { options, draggingScrollbar, continuousScrollActive, hover, scrollbarActiveUntil, now: now2 } = params;
8017
- const scrollbarOption = options.scrollbar;
8018
- if (scrollbarOption?.visible === true) {
8067
+ const scrollbarOption = params.options.scrollbar;
8068
+ if (scrollbarOption?.visible !== false) {
8019
8069
  return true;
8020
8070
  }
8021
- if (scrollbarOption?.visible === false) {
8022
- return false;
8023
- }
8024
- return draggingScrollbar || continuousScrollActive || hover.area === "horizontal-scrollbar" || hover.area === "vertical-scrollbar" || hover.area !== "empty" || now2 < scrollbarActiveUntil;
8071
+ return false;
8025
8072
  }
8026
8073
 
8027
8074
  // src/services/pointer-hit-service.ts
@@ -13637,13 +13684,13 @@ function showHeaderContextMenu(params) {
13637
13684
  return true;
13638
13685
  }
13639
13686
  function resolveContextMenuDensity(rowHeight) {
13640
- if (rowHeight === 48) {
13687
+ if (rowHeight === 56) {
13641
13688
  return "comfortable";
13642
13689
  }
13643
13690
  if (rowHeight === 32) {
13644
13691
  return "compact";
13645
13692
  }
13646
- return "middle";
13693
+ return rowHeight === 48 ? "middle" : "compact";
13647
13694
  }
13648
13695
 
13649
13696
  // src/features/tooltip/tooltip-feature.ts
@@ -15213,7 +15260,7 @@ var ListTableEventController = class {
15213
15260
  headerTree: this.host.headerTree,
15214
15261
  headerRowsCache: this.host.headerRowsCache,
15215
15262
  pointerX: position.x,
15216
- headerRowHeight: DEFAULT_HEADER_ROW_HEIGHT,
15263
+ headerRowHeight: this.host.currentRenderSnapshot?.headerRowHeight ?? DEFAULT_HEADER_ROW_HEIGHT,
15217
15264
  allowGrouping: this.host.groupBarVisible,
15218
15265
  getMovableLeafColumns: (node, hitRect) => getHeaderNodeMovableLeafColumns({
15219
15266
  node,
@@ -15550,7 +15597,7 @@ var ListTableEventController = class {
15550
15597
  },
15551
15598
  summaryVisible: Boolean(this.host.currentRenderSnapshot?.hasSummary),
15552
15599
  onToggleSummary: () => {
15553
- this.host.options.summaryRowHeight = this.host.currentRenderSnapshot?.hasSummary ? 0 : DEFAULT_SUMMARY_ROW_HEIGHT;
15600
+ this.host.options.summaryRowHeight = this.host.currentRenderSnapshot?.hasSummary ? 0 : this.host.currentRenderSnapshot?.rowHeight ?? DEFAULT_SUMMARY_ROW_HEIGHT;
15554
15601
  this.host.persistColumnConfig();
15555
15602
  this.host.render();
15556
15603
  },
@@ -17415,9 +17462,9 @@ function resolveToggleHeaderColumnVisibilityAction(params) {
17415
17462
  function resolveDensitySizes(density) {
17416
17463
  if (density === "comfortable") {
17417
17464
  return {
17418
- rowHeight: 48,
17419
- headerRowHeight: 48,
17420
- summaryRowHeight: 48
17465
+ rowHeight: 56,
17466
+ headerRowHeight: 56,
17467
+ summaryRowHeight: 56
17421
17468
  };
17422
17469
  }
17423
17470
  if (density === "compact") {
@@ -17428,9 +17475,9 @@ function resolveDensitySizes(density) {
17428
17475
  };
17429
17476
  }
17430
17477
  return {
17431
- rowHeight: 40,
17432
- headerRowHeight: 40,
17433
- summaryRowHeight: 40
17478
+ rowHeight: 48,
17479
+ headerRowHeight: 48,
17480
+ summaryRowHeight: 48
17434
17481
  };
17435
17482
  }
17436
17483
 
@@ -17581,6 +17628,9 @@ var ListTableHeaderActionController = class {
17581
17628
  headerRowHeight: nextSize.headerRowHeight,
17582
17629
  summaryRowHeight: nextSize.summaryRowHeight
17583
17630
  });
17631
+ this.options.resetSummaryValues();
17632
+ options.ui?.onDensityChange?.(nextSize.rowHeight);
17633
+ this.options.persistColumnConfig();
17584
17634
  this.options.hideHeaderContextMenu();
17585
17635
  this.options.requestRender();
17586
17636
  }
@@ -18050,7 +18100,7 @@ function applyStoredColumnConfig(columns, storedColumns) {
18050
18100
  };
18051
18101
  applyToColumns(columns);
18052
18102
  }
18053
- function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryRowHeight) {
18103
+ function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryRowHeight, density) {
18054
18104
  const result = {};
18055
18105
  const collectColumns = (cols) => {
18056
18106
  for (const col of cols) {
@@ -18085,7 +18135,8 @@ function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryR
18085
18135
  },
18086
18136
  filters: filterState,
18087
18137
  ...typeof zoom === "number" && Number.isFinite(zoom) && zoom > 0 ? { zoom } : null,
18088
- ...typeof summaryRowHeight === "number" && Number.isFinite(summaryRowHeight) && summaryRowHeight >= 0 ? { summaryRowHeight } : null
18138
+ ...typeof summaryRowHeight === "number" && Number.isFinite(summaryRowHeight) && summaryRowHeight >= 0 ? { summaryRowHeight } : null,
18139
+ ...density === 32 || density === 48 || density === 56 ? { density } : null
18089
18140
  };
18090
18141
  }
18091
18142
 
@@ -18097,7 +18148,8 @@ function persistListTableColumnConfig(params) {
18097
18148
  sortState,
18098
18149
  filterState,
18099
18150
  zoom,
18100
- summaryRowHeight
18151
+ summaryRowHeight,
18152
+ density
18101
18153
  } = params;
18102
18154
  if (!storageKey) {
18103
18155
  return;
@@ -18110,7 +18162,8 @@ function persistListTableColumnConfig(params) {
18110
18162
  sortState,
18111
18163
  filterState,
18112
18164
  zoom,
18113
- summaryRowHeight
18165
+ summaryRowHeight,
18166
+ density
18114
18167
  )
18115
18168
  );
18116
18169
  }
@@ -18132,7 +18185,8 @@ async function loadListTableStoredConfig(params) {
18132
18185
  } : null,
18133
18186
  filterState: stored.filters ? stored.filters : null,
18134
18187
  zoom: typeof stored.zoom === "number" && Number.isFinite(stored.zoom) && stored.zoom > 0 ? stored.zoom : null,
18135
- summaryRowHeight: typeof stored.summaryRowHeight === "number" && Number.isFinite(stored.summaryRowHeight) && stored.summaryRowHeight >= 0 ? stored.summaryRowHeight : null
18188
+ summaryRowHeight: typeof stored.summaryRowHeight === "number" && Number.isFinite(stored.summaryRowHeight) && stored.summaryRowHeight >= 0 ? stored.summaryRowHeight : null,
18189
+ density: stored.density === 32 || stored.density === 48 || stored.density === 56 ? stored.density : null
18136
18190
  };
18137
18191
  }
18138
18192
 
@@ -18163,13 +18217,26 @@ var ListTablePersistenceController = class {
18163
18217
  this.options.domHost.setContentZoom(nextZoom);
18164
18218
  this.options.canvasHost.setContentZoom(nextZoom);
18165
18219
  }
18220
+ let currentOptions = this.options.getOptions();
18221
+ if (stored.density != null) {
18222
+ currentOptions = {
18223
+ ...currentOptions,
18224
+ rowHeight: stored.density,
18225
+ headerRowHeight: stored.density,
18226
+ summaryRowHeight: stored.density
18227
+ };
18228
+ }
18166
18229
  if (stored.summaryRowHeight != null) {
18167
- const currentOptions = this.options.getOptions();
18168
- if (currentOptions.summaryRowHeight !== stored.summaryRowHeight) {
18169
- this.options.setOptions({
18170
- ...currentOptions,
18171
- summaryRowHeight: stored.summaryRowHeight
18172
- });
18230
+ currentOptions = {
18231
+ ...currentOptions,
18232
+ summaryRowHeight: stored.summaryRowHeight
18233
+ };
18234
+ }
18235
+ if (currentOptions !== this.options.getOptions()) {
18236
+ this.options.setOptions(currentOptions);
18237
+ if (stored.density != null) {
18238
+ this.options.resetSummaryValues();
18239
+ currentOptions.ui?.onDensityChange?.(stored.density);
18173
18240
  }
18174
18241
  }
18175
18242
  this.options.refreshRuntimeColumns();
@@ -18183,7 +18250,8 @@ var ListTablePersistenceController = class {
18183
18250
  sortState: this.options.getSortState(),
18184
18251
  filterState: this.options.getFilterState(),
18185
18252
  zoom: this.options.getTableZoom(),
18186
- summaryRowHeight: tableOptions.summaryRowHeight
18253
+ summaryRowHeight: tableOptions.summaryRowHeight,
18254
+ density: tableOptions.rowHeight
18187
18255
  });
18188
18256
  }
18189
18257
  };
@@ -18543,7 +18611,7 @@ function computeScrollbarLayout(params) {
18543
18611
  };
18544
18612
  }
18545
18613
  const verticalTrackHeight = Math.max(
18546
- params.bodyHeight - verticalTop - verticalBottom - (params.maxScrollLeft > 0 ? thickness : 0),
18614
+ params.bodyHeight - verticalTop - verticalBottom,
18547
18615
  0
18548
18616
  );
18549
18617
  const verticalTrackX = params.width - thickness - verticalRight;
@@ -19997,7 +20065,6 @@ function resolveExpandedRowHeight2(height, record, index) {
19997
20065
 
19998
20066
  // src/services/layout-service.ts
19999
20067
  var AUTO_ROW_HEIGHT_SAMPLE_COUNT = 200;
20000
- var LIST_TABLE_GROUPING_BAR_HEIGHT = 44;
20001
20068
  function buildListTableRenderSnapshot(params) {
20002
20069
  if (params.cache?.snapshot && params.cache.snapshot.groupIndex === params.cache.groupIndex && isSameRenderCacheInputs(params.cache.inputs, params)) {
20003
20070
  const snapshotStartedAt2 = resolvePerformanceNow2();
@@ -20024,8 +20091,8 @@ function buildListTableRenderSnapshot(params) {
20024
20091
  const {
20025
20092
  options,
20026
20093
  theme,
20027
- width,
20028
- height,
20094
+ width: hostWidth,
20095
+ height: hostHeight,
20029
20096
  scroll,
20030
20097
  selectedRowKeys,
20031
20098
  query,
@@ -20036,6 +20103,9 @@ function buildListTableRenderSnapshot(params) {
20036
20103
  baseRowsOverride,
20037
20104
  displayRowsOverride
20038
20105
  } = params;
20106
+ const scrollbarThickness = options.scrollbar?.visible === false ? 0 : Math.max(options.scrollbar?.thickness ?? 10, 6);
20107
+ let width = hostWidth;
20108
+ let height = hostHeight;
20039
20109
  const sourceNormalizedColumns = normalizeColumns(
20040
20110
  getResolvedColumns(options, selectedRowKeys)
20041
20111
  );
@@ -20074,15 +20144,15 @@ function buildListTableRenderSnapshot(params) {
20074
20144
  const expandableState = resolveExpandableState({
20075
20145
  expandable: options.expandable
20076
20146
  });
20077
- const rowHeight = options.rowHeight == null || options.rowHeight === "auto" ? resolveAutoRowHeight({
20147
+ const rowHeight = options.rowHeight === "auto" ? resolveAutoRowHeight({
20078
20148
  rows: queryRows.displayRows,
20079
20149
  leafColumns,
20080
20150
  theme,
20081
20151
  cache: params.cache
20082
20152
  }) : options.rowHeight ?? DEFAULT_ROW_HEIGHT;
20083
- const headerRowHeight = options.headerRowHeight ?? DEFAULT_HEADER_ROW_HEIGHT;
20084
- const summaryRowHeight = options.summaryRowHeight ?? DEFAULT_SUMMARY_ROW_HEIGHT;
20085
- const groupingBarHeight = params.groupBarVisible ? LIST_TABLE_GROUPING_BAR_HEIGHT : 0;
20153
+ const headerRowHeight = options.headerRowHeight ?? rowHeight;
20154
+ const summaryRowHeight = options.summaryRowHeight ?? rowHeight;
20155
+ const groupingBarHeight = params.groupBarVisible ? rowHeight : 0;
20086
20156
  const columnHeaderHeight = (headerInfo.maxDepth + 1) * headerRowHeight;
20087
20157
  const headerHeight = groupingBarHeight + columnHeaderHeight;
20088
20158
  const hasConfiguredSummary = leafColumns.some(
@@ -20288,11 +20358,11 @@ function buildListTableRenderSnapshot(params) {
20288
20358
  scrollRowCount: plainRowWindow.totalRowCount
20289
20359
  });
20290
20360
  }
20291
- const columnMetrics = resolveColumnMetrics({
20361
+ let columnMetrics = resolveColumnMetrics({
20292
20362
  columns: leafColumns,
20293
20363
  tableWidth: width
20294
20364
  });
20295
- const viewportResult = computeViewport({
20365
+ let viewportResult = computeViewport({
20296
20366
  width,
20297
20367
  height,
20298
20368
  headerHeight,
@@ -20303,6 +20373,59 @@ function buildListTableRenderSnapshot(params) {
20303
20373
  fixedWidthRight: columnMetrics.fixedWidthRight,
20304
20374
  scroll
20305
20375
  });
20376
+ for (let index = 0; index < 2 && scrollbarThickness > 0; index += 1) {
20377
+ const nextWidth = Math.max(
20378
+ hostWidth - (viewportResult.viewport.maxScrollTop > 0 ? scrollbarThickness : 0),
20379
+ 0
20380
+ );
20381
+ const nextHeight = Math.max(
20382
+ hostHeight - (viewportResult.viewport.maxScrollLeft > 0 ? scrollbarThickness : 0),
20383
+ 0
20384
+ );
20385
+ if (nextWidth === width && nextHeight === height) {
20386
+ break;
20387
+ }
20388
+ width = nextWidth;
20389
+ height = nextHeight;
20390
+ bodyState = resolveCurrentBodyState();
20391
+ if (plainRowWindow) {
20392
+ bodyState.frozenRows.scroll.windowed = true;
20393
+ bodyState.frozenRows.scroll.rowIndexMap = plainRowWindow.rowIndexMap;
20394
+ bodyState.frozenRows.scroll.rowOffsetMap = plainRowWindow.rowOffsetMap;
20395
+ bodyState.bodyLayout = resolveBodyLayout({
20396
+ height,
20397
+ headerHeight,
20398
+ summaryRowHeight,
20399
+ hasSummary,
20400
+ rowHeight,
20401
+ totalBodyHeight: plainRowWindow.totalBodyHeight,
20402
+ topFrozenRowCount: 0,
20403
+ bottomFrozenRowCount: 0,
20404
+ scrollRowCount: plainRowWindow.totalRowCount
20405
+ });
20406
+ }
20407
+ columnMetrics = resolveColumnMetrics({
20408
+ columns: leafColumns,
20409
+ tableWidth: width
20410
+ });
20411
+ viewportResult = computeViewport({
20412
+ width,
20413
+ height,
20414
+ headerHeight,
20415
+ bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20416
+ totalWidth: columnMetrics.totalWidth,
20417
+ totalBodyHeight: bodyState.bodyLayout.totalBodyHeight,
20418
+ fixedWidthLeft: columnMetrics.fixedWidthLeft,
20419
+ fixedWidthRight: columnMetrics.fixedWidthRight,
20420
+ scroll
20421
+ });
20422
+ }
20423
+ scrollPageSize = resolveScrollPageSize({
20424
+ options,
20425
+ pageSize: query.pagination.pageSize,
20426
+ bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20427
+ rowHeight
20428
+ });
20306
20429
  const nextScroll = viewportResult.scroll;
20307
20430
  const columnSegments = resolveColumnSegments({
20308
20431
  metrics: columnMetrics,
@@ -20310,8 +20433,8 @@ function buildListTableRenderSnapshot(params) {
20310
20433
  swapAnimation
20311
20434
  });
20312
20435
  const scrollbarLayout = computeScrollbarLayout({
20313
- width,
20314
- height,
20436
+ width: hostWidth,
20437
+ height: hostHeight,
20315
20438
  bodyTop: bodyState.bodyLayout.scrollBodyTop,
20316
20439
  bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20317
20440
  centerVisibleWidth: columnMetrics.availableCenterWidth,
@@ -20509,8 +20632,8 @@ function resolveUngroupedDataRowCount(visibleRows) {
20509
20632
  function updateListTableRenderSnapshotScroll(params) {
20510
20633
  const { snapshot, width, height, scroll, options } = params;
20511
20634
  const viewportResult = computeViewport({
20512
- width,
20513
- height,
20635
+ width: snapshot.width,
20636
+ height: snapshot.height,
20514
20637
  headerHeight: snapshot.bodyLayout.scrollBodyTop - snapshot.bodyLayout.topFrozenHeight,
20515
20638
  bodyHeight: snapshot.bodyLayout.scrollBodyHeight,
20516
20639
  totalWidth: snapshot.columnMetrics.totalWidth,
@@ -20946,7 +21069,7 @@ function resolveListTableRenderHostSize(params) {
20946
21069
  }
20947
21070
 
20948
21071
  // src/rendering/primitives/draw-scrollbars.ts
20949
- function drawScrollbars(ctx, layout, descriptors, opacity = 1, interactive = true) {
21072
+ function drawScrollbars(ctx, layout, descriptors, borderColor, opacity = 1, interactive = true) {
20950
21073
  const alpha = Number.isFinite(opacity) ? Math.min(Math.max(opacity, 0), 1) : 1;
20951
21074
  if (alpha <= 1e-3) {
20952
21075
  return;
@@ -20954,14 +21077,28 @@ function drawScrollbars(ctx, layout, descriptors, opacity = 1, interactive = tru
20954
21077
  ctx.save();
20955
21078
  ctx.globalAlpha = alpha;
20956
21079
  if (layout.horizontal) {
20957
- drawAxisScrollbar(ctx, layout.horizontal, "horizontal", descriptors, interactive);
21080
+ drawAxisScrollbar(
21081
+ ctx,
21082
+ layout.horizontal,
21083
+ "horizontal",
21084
+ descriptors,
21085
+ borderColor,
21086
+ interactive
21087
+ );
20958
21088
  }
20959
21089
  if (layout.vertical) {
20960
- drawAxisScrollbar(ctx, layout.vertical, "vertical", descriptors, interactive);
21090
+ drawAxisScrollbar(
21091
+ ctx,
21092
+ layout.vertical,
21093
+ "vertical",
21094
+ descriptors,
21095
+ borderColor,
21096
+ interactive
21097
+ );
20961
21098
  }
20962
21099
  ctx.restore();
20963
21100
  }
20964
- function drawAxisScrollbar(ctx, layout, axis, descriptors, interactive) {
21101
+ function drawAxisScrollbar(ctx, layout, axis, descriptors, borderColor, interactive) {
20965
21102
  const kind = axis === "horizontal" ? "horizontal-scrollbar" : "vertical-scrollbar";
20966
21103
  if (interactive) {
20967
21104
  descriptors.push({
@@ -20989,16 +21126,19 @@ function drawAxisScrollbar(ctx, layout, axis, descriptors, interactive) {
20989
21126
  scrollbarRole: "increase-button"
20990
21127
  });
20991
21128
  }
20992
- drawTrack(ctx, layout.track);
21129
+ drawTrack(ctx, layout.track, borderColor);
20993
21130
  drawButton(ctx, layout.decreaseButton, axis, "decrease");
20994
21131
  drawButton(ctx, layout.increaseButton, axis, "increase");
20995
21132
  drawThumb(ctx, layout.thumb);
20996
21133
  }
20997
- function drawTrack(ctx, rect) {
21134
+ function drawTrack(ctx, rect, borderColor) {
20998
21135
  ctx.save();
20999
21136
  ctx.fillStyle = "rgba(148, 163, 184, 0.16)";
21137
+ ctx.strokeStyle = borderColor;
21138
+ ctx.lineWidth = 1;
21000
21139
  roundRect(ctx, rect.x, rect.y, rect.width, rect.height, rect.height / 2);
21001
21140
  ctx.fill();
21141
+ ctx.stroke();
21002
21142
  ctx.restore();
21003
21143
  }
21004
21144
  function drawThumb(ctx, rect) {
@@ -23837,7 +23977,7 @@ function executeListTableRenderPipeline(params) {
23837
23977
  renderer.drawEmpty(
23838
23978
  width,
23839
23979
  bodyAreaHeight,
23840
- options.emptyText ?? "\u5F53\u524D\u6CA1\u6709\u53EF\u5C55\u793A\u7684\u6570\u636E\u3002",
23980
+ options.emptyText ?? "\u6682\u65E0\u6570\u636E",
23841
23981
  headerHeight
23842
23982
  );
23843
23983
  } else {
@@ -24004,6 +24144,7 @@ function executeListTableRenderPipeline(params) {
24004
24144
  ctx,
24005
24145
  snapshot.scrollbarLayout,
24006
24146
  descriptors,
24147
+ theme.borderColor,
24007
24148
  scrollbarOpacity,
24008
24149
  isScrollbarInteractive
24009
24150
  );
@@ -24354,7 +24495,7 @@ var ListTableRenderController = class {
24354
24495
  const layoutWidth = hostSize.width / zoom;
24355
24496
  const layoutAvailableHeight = availableHeight / zoom;
24356
24497
  const currentSnapshot = this.currentRenderSnapshot;
24357
- const measureSnapshot = currentSnapshot && currentSnapshot.width === layoutWidth && currentSnapshot.groupingBarHeight === (this.options.getGroupBarVisible?.() ? LIST_TABLE_GROUPING_BAR_HEIGHT : 0) && currentSnapshot.groupingColumns.map((column) => column.key).join("") === (this.options.getGroupColumnKeys?.() ?? []).join("") ? currentSnapshot : this.buildSnapshot(layoutWidth, layoutAvailableHeight, false);
24498
+ const measureSnapshot = currentSnapshot && currentSnapshot.width === layoutWidth && currentSnapshot.groupingBarHeight === (this.options.getGroupBarVisible?.() ? currentSnapshot.rowHeight : 0) && currentSnapshot.groupingColumns.map((column) => column.key).join("") === (this.options.getGroupColumnKeys?.() ?? []).join("") ? currentSnapshot : this.buildSnapshot(layoutWidth, layoutAvailableHeight, false);
24358
24499
  if (!measureSnapshot) {
24359
24500
  this.options.setFittedHeight(null);
24360
24501
  return;
@@ -24367,7 +24508,7 @@ var ListTableRenderController = class {
24367
24508
  topFrozenHeight: measureSnapshot.bodyLayout.topFrozenHeight,
24368
24509
  totalBodyHeight: Math.max(
24369
24510
  measureSnapshot.bodyLayout.totalBodyHeight,
24370
- measureSnapshot.displayRows.length === 0 ? measureSnapshot.rowHeight : 0
24511
+ measureSnapshot.displayRows.length === 0 ? Math.max(measureSnapshot.rowHeight, DEFAULT_EMPTY_BODY_HEIGHT) : 0
24371
24512
  ),
24372
24513
  bottomFrozenHeight: measureSnapshot.bodyLayout.bottomFrozenHeight,
24373
24514
  summaryHeight: measureSnapshot.bodyLayout.summaryHeight
@@ -25669,9 +25810,7 @@ function assembleListTableCoreControllers(core, options) {
25669
25810
  draggingScrollbar: core.draggingScrollbar != null,
25670
25811
  continuousScrollActive: core.eventController.isContinuousScrollActive(),
25671
25812
  hover: core.storeFacade.hover,
25672
- scrollbarActiveUntil: core.animationController.getScrollbarActiveUntil(),
25673
- now: Date.now()
25674
- });
25813
+ scrollbarActiveUntil: core.animationController.getScrollbarActiveUntil()});
25675
25814
  const applyRenderResult = (result) => {
25676
25815
  applyListTableRenderPassResult({
25677
25816
  didRender: result.didRender,
@@ -25977,6 +26116,7 @@ function assembleListTableCoreControllers(core, options) {
25977
26116
  }
25978
26117
  },
25979
26118
  isEditing: () => core.editingController.getSession() != null,
26119
+ resetSummaryValues: () => core.summaryController.reset(),
25980
26120
  requestRender: () => render()
25981
26121
  });
25982
26122
  core.contentActionController = new ListTableContentActionController({
@@ -26005,6 +26145,7 @@ function assembleListTableCoreControllers(core, options) {
26005
26145
  domHost: core.domHost,
26006
26146
  canvasHost: core.canvasHost,
26007
26147
  refreshRuntimeColumns,
26148
+ resetSummaryValues: () => core.summaryController.reset(),
26008
26149
  requestRender: () => render()
26009
26150
  });
26010
26151
  core.carouselController = new ListTableCarouselController({
@@ -26467,6 +26608,14 @@ var ListTableCore = class {
26467
26608
  resetFilter() {
26468
26609
  this.headerActionController.resetFilters();
26469
26610
  }
26611
+ /**
26612
+ * 设置内置表格密度。
26613
+ */
26614
+ changeDensity(density) {
26615
+ this.headerActionController.changeTableDensity(
26616
+ density === 32 ? "compact" : density === 56 ? "comfortable" : "middle"
26617
+ );
26618
+ }
26470
26619
  /**
26471
26620
  * 销毁实例。
26472
26621
  */
@@ -26589,6 +26738,12 @@ var ListTable = class {
26589
26738
  resetFilter() {
26590
26739
  this.core?.resetFilter();
26591
26740
  }
26741
+ /**
26742
+ * 设置并持久化内置表格密度。
26743
+ */
26744
+ changeDensity(density) {
26745
+ this.core?.changeDensity(density);
26746
+ }
26592
26747
  /**
26593
26748
  * 销毁实例。
26594
26749
  */