@sapudex/web-components 0.226.0 → 2.1.0

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

@@ -1,11 +1,12 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	type TabNavigationPopover = any;
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+type TabNavigationPopover = any;
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: TabNavigationPopover, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} id="${ifDefined(this._id)}-overflow-popover" horizontal-align="Right" placement-type="Bottom" aria-orientation="vertical" @ui5-after-open="${ifDefined(this.onFocusFirstItemPopover)}" hide-arrow _hideHeader><div class="tab-navigation-popover" @click="${this.handleOverflowItemClick}" @keydown="${this.handleFocusPopover}" role="tablist">${ repeat(this._overflowItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover id="${ifDefined(this._id)}-overflow-popover" horizontal-align="Right" placement-type="Bottom" aria-orientation="vertical" @ui5-after-open="${ifDefined(this.onFocusFirstItemPopover)}" hide-arrow _hideHeader><div class="tab-navigation-popover" @click="${this.handleOverflowItemClick}" @keydown="${this.handleFocusPopover}" role="tablist">${ repeat(this._overflowItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></ui5-popover>`;}
+function block0 (this: TabNavigationPopover, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} id="${ifDefined(this._id)}-overflow-popover" horizontal-align="End" placement="Bottom" aria-orientation="vertical" @ui5-open="${ifDefined(this.onFocusFirstItemPopover)}" hide-arrow _hideHeader><div class="tab-navigation-popover" @click="${this.handleOverflowItemClick}" @keydown="${this.handleFocusPopover}" role="tablist">${ repeat(this._overflowItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover id="${ifDefined(this._id)}-overflow-popover" horizontal-align="End" placement="Bottom" aria-orientation="vertical" @ui5-open="${ifDefined(this.onFocusFirstItemPopover)}" hide-arrow _hideHeader><div class="tab-navigation-popover" @click="${this.handleOverflowItemClick}" @keydown="${this.handleFocusPopover}" role="tablist">${ repeat(this._overflowItems, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div></ui5-popover>`;}
 function block1 (this: TabNavigationPopover, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ifDefined(item.tabInOverflow)}`;}
 
-
-export default block0;
+function template(this: TabNavigationPopover) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,14 +1,16 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TabNavigation from "../../TabNavigation.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TabNavigation from "../../TabNavigation.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-tab-navigation__root"><div id="${ifDefined(this._id)}-header" class="udex-tab-navigation__header" part="tab-navigation-header" @keydown="${this.handleKeyDown}"><div id="${ifDefined(this._id)}-header-tabs" class="udex-tab-navigation__header-tabs" role="tablist" aria-labelledby="tablist-${ifDefined(this._id)}" part="tab-navigation-header-tabs" @click="${this.onTabClick}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div><button class="udex-tab-navigation__button-more" @click="${this.handleMoreButton}" @keydown="${this.handleFocusMoreButton}" tabindex="0" aria-haspopup="menu" aria-expanded="${ifDefined(this._isExpanded)}" tooltip="${ifDefined(this.moreButtonText)}" hidden>${ifDefined(this.moreButtonText)}<${scopeTag("ui5-icon", tags, suffix)} class="udex-tab-navigation__button-more-icon" name="navigation-down-arrow"></${scopeTag("ui5-icon", tags, suffix)}></button>${ifDefined(this.tabNavigationPopover)}</div><div class="udex-tab-navigation__content" id="udex-${ifDefined(this.__id)}-content" part="tab-navigation-content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }</div></div>` : html`<div class="udex-tab-navigation__root"><div id="${ifDefined(this._id)}-header" class="udex-tab-navigation__header" part="tab-navigation-header" @keydown="${this.handleKeyDown}"><div id="${ifDefined(this._id)}-header-tabs" class="udex-tab-navigation__header-tabs" role="tablist" aria-labelledby="tablist-${ifDefined(this._id)}" part="tab-navigation-header-tabs" @click="${this.onTabClick}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div><button class="udex-tab-navigation__button-more" @click="${this.handleMoreButton}" @keydown="${this.handleFocusMoreButton}" tabindex="0" aria-haspopup="menu" aria-expanded="${ifDefined(this._isExpanded)}" tooltip="${ifDefined(this.moreButtonText)}" hidden>${ifDefined(this.moreButtonText)}<ui5-icon class="udex-tab-navigation__button-more-icon" name="navigation-down-arrow"></ui5-icon></button>${ifDefined(this.tabNavigationPopover)}</div><div class="udex-tab-navigation__content" id="udex-${ifDefined(this.__id)}-content" part="tab-navigation-content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block2.call(this, context, tags, suffix, item, index)) }</div></div>`;}
+function block0 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-tab-navigation__root"><div id="${ifDefined(this._id)}-header" class="udex-tab-navigation__header" part="tab-navigation-header" @keydown="${this.handleKeyDown}"><div id="${ifDefined(this._id)}-header-tabs" class="udex-tab-navigation__header-tabs" role="tablist" aria-labelledby="tablist-${ifDefined(this._id)}" part="tab-navigation-header-tabs" @click="${this.onTabClick}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div><button class="udex-tab-navigation__button-more" @click="${this.handleMoreButton}" @keydown="${this.handleFocusMoreButton}" tabindex="0" aria-haspopup="menu" aria-expanded="${ifDefined(this._isExpanded)}" tooltip="${ifDefined(this.moreButtonText)}" hidden>${ifDefined(this.moreButtonText)}<${scopeTag("ui5-icon", tags, suffix)} class="udex-tab-navigation__button-more-icon" name="navigation-down-arrow" mode="Decorative"></${scopeTag("ui5-icon", tags, suffix)}></button>${ this._overflowItems.length ? block2.call(this, context, tags, suffix) : undefined }</div><div class="udex-tab-navigation__content" id="udex-${ifDefined(this.__id)}-content" part="tab-navigation-content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div></div>` : html`<div class="udex-tab-navigation__root"><div id="${ifDefined(this._id)}-header" class="udex-tab-navigation__header" part="tab-navigation-header" @keydown="${this.handleKeyDown}"><div id="${ifDefined(this._id)}-header-tabs" class="udex-tab-navigation__header-tabs" role="tablist" aria-labelledby="tablist-${ifDefined(this._id)}" part="tab-navigation-header-tabs" @click="${this.onTabClick}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</div><button class="udex-tab-navigation__button-more" @click="${this.handleMoreButton}" @keydown="${this.handleFocusMoreButton}" tabindex="0" aria-haspopup="menu" aria-expanded="${ifDefined(this._isExpanded)}" tooltip="${ifDefined(this.moreButtonText)}" hidden>${ifDefined(this.moreButtonText)}<ui5-icon class="udex-tab-navigation__button-more-icon" name="navigation-down-arrow" mode="Decorative"></ui5-icon></button>${ this._overflowItems.length ? block2.call(this, context, tags, suffix) : undefined }</div><div class="udex-tab-navigation__content" id="udex-${ifDefined(this.__id)}-content" part="tab-navigation-content">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div></div>`;}
 function block1 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ifDefined(item.tabNavigation)}`;}
-function block2 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.selected ? block3.call(this, context, tags, suffix, item, index) : block4.call(this, context, tags, suffix, item, index) }`;}
-function block3 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-tab-navigation__content-item" id="${ifDefined(item._contentId)}" aria-labelledby="${ifDefined(item._id)}"><slot name="${ifDefined(item._slotName)}"></slot></div>`;}
-function block4 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-tab-navigation__content-item" id="${ifDefined(item._contentId)}"><slot name="${ifDefined(item._slotName)}"></slot></div>`;}
+function block2 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ifDefined(this.tabNavigationPopover)}`;}
+function block3 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`${ item.selected ? block4.call(this, context, tags, suffix, item, index) : block5.call(this, context, tags, suffix, item, index) }`;}
+function block4 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-tab-navigation__content-item" id="${ifDefined(item._contentId)}" aria-labelledby="${ifDefined(item._id)}"><slot name="${ifDefined(item._slotName)}"></slot></div>`;}
+function block5 (this: TabNavigation, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<div class="udex-tab-navigation__content-item" id="${ifDefined(item._contentId)}"><slot name="${ifDefined(item._slotName)}"></slot></div>`;}
 
-
-export default block0;
+function template(this: TabNavigation) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,10 +1,11 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Tab from "../../Tab.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Tab from "../../Tab.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Tab, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot></slot>`;}
 
-
-export default block0;
+function template(this: Tab) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,11 +1,12 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TableCell from "../../TableCell.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TableCell from "../../TableCell.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: TableCell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.icon ? block1.call(this, context, tags, suffix) : undefined }<slot></slot>`;}
 function block1 (this: TableCell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-table-cell__icon" name="${ifDefined(this.icon)}"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-table-cell__icon" name="${ifDefined(this.icon)}"></ui5-icon>`;}
 
-
-export default block0;
+function template(this: TableCell) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,12 +1,13 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TableGroupRow from "../../TableGroupRow.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TableGroupRow from "../../TableGroupRow.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: TableGroupRow, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.collapsible ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }<div class="udex-table-grow-rows" @keydown="${this.handleEscapeKey}"><slot></slot></div>`;}
 function block1 (this: TableGroupRow, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<button id="udex-table-group-opener" class="udex-table-grow-btn" aria-expanded="${ifDefined(this.expanded)}" @click="${this.toggleExpanded}"><span class="udex-table-grow"><${scopeTag("ui5-icon", tags, suffix)} class="udex-table-grow__icon" name="slim-arrow-right"></${scopeTag("ui5-icon", tags, suffix)}>${ifDefined(this.groupTitle)}</span></button>` : html`<button id="udex-table-group-opener" class="udex-table-grow-btn" aria-expanded="${ifDefined(this.expanded)}" @click="${this.toggleExpanded}"><span class="udex-table-grow"><ui5-icon class="udex-table-grow__icon" name="slim-arrow-right"></ui5-icon>${ifDefined(this.groupTitle)}</span></button>`;}
 function block2 (this: TableGroupRow, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-table-grow-btn"><span class="udex-table-grow">${ifDefined(this.groupTitle)}</span></div>`;}
 
-
-export default block0;
+function template(this: TableGroupRow) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,8 +1,9 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TableHeaderCell from "../../TableHeaderCell.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TableHeaderCell from "../../TableHeaderCell.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: TableHeaderCell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this._hasIcons ? block1.call(this, context, tags, suffix) : block4.call(this, context, tags, suffix) } `;}
 function block1 (this: TableHeaderCell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-table-header-cell-wrap">${ this.iconStart ? block2.call(this, context, tags, suffix) : undefined }<slot></slot>${ this.iconEnd ? block3.call(this, context, tags, suffix) : undefined }</div>`;}
@@ -10,5 +11,5 @@ function block2 (this: TableHeaderCell, context: UI5Element, tags: string[], suf
 function block3 (this: TableHeaderCell, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-table-header-cell-wrap__icon" name="${ifDefined(this.iconEnd)}"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-table-header-cell-wrap__icon" name="${ifDefined(this.iconEnd)}"></ui5-icon>`;}
 function block4 (this: TableHeaderCell, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot></slot>`;}
 
-
-export default block0;
+function template(this: TableHeaderCell) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,11 +1,12 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TableHeaderRow from "../../TableHeaderRow.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TableHeaderRow from "../../TableHeaderRow.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: TableHeaderRow, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ repeat(this.cells, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) } `;}
 function block1 (this: TableHeaderRow, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<slot name="${ifDefined(item._individualSlot)}"></slot>`;}
 
-
-export default block0;
+function template(this: TableHeaderRow) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,11 +1,12 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TableRow from "../../TableRow.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TableRow from "../../TableRow.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: TableRow, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ repeat(this.cells, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) } `;}
 function block1 (this: TableRow, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return html`<slot name="${ifDefined(item._individualSlot)}"></slot>`;}
 
-
-export default block0;
+function template(this: TableRow) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,8 +1,9 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Table from "../../Table.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Table from "../../Table.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Table, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this._hasToolbar ? block1.call(this, context, tags, suffix) : undefined }<div id="table" class="udex-table" role="grid" aria-label="${ifDefined(this.accessibleName)}" @scroll="${this._onScroll}" @keydown="${this._handleKeyDown}" style="${styleMap(this._styles.table)}"><div class="udex-table__header-holder"><slot name="headerRow"></slot></div><slot></slot>${ !this.rows.length ? block2.call(this, context, tags, suffix) : undefined }${ this.loading ? block5.call(this, context, tags, suffix) : undefined }</div>${ this.footnotes.length ? block6.call(this, context, tags, suffix) : undefined } `;}
 function block1 (this: Table, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-table-toolbar"><span class="udex-table-toolbar__title">${ifDefined(this.heading)}</span><div class="udex-table-toolbar__actions"><slot name="actions"></slot></div></div>`;}
@@ -12,5 +13,5 @@ function block4 (this: Table, context: UI5Element, tags: string[], suffix: strin
 function block5 (this: Table, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-busy-indicator", tags, suffix)} class="udex-table__loading" delay="${ifDefined(this.loadingDelay)}" data-sap-focus-ref active></${scopeTag("ui5-busy-indicator", tags, suffix)}>` : html`<ui5-busy-indicator class="udex-table__loading" delay="${ifDefined(this.loadingDelay)}" data-sap-focus-ref active></ui5-busy-indicator>`;}
 function block6 (this: Table, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-table-footnotes"><slot name="footnotes"></slot></div>`;}
 
-
-export default block0;
+function template(this: Table) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,13 +1,14 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TagGroup from "../../TagGroup.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TagGroup from "../../TagGroup.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: TagGroup, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div id="${ifDefined(this._id)}-tag-group" @ui5-selectionChange="${ifDefined(this.tagClickHandler)}" role="group"><${scopeTag("ui5-tokenizer", tags, suffix)} part="tokenizer" show-more prevent-popover-open ?disabled="${this.disabled}" id="${ifDefined(this._id)}-tag-group-tokenizer" class="udex-tag-group__tokenizer" @ui5-show-more-items-press="${ifDefined(this.showMoreItems)}" ?expanded="${this.tokenizerExpanded}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</${scopeTag("ui5-tokenizer", tags, suffix)}>${ this._isHiddenTags ? block2.call(this, context, tags, suffix) : undefined }</div> ` : html`<div id="${ifDefined(this._id)}-tag-group" @ui5-selectionChange="${ifDefined(this.tagClickHandler)}" role="group"><ui5-tokenizer part="tokenizer" show-more prevent-popover-open ?disabled="${this.disabled}" id="${ifDefined(this._id)}-tag-group-tokenizer" class="udex-tag-group__tokenizer" @ui5-show-more-items-press="${ifDefined(this.showMoreItems)}" ?expanded="${this.tokenizerExpanded}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ui5-tokenizer>${ this._isHiddenTags ? block2.call(this, context, tags, suffix) : undefined }</div> `;}
-function block1 (this: TagGroup, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-tag", tags, suffix)} role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></${scopeTag("udex-tag", tags, suffix)}>` : html`<udex-tag role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></udex-tag>`;}
+function block0 (this: TagGroup, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div id="${ifDefined(this._id)}-tag-group" class="udex-tag-group" role="group"><${scopeTag("ui5-tokenizer", tags, suffix)} part="tokenizer" show-more prevent-popover-open ?disabled="${this.disabled}" id="${ifDefined(this._id)}-tag-group-tokenizer" class="udex-tag-group__tokenizer" @ui5-show-more-items-press="${ifDefined(this.showMoreItems)}" ?expanded="${this.tokenizerExpanded}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</${scopeTag("ui5-tokenizer", tags, suffix)}>${ this._isHiddenTags ? block2.call(this, context, tags, suffix) : undefined }</div> ` : html`<div id="${ifDefined(this._id)}-tag-group" class="udex-tag-group" role="group"><ui5-tokenizer part="tokenizer" show-more prevent-popover-open ?disabled="${this.disabled}" id="${ifDefined(this._id)}-tag-group-tokenizer" class="udex-tag-group__tokenizer" @ui5-show-more-items-press="${ifDefined(this.showMoreItems)}" ?expanded="${this.tokenizerExpanded}">${ repeat(this.items, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block1.call(this, context, tags, suffix, item, index)) }</ui5-tokenizer>${ this._isHiddenTags ? block2.call(this, context, tags, suffix) : undefined }</div> `;}
+function block1 (this: TagGroup, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-tag", tags, suffix)} role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-selectionChange="${ifDefined(this.handleTagClick)}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></${scopeTag("udex-tag", tags, suffix)}>` : html`<udex-tag role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-selectionChange="${ifDefined(this.handleTagClick)}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></udex-tag>`;}
 function block2 (this: TagGroup, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-tooltip", tags, suffix)} @keydown="${this.handleShowMoreButtonKeydown}" id="${ifDefined(this._id)}-tag-group-tooltip" placement="${ifDefined(this.tooltipPlacement)}"><div role="group" class="udex-tag-group-tooltip__content">${ repeat(this.hiddenTags, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div></${scopeTag("udex-tooltip", tags, suffix)}>` : html`<udex-tooltip @keydown="${this.handleShowMoreButtonKeydown}" id="${ifDefined(this._id)}-tag-group-tooltip" placement="${ifDefined(this.tooltipPlacement)}"><div role="group" class="udex-tag-group-tooltip__content">${ repeat(this.hiddenTags, (item, index) => (item as typeof item & {_id?: any})._id || index, (item, index: number) => block3.call(this, context, tags, suffix, item, index)) }</div></udex-tooltip>`;}
-function block3 (this: TagGroup, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-tag", tags, suffix)} role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></${scopeTag("udex-tag", tags, suffix)}>` : html`<udex-tag role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></udex-tag>`;}
+function block3 (this: TagGroup, context: UI5Element, tags: string[], suffix: string | undefined, item: any, index: number) { return suffix ? html`<${scopeTag("udex-tag", tags, suffix)} role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-selectionChange="${ifDefined(this.handleTagClick)}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></${scopeTag("udex-tag", tags, suffix)}>` : html`<udex-tag role="${ifDefined(this.tagRole)}" accessible-role="option" class="udex-tag-group__tag" data-id="${ifDefined(item.id)}" part="token-${index}" ?read-only="${this.isReadOrDisplayOnly}" tabindex="${ifDefined(this.tagTabIndex)}" id="${ifDefined(item._id)}-tag-group-tag" text="${ifDefined(item.text)}" icon="${ifDefined(item.icon)}" href="${ifDefined(item.href)}" design="${ifDefined(item.design)}" size="${ifDefined(item.size)}" icon-placement="${ifDefined(item.iconPlacement)}" accessible-name="${ifDefined(item.accessibleName)}" ?non-selectable="${item.nonSelectable}" ?data-overflows="${item.overflows}" @keydown="${this.handleTagKeyDown}" @ui5-selectionChange="${ifDefined(this.handleTagClick)}" @ui5-iconClick="${ifDefined(this.tagIconClickHandler)}"></udex-tag>`;}
 
-
-export default block0;
+function template(this: TagGroup) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,8 +1,9 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Tag from "../../Tag.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Tag from "../../Tag.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Tag, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.readOnly ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) } `;}
 function block1 (this: Tag, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="${ifDefined(this.tagClasses)}"><span class="udex-tag__text">${unsafeHTML(this.text)}</span></div>`;}
@@ -18,5 +19,5 @@ function block10 (this: Tag, context: UI5Element, tags: string[], suffix: string
 function block11 (this: Tag, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-tag__icon udex-tag__icon--start" name="${ifDefined(this.icon)}" @click="${this.iconClickHandler}"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-tag__icon udex-tag__icon--start" name="${ifDefined(this.icon)}" @click="${this.iconClickHandler}"></ui5-icon>`;}
 function block12 (this: Tag, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-tag__icon udex-tag__icon--end" name="${ifDefined(this.icon)}" @click="${this.iconClickHandler}"></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-tag__icon udex-tag__icon--end" name="${ifDefined(this.icon)}" @click="${this.iconClickHandler}"></ui5-icon>`;}
 
-
-export default block0;
+function template(this: Tag) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,16 +1,17 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TextArea from "../../TextArea.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TextArea from "../../TextArea.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-textarea"><div class="udex-textarea__wrapper">${ this.label ? block1.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }<textarea id="textarea" class="udex-textarea__field" part="textarea" .value="${ifDefined(this.value)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" ?disabled="${this.disabled}" ?readonly="${this.isInputReadonly}" ?required="${this.required}" ?aria-label="${this.accessibleName}" ?aria-describedby="${this.ariaDescribedBy}" ?aria-labelledby="${this.accessibleNameRef}" aria-required="${ifDefined(this.required)}" aria-readonly="${ifDefined(this.isInputReadonly)}" aria-invalid="${ifDefined(this.ariaInvalid)}" @input="${this.handleInput}" @focus="${this.handleFocus}" @click="${this.handleClick}" @blur="${this.handleBlur}" @change="${this.handleChange}"></textarea></div>${ this._supportingText ? block4.call(this, context, tags, suffix) : undefined }${ this.hasValueState ? block5.call(this, context, tags, suffix) : undefined }${ this.readonly ? block6.call(this, context, tags, suffix) : undefined }</div>`;}
+function block0 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-textarea"><div class="udex-textarea__wrapper">${ this.label ? block1.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }<textarea id="textarea" class="udex-textarea__field" part="textarea" .value="${ifDefined(this.value)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" ?disabled="${this.disabled}" ?readonly="${this.isInputReadonly}" ?required="${this.required}" aria-label="${ifDefined(this.accessibleName)}" aria-describedby="${ifDefined(this.ariaDescribedBy)}" aria-labelledby="${ifDefined(this.accessibleNameRef)}" aria-required="${ifDefined(this.required)}" aria-readonly="${ifDefined(this.isInputReadonly)}" aria-invalid="${ifDefined(this.ariaInvalid)}" @input="${this.handleInput}" @focus="${this.handleFocus}" @click="${this.handleClick}" @blur="${this.handleBlur}" @change="${this.handleChange}"></textarea></div>${ this._supportingText ? block4.call(this, context, tags, suffix) : undefined }${ this.hasValueState ? block5.call(this, context, tags, suffix) : undefined }${ this.readonly ? block6.call(this, context, tags, suffix) : undefined }</div>`;}
 function block1 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<label class="${ifDefined(this.labelClasses)}" for="textarea" part="label">${ifDefined(this.label)}${ this.required ? block2.call(this, context, tags, suffix) : undefined }</label>`;}
 function block2 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return html` * `;}
 function block3 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<label for="textarea" class="hidden-label">${ifDefined(this.textHiddenLabel)}</label>`;}
-function block4 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-status-message", tags, suffix)} supporting-text-alignment="Right" ?disabled="${this.disabled}" supporting-text="${ifDefined(this._supportingText)}" value-state="${ifDefined(this.fieldState)}"></${scopeTag("udex-status-message", tags, suffix)}><span id="${ifDefined(this._id)}-supportingTextDesc" class="hidden-text">${ifDefined(this._supportingText)}</span>` : html`<udex-status-message supporting-text-alignment="Right" ?disabled="${this.disabled}" supporting-text="${ifDefined(this._supportingText)}" value-state="${ifDefined(this.fieldState)}"></udex-status-message><span id="${ifDefined(this._id)}-supportingTextDesc" class="hidden-text">${ifDefined(this._supportingText)}</span>`;}
+function block4 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-status-message", tags, suffix)} supporting-text-alignment="Right" ?disabled="${this.disabled}" supporting-text="${ifDefined(this._supportingText)}" value-state="${ifDefined(this.valueState)}"></${scopeTag("udex-status-message", tags, suffix)}><span id="${ifDefined(this._id)}-supportingTextDesc" class="hidden-text">${ifDefined(this._supportingText)}</span>` : html`<udex-status-message supporting-text-alignment="Right" ?disabled="${this.disabled}" supporting-text="${ifDefined(this._supportingText)}" value-state="${ifDefined(this.valueState)}"></udex-status-message><span id="${ifDefined(this._id)}-supportingTextDesc" class="hidden-text">${ifDefined(this._supportingText)}</span>`;}
 function block5 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-valueStateDesc" class="hidden-text">${ifDefined(this.ariaValueStateHiddenText)}</span>`;}
 function block6 (this: TextArea, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-readonlyDesc" class="hidden-text">${ifDefined(this.readOnlyText)}</span>`;}
 
-
-export default block0;
+function template(this: TextArea) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,10 +1,11 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TextField from "../../TextField.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TextField from "../../TextField.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-text-field__container">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__wrap"><input id="${ifDefined(this._id)}-input" class="udex-text-field__input" type="${ifDefined(this.type)}" .value="${ifDefined(this.value)}" @change="${this.handleChange}" @input="${this.handleInput}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${this.handleClick}" @keydown="${this.handleKeydown}" maxlength="${ifDefined(this.maxlength)}" autocomplete="${ifDefined(this.autocomplete)}" ?disabled="${this.disabled}" ?readonly="${this.isInputReadonly}" ?required="${this.required}" aria-required="${ifDefined(this.required)}" aria-readonly="${ifDefined(this.isInputReadonly)}" ?aria-disabled="${this.readonlyNotDisabled}" aria-invalid="${ifDefined(this.accInfo.ariaInvalid)}" aria-describedby="${ifDefined(this.accInfo.ariaDescribedBy)}" aria-haspopup="${ifDefined(this.accInfo.ariaHasPopup)}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-labelledby="${ifDefined(this.accInfo.ariaLabelledBy)}" role="${ifDefined(this.inputRole)}" part="textfield-input" min="${ifDefined(this.min)}" max="${ifDefined(this.max)}" step="${ifDefined(this.step)}" />${ this.icon ? block3.call(this, context, tags, suffix) : undefined }</div>${ this.supportingText ? block4.call(this, context, tags, suffix) : undefined }${ this.supportingText ? block5.call(this, context, tags, suffix) : undefined }${ this.hasValueState ? block6.call(this, context, tags, suffix) : undefined }${ this.readonly ? block7.call(this, context, tags, suffix) : undefined }</div>`;}
+function block0 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-text-field__container">${ this.label ? block1.call(this, context, tags, suffix) : undefined }<div class="udex-text-field__wrap"><input id="${ifDefined(this._id)}-input" class="udex-text-field__input" type="${ifDefined(this.type)}" .value="${ifDefined(this.value)}" @change="${this.handleChange}" @input="${this.handleInput}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" @click="${this.handleClick}" @keydown="${this.handleKeydown}" maxlength="${ifDefined(this.maxlength)}" ?disabled="${this.disabled}" ?readonly="${this.isInputReadonly}" ?required="${this.required}" aria-required="${ifDefined(this.required)}" aria-readonly="${ifDefined(this.isInputReadonly)}" ?aria-disabled="${this.readonlyNotDisabled}" aria-invalid="${ifDefined(this.accInfo.ariaInvalid)}" aria-describedby="${ifDefined(this.accInfo.ariaDescribedBy)}" aria-haspopup="${ifDefined(this.accInfo.ariaHasPopup)}" aria-label="${ifDefined(this.accInfo.ariaLabel)}" aria-labelledby="${ifDefined(this.accInfo.ariaLabelledBy)}" part="textfield-input" min="${ifDefined(this.min)}" max="${ifDefined(this.max)}" step="${ifDefined(this.step)}" />${ this.icon ? block3.call(this, context, tags, suffix) : undefined }</div>${ this.supportingText ? block4.call(this, context, tags, suffix) : undefined }${ this.supportingText ? block5.call(this, context, tags, suffix) : undefined }${ this.hasValueState ? block6.call(this, context, tags, suffix) : undefined }${ this.readonly ? block7.call(this, context, tags, suffix) : undefined }</div>`;}
 function block1 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<label for="${ifDefined(this._id)}-input" class="${ifDefined(this.labelClasses)}" part="label">${ifDefined(this.label)}${ this.required ? block2.call(this, context, tags, suffix) : undefined }</label>`;}
 function block2 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html` * `;}
 function block3 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-control-button", tags, suffix)} accessible-name="${ifDefined(this.accessibleIconName)}" tooltip="${ifDefined(this.showButtonTooltip)}" ?active="${this.active}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?non-interactive="${this.readonly}" design="${ifDefined(this.valueState)}" icon="${ifDefined(this.icon)}" @click="${this.handleIconClick}" part="textfield-control-btn" size="Large" class="udex-text-field_icon-container"></${scopeTag("udex-control-button", tags, suffix)}>` : html`<udex-control-button accessible-name="${ifDefined(this.accessibleIconName)}" tooltip="${ifDefined(this.showButtonTooltip)}" ?active="${this.active}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?non-interactive="${this.readonly}" design="${ifDefined(this.valueState)}" icon="${ifDefined(this.icon)}" @click="${this.handleIconClick}" part="textfield-control-btn" size="Large" class="udex-text-field_icon-container"></udex-control-button>`;}
@@ -13,5 +14,5 @@ function block5 (this: TextField, context: UI5Element, tags: string[], suffix: s
 function block6 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-valueStateDesc" class="hidden-text">${ifDefined(this.valueStateText)}</span>`;}
 function block7 (this: TextField, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span id="${ifDefined(this._id)}-stateReadOnlyDesc" class="hidden-text">${ifDefined(this.readOnlyStateText)}</span>`;}
 
-
-export default block0;
+function template(this: TextField) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,12 +1,13 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Tile from "../../Tile.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Tile from "../../Tile.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.interactive ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }`;}
 function block1 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="hidden" id="tileDescription">${ifDefined(this.accessibleName)}</span><a class="udex-tile" part="tile" href="${ifDefined(this.href)}" target="${ifDefined(this.target)}" role="link" aria-describedby="tileDescription" @keydown="${this._onkeydown}" @click="${this._onclick}"><slot></slot></a>`;}
 function block2 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-tile" part="tile" @click="${this._onclick}"><slot></slot></div>`;}
 
-
-export default block0;
+function template(this: Tile) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,13 +1,14 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Toast from "../../Toast.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Toast from "../../Toast.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: Toast, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.open ? block1.call(this, context, tags, suffix) : undefined } `;}
 function block1 (this: Toast, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="ui5-toast-root udex-toast" role="alert" tabindex="0">${ this.withIcon ? block2.call(this, context, tags, suffix) : undefined }<bdi><slot></slot></bdi>${ this.showCloseIcon ? block3.call(this, context, tags, suffix) : undefined }</div>`;}
 function block2 (this: Toast, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-icon", tags, suffix)} class="udex-toast__icon" name="${ifDefined(this.iconName)}" design="${ifDefined(this.iconDesign)}" ui5-icon=""></${scopeTag("ui5-icon", tags, suffix)}>` : html`<ui5-icon class="udex-toast__icon" name="${ifDefined(this.iconName)}" design="${ifDefined(this.iconDesign)}" ui5-icon=""></ui5-icon>`;}
 function block3 (this: Toast, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} class="udex-toast__button" size="Small" icon="decline" design="Tertiary" accessible-name="close" @click="${this.closeToast}"></${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button class="udex-toast__button" size="Small" icon="decline" design="Tertiary" accessible-name="close" @click="${this.closeToast}"></udex-button>`;}
 
-
-export default block0;
+function template(this: Toast) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,11 +1,12 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Tooltip from "../../Tooltip.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Tooltip from "../../Tooltip.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: Tooltip, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} class="udex-tooltip__pane" ?hide-arrow="${this.hideArrow}" placement-type="${ifDefined(this.placement)}" horizontal-align="${ifDefined(this.horizontalAlign)}" vertical-align="${ifDefined(this.verticalAlign)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-role="${ifDefined(this.accessibleRole)}" prevent-focus-restore>${ this.title ? block1.call(this, context, tags, suffix) : undefined }<slot></slot></${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover class="udex-tooltip__pane" ?hide-arrow="${this.hideArrow}" placement-type="${ifDefined(this.placement)}" horizontal-align="${ifDefined(this.horizontalAlign)}" vertical-align="${ifDefined(this.verticalAlign)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-role="${ifDefined(this.accessibleRole)}" prevent-focus-restore>${ this.title ? block1.call(this, context, tags, suffix) : undefined }<slot></slot></ui5-popover>`;}
+function block0 (this: Tooltip, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("ui5-popover", tags, suffix)} .opener="${ifDefined(this.opener)}" ?open="${this.open}" class="udex-tooltip__pane" ?hide-arrow="${this.hideArrow}" placement="${ifDefined(this.placement)}" horizontal-align="${ifDefined(this.horizontalAlign)}" vertical-align="${ifDefined(this.verticalAlign)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-role="${ifDefined(this.accessibleRole)}" ?prevent-initial-focus="${this.preventInitialFocus}" ?prevent-focus-restore="${this.preventFocusRestore}">${ this.title ? block1.call(this, context, tags, suffix) : undefined }<slot></slot></${scopeTag("ui5-popover", tags, suffix)}>` : html`<ui5-popover .opener="${ifDefined(this.opener)}" ?open="${this.open}" class="udex-tooltip__pane" ?hide-arrow="${this.hideArrow}" placement="${ifDefined(this.placement)}" horizontal-align="${ifDefined(this.horizontalAlign)}" vertical-align="${ifDefined(this.verticalAlign)}" accessible-name="${ifDefined(this.accessibleName)}" accessible-name-ref="${ifDefined(this.accessibleNameRef)}" accessible-role="${ifDefined(this.accessibleRole)}" ?prevent-initial-focus="${this.preventInitialFocus}" ?prevent-focus-restore="${this.preventFocusRestore}">${ this.title ? block1.call(this, context, tags, suffix) : undefined }<slot></slot></ui5-popover>`;}
 function block1 (this: Tooltip, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-tooltip-title">${ifDefined(this.title)}</div>`;}
 
-
-export default block0;
+function template(this: Tooltip) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,10 +1,11 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type TruncatedText from "../../TruncatedText.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type TruncatedText from "../../TruncatedText.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: TruncatedText, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<p class="udex-truncated-text"><span class="udex-truncated-text__visible-text">${ifDefined(this.visibleText)}</span><${scopeTag("udex-button", tags, suffix)} id="toggleButton" design="Tertiary" size="Small" class="udex-truncated-text__toggle-button" @click="${this.onToggleClick}">${ifDefined(this.buttonLabel)}</${scopeTag("udex-button", tags, suffix)}></p>` : html`<p class="udex-truncated-text"><span class="udex-truncated-text__visible-text">${ifDefined(this.visibleText)}</span><udex-button id="toggleButton" design="Tertiary" size="Small" class="udex-truncated-text__toggle-button" @click="${this.onToggleClick}">${ifDefined(this.buttonLabel)}</udex-button></p>`;}
 
-
-export default block0;
+function template(this: TruncatedText) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,8 +1,9 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type UploadItem from "../../UploadItem.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type UploadItem from "../../UploadItem.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
 function block0 (this: UploadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-upload-item__wrapper"><div class="udex-upload-item__info ${ifDefined(this.uploadItemClasses)}"><div>${ this.fileInteractive ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }<div class="${ifDefined(this.additionalInfoClasses)}"><slot></slot></div></div>${ this._breakpointM ? block3.call(this, context, tags, suffix) : undefined }</div><div class="udex-upload-item__progress-info-wrapper">${ this.showUploadProgress ? block4.call(this, context, tags, suffix) : undefined }${ this._breakpointL ? block5.call(this, context, tags, suffix) : undefined }</div></div>`;}
 function block1 (this: UploadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-link", tags, suffix)} href="${ifDefined(this.fileLink)}">${ifDefined(this.fileName)}</${scopeTag("udex-link", tags, suffix)}>` : html`<udex-link href="${ifDefined(this.fileLink)}">${ifDefined(this.fileName)}</udex-link>`;}
@@ -11,5 +12,5 @@ function block3 (this: UploadItem, context: UI5Element, tags: string[], suffix:
 function block4 (this: UploadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class="udex-upload-item__progress-info"><${scopeTag("udex-progress-bar", tags, suffix)} role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="${ifDefined(this.uploadPercentage)}" value="${ifDefined(this.uploadPercentage)}" value-state="${ifDefined(this.uploadProgressState)}" hide-value></${scopeTag("udex-progress-bar", tags, suffix)}><p class="udex-upload-item__progress-status">${ifDefined(this.uploadStatus)}</p></div>` : html`<div class="udex-upload-item__progress-info"><udex-progress-bar role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="${ifDefined(this.uploadPercentage)}" value="${ifDefined(this.uploadPercentage)}" value-state="${ifDefined(this.uploadProgressState)}" hide-value></udex-progress-bar><p class="udex-upload-item__progress-status">${ifDefined(this.uploadStatus)}</p></div>`;}
 function block5 (this: UploadItem, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<${scopeTag("udex-button", tags, suffix)} accessible-name="${ifDefined(this.removeButtonAccessibleName)}" @keydown="${this.handleButtonKeydown}" @click="${this.handleButtonClick}" size="${ifDefined(this._buttonSize)}" icon="decline" design="Tertiary"></${scopeTag("udex-button", tags, suffix)}>` : html`<udex-button accessible-name="${ifDefined(this.removeButtonAccessibleName)}" @keydown="${this.handleButtonKeydown}" @click="${this.handleButtonClick}" size="${ifDefined(this._buttonSize)}" icon="decline" design="Tertiary"></udex-button>`;}
 
-
-export default block0;
+function template(this: UploadItem) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

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

@@ -1,13 +1,14 @@
 /* eslint no-unused-vars: 0 */
 import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
 import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-	import type Upload from "../../Upload.js";
-	import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
+import type Upload from "../../Upload.js";
+import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
 	
-function block0 (this: Upload, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div @ui5-request-delete="${ifDefined(this.handleRemoveFile)}" class="udex-upload__wrapper">${ this.uploadTitle ? block1.call(this, context, tags, suffix) : undefined }${ this.additionalText ? block2.call(this, context, tags, suffix) : undefined }<div class="udex-upload__upload-button-container"><${scopeTag("ui5-file-uploader", tags, suffix)} id="fileUploader" hide-input accept="${ifDefined(this.accept)}" ?multiple="${this.multiple}" @change="${this.handleUploadFile}" @click="${this.handleUploadClick}"><${scopeTag("udex-button", tags, suffix)} design="Secondary" aria-label="${ifDefined(this.uploadButtonAriaLabel)}" size="${ifDefined(this._buttonSize)}">${ifDefined(this.uploadButtonText)}</${scopeTag("udex-button", tags, suffix)}></${scopeTag("ui5-file-uploader", tags, suffix)}>${ this._filesFull ? block3.call(this, context, tags, suffix) : undefined }</div><div class="udex-upload__files-wrapper"><${scopeTag("udex-list", tags, suffix)} aria-busy="${ifDefined(this.listBusy)}" mode="MultiSelect" @ui5-selection-change="${ifDefined(this.handleSelectionChange)}"><slot></slot></${scopeTag("udex-list", tags, suffix)}></div></div>` : html`<div @ui5-request-delete="${ifDefined(this.handleRemoveFile)}" class="udex-upload__wrapper">${ this.uploadTitle ? block1.call(this, context, tags, suffix) : undefined }${ this.additionalText ? block2.call(this, context, tags, suffix) : undefined }<div class="udex-upload__upload-button-container"><ui5-file-uploader id="fileUploader" hide-input accept="${ifDefined(this.accept)}" ?multiple="${this.multiple}" @change="${this.handleUploadFile}" @click="${this.handleUploadClick}"><udex-button design="Secondary" aria-label="${ifDefined(this.uploadButtonAriaLabel)}" size="${ifDefined(this._buttonSize)}">${ifDefined(this.uploadButtonText)}</udex-button></ui5-file-uploader>${ this._filesFull ? block3.call(this, context, tags, suffix) : undefined }</div><div class="udex-upload__files-wrapper"><udex-list aria-busy="${ifDefined(this.listBusy)}" mode="MultiSelect" @ui5-selection-change="${ifDefined(this.handleSelectionChange)}"><slot></slot></udex-list></div></div>`;}
+function block0 (this: Upload, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div @ui5-request-delete="${ifDefined(this.handleRemoveFile)}" class="udex-upload__wrapper">${ this.uploadTitle ? block1.call(this, context, tags, suffix) : undefined }${ this.additionalText ? block2.call(this, context, tags, suffix) : undefined }<div class="udex-upload__upload-button-container"><${scopeTag("ui5-file-uploader", tags, suffix)} ?disabled="${this.disabled}" id="fileUploader" hide-input accept="${ifDefined(this.accept)}" ?multiple="${this.multiple}" @change="${this.handleUploadFile}" @click="${this.handleUploadClick}"><${scopeTag("udex-button", tags, suffix)} ?disabled="${this.disabled}" aria-disabled="${ifDefined(this.disabled)}" design="Secondary" aria-label="${ifDefined(this.uploadButtonAriaLabel)}" size="${ifDefined(this._buttonSize)}">${ifDefined(this.uploadButtonText)}</${scopeTag("udex-button", tags, suffix)}></${scopeTag("ui5-file-uploader", tags, suffix)}>${ this.showSupportingText ? block3.call(this, context, tags, suffix) : undefined }</div><div class="udex-upload__files-wrapper"><${scopeTag("udex-list", tags, suffix)} aria-busy="${ifDefined(this.listBusy)}" mode="MultiSelect" @ui5-selection-change="${ifDefined(this.handleSelectionChange)}"><slot></slot></${scopeTag("udex-list", tags, suffix)}></div></div>` : html`<div @ui5-request-delete="${ifDefined(this.handleRemoveFile)}" class="udex-upload__wrapper">${ this.uploadTitle ? block1.call(this, context, tags, suffix) : undefined }${ this.additionalText ? block2.call(this, context, tags, suffix) : undefined }<div class="udex-upload__upload-button-container"><ui5-file-uploader ?disabled="${this.disabled}" id="fileUploader" hide-input accept="${ifDefined(this.accept)}" ?multiple="${this.multiple}" @change="${this.handleUploadFile}" @click="${this.handleUploadClick}"><udex-button ?disabled="${this.disabled}" aria-disabled="${ifDefined(this.disabled)}" design="Secondary" aria-label="${ifDefined(this.uploadButtonAriaLabel)}" size="${ifDefined(this._buttonSize)}">${ifDefined(this.uploadButtonText)}</udex-button></ui5-file-uploader>${ this.showSupportingText ? block3.call(this, context, tags, suffix) : undefined }</div><div class="udex-upload__files-wrapper"><udex-list aria-busy="${ifDefined(this.listBusy)}" mode="MultiSelect" @ui5-selection-change="${ifDefined(this.handleSelectionChange)}"><slot></slot></udex-list></div></div>`;}
 function block1 (this: Upload, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<h1 class="udex-upload__title">${ifDefined(this.uploadTitle)}</h1>`;}
 function block2 (this: Upload, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<p class="udex-upload__additional-text">${ifDefined(this.additionalText)}</p>`;}
-function block3 (this: Upload, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<p class="udex-upload__error">${ifDefined(this.errorText)}</p>`;}
+function block3 (this: Upload, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<p class="${ifDefined(this.supportingTextClasses)}">${ifDefined(this.supportingText)}</p>`;}
 
-
-export default block0;
+function template(this: Upload) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
+export default template;

package/src/generated/themes/Accordion.css.ts

@@ -1,4 +1,3 @@
-import type { StyleData } from "@ui5/webcomponents-base/dist/types.js";
 import { registerThemePropertiesLoader } from "@ui5/webcomponents-base/dist/asset-registries/Themes.js";
 
 import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js";
@@ -6,8 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@ui5/webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@sapudex/web-components", "sap_horizon", async () => defaultTheme);
-
-const styleData: StyleData = {packageName:"@sapudex/web-components",fileName:"themes/Accordion.css.ts",content:`:host{--udex-accordion-heading-color: var(--sapTitleColor, var(--udexCoreHeadingDark));font-family:var(--sapFontFamily, sans-serif);font-size:var(--sapFontSize, 16px)}.udex-accordion__head{display:flex;justify-content:space-between;margin-bottom:var(--udexSpacer16, 16px)}.udex-accordion__headline{font-size:var(--sapFontHeader3Size,var(--udexTypographyHeadingRegularXSFontSize, 24px));font-weight:var(--udexTypographyFontWeightRegular, 400);line-height:var(--udexTypographyHeadingLineHeight, 26px);margin:var(--udexSpacer8, 8px);color:var(--udex-accordion-heading-color)}.udex-accordion__btn{height:42px}.udex-accordion__btn::part(button){padding-inline:var(--udexSpacer12,12px)}
-`};
-export default styleData;
-	
+export default `:host{--udex-accordion-heading-color: var(--sapTitleColor, var(--udexCoreHeadingDark));font-family:var(--sapFontFamily, sans-serif);font-size:var(--sapFontSize, 16px)}.udex-accordion__head{display:flex;justify-content:space-between;margin-bottom:var(--udexSpacer16, 16px)}.udex-accordion__headline{font-size:var(--sapFontHeader3Size,var(--udexTypographyHeadingRegularXSFontSize, 24px));font-weight:var(--udexTypographyFontWeightRegular, 400);line-height:var(--udexTypographyHeadingLineHeight, 26px);margin:var(--udexSpacer8, 8px);color:var(--udex-accordion-heading-color)}.udex-accordion__btn{height:42px}.udex-accordion__btn::part(button){padding-inline:var(--udexSpacer12,12px)}
+`

package/src/generated/themes/AccordionItem.css.ts

@@ -1,4 +1,3 @@
-import type { StyleData } from "@ui5/webcomponents-base/dist/types.js";
 import { registerThemePropertiesLoader } from "@ui5/webcomponents-base/dist/asset-registries/Themes.js";
 
 import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js";
@@ -6,8 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@ui5/webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@sapudex/web-components", "sap_horizon", async () => defaultTheme);
-
-const styleData: StyleData = {packageName:"@sapudex/web-components",fileName:"themes/AccordionItem.css.ts",content:`:host{--udex-accordion-item-icon-color: var(--sapContent_MarkerIconColor, var(--udexColorBlue9));--udex-accordion-item-headline-color: var(--sapTitleColor, var(--udexCoreHeadingDark));--udex-accordion-item-headline-font-size: var(--sapFontHeader5Size, var(--udexTypographyHeadingMediumXXXSFontSize, 18px));--udex-accordion-item-title-font-weight: var(--udexTypographyFontWeightMedium, 500);--udex-accordion-item-border-color: var(--sapShell_BorderColor, var(--udexColorGrey3));--udex-accordion-item-border-width: 1px;--udex-accordion-item-background-color: transparent;--udex-accordion-item-hover-background-color: var(--udexColorGrey1, #F5F6F7);--udex-accordion-item-header-padding: var(--udexSpacer12, 12px) var(--udexSpacer12, 12px) var(--udexSpacer12, 12px) var(--udexSpacer8, 8px);--udex-accordion-item-content-margin: var(--udexSpacer12, 12px) var(--udexSpacer16, 16px);--udex-accordion-item-icon-width: 42px;--udex-accordion-item-icon-height: 42px;font-family:var(--sapFontFamily, sans-serif);font-size:var(--sapProgress_FontSize, 16px)}.udex-accordion-item{list-style-type:none}.udex-accordion-item__header{display:flex;align-items:center;cursor:pointer;border:none;background:var(--udex-accordion-item-background-color);width:100%;font-family:inherit;color:var(--udex-accordion-item-headline-color);font-size:var(--udex-accordion-item-headline-font-size);gap:var(--udexSpacer12, 12px);padding:var(--udex-accordion-item-header-padding);line-height:var(--udexTypographyHeadingLineHeight, 1.1);border-bottom:var(--udex-accordion-item-border-width) solid var(--udex-accordion-item-border-color)}.udex-accordion-item__header:hover{background-color:var(--udex-accordion-item-hover-background-color)}:host([desktop]) .udex-accordion-item__header:focus,.udex-accordion-item__header:focus-visible{outline:2px solid var(--udexColorBlue10, #002A86);border-radius:var(--udexRadiusM, 8px)}.udex-accordion-item__icon{height:var(--udex-button-icon-l-size, 18px);width:var(--udex-button-icon-l-size, 18px);color:var(--udex-accordion-item-icon-color);transform:rotate(0)}.udex-accordion-item__icon-wrapper{min-width:var(--udex-accordion-item-icon-width);height:var(--udex-accordion-item-icon-height);display:inline-flex;align-items:center;justify-content:center}:host(:dir(rtl)) .udex-accordion-item__icon{transform:rotate(0)}:host([expanded]) .udex-accordion-item__icon{transform:rotate(90deg)}:host([expanded]:dir(rtl)) .active .udex-accordion-item__icon{transform:rotate(-90deg)}.udex-accordion-item__title{font-weight:var(--udex-accordion-item-title-font-weight);align-items:center;display:flex;text-align:start}.udex-accordion-item__content{display:none;margin:var(--udex-accordion-item-content-margin)}:host([expanded]) .udex-accordion-item__content{display:block}.udex-accordion-item__badge{display:inline-flex;margin-inline-start:var(--udexSpacer8)}
-`};
-export default styleData;
-	
+export default `:host{--udex-accordion-item-icon-color: var(--sapContent_MarkerIconColor, var(--udexColorBlue9));--udex-accordion-item-headline-color: var(--sapTitleColor, var(--udexCoreHeadingDark));--udex-accordion-item-headline-font-size: var(--sapFontHeader5Size, var(--udexTypographyHeadingMediumXXXSFontSize, 18px));--udex-accordion-item-title-font-weight: var(--udexTypographyFontWeightMedium, 500);--udex-accordion-item-border-color: var(--sapShell_BorderColor, var(--udexColorGrey3));--udex-accordion-item-border-width: 1px;--udex-accordion-item-background-color: transparent;--udex-accordion-item-hover-background-color: var(--udexColorGrey1, #F5F6F7);--udex-accordion-item-header-padding: var(--udexSpacer12, 12px) var(--udexSpacer12, 12px) var(--udexSpacer12, 12px) var(--udexSpacer8, 8px);--udex-accordion-item-content-margin: var(--udexSpacer12, 12px) var(--udexSpacer16, 16px);--udex-accordion-item-icon-width: 42px;--udex-accordion-item-icon-height: 42px;font-family:var(--sapFontFamily, sans-serif);font-size:var(--sapProgress_FontSize, 16px)}.udex-accordion-item{list-style-type:none}.udex-accordion-item__header{display:flex;align-items:center;cursor:pointer;border:none;background:var(--udex-accordion-item-background-color);width:100%;font-family:inherit;color:var(--udex-accordion-item-headline-color);font-size:var(--udex-accordion-item-headline-font-size);gap:var(--udexSpacer12, 12px);padding:var(--udex-accordion-item-header-padding);line-height:var(--udexTypographyHeadingLineHeight, 1.1);border-bottom:var(--udex-accordion-item-border-width) solid var(--udex-accordion-item-border-color)}.udex-accordion-item__header:hover{background-color:var(--udex-accordion-item-hover-background-color)}:host([desktop]) .udex-accordion-item__header:focus,.udex-accordion-item__header:focus-visible{outline:2px solid var(--udexColorBlue10, #002A86);border-radius:var(--udexRadiusM, 8px)}.udex-accordion-item__icon{height:var(--udex-button-icon-l-size, 18px);width:var(--udex-button-icon-l-size, 18px);color:var(--udex-accordion-item-icon-color);transform:rotate(0)}.udex-accordion-item__icon-wrapper{min-width:var(--udex-accordion-item-icon-width);height:var(--udex-accordion-item-icon-height);display:inline-flex;align-items:center;justify-content:center}:host(:dir(rtl)) .udex-accordion-item__icon{transform:rotate(0)}:host([expanded]) .udex-accordion-item__icon{transform:rotate(90deg)}:host([expanded]:dir(rtl)) .active .udex-accordion-item__icon{transform:rotate(-90deg)}.udex-accordion-item__title{font-weight:var(--udex-accordion-item-title-font-weight);align-items:center;text-align:left;display:flex;text-align:start}.udex-accordion-item__content{display:none;margin:var(--udex-accordion-item-content-margin)}:host([expanded]) .udex-accordion-item__content{display:block}.udex-accordion-item__badge{display:inline-flex;margin-inline-start:var(--udexSpacer8)}
+`