"use client";
const require_create_event_handler = require("../../../core/utils/create-event-handler/create-event-handler.cjs");
const require_use_props = require("../../../core/MantineProvider/use-props/use-props.cjs");
const require_factory = require("../../../core/factory/factory.cjs");
const require_Input = require("../../Input/Input.cjs");
const require_Menu_context = require("../Menu.context.cjs");
const require_Menu_module = require("../Menu.module.cjs");
let react = require("react");
let _mantine_hooks = require("@mantine/hooks");
let react_jsx_runtime = require("react/jsx-runtime");
//#region packages/@mantine/core/src/components/Menu/MenuSearch/MenuSearch.tsx
const ITEM_SELECTOR = "[data-menu-item]:not([data-disabled])";
const ACTIVE_SELECTOR = "[data-menu-active]";
function getDropdown(node) {
	return node?.closest("[data-menu-dropdown]");
}
function getItems(dropdown) {
	if (!dropdown) return [];
	return Array.from(dropdown.querySelectorAll(ITEM_SELECTOR)).filter((item) => item.closest("[data-menu-dropdown]") === dropdown);
}
function clearActive(dropdown) {
	if (!dropdown) return;
	dropdown.querySelectorAll(ACTIVE_SELECTOR).forEach((node) => {
		if (node.closest("[data-menu-dropdown]") === dropdown) node.removeAttribute("data-menu-active");
	});
}
function setActive(item, dropdown) {
	clearActive(dropdown);
	if (item) {
		item.setAttribute("data-menu-active", "true");
		item.scrollIntoView({ block: "nearest" });
	}
}
function getActiveIndex(items) {
	return items.findIndex((item) => item.hasAttribute("data-menu-active"));
}
const defaultProps = { clearSearchOnClose: true };
const MenuSearch = require_factory.factory((props) => {
	const { classNames, styles, onKeyDown, onChange, size, clearSearchOnClose, ref, ...others } = require_use_props.useProps("MenuSearch", defaultProps, props);
	const ctx = require_Menu_context.useMenuContext();
	const inputRef = (0, react.useRef)(null);
	const mergedRef = (0, _mantine_hooks.useMergedRef)(ref, inputRef);
	const onChangeRef = (0, react.useRef)(onChange);
	onChangeRef.current = onChange;
	(0, react.useEffect)(() => {
		return ctx.registerSearch();
	}, [ctx.registerSearch]);
	(0, react.useEffect)(() => {
		if (clearSearchOnClose) ctx.searchExitClearRef.current = () => {
			onChangeRef.current?.({ currentTarget: { value: "" } });
		};
		else ctx.searchExitClearRef.current = null;
	}, [clearSearchOnClose, ctx.searchExitClearRef]);
	(0, react.useEffect)(() => {
		if (!ctx.opened) clearActive(getDropdown(inputRef.current));
	}, [ctx.opened]);
	const handleChange = require_create_event_handler.createEventHandler(onChange, (event) => {
		clearActive(getDropdown(event.currentTarget));
	});
	const handleKeyDown = require_create_event_handler.createEventHandler(onKeyDown, (event) => {
		if (event.defaultPrevented) return;
		const dropdown = getDropdown(event.currentTarget);
		const items = getItems(dropdown);
		if (event.key === "ArrowDown") {
			event.preventDefault();
			if (items.length === 0) return;
			const current = getActiveIndex(items);
			setActive(items[current >= items.length - 1 ? ctx.loop ? 0 : current : current + 1] ?? null, dropdown);
		} else if (event.key === "ArrowUp") {
			event.preventDefault();
			if (items.length === 0) return;
			const current = getActiveIndex(items);
			setActive(items[current <= 0 ? current === -1 ? items.length - 1 : ctx.loop ? items.length - 1 : 0 : current - 1] ?? null, dropdown);
		} else if (event.key === "Home") {
			event.preventDefault();
			if (items.length > 0) setActive(items[0], dropdown);
		} else if (event.key === "End") {
			event.preventDefault();
			if (items.length > 0) setActive(items[items.length - 1], dropdown);
		} else if (event.key === "Enter") {
			if (event.nativeEvent.isComposing || event.nativeEvent.keyCode === 229) return;
			const target = items[getActiveIndex(items)];
			if (target) {
				event.preventDefault();
				if (target.hasAttribute("data-sub-menu-item")) {
					target.focus();
					target.dispatchEvent(new KeyboardEvent("keydown", {
						key: "ArrowRight",
						bubbles: true
					}));
				} else target.click();
			}
		}
	});
	const _styles = ctx.getStyles("search");
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Input.Input, {
		"data-autofocus": true,
		"data-mantine-stop-propagation": true,
		type: "search",
		size,
		...others,
		ref: mergedRef,
		classNames: [{ input: _styles.className }, classNames],
		styles: [{ input: _styles.style }, styles],
		onKeyDown: handleKeyDown,
		onChange: handleChange,
		__staticSelector: "Menu"
	});
});
MenuSearch.classes = require_Menu_module.default;
MenuSearch.displayName = "@mantine/core/MenuSearch";
//#endregion
exports.MenuSearch = MenuSearch;

//# sourceMappingURL=MenuSearch.cjs.map