@opengeoweb/webmap-react 20.1.0 → 20.2.0

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import { WMInvalidDateValues, getCorrectWMSDimName, WMImageStore, WMImageStoreLoadType, WMJSDimension, webmapUtils, WMLayer, LayerType, legendImageStore, WMImageEventType, getLegendGraphicURLForLayer, WEBMAP_NAMESPACE, WMProj4Defs, privateWebMapUtils, wmDetermineDimensionMode, WMJSMAP_LONLAT_EPSGCODE, WMDefaultStyleName, tilesettings } from '@opengeoweb/webmap';
 export { WEBMAP_NAMESPACE, webmapTranslations } from '@opengeoweb/webmap';
-import React, { createContext, useMemo, useRef, useState, useEffect, useCallback, useContext, useLayoutEffect } from 'react';
+import React, { createContext, useMemo, useRef, useState, useEffect, useCallback, useContext, useLayoutEffect, useEffectEvent } from 'react';
 import { memoize, range, without, isEqual, throttle, debounce, cloneDeep } from 'lodash';
 import { equals, containsExtent as containsExtent$1, buffer, boundingExtent, containsCoordinate, getCenter } from 'ol/extent';
 import ImageState from 'ol/ImageState';
@@ -26,14 +26,14 @@ import 'ol/ol.css';
 import { listen, unlistenByKey } from 'ol/events';
 import { unByKey } from 'ol/Observable';
 import EventType from 'ol/pointer/EventType';
-import { toLonLat, fromLonLat, transformExtent, transform } from 'ol/proj';
+import { toLonLat, get, equivalent, fromLonLat, transformExtent, transform } from 'ol/proj';
 import { equals as equals$1, closestOnSegment } from 'ol/coordinate';
 import { noModifierKeys, never, platformModifierKeyOnly, always } from 'ol/events/condition';
 import Modify from 'ol/interaction/Modify';
 import Style$1, { createDefaultStyle } from 'ol/style/Style';
 import GeoJSON from 'ol/format/GeoJSON';
 import Translate from 'ol/interaction/Translate';
-import { lineSplit, cleanCoords, featureCollection, difference, bbox, feature, simplify, booleanPointInPolygon, intersect, polygonToLine, booleanClockwise, rewind, toWgs84, toMercator, coordEach } from '@turf/turf';
+import { lineSplit, cleanCoords, featureCollection, round, difference, bbox, feature, simplify, booleanPointInPolygon, intersect, polygonToLine, booleanClockwise, rewind, toWgs84, toMercator, coordEach } from '@turf/turf';
 import proj4 from 'proj4';
 import { register } from 'ol/proj/proj4';
 import { produce } from 'immer';
@@ -919,6 +919,7 @@ var TimeAwareImageWrapper = /*#__PURE__*/function (_ImageWrapper) {
     _this._resolvers = [];
     _this._styleName = 'default';
     _this._layerName = null;
+    _this._extentRatio = WMS_EXTENT_RATIO_TO_VIEWPORT;
     _this._compositeImageKey = '';
     _this._compositeImage = null;
     _this.extent = extent;
@@ -938,6 +939,11 @@ var TimeAwareImageWrapper = /*#__PURE__*/function (_ImageWrapper) {
   }
   _inherits(TimeAwareImageWrapper, _ImageWrapper);
   return _createClass(TimeAwareImageWrapper, [{
+    key: "setExtentRatio",
+    value: function setExtentRatio(extentRatio) {
+      this._extentRatio = extentRatio;
+    }
+  }, {
     key: "getWMSGetMapRequestURL",
     value: function getWMSGetMapRequestURL(extentToLoad, resolutionToLoad, __pixelRatio, projection, getMapUrl, params, layerName, styleName, dimProps) {
       var pixelRatio = 1; // TODO?
@@ -954,8 +960,8 @@ var TimeAwareImageWrapper = /*#__PURE__*/function (_ImageWrapper) {
       var resolution = resolutionToLoad;
       var requestResolution = Array.isArray(resolution) ? resolution[0] : resolution || 1;
       var newPixelRatio = pixelRatio;
-      // Load 1.2^2 % larger WMS extents than the current view
-      var ratio = WMS_EXTENT_RATIO_TO_VIEWPORT;
+      // Load extentRatio^2 % larger WMS extents than the current view (default 1.2, see WMS_EXTENT_RATIO_TO_VIEWPORT)
+      var ratio = this._extentRatio;
       var extent = extentToLoad;
       var newExtent = getRequestExtent(extent, requestResolution, newPixelRatio, ratio);
       // Feature in adaguc-server to display actually used dimensions in the map.
@@ -1422,7 +1428,8 @@ var TimeawareImageSource = /*#__PURE__*/function (_ImageSource) {
       styleName = _ref.styleName,
       dimProps = _ref.dimProps,
       params = _ref.params,
-      visible = _ref.visible;
+      visible = _ref.visible,
+      extentRatio = _ref.extentRatio;
     _classCallCheck(this, TimeawareImageSource);
     _this = _callSuper(this, TimeawareImageSource, [{}]);
     _this._failedImageRetryTimer = null;
@@ -1434,6 +1441,7 @@ var TimeawareImageSource = /*#__PURE__*/function (_ImageSource) {
     _this._timeStampsToPrefetch = _toConsumableArray(timeStampsToPrefetch || []);
     _this._previousPrefetchExtent = null;
     _this._prefetchWorkers = new WorkerQueue(NUMBER_PREFETCH_WORKERS);
+    _this._extentRatio = extentRatio !== null && extentRatio !== void 0 ? extentRatio : WMS_EXTENT_RATIO_TO_VIEWPORT;
     _this.prefetch = _this.prefetch.bind(_this);
     _this.isImageLoadingForTimestep = _this.isImageLoadingForTimestep.bind(_this);
     _this.hasImageLoadedForTimeValue = _this.hasImageLoadedForTimeValue.bind(_this);
@@ -1459,6 +1467,8 @@ var TimeawareImageSource = /*#__PURE__*/function (_ImageSource) {
     _this._imWrapperEmptyButLoading = initImageWrapper();
     _this._imWrapperForOlSource = initImageWrapper();
     _this._imWrapperForAltImage = initImageWrapper();
+    _this._imWrapperForOlSource.setExtentRatio(_this._extentRatio);
+    _this._imWrapperForAltImage.setExtentRatio(_this._extentRatio);
     _this.set(LayerProperty.VISIBLE, !!visible);
     return _this;
   }
@@ -1535,6 +1545,7 @@ var TimeawareImageSource = /*#__PURE__*/function (_ImageSource) {
                 while (1) switch (_context.n) {
                   case 0:
                     jobWrapper = new TimeAwareImageWrapper([0, 0, 0, 0], 1, 1);
+                    jobWrapper.setExtentRatio(_this3._extentRatio);
                     dimPropsWithTime = _objectSpread2(_objectSpread2({}, _this3._dimProperties), {}, {
                       TIME: dimValue
                     });
@@ -4372,10 +4383,6 @@ var NEW_LINESTRING_CREATED = 'new point in LineString created';
 var NEW_FEATURE_CREATED = 'new feature created';
 var NEW_POINT_CREATED = 'new point created';
 var COORDINATE_DECIMALS = 5;
-var roundToDecimals = function roundToDecimals(value, decimals) {
-  var factor = Math.pow(10, decimals);
-  return Math.round(value * factor) / factor;
-};
 var roundCoordinates = function roundCoordinates(coords) {
   if (!Array.isArray(coords)) {
     return coords;
@@ -4385,7 +4392,7 @@ var roundCoordinates = function roundCoordinates(coords) {
       return value.map(_mapCoords);
     }
     if (typeof value === 'number') {
-      return roundToDecimals(value, COORDINATE_DECIMALS);
+      return round(value, COORDINATE_DECIMALS);
     }
     return value;
   };
@@ -6210,6 +6217,59 @@ var selectPreferredWMSProjection = function selectPreferredWMSProjection(viewSrs
   }
   return 'EPSG:3857';
 };
+/**
+ * Returns the identifier of a linked tile matrix set whose CRS matches the view SRS.
+ * The view SRS is preferred; if it has no match, configured WMProj4Defs are checked
+ * in order. Matrix sets without a known CRS or tiles are ignored.
+ *
+ * @param capabilities WMTS capabilities to search.
+ * @param layerName Identifier of the layer to search.
+ * @param viewSrs Projection code of the current map view.
+ * @returns The matching tile matrix set identifier, or null if no match is available.
+ */
+var selectPreferredWMTSTileMatrixSet = function selectPreferredWMTSTileMatrixSet(capabilities, layerName, viewSrs) {
+  var _contents$Layer, _layer$TileMatrixSetL;
+  if (!viewSrs) {
+    return null;
+  }
+  var contents = capabilities === null || capabilities === void 0 ? void 0 : capabilities.Contents;
+  var layer = contents === null || contents === void 0 || (_contents$Layer = contents.Layer) === null || _contents$Layer === void 0 ? void 0 : _contents$Layer.find(function (candidate) {
+    return candidate.Identifier === layerName;
+  });
+  var candidates = ((_layer$TileMatrixSetL = layer === null || layer === void 0 ? void 0 : layer.TileMatrixSetLink) !== null && _layer$TileMatrixSetL !== void 0 ? _layer$TileMatrixSetL : []).flatMap(function (link) {
+    var _contents$TileMatrixS, _matrixSet$TileMatrix;
+    var matrixSet = contents === null || contents === void 0 || (_contents$TileMatrixS = contents.TileMatrixSet) === null || _contents$TileMatrixS === void 0 ? void 0 : _contents$TileMatrixS.find(function (candidate) {
+      return candidate.Identifier === link.TileMatrixSet;
+    });
+    var projection = matrixSet !== null && matrixSet !== void 0 && matrixSet.SupportedCRS ? get(matrixSet.SupportedCRS) : null;
+    return matrixSet !== null && matrixSet !== void 0 && matrixSet.Identifier && (_matrixSet$TileMatrix = matrixSet.TileMatrix) !== null && _matrixSet$TileMatrix !== void 0 && _matrixSet$TileMatrix.length && projection ? [{
+      identifier: matrixSet.Identifier,
+      projection: projection
+    }] : [];
+  });
+  var _loop = function _loop() {
+      var code = _arr[_i];
+      var projection = get(code);
+      var match = projection && candidates.find(function (candidate) {
+        return equivalent(candidate.projection, projection);
+      });
+      if (match) {
+        return {
+          v: match.identifier
+        };
+      }
+    },
+    _ret;
+  for (var _i = 0, _arr = [viewSrs].concat(_toConsumableArray(WMProj4Defs.map(function (_ref5) {
+      var _ref6 = _slicedToArray(_ref5, 1),
+        srs = _ref6[0];
+      return srs;
+    }))); _i < _arr.length; _i++) {
+    _ret = _loop();
+    if (_ret) return _ret.v;
+  }
+  return null;
+};
 var useProjection = function useProjection() {
   var _useContext = useContext(MapContext),
     map = _useContext.map;
@@ -7296,7 +7356,8 @@ var TimeawareImageSourceWMSLayer = function TimeawareImageSourceWMSLayer(_ref) {
     visible = _ref$visible === void 0 ? true : _ref$visible,
     onInitializeLayer = _ref.onInitializeLayer,
     onLayerReady = _ref.onLayerReady,
-    onLayerError = _ref.onLayerError;
+    onLayerError = _ref.onLayerError,
+    extentRatio = _ref.extentRatio;
   var _useContext = useContext(MapContext),
     map = _useContext.map;
   var _useContext2 = useContext(TimeContext),
@@ -7339,7 +7400,8 @@ var TimeawareImageSourceWMSLayer = function TimeawareImageSourceWMSLayer(_ref) {
         styleName: styleName && styleName !== 'default' ? styleName : '',
         dimProps: dimensionsValues,
         timeStampsToPrefetch: [],
-        visible: visible
+        visible: visible,
+        extentRatio: extentRatio
       })
     });
     map.addLayer(olLayer);
@@ -7621,7 +7683,6 @@ var WMTSDimensionsFromDimensions = function WMTSDimensionsFromDimensions(dimensi
 var WMTSLayer = function WMTSLayer(_ref) {
   var getCapsURL = _ref.getCapsURL,
     layerName = _ref.layerName,
-    tileMatrixSet = _ref.tileMatrixSet,
     layerOptions = _ref.layerOptions,
     layerProps = _ref.layerProps;
   var _useContext = useContext(MapContext),
@@ -7638,17 +7699,26 @@ var WMTSLayer = function WMTSLayer(_ref) {
     wmtsCaps = _useQueryWMTSGetCapab.data,
     isLoading = _useQueryWMTSGetCapab.isLoading,
     isError = _useQueryWMTSGetCapab.isError;
+  var projectionName = useProjection();
   var wmtsLayer = useMemo(function () {
-    if (isLoading || isError || !wmtsCaps) {
+    if (isLoading || isError || !wmtsCaps || !projectionName) {
       return null;
     }
-    var parser = new WMTSCapabilities();
-    var capabilities = parser.read(wmtsCaps);
-    return optionsFromCapabilities(capabilities, {
-      layer: layerName,
-      matrixSet: tileMatrixSet
-    });
-  }, [wmtsCaps, isLoading, isError, layerName, tileMatrixSet]);
+    try {
+      var capabilities = new WMTSCapabilities().read(wmtsCaps);
+      var matrixSet = selectPreferredWMTSTileMatrixSet(capabilities, layerName, projectionName);
+      if (!matrixSet) {
+        return null;
+      }
+      return optionsFromCapabilities(capabilities, {
+        layer: layerName,
+        matrixSet: matrixSet
+      });
+    } catch (e) {
+      console.error('Error parsing WMTS capabilities:', e);
+      return null;
+    }
+  }, [isLoading, isError, wmtsCaps, layerName, projectionName]);
   useEffect(function () {
     if (!map || !wmtsLayer) {
       return function () {};
@@ -7665,6 +7735,7 @@ var WMTSLayer = function WMTSLayer(_ref) {
     return function () {
       map.removeLayer(layer);
       setLayer(undefined);
+      setSource(undefined);
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [map, wmtsLayer]);
@@ -8048,8 +8119,7 @@ var DefaultBaseLayers = function DefaultBaseLayers(_ref) {
           getCapsURL: "https://services.arcgisonline.com/arcgis/rest/services/World_Topo_Map/MapServer/WMTS?SERVICE=WMTS&REQUEST=GetCapabilities",
           layerName: "World_Topo_Map",
           layerOptions: layerOptions,
-          layerProps: layerProps,
-          tileMatrixSet: "GoogleMapsCompatible"
+          layerProps: layerProps
         });
       case BaseLayerType.LIGHT_GREY_CANVAS:
       default:
@@ -10622,7 +10692,6 @@ var TimeAwareWMTSLayer = function TimeAwareWMTSLayer(_ref) {
     onLayerError = _ref.onLayerError,
     _ref$visible = _ref.visible,
     visible = _ref$visible === void 0 ? true : _ref$visible;
-  var tileMatrixSet = 'EPSG:3857';
   var _useContext = useContext(MapContext),
     map = _useContext.map;
   var _useState = useState(),
@@ -10633,6 +10702,7 @@ var TimeAwareWMTSLayer = function TimeAwareWMTSLayer(_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     source = _useState4[0],
     setSource = _useState4[1];
+  var projectionName = useProjection();
   // get a wmLayer instance
   var _useGetWMLayerInstanc = useGetWMLayerInstance({
       service: getCapsURL,
@@ -10642,18 +10712,12 @@ var TimeAwareWMTSLayer = function TimeAwareWMTSLayer(_ref) {
     }),
     wmLayer = _useGetWMLayerInstanc.wmLayer,
     errorMessage = _useGetWMLayerInstanc.errorMessage;
-  if (errorMessage && onLayerError) {
-    onLayerError(layerId || '', errorMessage);
-  }
   // dimensionsValues is a key/value dictionary with dimension names specifically for WMS GetMap requests
   var dimensionsValues = getDimensionParamsForWMS(dimensions, wmLayer);
   // This string can be used safely in a useEffect or other React hook to check if the contents changed
   var dimensionsValuesEffectCheck = dimensionsValues && Object.entries(dimensionsValues).map(function (dimensionNameAndCurrentValue) {
     return "".concat(dimensionNameAndCurrentValue[0], ":").concat(dimensionNameAndCurrentValue[1]);
   }).join(',');
-  useEffect(function () {
-    onLayerReady && wmLayer && layerId && onLayerReady(layerId);
-  }, [layerId, wmLayer, onLayerReady]);
   // Initialize layer for GeoWeb, call onInitializeLayer
   useEffect(function () {
     var initializeLayer = /*#__PURE__*/function () {
@@ -10725,23 +10789,54 @@ var TimeAwareWMTSLayer = function TimeAwareWMTSLayer(_ref) {
   var _useQueryWMTSGetCapab = useQueryWMTSGetCapabilities(getCapsURL),
     wmtsCaps = _useQueryWMTSGetCapab.data,
     isLoading = _useQueryWMTSGetCapab.isLoading,
-    isError = _useQueryWMTSGetCapab.isError;
-  var TimeAwareWMTSLayer = useMemo(function () {
-    if (isLoading || isError || !wmtsCaps) {
-      return null;
+    isError = _useQueryWMTSGetCapab.isError,
+    error = _useQueryWMTSGetCapab.error;
+  var _useMemo = useMemo(function () {
+      if (isLoading || isError || !wmtsCaps || !projectionName) {
+        return {
+          options: null
+        };
+      }
+      try {
+        var capabilities = new WMTSCapabilities().read(wmtsCaps);
+        var matrixSet = selectPreferredWMTSTileMatrixSet(capabilities, layerName, projectionName);
+        if (!matrixSet) {
+          return {
+            options: null
+          };
+        }
+        return {
+          options: optionsFromCapabilities(capabilities, {
+            layer: layerName,
+            matrixSet: matrixSet
+          })
+        };
+      } catch (e) {
+        return {
+          options: null,
+          error: "Error parsing WMTS capabilities: ".concat(e instanceof Error ? e.message : String(e))
+        };
+      }
+    }, [wmtsCaps, isLoading, isError, layerName, projectionName]),
+    wmtsOptions = _useMemo.options,
+    parsingError = _useMemo.error;
+  var layerError = errorMessage || isError && "Error fetching WMTS capabilities: ".concat((error === null || error === void 0 ? void 0 : error.message) || 'Unknown error') || parsingError;
+  var isLayerReady = !!wmLayer && !!wmtsOptions;
+  var reportLayerStatus = useEffectEvent(function () {
+    if (layerError) {
+      onLayerError === null || onLayerError === void 0 || onLayerError(layerId || '', layerError);
+    } else if (isLayerReady && layerId) {
+      onLayerReady === null || onLayerReady === void 0 || onLayerReady(layerId);
     }
-    var parser = new WMTSCapabilities();
-    var capabilities = parser.read(wmtsCaps);
-    return optionsFromCapabilities(capabilities, {
-      layer: layerName,
-      matrixSet: tileMatrixSet
-    });
-  }, [wmtsCaps, isLoading, isError, layerName, tileMatrixSet]);
+  });
   useEffect(function () {
-    if (!map || !TimeAwareWMTSLayer) {
+    reportLayerStatus();
+  }, [layerError, isLayerReady, layerId]);
+  useEffect(function () {
+    if (!map || !wmtsOptions) {
       return function () {};
     }
-    var source = new WMTS(_objectSpread2(_objectSpread2({}, TimeAwareWMTSLayer), dimensions ? {
+    var source = new WMTS(_objectSpread2(_objectSpread2({}, wmtsOptions), dimensions ? {
       dimensions: WMTSDimensionsFromDimensions(dimensions)
     } : {}));
     var layer = new TileLayer({
@@ -10756,12 +10851,13 @@ var TimeAwareWMTSLayer = function TimeAwareWMTSLayer(_ref) {
     return function () {
       map.removeLayer(layer);
       setLayer(undefined);
+      setSource(undefined);
       if (wmLayer) {
         wmLayer.olSource = null;
       }
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [map, TimeAwareWMTSLayer, wmLayer]);
+  }, [map, wmtsOptions, wmLayer]);
   useEffect(function () {
     if (dimensions) {
       source === null || source === void 0 || source.updateDimensions(WMTSDimensionsFromDimensions(dimensions));
@@ -11359,7 +11455,8 @@ var OpenLayersLayer = function OpenLayersLayer(layerProps) {
     layerType = _layerProps$layerType === void 0 ? LayerType.mapLayer : _layerProps$layerType,
     _layerProps$tileServe = layerProps.tileServerSettings,
     tileServerSettings = _layerProps$tileServe === void 0 ? tilesettings : _layerProps$tileServe,
-    options = layerProps.options;
+    options = layerProps.options,
+    extentRatio = layerProps.extentRatio;
   var isBaseLayer = layerType === LayerType.baseLayer;
   var isOverlay = layerType === LayerType.overLayer;
   var layerOptions = useMemo(function () {
@@ -11377,6 +11474,7 @@ var OpenLayersLayer = function OpenLayersLayer(layerProps) {
         return jsx(TimeawareImageSourceWMSLayer, {
           debugMode: debugMode,
           dimensions: dimensions,
+          extentRatio: extentRatio,
           getCapsURL: service,
           layerId: id,
           layerName: name,
@@ -11490,6 +11588,13 @@ var OpenLayersLayer = function OpenLayersLayer(layerProps) {
           urlTemplate: urlTemplate
         });
       }
+    } else if (type === 'wmts' && _name && _service) {
+      return jsx(WMTSLayer, {
+        getCapsURL: "".concat(_service, "?SERVICE=WMTS&REQUEST=GetCapabilities"),
+        layerName: _name,
+        layerOptions: layerOptions,
+        layerProps: layerProps
+      });
     } else if (_name && _service) {
       return jsx(WMSLayer, {
         layerName: _name,
@@ -11759,6 +11864,7 @@ var OpenLayersMapDraw = function OpenLayersMapDraw(_ref) {
     updateGeojson = _ref.updateGeojson,
     onViewOnlyFeatureClick = _ref.onViewOnlyFeatureClick,
     onNoFeatureClick = _ref.onNoFeatureClick,
+    onEscape = _ref.onEscape,
     boxSelect = _ref.boxSelect;
   var _React$useContext = React.useContext(MapContext),
     map = _React$useContext.map;
@@ -11767,11 +11873,13 @@ var OpenLayersMapDraw = function OpenLayersMapDraw(_ref) {
   var updateGeojsonRef = React.useRef(updateGeojson);
   var onViewOnlyFeatureClickRef = React.useRef(onViewOnlyFeatureClick);
   var onNoFeatureClickRef = React.useRef(onNoFeatureClick);
+  var onEscapeRef = React.useRef(onEscape);
   var boxSelectRef = React.useRef(boxSelect);
   exitDrawModeCallbackRef.current = exitDrawModeCallback;
   updateGeojsonRef.current = updateGeojson;
   onViewOnlyFeatureClickRef.current = onViewOnlyFeatureClick;
   onNoFeatureClickRef.current = onNoFeatureClick;
+  onEscapeRef.current = onEscape;
   boxSelectRef.current = boxSelect;
   React.useEffect(function () {
     var _geojson$features$sel;
@@ -12360,6 +12468,7 @@ var OpenLayersMapDraw = function OpenLayersMapDraw(_ref) {
     };
     var abortOnEsc = function abortOnEsc(evt) {
       if (evt.key === 'Escape') {
+        var _onEscapeRef$current;
         evt.preventDefault();
         draw.finishDrawing();
         if (selectedFeatureHasGeometry) {
@@ -12368,6 +12477,7 @@ var OpenLayersMapDraw = function OpenLayersMapDraw(_ref) {
         } else {
           draw.abortDrawing();
         }
+        (_onEscapeRef$current = onEscapeRef.current) === null || _onEscapeRef$current === void 0 || _onEscapeRef$current.call(onEscapeRef);
       }
     };
     var onlyAllowMoving = actualDrawMode === DRAWMODE.CIRCLE || actualDrawMode === DRAWMODE.OVAL || actualDrawMode === DRAWMODE.FREEHANDLINE;
@@ -14837,4 +14947,4 @@ var getLayerUpdateInfo = function getLayerUpdateInfo(wmLayer, mapId) {
   return updateObject;
 };
 
-export { BaseLayerType, CLASSNAME_MAP_MEASURE_TOOLTIP, CONSTRAINED_SELECTION_TYPES, COORDINATE_DECIMALS, ClickOnMapTool, Clock, DEFAULT_GEOJSON_STYLE_FILL_OPACITY, DRAWMODE, DefaultBaseLayers, DimensionSelectButton, DimensionSelectDialog, DimensionSelectSlider, EditModeButton as EditModeButtonField, FEATURE_DRAW_FILL_COLOR, FEATURE_DRAW_FILL_COLOR_TRANSPARENT, FEATURE_DRAW_SECONDARY_FILL_COLOR, FEATURE_DRAW_SECONDARY_STROKE_COLOR, FEATURE_DRAW_STROKE_COLOR, FEATURE_FILL, FEATURE_FILL_SELECTED, FEATURE_STROKE, FEATURE_STROKE_EDIT, FEATURE_STROKE_SELECTED, FEATURE_VERTICES_EDIT_HANDLES, FEATURE_VERTICE_HANDLE_IMAGE, FEATURE_VERTICE_IMAGE, FeatureLayer, FeatureLayers, GeoJSONTextField, IntersectionSelect, LayerInfoButton, LayerInfoDialog, LayerInfoLegend, LayerInfoList, LayerInfoText, Legend, LegendButton, LegendDialog, LegendLayout, MIN_HEIGHT, MIN_WIDTH, MapContext, MapControlButton, MapControls, MapDimensionSelect, MapFeatureClass, MapMeasure, MapTime, MapWarningProperties, NEW_FEATURE_CREATED, NEW_LINESTRING_CREATED, NEW_POINT_CREATED, OpenLayersFeatureLayer, OpenLayersGetFeatureInfo, OpenLayersLayer, OpenLayersMapDraw, OpenLayersMapView, OpenLayersZoomControl, POINTER_CLICK_TOLERANCE_PX, SELECTED_FEATURE_COLOR, SELECTED_POINT_HALO_STYLE, STAC_ASSET_STYLE_PREFIX, STAC_ITEM_PAGE_LIMIT, STAC_ITEM_SEARCH_FIELDS_CONFORMANCE, STAC_TEMPORAL_STEP_SAMPLE_LIMIT, SelectField, StoryLayoutGrid, TRANSIENT_FEATURE_PROPERTIES, TimeAwareEDRLocationLayer, TimeAwareGeoTIFFLayer, TimeAwareWMTSLayer, TimeContext, TimeawareImageSource, TimeawareImageSourceWMSLayer, WEBMAP_REACT_NAMESPACE, WMSLayer, WMTSLayer, XYZLayer, ZoomControls, addFeatureProperties, addGeoJSONProperties, addSelectionTypeToGeoJSON, asNewFeature, basicExampleDrawOptions, basicExampleMultipleShapeDrawOptions, basicExampleMultipleShapeWithValuesDrawOptions, basicExampleSharedVertexDrawOptions, calculateBoxSelection, calculateNewSelection, catmullRomSpline, clearImageCacheForAllMaps, colorMaps, connectSharedVertices, createBoxBasedOnModifiedVertex, createIconStyle, createInterSections, createModifyFeatures, createMoveFeatures, createOval, currentlySupportedDrawModes, defaultBox, defaultCircle, defaultDelete, defaultEdrStyles, defaultFreehandLine, defaultGeoJSONStyleProperties, defaultIntersectionStyleProperties, defaultLayers, defaultLineString, defaultLocation, defaultModes, defaultOval, defaultPoint, defaultPolygon, defaultRotatableBox, defaultSmoothLine, defaultSplit, defaultSquare, defaultTimeFormat, dimensionConfig, drawPolyStoryStyles, drawStyles, emptyGeoJSON, endToolExampleConfig, exampleIntersectionOptions, exampleIntersectionWithShapeOptions, exampleIntersections, exampleIntersectionsMultiDrawTool, featureMultiPoint, featurePoint, featurePolygon, fetchEDRArea, fetchEDRCollectionDetails, fetchEDRCube, fetchEDRJson, fetchEDRParameter, fetchStacCatalogCollections, fetchStacCatalogRoot, fetchStacCollection, fetchStacItem, fetchStacItems, fetchStacItemsPage, fetchStacItemsWithPagination, fillOptions, firSelectionType, formatTime, generateImageFromLegend, genericOpenLayersFeatureStyle, geowebColorToOpenLayersColor, getAffectedIndices, getBoxRotateHandlePoints, getBoxSelectPreviewStyle, getDimensionIcon, getDimensionLabel, getDimensionValue, getDimensionsList, getDoubleControlToolIcon, getDrawModeIdFromSelectionType, getFeatureCollection, getFeatureExtent, getFeaturePointStyle, getFirTitle, getGeoJSONPropertyValue, getGeoJson, getIcon, getIntersectionToolIcon, getIsInsideAcceptanceTime, getLastEmptyFeatureIndex, getLayerBbox, getLayerExtentForProjection, getLayerStyles, getLayerUpdateInfo, getLegendClass, getOlFeatureKey, getProj4, getRendersAsStyles, getStacAssetKeyFromStyle, getStacAssetStyles, getStacCollectionStyles, getStacFrameItemsToRender, getStacItemLookupWindowForTimes, getStacItemSearchUrl, getStacItemsUrl, getTimeDimension, getToolIcon, handleResponse, hasEditableVertices, initializeOpenLayersProjections, inlineFeatureStyle, intersectPointGeoJSONS, intersectPolygonGeoJSONS, intersectionFeatureBE, intersectionFeatureNL, isBrowserReadableGeoTIFFAsset, isClickFromDrag, isDefaultModifiable, isDefaultMovable, isGeoJSONFeatureCreatedByTool, isGeoJSONGeometryEmpty, isGeoTIFFAsset, isPointFeatureCollection, joinUrlParams, keepIdentityOnFirstSplitFeature, labelOptions, lineString, lineStringCollection, makeFeatureStyleDisc, makeFeatureStyleLoading, makeFeatureStyleMultiParam, makeFeatureStyleMultiParamLoading, makeFeatureStyleWind, makeLegendFromColorMap, makeLegendFromStyleName, makeTimeList, makeView, marksByDimension, measureResultStyle, measureToolStyle, modifyHandleStyle$1 as modifyHandleStyle, modifyStyles, moveFeature, multiLineStringLabelStyle, multiPolygonLabelStyle, normalizeEDRLabel, opacityOptions, openLayersGetMapImageStore, polygonCleanDangling, polygonCleanDanglingCoords, polygonFeatureCollectionCleanDangling, precipitationMMLegendColorsWoW, projectorCache, publicLayers, publicServices, removeFeatureProperties, removeOverlappingLines, removeTransientFeatureProperties, resolvePreferredStyleName$1 as resolvePreferredStyleName, resolveStacAssetKey, rewindGeometry, roundCoordinates, roundFeatureCoordinates, selectPreferredWMSProjection, setMapCenter, setViewFromExtent, setViewFromFeature, shouldEnterEditMode, shouldExitEditModeForMultiSelect, simpleBoxGeoJSON, simpleBoxGeoJSONWrongOrder, simpleFlightRouteLineStringGeoJSON, simpleFlightRoutePointsGeoJSON, simpleGeometryCollectionGeoJSON, simpleLineStringGeoJSON, simpleMultiPolygon, simplePointsGeojson, simplePolygonGeoJSON, simpleSmallLineStringGeoJSON, splitLine, splitPolygon, splitStyle, stacCatalogCollectionToLayerProps, stacColormapToOlStyle, stacGrayscaleOlStyle, stacNormalizedGrayscaleOlStyle, startToolExampleConfig, strokeWidthOptions, styleNameToStyleLike, temperatureLegendColorsCWK, temperatureLegendColorsWoW, textLabelStyle, textStyle, textStyleWithMargin, toMovedFeatures, updateEditModeButtonsWithFir, useAnimationForLayer, useEDRGetCollectionDetails, useEDRGetParameterData, useEDRWMLayer, useGeoJSON, useGetWMLayerInstance, useGetWMSLayerStyleList, useIconStyle, useMapDrawTool, useModifyFeatures, useMoveFeatures, useProjection, useQueryGetWMSGetCapabilities, useQueryGetWMSLayer, useQueryGetWMSLayers, useQueryGetWMSLayersTree, useQueryGetWMSServiceInfo, useQueryWMTSGetCapabilities, useSetIntervalWhenVisible, useStacCatalogRoot, useStacCollection, useStacItems, useStacOverviewItems, useStacTemporalStepItems, useViewFromLayer, viewUtils, webmapEDRQueryOptions, webmapReactTranslations };
+export { BaseLayerType, CLASSNAME_MAP_MEASURE_TOOLTIP, CONSTRAINED_SELECTION_TYPES, COORDINATE_DECIMALS, ClickOnMapTool, Clock, DEFAULT_GEOJSON_STYLE_FILL_OPACITY, DRAWMODE, DefaultBaseLayers, DimensionSelectButton, DimensionSelectDialog, DimensionSelectSlider, EditModeButton as EditModeButtonField, FEATURE_DRAW_FILL_COLOR, FEATURE_DRAW_FILL_COLOR_TRANSPARENT, FEATURE_DRAW_SECONDARY_FILL_COLOR, FEATURE_DRAW_SECONDARY_STROKE_COLOR, FEATURE_DRAW_STROKE_COLOR, FEATURE_FILL, FEATURE_FILL_SELECTED, FEATURE_STROKE, FEATURE_STROKE_EDIT, FEATURE_STROKE_SELECTED, FEATURE_VERTICES_EDIT_HANDLES, FEATURE_VERTICE_HANDLE_IMAGE, FEATURE_VERTICE_IMAGE, FeatureLayer, FeatureLayers, GeoJSONTextField, IntersectionSelect, LayerInfoButton, LayerInfoDialog, LayerInfoLegend, LayerInfoList, LayerInfoText, Legend, LegendButton, LegendDialog, LegendLayout, MIN_HEIGHT, MIN_WIDTH, MapContext, MapControlButton, MapControls, MapDimensionSelect, MapFeatureClass, MapMeasure, MapTime, MapWarningProperties, NEW_FEATURE_CREATED, NEW_LINESTRING_CREATED, NEW_POINT_CREATED, OpenLayersFeatureLayer, OpenLayersGetFeatureInfo, OpenLayersLayer, OpenLayersMapDraw, OpenLayersMapView, OpenLayersZoomControl, POINTER_CLICK_TOLERANCE_PX, SELECTED_FEATURE_COLOR, SELECTED_POINT_HALO_STYLE, STAC_ASSET_STYLE_PREFIX, STAC_ITEM_PAGE_LIMIT, STAC_ITEM_SEARCH_FIELDS_CONFORMANCE, STAC_TEMPORAL_STEP_SAMPLE_LIMIT, SelectField, StoryLayoutGrid, TRANSIENT_FEATURE_PROPERTIES, TimeAwareEDRLocationLayer, TimeAwareGeoTIFFLayer, TimeAwareWMTSLayer, TimeContext, TimeawareImageSource, TimeawareImageSourceWMSLayer, WEBMAP_REACT_NAMESPACE, WMSLayer, WMTSLayer, XYZLayer, ZoomControls, addFeatureProperties, addGeoJSONProperties, addSelectionTypeToGeoJSON, asNewFeature, basicExampleDrawOptions, basicExampleMultipleShapeDrawOptions, basicExampleMultipleShapeWithValuesDrawOptions, basicExampleSharedVertexDrawOptions, calculateBoxSelection, calculateNewSelection, catmullRomSpline, clearImageCacheForAllMaps, colorMaps, connectSharedVertices, createBoxBasedOnModifiedVertex, createIconStyle, createInterSections, createModifyFeatures, createMoveFeatures, createOval, currentlySupportedDrawModes, defaultBox, defaultCircle, defaultDelete, defaultEdrStyles, defaultFreehandLine, defaultGeoJSONStyleProperties, defaultIntersectionStyleProperties, defaultLayers, defaultLineString, defaultLocation, defaultModes, defaultOval, defaultPoint, defaultPolygon, defaultRotatableBox, defaultSmoothLine, defaultSplit, defaultSquare, defaultTimeFormat, dimensionConfig, drawPolyStoryStyles, drawStyles, emptyGeoJSON, endToolExampleConfig, exampleIntersectionOptions, exampleIntersectionWithShapeOptions, exampleIntersections, exampleIntersectionsMultiDrawTool, featureMultiPoint, featurePoint, featurePolygon, fetchEDRArea, fetchEDRCollectionDetails, fetchEDRCube, fetchEDRJson, fetchEDRParameter, fetchStacCatalogCollections, fetchStacCatalogRoot, fetchStacCollection, fetchStacItem, fetchStacItems, fetchStacItemsPage, fetchStacItemsWithPagination, fillOptions, firSelectionType, formatTime, generateImageFromLegend, genericOpenLayersFeatureStyle, geowebColorToOpenLayersColor, getAffectedIndices, getBoxRotateHandlePoints, getBoxSelectPreviewStyle, getDimensionIcon, getDimensionLabel, getDimensionValue, getDimensionsList, getDoubleControlToolIcon, getDrawModeIdFromSelectionType, getFeatureCollection, getFeatureExtent, getFeaturePointStyle, getFirTitle, getGeoJSONPropertyValue, getGeoJson, getIcon, getIntersectionToolIcon, getIsInsideAcceptanceTime, getLastEmptyFeatureIndex, getLayerBbox, getLayerExtentForProjection, getLayerStyles, getLayerUpdateInfo, getLegendClass, getOlFeatureKey, getProj4, getRendersAsStyles, getStacAssetKeyFromStyle, getStacAssetStyles, getStacCollectionStyles, getStacFrameItemsToRender, getStacItemLookupWindowForTimes, getStacItemSearchUrl, getStacItemsUrl, getTimeDimension, getToolIcon, handleResponse, hasEditableVertices, initializeOpenLayersProjections, inlineFeatureStyle, intersectPointGeoJSONS, intersectPolygonGeoJSONS, intersectionFeatureBE, intersectionFeatureNL, isBrowserReadableGeoTIFFAsset, isClickFromDrag, isDefaultModifiable, isDefaultMovable, isGeoJSONFeatureCreatedByTool, isGeoJSONGeometryEmpty, isGeoTIFFAsset, isPointFeatureCollection, joinUrlParams, keepIdentityOnFirstSplitFeature, labelOptions, lineString, lineStringCollection, makeFeatureStyleDisc, makeFeatureStyleLoading, makeFeatureStyleMultiParam, makeFeatureStyleMultiParamLoading, makeFeatureStyleWind, makeLegendFromColorMap, makeLegendFromStyleName, makeTimeList, makeView, marksByDimension, measureResultStyle, measureToolStyle, modifyHandleStyle$1 as modifyHandleStyle, modifyStyles, moveFeature, multiLineStringLabelStyle, multiPolygonLabelStyle, normalizeEDRLabel, opacityOptions, openLayersGetMapImageStore, polygonCleanDangling, polygonCleanDanglingCoords, polygonFeatureCollectionCleanDangling, precipitationMMLegendColorsWoW, projectorCache, publicLayers, publicServices, removeFeatureProperties, removeOverlappingLines, removeTransientFeatureProperties, resolvePreferredStyleName$1 as resolvePreferredStyleName, resolveStacAssetKey, rewindGeometry, roundCoordinates, roundFeatureCoordinates, selectPreferredWMSProjection, selectPreferredWMTSTileMatrixSet, setMapCenter, setViewFromExtent, setViewFromFeature, shouldEnterEditMode, shouldExitEditModeForMultiSelect, simpleBoxGeoJSON, simpleBoxGeoJSONWrongOrder, simpleFlightRouteLineStringGeoJSON, simpleFlightRoutePointsGeoJSON, simpleGeometryCollectionGeoJSON, simpleLineStringGeoJSON, simpleMultiPolygon, simplePointsGeojson, simplePolygonGeoJSON, simpleSmallLineStringGeoJSON, splitLine, splitPolygon, splitStyle, stacCatalogCollectionToLayerProps, stacColormapToOlStyle, stacGrayscaleOlStyle, stacNormalizedGrayscaleOlStyle, startToolExampleConfig, strokeWidthOptions, styleNameToStyleLike, temperatureLegendColorsCWK, temperatureLegendColorsWoW, textLabelStyle, textStyle, textStyleWithMargin, toMovedFeatures, updateEditModeButtonsWithFir, useAnimationForLayer, useEDRGetCollectionDetails, useEDRGetParameterData, useEDRWMLayer, useGeoJSON, useGetWMLayerInstance, useGetWMSLayerStyleList, useIconStyle, useMapDrawTool, useModifyFeatures, useMoveFeatures, useProjection, useQueryGetWMSGetCapabilities, useQueryGetWMSLayer, useQueryGetWMSLayers, useQueryGetWMSLayersTree, useQueryGetWMSServiceInfo, useQueryWMTSGetCapabilities, useSetIntervalWhenVisible, useStacCatalogRoot, useStacCollection, useStacItems, useStacOverviewItems, useStacTemporalStepItems, useViewFromLayer, viewUtils, webmapEDRQueryOptions, webmapReactTranslations };

package/dist/src/lib/components/OpenLayers/draw/OpenLayersMapDraw.d.ts

@@ -16,6 +16,8 @@ export interface OpenLayersMapDrawProps {
     updateGeojson?: (geoJson: GeoJSON.FeatureCollection, text: string) => void;
     onViewOnlyFeatureClick?: (feature: Feature<Geometry>[], isShiftClick?: boolean) => void;
     onNoFeatureClick?: () => void;
+    /** Called after the map handled Escape in edit or draw mode */
+    onEscape?: () => void;
     boxSelect?: BoxSelect;
 }
 /**

package/dist/src/lib/components/OpenLayers/layers/OpenLayersLayer.d.ts

@@ -16,5 +16,6 @@ export interface OpenLayersLayerProps extends LayerFoundation {
     onClickFeature?: (event?: FeatureEvent) => void;
     onHoverFeature?: (event: FeatureEvent) => void;
     tileServerSettings?: TileServerSettings;
+    extentRatio?: number;
 }
 export declare const OpenLayersLayer: (layerProps: OpenLayersLayerProps) => React.ReactElement | null;

package/dist/src/lib/components/OpenLayers/layers/TimeawareImageSourceWMSLayer.d.ts

@@ -13,6 +13,7 @@ interface TimeawareImageSourceWMSLayerProps {
     onLayerReady?: (layerId: string) => void;
     onLayerError?: (layerId: string, message: string) => void;
     debugMode?: boolean;
+    extentRatio?: number;
 }
 export declare const TimeawareImageSourceWMSLayer: React.FC<TimeawareImageSourceWMSLayerProps>;
 export {};

package/dist/src/lib/components/OpenLayers/layers/WMTSLayer.d.ts

@@ -3,7 +3,6 @@ import type { LayerFoundation } from '@opengeoweb/webmap';
 export interface WMTSLayerProps {
     getCapsURL: string;
     layerName: string;
-    tileMatrixSet: string;
     layerOptions: ConstructorParameters<typeof TileLayer>[0];
     layerProps?: LayerFoundation;
 }

package/dist/src/lib/components/OpenLayers/layers/fakeApiWmtsQueries.d.ts

@@ -1 +1,2 @@
+export declare const createWMTSCapabilities: (codes: string[]) => string;
 export declare const fakeWMTSLayerApiHandlers: import("msw").HttpHandler[];

package/dist/src/lib/components/OpenLayers/utils/TimeAwareImageWrapper.d.ts

@@ -31,9 +31,11 @@ declare class TimeAwareImageWrapper extends ImageWrapper {
     private _resolvers;
     private _styleName;
     private _layerName;
+    private _extentRatio;
     private _compositeImageKey;
     private _compositeImage;
     constructor(extent: Extent, resolution: number, pixelRatio: number);
+    setExtentRatio(extentRatio: number): void;
     getWMSGetMapRequestURL(extentToLoad: Extent, resolutionToLoad: number, __pixelRatio: number, projection: Projection | null, getMapUrl: string | null, params: Record<string, string>, layerName: string | null, styleName: string, dimProps: Record<string, string>): TimeAwareGeoreferencedImageSrc;
     getAlternativeImage(extent: Extent, resolution: number, pixelRatio: number, projection: Projection, getMapUrl: string, params: Record<string, string>, layerName: string, styleName: string, dimsProps: Record<string, string>): TimeAwareGeoreferencedImage | false;
     hasImage(extent: Extent, resolution: number, pixelRatio: number, projection: Projection, getMapUrl: string, params: Record<string, string>, layerName: string, styleName: string, dimsProps: Record<string, string>): TimeAwareGeoreferencedImage | false;

package/dist/src/lib/components/OpenLayers/utils/TimeawareImageSource.d.ts

@@ -14,6 +14,7 @@ interface TimeawareImageSourceOptions {
     styleName?: string | undefined;
     timeStampsToPrefetch?: string[];
     visible?: boolean;
+    extentRatio?: number;
 }
 export declare class TimeawareImageSource extends ImageSource {
     private _wmsUrl;
@@ -39,7 +40,8 @@ export declare class TimeawareImageSource extends ImageSource {
     private throttledImageLoad;
     private _layerId;
     private _failedImageRetryTimer;
-    constructor({ wmsUrl, timeStampsToPrefetch, layerName, layerId, styleName, dimProps, params, visible, }: TimeawareImageSourceOptions);
+    private _extentRatio;
+    constructor({ wmsUrl, timeStampsToPrefetch, layerName, layerId, styleName, dimProps, params, visible, extentRatio, }: TimeawareImageSourceOptions);
     private _conditionalPrefetch;
     private _loadImagery;
     private prefetch;

package/dist/src/lib/components/OpenLayers/utils/projections.d.ts

@@ -13,4 +13,31 @@ export declare const initializeOpenLayersProjections: () => void;
  * @returns
  */
 export declare const selectPreferredWMSProjection: (viewSrs: string, layerProps: LayerProps | null) => string;
+interface WMTSCapabilitiesContents {
+    Contents?: {
+        Layer?: {
+            Identifier: string;
+            TileMatrixSetLink?: {
+                TileMatrixSet: string;
+            }[];
+        }[];
+        TileMatrixSet?: {
+            Identifier: string;
+            SupportedCRS?: string;
+            TileMatrix?: unknown[];
+        }[];
+    };
+}
+/**
+ * Returns the identifier of a linked tile matrix set whose CRS matches the view SRS.
+ * The view SRS is preferred; if it has no match, configured WMProj4Defs are checked
+ * in order. Matrix sets without a known CRS or tiles are ignored.
+ *
+ * @param capabilities WMTS capabilities to search.
+ * @param layerName Identifier of the layer to search.
+ * @param viewSrs Projection code of the current map view.
+ * @returns The matching tile matrix set identifier, or null if no match is available.
+ */
+export declare const selectPreferredWMTSTileMatrixSet: (capabilities: WMTSCapabilitiesContents | null, layerName: string, viewSrs: string | undefined) => string | null;
 export declare const useProjection: () => string | undefined;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@opengeoweb/webmap-react",
-    "version": "20.1.0",
+    "version": "20.2.0",
     "description": "GeoWeb react wrapper for webmap",
     "license": "Apache-2.0",
     "repository": {
@@ -20,9 +20,9 @@
         }
     },
     "dependencies": {
-        "@opengeoweb/webmap": "20.1.0",
-        "@opengeoweb/theme": "20.1.0",
-        "@opengeoweb/shared": "20.1.0",
+        "@opengeoweb/webmap": "20.2.0",
+        "@opengeoweb/theme": "20.2.0",
+        "@opengeoweb/shared": "20.2.0",
         "lodash": "^4.18.1",
         "ol": "^10.4.0",
         "proj4": "^2.9.2",