import React from "react";
import PropTypes from "prop-types";
import { withTheme } from "styled-components";
import { getObjectValue } from "../utils/util";
import IconWrapper from "../IconWrapper";

const PublishIcon = props => {
  return (
    <IconWrapper {...props}>
      <svg
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M9.87778 15.9889L11.4444 17.5556L17 12L11.4444 6.44444L9.87778 8.01111L12.7444 10.8889H2V13.1111H12.7444L9.87778 15.9889ZM19.7778 2H4.22222C2.98889 2 2 3 2 4.22222V8.66667H4.22222V4.22222H19.7778V19.7778H4.22222V15.3333H2V19.7778C2 21 2.98889 22 4.22222 22H19.7778C21 22 22 21 22 19.7778V4.22222C22 3 21 2 19.7778 2Z"
          fill={getObjectValue(
            props.theme.colors,
            props.iconColor,
            props.theme.colors.grey.deep,
          )}
        />
      </svg>
    </IconWrapper>
  );
};

PublishIcon.propTypes = {
  iconColor: PropTypes.string,
};

export default withTheme(PublishIcon);
