@xcelsior/ui-spreadsheets 1.1.3 → 1.1.5

package/.turbo/turbo-build.log

@@ -1,28 +1,28 @@
 
-> @xcelsior/ui-spreadsheets@1.0.14 build /Users/tuannguyen/Work/xcelsior-packages/packages/ui/ui-spreadsheets
+> @xcelsior/ui-spreadsheets@1.1.5 build /home/circleci/repo/packages/ui/ui-spreadsheets
 > tsup && tsc --noEmit
 
 CLI Building entry: src/index.ts, src/styles/globals.css
 CLI Using tsconfig: tsconfig.json
 CLI tsup v8.5.1
-CLI Using tsup config: /Users/tuannguyen/Work/xcelsior-packages/packages/ui/ui-spreadsheets/tsup.config.ts
+CLI Using tsup config: /home/circleci/repo/packages/ui/ui-spreadsheets/tsup.config.ts
 CLI Target: es2020
 CLI Cleaning output folder
 CJS Build start
 ESM Build start
-DTS Build start
-ESM dist/index.mjs              147.76 KB
-ESM dist/styles/globals.css     33.17 KB
-ESM dist/styles/globals.css.map 55.33 KB
-ESM dist/index.mjs.map          4.62 MB
-ESM ⚡️ Build success in 359ms
-CJS dist/styles/globals.css     33.17 KB
-CJS dist/index.js               158.96 KB
-CJS dist/styles/globals.css.map 55.33 KB
-CJS dist/index.js.map           4.62 MB
-CJS ⚡️ Build success in 360ms
-DTS ⚡️ Build success in 2017ms
-DTS dist/styles/globals.d.ts  13.00 B
-DTS dist/index.d.ts           22.84 KB
-DTS dist/styles/globals.d.mts 13.00 B
-DTS dist/index.d.mts          22.84 KB
+DTS Build start
+ESM dist/styles/globals.css     33.16 KB
+ESM dist/index.mjs              162.16 KB
+ESM dist/styles/globals.css.map 55.29 KB
+ESM dist/index.mjs.map          4.65 MB
+ESM ⚡️ Build success in 892ms
+CJS dist/index.js               173.50 KB
+CJS dist/styles/globals.css     33.16 KB
+CJS dist/index.js.map           4.65 MB
+CJS dist/styles/globals.css.map 55.29 KB
+CJS ⚡️ Build success in 893ms
+DTS ⚡️ Build success in 5596ms
+DTS dist/styles/globals.d.ts  13.00 B
+DTS dist/index.d.ts           26.27 KB
+DTS dist/styles/globals.d.mts 13.00 B
+DTS dist/index.d.mts          26.27 KB

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @xcelsior/ui-spreadsheets
 
+## 1.1.5
+
+### Patch Changes
+
+- 8db1f10: improve row context menu
+- Updated dependencies [8db1f10]
+  - @xcelsior/design-system@1.0.8
+
 ## 1.0.15
 
 ### Patch Changes

package/dist/index.d.mts

@@ -247,6 +247,28 @@ interface RowAction<T = any> {
     /** Custom className */
     className?: string;
 }
+/**
+ * Row context menu item configuration
+ * Used for the 3-dot menu that appears on row hover
+ */
+interface RowContextMenuItem<T = any> {
+    /** Unique identifier */
+    id: string;
+    /** Display label for the menu item */
+    label: string;
+    /** Icon component to display next to the label */
+    icon?: React$1.ReactNode;
+    /** Callback when menu item is clicked */
+    onClick: (row: T, rowId: string | number) => void;
+    /** Whether the menu item is visible */
+    visible?: (row: T) => boolean;
+    /** Whether the menu item is disabled */
+    disabled?: (row: T) => boolean;
+    /** Variant for styling (e.g., destructive for delete actions) */
+    variant?: 'default' | 'destructive';
+    /** Custom className */
+    className?: string;
+}
 /**
  * Props for the main Spreadsheet component
  */
@@ -271,14 +293,16 @@ interface SpreadsheetProps<T = any> {
     onRowClick?: (row: T, rowIndex: number) => void;
     /** Callback for row double click */
     onRowDoubleClick?: (row: T, rowIndex: number) => void;
-    /** Callback when a row is cloned/duplicated */
-    onRowClone?: (row: T, rowId: string | number) => void;
-    /** Callback when a row is deleted */
-    onRowDelete?: (row: T, rowId: string | number) => void;
     /** Callback when a cell comment is added */
     onAddCellComment?: (rowId: string | number, columnId: string, comment: string) => void;
+    /** Callback when a comment's resolved status is toggled */
+    onToggleCommentResolved?: (commentId: string) => void;
     /** Callback when row highlight is toggled */
     onRowHighlight?: (rowId: string | number, color: string | null) => void;
+    /** Callback when column highlight is toggled */
+    onColumnHighlight?: (columnId: string, color: string | null) => void;
+    /** Callback when cell highlight is toggled */
+    onCellHighlight?: (rowId: string | number, columnId: string, color: string | null) => void;
     /** Whether to show the toolbar */
     showToolbar?: boolean;
     /** Whether to show pagination */
@@ -329,10 +353,20 @@ interface SpreadsheetProps<T = any> {
     emptyMessage?: string;
     /** Row highlights (externally controlled) */
     rowHighlights?: CellHighlight[];
+    /** Column highlights (externally controlled) */
+    columnHighlights?: Record<string, string>;
+    /** Cell highlights (externally controlled) */
+    cellHighlights?: CellHighlight[];
     /** Cell comments (externally controlled) */
     cellComments?: CellComment[];
     /** Custom row actions to display in the index column */
     rowActions?: RowAction<T>[];
+    /**
+     * Context menu items to display in the 3-dot menu for each row.
+     * These appear in a dropdown when the user clicks the 3-dot icon on row hover.
+     * Use this for actions like clone, delete, view, edit, etc.
+     */
+    rowContextMenuItems?: RowContextMenuItem<T>[];
     /** Custom menu items to display in the toolbar's "More" dropdown menu */
     toolbarMenuItems?: ToolbarMenuItem[];
     /**
@@ -620,7 +654,7 @@ interface SpreadsheetColumnGroupHeaderProps {
  * />
  * ```
  */
-declare function Spreadsheet<T extends Record<string, any>>({ data, columns, columnGroups, getRowId, onCellsEdit, onSelectionChange, onSortChange, onFilterChange, onRowClick, onRowDoubleClick, onRowClone, onRowDelete, onAddCellComment, onRowHighlight, showToolbar, showPagination, enableRowSelection, enableCellEditing, enableComments, enableHighlighting, enableUndoRedo, pageSizeOptions, onSave, settings: initialSettings, onSettingsChange, isLoading, className, emptyMessage, rowHighlights: externalRowHighlights, cellComments: externalCellComments, rowActions, toolbarMenuItems, serverSide, totalItems, currentPage: controlledCurrentPage, pageSize: controlledPageSize, sortConfig: controlledSortConfig, onPageChange, filters: controlledFilters, }: SpreadsheetProps<T>): react_jsx_runtime.JSX.Element;
+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;
 declare namespace Spreadsheet {
     var displayName: string;
 }
@@ -730,4 +764,25 @@ interface SpreadsheetSettingsModalProps {
  */
 declare const SpreadsheetSettingsModal: React.FC<SpreadsheetSettingsModalProps>;
 
-export { type CellComment, type CellEdit, type CellHighlight, type CellPosition, type CellRange, type PaginationState, type RowAction, 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 };
+interface RowContextMenuProps<T = any> {
+    /** The row data */
+    row: T;
+    /** The row ID */
+    rowId: string | number;
+    /** Menu items to display */
+    items: RowContextMenuItem<T>[];
+    /** Whether compact mode is enabled */
+    compactMode?: boolean;
+    /** Custom className for the trigger button */
+    className?: string;
+}
+/**
+ * RowContextMenu component - A 3-dot menu that appears on row hover
+ * Displays a dropdown with action items (icons + text)
+ */
+declare function RowContextMenu<T>({ row, rowId, items, compactMode, className, }: RowContextMenuProps<T>): react_jsx_runtime.JSX.Element | null;
+declare namespace RowContextMenu {
+    var displayName: string;
+}
+
+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

@@ -247,6 +247,28 @@ interface RowAction<T = any> {
     /** Custom className */
     className?: string;
 }
+/**
+ * Row context menu item configuration
+ * Used for the 3-dot menu that appears on row hover
+ */
+interface RowContextMenuItem<T = any> {
+    /** Unique identifier */
+    id: string;
+    /** Display label for the menu item */
+    label: string;
+    /** Icon component to display next to the label */
+    icon?: React$1.ReactNode;
+    /** Callback when menu item is clicked */
+    onClick: (row: T, rowId: string | number) => void;
+    /** Whether the menu item is visible */
+    visible?: (row: T) => boolean;
+    /** Whether the menu item is disabled */
+    disabled?: (row: T) => boolean;
+    /** Variant for styling (e.g., destructive for delete actions) */
+    variant?: 'default' | 'destructive';
+    /** Custom className */
+    className?: string;
+}
 /**
  * Props for the main Spreadsheet component
  */
@@ -271,14 +293,16 @@ interface SpreadsheetProps<T = any> {
     onRowClick?: (row: T, rowIndex: number) => void;
     /** Callback for row double click */
     onRowDoubleClick?: (row: T, rowIndex: number) => void;
-    /** Callback when a row is cloned/duplicated */
-    onRowClone?: (row: T, rowId: string | number) => void;
-    /** Callback when a row is deleted */
-    onRowDelete?: (row: T, rowId: string | number) => void;
     /** Callback when a cell comment is added */
     onAddCellComment?: (rowId: string | number, columnId: string, comment: string) => void;
+    /** Callback when a comment's resolved status is toggled */
+    onToggleCommentResolved?: (commentId: string) => void;
     /** Callback when row highlight is toggled */
     onRowHighlight?: (rowId: string | number, color: string | null) => void;
+    /** Callback when column highlight is toggled */
+    onColumnHighlight?: (columnId: string, color: string | null) => void;
+    /** Callback when cell highlight is toggled */
+    onCellHighlight?: (rowId: string | number, columnId: string, color: string | null) => void;
     /** Whether to show the toolbar */
     showToolbar?: boolean;
     /** Whether to show pagination */
@@ -329,10 +353,20 @@ interface SpreadsheetProps<T = any> {
     emptyMessage?: string;
     /** Row highlights (externally controlled) */
     rowHighlights?: CellHighlight[];
+    /** Column highlights (externally controlled) */
+    columnHighlights?: Record<string, string>;
+    /** Cell highlights (externally controlled) */
+    cellHighlights?: CellHighlight[];
     /** Cell comments (externally controlled) */
     cellComments?: CellComment[];
     /** Custom row actions to display in the index column */
     rowActions?: RowAction<T>[];
+    /**
+     * Context menu items to display in the 3-dot menu for each row.
+     * These appear in a dropdown when the user clicks the 3-dot icon on row hover.
+     * Use this for actions like clone, delete, view, edit, etc.
+     */
+    rowContextMenuItems?: RowContextMenuItem<T>[];
     /** Custom menu items to display in the toolbar's "More" dropdown menu */
     toolbarMenuItems?: ToolbarMenuItem[];
     /**
@@ -620,7 +654,7 @@ interface SpreadsheetColumnGroupHeaderProps {
  * />
  * ```
  */
-declare function Spreadsheet<T extends Record<string, any>>({ data, columns, columnGroups, getRowId, onCellsEdit, onSelectionChange, onSortChange, onFilterChange, onRowClick, onRowDoubleClick, onRowClone, onRowDelete, onAddCellComment, onRowHighlight, showToolbar, showPagination, enableRowSelection, enableCellEditing, enableComments, enableHighlighting, enableUndoRedo, pageSizeOptions, onSave, settings: initialSettings, onSettingsChange, isLoading, className, emptyMessage, rowHighlights: externalRowHighlights, cellComments: externalCellComments, rowActions, toolbarMenuItems, serverSide, totalItems, currentPage: controlledCurrentPage, pageSize: controlledPageSize, sortConfig: controlledSortConfig, onPageChange, filters: controlledFilters, }: SpreadsheetProps<T>): react_jsx_runtime.JSX.Element;
+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;
 declare namespace Spreadsheet {
     var displayName: string;
 }
@@ -730,4 +764,25 @@ interface SpreadsheetSettingsModalProps {
  */
 declare const SpreadsheetSettingsModal: React.FC<SpreadsheetSettingsModalProps>;
 
-export { type CellComment, type CellEdit, type CellHighlight, type CellPosition, type CellRange, type PaginationState, type RowAction, 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 };
+interface RowContextMenuProps<T = any> {
+    /** The row data */
+    row: T;
+    /** The row ID */
+    rowId: string | number;
+    /** Menu items to display */
+    items: RowContextMenuItem<T>[];
+    /** Whether compact mode is enabled */
+    compactMode?: boolean;
+    /** Custom className for the trigger button */
+    className?: string;
+}
+/**
+ * RowContextMenu component - A 3-dot menu that appears on row hover
+ * Displays a dropdown with action items (icons + text)
+ */
+declare function RowContextMenu<T>({ row, rowId, items, compactMode, className, }: RowContextMenuProps<T>): react_jsx_runtime.JSX.Element | null;
+declare namespace RowContextMenu {
+    var displayName: string;
+}
+
+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 };