ComboBox immediately closes on second open when the anchor has a negative gap

[mart-jansink]

What package within Headless UI are you using?

For example: @headlessui/react

What version of that package are you using?

v2.2.0 (latest)

What browser are you using?

Chrome, Safari (Firefox is OK)

Reproduction URL

https://codesandbox.io/p/devbox/blissful-river-22k848?workspaceId=df463712-8b83-4944-ae78-6529fa90b318

Describe your issue

This ComboBox immediately opens when the input is focused upon, by clicking on it. Then close it by clicking somewhere outside the options. Now clicking the input again causes the box to open just for a moment, before automatically closing again.

With a zero or positive gap value for the anchor prop this doesn't happen. The difference is the list of elements returned by event.composedPath() at

headlessui/packages/@headlessui-react/src/hooks/use-outside-click.ts

Lines 79 to 81 in d71fb9c

	if (event.composed && event.composedPath().includes(container as EventTarget)) {
	return
	}

With a negative gap this set just consists of [body, html, document, Window].

Setting the initialClickTarget.current back to null in

headlessui/packages/@headlessui-react/src/hooks/use-outside-click.ts

Lines 202 to 208 in d71fb9c

	(event) => {
	return handleOutsideClick(event, () => {
	return window.document.activeElement instanceof HTMLIFrameElement
	? window.document.activeElement
	: null
	})
	},

appears to be a fix, but I can't tell if this has any unforeseen consequences.