import React from 'react';

const ZoomOutRectangle = ({ fill = '#C1C8CD', width = '25', className = '', viewBox = '0 0 25 25' }) => (
  <svg
    width={width}
    height={width}
    viewBox={viewBox}
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
    className={className}
  >
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M18.5 2.78906H6.5C4.29086 2.78906 2.5 4.57992 2.5 6.78906V18.7891C2.5 20.9982 4.29086 22.7891 6.5 22.7891H18.5C20.7091 22.7891 22.5 20.9982 22.5 18.7891V6.78906C22.5 4.57992 20.7091 2.78906 18.5 2.78906ZM12.75 8.78906C12.75 9.20328 13.0858 9.53906 13.5 9.53906H14.6893L9.25 14.9784V13.7891C9.25 13.3748 8.91421 13.0391 8.5 13.0391C8.08579 13.0391 7.75 13.3748 7.75 13.7891V16.7891C7.75 17.2033 8.08579 17.5391 8.5 17.5391H11.5C11.9142 17.5391 12.25 17.2033 12.25 16.7891C12.25 16.3748 11.9142 16.0391 11.5 16.0391H10.3107L15.75 10.5997V11.7891C15.75 12.2033 16.0858 12.5391 16.5 12.5391C16.9142 12.5391 17.25 12.2033 17.25 11.7891V8.78906C17.25 8.37485 16.9142 8.03906 16.5 8.03906H13.5C13.0858 8.03906 12.75 8.37485 12.75 8.78906Z"
      fill={fill}
    />
  </svg>
);

export default ZoomOutRectangle;
