import React from 'react'
import { Button, Space } from 'antd-mobile'
import styles from './DemoButton.module.less'

interface DemoButtonProps {
  text?: string
  onClick?: () => void
}

const DemoButton: React.FC<DemoButtonProps> = ({
  text = '示例按钮',
  onClick
}) => {
  return (
    <div className={styles.container}>
      <Space direction="vertical" block>
        <Button color="primary" block onClick={onClick}>
          {text} - Primary
        </Button>
        <Button color="success" block onClick={onClick}>
          {text} - Success
        </Button>
        <Button color="warning" block onClick={onClick}>
          {text} - Warning
        </Button>
        <Button color="danger" block onClick={onClick}>
          {text} - Danger
        </Button>
      </Space>
    </div>
  )
}

export default DemoButton
