@hipay/hipay-material-ui 2.3.0-rc.5 → 2.3.0-rc.PSYCHE-2530

package/es/HiLoader/index.js

@@ -1 +1,15 @@
-export { default } from './HiLoader';
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _HiLoader.default;
+  }
+});
+
+var _HiLoader = _interopRequireDefault(require("./HiLoader"));

package/es/HiMap/HiMap.js

@@ -1,281 +1,317 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
-import HiButton from '../HiButton';
-import HiIcon from '../HiIcon';
-import HiLoader from '../HiLoader';
-import L from 'leaflet';
-import { Map, TileLayer, Marker } from 'react-leaflet';
-const apiUrl = 'https://nominatim.openstreetmap.org/search?q='; // The original CSS can be found here : https://unpkg.com/leaflet@1.3.1/dist/leaflet.css
-
-export const styles = theme => ({
-  map: {
-    height: '100%',
-    overflow: 'hidden',
-    // eslint-disable-next-line max-len
-    '& .leaflet-pane, & .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow, & .leaflet-tile-container, & .leaflet-pane > svg, & .leaflet-pane > canvas, & .leaflet-zoom-box, & .leaflet-image-layer, & .leaflet-layer': {
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.styles = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hipay-material-ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _HiButton = _interopRequireDefault(require("../HiButton"));
+
+var _HiIcon = _interopRequireDefault(require("../HiIcon"));
+
+var _HiLoader = _interopRequireDefault(require("../HiLoader"));
+
+var _leaflet = _interopRequireDefault(require("leaflet"));
+
+var _reactLeaflet = require("react-leaflet");
+
+var apiUrl = 'https://nominatim.openstreetmap.org/search?q='; // The original CSS can be found here : https://unpkg.com/leaflet@1.3.1/dist/leaflet.css
+
+var styles = function styles(theme) {
+  return {
+    map: {
+      height: '100%',
+      overflow: 'hidden',
+      // eslint-disable-next-line max-len
+      '& .leaflet-pane, & .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow, & .leaflet-tile-container, & .leaflet-pane > svg, & .leaflet-pane > canvas, & .leaflet-zoom-box, & .leaflet-image-layer, & .leaflet-layer': {
+        position: 'absolute',
+        left: 0,
+        top: 0
+      },
+      '& .leaflet-container': {
+        overflow: 'hidden',
+        height: '100%'
+      },
+      '& .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow': {
+        '-webkit-user-select': 'none',
+        '-moz-user-select': 'none',
+        userSelect: 'none',
+        '-webkit-user-drag': 'none'
+      },
+      '& .leaflet-control': {
+        display: 'none'
+      },
+      '& .map_marker': {
+        fill: theme.palette.primary.light
+      }
+    },
+    controlButtons: {
       position: 'absolute',
-      left: 0,
-      top: 0
+      bottom: 16,
+      right: 16
     },
-    '& .leaflet-container': {
-      overflow: 'hidden',
-      height: '100%'
+    centerIcon: {
+      fontSize: 14
     },
-    '& .leaflet-tile, & .leaflet-marker-icon, & .leaflet-marker-shadow': {
-      '-webkit-user-select': 'none',
-      '-moz-user-select': 'none',
-      userSelect: 'none',
-      '-webkit-user-drag': 'none'
+    centerButtonContainer: {
+      backgroundColor: theme.palette.background1,
+      borderRadius: 3,
+      padding: 3,
+      fontFamily: theme.typography.fontFamily,
+      boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
+      color: theme.palette.neutral.normal,
+      '&>button:first-child': {
+        borderBottom: "1px solid ".concat(theme.palette.neutral.normal)
+      }
     },
-    '& .leaflet-control': {
-      display: 'none'
+    centerButton: {
+      color: theme.palette.neutral.normal,
+      padding: '1px !important',
+      height: 26,
+      minHeight: 26,
+      width: 26,
+      minWidth: 26
     },
-    '& .map_marker': {
-      fill: theme.palette.primary.light
-    }
-  },
-  controlButtons: {
-    position: 'absolute',
-    bottom: 16,
-    right: 16
-  },
-  centerIcon: {
-    fontSize: 14
-  },
-  centerButtonContainer: {
-    backgroundColor: theme.palette.global.background1,
-    borderRadius: 3,
-    padding: 3,
-    fontFamily: theme.typography.fontFamily,
-    boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
-    color: theme.palette.neutral.normal,
-    '&>button:first-child': {
-      borderBottom: `1px solid ${theme.palette.neutral.normal}`
-    }
-  },
-  centerButton: {
-    color: theme.palette.neutral.normal,
-    padding: '1px !important',
-    height: 26,
-    minHeight: 26,
-    width: 26,
-    minWidth: 26
-  },
-  zoomButtons: {
-    backgroundColor: theme.palette.global.background1,
-    borderRadius: 3,
-    padding: 3,
-    fontFamily: theme.typography.fontFamily,
-    boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
-    color: theme.palette.neutral.normal,
-    '&>button:first-child': {
-      borderBottom: `1px solid ${theme.palette.neutral.normal}`
-    }
-  },
-  zoomButton: {
-    paddingTop: '0px !important',
-    paddingBottom: 0,
-    paddingRight: 6,
-    paddingLeft: 6,
-    minWidth: 0,
-    minHeight: 0,
-    borderRadius: 0,
-    display: 'block',
-    fontSize: 24,
-    fontWeight: 'bold',
-    lineHeight: '26px',
-    '&>span': {
-      width: 14
+    zoomButtons: {
+      backgroundColor: theme.palette.background1,
+      borderRadius: 3,
+      padding: 3,
+      fontFamily: theme.typography.fontFamily,
+      boxShadow: '1px 1px 5px rgba(0, 0, 0, .16)',
+      color: theme.palette.neutral.normal,
+      '&>button:first-child': {
+        borderBottom: "1px solid ".concat(theme.palette.neutral.normal)
+      }
+    },
+    zoomButton: {
+      paddingTop: '0px !important',
+      paddingBottom: 0,
+      paddingRight: 6,
+      paddingLeft: 6,
+      minWidth: 0,
+      minHeight: 0,
+      borderRadius: 0,
+      display: 'block',
+      fontSize: 24,
+      fontWeight: 'bold',
+      lineHeight: '26px',
+      '&>span': {
+        width: 14
+      }
     }
-  }
-});
+  };
+};
 
-var _ref = React.createElement(TileLayer, {
+exports.styles = styles;
+
+var _ref = _react.default.createElement(_reactLeaflet.TileLayer, {
   url: "http://{s}.tile.openstreetmap.se/hydda/full/{z}/{x}/{y}.png"
 });
 
-var _ref2 = React.createElement(HiLoader, {
+var _ref2 = _react.default.createElement(_HiLoader.default, {
   loading: true
 });
 
-class HiMap extends React.PureComponent {
-  constructor(props) {
-    super(props);
-    this.mounted = false;
-    this.state = {
+var HiMap =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiMap, _React$PureComponent);
+
+  function HiMap(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, HiMap);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiMap).call(this, props));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "mounted", false);
+    _this.state = {
       lat: 0,
       lng: 0,
       notFound: false,
       loaded: false,
       zoom: 16
     };
-    this.handleClickZoomIn = this.handleClickZoomIn.bind(this);
-    this.handleScrollZoom = this.handleScrollZoom.bind(this);
-    this.handleClickZoomOut = this.handleClickZoomOut.bind(this);
-    this.handleCenter = this.handleCenter.bind(this);
+    _this.handleClickZoomIn = _this.handleClickZoomIn.bind((0, _assertThisInitialized2.default)(_this));
+    _this.handleScrollZoom = _this.handleScrollZoom.bind((0, _assertThisInitialized2.default)(_this));
+    _this.handleClickZoomOut = _this.handleClickZoomOut.bind((0, _assertThisInitialized2.default)(_this));
+    _this.handleCenter = _this.handleCenter.bind((0, _assertThisInitialized2.default)(_this));
+    return _this;
   } // Loads the libraries once the component mounted to avoid error caused by server-cli rendering.
 
 
-  componentDidMount() {
-    this.mounted = true;
-    this.findCoords();
-  }
-
-  componentWillUnmount() {
-    this.mounted = false;
-  }
-
-  handleScrollZoom(event) {
-    this.setState({
-      zoom: event.zoom
-    });
-  }
+  (0, _createClass2.default)(HiMap, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.mounted = true;
+      this.findCoords();
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.mounted = false;
+    }
+  }, {
+    key: "handleScrollZoom",
+    value: function handleScrollZoom(event) {
+      this.setState({
+        zoom: event.zoom
+      });
+    }
+  }, {
+    key: "handleClickZoomIn",
+    value: function handleClickZoomIn() {
+      this.setState(function (prevState) {
+        return {
+          zoom: prevState.zoom + 1
+        };
+      });
+    }
+  }, {
+    key: "handleClickZoomOut",
+    value: function handleClickZoomOut() {
+      this.setState(function (prevState) {
+        return {
+          zoom: prevState.zoom - 1
+        };
+      });
+    }
+  }, {
+    key: "handleCenter",
+    value: function handleCenter() {
+      // trick to center the map.
+      this.setState(function (prevState) {
+        return {
+          lat: prevState.lat + 0.0000000001
+        };
+      });
+    } // Call to the geocoding API.
 
-  handleClickZoomIn() {
-    this.setState(prevState => {
-      return {
-        zoom: prevState.zoom + 1
-      };
-    });
-  }
+  }, {
+    key: "findCoords",
+    value: function findCoords() {
+      var _this2 = this;
 
-  handleClickZoomOut() {
-    this.setState(prevState => {
-      return {
-        zoom: prevState.zoom - 1
-      };
-    });
-  }
+      fetch("".concat(apiUrl).concat(this.props.address, "&format=jsonv2&limit=5&bounded=1&dedupe=1&namedetails=1")).then(function (result) {
+        return result.json();
+      }).then(function (response) {
+        if (_this2.mounted) {
+          if (response.length !== 0) {
+            _this2.setState({
+              lat: parseFloat(response[0].lat),
+              lng: parseFloat(response[0].lon),
+              notFound: false,
+              loaded: true
+            });
+          } else {
+            _this2.setState({
+              notFound: true
+            });
 
-  handleCenter() {
-    // trick to center the map.
-    this.setState(prevState => {
-      return {
-        lat: prevState.lat + 0.0000000001
-      };
-    });
-  } // Call to the geocoding API.
-
-
-  findCoords() {
-    fetch(`${apiUrl}${this.props.address}&format=jsonv2&limit=5&bounded=1&dedupe=1&namedetails=1`).then(result => result.json()).then(response => {
-      if (this.mounted) {
-        if (response.length !== 0) {
-          this.setState({
-            lat: parseFloat(response[0].lat),
-            lng: parseFloat(response[0].lon),
-            notFound: false,
-            loaded: true
-          });
-        } else {
-          this.setState({
-            notFound: true
-          });
-          this.props.onAddressNotFound();
+            _this2.props.onAddressNotFound();
+          }
         }
-      }
-    });
-  }
-
-  render() {
-    const {
-      zoom,
-      lng,
-      lat,
-      notFound,
-      loaded
-    } = this.state;
-    const {
-      translations,
-      classes
-    } = this.props;
-    const position = [lat, lng];
-    let element;
-    let myIcon;
-    if (notFound) element = translations.notFound;
-
-    if (loaded && L && Map) {
-      myIcon = L.divIcon({
-        html: '<svg x="0px" y="0px" viewBox="0 0 365 560" enable-background="new 0 0 365 560" xml:space="preserve">\n' + '<path class="map_marker" ' + 'd="M182.9,551.7c0,0.1,0.2,0.3,0.2,0.3S358.3,283,358.3,194.6c0-130.1-88.8-186.7-175.4-186.9 ' + 'C96.3,7.9,7.5,64.5,7.5,194.6c0,88.4,175.3,357.4,175.3,357.4S182.9,551.7,182.9,551.7z' + ' M122.2,187.2c0-33.6,27.2-60.8,60.8-60.8 ' + 'c33.6,0,60.8,27.2,60.8,60.8S216.5,248,182.9,248C149.4,248,122.2,220.8,122.2,187.2z"/>\n' + '</svg>',
-        iconSize: [24, 36],
-        iconAnchor: [11, 36]
       });
-      element = React.createElement(Map, {
-        zoom: zoom,
-        center: position,
-        className: classes.map,
-        onViewportChange: this.handleScrollZoom
-      }, _ref, React.createElement(Marker, {
-        position: position,
-        icon: myIcon
-      }), React.createElement("div", {
-        className: classes.controlButtons
-      }, React.createElement("div", {
-        className: classes.centerButtonContainer
-      }, React.createElement(HiButton, {
-        className: classes.centerButton,
-        onClick: this.handleCenter
-      }, React.createElement(HiIcon, {
-        className: classes.centerIcon,
-        icon: 'my_location',
-        size: 24
-      }))), React.createElement("div", {
-        className: classes.zoomButtons
-      }, React.createElement(HiButton, {
-        onClick: this.handleClickZoomIn,
-        className: classes.zoomButton
-      }, "+"), React.createElement(HiButton, {
-        onClick: this.handleClickZoomOut,
-        className: classes.zoomButton
-      }, "-"))));
-    } else {
-      element = React.createElement("div", {
-        style: {
-          top: '50%',
-          left: '50%',
-          position: 'absolute'
-        }
-      }, _ref2);
     }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$state = this.state,
+          zoom = _this$state.zoom,
+          lng = _this$state.lng,
+          lat = _this$state.lat,
+          notFound = _this$state.notFound,
+          loaded = _this$state.loaded;
+      var _this$props = this.props,
+          translations = _this$props.translations,
+          classes = _this$props.classes;
+      var position = [lat, lng];
+      var element;
+      var myIcon;
+      if (notFound) element = translations.notFound;
 
-    return React.createElement("div", {
-      style: {
-        height: '352px',
-        width: '100%',
-        position: 'relative'
+      if (loaded && _leaflet.default && _reactLeaflet.Map) {
+        myIcon = _leaflet.default.divIcon({
+          html: '<svg x="0px" y="0px" viewBox="0 0 365 560" enable-background="new 0 0 365 560" xml:space="preserve">\n' + '<path class="map_marker" ' + 'd="M182.9,551.7c0,0.1,0.2,0.3,0.2,0.3S358.3,283,358.3,194.6c0-130.1-88.8-186.7-175.4-186.9 ' + 'C96.3,7.9,7.5,64.5,7.5,194.6c0,88.4,175.3,357.4,175.3,357.4S182.9,551.7,182.9,551.7z' + ' M122.2,187.2c0-33.6,27.2-60.8,60.8-60.8 ' + 'c33.6,0,60.8,27.2,60.8,60.8S216.5,248,182.9,248C149.4,248,122.2,220.8,122.2,187.2z"/>\n' + '</svg>',
+          iconSize: [24, 36],
+          iconAnchor: [11, 36]
+        });
+        element = _react.default.createElement(_reactLeaflet.Map, {
+          zoom: zoom,
+          center: position,
+          className: classes.map,
+          onViewportChange: this.handleScrollZoom
+        }, _ref, _react.default.createElement(_reactLeaflet.Marker, {
+          position: position,
+          icon: myIcon
+        }), _react.default.createElement("div", {
+          className: classes.controlButtons
+        }, _react.default.createElement("div", {
+          className: classes.centerButtonContainer
+        }, _react.default.createElement(_HiButton.default, {
+          className: classes.centerButton,
+          onClick: this.handleCenter
+        }, _react.default.createElement(_HiIcon.default, {
+          className: classes.centerIcon,
+          icon: 'my_location',
+          size: 24
+        }))), _react.default.createElement("div", {
+          className: classes.zoomButtons
+        }, _react.default.createElement(_HiButton.default, {
+          onClick: this.handleClickZoomIn,
+          className: classes.zoomButton
+        }, "+"), _react.default.createElement(_HiButton.default, {
+          onClick: this.handleClickZoomOut,
+          className: classes.zoomButton
+        }, "-"))));
+      } else {
+        element = _react.default.createElement("div", {
+          style: {
+            top: '50%',
+            left: '50%',
+            position: 'absolute'
+          }
+        }, _ref2);
       }
-    }, element);
-  }
 
-}
+      return _react.default.createElement("div", {
+        style: {
+          height: '352px',
+          width: '100%',
+          position: 'relative'
+        }
+      }, element);
+    }
+  }]);
+  return HiMap;
+}(_react.default.PureComponent);
 
-HiMap.defaultProps = {
+(0, _defineProperty2.default)(HiMap, "defaultProps", {
   translations: {
     notFound: 'Address not found'
   }
-};
-HiMap.propTypes = process.env.NODE_ENV !== "production" ? {
-  /**
-   * The address to see in the Map component.
-   */
-  address: PropTypes.string.isRequired,
-
-  /**
-   * Useful to extend the style applied to components.
-   */
-  classes: PropTypes.object.isRequired,
-
-  /**
-   * Function to tell the parent composant that the address was not found by the API.
-   */
-  onAddressNotFound: PropTypes.func,
-
-  /**
-   * Traductions
-   */
-  translations: PropTypes.object
-} : {};
-export default withStyles(styles, {
+});
+
+var _default = (0, _styles.withStyles)(styles, {
   name: 'HmuiHiMap'
-})(HiMap);
+})(HiMap);
+
+exports.default = _default;