nuxt-x-blog
SearchInput
Search input for filtering blog posts by title or description.
SearchInput
The XBLSearchInput component provides a debounced text field for filtering blog posts by title and description. Used on the /blog listing page above the post grid.
Components
<XBLSearchInput />
Emits a search event with the current query string. The parent passes the query to useBlog().getPosts({ tag, ... }) or filters client-side.
<XBLSearchInput
v-model="query"
placeholder="Search posts..."
@search="handleSearch"
/>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
modelValue | string | '' | Bound search query (v-model) |
placeholder | string | 'Search...' | Input placeholder text |
debounce | number | 300 | Debounce delay in milliseconds |
Emits
| Event | Description |
|---|---|
update:modelValue | v-model update with the current query string |
search | Fired (after debounce) with the current query string |
AI Context
component: XBLSearchInput
package: "@xenterprises/nuxt-x-blog"
use-when: Filtering blog posts by title or description on the listing page