popover doesn't close when clicking in another date-picker

[Puplum]

I have :

const popover = ref({
  visibility: "click",
});

1/ When I click on a date-picker, the popover opens.

2/ If I click on another date-picker, the first one doesn't close.

I can open an infinite number of popovers.

[MohamedAmr21]

I encountered the same issue, so I created a workaround by developing a function that closes all popovers and opens the selected one:

<script setup lang=ts>
const dates = ref([
  {
    key: "popover1",
    selectedDate: "",
    placeholder: "Select Date 1",
    popoverState: false,
  },
  {
    key: "popover2",
    selectedDate: "",
    placeholder: "Select Date 2",
    popoverState: false,
  },
// add more popover as you like
]);

const openPopover = (popoverKey: string) => {
  dates.value.forEach((date) => {
    date.popoverState = date.key === popoverKey;
  });
};
</script>

<template>
<input
  type="text"
  v-model="date.selectedDate"
  @focus="openPopover(date.key)"
/>
</template>