/* 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`<div class="${classMap(context.classes.root)}" dir="${ifDefined(context.effectiveDir)}">${ context.tabsAtTheBottom ? block1(context, tags, suffix) : undefined }<div class="${classMap(context.classes.header)}" id="${ifDefined(context._id)}-header"><div class="ui5-tc__overflow ui5-tc__overflow--start" @click="${context._onOverflowClick}" @keydown="${context._onOverflowKeyDown}" hidden>${ context.startOverflowButton.length ? block3(context, tags, suffix) : block4(context, tags, suffix) }</div><div id="${ifDefined(context._id)}-tabStrip" class="${classMap(context.classes.tabStrip)}" role="tablist" @click="${context._onTabStripClick}" @keydown="${context._onTabStripKeyDown}" @keyup="${context._onTabStripKeyUp}">${ repeat(context.items, (item, index) => item._id || index, (item, index) => block5(item, index, context, tags, suffix)) }</div><div class="ui5-tc__overflow ui5-tc__overflow--end" @click="${context._onOverflowClick}" @keydown="${context._onOverflowKeyDown}" hidden>${ context.overflowButton.length ? block6(context, tags, suffix) : block7(context, tags, suffix) }</div></div>${ !context.tabsAtTheBottom ? block8(context, tags, suffix) : undefined }</div> `;
const block1 = (context, tags, suffix) => html`<div class="${classMap(context.classes.content)}" part="content"><div class="ui5-tc__contentItem" id="ui5-tc-content" ?hidden="${context._selectedTab.effectiveHidden}" role="tabpanel" aria-labelledby="${ifDefined(context._selectedTab._id)}">${ repeat(context.items, (item, index) => item._id || index, (item, index) => block2(item, index, context, tags, suffix)) }</div></div>`;
const block2 = (item, index, context, tags, suffix) => html`<slot name="${ifDefined(item._effectiveSlotName)}"></slot>`;
const block3 = (context, tags, suffix) => html`<slot name="startOverflowButton"></slot>`;
const block4 = (context, tags, suffix) => suffix ? html`<${scopeTag("ui5-button", tags, suffix)} icon="${ifDefined(context.overflowMenuIcon)}" data-ui5-stable="overflow-start" tabindex="-1" tooltip="${ifDefined(context.overflowMenuTitle)}" aria-haspopup="true" icon-end>${ifDefined(context._startOverflowText)}</${scopeTag("ui5-button", tags, suffix)}>` : html`<ui5-button icon="${ifDefined(context.overflowMenuIcon)}" data-ui5-stable="overflow-start" tabindex="-1" tooltip="${ifDefined(context.overflowMenuTitle)}" aria-haspopup="true" icon-end>${ifDefined(context._startOverflowText)}</ui5-button>`;
const block5 = (item, index, context, tags, suffix) => html`${ifDefined(item.stripPresentation)}`;
const block6 = (context, tags, suffix) => html`<slot name="overflowButton"></slot>`;
const block7 = (context, tags, suffix) => suffix ? html`<${scopeTag("ui5-button", tags, suffix)} icon="${ifDefined(context.overflowMenuIcon)}" data-ui5-stable="overflow-end" tabindex="-1" tooltip="${ifDefined(context.overflowMenuTitle)}" aria-haspopup="true" icon-end>${ifDefined(context._endOverflowText)}</${scopeTag("ui5-button", tags, suffix)}>` : html`<ui5-button icon="${ifDefined(context.overflowMenuIcon)}" data-ui5-stable="overflow-end" tabindex="-1" tooltip="${ifDefined(context.overflowMenuTitle)}" aria-haspopup="true" icon-end>${ifDefined(context._endOverflowText)}</ui5-button>`;
const block8 = (context, tags, suffix) => html`<div class="${classMap(context.classes.content)}" part="content"><div class="ui5-tc__contentItem" id="ui5-tc-content" ?hidden="${context._selectedTab.effectiveHidden}" role="tabpanel" aria-labelledby="${ifDefined(context._selectedTab._id)}">${ repeat(context.items, (item, index) => item._id || index, (item, index) => block9(item, index, context, tags, suffix)) }</div></div>`;
const block9 = (item, index, context, tags, suffix) => html`<slot name="${ifDefined(item._effectiveSlotName)}"></slot>`;


export default block0;