/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-29d58ba | Cube Dev Team */
import { tasty } from "../../../tasty/tasty.js";
import { forwardRef } from "react";
import { jsx } from "react/jsx-runtime";

//#region src/components/overlays/Modal/Underlay.tsx
const UnderlayElement = tasty({
	qa: "Underlay",
	"data-type": "primary",
	styles: {
		position: "fixed",
		top: 0,
		right: 0,
		bottom: 0,
		left: 0,
		zIndex: 10,
		transitionDelay: "0ms",
		opacity: {
			"": 0,
			open: .9999
		},
		pointerEvents: {
			"": "none",
			open: "auto"
		},
		fill: "#black.30",
		overflow: "hidden",
		transition: "transform .25s ease-in-out, opacity .25s linear, visibility 0ms linear"
	}
});
function Underlay({ isOpen, transitionState, ...otherProps }, ref) {
	return /* @__PURE__ */ jsx(UnderlayElement, {
		ref,
		mods: { open: isOpen },
		...otherProps
	});
}
let _Underlay = forwardRef(Underlay);
_Underlay.displayName = "Underlay";

//#endregion
export { _Underlay };
//# sourceMappingURL=Underlay.js.map