react-spatial 1.5.3 → 1.5.4

package/{src/components → components}/Geolocation/Geolocation.js

@@ -1,119 +1,68 @@
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-
-import OLMap from 'ol/Map';
-import { transform } from 'ol/proj';
-import Point from 'ol/geom/Point';
-import Feature from 'ol/Feature';
-import { unByKey } from 'ol/Observable';
-
-import Style from 'ol/style/Style';
-import Circle from 'ol/style/Circle';
-import Fill from 'ol/style/Fill';
-import Stroke from 'ol/style/Stroke';
-
-import VectorLayer from 'ol/layer/Vector';
-import VectorSource from 'ol/source/Vector';
-
-import { FaRegDotCircle } from 'react-icons/fa';
-
+import React, { PureComponent } from "react";
+import PropTypes from "prop-types";
+import OLMap from "ol/Map";
+import { transform } from "ol/proj";
+import Point from "ol/geom/Point";
+import Feature from "ol/Feature";
+import { unByKey } from "ol/Observable";
+import Style from "ol/style/Style";
+import Circle from "ol/style/Circle";
+import Fill from "ol/style/Fill";
+import Stroke from "ol/style/Stroke";
+import VectorLayer from "ol/layer/Vector";
+import VectorSource from "ol/source/Vector";
+import { FaRegDotCircle } from "react-icons/fa";
 const propTypes = {
-  /**
-   * CSS class of the button.
-   */
   className: PropTypes.string,
-
-  /**
-   *  Children content of the Geolocation button.
-   */
   children: PropTypes.node,
-
-  /**
-   * An [ol/map](https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html).
-   */
   map: PropTypes.instanceOf(OLMap).isRequired,
-
-  /**
-   * Function triggered when geolocating is not successful.
-   */
   onError: PropTypes.func,
-
-  /**
-   * Function triggered after successful geoLocation calls. Takes the ol/map, the current lat/lon coordinate and the component instance as arguments.
-   */
   onSuccess: PropTypes.func,
-
-  /**
-   * Function triggered after the geolocation is activated. Takes the ol/map and the component instance as arguments.
-   */
   onActivate: PropTypes.func,
-
-  /**
-   * Function triggered after the geolocation is deactivated. Takes the ol/map and the component instance as arguments..
-   */
   onDeactivate: PropTypes.func,
-
-  /**
-   * If true, the map is not centered after it has been dragged once.
-   */
   noCenterAfterDrag: PropTypes.bool,
-
-  /**
-   * If true, the map will constantly recenter to the current Position
-   */
   alwaysRecenterToPosition: PropTypes.bool,
-
-  /**
-   * Color (Number array with rgb values) or style function.
-   * If a color is given, the style is animated.
-   */
   colorOrStyleFunc: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.number),
-    PropTypes.func,
-  ]),
+    PropTypes.func
+  ])
 };
-
 const defaultProps = {
-  className: 'rs-geolocation',
-  children: <FaRegDotCircle focusable={false} />,
-  onError: () => {},
-  onSuccess: () => {},
-  onActivate: () => {},
-  onDeactivate: () => {},
+  className: "rs-geolocation",
+  children: /* @__PURE__ */ React.createElement(FaRegDotCircle, {
+    focusable: false
+  }),
+  onError: () => {
+  },
+  onSuccess: () => {
+  },
+  onActivate: () => {
+  },
+  onDeactivate: () => {
+  },
   noCenterAfterDrag: false,
   alwaysRecenterToPosition: true,
-  colorOrStyleFunc: [235, 0, 0],
+  colorOrStyleFunc: [235, 0, 0]
 };
-
-/**
- * The GeoLocation component creates a button to display the current device's location on an
- * [ol/map](https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html).
- */
 class Geolocation extends PureComponent {
   constructor(props) {
     super(props);
-
     this.layer = new VectorLayer({
-      source: new VectorSource(),
+      source: new VectorSource()
     });
-
     this.isRecenteringToPosition = true;
-
     this.state = {
-      active: false,
+      active: false
     };
-    this.point = undefined;
+    this.point = void 0;
   }
-
   componentWillUnmount() {
     this.deactivate();
   }
-
   toggle() {
     const { active } = this.state;
     const { onError } = this.props;
-    const geolocation = 'geolocation' in navigator;
-
+    const geolocation = "geolocation" in navigator;
     if (!geolocation) {
       onError();
     } else if (!active) {
@@ -122,89 +71,71 @@ class Geolocation extends PureComponent {
       this.deactivate();
     }
   }
-
   error() {
     const { onError } = this.props;
-
     this.deactivate();
     onError();
   }
-
   deactivate() {
     const { map, onDeactivate } = this.props;
     window.clearInterval(this.interval);
     this.layer.setMap(null);
     navigator.geolocation.clearWatch(this.watch);
-
     this.setState({
-      active: false,
+      active: false
     });
-
     this.isRecenteringToPosition = true;
-    this.point = undefined;
+    this.point = void 0;
     onDeactivate(map, this);
     unByKey(this.dragListener);
   }
-
   activate() {
     const { map, noCenterAfterDrag, onActivate } = this.props;
-
     this.projection = map.getView().getProjection().getCode();
     this.point = new Point([0, 0]);
     this.highlight();
     this.layer.setMap(map);
     this.setState({ active: true });
-
     this.watch = navigator.geolocation.watchPosition(
       this.update.bind(this),
       this.error.bind(this),
       {
-        enableHighAccuracy: true,
-      },
+        enableHighAccuracy: true
+      }
     );
-
     if (noCenterAfterDrag) {
-      this.dragListener = map.on('pointerdrag', () => {
+      this.dragListener = map.on("pointerdrag", () => {
         this.isRecenteringToPosition = false;
       });
     }
-
     onActivate(map, this);
   }
-
   update({ coords: { latitude, longitude } }) {
     const { map, alwaysRecenterToPosition, onSuccess } = this.props;
-
     const position = transform(
       [longitude, latitude],
-      'EPSG:4326',
-      this.projection,
+      "EPSG:4326",
+      this.projection
     );
     this.point.setCoordinates(position);
-
     if (this.isRecenteringToPosition) {
       map.getView().setCenter(position);
       if (!alwaysRecenterToPosition) {
         this.isRecenteringToPosition = false;
       }
     }
-
     onSuccess(map, [latitude, longitude], this);
   }
-
   highlight() {
     const { colorOrStyleFunc } = this.props;
     const feature = new Feature({
-      geometry: this.point,
+      geometry: this.point
     });
-
     if (Array.isArray(colorOrStyleFunc)) {
       const color = colorOrStyleFunc;
-
       let decrease = true;
       let opacity = 0.5;
       let rotation = 0;
-
       window.clearInterval(this.interval);
       this.interval = window.setInterval(() => {
         rotation += 0.03;
@@ -215,74 +146,60 @@ class Geolocation extends PureComponent {
           feature.changed();
         }
       }, 50);
-
       feature.setStyle(() => {
         const circleStyle = new Style({
           image: new Circle({
             radius: 20,
             rotation,
             fill: new Fill({
-              color: 'rgba(255, 255, 255, 0.01)',
+              color: "rgba(255, 255, 255, 0.01)"
             }),
             stroke: new Stroke({
               lineDash: [30, 10],
               width: 6,
-              color: `rgba(${color[0]}, ${color[1]}, ${color[2]}, ${opacity})`,
-            }),
-          }),
+              color: `rgba(${color[0]}, ${color[1]}, ${color[2]}, ${opacity})`
+            })
+          })
         });
-
         circleStyle.getImage().setRotation(rotation);
-
         return [
           new Style({
             image: new Circle({
               radius: 10,
               fill: new Fill({
-                color: `rgba(${color[0]}, ${color[1]}, ${color[2]}, 0.5)`,
-              }),
-            }),
+                color: `rgba(${color[0]}, ${color[1]}, ${color[2]}, 0.5)`
+              })
+            })
           }),
-          circleStyle,
+          circleStyle
         ];
       });
     } else {
       feature.setStyle(colorOrStyleFunc);
     }
-
     this.layer.getSource().clear();
     this.layer.getSource().addFeature(feature);
   }
-
   render() {
     const { children, className } = this.props;
-    // Remove component props from other HTML props.
     const other = Object.entries(this.props).reduce((props, [key, value]) => {
       return propTypes[key] ? props : { ...props, [key]: value };
     }, {});
     const { active } = this.state;
-
-    return (
-      <div
-        role="button"
-        tabIndex="0"
-        className={`${className} ${active ? 'rs-active' : ''}`}
-        onClick={() => {
-          return this.toggle();
-        }}
-        onKeyPress={(e) => {
-          return e.which === 13 && this.toggle();
-        }}
-        // eslint-disable-next-line react/jsx-props-no-spreading
-        {...other}
-      >
-        {children}
-      </div>
-    );
+    return /* @__PURE__ */ React.createElement("div", {
+      role: "button",
+      tabIndex: "0",
+      className: `${className} ${active ? "rs-active" : ""}`,
+      onClick: () => {
+        return this.toggle();
+      },
+      onKeyPress: (e) => {
+        return e.which === 13 && this.toggle();
+      },
+      ...other
+    }, children);
   }
 }
-
 Geolocation.propTypes = propTypes;
 Geolocation.defaultProps = defaultProps;
-
 export default Geolocation;

package/components/Geolocation/Geolocation.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/Geolocation/Geolocation.js"],
+  "sourcesContent": ["import React, { PureComponent } from 'react';\nimport PropTypes from 'prop-types';\n\nimport OLMap from 'ol/Map';\nimport { transform } from 'ol/proj';\nimport Point from 'ol/geom/Point';\nimport Feature from 'ol/Feature';\nimport { unByKey } from 'ol/Observable';\n\nimport Style from 'ol/style/Style';\nimport Circle from 'ol/style/Circle';\nimport Fill from 'ol/style/Fill';\nimport Stroke from 'ol/style/Stroke';\n\nimport VectorLayer from 'ol/layer/Vector';\nimport VectorSource from 'ol/source/Vector';\n\nimport { FaRegDotCircle } from 'react-icons/fa';\n\nconst propTypes = {\n  /**\n   * CSS class of the button.\n   */\n  className: PropTypes.string,\n\n  /**\n   *  Children content of the Geolocation button.\n   */\n  children: PropTypes.node,\n\n  /**\n   * An [ol/map](https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html).\n   */\n  map: PropTypes.instanceOf(OLMap).isRequired,\n\n  /**\n   * Function triggered when geolocating is not successful.\n   */\n  onError: PropTypes.func,\n\n  /**\n   * Function triggered after successful geoLocation calls. Takes the ol/map, the current lat/lon coordinate and the component instance as arguments.\n   */\n  onSuccess: PropTypes.func,\n\n  /**\n   * Function triggered after the geolocation is activated. Takes the ol/map and the component instance as arguments.\n   */\n  onActivate: PropTypes.func,\n\n  /**\n   * Function triggered after the geolocation is deactivated. Takes the ol/map and the component instance as arguments..\n   */\n  onDeactivate: PropTypes.func,\n\n  /**\n   * If true, the map is not centered after it has been dragged once.\n   */\n  noCenterAfterDrag: PropTypes.bool,\n\n  /**\n   * If true, the map will constantly recenter to the current Position\n   */\n  alwaysRecenterToPosition: PropTypes.bool,\n\n  /**\n   * Color (Number array with rgb values) or style function.\n   * If a color is given, the style is animated.\n   */\n  colorOrStyleFunc: PropTypes.oneOfType([\n    PropTypes.arrayOf(PropTypes.number),\n    PropTypes.func,\n  ]),\n};\n\nconst defaultProps = {\n  className: 'rs-geolocation',\n  children: <FaRegDotCircle focusable={false} />,\n  onError: () => {},\n  onSuccess: () => {},\n  onActivate: () => {},\n  onDeactivate: () => {},\n  noCenterAfterDrag: false,\n  alwaysRecenterToPosition: true,\n  colorOrStyleFunc: [235, 0, 0],\n};\n\n/**\n * The GeoLocation component creates a button to display the current device's location on an\n * [ol/map](https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html).\n */\nclass Geolocation extends PureComponent {\n  constructor(props) {\n    super(props);\n\n    this.layer = new VectorLayer({\n      source: new VectorSource(),\n    });\n\n    this.isRecenteringToPosition = true;\n\n    this.state = {\n      active: false,\n    };\n    this.point = undefined;\n  }\n\n  componentWillUnmount() {\n    this.deactivate();\n  }\n\n  toggle() {\n    const { active } = this.state;\n    const { onError } = this.props;\n    const geolocation = 'geolocation' in navigator;\n\n    if (!geolocation) {\n      onError();\n    } else if (!active) {\n      this.activate();\n    } else {\n      this.deactivate();\n    }\n  }\n\n  error() {\n    const { onError } = this.props;\n\n    this.deactivate();\n    onError();\n  }\n\n  deactivate() {\n    const { map, onDeactivate } = this.props;\n    window.clearInterval(this.interval);\n    this.layer.setMap(null);\n    navigator.geolocation.clearWatch(this.watch);\n\n    this.setState({\n      active: false,\n    });\n\n    this.isRecenteringToPosition = true;\n    this.point = undefined;\n    onDeactivate(map, this);\n    unByKey(this.dragListener);\n  }\n\n  activate() {\n    const { map, noCenterAfterDrag, onActivate } = this.props;\n\n    this.projection = map.getView().getProjection().getCode();\n    this.point = new Point([0, 0]);\n    this.highlight();\n    this.layer.setMap(map);\n    this.setState({ active: true });\n\n    this.watch = navigator.geolocation.watchPosition(\n      this.update.bind(this),\n      this.error.bind(this),\n      {\n        enableHighAccuracy: true,\n      },\n    );\n\n    if (noCenterAfterDrag) {\n      this.dragListener = map.on('pointerdrag', () => {\n        this.isRecenteringToPosition = false;\n      });\n    }\n\n    onActivate(map, this);\n  }\n\n  update({ coords: { latitude, longitude } }) {\n    const { map, alwaysRecenterToPosition, onSuccess } = this.props;\n\n    const position = transform(\n      [longitude, latitude],\n      'EPSG:4326',\n      this.projection,\n    );\n    this.point.setCoordinates(position);\n\n    if (this.isRecenteringToPosition) {\n      map.getView().setCenter(position);\n      if (!alwaysRecenterToPosition) {\n        this.isRecenteringToPosition = false;\n      }\n    }\n\n    onSuccess(map, [latitude, longitude], this);\n  }\n\n  highlight() {\n    const { colorOrStyleFunc } = this.props;\n    const feature = new Feature({\n      geometry: this.point,\n    });\n\n    if (Array.isArray(colorOrStyleFunc)) {\n      const color = colorOrStyleFunc;\n\n      let decrease = true;\n      let opacity = 0.5;\n      let rotation = 0;\n\n      window.clearInterval(this.interval);\n      this.interval = window.setInterval(() => {\n        rotation += 0.03;\n        decrease = opacity < 0.1 ? false : decrease;\n        decrease = opacity > 0.5 ? true : decrease;\n        opacity += decrease ? -0.03 : 0.03;\n        if (feature) {\n          feature.changed();\n        }\n      }, 50);\n\n      feature.setStyle(() => {\n        const circleStyle = new Style({\n          image: new Circle({\n            radius: 20,\n            rotation,\n            fill: new Fill({\n              color: 'rgba(255, 255, 255, 0.01)',\n            }),\n            stroke: new Stroke({\n              lineDash: [30, 10],\n              width: 6,\n              color: `rgba(${color[0]}, ${color[1]}, ${color[2]}, ${opacity})`,\n            }),\n          }),\n        });\n\n        circleStyle.getImage().setRotation(rotation);\n\n        return [\n          new Style({\n            image: new Circle({\n              radius: 10,\n              fill: new Fill({\n                color: `rgba(${color[0]}, ${color[1]}, ${color[2]}, 0.5)`,\n              }),\n            }),\n          }),\n          circleStyle,\n        ];\n      });\n    } else {\n      feature.setStyle(colorOrStyleFunc);\n    }\n\n    this.layer.getSource().clear();\n    this.layer.getSource().addFeature(feature);\n  }\n\n  render() {\n    const { children, className } = this.props;\n    // Remove component props from other HTML props.\n    const other = Object.entries(this.props).reduce((props, [key, value]) => {\n      return propTypes[key] ? props : { ...props, [key]: value };\n    }, {});\n    const { active } = this.state;\n\n    return (\n      <div\n        role=\"button\"\n        tabIndex=\"0\"\n        className={`${className} ${active ? 'rs-active' : ''}`}\n        onClick={() => {\n          return this.toggle();\n        }}\n        onKeyPress={(e) => {\n          return e.which === 13 && this.toggle();\n        }}\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...other}\n      >\n        {children}\n      </div>\n    );\n  }\n}\n\nGeolocation.propTypes = propTypes;\nGeolocation.defaultProps = defaultProps;\n\nexport default Geolocation;\n"],
+  "mappings": "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",
+  "names": []
+}

package/components/Geolocation/index.js

@@ -0,0 +1 @@
+export { default } from "./Geolocation";

package/components/Geolocation/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/Geolocation/index.js"],
+  "sourcesContent": ["export { default } from './Geolocation';\n"],
+  "mappings": "AAAA,wBAAwB;",
+  "names": []
+}

package/components/LayerTree/LayerTree.js

@@ -0,0 +1,278 @@
+import React, { Component } from "react";
+import PropTypes from "prop-types";
+import { Layer, getLayersAsFlatArray } from "mobility-toolbox-js/ol";
+import { unByKey } from "ol/Observable";
+const propTypes = {
+  layers: PropTypes.arrayOf(PropTypes.instanceOf(Layer)),
+  className: PropTypes.string,
+  padding: PropTypes.number,
+  isItemHidden: PropTypes.func,
+  getParentClassName: PropTypes.func,
+  renderItem: PropTypes.func,
+  renderItemContent: PropTypes.func,
+  renderBeforeItem: PropTypes.func,
+  renderAfterItem: PropTypes.func,
+  renderLabel: PropTypes.func,
+  titles: PropTypes.shape({
+    layerShow: PropTypes.string,
+    layerHide: PropTypes.string,
+    subLayerShow: PropTypes.string,
+    subLayerHide: PropTypes.string
+  }),
+  expandChildren: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
+  t: PropTypes.func
+};
+const defaultProps = {
+  layers: [],
+  className: "rs-layer-tree",
+  padding: 30,
+  isItemHidden: () => {
+    return false;
+  },
+  getParentClassName: () => {
+    return void 0;
+  },
+  renderItem: null,
+  renderItemContent: null,
+  renderBeforeItem: null,
+  renderAfterItem: null,
+  renderLabel: (layer, layerComp) => {
+    const { t } = layerComp.props;
+    return t(layer.name);
+  },
+  titles: {
+    layerShow: "Show layer",
+    layerHide: "Hide layer",
+    subLayerShow: "Show sublayer",
+    subLayerHide: "Hide sublayer"
+  },
+  t: (s) => {
+    return s;
+  },
+  expandChildren: false
+};
+class LayerTree extends Component {
+  constructor(props) {
+    super(props);
+    const { layers, isItemHidden } = this.props;
+    const initialExpandedLayers = layers ? this.getExpandedLayers(
+      layers.filter((l) => {
+        return !isItemHidden(l) && (l.children || []).filter((child) => {
+          return child.visible;
+        }).filter((c) => {
+          return !isItemHidden(c);
+        }).length;
+      })
+    ) : [];
+    this.state = {
+      rootLayer: new Layer(),
+      expandedLayers: initialExpandedLayers,
+      revision: 0
+    };
+    this.olKeys = [];
+  }
+  componentDidMount() {
+    this.updateLayers();
+  }
+  componentDidUpdate(prevProps) {
+    const { layers } = this.props;
+    if (layers !== prevProps.layers) {
+      this.updateLayers();
+    }
+  }
+  componentWillUnmount() {
+    unByKey(this.olKeys);
+    this.olKeys = [];
+  }
+  onInputClick(layer, toggle = false) {
+    if (toggle) {
+      this.onToggle(layer);
+    } else if (layer.setVisible) {
+      layer.setVisible(!layer.visible);
+    } else {
+      layer.visible = !layer.visible;
+    }
+  }
+  onToggle(layer) {
+    const { expandedLayers } = this.state;
+    const pos = expandedLayers.indexOf(layer);
+    if (pos > -1) {
+      expandedLayers.splice(pos, 1);
+    } else {
+      expandedLayers.push(...this.getExpandedLayers([layer]));
+    }
+    this.setState({ expandedLayers });
+  }
+  getExpandedLayers(layers) {
+    const { isItemHidden } = this.props;
+    const children = layers.flatMap((l) => {
+      return l.children.filter((c) => {
+        return !isItemHidden(c) && c.get("isAlwaysExpanded");
+      });
+    });
+    if (!children.length) {
+      return layers;
+    }
+    return [...layers, this.getExpandedLayers(children)].flat();
+  }
+  updateLayers() {
+    const { layers, expandChildren } = this.props;
+    let rootLayer = new Layer();
+    if (Array.isArray(layers)) {
+      if (layers.length === 1) {
+        [rootLayer] = layers;
+      }
+      rootLayer = new Layer({ children: layers });
+    } else {
+      rootLayer = layers;
+    }
+    getLayersAsFlatArray(rootLayer).forEach((layer) => {
+      this.olKeys.push(
+        layer.on("propertychange", () => {
+          const { revision } = this.state;
+          this.setState({ revision: revision + 1 });
+        })
+      );
+    });
+    const state = { rootLayer };
+    if (typeof expandChildren === "function" ? expandChildren(layers) : expandChildren) {
+      state.expandedLayers = rootLayer.children.flatMap((l) => {
+        return this.expandLayer(l);
+      });
+    }
+    this.setState(state);
+  }
+  expandLayer(layer, expLayers = []) {
+    const { isItemHidden } = this.props;
+    if (layer.visible && !isItemHidden(layer)) {
+      const children = layer.children.filter((c) => {
+        return !isItemHidden(c) && !c.get("isAlwaysExpanded");
+      }).flatMap((c) => {
+        return this.expandLayer(c, expLayers);
+      });
+      return [...expLayers, ...children, layer];
+    }
+    return expLayers;
+  }
+  renderInput(layer, inputProps) {
+    const { titles, isItemHidden } = this.props;
+    let tabIndex = 0;
+    if (!(layer.children || []).filter((c) => {
+      return !isItemHidden(c);
+    }).length) {
+      tabIndex = -1;
+    }
+    const inputType = layer.get("group") ? "radio" : "checkbox";
+    return /* @__PURE__ */ React.createElement("label", {
+      className: `rs-layer-tree-input rs-layer-tree-input-${inputType} rs-${inputType}`,
+      tabIndex,
+      title: layer.visible ? titles.layerHide : titles.layerShow,
+      "aria-label": layer.visible ? titles.layerHide : titles.layerShow,
+      onKeyPress: (e) => {
+        if (e.which === 13) {
+          this.onInputClick(layer);
+        }
+      }
+    }, /* @__PURE__ */ React.createElement("input", {
+      type: inputType,
+      tabIndex: -1,
+      checked: layer.visible,
+      readOnly: true,
+      onClick: () => {
+        return this.onInputClick(layer);
+      },
+      ...inputProps
+    }), /* @__PURE__ */ React.createElement("span", null));
+  }
+  renderArrow(layer) {
+    const { isItemHidden } = this.props;
+    const { expandedLayers } = this.state;
+    if (!(layer.children || []).filter((c) => {
+      return !isItemHidden(c);
+    }).length || layer.get("isAlwaysExpanded")) {
+      return null;
+    }
+    return /* @__PURE__ */ React.createElement("div", {
+      className: `rs-layer-tree-arrow rs-layer-tree-arrow-${!expandedLayers.includes(layer) ? "collapsed" : "expanded"}`
+    });
+  }
+  renderToggleButton(layer, toggleProps) {
+    const { t, titles, isItemHidden, renderLabel } = this.props;
+    const { expandedLayers } = this.state;
+    const onInputClick = () => {
+      this.onInputClick(
+        layer,
+        (layer.children || []).filter((c) => {
+          return !isItemHidden(c);
+        }).length && !layer.get("isAlwaysExpanded")
+      );
+    };
+    const title = `${t(layer.name)} ${expandedLayers.includes(layer) ? titles.subLayerHide : titles.subLayerShow}`;
+    return /* @__PURE__ */ React.createElement("div", {
+      role: "button",
+      tabIndex: 0,
+      className: "rs-layer-tree-toggle",
+      title,
+      "aria-expanded": expandedLayers.includes(layer),
+      "aria-label": title,
+      onClick: onInputClick,
+      onKeyPress: onInputClick,
+      ...toggleProps
+    }, /* @__PURE__ */ React.createElement("div", null, renderLabel(layer, this)), this.renderArrow(layer));
+  }
+  renderItemContent(layer, inputProps = {}, toggleProps = {}) {
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, this.renderInput(layer, inputProps), this.renderToggleButton(layer, toggleProps));
+  }
+  renderItem(layer, level) {
+    const { isItemHidden } = this.props;
+    const { expandedLayers } = this.state;
+    const {
+      renderItem,
+      renderItemContent,
+      renderBeforeItem,
+      renderAfterItem,
+      padding,
+      getParentClassName
+    } = this.props;
+    const children = expandedLayers.includes(layer) ? [
+      ...(layer.children || []).filter((c) => {
+        return !isItemHidden(c);
+      })
+    ] : [];
+    if (renderItem) {
+      return renderItem(layer, this.onInputClick, this.onToggle);
+    }
+    return /* @__PURE__ */ React.createElement("div", {
+      className: getParentClassName(),
+      key: layer.key
+    }, /* @__PURE__ */ React.createElement("div", {
+      className: `rs-layer-tree-item ${layer.visible ? "rs-visible" : ""}`,
+      style: {
+        paddingLeft: `${padding * level}px`
+      }
+    }, renderItemContent ? renderItemContent(layer, this) : this.renderItemContent(layer)), renderBeforeItem && renderBeforeItem(layer, level, this), [...children].reverse().map((child) => {
+      return this.renderItem(child, level + 1);
+    }), renderAfterItem && renderAfterItem(layer, level, this));
+  }
+  renderTree() {
+    const { isItemHidden } = this.props;
+    const { rootLayer } = this.state;
+    if (!rootLayer?.children?.length) {
+      return null;
+    }
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, rootLayer.children.filter((l) => {
+      return !isItemHidden(l);
+    }).reverse().map((l) => {
+      return this.renderItem(l, 0);
+    }));
+  }
+  render() {
+    const { className } = this.props;
+    return /* @__PURE__ */ React.createElement("div", {
+      className
+    }, this.renderTree());
+  }
+}
+LayerTree.propTypes = propTypes;
+LayerTree.defaultProps = defaultProps;
+export default LayerTree;