34 lines
874 B
TypeScript
34 lines
874 B
TypeScript
import React, { Fragment, useState } from "react";
|
|
import { Dialog, Transition } from "@headlessui/react";
|
|
import { AcceptCookies } from "components/AcceptCookies";
|
|
|
|
type ButtonSheetBarProps = {
|
|
isShowing: boolean;
|
|
onClose: () => void;
|
|
children?: React.ReactNode;
|
|
} & Omit<React.ComponentPropsWithoutRef<"div">, "">;
|
|
|
|
export function BottomSheetModal({
|
|
isShowing,
|
|
onClose,
|
|
children,
|
|
}: ButtonSheetBarProps) {
|
|
return (
|
|
<Transition
|
|
appear
|
|
show={isShowing}
|
|
as={Fragment}
|
|
enter="ease-in-out duration-200"
|
|
enterFrom="translate-y-full"
|
|
enterTo="translate-y-0"
|
|
leave="ease-out duration-300"
|
|
leaveFrom="translate-y-0 opacity-100"
|
|
leaveTo="translate-y-full opacity-0"
|
|
>
|
|
<Dialog className="fixed bottom-0 w-full" as="div" onClose={() => {}}>
|
|
{children}
|
|
</Dialog>
|
|
</Transition>
|
|
);
|
|
}
|