qwc2 2025.11.19 → 2025.11.27

package/components/StandardApp.js

@@ -199,7 +199,6 @@ var AppContainerComponent = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
-      // Filter 2D plugins
       var device = ConfigUtils.isMobile() ? 'mobile' : 'desktop';
       var pluginsConf = this.props.localConfig.plugins[device];
       return /*#__PURE__*/React.createElement(PluginsContainer, {

package/components/ThemeLayersListWindow.js

@@ -62,11 +62,13 @@ var ThemeLayersListWindow = /*#__PURE__*/function (_React$Component) {
     });
     _defineProperty(_this, "addLayers", function (sublayers) {
       _this.props.closeWindow("existinglayers");
-      var existingLayer = _this.props.layers.find(function (l) {
-        return l.type === 'wms' && l.url === _this.props.theme.url;
-      });
-      if (existingLayer) {
-        var existingSublayers = [].concat(_toConsumableArray(LayerUtils.getSublayerNames(existingLayer)), [existingLayer.name]);
+      var existingSublayers = _this.props.layers.reduce(function (res, layer) {
+        if (layer.type === 'wms' && layer.url === _this.props.theme.url) {
+          return [].concat(_toConsumableArray(res), _toConsumableArray(LayerUtils.getSublayerNames(layer)), [layer.name]);
+        }
+        return res;
+      }, []);
+      if (!isEmpty(existingSublayers)) {
         var filteredSublayers = [];
         sublayers = sublayers.filter(function (sublayer) {
           if (existingSublayers.includes(sublayer.name)) {
@@ -190,8 +192,7 @@ var ThemeLayersListWindow = /*#__PURE__*/function (_React$Component) {
         onClose: this.onClose,
         title: LocaleUtils.tr("themelayerslist.addlayerstotheme")
       }, /*#__PURE__*/React.createElement("div", {
-        className: "theme-list-window-body",
-        role: "body"
+        className: "theme-list-window-body"
       }, /*#__PURE__*/React.createElement("h4", {
         className: "theme-list-window-title"
       }, this.props.theme.title), /*#__PURE__*/React.createElement("div", {

package/components/ThemeList.js

@@ -39,6 +39,7 @@ import { setCurrentTask } from '../actions/task';
 import { setCurrentTheme, setThemeLayersList } from '../actions/theme';
 import ConfigUtils from '../utils/ConfigUtils';
 import LocaleUtils from '../utils/LocaleUtils';
+import MiscUtils from '../utils/MiscUtils';
 import ThemeUtils from '../utils/ThemeUtils';
 import Icon from './Icon';
 import './style/ThemeList.css';
@@ -96,7 +97,9 @@ var ThemeList = /*#__PURE__*/function (_React$Component) {
                 expandedGroups: _objectSpread(_objectSpread({}, state.expandedGroups), {}, _defineProperty({}, subdir.id, !expanded))
               };
             });
-          }
+          },
+          onKeyDown: MiscUtils.checkKeyActivate,
+          tabIndex: "0"
         }, _this.props.collapsibleGroups ? /*#__PURE__*/React.createElement(Icon, {
           icon: expanded ? "collapse" : "expand"
         }) : null, " ", subdir.titleMsgId ? LocaleUtils.tr(subdir.titleMsgId) : subdir.title), expanded ? _this.renderThemeGroup(subdir, filter) : null);
@@ -171,7 +174,9 @@ var ThemeList = /*#__PURE__*/function (_React$Component) {
             target: link.target
           }, link.title);
         })) : null) : null, /*#__PURE__*/React.createElement("div", {
-          className: "theme-item-body"
+          className: "theme-item-body",
+          onKeyDown: MiscUtils.checkKeyActivate,
+          tabIndex: 0
         }, item.description ? /*#__PURE__*/React.createElement("div", {
           className: "theme-item-description",
           dangerouslySetInnerHTML: {

package/components/WindowManager.js

@@ -79,7 +79,6 @@ var WindowManager = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React.createElement("iframe", {
         className: "windows-iframe-dialog-body",
         name: key,
-        role: "body",
         src: data.url
       }));
     });

package/components/map/layers/VectorLayer.js

@@ -23,6 +23,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import ol from 'openlayers';
 import FeatureStyles from '../../../utils/FeatureStyles';
 export function createFeatures(options, mapCrs) {
+  var segmentize = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   var format = new ol.format.GeoJSON();
   return (options.features || []).reduce(function (collection, featureObj) {
     var _ref, _featureObj$crs;
@@ -41,7 +42,7 @@ export function createFeatures(options, mapCrs) {
     var featureStyleOptions = _objectSpread(_objectSpread({}, options.styleOptions), featureObj.styleOptions);
     feature.set('styleName', featureStyleName);
     feature.set('styleOptions', featureStyleOptions);
-    if (featureObj.circleParams) {
+    if (featureObj.circleParams && !segmentize) {
       feature.set('circleParams', featureObj.circleParams);
       feature.setGeometry(new ol.geom.Circle(featureObj.circleParams.center, featureObj.circleParams.radius));
     }
@@ -58,6 +59,7 @@ export function createFeatures(options, mapCrs) {
   }, []);
 }
 export function updateFeatures(source, newOptions, oldOptions, mapCrs) {
+  var segmentize = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
   var format = new ol.format.GeoJSON();
   var oldFeaturesMap = (oldOptions.features || []).reduce(function (res, f) {
     res[f.id] = f;
@@ -118,7 +120,7 @@ export function updateFeatures(source, newOptions, oldOptions, mapCrs) {
         var _feature$getGeometry2;
         (_feature$getGeometry2 = _feature.getGeometry()) === null || _feature$getGeometry2 === void 0 || _feature$getGeometry2.transform(featureCrs, mapCrs);
       }
-      if (featureObj.circleParams) {
+      if (featureObj.circleParams && !segmentize) {
         _feature.setGeometry(new ol.geom.Circle(featureObj.circleParams.center, featureObj.circleParams.radius));
       }
       var featureStyleName = featureObj.styleName || newOptions.styleName;

package/components/map3d/HeightProfile3D.js

@@ -257,7 +257,6 @@ var HeightProfile = /*#__PURE__*/function (_React$Component) {
       return /*#__PURE__*/React.createElement("div", {
         className: "height-profile-chart-container",
         onMouseLeave: _this3.hideMarker,
-        role: "body",
         style: {
           position: 'relative'
         }

package/components/map3d/Map3D.js

@@ -911,7 +911,7 @@ var Map3D = /*#__PURE__*/function (_React$Component2) {
         scenePos = [scenePos];
       }
       var dtmPos = scenePos.map(function (p) {
-        return CoordinatesUtils.reproject(p, _this2.state.sceneContext.mapCrs, _this2.state.sceneContext.dtmCrs);
+        return CoordinatesUtils.reproject(p, _this2.state.sceneContext.mapCrs, _this2.state.sceneContext.dtmCrs.name);
       });
       var dtmExt = [Infinity, Infinity, -Infinity, -Infinity];
       dtmPos.forEach(function (p) {

package/components/map3d/View3DSwitcher.js

@@ -63,7 +63,8 @@ var View3DSwitcher = /*#__PURE__*/function (_React$Component) {
         },
         position: _this.props.position
       }, /*#__PURE__*/React.createElement("div", {
-        className: "view3d-switcher-buttons" + (_this.state.expanded ? " view3d-switcher-buttons-expanded" : "")
+        className: "view3d-switcher-buttons" + (_this.state.expanded ? " view3d-switcher-buttons-expanded" : ""),
+        inert: _this.state.expanded ? undefined : "true"
       }, buttons.map(function (button) {
         return /*#__PURE__*/React.createElement("button", {
           className: "map-button" + (button.mode === _this.props.view3dMode ? " map-button-active" : ""),

package/components/map3d/drawtool/NumericInput3D.js

@@ -212,8 +212,7 @@ var NumericInput3D = /*#__PURE__*/function (_React$Component) {
         scrollable: true,
         title: LocaleUtils.tr("draw3d.numericinput")
       }, /*#__PURE__*/React.createElement("div", {
-        className: "draw3d-numeric-input-body",
-        role: "body"
+        className: "draw3d-numeric-input-body"
       }, /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, LocaleUtils.tr("draw3d.position")), /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(NumberInput, {
         decimals: 0,
         disabled: disabled,

package/components/map3d/layers/VectorLayer3D.js

@@ -25,7 +25,7 @@ export default {
       name: options.name,
       source: new VectorSource({
         dataProjection: CoordinateSystem.fromSrid(projection),
-        data: createFeatures(options, projection),
+        data: createFeatures(options, projection, true),
         format: new ol.format.GeoJSON(),
         style: options.styleFunction || function (feature) {
           var styleName = options.styleName || 'default';
@@ -42,7 +42,7 @@ export default {
       layer.source.setStyle(newOptions.styleFunction);
     }
     if (newOptions.features !== oldOptions.features) {
-      updateFeatures(layer.source, newOptions, oldOptions, projection);
+      updateFeatures(layer.source, newOptions, oldOptions, projection, true);
     } else if ((oldOptions.rev || 0) !== (newOptions.rev || 0)) {
       layer.source.update();
     }

package/components/style/App.css

@@ -111,6 +111,10 @@ button.button {
     outline: none;
 }
 
+button.button:focus {
+    outline: var(--focus-outline);
+}
+
 button.button:disabled {
     background-color: var(--button-bg-color-disabled);
     color: var(--button-text-color-disabled);

package/components/style/AppMenu.css

@@ -44,7 +44,6 @@ div.AppMenu .appmenu-icon > span.icon {
     transition: color 0.25s, border-color 0.25s, background-color 0.25s;
 }
 
-
 div.AppMenu.appmenu-visible .appmenu-icon > span.icon {
     color: var(--app-submenu-text-color-hover);
     border-color: var(--app-submenu-text-color-hover);
@@ -80,14 +79,15 @@ div.AppMenu.appmenu-compact div.appmenu-menu-container {
     top: 3.5em;
 }
 
-div.AppMenu.appmenu-compact div.appmenu-menu-container:hover {
+div.AppMenu.appmenu-compact div.appmenu-menu-container:hover,
+div.AppMenu.appmenu-compact div.appmenu-menu-container:focus-within {
     right: 0;
 }
 
-div.AppMenu ul.appmenu-menu {
-    text-align: left;
-    padding: 0;
+div.AppMenu div.appmenu-menu {
     background-color: var(--app-menu-bg-color);
+    text-align: left;
+    font-size: small;
 }
 
 div.AppMenu.appmenu-visible div.appmenu-menu-container {
@@ -95,72 +95,57 @@ div.AppMenu.appmenu-visible div.appmenu-menu-container {
     opacity: 1;
 }
 
-div.AppMenu ul.appmenu-menu li {
+div.appmenu-menu-item {
+    display: flex;
+    align-items: center;
     color: var(--app-menu-text-color);
-    list-style-type: none;
-    margin: 0;
-    font-size: small;
     font-weight: bold;
 }
 
-div.AppMenu ul.appmenu-menu li:not(:last-child) {
+div.appmenu-menu-item:not(:last-child) {
     border-bottom: 1px solid var(--app-menu-text-color);
 }
 
-div.AppMenu ul.appmenu-menu > li.appmenu-leaf-active,
-div.AppMenu ul.appmenu-menu > li.appmenu-submenu-active,
-div.AppMenu ul.appmenu-menu > li.appmenu-submenu-expanded {
-    background-color: var(--app-menu-bg-color-hover);
-    color: var(--app-menu-text-color-hover);
-}
-
-div.AppMenu ul.appmenu-menu li > .icon {
-    vertical-align: middle;
+div.appmenu-menu-item > .icon {
     width: 2em;
     margin: 0.5em 1em 0.5em 1em;
 }
 
-div.AppMenu ul.appmenu-menu li.appmenu-submenu > ul {
-    background-color: var(--app-submenu-bg-color);
-    padding: 0;
-    display: none;
-}
-
-div.AppMenu ul.appmenu-menu li.appmenu-submenu-expanded > ul {
-    display: block;
+div.appmenu-menu-item-label {
+    margin: 0.25em 0;
 }
 
-div.AppMenu ul.appmenu-menu li.appmenu-submenu > ul > li {
-    color: var(--app-submenu-text-color);
+div.appmenu-menu-item-comment {
+    font-weight: normal;
+    font-size: 90%;
 }
 
-div.AppMenu ul.appmenu-menu li.appmenu-submenu > ul > li.appmenu-leaf-active,
-div.AppMenu ul.appmenu-menu li.appmenu-submenu > ul > li.appmenu-submenu-active,
-div.AppMenu ul.appmenu-menu li.appmenu-submenu > ul > li.appmenu-submenu-expanded {
-    background-color: var(--app-submenu-bg-color-hover);
-    color: var(--app-submenu-text-color-hover);
+div.appmenu-submenu-active,
+div.appmenu-submenu-expanded {
+    background-color: var(--app-menu-bg-color-hover);
+    color: var(--app-menu-text-color-hover);
 }
 
-div.AppMenu ul.appmenu-menu li.appmenu-leaf {
-    display: flex;
-    align-items: center;
+div.appmenu-menu-item-nested {
+    background-color: var(--app-submenu-bg-color);
+    color: var(--app-submenu-text-color);
 }
 
-div.AppMenu ul.appmenu-menu li.appmenu-leaf > span.icon {
-    flex: 0 0 auto;
+div.appmenu-menu-item:focus-within {
+    background-color: var(--app-menu-bg-color-hover);
+    color: var(--app-menu-text-color-hover);
+    outline: none;
 }
 
-div.AppMenu ul.appmenu-menu li.appmenu-leaf > span.appmenu-leaf-label {
-    flex: 1 1 auto;
-    margin: 0.25em 0;
+div.appmenu-menu-item-nested:focus-within {
+    background-color: var(--app-submenu-bg-color-hover);
+    color: var(--app-submenu-text-color-hover);
 }
 
-div.AppMenu ul.appmenu-menu li.appmenu-leaf div.appmenu-leaf-comment {
-    font-weight: normal;
-    font-size: 90%;
+div.appmenu-menu-item-filter {
+    padding-right: 0.5em;
 }
 
-div.appmenu-filter {
-    width: 100%;
-    margin-right: 0.5em;
+div.appmenu-menu-item-filter > div.input-container {
+    flex: 1 1 auto;
 }

package/components/style/DefaultColorScheme.css

@@ -40,6 +40,7 @@
     /* List */
     --list-bg-color: white;
     --list-section-bg-color: #ccc;
+    --list-section-bg-color-hover: #bbb;
     --list-section-text-color: #595959;
     --list-item-bg-color-even: #f0f0f0;
     --list-item-bg-color-hover: #dcdcdc;

package/components/style/PickFeature.css

@@ -1,9 +1,3 @@
-div.PickFeatureMenu {
-    border: 1px solid var(--border-color);
-    background-color: var(--list-bg-color);
-    box-shadow: 0px 2px 4px rgba(136, 136, 136, 0.5);
-}
-
 div.PickFeatureMenu > div {
     padding: 0.25em 0.5em;
 }

package/components/style/ResizeableWindow.css

@@ -102,10 +102,6 @@ div.resizeable-window-titlebar {
     flex: 0 0 2.5em;
     display: flex;
     align-items: center;
-    -moz-user-select: none;
-    -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
     padding: 0 0.25em;
 }
 

package/components/style/SearchBox.css

@@ -27,18 +27,7 @@ div.searchbox-field > div.spinner {
 }
 
 div.searchbox-results {
-    position: absolute;
-    left: 0;
-    top: 100%;
-    width: 100%;
-    max-height: calc(var(--plugins-container-height) - var(--topbar-height) - var(--bottombar-height));
-    background-color: var(--list-bg-color);
-    border-left: 1px solid var(--border-color);
-    border-right: 1px solid var(--border-color);
-    border-bottom: 1px solid var(--border-color);
-    box-shadow: 0px 2px 4px rgba(136, 136, 136, 0.5);
     overflow-x: hidden;
-    overflow-y: auto;
 }
 
 div.searchbox-results-section-title {
@@ -67,11 +56,6 @@ div.searchbox-noresults {
     color: var(--text-color-disabled);
 }
 
-div.searchbox-result:hover {
-    background-color: var(--list-item-bg-color-hover);
-    color: var(--list-item-text-color-hover);
-}
-
 div.searchbox-result-expandedinfo {
     background-color: var(--list-item-bg-color-hover);
     color: var(--list-item-text-color-hover);
@@ -116,11 +100,6 @@ div.searchbox-more-results {
     align-items: center;
 }
 
-div.searchbox-result-group {
-    margin-left: 1em;
-    border-left: 1px solid var(--list-item-bg-color-hover);
-}
-
 div.searchbox-filter-options {
     position: absolute;
     left: 0;

package/components/widgets/ColorButton.js

@@ -29,6 +29,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import React from 'react';
 import { ColorPicker } from '@vtaits/react-color-picker';
 import PropTypes from 'prop-types';
+import MiscUtils from '../../utils/MiscUtils';
 import './style/ColorButton.css';
 import '@vtaits/react-color-picker/index.css';
 var defaultColors = [
@@ -119,7 +120,9 @@ var ColorButton = /*#__PURE__*/function (_React$Component) {
         className: "ColorButton"
       }, /*#__PURE__*/React.createElement("div", {
         className: "colorbutton-icon",
-        onClick: this.togglePicker
+        onClick: this.togglePicker,
+        onKeyDown: MiscUtils.checkKeyActivate,
+        tabIndex: 0
       }, /*#__PURE__*/React.createElement("span", {
         style: {
           backgroundColor: this.cssColor(curColor)
@@ -141,7 +144,9 @@ var ColorButton = /*#__PURE__*/function (_React$Component) {
           },
           onContextMenu: function onContextMenu(ev) {
             return _this2.replaceDefaultColor(ev, idx);
-          }
+          },
+          onKeyDown: MiscUtils.checkKeyActivate,
+          tabIndex: 0
         }, /*#__PURE__*/React.createElement("span", {
           style: {
             backgroundColor: _this2.cssColor(color)

package/components/widgets/ComboBox.js

@@ -84,7 +84,6 @@ var ComboBox = /*#__PURE__*/function (_React$Component) {
     value: function render() {
       var _this2 = this;
       var children = React.Children.toArray(this.props.children);
-      var rect = this.el ? this.el.getBoundingClientRect() : null;
       var activeOption = children.filter(function (child) {
         return child.props.value === _this2.props.value;
       });
@@ -96,18 +95,23 @@ var ComboBox = /*#__PURE__*/function (_React$Component) {
         }
       }
       var filter = this.state.filter ? new RegExp(removeDiacritics(this.state.filter).replace(/[-[\]/{}()*+?.\\^$|]/g, "\\$&"), "i") : null;
+      var onClick = this.props.readOnly || isEmpty(children) ? null : function () {
+        return _this2.setState(function (state) {
+          return {
+            popup: !state.popup
+          };
+        });
+      };
       return /*#__PURE__*/React.createElement("div", {
-        className: "combobox " + (this.props.className || ""),
-        ref: function ref(el) {
-          _this2.el = el;
-        }
+        className: "combobox " + (this.props.className || "")
       }, /*#__PURE__*/React.createElement("div", {
         className: "combobox-button",
-        onClick: this.props.readOnly || isEmpty(children) ? null : function () {
-          return _this2.setState({
-            popup: true
-          });
-        }
+        onClick: onClick,
+        onKeyDown: MiscUtils.checkKeyActivate,
+        ref: function ref(el) {
+          _this2.el = el;
+        },
+        tabIndex: 0
       }, /*#__PURE__*/React.createElement("span", {
         className: "combobox-button-content"
       }, activeOption), this.props.filterable && !this.props.readOnly ? /*#__PURE__*/React.createElement("input", {
@@ -118,20 +122,17 @@ var ComboBox = /*#__PURE__*/function (_React$Component) {
       }) : null, this.props.readOnly ? null : /*#__PURE__*/React.createElement(Icon, {
         icon: "chevron-down"
       })), this.el && this.state.popup ? /*#__PURE__*/React.createElement(PopupMenu, {
+        anchor: this.el,
         className: "combobox-menu" + (this.props.menuClassName ? " " + this.props.menuClassName : ""),
         onClose: function onClose() {
           return _this2.setState({
             popup: false
           });
-        },
-        width: rect.width,
-        x: rect.left,
-        y: rect.bottom
+        }
       }, children.map(function (child, idx) {
         var classNames = classnames({
           "combobox-menu-entry": true,
           "combobox-menu-entry-active": child.props.value === _this2.props.value && !child.props.disabled,
-          "combobox-menu-entry-disabled": child.props.disabled,
           "combobox-menu-entry-group-header": child.props["data-group-header"] !== undefined
         });
         if (child.props["data-group"] !== undefined && !_this2.state.expanded.includes(child.props["data-group"])) {
@@ -143,8 +144,9 @@ var ComboBox = /*#__PURE__*/function (_React$Component) {
         var expanderIcon = _this2.state.expanded.includes(child.props["data-group-header"]) ? "collapse" : "expand";
         return /*#__PURE__*/React.createElement("div", {
           className: classNames,
+          disabled: child.props.disabled,
           key: "child:" + idx,
-          onClickCapture: function onClickCapture(ev) {
+          onClick: function onClick(ev) {
             return _this2.onChildClicked(ev, child);
           }
         }, child.props["data-group-header"] !== undefined ? /*#__PURE__*/React.createElement(Icon, {

package/components/widgets/EditableSelect.js

@@ -43,7 +43,6 @@ var EditableSelect = /*#__PURE__*/function (_React$Component) {
       popup: false
     });
     _defineProperty(_this, "renderOptions", function () {
-      var rect = _this.el.getBoundingClientRect();
       var lvalue = _this.state.value.toLowerCase();
       var options = _this.props.options.map(function (option, idx) {
         var label = EditableSelect.optionLabel(option);
@@ -52,7 +51,7 @@ var EditableSelect = /*#__PURE__*/function (_React$Component) {
         }
         return /*#__PURE__*/React.createElement("div", {
           key: "opt" + idx,
-          onClickCapture: function onClickCapture() {
+          onClick: function onClick() {
             return _this.optionSelected(option);
           },
           onMouseDown: MiscUtils.killEvent,
@@ -60,15 +59,13 @@ var EditableSelect = /*#__PURE__*/function (_React$Component) {
         }, label);
       }).filter(Boolean);
       return !isEmpty(options) ? /*#__PURE__*/React.createElement(PopupMenu, {
+        anchor: _this.el,
         className: "editable-select-dropdown",
         onClose: function onClose() {
           return _this.setState({
             popup: false
           });
-        },
-        width: rect.width,
-        x: rect.left,
-        y: rect.bottom
+        }
       }, options) : null;
     });
     _defineProperty(_this, "renderSelectedOption", function () {
@@ -116,16 +113,14 @@ var EditableSelect = /*#__PURE__*/function (_React$Component) {
       ev.target.select();
       _this.setState({
         focused: true,
-        manualInput: false,
-        popup: true
+        manualInput: false
       });
     });
     _defineProperty(_this, "onBlur", function () {
       if (!_this.props.readOnly) {
         _this.props.onChange(_this.state.value.trim());
         _this.setState({
-          focused: false,
-          popup: false
+          focused: false
         });
       }
     });