fix(SidePanel): remove scrollTop behavior (#5376)

* fix(SidePanel): remove scrollTop behavior * fix: add back scrollTop but only apply on currentStep change
carbon-design-system · Jun 13, 2024 · ee2897a · ee2897a
1 parent a7db99d
commit ee2897a
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/packages/ibm-products/src/components/SidePanel/SidePanel.tsx b/packages/ibm-products/src/components/SidePanel/SidePanel.tsx
@@ -276,7 +276,7 @@ export let SidePanel = React.forwardRef(
     const titleRef = useRef<HTMLDivElement>(null);
     const labelTextRef = useRef<HTMLParagraphElement>(null);
     const subtitleRef = useRef<HTMLParagraphElement>(null);
-    const previousState = usePreviousValue({ size, open });
+    const previousState = usePreviousValue({ size, open, currentStep });
     const [scrollAnimationDistance, setScrollAnimationDistance] = useState(-1);
     const [doAnimateTitle, setDoAnimateTitle] = useState(true);
     const { firstElement, keyDownListener } = useFocus(sidePanelRef);
@@ -361,9 +361,14 @@ export let SidePanel = React.forwardRef(
         const scrollableSection =
           animatedScrollRef.current ?? innerContentRef.current;
 
-        if (scrollableSection) {
+        if (
+          previousState &&
+          previousState['currentStep'] !== currentStep &&
+          scrollableSection
+        ) {
           scrollableSection.scrollTop = 0;
         }
+
         // The size of the panel has changed while it is still opened
         // so we need to scroll it to the top and reset the header
         // height css custom property

diff --git a/packages/ibm-products/src/custom-typings/index.d.ts b/packages/ibm-products/src/custom-typings/index.d.ts
@@ -200,4 +200,5 @@ declare module '@carbon/react' {
 }
 
 declare module '@carbon/colors';
+declare module '@carbon/motion';
 declare module '@carbon/feature-flags';