11/** @jsx h */
22import {
33 autocomplete ,
4+ AutocompleteComponents ,
45 getAlgoliaHits ,
5- snippetHit ,
66} from '@algolia/autocomplete-js' ;
77import {
88 AutocompleteInsightsApi ,
@@ -102,10 +102,11 @@ autocomplete({
102102 </ Fragment >
103103 ) ;
104104 } ,
105- item ( { item } ) {
105+ item ( { item, components } ) {
106106 return (
107107 < ProductItem
108108 hit = { item }
109+ components = { components }
109110 insights = { state . context . algoliaInsightsPlugin . insights }
110111 />
111112 ) ;
@@ -124,20 +125,21 @@ autocomplete({
124125type ProductItemProps = {
125126 hit : ProductHit ;
126127 insights : AutocompleteInsightsApi ;
128+ components : AutocompleteComponents ;
127129} ;
128130
129- function ProductItem ( { hit, insights } : ProductItemProps ) {
131+ function ProductItem ( { hit, insights, components } : ProductItemProps ) {
130132 return (
131133 < Fragment >
132134 < div className = "aa-ItemIcon aa-ItemIcon--alignTop" >
133135 < img src = { hit . image } alt = { hit . name } width = "40" height = "40" />
134136 </ div >
135137 < div className = "aa-ItemContent" >
136138 < div className = "aa-ItemContentTitle" >
137- { snippetHit < ProductHit > ( { hit, attribute : ' name' } ) }
139+ < components . Snippet hit = { hit } attribute = " name" />
138140 </ div >
139141 < div className = "aa-ItemContentDescription" >
140- { snippetHit < ProductHit > ( { hit, attribute : ' description' } ) }
142+ < components . Snippet hit = { hit } attribute = " description" />
141143 </ div >
142144 </ div >
143145 < div className = "aa-ItemActions" >
0 commit comments