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

export const IconCloseUngroupSolid = 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-close-ungroup-solid`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M11.1719 11.1719C12.734 9.60978 15.266 9.60978 16.8281 11.1719C18.3902 12.734 18.3902 15.266 16.8281 16.8281C15.266 18.3902 12.734 18.3902 11.1719 16.8281C9.60978 15.266 9.60978 12.734 11.1719 11.1719ZM8.58594 2.5C9.05001 2.50004 9.49509 2.68454 9.82324 3.0127L11.2373 4.42676C11.2842 4.47361 11.3478 4.49996 11.4141 4.5H16.25C17.2165 4.5 18 5.2835 18 6.25V10.2275L17.8887 10.1113C15.7408 7.96344 12.2592 7.96344 10.1113 10.1113C8.38204 11.8406 8.04631 14.4337 9.10156 16.5H3.75C2.7835 16.5 2 15.7165 2 14.75V4.25C2 3.2835 2.7835 2.5 3.75 2.5H8.58594ZM15.8125 12.1875C15.5553 11.9303 15.1382 11.9304 14.8809 12.1875L14 13.0684L13.1191 12.1875C12.8618 11.9305 12.4447 11.9303 12.1875 12.1875C11.9303 12.4447 11.9305 12.8618 12.1875 13.1191L13.0684 14L12.1875 14.8809C11.9305 15.1382 11.9303 15.5553 12.1875 15.8125C12.4447 16.0697 12.8618 16.0695 13.1191 15.8125L14 14.9316L14.8809 15.8125C15.1382 16.0696 15.5553 16.0697 15.8125 15.8125C16.0697 15.5553 16.0696 15.1382 15.8125 14.8809L14.9316 14L15.8125 13.1191C16.0696 12.8618 16.0697 12.4447 15.8125 12.1875Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconCloseUngroupSolid.displayName = "IconCloseUngroupSolid";

export default IconCloseUngroupSolid;