@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
77 lines (76 loc) • 3.06 kB
JavaScript
"use client";
require("../../_virtual/_rolldown/runtime.cjs");
const require_rem = require("../../core/utils/units-converters/rem.cjs");
const require_get_default_z_index = require("../../core/utils/get-default-z-index/get-default-z-index.cjs");
const require_get_size = require("../../core/utils/get-size/get-size.cjs");
const require_create_vars_resolver = require("../../core/styles-api/create-vars-resolver/create-vars-resolver.cjs");
const require_use_props = require("../../core/MantineProvider/use-props/use-props.cjs");
const require_use_styles = require("../../core/styles-api/use-styles/use-styles.cjs");
const require_factory = require("../../core/factory/factory.cjs");
const require_ScrollArea = require("../ScrollArea/ScrollArea.cjs");
const require_ModalBase = require("../ModalBase/ModalBase.cjs");
const require_Modal_context = require("./Modal.context.cjs");
const require_Modal_module = require("./Modal.module.cjs");
let react_jsx_runtime = require("react/jsx-runtime");
//#region packages/@mantine/core/src/components/Modal/ModalRoot.tsx
const defaultProps = {
__staticSelector: "Modal",
closeOnClickOutside: true,
withinPortal: true,
lockScroll: true,
trapFocus: true,
returnFocus: true,
closeOnEscape: true,
keepMounted: false,
zIndex: require_get_default_z_index.getDefaultZIndex("modal"),
transitionProps: {
duration: 200,
transition: "fade-down"
},
yOffset: "5dvh"
};
const varsResolver = require_create_vars_resolver.createVarsResolver((_, { radius, size, yOffset, xOffset }) => ({ root: {
"--modal-radius": radius === void 0 ? void 0 : require_get_size.getRadius(radius),
"--modal-size": require_get_size.getSize(size, "modal-size"),
"--modal-y-offset": require_rem.rem(yOffset),
"--modal-x-offset": require_rem.rem(xOffset)
} }));
const ModalRoot = require_factory.factory((_props) => {
const props = require_use_props.useProps("ModalRoot", defaultProps, _props);
const { classNames, className, style, styles, unstyled, vars, yOffset, scrollAreaComponent, radius, fullScreen, centered, xOffset, __staticSelector, attributes, ...others } = props;
const getStyles = require_use_styles.useStyles({
name: __staticSelector,
classes: require_Modal_module.default,
props,
className,
style,
classNames,
styles,
unstyled,
attributes,
vars,
varsResolver
});
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Modal_context.ModalProvider, {
value: {
yOffset,
scrollAreaComponent,
getStyles,
fullScreen
},
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ModalBase.ModalBase, {
...getStyles("root"),
"data-full-screen": fullScreen || void 0,
"data-centered": centered || void 0,
"data-offset-scrollbars": scrollAreaComponent === require_ScrollArea.ScrollArea.Autosize || void 0,
unstyled,
...others
})
});
});
ModalRoot.classes = require_Modal_module.default;
ModalRoot.varsResolver = varsResolver;
ModalRoot.displayName = "@mantine/core/ModalRoot";
//#endregion
exports.ModalRoot = ModalRoot;
//# sourceMappingURL=ModalRoot.cjs.map