feat(select): introduce menu-container slot for better flexibility over menu behavior

[TotomInc]

Summary

This PR reimplements the Menu component using JSX for greater flexibility and adds a new menu-container slot to allow wrapping the entire menu content with custom containers.

Major features

• Converted Menu.vue to Menu.tsx for better composability and JSX support
• Added a new menu-container slot for advanced customization of the menu wrapper
• Updated documentation with examples for the new slot
• Created playground demos showcasing the new functionality

Technical improvements

• Added Vue JSX plugin for proper TypeScript support
• Separated CSS into a module file for better organization
• Fixed slot prop types for taggable-no-options (from option to value)
• Updated tests to accommodate the new structure

UI/UX improvements

• Replaced "ExtraOptionProperties" demo with more focused examples:
  • "CustomMenuContainer" to demonstrate the new slot
  • "CustomMenuOption" to show how to customize individual options

Breaking changes

• The taggable-no-options slot now receives value instead of option as props
• Any custom styling targeting the Menu component may need adjustments due to the move to CSS modules

Linked issues

• Virtualized scroll with a lot of options, prevent performance issues #256
• Loading opions remotely (ajax) #260

TODO

• Add tests to ensure custom menu container is rendered
• Fix warn issue with custom computed get/set: Set operation on key "value" failed: target is readonly
• Add virtual-scroll demo with vue-virtual-scroller
• Add infinite-scroll demo

[vercel]

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

Name	Status	Preview	Comments	Updated (UTC)
vue3-select-component	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 13, 2025 10:37am