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

export const IconListSquareOutline = 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-list-square-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M6.90319 3.70322C7.13751 3.4689 7.13751 3.08901 6.90319 2.85469C6.66888 2.62038 6.28898 2.62038 6.05466 2.85469L4.35107 4.55829L3.59641 3.80362C3.36209 3.56931 2.98219 3.56931 2.74788 3.80362C2.51356 4.03794 2.51356 4.41784 2.74788 4.65215L3.92681 5.83108C4.16112 6.06539 4.54102 6.06539 4.77533 5.83108L6.90319 3.70322ZM4 10.8V9.2H5.6V10.8H4ZM3 9C3 8.55817 3.35817 8.2 3.8 8.2H5.8C6.24183 8.2 6.6 8.55817 6.6 9V11C6.6 11.4418 6.24183 11.8 5.8 11.8H3.8C3.35817 11.8 3 11.4418 3 11V9ZM4 14.7V16.3H5.6V14.7H4ZM3.8 13.7C3.35817 13.7 3 14.0582 3 14.5V16.5C3 16.9418 3.35817 17.3 3.8 17.3H5.8C6.24183 17.3 6.6 16.9418 6.6 16.5V14.5C6.6 14.0582 6.24183 13.7 5.8 13.7H3.8ZM9.3 4C8.9134 4 8.6 4.3134 8.6 4.7C8.6 5.0866 8.9134 5.4 9.3 5.4H16.5C16.8866 5.4 17.2 5.0866 17.2 4.7C17.2 4.3134 16.8866 4 16.5 4H9.3ZM8.6 10.2C8.6 9.8134 8.9134 9.5 9.3 9.5H16.5C16.8866 9.5 17.2 9.8134 17.2 10.2C17.2 10.5866 16.8866 10.9 16.5 10.9H9.3C8.9134 10.9 8.6 10.5866 8.6 10.2ZM9.3 15C8.9134 15 8.6 15.3134 8.6 15.7C8.6 16.0866 8.9134 16.4 9.3 16.4H16.5C16.8866 16.4 17.2 16.0866 17.2 15.7C17.2 15.3134 16.8866 15 16.5 15H9.3Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconListSquareOutline.displayName = "IconListSquareOutline";

export default IconListSquareOutline;