We would like to display StandardFacet labels using React components.
Example
We have a ratings facet that uses stars instead of text labels. We have these as React components and would like to re-use them.
Current options
The transformOptions property allows us to modify the facet options, but the displayName must be a string.
export declare interface DisplayableFacetOption extends FacetOption {
/** The name of the facet option which is meant to be displayed to the end user. */
displayName: string;
/** The number of results associated with this facet option. */
count: number;
/** Whether or not the filter is selected in the search results. */
selected: boolean;
}
For now, we have created our own components that mimic the StandardFacet component using the hooks directly.
However, when using Facets, we cannot order our custom facets between those rendered by the Facets component. So, we display them at the top or bottom next to the Facets component.
We would like to display
StandardFacetlabels using React components.Example
We have a ratings facet that uses stars instead of text labels. We have these as React components and would like to re-use them.
Current options
The
transformOptionsproperty allows us to modify the facet options, but thedisplayNamemust be a string.For now, we have created our own components that mimic the
StandardFacetcomponent using the hooks directly.However, when using
Facets, we cannot order our custom facets between those rendered by theFacetscomponent. So, we display them at the top or bottom next to theFacetscomponent.