<Provider />

A higher order component that provides context to connectToContext wrapped children

Constructor

# <Provider children contextProps map maps translations editFeature />

PropTypes:
Name Type Required Description Default
children union Yes Pass components as children of Provider component
contextProps object No Add any custom props to context and they will be passed to all components wrapped by connectToContext {}
map object No OL map object (required if maps array is not passed)
maps array No Array of Openlayers map objects for components that support multi-map (this will override anything passed to map prop) []
translations object No Object with key/value pairs for component translation strings function()
editFeature object No An Ol feature object that is being edited
Since:
  • 1.0.0

View Source Provider/Provider.js, line 16

Example

Examples

The Provider component should wrap your entire application and never be unmounted. It will automatically interface with any ol-kit children within the component tree and connect them to context for things like map, translations and selectInteraction props. A <Map> mounts a <Provider> for you behind the scenes, but if you mount <Provider> declaratively (see below), components do not have to be children of <Map> (only <Provider>).

Fully integrated example:

import React from 'react'
import { Map, Popup, Provider } from '@bayer/ol-kit'

function App() {
  return (
    <Provider>
      <Map />
      <Popup />
    </Provider>
  )
}

export default App

Make sure the never unmounts!