import * as React from 'react';
import styled from 'styled-components';

export interface IProps {
  width?: number;
  height?: number;
  color?: string;
  css?: string;
}

const Height = styled.svg<IProps>`
  fill:none;
  stroke-miterlimit: 10;
  stroke-width: 2px;
  stroke: currentColor;
  stroke-linecap: square;
`;

export default React.memo(({ width, height, color, ...props }: IProps) => (
  <Height xmlns='http://www.w3.org/2000/svg' width={width || 69} height={height || 68} viewBox='0 0 69 68' {...props}>
    <g transform="translate(-12.422)">
      <path className="i-height" d="M29.18 67H13.422V0M23.263 51.242h-9.841M23.263 41.379h-9.841M29.18 25.621H13.4M13.422 15.758h9.841M13.422 5.918h9.841M79.837 66.978a21.157 21.157 0 0 0 .584-4.877 20.7 20.7 0 0 0-41.4 0 20.165 20.165 0 0 0 .585 4.877"/>
      <circle className="i-height" cx="12.81" cy="12.81" r="12.81" transform="translate(46.911 15.758)"/>
    </g>
  </Height>
));