feat(Popover): ability to add overlay

[connerblanton]

🔗 Linked issue

#984

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

Adding the ability for a user to use an overlay with the Popover component. Functionality to use the overlay is the same as the Modal. Only difference is the Popover is defaulted to false.

Resolves #984

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
ui	✅ Ready (Inspect)	Visit Preview	Nov 23, 2023 0:08am

[benjamincanac]

@connerblanton The ui.config.ts has been splitted in the meantime (#930).

[connerblanton]

Wanted to get this out there to start a discussion about it. A couple of considerations when adding this overlay:

• Using mode="hover" with the overlay can be weird because once the trigger is hovered, the overlay will appear and since there's no mouseleave (because the overlay is taking up all the space), the end user will have to click on the overlay to remove it. But I guess we leave that decision up to whoever is implementing it?
• Using manual mode with the open prop. A similar issue to the above one. Say we have a Toggle that manually opens the Popover, once the overlay appears, that toggle is now covered up and can't be interacted with. Even clicking on the overlay wouldn't remove it since it is controlled by the prop. I've added an emit of 'update:open' when clicking on the overlay to account for this. Users will now have to use the open prop as v-model:open if they want it to work correctly with the overlay