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

export const IconAlignCenterHorizontally = 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-align-center-horizontally`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M10.7499 4C10.7499 3.58579 10.4142 3.25 9.99994 3.25 9.58573 3.25 9.24994 3.58579 9.24994 4L9.24994 16C9.24994 16.4142 9.58572 16.75 9.99994 16.75 10.4142 16.75 10.7499 16.4142 10.7499 16L10.7499 4ZM15.1118 7.36719C15.4047 7.66009 15.4047 8.13496 15.1118 8.42785L14.2897 9.25H17.9296C18.3438 9.25 18.6796 9.58579 18.6796 10 18.6796 10.4142 18.3438 10.75 17.9296 10.75H14.2897L15.1118 11.5721C15.4047 11.865 15.4047 12.3399 15.1118 12.6328 14.8189 12.9257 14.344 12.9257 14.0512 12.6328L11.9487 10.5303C11.6558 10.2374 11.6558 9.76256 11.9487 9.46967L14.0512 7.36719C14.344 7.0743 14.8189 7.0743 15.1118 7.36719ZM4.88947 8.42919 5.71027 9.25H2.07031C1.6561 9.25 1.32031 9.58579 1.32031 10 1.32031 10.4142 1.6561 10.75 2.07031 10.75H5.71027L4.88947 11.5708C4.59658 11.8637 4.59658 12.3386 4.88947 12.6315 5.18236 12.9244 5.65724 12.9244 5.95013 12.6315L8.05127 10.5303C8.34416 10.2374 8.34416 9.76256 8.05127 9.46967L5.95013 7.36853C5.65724 7.07564 5.18236 7.07564 4.88947 7.36853 4.59658 7.66143 4.59658 8.1363 4.88947 8.42919Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconAlignCenterHorizontally.displayName = "IconAlignCenterHorizontally";

export default IconAlignCenterHorizontally;