hunk.code_window:     it('acts strangely without the "from" prop', async () => {
         const ctrl = new Controller<{ x: number }>()
         const { springs } = ctrl
         ctrl.start({
           to: async update => {
             // The spring does not exist yet!
             expect(springs.x).toBeUndefined()
             // Any values passed here are treated as "from" values,
  
hunk.labels: keep keep keep keep keep replace keep keep keep keep keep
hunk.after_edit:       const promise = ctrl.start({
  
hunk.file_path: packages/core/src/Controller.test.ts
hunk.type: replace
file: import * as React from 'react'
  import { forwardRef, useRef, Ref, useCallback } from 'react'
  import { useLayoutEffect } from 'react-layout-effect'
  import { is, each, useForceUpdate, ElementType, FluidConfig } from 'shared'
  
  import { AnimatedProps } from './AnimatedProps'
  import { HostConfig } from './createHost'
  
  export type AnimatableComponent = string | Exclude<ElementType, string>
  
  export const withAnimated = (Component: any, host: HostConfig) => {
    const hasInstance: boolean =
      // Function components must use "forwardRef" to avoid being
      // re-rendered on every animation frame.
      !is.fun(Component) ||
      (Component.prototype && Component.prototype.isReactComponent)
  
    return forwardRef((givenProps: any, givenRef: Ref<any>) => {
      const instanceRef = useRef<any>(null)
  
      // The `hasInstance` value is constant, so we can safely avoid
      // the `useCallback` invocation when `hasInstance` is false.
      const ref =
        hasInstance &&
        useCallback(
          (value: any) => {
            instanceRef.current = updateRef(givenRef, value)
          },
          [givenRef]
        )
  
      const forceUpdate = useForceUpdate()
      const props = new AnimatedProps(() => {
        const instance = instanceRef.current
        if (hasInstance && !instance) {
          return // The wrapped component forgot to forward its ref.
        }
  
        const didUpdate = instance
          ? host.applyAnimatedValues(instance, props.getValue(true)!)
          : false
  
        // Re-render the component when native updates fail.
        if (didUpdate === false) {
          forceUpdate()
        }
      })
  
      const dependencies = new Set<FluidConfig>()
      props.setValue(givenProps, { dependencies, host })
  
      useLayoutEffect(() => {
        each(dependencies, dep => dep.addChild(props))
        return () => each(dependencies, dep => dep.removeChild(props))
      })
  
      const usedProps = host.getComponentProps(props.getValue()!)
      return <Component {...usedProps} ref={ref} />
    })
  }
  
  function updateRef<T>(ref: Ref<T>, value: T) {
    if (ref) {
      if (is.fun(ref)) ref(value)
      else (ref as any).current = value
    }
    return value
  }
  