import React, { useState, useCallback } from 'react'
import { Modal, Input, Icon } from 'antd'

// 模拟浏览器 prompt
export default props => {
  const [value, setValue] = useState()
  const handleValue = useCallback(
    e => setValue(e.target.value),
    [],
  )

  const handleOk = () => {
    if (props.onOk) {
      return props.onOk(value)
    }
  }

  const handleCancel = () => {
    if (props.onCancel) {
      return props.onCancel()
    }
  }

  return (
    <Modal
      {...props}
      destroyOnClose
      closable={false}
      maskClosable={false}
      onOk={handleOk}
      onCancel={handleCancel}
    >
      <Input value={value} onChange={handleValue} placeholder={props.placeholder} />
    </Modal>
  )
}
