qwc2 2026.4.29 → 2026.5.7

package/actions/theme.js

@@ -53,7 +53,7 @@ export function setThemeLayersList(theme) {
   };
 }
 export function finishThemeSetup(dispatch, theme, themes, layerConfigs, insertPos, permalinkLayers, externalLayerRestorer, visibleBgLayer, initialTheme, initialTask) {
-  var _theme$config;
+  var _theme$config$section, _theme$config, _theme$config2;
   // Create layer
   var themeLayer = ThemeUtils.createThemeLayer(theme, themes);
   var layers = [themeLayer];
@@ -148,7 +148,8 @@ export function finishThemeSetup(dispatch, theme, themes, layerConfigs, insertPo
     type: SWITCHING_THEME,
     switching: false
   });
-  var task = initialTask || (theme === null || theme === void 0 || (_theme$config = theme.config) === null || _theme$config === void 0 ? void 0 : _theme$config.startupTask) || (initialTheme ? ConfigUtils.getConfigProp("startupTask") : null);
+  var section = ConfigUtils.isMobile() ? "mobile" : "desktop";
+  var task = initialTask || ((_theme$config$section = theme === null || theme === void 0 || (_theme$config = theme.config) === null || _theme$config === void 0 || (_theme$config = _theme$config[section]) === null || _theme$config === void 0 ? void 0 : _theme$config.startupTask) !== null && _theme$config$section !== void 0 ? _theme$config$section : theme === null || theme === void 0 || (_theme$config2 = theme.config) === null || _theme$config2 === void 0 ? void 0 : _theme$config2.startupTask) || (initialTheme ? ConfigUtils.getConfigProp("startupTask") : null);
   if (task) {
     var mapClickAction = ConfigUtils.getPluginConfig(task.key).mapClickAction;
     dispatch(setCurrentTask(task.key, task.mode, mapClickAction, task.data));

package/components/AutoEditForm.js

@@ -50,7 +50,9 @@ var AutoEditForm = /*#__PURE__*/function (_React$Component) {
       }
       var input = null;
       var title = field.name + ":";
-      if (field.type === "boolean" || field.type === "bool") {
+      if (constraints.hidden) {
+        return null;
+      } else if (field.type === "boolean" || field.type === "bool") {
         if (_this.props.touchFriendly) {
           var boolvalue = value === "1" || value === "on" || value === "true" || value === true;
           input = /*#__PURE__*/React.createElement(ToggleSwitch, _extends({
@@ -87,12 +89,11 @@ var AutoEditForm = /*#__PURE__*/function (_React$Component) {
           values: constraints.values
         }));
       } else if (field.type === "number") {
-        var precision = constraints.step > 0 ? Math.ceil(-Math.log10(constraints.step)) : 6;
+        var precision = constraints.step > 0 ? Math.ceil(-Math.log10(constraints.step)) : 0;
         input = /*#__PURE__*/React.createElement(NumberInput, {
           decimals: precision,
           max: constraints.max,
           min: constraints.min,
-          mobile: true,
           name: field.id,
           onChange: function onChange(nr) {
             return _this.props.updateField(field.id, nr);

package/components/IdentifyViewer.js

@@ -1155,6 +1155,9 @@ var IdentifyViewer = /*#__PURE__*/function (_React$Component) {
         var _window$qwc3;
         var formatter = _Object$values[_i];
         text = formatter(attrName, text, layer, result);
+        if (/*#__PURE__*/React.isValidElement(text)) {
+          return text;
+        }
       }
       text = _this.props.attributeTransform(attrName, text, layer, result);
       text = MiscUtils.addLinkAnchors(text);

package/components/PickFeature.js

@@ -271,7 +271,8 @@ var PickFeature = /*#__PURE__*/function (_React$Component) {
             }
           }, entry.layer + ": " + ((_entry$feature$displa = entry.feature.displayname) !== null && _entry$feature$displa !== void 0 ? _entry$feature$displa : entry.feature.id));
         }) : /*#__PURE__*/React.createElement("div", {
-          className: "pick-feature-menu-querying"
+          className: "pick-feature-menu-querying",
+          key: "spinner"
         }, /*#__PURE__*/React.createElement(Spinner, null), LocaleUtils.tr("pickfeature.querying")));
       }
       return [resultsMenu, /*#__PURE__*/React.createElement(MapSelection, {

package/components/widgets/DateTimeInput.js

@@ -54,6 +54,7 @@ var DateTimeInput = /*#__PURE__*/function (_React$Component) {
     value: function render() {
       var _this2 = this;
       var parts = (this.props.value || "T").split("T");
+      parts[1] = (parts[1] || "").replace(/\+[0-9:]+$/, ''); // Strip timezone
       parts[1] = (parts[1] || "").replace(/\.\d+$/, ''); // Strip milliseconds
       return /*#__PURE__*/React.createElement(InputContainer, {
         className: "DateTimeInput"

package/icons/label.svg

@@ -0,0 +1,77 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="24"
+   height="24"
+   viewBox="0 0 24 24"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.4.3 (0d15f75042, 2025-12-25)"
+   sodipodi:docname="label.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="15.839192"
+     inkscape:cx="17.488266"
+     inkscape:cy="13.037281"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     inkscape:window-width="1920"
+     inkscape:window-height="1172"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-bbox-midpoints="true"
+     units="px"
+     inkscape:document-rotation="0"
+     inkscape:showpageshadow="2"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid4231"
+       originx="0"
+       originy="0"
+       spacingy="1"
+       spacingx="1"
+       units="px" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-290.65)">
+    <path
+       style="baseline-shift:baseline;display:inline;overflow:visible;opacity:1;vector-effect:none;stroke-linecap:round;stroke-linejoin:round;enable-background:accumulate;stop-color:#000000;stop-opacity:1"
+       d="m 4.3007813,292.43097 c -1.8095107,0 -3.30078138,1.48932 -3.3007813,3.29883 v 11 c -8e-8,1.80951 1.4912706,3.30078 3.3007813,3.30078 h 3.4882812 c 0.2921367,6e-5 0.5708031,0.11566 0.7773437,0.32227 l 1.8789068,1.87695 a 1.10011,1.10011 0 0 0 0,0.002 c 0.849893,0.84964 2.259481,0.84964 3.109375,0 a 1.10011,1.10011 0 0 0 0,-0.002 l 1.878906,-1.87695 c 0.20654,-0.20661 0.485207,-0.32221 0.777344,-0.32227 h 3.488281 C 21.508729,310.03058 23,308.53931 23,306.7298 v -11 c 0,-1.80951 -1.491271,-3.29883 -3.300781,-3.29883 z m 0,2.19922 H 19.699219 c 0.620542,0 1.101562,0.47907 1.101562,1.09961 v 11 c 0,0.62054 -0.48102,1.10156 -1.101562,1.10156 h -3.488281 c -0.874721,1.9e-4 -1.715558,0.34818 -2.333985,0.9668 L 12,310.67511 10.123047,308.79816 c -0.6184275,-0.61862 -1.459264,-0.96661 -2.3339845,-0.9668 H 4.3007813 c -0.6205423,0 -1.1015626,-0.48102 -1.1015625,-1.10156 v -11 c -1e-7,-0.62054 0.4810202,-1.09961 1.1015625,-1.09961 z"
+       id="path1" />
+  </g>
+</svg>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "qwc2",
-    "version": "2026.04.29",
+    "version": "2026.05.07",
     "description": "QGIS Web Client",
     "author": "Sourcepole AG",
     "license": "BSD-2-Clause",

package/plugins/API.js

@@ -401,7 +401,7 @@ var API = /*#__PURE__*/function (_React$Component) {
      * * `name`: An identifier
      * * `fmtFunc`: The formatter function with signature `function(name, value, layer, feature)`
      *
-     * The `fmtFunc` should return a string (which may also be a HTML fragment).
+     * The `fmtFunc` should return a string (which may also be a HTML fragment) or a React element.
      */
     _defineProperty(_this, "addIdentifyAttributeFormatter", function (name, fmtFunc) {
       window.qwc2.__attributeFormatters[name] = fmtFunc;

package/plugins/Cyclomedia.js

@@ -1,4 +1,8 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -192,6 +196,10 @@ var Cyclomedia = /*#__PURE__*/function (_React$Component) {
       return "\n            <!DOCTYPE html>\n            <html>\n            <head>\n            <script nonce=\"".concat((_window$__CSP_NONCE__ = window.__CSP_NONCE__) !== null && _window$__CSP_NONCE__ !== void 0 ? _window$__CSP_NONCE__ : '', "\" type=\"text/javascript\" src=\"https://unpkg.com/react@18.3.1/umd/react.production.min.js\"></script>\n            <script nonce=\"").concat((_window$__CSP_NONCE__2 = window.__CSP_NONCE__) !== null && _window$__CSP_NONCE__2 !== void 0 ? _window$__CSP_NONCE__2 : '', "\" type=\"text/javascript\" src=\"https://unpkg.com/react-dom@18.3.1/umd/react-dom.production.min.js\"></script>\n            <script nonce=\"").concat((_window$__CSP_NONCE__3 = window.__CSP_NONCE__) !== null && _window$__CSP_NONCE__3 !== void 0 ? _window$__CSP_NONCE__3 : '', "\" type=\"text/javascript\" src=\"https://streetsmart.cyclomedia.com/api/v").concat(_this.props.cyclomediaVersion, "/StreetSmartApi.js\"></script>\n            <script nonce=\"").concat((_window$__CSP_NONCE__4 = window.__CSP_NONCE__) !== null && _window$__CSP_NONCE__4 !== void 0 ? _window$__CSP_NONCE__4 : '', "\" type=\"text/javascript\">\n            let apiInitialized = false;\n            let initCallback = null;\n            let posCallback = null;\n            let measureCallback = null;\n\n            function initApi() {\n                StreetSmartApi.init({\n                    targetElement: document.getElementById(\"streetsmartApi\"),\n                    username: \"").concat(_this.state.username || undefined, "\",\n                    password: \"").concat(_this.state.password || undefined, "\",\n                    apiKey: \"").concat(_this.props.apikey, "\",\n                    clientId: \"").concat(_this.props.clientId, "\",\n                    loginOauth: ").concat(loginOauth, ",\n                    loginRedirectUri: \"").concat(_this.props.loginRedirectUri, "\",\n                    logoutRedirectUri: \"").concat(_this.props.logoutRedirectUri, "\",\n                    srs: \"").concat(_this.props.projection, "\",\n                    locale: \"").concat(lang, "\",\n                    configurationUrl: 'https://atlas.cyclomedia.com/configuration',\n                    addressSettings: {\n                        locale: \"us\",\n                        database: \"Nokia\"\n                    }\n                }).then(() => {\n                    apiInitialized = true;\n                    if (initCallback) {\n                        initCallback(true);\n                    }\n                }, (e) => {\n                    apiInitialized = false;\n                    if (initCallback) {\n                        initCallback(false, e.message);\n                    }\n                });\n            }\n            function openImage(posStr, crs) {\n                if (!apiInitialized) {\n                    return;\n                }\n                StreetSmartApi.open(posStr, {\n                    viewerType: StreetSmartApi.ViewerType.PANORAMA,\n                    srs: crs,\n                    panoramaViewer: {\n                         closable: false,\n                         maximizable: true,\n                         replace: true,\n                         recordingsVisible: true,\n                         navbarVisible: true,\n                         timeTravelVisible: true,\n                         measureTypeButtonVisible: true,\n                         measureTypeButtonStart: true,\n                         measureTypeButtonToggle: true,\n                     },\n                }).then((result) => {\n                    if (result && result[0]){\n                        window.panoramaViewer = result[0];\n                        window.panoramaViewer.on(StreetSmartApi.Events.panoramaViewer.IMAGE_CHANGE, changeView);\n                        window.panoramaViewer.on(StreetSmartApi.Events.panoramaViewer.VIEW_CHANGE, changeView);\n                        StreetSmartApi.on(StreetSmartApi.Events.measurement.MEASUREMENT_CHANGED, changeMeasurement);\n                        StreetSmartApi.on(StreetSmartApi.Events.measurement.MEASUREMENT_STOPPED, stopMeasurement);\n                    }\n                }).catch((reason) => {\n                    console.log('Failed to create component(s) through API: ' + reason);\n                });\n            }\n            function changeView() {\n                if (posCallback) {\n                    const recording = window.panoramaViewer.getRecording();\n                    const orientation = window.panoramaViewer.getOrientation();\n                    const pos = recording.xyz;\n                    const posData = {\n                        pos: [pos[0], pos[1]],\n                        crs: recording.srs,\n                        yaw: orientation.yaw * Math.PI / 180,\n                        hFov: orientation.hFov * Math.PI / 180.0\n                    }\n                    posCallback(posData);\n                }\n            }\n            function changeMeasurement(e) {\n                measureCallback(e.detail.activeMeasurement);\n            }\n            function stopMeasurement() {\n                measureCallback(null);\n            }\n            function registerCallbacks(_initCallback, _posCallback, _measureCallback) {\n                initCallback = _initCallback;\n                posCallback = _posCallback;\n                measureCallback = _measureCallback;\n            }\n            </script>\n            <style>\n              html, body, #streetsmartApi {height: 100%;}\n            </style>\n            </head>\n            <body style=\"margin: 0\">\n            <div id=\"streetsmartApi\">\n            </div>\n            </body>\n            </html>\n        ");
     });
     _defineProperty(_this, "addRecordingsWFS", function () {
+      // Maximum tile size in map CRS units to avoid exceeding the feature limit per request.
+      // ~1000 m in metric CRS, ~0.01° (≈ 1000 m) in geographic CRS, ~3280 ft in imperial CRS.
+      var crsUnits = CoordinatesUtils.getUnits(_this.props.mapCrs);
+      var MAX_TILE_SIZE = crsUnits === 'degrees' ? 0.01 : crsUnits === 'ft' ? 3280 : 1000;
       var layer = {
         id: 'cyclomedia-recordings',
         type: 'wfs',
@@ -202,38 +210,62 @@ var Cyclomedia = /*#__PURE__*/function (_React$Component) {
             miny = _CoordinatesUtils$rep2[1],
             maxx = _CoordinatesUtils$rep2[2],
             maxy = _CoordinatesUtils$rep2[3];
-          // Cyclomedia WFS only returns up to 3000 points per request. Split bbox in four to reduce chance of hitting the limit
-          var midx = 0.5 * (minx + maxx);
-          var midy = 0.5 * (miny + maxy);
-          var bboxes = [[minx, miny, midx, midy],
-          // Bottom left
-          [midx, miny, maxx, midy],
-          // Bottom right
-          [midx, midy, maxx, maxy],
-          // Top right
-          [minx, midy, midx, maxy] // Top left
-          ];
-          bboxes.forEach(function (bbox) {
-            var bboxstr = bbox.join(",");
-            var reqUrl = "https://atlasapi.cyclomedia.com/api/recording/wfs?service=WFS&version=1.1.0&request=GetFeature&typename=atlas:Recording&srsname=".concat(_this.props.mapCrs, "&bbox=").concat(bboxstr, "&maxFeatures=10000000");
+          var width = maxx - minx;
+          var height = maxy - miny;
+          // Cyclomedia WFS only returns up to 3000 points per request.
+          // Split the bbox into tiles so that no tile exceeds MAX_TILE_SIZE in each dimension.
+          // Each tile is expanded by OVERLAP on every side so that features on tile borders
+          // are reliably included. Duplicate features are removed afterwards via their id.
+          var OVERLAP = MAX_TILE_SIZE * 0.05; // 5 % of tile size
+          var cols = Math.max(1, Math.ceil(width / MAX_TILE_SIZE));
+          var rows = Math.max(1, Math.ceil(height / MAX_TILE_SIZE));
+          var tileW = width / cols;
+          var tileH = height / rows;
+          var tiles = [];
+          for (var row = 0; row < rows; row++) {
+            for (var col = 0; col < cols; col++) {
+              tiles.push([minx + col * tileW - OVERLAP, miny + row * tileH - OVERLAP, minx + (col + 1) * tileW + OVERLAP, miny + (row + 1) * tileH + OVERLAP]);
+            }
+          }
+          var authHeader = "Basic " + btoa(_this.state.username + ":" + _this.state.password);
+          var onError = function onError() {
+            vectorSource.removeLoadedExtent(extent);
+            failure();
+          };
+          var completed = 0;
+          var hasError = false;
+          var allFeatures = [];
+          tiles.forEach(function (tile) {
+            var bboxstr = tile.join(",");
+            var reqUrl = "https://atlasapi.cyclomedia.com/api/recording/wfs?service=WFS&version=1.1.0&request=GetFeature&typename=atlas:Recording&srsname=".concat(_this.props.mapCrs, "&bbox=").concat(bboxstr, "&maxFeatures=10000");
             var xhr = new XMLHttpRequest();
             xhr.open('GET', reqUrl);
-            xhr.setRequestHeader("Authorization", "Basic " + btoa(_this.state.username + ":" + _this.state.password));
-            var onError = function onError() {
-              vectorSource.removeLoadedExtent(extent);
-              failure();
+            xhr.setRequestHeader("Authorization", authHeader);
+            xhr.onerror = function () {
+              if (!hasError) {
+                hasError = true;
+                onError();
+              }
             };
-            xhr.onerror = onError;
             xhr.onload = function () {
+              if (hasError) {
+                return;
+              }
               if (xhr.status === 200) {
                 var features = vectorSource.getFormat().readFeatures(xhr.responseText, {
                   dataProjection: _this.props.mapCrs,
                   featureProjection: projection.getCode()
                 });
-                vectorSource.addFeatures(features);
-                success(features);
+                allFeatures.push.apply(allFeatures, _toConsumableArray(features));
               } else {
+                hasError = true;
                 onError();
+                return;
+              }
+              completed++;
+              if (completed === tiles.length) {
+                vectorSource.addFeatures(allFeatures);
+                success(allFeatures);
               }
             };
             xhr.send();

package/plugins/Editing.js

@@ -532,7 +532,7 @@ var Editing = /*#__PURE__*/function (_React$Component) {
         if (match) {
           var oldvisibility = match.sublayer.visibility;
           if (oldvisibility !== visibility && visibility !== null) {
-            var recurseDirection = !oldvisibility ? "both" : "children";
+            var recurseDirection = !oldvisibility ? "parents" : null;
             _this.props.changeLayerProperty(match.layer.id, "visibility", visibility, match.path, recurseDirection);
           }
           return oldvisibility;

package/plugins/Help.js

@@ -60,8 +60,13 @@ var Help = /*#__PURE__*/function (_React$Component) {
   return _createClass(Help, [{
     key: "componentDidMount",
     value: function componentDidMount() {
+      this.componentDidUpdate({});
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
       var _this2 = this;
-      if (this.props.bodyContentsFragmentUrl) {
+      if (this.props.bodyContentsFragmentUrl && this.props.bodyContentsFragmentUrl !== prevProps.bodyContentsFragmentUrl) {
         axios.get(this.props.bodyContentsFragmentUrl).then(function (response) {
           _this2.setState({
             body: response.data.replace('$VERSION$', process.env.BuildDate)

package/plugins/MapExport.js

@@ -351,6 +351,7 @@ var MapExport = /*#__PURE__*/function (_React$Component) {
       params.WIDTH = width;
       params.HEIGHT = height;
       params.filename = fileName;
+      params.FILTER_GEOM = _this.props.filter.filterGeom ? VectorLayerUtils.geoJSONGeomToWkt(VectorLayerUtils.reprojectGeometry(_this.props.filter.filterGeom, _this.props.map.projection, crs)) : "";
 
       // Dimension values
       _this.props.layers.forEach(function (layer) {
@@ -464,15 +465,14 @@ var MapExport = /*#__PURE__*/function (_React$Component) {
           var _layer$mapFormats;
           return layer.type === 'wms' && layer.role > LayerRole.BACKGROUND && ((_layer$mapFormats = layer.mapFormats) === null || _layer$mapFormats === void 0 ? void 0 : _layer$mapFormats.includes("application/dxf"));
         }).reverse().map(function (layer) {
-          var _layer$params$FILTER, _layer$params$FILTER_;
+          var _layer$params$FILTER;
           return {
             layer: layer,
             params: _objectSpread(_objectSpread({}, baseParams), {}, {
               LAYERS: layer.params.LAYERS,
               OPACITIES: layer.params.OPACITIES,
               STYLES: layer.params.STYLES,
-              FILTER: (_layer$params$FILTER = layer.params.FILTER) !== null && _layer$params$FILTER !== void 0 ? _layer$params$FILTER : '',
-              FILTER_GEOM: (_layer$params$FILTER_ = layer.params.FILTER_GEOM) !== null && _layer$params$FILTER_ !== void 0 ? _layer$params$FILTER_ : ''
+              FILTER: (_layer$params$FILTER = layer.params.FILTER) !== null && _layer$params$FILTER !== void 0 ? _layer$params$FILTER : ''
             })
           };
         });
@@ -596,6 +596,7 @@ _defineProperty(MapExport, "propTypes", {
   exportExternalLayers: PropTypes.bool,
   /** Template for the name of the generated files when downloading. Can contain the placeholders `{username}`, `{tenant}`, `{theme}`, `{themeTitle}`, `{timestamp}`. */
   fileNameTemplate: PropTypes.string,
+  filter: PropTypes.object,
   /** Formats to force as available even if the map capabilities report otherwise. Useful if a serviceUrl is defined in a format configuration. */
   forceAvailableFormats: PropTypes.array,
   /** Custom format export configuration. Specify a format mime-type (i.e. `application/dxf`) as key, and an array of one or more configurations as value.
@@ -640,7 +641,8 @@ var selector = function selector(state) {
   return {
     theme: state.theme.current,
     map: state.map,
-    layers: state.layers.flat
+    layers: state.layers.flat,
+    filter: state.layers.filter
   };
 };
 export default connect(selector, {

package/plugins/MapFilter.js

@@ -383,8 +383,10 @@ var MapFilter = /*#__PURE__*/function (_React$Component) {
     });
     _defineProperty(_this, "renderPredefinedFilters", function () {
       var predefinedFilters = _this.collectPredefinedFilters(_this.props.layers);
-      return Object.values(predefinedFilters).map(function (config) {
-        var _config$title, _this$state$filters$c;
+      return Object.values(predefinedFilters).filter(function (filter) {
+        return filter.id in _this.state.filters;
+      }).map(function (config) {
+        var _config$title;
         return /*#__PURE__*/React.createElement("div", {
           className: "map-filter-entry",
           key: config.id
@@ -393,7 +395,7 @@ var MapFilter = /*#__PURE__*/function (_React$Component) {
         }, /*#__PURE__*/React.createElement("span", {
           className: "map-filter-entry-title"
         }, (_config$title = config.title) !== null && _config$title !== void 0 ? _config$title : LocaleUtils.tr(config.titlemsgid)), /*#__PURE__*/React.createElement(ToggleSwitch, {
-          active: (_this$state$filters$c = _this.state.filters[config.id]) === null || _this$state$filters$c === void 0 ? void 0 : _this$state$filters$c.active,
+          active: _this.state.filters[config.id].active,
           onChange: function onChange(active) {
             return _this.toggleFilter(config.id, active);
           }

package/plugins/Redlining.js

@@ -257,7 +257,8 @@ var Redlining = /*#__PURE__*/function (_React$Component) {
       for (var _i = 0, _Object$values = Object.values(_this.props.plugins || {}); _i < _Object$values.length; _i++) {
         var plugin = _Object$values[_i];
         if (toolEnabled(plugin.cfg.key)) {
-          editButtons.push(_objectSpread(_objectSpread({}, plugin.cfg), {}, {
+          var buttonGroup = plugin.cfg.tooltype === 'draw' ? drawButtons : editButtons;
+          buttonGroup.push(_objectSpread(_objectSpread({}, plugin.cfg), {}, {
             tooltip: plugin.cfg.tooltip ? LocaleUtils.tr(plugin.cfg.tooltip) : undefined
           }));
         }
@@ -638,7 +639,7 @@ _defineProperty(Redlining, "propTypes", {
   defaultTextFillColor: PropTypes.array,
   /** Default text outline color. In format `[r, g, b, a]`. */
   defaultTextOutlineColor: PropTypes.array,
-  /** Tools to hide. Available tools: `Circle`, `Ellipse`, `Square`, `Box`, `HandDrawing`, `Transform`, `NumericInput`, `Buffer`, `Export`. */
+  /** Tools to hide. Available tools: `Circle`, `Ellipse`, `Square`, `Box`, `HandDrawing`, `Transform`, `NumericInput`, `Buffer`, `FeatureLabel`, `Export`. */
   hiddenTools: PropTypes.array,
   layers: PropTypes.array,
   mapCrs: PropTypes.string,

package/plugins/map/EditingSupport.js

@@ -37,7 +37,9 @@ import { setEditContext } from '../../actions/editing';
 import LocationRecorder from '../../components/LocationRecorder';
 import MeasureSwitcher from '../../components/MeasureSwitcher';
 import { BottomToolPortalContext } from '../../components/PluginsContainer';
+import ButtonBar from '../../components/widgets/ButtonBar';
 import FeatureStyles from "../../utils/FeatureStyles";
+import LocaleUtils from '../../utils/LocaleUtils';
 import MeasureUtils from '../../utils/MeasureUtils';
 
 /**
@@ -49,6 +51,7 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
     _classCallCheck(this, EditingSupport);
     _this = _callSuper(this, EditingSupport, [props]);
     _defineProperty(_this, "state", {
+      activeEditTool: 'Node',
       showRecordLocation: false,
       measurements: {
         showmeasurements: false,
@@ -56,6 +59,11 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
         areaUnit: 'metric'
       }
     });
+    _defineProperty(_this, "setEditMode", function (action) {
+      _this.setState({
+        activeEditTool: action
+      }, _this.setEditInteraction);
+    });
     _defineProperty(_this, "changeMeasurementState", function (diff) {
       _this.setState(function (state) {
         return {
@@ -95,7 +103,7 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
       }
       _this.currentLayer = _this.layers[_this.props.editContext.id];
     });
-    _defineProperty(_this, "addDrawInteraction", function () {
+    _defineProperty(_this, "setDrawInteraction", function () {
       _this.reset();
       _this.setCurrentLayer();
       var geomType = _this.props.editContext.geomType.replace(/Z$/, '');
@@ -126,7 +134,7 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
         showRecordLocation: ["Point", "LineString", "MultiPoint", "MultiLineString"].includes(geomType)
       });
     });
-    _defineProperty(_this, "addEditInteraction", function () {
+    _defineProperty(_this, "setEditInteraction", function () {
       var _this$props$editConte;
       _this.reset();
       _this.setCurrentLayer();
@@ -135,26 +143,42 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
       _this.currentFeature.on('change', _this.updateMeasurements);
       _this.updateMeasurements();
       _this.currentLayer.getSource().addFeature(_this.currentFeature);
-      var modifyInteraction = new ol.interaction.Modify({
-        features: new ol.Collection([_this.currentFeature]),
-        condition: function condition(event) {
-          return event.originalEvent.buttons === 1;
-        },
-        deleteCondition: function deleteCondition(event) {
-          // delete vertices on SHIFT + click
-          if (event.type === "pointerdown" && ol.events.condition.shiftKeyOnly(event)) {
-            _this.props.map.setIgnoreNextClick(true);
-          }
-          return ol.events.condition.shiftKeyOnly(event) && ol.events.condition.singleClick(event);
-        },
-        style: FeatureStyles.sketchInteraction()
-      });
-      modifyInteraction.on('modifyend', function () {
-        _this.commitCurrentFeature();
-      }, _this);
-      modifyInteraction.setActive(_this.props.editContext.geomType && _this.props.editContext.permissions.updatable && ((_this$props$editConte = _this.props.editContext.editConfig) === null || _this$props$editConte === void 0 || (_this$props$editConte = _this$props$editConte.permissions) === null || _this$props$editConte === void 0 ? void 0 : _this$props$editConte.updatable) === true && !_this.props.editContext.geomReadOnly && !_this.props.editContext.geomNonZeroZ);
-      _this.props.map.addInteraction(modifyInteraction);
-      _this.interaction = modifyInteraction;
+      if (_this.state.activeEditTool === "Node") {
+        var modifyInteraction = new ol.interaction.Modify({
+          features: new ol.Collection([_this.currentFeature]),
+          condition: function condition(event) {
+            return event.originalEvent.buttons === 1;
+          },
+          deleteCondition: function deleteCondition(event) {
+            // delete vertices on SHIFT + click
+            if (event.type === "pointerdown" && ol.events.condition.shiftKeyOnly(event)) {
+              _this.props.map.setIgnoreNextClick(true);
+            }
+            return ol.events.condition.shiftKeyOnly(event) && ol.events.condition.singleClick(event);
+          },
+          style: FeatureStyles.sketchInteraction()
+        });
+        modifyInteraction.on('modifyend', _this.commitCurrentFeature);
+        _this.interaction = modifyInteraction;
+        _this.props.map.addInteraction(_this.interaction);
+      } else if (_this.state.activeEditTool === "Transform") {
+        var transformInteraction = new ol.interaction.Transform({
+          stretch: false,
+          keepAspectRatio: function keepAspectRatio(ev) {
+            return ol.events.condition.shiftKeyOnly(ev);
+          },
+          layers: [_this.currentLayer],
+          translateFeature: true,
+          selection: false
+        });
+        transformInteraction.on('rotateend', _this.commitCurrentFeature);
+        transformInteraction.on('translateend', _this.commitCurrentFeature);
+        transformInteraction.on('scaleend', _this.commitCurrentFeature);
+        _this.interaction = transformInteraction;
+        _this.props.map.addInteraction(_this.interaction);
+        _this.interaction.setSelection([_this.currentFeature]);
+      }
+      _this.interaction.setActive(_this.props.editContext.geomType && _this.props.editContext.permissions.updatable && ((_this$props$editConte = _this.props.editContext.editConfig) === null || _this$props$editConte === void 0 || (_this$props$editConte = _this$props$editConte.permissions) === null || _this$props$editConte === void 0 ? void 0 : _this$props$editConte.updatable) === true && !_this.props.editContext.geomReadOnly && !_this.props.editContext.geomNonZeroZ);
     });
     _defineProperty(_this, "updateMeasurements", function () {
       var _this$state$measureme;
@@ -237,16 +261,16 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
       } else if (curContext.action === 'Pick' && curContext.feature) {
         // If a feature without geometry was picked, enter draw mode, otherwise enter edit mode
         if (!curContext.feature.geometry && curContext.geomType) {
-          this.addDrawInteraction();
+          this.setDrawInteraction();
         } else {
-          this.addEditInteraction();
+          this.setEditInteraction();
         }
       } else if (curContext.action === 'Draw' && curContext.geomType) {
         // Usually, draw mode starts without a feature, but draw also can start with a pre-set geometry
         if (!(curContext.feature || {}).geometry || prevContext.id === curContext.id && prevContext.geomType !== curContext.geomType) {
-          this.addDrawInteraction();
+          this.setDrawInteraction();
         } else if ((curContext.feature || {}).geometry) {
-          this.addEditInteraction();
+          this.setEditInteraction();
         }
       } else {
         this.reset();
@@ -261,9 +285,28 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this$props$editConte2;
+      var _this$props$editConte2, _this$props$editConte3;
+      var toolbar = null;
       var locationRecorder = null;
       var measureSwitcher = null;
+      if ((_this$props$editConte2 = this.props.editContext.feature) !== null && _this$props$editConte2 !== void 0 && _this$props$editConte2.geometry) {
+        var editButtons = [{
+          key: "Node",
+          tooltip: LocaleUtils.tr("redlining.draw"),
+          icon: "nodetool"
+        }, {
+          key: "Transform",
+          tooltip: LocaleUtils.tr("redlining.transform"),
+          icon: "transformtool"
+        }];
+        toolbar = /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React.createElement(ButtonBar, {
+          active: this.state.activeEditTool,
+          buttons: editButtons,
+          key: "ButtonBar",
+          onClick: this.setEditMode,
+          tooltipPos: "top"
+        }), this.context);
+      }
       if (this.state.showRecordLocation && this.props.editContext.geomType) {
         var geomType = this.props.editContext.geomType.replace(/Z$/, '');
         locationRecorder = /*#__PURE__*/React.createElement(LocationRecorder, {
@@ -273,16 +316,15 @@ var EditingSupport = /*#__PURE__*/function (_React$Component) {
           map: this.props.map
         });
       }
-      if (this.props.editContext.action === "Draw" || (_this$props$editConte2 = this.props.editContext.feature) !== null && _this$props$editConte2 !== void 0 && _this$props$editConte2.geometry) {
+      if (this.props.editContext.action === "Draw" || (_this$props$editConte3 = this.props.editContext.feature) !== null && _this$props$editConte3 !== void 0 && _this$props$editConte3.geometry) {
         measureSwitcher = /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React.createElement(MeasureSwitcher, {
           changeMeasureState: this.changeMeasurementState,
           geomType: this.props.editContext.geomType,
-          iconSize: "large",
           key: "MeasureSwitcher",
           measureState: this.state.measurements
         }), this.context);
       }
-      return [measureSwitcher, locationRecorder];
+      return [toolbar, measureSwitcher, locationRecorder];
     }
   }]);
 }(React.Component);

package/plugins/map/RedliningSupport.js

@@ -176,11 +176,12 @@ var RedliningSupport = /*#__PURE__*/function (_React$Component) {
       return _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, isText ? "textOutlineColor" : "borderColor", styleOptions.strokeColor), "strokeDash", styleOptions.strokeDash), "size", (styleOptions.strokeWidth - 1) * 2), isText ? "textFillColor" : "fillColor", styleOptions.fillColor), "text", label), "headmarker", styleOptions.headmarker), "tailmarker", styleOptions.tailmarker);
     });
     _defineProperty(_this, "updateFeatureStyle", function (feature) {
+      var _feature$get;
       _this.blockOnChange = true;
       var styleProps = _this.props.redlining.style;
       var isText = feature.get("shape") === "Text";
-      var styleName = isText ? "text" : "default";
-      var opts = _this.styleOptions(styleProps, isText);
+      var styleName = (_feature$get = feature.get("styleName")) !== null && _feature$get !== void 0 ? _feature$get : isText ? "text" : "default";
+      var opts = _objectSpread(_objectSpread({}, feature.get('styleOptions')), _this.styleOptions(styleProps, isText));
       if (!feature.get('measurements') && _this.selectedFeatures.length <= 1 && !(isText && !styleProps.text)) {
         feature.set('label', styleProps.text);
       }
@@ -220,12 +221,12 @@ var RedliningSupport = /*#__PURE__*/function (_React$Component) {
     _defineProperty(_this, "styleFunction", function (feature) {
       var styleOptions = feature.get("styleOptions");
       var styleName = feature.get("styleName");
+      var shape = feature.get('shape');
       var styles = [];
-      if (styleName === "text") {
+      if (shape === "Text") {
         styles.push(_this.selectedTextStyle(feature, styleOptions));
       }
       styles.push.apply(styles, _toConsumableArray(FeatureStyles[styleName](feature, styleOptions)));
-      var shape = feature.get('shape');
       var geomTypeConfig = GeomTypeConfig[shape];
       if ((geomTypeConfig || {}).drawNodes !== false) {
         styles.push(_this.selectedStyle);
@@ -618,8 +619,7 @@ var RedliningSupport = /*#__PURE__*/function (_React$Component) {
       }
     });
     _defineProperty(_this, "deselectFeature", function (feature, updateState) {
-      var styleName = feature.get("shape") === "Text" ? "text" : "default";
-      var style = FeatureStyles[styleName](feature, feature.get('styleOptions'));
+      var style = FeatureStyles[feature.get("styleName")](feature, feature.get('styleOptions'));
       feature.setStyle(style);
       feature.un('change', _this.updateMeasurements);
       _this.selectedFeatures = _this.selectedFeatures.filter(function (f) {