How to use the @instructure/ui-dom-utils.requestAnimationFrame function in @instructure/ui-dom-utils

handleFocus = event => {
    if (this._needToFocus) {
      this._needToFocus = false

      if (!this._contextElement) {
        return
      }

      // need to see how jQuery shims document.on('focusin') so we don't need the
      // setTimeout, firefox doesn't support focusin, if it did, we could focus
      // the element outside of a setTimeout. Side-effect of this implementation
      // is that the document.body gets focus, and then we focus our element right
      // after, seems fine.
      this._raf.push(
        requestAnimationFrame(() => {
          if (containsActiveElement(this._contextElement)) {
            return
          }
          this.focusDefaultElement()
        })
      )
    }
  }

fill = () => {
    this._animation = requestAnimationFrame(() => {
      this.setState({
        filled: true
      })
    })
  }

open () {
    const {
      open,
      contentElement,
      ...options
    } = this.props

    this._raf.push(requestAnimationFrame(() => {
      this._focusRegion = FocusRegionManager.activateRegion(this.contentElement, {
        ...options
      })
    }))
  }

focus () {
    if (this.focused) {
      return
    }

    this._raf.push(
      requestAnimationFrame(() => {
        this.focusDefaultElement()
      })
    )
  }

handleTriggerBlur = (event) => {
    if (this.props.on.indexOf('focus') > -1) {
      this._raf.push(requestAnimationFrame(() => {
        if (!containsActiveElement(this._view)) {
          this.hide(event)
        }
      }))
    }
  }