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

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

@@ -1,169 +0,0 @@
-import { h } from "@stencil/core";
-export class TreeView {
-    constructor() {
-        this.disableAllItems = false;
-        this.expandAllItems = false;
-        this.handleSlotRef = (el) => {
-            if (el) {
-                if (this.disableAllItems) {
-                    el.setAttribute('data-disable-all-items', 'true');
-                }
-                else {
-                    el.removeAttribute('data-disable-all-items');
-                }
-                if (this.expandAllItems) {
-                    el.setAttribute('data-expand-all-items', 'true');
-                }
-                else {
-                    el.removeAttribute('data-expand-all-items');
-                }
-            }
-        };
-    }
-    handleExpandAllItemsChange(newValue) {
-        this.ifxTreeViewExpandAllChange.emit(newValue);
-    }
-    handleDisableAllItemsChange(newValue) {
-        this.ifxTreeViewDisableAllChange.emit(newValue);
-    }
-    render() {
-        return (h("div", { key: 'e4008bca00cc0ed1517a8ca27a64ac94dec0d694', class: `tree-view ${this.disableAllItems ? ' tree-view--disabled' : ''}`, role: "tree", "aria-label": this.ariaLabel }, this.label && this.label.trim() !== '' && h("div", { key: '654d40e84aadd93ff83ec1401fbf99ac46ae06e3', class: "tree-view__label" }, this.label), h("slot", { key: '1a5a28cec9dde5cdfc100ab97cdfe99ffddc886b', ref: this.handleSlotRef })));
-    }
-    static get is() { return "ifx-tree-view"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["tree-view.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["tree-view.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "label",
-                "reflect": false
-            },
-            "disableAllItems": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "disable-all-items",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "expandAllItems": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "expand-all-items",
-                "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 events() {
-        return [{
-                "method": "ifxTreeViewExpandAllChange",
-                "name": "ifxTreeViewExpandAllChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                }
-            }, {
-                "method": "ifxTreeViewDisableAllChange",
-                "name": "ifxTreeViewDisableAllChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                }
-            }];
-    }
-    static get watchers() {
-        return [{
-                "propName": "expandAllItems",
-                "methodName": "handleExpandAllItemsChange"
-            }, {
-                "propName": "disableAllItems",
-                "methodName": "handleDisableAllItemsChange"
-            }];
-    }
-}
-//# sourceMappingURL=tree-view.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"tree-view.js","sourceRoot":"","sources":["../../../src/components/tree-view/tree-view.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,KAAK,EAAE,MAAM,eAAe,CAAC;AAO/E,MAAM,OAAO,QAAQ;IALrB;QAOU,oBAAe,GAAY,KAAK,CAAC;QACjC,mBAAc,GAAY,KAAK,CAAC;QAgBhC,kBAAa,GAAG,CAAC,EAA0B,EAAE,EAAE;YACrD,IAAI,EAAE,EAAE,CAAC;gBACP,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;oBACzB,EAAE,CAAC,YAAY,CAAC,wBAAwB,EAAE,MAAM,CAAC,CAAC;gBACpD,CAAC;qBAAM,CAAC;oBACN,EAAE,CAAC,eAAe,CAAC,wBAAwB,CAAC,CAAC;gBAC/C,CAAC;gBACD,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;oBACxB,EAAE,CAAC,YAAY,CAAC,uBAAuB,EAAE,MAAM,CAAC,CAAC;gBACnD,CAAC;qBAAM,CAAC;oBACN,EAAE,CAAC,eAAe,CAAC,uBAAuB,CAAC,CAAC;gBAC9C,CAAC;YACH,CAAC;QACH,CAAC,CAAC;KAcH;IApCC,0BAA0B,CAAC,QAAiB;QAC1C,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACjD,CAAC;IAGD,2BAA2B,CAAC,QAAiB;QAC3C,IAAI,CAAC,2BAA2B,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAClD,CAAC;IAiBD,MAAM;QACJ,OAAO,CACL,4DACE,KAAK,EAAE,aAAa,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE,EAAE,EACxE,IAAI,EAAC,MAAM,gBACC,IAAI,CAAC,SAAS;YAEzB,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,4DAAK,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,KAAK,CAAO;YAC3F,6DAAM,GAAG,EAAE,IAAI,CAAC,aAAa,GAAS,CAClC,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Watch } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-tree-view',\n  styleUrl: 'tree-view.scss',\n  shadow: true,\n})\nexport class TreeView {\n  @Prop() label?: string;\n  @Prop() disableAllItems: boolean = false;\n  @Prop() expandAllItems: boolean = false;\n  @Prop() ariaLabel: string | null;\n\n  @Event() ifxTreeViewExpandAllChange: EventEmitter<boolean>;\n  @Event() ifxTreeViewDisableAllChange: EventEmitter<boolean>;\n\n  @Watch('expandAllItems')\n  handleExpandAllItemsChange(newValue: boolean) {\n    this.ifxTreeViewExpandAllChange.emit(newValue);\n  }\n\n  @Watch('disableAllItems')\n  handleDisableAllItemsChange(newValue: boolean) {\n    this.ifxTreeViewDisableAllChange.emit(newValue);\n  }\n\n  private handleSlotRef = (el: HTMLSlotElement | null) => {\n    if (el) {\n      if (this.disableAllItems) {\n        el.setAttribute('data-disable-all-items', 'true');\n      } else {\n        el.removeAttribute('data-disable-all-items');\n      }\n      if (this.expandAllItems) {\n        el.setAttribute('data-expand-all-items', 'true');\n      } else {\n        el.removeAttribute('data-expand-all-items');\n      }\n    }\n  };\n\n  render() {\n    return (\n      <div\n        class={`tree-view ${this.disableAllItems ? ' tree-view--disabled' : ''}`}\n        role=\"tree\"\n        aria-label={this.ariaLabel}\n      >\n        {this.label && this.label.trim() !== '' && <div class=\"tree-view__label\">{this.label}</div>}\n        <slot ref={this.handleSlotRef}></slot>\n      </div>\n    );\n  }\n}\n"]}

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

@@ -1,272 +0,0 @@
-import { action } from "@storybook/addon-actions";
-const hideAllControlsExcept = (allowedKeys) => {
-    const allProps = [
-        'label', 'disableAllItems', 'expandAllItems', 'ariaLabel'
-    ];
-    const argTypes = {};
-    for (const prop of allProps) {
-        if (!allowedKeys.includes(prop)) {
-            argTypes[prop] = { table: { disable: true } };
-        }
-    }
-    return argTypes;
-};
-const disableCustomEventControls = {
-    ifxTreeViewExpandAllChange: { table: { disable: true } },
-    ifxTreeViewDisableAllChange: { table: { disable: true } },
-    ifxTreeViewItemExpandChange: { table: { disable: true } },
-    ifxTreeViewItemCheckChange: { table: { disable: true } },
-    ifxTreeViewItemDisableChange: { table: { disable: true } }
-};
-const meta = {
-    title: 'Components/Tree View',
-    tags: ['autodocs'],
-    parameters: {
-        controls: { expanded: true },
-        docs: {
-            description: {
-                component: 'Tree View component with nested items, checkboxes, keyboard navigation, and accessibility.',
-            },
-        },
-    },
-    argTypes: {
-        // --- FUNCTION ---
-        disableAllItems: {
-            control: 'boolean',
-            description: 'Disables all tree items.',
-            table: { category: 'Function', defaultValue: { summary: 'false' } },
-        },
-        expandAllItems: {
-            control: 'boolean',
-            description: 'Expands all tree items.',
-            table: { category: 'Function', defaultValue: { summary: 'false' } },
-        },
-        initiallyExpanded: {
-            table: { category: 'Function', type: { summary: 'boolean' }, defaultValue: { summary: 'false' } },
-            description: 'Expands this tree item initially (set as attribute on the item). No interactive control.',
-            control: false,
-        },
-        disableItem: {
-            table: { category: 'Function', type: { summary: 'boolean' }, defaultValue: { summary: 'false' } },
-            description: 'Disables this tree item (set as attribute on the item). No interactive control.',
-            control: false,
-        },
-        // --- Label ---
-        label: {
-            control: 'text',
-            description: 'Label / Heading for tree view.',
-            table: { category: 'Label', defaultValue: { summary: 'false' } },
-        },
-        // --- ARIA LABELS ---
-        ariaLabel: {
-            control: 'text',
-            description: 'ARIA label for the tree view.',
-            table: { category: 'Aria Labels', defaultValue: { summary: 'Tree View' } },
-        },
-        ariaLabelItem: {
-            control: 'text',
-            description: 'ARIA label for all tree view items.',
-            table: { category: 'Aria Labels', defaultValue: { summary: 'Tree Item' } },
-        },
-        // --- CUSTOM EVENTS ---
-        ifxTreeViewExpandAllChange: {
-            action: 'ifxTreeViewExpandAllChange',
-            table: { category: 'Custom Events' },
-            description: 'Fired when expandAllItems changes.',
-        },
-        ifxTreeViewDisableAllChange: {
-            action: 'ifxTreeViewDisableAllChange',
-            table: { category: 'Custom Events' },
-            description: 'Fired when disableAllItems changes.',
-        },
-        ifxTreeViewItemExpandChange: {
-            action: 'ifxTreeViewItemExpandChange',
-            table: { category: 'Custom Events' },
-            description: 'Fired when a tree item is expanded/collapsed.',
-        },
-        ifxTreeViewItemCheckChange: {
-            action: 'ifxTreeViewItemCheckChange',
-            table: { category: 'Custom Events' },
-            description: 'Fired when a tree item is checked/unchecked.',
-        },
-        ifxTreeViewItemDisableChange: {
-            action: 'ifxTreeViewItemDisableChange',
-            table: { category: 'Custom Events' },
-            description: 'Fired when a tree item is disabled/enabled.',
-        },
-    }
-};
-export default meta;
-const BaseTemplate = (args) => {
-    const el = document.createElement('ifx-tree-view');
-    if (args.label)
-        el.setAttribute('label', args.label);
-    el.setAttribute('aria-label', args.ariaLabel);
-    if (args.disableAllItems)
-        el.setAttribute('disable-all-items', 'true');
-    else
-        el.removeAttribute('disable-all-items');
-    if (args.expandAllItems)
-        el.setAttribute('expand-all-items', 'true');
-    else
-        el.removeAttribute('expand-all-items');
-    const ariaLabelItemAttr = args.ariaLabelItem
-        ? `aria-label="${args.ariaLabelItem}"`
-        : '';
-    el.innerHTML = `
-    <ifx-tree-view-item label="Root Folder" icon="folder" initially-expanded="true" ${ariaLabelItemAttr}>
-      <ifx-tree-view-item label="Subfolder 1" icon="folder" initially-expanded="true" ${ariaLabelItemAttr}>
-        <ifx-tree-view-item label="File 1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        <ifx-tree-view-item label="File 1-2.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        <ifx-tree-view-item label="Subfolder 1-1" icon="folder" ${ariaLabelItemAttr}>
-          <ifx-tree-view-item label="File 1-1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-          <ifx-tree-view-item label="File 1-1-2.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        </ifx-tree-view-item>
-      </ifx-tree-view-item>
-      <ifx-tree-view-item label="Subfolder 2" icon="folder" ${ariaLabelItemAttr}>
-        <ifx-tree-view-item label="File 2-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        <ifx-tree-view-item label="Subfolder 2-1" icon="folder" ${ariaLabelItemAttr}>
-          <ifx-tree-view-item label="File 2-1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-          <ifx-tree-view-item label="Subfolder 2-1-1" icon="folder" ${ariaLabelItemAttr}>
-            <ifx-tree-view-item label="File 2-1-1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-          </ifx-tree-view-item>
-        </ifx-tree-view-item>
-      </ifx-tree-view-item>
-      <ifx-tree-view-item label="File at root.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-    </ifx-tree-view-item>
-    <ifx-tree-view-item label="Another Root Folder" icon="folder" ${ariaLabelItemAttr}>
-      <ifx-tree-view-item label="File A.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-      <ifx-tree-view-item label="File B.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-    </ifx-tree-view-item>
-    <ifx-tree-view-item label="Single File" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-  `;
-    el.addEventListener('ifxTreeViewExpandAllChange', action('ifxTreeViewExpandAllChange'));
-    el.addEventListener('ifxTreeViewDisableAllChange', action('ifxTreeViewDisableAllChange'));
-    el.addEventListener('ifxTreeViewItemExpandChange', action('ifxTreeViewItemExpandChange'));
-    el.addEventListener('ifxTreeViewItemCheckChange', action('ifxTreeViewItemCheckChange'));
-    el.addEventListener('ifxTreeViewItemDisableChange', action('ifxTreeViewItemDisableChange'));
-    return el;
-};
-export const Default = BaseTemplate.bind({});
-Default.args = {
-    disableAllItems: false,
-    expandAllItems: false,
-    label: 'Tree Example',
-    ariaLabel: 'Tree View',
-    ariaLabelItem: 'Tree Item',
-};
-Default.argTypes = Object.assign(Object.assign(Object.assign({}, hideAllControlsExcept(['label', 'disableAllItems', 'expandAllItems', 'ariaLabel'])), disableCustomEventControls), { ifxTreeViewExpandAllChange: {
-        action: 'ifxTreeViewExpandAllChange',
-        table: { category: 'Custom Events' },
-        description: 'Fired when expandAllItems changes.',
-    }, ifxTreeViewDisableAllChange: {
-        action: 'ifxTreeViewDisableAllChange',
-        table: { category: 'Custom Events' },
-        description: 'Fired when disableAllItems changes.',
-    }, ifxTreeViewItemExpandChange: {
-        action: 'ifxTreeViewItemExpandChange',
-        table: { category: 'Custom Events' },
-        description: 'Fired when a tree item is expanded/collapsed.',
-    }, ifxTreeViewItemCheckChange: {
-        action: 'ifxTreeViewItemCheckChange',
-        table: { category: 'Custom Events' },
-        description: 'Fired when a tree item is checked/unchecked.',
-    }, ifxTreeViewItemDisableChange: {
-        action: 'ifxTreeViewItemDisableChange',
-        table: { category: 'Custom Events' },
-        description: 'Fired when a tree item is disabled/enabled.',
-    } });
-export const ContainerDemo = (args) => {
-    const ariaLabelItemAttr = args.ariaLabelItem
-        ? `aria-label="${args.ariaLabelItem}"`
-        : '';
-    const wrapper = document.createElement('div');
-    wrapper.style.maxWidth = '225px';
-    wrapper.style.border = '1px solid #ccc';
-    wrapper.style.padding = '8px';
-    wrapper.style.overflow = 'auto';
-    const el = document.createElement('ifx-tree-view');
-    el.setAttribute('label', args.label);
-    el.setAttribute('aria-label', args.ariaLabel);
-    if (args.disableAllItems)
-        el.setAttribute('disable-all-items', 'true');
-    if (args.expandAllItems)
-        el.setAttribute('expand-all-items', 'true');
-    el.innerHTML = `
-    <ifx-tree-view-item label="Root Folder" icon="folder" initially-expanded="true" ${ariaLabelItemAttr}>
-      <ifx-tree-view-item label="Subfolder 1" icon="folder" initially-expanded="true" ${ariaLabelItemAttr}>
-        <ifx-tree-view-item label="File 1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        <ifx-tree-view-item label="File 1-2.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        <ifx-tree-view-item label="Subfolder 1-1" icon="folder" ${ariaLabelItemAttr}>
-          <ifx-tree-view-item label="File 1-1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-          <ifx-tree-view-item label="File 1-1-2.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        </ifx-tree-view-item>
-      </ifx-tree-view-item>
-      <ifx-tree-view-item label="Subfolder 2" icon="folder" ${ariaLabelItemAttr}>
-        <ifx-tree-view-item label="File 2-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-        <ifx-tree-view-item label="Subfolder 2-1" icon="folder" ${ariaLabelItemAttr}>
-          <ifx-tree-view-item label="File 2-1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-          <ifx-tree-view-item label="Subfolder 2-1-1" icon="folder" ${ariaLabelItemAttr}>
-            <ifx-tree-view-item label="File 2-1-1-1.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-          </ifx-tree-view-item>
-        </ifx-tree-view-item>
-      </ifx-tree-view-item>
-      <ifx-tree-view-item label="File at root.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-    </ifx-tree-view-item>
-    <ifx-tree-view-item label="Another Root Folder" icon="folder" ${ariaLabelItemAttr}>
-      <ifx-tree-view-item label="File A.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-      <ifx-tree-view-item label="File B.txt" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-    </ifx-tree-view-item>
-    <ifx-tree-view-item label="Single File" icon="file" ${ariaLabelItemAttr}></ifx-tree-view-item>
-  `;
-    el.addEventListener('ifxTreeViewExpandAllChange', action('ifxTreeViewExpandAllChange'));
-    el.addEventListener('ifxTreeViewDisableAllChange', action('ifxTreeViewDisableAllChange'));
-    el.addEventListener('ifxTreeViewItemExpandChange', action('ifxTreeViewItemExpandChange'));
-    el.addEventListener('ifxTreeViewItemCheckChange', action('ifxTreeViewItemCheckChange'));
-    el.addEventListener('ifxTreeViewItemDisableChange', action('ifxTreeViewItemDisableChange'));
-    wrapper.appendChild(el);
-    return wrapper;
-};
-ContainerDemo.args = {
-    disableAllItems: false,
-    expandAllItems: false,
-    label: 'Tree Example',
-    ariaLabel: 'Tree View',
-    ariaLabelItem: 'Tree Item',
-};
-ContainerDemo.storyName = 'TreeView with scrollbar';
-ContainerDemo.parameters = {
-    controls: { disable: true }
-};
-export const SingleItemStates = (args) => {
-    const el = document.createElement('ifx-tree-view');
-    el.setAttribute('aria-label', args.ariaLabel);
-    const ariaLabelItemAttr = args.ariaLabelItem
-        ? `aria-label="${args.ariaLabelItem}"`
-        : '';
-    el.innerHTML = `
-    <ifx-tree-view-item label="File" ${ariaLabelItemAttr}></ifx-tree-view-item>
-    <ifx-tree-view-item label="File disabled" ${ariaLabelItemAttr} disable-item="true"></ifx-tree-view-item>
-    <ifx-tree-view-item label="Folder initially expanded" initially-expanded="true" ${ariaLabelItemAttr}>
-      <ifx-tree-view-item label="File" ${ariaLabelItemAttr}></ifx-tree-view-item>
-      <ifx-tree-view-item label="File disabled" disable-item="true" ${ariaLabelItemAttr}></ifx-tree-view-item>
-    </ifx-tree-view-item>
-    <ifx-tree-view-item label="Normal Item" ${ariaLabelItemAttr}></ifx-tree-view-item>
-    <ifx-tree-view-item label="Normal Item" ${ariaLabelItemAttr}></ifx-tree-view-item>
-  `;
-    el.addEventListener('ifxTreeViewExpandAllChange', action('ifxTreeViewExpandAllChange'));
-    el.addEventListener('ifxTreeViewDisableAllChange', action('ifxTreeViewDisableAllChange'));
-    el.addEventListener('ifxTreeViewItemExpandChange', action('ifxTreeViewItemExpandChange'));
-    el.addEventListener('ifxTreeViewItemCheckChange', action('ifxTreeViewItemCheckChange'));
-    el.addEventListener('ifxTreeViewItemDisableChange', action('ifxTreeViewItemDisableChange'));
-    return el;
-};
-SingleItemStates.args = {
-    ariaLabel: 'Tree View',
-    ariaLabelItem: 'Tree Item',
-};
-SingleItemStates.storyName = 'Single Item Expanded & disabled';
-SingleItemStates.parameters = {
-    controls: { disable: true }
-};
-//# sourceMappingURL=tree-view.stories.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"tree-view.stories.js","sourceRoot":"","sources":["../../../src/components/tree-view/tree-view.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAGlD,MAAM,qBAAqB,GAAG,CAAC,WAAqB,EAAE,EAAE;IACtD,MAAM,QAAQ,GAAG;QACf,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,WAAW;KAC1D,CAAC;IACF,MAAM,QAAQ,GAAwB,EAAE,CAAC;IACzC,KAAK,MAAM,IAAI,IAAI,QAAQ,EAAE,CAAC;QAC5B,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;YAChC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,CAAC;QAChD,CAAC;IACH,CAAC;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,0BAA0B,GAAG;IACjC,0BAA0B,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACxD,2BAA2B,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACzD,2BAA2B,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACzD,0BAA0B,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IACxD,4BAA4B,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;CAC3D,CAAC;AAEF,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,sBAAsB;IAC7B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;QAC5B,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE,4FAA4F;aACxG;SACF;KACF;IACD,QAAQ,EAAE;QACR,mBAAmB;QACnB,eAAe,EAAE;YACf,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,0BAA0B;YACvC,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE;SACpE;QACD,cAAc,EAAE;YACd,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,yBAAyB;YACtC,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE;SACpE;QACD,iBAAiB,EAAE;YACjB,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE;YACjG,WAAW,EAAE,0FAA0F;YACvG,OAAO,EAAE,KAAK;SACf;QACD,WAAW,EAAE;YACX,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE;YACjG,WAAW,EAAE,iFAAiF;YAC9F,OAAO,EAAE,KAAK;SACf;QAED,gBAAgB;QAChB,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,gCAAgC;YAC7C,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE;SACjE;QAED,sBAAsB;QACtB,SAAS,EAAE;YACT,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,+BAA+B;YAC5C,KAAK,EAAE,EAAE,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE;SAC3E;QACD,aAAa,EAAE;YACb,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,qCAAqC;YAClD,KAAK,EAAE,EAAE,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE;SAC3E;QAED,wBAAwB;QACxB,0BAA0B,EAAE;YAC1B,MAAM,EAAE,4BAA4B;YACpC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;YACpC,WAAW,EAAE,oCAAoC;SAClD;QACD,2BAA2B,EAAE;YAC3B,MAAM,EAAE,6BAA6B;YACrC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;YACpC,WAAW,EAAE,qCAAqC;SACnD;QACD,2BAA2B,EAAE;YAC3B,MAAM,EAAE,6BAA6B;YACrC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;YACpC,WAAW,EAAE,+CAA+C;SAC7D;QACD,0BAA0B,EAAE;YAC1B,MAAM,EAAE,4BAA4B;YACpC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;YACpC,WAAW,EAAE,8CAA8C;SAC5D;QACD,4BAA4B,EAAE;YAC5B,MAAM,EAAE,8BAA8B;YACtC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;YACpC,WAAW,EAAE,6CAA6C;SAC3D;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,MAAM,YAAY,GAAY,CAAC,IAAI,EAAE,EAAE;IACrC,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IACnD,IAAI,IAAI,CAAC,KAAK;QAAE,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACrD,EAAE,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;IAE9C,IAAI,IAAI,CAAC,eAAe;QAAE,EAAE,CAAC,YAAY,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;;QAClE,EAAE,CAAC,eAAe,CAAC,mBAAmB,CAAC,CAAC;IAE7C,IAAI,IAAI,CAAC,cAAc;QAAE,EAAE,CAAC,YAAY,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;;QAChE,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;IAE5C,MAAM,iBAAiB,GAAG,IAAI,CAAC,aAAa;QAC1C,CAAC,CAAC,eAAe,IAAI,CAAC,aAAa,GAAG;QACtC,CAAC,CAAC,EAAE,CAAC;IAEP,EAAE,CAAC,SAAS,GAAG;sFACqE,iBAAiB;wFACf,iBAAiB;+DAC1C,iBAAiB;+DACjB,iBAAiB;kEACd,iBAAiB;mEAChB,iBAAiB;mEACjB,iBAAiB;;;8DAGtB,iBAAiB;+DAChB,iBAAiB;kEACd,iBAAiB;mEAChB,iBAAiB;sEACd,iBAAiB;uEAChB,iBAAiB;;;;iEAIvB,iBAAiB;;oEAEd,iBAAiB;2DAC1B,iBAAiB;2DACjB,iBAAiB;;0DAElB,iBAAiB;GACxE,CAAC;IAEF,EAAE,CAAC,gBAAgB,CAAC,4BAA4B,EAAE,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC;IACxF,EAAE,CAAC,gBAAgB,CAAC,6BAA6B,EAAE,MAAM,CAAC,6BAA6B,CAAC,CAAC,CAAC;IAC1F,EAAE,CAAC,gBAAgB,CAAC,6BAA6B,EAAE,MAAM,CAAC,6BAA6B,CAAC,CAAC,CAAC;IAC1F,EAAE,CAAC,gBAAgB,CAAC,4BAA4B,EAAE,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC;IACxF,EAAE,CAAC,gBAAgB,CAAC,8BAA8B,EAAE,MAAM,CAAC,8BAA8B,CAAC,CAAC,CAAC;IAE5F,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,OAAO,CAAC,IAAI,GAAG;IACb,eAAe,EAAE,KAAK;IACtB,cAAc,EAAE,KAAK;IACrB,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,WAAW;CAC3B,CAAC;AAEF,OAAO,CAAC,QAAQ,iDACX,qBAAqB,CAAC,CAAC,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,WAAW,CAAC,CAAC,GAClF,0BAA0B,KAE7B,0BAA0B,EAAE;QAC1B,MAAM,EAAE,4BAA4B;QACpC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;QACpC,WAAW,EAAE,oCAAoC;KAClD,EACD,2BAA2B,EAAE;QAC3B,MAAM,EAAE,6BAA6B;QACrC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;QACpC,WAAW,EAAE,qCAAqC;KACnD,EACD,2BAA2B,EAAE;QAC3B,MAAM,EAAE,6BAA6B;QACrC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;QACpC,WAAW,EAAE,+CAA+C;KAC7D,EACD,0BAA0B,EAAE;QAC1B,MAAM,EAAE,4BAA4B;QACpC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;QACpC,WAAW,EAAE,8CAA8C;KAC5D,EACD,4BAA4B,EAAE;QAC5B,MAAM,EAAE,8BAA8B;QACtC,KAAK,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE;QACpC,WAAW,EAAE,6CAA6C;KAC3D,GACF,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAY,CAAC,IAAI,EAAE,EAAE;IAC7C,MAAM,iBAAiB,GAAG,IAAI,CAAC,aAAa;QAC1C,CAAC,CAAC,eAAe,IAAI,CAAC,aAAa,GAAG;QACtC,CAAC,CAAC,EAAE,CAAC;IAGP,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,OAAO,CAAC;IACjC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,gBAAgB,CAAC;IACxC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC;IAC9B,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,CAAC;IAEhC,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IACnD,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACrC,EAAE,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;IAE9C,IAAI,IAAI,CAAC,eAAe;QAAE,EAAE,CAAC,YAAY,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;IACvE,IAAI,IAAI,CAAC,cAAc;QAAE,EAAE,CAAC,YAAY,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;IAErE,EAAE,CAAC,SAAS,GAAG;sFACqE,iBAAiB;wFACf,iBAAiB;+DAC1C,iBAAiB;+DACjB,iBAAiB;kEACd,iBAAiB;mEAChB,iBAAiB;mEACjB,iBAAiB;;;8DAGtB,iBAAiB;+DAChB,iBAAiB;kEACd,iBAAiB;mEAChB,iBAAiB;sEACd,iBAAiB;uEAChB,iBAAiB;;;;iEAIvB,iBAAiB;;oEAEd,iBAAiB;2DAC1B,iBAAiB;2DACjB,iBAAiB;;0DAElB,iBAAiB;GACxE,CAAC;IAEF,EAAE,CAAC,gBAAgB,CAAC,4BAA4B,EAAE,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC;IACxF,EAAE,CAAC,gBAAgB,CAAC,6BAA6B,EAAE,MAAM,CAAC,6BAA6B,CAAC,CAAC,CAAC;IAC1F,EAAE,CAAC,gBAAgB,CAAC,6BAA6B,EAAE,MAAM,CAAC,6BAA6B,CAAC,CAAC,CAAC;IAC1F,EAAE,CAAC,gBAAgB,CAAC,4BAA4B,EAAE,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC;IACxF,EAAE,CAAC,gBAAgB,CAAC,8BAA8B,EAAE,MAAM,CAAC,8BAA8B,CAAC,CAAC,CAAC;IAE5F,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;IACxB,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,aAAa,CAAC,IAAI,GAAG;IACnB,eAAe,EAAE,KAAK;IACtB,cAAc,EAAE,KAAK;IACrB,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,WAAW;CAC3B,CAAC;AAEF,aAAa,CAAC,SAAS,GAAG,yBAAyB,CAAC;AACpD,aAAa,CAAC,UAAU,GAAG;IACzB,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;CAC5B,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAY,CAAC,IAAI,EAAE,EAAE;IAChD,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IACnD,EAAE,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;IAE9C,MAAM,iBAAiB,GAAG,IAAI,CAAC,aAAa;QAC1C,CAAC,CAAC,eAAe,IAAI,CAAC,aAAa,GAAG;QACtC,CAAC,CAAC,EAAE,CAAC;IAEP,EAAE,CAAC,SAAS,GAAG;uCACsB,iBAAiB;gDACR,iBAAiB;sFACqB,iBAAiB;yCAC9D,iBAAiB;sEACY,iBAAiB;;8CAEzC,iBAAiB;8CACjB,iBAAiB;GAC5D,CAAC;IAEF,EAAE,CAAC,gBAAgB,CAAC,4BAA4B,EAAE,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC;IACxF,EAAE,CAAC,gBAAgB,CAAC,6BAA6B,EAAE,MAAM,CAAC,6BAA6B,CAAC,CAAC,CAAC;IAC1F,EAAE,CAAC,gBAAgB,CAAC,6BAA6B,EAAE,MAAM,CAAC,6BAA6B,CAAC,CAAC,CAAC;IAC1F,EAAE,CAAC,gBAAgB,CAAC,4BAA4B,EAAE,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC;IACxF,EAAE,CAAC,gBAAgB,CAAC,8BAA8B,EAAE,MAAM,CAAC,8BAA8B,CAAC,CAAC,CAAC;IAE5F,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC;AAEF,gBAAgB,CAAC,IAAI,GAAG;IACtB,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,WAAW;CAC3B,CAAC;AAEF,gBAAgB,CAAC,SAAS,GAAG,iCAAiC,CAAC;AAC/D,gBAAgB,CAAC,UAAU,GAAG;IAC5B,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;CAC5B,CAAC","sourcesContent":["import { action } from '@storybook/addon-actions';\nimport type { Meta, StoryFn } from '@storybook/html';\n\nconst hideAllControlsExcept = (allowedKeys: string[]) => {\n  const allProps = [\n    'label', 'disableAllItems', 'expandAllItems', 'ariaLabel'\n  ];\n  const argTypes: Record<string, any> = {};\n  for (const prop of allProps) {\n    if (!allowedKeys.includes(prop)) {\n      argTypes[prop] = { table: { disable: true } };\n    }\n  }\n  return argTypes;\n};\n\nconst disableCustomEventControls = {\n  ifxTreeViewExpandAllChange: { table: { disable: true } },\n  ifxTreeViewDisableAllChange: { table: { disable: true } },\n  ifxTreeViewItemExpandChange: { table: { disable: true } },\n  ifxTreeViewItemCheckChange: { table: { disable: true } },\n  ifxTreeViewItemDisableChange: { table: { disable: true } }\n};\n\nconst meta: Meta = {\n  title: 'Components/Tree View',\n  tags: ['autodocs'],\n  parameters: {\n    controls: { expanded: true },\n    docs: {\n      description: {\n        component: 'Tree View component with nested items, checkboxes, keyboard navigation, and accessibility.',\n      },\n    },\n  },\n  argTypes: {\n    // --- FUNCTION ---\n    disableAllItems: {\n      control: 'boolean',\n      description: 'Disables all tree items.',\n      table: { category: 'Function', defaultValue: { summary: 'false' } },\n    },\n    expandAllItems: {\n      control: 'boolean',\n      description: 'Expands all tree items.',\n      table: { category: 'Function', defaultValue: { summary: 'false' } },\n    },\n    initiallyExpanded: {\n      table: { category: 'Function', type: { summary: 'boolean' }, defaultValue: { summary: 'false' } },\n      description: 'Expands this tree item initially (set as attribute on the item). No interactive control.',\n      control: false,\n    },\n    disableItem: {\n      table: { category: 'Function', type: { summary: 'boolean' }, defaultValue: { summary: 'false' } },\n      description: 'Disables this tree item (set as attribute on the item). No interactive control.',\n      control: false,\n    },\n\n    // --- Label ---\n    label: {\n      control: 'text',\n      description: 'Label / Heading for tree view.',\n      table: { category: 'Label', defaultValue: { summary: 'false' } },\n    },\n\n    // --- ARIA LABELS ---\n    ariaLabel: {\n      control: 'text',\n      description: 'ARIA label for the tree view.',\n      table: { category: 'Aria Labels', defaultValue: { summary: 'Tree View' } },\n    },\n    ariaLabelItem: {\n      control: 'text',\n      description: 'ARIA label for all tree view items.',\n      table: { category: 'Aria Labels', defaultValue: { summary: 'Tree Item' } },\n    },\n\n    // --- CUSTOM EVENTS ---\n    ifxTreeViewExpandAllChange: {\n      action: 'ifxTreeViewExpandAllChange',\n      table: { category: 'Custom Events' },\n      description: 'Fired when expandAllItems changes.',\n    },\n    ifxTreeViewDisableAllChange: {\n      action: 'ifxTreeViewDisableAllChange',\n      table: { category: 'Custom Events' },\n      description: 'Fired when disableAllItems changes.',\n    },\n    ifxTreeViewItemExpandChange: {\n      action: 'ifxTreeViewItemExpandChange',\n      table: { category: 'Custom Events' },\n      description: 'Fired when a tree item is expanded/collapsed.',\n    },\n    ifxTreeViewItemCheckChange: {\n      action: 'ifxTreeViewItemCheckChange',\n      table: { category: 'Custom Events' },\n      description: 'Fired when a tree item is checked/unchecked.',\n    },\n    ifxTreeViewItemDisableChange: {\n      action: 'ifxTreeViewItemDisableChange',\n      table: { category: 'Custom Events' },\n      description: 'Fired when a tree item is disabled/enabled.',\n    },\n  }\n};\n\nexport default meta;\n\nconst BaseTemplate: StoryFn = (args) => {\n  const el = document.createElement('ifx-tree-view');\n  if (args.label) el.setAttribute('label', args.label);\n  el.setAttribute('aria-label', args.ariaLabel);\n\n  if (args.disableAllItems) el.setAttribute('disable-all-items', 'true');\n  else el.removeAttribute('disable-all-items');\n\n  if (args.expandAllItems) el.setAttribute('expand-all-items', 'true');\n  else el.removeAttribute('expand-all-items');\n\n  const ariaLabelItemAttr = args.ariaLabelItem\n    ? `aria-label=\"${args.ariaLabelItem}\"`\n    : '';\n\n  el.innerHTML = `\n    <ifx-tree-view-item label=\"Root Folder\" icon=\"folder\" initially-expanded=\"true\" ${ariaLabelItemAttr}>\n      <ifx-tree-view-item label=\"Subfolder 1\" icon=\"folder\" initially-expanded=\"true\" ${ariaLabelItemAttr}>\n        <ifx-tree-view-item label=\"File 1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        <ifx-tree-view-item label=\"File 1-2.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        <ifx-tree-view-item label=\"Subfolder 1-1\" icon=\"folder\" ${ariaLabelItemAttr}>\n          <ifx-tree-view-item label=\"File 1-1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n          <ifx-tree-view-item label=\"File 1-1-2.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        </ifx-tree-view-item>\n      </ifx-tree-view-item>\n      <ifx-tree-view-item label=\"Subfolder 2\" icon=\"folder\" ${ariaLabelItemAttr}>\n        <ifx-tree-view-item label=\"File 2-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        <ifx-tree-view-item label=\"Subfolder 2-1\" icon=\"folder\" ${ariaLabelItemAttr}>\n          <ifx-tree-view-item label=\"File 2-1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n          <ifx-tree-view-item label=\"Subfolder 2-1-1\" icon=\"folder\" ${ariaLabelItemAttr}>\n            <ifx-tree-view-item label=\"File 2-1-1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n          </ifx-tree-view-item>\n        </ifx-tree-view-item>\n      </ifx-tree-view-item>\n      <ifx-tree-view-item label=\"File at root.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n    </ifx-tree-view-item>\n    <ifx-tree-view-item label=\"Another Root Folder\" icon=\"folder\" ${ariaLabelItemAttr}>\n      <ifx-tree-view-item label=\"File A.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n      <ifx-tree-view-item label=\"File B.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n    </ifx-tree-view-item>\n    <ifx-tree-view-item label=\"Single File\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n  `;\n\n  el.addEventListener('ifxTreeViewExpandAllChange', action('ifxTreeViewExpandAllChange'));\n  el.addEventListener('ifxTreeViewDisableAllChange', action('ifxTreeViewDisableAllChange'));\n  el.addEventListener('ifxTreeViewItemExpandChange', action('ifxTreeViewItemExpandChange'));\n  el.addEventListener('ifxTreeViewItemCheckChange', action('ifxTreeViewItemCheckChange'));\n  el.addEventListener('ifxTreeViewItemDisableChange', action('ifxTreeViewItemDisableChange'));\n\n  return el;\n};\n\nexport const Default = BaseTemplate.bind({});\nDefault.args = {\n  disableAllItems: false,\n  expandAllItems: false,\n  label: 'Tree Example',\n  ariaLabel: 'Tree View',\n  ariaLabelItem: 'Tree Item',\n};\n\nDefault.argTypes = {\n  ...hideAllControlsExcept(['label', 'disableAllItems', 'expandAllItems', 'ariaLabel']),\n  ...disableCustomEventControls,\n\n  ifxTreeViewExpandAllChange: {\n    action: 'ifxTreeViewExpandAllChange',\n    table: { category: 'Custom Events' },\n    description: 'Fired when expandAllItems changes.',\n  },\n  ifxTreeViewDisableAllChange: {\n    action: 'ifxTreeViewDisableAllChange',\n    table: { category: 'Custom Events' },\n    description: 'Fired when disableAllItems changes.',\n  },\n  ifxTreeViewItemExpandChange: {\n    action: 'ifxTreeViewItemExpandChange',\n    table: { category: 'Custom Events' },\n    description: 'Fired when a tree item is expanded/collapsed.',\n  },\n  ifxTreeViewItemCheckChange: {\n    action: 'ifxTreeViewItemCheckChange',\n    table: { category: 'Custom Events' },\n    description: 'Fired when a tree item is checked/unchecked.',\n  },\n  ifxTreeViewItemDisableChange: {\n    action: 'ifxTreeViewItemDisableChange',\n    table: { category: 'Custom Events' },\n    description: 'Fired when a tree item is disabled/enabled.',\n  },\n};\n\nexport const ContainerDemo: StoryFn = (args) => {\n  const ariaLabelItemAttr = args.ariaLabelItem\n    ? `aria-label=\"${args.ariaLabelItem}\"`\n    : '';\n\n\n  const wrapper = document.createElement('div');\n  wrapper.style.maxWidth = '225px';\n  wrapper.style.border = '1px solid #ccc';\n  wrapper.style.padding = '8px';\n  wrapper.style.overflow = 'auto';\n\n  const el = document.createElement('ifx-tree-view');\n  el.setAttribute('label', args.label);\n  el.setAttribute('aria-label', args.ariaLabel);\n\n  if (args.disableAllItems) el.setAttribute('disable-all-items', 'true');\n  if (args.expandAllItems) el.setAttribute('expand-all-items', 'true');\n\n  el.innerHTML = `\n    <ifx-tree-view-item label=\"Root Folder\" icon=\"folder\" initially-expanded=\"true\" ${ariaLabelItemAttr}>\n      <ifx-tree-view-item label=\"Subfolder 1\" icon=\"folder\" initially-expanded=\"true\" ${ariaLabelItemAttr}>\n        <ifx-tree-view-item label=\"File 1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        <ifx-tree-view-item label=\"File 1-2.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        <ifx-tree-view-item label=\"Subfolder 1-1\" icon=\"folder\" ${ariaLabelItemAttr}>\n          <ifx-tree-view-item label=\"File 1-1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n          <ifx-tree-view-item label=\"File 1-1-2.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        </ifx-tree-view-item>\n      </ifx-tree-view-item>\n      <ifx-tree-view-item label=\"Subfolder 2\" icon=\"folder\" ${ariaLabelItemAttr}>\n        <ifx-tree-view-item label=\"File 2-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n        <ifx-tree-view-item label=\"Subfolder 2-1\" icon=\"folder\" ${ariaLabelItemAttr}>\n          <ifx-tree-view-item label=\"File 2-1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n          <ifx-tree-view-item label=\"Subfolder 2-1-1\" icon=\"folder\" ${ariaLabelItemAttr}>\n            <ifx-tree-view-item label=\"File 2-1-1-1.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n          </ifx-tree-view-item>\n        </ifx-tree-view-item>\n      </ifx-tree-view-item>\n      <ifx-tree-view-item label=\"File at root.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n    </ifx-tree-view-item>\n    <ifx-tree-view-item label=\"Another Root Folder\" icon=\"folder\" ${ariaLabelItemAttr}>\n      <ifx-tree-view-item label=\"File A.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n      <ifx-tree-view-item label=\"File B.txt\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n    </ifx-tree-view-item>\n    <ifx-tree-view-item label=\"Single File\" icon=\"file\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n  `;\n\n  el.addEventListener('ifxTreeViewExpandAllChange', action('ifxTreeViewExpandAllChange'));\n  el.addEventListener('ifxTreeViewDisableAllChange', action('ifxTreeViewDisableAllChange'));\n  el.addEventListener('ifxTreeViewItemExpandChange', action('ifxTreeViewItemExpandChange'));\n  el.addEventListener('ifxTreeViewItemCheckChange', action('ifxTreeViewItemCheckChange'));\n  el.addEventListener('ifxTreeViewItemDisableChange', action('ifxTreeViewItemDisableChange'));\n\n  wrapper.appendChild(el);\n  return wrapper;\n};\n\nContainerDemo.args = {\n  disableAllItems: false,\n  expandAllItems: false,\n  label: 'Tree Example',\n  ariaLabel: 'Tree View',\n  ariaLabelItem: 'Tree Item',\n};\n\nContainerDemo.storyName = 'TreeView with scrollbar';\nContainerDemo.parameters = {\n  controls: { disable: true }\n};\n\nexport const SingleItemStates: StoryFn = (args) => {\n  const el = document.createElement('ifx-tree-view');\n  el.setAttribute('aria-label', args.ariaLabel);\n\n  const ariaLabelItemAttr = args.ariaLabelItem\n    ? `aria-label=\"${args.ariaLabelItem}\"`\n    : '';\n\n  el.innerHTML = `\n    <ifx-tree-view-item label=\"File\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n    <ifx-tree-view-item label=\"File disabled\" ${ariaLabelItemAttr} disable-item=\"true\"></ifx-tree-view-item>\n    <ifx-tree-view-item label=\"Folder initially expanded\" initially-expanded=\"true\" ${ariaLabelItemAttr}>\n      <ifx-tree-view-item label=\"File\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n      <ifx-tree-view-item label=\"File disabled\" disable-item=\"true\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n    </ifx-tree-view-item>\n    <ifx-tree-view-item label=\"Normal Item\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n    <ifx-tree-view-item label=\"Normal Item\" ${ariaLabelItemAttr}></ifx-tree-view-item>\n  `;\n\n  el.addEventListener('ifxTreeViewExpandAllChange', action('ifxTreeViewExpandAllChange'));\n  el.addEventListener('ifxTreeViewDisableAllChange', action('ifxTreeViewDisableAllChange'));\n  el.addEventListener('ifxTreeViewItemExpandChange', action('ifxTreeViewItemExpandChange'));\n  el.addEventListener('ifxTreeViewItemCheckChange', action('ifxTreeViewItemCheckChange'));\n  el.addEventListener('ifxTreeViewItemDisableChange', action('ifxTreeViewItemDisableChange'));\n\n  return el;\n};\n\nSingleItemStates.args = {\n  ariaLabel: 'Tree View',\n  ariaLabelItem: 'Tree Item',\n};\n\nSingleItemStates.storyName = 'Single Item Expanded & disabled';\nSingleItemStates.parameters = {\n  controls: { disable: true }\n};\n"]}

package/dist/components/ifx-tree-view-item.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IfxTreeViewItem extends Components.IfxTreeViewItem, HTMLElement {}
-export const IfxTreeViewItem: {
-    prototype: IfxTreeViewItem;
-    new (): IfxTreeViewItem;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;