@xcelsior/ui-spreadsheets 1.1.4 → 1.1.5
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 +18 -18
- package/CHANGELOG.md +8 -0
- package/dist/index.d.mts +51 -6
- package/dist/index.d.ts +51 -6
- package/dist/index.js +221 -193
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +120 -93
- package/dist/index.mjs.map +1 -1
- package/dist/styles/globals.css +6 -7
- package/dist/styles/globals.css.map +1 -1
- package/package.json +4 -4
- package/src/components/RowContextMenu.tsx +82 -0
- package/src/components/Spreadsheet.stories.tsx +80 -33
- package/src/components/Spreadsheet.tsx +20 -53
- package/src/hooks/useSpreadsheetHighlighting.ts +6 -2
- package/src/index.ts +2 -0
- package/src/types.ts +29 -4
- package/.turbo/turbo-lint.log +0 -196
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
|
|
2
|
-
> @xcelsior/ui-spreadsheets@1.
|
|
2
|
+
> @xcelsior/ui-spreadsheets@1.1.5 build /home/circleci/repo/packages/ui/ui-spreadsheets
|
|
3
3
|
> tsup && tsc --noEmit
|
|
4
4
|
|
|
5
5
|
[34mCLI[39m Building entry: src/index.ts, src/styles/globals.css
|
|
6
6
|
[34mCLI[39m Using tsconfig: tsconfig.json
|
|
7
7
|
[34mCLI[39m tsup v8.5.1
|
|
8
|
-
[34mCLI[39m Using tsup config: /
|
|
8
|
+
[34mCLI[39m Using tsup config: /home/circleci/repo/packages/ui/ui-spreadsheets/tsup.config.ts
|
|
9
9
|
[34mCLI[39m Target: es2020
|
|
10
10
|
[34mCLI[39m Cleaning output folder
|
|
11
11
|
[34mCJS[39m Build start
|
|
12
12
|
[34mESM[39m Build start
|
|
13
|
-
|
|
14
|
-
[32mESM[39m [1mdist/
|
|
15
|
-
[32mESM[39m [1mdist/
|
|
16
|
-
[32mESM[39m [1mdist/styles/globals.css.map [22m[32m55.
|
|
17
|
-
[32mESM[39m [1mdist/index.mjs.map [22m[32m4.
|
|
18
|
-
[32mESM[39m ⚡️ Build success in
|
|
19
|
-
[32mCJS[39m [1mdist/
|
|
20
|
-
[32mCJS[39m [1mdist/
|
|
21
|
-
[32mCJS[39m [1mdist/
|
|
22
|
-
[32mCJS[39m [1mdist/
|
|
23
|
-
[32mCJS[39m ⚡️ Build success in
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
13
|
+
[34mDTS[39m Build start
|
|
14
|
+
[32mESM[39m [1mdist/styles/globals.css [22m[32m33.16 KB[39m
|
|
15
|
+
[32mESM[39m [1mdist/index.mjs [22m[32m162.16 KB[39m
|
|
16
|
+
[32mESM[39m [1mdist/styles/globals.css.map [22m[32m55.29 KB[39m
|
|
17
|
+
[32mESM[39m [1mdist/index.mjs.map [22m[32m4.65 MB[39m
|
|
18
|
+
[32mESM[39m ⚡️ Build success in 892ms
|
|
19
|
+
[32mCJS[39m [1mdist/index.js [22m[32m173.50 KB[39m
|
|
20
|
+
[32mCJS[39m [1mdist/styles/globals.css [22m[32m33.16 KB[39m
|
|
21
|
+
[32mCJS[39m [1mdist/index.js.map [22m[32m4.65 MB[39m
|
|
22
|
+
[32mCJS[39m [1mdist/styles/globals.css.map [22m[32m55.29 KB[39m
|
|
23
|
+
[32mCJS[39m ⚡️ Build success in 893ms
|
|
24
|
+
[32mDTS[39m ⚡️ Build success in 5596ms
|
|
25
|
+
[32mDTS[39m [1mdist/styles/globals.d.ts [22m[32m13.00 B[39m
|
|
26
|
+
[32mDTS[39m [1mdist/index.d.ts [22m[32m26.27 KB[39m
|
|
27
|
+
[32mDTS[39m [1mdist/styles/globals.d.mts [22m[32m13.00 B[39m
|
|
28
|
+
[32mDTS[39m [1mdist/index.d.mts [22m[32m26.27 KB[39m
|
package/CHANGELOG.md
CHANGED
package/dist/index.d.mts
CHANGED
|
@@ -247,6 +247,28 @@ interface RowAction<T = any> {
|
|
|
247
247
|
/** Custom className */
|
|
248
248
|
className?: string;
|
|
249
249
|
}
|
|
250
|
+
/**
|
|
251
|
+
* Row context menu item configuration
|
|
252
|
+
* Used for the 3-dot menu that appears on row hover
|
|
253
|
+
*/
|
|
254
|
+
interface RowContextMenuItem<T = any> {
|
|
255
|
+
/** Unique identifier */
|
|
256
|
+
id: string;
|
|
257
|
+
/** Display label for the menu item */
|
|
258
|
+
label: string;
|
|
259
|
+
/** Icon component to display next to the label */
|
|
260
|
+
icon?: React$1.ReactNode;
|
|
261
|
+
/** Callback when menu item is clicked */
|
|
262
|
+
onClick: (row: T, rowId: string | number) => void;
|
|
263
|
+
/** Whether the menu item is visible */
|
|
264
|
+
visible?: (row: T) => boolean;
|
|
265
|
+
/** Whether the menu item is disabled */
|
|
266
|
+
disabled?: (row: T) => boolean;
|
|
267
|
+
/** Variant for styling (e.g., destructive for delete actions) */
|
|
268
|
+
variant?: 'default' | 'destructive';
|
|
269
|
+
/** Custom className */
|
|
270
|
+
className?: string;
|
|
271
|
+
}
|
|
250
272
|
/**
|
|
251
273
|
* Props for the main Spreadsheet component
|
|
252
274
|
*/
|
|
@@ -271,10 +293,6 @@ interface SpreadsheetProps<T = any> {
|
|
|
271
293
|
onRowClick?: (row: T, rowIndex: number) => void;
|
|
272
294
|
/** Callback for row double click */
|
|
273
295
|
onRowDoubleClick?: (row: T, rowIndex: number) => void;
|
|
274
|
-
/** Callback when a row is cloned/duplicated */
|
|
275
|
-
onRowClone?: (row: T, rowId: string | number) => void;
|
|
276
|
-
/** Callback when a row is deleted */
|
|
277
|
-
onRowDelete?: (row: T, rowId: string | number) => void;
|
|
278
296
|
/** Callback when a cell comment is added */
|
|
279
297
|
onAddCellComment?: (rowId: string | number, columnId: string, comment: string) => void;
|
|
280
298
|
/** Callback when a comment's resolved status is toggled */
|
|
@@ -343,6 +361,12 @@ interface SpreadsheetProps<T = any> {
|
|
|
343
361
|
cellComments?: CellComment[];
|
|
344
362
|
/** Custom row actions to display in the index column */
|
|
345
363
|
rowActions?: RowAction<T>[];
|
|
364
|
+
/**
|
|
365
|
+
* Context menu items to display in the 3-dot menu for each row.
|
|
366
|
+
* These appear in a dropdown when the user clicks the 3-dot icon on row hover.
|
|
367
|
+
* Use this for actions like clone, delete, view, edit, etc.
|
|
368
|
+
*/
|
|
369
|
+
rowContextMenuItems?: RowContextMenuItem<T>[];
|
|
346
370
|
/** Custom menu items to display in the toolbar's "More" dropdown menu */
|
|
347
371
|
toolbarMenuItems?: ToolbarMenuItem[];
|
|
348
372
|
/**
|
|
@@ -630,7 +654,7 @@ interface SpreadsheetColumnGroupHeaderProps {
|
|
|
630
654
|
* />
|
|
631
655
|
* ```
|
|
632
656
|
*/
|
|
633
|
-
declare function Spreadsheet<T extends Record<string, any>>({ data, columns, columnGroups, getRowId, onCellsEdit, onSelectionChange, onSortChange, onFilterChange, onRowClick, onRowDoubleClick,
|
|
657
|
+
declare function Spreadsheet<T extends Record<string, any>>({ data, columns, columnGroups, getRowId, onCellsEdit, onSelectionChange, onSortChange, onFilterChange, onRowClick, onRowDoubleClick, onAddCellComment, onToggleCommentResolved, onRowHighlight, onColumnHighlight, onCellHighlight, showToolbar, showPagination, enableRowSelection, enableCellEditing, enableComments, enableHighlighting, enableUndoRedo, pageSizeOptions, onSave, settings: initialSettings, onSettingsChange, isLoading, className, emptyMessage, rowHighlights: externalRowHighlights, columnHighlights: externalColumnHighlights, cellHighlights: externalCellHighlights, cellComments: externalCellComments, rowActions, rowContextMenuItems, toolbarMenuItems, serverSide, totalItems, currentPage: controlledCurrentPage, pageSize: controlledPageSize, sortConfig: controlledSortConfig, onPageChange, filters: controlledFilters, }: SpreadsheetProps<T>): react_jsx_runtime.JSX.Element;
|
|
634
658
|
declare namespace Spreadsheet {
|
|
635
659
|
var displayName: string;
|
|
636
660
|
}
|
|
@@ -740,4 +764,25 @@ interface SpreadsheetSettingsModalProps {
|
|
|
740
764
|
*/
|
|
741
765
|
declare const SpreadsheetSettingsModal: React.FC<SpreadsheetSettingsModalProps>;
|
|
742
766
|
|
|
743
|
-
|
|
767
|
+
interface RowContextMenuProps<T = any> {
|
|
768
|
+
/** The row data */
|
|
769
|
+
row: T;
|
|
770
|
+
/** The row ID */
|
|
771
|
+
rowId: string | number;
|
|
772
|
+
/** Menu items to display */
|
|
773
|
+
items: RowContextMenuItem<T>[];
|
|
774
|
+
/** Whether compact mode is enabled */
|
|
775
|
+
compactMode?: boolean;
|
|
776
|
+
/** Custom className for the trigger button */
|
|
777
|
+
className?: string;
|
|
778
|
+
}
|
|
779
|
+
/**
|
|
780
|
+
* RowContextMenu component - A 3-dot menu that appears on row hover
|
|
781
|
+
* Displays a dropdown with action items (icons + text)
|
|
782
|
+
*/
|
|
783
|
+
declare function RowContextMenu<T>({ row, rowId, items, compactMode, className, }: RowContextMenuProps<T>): react_jsx_runtime.JSX.Element | null;
|
|
784
|
+
declare namespace RowContextMenu {
|
|
785
|
+
var displayName: string;
|
|
786
|
+
}
|
|
787
|
+
|
|
788
|
+
export { type CellComment, type CellEdit, type CellHighlight, type CellPosition, type CellRange, type PaginationState, type RowAction, RowContextMenu, type RowContextMenuItem, type SelectionEdge, type SelectionState, Spreadsheet, MemoizedSpreadsheetCell as SpreadsheetCell, type SpreadsheetCellProps, type SpreadsheetColumn, type SpreadsheetColumnFilter, type SpreadsheetColumnGroup, type SpreadsheetColumnGroupHeaderProps, SpreadsheetFilterDropdown, type SpreadsheetFilterDropdownProps, SpreadsheetHeader, type SpreadsheetHeaderProps, type SpreadsheetProps, type SpreadsheetSettings, SpreadsheetSettingsModal, type SpreadsheetSortConfig, type SpreadsheetState, SpreadsheetToolbar, type SpreadsheetToolbarProps, type ToolbarMenuItem };
|
package/dist/index.d.ts
CHANGED
|
@@ -247,6 +247,28 @@ interface RowAction<T = any> {
|
|
|
247
247
|
/** Custom className */
|
|
248
248
|
className?: string;
|
|
249
249
|
}
|
|
250
|
+
/**
|
|
251
|
+
* Row context menu item configuration
|
|
252
|
+
* Used for the 3-dot menu that appears on row hover
|
|
253
|
+
*/
|
|
254
|
+
interface RowContextMenuItem<T = any> {
|
|
255
|
+
/** Unique identifier */
|
|
256
|
+
id: string;
|
|
257
|
+
/** Display label for the menu item */
|
|
258
|
+
label: string;
|
|
259
|
+
/** Icon component to display next to the label */
|
|
260
|
+
icon?: React$1.ReactNode;
|
|
261
|
+
/** Callback when menu item is clicked */
|
|
262
|
+
onClick: (row: T, rowId: string | number) => void;
|
|
263
|
+
/** Whether the menu item is visible */
|
|
264
|
+
visible?: (row: T) => boolean;
|
|
265
|
+
/** Whether the menu item is disabled */
|
|
266
|
+
disabled?: (row: T) => boolean;
|
|
267
|
+
/** Variant for styling (e.g., destructive for delete actions) */
|
|
268
|
+
variant?: 'default' | 'destructive';
|
|
269
|
+
/** Custom className */
|
|
270
|
+
className?: string;
|
|
271
|
+
}
|
|
250
272
|
/**
|
|
251
273
|
* Props for the main Spreadsheet component
|
|
252
274
|
*/
|
|
@@ -271,10 +293,6 @@ interface SpreadsheetProps<T = any> {
|
|
|
271
293
|
onRowClick?: (row: T, rowIndex: number) => void;
|
|
272
294
|
/** Callback for row double click */
|
|
273
295
|
onRowDoubleClick?: (row: T, rowIndex: number) => void;
|
|
274
|
-
/** Callback when a row is cloned/duplicated */
|
|
275
|
-
onRowClone?: (row: T, rowId: string | number) => void;
|
|
276
|
-
/** Callback when a row is deleted */
|
|
277
|
-
onRowDelete?: (row: T, rowId: string | number) => void;
|
|
278
296
|
/** Callback when a cell comment is added */
|
|
279
297
|
onAddCellComment?: (rowId: string | number, columnId: string, comment: string) => void;
|
|
280
298
|
/** Callback when a comment's resolved status is toggled */
|
|
@@ -343,6 +361,12 @@ interface SpreadsheetProps<T = any> {
|
|
|
343
361
|
cellComments?: CellComment[];
|
|
344
362
|
/** Custom row actions to display in the index column */
|
|
345
363
|
rowActions?: RowAction<T>[];
|
|
364
|
+
/**
|
|
365
|
+
* Context menu items to display in the 3-dot menu for each row.
|
|
366
|
+
* These appear in a dropdown when the user clicks the 3-dot icon on row hover.
|
|
367
|
+
* Use this for actions like clone, delete, view, edit, etc.
|
|
368
|
+
*/
|
|
369
|
+
rowContextMenuItems?: RowContextMenuItem<T>[];
|
|
346
370
|
/** Custom menu items to display in the toolbar's "More" dropdown menu */
|
|
347
371
|
toolbarMenuItems?: ToolbarMenuItem[];
|
|
348
372
|
/**
|
|
@@ -630,7 +654,7 @@ interface SpreadsheetColumnGroupHeaderProps {
|
|
|
630
654
|
* />
|
|
631
655
|
* ```
|
|
632
656
|
*/
|
|
633
|
-
declare function Spreadsheet<T extends Record<string, any>>({ data, columns, columnGroups, getRowId, onCellsEdit, onSelectionChange, onSortChange, onFilterChange, onRowClick, onRowDoubleClick,
|
|
657
|
+
declare function Spreadsheet<T extends Record<string, any>>({ data, columns, columnGroups, getRowId, onCellsEdit, onSelectionChange, onSortChange, onFilterChange, onRowClick, onRowDoubleClick, onAddCellComment, onToggleCommentResolved, onRowHighlight, onColumnHighlight, onCellHighlight, showToolbar, showPagination, enableRowSelection, enableCellEditing, enableComments, enableHighlighting, enableUndoRedo, pageSizeOptions, onSave, settings: initialSettings, onSettingsChange, isLoading, className, emptyMessage, rowHighlights: externalRowHighlights, columnHighlights: externalColumnHighlights, cellHighlights: externalCellHighlights, cellComments: externalCellComments, rowActions, rowContextMenuItems, toolbarMenuItems, serverSide, totalItems, currentPage: controlledCurrentPage, pageSize: controlledPageSize, sortConfig: controlledSortConfig, onPageChange, filters: controlledFilters, }: SpreadsheetProps<T>): react_jsx_runtime.JSX.Element;
|
|
634
658
|
declare namespace Spreadsheet {
|
|
635
659
|
var displayName: string;
|
|
636
660
|
}
|
|
@@ -740,4 +764,25 @@ interface SpreadsheetSettingsModalProps {
|
|
|
740
764
|
*/
|
|
741
765
|
declare const SpreadsheetSettingsModal: React.FC<SpreadsheetSettingsModalProps>;
|
|
742
766
|
|
|
743
|
-
|
|
767
|
+
interface RowContextMenuProps<T = any> {
|
|
768
|
+
/** The row data */
|
|
769
|
+
row: T;
|
|
770
|
+
/** The row ID */
|
|
771
|
+
rowId: string | number;
|
|
772
|
+
/** Menu items to display */
|
|
773
|
+
items: RowContextMenuItem<T>[];
|
|
774
|
+
/** Whether compact mode is enabled */
|
|
775
|
+
compactMode?: boolean;
|
|
776
|
+
/** Custom className for the trigger button */
|
|
777
|
+
className?: string;
|
|
778
|
+
}
|
|
779
|
+
/**
|
|
780
|
+
* RowContextMenu component - A 3-dot menu that appears on row hover
|
|
781
|
+
* Displays a dropdown with action items (icons + text)
|
|
782
|
+
*/
|
|
783
|
+
declare function RowContextMenu<T>({ row, rowId, items, compactMode, className, }: RowContextMenuProps<T>): react_jsx_runtime.JSX.Element | null;
|
|
784
|
+
declare namespace RowContextMenu {
|
|
785
|
+
var displayName: string;
|
|
786
|
+
}
|
|
787
|
+
|
|
788
|
+
export { type CellComment, type CellEdit, type CellHighlight, type CellPosition, type CellRange, type PaginationState, type RowAction, RowContextMenu, type RowContextMenuItem, type SelectionEdge, type SelectionState, Spreadsheet, MemoizedSpreadsheetCell as SpreadsheetCell, type SpreadsheetCellProps, type SpreadsheetColumn, type SpreadsheetColumnFilter, type SpreadsheetColumnGroup, type SpreadsheetColumnGroupHeaderProps, SpreadsheetFilterDropdown, type SpreadsheetFilterDropdownProps, SpreadsheetHeader, type SpreadsheetHeaderProps, type SpreadsheetProps, type SpreadsheetSettings, SpreadsheetSettingsModal, type SpreadsheetSortConfig, type SpreadsheetState, SpreadsheetToolbar, type SpreadsheetToolbarProps, type ToolbarMenuItem };
|