import * as React from 'react';
import { expandObj } from 'src/types';

import './index.scss';

export function SuccessIcon(props: expandObj) {
  const { color = '#fff', size = 32 } = props;
  return (
    <svg
      viewBox='0 0 1024 1024'
      version='1.1'
      xmlns='http://www.w3.org/2000/svg'
      p-id='2160'
      width={size as string}
      height={size as string}
    >
      <path
        fill={color as string}
        d='M512 1024C229.248 1024 0 794.752 0 512S229.248 0 512 0s512 229.248 512 512-229.248 512-512 512z m-114.176-310.954667a53.333333 53.333333 0 0 0 75.434667 0l323.328-323.328a53.333333 53.333333 0 1 0-75.434667-75.434666l-287.914667 283.306666-128.853333-128.853333a53.333333 53.333333 0 1 0-75.434667 75.434667l168.874667 168.874666z'
        p-id='2161'
      ></path>
    </svg>
  );
}

export function WarnIcon(props: expandObj) {
  const { color = '#fff', size = 32 } = props;
  return (
    <svg
      viewBox='0 0 1024 1024'
      version='1.1'
      xmlns='http://www.w3.org/2000/svg'
      p-id='2160'
      width={size as string}
      height={size as string}
    >
      <path
        fill={color as string}
        d='M1014.9 864.7L791.1 477.1 567.3 89.5c-12.3-21.3-33.9-32-55.4-32-21.6 0-43.1 10.7-55.4 32L232.7 477.1 8.9 864.7c-24.6 42.7 6.2 96 55.4 96h895.2c49.3 0 80-53.3 55.4-96z m-558.4-77.4v-55.5c0-15.3 12.4-27.7 27.7-27.7h55.5c15.3 0 27.7 12.4 27.7 27.7v55.5c0 15.3-12.4 27.7-27.7 27.7h-55.5c-15.2 0-27.7-12.4-27.7-27.7z m110.3-388.8l-12.9 270.1c-0.2 3.7-3.2 6.6-6.9 6.6h-70c-3.7 0-6.8-2.9-6.9-6.6l-12.9-270.1c-0.4-7.9 5.9-14.5 13.9-14.5h81.8c7.9 0 14.3 6.6 13.9 14.5z'
        p-id='3495'
      ></path>
    </svg>
  );
}

export function ErrorIcon(props: expandObj) {
  const { color = '#fff', size = 32 } = props;
  return (
    <svg
      viewBox='0 0 1024 1024'
      version='1.1'
      xmlns='http://www.w3.org/2000/svg'
      p-id='2160'
      width={size as string}
      height={size as string}
    >
      <path
        fill={color as string}
        d='M507.713 16.261c-271.456 0-491.52 220.064-491.52 491.52s220.064 491.52 491.52 491.52 491.52-220.064 491.52-491.52-220.051-491.52-491.52-491.52zM783.251 528.261h-551.049v-54.613h551.049v54.613z'
        p-id='4321'
      ></path>
    </svg>
  );
}

export function LoadingIcon(props: expandObj) {
  const { color, size = 32 } = props;
  return (
    <svg
      viewBox='0 0 1024 1024'
      version='1.1'
      xmlns='http://www.w3.org/2000/svg'
      p-id='15035'
      width={size as string}
      height={size as string}
    >
      <path
        style={{ fill: color as string }}
        d='M512 64c247.2 0 448 200.8 448 448h-64c0-212-172-384-384-384V64z m0 832c-212 0-384-172-384-384H64c0 247.2 200.8 448 448 448v-64z'
        p-id='15036'
      ></path>
    </svg>
  );
}

export function ArrowIcon(props: expandObj) {
  const { color, size = 32 } = props;
  return (
    <svg
      viewBox='0 0 1024 1024'
      version='1.1'
      xmlns='http://www.w3.org/2000/svg'
      p-id='15035'
      width={size as string}
      height={size as string}
    >
      <path
        style={{ fill: color as string }}
        d='M312.888889 995.555556c-17.066667 0-28.444444-5.688889-39.822222-17.066667-22.755556-22.755556-17.066667-56.888889 5.688889-79.644445l364.088888-329.955555c11.377778-11.377778 17.066667-22.755556 17.066667-34.133333 0-11.377778-5.688889-22.755556-17.066667-34.133334L273.066667 187.733333c-22.755556-22.755556-28.444444-56.888889-5.688889-79.644444 22.755556-22.755556 56.888889-28.444444 79.644444-5.688889l364.088889 312.888889c34.133333 28.444444 56.888889 73.955556 56.888889 119.466667s-17.066667 85.333333-51.2 119.466666l-364.088889 329.955556c-11.377778 5.688889-28.444444 11.377778-39.822222 11.377778z'
        p-id='2164'
      ></path>
    </svg>
  );
}