@opengeoweb/store 15.2.0 → 16.0.0

package/index.esm.js

@@ -1,14 +1,14 @@
 import { createSlice, createSelector, createAction, createListenerMiddleware, isAnyOf, createEntityAdapter, combineReducers, configureStore } from '@reduxjs/toolkit';
-import { isEqual, merge, isEmpty, compact } from 'lodash';
+import { isEqual, mergeWith, merge, isEmpty, compact } from 'lodash';
 import { webmapUtils, parseISO8601IntervalToDateInterval, LayerType, handleDateUtilsISOString, webmapTestSettings, WMLayer, getWMLayerById, WMInvalidDateValues, isProjectionSupported, queryWMSLayers } from '@opengeoweb/webmap';
-import { dateUtils, PROJECTION, defaultDelay } from '@opengeoweb/shared';
+import { dateUtils, PROJECTION, defaultDelay, useDebounce } from '@opengeoweb/shared';
 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';
+import React, { useEffect, useCallback } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
 import { center } from '@turf/turf';
-import { useEffect, useCallback } from 'react';
-import { useSelector, useDispatch } from 'react-redux';
 import { metronome } from '@opengeoweb/metronome';
 import { View, Observable } from 'ol';
 import { boundingExtent, getCenter } from 'ol/extent';
@@ -2301,13 +2301,26 @@ var slice$6 = createSlice({
     },
     hideLayerInfo: function hideLayerInfo(draft) {
       delete draft.activeLayerInfo;
+    },
+    SetLayerLegendVisibilityPayload: function SetLayerLegendVisibilityPayload(draft, action) {
+      var _action$payload22 = action.payload,
+        layerId = _action$payload22.layerId,
+        showLayerLegend = _action$payload22.showLayerLegend;
+      var layer = draft.byId[layerId];
+      if (!layer) {
+        return;
+      }
+      if (!layer.showLayerLegend) {
+        layer.showLayerLegend = true;
+      }
+      draft.byId[layerId].showLayerLegend = showLayerLegend;
     }
   },
   extraReducers: function extraReducers(builder) {
     builder.addCase(setTimeSync, function (draft, action) {
-      var _action$payload22 = action.payload,
-        targetsFromAction = _action$payload22.targets,
-        source = _action$payload22.source;
+      var _action$payload23 = action.payload,
+        targetsFromAction = _action$payload23.targets,
+        source = _action$payload23.source;
       /* Because we want backwards compatibility with the previous code, we also need to listen to the original source action */
       var targets = [];
       if (source) {
@@ -2337,9 +2350,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$payload23 = action.payload,
-        targets = _action$payload23.targets,
-        source = _action$payload23.source;
+      var _action$payload24 = action.payload,
+        targets = _action$payload24.targets,
+        source = _action$payload24.source;
       return targets.reduce(function (prevState, target) {
         var actionType = (source === null || source === void 0 ? void 0 : source.type) || 'GENERIC_SYNC_SETLAYERACTIONS';
         var action = {
@@ -2412,6 +2425,12 @@ var createLayersWithIds = function createLayersWithIds(state, layers) {
     }
   });
 };
+var layerHasTimeDimension = function layerHasTimeDimension(layer) {
+  var _layer$dimensions;
+  return !!((_layer$dimensions = layer.dimensions) !== null && _layer$dimensions !== void 0 && _layer$dimensions.some(function (dimension) {
+    return dimension.name === 'time';
+  }));
+};
 var initialState$4 = {
   byId: {},
   allIds: []
@@ -2724,33 +2743,64 @@ var slice$5 = createSlice({
       }
       draft.byId[mapId].dockedLayerManagerSize = dockedLayerManagerSize;
     },
+    setDockedLayerManagerPosition: function setDockedLayerManagerPosition(draft, action) {
+      var _action$payload25 = action.payload,
+        mapId = _action$payload25.mapId,
+        dockedLayerManagerPosition = _action$payload25.dockedLayerManagerPosition;
+      if (!draft.byId[mapId]) {
+        return;
+      }
+      draft.byId[mapId].dockedLayerManagerPosition = dockedLayerManagerPosition;
+    },
+    setDockedLayerManagerDimensions: function setDockedLayerManagerDimensions(draft, action) {
+      var _action$payload26 = action.payload,
+        mapId = _action$payload26.mapId,
+        dockedLayerManagerDimensions = _action$payload26.dockedLayerManagerDimensions;
+      if (!draft.byId[mapId]) {
+        return;
+      }
+      draft.byId[mapId].dockedLayerManagerDimensions = dockedLayerManagerDimensions;
+    },
     setMapPresetError: function setMapPresetError(_draft, _action) {},
     setDefaultMapSettings: function setDefaultMapSettings(draft, action) {
       draft.defaultMapSettings = action.payload.preset;
     },
     changeOverlayer: function changeOverlayer(draft, action) {
-      var _action$payload25 = action.payload,
-        mapId = _action$payload25.mapId,
-        selectedOverlayer = _action$payload25.selectedOverlayer;
+      var _action$payload27 = action.payload,
+        mapId = _action$payload27.mapId,
+        selectedOverlayer = _action$payload27.selectedOverlayer;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].overLayers = [selectedOverlayer];
     },
     toggleClock: function toggleClock(draft, action) {
-      var _action$payload26 = action.payload,
-        mapId = _action$payload26.mapId,
-        isClockVisible = _action$payload26.isClockVisible;
+      var _action$payload28 = action.payload,
+        mapId = _action$payload28.mapId,
+        isClockVisible = _action$payload28.isClockVisible;
       if (!draft.byId[mapId]) {
         return;
       }
       draft.byId[mapId].isClockVisible = isClockVisible;
+      if (!isClockVisible) {
+        // close options menu when clock is closed
+        draft.byId[mapId].isClockOptionsMenuVisible = false;
+      }
+    },
+    toggleClockOptions: function toggleClockOptions(draft, action) {
+      var _action$payload29 = action.payload,
+        mapId = _action$payload29.mapId,
+        isClockOptionsMenuVisible = _action$payload29.isClockOptionsMenuVisible;
+      if (!draft.byId[mapId]) {
+        return;
+      }
+      draft.byId[mapId].isClockOptionsMenuVisible = isClockOptionsMenuVisible;
     },
     setClockPositionSize: function setClockPositionSize(draft, action) {
-      var _action$payload27 = action.payload,
-        mapId = _action$payload27.mapId,
-        position = _action$payload27.position,
-        size = _action$payload27.size;
+      var _action$payload30 = action.payload,
+        mapId = _action$payload30.mapId,
+        position = _action$payload30.position,
+        size = _action$payload30.size;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2764,10 +2814,10 @@ var slice$5 = createSlice({
   },
   extraReducers: function extraReducers(builder) {
     builder.addCase(layerActions.addLayer, function (draft, action) {
-      var _action$payload28 = action.payload,
-        layerId = _action$payload28.layerId,
-        mapId = _action$payload28.mapId,
-        layer = _action$payload28.layer;
+      var _action$payload31 = action.payload,
+        layerId = _action$payload31.layerId,
+        mapId = _action$payload31.mapId,
+        layer = _action$payload31.layer;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2775,21 +2825,21 @@ var slice$5 = createSlice({
         console.warn("Warning: Layer id ".concat(layerId, " was already taken"));
         return;
       }
-      if (!draft.byId[mapId].mapLayers.length) {
+      var isFeatureLayer = (layer === null || layer === void 0 ? void 0 : layer.layerType) === LayerType.featureLayer;
+      if (!isFeatureLayer && !draft.byId[mapId].autoUpdateLayerId && !draft.byId[mapId].autoTimeStepLayerId && layerHasTimeDimension(layer)) {
         draft.byId[mapId].autoUpdateLayerId = layerId;
         draft.byId[mapId].autoTimeStepLayerId = layerId;
       }
-      var isFeatureLayer = (layer === null || layer === void 0 ? void 0 : layer.layerType) === LayerType.featureLayer;
       if (isFeatureLayer) {
         draft.byId[mapId].featureLayers.unshift(layerId);
       } else {
         draft.byId[mapId].mapLayers.unshift(layerId);
       }
     }).addCase(layerActions.duplicateMapLayer, function (draft, action) {
-      var _action$payload29 = action.payload,
-        newLayerId = _action$payload29.newLayerId,
-        oldLayerId = _action$payload29.oldLayerId,
-        mapId = _action$payload29.mapId;
+      var _action$payload32 = action.payload,
+        newLayerId = _action$payload32.newLayerId,
+        oldLayerId = _action$payload32.oldLayerId,
+        mapId = _action$payload32.mapId;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2806,10 +2856,10 @@ var slice$5 = createSlice({
         draft.byId[mapId].featureLayers.unshift(newLayerId);
       }
     }).addCase(layerActions.addBaseLayer, function (draft, action) {
-      var _action$payload30 = action.payload,
-        layer = _action$payload30.layer,
-        layerId = _action$payload30.layerId,
-        mapId = _action$payload30.mapId;
+      var _action$payload33 = action.payload,
+        layer = _action$payload33.layer,
+        layerId = _action$payload33.layerId,
+        mapId = _action$payload33.mapId;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2825,23 +2875,23 @@ var slice$5 = createSlice({
         draft.byId[mapId].overLayers.unshift(layerId);
       }
     }).addCase(layerActions.setLayers, function (draft, action) {
+      var _layersWithIds$find;
       var mapId = action.payload.mapId;
       var layersWithIds = createLayersWithIds(draft, action.payload.layers);
       var layerIds = layersWithIds.map(function (_ref) {
         var id = _ref.id;
         return id;
       });
-      var _layerIds = _slicedToArray(layerIds, 1),
-        activeLayerId = _layerIds[0];
+      var activeLayerId = (_layersWithIds$find = layersWithIds.find(layerHasTimeDimension)) === null || _layersWithIds$find === void 0 ? void 0 : _layersWithIds$find.id;
       if (draft.byId[mapId]) {
         draft.byId[mapId].mapLayers = layerIds;
         draft.byId[mapId].autoUpdateLayerId = activeLayerId;
         draft.byId[mapId].autoTimeStepLayerId = activeLayerId;
       }
     }).addCase(layerActions.setBaseLayers, function (draft, action) {
-      var _action$payload31 = action.payload,
-        layers = _action$payload31.layers,
-        mapId = _action$payload31.mapId;
+      var _action$payload34 = action.payload,
+        layers = _action$payload34.layers,
+        mapId = _action$payload34.mapId;
       // Split into base and overlayers
       var baseLayers = [];
       var overLayers = [];
@@ -2871,9 +2921,9 @@ var slice$5 = createSlice({
         }
       }
     }).addCase(layerActions.layerDelete, function (draft, action) {
-      var _action$payload32 = action.payload,
-        mapId = _action$payload32.mapId,
-        layerId = _action$payload32.layerId;
+      var _action$payload35 = action.payload,
+        mapId = _action$payload35.mapId,
+        layerId = _action$payload35.layerId;
       var map = draft.byId[mapId];
       if (!map) {
         return;
@@ -2899,9 +2949,9 @@ var slice$5 = createSlice({
         return id !== layerId;
       });
     }).addCase(layerActions.baseLayerDelete, function (draft, action) {
-      var _action$payload33 = action.payload,
-        mapId = _action$payload33.mapId,
-        layerId = _action$payload33.layerId;
+      var _action$payload36 = action.payload,
+        mapId = _action$payload36.mapId,
+        layerId = _action$payload36.layerId;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -2912,14 +2962,14 @@ var slice$5 = createSlice({
         return id !== layerId;
       });
     }).addCase(layerActions.layerChangeDimension, function (draft, action) {
-      var _action$payload34 = action.payload,
-        layerId = _action$payload34.layerId,
-        dimension = _action$payload34.dimension;
+      var _action$payload37 = action.payload,
+        layerId = _action$payload37.layerId,
+        dimension = _action$payload37.dimension;
       produceDraftStateSetMapDimensionFromLayerChangeDimension(draft, layerId, dimension);
     }).addCase(setTimeSync, function (draft, action) {
-      var _action$payload35 = action.payload,
-        targetsFromAction = _action$payload35.targets,
-        source = _action$payload35.source;
+      var _action$payload38 = action.payload,
+        targetsFromAction = _action$payload38.targets,
+        source = _action$payload38.source;
       /* Because we want backwards compatibility with the previous code, we also need to listen to the original source action */
       var targets = [];
       if (source) {
@@ -2972,9 +3022,9 @@ var slice$5 = createSlice({
         }
       });
     }).addCase(setBboxSync, function (draft, action) {
-      var _action$payload36 = action.payload,
-        targetsFromAction = _action$payload36.targets,
-        source = _action$payload36.source;
+      var _action$payload39 = action.payload,
+        targetsFromAction = _action$payload39.targets,
+        source = _action$payload39.source;
       /* Because we want backwards compatibility with the previous code, we also need to listen to the original source action */
       var targets = [];
       if (source) {
@@ -3006,9 +3056,9 @@ var slice$5 = 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$payload37 = action.payload,
-        targets = _action$payload37.targets,
-        source = _action$payload37.source;
+      var _action$payload40 = action.payload,
+        targets = _action$payload40.targets,
+        source = _action$payload40.source;
       return targets.reduce(function (prevState, target) {
         var actionType = (source === null || source === void 0 ? void 0 : source.type) || 'GENERIC_SYNC_SETLAYERACTIONS';
         var action = {
@@ -3030,9 +3080,9 @@ var slice$5 = createSlice({
       });
       return draft;
     }).addCase(mapChangeDimension, function (draft, action) {
-      var _action$payload38 = action.payload,
-        mapId = _action$payload38.mapId,
-        dimensionFromAction = _action$payload38.dimension;
+      var _action$payload41 = action.payload,
+        mapId = _action$payload41.mapId,
+        dimensionFromAction = _action$payload41.dimension;
       produceDraftStateSetWebMapDimension(draft, mapId, dimensionFromAction, true);
     }).addCase(setMapPreset, function (draft, action) {
       var mapId = action.payload.mapId;
@@ -3052,9 +3102,9 @@ var slice$5 = createSlice({
       draft.byId[mapId].animationDelay = defaultAnimationDelayAtStart;
       draft.byId[mapId].dockedLayerManagerSize = '';
     }).addCase(uiActions.registerDialog, function (draft, action) {
-      var _action$payload39 = action.payload,
-        mapId = _action$payload39.mapId,
-        type = _action$payload39.type;
+      var _action$payload42 = action.payload,
+        mapId = _action$payload42.mapId,
+        type = _action$payload42.type;
       if (!draft.byId[mapId]) {
         return;
       }
@@ -3305,14 +3355,31 @@ var slice$4 = createSlice({
       if (synchronizationGroup.targets.allIds.includes(targetId)) {
         return;
       }
-      var isSourceLinked = (_synchronizationGroup = synchronizationGroup.targets.byId[targetId]) === null || _synchronizationGroup === void 0 ? void 0 : _synchronizationGroup.linked;
       synchronizationGroup.targets.allIds.push(targetId);
       synchronizationGroup.targets.byId[targetId] = {
         linked: linked !== false
       };
+      var isSourceLinked = (_synchronizationGroup = synchronizationGroup.targets.byId[targetId]) === null || _synchronizationGroup === void 0 ? void 0 : _synchronizationGroup.linked;
       if (isSourceLinked) {
-        var type = synchronizationGroup.type;
-        draft.sources.byId[targetId].payloadByType[type] = synchronizationGroup.payloadByType[type];
+        // In order to make syncgroup work correctly we need to have defaults
+        var defaultS = {
+          payloadByType: {
+            SYNCGROUPS_TYPE_SETTIME: {
+              value: {
+                timeSliderSpan: defaultTimeSpan,
+                timeSliderStep: defaultTimeStep
+              }
+            }
+          }
+        };
+        if (draft.sources.byId[targetId]) {
+          // Assign object based on 1: defaults, 2: The values in the group, 3: the values of the source.
+          mergeWith(draft.sources.byId[targetId], defaultS, synchronizationGroup, draft.sources.byId[targetId],
+          // eslint-disable-next-line id-length, @typescript-eslint/no-unsafe-return
+          function (a, b) {
+            return b === null ? a : undefined;
+          });
+        }
       }
     },
     syncGroupRemoveTarget: function syncGroupRemoveTarget(draft, action) {
@@ -3437,13 +3504,13 @@ var setBboxOrTimeSync = function setBboxOrTimeSync(draft, action) {
   }
 };
 var _slice$actions = slice$4.actions,
-  syncGroupAddGroup = _slice$actions.syncGroupAddGroup;
-  _slice$actions.syncGroupAddSource;
-  var syncGroupAddTarget = _slice$actions.syncGroupAddTarget;
+  syncGroupAddGroup = _slice$actions.syncGroupAddGroup,
+  syncGroupAddSource = _slice$actions.syncGroupAddSource,
+  syncGroupAddTarget = _slice$actions.syncGroupAddTarget;
   _slice$actions.syncGroupClear;
   _slice$actions.syncGroupLinkTarget;
   _slice$actions.syncGroupRemoveGroup;
-  _slice$actions.syncGroupRemoveSource;
+  var syncGroupRemoveSource = _slice$actions.syncGroupRemoveSource;
   _slice$actions.syncGroupRemoveTarget;
   _slice$actions.syncGroupSetViewState;
 var syncGroupsReducer = slice$4.reducer,
@@ -3503,9 +3570,16 @@ var getTargets = createSelector([syncGroupStore, function (syncGroupStore, paylo
         var source = syncronizationGroup.targets.byId[payload.sourceId];
         /* If the source is part of the target list, and is linked, continue syncing the other targets */
         if (source !== null && source !== void 0 && source.linked) {
+          var hasLinkedPeer = syncronizationGroup.targets.allIds.some(function (targetId) {
+            var _syncronizationGroup$;
+            return targetId !== payload.sourceId && ((_syncronizationGroup$ = syncronizationGroup.targets.byId[targetId]) === null || _syncronizationGroup$ === void 0 ? void 0 : _syncronizationGroup$.linked);
+          });
+          if (!hasLinkedPeer) {
+            return;
+          }
           syncronizationGroup.targets.allIds.forEach(function (targetId) {
             var target = syncronizationGroup.targets.byId[targetId];
-            if (target.linked && !targetsInActionPayload[targetId]) {
+            if (targetId !== payload.sourceId && target.linked && !targetsInActionPayload[targetId]) {
               /* Remember that we have already added this target in the action payloads, prevents adding it twice */
               targetsInActionPayload[targetId] = true;
               /* Compose the payload */
@@ -3602,6 +3676,44 @@ var selectors$6 = /*#__PURE__*/Object.freeze({
   syncGroupStore: syncGroupStore
 });
 
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2026 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2026 - Finnish Meteorological Institute (FMI)
+ * Copyright 2026 - The Norwegian Meteorological Institute (MET Norway)
+ * */
+var constructSyncSourceDisplayName = function constructSyncSourceDisplayName(sourceId, viewMeta, fallbackName) {
+  var _viewMeta$title;
+  var rawTitle = viewMeta === null || viewMeta === void 0 || (_viewMeta$title = viewMeta.title) === null || _viewMeta$title === void 0 ? void 0 : _viewMeta$title.trim();
+  if (rawTitle === sourceId) {
+    return sourceId;
+  }
+  var title = rawTitle && rawTitle !== sourceId ? rawTitle : undefined;
+  if (!title) {
+    return fallbackName;
+  }
+  var isSavedView = !!(viewMeta !== null && viewMeta !== void 0 && viewMeta.id) && viewMeta.id !== sourceId;
+  if (isSavedView) {
+    return title;
+  }
+  var isDefaultUnsavedTitle = /^New .+ preset$/i.test(title);
+  if (isDefaultUnsavedTitle) {
+    return title.includes(sourceId) ? title : "".concat(title, " (").concat(sourceId, ")");
+  }
+  return title;
+};
+
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -3647,7 +3759,7 @@ var groupTypes = [{
       - Runs Each time viewState is created:
       - Fill arrays inside initialState with objects containing new values from Redux
 */
-var createSyncGroupViewState = function createSyncGroupViewState(groups, sources) {
+var createSyncGroupViewState = function createSyncGroupViewState(groups, sources, viewsById) {
   var initialState = produce(emptyState, function (draft) {
     /*
       _____ 1. Fill groups _____
@@ -3678,7 +3790,7 @@ var createSyncGroupViewState = function createSyncGroupViewState(groups, sources
         if (sources.byId[id].types.includes(syncType)) {
           draft[groupType].sourcesById.push({
             id: id,
-            name: id
+            name: constructSyncSourceDisplayName(id, viewsById === null || viewsById === void 0 ? void 0 : viewsById[id], id)
           });
         }
       });
@@ -3692,7 +3804,12 @@ var groups = function groups(store) {
 var sources = function sources(store) {
   return store.syncGroups.sources;
 };
-var createSyncGroupViewStateSelector = createSelector(groups, sources, createSyncGroupViewState);
+var workspaceViewsById = function workspaceViewsById(store) {
+  var _storeWithWorkspace$w;
+  var storeWithWorkspace = store;
+  return (_storeWithWorkspace$w = storeWithWorkspace.workspace) === null || _storeWithWorkspace$w === void 0 || (_storeWithWorkspace$w = _storeWithWorkspace$w.views) === null || _storeWithWorkspace$w === void 0 ? void 0 : _storeWithWorkspace$w.byId;
+};
+var createSyncGroupViewStateSelector = createSelector(groups, sources, workspaceViewsById, createSyncGroupViewState);
 
 var selector = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -3706,49 +3823,64 @@ syncGroupsListener.startListening({
   matcher: isAnyOf(syncGroupsActions.syncGroupAddTarget, syncGroupsActions.syncGroupLinkTarget),
   effect: function () {
     var _effect = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref, listenerApi) {
-      var payload, groupId, linked, targetToUpdate, group;
+      var payload, type, groupId, linked, targetToUpdate, group;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
-            payload = _ref.payload;
+            payload = _ref.payload, type = _ref.type;
             listenerApi.cancelActiveListeners();
             groupId = payload.groupId, linked = payload.linked, targetToUpdate = payload.targetId;
             group = getSynchronizationGroup(listenerApi.getState(), groupId);
             if (!(!linked && group)) {
-              _context.next = 17;
+              _context.next = 21;
               break;
             }
             _context.t0 = group.type;
-            _context.next = _context.t0 === SYNCGROUPS_TYPE_SETTIME ? 8 : _context.t0 === SYNCGROUPS_TYPE_SETBBOX ? 12 : 16;
+            _context.next = _context.t0 === SYNCGROUPS_TYPE_SETTIME ? 8 : _context.t0 === SYNCGROUPS_TYPE_SETBBOX ? 16 : 20;
             break;
           case 8:
-            if (group.payloadByType[SYNCGROUPS_TYPE_SETTIME]) {
+            if (!(type === syncGroupsActions.syncGroupLinkTarget.type)) {
               _context.next = 10;
               break;
             }
-            return _context.abrupt("return");
+            return _context.abrupt("break", 21);
           case 10:
+            if (group.targets.allIds.some(function (targetId) {
+              var _group$targets$byId$t;
+              return targetId !== targetToUpdate && ((_group$targets$byId$t = group.targets.byId[targetId]) === null || _group$targets$byId$t === void 0 ? void 0 : _group$targets$byId$t.linked);
+            })) {
+              _context.next = 12;
+              break;
+            }
+            return _context.abrupt("break", 21);
+          case 12:
+            if (group.payloadByType[SYNCGROUPS_TYPE_SETTIME]) {
+              _context.next = 14;
+              break;
+            }
+            return _context.abrupt("return");
+          case 14:
             listenerApi.dispatch(setTimeSync(group.payloadByType[SYNCGROUPS_TYPE_SETTIME], [{
               targetId: targetToUpdate,
               value: group.payloadByType[SYNCGROUPS_TYPE_SETTIME].value
             }], [groupId]));
-            return _context.abrupt("break", 17);
-          case 12:
+            return _context.abrupt("break", 21);
+          case 16:
             if (group.payloadByType[SYNCGROUPS_TYPE_SETBBOX]) {
-              _context.next = 14;
+              _context.next = 18;
               break;
             }
             return _context.abrupt("return");
-          case 14:
+          case 18:
             listenerApi.dispatch(setBboxSync(group.payloadByType[SYNCGROUPS_TYPE_SETBBOX], [{
               targetId: targetToUpdate,
               bbox: group.payloadByType[SYNCGROUPS_TYPE_SETBBOX].bbox,
               srs: group.payloadByType[SYNCGROUPS_TYPE_SETBBOX].srs
             }], [groupId]));
-            return _context.abrupt("break", 17);
-          case 16:
-            return _context.abrupt("break", 17);
-          case 17:
+            return _context.abrupt("break", 21);
+          case 20:
+            return _context.abrupt("break", 21);
+          case 21:
           case "end":
             return _context.stop();
         }
@@ -3990,12 +4122,26 @@ var getSelectedFeatureAsGeoJSON = createSelector([function (state, mapId) {
   });
   return selectedFeature;
 });
+var getSyncedStartCenterEndStepCurrentTime = createSelector(function (coreAppStore, sourceId) {
+  return getTime(getSynchronizationGroupStore(coreAppStore), sourceId);
+}, function (store) {
+  if (!(store !== null && store !== void 0 && store.timeSliderCenterTime) || !(store !== null && store !== void 0 && store.timeSliderSpan)) {
+    return undefined;
+  }
+  return {
+    start: Math.round(store.timeSliderCenterTime - store.timeSliderSpan / 2),
+    end: Math.round(store.timeSliderCenterTime + store.timeSliderSpan / 2),
+    step: (store === null || store === void 0 ? void 0 : store.timeSliderStep) || 60,
+    current: dateUtils.unixFromISOString(store === null || store === void 0 ? void 0 : store.currentTime)
+  };
+}, selectorMemoizationOptions);
 
 var selectors$5 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   getLinkedMaps: getLinkedMaps,
   getSelectedFeature: getSelectedFeature,
   getSelectedFeatureAsGeoJSON: getSelectedFeatureAsGeoJSON,
+  getSyncedStartCenterEndStepCurrentTime: getSyncedStartCenterEndStepCurrentTime,
   getSynchronizationGroupStore: getSynchronizationGroupStore,
   getTime: getTime,
   selectLinkedFeatures: selectLinkedFeatures,
@@ -4005,6 +4151,136 @@ var selectors$5 = /*#__PURE__*/Object.freeze({
   selectSharedData: selectSharedData
 });
 
+/**
+ * This registers a new syncgroup source for given panelId. The source is not synced to any group by default.
+ * When the user links the source with a group, this hook returns an object with the timeslider state (start, end, step and current time) for the panel (if effectively linked).
+ *
+ * How it works:
+ * - Registers/unregisters the source on mount/unmount.
+ * - Returns `{ start, end, step, current }` when linked.
+ * - Uses linked map selected time as `current` when available.
+ * - Falls back to sync source "now" timestamp when
+ *   synced state is not initialized yet.
+ *
+ * @param panelId panelId to register as sync source
+ * @returns timeslider state
+ */
+var useSyncgroupTimeState = function useSyncgroupTimeState(panelId) {
+  var _ref;
+  var debounceMs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 100;
+  var dispatch = useDispatch();
+  var defaultNowTime = React.useRef(Math.round(Date.now() / 1000));
+  var syncGroupsAddSourceCallBack = React.useCallback(function (payload) {
+    dispatch(syncGroupAddSource(payload));
+  }, [dispatch]);
+  var syncGroupRemoveSourceCallback = React.useCallback(function (payload) {
+    dispatch(syncGroupRemoveSource(payload));
+  }, [dispatch]);
+  // Register
+  useEffect(function () {
+    syncGroupsAddSourceCallBack({
+      id: panelId,
+      type: [SYNCGROUPS_TYPE_SETTIME]
+    });
+    return function () {
+      syncGroupRemoveSourceCallback({
+        id: panelId
+      });
+    };
+  }, [panelId, syncGroupsAddSourceCallBack, syncGroupRemoveSourceCallback]);
+  var syncGroupTimeSliderCenterStartEndStep = useSelector(function (store) {
+    return getSyncedStartCenterEndStepCurrentTime(store, panelId);
+  });
+  var syncSourceTime = useSelector(function (store) {
+    return getTime(getSynchronizationGroupStore(store), panelId);
+  });
+  var syncTargets = useSelector(function (store) {
+    return getAllTargetGroupsForSource(store, panelId);
+  });
+  var isSyncgroupLinked = useSelector(function (store) {
+    return syncTargets.some(function (groupId) {
+      var group = getSynchronizationGroup(store, groupId);
+      if ((group === null || group === void 0 ? void 0 : group.type) !== SYNCGROUPS_TYPE_SETTIME) {
+        return false;
+      }
+      return group.targets.allIds.some(function (targetId) {
+        var _group$targets$byId$t;
+        return targetId !== panelId && ((_group$targets$byId$t = group.targets.byId[targetId]) === null || _group$targets$byId$t === void 0 ? void 0 : _group$targets$byId$t.linked);
+      });
+    });
+  });
+  var linkedMapIdsInTimeGroup = useSelector(function (store) {
+    var _iterator = _createForOfIteratorHelper(syncTargets),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var groupId = _step.value;
+        var group = getSynchronizationGroup(store, groupId);
+        if ((group === null || group === void 0 ? void 0 : group.type) === SYNCGROUPS_TYPE_SETTIME) {
+          var _iterator2 = _createForOfIteratorHelper(group.targets.allIds),
+            _step2;
+          try {
+            for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+              var _group$targets$byId$t2, _store$webmap;
+              var targetId = _step2.value;
+              if (targetId !== panelId && (_group$targets$byId$t2 = group.targets.byId[targetId]) !== null && _group$targets$byId$t2 !== void 0 && _group$targets$byId$t2.linked && !!((_store$webmap = store.webmap) !== null && _store$webmap !== void 0 && (_store$webmap = _store$webmap.byId) !== null && _store$webmap !== void 0 && _store$webmap[targetId])) {
+                return targetId;
+              }
+            }
+          } catch (err) {
+            _iterator2.e(err);
+          } finally {
+            _iterator2.f();
+          }
+        }
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+    return undefined;
+  });
+  var linkedMapSelectedTime = useSelector(function (store) {
+    var _store$webmap2;
+    if (!linkedMapIdsInTimeGroup) {
+      return undefined;
+    }
+    var selectedTime = (_store$webmap2 = store.webmap) === null || _store$webmap2 === void 0 || (_store$webmap2 = _store$webmap2.byId) === null || _store$webmap2 === void 0 || (_store$webmap2 = _store$webmap2[linkedMapIdsInTimeGroup]) === null || _store$webmap2 === void 0 || (_store$webmap2 = _store$webmap2.dimensions) === null || _store$webmap2 === void 0 || (_store$webmap2 = _store$webmap2.find(function (dimension) {
+      return dimension.name === 'time';
+    })) === null || _store$webmap2 === void 0 ? void 0 : _store$webmap2.currentValue;
+    if (!selectedTime) {
+      return undefined;
+    }
+    var selectedTimeAsUnix = Date.parse(selectedTime) / 1000;
+    if (!Number.isFinite(selectedTimeAsUnix)) {
+      return undefined;
+    }
+    return Math.round(selectedTimeAsUnix);
+  });
+  var syncSourceCurrentTime = syncSourceTime !== null && syncSourceTime !== void 0 && syncSourceTime.currentTime ? Date.parse(syncSourceTime.currentTime) / 1000 : undefined;
+  var roundedSyncSourceCurrentTime = syncSourceCurrentTime !== undefined && Number.isFinite(syncSourceCurrentTime) ? Math.round(syncSourceCurrentTime) : undefined;
+  var fallbackCurrentTime = (_ref = linkedMapSelectedTime !== null && linkedMapSelectedTime !== void 0 ? linkedMapSelectedTime : roundedSyncSourceCurrentTime) !== null && _ref !== void 0 ? _ref : defaultNowTime.current;
+  var fallbackState = isSyncgroupLinked ? {
+    start: fallbackCurrentTime - defaultTimeSpan / 2,
+    end: fallbackCurrentTime + defaultTimeSpan / 2,
+    step: defaultTimeStep,
+    current: fallbackCurrentTime
+  } : undefined;
+  var syncedState = isSyncgroupLinked ? syncGroupTimeSliderCenterStartEndStep || fallbackState : undefined;
+  var mapFallbackState = linkedMapSelectedTime !== undefined ? {
+    start: linkedMapSelectedTime - defaultTimeSpan / 2,
+    end: linkedMapSelectedTime + defaultTimeSpan / 2,
+    step: defaultTimeStep,
+    current: linkedMapSelectedTime
+  } : undefined;
+  var baseState = syncedState || mapFallbackState;
+  var stateWithAuthoritativeCurrent = baseState && linkedMapSelectedTime !== undefined ? _objectSpread2(_objectSpread2({}, baseState), {}, {
+    current: linkedMapSelectedTime
+  }) : baseState;
+  return useDebounce(stateWithAuthoritativeCurrent, debounceMs);
+};
+
 var useUpdateSharedData = function useUpdateSharedData(data, panelId) {
   var sharedData = useSelector(function (state) {
     return selectSharedData(state, panelId);
@@ -4772,6 +5048,20 @@ var getLayerService = createSelector(getLayerById, function (layer) {
   var _layer$service;
   return (_layer$service = layer === null || layer === void 0 ? void 0 : layer.service) !== null && _layer$service !== void 0 ? _layer$service : '';
 }, selectorMemoizationOptions);
+/**
+ * Gets layer service name
+ *
+ * Example: layerService = getLayerServiceName(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 service name
+ */
+var getLayerServiceName = createSelector(function (store) {
+  return store;
+}, getLayerById, getLayerService, function (store, layer, service) {
+  var layerService = getServiceByUrl(store, service);
+  return layerService !== null && layerService !== void 0 && layerService.name ? layerService === null || layerService === void 0 ? void 0 : layerService.name : '';
+}, selectorMemoizationOptions);
 /**
  * Gets selected style of the passed layer
  *
@@ -5047,6 +5337,7 @@ var selectors$2 = /*#__PURE__*/Object.freeze({
   getLayerOpacity: getLayerOpacity,
   getLayerOptions: getLayerOptions,
   getLayerService: getLayerService,
+  getLayerServiceName: getLayerServiceName,
   getLayerStatus: getLayerStatus,
   getLayerStyle: getLayerStyle,
   getLayerTimeDimension: getLayerTimeDimension,
@@ -5520,7 +5811,6 @@ var getMapTimeSliderStartCenterEndAndStep = createSelector(getMapById, function
   var step = (_store$timeStep2 = store === null || store === void 0 ? void 0 : store.timeStep) !== null && _store$timeStep2 !== void 0 ? _store$timeStep2 : defaultTimeStep;
   return {
     start: start,
-    center: center,
     end: end,
     step: step
   };
@@ -5754,6 +6044,15 @@ var getLegendId = createSelector(getMapById, function (store) {
 var getIsClockVisible = createSelector(getMapById, function (store) {
   return store === null || store === void 0 ? void 0 : store.isClockVisible;
 }, selectorMemoizationOptions);
+/**
+ * Returns if clock options menu is visible from webmap state
+ *
+ * @param {CoreAppStore} store - The Redux store from which the map state will be extracted.
+ * @returns {boolean | undefined} returnType: boolean
+ */
+var getIsClockOptionsMenuVisible = createSelector(getMapById, function (store) {
+  return store === null || store === void 0 ? void 0 : store.isClockOptionsMenuVisible;
+}, selectorMemoizationOptions);
 /**
  * Returns if clock position from webmap state
  *
@@ -5781,14 +6080,26 @@ var getClockSize = createSelector(getMapById, function (store) {
  * @param {boolean} keepAllDims? keepAllDims: boolean - default false: whether or not to leave the time and reference_time dimentions
  * @returns {MapPreset} returnType: MapPreset
  */
-var getMapPreset = createSelector(getMapLayers, getMapBaseLayers, getMapOverLayers, getBbox, getSrs, getActiveLayerId, getAutoTimeStepLayerId, getAutoUpdateLayerId, isAnimating, isAutoUpdating, isTimeSliderVisible, getDisplayMapPin, isZoomControlsVisible, getMapTimeStep, getMapAnimationDelay, getAnimationStartTime, getAnimationEndTime, getMapTimeSliderSpan, getMapDimensions, isTimestepAuto, isTimeSpanAuto, getLegendId, getIsClockVisible, getClockPosition, getClockSize, getUiStore, function (_store, mapId) {
+var getMapPreset = createSelector(getMapLayers, getMapBaseLayers, getMapOverLayers, getBbox, getSrs, getActiveLayerId, getAutoTimeStepLayerId, getAutoUpdateLayerId, isAnimating, isAutoUpdating, isTimeSliderVisible, getDisplayMapPin, isZoomControlsVisible, getMapTimeStep, getMapAnimationDelay, getAnimationStartTime, getAnimationEndTime, getMapTimeSliderSpan, getMapDimensions, isTimestepAuto, isTimeSpanAuto, getLegendId, function (store, mapId) {
+  var _getMapById$dockedLay, _getMapById;
+  return (_getMapById$dockedLay = (_getMapById = getMapById(store, mapId)) === null || _getMapById === void 0 ? void 0 : _getMapById.dockedLayerManagerSize) !== null && _getMapById$dockedLay !== void 0 ? _getMapById$dockedLay : 'sizeSmall';
+}, function (store, mapId) {
+  var _getMapById$dockedLay2, _getMapById2;
+  return (_getMapById$dockedLay2 = (_getMapById2 = getMapById(store, mapId)) === null || _getMapById2 === void 0 ? void 0 : _getMapById2.dockedLayerManagerPosition) !== null && _getMapById$dockedLay2 !== void 0 ? _getMapById$dockedLay2 : {
+    x: 0,
+    y: 0
+  };
+}, function (store, mapId) {
+  var _getMapById3;
+  return (_getMapById3 = getMapById(store, mapId)) === null || _getMapById3 === void 0 ? void 0 : _getMapById3.dockedLayerManagerDimensions;
+}, getIsClockVisible, getIsClockOptionsMenuVisible, getClockPosition, getClockSize, getUiStore, function (_store, mapId) {
   return mapId;
 }, function (_store, _mapId) {
   var keepAllDims = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   return keepAllDims;
-}, function (mapLayers, baseLayers, overLayers, bbox, srs, activeLayerId, autoTimeStepLayerId, autoUpdateLayerId, isAnimating, isAutoUpdating, isTimeSliderVisible, displayMapPin, isZoomControlsVisible, mapTimeStep, mapAnimationDelay, animationStartTime, animationEndTime, timeSliderSpan, mapDimensions, isTimestepAuto, isTimeSpanAuto, legendId, isClockVisible, clockPosition, clockSize, uiStore, mapId, keepAllDims) {
+}, function (mapLayers, baseLayers, overLayers, bbox, srs, activeLayerId, autoTimeStepLayerId, autoUpdateLayerId, isAnimating, isAutoUpdating, isTimeSliderVisible, displayMapPin, isZoomControlsVisible, mapTimeStep, mapAnimationDelay, animationStartTime, animationEndTime, timeSliderSpan, mapDimensions, isTimestepAuto, isTimeSpanAuto, legendId, dockedLayerManagerSize, dockedLayerManagerPosition, dockedLayerManagerDimensions, isClockVisible, isClockOptionsMenuVisible, clockPosition, clockSize, uiStore, mapId, keepAllDims) {
   var _overLayers$, _uiStore$dialogs$lege;
-  var defaultOverlayer = arguments.length > 28 && arguments[28] !== undefined ? arguments[28] : ((_overLayers$ = overLayers[0]) === null || _overLayers$ === void 0 ? void 0 : _overLayers$.name) || 'none';
+  var defaultOverlayer = arguments.length > 32 && arguments[32] !== undefined ? arguments[32] : ((_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);
@@ -5816,7 +6127,19 @@ var getMapPreset = createSelector(getMapLayers, getMapBaseLayers, getMapOverLaye
   var shouldShowLegend = legendId ? uiStore === null || uiStore === void 0 || (_uiStore$dialogs$lege = uiStore.dialogs[legendId]) === null || _uiStore$dialogs$lege === void 0 ? void 0 : _uiStore$dialogs$lege.isOpen : false;
   var dataExplorerDialog = uiStore === null || uiStore === void 0 ? void 0 : uiStore.dialogs[DialogTypes.DataExplorer];
   var shouldShowDataExplorer = (dataExplorerDialog === null || dataExplorerDialog === void 0 ? void 0 : dataExplorerDialog.isOpen) && (dataExplorerDialog === null || dataExplorerDialog === void 0 ? void 0 : dataExplorerDialog.activeMapId) === mapId || false;
-  return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
+  var dockedLayerManagerDialog = uiStore === null || uiStore === void 0 ? void 0 : uiStore.dialogs["".concat(DialogTypes.DockedLayerManager, "-").concat(mapId)];
+  var floatingLayerManagerDialog = uiStore === null || uiStore === void 0 ? void 0 : uiStore.dialogs[DialogTypes.LayerManager];
+  var floatingLayerManagerMultimapDialog = uiStore === null || uiStore === void 0 ? void 0 : uiStore.dialogs["".concat(DialogTypes.LayerManager, "-").concat(mapId)];
+  var isFloatingLayerManagerOpenForMap = (floatingLayerManagerDialog === null || floatingLayerManagerDialog === void 0 ? void 0 : floatingLayerManagerDialog.isOpen) && (floatingLayerManagerDialog === null || floatingLayerManagerDialog === void 0 ? void 0 : floatingLayerManagerDialog.activeMapId) === mapId || (floatingLayerManagerMultimapDialog === null || floatingLayerManagerMultimapDialog === void 0 ? void 0 : floatingLayerManagerMultimapDialog.isOpen) || false;
+  var shouldShowDockedLayerManager = ((dockedLayerManagerDialog === null || dockedLayerManagerDialog === void 0 ? void 0 : dockedLayerManagerDialog.isOpen) || false) && !isFloatingLayerManagerOpenForMap;
+  var dockedLayerManagerPreset = shouldShowDockedLayerManager ? _objectSpread2({
+    shouldShowDockedLayerManager: shouldShowDockedLayerManager,
+    dockedLayerManagerSize: dockedLayerManagerSize,
+    dockedLayerManagerPosition: dockedLayerManagerPosition
+  }, dockedLayerManagerDimensions && {
+    dockedLayerManagerDimensions: dockedLayerManagerDimensions
+  }) : {};
+  return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
     layers: allLayers
   }, activeLayerId && {
     activeLayerId: activeLayerId
@@ -5841,8 +6164,10 @@ var getMapPreset = createSelector(getMapLayers, getMapBaseLayers, getMapOverLaye
     timeSliderSpan: timeSliderSpan,
     shouldShowDataExplorer: shouldShowDataExplorer,
     defaultOverlayer: defaultOverlayer
-  }, isClockVisible !== undefined && {
+  }, dockedLayerManagerPreset), isClockVisible !== undefined && {
     isClockVisible: isClockVisible
+  }), isClockOptionsMenuVisible !== undefined && {
+    isClockOptionsMenuVisible: isClockOptionsMenuVisible
   }), clockPosition !== undefined && {
     clockPosition: clockPosition
   }), clockSize !== undefined && {
@@ -5961,6 +6286,24 @@ var getIsEnabledLayersForMapDimension = createSelector(getMapLayerIdsEnabled, fu
 var getDockedLayerManagerSize = createSelector(getMapById, function (store) {
   return store ? store.dockedLayerManagerSize : 'sizeSmall';
 }, selectorMemoizationOptions);
+/**
+ * Returns the dockedLayerManagerPosition originally set in mapPresets
+ *
+ * Example getDockedLayerManagerPosition(store);
+ * @param {object} store store: object - store object
+ * @param {string} mapId mapId: string - Id of the map
+ * @returns {DockedLayerManagerPosition} returnType: object
+ */
+var getDockedLayerManagerPosition = createSelector(getMapById, function (store) {
+  var _store$dockedLayerMan;
+  return (_store$dockedLayerMan = store === null || store === void 0 ? void 0 : store.dockedLayerManagerPosition) !== null && _store$dockedLayerMan !== void 0 ? _store$dockedLayerMan : {
+    x: 0,
+    y: 0
+  };
+}, selectorMemoizationOptions);
+var getDockedLayerManagerDimensions = createSelector(getMapById, function (store) {
+  return store === null || store === void 0 ? void 0 : store.dockedLayerManagerDimensions;
+}, selectorMemoizationOptions);
 /**
  * Returns the animation list for given map id
  * @param {object} store store: object - store object
@@ -6081,10 +6424,13 @@ var selectors$1 = /*#__PURE__*/Object.freeze({
   getDataLimitsFromLayers: getDataLimitsFromLayers,
   getDisableMapPin: getDisableMapPin,
   getDisplayMapPin: getDisplayMapPin,
+  getDockedLayerManagerDimensions: getDockedLayerManagerDimensions,
+  getDockedLayerManagerPosition: getDockedLayerManagerPosition,
   getDockedLayerManagerSize: getDockedLayerManagerSize,
   getFirstMap: getFirstMap,
   getFirstMapId: getFirstMapId,
   getHarmonieInitialProps: getHarmonieInitialProps,
+  getIsClockOptionsMenuVisible: getIsClockOptionsMenuVisible,
   getIsClockVisible: getIsClockVisible,
   getIsEnabledLayersForMapDimension: getIsEnabledLayersForMapDimension,
   getIsLayerActiveLayer: getIsLayerActiveLayer,
@@ -6604,18 +6950,25 @@ genericListener.startListening({
             payload = _ref.payload;
             listenerApi.cancelActiveListeners();
             value = payload.value, origin = payload.origin;
-            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));
-              }
+            if (!(value !== null && value !== void 0 && value.currentTime)) {
+              _context.next = 8;
+              break;
             }
-          case 4:
+            currentTime = value.currentTime;
+            /* Test if the current is according to the expected time format */
+            if (setTimeValidatorRexexp.test(currentTime)) {
+              _context.next = 8;
+              break;
+            }
+            console.error("setTime value ".concat(currentTime, " does not conform to format [YYYY-MM-DDThh:mm:ssZ]. It was triggered by ").concat(origin));
+            // Do not do anything
+            return _context.abrupt("return");
+          case 8:
+            // SetTimeSyncProps contains besides currenttime many other props. Set these.
+            targets = getTargets(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETTIME);
+            groups = getTargetGroups(listenerApi.getState(), payload, SYNCGROUPS_TYPE_SETTIME);
+            listenerApi.dispatch(setTimeSync(payload, targets, groups));
+          case 11:
           case "end":
             return _context.stop();
         }
@@ -7062,6 +7415,16 @@ var olMetronomeHandler = function olMetronomeHandler(timerIds, listenerApi) {
           }
         });
       }
+      if (!targets.some(function (target) {
+        return target.targetId === timerId;
+      })) {
+        targets.push({
+          targetId: timerId,
+          value: {
+            currentTime: ''
+          }
+        });
+      }
       var timerIsInDwell = handleTimerDwell(timerId, animationListValues.length);
       // Collect all layers for this syncgroups target
       var reduxLayers = [];
@@ -7156,9 +7519,23 @@ mapListener.startListening({
         return;
       }
       var autoUpdateLayerId = getAutoUpdateLayerId(listenerApi.getState(), mapId);
+      var autoTimeStepLayerId = getAutoTimeStepLayerId(listenerApi.getState(), mapId);
+      var autoUpdateLayerHasTimeDimension = autoUpdateLayerId ? getLayerHasTimeDimension(listenerApi.getState(), autoUpdateLayerId) : false;
+      var autoTimeStepLayerHasTimeDimension = autoTimeStepLayerId ? getLayerHasTimeDimension(listenerApi.getState(), autoTimeStepLayerId) : false;
       var shouldAutoUpdate = isAutoUpdating(listenerApi.getState(), mapId);
       var prevTimeDimension = getLayerTimeDimension(listenerApi.getState(), layerId);
-      var isAutoUpdateLayer = layerId === autoUpdateLayerId;
+      var hasAutoLayers = !!autoUpdateLayerId && !!autoTimeStepLayerId;
+      var isAutoLayerValid = hasAutoLayers && autoUpdateLayerHasTimeDimension && autoTimeStepLayerHasTimeDimension;
+      var hasTimeDimension = !!newTimeDimension;
+      var shouldSetAutoLayer = !isAutoLayerValid && hasTimeDimension;
+      if (shouldSetAutoLayer) {
+        listenerApi.dispatch(mapActions.setAutoLayerId({
+          mapId: mapId,
+          layerId: layerId
+        }));
+      }
+      var effectiveAutoUpdateLayerId = shouldSetAutoLayer ? layerId : autoUpdateLayerId;
+      var isAutoUpdateLayer = layerId === effectiveAutoUpdateLayerId;
       var incomingMaxTime = newTimeDimension === null || newTimeDimension === void 0 ? void 0 : newTimeDimension.maxValue;
       var isIncomingMaxTimeLaterThanCurrentLayerTime = incomingMaxTime && (prevTimeDimension === null || prevTimeDimension === void 0 ? void 0 : prevTimeDimension.currentValue) && prevTimeDimension.currentValue !== incomingMaxTime;
       if (isAutoUpdateLayer &&
@@ -7380,7 +7757,7 @@ mapListener.startListening({
   actionCreator: mapActions.setMapPreset,
   effect: function () {
     var _effect2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref6, listenerApi) {
-      var payload, mapId, initialProps, mapPreset, _mapPreset$dimensions, layers, activeLayerId, autoTimeStepLayerId, autoUpdateLayerId, proj, shouldAutoUpdate, shouldAnimate, animationPayload, toggleTimestepAuto, showTimeSlider, displayMapPin, shouldShowZoomControls, shouldShowLegend, shouldShowDataExplorer, dockedLayerManagerSize, timeSliderSpan, toggleTimeSpanAuto, defaultOverlayer, isClockVisible, clockPosition, clockSize, _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, timeAlreadySet, endTime, startTime, centerTimeInSeconds, animationEnd, _startTime, duration, _animationEnd, animationStart, shouldOpenLegend, legendId, fiveMinuteDelayForAnimation, _animationEnd2, _animationStart;
+      var payload, mapId, initialProps, mapPreset, _mapPreset$dimensions, layers, activeLayerId, autoTimeStepLayerId, autoUpdateLayerId, proj, shouldAutoUpdate, shouldAnimate, animationPayload, toggleTimestepAuto, showTimeSlider, displayMapPin, shouldShowZoomControls, shouldShowLegend, shouldShowDockedLayerManager, shouldShowDataExplorer, dockedLayerManagerSize, dockedLayerManagerPosition, dockedLayerManagerDimensions, timeSliderSpan, toggleTimeSpanAuto, defaultOverlayer, isClockVisible, isClockOptionsMenuVisible, clockPosition, clockSize, _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, timeAlreadySet, endTime, startTime, centerTimeInSeconds, animationEnd, _startTime, duration, _animationEnd, animationStart, shouldOpenLegend, legendId, dockedLayerManagerType, fiveMinuteDelayForAnimation, _animationEnd2, _animationStart;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -7389,10 +7766,10 @@ mapListener.startListening({
             mapId = payload.mapId, initialProps = payload.initialProps;
             mapPreset = initialProps.mapPreset;
             if (!mapPreset) {
-              _context2.next = 56;
+              _context2.next = 62;
               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, defaultOverlayer = mapPreset.defaultOverlayer, isClockVisible = mapPreset.isClockVisible, clockPosition = mapPreset.clockPosition, clockSize = mapPreset.clockSize;
+            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, shouldShowDockedLayerManager = mapPreset.shouldShowDockedLayerManager, shouldShowDataExplorer = mapPreset.shouldShowDataExplorer, dockedLayerManagerSize = mapPreset.dockedLayerManagerSize, dockedLayerManagerPosition = mapPreset.dockedLayerManagerPosition, dockedLayerManagerDimensions = mapPreset.dockedLayerManagerDimensions, timeSliderSpan = mapPreset.timeSliderSpan, toggleTimeSpanAuto = mapPreset.toggleTimeSpanAuto, defaultOverlayer = mapPreset.defaultOverlayer, isClockVisible = mapPreset.isClockVisible, isClockOptionsMenuVisible = mapPreset.isClockOptionsMenuVisible, clockPosition = mapPreset.clockPosition, clockSize = mapPreset.clockSize;
             _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
@@ -7525,6 +7902,13 @@ mapListener.startListening({
                 isClockVisible: isClockVisible
               }));
             }
+            if (isClockOptionsMenuVisible) {
+              // toggle clock options menu visibility
+              listenerApi.dispatch(mapActions.toggleClockOptions({
+                mapId: mapId,
+                isClockOptionsMenuVisible: isClockOptionsMenuVisible
+              }));
+            }
             if (clockPosition !== undefined) {
               // set clock position
               listenerApi.dispatch(mapActions.setClockPositionSize({
@@ -7658,15 +8042,40 @@ mapListener.startListening({
                 dockedLayerManagerSize: dockedLayerManagerSize
               }));
             }
-          case 46:
+            dockedLayerManagerType = "".concat(DialogTypes.DockedLayerManager, "-").concat(mapId);
+            if (shouldShowDockedLayerManager !== undefined) {
+              listenerApi.dispatch(uiActions.setToggleOpenDialog({
+                type: dockedLayerManagerType,
+                setOpen: shouldShowDockedLayerManager
+              }));
+            }
+            if (shouldShowDockedLayerManager) {
+              listenerApi.dispatch(uiActions.setToggleOpenDialog({
+                type: DialogTypes.LayerManager,
+                setOpen: false
+              }));
+            }
+            if (dockedLayerManagerPosition) {
+              listenerApi.dispatch(mapActions.setDockedLayerManagerPosition({
+                mapId: mapId,
+                dockedLayerManagerPosition: dockedLayerManagerPosition
+              }));
+            }
+            if (dockedLayerManagerDimensions) {
+              listenerApi.dispatch(mapActions.setDockedLayerManagerDimensions({
+                mapId: mapId,
+                dockedLayerManagerDimensions: dockedLayerManagerDimensions
+              }));
+            }
+          case 52:
             if (!(animationEndTime && (shouldEndtimeOverride || !(shouldAutoUpdate || shouldAnimate)))) {
-              _context2.next = 56;
+              _context2.next = 62;
               break;
             }
             fiveMinuteDelayForAnimation = 1000 * 60 * 5; // eslint-disable-next-line no-await-in-loop
-            _context2.next = 50;
+            _context2.next = 56;
             return listenerApi.delay(fiveMinuteDelayForAnimation);
-          case 50:
+          case 56:
             _animationEnd2 = getAnimationEndTime(listenerApi.getState(), mapId);
             listenerApi.dispatch(mapActions.setAnimationEndTime({
               mapId: mapId,
@@ -7681,13 +8090,13 @@ mapListener.startListening({
                 minutes: 5
               }).toISOString()
             }));
-            _context2.next = 46;
+            _context2.next = 52;
             break;
-          case 56:
-            _context2.next = 61;
+          case 62:
+            _context2.next = 67;
             break;
-          case 58:
-            _context2.prev = 58;
+          case 64:
+            _context2.prev = 64;
             _context2.t0 = _context2["catch"](1);
             if (_context2.t0 instanceof Error) {
               listenerApi.dispatch(mapActions.setMapPresetError({
@@ -7695,11 +8104,11 @@ mapListener.startListening({
                 error: _context2.t0.message
               }));
             }
-          case 61:
+          case 67:
           case "end":
             return _context2.stop();
         }
-      }, _callee2, null, [[1, 58]]);
+      }, _callee2, null, [[1, 64]]);
     }));
     function effect(_x3, _x4) {
       return _effect2.apply(this, arguments);
@@ -7739,6 +8148,8 @@ mapListener.startListening({
       _mapSelectors$getData2 = _slicedToArray(_mapSelectors$getData, 2),
       dataStartTime = _mapSelectors$getData2[0],
       dataEndTime = _mapSelectors$getData2[1];
+    var hasValidDataStartTime = Number.isFinite(dataStartTime) && dataStartTime > 0 && dataStartTime < 2147483647;
+    var hasValidDataEndTime = Number.isFinite(dataEndTime) && dataEndTime > 0;
     if (dateUtils.isValid(currentTime)) {
       var makeForwardStep = function makeForwardStep() {
         // timeStep is in minutes, convert to seconds
@@ -7748,7 +8159,7 @@ mapListener.startListening({
         // This ensures 12:07 with 24h step goes to 12:00 next day, not 00:00
         var roundingStep = timeStep > 12 * 60 ? 60 : timeStep; // Use 1 hour for large steps
         var roundedTime = roundWithTimeStep(nextTime, roundingStep, 'round');
-        var newTime = Math.min(roundedTime, dataEndTime || roundedTime);
+        var newTime = hasValidDataEndTime ? Math.min(roundedTime, dataEndTime) : roundedTime;
         return dateUtils.fromUnix(newTime).toISOString();
       };
       var makeBackwardStep = function makeBackwardStep() {
@@ -7758,7 +8169,7 @@ mapListener.startListening({
         // For large timesteps (>12h), round to nearest hour instead of timestep
         var roundingStep = timeStep > 12 * 60 ? 60 : timeStep; // Use 1 hour for large steps
         var roundedTime = roundWithTimeStep(nextTime, roundingStep, 'round');
-        var newTime = Math.max(roundedTime, dataStartTime || roundedTime);
+        var newTime = hasValidDataStartTime ? Math.max(roundedTime, dataStartTime) : roundedTime;
         return dateUtils.fromUnix(newTime).toISOString();
       };
       var selectedTimeString = isForwardStep ? makeForwardStep() : makeBackwardStep();
@@ -9375,4 +9786,4 @@ var configureOpenGeoWebStore = function configureOpenGeoWebStore() {
   });
 };
 
-export { IS_LEGEND_OPEN_BY_DEFAULT, SECONDS_IN_DAY, SECONDS_IN_HOUR, commonActions, commonListener, commonReducers, commonSelectors, configureOpenGeoWebStore, createMockStore, createViewObjectForNewMap, drawingToolActions, drawingToolListener, drawingToolReducer, selectors as drawingToolSelectors, filterLayers$1 as filterLayers, genericActions, genericListener, selectors$5 as genericSelectors, getSingularDrawtoolDrawLayerId, getUserAddedServices, getViewObjectForMapId, getViewObjectForSyncGroup, initialState$3 as initialState, layerActions, layerReducer, selectors$2 as layerSelectors, types$2 as layerTypes, utils$1 as layerUtils, layersListener, constants as linkComponentTypesConstants, loadingIndicatorActions, constants$1 as loadingIndicatorConstants, loadingIndicatorReducer, selectors$4 as loadingIndicatorSelectors, mapActions, enums as mapEnums, mapListener, mapReducer, selectors$1 as mapSelectors, types$3 as mapTypes, mapUtils, metronomeListener, openlayersListener, routerActions, routerListener, routerReducer, utils as routerUtils, selectorMemoizationOptions, serviceActions, serviceListener, serviceReducer, selectors$7 as serviceSelectors, setUserAddedServices, storeMiddlewares, storeReducerMap, storeTestSettings, storeTestUtils, utils$3 as storeUtils, constants$2 as syncConstants, syncGroupsActions, syncGroupsListener, syncGroupsReducer, selector as syncGroupsSelector, selectors$6 as syncGroupsSelectors, types$1 as syncGroupsTypes, types$1 as types, uiActions, uiReducer, selectors$3 as uiSelectors, types as uiTypes, unifyReducerMaps, useSetupDialog, useUpdateSharedData };
+export { IS_LEGEND_OPEN_BY_DEFAULT, SECONDS_IN_DAY, SECONDS_IN_HOUR, commonActions, commonListener, commonReducers, commonSelectors, configureOpenGeoWebStore, constructSyncSourceDisplayName, createMockStore, createViewObjectForNewMap, drawingToolActions, drawingToolListener, drawingToolReducer, selectors as drawingToolSelectors, filterLayers$1 as filterLayers, genericActions, genericListener, selectors$5 as genericSelectors, getSingularDrawtoolDrawLayerId, getUserAddedServices, getViewObjectForMapId, getViewObjectForSyncGroup, initialState$3 as initialState, layerActions, layerReducer, selectors$2 as layerSelectors, types$2 as layerTypes, utils$1 as layerUtils, layersListener, constants as linkComponentTypesConstants, loadingIndicatorActions, constants$1 as loadingIndicatorConstants, loadingIndicatorReducer, selectors$4 as loadingIndicatorSelectors, mapActions, enums as mapEnums, mapListener, mapReducer, selectors$1 as mapSelectors, types$3 as mapTypes, mapUtils, metronomeListener, openlayersListener, routerActions, routerListener, routerReducer, utils as routerUtils, selectorMemoizationOptions, serviceActions, serviceListener, serviceReducer, selectors$7 as serviceSelectors, setUserAddedServices, storeMiddlewares, storeReducerMap, storeTestSettings, storeTestUtils, utils$3 as storeUtils, constants$2 as syncConstants, syncGroupsActions, syncGroupsListener, syncGroupsReducer, selector as syncGroupsSelector, selectors$6 as syncGroupsSelectors, types$1 as syncGroupsTypes, types$1 as types, uiActions, uiReducer, selectors$3 as uiSelectors, types as uiTypes, unifyReducerMaps, useSetupDialog, useSyncgroupTimeState, useUpdateSharedData };