/** @license MIT | @cube-dev/ui-kit v0.147.0 | Cube Dev Team */
import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
import { usePopoverSync } from "../../utils/react/usePopoverSync.js";
import { useEvent } from "../../_internal/hooks/use-event.js";
import { useI18n } from "../../i18n/useI18n.js";
import { generateRandomId } from "../../utils/random.js";
import { _MenuTrigger } from "./Menu/MenuTrigger.js";
import { useEffect, useMemo, useRef, useState } from "react";
import { jsx, jsxs } from "react/jsx-runtime";
import { VisuallyHidden } from "react-aria";
import { Pressable } from "@react-aria/interactions";

//#region src/components/actions/use-anchored-menu.tsx
/**
* Generic hook to manage an anchored menu component.
*
* @param Component - A React component that represents the menu content (Menu or CommandMenu).
* @param defaultTriggerProps - Default props to pass to the MenuTrigger.
* @param defaultMenuProps - Default props to pass to the Menu component.
* @returns An object with `anchorRef` to position the menu, `open` function to open the menu with provided props, `close` function to close the menu, and `rendered` JSX element to include in your component tree.
*/
function useAnchoredMenu(Component, defaultTriggerProps, defaultMenuProps) {
	const { t } = useI18n();
	const [isOpen, setIsOpen] = useState(false);
	const [componentProps, setComponentProps] = useState(null);
	const [triggerProps, setTriggerProps] = useState(null);
	const anchorRef = useRef(null);
	const popoverRef = useRef(null);
	const setupRef = useRef(false);
	useEffect(() => {
		const el = anchorRef.current;
		if (el) {
			el.dataset.popoverTrigger = "";
			return () => {
				delete el.dataset.popoverTrigger;
			};
		}
	}, []);
	usePopoverSync({
		menuId: useMemo(() => generateRandomId(), []),
		isOpen,
		onClose: () => setIsOpen(false),
		triggerRef: anchorRef,
		containerRef: popoverRef
	});
	function setupCheck() {
		if (!setupRef.current) throw new Error("useAnchoredMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.");
	}
	const open = useEvent((props = {}, triggerProps) => {
		setupCheck();
		setComponentProps(defaultMenuProps ? {
			...defaultMenuProps,
			...props
		} : props);
		setTriggerProps(triggerProps ?? null);
		setIsOpen(true);
	});
	const update = useEvent((props, triggerProps) => {
		setupCheck();
		setComponentProps(defaultMenuProps ? {
			...defaultMenuProps,
			...props
		} : props);
		setTriggerProps(triggerProps ?? null);
	});
	const close = useEvent(() => {
		setIsOpen(false);
	});
	const renderedMenu = useMemo(() => {
		if (!componentProps) return null;
		return /* @__PURE__ */ jsxs(_MenuTrigger, {
			placement: "bottom start",
			...mergeProps$1(defaultTriggerProps, triggerProps || void 0),
			isDummy: true,
			isOpen,
			targetRef: anchorRef,
			popoverRef,
			onOpenChange: setIsOpen,
			children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Pressable, { children: /* @__PURE__ */ jsx("button", { "aria-label": t("contextMenu.contextMenu", "context-menu") }) }) }), /* @__PURE__ */ jsx(Component, { ...componentProps })]
		});
	}, [
		componentProps,
		triggerProps,
		isOpen,
		defaultTriggerProps,
		t
	]);
	return {
		anchorRef,
		open,
		update,
		close,
		isOpen,
		get rendered() {
			setupRef.current = true;
			return renderedMenu;
		}
	};
}

//#endregion
export { useAnchoredMenu };
//# sourceMappingURL=use-anchored-menu.js.map