@mantine/core/esm/components/ModalBase/ModalBaseContent.mjs

React components library focused on usability, accessibility and developer experience

"use client";
import { Paper } from "../Paper/Paper.mjs";
import { Transition } from "../Transition/Transition.mjs";
import { FocusTrap } from "../FocusTrap/FocusTrap.mjs";
import { useModalBaseContext } from "./ModalBase.context.mjs";
import ModalBase_module_default from "./ModalBase.module.mjs";
import cx from "clsx";
import { jsx } from "react/jsx-runtime";
//#region packages/@mantine/core/src/components/ModalBase/ModalBaseContent.tsx
function ModalBaseContent({ transitionProps, className, innerProps, onKeyDown, style, ref, ...others }) {
	const ctx = useModalBaseContext();
	return /* @__PURE__ */ jsx(Transition, {
		mounted: ctx.opened,
		transition: "pop",
		...ctx.transitionProps,
		onExited: () => {
			ctx.onExitTransitionEnd?.();
			ctx.transitionProps?.onExited?.();
		},
		onEntered: () => {
			ctx.onEnterTransitionEnd?.();
			ctx.transitionProps?.onEntered?.();
		},
		...transitionProps,
		children: (transitionStyles) => /* @__PURE__ */ jsx("div", {
			...innerProps,
			className: cx({ [ModalBase_module_default.inner]: !ctx.unstyled }, innerProps.className),
			children: /* @__PURE__ */ jsx(FocusTrap, {
				active: ctx.opened && ctx.trapFocus,
				innerRef: ref,
				children: /* @__PURE__ */ jsx(Paper, {
					...others,
					component: "section",
					role: "dialog",
					tabIndex: -1,
					"aria-modal": true,
					"aria-describedby": ctx.bodyMounted ? ctx.getBodyId() : void 0,
					"aria-labelledby": ctx.titleMounted ? ctx.getTitleId() : void 0,
					style: [style, transitionStyles],
					className: cx({ [ModalBase_module_default.content]: !ctx.unstyled }, className),
					unstyled: ctx.unstyled,
					children: others.children
				})
			})
		})
	});
}
ModalBaseContent.displayName = "@mantine/core/ModalBaseContent";
//#endregion
export { ModalBaseContent };

//# sourceMappingURL=ModalBaseContent.mjs.map