useContextMenuHandlers

useContextMenuHandlers<TData>(): object

Defined in: contextMenu.tsx:492

Hook to get context menu handlers for table cells and column headers.

This hook provides event handlers that:

• Prevent default browser context menu
• Calculate element position (DOMRect)
• Open the appropriate context menu type

Type Parameters

TData

TData

Returns

Object with handleCellContextMenu and handleColumnContextMenu functions

handleCellContextMenu()

handleCellContextMenu: (e, cell, column, row) => void

Handler for cell context menu events. Call this in the onContextMenu prop of table cells.

Parameters

e

MouseEvent<HTMLTableCellElement>

cell

Cell<TData, unknown>

column

Column<TData, unknown>

row

Row<TData>

Returns

void

handleColumnContextMenu()

handleColumnContextMenu: (e, column) => void

Handler for column header context menu events. Call this in the onContextMenu prop of table header cells.

Parameters

e

MouseEvent<HTMLTableCellElement>

column

Column<TData, unknown>

Returns

void

Example

const handlers = useContextMenuHandlers<Person>();

<td onContextMenu={(e) => handlers.handleCellContextMenu(e, cell, column, row)}>
  {content}
</td>

<th onContextMenu={(e) => handlers.handleColumnContextMenu(e, column)}>
  {header}
</th>