"use client";
import { cn } from "./index3.js";
import { DrawerDirectionContext, useDrawerDirection } from "./index464.js";
import * as React from "react";
import { jsx, jsxs } from "react/jsx-runtime";
import { Dialog } from "@base-ui/react/dialog";
//#region src/components/organisms/overlays/Drawer/Drawer.tsx
var Root = React.forwardRef(function Root({ direction = "bottom", defaultOpen = false, onOpenChange, children, ...props }, _ref) {
	const [open, setOpen] = React.useState(defaultOpen);
	const handleOpenChange = React.useCallback((newOpen) => {
		setOpen(newOpen);
		onOpenChange?.(newOpen);
	}, [onOpenChange]);
	return /* @__PURE__ */ jsx(DrawerDirectionContext.Provider, {
		value: direction,
		children: /* @__PURE__ */ jsx(Dialog.Root, {
			"data-slot": "drawer",
			open,
			onOpenChange: handleOpenChange,
			...props,
			children
		})
	});
});
Root.displayName = "Drawer.Root";
var Trigger = React.forwardRef(function Trigger({ ...props }, ref) {
	return /* @__PURE__ */ jsx(Dialog.Trigger, {
		ref,
		"data-slot": "drawer-trigger",
		...props
	});
});
Trigger.displayName = "Drawer.Trigger";
function Portal({ ...props }) {
	return /* @__PURE__ */ jsx(Dialog.Portal, {
		"data-slot": "drawer-portal",
		...props
	});
}
Portal.displayName = "Drawer.Portal";
var Close = React.forwardRef(function Close({ ...props }, ref) {
	return /* @__PURE__ */ jsx(Dialog.Close, {
		ref,
		"data-slot": "drawer-close",
		...props
	});
});
Close.displayName = "Drawer.Close";
var Backdrop = React.forwardRef(function Backdrop({ className, disableAnimation, disableBackdropBlur, ...props }, ref) {
	return /* @__PURE__ */ jsx(Dialog.Backdrop, {
		ref,
		"data-slot": "drawer-backdrop",
		className: cn("bg-background/80/10 fixed inset-0 z-50", !disableAnimation && "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 motion-reduce:animate-none", !disableBackdropBlur && "supports-backdrop-filter:backdrop-blur-xs", className),
		...props
	});
});
Backdrop.displayName = "Drawer.Backdrop";
var Viewport = React.forwardRef(function Viewport({ className, children, ...props }, ref) {
	return /* @__PURE__ */ jsx(Dialog.Viewport, {
		ref,
		"data-slot": "drawer-viewport",
		className: cn("fixed inset-0 z-50", className),
		...props,
		children
	});
});
Viewport.displayName = "Drawer.Viewport";
var Popup = React.forwardRef(function Popup({ className, children, disableAnimation, disableBackdropBlur, ...props }, ref) {
	const direction = useDrawerDirection();
	return /* @__PURE__ */ jsxs(Portal, {
		"data-slot": "drawer-portal",
		children: [/* @__PURE__ */ jsx(Backdrop, {
			disableAnimation,
			disableBackdropBlur
		}), /* @__PURE__ */ jsxs(Dialog.Popup, {
			ref,
			"data-slot": "drawer-popup",
			"data-vaul-drawer-direction": direction,
			className: cn("bg-background flex h-auto flex-col text-sm data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm group/drawer-content fixed z-50", !disableAnimation && "data-open:animate-in data-closed:animate-out data-open:duration-300 data-closed:duration-200 data-open:ease-(--ease-decelerate) data-closed:ease-in data-[vaul-drawer-direction=bottom]:data-open:slide-in-from-bottom-full data-[vaul-drawer-direction=bottom]:data-closed:slide-out-to-bottom-full data-[vaul-drawer-direction=top]:data-open:slide-in-from-top-full data-[vaul-drawer-direction=top]:data-closed:slide-out-to-top-full data-[vaul-drawer-direction=left]:data-open:slide-in-from-left-full data-[vaul-drawer-direction=left]:data-closed:slide-out-to-left-full data-[vaul-drawer-direction=right]:data-open:slide-in-from-right-full data-[vaul-drawer-direction=right]:data-closed:slide-out-to-right-full motion-reduce:animate-none", className),
			...props,
			children: [/* @__PURE__ */ jsx("div", {
				"aria-hidden": "true",
				className: "bg-muted mx-auto mt-4 hidden h-1.5 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block delight-fade-in motion-reduce:!animate-none"
			}), children]
		})]
	});
});
Popup.displayName = "Drawer.Popup";
var Header = React.forwardRef(function Header({ className, ...props }, ref) {
	return /* @__PURE__ */ jsx("div", {
		ref,
		"data-slot": "drawer-header",
		className: cn("gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left flex flex-col", className),
		...props
	});
});
Header.displayName = "Drawer.Header";
var Footer = React.forwardRef(function Footer({ className, ...props }, ref) {
	return /* @__PURE__ */ jsx("div", {
		ref,
		"data-slot": "drawer-footer",
		className: cn("gap-2 p-4 mt-auto flex flex-col", className),
		...props
	});
});
Footer.displayName = "Drawer.Footer";
var Title = React.forwardRef(function Title({ className, ...props }, ref) {
	return /* @__PURE__ */ jsx(Dialog.Title, {
		ref,
		"data-slot": "drawer-title",
		className: cn("text-foreground font-medium delight-stagger motion-reduce:!animate-none", className),
		...props,
		style: { "--delight-delay": "50ms" }
	});
});
Title.displayName = "Drawer.Title";
var Description = React.forwardRef(function Description({ className, ...props }, ref) {
	return /* @__PURE__ */ jsx(Dialog.Description, {
		ref,
		"data-slot": "drawer-description",
		className: cn("text-muted-foreground text-sm delight-stagger motion-reduce:!animate-none", className),
		...props,
		style: { "--delight-delay": "100ms" }
	});
});
Description.displayName = "Drawer.Description";
var Handle = React.forwardRef(function Handle({ className, ...props }, ref) {
	return /* @__PURE__ */ jsx("div", {
		ref,
		"data-slot": "drawer-handle",
		"aria-hidden": "true",
		className: cn("bg-muted mx-auto mt-4 h-1.5 w-[100px] shrink-0 rounded-full", className),
		...props
	});
});
Handle.displayName = "Drawer.Handle";
var Drawer = Object.assign(Root, {
	Root,
	Trigger,
	Portal,
	Backdrop,
	Viewport,
	Popup,
	Header,
	Footer,
	Title,
	Description,
	Close,
	Handle
});
//#endregion
export { Backdrop, Close, Description, Drawer, Footer, Handle, Header, Popup, Portal, Root, Title, Trigger, Viewport };

//# sourceMappingURL=index465.js.map