@canvas-components/list-table 0.2.4 → 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/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { stringifyDataIndex, getValueByDataIndex, clamp, copyTextSync, copyText, exportTableToXlsx, formatPreciseNumber, addPreciseNumbers, comparePreciseNumbers, dividePreciseNumber, roundPreciseNumber, parseNumberValue, formatNumberValue, formatPercentValue, formatScientificValue, formatChineseNumber, parseChineseNumber, normalizeDecimalPlaces, exportTableToTxt, exportTableToCsv, downloadJsonFile, mapRowsToExportRecords, copyJson, copyRows, isDateTimeFormatPattern, formatDateTimeValue, formatCustomNumberPattern, isSameDataIndex, isPointInRect as isPointInRect$1 } from '@canvas-components/utils';
1
+ import { stringifyDataIndex, getValueByDataIndex, clamp, copyTextSync, copyText, exportTableToXlsx, formatPreciseNumber, addPreciseNumbers, comparePreciseNumbers, dividePreciseNumber, roundPreciseNumber, parseNumberValue, formatNumberValue, formatPercentValue, formatScientificValue, formatChineseNumber, parseChineseNumber, exportTableToTxt, exportTableToCsv, downloadJsonFile, mapRowsToExportRecords, copyJson, copyRows, isDateTimeFormatPattern, normalizeDecimalPlaces, formatDateTimeValue, formatCustomNumberPattern, isSameDataIndex, isPointInRect as isPointInRect$1 } from '@canvas-components/utils';
2
2
  import { drawBarcodeToCanvas } from '@canvas-components/barcode';
3
3
  import { drawCanvasChartToCanvas, getCanvasChartRenderer, resolveCanvasChartTooltipText } from '@canvas-components/chart';
4
4
  import { drawQrCodeToCanvas } from '@canvas-components/qrcode';
@@ -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',
@@ -5872,6 +5923,9 @@ function drawBodyTextContent(params) {
5872
5923
  searchMatch,
5873
5924
  fragmentKey = `content:${contentIndex}`
5874
5925
  } = params;
5926
+ if (params.content.visible === false || params.content.style?.display === "none") {
5927
+ return void 0;
5928
+ }
5875
5929
  ctx.save();
5876
5930
  ctx.globalAlpha *= resolveContentOpacity(content);
5877
5931
  applyTextContentStyle(
@@ -5983,6 +6037,9 @@ function drawBodyTextContent(params) {
5983
6037
  return width;
5984
6038
  }
5985
6039
  function measureTextContentWidth(ctx, content, theme) {
6040
+ if (content.visible === false || content.style?.display === "none") {
6041
+ return 0;
6042
+ }
5986
6043
  applyTextContentStyle(ctx, content, theme.textColor, theme);
5987
6044
  const intrinsicWidth = Math.max(
5988
6045
  ctx.measureText(content.text).width + resolveContentTextIndent(content),
@@ -6173,6 +6230,11 @@ var CONTENT_HORIZONTAL_PADDING = 12;
6173
6230
  var CONTENT_GAP = 8;
6174
6231
  var CONTENT_VERTICAL_PADDING = 6;
6175
6232
  function resolveBodyCellContents(params) {
6233
+ return resolveRawBodyCellContents(params).filter(
6234
+ (content) => content.visible !== false && content.style?.display !== "none"
6235
+ );
6236
+ }
6237
+ function resolveRawBodyCellContents(params) {
6176
6238
  const { record, rowIndex, column } = params;
6177
6239
  const value = getValueByDataIndex(record, column.dataIndex);
6178
6240
  const rendered = column.render?.(value, record, rowIndex, column);
@@ -6317,7 +6379,9 @@ function normalizeCellContents(contents) {
6317
6379
  return [normalizeCellContentItem(contents)];
6318
6380
  }
6319
6381
  function normalizeDrawableCellContents(contents) {
6320
- return contents.map(normalizeCellContentItem);
6382
+ return contents.filter(
6383
+ (content) => content.visible !== false && content.style?.display !== "none"
6384
+ ).map(normalizeCellContentItem);
6321
6385
  }
6322
6386
  function normalizeCellContentItem(content) {
6323
6387
  if (content.type !== "money") {
@@ -6327,6 +6391,7 @@ function normalizeCellContentItem(content) {
6327
6391
  type: "text",
6328
6392
  text: formatMoneyValue(content.value, content),
6329
6393
  key: content.key,
6394
+ visible: content.visible,
6330
6395
  style: content.style,
6331
6396
  cursor: content.cursor,
6332
6397
  onClick: content.onClick,
@@ -7997,15 +8062,11 @@ function resolvePointerHitWithScrollbars(result, x, y, scrollbarLayout) {
7997
8062
  return result;
7998
8063
  }
7999
8064
  function resolveScrollbarVisibility(params) {
8000
- const { options, draggingScrollbar, continuousScrollActive, hover, scrollbarActiveUntil, now: now2 } = params;
8001
- const scrollbarOption = options.scrollbar;
8002
- if (scrollbarOption?.visible === true) {
8065
+ const scrollbarOption = params.options.scrollbar;
8066
+ if (scrollbarOption?.visible !== false) {
8003
8067
  return true;
8004
8068
  }
8005
- if (scrollbarOption?.visible === false) {
8006
- return false;
8007
- }
8008
- return draggingScrollbar || continuousScrollActive || hover.area === "horizontal-scrollbar" || hover.area === "vertical-scrollbar" || hover.area !== "empty" || now2 < scrollbarActiveUntil;
8069
+ return false;
8009
8070
  }
8010
8071
 
8011
8072
  // src/services/pointer-hit-service.ts
@@ -13621,13 +13682,13 @@ function showHeaderContextMenu(params) {
13621
13682
  return true;
13622
13683
  }
13623
13684
  function resolveContextMenuDensity(rowHeight) {
13624
- if (rowHeight === 48) {
13685
+ if (rowHeight === 56) {
13625
13686
  return "comfortable";
13626
13687
  }
13627
13688
  if (rowHeight === 32) {
13628
13689
  return "compact";
13629
13690
  }
13630
- return "middle";
13691
+ return rowHeight === 48 ? "middle" : "compact";
13631
13692
  }
13632
13693
 
13633
13694
  // src/features/tooltip/tooltip-feature.ts
@@ -15197,7 +15258,7 @@ var ListTableEventController = class {
15197
15258
  headerTree: this.host.headerTree,
15198
15259
  headerRowsCache: this.host.headerRowsCache,
15199
15260
  pointerX: position.x,
15200
- headerRowHeight: DEFAULT_HEADER_ROW_HEIGHT,
15261
+ headerRowHeight: this.host.currentRenderSnapshot?.headerRowHeight ?? DEFAULT_HEADER_ROW_HEIGHT,
15201
15262
  allowGrouping: this.host.groupBarVisible,
15202
15263
  getMovableLeafColumns: (node, hitRect) => getHeaderNodeMovableLeafColumns({
15203
15264
  node,
@@ -15534,7 +15595,7 @@ var ListTableEventController = class {
15534
15595
  },
15535
15596
  summaryVisible: Boolean(this.host.currentRenderSnapshot?.hasSummary),
15536
15597
  onToggleSummary: () => {
15537
- 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;
15538
15599
  this.host.persistColumnConfig();
15539
15600
  this.host.render();
15540
15601
  },
@@ -17399,9 +17460,9 @@ function resolveToggleHeaderColumnVisibilityAction(params) {
17399
17460
  function resolveDensitySizes(density) {
17400
17461
  if (density === "comfortable") {
17401
17462
  return {
17402
- rowHeight: 48,
17403
- headerRowHeight: 48,
17404
- summaryRowHeight: 48
17463
+ rowHeight: 56,
17464
+ headerRowHeight: 56,
17465
+ summaryRowHeight: 56
17405
17466
  };
17406
17467
  }
17407
17468
  if (density === "compact") {
@@ -17412,9 +17473,9 @@ function resolveDensitySizes(density) {
17412
17473
  };
17413
17474
  }
17414
17475
  return {
17415
- rowHeight: 40,
17416
- headerRowHeight: 40,
17417
- summaryRowHeight: 40
17476
+ rowHeight: 48,
17477
+ headerRowHeight: 48,
17478
+ summaryRowHeight: 48
17418
17479
  };
17419
17480
  }
17420
17481
 
@@ -17565,6 +17626,9 @@ var ListTableHeaderActionController = class {
17565
17626
  headerRowHeight: nextSize.headerRowHeight,
17566
17627
  summaryRowHeight: nextSize.summaryRowHeight
17567
17628
  });
17629
+ this.options.resetSummaryValues();
17630
+ options.ui?.onDensityChange?.(nextSize.rowHeight);
17631
+ this.options.persistColumnConfig();
17568
17632
  this.options.hideHeaderContextMenu();
17569
17633
  this.options.requestRender();
17570
17634
  }
@@ -18034,7 +18098,7 @@ function applyStoredColumnConfig(columns, storedColumns) {
18034
18098
  };
18035
18099
  applyToColumns(columns);
18036
18100
  }
18037
- function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryRowHeight) {
18101
+ function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryRowHeight, density) {
18038
18102
  const result = {};
18039
18103
  const collectColumns = (cols) => {
18040
18104
  for (const col of cols) {
@@ -18069,7 +18133,8 @@ function buildStoredColumnConfig(columns, sortState, filterState, zoom, summaryR
18069
18133
  },
18070
18134
  filters: filterState,
18071
18135
  ...typeof zoom === "number" && Number.isFinite(zoom) && zoom > 0 ? { zoom } : null,
18072
- ...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
18073
18138
  };
18074
18139
  }
18075
18140
 
@@ -18081,7 +18146,8 @@ function persistListTableColumnConfig(params) {
18081
18146
  sortState,
18082
18147
  filterState,
18083
18148
  zoom,
18084
- summaryRowHeight
18149
+ summaryRowHeight,
18150
+ density
18085
18151
  } = params;
18086
18152
  if (!storageKey) {
18087
18153
  return;
@@ -18094,7 +18160,8 @@ function persistListTableColumnConfig(params) {
18094
18160
  sortState,
18095
18161
  filterState,
18096
18162
  zoom,
18097
- summaryRowHeight
18163
+ summaryRowHeight,
18164
+ density
18098
18165
  )
18099
18166
  );
18100
18167
  }
@@ -18116,7 +18183,8 @@ async function loadListTableStoredConfig(params) {
18116
18183
  } : null,
18117
18184
  filterState: stored.filters ? stored.filters : null,
18118
18185
  zoom: typeof stored.zoom === "number" && Number.isFinite(stored.zoom) && stored.zoom > 0 ? stored.zoom : null,
18119
- 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
18120
18188
  };
18121
18189
  }
18122
18190
 
@@ -18147,13 +18215,26 @@ var ListTablePersistenceController = class {
18147
18215
  this.options.domHost.setContentZoom(nextZoom);
18148
18216
  this.options.canvasHost.setContentZoom(nextZoom);
18149
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
+ }
18150
18227
  if (stored.summaryRowHeight != null) {
18151
- const currentOptions = this.options.getOptions();
18152
- if (currentOptions.summaryRowHeight !== stored.summaryRowHeight) {
18153
- this.options.setOptions({
18154
- ...currentOptions,
18155
- summaryRowHeight: stored.summaryRowHeight
18156
- });
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);
18157
18238
  }
18158
18239
  }
18159
18240
  this.options.refreshRuntimeColumns();
@@ -18167,7 +18248,8 @@ var ListTablePersistenceController = class {
18167
18248
  sortState: this.options.getSortState(),
18168
18249
  filterState: this.options.getFilterState(),
18169
18250
  zoom: this.options.getTableZoom(),
18170
- summaryRowHeight: tableOptions.summaryRowHeight
18251
+ summaryRowHeight: tableOptions.summaryRowHeight,
18252
+ density: tableOptions.rowHeight
18171
18253
  });
18172
18254
  }
18173
18255
  };
@@ -18527,7 +18609,7 @@ function computeScrollbarLayout(params) {
18527
18609
  };
18528
18610
  }
18529
18611
  const verticalTrackHeight = Math.max(
18530
- params.bodyHeight - verticalTop - verticalBottom - (params.maxScrollLeft > 0 ? thickness : 0),
18612
+ params.bodyHeight - verticalTop - verticalBottom,
18531
18613
  0
18532
18614
  );
18533
18615
  const verticalTrackX = params.width - thickness - verticalRight;
@@ -19981,7 +20063,6 @@ function resolveExpandedRowHeight2(height, record, index) {
19981
20063
 
19982
20064
  // src/services/layout-service.ts
19983
20065
  var AUTO_ROW_HEIGHT_SAMPLE_COUNT = 200;
19984
- var LIST_TABLE_GROUPING_BAR_HEIGHT = 44;
19985
20066
  function buildListTableRenderSnapshot(params) {
19986
20067
  if (params.cache?.snapshot && params.cache.snapshot.groupIndex === params.cache.groupIndex && isSameRenderCacheInputs(params.cache.inputs, params)) {
19987
20068
  const snapshotStartedAt2 = resolvePerformanceNow2();
@@ -20008,8 +20089,8 @@ function buildListTableRenderSnapshot(params) {
20008
20089
  const {
20009
20090
  options,
20010
20091
  theme,
20011
- width,
20012
- height,
20092
+ width: hostWidth,
20093
+ height: hostHeight,
20013
20094
  scroll,
20014
20095
  selectedRowKeys,
20015
20096
  query,
@@ -20020,6 +20101,9 @@ function buildListTableRenderSnapshot(params) {
20020
20101
  baseRowsOverride,
20021
20102
  displayRowsOverride
20022
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;
20023
20107
  const sourceNormalizedColumns = normalizeColumns(
20024
20108
  getResolvedColumns(options, selectedRowKeys)
20025
20109
  );
@@ -20058,15 +20142,15 @@ function buildListTableRenderSnapshot(params) {
20058
20142
  const expandableState = resolveExpandableState({
20059
20143
  expandable: options.expandable
20060
20144
  });
20061
- const rowHeight = options.rowHeight == null || options.rowHeight === "auto" ? resolveAutoRowHeight({
20145
+ const rowHeight = options.rowHeight === "auto" ? resolveAutoRowHeight({
20062
20146
  rows: queryRows.displayRows,
20063
20147
  leafColumns,
20064
20148
  theme,
20065
20149
  cache: params.cache
20066
20150
  }) : options.rowHeight ?? DEFAULT_ROW_HEIGHT;
20067
- const headerRowHeight = options.headerRowHeight ?? DEFAULT_HEADER_ROW_HEIGHT;
20068
- const summaryRowHeight = options.summaryRowHeight ?? DEFAULT_SUMMARY_ROW_HEIGHT;
20069
- const groupingBarHeight = params.groupBarVisible ? LIST_TABLE_GROUPING_BAR_HEIGHT : 0;
20151
+ const headerRowHeight = options.headerRowHeight ?? rowHeight;
20152
+ const summaryRowHeight = options.summaryRowHeight ?? rowHeight;
20153
+ const groupingBarHeight = params.groupBarVisible ? rowHeight : 0;
20070
20154
  const columnHeaderHeight = (headerInfo.maxDepth + 1) * headerRowHeight;
20071
20155
  const headerHeight = groupingBarHeight + columnHeaderHeight;
20072
20156
  const hasConfiguredSummary = leafColumns.some(
@@ -20272,11 +20356,11 @@ function buildListTableRenderSnapshot(params) {
20272
20356
  scrollRowCount: plainRowWindow.totalRowCount
20273
20357
  });
20274
20358
  }
20275
- const columnMetrics = resolveColumnMetrics({
20359
+ let columnMetrics = resolveColumnMetrics({
20276
20360
  columns: leafColumns,
20277
20361
  tableWidth: width
20278
20362
  });
20279
- const viewportResult = computeViewport({
20363
+ let viewportResult = computeViewport({
20280
20364
  width,
20281
20365
  height,
20282
20366
  headerHeight,
@@ -20287,6 +20371,59 @@ function buildListTableRenderSnapshot(params) {
20287
20371
  fixedWidthRight: columnMetrics.fixedWidthRight,
20288
20372
  scroll
20289
20373
  });
20374
+ for (let index = 0; index < 2 && scrollbarThickness > 0; index += 1) {
20375
+ const nextWidth = Math.max(
20376
+ hostWidth - (viewportResult.viewport.maxScrollTop > 0 ? scrollbarThickness : 0),
20377
+ 0
20378
+ );
20379
+ const nextHeight = Math.max(
20380
+ hostHeight - (viewportResult.viewport.maxScrollLeft > 0 ? scrollbarThickness : 0),
20381
+ 0
20382
+ );
20383
+ if (nextWidth === width && nextHeight === height) {
20384
+ break;
20385
+ }
20386
+ width = nextWidth;
20387
+ height = nextHeight;
20388
+ bodyState = resolveCurrentBodyState();
20389
+ if (plainRowWindow) {
20390
+ bodyState.frozenRows.scroll.windowed = true;
20391
+ bodyState.frozenRows.scroll.rowIndexMap = plainRowWindow.rowIndexMap;
20392
+ bodyState.frozenRows.scroll.rowOffsetMap = plainRowWindow.rowOffsetMap;
20393
+ bodyState.bodyLayout = resolveBodyLayout({
20394
+ height,
20395
+ headerHeight,
20396
+ summaryRowHeight,
20397
+ hasSummary,
20398
+ rowHeight,
20399
+ totalBodyHeight: plainRowWindow.totalBodyHeight,
20400
+ topFrozenRowCount: 0,
20401
+ bottomFrozenRowCount: 0,
20402
+ scrollRowCount: plainRowWindow.totalRowCount
20403
+ });
20404
+ }
20405
+ columnMetrics = resolveColumnMetrics({
20406
+ columns: leafColumns,
20407
+ tableWidth: width
20408
+ });
20409
+ viewportResult = computeViewport({
20410
+ width,
20411
+ height,
20412
+ headerHeight,
20413
+ bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20414
+ totalWidth: columnMetrics.totalWidth,
20415
+ totalBodyHeight: bodyState.bodyLayout.totalBodyHeight,
20416
+ fixedWidthLeft: columnMetrics.fixedWidthLeft,
20417
+ fixedWidthRight: columnMetrics.fixedWidthRight,
20418
+ scroll
20419
+ });
20420
+ }
20421
+ scrollPageSize = resolveScrollPageSize({
20422
+ options,
20423
+ pageSize: query.pagination.pageSize,
20424
+ bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20425
+ rowHeight
20426
+ });
20290
20427
  const nextScroll = viewportResult.scroll;
20291
20428
  const columnSegments = resolveColumnSegments({
20292
20429
  metrics: columnMetrics,
@@ -20294,8 +20431,8 @@ function buildListTableRenderSnapshot(params) {
20294
20431
  swapAnimation
20295
20432
  });
20296
20433
  const scrollbarLayout = computeScrollbarLayout({
20297
- width,
20298
- height,
20434
+ width: hostWidth,
20435
+ height: hostHeight,
20299
20436
  bodyTop: bodyState.bodyLayout.scrollBodyTop,
20300
20437
  bodyHeight: bodyState.bodyLayout.scrollBodyHeight,
20301
20438
  centerVisibleWidth: columnMetrics.availableCenterWidth,
@@ -20493,8 +20630,8 @@ function resolveUngroupedDataRowCount(visibleRows) {
20493
20630
  function updateListTableRenderSnapshotScroll(params) {
20494
20631
  const { snapshot, width, height, scroll, options } = params;
20495
20632
  const viewportResult = computeViewport({
20496
- width,
20497
- height,
20633
+ width: snapshot.width,
20634
+ height: snapshot.height,
20498
20635
  headerHeight: snapshot.bodyLayout.scrollBodyTop - snapshot.bodyLayout.topFrozenHeight,
20499
20636
  bodyHeight: snapshot.bodyLayout.scrollBodyHeight,
20500
20637
  totalWidth: snapshot.columnMetrics.totalWidth,
@@ -20930,7 +21067,7 @@ function resolveListTableRenderHostSize(params) {
20930
21067
  }
20931
21068
 
20932
21069
  // src/rendering/primitives/draw-scrollbars.ts
20933
- function drawScrollbars(ctx, layout, descriptors, opacity = 1, interactive = true) {
21070
+ function drawScrollbars(ctx, layout, descriptors, borderColor, opacity = 1, interactive = true) {
20934
21071
  const alpha = Number.isFinite(opacity) ? Math.min(Math.max(opacity, 0), 1) : 1;
20935
21072
  if (alpha <= 1e-3) {
20936
21073
  return;
@@ -20938,14 +21075,28 @@ function drawScrollbars(ctx, layout, descriptors, opacity = 1, interactive = tru
20938
21075
  ctx.save();
20939
21076
  ctx.globalAlpha = alpha;
20940
21077
  if (layout.horizontal) {
20941
- drawAxisScrollbar(ctx, layout.horizontal, "horizontal", descriptors, interactive);
21078
+ drawAxisScrollbar(
21079
+ ctx,
21080
+ layout.horizontal,
21081
+ "horizontal",
21082
+ descriptors,
21083
+ borderColor,
21084
+ interactive
21085
+ );
20942
21086
  }
20943
21087
  if (layout.vertical) {
20944
- drawAxisScrollbar(ctx, layout.vertical, "vertical", descriptors, interactive);
21088
+ drawAxisScrollbar(
21089
+ ctx,
21090
+ layout.vertical,
21091
+ "vertical",
21092
+ descriptors,
21093
+ borderColor,
21094
+ interactive
21095
+ );
20945
21096
  }
20946
21097
  ctx.restore();
20947
21098
  }
20948
- function drawAxisScrollbar(ctx, layout, axis, descriptors, interactive) {
21099
+ function drawAxisScrollbar(ctx, layout, axis, descriptors, borderColor, interactive) {
20949
21100
  const kind = axis === "horizontal" ? "horizontal-scrollbar" : "vertical-scrollbar";
20950
21101
  if (interactive) {
20951
21102
  descriptors.push({
@@ -20973,16 +21124,19 @@ function drawAxisScrollbar(ctx, layout, axis, descriptors, interactive) {
20973
21124
  scrollbarRole: "increase-button"
20974
21125
  });
20975
21126
  }
20976
- drawTrack(ctx, layout.track);
21127
+ drawTrack(ctx, layout.track, borderColor);
20977
21128
  drawButton(ctx, layout.decreaseButton, axis, "decrease");
20978
21129
  drawButton(ctx, layout.increaseButton, axis, "increase");
20979
21130
  drawThumb(ctx, layout.thumb);
20980
21131
  }
20981
- function drawTrack(ctx, rect) {
21132
+ function drawTrack(ctx, rect, borderColor) {
20982
21133
  ctx.save();
20983
21134
  ctx.fillStyle = "rgba(148, 163, 184, 0.16)";
21135
+ ctx.strokeStyle = borderColor;
21136
+ ctx.lineWidth = 1;
20984
21137
  roundRect(ctx, rect.x, rect.y, rect.width, rect.height, rect.height / 2);
20985
21138
  ctx.fill();
21139
+ ctx.stroke();
20986
21140
  ctx.restore();
20987
21141
  }
20988
21142
  function drawThumb(ctx, rect) {
@@ -23821,7 +23975,7 @@ function executeListTableRenderPipeline(params) {
23821
23975
  renderer.drawEmpty(
23822
23976
  width,
23823
23977
  bodyAreaHeight,
23824
- options.emptyText ?? "\u5F53\u524D\u6CA1\u6709\u53EF\u5C55\u793A\u7684\u6570\u636E\u3002",
23978
+ options.emptyText ?? "\u6682\u65E0\u6570\u636E",
23825
23979
  headerHeight
23826
23980
  );
23827
23981
  } else {
@@ -23988,6 +24142,7 @@ function executeListTableRenderPipeline(params) {
23988
24142
  ctx,
23989
24143
  snapshot.scrollbarLayout,
23990
24144
  descriptors,
24145
+ theme.borderColor,
23991
24146
  scrollbarOpacity,
23992
24147
  isScrollbarInteractive
23993
24148
  );
@@ -24338,7 +24493,7 @@ var ListTableRenderController = class {
24338
24493
  const layoutWidth = hostSize.width / zoom;
24339
24494
  const layoutAvailableHeight = availableHeight / zoom;
24340
24495
  const currentSnapshot = this.currentRenderSnapshot;
24341
- 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);
24496
+ 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);
24342
24497
  if (!measureSnapshot) {
24343
24498
  this.options.setFittedHeight(null);
24344
24499
  return;
@@ -24351,7 +24506,7 @@ var ListTableRenderController = class {
24351
24506
  topFrozenHeight: measureSnapshot.bodyLayout.topFrozenHeight,
24352
24507
  totalBodyHeight: Math.max(
24353
24508
  measureSnapshot.bodyLayout.totalBodyHeight,
24354
- measureSnapshot.displayRows.length === 0 ? measureSnapshot.rowHeight : 0
24509
+ measureSnapshot.displayRows.length === 0 ? Math.max(measureSnapshot.rowHeight, DEFAULT_EMPTY_BODY_HEIGHT) : 0
24355
24510
  ),
24356
24511
  bottomFrozenHeight: measureSnapshot.bodyLayout.bottomFrozenHeight,
24357
24512
  summaryHeight: measureSnapshot.bodyLayout.summaryHeight
@@ -25653,9 +25808,7 @@ function assembleListTableCoreControllers(core, options) {
25653
25808
  draggingScrollbar: core.draggingScrollbar != null,
25654
25809
  continuousScrollActive: core.eventController.isContinuousScrollActive(),
25655
25810
  hover: core.storeFacade.hover,
25656
- scrollbarActiveUntil: core.animationController.getScrollbarActiveUntil(),
25657
- now: Date.now()
25658
- });
25811
+ scrollbarActiveUntil: core.animationController.getScrollbarActiveUntil()});
25659
25812
  const applyRenderResult = (result) => {
25660
25813
  applyListTableRenderPassResult({
25661
25814
  didRender: result.didRender,
@@ -25961,6 +26114,7 @@ function assembleListTableCoreControllers(core, options) {
25961
26114
  }
25962
26115
  },
25963
26116
  isEditing: () => core.editingController.getSession() != null,
26117
+ resetSummaryValues: () => core.summaryController.reset(),
25964
26118
  requestRender: () => render()
25965
26119
  });
25966
26120
  core.contentActionController = new ListTableContentActionController({
@@ -25989,6 +26143,7 @@ function assembleListTableCoreControllers(core, options) {
25989
26143
  domHost: core.domHost,
25990
26144
  canvasHost: core.canvasHost,
25991
26145
  refreshRuntimeColumns,
26146
+ resetSummaryValues: () => core.summaryController.reset(),
25992
26147
  requestRender: () => render()
25993
26148
  });
25994
26149
  core.carouselController = new ListTableCarouselController({
@@ -26451,6 +26606,14 @@ var ListTableCore = class {
26451
26606
  resetFilter() {
26452
26607
  this.headerActionController.resetFilters();
26453
26608
  }
26609
+ /**
26610
+ * 设置内置表格密度。
26611
+ */
26612
+ changeDensity(density) {
26613
+ this.headerActionController.changeTableDensity(
26614
+ density === 32 ? "compact" : density === 56 ? "comfortable" : "middle"
26615
+ );
26616
+ }
26454
26617
  /**
26455
26618
  * 销毁实例。
26456
26619
  */
@@ -26573,6 +26736,12 @@ var ListTable = class {
26573
26736
  resetFilter() {
26574
26737
  this.core?.resetFilter();
26575
26738
  }
26739
+ /**
26740
+ * 设置并持久化内置表格密度。
26741
+ */
26742
+ changeDensity(density) {
26743
+ this.core?.changeDensity(density);
26744
+ }
26576
26745
  /**
26577
26746
  * 销毁实例。
26578
26747
  */