@linzjs/step-ag-grid 22.2.5 → 23.0.0

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

@@ -898,7 +898,7 @@ const updateState = (status, setState, latestState, timeoutId, onChange) => {
     current: state
   });
 };
-const useTransition = ({
+const useTransitionState = ({
   enter = true,
   exit = true,
   preEnter,
@@ -952,7 +952,7 @@ const useMenuState = (props) => {
     const { initialMounted, unmountOnClose, transition, transitionTimeout } = props ?? {
         transition: false,
     };
-    const [state, toggleMenu, endTransition] = useTransition({
+    const [state, toggleMenu, endTransition] = useTransitionState({
         mountOnEnter: !initialMounted,
         unmountOnExit: unmountOnClose,
         timeout: transitionTimeout ?? 500,
@@ -3238,9 +3238,9 @@ var dist = function debounce(fn) {
   var wait = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
   var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
 
-  var lastCallAt = void 0;
-  var deferred = void 0;
-  var timer = void 0;
+  var lastCallAt = undefined;
+  var deferred = undefined;
+  var timer = undefined;
   var pendingArgs = [];
   return function debounced() {
     var currentWait = getWait(wait);
@@ -3322,7 +3322,7 @@ const GridSubComponentContext = createContext({
 });
 
 function styleInject(css, ref) {
-  if ( ref === void 0 ) ref = {};
+  if ( ref === undefined ) ref = {};
   var insertAt = ref.insertAt;
 
   if (!css || typeof document === 'undefined') { return; }
@@ -3348,11 +3348,11 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z$2 = ".FormError-helpText{color:#6b6966;font-size:.75rem;font-weight:400}";
+var css_248z$2 = ".FormError{display:flex}.FormError-helpText{color:#6b6966;font-size:.75rem;font-weight:400}.FormError-text-icon{margin-right:4px;margin-top:4px}.FormError-error{align-items:center;color:#2a292c;font-size:14px;font-weight:600;padding-left:0}";
 styleInject(css_248z$2);
 
 const FormError = (props) => {
-    return (jsxs(Fragment, { children: [props.error && (jsx("span", { className: "LuiTextInput-error", style: { paddingLeft: 0 }, children: props.error })), props.helpText && !props.error && jsx("span", { className: "FormError-helpText", children: props.helpText })] }));
+    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 })] }));
 };
 
 function escapeStringRegexp(string) {
@@ -3733,7 +3733,7 @@ const GridFormDropDown = (props) => {
                         })] }) })] }));
 };
 
-var css_248z$1 = ".LuiTextInput.GridLuiTextInput{margin-bottom:0}.LuiTextInput-formatted{color:#beb9b4;line-height:48px;position:absolute;right:14px;top:0}";
+var css_248z$1 = ".LuiTextInput.GridLuiTextInput{margin-bottom:0}.LuiTextInput-formatted{color:#6b6966;line-height:48px;position:absolute;right:14px;top:0}";
 styleInject(css_248z$1);
 
 const TextInputFormatted = (props) => {
@@ -5291,7 +5291,7 @@ const GridUpdatingContextProvider = (props) => {
     return (jsx(GridUpdatingContext.Provider, { value: { modifyUpdating, checkUpdating, updatingCols, updatedDep }, children: props.children }));
 };
 
-var css_248z = ".ActionButton{align-items:center;display:flex}.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-inProgress.lui-button-lg.lui-button-icon-right svg *{fill:#0000}.ActionButton-fill{justify-content:center;width:100%}";
+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%}";
 styleInject(css_248z);
 
 /**
@@ -5328,18 +5328,18 @@ const ActionButton = ({ icon, name, inProgressName, disabled, dataTestId, style,
                     await promise;
                 setInProgress(false);
             }
-        }, disabled: localInProgress || disabled, children: [iconPosition === "right" && buttonText, localInProgress ? (jsx(LuiMiniSpinner, { size: 16, divProps: {
-                    "data-testid": "loading-spinner",
-                    style: {
-                        margin: 0,
-                        paddingRight: 5,
-                        paddingLeft: 3,
-                        paddingBottom: 0,
-                        paddingTop: 0,
-                    },
-                    role: "status",
-                    "aria-label": "Loading",
-                } })) : (jsx(LuiIcon, { name: icon, alt: ariaLabel ?? name ?? "", size: size })), iconPosition === "left" && buttonText] }));
+        }, disabled: localInProgress || disabled, children: [iconPosition === "right" && buttonText, localInProgress && (jsx("div", { style: { position: "relative" }, children: jsx(LuiMiniSpinner, { size: 14, divProps: {
+                        "data-testid": "loading-spinner",
+                        style: {
+                            position: "absolute",
+                            left: 4,
+                            top: -10,
+                            bottom: 10,
+                            right: -4,
+                        },
+                        role: "status",
+                        "aria-label": "Loading",
+                    } }) })), jsx(LuiIcon, { name: icon, alt: ariaLabel ?? name ?? "", size: size }), iconPosition === "left" && buttonText] }));
 };
 
 const useDeferredPromise = () => {