@myrmidon/gve-core 0.0.1

package/esm2022/lib/components/simple-tree/simple-tree.component.mjs

@@ -0,0 +1,56 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { MatButtonModule } from '@angular/material/button';
+import { MatIconModule } from '@angular/material/icon';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/material/button";
+import * as i3 from "@angular/material/icon";
+export class SimpleTreeComponent {
+    constructor() {
+        this.selectedNodeChange = new EventEmitter();
+        this.level = 0;
+    }
+    get node() {
+        return this._node;
+    }
+    set node(value) {
+        if (this._node === value) {
+            return;
+        }
+        this._node = value;
+        this.level = this.calculateLevel(value);
+    }
+    ngOnInit() {
+        this.level = this.calculateLevel(this.node);
+    }
+    calculateLevel(node) {
+        let level = 0;
+        if (node) {
+            let n = node;
+            while (n.parent) {
+                level++;
+                n = n.parent;
+            }
+        }
+        return level;
+    }
+    selectNode(node) {
+        this.selectedNode = node;
+        this.selectedNodeChange.emit(node);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: SimpleTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.4", type: SimpleTreeComponent, isStandalone: true, selector: "gve-simple-tree", inputs: { node: "node", selectedNode: "selectedNode" }, outputs: { selectedNodeChange: "selectedNodeChange" }, ngImport: i0, template: "@if (node) {\r\n<div [style.margin-left]=\"level * 8 + 'px'\">\r\n  <ng-template\r\n    #tree\r\n    let-node\r\n    let-parentLevel=\"level\"\r\n    let-selectedNode=\"selectedNode\"\r\n  >\r\n    <div\r\n      [style.margin-left]=\"parentLevel * 8 + 'px'\"\r\n      [class.selected]=\"node === selectedNode\"\r\n    >\r\n      <div class=\"toolbar-row\">\r\n        <button\r\n          type=\"button\"\r\n          mat-icon-button\r\n          (click)=\"node.isExpanded = !node.isExpanded\"\r\n        >\r\n          <mat-icon>{{\r\n            node.isExpanded ? \"expand_more\" : \"chevron_right\"\r\n          }}</mat-icon>\r\n        </button>\r\n        <span class=\"label\" (click)=\"selectNode(node)\">\r\n          {{ node.label }}\r\n        </span>\r\n      </div>\r\n      <div *ngIf=\"node.children && node.isExpanded\">\r\n        <ng-container *ngFor=\"let child of node.children\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"\r\n              tree;\r\n              context: {\r\n                $implicit: child,\r\n                level: parentLevel + 1,\r\n                selectedNode: selectedNode\r\n              }\r\n            \"\r\n          ></ng-container>\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <!-- $implicit is the source of let-node -->\r\n  <ng-container\r\n    *ngTemplateOutlet=\"\r\n      tree;\r\n      context: { $implicit: node, level: level, selectedNode: selectedNode }\r\n    \"\r\n  ></ng-container>\r\n</div>\r\n}\r\n", styles: [".label{cursor:pointer}.toolbar-row{display:flex;align-items:center;flex-wrap:wrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: SimpleTreeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'gve-simple-tree', standalone: true, imports: [CommonModule, MatButtonModule, MatIconModule, MatTooltipModule], template: "@if (node) {\r\n<div [style.margin-left]=\"level * 8 + 'px'\">\r\n  <ng-template\r\n    #tree\r\n    let-node\r\n    let-parentLevel=\"level\"\r\n    let-selectedNode=\"selectedNode\"\r\n  >\r\n    <div\r\n      [style.margin-left]=\"parentLevel * 8 + 'px'\"\r\n      [class.selected]=\"node === selectedNode\"\r\n    >\r\n      <div class=\"toolbar-row\">\r\n        <button\r\n          type=\"button\"\r\n          mat-icon-button\r\n          (click)=\"node.isExpanded = !node.isExpanded\"\r\n        >\r\n          <mat-icon>{{\r\n            node.isExpanded ? \"expand_more\" : \"chevron_right\"\r\n          }}</mat-icon>\r\n        </button>\r\n        <span class=\"label\" (click)=\"selectNode(node)\">\r\n          {{ node.label }}\r\n        </span>\r\n      </div>\r\n      <div *ngIf=\"node.children && node.isExpanded\">\r\n        <ng-container *ngFor=\"let child of node.children\">\r\n          <ng-container\r\n            *ngTemplateOutlet=\"\r\n              tree;\r\n              context: {\r\n                $implicit: child,\r\n                level: parentLevel + 1,\r\n                selectedNode: selectedNode\r\n              }\r\n            \"\r\n          ></ng-container>\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <!-- $implicit is the source of let-node -->\r\n  <ng-container\r\n    *ngTemplateOutlet=\"\r\n      tree;\r\n      context: { $implicit: node, level: level, selectedNode: selectedNode }\r\n    \"\r\n  ></ng-container>\r\n</div>\r\n}\r\n", styles: [".label{cursor:pointer}.toolbar-row{display:flex;align-items:center;flex-wrap:wrap}\n"] }]
+        }], propDecorators: { node: [{
+                type: Input
+            }], selectedNode: [{
+                type: Input
+            }], selectedNodeChange: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2ltcGxlLXRyZWUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbXlybWlkb24vZ3ZlLWNvcmUvc3JjL2xpYi9jb21wb25lbnRzL3NpbXBsZS10cmVlL3NpbXBsZS10cmVlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL215cm1pZG9uL2d2ZS1jb3JlL3NyYy9saWIvY29tcG9uZW50cy9zaW1wbGUtdHJlZS9zaW1wbGUtdHJlZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQVUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQy9FLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUUvQyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLDJCQUEyQixDQUFDOzs7OztBQVc3RCxNQUFNLE9BQU8sbUJBQW1CO0lBUGhDO1FBeUJZLHVCQUFrQixHQUFHLElBQUksWUFBWSxFQUF3QixDQUFDO1FBRWpFLFVBQUssR0FBVyxDQUFDLENBQUM7S0FzQjFCO0lBdkNDLElBQ1csSUFBSTtRQUNiLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQztJQUNwQixDQUFDO0lBQ0QsSUFBVyxJQUFJLENBQUMsS0FBZ0M7UUFDOUMsSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLEtBQUssRUFBRSxDQUFDO1lBQ3pCLE9BQU87UUFDVCxDQUFDO1FBQ0QsSUFBSSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7UUFDbkIsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsY0FBYyxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzFDLENBQUM7SUFTTSxRQUFRO1FBQ2IsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUM5QyxDQUFDO0lBRU8sY0FBYyxDQUFDLElBQStCO1FBQ3BELElBQUksS0FBSyxHQUFHLENBQUMsQ0FBQztRQUNkLElBQUksSUFBSSxFQUFFLENBQUM7WUFDVCxJQUFJLENBQUMsR0FBOEIsSUFBSSxDQUFDO1lBQ3hDLE9BQU8sQ0FBQyxDQUFDLE1BQU0sRUFBRSxDQUFDO2dCQUNoQixLQUFLLEVBQUUsQ0FBQztnQkFDUixDQUFDLEdBQUcsQ0FBQyxDQUFDLE1BQU0sQ0FBQztZQUNmLENBQUM7UUFDSCxDQUFDO1FBQ0QsT0FBTyxLQUFLLENBQUM7SUFDZixDQUFDO0lBRU0sVUFBVSxDQUFDLElBQW1CO1FBQ25DLElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDO1FBQ3pCLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDckMsQ0FBQzs4R0F6Q1UsbUJBQW1CO2tHQUFuQixtQkFBbUIsMExDaEJoQyw0L0NBb0RBLDZJRHhDWSxZQUFZLHNhQUFFLGVBQWUsMklBQUUsYUFBYSxtTEFBRSxnQkFBZ0I7OzJGQUk3RCxtQkFBbUI7a0JBUC9CLFNBQVM7K0JBQ0UsaUJBQWlCLGNBQ2YsSUFBSSxXQUNQLENBQUMsWUFBWSxFQUFFLGVBQWUsRUFBRSxhQUFhLEVBQUUsZ0JBQWdCLENBQUM7OEJBUTlELElBQUk7c0JBRGQsS0FBSztnQkFhQyxZQUFZO3NCQURsQixLQUFLO2dCQUdJLGtCQUFrQjtzQkFBM0IsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuXHJcbmltcG9ydCB7IE1hdEJ1dHRvbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2J1dHRvbic7XHJcbmltcG9ydCB7IE1hdEljb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9pY29uJztcclxuaW1wb3J0IHsgTWF0VG9vbHRpcE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL3Rvb2x0aXAnO1xyXG5cclxuaW1wb3J0IHsgVHJlZU5vZGUgfSBmcm9tICdAbXlybWlkb24vZ3ZlLXNuYXBzaG90LXZpZXcnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdndmUtc2ltcGxlLXRyZWUnLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgTWF0QnV0dG9uTW9kdWxlLCBNYXRJY29uTW9kdWxlLCBNYXRUb29sdGlwTW9kdWxlXSxcclxuICB0ZW1wbGF0ZVVybDogJy4vc2ltcGxlLXRyZWUuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsOiAnLi9zaW1wbGUtdHJlZS5jb21wb25lbnQuY3NzJyxcclxufSlcclxuZXhwb3J0IGNsYXNzIFNpbXBsZVRyZWVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIHByaXZhdGUgX25vZGU6IFRyZWVOb2RlPGFueT4gfCB1bmRlZmluZWQ7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgcHVibGljIGdldCBub2RlKCk6IFRyZWVOb2RlPGFueT4gfCB1bmRlZmluZWQge1xyXG4gICAgcmV0dXJuIHRoaXMuX25vZGU7XHJcbiAgfVxyXG4gIHB1YmxpYyBzZXQgbm9kZSh2YWx1ZTogVHJlZU5vZGU8YW55PiB8IHVuZGVmaW5lZCkge1xyXG4gICAgaWYgKHRoaXMuX25vZGUgPT09IHZhbHVlKSB7XHJcbiAgICAgIHJldHVybjtcclxuICAgIH1cclxuICAgIHRoaXMuX25vZGUgPSB2YWx1ZTtcclxuICAgIHRoaXMubGV2ZWwgPSB0aGlzLmNhbGN1bGF0ZUxldmVsKHZhbHVlKTtcclxuICB9XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgcHVibGljIHNlbGVjdGVkTm9kZT86IFRyZWVOb2RlPGFueT4gfCBudWxsO1xyXG5cclxuICBAT3V0cHV0KCkgc2VsZWN0ZWROb2RlQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxUcmVlTm9kZTxhbnk+IHwgbnVsbD4oKTtcclxuXHJcbiAgcHVibGljIGxldmVsOiBudW1iZXIgPSAwO1xyXG5cclxuICBwdWJsaWMgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICB0aGlzLmxldmVsID0gdGhpcy5jYWxjdWxhdGVMZXZlbCh0aGlzLm5vZGUpO1xyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBjYWxjdWxhdGVMZXZlbChub2RlOiBUcmVlTm9kZTxhbnk+IHwgdW5kZWZpbmVkKTogbnVtYmVyIHtcclxuICAgIGxldCBsZXZlbCA9IDA7XHJcbiAgICBpZiAobm9kZSkge1xyXG4gICAgICBsZXQgbjogVHJlZU5vZGU8YW55PiB8IHVuZGVmaW5lZCA9IG5vZGU7XHJcbiAgICAgIHdoaWxlIChuLnBhcmVudCkge1xyXG4gICAgICAgIGxldmVsKys7XHJcbiAgICAgICAgbiA9IG4ucGFyZW50O1xyXG4gICAgICB9XHJcbiAgICB9XHJcbiAgICByZXR1cm4gbGV2ZWw7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgc2VsZWN0Tm9kZShub2RlOiBUcmVlTm9kZTxhbnk+KTogdm9pZCB7XHJcbiAgICB0aGlzLnNlbGVjdGVkTm9kZSA9IG5vZGU7XHJcbiAgICB0aGlzLnNlbGVjdGVkTm9kZUNoYW5nZS5lbWl0KG5vZGUpO1xyXG4gIH1cclxufVxyXG4iLCJAaWYgKG5vZGUpIHtcclxuPGRpdiBbc3R5bGUubWFyZ2luLWxlZnRdPVwibGV2ZWwgKiA4ICsgJ3B4J1wiPlxyXG4gIDxuZy10ZW1wbGF0ZVxyXG4gICAgI3RyZWVcclxuICAgIGxldC1ub2RlXHJcbiAgICBsZXQtcGFyZW50TGV2ZWw9XCJsZXZlbFwiXHJcbiAgICBsZXQtc2VsZWN0ZWROb2RlPVwic2VsZWN0ZWROb2RlXCJcclxuICA+XHJcbiAgICA8ZGl2XHJcbiAgICAgIFtzdHlsZS5tYXJnaW4tbGVmdF09XCJwYXJlbnRMZXZlbCAqIDggKyAncHgnXCJcclxuICAgICAgW2NsYXNzLnNlbGVjdGVkXT1cIm5vZGUgPT09IHNlbGVjdGVkTm9kZVwiXHJcbiAgICA+XHJcbiAgICAgIDxkaXYgY2xhc3M9XCJ0b29sYmFyLXJvd1wiPlxyXG4gICAgICAgIDxidXR0b25cclxuICAgICAgICAgIHR5cGU9XCJidXR0b25cIlxyXG4gICAgICAgICAgbWF0LWljb24tYnV0dG9uXHJcbiAgICAgICAgICAoY2xpY2spPVwibm9kZS5pc0V4cGFuZGVkID0gIW5vZGUuaXNFeHBhbmRlZFwiXHJcbiAgICAgICAgPlxyXG4gICAgICAgICAgPG1hdC1pY29uPnt7XHJcbiAgICAgICAgICAgIG5vZGUuaXNFeHBhbmRlZCA/IFwiZXhwYW5kX21vcmVcIiA6IFwiY2hldnJvbl9yaWdodFwiXHJcbiAgICAgICAgICB9fTwvbWF0LWljb24+XHJcbiAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgPHNwYW4gY2xhc3M9XCJsYWJlbFwiIChjbGljayk9XCJzZWxlY3ROb2RlKG5vZGUpXCI+XHJcbiAgICAgICAgICB7eyBub2RlLmxhYmVsIH19XHJcbiAgICAgICAgPC9zcGFuPlxyXG4gICAgICA8L2Rpdj5cclxuICAgICAgPGRpdiAqbmdJZj1cIm5vZGUuY2hpbGRyZW4gJiYgbm9kZS5pc0V4cGFuZGVkXCI+XHJcbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgY2hpbGQgb2Ygbm9kZS5jaGlsZHJlblwiPlxyXG4gICAgICAgICAgPG5nLWNvbnRhaW5lclxyXG4gICAgICAgICAgICAqbmdUZW1wbGF0ZU91dGxldD1cIlxyXG4gICAgICAgICAgICAgIHRyZWU7XHJcbiAgICAgICAgICAgICAgY29udGV4dDoge1xyXG4gICAgICAgICAgICAgICAgJGltcGxpY2l0OiBjaGlsZCxcclxuICAgICAgICAgICAgICAgIGxldmVsOiBwYXJlbnRMZXZlbCArIDEsXHJcbiAgICAgICAgICAgICAgICBzZWxlY3RlZE5vZGU6IHNlbGVjdGVkTm9kZVxyXG4gICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgXCJcclxuICAgICAgICAgID48L25nLWNvbnRhaW5lcj5cclxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cclxuICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICA8L25nLXRlbXBsYXRlPlxyXG5cclxuICA8IS0tICRpbXBsaWNpdCBpcyB0aGUgc291cmNlIG9mIGxldC1ub2RlIC0tPlxyXG4gIDxuZy1jb250YWluZXJcclxuICAgICpuZ1RlbXBsYXRlT3V0bGV0PVwiXHJcbiAgICAgIHRyZWU7XHJcbiAgICAgIGNvbnRleHQ6IHsgJGltcGxpY2l0OiBub2RlLCBsZXZlbDogbGV2ZWwsIHNlbGVjdGVkTm9kZTogc2VsZWN0ZWROb2RlIH1cclxuICAgIFwiXHJcbiAgPjwvbmctY29udGFpbmVyPlxyXG48L2Rpdj5cclxufVxyXG4iXX0=