@ui5/webcomponents 2.5.0 → 2.6.0-rc.0

package/dist/ListItemBase.js

@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
-import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
 import { getTabbableElements } from "@ui5/webcomponents-base/dist/util/TabbableElements.js";
@@ -75,7 +75,7 @@ let ListItemBase = class ListItemBase extends UI5Element {
         this.actionable = true;
     }
     _onfocusin(e) {
-        this.fireDecoratorEvent("_request-tabindex-change", e);
+        this.fireDecoratorEvent("request-tabindex-change", e);
         if (e.target !== this.getFocusDomRef()) {
             return;
         }
@@ -123,7 +123,7 @@ let ListItemBase = class ListItemBase extends UI5Element {
     }
     _handleTabNext(e) {
         if (this.shouldForwardTabAfter()) {
-            if (!this.fireDecoratorEvent("_forward-after")) {
+            if (!this.fireDecoratorEvent("forward-after")) {
                 e.preventDefault();
             }
         }
@@ -131,7 +131,7 @@ let ListItemBase = class ListItemBase extends UI5Element {
     _handleTabPrevious(e) {
         const target = e.target;
         if (this.shouldForwardTabBefore(target)) {
-            this.fireDecoratorEvent("_forward-before");
+            this.fireDecoratorEvent("forward-before");
         }
     }
     /**
@@ -175,7 +175,7 @@ let ListItemBase = class ListItemBase extends UI5Element {
         if (this.selected) {
             return 0;
         }
-        return this.forcedTabIndex;
+        return this.forcedTabIndex ? parseInt(this.forcedTabIndex) : undefined;
     }
 };
 __decorate([
@@ -201,10 +201,10 @@ __decorate([
 ], ListItemBase.prototype, "actionable", void 0);
 ListItemBase = __decorate([
     customElement({
-        renderer: litRender,
+        renderer: jsxRenderer,
         styles: [styles, draggableElementStyles],
     }),
-    event("_request-tabindex-change", {
+    event("request-tabindex-change", {
         bubbles: true,
     }),
     event("_press", {
@@ -213,11 +213,11 @@ ListItemBase = __decorate([
     event("_focused", {
         bubbles: true,
     }),
-    event("_forward-after", {
+    event("forward-after", {
         bubbles: true,
         cancelable: true,
     }),
-    event("_forward-before", {
+    event("forward-before", {
         bubbles: true,
     })
 ], ListItemBase);

package/dist/ListItemBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemBase.js","sourceRoot":"","sources":["../src/ListItemBase.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport { getTabbableElements } from \"@ui5/webcomponents-base/dist/util/TabbableElements.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport {\n\tisEnter,\n\tisSpace,\n\tisTabNext,\n\tisTabPrevious,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport getActiveElement from \"@ui5/webcomponents-base/dist/util/getActiveElement.js\";\n\n// Styles\nimport styles from \"./generated/themes/ListItemBase.css.js\";\nimport draggableElementStyles from \"./generated/themes/DraggableElement.css.js\";\n\ntype ListItemBasePressEventDetail = {\n\titem: ListItemBase,\n\tselected?: boolean,\n\tkey?: string,\n}\n\n/**\n * @class\n * A class to serve as a foundation\n * for the `ListItem` and `ListItemGroupHeader` classes.\n * @constructor\n * @abstract\n * @extends UI5Element\n * @public\n */\n@customElement({\n\trenderer: litRender,\n\tstyles: [styles, draggableElementStyles],\n})\n@event(\"_request-tabindex-change\", {\n\tbubbles: true,\n})\n@event(\"_press\", {\n\tbubbles: true,\n})\n@event(\"_focused\", {\n\tbubbles: true,\n})\n@event(\"_forward-after\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n@event(\"_forward-before\", {\n\tbubbles: true,\n})\nclass ListItemBase extends UI5Element implements ITabbable {\n\teventDetails!: {\n\t\t\"_request-tabindex-change\": FocusEvent,\n\t\t\"_press\": ListItemBasePressEventDetail,\n\t\t\"_focused\": FocusEvent,\n\t\t\"_forward-after\": void,\n\t\t\"_forward-before\": void,\n\t}\n\t/**\n\t * Defines the selected state of the component.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tselected = false;\n\n\t/**\n\t * Defines whether the item is movable.\n\t * @default false\n\t * @private\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tmovable = false;\n\n\t/**\n\t* Defines if the list item should display its bottom border.\n\t* @private\n\t*/\n\t@property({ type: Boolean })\n\thasBorder = false;\n\n\t@property()\n\tforcedTabIndex?: string;\n\n\t/**\n\t* Defines whether `ui5-li` is in disabled state.\n\t*\n\t* **Note:** A disabled `ui5-li` is noninteractive.\n\t* @default false\n\t* @protected\n\t* @since 1.0.0-rc.12\n\t*/\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/**\n\t * Indicates if the element is on focus\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused = false;\n\n\t/**\n\t * Indicates if the list item is actionable, e.g has hover and pressed effects.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tactionable = false;\n\n\tonEnterDOM() {\n\t\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\t}\n\n\tonBeforeRendering(): void {\n\t\tthis.actionable = true;\n\t}\n\n\t_onfocusin(e: FocusEvent) {\n\t\tthis.fireDecoratorEvent(\"_request-tabindex-change\", e);\n\t\tif (e.target !== this.getFocusDomRef()) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.fireDecoratorEvent(\"_focused\", e);\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (isTabNext(e)) {\n\t\t\treturn this._handleTabNext(e);\n\t\t}\n\n\t\tif (isTabPrevious(e)) {\n\t\t\treturn this._handleTabPrevious(e);\n\t\t}\n\n\t\tif (this.getFocusDomRef()!.matches(\":has(:focus-within)\")) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault();\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (this.getFocusDomRef()!.matches(\":has(:focus-within)\")) {\n\t\t\treturn;\n\t\t}\n\t\tif (isSpace(e)) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t_onclick(e: MouseEvent) {\n\t\tif (this.getFocusDomRef()!.matches(\":has(:focus-within)\")) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.fireItemPress(e);\n\t}\n\n\tfireItemPress(e: Event) {\n\t\tif (this.disabled || !this._pressable) {\n\t\t\treturn;\n\t\t}\n\t\tif (isEnter(e as KeyboardEvent)) {\n\t\t\te.preventDefault();\n\t\t}\n\t\tthis.fireDecoratorEvent(\"_press\", { item: this, selected: this.selected, key: (e as KeyboardEvent).key });\n\t}\n\n\t_handleTabNext(e: KeyboardEvent) {\n\t\tif (this.shouldForwardTabAfter()) {\n\t\t\tif (!this.fireDecoratorEvent(\"_forward-after\")) {\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\t_handleTabPrevious(e: KeyboardEvent) {\n\t\tconst target = e.target as HTMLElement;\n\n\t\tif (this.shouldForwardTabBefore(target)) {\n\t\t\tthis.fireDecoratorEvent(\"_forward-before\");\n\t\t}\n\t}\n\n\t/**\n\t * Determines if th current list item either has no tabbable content or\n\t * [Tab] is performed onto the last tabbale content item.\n\t */\n\tshouldForwardTabAfter() {\n\t\tconst aContent = getTabbableElements(this.getFocusDomRef()!);\n\n\t\treturn aContent.length === 0 || (aContent[aContent.length - 1] === getActiveElement());\n\t}\n\n\t/**\n\t * Determines if the current list item is target of [SHIFT+TAB].\n\t */\n\tshouldForwardTabBefore(target: HTMLElement) {\n\t\treturn this.getFocusDomRef() === target;\n\t}\n\n\tget classes(): ClassMap {\n\t\treturn {\n\t\t\tmain: {\n\t\t\t\t\"ui5-li-root\": true,\n\t\t\t\t\"ui5-li--focusable\": this._focusable,\n\t\t\t},\n\t\t};\n\t}\n\n\tget _ariaDisabled() {\n\t\treturn this.disabled ? true : undefined;\n\t}\n\n\tget _focusable() {\n\t\treturn !this.disabled;\n\t}\n\n\tget _pressable() {\n\t\treturn true;\n\t}\n\n\tget hasConfigurableMode() {\n\t\treturn false;\n\t}\n\n\tget _effectiveTabIndex() {\n\t\tif (!this._focusable) {\n\t\t\treturn -1;\n\t\t}\n\t\tif (this.selected) {\n\t\t\treturn 0;\n\t\t}\n\t\treturn this.forcedTabIndex;\n\t}\n}\n\nexport default ListItemBase;\n\nexport type {\n\tListItemBasePressEventDetail,\n};\n"]}
+{"version":3,"file":"ListItemBase.js","sourceRoot":"","sources":["../src/ListItemBase.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport { getTabbableElements } from \"@ui5/webcomponents-base/dist/util/TabbableElements.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport {\n\tisEnter,\n\tisSpace,\n\tisTabNext,\n\tisTabPrevious,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport getActiveElement from \"@ui5/webcomponents-base/dist/util/getActiveElement.js\";\n\n// Styles\nimport styles from \"./generated/themes/ListItemBase.css.js\";\nimport draggableElementStyles from \"./generated/themes/DraggableElement.css.js\";\n\ntype ListItemBasePressEventDetail = {\n\titem: ListItemBase,\n\tselected?: boolean,\n\tkey?: string,\n}\n\n/**\n * @class\n * A class to serve as a foundation\n * for the `ListItem` and `ListItemGroupHeader` classes.\n * @constructor\n * @abstract\n * @extends UI5Element\n * @public\n */\n@customElement({\n\trenderer: jsxRenderer,\n\tstyles: [styles, draggableElementStyles],\n})\n@event(\"request-tabindex-change\", {\n\tbubbles: true,\n})\n@event(\"_press\", {\n\tbubbles: true,\n})\n@event(\"_focused\", {\n\tbubbles: true,\n})\n@event(\"forward-after\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n@event(\"forward-before\", {\n\tbubbles: true,\n})\nclass ListItemBase extends UI5Element implements ITabbable {\n\teventDetails!: {\n\t\t\"request-tabindex-change\": FocusEvent,\n\t\t\"_press\": ListItemBasePressEventDetail,\n\t\t\"_focused\": FocusEvent,\n\t\t\"forward-after\": void,\n\t\t\"forward-before\": void,\n\t}\n\t/**\n\t * Defines the selected state of the component.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tselected = false;\n\n\t/**\n\t * Defines whether the item is movable.\n\t * @default false\n\t * @private\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tmovable = false;\n\n\t/**\n\t* Defines if the list item should display its bottom border.\n\t* @private\n\t*/\n\t@property({ type: Boolean })\n\thasBorder = false;\n\n\t@property()\n\tforcedTabIndex?: string;\n\n\t/**\n\t* Defines whether `ui5-li` is in disabled state.\n\t*\n\t* **Note:** A disabled `ui5-li` is noninteractive.\n\t* @default false\n\t* @protected\n\t* @since 1.0.0-rc.12\n\t*/\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/**\n\t * Indicates if the element is on focus\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused = false;\n\n\t/**\n\t * Indicates if the list item is actionable, e.g has hover and pressed effects.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tactionable = false;\n\n\tonEnterDOM() {\n\t\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\t}\n\n\tonBeforeRendering(): void {\n\t\tthis.actionable = true;\n\t}\n\n\t_onfocusin(e: FocusEvent) {\n\t\tthis.fireDecoratorEvent(\"request-tabindex-change\", e);\n\t\tif (e.target !== this.getFocusDomRef()) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.fireDecoratorEvent(\"_focused\", e);\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (isTabNext(e)) {\n\t\t\treturn this._handleTabNext(e);\n\t\t}\n\n\t\tif (isTabPrevious(e)) {\n\t\t\treturn this._handleTabPrevious(e);\n\t\t}\n\n\t\tif (this.getFocusDomRef()!.matches(\":has(:focus-within)\")) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault();\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (this.getFocusDomRef()!.matches(\":has(:focus-within)\")) {\n\t\t\treturn;\n\t\t}\n\t\tif (isSpace(e)) {\n\t\t\tthis.fireItemPress(e);\n\t\t}\n\t}\n\n\t_onclick(e: MouseEvent) {\n\t\tif (this.getFocusDomRef()!.matches(\":has(:focus-within)\")) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.fireItemPress(e);\n\t}\n\n\tfireItemPress(e: Event) {\n\t\tif (this.disabled || !this._pressable) {\n\t\t\treturn;\n\t\t}\n\t\tif (isEnter(e as KeyboardEvent)) {\n\t\t\te.preventDefault();\n\t\t}\n\t\tthis.fireDecoratorEvent(\"_press\", { item: this, selected: this.selected, key: (e as KeyboardEvent).key });\n\t}\n\n\t_handleTabNext(e: KeyboardEvent) {\n\t\tif (this.shouldForwardTabAfter()) {\n\t\t\tif (!this.fireDecoratorEvent(\"forward-after\")) {\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\t_handleTabPrevious(e: KeyboardEvent) {\n\t\tconst target = e.target as HTMLElement;\n\n\t\tif (this.shouldForwardTabBefore(target)) {\n\t\t\tthis.fireDecoratorEvent(\"forward-before\");\n\t\t}\n\t}\n\n\t/**\n\t * Determines if th current list item either has no tabbable content or\n\t * [Tab] is performed onto the last tabbale content item.\n\t */\n\tshouldForwardTabAfter() {\n\t\tconst aContent = getTabbableElements(this.getFocusDomRef()!);\n\n\t\treturn aContent.length === 0 || (aContent[aContent.length - 1] === getActiveElement());\n\t}\n\n\t/**\n\t * Determines if the current list item is target of [SHIFT+TAB].\n\t */\n\tshouldForwardTabBefore(target: HTMLElement) {\n\t\treturn this.getFocusDomRef() === target;\n\t}\n\n\tget classes(): ClassMap {\n\t\treturn {\n\t\t\tmain: {\n\t\t\t\t\"ui5-li-root\": true,\n\t\t\t\t\"ui5-li--focusable\": this._focusable,\n\t\t\t},\n\t\t};\n\t}\n\n\tget _ariaDisabled() {\n\t\treturn this.disabled ? true : undefined;\n\t}\n\n\tget _focusable() {\n\t\treturn !this.disabled;\n\t}\n\n\tget _pressable() {\n\t\treturn true;\n\t}\n\n\tget hasConfigurableMode() {\n\t\treturn false;\n\t}\n\n\tget _effectiveTabIndex() {\n\t\tif (!this._focusable) {\n\t\t\treturn -1;\n\t\t}\n\t\tif (this.selected) {\n\t\t\treturn 0;\n\t\t}\n\t\treturn this.forcedTabIndex ? parseInt(this.forcedTabIndex) : undefined;\n\t}\n}\n\nexport default ListItemBase;\n\nexport type {\n\tListItemBasePressEventDetail,\n};\n"]}

package/dist/ListItemBaseTemplate.d.ts

@@ -0,0 +1,8 @@
+import type ListItemBase from "./ListItemBase.js";
+import type { AriaRole } from "@ui5/webcomponents-base/";
+export default function ListItemBaseTemplate(this: ListItemBase, hooks?: {
+    listItemContent: () => void;
+}, injectedProps?: {
+    role?: AriaRole;
+    title?: string;
+}): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ListItemBaseTemplate.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+export default function ListItemBaseTemplate(hooks, injectedProps) {
+    const listItemContent = hooks?.listItemContent || defaultListItemContent;
+    return (_jsx("li", { part: "native-li", "data-sap-focus-ref": true, tabindex: this._effectiveTabIndex, class: this.classes.main, draggable: this.movable, role: injectedProps?.role, title: injectedProps?.title, onFocusIn: this._onfocusin, onKeyUp: this._onkeyup, onKeyDown: this._onkeydown, onClick: this._onclick, children: listItemContent.call(this) }));
+}
+function defaultListItemContent() {
+    return _jsx("div", { part: "content", id: `${this._id}-content`, class: "ui5-li-content", children: _jsx("div", { class: "ui5-li-text-wrapper", children: _jsx("span", { part: "title", class: "ui5-li-title", children: _jsx("slot", {}) }) }) });
+}
+//# sourceMappingURL=ListItemBaseTemplate.js.map

package/dist/ListItemBaseTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemBaseTemplate.js","sourceRoot":"","sources":["../src/ListItemBaseTemplate.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAqB,KAAuC,EAAE,aAGzG;IACA,MAAM,eAAe,GAAG,KAAK,EAAE,eAAe,IAAI,sBAAsB,CAAC;IAEzE,OAAO,CACN,aACC,IAAI,EAAC,WAAW,8BAEhB,QAAQ,EAAE,IAAI,CAAC,kBAAkB,EACjC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EACxB,SAAS,EAAE,IAAI,CAAC,OAAO,EACvB,IAAI,EAAE,aAAa,EAAE,IAAI,EACzB,KAAK,EAAE,aAAa,EAAE,KAAK,EAC3B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,YAEpB,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,GACxB,CACL,CAAC;AACH,CAAC;AAED,SAAS,sBAAsB;IAC9B,OAAO,cAAK,IAAI,EAAC,SAAS,EAAC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,EAAE,KAAK,EAAC,gBAAgB,YAC3E,cAAK,KAAK,EAAC,qBAAqB,YAC/B,eAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,cAAc,YAAC,gBAAa,GAAO,GACvD,GACD,CAAC;AACR,CAAC","sourcesContent":["import type ListItemBase from \"./ListItemBase.js\";\nimport type { AriaRole } from \"@ui5/webcomponents-base/\";\n\nexport default function ListItemBaseTemplate(this: ListItemBase, hooks?: { listItemContent: () => void }, injectedProps?: {\n\trole?: AriaRole,\n\ttitle?: string,\n}) {\n\tconst listItemContent = hooks?.listItemContent || defaultListItemContent;\n\n\treturn (\n\t\t<li\n\t\t\tpart=\"native-li\"\n\t\t\tdata-sap-focus-ref\n\t\t\ttabindex={this._effectiveTabIndex}\n\t\t\tclass={this.classes.main}\n\t\t\tdraggable={this.movable}\n\t\t\trole={injectedProps?.role}\n\t\t\ttitle={injectedProps?.title}\n\t\t\tonFocusIn={this._onfocusin}\n\t\t\tonKeyUp={this._onkeyup}\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonClick={this._onclick}\n\t\t>\n\t\t\t{ listItemContent.call(this) }\n\t\t</li>\n\t);\n}\n\nfunction defaultListItemContent(this: ListItemBase) {\n\treturn <div part=\"content\" id={`${this._id}-content`} class=\"ui5-li-content\">\n\t\t<div class=\"ui5-li-text-wrapper\">\n\t\t\t<span part=\"title\" class=\"ui5-li-title\"><slot></slot></span>\n\t\t</div>\n\t</div>;\n}\n"]}

package/dist/ListItemCustom.js

@@ -5,10 +5,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { isTabNext, isTabPrevious, isF2 } from "@ui5/webcomponents-base/dist/Keys.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import ListItem from "./ListItem.js";
-import ListItemCustomTemplate from "./generated/templates/ListItemCustomTemplate.lit.js";
+import ListItemCustomTemplate from "./ListItemCustomTemplate.js";
 // Styles
 import ListItemCustomCss from "./generated/themes/ListItemCustom.css.js";
 /**
@@ -72,6 +73,7 @@ ListItemCustom = __decorate([
     customElement({
         tag: "ui5-li-custom",
         template: ListItemCustomTemplate,
+        renderer: jsxRenderer,
         styles: [ListItem.styles, ListItemCustomCss],
     })
 ], ListItemCustom);

package/dist/ListItemCustom.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemCustom.js","sourceRoot":"","sources":["../src/ListItemCustom.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,sCAAsC,CAAC;AAEtF,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,QAAQ,MAAM,eAAe,CAAC;AACrC,OAAO,sBAAsB,MAAM,qDAAqD,CAAC;AAEzF,SAAS;AACT,OAAO,iBAAiB,MAAM,0CAA0C,CAAC;AAEzE;;;;;;;;;;;;;;;;;GAiBG;AAMH,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,QAAQ;IAArC;;QACC;;;;;WAKG;QAEH,YAAO,GAAG,KAAK,CAAC;IA0CjB,CAAC;IA7BA,KAAK,CAAC,UAAU,CAAC,CAAgB;QAChC,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC;QAC/C,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAEzC,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;YACtC,OAAO;QACR,CAAC;QAED,MAAM,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IAC3B,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC;QAC/C,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAEzC,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;YACtC,OAAO;QACR,CAAC;QAED,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC;IAED,IAAI,OAAO;QACV,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC;QAE7B,MAAM,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,IAAI,CAAC;QAEzC,OAAO,MAAM,CAAC;IACf,CAAC;CACD,CAAA;AA1CA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACZ;AAWR;IADP,QAAQ,EAAE;sDACqB;AAnB3B,cAAc;IALnB,aAAa,CAAC;QACd,GAAG,EAAE,eAAe;QACpB,QAAQ,EAAE,sBAAsB;QAChC,MAAM,EAAE,CAAC,QAAQ,CAAC,MAAM,EAAE,iBAAiB,CAAC;KAC5C,CAAC;GACI,cAAc,CAkDnB;AAED,cAAc,CAAC,MAAM,EAAE,CAAC;AAExB,eAAe,cAAc,CAAC","sourcesContent":["import { isTabNext, isTabPrevious, isF2 } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport ListItem from \"./ListItem.js\";\nimport ListItemCustomTemplate from \"./generated/templates/ListItemCustomTemplate.lit.js\";\n\n// Styles\nimport ListItemCustomCss from \"./generated/themes/ListItemCustom.css.js\";\n\n/**\n * @class\n *\n * A component to be used as custom list item within the `ui5-list`\n * the same way as the standard `ui5-li`.\n *\n * The component accepts arbitrary HTML content to allow full customization.\n * @csspart native-li - Used to style the main li tag of the list item\n * @csspart content - Used to style the content area of the list item\n * @csspart detail-button - Used to style the button rendered when the list item is of type detail\n * @csspart delete-button - Used to style the button rendered when the list item is in delete mode\n * @csspart radio - Used to style the radio button rendered when the list item is in single selection mode\n * @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode\n * @slot {Node[]} default - Defines the content of the component.\n * @constructor\n * @extends ListItem\n * @public\n */\n@customElement({\n\ttag: \"ui5-li-custom\",\n\ttemplate: ListItemCustomTemplate,\n\tstyles: [ListItem.styles, ListItemCustomCss],\n})\nclass ListItemCustom extends ListItem {\n\t/**\n\t * Defines whether the item is movable.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tmovable = false;\n\n\t/**\n\t * Defines the text alternative of the component.\n\t *\n\t * **Note**: If not provided a default text alternative will be set, if present.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tdeclare accessibleName?: string;\n\n\tasync _onkeydown(e: KeyboardEvent) {\n\t\tconst isTab = isTabNext(e) || isTabPrevious(e);\n\t\tconst isFocused = this.matches(\":focus\");\n\n\t\tif (!isTab && !isFocused && !isF2(e)) {\n\t\t\treturn;\n\t\t}\n\n\t\tawait super._onkeydown(e);\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tconst isTab = isTabNext(e) || isTabPrevious(e);\n\t\tconst isFocused = this.matches(\":focus\");\n\n\t\tif (!isTab && !isFocused && !isF2(e)) {\n\t\t\treturn;\n\t\t}\n\n\t\tsuper._onkeyup(e);\n\t}\n\n\tget classes(): ClassMap {\n\t\tconst result = super.classes;\n\n\t\tresult.main[\"ui5-custom-li-root\"] = true;\n\n\t\treturn result;\n\t}\n}\n\nListItemCustom.define();\n\nexport default ListItemCustom;\n"]}
+{"version":3,"file":"ListItemCustom.js","sourceRoot":"","sources":["../src/ListItemCustom.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,sCAAsC,CAAC;AACtF,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAE/E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,QAAQ,MAAM,eAAe,CAAC;AACrC,OAAO,sBAAsB,MAAM,6BAA6B,CAAC;AAEjE,SAAS;AACT,OAAO,iBAAiB,MAAM,0CAA0C,CAAC;AAEzE;;;;;;;;;;;;;;;;;GAiBG;AAOH,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,QAAQ;IAArC;;QACC;;;;;WAKG;QAEH,YAAO,GAAG,KAAK,CAAC;IA0CjB,CAAC;IA7BA,KAAK,CAAC,UAAU,CAAC,CAAgB;QAChC,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC;QAC/C,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAEzC,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;YACtC,OAAO;QACR,CAAC;QAED,MAAM,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IAC3B,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC;QAC/C,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAEzC,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;YACtC,OAAO;QACR,CAAC;QAED,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC;IAED,IAAI,OAAO;QACV,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC;QAE7B,MAAM,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,IAAI,CAAC;QAEzC,OAAO,MAAM,CAAC;IACf,CAAC;CACD,CAAA;AA1CA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACZ;AAWR;IADP,QAAQ,EAAE;sDACqB;AAnB3B,cAAc;IANnB,aAAa,CAAC;QACd,GAAG,EAAE,eAAe;QACpB,QAAQ,EAAE,sBAAsB;QAChC,QAAQ,EAAE,WAAW;QACrB,MAAM,EAAE,CAAC,QAAQ,CAAC,MAAM,EAAE,iBAAiB,CAAC;KAC5C,CAAC;GACI,cAAc,CAkDnB;AAED,cAAc,CAAC,MAAM,EAAE,CAAC;AAExB,eAAe,cAAc,CAAC","sourcesContent":["import { isTabNext, isTabPrevious, isF2 } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport ListItem from \"./ListItem.js\";\nimport ListItemCustomTemplate from \"./ListItemCustomTemplate.js\";\n\n// Styles\nimport ListItemCustomCss from \"./generated/themes/ListItemCustom.css.js\";\n\n/**\n * @class\n *\n * A component to be used as custom list item within the `ui5-list`\n * the same way as the standard `ui5-li`.\n *\n * The component accepts arbitrary HTML content to allow full customization.\n * @csspart native-li - Used to style the main li tag of the list item\n * @csspart content - Used to style the content area of the list item\n * @csspart detail-button - Used to style the button rendered when the list item is of type detail\n * @csspart delete-button - Used to style the button rendered when the list item is in delete mode\n * @csspart radio - Used to style the radio button rendered when the list item is in single selection mode\n * @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode\n * @slot {Node[]} default - Defines the content of the component.\n * @constructor\n * @extends ListItem\n * @public\n */\n@customElement({\n\ttag: \"ui5-li-custom\",\n\ttemplate: ListItemCustomTemplate,\n\trenderer: jsxRenderer,\n\tstyles: [ListItem.styles, ListItemCustomCss],\n})\nclass ListItemCustom extends ListItem {\n\t/**\n\t * Defines whether the item is movable.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tmovable = false;\n\n\t/**\n\t * Defines the text alternative of the component.\n\t *\n\t * **Note**: If not provided a default text alternative will be set, if present.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tdeclare accessibleName?: string;\n\n\tasync _onkeydown(e: KeyboardEvent) {\n\t\tconst isTab = isTabNext(e) || isTabPrevious(e);\n\t\tconst isFocused = this.matches(\":focus\");\n\n\t\tif (!isTab && !isFocused && !isF2(e)) {\n\t\t\treturn;\n\t\t}\n\n\t\tawait super._onkeydown(e);\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tconst isTab = isTabNext(e) || isTabPrevious(e);\n\t\tconst isFocused = this.matches(\":focus\");\n\n\t\tif (!isTab && !isFocused && !isF2(e)) {\n\t\t\treturn;\n\t\t}\n\n\t\tsuper._onkeyup(e);\n\t}\n\n\tget classes(): ClassMap {\n\t\tconst result = super.classes;\n\n\t\tresult.main[\"ui5-custom-li-root\"] = true;\n\n\t\treturn result;\n\t}\n}\n\nListItemCustom.define();\n\nexport default ListItemCustom;\n"]}

package/dist/ListItemCustomTemplate.d.ts

@@ -0,0 +1,3 @@
+import type ListItemCustom from "./ListItemCustom.js";
+import type { ListItemHooks } from "./ListItemTemplate.js";
+export default function ListItemCustomTemplate(this: ListItemCustom, hooks?: Partial<ListItemHooks>): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ListItemCustomTemplate.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import ListItemTemplate from "./ListItemTemplate.js";
+const predefinedHooks = {
+    listItemContent,
+};
+export default function ListItemCustomTemplate(hooks) {
+    const currentHooks = { ...predefinedHooks, ...hooks };
+    return ListItemTemplate.call(this, currentHooks);
+}
+function listItemContent() {
+    return _jsx("slot", {});
+}
+//# sourceMappingURL=ListItemCustomTemplate.js.map

package/dist/ListItemCustomTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemCustomTemplate.js","sourceRoot":"","sources":["../src/ListItemCustomTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AAGrD,MAAM,eAAe,GAA2B;IAC/C,eAAe;CACf,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAuB,KAA8B;IAClG,MAAM,YAAY,GAAG,EAAE,GAAG,eAAe,EAAE,GAAG,KAAK,EAAE,CAAC;IAEtD,OAAO,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;AAClD,CAAC;AAED,SAAS,eAAe;IACvB,OAAO,gBAAa,CAAC;AACtB,CAAC","sourcesContent":["import type ListItemCustom from \"./ListItemCustom.js\";\nimport ListItemTemplate from \"./ListItemTemplate.js\";\nimport type { ListItemHooks } from \"./ListItemTemplate.js\";\n\nconst predefinedHooks: Partial<ListItemHooks> = {\n\tlistItemContent,\n};\n\nexport default function ListItemCustomTemplate(this: ListItemCustom, hooks?: Partial<ListItemHooks>) {\n\tconst currentHooks = { ...predefinedHooks, ...hooks };\n\n\treturn ListItemTemplate.call(this, currentHooks);\n}\n\nfunction listItemContent(this: ListItemCustom) {\n\treturn <slot></slot>;\n}\n"]}

package/dist/ListItemGroup.js

@@ -8,7 +8,7 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
-import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import DragRegistry from "@ui5/webcomponents-base/dist/util/dragAndDrop/DragRegistry.js";
 import { findClosestPosition } from "@ui5/webcomponents-base/dist/util/dragAndDrop/findClosestPosition.js";
@@ -16,7 +16,7 @@ import Orientation from "@ui5/webcomponents-base/dist/types/Orientation.js";
 import MovePlacement from "@ui5/webcomponents-base/dist/types/MovePlacement.js";
 import DropIndicator from "./DropIndicator.js";
 // Template
-import ListItemGroupTemplate from "./generated/templates/ListItemGroupTemplate.lit.js";
+import ListItemGroupTemplate from "./ListItemGroupTemplate.js";
 // Styles
 import ListItemGroupCss from "./generated/themes/ListItemGroup.css.js";
 import ListItemStandard from "./ListItemStandard.js";
@@ -147,7 +147,7 @@ __decorate([
 ListItemGroup = __decorate([
     customElement({
         tag: "ui5-li-group",
-        renderer: litRender,
+        renderer: jsxRenderer,
         languageAware: true,
         template: ListItemGroupTemplate,
         styles: [ListItemGroupCss],

package/dist/ListItemGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemGroup.js","sourceRoot":"","sources":["../src/ListItemGroup.ts"],"names":[],"mappings":"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","sourcesContent":["import slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport DragRegistry from \"@ui5/webcomponents-base/dist/util/dragAndDrop/DragRegistry.js\";\nimport { findClosestPosition } from \"@ui5/webcomponents-base/dist/util/dragAndDrop/findClosestPosition.js\";\nimport Orientation from \"@ui5/webcomponents-base/dist/types/Orientation.js\";\nimport MovePlacement from \"@ui5/webcomponents-base/dist/types/MovePlacement.js\";\nimport DropIndicator from \"./DropIndicator.js\";\nimport type ListItemBase from \"./ListItemBase.js\";\n\n// Template\nimport ListItemGroupTemplate from \"./generated/templates/ListItemGroupTemplate.lit.js\";\n\n// Styles\nimport ListItemGroupCss from \"./generated/themes/ListItemGroup.css.js\";\nimport ListItemStandard from \"./ListItemStandard.js\";\nimport ListItemGroupHeader from \"./ListItemGroupHeader.js\";\n\ntype ListItemGroupMoveEventDetail = {\n\tsource: {\n\t\telement: HTMLElement,\n\t},\n\tdestination: {\n\t\telement: HTMLElement,\n\t\tplacement: `${MovePlacement}`,\n\t}\n}\n\n/**\n * @class\n * ### Overview\n * The `ui5-li-group` is a special list item, used only to create groups of list items.\n *\n * This is the item to use inside a `ui5-list`.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/ListItemGroup.js\";`\n * @csspart header - Used to style the header item of the group\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.0.0\n */\n@customElement({\n\ttag: \"ui5-li-group\",\n\trenderer: litRender,\n\tlanguageAware: true,\n\ttemplate: ListItemGroupTemplate,\n\tstyles: [ListItemGroupCss],\n\tdependencies: [ListItemStandard, ListItemGroupHeader, DropIndicator],\n})\n\n/**\n * Fired when a movable list item is moved over a potential drop target during a dragging operation.\n *\n * If the new position is valid, prevent the default action of the event using `preventDefault()`.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n\n@event(\"move-over\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n\n/**\n * Fired when a movable list item is dropped onto a drop target.\n *\n * **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n@event(\"move\", {\n\tbubbles: true,\n})\n\nclass ListItemGroup extends UI5Element {\n\teventDetails!: {\n\t\t\"move-over\": ListItemGroupMoveEventDetail,\n\t\t\"move\": ListItemGroupMoveEventDetail,\n\t}\n\t/**\n\t * Defines the header text of the <code>ui5-li-group</code>.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderText?: string;\n\n\t/**\n\t * Defines the accessible name of the header.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderAccessibleName?: string;\n\n\t/**\n\t * Defines the items of the <code>ui5-li-group</code>.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\tinvalidateOnChildChange: true,\n\t\ttype: HTMLElement,\n\t})\n\titems!: Array<ListItemBase>;\n\n\t/**\n\t * Indicates whether the header is focused\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused = false;\n\n\t/**\n\t* Defines the header of the component.\n\t*\n\t* **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement })\n\theader!: Array<ListItemBase>;\n\n\tonEnterDOM() {\n\t\tDragRegistry.subscribe(this);\n\t}\n\n\tonExitDOM() {\n\t\tDragRegistry.unsubscribe(this);\n\t}\n\n\tget groupHeaderItem() {\n\t\treturn this.shadowRoot!.querySelector<ListItemGroupHeader>(\"[ui5-li-group-header]\")!;\n\t}\n\n\tget hasHeader(): boolean {\n\t\treturn !!this.headerText || this.hasFormattedHeader;\n\t}\n\n\tget hasFormattedHeader(): boolean {\n\t\treturn !!this.header.length;\n\t}\n\n\tget isListItemGroup() {\n\t\treturn true;\n\t}\n\n\tget dropIndicatorDOM(): DropIndicator | null {\n\t\treturn this.shadowRoot!.querySelector(\"[ui5-drop-indicator]\");\n\t}\n\n\t_ondragenter(e: DragEvent) {\n\t\te.preventDefault();\n\t}\n\n\t_ondragleave(e: DragEvent) {\n\t\tif (e.relatedTarget instanceof Node && this.shadowRoot!.contains(e.relatedTarget)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t}\n\n\t_ondragover(e: DragEvent) {\n\t\tconst draggedElement = DragRegistry.getDraggedElement();\n\n\t\tif (!(e.target instanceof HTMLElement) || !draggedElement) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestPosition = findClosestPosition(\n\t\t\tthis.items,\n\t\t\te.clientY,\n\t\t\tOrientation.Vertical,\n\t\t);\n\n\t\tif (!closestPosition) {\n\t\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t\t\treturn;\n\t\t}\n\n\t\tlet placements = closestPosition.placements;\n\n\t\tif (closestPosition.element === draggedElement) {\n\t\t\tplacements = placements.filter(placement => placement !== MovePlacement.On);\n\t\t}\n\n\t\tconst placementAccepted = placements.some(placement => {\n\t\t\tconst beforeItemMovePrevented = !this.fireDecoratorEvent(\"move-over\", {\n\t\t\t\tsource: {\n\t\t\t\t\telement: draggedElement,\n\t\t\t\t},\n\t\t\t\tdestination: {\n\t\t\t\t\telement: closestPosition.element,\n\t\t\t\t\tplacement,\n\t\t\t\t},\n\t\t\t});\n\n\t\t\tif (beforeItemMovePrevented) {\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.dropIndicatorDOM!.targetReference = closestPosition.element;\n\t\t\t\tthis.dropIndicatorDOM!.placement = placement;\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\treturn false;\n\t\t});\n\n\t\tif (!placementAccepted) {\n\t\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t\t}\n\t}\n\n\t_ondrop(e: DragEvent) {\n\t\te.preventDefault();\n\n\t\tthis.fireDecoratorEvent(\"move\", {\n\t\t\tsource: {\n\t\t\t\telement: DragRegistry.getDraggedElement()!,\n\t\t\t},\n\t\t\tdestination: {\n\t\t\t\telement: this.dropIndicatorDOM!.targetReference!,\n\t\t\t\tplacement: this.dropIndicatorDOM!.placement,\n\t\t\t},\n\t\t});\n\n\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t}\n}\n\nListItemGroup.define();\n\nconst isInstanceOfListItemGroup = (object: any): object is ListItemGroup => {\n\treturn \"isListItemGroup\" in object;\n};\n\nexport default ListItemGroup;\nexport { isInstanceOfListItemGroup };\nexport type { ListItemGroupMoveEventDetail };\n"]}
+{"version":3,"file":"ListItemGroup.js","sourceRoot":"","sources":["../src/ListItemGroup.ts"],"names":[],"mappings":"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","sourcesContent":["import slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport DragRegistry from \"@ui5/webcomponents-base/dist/util/dragAndDrop/DragRegistry.js\";\nimport { findClosestPosition } from \"@ui5/webcomponents-base/dist/util/dragAndDrop/findClosestPosition.js\";\nimport Orientation from \"@ui5/webcomponents-base/dist/types/Orientation.js\";\nimport MovePlacement from \"@ui5/webcomponents-base/dist/types/MovePlacement.js\";\nimport DropIndicator from \"./DropIndicator.js\";\nimport type ListItemBase from \"./ListItemBase.js\";\n\n// Template\nimport ListItemGroupTemplate from \"./ListItemGroupTemplate.js\";\n\n// Styles\nimport ListItemGroupCss from \"./generated/themes/ListItemGroup.css.js\";\nimport ListItemStandard from \"./ListItemStandard.js\";\nimport ListItemGroupHeader from \"./ListItemGroupHeader.js\";\n\ntype ListItemGroupMoveEventDetail = {\n\tsource: {\n\t\telement: HTMLElement,\n\t},\n\tdestination: {\n\t\telement: HTMLElement,\n\t\tplacement: `${MovePlacement}`,\n\t}\n}\n\n/**\n * @class\n * ### Overview\n * The `ui5-li-group` is a special list item, used only to create groups of list items.\n *\n * This is the item to use inside a `ui5-list`.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/ListItemGroup.js\";`\n * @csspart header - Used to style the header item of the group\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.0.0\n */\n@customElement({\n\ttag: \"ui5-li-group\",\n\trenderer: jsxRenderer,\n\tlanguageAware: true,\n\ttemplate: ListItemGroupTemplate,\n\tstyles: [ListItemGroupCss],\n\tdependencies: [ListItemStandard, ListItemGroupHeader, DropIndicator],\n})\n\n/**\n * Fired when a movable list item is moved over a potential drop target during a dragging operation.\n *\n * If the new position is valid, prevent the default action of the event using `preventDefault()`.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n\n@event(\"move-over\", {\n\tbubbles: true,\n\tcancelable: true,\n})\n\n/**\n * Fired when a movable list item is dropped onto a drop target.\n *\n * **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.\n * @param {object} source Contains information about the moved element under `element` property.\n * @param {object} destination Contains information about the destination of the moved element. Has `element` and `placement` properties.\n * @public\n * @since 2.1.0\n */\n@event(\"move\", {\n\tbubbles: true,\n})\n\nclass ListItemGroup extends UI5Element {\n\teventDetails!: {\n\t\t\"move-over\": ListItemGroupMoveEventDetail,\n\t\t\"move\": ListItemGroupMoveEventDetail,\n\t}\n\t/**\n\t * Defines the header text of the <code>ui5-li-group</code>.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderText?: string;\n\n\t/**\n\t * Defines the accessible name of the header.\n\t * @public\n\t * @default undefined\n\t */\n\t@property()\n\theaderAccessibleName?: string;\n\n\t/**\n\t * Defines the items of the <code>ui5-li-group</code>.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\tinvalidateOnChildChange: true,\n\t\ttype: HTMLElement,\n\t})\n\titems!: Array<ListItemBase>;\n\n\t/**\n\t * Indicates whether the header is focused\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused = false;\n\n\t/**\n\t* Defines the header of the component.\n\t*\n\t* **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.\n\t* @public\n\t*/\n\t@slot({ type: HTMLElement })\n\theader!: Array<ListItemBase>;\n\n\tonEnterDOM() {\n\t\tDragRegistry.subscribe(this);\n\t}\n\n\tonExitDOM() {\n\t\tDragRegistry.unsubscribe(this);\n\t}\n\n\tget groupHeaderItem() {\n\t\treturn this.shadowRoot!.querySelector<ListItemGroupHeader>(\"[ui5-li-group-header]\")!;\n\t}\n\n\tget hasHeader(): boolean {\n\t\treturn !!this.headerText || this.hasFormattedHeader;\n\t}\n\n\tget hasFormattedHeader(): boolean {\n\t\treturn !!this.header.length;\n\t}\n\n\tget isListItemGroup() {\n\t\treturn true;\n\t}\n\n\tget dropIndicatorDOM(): DropIndicator | null {\n\t\treturn this.shadowRoot!.querySelector(\"[ui5-drop-indicator]\");\n\t}\n\n\t_ondragenter(e: DragEvent) {\n\t\te.preventDefault();\n\t}\n\n\t_ondragleave(e: DragEvent) {\n\t\tif (e.relatedTarget instanceof Node && this.shadowRoot!.contains(e.relatedTarget)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t}\n\n\t_ondragover(e: DragEvent) {\n\t\tconst draggedElement = DragRegistry.getDraggedElement();\n\n\t\tif (!(e.target instanceof HTMLElement) || !draggedElement) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestPosition = findClosestPosition(\n\t\t\tthis.items,\n\t\t\te.clientY,\n\t\t\tOrientation.Vertical,\n\t\t);\n\n\t\tif (!closestPosition) {\n\t\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t\t\treturn;\n\t\t}\n\n\t\tlet placements = closestPosition.placements;\n\n\t\tif (closestPosition.element === draggedElement) {\n\t\t\tplacements = placements.filter(placement => placement !== MovePlacement.On);\n\t\t}\n\n\t\tconst placementAccepted = placements.some(placement => {\n\t\t\tconst beforeItemMovePrevented = !this.fireDecoratorEvent(\"move-over\", {\n\t\t\t\tsource: {\n\t\t\t\t\telement: draggedElement,\n\t\t\t\t},\n\t\t\t\tdestination: {\n\t\t\t\t\telement: closestPosition.element,\n\t\t\t\t\tplacement,\n\t\t\t\t},\n\t\t\t});\n\n\t\t\tif (beforeItemMovePrevented) {\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.dropIndicatorDOM!.targetReference = closestPosition.element;\n\t\t\t\tthis.dropIndicatorDOM!.placement = placement;\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\treturn false;\n\t\t});\n\n\t\tif (!placementAccepted) {\n\t\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t\t}\n\t}\n\n\t_ondrop(e: DragEvent) {\n\t\te.preventDefault();\n\n\t\tthis.fireDecoratorEvent(\"move\", {\n\t\t\tsource: {\n\t\t\t\telement: DragRegistry.getDraggedElement()!,\n\t\t\t},\n\t\t\tdestination: {\n\t\t\t\telement: this.dropIndicatorDOM!.targetReference!,\n\t\t\t\tplacement: this.dropIndicatorDOM!.placement,\n\t\t\t},\n\t\t});\n\n\t\tthis.dropIndicatorDOM!.targetReference = null;\n\t}\n}\n\nListItemGroup.define();\n\nconst isInstanceOfListItemGroup = (object: any): object is ListItemGroup => {\n\treturn \"isListItemGroup\" in object;\n};\n\nexport default ListItemGroup;\nexport { isInstanceOfListItemGroup };\nexport type { ListItemGroupMoveEventDetail };\n"]}

package/dist/ListItemGroupHeader.d.ts

@@ -11,6 +11,7 @@ import ListItemBase from "./ListItemBase.js";
  * @private
  */
 declare class ListItemGroupHeader extends ListItemBase {
+    eventDetails: ListItemBase["eventDetails"];
     /**
      * Defines the text alternative of the component.
      *

package/dist/ListItemGroupHeader.js

@@ -11,7 +11,7 @@ import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import ListItemBase from "./ListItemBase.js";
 import { GROUP_HEADER_TEXT } from "./generated/i18n/i18n-defaults.js";
 // Template
-import ListItemGroupHeaderTemplate from "./generated/templates/ListItemGroupHeaderTemplate.lit.js";
+import ListItemGroupHeaderTemplate from "./ListItemGroupHeaderTemplate.js";
 // Styles
 import ListItemGroupHeaderCss from "./generated/themes/ListItemGroupHeader.css.js";
 /**

package/dist/ListItemGroupHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemGroupHeader.js","sourceRoot":"","sources":["../src/ListItemGroupHeader.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAEnE,OAAO,YAAY,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAEtE,WAAW;AACX,OAAO,2BAA2B,MAAM,0DAA0D,CAAC;AAEnG,SAAS;AACT,OAAO,sBAAsB,MAAM,+CAA+C,CAAC;AAEnF;;;;;;;;;GASG;AAOH,IAAM,mBAAmB,2BAAzB,MAAM,mBAAoB,SAAQ,YAAY;IAc7C,IAAI,SAAS;QACZ,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,UAAU;QACb,OAAO,KAAK,CAAC;IACd,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,qBAAmB,CAAC,UAAU,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAClE,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC1E,CAAC;CACD,CAAA;AApBA;IADC,QAAQ,EAAE;2DACa;AAGjB;IADN,IAAI,CAAC,oBAAoB,CAAC;6CACG;AAZzB,mBAAmB;IANxB,aAAa,CAAC;QACd,GAAG,EAAE,qBAAqB;QAC1B,aAAa,EAAE,IAAI;QACnB,QAAQ,EAAE,2BAA2B;QACrC,MAAM,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,sBAAsB,CAAC;KACrD,CAAC;GACI,mBAAmB,CA6BxB;AAED,mBAAmB,CAAC,MAAM,EAAE,CAAC;AAE7B,eAAe,mBAAmB,CAAC","sourcesContent":["import property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport ListItemBase from \"./ListItemBase.js\";\n\nimport { GROUP_HEADER_TEXT } from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport ListItemGroupHeaderTemplate from \"./generated/templates/ListItemGroupHeaderTemplate.lit.js\";\n\n// Styles\nimport ListItemGroupHeaderCss from \"./generated/themes/ListItemGroupHeader.css.js\";\n\n/**\n * @class\n * The `ui5-li-group-header` is a special list item, used only to separate other list items into logical groups.\n * @slot {Node[]} default - Defines the text of the component.\n *\n * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n * @constructor\n * @extends ListItemBase\n * @private\n */\n@customElement({\n\ttag: \"ui5-li-group-header\",\n\tlanguageAware: true,\n\ttemplate: ListItemGroupHeaderTemplate,\n\tstyles: [ListItemBase.styles, ListItemGroupHeaderCss],\n})\nclass ListItemGroupHeader extends ListItemBase {\n\t/**\n\t * Defines the text alternative of the component.\n\t *\n\t * **Note:** If not provided a default text alternative will be set, if present.\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\taccessibleName?: string;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tget groupItem() {\n\t\treturn true;\n\t}\n\n\tget _pressable() {\n\t\treturn false;\n\t}\n\n\tget groupHeaderText() {\n\t\treturn ListItemGroupHeader.i18nBundle.getText(GROUP_HEADER_TEXT);\n\t}\n\n\tget ariaLabelText() {\n\t\treturn [this.textContent, this.accessibleName].filter(Boolean).join(\" \");\n\t}\n}\n\nListItemGroupHeader.define();\n\nexport default ListItemGroupHeader;\n"]}
+{"version":3,"file":"ListItemGroupHeader.js","sourceRoot":"","sources":["../src/ListItemGroupHeader.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAEnE,OAAO,YAAY,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAEtE,WAAW;AACX,OAAO,2BAA2B,MAAM,kCAAkC,CAAC;AAE3E,SAAS;AACT,OAAO,sBAAsB,MAAM,+CAA+C,CAAC;AAEnF;;;;;;;;;GASG;AAOH,IAAM,mBAAmB,2BAAzB,MAAM,mBAAoB,SAAQ,YAAY;IAe7C,IAAI,SAAS;QACZ,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,UAAU;QACb,OAAO,KAAK,CAAC;IACd,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,qBAAmB,CAAC,UAAU,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAClE,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC1E,CAAC;CACD,CAAA;AApBA;IADC,QAAQ,EAAE;2DACa;AAGjB;IADN,IAAI,CAAC,oBAAoB,CAAC;6CACG;AAbzB,mBAAmB;IANxB,aAAa,CAAC;QACd,GAAG,EAAE,qBAAqB;QAC1B,aAAa,EAAE,IAAI;QACnB,QAAQ,EAAE,2BAA2B;QACrC,MAAM,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,sBAAsB,CAAC;KACrD,CAAC;GACI,mBAAmB,CA8BxB;AAED,mBAAmB,CAAC,MAAM,EAAE,CAAC;AAE7B,eAAe,mBAAmB,CAAC","sourcesContent":["import property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport ListItemBase from \"./ListItemBase.js\";\n\nimport { GROUP_HEADER_TEXT } from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport ListItemGroupHeaderTemplate from \"./ListItemGroupHeaderTemplate.js\";\n\n// Styles\nimport ListItemGroupHeaderCss from \"./generated/themes/ListItemGroupHeader.css.js\";\n\n/**\n * @class\n * The `ui5-li-group-header` is a special list item, used only to separate other list items into logical groups.\n * @slot {Node[]} default - Defines the text of the component.\n *\n * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n * @constructor\n * @extends ListItemBase\n * @private\n */\n@customElement({\n\ttag: \"ui5-li-group-header\",\n\tlanguageAware: true,\n\ttemplate: ListItemGroupHeaderTemplate,\n\tstyles: [ListItemBase.styles, ListItemGroupHeaderCss],\n})\nclass ListItemGroupHeader extends ListItemBase {\n\teventDetails!: ListItemBase[\"eventDetails\"];\n\t/**\n\t * Defines the text alternative of the component.\n\t *\n\t * **Note:** If not provided a default text alternative will be set, if present.\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\taccessibleName?: string;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tget groupItem() {\n\t\treturn true;\n\t}\n\n\tget _pressable() {\n\t\treturn false;\n\t}\n\n\tget groupHeaderText() {\n\t\treturn ListItemGroupHeader.i18nBundle.getText(GROUP_HEADER_TEXT);\n\t}\n\n\tget ariaLabelText() {\n\t\treturn [this.textContent, this.accessibleName].filter(Boolean).join(\" \");\n\t}\n}\n\nListItemGroupHeader.define();\n\nexport default ListItemGroupHeader;\n"]}

package/dist/ListItemGroupHeaderTemplate.d.ts

@@ -0,0 +1,2 @@
+import type ListItemGroupHeader from "./ListItemGroupHeader.js";
+export default function ListItemGroupHeaderTemplate(this: ListItemGroupHeader): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ListItemGroupHeaderTemplate.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+export default function ListItemGroupHeaderTemplate() {
+    return (_jsx("ul", { role: "group", part: "native-li", tabindex: this.forcedTabIndex ? parseInt(this.forcedTabIndex) : undefined, class: {
+            "ui5-ghli-root": true,
+            ...this.classes.main,
+        }, "aria-label": this.ariaLabelText, "aria-roledescription": this.groupHeaderText, onFocusIn: this._onfocusin, onKeyDown: this._onkeydown, children: _jsx("div", { id: `${this._id}-content`, class: "ui5-li-content", children: _jsx("span", { class: "ui5-ghli-title", children: _jsx("slot", {}) }) }) }));
+}
+//# sourceMappingURL=ListItemGroupHeaderTemplate.js.map

package/dist/ListItemGroupHeaderTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemGroupHeaderTemplate.js","sourceRoot":"","sources":["../src/ListItemGroupHeaderTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,2BAA2B;IAClD,OAAO,CACN,aACC,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,SAAS,EACzE,KAAK,EAAE;YACN,eAAe,EAAE,IAAI;YACrB,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI;SACpB,gBACW,IAAI,CAAC,aAAa,0BACR,IAAI,CAAC,eAAe,EAC1C,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,SAAS,EAAE,IAAI,CAAC,UAAU,YAE1B,cAAK,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,EAAE,KAAK,EAAC,gBAAgB,YACrD,eAAM,KAAK,EAAC,gBAAgB,YAAC,gBAAa,GAAO,GAC5C,GACF,CACL,CAAC;AACH,CAAC","sourcesContent":["import type ListItemGroupHeader from \"./ListItemGroupHeader.js\";\n\nexport default function ListItemGroupHeaderTemplate(this: ListItemGroupHeader) {\n\treturn (\n\t\t<ul\n\t\t\trole=\"group\"\n\t\t\tpart=\"native-li\"\n\t\t\ttabindex={this.forcedTabIndex ? parseInt(this.forcedTabIndex) : undefined}\n\t\t\tclass={{\n\t\t\t\t\"ui5-ghli-root\": true,\n\t\t\t\t...this.classes.main,\n\t\t\t}}\n\t\t\taria-label={this.ariaLabelText}\n\t\t\taria-roledescription={this.groupHeaderText}\n\t\t\tonFocusIn={this._onfocusin}\n\t\t\tonKeyDown={this._onkeydown}\n\t\t>\n\t\t\t<div id={`${this._id}-content`} class=\"ui5-li-content\">\n\t\t\t\t<span class=\"ui5-ghli-title\"><slot></slot></span>\n\t\t\t</div>\n\t\t</ul>\n\t);\n}\n"]}

package/dist/ListItemGroupTemplate.d.ts

@@ -0,0 +1,4 @@
+import type ListItemGroup from "./ListItemGroup.js";
+export default function ListItemGroupTemplate(this: ListItemGroup, hooks?: {
+    items: () => void;
+}): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ListItemGroupTemplate.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import ListItemGroupHeader from "./ListItemGroupHeader.js";
+import DropIndicator from "./DropIndicator.js";
+export default function ListItemGroupTemplate(hooks) {
+    const items = hooks?.items || defaultItems;
+    return (_jsxs("ul", { role: "group", class: "ui5-group-li-root", onDragEnter: this._ondragenter, onDragOver: this._ondragover, onDrop: this._ondrop, onDragLeave: this._ondragleave, children: [this.hasHeader &&
+                _jsx(ListItemGroupHeader, { focused: this.focused, part: "header", children: this.hasFormattedHeader ? _jsx("slot", { name: "header" }) : this.headerText }), items.call(this), _jsx(DropIndicator, { orientation: "Horizontal", ownerReference: this })] }));
+}
+function defaultItems() {
+    return _jsx("slot", {});
+}
+//# sourceMappingURL=ListItemGroupTemplate.js.map

package/dist/ListItemGroupTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemGroupTemplate.js","sourceRoot":"","sources":["../src/ListItemGroupTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAC3D,OAAO,aAAa,MAAM,oBAAoB,CAAC;AAE/C,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAsB,KAA6B;IAC/F,MAAM,KAAK,GAAG,KAAK,EAAE,KAAK,IAAI,YAAY,CAAC;IAE3C,OAAO,CACN,cACC,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,mBAAmB,EACzB,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,WAAW,EAAE,IAAI,CAAC,YAAY,aAE7B,IAAI,CAAC,SAAS;gBACd,KAAC,mBAAmB,IAAC,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAC,QAAQ,YACtD,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,eAAM,IAAI,EAAC,QAAQ,GAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,GACpD,EAGrB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAElB,KAAC,aAAa,IAAC,WAAW,EAAC,YAAY,EAAC,cAAc,EAAE,IAAI,GAAG,IAC3D,CACL,CAAC;AACH,CAAC;AAED,SAAS,YAAY;IACpB,OAAO,gBAAa,CAAC;AACtB,CAAC","sourcesContent":["import type ListItemGroup from \"./ListItemGroup.js\";\nimport ListItemGroupHeader from \"./ListItemGroupHeader.js\";\nimport DropIndicator from \"./DropIndicator.js\";\n\nexport default function ListItemGroupTemplate(this: ListItemGroup, hooks?: { items: () => void }) {\n\tconst items = hooks?.items || defaultItems;\n\n\treturn (\n\t\t<ul\n\t\t\trole=\"group\"\n\t\t\tclass=\"ui5-group-li-root\"\n\t\t\tonDragEnter={this._ondragenter}\n\t\t\tonDragOver={this._ondragover}\n\t\t\tonDrop={this._ondrop}\n\t\t\tonDragLeave={this._ondragleave}\n\t\t>\n\t\t\t{this.hasHeader &&\n\t\t\t\t<ListItemGroupHeader focused={this.focused} part=\"header\">\n\t\t\t\t\t{ this.hasFormattedHeader ? <slot name=\"header\"></slot> : this.headerText }\n\t\t\t\t</ListItemGroupHeader>\n\t\t\t}\n\n\t\t\t{ items.call(this) }\n\n\t\t\t<DropIndicator orientation=\"Horizontal\" ownerReference={this}/>\n\t\t</ul>\n\t);\n}\n\nfunction defaultItems(this: ListItemGroup) {\n\treturn <slot></slot>;\n}\n"]}

package/dist/ListItemStandard.js

@@ -5,12 +5,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
 import ListItem from "./ListItem.js";
 import Icon from "./Icon.js";
 import Avatar from "./Avatar.js";
-import ListItemStandardTemplate from "./generated/templates/ListItemStandardTemplate.lit.js";
+import ListItemStandardTemplate from "./ListItemStandardTemplate.js";
 /**
  * @class
  * The `ui5-li` represents the simplest type of item for a `ui5-list`.
@@ -129,6 +130,7 @@ __decorate([
 ListItemStandard = __decorate([
     customElement({
         tag: "ui5-li",
+        renderer: jsxRenderer,
         template: ListItemStandardTemplate,
         dependencies: [
             ...ListItem.dependencies,

package/dist/ListItemStandard.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemStandard.js","sourceRoot":"","sources":["../src/ListItemStandard.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAEnE,OAAO,QAAQ,MAAM,eAAe,CAAC;AAErC,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,OAAO,wBAAwB,MAAM,uDAAuD,CAAC;AAE7F;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAUH,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,QAAQ;IAAvC;;QAsBC;;;;;WAKG;QAEH,YAAO,GAAG,KAAK,CAAC;QAWhB;;;;;;;WAOG;QAEH,wBAAmB,GAAoB,MAAM,CAAC;QAE9C;;;;;WAKG;QAEH,YAAO,GAAG,KAAK,CAAC;QAYhB;;;;;;;WAOG;QAEH,iBAAY,GAAsB,MAAM,CAAC;QAEzC;;;WAGG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAGjB,cAAS,GAAG,KAAK,CAAC;IA+BnB,CAAC;IAjBA,iBAAiB;QAChB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC;QACnC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC;IAChC,CAAC;IAED,IAAI,gBAAgB;QACnB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACvC,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC;IACtC,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;IAC5B,CAAC;CACD,CAAA;AAhHA;IADC,QAAQ,EAAE;qDACU;AAYrB;IADC,QAAQ,EAAE;8CACG;AASd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACZ;AAShB;IADC,QAAQ,EAAE;wDACa;AAWxB;IADC,QAAQ,EAAE;6DACmC;AAS9C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACZ;AAUR;IADP,QAAQ,EAAE;wDACqB;AAWhC;IADC,QAAQ,EAAE;sDAC8B;AAOzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mDACV;AAYlB;IADC,IAAI,EAAE;+CACoB;AArGtB,gBAAgB;IATrB,aAAa,CAAC;QACd,GAAG,EAAE,QAAQ;QACb,QAAQ,EAAE,wBAAwB;QAClC,YAAY,EAAE;YACb,GAAG,QAAQ,CAAC,YAAY;YACxB,IAAI;YACJ,MAAM;SACN;KACD,CAAC;GACI,gBAAgB,CAwHrB;AAED,gBAAgB,CAAC,MAAM,EAAE,CAAC;AAE1B,eAAe,gBAAgB,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport type ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport ListItem from \"./ListItem.js\";\nimport type { IAccessibleListItem } from \"./ListItem.js\";\nimport Icon from \"./Icon.js\";\nimport Avatar from \"./Avatar.js\";\nimport type WrappingType from \"./types/WrappingType.js\";\nimport ListItemStandardTemplate from \"./generated/templates/ListItemStandardTemplate.lit.js\";\n\n/**\n * @class\n * The `ui5-li` represents the simplest type of item for a `ui5-list`.\n *\n * This is a list item,\n * providing the most common use cases such as `text`,\n * `image` and `icon`.\n\n * @csspart title - Used to style the title of the list item\n * @csspart description - Used to style the description of the list item\n * @csspart additional-text - Used to style the additionalText of the list item\n * @csspart icon - Used to style the icon of the list item\n * @csspart native-li - Used to style the main li tag of the list item\n * @csspart content - Used to style the content area of the list item\n * @csspart detail-button - Used to style the button rendered when the list item is of type detail\n * @csspart delete-button - Used to style the button rendered when the list item is in delete mode\n * @csspart radio - Used to style the radio button rendered when the list item is in single selection mode\n * @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode\n * @slot {Node[]} default - Defines the text of the component.\n *\n * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n * @constructor\n * @extends ListItem\n * @public\n */\n@customElement({\n\ttag: \"ui5-li\",\n\ttemplate: ListItemStandardTemplate,\n\tdependencies: [\n\t\t...ListItem.dependencies,\n\t\tIcon,\n\t\tAvatar,\n\t],\n})\nclass ListItemStandard extends ListItem implements IAccessibleListItem {\n\t/**\n\t * Defines the description displayed right under the item text, if such is present.\n\t * @default undefined\n\t * @public\n\t * @since 0.8.0\n\t */\n\t@property()\n\tdescription?: string;\n\n\t/**\n\t * Defines the `icon` source URI.\n\t *\n\t * **Note:**\n\t * SAP-icons font provides numerous built-in icons. To find all the available icons, see the\n\t * [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\ticon?: string;\n\n\t/**\n\t * Defines whether the `icon` should be displayed in the beginning of the list item or in the end.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\ticonEnd = false;\n\n\t/**\n\t * Defines the `additionalText`, displayed in the end of the list item.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tadditionalText?: string;\n\n\t/**\n\t * Defines the state of the `additionalText`.\n\t *\n\t * Available options are: `\"None\"` (by default), `\"Positive\"`, `\"Critical\"`, `\"Information\"` and `\"Negative\"`.\n\t * @default \"None\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tadditionalTextState: `${ValueState}` = \"None\";\n\n\t/**\n\t * Defines whether the item is movable.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tmovable = false;\n\n\t/**\n\t * Defines the text alternative of the component.\n\t * Note: If not provided a default text alternative will be set, if present.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tdeclare accessibleName?: string;\n\n\t/**\n\t * Defines if the text of the component should wrap, they truncate by default.\n\t *\n\t * **Note:** this property takes affect only if text node is provided to default slot of the component\n\t * @default \"None\"\n\t * @private\n\t * @since 1.5.0\n\t */\n\t@property()\n\twrappingType: `${WrappingType}` = \"None\";\n\n\t/**\n\t * Indicates if the list item has text content.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\thasTitle = false;\n\n\t@property({ type: Boolean })\n\t_hasImage = false;\n\n\t/**\n\t * **Note:** While the slot allows option for setting custom avatar, to match the\n\t * design guidelines, please use the `ui5-avatar` with it's default size - S.\n\t *\n\t * **Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n\t * `ui5-li` should be customized in order to fit.\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@slot()\n\timage!: Array<HTMLElement>;\n\n\tonBeforeRendering() {\n\t\tsuper.onBeforeRendering();\n\t\tthis.hasTitle = !!this.textContent;\n\t\tthis._hasImage = this.hasImage;\n\t}\n\n\tget displayIconBegin(): boolean {\n\t\treturn !!(this.icon && !this.iconEnd);\n\t}\n\n\tget displayIconEnd(): boolean {\n\t\treturn !!(this.icon && this.iconEnd);\n\t}\n\n\tget hasImage(): boolean {\n\t\treturn !!this.image.length;\n\t}\n}\n\nListItemStandard.define();\n\nexport default ListItemStandard;\n"]}
+{"version":3,"file":"ListItemStandard.js","sourceRoot":"","sources":["../src/ListItemStandard.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAC/E,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAEnE,OAAO,QAAQ,MAAM,eAAe,CAAC;AAErC,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,OAAO,wBAAwB,MAAM,+BAA+B,CAAC;AAErE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAWH,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,QAAQ;IAAvC;;QAsBC;;;;;WAKG;QAEH,YAAO,GAAG,KAAK,CAAC;QAWhB;;;;;;;WAOG;QAEH,wBAAmB,GAAoB,MAAM,CAAC;QAE9C;;;;;WAKG;QAEH,YAAO,GAAG,KAAK,CAAC;QAYhB;;;;;;;WAOG;QAEH,iBAAY,GAAsB,MAAM,CAAC;QAEzC;;;WAGG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAGjB,cAAS,GAAG,KAAK,CAAC;IA+BnB,CAAC;IAjBA,iBAAiB;QAChB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC;QACnC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC;IAChC,CAAC;IAED,IAAI,gBAAgB;QACnB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACvC,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC;IACtC,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;IAC5B,CAAC;CACD,CAAA;AAhHA;IADC,QAAQ,EAAE;qDACU;AAYrB;IADC,QAAQ,EAAE;8CACG;AASd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACZ;AAShB;IADC,QAAQ,EAAE;wDACa;AAWxB;IADC,QAAQ,EAAE;6DACmC;AAS9C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACZ;AAUR;IADP,QAAQ,EAAE;wDACqB;AAWhC;IADC,QAAQ,EAAE;sDAC8B;AAOzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mDACV;AAYlB;IADC,IAAI,EAAE;+CACoB;AArGtB,gBAAgB;IAVrB,aAAa,CAAC;QACd,GAAG,EAAE,QAAQ;QACb,QAAQ,EAAE,WAAW;QACrB,QAAQ,EAAE,wBAAwB;QAClC,YAAY,EAAE;YACb,GAAG,QAAQ,CAAC,YAAY;YACxB,IAAI;YACJ,MAAM;SACN;KACD,CAAC;GACI,gBAAgB,CAwHrB;AAED,gBAAgB,CAAC,MAAM,EAAE,CAAC;AAE1B,eAAe,gBAAgB,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport type ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport ListItem from \"./ListItem.js\";\nimport type { IAccessibleListItem } from \"./ListItem.js\";\nimport Icon from \"./Icon.js\";\nimport Avatar from \"./Avatar.js\";\nimport type WrappingType from \"./types/WrappingType.js\";\nimport ListItemStandardTemplate from \"./ListItemStandardTemplate.js\";\n\n/**\n * @class\n * The `ui5-li` represents the simplest type of item for a `ui5-list`.\n *\n * This is a list item,\n * providing the most common use cases such as `text`,\n * `image` and `icon`.\n\n * @csspart title - Used to style the title of the list item\n * @csspart description - Used to style the description of the list item\n * @csspart additional-text - Used to style the additionalText of the list item\n * @csspart icon - Used to style the icon of the list item\n * @csspart native-li - Used to style the main li tag of the list item\n * @csspart content - Used to style the content area of the list item\n * @csspart detail-button - Used to style the button rendered when the list item is of type detail\n * @csspart delete-button - Used to style the button rendered when the list item is in delete mode\n * @csspart radio - Used to style the radio button rendered when the list item is in single selection mode\n * @csspart checkbox - Used to style the checkbox rendered when the list item is in multiple selection mode\n * @slot {Node[]} default - Defines the text of the component.\n *\n * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n * @constructor\n * @extends ListItem\n * @public\n */\n@customElement({\n\ttag: \"ui5-li\",\n\trenderer: jsxRenderer,\n\ttemplate: ListItemStandardTemplate,\n\tdependencies: [\n\t\t...ListItem.dependencies,\n\t\tIcon,\n\t\tAvatar,\n\t],\n})\nclass ListItemStandard extends ListItem implements IAccessibleListItem {\n\t/**\n\t * Defines the description displayed right under the item text, if such is present.\n\t * @default undefined\n\t * @public\n\t * @since 0.8.0\n\t */\n\t@property()\n\tdescription?: string;\n\n\t/**\n\t * Defines the `icon` source URI.\n\t *\n\t * **Note:**\n\t * SAP-icons font provides numerous built-in icons. To find all the available icons, see the\n\t * [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\ticon?: string;\n\n\t/**\n\t * Defines whether the `icon` should be displayed in the beginning of the list item or in the end.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\ticonEnd = false;\n\n\t/**\n\t * Defines the `additionalText`, displayed in the end of the list item.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tadditionalText?: string;\n\n\t/**\n\t * Defines the state of the `additionalText`.\n\t *\n\t * Available options are: `\"None\"` (by default), `\"Positive\"`, `\"Critical\"`, `\"Information\"` and `\"Negative\"`.\n\t * @default \"None\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tadditionalTextState: `${ValueState}` = \"None\";\n\n\t/**\n\t * Defines whether the item is movable.\n\t * @default false\n\t * @public\n\t * @since 2.0.0\n\t */\n\t@property({ type: Boolean })\n\tmovable = false;\n\n\t/**\n\t * Defines the text alternative of the component.\n\t * Note: If not provided a default text alternative will be set, if present.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property()\n\tdeclare accessibleName?: string;\n\n\t/**\n\t * Defines if the text of the component should wrap, they truncate by default.\n\t *\n\t * **Note:** this property takes affect only if text node is provided to default slot of the component\n\t * @default \"None\"\n\t * @private\n\t * @since 1.5.0\n\t */\n\t@property()\n\twrappingType: `${WrappingType}` = \"None\";\n\n\t/**\n\t * Indicates if the list item has text content.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\thasTitle = false;\n\n\t@property({ type: Boolean })\n\t_hasImage = false;\n\n\t/**\n\t * **Note:** While the slot allows option for setting custom avatar, to match the\n\t * design guidelines, please use the `ui5-avatar` with it's default size - S.\n\t *\n\t * **Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n\t * `ui5-li` should be customized in order to fit.\n\t * @since 2.0.0\n\t * @public\n\t */\n\t@slot()\n\timage!: Array<HTMLElement>;\n\n\tonBeforeRendering() {\n\t\tsuper.onBeforeRendering();\n\t\tthis.hasTitle = !!this.textContent;\n\t\tthis._hasImage = this.hasImage;\n\t}\n\n\tget displayIconBegin(): boolean {\n\t\treturn !!(this.icon && !this.iconEnd);\n\t}\n\n\tget displayIconEnd(): boolean {\n\t\treturn !!(this.icon && this.iconEnd);\n\t}\n\n\tget hasImage(): boolean {\n\t\treturn !!this.image.length;\n\t}\n}\n\nListItemStandard.define();\n\nexport default ListItemStandard;\n"]}

package/dist/ListItemStandardTemplate.d.ts

@@ -0,0 +1,3 @@
+import type ListItemStandard from "./ListItemStandard.js";
+import type { ListItemHooks } from "./ListItemTemplate.js";
+export default function ListItemStandardTemplate(this: ListItemStandard, hooks?: Partial<ListItemHooks>): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ListItemStandardTemplate.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ui5/webcomponents-base/jsx-runtime";
+import Icon from "./Icon.js";
+import ListItemTemplate from "./ListItemTemplate.js";
+const predefinedHooks = {
+    imageBegin,
+    iconBegin,
+    iconEnd,
+    listItemContent
+};
+export default function ListItemStandardTemplate(hooks) {
+    const currentHooks = { ...predefinedHooks, ...hooks };
+    return ListItemTemplate.call(this, currentHooks);
+}
+function listItemContent() {
+    return _jsxs(_Fragment, { children: [_jsxs("div", { class: "ui5-li-text-wrapper", children: [_jsx("span", { part: "title", class: "ui5-li-title", children: _jsx("slot", {}) }), this.description && (_jsxs("div", { class: "ui5-li-description-info-wrapper", children: [_jsx("span", { part: "description", class: "ui5-li-desc", children: this.description }), this.additionalText && (_jsx("span", { part: "additional-text", class: "ui5-li-additional-text", children: this.additionalText }))] })), !this.typeActive && _jsx("span", { class: "ui5-hidden-text", children: this.type })] }), !this.description && this.additionalText && (_jsx("span", { part: "additional-text", class: "ui5-li-additional-text", children: this.additionalText }))] });
+}
+function imageBegin() {
+    if (this.hasImage) {
+        return _jsx("div", { class: "ui5-li-image", children: _jsx("slot", { name: "image" }) });
+    }
+}
+function iconBegin() {
+    if (this.displayIconBegin) {
+        return _jsx(Icon, { part: "icon", name: this.icon, class: "ui5-li-icon", mode: "Decorative" });
+    }
+}
+function iconEnd() {
+    if (this.displayIconEnd) {
+        return _jsx(Icon, { part: "icon", name: this.icon, class: "ui5-li-icon", mode: "Decorative" });
+    }
+}
+//# sourceMappingURL=ListItemStandardTemplate.js.map

package/dist/ListItemStandardTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemStandardTemplate.js","sourceRoot":"","sources":["../src/ListItemStandardTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,WAAW,CAAC;AAE7B,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AAGrD,MAAM,eAAe,GAA2B;IAC/C,UAAU;IACV,SAAS;IACT,OAAO;IACP,eAAe;CACf,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,wBAAwB,CAAyB,KAA8B;IACtG,MAAM,YAAY,GAAG,EAAE,GAAG,eAAe,EAAE,GAAG,KAAK,EAAE,CAAC;IAEtD,OAAO,gBAAgB,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;AAClD,CAAC;AAED,SAAS,eAAe;IACvB,OAAO,8BACN,eAAK,KAAK,EAAC,qBAAqB,aAC/B,eAAM,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,cAAc,YACtC,gBAAa,GACP,EACN,IAAI,CAAC,WAAW,IAAI,CACpB,eAAK,KAAK,EAAC,iCAAiC,aAC3C,eAAM,IAAI,EAAC,aAAa,EAAC,KAAK,EAAC,aAAa,YAAE,IAAI,CAAC,WAAW,GAAQ,EAErE,IAAI,CAAC,cAAc,IAAI,CACtB,eAAM,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,wBAAwB,YAAE,IAAI,CAAC,cAAc,GAAQ,CACxF,IAEG,CACN,EAEA,CAAC,IAAI,CAAC,UAAU,IAAI,eAAM,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,IAAI,GAAQ,IAChE,EAEL,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,cAAc,IAAI,CAC5C,eAAM,IAAI,EAAC,iBAAiB,EAAC,KAAK,EAAC,wBAAwB,YAAE,IAAI,CAAC,cAAc,GAAQ,CACxF,IACC,CAAC;AACL,CAAC;AAED,SAAS,UAAU;IAClB,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;QACnB,OAAO,cAAK,KAAK,EAAC,cAAc,YAC/B,eAAM,IAAI,EAAC,OAAO,GAAQ,GACrB,CAAC;IACR,CAAC;AACF,CAAC;AAED,SAAS,SAAS;IACjB,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC3B,OAAO,KAAC,IAAI,IACX,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,YAAY,GAAG,CAAC;IACvB,CAAC;AACF,CAAC;AAED,SAAS,OAAO;IACf,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;QACzB,OAAO,KAAC,IAAI,IACX,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,YAAY,GAAG,CAAC;IACvB,CAAC;AACF,CAAC","sourcesContent":["import Icon from \"./Icon.js\";\nimport type ListItemStandard from \"./ListItemStandard.js\";\nimport ListItemTemplate from \"./ListItemTemplate.js\";\nimport type { ListItemHooks } from \"./ListItemTemplate.js\";\n\nconst predefinedHooks: Partial<ListItemHooks> = {\n\timageBegin,\n\ticonBegin,\n\ticonEnd,\n\tlistItemContent\n};\n\nexport default function ListItemStandardTemplate(this: ListItemStandard, hooks?: Partial<ListItemHooks>) {\n\tconst currentHooks = { ...predefinedHooks, ...hooks };\n\n\treturn ListItemTemplate.call(this, currentHooks);\n}\n\nfunction listItemContent(this: ListItemStandard) {\n\treturn <>\n\t\t<div class=\"ui5-li-text-wrapper\">\n\t\t\t<span part=\"title\" class=\"ui5-li-title\">\n\t\t\t\t<slot></slot>\n\t\t\t</span>\n\t\t\t{this.description && (\n\t\t\t\t<div class=\"ui5-li-description-info-wrapper\">\n\t\t\t\t\t<span part=\"description\" class=\"ui5-li-desc\">{this.description}</span>\n\t\t\t\t\t{\n\t\t\t\t\t\tthis.additionalText && (\n\t\t\t\t\t\t\t<span part=\"additional-text\" class=\"ui5-li-additional-text\">{this.additionalText}</span>\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{!this.typeActive && <span class=\"ui5-hidden-text\">{this.type}</span>}\n\t\t</div>\n\n\t\t{!this.description && this.additionalText && (\n\t\t\t<span part=\"additional-text\" class=\"ui5-li-additional-text\">{this.additionalText}</span>\n\t\t)}\n\t</>;\n}\n\nfunction imageBegin(this: ListItemStandard) {\n\tif (this.hasImage) {\n\t\treturn <div class=\"ui5-li-image\">\n\t\t\t<slot name=\"image\"></slot>\n\t\t</div>;\n\t}\n}\n\nfunction iconBegin(this: ListItemStandard) {\n\tif (this.displayIconBegin) {\n\t\treturn <Icon\n\t\t\tpart=\"icon\"\n\t\t\tname={this.icon}\n\t\t\tclass=\"ui5-li-icon\"\n\t\t\tmode=\"Decorative\" />;\n\t}\n}\n\nfunction iconEnd(this: ListItemStandard) {\n\tif (this.displayIconEnd) {\n\t\treturn <Icon\n\t\t\tpart=\"icon\"\n\t\t\tname={this.icon}\n\t\t\tclass=\"ui5-li-icon\"\n\t\t\tmode=\"Decorative\" />;\n\t}\n}\n"]}

package/dist/ListItemTemplate.d.ts

@@ -0,0 +1,11 @@
+import type { JsxTemplate } from "@ui5/webcomponents-base/dist/index.js";
+import type ListItem from "./ListItem.js";
+export type ListItemHooks = {
+    listItemPreContent: JsxTemplate;
+    listItemContent: JsxTemplate;
+    imageBegin: JsxTemplate;
+    iconBegin: JsxTemplate;
+    iconEnd: JsxTemplate;
+    selectionElement: JsxTemplate;
+};
+export default function ListItemTemplate(this: ListItem, hooks?: Partial<ListItemHooks>): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ListItemTemplate.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import Button from "./Button.js";
+import Icon from "./Icon.js";
+import editIcon from "@ui5/webcomponents-icons/dist/edit.js";
+import slimArrowRightIcon from "@ui5/webcomponents-icons/dist/slim-arrow-right.js";
+import declineIcon from "@ui5/webcomponents-icons/dist/decline.js";
+import RadioButton from "./RadioButton.js";
+import CheckBox from "./CheckBox.js";
+const predefinedHooks = {
+    listItemPreContent,
+    listItemContent,
+    imageBegin,
+    iconBegin,
+    iconEnd,
+    selectionElement,
+};
+export default function ListItemTemplate(hooks) {
+    const currentHooks = { ...predefinedHooks, ...hooks };
+    return _jsxs("li", { part: "native-li", "data-sap-focus-ref": true, tabindex: this._effectiveTabIndex, class: this.classes.main, onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, onKeyUp: this._onkeyup, onKeyDown: this._onkeydown, onMouseUp: this._onmouseup, onMouseDown: this._onmousedown, onTouchStart: this._onmousedown, onTouchEnd: this._ontouchend, onClick: this._onclick, draggable: this.movable, onDragStart: this._ondragstart, onDragEnd: this._ondragend, role: this._accInfo.role, title: this._accInfo.tooltip, "aria-expanded": this._accInfo.ariaExpanded, "aria-level": this._accInfo.ariaLevel, "aria-haspopup": this._accInfo.ariaHaspopup, "aria-posinset": this._accInfo.posinset, "aria-setsize": this._accInfo.setsize, "aria-describedby": `${this._id}-invisibleText-describedby`, "aria-labelledby": this._accessibleNameRef, "aria-disabled": this._ariaDisabled, "aria-selected": this._accInfo.ariaSelected, "aria-checked": this._accInfo.ariaChecked, "aria-owns": this._accInfo.ariaOwns, "aria-keyshortcuts": this._accInfo.ariaKeyShortcuts, children: [currentHooks.listItemPreContent.call(this), this.placeSelectionElementBefore && selectionElement.call(this), this._hasHighlightColor && _jsx("div", { class: "ui5-li-highlight" }), _jsxs("div", { part: "content", id: `${this._id}-content`, class: "ui5-li-content", children: [currentHooks.imageBegin.call(this), currentHooks.iconBegin.call(this), currentHooks.listItemContent.call(this)] }), currentHooks.iconEnd.call(this), this.typeDetail && (_jsx("div", { class: "ui5-li-detailbtn", children: _jsx(Button, { part: "detail-button", design: "Transparent", onClick: this.onDetailClick, icon: editIcon }) })), this.typeNavigation && (_jsx(Icon, { name: slimArrowRightIcon })), this.navigated && (_jsx("div", { class: "ui5-li-navigated" })), this.placeSelectionElementAfter && (currentHooks.selectionElement.call(this)), _jsxs("span", { id: `${this._id}-invisibleText`, class: "ui5-hidden-text", children: [this._accInfo.listItemAriaLabel, this.accessibleName] }), _jsx("span", { id: `${this._id}-invisibleText-describedby`, class: "ui5-hidden-text", children: this._accInfo.ariaSelectedText })] });
+}
+function listItemPreContent() { }
+function listItemContent() { }
+function imageBegin() { }
+function iconBegin() { }
+function iconEnd() { }
+function selectionElement() {
+    switch (true) {
+        case this.modeSingleSelect:
+            return (_jsx(RadioButton, { part: "radio", disabled: this.isInactive, accessibleName: this._accInfo.ariaLabelRadioButton, tabindex: -1, id: `${this._id}-singleSelectionElement`, class: "ui5-li-singlesel-radiobtn", checked: this.selected, onChange: this.onSingleSelectionComponentPress }));
+        case this.modeMultiple:
+            return (_jsx(CheckBox, { part: "checkbox", disabled: this.isInactive, indeterminate: this.indeterminate, tabindex: -1, id: `${this._id}-multiSelectionElement`, class: "ui5-li-multisel-cb", checked: this.selected, accessibleName: this._accInfo.ariaLabel, onChange: this.onMultiSelectionComponentPress }));
+        case this.renderDeleteButton:
+            return (_jsx("div", { class: "ui5-li-deletebtn", children: this.hasDeleteButtonSlot ?
+                    (_jsx("slot", { name: "deleteButton" })) : (_jsx(Button, { part: "delete-button", tabindex: -1, "data-sap-no-tab-ref": true, id: `${this._id}-deleteSelectionElement`, design: "Transparent", icon: declineIcon, disabled: this.disableDeleteButton, onClick: this.onDelete, tooltip: this.deleteText })) }));
+    }
+}
+//# sourceMappingURL=ListItemTemplate.js.map

package/dist/ListItemTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemTemplate.js","sourceRoot":"","sources":["../src/ListItemTemplate.tsx"],"names":[],"mappings":";AAEA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,QAAQ,MAAM,uCAAuC,CAAC;AAC7D,OAAO,kBAAkB,MAAM,mDAAmD,CAAC;AACnF,OAAO,WAAW,MAAM,0CAA0C,CAAC;AACnE,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAC3C,OAAO,QAAQ,MAAM,eAAe,CAAC;AAWrC,MAAM,eAAe,GAAkB;IACtC,kBAAkB;IAClB,eAAe;IACf,UAAU;IACV,SAAS;IACT,OAAO;IACP,gBAAgB;CAChB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAiB,KAA8B;IACtF,MAAM,YAAY,GAAG,EAAE,GAAG,eAAe,EAAE,GAAG,KAAK,EAAE,CAAC;IAEtD,OAAO,cACN,IAAI,EAAC,WAAW,8BAEhB,QAAQ,EAAE,IAAI,CAAC,kBAAkB,EACjC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EACxB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,SAAS,EAAE,IAAI,CAAC,OAAO,EACvB,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,EACxB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,mBACb,IAAI,CAAC,QAAQ,CAAC,YAAY,gBAC7B,IAAI,CAAC,QAAQ,CAAC,SAAS,mBACpB,IAAI,CAAC,QAAQ,CAAC,YAAY,mBAC1B,IAAI,CAAC,QAAQ,CAAC,QAAQ,kBACvB,IAAI,CAAC,QAAQ,CAAC,OAAO,sBACjB,GAAG,IAAI,CAAC,GAAG,4BAA4B,qBACxC,IAAI,CAAC,kBAAkB,mBACzB,IAAI,CAAC,aAAa,mBAClB,IAAI,CAAC,QAAQ,CAAC,YAAY,kBAC3B,IAAI,CAAC,QAAQ,CAAC,WAAW,eAC5B,IAAI,CAAC,QAAQ,CAAC,QAAQ,uBACd,IAAI,CAAC,QAAQ,CAAC,gBAAgB,aAEhD,YAAY,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,EAE1C,IAAI,CAAC,2BAA2B,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EAE/D,IAAI,CAAC,kBAAkB,IAAI,cAAK,KAAK,EAAC,kBAAkB,GAAO,EAEhE,eAAK,IAAI,EAAC,SAAS,EAAC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,EAAE,KAAK,EAAC,gBAAgB,aACnE,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAClC,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,EACjC,YAAY,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,IACnC,EAEL,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAE/B,IAAI,CAAC,UAAU,IAAI,CACnB,cAAK,KAAK,EAAC,kBAAkB,YAC5B,KAAC,MAAM,IACN,IAAI,EAAC,eAAe,EACpB,MAAM,EAAC,aAAa,EACpB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,IAAI,EAAE,QAAQ,GACb,GACG,CACN,EAEA,IAAI,CAAC,cAAc,IAAI,CACvB,KAAC,IAAI,IAAC,IAAI,EAAE,kBAAkB,GAAI,CAClC,EAEA,IAAI,CAAC,SAAS,IAAI,CAClB,cAAK,KAAK,EAAC,kBAAkB,GAAO,CACpC,EAEA,IAAI,CAAC,0BAA0B,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,EAE9E,gBACC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,gBAAgB,EAC/B,KAAK,EAAC,iBAAiB,aACtB,IAAI,CAAC,QAAQ,CAAC,iBAAiB,EAC/B,IAAI,CAAC,cAAc,IACd,EACP,eACC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,4BAA4B,EAC3C,KAAK,EAAC,iBAAiB,YACtB,IAAI,CAAC,QAAQ,CAAC,gBAAgB,GACzB,IAEF,CAAC;AACR,CAAC;AAED,SAAS,kBAAkB,KAAmB,CAAC;AAC/C,SAAS,eAAe,KAAmB,CAAC;AAC5C,SAAS,UAAU,KAAmB,CAAC;AACvC,SAAS,SAAS,KAAmB,CAAC;AACtC,SAAS,OAAO,KAAmB,CAAC;AACpC,SAAS,gBAAgB;IACxB,QAAQ,IAAI,EAAE,CAAC;QACf,KAAK,IAAI,CAAC,gBAAgB;YACzB,OAAO,CACN,KAAC,WAAW,IACX,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,IAAI,CAAC,UAAU,EACzB,cAAc,EAAE,IAAI,CAAC,QAAQ,CAAC,oBAAoB,EAClD,QAAQ,EAAE,CAAC,CAAC,EACZ,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,yBAAyB,EACxC,KAAK,EAAC,2BAA2B,EACjC,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,QAAQ,EAAE,IAAI,CAAC,+BAA+B,GAC7C,CACF,CAAC;QACH,KAAK,IAAI,CAAC,YAAY;YACrB,OAAO,CACN,KAAC,QAAQ,IACR,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,CAAC,UAAU,EACzB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,QAAQ,EAAE,CAAC,CAAC,EACZ,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,wBAAwB,EACvC,KAAK,EAAC,oBAAoB,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,cAAc,EAAE,IAAI,CAAC,QAAQ,CAAC,SAAS,EACvC,QAAQ,EAAE,IAAI,CAAC,8BAA8B,GAC5C,CACF,CAAC;QACH,KAAK,IAAI,CAAC,kBAAkB;YAC3B,OAAO,CACN,cAAK,KAAK,EAAC,kBAAkB,YAE3B,IAAI,CAAC,mBAAmB,CAAC,CAAC;oBACzB,CACC,eAAM,IAAI,EAAC,cAAc,GAAQ,CACjC,CAAC,CAAC,CAAC,CACH,KAAC,MAAM,IACN,IAAI,EAAC,eAAe,EACpB,QAAQ,EAAE,CAAC,CAAC,+BAEZ,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,yBAAyB,EACxC,MAAM,EAAC,aAAa,EACpB,IAAI,EAAE,WAAW,EACjB,QAAQ,EAAE,IAAI,CAAC,mBAAmB,EAClC,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,UAAU,GACvB,CACF,GAEG,CACP,CAAC;IACH,CAAC;AACF,CAAC","sourcesContent":["import type { JsxTemplate } from \"@ui5/webcomponents-base/dist/index.js\";\nimport type ListItem from \"./ListItem.js\";\nimport Button from \"./Button.js\";\nimport Icon from \"./Icon.js\";\nimport editIcon from \"@ui5/webcomponents-icons/dist/edit.js\";\nimport slimArrowRightIcon from \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\nimport declineIcon from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport RadioButton from \"./RadioButton.js\";\nimport CheckBox from \"./CheckBox.js\";\n\nexport type ListItemHooks = {\n\tlistItemPreContent: JsxTemplate\n\tlistItemContent: JsxTemplate\n\timageBegin: JsxTemplate\n\ticonBegin: JsxTemplate\n\ticonEnd: JsxTemplate\n\tselectionElement: JsxTemplate\n}\n\nconst predefinedHooks: ListItemHooks = {\n\tlistItemPreContent,\n\tlistItemContent,\n\timageBegin,\n\ticonBegin,\n\ticonEnd,\n\tselectionElement,\n};\n\nexport default function ListItemTemplate(this: ListItem, hooks?: Partial<ListItemHooks>) {\n\tconst currentHooks = { ...predefinedHooks, ...hooks };\n\n\treturn <li\n\t\tpart=\"native-li\"\n\t\tdata-sap-focus-ref\n\t\ttabindex={this._effectiveTabIndex}\n\t\tclass={this.classes.main}\n\t\tonFocusIn={this._onfocusin}\n\t\tonFocusOut={this._onfocusout}\n\t\tonKeyUp={this._onkeyup}\n\t\tonKeyDown={this._onkeydown}\n\t\tonMouseUp={this._onmouseup}\n\t\tonMouseDown={this._onmousedown}\n\t\tonTouchStart={this._onmousedown}\n\t\tonTouchEnd={this._ontouchend}\n\t\tonClick={this._onclick}\n\t\tdraggable={this.movable}\n\t\tonDragStart={this._ondragstart}\n\t\tonDragEnd={this._ondragend}\n\t\trole={this._accInfo.role}\n\t\ttitle={this._accInfo.tooltip}\n\t\taria-expanded={this._accInfo.ariaExpanded}\n\t\taria-level={this._accInfo.ariaLevel}\n\t\taria-haspopup={this._accInfo.ariaHaspopup}\n\t\taria-posinset={this._accInfo.posinset}\n\t\taria-setsize={this._accInfo.setsize}\n\t\taria-describedby={`${this._id}-invisibleText-describedby`}\n\t\taria-labelledby={this._accessibleNameRef}\n\t\taria-disabled={this._ariaDisabled}\n\t\taria-selected={this._accInfo.ariaSelected}\n\t\taria-checked={this._accInfo.ariaChecked}\n\t\taria-owns={this._accInfo.ariaOwns}\n\t\taria-keyshortcuts={this._accInfo.ariaKeyShortcuts}\n\t>\n\t\t{currentHooks.listItemPreContent.call(this)}\n\n\t\t{this.placeSelectionElementBefore && selectionElement.call(this)}\n\n\t\t{this._hasHighlightColor && <div class=\"ui5-li-highlight\"></div>}\n\n\t\t<div part=\"content\" id={`${this._id}-content`} class=\"ui5-li-content\">\n\t\t\t{currentHooks.imageBegin.call(this)}\n\t\t\t{currentHooks.iconBegin.call(this)}\n\t\t\t{currentHooks.listItemContent.call(this)}\n\t\t</div>\n\n\t\t{currentHooks.iconEnd.call(this)}\n\n\t\t{this.typeDetail && (\n\t\t\t<div class=\"ui5-li-detailbtn\">\n\t\t\t\t<Button\n\t\t\t\t\tpart=\"detail-button\"\n\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\tonClick={this.onDetailClick}\n\t\t\t\t\ticon={editIcon}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t)}\n\n\t\t{this.typeNavigation && (\n\t\t\t<Icon name={slimArrowRightIcon} />\n\t\t)}\n\n\t\t{this.navigated && (\n\t\t\t<div class=\"ui5-li-navigated\"></div>\n\t\t)}\n\n\t\t{this.placeSelectionElementAfter && (currentHooks.selectionElement.call(this))}\n\n\t\t<span\n\t\t\tid={`${this._id}-invisibleText`}\n\t\t\tclass=\"ui5-hidden-text\">\n\t\t\t{this._accInfo.listItemAriaLabel}\n\t\t\t{this.accessibleName}\n\t\t</span>\n\t\t<span\n\t\t\tid={`${this._id}-invisibleText-describedby`}\n\t\t\tclass=\"ui5-hidden-text\">\n\t\t\t{this._accInfo.ariaSelectedText}\n\t\t</span>\n\n\t</li >;\n}\n\nfunction listItemPreContent(this: ListItem) { }\nfunction listItemContent(this: ListItem) { }\nfunction imageBegin(this: ListItem) { }\nfunction iconBegin(this: ListItem) { }\nfunction iconEnd(this: ListItem) { }\nfunction selectionElement(this: ListItem) {\n\tswitch (true) {\n\tcase this.modeSingleSelect:\n\t\treturn (\n\t\t\t<RadioButton\n\t\t\t\tpart=\"radio\"\n\t\t\t\tdisabled={this.isInactive}\n\t\t\t\taccessibleName={this._accInfo.ariaLabelRadioButton}\n\t\t\t\ttabindex={-1}\n\t\t\t\tid={`${this._id}-singleSelectionElement`}\n\t\t\t\tclass=\"ui5-li-singlesel-radiobtn\"\n\t\t\t\tchecked={this.selected}\n\t\t\t\tonChange={this.onSingleSelectionComponentPress}\n\t\t\t/>\n\t\t);\n\tcase this.modeMultiple:\n\t\treturn (\n\t\t\t<CheckBox\n\t\t\t\tpart=\"checkbox\"\n\t\t\t\tdisabled={this.isInactive}\n\t\t\t\tindeterminate={this.indeterminate}\n\t\t\t\ttabindex={-1}\n\t\t\t\tid={`${this._id}-multiSelectionElement`}\n\t\t\t\tclass=\"ui5-li-multisel-cb\"\n\t\t\t\tchecked={this.selected}\n\t\t\t\taccessibleName={this._accInfo.ariaLabel}\n\t\t\t\tonChange={this.onMultiSelectionComponentPress}\n\t\t\t/>\n\t\t);\n\tcase this.renderDeleteButton:\n\t\treturn (\n\t\t\t<div class=\"ui5-li-deletebtn\">\n\t\t\t\t{\n\t\t\t\t\tthis.hasDeleteButtonSlot ?\n\t\t\t\t\t\t(\n\t\t\t\t\t\t\t<slot name=\"deleteButton\"></slot>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tpart=\"delete-button\"\n\t\t\t\t\t\t\t\ttabindex={-1}\n\t\t\t\t\t\t\t\tdata-sap-no-tab-ref\n\t\t\t\t\t\t\t\tid={`${this._id}-deleteSelectionElement`}\n\t\t\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\t\t\ticon={declineIcon}\n\t\t\t\t\t\t\t\tdisabled={this.disableDeleteButton}\n\t\t\t\t\t\t\t\tonClick={this.onDelete}\n\t\t\t\t\t\t\t\ttooltip={this.deleteText}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t</div >\n\t\t);\n\t}\n}\n"]}

package/dist/ListTemplate.d.ts

@@ -0,0 +1,2 @@
+import type List from "./List.js";
+export default function ListTemplate(this: List): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;