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

export const IconTextLetterSpacingOutline = 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-letter-spacing-outline`,
  };
  return (
    <svg
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      ref={forwardedRef}
    >
      <path
        d="M12.1576 12.5484L12.9616 14.853C13.1056 15.2655 13.5567 15.4833 13.9693 15.3393C14.3818 15.1954 14.5996 14.7442 14.4556 14.3317L11.3585 5.45494C10.9149 4.18353 9.11768 4.18104 8.67055 5.45121L5.54513 14.3296C5.40004 14.7418 5.61655 15.1935 6.0287 15.3386C6.44086 15.4837 6.8926 15.2672 7.03769 14.855L7.84967 12.5484H12.1576ZM11.6055 10.9661L10.0132 6.40251L8.40669 10.9661H11.6055Z"
        fill={color}
        fillRule="evenodd"
        clipRule="evenodd"
      />
      <path
        d="M1.3 4.04999C1.3 3.63577 1.63579 3.29999 2.05 3.29999 2.46422 3.29999 2.8 3.63577 2.8 4.04999V16.05C2.8 16.4642 2.46422 16.8 2.05 16.8 1.63579 16.8 1.3 16.4642 1.3 16.05V4.04999ZM17.2 4.04999C17.2 3.63577 17.5358 3.29999 17.95 3.29999 18.3642 3.29999 18.7 3.63577 18.7 4.04999V16.05C18.7 16.4642 18.3642 16.8 17.95 16.8 17.5358 16.8 17.2 16.4642 17.2 16.05V4.04999Z"
        fill={color}
      />
    </svg>
  );
});

IconTextLetterSpacingOutline.displayName = "IconTextLetterSpacingOutline";

export default IconTextLetterSpacingOutline;