import { forwardRef } from "react";
import type { IconProps } from "../../types";

export const IconTextBorderColorOutline = forwardRef<SVGSVGElement, IconProps>(
  ({ color = "currentColor", ...props }, forwardedRef) => {
    const { className } = props;
    props = {
      ...props,
      width: `${props.width || props.size || 20}`,
      height: `${props.height || props.size || 20}`,
      className: `${
        className ? className + " " : ""
      }customeow-icon customeow-icon-icon-text-border-color-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M14.5966 14.4581H11.9608L13.2128 10.8341L14.5966 14.4581Z"
          fill={color}
        />
        <path
          d="M6.55261 2.98351C8.33142 2.3964 10.2228 2.517 11.5253 2.97668L11.7782 3.07238L11.8475 3.10558C12.1822 3.28534 12.3333 3.69305 12.1854 4.05187C12.0275 4.43459 11.5887 4.61668 11.2059 4.4591C10.2335 4.05836 8.57714 3.89419 7.02234 4.40734C5.51167 4.90617 4.10015 6.0402 3.49207 8.2716C3.10017 9.71013 3.24778 10.858 3.6659 11.7579C4.08925 12.6687 4.81801 13.3839 5.67273 13.8927C6.52987 14.4028 7.48341 14.6871 8.30261 14.753C8.89298 14.8005 9.32883 14.728 9.61023 14.6193L11.163 10.1251C11.8026 8.2769 14.3331 8.17358 15.1581 9.87121C15.2432 9.79032 15.3151 9.70829 15.372 9.62414C15.6558 9.20385 15.74 8.50989 14.9686 7.3634L15.5907 6.94543L16.2128 6.52648C17.1584 7.93194 17.3823 9.32823 16.6151 10.464C16.3855 10.8038 16.0826 11.0905 15.7255 11.3321L17.7079 16.5226L17.745 16.6349L17.7714 16.7325L17.7958 16.8468C17.9222 17.6148 17.4977 18.3897 16.744 18.6778C15.9906 18.9651 15.1562 18.6722 14.7382 18.0148C14.7159 17.9797 14.6951 17.9426 14.6766 17.9054L14.6317 17.8146C14.6154 17.7816 14.6009 17.7473 14.5878 17.713L14.1737 16.628H12.4491L12.0917 17.6632C11.7907 18.5339 10.8406 18.9981 9.96863 18.6974L9.96765 18.6964C9.09838 18.3951 8.6344 17.446 8.93445 16.5743L8.93543 16.5734L9.04578 16.2511C8.75965 16.2719 8.46826 16.2711 8.1825 16.2482C7.1342 16.1638 5.95909 15.809 4.90515 15.1818C3.84858 14.5528 2.88153 13.6299 2.30554 12.3907C1.72457 11.1406 1.56841 9.62556 2.0448 7.87707C2.79763 5.1145 4.61068 3.62463 6.55261 2.98351ZM14.1473 10.4777C13.8137 9.60622 12.5737 9.62602 12.2684 10.5079L10.0409 16.9552C9.95111 17.2159 10.09 17.5006 10.3505 17.5909C10.6114 17.6809 10.896 17.5422 10.9862 17.2814L11.618 15.4513C11.6406 15.4544 11.664 15.4581 11.6874 15.4581H14.9735L14.9784 15.4571L15.6805 17.296L15.7255 17.3868C15.8502 17.5831 16.1003 17.6711 16.3261 17.5851C16.5517 17.4988 16.6792 17.2667 16.6415 17.0372L16.6151 16.9396L14.1473 10.4777Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
        <path
          d="M5.65418 10.1954C6.19468 10.1954 6.6326 10.6335 6.63269 11.1739 6.63264 11.7145 6.19471 12.1525 5.65418 12.1525 5.11377 12.1523 4.67571 11.7144 4.67566 11.1739 4.67575 10.6335 5.11379 10.1956 5.65418 10.1954ZM15.618 2.30578C15.9109 2.01295 16.3857 2.01293 16.6786 2.30578 16.9712 2.59868 16.9713 3.07353 16.6786 3.36633L10.8651 9.1798C10.5723 9.47233 10.0974 9.4723 9.80457 9.1798 9.51179 8.88699 9.51195 8.41216 9.80457 8.11926L15.618 2.30578ZM5.953 6.98937C6.49356 6.98939 6.93152 7.42733 6.93152 7.96789 6.93142 8.50836 6.4935 8.94639 5.953 8.9464 5.41258 8.94632 4.97459 8.50832 4.97449 7.96789 4.97449 7.42738 5.41252 6.98946 5.953 6.98937ZM15.1718 6.32238C15.5154 6.09155 15.9816 6.183 16.2128 6.52648L14.9686 7.3634C14.7375 7.0198 14.8282 6.55365 15.1718 6.32238ZM8.60242 5.16418C9.14285 5.16418 9.58071 5.60232 9.58093 6.14269 9.58088 6.68321 9.14295 7.12219 8.60242 7.12219 8.06201 7.12204 7.62396 6.68312 7.6239 6.14269 7.62412 5.6024 8.06211 5.16432 8.60242 5.16418Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconTextBorderColorOutline.displayName = "IconTextBorderColorOutline";

export default IconTextBorderColorOutline;