@ui5/webcomponents 0.0.0-389bdbabc → 0.0.0-3e3654870

package/dist/TreeItem.d.ts

@@ -0,0 +1,66 @@
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import TreeItemBase from "./TreeItemBase.js";
+/**
+ * @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>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.webc.main.TreeItem
+ * @extends sap.ui.webc.main.TreeItemBase
+ * @tagname ui5-tree-item
+ * @public
+ * @implements sap.ui.webc.main.ITreeItem
+ * @since 1.0.0-rc.8
+ */
+declare class TreeItem extends TreeItemBase {
+    /**
+     * Defines the text of the tree item.
+     *
+     * @public
+     * @type {string}
+     * @name sap.ui.webc.main.TreeItem.prototype.text
+     * @defaultValue ""
+     */
+    text: string;
+    /**
+     * Defines the <code>additionalText</code>, displayed in the end of the tree item.
+     * @type {string}
+     * @name sap.ui.webc.main.TreeItem.prototype.additionalText
+     * @defaultvalue ""
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    additionalText: 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>"Error"</code>.
+     * @type {sap.ui.webc.base.types.ValueState}
+     * @name sap.ui.webc.main.TreeItem.prototype.additionalTextState
+     * @defaultvalue "None"
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    additionalTextState: `${ValueState}`;
+    get _showTitle(): boolean | 0;
+}
+export default TreeItem;

package/dist/TreeItem.js

@@ -0,0 +1,69 @@
+var __decorate = (this && this.__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;
+};
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import TreeItemBase from "./TreeItemBase.js";
+// Template
+import TreeItemTemplate from "./generated/templates/TreeItemTemplate.lit.js";
+// Styles
+import treeItemCss from "./generated/themes/TreeItem.css.js";
+/**
+ * @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>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.webc.main.TreeItem
+ * @extends sap.ui.webc.main.TreeItemBase
+ * @tagname ui5-tree-item
+ * @public
+ * @implements sap.ui.webc.main.ITreeItem
+ * @since 1.0.0-rc.8
+ */
+let TreeItem = class TreeItem extends TreeItemBase {
+    get _showTitle() {
+        return this.text.length && !this._minimal;
+    }
+};
+__decorate([
+    property()
+], TreeItem.prototype, "text", void 0);
+__decorate([
+    property()
+], TreeItem.prototype, "additionalText", void 0);
+__decorate([
+    property({ type: ValueState, defaultValue: ValueState.None })
+], TreeItem.prototype, "additionalTextState", void 0);
+TreeItem = __decorate([
+    customElement({
+        tag: "ui5-tree-item",
+        template: TreeItemTemplate,
+        styles: [TreeItemBase.styles, treeItemCss],
+    })
+], TreeItem);
+TreeItem.define();
+export default TreeItem;
+//# sourceMappingURL=TreeItem.js.map

package/dist/TreeItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeItem.js","sourceRoot":"","sources":["../src/TreeItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,UAAU,MAAM,kDAAkD,CAAC;AAC1E,OAAO,YAAY,MAAM,mBAAmB,CAAC;AAC7C,WAAW;AACX,OAAO,gBAAgB,MAAM,+CAA+C,CAAC;AAE7E,SAAS;AACT,OAAO,WAAW,MAAM,oCAAoC,CAAC;AAE7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAMH,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,YAAY;IAoClC,IAAI,UAAU;QACb,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC3C,CAAC;CACD,CAAA;AA7BA;IADC,QAAQ,EAAE;sCACG;AAWd;IADC,QAAQ,EAAE;gDACa;AAaxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,UAAU,CAAC,IAAI,EAAE,CAAC;qDACxB;AAlCjC,QAAQ;IALb,aAAa,CAAC;QACd,GAAG,EAAE,eAAe;QACpB,QAAQ,EAAE,gBAAgB;QAC1B,MAAM,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,WAAW,CAAC;KAC1C,CAAC;GACI,QAAQ,CAuCb;AAED,QAAQ,CAAC,MAAM,EAAE,CAAC;AAElB,eAAe,QAAQ,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport TreeItemBase from \"./TreeItemBase.js\";\n// Template\nimport TreeItemTemplate from \"./generated/templates/TreeItemTemplate.lit.js\";\n\n// Styles\nimport treeItemCss from \"./generated/themes/TreeItem.css.js\";\n\n/**\n * @class\n * <h3 class=\"comment-api-title\">Overview</h3>\n * The <code>ui5-tree-item</code> represents a node in a tree structure, shown as a <code>ui5-list</code>.\n * <br>\n * This is the item to use inside a <code>ui5-tree</code>.\n * You can represent an arbitrary tree structure by recursively nesting tree items.\n *\n * <h3>CSS Shadow Parts</h3>\n *\n * <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.\n * <br>\n * The <code>ui5-tree-item</code> exposes the following CSS Shadow Parts:\n * <ul>\n * <li>title - Used to style the title of the tree list item</li>\n * <li>additionalText - Used to style the additionalText of the tree list item</li>\n * <li>icon - Used to style the icon of the tree list item</li>\n * </ul>\n *\n * <h3>ES6 Module Import</h3>\n * <code>import \"@ui5/webcomponents/dist/TreeItem.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.main.TreeItem\n * @extends sap.ui.webc.main.TreeItemBase\n * @tagname ui5-tree-item\n * @public\n * @implements sap.ui.webc.main.ITreeItem\n * @since 1.0.0-rc.8\n */\n@customElement({\n\ttag: \"ui5-tree-item\",\n\ttemplate: TreeItemTemplate,\n\tstyles: [TreeItemBase.styles, treeItemCss],\n})\nclass TreeItem extends TreeItemBase {\n\t/**\n\t * Defines the text of the tree item.\n\t *\n\t * @public\n\t * @type {string}\n\t * @name sap.ui.webc.main.TreeItem.prototype.text\n\t * @defaultValue \"\"\n\t */\n\t@property()\n\ttext!: string;\n\n\t/**\n\t * Defines the <code>additionalText</code>, displayed in the end of the tree item.\n\t * @type {string}\n\t * @name sap.ui.webc.main.TreeItem.prototype.additionalText\n\t * @defaultvalue \"\"\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 <code>additionalText</code>.\n\t * <br>\n\t * Available options are: <code>\"None\"</code> (by default), <code>\"Success\"</code>, <code>\"Warning\"</code>, <code>\"Information\"</code> and <code>\"Error\"</code>.\n\t * @type {sap.ui.webc.base.types.ValueState}\n\t * @name sap.ui.webc.main.TreeItem.prototype.additionalTextState\n\t * @defaultvalue \"None\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property({ type: ValueState, defaultValue: ValueState.None })\n\tadditionalTextState!: `${ValueState}`;\n\n\tget _showTitle() {\n\t\treturn this.text.length && !this._minimal;\n\t}\n}\n\nTreeItem.define();\n\nexport default TreeItem;\n"]}

package/dist/TreeItemBase.d.ts

@@ -0,0 +1,223 @@
+import type { ClassMap } from "@ui5/webcomponents-base/dist/types.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import ListItem from "./ListItem.js";
+import "@ui5/webcomponents-icons/dist/navigation-right-arrow.js";
+import "@ui5/webcomponents-icons/dist/navigation-down-arrow.js";
+import HasPopup from "./types/HasPopup.js";
+type TreeItemBaseEventDetail = {
+    item: TreeItemBase;
+};
+type TreeItemBaseToggleEventDetail = TreeItemBaseEventDetail;
+type TreeItemBaseStepInEventDetail = TreeItemBaseEventDetail;
+type TreeItemBaseStepOutEventDetail = TreeItemBaseEventDetail;
+/**
+ * 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
+ */
+declare class TreeItemBase extends ListItem {
+    /**
+     * Defines the indentation of the tree list item. Use level 1 for tree list items, representing top-level tree nodes.
+     *
+     * @type {sap.ui.webc.base.types.Integer}
+     * @name sap.ui.webc.main.TreeItemBase.prototype.level
+     * @protected
+     * @defaultValue 1
+     */
+    level: number;
+    /**
+     * If set, an icon will be displayed before the text of the tree list item.
+     *
+     * @public
+     * @name sap.ui.webc.main.TreeItemBase.prototype.icon
+     * @type {string}
+     * @defaultValue ""
+     */
+    icon: string;
+    /**
+     * Defines whether the tree list item should display an expand/collapse button.
+     *
+     * @type {boolean}
+     * @name sap.ui.webc.main.TreeItemBase.prototype.showToggleButton
+     * @defaultvalue false
+     * @protected
+     */
+    showToggleButton: boolean;
+    /**
+     * Defines whether the tree list item will show a collapse or expand icon inside its toggle button.
+     *
+     * @type {boolean}
+     * @name sap.ui.webc.main.TreeItemBase.prototype.expanded
+     * @defaultvalue false
+     * @public
+     */
+    expanded: 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 programmatically 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}
+    * @name sap.ui.webc.main.TreeItemBase.prototype.indeterminate
+    * @defaultvalue false
+    * @public
+    * @since 1.1.0
+    */
+    indeterminate: 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}
+     * @name sap.ui.webc.main.TreeItemBase.prototype.hasChildren
+     * @defaultvalue false
+     * @public
+     */
+    hasChildren: boolean;
+    /**
+     * 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>"Error"</code>.
+     * @type {sap.ui.webc.base.types.ValueState}
+     * @name sap.ui.webc.main.TreeItemBase.prototype.additionalTextState
+     * @defaultvalue "None"
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    additionalTextState: `${ValueState}`;
+    /**
+     * Defines the accessible name of the component.
+     *
+     * @type {string}
+     * @name sap.ui.webc.main.TreeItemBase.prototype.accessibleName
+     * @defaultvalue: ""
+     * @public
+     * @since 1.8.0
+     */
+    accessibleName: string;
+    /**
+     * Defines whether the toggle button is shown at the end, rather than at the beginning of the item
+     *
+     * @protected
+     * @since 1.0.0-rc.8
+     */
+    _toggleButtonEnd: boolean;
+    /**
+     * Defines whether the item shows minimal details - only icon (no text or toggle button)
+     *
+     * @protected
+     * @since 1.0.0-rc.8
+     */
+    _minimal: boolean;
+    /**
+     * @private
+     * @since 1.0.0-rc.11
+     */
+    _setsize: number;
+    /**
+     * @private
+     * @since 1.0.0-rc.11
+     */
+    _posinset: number;
+    /**
+     * Defines the description for the accessible role of the component.
+     * @protected
+     * @type {string}
+     * @defaultvalue undefined
+     * @since 1.10.0
+     */
+    accessibleRoleDescription?: string;
+    /**
+     * Defines if the item should be collapsible or not.
+     * It is true, for example, for the items inside the Popover of the Side Navigation
+     * @private
+     * @type {boolean}
+     * @defaultvalue false
+     * @since 1.10.0
+     */
+    _fixed: boolean;
+    /**
+     * Defines the availability and type of interactive popup element that can be triggered by the component on which the property is set.
+     * @type {sap.ui.webc.main.types.HasPopup}
+     * @since 1.10.0
+     * @private
+     */
+    ariaHaspopup?: `${HasPopup}`;
+    /**
+     * Defines the items of the component.
+     * <br />
+     * <br />
+     * <b>Note:</b> Use <code>ui5-tree-item</code> or <code>ui5-tree-item-custom</code>
+     *
+     * @type {sap.ui.webc.main.ITreeItem[]}
+     * @name sap.ui.webc.main.TreeItemBase.prototype.default
+     * @slot items
+     * @public
+     */
+    items: Array<TreeItemBase>;
+    onBeforeRendering(): void;
+    get classes(): ClassMap;
+    get styles(): {
+        preContent: {
+            "padding-inline-start": string;
+        };
+    };
+    get requiresToggleButton(): boolean;
+    get effectiveLevel(): number;
+    get hasParent(): boolean;
+    get _toggleIconName(): "navigation-down-arrow" | "navigation-right-arrow";
+    get _showToggleButtonBeginning(): boolean;
+    get _showToggleButtonEnd(): boolean;
+    get _ariaLabel(): string | undefined;
+    get _accInfo(): {
+        role: string;
+        ariaExpanded: boolean | undefined;
+        ariaLevel: number | undefined;
+        posinset: number;
+        setsize: number;
+        ariaSelectedText: string | undefined;
+        listItemAriaLabel: string | undefined;
+        ariaOwns: string | undefined;
+        ariaHaspopup: "Dialog" | "Grid" | "ListBox" | "Menu" | "Tree" | undefined;
+        ariaChecked: boolean;
+        ariaSelected: boolean;
+        ariaLabel: string;
+        ariaLabelRadioButton: string;
+    };
+    /**
+     * Used to duck-type TreeItem elements without using instanceof
+     * @returns {boolean}
+     * @protected
+     */
+    get isTreeItem(): boolean;
+    /**
+     * 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(): void;
+    _toggleClick(e: MouseEvent | KeyboardEvent): void;
+    _onkeydown(e: KeyboardEvent): void;
+    get iconAccessibleName(): string;
+    static onDefine(): Promise<void>;
+}
+export default TreeItemBase;
+export type { TreeItemBaseToggleEventDetail, TreeItemBaseStepInEventDetail, TreeItemBaseStepOutEventDetail, };

package/dist/TreeItemBase.js

@@ -0,0 +1,249 @@
+var __decorate = (this && this.__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;
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
+import event from "@ui5/webcomponents-base/dist/decorators/event.js";
+import Integer from "@ui5/webcomponents-base/dist/types/Integer.js";
+import { isLeft, isRight } from "@ui5/webcomponents-base/dist/Keys.js";
+import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import { getScopedVarName } from "@ui5/webcomponents-base/dist/CustomElementsScope.js";
+import ListItem from "./ListItem.js";
+import Icon from "./Icon.js";
+import "@ui5/webcomponents-icons/dist/navigation-right-arrow.js";
+import "@ui5/webcomponents-icons/dist/navigation-down-arrow.js";
+import { TREE_ITEM_ARIA_LABEL, TREE_ITEM_EXPAND_NODE, TREE_ITEM_COLLAPSE_NODE, } from "./generated/i18n/i18n-defaults.js";
+// Template
+import TreeItemBaseTemplate from "./generated/templates/TreeItemBaseTemplate.lit.js";
+// Styles
+import treeItemCss from "./generated/themes/TreeItem.css.js";
+import HasPopup from "./types/HasPopup.js";
+/**
+ * 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 {
+    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(${getScopedVarName("--_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(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 && isRight(e)) {
+            if (!this.expanded) {
+                this.fireEvent("toggle", { item: this });
+            }
+            else {
+                this.fireEvent("step-in", { item: this });
+            }
+        }
+        if (!this._fixed && 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(TREE_ITEM_COLLAPSE_NODE) : TreeItemBase_1.i18nBundle.getText(TREE_ITEM_EXPAND_NODE);
+    }
+    static async onDefine() {
+        [TreeItemBase_1.i18nBundle] = await Promise.all([
+            getI18nBundle("@ui5/webcomponents"),
+            super.onDefine(),
+        ]);
+    }
+};
+__decorate([
+    property({ validator: Integer, defaultValue: 1 })
+], TreeItemBase.prototype, "level", void 0);
+__decorate([
+    property()
+], TreeItemBase.prototype, "icon", void 0);
+__decorate([
+    property({ type: Boolean })
+], TreeItemBase.prototype, "showToggleButton", void 0);
+__decorate([
+    property({ type: Boolean })
+], TreeItemBase.prototype, "expanded", void 0);
+__decorate([
+    property({ type: Boolean })
+], TreeItemBase.prototype, "indeterminate", void 0);
+__decorate([
+    property({ type: Boolean })
+], TreeItemBase.prototype, "hasChildren", void 0);
+__decorate([
+    property({ type: ValueState, defaultValue: ValueState.None })
+], TreeItemBase.prototype, "additionalTextState", void 0);
+__decorate([
+    property()
+], TreeItemBase.prototype, "accessibleName", void 0);
+__decorate([
+    property({ type: Boolean })
+], TreeItemBase.prototype, "_toggleButtonEnd", void 0);
+__decorate([
+    property({ type: Boolean })
+], TreeItemBase.prototype, "_minimal", void 0);
+__decorate([
+    property({ validator: Integer, defaultValue: 1, noAttribute: true })
+], TreeItemBase.prototype, "_setsize", void 0);
+__decorate([
+    property({ validator: Integer, defaultValue: 1, noAttribute: true })
+], TreeItemBase.prototype, "_posinset", void 0);
+__decorate([
+    property({ type: String, defaultValue: undefined, noAttribute: true })
+], TreeItemBase.prototype, "accessibleRoleDescription", void 0);
+__decorate([
+    property({ type: Boolean })
+], TreeItemBase.prototype, "_fixed", void 0);
+__decorate([
+    property({ type: HasPopup, noAttribute: true })
+], TreeItemBase.prototype, "ariaHaspopup", void 0);
+__decorate([
+    slot({ type: HTMLElement, "default": true })
+], TreeItemBase.prototype, "items", void 0);
+TreeItemBase = TreeItemBase_1 = __decorate([
+    customElement({
+        languageAware: true,
+        template: TreeItemBaseTemplate,
+        styles: [
+            ListItem.styles,
+            treeItemCss,
+        ],
+        dependencies: [
+            ...ListItem.dependencies,
+            Icon,
+        ],
+    })
+    /**
+     * Fired when the user interacts with the expand/collapse button of the tree list item.
+     * @event
+     * @param {HTMLElement} item the toggled item.
+     * @protected
+     */
+    ,
+    event("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
+     */
+    ,
+    event("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
+     */
+    ,
+    event("step-out", {
+        detail: {
+            item: { type: HTMLElement },
+        },
+    })
+], TreeItemBase);
+export default TreeItemBase;
+//# sourceMappingURL=TreeItemBase.js.map

package/dist/TreeItemBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeItemBase.js","sourceRoot":"","sources":["../src/TreeItemBase.ts"],"names":[],"mappings":"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","sourcesContent":["import property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport { isLeft, isRight } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport { getScopedVarName } from \"@ui5/webcomponents-base/dist/CustomElementsScope.js\";\nimport ListItem from \"./ListItem.js\";\nimport Icon from \"./Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-right-arrow.js\";\nimport \"@ui5/webcomponents-icons/dist/navigation-down-arrow.js\";\nimport {\n\tTREE_ITEM_ARIA_LABEL,\n\tTREE_ITEM_EXPAND_NODE,\n\tTREE_ITEM_COLLAPSE_NODE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport TreeItemBaseTemplate from \"./generated/templates/TreeItemBaseTemplate.lit.js\";\n\n// Styles\nimport treeItemCss from \"./generated/themes/TreeItem.css.js\";\n\nimport HasPopup from \"./types/HasPopup.js\";\n\ntype TreeItemBaseEventDetail = {\n\titem: TreeItemBase,\n}\ntype TreeItemBaseToggleEventDetail = TreeItemBaseEventDetail;\ntype TreeItemBaseStepInEventDetail = TreeItemBaseEventDetail;\ntype TreeItemBaseStepOutEventDetail = TreeItemBaseEventDetail;\n\n/**\n * A class to serve as a foundation\n * for the <code>TreeItem</code> and <code>TreeItemCustom</code> classes.\n *\n * @abstract\n * @constructor\n * @author SAP SE\n * @alias sap.ui.webc.main.TreeItemBase\n * @extends sap.ui.webc.main.ListItem\n * @public\n */\n@customElement({\n\tlanguageAware: true,\n\ttemplate: TreeItemBaseTemplate,\n\tstyles: [\n\t\tListItem.styles,\n\t\ttreeItemCss,\n\t],\n\tdependencies: [\n\t\t...ListItem.dependencies,\n\t\tIcon,\n\t],\n})\n/**\n * Fired when the user interacts with the expand/collapse button of the tree list item.\n * @event\n * @param {HTMLElement} item the toggled item.\n * @protected\n */\n@event(\"toggle\", {\n\tdetail: {\n\t\titem: { type: HTMLElement },\n\t},\n})\n\n/**\n * Fired when the user drills down into the tree hierarchy by pressing the right arrow on the tree node.\n *\n * @event sap.ui.webc.main.TreeItemBase#step-in\n * @param {HTMLElement} item the item on which right arrow was pressed.\n * @protected\n */\n@event(\"step-in\", {\n\tdetail: {\n\t\titem: { type: HTMLElement },\n\t},\n})\n\n/**\n * Fired when the user goes up the tree hierarchy by pressing the left arrow on the tree node.\n *\n * @event sap.ui.webc.main.TreeItemBase#step-out\n * @param {HTMLElement} item the item on which left arrow was pressed.\n * @protected\n */\n@event(\"step-out\", {\n\tdetail: {\n\t\titem: { type: HTMLElement },\n\t},\n})\nclass TreeItemBase extends ListItem {\n\t/**\n\t * Defines the indentation of the tree list item. Use level 1 for tree list items, representing top-level tree nodes.\n\t *\n\t * @type {sap.ui.webc.base.types.Integer}\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.level\n\t * @protected\n\t * @defaultValue 1\n\t */\n\t@property({ validator: Integer, defaultValue: 1 })\n\tlevel!: number;\n\n\t/**\n\t * If set, an icon will be displayed before the text of the tree list item.\n\t *\n\t * @public\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.icon\n\t * @type {string}\n\t * @defaultValue \"\"\n\t */\n\t@property()\n\ticon!: string;\n\n\t/**\n\t * Defines whether the tree list item should display an expand/collapse button.\n\t *\n\t * @type {boolean}\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.showToggleButton\n\t * @defaultvalue false\n\t * @protected\n\t */\n\t@property({ type: Boolean })\n\tshowToggleButton!: boolean;\n\n\t/**\n\t * Defines whether the tree list item will show a collapse or expand icon inside its toggle button.\n\t *\n\t * @type {boolean}\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.expanded\n\t * @defaultvalue false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\texpanded!: boolean;\n\n\t/**\n\t* Defines whether the selection of a tree node is displayed as partially selected.\n\t* <br><br>\n\t* <b>Note:</b> The indeterminate state can be set only programmatically and can’t be achieved by user\n\t* interaction, meaning that the resulting visual state depends on the values of the <code>indeterminate</code>\n\t* and <code>selected</code> properties:\n\t* <ul>\n\t* <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.\n\t* <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.\n\t* <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.\n\t* </ul>\n\t* <br>\n\t* <b>Note:</b> This property takes effect only when the <code>ui5-tree</code> is in <code>MultiSelect</code> mode.\n\t* @type {boolean}\n\t* @name sap.ui.webc.main.TreeItemBase.prototype.indeterminate\n\t* @defaultvalue false\n\t* @public\n\t* @since 1.1.0\n\t*/\n\t@property({ type: Boolean })\n\tindeterminate!: boolean;\n\n\t/**\n\t * Defines whether the tree node has children, even if currently no other tree nodes are slotted inside.\n\t * <br>\n\t * <i>Note:</i> This property is useful for showing big tree structures where not all nodes are initially loaded due to performance reasons.\n\t * Set this to <code>true</code> for nodes you intend to load lazily, when the user clicks the expand button.\n\t * It is not necessary to set this property otherwise. If a tree item has children, the expand button will be displayed anyway.\n\t *\n\t * @type {boolean}\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.hasChildren\n\t * @defaultvalue false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\thasChildren!: boolean;\n\n\t/**\n\t * Defines the state of the <code>additionalText</code>.\n\t * <br>\n\t * Available options are: <code>\"None\"</code> (by default), <code>\"Success\"</code>, <code>\"Warning\"</code>, <code>\"Information\"</code> and <code>\"Error\"</code>.\n\t * @type {sap.ui.webc.base.types.ValueState}\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.additionalTextState\n\t * @defaultvalue \"None\"\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@property({ type: ValueState, defaultValue: ValueState.None })\n\tadditionalTextState!: `${ValueState}`;\n\n\t/**\n\t * Defines the accessible name of the component.\n\t *\n\t * @type {string}\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.accessibleName\n\t * @defaultvalue: \"\"\n\t * @public\n\t * @since 1.8.0\n\t */\n\t@property()\n\taccessibleName!: string;\n\n\t/**\n\t * Defines whether the toggle button is shown at the end, rather than at the beginning of the item\n\t *\n\t * @protected\n\t * @since 1.0.0-rc.8\n\t */\n\t@property({ type: Boolean })\n\t_toggleButtonEnd!: boolean;\n\n\t/**\n\t * Defines whether the item shows minimal details - only icon (no text or toggle button)\n\t *\n\t * @protected\n\t * @since 1.0.0-rc.8\n\t */\n\t@property({ type: Boolean })\n\t_minimal!: boolean;\n\n\t/**\n\t * @private\n\t * @since 1.0.0-rc.11\n\t */\n\t@property({ validator: Integer, defaultValue: 1, noAttribute: true })\n\t_setsize!: number;\n\n\t/**\n\t * @private\n\t * @since 1.0.0-rc.11\n\t */\n\t@property({ validator: Integer, defaultValue: 1, noAttribute: true })\n\t_posinset!: number;\n\n\t/**\n\t * Defines the description for the accessible role of the component.\n\t * @protected\n\t * @type {string}\n\t * @defaultvalue undefined\n\t * @since 1.10.0\n\t */\n\t@property({ type: String, defaultValue: undefined, noAttribute: true })\n\taccessibleRoleDescription?: string;\n\n\t/**\n\t * Defines if the item should be collapsible or not.\n\t * It is true, for example, for the items inside the Popover of the Side Navigation\n\t * @private\n\t * @type {boolean}\n\t * @defaultvalue false\n\t * @since 1.10.0\n\t */\n\t@property({ type: Boolean })\n\t_fixed!: boolean;\n\n\t/**\n\t * Defines the availability and type of interactive popup element that can be triggered by the component on which the property is set.\n\t * @type {sap.ui.webc.main.types.HasPopup}\n\t * @since 1.10.0\n\t * @private\n\t */\n\t@property({ type: HasPopup, noAttribute: true })\n\tariaHaspopup?: `${HasPopup}`;\n\n\t/**\n\t * Defines the items of the component.\n\t * <br />\n\t * <br />\n\t * <b>Note:</b> Use <code>ui5-tree-item</code> or <code>ui5-tree-item-custom</code>\n\t *\n\t * @type {sap.ui.webc.main.ITreeItem[]}\n\t * @name sap.ui.webc.main.TreeItemBase.prototype.default\n\t * @slot items\n\t * @public\n\t */\n\t@slot({ type: HTMLElement, \"default\": true })\n\titems!: Array<TreeItemBase>;\n\n\tonBeforeRendering() {\n\t\tthis.actionable = false;\n\t\tthis.showToggleButton = this.requiresToggleButton;\n\t}\n\n\tget classes(): ClassMap {\n\t\tconst allClasses = super.classes;\n\t\tallClasses.main[\"ui5-li-root-tree\"] = true;\n\t\treturn allClasses;\n\t}\n\n\tget styles() {\n\t\treturn {\n\t\t\tpreContent: {\n\t\t\t\t\"padding-inline-start\": `calc(var(${getScopedVarName(\"--_ui5-tree-indent-step\")}) * ${this.effectiveLevel})`,\n\t\t\t},\n\t\t};\n\t}\n\n\tget requiresToggleButton() {\n\t\treturn !this._fixed ? (this.hasChildren || this.items.length > 0) : false;\n\t}\n\n\tget effectiveLevel() {\n\t\treturn this.level - 1;\n\t}\n\n\tget hasParent() {\n\t\treturn this.level > 1;\n\t}\n\n\tget _toggleIconName() {\n\t\treturn this.expanded ? \"navigation-down-arrow\" : \"navigation-right-arrow\";\n\t}\n\n\tget _showToggleButtonBeginning() {\n\t\treturn this.showToggleButton && !this._minimal && !this._toggleButtonEnd;\n\t}\n\n\tget _showToggleButtonEnd() {\n\t\treturn this.showToggleButton && !this._minimal && this._toggleButtonEnd;\n\t}\n\n\tget _ariaLabel() {\n\t\treturn this.accessibleRoleDescription ? undefined : TreeItemBase.i18nBundle.getText(TREE_ITEM_ARIA_LABEL);\n\t}\n\n\tget _accInfo() {\n\t\tconst accInfoSettings = {\n\t\t\trole: this._minimal ? \"menuitemradio\" : \"treeitem\",\n\t\t\tariaExpanded: this.showToggleButton && !this._minimal ? this.expanded : undefined,\n\t\t\tariaLevel: this._minimal ? undefined : this.level,\n\t\t\tposinset: this._posinset,\n\t\t\tsetsize: this._setsize,\n\t\t\tariaSelectedText: this.ariaSelectedText,\n\t\t\tlistItemAriaLabel: !this.accessibleName ? this._ariaLabel : undefined,\n\t\t\tariaOwns: this.expanded ? `${this._id}-subtree` : undefined,\n\t\t\tariaHaspopup: this.ariaHaspopup || undefined,\n\t\t\tariaChecked: false,\n\t\t\tariaSelected: false,\n\t\t};\n\n\t\tif (this._minimal) {\n\t\t\taccInfoSettings.ariaChecked = this.selected;\n\t\t} else {\n\t\t\taccInfoSettings.ariaSelected = this.selected;\n\t\t}\n\n\t\treturn { ...super._accInfo, ...accInfoSettings };\n\t}\n\n\t/**\n\t * Used to duck-type TreeItem elements without using instanceof\n\t * @returns {boolean}\n\t * @protected\n\t */\n\tget isTreeItem() {\n\t\treturn true;\n\t}\n\n\t/**\n\t * Call this method to manually switch the <code>expanded</code> state of a tree item.\n\t * @public\n\t * @method\n\t * @name sap.ui.webc.main.TreeItemBase#toggle\n\t */\n\ttoggle() {\n\t\tthis.expanded = !this.expanded;\n\t}\n\n\t_toggleClick(e: MouseEvent | KeyboardEvent) {\n\t\te.stopPropagation();\n\t\tthis.fireEvent<TreeItemBaseToggleEventDetail>(\"toggle\", { item: this });\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tsuper._onkeydown(e);\n\n\t\tif (!this._fixed && this.showToggleButton && isRight(e)) {\n\t\t\tif (!this.expanded) {\n\t\t\t\tthis.fireEvent<TreeItemBaseToggleEventDetail>(\"toggle\", { item: this });\n\t\t\t} else {\n\t\t\t\tthis.fireEvent<TreeItemBaseStepInEventDetail>(\"step-in\", { item: this });\n\t\t\t}\n\t\t}\n\n\t\tif (!this._fixed && isLeft(e)) {\n\t\t\tif (this.expanded) {\n\t\t\t\tthis.fireEvent<TreeItemBaseToggleEventDetail>(\"toggle\", { item: this });\n\t\t\t} else if (this.hasParent) {\n\t\t\t\tthis.fireEvent<TreeItemBaseStepOutEventDetail>(\"step-out\", { item: this });\n\t\t\t}\n\t\t}\n\t}\n\n\tget iconAccessibleName() {\n\t\treturn this.expanded ? TreeItemBase.i18nBundle.getText(TREE_ITEM_COLLAPSE_NODE) : TreeItemBase.i18nBundle.getText(TREE_ITEM_EXPAND_NODE);\n\t}\n\n\tstatic async onDefine() {\n\t\t[TreeItemBase.i18nBundle] = await Promise.all([\n\t\t\tgetI18nBundle(\"@ui5/webcomponents\"),\n\t\t\tsuper.onDefine(),\n\t\t]);\n\t}\n}\n\nexport default TreeItemBase;\nexport type {\n\tTreeItemBaseToggleEventDetail,\n\tTreeItemBaseStepInEventDetail,\n\tTreeItemBaseStepOutEventDetail,\n};\n"]}