A headless combobox for Vue 3
Notes from building a renderless combobox with one state machine, ARIA prop bags, keyboard handling, and native popover positioning.
Skip to content
Virtual scrolling past the browser scroll limit
How the library maps a 10-million-pixel scroll range onto virtual coordinates, and why wheel and pointer input need their own handling.
Rendering Mermaid diagrams in VS Code without Mermaid.js
How the extension renders .mmd files and fenced mermaid blocks with Pele, and why the Markdown path needs two phases.
Generic composable function for Quasar QSelect with filtering
A Vue composable for simplifying the usage of QSelect with filtering in Quasar.
Customize QSelect selected options display
Customize the way selected options are displayed in QSelect.
Show QSelect options as a popup menu on bottom of the screen
Show QSelect options as a popup menu on bottom of the screen, like the native select on iPhone.
Numeric fields with increment / decrement buttons
Create numeric input fields with custom buttons using QInput and QBtn or change value by dragging.
Horizontal separators with QSeparator
Create separators using content inside.
Mini drawer in Quasar that expands when focused and on mouse over
Create slim drawers that expand on focus and on mouse over and stays open while you navigate its menus.
Resizable drawer in Quasar
Create a drawer width resizable width.
Wrapper Vue2/3 directives to allow dynamic add/remove
A composable that converts a Vue2/3 directive in a directive that can be dynamically adder/removed.
Draggable summary-details bottom drawer
A draggable bottom drawer/card with two open positions - half and full (summary and details).
Grouping form elements in Quasar
Explain styling needed to group form elements in Quasar in order to make them look like a single element.
Vue REPL for Quasar
Introducing the new Vue REPL for Quasar Framework v2.