fix: merging of default cancel and pause props

Author: aleclarson

packages/core/src/Controller.ts

@@ -2,7 +2,7 @@ import { is, each, OneOrMore, toArray, UnknownProps, noop } from 'shared'
 import * as G from 'shared/globals'
 
 import { Lookup, Falsy } from './types/common'
-import { inferTo, flush, isDefaultProp } from './helpers'
+import { inferTo, flush, hasDefaultProp } from './helpers'
 import { FrameValue } from './FrameValue'
 import { SpringPhase, CREATED, ACTIVE, IDLE } from './SpringPhase'
 import { SpringValue, createLoopUpdate, createUpdate } from './SpringValue'
@@ -308,7 +308,7 @@ export function flushUpdate(
             }
             // Prevent `cancel: true` from ending the current `runAsync` call,
             // except when the default `cancel` prop is being set.
-            else if (isDefaultProp(props, 'cancel')) {
+            else if (hasDefaultProp(props, 'cancel')) {
               cancelAsync(state, props.callId)
             }
           },

packages/core/src/SpringValue.ts

@@ -38,6 +38,7 @@ import {
   inferTo,
   flush,
   mergeDefaultProps,
+  getDefaultProp,
 } from './helpers'
 import { FrameValue, isFrameValue } from './FrameValue'
 import {
@@ -516,22 +517,24 @@ export class SpringValue<T = any> extends FrameValue<T> {
 
   /** Schedule an animation to run after an optional delay */
   protected _update(props: SpringUpdate<T>, isLoop?: boolean): AsyncResult<T> {
+    type DefaultProps = typeof defaultProps
     const defaultProps = this._defaultProps
-
-    // Set the default `cancel` prop first, because it prevents other default
-    // props in this update from being cached.
-    if (props.default && !is.und(props.cancel)) {
-      defaultProps.cancel = props.cancel
-    }
-    // The default `cancel` prop overrides all updates.
-    else if (defaultProps.cancel) {
-      props.cancel = true
-    }
-    // The default `pause` prop overrides all updates.
-    if (defaultProps.pause) {
-      props.pause = true
+    const mergeDefaultProp = (key: keyof DefaultProps) => {
+      const value = getDefaultProp(props, key)
+      if (!is.und(value)) {
+        defaultProps[key] = value as any
+      }
+      // For `cancel` and `pause`, a truthy default always wins.
+      if (defaultProps[key]) {
+        props[key] = defaultProps[key] as any
+      }
     }
 
+    // These props are coerced into booleans by the `scheduleProps` function,
+    // so they need their default values processed before then.
+    mergeDefaultProp('cancel')
+    mergeDefaultProp('pause')
+
     // Ensure the initial value can be accessed by animated components.
     const range = this._prepareNode(props)
 
@@ -596,7 +599,7 @@ export class SpringValue<T = any> extends FrameValue<T> {
       onDelayEnd(props, this)
     }
 
-    mergeDefaultProps(defaultProps, props)
+    mergeDefaultProps(defaultProps, props, ['pause', 'cancel'])
 
     const { to: prevTo, from: prevFrom } = anim
     let { to = prevTo, from = prevFrom } = range

packages/core/src/helpers.ts

@@ -50,25 +50,32 @@ export const getProps = <T, Arg = never>(
   (is.fun(props) ? props(i, arg) : is.arr(props) ? props[i] : { ...props })
 
 /** Returns `true` if the given prop is having its default value set. */
-export const isDefaultProp = <T extends Lookup>(props: T, key: keyof T) =>
-  !is.und(
-    props.default === true ? props[key] : props.default && props.default[key]
-  )
+export const hasDefaultProp = <T extends Lookup>(props: T, key: keyof T) =>
+  !is.und(getDefaultProp(props, key))
+
+/** Get the default value being set for the given `key` */
+export const getDefaultProp = <T extends Lookup>(props: T, key: keyof T) =>
+  props.default === true
+    ? props[key]
+    : props.default
+    ? props.default[key]
+    : undefined
 
 export const mergeDefaultProps = (
   defaultProps: Lookup,
-  props: Lookup & { default?: boolean | Lookup }
+  props: Lookup & { default?: boolean | Lookup },
+  omitKeys: string[] = []
 ) => {
   if (props.default === true) {
     each(DEFAULT_PROPS, key => {
       const value = props[key]
-      if (!is.und(value)) {
+      if (!is.und(value) && !omitKeys.includes(key)) {
         defaultProps[key] = value as any
       }
     })
   } else if (props.default) {
     each(props.default, (value, key) => {
-      if (!is.und(value)) {
+      if (!is.und(value) && !omitKeys.includes(key)) {
         defaultProps[key] = value as any
       }
     })

packages/core/src/runAsync.ts

@@ -72,10 +72,7 @@ export async function runAsync<T>(
     let result!: AnimationResult
 
     const defaultProps: SpringDefaultProps<T> = {}
-    mergeDefaultProps(defaultProps, props)
-
-    // The `onRest` prop is for `runAsync` to call.
-    defaultProps.onRest = undefined
+    mergeDefaultProps(defaultProps, props, ['onRest'])
 
     const { callId, onRest } = props
     const throwInvalidated = () => {