@globalfishingwatch/react-map-gl
Version:
A React wrapper for MapboxGL-js and overlay API.
106 lines (96 loc) • 2.66 kB
JavaScript
import { useContext, useRef, useEffect } from 'react';
import PropTypes from 'prop-types';
import MapContext from './map-context';
export var mapControlDefaultProps = {
captureScroll: false,
captureDrag: true,
captureClick: true,
captureDoubleClick: true,
capturePointerMove: false
};
export var mapControlPropTypes = {
captureScroll: PropTypes.bool,
captureDrag: PropTypes.bool,
captureClick: PropTypes.bool,
captureDoubleClick: PropTypes.bool,
capturePointerMove: PropTypes.bool
};
function onMount(thisRef) {
var callbacks = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var ref = thisRef.containerRef.current;
var eventManager = thisRef.context.eventManager;
if (!ref || !eventManager) {
return undefined;
}
var events = {
wheel: function wheel(evt) {
if (thisRef.props.captureScroll) {
evt.stopPropagation();
}
if (callbacks.onScroll) {
callbacks.onScroll(evt, thisRef);
}
},
panstart: function panstart(evt) {
if (thisRef.props.captureDrag) {
evt.stopPropagation();
}
if (callbacks.onDragStart) {
callbacks.onDragStart(evt, thisRef);
}
},
anyclick: function anyclick(evt) {
if (thisRef.props.captureClick) {
evt.stopPropagation();
}
if (callbacks.onClick) {
callbacks.onClick(evt, thisRef);
}
},
click: function click(evt) {
if (thisRef.props.captureClick) {
evt.stopPropagation();
}
if (callbacks.onClick) {
callbacks.onClick(evt, thisRef);
}
},
dblclick: function dblclick(evt) {
if (thisRef.props.captureDoubleClick) {
evt.stopPropagation();
}
if (callbacks.onDoubleClick) {
callbacks.onDoubleClick(evt, thisRef);
}
},
pointermove: function pointermove(evt) {
if (thisRef.props.capturePointerMove) {
evt.stopPropagation();
}
if (callbacks.onPointerMove) {
callbacks.onPointerMove(evt, thisRef);
}
}
};
eventManager.watch(events, ref);
return function () {
eventManager.off(events);
};
}
export default function useMapControl(props, callbacks) {
var context = useContext(MapContext);
var containerRef = useRef(null);
var thisRef = useRef({
props: props,
state: {},
context: context,
containerRef: containerRef
});
thisRef.current.props = props;
thisRef.current.context = context;
useEffect(function () {
return onMount(thisRef.current, callbacks);
}, [context.eventManager]);
return thisRef.current;
}
//# sourceMappingURL=use-map-control.js.map