diff --git a/types/mapbox-gl/index.d.ts b/types/mapbox-gl/index.d.ts index 8e5c062d7a..3cd33da2eb 100644 --- a/types/mapbox-gl/index.d.ts +++ b/types/mapbox-gl/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for Mapbox GL JS 1.5 +// Type definitions for Mapbox GL JS 1.6 // Project: https://github.com/mapbox/mapbox-gl-js // Definitions by: Dominik Bruderer // Patrick Reames @@ -39,7 +39,7 @@ declare namespace mapboxgl { */ export function clearStorage(callback?: (err?: Error) => void): void; - export function setRTLTextPlugin(pluginURL: string, callback: (error: Error) => void): void; + export function setRTLTextPlugin(pluginURL: string, callback: (error: Error) => void, deferred?: boolean): void; export function getRTLTextPluginStatus(): PluginStatus; type PluginStatus = 'unavailable' | 'loading' | 'loaded' | 'error'; @@ -405,6 +405,14 @@ declare namespace mapboxgl { /** If true, enable keyboard shortcuts (see KeyboardHandler). */ keyboard?: boolean; + /** A patch to apply to the default localization table for UI strings, e.g. control tooltips. + * The `locale` object maps namespaced UI string IDs to translated strings in the target language; + * see `src/ui/default_locale.js` for an example with all supported string IDs. + * The object may specify all UI strings (thereby adding support for a new translation) or + * only a subset of strings (thereby patching the default translation table). + */ + locale?: { [key: string]: string }; + /** * If specified, defines a CSS font-family for locally overriding generation of glyphs in the * 'CJK Unified Ideographs' and 'Hangul Syllables' ranges. In these ranges, font settings from @@ -425,9 +433,15 @@ declare namespace mapboxgl { /** If set, the map is constrained to the given bounds. */ maxBounds?: LngLatBoundsLike; + /** Maximum pitch of the map */ + maxPitch?: number, + /** Maximum zoom of the map */ maxZoom?: number; + /** Minimum pitch of the map */ + minPitch?: number, + /** Minimum zoom of the map */ minZoom?: number; @@ -756,6 +770,41 @@ declare namespace mapboxgl { getMaxWidth(): string; setMaxWidth(maxWidth: string): this; + + /** + * Adds a CSS class to the popup container element. + * + * @param {string} className Non-empty string with CSS class name to add to popup container + * + * @example + * let popup = new mapboxgl.Popup() + * popup.addClassName('some-class') + */ + addClassName(className: string): void; + + /** + * Removes a CSS class from the popup container element. + * + * @param {string} className Non-empty string with CSS class name to remove from popup container + * + * @example + * let popup = new mapboxgl.Popup() + * popup.removeClassName('some-class') + */ + removeClassName(className: string): void; + + /** + * Add or remove the given CSS class on the popup container, depending on whether the container currently has that class. + * + * @param {string} className Non-empty string with CSS class name to add/remove + * + * @returns {boolean} if the class was removed return false, if class was added, then return true + * + * @example + * let popup = new mapboxgl.Popup() + * popup.toggleClassName('toggleClass') + */ + toggleClassName(className: string): void; } export interface PopupOptions { @@ -1008,6 +1057,9 @@ declare namespace mapboxgl { setSouthWest(sw: LngLatLike): this; + /** Check if the point is within the bounding box. */ + contains(lnglat: LngLatLike): boolean; + /** Extend the bounds to include a given LngLat or LngLatBounds. */ extend(obj: mapboxgl.LngLat | mapboxgl.LngLatBounds): this; @@ -1170,16 +1222,45 @@ declare namespace mapboxgl { isDraggable(): boolean; } + type Alignment = 'map' | 'viewport' | 'auto'; + export interface MarkerOptions { + /** DOM element to use as a marker. The default is a light blue, droplet-shaped SVG marker */ element?: HTMLElement; + /** The offset in pixels as a PointLike object to apply relative to the element's center. Negatives indicate left and up. */ offset?: PointLike; + /** A string indicating the part of the Marker that should be positioned closest to the coordinate set via Marker.setLngLat. + * Options are `'center'`, `'top'`, `'bottom'`, `'left'`, `'right'`, `'top-left'`, `'top-right'`, `'bottom-left'`, and `'bottom-right'`. + * The default value os `'center'` + */ anchor?: Anchor; + /** The color to use for the default marker if options.element is not provided. The default is light blue (#3FB1CE). */ color?: string + /** A boolean indicating whether or not a marker is able to be dragged to a new position on the map. The default value is false */ draggable?: boolean; + + /** The rotation angle of the marker in degrees, relative to its `rotationAlignment` setting. A positive value will rotate the marker clockwise. + * The default value is 0. + */ + rotation?: number, + + /** `map` aligns the `Marker`'s rotation relative to the map, maintaining a bearing as the map rotates. + * `viewport` aligns the `Marker`'s rotation relative to the viewport, agnostic to map rotations. + * `auto` is equivalent to `viewport`. + * The default value is `auto` + */ + rotationAlignment?: Alignment, + + /** `map` aligns the `Marker` to the plane of the map. + * `viewport` aligns the `Marker` to the plane of the viewport. + * `auto` automatically matches the value of `rotationAlignment`. + * The default value is `auto`. + */ + pitchAlignment?: Alignment } /** @@ -1324,6 +1405,11 @@ declare namespace mapboxgl { offset?: PointLike; /** When set to false, no animation happens */ animate?: boolean; + + /** If `true`, then the animation is considered essential and will not be affected by `prefers-reduced-motion`. + * Otherwise, the transition will happen instantly if the user has enabled the `reduced motion` accesibility feature in their operating system. + */ + essential?: boolean; } /** diff --git a/types/mapbox-gl/mapbox-gl-tests.ts b/types/mapbox-gl/mapbox-gl-tests.ts index 6dd93cdb70..a5b48f6b5a 100644 --- a/types/mapbox-gl/mapbox-gl-tests.ts +++ b/types/mapbox-gl/mapbox-gl-tests.ts @@ -18,12 +18,12 @@ mapboxgl.baseApiUrl = 'https://example.com'; mapboxgl.workerCount = 3; /** - * Set max amount of parallel images requests + * Set max amount of parallel images requests */ mapboxgl.maxParallelImageRequests = 10; /** - * Clears browser storage used by this library + * Clears browser storage used by this library */ mapboxgl.clearStorage(() => {}); @@ -32,6 +32,10 @@ mapboxgl.clearStorage(() => {}); */ expectType(mapboxgl.getRTLTextPluginStatus()); +/** + * Set RTL Text Plugin + */ +expectType(mapboxgl.setRTLTextPlugin('http://github.com', e => {}, false)); /** * Display a Map @@ -42,7 +46,9 @@ let map = new mapboxgl.Map({ center: [-50, 50], zoom: 10, minZoom: 1, - maxZoom: 2, + maxZoom: 2, + minPitch: 0, + maxPitch: 60, interactive: true, attributionControl: true, customAttribution: '© YourCo', @@ -52,7 +58,11 @@ let map = new mapboxgl.Map({ boxZoom: true, dragRotate: false, dragPan: true, - antialias: true, + antialias: true, + locale: { + 'FullscreenControl.Enter': 'Розгорнути на весь екран', + 'FullscreenControl.Exit': 'Вийти з повоноеранного режиму' + } }); /** @@ -374,6 +384,9 @@ const popup = new mapboxgl.Popup(popupOptions) .addTo(map); popup.getMaxWidth(); popup.getElement(); // $ExpectType HTMLElement +popup.addClassName('class1'); +popup.removeClassName('class2'); +popup.toggleClassName('class3'); /** * Add an image @@ -600,7 +613,16 @@ map = new mapboxgl.Map({ /** * Marker */ -let marker = new mapboxgl.Marker(undefined, {offset: [10, 0]}) +let marker = new mapboxgl.Marker(undefined, { + element: undefined, + offset: [10, 0], + anchor: 'bottom-right', + color: 'green', + draggable: false, + rotation: 15, + rotationAlignment: 'map', + pitchAlignment: 'viewport' + }) .setLngLat([-50,50]) .addTo(map); @@ -612,6 +634,8 @@ marker.remove(); let bool:boolean; let bounds = new mapboxgl.LngLatBounds(); bool = bounds.isEmpty(); +expectType(bounds.contains([37, 50])); + /* * AttributionControl */ @@ -718,7 +742,9 @@ let padding: mapboxgl.PaddingOptions = { left: 0, right: 0, }; -let animOpts: mapboxgl.AnimationOptions; +let animOpts: mapboxgl.AnimationOptions = { + essential: true +}; let cameraOpts: mapboxgl.CameraOptions = { around: lnglatlike, center: lnglatlike,