@linzjs/step-ag-grid 29.1.2 → 29.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/components/Grid.d.ts +1 -1
- package/dist/src/components/GridPopoverHook.d.ts +2 -0
- package/dist/src/contexts/GridContext.d.ts +2 -2
- package/dist/src/utils/waitForCondition.d.ts +1 -1
- package/dist/step-ag-grid.cjs +147 -114
- package/dist/step-ag-grid.cjs.map +1 -1
- package/dist/step-ag-grid.esm.js +147 -115
- package/dist/step-ag-grid.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Grid.tsx +1 -1
- package/src/components/GridCell.tsx +34 -14
- package/src/components/GridPopoverHook.tsx +10 -15
- package/src/components/gridForm/GridFormDropDown.tsx +73 -49
- package/src/components/gridForm/GridFormMultiSelect.tsx +12 -4
- package/src/components/gridPopoverEdit/GridPopoverMessage.ts +1 -0
- package/src/contexts/GridContext.tsx +2 -2
- package/src/contexts/GridContextProvider.tsx +31 -23
- package/src/stories/grid/GridPopoutEditGeneric.stories.tsx +1 -1
- package/src/stories/grid/GridPopoverEditMultiSelect.stories.tsx +1 -1
- package/src/stories/grid/GridPopoverEditMultiSelectGrid.stories.tsx +1 -1
- package/src/stories/grid/gridFormInteraction/GridFormDropDownInteraction.stories.tsx +1 -1
- package/src/stories/grid/gridFormInteraction/GridFormEditBearingCorrectionInteraction.stories.tsx +2 -1
- package/src/stories/grid/gridFormInteraction/GridFormEditBearingInteraction.stories.tsx +1 -1
- package/src/stories/grid/gridFormInteraction/GridFormMultiSelectInteraction.stories.tsx +2 -1
- package/src/stories/grid/gridFormInteraction/GridFormPopoverMenuInteraction.stories.tsx +2 -2
- package/src/stories/grid/gridFormInteraction/GridFormTextAreaInteraction.stories.tsx +1 -1
- package/src/stories/grid/gridFormInteraction/GridFormTextInputInteraction.stories.tsx +1 -1
- package/src/stories/grid/interactions/GridKeyboardInteractions.stories.tsx +56 -13
- package/src/utils/waitForCondition.tsx +6 -2
package/dist/step-ag-grid.esm.js
CHANGED
|
@@ -3398,20 +3398,25 @@ const GridCell = (props, custom) => {
|
|
|
3398
3398
|
sortable: true,
|
|
3399
3399
|
resizable: true,
|
|
3400
3400
|
valueSetter: custom?.editor ? blockValueSetter : undefined,
|
|
3401
|
-
editable: props.editable ??
|
|
3402
|
-
...(custom?.editor
|
|
3403
|
-
|
|
3404
|
-
|
|
3405
|
-
|
|
3406
|
-
|
|
3401
|
+
editable: props.editable ?? !!custom?.editor,
|
|
3402
|
+
...(custom?.editor
|
|
3403
|
+
? {
|
|
3404
|
+
cellClassRules: GridCellMultiSelectClassRules,
|
|
3405
|
+
cellEditor: GenericCellEditorComponentWrapper(custom?.editor),
|
|
3406
|
+
}
|
|
3407
|
+
: {
|
|
3408
|
+
cellEditor: CellEditorToBlockEditing,
|
|
3409
|
+
}),
|
|
3407
3410
|
suppressKeyboardEvent: suppressCellKeyboardEvents,
|
|
3408
|
-
...(custom?.editorParams
|
|
3409
|
-
|
|
3410
|
-
|
|
3411
|
-
|
|
3412
|
-
|
|
3413
|
-
|
|
3414
|
-
|
|
3411
|
+
...(custom?.editorParams
|
|
3412
|
+
? {
|
|
3413
|
+
cellEditorParams: {
|
|
3414
|
+
...custom.editorParams,
|
|
3415
|
+
multiEdit: custom.multiEdit,
|
|
3416
|
+
preventAutoEdit: custom.preventAutoEdit ?? !custom?.editor,
|
|
3417
|
+
},
|
|
3418
|
+
}
|
|
3419
|
+
: { cellEditorParams: { preventAutoEdit: !custom?.editor } }),
|
|
3415
3420
|
// If there's a valueFormatter and no filterValueGetter then create a filterValueGetter
|
|
3416
3421
|
getQuickFilterText: filterValueGetter,
|
|
3417
3422
|
// Default value formatter, otherwise react freaks out on objects
|
|
@@ -3428,6 +3433,19 @@ const GridCell = (props, custom) => {
|
|
|
3428
3433
|
},
|
|
3429
3434
|
};
|
|
3430
3435
|
};
|
|
3436
|
+
/**
|
|
3437
|
+
* Ag-grid will start its own editor if editable is true and there is no cell editor
|
|
3438
|
+
* like in the case of a cell that is editable because it triggers a modal.
|
|
3439
|
+
* This will block that editor.
|
|
3440
|
+
*/
|
|
3441
|
+
const CellEditorToBlockEditing = ({ stopEditing }) => {
|
|
3442
|
+
useEffect(() => {
|
|
3443
|
+
defer(() => {
|
|
3444
|
+
stopEditing();
|
|
3445
|
+
});
|
|
3446
|
+
}, [stopEditing]);
|
|
3447
|
+
return jsx(Fragment, {});
|
|
3448
|
+
};
|
|
3431
3449
|
const GenericCellEditorComponentWrapper = (editor) => {
|
|
3432
3450
|
const obj = { editor };
|
|
3433
3451
|
return forwardRef(function GenericCellEditorComponentFr(cellEditorParams, _) {
|
|
@@ -3781,6 +3799,19 @@ const FormError = (props) => {
|
|
|
3781
3799
|
return (jsxs(Fragment, { children: [props.error && (jsxs("div", { className: "FormError", children: [jsx(LuiIcon, { alt: "error", name: "ic_error", className: "FormError-text-icon", size: "sm", status: "error" }), jsx("span", { className: "FormError-error", children: props.error })] })), props.helpText && !props.error && jsx("span", { className: 'FormError-helpText', children: props.helpText })] }));
|
|
3782
3800
|
};
|
|
3783
3801
|
|
|
3802
|
+
/**
|
|
3803
|
+
* Track previous values of states.
|
|
3804
|
+
*
|
|
3805
|
+
* @param value Value to track.
|
|
3806
|
+
*/
|
|
3807
|
+
const usePrevious = (value) => {
|
|
3808
|
+
const ref = useRef();
|
|
3809
|
+
useEffect(() => {
|
|
3810
|
+
ref.current = value;
|
|
3811
|
+
}, [value]);
|
|
3812
|
+
return ref.current;
|
|
3813
|
+
};
|
|
3814
|
+
|
|
3784
3815
|
function escapeStringRegexp(string) {
|
|
3785
3816
|
if (typeof string !== 'string') {
|
|
3786
3817
|
throw new TypeError('Expected a string');
|
|
@@ -3936,8 +3967,8 @@ const textMatch = (text, filter) => {
|
|
|
3936
3967
|
negativeFilters.every((superFilter) => values.every((value) => isMatch(value, superFilter)))));
|
|
3937
3968
|
};
|
|
3938
3969
|
|
|
3970
|
+
const CancelPromise = () => Promise.resolve(true);
|
|
3939
3971
|
const useGridPopoverHook = ({ className, save, invalid, dontSaveOnExternalClick, }) => {
|
|
3940
|
-
const { onBulkEditingComplete, redrawRows } = useGridContext();
|
|
3941
3972
|
const { anchorRef, saving, updateValue, stopEditing } = useGridPopoverContext();
|
|
3942
3973
|
const saveButtonRef = useRef(null);
|
|
3943
3974
|
const [isOpen, setOpen] = useState(false);
|
|
@@ -3946,27 +3977,18 @@ const useGridPopoverHook = ({ className, save, invalid, dontSaveOnExternalClick,
|
|
|
3946
3977
|
}, []);
|
|
3947
3978
|
const triggerSave = useCallback(async (reason) => {
|
|
3948
3979
|
if (reason == CloseReason.CANCEL) {
|
|
3980
|
+
await updateValue(CancelPromise, 0);
|
|
3949
3981
|
stopEditing();
|
|
3950
|
-
onBulkEditingComplete();
|
|
3951
|
-
redrawRows();
|
|
3952
3982
|
return;
|
|
3953
3983
|
}
|
|
3954
3984
|
if (invalid?.()) {
|
|
3955
3985
|
// Don't close, don't do anything it's invalid
|
|
3956
3986
|
return;
|
|
3957
3987
|
}
|
|
3958
|
-
if (
|
|
3959
|
-
// No save method so just close
|
|
3988
|
+
if (await updateValue(save ?? (() => Promise.resolve(true)), reason === CloseReason.TAB_FORWARD ? 1 : reason === CloseReason.TAB_BACKWARD ? -1 : 0)) {
|
|
3960
3989
|
stopEditing();
|
|
3961
|
-
onBulkEditingComplete();
|
|
3962
|
-
redrawRows();
|
|
3963
|
-
return;
|
|
3964
3990
|
}
|
|
3965
|
-
|
|
3966
|
-
stopEditing();
|
|
3967
|
-
redrawRows();
|
|
3968
|
-
}
|
|
3969
|
-
}, [invalid, onBulkEditingComplete, redrawRows, save, stopEditing, updateValue]);
|
|
3991
|
+
}, [invalid, save, stopEditing, updateValue]);
|
|
3970
3992
|
const popoverWrapper = useCallback((children) => {
|
|
3971
3993
|
return (jsx(Fragment, { children: anchorRef.current && (jsxs(ControlledMenu, { state: isOpen ? 'open' : 'closed', portal: true, unmountOnClose: true, anchorRef: anchorRef, saveButtonRef: saveButtonRef, menuClassName: 'step-ag-grid-react-menu', onClose: (event) => {
|
|
3972
3994
|
// Prevent menu from closing when modals are invoked
|
|
@@ -3986,13 +4008,14 @@ const useGridPopoverHook = ({ className, save, invalid, dontSaveOnExternalClick,
|
|
|
3986
4008
|
return {
|
|
3987
4009
|
popoverWrapper,
|
|
3988
4010
|
triggerSave,
|
|
4011
|
+
gridPopoverOpen: isOpen,
|
|
3989
4012
|
};
|
|
3990
4013
|
};
|
|
3991
4014
|
|
|
3992
4015
|
const primitiveToSelectOption = (value) => {
|
|
3993
4016
|
return {
|
|
3994
4017
|
value: value,
|
|
3995
|
-
label: value ? String(value) : '',
|
|
4018
|
+
label: value ? String(value) : '-',
|
|
3996
4019
|
};
|
|
3997
4020
|
};
|
|
3998
4021
|
const MenuSeparatorString = '_____MENU_SEPARATOR_____';
|
|
@@ -4006,6 +4029,7 @@ const fieldToString = (field) => {
|
|
|
4006
4029
|
};
|
|
4007
4030
|
const GridFormDropDown = (props) => {
|
|
4008
4031
|
const { selectedRows, field, data } = useGridPopoverContext();
|
|
4032
|
+
const { onSelectFilter, options: propOptions, onSelectedItem } = props;
|
|
4009
4033
|
// Save triggers during async action processing which triggers another selectItem(), this ref blocks that
|
|
4010
4034
|
const [filter, setFilter] = useState(props.filterDefaultValue ?? '');
|
|
4011
4035
|
const [filteredValues, setFilteredValues] = useState();
|
|
@@ -4019,8 +4043,8 @@ const GridFormDropDown = (props) => {
|
|
|
4019
4043
|
const hasChanged = selectedRows.some((row) => row[field] !== value) ||
|
|
4020
4044
|
(subComponentValue !== undefined && subComponentInitialValue.current !== JSON.stringify(subComponentValue));
|
|
4021
4045
|
if (hasChanged) {
|
|
4022
|
-
if (
|
|
4023
|
-
await
|
|
4046
|
+
if (onSelectedItem) {
|
|
4047
|
+
await onSelectedItem({
|
|
4024
4048
|
selectedRows,
|
|
4025
4049
|
selectedRowIds: selectedRows.map((row) => row.id),
|
|
4026
4050
|
value,
|
|
@@ -4032,21 +4056,72 @@ const GridFormDropDown = (props) => {
|
|
|
4032
4056
|
}
|
|
4033
4057
|
}
|
|
4034
4058
|
return true;
|
|
4035
|
-
}, [field,
|
|
4036
|
-
|
|
4037
|
-
|
|
4038
|
-
|
|
4039
|
-
|
|
4040
|
-
|
|
4041
|
-
|
|
4042
|
-
|
|
4043
|
-
|
|
4059
|
+
}, [field, onSelectedItem, selectedRows]);
|
|
4060
|
+
/**
|
|
4061
|
+
* Saves are wrapped in updateValue and triggered by blur events
|
|
4062
|
+
*/
|
|
4063
|
+
const save = useCallback(async () => {
|
|
4064
|
+
if (!options) {
|
|
4065
|
+
return true;
|
|
4066
|
+
}
|
|
4067
|
+
// Filter saved
|
|
4068
|
+
if (selectedItem === null) {
|
|
4069
|
+
if (onSelectFilter) {
|
|
4070
|
+
if (!isEmpty(filter)) {
|
|
4071
|
+
await onSelectFilter({
|
|
4072
|
+
selectedRows,
|
|
4073
|
+
selectedRowIds: selectedRows.map((row) => row.id),
|
|
4074
|
+
value: filter,
|
|
4075
|
+
});
|
|
4076
|
+
}
|
|
4077
|
+
return true;
|
|
4044
4078
|
}
|
|
4045
|
-
|
|
4046
|
-
|
|
4079
|
+
else {
|
|
4080
|
+
if (filteredValues && filteredValues.length === 1) {
|
|
4081
|
+
if (filteredValues[0].subComponent)
|
|
4082
|
+
return false;
|
|
4083
|
+
return await selectItemHandler(filteredValues[0].value, null);
|
|
4084
|
+
}
|
|
4047
4085
|
}
|
|
4048
|
-
|
|
4049
|
-
|
|
4086
|
+
return false;
|
|
4087
|
+
}
|
|
4088
|
+
if (selectedItem.subComponent && !subComponentIsValid.current) {
|
|
4089
|
+
return false;
|
|
4090
|
+
}
|
|
4091
|
+
await selectItemHandler(selectedItem.value, subSelectedValue);
|
|
4092
|
+
return true;
|
|
4093
|
+
}, [
|
|
4094
|
+
filter,
|
|
4095
|
+
filteredValues,
|
|
4096
|
+
onSelectFilter,
|
|
4097
|
+
options,
|
|
4098
|
+
selectItemHandler,
|
|
4099
|
+
selectedItem,
|
|
4100
|
+
selectedRows,
|
|
4101
|
+
subSelectedValue,
|
|
4102
|
+
]);
|
|
4103
|
+
const { popoverWrapper, gridPopoverOpen } = useGridPopoverHook({
|
|
4104
|
+
className: props.className,
|
|
4105
|
+
invalid: () => !options || !!(selectedItem && !subComponentIsValid.current),
|
|
4106
|
+
save,
|
|
4107
|
+
dontSaveOnExternalClick: true,
|
|
4108
|
+
});
|
|
4109
|
+
// Load up options list if it's async function
|
|
4110
|
+
const prevIsOpen = usePrevious(gridPopoverOpen);
|
|
4111
|
+
const prevFilter = usePrevious(filter);
|
|
4112
|
+
useEffect(() => {
|
|
4113
|
+
if ((gridPopoverOpen !== prevIsOpen || filter !== prevFilter) && gridPopoverOpen) {
|
|
4114
|
+
let optionsConf = propOptions;
|
|
4115
|
+
void (async () => {
|
|
4116
|
+
if (typeof optionsConf === 'function') {
|
|
4117
|
+
optionsConf = await optionsConf(selectedRows, filter);
|
|
4118
|
+
}
|
|
4119
|
+
if (optionsConf !== undefined) {
|
|
4120
|
+
setOptions(optionsConf);
|
|
4121
|
+
}
|
|
4122
|
+
})();
|
|
4123
|
+
}
|
|
4124
|
+
}, [filter, gridPopoverOpen, options, prevFilter, prevIsOpen, propOptions, selectedRows]);
|
|
4050
4125
|
// Local filtering.
|
|
4051
4126
|
useEffect(() => {
|
|
4052
4127
|
if (props.filtered == 'local') {
|
|
@@ -4074,39 +4149,6 @@ const GridFormDropDown = (props) => {
|
|
|
4074
4149
|
void reSearchOnFilterChange();
|
|
4075
4150
|
}
|
|
4076
4151
|
}, [filter, props, reSearchOnFilterChange]);
|
|
4077
|
-
/**
|
|
4078
|
-
* Saves are wrapped in updateValue and triggered by blur events
|
|
4079
|
-
*/
|
|
4080
|
-
const save = useCallback(async () => {
|
|
4081
|
-
if (!options)
|
|
4082
|
-
return true;
|
|
4083
|
-
// Filter saved
|
|
4084
|
-
if (selectedItem === null) {
|
|
4085
|
-
if (props.onSelectFilter) {
|
|
4086
|
-
const { onSelectFilter } = props;
|
|
4087
|
-
await onSelectFilter({ selectedRows, selectedRowIds: selectedRows.map((row) => row.id), value: filter });
|
|
4088
|
-
return true;
|
|
4089
|
-
}
|
|
4090
|
-
else {
|
|
4091
|
-
if (filteredValues && filteredValues.length === 1) {
|
|
4092
|
-
if (filteredValues[0].subComponent)
|
|
4093
|
-
return false;
|
|
4094
|
-
return await selectItemHandler(filteredValues[0].value, null);
|
|
4095
|
-
}
|
|
4096
|
-
}
|
|
4097
|
-
return false;
|
|
4098
|
-
}
|
|
4099
|
-
if (selectedItem.subComponent && !subComponentIsValid.current)
|
|
4100
|
-
return false;
|
|
4101
|
-
await selectItemHandler(selectedItem.value, subSelectedValue);
|
|
4102
|
-
return true;
|
|
4103
|
-
}, [filter, filteredValues, options, props, selectItemHandler, selectedItem, selectedRows, subSelectedValue]);
|
|
4104
|
-
const { popoverWrapper } = useGridPopoverHook({
|
|
4105
|
-
className: props.className,
|
|
4106
|
-
invalid: () => !options || !!(selectedItem && !subComponentIsValid.current),
|
|
4107
|
-
save,
|
|
4108
|
-
dontSaveOnExternalClick: true,
|
|
4109
|
-
});
|
|
4110
4152
|
let lastHeader = null;
|
|
4111
4153
|
let showHeader = null;
|
|
4112
4154
|
return popoverWrapper(jsxs(Fragment, { children: [props.filtered && (jsxs("div", { className: 'GridFormDropDown-filter', children: [jsx(FocusableItem, { className: 'filter-item', onFocus: () => {
|
|
@@ -4114,7 +4156,7 @@ const GridFormDropDown = (props) => {
|
|
|
4114
4156
|
setSubSelectedValue(null);
|
|
4115
4157
|
subComponentIsValid.current = true;
|
|
4116
4158
|
}, children: ({ ref }) => (jsxs("div", { style: { display: 'flex', flexDirection: 'column', width: '100%' }, children: [jsx("input", { className: 'LuiTextInput-input', ref: ref, type: "text", placeholder: props.filterPlaceholder ?? 'Filter...', "data-testid": 'filteredMenu-free-text-input', defaultValue: filter, "data-allowtabtosave": true, "data-disableenterautosave": !props.onSelectFilter &&
|
|
4117
|
-
!(filteredValues && filteredValues.length === 1 && !filteredValues[0].subComponent), onChange: (e) => setFilter(e.target.value) }), props.filterHelpText && isNotEmpty(filter) && (jsx(FormError, { error: null, helpText: props.filterHelpText }))] })) }), jsx(MenuDivider, {}, `$$divider_filter`)] })), jsx(ComponentLoadingWrapper, { loading: !options, className: 'GridFormDropDown-options', children: jsxs(Fragment, { children: [options && (isEmpty(options) || (filteredValues && isEmpty(filteredValues))) && (jsx(MenuItem, { className: 'GridPopoverEditDropDown-noOptions', disabled: true, children: props.noOptionsMessage ?? 'No Options' }, `${fieldToString(field)}-empty`)), options?.map((item, index) => {
|
|
4159
|
+
!(filteredValues && filteredValues.length === 1 && !filteredValues[0].subComponent), onChange: (e) => setFilter(e.target.value.trim()) }), props.filterHelpText && isNotEmpty(filter) && (jsx(FormError, { error: null, helpText: props.filterHelpText }))] })) }), jsx(MenuDivider, {}, `$$divider_filter`)] })), jsx(ComponentLoadingWrapper, { loading: !options, className: 'GridFormDropDown-options', children: jsxs(Fragment, { children: [options && (isEmpty(options) || (filteredValues && isEmpty(filteredValues))) && (jsx(MenuItem, { className: 'GridPopoverEditDropDown-noOptions', disabled: true, children: props.noOptionsMessage ?? 'No Options' }, `${fieldToString(field)}-empty`)), options?.map((item, index) => {
|
|
4118
4160
|
showHeader = null;
|
|
4119
4161
|
if (item.value === MenuSeparatorString) {
|
|
4120
4162
|
return jsx(MenuDivider, {}, `$$divider_${index}`);
|
|
@@ -4344,11 +4386,13 @@ const GridFormMultiSelect = (props) => {
|
|
|
4344
4386
|
props.invalid(selectedRows, options.filter((o) => o.checked)));
|
|
4345
4387
|
}, [options, props, selectedRows]);
|
|
4346
4388
|
const save = useCallback(async (selectedRows) => {
|
|
4347
|
-
if (!options || !props.onSave)
|
|
4389
|
+
if (!options || !props.onSave) {
|
|
4348
4390
|
return true;
|
|
4391
|
+
}
|
|
4349
4392
|
// Any changes to save?
|
|
4350
|
-
if (initialValues === JSON.stringify(options))
|
|
4393
|
+
if (initialValues === JSON.stringify(options)) {
|
|
4351
4394
|
return true;
|
|
4395
|
+
}
|
|
4352
4396
|
return props.onSave({
|
|
4353
4397
|
selectedRows,
|
|
4354
4398
|
selectedOptions: options.filter((o) => o.checked),
|
|
@@ -4441,8 +4485,9 @@ const FilterInput = (props) => {
|
|
|
4441
4485
|
setOptions([...options]);
|
|
4442
4486
|
}, [filter, headerGroups, options, setOptions]);
|
|
4443
4487
|
const addCustomFilterValue = useCallback(() => {
|
|
4444
|
-
if (!options || !onSelectFilter)
|
|
4488
|
+
if (!options || !onSelectFilter) {
|
|
4445
4489
|
return;
|
|
4490
|
+
}
|
|
4446
4491
|
const filterTrimmed = filter.trim();
|
|
4447
4492
|
if (isEmpty(filterTrimmed)) {
|
|
4448
4493
|
void triggerSave();
|
|
@@ -4451,8 +4496,9 @@ const FilterInput = (props) => {
|
|
|
4451
4496
|
const preFilterOptions = JSON.stringify(options);
|
|
4452
4497
|
onSelectFilter({ filter: filterTrimmed, options });
|
|
4453
4498
|
// Detect if options list changed and update
|
|
4454
|
-
if (preFilterOptions === JSON.stringify(options))
|
|
4499
|
+
if (preFilterOptions === JSON.stringify(options)) {
|
|
4455
4500
|
return;
|
|
4501
|
+
}
|
|
4456
4502
|
setOptions([...options]);
|
|
4457
4503
|
setFilter('');
|
|
4458
4504
|
}, [filter, onSelectFilter, options, setFilter, setOptions, triggerSave]);
|
|
@@ -5047,6 +5093,7 @@ const GridPopoverMessage = (colDef, props) => GridCell({
|
|
|
5047
5093
|
singleClickEdit: true,
|
|
5048
5094
|
}, {
|
|
5049
5095
|
editor: GridFormMessage,
|
|
5096
|
+
preventAutoEdit: true,
|
|
5050
5097
|
...props,
|
|
5051
5098
|
});
|
|
5052
5099
|
|
|
@@ -5062,7 +5109,7 @@ const GridWrapper = ({ children, maxHeight }) => (jsx("div", { className: 'Grid-
|
|
|
5062
5109
|
const getColId = (colDef) => colDef.colId ?? '';
|
|
5063
5110
|
const isFlexColumn = (colDef) => !!colDef.flex && !isGridCellFiller(colDef);
|
|
5064
5111
|
|
|
5065
|
-
const waitForCondition = async (condition, timeoutMs) => {
|
|
5112
|
+
const waitForCondition = async (error, condition, timeoutMs) => {
|
|
5066
5113
|
const endTime = Date.now() + timeoutMs;
|
|
5067
5114
|
while (Date.now() < endTime) {
|
|
5068
5115
|
if (condition()) {
|
|
@@ -5070,7 +5117,7 @@ const waitForCondition = async (condition, timeoutMs) => {
|
|
|
5070
5117
|
}
|
|
5071
5118
|
await wait(100);
|
|
5072
5119
|
}
|
|
5073
|
-
console.warn(
|
|
5120
|
+
console.warn(error);
|
|
5074
5121
|
return false;
|
|
5075
5122
|
};
|
|
5076
5123
|
|
|
@@ -5419,8 +5466,7 @@ const GridContextProvider = (props) => {
|
|
|
5419
5466
|
startCellEditingInProgressRef.current = true;
|
|
5420
5467
|
try {
|
|
5421
5468
|
// Edit in progress so don't edit until finished, timeout waiting after 5s
|
|
5422
|
-
if (!(await waitForCondition(() => !anyUpdating(),
|
|
5423
|
-
console.error("Could not start edit because previous edit hasn't finished after 5 seconds");
|
|
5469
|
+
if (!(await waitForCondition('startCellEditing failed as update still in progress, waited for 15 seconds', () => !anyUpdating(), 15000))) {
|
|
5424
5470
|
return;
|
|
5425
5471
|
}
|
|
5426
5472
|
const colDef = gridApi.getColumnDef(colId);
|
|
@@ -5442,11 +5488,12 @@ const GridContextProvider = (props) => {
|
|
|
5442
5488
|
const rowIndex = rowNode.rowIndex;
|
|
5443
5489
|
if (rowIndex != null) {
|
|
5444
5490
|
defer(() => {
|
|
5445
|
-
!gridApi.isDestroyed()
|
|
5491
|
+
if (!gridApi.isDestroyed()) {
|
|
5446
5492
|
gridApi.startEditingCell({
|
|
5447
5493
|
rowIndex,
|
|
5448
5494
|
colKey: colId,
|
|
5449
5495
|
});
|
|
5496
|
+
}
|
|
5450
5497
|
});
|
|
5451
5498
|
}
|
|
5452
5499
|
}
|
|
@@ -5455,9 +5502,9 @@ const GridContextProvider = (props) => {
|
|
|
5455
5502
|
}
|
|
5456
5503
|
}, [anyUpdating, gridApi, prePopupOps, waitForExternallySelectedItemsToBeInSync]);
|
|
5457
5504
|
const bulkEditingCompleteCallbackRef = useRef();
|
|
5458
|
-
const onBulkEditingComplete = useCallback(() => {
|
|
5505
|
+
const onBulkEditingComplete = useCallback(async () => {
|
|
5459
5506
|
resetFocusedCellAfterCellEditing();
|
|
5460
|
-
bulkEditingCompleteCallbackRef.current?.();
|
|
5507
|
+
await bulkEditingCompleteCallbackRef.current?.();
|
|
5461
5508
|
}, [resetFocusedCellAfterCellEditing]);
|
|
5462
5509
|
const setOnBulkEditingComplete = useCallback((cellEditingCompleteCallback) => {
|
|
5463
5510
|
bulkEditingCompleteCallbackRef.current = cellEditingCompleteCallback;
|
|
@@ -5488,8 +5535,10 @@ const GridContextProvider = (props) => {
|
|
|
5488
5535
|
// Prevent resetting focus to original editing cell
|
|
5489
5536
|
prePopupFocusedCell.current = undefined;
|
|
5490
5537
|
const preRow = gridApi.getFocusedCell();
|
|
5538
|
+
// If we don't do this ag-grid will do its own continuation of an edit on tab, we don't want that as
|
|
5539
|
+
// we are managing it ourselves
|
|
5540
|
+
gridApi.stopEditing();
|
|
5491
5541
|
if (tabDirection === 1) {
|
|
5492
|
-
gridApi.stopEditing();
|
|
5493
5542
|
gridApi.tabToNextCell();
|
|
5494
5543
|
}
|
|
5495
5544
|
else {
|
|
@@ -5526,29 +5575,25 @@ const GridContextProvider = (props) => {
|
|
|
5526
5575
|
const selectedRows = props.selectedRows;
|
|
5527
5576
|
let ok = false;
|
|
5528
5577
|
await modifyUpdating(props.field ?? '', selectedRows.map((data) => data.id), async () => {
|
|
5529
|
-
// MATT Disabled I don't believe these are needed anymore
|
|
5530
|
-
// I've left them here just in case they are
|
|
5531
5578
|
// Need to refresh to get spinners to work on all rows
|
|
5532
|
-
|
|
5579
|
+
gridApi.refreshCells({ rowNodes: props.selectedRows, force: true });
|
|
5533
5580
|
ok = await fnUpdate(selectedRows).catch((ex) => {
|
|
5534
5581
|
console.error('Exception during modifyUpdating', ex);
|
|
5535
5582
|
return false;
|
|
5536
5583
|
});
|
|
5537
5584
|
});
|
|
5538
|
-
// MATT Disabled I don't believe these are needed anymore
|
|
5539
|
-
// I've left them here just in case they are
|
|
5540
5585
|
// async processes need to refresh their own rows
|
|
5541
|
-
|
|
5586
|
+
gridApi.refreshCells({ rowNodes: selectedRows, force: true });
|
|
5542
5587
|
if (gridApi.isDestroyed()) {
|
|
5543
5588
|
return ok;
|
|
5544
5589
|
}
|
|
5545
5590
|
if (ok) {
|
|
5546
|
-
const cell = gridApi.getFocusedCell();
|
|
5547
|
-
if (cell && gridApi.getFocusedCell() == null) {
|
|
5548
|
-
|
|
5549
|
-
}
|
|
5591
|
+
//const cell = gridApi.getFocusedCell();
|
|
5592
|
+
//if (cell && gridApi.getFocusedCell() == null) {
|
|
5593
|
+
// !gridApi.isDestroyed && gridApi.setFocusedCell(cell.rowIndex, cell.column);
|
|
5594
|
+
// }
|
|
5550
5595
|
// This is needed to trigger postSortRowsHook
|
|
5551
|
-
gridApi.refreshClientSideRowModel();
|
|
5596
|
+
!gridApi.isDestroyed && gridApi.refreshClientSideRowModel();
|
|
5552
5597
|
}
|
|
5553
5598
|
void (async () => {
|
|
5554
5599
|
// Only focus next cell if user hasn't already manually changed focus
|
|
@@ -5558,11 +5603,11 @@ const GridContextProvider = (props) => {
|
|
|
5558
5603
|
prePopupFocusedCell.current.rowIndex == postPopupFocusedCell.rowIndex &&
|
|
5559
5604
|
prePopupFocusedCell.current.column.getColId() == postPopupFocusedCell.column.getColId()) {
|
|
5560
5605
|
if (!tabDirection || !(await selectNextEditableCell(tabDirection))) {
|
|
5561
|
-
onBulkEditingComplete();
|
|
5606
|
+
await onBulkEditingComplete();
|
|
5562
5607
|
}
|
|
5563
5608
|
}
|
|
5564
5609
|
else {
|
|
5565
|
-
onBulkEditingComplete();
|
|
5610
|
+
await onBulkEditingComplete();
|
|
5566
5611
|
}
|
|
5567
5612
|
})();
|
|
5568
5613
|
return ok;
|
|
@@ -5787,19 +5832,6 @@ const GridUpdatingContextProvider = (props) => {
|
|
|
5787
5832
|
var css_248z = ".ActionButton{align-items:center;display:flex}.ActionButton-inProgress .LuiIcon{visibility:hidden}.ActionButton-minimal.lui-button-lg.lui-button-icon-right{padding-right:38px}.ActionButton.lui-button-lg.lui-button-icon-right:not(.ActionButton-tight) .LuiIcon{margin:0 4px}.ActionButton.ActionButton-tight.lui-button-lg.lui-button-icon-right .LuiIcon{margin:0}.ActionButton-iconOnly.lui-button-lg.lui-button-icon-right:not(.ActionButton-tight){padding:8px 5px}.ActionButton-iconOnly.lui-button-lg.lui-button-icon-right.ActionButton-tight{padding:0}.ActionButton-minimalArea{position:relative}.ActionButton-minimalAreaDisplay{position:absolute}.ActionButton-minimalAreaExpand{visibility:hidden}.ActionButton-inProgress.lui-button-lg.lui-button-icon-right{background-color:#e2f3f7;color:#007198;cursor:progress}.ActionButton-fill{justify-content:center;width:100%}";
|
|
5788
5833
|
styleInject(css_248z);
|
|
5789
5834
|
|
|
5790
|
-
/**
|
|
5791
|
-
* Track previous values of states.
|
|
5792
|
-
*
|
|
5793
|
-
* @param value Value to track.
|
|
5794
|
-
*/
|
|
5795
|
-
const usePrevious = (value) => {
|
|
5796
|
-
const ref = useRef();
|
|
5797
|
-
useEffect(() => {
|
|
5798
|
-
ref.current = value;
|
|
5799
|
-
}, [value]);
|
|
5800
|
-
return ref.current;
|
|
5801
|
-
};
|
|
5802
|
-
|
|
5803
5835
|
// Kept this less than one second, so I don't have issues with waitFor as it defaults to 1s
|
|
5804
5836
|
const minimumInProgressTimeMs = 950;
|
|
5805
5837
|
const ActionButton = ({ icon, name, inProgressName, disabled, dataTestId, style, className, title, onClick, size = 'sm', iconPosition = 'left', level = 'tertiary', 'aria-label': ariaLabel, }) => {
|
|
@@ -5873,5 +5905,5 @@ const useDeferredPromise = () => {
|
|
|
5873
5905
|
};
|
|
5874
5906
|
};
|
|
5875
5907
|
|
|
5876
|
-
export { ActionButton, ComponentLoadingWrapper, ControlledMenu, Editor, FocusableItem, FormError, GenericCellEditorComponentWrapper, Grid, GridButton, GridCell, GridCellFiller, GridCellFillerColId, GridCellMultiEditor, GridCellMultiSelectClassRules, GridCellRenderer, GridContext, GridContextProvider, GridEditBoolean, GridFilterButtons, GridFilterColumnsToggle, GridFilterDownloadCsvButton, GridFilterHeaderIconButton, GridFilterQuick, GridFilters, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormMultiSelectGrid, GridFormPopoverMenu, GridFormSubComponentTextArea, GridFormSubComponentTextInput, GridFormTextArea, GridFormTextInput, GridIcon, GridLoadableCell, GridNoRowsOverlay, GridNoRowsOverlayFr, GridPopoutEditMultiSelect, GridPopoutEditMultiSelectGrid, GridPopoverContext, GridPopoverContextProvider, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditBearingCorrectionEditorParams, GridPopoverEditBearingEditorParams, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridSubComponentContext, GridUpdatingContext, GridUpdatingContextProvider, GridWrapper, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuHeaderItem, MenuHeaderString, MenuItem, MenuRadioGroup, MenuSeparator, MenuSeparatorString, PopoutMenuSeparator, SubMenu, TextAreaInput, TextInputFormatted, TextInputValidator, bearingCorrectionRangeValidator, bearingCorrectionValueFormatter, bearingNumberParser, bearingRangeValidator, bearingStringValidator, bearingValueFormatter, convertDDToDMS, defaultValueFormatter, downloadCsvUseValueFormattersProcessCellCallback, findParentWithClass, fnOrVar, generateFilterGetter, hasParentClass, isFloat, isGridCellFiller, isNotEmpty, primitiveToSelectOption, sanitiseFileName, stringByteLengthIsInvalid, suppressCellKeyboardEvents, textMatch, useDeferredPromise, useGridContext, useGridContextMenu, useGridFilter, useGridPopoverContext, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait, waitForCondition };
|
|
5908
|
+
export { ActionButton, CancelPromise, ComponentLoadingWrapper, ControlledMenu, Editor, FocusableItem, FormError, GenericCellEditorComponentWrapper, Grid, GridButton, GridCell, GridCellFiller, GridCellFillerColId, GridCellMultiEditor, GridCellMultiSelectClassRules, GridCellRenderer, GridContext, GridContextProvider, GridEditBoolean, GridFilterButtons, GridFilterColumnsToggle, GridFilterDownloadCsvButton, GridFilterHeaderIconButton, GridFilterQuick, GridFilters, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormMultiSelectGrid, GridFormPopoverMenu, GridFormSubComponentTextArea, GridFormSubComponentTextInput, GridFormTextArea, GridFormTextInput, GridIcon, GridLoadableCell, GridNoRowsOverlay, GridNoRowsOverlayFr, GridPopoutEditMultiSelect, GridPopoutEditMultiSelectGrid, GridPopoverContext, GridPopoverContextProvider, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditBearingCorrectionEditorParams, GridPopoverEditBearingEditorParams, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridSubComponentContext, GridUpdatingContext, GridUpdatingContextProvider, GridWrapper, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuHeaderItem, MenuHeaderString, MenuItem, MenuRadioGroup, MenuSeparator, MenuSeparatorString, PopoutMenuSeparator, SubMenu, TextAreaInput, TextInputFormatted, TextInputValidator, bearingCorrectionRangeValidator, bearingCorrectionValueFormatter, bearingNumberParser, bearingRangeValidator, bearingStringValidator, bearingValueFormatter, convertDDToDMS, defaultValueFormatter, downloadCsvUseValueFormattersProcessCellCallback, findParentWithClass, fnOrVar, generateFilterGetter, hasParentClass, isFloat, isGridCellFiller, isNotEmpty, primitiveToSelectOption, sanitiseFileName, stringByteLengthIsInvalid, suppressCellKeyboardEvents, textMatch, useDeferredPromise, useGridContext, useGridContextMenu, useGridFilter, useGridPopoverContext, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait, waitForCondition };
|
|
5877
5909
|
//# sourceMappingURL=step-ag-grid.esm.js.map
|