@infinite-table/infinite-react 4.0.0 → 4.1.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/index.css +1 -1
- package/index.d.ts +42 -13
- package/index.dev.js +522 -384
- package/index.dev.mjs +521 -385
- package/index.js +2 -2
- package/index.mjs +2 -2
- package/package.json +2 -2
package/index.dev.js
CHANGED
|
@@ -156,6 +156,7 @@ __export(src_exports, {
|
|
|
156
156
|
useDataSource: () => useDataSource,
|
|
157
157
|
useEffectWithChanges: () => useEffectWithChanges,
|
|
158
158
|
useEffectWithObject: () => useEffectWithObject,
|
|
159
|
+
useGridScroll: () => useGridScroll,
|
|
159
160
|
useInfiniteColumnCell: () => useInfiniteColumnCell,
|
|
160
161
|
useInfiniteColumnEditor: () => useInfiniteColumnEditor,
|
|
161
162
|
useInfiniteColumnFilterEditor: () => useInfiniteColumnFilterEditor,
|
|
@@ -163,7 +164,8 @@ __export(src_exports, {
|
|
|
163
164
|
useMasterRowInfo: () => useMasterRowInfo,
|
|
164
165
|
useOverlay: () => useOverlay,
|
|
165
166
|
useOverlayPortal: () => useOverlayPortal,
|
|
166
|
-
useRowInfoReducers: () => useRowInfoReducers
|
|
167
|
+
useRowInfoReducers: () => useRowInfoReducers,
|
|
168
|
+
useVisibleColumnSizes: () => useVisibleColumnSizes
|
|
167
169
|
});
|
|
168
170
|
module.exports = __toCommonJS(src_exports);
|
|
169
171
|
|
|
@@ -1215,9 +1217,10 @@ var useOnScroll = (domRef, onScroll) => {
|
|
|
1215
1217
|
};
|
|
1216
1218
|
|
|
1217
1219
|
// src/components/VirtualScrollContainer/VirtualScrollContainer.css.ts
|
|
1218
|
-
var ScrollableCls = { true: "
|
|
1219
|
-
var ScrollableHorizontalCls = { true: "
|
|
1220
|
-
var ScrollableVerticalCls = { true: "
|
|
1220
|
+
var ScrollableCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijco2", false: "VirtualScrollContainer_getOverflowFor_false__1ueijco3", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijco4", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijco5", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijco6" };
|
|
1221
|
+
var ScrollableHorizontalCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijco7", false: "VirtualScrollContainer_getOverflowFor_false__1ueijco8", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijco9", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijcoa", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijcob" };
|
|
1222
|
+
var ScrollableVerticalCls = { true: "VirtualScrollContainer_getOverflowFor_true__1ueijcoc", false: "VirtualScrollContainer_getOverflowFor_false__1ueijcod", visible: "VirtualScrollContainer_getOverflowFor_visible__1ueijcoe", auto: "VirtualScrollContainer_getOverflowFor_auto__1ueijcof", hidden: "VirtualScrollContainer_getOverflowFor_hidden__1ueijcog" };
|
|
1223
|
+
var VirtualScrollContainerChildToScrollCls = "VirtualScrollContainer_VirtualScrollContainerChildToScrollCls__1ueijco1";
|
|
1221
1224
|
var VirtualScrollContainerCls = "VirtualScrollContainer_VirtualScrollContainerCls__1ueijco0 utilities_boxSizingBorderBox__16lm1iw0";
|
|
1222
1225
|
|
|
1223
1226
|
// src/components/VirtualScrollContainer/getScrollableClassName.ts
|
|
@@ -1426,7 +1429,7 @@ var internalProps = {
|
|
|
1426
1429
|
};
|
|
1427
1430
|
|
|
1428
1431
|
// src/components/InfiniteTable/vars.css.ts
|
|
1429
|
-
var ThemeVars = { color: { accent: "var(--infinite-accent-color)", error: "var(--infinite-error-color)", color: "var(--infinite-color)" }, spacing: { "0": "var(--infinite-space-0)", "1": "var(--infinite-space-1)", "2": "var(--infinite-space-2)", "3": "var(--infinite-space-3)", "4": "var(--infinite-space-4)", "5": "var(--infinite-space-5)", "6": "var(--infinite-space-6)", "7": "var(--infinite-space-7)", "8": "var(--infinite-space-8)", "9": "var(--infinite-space-9)", "10": "var(--infinite-space-10)" }, fontSize: { "0": "var(--infinite-font-size-0)", "1": "var(--infinite-font-size-1)", "2": "var(--infinite-font-size-2)", "3": "var(--infinite-font-size-3)", "4": "var(--infinite-font-size-4)", "5": "var(--infinite-font-size-5)", "6": "var(--infinite-font-size-6)", "7": "var(--infinite-font-size-7)" }, fontFamily: "var(--infinite-font-family)", minHeight: "var(--infinite-min-height)", borderRadius: "var(--infinite-border-radius)", background: "var(--infinite-background)", iconSize: "var(--infinite-icon-size)", components: { LoadMask: { padding: "var(--infinite-load-mask-padding)", color: "var(--infinite-load-mask-color)", textBackground: "var(--infinite-load-mask-text-background)", overlayBackground: "var(--infinite-load-mask-overlay-background)", overlayOpacity: "var(--infinite-load-mask-overlay-opacity)", borderRadius: "var(--infinite-load-mask-border-radius)" }, Header: { background: "var(--infinite-header-background)", color: "var(--infinite-header-color)", columnHeaderHeight: "var(--infinite-column-header-height)" }, HeaderCell: { background: "var(--infinite-header-cell-background)", hoverBackground: "var(--infinite-header-cell-hover-background)", border: "var(--infinite-header-cell-border)", padding: "var(--infinite-header-cell-padding)", paddingX: "var(--infinite-header-cell-padding-x)", paddingY: "var(--infinite-header-cell-padding-y)", iconSize: "var(--infinite-header-cell-icon-size)", menuIconLineWidth: "var(--infinite-header-cell-menu-icon-line-width)", sortIconMargin: "var(--infinite-header-cell-sort-icon-margin)", borderRight: "var(--infinite-header-cell-border-right)", resizeHandleActiveAreaWidth: "var(--infinite-resize-handle-active-area-width)", resizeHandleWidth: "var(--infinite-resize-handle-width)", resizeHandleHoverBackground: "var(--infinite-resize-handle-hover-background)", resizeHandleConstrainedHoverBackground: "var(--infinite-resize-handle-constrained-hover-background)", filterOperatorPaddingX: "var(--infinite-filter-operator-padding-x)", filterEditorPaddingX: "var(--infinite-filter-editor-padding-x)", filterEditorMarginX: "var(--infinite-filter-editor-margin-x)", filterOperatorPaddingY: "var(--infinite-filter-operator-padding-y)", filterEditorPaddingY: "var(--infinite-filter-editor-padding-y)", filterEditorMarginY: "var(--infinite-filter-editor-margin-y)", filterEditorBackground: "var(--infinite-filter-editor-background)", filterEditorBorder: "var(--infinite-filter-editor-border)", filterEditorFocusBorderColor: "var(--infinite-filter-editor-focus-border-color)", filterEditorBorderRadius: "var(--infinite-filter-editor-border-radius)", filterEditorColor: "var(--infinite-filter-editor-color)" }, Cell: { padding: "var(--infinite-cell-padding)", borderWidth: "var(--infinite-cell-border-width)", border: "var(--infinite-cell-border)", borderLeft: "var(--infinite-cell-border-left)", borderRight: "var(--infinite-cell-border-right)", borderTop: "var(--infinite-cell-border-top)", borderInvisible: "var(--infinite-cell-border-invisible)", borderRadius: "var(--infinite-cell-border-radius)", reorderEffectDuration: "var(--infinite-column-reorder-effect-duration)", pinnedBorder: "var(--infinite-pinned-cell-border)", color: "var(--infinite-cell-color)", selectedBackground: "var(--infinite-selected-cell-background)", selectedBackgroundDefault: "var(--infinite-selected-cell-background-default)", selectedBackgroundAlpha: "var(--infinite-selected-cell-background-alpha)", selectedBackgroundAlphaWhenTableUnfocused: "var(--infinite-selected-cell-background-alpha--table-unfocused)", selectedBorderColor: "var(--infinite-selected-cell-border-color)", selectedBorderWidth: "var(--infinite-selected-cell-border-width)", selectedBorderStyle: "var(--infinite-selected-cell-border-style)", selectedBorder: "var(--infinite-selected-cell-border)", activeBackgroundAlpha: "var(--infinite-active-cell-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-cell-background-alpha--table-unfocused)", activeBackground: "var(--infinite-active-cell-background)", activeBackgroundDefault: "var(--infinite-active-cell-background-default)", activeBorderColor: "var(--infinite-active-cell-border-color)", activeBorderWidth: "var(--infinite-active-cell-border-width)", activeBorderStyle: "var(--infinite-active-cell-border-style)", activeBorder: "var(--infinite-active-cell-border)" }, SelectionCheckBox: { marginInline: "var(--infinite-selection-checkbox-margin-inline)" }, Menu: { background: "var(--infinite-menu-background)", color: "var(--infinite-menu-color)", separatorColor: "var(--infinite-menu-separator-color)", padding: "var(--infinite-menu-padding)", cellPaddingVertical: "var(--infinite-menu-cell-padding-vertical)", cellPaddingHorizontal: "var(--infinite-menu-cell-padding-horizontal)", cellMarginVertical: "var(--infinite-menu-cell-margin-vertical)", itemDisabledBackground: "var(--infinite-menu-item-disabled-background)", itemActiveBackground: "var(--infinite-menu-item-active-background)", itemActiveOpacity: "var(--infinite-menu-item-active-opacity)", itemPressedOpacity: "var(--infinite-menu-item-pressed-opacity)", itemPressedBackground: "var(--infinite-menu-item-pressed-background)", itemDisabledOpacity: "var(--infinite-menu-item-disabled-opacity)", borderRadius: "var(--infinite-menu-border-radius)", shadowColor: "var(--infinite-menu-shadow-color)" }, RowDetail: { background: "var(--infinite-rowdetail-background)", padding: "var(--infinite-rowdetail-padding)", gridHeight: "var(--infinite-rowdetail-grid-height)" }, Row: { background: "var(--infinite-row-background)", oddBackground: "var(--infinite-row-odd-background)", selectedBackground: "var(--infinite-row-selected-background)", activeBackground: "var(--infinite-active-row-background)", activeBorderColor: "var(--infinite-active-row-border-color)", activeBorderWidth: "var(--infinite-active-row-border-width)", activeBorderStyle: "var(--infinite-active-row-border-style)", activeBorder: "var(--infinite-active-row-border)", activeBackgroundAlpha: "var(--infinite-active-row-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-row-background-alpha--table-unfocused)", hoverBackground: "var(--infinite-row-hover-background)", selectedHoverBackground: "var(--infinite-row-selected-hover-background)", groupRowBackground: "var(--infinite-group-row-background)", groupRowColumnNesting: "var(--infinite-group-row-column-nesting)", groupNesting: "var(--infinite-dont-override-group-row-nesting-length)", pointerEventsWhileScrolling: "var(--infinite-row-pointer-events-while-scrolling)" }, ColumnCell: { background: "var(--infinite-column-cell-bg-dont-override)" } } };
|
|
1432
|
+
var ThemeVars = { color: { accent: "var(--infinite-accent-color)", error: "var(--infinite-error-color)", color: "var(--infinite-color)" }, spacing: { "0": "var(--infinite-space-0)", "1": "var(--infinite-space-1)", "2": "var(--infinite-space-2)", "3": "var(--infinite-space-3)", "4": "var(--infinite-space-4)", "5": "var(--infinite-space-5)", "6": "var(--infinite-space-6)", "7": "var(--infinite-space-7)", "8": "var(--infinite-space-8)", "9": "var(--infinite-space-9)", "10": "var(--infinite-space-10)" }, fontSize: { "0": "var(--infinite-font-size-0)", "1": "var(--infinite-font-size-1)", "2": "var(--infinite-font-size-2)", "3": "var(--infinite-font-size-3)", "4": "var(--infinite-font-size-4)", "5": "var(--infinite-font-size-5)", "6": "var(--infinite-font-size-6)", "7": "var(--infinite-font-size-7)" }, fontFamily: "var(--infinite-font-family)", minHeight: "var(--infinite-min-height)", borderRadius: "var(--infinite-border-radius)", background: "var(--infinite-background)", iconSize: "var(--infinite-icon-size)", runtime: { bodyWidth: "var(--infinite-runtime-body-content-width)", totalVisibleColumnsWidth: "var(--infinite-runtime-total-visible-columns-width)", visibleColumnsCount: "var(--infinite-runtime-visible-columns-count)" }, components: { LoadMask: { padding: "var(--infinite-load-mask-padding)", color: "var(--infinite-load-mask-color)", textBackground: "var(--infinite-load-mask-text-background)", overlayBackground: "var(--infinite-load-mask-overlay-background)", overlayOpacity: "var(--infinite-load-mask-overlay-opacity)", borderRadius: "var(--infinite-load-mask-border-radius)" }, Header: { background: "var(--infinite-header-background)", color: "var(--infinite-header-color)", columnHeaderHeight: "var(--infinite-column-header-height)" }, HeaderCell: { background: "var(--infinite-header-cell-background)", hoverBackground: "var(--infinite-header-cell-hover-background)", border: "var(--infinite-header-cell-border)", padding: "var(--infinite-header-cell-padding)", paddingX: "var(--infinite-header-cell-padding-x)", paddingY: "var(--infinite-header-cell-padding-y)", iconSize: "var(--infinite-header-cell-icon-size)", menuIconLineWidth: "var(--infinite-header-cell-menu-icon-line-width)", sortIconMargin: "var(--infinite-header-cell-sort-icon-margin)", borderRight: "var(--infinite-header-cell-border-right)", resizeHandleActiveAreaWidth: "var(--infinite-resize-handle-active-area-width)", resizeHandleWidth: "var(--infinite-resize-handle-width)", resizeHandleHoverBackground: "var(--infinite-resize-handle-hover-background)", resizeHandleConstrainedHoverBackground: "var(--infinite-resize-handle-constrained-hover-background)", filterOperatorPaddingX: "var(--infinite-filter-operator-padding-x)", filterEditorPaddingX: "var(--infinite-filter-editor-padding-x)", filterEditorMarginX: "var(--infinite-filter-editor-margin-x)", filterOperatorPaddingY: "var(--infinite-filter-operator-padding-y)", filterEditorPaddingY: "var(--infinite-filter-editor-padding-y)", filterEditorMarginY: "var(--infinite-filter-editor-margin-y)", filterEditorBackground: "var(--infinite-filter-editor-background)", filterEditorBorder: "var(--infinite-filter-editor-border)", filterEditorFocusBorderColor: "var(--infinite-filter-editor-focus-border-color)", filterEditorBorderRadius: "var(--infinite-filter-editor-border-radius)", filterEditorColor: "var(--infinite-filter-editor-color)" }, ActiveCellIndicator: { inset: "var(--infinite-active-cell-indicator-inset)" }, Cell: { padding: "var(--infinite-cell-padding)", borderWidth: "var(--infinite-cell-border-width)", border: "var(--infinite-cell-border)", borderLeft: "var(--infinite-cell-border-left)", borderRight: "var(--infinite-cell-border-right)", borderTop: "var(--infinite-cell-border-top)", borderInvisible: "var(--infinite-cell-border-invisible)", borderRadius: "var(--infinite-cell-border-radius)", reorderEffectDuration: "var(--infinite-column-reorder-effect-duration)", pinnedBorder: "var(--infinite-pinned-cell-border)", color: "var(--infinite-cell-color)", selectedBackground: "var(--infinite-selected-cell-background)", selectedBackgroundDefault: "var(--infinite-selected-cell-background-default)", selectedBackgroundAlpha: "var(--infinite-selected-cell-background-alpha)", selectedBackgroundAlphaWhenTableUnfocused: "var(--infinite-selected-cell-background-alpha--table-unfocused)", selectedBorderColor: "var(--infinite-selected-cell-border-color)", selectedBorderWidth: "var(--infinite-selected-cell-border-width)", selectedBorderStyle: "var(--infinite-selected-cell-border-style)", selectedBorder: "var(--infinite-selected-cell-border)", activeBackgroundAlpha: "var(--infinite-active-cell-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-cell-background-alpha--table-unfocused)", activeBackground: "var(--infinite-active-cell-background)", activeBackgroundDefault: "var(--infinite-active-cell-background-default)", activeBorderColor: "var(--infinite-active-cell-border-color)", activeBorderWidth: "var(--infinite-active-cell-border-width)", activeBorderStyle: "var(--infinite-active-cell-border-style)", activeBorder: "var(--infinite-active-cell-border)" }, SelectionCheckBox: { marginInline: "var(--infinite-selection-checkbox-margin-inline)" }, Menu: { background: "var(--infinite-menu-background)", color: "var(--infinite-menu-color)", separatorColor: "var(--infinite-menu-separator-color)", padding: "var(--infinite-menu-padding)", cellPaddingVertical: "var(--infinite-menu-cell-padding-vertical)", cellPaddingHorizontal: "var(--infinite-menu-cell-padding-horizontal)", cellMarginVertical: "var(--infinite-menu-cell-margin-vertical)", itemDisabledBackground: "var(--infinite-menu-item-disabled-background)", itemActiveBackground: "var(--infinite-menu-item-active-background)", itemActiveOpacity: "var(--infinite-menu-item-active-opacity)", itemPressedOpacity: "var(--infinite-menu-item-pressed-opacity)", itemPressedBackground: "var(--infinite-menu-item-pressed-background)", itemDisabledOpacity: "var(--infinite-menu-item-disabled-opacity)", borderRadius: "var(--infinite-menu-border-radius)", shadowColor: "var(--infinite-menu-shadow-color)" }, RowDetail: { background: "var(--infinite-rowdetail-background)", padding: "var(--infinite-rowdetail-padding)", gridHeight: "var(--infinite-rowdetail-grid-height)" }, Row: { background: "var(--infinite-row-background)", oddBackground: "var(--infinite-row-odd-background)", selectedBackground: "var(--infinite-row-selected-background)", activeBackground: "var(--infinite-active-row-background)", activeBorderColor: "var(--infinite-active-row-border-color)", activeBorderWidth: "var(--infinite-active-row-border-width)", activeBorderStyle: "var(--infinite-active-row-border-style)", activeBorder: "var(--infinite-active-row-border)", activeBackgroundAlpha: "var(--infinite-active-row-background-alpha)", activeBackgroundAlphaWhenTableUnfocused: "var(--infinite-active-row-background-alpha--table-unfocused)", hoverBackground: "var(--infinite-row-hover-background)", selectedHoverBackground: "var(--infinite-row-selected-hover-background)", groupRowBackground: "var(--infinite-group-row-background)", groupRowColumnNesting: "var(--infinite-group-row-column-nesting)", groupNesting: "var(--infinite-dont-override-group-row-nesting-length)", pointerEventsWhileScrolling: "var(--infinite-row-pointer-events-while-scrolling)" }, ColumnCell: { background: "var(--infinite-column-cell-bg-dont-override)" } } };
|
|
1430
1433
|
var columnHeaderHeightName = "column-header-height";
|
|
1431
1434
|
|
|
1432
1435
|
// src/components/InfiniteTable/utils/infiniteDOMUtils.ts
|
|
@@ -4135,8 +4138,8 @@ var useRerender = () => {
|
|
|
4135
4138
|
};
|
|
4136
4139
|
|
|
4137
4140
|
// src/components/InfiniteTable/components/ActiveCellIndicator.css.ts
|
|
4138
|
-
var ActiveCellIndicatorCls = { visible: "ActiveCellIndicator_ActiveCellIndicatorCls_visible__nxbq1c2 ActiveCellIndicator_ActiveCellIndicator__nxbq1c1 utilities_pointerEvents_none__16lm1iwl
|
|
4139
|
-
var ActiveIndicatorWrapperCls = "utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_left_0__16lm1iw1e utilities_top_0__16lm1iw1c utilities_height_0__16lm1iw18 utilities_zIndex_1000000__16lm1iwu";
|
|
4141
|
+
var ActiveCellIndicatorCls = { visible: "ActiveCellIndicator_ActiveCellIndicatorCls_visible__nxbq1c2 ActiveCellIndicator_ActiveCellIndicator__nxbq1c1 utilities_pointerEvents_none__16lm1iwl utilities_position_absolute__16lm1iw2", hidden: "ActiveCellIndicator_ActiveCellIndicatorCls_hidden__nxbq1c3 ActiveCellIndicator_ActiveCellIndicator__nxbq1c1 utilities_pointerEvents_none__16lm1iwl utilities_position_absolute__16lm1iw2" };
|
|
4142
|
+
var ActiveIndicatorWrapperCls = "ActiveCellIndicator_ActiveIndicatorWrapperCls__nxbq1c0 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_left_0__16lm1iw1e utilities_top_0__16lm1iw1c utilities_height_0__16lm1iw18 utilities_zIndex_1000000__16lm1iwu";
|
|
4140
4143
|
|
|
4141
4144
|
// src/components/InfiniteTable/components/ActiveRowIndicator.css.ts
|
|
4142
4145
|
var ActiveRowIndicatorCls = { visible: "ActiveRowIndicator_ActiveRowIndicatorCls_visible__j26lrx1 ActiveRowIndicator_ActiveRowIndicator__j26lrx0 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_width_100%__16lm1iw1b utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e", hidden: "ActiveRowIndicator_ActiveRowIndicatorCls_hidden__j26lrx2 ActiveRowIndicator_ActiveRowIndicator__j26lrx0 utilities_pointerEvents_none__16lm1iwl utilities_position_sticky__16lm1iw4 utilities_width_100%__16lm1iw1b utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e" };
|
|
@@ -4206,13 +4209,6 @@ var import_react9 = require("react");
|
|
|
4206
4209
|
var { rootClassName: rootClassName4 } = internalProps;
|
|
4207
4210
|
var baseCls2 = `${rootClassName4}-ActiveCellIndicator`;
|
|
4208
4211
|
var columnZIndexAtIndex2 = stripVar(InternalVars.columnZIndexAtIndex);
|
|
4209
|
-
var ActiveStyle2 = {
|
|
4210
|
-
[stripVar(InternalVars.activeCellOffsetX)]: InternalVars.activeCellColOffset,
|
|
4211
|
-
[stripVar(InternalVars.activeCellOffsetY)]: InternalVars.activeCellRowOffset,
|
|
4212
|
-
transform: `translate3d(${InternalVars.activeCellOffsetX}, ${InternalVars.activeCellOffsetY}, 0px)`,
|
|
4213
|
-
width: InternalVars.activeCellColWidth,
|
|
4214
|
-
height: InternalVars.activeCellRowHeight
|
|
4215
|
-
};
|
|
4216
4212
|
var reposition = (brain, activeCellIndex, rowHeight, domRef) => {
|
|
4217
4213
|
if (activeCellIndex == null) {
|
|
4218
4214
|
return;
|
|
@@ -4251,6 +4247,7 @@ var ActiveCellIndicatorFn = (props) => {
|
|
|
4251
4247
|
"div",
|
|
4252
4248
|
{
|
|
4253
4249
|
className: ActiveIndicatorWrapperCls,
|
|
4250
|
+
ref: domRef,
|
|
4254
4251
|
"data-name": "active-cell",
|
|
4255
4252
|
style: active ? {
|
|
4256
4253
|
zIndex: `var(${columnZIndexAtIndex2}-${props.activeCellIndex[1]})`
|
|
@@ -4259,10 +4256,8 @@ var ActiveCellIndicatorFn = (props) => {
|
|
|
4259
4256
|
/* @__PURE__ */ React12.createElement(
|
|
4260
4257
|
"div",
|
|
4261
4258
|
{
|
|
4262
|
-
ref: domRef,
|
|
4263
4259
|
"data-name": "active-cell-indicator",
|
|
4264
|
-
className: `${baseCls2} ${active ? ActiveCellIndicatorCls.visible : ActiveCellIndicatorCls.hidden}
|
|
4265
|
-
style: active ? ActiveStyle2 : void 0
|
|
4260
|
+
className: `${baseCls2} ${active ? ActiveCellIndicatorCls.visible : ActiveCellIndicatorCls.hidden}`
|
|
4266
4261
|
}
|
|
4267
4262
|
)
|
|
4268
4263
|
)
|
|
@@ -4293,6 +4288,10 @@ function useMatrixBrain(brain, brainOptions, fixedCellsInfo) {
|
|
|
4293
4288
|
colspan: brainOptions.colspan
|
|
4294
4289
|
});
|
|
4295
4290
|
}
|
|
4291
|
+
var CHILD_TO_SCROLL_CLS = join(
|
|
4292
|
+
scrollTransformTargetCls,
|
|
4293
|
+
VirtualScrollContainerChildToScrollCls
|
|
4294
|
+
);
|
|
4296
4295
|
function HeadlessTable(props) {
|
|
4297
4296
|
const _a = props, {
|
|
4298
4297
|
brain,
|
|
@@ -4371,7 +4370,7 @@ function HeadlessTable(props) {
|
|
|
4371
4370
|
"div",
|
|
4372
4371
|
{
|
|
4373
4372
|
ref: domRef,
|
|
4374
|
-
className:
|
|
4373
|
+
className: CHILD_TO_SCROLL_CLS,
|
|
4375
4374
|
"data-name": "scroll-transform-target"
|
|
4376
4375
|
},
|
|
4377
4376
|
/* @__PURE__ */ React13.createElement(
|
|
@@ -4799,7 +4798,7 @@ function useComponentState() {
|
|
|
4799
4798
|
return React14.useContext(Context);
|
|
4800
4799
|
}
|
|
4801
4800
|
|
|
4802
|
-
// src/components/InfiniteTable/components/
|
|
4801
|
+
// src/components/InfiniteTable/components/InfiniteTableFooter/InfiniteTableFooter.tsx
|
|
4803
4802
|
var React15 = __toESM(require("react"));
|
|
4804
4803
|
|
|
4805
4804
|
// src/components/InfiniteTable/hooks/useInternalProps.ts
|
|
@@ -4826,49 +4825,25 @@ var userSelect = { none: "utilities_userSelect_none__16lm1iw17" };
|
|
|
4826
4825
|
var visibility = { visible: "utilities_visibility_visible__16lm1iw20", hidden: "utilities_visibility_hidden__16lm1iw21" };
|
|
4827
4826
|
var zIndex = { "1": "utilities_zIndex_1__16lm1iwo", "10": "utilities_zIndex_10__16lm1iwp", "100": "utilities_zIndex_100__16lm1iwq", "1000": "utilities_zIndex_1000__16lm1iwr", "10000": "utilities_zIndex_10000__16lm1iws", "100000": "utilities_zIndex_100000__16lm1iwt", "1000000": "utilities_zIndex_1000000__16lm1iwu", "10000000": "utilities_zIndex_10000000__16lm1iwv", "1k": "utilities_zIndex_1k__16lm1iww", "10k": "utilities_zIndex_10k__16lm1iwx", "100k": "utilities_zIndex_100k__16lm1iwy" };
|
|
4828
4827
|
|
|
4829
|
-
// src/components/InfiniteTable/components/
|
|
4830
|
-
|
|
4828
|
+
// src/components/InfiniteTable/components/InfiniteTableFooter/InfiniteTableFooter.tsx
|
|
4829
|
+
function InfiniteTableFooter(props) {
|
|
4831
4830
|
const { rootClassName: rootClassName12 } = useInternalProps();
|
|
4832
4831
|
return /* @__PURE__ */ React15.createElement(
|
|
4833
4832
|
"div",
|
|
4834
|
-
__spreadProps(__spreadValues({
|
|
4835
|
-
ref
|
|
4836
|
-
}, props), {
|
|
4833
|
+
__spreadProps(__spreadValues({}, props), {
|
|
4837
4834
|
className: join(
|
|
4838
|
-
`${rootClassName12}
|
|
4835
|
+
`${rootClassName12}Footer`,
|
|
4839
4836
|
position.relative,
|
|
4840
|
-
flex
|
|
4841
|
-
|
|
4837
|
+
display.flex,
|
|
4838
|
+
flexFlow.row,
|
|
4842
4839
|
props.className
|
|
4843
4840
|
)
|
|
4844
4841
|
})
|
|
4845
4842
|
);
|
|
4846
|
-
}
|
|
4847
|
-
|
|
4848
|
-
// src/components/InfiniteTable/components/InfiniteTableFooter/InfiniteTableFooter.tsx
|
|
4849
|
-
var React16 = __toESM(require("react"));
|
|
4850
|
-
var InfiniteTableFooter = React16.forwardRef(
|
|
4851
|
-
function InfiniteTableFooter2(props, ref) {
|
|
4852
|
-
const { rootClassName: rootClassName12 } = useInternalProps();
|
|
4853
|
-
return /* @__PURE__ */ React16.createElement(
|
|
4854
|
-
"div",
|
|
4855
|
-
__spreadProps(__spreadValues({
|
|
4856
|
-
ref
|
|
4857
|
-
}, props), {
|
|
4858
|
-
className: join(
|
|
4859
|
-
`${rootClassName12}Footer`,
|
|
4860
|
-
position.relative,
|
|
4861
|
-
display.flex,
|
|
4862
|
-
flexFlow.row,
|
|
4863
|
-
props.className
|
|
4864
|
-
)
|
|
4865
|
-
})
|
|
4866
|
-
);
|
|
4867
|
-
}
|
|
4868
|
-
);
|
|
4843
|
+
}
|
|
4869
4844
|
|
|
4870
4845
|
// src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeaderCell.tsx
|
|
4871
|
-
var
|
|
4846
|
+
var React42 = __toESM(require("react"));
|
|
4872
4847
|
var import_react29 = require("react");
|
|
4873
4848
|
var import_react_dom = require("react-dom");
|
|
4874
4849
|
|
|
@@ -4882,7 +4857,7 @@ function keyMirror(obj) {
|
|
|
4882
4857
|
}
|
|
4883
4858
|
|
|
4884
4859
|
// src/components/InfiniteTable/components/icons/Icon.tsx
|
|
4885
|
-
var
|
|
4860
|
+
var React16 = __toESM(require("react"));
|
|
4886
4861
|
var Icon = (props) => {
|
|
4887
4862
|
var _a;
|
|
4888
4863
|
const size = (_a = props.size) != null ? _a : `var(--infinite-icon-size)`;
|
|
@@ -4894,69 +4869,69 @@ var Icon = (props) => {
|
|
|
4894
4869
|
}, props.style);
|
|
4895
4870
|
return (
|
|
4896
4871
|
//@ts-ignore
|
|
4897
|
-
/* @__PURE__ */
|
|
4872
|
+
/* @__PURE__ */ React16.createElement("svg", __spreadProps(__spreadValues({ viewBox: "0 0 24 24" }, props), { style: style2 }), props.children)
|
|
4898
4873
|
);
|
|
4899
4874
|
};
|
|
4900
4875
|
|
|
4901
4876
|
// src/components/InfiniteTable/components/icons/IncludesOperatorIcon.tsx
|
|
4902
|
-
var
|
|
4877
|
+
var React17 = __toESM(require("react"));
|
|
4903
4878
|
var IncludesOperatorIcon = (props) => {
|
|
4904
|
-
return /* @__PURE__ */
|
|
4879
|
+
return /* @__PURE__ */ React17.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React17.createElement("path", { d: "M5,4V7H10.5V19H13.5V7H19V4H5Z" }));
|
|
4905
4880
|
};
|
|
4906
4881
|
|
|
4907
4882
|
// src/components/InfiniteTable/components/icons/EndsWithOperatorIcon.tsx
|
|
4908
|
-
var
|
|
4883
|
+
var React18 = __toESM(require("react"));
|
|
4909
4884
|
var EndsWithOperatorIcon = (props) => {
|
|
4910
|
-
return /* @__PURE__ */
|
|
4885
|
+
return /* @__PURE__ */ React18.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React18.createElement("path", { d: "M11.14 4L6.43 16H8.36L9.32 13.43H14.67L15.64 16H17.57L12.86 4M12 6.29L14.03 11.71H9.96M20 14V18H2V20H22V14Z" }));
|
|
4911
4886
|
};
|
|
4912
4887
|
|
|
4913
4888
|
// src/components/InfiniteTable/components/icons/EqualOperatorIcon.tsx
|
|
4914
|
-
var
|
|
4889
|
+
var React19 = __toESM(require("react"));
|
|
4915
4890
|
var EqualOperatorIcon = (props) => {
|
|
4916
|
-
return /* @__PURE__ */
|
|
4891
|
+
return /* @__PURE__ */ React19.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React19.createElement("path", { d: "M19,10H5V8H19V10M19,16H5V14H19V16Z" }));
|
|
4917
4892
|
};
|
|
4918
4893
|
|
|
4919
4894
|
// src/components/InfiniteTable/components/icons/GTEOperatorIcon.tsx
|
|
4920
|
-
var
|
|
4895
|
+
var React20 = __toESM(require("react"));
|
|
4921
4896
|
var GTEOperatorIcon = (props) => {
|
|
4922
|
-
return /* @__PURE__ */
|
|
4897
|
+
return /* @__PURE__ */ React20.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React20.createElement("path", { d: "M6.5,2.27L20,10.14L6.5,18L5.5,16.27L16.03,10.14L5.5,4L6.5,2.27M20,20V22H5V20H20Z" }));
|
|
4923
4898
|
};
|
|
4924
4899
|
|
|
4925
4900
|
// src/components/InfiniteTable/components/icons/GTOperatorIcon.tsx
|
|
4926
|
-
var
|
|
4901
|
+
var React21 = __toESM(require("react"));
|
|
4927
4902
|
var GTOperatorIcon = (props) => {
|
|
4928
|
-
return /* @__PURE__ */
|
|
4903
|
+
return /* @__PURE__ */ React21.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React21.createElement("path", { d: "M5.5,4.14L4.5,5.86L15,12L4.5,18.14L5.5,19.86L19,12L5.5,4.14Z" }));
|
|
4929
4904
|
};
|
|
4930
4905
|
|
|
4931
4906
|
// src/components/InfiniteTable/components/icons/LTEOperatorIcon.tsx
|
|
4932
|
-
var
|
|
4907
|
+
var React22 = __toESM(require("react"));
|
|
4933
4908
|
var LTEOperatorIcon = (props) => {
|
|
4934
|
-
return /* @__PURE__ */
|
|
4909
|
+
return /* @__PURE__ */ React22.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React22.createElement("path", { d: "M18.5,2.27L5,10.14L18.5,18L19.5,16.27L8.97,10.14L19.5,4L18.5,2.27M5,20V22H20V20H5Z" }));
|
|
4935
4910
|
};
|
|
4936
4911
|
|
|
4937
4912
|
// src/components/InfiniteTable/components/icons/LTOperatorIcon.tsx
|
|
4938
|
-
var
|
|
4913
|
+
var React23 = __toESM(require("react"));
|
|
4939
4914
|
var LTOperatorIcon = (props) => {
|
|
4940
|
-
return /* @__PURE__ */
|
|
4915
|
+
return /* @__PURE__ */ React23.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React23.createElement("path", { d: "M18.5,4.14L19.5,5.86L8.97,12L19.5,18.14L18.5,19.86L5,12L18.5,4.14Z" }));
|
|
4941
4916
|
};
|
|
4942
4917
|
|
|
4943
4918
|
// src/components/InfiniteTable/components/icons/NotEqualOperatorIcon.tsx
|
|
4944
|
-
var
|
|
4919
|
+
var React24 = __toESM(require("react"));
|
|
4945
4920
|
var NotEqualOperatorIcon = (props) => {
|
|
4946
|
-
return /* @__PURE__ */
|
|
4921
|
+
return /* @__PURE__ */ React24.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React24.createElement("path", { d: "M21,10H9V8H21V10M21,16H9V14H21V16M4,5H6V16H4V5M6,18V20H4V18H6Z" }));
|
|
4947
4922
|
};
|
|
4948
4923
|
|
|
4949
4924
|
// src/components/InfiniteTable/components/icons/StartsWithOperatorIcon.tsx
|
|
4950
|
-
var
|
|
4925
|
+
var React25 = __toESM(require("react"));
|
|
4951
4926
|
var StartsWithOperatorIcon = (props) => {
|
|
4952
|
-
return /* @__PURE__ */
|
|
4927
|
+
return /* @__PURE__ */ React25.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React25.createElement("path", { d: "M11.14 4L6.43 16H8.36L9.32 13.43H14.67L15.64 16H17.57L12.86 4M12 6.29L14.03 11.71H9.96M4 18V15H2V20H22V18Z" }));
|
|
4953
4928
|
};
|
|
4954
4929
|
|
|
4955
4930
|
// src/components/InfiniteTable/components/FilterEditors.tsx
|
|
4956
|
-
var
|
|
4931
|
+
var React29 = __toESM(require("react"));
|
|
4957
4932
|
|
|
4958
4933
|
// src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableColumnHeaderFilter.tsx
|
|
4959
|
-
var
|
|
4934
|
+
var React28 = __toESM(require("react"));
|
|
4960
4935
|
var import_react20 = require("react");
|
|
4961
4936
|
|
|
4962
4937
|
// src/components/InfiniteTable/hooks/useInfiniteTable.ts
|
|
@@ -4989,7 +4964,7 @@ var useInfiniteTableState = () => {
|
|
|
4989
4964
|
};
|
|
4990
4965
|
|
|
4991
4966
|
// src/components/InfiniteTable/components/icons/FilterIcon.tsx
|
|
4992
|
-
var
|
|
4967
|
+
var React26 = __toESM(require("react"));
|
|
4993
4968
|
var import_react18 = require("react");
|
|
4994
4969
|
|
|
4995
4970
|
// ../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js
|
|
@@ -5163,7 +5138,7 @@ function FilterIcon(props) {
|
|
|
5163
5138
|
return null;
|
|
5164
5139
|
}
|
|
5165
5140
|
const indexStyle = {};
|
|
5166
|
-
return /* @__PURE__ */
|
|
5141
|
+
return /* @__PURE__ */ React26.createElement(
|
|
5167
5142
|
"div",
|
|
5168
5143
|
{
|
|
5169
5144
|
"data-name": "filter-icon",
|
|
@@ -5175,7 +5150,7 @@ function FilterIcon(props) {
|
|
|
5175
5150
|
`${InfiniteTableIconClassName}-sort`
|
|
5176
5151
|
)
|
|
5177
5152
|
},
|
|
5178
|
-
showIndex ? /* @__PURE__ */
|
|
5153
|
+
showIndex ? /* @__PURE__ */ React26.createElement(
|
|
5179
5154
|
"div",
|
|
5180
5155
|
{
|
|
5181
5156
|
"data-name": "index",
|
|
@@ -5184,9 +5159,9 @@ function FilterIcon(props) {
|
|
|
5184
5159
|
},
|
|
5185
5160
|
index
|
|
5186
5161
|
) : null,
|
|
5187
|
-
/* @__PURE__ */
|
|
5188
|
-
/* @__PURE__ */
|
|
5189
|
-
/* @__PURE__ */
|
|
5162
|
+
/* @__PURE__ */ React26.createElement("div", { style: __spreadValues({ width: sizes[0] }, lineStyle) }),
|
|
5163
|
+
/* @__PURE__ */ React26.createElement("div", { style: __spreadValues({ width: sizes[1] }, lineStyle) }),
|
|
5164
|
+
/* @__PURE__ */ React26.createElement("div", { style: __spreadValues({ width: sizes[2] }, lineStyle) })
|
|
5190
5165
|
);
|
|
5191
5166
|
}
|
|
5192
5167
|
|
|
@@ -6245,14 +6220,14 @@ function InfiniteTableColumnHeaderFilter(props) {
|
|
|
6245
6220
|
const FilterEditor = props.filterEditor;
|
|
6246
6221
|
const FilterOperatorSwitch = props.filterOperatorSwitch;
|
|
6247
6222
|
const [focused, setFocused] = (0, import_react20.useState)(false);
|
|
6248
|
-
const onFocus =
|
|
6223
|
+
const onFocus = React28.useCallback(() => {
|
|
6249
6224
|
setFocused(true);
|
|
6250
6225
|
}, []);
|
|
6251
|
-
const onBlur =
|
|
6226
|
+
const onBlur = React28.useCallback(() => {
|
|
6252
6227
|
setFocused(false);
|
|
6253
6228
|
}, []);
|
|
6254
6229
|
const active = filterOperatorMenuVisibleForColumnId === column.id || focused;
|
|
6255
|
-
return /* @__PURE__ */
|
|
6230
|
+
return /* @__PURE__ */ React28.createElement(
|
|
6256
6231
|
"div",
|
|
6257
6232
|
{
|
|
6258
6233
|
onPointerUp: stopPropagation,
|
|
@@ -6266,14 +6241,14 @@ function InfiniteTableColumnHeaderFilter(props) {
|
|
|
6266
6241
|
)}`,
|
|
6267
6242
|
style: { height: props.columnHeaderHeight }
|
|
6268
6243
|
},
|
|
6269
|
-
/* @__PURE__ */
|
|
6244
|
+
/* @__PURE__ */ React28.createElement(InfiniteTableColumnHeaderFilterContext.Provider, { value: props }, /* @__PURE__ */ React28.createElement(FilterOperatorSwitch, null), /* @__PURE__ */ React28.createElement(FilterEditor, null))
|
|
6270
6245
|
);
|
|
6271
6246
|
}
|
|
6272
6247
|
function InfiniteTableFilterOperatorSwitch() {
|
|
6273
6248
|
var _a, _b;
|
|
6274
6249
|
const { columnApi, disabled, operator } = useInfiniteColumnFilterEditor();
|
|
6275
6250
|
const Icon2 = (_b = (_a = operator == null ? void 0 : operator.components) == null ? void 0 : _a.Icon) != null ? _b : FilterIcon;
|
|
6276
|
-
return /* @__PURE__ */
|
|
6251
|
+
return /* @__PURE__ */ React28.createElement(
|
|
6277
6252
|
"div",
|
|
6278
6253
|
{
|
|
6279
6254
|
"data-name": "filter-operator",
|
|
@@ -6291,7 +6266,7 @@ function InfiniteTableFilterOperatorSwitch() {
|
|
|
6291
6266
|
disabled ? `${InfiniteTableColumnHeaderFilterOperatorClassName}--disabled` : ""
|
|
6292
6267
|
)
|
|
6293
6268
|
},
|
|
6294
|
-
/* @__PURE__ */
|
|
6269
|
+
/* @__PURE__ */ React28.createElement(
|
|
6295
6270
|
Icon2,
|
|
6296
6271
|
{
|
|
6297
6272
|
size: 20,
|
|
@@ -6303,7 +6278,7 @@ function InfiniteTableFilterOperatorSwitch() {
|
|
|
6303
6278
|
);
|
|
6304
6279
|
}
|
|
6305
6280
|
function InfiniteTableColumnHeaderFilterEmpty() {
|
|
6306
|
-
return /* @__PURE__ */
|
|
6281
|
+
return /* @__PURE__ */ React28.createElement(
|
|
6307
6282
|
"div",
|
|
6308
6283
|
{
|
|
6309
6284
|
onPointerUp: stopPropagation,
|
|
@@ -6320,7 +6295,7 @@ function useInfiniteColumnFilterEditor() {
|
|
|
6320
6295
|
const context = useInfiniteTable();
|
|
6321
6296
|
const { column, columnApi } = useInfiniteHeaderCell();
|
|
6322
6297
|
const columnLabel = getColumnLabel(column, context);
|
|
6323
|
-
const filterContextValue =
|
|
6298
|
+
const filterContextValue = React28.useContext(
|
|
6324
6299
|
InfiniteTableColumnHeaderFilterContext
|
|
6325
6300
|
);
|
|
6326
6301
|
const { columnFilterType, filterTypes, columnFilterValue } = filterContextValue;
|
|
@@ -6328,17 +6303,17 @@ function useInfiniteColumnFilterEditor() {
|
|
|
6328
6303
|
const [theValue, setTheValue] = (0, import_react20.useState)(
|
|
6329
6304
|
(_a = columnFilterValue == null ? void 0 : columnFilterValue.filter.value) != null ? _a : ""
|
|
6330
6305
|
);
|
|
6331
|
-
const onInputChange =
|
|
6306
|
+
const onInputChange = React28.useCallback(
|
|
6332
6307
|
(filterValue) => {
|
|
6333
6308
|
setTheValue(filterValue);
|
|
6334
6309
|
filterContextValue.onChange(filterValue);
|
|
6335
6310
|
},
|
|
6336
6311
|
[filterContextValue.onChange]
|
|
6337
6312
|
);
|
|
6338
|
-
const clearValue =
|
|
6313
|
+
const clearValue = React28.useCallback(() => {
|
|
6339
6314
|
context.api.clearColumnFilter(column.id);
|
|
6340
6315
|
}, [column.id]);
|
|
6341
|
-
const removeColumnFilter =
|
|
6316
|
+
const removeColumnFilter = React28.useCallback(() => {
|
|
6342
6317
|
context.api.removeColumnFilter(column.id);
|
|
6343
6318
|
}, [column.id]);
|
|
6344
6319
|
(0, import_react20.useEffect)(() => {
|
|
@@ -6381,7 +6356,7 @@ function useInfiniteColumnFilterEditor() {
|
|
|
6381
6356
|
// src/components/InfiniteTable/components/FilterEditors.tsx
|
|
6382
6357
|
function StringFilterEditor() {
|
|
6383
6358
|
const { ariaLabel, value, setValue, className, disabled } = useInfiniteColumnFilterEditor();
|
|
6384
|
-
return /* @__PURE__ */
|
|
6359
|
+
return /* @__PURE__ */ React29.createElement(
|
|
6385
6360
|
"input",
|
|
6386
6361
|
{
|
|
6387
6362
|
"data-xxx": true,
|
|
@@ -6398,7 +6373,7 @@ function StringFilterEditor() {
|
|
|
6398
6373
|
}
|
|
6399
6374
|
function NumberFilterEditor() {
|
|
6400
6375
|
const { ariaLabel, value, setValue, className, disabled } = useInfiniteColumnFilterEditor();
|
|
6401
|
-
return /* @__PURE__ */
|
|
6376
|
+
return /* @__PURE__ */ React29.createElement(
|
|
6402
6377
|
"input",
|
|
6403
6378
|
{
|
|
6404
6379
|
"aria-label": ariaLabel,
|
|
@@ -6639,6 +6614,17 @@ var rafFn = (fn) => {
|
|
|
6639
6614
|
};
|
|
6640
6615
|
|
|
6641
6616
|
// src/components/InfiniteTable/hooks/useDOMProps.ts
|
|
6617
|
+
var publicRuntimeVars = {
|
|
6618
|
+
bodyWidth: { name: stripVar(ThemeVars.runtime.bodyWidth), value: "" },
|
|
6619
|
+
totalVisibleColumnsWidth: {
|
|
6620
|
+
name: stripVar(ThemeVars.runtime.totalVisibleColumnsWidth),
|
|
6621
|
+
value: ""
|
|
6622
|
+
},
|
|
6623
|
+
visibleColumnsCount: {
|
|
6624
|
+
name: stripVar(ThemeVars.runtime.visibleColumnsCount),
|
|
6625
|
+
value: ""
|
|
6626
|
+
}
|
|
6627
|
+
};
|
|
6642
6628
|
var scrollbarWidthHorizontal = stripVar(
|
|
6643
6629
|
InternalVars.scrollbarWidthHorizontal
|
|
6644
6630
|
);
|
|
@@ -6694,6 +6680,7 @@ function useDOMProps(initialDOMProps) {
|
|
|
6694
6680
|
computedPinnedStartColumns,
|
|
6695
6681
|
computedPinnedEndColumns,
|
|
6696
6682
|
computedVisibleColumns,
|
|
6683
|
+
computedUnpinnedColumnsWidth,
|
|
6697
6684
|
scrollbars
|
|
6698
6685
|
} = computed;
|
|
6699
6686
|
const prevPinnedEndCols = [];
|
|
@@ -6719,6 +6706,9 @@ function useDOMProps(initialDOMProps) {
|
|
|
6719
6706
|
},
|
|
6720
6707
|
{}
|
|
6721
6708
|
);
|
|
6709
|
+
cssVars[publicRuntimeVars.bodyWidth.name] = `calc(${InternalVars.bodyWidth} - ${InternalVars.scrollbarWidthVertical})`;
|
|
6710
|
+
cssVars[publicRuntimeVars.totalVisibleColumnsWidth.name] = `${computedPinnedStartColumnsWidth + computedPinnedEndColumnsWidth + computedUnpinnedColumnsWidth}px`;
|
|
6711
|
+
cssVars[publicRuntimeVars.visibleColumnsCount.name] = computedVisibleColumns.length;
|
|
6722
6712
|
if (activeCellIndex != null) {
|
|
6723
6713
|
cssVars[activeCellColWidth] = `var(${getCSSVarNameForColWidth(
|
|
6724
6714
|
activeCellIndex[1]
|
|
@@ -7458,14 +7448,14 @@ var useColumnPointerEvents = ({
|
|
|
7458
7448
|
};
|
|
7459
7449
|
|
|
7460
7450
|
// src/components/InfiniteTable/utils/RenderHookComponentForInfinite.tsx
|
|
7461
|
-
var
|
|
7451
|
+
var React37 = __toESM(require("react"));
|
|
7462
7452
|
|
|
7463
7453
|
// src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableColumnCell.tsx
|
|
7464
|
-
var
|
|
7454
|
+
var React36 = __toESM(require("react"));
|
|
7465
7455
|
var import_react25 = require("react");
|
|
7466
7456
|
|
|
7467
7457
|
// src/components/InfiniteTable/utils/getColumnForGroupBy.tsx
|
|
7468
|
-
var
|
|
7458
|
+
var React32 = __toESM(require("react"));
|
|
7469
7459
|
|
|
7470
7460
|
// src/components/DataSource/state/rowInfoStatus.ts
|
|
7471
7461
|
var showLoadingIcon = (rowInfo) => {
|
|
@@ -7476,7 +7466,7 @@ var showLoadingIcon = (rowInfo) => {
|
|
|
7476
7466
|
};
|
|
7477
7467
|
|
|
7478
7468
|
// src/components/InfiniteTable/components/icons/ExpanderIcon.tsx
|
|
7479
|
-
var
|
|
7469
|
+
var React30 = __toESM(require("react"));
|
|
7480
7470
|
var import_react22 = require("react");
|
|
7481
7471
|
|
|
7482
7472
|
// src/components/InfiniteTable/components/icons/ExpanderIcon.css.ts
|
|
@@ -7497,12 +7487,12 @@ function ExpanderIcon(props) {
|
|
|
7497
7487
|
setExpanded(!expanded);
|
|
7498
7488
|
}
|
|
7499
7489
|
};
|
|
7500
|
-
|
|
7490
|
+
React30.useEffect(() => {
|
|
7501
7491
|
if (isControlled("expanded", props)) {
|
|
7502
7492
|
setExpanded(props.expanded);
|
|
7503
7493
|
}
|
|
7504
7494
|
}, [props.expanded]);
|
|
7505
|
-
return /* @__PURE__ */
|
|
7495
|
+
return /* @__PURE__ */ React30.createElement(
|
|
7506
7496
|
"svg",
|
|
7507
7497
|
{
|
|
7508
7498
|
"data-name": "expander-icon",
|
|
@@ -7525,19 +7515,19 @@ function ExpanderIcon(props) {
|
|
|
7525
7515
|
`InfiniteIcon-expander--${direction === "end" ? "end" : "start"}`
|
|
7526
7516
|
)
|
|
7527
7517
|
},
|
|
7528
|
-
/* @__PURE__ */
|
|
7518
|
+
/* @__PURE__ */ React30.createElement("path", { d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" })
|
|
7529
7519
|
);
|
|
7530
7520
|
}
|
|
7531
7521
|
|
|
7532
7522
|
// src/components/InfiniteTable/components/icons/LoadingIcon.tsx
|
|
7533
|
-
var
|
|
7523
|
+
var React31 = __toESM(require("react"));
|
|
7534
7524
|
|
|
7535
7525
|
// src/components/InfiniteTable/components/icons/LoadingIcon.css.ts
|
|
7536
7526
|
var LoadingIconCls = "utilities_stroke_accentColor__16lm1iwb utilities_flex_none__16lm1iwn utilities_cursor_pointer__16lm1iwi";
|
|
7537
7527
|
|
|
7538
7528
|
// src/components/InfiniteTable/components/icons/LoadingIcon.tsx
|
|
7539
7529
|
var LoadingIcon = (props) => {
|
|
7540
|
-
return /* @__PURE__ */
|
|
7530
|
+
return /* @__PURE__ */ React31.createElement(
|
|
7541
7531
|
"svg",
|
|
7542
7532
|
{
|
|
7543
7533
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -7557,7 +7547,7 @@ var LoadingIcon = (props) => {
|
|
|
7557
7547
|
"InfiniteIcon-loading"
|
|
7558
7548
|
)
|
|
7559
7549
|
},
|
|
7560
|
-
/* @__PURE__ */
|
|
7550
|
+
/* @__PURE__ */ React31.createElement(
|
|
7561
7551
|
"circle",
|
|
7562
7552
|
{
|
|
7563
7553
|
cx: "50",
|
|
@@ -7567,7 +7557,7 @@ var LoadingIcon = (props) => {
|
|
|
7567
7557
|
r: "35",
|
|
7568
7558
|
strokeDasharray: "164.93361431346415 56.97787143782138"
|
|
7569
7559
|
},
|
|
7570
|
-
/* @__PURE__ */
|
|
7560
|
+
/* @__PURE__ */ React31.createElement(
|
|
7571
7561
|
"animateTransform",
|
|
7572
7562
|
{
|
|
7573
7563
|
attributeName: "transform",
|
|
@@ -7612,11 +7602,11 @@ function getGroupColumnRender({
|
|
|
7612
7602
|
);
|
|
7613
7603
|
if (groupRenderStrategy === "multi-column") {
|
|
7614
7604
|
if (groupIndexForColumn + 1 !== groupRowInfo.groupNesting && groupRowInfo.isGroupRow) {
|
|
7615
|
-
return selectionCheckBox ? /* @__PURE__ */
|
|
7605
|
+
return selectionCheckBox ? /* @__PURE__ */ React32.createElement("div", { className }, selectionCheckBox) : null;
|
|
7616
7606
|
}
|
|
7617
7607
|
} else if (groupRenderStrategy === "single-column" && !groupRowInfo.isGroupRow) {
|
|
7618
7608
|
}
|
|
7619
|
-
return /* @__PURE__ */
|
|
7609
|
+
return /* @__PURE__ */ React32.createElement("div", { className }, groupIcon, selectionCheckBox, /* @__PURE__ */ React32.createElement("div", { className: cssEllipsisClassName }, valueToRender != null ? valueToRender : null));
|
|
7620
7610
|
};
|
|
7621
7611
|
}
|
|
7622
7612
|
function getGroupColumnRenderGroupIcon({
|
|
@@ -7665,9 +7655,9 @@ function getGroupColumnRenderGroupIcon({
|
|
|
7665
7655
|
const showExpanderIcon = pivotBy ? (((_b = groupRowInfo.groupKeys) == null ? void 0 : _b.length) || 0) < (groupBy == null ? void 0 : groupBy.length) : (((_c = groupRowInfo.groupKeys) == null ? void 0 : _c.length) || 0) <= (groupBy == null ? void 0 : groupBy.length);
|
|
7666
7656
|
const isLoading = showLoadingIcon(groupRowInfo);
|
|
7667
7657
|
if (isLoading) {
|
|
7668
|
-
icon = /* @__PURE__ */
|
|
7658
|
+
icon = /* @__PURE__ */ React32.createElement(LoadingIcon, null);
|
|
7669
7659
|
} else if (showExpanderIcon) {
|
|
7670
|
-
const defaultIcon = /* @__PURE__ */
|
|
7660
|
+
const defaultIcon = /* @__PURE__ */ React32.createElement(
|
|
7671
7661
|
ExpanderIcon,
|
|
7672
7662
|
{
|
|
7673
7663
|
expanded: !collapsed,
|
|
@@ -7681,7 +7671,7 @@ function getGroupColumnRenderGroupIcon({
|
|
|
7681
7671
|
}
|
|
7682
7672
|
if (initialRenderGroupIcon) {
|
|
7683
7673
|
renderOptions.renderBag.groupIcon = icon;
|
|
7684
|
-
icon = /* @__PURE__ */
|
|
7674
|
+
icon = /* @__PURE__ */ React32.createElement(
|
|
7685
7675
|
RenderCellHookComponent,
|
|
7686
7676
|
{
|
|
7687
7677
|
render: initialRenderGroupIcon,
|
|
@@ -7761,7 +7751,7 @@ var ColumnCellSelectionIndicatorRecipe = createRuntimeFn({ defaultClassName: "ce
|
|
|
7761
7751
|
var SelectionCheckboxCls = "cell_SelectionCheckboxCls__1eexc2a7";
|
|
7762
7752
|
|
|
7763
7753
|
// src/components/InfiniteTable/components/CheckBox.tsx
|
|
7764
|
-
var
|
|
7754
|
+
var React33 = __toESM(require("react"));
|
|
7765
7755
|
var import_react23 = require("react");
|
|
7766
7756
|
|
|
7767
7757
|
// src/components/InfiniteTable/components/CheckBox.css.ts
|
|
@@ -7800,7 +7790,7 @@ function InfiniteCheckBoxComponent() {
|
|
|
7800
7790
|
(0, import_react23.useEffect)(() => {
|
|
7801
7791
|
inputRef.current.indeterminate = checked == null;
|
|
7802
7792
|
}, [checked]);
|
|
7803
|
-
return /* @__PURE__ */
|
|
7793
|
+
return /* @__PURE__ */ React33.createElement(
|
|
7804
7794
|
"input",
|
|
7805
7795
|
__spreadProps(__spreadValues({}, domProps), {
|
|
7806
7796
|
className: join("InfiniteCheckBox", CheckBoxCls, domProps == null ? void 0 : domProps.className),
|
|
@@ -7818,7 +7808,7 @@ function InfiniteCheckBoxComponent() {
|
|
|
7818
7808
|
);
|
|
7819
7809
|
}
|
|
7820
7810
|
function InfiniteCheckBox(props) {
|
|
7821
|
-
return /* @__PURE__ */
|
|
7811
|
+
return /* @__PURE__ */ React33.createElement(InfiniteCheckBoxRoot, __spreadValues({}, props), /* @__PURE__ */ React33.createElement(InfiniteCheckBoxComponent, null));
|
|
7822
7812
|
}
|
|
7823
7813
|
|
|
7824
7814
|
// src/components/InfiniteTable/components/InfiniteTableRow/columnRendering.tsx
|
|
@@ -8129,7 +8119,7 @@ function getFormattedValueContextForCell(options) {
|
|
|
8129
8119
|
}
|
|
8130
8120
|
|
|
8131
8121
|
// src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableCell.tsx
|
|
8132
|
-
var
|
|
8122
|
+
var React34 = __toESM(require("react"));
|
|
8133
8123
|
var { rootClassName: rootClassName5 } = internalProps;
|
|
8134
8124
|
var InfiniteTableCellClassName = `${rootClassName5}Cell`;
|
|
8135
8125
|
var InfiniteTableCellContentClassName = `${rootClassName5}Cell_content`;
|
|
@@ -8188,7 +8178,7 @@ function InfiniteTableCellFn(props) {
|
|
|
8188
8178
|
// ? `${InfiniteTableCellClassName}--shifting ${CellClsVariants.shifting}`
|
|
8189
8179
|
// : '',
|
|
8190
8180
|
),
|
|
8191
|
-
children: /* @__PURE__ */
|
|
8181
|
+
children: /* @__PURE__ */ React34.createElement(React34.Fragment, null, beforeChildren, /* @__PURE__ */ React34.createElement(
|
|
8192
8182
|
"div",
|
|
8193
8183
|
{
|
|
8194
8184
|
className: join(
|
|
@@ -8206,21 +8196,21 @@ function InfiniteTableCellFn(props) {
|
|
|
8206
8196
|
}
|
|
8207
8197
|
const RenderComponent = cellType === "body" ? (_b = column.components) == null ? void 0 : _b.ColumnCell : (_c = column.components) == null ? void 0 : _c.HeaderCell;
|
|
8208
8198
|
if (RenderComponent) {
|
|
8209
|
-
return /* @__PURE__ */
|
|
8199
|
+
return /* @__PURE__ */ React34.createElement(RenderComponent, __spreadValues({}, finalDOMProps));
|
|
8210
8200
|
}
|
|
8211
|
-
return /* @__PURE__ */
|
|
8201
|
+
return /* @__PURE__ */ React34.createElement("div", __spreadProps(__spreadValues({}, finalDOMProps), { ref: domRef }));
|
|
8212
8202
|
}
|
|
8213
|
-
var InfiniteTableCell =
|
|
8203
|
+
var InfiniteTableCell = React34.memo(
|
|
8214
8204
|
InfiniteTableCellFn
|
|
8215
8205
|
);
|
|
8216
8206
|
|
|
8217
8207
|
// src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableColumnEditor.tsx
|
|
8218
|
-
var
|
|
8208
|
+
var React35 = __toESM(require("react"));
|
|
8219
8209
|
var import_react24 = require("react");
|
|
8220
8210
|
function InfiniteTableColumnEditor() {
|
|
8221
8211
|
const { initialValue, setValue, confirmEdit, cancelEdit, readOnly } = useInfiniteColumnEditor();
|
|
8222
8212
|
const domRef = (0, import_react24.useRef)();
|
|
8223
|
-
const refCallback =
|
|
8213
|
+
const refCallback = React35.useCallback((node) => {
|
|
8224
8214
|
domRef.current = node;
|
|
8225
8215
|
if (node) {
|
|
8226
8216
|
node.focus();
|
|
@@ -8236,7 +8226,7 @@ function InfiniteTableColumnEditor() {
|
|
|
8236
8226
|
event.stopPropagation();
|
|
8237
8227
|
}
|
|
8238
8228
|
}, []);
|
|
8239
|
-
return /* @__PURE__ */
|
|
8229
|
+
return /* @__PURE__ */ React35.createElement(React35.Fragment, null, /* @__PURE__ */ React35.createElement(
|
|
8240
8230
|
"input",
|
|
8241
8231
|
{
|
|
8242
8232
|
readOnly,
|
|
@@ -8256,11 +8246,11 @@ function InfiniteTableColumnEditor() {
|
|
|
8256
8246
|
// src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableColumnCell.tsx
|
|
8257
8247
|
var { rootClassName: rootClassName6 } = internalProps;
|
|
8258
8248
|
var columnZIndexAtIndex4 = stripVar(InternalVars.columnZIndexAtIndex);
|
|
8259
|
-
var InfiniteTableColumnCellContext =
|
|
8249
|
+
var InfiniteTableColumnCellContext = React36.createContext(null);
|
|
8260
8250
|
var InfiniteTableColumnCellClassName = `${rootClassName6}ColumnCell`;
|
|
8261
8251
|
var defaultRenderRowDetailIcon = (params) => {
|
|
8262
8252
|
const { toggleCurrentRowDetails, rowDetailState } = params;
|
|
8263
|
-
return /* @__PURE__ */
|
|
8253
|
+
return /* @__PURE__ */ React36.createElement(
|
|
8264
8254
|
ExpanderIcon,
|
|
8265
8255
|
{
|
|
8266
8256
|
style: {
|
|
@@ -8281,7 +8271,7 @@ var defaultRenderSelectionCheckBox = (params) => {
|
|
|
8281
8271
|
} = params;
|
|
8282
8272
|
if (rowInfo.isGroupRow && !column.groupByForColumn) {
|
|
8283
8273
|
}
|
|
8284
|
-
return /* @__PURE__ */
|
|
8274
|
+
return /* @__PURE__ */ React36.createElement(
|
|
8285
8275
|
InfiniteCheckBox,
|
|
8286
8276
|
{
|
|
8287
8277
|
domProps: {
|
|
@@ -8333,7 +8323,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8333
8323
|
showZebraRows
|
|
8334
8324
|
} = props;
|
|
8335
8325
|
if (!column) {
|
|
8336
|
-
return /* @__PURE__ */
|
|
8326
|
+
return /* @__PURE__ */ React36.createElement("div", { ref: domRef }, "no column");
|
|
8337
8327
|
}
|
|
8338
8328
|
const { rowSelected } = rowInfo;
|
|
8339
8329
|
const {
|
|
@@ -8380,7 +8370,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8380
8370
|
} = colRenderingParams;
|
|
8381
8371
|
const { align: align2, verticalAlign } = renderParams;
|
|
8382
8372
|
const renderParam = renderParams;
|
|
8383
|
-
const renderParamRef =
|
|
8373
|
+
const renderParamRef = React36.useRef(renderParam);
|
|
8384
8374
|
const onClick = (0, import_react25.useCallback)(
|
|
8385
8375
|
(event) => {
|
|
8386
8376
|
const colIndex = column.computedVisibleIndex;
|
|
@@ -8434,7 +8424,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8434
8424
|
[rowInfo]
|
|
8435
8425
|
);
|
|
8436
8426
|
const EditorComponent = (_b = (_a = column.components) == null ? void 0 : _a.Editor) != null ? _b : InfiniteTableColumnEditor;
|
|
8437
|
-
const editor = inEdit ? /* @__PURE__ */
|
|
8427
|
+
const editor = inEdit ? /* @__PURE__ */ React36.createElement(CellEditorContextComponent, { contextValue: renderParam }, /* @__PURE__ */ React36.createElement(EditorComponent, null)) : null;
|
|
8438
8428
|
const renderChildren = (0, import_react25.useCallback)(
|
|
8439
8429
|
once(() => {
|
|
8440
8430
|
if (hidden) {
|
|
@@ -8444,7 +8434,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8444
8434
|
return null;
|
|
8445
8435
|
}
|
|
8446
8436
|
if (renderFunctions.renderGroupIcon) {
|
|
8447
|
-
renderParam.renderBag.groupIcon = /* @__PURE__ */
|
|
8437
|
+
renderParam.renderBag.groupIcon = /* @__PURE__ */ React36.createElement(
|
|
8448
8438
|
RenderCellHookComponent,
|
|
8449
8439
|
{
|
|
8450
8440
|
render: renderFunctions.renderGroupIcon,
|
|
@@ -8455,7 +8445,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8455
8445
|
);
|
|
8456
8446
|
}
|
|
8457
8447
|
if (renderFunctions.renderSelectionCheckBox && selectionMode == "multi-row") {
|
|
8458
|
-
renderParam.renderBag.selectionCheckBox = /* @__PURE__ */
|
|
8448
|
+
renderParam.renderBag.selectionCheckBox = /* @__PURE__ */ React36.createElement(
|
|
8459
8449
|
RenderCellHookComponent,
|
|
8460
8450
|
{
|
|
8461
8451
|
render: defaultRenderSelectionCheckBox,
|
|
@@ -8463,7 +8453,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8463
8453
|
}
|
|
8464
8454
|
);
|
|
8465
8455
|
if (renderFunctions.renderSelectionCheckBox !== true) {
|
|
8466
|
-
renderParam.renderBag.selectionCheckBox = /* @__PURE__ */
|
|
8456
|
+
renderParam.renderBag.selectionCheckBox = /* @__PURE__ */ React36.createElement(
|
|
8467
8457
|
RenderCellHookComponent,
|
|
8468
8458
|
{
|
|
8469
8459
|
render: renderFunctions.renderSelectionCheckBox,
|
|
@@ -8475,7 +8465,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8475
8465
|
}
|
|
8476
8466
|
}
|
|
8477
8467
|
if (renderFunctions.renderRowDetailIcon) {
|
|
8478
|
-
renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */
|
|
8468
|
+
renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */ React36.createElement(
|
|
8479
8469
|
RenderCellHookComponent,
|
|
8480
8470
|
{
|
|
8481
8471
|
render: defaultRenderRowDetailIcon,
|
|
@@ -8485,7 +8475,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8485
8475
|
}
|
|
8486
8476
|
);
|
|
8487
8477
|
if (typeof renderFunctions.renderRowDetailIcon === "function") {
|
|
8488
|
-
renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */
|
|
8478
|
+
renderParam.renderBag.rowDetailsIcon = /* @__PURE__ */ React36.createElement(
|
|
8489
8479
|
RenderCellHookComponent,
|
|
8490
8480
|
{
|
|
8491
8481
|
render: renderFunctions.renderRowDetailIcon,
|
|
@@ -8497,7 +8487,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8497
8487
|
}
|
|
8498
8488
|
}
|
|
8499
8489
|
if (renderFunctions.renderValue) {
|
|
8500
|
-
renderParam.renderBag.value = /* @__PURE__ */
|
|
8490
|
+
renderParam.renderBag.value = /* @__PURE__ */ React36.createElement(
|
|
8501
8491
|
RenderCellHookComponent,
|
|
8502
8492
|
{
|
|
8503
8493
|
render: renderFunctions.renderValue,
|
|
@@ -8508,7 +8498,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8508
8498
|
);
|
|
8509
8499
|
}
|
|
8510
8500
|
if (rowInfo.isGroupRow && renderFunctions.renderGroupValue) {
|
|
8511
|
-
renderParam.renderBag.value = /* @__PURE__ */
|
|
8501
|
+
renderParam.renderBag.value = /* @__PURE__ */ React36.createElement(
|
|
8512
8502
|
RenderCellHookComponent,
|
|
8513
8503
|
{
|
|
8514
8504
|
render: renderFunctions.renderGroupValue,
|
|
@@ -8519,7 +8509,7 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8519
8509
|
);
|
|
8520
8510
|
}
|
|
8521
8511
|
if (!rowInfo.isGroupRow && renderFunctions.renderLeafValue) {
|
|
8522
|
-
renderParam.renderBag.value = /* @__PURE__ */
|
|
8512
|
+
renderParam.renderBag.value = /* @__PURE__ */ React36.createElement(
|
|
8523
8513
|
RenderCellHookComponent,
|
|
8524
8514
|
{
|
|
8525
8515
|
render: renderFunctions.renderLeafValue,
|
|
@@ -8534,9 +8524,9 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8534
8524
|
if (valueToRender instanceof Date) {
|
|
8535
8525
|
valueToRender = valueToRender.toLocaleDateString();
|
|
8536
8526
|
}
|
|
8537
|
-
const all = /* @__PURE__ */
|
|
8527
|
+
const all = /* @__PURE__ */ React36.createElement(React36.Fragment, null, align2 !== "end" ? renderParam.renderBag.groupIcon : null, align2 !== "end" ? renderParam.renderBag.rowDetailsIcon : null, align2 !== "end" ? renderParam.renderBag.selectionCheckBox : null, valueToRender, align2 === "end" ? renderParam.renderBag.selectionCheckBox : null, align2 === "end" ? renderParam.renderBag.rowDetailsIcon : null, align2 === "end" ? renderParam.renderBag.groupIcon : null);
|
|
8538
8528
|
if (column.render) {
|
|
8539
|
-
return /* @__PURE__ */
|
|
8529
|
+
return /* @__PURE__ */ React36.createElement(
|
|
8540
8530
|
RenderCellHookComponent,
|
|
8541
8531
|
{
|
|
8542
8532
|
render: column.render,
|
|
@@ -8698,16 +8688,16 @@ function InfiniteTableColumnCellFn(props) {
|
|
|
8698
8688
|
return (
|
|
8699
8689
|
// this context is here for supporting useInfiniteColumnCell to be used
|
|
8700
8690
|
// with a custom column component, specified via column.components.ColumnCell
|
|
8701
|
-
/* @__PURE__ */
|
|
8691
|
+
/* @__PURE__ */ React36.createElement(
|
|
8702
8692
|
ContextProvider,
|
|
8703
8693
|
{
|
|
8704
8694
|
value: renderParamRef.current
|
|
8705
8695
|
},
|
|
8706
|
-
/* @__PURE__ */
|
|
8696
|
+
/* @__PURE__ */ React36.createElement(InfiniteTableCell, __spreadValues({}, cellProps))
|
|
8707
8697
|
)
|
|
8708
8698
|
);
|
|
8709
8699
|
}
|
|
8710
|
-
var InfiniteTableColumnCell =
|
|
8700
|
+
var InfiniteTableColumnCell = React36.memo(
|
|
8711
8701
|
InfiniteTableColumnCellFn
|
|
8712
8702
|
);
|
|
8713
8703
|
function useInfiniteColumnCell() {
|
|
@@ -8722,14 +8712,14 @@ function useInfiniteColumnEditor() {
|
|
|
8722
8712
|
state: { editingValueRef, editingCell }
|
|
8723
8713
|
} = useInfiniteTable();
|
|
8724
8714
|
const { column, rowInfo } = useInfiniteColumnCell();
|
|
8725
|
-
const [initialValue] =
|
|
8726
|
-
const [currentValue, setCurrentValue] =
|
|
8715
|
+
const [initialValue] = React36.useState(() => editingCell == null ? void 0 : editingCell.value);
|
|
8716
|
+
const [currentValue, setCurrentValue] = React36.useState(initialValue);
|
|
8727
8717
|
const readOnly = editingCell ? !editingCell.active && !!editingCell.waiting : false;
|
|
8728
|
-
const setValue =
|
|
8718
|
+
const setValue = React36.useCallback((value) => {
|
|
8729
8719
|
editingValueRef.current = value;
|
|
8730
8720
|
setCurrentValue(value);
|
|
8731
8721
|
}, []);
|
|
8732
|
-
|
|
8722
|
+
React36.useLayoutEffect(() => {
|
|
8733
8723
|
editingValueRef.current = initialValue;
|
|
8734
8724
|
}, []);
|
|
8735
8725
|
const confirmEdit = api.confirmEdit;
|
|
@@ -8758,7 +8748,7 @@ function RenderHookComponent(props) {
|
|
|
8758
8748
|
// src/components/InfiniteTable/utils/RenderHookComponentForInfinite.tsx
|
|
8759
8749
|
function RenderCellHookComponent(props) {
|
|
8760
8750
|
const ContextProvider = InfiniteTableColumnCellContext.Provider;
|
|
8761
|
-
return /* @__PURE__ */
|
|
8751
|
+
return /* @__PURE__ */ React37.createElement(ContextProvider, { value: props.renderParam }, /* @__PURE__ */ React37.createElement(
|
|
8762
8752
|
RenderHookComponent,
|
|
8763
8753
|
{
|
|
8764
8754
|
render: props.render,
|
|
@@ -8768,11 +8758,11 @@ function RenderCellHookComponent(props) {
|
|
|
8768
8758
|
}
|
|
8769
8759
|
function CellEditorContextComponent(props) {
|
|
8770
8760
|
const ContextProvider = InfiniteTableColumnCellContext.Provider;
|
|
8771
|
-
return /* @__PURE__ */
|
|
8761
|
+
return /* @__PURE__ */ React37.createElement(ContextProvider, { value: props.contextValue }, props.children);
|
|
8772
8762
|
}
|
|
8773
8763
|
function RenderHeaderCellHookComponent(props) {
|
|
8774
8764
|
const ContextProvider = InfiniteTableHeaderCellContext.Provider;
|
|
8775
|
-
return /* @__PURE__ */
|
|
8765
|
+
return /* @__PURE__ */ React37.createElement(ContextProvider, { value: props.renderParam }, /* @__PURE__ */ React37.createElement(
|
|
8776
8766
|
RenderHookComponent,
|
|
8777
8767
|
{
|
|
8778
8768
|
render: props.render,
|
|
@@ -8782,7 +8772,7 @@ function RenderHeaderCellHookComponent(props) {
|
|
|
8782
8772
|
}
|
|
8783
8773
|
|
|
8784
8774
|
// src/components/InfiniteTable/components/icons/MenuIcon.tsx
|
|
8785
|
-
var
|
|
8775
|
+
var React38 = __toESM(require("react"));
|
|
8786
8776
|
var defaultLineStyle2 = {
|
|
8787
8777
|
width: "100%",
|
|
8788
8778
|
pointerEvents: "none"
|
|
@@ -8806,7 +8796,7 @@ function MenuIcon(props) {
|
|
|
8806
8796
|
const lineStyle = __spreadValues(__spreadProps(__spreadValues({}, defaultLineStyle2), {
|
|
8807
8797
|
borderTop: `${ThemeVars.components.HeaderCell.menuIconLineWidth} solid currentColor`
|
|
8808
8798
|
}), props.lineStyle);
|
|
8809
|
-
return /* @__PURE__ */
|
|
8799
|
+
return /* @__PURE__ */ React38.createElement(
|
|
8810
8800
|
"div",
|
|
8811
8801
|
__spreadProps(__spreadValues(__spreadProps(__spreadValues({}, domProps), {
|
|
8812
8802
|
style: style2
|
|
@@ -8822,12 +8812,12 @@ function MenuIcon(props) {
|
|
|
8822
8812
|
`${InfiniteTableIconClassName}-menu`
|
|
8823
8813
|
)
|
|
8824
8814
|
}),
|
|
8825
|
-
children != null ? children : /* @__PURE__ */
|
|
8815
|
+
children != null ? children : /* @__PURE__ */ React38.createElement(React38.Fragment, null, /* @__PURE__ */ React38.createElement("div", { className: lineClassName, style: lineStyle }), /* @__PURE__ */ React38.createElement("div", { className: lineClassName, style: lineStyle }), /* @__PURE__ */ React38.createElement("div", { className: lineClassName, style: lineStyle }))
|
|
8826
8816
|
);
|
|
8827
8817
|
}
|
|
8828
8818
|
|
|
8829
8819
|
// src/components/InfiniteTable/components/icons/SortIcon.tsx
|
|
8830
|
-
var
|
|
8820
|
+
var React39 = __toESM(require("react"));
|
|
8831
8821
|
var import_react26 = require("react");
|
|
8832
8822
|
|
|
8833
8823
|
// src/components/InfiniteTable/components/icons/SortIcon.css.ts
|
|
@@ -8886,7 +8876,7 @@ function SortIcon(props) {
|
|
|
8886
8876
|
if (direction === -1) {
|
|
8887
8877
|
indexStyle.top = "100%";
|
|
8888
8878
|
}
|
|
8889
|
-
return /* @__PURE__ */
|
|
8879
|
+
return /* @__PURE__ */ React39.createElement(
|
|
8890
8880
|
"div",
|
|
8891
8881
|
{
|
|
8892
8882
|
"data-name": "sort-icon",
|
|
@@ -8898,7 +8888,7 @@ function SortIcon(props) {
|
|
|
8898
8888
|
`${InfiniteTableIconClassName}-sort`
|
|
8899
8889
|
)
|
|
8900
8890
|
},
|
|
8901
|
-
showIndex ? /* @__PURE__ */
|
|
8891
|
+
showIndex ? /* @__PURE__ */ React39.createElement(
|
|
8902
8892
|
"div",
|
|
8903
8893
|
{
|
|
8904
8894
|
"data-name": "index",
|
|
@@ -8907,25 +8897,25 @@ function SortIcon(props) {
|
|
|
8907
8897
|
},
|
|
8908
8898
|
index
|
|
8909
8899
|
) : null,
|
|
8910
|
-
/* @__PURE__ */
|
|
8900
|
+
/* @__PURE__ */ React39.createElement(
|
|
8911
8901
|
"div",
|
|
8912
8902
|
{
|
|
8913
8903
|
style: __spreadValues({ width: sizes[0] }, lineStyle),
|
|
8914
8904
|
onTransitionEnd
|
|
8915
8905
|
}
|
|
8916
8906
|
),
|
|
8917
|
-
/* @__PURE__ */
|
|
8918
|
-
/* @__PURE__ */
|
|
8907
|
+
/* @__PURE__ */ React39.createElement("div", { style: __spreadValues({ width: sizes[1] }, lineStyle) }),
|
|
8908
|
+
/* @__PURE__ */ React39.createElement("div", { style: __spreadValues({ width: sizes[2] }, lineStyle) })
|
|
8919
8909
|
);
|
|
8920
8910
|
}
|
|
8921
8911
|
|
|
8922
8912
|
// src/components/InfiniteTable/components/InfiniteTableHeader/useColumnResizeHandle.tsx
|
|
8923
|
-
var
|
|
8913
|
+
var React41 = __toESM(require("react"));
|
|
8924
8914
|
var import_react28 = require("react");
|
|
8925
8915
|
|
|
8926
8916
|
// src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/index.tsx
|
|
8927
8917
|
var import_react27 = require("react");
|
|
8928
|
-
var
|
|
8918
|
+
var React40 = __toESM(require("react"));
|
|
8929
8919
|
|
|
8930
8920
|
// src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/columnResizer.ts
|
|
8931
8921
|
function getColumnResizer(colIndex, {
|
|
@@ -9100,7 +9090,7 @@ function ResizeHandleFn(props) {
|
|
|
9100
9090
|
right: computedPinned === "start" ? void 0 : 0
|
|
9101
9091
|
//ThemeVars.components.HeaderCell.resizeHandleWidth,
|
|
9102
9092
|
} : computedPinned === "end" && computedFirstInCategory ? { right: void 0 } : void 0;
|
|
9103
|
-
return /* @__PURE__ */
|
|
9093
|
+
return /* @__PURE__ */ React40.createElement(
|
|
9104
9094
|
"div",
|
|
9105
9095
|
{
|
|
9106
9096
|
ref: domRef,
|
|
@@ -9113,7 +9103,7 @@ function ResizeHandleFn(props) {
|
|
|
9113
9103
|
)}`,
|
|
9114
9104
|
onPointerDown
|
|
9115
9105
|
},
|
|
9116
|
-
/* @__PURE__ */
|
|
9106
|
+
/* @__PURE__ */ React40.createElement(
|
|
9117
9107
|
"div",
|
|
9118
9108
|
{
|
|
9119
9109
|
style: style2,
|
|
@@ -9127,7 +9117,7 @@ function ResizeHandleFn(props) {
|
|
|
9127
9117
|
)
|
|
9128
9118
|
);
|
|
9129
9119
|
}
|
|
9130
|
-
var ResizeHandle =
|
|
9120
|
+
var ResizeHandle = React40.memo(ResizeHandleFn);
|
|
9131
9121
|
|
|
9132
9122
|
// src/components/InfiniteTable/components/InfiniteTableHeader/useColumnResizeHandle.tsx
|
|
9133
9123
|
function useColumnResizeHandle(column) {
|
|
@@ -9191,7 +9181,7 @@ function useColumnResizeHandle(column) {
|
|
|
9191
9181
|
},
|
|
9192
9182
|
[computeResizeForDiff]
|
|
9193
9183
|
);
|
|
9194
|
-
const resizeHandle = column.computedResizable ? /* @__PURE__ */
|
|
9184
|
+
const resizeHandle = column.computedResizable ? /* @__PURE__ */ React41.createElement(
|
|
9195
9185
|
ResizeHandle,
|
|
9196
9186
|
{
|
|
9197
9187
|
columns: computedVisibleColumns,
|
|
@@ -9210,7 +9200,7 @@ var InfiniteTableHeaderCellClassName = `${rootClassName2}HeaderCell`;
|
|
|
9210
9200
|
var defaultRenderSelectionCheckBox2 = (params) => {
|
|
9211
9201
|
const { allRowsSelected, someRowsSelected, api } = params;
|
|
9212
9202
|
const selected = allRowsSelected ? true : someRowsSelected ? null : false;
|
|
9213
|
-
return /* @__PURE__ */
|
|
9203
|
+
return /* @__PURE__ */ React42.createElement(
|
|
9214
9204
|
InfiniteCheckBox,
|
|
9215
9205
|
{
|
|
9216
9206
|
domProps: {
|
|
@@ -9227,9 +9217,9 @@ var defaultRenderSelectionCheckBox2 = (params) => {
|
|
|
9227
9217
|
}
|
|
9228
9218
|
);
|
|
9229
9219
|
};
|
|
9230
|
-
var InfiniteTableHeaderCellContext =
|
|
9220
|
+
var InfiniteTableHeaderCellContext = React42.createContext(null);
|
|
9231
9221
|
var columnZIndexAtIndex5 = stripVar(InternalVars.columnZIndexAtIndex);
|
|
9232
|
-
var spacer = /* @__PURE__ */
|
|
9222
|
+
var spacer = /* @__PURE__ */ React42.createElement("div", { className: flex["1"] });
|
|
9233
9223
|
var InfiniteHeaderCellDataAttributes = keyMirror({
|
|
9234
9224
|
"data-name": ``,
|
|
9235
9225
|
"data-field": ``,
|
|
@@ -9266,7 +9256,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9266
9256
|
const dragging = columnReorderDragColumnId === column.id;
|
|
9267
9257
|
const { onResize, height, width, headerOptions, columnsMap } = props;
|
|
9268
9258
|
const sortInfo = column.computedSortInfo;
|
|
9269
|
-
|
|
9259
|
+
const header = column.header;
|
|
9270
9260
|
const ref = (0, import_react29.useCallback)(
|
|
9271
9261
|
(node) => {
|
|
9272
9262
|
var _a2;
|
|
@@ -9290,7 +9280,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9290
9280
|
getState
|
|
9291
9281
|
});
|
|
9292
9282
|
const computedSortable = columnApi.isSortable();
|
|
9293
|
-
const sortIcon = computedSortable && (column.computedSorted || alwaysShow) ? /* @__PURE__ */
|
|
9283
|
+
const sortIcon = computedSortable && (column.computedSorted || alwaysShow) ? /* @__PURE__ */ React42.createElement(
|
|
9294
9284
|
SortIcon,
|
|
9295
9285
|
{
|
|
9296
9286
|
index: column.computedMultiSort ? column.computedSortIndex + 1 : void 0,
|
|
@@ -9307,7 +9297,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9307
9297
|
}
|
|
9308
9298
|
) : null;
|
|
9309
9299
|
const filtered = column.computedFilterable && column.computedFiltered;
|
|
9310
|
-
const filterIcon = filtered ? /* @__PURE__ */
|
|
9300
|
+
const filterIcon = filtered ? /* @__PURE__ */ React42.createElement(FilterIcon, null) : null;
|
|
9311
9301
|
const headerCSSEllipsis = (_e = (_d = column.headerCssEllipsis) != null ? _d : column.cssEllipsis) != null ? _e : true;
|
|
9312
9302
|
const menuIconProps = {
|
|
9313
9303
|
reserveSpaceWhenHidden: align2 === "center",
|
|
@@ -9327,7 +9317,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9327
9317
|
}
|
|
9328
9318
|
};
|
|
9329
9319
|
const MenuIconCmp = ((_f = column.components) == null ? void 0 : _f.MenuIcon) || (components2 == null ? void 0 : components2.MenuIcon) || MenuIcon;
|
|
9330
|
-
const menuIcon = /* @__PURE__ */
|
|
9320
|
+
const menuIcon = /* @__PURE__ */ React42.createElement(MenuIconCmp, __spreadValues({}, menuIconProps));
|
|
9331
9321
|
const initialRenderParam = {
|
|
9332
9322
|
dragging,
|
|
9333
9323
|
domRef: ref,
|
|
@@ -9358,7 +9348,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9358
9348
|
renderBag: __spreadValues({}, initialRenderParam.renderBag)
|
|
9359
9349
|
});
|
|
9360
9350
|
if (column.renderSortIcon) {
|
|
9361
|
-
renderParam2.renderBag.sortIcon = /* @__PURE__ */
|
|
9351
|
+
renderParam2.renderBag.sortIcon = /* @__PURE__ */ React42.createElement(
|
|
9362
9352
|
RenderHeaderCellHookComponent,
|
|
9363
9353
|
{
|
|
9364
9354
|
render: column.renderSortIcon,
|
|
@@ -9369,7 +9359,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9369
9359
|
);
|
|
9370
9360
|
}
|
|
9371
9361
|
if (column.renderFilterIcon) {
|
|
9372
|
-
renderParam2.renderBag.filterIcon = /* @__PURE__ */
|
|
9362
|
+
renderParam2.renderBag.filterIcon = /* @__PURE__ */ React42.createElement(
|
|
9373
9363
|
RenderHeaderCellHookComponent,
|
|
9374
9364
|
{
|
|
9375
9365
|
render: column.renderFilterIcon,
|
|
@@ -9380,7 +9370,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9380
9370
|
);
|
|
9381
9371
|
}
|
|
9382
9372
|
if (typeof column.renderMenuIcon === "function") {
|
|
9383
|
-
renderParam2.renderBag.menuIcon = /* @__PURE__ */
|
|
9373
|
+
renderParam2.renderBag.menuIcon = /* @__PURE__ */ React42.createElement(
|
|
9384
9374
|
RenderHeaderCellHookComponent,
|
|
9385
9375
|
{
|
|
9386
9376
|
render: (param) => {
|
|
@@ -9392,7 +9382,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9392
9382
|
if (result.type === MenuIconCmp || result.type === MenuIcon) {
|
|
9393
9383
|
return result;
|
|
9394
9384
|
}
|
|
9395
|
-
return /* @__PURE__ */
|
|
9385
|
+
return /* @__PURE__ */ React42.createElement(MenuIconCmp, __spreadValues({}, menuIconProps), result);
|
|
9396
9386
|
}
|
|
9397
9387
|
return null;
|
|
9398
9388
|
},
|
|
@@ -9403,7 +9393,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9403
9393
|
);
|
|
9404
9394
|
}
|
|
9405
9395
|
if (column.renderSelectionCheckBox && selectionMode === "multi-row") {
|
|
9406
|
-
renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */
|
|
9396
|
+
renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */ React42.createElement(
|
|
9407
9397
|
RenderHeaderCellHookComponent,
|
|
9408
9398
|
{
|
|
9409
9399
|
render: defaultRenderSelectionCheckBox2,
|
|
@@ -9414,7 +9404,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9414
9404
|
);
|
|
9415
9405
|
const renderHeaderSelectionCheckBox = (_a2 = column.renderHeaderSelectionCheckBox) != null ? _a2 : column.renderSelectionCheckBox;
|
|
9416
9406
|
if (renderHeaderSelectionCheckBox && renderHeaderSelectionCheckBox !== true) {
|
|
9417
|
-
renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */
|
|
9407
|
+
renderParam2.renderBag.selectionCheckBox = /* @__PURE__ */ React42.createElement(
|
|
9418
9408
|
RenderHeaderCellHookComponent,
|
|
9419
9409
|
{
|
|
9420
9410
|
render: renderHeaderSelectionCheckBox,
|
|
@@ -9426,7 +9416,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9426
9416
|
}
|
|
9427
9417
|
}
|
|
9428
9418
|
if (header instanceof Function) {
|
|
9429
|
-
renderParam2.renderBag.header = /* @__PURE__ */
|
|
9419
|
+
renderParam2.renderBag.header = /* @__PURE__ */ React42.createElement(
|
|
9430
9420
|
RenderHeaderCellHookComponent,
|
|
9431
9421
|
{
|
|
9432
9422
|
render: header,
|
|
@@ -9437,10 +9427,10 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9437
9427
|
);
|
|
9438
9428
|
}
|
|
9439
9429
|
const theMenuIcon = column.renderMenuIcon === false ? null : renderParam2.renderBag.menuIcon;
|
|
9440
|
-
const headerContent = headerCSSEllipsis ? /* @__PURE__ */
|
|
9441
|
-
const all = /* @__PURE__ */
|
|
9430
|
+
const headerContent = headerCSSEllipsis ? /* @__PURE__ */ React42.createElement("div", { className: cssEllipsisClassName }, renderParam2.renderBag.header) : renderParam2.renderBag.header;
|
|
9431
|
+
const all = /* @__PURE__ */ React42.createElement(React42.Fragment, null, align2 === "center" ? spacer : null, renderParam2.renderBag.selectionCheckBox, headerContent, renderParam2.renderBag.sortIcon, renderParam2.renderBag.filterIcon, align2 === "center" ? spacer : null, align2 !== "center" ? spacer : null, theMenuIcon);
|
|
9442
9432
|
if (column.renderHeader) {
|
|
9443
|
-
return /* @__PURE__ */
|
|
9433
|
+
return /* @__PURE__ */ React42.createElement(
|
|
9444
9434
|
RenderHeaderCellHookComponent,
|
|
9445
9435
|
{
|
|
9446
9436
|
render: column.renderHeader,
|
|
@@ -9477,7 +9467,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9477
9467
|
});
|
|
9478
9468
|
let draggingProxy = null;
|
|
9479
9469
|
if (dragging && proxyPosition) {
|
|
9480
|
-
draggingProxy = /* @__PURE__ */
|
|
9470
|
+
draggingProxy = /* @__PURE__ */ React42.createElement(
|
|
9481
9471
|
"div",
|
|
9482
9472
|
{
|
|
9483
9473
|
key: column.id,
|
|
@@ -9501,7 +9491,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9501
9491
|
verticalAlign,
|
|
9502
9492
|
align: align2
|
|
9503
9493
|
};
|
|
9504
|
-
const debouncedOnFilterValueChange =
|
|
9494
|
+
const debouncedOnFilterValueChange = React42.useMemo(() => {
|
|
9505
9495
|
const fn = (filterValue) => {
|
|
9506
9496
|
api.setColumnFilter(column.id, filterValue);
|
|
9507
9497
|
};
|
|
@@ -9527,7 +9517,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9527
9517
|
"data-sort": column.computedSortedAsc ? "asc" : column.computedSortedDesc ? "desc" : "none",
|
|
9528
9518
|
"data-sort-index": `${(_p = column.computedSortIndex) != null ? _p : -1}`
|
|
9529
9519
|
};
|
|
9530
|
-
return /* @__PURE__ */
|
|
9520
|
+
return /* @__PURE__ */ React42.createElement(ContextProvider, { value: renderParam }, /* @__PURE__ */ React42.createElement(
|
|
9531
9521
|
InfiniteTableCell,
|
|
9532
9522
|
__spreadProps(__spreadValues({
|
|
9533
9523
|
domRef: ref,
|
|
@@ -9569,7 +9559,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9569
9559
|
CellCls
|
|
9570
9560
|
),
|
|
9571
9561
|
cssEllipsis: headerCSSEllipsis,
|
|
9572
|
-
afterChildren: /* @__PURE__ */
|
|
9562
|
+
afterChildren: /* @__PURE__ */ React42.createElement(React42.Fragment, null, showColumnFilters ? column.computedFilterable ? /* @__PURE__ */ React42.createElement(
|
|
9573
9563
|
InfiniteTableColumnHeaderFilter,
|
|
9574
9564
|
{
|
|
9575
9565
|
filterEditor: FilterEditor,
|
|
@@ -9582,7 +9572,7 @@ function InfiniteTableHeaderCell(props) {
|
|
|
9582
9572
|
columnFilterValue: column.computedFilterValue,
|
|
9583
9573
|
columnHeaderHeight
|
|
9584
9574
|
}
|
|
9585
|
-
) : /* @__PURE__ */
|
|
9575
|
+
) : /* @__PURE__ */ React42.createElement(InfiniteTableColumnHeaderFilterEmpty, null) : null, resizeHandle),
|
|
9586
9576
|
renderChildren
|
|
9587
9577
|
})
|
|
9588
9578
|
), draggingProxy);
|
|
@@ -9595,7 +9585,7 @@ function useInfiniteHeaderCell() {
|
|
|
9595
9585
|
}
|
|
9596
9586
|
|
|
9597
9587
|
// src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeaderWrapper.tsx
|
|
9598
|
-
var
|
|
9588
|
+
var React47 = __toESM(require("react"));
|
|
9599
9589
|
|
|
9600
9590
|
// src/components/InfiniteTable/components/InfiniteTableHeader/buildColumnAndGroupTree.ts
|
|
9601
9591
|
function buildColumnAndGroupTree(columns, columnGroups, columnGroupsDepthsMap, columnGroupsMaxDepth) {
|
|
@@ -9701,19 +9691,19 @@ function assignGroupOffsetsAndComputedWidths(items, groupOffset = 0) {
|
|
|
9701
9691
|
}
|
|
9702
9692
|
|
|
9703
9693
|
// src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeader.tsx
|
|
9704
|
-
var
|
|
9694
|
+
var React46 = __toESM(require("react"));
|
|
9705
9695
|
var import_react32 = require("react");
|
|
9706
9696
|
|
|
9707
9697
|
// src/components/InfiniteTable/components/InfiniteTableHeader/InfiniteTableHeaderGroup.tsx
|
|
9708
|
-
var
|
|
9698
|
+
var React45 = __toESM(require("react"));
|
|
9709
9699
|
|
|
9710
9700
|
// src/components/InfiniteTable/components/InfiniteTableHeader/useColumnGroupResizeHandle.tsx
|
|
9711
|
-
var
|
|
9701
|
+
var React44 = __toESM(require("react"));
|
|
9712
9702
|
var import_react31 = require("react");
|
|
9713
9703
|
|
|
9714
9704
|
// src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/GroupResizeHandle.tsx
|
|
9715
9705
|
var import_react30 = require("react");
|
|
9716
|
-
var
|
|
9706
|
+
var React43 = __toESM(require("react"));
|
|
9717
9707
|
var { rootClassName: rootClassName8 } = internalProps;
|
|
9718
9708
|
var InfiniteTableHeaderCellResizeHandleCls2 = `${rootClassName8}HeaderCell_ResizeHandle`;
|
|
9719
9709
|
function GroupResizeHandleFn(props) {
|
|
@@ -9782,7 +9772,7 @@ function GroupResizeHandleFn(props) {
|
|
|
9782
9772
|
const style2 = (computedPinned === false || computedPinned === "start") && computedLastInCategory ? {
|
|
9783
9773
|
right: computedPinned === "start" ? void 0 : ThemeVars.components.HeaderCell.resizeHandleWidth
|
|
9784
9774
|
} : computedPinned === "end" && computedFirstInCategory ? { right: void 0 } : void 0;
|
|
9785
|
-
return /* @__PURE__ */
|
|
9775
|
+
return /* @__PURE__ */ React43.createElement(
|
|
9786
9776
|
"div",
|
|
9787
9777
|
{
|
|
9788
9778
|
ref: domRef,
|
|
@@ -9795,7 +9785,7 @@ function GroupResizeHandleFn(props) {
|
|
|
9795
9785
|
)}`,
|
|
9796
9786
|
onPointerDown
|
|
9797
9787
|
},
|
|
9798
|
-
/* @__PURE__ */
|
|
9788
|
+
/* @__PURE__ */ React43.createElement(
|
|
9799
9789
|
"div",
|
|
9800
9790
|
{
|
|
9801
9791
|
style: __spreadValues(__spreadValues({}, style2), props.style),
|
|
@@ -9806,7 +9796,7 @@ function GroupResizeHandleFn(props) {
|
|
|
9806
9796
|
)
|
|
9807
9797
|
);
|
|
9808
9798
|
}
|
|
9809
|
-
var GroupResizeHandle =
|
|
9799
|
+
var GroupResizeHandle = React43.memo(
|
|
9810
9800
|
GroupResizeHandleFn
|
|
9811
9801
|
);
|
|
9812
9802
|
|
|
@@ -9865,7 +9855,7 @@ function useColumnGroupResizeHandle(groupColumns, config) {
|
|
|
9865
9855
|
[computeResizeForDiff]
|
|
9866
9856
|
);
|
|
9867
9857
|
const groupResizable = groupColumns.some((c) => c.computedResizable);
|
|
9868
|
-
const resizeHandle = groupResizable ? /* @__PURE__ */
|
|
9858
|
+
const resizeHandle = groupResizable ? /* @__PURE__ */ React44.createElement(
|
|
9869
9859
|
GroupResizeHandle,
|
|
9870
9860
|
{
|
|
9871
9861
|
brain: bodyBrain,
|
|
@@ -9905,7 +9895,7 @@ function InfiniteTableHeaderGroup(props) {
|
|
|
9905
9895
|
(col) => `var(${columnWidthAtIndex5}-${col.computedVisibleIndex})`
|
|
9906
9896
|
).join(" + ") + " )" : `var(${columnWidthAtIndex5}-${firstColumn.computedVisibleIndex})`;
|
|
9907
9897
|
const zIndex2 = `calc(var(${columnZIndexAtIndex6}-${firstColumn.computedVisibleIndex}) + ${columnGroupsMaxDepth - columnGroup.depth})`;
|
|
9908
|
-
return /* @__PURE__ */
|
|
9898
|
+
return /* @__PURE__ */ React45.createElement(
|
|
9909
9899
|
"div",
|
|
9910
9900
|
{
|
|
9911
9901
|
ref: props.domRef,
|
|
@@ -9914,7 +9904,7 @@ function InfiniteTableHeaderGroup(props) {
|
|
|
9914
9904
|
style: { width, height },
|
|
9915
9905
|
"data-z-index": zIndex2
|
|
9916
9906
|
},
|
|
9917
|
-
/* @__PURE__ */
|
|
9907
|
+
/* @__PURE__ */ React45.createElement(
|
|
9918
9908
|
"div",
|
|
9919
9909
|
{
|
|
9920
9910
|
className: join(
|
|
@@ -9996,7 +9986,7 @@ function InfiniteTableHeaderFn(props) {
|
|
|
9996
9986
|
computedWidth: colGroupItem.computedWidth,
|
|
9997
9987
|
groupOffset: colGroupItem.groupOffset
|
|
9998
9988
|
});
|
|
9999
|
-
return /* @__PURE__ */
|
|
9989
|
+
return /* @__PURE__ */ React46.createElement(
|
|
10000
9990
|
InfiniteTableHeaderGroup,
|
|
10001
9991
|
{
|
|
10002
9992
|
bodyBrain,
|
|
@@ -10009,7 +9999,7 @@ function InfiniteTableHeaderFn(props) {
|
|
|
10009
9999
|
}
|
|
10010
10000
|
);
|
|
10011
10001
|
}
|
|
10012
|
-
return /* @__PURE__ */
|
|
10002
|
+
return /* @__PURE__ */ React46.createElement(
|
|
10013
10003
|
InfiniteTableHeaderCell,
|
|
10014
10004
|
{
|
|
10015
10005
|
domRef: domRef2,
|
|
@@ -10033,7 +10023,7 @@ function InfiniteTableHeaderFn(props) {
|
|
|
10033
10023
|
showColumnFilters
|
|
10034
10024
|
]
|
|
10035
10025
|
);
|
|
10036
|
-
return /* @__PURE__ */
|
|
10026
|
+
return /* @__PURE__ */ React46.createElement("div", __spreadValues({}, domProps), /* @__PURE__ */ React46.createElement(
|
|
10037
10027
|
RawTable,
|
|
10038
10028
|
{
|
|
10039
10029
|
name: "header",
|
|
@@ -10043,7 +10033,7 @@ function InfiniteTableHeaderFn(props) {
|
|
|
10043
10033
|
}
|
|
10044
10034
|
));
|
|
10045
10035
|
}
|
|
10046
|
-
var InfiniteTableHeader =
|
|
10036
|
+
var InfiniteTableHeader = React46.memo(
|
|
10047
10037
|
InfiniteTableHeaderFn
|
|
10048
10038
|
);
|
|
10049
10039
|
|
|
@@ -10068,7 +10058,7 @@ function TableHeaderWrapper(props) {
|
|
|
10068
10058
|
} = tableContextValue;
|
|
10069
10059
|
const rows = !computedColumnGroups || !Object.keys(computedColumnGroups).length ? 1 : columnGroupsMaxDepth + 2;
|
|
10070
10060
|
const height = rows * columnHeaderHeight + (showColumnFilters ? columnHeaderHeight : 0);
|
|
10071
|
-
const columnAndGroupTreeInfo =
|
|
10061
|
+
const columnAndGroupTreeInfo = React47.useMemo(() => {
|
|
10072
10062
|
if (!computedColumnGroups || !Object.keys(computedColumnGroups).length) {
|
|
10073
10063
|
return void 0;
|
|
10074
10064
|
}
|
|
@@ -10079,7 +10069,7 @@ function TableHeaderWrapper(props) {
|
|
|
10079
10069
|
columnGroupsMaxDepth
|
|
10080
10070
|
);
|
|
10081
10071
|
}, [computedVisibleColumns, computedColumnGroups, columnGroupsDepthsMap]);
|
|
10082
|
-
const cellspan =
|
|
10072
|
+
const cellspan = React47.useCallback(
|
|
10083
10073
|
({ rowIndex, colIndex }) => {
|
|
10084
10074
|
const column = computedVisibleColumns[colIndex];
|
|
10085
10075
|
const rowspan2 = 1;
|
|
@@ -10117,15 +10107,15 @@ function TableHeaderWrapper(props) {
|
|
|
10117
10107
|
columnGroupsDepthsMap
|
|
10118
10108
|
]
|
|
10119
10109
|
);
|
|
10120
|
-
const rowspan =
|
|
10110
|
+
const rowspan = React47.useCallback(
|
|
10121
10111
|
({ rowIndex, colIndex }) => cellspan({ rowIndex, colIndex }).rowspan,
|
|
10122
10112
|
[cellspan]
|
|
10123
10113
|
);
|
|
10124
|
-
const colspan =
|
|
10114
|
+
const colspan = React47.useCallback(
|
|
10125
10115
|
({ rowIndex, colIndex }) => cellspan({ rowIndex, colIndex }).colspan,
|
|
10126
10116
|
[cellspan]
|
|
10127
10117
|
);
|
|
10128
|
-
const rowHeight =
|
|
10118
|
+
const rowHeight = React47.useCallback(
|
|
10129
10119
|
(index) => {
|
|
10130
10120
|
return showColumnFilters ? index < rows - 1 ? columnHeaderHeight : 2 * columnHeaderHeight : columnHeaderHeight;
|
|
10131
10121
|
},
|
|
@@ -10147,7 +10137,7 @@ function TableHeaderWrapper(props) {
|
|
|
10147
10137
|
fixedColsStart: computedPinnedStartColumns.length
|
|
10148
10138
|
}
|
|
10149
10139
|
);
|
|
10150
|
-
const header = /* @__PURE__ */
|
|
10140
|
+
const header = /* @__PURE__ */ React47.createElement(
|
|
10151
10141
|
InfiniteTableHeader,
|
|
10152
10142
|
{
|
|
10153
10143
|
columns: computedVisibleColumns,
|
|
@@ -10158,7 +10148,7 @@ function TableHeaderWrapper(props) {
|
|
|
10158
10148
|
columnAndGroupTreeInfo
|
|
10159
10149
|
}
|
|
10160
10150
|
);
|
|
10161
|
-
const verticalScrollbarPlaceholder = scrollbars.vertical && getScrollbarWidth() ? /* @__PURE__ */
|
|
10151
|
+
const verticalScrollbarPlaceholder = scrollbars.vertical && getScrollbarWidth() ? /* @__PURE__ */ React47.createElement(
|
|
10162
10152
|
"div",
|
|
10163
10153
|
{
|
|
10164
10154
|
className: HeaderScrollbarPlaceholderCls,
|
|
@@ -10168,7 +10158,7 @@ function TableHeaderWrapper(props) {
|
|
|
10168
10158
|
}
|
|
10169
10159
|
}
|
|
10170
10160
|
) : null;
|
|
10171
|
-
return /* @__PURE__ */
|
|
10161
|
+
return /* @__PURE__ */ React47.createElement(
|
|
10172
10162
|
"div",
|
|
10173
10163
|
{
|
|
10174
10164
|
className: HeaderWrapperCls,
|
|
@@ -10182,7 +10172,7 @@ function TableHeaderWrapper(props) {
|
|
|
10182
10172
|
}
|
|
10183
10173
|
|
|
10184
10174
|
// src/components/InfiniteTable/components/InfiniteTableLicenseFooter/index.tsx
|
|
10185
|
-
var
|
|
10175
|
+
var React48 = __toESM(require("react"));
|
|
10186
10176
|
var import_react33 = require("react");
|
|
10187
10177
|
|
|
10188
10178
|
// src/components/utils/decamelize.ts
|
|
@@ -10225,11 +10215,11 @@ var enforceStyle = (node, style2) => {
|
|
|
10225
10215
|
);
|
|
10226
10216
|
}
|
|
10227
10217
|
};
|
|
10228
|
-
var InfiniteTableLicenseFooter =
|
|
10218
|
+
var InfiniteTableLicenseFooter = React48.forwardRef(
|
|
10229
10219
|
function InfiniteTableLicenseFooter2(props, ref) {
|
|
10230
10220
|
const { rootClassName: rootClassName12 } = useInternalProps();
|
|
10231
|
-
const domRef =
|
|
10232
|
-
const domCallback =
|
|
10221
|
+
const domRef = React48.useRef(null);
|
|
10222
|
+
const domCallback = React48.useCallback((node) => {
|
|
10233
10223
|
domRef.current = node;
|
|
10234
10224
|
if (!ref) {
|
|
10235
10225
|
return;
|
|
@@ -10257,7 +10247,7 @@ var InfiniteTableLicenseFooter = React49.forwardRef(
|
|
|
10257
10247
|
clearInterval(intervalId);
|
|
10258
10248
|
};
|
|
10259
10249
|
}, []);
|
|
10260
|
-
return /* @__PURE__ */
|
|
10250
|
+
return /* @__PURE__ */ React48.createElement(
|
|
10261
10251
|
"div",
|
|
10262
10252
|
__spreadProps(__spreadValues({
|
|
10263
10253
|
ref: domCallback
|
|
@@ -10271,7 +10261,7 @@ var InfiniteTableLicenseFooter = React49.forwardRef(
|
|
|
10271
10261
|
}),
|
|
10272
10262
|
"Powered by",
|
|
10273
10263
|
" ",
|
|
10274
|
-
/* @__PURE__ */
|
|
10264
|
+
/* @__PURE__ */ React48.createElement(
|
|
10275
10265
|
"a",
|
|
10276
10266
|
{
|
|
10277
10267
|
href: "https://infinite-table.com",
|
|
@@ -10286,7 +10276,7 @@ var InfiniteTableLicenseFooter = React49.forwardRef(
|
|
|
10286
10276
|
);
|
|
10287
10277
|
|
|
10288
10278
|
// src/components/InfiniteTable/components/LoadMask.tsx
|
|
10289
|
-
var
|
|
10279
|
+
var React49 = __toESM(require("react"));
|
|
10290
10280
|
|
|
10291
10281
|
// src/components/InfiniteTable/components/LoadMask.css.ts
|
|
10292
10282
|
var LoadMaskCls = { visible: "LoadMask_LoadMaskCls_visible__qy58ya1 LoadMask_LoadMaskBaseCls__qy58ya0 utilities_position_absolute__16lm1iw2 utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e utilities_right_0__16lm1iw1j utilities_bottom_0__16lm1iw1h", hidden: "LoadMask_LoadMaskCls_hidden__qy58ya2 LoadMask_LoadMaskBaseCls__qy58ya0 utilities_position_absolute__16lm1iw2 utilities_top_0__16lm1iw1c utilities_left_0__16lm1iw1e utilities_right_0__16lm1iw1j utilities_bottom_0__16lm1iw1h" };
|
|
@@ -10298,16 +10288,16 @@ var { rootClassName: rootClassName10 } = internalProps;
|
|
|
10298
10288
|
var baseCls3 = `${rootClassName10}-LoadMask`;
|
|
10299
10289
|
function LoadMaskFn(props) {
|
|
10300
10290
|
const { visible, children = "Loading" } = props;
|
|
10301
|
-
return /* @__PURE__ */
|
|
10291
|
+
return /* @__PURE__ */ React49.createElement(
|
|
10302
10292
|
"div",
|
|
10303
10293
|
{
|
|
10304
10294
|
className: `${LoadMaskCls[visible ? "visible" : "hidden"]} ${baseCls3}`
|
|
10305
10295
|
},
|
|
10306
|
-
/* @__PURE__ */
|
|
10307
|
-
/* @__PURE__ */
|
|
10296
|
+
/* @__PURE__ */ React49.createElement("div", { className: `${LoadMaskOverlayCls} ${baseCls3}-Overlay` }),
|
|
10297
|
+
/* @__PURE__ */ React49.createElement("div", { className: `${LoadMaskTextCls} ${baseCls3}-Text` }, children)
|
|
10308
10298
|
);
|
|
10309
10299
|
}
|
|
10310
|
-
var LoadMask =
|
|
10300
|
+
var LoadMask = React49.memo(LoadMaskFn);
|
|
10311
10301
|
|
|
10312
10302
|
// src/utils/deepClone.ts
|
|
10313
10303
|
function cloneArray(arr) {
|
|
@@ -10979,7 +10969,7 @@ function enhancedFlatten(param) {
|
|
|
10979
10969
|
}
|
|
10980
10970
|
|
|
10981
10971
|
// src/components/DataSource/index.tsx
|
|
10982
|
-
var
|
|
10972
|
+
var React50 = __toESM(require("react"));
|
|
10983
10973
|
var import_react36 = require("react");
|
|
10984
10974
|
|
|
10985
10975
|
// src/utils/multisort/sortTypes.ts
|
|
@@ -14976,7 +14966,7 @@ function DataSourceWithContext(props) {
|
|
|
14976
14966
|
var _a;
|
|
14977
14967
|
(_a = componentState.onReady) == null ? void 0 : _a.call(componentState, api);
|
|
14978
14968
|
}, []);
|
|
14979
|
-
return /* @__PURE__ */
|
|
14969
|
+
return /* @__PURE__ */ React50.createElement(React50.Fragment, null, children);
|
|
14980
14970
|
}
|
|
14981
14971
|
var DataSourceRoot = getComponentStateRoot({
|
|
14982
14972
|
//@ts-ignore
|
|
@@ -15006,7 +14996,7 @@ function DataSourceCmp({
|
|
|
15006
14996
|
const { componentState, componentActions, assignState } = useComponentState();
|
|
15007
14997
|
componentState.getDataSourceMasterContextRef.current = getDataSourceMasterContext;
|
|
15008
14998
|
const getState = useLatest(componentState);
|
|
15009
|
-
const [api] =
|
|
14999
|
+
const [api] = React50.useState(() => {
|
|
15010
15000
|
return getDataSourceApi({ getState, actions: componentActions });
|
|
15011
15001
|
});
|
|
15012
15002
|
const contextValue = {
|
|
@@ -15058,13 +15048,13 @@ function DataSourceCmp({
|
|
|
15058
15048
|
});
|
|
15059
15049
|
}
|
|
15060
15050
|
}, [componentState.originalDataArrayChangedInfo]);
|
|
15061
|
-
return /* @__PURE__ */
|
|
15051
|
+
return /* @__PURE__ */ React50.createElement(DataSourceContext.Provider, { value: contextValue }, /* @__PURE__ */ React50.createElement(DataSourceWithContext, { children }));
|
|
15062
15052
|
}
|
|
15063
15053
|
function DataSource(props) {
|
|
15064
15054
|
const masterContext = useMasterDetailContext();
|
|
15065
15055
|
const isDetail = !!masterContext;
|
|
15066
15056
|
const key = isDetail ? masterContext.masterRowInfo.id : "master";
|
|
15067
|
-
return /* @__PURE__ */
|
|
15057
|
+
return /* @__PURE__ */ React50.createElement(DataSourceRoot, __spreadProps(__spreadValues({}, props), { key }), /* @__PURE__ */ React50.createElement(DataSourceCmp, { children: props.children, isDetail }));
|
|
15068
15058
|
}
|
|
15069
15059
|
function useRowInfoReducers() {
|
|
15070
15060
|
const { rowInfoReducerResults } = useDataSource();
|
|
@@ -15386,7 +15376,8 @@ function getRowDetailApi(param) {
|
|
|
15386
15376
|
return !rowDetailApi.isRowDetailCollapsed(pk);
|
|
15387
15377
|
},
|
|
15388
15378
|
collapseRowDetail(pk) {
|
|
15389
|
-
const
|
|
15379
|
+
const componentState = getState();
|
|
15380
|
+
const currentState = componentState.rowDetailState;
|
|
15390
15381
|
if (!currentState) {
|
|
15391
15382
|
console.error(
|
|
15392
15383
|
`Cannot collapse row details via rowDetailState, as no props.rowDetailState is provided.`
|
|
@@ -15395,10 +15386,13 @@ function getRowDetailApi(param) {
|
|
|
15395
15386
|
}
|
|
15396
15387
|
const state = new RowDetailState(currentState);
|
|
15397
15388
|
state.collapseRowDetails(pk);
|
|
15389
|
+
componentState.lastRowToExpandRef.current = null;
|
|
15390
|
+
componentState.lastRowToCollapseRef.current = pk;
|
|
15398
15391
|
actions.rowDetailState = state;
|
|
15399
15392
|
},
|
|
15400
15393
|
expandRowDetail(pk) {
|
|
15401
|
-
const
|
|
15394
|
+
const componentState = getState();
|
|
15395
|
+
const currentState = componentState.rowDetailState;
|
|
15402
15396
|
if (!currentState) {
|
|
15403
15397
|
console.error(
|
|
15404
15398
|
`Cannot expand row details via rowDetailState, as no props.rowDetailState is provided.`
|
|
@@ -15407,6 +15401,8 @@ function getRowDetailApi(param) {
|
|
|
15407
15401
|
}
|
|
15408
15402
|
const state = new RowDetailState(currentState);
|
|
15409
15403
|
state.expandRowDetails(pk);
|
|
15404
|
+
componentState.lastRowToCollapseRef.current = null;
|
|
15405
|
+
componentState.lastRowToExpandRef.current = pk;
|
|
15410
15406
|
actions.rowDetailState = state;
|
|
15411
15407
|
},
|
|
15412
15408
|
toggleRowDetail(pk) {
|
|
@@ -16435,7 +16431,7 @@ function useAutoSizeColumns() {
|
|
|
16435
16431
|
// src/components/InfiniteTable/hooks/useCellRendering.tsx
|
|
16436
16432
|
var import_react39 = require("react");
|
|
16437
16433
|
var import_react40 = require("react");
|
|
16438
|
-
var
|
|
16434
|
+
var React52 = __toESM(require("react"));
|
|
16439
16435
|
|
|
16440
16436
|
// src/components/InfiniteTable/hooks/useYourBrain.ts
|
|
16441
16437
|
function useYourBrain(param) {
|
|
@@ -16472,7 +16468,7 @@ function useYourBrain(param) {
|
|
|
16472
16468
|
}
|
|
16473
16469
|
|
|
16474
16470
|
// src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableDetailRow.tsx
|
|
16475
|
-
var
|
|
16471
|
+
var React51 = __toESM(require("react"));
|
|
16476
16472
|
|
|
16477
16473
|
// src/components/InfiniteTable/components/rowDetail.css.ts
|
|
16478
16474
|
var RowDetailRecipe = createRuntimeFn({ defaultClassName: "rowDetail_RowDetailRecipe__evqes20", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
|
|
@@ -16609,7 +16605,7 @@ function InfiniteTableDetailRowFn(props) {
|
|
|
16609
16605
|
rowDetailsCache,
|
|
16610
16606
|
rowInfo
|
|
16611
16607
|
});
|
|
16612
|
-
return /* @__PURE__ */
|
|
16608
|
+
return /* @__PURE__ */ React51.createElement(DataSourceMasterDetailContext.Provider, { value: masterDetailContextValue }, /* @__PURE__ */ React51.createElement(
|
|
16613
16609
|
"div",
|
|
16614
16610
|
{
|
|
16615
16611
|
ref: domRef,
|
|
@@ -16618,6 +16614,7 @@ function InfiniteTableDetailRowFn(props) {
|
|
|
16618
16614
|
position: "absolute",
|
|
16619
16615
|
top: `${detailOffset}px`,
|
|
16620
16616
|
left: 0,
|
|
16617
|
+
// TODO see #rowDetailWidth
|
|
16621
16618
|
width: `calc(${InternalVars.bodyWidth} - ${InternalVars.scrollbarWidthVertical})`,
|
|
16622
16619
|
height: rowDetailHeight
|
|
16623
16620
|
}
|
|
@@ -16625,7 +16622,7 @@ function InfiniteTableDetailRowFn(props) {
|
|
|
16625
16622
|
rowDetailRenderer(rowInfo, currentRowCache)
|
|
16626
16623
|
));
|
|
16627
16624
|
}
|
|
16628
|
-
var InfiniteTableDetailRow =
|
|
16625
|
+
var InfiniteTableDetailRow = React51.memo(
|
|
16629
16626
|
InfiniteTableDetailRowFn
|
|
16630
16627
|
);
|
|
16631
16628
|
|
|
@@ -16784,7 +16781,7 @@ function useCellRendering(param) {
|
|
|
16784
16781
|
cellStyle,
|
|
16785
16782
|
cellClassName
|
|
16786
16783
|
};
|
|
16787
|
-
return /* @__PURE__ */
|
|
16784
|
+
return /* @__PURE__ */ React52.createElement(InfiniteTableColumnCell, __spreadValues({}, cellProps));
|
|
16788
16785
|
},
|
|
16789
16786
|
[
|
|
16790
16787
|
rowHeight,
|
|
@@ -16815,10 +16812,10 @@ function useCellRendering(param) {
|
|
|
16815
16812
|
const dataArray2 = getData();
|
|
16816
16813
|
const rowInfo = dataArray2[rowIndex];
|
|
16817
16814
|
if (!rowInfo || !isRowDetailsExpanded(rowInfo) || !computedRowSizeCacheForDetails) {
|
|
16818
|
-
return /* @__PURE__ */
|
|
16815
|
+
return /* @__PURE__ */ React52.createElement("div", { ref: domRef, className: visibility.hidden });
|
|
16819
16816
|
}
|
|
16820
16817
|
const { rowDetailHeight: rowDetailHeight2, rowHeight: rowHeight2 } = computedRowSizeCacheForDetails.getSize(rowIndex);
|
|
16821
|
-
return /* @__PURE__ */
|
|
16818
|
+
return /* @__PURE__ */ React52.createElement(
|
|
16822
16819
|
InfiniteTableDetailRow,
|
|
16823
16820
|
{
|
|
16824
16821
|
rowInfo,
|
|
@@ -17151,10 +17148,10 @@ function computeColumnGroupsDepths(columnGroups) {
|
|
|
17151
17148
|
}
|
|
17152
17149
|
|
|
17153
17150
|
// src/components/InfiniteTable/state/rowDetailRendererFromComponent.tsx
|
|
17154
|
-
var
|
|
17151
|
+
var React53 = __toESM(require("react"));
|
|
17155
17152
|
function getRowDetailRendererFromComponent(RowDetail) {
|
|
17156
17153
|
return (rowInfo, cache) => {
|
|
17157
|
-
return /* @__PURE__ */
|
|
17154
|
+
return /* @__PURE__ */ React53.createElement(RowDetail, { key: rowInfo.id, rowInfo, cache });
|
|
17158
17155
|
};
|
|
17159
17156
|
}
|
|
17160
17157
|
|
|
@@ -17203,6 +17200,8 @@ function initSetupState2({
|
|
|
17203
17200
|
renderer,
|
|
17204
17201
|
onRenderUpdater,
|
|
17205
17202
|
propsCache: /* @__PURE__ */ new Map([]),
|
|
17203
|
+
lastRowToCollapseRef: { current: null },
|
|
17204
|
+
lastRowToExpandRef: { current: null },
|
|
17206
17205
|
cellContextMenuVisibleFor: null,
|
|
17207
17206
|
contextMenuVisibleFor: null,
|
|
17208
17207
|
columnMenuVisibleForColumnId: null,
|
|
@@ -17403,6 +17402,21 @@ function getGroupByMap(groupBy) {
|
|
|
17403
17402
|
}, /* @__PURE__ */ new Map());
|
|
17404
17403
|
}
|
|
17405
17404
|
var weakMap2 = /* @__PURE__ */ new WeakMap();
|
|
17405
|
+
function getMappedCallbacks2() {
|
|
17406
|
+
return {
|
|
17407
|
+
rowDetailState: (rowDetailState, state) => {
|
|
17408
|
+
return {
|
|
17409
|
+
callbackParams: [
|
|
17410
|
+
rowDetailState,
|
|
17411
|
+
{
|
|
17412
|
+
expandRow: state.lastRowToExpandRef.current,
|
|
17413
|
+
collapseRow: state.lastRowToCollapseRef.current
|
|
17414
|
+
}
|
|
17415
|
+
]
|
|
17416
|
+
};
|
|
17417
|
+
}
|
|
17418
|
+
};
|
|
17419
|
+
}
|
|
17406
17420
|
var mapPropsToState = (params) => {
|
|
17407
17421
|
var _a, _b, _c, _d, _e;
|
|
17408
17422
|
const { props, state, oldState, parentState } = params;
|
|
@@ -18620,7 +18634,7 @@ var useLicense = (licenseKey = "") => {
|
|
|
18620
18634
|
}
|
|
18621
18635
|
let valid2 = isValidLicense(licenseKey, {
|
|
18622
18636
|
publishedAt: 1624970570587,
|
|
18623
|
-
version: "4.
|
|
18637
|
+
version: "4.1.0"
|
|
18624
18638
|
});
|
|
18625
18639
|
if (!licenseKey && !valid2 && isInsidePlayground) {
|
|
18626
18640
|
return true;
|
|
@@ -19659,7 +19673,7 @@ function useDOMEventHandlers() {
|
|
|
19659
19673
|
var import_react58 = require("react");
|
|
19660
19674
|
|
|
19661
19675
|
// src/components/hooks/useOverlay/index.tsx
|
|
19662
|
-
var
|
|
19676
|
+
var React54 = __toESM(require("react"));
|
|
19663
19677
|
var import_react54 = require("react");
|
|
19664
19678
|
var import_react_dom2 = require("react-dom");
|
|
19665
19679
|
|
|
@@ -20045,10 +20059,10 @@ function retrieveElement(elementGetter) {
|
|
|
20045
20059
|
});
|
|
20046
20060
|
}
|
|
20047
20061
|
function DefaultOverlayPortal(props) {
|
|
20048
|
-
return /* @__PURE__ */
|
|
20062
|
+
return /* @__PURE__ */ React54.createElement("div", { style: { position: "fixed", top: 0, left: 0 } }, props.children);
|
|
20049
20063
|
}
|
|
20050
20064
|
function OverlayContent(props) {
|
|
20051
|
-
const nodeRef =
|
|
20065
|
+
const nodeRef = React54.useRef(null);
|
|
20052
20066
|
(0, import_react54.useEffect)(() => {
|
|
20053
20067
|
return props.realign.onChange((handle) => {
|
|
20054
20068
|
if (nodeRef.current && handle) {
|
|
@@ -20056,7 +20070,7 @@ function OverlayContent(props) {
|
|
|
20056
20070
|
}
|
|
20057
20071
|
});
|
|
20058
20072
|
}, [props.realign]);
|
|
20059
|
-
return /* @__PURE__ */
|
|
20073
|
+
return /* @__PURE__ */ React54.createElement(
|
|
20060
20074
|
"div",
|
|
20061
20075
|
{
|
|
20062
20076
|
style: { position: "absolute", top: 0, left: 0 },
|
|
@@ -20127,22 +20141,22 @@ function useOverlayPortal(content, portalContainer) {
|
|
|
20127
20141
|
}, [portalContainer]);
|
|
20128
20142
|
return portalContainer ? container ? (0, import_react_dom2.createPortal)(content, container) : (
|
|
20129
20143
|
// we're probably still fetching the container
|
|
20130
|
-
/* @__PURE__ */
|
|
20131
|
-
) : portalContainer === null || portalContainer === false ? content : /* @__PURE__ */
|
|
20144
|
+
/* @__PURE__ */ React54.createElement(React54.Fragment, null)
|
|
20145
|
+
) : portalContainer === null || portalContainer === false ? content : /* @__PURE__ */ React54.createElement(DefaultOverlayPortal, null, content);
|
|
20132
20146
|
}
|
|
20133
20147
|
function getIdForReactOnlyChild(children) {
|
|
20134
|
-
if (
|
|
20135
|
-
const child =
|
|
20136
|
-
if (
|
|
20148
|
+
if (React54.Children.count(children) === 1) {
|
|
20149
|
+
const child = React54.Children.only(children);
|
|
20150
|
+
if (React54.isValidElement(child)) {
|
|
20137
20151
|
return child.props.id || child.key;
|
|
20138
20152
|
}
|
|
20139
20153
|
}
|
|
20140
20154
|
return null;
|
|
20141
20155
|
}
|
|
20142
20156
|
function injectPortalContainerAndConstrainInMenuChild(children, portalContainer, constrainTo) {
|
|
20143
|
-
if (
|
|
20144
|
-
const child =
|
|
20145
|
-
if (
|
|
20157
|
+
if (React54.Children.count(children) === 1) {
|
|
20158
|
+
const child = React54.Children.only(children);
|
|
20159
|
+
if (React54.isValidElement(child) && child.type[propToIdentifyMenu]) {
|
|
20146
20160
|
const newProps = {};
|
|
20147
20161
|
if (child.props.portalContainer === void 0) {
|
|
20148
20162
|
newProps.portalContainer = portalContainer;
|
|
@@ -20150,7 +20164,7 @@ function injectPortalContainerAndConstrainInMenuChild(children, portalContainer,
|
|
|
20150
20164
|
if (child.props.constrainTo === void 0) {
|
|
20151
20165
|
newProps.constrainTo = constrainTo;
|
|
20152
20166
|
}
|
|
20153
|
-
return
|
|
20167
|
+
return React54.cloneElement(child, newProps);
|
|
20154
20168
|
}
|
|
20155
20169
|
}
|
|
20156
20170
|
return children;
|
|
@@ -20166,7 +20180,7 @@ function useOverlay(params) {
|
|
|
20166
20180
|
const contentForPortal = [];
|
|
20167
20181
|
for (const [_2, handle] of handles) {
|
|
20168
20182
|
contentForPortal.push(
|
|
20169
|
-
/* @__PURE__ */
|
|
20183
|
+
/* @__PURE__ */ React54.createElement(OverlayContent, __spreadProps(__spreadValues({}, handle), { key: handle.key }))
|
|
20170
20184
|
);
|
|
20171
20185
|
}
|
|
20172
20186
|
return contentForPortal;
|
|
@@ -20211,7 +20225,7 @@ function useOverlay(params) {
|
|
|
20211
20225
|
},
|
|
20212
20226
|
[handles, rootParams.portalContainer, updateContent]
|
|
20213
20227
|
);
|
|
20214
|
-
|
|
20228
|
+
React54.useEffect(() => {
|
|
20215
20229
|
if (handleToRealign) {
|
|
20216
20230
|
const handle = handles.get(handleToRealign);
|
|
20217
20231
|
if (handle) {
|
|
@@ -20230,7 +20244,7 @@ function useOverlay(params) {
|
|
|
20230
20244
|
handles.clear();
|
|
20231
20245
|
updateContent();
|
|
20232
20246
|
};
|
|
20233
|
-
|
|
20247
|
+
React54.useEffect(() => {
|
|
20234
20248
|
}, []);
|
|
20235
20249
|
return {
|
|
20236
20250
|
portal,
|
|
@@ -20242,16 +20256,16 @@ function useOverlay(params) {
|
|
|
20242
20256
|
}
|
|
20243
20257
|
|
|
20244
20258
|
// src/components/InfiniteTable/utils/getMenuForColumn.tsx
|
|
20245
|
-
var
|
|
20259
|
+
var React60 = __toESM(require("react"));
|
|
20246
20260
|
|
|
20247
20261
|
// src/components/Menu/index.tsx
|
|
20248
|
-
var
|
|
20262
|
+
var React58 = __toESM(require("react"));
|
|
20249
20263
|
|
|
20250
20264
|
// src/components/Menu/getMenuState.tsx
|
|
20251
|
-
var
|
|
20265
|
+
var React56 = __toESM(require("react"));
|
|
20252
20266
|
|
|
20253
20267
|
// src/components/Menu/childrenToRuntimeItems.tsx
|
|
20254
|
-
var
|
|
20268
|
+
var React55 = __toESM(require("react"));
|
|
20255
20269
|
|
|
20256
20270
|
// src/components/Menu/MenuItem.tsx
|
|
20257
20271
|
function MenuItem(_props) {
|
|
@@ -20270,7 +20284,7 @@ var MenuSeparatorCls = "MenuCls_MenuSeparatorCls__db3arfd";
|
|
|
20270
20284
|
// src/components/Menu/childrenToRuntimeItems.tsx
|
|
20271
20285
|
var SEPARATOR = "-";
|
|
20272
20286
|
function MenuSeparator() {
|
|
20273
|
-
return /* @__PURE__ */
|
|
20287
|
+
return /* @__PURE__ */ React55.createElement("hr", { className: MenuSeparatorCls });
|
|
20274
20288
|
}
|
|
20275
20289
|
var toRuntimeItem = ({
|
|
20276
20290
|
columns,
|
|
@@ -20279,7 +20293,7 @@ var toRuntimeItem = ({
|
|
|
20279
20293
|
menuId
|
|
20280
20294
|
}, item) => {
|
|
20281
20295
|
const menuItem = item && (item.key != null || item.label != null) ? item : null;
|
|
20282
|
-
const menuDecoration = menuItem === null ? item === SEPARATOR ? /* @__PURE__ */
|
|
20296
|
+
const menuDecoration = menuItem === null ? item === SEPARATOR ? /* @__PURE__ */ React55.createElement(MenuSeparator, null) : item : null;
|
|
20283
20297
|
const runtimeItem = menuItem != null ? {
|
|
20284
20298
|
type: "item",
|
|
20285
20299
|
parentMenuId: menuId,
|
|
@@ -20307,7 +20321,7 @@ var toRuntimeItem = ({
|
|
|
20307
20321
|
return runtimeItem;
|
|
20308
20322
|
};
|
|
20309
20323
|
function childrenToRuntimeItems(context, children) {
|
|
20310
|
-
return
|
|
20324
|
+
return React55.Children.map(children, (child) => {
|
|
20311
20325
|
if (child) {
|
|
20312
20326
|
if (child.props.__is_menu_item || child.type === MenuItem) {
|
|
20313
20327
|
const itemProps = __spreadValues({}, child.props);
|
|
@@ -20330,7 +20344,7 @@ function childrenToRuntimeItems(context, children) {
|
|
|
20330
20344
|
// src/components/Menu/getMenuState.tsx
|
|
20331
20345
|
var SUBMENU_COL_NAME = "submenu";
|
|
20332
20346
|
function getInitialMenuState() {
|
|
20333
|
-
const domRef =
|
|
20347
|
+
const domRef = React56.createRef();
|
|
20334
20348
|
return {
|
|
20335
20349
|
keyboardActiveItemKey: null,
|
|
20336
20350
|
activeItemKey: null,
|
|
@@ -20385,7 +20399,7 @@ var deriveStateFromProps2 = (params) => {
|
|
|
20385
20399
|
columns.push({
|
|
20386
20400
|
name: SUBMENU_COL_NAME,
|
|
20387
20401
|
render: ({ domProps, item }) => {
|
|
20388
|
-
return item.menu ? /* @__PURE__ */
|
|
20402
|
+
return item.menu ? /* @__PURE__ */ React56.createElement("div", __spreadValues({}, domProps), /* @__PURE__ */ React56.createElement(ExpanderIcon, { expanded: false })) : /* @__PURE__ */ React56.createElement("div", __spreadValues({}, domProps));
|
|
20389
20403
|
}
|
|
20390
20404
|
});
|
|
20391
20405
|
}
|
|
@@ -20402,7 +20416,7 @@ var deriveStateFromProps2 = (params) => {
|
|
|
20402
20416
|
};
|
|
20403
20417
|
|
|
20404
20418
|
// src/components/Menu/Menu.tsx
|
|
20405
|
-
var
|
|
20419
|
+
var React57 = __toESM(require("react"));
|
|
20406
20420
|
var import_react57 = require("react");
|
|
20407
20421
|
|
|
20408
20422
|
// src/utils/pageGeometry/Triangle.ts
|
|
@@ -20662,7 +20676,7 @@ function renderSubmenuForItem(item, config) {
|
|
|
20662
20676
|
if (typeof itemMenu === "function") {
|
|
20663
20677
|
itemMenu = itemMenu();
|
|
20664
20678
|
}
|
|
20665
|
-
return /* @__PURE__ */
|
|
20679
|
+
return /* @__PURE__ */ React57.createElement(
|
|
20666
20680
|
Menu,
|
|
20667
20681
|
__spreadProps(__spreadValues({
|
|
20668
20682
|
key: overlayId,
|
|
@@ -20875,7 +20889,7 @@ function MenuComponent(props) {
|
|
|
20875
20889
|
setActiveItemKey(key);
|
|
20876
20890
|
}
|
|
20877
20891
|
});
|
|
20878
|
-
renderedChildren = runtimeItems.map((runtimeItem, index) => /* @__PURE__ */
|
|
20892
|
+
renderedChildren = runtimeItems.map((runtimeItem, index) => /* @__PURE__ */ React57.createElement(
|
|
20879
20893
|
RuntimeItemRenderer,
|
|
20880
20894
|
{
|
|
20881
20895
|
key: runtimeItem.type === "item" ? runtimeItem.key : index,
|
|
@@ -21060,7 +21074,7 @@ function MenuComponent(props) {
|
|
|
21060
21074
|
domRef.current = node;
|
|
21061
21075
|
}
|
|
21062
21076
|
}, []);
|
|
21063
|
-
const result = /* @__PURE__ */
|
|
21077
|
+
const result = /* @__PURE__ */ React57.createElement("div", { className: display.contents }, /* @__PURE__ */ React57.createElement(
|
|
21064
21078
|
"div",
|
|
21065
21079
|
__spreadProps(__spreadValues({}, domProps), {
|
|
21066
21080
|
"data-menu-id": menuId,
|
|
@@ -21092,12 +21106,12 @@ function MenuComponent(props) {
|
|
|
21092
21106
|
return destroyed ? null : result;
|
|
21093
21107
|
}
|
|
21094
21108
|
function RuntimeItemRenderer(props) {
|
|
21095
|
-
const [pressed, setPressed] =
|
|
21109
|
+
const [pressed, setPressed] = React57.useState(false);
|
|
21096
21110
|
const { columns, item, index, active, keyboardActive } = props;
|
|
21097
21111
|
const key = item.type === "item" ? item.value.key : index;
|
|
21098
21112
|
let content = null;
|
|
21099
21113
|
if (item.type === "decoration") {
|
|
21100
|
-
content = /* @__PURE__ */
|
|
21114
|
+
content = /* @__PURE__ */ React57.createElement("div", { style: item.style }, item.value);
|
|
21101
21115
|
} else {
|
|
21102
21116
|
let spanIndex = 0;
|
|
21103
21117
|
content = columns.map((col, i) => {
|
|
@@ -21158,7 +21172,7 @@ function RuntimeItemRenderer(props) {
|
|
|
21158
21172
|
}
|
|
21159
21173
|
}
|
|
21160
21174
|
};
|
|
21161
|
-
return col.render ? /* @__PURE__ */
|
|
21175
|
+
return col.render ? /* @__PURE__ */ React57.createElement(
|
|
21162
21176
|
RenderHookComponent,
|
|
21163
21177
|
{
|
|
21164
21178
|
key: `${key}-${field}`,
|
|
@@ -21170,10 +21184,10 @@ function RuntimeItemRenderer(props) {
|
|
|
21170
21184
|
domProps
|
|
21171
21185
|
}
|
|
21172
21186
|
}
|
|
21173
|
-
) : /* @__PURE__ */
|
|
21187
|
+
) : /* @__PURE__ */ React57.createElement("div", __spreadValues({ key: `${key}-${field}` }, domProps), target[field]);
|
|
21174
21188
|
}).filter(Boolean);
|
|
21175
21189
|
}
|
|
21176
|
-
return /* @__PURE__ */
|
|
21190
|
+
return /* @__PURE__ */ React57.createElement("div", { className: MenuRowCls }, content);
|
|
21177
21191
|
}
|
|
21178
21192
|
|
|
21179
21193
|
// src/components/Menu/index.tsx
|
|
@@ -21187,12 +21201,12 @@ var MenuRoot = getComponentStateRoot({
|
|
|
21187
21201
|
function MenuContextProvider(props) {
|
|
21188
21202
|
const { componentActions, componentState } = useComponentState();
|
|
21189
21203
|
const getState = useLatest(componentState);
|
|
21190
|
-
return /* @__PURE__ */
|
|
21204
|
+
return /* @__PURE__ */ React58.createElement(
|
|
21191
21205
|
MenuContext.Provider,
|
|
21192
21206
|
{
|
|
21193
21207
|
value: { componentActions, componentState, getState }
|
|
21194
21208
|
},
|
|
21195
|
-
/* @__PURE__ */
|
|
21209
|
+
/* @__PURE__ */ React58.createElement(MenuComponent, { domProps: props.domProps })
|
|
21196
21210
|
);
|
|
21197
21211
|
}
|
|
21198
21212
|
function Menu(props) {
|
|
@@ -21234,24 +21248,24 @@ function Menu(props) {
|
|
|
21234
21248
|
//@ts-ignore
|
|
21235
21249
|
"__is_infinite_menu_component"
|
|
21236
21250
|
]);
|
|
21237
|
-
const menu = /* @__PURE__ */
|
|
21251
|
+
const menu = /* @__PURE__ */ React58.createElement(
|
|
21238
21252
|
MenuRoot,
|
|
21239
21253
|
__spreadValues({
|
|
21240
21254
|
addSubmenuColumnIfNeeded,
|
|
21241
21255
|
bubbleActionsFromSubmenus,
|
|
21242
21256
|
wrapLabels
|
|
21243
21257
|
}, props),
|
|
21244
|
-
/* @__PURE__ */
|
|
21258
|
+
/* @__PURE__ */ React58.createElement(MenuContextProvider, { domProps })
|
|
21245
21259
|
);
|
|
21246
21260
|
if (false) {
|
|
21247
|
-
return /* @__PURE__ */
|
|
21261
|
+
return /* @__PURE__ */ React58.createElement(React58.StrictMode, null, menu);
|
|
21248
21262
|
}
|
|
21249
21263
|
return menu;
|
|
21250
21264
|
}
|
|
21251
21265
|
Menu[propToIdentifyMenu] = true;
|
|
21252
21266
|
|
|
21253
21267
|
// src/components/InfiniteTable/utils/defaultGetColumnMenuItems.tsx
|
|
21254
|
-
var
|
|
21268
|
+
var React59 = __toESM(require("react"));
|
|
21255
21269
|
function defaultGetColumnMenuItems(_items, params) {
|
|
21256
21270
|
const { columnApi, column, getComputed, api } = params;
|
|
21257
21271
|
const sortable = columnApi.isSortable();
|
|
@@ -21338,7 +21352,7 @@ function defaultGetColumnMenuItems(_items, params) {
|
|
|
21338
21352
|
colItems.push({
|
|
21339
21353
|
key: id,
|
|
21340
21354
|
label,
|
|
21341
|
-
check: /* @__PURE__ */
|
|
21355
|
+
check: /* @__PURE__ */ React59.createElement(
|
|
21342
21356
|
InfiniteCheckBox,
|
|
21343
21357
|
{
|
|
21344
21358
|
key: col.id,
|
|
@@ -21401,7 +21415,7 @@ function getMenuForColumn(columnId, context, onHideIntent) {
|
|
|
21401
21415
|
if (!items || !items.length) {
|
|
21402
21416
|
return null;
|
|
21403
21417
|
}
|
|
21404
|
-
return /* @__PURE__ */
|
|
21418
|
+
return /* @__PURE__ */ React60.createElement(
|
|
21405
21419
|
MenuCmp,
|
|
21406
21420
|
{
|
|
21407
21421
|
autoFocus: true,
|
|
@@ -21521,7 +21535,7 @@ function useColumnMenu() {
|
|
|
21521
21535
|
}
|
|
21522
21536
|
|
|
21523
21537
|
// src/components/InfiniteTable/components/FocusDetect.tsx
|
|
21524
|
-
var
|
|
21538
|
+
var React61 = __toESM(require("react"));
|
|
21525
21539
|
var import_react59 = require("react");
|
|
21526
21540
|
var style = {
|
|
21527
21541
|
width: 0,
|
|
@@ -21555,7 +21569,7 @@ function FocusDetect() {
|
|
|
21555
21569
|
};
|
|
21556
21570
|
focusLastFocusableCell(context);
|
|
21557
21571
|
}), []);
|
|
21558
|
-
return /* @__PURE__ */
|
|
21572
|
+
return /* @__PURE__ */ React61.createElement(
|
|
21559
21573
|
"div",
|
|
21560
21574
|
{
|
|
21561
21575
|
onFocus,
|
|
@@ -21686,18 +21700,18 @@ function useEditingCallbackProps() {
|
|
|
21686
21700
|
var import_react61 = require("react");
|
|
21687
21701
|
|
|
21688
21702
|
// src/components/InfiniteTable/utils/getFilterOperatorMenuForColumn.tsx
|
|
21689
|
-
var
|
|
21703
|
+
var React64 = __toESM(require("react"));
|
|
21690
21704
|
|
|
21691
21705
|
// src/components/InfiniteTable/components/icons/ClearIcon.tsx
|
|
21692
|
-
var
|
|
21706
|
+
var React62 = __toESM(require("react"));
|
|
21693
21707
|
var ClearIcon = (props) => {
|
|
21694
|
-
return /* @__PURE__ */
|
|
21708
|
+
return /* @__PURE__ */ React62.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React62.createElement("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }));
|
|
21695
21709
|
};
|
|
21696
21710
|
|
|
21697
21711
|
// src/components/InfiniteTable/components/icons/DoneIcon.tsx
|
|
21698
|
-
var
|
|
21712
|
+
var React63 = __toESM(require("react"));
|
|
21699
21713
|
var DoneIcon = (props) => {
|
|
21700
|
-
return /* @__PURE__ */
|
|
21714
|
+
return /* @__PURE__ */ React63.createElement(Icon, __spreadValues({}, props), /* @__PURE__ */ React63.createElement("path", { d: "m9.55 19-6.725-6.725L5.25 9.85l4.3 4.325 9.225-9.225 2.425 2.4Z" }));
|
|
21701
21715
|
};
|
|
21702
21716
|
|
|
21703
21717
|
// src/components/InfiniteTable/utils/getFilterOperatorMenuForColumn.tsx
|
|
@@ -21743,12 +21757,12 @@ function getFilterOperatorMenuForColumn(columnId, context, onHideIntent) {
|
|
|
21743
21757
|
const IconCmp = (_b = (_a2 = operator.components) == null ? void 0 : _a2.Icon) != null ? _b : FilterIcon;
|
|
21744
21758
|
return {
|
|
21745
21759
|
key,
|
|
21746
|
-
icon: /* @__PURE__ */
|
|
21747
|
-
label: /* @__PURE__ */
|
|
21760
|
+
icon: /* @__PURE__ */ React64.createElement(IconCmp, null),
|
|
21761
|
+
label: /* @__PURE__ */ React64.createElement(React64.Fragment, null, (_c = operator.label) != null ? _c : operator.name),
|
|
21748
21762
|
onAction: () => {
|
|
21749
21763
|
api.setColumnFilterOperator(columnId, key);
|
|
21750
21764
|
},
|
|
21751
|
-
checked: checked ? /* @__PURE__ */
|
|
21765
|
+
checked: checked ? /* @__PURE__ */ React64.createElement(DoneIcon, { size: 16 }) : null
|
|
21752
21766
|
};
|
|
21753
21767
|
});
|
|
21754
21768
|
const firstItems = [
|
|
@@ -21763,7 +21777,7 @@ function getFilterOperatorMenuForColumn(columnId, context, onHideIntent) {
|
|
|
21763
21777
|
{
|
|
21764
21778
|
key: "reset",
|
|
21765
21779
|
label: "Reset",
|
|
21766
|
-
icon: /* @__PURE__ */
|
|
21780
|
+
icon: /* @__PURE__ */ React64.createElement(ClearIcon, null),
|
|
21767
21781
|
disabled: !column.computedFiltered,
|
|
21768
21782
|
onAction: () => {
|
|
21769
21783
|
api.clearColumnFilter(columnId);
|
|
@@ -21785,7 +21799,7 @@ function getFilterOperatorMenuForColumn(columnId, context, onHideIntent) {
|
|
|
21785
21799
|
filterTypes
|
|
21786
21800
|
};
|
|
21787
21801
|
const items = getFilterOperatorMenuItems ? getFilterOperatorMenuItems(defaultItems, param) : defaultItems;
|
|
21788
|
-
return /* @__PURE__ */
|
|
21802
|
+
return /* @__PURE__ */ React64.createElement(
|
|
21789
21803
|
MenuCmp,
|
|
21790
21804
|
{
|
|
21791
21805
|
autoFocus: true,
|
|
@@ -21892,7 +21906,7 @@ function useColumnFilterOperatorMenu() {
|
|
|
21892
21906
|
var import_react62 = require("react");
|
|
21893
21907
|
|
|
21894
21908
|
// src/components/InfiniteTable/utils/getCellContextMenu.tsx
|
|
21895
|
-
var
|
|
21909
|
+
var React65 = __toESM(require("react"));
|
|
21896
21910
|
function getCellContextMenu(cellLocation, context, onHideIntent) {
|
|
21897
21911
|
var _a;
|
|
21898
21912
|
const { columnId, rowIndex, event } = cellLocation;
|
|
@@ -21932,7 +21946,7 @@ function getCellContextMenu(cellLocation, context, onHideIntent) {
|
|
|
21932
21946
|
}
|
|
21933
21947
|
return {
|
|
21934
21948
|
preventDefault: true,
|
|
21935
|
-
menu: /* @__PURE__ */
|
|
21949
|
+
menu: /* @__PURE__ */ React65.createElement(
|
|
21936
21950
|
MenuCmp,
|
|
21937
21951
|
{
|
|
21938
21952
|
columns: menuColumns,
|
|
@@ -21987,7 +22001,7 @@ function getTableContextMenu(menuLocation, context, onHideIntent) {
|
|
|
21987
22001
|
}
|
|
21988
22002
|
return {
|
|
21989
22003
|
preventDefault: true,
|
|
21990
|
-
menu: /* @__PURE__ */
|
|
22004
|
+
menu: /* @__PURE__ */ React65.createElement(
|
|
21991
22005
|
MenuCmp,
|
|
21992
22006
|
{
|
|
21993
22007
|
columns: menuColumns,
|
|
@@ -22191,6 +22205,83 @@ function useTableContextMenu() {
|
|
|
22191
22205
|
return { menuPortal };
|
|
22192
22206
|
}
|
|
22193
22207
|
|
|
22208
|
+
// src/components/InfiniteTable/components/HScrollSyncContent.tsx
|
|
22209
|
+
var import_react64 = require("react");
|
|
22210
|
+
var React66 = __toESM(require("react"));
|
|
22211
|
+
|
|
22212
|
+
// src/components/InfiniteTable/hooks/useGridScroll.ts
|
|
22213
|
+
var import_react63 = require("react");
|
|
22214
|
+
function useGridScroll(onScroll, deps) {
|
|
22215
|
+
const {
|
|
22216
|
+
state: { brain }
|
|
22217
|
+
} = useInfiniteTable();
|
|
22218
|
+
const memoizedOnScroll = (0, import_react63.useCallback)(onScroll, deps);
|
|
22219
|
+
(0, import_react63.useEffect)(() => {
|
|
22220
|
+
const removeOnScroll = brain.onScroll(memoizedOnScroll);
|
|
22221
|
+
return removeOnScroll;
|
|
22222
|
+
}, [brain, memoizedOnScroll]);
|
|
22223
|
+
}
|
|
22224
|
+
|
|
22225
|
+
// src/components/InfiniteTable/components/HScrollSyncContent.css.ts
|
|
22226
|
+
var HScrollSyncContentCls = "HScrollSyncContent_HScrollSyncContentCls__yzx0vj0";
|
|
22227
|
+
|
|
22228
|
+
// src/components/InfiniteTable/components/HScrollSyncContent.tsx
|
|
22229
|
+
function HScrollSyncContent(props) {
|
|
22230
|
+
const _a = props, { width, maxWidth, minWidth, scrollable } = _a, domProps = __objRest(_a, ["width", "maxWidth", "minWidth", "scrollable"]);
|
|
22231
|
+
const domRef = (0, import_react64.useRef)(null);
|
|
22232
|
+
useGridScroll(
|
|
22233
|
+
(scrollPos) => {
|
|
22234
|
+
if (domRef.current && scrollable !== false) {
|
|
22235
|
+
domRef.current.style.transform = `translate3d(${-scrollPos.scrollLeft}px, 0px, 0px)`;
|
|
22236
|
+
}
|
|
22237
|
+
},
|
|
22238
|
+
[scrollable]
|
|
22239
|
+
);
|
|
22240
|
+
const style2 = __spreadValues({}, domProps.style);
|
|
22241
|
+
if (width === "column") {
|
|
22242
|
+
style2.width = ThemeVars.runtime.totalVisibleColumnsWidth;
|
|
22243
|
+
} else if (width === "viewport") {
|
|
22244
|
+
style2.width = ThemeVars.runtime.bodyWidth;
|
|
22245
|
+
}
|
|
22246
|
+
if (minWidth === "column") {
|
|
22247
|
+
style2.minWidth = ThemeVars.runtime.totalVisibleColumnsWidth;
|
|
22248
|
+
} else if (minWidth === "viewport") {
|
|
22249
|
+
style2.minWidth = ThemeVars.runtime.bodyWidth;
|
|
22250
|
+
}
|
|
22251
|
+
if (maxWidth === "column") {
|
|
22252
|
+
style2.maxWidth = ThemeVars.runtime.totalVisibleColumnsWidth;
|
|
22253
|
+
} else if (maxWidth === "viewport") {
|
|
22254
|
+
style2.maxWidth = ThemeVars.runtime.bodyWidth;
|
|
22255
|
+
}
|
|
22256
|
+
return /* @__PURE__ */ React66.createElement(
|
|
22257
|
+
"div",
|
|
22258
|
+
__spreadProps(__spreadValues({
|
|
22259
|
+
ref: domRef
|
|
22260
|
+
}, domProps), {
|
|
22261
|
+
className: domProps.className ? join(domProps.className, HScrollSyncContentCls) : HScrollSyncContentCls,
|
|
22262
|
+
style: style2
|
|
22263
|
+
}),
|
|
22264
|
+
domProps.children
|
|
22265
|
+
);
|
|
22266
|
+
}
|
|
22267
|
+
|
|
22268
|
+
// src/components/InfiniteTable/hooks/useVisibleColumnSizes.ts
|
|
22269
|
+
var columnWidthAtIndex6 = stripVar(InternalVars.columnWidthAtIndex);
|
|
22270
|
+
var columnOffsetAtIndex5 = stripVar(InternalVars.columnOffsetAtIndex);
|
|
22271
|
+
function useVisibleColumnSizes() {
|
|
22272
|
+
const context = useInfiniteTable();
|
|
22273
|
+
return context.computed.computedVisibleColumns.map((column) => {
|
|
22274
|
+
return {
|
|
22275
|
+
id: column.id,
|
|
22276
|
+
width: column.computedWidth,
|
|
22277
|
+
cssVarForWidth: `var(${columnWidthAtIndex6}-${column.computedVisibleIndex})`,
|
|
22278
|
+
offset: column.computedOffset,
|
|
22279
|
+
cssVarForOffset: `var(${columnOffsetAtIndex5}-${column.computedVisibleIndex})`,
|
|
22280
|
+
pinned: column.computedPinned
|
|
22281
|
+
};
|
|
22282
|
+
});
|
|
22283
|
+
}
|
|
22284
|
+
|
|
22194
22285
|
// src/components/InfiniteTable/index.tsx
|
|
22195
22286
|
var InfiniteTableClassName = internalProps.rootClassName;
|
|
22196
22287
|
var HOVERED_CLASS_NAMES = [RowHoverCls, "InfiniteColumnCell--hovered"];
|
|
@@ -22208,44 +22299,154 @@ var InfiniteTableRoot = getComponentStateRoot({
|
|
|
22208
22299
|
rowHeight: true,
|
|
22209
22300
|
columnHeaderHeight: true
|
|
22210
22301
|
},
|
|
22302
|
+
//@ts-ignore
|
|
22303
|
+
mappedCallbacks: getMappedCallbacks2(),
|
|
22211
22304
|
// @ts-ignore
|
|
22212
22305
|
getParentState: () => useDataSource(),
|
|
22213
22306
|
debugName: "InfiniteTable"
|
|
22214
22307
|
});
|
|
22308
|
+
function InfiniteTableHeader2() {
|
|
22309
|
+
const context = useInfiniteTable();
|
|
22310
|
+
const { state: componentState, getComputed } = context;
|
|
22311
|
+
const { header, brain, headerBrain } = componentState;
|
|
22312
|
+
const { scrollbars } = getComputed();
|
|
22313
|
+
return header ? /* @__PURE__ */ React67.createElement(
|
|
22314
|
+
TableHeaderWrapper,
|
|
22315
|
+
{
|
|
22316
|
+
bodyBrain: brain,
|
|
22317
|
+
headerBrain,
|
|
22318
|
+
scrollbars
|
|
22319
|
+
}
|
|
22320
|
+
) : null;
|
|
22321
|
+
}
|
|
22322
|
+
var InfiniteTableBodyCls = join(
|
|
22323
|
+
`${rootClassName2}Body`,
|
|
22324
|
+
position.relative,
|
|
22325
|
+
flex["1"],
|
|
22326
|
+
transformTranslateZero
|
|
22327
|
+
);
|
|
22328
|
+
function InfiniteTableBodyContainer(props) {
|
|
22329
|
+
return /* @__PURE__ */ React67.createElement(
|
|
22330
|
+
"div",
|
|
22331
|
+
__spreadProps(__spreadValues({}, props), {
|
|
22332
|
+
className: props.className ? join(InfiniteTableBodyCls, props.className) : InfiniteTableBodyCls
|
|
22333
|
+
})
|
|
22334
|
+
);
|
|
22335
|
+
}
|
|
22336
|
+
function InfiniteTableBody() {
|
|
22337
|
+
var _a;
|
|
22338
|
+
const context = useInfiniteTable();
|
|
22339
|
+
const masterContext = useMasterDetailContext();
|
|
22340
|
+
const { state: componentState, getComputed, api } = context;
|
|
22341
|
+
const {
|
|
22342
|
+
renderer,
|
|
22343
|
+
onRenderUpdater,
|
|
22344
|
+
debugId,
|
|
22345
|
+
keyboardNavigation,
|
|
22346
|
+
activeRowIndex,
|
|
22347
|
+
loadingText,
|
|
22348
|
+
scrollStopDelay,
|
|
22349
|
+
brain,
|
|
22350
|
+
scrollerDOMRef,
|
|
22351
|
+
components: components2,
|
|
22352
|
+
bodySize,
|
|
22353
|
+
activeCellIndex,
|
|
22354
|
+
rowDetailRenderer
|
|
22355
|
+
} = componentState;
|
|
22356
|
+
const LoadMaskCmp = (_a = components2 == null ? void 0 : components2.LoadMask) != null ? _a : LoadMask;
|
|
22357
|
+
const computed = getComputed();
|
|
22358
|
+
const { computedRowHeight, computedRowSizeCacheForDetails } = computed;
|
|
22359
|
+
const activeCellRowHeight = (computedRowSizeCacheForDetails == null ? void 0 : computedRowSizeCacheForDetails.getRowHeight) || computedRowHeight;
|
|
22360
|
+
const {
|
|
22361
|
+
componentState: { loading }
|
|
22362
|
+
} = useDataSourceContextValue();
|
|
22363
|
+
const onContextMenu = React67.useCallback((event) => {
|
|
22364
|
+
const state = context.getState();
|
|
22365
|
+
const target = event.target;
|
|
22366
|
+
if (!masterContext && event._from_row_detail) {
|
|
22367
|
+
return;
|
|
22368
|
+
}
|
|
22369
|
+
if (masterContext) {
|
|
22370
|
+
event._from_row_detail = true;
|
|
22371
|
+
}
|
|
22372
|
+
const cell = selectParentUntil(
|
|
22373
|
+
target,
|
|
22374
|
+
getCellSelector(),
|
|
22375
|
+
state.domRef.current
|
|
22376
|
+
);
|
|
22377
|
+
let columnId;
|
|
22378
|
+
let colIndex;
|
|
22379
|
+
let rowId;
|
|
22380
|
+
let rowIndex;
|
|
22381
|
+
if (cell) {
|
|
22382
|
+
colIndex = Number(cell.dataset.colIndex);
|
|
22383
|
+
rowIndex = Number(cell.dataset.rowIndex);
|
|
22384
|
+
columnId = context.getComputed().computedVisibleColumns[colIndex].id;
|
|
22385
|
+
rowId = context.dataSourceApi.getRowInfoArray()[rowIndex].id;
|
|
22386
|
+
}
|
|
22387
|
+
const param = {
|
|
22388
|
+
columnId,
|
|
22389
|
+
colIndex,
|
|
22390
|
+
rowId,
|
|
22391
|
+
rowIndex,
|
|
22392
|
+
event,
|
|
22393
|
+
target: cell != null ? cell : event.target
|
|
22394
|
+
};
|
|
22395
|
+
if (cell) {
|
|
22396
|
+
state.cellContextMenu(param);
|
|
22397
|
+
}
|
|
22398
|
+
state.contextMenu(param);
|
|
22399
|
+
}, []);
|
|
22400
|
+
const { renderCell, renderDetailRow } = useCellRendering({
|
|
22401
|
+
imperativeApi: api,
|
|
22402
|
+
getComputed,
|
|
22403
|
+
domRef: componentState.domRef,
|
|
22404
|
+
bodySize,
|
|
22405
|
+
computed
|
|
22406
|
+
});
|
|
22407
|
+
return /* @__PURE__ */ React67.createElement(InfiniteTableBodyContainer, { onContextMenu }, /* @__PURE__ */ React67.createElement(
|
|
22408
|
+
HeadlessTable,
|
|
22409
|
+
{
|
|
22410
|
+
debugId,
|
|
22411
|
+
tabIndex: 0,
|
|
22412
|
+
activeRowIndex: componentState.ready && keyboardNavigation === "row" ? activeRowIndex : null,
|
|
22413
|
+
activeCellIndex: componentState.ready && keyboardNavigation === "cell" && // we want to hide the active cell indicator while column reodering is happening
|
|
22414
|
+
!componentState.columnReorderDragColumnId ? activeCellIndex : null,
|
|
22415
|
+
scrollStopDelay,
|
|
22416
|
+
renderer,
|
|
22417
|
+
onRenderUpdater,
|
|
22418
|
+
brain,
|
|
22419
|
+
activeCellRowHeight,
|
|
22420
|
+
renderCell,
|
|
22421
|
+
renderDetailRow: rowDetailRenderer ? renderDetailRow : void 0,
|
|
22422
|
+
cellHoverClassNames: HOVERED_CLASS_NAMES,
|
|
22423
|
+
scrollerDOMRef
|
|
22424
|
+
}
|
|
22425
|
+
), /* @__PURE__ */ React67.createElement(LoadMaskCmp, { visible: loading }, loadingText));
|
|
22426
|
+
}
|
|
22215
22427
|
var InfiniteTableComponent = React67.memo(
|
|
22216
22428
|
function InfiniteTableComponent2() {
|
|
22217
|
-
var _a;
|
|
22218
22429
|
const context = useInfiniteTable();
|
|
22219
22430
|
const masterContext = useMasterDetailContext();
|
|
22220
|
-
const { state: componentState,
|
|
22431
|
+
const { state: componentState, api, children: initialChildren } = context;
|
|
22221
22432
|
const {
|
|
22222
|
-
componentState: {
|
|
22433
|
+
componentState: { dataArray },
|
|
22223
22434
|
getState: getDataSourceState,
|
|
22224
22435
|
componentActions: dataSourceActions
|
|
22225
22436
|
} = useDataSourceContextValue();
|
|
22226
22437
|
const {
|
|
22227
22438
|
domRef,
|
|
22228
|
-
scrollerDOMRef,
|
|
22229
22439
|
portalDOMRef,
|
|
22230
|
-
loadingText,
|
|
22231
|
-
rowDetailRenderer,
|
|
22232
|
-
header,
|
|
22233
22440
|
onRowHeightCSSVarChange,
|
|
22234
22441
|
onRowDetailHeightCSSVarChange,
|
|
22235
22442
|
onColumnHeaderHeightCSSVarChange,
|
|
22236
22443
|
rowHeightCSSVar,
|
|
22237
22444
|
rowDetailHeightCSSVar,
|
|
22238
22445
|
columnHeaderHeightCSSVar,
|
|
22239
|
-
components: components2,
|
|
22240
22446
|
scrollStopDelay,
|
|
22241
22447
|
brain,
|
|
22242
|
-
headerBrain,
|
|
22243
|
-
renderer,
|
|
22244
|
-
keyboardNavigation,
|
|
22245
22448
|
activeRowIndex,
|
|
22246
|
-
activeCellIndex
|
|
22247
|
-
onRenderUpdater,
|
|
22248
|
-
debugId
|
|
22449
|
+
activeCellIndex
|
|
22249
22450
|
} = componentState;
|
|
22250
22451
|
let { licenseKey } = componentState;
|
|
22251
22452
|
if (!licenseKey && InfiniteTable.licenseKey) {
|
|
@@ -22254,16 +22455,6 @@ var InfiniteTableComponent = React67.memo(
|
|
|
22254
22455
|
useScrollToActiveRow(activeRowIndex, dataArray.length, api);
|
|
22255
22456
|
useScrollToActiveCell(activeCellIndex, dataArray.length, api);
|
|
22256
22457
|
const { onKeyDown: onKeyDown2 } = useDOMEventHandlers();
|
|
22257
|
-
const { bodySize } = componentState;
|
|
22258
|
-
const { scrollbars, computedRowHeight, computedRowSizeCacheForDetails } = computed;
|
|
22259
|
-
const activeCellRowHeight = (computedRowSizeCacheForDetails == null ? void 0 : computedRowSizeCacheForDetails.getRowHeight) || computedRowHeight;
|
|
22260
|
-
const { renderCell, renderDetailRow } = useCellRendering({
|
|
22261
|
-
imperativeApi: api,
|
|
22262
|
-
getComputed,
|
|
22263
|
-
domRef: componentState.domRef,
|
|
22264
|
-
bodySize,
|
|
22265
|
-
computed
|
|
22266
|
-
});
|
|
22267
22458
|
React67.useEffect(() => {
|
|
22268
22459
|
const dataSourceState = getDataSourceState();
|
|
22269
22460
|
const onChange = debounce(
|
|
@@ -22279,7 +22470,6 @@ var InfiniteTableComponent = React67.memo(
|
|
|
22279
22470
|
}, [brain, scrollStopDelay]);
|
|
22280
22471
|
const licenseValid = useLicense(licenseKey);
|
|
22281
22472
|
const domProps = useDOMProps(componentState.domProps);
|
|
22282
|
-
const LoadMaskCmp = (_a = components2 == null ? void 0 : components2.LoadMask) != null ? _a : LoadMask;
|
|
22283
22473
|
React67.useEffect(() => {
|
|
22284
22474
|
brain.setScrollStopDelay(scrollStopDelay);
|
|
22285
22475
|
dataSourceActions.scrollStopDelayUpdatedByTable = scrollStopDelay;
|
|
@@ -22303,74 +22493,13 @@ var InfiniteTableComponent = React67.memo(
|
|
|
22303
22493
|
globalThis.infiniteApi = context.api;
|
|
22304
22494
|
}
|
|
22305
22495
|
}, [componentState.ready]);
|
|
22306
|
-
const onContextMenu = React67.useCallback((event) => {
|
|
22307
|
-
const state = context.getState();
|
|
22308
|
-
const target = event.target;
|
|
22309
|
-
if (!masterContext && event._from_row_detail) {
|
|
22310
|
-
return;
|
|
22311
|
-
}
|
|
22312
|
-
if (masterContext) {
|
|
22313
|
-
event._from_row_detail = true;
|
|
22314
|
-
}
|
|
22315
|
-
const cell = selectParentUntil(
|
|
22316
|
-
target,
|
|
22317
|
-
getCellSelector(),
|
|
22318
|
-
state.domRef.current
|
|
22319
|
-
);
|
|
22320
|
-
let columnId;
|
|
22321
|
-
let colIndex;
|
|
22322
|
-
let rowId;
|
|
22323
|
-
let rowIndex;
|
|
22324
|
-
if (cell) {
|
|
22325
|
-
colIndex = Number(cell.dataset.colIndex);
|
|
22326
|
-
rowIndex = Number(cell.dataset.rowIndex);
|
|
22327
|
-
columnId = context.getComputed().computedVisibleColumns[colIndex].id;
|
|
22328
|
-
rowId = context.dataSourceApi.getRowInfoArray()[rowIndex].id;
|
|
22329
|
-
}
|
|
22330
|
-
const param = {
|
|
22331
|
-
columnId,
|
|
22332
|
-
colIndex,
|
|
22333
|
-
rowId,
|
|
22334
|
-
rowIndex,
|
|
22335
|
-
event,
|
|
22336
|
-
target: cell != null ? cell : event.target
|
|
22337
|
-
};
|
|
22338
|
-
if (cell) {
|
|
22339
|
-
state.cellContextMenu(param);
|
|
22340
|
-
}
|
|
22341
|
-
state.contextMenu(param);
|
|
22342
|
-
}, []);
|
|
22343
22496
|
React67.useEffect(() => {
|
|
22344
22497
|
if (masterContext) {
|
|
22345
22498
|
portalDOMRef.current = masterContext.getMasterState().portalDOMRef.current;
|
|
22346
22499
|
}
|
|
22347
22500
|
}, []);
|
|
22348
|
-
|
|
22349
|
-
|
|
22350
|
-
{
|
|
22351
|
-
bodyBrain: brain,
|
|
22352
|
-
headerBrain,
|
|
22353
|
-
scrollbars
|
|
22354
|
-
}
|
|
22355
|
-
) : null, /* @__PURE__ */ React67.createElement(InfiniteTableBody, { onContextMenu }, /* @__PURE__ */ React67.createElement(
|
|
22356
|
-
HeadlessTable,
|
|
22357
|
-
{
|
|
22358
|
-
debugId,
|
|
22359
|
-
tabIndex: 0,
|
|
22360
|
-
activeRowIndex: componentState.ready && keyboardNavigation === "row" ? activeRowIndex : null,
|
|
22361
|
-
activeCellIndex: componentState.ready && keyboardNavigation === "cell" && // we want to hide the active cell indicator while column reodering is happening
|
|
22362
|
-
!componentState.columnReorderDragColumnId ? activeCellIndex : null,
|
|
22363
|
-
scrollStopDelay,
|
|
22364
|
-
renderer,
|
|
22365
|
-
onRenderUpdater,
|
|
22366
|
-
brain,
|
|
22367
|
-
activeCellRowHeight,
|
|
22368
|
-
renderCell,
|
|
22369
|
-
renderDetailRow: rowDetailRenderer ? renderDetailRow : void 0,
|
|
22370
|
-
cellHoverClassNames: HOVERED_CLASS_NAMES,
|
|
22371
|
-
scrollerDOMRef
|
|
22372
|
-
}
|
|
22373
|
-
), /* @__PURE__ */ React67.createElement(LoadMaskCmp, { visible: loading }, loadingText)), /* @__PURE__ */ React67.createElement(
|
|
22501
|
+
const children = initialChildren != null ? initialChildren : /* @__PURE__ */ React67.createElement(React67.Fragment, null, /* @__PURE__ */ React67.createElement(InfiniteTableHeader2, null), /* @__PURE__ */ React67.createElement(InfiniteTableBody, null));
|
|
22502
|
+
return /* @__PURE__ */ React67.createElement("div", __spreadValues({ onKeyDown: onKeyDown2, ref: domRef }, domProps), children, /* @__PURE__ */ React67.createElement(
|
|
22374
22503
|
"div",
|
|
22375
22504
|
{
|
|
22376
22505
|
ref: portalDOMRef,
|
|
@@ -22404,10 +22533,12 @@ var InfiniteTableComponent = React67.memo(
|
|
|
22404
22533
|
varName: columnHeaderHeightCSSVar,
|
|
22405
22534
|
onChange: onColumnHeaderHeightCSSVarChange
|
|
22406
22535
|
}
|
|
22407
|
-
) : null,
|
|
22536
|
+
) : null, licenseValid ? null : /* @__PURE__ */ React67.createElement(InfiniteTableLicenseFooter, null), /* @__PURE__ */ React67.createElement(FocusDetect, null));
|
|
22408
22537
|
}
|
|
22409
22538
|
);
|
|
22410
|
-
function InfiniteTableContextProvider(
|
|
22539
|
+
function InfiniteTableContextProvider({
|
|
22540
|
+
children
|
|
22541
|
+
}) {
|
|
22411
22542
|
const { componentActions, componentState } = useComponentState();
|
|
22412
22543
|
const { scrollerDOMRef, scrollTopKey } = componentState;
|
|
22413
22544
|
const computed = useComputed();
|
|
@@ -22447,7 +22578,8 @@ function InfiniteTableContextProvider() {
|
|
|
22447
22578
|
getComputed,
|
|
22448
22579
|
getState,
|
|
22449
22580
|
api: imperativeApi,
|
|
22450
|
-
dataSourceApi
|
|
22581
|
+
dataSourceApi,
|
|
22582
|
+
children
|
|
22451
22583
|
};
|
|
22452
22584
|
useResizeObserver(
|
|
22453
22585
|
scrollerDOMRef,
|
|
@@ -22480,7 +22612,7 @@ var InfiniteTable = function(props) {
|
|
|
22480
22612
|
rowHeight: DEFAULT_ROW_HEIGHT,
|
|
22481
22613
|
columnHeaderHeight: DEFAULT_COLUMN_HEADER_HEIGHT
|
|
22482
22614
|
}, props),
|
|
22483
|
-
/* @__PURE__ */ React67.createElement(InfiniteTableContextProvider,
|
|
22615
|
+
/* @__PURE__ */ React67.createElement(InfiniteTableContextProvider, { children: props.children })
|
|
22484
22616
|
)
|
|
22485
22617
|
);
|
|
22486
22618
|
if (false) {
|
|
@@ -22488,6 +22620,10 @@ var InfiniteTable = function(props) {
|
|
|
22488
22620
|
}
|
|
22489
22621
|
return table;
|
|
22490
22622
|
};
|
|
22623
|
+
InfiniteTable.Header = InfiniteTableHeader2;
|
|
22624
|
+
InfiniteTable.Body = InfiniteTableBody;
|
|
22625
|
+
InfiniteTable.HScrollSyncContent = HScrollSyncContent;
|
|
22626
|
+
InfiniteTable.Footer = () => /* @__PURE__ */ React67.createElement(InfiniteTableFooter, null);
|
|
22491
22627
|
|
|
22492
22628
|
// src/components/InfiniteTable/eventHandlers/keyboardShortcuts.ts
|
|
22493
22629
|
var instantEdit = {
|
|
@@ -22534,7 +22670,7 @@ var keyboardShortcuts = {
|
|
|
22534
22670
|
};
|
|
22535
22671
|
|
|
22536
22672
|
// src/components/hooks/useInterceptedMap.ts
|
|
22537
|
-
var
|
|
22673
|
+
var import_react65 = require("react");
|
|
22538
22674
|
function interceptMap(map2, fns) {
|
|
22539
22675
|
const { set, delete: deleteKey, clear } = map2;
|
|
22540
22676
|
if (fns.set) {
|
|
@@ -22735,6 +22871,7 @@ var components = {
|
|
|
22735
22871
|
useDataSource,
|
|
22736
22872
|
useEffectWithChanges,
|
|
22737
22873
|
useEffectWithObject,
|
|
22874
|
+
useGridScroll,
|
|
22738
22875
|
useInfiniteColumnCell,
|
|
22739
22876
|
useInfiniteColumnEditor,
|
|
22740
22877
|
useInfiniteColumnFilterEditor,
|
|
@@ -22742,6 +22879,7 @@ var components = {
|
|
|
22742
22879
|
useMasterRowInfo,
|
|
22743
22880
|
useOverlay,
|
|
22744
22881
|
useOverlayPortal,
|
|
22745
|
-
useRowInfoReducers
|
|
22882
|
+
useRowInfoReducers,
|
|
22883
|
+
useVisibleColumnSizes
|
|
22746
22884
|
});
|
|
22747
22885
|
//!collapsed || lazyLoad;
|