react-native-smooth-clip-view 0.2.5 → 0.2.7

package/src/drivers.native.ts

@@ -46,9 +46,25 @@ const NATIVE = 1;
 
 const setPresentationHostFunction = NativeSmoothClipModule.setClipPresentation;
 const beginInteractionHostFunction = NativeSmoothClipModule.beginInteraction;
-const animateTimingHostFunction = NativeSmoothClipModule.animateTiming;
-const animateSpringHostFunction = NativeSmoothClipModule.animateSpring;
-const animateKeyframesHostFunction = NativeSmoothClipModule.animateKeyframes;
+
+// The animate* host functions take one argument beyond the TurboModule spec:
+// the Reanimated-rule start stamp in milliseconds (see animateOnUI). Android's
+// JSI bindings read it as an optional trailing argument; the iOS TurboModule
+// reads its declared parameters positionally and ignores extras, so the
+// codegen spec stays untouched and both platforms take the same call. A
+// narrower function is assignable to the widened type, so no cast is needed.
+type WithStartStamp<F> = F extends (...args: infer A) => infer R
+  ? (...args: [...A, startedAtMs: number]) => R
+  : never;
+const animateTimingHostFunction: WithStartStamp<
+  typeof NativeSmoothClipModule.animateTiming
+> = NativeSmoothClipModule.animateTiming;
+const animateSpringHostFunction: WithStartStamp<
+  typeof NativeSmoothClipModule.animateSpring
+> = NativeSmoothClipModule.animateSpring;
+const animateKeyframesHostFunction: WithStartStamp<
+  typeof NativeSmoothClipModule.animateKeyframes
+> = NativeSmoothClipModule.animateKeyframes;
 const rejectAnimationHostFunction = NativeSmoothClipModule.rejectAnimation;
 const cancelAnimationHostFunction = NativeSmoothClipModule.cancelAnimation;
 const destroyDriverHostFunction = NativeSmoothClipModule.destroyDriver;
@@ -91,9 +107,19 @@ function animationIsFinite(
     return false;
   }
   if (animation.type === 'timing') {
+    const [x1, , x2] = animation.controlPoints;
     return (
       Number.isFinite(animation.duration) &&
-      animation.controlPoints.every(Number.isFinite)
+      animation.controlPoints.every(Number.isFinite) &&
+      // A cubic-bezier easing is only defined for x within [0,1] (the CSS /
+      // CoreAnimation / Reanimated Easing.bezier contract). Out-of-range x
+      // makes the Android parameter solve meaningless while CoreAnimation
+      // silently clamps — reject like any other invalid input instead of
+      // diverging per platform.
+      x1 >= 0 &&
+      x1 <= 1 &&
+      x2 >= 0 &&
+      x2 <= 1
     );
   }
   if (animation.type === 'spring') {
@@ -195,6 +221,14 @@ export function useSmoothClipDriver(
   // so animateTo must start from the native registry's latest value instead
   // of snapping back to the stale SharedValue.
   const scalarsStale = useSharedValue(0);
+  // Non-zero between the effect cleanup's native teardown and the next effect
+  // run. Native cannot tell "this driver was never seeded" from "this driver
+  // was destroyed and erased" — both are a missing registry entry — so the
+  // animation entry points would happily create a fresh state for a call that
+  // arrives after the hook is gone, leaving a latch that no view starts and no
+  // destroy cancels. Only the UI side knows the difference, so it is decided
+  // here.
+  const disposed = useSharedValue(0);
   const callbackRef = useRef(options.onAnimationComplete);
   const driverRef = useRef<SmoothClipDriver | null>(null);
   callbackRef.current = options.onAnimationComplete;
@@ -205,14 +239,21 @@ export function useSmoothClipDriver(
 
     const seedPresentation = (next: SmoothClipPresentation) => {
       'worklet';
-      if (!clipPresentationEquals(presentation.value, next)) {
-        suppressDeliveries.value += 1;
-        presentation.value = next;
-      }
+      if (clipPresentationEquals(presentation.value, next)) return;
+      suppressDeliveries.value += 1;
+      presentation.value = next;
+      // The listener runs synchronously inside that assignment, so the credit
+      // is either spent by now or was never spendable. deliver() returns before
+      // the decrement whenever the value dedupes against `last` — which happens
+      // exactly when native already holds it, e.g. freezing a latch back to the
+      // value it started from. An unspent credit would then swallow the next
+      // real declarative write and leave native a geometry behind for good.
+      if (suppressDeliveries.value > 0) suppressDeliveries.value -= 1;
     };
 
     const beginOnUI = (): SmoothClipPresentation => {
       'worklet';
+      if (disposed.value !== 0) return presentation.value;
       const current = presentationFromNative(
         beginInteractionHostFunction(driverId),
         presentation.value
@@ -226,7 +267,7 @@ export function useSmoothClipDriver(
 
     const setOnUI = (next: SmoothClipPresentation): void => {
       'worklet';
-      if (!isFiniteClipPresentation(next)) return;
+      if (disposed.value !== 0 || !isFiniteClipPresentation(next)) return;
       activeAnimationId.value = 0;
       ownership.value = INTERACTIVE;
       scalarsStale.value = 0;
@@ -240,7 +281,8 @@ export function useSmoothClipDriver(
         clip.radius,
         contentTranslateX,
         contentTranslateY,
-        true
+        true,
+        false
       );
       seedPresentation(next);
     };
@@ -252,10 +294,12 @@ export function useSmoothClipDriver(
       height: number,
       radius: number,
       contentTranslateX: number,
-      contentTranslateY: number
+      contentTranslateY: number,
+      overridePendingAnimation = false
     ): void => {
       'worklet';
       if (
+        disposed.value !== 0 ||
         !Number.isFinite(x) ||
         !Number.isFinite(y) ||
         !Number.isFinite(width) ||
@@ -278,7 +322,8 @@ export function useSmoothClipDriver(
         radius,
         contentTranslateX,
         contentTranslateY,
-        true
+        true,
+        overridePendingAnimation
       );
     };
 
@@ -287,13 +332,22 @@ export function useSmoothClipDriver(
       animation: SmoothClipAnimation
     ): number => {
       'worklet';
+      // Cleanup owns the terminal state. Check it before validation so even an
+      // invalid stale call cannot mint a native rejection id/completion against
+      // a driver whose listener and registry entry are already gone.
+      if (disposed.value !== 0) return 0;
       if (
         !isFiniteClipPresentation(target) ||
         !animationIsFinite(target, animation)
       ) {
         return rejectAnimationHostFunction(driverId);
       }
-
+      // Past the hook's cleanup the native entry is gone for good, and an
+      // interactive start here would recreate it as a latch nothing can ever
+      // start or cancel. Reject before any side effect — not via
+      // rejectAnimation, which would mint an id and a completion for a driver
+      // whose JS state is already detached. This is the "unsupported dispatch"
+      // arm of the documented 0 contract.
       const from = animation.from;
       if (from !== undefined) {
         // Fused hot write: exactly setScalars(from…) issued immediately
@@ -308,7 +362,8 @@ export function useSmoothClipDriver(
           from.clip.height,
           from.clip.radius,
           from.contentTranslateX,
-          from.contentTranslateY
+          from.contentTranslateY,
+          true
         );
       }
 
@@ -325,6 +380,26 @@ export function useSmoothClipDriver(
       scalarsStale.value = 0;
       const startClip = start.clip;
       const targetClip = target.clip;
+      // Reanimated stamps a parallel animation's t0 on this same runtime as
+      // `__frameTimestamp || _getAnimationTimestamp()` (valueSetter.ts).
+      // Capturing the identical value here and handing it to the integrator
+      // keeps clip and content phase-locked in every branch — including a
+      // start issued from CALLBACK_INPUT (batched gesture moves), where the
+      // dispatching frame's stamp is EARLIER than the call: the native min()
+      // anchor alone would adopt that frame stamp while Reanimated, outside
+      // its rAF flush where __frameTimestamp is cleared, keeps the wall
+      // clock — a lead lasting the whole animation. NaN when the globals are
+      // absent (tests, non-worklets runtimes): native then falls back to its
+      // own clock plus the min() anchor, the pre-stamp behavior.
+      const workletGlobal = globalThis as {
+        __frameTimestamp?: number;
+        _getAnimationTimestamp?: () => number;
+      };
+      const startedAtMs =
+        workletGlobal.__frameTimestamp ||
+        (typeof workletGlobal._getAnimationTimestamp === 'function'
+          ? workletGlobal._getAnimationTimestamp()
+          : Number.NaN);
       let animationId: number;
 
       if (animation.type === 'timing') {
@@ -351,7 +426,8 @@ export function useSmoothClipDriver(
           y1,
           x2,
           y2,
-          reduceMotion
+          reduceMotion,
+          startedAtMs
         );
       } else if (animation.type === 'spring') {
         const inheritVelocity =
@@ -379,7 +455,8 @@ export function useSmoothClipDriver(
           Math.max(0, animation.damping ?? 10),
           inheritVelocity ? 0 : (animation.initialVelocity as number),
           inheritVelocity,
-          reduceMotion
+          reduceMotion,
+          startedAtMs
         );
       } else {
         animationId = animateKeyframesHostFunction(
@@ -401,16 +478,19 @@ export function useSmoothClipDriver(
           target.contentTranslateY,
           Math.max(0, animation.duration),
           flattenedKeyframes(animation),
-          reduceMotion
+          reduceMotion,
+          startedAtMs
         );
       }
       if (animationId === 0) {
-        // The 0 sentinel: the driver entry no longer exists (destroyed) or
-        // the call ran off the main thread — validation failures never get
-        // here (they reject before any side effect with a fresh id and one
-        // finished:false completion). Restore the two-call-desugar state and
-        // forward the registry's rejection result, which is 0 again in both
-        // reachable cases, with no completion — exactly the README contract.
+        // The 0 sentinel: off-main, invalid-id, or otherwise unsupported
+        // dispatch. A missing driver is accepted when this call carries the
+        // authoritative interactive start above; a start-less missing-state
+        // request remains unsupported rather than inventing zero geometry.
+        // Validation failures never get here: they reject before any side
+        // effect, with a fresh id and one finished:false completion once the
+        // native entry exists — in the pre-seed window rejectAnimation has no
+        // entry and returns the bare 0 sentinel with no completion instead.
         ownership.value = INTERACTIVE;
         presentation.value = start;
         if (scalarsWereStale) scalarsStale.value = 1;
@@ -426,6 +506,10 @@ export function useSmoothClipDriver(
       behavior: 'current' | 'target' = 'current'
     ): SmoothClipPresentation => {
       'worklet';
+      // Past the hook's cleanup the native entry is gone; the call would fail
+      // defined (handled=false) but it is the last driver.ui path that still
+      // crosses into native after the tombstone. Guard it like the rest.
+      if (disposed.value !== 0) return presentation.value;
       const values = cancelAnimationHostFunction(
         driverId,
         animationId,
@@ -498,7 +582,14 @@ export function useSmoothClipDriver(
           return promise;
         },
         set(next) {
-          const { requestId, promise } = createReactRequest<void>(driverId);
+          // Teardown resolves (undefined) rather than rejects: `set` is a
+          // documented fire-and-forget call, and a promise discarded with
+          // `void` must not become an unhandled rejection at unmount.
+          const { requestId, promise } = createReactRequest<void>(
+            driverId,
+            false,
+            { value: undefined }
+          );
           scheduleOnUI(() => {
             'worklet';
             setOnUI(next);
@@ -507,9 +598,12 @@ export function useSmoothClipDriver(
           return promise;
         },
         animateTo(target, animation) {
+          // Teardown resolves with the documented 0 rejection sentinel (see
+          // `set` above): the README's own example voids this promise.
           const { requestId, promise } = createReactRequest<number>(
             driverId,
-            true
+            true,
+            { value: 0 }
           );
           scheduleOnUI(() => {
             'worklet';
@@ -591,9 +685,14 @@ export function useSmoothClipDriver(
         suppressed: SharedValue<number>,
         active: SharedValue<number>,
         stale: SharedValue<number>,
+        gone: SharedValue<number>,
         setter: typeof setPresentationHostFunction
       ) => {
         'worklet';
+        // First, before the listener or the seed: this effect run owns the
+        // driver again, so a StrictMode/<Activity> replay must clear the
+        // previous cleanup's tombstone or every later write would be rejected.
+        gone.value = 0;
         let last: SmoothClipPresentation | null = null;
         const deliver = (next: SmoothClipPresentation) => {
           if (
@@ -623,15 +722,19 @@ export function useSmoothClipDriver(
             clip.radius,
             contentTranslateX,
             contentTranslateY,
+            false,
             false
           );
         };
         source.addListener(listenerId, deliver);
         // Authoritative take-ownership seed. Creates the native entry before
-        // any view mounts on the first run, and revives a driver destroyed by
-        // an effect-replay cleanup (StrictMode/<Activity>) on later runs.
+        // any view mounts on the ordinary path, and revives a driver destroyed
+        // by an effect-replay cleanup (StrictMode/<Activity>) on later runs.
+        // An animation worklet can win the scheduling race and create a latch
+        // first; Native ownership then marks that intent as newer, so this
+        // passive seed must not clear its active id or replay the target value.
         const current = source.value;
-        if (isFiniteClipPresentation(current)) {
+        if (owner.value === INTERACTIVE && isFiniteClipPresentation(current)) {
           active.value = 0;
           owner.value = INTERACTIVE;
           stale.value = 0;
@@ -645,7 +748,8 @@ export function useSmoothClipDriver(
             current.clip.radius,
             current.contentTranslateX,
             current.contentTranslateY,
-            true
+            true,
+            false
           );
         }
       },
@@ -656,6 +760,7 @@ export function useSmoothClipDriver(
       suppressDeliveries,
       activeAnimationId,
       scalarsStale,
+      disposed,
       setPresentationHostFunction
     );
 
@@ -668,20 +773,46 @@ export function useSmoothClipDriver(
           source: SharedValue<SmoothClipPresentation>,
           listenerId: number,
           nativeDriverId: number,
+          owner: SharedValue<number>,
+          active: SharedValue<number>,
+          stale: SharedValue<number>,
+          suppressed: SharedValue<number>,
+          gone: SharedValue<number>,
           destroy: typeof destroyDriverHostFunction
         ) => {
           'worklet';
           source.removeListener(listenerId);
           destroy(nativeDriverId);
+          // StrictMode replays the effect with these same SharedValues. Reset
+          // the UI-side tombstone only after native teardown so the next setup
+          // can seed or animate without inheriting stale Native ownership.
+          active.value = 0;
+          owner.value = INTERACTIVE;
+          stale.value = 0;
+          // Defensive: seedPresentation now reclaims its own unspent credit at
+          // the point of issue, so this should already be 0. Kept because the
+          // failure mode — one declarative write silently dropped for the rest
+          // of the next hook's life — is invisible until someone reports a
+          // stale clip rect.
+          suppressed.value = 0;
+          // Last: the native entry is now erased, so until the next effect run
+          // clears this, any call that would recreate it is rejected instead.
+          gone.value = 1;
         },
         presentation,
         driverId,
         driverId,
+        ownership,
+        activeAnimationId,
+        scalarsStale,
+        suppressDeliveries,
+        disposed,
         destroyDriverHostFunction
       );
     };
   }, [
     activeAnimationId,
+    disposed,
     ownership,
     presentation,
     scalarsStale,

package/src/reactRequests.ts

@@ -6,6 +6,11 @@ import {
 type PendingRequest = {
   resolve(value: unknown): void;
   reject(error: Error): void;
+  // Set for calls whose documented usage is fire-and-forget (`void
+  // driver.react.animateTo(...)`): teardown resolves them with this benign
+  // sentinel instead of rejecting, so a discarded promise cannot surface as
+  // an unhandled rejection during ordinary unmount.
+  teardownResolution?: { value: unknown };
 };
 
 const requests = new Map<number, PendingRequest>();
@@ -14,7 +19,8 @@ let nextRequestId = 0;
 
 export function createReactRequest<T>(
   driverId: number,
-  deferCompletions = false
+  deferCompletions = false,
+  teardownResolution?: { value: unknown }
 ): { requestId: number; promise: Promise<T> } {
   nextRequestId = (nextRequestId % 0x7ffffffe) + 1;
   const requestId = nextRequestId;
@@ -27,6 +33,7 @@ export function createReactRequest<T>(
   requests.set(requestId, {
     resolve: resolveRequest as (value: unknown) => void,
     reject: rejectRequest,
+    teardownResolution,
   });
   const driverRequests = requestsByDriver.get(driverId) ?? new Set<number>();
   driverRequests.add(requestId);
@@ -58,7 +65,12 @@ export function rejectDriverRequests(driverId: number): void {
   for (const requestId of driverRequests) {
     const request = requests.get(requestId);
     requests.delete(requestId);
-    request?.reject(new Error('[SmoothClipView] Driver was destroyed.'));
+    if (!request) continue;
+    if (request.teardownResolution) {
+      request.resolve(request.teardownResolution.value);
+    } else {
+      request.reject(new Error('[SmoothClipView] Driver was destroyed.'));
+    }
   }
   requestsByDriver.delete(driverId);
 }