react-spatial 1.12.0 → 1.12.1

package/components/ScaleLine/ScaleLine.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/ScaleLine/ScaleLine.js"],
-  "sourcesContent": ["import React, { useRef, useEffect } from \"react\";\nimport PropTypes from \"prop-types\";\nimport OLScaleLine from \"ol/control/ScaleLine\";\nimport OLMap from \"ol/Map\";\n\nconst propTypes = {\n  /**\n   * ol/map.\n   */\n  map: PropTypes.instanceOf(OLMap).isRequired,\n\n  /**\n   * Options for ol/control/ScaleLine.\n   * See https://openlayers.org/en/latest/apidoc/module-ol_control_ScaleLine-ScaleLine.html\n   */\n  options: PropTypes.object,\n};\n\nconst defaultProps = {\n  options: {},\n};\n\n/**\n * The ScaleLine component creates an\n * [ol/control/ScaleLine](https://openlayers.org/en/latest/apidoc/module-ol_control_ScaleLine-ScaleLine.html)\n * for an [ol/map](https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html).\n */\nfunction ScaleLine({ map, options = defaultProps.options, ...other }) {\n  const ref = useRef();\n\n  useEffect(() => {\n    const control = new OLScaleLine({\n      ...options,\n      ...{ target: ref.current },\n    });\n\n    map.addControl(control);\n    return () => {\n      map.removeControl(control);\n    };\n  }, [map, options]);\n\n  // eslint-disable-next-line react/jsx-props-no-spreading\n  return <div className=\"rs-scale-line\" ref={ref} {...other} />;\n}\n\nScaleLine.propTypes = propTypes;\n\nexport default React.memo(ScaleLine);\n"],
-  "mappings": "AAAA,OAAO,SAAS,QAAQ,iBAAiB;AACzC,OAAO,eAAe;AACtB,OAAO,iBAAiB;AACxB,OAAO,WAAW;AAElB,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA,EAIhB,KAAK,UAAU,WAAW,KAAK,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,EAMjC,SAAS,UAAU;AACrB;AAEA,MAAM,eAAe;AAAA,EACnB,SAAS,CAAC;AACZ;AAOA,SAAS,UAAU,EAAE,KAAK,UAAU,aAAa,SAAS,GAAG,MAAM,GAAG;AACpE,QAAM,MAAM,OAAO;AAEnB,YAAU,MAAM;AACd,UAAM,UAAU,IAAI,YAAY;AAAA,MAC9B,GAAG;AAAA,MACH,GAAG,EAAE,QAAQ,IAAI,QAAQ;AAAA,IAC3B,CAAC;AAED,QAAI,WAAW,OAAO;AACtB,WAAO,MAAM;AACX,UAAI,cAAc,OAAO;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,KAAK,OAAO,CAAC;AAGjB,SAAO,oCAAC,SAAI,WAAU,iBAAgB,KAAW,GAAG,OAAO;AAC7D;AAEA,UAAU,YAAY;AAEtB,eAAe,MAAM,KAAK,SAAS;",
+  "sourcesContent": ["import OLScaleLine from \"ol/control/ScaleLine\";\nimport OLMap from \"ol/Map\";\nimport PropTypes from \"prop-types\";\nimport React, { useEffect, useRef } from \"react\";\n\nconst propTypes = {\n  /**\n   * ol/map.\n   */\n  map: PropTypes.instanceOf(OLMap).isRequired,\n\n  /**\n   * Options for ol/control/ScaleLine.\n   * See https://openlayers.org/en/latest/apidoc/module-ol_control_ScaleLine-ScaleLine.html\n   */\n  options: PropTypes.object,\n};\n\nconst defaultProps = {\n  options: {},\n};\n\n/**\n * The ScaleLine component creates an\n * [ol/control/ScaleLine](https://openlayers.org/en/latest/apidoc/module-ol_control_ScaleLine-ScaleLine.html)\n * for an [ol/map](https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html).\n */\nfunction ScaleLine({ map, options = defaultProps.options, ...other }) {\n  const ref = useRef();\n\n  useEffect(() => {\n    const control = new OLScaleLine({\n      ...options,\n      ...{ target: ref.current },\n    });\n\n    map.addControl(control);\n    return () => {\n      map.removeControl(control);\n    };\n  }, [map, options]);\n\n  // eslint-disable-next-line react/jsx-props-no-spreading\n  return <div className=\"rs-scale-line\" ref={ref} {...other} />;\n}\n\nScaleLine.propTypes = propTypes;\n\nexport default React.memo(ScaleLine);\n"],
+  "mappings": "AAAA,OAAO,iBAAiB;AACxB,OAAO,WAAW;AAClB,OAAO,eAAe;AACtB,OAAO,SAAS,WAAW,cAAc;AAEzC,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA,EAIhB,KAAK,UAAU,WAAW,KAAK,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,EAMjC,SAAS,UAAU;AACrB;AAEA,MAAM,eAAe;AAAA,EACnB,SAAS,CAAC;AACZ;AAOA,SAAS,UAAU,EAAE,KAAK,UAAU,aAAa,SAAS,GAAG,MAAM,GAAG;AACpE,QAAM,MAAM,OAAO;AAEnB,YAAU,MAAM;AACd,UAAM,UAAU,IAAI,YAAY;AAAA,MAC9B,GAAG;AAAA,MACH,GAAG,EAAE,QAAQ,IAAI,QAAQ;AAAA,IAC3B,CAAC;AAED,QAAI,WAAW,OAAO;AACtB,WAAO,MAAM;AACX,UAAI,cAAc,OAAO;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,KAAK,OAAO,CAAC;AAGjB,SAAO,oCAAC,SAAI,WAAU,iBAAgB,KAAW,GAAG,OAAO;AAC7D;AAEA,UAAU,YAAY;AAEtB,eAAe,MAAM,KAAK,SAAS;",
   "names": []
 }

package/components/StopsFinder/StopsFinder.js

@@ -1,11 +1,11 @@
-import React, { useMemo, useState, useEffect } from "react";
-import PropTypes from "prop-types";
 import { Autocomplete, autocompleteClasses, styled } from "@mui/material";
-import { FaSearch } from "react-icons/fa";
-import TextField from "@mui/material/TextField";
 import CircularProgress from "@mui/material/CircularProgress";
+import TextField from "@mui/material/TextField";
 import { StopFinderControl } from "mobility-toolbox-js/ol";
 import { Map } from "ol";
+import PropTypes from "prop-types";
+import React, { useEffect, useMemo, useState } from "react";
+import { FaSearch } from "react-icons/fa";
 import StopsFinderOption from "./StopsFinderOption";
 const StyledAutocomplete = styled(Autocomplete)(() => ({
   [`& .${autocompleteClasses.popupIndicatorOpen}`]: {
@@ -27,8 +27,8 @@ function StopsFinder({
   radius,
   refLocation,
   renderAutocomplete,
-  url,
   textFieldProps = defaultProps.textFieldProps,
+  url,
   ...props
 }) {
   const [inputValue, setInputValue] = useState("");
@@ -37,14 +37,14 @@ function StopsFinder({
   const [isOpen, setOpen] = useState(false);
   const control = useMemo(() => {
     return new StopFinderControl({
-      url,
       apiKey,
-      target: document.createElement("div"),
       element: document.createElement("div"),
       render(newSuggestions = { features: [] }) {
         setSuggestions(newSuggestions.features);
         setLoading(false);
-      }
+      },
+      target: document.createElement("div"),
+      url
     });
   }, [apiKey, url]);
   useEffect(() => {
@@ -57,11 +57,11 @@ function StopsFinder({
     const abortController = new AbortController();
     setLoading(true);
     control.apiParams = {
-      prefAgencies: agencies && agencies.toString(),
       bbox: bbox && bbox.toString(),
       field: field && field.toString(),
       limit,
       mots: mots && mots.toString(),
+      prefAgencies: agencies && agencies.toString(),
       radius,
       ref_location: refLocation && refLocation.toString()
     };
@@ -107,10 +107,9 @@ function StopsFinder({
   return /* @__PURE__ */ React.createElement(
     StyledAutocomplete,
     {
-      fullWidth: true,
       autoComplete: true,
       autoHighlight: true,
-      selectOnFocus: true,
+      fullWidth: true,
       getOptionLabel: (option) => {
         return option.properties.name;
       },
@@ -144,20 +143,21 @@ function StopsFinder({
           }
         );
       },
+      selectOnFocus: true,
       ...props,
       inputValue,
-      open: isOpen,
-      options: suggestions,
       loading: isLoading,
-      onOpen: () => {
-        setOpen(true);
-      },
       onClose: () => {
         setOpen(false);
       },
       onInputChange: (evt, val) => {
         setInputValue(val);
-      }
+      },
+      onOpen: () => {
+        setOpen(true);
+      },
+      open: isOpen,
+      options: suggestions
     }
   );
 }
@@ -175,10 +175,6 @@ StopsFinder.propTypes = {
    * geOps api key to access the StopsFinder service.
    */
   apiKey: PropTypes.string,
-  /**
-   * Properties apply to the default [MUI TextField component](https://material-ui.com/api/text-field/) used by the Autocomplete.
-   */
-  textFieldProps: PropTypes.object,
   /**
    * minX,minY,maxX,maxY coordinates in WGS84 wherein the station should lie.
    */
@@ -231,6 +227,10 @@ StopsFinder.propTypes = {
    * Function to render a different autocomplete input than the default one.
    */
   renderAutocomplete: PropTypes.func,
+  /**
+   * Properties apply to the default [MUI TextField component](https://material-ui.com/api/text-field/) used by the Autocomplete.
+   */
+  textFieldProps: PropTypes.object,
   /**
    * Url of the geOps StopsFinder service.
    */

package/components/StopsFinder/StopsFinder.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/StopsFinder/StopsFinder.js"],
-  "sourcesContent": ["/* eslint-disable react/jsx-props-no-spreading */\nimport React, { useMemo, useState, useEffect } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Autocomplete, autocompleteClasses, styled } from \"@mui/material\";\nimport { FaSearch } from \"react-icons/fa\";\nimport TextField from \"@mui/material/TextField\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport { StopFinderControl } from \"mobility-toolbox-js/ol\";\nimport { Map } from \"ol\";\nimport StopsFinderOption from \"./StopsFinderOption\";\n\nconst StyledAutocomplete = styled(Autocomplete)(() => ({\n  [`& .${autocompleteClasses.popupIndicatorOpen}`]: {\n    transform: \"rotate(0)\",\n  },\n}));\n\nconst defaultProps = {\n  textFieldProps: {},\n};\n\nfunction StopsFinder({\n  agencies,\n  apiKey,\n  bbox,\n  field,\n  limit,\n  map,\n  mots,\n  onSelect,\n  radius,\n  refLocation,\n  renderAutocomplete,\n  url,\n  textFieldProps = defaultProps.textFieldProps,\n  ...props\n}) {\n  const [inputValue, setInputValue] = useState(\"\");\n  const [suggestions, setSuggestions] = useState([]);\n  const [isLoading, setLoading] = useState(false);\n  const [isOpen, setOpen] = useState(false);\n\n  const control = useMemo(() => {\n    return new StopFinderControl({\n      url,\n      apiKey,\n      target: document.createElement(\"div\"),\n      element: document.createElement(\"div\"),\n      render(newSuggestions = { features: [] }) {\n        setSuggestions(newSuggestions.features);\n        setLoading(false);\n      },\n    });\n  }, [apiKey, url]);\n\n  useEffect(() => {\n    if (!inputValue) {\n      setSuggestions([]);\n      setLoading(false);\n      return () => {};\n    }\n    const abortController = new AbortController();\n    setLoading(true);\n    control.apiParams = {\n      prefAgencies: agencies && agencies.toString(),\n      bbox: bbox && bbox.toString(),\n      field: field && field.toString(),\n      limit,\n      mots: mots && mots.toString(),\n      radius,\n      ref_location: refLocation && refLocation.toString(),\n    };\n    control.search(inputValue, abortController);\n    return () => {\n      abortController.abort();\n    };\n  }, [\n    agencies,\n    bbox,\n    control,\n    field,\n    inputValue,\n    limit,\n    mots,\n    radius,\n    refLocation,\n  ]);\n\n  // Ensure the control is not associated to the wrong map\n  useEffect(() => {\n    if (!control) {\n      return () => {};\n    }\n\n    control.map = map;\n\n    return () => {\n      control.map = null;\n    };\n  }, [map, control]);\n\n  if (!control) {\n    return null;\n  }\n\n  if (renderAutocomplete) {\n    return renderAutocomplete(\n      suggestions,\n      inputValue,\n      setInputValue,\n      isOpen,\n      setOpen,\n      isLoading,\n      setLoading,\n    );\n  }\n  return (\n    <StyledAutocomplete\n      fullWidth\n      autoComplete\n      autoHighlight\n      selectOnFocus\n      getOptionLabel={(option) => {\n        return option.properties.name;\n      }}\n      onChange={(evt, value, reason) => {\n        if (onSelect && reason === \"selectOption\") {\n          onSelect(value, evt);\n        }\n      }}\n      popupIcon={<FaSearch focusable={false} size={15} />}\n      renderInput={(params) => {\n        return (\n          <TextField\n            label=\"Search stops\"\n            {...params}\n            {...textFieldProps}\n            InputProps={{\n              ...params.InputProps,\n              endAdornment: (\n                <>\n                  {isLoading && <CircularProgress size={20} />}\n                  {params.InputProps.endAdornment}\n                </>\n              ),\n            }}\n          />\n        );\n      }}\n      renderOption={(liProps, option) => {\n        return (\n          <StopsFinderOption\n            key={option.properties?.name}\n            option={option}\n            {...liProps}\n          />\n        );\n      }}\n      {...props}\n      inputValue={inputValue}\n      open={isOpen}\n      options={suggestions}\n      loading={isLoading}\n      onOpen={() => {\n        setOpen(true);\n      }}\n      onClose={() => {\n        setOpen(false);\n      }}\n      onInputChange={(evt, val) => {\n        setInputValue(val);\n      }}\n    />\n  );\n}\n\nStopsFinder.propTypes = {\n  /**\n   * Array or a comma separated list of agencies which should be available.\n   * Order of these agencies chooses which agency will be preferred.\n   * Available values : sbb, db\n   */\n  agencies: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.string),\n  ]),\n\n  /**\n   * geOps api key to access the StopsFinder service.\n   */\n  apiKey: PropTypes.string,\n\n  /**\n   * Properties apply to the default [MUI TextField component](https://material-ui.com/api/text-field/) used by the Autocomplete.\n   */\n  textFieldProps: PropTypes.object,\n\n  /**\n   * minX,minY,maxX,maxY coordinates in WGS84 wherein the station should lie.\n   */\n  bbox: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.number),\n  ]),\n\n  /**\n   * Array or a comma separated list of fields which should be used for look up.\n   * Available values : id, name, coords\n   */\n  field: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.string),\n  ]),\n\n  /**\n   * Control how many matches will be returned.\n   */\n  limit: PropTypes.number,\n\n  /**\n   * A map.\n   */\n  map: PropTypes.instanceOf(Map).isRequired,\n\n  /**\n   * Array or a comma separated list of mode of transpaorts which should be available.\n   * Available values : bus, ferry, gondola, tram, rail, funicular, cable_car, subway\n   */\n  mots: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.string),\n  ]),\n\n  /**\n   * Function called when a suggestion is selected.\n   */\n  onSelect: PropTypes.func,\n\n  /**\n   * Radius around refLocation in meters that is most relevant.\n   * Used as granularity for location rank.\n   */\n  radius: PropTypes.number,\n\n  /**\n   * Coordinates in WGS84 (in lat,lon order) used to rank stops close to this position higher.\n   * Available values : id, name, coords\n   */\n  refLocation: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.number),\n  ]),\n\n  /**\n   * Function to render a different autocomplete input than the default one.\n   */\n  renderAutocomplete: PropTypes.func,\n\n  /**\n   * Url of the geOps StopsFinder service.\n   */\n  url: PropTypes.string,\n};\n\nexport default StopsFinder;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable react/jsx-props-no-spreading */\nimport { Autocomplete, autocompleteClasses, styled } from \"@mui/material\";\nimport CircularProgress from \"@mui/material/CircularProgress\";\nimport TextField from \"@mui/material/TextField\";\nimport { StopFinderControl } from \"mobility-toolbox-js/ol\";\nimport { Map } from \"ol\";\nimport PropTypes from \"prop-types\";\nimport React, { useEffect, useMemo, useState } from \"react\";\nimport { FaSearch } from \"react-icons/fa\";\n\nimport StopsFinderOption from \"./StopsFinderOption\";\n\nconst StyledAutocomplete = styled(Autocomplete)(() => ({\n  [`& .${autocompleteClasses.popupIndicatorOpen}`]: {\n    transform: \"rotate(0)\",\n  },\n}));\n\nconst defaultProps = {\n  textFieldProps: {},\n};\n\nfunction StopsFinder({\n  agencies,\n  apiKey,\n  bbox,\n  field,\n  limit,\n  map,\n  mots,\n  onSelect,\n  radius,\n  refLocation,\n  renderAutocomplete,\n  textFieldProps = defaultProps.textFieldProps,\n  url,\n  ...props\n}) {\n  const [inputValue, setInputValue] = useState(\"\");\n  const [suggestions, setSuggestions] = useState([]);\n  const [isLoading, setLoading] = useState(false);\n  const [isOpen, setOpen] = useState(false);\n\n  const control = useMemo(() => {\n    return new StopFinderControl({\n      apiKey,\n      element: document.createElement(\"div\"),\n      render(newSuggestions = { features: [] }) {\n        setSuggestions(newSuggestions.features);\n        setLoading(false);\n      },\n      target: document.createElement(\"div\"),\n      url,\n    });\n  }, [apiKey, url]);\n\n  useEffect(() => {\n    if (!inputValue) {\n      setSuggestions([]);\n      setLoading(false);\n      return () => {};\n    }\n    const abortController = new AbortController();\n    setLoading(true);\n    control.apiParams = {\n      bbox: bbox && bbox.toString(),\n      field: field && field.toString(),\n      limit,\n      mots: mots && mots.toString(),\n      prefAgencies: agencies && agencies.toString(),\n      radius,\n      ref_location: refLocation && refLocation.toString(),\n    };\n    control.search(inputValue, abortController);\n    return () => {\n      abortController.abort();\n    };\n  }, [\n    agencies,\n    bbox,\n    control,\n    field,\n    inputValue,\n    limit,\n    mots,\n    radius,\n    refLocation,\n  ]);\n\n  // Ensure the control is not associated to the wrong map\n  useEffect(() => {\n    if (!control) {\n      return () => {};\n    }\n\n    control.map = map;\n\n    return () => {\n      control.map = null;\n    };\n  }, [map, control]);\n\n  if (!control) {\n    return null;\n  }\n\n  if (renderAutocomplete) {\n    return renderAutocomplete(\n      suggestions,\n      inputValue,\n      setInputValue,\n      isOpen,\n      setOpen,\n      isLoading,\n      setLoading,\n    );\n  }\n  return (\n    <StyledAutocomplete\n      autoComplete\n      autoHighlight\n      fullWidth\n      getOptionLabel={(option) => {\n        return option.properties.name;\n      }}\n      onChange={(evt, value, reason) => {\n        if (onSelect && reason === \"selectOption\") {\n          onSelect(value, evt);\n        }\n      }}\n      popupIcon={<FaSearch focusable={false} size={15} />}\n      renderInput={(params) => {\n        return (\n          <TextField\n            label=\"Search stops\"\n            {...params}\n            {...textFieldProps}\n            InputProps={{\n              ...params.InputProps,\n              endAdornment: (\n                <>\n                  {isLoading && <CircularProgress size={20} />}\n                  {params.InputProps.endAdornment}\n                </>\n              ),\n            }}\n          />\n        );\n      }}\n      renderOption={(liProps, option) => {\n        return (\n          <StopsFinderOption\n            key={option.properties?.name}\n            option={option}\n            {...liProps}\n          />\n        );\n      }}\n      selectOnFocus\n      {...props}\n      inputValue={inputValue}\n      loading={isLoading}\n      onClose={() => {\n        setOpen(false);\n      }}\n      onInputChange={(evt, val) => {\n        setInputValue(val);\n      }}\n      onOpen={() => {\n        setOpen(true);\n      }}\n      open={isOpen}\n      options={suggestions}\n    />\n  );\n}\n\nStopsFinder.propTypes = {\n  /**\n   * Array or a comma separated list of agencies which should be available.\n   * Order of these agencies chooses which agency will be preferred.\n   * Available values : sbb, db\n   */\n  agencies: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.string),\n  ]),\n\n  /**\n   * geOps api key to access the StopsFinder service.\n   */\n  apiKey: PropTypes.string,\n\n  /**\n   * minX,minY,maxX,maxY coordinates in WGS84 wherein the station should lie.\n   */\n  bbox: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.number),\n  ]),\n\n  /**\n   * Array or a comma separated list of fields which should be used for look up.\n   * Available values : id, name, coords\n   */\n  field: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.string),\n  ]),\n\n  /**\n   * Control how many matches will be returned.\n   */\n  limit: PropTypes.number,\n\n  /**\n   * A map.\n   */\n  map: PropTypes.instanceOf(Map).isRequired,\n\n  /**\n   * Array or a comma separated list of mode of transpaorts which should be available.\n   * Available values : bus, ferry, gondola, tram, rail, funicular, cable_car, subway\n   */\n  mots: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.string),\n  ]),\n\n  /**\n   * Function called when a suggestion is selected.\n   */\n  onSelect: PropTypes.func,\n\n  /**\n   * Radius around refLocation in meters that is most relevant.\n   * Used as granularity for location rank.\n   */\n  radius: PropTypes.number,\n\n  /**\n   * Coordinates in WGS84 (in lat,lon order) used to rank stops close to this position higher.\n   * Available values : id, name, coords\n   */\n  refLocation: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.number),\n  ]),\n\n  /**\n   * Function to render a different autocomplete input than the default one.\n   */\n  renderAutocomplete: PropTypes.func,\n\n  /**\n   * Properties apply to the default [MUI TextField component](https://material-ui.com/api/text-field/) used by the Autocomplete.\n   */\n  textFieldProps: PropTypes.object,\n\n  /**\n   * Url of the geOps StopsFinder service.\n   */\n  url: PropTypes.string,\n};\n\nexport default StopsFinder;\n"],
+  "mappings": "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",
   "names": []
 }

package/components/StopsFinder/StopsFinderOption.js

@@ -1,6 +1,6 @@
-import React, { Suspense, lazy } from "react";
-import PropTypes from "prop-types";
 import { CircularProgress, styled } from "@mui/material";
+import PropTypes from "prop-types";
+import React, { lazy, Suspense } from "react";
 const ext = "_round-blue-01.svg";
 const iconForMot = {};
 [
@@ -18,8 +18,8 @@ const iconForMot = {};
   });
 });
 const StyledFlex = styled("div")(() => ({
-  display: "flex",
   alignItems: "center",
+  display: "flex",
   gap: 5
 }));
 function StopsFinderOption({ option, ...props }) {

package/components/StopsFinder/StopsFinderOption.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/StopsFinder/StopsFinderOption.js"],
-  "sourcesContent": ["/* eslint-disable react/jsx-props-no-spreading */\nimport React, { Suspense, lazy } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { CircularProgress, styled } from \"@mui/material\";\n\nconst ext = \"_round-blue-01.svg\";\nconst iconForMot = {};\n[\n  \"bus\",\n  \"ferry\",\n  \"gondola\",\n  \"tram\",\n  \"rail\",\n  \"funicular\",\n  \"cable_car\",\n  \"subway\",\n].forEach((mot) => {\n  iconForMot[mot] = lazy(() => {\n    return import(`../../images/mots/${mot}${ext}`);\n  });\n});\n\nconst StyledFlex = styled(\"div\")(() => ({\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: 5,\n}));\n\nfunction StopsFinderOption({ option, ...props }) {\n  return (\n    <Suspense fallback={<CircularProgress size={20} />}>\n      <StyledFlex {...props}>\n        {Object.entries(option.properties?.mot).map(([key, value]) => {\n          if (value) {\n            const MotIcon = iconForMot[key];\n            return (\n              <StyledFlex key={key}>\n                <MotIcon />\n              </StyledFlex>\n            );\n          }\n          return null;\n        })}\n        <span>{option.properties.name}</span>\n      </StyledFlex>\n    </Suspense>\n  );\n}\n\nStopsFinderOption.propTypes = {\n  option: PropTypes.object.isRequired,\n};\n\nexport default React.memo(StopsFinderOption);\n"],
-  "mappings": "AACA,OAAO,SAAS,UAAU,YAAY;AACtC,OAAO,eAAe;AACtB,SAAS,kBAAkB,cAAc;AAEzC,MAAM,MAAM;AACZ,MAAM,aAAa,CAAC;AACpB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,QAAQ,CAAC,QAAQ;AACjB,aAAW,GAAG,IAAI,KAAK,MAAM;AAC3B,WAAO,OAAO,qBAAqB,GAAG,GAAG,GAAG;AAAA,EAC9C,CAAC;AACH,CAAC;AAED,MAAM,aAAa,OAAO,KAAK,EAAE,OAAO;AAAA,EACtC,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,KAAK;AACP,EAAE;AAEF,SAAS,kBAAkB,EAAE,QAAQ,GAAG,MAAM,GAAG;AAC/C,SACE,oCAAC,YAAS,UAAU,oCAAC,oBAAiB,MAAM,IAAI,KAC9C,oCAAC,cAAY,GAAG,SACb,OAAO,QAAQ,OAAO,YAAY,GAAG,EAAE,IAAI,CAAC,CAAC,KAAK,KAAK,MAAM;AAC5D,QAAI,OAAO;AACT,YAAM,UAAU,WAAW,GAAG;AAC9B,aACE,oCAAC,cAAW,OACV,oCAAC,aAAQ,CACX;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,CAAC,GACD,oCAAC,cAAM,OAAO,WAAW,IAAK,CAChC,CACF;AAEJ;AAEA,kBAAkB,YAAY;AAAA,EAC5B,QAAQ,UAAU,OAAO;AAC3B;AAEA,eAAe,MAAM,KAAK,iBAAiB;",
+  "sourcesContent": ["/* eslint-disable react/jsx-props-no-spreading */\nimport { CircularProgress, styled } from \"@mui/material\";\nimport PropTypes from \"prop-types\";\nimport React, { lazy, Suspense } from \"react\";\n\nconst ext = \"_round-blue-01.svg\";\nconst iconForMot = {};\n[\n  \"bus\",\n  \"ferry\",\n  \"gondola\",\n  \"tram\",\n  \"rail\",\n  \"funicular\",\n  \"cable_car\",\n  \"subway\",\n].forEach((mot) => {\n  iconForMot[mot] = lazy(() => {\n    return import(`../../images/mots/${mot}${ext}`);\n  });\n});\n\nconst StyledFlex = styled(\"div\")(() => ({\n  alignItems: \"center\",\n  display: \"flex\",\n  gap: 5,\n}));\n\nfunction StopsFinderOption({ option, ...props }) {\n  return (\n    <Suspense fallback={<CircularProgress size={20} />}>\n      <StyledFlex {...props}>\n        {Object.entries(option.properties?.mot).map(([key, value]) => {\n          if (value) {\n            const MotIcon = iconForMot[key];\n            return (\n              <StyledFlex key={key}>\n                <MotIcon />\n              </StyledFlex>\n            );\n          }\n          return null;\n        })}\n        <span>{option.properties.name}</span>\n      </StyledFlex>\n    </Suspense>\n  );\n}\n\nStopsFinderOption.propTypes = {\n  option: PropTypes.object.isRequired,\n};\n\nexport default React.memo(StopsFinderOption);\n"],
+  "mappings": "AACA,SAAS,kBAAkB,cAAc;AACzC,OAAO,eAAe;AACtB,OAAO,SAAS,MAAM,gBAAgB;AAEtC,MAAM,MAAM;AACZ,MAAM,aAAa,CAAC;AACpB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,QAAQ,CAAC,QAAQ;AACjB,aAAW,GAAG,IAAI,KAAK,MAAM;AAC3B,WAAO,OAAO,qBAAqB,GAAG,GAAG,GAAG;AAAA,EAC9C,CAAC;AACH,CAAC;AAED,MAAM,aAAa,OAAO,KAAK,EAAE,OAAO;AAAA,EACtC,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,KAAK;AACP,EAAE;AAEF,SAAS,kBAAkB,EAAE,QAAQ,GAAG,MAAM,GAAG;AAC/C,SACE,oCAAC,YAAS,UAAU,oCAAC,oBAAiB,MAAM,IAAI,KAC9C,oCAAC,cAAY,GAAG,SACb,OAAO,QAAQ,OAAO,YAAY,GAAG,EAAE,IAAI,CAAC,CAAC,KAAK,KAAK,MAAM;AAC5D,QAAI,OAAO;AACT,YAAM,UAAU,WAAW,GAAG;AAC9B,aACE,oCAAC,cAAW,OACV,oCAAC,aAAQ,CACX;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,CAAC,GACD,oCAAC,cAAM,OAAO,WAAW,IAAK,CAChC,CACF;AAEJ;AAEA,kBAAkB,YAAY;AAAA,EAC5B,QAAQ,UAAU,OAAO;AAC3B;AAEA,eAAe,MAAM,KAAK,iBAAiB;",
   "names": []
 }

package/components/Zoom/Zoom.js

@@ -1,25 +1,35 @@
+import { ZoomSlider } from "ol/control";
+import { easeOut } from "ol/easing";
+import OLMap from "ol/Map";
+import { unByKey } from "ol/Observable";
+import PropTypes from "prop-types";
 import React, {
+  useCallback,
   useEffect,
+  useMemo,
   useRef,
-  useCallback,
-  useState,
-  useMemo
+  useState
 } from "react";
-import PropTypes from "prop-types";
-import { FaPlus, FaMinus } from "react-icons/fa";
-import { ZoomSlider } from "ol/control";
-import OLMap from "ol/Map";
-import { easeOut } from "ol/easing";
-import { unByKey } from "ol/Observable";
+import { FaMinus, FaPlus } from "react-icons/fa";
 const propTypes = {
+  /**
+   * The zoom delta applied on each click.
+   */
+  delta: PropTypes.number,
   /**
    * An [ol/map](https://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html).
    */
   map: PropTypes.instanceOf(OLMap).isRequired,
   /**
-   * The zoom delta applied on each click.
+   * Callback function on zoom-in button click.
+   * @param {function} Callback function triggered when zoom-in button is clicked. Takes the event as argument.
    */
-  delta: PropTypes.number,
+  onZoomInButtonClick: PropTypes.func,
+  /**
+   * Callback function on zoom-out button click.
+   * @param {function} Callback function triggered when the zoom-out button is clicked. Takes the event as argument.
+   */
+  onZoomOutButtonClick: PropTypes.func,
   /**
    * Titles HTML attribtues for button.
    */
@@ -38,17 +48,7 @@ const propTypes = {
   /**
    * Display a slider to zoom.
    */
-  zoomSlider: PropTypes.bool,
-  /**
-   * Callback function on zoom-in button click.
-   * @param {function} Callback function triggered when zoom-in button is clicked. Takes the event as argument.
-   */
-  onZoomInButtonClick: PropTypes.func,
-  /**
-   * Callback function on zoom-out button click.
-   * @param {function} Callback function triggered when the zoom-out button is clicked. Takes the event as argument.
-   */
-  onZoomOutButtonClick: PropTypes.func
+  zoomSlider: PropTypes.bool
 };
 const updateZoom = (map, delta) => {
   const view = map.getView();
@@ -59,13 +59,16 @@ const updateZoom = (map, delta) => {
     view.cancelAnimations();
   }
   view.animate({
-    zoom: constrainedZoom,
     duration: 250,
-    easing: easeOut
+    easing: easeOut,
+    zoom: constrainedZoom
   });
 };
 function Zoom({
+  delta = 1,
   map,
+  onZoomInButtonClick = null,
+  onZoomOutButtonClick = null,
   titles = {
     zoomIn: "Zoom in",
     zoomOut: "Zoom out"
@@ -73,9 +76,6 @@ function Zoom({
   zoomInChildren = /* @__PURE__ */ React.createElement(FaPlus, { focusable: false }),
   zoomOutChildren = /* @__PURE__ */ React.createElement(FaMinus, { focusable: false }),
   zoomSlider = false,
-  onZoomInButtonClick = null,
-  onZoomOutButtonClick = null,
-  delta = 1,
   ...other
 }) {
   const ref = useRef();
@@ -131,25 +131,25 @@ function Zoom({
     /* @__PURE__ */ React.createElement("div", { className: "rs-zooms-bar", ...other }, /* @__PURE__ */ React.createElement(
       "button",
       {
-        type: "button",
-        tabIndex: 0,
         className: "rs-zoom-in",
-        title: titles.zoomIn,
+        disabled: zoomInDisabled,
         onClick: zoomIn,
         onKeyPress: zoomIn,
-        disabled: zoomInDisabled
+        tabIndex: 0,
+        title: titles.zoomIn,
+        type: "button"
       },
       zoomInChildren
     ), zoomSlider ? /* @__PURE__ */ React.createElement("div", { className: "rs-zoomslider-wrapper", ref }) : null, /* @__PURE__ */ React.createElement(
       "button",
       {
-        type: "button",
-        tabIndex: 0,
         className: "rs-zoom-out",
-        title: titles.zoomOut,
+        disabled: zoomOutDisabled,
         onClick: zoomOut,
         onKeyPress: zoomOut,
-        disabled: zoomOutDisabled
+        tabIndex: 0,
+        title: titles.zoomOut,
+        type: "button"
       },
       zoomOutChildren
     ))

package/components/Zoom/Zoom.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/Zoom/Zoom.js"],
-  "sourcesContent": ["import React, {\n  useEffect,\n  useRef,\n  useCallback,\n  useState,\n  useMemo,\n} from \"react\";\nimport PropTypes from \"prop-types\";\nimport { FaPlus, FaMinus } from \"react-icons/fa\";\nimport { ZoomSlider } from \"ol/control\";\nimport OLMap from \"ol/Map\";\nimport { easeOut } from \"ol/easing\";\nimport { unByKey } from \"ol/Observable\";\n\nconst propTypes = {\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   * The zoom delta applied on each click.\n   */\n  delta: PropTypes.number,\n\n  /**\n   * Titles HTML attribtues for button.\n   */\n  titles: PropTypes.shape({\n    zoomIn: PropTypes.string,\n    zoomOut: PropTypes.string,\n  }),\n\n  /**\n   * Children content of the zoom in button.\n   */\n  zoomInChildren: PropTypes.node,\n\n  /**\n   * Children content of the zoom out button.\n   */\n  zoomOutChildren: PropTypes.node,\n\n  /**\n   * Display a slider to zoom.\n   */\n  zoomSlider: PropTypes.bool,\n\n  /**\n   * Callback function on zoom-in button click.\n   * @param {function} Callback function triggered when zoom-in button is clicked. Takes the event as argument.\n   */\n  onZoomInButtonClick: PropTypes.func,\n\n  /**\n   * Callback function on zoom-out button click.\n   * @param {function} Callback function triggered when the zoom-out button is clicked. Takes the event as argument.\n   */\n  onZoomOutButtonClick: PropTypes.func,\n};\n\nconst updateZoom = (map, delta) => {\n  const view = map.getView();\n  const currentZoom = view.getZoom();\n  const newZoom = currentZoom + delta;\n  const constrainedZoom = view.getConstrainedZoom(newZoom);\n  if (view.getAnimating()) {\n    view.cancelAnimations();\n  }\n  view.animate({\n    zoom: constrainedZoom,\n    duration: 250,\n    easing: easeOut,\n  });\n};\n\n/**\n * The Zoom component creates a zoom wrapper containing zoom-in and zoom-out buttons\n * and an optional [ol/ZoomSlider](https://openlayers.org/en/latest/apidoc/module-ol_control_ZoomSlider-ZoomSlider.html).\n */\nfunction Zoom({\n  map,\n  titles = {\n    zoomIn: \"Zoom in\",\n    zoomOut: \"Zoom out\",\n  },\n  zoomInChildren = <FaPlus focusable={false} />,\n  zoomOutChildren = <FaMinus focusable={false} />,\n  zoomSlider = false,\n  onZoomInButtonClick = null,\n  onZoomOutButtonClick = null,\n  delta = 1,\n  ...other\n}) {\n  const ref = useRef();\n  const [currentZoom, setZoom] = useState();\n\n  const zoomIn = useCallback(\n    (evt) => {\n      if (onZoomInButtonClick) {\n        onZoomInButtonClick(evt);\n      }\n      if (!evt.which || evt.which === 13) {\n        updateZoom(map, delta);\n      }\n    },\n    [delta, map, onZoomInButtonClick],\n  );\n\n  const zoomOut = useCallback(\n    (evt) => {\n      if (onZoomOutButtonClick) {\n        onZoomOutButtonClick(evt);\n      }\n      if (!evt.which || evt.which === 13) {\n        updateZoom(map, -delta);\n      }\n    },\n    [delta, map, onZoomOutButtonClick],\n  );\n\n  const zoomInDisabled = useMemo(() => {\n    return (\n      currentZoom >=\n      map.getView().getConstrainedZoom(map.getView().getMaxZoom())\n    );\n  }, [currentZoom, map]);\n\n  const zoomOutDisabled = useMemo(() => {\n    return (\n      currentZoom <=\n      map.getView().getConstrainedZoom(map.getView().getMinZoom())\n    );\n  }, [currentZoom, map]);\n\n  useEffect(() => {\n    // Trigger zoom update to disable zooms on max and min\n    const listenerKey = map.on(\"moveend\", () => {\n      setZoom(map.getView().getZoom());\n    });\n\n    let control;\n    if (zoomSlider && ref.current) {\n      control = new ZoomSlider();\n      // We don't want to navigate to the zoom slider using TAB navigation.\n      control.element.firstElementChild.tabIndex = -1;\n      // Set the zoom slider in the custom control wrapper.\n      control.setTarget(ref.current);\n      map.addControl(control);\n    }\n    return () => {\n      unByKey(listenerKey);\n      if (control) {\n        map.removeControl(control);\n      }\n    };\n  }, [map, zoomSlider]);\n\n  return (\n    // eslint-disable-next-line react/jsx-props-no-spreading\n    <div className=\"rs-zooms-bar\" {...other}>\n      <button\n        type=\"button\"\n        tabIndex={0}\n        className=\"rs-zoom-in\"\n        title={titles.zoomIn}\n        onClick={zoomIn}\n        onKeyPress={zoomIn}\n        disabled={zoomInDisabled}\n      >\n        {zoomInChildren}\n      </button>\n      {zoomSlider ? <div className=\"rs-zoomslider-wrapper\" ref={ref} /> : null}\n      <button\n        type=\"button\"\n        tabIndex={0}\n        className=\"rs-zoom-out\"\n        title={titles.zoomOut}\n        onClick={zoomOut}\n        onKeyPress={zoomOut}\n        disabled={zoomOutDisabled}\n      >\n        {zoomOutChildren}\n      </button>\n    </div>\n  );\n}\n\nZoom.propTypes = propTypes;\n\nexport default React.memo(Zoom);\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { ZoomSlider } from \"ol/control\";\nimport { easeOut } from \"ol/easing\";\nimport OLMap from \"ol/Map\";\nimport { unByKey } from \"ol/Observable\";\nimport PropTypes from \"prop-types\";\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { FaMinus, FaPlus } from \"react-icons/fa\";\n\nconst propTypes = {\n  /**\n   * The zoom delta applied on each click.\n   */\n  delta: PropTypes.number,\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   * Callback function on zoom-in button click.\n   * @param {function} Callback function triggered when zoom-in button is clicked. Takes the event as argument.\n   */\n  onZoomInButtonClick: PropTypes.func,\n\n  /**\n   * Callback function on zoom-out button click.\n   * @param {function} Callback function triggered when the zoom-out button is clicked. Takes the event as argument.\n   */\n  onZoomOutButtonClick: PropTypes.func,\n\n  /**\n   * Titles HTML attribtues for button.\n   */\n  titles: PropTypes.shape({\n    zoomIn: PropTypes.string,\n    zoomOut: PropTypes.string,\n  }),\n\n  /**\n   * Children content of the zoom in button.\n   */\n  zoomInChildren: PropTypes.node,\n\n  /**\n   * Children content of the zoom out button.\n   */\n  zoomOutChildren: PropTypes.node,\n\n  /**\n   * Display a slider to zoom.\n   */\n  zoomSlider: PropTypes.bool,\n};\n\nconst updateZoom = (map, delta) => {\n  const view = map.getView();\n  const currentZoom = view.getZoom();\n  const newZoom = currentZoom + delta;\n  const constrainedZoom = view.getConstrainedZoom(newZoom);\n  if (view.getAnimating()) {\n    view.cancelAnimations();\n  }\n  view.animate({\n    duration: 250,\n    easing: easeOut,\n    zoom: constrainedZoom,\n  });\n};\n\n/**\n * The Zoom component creates a zoom wrapper containing zoom-in and zoom-out buttons\n * and an optional [ol/ZoomSlider](https://openlayers.org/en/latest/apidoc/module-ol_control_ZoomSlider-ZoomSlider.html).\n */\nfunction Zoom({\n  delta = 1,\n  map,\n  onZoomInButtonClick = null,\n  onZoomOutButtonClick = null,\n  titles = {\n    zoomIn: \"Zoom in\",\n    zoomOut: \"Zoom out\",\n  },\n  zoomInChildren = <FaPlus focusable={false} />,\n  zoomOutChildren = <FaMinus focusable={false} />,\n  zoomSlider = false,\n  ...other\n}) {\n  const ref = useRef();\n  const [currentZoom, setZoom] = useState();\n\n  const zoomIn = useCallback(\n    (evt) => {\n      if (onZoomInButtonClick) {\n        onZoomInButtonClick(evt);\n      }\n      if (!evt.which || evt.which === 13) {\n        updateZoom(map, delta);\n      }\n    },\n    [delta, map, onZoomInButtonClick],\n  );\n\n  const zoomOut = useCallback(\n    (evt) => {\n      if (onZoomOutButtonClick) {\n        onZoomOutButtonClick(evt);\n      }\n      if (!evt.which || evt.which === 13) {\n        updateZoom(map, -delta);\n      }\n    },\n    [delta, map, onZoomOutButtonClick],\n  );\n\n  const zoomInDisabled = useMemo(() => {\n    return (\n      currentZoom >=\n      map.getView().getConstrainedZoom(map.getView().getMaxZoom())\n    );\n  }, [currentZoom, map]);\n\n  const zoomOutDisabled = useMemo(() => {\n    return (\n      currentZoom <=\n      map.getView().getConstrainedZoom(map.getView().getMinZoom())\n    );\n  }, [currentZoom, map]);\n\n  useEffect(() => {\n    // Trigger zoom update to disable zooms on max and min\n    const listenerKey = map.on(\"moveend\", () => {\n      setZoom(map.getView().getZoom());\n    });\n\n    let control;\n    if (zoomSlider && ref.current) {\n      control = new ZoomSlider();\n      // We don't want to navigate to the zoom slider using TAB navigation.\n      control.element.firstElementChild.tabIndex = -1;\n      // Set the zoom slider in the custom control wrapper.\n      control.setTarget(ref.current);\n      map.addControl(control);\n    }\n    return () => {\n      unByKey(listenerKey);\n      if (control) {\n        map.removeControl(control);\n      }\n    };\n  }, [map, zoomSlider]);\n\n  return (\n    // eslint-disable-next-line react/jsx-props-no-spreading\n    <div className=\"rs-zooms-bar\" {...other}>\n      <button\n        className=\"rs-zoom-in\"\n        disabled={zoomInDisabled}\n        onClick={zoomIn}\n        onKeyPress={zoomIn}\n        tabIndex={0}\n        title={titles.zoomIn}\n        type=\"button\"\n      >\n        {zoomInChildren}\n      </button>\n      {zoomSlider ? <div className=\"rs-zoomslider-wrapper\" ref={ref} /> : null}\n      <button\n        className=\"rs-zoom-out\"\n        disabled={zoomOutDisabled}\n        onClick={zoomOut}\n        onKeyPress={zoomOut}\n        tabIndex={0}\n        title={titles.zoomOut}\n        type=\"button\"\n      >\n        {zoomOutChildren}\n      </button>\n    </div>\n  );\n}\n\nZoom.propTypes = propTypes;\n\nexport default React.memo(Zoom);\n"],
+  "mappings": "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",
   "names": []
 }

package/package.json

@@ -2,15 +2,15 @@
   "name": "react-spatial",
   "license": "MIT",
   "description": "Components to build React map apps.",
-  "version": "1.12.0",
+  "version": "1.12.1",
   "dependencies": {
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.5",
+    "@emotion/react": "^11.13.3",
+    "@emotion/styled": "^11.13.0",
     "@geops/geops-ui": "0.3.3",
-    "@mui/icons-material": "^5.16.0",
-    "@mui/material": "^5.16.0",
+    "@mui/icons-material": "^6.0.0",
+    "@mui/material": "^6.0.0",
     "re-resizable": "6.9.17",
-    "react-icons": "5.2.1",
+    "react-icons": "5.3.0",
     "resize-observer-polyfill": "1.5.1"
   },
   "peerDependencies": {
@@ -22,36 +22,37 @@
     "react-dom": "^18"
   },
   "devDependencies": {
-    "@babel/preset-env": "7.24.7",
+    "@babel/preset-env": "7.25.4",
     "@babel/preset-react": "7.24.7",
     "@cfaester/enzyme-adapter-react-18": "0.8.0",
-    "@commitlint/cli": "19.3.0",
-    "@commitlint/config-conventional": "19.2.2",
+    "@commitlint/cli": "19.4.1",
+    "@commitlint/config-conventional": "19.4.1",
     "@svgr/plugin-jsx": "^8.1.0",
     "@svgr/webpack": "8.1.0",
-    "@testing-library/dom": "^10.3.1",
-    "@testing-library/jest-dom": "6.4.6",
-    "@testing-library/react": "16.0.0",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "6.5.0",
+    "@testing-library/react": "16.0.1",
     "@testing-library/user-event": "14.5.2",
     "babel-jest": "29.7.0",
     "babel-loader": "9.1.3",
     "canvas": "2.11.2",
     "css-loader": "7.1.2",
     "enzyme": "3.11.0",
-    "esbuild": "^0.23.0",
-    "esbuild-loader": "^4.2.0",
+    "esbuild": "^0.23.1",
+    "esbuild-loader": "^4.2.2",
     "eslint": "8",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-prettier": "9.1.0",
     "eslint-plugin-import": "2.29.1",
     "eslint-plugin-jsx-a11y": "^6.9.0",
-    "eslint-plugin-prettier": "5.1.3",
-    "eslint-plugin-react": "7.34.3",
+    "eslint-plugin-perfectionist": "^3.3.0",
+    "eslint-plugin-prettier": "5.2.1",
+    "eslint-plugin-react": "7.35.0",
     "eslint-plugin-react-hooks": "4.6.2",
     "file-loader": "6.2.0",
     "fixpack": "4.0.0",
     "generact": "0.4.0",
-    "husky": "9.0.11",
+    "husky": "9.1.5",
     "identity-obj-proxy": "^3.0.0",
     "is-ci": "3.0.1",
     "jest": "29.7.0",
@@ -63,33 +64,33 @@
     "jest-transform-file": "1.1.1",
     "jest-transformer-svg": "^2.0.2",
     "jsts": "2.11.3",
-    "lint-staged": "15.2.7",
+    "lint-staged": "15.2.9",
     "mapbox-gl": "1.13.1",
-    "maplibre-gl": "4.5.0",
+    "maplibre-gl": "4.6.0",
     "mobility-toolbox-js": "2.4.2",
-    "ol": "9.2.4",
-    "postcss": "^8.4.39",
-    "prettier": "3.3.2",
-    "proj4": "2.11.0",
+    "ol": "10.1.0",
+    "postcss": "^8.4.41",
+    "prettier": "3.3.3",
+    "proj4": "2.12.0",
     "prop-types": "15.8.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-styleguidist": "13.1.3",
     "react-svg-loader": "3.0.3",
     "react-test-renderer": "18.3.1",
-    "sass": "1.77.7",
-    "sass-loader": "14.2.1",
+    "sass": "1.77.8",
+    "sass-loader": "16.0.1",
     "standard-version": "9.5.0",
     "stream-array": "1.1.2",
     "style-loader": "4.0.0",
-    "stylelint": "16.6.1",
+    "stylelint": "16.9.0",
     "stylelint-config-recommended-scss": "14.1.0",
     "stylelint-config-standard": "36.0.1",
-    "stylelint-scss": "6.4.1",
+    "stylelint-scss": "6.5.1",
     "terser-webpack-plugin": "^5.3.10",
     "url-loader": "4.1.1",
     "vinyl-fs": "4.0.0",
-    "webpack": "^5.92.1",
+    "webpack": "^5.94.0",
     "xml-beautifier": "0.5.0"
   },
   "scripts": {
@@ -130,12 +131,14 @@
     "extends": [
       "airbnb",
       "airbnb/hooks",
+      "plugin:perfectionist/recommended-alphabetical-legacy",
       "prettier"
     ],
     "parserOptions": {
       "ecmaVersion": "latest"
     },
     "plugins": [
+      "perfectionist",
       "prettier"
     ],
     "rules": {
@@ -146,6 +149,7 @@
           "devDependencies": true
         }
       ],
+      "react/sort-comp": "off",
       "react/jsx-filename-extension": [
         1,
         {
@@ -169,7 +173,7 @@
       ".+\\.svg$": "jest-transformer-svg"
     },
     "transformIgnorePatterns": [
-      "node_modules/(?!(color-*|jsts|ol|mobility-toolbox-js)|@geops|geotiff|quick-lru)"
+      "node_modules/(?!(color-*|jsts|ol|mobility-toolbox-js|@geops|geotiff|quick-lru|quickselect|rbush|pbf|earcut))"
     ],
     "testMatch": [
       "<rootDir>/src/**/?(*.)+(spec|test).[jt]s?(x)"

package/propTypes.js

@@ -6,25 +6,22 @@ const STATE_TIME_BASED = "TIME_BASED";
 const STATE_STOP_CANCELLED = "STOP_CANCELLED";
 const STATE_JOURNEY_CANCELLED = "JOURNEY_CANCELLED";
 const station = PropTypes.shape({
-  arrivalDelay: PropTypes.number,
-  // time in milliseconds.
   aimedArrivalTime: PropTypes.number,
   // time in milliseconds.
+  aimedDepartureTime: PropTypes.number,
+  // time in milliseconds.
+  arrivalDelay: PropTypes.number,
+  // time in milliseconds.
   arrivalTime: PropTypes.number,
   // time in milliseconds with the delay included.
   cancelled: PropTypes.bool,
   coordinates: PropTypes.arrayOf(PropTypes.number),
-  aimedDepartureTime: PropTypes.number,
-  // time in milliseconds.
   departureDelay: PropTypes.number,
   // time in milliseconds.
   departureTime: PropTypes.number,
   // time in milliseconds with the delay included
   noDropOff: PropTypes.bool,
   noPickUp: PropTypes.bool,
-  stationId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  stationName: PropTypes.string,
-  wheelchairAccessible: PropTypes.bool,
   state: PropTypes.oneOf([
     null,
     STATE_BOARDING,
@@ -33,7 +30,10 @@ const station = PropTypes.shape({
     STATE_TIME_BASED,
     STATE_STOP_CANCELLED,
     STATE_JOURNEY_CANCELLED
-  ])
+  ]),
+  stationId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  stationName: PropTypes.string,
+  wheelchairAccessible: PropTypes.bool
 });
 const lineInfos = PropTypes.shape({
   backgroundColor: PropTypes.string,
@@ -61,7 +61,7 @@ const lineInfos = PropTypes.shape({
 });
 export default {
   lineInfos,
-  station,
   STATE_BOARDING,
-  STATE_LEAVING
+  STATE_LEAVING,
+  station
 };

package/propTypes.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/propTypes.js"],
-  "sourcesContent": ["import PropTypes from \"prop-types\";\n\nconst STATE_BOARDING = \"BOARDING\";\nconst STATE_LEAVING = \"LEAVING\";\nconst STATE_PENDING = \"PENDING\";\nconst STATE_TIME_BASED = \"TIME_BASED\";\nconst STATE_STOP_CANCELLED = \"STOP_CANCELLED\";\nconst STATE_JOURNEY_CANCELLED = \"JOURNEY_CANCELLED\";\n\nconst station = PropTypes.shape({\n  arrivalDelay: PropTypes.number, // time in milliseconds.\n  aimedArrivalTime: PropTypes.number, // time in milliseconds.\n  arrivalTime: PropTypes.number, // time in milliseconds with the delay included.\n  cancelled: PropTypes.bool,\n  coordinates: PropTypes.arrayOf(PropTypes.number),\n  aimedDepartureTime: PropTypes.number, // time in milliseconds.\n  departureDelay: PropTypes.number, // time in milliseconds.\n  departureTime: PropTypes.number, // time in milliseconds with the delay included\n  noDropOff: PropTypes.bool,\n  noPickUp: PropTypes.bool,\n  stationId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  stationName: PropTypes.string,\n  wheelchairAccessible: PropTypes.bool,\n  state: PropTypes.oneOf([\n    null,\n    STATE_BOARDING,\n    STATE_LEAVING,\n    STATE_PENDING,\n    STATE_TIME_BASED,\n    STATE_STOP_CANCELLED,\n    STATE_JOURNEY_CANCELLED,\n  ]),\n});\n\nconst lineInfos = PropTypes.shape({\n  backgroundColor: PropTypes.string,\n  bicyclesAllowed: PropTypes.bool,\n  color: PropTypes.string,\n  destination: PropTypes.string,\n  feedsId: PropTypes.number,\n  id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  license: PropTypes.string,\n  licenseNote: PropTypes.string,\n  licenseUrl: PropTypes.string,\n  longName: PropTypes.string,\n  operatingInformations: PropTypes.object,\n  operator: PropTypes.string,\n  operatorTimeZone: PropTypes.string,\n  operatorUrl: PropTypes.string,\n  publisher: PropTypes.string,\n  publisherTimeZone: PropTypes.string,\n  publisherUrl: PropTypes.string,\n  realTime: PropTypes.number,\n  shortName: PropTypes.string,\n  stations: PropTypes.arrayOf(station),\n  vehicleType: PropTypes.number,\n  wheelchairAccessible: PropTypes.bool,\n});\n\nexport default {\n  lineInfos,\n  station,\n  STATE_BOARDING,\n  STATE_LEAVING,\n};\n"],
-  "mappings": "AAAA,OAAO,eAAe;AAEtB,MAAM,iBAAiB;AACvB,MAAM,gBAAgB;AACtB,MAAM,gBAAgB;AACtB,MAAM,mBAAmB;AACzB,MAAM,uBAAuB;AAC7B,MAAM,0BAA0B;AAEhC,MAAM,UAAU,UAAU,MAAM;AAAA,EAC9B,cAAc,UAAU;AAAA;AAAA,EACxB,kBAAkB,UAAU;AAAA;AAAA,EAC5B,aAAa,UAAU;AAAA;AAAA,EACvB,WAAW,UAAU;AAAA,EACrB,aAAa,UAAU,QAAQ,UAAU,MAAM;AAAA,EAC/C,oBAAoB,UAAU;AAAA;AAAA,EAC9B,gBAAgB,UAAU;AAAA;AAAA,EAC1B,eAAe,UAAU;AAAA;AAAA,EACzB,WAAW,UAAU;AAAA,EACrB,UAAU,UAAU;AAAA,EACpB,WAAW,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC;AAAA,EACnE,aAAa,UAAU;AAAA,EACvB,sBAAsB,UAAU;AAAA,EAChC,OAAO,UAAU,MAAM;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACH,CAAC;AAED,MAAM,YAAY,UAAU,MAAM;AAAA,EAChC,iBAAiB,UAAU;AAAA,EAC3B,iBAAiB,UAAU;AAAA,EAC3B,OAAO,UAAU;AAAA,EACjB,aAAa,UAAU;AAAA,EACvB,SAAS,UAAU;AAAA,EACnB,IAAI,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC;AAAA,EAC5D,SAAS,UAAU;AAAA,EACnB,aAAa,UAAU;AAAA,EACvB,YAAY,UAAU;AAAA,EACtB,UAAU,UAAU;AAAA,EACpB,uBAAuB,UAAU;AAAA,EACjC,UAAU,UAAU;AAAA,EACpB,kBAAkB,UAAU;AAAA,EAC5B,aAAa,UAAU;AAAA,EACvB,WAAW,UAAU;AAAA,EACrB,mBAAmB,UAAU;AAAA,EAC7B,cAAc,UAAU;AAAA,EACxB,UAAU,UAAU;AAAA,EACpB,WAAW,UAAU;AAAA,EACrB,UAAU,UAAU,QAAQ,OAAO;AAAA,EACnC,aAAa,UAAU;AAAA,EACvB,sBAAsB,UAAU;AAClC,CAAC;AAED,eAAe;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;",
+  "sourcesContent": ["import PropTypes from \"prop-types\";\n\nconst STATE_BOARDING = \"BOARDING\";\nconst STATE_LEAVING = \"LEAVING\";\nconst STATE_PENDING = \"PENDING\";\nconst STATE_TIME_BASED = \"TIME_BASED\";\nconst STATE_STOP_CANCELLED = \"STOP_CANCELLED\";\nconst STATE_JOURNEY_CANCELLED = \"JOURNEY_CANCELLED\";\n\nconst station = PropTypes.shape({\n  aimedArrivalTime: PropTypes.number, // time in milliseconds.\n  aimedDepartureTime: PropTypes.number, // time in milliseconds.\n  arrivalDelay: PropTypes.number, // time in milliseconds.\n  arrivalTime: PropTypes.number, // time in milliseconds with the delay included.\n  cancelled: PropTypes.bool,\n  coordinates: PropTypes.arrayOf(PropTypes.number),\n  departureDelay: PropTypes.number, // time in milliseconds.\n  departureTime: PropTypes.number, // time in milliseconds with the delay included\n  noDropOff: PropTypes.bool,\n  noPickUp: PropTypes.bool,\n  state: PropTypes.oneOf([\n    null,\n    STATE_BOARDING,\n    STATE_LEAVING,\n    STATE_PENDING,\n    STATE_TIME_BASED,\n    STATE_STOP_CANCELLED,\n    STATE_JOURNEY_CANCELLED,\n  ]),\n  stationId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  stationName: PropTypes.string,\n  wheelchairAccessible: PropTypes.bool,\n});\n\nconst lineInfos = PropTypes.shape({\n  backgroundColor: PropTypes.string,\n  bicyclesAllowed: PropTypes.bool,\n  color: PropTypes.string,\n  destination: PropTypes.string,\n  feedsId: PropTypes.number,\n  id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  license: PropTypes.string,\n  licenseNote: PropTypes.string,\n  licenseUrl: PropTypes.string,\n  longName: PropTypes.string,\n  operatingInformations: PropTypes.object,\n  operator: PropTypes.string,\n  operatorTimeZone: PropTypes.string,\n  operatorUrl: PropTypes.string,\n  publisher: PropTypes.string,\n  publisherTimeZone: PropTypes.string,\n  publisherUrl: PropTypes.string,\n  realTime: PropTypes.number,\n  shortName: PropTypes.string,\n  stations: PropTypes.arrayOf(station),\n  vehicleType: PropTypes.number,\n  wheelchairAccessible: PropTypes.bool,\n});\n\nexport default {\n  lineInfos,\n  STATE_BOARDING,\n  STATE_LEAVING,\n  station,\n};\n"],
+  "mappings": "AAAA,OAAO,eAAe;AAEtB,MAAM,iBAAiB;AACvB,MAAM,gBAAgB;AACtB,MAAM,gBAAgB;AACtB,MAAM,mBAAmB;AACzB,MAAM,uBAAuB;AAC7B,MAAM,0BAA0B;AAEhC,MAAM,UAAU,UAAU,MAAM;AAAA,EAC9B,kBAAkB,UAAU;AAAA;AAAA,EAC5B,oBAAoB,UAAU;AAAA;AAAA,EAC9B,cAAc,UAAU;AAAA;AAAA,EACxB,aAAa,UAAU;AAAA;AAAA,EACvB,WAAW,UAAU;AAAA,EACrB,aAAa,UAAU,QAAQ,UAAU,MAAM;AAAA,EAC/C,gBAAgB,UAAU;AAAA;AAAA,EAC1B,eAAe,UAAU;AAAA;AAAA,EACzB,WAAW,UAAU;AAAA,EACrB,UAAU,UAAU;AAAA,EACpB,OAAO,UAAU,MAAM;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAAA,EACD,WAAW,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC;AAAA,EACnE,aAAa,UAAU;AAAA,EACvB,sBAAsB,UAAU;AAClC,CAAC;AAED,MAAM,YAAY,UAAU,MAAM;AAAA,EAChC,iBAAiB,UAAU;AAAA,EAC3B,iBAAiB,UAAU;AAAA,EAC3B,OAAO,UAAU;AAAA,EACjB,aAAa,UAAU;AAAA,EACvB,SAAS,UAAU;AAAA,EACnB,IAAI,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC;AAAA,EAC5D,SAAS,UAAU;AAAA,EACnB,aAAa,UAAU;AAAA,EACvB,YAAY,UAAU;AAAA,EACtB,UAAU,UAAU;AAAA,EACpB,uBAAuB,UAAU;AAAA,EACjC,UAAU,UAAU;AAAA,EACpB,kBAAkB,UAAU;AAAA,EAC5B,aAAa,UAAU;AAAA,EACvB,WAAW,UAAU;AAAA,EACrB,mBAAmB,UAAU;AAAA,EAC7B,cAAc,UAAU;AAAA,EACxB,UAAU,UAAU;AAAA,EACpB,WAAW,UAAU;AAAA,EACrB,UAAU,UAAU,QAAQ,OAAO;AAAA,EACnC,aAAa,UAAU;AAAA,EACvB,sBAAsB,UAAU;AAClC,CAAC;AAED,eAAe;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;",
   "names": []
 }