@alaarab/ogrid 1.3.0 → 1.3.1
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.
|
@@ -84,6 +84,7 @@ function DataGridTableInner(props) {
|
|
|
84
84
|
const isPinnedLeft = col.pinned === 'left';
|
|
85
85
|
const isPinnedRight = col.pinned === 'right';
|
|
86
86
|
const columnWidth = getColumnWidth(col);
|
|
87
|
+
const hasExplicitWidth = !!(columnSizingOverrides[col.columnId] || col.idealWidth != null || col.defaultWidth != null);
|
|
87
88
|
return (_jsxs("th", { scope: "col", "data-column-id": col.columnId, className: [
|
|
88
89
|
isFreezeCol ? styles.freezeCol : '',
|
|
89
90
|
isFreezeCol && colIdx === 0 ? styles.freezeColFirst : '',
|
|
@@ -91,8 +92,8 @@ function DataGridTableInner(props) {
|
|
|
91
92
|
isPinnedRight ? styles.pinnedColRight : '',
|
|
92
93
|
].filter(Boolean).join(' '), style: {
|
|
93
94
|
minWidth: col.minWidth ?? 80,
|
|
94
|
-
width: columnWidth,
|
|
95
|
-
maxWidth: columnWidth,
|
|
95
|
+
width: hasExplicitWidth ? columnWidth : undefined,
|
|
96
|
+
maxWidth: hasExplicitWidth ? columnWidth : undefined,
|
|
96
97
|
position: 'relative',
|
|
97
98
|
}, children: [_jsx(ColumnHeaderFilter, { ...getHeaderFilterConfig(col, headerFilterInput) }), _jsx("div", { className: styles.resizeHandle, onMouseDown: (e) => handleResizeStart(e, col), "aria-label": `Resize ${col.name}` })] }, col.columnId));
|
|
98
99
|
})] }) }), !showEmptyInGrid && (_jsx("tbody", { children: items.map((item, rowIndex) => {
|
|
@@ -108,6 +109,7 @@ function DataGridTableInner(props) {
|
|
|
108
109
|
const isPinnedLeft = col.pinned === 'left';
|
|
109
110
|
const isPinnedRight = col.pinned === 'right';
|
|
110
111
|
const columnWidth = getColumnWidth(col);
|
|
112
|
+
const hasExplicitWidth = !!(columnSizingOverrides[col.columnId] || col.idealWidth != null || col.defaultWidth != null);
|
|
111
113
|
return (_jsx("td", { className: [
|
|
112
114
|
isFreezeCol ? styles.freezeCol : '',
|
|
113
115
|
isFreezeCol && colIdx === 0 ? styles.freezeColFirst : '',
|
|
@@ -115,8 +117,8 @@ function DataGridTableInner(props) {
|
|
|
115
117
|
isPinnedRight ? styles.pinnedColRight : '',
|
|
116
118
|
].filter(Boolean).join(' '), style: {
|
|
117
119
|
minWidth: col.minWidth ?? 80,
|
|
118
|
-
width: columnWidth,
|
|
119
|
-
maxWidth: columnWidth,
|
|
120
|
+
width: hasExplicitWidth ? columnWidth : undefined,
|
|
121
|
+
maxWidth: hasExplicitWidth ? columnWidth : undefined,
|
|
120
122
|
}, children: renderCellContent(item, col, rowIndex, colIdx) }, col.columnId));
|
|
121
123
|
})] }, rowIdStr));
|
|
122
124
|
}) }))] }), _jsx(MarchingAntsOverlay, { containerRef: tableContainerRef, selectionRange: selectionRange, copyRange: copyRange, cutRange: cutRange, colOffset: colOffset }), statusBarConfig && (_jsx(StatusBar, { totalCount: statusBarConfig.totalCount, filteredCount: statusBarConfig.filteredCount, selectedCount: statusBarConfig.selectedCount ?? selectedRowIds.size, selectedCellCount: selectionRange ? (Math.abs(selectionRange.endRow - selectionRange.startRow) + 1) * (Math.abs(selectionRange.endCol - selectionRange.startCol) + 1) : undefined }))] }) })] }), showEmptyInGrid && emptyState && (_jsx("div", { className: styles.emptyStateInGrid, children: _jsx("div", { children: emptyState.render ? (emptyState.render()) : (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.emptyStateInGridTitle, children: "No results found" }), _jsx("div", { className: styles.emptyStateInGridMessage, children: emptyState.message != null ? (emptyState.message) : emptyState.hasActiveFilters ? (_jsxs(_Fragment, { children: ["No items match your current filters. Try adjusting your search or", ' ', _jsx("button", { type: "button", className: styles.emptyStateInGridLink, onClick: emptyState.onClearAll, children: "clear all filters" }), ' ', "to see all items."] })) : ('There are no items available at this time.') })] })) }) }))] }), contextMenu &&
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
@charset "UTF-8";
|
|
1
2
|
.tableScrollContent {
|
|
2
3
|
display: flex;
|
|
3
4
|
flex-direction: column;
|
|
@@ -12,7 +13,6 @@
|
|
|
12
13
|
width: 100%;
|
|
13
14
|
min-width: 0;
|
|
14
15
|
max-width: 100%;
|
|
15
|
-
margin-bottom: 15px;
|
|
16
16
|
border-radius: 6px;
|
|
17
17
|
box-sizing: border-box;
|
|
18
18
|
}
|
|
@@ -26,7 +26,8 @@
|
|
|
26
26
|
.tableWidthAnchor {
|
|
27
27
|
position: relative;
|
|
28
28
|
width: max-content;
|
|
29
|
-
min-width:
|
|
29
|
+
/* No min-width: 100% — anchor sizes to grid content so status bar aligns with the table border.
|
|
30
|
+
.tableScrollContent provides the full-width background so no gap is visible. */
|
|
30
31
|
background: var(--ogrid-bg, #fff);
|
|
31
32
|
}
|
|
32
33
|
|
|
@@ -289,6 +290,7 @@
|
|
|
289
290
|
gap: 16px;
|
|
290
291
|
width: 100%;
|
|
291
292
|
padding: 6px 12px;
|
|
293
|
+
box-sizing: border-box;
|
|
292
294
|
font-size: 12px;
|
|
293
295
|
color: var(--ogrid-muted, #616161);
|
|
294
296
|
background: var(--ogrid-bg-subtle, #f3f2f1);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alaarab/ogrid",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.1",
|
|
4
4
|
"description": "OGrid default (Radix) – Data grid with sorting, filtering, pagination, column chooser, and CSV export. Packed with Radix UI; no Fluent or Material required.",
|
|
5
5
|
"main": "dist/esm/index.js",
|
|
6
6
|
"module": "dist/esm/index.js",
|