import { forwardRef, useMemo } from 'react';
import { IconProps } from './types';

export const IconGcpColor24 = forwardRef<SVGSVGElement, IconProps>(
    ({ color = 'currentColor', title, ...props }, svgRef) => {
        const titleId = useMemo(
            () =>
                title
                    ? 'title-' + Math.random().toString(36).substr(2, 9)
                    : undefined,
            [title]
        );
        return (
            <svg
                xmlns="http://www.w3.org/2000/svg"
                width={24}
                height={24}
                fill="none"
                viewBox="0 0 24 24"
                aria-hidden={!title}
                ref={svgRef}
                aria-labelledby={titleId}
                {...props}
            >
                {title ? <title id={titleId}>{title}</title> : null}
                <path
                    fill="#ea4335"
                    d="m15.084 8.501 2.516-2-.443-.551A7.91 7.91 0 0 0 9.71 4.326a7.85 7.85 0 0 0-5.303 5.446c-.042.15.415-.13.617-.075l3.476-.57s.17-.166.269-.273c1.547-1.689 4.168-1.91 5.954-.473z"
                />
                <path
                    fill="#4285f4"
                    d="M19.516 9.733a7.8 7.8 0 0 0-2.36-3.784l-2.44 2.426a4.3 4.3 0 0 1 1.591 3.42v.43c1.2 0 2.172.967 2.172 2.16a2.165 2.165 0 0 1-2.172 2.158l-4.343-.003-.433.046v3.344l.433.07h4.343c2.49.02 4.7-1.585 5.438-3.95a5.6 5.6 0 0 0-2.23-6.317"
                />
                <path
                    fill="#34a853"
                    d="M7.615 19.998h4.343V16.54H7.615c-.31 0-.615-.087-.897-.215l-.61.188-1.75 1.728-.153.596c.982.738 2.18 1.167 3.41 1.161"
                />
                <path
                    fill="#fbbc05"
                    d="M7.615 8.763a5.65 5.65 0 0 0-5.32 3.823 5.61 5.61 0 0 0 1.91 6.251l2.52-2.512a2.156 2.156 0 0 1-1.256-2.272 2.165 2.165 0 0 1 1.843-1.833 2.17 2.17 0 0 1 2.285 1.249l2.52-2.505a5.65 5.65 0 0 0-4.502-2.201"
                />
            </svg>
        );
    }
);