impact-ui 3.7.26-alpha.11 → 3.7.26-alpha.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "impact-ui",
-  "version": "3.7.26-alpha.11",
+  "version": "3.7.26-alpha.13",
   "description": "Impact Analytics UI library",
   "main": "dist/index.js",
   "files": [

package/src/components/KeyboardShortCuts/KeyboardShortcuts.styles.scss

@@ -1126,6 +1126,7 @@ $slide-ease: cubic-bezier(0.22, 1, 0.36, 1);
   left: 50%;
   transform: translateX(-50%);
   bottom: 24px;
+  z-index: 999999;
 
   .close-icon-container {
     right: -10px;

package/src/components/KeyboardShortCuts/index.js

@@ -190,6 +190,10 @@ export const KeyboardShortcuts = ({
             </>
           )}
 
+          {showTutorialModal && (
+            <div aria-hidden="true" className="tutorial-overlay"></div>
+          )}
+
           {showTutorialModal && (
             <TutorialModal
               setShowTutorialModal={setShowTutorialModal}

package/src/components/KeyboardShortCuts/tutorial.js

@@ -80,8 +80,6 @@ export const TutorialModal = ({
   const [tutorialStep, setTutorialStep] = useState(0);
   const step = tutorialSteps[tutorialStep];
   const [showLottie, setShowLottie] = useState(false);
-  const [showOverlay, setShowOverlay] = useState(true);
-  const overlayTimerRef = useRef(null);
   const modalRef = useRef(null);
   const [step2Position, setStep2Position] = useState(null);
 
@@ -106,14 +104,6 @@ export const TutorialModal = ({
     onSkipClick?.();
   };
 
-  // On mount, fade out overlay after 1 second
-  useEffect(() => {
-    overlayTimerRef.current = setTimeout(() => {
-      setShowOverlay(false);
-    }, 1000);
-    return () => clearTimeout(overlayTimerRef.current);
-  }, []);
-
   useShortcut("mod+b", (e) => {
     ShortcutManager.getInstance().trigger('sidebar-toggle-mod-b', e);
     if (tutorialStep === 0) {
@@ -122,12 +112,6 @@ export const TutorialModal = ({
     setTimeout(() => {
       setTutorialStep(1);
       setShowLottie(false);
-      // Re-show overlay after step transition, then fade out after 1s
-      clearTimeout(overlayTimerRef.current);
-      setShowOverlay(true);
-      overlayTimerRef.current = setTimeout(() => {
-        setShowOverlay(false);
-      }, 1000);
     }, 1000);
   }, {
     id: "tutorial-step-0-mod-b",
@@ -143,12 +127,6 @@ export const TutorialModal = ({
       setTimeout(() => {
         setTutorialStep(2);
         setShowLottie(false);
-        // Re-show overlay after step transition, then fade out after 1s
-        clearTimeout(overlayTimerRef.current);
-        setShowOverlay(true);
-        overlayTimerRef.current = setTimeout(() => {
-          setShowOverlay(false);
-        }, 1000);
       }, 1000);
     },
     {
@@ -175,10 +153,6 @@ export const TutorialModal = ({
 
   return (
     <>
-      <div
-        aria-hidden="true"
-        className={`tutorial-overlay${showOverlay ? "" : " overlay--hidden"}`}
-      ></div>
       <div
         ref={modalRef}
         className={`tutorial-modal-wrapper tutorial-modal--step-${tutorialStep} tutorial-modal--arrow-${step.arrowPosition}${

package/src/components/TableOld/AgGridHeader.js

@@ -460,8 +460,10 @@ function AgGridHeader({
                 >
                   {children}
                 </Tooltip>
+
               </div>
             )}
+            {customIcon && customIcon}
             {rest?.column?.colDef?.sortable && (
               <img
                 src={