@infineon/infineon-design-system-stencil 33.6.0--canary.1869.b1674220449fed92bf0dee5aead2bd511f2c78f1.0 → 33.6.0--canary.1871.2aa8cbc66d167a59effb50ad9e87274dd48eaa59.0

package/dist/collection/components/tree-view/tree-view-item.css

@@ -1,112 +0,0 @@
-.tree-item {
-  position: relative;
-  cursor: pointer;
-  list-style: none;
-}
-.tree-item.tree-item--expanded {
-  position: relative;
-}
-.tree-item.tree-item--has-children {
-  position: relative;
-}
-.tree-item.tree-item--has-children .tree-item__header > .tree-item__chevron-container {
-  display: flex;
-}
-.tree-item.tree-item--has-children.tree-item--expanded .tree-item__header > .tree-item__chevron-container::after {
-  display: block;
-}
-.tree-item--disabled {
-  cursor: not-allowed;
-  pointer-events: none;
-  color: #BFBBBB;
-}
-.tree-item__content {
-  display: flex;
-  flex-direction: row;
-}
-.tree-item__content:hover .tree-item__checkbox-container,
-.tree-item__content:hover .tree-item__header {
-  background-color: #F7F7F7;
-}
-.tree-item__checkbox-container {
-  position: sticky;
-  left: 0;
-  z-index: 10;
-  padding: 4px;
-  background-color: #FFFFFF;
-}
-.tree-item__header {
-  flex-grow: 1;
-  display: flex;
-  align-items: center;
-  white-space: nowrap;
-  height: 20px;
-  padding-top: 4px;
-  padding-right: 16px;
-  padding-bottom: 4px;
-  padding-left: 8px;
-}
-.tree-item__chevron-container {
-  display: none;
-  align-items: center;
-  margin-right: 8px;
-  height: 20px;
-}
-.tree-item__chevron-container::after {
-  --height-line-start: 28px;
-  display: none;
-  content: "";
-  position: absolute;
-  z-index: 1;
-  top: var(--height-line-start);
-  left: auto;
-  margin-left: 8px;
-  width: 1px;
-  height: calc(100% - var(--height-line-start));
-  background-color: #EEEDED;
-}
-.tree-item--disabled .tree-item__chevron-container::after {
-  color: #EEEDED;
-}
-.tree-item__chevron.chevron-down {
-  transform: rotate(90deg);
-}
-.tree-item__chevron.chevron-right {
-  transform: rotate(0);
-}
-.tree-item__label-icon-container {
-  display: flex;
-  align-items: center;
-}
-.tree-item__label-icon-container:focus {
-  outline: none;
-}
-.tree-item__label-icon-container:focus-visible {
-  outline: 2px solid #0A8276;
-  outline-offset: 2px;
-  border-radius: 1px;
-}
-.tree-item__icon-container {
-  position: relative;
-  width: 16px;
-  height: 16px;
-}
-.tree-item__icon-container ifx-icon {
-  position: absolute;
-  left: 0;
-  top: 0;
-  opacity: 1;
-  transition: opacity 0.2s ease-in-out;
-}
-.tree-item__icon-container ifx-icon.icon--hidden {
-  opacity: 0;
-}
-.tree-item__label {
-  padding-left: 8px;
-}
-.tree-item__children {
-  display: none;
-}
-.tree-item[aria-expanded=true] > .tree-item__children {
-  display: block;
-}

package/dist/collection/components/tree-view/tree-view-item.js

@@ -1,487 +0,0 @@
-import { h, Fragment } from "@stencil/core";
-export class TreeViewItem {
-    constructor() {
-        this.expanded = false;
-        this.initiallyExpanded = false;
-        this.disableItem = false;
-        this.hasChildren = false;
-        this.isChecked = false;
-        this.partialChecked = false;
-        this.level = 0;
-        this.disableAllItems = false;
-        this.expandAllItems = false;
-        this.findChildren = () => Array.from(this.host.children)
-            .filter((child) => child instanceof HTMLElement && child.tagName === 'IFX-TREE-VIEW-ITEM');
-        this.calculateNodeLevel = () => {
-            let level = 0, parent = this.host.parentElement;
-            while (parent) {
-                if (parent.tagName === 'IFX-TREE-VIEW-ITEM')
-                    level++;
-                parent = parent.parentElement;
-            }
-            return level;
-        };
-        this.handleStateChange = (event) => {
-            if (this.disabled)
-                return;
-            event.stopPropagation();
-            this.updateCheckState(event.detail.checked);
-        };
-        this.handleCheckboxChange = (event) => {
-            var _a, _b;
-            if (this.disabled)
-                return;
-            this.updateCheckState((_b = (_a = event.detail) === null || _a === void 0 ? void 0 : _a.checked) !== null && _b !== void 0 ? _b : !this.isChecked);
-        };
-        this.handleHeaderClick = ({ target }) => {
-            if (this.disabled)
-                return;
-            if (!target.closest('.tree-item__checkbox-container, .tree-item__chevron-container')) {
-                this.updateCheckState(!this.isChecked);
-            }
-        };
-        this.toggleExpand = () => {
-            if (this.disabled)
-                return;
-            this.hasChildren && (this.expanded = !this.expanded);
-        };
-        this.handleKeyDown = (event) => {
-            var _a, _b, _c, _d, _e, _f;
-            const allItems = Array.from(((_a = this.host
-                .closest('ifx-tree-view')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('ifx-tree-view-item')) || []);
-            const visibleItems = allItems.filter(item => {
-                var _a, _b;
-                let parent = (_a = item.parentElement) === null || _a === void 0 ? void 0 : _a.closest('ifx-tree-view-item');
-                while (parent) {
-                    const parentCmp = parent;
-                    if (!(parentCmp.expandAllItems || parentCmp.expanded)) {
-                        return false;
-                    }
-                    parent = (_b = parent.parentElement) === null || _b === void 0 ? void 0 : _b.closest('ifx-tree-view-item');
-                }
-                return true;
-            });
-            const currentIndex = visibleItems.findIndex(el => el === this.host);
-            function focusLabelIcon(el) {
-                el === null || el === void 0 ? void 0 : el.focus();
-            }
-            switch (event.key) {
-                case 'ArrowDown': {
-                    event.preventDefault();
-                    let nextIndex = currentIndex + 1;
-                    while (nextIndex < visibleItems.length) {
-                        const next = visibleItems[nextIndex];
-                        if (!next.disabled) {
-                            focusLabelIcon((_b = next.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.tree-item__label-icon-container'));
-                            break;
-                        }
-                        nextIndex++;
-                    }
-                    break;
-                }
-                case 'ArrowUp': {
-                    event.preventDefault();
-                    let prevIndex = currentIndex - 1;
-                    while (prevIndex >= 0) {
-                        const prev = visibleItems[prevIndex];
-                        if (!prev.disabled) {
-                            focusLabelIcon((_c = prev.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('.tree-item__label-icon-container'));
-                            break;
-                        }
-                        prevIndex--;
-                    }
-                    break;
-                }
-                case 'ArrowRight': {
-                    event.preventDefault();
-                    if (!this.isExpanded && this.hasChildren) {
-                        this.expanded = true;
-                    }
-                    else if (this.isExpanded && this.hasChildren) {
-                        const firstChild = this.host.querySelector('ifx-tree-view-item');
-                        if (firstChild && !firstChild.disabled) {
-                            focusLabelIcon((_d = firstChild.shadowRoot) === null || _d === void 0 ? void 0 : _d.querySelector('.tree-item__label-icon-container'));
-                        }
-                    }
-                    break;
-                }
-                case 'ArrowLeft': {
-                    event.preventDefault();
-                    if (this.isExpanded && this.hasChildren) {
-                        this.expanded = false;
-                    }
-                    else {
-                        const parent = (_e = this.host.parentElement) === null || _e === void 0 ? void 0 : _e.closest('ifx-tree-view-item');
-                        if (parent && !parent.disabled) {
-                            focusLabelIcon((_f = parent.shadowRoot) === null || _f === void 0 ? void 0 : _f.querySelector('.tree-item__label-icon-container'));
-                        }
-                    }
-                    break;
-                }
-                case ' ':
-                case 'Enter': {
-                    event.preventDefault();
-                    this.updateCheckState(!this.isChecked);
-                    break;
-                }
-            }
-        };
-    }
-    get disabled() {
-        return this.disableAllItems || this.disableItem;
-    }
-    get isExpanded() {
-        return this.expandAllItems || this.expanded;
-    }
-    componentWillLoad() {
-        this.initializeNode();
-        this.setupEventListeners();
-    }
-    componentDidLoad() {
-        this.observeDisableAllItems();
-        this.observeExpandAllItems();
-        if (this.shouldExpandFromParent()) {
-            this.expandAllDescendants();
-        }
-    }
-    shouldExpandFromParent() {
-        let parent = this.host.parentElement;
-        while (parent) {
-            if (parent.tagName === 'IFX-TREE-VIEW' &&
-                (parent.hasAttribute('expand-all-items') || parent.hasAttribute('data-expand-all-items'))) {
-                return true;
-            }
-            parent = parent.parentElement;
-        }
-        return false;
-    }
-    expandAllDescendants() {
-        this.expanded = true;
-        const children = this.findChildren();
-        for (const child of children) {
-            if (typeof child.expanded !== 'undefined') {
-                child.expanded = true;
-            }
-            if (typeof child.expandAllDescendants === 'function') {
-                child.expandAllDescendants();
-            }
-        }
-    }
-    observeDisableAllItems() {
-        let parent = this.host.parentElement;
-        while (parent) {
-            if (parent.tagName === 'IFX-TREE-VIEW') {
-                const observer = new MutationObserver(mutations => {
-                    for (const mutation of mutations) {
-                        if (mutation.type === 'attributes' &&
-                            mutation.attributeName === 'disable-all-items') {
-                            const disableAll = parent.disableAllItems;
-                            this.disableAllItems = !!disableAll || parent.hasAttribute('disable-all-items');
-                        }
-                    }
-                });
-                observer.observe(parent, { attributes: true });
-                const disableAll = parent.disableAllItems;
-                this.disableAllItems = !!disableAll || parent.hasAttribute('disable-all-items');
-                break;
-            }
-            parent = parent.parentElement;
-        }
-    }
-    observeExpandAllItems() {
-        let parent = this.host.parentElement;
-        while (parent) {
-            if (parent.tagName === 'IFX-TREE-VIEW' || parent.hasAttribute('data-expand-all-items')) {
-                const observer = new MutationObserver(mutations => {
-                    for (const mutation of mutations) {
-                        if (mutation.type === 'attributes' &&
-                            mutation.attributeName === 'data-expand-all-items') {
-                            this.expandAllItems = parent.hasAttribute('data-expand-all-items');
-                        }
-                    }
-                });
-                observer.observe(parent, { attributes: true });
-                this.expandAllItems = parent.hasAttribute('data-expand-all-items');
-                break;
-            }
-            parent = parent.parentElement;
-        }
-    }
-    initializeNode() {
-        this.expanded = this.initiallyExpanded;
-        this.hasChildren = this.findChildren().length > 0;
-        this.level = this.calculateNodeLevel();
-        this.host.setAttribute('data-level', this.level.toString());
-    }
-    setupEventListeners() {
-        this.host.addEventListener('internal-check-state-change', this.handleStateChange);
-    }
-    async updateCheckState(checked) {
-        if (this.disabled)
-            return;
-        this.setNodeState({ isChecked: checked, partialChecked: false });
-        await this.updateChildrenState(checked);
-        this.updateParentState();
-    }
-    handleExpandedChange(newValue) {
-        this.ifxTreeViewItemExpandChange.emit(newValue);
-    }
-    handleDisableItemChange(newValue) {
-        this.ifxTreeViewItemDisableChange.emit(newValue);
-    }
-    setNodeState(state) {
-        this.isChecked = state.isChecked;
-        this.partialChecked = state.partialChecked;
-        this.ifxTreeViewItemCheckChange.emit({
-            checked: this.isChecked,
-            indeterminate: this.partialChecked,
-        });
-    }
-    async updateChildrenState(checked) {
-        const children = this.findChildren();
-        for (const child of children) {
-            await child.componentOnReady();
-            child.dispatchEvent(new CustomEvent('internal-check-state-change', {
-                detail: { checked },
-                bubbles: false,
-                composed: true
-            }));
-        }
-    }
-    findSiblingNodes(parent) {
-        const parentEl = parent.parentElement;
-        if (!parentEl)
-            return [];
-        return Array.from(parentEl.querySelectorAll('ifx-tree-view-item')).map(el => el);
-    }
-    updateParentState() {
-        var _a;
-        const parent = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.closest('ifx-tree-view-item');
-        if (!parent)
-            return;
-        parent.componentOnReady().then(resolved => {
-            const parentNode = resolved;
-            if (!(parentNode === null || parentNode === void 0 ? void 0 : parentNode.updateParentState))
-                return;
-            const siblings = this.findSiblingNodes(parent);
-            const states = this.calculateSiblingStates(siblings);
-            parentNode.setNodeState({
-                isChecked: states.allChecked,
-                partialChecked: !states.allChecked && states.someChecked
-            });
-            parentNode.updateParentState();
-        });
-    }
-    calculateSiblingStates(siblings) {
-        return {
-            allChecked: siblings.every(sib => sib.isChecked),
-            someChecked: siblings.some(sib => {
-                const node = sib;
-                return node.isChecked || node.partialChecked;
-            })
-        };
-    }
-    render() {
-        return (h("div", { key: '10a31a82078320a73d026ec8d42ae23d78049a9b', class: {
-                'tree-item': true,
-                'tree-item--expanded': this.isExpanded,
-                'tree-item--has-children': this.hasChildren,
-                'tree-item--disabled': this.disabled,
-            }, role: "treeitem", "aria-expanded": this.isExpanded ? 'true' : 'false', "data-level": this.level, "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel }, h("div", { key: 'ad1dcf1ca93fd3f35f00d411e8740bfc54dc7c9f', class: "tree-item__content" }, this.renderCheckbox(), this.renderHeader()), this.isExpanded && h("div", { key: '1023010ffb83954bc852cafc18f3b79003ffbf3e', class: "tree-item__children" }, h("slot", { key: 'c7cd0a61015b29a99b963576c8bc3fd0725541f3' }))));
-    }
-    renderHeader() {
-        return (h("div", { class: "tree-item__header", style: { paddingLeft: `${this.level * 24 + 10}px` }, onClick: this.handleHeaderClick, tabIndex: -1, "aria-disabled": this.disabled ? 'true' : undefined }, this.renderControls()));
-    }
-    renderCheckbox() {
-        return (h("div", { class: "tree-item__checkbox-container", onClick: e => e.stopPropagation() }, h("ifx-checkbox", { size: 's', checked: this.isChecked, indeterminate: this.partialChecked, onIfxChange: this.handleCheckboxChange, disabled: this.disabled })));
-    }
-    renderControls() {
-        return [
-            this.hasChildren && (h("div", { class: "tree-item__chevron-container", onClick: this.toggleExpand }, h("ifx-icon", { class: `tree-item__chevron ${this.isExpanded ? 'chevron-down' : 'chevron-right'}`, icon: "chevron-right-16" }), h("div", { class: "tree-item__line" }))),
-            h("div", { class: "tree-item__label-icon-container", tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown }, h("div", { class: "tree-item__icon-container" }, this.hasChildren ? (h(Fragment, null, h("ifx-icon", { class: { 'icon--hidden': this.isExpanded }, icon: "folder-16" }), h("ifx-icon", { class: { 'icon--hidden': !this.isExpanded }, icon: "folder-open-16" }))) : (h("ifx-icon", { icon: "file-16" }))), h("span", { class: "tree-item__label" }, this.label))
-        ];
-    }
-    static get is() { return "ifx-tree-view-item"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["tree-view-item.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["tree-view-item.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "label",
-                "reflect": false
-            },
-            "expanded": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "expanded",
-                "reflect": true,
-                "defaultValue": "false"
-            },
-            "initiallyExpanded": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "initially-expanded",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "disableItem": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "disable-item",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "ariaLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | null",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "aria-label",
-                "reflect": false
-            }
-        };
-    }
-    static get states() {
-        return {
-            "hasChildren": {},
-            "isChecked": {},
-            "partialChecked": {},
-            "level": {},
-            "disableAllItems": {},
-            "expandAllItems": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "ifxTreeViewItemExpandChange",
-                "name": "ifxTreeViewItemExpandChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                }
-            }, {
-                "method": "ifxTreeViewItemCheckChange",
-                "name": "ifxTreeViewItemCheckChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "{ checked: boolean; indeterminate: boolean }",
-                    "resolved": "{ checked: boolean; indeterminate: boolean; }",
-                    "references": {}
-                }
-            }, {
-                "method": "ifxTreeViewItemDisableChange",
-                "name": "ifxTreeViewItemDisableChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                }
-            }];
-    }
-    static get elementRef() { return "host"; }
-    static get watchers() {
-        return [{
-                "propName": "expanded",
-                "methodName": "handleExpandedChange"
-            }, {
-                "propName": "disableItem",
-                "methodName": "handleDisableItemChange"
-            }];
-    }
-}
-//# sourceMappingURL=tree-view-item.js.map

package/dist/collection/components/tree-view/tree-view-item.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tree-view-item.js","sourceRoot":"","sources":["../../../src/components/tree-view/tree-view-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Element, Fragment, Event, EventEmitter, Watch } from '@stencil/core';\n\ninterface TreeState {\n  isChecked: boolean;\n  partialChecked: boolean;\n}\n\ntype HTMLIfxTreeViewItemElement = HTMLElement & { componentOnReady: () => Promise<unknown> };\n\n@Component({\n  tag: 'ifx-tree-view-item',\n  styleUrl: 'tree-view-item.scss',\n  shadow: true,\n})\nexport class TreeViewItem {\n  @Element() host: HTMLElement;\n  @Prop() label: string;\n  @Prop({ reflect: true, mutable: true }) expanded: boolean = false;\n  @Prop() initiallyExpanded: boolean = false;\n  @Prop() disableItem: boolean = false;\n  @Prop() ariaLabel: string | null;\n\n  @Event() ifxTreeViewItemExpandChange: EventEmitter<boolean>;\n  @Event() ifxTreeViewItemCheckChange: EventEmitter<{ checked: boolean; indeterminate: boolean }>;\n  @Event() ifxTreeViewItemDisableChange: EventEmitter<boolean>;\n\n  @State() private hasChildren: boolean = false;\n  @State() private isChecked: boolean = false;\n  @State() private partialChecked: boolean = false;\n  @State() private level: number = 0;\n  @State() private disableAllItems: boolean = false;\n  @State() private expandAllItems: boolean = false;\n\n  private get disabled() {\n    return this.disableAllItems || this.disableItem;\n  }\n\n  private get isExpanded() {\n    return this.expandAllItems || this.expanded;\n  }\n\n  private findChildren = () => Array.from(this.host.children)\n    .filter((child): child is HTMLElement =>\n      child instanceof HTMLElement && child.tagName === 'IFX-TREE-VIEW-ITEM'\n    );\n\n  private calculateNodeLevel = (): number => {\n    let level = 0, parent = this.host.parentElement;\n    while (parent) {\n      if (parent.tagName === 'IFX-TREE-VIEW-ITEM') level++;\n      parent = parent.parentElement;\n    }\n    return level;\n  };\n\n  componentWillLoad() {\n    this.initializeNode();\n    this.setupEventListeners();\n  }\n\n  componentDidLoad() {\n    this.observeDisableAllItems();\n    this.observeExpandAllItems();\n    if (this.shouldExpandFromParent()) {\n      this.expandAllDescendants();\n    }\n  }\n\n  private shouldExpandFromParent(): boolean {\n    let parent = this.host.parentElement;\n    while (parent) {\n      if (\n        parent.tagName === 'IFX-TREE-VIEW' &&\n        (parent.hasAttribute('expand-all-items') || parent.hasAttribute('data-expand-all-items'))\n      ) {\n        return true;\n      }\n      parent = parent.parentElement;\n    }\n    return false;\n  }\n\n  private expandAllDescendants() {\n    this.expanded = true;\n    const children = this.findChildren();\n    for (const child of children) {\n      if (typeof (child as any).expanded !== 'undefined') {\n        (child as any).expanded = true;\n      }\n      if (typeof (child as any).expandAllDescendants === 'function') {\n        (child as any).expandAllDescendants();\n      }\n    }\n  }\n\n  private observeDisableAllItems() {\n    let parent = this.host.parentElement;\n    while (parent) {\n      if (parent.tagName === 'IFX-TREE-VIEW') {\n        const observer = new MutationObserver(mutations => {\n          for (const mutation of mutations) {\n            if (\n              mutation.type === 'attributes' &&\n              mutation.attributeName === 'disable-all-items'\n            ) {\n              const disableAll = (parent as any).disableAllItems;\n              this.disableAllItems = !!disableAll || parent.hasAttribute('disable-all-items');\n            }\n          }\n        });\n        observer.observe(parent, { attributes: true });\n        const disableAll = (parent as any).disableAllItems;\n        this.disableAllItems = !!disableAll || parent.hasAttribute('disable-all-items');\n        break;\n      }\n      parent = parent.parentElement;\n    }\n  }\n\n  private observeExpandAllItems() {\n    let parent = this.host.parentElement;\n    while (parent) {\n      if (parent.tagName === 'IFX-TREE-VIEW' || parent.hasAttribute('data-expand-all-items')) {\n        const observer = new MutationObserver(mutations => {\n          for (const mutation of mutations) {\n            if (\n              mutation.type === 'attributes' &&\n              mutation.attributeName === 'data-expand-all-items'\n            ) {\n              this.expandAllItems = parent.hasAttribute('data-expand-all-items');\n            }\n          }\n        });\n        observer.observe(parent, { attributes: true });\n        this.expandAllItems = parent.hasAttribute('data-expand-all-items');\n        break;\n      }\n      parent = parent.parentElement;\n    }\n  }\n\n  private initializeNode() {\n    this.expanded = this.initiallyExpanded;\n    this.hasChildren = this.findChildren().length > 0;\n    this.level = this.calculateNodeLevel();\n    this.host.setAttribute('data-level', this.level.toString());\n  }\n\n  private setupEventListeners() {\n    this.host.addEventListener('internal-check-state-change', this.handleStateChange);\n  }\n\n  private handleStateChange = (event: CustomEvent) => {\n    if (this.disabled) return;\n    event.stopPropagation();\n    this.updateCheckState(event.detail.checked);\n  };\n\n  private handleCheckboxChange = (event: CustomEvent) => {\n    if (this.disabled) return;\n    this.updateCheckState(event.detail?.checked ?? !this.isChecked);\n  };\n\n  private handleHeaderClick = ({ target }: MouseEvent) => {\n    if (this.disabled) return;\n    if (!(target as HTMLElement).closest('.tree-item__checkbox-container, .tree-item__chevron-container')) {\n      this.updateCheckState(!this.isChecked);\n    }\n  };\n\n  private async updateCheckState(checked: boolean) {\n    if (this.disabled) return;\n    this.setNodeState({ isChecked: checked, partialChecked: false });\n    await this.updateChildrenState(checked);\n    this.updateParentState();\n  }\n\n  @Watch('expanded')\n  handleExpandedChange(newValue: boolean) {\n    this.ifxTreeViewItemExpandChange.emit(newValue);\n  }\n\n  @Watch('disableItem')\n  handleDisableItemChange(newValue: boolean) {\n    this.ifxTreeViewItemDisableChange.emit(newValue);\n  }\n\n  private setNodeState(state: TreeState) {\n    this.isChecked = state.isChecked;\n    this.partialChecked = state.partialChecked;\n    this.ifxTreeViewItemCheckChange.emit({\n      checked: this.isChecked,\n      indeterminate: this.partialChecked,\n    });\n  }\n\n  private async updateChildrenState(checked: boolean) {\n    const children = this.findChildren();\n    for (const child of children) {\n      await (child as HTMLIfxTreeViewItemElement).componentOnReady();\n      child.dispatchEvent(new CustomEvent('internal-check-state-change', {\n        detail: { checked },\n        bubbles: false,\n        composed: true\n      }));\n    }\n  }\n\n  private findSiblingNodes(parent: HTMLElement): HTMLIfxTreeViewItemElement[] {\n    const parentEl = parent.parentElement;\n    if (!parentEl) return [];\n    return Array.from(\n      parentEl.querySelectorAll('ifx-tree-view-item')\n    ).map(el => el as HTMLIfxTreeViewItemElement);\n  }\n\n  private updateParentState() {\n    const parent = this.host.parentElement?.closest('ifx-tree-view-item') as HTMLIfxTreeViewItemElement;\n    if (!parent) return;\n    parent.componentOnReady().then(resolved => {\n      const parentNode = resolved as unknown as TreeViewItem;\n      if (!parentNode?.updateParentState) return;\n      const siblings = this.findSiblingNodes(parent);\n      const states = this.calculateSiblingStates(siblings);\n      parentNode.setNodeState({\n        isChecked: states.allChecked,\n        partialChecked: !states.allChecked && states.someChecked\n      });\n      parentNode.updateParentState();\n    });\n  }\n\n  private calculateSiblingStates(siblings: HTMLIfxTreeViewItemElement[]) {\n    return {\n      allChecked: siblings.every(sib => (sib as unknown as TreeViewItem).isChecked),\n      someChecked: siblings.some(sib => {\n        const node = sib as unknown as TreeViewItem;\n        return node.isChecked || node.partialChecked;\n      })\n    };\n  }\n\n  private toggleExpand = () => {\n    if (this.disabled) return;\n    this.hasChildren && (this.expanded = !this.expanded);\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n\n    const allItems = Array.from(\n      this.host\n        .closest('ifx-tree-view')\n        ?.querySelectorAll('ifx-tree-view-item') || []\n    );\n\n    const visibleItems = allItems.filter(item => {\n      let parent = item.parentElement?.closest('ifx-tree-view-item');\n      while (parent) {\n        const parentCmp = parent as any;\n        if (!(parentCmp.expandAllItems || parentCmp.expanded)) {\n          return false;\n        }\n        parent = parent.parentElement?.closest('ifx-tree-view-item');\n      }\n      return true;\n    });\n\n    const currentIndex = visibleItems.findIndex(el => el === this.host);\n\n    function focusLabelIcon(el: Element | null) {\n      (el as HTMLElement | null)?.focus();\n    }\n\n    switch (event.key) {\n      case 'ArrowDown': {\n        event.preventDefault();\n        let nextIndex = currentIndex + 1;\n        while (nextIndex < visibleItems.length) {\n          const next = visibleItems[nextIndex] as any;\n          if (!next.disabled) {\n            focusLabelIcon(next.shadowRoot?.querySelector('.tree-item__label-icon-container'));\n            break;\n          }\n          nextIndex++;\n        }\n        break;\n      }\n      case 'ArrowUp': {\n        event.preventDefault();\n        let prevIndex = currentIndex - 1;\n        while (prevIndex >= 0) {\n          const prev = visibleItems[prevIndex] as any;\n          if (!prev.disabled) {\n            focusLabelIcon(prev.shadowRoot?.querySelector('.tree-item__label-icon-container'));\n            break;\n          }\n          prevIndex--;\n        }\n        break;\n      }\n      case 'ArrowRight': {\n        event.preventDefault();\n        if (!this.isExpanded && this.hasChildren) {\n          this.expanded = true;\n        } else if (this.isExpanded && this.hasChildren) {\n          const firstChild = this.host.querySelector('ifx-tree-view-item');\n          if (firstChild && !(firstChild as any).disabled) {\n            focusLabelIcon((firstChild as HTMLElement).shadowRoot?.querySelector('.tree-item__label-icon-container'));\n          }\n        }\n        break;\n      }\n      case 'ArrowLeft': {\n        event.preventDefault();\n        if (this.isExpanded && this.hasChildren) {\n          this.expanded = false;\n        } else {\n          const parent = this.host.parentElement?.closest('ifx-tree-view-item');\n          if (parent && !(parent as any).disabled) {\n            focusLabelIcon((parent as HTMLElement).shadowRoot?.querySelector('.tree-item__label-icon-container'));\n          }\n        }\n        break;\n      }\n      case ' ':\n      case 'Enter': {\n        event.preventDefault();\n        this.updateCheckState(!this.isChecked);\n        break;\n      }\n    }\n  };\n\n  render() {\n    return (\n      <div\n        class={{\n          'tree-item': true,\n          'tree-item--expanded': this.isExpanded,\n          'tree-item--has-children': this.hasChildren,\n          'tree-item--disabled': this.disabled,\n        }}\n        role=\"treeitem\"\n        aria-expanded={this.isExpanded ? 'true' : 'false'}\n        data-level={this.level}\n        aria-disabled={this.disabled ? 'true' : undefined}\n        aria-label={this.ariaLabel}\n      >\n        <div class=\"tree-item__content\">\n          {this.renderCheckbox()}\n          {this.renderHeader()}\n        </div>\n        {this.isExpanded && <div class=\"tree-item__children\"><slot/></div>}\n      </div>\n    );\n  }\n\n  private renderHeader() {\n    return (\n      <div\n        class=\"tree-item__header\"\n        style={{ paddingLeft: `${this.level * 24 + 10}px` }}\n        onClick={this.handleHeaderClick}\n        tabIndex={-1}\n        aria-disabled={this.disabled ? 'true' : undefined}\n      >\n        {this.renderControls()}\n      </div>\n    );\n  }\n\n  private renderCheckbox() {\n    return (\n      <div class=\"tree-item__checkbox-container\" onClick={e => e.stopPropagation()}>\n        <ifx-checkbox\n          size='s'\n          checked={this.isChecked}\n          indeterminate={this.partialChecked}\n          onIfxChange={this.handleCheckboxChange}\n          disabled={this.disabled}\n        />\n      </div>\n    );\n  }\n\n  private renderControls() {\n    return [\n      this.hasChildren && (\n        <div class=\"tree-item__chevron-container\" onClick={this.toggleExpand}>\n          <ifx-icon class={`tree-item__chevron ${this.isExpanded ? 'chevron-down' : 'chevron-right'}`}\n                    icon=\"chevron-right-16\"/>\n          <div class=\"tree-item__line\"/>\n        </div>\n      ),\n      <div\n        class=\"tree-item__label-icon-container\"\n        tabIndex={this.disabled ? -1 : 0}\n        onKeyDown={this.handleKeyDown}\n      >\n        <div class=\"tree-item__icon-container\">\n          {\n            this.hasChildren ? (\n              <Fragment>\n                <ifx-icon class={{'icon--hidden': this.isExpanded}} icon=\"folder-16\"/>\n                <ifx-icon class={{'icon--hidden': !this.isExpanded}} icon=\"folder-open-16\"/>\n              </Fragment>\n            ) : (\n              <ifx-icon icon=\"file-16\"/>\n            )\n          }\n        </div>\n        <span class=\"tree-item__label\">{this.label}</span>\n      </div>\n    ];\n  }\n}\n"]}

package/dist/collection/components/tree-view/tree-view.css

@@ -1,18 +0,0 @@
-:host {
-  display: block;
-}
-
-.tree-view {
-  font-family: var(--ifx-font-family, sans-serif);
-  font-size: 14px;
-  color: var(--ifx-color-text, #1a1a1a);
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: column;
-  overflow-x: auto;
-  overflow-y: hidden;
-}
-.tree-view__label {
-  font: 600 1.125rem/1.625rem "Source Sans 3";
-  margin-bottom: 8px;
-}