@xcelsior/ui-spreadsheets 1.1.18 → 1.2.0
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/.turbo/turbo-build.log +14 -14
- package/.turbo/turbo-lint.log +1 -185
- package/dist/index.js +32 -5
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +32 -5
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
- package/src/components/RowIndexColumnHeader.tsx +26 -4
- package/src/components/Spreadsheet.tsx +10 -5
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xcelsior/ui-spreadsheets",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"dependencies": {
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"tsup": "^8.5.0",
|
|
24
24
|
"typescript": "^5.8.3",
|
|
25
25
|
"@tailwindcss/postcss": "^4.1.13",
|
|
26
|
-
"@xcelsior/design-system": "1.0.
|
|
26
|
+
"@xcelsior/design-system": "1.0.10"
|
|
27
27
|
},
|
|
28
28
|
"peerDependencies": {
|
|
29
29
|
"tailwindcss": "^4",
|
|
@@ -16,8 +16,8 @@ export interface RowIndexColumnHeaderProps {
|
|
|
16
16
|
onHighlightClick?: () => void;
|
|
17
17
|
/** Callback when pin button is clicked */
|
|
18
18
|
onPinClick?: () => void;
|
|
19
|
-
/** Whether this is in the
|
|
20
|
-
|
|
19
|
+
/** Whether this is the empty placeholder cell in the second header row (column headers row) */
|
|
20
|
+
isSecondRow?: boolean;
|
|
21
21
|
/** Whether compact mode is enabled */
|
|
22
22
|
compactMode?: boolean;
|
|
23
23
|
/** Additional className */
|
|
@@ -34,12 +34,35 @@ export function RowIndexColumnHeader({
|
|
|
34
34
|
isPinned = false,
|
|
35
35
|
onHighlightClick,
|
|
36
36
|
onPinClick,
|
|
37
|
-
|
|
37
|
+
isSecondRow = false,
|
|
38
38
|
compactMode = false,
|
|
39
39
|
className,
|
|
40
40
|
}: RowIndexColumnHeaderProps) {
|
|
41
41
|
const cellPadding = compactMode ? cellPaddingCompact : cellPaddingNormal;
|
|
42
42
|
|
|
43
|
+
// Second row is an empty placeholder cell - no content, just maintains alignment
|
|
44
|
+
if (isSecondRow) {
|
|
45
|
+
return (
|
|
46
|
+
<th
|
|
47
|
+
className={cn(
|
|
48
|
+
'border border-gray-200 text-center font-bold text-gray-700',
|
|
49
|
+
compactMode ? 'text-[10px]' : 'text-xs',
|
|
50
|
+
cellPadding,
|
|
51
|
+
isPinned ? 'z-30' : 'z-20',
|
|
52
|
+
className
|
|
53
|
+
)}
|
|
54
|
+
style={{
|
|
55
|
+
minWidth: `${ROW_INDEX_COLUMN_WIDTH}px`,
|
|
56
|
+
width: `${ROW_INDEX_COLUMN_WIDTH}px`,
|
|
57
|
+
position: 'sticky',
|
|
58
|
+
top: 0,
|
|
59
|
+
left: isPinned ? 0 : undefined,
|
|
60
|
+
backgroundColor: highlightColor || 'rgb(243 244 246)',
|
|
61
|
+
}}
|
|
62
|
+
/>
|
|
63
|
+
);
|
|
64
|
+
}
|
|
65
|
+
|
|
43
66
|
return (
|
|
44
67
|
<th
|
|
45
68
|
className={cn(
|
|
@@ -49,7 +72,6 @@ export function RowIndexColumnHeader({
|
|
|
49
72
|
isPinned ? 'z-30' : 'z-20',
|
|
50
73
|
className
|
|
51
74
|
)}
|
|
52
|
-
rowSpan={hasColumnGroups ? 2 : undefined}
|
|
53
75
|
style={{
|
|
54
76
|
minWidth: `${ROW_INDEX_COLUMN_WIDTH}px`,
|
|
55
77
|
width: `${ROW_INDEX_COLUMN_WIDTH}px`,
|
|
@@ -896,14 +896,13 @@ export function Spreadsheet<T extends Record<string, any>>({
|
|
|
896
896
|
{/* Column Group Headers */}
|
|
897
897
|
{columnGroups && groupHeaderItems && (
|
|
898
898
|
<tr>
|
|
899
|
-
{/* Row index column header
|
|
899
|
+
{/* Row index column header */}
|
|
900
900
|
<RowIndexColumnHeader
|
|
901
901
|
enableHighlighting={enableHighlighting}
|
|
902
902
|
highlightColor={rowIndexHighlightColor}
|
|
903
903
|
isPinned={isRowIndexPinned}
|
|
904
904
|
onHighlightClick={handleRowIndexHighlightClick}
|
|
905
905
|
onPinClick={() => handleTogglePin(ROW_INDEX_COLUMN_ID)}
|
|
906
|
-
hasColumnGroups={true}
|
|
907
906
|
compactMode={effectiveCompactMode}
|
|
908
907
|
/>
|
|
909
908
|
{groupHeaderItems.map((item) => {
|
|
@@ -974,15 +973,21 @@ export function Spreadsheet<T extends Record<string, any>>({
|
|
|
974
973
|
|
|
975
974
|
{/* Column Headers */}
|
|
976
975
|
<tr>
|
|
977
|
-
{/* Row index column header
|
|
978
|
-
{
|
|
976
|
+
{/* Row index column header - show full header when no groups, empty placeholder when groups exist */}
|
|
977
|
+
{columnGroups ? (
|
|
978
|
+
<RowIndexColumnHeader
|
|
979
|
+
highlightColor={rowIndexHighlightColor}
|
|
980
|
+
isPinned={isRowIndexPinned}
|
|
981
|
+
isSecondRow={true}
|
|
982
|
+
compactMode={effectiveCompactMode}
|
|
983
|
+
/>
|
|
984
|
+
) : (
|
|
979
985
|
<RowIndexColumnHeader
|
|
980
986
|
enableHighlighting={enableHighlighting}
|
|
981
987
|
highlightColor={rowIndexHighlightColor}
|
|
982
988
|
isPinned={isRowIndexPinned}
|
|
983
989
|
onHighlightClick={handleRowIndexHighlightClick}
|
|
984
990
|
onPinClick={() => handleTogglePin(ROW_INDEX_COLUMN_ID)}
|
|
985
|
-
hasColumnGroups={false}
|
|
986
991
|
compactMode={effectiveCompactMode}
|
|
987
992
|
/>
|
|
988
993
|
)}
|