79 lines
1.9 KiB
TypeScript
79 lines
1.9 KiB
TypeScript
import { ReactNode } from "react";
|
|
import Modal from "./Modal";
|
|
import SlideOverWideEmpty from "../slideOvers/SlideOverWideEmpty";
|
|
import DialogSticky from "./DialogSticky";
|
|
|
|
interface Props {
|
|
type: "modal" | "slide" | "dialog";
|
|
className?: string;
|
|
children: ReactNode;
|
|
open: boolean;
|
|
setOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
|
title?: ReactNode;
|
|
description?: string;
|
|
size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "full";
|
|
padding?: "none" | "sm";
|
|
position?: 0 | 1 | 2 | 3 | 4 | 5;
|
|
buttons?: ReactNode;
|
|
footer?: ReactNode;
|
|
overflowHidden?: boolean;
|
|
closesOnOutsideClick?: boolean;
|
|
}
|
|
export default function ModalOrSlide({
|
|
type,
|
|
className,
|
|
children,
|
|
open,
|
|
setOpen,
|
|
title,
|
|
description,
|
|
size = "3xl",
|
|
padding = "sm",
|
|
position = 5,
|
|
buttons,
|
|
footer,
|
|
overflowHidden = false,
|
|
closesOnOutsideClick = true,
|
|
}: Props) {
|
|
if (type === "modal") {
|
|
return (
|
|
<Modal title={title} className={className} open={open} setOpen={setOpen} size={size} padding={padding} position={position}>
|
|
{children}
|
|
</Modal>
|
|
);
|
|
} else if (type === "slide") {
|
|
return (
|
|
<SlideOverWideEmpty
|
|
title={title}
|
|
description={description}
|
|
className={className}
|
|
open={open}
|
|
onClose={() => setOpen(false)}
|
|
size={size}
|
|
position={position}
|
|
buttons={buttons}
|
|
>
|
|
{children}
|
|
</SlideOverWideEmpty>
|
|
);
|
|
} else if (type === "dialog") {
|
|
return (
|
|
<DialogSticky
|
|
title={title}
|
|
description={description}
|
|
open={open}
|
|
onClose={() => setOpen(false)}
|
|
footer={footer}
|
|
size={size}
|
|
buttons={buttons}
|
|
className={className}
|
|
overflowHidden={overflowHidden}
|
|
closesOnOutsideClick={closesOnOutsideClick}
|
|
>
|
|
{children}
|
|
</DialogSticky>
|
|
);
|
|
}
|
|
return null;
|
|
}
|