diff --git a/.changeset/search-dull-planes-prove.md b/.changeset/search-dull-planes-prove.md
new file mode 100644
index 0000000000..f185207ede
--- /dev/null
+++ b/.changeset/search-dull-planes-prove.md
@@ -0,0 +1,30 @@
+---
+'@backstage/plugin-search-react': minor
+---
+
+The `` component now accepts an optional property `disableRenderingWithNoResults` to disable rendering when no results are returned.
+Possibility to provide a custom no results component if needed through the `noResultsComponent` property.
+
+Examples:
+
+_Rendering a custom no results component_
+
+```jsx
+}
+ title="Documentation"
+ noResultsComponent={}
+/>
+```
+
+_Disable rendering when there are no results_
+
+```jsx
+}
+ title="Documentation"
+ disableRenderingWithNoResults
+/>
+```
diff --git a/plugins/search-react/api-report.md b/plugins/search-react/api-report.md
index 5ec4124fcc..194b285e49 100644
--- a/plugins/search-react/api-report.md
+++ b/plugins/search-react/api-report.md
@@ -213,7 +213,9 @@ export type SearchFilterWrapperProps = SearchFilterComponentProps & {
export const SearchResult: (props: SearchResultProps) => JSX.Element;
// @public
-export const SearchResultApi: (props: SearchResultApiProps) => JSX.Element;
+export const SearchResultApi: (
+ props: SearchResultApiProps,
+) => JSX.Element | null;
// @public
export type SearchResultApiProps = SearchResultContextProps & {
@@ -226,11 +228,11 @@ export const SearchResultComponent: (props: SearchResultProps) => JSX.Element;
// @public
export const SearchResultContext: (
props: SearchResultContextProps,
-) => JSX.Element;
+) => JSX.Element | null;
// @public
export type SearchResultContextProps = {
- children: (state: AsyncState) => JSX.Element;
+ children: (state: AsyncState) => JSX.Element | null;
};
// @public
@@ -269,13 +271,22 @@ export type SearchResultGroupLayoutProps = ListProps & {
link?: ReactNode;
linkProps?: Partial;
filterOptions?: FilterOption[];
- renderFilterOption?: (filterOption: FilterOption) => JSX.Element;
+ renderFilterOption?: (
+ value: FilterOption,
+ index: number,
+ array: FilterOption[],
+ ) => JSX.Element | null;
filterFields?: string[];
renderFilterField?: (key: string) => JSX.Element | null;
resultItems?: SearchResult_2[];
- renderResultItem?: (resultItem: SearchResult_2) => JSX.Element;
+ renderResultItem?: (
+ value: SearchResult_2,
+ index: number,
+ array: SearchResult_2[],
+ ) => JSX.Element | null;
error?: Error;
loading?: boolean;
+ noResultsComponent?: ReactNode;
};
// @public
@@ -284,6 +295,7 @@ export type SearchResultGroupProps = Omit<
'loading' | 'error' | 'resultItems' | 'filterFields'
> & {
query: Partial;
+ disableRenderingWithNoResults?: boolean;
};
// @public