44 lines
837 B
TypeScript
44 lines
837 B
TypeScript
import Button from "$/component/button/Button";
|
|
import type { ModalHeaderProps } from "$/types/ModalTypes";
|
|
import { DialogTitle } from "@headlessui/react";
|
|
import clsx from "clsx";
|
|
import { BsXLg } from "react-icons/bs";
|
|
|
|
|
|
export default function ModalHeader({
|
|
onClose,
|
|
className,
|
|
children,
|
|
...props
|
|
}: Readonly<ModalHeaderProps>){
|
|
return (
|
|
<div
|
|
className={clsx(
|
|
"flex flex-row items-center justify-center w-full rounded-t-lg",
|
|
className
|
|
)}
|
|
{...props}
|
|
>
|
|
<DialogTitle
|
|
as="div"
|
|
className="flex flex-row items-center justify-center mx-8 my-3"
|
|
>
|
|
{children}
|
|
</DialogTitle>
|
|
{
|
|
onClose &&
|
|
<Button
|
|
className="absolute top-1 right-1 cursor-pointer"
|
|
onClick={onClose}
|
|
size="sm"
|
|
variant="icon"
|
|
>
|
|
<BsXLg
|
|
size={20}
|
|
/>
|
|
</Button>
|
|
}
|
|
</div>
|
|
);
|
|
}
|