fix: try using the "loop" prop even for noop updates

But noop updates created by the "loop" prop are still never repeated.

Author: aleclarson

packages/core/src/Controller.ts

@@ -254,7 +254,8 @@ export function flushUpdateQueue(
  */
 export function flushUpdate(
   ctrl: Controller<any>,
-  props: ControllerQueue[number]
+  props: ControllerQueue[number],
+  isLoop?: boolean
 ): Promise<boolean> {
   const { to, loop, onRest } = props
 
@@ -329,11 +330,11 @@ export function flushUpdate(
 
   return Promise.all(promises).then(results => {
     const finished = results.every(result => result.finished)
-    if (loop && finished && !results.every(result => result.noop)) {
+    if (loop && finished && !(isLoop && results.every(result => result.noop))) {
       const nextProps = createLoopUpdate(props, loop, to)
       if (nextProps) {
         prepareKeys(ctrl, [nextProps])
-        return flushUpdate(ctrl, nextProps)
+        return flushUpdate(ctrl, nextProps, true)
       }
     }
     return finished

packages/core/src/SpringValue.ts

@@ -496,7 +496,7 @@ export class SpringValue<T = any> extends FrameValue<T> {
   }
 
   /** Schedule an animation to run after an optional delay */
-  protected _update(props: SpringUpdate<T>): AsyncResult<T> {
+  protected _update(props: SpringUpdate<T>, isLoop?: boolean): AsyncResult<T> {
     // Ensure the initial value can be accessed by animated components.
     const range = this._prepareNode(props)
 
@@ -508,10 +508,10 @@ export class SpringValue<T = any> extends FrameValue<T> {
         this._merge(range, props, resolve)
       },
     }).then(result => {
-      if (props.loop && result.finished && !result.noop) {
+      if (props.loop && result.finished && !(isLoop && result.noop)) {
         const nextProps = createLoopUpdate(props)
         if (nextProps) {
-          return this._update(nextProps)
+          return this._update(nextProps, true)
         }
       }
       return result