import React, { useId } from 'react';
import PropTypes from 'prop-types';
import defaultPropValues from '../_defaultIconPropValues.ts';

const Sprachen = (props) => {
    const {
        width = defaultPropValues.width,
        height = defaultPropValues.height,
        stroke = defaultPropValues.stroke,
        fill = defaultPropValues.fill,

        ...restProps
    } = props;

    const id = useId();

    return (
        <svg
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 24 24"
            width={width}
            height={height}
            {...restProps}
            fill="none"
        >
            <g clipPath={`url(#${id})`}>
                <path
                    d="M12 1C5.935 1 1 5.935 1 12C1 18.065 5.935 23 12 23C18.065 23 23 18.065 23 12C23 5.935 18.065 1 12 1ZM12 22C10.94 22 9.785 19.605 9.275 16H14.73C14.215 19.605 13.065 22 12.005 22H12ZM9.15
                    15C9.055 14.06 9 13.055 9 12C9 10.945 9.055 9.94 9.15 9H14.845C14.94 9.94 14.995 10.945 14.995 12C14.995 13.055 14.94 14.06 14.845 15H9.15ZM2 12C2 10.955 2.165 9.95 2.46 9H8.145C8.045 9.985 8
                    11 8 12C8 13 8.05 14.015 8.145 15H2.46C2.16 14.05 2 13.045 2 12ZM12 2C13.06 2 14.215 4.395 14.725 8H9.27C9.785 4.395 10.935 2 11.995 2H12ZM15.855 9H21.54C21.84 9.95 22 10.955 22 12C22 13.045
                    21.84 14.05 21.54 15H15.855C15.955 14.015 16 13 16 12C16 11 15.95 9.985 15.855 9ZM21.16 8H15.735C15.41 5.59 14.785 3.445 13.88 2.185C17.15 2.81 19.855 5.03 21.155 8H21.16ZM10.115 2.185C9.215
                    3.445 8.59 5.595 8.26 8H2.84C4.145 5.03 6.85 2.81 10.115 2.185ZM2.84 16H8.265C8.59 18.41 9.215 20.555 10.12 21.815C6.85 21.19 4.145 18.97 2.845 16H2.84ZM13.885 21.815C14.785 20.555 15.41 18.405
                    15.74 16H21.165C19.86 18.97 17.155 21.19 13.89 21.815H13.885Z"
                    fill={fill}
                    stroke={stroke}
                    strokeWidth="0.8"
                />
            </g>
            <defs>
                <clipPath id={id}>
                    <rect width="24" height="24" fill="white" />
                </clipPath>
            </defs>
        </svg>
    );
};

Sprachen.propTypes = {
    width: PropTypes.string,
    height: PropTypes.string,
    fill: PropTypes.string,
    stroke: PropTypes.string,
};
export default Sprachen;