mirror of
https://github.com/pheralb/svgl.git
synced 2025-12-29 08:01:36 +08:00
pheralb
23 lines
1.1 KiB
TypeScript
23 lines
1.1 KiB
TypeScript
import { tv, type VariantProps } from "tailwind-variants";
|
|
|
|
const sheetVariants = tv({
|
|
base: "bg-white dark:bg-neutral-900 border-neutral-200 dark:border-neutral-800 data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
|
|
variants: {
|
|
side: {
|
|
top: "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
|
|
bottom:
|
|
"data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
|
|
left: "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
|
|
right:
|
|
"data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
|
|
},
|
|
},
|
|
defaultVariants: {
|
|
side: "left",
|
|
},
|
|
});
|
|
|
|
type Side = VariantProps<typeof sheetVariants>["side"];
|
|
|
|
export { sheetVariants, type Side };
|