keen_web_multiselect

Phoenix LiveView wrapper for the <web-multiselect> custom element. Themeable, virtual-scrolling, form-aware.

wrapper v1.0.0-rc.2 upstream v1.12.0-rc05
๐Ÿ“ฆ

Classic Examples

Declarative `<option>` markup, single/multi select, search hints, badge display modes, badge positioning, tooltips, and RTL.

๐Ÿš€

Flexible Data API

Custom objects, tuple arrays, member callbacks, async search, form integration (json/csv/array), and cascading selects.

โšก

Virtual Scrolling

15,000 options with virtual scrolling, init/render/search timing, plus rich rendering with priority-based badges.

โœจ

Custom Rendering

Render callbacks for options, badges, and selected items โ€” frameworks, products, articles, jobs, movies, images.

๐ŸŽ›๏ธ

Action Buttons

Static and dynamic action buttons: tooltips, visibility/disabled callbacks, custom actions, layout wrap, Font Awesome, plus position/rows/alignment.

๐Ÿ’ฌ

Tooltips

Hover tooltips on dropdown options โ€” default content, custom callbacks, virtual scroll, placement/follow-cursor, side placement, independent styling, and badge tooltips.

๐Ÿ””

Events & Interceptors

DOM events, the `on*` property twin, and `beforeSelect`/`beforeDeselect` veto interceptors โ€” with live veto demos and the callback-vs-event rule.

๐Ÿ“

Sizes & Fonts

Global `--ms-rem` scaling, fine-grained CSS vars, narrow-input / wide-dropdown patterns, and six font-family demos.

๐ŸŽจ

Base Variables

Interactive `--base-*` typography panel โ€” font family, sizes, weights, line heights โ€” wired live into four multiselects.

๐ŸŽญ

Theming

Size presets and seven full themes โ€” Dark, Neon, Audi Corporate, Rounded, Sharp/Minimal, Material, Glassmorphism.

๐Ÿ›

Logging & Debugging

Built-in categorized logging โ€” INIT/DATA/UI/INTERACTION โ€” with runtime enable/disable and category-specific controls.

๐Ÿ“

Positioning Edge Cases

How the dropdown anchors inside transformed, contained, and container-query ancestors โ€” plus the drift-detection warning.