import { mergeRefs } from "../utils/react.js";
import { cs } from "../utils/styles.js";
import { useStyleConfig } from "../core/theme.js";
import { v } from "../core/styled.js";
import vui from "../core/vui.js";
import { usePopoverContext } from "./context.js";
import { jsx } from "react/jsx-runtime";

//#region src/popover/popoverTrigger.tsx
/**
* Displays a trigger component to toggle display of the popover content.
* Can be rendered as any component using the 'as' prop. By default renders as a plain button.
*/
const PopoverTrigger = vui((props, ref) => {
	const { as, className, onClick: onClickProp, ...rest } = props;
	const { getReferenceProps, setReference, isOpen, ...popoverProps } = usePopoverContext() ?? {};
	const styles = useStyleConfig("Popover", {
		...popoverProps,
		...props
	});
	const Element = as || v.button;
	const onClick = (e) => {
		e.stopPropagation();
		onClickProp?.(e);
	};
	const referenceProps = getReferenceProps?.() ?? {};
	return /* @__PURE__ */ jsx(Element, {
		isActive: isOpen,
		className: cs("vui-popoverTrigger", className),
		onClick,
		ref: mergeRefs(setReference, ref),
		...referenceProps,
		...styles.trigger,
		...rest
	});
});
PopoverTrigger.displayName = "PopoverTrigger";

//#endregion
export { PopoverTrigger as default };
globalThis.__vuiVersion__ = "4.0.0"
//# sourceMappingURL=popoverTrigger.js.map