/* eslint no-unused-vars: 0 */
import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@gsmlg/ui5-webcomponents-base/dist/renderer/LitRenderer.js";

const block0 = (context, tags, suffix) => html`${ context.showSuggestions ? block1(context, tags, suffix) : undefined }${ context.hasValueStateMessage ? block17(context, tags, suffix) : undefined } `;
const block1 = (context, tags, suffix) => suffix ? html`<${scopeTag("ui5-responsive-popover", tags, suffix)} class="${classMap(context.classes.popover)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Left" style="${styleMap(context.styles.suggestionsPopover)}" @ui5-after-open="${ifDefined(context._afterOpenPopover)}" @ui5-after-close="${ifDefined(context._afterClosePopover)}" @ui5-scroll="${ifDefined(context._scroll)}">${ context._isPhone ? block2(context, tags, suffix) : undefined }${ !context._isPhone ? block7(context, tags, suffix) : undefined }<${scopeTag("ui5-list", tags, suffix)} separators="${ifDefined(context.suggestionSeparators)}" @mousedown="${context.onItemMouseDown}" mode="SingleSelect">${ repeat(context.suggestionsTexts, (item, index) => item._id || index, (item, index) => block12(item, index, context, tags, suffix)) }</${scopeTag("ui5-list", tags, suffix)}>${ context._isPhone ? block16(context, tags, suffix) : undefined }</${scopeTag("ui5-responsive-popover", tags, suffix)}>` : html`<ui5-responsive-popover class="${classMap(context.classes.popover)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Left" style="${styleMap(context.styles.suggestionsPopover)}" @ui5-after-open="${ifDefined(context._afterOpenPopover)}" @ui5-after-close="${ifDefined(context._afterClosePopover)}" @ui5-scroll="${ifDefined(context._scroll)}">${ context._isPhone ? block2(context, tags, suffix) : undefined }${ !context._isPhone ? block7(context, tags, suffix) : undefined }<ui5-list separators="${ifDefined(context.suggestionSeparators)}" @mousedown="${context.onItemMouseDown}" mode="SingleSelect">${ repeat(context.suggestionsTexts, (item, index) => item._id || index, (item, index) => block12(item, index, context, tags, suffix)) }</ui5-list>${ context._isPhone ? block16(context, tags, suffix) : undefined }</ui5-responsive-popover>`;
const block2 = (context, tags, suffix) => suffix ? html`<div slot="header" class="ui5-responsive-popover-header"><div class="row"><span>${ifDefined(context._headerTitleText)}</span><${scopeTag("ui5-button", tags, suffix)} class="ui5-responsive-popover-close-btn" icon="decline" design="Transparent" @click="${context._closeRespPopover}"></${scopeTag("ui5-button", tags, suffix)}></div><div class="row"><div class="input-root-phone"><${scopeTag("ui5-input", tags, suffix)} class="ui5-input-inner-phone" type="${ifDefined(context.inputType)}" .value="${ifDefined(context.value)}" ?show-clear-icon=${context.showClearIcon} placeholder="${ifDefined(context.placeholder)}" @input="${context._handleInput}" @change="${context._handleChange}"></${scopeTag("ui5-input", tags, suffix)}></div></div>${ context.hasValueStateMessage ? block3(context, tags, suffix) : undefined }</div>` : html`<div slot="header" class="ui5-responsive-popover-header"><div class="row"><span>${ifDefined(context._headerTitleText)}</span><ui5-button class="ui5-responsive-popover-close-btn" icon="decline" design="Transparent" @click="${context._closeRespPopover}"></ui5-button></div><div class="row"><div class="input-root-phone"><ui5-input class="ui5-input-inner-phone" type="${ifDefined(context.inputType)}" .value="${ifDefined(context.value)}" ?show-clear-icon=${context.showClearIcon} placeholder="${ifDefined(context.placeholder)}" @input="${context._handleInput}" @change="${context._handleChange}"></ui5-input></div></div>${ context.hasValueStateMessage ? block3(context, tags, suffix) : undefined }</div>`;
const block3 = (context, tags, suffix) => suffix ? html`<div class="${classMap(context.classes.popoverValueState)}" style="${styleMap(context.styles.suggestionPopoverHeader)}"><${scopeTag("ui5-icon", tags, suffix)} class="ui5-input-value-state-message-icon" name="${ifDefined(context._valueStateMessageInputIcon)}"></${scopeTag("ui5-icon", tags, suffix)}>${ context.shouldDisplayDefaultValueStateMessage ? block4(context, tags, suffix) : block5(context, tags, suffix) }</div>` : html`<div class="${classMap(context.classes.popoverValueState)}" style="${styleMap(context.styles.suggestionPopoverHeader)}"><ui5-icon class="ui5-input-value-state-message-icon" name="${ifDefined(context._valueStateMessageInputIcon)}"></ui5-icon>${ context.shouldDisplayDefaultValueStateMessage ? block4(context, tags, suffix) : block5(context, tags, suffix) }</div>`;
const block4 = (context, tags, suffix) => html`${ifDefined(context.valueStateText)}`;
const block5 = (context, tags, suffix) => html`${ repeat(context.valueStateMessageText, (item, index) => item._id || index, (item, index) => block6(item, index, context, tags, suffix)) }`;
const block6 = (item, index, context, tags, suffix) => html`${ifDefined(item)}`;
const block7 = (context, tags, suffix) => html`${ context.hasValueStateMessage ? block8(context, tags, suffix) : undefined }`;
const block8 = (context, tags, suffix) => suffix ? html`<div slot="header" ?focused=${context._isValueStateFocused} class="ui5-responsive-popover-header ${classMap(context.classes.popoverValueState)}" style=${styleMap(context.styles.suggestionPopoverHeader)}><${scopeTag("ui5-icon", tags, suffix)} class="ui5-input-value-state-message-icon" name="${ifDefined(context._valueStateMessageInputIcon)}"></${scopeTag("ui5-icon", tags, suffix)}>${ context.shouldDisplayDefaultValueStateMessage ? block9(context, tags, suffix) : block10(context, tags, suffix) }</div>` : html`<div slot="header" ?focused=${context._isValueStateFocused} class="ui5-responsive-popover-header ${classMap(context.classes.popoverValueState)}" style=${styleMap(context.styles.suggestionPopoverHeader)}><ui5-icon class="ui5-input-value-state-message-icon" name="${ifDefined(context._valueStateMessageInputIcon)}"></ui5-icon>${ context.shouldDisplayDefaultValueStateMessage ? block9(context, tags, suffix) : block10(context, tags, suffix) }</div>`;
const block9 = (context, tags, suffix) => html`${ifDefined(context.valueStateText)}`;
const block10 = (context, tags, suffix) => html`${ repeat(context.valueStateMessageText, (item, index) => item._id || index, (item, index) => block11(item, index, context, tags, suffix)) }`;
const block11 = (item, index, context, tags, suffix) => html`${ifDefined(item)}`;
const block12 = (item, index, context, tags, suffix) => html`${ item.groupItem ? block13(item, index, context, tags, suffix) : block14(item, index, context, tags, suffix) }`;
const block13 = (item, index, context, tags, suffix) => suffix ? html`<${scopeTag("ui5-li-groupheader", tags, suffix)} data-ui5-key="${ifDefined(item.key)}">${unsafeHTML(item.text)}</${scopeTag("ui5-li-groupheader", tags, suffix)}>` : html`<ui5-li-groupheader data-ui5-key="${ifDefined(item.key)}">${unsafeHTML(item.text)}</ui5-li-groupheader>`;
const block14 = (item, index, context, tags, suffix) => suffix ? html`<${scopeTag("ui5-li-suggestion-item", tags, suffix)} image="${ifDefined(item.image)}" icon="${ifDefined(item.icon)}" additional-text="${ifDefined(item.additionalText)}" type="${ifDefined(item.type)}" additional-text-state="${ifDefined(item.additionalTextState)}" data-ui5-key="${ifDefined(item.key)}">${unsafeHTML(item.text)}${ item.description ? block15(item, index, context, tags, suffix) : undefined }</${scopeTag("ui5-li-suggestion-item", tags, suffix)}>` : html`<ui5-li-suggestion-item image="${ifDefined(item.image)}" icon="${ifDefined(item.icon)}" additional-text="${ifDefined(item.additionalText)}" type="${ifDefined(item.type)}" additional-text-state="${ifDefined(item.additionalTextState)}" data-ui5-key="${ifDefined(item.key)}">${unsafeHTML(item.text)}${ item.description ? block15(item, index, context, tags, suffix) : undefined }</ui5-li-suggestion-item>`;
const block15 = (item, index, context, tags, suffix) => html`<span slot="richDescription">${unsafeHTML(item.description)}</span>`;
const block16 = (context, tags, suffix) => suffix ? html`<div slot="footer" class="ui5-responsive-popover-footer"><${scopeTag("ui5-button", tags, suffix)} design="Transparent" @click="${context._closeRespPopover}">OK</${scopeTag("ui5-button", tags, suffix)}></div>` : html`<div slot="footer" class="ui5-responsive-popover-footer"><ui5-button design="Transparent" @click="${context._closeRespPopover}">OK</ui5-button></div>`;
const block17 = (context, tags, suffix) => suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} skip-registry-update _disable-initial-focus prevent-focus-restore hide-arrow class="ui5-valuestatemessage-popover" placement-type="Bottom" horizontal-align="${ifDefined(context._valueStatePopoverHorizontalAlign)}"><div slot="header" class="${classMap(context.classes.popoverValueState)}" style="${styleMap(context.styles.popoverHeader)}"><${scopeTag("ui5-icon", tags, suffix)} class="ui5-input-value-state-message-icon" name="${ifDefined(context._valueStateMessageInputIcon)}"></${scopeTag("ui5-icon", tags, suffix)}>${ context.shouldDisplayDefaultValueStateMessage ? block18(context, tags, suffix) : block19(context, tags, suffix) }</div></${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover skip-registry-update _disable-initial-focus prevent-focus-restore hide-arrow class="ui5-valuestatemessage-popover" placement-type="Bottom" horizontal-align="${ifDefined(context._valueStatePopoverHorizontalAlign)}"><div slot="header" class="${classMap(context.classes.popoverValueState)}" style="${styleMap(context.styles.popoverHeader)}"><ui5-icon class="ui5-input-value-state-message-icon" name="${ifDefined(context._valueStateMessageInputIcon)}"></ui5-icon>${ context.shouldDisplayDefaultValueStateMessage ? block18(context, tags, suffix) : block19(context, tags, suffix) }</div></ui5-popover>`;
const block18 = (context, tags, suffix) => html`${ifDefined(context.valueStateText)}`;
const block19 = (context, tags, suffix) => html`${ repeat(context.valueStateMessageText, (item, index) => item._id || index, (item, index) => block20(item, index, context, tags, suffix)) }`;
const block20 = (item, index, context, tags, suffix) => html`${ifDefined(item)}`;


export default block0;