import { useIcon } from 'hooks/icon';
import React, { useMemo } from 'react';
import Svg, { Circle } from 'react-native-svg';
import { IconProps } from './types';

export const Ellipse: React.FC<IconProps> = ({ colorVariant = 'secondary', ...props }) => {
  const { getIconColor } = useIcon();
  const color = useMemo(() => getIconColor(colorVariant), [getIconColor, colorVariant]);

  return (
    <Svg width="9" height="9" viewBox="0 0 9 9" fill="none" {...props}>
      <Circle cx="4.53809" cy="4.01562" r="3" fill={color} />
    </Svg>
  );
};
