@linzjs/step-ag-grid 30.4.4 → 31.2.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.
Files changed (81) hide show
  1. package/dist/GridTheme.scss +12 -7
  2. package/dist/index.css +6 -3
  3. package/dist/src/components/gridDragUtil.d.ts +10 -0
  4. package/dist/src/components/gridDragUtil.test.d.ts +1 -0
  5. package/dist/src/components/index.d.ts +1 -0
  6. package/dist/src/components/types.d.ts +4 -0
  7. package/dist/src/utils/__tests__/testQuick.ts +7 -7
  8. package/dist/src/utils/__tests__/testUtil.ts +3 -1
  9. package/dist/src/utils/__tests__/vitestUtil.ts +3 -1
  10. package/dist/src/utils/storybook.d.ts +4 -0
  11. package/dist/src/utils/useInterval.d.ts +17 -0
  12. package/dist/src/utils/useIsomorphicLayoutEffect.d.ts +17 -0
  13. package/dist/step-ag-grid.cjs +402 -218
  14. package/dist/step-ag-grid.cjs.map +1 -1
  15. package/dist/step-ag-grid.esm.js +402 -219
  16. package/dist/step-ag-grid.esm.js.map +1 -1
  17. package/package.json +26 -52
  18. package/src/components/Grid.tsx +75 -8
  19. package/src/components/PostSortRowsHook.ts +3 -1
  20. package/src/components/gridDragUtil.test.ts +115 -0
  21. package/src/components/gridDragUtil.ts +32 -0
  22. package/src/components/gridFilter/GridFilterColumnsMultiSelect.scss +18 -20
  23. package/src/components/gridFilter/GridFilterColumnsToggle.tsx +3 -4
  24. package/src/components/gridFilter/useGridFilter.ts +2 -2
  25. package/src/components/gridForm/GridFormDropDown.tsx +1 -1
  26. package/src/components/gridForm/GridFormInlineTextInput.tsx +1 -2
  27. package/src/components/gridForm/GridFormMultiSelect.tsx +10 -4
  28. package/src/components/gridForm/GridFormSubComponentTextArea.tsx +1 -2
  29. package/src/components/gridForm/GridFormSubComponentTextInput.tsx +1 -2
  30. package/src/components/gridForm/GridFormTextArea.tsx +1 -2
  31. package/src/components/gridForm/GridFormTextInput.tsx +1 -2
  32. package/src/components/gridHeader/GridHeaderSelect.tsx +3 -1
  33. package/src/components/gridHook/useGridCopy.ts +13 -3
  34. package/src/components/gridHook/useGridRangeSelection.ts +29 -16
  35. package/src/components/index.ts +1 -0
  36. package/src/components/types.ts +4 -0
  37. package/src/contexts/GridContextProvider.tsx +18 -7
  38. package/src/lui/ActionButton.scss +1 -1
  39. package/src/lui/ActionButton.tsx +5 -1
  40. package/src/lui/FormError.scss +1 -1
  41. package/src/lui/TextAreaInput.tsx +1 -1
  42. package/src/lui/TextInputFormatted.scss +13 -13
  43. package/src/lui/TextInputFormatted.tsx +1 -1
  44. package/src/react-menu3/README.md +66 -67
  45. package/src/react-menu3/components/ControlledMenu.tsx +2 -2
  46. package/src/react-menu3/components/Menu.tsx +1 -1
  47. package/src/react-menu3/components/MenuItem.tsx +1 -1
  48. package/src/react-menu3/components/MenuList.tsx +8 -2
  49. package/src/react-menu3/components/SubMenu.tsx +6 -6
  50. package/src/react-menu3/hooks/useBEM.ts +2 -1
  51. package/src/react-menu3/hooks/useItemState.ts +8 -4
  52. package/src/react-menu3/styles/_var.scss +1 -1
  53. package/src/react-menu3/styles/core.scss +6 -6
  54. package/src/react-menu3/styles/index.scss +11 -8
  55. package/src/react-menu3/styles/theme-dark.scss +1 -1
  56. package/src/react-menu3/styles/transitions/slide.scss +8 -8
  57. package/src/react-menu3/utils/utils.ts +2 -1
  58. package/src/stories/grid/FormTest.scss +13 -13
  59. package/src/stories/grid/GridDragRow.stories.tsx +61 -8
  60. package/src/stories/grid/GridInlineText.stories.tsx +2 -2
  61. package/src/stories/grid/GridSorting.stories.tsx +6 -2
  62. package/src/styles/ComponentLoadingWrapper.scss +1 -1
  63. package/src/styles/ContextMenu.scss +1 -1
  64. package/src/styles/Grid.scss +11 -9
  65. package/src/styles/GridCell.scss +1 -1
  66. package/src/styles/GridFilterColumnsToggle.scss +1 -1
  67. package/src/styles/GridFormInlineTextInput.scss +7 -7
  68. package/src/styles/GridFormMultiSelectGrid.scss +1 -1
  69. package/src/styles/GridFormSubComponentTextInput.scss +4 -4
  70. package/src/styles/GridIcon.scss +1 -1
  71. package/src/styles/GridPopoverMenu.scss +1 -1
  72. package/src/styles/GridTheme.scss +12 -7
  73. package/src/styles/index.scss +16 -16
  74. package/src/styles/react-menu-customisations.scss +119 -120
  75. package/src/utils/__tests__/testQuick.ts +7 -7
  76. package/src/utils/__tests__/testUtil.ts +3 -1
  77. package/src/utils/__tests__/vitestUtil.ts +3 -1
  78. package/src/utils/deferredPromise.ts +1 -1
  79. package/src/utils/storybook.ts +5 -0
  80. package/src/utils/useInterval.ts +44 -0
  81. package/src/utils/useIsomorphicLayoutEffect.ts +18 -0
@@ -57826,6 +57826,79 @@ var AgGridReact = class extends React13.Component {
57826
57826
 
57827
57827
  function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
57828
57828
 
57829
+ const NoContext = () => {
57830
+ console.error('Missing GridContextProvider');
57831
+ return null;
57832
+ };
57833
+ const GridContext = React13.createContext({
57834
+ gridReady: false,
57835
+ gridRenderState: () => null,
57836
+ getCellValue: NoContext,
57837
+ getColDef: NoContext,
57838
+ getColumns: NoContext,
57839
+ getColumnIds: NoContext,
57840
+ invisibleColumnIds: undefined,
57841
+ setInvisibleColumnIds: NoContext,
57842
+ prePopupOps: NoContext,
57843
+ externallySelectedItemsAreInSync: false,
57844
+ setApis: NoContext,
57845
+ setQuickFilter: NoContext,
57846
+ selectRowsById: NoContext,
57847
+ getSelectedRows: NoContext,
57848
+ getFilteredSelectedRows: NoContext,
57849
+ getSelectedRowIds: NoContext,
57850
+ getFilteredSelectedRowIds: NoContext,
57851
+ selectRowsDiff: NoContext,
57852
+ selectRowsByIdWithFlash: NoContext,
57853
+ selectRowsWithFlashDiff: NoContext,
57854
+ flashRows: NoContext,
57855
+ flashRowsDiff: NoContext,
57856
+ focusByRowById: NoContext,
57857
+ ensureRowVisible: NoContext,
57858
+ ensureSelectedRowIsVisible: NoContext,
57859
+ getFirstRowId: NoContext,
57860
+ autoSizeColumns: NoContext,
57861
+ sizeColumnsToFit: NoContext,
57862
+ editingCells: NoContext,
57863
+ startCellEditing: NoContext,
57864
+ resetFocusedCellAfterCellEditing: NoContext,
57865
+ updatingCells: NoContext,
57866
+ redrawRows: NoContext,
57867
+ setExternallySelectedItemsAreInSync: NoContext,
57868
+ waitForExternallySelectedItemsToBeInSync: NoContext,
57869
+ addExternalFilter: NoContext,
57870
+ removeExternalFilter: NoContext,
57871
+ isExternalFilterPresent: NoContext,
57872
+ doesExternalFilterPass: NoContext,
57873
+ downloadCsv: NoContext,
57874
+ onBulkEditingComplete: NoContext,
57875
+ setOnBulkEditingComplete: NoContext,
57876
+ showNoRowsOverlay: NoContext,
57877
+ });
57878
+ const useGridContext = () => React13.useContext(GridContext);
57879
+
57880
+ const GridUpdatingContext = React13.createContext({
57881
+ anyUpdating: () => {
57882
+ console.error('Missing GridUpdatingContext');
57883
+ return false;
57884
+ },
57885
+ checkUpdating: () => {
57886
+ console.error('Missing GridUpdatingContext');
57887
+ return false;
57888
+ },
57889
+ updatingCols: () => {
57890
+ console.error('Missing GridUpdatingContext');
57891
+ return [];
57892
+ },
57893
+ // eslint-disable-next-line @typescript-eslint/require-await
57894
+ modifyUpdating: async () => {
57895
+ console.error('Missing GridUpdatingContext');
57896
+ },
57897
+ updatedDep: 0,
57898
+ });
57899
+
57900
+ const isStorybook = window.IS_STORYBOOK;
57901
+
57829
57902
  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
57830
57903
 
57831
57904
  function getDefaultExportFromCjs (x) {
@@ -58221,95 +58294,45 @@ function requireLodash_debounce () {
58221
58294
  requireLodash_debounce();
58222
58295
 
58223
58296
  var useIsomorphicLayoutEffect$1 = typeof window !== "undefined" ? React13.useLayoutEffect : React13.useEffect;
58297
+
58298
+ /**
58299
+ * Copied from usehooks-ts
58300
+ *
58301
+ * Custom hook that creates an interval that invokes a callback function at a specified delay using the [`setInterval API`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval).
58302
+ * @param {() => void} callback - The function to be invoked at each interval.
58303
+ * @param {number | null} delay - The time, in milliseconds, between each invocation of the callback. Use `null` to clear the interval.
58304
+ * @public
58305
+ * @see [Documentation](https://usehooks-ts.com/react-hook/use-interval)
58306
+ * @example
58307
+ * ```tsx
58308
+ * const handleInterval = () => {
58309
+ * // Code to be executed at each interval
58310
+ * };
58311
+ * useInterval(handleInterval, 1000);
58312
+ * ```
58313
+ */
58224
58314
  function useInterval(callback, delay) {
58225
- const savedCallback = React13.useRef(callback);
58226
- useIsomorphicLayoutEffect$1(() => {
58227
- savedCallback.current = callback;
58228
- }, [callback]);
58229
- React13.useEffect(() => {
58230
- if (delay === null) {
58231
- return;
58232
- }
58233
- const id = setInterval(() => {
58234
- savedCallback.current();
58235
- }, delay);
58236
- return () => {
58237
- clearInterval(id);
58238
- };
58239
- }, [delay]);
58315
+ const savedCallback = React13.useRef(callback);
58316
+ // Remember the latest callback if it changes.
58317
+ useIsomorphicLayoutEffect$1(() => {
58318
+ savedCallback.current = callback;
58319
+ }, [callback]);
58320
+ // Set up the interval.
58321
+ React13.useEffect(() => {
58322
+ // Don't schedule if no delay is specified.
58323
+ // Note: 0 is a valid value for delay.
58324
+ if (delay === null) {
58325
+ return;
58326
+ }
58327
+ const id = setInterval(() => {
58328
+ savedCallback.current();
58329
+ }, delay);
58330
+ return () => {
58331
+ clearInterval(id);
58332
+ };
58333
+ }, [delay]);
58240
58334
  }
58241
58335
 
58242
- const NoContext = () => {
58243
- console.error('Missing GridContextProvider');
58244
- return null;
58245
- };
58246
- const GridContext = React13.createContext({
58247
- gridReady: false,
58248
- gridRenderState: () => null,
58249
- getCellValue: NoContext,
58250
- getColDef: NoContext,
58251
- getColumns: NoContext,
58252
- getColumnIds: NoContext,
58253
- invisibleColumnIds: undefined,
58254
- setInvisibleColumnIds: NoContext,
58255
- prePopupOps: NoContext,
58256
- externallySelectedItemsAreInSync: false,
58257
- setApis: NoContext,
58258
- setQuickFilter: NoContext,
58259
- selectRowsById: NoContext,
58260
- getSelectedRows: NoContext,
58261
- getFilteredSelectedRows: NoContext,
58262
- getSelectedRowIds: NoContext,
58263
- getFilteredSelectedRowIds: NoContext,
58264
- selectRowsDiff: NoContext,
58265
- selectRowsByIdWithFlash: NoContext,
58266
- selectRowsWithFlashDiff: NoContext,
58267
- flashRows: NoContext,
58268
- flashRowsDiff: NoContext,
58269
- focusByRowById: NoContext,
58270
- ensureRowVisible: NoContext,
58271
- ensureSelectedRowIsVisible: NoContext,
58272
- getFirstRowId: NoContext,
58273
- autoSizeColumns: NoContext,
58274
- sizeColumnsToFit: NoContext,
58275
- editingCells: NoContext,
58276
- startCellEditing: NoContext,
58277
- resetFocusedCellAfterCellEditing: NoContext,
58278
- updatingCells: NoContext,
58279
- redrawRows: NoContext,
58280
- setExternallySelectedItemsAreInSync: NoContext,
58281
- waitForExternallySelectedItemsToBeInSync: NoContext,
58282
- addExternalFilter: NoContext,
58283
- removeExternalFilter: NoContext,
58284
- isExternalFilterPresent: NoContext,
58285
- doesExternalFilterPass: NoContext,
58286
- downloadCsv: NoContext,
58287
- onBulkEditingComplete: NoContext,
58288
- setOnBulkEditingComplete: NoContext,
58289
- showNoRowsOverlay: NoContext,
58290
- });
58291
- const useGridContext = () => React13.useContext(GridContext);
58292
-
58293
- const GridUpdatingContext = React13.createContext({
58294
- anyUpdating: () => {
58295
- console.error('Missing GridUpdatingContext');
58296
- return false;
58297
- },
58298
- checkUpdating: () => {
58299
- console.error('Missing GridUpdatingContext');
58300
- return false;
58301
- },
58302
- updatingCols: () => {
58303
- console.error('Missing GridUpdatingContext');
58304
- return [];
58305
- },
58306
- // eslint-disable-next-line @typescript-eslint/require-await
58307
- modifyUpdating: async () => {
58308
- console.error('Missing GridUpdatingContext');
58309
- },
58310
- updatedDep: 0,
58311
- });
58312
-
58313
58336
  var lib = {};
58314
58337
 
58315
58338
  var hasRequiredLib;
@@ -58549,7 +58572,9 @@ const GridHeaderSelect = ({ api }) => {
58549
58572
  };
58550
58573
  api.addEventListener('selectionChanged', clickHandler);
58551
58574
  return () => {
58552
- !api.isDestroyed() && api.removeEventListener('selectionChanged', clickHandler);
58575
+ if (!api.isDestroyed()) {
58576
+ api.removeEventListener('selectionChanged', clickHandler);
58577
+ }
58553
58578
  };
58554
58579
  }, [api, updateCounter]);
58555
58580
  const handleMultiSelect = () => {
@@ -58615,12 +58640,13 @@ const SettingsContext = React13.createContext({});
58615
58640
  const useBEM = ({ block, element, modifiers, className }) => React13.useMemo(() => {
58616
58641
  const blockElement = element ? `${block}__${element}` : block;
58617
58642
  let classString = blockElement;
58618
- modifiers &&
58643
+ if (modifiers) {
58619
58644
  Object.keys(modifiers).forEach((name) => {
58620
58645
  const value = modifiers[name];
58621
58646
  if (value)
58622
58647
  classString += ` ${blockElement}--${value === true ? name : `${name}-${value}`}`;
58623
58648
  });
58649
+ }
58624
58650
  let expandedClassName = typeof className === 'function' ? className(modifiers) : className;
58625
58651
  if (typeof expandedClassName === 'string') {
58626
58652
  expandedClassName = expandedClassName.trim();
@@ -58737,7 +58763,7 @@ function safeCall(fn, arg) {
58737
58763
  const internalKey = '_szhsinMenu';
58738
58764
  const getName = (component) => component[internalKey];
58739
58765
  const mergeProps = (target, source) => {
58740
- source &&
58766
+ if (source) {
58741
58767
  Object.keys(source).forEach((key) => {
58742
58768
  const targetProp = target[key];
58743
58769
  const sourceProp = source[key];
@@ -58751,6 +58777,7 @@ const mergeProps = (target, source) => {
58751
58777
  target[key] = sourceProp;
58752
58778
  }
58753
58779
  });
58780
+ }
58754
58781
  return target;
58755
58782
  };
58756
58783
  const parsePadding = (paddingStr) => {
@@ -58933,10 +58960,12 @@ const useItemState = (menuItemRef, focusRef, isHovering, isDisabled) => {
58933
58960
  const { isParentOpen, isSubmenuOpen, dispatch, updateItems } = React13.useContext(MenuListItemContext);
58934
58961
  const timeoutId = React13.useRef(undefined);
58935
58962
  const setHover = () => {
58936
- !isHovering && !isDisabled && dispatch(HoverActionTypes.SET, menuItemRef?.current, 0);
58963
+ if (!isHovering && !isDisabled)
58964
+ dispatch(HoverActionTypes.SET, menuItemRef?.current, 0);
58937
58965
  };
58938
58966
  const unsetHover = () => {
58939
- !isDisabled && dispatch(HoverActionTypes.UNSET, menuItemRef?.current, 0);
58967
+ if (!isDisabled)
58968
+ dispatch(HoverActionTypes.UNSET, menuItemRef?.current, 0);
58940
58969
  };
58941
58970
  const onBlur = (e) => {
58942
58971
  // Focus has moved out of the entire item
@@ -58961,7 +58990,9 @@ const useItemState = (menuItemRef, focusRef, isHovering, isDisabled) => {
58961
58990
  clearTimeout(timeoutId.current);
58962
58991
  timeoutId.current = undefined;
58963
58992
  }
58964
- !keepHover && unsetHover();
58993
+ if (!keepHover) {
58994
+ unsetHover();
58995
+ }
58965
58996
  };
58966
58997
  useItemEffect(isDisabled, menuItemRef, updateItems);
58967
58998
  React13.useEffect(() => () => clearTimeout(timeoutId.current), []);
@@ -58969,7 +59000,9 @@ const useItemState = (menuItemRef, focusRef, isHovering, isDisabled) => {
58969
59000
  // Don't set focus when parent menu is closed, otherwise focus will be lost
58970
59001
  // and onBlur event will be fired with relatedTarget setting as null.
58971
59002
  if (isHovering && isParentOpen) {
58972
- focusRef?.current && focusRef.current.focus();
59003
+ if (focusRef?.current) {
59004
+ focusRef.current.focus();
59005
+ }
58973
59006
  }
58974
59007
  }, [focusRef, isHovering, isParentOpen]);
58975
59008
  return {
@@ -58989,6 +59022,7 @@ const useMenuChange = (onMenuChange, isOpen) => {
58989
59022
  }, [onMenuChange, isOpen]);
58990
59023
  };
58991
59024
 
59025
+ //#region src/utils.ts
58992
59026
  const PRE_ENTER = 0;
58993
59027
  const ENTERING = 1;
58994
59028
  const ENTERED = 2;
@@ -58996,84 +59030,89 @@ const PRE_EXIT = 3;
58996
59030
  const EXITING = 4;
58997
59031
  const EXITED = 5;
58998
59032
  const UNMOUNTED = 6;
58999
- const STATUS = ['preEnter', 'entering', 'entered', 'preExit', 'exiting', 'exited', 'unmounted'];
59000
- const getState = status => ({
59001
- _s: status,
59002
- status: STATUS[status],
59003
- isEnter: status < PRE_EXIT,
59004
- isMounted: status !== UNMOUNTED,
59005
- isResolved: status === ENTERED || status > EXITING
59033
+ const STATUS = [
59034
+ "preEnter",
59035
+ "entering",
59036
+ "entered",
59037
+ "preExit",
59038
+ "exiting",
59039
+ "exited",
59040
+ "unmounted"
59041
+ ];
59042
+ const getState = (status) => ({
59043
+ _s: status,
59044
+ status: STATUS[status],
59045
+ isEnter: status < PRE_EXIT,
59046
+ isMounted: status !== UNMOUNTED,
59047
+ isResolved: status === ENTERED || status > EXITING
59006
59048
  });
59007
- const startOrEnd = unmounted => unmounted ? UNMOUNTED : EXITED;
59049
+ const startOrEnd = (unmounted) => unmounted ? UNMOUNTED : EXITED;
59008
59050
  const getEndStatus = (status, unmountOnExit) => {
59009
- switch (status) {
59010
- case ENTERING:
59011
- case PRE_ENTER:
59012
- return ENTERED;
59013
- case EXITING:
59014
- case PRE_EXIT:
59015
- return startOrEnd(unmountOnExit);
59016
- }
59017
- };
59018
- const getTimeout = timeout => typeof timeout === 'object' ? [timeout.enter, timeout.exit] : [timeout, timeout];
59019
- const nextTick = (transitState, status) => setTimeout(() => {
59020
- // Reading document.body.offsetTop can force browser to repaint before transition to the next state
59021
- isNaN(document.body.offsetTop) || transitState(status + 1);
59051
+ switch (status) {
59052
+ case ENTERING:
59053
+ case PRE_ENTER: return ENTERED;
59054
+ case EXITING:
59055
+ case PRE_EXIT: return startOrEnd(unmountOnExit);
59056
+ }
59057
+ };
59058
+ const getTimeout = (timeout) => typeof timeout === "object" ? [timeout.enter, timeout.exit] : [timeout, timeout];
59059
+ const _setTimeout = (...args) => setTimeout(...args);
59060
+ const nextTick = (transitState, status) => _setTimeout(() => {
59061
+ isNaN(document.body.offsetTop) || transitState(status + 1);
59022
59062
  }, 0);
59023
59063
 
59064
+ //#region src/useTransitionState.ts
59024
59065
  const updateState = (status, setState, latestState, timeoutId, onChange) => {
59025
- clearTimeout(timeoutId.current);
59026
- const state = getState(status);
59027
- setState(state);
59028
- latestState.current = state;
59029
- onChange && onChange({
59030
- current: state
59031
- });
59032
- };
59033
- const useTransitionState = ({
59034
- enter = true,
59035
- exit = true,
59036
- preEnter,
59037
- preExit,
59038
- timeout,
59039
- initialEntered,
59040
- mountOnEnter,
59041
- unmountOnExit,
59042
- onStateChange: onChange
59043
- } = {}) => {
59044
- const [state, setState] = React13.useState(() => getState(initialEntered ? ENTERED : startOrEnd(mountOnEnter)));
59045
- const latestState = React13.useRef(state);
59046
- const timeoutId = React13.useRef();
59047
- const [enterTimeout, exitTimeout] = getTimeout(timeout);
59048
- const endTransition = React13.useCallback(() => {
59049
- const status = getEndStatus(latestState.current._s, unmountOnExit);
59050
- status && updateState(status, setState, latestState, timeoutId, onChange);
59051
- }, [onChange, unmountOnExit]);
59052
- const toggle = React13.useCallback(toEnter => {
59053
- const transitState = status => {
59054
- updateState(status, setState, latestState, timeoutId, onChange);
59055
- switch (status) {
59056
- case ENTERING:
59057
- if (enterTimeout >= 0) timeoutId.current = setTimeout(endTransition, enterTimeout);
59058
- break;
59059
- case EXITING:
59060
- if (exitTimeout >= 0) timeoutId.current = setTimeout(endTransition, exitTimeout);
59061
- break;
59062
- case PRE_ENTER:
59063
- case PRE_EXIT:
59064
- timeoutId.current = nextTick(transitState, status);
59065
- break;
59066
- }
59067
- };
59068
- const enterStage = latestState.current.isEnter;
59069
- if (typeof toEnter !== 'boolean') toEnter = !enterStage;
59070
- if (toEnter) {
59071
- !enterStage && transitState(enter ? preEnter ? PRE_ENTER : ENTERING : ENTERED);
59072
- } else {
59073
- enterStage && transitState(exit ? preExit ? PRE_EXIT : EXITING : startOrEnd(unmountOnExit));
59074
- }
59075
- }, [endTransition, onChange, enter, exit, preEnter, preExit, enterTimeout, exitTimeout, unmountOnExit]);
59076
- return [state, toggle, endTransition];
59066
+ clearTimeout(timeoutId.current);
59067
+ const state = getState(status);
59068
+ setState(state);
59069
+ latestState.current = state;
59070
+ onChange && onChange({ current: state });
59071
+ };
59072
+ const useTransitionState = ({ enter = true, exit = true, preEnter, preExit, timeout, initialEntered, mountOnEnter, unmountOnExit, onStateChange: onChange } = {}) => {
59073
+ const [state, setState] = React13.useState(() => getState(initialEntered ? ENTERED : startOrEnd(mountOnEnter)));
59074
+ const latestState = React13.useRef(state);
59075
+ const timeoutId = React13.useRef(0);
59076
+ const [enterTimeout, exitTimeout] = getTimeout(timeout);
59077
+ const endTransition = React13.useCallback(() => {
59078
+ const status = getEndStatus(latestState.current._s, unmountOnExit);
59079
+ status && updateState(status, setState, latestState, timeoutId, onChange);
59080
+ }, [onChange, unmountOnExit]);
59081
+ return [
59082
+ state,
59083
+ React13.useCallback((toEnter) => {
59084
+ const transitState = (status) => {
59085
+ updateState(status, setState, latestState, timeoutId, onChange);
59086
+ switch (status) {
59087
+ case ENTERING:
59088
+ if (enterTimeout >= 0) timeoutId.current = _setTimeout(endTransition, enterTimeout);
59089
+ break;
59090
+ case EXITING:
59091
+ if (exitTimeout >= 0) timeoutId.current = _setTimeout(endTransition, exitTimeout);
59092
+ break;
59093
+ case PRE_ENTER:
59094
+ case PRE_EXIT:
59095
+ timeoutId.current = nextTick(transitState, status);
59096
+ break;
59097
+ }
59098
+ };
59099
+ const enterStage = latestState.current.isEnter;
59100
+ if (typeof toEnter !== "boolean") toEnter = !enterStage;
59101
+ if (toEnter) !enterStage && transitState(enter ? preEnter ? PRE_ENTER : ENTERING : ENTERED);
59102
+ else enterStage && transitState(exit ? preExit ? PRE_EXIT : EXITING : startOrEnd(unmountOnExit));
59103
+ }, [
59104
+ endTransition,
59105
+ onChange,
59106
+ enter,
59107
+ exit,
59108
+ preEnter,
59109
+ preExit,
59110
+ enterTimeout,
59111
+ exitTimeout,
59112
+ unmountOnExit
59113
+ ]),
59114
+ endTransition
59115
+ ];
59077
59116
  };
59078
59117
 
59079
59118
  /**
@@ -59503,7 +59542,9 @@ const MenuList = ({ ariaLabel, menuClassName, menuStyle, arrowClassName, arrowSt
59503
59542
  if (state === 'closing') {
59504
59543
  setOverflowData(undefined); // reset overflowData after closing
59505
59544
  }
59506
- endTransition && safeCall(endTransition);
59545
+ if (endTransition) {
59546
+ safeCall(endTransition);
59547
+ }
59507
59548
  };
59508
59549
  const handlePosition = React13.useCallback((noOverflowCheck) => {
59509
59550
  if (!containerRef?.current) {
@@ -59759,7 +59800,12 @@ const MenuList = ({ ariaLabel, menuClassName, menuStyle, arrowClassName, arrowSt
59759
59800
  let maxHeight;
59760
59801
  let overflowAmt;
59761
59802
  if (overflowData) {
59762
- setDownOverflow ? (overflowAmt = overflowData.overflowAmt) : (maxHeight = overflowData.height);
59803
+ if (setDownOverflow) {
59804
+ overflowAmt = overflowData.overflowAmt;
59805
+ }
59806
+ else {
59807
+ maxHeight = overflowData.height;
59808
+ }
59763
59809
  }
59764
59810
  const listContext = React13.useMemo(() => ({
59765
59811
  reposSubmenu,
@@ -59937,7 +59983,8 @@ const ControlledMenuFr = ({ 'aria-label': ariaLabel, className, containerProps,
59937
59983
  lastTabDownEl.current = activeElement;
59938
59984
  }
59939
59985
  else {
59940
- lastTabDownEl.current == activeElement && invokeSave(tabDirection);
59986
+ if (lastTabDownEl.current == activeElement)
59987
+ invokeSave(tabDirection);
59941
59988
  }
59942
59989
  }
59943
59990
  }
@@ -59954,7 +60001,8 @@ const ControlledMenuFr = ({ 'aria-label': ariaLabel, className, containerProps,
59954
60001
  lastEnterDownEl.current = activeElement;
59955
60002
  }
59956
60003
  else {
59957
- lastEnterDownEl.current == activeElement && invokeSave(CloseReason.CLICK);
60004
+ if (lastEnterDownEl.current == activeElement)
60005
+ invokeSave(CloseReason.CLICK);
59958
60006
  }
59959
60007
  }
59960
60008
  }
@@ -60109,7 +60157,7 @@ function MenuFr({ 'aria-label': ariaLabel, menuButton, instanceRef, onMenuChange
60109
60157
  const handleClose = React13.useCallback((e) => {
60110
60158
  toggleMenu(false);
60111
60159
  if (e.key)
60112
- buttonRef.current && buttonRef.current.focus();
60160
+ buttonRef?.current?.focus();
60113
60161
  }, [toggleMenu]);
60114
60162
  const onClick = (e) => {
60115
60163
  if (skipOpen.current)
@@ -60250,7 +60298,7 @@ const MenuItemFr = ({ className, value, href, type, checked, disabled, children,
60250
60298
  e.preventDefault();
60251
60299
  e.stopPropagation();
60252
60300
  if (isAnchor) {
60253
- menuItemRef?.current && menuItemRef.current.click();
60301
+ menuItemRef?.current.click();
60254
60302
  }
60255
60303
  else {
60256
60304
  handleClick(e);
@@ -60322,7 +60370,8 @@ const SubMenuFr = ({ 'aria-label': ariaLabel, className, disabled, direction, la
60322
60370
  const openMenu = (...args) => {
60323
60371
  stopTimer();
60324
60372
  setHover();
60325
- !isDisabled && _openMenu(...args);
60373
+ if (!isDisabled)
60374
+ _openMenu(...args);
60326
60375
  };
60327
60376
  const setHover = () => !isHovering && !isDisabled && dispatch(HoverActionTypes.SET, menuItemRef?.current, 0);
60328
60377
  const delayOpen = (delay) => {
@@ -60351,7 +60400,7 @@ const SubMenuFr = ({ 'aria-label': ariaLabel, className, disabled, direction, la
60351
60400
  // LEFT key is bubbled up from submenu items
60352
60401
  case Keys.LEFT:
60353
60402
  if (isOpen) {
60354
- menuItemRef?.current && menuItemRef.current.focus();
60403
+ menuItemRef?.current.focus();
60355
60404
  toggleMenu(false);
60356
60405
  handled = true;
60357
60406
  }
@@ -60374,7 +60423,8 @@ const SubMenuFr = ({ 'aria-label': ariaLabel, className, disabled, direction, la
60374
60423
  case Keys.ENTER:
60375
60424
  case Keys.SPACE:
60376
60425
  case Keys.RIGHT:
60377
- openTrigger !== 'none' && openMenu(FocusPositions.FIRST);
60426
+ if (openTrigger !== 'none')
60427
+ openMenu(FocusPositions.FIRST);
60378
60428
  break;
60379
60429
  }
60380
60430
  };
@@ -60385,7 +60435,7 @@ const SubMenuFr = ({ 'aria-label': ariaLabel, className, disabled, direction, la
60385
60435
  // Don't set focus when parent menu is closed, otherwise focus will be lost
60386
60436
  // and onBlur event will be fired with relatedTarget setting as null.
60387
60437
  if (isHovering && isParentOpen) {
60388
- menuItemRef?.current && menuItemRef.current.focus();
60438
+ menuItemRef?.current?.focus();
60389
60439
  }
60390
60440
  else {
60391
60441
  toggleMenu(false);
@@ -60396,11 +60446,12 @@ const SubMenuFr = ({ 'aria-label': ariaLabel, className, disabled, direction, la
60396
60446
  }, [setOpenSubmenuCount, isOpen]);
60397
60447
  React13.useImperativeHandle(instanceRef, () => ({
60398
60448
  openMenu: (...args) => {
60399
- isParentOpen && openMenu(...args);
60449
+ if (isParentOpen)
60450
+ openMenu(...args);
60400
60451
  },
60401
60452
  closeMenu: () => {
60402
60453
  if (isOpen) {
60403
- menuItemRef?.current && menuItemRef.current.focus();
60454
+ menuItemRef?.current?.focus();
60404
60455
  toggleMenu(false);
60405
60456
  }
60406
60457
  },
@@ -60696,7 +60747,17 @@ const useGridCopy = ({ ranges, rangeStartRef, rangeEndRef, hasSelectedMoreThanOn
60696
60747
  else {
60697
60748
  void navigator.clipboard.writeText(result).catch((err) => console.error('Failed to copy: ', err));
60698
60749
  }
60699
- }, [getCellValue, ranges, copyType]);
60750
+ }, [
60751
+ getCellValue,
60752
+ ranges,
60753
+ copyType,
60754
+ rangeStartRef,
60755
+ hasSelectedMoreThanOneCellRef,
60756
+ rangeEndRef,
60757
+ showToast,
60758
+ getColDef,
60759
+ getSelectedRowIds,
60760
+ ]);
60700
60761
  const onCopyEvent = React13.useCallback((e) => {
60701
60762
  const rangeStart = rangeStartRef.current;
60702
60763
  const rangeEnd = rangeEndRef.current;
@@ -60709,7 +60770,7 @@ const useGridCopy = ({ ranges, rangeStartRef, rangeEndRef, hasSelectedMoreThanOn
60709
60770
  }
60710
60771
  e.preventDefault();
60711
60772
  onCopy();
60712
- }, [onCopy]);
60773
+ }, [onCopy, rangeStartRef, rangeEndRef, hasSelectedMoreThanOneCellRef]);
60713
60774
  const { cellContextMenu: rangeSelectContextMenu, contextMenuComponent: rangeSelectContextMenuComponent } = useGridContextMenu({
60714
60775
  contextMenu: (GridRangeSelectContextMenu),
60715
60776
  context: { onCopy, copyType, setCopyType },
@@ -60718,7 +60779,7 @@ const useGridCopy = ({ ranges, rangeStartRef, rangeEndRef, hasSelectedMoreThanOn
60718
60779
  return hasSelectedMoreThanOneCellRef.current && rangeStartRef.current !== null
60719
60780
  ? rangeSelectContextMenu(event)
60720
60781
  : cellContextMenu(event);
60721
- }, [cellContextMenu, rangeSelectContextMenu]);
60782
+ }, [cellContextMenu, rangeSelectContextMenu, rangeStartRef, hasSelectedMoreThanOneCellRef]);
60722
60783
  return {
60723
60784
  onCopyEvent,
60724
60785
  rangeSelectInterceptContextMenu,
@@ -60768,7 +60829,7 @@ const useGridRangeSelection = ({ enableRangeSelection, gridDivRef, rangeStartRef
60768
60829
  const endRowIndex = rangeSortedNodes.findIndex((node) => node.data.id === rangeEnd.rowId);
60769
60830
  const selectedNodes = rangeSortedNodes.slice(Math.min(startRowIndex, endRowIndex), Math.max(startRowIndex, endRowIndex) + 1);
60770
60831
  return { selectedColIds, selectedNodes };
60771
- }, []);
60832
+ }, [gridDivRef, rangeSortedNodesRef, rangeStartRef, rangeEndRef]);
60772
60833
  const redrawSelectedRanges = React13.useCallback(() => {
60773
60834
  const gridElement = gridDivRef.current;
60774
60835
  const { selectedColIds, selectedNodes } = ranges();
@@ -60791,7 +60852,7 @@ const useGridRangeSelection = ({ enableRangeSelection, gridDivRef, rangeStartRef
60791
60852
  }
60792
60853
  });
60793
60854
  });
60794
- }, []);
60855
+ }, [ranges, gridDivRef]);
60795
60856
  const updateRangeSelectionCellClasses = React13.useCallback((justRefresh) => {
60796
60857
  //
60797
60858
  // Get all grid cols, sort by pinned, then style: left
@@ -60829,7 +60890,7 @@ const useGridRangeSelection = ({ enableRangeSelection, gridDivRef, rangeStartRef
60829
60890
  return;
60830
60891
  }
60831
60892
  redrawSelectedRanges();
60832
- }, [ranges, redrawSelectedRanges]);
60893
+ }, [redrawSelectedRanges, rangeStartRef, rangeEndRef, gridDivRef, hasSelectedMoreThanOneCellRef, rangeSortedNodesRef]);
60833
60894
  // Handle updates after scroll / grid refresh
60834
60895
  useInterval(() => {
60835
60896
  updateRangeSelectionCellClasses(true);
@@ -60841,16 +60902,16 @@ const useGridRangeSelection = ({ enableRangeSelection, gridDivRef, rangeStartRef
60841
60902
  rangeStartRef.current = null;
60842
60903
  rangeEndRef.current = null;
60843
60904
  updateRangeSelectionCellClasses();
60844
- }, [updateRangeSelectionCellClasses]);
60905
+ }, [updateRangeSelectionCellClasses, hasSelectedMoreThanOneCellRef, rangeStartRef, rangeEndRef]);
60845
60906
  const mouseDownRef = React13.useRef([0, 0]);
60846
60907
  const trackMouseDown = React13.useCallback((e) => {
60847
60908
  mouseDownRef.current = [e.screenX, e.screenY];
60848
- }, []);
60909
+ }, [mouseDownRef]);
60849
60910
  const trackMouseUp = React13.useCallback((e) => {
60850
60911
  if (rangeEndRef.current) {
60851
60912
  rangeEndRef.current.clickLocation = [e.screenX, e.screenY];
60852
60913
  }
60853
- }, []);
60914
+ }, [rangeEndRef]);
60854
60915
  React13.useEffect(() => {
60855
60916
  document.addEventListener('mousedown', trackMouseDown, { capture: true });
60856
60917
  document.addEventListener('mouseup', trackMouseUp, { capture: true });
@@ -60858,7 +60919,7 @@ const useGridRangeSelection = ({ enableRangeSelection, gridDivRef, rangeStartRef
60858
60919
  document.removeEventListener('mousemove', trackMouseDown, { capture: true });
60859
60920
  document.removeEventListener('mouseup', trackMouseUp, { capture: true });
60860
60921
  };
60861
- }, []);
60922
+ }, [trackMouseDown, trackMouseUp]);
60862
60923
  const onCellMouseOver = React13.useCallback((e, mouseDown) => {
60863
60924
  if (!enableRangeSelection) {
60864
60925
  return;
@@ -60890,14 +60951,21 @@ const useGridRangeSelection = ({ enableRangeSelection, gridDivRef, rangeStartRef
60890
60951
  window.getSelection()?.removeAllRanges();
60891
60952
  }
60892
60953
  updateRangeSelectionCellClasses();
60893
- }, [enableRangeSelection, updateRangeSelectionCellClasses]);
60954
+ }, [
60955
+ enableRangeSelection,
60956
+ updateRangeSelectionCellClasses,
60957
+ hasSelectedMoreThanOneCellRef,
60958
+ rangeEndRef,
60959
+ rangeSortedNodesRef,
60960
+ rangeStartRef,
60961
+ ]);
60894
60962
  const onCellMouseDown = React13.useCallback((e) => {
60895
60963
  const button = e.event.buttons;
60896
60964
  if (button === 1) {
60897
60965
  clearRangeSelection();
60898
60966
  }
60899
60967
  onCellMouseOver(e, true);
60900
- }, [onCellMouseOver]);
60968
+ }, [onCellMouseOver, clearRangeSelection]);
60901
60969
  return { clearRangeSelection, ranges, onCellMouseDown, onCellMouseOver };
60902
60970
  };
60903
60971
 
@@ -61051,7 +61119,9 @@ const usePostSortRowsHook = ({ setStaleGrid }) => {
61051
61119
  };
61052
61120
  wasStale = true;
61053
61121
  // For some reason AgGrid mis-positions the inserted row.
61054
- lastNewNode && redrawRows();
61122
+ if (lastNewNode) {
61123
+ redrawRows();
61124
+ }
61055
61125
  }
61056
61126
  else if (changedRowCount == 1 && newRowCount === 0) {
61057
61127
  // User edited one row so, do nothing, retain sort
@@ -61246,7 +61316,9 @@ maxInitialWidth,
61246
61316
  selectRowsById([firstRowId]);
61247
61317
  }
61248
61318
  else {
61249
- focusByRowById(firstRowId, true);
61319
+ if (!isStorybook) {
61320
+ focusByRowById(firstRowId, true);
61321
+ }
61250
61322
  }
61251
61323
  }
61252
61324
  }, [
@@ -61603,7 +61675,7 @@ maxInitialWidth,
61603
61675
  const adjustedColDef = {
61604
61676
  ...colDef,
61605
61677
  // You cannot pass a width to a flex
61606
- width: !!colDef.flex ? undefined : colDef.width,
61678
+ width: colDef.flex ? undefined : colDef.width,
61607
61679
  ...(!!colDef.flex && { flexAutoSizeWidth: colDef.width }),
61608
61680
  // If this is allowed flex columns don't size based on flex
61609
61681
  suppressSizeToFit: true,
@@ -61676,10 +61748,36 @@ maxInitialWidth,
61676
61748
  el.classList.remove('ag-row-highlight-below');
61677
61749
  });
61678
61750
  }, []);
61751
+ const clearDragRowClasses = React13.useCallback(() => {
61752
+ document.querySelectorAll(`.ag-row-dragging`)?.forEach((el) => {
61753
+ el.classList.remove('ag-row-dragging');
61754
+ });
61755
+ }, []);
61679
61756
  const gridElementRef = React13.useRef(undefined);
61757
+ const multiDragAppliedRef = React13.useRef(false);
61758
+ const multiDragCountRef = React13.useRef(0);
61680
61759
  const onRowDragMove = React13.useCallback((event) => {
61681
61760
  if (startDragYRef.current === null) {
61682
61761
  startDragYRef.current = event.y;
61762
+ // On first move event, apply ag-row-dragging class to all selected rows for multi-drag
61763
+ if (rowSelection === 'multiple' && event.node.isSelected()) {
61764
+ const selectedNodes = event.api.getSelectedNodes().filter((n) => n.displayed && n.data != null);
61765
+ if (selectedNodes.length > 1) {
61766
+ multiDragAppliedRef.current = true;
61767
+ multiDragCountRef.current = selectedNodes.length;
61768
+ // Find the grid body element for scoped queries
61769
+ const targetEl = event.event.target;
61770
+ const gridElement = targetEl?.closest('.ag-body');
61771
+ if (gridElement) {
61772
+ gridElementRef.current = gridElement;
61773
+ for (const node of selectedNodes) {
61774
+ gridElement.querySelectorAll(`[row-id='${node.data.id}']`)?.forEach((el) => {
61775
+ el.classList.add('ag-row-dragging');
61776
+ });
61777
+ }
61778
+ }
61779
+ }
61780
+ }
61683
61781
  }
61684
61782
  const yDiff = event.y - startDragYRef.current;
61685
61783
  const data = event.overNode?.data;
@@ -61698,7 +61796,7 @@ maxInitialWidth,
61698
61796
  el.classList.add(yDiff < 0 ? 'ag-row-highlight-above' : 'ag-row-highlight-below');
61699
61797
  });
61700
61798
  }
61701
- }, [clearHighlightRowClasses]);
61799
+ }, [clearHighlightRowClasses, rowSelection]);
61702
61800
  const onCellFocused = React13.useCallback((event) => {
61703
61801
  if (event.rowIndex == null) {
61704
61802
  return;
@@ -61727,6 +61825,9 @@ maxInitialWidth,
61727
61825
  }, [paramsOnCellFocused]);
61728
61826
  const onRowDragEnd = React13.useCallback((event) => {
61729
61827
  clearHighlightRowClasses();
61828
+ clearDragRowClasses();
61829
+ multiDragAppliedRef.current = false;
61830
+ multiDragCountRef.current = 0;
61730
61831
  gridElementRef.current = undefined;
61731
61832
  if (!params.onRowDragEnd || startDragYRef.current === null) {
61732
61833
  return;
@@ -61739,9 +61840,26 @@ maxInitialWidth,
61739
61840
  if (!movedRow || !targetRow || movedRow === targetRow || yDiff === 0) {
61740
61841
  return;
61741
61842
  }
61742
- void params.onRowDragEnd({ movedRow, targetRow, direction: yDiff > 0 ? 1 : -1 });
61843
+ // Determine movedRows: if dragged row is part of a multi-selection, include all selected & displayed rows
61844
+ let movedRows;
61845
+ if (rowSelection === 'multiple' && event.node.isSelected()) {
61846
+ movedRows = event.api
61847
+ .getSelectedNodes()
61848
+ .filter((n) => n.displayed && n.data != null)
61849
+ .sort((a, b) => (a.rowIndex ?? 0) - (b.rowIndex ?? 0))
61850
+ .map((n) => n.data);
61851
+ }
61852
+ else {
61853
+ movedRows = [movedRow];
61854
+ }
61855
+ // If targetRow is one of the moved rows, no-op
61856
+ if (movedRows.some((r) => r.id === targetRow.id)) {
61857
+ return;
61858
+ }
61859
+ const direction = yDiff > 0 ? 1 : -1;
61860
+ void params.onRowDragEnd({ movedRow, movedRows, targetRow, direction });
61743
61861
  }
61744
- }, [params, clearHighlightRowClasses]);
61862
+ }, [params, clearHighlightRowClasses, clearDragRowClasses, rowSelection]);
61745
61863
  React13.useEffect(() => {
61746
61864
  if ((setExternalSelectedItems || setExternalSelectedIds) && selectable == null) {
61747
61865
  console.warn('<Grid/> has setExternalSelectedItems/setExternalSelectedIds parameter, but is missing selectable parameter,' +
@@ -61811,7 +61929,20 @@ maxInitialWidth,
61811
61929
  event.api.sizeColumnsToFit();
61812
61930
  }
61813
61931
  }, [sizeColumns]);
61814
- return (jsxRuntime.jsxs("div", { "data-testid": dataTestId, className: clsx('Grid-container', theme, 'theme-specific', staleGrid && 'Grid-sortIsStale', gridReady && rowData && autoSized && 'Grid-ready', params.hideSelectedRow && 'Grid-hideSelectedRow'), children: [contextMenuComponent, rangeSelectContextMenuComponent, jsxRuntime.jsx("div", { style: { flex: 1 }, ref: gridDivRef, onCopy: onCopyEvent, children: jsxRuntime.jsx(AgGridReact, { theme: 'legacy', domLayout: params.domLayout, defaultColDef: defaultColDef, columnDefs: columnDefsAdjusted, getRowId: getRowId, rowData: rowData, alwaysShowVerticalScroll: params.alwaysShowVerticalScroll, animateRows: params.animateRows ?? false, doesExternalFilterPass: doesExternalFilterPass, isExternalFilterPresent: isExternalFilterPresent, maintainColumnOrder: true, noRowsOverlayComponent: noRowsOverlayComponent, onCellClicked: onCellClicked, onCellContextMenu: rangeSelectInterceptContextMenu, onCellDoubleClicked: onCellDoubleClick, onCellEditingStopped: onCellEditingStopped, onCellFocused: onCellFocused, onCellKeyDown: onCellKeyPress, onCellMouseDown: onCellMouseDown, onCellMouseOver: onCellMouseOver, onColumnMoved: columnMoved, onColumnResized: onColumnResized, onColumnVisible: () => void setInitialContentSize(), onGridReady: onGridReady, onGridSizeChanged: onGridSizeChanged, onModelUpdated: onModelUpdated, onRowClicked: params.onRowClicked, onRowDataUpdated: onRowDataUpdated, onRowDoubleClicked: params.onRowDoubleClicked, onRowDragCancel: clearHighlightRowClasses, onRowDragEnd: onRowDragEnd, onRowDragMove: onRowDragMove, onSelectionChanged: synchroniseExternalStateToGridSelection, onSortChanged: onSortChanged, pinnedBottomRowData: params.pinnedBottomRowData, pinnedTopRowData: params.pinnedTopRowData, postSortRows: params.onRowDragEnd || !defaultPostSort ? undefined : postSortRows, preventDefaultOnContextMenu: true, quickFilterParser: quickFilterParser, rowClassRules: params.rowClassRules, rowDragText: params.rowDragText, rowHeight: rowHeight, rowSelection: selectable
61932
+ return (jsxRuntime.jsxs("div", { "data-testid": dataTestId, className: clsx('Grid-container', theme, 'theme-specific', staleGrid && 'Grid-sortIsStale', gridReady && rowData && autoSized && 'Grid-ready', params.hideSelectedRow && 'Grid-hideSelectedRow'), children: [contextMenuComponent, rangeSelectContextMenuComponent, jsxRuntime.jsx("div", { style: { flex: 1 }, ref: gridDivRef, onCopy: onCopyEvent, children: jsxRuntime.jsx(AgGridReact, { theme: 'legacy', domLayout: params.domLayout, defaultColDef: defaultColDef, columnDefs: columnDefsAdjusted, getRowId: getRowId, rowData: rowData, alwaysShowVerticalScroll: params.alwaysShowVerticalScroll, animateRows: params.animateRows ?? false, doesExternalFilterPass: doesExternalFilterPass, isExternalFilterPresent: isExternalFilterPresent, maintainColumnOrder: true, noRowsOverlayComponent: noRowsOverlayComponent, onCellClicked: onCellClicked, onCellContextMenu: rangeSelectInterceptContextMenu, onCellDoubleClicked: onCellDoubleClick, onCellEditingStopped: onCellEditingStopped, onCellFocused: onCellFocused, onCellKeyDown: onCellKeyPress, onCellMouseDown: onCellMouseDown, onCellMouseOver: onCellMouseOver, onColumnMoved: columnMoved, onColumnResized: onColumnResized, onColumnVisible: () => void setInitialContentSize(), onGridReady: onGridReady, onGridSizeChanged: onGridSizeChanged, onModelUpdated: onModelUpdated, onRowClicked: params.onRowClicked, onRowDataUpdated: onRowDataUpdated, onRowDoubleClicked: params.onRowDoubleClicked, onRowDragCancel: () => {
61933
+ clearHighlightRowClasses();
61934
+ clearDragRowClasses();
61935
+ multiDragAppliedRef.current = false;
61936
+ multiDragCountRef.current = 0;
61937
+ }, onRowDragEnd: onRowDragEnd, onRowDragMove: onRowDragMove, onSelectionChanged: synchroniseExternalStateToGridSelection, onSortChanged: onSortChanged, pinnedBottomRowData: params.pinnedBottomRowData, pinnedTopRowData: params.pinnedTopRowData, postSortRows: params.onRowDragEnd || !defaultPostSort ? undefined : postSortRows, preventDefaultOnContextMenu: true, quickFilterParser: quickFilterParser, rowClassRules: params.rowClassRules, rowDragText: params.rowDragText ??
61938
+ (rowSelection === 'multiple'
61939
+ ? () => {
61940
+ const count = multiDragCountRef.current;
61941
+ if (count > 1)
61942
+ return `Moving ${count} rows`;
61943
+ return '';
61944
+ }
61945
+ : undefined), rowHeight: rowHeight, rowSelection: selectable
61815
61946
  ? {
61816
61947
  enableSelectionWithoutKeys: params.enableSelectionWithoutKeys ?? false,
61817
61948
  enableClickSelection: params.enableClickSelection ?? false,
@@ -62043,13 +62174,43 @@ const GridCellMultiEditor = (props, cellEditorSelector) => GridCell({
62043
62174
  ...props,
62044
62175
  });
62045
62176
 
62177
+ /**
62178
+ * Reorders rows by removing movedRows from the array and inserting them at the target position.
62179
+ * @param rows - The current row array.
62180
+ * @param movedRows - Rows to move, in desired insertion order (typically display order).
62181
+ * @param targetRow - The row to insert relative to.
62182
+ * @param direction - -1 inserts above targetRow, 1 inserts below targetRow.
62183
+ * @returns A new array with the rows reordered, or the original array if the operation is a no-op.
62184
+ */
62185
+ function reorderRows(rows, movedRows, targetRow, direction) {
62186
+ if (movedRows.length === 0)
62187
+ return rows;
62188
+ const movedIds = new Set(movedRows.map((r) => r.id));
62189
+ // If targetRow is one of the moved rows, no-op
62190
+ if (movedIds.has(targetRow.id))
62191
+ return rows;
62192
+ // Remove moved rows from the array
62193
+ const remaining = rows.filter((r) => !movedIds.has(r.id));
62194
+ // Find where to insert relative to the target
62195
+ const targetIndex = remaining.findIndex((r) => r.id === targetRow.id);
62196
+ if (targetIndex === -1)
62197
+ return rows;
62198
+ const insertIndex = direction === 1 ? targetIndex + 1 : targetIndex;
62199
+ // Insert movedRows at the calculated position
62200
+ const result = [...remaining];
62201
+ result.splice(insertIndex, 0, ...movedRows);
62202
+ return result;
62203
+ }
62204
+
62046
62205
  const useGridFilter = (filter) => {
62047
62206
  const { addExternalFilter, removeExternalFilter } = useGridContext();
62048
62207
  React13.useEffect(() => {
62049
62208
  const thisFilter = filter;
62050
- thisFilter && addExternalFilter(thisFilter);
62209
+ if (thisFilter)
62210
+ addExternalFilter(thisFilter);
62051
62211
  return () => {
62052
- thisFilter && removeExternalFilter(thisFilter);
62212
+ if (thisFilter)
62213
+ removeExternalFilter(thisFilter);
62053
62214
  };
62054
62215
  }, [addExternalFilter, filter, removeExternalFilter]);
62055
62216
  };
@@ -62062,7 +62223,7 @@ const GridFilterButtons = ({ className, luiButtonProps, options, }) => {
62062
62223
  return (jsxRuntime.jsx("div", { className: clsx(className, 'flex-col-center'), children: jsxRuntime.jsx(lui.LuiButtonGroup, { children: options.map((option, index) => (jsxRuntime.jsx(lui.LuiButton, { ...luiButtonProps, className: clsx(`lui-button lui-button-secondary`, selectedOption?.label === option.label && `lui-button-active`, luiButtonProps?.className), onClick: () => setSelectedOption(option), children: option.label }, `${index}`))) }) }));
62063
62224
  };
62064
62225
 
62065
- var css_248z$3 = ".GridFilterColsMultiSelect{background:#fff;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:600;padding:8px}.GridFilterColsMultiSelect .LuiSelect-label-text{color:#6b6966;display:inline-block}.GridFilterColsMultiSelect .LuiCheckboxInput-item,.GridFilterColsMultiSelect .LuiCheckboxInput-selectAll{color:#2a292c;font-size:16px;font-weight:600;letter-spacing:0;line-height:20px;line-height:24px;margin-bottom:0}";
62226
+ var css_248z$3 = ".GridFilterColsMultiSelect{background:#fff;font-family:Open Sans,system-ui,sans-serif;font-style:normal;font-weight:600;padding:8px}.GridFilterColsMultiSelect .LuiSelect-label-text{color:#6b6966;display:inline-block}.GridFilterColsMultiSelect .LuiCheckboxInput-item,.GridFilterColsMultiSelect .LuiCheckboxInput-selectAll{color:#2a292c;font-size:16px;font-weight:600;letter-spacing:0;line-height:24px;margin-bottom:0}";
62066
62227
  styleInject(css_248z$3);
62067
62228
 
62068
62229
  const EMPTY_KEY = '__EMPTY__';
@@ -62261,7 +62422,8 @@ const GridFilterColumnsToggle = ({ saveState = true }) => {
62261
62422
  console.error(`stored invisible ids not strings: ${stored}`);
62262
62423
  }
62263
62424
  else {
62264
- invisibleIds && setInvisibleColumnIds(invisibleIds);
62425
+ if (invisibleIds)
62426
+ setInvisibleColumnIds(invisibleIds);
62265
62427
  }
62266
62428
  }
62267
62429
  }
@@ -62273,10 +62435,9 @@ const GridFilterColumnsToggle = ({ saveState = true }) => {
62273
62435
  }, [columnStorageKey, getColumns, loaded, resetColumns, saveState, setInvisibleColumnIds]);
62274
62436
  // Save state on column visibility change
62275
62437
  React13.useEffect(() => {
62276
- loaded &&
62277
- columnStorageKey &&
62278
- saveState &&
62438
+ if (loaded && columnStorageKey && saveState) {
62279
62439
  window.localStorage.setItem(columnStorageKey, JSON.stringify(invisibleColumnIds));
62440
+ }
62280
62441
  }, [columnStorageKey, invisibleColumnIds, loaded, saveState]);
62281
62442
  const toggleColumn = React13.useCallback((colId) => {
62282
62443
  if (!colId || !invisibleColumnIds)
@@ -62919,7 +63080,7 @@ styleInject(css_248z$1);
62919
63080
  const TextInputFormatted = (props) => {
62920
63081
  return (jsxRuntime.jsxs("div", { className: clsx('LuiTextInput GridLuiTextInput Grid-popoverContainer', props.error && 'hasError', props.className), children: [jsxRuntime.jsxs("span", { className: "LuiTextInput-inputWrapper", children: [jsxRuntime.jsx("input", { type: 'text', spellCheck: true, defaultValue: props.value, ...lodashEs.omit(props, ['error', 'value', 'helpText', 'formatted', 'className', 'allowTabToSave']), className: 'LuiTextInput-input', onMouseEnter: (e) => {
62921
63082
  e.currentTarget.focus();
62922
- props.onMouseEnter && props.onMouseEnter(e);
63083
+ props.onMouseEnter?.(e);
62923
63084
  }, "data-allowtabtosave": props.allowTabToSave }), jsxRuntime.jsx("span", { className: 'LuiTextInput-formatted', children: props.formatted })] }), jsxRuntime.jsx(FormError, { error: props.error, helpText: props.helpText })] }));
62924
63085
  };
62925
63086
 
@@ -63358,12 +63519,16 @@ const FilterInput = (props) => {
63358
63519
  void triggerSave();
63359
63520
  return;
63360
63521
  }
63361
- onSelectFilter && addCustomFilterValue();
63522
+ if (onSelectFilter) {
63523
+ addCustomFilterValue();
63524
+ }
63362
63525
  }
63363
63526
  lastKeyWasEnter.current = true;
63364
63527
  }
63365
63528
  else if (e.key === 'Control') {
63366
- lastKeyWasEnter.current && setFilter('');
63529
+ if (lastKeyWasEnter.current) {
63530
+ setFilter('');
63531
+ }
63367
63532
  lastKeyWasEnter.current = false;
63368
63533
  }
63369
63534
  else {
@@ -63384,7 +63549,9 @@ const MenuRadioItem = (props) => {
63384
63549
  e.keepOpen = true;
63385
63550
  toggleValue(item);
63386
63551
  }
63387
- item.checked && props.onChecked && props.onChecked();
63552
+ if (item.checked) {
63553
+ props.onChecked?.();
63554
+ }
63388
63555
  }, children: jsxRuntime.jsx(lui.LuiCheckboxInput, { isChecked: item.checked ?? false, value: `${item.value}`, label: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [item.warning && jsxRuntime.jsx(GridIcon, { icon: 'ic_warning_outline', title: item.warning }), item.label ?? (item.value == null ? `<${item.value}>` : `${item.value}`)] }), inputProps: {
63389
63556
  onClick: (e) => {
63390
63557
  // Click is handled by MenuItem onClick
@@ -63601,7 +63768,7 @@ const TextAreaInput = (props) => {
63601
63768
  e.currentTarget.focus();
63602
63769
  e.currentTarget.selectionStart = e.currentTarget.value.length;
63603
63770
  }
63604
- props.onMouseEnter && props.onMouseEnter(e);
63771
+ props.onMouseEnter?.(e);
63605
63772
  }, "data-allowtabtosave": props.allowTabToSave, children: props.value }) })] }), jsxRuntime.jsx(FormError, { error: props.error, helpText: props.helpText })] }));
63606
63773
  };
63607
63774
 
@@ -63997,7 +64164,7 @@ const GridContextProvider = (props) => {
63997
64164
  throw 'expected exception - exit_loop';
63998
64165
  });
63999
64166
  }
64000
- catch (ex) {
64167
+ catch {
64001
64168
  // ignore
64002
64169
  }
64003
64170
  return id;
@@ -64124,7 +64291,7 @@ const GridContextProvider = (props) => {
64124
64291
  const colId = col.colId;
64125
64292
  // We need to make sure we aren't currently editing a cell otherwise tests will fail
64126
64293
  // as they will start to edit the cell before this stuff has a chance to run
64127
- colId &&
64294
+ if (colId) {
64128
64295
  lodashEs.delay(() => {
64129
64296
  if (!gridApi.isDestroyed() &&
64130
64297
  lodashEs.isEmpty(gridApi.getEditingCells()) &&
@@ -64136,6 +64303,7 @@ const GridContextProvider = (props) => {
64136
64303
  gridApi.setFocusedCell(rowIndex, agGridSelectRowColId);
64137
64304
  }
64138
64305
  }, 100);
64306
+ }
64139
64307
  }
64140
64308
  }
64141
64309
  }
@@ -64152,7 +64320,9 @@ const GridContextProvider = (props) => {
64152
64320
  if (flash) {
64153
64321
  lodashEs.delay(() => {
64154
64322
  try {
64155
- !gridApi.isDestroyed() && gridApi.flashCells({ rowNodes });
64323
+ if (!gridApi.isDestroyed()) {
64324
+ gridApi.flashCells({ rowNodes });
64325
+ }
64156
64326
  }
64157
64327
  catch {
64158
64328
  // ignore, flash cells sometimes throws errors as nodes have gone out of scope
@@ -64443,7 +64613,9 @@ const GridContextProvider = (props) => {
64443
64613
  // !gridApi.isDestroyed && gridApi.setFocusedCell(cell.rowIndex, cell.column);
64444
64614
  // }
64445
64615
  // This is needed to trigger postSortRowsHook
64446
- !gridApi.isDestroyed && gridApi.refreshClientSideRowModel();
64616
+ if (!gridApi.isDestroyed) {
64617
+ gridApi.refreshClientSideRowModel();
64618
+ }
64447
64619
  }
64448
64620
  void (async () => {
64449
64621
  // Only focus next cell if user hasn't already manually changed focus
@@ -64469,7 +64641,9 @@ const GridContextProvider = (props) => {
64469
64641
  }, [gridApiOp, modifyUpdating, onBulkEditingComplete, selectNextEditableCell]);
64470
64642
  const redrawRows = React13.useMemo(() => debounce((rowNodes) => {
64471
64643
  try {
64472
- gridApi && gridApi.redrawRows(rowNodes ? { rowNodes } : undefined);
64644
+ if (gridApi) {
64645
+ gridApi.redrawRows(rowNodes ? { rowNodes } : undefined);
64646
+ }
64473
64647
  }
64474
64648
  catch (ex) {
64475
64649
  console.error(ex);
@@ -64494,7 +64668,9 @@ const GridContextProvider = (props) => {
64494
64668
  const postHash = hasFocusedCell && getDisplayedRowsHash();
64495
64669
  // Ag-grid has a bug where if a focused cell comes into view after a filter the filter loses focus
64496
64670
  // So the focus is cleared to prevent this
64497
- preHash !== postHash && gridApi.clearFocusedCell();
64671
+ if (preHash !== postHash) {
64672
+ gridApi.clearFocusedCell();
64673
+ }
64498
64674
  }
64499
64675
  }, 200), [gridApi]);
64500
64676
  const addExternalFilter = React13.useCallback((filter) => {
@@ -64523,7 +64699,9 @@ const GridContextProvider = (props) => {
64523
64699
  const visibleColumnsContainsAFlex = newVisibleColumns.some(isFlexColumn);
64524
64700
  if (!visibleColumnsContainsAFlex) {
64525
64701
  const fillerColumn = getColumns(isGridCellFiller)[0];
64526
- fillerColumn && newVisibleColumns.push(fillerColumn);
64702
+ if (fillerColumn) {
64703
+ newVisibleColumns.push(fillerColumn);
64704
+ }
64527
64705
  }
64528
64706
  gridApi.setColumnsVisible(lodashEs.compact(newVisibleColumns.map(getColId)), true);
64529
64707
  // Hide the filler column if there's already a flex column
@@ -64696,7 +64874,12 @@ const ActionButton = ({ icon, name, inProgressName, disabled, dataTestId, style,
64696
64874
  React13.useEffect(() => {
64697
64875
  if (inProgress == lastInProgress)
64698
64876
  return;
64699
- inProgress ? setLocalInProgress(true) : setLocalInProgressDeferred(false, minimumInProgressTimeMs);
64877
+ if (inProgress) {
64878
+ setLocalInProgress(true);
64879
+ }
64880
+ else {
64881
+ setLocalInProgressDeferred(false, minimumInProgressTimeMs);
64882
+ }
64700
64883
  }, [inProgress, lastInProgress, setLocalInProgress, setLocalInProgressDeferred]);
64701
64884
  const buttonText = (jsxRuntime.jsxs("span", { className: 'ActionButton-minimalArea', children: [jsxRuntime.jsx("span", { className: 'ActionButton-minimalAreaDisplay', children: (localInProgress ? inProgressName : name) ?? name }), jsxRuntime.jsx("span", { className: 'ActionButton-minimalAreaExpand', children: name })] }));
64702
64885
  return (jsxRuntime.jsxs(lui.LuiButton, { "data-testid": dataTestId, type: 'button', level: level, title: title ?? ariaLabel ?? name, buttonProps: { 'aria-label': ariaLabel ?? name }, className: clsx('lui-button-icon-right', 'ActionButton', className, localInProgress && 'ActionButton-inProgress', name != null && !className?.includes('ActionButton-fill') && 'ActionButton-minimal', name == null && 'ActionButton-iconOnly'), size: 'lg', style: style, onClick: () => {
@@ -64728,7 +64911,7 @@ const useDeferredPromise = () => {
64728
64911
  // End promise on unload
64729
64912
  React13.useEffect(() => {
64730
64913
  return () => {
64731
- promiseReject.current && promiseReject.current();
64914
+ promiseReject.current?.();
64732
64915
  };
64733
64916
  }, []);
64734
64917
  return {
@@ -64860,6 +65043,7 @@ exports.isFloat = isFloat;
64860
65043
  exports.isGridCellFiller = isGridCellFiller;
64861
65044
  exports.isNotEmpty = isNotEmpty;
64862
65045
  exports.primitiveToSelectOption = primitiveToSelectOption;
65046
+ exports.reorderRows = reorderRows;
64863
65047
  exports.sanitiseFileName = sanitiseFileName;
64864
65048
  exports.stringByteLengthIsInvalid = stringByteLengthIsInvalid;
64865
65049
  exports.suppressCellKeyboardEvents = suppressCellKeyboardEvents;