SearchEmptyState Component

File Information

• Path: app/components/search/SearchEmptyState.vue
• Purpose: Shared "no results" block used by the search page and the header search bar.
• Type: Search Component

Overview

Renders a .no-data h-100 container with the emptyCollageIcon (via AsyncIcon), an h4 title and an h5 subtitle. It replaces the inline empty-state markup that SearchBar.vue and pages/[brand_name]/search.vue previously duplicated.

Props

Prop	Type	Default	Description
title	string	'No results found'	Heading text
subtitle	string	'Try adjusting your filters or keywords.'	Secondary text

Events

None.

Usage Example

<SearchEmptyState
  v-if="noDataFound"
  title="Sorry! We couldn't find what you're looking for."
  subtitle="Try adjusting your filters or keywords."
/>

Used in:

• app/components/search/SearchBar.vue - when the overlay has no tab results and recent searches are not shown (rendered with class="px-6")
• app/pages/[brand_name]/search.vue - for noTabResults (open tab empty) and noDataFound

Related Components

• SearchBar
• Search page