@qualcomm-ui/angular 1.7.2 → 1.8.0

package/fesm2022/qualcomm-ui-angular-tree.mjs

@@ -1,4 +1,718 @@
+import * as i0 from '@angular/core';
+import { Injectable, input, computed, Directive, inject, TemplateRef, Component, Injector, contentChild, NgModule } from '@angular/core';
+import * as i2 from '@qualcomm-ui/angular-core/machine';
+import { BaseApiContextService, createApiContext, useTrackBindings, useMachine, normalizeProps, ApiContextDirective, QBindDirective } from '@qualcomm-ui/angular-core/machine';
+import { useCollapsibleContext, CollapsibleContextService, provideCollapsibleContext } from '@qualcomm-ui/angular-core/collapsible';
+import { useId } from '@qualcomm-ui/angular-core/common';
+import { CoreTreeBranchContentDirective, CoreTreeBranchIndentGuideDirective, CoreTreeBranchNodeDirective, CoreTreeBranchTriggerDirective, CoreTreeBranchDirective, useTreeNodeStateContext, CoreTreeLabelDirective, CoreTreeLeafNodeDirective, CoreTreeNodeActionDirective, CoreTreeNodeCheckboxDirective, TreeNodeStateContextService, CoreTreeNodeIconDirective, CoreTreeNodeIndicatorDirective, CoreTreeNodeTextDirective, useTreeContext, TreeNodePropsContextService, provideTreeNodePropsContext, provideTreeNodeStateContext, CoreTreeRootDirective, provideTreeContext } from '@qualcomm-ui/angular-core/tree';
+import { collapsibleClasses } from '@qualcomm-ui/qds-core/collapsible';
+import { mergeProps } from '@qualcomm-ui/utils/merge-props';
+import { ChevronRight } from 'lucide-angular';
+import '@qualcomm-ui/angular-core/lucide';
+import * as i1 from '@qualcomm-ui/angular/icon';
+import { IconDirective } from '@qualcomm-ui/angular/icon';
+import * as i1$2 from '@angular/common';
+import { DOCUMENT, NgTemplateOutlet } from '@angular/common';
+import { useRenderStrategyContext, provideRenderStrategyContext } from '@qualcomm-ui/angular-core/presence';
+import { collapsibleMachine, createCollapsibleApi } from '@qualcomm-ui/core/collapsible';
+import { useInlineIconButtonApi } from '@qualcomm-ui/angular/inline-icon-button';
+import { createQdsCheckmarkApi } from '@qualcomm-ui/qds-core/checkmark';
+import * as i1$1 from '@qualcomm-ui/angular/checkmark';
+import { CheckmarkIconComponent } from '@qualcomm-ui/angular/checkmark';
+import { createQdsTreeApi } from '@qualcomm-ui/qds-core/tree';
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class QdsTreeContextService extends BaseApiContextService {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: QdsTreeContextService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: QdsTreeContextService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: QdsTreeContextService, decorators: [{
+            type: Injectable
+        }] });
+const [QDS_TREE_CONTEXT, useQdsTreeContext, provideQdsTreeContext,] = createApiContext("QdsTreeContext", QdsTreeContextService);
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeBranchContentDirective extends CoreTreeBranchContentDirective {
+    /**
+     * HTML {@link https://www.w3schools.com/html/html_id.asp id attribute}. If
+     * omitted, a unique identifier will be generated for accessibility.)
+     */
+    id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
+    hostId = computed(() => useId(this, this.id()), ...(ngDevMode ? [{ debugName: "hostId" }] : []));
+    qdsContext = useQdsTreeContext();
+    collapsibleContext = useCollapsibleContext();
+    trackBindings = useTrackBindings(() => mergeProps(this.treeContext().getBranchContentBindings(this.treeNodePropsContext()), this.collapsibleContext().getRootBindings(), this.collapsibleContext().getContentBindings({ id: this.hostId() }), { class: collapsibleClasses.content }, this.qdsContext().getBranchContentBindings()));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchContentDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: TreeBranchContentDirective, isStandalone: false, selector: "[q-tree-branch-content]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchContentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-tree-branch-content]",
+                    standalone: false,
+                }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeBranchIndentGuideDirective extends CoreTreeBranchIndentGuideDirective {
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getBranchIndentGuideBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchIndentGuideDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: TreeBranchIndentGuideDirective, isStandalone: false, selector: "[q-tree-branch-indent-guide]", usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchIndentGuideDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-tree-branch-indent-guide]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeBranchNodeDirective extends CoreTreeBranchNodeDirective {
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getBranchNodeBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchNodeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: TreeBranchNodeDirective, isStandalone: false, selector: "[q-tree-branch-node]", usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchNodeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-tree-branch-node]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+/**
+ * Structural directive that defines the template used to render leaf nodes in a
+ * tree. Apply this to an `ng-template` to customize how branch nodes (nodes with
+ * children) are displayed. Note that this template will only customize the content
+ * of the node. The parent `<q-tree-nodes>` component renders the branch children
+ * internally.
+ *
+ * @example
+ * ```html
+ * <ng-template q-tree-branch-template let-node>
+ *   <div q-tree-branch-node>
+ *     <span q-tree-node-text>{{ node.item.label }}</span>
+ *   </div>
+ * </ng-template>
+ * ```
+ */
+class TreeBranchTemplateDirective {
+    /**
+     * The root node of the tree. Used for type narrowing of the template guard.
+     * {@link https://angular.dev/guide/directives/structural-directives#type-narrowing-with-template-guards Learn more}
+     */
+    rootNode = input(...(ngDevMode ? [undefined, { debugName: "rootNode" }] : []));
+    template = inject(TemplateRef);
+    static ngTemplateContextGuard(dir, ctx) {
+        return true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: TreeBranchTemplateDirective, isStandalone: false, selector: "ng-template[q-tree-branch-template]", inputs: { rootNode: { classPropertyName: "rootNode", publicName: "rootNode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[q-tree-branch-template]",
+                    standalone: false,
+                }]
+        }], propDecorators: { rootNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "rootNode", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeBranchTriggerDirective extends CoreTreeBranchTriggerDirective {
+    /**
+     * @default ChevronRight
+     */
+    icon = input(ChevronRight, ...(ngDevMode ? [{ debugName: "icon" }] : []));
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getBranchTriggerBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.12", type: TreeBranchTriggerDirective, isStandalone: false, selector: "[q-tree-branch-trigger]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <svg [qIcon]="icon()"></svg>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.IconDirective, selector: "svg[qIcon]", inputs: ["qIcon", "size", "viewBox", "xmlns", "height", "width"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchTriggerDirective, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "[q-tree-branch-trigger]",
+                    standalone: false,
+                    template: `
+    <svg [qIcon]="icon()"></svg>
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeBranchDirective extends CoreTreeBranchDirective {
+    qdsContext = useQdsTreeContext();
+    collapsibleApi = inject(CollapsibleContextService);
+    document = inject(DOCUMENT);
+    injector = inject(Injector);
+    nodeState = useTreeNodeStateContext();
+    renderStrategyProps = useRenderStrategyContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getBranchBindings()));
+    }
+    ngOnInit() {
+        const machine = useMachine(collapsibleMachine, computed(() => ({
+            defaultOpen: false,
+            disabled: this.nodeState().disabled,
+            forceMeasureOnOpen: true,
+            getRootNode: () => this.document,
+            open: this.nodeState().expanded,
+        })), this.injector);
+        this.collapsibleApi.init(computed(() => createCollapsibleApi(machine, normalizeProps)));
+        super.ngOnInit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: TreeBranchDirective, isStandalone: false, selector: "[q-tree-branch]", providers: [provideCollapsibleContext()], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeBranchDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    providers: [provideCollapsibleContext()],
+                    selector: "[q-tree-branch]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeLabelDirective extends CoreTreeLabelDirective {
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getLabelBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: TreeLabelDirective, isStandalone: false, selector: "[q-tree-label]", usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeLabelDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-tree-label]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeLeafNodeDirective extends CoreTreeLeafNodeDirective {
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getLeafNodeBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeLeafNodeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: TreeLeafNodeDirective, isStandalone: false, selector: "[q-tree-leaf-node]", usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeLeafNodeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-tree-leaf-node]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+/**
+ * Structural directive that defines the template used to render leaf nodes in a
+ * tree. Apply this to an `ng-template` to customize how leaf nodes (nodes without
+ * children) are displayed.
+ *
+ * @example
+ * ```html
+ * <ng-template q-tree-leaf-template let-node>
+ *   <div q-tree-leaf-node>
+ *     <span q-tree-node-text>{{ node.item.label }}</span>
+ *   </div>
+ * </ng-template>
+ * ```
+ */
+class TreeLeafTemplateDirective {
+    /**
+     * The root node of the tree. Used for type narrowing of the template guard.
+     * {@link https://angular.dev/guide/directives/structural-directives#type-narrowing-with-template-guards Learn more}
+     */
+    rootNode = input(...(ngDevMode ? [undefined, { debugName: "rootNode" }] : []));
+    template = inject(TemplateRef);
+    static ngTemplateContextGuard(dir, ctx) {
+        return true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeLeafTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: TreeLeafTemplateDirective, isStandalone: false, selector: "ng-template[q-tree-leaf-template]", inputs: { rootNode: { classPropertyName: "rootNode", publicName: "rootNode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeLeafTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[q-tree-leaf-template]",
+                    standalone: false,
+                }]
+        }], propDecorators: { rootNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "rootNode", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeNodeActionDirective extends CoreTreeNodeActionDirective {
+    /**
+     * Lucide icon to display inside the button.
+     */
+    icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
+    /**
+     * The size of the button and its icon.
+     *
+     * @default 'md'
+     */
+    size = input("md", ...(ngDevMode ? [{ debugName: "size" }] : []));
+    inlineIconButtonApi = useInlineIconButtonApi({
+        emphasis: "neutral",
+        size: this.size(),
+        variant: "fixed",
+    });
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => mergeProps(this.inlineIconButtonApi().getRootBindings(), this.qdsContext().getNodeActionBindings())));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeActionDirective, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: TreeNodeActionDirective, isStandalone: false, selector: "[q-tree-node-action]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    @if (icon()) {
+      <svg
+        [q-bind]="inlineIconButtonApi().getIconBindings()"
+        [qIcon]="icon()!"
+      ></svg>
+    }
+    <ng-content />
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.IconDirective, selector: "svg[qIcon]", inputs: ["qIcon", "size", "viewBox", "xmlns", "height", "width"] }, { kind: "directive", type: i2.QBindDirective, selector: "[q-bind]", inputs: ["q-bind", "q-bind-options"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeActionDirective, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "[q-tree-node-action]",
+                    standalone: false,
+                    template: `
+    @if (icon()) {
+      <svg
+        [q-bind]="inlineIconButtonApi().getIconBindings()"
+        [qIcon]="icon()!"
+      ></svg>
+    }
+    <ng-content />
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeNodeCheckboxDirective extends CoreTreeNodeCheckboxDirective {
+    nodeState = useTreeNodeStateContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => createQdsCheckmarkApi({
+            checked: this.nodeState().checked === true,
+            disabled: this.nodeState().disabled,
+            indeterminate: this.nodeState().checked === "indeterminate",
+            size: "md",
+        }, normalizeProps).getRootBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeCheckboxDirective, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: TreeNodeCheckboxDirective, isStandalone: false, selector: "[q-tree-node-checkbox]", usesInheritance: true, ngImport: i0, template: `
+    <ng-content>
+      @if (nodeState().checked) {
+        <q-checkmark-icon
+          size="md"
+          [indeterminate]="nodeState().checked === 'indeterminate'"
+        />
+      }
+    </ng-content>
+  `, isInline: true, dependencies: [{ kind: "component", type: i1$1.CheckmarkIconComponent, selector: "q-checkmark-icon", inputs: ["indeterminate", "size"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeCheckboxDirective, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "[q-tree-node-checkbox]",
+                    standalone: false,
+                    template: `
+    <ng-content>
+      @if (nodeState().checked) {
+        <q-checkmark-icon
+          size="md"
+          [indeterminate]="nodeState().checked === 'indeterminate'"
+        />
+      }
+    </ng-content>
+  `,
+                }]
+        }], ctorParameters: () => [] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeNodeContextDirective extends ApiContextDirective {
+    /**
+     * The root node of the tree. Used for type narrowing of the template guard.
+     * {@link https://angular.dev/guide/directives/structural-directives#type-narrowing-with-template-guards Learn more}
+     */
+    rootNode = input(...(ngDevMode ? [undefined, { debugName: "rootNode" }] : []));
+    constructor() {
+        const contextService = inject(TreeNodeStateContextService);
+        super(contextService, "treeNodeContext");
+    }
+    static ngTemplateContextGuard(dir, ctx) {
+        return true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: TreeNodeContextDirective, isStandalone: false, selector: "[treeNodeContext]", inputs: { rootNode: { classPropertyName: "rootNode", publicName: "rootNode", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeContextDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[treeNodeContext]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [], propDecorators: { rootNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "rootNode", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeNodeIconDirective extends CoreTreeNodeIconDirective {
+    icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getNodeIconBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: TreeNodeIconDirective, isStandalone: false, selector: "[q-tree-node-icon]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    @if (icon()) {
+      <svg [qIcon]="icon()!" />
+    }
+    <ng-content />
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.IconDirective, selector: "svg[qIcon]", inputs: ["qIcon", "size", "viewBox", "xmlns", "height", "width"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeIconDirective, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "[q-tree-node-icon]",
+                    standalone: false,
+                    template: `
+    @if (icon()) {
+      <svg [qIcon]="icon()!" />
+    }
+    <ng-content />
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeNodeIndicatorDirective extends CoreTreeNodeIndicatorDirective {
+    qdsContext = useQdsTreeContext();
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsContext().getNodeIndicatorBindings()));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: TreeNodeIndicatorDirective, isStandalone: false, selector: "[q-tree-node-indicator]", usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeIndicatorDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-tree-node-indicator]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeNodeTextDirective extends CoreTreeNodeTextDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeTextDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.12", type: TreeNodeTextDirective, isStandalone: false, selector: "[q-tree-node-text]", usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeTextDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[q-tree-node-text]",
+                    standalone: false,
+                }]
+        }] });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeNodesComponent {
+    /**
+     * The index path of the tree node
+     */
+    indexPath = input.required(...(ngDevMode ? [{ debugName: "indexPath" }] : []));
+    /**
+     * The tree node
+     *
+     * @inheritDoc
+     */
+    node = input.required(...(ngDevMode ? [{ debugName: "node" }] : []));
+    renderBranch = input(...(ngDevMode ? [undefined, { debugName: "renderBranch" }] : []));
+    renderLeaf = input(...(ngDevMode ? [undefined, { debugName: "renderLeaf" }] : []));
+    treeBranchContentChild = contentChild((TreeBranchTemplateDirective), ...(ngDevMode ? [{ debugName: "treeBranchContentChild" }] : []));
+    treeLeafContentChild = contentChild((TreeLeafTemplateDirective), ...(ngDevMode ? [{ debugName: "treeLeafContentChild" }] : []));
+    branchTemplate = computed(() => {
+        const branchInput = this.renderBranch();
+        const branchTemplate = this.treeBranchContentChild();
+        return branchInput || branchTemplate?.template;
+    }, ...(ngDevMode ? [{ debugName: "branchTemplate" }] : []));
+    leafTemplate = computed(() => {
+        const leafInput = this.renderLeaf();
+        const leafTemplate = this.treeLeafContentChild();
+        return (leafInput || leafTemplate?.template);
+    }, ...(ngDevMode ? [{ debugName: "leafTemplate" }] : []));
+    treeContext = useTreeContext();
+    injector = inject(Injector, { self: true });
+    templateContext = computed(() => ({
+        $implicit: {
+            indexPath: this.indexPath(),
+            node: this.node(),
+        },
+    }), ...(ngDevMode ? [{ debugName: "templateContext" }] : []));
+    childNodes = computed(() => {
+        return this.treeContext().collection.getNodeChildren(this.node());
+    }, ...(ngDevMode ? [{ debugName: "childNodes" }] : []));
+    treeNodePropsContextService = inject(TreeNodePropsContextService, { self: true });
+    treeNodeStateContextService = inject(TreeNodeStateContextService, {
+        self: true,
+    });
+    ngOnInit() {
+        const nodeProps = computed(() => ({
+            indexPath: this.indexPath(),
+            node: this.node(),
+        }), ...(ngDevMode ? [{ debugName: "nodeProps" }] : []));
+        this.treeNodePropsContextService.init(nodeProps);
+        this.treeNodeStateContextService.init(computed(() => this.treeContext().getNodeState(nodeProps())));
+    }
+    getChildIndexPath(index) {
+        return [...this.indexPath(), index];
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: TreeNodesComponent, isStandalone: false, selector: "q-tree-nodes", inputs: { indexPath: { classPropertyName: "indexPath", publicName: "indexPath", isSignal: true, isRequired: true, transformFunction: null }, node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: true, transformFunction: null }, renderBranch: { classPropertyName: "renderBranch", publicName: "renderBranch", isSignal: true, isRequired: false, transformFunction: null }, renderLeaf: { classPropertyName: "renderLeaf", publicName: "renderLeaf", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideTreeNodePropsContext(), provideTreeNodeStateContext()], queries: [{ propertyName: "treeBranchContentChild", first: true, predicate: (TreeBranchTemplateDirective), descendants: true, isSignal: true }, { propertyName: "treeLeafContentChild", first: true, predicate: (TreeLeafTemplateDirective), descendants: true, isSignal: true }], ngImport: i0, template: `
+    @if (childNodes().length) {
+      <div q-tree-branch>
+        <ng-template
+          [ngTemplateOutlet]="branchTemplate()!"
+          [ngTemplateOutletContext]="templateContext()"
+          [ngTemplateOutletInjector]="injector"
+        />
+
+        <div q-tree-branch-content>
+          @for (
+            child of childNodes();
+            let i = $index;
+            track treeContext().collection.getNodeValue(child)
+          ) {
+            <q-tree-nodes
+              [indexPath]="getChildIndexPath(i)"
+              [node]="child"
+              [renderBranch]="branchTemplate()"
+              [renderLeaf]="leafTemplate()"
+            />
+          }
+        </div>
+      </div>
+    } @else {
+      <ng-template
+        [ngTemplateOutlet]="leafTemplate()!"
+        [ngTemplateOutletContext]="templateContext()"
+        [ngTemplateOutletInjector]="injector"
+      />
+    }
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TreeBranchDirective, selector: "[q-tree-branch]" }, { kind: "directive", type: TreeBranchContentDirective, selector: "[q-tree-branch-content]", inputs: ["id"] }, { kind: "component", type: TreeNodesComponent, selector: "q-tree-nodes", inputs: ["indexPath", "node", "renderBranch", "renderLeaf"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesComponent, decorators: [{
+            type: Component,
+            args: [{ providers: [provideTreeNodePropsContext(), provideTreeNodeStateContext()], selector: "q-tree-nodes", standalone: false, template: `
+    @if (childNodes().length) {
+      <div q-tree-branch>
+        <ng-template
+          [ngTemplateOutlet]="branchTemplate()!"
+          [ngTemplateOutletContext]="templateContext()"
+          [ngTemplateOutletInjector]="injector"
+        />
+
+        <div q-tree-branch-content>
+          @for (
+            child of childNodes();
+            let i = $index;
+            track treeContext().collection.getNodeValue(child)
+          ) {
+            <q-tree-nodes
+              [indexPath]="getChildIndexPath(i)"
+              [node]="child"
+              [renderBranch]="branchTemplate()"
+              [renderLeaf]="leafTemplate()"
+            />
+          }
+        </div>
+      </div>
+    } @else {
+      <ng-template
+        [ngTemplateOutlet]="leafTemplate()!"
+        [ngTemplateOutletContext]="templateContext()"
+        [ngTemplateOutletInjector]="injector"
+      />
+    }
+  `, styles: [":host{display:contents}\n"] }]
+        }], propDecorators: { indexPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "indexPath", required: true }] }], node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: true }] }], renderBranch: [{ type: i0.Input, args: [{ isSignal: true, alias: "renderBranch", required: false }] }], renderLeaf: [{ type: i0.Input, args: [{ isSignal: true, alias: "renderLeaf", required: false }] }], treeBranchContentChild: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TreeBranchTemplateDirective), { isSignal: true }] }], treeLeafContentChild: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TreeLeafTemplateDirective), { isSignal: true }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeRootDirective extends CoreTreeRootDirective {
+    /**
+     * The size of the tree and its elements. Governs properties like font size,
+     * item padding, and icon sizes.
+     *
+     * @default 'md'
+     */
+    size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : []));
+    qdsTreeService = inject(QdsTreeContextService);
+    constructor() {
+        super();
+        this.trackBindings.extendWith(computed(() => this.qdsTreeService.context().getRootBindings()));
+    }
+    ngOnInit() {
+        this.qdsTreeService.init(computed(() => createQdsTreeApi({ size: this.size() }, normalizeProps)));
+        super.ngOnInit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeRootDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.12", type: TreeRootDirective, isStandalone: false, selector: "[q-tree-root]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            provideTreeContext(),
+            provideRenderStrategyContext(),
+            provideQdsTreeContext(),
+        ], exportAs: ["treeRoot"], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeRootDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    exportAs: "treeRoot",
+                    providers: [
+                        provideTreeContext(),
+                        provideRenderStrategyContext(),
+                        provideQdsTreeContext(),
+                    ],
+                    selector: "[q-tree-root]",
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+
+// Copyright (c) Qualcomm Technologies, Inc. and/or its subsidiaries.
+// SPDX-License-Identifier: BSD-3-Clause-Clear
+class TreeModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: TreeModule, declarations: [TreeRootDirective,
+            TreeBranchDirective,
+            TreeBranchContentDirective,
+            TreeBranchIndentGuideDirective,
+            TreeBranchNodeDirective,
+            TreeBranchTriggerDirective,
+            TreeLabelDirective,
+            TreeLeafNodeDirective,
+            TreeNodeActionDirective,
+            TreeNodeIconDirective,
+            TreeNodeIndicatorDirective,
+            TreeNodeTextDirective,
+            TreeLeafTemplateDirective,
+            TreeBranchTemplateDirective,
+            TreeNodeContextDirective,
+            TreeNodeCheckboxDirective,
+            TreeNodesComponent], imports: [IconDirective,
+            QBindDirective,
+            NgTemplateOutlet,
+            CheckmarkIconComponent], exports: [TreeRootDirective,
+            TreeBranchDirective,
+            TreeBranchContentDirective,
+            TreeBranchIndentGuideDirective,
+            TreeBranchNodeDirective,
+            TreeBranchTriggerDirective,
+            TreeLabelDirective,
+            TreeLeafNodeDirective,
+            TreeNodeActionDirective,
+            TreeNodeIconDirective,
+            TreeNodeIndicatorDirective,
+            TreeNodeTextDirective,
+            TreeBranchTemplateDirective,
+            TreeLeafTemplateDirective,
+            TreeNodeContextDirective,
+            TreeNodeCheckboxDirective,
+            TreeNodesComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeModule, imports: [CheckmarkIconComponent] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        TreeRootDirective,
+                        TreeBranchDirective,
+                        TreeBranchContentDirective,
+                        TreeBranchIndentGuideDirective,
+                        TreeBranchNodeDirective,
+                        TreeBranchTriggerDirective,
+                        TreeLabelDirective,
+                        TreeLeafNodeDirective,
+                        TreeNodeActionDirective,
+                        TreeNodeIconDirective,
+                        TreeNodeIndicatorDirective,
+                        TreeNodeTextDirective,
+                        TreeLeafTemplateDirective,
+                        TreeBranchTemplateDirective,
+                        TreeNodeContextDirective,
+                        TreeNodeCheckboxDirective,
+                        TreeNodesComponent,
+                    ],
+                    exports: [
+                        TreeRootDirective,
+                        TreeBranchDirective,
+                        TreeBranchContentDirective,
+                        TreeBranchIndentGuideDirective,
+                        TreeBranchNodeDirective,
+                        TreeBranchTriggerDirective,
+                        TreeLabelDirective,
+                        TreeLeafNodeDirective,
+                        TreeNodeActionDirective,
+                        TreeNodeIconDirective,
+                        TreeNodeIndicatorDirective,
+                        TreeNodeTextDirective,
+                        TreeBranchTemplateDirective,
+                        TreeLeafTemplateDirective,
+                        TreeNodeContextDirective,
+                        TreeNodeCheckboxDirective,
+                        TreeNodesComponent,
+                    ],
+                    imports: [
+                        IconDirective,
+                        QBindDirective,
+                        NgTemplateOutlet,
+                        CheckmarkIconComponent,
+                    ],
+                }]
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
+
+export { QDS_TREE_CONTEXT, QdsTreeContextService, TreeBranchContentDirective, TreeBranchDirective, TreeBranchIndentGuideDirective, TreeBranchNodeDirective, TreeBranchTemplateDirective, TreeBranchTriggerDirective, TreeLabelDirective, TreeLeafNodeDirective, TreeLeafTemplateDirective, TreeModule, TreeNodeActionDirective, TreeNodeCheckboxDirective, TreeNodeContextDirective, TreeNodeIconDirective, TreeNodeIndicatorDirective, TreeNodeTextDirective, TreeNodesComponent, TreeRootDirective, provideQdsTreeContext, useQdsTreeContext };
 //# sourceMappingURL=qualcomm-ui-angular-tree.mjs.map