[Maps] Isolate mapbox-gl types and align downstream package versions. (…

…#100610)

package.json

@@ -158,8 +158,8 @@
     "@loaders.gl/core": "^2.3.1",
     "@loaders.gl/json": "^2.3.1",
     "@mapbox/geojson-rewind": "^0.5.0",
-    "@mapbox/mapbox-gl-draw": "^1.2.0",
-    "@mapbox/mapbox-gl-rtl-text": "^0.2.3",
+    "@mapbox/mapbox-gl-draw": "1.3.0",
+    "@mapbox/mapbox-gl-rtl-text": "0.2.3",
     "@mapbox/vector-tile": "1.3.1",
     "@scant/router": "^0.1.1",
     "@slack/webhook": "^5.0.4",
@@ -285,7 +285,7 @@
     "lru-cache": "^4.1.5",
     "lz-string": "^1.4.4",
     "mapbox-gl": "1.13.1",
-    "mapbox-gl-draw-rectangle-mode": "^1.0.4",
+    "mapbox-gl-draw-rectangle-mode": "1.0.4",
     "markdown-it": "^10.0.0",
     "md5": "^2.1.0",
     "memoize-one": "^5.0.0",
@@ -562,7 +562,7 @@
     "@types/loader-utils": "^1.1.3",
     "@types/lodash": "^4.14.159",
     "@types/lru-cache": "^5.1.0",
-    "@types/mapbox-gl": "^1.9.1",
+    "@types/mapbox-gl": "1.13.1",
     "@types/markdown-it": "^0.0.7",
     "@types/md5": "^2.2.0",
     "@types/memoize-one": "^4.1.0",

packages/kbn-mapbox-gl/src/index.ts

@@ -7,6 +7,24 @@
  */
 
 import './typings';
+import type {
+  Map,
+  GeoJSONSource,
+  VectorSource,
+  Layer,
+  AnyLayer,
+  FeatureIdentifier,
+  Style,
+  MapboxOptions,
+  MapMouseEvent,
+  MapSourceDataEvent,
+  LngLat,
+  LngLatBounds,
+  PointLike,
+  MapboxGeoJSONFeature,
+  Point,
+  CustomLayerInterface,
+} from 'mapbox-gl';
 import mapboxgl from 'mapbox-gl/dist/mapbox-gl-csp';
 // @ts-expect-error
 import mbRtlPlugin from '!!file-loader!@mapbox/mapbox-gl-rtl-text/mapbox-gl-rtl-text.min.js';
@@ -17,4 +35,22 @@ import 'mapbox-gl/dist/mapbox-gl.css';
 mapboxgl.workerUrl = mbWorkerUrl;
 mapboxgl.setRTLTextPlugin(mbRtlPlugin);
 
-export { mapboxgl };
+export {
+  mapboxgl,
+  Map,
+  GeoJSONSource,
+  VectorSource,
+  Layer,
+  AnyLayer,
+  FeatureIdentifier,
+  Style,
+  MapboxOptions,
+  MapMouseEvent,
+  MapSourceDataEvent,
+  LngLat,
+  LngLatBounds,
+  PointLike,
+  MapboxGeoJSONFeature,
+  Point,
+  CustomLayerInterface,
+};

src/plugins/vis_type_vega/public/vega_view/vega_map_view/constants.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import type { Style } from 'mapbox-gl';
+import type { Style } from '@kbn/mapbox-gl';
 import { TMS_IN_YML_ID } from '../../../../maps_ems/public';
 
 export const vegaLayerId = 'vega';

src/plugins/vis_type_vega/public/vega_view/vega_map_view/layers/types.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import type { Map } from 'mapbox-gl';
+import type { Map } from '@kbn/mapbox-gl';
 
 export interface LayerParameters<TContext extends Record<string, any> = {}> {
   id: string;

src/plugins/vis_type_vega/public/vega_view/vega_map_view/layers/vega_layer.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import type { Map, CustomLayerInterface } from 'mapbox-gl';
+import type { Map, CustomLayerInterface } from '@kbn/mapbox-gl';
 import type { View } from 'vega';
 import type { LayerParameters } from './types';
 

src/plugins/vis_type_vega/public/vega_view/vega_map_view/view.ts

@@ -7,7 +7,7 @@
  */
 
 import { i18n } from '@kbn/i18n';
-import type { Map, Style, MapboxOptions } from 'mapbox-gl';
+import type { Map, Style, MapboxOptions } from '@kbn/mapbox-gl';
 
 import { View, parse } from 'vega';
 

x-pack/plugins/maps/public/classes/layers/heatmap_layer/heatmap_layer.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap, GeoJSONSource as MbGeoJSONSource } from 'mapbox-gl';
+import type { Map as MbMap, GeoJSONSource as MbGeoJSONSource } from '@kbn/mapbox-gl';
 import { FeatureCollection } from 'geojson';
 import { AbstractLayer } from '../layer';
 import { HeatmapStyle } from '../../styles/heatmap/heatmap_style';

x-pack/plugins/maps/public/classes/layers/layer.tsx

@@ -7,7 +7,7 @@
 
 /* eslint-disable @typescript-eslint/consistent-type-definitions */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { Query } from 'src/plugins/data/public';
 import _ from 'lodash';
 import React, { ReactElement, ReactNode } from 'react';

x-pack/plugins/maps/public/classes/layers/tiled_vector_layer/tiled_vector_layer.tsx

@@ -6,11 +6,11 @@
  */
 
 import React from 'react';
-import {
+import type {
   Map as MbMap,
   GeoJSONSource as MbGeoJSONSource,
   VectorSource as MbVectorSource,
-} from 'mapbox-gl';
+} from '@kbn/mapbox-gl';
 import { EuiIcon } from '@elastic/eui';
 import { Feature } from 'geojson';
 import uuid from 'uuid/v4';

x-pack/plugins/maps/public/classes/layers/vector_layer/utils.tsx

@@ -6,7 +6,7 @@
  */
 
 import { FeatureCollection } from 'geojson';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import {
   EMPTY_FEATURE_COLLECTION,
   SOURCE_BOUNDS_DATA_REQUEST_ID,

x-pack/plugins/maps/public/classes/layers/vector_layer/vector_layer.tsx

@@ -6,7 +6,11 @@
  */
 
 import React from 'react';
-import { Map as MbMap, Layer as MbLayer, GeoJSONSource as MbGeoJSONSource } from 'mapbox-gl';
+import type {
+  Map as MbMap,
+  AnyLayer as MbLayer,
+  GeoJSONSource as MbGeoJSONSource,
+} from '@kbn/mapbox-gl';
 import { Feature, FeatureCollection, GeoJsonProperties } from 'geojson';
 import _ from 'lodash';
 import { EuiIcon } from '@elastic/eui';

x-pack/plugins/maps/public/classes/styles/heatmap/heatmap_style.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { i18n } from '@kbn/i18n';
 import { EuiIcon } from '@elastic/eui';
 import { IStyle } from '../style';

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_color_property.tsx

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import React from 'react';
 import { EuiTextColor } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_icon_property.tsx

@@ -8,7 +8,7 @@
 import _ from 'lodash';
 import React from 'react';
 import { EuiTextColor } from '@elastic/eui';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { DynamicStyleProperty } from './dynamic_style_property';
 // @ts-expect-error
 import { getIconPalette, getMakiIconId, getMakiSymbolAnchor } from '../symbol_utils';

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_orientation_property.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { DynamicStyleProperty, getNumericalMbFeatureStateValue } from './dynamic_style_property';
 import { OrientationDynamicOptions } from '../../../../../common/descriptor_types';
 import { RawValue } from '../../../../../common/constants';

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_size_property.test.tsx

@@ -18,7 +18,7 @@ import { shallow } from 'enzyme';
 import { DynamicSizeProperty } from './dynamic_size_property';
 import { RawValue, VECTOR_STYLES } from '../../../../../common/constants';
 import { IField } from '../../../fields/field';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { SizeDynamicOptions } from '../../../../../common/descriptor_types';
 import { mockField, MockLayer, MockStyle } from './test_helpers/test_util';
 import { IVectorLayer } from '../../../layers/vector_layer';

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_size_property.tsx

@@ -7,7 +7,7 @@
 
 import _ from 'lodash';
 import React from 'react';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { DynamicStyleProperty } from './dynamic_style_property';
 import { OrdinalLegend } from '../components/legend/ordinal_legend';
 import { makeMbClampedNumberExpression } from '../style_util';

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_style_property.tsx

@@ -8,7 +8,7 @@
 import _ from 'lodash';
 import React from 'react';
 import { Feature, FeatureCollection } from 'geojson';
-import { FeatureIdentifier, Map as MbMap } from 'mapbox-gl';
+import type { FeatureIdentifier, Map as MbMap } from '@kbn/mapbox-gl';
 import { AbstractStyleProperty, IStyleProperty } from './style_property';
 import { DEFAULT_SIGMA } from '../vector_style_defaults';
 import {

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_text_property.test.tsx

@@ -17,7 +17,7 @@ import React from 'react';
 import { DynamicTextProperty } from './dynamic_text_property';
 import { RawValue, VECTOR_STYLES } from '../../../../../common/constants';
 import { IField } from '../../../fields/field';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { mockField, MockLayer, MockStyle } from './test_helpers/test_util';
 import { IVectorLayer } from '../../../layers/vector_layer';
 

x-pack/plugins/maps/public/classes/styles/vector/properties/dynamic_text_property.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { DynamicStyleProperty } from './dynamic_style_property';
 import { LabelDynamicOptions } from '../../../../../common/descriptor_types';
 import { RawValue } from '../../../../../common/constants';

x-pack/plugins/maps/public/classes/styles/vector/properties/label_border_size_property.ts

@@ -6,7 +6,7 @@
  */
 
 import _ from 'lodash';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { AbstractStyleProperty } from './style_property';
 import { DEFAULT_LABEL_SIZE } from '../vector_style_defaults';
 import { LABEL_BORDER_SIZES } from '../../../../../common/constants';

x-pack/plugins/maps/public/classes/styles/vector/properties/static_color_property.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { StaticStyleProperty } from './static_style_property';
 import { ColorStaticOptions } from '../../../../../common/descriptor_types';
 

x-pack/plugins/maps/public/classes/styles/vector/properties/static_icon_property.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { StaticStyleProperty } from './static_style_property';
 // @ts-expect-error
 import { getMakiSymbolAnchor, getMakiIconId } from '../symbol_utils';

x-pack/plugins/maps/public/classes/styles/vector/properties/static_orientation_property.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { StaticStyleProperty } from './static_style_property';
 import { VECTOR_STYLES } from '../../../../../common/constants';
 import { OrientationStaticOptions } from '../../../../../common/descriptor_types';

x-pack/plugins/maps/public/classes/styles/vector/properties/static_size_property.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { StaticStyleProperty } from './static_style_property';
 import { VECTOR_STYLES } from '../../../../../common/constants';
 import {

x-pack/plugins/maps/public/classes/styles/vector/properties/static_text_property.test.ts

@@ -7,7 +7,7 @@
 
 import { StaticTextProperty } from './static_text_property';
 import { VECTOR_STYLES } from '../../../../../common/constants';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 
 export class MockMbMap {
   _paintPropertyCalls: unknown[];

x-pack/plugins/maps/public/classes/styles/vector/properties/static_text_property.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { StaticStyleProperty } from './static_style_property';
 import { LabelStaticOptions } from '../../../../../common/descriptor_types';
 

x-pack/plugins/maps/public/classes/styles/vector/vector_style.tsx

@@ -7,7 +7,7 @@
 
 import _ from 'lodash';
 import React, { ReactElement } from 'react';
-import { FeatureIdentifier, Map as MbMap } from 'mapbox-gl';
+import { FeatureIdentifier, Map as MbMap } from '@kbn/mapbox-gl';
 import { FeatureCollection } from 'geojson';
 import { StyleProperties, VectorStyleEditor } from './components/vector_style_editor';
 import { getDefaultStaticProperties, LINE_STYLES, POLYGON_STYLES } from './vector_style_defaults';

x-pack/plugins/maps/public/connected_components/mb_map/draw_control/draw_control.tsx

@@ -11,7 +11,7 @@ import React, { Component } from 'react';
 import MapboxDraw from '@mapbox/mapbox-gl-draw';
 // @ts-expect-error
 import DrawRectangle from 'mapbox-gl-draw-rectangle-mode';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { Feature } from 'geojson';
 import { DRAW_TYPE } from '../../../../common/constants';
 import { DrawCircle } from './draw_circle';

x-pack/plugins/maps/public/connected_components/mb_map/draw_control/draw_filter_control/draw_filter_control.tsx

@@ -7,7 +7,7 @@
 
 import _ from 'lodash';
 import React, { Component } from 'react';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { i18n } from '@kbn/i18n';
 import { Filter } from 'src/plugins/data/public';
 import { Feature, Polygon } from 'geojson';

x-pack/plugins/maps/public/connected_components/mb_map/draw_control/draw_tooltip.tsx

@@ -9,7 +9,7 @@ import _ from 'lodash';
 import React, { Component, RefObject } from 'react';
 import { EuiPopover, EuiText } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { Map as MbMap } from 'mapbox-gl';
+import type { Map as MbMap } from '@kbn/mapbox-gl';
 import { DRAW_TYPE } from '../../../../common/constants';
 
 const noop = () => {};

x-pack/plugins/maps/public/connected_components/mb_map/mb_map.tsx

@@ -7,7 +7,7 @@
 
 import _ from 'lodash';
 import React, { Component } from 'react';
-import type { Map as MapboxMap, MapboxOptions, MapMouseEvent } from 'mapbox-gl';
+import type { Map as MapboxMap, MapboxOptions, MapMouseEvent } from '@kbn/mapbox-gl';
 
 // @ts-expect-error
 import { spritesheet } from '@elastic/maki';

x-pack/plugins/maps/public/connected_components/mb_map/scale_control/scale_control.test.tsx

@@ -8,7 +8,7 @@
 import React from 'react';
 import { mount, shallow } from 'enzyme';
 import { ScaleControl } from './scale_control';
-import { LngLat, LngLatBounds, Map as MapboxMap, PointLike } from 'mapbox-gl';
+import type { LngLat, LngLatBounds, Map as MapboxMap, PointLike } from '@kbn/mapbox-gl';
 
 const CLIENT_HEIGHT_PIXELS = 1200;
 const DISTANCE_METERS = 87653;

x-pack/plugins/maps/public/connected_components/mb_map/scale_control/scale_control.tsx

@@ -8,7 +8,7 @@
 import { i18n } from '@kbn/i18n';
 import classNames from 'classnames';
 import React, { Component } from 'react';
-import { Map as MapboxMap } from 'mapbox-gl';
+import type { Map as MapboxMap } from '@kbn/mapbox-gl';
 const MAX_WIDTH = 110;
 
 interface Props {

x-pack/plugins/maps/public/connected_components/mb_map/sort_layers.test.ts

@@ -8,7 +8,7 @@
 /* eslint-disable max-classes-per-file */
 
 import _ from 'lodash';
-import { Map as MbMap, Layer as MbLayer, Style as MbStyle } from 'mapbox-gl';
+import type { Map as MbMap, AnyLayer as MbLayer, Style as MbStyle } from '@kbn/mapbox-gl';
 import { getIsTextLayer, syncLayerOrder } from './sort_layers';
 import { SPATIAL_FILTERS_LAYER_ID } from '../../../common/constants';
 import { ILayer } from '../../classes/layers/layer';

x-pack/plugins/maps/public/connected_components/mb_map/sort_layers.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { Map as MbMap, Layer as MbLayer } from 'mapbox-gl';
+import type { Map as MbMap, Layer as MbLayer } from '@kbn/mapbox-gl';
 import { ILayer } from '../../classes/layers/layer';
 
 // "Layer" is overloaded and can mean the following