Hover Card Disappears Upon Clicking the Trigger Element about themes HOT 1 CLOSED

<Flex
      gap="1"
      align="end"
      grow="1"
      ref={triggerRef}
    >
      <HoverCard.Root open={isHover} onOpenChange={setIsHover}>
        <HoverCard.Trigger
          onClick={(event) => {
            console.log("onClick");
            event.preventDefault();
          }}
        >
          <Flex
            gap="1"
            align="center"
            style={{
              cursor: "pointer",
            }}
          >
            <Files
              color="gray"
              strokeWidth={2}
              width={12}
              height={12}
            />
            <RText color="gray" size="1" className="md:block hidden">
              filelist
            </RText>
          </Flex>
        </HoverCard.Trigger>
        <HoverCard.Content
          onPointerDownOutside={(event) => {
            if (
              triggerRef.current &&
              (triggerRef.current as HTMLElement).contains(
                event.target as Node
              )
            )
              event.preventDefault();
          }}
        >
          <div className={styles.raycast}>
            <Command value={value} onValueChange={(v) => setValue(v)}>
              <div cmdk-raycast-top-shine="" />
              <Command.Input
                ref={inputRef}
                autoFocus
                placeholder="Search File..."
              />
              <hr cmdk-raycast-loader="" />
              <Command.List ref={listRef}>
                <Command.Empty>Not Found</Command.Empty>
                <Command.Group heading="Rcently Open">
                  <Item value="xxxx">
                    📒xxxx
                  </Item>
                </Command.Group>
              </Command.List>
            </Command>
          </div>
        </HoverCard.Content>
      </HoverCard.Root>
      <Separator mx="2" my="0" size="1" orientation="vertical" />
      <Flex gap="1" align="center">
        <Save color="gray" strokeWidth={2} width={12} height={12} />
        <RText color="gray" size="1" className="md:block hidden">
          Saved
        </RText>
      </Flex>
    </Flex>