import Svg, { Mask, Path, G } from "react-native-svg";
import type { SvgProps } from "react-native-svg";
const SvgComponent = ({ height, width, color }: SvgProps) => (
  <Svg width={width} height={height} fill='none' viewBox='0 0 24 24'>
    <Mask
      id='prefix__a'
      width={24}
      height={24}
      x={0}
      y={0}
      maskUnits='userSpaceOnUse'
      style={{
        maskType: "alpha",
      }}
    >
      <Path fill='#D9D9D9' d='M0 0h24v24H0z' />
    </Mask>
    <G mask='url(#prefix__a)'>
      <Path
        fill={color}
        d='M12 21.5a9.2 9.2 0 0 1-3.687-.749 9.6 9.6 0 0 1-3.025-2.04 9.6 9.6 0 0 1-2.039-3.023A9.2 9.2 0 0 1 2.5 12q0-1.97.749-3.695a9.7 9.7 0 0 1 2.04-3.016 9.6 9.6 0 0 1 3.024-2.04A9.2 9.2 0 0 1 12 2.5q1.97 0 3.695.749 1.725.75 3.017 2.04 1.29 1.29 2.039 3.016T21.5 12q0 1.954-.749 3.688a9.6 9.6 0 0 1-2.04 3.024 9.7 9.7 0 0 1-3.016 2.039q-1.725.75-3.695.749m0-1.521q.765-1.016 1.289-2.048.522-1.033.851-2.258H9.86q.348 1.263.861 2.296.514 1.034 1.279 2.01m-1.937-.275a11 11 0 0 1-1.032-1.876 12.3 12.3 0 0 1-.712-2.155H4.927a7.8 7.8 0 0 0 2.125 2.618 7.14 7.14 0 0 0 3.012 1.413m3.874 0a7.14 7.14 0 0 0 3.011-1.413 7.8 7.8 0 0 0 2.125-2.618h-3.392a16 16 0 0 1-.76 2.164q-.457 1.051-.984 1.867m-9.639-5.531h3.717A12.5 12.5 0 0 1 7.836 12q0-.545.043-1.08t.136-1.093H4.298q-.144.51-.221 1.06a8 8 0 0 0 0 2.226q.077.55.221 1.06m5.217 0h4.97A12.7 12.7 0 0 0 14.664 12q0-.564-.043-1.09-.043-.525-.136-1.083h-4.97A12.6 12.6 0 0 0 9.336 12q0 .564.043 1.09.043.525.136 1.083m6.47 0h3.717q.144-.51.221-1.06a8 8 0 0 0 0-2.226 8 8 0 0 0-.221-1.06h-3.718a12.5 12.5 0 0 1 .18 2.173q0 .545-.043 1.08t-.136 1.093m-.304-5.846h3.392a7.8 7.8 0 0 0-2.11-2.617 7.4 7.4 0 0 0-3.027-1.423q.576.872 1.024 1.91.448 1.035.72 2.13m-5.821 0h4.28a13 13 0 0 0-.876-2.31A11.7 11.7 0 0 0 12 4.02q-.736.938-1.264 1.995a13 13 0 0 0-.876 2.311m-4.933 0h3.392q.274-1.095.721-2.13.449-1.037 1.024-1.91-1.728.382-3.031 1.428a7.9 7.9 0 0 0-2.106 2.612'
      />
    </G>
  </Svg>
);
export default SvgComponent;