AutocompleteExtension

Autocomplete extension

Smile ElasticSuite expose a fully extensible framework to add content into the Autocomplete results box.

Adding an autocomplete provider

You can use the standard Magento's Autocomplete DataProvider to add your own data provider.

This can be done by adding an item to the Magento\Search\Model\Autocomplete arguments via DI, like this :

    <type name="Magento\Search\Model\Autocomplete">
        <arguments>
            <argument name="dataProviders" xsi:type="array">
                <item name="20" xsi:type="object">Smile\ElasticsuiteCatalog\Model\Autocomplete\Product\DataProvider</item>
            </argument>
        </arguments>
    </type>

This item should implement the Magento\Search\Model\Autocomplete\DataProviderInterface interface.

Adding an autocomplete renderer

You can use the Smile ElasticSuite framework to add your custom renderer.

This can be done by adding an item to the Smile\ElasticsuiteCore\Block\Search\Form\Autocomplete rendererList argument via layout, like this :

        <referenceContainer name="header-wrapper">
            <block class="Smile\ElasticsuiteCore\Block\Search\Form\Autocomplete" name="top.search" as="topSearch" template="Smile_ElasticsuiteCore::search/form.mini.phtml">
                <arguments>
                    <argument name="rendererList" xsi:type="array">
                        <item name="term" xsi:type="array">
                            <item name="title" xsi:type="string" translate="true">Search terms</item>
                            <item name="template" xsi:type="string">Smile_ElasticsuiteCore/autocomplete/term</item>
                        </item>
                    </argument>
                </arguments>
            </block>
        </referenceContainer>

The item can have 2 parameters :

Parameter	Required	Description
title	No	Title of the box in the autocomplete results. Can be empty.
template	Yes	The path to the .html template, in a Magento compliant syntax. Eg: Smile_ElasticSuiteCatalog/autocomplete/product will link to Smile_ElasticSuiteCatalog/view/frontend/web/template/autocomplete/product.html