@lensui/lens-table 0.1.48 → 0.1.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.cjs +13 -2
  2. package/dist/index.css +1 -1
  3. package/dist/index.js +13 -2
  4. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -1167,7 +1167,7 @@ function paintGrid(options) {
1167
1167
  ctx.beginPath();
1168
1168
  ctx.rect(x + 2, y + 1, Math.max(0, cellWidth - 4), cellHeight - 2);
1169
1169
  ctx.clip();
1170
- ctx.fillStyle = isColumnDropTarget ? colors.text : isAxisSelected && !isSelectedCell && !isRangeCell ? colors.axisSelectionText : cellStyle?.color ?? rowStyle?.color ?? colors.text;
1170
+ ctx.fillStyle = isAxisSelected ? colors.axisSelectionText : isColumnDropTarget ? colors.text : cellStyle?.color ?? rowStyle?.color ?? colors.text;
1171
1171
  ctx.font = createCellFont(bodyFontSize);
1172
1172
  ctx.textBaseline = "alphabetic";
1173
1173
  ctx.textAlign = column.align === "right" ? "right" : column.align === "center" ? "center" : "left";
@@ -2353,7 +2353,7 @@ function TableInner({
2353
2353
  // regular and drag fills intentionally differ, but odd rows should
2354
2354
  // continue to use the dedicated stripe color in both states.
2355
2355
  axisSelectionStripeFill: readThemeColor(themeStyles, "--rvg-color-axis-selection-stripe-fill", "#dfeeff"),
2356
- axisSelectionText: isSelectedColumnDrag || isSelectedColumnDropTarget ? readThemeColor(themeStyles, "--rvg-color-axis-selection-drag-text", "#325b88") : readThemeColor(themeStyles, "--rvg-color-axis-selection-text", readThemeColor(themeStyles, "--rvg-color-text", "#202124")),
2356
+ axisSelectionText: isSelectedColumnDrag || isSelectedColumnDropTarget ? readThemeColor(themeStyles, "--rvg-color-axis-selection-drag-text", "#fff") : readThemeColor(themeStyles, "--rvg-color-axis-selection-text", readThemeColor(themeStyles, "--rvg-color-text", "#202124")),
2357
2357
  rowHoverFill: readThemeColor(themeStyles, "--rvg-color-row-hover-fill", "#f6f9fc"),
2358
2358
  editedFill: editedCellHighlightColor ?? readThemeColor(themeStyles, "--rvg-color-edited-fill", "#fff1b8"),
2359
2359
  insertedFill: insertedRowHighlightColor ?? readThemeColor(themeStyles, "--rvg-color-inserted-fill", "#c8ead4"),
@@ -3961,6 +3961,17 @@ function TableInner({
3961
3961
  }, [viewport.width]);
3962
3962
  const headerTooltip = (() => {
3963
3963
  if (!visibleHeaderTooltip) return null;
3964
+ if (visibleHeaderTooltip.action === "sort" || visibleHeaderTooltip.action === "filter") {
3965
+ const column = columns[visibleHeaderTooltip.columnIndex];
3966
+ if (column) {
3967
+ const label = visibleHeaderTooltip.action === "sort" ? sortState?.columnKey === column.key ? sortState.direction === "asc" ? labels.sortAsc : labels.sortDesc : labels.sortBoth : filterValues[column.key] ? labels.filterWithValue(filterValues[column.key]) : labels.filter;
3968
+ return {
3969
+ ...visibleHeaderTooltip,
3970
+ key: `${visibleHeaderTooltip.key}:${label}`,
3971
+ label
3972
+ };
3973
+ }
3974
+ }
3964
3975
  return visibleHeaderTooltip;
3965
3976
  })();
3966
3977
  const getRangeBounds = () => selectionRange ? {
package/dist/index.css CHANGED
@@ -19,7 +19,7 @@
19
19
  --rvg-color-axis-selection-stripe-fill: #dfeeff;
20
20
  --rvg-color-axis-selection-text: var(--rvg-color-text);
21
21
  --rvg-color-axis-selection-drag-fill: #d8e8f8;
22
- --rvg-color-axis-selection-drag-text: #325b88;
22
+ --rvg-color-axis-selection-drag-text: #fff;
23
23
  --rvg-color-column-drop-target-fill: #e2edf9;
24
24
  --rvg-color-range-fill: #e8f1ff;
25
25
  --rvg-color-row-hover-fill: #f6f9fc;
package/dist/index.js CHANGED
@@ -1137,7 +1137,7 @@ function paintGrid(options) {
1137
1137
  ctx.beginPath();
1138
1138
  ctx.rect(x + 2, y + 1, Math.max(0, cellWidth - 4), cellHeight - 2);
1139
1139
  ctx.clip();
1140
- ctx.fillStyle = isColumnDropTarget ? colors.text : isAxisSelected && !isSelectedCell && !isRangeCell ? colors.axisSelectionText : cellStyle?.color ?? rowStyle?.color ?? colors.text;
1140
+ ctx.fillStyle = isAxisSelected ? colors.axisSelectionText : isColumnDropTarget ? colors.text : cellStyle?.color ?? rowStyle?.color ?? colors.text;
1141
1141
  ctx.font = createCellFont(bodyFontSize);
1142
1142
  ctx.textBaseline = "alphabetic";
1143
1143
  ctx.textAlign = column.align === "right" ? "right" : column.align === "center" ? "center" : "left";
@@ -2323,7 +2323,7 @@ function TableInner({
2323
2323
  // regular and drag fills intentionally differ, but odd rows should
2324
2324
  // continue to use the dedicated stripe color in both states.
2325
2325
  axisSelectionStripeFill: readThemeColor(themeStyles, "--rvg-color-axis-selection-stripe-fill", "#dfeeff"),
2326
- axisSelectionText: isSelectedColumnDrag || isSelectedColumnDropTarget ? readThemeColor(themeStyles, "--rvg-color-axis-selection-drag-text", "#325b88") : readThemeColor(themeStyles, "--rvg-color-axis-selection-text", readThemeColor(themeStyles, "--rvg-color-text", "#202124")),
2326
+ axisSelectionText: isSelectedColumnDrag || isSelectedColumnDropTarget ? readThemeColor(themeStyles, "--rvg-color-axis-selection-drag-text", "#fff") : readThemeColor(themeStyles, "--rvg-color-axis-selection-text", readThemeColor(themeStyles, "--rvg-color-text", "#202124")),
2327
2327
  rowHoverFill: readThemeColor(themeStyles, "--rvg-color-row-hover-fill", "#f6f9fc"),
2328
2328
  editedFill: editedCellHighlightColor ?? readThemeColor(themeStyles, "--rvg-color-edited-fill", "#fff1b8"),
2329
2329
  insertedFill: insertedRowHighlightColor ?? readThemeColor(themeStyles, "--rvg-color-inserted-fill", "#c8ead4"),
@@ -3931,6 +3931,17 @@ function TableInner({
3931
3931
  }, [viewport.width]);
3932
3932
  const headerTooltip = (() => {
3933
3933
  if (!visibleHeaderTooltip) return null;
3934
+ if (visibleHeaderTooltip.action === "sort" || visibleHeaderTooltip.action === "filter") {
3935
+ const column = columns[visibleHeaderTooltip.columnIndex];
3936
+ if (column) {
3937
+ const label = visibleHeaderTooltip.action === "sort" ? sortState?.columnKey === column.key ? sortState.direction === "asc" ? labels.sortAsc : labels.sortDesc : labels.sortBoth : filterValues[column.key] ? labels.filterWithValue(filterValues[column.key]) : labels.filter;
3938
+ return {
3939
+ ...visibleHeaderTooltip,
3940
+ key: `${visibleHeaderTooltip.key}:${label}`,
3941
+ label
3942
+ };
3943
+ }
3944
+ }
3934
3945
  return visibleHeaderTooltip;
3935
3946
  })();
3936
3947
  const getRangeBounds = () => selectionRange ? {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lensui/lens-table",
3
- "version": "0.1.48",
3
+ "version": "0.1.50",
4
4
  "description": "A lightweight, canvas-rendered React table component for LensUI.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",