Nuxt Swiftsearch
Components

AisStateResults

Inspect search status, results, and errors with a render-prop slot.

<AisStateResults> exposes the current <AisInstantSearch> snapshot — results, state, status, error — to its default slot. Use it for loading indicators, empty-state UI, or debug overlays.

It is not a connector widget; you don't need to register a useAis* factory in manual mode.

Usage

<AisInstantSearch :configuration="configuration">
  <AisSearchBox />
  <AisStateResults v-slot="{ status, error, results }">
    <p v-if="status === 'stalled'">Searching…</p>
    <p v-else-if="status === 'error'" class="error">{{ error?.message }}</p>
    <p v-else-if="results?.nbHits === 0">No matches.</p>
  </AisStateResults>
  <AisHits />
</AisInstantSearch>

Slot bindings

NameTypeDescription
resultsSearchResults | nullThe latest results object for the parent <AisIndex> scope.
stateSearchParameters | nullHelper state (refinements, query, page).
status'idle' | 'loading' | 'stalled' | 'error'Reactive status. stalled only after stalledSearchDelay (default 200ms).
errorError | undefinedLast search error. Cleared on the next search.

Props

NameTypeDefaultDescription
catchErrorbooleanfalseReserved for opting out of the default error throw on the client. Currently a no-op.
errorFn() => voidundefinedReserved error handler.
On SSR the first render lands in idle — results are pre-fetched and hydrated, so loading and stalled only fire on subsequent client-side searches.
  • useInstantSearch — same status/error refs, accessible from any descendant component.
Copyright © 2026