<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">

<t t-name="website.AutoCompleteInLinkPopover" t-inherit="web.AutoComplete">
    <xpath expr="//input[@t-ref='input']" position="attributes">
        <attribute name="class" remove="o_input pe-3" separator=" "/>
        <attribute name="t-attf-class" add="{{inputClass}}" separator=" "/>
    </xpath>
</t>

<t t-name="website.AutoCompleteItem">
    <div t-att-class="{
        'fw-bold text-capitalize p-2': option.data.isCategory,
    }">
        <t t-if="option.data.icon">
            <img t-att-src="option.data.icon" width="24px" height="24px" class="me-2 rounded"/>
        </t>
        <t t-out="option.label"/>
    </div>
</t>

<t t-name="website.InputURLAutoComplete">
    <AutoCompleteInLinkPopover
        sources="sources"
        value="state.url"
        input="urlRef"
        dropdown="true"
        autofocus="true"
        placeholder.translate="Enter URL, /page, or #anchor"
        inputClass="'o_we_href_input_link border-dark-subtle form-control form-control-sm'"
        t-on-keydown="onKeydownEnter"
        updateValue.bind="updateValue"
    >
        <t t-set-slot="urlOption" t-slot-scope="urlOptionScope">
            <t t-call="website.AutoCompleteItem">
                <t t-set="option" t-value="urlOptionScope"/>
            </t>
        </t>
    </AutoCompleteInLinkPopover>
</t>

<t t-inherit="html_editor.linkPopover" t-inherit-mode="extension">
    <xpath expr="//input[@name='o_linkpopover_url']" position="replace">
        <t t-call="website.InputURLAutoComplete"/>
    </xpath>
    <xpath expr="//input[@name='o_linkpopover_url_img']" position="replace">
        <t t-call="website.InputURLAutoComplete"/>
    </xpath>
    <xpath expr="//a[hasclass('o_we_url_link')]" position="attributes">
        <attribute name="t-on-click">onClickForcePreviewMode</attribute>
    </xpath>
</t>

</templates>
