<textarea
                            class="o-mail-Composer-fake position-absolute"
                            t-model="props.composer.textInputContent"
                            t-ref="fakeTextarea"
                            disabled="1"
                        />
                    </div>
                    <div class="o-mail-Composer-actions d-flex bg-view"
                        t-att-class="{
                            'ms-1': compact and ui.isSmall,
                            'mx-1 me-2': compact and !ui.isSmall,
                            'ms-3': normal,
                            'mx-3 border-top p-1': extended,
                        }"
                    >
                        <div class="d-flex flex-grow-1 align-items-center" t-ref="main-actions">
                            <button class="btn border-0 rounded-pill" t-att-class="{'bg-300': this.picker.state.picker === this.picker.PICKERS.EMOJI}" aria-label="Emojis" t-on-click="onClickAddEmoji" t-ref="emoji-button"><i class="fa fa-smile-o"/></button>
                            <FileUploader t-if="allowUpload" multiUpload="true" onUploaded="(data) => { attachmentUploader.uploadData(data) }">
                                <t t-set-slot="toggler">
                                    <button t-att-disabled="!state.active" class="o-mail-Composer-attachFiles btn border-0 rounded-pill" title="Attach files" aria-label="Attach files" type="button" t-on-click="onClickAddAttachment"><i class="fa fa-paperclip"/></button>
                                </t>
                            </FileUploader>
                            <t t-if="extended and ui.isSmall and props.composer.message" t-call="mail.Composer.sendButton"/>
                        </div>
                        <button t-if="props.showFullComposer and thread and thread.type === 'chatter'" class="o-mail-Composer-fullComposer btn fa fa-expand m-1 border-0 rounded-pill" title="Full composer" aria-label="Full composer" type="button" t-on-click="onClickFullComposer"/>
                    </div>
                    <t t-if="!extended" t-call="mail.Composer.sendButton"/>
                </div>
                <div t-if="extended and !props.composer.message" class="d-flex align-items-center mt-2 gap-2">
                    <t t-call="mail.Composer.sendButton"/>
                    <span t-if="!isSendButtonDisabled and !props.composer.message" t-out="SEND_KEYBIND_TO_SEND"/>
                </div>
            </div>
            <div class="o-mail-Composer-footer overflow-auto">
                <AttachmentList
                    t-if="allowUpload and props.composer.attachments.length > 0"
                    attachments="props.composer.attachments"
                    unlinkAttachment.bind="(...args) => attachmentUploader.unlink(...args)"
                    imagesHeight="50"/>
                <Picker t-props="picker"/>
            </div>
        </div>
        <span t-if="props.composer.message" class="text-muted" t-out="CANCEL_OR_SAVE_EDIT_TEXT" t-on-click="onClickCancelOrSaveEditText"/>
    </div>
    <NavigableList t-if="suggestion" class="'o-mail-Composer-suggestionList'" t-props="navigableListProps"/>
</t>