// Type definitions for react-map-gl 3.3 // Project: https://github.com/uber/react-map-gl#readme // Definitions by: Robert Imig // Fabio Berta // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.8 import * as React from 'react'; import * as MapboxGL from 'mapbox-gl'; import * as GeoJSON from 'geojson'; export interface Viewport { latitude: number; longitude: number; zoom: number; bearing?: number; pitch?: number; } export interface MapError { message: string; } export interface MapRequest { url: string; headers?: { [index: string]: string }; credentials?: string; } export interface MapboxProps extends Partial { container?: {}; mapboxApiAccessToken?: string; attributionControl?: boolean; preserveDrawingBuffer?: boolean; onLoad?: () => void; onError?: (e: MapError) => void; reuseMaps?: boolean; reuseMap?: boolean; transformRequest?: (url?: string, resourceType?: string) => MapRequest; mapStyle?: string | {}; width: number; height: number; viewState?: Viewport; altitude?: number; // Note: Non-public API, see https://github.com/mapbox/mapbox-gl-js/issues/1137 } export interface StaticMapProps extends MapboxProps { preventStyleDiffing?: boolean; visible?: boolean; className?: string; } export interface QueryRenderedFeaturesParams { layers?: string[]; filter?: any[]; } export class StaticMap extends React.Component { getMap(): MapboxGL.Map; queryRenderedFeatures(geometry?: MapboxGL.PointLike | MapboxGL.PointLike[], parameters?: QueryRenderedFeaturesParams): Array>; } export interface InteractiveMapState { isDragging: boolean; isHovering: boolean; } export interface MapEvent { lngLat: [number, number]; features: Array<{}>; } export interface Center { x: number; y: number; } export interface MapControlEvent { type: string; center: Center; offsetCenter: Center; target: any; srcEvent: any; key?: number; leftButton?: boolean; middleButton?: boolean; rightButton?: boolean; pointerType?: string; delta?: number; } export interface BaseMapControls { events: string[]; handleEvent(event: MapControlEvent): void; } export type EasingFunction = (t: number) => number; export enum TRANSITION_EVENTS { BREAK = 1, SNAP_TO_END = 2, IGNORE = 3 } export class TransitionInterpolator {} export class LinearInterpolator extends TransitionInterpolator { constructor(transitionProps?: string[]); } export class FlyToInterpolator extends TransitionInterpolator {} export interface ViewStateChangeInfo { viewState: Viewport; } export interface InteractiveMapProps extends StaticMapProps { maxZoom?: number; minZoom?: number; maxPitch?: number; minPitch?: number; onViewportChange?: (viewport: Viewport) => void; onViewStateChange?: (info: ViewStateChangeInfo) => void; transitionDuration?: number; transitionInterpolator?: TransitionInterpolator; transitionInterruption?: TRANSITION_EVENTS; transitionEasing?: EasingFunction; onTransitionStart?: () => void; onTransitionInterrupt?: () => void; onTransitionEnd?: () => void; scrollZoom?: boolean; dragPan?: boolean; dragRotate?: boolean; doubleClickZoom?: boolean; touchZoom?: boolean; touchRotate?: boolean; keyboard?: boolean; onHover?: (event: MapEvent) => void; onClick?: (event: MapEvent) => void; onContextMenu?: (event: MapEvent) => void; touchAction?: string; clickRadius?: number; getCursor?: (state: InteractiveMapState) => void; visibilityConstraints?: { minZoom?: number; maxZoom?: number; minPitch?: number; maxPitch?: number; }; mapControls?: BaseMapControls; } export class InteractiveMap extends React.Component { getMap(): MapboxGL.Map; queryRenderedFeatures(geometry?: MapboxGL.PointLike | MapboxGL.PointLike[], parameters?: QueryRenderedFeaturesParams): Array>; } export default InteractiveMap; export interface BaseControlProps { captureScroll?: boolean; captureDrag?: boolean; captureClick?: boolean; captureDoubleClick?: boolean; } export class BaseControl extends React.Component {} export interface MarkerProps extends BaseControlProps { className?: string; longitude: number; latitude: number; offsetLeft?: number; offsetTop?: number; } export class Marker extends BaseControl {} export interface PopupProps extends BaseControlProps { className?: string; longitude: number; latitude: number; offsetLeft?: number; offsetTop?: number; tipSize?: number; closeButton?: boolean; closeOnClick?: boolean; anchor?: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'; dynamicPosition?: boolean; onClose?: () => void; } export class Popup extends BaseControl {} export interface NavigationControlProps extends BaseControlProps { className?: string; onViewStateChange: (info: ViewStateChangeInfo) => void; onViewportChange: (viewport: Viewport) => void; showCompass?: boolean; showZoom?: boolean; } export class NavigationControl extends BaseControl {} export interface HTMLRedrawOptions { width: number; height: number; project: (lnglat: number[]) => number[]; unproject: (xy: number[]) => number[]; } export interface HTMLOverlayProps extends BaseControlProps { redraw: (opts: HTMLRedrawOptions) => void; style?: React.CSSProperties; } export class HTMLOverlay extends BaseControl {} export interface CanvasRedrawOptions extends HTMLRedrawOptions { ctx: CanvasRenderingContext2D; } export interface CanvasOverlayProps extends BaseControlProps { redraw: (opts: CanvasRedrawOptions) => void; } export class CanvasOverlay extends BaseControl {} export type SVGRedrawOptions = HTMLRedrawOptions; export interface SVGOverlayProps extends BaseControlProps { redraw: (opts: SVGRedrawOptions) => void; style?: React.CSSProperties; } export class SVGOverlay extends BaseControl {} export namespace experimental { interface Options { // TODO(deprecate): remove this when `onChangeViewport` gets deprecated onChangeViewport?: (viewport: Viewport) => void; // TODO(deprecate): remove this when `touchZoomRotate` gets deprecated touchZoomRotate?: boolean; onViewStateChange?: (info: ViewStateChangeInfo) => void; onViewportChange?: (viewport: Viewport) => void; onStateChange?: (state: MapState) => void; eventManager?: any; scrollZoom?: boolean; dragPan?: boolean; dragRotate?: boolean; doubleClickZoom?: boolean; touchZoom?: boolean; touchRotate?: boolean; keyboard?: boolean; } class MapState implements Viewport { width: number; height: number; latitude: number; longitude: number; zoom: number; bearing?: number; pitch?: number; altitude?: number; maxZoom?: number; minZoom?: number; maxPitch?: number; minPitch?: number; transitionDuration?: number; transitionInterpolator?: TransitionInterpolator; transitionInterruption?: TRANSITION_EVENTS; transitionEasing?: EasingFunction; startPanLngLat?: [number, number]; startZoomLngLat?: [number, number]; startBearing?: number; startPitch?: number; startZoom?: number; } class MapControls implements BaseMapControls { events: string[]; handleEvent(event: MapControlEvent): void; getMapState(overrides: Partial): MapState; setOptions(options: Options): void; setState(newState: MapState): void; updateViewport(newMapState: MapState, extraProps: any, extraState: InteractiveMapState): void; } }