@alaarab/ogrid-react-fluent 2.2.0 → 2.3.0
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/dist/esm/index.css +25 -4
- package/dist/esm/index.js +88 -69
- package/package.json +2 -2
package/dist/esm/index.css
CHANGED
|
@@ -601,7 +601,7 @@
|
|
|
601
601
|
.ogrid-fluent__DataGridTable-module__dataTable:not([data-virtual-scroll]) tbody tr {
|
|
602
602
|
content-visibility: auto;
|
|
603
603
|
}
|
|
604
|
-
.ogrid-fluent__DataGridTable-module__activeCellContent {
|
|
604
|
+
.ogrid-fluent__DataGridTable-module__tableWrapper .ogrid-fluent__DataGridTable-module__activeCellContent.ogrid-fluent__DataGridTable-module__activeCellContent {
|
|
605
605
|
outline: 2px solid var(--ogrid-selection-color, #217346);
|
|
606
606
|
outline-offset: -1px;
|
|
607
607
|
z-index: var(--ogrid-z-active-cell, 2);
|
|
@@ -609,7 +609,7 @@
|
|
|
609
609
|
overflow: visible;
|
|
610
610
|
background: var(--ogrid-active-cell-bg, rgba(0, 0, 0, 0.02));
|
|
611
611
|
}
|
|
612
|
-
.ogrid-fluent__DataGridTable-module__editingCellContent {
|
|
612
|
+
.ogrid-fluent__DataGridTable-module__tableWrapper .ogrid-fluent__DataGridTable-module__editingCellContent.ogrid-fluent__DataGridTable-module__editingCellContent {
|
|
613
613
|
width: 100%;
|
|
614
614
|
height: 100%;
|
|
615
615
|
display: flex;
|
|
@@ -632,10 +632,14 @@
|
|
|
632
632
|
.ogrid-fluent__DataGridTable-module__tableWrapper [data-drag-anchor] {
|
|
633
633
|
background: var(--ogrid-bg, #fff);
|
|
634
634
|
}
|
|
635
|
-
.ogrid-fluent__DataGridTable-module__activeCellContent[data-drag-anchor],
|
|
636
|
-
.ogrid-fluent__DataGridTable-module__activeCellContent[data-drag-range] {
|
|
635
|
+
.ogrid-fluent__DataGridTable-module__tableWrapper .ogrid-fluent__DataGridTable-module__activeCellContent.ogrid-fluent__DataGridTable-module__activeCellContent[data-drag-anchor],
|
|
636
|
+
.ogrid-fluent__DataGridTable-module__tableWrapper .ogrid-fluent__DataGridTable-module__activeCellContent.ogrid-fluent__DataGridTable-module__activeCellContent[data-drag-range] {
|
|
637
637
|
outline: none;
|
|
638
638
|
}
|
|
639
|
+
.ogrid-fluent__DataGridTable-module__tableWrapper .ogrid-fluent__DataGridTable-module__activeCellContent.ogrid-fluent__DataGridTable-module__activeCellContent.ogrid-fluent__DataGridTable-module__inRange {
|
|
640
|
+
outline: none;
|
|
641
|
+
background: var(--ogrid-bg, #fff);
|
|
642
|
+
}
|
|
639
643
|
.ogrid-fluent__DataGridTable-module__tableWrapper .ogrid-fluent__DataGridTable-module__cellCut {
|
|
640
644
|
background: var(--ogrid-hover-bg, rgba(0, 0, 0, 0.04));
|
|
641
645
|
opacity: 0.7;
|
|
@@ -668,6 +672,20 @@
|
|
|
668
672
|
width: 100%;
|
|
669
673
|
font-variant-numeric: tabular-nums;
|
|
670
674
|
}
|
|
675
|
+
.ogrid-fluent__DataGridTable-module__columnLetterRow {
|
|
676
|
+
background: var(--ogrid-column-letter-bg, var(--ogrid-header-bg));
|
|
677
|
+
}
|
|
678
|
+
.ogrid-fluent__DataGridTable-module__columnLetterCell {
|
|
679
|
+
text-align: center;
|
|
680
|
+
font-size: 11px;
|
|
681
|
+
font-weight: 500;
|
|
682
|
+
color: var(--ogrid-fg-muted, rgba(0, 0, 0, 0.5));
|
|
683
|
+
padding: 2px 4px;
|
|
684
|
+
background: var(--ogrid-column-letter-bg, var(--ogrid-header-bg));
|
|
685
|
+
border-bottom: 1px solid var(--ogrid-border, rgba(0, 0, 0, 0.12));
|
|
686
|
+
user-select: none;
|
|
687
|
+
font-variant-numeric: tabular-nums;
|
|
688
|
+
}
|
|
671
689
|
.ogrid-fluent__DataGridTable-module__statusBar {
|
|
672
690
|
display: flex;
|
|
673
691
|
align-items: center;
|
|
@@ -873,6 +891,7 @@
|
|
|
873
891
|
--ogrid-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.08);
|
|
874
892
|
--ogrid-pinned-shadow: rgba(0, 0, 0, 0.1);
|
|
875
893
|
--ogrid-loading-overlay: rgba(255, 255, 255, 0.7);
|
|
894
|
+
--ogrid-formula-error-color: #d32f2f;
|
|
876
895
|
--ogrid-selection: #217346;
|
|
877
896
|
--ogrid-bg-range: rgba(33, 115, 70, 0.12);
|
|
878
897
|
--ogrid-bg-selected: #e6f0fb;
|
|
@@ -907,6 +926,7 @@
|
|
|
907
926
|
--ogrid-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.25);
|
|
908
927
|
--ogrid-pinned-shadow: rgba(0, 0, 0, 0.3);
|
|
909
928
|
--ogrid-loading-overlay: rgba(0, 0, 0, 0.7);
|
|
929
|
+
--ogrid-formula-error-color: #ef5350;
|
|
910
930
|
--ogrid-selection: #2ea043;
|
|
911
931
|
--ogrid-bg-range: rgba(46, 160, 67, 0.15);
|
|
912
932
|
--ogrid-bg-selected: #1a3a5c;
|
|
@@ -941,6 +961,7 @@
|
|
|
941
961
|
--ogrid-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.25);
|
|
942
962
|
--ogrid-pinned-shadow: rgba(0, 0, 0, 0.3);
|
|
943
963
|
--ogrid-loading-overlay: rgba(0, 0, 0, 0.7);
|
|
964
|
+
--ogrid-formula-error-color: #ef5350;
|
|
944
965
|
--ogrid-selection: #2ea043;
|
|
945
966
|
--ogrid-bg-range: rgba(46, 160, 67, 0.15);
|
|
946
967
|
--ogrid-bg-selected: #1a3a5c;
|
package/dist/esm/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './index.css';
|
|
2
|
-
import { useColumnHeaderFilterState, getColumnHeaderFilterStateParams, DateFilterContent, renderFilterContent, areGridRowPropsEqual, usePaginationControls, createOGrid, useListVirtualizer, STOP_PROPAGATION, useDataGridTableOrchestration, useColumnMeta, getCellRenderDescriptor, buildInlineEditorProps, buildPopoverEditorProps, POPOVER_ANCHOR_STYLE, resolveCellDisplayContent, resolveCellStyle, getCellInteractionProps, CURSOR_CELL_STYLE, CellErrorBoundary, GRID_ROOT_STYLE, PREVENT_DEFAULT, getHeaderFilterConfig, MarchingAntsOverlay, NOOP, useColumnChooserState, BaseInlineCellEditor, partitionColumnsForVirtualization, BaseDropIndicator, BaseEmptyState, GridContextMenu as GridContextMenu$1, BaseColumnHeaderMenu, StatusBar as StatusBar$1, BaseLoadingOverlay } from '@alaarab/ogrid-react';
|
|
2
|
+
import { useColumnHeaderFilterState, getColumnHeaderFilterStateParams, DateFilterContent, renderFilterContent, areGridRowPropsEqual, usePaginationControls, createOGrid, useListVirtualizer, STOP_PROPAGATION, useDataGridTableOrchestration, useColumnMeta, getCellRenderDescriptor, buildInlineEditorProps, buildPopoverEditorProps, POPOVER_ANCHOR_STYLE, resolveCellDisplayContent, resolveCellStyle, getCellInteractionProps, CURSOR_CELL_STYLE, CellErrorBoundary, GRID_ROOT_STYLE, PREVENT_DEFAULT, indexToColumnLetter, getHeaderFilterConfig, MarchingAntsOverlay, NOOP, useColumnChooserState, BaseInlineCellEditor, partitionColumnsForVirtualization, BaseDropIndicator, BaseEmptyState, GridContextMenu as GridContextMenu$1, BaseColumnHeaderMenu, StatusBar as StatusBar$1, BaseLoadingOverlay } from '@alaarab/ogrid-react';
|
|
3
3
|
export { BaseColumnHeaderMenu, BaseDropIndicator, BaseEmptyState, BaseInlineCellEditor, BaseLoadingOverlay, CELL_PADDING, CHECKBOX_COLUMN_WIDTH, COLUMN_HEADER_MENU_ITEMS, CURSOR_CELL_STYLE, CellErrorBoundary, DEFAULT_MIN_COLUMN_WIDTH, DateFilterContent, EmptyState, GRID_BORDER_RADIUS, GRID_CONTEXT_MENU_ITEMS, GRID_ROOT_STYLE, GridContextMenu, MAX_PAGE_BUTTONS, MarchingAntsOverlay, NOOP, OGridLayout, PAGE_SIZE_OPTIONS, POPOVER_ANCHOR_STYLE, PREVENT_DEFAULT, ROW_NUMBER_COLUMN_WIDTH, STOP_PROPAGATION, SideBar, StatusBar, UndoRedoStack, areGridRowPropsEqual, booleanParser, buildCsvHeader, buildCsvRows, buildHeaderRows, buildInlineEditorProps, buildPopoverEditorProps, clampSelectionToBounds, computeAggregations, computeAutoScrollSpeed, computeTabNavigation, createOGrid, currencyParser, dateParser, deriveFilterOptionsFromData, editorInputStyle, editorWrapperStyle, emailParser, escapeCsvValue, exportToCsv, findCtrlArrowTarget, flattenColumns, formatCellValueForTsv, formatSelectionAsTsv, formatShortcut, getCellInteractionProps, getCellRenderDescriptor, getCellValue, getColumnHeaderFilterStateParams, getColumnHeaderMenuItems, getContextMenuHandlers, getDataGridStatusBarConfig, getDateFilterContentProps, getFilterField, getHeaderFilterConfig, getMultiSelectFilterFields, getPaginationViewModel, getStatusBarParts, isInSelectionRange, isRowInRange, mergeFilter, normalizeSelectionRange, numberParser, parseTsvClipboard, parseValue, processClientSideData, rangesEqual, renderFilterContent, resolveCellDisplayContent, resolveCellStyle, richSelectDropdownStyle, richSelectNoMatchesStyle, richSelectOptionHighlightedStyle, richSelectOptionStyle, richSelectWrapperStyle, selectChevronStyle, selectDisplayStyle, selectEditorStyle, toUserLike, triggerCsvDownload, useActiveCell, useCellEditing, useCellSelection, useClipboard, useColumnChooserState, useColumnHeaderFilterState, useColumnMeta, useColumnReorder, useColumnResize, useContextMenu, useDataGridState, useDataGridTableOrchestration, useDateFilterState, useDebounce, useFillHandle, useFilterOptions, useInlineCellEditorState, useKeyboardNavigation, useLatestRef, useListVirtualizer, useMultiSelectFilterState, useOGrid, usePaginationControls, usePeopleFilterState, useRichSelectState, useRowSelection, useSelectState, useSideBarState, useTableLayout, useTextFilterState, useUndoRedo, useVirtualScroll } from '@alaarab/ogrid-react';
|
|
4
4
|
import * as React2 from 'react';
|
|
5
5
|
import { useCallback, useRef, useEffect } from 'react';
|
|
@@ -456,12 +456,15 @@ var DataGridTable_module_default = {
|
|
|
456
456
|
"activeCellContent": "ogrid-fluent__DataGridTable-module__activeCellContent",
|
|
457
457
|
"editingCellContent": "ogrid-fluent__DataGridTable-module__editingCellContent",
|
|
458
458
|
"cellInRange": "ogrid-fluent__DataGridTable-module__cellInRange",
|
|
459
|
+
"inRange": "ogrid-fluent__DataGridTable-module__inRange",
|
|
459
460
|
"cellCut": "ogrid-fluent__DataGridTable-module__cellCut",
|
|
460
461
|
"fillHandle": "ogrid-fluent__DataGridTable-module__fillHandle",
|
|
461
462
|
"selectionHeaderCellInner": "ogrid-fluent__DataGridTable-module__selectionHeaderCellInner",
|
|
462
463
|
"selectionCellInner": "ogrid-fluent__DataGridTable-module__selectionCellInner",
|
|
463
464
|
"rowNumberHeaderCellInner": "ogrid-fluent__DataGridTable-module__rowNumberHeaderCellInner",
|
|
464
465
|
"rowNumberCellInner": "ogrid-fluent__DataGridTable-module__rowNumberCellInner",
|
|
466
|
+
"columnLetterRow": "ogrid-fluent__DataGridTable-module__columnLetterRow",
|
|
467
|
+
"columnLetterCell": "ogrid-fluent__DataGridTable-module__columnLetterCell",
|
|
465
468
|
"statusBar": "ogrid-fluent__DataGridTable-module__statusBar",
|
|
466
469
|
"statusBarItem": "ogrid-fluent__DataGridTable-module__statusBarItem",
|
|
467
470
|
"statusBarLabel": "ogrid-fluent__DataGridTable-module__statusBarLabel",
|
|
@@ -725,6 +728,7 @@ function DataGridTableInner(props) {
|
|
|
725
728
|
headerRows,
|
|
726
729
|
allowOverflowX,
|
|
727
730
|
fitToContent,
|
|
731
|
+
showColumnLetters,
|
|
728
732
|
editCallbacks,
|
|
729
733
|
interactionHandlers,
|
|
730
734
|
cellDescriptorInputRef,
|
|
@@ -819,9 +823,9 @@ function DataGridTableInner(props) {
|
|
|
819
823
|
] });
|
|
820
824
|
} else {
|
|
821
825
|
const displayContent = resolveCellDisplayContent(col, item, descriptor.displayValue);
|
|
822
|
-
const cellStyle = resolveCellStyle(col, item);
|
|
826
|
+
const cellStyle = resolveCellStyle(col, item, descriptor.displayValue);
|
|
823
827
|
const styledContent = cellStyle ? /* @__PURE__ */ jsx("span", { style: cellStyle, children: displayContent }) : displayContent;
|
|
824
|
-
const cellClassNames = `${DataGridTable_module_default.cellContent}${descriptor.isActive ? ` ${DataGridTable_module_default.activeCellContent}` : ""}${descriptor.isInRange && !descriptor.isActive ? ` ${DataGridTable_module_default.cellInRange}` : ""}${descriptor.isInCutRange ? ` ${DataGridTable_module_default.cellCut}` : ""}${descriptor.isInCopyRange ? ` ${DataGridTable_module_default.cellCopied}` : ""}`;
|
|
828
|
+
const cellClassNames = `${DataGridTable_module_default.cellContent}${descriptor.isActive ? ` ${DataGridTable_module_default.activeCellContent}` : ""}${descriptor.isActive && descriptor.isInRange ? ` ${DataGridTable_module_default.inRange}` : ""}${descriptor.isInRange && !descriptor.isActive ? ` ${DataGridTable_module_default.cellInRange}` : ""}${descriptor.isInCutRange ? ` ${DataGridTable_module_default.cellCut}` : ""}${descriptor.isInCopyRange ? ` ${DataGridTable_module_default.cellCopied}` : ""}`;
|
|
825
829
|
const interactionProps = getCellInteractionProps(descriptor, col.columnId, interactionHandlers);
|
|
826
830
|
content = /* @__PURE__ */ jsxs(
|
|
827
831
|
"div",
|
|
@@ -880,81 +884,96 @@ function DataGridTableInner(props) {
|
|
|
880
884
|
children: [
|
|
881
885
|
/* @__PURE__ */ jsx("div", { className: DataGridTable_module_default.tableScrollContent, children: /* @__PURE__ */ jsx("div", { className: isLoading && items.length > 0 ? DataGridTable_module_default.loadingDimmed : void 0, children: /* @__PURE__ */ jsxs("div", { className: DataGridTable_module_default.tableWidthAnchor, ref: tableContainerRef, children: [
|
|
882
886
|
/* @__PURE__ */ jsxs(Table, { role: "grid", className: DataGridTable_module_default.dataTable, "data-virtual-scroll": virtualScrollEnabled ? "" : void 0, children: [
|
|
883
|
-
/* @__PURE__ */
|
|
887
|
+
/* @__PURE__ */ jsxs(
|
|
884
888
|
TableHeader,
|
|
885
889
|
{
|
|
886
890
|
className: o.stickyHeader ? DataGridTable_module_default.stickyHeader : void 0,
|
|
887
|
-
children:
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
{
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
"aria-label": "Select all rows"
|
|
894
|
-
}
|
|
895
|
-
) }) }, "__selection__"),
|
|
896
|
-
rowIdx === 0 && rowIdx < headerRows.length - 1 && hasCheckboxCol && /* @__PURE__ */ jsx("th", { rowSpan: headerRows.length - 1 }, "__selection_placeholder__"),
|
|
897
|
-
rowIdx === headerRows.length - 1 && hasRowNumbersCol && /* @__PURE__ */ jsx(TableHeaderCell, { className: DataGridTable_module_default.rowNumberHeaderCellWrapper, children: /* @__PURE__ */ jsx("div", { className: DataGridTable_module_default.rowNumberHeaderCellInner, children: "#" }) }, "__row_number__"),
|
|
898
|
-
rowIdx === 0 && rowIdx < headerRows.length - 1 && hasRowNumbersCol && /* @__PURE__ */ jsx("th", { rowSpan: headerRows.length - 1 }, "__row_number_placeholder__"),
|
|
899
|
-
row.map((cell, cellIdx) => {
|
|
900
|
-
if (cell.isGroup) {
|
|
901
|
-
return /* @__PURE__ */ jsx("th", { colSpan: cell.colSpan, className: DataGridTable_module_default.groupHeaderCell, scope: "colgroup", children: cell.label }, cellIdx);
|
|
902
|
-
}
|
|
903
|
-
if (!cell.columnDef) return null;
|
|
904
|
-
const col = cell.columnDef;
|
|
905
|
-
const isSorted = props.sortBy === col.columnId;
|
|
906
|
-
const ariaSort = isSorted ? props.sortDirection === "asc" ? "ascending" : "descending" : void 0;
|
|
907
|
-
return /* @__PURE__ */ jsxs(
|
|
908
|
-
TableHeaderCell,
|
|
891
|
+
children: [
|
|
892
|
+
showColumnLetters && /* @__PURE__ */ jsxs(TableRow, { children: [
|
|
893
|
+
hasCheckboxCol && /* @__PURE__ */ jsx("th", { className: DataGridTable_module_default.columnLetterCell }),
|
|
894
|
+
hasRowNumbersCol && /* @__PURE__ */ jsx("th", { className: DataGridTable_module_default.columnLetterCell }),
|
|
895
|
+
visibleCols.map((col, colIdx) => /* @__PURE__ */ jsx(
|
|
896
|
+
"th",
|
|
909
897
|
{
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
898
|
+
className: `${DataGridTable_module_default.columnLetterCell}${columnMeta.hdrClasses[col.columnId] ? ` ${columnMeta.hdrClasses[col.columnId]}` : ""}`,
|
|
899
|
+
style: columnMeta.hdrStyles[col.columnId],
|
|
900
|
+
children: indexToColumnLetter(colIdx)
|
|
901
|
+
},
|
|
902
|
+
col.columnId
|
|
903
|
+
))
|
|
904
|
+
] }),
|
|
905
|
+
headerRows.map((row, rowIdx) => /* @__PURE__ */ jsxs(TableRow, { children: [
|
|
906
|
+
rowIdx === headerRows.length - 1 && hasCheckboxCol && /* @__PURE__ */ jsx(TableHeaderCell, { className: DataGridTable_module_default.selectionHeaderCellWrapper, children: /* @__PURE__ */ jsx("div", { className: DataGridTable_module_default.selectionHeaderCellInner, children: /* @__PURE__ */ jsx(
|
|
907
|
+
Checkbox,
|
|
908
|
+
{
|
|
909
|
+
checked: allSelected ? true : someSelected ? "mixed" : false,
|
|
910
|
+
onChange: (_, data) => handleSelectAll(!!data.checked),
|
|
911
|
+
"aria-label": "Select all rows"
|
|
912
|
+
}
|
|
913
|
+
) }) }, "__selection__"),
|
|
914
|
+
rowIdx === 0 && rowIdx < headerRows.length - 1 && hasCheckboxCol && /* @__PURE__ */ jsx("th", { rowSpan: headerRows.length - 1 }, "__selection_placeholder__"),
|
|
915
|
+
rowIdx === headerRows.length - 1 && hasRowNumbersCol && /* @__PURE__ */ jsx(TableHeaderCell, { className: DataGridTable_module_default.rowNumberHeaderCellWrapper, children: /* @__PURE__ */ jsx("div", { className: DataGridTable_module_default.rowNumberHeaderCellInner, children: "#" }) }, "__row_number__"),
|
|
916
|
+
rowIdx === 0 && rowIdx < headerRows.length - 1 && hasRowNumbersCol && /* @__PURE__ */ jsx("th", { rowSpan: headerRows.length - 1 }, "__row_number_placeholder__"),
|
|
917
|
+
row.map((cell, cellIdx) => {
|
|
918
|
+
if (cell.isGroup) {
|
|
919
|
+
return /* @__PURE__ */ jsx("th", { colSpan: cell.colSpan, className: DataGridTable_module_default.groupHeaderCell, scope: "colgroup", children: cell.label }, cellIdx);
|
|
920
|
+
}
|
|
921
|
+
if (!cell.columnDef) return null;
|
|
922
|
+
const col = cell.columnDef;
|
|
923
|
+
const isSorted = props.sortBy === col.columnId;
|
|
924
|
+
const ariaSort = isSorted ? props.sortDirection === "asc" ? "ascending" : "descending" : void 0;
|
|
925
|
+
return /* @__PURE__ */ jsxs(
|
|
926
|
+
TableHeaderCell,
|
|
927
|
+
{
|
|
928
|
+
scope: "col",
|
|
929
|
+
"data-column-id": col.columnId,
|
|
930
|
+
className: columnMeta.hdrClasses[col.columnId] || void 0,
|
|
931
|
+
style: {
|
|
932
|
+
...columnMeta.hdrStyles[col.columnId],
|
|
933
|
+
...columnReorder ? { cursor: isReorderDragging ? "grabbing" : "grab" } : void 0
|
|
934
|
+
},
|
|
935
|
+
"aria-sort": ariaSort,
|
|
936
|
+
onMouseDown: columnReorder ? (e) => handleHeaderMouseDown(col.columnId, e) : void 0,
|
|
937
|
+
children: [
|
|
938
|
+
/* @__PURE__ */ jsxs("div", { className: DataGridTable_module_default.headerCellContent, children: [
|
|
939
|
+
/* @__PURE__ */ jsx(ColumnHeaderFilter, { ...getHeaderFilterConfig(col, headerFilterInput) }),
|
|
940
|
+
/* @__PURE__ */ jsx(
|
|
941
|
+
"button",
|
|
942
|
+
{
|
|
943
|
+
className: DataGridTable_module_default.headerMenuTrigger,
|
|
944
|
+
onClick: (e) => {
|
|
945
|
+
e.stopPropagation();
|
|
946
|
+
headerMenu.open(col.columnId, e.currentTarget);
|
|
947
|
+
},
|
|
948
|
+
"aria-label": "Column options",
|
|
949
|
+
title: "Column options",
|
|
950
|
+
children: "\u22EE"
|
|
951
|
+
}
|
|
952
|
+
)
|
|
953
|
+
] }),
|
|
922
954
|
/* @__PURE__ */ jsx(
|
|
923
|
-
"
|
|
955
|
+
"div",
|
|
924
956
|
{
|
|
925
|
-
className: DataGridTable_module_default.
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
957
|
+
className: DataGridTable_module_default.resizeHandle,
|
|
958
|
+
role: "separator",
|
|
959
|
+
"aria-orientation": "vertical",
|
|
960
|
+
onMouseDown: (e) => {
|
|
961
|
+
setActiveCell(null);
|
|
962
|
+
interaction.setSelectionRange(null);
|
|
963
|
+
wrapperRef.current?.focus({ preventScroll: true });
|
|
964
|
+
handleResizeStart(e, col);
|
|
929
965
|
},
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
children: "\u22EE"
|
|
966
|
+
onDoubleClick: (e) => handleResizeDoubleClick(e, col),
|
|
967
|
+
"aria-label": `Resize ${col.name}`
|
|
933
968
|
}
|
|
934
969
|
)
|
|
935
|
-
]
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
onMouseDown: (e) => {
|
|
943
|
-
setActiveCell(null);
|
|
944
|
-
interaction.setSelectionRange(null);
|
|
945
|
-
wrapperRef.current?.focus({ preventScroll: true });
|
|
946
|
-
handleResizeStart(e, col);
|
|
947
|
-
},
|
|
948
|
-
onDoubleClick: (e) => handleResizeDoubleClick(e, col),
|
|
949
|
-
"aria-label": `Resize ${col.name}`
|
|
950
|
-
}
|
|
951
|
-
)
|
|
952
|
-
]
|
|
953
|
-
},
|
|
954
|
-
col.columnId
|
|
955
|
-
);
|
|
956
|
-
})
|
|
957
|
-
] }, rowIdx))
|
|
970
|
+
]
|
|
971
|
+
},
|
|
972
|
+
col.columnId
|
|
973
|
+
);
|
|
974
|
+
})
|
|
975
|
+
] }, rowIdx))
|
|
976
|
+
]
|
|
958
977
|
}
|
|
959
978
|
),
|
|
960
979
|
!showEmptyInGrid && /* @__PURE__ */ jsx(
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alaarab/ogrid-react-fluent",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.3.0",
|
|
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",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"node": ">=18"
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@alaarab/ogrid-react": "2.
|
|
44
|
+
"@alaarab/ogrid-react": "2.3.0"
|
|
45
45
|
},
|
|
46
46
|
"peerDependencies": {
|
|
47
47
|
"@fluentui/react-components": "^9.0.0",
|