I am able to create a gallery, but I have not been able to hand off my facet list to the component via the facet attribute.
The JSON facet list I have created works in the storybook demo.
I'm guessing there must be some other method, interface, or component I have to pass the list through in order to turn it into an IFacet, but I haven't been able to find this in the hub-components or hub.js docs.
Thanks
const facets = [
{
"label": "From",
"key": "from",
"display": "single-select",
"options": [
{
"label": "SCCWRP",
"key": "sccwrp",
"value": "",
"selected": true,
"filter": {
"filterType": "content",
"owner": "sccwrp"
}
}
],
"accordionClosed": true
},
{
"label": "Types",
"key": "types",
"display": "multi-select",
"pageSize": 5,
"options": [
{
"label": "Data",
"key": "featurelayer",
"selected": true,
"filter": {
"filterType": "content",
"type": "Feature Service",
"tags": { "exact": "bight18-sediment-chemistry" }
}
}
]
}
]
document.querySelector("body").innerHTML += `
<arcgis-hub-content-gallery
query=''
layout='list'
show-search=true
show-sort=true
sort-order='desc'
facet={${facets}}>
</arcgis-hub-content-gallery>
`;
First I notice in the snippet above you have `facet=`, but the property is `facets`
But even after you fix that, I think you'll still have a problem b/c you are trying to pass the facets as an attribute. For non-scalar properties (i.e. objects and arrays), the way to set them on custom elements is render the element w/o specifying any attribute value for that property, and then use JS after the element has rendered like:
const el = document.querySelector('arcgis-hub-content-gallery')
el.facets = facets
@TomWayson not sure how that facet typo slipped in there. But your solution worked! Thank you again