@veracity/vui/dist/menu/menuItem.js

Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.

import { useCallbackRef } from "../utils/react.js";
import { cs } from "../utils/styles.js";
import { useStyleConfig } from "../core/theme.js";
import vui from "../core/vui.js";
import { ListItem } from "../list/listItem.js";
import { usePopoverContext } from "../popover/context.js";
import { useMenuContext } from "./context.js";
import { jsx } from "react/jsx-runtime";

//#region src/menu/menuItem.tsx
/** Displays a list item and by default closes the menu on click. */
const MenuItem = vui((props, ref) => {
	const { className, onClick: onClickProp, ...rest } = props;
	const { close } = usePopoverContext() ?? {};
	const { closeOnSelect, ...menuProps } = useMenuContext() ?? {};
	const styles = useStyleConfig("Menu", {
		...menuProps,
		...props
	});
	const onClick = useCallbackRef((e) => {
		onClickProp?.(e);
		closeOnSelect && close?.();
	});
	return /* @__PURE__ */ jsx(ListItem, {
		className: cs("vui-menuItem", className),
		onClick,
		ref,
		...styles.item,
		...rest
	});
});
MenuItem.displayName = "MenuItem";

//#endregion
export { MenuItem, MenuItem as default };
globalThis.__vuiVersion__ = "5.3.1"
//# sourceMappingURL=menuItem.js.map