/** @license MIT | @cube-dev/ui-kit v0.142.7 | Cube Dev Team */
import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
import { _Overlay } from "./Overlay.js";
import { _Underlay } from "./Underlay.js";
import { OVERLAY_WRAPPER_STYLES } from "./Modal.js";
import { tasty } from "@tenphi/tasty";
import { forwardRef } from "react";
import { jsx, jsxs } from "react/jsx-runtime";
import { useModal, useOverlay, usePreventScroll } from "react-aria";
import { useObjectRef } from "@react-aria/utils";

//#region src/components/overlays/Modal/Tray.tsx
const TrayWrapperElement = tasty({
	qa: "TrayWrapper",
	styles: {
		...OVERLAY_WRAPPER_STYLES,
		placeContent: "end center",
		placeItems: "end center"
	}
});
const TrayElement = tasty({ styles: {
	display: {
		"": "none",
		"enter | entered": "initial",
		exit: "initial",
		unmounted: "none"
	},
	zIndex: 10,
	height: "max 90dvh",
	width: "$min-dialog-size 90vw",
	pointerEvents: "auto",
	transition: "transform .25s ease-in-out, opacity .25s linear, visibility 0ms linear",
	opacity: {
		"": 0,
		open: ".9999"
	}
} });
function Tray(props, ref) {
	let { qa, children, onClose, isFixedHeight, isNonModal, styles, shouldCloseOnInteractOutside, ...otherProps } = props;
	let domRef = useObjectRef(ref);
	let { overlayProps, underlayProps } = useOverlay({
		...props,
		isDismissable: true,
		shouldCloseOnInteractOutside
	}, domRef);
	return /* @__PURE__ */ jsxs(_Overlay, {
		...otherProps,
		children: [/* @__PURE__ */ jsx(_Underlay, { ...underlayProps }), /* @__PURE__ */ jsx(TrayWrapper, {
			ref: domRef,
			qa,
			overlayProps,
			isFixedHeight,
			isNonModal,
			styles,
			onClose,
			children
		})]
	});
}
let TrayWrapper = forwardRef(function TrayWrapper(props, ref) {
	let { qa, children, isOpen, styles, isFixedHeight, isNonModal, overlayProps, transitionState, ...otherProps } = props;
	usePreventScroll();
	let { modalProps } = useModal({ isDisabled: isNonModal });
	let domProps = mergeProps$1(otherProps, overlayProps);
	return /* @__PURE__ */ jsx(TrayWrapperElement, {
		mods: { open: isOpen },
		children: /* @__PURE__ */ jsx(TrayElement, {
			qa: qa || "Tray",
			styles,
			mods: {
				open: isOpen,
				enter: transitionState === "enter",
				exit: transitionState === "exit",
				unmounted: transitionState === "unmounted",
				entered: transitionState === "entered",
				"fixed-height": isFixedHeight
			},
			...domProps,
			...modalProps,
			ref,
			children
		})
	});
});
let _Tray = forwardRef(Tray);
_Tray.displayName = "Tray";

//#endregion
export { _Tray };
//# sourceMappingURL=Tray.js.map