40 lines
946 B
TypeScript
40 lines
946 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="w-full z-50 fixed bottom-0"
|
|
static
|
|
open={false}
|
|
as="div"
|
|
onClose={() => {}}
|
|
>
|
|
{children}
|
|
</Dialog>
|
|
</Transition>
|
|
);
|
|
}
|