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

export const IconCodepenColor16 = 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={16}
                height={16}
                fill="none"
                viewBox="0 0 16 16"
                aria-hidden={!title}
                ref={svgRef}
                aria-labelledby={titleId}
                {...props}
            >
                {title ? <title id={titleId}>{title}</title> : null}
                <path
                    fill="#000"
                    d="M4.416 7.378v1.244L5.346 8l-.93-.622zM7.627 6.473V4.738L4.712 6.683l1.302.87 1.613-1.08zM11.285 6.683L8.37 4.738v1.735l1.613 1.08 1.302-.87zM4.712 9.32l2.915 1.942V9.527l-1.613-1.08-1.302.873zM8.37 9.527v1.735l2.915-1.942-1.302-.873-1.613 1.08zM8 7.12L6.683 8 8 8.879 9.314 8 8 7.12z"
                />
                <path
                    fill="#000"
                    d="M8 1a7 7 0 10.001 14.001A7 7 0 008 1zm4.327 8.32c0 .018 0 .033-.003.047 0 .006-.003.012-.003.015l-.006.033c-.002.006-.002.012-.005.018l-.01.026-.008.018c-.003.009-.01.018-.012.024a.06.06 0 01-.012.017l-.015.024a.065.065 0 01-.012.015c-.005.006-.011.015-.017.02l-.015.015c-.006.006-.015.012-.02.018-.007.003-.013.009-.019.012-.003 0-.003.003-.005.006l-3.96 2.64a.377.377 0 01-.414 0L3.832 9.631c-.003 0-.003-.003-.006-.006l-.018-.012c-.006-.006-.015-.012-.02-.018l-.016-.014a.129.129 0 01-.017-.021c-.003-.006-.01-.012-.012-.015a.064.064 0 01-.015-.024.062.062 0 00-.012-.017l-.012-.024-.009-.018-.008-.026-.006-.018a.106.106 0 01-.006-.033c0-.006-.003-.012-.003-.015-.003-.014-.003-.032-.003-.047V6.686c0-.018 0-.033.003-.048 0-.005.003-.011.003-.014l.006-.033.006-.018.008-.026.01-.018c.002-.009.008-.018.011-.024a.062.062 0 01.012-.017l.015-.024a.065.065 0 01.012-.015c.006-.006.011-.015.017-.02l.015-.015c.006-.006.015-.012.02-.018.007-.003.013-.01.019-.012.003 0 .003-.003.006-.006L7.79 3.741a.372.372 0 01.411 0l3.958 2.637c.002 0 .002.003.005.006l.018.012.021.018.015.014c.006.006.012.012.018.021l.011.015a.065.065 0 01.015.024.06.06 0 00.012.017.087.087 0 01.012.024l.009.018.009.026c.003.006.003.012.005.018.004.009.006.02.006.033 0 .006.003.012.003.014a.251.251 0 01.003.048V9.32h.006z"
                />
                <path fill="#000" d="M11.584 8.622V7.378L10.652 8l.932.622z" />
                <path
                    fill="#fff"
                    fillRule="evenodd"
                    d="M12.327 9.32c0 .018 0 .033-.003.047 0 .004 0 .007-.002.01v.005a.141.141 0 00-.004.017c0 .003 0 .007-.002.011v.005a.044.044 0 00-.004.009c0 .002 0 .004-.002.006v.003l-.01.026-.008.018-.009.018-.003.006a.06.06 0 01-.012.017l-.003.005-.004.007-.008.012a.065.065 0 01-.012.015.129.129 0 00-.008.01c-.004.004-.006.008-.01.01l-.014.015-.01.01a.116.116 0 00-.01.008.063.063 0 00-.01.006l-.009.006-.003.003-.002.003-3.96 2.64a.377.377 0 01-.414 0L3.832 9.631l-.004-.003-.002-.003a.062.062 0 01-.01-.006l-.008-.006-.01-.009a.127.127 0 01-.01-.009l-.016-.014a.129.129 0 01-.017-.021c-.003-.006-.01-.012-.012-.015a.064.064 0 01-.015-.024.062.062 0 00-.012-.017.11.11 0 01-.009-.018l-.003-.006-.009-.018-.008-.026a.042.042 0 01-.004-.01c0-.002 0-.005-.002-.008a.106.106 0 01-.006-.033l-.002-.01-.001-.005c-.003-.014-.003-.032-.003-.047V6.686a.24.24 0 01.006-.062l.003-.017c0-.003 0-.007.002-.012v-.004l.003-.009.004-.009.008-.026.01-.018a.103.103 0 01.008-.018l.003-.006a.062.062 0 01.012-.017l.007-.012a.284.284 0 01.02-.027l.008-.01a.13.13 0 01.01-.01l.014-.015a.129.129 0 01.01-.01c.004-.002.008-.005.01-.008l.004-.002.006-.004a.062.062 0 01.009-.006l.003-.003.003-.003L7.79 3.741a.372.372 0 01.411 0l3.958 2.637.003.003.002.003.01.006.005.004.003.002a.087.087 0 00.006.005l.005.004.01.009.015.014c.006.006.012.012.018.021l.007.01.004.005a.065.065 0 01.015.024.06.06 0 00.012.017.087.087 0 01.012.024l.009.018.009.026.002.01.004.008c.002.009.005.02.005.033l.002.01.001.004a.251.251 0 01.003.048V9.32h.006zm-7.911-.698V7.378l.93.622-.93.622zm3.211-3.884v1.735l-1.613 1.08-1.302-.87 2.915-1.945zm.743 0l2.915 1.945-1.302.87-1.613-1.08V4.738zm-.743 6.524L4.712 9.32l1.302-.873 1.613 1.08v1.735zm.743 0V9.527l1.613-1.08 1.302.873-2.915 1.942zM8 8.879L6.683 8 8 7.12 9.314 8 8 8.879zm3.584-1.5v1.243L10.652 8l.932-.622z"
                    clipRule="evenodd"
                />
            </svg>
        );
    }
);
