@opengeoweb/store 12.12.0 → 13.0.0

package/index.esm.js

@@ -1,8 +1,8 @@
 import { createSlice, createSelector, createAction, createListenerMiddleware, isAnyOf, createEntityAdapter, combineReducers, configureStore } from '@reduxjs/toolkit';
 import { isEqual, isEmpty, compact } from 'lodash';
 import { dateUtils, PROJECTION, defaultDelay } from '@opengeoweb/shared';
-import { webmapUtils, parseISO8601IntervalToDateInterval, LayerType, webmapTestSettings, WMLayer, getWMLayerById, WMInvalidDateValues, handleDateUtilsISOString, isProjectionSupported, queryWMSLayers } from '@opengeoweb/webmap';
-import { defaultSecondsPerPx, defaultAnimationDelayAtStart, defaultTimeStep, defaultTimeSpan, roundWithTimeStep, getSpeedDelay } from '@opengeoweb/timeslider';
+import { webmapUtils, parseISO8601IntervalToDateInterval, LayerType, handleDateUtilsISOString, webmapTestSettings, WMLayer, getWMLayerById, WMInvalidDateValues, isProjectionSupported, queryWMSLayers } from '@opengeoweb/webmap';
+import { secondsPerPxFromCanvasWidth, defaultTimeSpan, defaultSecondsPerPx, defaultAnimationDelayAtStart, defaultTimeStep, roundWithTimeStep, getSpeedDelay } from '@opengeoweb/time-slider';
 import { produce } from 'immer';
 import { getLastEmptyFeatureIndex, getGeoJson, moveFeature, createInterSections, defaultLayers, emptyGeoJSON, defaultIntersectionStyleProperties, addSelectionTypeToGeoJSON, getFeatureCollection } from '@opengeoweb/webmap-react';
 export { defaultLayers } from '@opengeoweb/webmap-react';
@@ -689,11 +689,24 @@ var getLayerStyles = createSelector(getLayerFromService, function (layer) {
   var _layer$styles;
   return (_layer$styles = layer === null || layer === void 0 ? void 0 : layer.styles) !== null && _layer$styles !== void 0 ? _layer$styles : [];
 }, selectorMemoizationOptions);
+/**
+ * Gets the layer title from the servicestore using the serviceUrl and layerName
+ *
+ * Example: layerStyles = getLayerTitle(store, layerService, layerName);
+ * @param {object} store store: object - store from which the layers state will be extracted
+ * @param {string}  serviceUrl serviceUrl: string - Url of the service where the layer belongs to
+ * @param {string}  layerName layerName: string - Name of the layer in the service
+ * @returns {array} returnType: string - string containing layer title
+ */
+var getLayerTitle = createSelector(getLayerFromService, function (layer) {
+  return layer === null || layer === void 0 ? void 0 : layer.title;
+}, selectorMemoizationOptions);
 
 var selectors$7 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   getLayerFromService: getLayerFromService,
   getLayerStyles: getLayerStyles,
+  getLayerTitle: getLayerTitle,
   getLayersFromServiceSelector: getLayersFromServiceSelector,
   getServiceByUrl: getServiceByUrl,
   getServiceIds: getServiceIds,
@@ -1139,6 +1152,17 @@ var parseTimeDimToISO8601Interval = function parseTimeDimToISO8601Interval(timeI
     return interval.startTime && interval.endTime && interval.duration;
   });
 };
+var produceTimeSliderTimeSpan = function produceTimeSliderTimeSpan(draft, mapId, timeSliderSpan) {
+  if (!draft.byId[mapId] || !timeSliderSpan) {
+    return;
+  }
+  draft.byId[mapId].timeSliderSpan = timeSliderSpan;
+  if (draft.byId[mapId].timeSliderWidth) {
+    draft.byId[mapId].timeSliderSecondsPerPx = secondsPerPxFromCanvasWidth(draft.byId[mapId].timeSliderWidth, draft.byId[mapId].timeSliderSpan || defaultTimeSpan);
+  } else {
+    draft.byId[mapId].timeSliderSecondsPerPx = draft.byId[mapId].timeSliderSecondsPerPx || defaultSecondsPerPx;
+  }
+};
 
 var utils$2 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -1154,7 +1178,8 @@ var utils$2 = /*#__PURE__*/Object.freeze({
   moveArrayElements: moveArrayElements,
   parseTimeDimToISO8601Interval: parseTimeDimToISO8601Interval,
   produceDraftStateSetMapDimensionFromLayerChangeDimension: produceDraftStateSetMapDimensionFromLayerChangeDimension,
-  produceDraftStateSetWebMapDimension: produceDraftStateSetWebMapDimension
+  produceDraftStateSetWebMapDimension: produceDraftStateSetWebMapDimension,
+  produceTimeSliderTimeSpan: produceTimeSliderTimeSpan
 });
 
 var replaceLayerIdsToEnsureUniqueLayerIdsInStore = function replaceLayerIdsToEnsureUniqueLayerIdsInStore(layerIds) {
@@ -1393,6 +1418,7 @@ var LayerActionOrigin;
   LayerActionOrigin["updateLayerInformationListener"] = "updateLayerInformationListener";
   LayerActionOrigin["toggleAutoUpdateListener"] = "toggleAutoUpdateListener";
   LayerActionOrigin["unregisterMapListener"] = "unregisterMapListener";
+  LayerActionOrigin["dataExplorer"] = "dataExplorer";
 })(LayerActionOrigin || (LayerActionOrigin = {}));
 
 var types$3 = /*#__PURE__*/Object.freeze({
@@ -1708,18 +1734,26 @@ var slice$6 = createSlice({
         draft.byId[layerId].name = name;
       }
     },
-    layerChangeGeojson: function layerChangeGeojson(draft, action) {
+    layerChangeOptions: function layerChangeOptions(draft, action) {
       var _action$payload9 = action.payload,
         layerId = _action$payload9.layerId,
-        geojson = _action$payload9.geojson;
+        options = _action$payload9.options;
+      if (draft.byId[layerId] && options) {
+        draft.byId[layerId].options = _objectSpread2({}, options);
+      }
+    },
+    layerChangeGeojson: function layerChangeGeojson(draft, action) {
+      var _action$payload0 = action.payload,
+        layerId = _action$payload0.layerId,
+        geojson = _action$payload0.geojson;
       if (draft.byId[layerId]) {
         draft.byId[layerId].geojson = geojson;
       }
     },
     layerSetGeojsonFromLayer: function layerSetGeojsonFromLayer(draft, action) {
-      var _action$payload0 = action.payload,
-        layerId = _action$payload0.layerId,
-        sourceLayerId = _action$payload0.sourceLayerId;
+      var _action$payload1 = action.payload,
+        layerId = _action$payload1.layerId,
+        sourceLayerId = _action$payload1.sourceLayerId;
       if (draft.byId[layerId]) {
         var _draft$byId$sourceLay;
         draft.byId[layerId].geojson = (_draft$byId$sourceLay = draft.byId[sourceLayerId]) === null || _draft$byId$sourceLay === void 0 ? void 0 : _draft$byId$sourceLay.geojson;
@@ -1753,9 +1787,9 @@ var slice$6 = createSlice({
       }
     },
     setLayers: function setLayers(draft, action) {
-      var _action$payload1 = action.payload,
-        layers = _action$payload1.layers,
-        mapId = _action$payload1.mapId;
+      var _action$payload10 = action.payload,
+        layers = _action$payload10.layers,
+        mapId = _action$payload10.mapId;
       if (!checkValidLayersPayload(layers, mapId)) {
         return;
       }
@@ -1783,9 +1817,9 @@ var slice$6 = createSlice({
       });
     },
     setBaseLayers: function setBaseLayers(draft, action) {
-      var _action$payload10 = action.payload,
-        layers = _action$payload10.layers,
-        mapId = _action$payload10.mapId;
+      var _action$payload11 = action.payload,
+        layers = _action$payload11.layers,
+        mapId = _action$payload11.mapId;
       var filtererdBaseLayers = layers.filter(function (layer) {
         return layer.layerType === LayerType.baseLayer || layer.layerType === LayerType.overLayer;
       });
@@ -1831,9 +1865,9 @@ var slice$6 = createSlice({
       }
     },
     layerSetDimensions: function layerSetDimensions(draft, action) {
-      var _action$payload11 = action.payload,
-        dimensions = _action$payload11.dimensions,
-        layerId = _action$payload11.layerId;
+      var _action$payload12 = action.payload,
+        dimensions = _action$payload12.dimensions,
+        layerId = _action$payload12.layerId;
       if (draft.byId[layerId]) {
         draft.byId[layerId].dimensions = dimensions;
       }
@@ -1867,9 +1901,9 @@ var slice$6 = createSlice({
     },
     // Overwrites all baselayer for a certain map
     setAvailableBaseLayers: function setAvailableBaseLayers(draft, action) {
-      var _action$payload12 = action.payload,
-        layers = _action$payload12.layers,
-        mapId = _action$payload12.mapId;
+      var _action$payload13 = action.payload,
+        layers = _action$payload13.layers,
+        mapId = _action$payload13.mapId;
       // remove current baselayers for passed map
       draft.availableBaseLayers.allIds = draft.availableBaseLayers.allIds.filter(function (layerId) {
         if (draft.availableBaseLayers.byId[layerId] && draft.availableBaseLayers.byId[layerId].mapId === mapId) {
@@ -1888,9 +1922,9 @@ var slice$6 = createSlice({
       });
     },
     setUseLatestReferenceTime: function setUseLatestReferenceTime(draft, action) {
-      var _action$payload13 = action.payload,
-        id = _action$payload13.id,
-        useLatestReferenceTime = _action$payload13.useLatestReferenceTime;
+      var _action$payload14 = action.payload,
+        id = _action$payload14.id,
+        useLatestReferenceTime = _action$payload14.useLatestReferenceTime;
       var layer = draft.byId[id];
       if (!layer) {
         return;
@@ -1898,10 +1932,10 @@ var slice$6 = createSlice({
       layer.useLatestReferenceTime = useLatestReferenceTime;
     },
     onUpdateLayerInformation: function onUpdateLayerInformation(draft, action) {
-      var _action$payload14 = action.payload,
-        layerStyle = _action$payload14.layerStyle,
-        layerDimensions = _action$payload14.layerDimensions,
-        error = _action$payload14.error;
+      var _action$payload15 = action.payload,
+        layerStyle = _action$payload15.layerStyle,
+        layerDimensions = _action$payload15.layerDimensions,
+        error = _action$payload15.error;
       if (error) {
         draft.byId[error.layerId].status = LayerStatus.error;
         return;
@@ -1944,6 +1978,7 @@ var slice$6 = createSlice({
             return dim.name === newLayerDimension.name;
           });
           if (existingDimension) {
+            var _newLayerDimension$va;
             if (existingDimension.name === 'reference_time' && reduxLayer.useLatestReferenceTime && newLayerDimension.maxValue) {
               existingDimension.currentValue = newLayerDimension.maxValue;
             }
@@ -1954,6 +1989,11 @@ var slice$6 = createSlice({
             if (!existingDimension.units) {
               existingDimension.units = newLayerDimension.units;
             }
+            /* For non time dimensions also update the current value, but only if the  currentValue does not exist in the new dimension values */
+            var listOfValues = (_newLayerDimension$va = newLayerDimension.values) === null || _newLayerDimension$va === void 0 ? void 0 : _newLayerDimension$va.split(',');
+            if (existingDimension.name !== 'time' && existingDimension.name !== 'reference_time' && !(listOfValues !== null && listOfValues !== void 0 && listOfValues.includes(existingDimension.currentValue))) {
+              existingDimension.currentValue = newLayerDimension.currentValue;
+            }
           } else if (layerId === layerDimensions.layerId) {
             /* Otherwise add a new one, but only for this layer. */
             reduxDimensions.push(_objectSpread2({}, newLayerDimension));
@@ -1990,25 +2030,25 @@ var slice$6 = createSlice({
     },
     // feature layer actions
     setSelectedFeature: function setSelectedFeature(draft, action) {
-      var _action$payload15 = action.payload,
-        layerId = _action$payload15.layerId,
-        selectedFeatureIndex = _action$payload15.selectedFeatureIndex;
+      var _action$payload16 = action.payload,
+        layerId = _action$payload16.layerId,
+        selectedFeatureIndex = _action$payload16.selectedFeatureIndex;
       if (!draft.byId[layerId]) {
         return;
       }
       draft.byId[layerId].selectedFeatureIndex = selectedFeatureIndex;
     },
     updateFeature: function updateFeature(draft, action) {
-      var _action$payload16 = action.payload,
-        layerId = _action$payload16.layerId,
-        geojson = _action$payload16.geojson,
-        _action$payload16$sho = _action$payload16.shouldAllowMultipleShapes,
-        shouldAllowMultipleShapes = _action$payload16$sho === void 0 ? false : _action$payload16$sho,
-        _action$payload16$rea = _action$payload16.reason,
-        reason = _action$payload16$rea === void 0 ? '' : _action$payload16$rea,
-        geoJSONIntersectionLayerId = _action$payload16.geoJSONIntersectionLayerId,
-        geoJSONIntersectionBoundsLayerId = _action$payload16.geoJSONIntersectionBoundsLayerId,
-        selectionType = _action$payload16.selectionType;
+      var _action$payload17 = action.payload,
+        layerId = _action$payload17.layerId,
+        geojson = _action$payload17.geojson,
+        _action$payload17$sho = _action$payload17.shouldAllowMultipleShapes,
+        shouldAllowMultipleShapes = _action$payload17$sho === void 0 ? false : _action$payload17$sho,
+        _action$payload17$rea = _action$payload17.reason,
+        reason = _action$payload17$rea === void 0 ? '' : _action$payload17$rea,
+        geoJSONIntersectionLayerId = _action$payload17.geoJSONIntersectionLayerId,
+        geoJSONIntersectionBoundsLayerId = _action$payload17.geoJSONIntersectionBoundsLayerId,
+        selectionType = _action$payload17.selectionType;
       var currentLayer = draft.byId[layerId];
       if (!currentLayer) {
         return;
@@ -2037,10 +2077,10 @@ var slice$6 = createSlice({
       }
     },
     updateFeatureProperties: function updateFeatureProperties(draft, action) {
-      var _action$payload17 = action.payload,
-        layerId = _action$payload17.layerId,
-        properties = _action$payload17.properties,
-        selectedFeatureIndex = _action$payload17.selectedFeatureIndex;
+      var _action$payload18 = action.payload,
+        layerId = _action$payload18.layerId,
+        properties = _action$payload18.properties,
+        selectedFeatureIndex = _action$payload18.selectedFeatureIndex;
       var currentLayer = draft.byId[layerId];
       if (!currentLayer) {
         return;
@@ -2056,10 +2096,10 @@ var slice$6 = createSlice({
       }
     },
     toggleFeatureMode: function toggleFeatureMode(draft, action) {
-      var _action$payload18 = action.payload,
-        layerId = _action$payload18.layerId,
-        isInEditMode = _action$payload18.isInEditMode,
-        drawMode = _action$payload18.drawMode;
+      var _action$payload19 = action.payload,
+        layerId = _action$payload19.layerId,
+        isInEditMode = _action$payload19.isInEditMode,
+        drawMode = _action$payload19.drawMode;
       if (!draft.byId[layerId]) {
         return;
       }
@@ -2071,10 +2111,10 @@ var slice$6 = createSlice({
       }
     },
     exitFeatureDrawMode: function exitFeatureDrawMode(draft, action) {
-      var _action$payload19 = action.payload,
-        layerId = _action$payload19.layerId,
-        shouldAllowMultipleShapes = _action$payload19.shouldAllowMultipleShapes,
-        reason = _action$payload19.reason;
+      var _action$payload20 = action.payload,
+        layerId = _action$payload20.layerId,
+        shouldAllowMultipleShapes = _action$payload20.shouldAllowMultipleShapes,
+        reason = _action$payload20.reason;
       if (!draft.byId[layerId]) {
         return;
       }
@@ -2099,9 +2139,9 @@ var slice$6 = createSlice({
     },
     // layer info actions
     showLayerInfo: function showLayerInfo(draft, action) {
-      var _action$payload20 = action.payload,
-        serviceUrl = _action$payload20.serviceUrl,
-        layerName = _action$payload20.layerName;
+      var _action$payload21 = action.payload,
+        serviceUrl = _action$payload21.serviceUrl,
+        layerName = _action$payload21.layerName;
       draft.activeLayerInfo = {
         serviceUrl: serviceUrl,
         layerName: layerName
@@ -2113,9 +2153,9 @@ var slice$6 = createSlice({
   },
   extraReducers: function extraReducers(builder) {
     builder.addCase(setTimeSync, function (draft, action) {
-      var _action$payload21 = action.payload,
-        targetsFromAction = _action$payload21.targets,
-        source = _action$payload21.source;
+      var _action$payload22 = action.payload,
+        targetsFromAction = _action$payload22.targets,
+        source = _action$payload22.source;
       /* Because we want backwards compatibility with the previous code, we also need to listen to the original source action */
       var targets = [];
       if (source) {
@@ -2129,11 +2169,14 @@ var slice$6 = createSlice({
       targets.forEach(function (payload) {
         var targetId = payload.targetId,
           value = payload.value;
-        var dimension = {
-          name: 'time',
-          currentValue: value
-        };
-        produceDraftStateForAllLayersForDimensionWithinMap(draft, dimension, targetId, null);
+        if (value !== null && value !== void 0 && value.currentTime) {
+          var currentTime = value.currentTime;
+          var dimension = {
+            name: 'time',
+            currentValue: currentTime
+          };
+          produceDraftStateForAllLayersForDimensionWithinMap(draft, dimension, targetId, null);
+        }
       });
     }).addCase(setLayerActionSync, function (draft, action) {
       /*
@@ -2142,9 +2185,9 @@ var slice$6 = createSlice({
        * These targets can be used as payloads in new Layer actions.
        * These actions are here handled via the layer reducer, as it is the same logic
        */
-      var _action$payload22 = action.payload,
-        targets = _action$payload22.targets,
-        source = _action$payload22.source;
+      var _action$payload23 = action.payload,
+        targets = _action$payload23.targets,
+        source = _action$payload23.source;
       return targets.reduce(function (prevState, target) {
         var actionType = (source === null || source === void 0 ? void 0 : source.type) || 'GENERIC_SYNC_SETLAYERACTIONS';
         var action = {
@@ -2435,10 +2478,7 @@ var slice$4 = createSlice({
       var _action$payload4 = action.payload,
         mapId = _action$payload4.mapId,
         timeSliderSpan = _action$payload4.timeSliderSpan;
-      if (!draft.byId[mapId]) {
-        return;
-      }
-      draft.byId[mapId].timeSliderSpan = timeSliderSpan;
+      produceTimeSliderTimeSpan(draft, mapId, timeSliderSpan);
     },
     setTimeStep: function setTimeStep(draft, action) {
       var _action$payload5 = action.payload,
@@ -2537,6 +2577,7 @@ var slice$4 = createSlice({
         return;
       }
       draft.byId[mapId].timeSliderWidth = timeSliderWidth;
+      draft.byId[mapId].timeSliderSecondsPerPx = secondsPerPxFromCanvasWidth(timeSliderWidth, draft.byId[mapId].timeSliderSpan || defaultTimeSpan);
     },
     setTimeSliderCenterTime: function setTimeSliderCenterTime(draft, action) {
       var _action$payload12 = action.payload,
@@ -2547,118 +2588,109 @@ var slice$4 = createSlice({
       }
       draft.byId[mapId].timeSliderCenterTime = timeSliderCenterTime;
     },
-    setTimeSliderSecondsPerPx: function setTimeSliderSecondsPerPx(draft, action) {
+    toggleAutoUpdate: function toggleAutoUpdate(draft, action) {
       var _action$payload13 = action.payload,
         mapId = _action$payload13.mapId,
-        timeSliderSecondsPerPx = _action$payload13.timeSliderSecondsPerPx;
-      if (!draft.byId[mapId]) {
-        return;
-      }
-      draft.byId[mapId].timeSliderSecondsPerPx = timeSliderSecondsPerPx;
-    },
-    toggleAutoUpdate: function toggleAutoUpdate(draft, action) {
-      var _action$payload14 = action.payload,
-        mapId = _action$payload14.mapId,
-        shouldAutoUpdate = _action$payload14.shouldAutoUpdate;
+        shouldAutoUpdate = _action$payload13.shouldAutoUpdate;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].isAutoUpdating = shouldAutoUpdate;
     },
     setEndTimeOverriding: function setEndTimeOverriding(draft, action) {
-      var _action$payload15 = action.payload,
-        mapId = _action$payload15.mapId,
-        shouldEndtimeOverride = _action$payload15.shouldEndtimeOverride;
+      var _action$payload14 = action.payload,
+        mapId = _action$payload14.mapId,
+        shouldEndtimeOverride = _action$payload14.shouldEndtimeOverride;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].shouldEndtimeOverride = shouldEndtimeOverride;
     },
     toggleTimestepAuto: function toggleTimestepAuto(draft, action) {
-      var _action$payload16 = action.payload,
-        mapId = _action$payload16.mapId,
-        timestepAuto = _action$payload16.timestepAuto;
+      var _action$payload15 = action.payload,
+        mapId = _action$payload15.mapId,
+        timestepAuto = _action$payload15.timestepAuto;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].isTimestepAuto = timestepAuto;
     },
     toggleTimeSpanAuto: function toggleTimeSpanAuto(draft, action) {
-      var _action$payload17 = action.payload,
-        mapId = _action$payload17.mapId,
-        timeSpanAuto = _action$payload17.timeSpanAuto;
+      var _action$payload16 = action.payload,
+        mapId = _action$payload16.mapId,
+        timeSpanAuto = _action$payload16.timeSpanAuto;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].isTimeSpanAuto = timeSpanAuto;
     },
     toggleAnimationLengthAuto: function toggleAnimationLengthAuto(draft, action) {
-      var _action$payload18 = action.payload,
-        mapId = _action$payload18.mapId,
-        autoAnimationLength = _action$payload18.autoAnimationLength;
+      var _action$payload17 = action.payload,
+        mapId = _action$payload17.mapId,
+        autoAnimationLength = _action$payload17.autoAnimationLength;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].isAnimationLengthAuto = autoAnimationLength;
     },
     toggleTimeSliderHover: function toggleTimeSliderHover(draft, action) {
-      var _action$payload19 = action.payload,
-        mapId = _action$payload19.mapId,
-        isTimeSliderHoverOn = _action$payload19.isTimeSliderHoverOn;
+      var _action$payload18 = action.payload,
+        mapId = _action$payload18.mapId,
+        isTimeSliderHoverOn = _action$payload18.isTimeSliderHoverOn;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].isTimeSliderHoverOn = isTimeSliderHoverOn;
     },
     toggleTimeSliderIsVisible: function toggleTimeSliderIsVisible(draft, action) {
-      var _action$payload20 = action.payload,
-        mapId = _action$payload20.mapId,
-        isTimeSliderVisible = _action$payload20.isTimeSliderVisible;
+      var _action$payload19 = action.payload,
+        mapId = _action$payload19.mapId,
+        isTimeSliderVisible = _action$payload19.isTimeSliderVisible;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].isTimeSliderVisible = isTimeSliderVisible;
     },
     toggleZoomControls: function toggleZoomControls(draft, action) {
-      var _action$payload21 = action.payload,
-        mapId = _action$payload21.mapId,
-        shouldShowZoomControls = _action$payload21.shouldShowZoomControls;
+      var _action$payload20 = action.payload,
+        mapId = _action$payload20.mapId,
+        shouldShowZoomControls = _action$payload20.shouldShowZoomControls;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].shouldShowZoomControls = shouldShowZoomControls;
     },
     setMapPinLocation: function setMapPinLocation(draft, action) {
-      var _action$payload22 = action.payload,
-        mapId = _action$payload22.mapId,
-        mapPinLocation = _action$payload22.mapPinLocation;
+      var _action$payload21 = action.payload,
+        mapId = _action$payload21.mapId,
+        mapPinLocation = _action$payload21.mapPinLocation;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].mapPinLocation = mapPinLocation;
     },
     setDisableMapPin: function setDisableMapPin(draft, action) {
-      var _action$payload23 = action.payload,
-        mapId = _action$payload23.mapId,
-        disableMapPin = _action$payload23.disableMapPin;
+      var _action$payload22 = action.payload,
+        mapId = _action$payload22.mapId,
+        disableMapPin = _action$payload22.disableMapPin;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].disableMapPin = disableMapPin;
     },
     toggleMapPinIsVisible: function toggleMapPinIsVisible(draft, action) {
-      var _action$payload24 = action.payload,
-        mapId = _action$payload24.mapId,
-        displayMapPin = _action$payload24.displayMapPin;
+      var _action$payload23 = action.payload,
+        mapId = _action$payload23.mapId,
+        displayMapPin = _action$payload23.displayMapPin;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].displayMapPin = displayMapPin;
     },
     setDockedLayerManagerSize: function setDockedLayerManagerSize(draft, action) {
-      var _action$payload25 = action.payload,
-        mapId = _action$payload25.mapId,
-        dockedLayerManagerSize = _action$payload25.dockedLayerManagerSize;
+      var _action$payload24 = action.payload,
+        mapId = _action$payload24.mapId,
+        dockedLayerManagerSize = _action$payload24.dockedLayerManagerSize;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2673,9 +2705,9 @@ var slice$4 = createSlice({
       draft.defaultMapSettings = action.payload.preset;
     },
     changeOverlayer: function changeOverlayer(draft, action) {
-      var _action$payload26 = action.payload,
-        mapId = _action$payload26.mapId,
-        selectedOverlayer = _action$payload26.selectedOverlayer;
+      var _action$payload25 = action.payload,
+        mapId = _action$payload25.mapId,
+        selectedOverlayer = _action$payload25.selectedOverlayer;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2684,10 +2716,10 @@ var slice$4 = createSlice({
   },
   extraReducers: function extraReducers(builder) {
     builder.addCase(layerActions.addLayer, function (draft, action) {
-      var _action$payload27 = action.payload,
-        layerId = _action$payload27.layerId,
-        mapId = _action$payload27.mapId,
-        layer = _action$payload27.layer;
+      var _action$payload26 = action.payload,
+        layerId = _action$payload26.layerId,
+        mapId = _action$payload26.mapId,
+        layer = _action$payload26.layer;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2706,9 +2738,9 @@ var slice$4 = createSlice({
         draft.byId[mapId].mapLayers.unshift(layerId);
       }
     }).addCase(layerActions.duplicateMapLayer, function (draft, action) {
-      var _action$payload28 = action.payload,
-        newLayerId = _action$payload28.newLayerId,
-        mapId = _action$payload28.mapId;
+      var _action$payload27 = action.payload,
+        newLayerId = _action$payload27.newLayerId,
+        mapId = _action$payload27.mapId;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2718,10 +2750,10 @@ var slice$4 = createSlice({
       }
       draft.byId[mapId].mapLayers.unshift(newLayerId);
     }).addCase(layerActions.addBaseLayer, function (draft, action) {
-      var _action$payload29 = action.payload,
-        layer = _action$payload29.layer,
-        layerId = _action$payload29.layerId,
-        mapId = _action$payload29.mapId;
+      var _action$payload28 = action.payload,
+        layer = _action$payload28.layer,
+        layerId = _action$payload28.layerId,
+        mapId = _action$payload28.mapId;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2751,9 +2783,9 @@ var slice$4 = createSlice({
         draft.byId[mapId].autoTimeStepLayerId = activeLayerId;
       }
     }).addCase(layerActions.setBaseLayers, function (draft, action) {
-      var _action$payload30 = action.payload,
-        layers = _action$payload30.layers,
-        mapId = _action$payload30.mapId;
+      var _action$payload29 = action.payload,
+        layers = _action$payload29.layers,
+        mapId = _action$payload29.mapId;
       // Split into base and overlayers
       var baseLayers = [];
       var overLayers = [];
@@ -2783,9 +2815,9 @@ var slice$4 = createSlice({
         }
       }
     }).addCase(layerActions.layerDelete, function (draft, action) {
-      var _action$payload31 = action.payload,
-        mapId = _action$payload31.mapId,
-        layerId = _action$payload31.layerId;
+      var _action$payload30 = action.payload,
+        mapId = _action$payload30.mapId,
+        layerId = _action$payload30.layerId;
       var map = draft.byId[mapId];
       if (!map) {
         return;
@@ -2811,9 +2843,9 @@ var slice$4 = createSlice({
         return id !== layerId;
       });
     }).addCase(layerActions.baseLayerDelete, function (draft, action) {
-      var _action$payload32 = action.payload,
-        mapId = _action$payload32.mapId,
-        layerId = _action$payload32.layerId;
+      var _action$payload31 = action.payload,
+        mapId = _action$payload31.mapId,
+        layerId = _action$payload31.layerId;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2824,14 +2856,14 @@ var slice$4 = createSlice({
         return id !== layerId;
       });
     }).addCase(layerActions.layerChangeDimension, function (draft, action) {
-      var _action$payload33 = action.payload,
-        layerId = _action$payload33.layerId,
-        dimension = _action$payload33.dimension;
+      var _action$payload32 = action.payload,
+        layerId = _action$payload32.layerId,
+        dimension = _action$payload32.dimension;
       produceDraftStateSetMapDimensionFromLayerChangeDimension(draft, layerId, dimension);
     }).addCase(setTimeSync, function (draft, action) {
-      var _action$payload34 = action.payload,
-        targetsFromAction = _action$payload34.targets,
-        source = _action$payload34.source;
+      var _action$payload33 = action.payload,
+        targetsFromAction = _action$payload33.targets,
+        source = _action$payload33.source;
       /* Because we want backwards compatibility with the previous code, we also need to listen to the original source action */
       var targets = [];
       if (source) {
@@ -2846,18 +2878,47 @@ var slice$4 = createSlice({
         var targetId = target.targetId,
           value = target.value;
         if (draft.byId[targetId]) {
-          var dimension = {
-            name: 'time',
-            currentValue: value
-          };
-          produceDraftStateSetWebMapDimension(draft, targetId, dimension, true);
-          produceDraftStateSetMapDimensionFromLayerChangeDimension(draft, targetId, dimension);
+          // SetTimeSliderSpan
+          if (value !== null && value !== void 0 && value.timeSliderSpan) {
+            produceTimeSliderTimeSpan(draft, targetId, value.timeSliderSpan);
+          }
+          // SetTimeSliderCenterTime
+          if (value !== null && value !== void 0 && value.timeSliderCenterTime) {
+            draft.byId[targetId].timeSliderCenterTime = value.timeSliderCenterTime;
+          }
+          // SetTimeSliderStep
+          if (value !== null && value !== void 0 && value.timeSliderStep) {
+            draft.byId[targetId].timeStep = value.timeSliderStep;
+            // When timestep is synced between slider, isTimestepAuto should be set to false.
+            draft.byId[targetId].isTimestepAuto = false;
+          }
+          // SetAnimationStartTime
+          if (value !== null && value !== void 0 && value.timeSliderAnimationStartTime) {
+            draft.byId[targetId].animationStartTime = value.timeSliderAnimationStartTime;
+          }
+          // SetAnimationEndTime
+          if (value !== null && value !== void 0 && value.timeSliderAnimationEndTime) {
+            draft.byId[targetId].animationEndTime = value.timeSliderAnimationEndTime;
+          }
+          // SetAnimationDelay
+          if (value !== null && value !== void 0 && value.timeSliderAnimationDelay) {
+            draft.byId[targetId].animationDelay = value.timeSliderAnimationDelay;
+          }
+          // SetTime / update actual current value
+          if (value !== null && value !== void 0 && value.currentTime) {
+            var dimension = {
+              name: 'time',
+              currentValue: value.currentTime
+            };
+            produceDraftStateSetWebMapDimension(draft, targetId, dimension, true);
+            produceDraftStateSetMapDimensionFromLayerChangeDimension(draft, targetId, dimension);
+          }
         }
       });
     }).addCase(setBboxSync, function (draft, action) {
-      var _action$payload35 = action.payload,
-        targetsFromAction = _action$payload35.targets,
-        source = _action$payload35.source;
+      var _action$payload34 = action.payload,
+        targetsFromAction = _action$payload34.targets,
+        source = _action$payload34.source;
       /* Because we want backwards compatibility with the previous code, we also need to listen to the original source action */
       var targets = [];
       if (source) {
@@ -2889,9 +2950,9 @@ var slice$4 = createSlice({
        * These targets can be used as payloads in new Layer actions.
        * These actions are here handled via the layer reducer, as it is the same logic
        */
-      var _action$payload36 = action.payload,
-        targets = _action$payload36.targets,
-        source = _action$payload36.source;
+      var _action$payload35 = action.payload,
+        targets = _action$payload35.targets,
+        source = _action$payload35.source;
       return targets.reduce(function (prevState, target) {
         var actionType = (source === null || source === void 0 ? void 0 : source.type) || 'GENERIC_SYNC_SETLAYERACTIONS';
         var action = {
@@ -2913,9 +2974,9 @@ var slice$4 = createSlice({
       });
       return draft;
     }).addCase(mapChangeDimension, function (draft, action) {
-      var _action$payload37 = action.payload,
-        mapId = _action$payload37.mapId,
-        dimensionFromAction = _action$payload37.dimension;
+      var _action$payload36 = action.payload,
+        mapId = _action$payload36.mapId,
+        dimensionFromAction = _action$payload36.dimension;
       produceDraftStateSetWebMapDimension(draft, mapId, dimensionFromAction, true);
     }).addCase(setMapPreset, function (draft, action) {
       var mapId = action.payload.mapId;
@@ -2935,9 +2996,9 @@ var slice$4 = createSlice({
       draft.byId[mapId].animationDelay = defaultAnimationDelayAtStart;
       draft.byId[mapId].dockedLayerManagerSize = '';
     }).addCase(uiActions.registerDialog, function (draft, action) {
-      var _action$payload38 = action.payload,
-        mapId = _action$payload38.mapId,
-        type = _action$payload38.type;
+      var _action$payload37 = action.payload,
+        mapId = _action$payload37.mapId,
+        type = _action$payload37.type;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -3187,8 +3248,13 @@ var getLayerEnabled = createSelector(getLayerById, function (layer) {
  * @returns {string} returnType: string -  layer name
  */
 var getLayerName = createSelector(getLayerById, function (layer) {
-  var _layer$name;
-  return (_layer$name = layer === null || layer === void 0 ? void 0 : layer.name) !== null && _layer$name !== void 0 ? _layer$name : '';
+  if (!layer) {
+    return '';
+  }
+  if (layer.layerType === LayerType.edrFeatureLayer && layer.options && layer.options.parameterNames.length) {
+    return layer.options.parameterNames[0];
+  }
+  return (layer === null || layer === void 0 ? void 0 : layer.name) || '';
 }, selectorMemoizationOptions);
 /**
  * Gets layer service
@@ -3371,6 +3437,13 @@ var getTimeStepForLayerId = createSelector(getLayerTimeDimension, function (time
 var getActiveLayerInfo = createSelector(layerStore, function (store) {
   return store === null || store === void 0 ? void 0 : store.activeLayerInfo;
 });
+var getLayerType = createSelector(getLayerById, function (layer) {
+  var _layer$layerType;
+  return (_layer$layerType = layer === null || layer === void 0 ? void 0 : layer.layerType) !== null && _layer$layerType !== void 0 ? _layer$layerType : 'mapLayer';
+}, selectorMemoizationOptions);
+var getLayerOptions = createSelector(getLayerById, function (layer) {
+  return layer === null || layer === void 0 ? void 0 : layer.options;
+}, selectorMemoizationOptions);
 /**
  * Gets all overlayers for a given mapId
  * Example: overlayers = getOverlayersForMapId(store, 'mapId123')
@@ -3392,6 +3465,47 @@ var getOverlayersForMapId = createSelector([layerStore, function (_store, mapId)
   });
   return overLayers;
 }, selectorMemoizationOptions);
+/**
+ * Gets the layer title from the service store using the layerId
+ *
+ * Example: layerTitle = getLayerTitleFromService(store, 'layerId_1')
+ * @param {object} store store: object - object from which the layers state will be extracted
+ * @param {string} layerId layerId: string - Id of the layer
+ * @returns {string} returnType: string - string containing layer title
+ */
+var getLayerTitleFromService = createSelector(function (store) {
+  return store;
+}, getLayerService, getLayerName, function (store, service, name) {
+  return getLayerTitle(store, service, name);
+}, selectorMemoizationOptions);
+/**
+ * Gets layer displayname. For EDR layers with multiple parameters, the collectionId is used as displayname. Otherwise the layer title from the service is used.
+ *
+ * Example: layerName = getLayerDisplayName(store, 'layerId_1')
+ * @param {object} store store: object - object from which the layers state will be extracted
+ * @param {string} layerId layerId: string - Id of the layer
+ * @returns {string} returnType: string -  layer displayname
+ */
+var getLayerDisplayName = createSelector(getLayerType, getLayerOptions, getLayerTitleFromService, getLayerName, function (layerType, layerOptions, layerTitle, layerName) {
+  if (layerType === LayerType.edrFeatureLayer && layerOptions) {
+    return (layerOptions === null || layerOptions === void 0 ? void 0 : layerOptions.parameterNames.length) > 1 && layerOptions.collectionId ? layerOptions.collectionId : layerTitle || layerName;
+  }
+  return layerTitle || layerName;
+}, selectorMemoizationOptions);
+/**
+ * Gets the layer missing status. A layer is missing if it is not found in the service store or if its status is 'error'.
+ *
+ * Example: isLayerMissing = getIsLayerMissing(store, 'layerId_1')
+ * @param {object} store store: object - object from which the layers state will be extracted
+ * @param {string} layerId layerId: string - Id of the layer
+ * @returns {boolean} returnType: boolean - true if layer is missing
+ */
+var getIsLayerMissing = createSelector(function (store) {
+  return store;
+}, getLayerService, getLayerName, getLayerStatus, function (store, service, name, status) {
+  var layer = getLayerFromService(store, service, name);
+  return !layer || status === LayerStatus.error;
+}, selectorMemoizationOptions);
 
 var selectors$6 = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -3406,22 +3520,27 @@ var selectors$6 = /*#__PURE__*/Object.freeze({
   getFeatureLayers: getFeatureLayers,
   getHasFeatureLayerGeoJSON: getHasFeatureLayerGeoJSON,
   getIsLayerInEditMode: getIsLayerInEditMode,
+  getIsLayerMissing: getIsLayerMissing,
   getIsLayerPresent: getIsLayerPresent,
   getLayerById: getLayerById,
   getLayerByIdWithoutTimeDimension: getLayerByIdWithoutTimeDimension,
   getLayerCurrentTime: getLayerCurrentTime,
   getLayerDimension: getLayerDimension,
   getLayerDimensions: getLayerDimensions,
+  getLayerDisplayName: getLayerDisplayName,
   getLayerEnabled: getLayerEnabled,
   getLayerHasTimeDimension: getLayerHasTimeDimension,
   getLayerIsInsideAcceptanceTime: getLayerIsInsideAcceptanceTime,
   getLayerName: getLayerName,
   getLayerNonTimeDimensions: getLayerNonTimeDimensions,
   getLayerOpacity: getLayerOpacity,
+  getLayerOptions: getLayerOptions,
   getLayerService: getLayerService,
   getLayerStatus: getLayerStatus,
   getLayerStyle: getLayerStyle,
   getLayerTimeDimension: getLayerTimeDimension,
+  getLayerTitleFromService: getLayerTitleFromService,
+  getLayerType: getLayerType,
   getLayers: getLayers,
   getLayersById: getLayersById,
   getLayersByMapId: getLayersByMapId,
@@ -4587,19 +4706,17 @@ var getSelectedFeature = createSelector([
 // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
 function (state, mapId) {
   var _state$linkedState;
-  var sharedData = (_state$linkedState = state.linkedState) === null || _state$linkedState === void 0 ? void 0 : _state$linkedState.sharedData[mapId];
-  var _ref = sharedData || {},
-    _ref$features = _ref.features,
-    features = _ref$features === void 0 ? [] : _ref$features,
-    selectedFeatureId = _ref.selectedFeatureId;
-  return {
-    features: features,
-    selectedFeatureId: selectedFeatureId
-  };
-}], function (_ref2) {
+  return (_state$linkedState = state.linkedState) === null || _state$linkedState === void 0 ? void 0 : _state$linkedState.sharedData[mapId];
+}], function (sharedData) {
   var _features$;
-  var features = _ref2.features,
-    selectedFeatureId = _ref2.selectedFeatureId;
+  if (!sharedData) {
+    return null;
+  }
+  var features = sharedData.features,
+    selectedFeatureId = sharedData.selectedFeatureId;
+  if (!features || !selectedFeatureId) {
+    return null;
+  }
   var selectedFeature = (_features$ = features[0]) === null || _features$ === void 0 ? void 0 : _features$.geoJSON.features.find(function (feature) {
     return feature.id === selectedFeatureId;
   });
@@ -4629,26 +4746,21 @@ function (state, mapId) {
 });
 var getSelectedFeatureAsGeoJSON = createSelector([function (state, mapId) {
   var _state$linkedState2;
-  var sharedData = (_state$linkedState2 = state.linkedState) === null || _state$linkedState2 === void 0 ? void 0 : _state$linkedState2.sharedData[mapId];
-  var _ref3 = sharedData || {},
-    _ref3$features = _ref3.features,
-    features = _ref3$features === void 0 ? [] : _ref3$features,
-    selectedFeatureId = _ref3.selectedFeatureId;
-  return {
-    features: features,
-    selectedFeatureId: selectedFeatureId
-  };
-}], function (_ref4) {
-  var features = _ref4.features,
-    selectedFeatureId = _ref4.selectedFeatureId;
-  if (features && selectedFeatureId) {
-    var _features$2;
-    var selectedFeature = (_features$2 = features[0]) === null || _features$2 === void 0 ? void 0 : _features$2.geoJSON.features.find(function (feature) {
-      return feature.id === selectedFeatureId;
-    });
-    return selectedFeature;
+  return (_state$linkedState2 = state.linkedState) === null || _state$linkedState2 === void 0 ? void 0 : _state$linkedState2.sharedData[mapId];
+}], function (sharedData) {
+  var _features$2;
+  if (!sharedData) {
+    return null;
   }
-  return null;
+  var features = sharedData.features,
+    selectedFeatureId = sharedData.selectedFeatureId;
+  if (!features || !selectedFeatureId) {
+    return null;
+  }
+  var selectedFeature = (_features$2 = features[0]) === null || _features$2 === void 0 ? void 0 : _features$2.geoJSON.features.find(function (feature) {
+    return feature.id === selectedFeatureId;
+  });
+  return selectedFeature;
 });
 
 var selectors$3 = /*#__PURE__*/Object.freeze({
@@ -5146,16 +5258,16 @@ var isAnimating = function isAnimating(store, mapId) {
  * @param {string} mapId mapId: string - Id of the map
  * @returns {object} returnType: object - object containing isAnimating boolean and id string
  */
-var linkedMapAnimationInfo = function linkedMapAnimationInfo(store, mapId) {
-  var _genericSelectors$get;
+var linkedMapAnimationInfo = createSelector(getMapStore, getSynchronizationGroupStore, getMapById, function (mapStore, syncStore, mapState) {
   var animationInfo = {
-    isAnimating: isAnimating(store, mapId),
-    id: mapId
+    isAnimating: (mapState === null || mapState === void 0 ? void 0 : mapState.isAnimating) || false,
+    id: (mapState === null || mapState === void 0 ? void 0 : mapState.id) || ''
   };
-  (_genericSelectors$get = getSynchronizationGroupStore(store)) === null || _genericSelectors$get === void 0 || _genericSelectors$get.groups.allIds.forEach(function (groupId) {
-    if (getSynchronizationGroupStore(store).groups.byId[groupId].targets.byId[animationInfo.id] && getSynchronizationGroupStore(store).groups.byId[groupId].targets.byId[animationInfo.id].linked) {
-      getSynchronizationGroupStore(store).groups.byId[groupId].targets.allIds.forEach(function (id) {
-        if (isAnimating(store, id) === true) {
+  syncStore === null || syncStore === void 0 || syncStore.groups.allIds.forEach(function (groupId) {
+    if (syncStore.groups.byId[groupId].targets.byId[animationInfo.id] && syncStore.groups.byId[groupId].targets.byId[animationInfo.id].linked) {
+      syncStore.groups.byId[groupId].targets.allIds.forEach(function (id) {
+        var _mapStore$byId$id;
+        if ((mapStore === null || mapStore === void 0 || (_mapStore$byId$id = mapStore.byId[id]) === null || _mapStore$byId$id === void 0 ? void 0 : _mapStore$byId$id.isAnimating) === true) {
           animationInfo.isAnimating = true;
           animationInfo.id = id;
         }
@@ -5163,7 +5275,7 @@ var linkedMapAnimationInfo = function linkedMapAnimationInfo(store, mapId) {
     }
   });
   return animationInfo;
-};
+}, selectorMemoizationOptions);
 /**
  * Gets start time of animation
  *
@@ -5550,7 +5662,8 @@ var getLegendId = createSelector(getMapById, function (store) {
 var getMapPreset = createSelector(getMapLayers, getMapBaseLayers, getMapOverLayers, getBbox, getSrs, getActiveLayerId, getAutoTimeStepLayerId, getAutoUpdateLayerId, isAnimating, isAutoUpdating, isTimeSliderVisible, getDisplayMapPin, isZoomControlsVisible, getMapTimeStep, getMapAnimationDelay, getAnimationStartTime, getAnimationEndTime, getMapTimeSliderSpan, isTimestepAuto, isTimeSpanAuto, getLegendId, getUiStore, function (_store, mapId) {
   return mapId;
 }, function (mapLayers, baseLayers, overLayers, bbox, srs, activeLayerId, autoTimeStepLayerId, autoUpdateLayerId, isAnimating, isAutoUpdating, isTimeSliderVisible, displayMapPin, isZoomControlsVisible, mapTimeStep, mapAnimationDelay, animationStartTime, animationEndTime, timeSliderSpan, isTimestepAuto, isTimeSpanAuto, legendId, uiStore, mapId) {
-  var _uiStore$dialogs$lege;
+  var _overLayers$, _uiStore$dialogs$lege;
+  var defaultOverlayer = arguments.length > 23 && arguments[23] !== undefined ? arguments[23] : ((_overLayers$ = overLayers[0]) === null || _overLayers$ === void 0 ? void 0 : _overLayers$.name) || 'none';
   var allLayers = [].concat(_toConsumableArray(baseLayers), _toConsumableArray(overLayers), _toConsumableArray(mapLayers)).map(function (_ref3) {
     _ref3.mapId;
       var layer = _objectWithoutProperties(_ref3, _excluded$2);
@@ -5596,7 +5709,8 @@ var getMapPreset = createSelector(getMapLayers, getMapBaseLayers, getMapOverLaye
     toggleTimeSpanAuto: isTimeSpanAuto,
     shouldShowLegend: shouldShowLegend,
     timeSliderSpan: timeSliderSpan,
-    shouldShowDataExplorer: shouldShowDataExplorer
+    shouldShowDataExplorer: shouldShowDataExplorer,
+    defaultOverlayer: defaultOverlayer
   });
 }, selectorMemoizationOptions);
 /**
@@ -5680,6 +5794,11 @@ var getAnimationList = createSelector(getLayersById, getMapById, getAnimationSta
   }
   return animationList;
 }, selectorMemoizationOptions);
+var getAnimationListAsEpochTimes = createSelector(getAnimationList, function (list) {
+  return list.map(function (kvp) {
+    return dateUtils.parseISO(handleDateUtilsISOString(kvp.value)).getTime();
+  });
+}, selectorMemoizationOptions);
 /**
  * @param {object} store store: object - store object
  * @param {string} mapId mapId: string - Id of the map
@@ -5737,6 +5856,7 @@ var selectors$1 = /*#__PURE__*/Object.freeze({
   getAllUniqueDimensions: getAllUniqueDimensions,
   getAnimationEndTime: getAnimationEndTime,
   getAnimationList: getAnimationList,
+  getAnimationListAsEpochTimes: getAnimationListAsEpochTimes,
   getAnimationRange: getAnimationRange,
   getAnimationStartTime: getAnimationStartTime,
   getAutoTimeStepLayerId: getAutoTimeStepLayerId,
@@ -5858,7 +5978,7 @@ var filterLayers = function filterLayers() {
         overLayers: overLayers
       };
     }
-    if (layer.layerType === LayerType.mapLayer || layer.layerType === LayerType.edrLayer) {
+    if (layer.layerType === LayerType.mapLayer || layer.layerType === LayerType.edrFeatureLayer) {
       return {
         mapLayers: mapLayers.concat(parsedLayer),
         baseLayers: baseLayers,
@@ -6275,20 +6395,23 @@ genericListener.startListening({
   actionCreator: setTime,
   effect: function () {
     var _effect = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref, listenerApi) {
-      var payload, value, origin, targets, groups;
+      var payload, value, origin, currentTime, targets, groups;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             payload = _ref.payload;
             listenerApi.cancelActiveListeners();
             value = payload.value, origin = payload.origin;
-            /* Test if the value is according to the expected time format */
-            if (!setTimeValidatorRexexp.test(value)) {
-              console.error("setTime value ".concat(value, " does not conform to format [YYYY-MM-DDThh:mm:ssZ]. It was triggered by ").concat(origin));
-            } else {
-              targets = getTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETTIME);
-              groups = getTargetGroups(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETTIME);
-              listenerApi.dispatch(setTimeSync(payload, targets, groups));
+            if (value !== null && value !== void 0 && value.currentTime) {
+              currentTime = value.currentTime;
+              /* Test if the current is according to the expected time format */
+              if (!setTimeValidatorRexexp.test(currentTime)) {
+                console.error("setTime value ".concat(currentTime, " does not conform to format [YYYY-MM-DDThh:mm:ssZ]. It was triggered by ").concat(origin));
+              } else {
+                targets = getTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETTIME);
+                groups = getTargetGroups(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETTIME);
+                listenerApi.dispatch(setTimeSync(payload, targets, groups));
+              }
             }
           case 4:
           case "end":
@@ -6302,20 +6425,37 @@ genericListener.startListening({
     return effect;
   }()
 });
+// Synchronize timeslider settings for actions 'centertime', 'span' and 'timestep'.
 genericListener.startListening({
-  actionCreator: setBbox,
+  matcher: isAnyOf(mapActions.setTimeSliderCenterTime, mapActions.setTimeSliderSpan, mapActions.setTimeStep, mapActions.setAnimationStartTime, mapActions.setAnimationEndTime, mapActions.setAnimationDelay),
   effect: function () {
     var _effect2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref2, listenerApi) {
-      var payload, targets, groups;
+      var _synchronizationGroup;
+      var payload, type, sourceId, syncGroupState, newPayload, targets, groups;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
-            payload = _ref2.payload;
+            payload = _ref2.payload, type = _ref2.type;
             listenerApi.cancelActiveListeners();
-            targets = getTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETBBOX);
-            groups = getTargetGroups(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETBBOX);
-            listenerApi.dispatch(setBboxSync(payload, targets, groups));
-          case 5:
+            sourceId = payload.mapId;
+            syncGroupState = (_synchronizationGroup = getSynchronizationGroupSource(listenerApi.getState(), sourceId)) === null || _synchronizationGroup === void 0 || (_synchronizationGroup = _synchronizationGroup.payloadByType['SYNCGROUPS_TYPE_SETTIME']) === null || _synchronizationGroup === void 0 ? void 0 : _synchronizationGroup.value;
+            newPayload = {
+              sourceId: sourceId,
+              origin: 'timeslidersynclistener',
+              value: {
+                currentTime: syncGroupState === null || syncGroupState === void 0 ? void 0 : syncGroupState.currentTime,
+                timeSliderCenterTime: type === mapActions.setTimeSliderCenterTime.type ? payload.timeSliderCenterTime : (syncGroupState === null || syncGroupState === void 0 ? void 0 : syncGroupState.timeSliderCenterTime) || 0,
+                timeSliderSpan: type === mapActions.setTimeSliderSpan.type ? payload.timeSliderSpan : syncGroupState === null || syncGroupState === void 0 ? void 0 : syncGroupState.timeSliderSpan,
+                timeSliderStep: type === mapActions.setTimeStep.type ? payload.timeStep : syncGroupState === null || syncGroupState === void 0 ? void 0 : syncGroupState.timeSliderStep,
+                timeSliderAnimationStartTime: type === mapActions.setAnimationStartTime.type ? payload.animationStartTime : syncGroupState === null || syncGroupState === void 0 ? void 0 : syncGroupState.timeSliderAnimationStartTime,
+                timeSliderAnimationEndTime: type === mapActions.setAnimationEndTime.type ? payload.animationEndTime : syncGroupState === null || syncGroupState === void 0 ? void 0 : syncGroupState.timeSliderAnimationEndTime,
+                timeSliderAnimationDelay: type === mapActions.setAnimationDelay.type ? payload.animationDelay : syncGroupState === null || syncGroupState === void 0 ? void 0 : syncGroupState.timeSliderAnimationDelay
+              }
+            };
+            targets = getTargets(listenerApi.getState(), newPayload, SYNCGROUPS_TYPE_SETTIME);
+            groups = getTargetGroups(listenerApi.getState(), newPayload, SYNCGROUPS_TYPE_SETTIME);
+            listenerApi.dispatch(setTimeSync(newPayload, targets, groups));
+          case 8:
           case "end":
             return _context2.stop();
         }
@@ -6328,27 +6468,19 @@ genericListener.startListening({
   }()
 });
 genericListener.startListening({
-  matcher: isAnyOf(layerActions.layerChangeName, layerActions.layerChangeEnabled, layerActions.layerChangeOpacity, layerActions.layerChangeDimension, layerActions.layerChangeStyle),
+  actionCreator: setBbox,
   effect: function () {
     var _effect3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3(_ref3, listenerApi) {
-      var payload, type, targets;
+      var payload, targets, groups;
       return _regeneratorRuntime().wrap(function _callee3$(_context3) {
         while (1) switch (_context3.prev = _context3.next) {
           case 0:
-            payload = _ref3.payload, type = _ref3.type;
+            payload = _ref3.payload;
             listenerApi.cancelActiveListeners();
-            /* Should not listen to actions from itself */
-            if (!(payload && payload.origin === LayerActionOrigin.ReactMapViewParseLayer)) {
-              _context3.next = 4;
-              break;
-            }
-            return _context3.abrupt("return");
-          case 4:
-            targets = getLayerActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
-            if (targets && targets.length > 0) {
-              listenerApi.dispatch(setLayerActionSync(payload, targets, type));
-            }
-          case 6:
+            targets = getTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETBBOX);
+            groups = getTargetGroups(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETBBOX);
+            listenerApi.dispatch(setBboxSync(payload, targets, groups));
+          case 5:
           case "end":
             return _context3.stop();
         }
@@ -6361,7 +6493,7 @@ genericListener.startListening({
   }()
 });
 genericListener.startListening({
-  actionCreator: layerActions.addLayer,
+  matcher: isAnyOf(layerActions.layerChangeName, layerActions.layerChangeEnabled, layerActions.layerChangeOpacity, layerActions.layerChangeDimension, layerActions.layerChangeStyle),
   effect: function () {
     var _effect4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee4(_ref4, listenerApi) {
       var payload, type, targets;
@@ -6377,7 +6509,7 @@ genericListener.startListening({
             }
             return _context4.abrupt("return");
           case 4:
-            targets = getAddLayerActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
+            targets = getLayerActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
             if (targets && targets.length > 0) {
               listenerApi.dispatch(setLayerActionSync(payload, targets, type));
             }
@@ -6394,24 +6526,25 @@ genericListener.startListening({
   }()
 });
 genericListener.startListening({
-  actionCreator: layerActions.duplicateMapLayer,
+  actionCreator: layerActions.addLayer,
   effect: function () {
     var _effect5 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee5(_ref5, listenerApi) {
-      var payload, sourceLayer, newPayload, targets;
+      var payload, type, targets;
       return _regeneratorRuntime().wrap(function _callee5$(_context5) {
         while (1) switch (_context5.prev = _context5.next) {
           case 0:
-            payload = _ref5.payload;
+            payload = _ref5.payload, type = _ref5.type;
             listenerApi.cancelActiveListeners();
-            sourceLayer = getLayerById(listenerApi.getState(), payload.oldLayerId);
-            newPayload = {
-              mapId: payload.mapId,
-              layer: sourceLayer,
-              origin: payload.origin
-            };
-            targets = getAddLayerActionsTargets(listenerApi.getState(), newPayload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
+            /* Should not listen to actions from itself */
+            if (!(payload && payload.origin === LayerActionOrigin.ReactMapViewParseLayer)) {
+              _context5.next = 4;
+              break;
+            }
+            return _context5.abrupt("return");
+          case 4:
+            targets = getAddLayerActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
             if (targets && targets.length > 0) {
-              listenerApi.dispatch(setLayerActionSync(newPayload, targets, layerActions.addLayer.type));
+              listenerApi.dispatch(setLayerActionSync(payload, targets, type));
             }
           case 6:
           case "end":
@@ -6426,25 +6559,24 @@ genericListener.startListening({
   }()
 });
 genericListener.startListening({
-  actionCreator: mapActions.layerMoveLayer,
+  actionCreator: layerActions.duplicateMapLayer,
   effect: function () {
     var _effect6 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee6(_ref6, listenerApi) {
-      var payload, type, targets;
+      var payload, sourceLayer, newPayload, targets;
       return _regeneratorRuntime().wrap(function _callee6$(_context6) {
         while (1) switch (_context6.prev = _context6.next) {
           case 0:
-            payload = _ref6.payload, type = _ref6.type;
+            payload = _ref6.payload;
             listenerApi.cancelActiveListeners();
-            /* Should not listen to actions from itself */
-            if (!(payload && payload.origin === LayerActionOrigin.ReactMapViewParseLayer)) {
-              _context6.next = 4;
-              break;
-            }
-            return _context6.abrupt("return");
-          case 4:
-            targets = getLayerMoveActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
+            sourceLayer = getLayerById(listenerApi.getState(), payload.oldLayerId);
+            newPayload = {
+              mapId: payload.mapId,
+              layer: sourceLayer,
+              origin: payload.origin
+            };
+            targets = getAddLayerActionsTargets(listenerApi.getState(), newPayload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
             if (targets && targets.length > 0) {
-              listenerApi.dispatch(setLayerActionSync(payload, targets, type));
+              listenerApi.dispatch(setLayerActionSync(newPayload, targets, layerActions.addLayer.type));
             }
           case 6:
           case "end":
@@ -6459,7 +6591,7 @@ genericListener.startListening({
   }()
 });
 genericListener.startListening({
-  matcher: isAnyOf(mapActions.setAutoLayerId, mapActions.setAutoUpdateLayerId, mapActions.setAutoTimestepLayerId),
+  actionCreator: mapActions.layerMoveLayer,
   effect: function () {
     var _effect7 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee7(_ref7, listenerApi) {
       var payload, type, targets;
@@ -6468,11 +6600,18 @@ genericListener.startListening({
           case 0:
             payload = _ref7.payload, type = _ref7.type;
             listenerApi.cancelActiveListeners();
-            targets = getSetAutoLayerIdActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
+            /* Should not listen to actions from itself */
+            if (!(payload && payload.origin === LayerActionOrigin.ReactMapViewParseLayer)) {
+              _context7.next = 4;
+              break;
+            }
+            return _context7.abrupt("return");
+          case 4:
+            targets = getLayerMoveActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
             if (targets && targets.length > 0) {
               listenerApi.dispatch(setLayerActionSync(payload, targets, type));
             }
-          case 4:
+          case 6:
           case "end":
             return _context7.stop();
         }
@@ -6485,7 +6624,7 @@ genericListener.startListening({
   }()
 });
 genericListener.startListening({
-  actionCreator: layerActions.setBaseLayers,
+  matcher: isAnyOf(mapActions.setAutoLayerId, mapActions.setAutoUpdateLayerId, mapActions.setAutoTimestepLayerId),
   effect: function () {
     var _effect8 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee8(_ref8, listenerApi) {
       var payload, type, targets;
@@ -6494,18 +6633,11 @@ genericListener.startListening({
           case 0:
             payload = _ref8.payload, type = _ref8.type;
             listenerApi.cancelActiveListeners();
-            /* Should not listen to actions from itself */
-            if (!(payload && payload.origin === LayerActionOrigin.ReactMapViewParseLayer)) {
-              _context8.next = 4;
-              break;
-            }
-            return _context8.abrupt("return");
-          case 4:
-            targets = getMapBaseLayerActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
+            targets = getSetAutoLayerIdActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
             if (targets && targets.length > 0) {
               listenerApi.dispatch(setLayerActionSync(payload, targets, type));
             }
-          case 6:
+          case 4:
           case "end":
             return _context8.stop();
         }
@@ -6518,7 +6650,7 @@ genericListener.startListening({
   }()
 });
 genericListener.startListening({
-  actionCreator: layerActions.layerDelete,
+  actionCreator: layerActions.setBaseLayers,
   effect: function () {
     var _effect9 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee9(_ref9, listenerApi) {
       var payload, type, targets;
@@ -6534,7 +6666,7 @@ genericListener.startListening({
             }
             return _context9.abrupt("return");
           case 4:
-            targets = getLayerDeleteActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
+            targets = getMapBaseLayerActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
             if (targets && targets.length > 0) {
               listenerApi.dispatch(setLayerActionSync(payload, targets, type));
             }
@@ -6550,6 +6682,39 @@ genericListener.startListening({
     return effect;
   }()
 });
+genericListener.startListening({
+  actionCreator: layerActions.layerDelete,
+  effect: function () {
+    var _effect0 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee0(_ref0, listenerApi) {
+      var payload, type, targets;
+      return _regeneratorRuntime().wrap(function _callee0$(_context0) {
+        while (1) switch (_context0.prev = _context0.next) {
+          case 0:
+            payload = _ref0.payload, type = _ref0.type;
+            listenerApi.cancelActiveListeners();
+            /* Should not listen to actions from itself */
+            if (!(payload && payload.origin === LayerActionOrigin.ReactMapViewParseLayer)) {
+              _context0.next = 4;
+              break;
+            }
+            return _context0.abrupt("return");
+          case 4:
+            targets = getLayerDeleteActionsTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETLAYERACTIONS);
+            if (targets && targets.length > 0) {
+              listenerApi.dispatch(setLayerActionSync(payload, targets, type));
+            }
+          case 6:
+          case "end":
+            return _context0.stop();
+        }
+      }, _callee0);
+    }));
+    function effect(_x17, _x18) {
+      return _effect0.apply(this, arguments);
+    }
+    return effect;
+  }()
+});
 
 /* A map with all the timerIds and their current step */
 var stepMap = new Map();
@@ -6641,14 +6806,14 @@ var isNextStepAvailable = function isNextStepAvailable(reduxLayers, nextTimeStri
       };
     }
     var olSource = layer.olSource;
-    var hasImageAvailableForRequestedTimeStep = olSource.hasImageForTimeValue(closestValue);
+    var hasImageAvailableForRequestedTimeStep = olSource.isImageLoadingForTimestep(closestValue);
     // If there is no image available for requested timestep, return true and flag that this thing is not ready yet.
     if (hasImageAvailableForRequestedTimeStep) {
       return {
         status: true
       };
     }
-    olSource.loadImageForTimeValue(closestValue);
+    olSource.setImageForTimeValue(closestValue);
     return {
       status: false
     };
@@ -6684,7 +6849,9 @@ var olMetronomeHandler = function olMetronomeHandler(timerIds, listenerApi) {
         // When there are no targets, default to one
         targets.push({
           targetId: timerId,
-          value: ''
+          value: {
+            currentTime: ''
+          }
         });
       }
       var timerIsInDwell = handleTimerDwell(timerId, animationListValues.length);
@@ -6703,7 +6870,9 @@ var olMetronomeHandler = function olMetronomeHandler(timerIds, listenerApi) {
       var updatedValue = animationListValues[timerStep];
       targetsWithUpdateValue.push.apply(targetsWithUpdateValue, _toConsumableArray(targets.map(function (target) {
         return _objectSpread2(_objectSpread2({}, target), {}, {
-          value: updatedValue
+          value: {
+            currentTime: updatedValue
+          }
         });
       })));
       var speedDelay = getMapAnimationDelay(listenerApi.getState(), timerId);
@@ -6741,7 +6910,8 @@ mapListener.startListening({
     var payload = _ref.payload;
     var mapId = payload.mapId;
     var layers = getMapLayersWithoutDimensionCurrentValue(listenerApi.getState(), mapId);
-    if (!layers.length) {
+    var isAnimating$1 = isAnimating(listenerApi.getState(), mapId);
+    if (!layers.length && isAnimating$1) {
       listenerApi.dispatch(mapActions.mapStopAnimation({
         mapId: mapId
       }));
@@ -6798,7 +6968,9 @@ mapListener.startListening({
               return listenerApi.dispatch(setTime({
                 origin: LayerActionOrigin.updateLayerInformationListener,
                 sourceId: syncedMapId,
-                value: incomingMaxTime
+                value: {
+                  currentTime: incomingMaxTime
+                }
               }));
             });
           }
@@ -6880,7 +7052,9 @@ mapListener.startListening({
                     return listenerApi.dispatch(setTime({
                       origin: LayerActionOrigin.toggleAutoUpdateListener,
                       sourceId: syncedMapId,
-                      value: timeDimension.maxValue
+                      value: {
+                        currentTime: timeDimension.maxValue
+                      }
                     }));
                   });
                 }
@@ -6994,7 +7168,7 @@ mapListener.startListening({
   actionCreator: mapActions.setMapPreset,
   effect: function () {
     var _effect2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref6, listenerApi) {
-      var payload, mapId, initialProps, mapPreset, layers, activeLayerId, autoTimeStepLayerId, autoUpdateLayerId, proj, shouldAutoUpdate, shouldAnimate, animationPayload, toggleTimestepAuto, showTimeSlider, displayMapPin, shouldShowZoomControls, shouldShowLegend, shouldShowDataExplorer, dockedLayerManagerSize, timeSliderSpan, toggleTimeSpanAuto, _filterLayers, mapLayers, baseLayers, overLayers, _newLayerIds$layers$f, _newLayerIds$layers$f2, autoTimeStepLayerIdNew, autoUpdateLayerIdNew, onlyActiveLayerIdIsSet, newLayerIds, newAutoTimeStepLayerId, newAutoUpdateLayerId, customLayers, customBaseLayer, customOverLayer, baseLayersWithDefaultLayer, overLayersWithDefaultLayer, allBaseLayers, checkIsprojectionSupported, animationLength, animationEndTime, shouldEndtimeOverride, interval, endTime, startTime, centerTimeInSeconds, animationEnd, _startTime, duration, _animationEnd, animationStart, shouldOpenLegend, legendId, fiveMinuteDelayForAnimation, _animationEnd2, _animationStart;
+      var payload, mapId, initialProps, mapPreset, layers, activeLayerId, autoTimeStepLayerId, autoUpdateLayerId, proj, shouldAutoUpdate, shouldAnimate, animationPayload, toggleTimestepAuto, showTimeSlider, displayMapPin, shouldShowZoomControls, shouldShowLegend, shouldShowDataExplorer, dockedLayerManagerSize, timeSliderSpan, toggleTimeSpanAuto, defaultOverlayer, _filterLayers, mapLayers, baseLayers, overLayers, _newLayerIds$layers$f, _newLayerIds$layers$f2, autoTimeStepLayerIdNew, autoUpdateLayerIdNew, onlyActiveLayerIdIsSet, newLayerIds, newAutoTimeStepLayerId, newAutoUpdateLayerId, customLayers, customBaseLayer, customOverLayer, baseLayersWithDefaultLayer, overLayersWithDefaultLayer, allBaseLayers, _overlayersFromStore$, overlayersFromStore, foundOverlayerId, checkIsprojectionSupported, animationLength, animationEndTime, shouldEndtimeOverride, interval, endTime, startTime, centerTimeInSeconds, animationEnd, _startTime, duration, _animationEnd, animationStart, shouldOpenLegend, legendId, fiveMinuteDelayForAnimation, _animationEnd2, _animationStart;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -7003,10 +7177,10 @@ mapListener.startListening({
             mapId = payload.mapId, initialProps = payload.initialProps;
             mapPreset = initialProps.mapPreset;
             if (!mapPreset) {
-              _context2.next = 51;
+              _context2.next = 52;
               break;
             }
-            layers = mapPreset.layers, activeLayerId = mapPreset.activeLayerId, autoTimeStepLayerId = mapPreset.autoTimeStepLayerId, autoUpdateLayerId = mapPreset.autoUpdateLayerId, proj = mapPreset.proj, shouldAutoUpdate = mapPreset.shouldAutoUpdate, shouldAnimate = mapPreset.shouldAnimate, animationPayload = mapPreset.animationPayload, toggleTimestepAuto = mapPreset.toggleTimestepAuto, showTimeSlider = mapPreset.showTimeSlider, displayMapPin = mapPreset.displayMapPin, shouldShowZoomControls = mapPreset.shouldShowZoomControls, shouldShowLegend = mapPreset.shouldShowLegend, shouldShowDataExplorer = mapPreset.shouldShowDataExplorer, dockedLayerManagerSize = mapPreset.dockedLayerManagerSize, timeSliderSpan = mapPreset.timeSliderSpan, toggleTimeSpanAuto = mapPreset.toggleTimeSpanAuto;
+            layers = mapPreset.layers, activeLayerId = mapPreset.activeLayerId, autoTimeStepLayerId = mapPreset.autoTimeStepLayerId, autoUpdateLayerId = mapPreset.autoUpdateLayerId, proj = mapPreset.proj, shouldAutoUpdate = mapPreset.shouldAutoUpdate, shouldAnimate = mapPreset.shouldAnimate, animationPayload = mapPreset.animationPayload, toggleTimestepAuto = mapPreset.toggleTimestepAuto, showTimeSlider = mapPreset.showTimeSlider, displayMapPin = mapPreset.displayMapPin, shouldShowZoomControls = mapPreset.shouldShowZoomControls, shouldShowLegend = mapPreset.shouldShowLegend, shouldShowDataExplorer = mapPreset.shouldShowDataExplorer, dockedLayerManagerSize = mapPreset.dockedLayerManagerSize, timeSliderSpan = mapPreset.timeSliderSpan, toggleTimeSpanAuto = mapPreset.toggleTimeSpanAuto, defaultOverlayer = mapPreset.defaultOverlayer;
             _filterLayers = filterLayers(layers), mapLayers = _filterLayers.mapLayers, baseLayers = _filterLayers.baseLayers, overLayers = _filterLayers.overLayers;
             if (layers) {
               //  make sure all layers have a unique id before going forward
@@ -7053,24 +7227,35 @@ mapListener.startListening({
               });
             });
             handleBaseLayers(mapId, allBaseLayers, listenerApi);
+            if (defaultOverlayer) {
+              overlayersFromStore = getOverlayersForMapId(listenerApi.getState(), mapId);
+              foundOverlayerId = ((_overlayersFromStore$ = overlayersFromStore.find(function (overlayer) {
+                return overlayer.name === defaultOverlayer;
+              })) === null || _overlayersFromStore$ === void 0 ? void 0 : _overlayersFromStore$.id) || 'none';
+              listenerApi.dispatch(mapActions.changeOverlayer({
+                mapId: mapId,
+                selectedOverlayer: foundOverlayerId,
+                origin: 'mapListener'
+              }));
+            }
             if (!proj) {
-              _context2.next = 20;
+              _context2.next = 21;
               break;
             }
             checkIsprojectionSupported = isProjectionSupported(proj.srs);
             if (checkIsprojectionSupported) {
-              _context2.next = 19;
+              _context2.next = 20;
               break;
             }
             throw new Error("Projection ".concat(proj.srs, " is not supported"));
-          case 19:
+          case 20:
             //  set bbox
             listenerApi.dispatch(mapActions.setBbox({
               mapId: mapId,
               bbox: proj.bbox,
               srs: proj.srs
             }));
-          case 20:
+          case 21:
             animationLength = animationPayload && animationPayload.duration;
             animationEndTime = animationPayload && animationPayload.endTime && isAnimationEndTimeValid(animationPayload.endTime) && animationPayload.endTime;
             shouldEndtimeOverride = animationPayload ? animationPayload.shouldEndtimeOverride : false;
@@ -7146,7 +7331,9 @@ mapListener.startListening({
               listenerApi.dispatch(genericActions.setTime({
                 origin: '',
                 sourceId: mapId,
-                value: startTime
+                value: {
+                  currentTime: startTime
+                }
               }));
               centerTimeInSeconds = new Date(handleDateUtilsISOString(endTime)).getTime();
               listenerApi.dispatch(mapActions.setTimeSliderCenterTime({
@@ -7167,7 +7354,9 @@ mapListener.startListening({
               listenerApi.dispatch(genericActions.setTime({
                 origin: '',
                 sourceId: mapId,
-                value: _startTime
+                value: {
+                  currentTime: _startTime
+                }
               }));
             }
             // sets animationDelay by speed of animationPayload
@@ -7228,15 +7417,15 @@ mapListener.startListening({
                 dockedLayerManagerSize: dockedLayerManagerSize
               }));
             }
-          case 41:
+          case 42:
             if (!(animationEndTime && (shouldEndtimeOverride || !(shouldAutoUpdate || shouldAnimate)))) {
-              _context2.next = 51;
+              _context2.next = 52;
               break;
             }
             fiveMinuteDelayForAnimation = 1000 * 60 * 5; // eslint-disable-next-line no-await-in-loop
-            _context2.next = 45;
+            _context2.next = 46;
             return listenerApi.delay(fiveMinuteDelayForAnimation);
-          case 45:
+          case 46:
             _animationEnd2 = getAnimationEndTime(listenerApi.getState(), mapId);
             listenerApi.dispatch(mapActions.setAnimationEndTime({
               mapId: mapId,
@@ -7251,13 +7440,13 @@ mapListener.startListening({
                 minutes: 5
               }).toISOString()
             }));
-            _context2.next = 41;
+            _context2.next = 42;
             break;
-          case 51:
-            _context2.next = 56;
+          case 52:
+            _context2.next = 57;
             break;
-          case 53:
-            _context2.prev = 53;
+          case 54:
+            _context2.prev = 54;
             _context2.t0 = _context2["catch"](1);
             if (_context2.t0 instanceof Error) {
               listenerApi.dispatch(mapActions.setMapPresetError({
@@ -7265,11 +7454,11 @@ mapListener.startListening({
                 error: _context2.t0.message
               }));
             }
-          case 56:
+          case 57:
           case "end":
             return _context2.stop();
         }
-      }, _callee2, null, [[1, 53]]);
+      }, _callee2, null, [[1, 54]]);
     }));
     function effect(_x3, _x4) {
       return _effect2.apply(this, arguments);
@@ -7332,7 +7521,9 @@ mapListener.startListening({
       listenerApi.dispatch(genericActions.setTime({
         origin: '',
         sourceId: mapId,
-        value: handleDateUtilsISOString(selectedTimeString)
+        value: {
+          currentTime: handleDateUtilsISOString(selectedTimeString)
+        }
       }));
     }
   }
@@ -8721,8 +8912,9 @@ var SupportedComponentTypes;
 (function (SupportedComponentTypes) {
   SupportedComponentTypes["WarningList"] = "WarningList";
   SupportedComponentTypes["TimeSeries"] = "TimeSeries";
+  SupportedComponentTypes["Soundings"] = "Soundings";
 })(SupportedComponentTypes || (SupportedComponentTypes = {}));
-var supportedComponentTypesForLinking = [SupportedComponentTypes.WarningList, SupportedComponentTypes.TimeSeries];
+var supportedComponentTypesForLinking = [SupportedComponentTypes.WarningList, SupportedComponentTypes.TimeSeries, SupportedComponentTypes.Soundings];
 
 var constants = /*#__PURE__*/Object.freeze({
   __proto__: null,