This component contains Popover & Input from shadcn. The issue I’m facing is that when I click on the Input to open the Popover, the Input loses focus, and the cursor moves out.

Expected behavior:
When clicking on the Input component, the Popover should open, and the Input should remain focused with the cursor inside it, allowing the user to type without any additional clicks.

Link to Sandbox

"use client";

import { Input } from "@/components/ui/input";
import {
  Popover,
  PopoverContent,
  PopoverTrigger,
} from "@/components/ui/popover";

export default function Searchbar() {
  return (
    <div className="w-1/3">
      <Popover>
        <PopoverTrigger>
          <Input />
        </PopoverTrigger>
        <PopoverContent>Place content for the popover here.</PopoverContent>
      </Popover>
    </div>
  );
}