// components/RotateLoading/index.tsx
import React from 'react'
import { View } from '@tarojs/components'
import style from  './index.module.less'

interface RotateLoadingProps {
  color?: string
  size?: number
  strokeWidth?: number
}

const RotateLoading: React.FC<RotateLoadingProps> = ({
  color = '#317CFA',
  size = 16,
  strokeWidth = 1
}) => {
  const ringBgStyle = {
    width: `${size}px`,
    height: `${size}px`,
    borderWidth: `${strokeWidth}px`
  }
  const ringStyle = {
    width: `${size}px`,
    height: `${size}px`,
    borderColor: `${color} transparent transparent transparent`,
    borderWidth: `${strokeWidth}px`
  }

  return (
    <View className={style.container}>
      <View className={style.rotateLoading} style={ringBgStyle}></View>
      <View className={style.rotateRing} style={ringStyle}></View>
    </View>
  )
}

export default RotateLoading