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

export const IconMusical3Solid = 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-musical-3-solid`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M16.9574 2.47698C16.9861 2.57449 17.0006 2.67541 17.0006 2.77682V4.87026C17.0005 5.10706 16.9212 5.3374 16.7747 5.52644C16.6282 5.71548 16.4224 5.85295 16.1886 5.91807L10.8405 7.40529L10.84 14.6838C10.84 15.6733 10.4452 16.6241 9.73894 17.3356C9.03268 18.0472 8.07012 18.4639 7.05432 18.4978L6.91992 18.5C6.30461 18.5 5.69794 18.359 5.149 18.0883C4.60006 17.8177 4.12427 17.4251 3.76013 16.9422C3.39599 16.4594 3.15373 15.8998 3.05294 15.3089C2.95216 14.718 2.99568 14.1123 3.17999 13.5407C3.3643 12.9692 3.68422 12.448 4.11386 12.0192C4.54351 11.5904 5.07081 11.2661 5.6531 11.0725C6.2354 10.8789 6.85633 10.8214 7.46565 10.9048C8.07498 10.9882 8.65559 11.21 9.1605 11.5524V4.05687H9.1969C9.24642 3.87385 9.34403 3.70653 9.48012 3.57137C9.61621 3.43621 9.78609 3.33787 9.97307 3.28601L15.5731 1.72792C15.8587 1.64856 16.165 1.6829 16.4246 1.82337C16.6842 1.96384 16.8759 2.19895 16.9574 2.47698Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconMusical3Solid.displayName = "IconMusical3Solid";

export default IconMusical3Solid;