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

export const IconMenuFoldOutline = 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-menu-fold-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M2.75 4C2.33579 4 2 4.33579 2 4.75 2 5.16421 2.33579 5.5 2.75 5.5H17.25C17.6642 5.5 18 5.16421 18 4.75 18 4.33579 17.6642 4 17.25 4H2.75ZM9.5 9.25C9.08579 9.25 8.75 9.58579 8.75 10 8.75 10.4142 9.08579 10.75 9.5 10.75H17.25C17.6642 10.75 18 10.4142 18 10 18 9.58579 17.6642 9.25 17.25 9.25H9.5ZM2.75 14.5C2.33579 14.5 2 14.8358 2 15.25 2 15.6642 2.33579 16 2.75 16H17.25C17.6642 16 18 15.6642 18 15.25 18 14.8358 17.6642 14.5 17.25 14.5H2.75ZM5.04006 12.1502 2.36885 10.4203C2.00372 10.1838 2.00372 9.64952 2.36885 9.41306L5.04006 7.68313C5.43927 7.4246 5.96621 7.71113 5.96621 8.18674V11.6466C5.96621 12.1222 5.43927 12.4087 5.04006 12.1502Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconMenuFoldOutline.displayName = "IconMenuFoldOutline";

export default IconMenuFoldOutline;
