<1 min read

FallbackDisclaimer

FallbackDisclaimer

The FallbackDisclaimer component shows a message if the filters have been removed from the current search because there were no results.

Slots

Name Description Bindings
(name - type - description)
default

Examples

This default fallback disclaimer component reads the query from the search state and passes it to its default slot. This component will be rendered if there is a no results with filters situation.

Basic usage

<template>
  <FallbackDisclaimer />
</template>
<script setup>
import { FallbackDisclaimer } from '@empathyco/x-components/search'
</script>

Customizing its contents

<template>
  <FallbackDisclaimer>
    <template #default="{ query }">
      No results found for '{{ query }}' with the selected filters. The filters have been
      unselected.
    </template>
  </FallbackDisclaimer>
</template>
<script setup>
import { FallbackDisclaimer } from '@empathyco/x-components/search'
</script>