## Usage

Modals can be used for displaying forms, images, videos, or any other type of content that requires user interaction. As like every component, you can use Modal by importing the Modal component into your React application.

```jsx
import Modal from "./modal";

<Modal
  visible={true}
  onOk={() => console.log('OK clicked')}
  onCancel={() => console.log('Cancel clicked')}
  destroyOnClose={true}
  width="40%"
>
  <p>Modal content goes here</p>
</Modal>;
```

```sh
import React from "react";
import { Modal as AntdModal } from "antd";

export default function Modal({
  children,
  onOk = () => {},
  onCancel = () => {},
  destroyOnClose = false,
  width = "50%",
}) {
  const [visible, setVisible] = useState(false);

  const showModal = () => {
    setVisible(true);
  };

  const handleOk = () => {
    setVisible(false);
    onOk();
  };

  const handleCancel = () => {
    setVisible(false);
    onCancel();
  };

  return (
    <>
      <Button onClick={showModal}>Open Modal</Button>
      <AntdModal
        visible={visible}
        onOk={handleOk}
        onCancel={handleCancel}
        destroyOnClose={destroyOnClose}
        width={width}
      >
        {children}
      </AntdModal>
    </>
  );
}

```