/* eslint-disable react/button-has-type */
import React from 'react';
import PropTypes from 'prop-types';
import styles from './ZoomControl.styl';

export default function ZoomControl({ zoomIn, zoomOut }) {
  return (
    <div className={styles.zoomControl}>
      <button
        className={styles.zoomControlIn}
        onClick={() => zoomIn()}
      >
        +
      </button>
      <button
        className={styles.zoomControlOut}
        onClick={() => zoomOut()}
      >
        -
      </button>
    </div>
  );
}

ZoomControl.propTypes = {
  zoomIn: PropTypes.func.isRequired,
  zoomOut: PropTypes.func.isRequired
};