@c10t/nice-component-library 0.0.11 → 0.0.12

package/components/tree/cva-flat-tree.component.d.ts

@@ -52,12 +52,13 @@ export declare class CvaFlatTreeComponent implements ControlValueAccessor, OnIni
     formControl: AbstractControl | undefined;
     chooseVirtualScroll?: CdkVirtualScrollViewport;
     selectedVirtualScroll?: CdkVirtualScrollViewport;
-    get NsValiator(): typeof ValidatorService;
     constructor(translateService: TranslateService, injector: Injector, cdr: ChangeDetectorRef, ngControl: NgControl);
+    get NsValiator(): typeof ValidatorService;
     setSelectedNode(): void;
     setDataSourceOrigin(): void;
     ngOnInit(): void;
     ngAfterViewInit(): void;
+    trackByValue(index: number, node: FlatTreeNodeModel): any;
     getDisplayInputFunc(node: FlatTreeNodeModel): boolean;
     getDisabledInputFunc(node: FlatTreeNodeModel): boolean;
     checkDisabledNode(node: FlatTreeNodeModel): boolean;
@@ -66,15 +67,13 @@ export declare class CvaFlatTreeComponent implements ControlValueAccessor, OnIni
     checkIsView(isView: boolean | (() => boolean)): boolean;
     ngOnChanges(simpleChanges: SimpleChanges): void;
     transformer: (node: FlatTreeNodeModel, level: number) => FlatTreeNodeModel;
-    private _getLevel;
-    private _isExpandable;
-    private _getChildren;
     propagateChange: (_: any) => void;
     registerOnChange(fn: any): void;
     registerOnTouched(fn: any): void;
     writeValue(obj: any): void;
     updateSelectedTree(): void;
     checkedDefaultValue(): void;
+    bulkSelectedTreeChange(nodes: FlatTreeNodeModel[]): void;
     getAllChildNode(treeControl: FlatTreeControl<FlatTreeNodeModel>, node: FlatTreeNodeModel): FlatTreeNodeModel[];
     updateSelectAll(childrenNode?: FlatTreeNodeModel[]): void;
     checkParentNode(checked: boolean, node: FlatTreeNodeModel, isSelectedChange?: boolean): void;
@@ -91,6 +90,9 @@ export declare class CvaFlatTreeComponent implements ControlValueAccessor, OnIni
     expandTreeDataSource(treeControl: FlatTreeControl<FlatTreeNodeModel>, expandProperty: 'isExpanded' | 'isFilterExpanded'): void;
     onLeafNodeClick(node: FlatTreeNodeModel): void;
     onParentNodeClick(node: FlatTreeNodeModel): void;
+    private _getLevel;
+    private _isExpandable;
+    private _getChildren;
     static ɵfac: i0.ɵɵFactoryDeclaration<CvaFlatTreeComponent, [null, null, null, { optional: true; self: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<CvaFlatTreeComponent, "cva-flat-tree", never, { "label": { "alias": "label"; "required": false; }; "required": { "alias": "required"; "required": false; }; "value": { "alias": "value"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "isView": { "alias": "isView"; "required": false; }; "isDisplayChooseTreeOnly": { "alias": "isDisplayChooseTreeOnly"; "required": false; }; "isHideCheckbox": { "alias": "isHideCheckbox"; "required": false; }; "isCollapseSelected": { "alias": "isCollapseSelected"; "required": false; }; "selectedLabelTitle": { "alias": "selectedLabelTitle"; "required": false; }; "viewHeight": { "alias": "viewHeight"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "percentOfLabelOutside": { "alias": "percentOfLabelOutside"; "required": false; }; "treeConfig": { "alias": "treeConfig"; "required": false; }; "isSearchOutSide": { "alias": "isSearchOutSide"; "required": false; }; "searchTextOutSide": { "alias": "searchTextOutSide"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "fullDatasource": { "alias": "fullDatasource"; "required": false; }; "isFormControl": { "alias": "isFormControl"; "required": false; }; }, { "selectionChange": "selectionChange"; }, never, never, false, never>;
 }

package/fesm2022/c10t-nice-component-library.mjs

@@ -7383,9 +7383,6 @@ class CvaFlatTreeComponent {
     formControl;
     chooseVirtualScroll;
     selectedVirtualScroll;
-    get NsValiator() {
-        return ValidatorService;
-    }
     constructor(translateService, injector, cdr, ngControl) {
         this.translateService = translateService;
         this.injector = injector;
@@ -7406,6 +7403,9 @@ class CvaFlatTreeComponent {
         this.selectedDataSource = new MatTreeFlatDataSource(this.selectedTreeControl, this.selectedTreeFlattener);
         this.setSelectedNode();
     }
+    get NsValiator() {
+        return ValidatorService;
+    }
     setSelectedNode() {
         this.selectedDataSource.data = this.selectedFullDataSource;
         if (this.selectedVirtualScroll) {
@@ -7425,6 +7425,9 @@ class CvaFlatTreeComponent {
     ngAfterViewInit() {
         // this.onChangeSearchText();
     }
+    trackByValue(index, node) {
+        return node.value;
+    }
     getDisplayInputFunc(node) {
         return typeof (node._displayFuncInput) === 'function' ? node._displayFuncInput(node) : !!node._displayFuncInput;
     }
@@ -7537,9 +7540,6 @@ class CvaFlatTreeComponent {
         node.checked = !!node.checked;
         return node;
     };
-    _getLevel = (node) => node.level;
-    _isExpandable = (node) => FlatTreeService.hasChild(node);
-    _getChildren = (node) => of(node.children ? node.children : []);
     propagateChange = (_) => {
         /*NON-EMPTY FOR COMPILE*/
     };
@@ -7550,21 +7550,17 @@ class CvaFlatTreeComponent {
         this.propagateChange(fn);
     }
     writeValue(obj) {
-        // if (this.multiple && !obj) {
-        //   obj = [];
-        // }
         if (obj) {
-            // if (this.multiple) {
             this.value = obj;
-            // }
             this.checkedDefaultValue();
             this.updateSelectAll();
             this.updateSelectedTree();
             this.propagateChange(this.value);
             this.callValidator();
             if (this.isView) {
-                this.selectedTreeControl.expandAll();
+                requestAnimationFrame(() => this.selectedTreeControl.expandAll());
             }
+            this.cdr.detectChanges();
             this.selectionChange.emit(Array.from(this.valueObjRef.values()));
         }
     }
@@ -7575,38 +7571,38 @@ class CvaFlatTreeComponent {
         this.expandTreeDataSource(this.selectedTreeControl, 'isExpanded');
     }
     checkedDefaultValue() {
-        let allChildNode;
-        for (const rootNode of this.fullDataDataSource.data) {
-            if (!FlatTreeService.hasChild(rootNode)) {
-                if (this.value.includes(rootNode.value)) {
-                    rootNode.checked = true;
-                    if (!this.valueObjRef.has(rootNode.value)) {
-                        this.valueObjRef.set(rootNode.value, rootNode);
-                    }
-                    this.selectedTreeChange(rootNode);
-                }
-                else {
-                    rootNode.checked = false;
-                    if (this.valueObjRef.has(rootNode.value)) {
-                        this.valueObjRef.delete(rootNode.value);
-                    }
-                    this.selectedTreeChange(rootNode);
-                }
-                continue;
-            }
-            allChildNode = this.getAllChildNode(this.fullDataTreeControl, rootNode);
-            allChildNode.forEach(childNode => {
-                if (!FlatTreeService.hasChild(childNode)) {
-                    childNode.checked = this.value.includes(childNode.value);
-                    if (!this.valueObjRef.has(childNode.value) && childNode.checked) {
-                        this.valueObjRef.set(childNode.value, childNode);
-                    }
-                    else if (this.valueObjRef.has(childNode.value) && !childNode.checked) {
-                        this.valueObjRef.delete(childNode.value);
+        const selectedSet = new Set(this.value);
+        const selectedNodes = [];
+        for (const node of this.fullDataTreeControl.dataNodes) {
+            const isLeaf = !FlatTreeService.hasChild(node);
+            node.checked = selectedSet.has(node.value);
+            if (isLeaf && node.checked) {
+                this.valueObjRef.set(node.value, node);
+                selectedNodes.push(node);
+            }
+            else if (isLeaf && !node.checked && this.valueObjRef.has(node.value)) {
+                this.valueObjRef.delete(node.value);
+            }
+        }
+        this.bulkSelectedTreeChange(selectedNodes);
+    }
+    bulkSelectedTreeChange(nodes) {
+        const selectedRoot = new Set();
+        for (const node of nodes) {
+            if (node.level < 1) {
+                this.selectedFullValues.set(node.value, node.value);
+                this.selectedTreeControl.expandDescendants(node);
+            }
+            else {
+                const rootNode = this.getRootNode(node);
+                if (rootNode && !selectedRoot.has(rootNode.value)) {
+                    this.selectedFullValues.set(rootNode.value, rootNode.value);
+                    if (rootNode.checked) {
+                        this.selectedTreeControl.expandDescendants(rootNode);
                     }
-                    this.selectedTreeChange(childNode);
+                    selectedRoot.add(rootNode.value);
                 }
-            });
+            }
         }
     }
     getAllChildNode(treeControl, node) {
@@ -7887,6 +7883,9 @@ class CvaFlatTreeComponent {
             this.checkParentNode(true, node);
         }
     }
+    _getLevel = (node) => node.level;
+    _isExpandable = (node) => FlatTreeService.hasChild(node);
+    _getChildren = (node) => of(node.children ? node.children : []);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaFlatTreeComponent, deps: [{ token: i1.TranslateService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaFlatTreeComponent, isStandalone: false, selector: "cva-flat-tree", inputs: { label: "label", required: "required", value: "value", multiple: "multiple", disabled: "disabled", isView: "isView", isDisplayChooseTreeOnly: "isDisplayChooseTreeOnly", isHideCheckbox: "isHideCheckbox", isCollapseSelected: "isCollapseSelected", selectedLabelTitle: "selectedLabelTitle", viewHeight: "viewHeight", itemSize: "itemSize", percentOfLabelOutside: "percentOfLabelOutside", treeConfig: "treeConfig", isSearchOutSide: "isSearchOutSide", searchTextOutSide: "searchTextOutSide", errorMessages: "errorMessages", fullDatasource: "fullDatasource", isFormControl: "isFormControl" }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "chooseVirtualScroll", first: true, predicate: ["chooseAreaScrollViewport"], descendants: true }, { propertyName: "selectedVirtualScroll", first: true, predicate: ["selectedScrollViewport"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
     <div class="cva-flat-tree labelOutside"
@@ -7926,7 +7925,7 @@ class CvaFlatTreeComponent {
             </div>
             <cdk-virtual-scroll-viewport #chooseAreaScrollViewport itemSize="{{itemSize}}"
                                          [ngStyle]="{height: viewHeight + 'px'}">
-              <ng-container *cdkVirtualFor="let node of dataSource">
+              <ng-container *cdkVirtualFor="let node of dataSource; trackBy: trackByValue">
                 <cva-flat-tree-node-left [style.padding-left]="node.level * paddingLeft + 'px'"
                                          [attr.aria-level]="node.level"
                                          [treeControl]="treeControl"
@@ -7954,7 +7953,7 @@ class CvaFlatTreeComponent {
             <cdk-virtual-scroll-viewport #selectedScrollViewport
                                          *ngIf="!isCollapseSelected"
                                          itemSize="{{itemSize}}" [ngStyle]="{height: viewHeight + 'px'}">
-              <ng-container *cdkVirtualFor="let node of selectedDataSource">
+              <ng-container *cdkVirtualFor="let node of selectedDataSource; trackBy: trackByValue">
                 <cva-flat-tree-node-right [style.padding-left]="node.level * paddingLeft + 'px'"
                                           [attr.aria-level]="node.level"
                                           [treeControl]="selectedTreeControl"
@@ -8018,7 +8017,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
             </div>
             <cdk-virtual-scroll-viewport #chooseAreaScrollViewport itemSize="{{itemSize}}"
                                          [ngStyle]="{height: viewHeight + 'px'}">
-              <ng-container *cdkVirtualFor="let node of dataSource">
+              <ng-container *cdkVirtualFor="let node of dataSource; trackBy: trackByValue">
                 <cva-flat-tree-node-left [style.padding-left]="node.level * paddingLeft + 'px'"
                                          [attr.aria-level]="node.level"
                                          [treeControl]="treeControl"
@@ -8046,7 +8045,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
             <cdk-virtual-scroll-viewport #selectedScrollViewport
                                          *ngIf="!isCollapseSelected"
                                          itemSize="{{itemSize}}" [ngStyle]="{height: viewHeight + 'px'}">
-              <ng-container *cdkVirtualFor="let node of selectedDataSource">
+              <ng-container *cdkVirtualFor="let node of selectedDataSource; trackBy: trackByValue">
                 <cva-flat-tree-node-right [style.padding-left]="node.level * paddingLeft + 'px'"
                                           [attr.aria-level]="node.level"
                                           [treeControl]="selectedTreeControl"