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

export const IconEllipsisMoreHorizontal = 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-ellipsis-more-horizontal`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M3 10C3 9.17157 3.67157 8.5 4.5 8.5 5.32843 8.5 6 9.17157 6 10 6 10.8284 5.32843 11.5 4.5 11.5 3.67157 11.5 3 10.8284 3 10ZM8.5 10C8.5 9.17157 9.17157 8.5 10 8.5 10.8284 8.5 11.5 9.17157 11.5 10 11.5 10.8284 10.8284 11.5 10 11.5 9.17157 11.5 8.5 10.8284 8.5 10ZM15.5 8.5C14.6716 8.5 14 9.17157 14 10 14 10.8284 14.6716 11.5 15.5 11.5 16.3284 11.5 17 10.8284 17 10 17 9.17157 16.3284 8.5 15.5 8.5Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconEllipsisMoreHorizontal.displayName = "IconEllipsisMoreHorizontal";

export default IconEllipsisMoreHorizontal;