primeng 19.0.6 → 19.0.8

package/fesm2022/primeng-organizationchart.mjs

@@ -1,8 +1,8 @@
-import { trigger, state, style, transition, animate } from '@angular/animations';
+import { trigger, state, transition, style, animate } from '@angular/animations';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Injectable, forwardRef, booleanAttribute, Component, ViewEncapsulation, ChangeDetectionStrategy, Inject, Input, EventEmitter, inject, Output, ContentChildren, ContentChild, NgModule } from '@angular/core';
+import { Injectable, forwardRef, booleanAttribute, Input, Inject, ChangeDetectionStrategy, ViewEncapsulation, Component, EventEmitter, inject, ContentChild, ContentChildren, Output, NgModule } from '@angular/core';
 import { hasClass } from '@primeuix/utils';
 import { SharedModule, PrimeTemplate } from 'primeng/api';
 import { BaseComponent } from 'primeng/basecomponent';
@@ -139,12 +139,12 @@ class OrganizationChartStyle extends BaseStyle {
     name = 'organizationchart';
     theme = theme;
     classes = classes;
-    static ɵfac = /*@__PURE__*/ (() => { let ɵOrganizationChartStyle_BaseFactory; return function OrganizationChartStyle_Factory(__ngFactoryType__) { return (ɵOrganizationChartStyle_BaseFactory || (ɵOrganizationChartStyle_BaseFactory = i0.ɵɵgetInheritedFactory(OrganizationChartStyle)))(__ngFactoryType__ || OrganizationChartStyle); }; })();
-    static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: OrganizationChartStyle, factory: OrganizationChartStyle.ɵfac });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartStyle });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OrganizationChartStyle, [{
-        type: Injectable
-    }], null, null); })();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartStyle, decorators: [{
+            type: Injectable
+        }] });
 /**
  *
  * OrganizationChart visualizes hierarchical organization data.
@@ -198,200 +198,6 @@ var OrganizationChartClasses;
     OrganizationChartClasses["nodeChildren"] = "p-organizationchart-node-children";
 })(OrganizationChartClasses || (OrganizationChartClasses = {}));
 
-const _c0 = ["pOrganizationChartNode", ""];
-const _c1 = (a0, a1) => ({ "p-organizationchart-node": true, "p-organizationchart-node-selectable": a0, "p-organizationchart-node-selected": a1 });
-const _c2 = a0 => ({ $implicit: a0 });
-const _c3 = a0 => ({ "p-organizationchart-connector-top": a0 });
-function OrganizationChartNode_tbody_0_div_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div");
-    i0.ɵɵtext(1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.node.label);
-} }
-function OrganizationChartNode_tbody_0_div_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0);
-} }
-function OrganizationChartNode_tbody_0_div_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div");
-    i0.ɵɵtemplate(1, OrganizationChartNode_tbody_0_div_5_ng_container_1_Template, 1, 0, "ng-container", 6);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.chart.getTemplateForNode(ctx_r1.node))("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, ctx_r1.node));
-} }
-function OrganizationChartNode_tbody_0_ng_container_6_a_1_ng_container_1_ChevronDownIcon_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "ChevronDownIcon", 11);
-} if (rf & 2) {
-    i0.ɵɵproperty("styleClass", "p-organizationchart-node-toggle-button-icon");
-    i0.ɵɵattribute("data-pc-section", "nodeTogglerIcon");
-} }
-function OrganizationChartNode_tbody_0_ng_container_6_a_1_ng_container_1_ChevronUpIcon_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "ChevronUpIcon", 11);
-} if (rf & 2) {
-    i0.ɵɵproperty("styleClass", "p-organizationchart-node-toggle-button-icon");
-    i0.ɵɵattribute("data-pc-section", "nodeTogglerIcon");
-} }
-function OrganizationChartNode_tbody_0_ng_container_6_a_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, OrganizationChartNode_tbody_0_ng_container_6_a_1_ng_container_1_ChevronDownIcon_1_Template, 1, 2, "ChevronDownIcon", 10)(2, OrganizationChartNode_tbody_0_ng_container_6_a_1_ng_container_1_ChevronUpIcon_2_Template, 1, 2, "ChevronUpIcon", 10);
-    i0.ɵɵelementContainerEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.node.expanded);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.node.expanded);
-} }
-function OrganizationChartNode_tbody_0_ng_container_6_a_1_span_2_1_ng_template_0_Template(rf, ctx) { }
-function OrganizationChartNode_tbody_0_ng_container_6_a_1_span_2_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, OrganizationChartNode_tbody_0_ng_container_6_a_1_span_2_1_ng_template_0_Template, 0, 0, "ng-template");
-} }
-function OrganizationChartNode_tbody_0_ng_container_6_a_1_span_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 12);
-    i0.ɵɵtemplate(1, OrganizationChartNode_tbody_0_ng_container_6_a_1_span_2_1_Template, 1, 0, null, 6);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵattribute("data-pc-section", "nodeTogglerIcon");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.chart.togglerIconTemplate || ctx_r1.chart._togglerIconTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(3, _c2, ctx_r1.node.expanded));
-} }
-function OrganizationChartNode_tbody_0_ng_container_6_a_1_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "a", 8);
-    i0.ɵɵlistener("click", function OrganizationChartNode_tbody_0_ng_container_6_a_1_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleNode($event, ctx_r1.node)); })("keydown.enter", function OrganizationChartNode_tbody_0_ng_container_6_a_1_Template_a_keydown_enter_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleNode($event, ctx_r1.node)); })("keydown.space", function OrganizationChartNode_tbody_0_ng_container_6_a_1_Template_a_keydown_space_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleNode($event, ctx_r1.node)); });
-    i0.ɵɵtemplate(1, OrganizationChartNode_tbody_0_ng_container_6_a_1_ng_container_1_Template, 3, 2, "ng-container", 0)(2, OrganizationChartNode_tbody_0_ng_container_6_a_1_span_2_Template, 2, 5, "span", 9);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵattribute("data-pc-section", "nodeToggler");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.chart.togglerIconTemplate && !ctx_r1.chart._togglerIconTemplate);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.chart.togglerIconTemplate || ctx_r1.chart._togglerIconTemplate);
-} }
-function OrganizationChartNode_tbody_0_ng_container_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, OrganizationChartNode_tbody_0_ng_container_6_a_1_Template, 3, 3, "a", 7);
-    i0.ɵɵelementContainerEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.leaf);
-} }
-function OrganizationChartNode_tbody_0_ng_container_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "td");
-    i0.ɵɵelement(2, "div", 3);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementContainerEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance();
-    i0.ɵɵattribute("data-pc-section", "lineCell")("colspan", ctx_r1.colspan);
-    i0.ɵɵadvance();
-    i0.ɵɵattribute("data-pc-section", "lineDown");
-} }
-function OrganizationChartNode_tbody_0_ng_container_12_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "td", 14);
-    i0.ɵɵtext(1, "\u00A0");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "td", 15);
-    i0.ɵɵtext(3, "\u00A0");
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const first_r4 = ctx.first;
-    const last_r5 = ctx.last;
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(4, _c3, !first_r4));
-    i0.ɵɵattribute("data-pc-section", "lineLeft");
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(6, _c3, !last_r5));
-    i0.ɵɵattribute("data-pc-section", "lineRight");
-} }
-function OrganizationChartNode_tbody_0_ng_container_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, OrganizationChartNode_tbody_0_ng_container_12_ng_template_1_Template, 4, 8, "ng-template", 13);
-    i0.ɵɵelementContainerEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.node.children);
-} }
-function OrganizationChartNode_tbody_0_td_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "td", 16);
-    i0.ɵɵelement(1, "table", 17);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const child_r6 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵattribute("data-pc-section", "nodeCell");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("node", child_r6)("collapsible", ctx_r1.node.children && ctx_r1.node.children.length > 0 && ctx_r1.collapsible);
-} }
-function OrganizationChartNode_tbody_0_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "tbody")(1, "tr")(2, "td")(3, "div", 1);
-    i0.ɵɵlistener("click", function OrganizationChartNode_tbody_0_Template_div_click_3_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onNodeClick($event, ctx_r1.node)); });
-    i0.ɵɵtemplate(4, OrganizationChartNode_tbody_0_div_4_Template, 2, 1, "div", 0)(5, OrganizationChartNode_tbody_0_div_5_Template, 2, 4, "div", 0)(6, OrganizationChartNode_tbody_0_ng_container_6_Template, 2, 1, "ng-container", 0);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(7, "tr", 2)(8, "td");
-    i0.ɵɵelement(9, "div", 3);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(10, "tr", 2);
-    i0.ɵɵtemplate(11, OrganizationChartNode_tbody_0_ng_container_11_Template, 3, 3, "ng-container", 0)(12, OrganizationChartNode_tbody_0_ng_container_12_Template, 2, 1, "ng-container", 0);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(13, "tr", 4);
-    i0.ɵɵtemplate(14, OrganizationChartNode_tbody_0_td_14_Template, 2, 3, "td", 5);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵattribute("data-pc-section", "body");
-    i0.ɵɵadvance();
-    i0.ɵɵattribute("data-pc-section", "row");
-    i0.ɵɵadvance();
-    i0.ɵɵattribute("colspan", ctx_r1.colspan)("data-pc-section", "cell");
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(ctx_r1.node.styleClass);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(26, _c1, ctx_r1.chart.selectionMode && ctx_r1.node.selectable !== false, ctx_r1.isSelected()));
-    i0.ɵɵattribute("data-pc-section", "node");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.chart.getTemplateForNode(ctx_r1.node));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.chart.getTemplateForNode(ctx_r1.node));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.collapsible);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", ctx_r1.getChildStyle(ctx_r1.node))("@childState", "in");
-    i0.ɵɵattribute("data-pc-section", "lines");
-    i0.ɵɵadvance();
-    i0.ɵɵattribute("data-pc-section", "lineCell")("colspan", ctx_r1.colspan);
-    i0.ɵɵadvance();
-    i0.ɵɵattribute("data-pc-section", "lineDown");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", ctx_r1.getChildStyle(ctx_r1.node))("@childState", "in");
-    i0.ɵɵattribute("data-pc-section", "lines");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.node.children && ctx_r1.node.children.length === 1);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.node.children && ctx_r1.node.children.length > 1);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", ctx_r1.getChildStyle(ctx_r1.node))("@childState", "in");
-    i0.ɵɵattribute("data-pc-section", "nodes");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.node.children);
-} }
-const _c4 = ["togglericon"];
-const _c5 = a0 => ({ "p-organizationchart p-component": true, "p-organizationchart-preservespace": a0 });
-function OrganizationChart_table_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "table", 2);
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("collapsible", ctx_r0.collapsible)("node", ctx_r0.root);
-} }
 class OrganizationChartNode {
     cd;
     node;
@@ -440,20 +246,80 @@ class OrganizationChartNode {
     ngOnDestroy() {
         this.subscription.unsubscribe();
     }
-    static ɵfac = function OrganizationChartNode_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || OrganizationChartNode)(i0.ɵɵdirectiveInject(forwardRef(() => OrganizationChart)), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OrganizationChartNode, selectors: [["", "pOrganizationChartNode", ""]], inputs: { node: "node", root: [2, "root", "root", booleanAttribute], first: [2, "first", "first", booleanAttribute], last: [2, "last", "last", booleanAttribute], collapsible: [2, "collapsible", "collapsible", booleanAttribute] }, features: [i0.ɵɵInputTransformsFeature], attrs: _c0, decls: 1, vars: 1, consts: [[4, "ngIf"], [3, "click", "ngClass"], [1, "p-organizationchart-connectors", 3, "ngStyle"], [1, "p-organizationchart-connector-down"], [1, "p-organizationchart-node-children", 3, "ngStyle"], ["colspan", "2", 4, "ngFor", "ngForOf"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], ["tabindex", "0", "class", "p-organizationchart-node-toggle-button", 3, "click", "keydown.enter", "keydown.space", 4, "ngIf"], ["tabindex", "0", 1, "p-organizationchart-node-toggle-button", 3, "click", "keydown.enter", "keydown.space"], ["class", "p-organizationchart-node-toggle-button-icon", 4, "ngIf"], [3, "styleClass", 4, "ngIf"], [3, "styleClass"], [1, "p-organizationchart-node-toggle-button-icon"], ["ngFor", "", 3, "ngForOf"], [1, "p-organizationchart-connector-left", 3, "ngClass"], [1, "p-organizationchart-connector-right", 3, "ngClass"], ["colspan", "2"], ["pOrganizationChartNode", "", 1, "p-organizationchart-table", 3, "node", "collapsible"]], template: function OrganizationChartNode_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, OrganizationChartNode_tbody_0_Template, 15, 29, "tbody", 0);
-        } if (rf & 2) {
-            i0.ɵɵproperty("ngIf", ctx.node);
-        } }, dependencies: [OrganizationChartNode, CommonModule, i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, ChevronDownIcon, ChevronUpIcon, SharedModule], encapsulation: 2, data: { animation: [trigger('childState', [state('in', style({ opacity: 1 })), transition('void => *', [style({ opacity: 0 }), animate(150)]), transition('* => void', [animate(150, style({ opacity: 0 }))])])] } });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartNode, deps: [{ token: forwardRef(() => OrganizationChart) }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.1.7", type: OrganizationChartNode, isStandalone: true, selector: "[pOrganizationChartNode]", inputs: { node: "node", root: ["root", "root", booleanAttribute], first: ["first", "first", booleanAttribute], last: ["last", "last", booleanAttribute], collapsible: ["collapsible", "collapsible", booleanAttribute] }, ngImport: i0, template: `
+        <tbody *ngIf="node" [attr.data-pc-section]="'body'">
+            <tr [attr.data-pc-section]="'row'">
+                <td [attr.colspan]="colspan" [attr.data-pc-section]="'cell'">
+                    <div
+                        [class]="node.styleClass"
+                        [ngClass]="{
+                            'p-organizationchart-node': true,
+                            'p-organizationchart-node-selectable': chart.selectionMode && node.selectable !== false,
+                            'p-organizationchart-node-selected': isSelected()
+                        }"
+                        (click)="onNodeClick($event, node)"
+                        [attr.data-pc-section]="'node'"
+                    >
+                        <div *ngIf="!chart.getTemplateForNode(node)">{{ node.label }}</div>
+                        <div *ngIf="chart.getTemplateForNode(node)">
+                            <ng-container *ngTemplateOutlet="chart.getTemplateForNode(node); context: { $implicit: node }"></ng-container>
+                        </div>
+                        <ng-container *ngIf="collapsible">
+                            <a
+                                *ngIf="!leaf"
+                                tabindex="0"
+                                class="p-organizationchart-node-toggle-button"
+                                (click)="toggleNode($event, node)"
+                                (keydown.enter)="toggleNode($event, node)"
+                                (keydown.space)="toggleNode($event, node)"
+                                [attr.data-pc-section]="'nodeToggler'"
+                            >
+                                <ng-container *ngIf="!chart.togglerIconTemplate && !chart._togglerIconTemplate">
+                                    <ChevronDownIcon *ngIf="node.expanded" [styleClass]="'p-organizationchart-node-toggle-button-icon'" [attr.data-pc-section]="'nodeTogglerIcon'" />
+                                    <ChevronUpIcon *ngIf="!node.expanded" [styleClass]="'p-organizationchart-node-toggle-button-icon'" [attr.data-pc-section]="'nodeTogglerIcon'" />
+                                </ng-container>
+                                <span class="p-organizationchart-node-toggle-button-icon" *ngIf="chart.togglerIconTemplate || chart._togglerIconTemplate" [attr.data-pc-section]="'nodeTogglerIcon'">
+                                    <ng-template *ngTemplateOutlet="chart.togglerIconTemplate || chart._togglerIconTemplate; context: { $implicit: node.expanded }"></ng-template>
+                                </span>
+                            </a>
+                        </ng-container>
+                    </div>
+                </td>
+            </tr>
+            <tr [ngStyle]="getChildStyle(node)" class="p-organizationchart-connectors" [@childState]="'in'" [attr.data-pc-section]="'lines'">
+                <td [attr.data-pc-section]="'lineCell'" [attr.colspan]="colspan">
+                    <div [attr.data-pc-section]="'lineDown'" class="p-organizationchart-connector-down"></div>
+                </td>
+            </tr>
+            <tr [ngStyle]="getChildStyle(node)" class="p-organizationchart-connectors" [@childState]="'in'" [attr.data-pc-section]="'lines'">
+                <ng-container *ngIf="node.children && node.children.length === 1">
+                    <td [attr.data-pc-section]="'lineCell'" [attr.colspan]="colspan">
+                        <div [attr.data-pc-section]="'lineDown'" class="p-organizationchart-connector-down"></div>
+                    </td>
+                </ng-container>
+                <ng-container *ngIf="node.children && node.children.length > 1">
+                    <ng-template ngFor let-child [ngForOf]="node.children" let-first="first" let-last="last">
+                        <td [attr.data-pc-section]="'lineLeft'" class="p-organizationchart-connector-left" [ngClass]="{ 'p-organizationchart-connector-top': !first }">&nbsp;</td>
+                        <td [attr.data-pc-section]="'lineRight'" class="p-organizationchart-connector-right" [ngClass]="{ 'p-organizationchart-connector-top': !last }">&nbsp;</td>
+                    </ng-template>
+                </ng-container>
+            </tr>
+            <tr [ngStyle]="getChildStyle(node)" class="p-organizationchart-node-children" [@childState]="'in'" [attr.data-pc-section]="'nodes'">
+                <td *ngFor="let child of node.children" colspan="2" [attr.data-pc-section]="'nodeCell'">
+                    <table class="p-organizationchart-table" pOrganizationChartNode [node]="child" [collapsible]="node.children && node.children.length > 0 && collapsible"></table>
+                </td>
+            </tr>
+        </tbody>
+    `, isInline: true, dependencies: [{ kind: "component", type: OrganizationChartNode, selector: "[pOrganizationChartNode]", inputs: ["node", "root", "first", "last", "collapsible"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ChevronDownIcon, selector: "ChevronDownIcon" }, { kind: "component", type: ChevronUpIcon, selector: "ChevronUpIcon" }, { kind: "ngmodule", type: SharedModule }], animations: [trigger('childState', [state('in', style({ opacity: 1 })), transition('void => *', [style({ opacity: 0 }), animate(150)]), transition('* => void', [animate(150, style({ opacity: 0 }))])])], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OrganizationChartNode, [{
-        type: Component,
-        args: [{
-                selector: '[pOrganizationChartNode]',
-                standalone: true,
-                imports: [CommonModule, ChevronDownIcon, ChevronUpIcon, SharedModule],
-                template: `
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartNode, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[pOrganizationChartNode]',
+                    standalone: true,
+                    imports: [CommonModule, ChevronDownIcon, ChevronUpIcon, SharedModule],
+                    template: `
         <tbody *ngIf="node" [attr.data-pc-section]="'body'">
             <tr [attr.data-pc-section]="'row'">
                 <td [attr.colspan]="colspan" [attr.data-pc-section]="'cell'">
@@ -518,29 +384,28 @@ class OrganizationChartNode {
             </tr>
         </tbody>
     `,
-                animations: [trigger('childState', [state('in', style({ opacity: 1 })), transition('void => *', [style({ opacity: 0 }), animate(150)]), transition('* => void', [animate(150, style({ opacity: 0 }))])])],
-                encapsulation: ViewEncapsulation.None,
-                changeDetection: ChangeDetectionStrategy.Default
-            }]
-    }], () => [{ type: OrganizationChart, decorators: [{
-                type: Inject,
-                args: [forwardRef(() => OrganizationChart)]
-            }] }, { type: i0.ChangeDetectorRef }], { node: [{
-            type: Input
-        }], root: [{
-            type: Input,
-            args: [{ transform: booleanAttribute }]
-        }], first: [{
-            type: Input,
-            args: [{ transform: booleanAttribute }]
-        }], last: [{
-            type: Input,
-            args: [{ transform: booleanAttribute }]
-        }], collapsible: [{
-            type: Input,
-            args: [{ transform: booleanAttribute }]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OrganizationChartNode, { className: "OrganizationChartNode", filePath: "organizationchart.ts", lineNumber: 106 }); })();
+                    animations: [trigger('childState', [state('in', style({ opacity: 1 })), transition('void => *', [style({ opacity: 0 }), animate(150)]), transition('* => void', [animate(150, style({ opacity: 0 }))])])],
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.Default
+                }]
+        }], ctorParameters: () => [{ type: OrganizationChart, decorators: [{
+                    type: Inject,
+                    args: [forwardRef(() => OrganizationChart)]
+                }] }, { type: i0.ChangeDetectorRef }], propDecorators: { node: [{
+                type: Input
+            }], root: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], first: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], last: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], collapsible: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }] } });
 /**
  * OrganizationChart visualizes hierarchical organization data.
  * @group Components
@@ -712,87 +577,72 @@ class OrganizationChart extends BaseComponent {
     isSelected(node) {
         return this.findIndexInSelection(node) != -1;
     }
-    static ɵfac = function OrganizationChart_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || OrganizationChart)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OrganizationChart, selectors: [["p-organizationChart"], ["p-organization-chart"], ["p-organizationchart"]], contentQueries: function OrganizationChart_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, _c4, 4);
-            i0.ɵɵcontentQuery(dirIndex, PrimeTemplate, 4);
-        } if (rf & 2) {
-            let _t;
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.togglerIconTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.templates = _t);
-        } }, inputs: { value: "value", style: "style", styleClass: "styleClass", selectionMode: "selectionMode", collapsible: [2, "collapsible", "collapsible", booleanAttribute], preserveSpace: [2, "preserveSpace", "preserveSpace", booleanAttribute], selection: "selection" }, outputs: { selectionChange: "selectionChange", onNodeSelect: "onNodeSelect", onNodeUnselect: "onNodeUnselect", onNodeExpand: "onNodeExpand", onNodeCollapse: "onNodeCollapse" }, features: [i0.ɵɵProvidersFeature([OrganizationChartStyle]), i0.ɵɵInputTransformsFeature, i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 8, consts: [[3, "ngStyle", "ngClass"], ["class", "p-organizationchart-table", "pOrganizationChartNode", "", 3, "collapsible", "node", 4, "ngIf"], ["pOrganizationChartNode", "", 1, "p-organizationchart-table", 3, "collapsible", "node"]], template: function OrganizationChart_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵtemplate(1, OrganizationChart_table_1_Template, 1, 2, "table", 1);
-            i0.ɵɵelementEnd();
-        } if (rf & 2) {
-            i0.ɵɵclassMap(ctx.styleClass);
-            i0.ɵɵproperty("ngStyle", ctx.style)("ngClass", i0.ɵɵpureFunction1(6, _c5, ctx.preserveSpace));
-            i0.ɵɵattribute("data-pc-section", "root");
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.root);
-        } }, dependencies: [CommonModule, i1.NgClass, i1.NgIf, i1.NgStyle, OrganizationChartNode, SharedModule], encapsulation: 2 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChart, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.1.7", type: OrganizationChart, isStandalone: true, selector: "p-organizationChart, p-organization-chart, p-organizationchart", inputs: { value: "value", style: "style", styleClass: "styleClass", selectionMode: "selectionMode", collapsible: ["collapsible", "collapsible", booleanAttribute], preserveSpace: ["preserveSpace", "preserveSpace", booleanAttribute], selection: "selection" }, outputs: { selectionChange: "selectionChange", onNodeSelect: "onNodeSelect", onNodeUnselect: "onNodeUnselect", onNodeExpand: "onNodeExpand", onNodeCollapse: "onNodeCollapse" }, providers: [OrganizationChartStyle], queries: [{ propertyName: "togglerIconTemplate", first: true, predicate: ["togglericon"] }, { propertyName: "templates", predicate: PrimeTemplate }], usesInheritance: true, ngImport: i0, template: `
+        <div [ngStyle]="style" [class]="styleClass" [ngClass]="{ 'p-organizationchart p-component': true, 'p-organizationchart-preservespace': preserveSpace }" [attr.data-pc-section]="'root'">
+            <table class="p-organizationchart-table" [collapsible]="collapsible" pOrganizationChartNode [node]="root" *ngIf="root"></table>
+        </div>
+    `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: OrganizationChartNode, selector: "[pOrganizationChartNode]", inputs: ["node", "root", "first", "last", "collapsible"] }, { kind: "ngmodule", type: SharedModule }], changeDetection: i0.ChangeDetectionStrategy.Default });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OrganizationChart, [{
-        type: Component,
-        args: [{
-                selector: 'p-organizationChart, p-organization-chart, p-organizationchart',
-                standalone: true,
-                imports: [CommonModule, OrganizationChartNode, SharedModule],
-                template: `
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChart, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-organizationChart, p-organization-chart, p-organizationchart',
+                    standalone: true,
+                    imports: [CommonModule, OrganizationChartNode, SharedModule],
+                    template: `
         <div [ngStyle]="style" [class]="styleClass" [ngClass]="{ 'p-organizationchart p-component': true, 'p-organizationchart-preservespace': preserveSpace }" [attr.data-pc-section]="'root'">
             <table class="p-organizationchart-table" [collapsible]="collapsible" pOrganizationChartNode [node]="root" *ngIf="root"></table>
         </div>
     `,
-                changeDetection: ChangeDetectionStrategy.Default,
-                providers: [OrganizationChartStyle]
-            }]
-    }], () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], { value: [{
-            type: Input
-        }], style: [{
-            type: Input
-        }], styleClass: [{
-            type: Input
-        }], selectionMode: [{
-            type: Input
-        }], collapsible: [{
-            type: Input,
-            args: [{ transform: booleanAttribute }]
-        }], preserveSpace: [{
-            type: Input,
-            args: [{ transform: booleanAttribute }]
-        }], selection: [{
-            type: Input
-        }], selectionChange: [{
-            type: Output
-        }], onNodeSelect: [{
-            type: Output
-        }], onNodeUnselect: [{
-            type: Output
-        }], onNodeExpand: [{
-            type: Output
-        }], onNodeCollapse: [{
-            type: Output
-        }], templates: [{
-            type: ContentChildren,
-            args: [PrimeTemplate]
-        }], togglerIconTemplate: [{
-            type: ContentChild,
-            args: ['togglericon', { descendants: false }]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OrganizationChart, { className: "OrganizationChart", filePath: "organizationchart.ts", lineNumber: 185 }); })();
+                    changeDetection: ChangeDetectionStrategy.Default,
+                    providers: [OrganizationChartStyle]
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { value: [{
+                type: Input
+            }], style: [{
+                type: Input
+            }], styleClass: [{
+                type: Input
+            }], selectionMode: [{
+                type: Input
+            }], collapsible: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], preserveSpace: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], selection: [{
+                type: Input
+            }], selectionChange: [{
+                type: Output
+            }], onNodeSelect: [{
+                type: Output
+            }], onNodeUnselect: [{
+                type: Output
+            }], onNodeExpand: [{
+                type: Output
+            }], onNodeCollapse: [{
+                type: Output
+            }], templates: [{
+                type: ContentChildren,
+                args: [PrimeTemplate]
+            }], togglerIconTemplate: [{
+                type: ContentChild,
+                args: ['togglericon', { descendants: false }]
+            }] } });
 class OrganizationChartModule {
-    static ɵfac = function OrganizationChartModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || OrganizationChartModule)(); };
-    static ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: OrganizationChartModule });
-    static ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [OrganizationChart, OrganizationChartNode, SharedModule, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartModule, imports: [OrganizationChart, OrganizationChartNode, SharedModule], exports: [OrganizationChart, OrganizationChartNode, SharedModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartModule, imports: [OrganizationChart, OrganizationChartNode, SharedModule, SharedModule] });
 }
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OrganizationChartModule, [{
-        type: NgModule,
-        args: [{
-                imports: [OrganizationChart, OrganizationChartNode, SharedModule],
-                exports: [OrganizationChart, OrganizationChartNode, SharedModule]
-            }]
-    }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(OrganizationChartModule, { imports: [OrganizationChart, OrganizationChartNode, SharedModule], exports: [OrganizationChart, OrganizationChartNode, SharedModule] }); })();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: OrganizationChartModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [OrganizationChart, OrganizationChartNode, SharedModule],
+                    exports: [OrganizationChart, OrganizationChartNode, SharedModule]
+                }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.