import React, { useState } from 'react'

import { Button, Drawer, DrawerFooter } from 'react-icecream'

export default function Demo() {
  const [visible, setVisible] = useState(false)
  const [showFooter, setShowFooter] = useState(true)
  return (
    <>
      <Button onClick={() => setVisible(true)}>打开</Button>
      <Drawer
        title="抽屉标题"
        visible={visible}
        onOk={() => setVisible(false)}
        onCancel={() => setVisible(false)}
        footer={showFooter && <DrawerFooter okText="我发现了" cancelText="哦" />}
      >
        这是个对 <code>footer</code> 进行配置的抽屉
        <Button onClick={() => setShowFooter(v => !v)}>显示/隐藏 footer</Button>
      </Drawer>
    </>
  )
}