@sapudex/web-components 0.143.0 → 0.172.0

package/src/generated/templates/FooterTemplate.lit.ts

@@ -4,7 +4,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type Footer from "../../Footer.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<footer class="udex-footer"><div class="udex-footer__content"><div class="udex-footer__contact-social">${ this.logoUrl ? block1.call(this, context, tags, suffix) : undefined }${ this.isContactContainerVisible ? block4.call(this, context, tags, suffix) : undefined }</div>${ this.isContactContainerVisible ? block10.call(this, context, tags, suffix) : undefined }${ this._shouldRenderMobileMenu ? block11.call(this, context, tags, suffix) : block20.call(this, context, tags, suffix) }<${scopeTag("udex-divider", tags, suffix)} class="udex-footer__divider"></${scopeTag("udex-divider", tags, suffix)}>${ this.socialLinksArray.length ? block29.call(this, context, tags, suffix) : undefined }</div><${scopeTag("udex-button", tags, suffix)} class="udex-footer__back-to-top-button" icon="back-to-top" @click="${this.onBackToTopClick}" design="Tertiary" size="Large" accessible-name="back to top"></${scopeTag("udex-button", tags, suffix)}></footer> ` : html`<footer class="udex-footer"><div class="udex-footer__content"><div class="udex-footer__contact-social">${ this.logoUrl ? block1.call(this, context, tags, suffix) : undefined }${ this.isContactContainerVisible ? block4.call(this, context, tags, suffix) : undefined }</div>${ this.isContactContainerVisible ? block10.call(this, context, tags, suffix) : undefined }${ this._shouldRenderMobileMenu ? block11.call(this, context, tags, suffix) : block20.call(this, context, tags, suffix) }<udex-divider class="udex-footer__divider"></udex-divider>${ this.socialLinksArray.length ? block29.call(this, context, tags, suffix) : undefined }</div><udex-button class="udex-footer__back-to-top-button" icon="back-to-top" @click="${this.onBackToTopClick}" design="Tertiary" size="Large" accessible-name="back to top"></udex-button></footer> `;}
+function block0 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<footer class="udex-footer"><div class="udex-footer__content"><div class="udex-footer__contact-social">${ this.logoUrl ? block1.call(this, context, tags, suffix) : undefined }${ this.isContactContainerVisible ? block4.call(this, context, tags, suffix) : undefined }</div>${ this.isContactContainerVisible ? block10.call(this, context, tags, suffix) : undefined }${ this._shouldRenderMobileMenu ? block11.call(this, context, tags, suffix) : block20.call(this, context, tags, suffix) }<${scopeTag("udex-divider", tags, suffix)} class="udex-footer__divider"></${scopeTag("udex-divider", tags, suffix)}><div class="udex-footer__copyright">${ this.isChineseLang ? block29.call(this, context, tags, suffix) : undefined }<span class="udex-footer__copyright-text">${ifDefined(this.copyrightText)}</span></div>${ this.socialLinksArray.length ? block30.call(this, context, tags, suffix) : undefined }</div><${scopeTag("udex-button", tags, suffix)} class="udex-footer__back-to-top-button" icon="back-to-top" @click="${this.onBackToTopClick}" design="Tertiary" size="Large" accessible-name="back to top"></${scopeTag("udex-button", tags, suffix)}></footer> ` : html`<footer class="udex-footer"><div class="udex-footer__content"><div class="udex-footer__contact-social">${ this.logoUrl ? block1.call(this, context, tags, suffix) : undefined }${ this.isContactContainerVisible ? block4.call(this, context, tags, suffix) : undefined }</div>${ this.isContactContainerVisible ? block10.call(this, context, tags, suffix) : undefined }${ this._shouldRenderMobileMenu ? block11.call(this, context, tags, suffix) : block20.call(this, context, tags, suffix) }<udex-divider class="udex-footer__divider"></udex-divider><div class="udex-footer__copyright">${ this.isChineseLang ? block29.call(this, context, tags, suffix) : undefined }<span class="udex-footer__copyright-text">${ifDefined(this.copyrightText)}</span></div>${ this.socialLinksArray.length ? block30.call(this, context, tags, suffix) : undefined }</div><udex-button class="udex-footer__back-to-top-button" icon="back-to-top" @click="${this.onBackToTopClick}" design="Tertiary" size="Large" accessible-name="back to top"></udex-button></footer> `;}
 function block1 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__logo">${ this.logoLink ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</div>`;}
 function block2 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a href="${ifDefined(this.parsedRef)}" @click="${this._onLogoClick}" title="${ifDefined(this.logoTitle)}" aria-label="${ifDefined(this.logoAriaLabel)}"><img id="udex-footer__logo-image" src="${ifDefined(this.logoUrl)}" class="udex-footer__logo-image" alt="${ifDefined(this.logoAlt)}"/></a>`;}
 function block3 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img id="udex-footer__logo-image" src="${ifDefined(this.logoUrl)}" class="udex-footer__logo-image" alt="${ifDefined(this.logoAlt)}"/>`;}
@@ -16,25 +16,26 @@ function block8 (this: Footer, context: UI5Element, tags: string[], suffix: stri
 function block9 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-footer__chat-with-us"><div class="udex-footer__icon-container"><${scopeTag("ui5-icon", tags, suffix)} class="udex-footer__icon" name="discussion-2"></${scopeTag("ui5-icon", tags, suffix)}></div><a href="${ifDefined(this.chatWithUsLink)}" class="udex-footer__chat-with-us-link" @click="${this._onContactChatClick}">${ifDefined(this.chatWithUsAccessibleName)}</a></div>` : html`<div class="udex-footer__chat-with-us"><div class="udex-footer__icon-container"><ui5-icon class="udex-footer__icon" name="discussion-2"></ui5-icon></div><a href="${ifDefined(this.chatWithUsLink)}" class="udex-footer__chat-with-us-link" @click="${this._onContactChatClick}">${ifDefined(this.chatWithUsAccessibleName)}</a></div>`;}
 function block10 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-divider", tags, suffix)} class="udex-footer__divider"></${scopeTag("udex-divider", tags, suffix)}>` : html`<udex-divider class="udex-footer__divider"></udex-divider>`;}
 function block11 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion", tags, suffix)} class="udex-footer__accordion">${ this.quickLinksArray.length ? block12.call(this, context, tags, suffix) : undefined }${ this.trendingLinksArray.length ? block14.call(this, context, tags, suffix) : undefined }${ this.aboutLinksArray.length ? block16.call(this, context, tags, suffix) : undefined }${ this.siteInformationLinksArray.length ? block18.call(this, context, tags, suffix) : undefined }</${scopeTag("udex-accordion", tags, suffix)}>` : html`<udex-accordion class="udex-footer__accordion">${ this.quickLinksArray.length ? block12.call(this, context, tags, suffix) : undefined }${ this.trendingLinksArray.length ? block14.call(this, context, tags, suffix) : undefined }${ this.aboutLinksArray.length ? block16.call(this, context, tags, suffix) : undefined }${ this.siteInformationLinksArray.length ? block18.call(this, context, tags, suffix) : undefined }</udex-accordion>`;}
-function block12 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this.quickLinksTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.quickLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block13.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__quick-links">${ifDefined(this.quickLinksTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this.quickLinksTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.quickLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block13.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__quick-links">${ifDefined(this.quickLinksTitle)}</h3>`;}
+function block12 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this._quickLinksTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.quickLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block13.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__quick-links">${ifDefined(this._quickLinksTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this._quickLinksTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.quickLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block13.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__quick-links">${ifDefined(this._quickLinksTitle)}</h3>`;}
 function block13 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__quick-links" href="${ifDefined(item.url)}" data-id="${ifDefined(item.id)}" @click="${this._onQuickLinksClick}">${ifDefined(item.title)}</a></li>`;}
-function block14 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this.trendingTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.trendingLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block15.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__trending">${ifDefined(this.trendingTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this.trendingTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.trendingLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block15.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__trending">${ifDefined(this.trendingTitle)}</h3>`;}
+function block14 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this._trendingTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.trendingLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block15.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__trending">${ifDefined(this._trendingTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this._trendingTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.trendingLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block15.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__trending">${ifDefined(this._trendingTitle)}</h3>`;}
 function block15 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__footer__trending" href="${ifDefined(item.url)}" @click="${this._onTrendingClick}" data-id="${ifDefined(item.id)}">${ifDefined(item.title)}</a></li>`;}
-function block16 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this.aboutSapTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.aboutLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block17.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__about">${ifDefined(this.aboutSapTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this.aboutSapTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.aboutLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block17.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__about">${ifDefined(this.aboutSapTitle)}</h3>`;}
+function block16 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this._aboutSapTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.aboutLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block17.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__about">${ifDefined(this._aboutSapTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this._aboutSapTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.aboutLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block17.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__about">${ifDefined(this._aboutSapTitle)}</h3>`;}
 function block17 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__about" href="${ifDefined(item.url)}" data-id="${ifDefined(item.id)}" @click="${this._onAboutSapClick}">${ifDefined(item.title)}</a></li>`;}
-function block18 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this.siteInformationTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.siteInformationLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block19.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__site-information">${ifDefined(this.siteInformationTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this.siteInformationTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.siteInformationLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block19.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__site-information">${ifDefined(this.siteInformationTitle)}</h3>`;}
+function block18 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-accordion-item", tags, suffix)} title="${ifDefined(this._siteInformationTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.siteInformationLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block19.call(this, context, tags, suffix, item, index)) }</ul></${scopeTag("udex-accordion-item", tags, suffix)}><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__site-information">${ifDefined(this._siteInformationTitle)}</h3>` : html`<udex-accordion-item title="${ifDefined(this._siteInformationTitle)}" class="udex-footer__action-item"><ul class="udex-footer__links-list udex-footer__links-list--mobile">${ repeat(this.siteInformationLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block19.call(this, context, tags, suffix, item, index)) }</ul></udex-accordion-item><h3 class="udex-footer__links-item hidden" aria-hidden="true" id="udex-footer__site-information">${ifDefined(this._siteInformationTitle)}</h3>`;}
 function block19 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__site-information" href="${ifDefined(item.url)}" data-id="${ifDefined(item.id)}" @click="${this._onSiteInformationClick}">${ifDefined(item.title)}</a></li>`;}
 function block20 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links">${ this.quickLinksArray.length ? block21.call(this, context, tags, suffix) : undefined }${ this.trendingLinksArray.length ? block23.call(this, context, tags, suffix) : undefined }${ this.aboutLinksArray.length ? block25.call(this, context, tags, suffix) : undefined }${ this.siteInformationLinksArray.length ? block27.call(this, context, tags, suffix) : undefined }</div>`;}
-function block21 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__quick-links"><h3 class="udex-footer__links-item" id="udex-footer__quick-links">${ifDefined(this.quickLinksTitle)}</h3><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.quickLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block22.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
+function block21 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__quick-links"><h3 class="udex-footer__links-item" id="udex-footer__quick-links">${ifDefined(this._quickLinksTitle)}</h3><nav aria-labelledby="udex-footer__quick-links"><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.quickLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block22.call(this, context, tags, suffix, item, index)) }</ul></nav></div>`;}
 function block22 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__quick-links" data-id="${ifDefined(item.id)}" href="${ifDefined(item.url)}" @click="${this._onQuickLinksClick}">${ifDefined(item.title)}</a></li>`;}
-function block23 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__trending-links"><h3 class="udex-footer__links-item" id="udex-footer__trending">${ifDefined(this.trendingTitle)}</h3><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.trendingLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block24.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
+function block23 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__trending-links"><h3 class="udex-footer__links-item" id="udex-footer__trending">${ifDefined(this._trendingTitle)}</h3><nav aria-labelledby="udex-footer__trending"><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.trendingLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block24.call(this, context, tags, suffix, item, index)) }</ul></nav></div>`;}
 function block24 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__footer__trending" data-id="${ifDefined(item.id)}" href="${ifDefined(item.url)}" @click="${this._onTrendingClick}">${ifDefined(item.title)}</a></li>`;}
-function block25 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__about-links"><h3 class="udex-footer__links-item" id="udex-footer__about">${ifDefined(this.aboutSapTitle)}</h3><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.aboutLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block26.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
+function block25 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__about-links"><h3 class="udex-footer__links-item" id="udex-footer__about">${ifDefined(this._aboutSapTitle)}</h3><nav aria-labelledby="udex-footer__about"><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.aboutLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block26.call(this, context, tags, suffix, item, index)) }</ul></nav></div>`;}
 function block26 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__about" data-id="${ifDefined(item.id)}" href="${ifDefined(item.url)}" @click="${this._onAboutSapClick}">${ifDefined(item.title)}</a></li>`;}
-function block27 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__site-information-links"><h3 class="udex-footer__links-item" id="udex-footer__site-information">${ifDefined(this.siteInformationTitle)}</h3><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.siteInformationLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block28.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
+function block27 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__links-group udex-footer__site-information-links"><h3 class="udex-footer__links-item" id="udex-footer__site-information">${ifDefined(this._siteInformationTitle)}</h3><nav aria-labelledby="udex-footer__site-information"><ul class="udex-footer__links-list udex-footer__links-list--desktop">${ repeat(this.siteInformationLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block28.call(this, context, tags, suffix, item, index)) }</ul></nav></div>`;}
 function block28 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li><a target="${ifDefined(item.target)}" aria-describedby="udex-footer__site-information" data-id="${ifDefined(item.id)}" href="${ifDefined(item.url)}" @click="${this._onSiteInformationClick}">${ifDefined(item.title)}</a></li>`;}
-function block29 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__social-container">${ repeat(this.socialLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block30.call(this, context, tags, suffix, item, index)) }</div>`;}
-function block30 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<a target="${ifDefined(item.target)}" href="${ifDefined(item.url)}" class="udex-footer__social-icon" data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" @click="${this._onSocialMediaLinkClick}"><img data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" alt="${ifDefined(item.name)}${ifDefined(this.socialIconAccessibleName)}" src="${ifDefined(item.iconUrl)}" loading="lazy" /></a>`;}
+function block29 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-footer__copyright-chinese-text"><a href="${ifDefined(this.chineseIcpNumberLink)}" title="${ifDefined(this.chineseICPNumber)}" class="udex-footer__copyright-chinese-link" target="_blank">${ifDefined(this.chineseICPNumber)}</a>${ifDefined(this.chineseSecurityNetworkNumber)}</span>`;}
+function block30 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-footer__social-container">${ repeat(this.socialLinksArray, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block31.call(this, context, tags, suffix, item, index)) }</div>`;}
+function block31 (this: Footer, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<a target="${ifDefined(item.target)}" href="${ifDefined(item.url)}" class="udex-footer__social-icon" data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" @click="${this._onSocialMediaLinkClick}"><img data-name="${ifDefined(item.name)}" data-id="${ifDefined(item.id)}" alt="${ifDefined(item.name)}${ifDefined(this.socialIconAccessibleName)}" src="${ifDefined(item.iconUrl)}" loading="lazy" /></a>`;}
 
 
 export default block0;

package/src/generated/templates/ListItemTemplate.lit.ts

@@ -5,7 +5,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.modeSelected ? block1.call(this, context, tags, suffix) : undefined }${ this.modeSingleContent ? block16.call(this, context, tags, suffix) : undefined } `;}
-function block1 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" role="${ifDefined(this.roleItem)}" tabindex="${ifDefined(this._effectiveTabIndex)}" aria-disabled="${ifDefined(this._ariaDisabled)}" class="${ifDefined(this.className)}" @click="${this.handleItemClick}" @mousedown="${this.handleMouseDown}" @mouseup="${this.handleMouseUp}" @keyup="${this.handleKeyUp}" @keydown="${this.handleKeyDown}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" aria-selected="${ifDefined(this.selected)}" aria-current="${ifDefined(this.selected)}" ?divider="${this.divider}" _id="${ifDefined(this._id)}">${ this.modeMultiSelect ? block2.call(this, context, tags, suffix) : undefined }${ this.modeRadioGroup ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-list__content-wrap" _id="${ifDefined(this._id)}" aria-labelledby="${ifDefined(this._id)}-invisibleText">${ this.flag ? block4.call(this, context, tags, suffix) : undefined }${ this.typeNumber ? block5.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block6.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block7.call(this, context, tags, suffix) : undefined }${ this.image ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-list__content" part="content">${ this.label ? block9.call(this, context, tags, suffix) : block11.call(this, context, tags, suffix) }</div><div class="hidden" id="${ifDefined(this._id)}-invisibleText">${ifDefined(this.accessibleName)}</div></div></li>`;}
+function block1 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" role="${ifDefined(this.roleItem)}" tabindex="${ifDefined(this._effectiveTabIndex)}" aria-disabled="${ifDefined(this._ariaDisabled)}" class="${ifDefined(this.className)}" @click="${this.handleItemClick}" @mousedown="${this.handleMouseDown}" @mouseup="${this.handleMouseUp}" @keyup="${this.handleKeyUp}" @keydown="${this.handleKeyDown}" @focusin="${this.handleFocusIn}" @focusout="${this.handleFocusOut}" aria-selected="${ifDefined(this.selected)}" aria-current="${ifDefined(this.selected)}" ?divider="${this.divider}" _id="${ifDefined(this._id)}">${ this.modeMultiSelect ? block2.call(this, context, tags, suffix) : undefined }${ this.modeRadioGroup ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-list__content-wrap" _id="${ifDefined(this._id)}" aria-labelledby="${ifDefined(this._id)}-invisibleText" aria-label="${ifDefined(this.accessibleListItemName)}">${ this.flag ? block4.call(this, context, tags, suffix) : undefined }${ this.typeNumber ? block5.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block6.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block7.call(this, context, tags, suffix) : undefined }${ this.image ? block8.call(this, context, tags, suffix) : undefined }<div class="udex-list__content" part="content">${ this.label ? block9.call(this, context, tags, suffix) : block11.call(this, context, tags, suffix) }</div><div class="hidden" id="${ifDefined(this._id)}-invisibleText">${ifDefined(this.accessibleListItemName)}</div></div></li>`;}
 function block2 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-checkbox", tags, suffix)} class="udex-list__checkbox" part="checkbox" tabindex="-1" ?aria-checked="${this.selected}" ?indeterminate="${this.indeterminate}" accessible-name="checkbox ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></${scopeTag("udex-checkbox", tags, suffix)}>` : html`<udex-checkbox class="udex-list__checkbox" part="checkbox" tabindex="-1" ?aria-checked="${this.selected}" ?indeterminate="${this.indeterminate}" accessible-name="checkbox ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></udex-checkbox>`;}
 function block3 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-radio-button", tags, suffix)} class="udex-list__radio" part="radio" tabindex="-1" ?aria-checked="${this.selected}" accessible-name="radio ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></${scopeTag("udex-radio-button", tags, suffix)}>` : html`<udex-radio-button class="udex-list__radio" part="radio" tabindex="-1" ?aria-checked="${this.selected}" accessible-name="radio ${ifDefined(this.stateAccessibleName)}" ?checked="${this.selected}" ?disabled="${this.disabled}"></udex-radio-button>`;}
 function block4 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list__flag-wrap"><span class="udex-list__flag" style="background-position: ${ifDefined(this.flagPosition)}"></span></div>`;}
@@ -20,7 +20,7 @@ function block12 (this: ListItem, context: UI5Element, tags: string[], suffix: s
 function block13 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list__add-text" part="additional-text">${ifDefined(this.additionalText)}</div>`;}
 function block14 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} @click="${this.handleEditClick}" @keydown="${this.handleKeyDownIcon}" part="edit-button" class="udex-list__edit-button" design="Tertiary" icon="${ifDefined(this.editIcon)}" accessible-name="${ifDefined(this.editButtonAccessibleName)}" toolTip="${ifDefined(this.editButtonAccessibleName)}" size="Small"></${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button @click="${this.handleEditClick}" @keydown="${this.handleKeyDownIcon}" part="edit-button" class="udex-list__edit-button" design="Tertiary" icon="${ifDefined(this.editIcon)}" accessible-name="${ifDefined(this.editButtonAccessibleName)}" toolTip="${ifDefined(this.editButtonAccessibleName)}" size="Small"></udex-button>`;}
 function block15 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} @click="${this.handleDeleteClick}" @keydown="${this.handleKeyDownIcon}" part="delete-button" class="udex-list__delete-button" design="Tertiary" size="Small" accessible-name="${ifDefined(this.deleteButtonAccessibleName)}" toolTip="${ifDefined(this.deleteButtonAccessibleName)}" icon="${ifDefined(this.deleteIcon)}"></${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button @click="${this.handleDeleteClick}" @keydown="${this.handleKeyDownIcon}" part="delete-button" class="udex-list__delete-button" design="Tertiary" size="Small" accessible-name="${ifDefined(this.deleteButtonAccessibleName)}" toolTip="${ifDefined(this.deleteButtonAccessibleName)}" icon="${ifDefined(this.deleteIcon)}"></udex-button>`;}
-function block16 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" role="${ifDefined(this.roleItem)}" class="${ifDefined(this.className)}"><div class="udex-list__content-wrap" _id="${ifDefined(this._id)}" aria-labelledby="${ifDefined(this._id)}-invisibleText">${ this.flag ? block17.call(this, context, tags, suffix) : undefined }${ this.typeNumber ? block18.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block19.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block20.call(this, context, tags, suffix) : undefined }${ this.image ? block21.call(this, context, tags, suffix) : undefined }<div class="udex-list__content" part="content">${ this.label ? block22.call(this, context, tags, suffix) : block24.call(this, context, tags, suffix) }</div><div class="hidden" id="${ifDefined(this._id)}-invisibleText">${ifDefined(this.accessibleName)}</div></div></li>`;}
+function block16 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li part="item" role="${ifDefined(this.roleItem)}" class="${ifDefined(this.className)}"><div class="udex-list__content-wrap" _id="${ifDefined(this._id)}" aria-labelledby="${ifDefined(this._id)}-invisibleText" aria-label="${ifDefined(this.accessibleListItemName)}">${ this.flag ? block17.call(this, context, tags, suffix) : undefined }${ this.typeNumber ? block18.call(this, context, tags, suffix) : undefined }${ this.typeCircle ? block19.call(this, context, tags, suffix) : undefined }${ this.typeIcon ? block20.call(this, context, tags, suffix) : undefined }${ this.image ? block21.call(this, context, tags, suffix) : undefined }<div class="udex-list__content" part="content">${ this.label ? block22.call(this, context, tags, suffix) : block24.call(this, context, tags, suffix) }</div><div class="hidden" id="${ifDefined(this._id)}-invisibleText">${ifDefined(this.accessibleListItemName)}</div></div></li>`;}
 function block17 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list__flag-wrap"><span class="udex-list__flag" style="background-position: ${ifDefined(this.flagPosition)}"></span></div>`;}
 function block18 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-list__number">${ifDefined(this.numberOfItem)}.</span>`;}
 function block19 (this: ListItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-list__circle">&#x2022;</span>`;}

package/src/generated/templates/ListTemplate.lit.ts

@@ -5,10 +5,10 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.modeSelected ? block1.call(this, context, tags, suffix) : undefined }${ this.modeSingleContent ? block3.call(this, context, tags, suffix) : undefined } `;}
-function block1 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list-root" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleItemPress)}" @keydown="${this.handleKeyDown}" style="height: ${ifDefined(this.holderHeight)}"><div class="udex-list__scroll-container"><span id="${ifDefined(this._id)}-mode-label" class="udex-list__hidden-text">${ifDefined(this.ariaLabelModeText)}</span>${ this.headerText ? block2.call(this, context, tags, suffix) : undefined }<ul id="udex-list" class="udex-list" role="${ifDefined(this.accessibleRole)}" aria-labelledby="${ifDefined(this.ariaLabelledBy)}" aria-label="${ifDefined(this.accessibleName)}"><slot></slot></ul></div></div>`;}
-function block2 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<header class="udex-list__header-text" part="header">${ifDefined(this.headerText)}</header>`;}
+function block1 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-list-root" @ui5-item-press="${ifDefined(this.handleItemPress)}" @ui5-header-press="${ifDefined(this.handleItemPress)}" @keydown="${this.handleKeyDown}" style="height: ${ifDefined(this.holderHeight)}"><div class="udex-list__scroll-container">${ this.headerText ? block2.call(this, context, tags, suffix) : undefined }<span id="${ifDefined(this._id)}-mode-label" class="udex-list__hidden-text">${ifDefined(this.ariaLabelModeText)}</span><ul id="udex-list" class="udex-list" role="${ifDefined(this.accessibleRole)}" aria-labelledby="${ifDefined(this.ariaLabelledBy)}" aria-label="${ifDefined(this.accessibleName)}"><slot></slot></ul></div></div>`;}
+function block2 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<header class="udex-list__header-text" part="header" id="${ifDefined(this._id)}-mode-label">${ifDefined(this.headerText)}</header>`;}
 function block3 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.headerText ? block4.call(this, context, tags, suffix) : undefined }<ul id="udex-list" class="udex-list" role="${ifDefined(this.accessibleRole)}" aria-labelledby="${ifDefined(this.ariaLabelledBy)}" aria-label="${ifDefined(this.accessibleName)}"><slot></slot></ul>`;}
-function block4 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<header class="udex-list__header-text" part="header">${ifDefined(this.headerText)}</header>`;}
+function block4 (this: List, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<header class="udex-list__header-text" part="header" id="${ifDefined(this._id)}-mode-label">${ifDefined(this.headerText)}</header>`;}
 
 
 export default block0;

package/src/generated/templates/MastheadItemTemplate.lit.ts

@@ -4,22 +4,23 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type MastheadItem from "../../MastheadItem.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.hasHref ? block1.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) } `;}
-function block1 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a id="${ifDefined(this._id)}" class="${ifDefined(this.additionalClass)}" tabindex="0" role="${ifDefined(this.accessibleRoleName)}" target="${ifDefined(this.target)}" href="${ifDefined(this.href)}" aria-labelledby="${ifDefined(this.ariaLabelledBy)}" aria-label="${ifDefined(this.accessibleLabel)}" @click="${this.handleNavigationItemClick}">${ this.icon ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</a>`;}
-function block2 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<span class="udex-masthead-item__icon-container"><${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`<span class="udex-masthead-item__icon-container"><ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></ui5-icon></span>`;}
-function block3 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block4.call(this, context, tags, suffix) : undefined }</span>`;}
-function block4 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></ui5-icon>`;}
-function block5 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isProfileBtn ? block6.call(this, context, tags, suffix) : block11.call(this, context, tags, suffix) }`;}
-function block6 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}" role="combobox" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-labelledby="${ifDefined(this.ariaLabelledBy)}" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleNavigationItemClick}">${ this.icon ? block7.call(this, context, tags, suffix) : block8.call(this, context, tags, suffix) }</span>${ this.showDropdown ? block10.call(this, context, tags, suffix) : undefined }`;}
-function block7 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<span class="udex-masthead-item__icon-container"><${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`<span class="udex-masthead-item__icon-container"><ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></ui5-icon></span>`;}
-function block8 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block9.call(this, context, tags, suffix) : undefined }</span>`;}
-function block9 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></ui5-icon>`;}
-function block10 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
-function block11 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button role="${ifDefined(this.accessibleRoleName)}" id="${ifDefined(this._id)}" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-labelledby="${ifDefined(this.ariaLabelledBy)}" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleNavigationItemClick}">${ this.icon ? block12.call(this, context, tags, suffix) : block13.call(this, context, tags, suffix) }</button>${ this.showDropdown ? block15.call(this, context, tags, suffix) : undefined }`;}
-function block12 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<span class="udex-masthead-item__icon-container"><${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`<span class="udex-masthead-item__icon-container"><ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></ui5-icon></span>`;}
-function block13 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block14.call(this, context, tags, suffix) : undefined }</span>`;}
-function block14 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></ui5-icon>`;}
-function block15 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
+function block0 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.hasHref ? block1.call(this, context, tags, suffix) : block6.call(this, context, tags, suffix) } `;}
+function block1 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isTargetBlank ? block2.call(this, context, tags, suffix) : undefined }<a id="${ifDefined(this._id)}" class="${ifDefined(this.additionalClass)}" tabindex="0" role="${ifDefined(this.accessibleRoleName)}" target="${ifDefined(this.target)}" href="${ifDefined(this.href)}" aria-label="${ifDefined(this.accessibleLabel)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" @click="${this.handleNavigationItemClick}">${ this.icon ? block3.call(this, context, tags, suffix) : block4.call(this, context, tags, suffix) }</a>`;}
+function block2 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="new-win-desc" class="udex-masthead-hidden-text">${ifDefined(this.openInNewWindowText)}</span>`;}
+function block3 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<span class="udex-masthead-item__icon-container"><${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`<span class="udex-masthead-item__icon-container"><ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></ui5-icon></span>`;}
+function block4 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block5.call(this, context, tags, suffix) : undefined }</span>`;}
+function block5 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></ui5-icon>`;}
+function block6 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isProfileBtn ? block7.call(this, context, tags, suffix) : block12.call(this, context, tags, suffix) }`;}
+function block7 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}" role="combobox" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" aria-controls="${ifDefined(this._id)}_dropdown" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleNavigationItemClick}">${ this.icon ? block8.call(this, context, tags, suffix) : block9.call(this, context, tags, suffix) }</span>${ this.showDropdown ? block11.call(this, context, tags, suffix) : undefined }`;}
+function block8 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<span class="udex-masthead-item__icon-container"><${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`<span class="udex-masthead-item__icon-container"><ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></ui5-icon></span>`;}
+function block9 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block10.call(this, context, tags, suffix) : undefined }</span>`;}
+function block10 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></ui5-icon>`;}
+function block11 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div id="${ifDefined(this._id)}_dropdown" class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}" @focusout="${this.handleFocusout}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
+function block12 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button role="${ifDefined(this.accessibleRoleName)}" id="${ifDefined(this._id)}" class="udex-masthead-item__btn ${ifDefined(this.additionalClass)}" aria-expanded="${ifDefined(this.selected)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" aria-haspopup="${ifDefined(this.hasDropdownSlot)}" aria-label="${ifDefined(this.accessibleLabel)}" @keydown="${this.handleKeyDown}" @click="${this.handleNavigationItemClick}">${ this.icon ? block13.call(this, context, tags, suffix) : block14.call(this, context, tags, suffix) }</button>${ this.showDropdown ? block16.call(this, context, tags, suffix) : undefined }`;}
+function block13 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<span class="udex-masthead-item__icon-container"><${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`<span class="udex-masthead-item__icon-container"><ui5-icon class="udex-masthead-item__icon" name="${ifDefined(this.icon)}" show-tooltip="${ifDefined(this.iconAlt)}" accessible-name="${ifDefined(this.iconAlt)}"></ui5-icon></span>`;}
+function block14 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-item__text"><slot></slot>${ this.hasArrowDown ? block15.call(this, context, tags, suffix) : undefined }</span>`;}
+function block15 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-item__dropdown-icon" name="slim-arrow-down"></ui5-icon>`;}
+function block16 (this: MastheadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div id="${ifDefined(this._id)}_dropdown" class="udex-masthead-item__dropdown" @keydown="${this.handleKeyDown}" @focusout="${this.handleFocusout}"><div class="udex-masthead-item__dropdown-holder"><slot name="dropdown"></slot></div></div>`;}
 
 
 export default block0;

package/src/generated/templates/MastheadMenuItemTemplate.lit.ts

@@ -4,20 +4,21 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type MastheadMenuItem from "../../MastheadMenuItem.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isActive ? block1.call(this, context, tags, suffix) : block7.call(this, context, tags, suffix) } `;}
-function block1 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" role="${ifDefined(this.accessibleRole)}" href="${ifDefined(this.url)}" part="menu-item-link" target="${ifDefined(this.target)}">${ this.iconStart ? block2.call(this, context, tags, suffix) : undefined }<span class=${ifDefined(this.labelClass)}>${ this.externalLink ? block3.call(this, context, tags, suffix) : block4.call(this, context, tags, suffix) }</span>${ this.iconEnd ? block5.call(this, context, tags, suffix) : undefined }</a>${ this.badge ? block6.call(this, context, tags, suffix) : undefined }`;}
-function block2 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></ui5-icon>`;}
-function block3 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`${ifDefined(this.leadingWordsOfLabel)}<span class="udex-masthead-menu-item__text-with-icon">${ifDefined(this.lastWordOfLabel)}<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-action" name="action"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`${ifDefined(this.leadingWordsOfLabel)}<span class="udex-masthead-menu-item__text-with-icon">${ifDefined(this.lastWordOfLabel)}<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-action" name="action"></ui5-icon></span>`;}
-function block4 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span>${ifDefined(this.label)}</span>`;}
-function block5 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></ui5-icon>`;}
-function block6 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-badge", tags, suffix)} class="udex-masthead-menu-item-badge" type="Number" number-design="Blue" size="Small">${ifDefined(this.badge)}</${scopeTag("udex-badge", tags, suffix)}>` : html`<udex-badge class="udex-masthead-menu-item-badge" type="Number" number-design="Blue" size="Small">${ifDefined(this.badge)}</udex-badge>`;}
-function block7 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isButtonType ? block8.call(this, context, tags, suffix) : block11.call(this, context, tags, suffix) }`;}
-function block8 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button _id="${ifDefined(this.id)}" class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" part="menu-item-button" role="${ifDefined(this.accessibleRole)}">${ this.iconStart ? block9.call(this, context, tags, suffix) : undefined }${ifDefined(this.label)}${ this.iconEnd ? block10.call(this, context, tags, suffix) : undefined }</button>`;}
-function block9 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></ui5-icon>`;}
-function block10 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></ui5-icon>`;}
-function block11 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" part="menu-item">${ this.iconStart ? block12.call(this, context, tags, suffix) : undefined }${ifDefined(this.label)}${ this.iconEnd ? block13.call(this, context, tags, suffix) : undefined }</span>`;}
-function block12 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></ui5-icon>`;}
-function block13 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></ui5-icon>`;}
+function block0 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isActive ? block1.call(this, context, tags, suffix) : block8.call(this, context, tags, suffix) } `;}
+function block1 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.externalLink ? block2.call(this, context, tags, suffix) : undefined }<a class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" aria-describedby="${ifDefined(this.ariaDescribedby)}" role="${ifDefined(this.accessibleRoleText)}" href="${ifDefined(this.url)}" part="menu-item-link" target="${ifDefined(this.target)}">${ this.iconStart ? block3.call(this, context, tags, suffix) : undefined }<span class=${ifDefined(this.labelClass)}>${ this.externalLink ? block4.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) }</span>${ this.iconEnd ? block6.call(this, context, tags, suffix) : undefined }</a>${ this.badge ? block7.call(this, context, tags, suffix) : undefined }`;}
+function block2 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="new-win-desc" class="udex-masthead-hidden-text">${ifDefined(this.openInNewWindowText)}</span>`;}
+function block3 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></ui5-icon>`;}
+function block4 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`${ifDefined(this.leadingWordsOfLabel)}<span class="udex-masthead-menu-item__text-with-icon">${ifDefined(this.lastWordOfLabel)}<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-action" name="action"></${scopeTag("ui5-icon", tags, suffix)}></span>` : html`${ifDefined(this.leadingWordsOfLabel)}<span class="udex-masthead-menu-item__text-with-icon">${ifDefined(this.lastWordOfLabel)}<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-action" name="action"></ui5-icon></span>`;}
+function block5 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span>${ifDefined(this.label)}</span>`;}
+function block6 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></ui5-icon>`;}
+function block7 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-badge", tags, suffix)} class="udex-masthead-menu-item-badge" type="Number" number-design="Blue" size="Small">${ifDefined(this.badge)}</${scopeTag("udex-badge", tags, suffix)}>` : html`<udex-badge class="udex-masthead-menu-item-badge" type="Number" number-design="Blue" size="Small">${ifDefined(this.badge)}</udex-badge>`;}
+function block8 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.isButtonType ? block9.call(this, context, tags, suffix) : block12.call(this, context, tags, suffix) }`;}
+function block9 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<button _id="${ifDefined(this.id)}" class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" part="menu-item-button" role="button">${ this.iconStart ? block10.call(this, context, tags, suffix) : undefined }${ifDefined(this.label)}${ this.iconEnd ? block11.call(this, context, tags, suffix) : undefined }</button>`;}
+function block10 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></ui5-icon>`;}
+function block11 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></ui5-icon>`;}
+function block12 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-masthead-menu-item ${ifDefined(this.rootClass)}" part="menu-item">${ this.iconStart ? block13.call(this, context, tags, suffix) : undefined }${ifDefined(this.label)}${ this.iconEnd ? block14.call(this, context, tags, suffix) : undefined }</span>`;}
+function block13 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-left" name="slim-arrow-left" part="left"></ui5-icon>`;}
+function block14 (this: MastheadMenuItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-masthead-menu-item__icon udex-masthead-menu-item_icon-right" name="slim-arrow-right" part="right"></ui5-icon>`;}
 
 
 export default block0;

package/src/generated/templates/MastheadMenuTemplate.lit.ts

@@ -7,9 +7,9 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 function block0 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-menu ${ifDefined(this.oneRowClass)}" part="menu" @keydown="${this.handleKeyDown}">${ this.menuTitle ? block1.call(this, context, tags, suffix) : undefined }${ repeat(this.itemsList, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }</div> `;}
 function block1 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-menu__title">${ifDefined(this.menuTitle)}</div>`;}
 function block2 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-masthead-menu__row">${ repeat(item.subMenuLinkItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div>`;}
-function block3 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-masthead-menu__column" part="column">${ item.category ? block4.call(this, context, tags, suffix, item, index) : undefined }<ul class="udex-masthead-menu__list" role="menu">${ repeat(item.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
-function block4 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<div class="udex-masthead-menu__header"><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></div>` : html`<div class="udex-masthead-menu__header"><udex-masthead-menu-item @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></udex-masthead-menu-item></div>`;}
-function block5 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li role="none"><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" role="menuitem"></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li role="none"><udex-masthead-menu-item @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}" role="menuitem"></udex-masthead-menu-item></li>`;}
+function block3 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-masthead-menu__column" part="column">${ item.category ? block4.call(this, context, tags, suffix, item, index) : undefined }<ul class="udex-masthead-menu__list" aria-labelledby="category-${ifDefined(item.categoryId)}">${ repeat(item.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</ul></div>`;}
+function block4 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<div class="udex-masthead-menu__header"><${scopeTag("udex-masthead-menu-item", tags, suffix)} id="category-${ifDefined(item.categoryId)}" @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></${scopeTag("udex-masthead-menu-item", tags, suffix)}></div>` : html`<div class="udex-masthead-menu__header"><udex-masthead-menu-item id="category-${ifDefined(item.categoryId)}" @click="${this.handleMenuItemClick}" url="${ifDefined(item.url)}" label="${ifDefined(item.category)}" ?icon-end="${item.url}" type="Heading" has-border></udex-masthead-menu-item></div>`;}
+function block5 (this: MastheadMenu, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<li><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}"></${scopeTag("udex-masthead-menu-item", tags, suffix)}></li>` : html`<li><udex-masthead-menu-item @click="${this.handleMenuItemClick}" badge="${ifDefined(item.badge)}" ?external-link="${item.externalLink}" url="${ifDefined(item.url)}" label="${ifDefined(item.title)}"></udex-masthead-menu-item></li>`;}
 
 
 export default block0;

package/src/generated/templates/MastheadProfileMenuTemplate.lit.ts

@@ -5,7 +5,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-profile-menu"><div class="udex-masthead-profile-menu__header">${ this.userData ? block1.call(this, context, tags, suffix) : undefined }</div>${ this.messageAvailable ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-masthead-profile-menu__links"><${scopeTag("udex-masthead-menu", tags, suffix)} sub-items='${ifDefined(this.linksList)}' @ui5-menu-item-click=${ifDefined(this.handleProfileMenuItemClick)}></${scopeTag("udex-masthead-menu", tags, suffix)}>${ this.logoutLink ? block4.call(this, context, tags, suffix) : undefined }</div></div>` : html`<div class="udex-masthead-profile-menu"><div class="udex-masthead-profile-menu__header">${ this.userData ? block1.call(this, context, tags, suffix) : undefined }</div>${ this.messageAvailable ? block3.call(this, context, tags, suffix) : undefined }<div class="udex-masthead-profile-menu__links"><udex-masthead-menu sub-items='${ifDefined(this.linksList)}' @ui5-menu-item-click=${ifDefined(this.handleProfileMenuItemClick)}></udex-masthead-menu>${ this.logoutLink ? block4.call(this, context, tags, suffix) : undefined }</div></div>`;}
-function block1 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-avatar", tags, suffix)} size="L" initials="${ifDefined(this.userData.avatarInitials)}">${ this.userData.avatarUrl ? block2.call(this, context, tags, suffix) : undefined }</${scopeTag("udex-avatar", tags, suffix)}><div><p class="udex-profile-menu__account-name">${ifDefined(this.userData.name)}</p><p class="udex-profile-menu__account-email">${ifDefined(this.userData.email)}</p></div>` : html`<udex-avatar size="L" initials="${ifDefined(this.userData.avatarInitials)}">${ this.userData.avatarUrl ? block2.call(this, context, tags, suffix) : undefined }</udex-avatar><div><p class="udex-profile-menu__account-name">${ifDefined(this.userData.name)}</p><p class="udex-profile-menu__account-email">${ifDefined(this.userData.email)}</p></div>`;}
+function block1 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-avatar", tags, suffix)} aria-hidden="true" size="L" initials="${ifDefined(this.userData.avatarInitials)}">${ this.userData.avatarUrl ? block2.call(this, context, tags, suffix) : undefined }</${scopeTag("udex-avatar", tags, suffix)}><div><p class="udex-profile-menu__account-name">${ifDefined(this.userData.name)}</p><p class="udex-profile-menu__account-email">${ifDefined(this.userData.email)}</p></div>` : html`<udex-avatar aria-hidden="true" size="L" initials="${ifDefined(this.userData.avatarInitials)}">${ this.userData.avatarUrl ? block2.call(this, context, tags, suffix) : undefined }</udex-avatar><div><p class="udex-profile-menu__account-name">${ifDefined(this.userData.name)}</p><p class="udex-profile-menu__account-email">${ifDefined(this.userData.email)}</p></div>`;}
 function block2 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<img src="${ifDefined(this.userData.avatarUrl)}" alt="avatar"/>`;}
 function block3 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-profile-menu__message"><slot name="message"></slot></div>`;}
 function block4 (this: MastheadProfileMenu, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-profile-menu__actions"><${scopeTag("udex-masthead-menu-item", tags, suffix)} @click=${this.handleUserLogoutItemClick} url="${ifDefined(this.logoutUrl)}" label="${ifDefined(this.logoutText)}"></${scopeTag("udex-masthead-menu-item", tags, suffix)}></div>` : html`<div class="udex-masthead-profile-menu__actions"><udex-masthead-menu-item @click=${this.handleUserLogoutItemClick} url="${ifDefined(this.logoutUrl)}" label="${ifDefined(this.logoutText)}"></udex-masthead-menu-item></div>`;}

package/src/generated/templates/MastheadShellTemplate.lit.ts

@@ -11,16 +11,17 @@ function block3 (this: MastheadShell, context: UI5Element, tags: string[], suffi
 function block4 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.siteLabelUrl ? block5.call(this, context, tags, suffix) : block6.call(this, context, tags, suffix) }`;}
 function block5 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<a @click="${this.handleSiteLabelClick}" role="link" href="${ifDefined(this.siteLabelUrl)}" target="_self" aria-label="${ifDefined(this.siteLabelAriaLabel)}" class="udex-masthead-shell__site-label udex-masthead-shell__site-label--link">${ifDefined(this.siteLabel)}</a>`;}
 function block6 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__site-label">${ifDefined(this.siteLabel)}</div>`;}
-function block7 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__main-menu" data-menubar-item-expanded="true" role="menubar">${ repeat(this.menuItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block8.call(this, context, tags, suffix, item, index)) }</div>`;}
-function block8 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div @ui5-item-click="${ifDefined(this.setSelectedItem)}" class="udex-masthead-shell__item" role="menuitem"><slot name="${ifDefined(item._individualSlot)}"></slot></div>`;}
+function block7 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<nav aria-label="${ifDefined(this.mainNavigationAriaLabel)}"><ul class="udex-masthead-shell__main-menu" aria-label="${ifDefined(this.mainNavigationAriaLabel)}">${ repeat(this.menuItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block8.call(this, context, tags, suffix, item, index)) }</ul></nav>`;}
+function block8 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li class="udex-masthead-shell__item" @ui5-item-click="${ifDefined(this.setSelectedItem)}"><slot name="${ifDefined(item._individualSlot)}"></slot></li>`;}
 function block9 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__search-container"><slot name="search"></slot></div>${ this._isSearchOpened ? block10.call(this, context, tags, suffix) : undefined }`;}
-function block10 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__btn-holder"><${scopeTag("udex-control-button", tags, suffix)} class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click=${this.hideSearch}></${scopeTag("udex-control-button", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__btn-holder"><udex-control-button class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click=${this.hideSearch}></udex-control-button></div>`;}
-function block11 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__right-menu">${ this.hasExploreSAP ? block12.call(this, context, tags, suffix) : undefined }${ this.hasSearch ? block13.call(this, context, tags, suffix) : undefined }${ this.hasCart ? block14.call(this, context, tags, suffix) : undefined }${ this.hasProfile ? block15.call(this, context, tags, suffix) : undefined }${ this.hasMobileMenuButtons ? block16.call(this, context, tags, suffix) : undefined }</div>`;}
-function block12 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__explore" @ui5-item-click="${ifDefined(this.setSelectedItem)}"><slot name="exploreSAP"></slot></div>`;}
-function block13 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__search-icon"><${scopeTag("udex-masthead-item", tags, suffix)} class="udex-masthead-shell__search-btn" icon="search" @click="${this.handleSearchClick}" accessible-name="search"></${scopeTag("udex-masthead-item", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__search-icon"><udex-masthead-item class="udex-masthead-shell__search-btn" icon="search" @click="${this.handleSearchClick}" accessible-name="search"></udex-masthead-item></div>`;}
-function block14 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__cart" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleCartClick}"><slot name="cart"></slot></div>`;}
-function block15 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__profile" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleProfileClick}"><slot name="profile"></slot></div>`;}
-function block16 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-item", tags, suffix)} @ui5-item-click="${ifDefined(this.handleMobileMenuClick)}" class="udex-masthead-shell__menu-btn" accessible-role="button" icon="menu2" part="menu-open-btn" accessible-name="menu"><slot slot="dropdown" name="mobileMenu"></slot></${scopeTag("udex-masthead-item", tags, suffix)}><${scopeTag("udex-masthead-item", tags, suffix)} @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.handleMobileCloseClick)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="close" part="menu-close-btn" hide-active-border></${scopeTag("udex-masthead-item", tags, suffix)}>` : html`<udex-masthead-item @ui5-item-click="${ifDefined(this.handleMobileMenuClick)}" class="udex-masthead-shell__menu-btn" accessible-role="button" icon="menu2" part="menu-open-btn" accessible-name="menu"><slot slot="dropdown" name="mobileMenu"></slot></udex-masthead-item><udex-masthead-item @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.handleMobileCloseClick)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="close" part="menu-close-btn" hide-active-border></udex-masthead-item>`;}
+function block10 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__btn-holder"><${scopeTag("udex-control-button", tags, suffix)} class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" tooltip="${ifDefined(this.closeButtonAccessibleName)}" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click=${this.hideSearch}></${scopeTag("udex-control-button", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__btn-holder"><udex-control-button class="udex-masthead-shell__close-search-btn" size="Small" icon="decline" tooltip="${ifDefined(this.closeButtonAccessibleName)}" accessible-name="${ifDefined(this.closeButtonAccessibleName)}" @click=${this.hideSearch}></udex-control-button></div>`;}
+function block11 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__right-menu">${ this.hasMobileMenuButtons ? block12.call(this, context, tags, suffix) : undefined }${ this.hasExploreSAP ? block13.call(this, context, tags, suffix) : undefined }${ this.hasSearch ? block14.call(this, context, tags, suffix) : undefined }${ this.hasCart ? block15.call(this, context, tags, suffix) : undefined }${ this.hasProfile ? block16.call(this, context, tags, suffix) : undefined }${ this.hasMobileMenuButtons ? block17.call(this, context, tags, suffix) : undefined }</div>`;}
+function block12 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-item", tags, suffix)} @ui5-item-click="${ifDefined(this.handleMobileMenuClick)}" class="udex-masthead-shell__menu-btn" accessible-role="button" icon="menu2" part="menu-open-btn" accessible-name="menu"><slot slot="dropdown" name="mobileMenu"></slot></${scopeTag("udex-masthead-item", tags, suffix)}>` : html`<udex-masthead-item @ui5-item-click="${ifDefined(this.handleMobileMenuClick)}" class="udex-masthead-shell__menu-btn" accessible-role="button" icon="menu2" part="menu-open-btn" accessible-name="menu"><slot slot="dropdown" name="mobileMenu"></slot></udex-masthead-item>`;}
+function block13 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__explore" @ui5-item-click="${ifDefined(this.setSelectedItem)}"><slot name="exploreSAP"></slot></div>`;}
+function block14 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-masthead-shell__search-icon"><${scopeTag("udex-masthead-item", tags, suffix)} class="udex-masthead-shell__search-btn" icon="search" @click="${this.handleSearchClick}" accessible-name="search"></${scopeTag("udex-masthead-item", tags, suffix)}></div>` : html`<div class="udex-masthead-shell__search-icon"><udex-masthead-item class="udex-masthead-shell__search-btn" icon="search" @click="${this.handleSearchClick}" accessible-name="search"></udex-masthead-item></div>`;}
+function block15 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__cart" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleCartClick}"><slot name="cart"></slot></div>`;}
+function block16 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-masthead-shell__profile" @ui5-item-click="${ifDefined(this.setSelectedItem)}" @click="${this.handleProfileClick}"><slot name="profile"></slot></div>`;}
+function block17 (this: MastheadShell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-masthead-item", tags, suffix)} @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.handleMobileCloseClick)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="close" part="menu-close-btn" hide-active-border></${scopeTag("udex-masthead-item", tags, suffix)}>` : html`<udex-masthead-item @keydown="${this.handleEnterAndSpaceOnCloseBtn}" @ui5-item-click="${ifDefined(this.handleMobileCloseClick)}" class="udex-masthead-shell__close-btn" accessible-role="button" icon="decline" accessible-name="close" part="menu-close-btn" hide-active-border></udex-masthead-item>`;}
 
 
 export default block0;

package/src/generated/templates/PaginationTemplate.lit.ts

@@ -5,11 +5,11 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.pages ? block1.call(this, context, tags, suffix) : undefined } `;}
-function block1 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<nav aria-label="pagination" class="${ifDefined(this.paginationClass)}"><ul class="udex-pagination__list">${ this.absoluteNavigation ? block2.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--prev udex-pagination__item"><${scopeTag("udex-button", tags, suffix)} ?disabled="${this.prevButtonDisbled}" accessible-name="${ifDefined(this.previousPageAccessibleName)}" tooltip="${ifDefined(this.previousBtnTooltip)}" size="Large" icon="navigation-left-arrow" design="Tertiary" @click="${this.setPrevPage}"></${scopeTag("udex-button", tags, suffix)}></li>${ this.typeFull ? block3.call(this, context, tags, suffix) : undefined }${ this.typeShort ? block5.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--next udex-pagination__item"><${scopeTag("udex-button", tags, suffix)} ?disabled="${this.nextButtonDisbled}" tooltip="${ifDefined(this.nextBtnTooltip)}" accessible-name="${ifDefined(this.nextPageAccessibleName)}" size="Large" icon="navigation-right-arrow" design="Tertiary" @click="${this.setNextPage}"></${scopeTag("udex-button", tags, suffix)}></li>${ this.absoluteNavigation ? block6.call(this, context, tags, suffix) : undefined }</ul></nav>` : html`<nav aria-label="pagination" class="${ifDefined(this.paginationClass)}"><ul class="udex-pagination__list">${ this.absoluteNavigation ? block2.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--prev udex-pagination__item"><udex-button ?disabled="${this.prevButtonDisbled}" accessible-name="${ifDefined(this.previousPageAccessibleName)}" tooltip="${ifDefined(this.previousBtnTooltip)}" size="Large" icon="navigation-left-arrow" design="Tertiary" @click="${this.setPrevPage}"></udex-button></li>${ this.typeFull ? block3.call(this, context, tags, suffix) : undefined }${ this.typeShort ? block5.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--next udex-pagination__item"><udex-button ?disabled="${this.nextButtonDisbled}" tooltip="${ifDefined(this.nextBtnTooltip)}" accessible-name="${ifDefined(this.nextPageAccessibleName)}" size="Large" icon="navigation-right-arrow" design="Tertiary" @click="${this.setNextPage}"></udex-button></li>${ this.absoluteNavigation ? block6.call(this, context, tags, suffix) : undefined }</ul></nav>`;}
+function block1 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<nav aria-label="pagination" class="${ifDefined(this.paginationClass)}"><ul class="udex-pagination__list" role="navigation" aria-label="${ifDefined(this.paginationAccessibleName)}">${ this.absoluteNavigation ? block2.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--prev udex-pagination__item"><${scopeTag("udex-button", tags, suffix)} ?disabled="${this.prevButtonDisbled}" accessible-name="${ifDefined(this.previousPageAccessibleName)}" tooltip="${ifDefined(this.previousBtnTooltip)}" size="Large" icon="navigation-left-arrow" design="Tertiary" @click="${this.setPrevPage}"></${scopeTag("udex-button", tags, suffix)}></li>${ this.typeFull ? block3.call(this, context, tags, suffix) : undefined }${ this.typeShort ? block5.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--next udex-pagination__item"><${scopeTag("udex-button", tags, suffix)} ?disabled="${this.nextButtonDisbled}" tooltip="${ifDefined(this.nextBtnTooltip)}" accessible-name="${ifDefined(this.nextPageAccessibleName)}" size="Large" icon="navigation-right-arrow" design="Tertiary" @click="${this.setNextPage}"></${scopeTag("udex-button", tags, suffix)}></li>${ this.absoluteNavigation ? block6.call(this, context, tags, suffix) : undefined }</ul></nav>` : html`<nav aria-label="pagination" class="${ifDefined(this.paginationClass)}"><ul class="udex-pagination__list" role="navigation" aria-label="${ifDefined(this.paginationAccessibleName)}">${ this.absoluteNavigation ? block2.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--prev udex-pagination__item"><udex-button ?disabled="${this.prevButtonDisbled}" accessible-name="${ifDefined(this.previousPageAccessibleName)}" tooltip="${ifDefined(this.previousBtnTooltip)}" size="Large" icon="navigation-left-arrow" design="Tertiary" @click="${this.setPrevPage}"></udex-button></li>${ this.typeFull ? block3.call(this, context, tags, suffix) : undefined }${ this.typeShort ? block5.call(this, context, tags, suffix) : undefined }<li class="udex-pagination__item--next udex-pagination__item"><udex-button ?disabled="${this.nextButtonDisbled}" tooltip="${ifDefined(this.nextBtnTooltip)}" accessible-name="${ifDefined(this.nextPageAccessibleName)}" size="Large" icon="navigation-right-arrow" design="Tertiary" @click="${this.setNextPage}"></udex-button></li>${ this.absoluteNavigation ? block6.call(this, context, tags, suffix) : undefined }</ul></nav>`;}
 function block2 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-pagination__item--first udex-pagination__item"><${scopeTag("udex-button", tags, suffix)} ?disabled="${this.prevButtonDisbled}" accessible-name="${ifDefined(this.firstPageAccessibleName)}" size="Large" icon="close-command-field" design="Tertiary" @click="${this.setFirstPage}"></${scopeTag("udex-button", tags, suffix)}></li>` : html`<li class="udex-pagination__item--first udex-pagination__item"><udex-button ?disabled="${this.prevButtonDisbled}" accessible-name="${ifDefined(this.firstPageAccessibleName)}" size="Large" icon="close-command-field" design="Tertiary" @click="${this.setFirstPage}"></udex-button></li>`;}
 function block3 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ repeat(this.pagination, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }`;}
-function block4 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li class="udex-pagination__item"><a class="udex-pagination__page" href="#" aria-label="${ifDefined(item.accessibleName)}" @click="${this.onPageClick}" ?active="${item.active}" index="${ifDefined(item.index)}"><span class="udex-pagination__page--value">${ifDefined(item.value)}</span></a></li>`;}
-function block5 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li class="udex-pagination__item udex-pagination__item--short" tabindex="0" aria-label="${ifDefined(this.paginationShortAccessibleName)}"><span class="udex-pagination__item--short-value">${ifDefined(this.shortTextStart)}</span><span class="udex-pagination__item--short-separator">${ifDefined(this.shortTextSeparator)}</span><span class="udex-pagination__item--short-value">${ifDefined(this.shortTextEnd)}</span></li>`;}
+function block4 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<li class="udex-pagination__item"><a class="udex-pagination__page" href="#" aria-label="${ifDefined(item.accessibleName)}" @click="${this.onPageClick}" ?active="${item.active}" aria-current="${ifDefined(item.ariaCurrent)}" index="${ifDefined(item.index)}"><span class="udex-pagination__page--value">${ifDefined(item.value)}</span></a></li>`;}
+function block5 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<li class="udex-pagination__item udex-pagination__item--short" tabindex="-1" aria-label="${ifDefined(this.paginationShortAccessibleName)}"><span class="udex-pagination__item--short-value">${ifDefined(this.shortTextStart)}</span><span class="udex-pagination__item--short-separator">${ifDefined(this.shortTextSeparator)}</span><span class="udex-pagination__item--short-value">${ifDefined(this.shortTextEnd)}</span></li>`;}
 function block6 (this: Pagination, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<li class="udex-pagination__item--last udex-pagination__item"><${scopeTag("udex-button", tags, suffix)} ?disabled="${this.nextButtonDisbled}" accessible-name="${ifDefined(this.lastPageAccessibleName)}" size="Large" icon="open-command-field" design="Tertiary" @click="${this.setLastPage}"></${scopeTag("udex-button", tags, suffix)}></li>` : html`<li class="udex-pagination__item--last udex-pagination__item"><udex-button ?disabled="${this.nextButtonDisbled}" accessible-name="${ifDefined(this.lastPageAccessibleName)}" size="Large" icon="open-command-field" design="Tertiary" @click="${this.setLastPage}"></udex-button></li>`;}
 
 

package/src/generated/templates/PhoneNumberFieldTemplate.lit.ts

@@ -9,7 +9,7 @@ function block1 (this: PhoneNumberField, context: UI5Element, tags: string[], su
 function block2 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined) { return html` * `;}
 function block3 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} id="${ifDefined(item.iso)}" ?selected="${item.selected}"><div class="udex-phone-number-field__dropdown-list-item"><div class="udex-phone-number-field__flag" style="background-position-x: ${ifDefined(item.flagX)}; background-position-y: ${ifDefined(item.flagY)}"></div><span class="udex-phone-number-field__country-name">${ifDefined(item.countryName)}${ item.localName ? block4.call(this, context, tags, suffix, item, index) : undefined }${ifDefined(item.phonePrefix)}</span></div></${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item id="${ifDefined(item.iso)}" ?selected="${item.selected}"><div class="udex-phone-number-field__dropdown-list-item"><div class="udex-phone-number-field__flag" style="background-position-x: ${ifDefined(item.flagX)}; background-position-y: ${ifDefined(item.flagY)}"></div><span class="udex-phone-number-field__country-name">${ifDefined(item.countryName)}${ item.localName ? block4.call(this, context, tags, suffix, item, index) : undefined }${ifDefined(item.phonePrefix)}</span></div></udex-list-item>`;}
 function block4 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html` (${ifDefined(item.localName)}) `;}
-function block5 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-phone-number-field__open-button" size="Large" icon="${ifDefined(this.buttonIcon)}" design="Tertiary" icon-end ?disabled="${this.isButtonDisabled}" aria-haspopup="true" accessible-name-ref="${ifDefined(this._id)}-countrySelectorAriaLabel ${ifDefined(this.ariaDescribedById)}" aria-label="${ifDefined(this.countrySelectorAriaLabel)}" aria-expanded="${ifDefined(this._dropdownExpanded)}" aria-controls="${ifDefined(this._id)}_dropdown-menu" role="combobox" @click="${this.onClick}"><div class="udex-phone-number-field__open-button-text">${ifDefined(this.selectedCountryName)}${ifDefined(this.selectedPhonePrefix)}</div><div class="udex-phone-number-field__button-content"><div class="udex-phone-number-field__flag" style="${styleMap(this.selectedFlagBackgroundPosition)}"></div></div></${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-phone-number-field__open-button" size="Large" icon="${ifDefined(this.buttonIcon)}" design="Tertiary" icon-end ?disabled="${this.isButtonDisabled}" aria-haspopup="true" accessible-name-ref="${ifDefined(this._id)}-countrySelectorAriaLabel ${ifDefined(this.ariaDescribedById)}" aria-label="${ifDefined(this.countrySelectorAriaLabel)}" aria-expanded="${ifDefined(this._dropdownExpanded)}" aria-controls="${ifDefined(this._id)}_dropdown-menu" role="combobox" @click="${this.onClick}"><div class="udex-phone-number-field__open-button-text">${ifDefined(this.selectedCountryName)}${ifDefined(this.selectedPhonePrefix)}</div><div class="udex-phone-number-field__button-content"><div class="udex-phone-number-field__flag" style="${styleMap(this.selectedFlagBackgroundPosition)}"></div></div></udex-button>`;}
+function block5 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-phone-number-field__open-button" size="Large" icon="${ifDefined(this.buttonIcon)}" design="Tertiary" icon-end ?disabled="${this.isButtonDisabled}" aria-haspopup="true" accessible-name-ref="${ifDefined(this._id)}-countrySelectorAriaLabel ${ifDefined(this.ariaDescribedById)}" aria-label="${ifDefined(this.countrySelectorAriaLabel)}" aria-expanded="${ifDefined(this._dropdownExpanded)}" aria-controls="${ifDefined(this._id)}_dropdown-menu" role="combobox" @click="${this.onClick}"><div class="udex-phone-number-field__open-button-text">${ifDefined(this.selectedCountryName)}${ifDefined(this.selectedPhonePrefix)}</div><div class="udex-phone-number-field__button-content"><img class="udex-phone-number-field__flag" aria-label=${ifDefined(this.selectedCountryName)} style="${styleMap(this.selectedFlagBackgroundPosition)}"></div></${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-phone-number-field__open-button" size="Large" icon="${ifDefined(this.buttonIcon)}" design="Tertiary" icon-end ?disabled="${this.isButtonDisabled}" aria-haspopup="true" accessible-name-ref="${ifDefined(this._id)}-countrySelectorAriaLabel ${ifDefined(this.ariaDescribedById)}" aria-label="${ifDefined(this.countrySelectorAriaLabel)}" aria-expanded="${ifDefined(this._dropdownExpanded)}" aria-controls="${ifDefined(this._id)}_dropdown-menu" role="combobox" @click="${this.onClick}"><div class="udex-phone-number-field__open-button-text">${ifDefined(this.selectedCountryName)}${ifDefined(this.selectedPhonePrefix)}</div><div class="udex-phone-number-field__button-content"><img class="udex-phone-number-field__flag" aria-label=${ifDefined(this.selectedCountryName)} style="${styleMap(this.selectedFlagBackgroundPosition)}"></div></udex-button>`;}
 function block6 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-status-message", tags, suffix)} ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.fieldState)}"></${scopeTag("udex-status-message", tags, suffix)}>` : html`<udex-status-message ?disabled="${this.disabled}" supporting-text="${ifDefined(this.supportingText)}" value-state="${ifDefined(this.fieldState)}"></udex-status-message>`;}
 function block7 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-supportingTextDesc" class="hidden-text">${ifDefined(this.supportingText)}</span>`;}
 function block8 (this: PhoneNumberField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-valueStateDesc" class="hidden-text">${ifDefined(this.valueStateText)}</span>`;}

package/src/generated/templates/SearchSuggestionsTemplate.lit.ts

@@ -4,7 +4,7 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 	import type SearchSuggestions from "../../SearchSuggestions.js";
 	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="${ifDefined(this.getSuggestionsPopoverId)}" aria-orientation="vertical" accessible-role="Dialog" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="${ifDefined(this.getSuggestionsPopoverId)}" aria-orientation="vertical" accessible-role="Dialog" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</ui5-popover>`;}
+function block0 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="${ifDefined(this.getSuggestionsPopoverId)}" aria-orientation="vertical" accessible-role="Dialog" @keydown="${this.handleKeyPressSuggestionList}" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover class="udex-search-suggestions__root ${ifDefined(this.homeSearchPopoverClass)}" hide-arrow _disable-initial-focus placement-type="Bottom" horizontal-align="Right" style="${styleMap(this.popoverStyles)}" id="${ifDefined(this.getSuggestionsPopoverId)}" aria-orientation="vertical" accessible-role="Dialog" @keydown="${this.handleKeyPressSuggestionList}" accessible-name="${ifDefined(this.suggestionsAccessibleName)}">${ this.showNoResultMessage ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }</ui5-popover>`;}
 function block1 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="udex-search-suggestions__message">${ifDefined(this.noResultMessage)}</span>`;}
 function block2 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div role="tree">${ this.isShowSuggestedList ? block3.call(this, context, tags, suffix) : undefined }${ this.isShowRecommendedList ? block6.call(this, context, tags, suffix) : undefined }</div>`;}
 function block3 (this: SearchSuggestions, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-search-suggestions__block" role="treeitem">${ this.suggestedHeading ? block4.call(this, context, tags, suffix) : undefined }<div class="udex-search-suggestions__list" role="listbox" aria-labelledby="suggested-heading" tabindex="0" @keydown="${this.handleKeyDownPopover}">${ repeat(this.suggestedList, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block5.call(this, context, tags, suffix, item, index)) }</div></div>`;}

package/src/generated/templates/SearchableListBaseTemplate.lit.ts

@@ -7,12 +7,12 @@ import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 function block0 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.showSearch ? block1.call(this, context, tags, suffix) : undefined }${ this.isListEmpty ? block2.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) } `;}
 function block1 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-search", tags, suffix)} slot="header" mode="Standard" class="udex-filter-menu__search" label="${ifDefined(this.searchPlaceholder)}" label-animation-disabled non-interactive-submit-button show-submit-button></${scopeTag("udex-search", tags, suffix)}>` : html`<udex-search slot="header" mode="Standard" class="udex-filter-menu__search" label="${ifDefined(this.searchPlaceholder)}" label-animation-disabled non-interactive-submit-button show-submit-button></udex-search>`;}
 function block2 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-no-result"><span>${ifDefined(this.getNoResultText)}&lrm;</span></div>`;}
-function block3 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-list", tags, suffix)} id="udex-list" class="udex-filter-menu__list" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list", tags, suffix)}>` : html`<udex-list id="udex-list" class="udex-filter-menu__list" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }</udex-list>`;}
+function block3 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-list", tags, suffix)} id="udex-list" role="${ifDefined(this.roleForGroupList)}" accessible-role="${ifDefined(this.accessibleRoleForList)}" class="udex-filter-menu__list" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list", tags, suffix)}>` : html`<udex-list id="udex-list" role="${ifDefined(this.roleForGroupList)}" accessible-role="${ifDefined(this.accessibleRoleForList)}" class="udex-filter-menu__list" ?controlled="${this.isControlled}" mode="${ifDefined(this.mode)}">${ repeat(this._filteredItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block4.call(this, context, tags, suffix, item, index)) }</udex-list>`;}
 function block4 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.isGroup ? block5.call(this, context, tags, suffix, item, index) : block10.call(this, context, tags, suffix, item, index) }`;}
 function block5 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.item.isSelectAllHeader ? block6.call(this, context, tags, suffix, item, index) : block8.call(this, context, tags, suffix, item, index) }`;}
 function block6 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-select-all", tags, suffix)} _additional-class-name="${ifDefined(this.additionalClassName)}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" ?controlled="${item.item.controlled}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block7.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-select-all", tags, suffix)}>` : html`<udex-list-select-all _additional-class-name="${ifDefined(this.additionalClassName)}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" ?controlled="${item.item.controlled}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block7.call(this, context, tags, suffix, item, index)) }</udex-list-select-all>`;}
 function block7 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</udex-list-item>`;}
-function block8 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-group-header", tags, suffix)} role="list" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-group-header", tags, suffix)}>` : html`<udex-list-group-header role="list" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</udex-list-group-header>`;}
+function block8 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-group-header", tags, suffix)} role="group" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</${scopeTag("udex-list-group-header", tags, suffix)}>` : html`<udex-list-group-header role="group" _additional-class-name="udex-searchable-list__header" class="${ifDefined(this.groupClassName)}" ?non-interactive="${item.item.nonInteractive}" data-token-id="${ifDefined(item.item._id)}" label="${ifDefined(item.item.label)}" supporting-text="${ifDefined(item.item.supportingText)}" ?controlled="${item.item.controlled}" ?disabled="${item.item.disabled}" ?selected="${item.item.selected}" ?indeterminate="${item.item.indeterminate}">${ repeat(item.groupItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block9.call(this, context, tags, suffix, item, index)) }</udex-list-group-header>`;}
 function block9 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} role="none" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item role="none" data-token-id="${ifDefined(item._id)}" ?controlled="${item.controlled}" mode="${ifDefined(item.mode)}" supporting-text="${ifDefined(item.supportingText)}" ?divider="${item.divider}" ?disabled="${item.disabled}" ?selected="${item.selected}" label="${ifDefined(item.label)}">${unsafeHTML(item.innerHTML)}</udex-list-item>`;}
 function block10 (this: SearchableListBase, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-list-item", tags, suffix)} data-token-id="${ifDefined(item.item._id)}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?controlled="${item.controlled}" ?divider="${item.divider}" ?selected="${item.item.selected}" label="${ifDefined(item.item.label)}">${unsafeHTML(item.item.innerHTML)}</${scopeTag("udex-list-item", tags, suffix)}>` : html`<udex-list-item data-token-id="${ifDefined(item.item._id)}" supporting-text="${ifDefined(item.item.supportingText)}" ?disabled="${item.item.disabled}" ?controlled="${item.controlled}" ?divider="${item.divider}" ?selected="${item.item.selected}" label="${ifDefined(item.item.label)}">${unsafeHTML(item.item.innerHTML)}</udex-list-item>`;}