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

export const Icon3DCubeOutline = 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-3-d-cube-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M9.6221 1.22717C9.85562 1.09094 10.1444 1.09094 10.3779 1.22717L17.8779 5.60217C18.1083 5.73657 18.25 5.98325 18.25 6.25V13.75C18.25 14.0168 18.1083 14.2634 17.8779 14.3978L10.3779 18.7728C10.1444 18.9091 9.85562 18.9091 9.6221 18.7728L2.1221 14.3978C1.89168 14.2634 1.75 14.0168 1.75 13.75V6.25C1.75 5.98325 1.89168 5.73657 2.1221 5.60217L9.6221 1.22717ZM3.25 7.55578L9.25 11.0558V16.8192L3.25 13.3192V7.55578ZM10.75 16.8192L16.75 13.3192V7.55578L10.75 11.0558V16.8192ZM10 9.75672L16.0115 6.25L10 2.74328L3.98848 6.25L10 9.75672Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

Icon3DCubeOutline.displayName = "Icon3DCubeOutline";

export default Icon3DCubeOutline;