AgentCommandSearch
Live-filtered Agent command search with empty state.
Demo
Install
bash
pnpm add @varo-ui/ai
pnpm dlx @varo-ui/cli add --target h5 components/agent-ui
pnpm dlx @varo-ui/cli add --target weapp components/agent-uiRegistry installs the UI component into your project, so import it from @/components/agent-ui; @varo-ui/ai provides the event protocol, stream controller, and Markdown primitives—not Vue/Wevu UI components.
Basic Usage
vue
<script setup lang="ts">
import { AgentCommandSearch } from '@/components/agent-ui'
</script>
<template>
<AgentCommandSearch v-model="query" :items="commands" />
</template>Props
| Prop | Type | Default | Description |
|---|---|---|---|
modelValue | string | '' | Query |
items | AgentSearchItem[] | [] | Commands |
placeholder | string | Search commands… | Placeholder |
emptyText | string | No commands found | Empty state |
Events
| Event | Payload | Description |
|---|---|---|
select | AgentSearchItem | Select command |
update:modelValue | string | Update query |
Target Notes
| Target | Import |
|---|---|
| H5 | Named export from @/components/agent-ui |
| weapp | Default export from @/components/agent-ui/AgentCommandSearch.vue |
The public API stays aligned across targets; DOM/WXML, scheduling, and native events are target-owned.