How to use the @conveyal/lonlat.toLeaflet function in @conveyal/lonlat

render () {
    // remove and drag aren't used here but they shouldn't be passed into the popup
    const {position, children, remove, drag, dragEnd, ...rest} = this.props

    return (
      <span>
        </span>
    )
  }

.then(result => {
          const newStopLatLngs = []
          // Iterate over newly added controlPoints and create stops for each.
          for (let i = controlPoints.length; i < result.controlPoints.length; i++) {
            const controlPoint = result.controlPoints[i]
            const stopLatlng = ll.toLeaflet(controlPoint.point.geometry.coordinates)
            newStopLatLngs.push(stopLatlng)
          }
          // Create new stops at the interval points.
          return Promise.all(newStopLatLngs.map((latlng, i) => dispatch(
            addStopAtPoint(latlng, false, patternStops.length + i, activePattern))
          ))
            .then(newStops => {
              newStops.forEach((s, index) => {
                // Add new stop to pattern stops list
                if (s) {
                  const stopControlPoint = result.controlPoints[controlPoints.length + index]
                  const patternStop = stopToPatternStop(s)
                  // Set pattern stop's shape dist traveled.
                  patternStop.shapeDistTraveled = stopControlPoint.distance
                  patternStops.push(patternStop)
                  // Update stop properties on new control points.

function getPointForLonLat (position, currentZoom: number, query) {
  const pixel = Leaflet.CRS.EPSG3857.latLngToPoint(
    lonlat.toLeaflet(position),
    currentZoom
  )
  const scale = Math.pow(2, query.zoom - currentZoom)

  let {x, y} = pixel
  x = x * scale - query.west | 0
  y = y * scale - query.north | 0

  return {x, y}
}

export function getPatternEndPoint (pattern: Pattern, controlPoints?: Array): LatLng {
  let endPoint
  if (controlPoints && controlPoints.length > 0) {
    const lastControlPoint = controlPoints[controlPoints.length - 1]
    if (lastControlPoint.point) {
      endPoint = ll.toLeaflet(lastControlPoint.point.geometry.coordinates)
      return endPoint
    }
  }
  throw new Error('Control point is missing coordinates')
}

dispatch(geocode(qs.end, (feature) => {
        const position = lonlat(feature.center)
        dispatch([
          setEnd({
            label: qs.end,
            position: lonlat(feature.center)
          }),
          fetchDestinationDataForLonLat(position)
        ])

        if (!qs.start) {
          dispatch(updateMap({centerCoordinates: lonlat.toLeaflet(feature.center)}))
        }
      }))
    }

export function reprojectBounds (bounds: LatLngBounds) {
  return new LatLngBounds(
    lonlat.toLeaflet(reprojectCoordinates(bounds.getSouthWest())),
    lonlat.toLeaflet(reprojectCoordinates(bounds.getNorthEast()))
  )
}

render () {
    const p = this.props
    return (
      
        
          
        
      
    )

const onDragEnd = oppositeCorner => e => {
    p.save(
      fromLatLngBounds(
        new L.LatLngBounds(
          lonlat.toLeaflet(reprojectCoordinates(e.target.getLatLng())),
          oppositeCorner
        )
      )
    )
  }