Extra facet values/labels access in ais-refinement-list component

Let’s say I have a categories attribute on our index record. The categories attribute is a list of objects for all the categories that exist on a record. The categories attribute is in attributesForFaceting, They look like the following:

[
  {
    slug: "alert",
    name: "Alert",
    icon: "bell"
  },
  {
    slug: "devices-hardware",
    name: "Devices + Hardware",
    icon: "computer"
  },
 ...
]

In the ais-refinement-list you need to set the attribute property to something like <ais-refinement-list attribute="categories.name" .../> and then the item that gets passed in just references the name of the object in the facet.

Is there any way to get a reference to the entire category object for the facet in the ais-refinement-list component so when we loop through items we can get access to slug and icon?

I was attempting to do the same thing but it doesn’t look like there’s a way to do this in a neat way.

Their recommended way is to join all this data together into a string like

"category": "devices-hardware||Devices + Hardware||computer"

Related Topic