make sure disabled state from root cascades

.changeset/sweet-flies-pump.md

@@ -0,0 +1,5 @@
+---
+"@bsmnt/scrollytelling": patch
+---
+
+add disabled prop to Root

scrollytelling/src/components/animation/index.tsx

@@ -58,6 +58,7 @@ export function Animation(props: AnimationProps): React.ReactElement | null {
           start: tween.start,
           end: tween.end,
         });
+        if (!timelineSpace) return; // root is probably disabled.
         const cleanup = buildDeclarativeTween({
           id,
           timeline,
@@ -80,12 +81,12 @@ export function Animation(props: AnimationProps): React.ReactElement | null {
         return cleanup;
       });
       return () => {
-        cleanupTweens.forEach((cleanup) => cleanup());
+        cleanupTweens.forEach((cleanup) => cleanup?.());
       };
     } else {
       const cleanup = addTweenToTimeline(props.tween);
       return () => {
-        cleanup();
+        cleanup?.();
       };
     }
   }, [getTimelineSpace, id, props.tween, timeline, props.disabled]);

scrollytelling/src/context/index.tsx

@@ -24,7 +24,7 @@ export type ScrollytellingDispatchersContextType = {
     duration: number;
     position: number;
     cleanup: () => void;
-  };
+  } | null;
   scopedQuerySelector: gsap.utils.SelectorFunc | undefined;
 };
 

scrollytelling/src/primitive.tsx

@@ -75,7 +75,13 @@ const Scrollytelling = ({
 
   // initialize timeline
   React.useEffect(() => {
-    if (!ref.current || disabled) return;
+    if (!ref.current) return;
+
+    if (disabled) {
+      setTimeline(undefined);
+      return;
+    }
+
     gsap.registerPlugin(ScrollTrigger);
 
     const tl = gsap.timeline({
@@ -121,6 +127,7 @@ const Scrollytelling = ({
   const getTimelineSpace: ScrollytellingDispatchersContextType["getTimelineSpace"] =
     React.useCallback(
       ({ start, end }) => {
+        if (disabled) return null;
         if (!timeline) throw new Error("timeline not initialized");
         const duration = end - start;
         if (start < 0) {
@@ -143,7 +150,7 @@ const Scrollytelling = ({
           },
         };
       },
-      [addRestToTimeline, timeline]
+      [addRestToTimeline, timeline, disabled]
     );
 
   return (