How to use the @instructure/ui-react-utils.ComponentIdentifier.pick function in @instructure/ui-react-utils

renderContent () {
    let content = ComponentIdentifier.pick(Position.Content, this.props.children)
    if (!content) {
      content = ensureSingleChild(this.props.children)
    }

    if (content) {
      content = safeCloneElement(content, {
        ref: el => { this._content = el },
        style: {
          ...content.props.style,
          ...this.state.style
        },
        className: classnames({
          [styles.root]: true,
          [content.props.className]: content.props.className // eslint-disable-line react/prop-types
        }),
        [Position.contentLocatorAttribute]: this._id

renderContent () {
    let content = ComponentIdentifier.pick(Popover.Content, this.props.children)
    if (!content) {
      content = callRenderProp(this.props.children)
    }

    if (this.shown) {
      content = (
        <dialog label="{this.props.screenReaderLabel" open="{this.shown}"> this._dialog = el}
          display="block"
          onBlur={this.handleDialogBlur}
          onDismiss={this.handleDialogDismiss}
          liveRegion={this.props.liveRegion}
          defaultFocusElement={this.props.defaultFocusElement}
          shouldContainFocus={this.props.shouldContainFocus}</dialog>

renderTrigger () {
    let trigger = ComponentIdentifier.pick(Popover.Trigger, this.props.children)
    if (!trigger) {
      trigger = callRenderProp(this.props.renderTrigger)
    }

    if (trigger) {
      const { on, shouldContainFocus } = this.props
      let onClick
      let onFocus
      let onMouseOut
      let onMouseOver
      let expanded

      if (on.indexOf('click') > -1) {
        onClick = (event) => {
          this.toggle(event)
        }

render () {
    const {
      show,
      defaultShow,
      label,
      variant,
      alignArrow,
      trackPosition,
      onShow,
      onDismiss,
      onToggle,
      children,
      ...passthroughProps
    } = this.props

    let trigger = ComponentIdentifier.pick(Popover.Trigger, children)
    let content = ComponentIdentifier.pick(Popover.Content, children)

    return (
       {
          onToggle(true)
        }}
        onHideContent={(e, { documentClick }) => {
          onDismiss(e, documentClick)

renderTarget () {
    let target = ComponentIdentifier.pick(Position.Target, this.props.children)
    if (!target) {
      target = callRenderProp(this.props.renderTarget)
    }

    if (target) {
      return safeCloneElement(target, {
        ref: el => { this._target = el },
        [Position.targetLocatorAttribute]: this._id
      })
    } else if (this.props.target) {
      this._target = callRenderProp(this.props.target)
    } else {
      return null
    }
  }

id,
      trackPosition,
      placement,
      offsetX,
      offsetY,
      mountNode,
      target,
      insertAt,
      over,
      onPositioned,
      onPositionChanged,
      constrain,
      ...passthroughProps
    } = this.props

    let renderTarget = ComponentIdentifier.pick(Position.Target, children)
    let content = ComponentIdentifier.pick(Position.Content, children)

    return (