@mapcomponents/react-maplibre 0.1.76 → 0.1.77

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Change Log
 
+## [v0.1.77] - 2023-04-05
+
+
+### Fixed
+- 92bac5c: remove deprecated @mui/styles dependency; fixes npm compatibility
+
+### Added
+- 6512e26: add name prop to MlWmsLoader
+
+### Changed
+- 6512e26: make AddLayerPopup initial config state configurable
+- 6512e26: make MlWmsLoader featureInfoActive controllable from parent component
+- 6512e26: make LayerListItemFactory control featureInfoActive to always reflect the state in LayerConfig
+
+### Added
+
 ## [v0.1.76] - 2023-04-04
 
 ### Fixed

package/dist/components/MlWmsLoader/MlWmsLoader.d.ts

@@ -34,7 +34,10 @@ export interface MlWmsLoaderProps {
     zoomToExtent?: boolean;
     lngLat?: LngLat;
     idPrefix?: string;
+    name?: string;
     featureInfoEnabled?: boolean;
+    featureInfoActive?: boolean;
+    setFeatureInfoActive?: (val: boolean | ((current: boolean) => boolean)) => void;
     config?: WmsConfig;
     onConfigChange?: (config: WmsConfig | false) => void;
     setLayers?: (layers: LayerType[]) => void;

package/dist/index.esm.js

@@ -6395,8 +6395,8 @@ var MlWmsLoader = function (props) {
     }, [_capabilities]);
     var name = React.useMemo(function () {
         var _a, _b;
-        return ((_a = props === null || props === void 0 ? void 0 : props.config) === null || _a === void 0 ? void 0 : _a.name) || ((_b = capabilities === null || capabilities === void 0 ? void 0 : capabilities.Service) === null || _b === void 0 ? void 0 : _b.Title);
-    }, [(_f = props === null || props === void 0 ? void 0 : props.config) === null || _f === void 0 ? void 0 : _f.name, (_g = capabilities === null || capabilities === void 0 ? void 0 : capabilities.Service) === null || _g === void 0 ? void 0 : _g.Title]);
+        return (props === null || props === void 0 ? void 0 : props.name) || ((_a = props === null || props === void 0 ? void 0 : props.config) === null || _a === void 0 ? void 0 : _a.name) || ((_b = capabilities === null || capabilities === void 0 ? void 0 : capabilities.Service) === null || _b === void 0 ? void 0 : _b.Title);
+    }, [props === null || props === void 0 ? void 0 : props.name, (_f = props === null || props === void 0 ? void 0 : props.config) === null || _f === void 0 ? void 0 : _f.name, (_g = capabilities === null || capabilities === void 0 ? void 0 : capabilities.Service) === null || _g === void 0 ? void 0 : _g.Title]);
     var layers = React.useMemo(function () {
         var _a;
         if (!(props === null || props === void 0 ? void 0 : props.setLayers))
@@ -6490,10 +6490,11 @@ var MlWmsLoader = function (props) {
             .catch(function (error) { return console.log(error); });
     }, [capabilities, getFeatureInfoUrl, props, mapHook, layers]);
     var _featureInfoEventsEnabled = React.useMemo(function () {
-        return (featureInfoEventsEnabled &&
+        return (((typeof (props === null || props === void 0 ? void 0 : props.featureInfoActive) !== 'undefined' && props.featureInfoActive) ||
+            featureInfoEventsEnabled) &&
             (layers === null || layers === void 0 ? void 0 : layers.some(function (layer) { return layer.visible && layer.queryable; })) &&
             !!mapHook.map);
-    }, [featureInfoEventsEnabled, layers, mapHook.map]);
+    }, [props === null || props === void 0 ? void 0 : props.featureInfoActive, featureInfoEventsEnabled, layers, mapHook.map]);
     React.useEffect(function () {
         if (!_featureInfoEventsEnabled) {
             resetFeatureInfo();
@@ -6572,7 +6573,14 @@ var MlWmsLoader = function (props) {
                                     return theme.palette.info.light;
                                 return theme.palette.grey[300];
                             },
-                        }, "aria-label": "featureinfo", onClick: function () { return setFeatureInfoEventsEnabled(function (current) { return !current; }); }, disabled: !(layers === null || layers === void 0 ? void 0 : layers.some(function (layer) { return layer.visible && layer.queryable; })) },
+                        }, "aria-label": "featureinfo", onClick: function () {
+                            if (typeof (props === null || props === void 0 ? void 0 : props.setFeatureInfoActive) === 'function') {
+                                props.setFeatureInfoActive(function (current) { return !current; });
+                            }
+                            else {
+                                setFeatureInfoEventsEnabled(function (current) { return !current; });
+                            }
+                        }, disabled: !(layers === null || layers === void 0 ? void 0 : layers.some(function (layer) { return layer.visible && layer.queryable; })) },
                         React__default["default"].createElement(InfoIcon__default["default"], null))),
                     React__default["default"].createElement(IconButton__default["default"], { edge: props.showDeleteButton ? false : 'end', sx: __assign({ padding: '4px', marginTop: '-3px' }, (props.showDeleteButton ? { marginRight: '4px' } : {})), "aria-label": "open", onClick: function () { return setOpen(function (current) { return !current; }); } }, open ? React__default["default"].createElement(iconsMaterial.ExpandLess, null) : React__default["default"].createElement(iconsMaterial.ExpandMore, null)),
                     props.showDeleteButton && (React__default["default"].createElement(React__default["default"].Fragment, null,
@@ -7833,7 +7841,7 @@ function LayerListItemFactory(props) {
                 layerContext.setBackgroundLayers(state === null || state === void 0 ? void 0 : state.layers);
             }, visible: true, configurable: true, type: "layer", name: "Background" })),
         props.layers.map(function (layer, idx) {
-            var _a;
+            var _a, _b;
             if (!(layer === null || layer === void 0 ? void 0 : layer.id))
                 return null;
             switch (layer.type) {
@@ -7866,6 +7874,16 @@ function LayerListItemFactory(props) {
                                     }
                                     return _layers;
                                 });
+                            }, featureInfoActive: ((_b = layer === null || layer === void 0 ? void 0 : layer.config) === null || _b === void 0 ? void 0 : _b.featureInfoActive) || false, setFeatureInfoActive: function (updateFunction) {
+                                var _a;
+                                (_a = props === null || props === void 0 ? void 0 : props.setLayers) === null || _a === void 0 ? void 0 : _a.call(props, function (current) {
+                                    var _a;
+                                    var _layers = __spreadArray([], current, true);
+                                    if (typeof updateFunction === 'function') {
+                                        _layers[idx].config.featureInfoActive = updateFunction(((_a = _layers[idx].config) === null || _a === void 0 ? void 0 : _a.featureInfoActive) || false);
+                                    }
+                                    return _layers;
+                                });
                             }, showDeleteButton: true }))));
                 default:
                     return null;
@@ -7877,7 +7895,7 @@ function LayerListItemFactory(props) {
 }
 LayerListItemFactory.defaultProps = {
     mapId: undefined,
-    layers: []
+    layers: [],
 };
 
 var types = [
@@ -7947,7 +7965,7 @@ function WmsLayerForm(props) {
 }
 
 var AddLayerPopup = function (props) {
-    var _a = React.useState(), layerConfig = _a[0], setLayerConfig = _a[1];
+    var _a = React.useState(props === null || props === void 0 ? void 0 : props.config), layerConfig = _a[0], setLayerConfig = _a[1];
     var updateLayerType = function (type) {
         setLayerConfig({ type: type, config: {} });
     };