@openui5/sap.ui.webc.main 1.115.1 → 1.116.0

package/src/sap/ui/webc/main/thirdparty/TreeItem.js

@@ -1,185 +1,71 @@
-sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/UI5Element", "sap/ui/webc/common/thirdparty/base/types/ValueState"], function (_exports, _UI5Element, _ValueState) {
+sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/decorators/customElement", "sap/ui/webc/common/thirdparty/base/decorators/property", "sap/ui/webc/common/thirdparty/base/types/ValueState", "./TreeItemBase", "./generated/templates/TreeItemTemplate.lit", "./generated/themes/TreeItem.css"], function (_exports, _customElement, _property, _ValueState, _TreeItemBase, _TreeItemTemplate, _TreeItem) {
   "use strict";
 
   Object.defineProperty(_exports, "__esModule", {
     value: true
   });
   _exports.default = void 0;
-  _UI5Element = _interopRequireDefault(_UI5Element);
+  _customElement = _interopRequireDefault(_customElement);
+  _property = _interopRequireDefault(_property);
   _ValueState = _interopRequireDefault(_ValueState);
+  _TreeItemBase = _interopRequireDefault(_TreeItemBase);
+  _TreeItemTemplate = _interopRequireDefault(_TreeItemTemplate);
+  _TreeItem = _interopRequireDefault(_TreeItem);
   function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-  /**
-   * @public
-   */
-  const metadata = {
-    tag: "ui5-tree-item",
-    properties: /** @lends sap.ui.webcomponents.main.TreeItem.prototype */{
-      /**
-       * Defines the text of the tree item.
-       *
-       * @public
-       * @type {string}
-       * @defaultValue ""
-       */
-      text: {
-        type: String
-      },
-      /**
-       * Defines whether the tree node is expanded or collapsed. Only has visual effect for tree nodes with children.
-       *
-       * @type {boolean}
-       * @defaultvalue false
-       * @public
-       */
-      expanded: {
-        type: Boolean
-      },
-      /**
-      * Defines whether the selection of a tree node is displayed as partially selected.
-      * <br><br>
-      * <b>Note:</b> The indeterminate state can be set only programatically and can’t be achieved by user
-      * interaction, meaning that the resulting visual state depends on the values of the <code>indeterminate</code>
-      * and <code>selected</code> properties:
-      * <ul>
-      * <li> If a tree node has both <code>selected</code> and <code>indeterminate</code> set to <code>true</code>, it is displayed as partially selected.
-      * <li> If a tree node has <code>selected</code> set to <code>true</code> and <code>indeterminate</code> set to <code>false</code>, it is displayed as selected.
-      * <li> If a tree node has <code>selected</code> set to <code>false</code>, it is displayed as not selected regardless of the value of the <code>indeterminate</code> property.
-      * </ul>
-      * <br>
-      * <b>Note:</b> This property takes effect only when the <code>ui5-tree</code> is in <code>MultiSelect</code> mode.
-      * @type {boolean}
-      * @defaultvalue false
-      * @public
-      * @since 1.1.0
-      */
-      indeterminate: {
-        type: Boolean
-      },
-      /**
-       * Defines whether the tree node has children, even if currently no other tree nodes are slotted inside.
-       * <br>
-       * <i>Note:</i> This property is useful for showing big tree structures where not all nodes are initially loaded due to performance reasons.
-       * Set this to <code>true</code> for nodes you intend to load lazily, when the user clicks the expand button.
-       * It is not necessary to set this property otherwise. If a tree item has children, the expand button will be displayed anyway.
-       *
-       * @type {boolean}
-       * @defaultvalue false
-       * @public
-       */
-      hasChildren: {
-        type: Boolean
-      },
-      /**
-       * Defines whether the tree node is selected by the user. Only has effect if the <code>ui5-tree</code> is in one of the
-       * following modes: in <code>SingleSelect</code>, <code>SingleSelectBegin</code>, <code>SingleSelectEnd</code> and <code>MultiSelect</code>.
-       *
-       * @type {boolean}
-       * @defaultvalue false
-       * @public
-       */
-      selected: {
-        type: Boolean
-      },
-      /**
-       * If set, an icon will be displayed before the text, representing the tree item.
-       *
-       * @public
-       * @type {string}
-       * @defaultValue ""
-       */
-      icon: {
-        type: String
-      },
-      /**
-       * Defines the <code>additionalText</code>, displayed in the end of the tree item.
-       * @type {string}
-       * @public
-       * @since 1.0.0-rc.15
-       */
-      additionalText: {
-        type: String
-      },
-      /**
-       * Defines the state of the <code>additionalText</code>.
-       * <br>
-       * Available options are: <code>"None"</code> (by default), <code>"Success"</code>, <code>"Warning"</code>, <code>"Information"</code> and <code>"Erorr"</code>.
-       * @type {ValueState}
-       * @defaultvalue "None"
-       * @public
-       * @since 1.0.0-rc.15
-       */
-      additionalTextState: {
-        type: _ValueState.default,
-        defaultValue: _ValueState.default.None
-      },
-      /**
-       * Defines the tooltip of the component.
-       * @type {string}
-       * @defaultvalue ""
-       * @private
-       * @since 1.0.0-rc.15
-       */
-      title: {
-        type: String
-      }
-    },
-    managedSlots: true,
-    slots: /** @lends sap.ui.webcomponents.main.TreeItem.prototype */{
-      /**
-       * Defines the items of this component.
-       *
-       * @type {sap.ui.webcomponents.main.ITreeItem[]}
-       * @slot items
-       * @public
-       */
-      "default": {
-        propertyName: "items",
-        type: HTMLElement,
-        invalidateOnChildChange: true
-      }
-    }
+  var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+    var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
   };
-
   /**
    * @class
-   *
    * <h3 class="comment-api-title">Overview</h3>
+   * The <code>ui5-tree-item</code> represents a node in a tree structure, shown as a <code>ui5-list</code>.
+   * <br>
    * This is the item to use inside a <code>ui5-tree</code>.
    * You can represent an arbitrary tree structure by recursively nesting tree items.
    *
-   * <h3>Usage</h3>
-   * <code>ui5-tree-item</code> is an abstract element, representing a node in a <code>ui5-tree</code>. The tree itself is rendered as a list,
-   * and each <code>ui5-tree-item</code> is represented by a list item(<code>ui5-li-tree</code>) in that list. Therefore, you should only use
-   * <code>ui5-tree-item</code> directly in your apps. The <code>ui5-li-tree</code> list item is internal for the list, and not intended for public use.
+   * <h3>CSS Shadow Parts</h3>
+   *
+   * <ui5-link target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/CSS/::part">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.
+   * <br>
+   * The <code>ui5-tree-item</code> exposes the following CSS Shadow Parts:
+   * <ul>
+   * <li>title - Used to style the title of the tree list item</li>
+   * <li>additionalText - Used to style the additionalText of the tree list item</li>
+   * <li>icon - Used to style the icon of the tree list item</li>
+   * </ul>
    *
    * <h3>ES6 Module Import</h3>
    * <code>import "@ui5/webcomponents/dist/TreeItem.js";</code>
    *
    * @constructor
    * @author SAP SE
-   * @alias sap.ui.webcomponents.main.TreeItem
-   * @extends UI5Element
+   * @alias sap.ui.webc.main.TreeItem
+   * @extends sap.ui.webc.main.TreeItemBase
    * @tagname ui5-tree-item
    * @public
-   * @implements sap.ui.webcomponents.main.ITreeItem
+   * @implements sap.ui.webc.main.ITreeItem
    * @since 1.0.0-rc.8
    */
-  class TreeItem extends _UI5Element.default {
-    static get metadata() {
-      return metadata;
-    }
-    get requiresToggleButton() {
-      return this.hasChildren || this.items.length > 0;
-    }
-
-    /**
-     * Call this method to manually switch the <code>expanded</code> state of a tree item.
-     * @public
-     */
-    toggle() {
-      this.expanded = !this.expanded;
+  let TreeItem = class TreeItem extends _TreeItemBase.default {
+    get _showTitle() {
+      return this.text.length && !this._minimal;
     }
-  }
+  };
+  __decorate([(0, _property.default)()], TreeItem.prototype, "text", void 0);
+  __decorate([(0, _property.default)()], TreeItem.prototype, "additionalText", void 0);
+  __decorate([(0, _property.default)({
+    type: _ValueState.default,
+    defaultValue: _ValueState.default.None
+  })], TreeItem.prototype, "additionalTextState", void 0);
+  TreeItem = __decorate([(0, _customElement.default)({
+    tag: "ui5-tree-item",
+    template: _TreeItemTemplate.default,
+    styles: [_TreeItemBase.default.styles, _TreeItem.default]
+  })], TreeItem);
   TreeItem.define();
   var _default = TreeItem;
   _exports.default = _default;

package/src/sap/ui/webc/main/thirdparty/TreeItemBase.js

@@ -0,0 +1,256 @@
+sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/decorators/property", "sap/ui/webc/common/thirdparty/base/decorators/customElement", "sap/ui/webc/common/thirdparty/base/decorators/slot", "sap/ui/webc/common/thirdparty/base/decorators/event", "sap/ui/webc/common/thirdparty/base/types/Integer", "sap/ui/webc/common/thirdparty/base/Keys", "sap/ui/webc/common/thirdparty/base/i18nBundle", "sap/ui/webc/common/thirdparty/base/types/ValueState", "./ListItem", "./Icon", "sap/ui/webc/common/thirdparty/icons/navigation-right-arrow", "sap/ui/webc/common/thirdparty/icons/navigation-down-arrow", "./generated/i18n/i18n-defaults", "./generated/templates/TreeItemBaseTemplate.lit", "./generated/themes/TreeItem.css", "./types/HasPopup"], function (_exports, _property, _customElement, _slot, _event, _Integer, _Keys, _i18nBundle, _ValueState, _ListItem, _Icon, _navigationRightArrow, _navigationDownArrow, _i18nDefaults, _TreeItemBaseTemplate, _TreeItem, _HasPopup) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.default = void 0;
+  _property = _interopRequireDefault(_property);
+  _customElement = _interopRequireDefault(_customElement);
+  _slot = _interopRequireDefault(_slot);
+  _event = _interopRequireDefault(_event);
+  _Integer = _interopRequireDefault(_Integer);
+  _ValueState = _interopRequireDefault(_ValueState);
+  _ListItem = _interopRequireDefault(_ListItem);
+  _Icon = _interopRequireDefault(_Icon);
+  _TreeItemBaseTemplate = _interopRequireDefault(_TreeItemBaseTemplate);
+  _TreeItem = _interopRequireDefault(_TreeItem);
+  _HasPopup = _interopRequireDefault(_HasPopup);
+  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+  var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+    var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+  };
+  var TreeItemBase_1;
+  /**
+   * A class to serve as a foundation
+   * for the <code>TreeItem</code> and <code>TreeItemCustom</code> classes.
+   *
+   * @abstract
+   * @constructor
+   * @author SAP SE
+   * @alias sap.ui.webc.main.TreeItemBase
+   * @extends sap.ui.webc.main.ListItem
+   * @public
+   */
+  let TreeItemBase = TreeItemBase_1 = class TreeItemBase extends _ListItem.default {
+    onBeforeRendering() {
+      this.actionable = false;
+      this.showToggleButton = this.requiresToggleButton;
+    }
+    get classes() {
+      const allClasses = super.classes;
+      allClasses.main["ui5-li-root-tree"] = true;
+      return allClasses;
+    }
+    get styles() {
+      return {
+        preContent: {
+          "padding-inline-start": `calc(var(--_ui5-tree-indent-step) * ${this.effectiveLevel})`
+        }
+      };
+    }
+    get requiresToggleButton() {
+      return !this._fixed ? this.hasChildren || this.items.length > 0 : false;
+    }
+    get effectiveLevel() {
+      return this.level - 1;
+    }
+    get hasParent() {
+      return this.level > 1;
+    }
+    get _toggleIconName() {
+      return this.expanded ? "navigation-down-arrow" : "navigation-right-arrow";
+    }
+    get _showToggleButtonBeginning() {
+      return this.showToggleButton && !this._minimal && !this._toggleButtonEnd;
+    }
+    get _showToggleButtonEnd() {
+      return this.showToggleButton && !this._minimal && this._toggleButtonEnd;
+    }
+    get _ariaLabel() {
+      return this.accessibleRoleDescription ? undefined : TreeItemBase_1.i18nBundle.getText(_i18nDefaults.TREE_ITEM_ARIA_LABEL);
+    }
+    get _accInfo() {
+      const accInfoSettings = {
+        role: this._minimal ? "menuitemradio" : "treeitem",
+        ariaExpanded: this.showToggleButton && !this._minimal ? this.expanded : undefined,
+        ariaLevel: this._minimal ? undefined : this.level,
+        posinset: this._posinset,
+        setsize: this._setsize,
+        ariaSelectedText: this.ariaSelectedText,
+        listItemAriaLabel: !this.accessibleName ? this._ariaLabel : undefined,
+        ariaOwns: this.expanded ? `${this._id}-subtree` : undefined,
+        ariaHaspopup: this.ariaHaspopup || undefined,
+        ariaChecked: false,
+        ariaSelected: false
+      };
+      if (this._minimal) {
+        accInfoSettings.ariaChecked = this.selected;
+      } else {
+        accInfoSettings.ariaSelected = this.selected;
+      }
+      return {
+        ...super._accInfo,
+        ...accInfoSettings
+      };
+    }
+    /**
+     * Used to duck-type TreeItem elements without using instanceof
+     * @returns {boolean}
+     * @protected
+     */
+    get isTreeItem() {
+      return true;
+    }
+    /**
+     * Call this method to manually switch the <code>expanded</code> state of a tree item.
+     * @public
+     * @method
+     * @name sap.ui.webc.main.TreeItemBase#toggle
+     */
+    toggle() {
+      this.expanded = !this.expanded;
+    }
+    _toggleClick(e) {
+      e.stopPropagation();
+      this.fireEvent("toggle", {
+        item: this
+      });
+    }
+    _onkeydown(e) {
+      super._onkeydown(e);
+      if (!this._fixed && this.showToggleButton && (0, _Keys.isRight)(e)) {
+        if (!this.expanded) {
+          this.fireEvent("toggle", {
+            item: this
+          });
+        } else {
+          this.fireEvent("step-in", {
+            item: this
+          });
+        }
+      }
+      if (!this._fixed && (0, _Keys.isLeft)(e)) {
+        if (this.expanded) {
+          this.fireEvent("toggle", {
+            item: this
+          });
+        } else if (this.hasParent) {
+          this.fireEvent("step-out", {
+            item: this
+          });
+        }
+      }
+    }
+    get iconAccessibleName() {
+      return this.expanded ? TreeItemBase_1.i18nBundle.getText(_i18nDefaults.TREE_ITEM_COLLAPSE_NODE) : TreeItemBase_1.i18nBundle.getText(_i18nDefaults.TREE_ITEM_EXPAND_NODE);
+    }
+    static async onDefine() {
+      [TreeItemBase_1.i18nBundle] = await Promise.all([(0, _i18nBundle.getI18nBundle)("@ui5/webcomponents"), super.onDefine()]);
+    }
+  };
+  __decorate([(0, _property.default)({
+    validator: _Integer.default,
+    defaultValue: 1
+  })], TreeItemBase.prototype, "level", void 0);
+  __decorate([(0, _property.default)()], TreeItemBase.prototype, "icon", void 0);
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemBase.prototype, "showToggleButton", void 0);
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemBase.prototype, "expanded", void 0);
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemBase.prototype, "indeterminate", void 0);
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemBase.prototype, "hasChildren", void 0);
+  __decorate([(0, _property.default)({
+    type: _ValueState.default,
+    defaultValue: _ValueState.default.None
+  })], TreeItemBase.prototype, "additionalTextState", void 0);
+  __decorate([(0, _property.default)()], TreeItemBase.prototype, "accessibleName", void 0);
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemBase.prototype, "_toggleButtonEnd", void 0);
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemBase.prototype, "_minimal", void 0);
+  __decorate([(0, _property.default)({
+    validator: _Integer.default,
+    defaultValue: 1,
+    noAttribute: true
+  })], TreeItemBase.prototype, "_setsize", void 0);
+  __decorate([(0, _property.default)({
+    validator: _Integer.default,
+    defaultValue: 1,
+    noAttribute: true
+  })], TreeItemBase.prototype, "_posinset", void 0);
+  __decorate([(0, _property.default)({
+    type: String,
+    defaultValue: undefined,
+    noAttribute: true
+  })], TreeItemBase.prototype, "accessibleRoleDescription", void 0);
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemBase.prototype, "_fixed", void 0);
+  __decorate([(0, _property.default)({
+    type: _HasPopup.default,
+    noAttribute: true
+  })], TreeItemBase.prototype, "ariaHaspopup", void 0);
+  __decorate([(0, _slot.default)({
+    type: HTMLElement,
+    "default": true
+  })], TreeItemBase.prototype, "items", void 0);
+  TreeItemBase = TreeItemBase_1 = __decorate([(0, _customElement.default)({
+    languageAware: true,
+    template: _TreeItemBaseTemplate.default,
+    styles: [_ListItem.default.styles, _TreeItem.default],
+    dependencies: [..._ListItem.default.dependencies, _Icon.default]
+  })
+  /**
+   * Fired when the user interacts with the expand/collapse button of the tree list item.
+   * @event
+   * @param {HTMLElement} item the toggled item.
+   * @protected
+   */, (0, _event.default)("toggle", {
+    detail: {
+      item: {
+        type: HTMLElement
+      }
+    }
+  })
+  /**
+   * Fired when the user drills down into the tree hierarchy by pressing the right arrow on the tree node.
+   *
+   * @event sap.ui.webc.main.TreeItemBase#step-in
+   * @param {HTMLElement} item the item on which right arrow was pressed.
+   * @protected
+   */, (0, _event.default)("step-in", {
+    detail: {
+      item: {
+        type: HTMLElement
+      }
+    }
+  })
+  /**
+   * Fired when the user goes up the tree hierarchy by pressing the left arrow on the tree node.
+   *
+   * @event sap.ui.webc.main.TreeItemBase#step-out
+   * @param {HTMLElement} item the item on which left arrow was pressed.
+   * @protected
+   */, (0, _event.default)("step-out", {
+    detail: {
+      item: {
+        type: HTMLElement
+      }
+    }
+  })], TreeItemBase);
+  var _default = TreeItemBase;
+  _exports.default = _default;
+});

package/src/sap/ui/webc/main/thirdparty/TreeItemCustom.js

@@ -0,0 +1,80 @@
+sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/decorators/customElement", "sap/ui/webc/common/thirdparty/base/decorators/property", "sap/ui/webc/common/thirdparty/base/decorators/slot", "./TreeItemBase", "./generated/templates/TreeItemCustomTemplate.lit", "./generated/themes/TreeItem.css"], function (_exports, _customElement, _property, _slot, _TreeItemBase, _TreeItemCustomTemplate, _TreeItem) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.default = void 0;
+  _customElement = _interopRequireDefault(_customElement);
+  _property = _interopRequireDefault(_property);
+  _slot = _interopRequireDefault(_slot);
+  _TreeItemBase = _interopRequireDefault(_TreeItemBase);
+  _TreeItemCustomTemplate = _interopRequireDefault(_TreeItemCustomTemplate);
+  _TreeItem = _interopRequireDefault(_TreeItem);
+  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+  var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+    var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+  };
+  /**
+   * @class
+   * The <code>ui5-tree-item-custom</code> represents a node in a tree structure, shown as a <code>ui5-list</code>.
+   * <br>
+   * This is the item to use inside a <code>ui5-tree</code>.
+   * You can represent an arbitrary tree structure by recursively nesting tree items.
+   *
+   * You can use this item to put any custom content inside the tree item.
+   *
+   * <h3>CSS Shadow Parts</h3>
+   *
+   * <ui5-link target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/CSS/::part">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.
+   * <br>
+   * The <code>ui5-tree-item-custom</code> exposes the following CSS Shadow Parts:
+   * <ul>
+   * <li>title - Used to style the title of the tree list item</li>
+   * <li>additionalText - Used to style the additionalText of the tree list item</li>
+   * <li>icon - Used to style the icon of the tree list item</li>
+   * </ul>
+   *
+   * <h3>ES6 Module Import</h3>
+   * <code>import "@ui5/webcomponents/dist/TreeItemCustom.js";</code>
+   *
+   * @constructor
+   * @author SAP SE
+   * @alias sap.ui.webc.main.TreeItemCustom
+   * @extends sap.ui.webc.main.TreeItemBase
+   * @tagname ui5-tree-item-custom
+   * @public
+   * @implements sap.ui.webc.main.ITreeItem
+   * @since 1.9.2
+   */
+  let TreeItemCustom = class TreeItemCustom extends _TreeItemBase.default {
+    /**
+     * @override
+     */
+    get placeSelectionElementBefore() {
+      return !this.hideSelectionElement && super.placeSelectionElementBefore;
+    }
+    /**
+     * @override
+     */
+    get placeSelectionElementAfter() {
+      return !this.hideSelectionElement && super.placeSelectionElementAfter;
+    }
+  };
+  __decorate([(0, _property.default)({
+    type: Boolean
+  })], TreeItemCustom.prototype, "hideSelectionElement", void 0);
+  __decorate([(0, _slot.default)()], TreeItemCustom.prototype, "content", void 0);
+  TreeItemCustom = __decorate([(0, _customElement.default)({
+    tag: "ui5-tree-item-custom",
+    template: _TreeItemCustomTemplate.default,
+    styles: [_TreeItemBase.default.styles, _TreeItem.default]
+  })], TreeItemCustom);
+  TreeItemCustom.define();
+  var _default = TreeItemCustom;
+  _exports.default = _default;
+});

package/src/sap/ui/webc/main/thirdparty/TreeList.js

@@ -0,0 +1,51 @@
+sap.ui.define(["exports", "sap/ui/webc/common/thirdparty/base/decorators/customElement", "./List"], function (_exports, _customElement, _List) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.default = void 0;
+  _customElement = _interopRequireDefault(_customElement);
+  _List = _interopRequireDefault(_List);
+  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+  var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+    var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+  };
+  let TreeList = class TreeList extends _List.default {
+    /*
+     * @override
+     */
+    getItems(includeCollapsed = false) {
+      const slottedItems = this.getSlottedNodes("items");
+      const flatItems = [];
+      flattenTree(slottedItems, flatItems, includeCollapsed);
+      return flatItems;
+    }
+    getItemsForProcessing() {
+      return this.getItems(true);
+    }
+  };
+  TreeList = __decorate([(0, _customElement.default)("ui5-tree-list")], TreeList);
+  /*
+   * Converts a tree structure into a flat array
+   *
+   * @param {Array} treeItems
+   * @param {Array} result
+   * @param {Boolean} includeCollapsed
+   */
+  const flattenTree = (items, result, includeCollapsed = false) => {
+    items.forEach(item => {
+      result.push(item);
+      if ((item.expanded || includeCollapsed) && item.items) {
+        flattenTree(item.items, result, includeCollapsed);
+      }
+    });
+  };
+  TreeList.define();
+  var _default = TreeList;
+  _exports.default = _default;
+});