@alaarab/ogrid-react-fluent 2.0.13 → 2.0.15

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 (3) hide show
  1. package/dist/esm/ColumnHeaderFilter/ColumnHeaderFilter.module.css +4 -0
  2. package/dist/esm/DataGridTable/DataGridTable.js +9 -4
  3. package/package.json +2 -2
package/dist/esm/ColumnHeaderFilter/ColumnHeaderFilter.module.css CHANGED
@@ -140,6 +140,10 @@
140
140
  max-width: 320px;
141
141
  overflow: hidden;
142
142
  padding: 0;
143
+ background-color: var(--colorNeutralBackground1, #ffffff);
144
+ border: 1px solid var(--colorNeutralStroke1, #d1d1d1);
145
+ border-radius: var(--borderRadiusMedium, 4px);
146
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.14);
143
147
  }
144
148
 
145
149
  .popoverHeader {
package/dist/esm/DataGridTable/DataGridTable.js CHANGED
@@ -22,7 +22,7 @@ function GridRowInner(props) {
22
22
  const GridRow = React.memo(GridRowInner, areGridRowPropsEqual);
23
23
  function DataGridTableInner(props) {
24
24
  const o = useDataGridTableOrchestration({ props });
25
- const { wrapperRef, tableContainerRef, lastMouseShiftRef, interaction, pinning, handleResizeStart, getColumnWidth, isReorderDragging, dropIndicatorX, handleHeaderMouseDown, virtualScrollEnabled, visibleRange, items, getRowId, emptyState, rowSelection, freezeRows, freezeCols, isLoading, loadingMessage, ariaLabel, ariaLabelledBy, visibleColumns, columnOrder, columnReorder, density, rowNumberOffset, headerRows, allowOverflowX, fitToContent, editCallbacks, interactionHandlers, cellDescriptorInputRef, pendingEditorValueRef, popoverAnchorElRef, handleSingleRowClick, handlePasteVoid, visibleCols, totalColCount, hasCheckboxCol, hasRowNumbersCol, colOffset, containerWidth, minTableWidth, columnSizingOverrides, selectedRowIds, handleRowCheckboxChange, handleSelectAll, allSelected, someSelected, editingCell, setPopoverAnchorEl, cancelPopoverEdit, setActiveCell, selectionRange, hasCellSelection, handleGridKeyDown, handleFillHandleMouseDown, handleCopy, handleCut, cutRange, copyRange, canUndo, canRedo, onUndo, onRedo, isDragging, menuPosition, closeContextMenu, headerFilterInput, statusBarConfig, showEmptyInGrid, onCellError, headerMenu, } = o;
25
+ const { wrapperRef, tableContainerRef, lastMouseShiftRef, interaction, pinning, handleResizeStart, getColumnWidth, isReorderDragging, dropIndicatorX, handleHeaderMouseDown, virtualScrollEnabled, visibleRange, items, getRowId, emptyState, rowSelection, freezeRows, freezeCols, isLoading, loadingMessage, ariaLabel, ariaLabelledBy, visibleColumns, columnOrder, columnReorder, density, rowNumberOffset, headerRows, allowOverflowX, fitToContent, editCallbacks, interactionHandlers, cellDescriptorInputRef, pendingEditorValueRef, popoverAnchorElRef, handleSingleRowClick, handlePasteVoid, visibleCols, totalColCount, hasCheckboxCol, hasRowNumbersCol, colOffset, containerWidth, minTableWidth, columnSizingOverrides, measuredColumnWidths, selectedRowIds, handleRowCheckboxChange, handleSelectAll, allSelected, someSelected, editingCell, setPopoverAnchorEl, cancelPopoverEdit, setActiveCell, selectionRange, hasCellSelection, handleGridKeyDown, handleFillHandleMouseDown, handleCopy, handleCut, cutRange, copyRange, canUndo, canRedo, onUndo, onRedo, isDragging, menuPosition, closeContextMenu, headerFilterInput, statusBarConfig, showEmptyInGrid, onCellError, headerMenu, } = o;
26
26
  // Pre-compute column styles and classNames (avoids per-cell object creation in the row loop)
27
27
  const columnMeta = useMemo(() => {
28
28
  const cellStyles = {};
@@ -38,8 +38,13 @@ function DataGridTableInner(props) {
38
38
  const isPinnedRight = pinning.pinnedColumns[col.columnId] === 'right';
39
39
  const hasResizeOverride = !!columnSizingOverrides[col.columnId];
40
40
  const isPinned = isPinnedLeft || isPinnedRight;
41
+ // Use previously-measured DOM width as a minWidth floor to prevent columns
42
+ // from shrinking when new data loads (e.g. server-side pagination).
43
+ const measuredW = measuredColumnWidths[col.columnId];
44
+ const baseMinWidth = col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH;
45
+ const effectiveMinWidth = hasResizeOverride ? columnWidth : Math.max(baseMinWidth, measuredW ?? 0);
41
46
  cellStyles[col.columnId] = {
42
- minWidth: hasResizeOverride ? columnWidth : (col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH),
47
+ minWidth: effectiveMinWidth,
43
48
  width: hasExplicitWidth ? columnWidth : undefined,
44
49
  maxWidth: hasExplicitWidth ? columnWidth : undefined,
45
50
  textAlign: col.type === 'numeric' ? 'right' : col.type === 'boolean' ? 'center' : undefined,
@@ -50,7 +55,7 @@ function DataGridTableInner(props) {
50
55
  ...(isPinnedRight && pinning.rightOffsets[col.columnId] != null ? { right: pinning.rightOffsets[col.columnId] } : undefined),
51
56
  };
52
57
  hdrStyles[col.columnId] = {
53
- minWidth: hasResizeOverride ? columnWidth : (col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH),
58
+ minWidth: effectiveMinWidth,
54
59
  width: hasExplicitWidth ? columnWidth : undefined,
55
60
  maxWidth: hasExplicitWidth ? columnWidth : undefined,
56
61
  ...(isPinned ? { position: 'sticky' } : undefined),
@@ -71,7 +76,7 @@ function DataGridTableInner(props) {
71
76
  hdrClasses[col.columnId] = cn;
72
77
  }
73
78
  return { cellStyles, cellClasses, hdrStyles, hdrClasses };
74
- }, [visibleCols, getColumnWidth, columnSizingOverrides, freezeCols, pinning.pinnedColumns, pinning.leftOffsets, pinning.rightOffsets]);
79
+ }, [visibleCols, getColumnWidth, columnSizingOverrides, measuredColumnWidths, freezeCols, pinning.pinnedColumns, pinning.leftOffsets, pinning.rightOffsets]);
75
80
  // renderCellContent reads volatile state from refs -- keeps function identity stable so
76
81
  // GridRow's React.memo comparator can skip rows whose selection state hasn't changed.
77
82
  const renderCellContent = useCallback((item, col, rowIndex, colIdx) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alaarab/ogrid-react-fluent",
3
- "version": "2.0.13",
3
+ "version": "2.0.15",
4
4
  "description": "OGrid React Fluent implementation – DataGrid-powered data table with sorting, filtering, pagination, column chooser, and CSV export.",
5
5
  "main": "dist/esm/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -40,7 +40,7 @@
40
40
  "node": ">=18"
41
41
  },
42
42
  "dependencies": {
43
- "@alaarab/ogrid-react": "2.0.13"
43
+ "@alaarab/ogrid-react": "2.0.15"
44
44
  },
45
45
  "peerDependencies": {
46
46
  "@fluentui/react-components": "^9.0.0",