@canvas-components/list-table 0.2.5 → 0.2.7

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/dist/index.js CHANGED
@@ -237,11 +237,18 @@ var CanvasRenderer = class {
237
237
  height: Math.max(height, 0)
238
238
  } : this.resolveCoverSize(width, height);
239
239
  this.ctx.fillRect(0, safeTop, cover.width, cover.height);
240
+ const centerX = cover.width / 2;
241
+ const centerY = safeTop + cover.height / 2;
242
+ const showImage = cover.width >= 80 && cover.height >= 72;
243
+ if (showImage) {
244
+ const imageTop = centerY - 36;
245
+ drawSimpleEmptyIllustration(this.ctx, centerX - 32, imageTop);
246
+ }
240
247
  this.ctx.fillStyle = this.theme.emptyTextColor;
241
248
  this.ctx.font = `${this.theme.fontSize}px ${this.theme.fontFamily}`;
242
249
  this.ctx.textAlign = "center";
243
250
  this.ctx.textBaseline = "middle";
244
- this.ctx.fillText(text, cover.width / 2, safeTop + cover.height / 2);
251
+ this.ctx.fillText(text, centerX, showImage ? centerY + 28 : centerY);
245
252
  this.ctx.restore();
246
253
  }
247
254
  /**
@@ -255,6 +262,49 @@ var CanvasRenderer = class {
255
262
  };
256
263
  }
257
264
  };
265
+ function drawSimpleEmptyIllustration(ctx, left, top) {
266
+ ctx.save();
267
+ ctx.translate(left, top + 1);
268
+ ctx.beginPath();
269
+ ctx.ellipse(32, 33, 32, 7, 0, 0, Math.PI * 2);
270
+ ctx.fillStyle = "#f5f5f5";
271
+ ctx.fill();
272
+ ctx.strokeStyle = "#d9d9d9";
273
+ ctx.lineWidth = 1;
274
+ ctx.beginPath();
275
+ ctx.moveTo(55, 12.76);
276
+ ctx.lineTo(44.854, 1.258);
277
+ ctx.bezierCurveTo(44.367, 0.474, 43.656, 0, 42.907, 0);
278
+ ctx.lineTo(21.093, 0);
279
+ ctx.bezierCurveTo(20.344, 0, 19.633, 0.474, 19.146, 1.257);
280
+ ctx.lineTo(9, 12.761);
281
+ ctx.lineTo(9, 22);
282
+ ctx.lineTo(55, 22);
283
+ ctx.lineTo(55, 12.76);
284
+ ctx.closePath();
285
+ ctx.stroke();
286
+ ctx.beginPath();
287
+ ctx.moveTo(41.613, 15.931);
288
+ ctx.bezierCurveTo(41.613, 14.326, 42.607, 13.001, 43.84, 13);
289
+ ctx.lineTo(55, 13);
290
+ ctx.lineTo(55, 31.137);
291
+ ctx.bezierCurveTo(55, 33.26, 53.68, 35, 52.05, 35);
292
+ ctx.lineTo(11.95, 35);
293
+ ctx.bezierCurveTo(10.32, 35, 9, 33.259, 9, 31.137);
294
+ ctx.lineTo(9, 13);
295
+ ctx.lineTo(20.16, 13);
296
+ ctx.bezierCurveTo(21.393, 13, 22.387, 14.323, 22.387, 15.928);
297
+ ctx.lineTo(22.387, 15.95);
298
+ ctx.bezierCurveTo(22.387, 17.555, 23.392, 18.851, 24.624, 18.851);
299
+ ctx.lineTo(39.376, 18.851);
300
+ ctx.bezierCurveTo(40.608, 18.851, 41.613, 17.543, 41.613, 15.938);
301
+ ctx.lineTo(41.613, 15.931);
302
+ ctx.closePath();
303
+ ctx.fillStyle = "#fafafa";
304
+ ctx.fill();
305
+ ctx.stroke();
306
+ ctx.restore();
307
+ }
258
308
 
259
309
  // src/domain/columns/compute-column-widths.ts
260
310
  function computeColumnWidths(columns) {
@@ -928,10 +978,11 @@ function collectLeafColumns(columns) {
928
978
  }
929
979
 
930
980
  // src/domain/constants.ts
931
- var DEFAULT_ROW_HEIGHT = 40;
932
- var DEFAULT_HEADER_ROW_HEIGHT = 42;
981
+ var DEFAULT_ROW_HEIGHT = 32;
982
+ var DEFAULT_HEADER_ROW_HEIGHT = DEFAULT_ROW_HEIGHT;
933
983
  var HORIZONTAL_SCROLL_STEP = 120;
934
- var DEFAULT_SUMMARY_ROW_HEIGHT = 40;
984
+ var DEFAULT_SUMMARY_ROW_HEIGHT = DEFAULT_ROW_HEIGHT;
985
+ var DEFAULT_EMPTY_BODY_HEIGHT = 96;
935
986
  var DEFAULT_PAGINATION_PAGE_SIZE = 10;
936
987
  var FALLBACK_TABLE_WIDTH = 320;
937
988
  var FALLBACK_TABLE_HEIGHT = 240;
@@ -1505,8 +1556,8 @@ var defaultListTableTheme = {
1505
1556
  hoverBackgroundColor: "#edf4ff",
1506
1557
  selectionBackgroundColor: "#dbeafe",
1507
1558
  textSelectionBackgroundColor: "#99c2ff",
1508
- emptyBackgroundColor: "#f8fafc",
1509
- emptyTextColor: "#63748a",
1559
+ emptyBackgroundColor: "#ffffff",
1560
+ emptyTextColor: "#8c8c8c",
1510
1561
  debugStrokeColor: "#ef4444",
1511
1562
  debugFillColor: "rgba(239, 68, 68, 0.08)",
1512
1563
  fontFamily: '"Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif',
@@ -8011,15 +8062,11 @@ function resolvePointerHitWithScrollbars(result, x, y, scrollbarLayout) {
8011
8062
  return result;
8012
8063
  }
8013
8064
  function resolveScrollbarVisibility(params) {
8014
- const { options, draggingScrollbar, continuousScrollActive, hover, scrollbarActiveUntil, now: now2 } = params;
8015
- const scrollbarOption = options.scrollbar;
8016
- if (scrollbarOption?.visible === true) {
8065
+ const scrollbarOption = params.options.scrollbar;
8066
+ if (scrollbarOption?.visible !== false) {
8017
8067
  return true;
8018
8068
  }
8019
- if (scrollbarOption?.visible === false) {
8020
- return false;
8021
- }
8022
- return draggingScrollbar || continuousScrollActive || hover.area === "horizontal-scrollbar" || hover.area === "vertical-scrollbar" || hover.area !== "empty" || now2 < scrollbarActiveUntil;
8069
+ return false;
8023
8070
  }
8024
8071
 
8025
8072
  // src/services/pointer-hit-service.ts
@@ -13635,13 +13682,13 @@ function showHeaderContextMenu(params) {
13635
13682
  return true;
13636
13683
  }
13637
13684
  function resolveContextMenuDensity(rowHeight) {
13638
- if (rowHeight === 48) {
13685
+ if (rowHeight === 56) {
13639
13686
  return "comfortable";
13640
13687
  }
13641
13688
  if (rowHeight === 32) {
13642
13689
  return "compact";
13643
13690
  }
13644
- return "middle";
13691
+ return rowHeight === 48 ? "middle" : "compact";
13645
13692
  }
13646
13693
 
13647
13694
  // src/features/tooltip/tooltip-feature.ts
@@ -15211,7 +15258,7 @@ var ListTableEventController = class {
15211
15258
  headerTree: this.host.headerTree,
15212
15259
  headerRowsCache: this.host.headerRowsCache,
15213
15260
  pointerX: position.x,
15214
- headerRowHeight: DEFAULT_HEADER_ROW_HEIGHT,
15261
+ headerRowHeight: this.host.currentRenderSnapshot?.headerRowHeight ?? DEFAULT_HEADER_ROW_HEIGHT,
15215
15262
  allowGrouping: this.host.groupBarVisible,
15216
15263
  getMovableLeafColumns: (node, hitRect) => getHeaderNodeMovableLeafColumns({
15217
15264
  node,
@@ -15548,7 +15595,7 @@ var ListTableEventController = class {
15548
15595
  },
15549
15596
  summaryVisible: Boolean(this.host.currentRenderSnapshot?.hasSummary),
15550
15597
  onToggleSummary: () => {
15551
- this.host.options.summaryRowHeight = this.host.currentRenderSnapshot?.hasSummary ? 0 : DEFAULT_SUMMARY_ROW_HEIGHT;
15598
+ this.host.options.summaryRowHeight = this.host.currentRenderSnapshot?.hasSummary ? 0 : this.host.currentRenderSnapshot?.rowHeight ?? DEFAULT_SUMMARY_ROW_HEIGHT;
15552
15599
  this.host.persistColumnConfig();
15553
15600
  this.host.render();
15554
15601
  },
@@ -17413,9 +17460,9 @@ function resolveToggleHeaderColumnVisibilityAction(params) {
17413
17460
  function resolveDensitySizes(density) {
17414
17461
  if (density === "comfortable") {
17415
17462
  return {
17416
- rowHeight: 48,
17417
- headerRowHeight: 48,
17418
- summaryRowHeight: 48
17463
+ rowHeight: 56,
17464
+ headerRowHeight: 56,
17465
+ summaryRowHeight: 56
17419
17466
  };
17420
17467
  }
17421
17468
  if (density === "compact") {
@@ -17426,9 +17473,9 @@ function resolveDensitySizes(density) {
17426
17473
  };
17427
17474
  }
17428
17475
  return {
17429
- rowHeight: 40,
17430
- headerRowHeight: 40,
17431
- summaryRowHeight: 40
17476
+ rowHeight: 48,
17477
+ headerRowHeight: 48,
17478
+ summaryRowHeight: 48
17432
17479
  };
17433
17480
  }
17434
17481
 
@@ -17579,6 +17626,9 @@ var ListTableHeaderActionController = class {
17579
17626
  headerRowHeight: nextSize.headerRowHeight,
17580
17627
  summaryRowHeight: nextSize.summaryRowHeight
17581
17628
  });
17629
+ this.options.resetSummaryValues();
17630
+ options.ui?.onDensityChange?.(nextSize.rowHeight);
17631
+ this.options.persistColumnConfig();
17582
17632
  this.options.hideHeaderContextMenu();
17583
17633
  this.options.requestRender();
17584
17634
  }
@@ -18048,7 +18098,7 @@ function applyStoredColumnConfig(columns, storedColumns) {
18048
18098
  };
18049
18099
  applyToColumns(columns);
18050
18100
  }
18051
- function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryRowHeight) {
18101
+ function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryRowHeight, density) {
18052
18102
  const result = {};
18053
18103
  const collectColumns = (cols) => {
18054
18104
  for (const col of cols) {
@@ -18083,7 +18133,8 @@ function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryR
18083
18133
  },
18084
18134
  filters: filterState,
18085
18135
  ...typeof zoom === "number" && Number.isFinite(zoom) && zoom > 0 ? { zoom } : null,
18086
- ...typeof summaryRowHeight === "number" && Number.isFinite(summaryRowHeight) && summaryRowHeight >= 0 ? { summaryRowHeight } : null
18136
+ ...typeof summaryRowHeight === "number" && Number.isFinite(summaryRowHeight) && summaryRowHeight >= 0 ? { summaryRowHeight } : null,
18137
+ ...density === 32 || density === 48 || density === 56 ? { density } : null
18087
18138
  };
18088
18139
  }
18089
18140
 
@@ -18095,7 +18146,8 @@ function persistListTableColumnConfig(params) {
18095
18146
  sortState,
18096
18147
  filterState,
18097
18148
  zoom,
18098
- summaryRowHeight
18149
+ summaryRowHeight,
18150
+ density
18099
18151
  } = params;
18100
18152
  if (!storageKey) {
18101
18153
  return;
@@ -18108,7 +18160,8 @@ function persistListTableColumnConfig(params) {
18108
18160
  sortState,
18109
18161
  filterState,
18110
18162
  zoom,
18111
- summaryRowHeight
18163
+ summaryRowHeight,
18164
+ density
18112
18165
  )
18113
18166
  );
18114
18167
  }
@@ -18130,7 +18183,8 @@ async function loadListTableStoredConfig(params) {
18130
18183
  } : null,
18131
18184
  filterState: stored.filters ? stored.filters : null,
18132
18185
  zoom: typeof stored.zoom === "number" && Number.isFinite(stored.zoom) && stored.zoom > 0 ? stored.zoom : null,
18133
- summaryRowHeight: typeof stored.summaryRowHeight === "number" && Number.isFinite(stored.summaryRowHeight) && stored.summaryRowHeight >= 0 ? stored.summaryRowHeight : null
18186
+ summaryRowHeight: typeof stored.summaryRowHeight === "number" && Number.isFinite(stored.summaryRowHeight) && stored.summaryRowHeight >= 0 ? stored.summaryRowHeight : null,
18187
+ density: stored.density === 32 || stored.density === 48 || stored.density === 56 ? stored.density : null
18134
18188
  };
18135
18189
  }
18136
18190
 
@@ -18161,13 +18215,26 @@ var ListTablePersistenceController = class {
18161
18215
  this.options.domHost.setContentZoom(nextZoom);
18162
18216
  this.options.canvasHost.setContentZoom(nextZoom);
18163
18217
  }
18218
+ let currentOptions = this.options.getOptions();
18219
+ if (stored.density != null) {
18220
+ currentOptions = {
18221
+ ...currentOptions,
18222
+ rowHeight: stored.density,
18223
+ headerRowHeight: stored.density,
18224
+ summaryRowHeight: stored.density
18225
+ };
18226
+ }
18164
18227
  if (stored.summaryRowHeight != null) {
18165
- const currentOptions = this.options.getOptions();
18166
- if (currentOptions.summaryRowHeight !== stored.summaryRowHeight) {
18167
- this.options.setOptions({
18168
- ...currentOptions,
18169
- summaryRowHeight: stored.summaryRowHeight
18170
- });
18228
+ currentOptions = {
18229
+ ...currentOptions,
18230
+ summaryRowHeight: stored.summaryRowHeight
18231
+ };
18232
+ }
18233
+ if (currentOptions !== this.options.getOptions()) {
18234
+ this.options.setOptions(currentOptions);
18235
+ if (stored.density != null) {
18236
+ this.options.resetSummaryValues();
18237
+ currentOptions.ui?.onDensityChange?.(stored.density);
18171
18238
  }
18172
18239
  }
18173
18240
  this.options.refreshRuntimeColumns();
@@ -18181,7 +18248,8 @@ var ListTablePersistenceController = class {
18181
18248
  sortState: this.options.getSortState(),
18182
18249
  filterState: this.options.getFilterState(),
18183
18250
  zoom: this.options.getTableZoom(),
18184
- summaryRowHeight: tableOptions.summaryRowHeight
18251
+ summaryRowHeight: tableOptions.summaryRowHeight,
18252
+ density: tableOptions.rowHeight
18185
18253
  });
18186
18254
  }
18187
18255
  };
@@ -18541,7 +18609,7 @@ function computeScrollbarLayout(params) {
18541
18609
  };
18542
18610
  }
18543
18611
  const verticalTrackHeight = Math.max(
18544
- params.bodyHeight - verticalTop - verticalBottom - (params.maxScrollLeft > 0 ? thickness : 0),
18612
+ params.bodyHeight - verticalTop - verticalBottom,
18545
18613
  0
18546
18614
  );
18547
18615
  const verticalTrackX = params.width - thickness - verticalRight;
@@ -19995,7 +20063,6 @@ function resolveExpandedRowHeight2(height, record, index) {
19995
20063
 
19996
20064
  // src/services/layout-service.ts
19997
20065
  var AUTO_ROW_HEIGHT_SAMPLE_COUNT = 200;
19998
- var LIST_TABLE_GROUPING_BAR_HEIGHT = 44;
19999
20066
  function buildListTableRenderSnapshot(params) {
20000
20067
  if (params.cache?.snapshot && params.cache.snapshot.groupIndex === params.cache.groupIndex && isSameRenderCacheInputs(params.cache.inputs, params)) {
20001
20068
  const snapshotStartedAt2 = resolvePerformanceNow2();
@@ -20022,8 +20089,8 @@ function buildListTableRenderSnapshot(params) {
20022
20089
  const {
20023
20090
  options,
20024
20091
  theme,
20025
- width,
20026
- height,
20092
+ width: hostWidth,
20093
+ height: hostHeight,
20027
20094
  scroll,
20028
20095
  selectedRowKeys,
20029
20096
  query,
@@ -20034,6 +20101,9 @@ function buildListTableRenderSnapshot(params) {
20034
20101
  baseRowsOverride,
20035
20102
  displayRowsOverride
20036
20103
  } = params;
20104
+ const scrollbarThickness = options.scrollbar?.visible === false ? 0 : Math.max(options.scrollbar?.thickness ?? 10, 6);
20105
+ let width = hostWidth;
20106
+ let height = hostHeight;
20037
20107
  const sourceNormalizedColumns = normalizeColumns(
20038
20108
  getResolvedColumns(options, selectedRowKeys)
20039
20109
  );
@@ -20072,15 +20142,19 @@ function buildListTableRenderSnapshot(params) {
20072
20142
  const expandableState = resolveExpandableState({
20073
20143
  expandable: options.expandable
20074
20144
  });
20075
- const rowHeight = options.rowHeight == null || options.rowHeight === "auto" ? resolveAutoRowHeight({
20145
+ const rowHeight = options.rowHeight === "auto" ? resolveAutoRowHeight({
20076
20146
  rows: queryRows.displayRows,
20077
20147
  leafColumns,
20078
20148
  theme,
20079
20149
  cache: params.cache
20080
20150
  }) : options.rowHeight ?? DEFAULT_ROW_HEIGHT;
20081
- const headerRowHeight = options.headerRowHeight ?? DEFAULT_HEADER_ROW_HEIGHT;
20082
- const summaryRowHeight = options.summaryRowHeight ?? DEFAULT_SUMMARY_ROW_HEIGHT;
20083
- const groupingBarHeight = params.groupBarVisible ? LIST_TABLE_GROUPING_BAR_HEIGHT : 0;
20151
+ const headerRowHeight = resolveListTableHeaderRowHeight({
20152
+ rowHeight: options.rowHeight,
20153
+ resolvedRowHeight: rowHeight,
20154
+ headerRowHeight: options.headerRowHeight
20155
+ });
20156
+ const summaryRowHeight = options.summaryRowHeight ?? rowHeight;
20157
+ const groupingBarHeight = params.groupBarVisible ? rowHeight : 0;
20084
20158
  const columnHeaderHeight = (headerInfo.maxDepth + 1) * headerRowHeight;
20085
20159
  const headerHeight = groupingBarHeight + columnHeaderHeight;
20086
20160
  const hasConfiguredSummary = leafColumns.some(
@@ -20286,11 +20360,11 @@ function buildListTableRenderSnapshot(params) {
20286
20360
  scrollRowCount: plainRowWindow.totalRowCount
20287
20361
  });
20288
20362
  }
20289
- const columnMetrics = resolveColumnMetrics({
20363
+ let columnMetrics = resolveColumnMetrics({
20290
20364
  columns: leafColumns,
20291
20365
  tableWidth: width
20292
20366
  });
20293
- const viewportResult = computeViewport({
20367
+ let viewportResult = computeViewport({
20294
20368
  width,
20295
20369
  height,
20296
20370
  headerHeight,
@@ -20301,6 +20375,59 @@ function buildListTableRenderSnapshot(params) {
20301
20375
  fixedWidthRight: columnMetrics.fixedWidthRight,
20302
20376
  scroll
20303
20377
  });
20378
+ for (let index = 0; index < 2 && scrollbarThickness > 0; index += 1) {
20379
+ const nextWidth = Math.max(
20380
+ hostWidth - (viewportResult.viewport.maxScrollTop > 0 ? scrollbarThickness : 0),
20381
+ 0
20382
+ );
20383
+ const nextHeight = Math.max(
20384
+ hostHeight - (viewportResult.viewport.maxScrollLeft > 0 ? scrollbarThickness : 0),
20385
+ 0
20386
+ );
20387
+ if (nextWidth === width && nextHeight === height) {
20388
+ break;
20389
+ }
20390
+ width = nextWidth;
20391
+ height = nextHeight;
20392
+ bodyState = resolveCurrentBodyState();
20393
+ if (plainRowWindow) {
20394
+ bodyState.frozenRows.scroll.windowed = true;
20395
+ bodyState.frozenRows.scroll.rowIndexMap = plainRowWindow.rowIndexMap;
20396
+ bodyState.frozenRows.scroll.rowOffsetMap = plainRowWindow.rowOffsetMap;
20397
+ bodyState.bodyLayout = resolveBodyLayout({
20398
+ height,
20399
+ headerHeight,
20400
+ summaryRowHeight,
20401
+ hasSummary,
20402
+ rowHeight,
20403
+ totalBodyHeight: plainRowWindow.totalBodyHeight,
20404
+ topFrozenRowCount: 0,
20405
+ bottomFrozenRowCount: 0,
20406
+ scrollRowCount: plainRowWindow.totalRowCount
20407
+ });
20408
+ }
20409
+ columnMetrics = resolveColumnMetrics({
20410
+ columns: leafColumns,
20411
+ tableWidth: width
20412
+ });
20413
+ viewportResult = computeViewport({
20414
+ width,
20415
+ height,
20416
+ headerHeight,
20417
+ bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20418
+ totalWidth: columnMetrics.totalWidth,
20419
+ totalBodyHeight: bodyState.bodyLayout.totalBodyHeight,
20420
+ fixedWidthLeft: columnMetrics.fixedWidthLeft,
20421
+ fixedWidthRight: columnMetrics.fixedWidthRight,
20422
+ scroll
20423
+ });
20424
+ }
20425
+ scrollPageSize = resolveScrollPageSize({
20426
+ options,
20427
+ pageSize: query.pagination.pageSize,
20428
+ bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20429
+ rowHeight
20430
+ });
20304
20431
  const nextScroll = viewportResult.scroll;
20305
20432
  const columnSegments = resolveColumnSegments({
20306
20433
  metrics: columnMetrics,
@@ -20308,8 +20435,8 @@ function buildListTableRenderSnapshot(params) {
20308
20435
  swapAnimation
20309
20436
  });
20310
20437
  const scrollbarLayout = computeScrollbarLayout({
20311
- width,
20312
- height,
20438
+ width: hostWidth,
20439
+ height: hostHeight,
20313
20440
  bodyTop: bodyState.bodyLayout.scrollBodyTop,
20314
20441
  bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20315
20442
  centerVisibleWidth: columnMetrics.availableCenterWidth,
@@ -20507,8 +20634,8 @@ function resolveUngroupedDataRowCount(visibleRows) {
20507
20634
  function updateListTableRenderSnapshotScroll(params) {
20508
20635
  const { snapshot, width, height, scroll, options } = params;
20509
20636
  const viewportResult = computeViewport({
20510
- width,
20511
- height,
20637
+ width: snapshot.width,
20638
+ height: snapshot.height,
20512
20639
  headerHeight: snapshot.bodyLayout.scrollBodyTop - snapshot.bodyLayout.topFrozenHeight,
20513
20640
  bodyHeight: snapshot.bodyLayout.scrollBodyHeight,
20514
20641
  totalWidth: snapshot.columnMetrics.totalWidth,
@@ -20784,6 +20911,9 @@ function resolveAutoRowHeightMeasureRows(rows, sampleCount = AUTO_ROW_HEIGHT_SAM
20784
20911
  }
20785
20912
  return rows.slice(0, sampleCount);
20786
20913
  }
20914
+ function resolveListTableHeaderRowHeight(params) {
20915
+ return params.headerRowHeight ?? (params.rowHeight === "auto" ? DEFAULT_ROW_HEIGHT : params.resolvedRowHeight);
20916
+ }
20787
20917
  function buildListTableDebugSnapshot(params) {
20788
20918
  const {
20789
20919
  snapshot,
@@ -20944,7 +21074,7 @@ function resolveListTableRenderHostSize(params) {
20944
21074
  }
20945
21075
 
20946
21076
  // src/rendering/primitives/draw-scrollbars.ts
20947
- function drawScrollbars(ctx, layout, descriptors, opacity = 1, interactive = true) {
21077
+ function drawScrollbars(ctx, layout, descriptors, borderColor, opacity = 1, interactive = true) {
20948
21078
  const alpha = Number.isFinite(opacity) ? Math.min(Math.max(opacity, 0), 1) : 1;
20949
21079
  if (alpha <= 1e-3) {
20950
21080
  return;
@@ -20952,14 +21082,28 @@ function drawScrollbars(ctx, layout, descriptors, opacity = 1, interactive = tru
20952
21082
  ctx.save();
20953
21083
  ctx.globalAlpha = alpha;
20954
21084
  if (layout.horizontal) {
20955
- drawAxisScrollbar(ctx, layout.horizontal, "horizontal", descriptors, interactive);
21085
+ drawAxisScrollbar(
21086
+ ctx,
21087
+ layout.horizontal,
21088
+ "horizontal",
21089
+ descriptors,
21090
+ borderColor,
21091
+ interactive
21092
+ );
20956
21093
  }
20957
21094
  if (layout.vertical) {
20958
- drawAxisScrollbar(ctx, layout.vertical, "vertical", descriptors, interactive);
21095
+ drawAxisScrollbar(
21096
+ ctx,
21097
+ layout.vertical,
21098
+ "vertical",
21099
+ descriptors,
21100
+ borderColor,
21101
+ interactive
21102
+ );
20959
21103
  }
20960
21104
  ctx.restore();
20961
21105
  }
20962
- function drawAxisScrollbar(ctx, layout, axis, descriptors, interactive) {
21106
+ function drawAxisScrollbar(ctx, layout, axis, descriptors, borderColor, interactive) {
20963
21107
  const kind = axis === "horizontal" ? "horizontal-scrollbar" : "vertical-scrollbar";
20964
21108
  if (interactive) {
20965
21109
  descriptors.push({
@@ -20987,16 +21131,19 @@ function drawAxisScrollbar(ctx, layout, axis, descriptors, interactive) {
20987
21131
  scrollbarRole: "increase-button"
20988
21132
  });
20989
21133
  }
20990
- drawTrack(ctx, layout.track);
21134
+ drawTrack(ctx, layout.track, borderColor);
20991
21135
  drawButton(ctx, layout.decreaseButton, axis, "decrease");
20992
21136
  drawButton(ctx, layout.increaseButton, axis, "increase");
20993
21137
  drawThumb(ctx, layout.thumb);
20994
21138
  }
20995
- function drawTrack(ctx, rect) {
21139
+ function drawTrack(ctx, rect, borderColor) {
20996
21140
  ctx.save();
20997
21141
  ctx.fillStyle = "rgba(148, 163, 184, 0.16)";
21142
+ ctx.strokeStyle = borderColor;
21143
+ ctx.lineWidth = 1;
20998
21144
  roundRect(ctx, rect.x, rect.y, rect.width, rect.height, rect.height / 2);
20999
21145
  ctx.fill();
21146
+ ctx.stroke();
21000
21147
  ctx.restore();
21001
21148
  }
21002
21149
  function drawThumb(ctx, rect) {
@@ -23835,7 +23982,7 @@ function executeListTableRenderPipeline(params) {
23835
23982
  renderer.drawEmpty(
23836
23983
  width,
23837
23984
  bodyAreaHeight,
23838
- options.emptyText ?? "\u5F53\u524D\u6CA1\u6709\u53EF\u5C55\u793A\u7684\u6570\u636E\u3002",
23985
+ options.emptyText ?? "\u6682\u65E0\u6570\u636E",
23839
23986
  headerHeight
23840
23987
  );
23841
23988
  } else {
@@ -24002,6 +24149,7 @@ function executeListTableRenderPipeline(params) {
24002
24149
  ctx,
24003
24150
  snapshot.scrollbarLayout,
24004
24151
  descriptors,
24152
+ theme.borderColor,
24005
24153
  scrollbarOpacity,
24006
24154
  isScrollbarInteractive
24007
24155
  );
@@ -24352,7 +24500,7 @@ var ListTableRenderController = class {
24352
24500
  const layoutWidth = hostSize.width / zoom;
24353
24501
  const layoutAvailableHeight = availableHeight / zoom;
24354
24502
  const currentSnapshot = this.currentRenderSnapshot;
24355
- 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);
24503
+ 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);
24356
24504
  if (!measureSnapshot) {
24357
24505
  this.options.setFittedHeight(null);
24358
24506
  return;
@@ -24365,7 +24513,7 @@ var ListTableRenderController = class {
24365
24513
  topFrozenHeight: measureSnapshot.bodyLayout.topFrozenHeight,
24366
24514
  totalBodyHeight: Math.max(
24367
24515
  measureSnapshot.bodyLayout.totalBodyHeight,
24368
- measureSnapshot.displayRows.length === 0 ? measureSnapshot.rowHeight : 0
24516
+ measureSnapshot.displayRows.length === 0 ? Math.max(measureSnapshot.rowHeight, DEFAULT_EMPTY_BODY_HEIGHT) : 0
24369
24517
  ),
24370
24518
  bottomFrozenHeight: measureSnapshot.bodyLayout.bottomFrozenHeight,
24371
24519
  summaryHeight: measureSnapshot.bodyLayout.summaryHeight
@@ -25667,9 +25815,7 @@ function assembleListTableCoreControllers(core, options) {
25667
25815
  draggingScrollbar: core.draggingScrollbar != null,
25668
25816
  continuousScrollActive: core.eventController.isContinuousScrollActive(),
25669
25817
  hover: core.storeFacade.hover,
25670
- scrollbarActiveUntil: core.animationController.getScrollbarActiveUntil(),
25671
- now: Date.now()
25672
- });
25818
+ scrollbarActiveUntil: core.animationController.getScrollbarActiveUntil()});
25673
25819
  const applyRenderResult = (result) => {
25674
25820
  applyListTableRenderPassResult({
25675
25821
  didRender: result.didRender,
@@ -25975,6 +26121,7 @@ function assembleListTableCoreControllers(core, options) {
25975
26121
  }
25976
26122
  },
25977
26123
  isEditing: () => core.editingController.getSession() != null,
26124
+ resetSummaryValues: () => core.summaryController.reset(),
25978
26125
  requestRender: () => render()
25979
26126
  });
25980
26127
  core.contentActionController = new ListTableContentActionController({
@@ -26003,6 +26150,7 @@ function assembleListTableCoreControllers(core, options) {
26003
26150
  domHost: core.domHost,
26004
26151
  canvasHost: core.canvasHost,
26005
26152
  refreshRuntimeColumns,
26153
+ resetSummaryValues: () => core.summaryController.reset(),
26006
26154
  requestRender: () => render()
26007
26155
  });
26008
26156
  core.carouselController = new ListTableCarouselController({
@@ -26465,6 +26613,14 @@ var ListTableCore = class {
26465
26613
  resetFilter() {
26466
26614
  this.headerActionController.resetFilters();
26467
26615
  }
26616
+ /**
26617
+ * 设置内置表格密度。
26618
+ */
26619
+ changeDensity(density) {
26620
+ this.headerActionController.changeTableDensity(
26621
+ density === 32 ? "compact" : density === 56 ? "comfortable" : "middle"
26622
+ );
26623
+ }
26468
26624
  /**
26469
26625
  * 销毁实例。
26470
26626
  */
@@ -26587,6 +26743,12 @@ var ListTable = class {
26587
26743
  resetFilter() {
26588
26744
  this.core?.resetFilter();
26589
26745
  }
26746
+ /**
26747
+ * 设置并持久化内置表格密度。
26748
+ */
26749
+ changeDensity(density) {
26750
+ this.core?.changeDensity(density);
26751
+ }
26590
26752
  /**
26591
26753
  * 销毁实例。
26592
26754
  */