@linzjs/step-ag-grid 2.1.3 → 2.2.1

package/dist/src/index.d.ts

@@ -23,9 +23,13 @@ export { GridPopoverEditDropDown } from "./components/gridPopoverEdit/GridPopove
 export { GridPopoverMessage } from "./components/gridPopoverEdit/GridPopoverMessage";
 export { GridPopoverTextArea } from "./components/gridPopoverEdit/GridPopoverTextArea";
 export { GridPopoverTextInput } from "./components/gridPopoverEdit/GridPopoverTextInput";
+export * from "./components/gridForm/GridFormDropDown";
+export * from "./components/gridForm/GridFormMultiSelect";
+export * from "./components/gridForm/GridFormPopoutMenu";
 export { GridHeaderSelect } from "./components/gridHeader/GridHeaderSelect";
 export { TextAreaInput } from "./lui/TextAreaInput";
 export { TextInputFormatted } from "./lui/TextInputFormatted";
 export { GridSubComponentTextArea } from "./components/GridSubComponentTextArea";
+export * from "./lui/ActionButton";
 export * from "./utils/bearing";
 export * from "./utils/util";

package/dist/src/lui/ActionButton.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import "./ActionButton.scss";
+import { IconName } from "@linzjs/lui/dist/components/LuiIcon/LuiIcon";
+export interface ActionButtonProps {
+    icon: IconName;
+    name: string;
+    inProgressName?: string;
+    title?: string;
+    dataTestId?: string;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | "ns";
+    className?: string;
+    onClick?: () => void;
+    inProgress?: boolean;
+}
+export declare const ActionButton: ({ icon, name, inProgressName, dataTestId, inProgress, className, title, onClick, size, }: ActionButtonProps) => JSX.Element;

package/dist/src/lui/reactUtils.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Track previous values of states.
+ *
+ * @param value Value to track.
+ */
+export declare const usePrevious: <T extends unknown>(value: T) => T | undefined;

package/dist/src/lui/reactUtils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/lui/stateDeferredHook.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Defers state change up to a minimum time since last state change.
+ */
+export declare const useStateDeferred: <T extends unknown>(initialValue: T) => [T, (v: T) => void, (v: T, w: number) => void];

package/dist/src/lui/timeoutHook.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Cancels timeouts on scope being destroyed.
+ *
+ * This could almost be a debounce, but debounce tracks by function reference, this tracks by hook reference.
+ * This could have been implemented using debounce if the callers function was wrapped in useCallback,
+ * but there's no way to enforce that, so  it would lead to bugs.
+ */
+export declare const useTimeoutHook: () => (fn: () => void, waitTimeMs: number) => void;

package/dist/src/lui/timeoutHook.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/react-menu3/components/ControlledMenu.d.ts

@@ -1,8 +1,8 @@
 import { MutableRefObject, ForwardedRef } from "react";
 import { ControlledMenuProps } from "../types";
-export declare const ControlledMenuFr: ({ "aria-label": ariaLabel, className, containerProps, initialMounted, unmountOnClose, transition, transitionTimeout, boundingBoxRef, boundingBoxPadding, reposition, submenuOpenDelay, submenuCloseDelay, skipOpen, viewScroll, portal, theming, onItemClick, onClose, saveButtonRef, ...restProps }: ControlledMenuProps & {
+export declare const ControlledMenuFr: ({ "aria-label": ariaLabel, className, containerProps, initialMounted, unmountOnClose, transition, transitionTimeout, boundingBoxRef, boundingBoxPadding, reposition, submenuOpenDelay, submenuCloseDelay, skipOpen, viewScroll, portal, theming, onItemClick, onClose, saveButtonRef, closeMenuExclusionClassName, ...restProps }: ControlledMenuProps & {
     saveButtonRef?: MutableRefObject<HTMLButtonElement | null> | undefined;
 }, externalRef: ForwardedRef<HTMLUListElement>) => JSX.Element | null;
 export declare const ControlledMenu: import("react").ForwardRefExoticComponent<Pick<ControlledMenuProps & {
     saveButtonRef?: MutableRefObject<HTMLButtonElement | null> | undefined;
-}, "aria-label" | "className" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "containerProps" | "initialMounted" | "unmountOnClose" | "transition" | "transitionTimeout" | "boundingBoxRef" | "boundingBoxPadding" | "reposition" | "submenuOpenDelay" | "submenuCloseDelay" | "skipOpen" | "viewScroll" | "portal" | "theming" | "onItemClick" | "onClose" | "saveButtonRef" | "anchorPoint" | "anchorRef" | "captureFocus" | "state" | "menuItemFocus" | "endTransition" | "repositionFlag" | "dontShrinkIfDirectionIsTop" | "menuClassName" | "menuStyle" | "arrowClassName" | "arrowStyle" | "arrow" | "offsetX" | "offsetY" | "align" | "direction" | "position" | "overflow" | "setDownOverflow" | "isDisabled" | "ariaLabel" | "containerRef" | "externalRef" | "parentScrollingRef"> & import("react").RefAttributes<HTMLUListElement>>;
+}, "aria-label" | "className" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "containerProps" | "initialMounted" | "unmountOnClose" | "transition" | "transitionTimeout" | "boundingBoxRef" | "boundingBoxPadding" | "reposition" | "submenuOpenDelay" | "submenuCloseDelay" | "skipOpen" | "viewScroll" | "portal" | "theming" | "onItemClick" | "onClose" | "saveButtonRef" | "closeMenuExclusionClassName" | "anchorPoint" | "anchorRef" | "captureFocus" | "state" | "menuItemFocus" | "endTransition" | "repositionFlag" | "dontShrinkIfDirectionIsTop" | "menuClassName" | "menuStyle" | "arrowClassName" | "arrowStyle" | "arrow" | "offsetX" | "offsetY" | "align" | "direction" | "position" | "overflow" | "setDownOverflow" | "isDisabled" | "ariaLabel" | "containerRef" | "externalRef" | "parentScrollingRef"> & import("react").RefAttributes<HTMLUListElement>>;

package/dist/src/react-menu3/types.d.ts

@@ -396,5 +396,9 @@ export interface ControlledMenuProps extends RootMenuProps, ExtraMenuProps {
      * Event fired when menu is about to close.
      */
     onClose?: EventHandler<MenuCloseEvent>;
+    /**
+     * When clicking outside the menu to close, anything with this class will not cause a close.
+     */
+    closeMenuExclusionClassName?: string;
 }
 export {};

package/dist/step-ag-grid.esm.js

@@ -3,7 +3,7 @@ import { unstable_batchedUpdates, flushSync, createPortal } from 'react-dom';
 import { findIndex, isEmpty, castArray, remove, flatten, delay, sortBy, last, difference, xorBy, fromPairs } from 'lodash-es';
 import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
 import { AgGridReact } from 'ag-grid-react';
-import { LuiMiniSpinner, LuiIcon, LuiCheckboxInput } from '@linzjs/lui';
+import { LuiMiniSpinner, LuiIcon, LuiCheckboxInput, LuiButton } from '@linzjs/lui';
 
 // Generate className following BEM methodology: http://getbem.com/naming/
 // Modifier value can be one of the following types: boolean, string, undefined
@@ -1276,7 +1276,7 @@ var EventHandlersContext = createContext({
 });
 
 var ControlledMenuFr = function (_a, externalRef) {
-    var ariaLabel = _a["aria-label"], className = _a.className, containerProps = _a.containerProps, initialMounted = _a.initialMounted, unmountOnClose = _a.unmountOnClose, transition = _a.transition, transitionTimeout = _a.transitionTimeout, boundingBoxRef = _a.boundingBoxRef, boundingBoxPadding = _a.boundingBoxPadding, _b = _a.reposition, reposition = _b === void 0 ? "auto" : _b, _c = _a.submenuOpenDelay, submenuOpenDelay = _c === void 0 ? 300 : _c, _d = _a.submenuCloseDelay, submenuCloseDelay = _d === void 0 ? 150 : _d, skipOpen = _a.skipOpen, _e = _a.viewScroll, viewScroll = _e === void 0 ? "initial" : _e, portal = _a.portal, theming = _a.theming, onItemClick = _a.onItemClick, onClose = _a.onClose, saveButtonRef = _a.saveButtonRef, restProps = __rest(_a, ["aria-label", "className", "containerProps", "initialMounted", "unmountOnClose", "transition", "transitionTimeout", "boundingBoxRef", "boundingBoxPadding", "reposition", "submenuOpenDelay", "submenuCloseDelay", "skipOpen", "viewScroll", "portal", "theming", "onItemClick", "onClose", "saveButtonRef"]);
+    var ariaLabel = _a["aria-label"], className = _a.className, containerProps = _a.containerProps, initialMounted = _a.initialMounted, unmountOnClose = _a.unmountOnClose, transition = _a.transition, transitionTimeout = _a.transitionTimeout, boundingBoxRef = _a.boundingBoxRef, boundingBoxPadding = _a.boundingBoxPadding, _b = _a.reposition, reposition = _b === void 0 ? "auto" : _b, _c = _a.submenuOpenDelay, submenuOpenDelay = _c === void 0 ? 300 : _c, _d = _a.submenuCloseDelay, submenuCloseDelay = _d === void 0 ? 150 : _d, skipOpen = _a.skipOpen, _e = _a.viewScroll, viewScroll = _e === void 0 ? "initial" : _e, portal = _a.portal, theming = _a.theming, onItemClick = _a.onItemClick, onClose = _a.onClose, saveButtonRef = _a.saveButtonRef, closeMenuExclusionClassName = _a.closeMenuExclusionClassName, restProps = __rest(_a, ["aria-label", "className", "containerProps", "initialMounted", "unmountOnClose", "transition", "transitionTimeout", "boundingBoxRef", "boundingBoxPadding", "reposition", "submenuOpenDelay", "submenuCloseDelay", "skipOpen", "viewScroll", "portal", "theming", "onItemClick", "onClose", "saveButtonRef", "closeMenuExclusionClassName"]);
     var containerRef = useRef();
     var scrollNodesRef = useRef({});
     var anchorRef = restProps.anchorRef, state = restProps.state;
@@ -1304,11 +1304,11 @@ var ControlledMenuFr = function (_a, externalRef) {
         viewScroll,
     ]);
     var clickIsWithinMenu = useCallback(function (ev) {
-        return hasParentClass("szh-menu--state-open", ev.target);
-    }, []);
+        return hasParentClass("szh-menu--state-open", ev.target) ||
+            (closeMenuExclusionClassName && hasParentClass(closeMenuExclusionClassName, ev.target));
+    }, [closeMenuExclusionClassName]);
     var handleScreenEventForSave = useCallback(function (ev) {
         if (!clickIsWithinMenu(ev)) {
-            //!ev.currentTarget.contains(ev.relatedTarget || document.activeElement)) {
             ev.preventDefault();
             ev.stopPropagation();
             // FIXME There's an issue in React17
@@ -2518,11 +2518,11 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z$6 = ".AgGridGenericCellRenderer-icon{margin-right:4px}.AgGridGenericCellRenderer-ic_infoIcon{fill:#3a7cdf;margin-right:4px}.AgGridGenericCellRenderer-ic_warningIcon{fill:#ea6a2e;margin-right:4px}";
-styleInject(css_248z$6);
+var css_248z$7 = ".AgGridGenericCellRenderer-icon{margin-right:4px}.AgGridGenericCellRenderer-ic_infoIcon{fill:#3a7cdf;margin-right:4px}.AgGridGenericCellRenderer-ic_warningIcon{fill:#ea6a2e;margin-right:4px}";
+styleInject(css_248z$7);
 
-var css_248z$5 = ".GridLoadableCell-container{align-items:center;display:flex}";
-styleInject(css_248z$5);
+var css_248z$6 = ".GridLoadableCell-container{align-items:center;display:flex}";
+styleInject(css_248z$6);
 
 var GridLoadableCell = function (props) {
     if (props.isLoading) {
@@ -2708,7 +2708,7 @@ var useGridPopoverHook = function (props) {
         });
     }); }, [props, stopEditing, propsRef]);
     var popoverWrapper = useCallback(function (children) {
-        return (jsx(Fragment$1, { children: anchorRef.current && (jsxs(ControlledMenu, __assign({ state: isOpen ? "open" : "closed", portal: true, unmountOnClose: true, anchorRef: anchorRef, saveButtonRef: saveButtonRef, menuClassName: "step-ag-grid-react-menu", onClose: function (event) { return triggerSave(event.reason).then(); }, viewScroll: "auto", dontShrinkIfDirectionIsTop: true, className: props.className }, { children: [saving && ( // This is the overlay that prevents editing when the editor is saving
+        return (jsx(Fragment$1, { children: anchorRef.current && (jsxs(ControlledMenu, __assign({ state: isOpen ? "open" : "closed", portal: true, unmountOnClose: true, anchorRef: anchorRef, saveButtonRef: saveButtonRef, menuClassName: "step-ag-grid-react-menu", onClose: function (event) { return triggerSave(event.reason).then(); }, viewScroll: "auto", dontShrinkIfDirectionIsTop: true, className: props.className, closeMenuExclusionClassName: "ReactModal__Content" }, { children: [saving && ( // This is the overlay that prevents editing when the editor is saving
                     jsx("div", { style: {
                             position: "absolute",
                             left: 0,
@@ -2744,11 +2744,11 @@ var GridRenderPopoutMenuCell = function (props) {
     return (jsx(GridLoadableCell, __assign({ isLoading: isLoading, className: disabled ? "GridPopoutMenu-burgerDisabled" : "GridPopoutMenu-burger" }, { children: jsx(LuiIcon, { name: "ic_more_vert", alt: "More actions", size: "md" }) })));
 };
 
-var css_248z$4 = ".GridMultiSelect-containerSmall .GridFormMultiSelect-options{max-height:130px;overflow-y:auto}.GridMultiSelect-containerMedium .GridFormMultiSelect-options{max-height:190px;overflow-y:auto}.GridMultiSelect-containerLarge .GridFormMultiSelect-options{max-height:320px;overflow-y:auto}.GridMultiSelect-containerUnlimited .GridFormMultiSelect-options{overflow-y:auto}";
-styleInject(css_248z$4);
+var css_248z$5 = ".GridMultiSelect-containerSmall .GridFormMultiSelect-options{max-height:130px;overflow-y:auto}.GridMultiSelect-containerMedium .GridFormMultiSelect-options{max-height:190px;overflow-y:auto}.GridMultiSelect-containerLarge .GridFormMultiSelect-options{max-height:320px;overflow-y:auto}.GridMultiSelect-containerUnlimited .GridFormMultiSelect-options{overflow-y:auto}";
+styleInject(css_248z$5);
 
-var css_248z$3 = ".GridPopoverEditDropDown-containerSmall .GridFormDropDown-options{max-height:120px;overflow-y:auto}.GridPopoverEditDropDown-containerMedium .GridFormDropDown-options{max-height:200px;overflow-y:auto}.GridPopoverEditDropDown-containerLarge .GridFormDropDown-options{max-height:400px;overflow-y:auto}.GridPopoverEditDropDown-containerUnlimited .GridFormDropDown-options{overflow-y:auto}";
-styleInject(css_248z$3);
+var css_248z$4 = ".GridPopoverEditDropDown-containerSmall .GridFormDropDown-options{max-height:120px;overflow-y:auto}.GridPopoverEditDropDown-containerMedium .GridFormDropDown-options{max-height:200px;overflow-y:auto}.GridPopoverEditDropDown-containerLarge .GridFormDropDown-options{max-height:400px;overflow-y:auto}.GridPopoverEditDropDown-containerUnlimited .GridFormDropDown-options{overflow-y:auto}";
+styleInject(css_248z$4);
 
 /* global setTimeout, clearTimeout */
 
@@ -2822,8 +2822,11 @@ function defer() {
 }
 
 var MenuSeparatorString = "_____MENU_SEPARATOR_____";
-Object.freeze({ value: MenuSeparatorString });
+var MenuSeparator = Object.freeze({ value: MenuSeparatorString });
 var MenuHeaderString = "_____MENU_HEADER_____";
+var MenuHeaderItem = function (title) {
+    return { label: title, value: MenuHeaderString };
+};
 var GridFormDropDown = function (_props) {
     var props = _props;
     var _a = useContext(GridContext), updatingCells = _a.updatingCells, stopEditing = _a.stopEditing;
@@ -3120,8 +3123,8 @@ var GridPopoutEditMultiSelect = function (colDef, props) {
     return GridCell(__assign({ initialWidth: 65, maxWidth: 150 }, colDef), __assign(__assign({ editor: GridFormMultiSelect }, props), { editorParams: __assign({ className: "GridMultiSelect-containerMedium" }, props.editorParams) }));
 };
 
-var css_248z$2 = ".GridPopoutMenu-burger{cursor:pointer}.GridPopoutMenu-burger svg{fill:#007198}.GridPopoutMenu-burgerDisabled svg{fill:#989189}";
-styleInject(css_248z$2);
+var css_248z$3 = ".GridPopoutMenu-burger{cursor:pointer}.GridPopoutMenu-burger svg{fill:#007198}.GridPopoutMenu-burgerDisabled svg{fill:#989189}";
+styleInject(css_248z$3);
 
 /** Menu configuration types **/
 var PopoutMenuSeparator = Object.freeze({ __isMenuSeparator__: true });
@@ -3284,11 +3287,11 @@ var convertDDToDMS = function (dd, showPositiveSymbol, addTrailingZeros) {
     return dmsString;
 };
 
-var css_248z$1 = ".GridFormEditBearing-input{width:320px}";
-styleInject(css_248z$1);
+var css_248z$2 = ".GridFormEditBearing-input{width:320px}";
+styleInject(css_248z$2);
 
-var css_248z = ".LuiTextInput{margin-bottom:0}.LuiTextInput-formatted{color:#beb9b4;line-height:48px;position:absolute;right:14px;top:0}";
-styleInject(css_248z);
+var css_248z$1 = ".LuiTextInput{margin-bottom:0}.LuiTextInput-formatted{color:#beb9b4;line-height:48px;position:absolute;right:14px;top:0}";
+styleInject(css_248z$1);
 
 var TextInputFormatted = function (props) {
     return (jsxs("div", __assign({ className: clsx("LuiTextInput Grid-popoverContainer", props.error && "hasError", props.warning && "hasWarning", props.className) }, { children: [jsxs("span", __assign({ className: "LuiTextInput-inputWrapper" }, { children: [jsx("input", __assign({ type: "text", className: "LuiTextInput-input", min: "0", value: props.value, onChange: props.onChange }, props.inputProps)), jsx("span", __assign({ className: "LuiTextInput-formatted" }, { children: props.formatted }))] })), props.error && (jsxs("span", __assign({ className: "LuiTextInput-error" }, { children: [jsx(LuiIcon, { alt: "error", name: "ic_error", className: "LuiTextInput-error-icon", size: "sm", status: "error" }), props.error] }))), props.warning && (jsxs("span", __assign({ className: "LuiTextInput-warning" }, { children: [jsx(LuiIcon, { alt: "warning", name: "ic_warning", className: "LuiTextInput-warning-icon", size: "sm", status: "warning" }), props.warning] })))] })));
@@ -3590,5 +3593,96 @@ var GridSubComponentTextArea = function (props) {
     return (jsx("div", __assign({ className: "FreeTextInput LuiDeprecatedForms" }, { children: jsx("textarea", { autoFocus: true, maxLength: 10000, spellCheck: true, className: "free-text-input", onChange: function (e) { return setValue(e.target.value); }, defaultValue: value }) })));
 };
 
-export { ComponentLoadingWrapper, ControlledMenu, FocusableItem, GenericCellEditorComponent, GenericMultiEditCellClass, Grid, GridCell, GridCellRenderer, GridContext, GridContextProvider, GridHeaderSelect, GridIcon, GridLoadableCell, GridPopoutEditMultiSelect, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridRendererGenericCell, GridSubComponentTextArea, GridUpdatingContext, GridUpdatingContextProvider, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuItem, MenuRadioGroup, SubMenu, TextAreaInput, TextInputFormatted, bearingCorrectionValueFormatter, bearingNumberParser, bearingStringValidator, bearingValueFormatter, convertDDToDMS, hasParentClass, isFloat, isNotEmpty, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait };
+var css_248z = ".ActionButton{align-items:center;display:flex}.ActionButton .LuiIcon{margin:0 4px!important}.ActionButton-minimalArea{position:relative}.ActionButton-minimalAreaDisplay{position:absolute}.ActionButton-minimalAreaExpand{visibility:hidden}.ActionButton-inProgress{background-color:#e2f3f7!important;color:#007198!important;cursor:progress}.ActionButton-inProgress svg *{fill:#0000!important}";
+styleInject(css_248z);
+
+/**
+ * Track previous values of states.
+ *
+ * @param value Value to track.
+ */
+var usePrevious = function (value) {
+    var ref = useRef();
+    useEffect(function () {
+        ref.current = value;
+    }, [value]);
+    return ref.current;
+};
+
+/**
+ * Cancels timeouts on scope being destroyed.
+ *
+ * This could almost be a debounce, but debounce tracks by function reference, this tracks by hook reference.
+ * This could have been implemented using debounce if the callers function was wrapped in useCallback,
+ * but there's no way to enforce that, so  it would lead to bugs.
+ */
+var useTimeoutHook = function () {
+    var timeout = useRef();
+    /**
+     * Clear any pending timeouts.
+     */
+    var clearTimeouts = function () {
+        if (timeout.current) {
+            var tc = timeout.current;
+            timeout.current = undefined;
+            clearTimeout(tc);
+        }
+    };
+    /**
+     * Call this when your action has completed.
+     */
+    var invoke = useCallback(function (fn, waitTimeMs) {
+        clearTimeouts();
+        timeout.current = setTimeout(fn, waitTimeMs);
+    }, []);
+    /**
+     * Clear timeout on loss of scope.
+     */
+    useEffect(function () {
+        return function () { return clearTimeouts(); };
+    }, []);
+    return invoke;
+};
+
+/**
+ * Defers state change up to a minimum time since last state change.
+ */
+var useStateDeferred = function (initialValue) {
+    var startTime = useRef(0);
+    var timeoutHook = useTimeoutHook();
+    var _a = useState(initialValue), value = _a[0], _setValue = _a[1];
+    var setValue = useCallback(function (newValue) {
+        startTime.current = Date.now();
+        _setValue(newValue);
+    }, []);
+    var setValueDeferred = useCallback(function (newValue, minimumWaitTimeMs) {
+        var waitTimeMs = Math.max(minimumWaitTimeMs - (Date.now() - startTime.current), 0);
+        timeoutHook(function () { return _setValue(newValue); }, waitTimeMs);
+    }, [timeoutHook]);
+    return [value, setValue, setValueDeferred];
+};
+
+// Kept this less than one second, so I don't have issues with waitFor as it defaults to 1s
+var minimumInProgressTimeMs = 950;
+var ActionButton = function (_a) {
+    var _b;
+    var _c;
+    var icon = _a.icon, name = _a.name, inProgressName = _a.inProgressName, dataTestId = _a.dataTestId, inProgress = _a.inProgress, className = _a.className, title = _a.title, onClick = _a.onClick, _d = _a.size, size = _d === void 0 ? "sm" : _d;
+    var lastInProgress = usePrevious(inProgress !== null && inProgress !== void 0 ? inProgress : false);
+    var _e = useStateDeferred(!!inProgress), localInProgress = _e[0], setLocalInProgress = _e[1], setLocalInProgressDeferred = _e[2];
+    useEffect(function () {
+        if (inProgress == lastInProgress)
+            return;
+        inProgress ? setLocalInProgress(true) : setLocalInProgressDeferred(false, minimumInProgressTimeMs);
+    }, [inProgress, lastInProgress, setLocalInProgress, setLocalInProgressDeferred]);
+    return (jsxs(LuiButton, __assign({ "data-testid": dataTestId, type: "button", level: "tertiary", title: title !== null && title !== void 0 ? title : name, "aria-label": name, className: clsx("lui-button-icon", "ActionButton", className, localInProgress && "ActionButton-inProgress"), size: "lg", onClick: onClick, disabled: localInProgress }, { children: [localInProgress ? (jsx(LuiMiniSpinner, { size: 16, divProps: (_b = {
+                        "data-testid": "loading-spinner",
+                        style: { padding: 0, margin: 0, paddingRight: 8 },
+                        role: "status"
+                    },
+                    _b["aria-label"] = "Loading",
+                    _b) })) : (jsx(LuiIcon, { name: icon, alt: name, size: size })), jsxs("span", __assign({ className: "ActionButton-minimalArea" }, { children: [jsx("span", __assign({ className: "ActionButton-minimalAreaDisplay" }, { children: (_c = (localInProgress ? inProgressName : name)) !== null && _c !== void 0 ? _c : name })), jsx("span", __assign({ className: "ActionButton-minimalAreaExpand" }, { children: name }))] }))] })));
+};
+
+export { ActionButton, ComponentLoadingWrapper, ControlledMenu, FocusableItem, GenericCellEditorComponent, GenericMultiEditCellClass, Grid, GridCell, GridCellRenderer, GridContext, GridContextProvider, GridFormDropDown, GridFormMultiSelect, GridFormPopoutMenu, GridHeaderSelect, GridIcon, GridLoadableCell, GridPopoutEditMultiSelect, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridRendererGenericCell, GridSubComponentTextArea, GridUpdatingContext, GridUpdatingContextProvider, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuHeaderItem, MenuHeaderString, MenuItem, MenuRadioGroup, MenuSeparator, MenuSeparatorString, PopoutMenuSeparator, SubMenu, TextAreaInput, TextInputFormatted, bearingCorrectionValueFormatter, bearingNumberParser, bearingStringValidator, bearingValueFormatter, convertDDToDMS, hasParentClass, isFloat, isNotEmpty, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait };
 //# sourceMappingURL=step-ag-grid.esm.js.map