From ddeb2fb7e8e25ee7679cfb785777ed3a9e115916 Mon Sep 17 00:00:00 2001 From: Joxit Date: Wed, 28 Jul 2021 11:21:44 +0200 Subject: [PATCH] fix: update maplibre and mapbix types versions and add missing options --- .gitignore | 1 + package.json | 6 ++--- src/places-js.d.ts | 62 +++++++++++++++++++++++++++++++++------------- test/places-js.ts | 10 ++++---- 4 files changed, 54 insertions(+), 25 deletions(-) diff --git a/.gitignore b/.gitignore index 6a09117..f78eea5 100644 --- a/.gitignore +++ b/.gitignore @@ -103,3 +103,4 @@ dist # TernJS port file .tern-port docs/ +package-lock.json diff --git a/package.json b/package.json index 5395e68..5152ef1 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@jawg/types", - "version": "1.0.0", + "version": "1.0.1", "description": "Shared TypeScript definitions for Jawg Maps projects", "types": "./index.d.ts", "typeScriptVersion": "2.3", @@ -44,7 +44,7 @@ "dependencies": { "@types/geojson": "^7946.0.7", "@types/leaflet": "^1.7.3", - "@types/mapbox-gl": "^2.3.1", - "@types/maplibre-gl": "^1.13.1" + "@types/mapbox-gl": "^1.13.2", + "maplibre-gl": "^1.15.2" } } diff --git a/src/places-js.d.ts b/src/places-js.d.ts index da5a09e..8474983 100644 --- a/src/places-js.d.ts +++ b/src/places-js.d.ts @@ -3,6 +3,8 @@ /// /// +import L = require('leaflet'); + declare class AbstractPlaces { constructor(options: JawgPlaces.JawgPlacesOptions); /** @@ -151,7 +153,7 @@ declare namespace JawgPlaces { accessToken?: string; /** * The `` to transform into a geocoding search bar. - * This can be either a id (e.g `#my-input`), class selector (e.g `.my-input`) or the {@link HTMLElement}. + * This can be either a id (e.g `#my-input`), class selector (e.g `.my-input`) or the [HTMLElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement). * With some frameworks/UI libs such as React, you can't use the ref here. */ input?: string | HTMLElement; @@ -321,6 +323,12 @@ declare namespace JawgPlaces { * Options for {@link JawgPlaces.MapLibre} and {@link JawgPlaces.Mapbox} */ interface JawgPlacesMaplibreOptions extends JawgPlacesOptions { + /** + * The custom `
` that will contain the input and geocoding results when Places JS is used as MapLibre Control. + * By default this is generated by Jawg Places JS. + * With some frameworks/UI libs such as React, you can't use the ref here. + */ + container?: string | HTMLElement; /** * Placeholder text to add when the input in generated by the library. */ @@ -328,7 +336,7 @@ declare namespace JawgPlaces { /** * Class to add to the input when it's generated by the library. */ - inputClasses?: string; + inputClasses?: string | string[]; /** * Option to show administrative area when available. */ @@ -341,12 +349,22 @@ declare namespace JawgPlaces { * Option to configure transition on result selection. */ transition?: MapGLTransitionOptions; + /** + * Set a custom message when no results are found. This can be disabled. + */ + noResultsMessage?: string | false; } /** * Options for {@link JawgPlaces.Leaflet} */ interface JawgPlacesLeafletOptions extends JawgPlacesOptions { + /** + * The custom `
` that will contain the input and geocoding results when Places JS is used as Leaflet Control. + * By default this is generated by Jawg Places JS. + * With some frameworks/UI libs such as React, you can't use the ref here. + */ + container?: string | HTMLElement; /** * Placeholder text to add when the input in generated by the library. */ @@ -354,7 +372,7 @@ declare namespace JawgPlaces { /** * Class to add to the input when it's generated by the library. */ - inputClasses?: string; + inputClasses?: string | string[]; /** * Option to show administrative area when available. */ @@ -367,6 +385,10 @@ declare namespace JawgPlaces { * Option to configure transition on result selection. */ transition?: LeafletTransitionOptions; + /** + * Set a custom message when no results are found. This can be disabled. + */ + noResultsMessage?: string | false; /** * Position of the input on the map. */ @@ -374,7 +396,7 @@ declare namespace JawgPlaces { /** * The Leaflet instance for marker creation */ - L: any; + L: typeof L; } /** @@ -388,18 +410,20 @@ declare namespace JawgPlaces { * This class will help you to add or use search bar for geocoding with a MapLibre GL JS map. */ class MapLibre extends AbstractPlaces { - constructor(options: JawgPlacesMaplibreOptions); + constructor(options?: JawgPlacesMaplibreOptions); /** - * This is the function used by MapLibre and Mapbox when you add a {@link mapboxgl.Control}. + * This is the function used by MapLibre and Mapbox when you add a [maplibre.IControl](https://maplibre.org/maplibre-gl-js-docs/api/markers/#icontrol) or [mapboxgl.IControl](https://docs.mapbox.com/mapbox-gl-js/api/markers/#icontrol). * Adds the control to the given map. - * @param map from MapLibre or Mapbox + * @param map from [MapLibre](https://maplibre.org/maplibre-gl-js-docs/api/map/) or [Mapbox](https://docs.mapbox.com/mapbox-gl-js/api/map/) + * @returns the generated control container */ - onAdd(map: mapboxgl.Map): HTMLElement; + onAdd(map: maplibregl.Map | mapboxgl.Map): HTMLElement; /** - * When Jawg Places is not used as a control within your map, you will need to call this function. - * @param map from MapLibre or Mapbox + * When Jawg Places **is not used** as a control within your map, you will need to call this function. + * @param map from [MapLibre](https://maplibre.org/maplibre-gl-js-docs/api/map/) or [Mapbox](https://docs.mapbox.com/mapbox-gl-js/api/map/) + * @returns itself */ - attachMap(map: mapboxgl.Map): MapLibre | Mapbox; + attachMap(map: maplibregl.Map | mapboxgl.Map): MapLibre; /** * The default position of the control in the map. */ @@ -409,7 +433,9 @@ declare namespace JawgPlaces { /** * This class will help you to add or use search bar for geocoding with a Mapbox GL JS map. */ - class Mapbox extends MapLibre {} + class Mapbox extends MapLibre { + attachMap(map: maplibregl.Map | mapboxgl.Map): Mapbox; + } /** * This class will help you to add or use search bar for geocoding with a Leaflet map. @@ -417,9 +443,10 @@ declare namespace JawgPlaces { class Leaflet extends AbstractPlaces { constructor(options: JawgPlacesLeafletOptions); /** - * This is the function used by Leaflet when you add a {@link L.Control}. + * This is the function used by Leaflet when you add a [L.Control](https://leafletjs.com/reference-1.7.1.html#control). * Adds the control to the given map. - * @param map from Leaflet + * @param map from [Leaflet](https://leafletjs.com/reference-1.7.1.html#map-example) + * @returns the generated control container */ onAdd(map: L.Map): void; /** @@ -428,12 +455,13 @@ declare namespace JawgPlaces { getPosition(): string; /** * Adds the control to the given map. - * @param map from leaflet + * @param map from [Leaflet](https://leafletjs.com/reference-1.7.1.html#map-example) */ addTo(map: L.Map): void; /** - * When Jawg Places is not used as a control within your map, you will need to call this function. - * @param map from Leaflet + * When Jawg Places **is not used** as a control within your map, you will need to call this function. + * @param map from [Leaflet](https://leafletjs.com/reference-1.7.1.html#map-example) + * @returns itself */ attachMap(map: L.Map): Leaflet; } diff --git a/test/places-js.ts b/test/places-js.ts index e001807..42a282e 100644 --- a/test/places-js.ts +++ b/test/places-js.ts @@ -1,9 +1,9 @@ import { Map as MapboxGLMap } from 'mapbox-gl'; import { Map as MapLibreGLMap } from 'maplibre-gl'; +import L = require('leaflet'); import { JawgPlaces } from '../'; - -new JawgPlaces.Input({input: '', accessToken: ''}) -new JawgPlaces.MapLibre({input: '', accessToken: ''}) -new JawgPlaces.Mapbox({input: '', accessToken: ''}).attachMap(new MapboxGLMap()) -new JawgPlaces.Leaflet({input: '', accessToken: '', L: {}}) +new JawgPlaces.Input({ input: '', accessToken: '' }); +new JawgPlaces.MapLibre({ input: '', accessToken: '' }).attachMap(new MapLibreGLMap()); +new JawgPlaces.Mapbox({ input: '', accessToken: '' }).attachMap(new MapboxGLMap()); +new JawgPlaces.Leaflet({ input: '', accessToken: '', L }).attachMap(new L.Map('my-map'));