1import React, { useState } from "react";
2import { Button, Modal, ModalTitle, ModalDescription, ModalContent, ModalFooter 
3} from "reactfine-ui";
4export default function App() {
5  const [isOpen, setIsOpen] = useState(false);
6  return (
7    <div className="h-screen flex items-center justify-center bg-gray-100 dark:bg-gray-900">
8      <Button onClick={() => setIsOpen(true)}>
9        Open Modal
10      </Button>
11      <Modal isOpen={isOpen} onClose={() => setIsOpen(false)}>
12        <ModalTitle>Welcome to My Modal 🎉</ModalTitle>
13        <ModalContent>
14          <ModalDescription>
15            Bu tayyor modal komponenti. Siz unga istagan content qo‘shishingiz mumkin.
16          </ModalDescription>
17        </ModalContent>
18        <ModalFooter align="right">
19          <Button onClick={() => setIsOpen(false)} variant="outline">
20            Cancel
21          </Button>
22          <Button onClick={() => alert("Tasdiqlandi!")}>
23            Confirm
24          </Button>
25        </ModalFooter>
26      </Modal>
27    </div>
28  );
29}
30