@reach-ui-fork/popover

1import * as React from "react";
2import { Popover, positionDefault } from "@reach-ui-fork/popover";
3
4function Example() {
5	const ref = React.useRef(null);
6	const [value, setValue] = React.useState("");
7	return (
8		<div>
9			<label>
10				<span>Type for a special message</span>
11				<input
12					type="text"
13					ref={ref}
14					onChange={(event) => setValue(event.target.value)}
15				/>
16			</label>
17
18			{value.length > 0 && (
19				<Popover targetRef={ref} position={positionDefault}>
20					<div>
21						<p>Whoa! Look at me!</p>
22					</div>
23				</Popover>
24			)}
25		</div>
26	);
27}