File size: 1,224 Bytes
4304c6d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
import type { FC, MouseEventHandler } from 'react'
import React from 'react'
import Spinner from '../spinner'

export type IButtonProps = {
  type?: string
  className?: string
  disabled?: boolean
  loading?: boolean
  tabIndex?: number
  children: React.ReactNode
  onClick?: MouseEventHandler<HTMLDivElement>
}

const Button: FC<IButtonProps> = ({

  type,

  disabled,

  children,

  className,

  onClick,

  loading = false,

  tabIndex,

}) => {
  let style = 'cursor-pointer'
  switch (type) {
    case 'primary':
      style = (disabled || loading) ? 'btn-primary-disabled' : 'btn-primary'
      break
    case 'warning':
      style = (disabled || loading) ? 'btn-warning-disabled' : 'btn-warning'
      break
    default:
      style = disabled ? 'btn-default-disabled' : 'btn-default'
      break
  }

  return (
    <div

      className={`btn ${style} ${className && className}`}

      tabIndex={tabIndex}

      onClick={disabled ? undefined : onClick}

    >

      {children}

      {/* Spinner is hidden when loading is false */}

      <Spinner loading={loading} className='!text-white !h-3 !w-3 !border-2 !ml-1' />

    </div>
  )
}

export default React.memo(Button)