import React from 'react';
import LocationPin from './LocationPin';
import ControlZoom from './ControlZoom';
import Position from './Position';
import { makeStyles, Divider } from '@material-ui/core';
const useStyles = makeStyles(theme => ({
    root: {
        display: 'flex',
        flexDirection: 'row',
    },
    filter: {
        display: 'flex',
        flex: 1,
    },
    divider: {
        marginRight: theme.spacing(2),
        marginLeft: theme.spacing(2),
    },
}));
const MapControlsStandard = props => {
    const classes = useStyles();
    const { value, setZoom, handleSliderChange, handleInputChange, handleBlur, zoomIn, zoomOut, reset, changeLat, changeLong, setPosition, getLocation, locations, tooltip, } = props;
    return (React.createElement("div", { className: classes.root }, React.createElement("div", { className: classes.filter }, locations &&
        locations.map((item, index) => {
            return (React.createElement(LocationPin, { key: index, location: item.location, getLocation: getLocation, tooltip: item.tooltip }));
        })), React.createElement("div", { className: classes.divider }, React.createElement(Divider, { orientation: "vertical" })), React.createElement(Position, { changeLat: changeLat, changeLong: changeLong, setPosition: setPosition }), React.createElement("div", { className: classes.divider }, React.createElement(Divider, { orientation: "vertical" })), React.createElement("div", null, React.createElement(ControlZoom, { zoomIn: zoomIn, zoomOut: zoomOut, value: value, setValue: setZoom, handleSliderChange: handleSliderChange, handleInputChange: handleInputChange, handleBlur: handleBlur, reset: reset }))));
};
export default MapControlsStandard;
//# sourceMappingURL=MapControlsStandard.js.map