@mapcomponents/react-maplibre 0.1.72 → 0.1.73

package/CHANGELOG.md

@@ -1,6 +1,11 @@
 # Change Log
 
 
+## [v0.1.73] - 2023-03-11
+
+### Fixed
+- 547db2c: Fix/layerlist visibility settings
+
 ## [v0.1.72] - 2023-03-08
 
 ### Fixed

package/dist/index.esm.js

@@ -703,7 +703,6 @@ var MapLibreGlWrapper = /** @class */ (function () {
                         _a.label = 2;
                     case 2:
                         self.map = new maplibreGl.Map(props.mapOptions);
-                        window['_map'] = self.map;
                         self.addNativeMaplibreFunctionsAndProps();
                         self.wrapper.refreshViewport();
                         self.wrapper.fire('viewportchange');
@@ -992,6 +991,8 @@ var MapLibreMap = function (props) {
                 onReady: function (map, wrapper) {
                     map.once('load', function () {
                         if (!(wrapper === null || wrapper === void 0 ? void 0 : wrapper.cancelled)) {
+                            // add maplibre instance to window for debugging purposes
+                            window['_map'] = map;
                             if (props.mapId) {
                                 mapContext.registerMap(props.mapId, wrapper);
                             }
@@ -6909,7 +6910,7 @@ function LayerListFolder(_a) {
 }
 
 function LayerListItemVectorLayer(_a) {
-    var configurable = _a.configurable, vtProps = _a.vtProps, setVtProps = _a.setVtProps, id = _a.id;
+    var configurable = _a.configurable, vtProps = _a.vtProps, setVtProps = _a.setVtProps, id = _a.id, props = __rest(_a, ["configurable", "vtProps", "setVtProps", "id"]);
     var _b = React.useState(false), paintPropsFormVisible = _b[0], setPaintPropsFormVisible = _b[1];
     var _c = React.useState(true), visible = _c[0], setVisible = _c[1];
     var _d = React.useState(vtProps.layers[id].paint), paintProps = _d[0], setPaintProps = _d[1];
@@ -6925,6 +6926,9 @@ function LayerListItemVectorLayer(_a) {
         }
         setVtProps(__assign(__assign({}, vtProps), { layers: _layers }));
     }, [visible, id, setVtProps, vtProps]);
+    React.useEffect(function () {
+        setVisible(!!props.visibleMaster);
+    }, [props.visibleMaster]);
     React.useEffect(function () {
         if (!setVtProps)
             return;
@@ -6972,20 +6976,22 @@ function LayerListItem(_a) {
         return localVisible;
     }, [visible, localVisible]);
     React.useEffect(function () {
-        var _a, _b;
+        var _a, _b, _c;
         if (!setLayerState || !((_a = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _a === void 0 ? void 0 : _a.layers) || _visible === visibleRef.current)
             return;
         visibleRef.current = _visible;
         var state = __assign({}, layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props);
-        state.layers = (_b = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _b === void 0 ? void 0 : _b.layers.map(function (el) {
-            if (el.layout) {
-                el.layout['visibility'] = _visible ? 'visible' : 'none';
-            }
-            else {
-                el.layout = { visibility: _visible ? 'visible' : 'none' };
-            }
-            return el;
-        });
+        if ((_b = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _b === void 0 ? void 0 : _b.layers) {
+            state.layers = (_c = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _c === void 0 ? void 0 : _c.layers.map(function (el) {
+                if (el.layout) {
+                    el.layout['visibility'] = _visible ? 'visible' : 'none';
+                }
+                else {
+                    el.layout = { visibility: _visible ? 'visible' : 'none' };
+                }
+                return el;
+            });
+        }
         setLayerState(state);
     }, [_visible, setLayerState, (_d = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _d === void 0 ? void 0 : _d.layers]);
     React.useEffect(function () {
@@ -6996,7 +7002,7 @@ function LayerListItem(_a) {
     var _layerComponent = React.useMemo(function () {
         var _a;
         if (layerComponent && type === 'layer') {
-            switch (layerComponent.type.displayName) {
+            switch (layerComponent.type.name) {
                 case 'MlWmsLayer':
                     return React__default["default"].cloneElement(layerComponent, __assign(__assign({}, layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props), { visible: _visible }));
                 case 'MlVectorTileLayer':
@@ -7040,7 +7046,7 @@ function LayerListItem(_a) {
             React__default["default"].createElement(material.ListItemText, { primary: name, primaryTypographyProps: { sx: { fontSize: '0.9rem' } }, secondary: description, secondaryTypographyProps: { sx: { fontSize: '0.7rem' } } }))),
         _layerComponent,
         !((_g = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _g === void 0 ? void 0 : _g.layers) && configurable && paintPropsFormVisible && (React__default["default"].createElement(LayerPropertyForm, { paintProps: paintProps, setPaintProps: setPaintProps, layerType: layerType })),
-        ((_h = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _h === void 0 ? void 0 : _h.layers) && (React__default["default"].createElement(LayerListFolder, { visible: localVisible, setVisible: setLocalVisible, name: name }, (_l = (_k = (_j = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _j === void 0 ? void 0 : _j.layers) === null || _k === void 0 ? void 0 : _k.map) === null || _l === void 0 ? void 0 : _l.call(_k, function (_el, idx) { return (React__default["default"].createElement(LayerListItemVectorLayer, { vtProps: layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props, setVtProps: setLayerState, id: '' + idx, key: '' + idx })); })))));
+        ((_h = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _h === void 0 ? void 0 : _h.layers) && (React__default["default"].createElement(LayerListFolder, { visible: localVisible, setVisible: setLocalVisible, name: name }, (_l = (_k = (_j = layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props) === null || _j === void 0 ? void 0 : _j.layers) === null || _k === void 0 ? void 0 : _k.map) === null || _l === void 0 ? void 0 : _l.call(_k, function (_el, idx) { return (React__default["default"].createElement(LayerListItemVectorLayer, { vtProps: layerComponent === null || layerComponent === void 0 ? void 0 : layerComponent.props, setVtProps: setLayerState, id: '' + idx, key: '' + idx, visibleMaster: _visible })); })))));
 }
 LayerListItem.defaultProps = {
     type: 'layer',