"use client";
import { rem } from "../../../core/utils/units-converters/rem.mjs";
import { closeOnEscape } from "../../../core/utils/close-on-escape/close-on-escape.mjs";
import { useProps } from "../../../core/MantineProvider/use-props/use-props.mjs";
import { factory } from "../../../core/factory/factory.mjs";
import { Box } from "../../../core/Box/Box.mjs";
import { useDirection } from "../../../core/DirectionProvider/DirectionProvider.mjs";
import { getArrowMergeDropdownStyles } from "../../../utils/Floating/FloatingArrow/get-arrow-position-styles.mjs";
import { FloatingArrow } from "../../../utils/Floating/FloatingArrow/FloatingArrow.mjs";
import { OptionalPortal } from "../../Portal/OptionalPortal.mjs";
import { Transition } from "../../Transition/Transition.mjs";
import { usePopoverContext } from "../Popover.context.mjs";
import { FocusTrap } from "../../FocusTrap/FocusTrap.mjs";
import Popover_module_default from "../Popover.module.mjs";
import { useFocusReturn, useMergedRef } from "@mantine/hooks";
import { jsx, jsxs } from "react/jsx-runtime";
//#region packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.tsx
const PopoverDropdown = factory((_props) => {
	const props = useProps("PopoverDropdown", null, _props);
	const { className, style, vars, children, onKeyDownCapture, variant, classNames, styles, ref, ...others } = props;
	const ctx = usePopoverContext();
	const { dir } = useDirection();
	const mergeStyles = ctx.arrowPosition === "merge" && ctx.withArrow ? getArrowMergeDropdownStyles({
		position: ctx.placement,
		dir
	}) : void 0;
	const returnFocus = useFocusReturn({
		opened: ctx.opened,
		shouldReturnFocus: ctx.returnFocus
	});
	const accessibleProps = ctx.withRoles ? {
		"aria-labelledby": ctx.getTargetId(),
		id: ctx.getDropdownId(),
		role: "dialog",
		tabIndex: -1
	} : {};
	const mergedRef = useMergedRef(ref, ctx.floating);
	if (ctx.disabled) return null;
	return /* @__PURE__ */ jsx(OptionalPortal, {
		...ctx.portalProps,
		withinPortal: ctx.withinPortal,
		children: /* @__PURE__ */ jsx(Transition, {
			mounted: ctx.opened,
			...ctx.transitionProps,
			transition: ctx.transitionProps?.transition || "fade",
			duration: ctx.transitionProps?.duration ?? 150,
			keepMounted: ctx.keepMounted,
			exitDuration: typeof ctx.transitionProps?.exitDuration === "number" ? ctx.transitionProps.exitDuration : ctx.transitionProps?.duration,
			children: (transitionStyles) => /* @__PURE__ */ jsx(FocusTrap, {
				active: ctx.trapFocus && ctx.opened,
				innerRef: mergedRef,
				children: /* @__PURE__ */ jsxs(Box, {
					...accessibleProps,
					...others,
					variant,
					onKeyDownCapture: closeOnEscape(() => {
						ctx.onClose?.();
						ctx.onDismiss?.();
					}, {
						active: ctx.closeOnEscape,
						onTrigger: returnFocus,
						onKeyDown: onKeyDownCapture
					}),
					"data-position": ctx.placement,
					"data-fixed": ctx.floatingStrategy === "fixed" || void 0,
					...ctx.getStyles("dropdown", {
						className,
						props,
						classNames,
						styles,
						style: [
							{
								...transitionStyles,
								...mergeStyles,
								zIndex: ctx.zIndex,
								top: ctx.y ?? 0,
								left: ctx.x ?? 0,
								width: ctx.width === "target" ? void 0 : rem(ctx.width),
								...ctx.referenceHidden ? { display: "none" } : null
							},
							ctx.resolvedStyles?.dropdown,
							styles?.dropdown,
							style
						]
					}),
					children: [children, /* @__PURE__ */ jsx(FloatingArrow, {
						ref: ctx.arrowRef,
						arrowX: ctx.arrowX,
						arrowY: ctx.arrowY,
						visible: ctx.withArrow,
						position: ctx.placement,
						arrowSize: ctx.arrowSize,
						arrowRadius: ctx.arrowRadius,
						arrowOffset: ctx.arrowOffset,
						arrowPosition: ctx.arrowPosition,
						...ctx.getStyles("arrow", {
							props,
							classNames,
							styles
						})
					})]
				})
			})
		})
	});
});
PopoverDropdown.classes = Popover_module_default;
PopoverDropdown.displayName = "@mantine/core/PopoverDropdown";
//#endregion
export { PopoverDropdown };

//# sourceMappingURL=PopoverDropdown.mjs.map