@opengeoweb/core 4.19.0 → 4.19.1

package/index.umd.js

@@ -3344,7 +3344,7 @@
       }, []);
     }, selectorMemoizationOptions);
 
-    var selectors$3 = /*#__PURE__*/Object.freeze({
+    var selectors$4 = /*#__PURE__*/Object.freeze({
         __proto__: null,
         getLayerById: getLayerById,
         getLayersById: getLayersById,
@@ -3512,7 +3512,7 @@
       return details && details.focused || false;
     });
 
-    var selectors$2 = /*#__PURE__*/Object.freeze({
+    var selectors$3 = /*#__PURE__*/Object.freeze({
         __proto__: null,
         getUiStore: getUiStore,
         getDialogDetailsByType: getDialogDetailsByType,
@@ -3909,6 +3909,156 @@
         get SyncGroupActionOrigin () { return SyncGroupActionOrigin; }
     });
 
+    /* *
+     * 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 2020 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+     * Copyright 2020 - Finnish Meteorological Institute (FMI)
+     * */
+    var syncGroupStore = function syncGroupStore(store) {
+      return store.syncronizationGroupStore || null;
+    };
+    /**
+     * Gets synchronization group state
+     *
+     * Example: synchronizationGroupState = getSynchronizationGroupState(store)
+     * @param {object} store store: object - Store object
+     * @returns {object} returnType: SynchronizationGroupState
+     */
+
+    var getSynchronizationGroupState = toolkit.createSelector(syncGroupStore, function (store) {
+      return store || null;
+    });
+    var getSynchronizationGroup = function getSynchronizationGroup(state, id) {
+      return syncGroupStore(state).groups.byId[id];
+    };
+    var getSynchronizationGroupSource = function getSynchronizationGroupSource(state, id) {
+      return syncGroupStore(state).sources.byId[id];
+    };
+    var getTargets = function getTargets(state, payload, actionType) {
+      var actionPayloads = [];
+      var targetsInActionPayload = {};
+      var syncronizationGroupStore = syncGroupStore(state);
+      /* All the groups the source is member of */
+
+      if (syncronizationGroupStore && payload) {
+        /* Backwards compatibility, if there are no groups, connect everything */
+        if (syncronizationGroupStore.groups.allIds.length === 0) {
+          syncronizationGroupStore.sources.allIds.forEach(function (targetId) {
+            // Only add if should react to this action
+            if (syncronizationGroupStore.sources.byId[targetId].types.includes(actionType)) {
+              /* Remember that we have already added this target in the action payloads, prevents adding it twice */
+              targetsInActionPayload[targetId] = true;
+              /* Compose the payload */
+
+              var newPayload = __assign({
+                targetId: targetId
+              }, payload);
+
+              actionPayloads.push(newPayload);
+            }
+          });
+        }
+
+        syncronizationGroupStore.groups.allIds.forEach(function (id) {
+          var syncronizationGroup = syncronizationGroupStore.groups.byId[id];
+
+          if (actionType === syncronizationGroup.type) {
+            /* Check if the source is in the target list of the synchonizationGroup */
+            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 && source.linked) {
+              syncronizationGroup.targets.allIds.forEach(function (targetId) {
+                var target = syncronizationGroup.targets.byId[targetId];
+
+                if (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 */
+
+                  var newPayload = __assign({
+                    targetId: targetId
+                  }, payload);
+
+                  actionPayloads.push(newPayload);
+                }
+              });
+            }
+          }
+        });
+      }
+
+      return actionPayloads;
+    };
+    var getTargetGroups = function getTargetGroups(state, payload, actionType) {
+      var syncronizationGroupStore = syncGroupStore(state);
+      var groups = syncronizationGroupStore.groups.allIds.reduce(function (list, groupId) {
+        var syncronizationGroup = syncronizationGroupStore.groups.byId[groupId];
+
+        if (actionType === syncronizationGroup.type) {
+          /* Check if the source is in the target list of the synchronizationGroup */
+          var source = syncronizationGroup.targets.byId[payload.sourceId];
+          /* If the source is part of the target list, and is linked, continue syncin the other targets */
+
+          if (source && source.linked) {
+            return list.concat(groupId);
+          }
+        }
+
+        return list;
+      }, []);
+      return groups;
+    };
+    var getAllTargetGroupsForSource = function getAllTargetGroupsForSource(state, sourceId) {
+      var syncronizationGroupStore = syncGroupStore(state);
+
+      if (syncronizationGroupStore === null || syncronizationGroupStore === void 0 ? void 0 : syncronizationGroupStore.groups) {
+        return syncronizationGroupStore.groups.allIds.reduce(function (linkedSyncGroupIds, groupId) {
+          var syncronizationGroup = syncronizationGroupStore.groups.byId[groupId];
+          var source = syncronizationGroup.targets.byId[sourceId];
+          /* If the source is part of the target list, and is linked, continue syncin the other targets */
+
+          if (source && source.linked) {
+            return linkedSyncGroupIds.concat(groupId);
+          }
+
+          return linkedSyncGroupIds;
+        }, []);
+      }
+
+      return [];
+    };
+    var syncGroupGetViewState = toolkit.createSelector(syncGroupStore, function (store) {
+      return store.viewState;
+    });
+    var getSyncedMapIdsForTimeslider = toolkit.createSelector(syncGroupStore, function (store) {
+      return store.viewState.timeslider.groups[0].selected;
+    }, selectorMemoizationOptions);
+
+    var selectors$2 = /*#__PURE__*/Object.freeze({
+        __proto__: null,
+        syncGroupStore: syncGroupStore,
+        getSynchronizationGroupState: getSynchronizationGroupState,
+        getSynchronizationGroup: getSynchronizationGroup,
+        getSynchronizationGroupSource: getSynchronizationGroupSource,
+        getTargets: getTargets,
+        getTargetGroups: getTargetGroups,
+        getAllTargetGroupsForSource: getAllTargetGroupsForSource,
+        syncGroupGetViewState: syncGroupGetViewState,
+        getSyncedMapIdsForTimeslider: getSyncedMapIdsForTimeslider
+    });
+
     /* *
      * Licensed under the Apache License, Version 2.0 (the "License");
      * you may not use this file except in compliance with the License.
@@ -3931,7 +4081,8 @@
         actions: actions,
         constants: constants,
         types: types$1,
-        initialState: initialState$4
+        initialState: initialState$4,
+        syncGroupsSelectors: selectors$2
     });
 
     /* *
@@ -5551,121 +5702,6 @@
     var reducer = slice.reducer;
     var appActions = slice.actions;
 
-    /* *
-     * 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 2020 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
-     * Copyright 2020 - Finnish Meteorological Institute (FMI)
-     * */
-    var syncGroupStore = function syncGroupStore(store) {
-      return store.syncronizationGroupStore || null;
-    };
-    /**
-     * Gets synchronization group state
-     *
-     * Example: synchronizationGroupState = getSynchronizationGroupState(store)
-     * @param {object} store store: object - Store object
-     * @returns {object} returnType: SynchronizationGroupState
-     */
-
-    var getSynchronizationGroupState = toolkit.createSelector(syncGroupStore, function (store) {
-      return store || null;
-    });
-    var getSynchronizationGroup = function getSynchronizationGroup(state, id) {
-      return syncGroupStore(state).groups.byId[id];
-    };
-    var getTargets = function getTargets(state, payload, actionType) {
-      var actionPayloads = [];
-      var targetsInActionPayload = {};
-      var syncronizationGroupStore = syncGroupStore(state);
-      /* All the groups the source is member of */
-
-      if (syncronizationGroupStore && payload) {
-        /* Backwards compatibility, if there are no groups, connect everything */
-        if (syncronizationGroupStore.groups.allIds.length === 0) {
-          syncronizationGroupStore.sources.allIds.forEach(function (targetId) {
-            // Only add if should react to this action
-            if (syncronizationGroupStore.sources.byId[targetId].types.includes(actionType)) {
-              /* Remember that we have already added this target in the action payloads, prevents adding it twice */
-              targetsInActionPayload[targetId] = true;
-              /* Compose the payload */
-
-              var newPayload = __assign({
-                targetId: targetId
-              }, payload);
-
-              actionPayloads.push(newPayload);
-            }
-          });
-        }
-
-        syncronizationGroupStore.groups.allIds.forEach(function (id) {
-          var syncronizationGroup = syncronizationGroupStore.groups.byId[id];
-
-          if (actionType === syncronizationGroup.type) {
-            /* Check if the source is in the target list of the synchonizationGroup */
-            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 && source.linked) {
-              syncronizationGroup.targets.allIds.forEach(function (targetId) {
-                var target = syncronizationGroup.targets.byId[targetId];
-
-                if (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 */
-
-                  var newPayload = __assign({
-                    targetId: targetId
-                  }, payload);
-
-                  actionPayloads.push(newPayload);
-                }
-              });
-            }
-          }
-        });
-      }
-
-      return actionPayloads;
-    };
-    var getTargetGroups = function getTargetGroups(state, payload, actionType) {
-      var syncronizationGroupStore = syncGroupStore(state);
-      var groups = syncronizationGroupStore.groups.allIds.reduce(function (list, groupId) {
-        var syncronizationGroup = syncronizationGroupStore.groups.byId[groupId];
-
-        if (actionType === syncronizationGroup.type) {
-          /* Check if the source is in the target list of the synchronizationGroup */
-          var source = syncronizationGroup.targets.byId[payload.sourceId];
-          /* If the source is part of the target list, and it linked, continue syncin the other targets */
-
-          if (source && source.linked) {
-            return list.concat(groupId);
-          }
-        }
-
-        return list;
-      }, []);
-      return groups;
-    };
-    var syncGroupGetViewState = toolkit.createSelector(syncGroupStore, function (store) {
-      return store.viewState;
-    });
-    var getSyncedMapIdsForTimeslider = toolkit.createSelector(syncGroupStore, function (store) {
-      return store.viewState.timeslider.groups[0].selected;
-    }, selectorMemoizationOptions);
-
     /* *
      * Licensed under the Apache License, Version 2.0 (the "License");
      * you may not use this file except in compliance with the License.
@@ -10998,7 +11034,9 @@
           _c = _a.layers,
           layers = _c === void 0 ? [] : _c,
           _d = _a.isEnabled,
-          isEnabled = _d === void 0 ? true : _d;
+          isEnabled = _d === void 0 ? true : _d,
+          _e = _a.tooltipPrefix,
+          tooltipPrefix = _e === void 0 ? 'Layer: ' : _e;
 
       if (!layers || !layers.length) {
         return /*#__PURE__*/React__namespace.createElement(material.Box, {
@@ -11025,10 +11063,10 @@
         onChangeLayerName(event.target.value);
       };
 
-      var _e = getRenderLayersValues(layerName, layers),
-          currentIndex = _e.currentIndex,
-          currentValue = _e.currentValue,
-          extendedLayers = _e.extendedLayers;
+      var _f = getRenderLayersValues(layerName, layers),
+          currentIndex = _f.currentIndex,
+          currentValue = _f.currentValue,
+          extendedLayers = _f.extendedLayers;
 
       var list = extendedLayers.map(function (layer) {
         return {
@@ -11037,7 +11075,7 @@
       });
       return /*#__PURE__*/React__namespace.createElement(shared.TooltipSelect, {
         disableUnderline: true,
-        tooltip: "Layer: " + ((_b = extendedLayers[currentIndex]) === null || _b === void 0 ? void 0 : _b.title),
+        tooltip: "" + tooltipPrefix + ((_b = extendedLayers[currentIndex]) === null || _b === void 0 ? void 0 : _b.title),
         inputProps: {
           SelectDisplayProps: {
             'data-testid': 'selectLayer'
@@ -11122,15 +11160,17 @@
       var currentOpacity = _a.currentOpacity,
           onLayerChangeOpacity = _a.onLayerChangeOpacity,
           _b = _a.isEnabled,
-          isEnabled = _b === void 0 ? true : _b;
+          isEnabled = _b === void 0 ? true : _b,
+          _c = _a.tooltipPrefix,
+          tooltipPrefix = _c === void 0 ? 'Opacity: ' : _c;
 
-      var _c = __read(shared.useControlledTooltip(), 2),
-          tooltipOpen = _c[0],
-          setTooltipOpen = _c[1];
+      var _d = __read(shared.useControlledTooltip(), 2),
+          tooltipOpen = _d[0],
+          setTooltipOpen = _d[1];
 
-      var _d = __read(React__namespace.useState(null), 2),
-          anchorEl = _d[0],
-          setAnchorEl = _d[1];
+      var _e = __read(React__namespace.useState(null), 2),
+          anchorEl = _e[0],
+          setAnchorEl = _e[1];
 
       var isOpen = Boolean(anchorEl);
 
@@ -11185,7 +11225,7 @@
           height: 32
         }
       }, /*#__PURE__*/React__namespace.createElement(shared.CustomTooltip, {
-        title: "Opacity: " + currentOpacityText,
+        title: "" + tooltipPrefix + currentOpacityText,
         sx: shared.tooltipContainerStyles(isEnabled),
         placement: "top",
         open: tooltipOpen
@@ -11268,7 +11308,10 @@
     var LayerManagerMenuButton = function LayerManagerMenuButton(_a) {
       var mapId = _a.mapId,
           layerId = _a.layerId,
-          onLayerDuplicate = _a.onLayerDuplicate;
+          onLayerDuplicate = _a.onLayerDuplicate,
+          _b = _a.tooltipTitle,
+          tooltipTitle = _b === void 0 ? 'Options' : _b,
+          icon = _a.icon;
 
       var onClickDuplicate = function onClickDuplicate() {
         onLayerDuplicate({
@@ -11292,7 +11335,8 @@
           action: onClickDuplicate,
           icon: /*#__PURE__*/React__namespace.createElement(theme.Copy, null)
         }],
-        tooltipTitle: "Options"
+        tooltipTitle: tooltipTitle,
+        buttonIcon: icon
       });
     };
 
@@ -11303,7 +11347,10 @@
           currentLayerStyle = _a.currentLayerStyle,
           onChangeLayerStyle = _a.onChangeLayerStyle,
           _c = _a.isEnabled,
-          isEnabled = _c === void 0 ? true : _c;
+          isEnabled = _c === void 0 ? true : _c,
+          icon = _a.icon,
+          _d = _a.tooltipPrefix,
+          tooltipPrefix = _d === void 0 ? 'Style: ' : _d;
       var styles = [{
         title: 'default',
         name: 'default',
@@ -11331,7 +11378,7 @@
         return currentStyle === style.name;
       });
       return /*#__PURE__*/React__namespace.createElement(shared.TooltipSelect, {
-        tooltip: "Style: " + ((_b = styles[currentIndex]) === null || _b === void 0 ? void 0 : _b.title),
+        tooltip: "" + tooltipPrefix + ((_b = styles[currentIndex]) === null || _b === void 0 ? void 0 : _b.title),
         inputProps: {
           SelectDisplayProps: {
             'data-testid': 'selectStyle'
@@ -11345,7 +11392,8 @@
         onChangeMouseWheel: function onChangeMouseWheel(e) {
           return onChangeLayerStyle(e.value);
         },
-        requiresCtrlToChange: true
+        requiresCtrlToChange: true,
+        IconComponent: icon
       }, /*#__PURE__*/React__namespace.createElement(material.MenuItem, {
         disabled: true
       }, "Style"), styles.map(function (styleFromlayer) {
@@ -11799,7 +11847,11 @@
     var DeleteLayerConnect = function DeleteLayerConnect(_a) {
       var layerId = _a.layerId,
           mapId = _a.mapId,
-          layerIndex = _a.layerIndex;
+          layerIndex = _a.layerIndex,
+          _b = _a.tooltipTitle,
+          tooltipTitle = _b === void 0 ? 'Delete' : _b,
+          _c = _a.icon,
+          icon = _c === void 0 ? /*#__PURE__*/React__namespace.createElement(theme.Delete, null) : _c;
       var dispatch = reactRedux.useDispatch();
       var layerDelete = React__namespace.useCallback(function (_a) {
         var mapId = _a.mapId,
@@ -11816,7 +11868,7 @@
         return getLayerEnabled(store, layerId);
       });
       return /*#__PURE__*/React__namespace.createElement(shared.CustomIconButton, {
-        tooltipTitle: "Delete",
+        tooltipTitle: tooltipTitle,
         onClick: function onClick() {
           layerDelete({
             mapId: mapId,
@@ -11826,7 +11878,7 @@
         },
         shouldShowAsDisabled: !isLayerEnabled,
         "data-testid": "deleteButton"
-      }, /*#__PURE__*/React__namespace.createElement(theme.Delete, null));
+      }, icon);
     };
 
     /* *
@@ -11852,7 +11904,10 @@
           _b = _a.isEnabled,
           isEnabled = _b === void 0 ? false : _b,
           _c = _a.layerName,
-          layerName = _c === void 0 ? '' : _c;
+          layerName = _c === void 0 ? '' : _c,
+          _d = _a.icon,
+          icon = _d === void 0 ? isEnabled ? /*#__PURE__*/React__namespace.createElement(theme.Visibility, null) : /*#__PURE__*/React__namespace.createElement(theme.VisibilityOff, null) : _d,
+          tooltipTitle = _a.tooltipTitle;
       var dispatch = reactRedux.useDispatch();
       var layerChangeEnabled = React__namespace.useCallback(function (_a) {
         var layerId = _a.layerId,
@@ -11864,9 +11919,11 @@
           origin: LayerActionOrigin.layerManager
         }));
       }, [dispatch, mapId]);
+      var normalTooltip = tooltipTitle !== null && tooltipTitle !== void 0 ? tooltipTitle : 'Toggle visibility';
+      var miniTooltip = tooltipTitle !== null && tooltipTitle !== void 0 ? tooltipTitle : layerName;
       return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(shared.CustomIconButton, {
         shouldShowAsDisabled: !isEnabled,
-        tooltipTitle: "Toggle visibility",
+        tooltipTitle: normalTooltip,
         onClick: function onClick(event) {
           event.stopPropagation();
           layerChangeEnabled({
@@ -11879,9 +11936,9 @@
         sx: {
           margin: 'auto 0px'
         }
-      }, isEnabled ? /*#__PURE__*/React__namespace.createElement(theme.Visibility, null) : /*#__PURE__*/React__namespace.createElement(theme.VisibilityOff, null)), /*#__PURE__*/React__namespace.createElement(shared.CustomIconButton, {
+      }, icon), /*#__PURE__*/React__namespace.createElement(shared.CustomIconButton, {
         shouldShowAsDisabled: !isEnabled,
-        tooltipTitle: layerName,
+        tooltipTitle: miniTooltip,
         onClick: function onClick(event) {
           event.stopPropagation();
           layerChangeEnabled({
@@ -11894,7 +11951,7 @@
         sx: {
           margin: 'auto 0px'
         }
-      }, isEnabled ? /*#__PURE__*/React__namespace.createElement(theme.Visibility, null) : /*#__PURE__*/React__namespace.createElement(theme.VisibilityOff, null)));
+      }, icon));
     };
 
     /* *
@@ -11916,7 +11973,8 @@
 
     var OpacitySelectConnect = function OpacitySelectConnect(_a) {
       var layerId = _a.layerId,
-          mapId = _a.mapId;
+          mapId = _a.mapId,
+          tooltipPrefix = _a.tooltipPrefix;
       var dispatch = reactRedux.useDispatch();
       var opacity = reactRedux.useSelector(function (store) {
         return getLayerOpacity(store, layerId);
@@ -11934,7 +11992,8 @@
             origin: LayerActionOrigin.layerManager
           }));
         },
-        isEnabled: isLayerEnabled
+        isEnabled: isLayerEnabled,
+        tooltipPrefix: tooltipPrefix
       });
     };
 
@@ -12011,7 +12070,9 @@
 
     var RenderStylesConnect = function RenderStylesConnect(_a) {
       var layerId = _a.layerId,
-          mapId = _a.mapId;
+          mapId = _a.mapId,
+          icon = _a.icon,
+          tooltipPrefix = _a.tooltipPrefix;
       var dispatch = reactRedux.useDispatch();
       var layerService = reactRedux.useSelector(function (store) {
         return getLayerService(store, layerId);
@@ -12040,7 +12101,9 @@
         layerStyles: layerStyles,
         currentLayerStyle: currentLayerStyle,
         onChangeLayerStyle: layerChangeStyle,
-        isEnabled: isLayerEnabled
+        isEnabled: isLayerEnabled,
+        icon: icon,
+        tooltipPrefix: tooltipPrefix
       });
     };
 
@@ -12063,7 +12126,8 @@
 
     var RenderLayersConnect = function RenderLayersConnect(_a) {
       var layerId = _a.layerId,
-          mapId = _a.mapId;
+          mapId = _a.mapId,
+          tooltipPrefix = _a.tooltipPrefix;
       var dispatch = reactRedux.useDispatch();
       var layerName = reactRedux.useSelector(function (store) {
         return getLayerName(store, layerId);
@@ -12150,7 +12214,8 @@
             name: name
           });
         },
-        isEnabled: isLayerEnabled
+        isEnabled: isLayerEnabled,
+        tooltipPrefix: tooltipPrefix
       });
     };
 
@@ -12173,7 +12238,9 @@
 
     var LayerManagerMenuButtonConnect = function LayerManagerMenuButtonConnect(_a) {
       var layerId = _a.layerId,
-          mapId = _a.mapId;
+          mapId = _a.mapId,
+          tooltipTitle = _a.tooltipTitle,
+          icon = _a.icon;
       var dispatch = reactRedux.useDispatch();
       var layer = reactRedux.useSelector(function (store) {
         return getLayerById(store, layerId);
@@ -12198,7 +12265,9 @@
             mapId: mapId,
             layer: layer
           });
-        }
+        },
+        tooltipTitle: tooltipTitle,
+        icon: icon
       });
     };
 
@@ -12362,12 +12431,13 @@
      * */
 
     var LayerRowConnect = function LayerRowConnect(_a) {
-      var _b;
+      var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
 
       var layerId = _a.layerId,
           mapId = _a.mapId,
           dragHandle = _a.dragHandle,
-          layerIndex = _a.layerIndex;
+          layerIndex = _a.layerIndex,
+          settings = _a.settings;
       var isEnabled = reactRedux.useSelector(function (store) {
         return getLayerEnabled(store, layerId);
       });
@@ -12396,15 +12466,19 @@
           layerId: layerId,
           mapId: mapId,
           isEnabled: isEnabled,
-          layerName: fullLayerName || layerName
+          layerName: fullLayerName || layerName,
+          icon: isEnabled ? (_c = settings === null || settings === void 0 ? void 0 : settings.enableLayer) === null || _c === void 0 ? void 0 : _c.enabledIcon : (_d = settings === null || settings === void 0 ? void 0 : settings.enableLayer) === null || _d === void 0 ? void 0 : _d.disabledIcon,
+          tooltipTitle: isEnabled ? (_e = settings === null || settings === void 0 ? void 0 : settings.enableLayer) === null || _e === void 0 ? void 0 : _e.enabledTooltipTitle : (_f = settings === null || settings === void 0 ? void 0 : settings.enableLayer) === null || _f === void 0 ? void 0 : _f.disabledTooltipTitle
         }),
         layerOpacityLayout: /*#__PURE__*/React__namespace.createElement(OpacitySelectConnect, {
           layerId: layerId,
-          mapId: mapId
+          mapId: mapId,
+          tooltipPrefix: (_g = settings === null || settings === void 0 ? void 0 : settings.opacity) === null || _g === void 0 ? void 0 : _g.tooltipPrefix
         }),
         layerServicesLayout: /*#__PURE__*/React__namespace.createElement(RenderLayersConnect, {
           layerId: layerId,
-          mapId: mapId
+          mapId: mapId,
+          tooltipPrefix: (_h = settings === null || settings === void 0 ? void 0 : settings.renderLayer) === null || _h === void 0 ? void 0 : _h.tooltipPrefix
         }),
         layerDimensionLayout: /*#__PURE__*/React__namespace.createElement(DimensionSelectConnect, {
           layerId: layerId,
@@ -12412,16 +12486,22 @@
         }),
         layerStylesLayout: /*#__PURE__*/React__namespace.createElement(RenderStylesConnect, {
           layerId: layerId,
-          mapId: mapId
+          mapId: mapId,
+          tooltipPrefix: (_j = settings === null || settings === void 0 ? void 0 : settings.layerStyle) === null || _j === void 0 ? void 0 : _j.tooltipPrefix,
+          icon: (_k = settings === null || settings === void 0 ? void 0 : settings.layerStyle) === null || _k === void 0 ? void 0 : _k.icon
         }),
         layerDeleteLayout: /*#__PURE__*/React__namespace.createElement(DeleteLayerConnect, {
           mapId: mapId,
           layerId: layerId,
-          layerIndex: layerIndex
+          layerIndex: layerIndex,
+          tooltipTitle: (_l = settings === null || settings === void 0 ? void 0 : settings.deleteLayer) === null || _l === void 0 ? void 0 : _l.tooltipTitle,
+          icon: (_m = settings === null || settings === void 0 ? void 0 : settings.deleteLayer) === null || _m === void 0 ? void 0 : _m.icon
         }),
         layerMenuLayout: /*#__PURE__*/React__namespace.createElement(LayerManagerMenuButtonConnect, {
           mapId: mapId,
-          layerId: layerId
+          layerId: layerId,
+          tooltipTitle: (_o = settings === null || settings === void 0 ? void 0 : settings.menu) === null || _o === void 0 ? void 0 : _o.tooltipTitle,
+          icon: (_p = settings === null || settings === void 0 ? void 0 : settings.menu) === null || _p === void 0 ? void 0 : _p.icon
         }),
         layerActiveLayout: /*#__PURE__*/React__namespace.createElement(ActivateLayerConnect, {
           mapId: mapId,
@@ -12457,10 +12537,16 @@
           _d = _a.hideTooltip,
           hideTooltip = _d === void 0 ? true : _d,
           _e = _a.isSorting,
-          isSorting = _e === void 0 ? false : _e;
-      var tooltipTitle = hideTooltip ? '' : TOOLTIP_TITLE;
+          isSorting = _e === void 0 ? false : _e,
+          _f = _a.icon,
+          icon = _f === void 0 ? /*#__PURE__*/React__default["default"].createElement(theme.DragHandle, {
+        "data-testid": "dragHandleIcon"
+      }) : _f,
+          _g = _a.tooltipTitle,
+          tooltipTitle = _g === void 0 ? TOOLTIP_TITLE : _g;
+      var usedTooltipTitle = hideTooltip ? '' : tooltipTitle;
       return /*#__PURE__*/React__default["default"].createElement(shared.CustomIconButton, {
-        tooltipTitle: tooltipTitle,
+        tooltipTitle: usedTooltipTitle,
         "data-testid": "dragHandle" + (index !== undefined ? "-" + index : ''),
         className: "handle",
         tabIndex: -1,
@@ -12479,7 +12565,7 @@
             color: 'geowebColors.greys.accessible'
           }
         }
-      }, /*#__PURE__*/React__default["default"].createElement(theme.DragHandle, null));
+      }, icon);
     };
 
     /* *
@@ -12500,7 +12586,8 @@
      * */
 
     var LayerContainerRow = function LayerContainerRow(_a) {
-      var mapId = _a.mapId;
+      var mapId = _a.mapId,
+          settings = _a.settings;
       var dispatch = reactRedux.useDispatch();
 
       var _b = __read(React__namespace.useState(false), 2),
@@ -12622,6 +12709,8 @@
           width: '100%'
         }
       }, layerIds.map(function (layerId, index) {
+        var _a, _b;
+
         return /*#__PURE__*/React__namespace.createElement(LayerRowConnect, {
           mapId: mapId,
           layerId: layerId,
@@ -12631,8 +12720,11 @@
             isDisabled: isDragDisabled,
             index: index,
             hideTooltip: isSorting || isDragDisabled,
-            isSorting: isSorting
-          })
+            isSorting: isSorting,
+            icon: (_a = settings === null || settings === void 0 ? void 0 : settings.dragHandle) === null || _a === void 0 ? void 0 : _a.icon,
+            tooltipTitle: (_b = settings === null || settings === void 0 ? void 0 : settings.dragHandle) === null || _b === void 0 ? void 0 : _b.tooltipTitle
+          }),
+          settings: settings
         });
       })));
     };
@@ -13837,7 +13929,8 @@
         source: source,
         settings: settings === null || settings === void 0 ? void 0 : settings.header
       }), /*#__PURE__*/React__namespace.createElement(LayerContainerRow, {
-        mapId: mapId
+        mapId: mapId,
+        settings: settings === null || settings === void 0 ? void 0 : settings.content
       }), /*#__PURE__*/React__namespace.createElement(BaseLayerRow, {
         mapId: mapId,
         tooltip: "Add base layers",
@@ -28012,7 +28105,8 @@
         if (isChecked) {
           syncGroupRemoveTarget({
             groupId: String(groupId),
-            targetId: String(sourceId)
+            targetId: String(sourceId),
+            origin: 'user'
           });
         } else {
           var groups = syncGroupViewState[groupCategory].groups;
@@ -28025,7 +28119,8 @@
               if (group.id !== groupId && group.selected.includes(sourceId)) {
                 syncGroupRemoveTarget({
                   groupId: String(group.id),
-                  targetId: String(sourceId)
+                  targetId: String(sourceId),
+                  origin: 'user'
                 });
               }
             }
@@ -28044,7 +28139,8 @@
 
           syncGroupAddTarget({
             groupId: String(groupId),
-            targetId: String(sourceId)
+            targetId: String(sourceId),
+            origin: 'user'
           });
         }
       };
@@ -28805,7 +28901,7 @@
     exports.getWMLayerById = getWMLayerById;
     exports.layerActions = layerActions;
     exports.layerReducer = reducer$8;
-    exports.layerSelectors = selectors$3;
+    exports.layerSelectors = selectors$4;
     exports.layerTypes = types$3;
     exports.mapActions = mapActions;
     exports.mapModuleConfig = moduleConfig;
@@ -28823,13 +28919,14 @@
     exports.snackbarActions = snackbarActions;
     exports.store = store;
     exports.syncGroupActions = genericActions;
+    exports.syncGroupsSelectors = selectors$2;
     exports.synchronizationGroupModuleConfig = synchronizationGroupConfig;
     exports.synchronizationGroupsConfig = synchronizationGroupConfig;
     exports.testLayers = testLayers;
     exports.timeSliderUtils = timeSliderUtils;
     exports.uiActions = uiActions;
     exports.uiModuleConfig = uiModuleConfig;
-    exports.uiSelectors = selectors$2;
+    exports.uiSelectors = selectors$3;
     exports.uiTypes = types;
     exports.unRegisterWMJSLayer = unRegisterWMJSLayer;
     exports.unRegisterWMJSMap = unRegisterWMJSMap;