@hestia-earth/ui-components 0.0.12 → 0.0.13

package/bundles/hestia-earth-ui-components.umd.js

@@ -2,7 +2,7 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/router'), require('@ng-bootstrap/ng-bootstrap'), require('@angular/google-maps'), require('@fortawesome/angular-fontawesome'), require('@fortawesome/free-regular-svg-icons'), require('@fortawesome/free-solid-svg-icons'), require('@angular/platform-browser'), require('rxjs'), require('random-material-color'), require('@hestia-earth/schema'), require('@hestia-earth/api'), require('@hestia-earth/utils'), require('pluralize'), require('rxjs/operators'), require('csvtojson'), require('@angular/common/http'), require('json-2-csv'), require('@angular/cdk/drag-drop'), require('@hestia-earth/schema-convert'), require('@hestia-earth/json-schema/schema-utils'), require('jsondiffpatch'), require('chart.js'), require('moment'), require('moment/locale/en-gb'), require('uuid'), require('@google/markerclustererplus'), require('chartjs-plugin-datalabels')) :
     typeof define === 'function' && define.amd ? define('@hestia-earth/ui-components', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/router', '@ng-bootstrap/ng-bootstrap', '@angular/google-maps', '@fortawesome/angular-fontawesome', '@fortawesome/free-regular-svg-icons', '@fortawesome/free-solid-svg-icons', '@angular/platform-browser', 'rxjs', 'random-material-color', '@hestia-earth/schema', '@hestia-earth/api', '@hestia-earth/utils', 'pluralize', 'rxjs/operators', 'csvtojson', '@angular/common/http', 'json-2-csv', '@angular/cdk/drag-drop', '@hestia-earth/schema-convert', '@hestia-earth/json-schema/schema-utils', 'jsondiffpatch', 'chart.js', 'moment', 'moment/locale/en-gb', 'uuid', '@google/markerclustererplus', 'chartjs-plugin-datalabels'], factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["hestia-earth"] = global["hestia-earth"] || {}, global["hestia-earth"]["ui-components"] = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.router, global.i10, global.ng.googleMaps, global.i1, global.freeRegularSvgIcons, global.freeSolidSvgIcons, global.ng.platformBrowser, global.rxjs, global.randomMaterialColor, global.schema, global.api, global.utils, global.pluralize, global.rxjs.operators, global.csvtojson, global.ng.common.http, global.json2Csv, global.ng.cdk.dragDrop, global.schemaConvert, global.schemaUtils, global.jsondiffpatch, global.chart_js, global.moment, null, global.uuid$1, global.MarkerClusterer, global.ChartDataLabels));
-})(this, (function (exports, i0, i3, i1$2, i4, i10, i1$4, i1, freeRegularSvgIcons, freeSolidSvgIcons, i1$1, rxjs, randomMaterialColor, schema, api, utils, pluralize, operators, csvtojson, i1$3, json2Csv, i6, schemaConvert, schemaUtils, jsondiffpatch, chart_js, moment, enGb, uuid$1, MarkerClusterer, ChartDataLabels) { 'use strict';
+})(this, (function (exports, i0, i6, i1$2, i5, i10, i1$4, i1, freeRegularSvgIcons, freeSolidSvgIcons, i1$1, rxjs, randomMaterialColor, schema, api, utils, pluralize, operators, csvtojson, i1$3, json2Csv, i6$1, schemaConvert, schemaUtils, jsondiffpatch, chart_js, moment, enGb, uuid$1, MarkerClusterer, ChartDataLabels) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -25,9 +25,9 @@
     }
 
     var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
-    var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
+    var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
     var i1__namespace$4 = /*#__PURE__*/_interopNamespace(i1$2);
-    var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
+    var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
     var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
     var i1__namespace$3 = /*#__PURE__*/_interopNamespace(i1$4);
     var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
@@ -35,7 +35,7 @@
     var pluralize__namespace = /*#__PURE__*/_interopNamespace(pluralize);
     var csvtojson__namespace = /*#__PURE__*/_interopNamespace(csvtojson);
     var i1__namespace$2 = /*#__PURE__*/_interopNamespace(i1$3);
-    var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
+    var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
     var moment__namespace = /*#__PURE__*/_interopNamespace(moment);
     var MarkerClusterer__default = /*#__PURE__*/_interopDefaultLegacy(MarkerClusterer);
     var ChartDataLabels__default = /*#__PURE__*/_interopDefaultLegacy(ChartDataLabels);
@@ -397,17 +397,17 @@
         return HeFontawesomeModule;
     }());
     HeFontawesomeModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFontawesomeModule, deps: [{ token: i1__namespace.FaIconLibrary }], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    HeFontawesomeModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFontawesomeModule, imports: [i3.CommonModule,
+    HeFontawesomeModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFontawesomeModule, imports: [i6.CommonModule,
             i1.FontAwesomeModule], exports: [i1.FontAwesomeModule] });
     HeFontawesomeModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFontawesomeModule, imports: [[
-                i3.CommonModule,
+                i6.CommonModule,
                 i1.FontAwesomeModule
             ], i1.FontAwesomeModule] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFontawesomeModule, decorators: [{
                 type: i0.NgModule,
                 args: [{
                         imports: [
-                            i3.CommonModule,
+                            i6.CommonModule,
                             i1.FontAwesomeModule
                         ],
                         exports: [
@@ -426,8 +426,8 @@
             var _this = this;
             this.meta.addTag({ charset: 'UTF-8' });
             var config = Object.assign({ 'og:url': window.location.href.split('?')[0] }, this.config);
-            Object.keys(config).map(function (name) {
-                var content = config[name];
+            Object.entries(config).map(function (_a) {
+                var _b = __read(_a, 2), name = _b[0], content = _b[1];
                 _this.meta.updateTag({ name: name, content: content });
                 if (name === 'og:description') {
                     _this.meta.updateTag({ name: 'description', content: content });
@@ -515,7 +515,7 @@
         return ToastComponent;
     }());
     ToastComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ToastComponent, deps: [{ token: HeToastService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ToastComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ToastComponent, selector: "he-toast", ngImport: i0__namespace, template: "<div class=\"mb-3 columns is-centered is-vcentered\">\n  <div class=\"notification is-{{toast.color}}\" role=\"alert\" *ngFor=\"let toast of toasts\">\n    <button class=\"delete\" aria-label=\"delete\" (click)=\"dismiss(toast)\">\n      <span aria-hidden=\"true\">&times;</span>\n    </button>\n    <strong [ngSwitch]=\"toast.color\">\n      <ng-container *ngSwitchCase=\"'danger'\">\n        <ng-container [ngSwitch]=\"toast.message\">\n          <span *ngSwitchCase=\"'Unauthorized'\">You are not allowed to perform this action.</span>\n          <span *ngSwitchCase=\"'form-invalid'\">Please fix all the errors on this page.</span>\n          <span *ngSwitchCase=\"'users-email-already-taken'\">Email already taken.</span>\n          <span *ngSwitchCase=\"'users-auth-already-taken'\">Account already connected.</span>\n          <span *ngSwitchDefault>\n            <span *ngIf=\"toast.showRawMessage\">{{toast.message}}</span>\n            <span [class.is-hidden]=\"toast.showRawMessage\">An unknown error occurred. Please try again later.</span>\n          </span>\n        </ng-container>\n      </ng-container>\n      <ng-container *ngSwitchDefault>\n        <span *ngIf=\"toast.showRawMessage\">{{toast.message}}</span>\n        <span [class.is-hidden]=\"toast.showRawMessage\">An unknown error occurred. Please try again later.</span>\n      </ng-container>\n    </strong>\n  </div>\n</div>\n", styles: [":host{bottom:0;position:fixed;width:100%}\n"], directives: [{ type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    ToastComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ToastComponent, selector: "he-toast", ngImport: i0__namespace, template: "<div class=\"mb-3 columns is-centered is-vcentered\">\n  <div class=\"notification is-{{toast.color}}\" role=\"alert\" *ngFor=\"let toast of toasts\">\n    <button class=\"delete\" aria-label=\"delete\" (click)=\"dismiss(toast)\">\n      <span aria-hidden=\"true\">&times;</span>\n    </button>\n    <strong [ngSwitch]=\"toast.color\">\n      <ng-container *ngSwitchCase=\"'danger'\">\n        <ng-container [ngSwitch]=\"toast.message\">\n          <span *ngSwitchCase=\"'Unauthorized'\">You are not allowed to perform this action.</span>\n          <span *ngSwitchCase=\"'form-invalid'\">Please fix all the errors on this page.</span>\n          <span *ngSwitchCase=\"'users-email-already-taken'\">Email already taken.</span>\n          <span *ngSwitchCase=\"'users-auth-already-taken'\">Account already connected.</span>\n          <span *ngSwitchDefault>\n            <span *ngIf=\"toast.showRawMessage\">{{toast.message}}</span>\n            <span [class.is-hidden]=\"toast.showRawMessage\">An unknown error occurred. Please try again later.</span>\n          </span>\n        </ng-container>\n      </ng-container>\n      <ng-container *ngSwitchDefault>\n        <span *ngIf=\"toast.showRawMessage\">{{toast.message}}</span>\n        <span [class.is-hidden]=\"toast.showRawMessage\">An unknown error occurred. Please try again later.</span>\n      </ng-container>\n    </strong>\n  </div>\n</div>\n", styles: [":host{bottom:0;position:fixed;width:100%}\n"], directives: [{ type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i6__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i6__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ToastComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -649,7 +649,10 @@
     };
     ;
     ;
-    var grouppedKeys = function (value) { return Object.keys(value).map(function (key) { return ({ key: key, value: value[key] }); }); };
+    var grouppedKeys = function (values) { return Object.entries(values).map(function (_a) {
+        var _b = __read(_a, 2), key = _b[0], value = _b[1];
+        return ({ key: key, value: value });
+    }); };
     var concatBlankNodeValue = function (value, newValue) {
         var valueArray = Array.isArray(value) ? value : [value];
         var newValueArray = Array.isArray(newValue) ? newValue : [newValue];
@@ -1015,9 +1018,12 @@
     var KeysPipe = /** @class */ (function () {
         function KeysPipe() {
         }
-        KeysPipe.prototype.transform = function (value, sort) {
+        KeysPipe.prototype.transform = function (values, sort) {
             if (sort === void 0) { sort = false; }
-            var keys = Object.keys(value).map(function (key) { return ({ key: key, value: value[key] }); });
+            var keys = Object.entries(values).map(function (_a) {
+                var _b = __read(_a, 2), key = _b[0], value = _b[1];
+                return ({ key: key, value: value });
+            });
             if (sort) {
                 keys.sort(function (a, b) { return a.key.localeCompare(b.key); });
             }
@@ -1097,7 +1103,7 @@
             KeysPipe,
             PluralizePipe,
             KeyToLabelPipe,
-            PrecisionPipe], imports: [i3.CommonModule, i1$2.FormsModule, i4.RouterModule,
+            PrecisionPipe], imports: [i6.CommonModule, i1$2.FormsModule, i5.RouterModule,
             HeFontawesomeModule], exports: [HeFontawesomeModule, SocialTagsComponent,
             ToastComponent,
             BindOnceDirective,
@@ -1108,7 +1114,7 @@
             KeyToLabelPipe,
             PrecisionPipe] });
     HeCommonLightModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeCommonLightModule, imports: [[
-                i3.CommonModule, i1$2.FormsModule, i4.RouterModule,
+                i6.CommonModule, i1$2.FormsModule, i5.RouterModule,
                 HeFontawesomeModule
             ], HeFontawesomeModule] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeCommonLightModule, decorators: [{
@@ -1119,139 +1125,12 @@
                             HeFontawesomeModule
                         ], __read(components$7)),
                         imports: [
-                            i3.CommonModule, i1$2.FormsModule, i4.RouterModule,
+                            i6.CommonModule, i1$2.FormsModule, i5.RouterModule,
                             HeFontawesomeModule
                         ]
                     }]
             }] });
 
-    var _a$4, _b$1, _c$1, _d$2;
-    var SUCCESS_CRITERION_MAX_DELTA_PERCENT = 5;
-    var WARNING_CRITERION_MAX_DELTA_PERCENT = 20;
-    exports.DeltaColour = void 0;
-    (function (DeltaColour) {
-        DeltaColour["Success"] = "success";
-        DeltaColour["Warning"] = "warning";
-        DeltaColour["Danger"] = "danger";
-    })(exports.DeltaColour || (exports.DeltaColour = {}));
-    exports.DeltaDisplayType = void 0;
-    (function (DeltaDisplayType) {
-        DeltaDisplayType["absolute"] = "absolute";
-        DeltaDisplayType["percent"] = "percent";
-    })(exports.DeltaDisplayType || (exports.DeltaDisplayType = {}));
-    var deltaPerType = (_a$4 = {},
-        _a$4[exports.DeltaDisplayType.absolute] = function (value, original) { return value - original; },
-        _a$4[exports.DeltaDisplayType.percent] = function (value, original) { return ((value - original) / original) * 100; },
-        _a$4);
-    var roundValue = function (value) { return +("" + value).substring(0, 10); };
-    var delta = function (value, originalValue, displayType, mapping) {
-        if (displayType === void 0) { displayType = exports.DeltaDisplayType.percent; }
-        var vvalue = roundValue(propertyValue$1(value));
-        var voriginalValue = roundValue(propertyValue$1(originalValue));
-        var deltaFuncs = Object.assign(Object.assign({}, deltaPerType), mapping);
-        var diff = vvalue === voriginalValue ? 0 : deltaFuncs[displayType](vvalue, voriginalValue);
-        return Number.isFinite(diff) ? (diff === -0 ? 0 : diff) : 0;
-    };
-    var PercentDeltaConditions;
-    (function (PercentDeltaConditions) {
-        PercentDeltaConditions["recalculated0"] = "recalculated should be 0";
-        PercentDeltaConditions["original0"] = "original is 0";
-    })(PercentDeltaConditions || (PercentDeltaConditions = {}));
-    var calculatePercentDeltaConditions = (_b$1 = {},
-        _b$1[PercentDeltaConditions.recalculated0] = function (original, recalculated) { return original > 0 && recalculated === 0; },
-        _b$1[PercentDeltaConditions.original0] = function (original, recalculated) { return original === 0 && recalculated > 0; },
-        _b$1);
-    var calculatePercentDeltaResult = (_c$1 = {},
-        _c$1[PercentDeltaConditions.recalculated0] = function (original, recalculated) { return (recalculated - original) / (original + 1); },
-        // Always considered an error so deliberately exceed SUCCESS_CRITERION_MAX_DELTA_PERCENT
-        _c$1[PercentDeltaConditions.original0] = function (original, recalculated) { return Math.sign(recalculated - original); },
-        _c$1.default = function (original, recalculated) { return (recalculated - original) / original; },
-        _c$1);
-    var calculatePercentDelta = function (recalculated, original) {
-        var matchingCondition = Object.values(PercentDeltaConditions).find(function (value) { return calculatePercentDeltaConditions[value](original, recalculated); }) || 'default';
-        return calculatePercentDeltaResult[matchingCondition](original, recalculated) * 100;
-    };
-    var customDeltaFuncs = (_d$2 = {},
-        _d$2[exports.DeltaDisplayType.percent] = calculatePercentDelta,
-        _d$2);
-    var evaluateSuccess = function (deltaValue) { return Math.abs(deltaValue) < SUCCESS_CRITERION_MAX_DELTA_PERCENT
-        ? exports.DeltaColour.Success
-        : Math.abs(deltaValue) < WARNING_CRITERION_MAX_DELTA_PERCENT
-            ? exports.DeltaColour.Warning
-            : exports.DeltaColour.Danger; };
-
-    var BlankNodeValueDeltaComponent = /** @class */ (function () {
-        function BlankNodeValueDeltaComponent() {
-            this.displayType = exports.DeltaDisplayType.percent;
-            this.DeltaDisplayType = exports.DeltaDisplayType;
-        }
-        Object.defineProperty(BlankNodeValueDeltaComponent.prototype, "hide", {
-            get: function () {
-                return emptyValue(this.value) || emptyValue(this.originalValue);
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(BlankNodeValueDeltaComponent.prototype, "delta", {
-            get: function () {
-                return delta(this.value, this.originalValue, this.displayType, customDeltaFuncs);
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(BlankNodeValueDeltaComponent.prototype, "color", {
-            get: function () {
-                return this.displayType === exports.DeltaDisplayType.percent ? evaluateSuccess(this.delta) : '';
-            },
-            enumerable: false,
-            configurable: true
-        });
-        return BlankNodeValueDeltaComponent;
-    }());
-    BlankNodeValueDeltaComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeValueDeltaComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    BlankNodeValueDeltaComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BlankNodeValueDeltaComponent, selector: "he-blank-node-value-delta", inputs: { value: "value", originalValue: "originalValue", displayType: "displayType" }, ngImport: i0__namespace, template: "<small [class.is-hidden]=\"hide\">\n  <span class=\"has-text-{{color}}\">\n    <span *ngIf=\"delta > 0\">+</span>\n    <ng-container [ngSwitch]=\"displayType\">\n      <ng-container *ngSwitchCase=\"DeltaDisplayType.absolute\">\n        <span *bindOnce=\"delta\">{{delta | precision:3}}</span>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"DeltaDisplayType.percent\">\n        <span *bindOnce=\"delta\">{{delta | number:'1.0-2'}}</span>\n        <span>%</span>\n      </ng-container>\n    </ng-container>\n  </span>\n</small>\n", styles: [""], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }], pipes: { "precision": PrecisionPipe, "number": i3__namespace.DecimalPipe } });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeValueDeltaComponent, decorators: [{
-                type: i0.Component,
-                args: [{
-                        selector: 'he-blank-node-value-delta',
-                        templateUrl: './blank-node-value-delta.component.html',
-                        styleUrls: ['./blank-node-value-delta.component.scss']
-                    }]
-            }], propDecorators: { value: [{
-                    type: i0.Input
-                }], originalValue: [{
-                    type: i0.Input
-                }], displayType: [{
-                    type: i0.Input
-                }] } });
-
-    var BlankNodeDiffsComponent = /** @class */ (function () {
-        function BlankNodeDiffsComponent() {
-            this.originalValues = [];
-            this.recalculatedValues = [];
-            this.propertyValue = propertyValue$1;
-            this.values = [];
-        }
-        BlankNodeDiffsComponent.prototype.ngOnInit = function () {
-            this.values = formatDiffValues(this.originalValues, this.recalculatedValues);
-        };
-        return BlankNodeDiffsComponent;
-    }());
-    BlankNodeDiffsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeDiffsComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    BlankNodeDiffsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BlankNodeDiffsComponent, selector: "he-blank-node-diffs", inputs: { originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<div class=\"table-container data-table-container mb-1\">\n  <table class=\"table is-narrow data-table has-children-3\" *bindOnce=\"values\">\n    <thead>\n      <tr>\n        <th class=\"width-auto\"></th>\n        <th>Original</th>\n        <th>Recalculated</th>\n        <th>Difference</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let value of values\"\n        [class.has-background-light]=\"!!value.original && value.original !== value.recalculated\"\n      >\n        <td class=\"width-auto\" [attr.title]=\"value.term.name\">\n          <ng-container *ngTemplateOutlet=\"termLink; context: {$implicit: value.term}\"></ng-container>\n        </td>\n        <td>\n          <span>{{value.original === undefined ? '-' : value.original}}</span>\n        </td>\n        <td>\n          <span>{{value.recalculated === undefined ? '-' : value.recalculated}}</span>\n        </td>\n        <td class=\"is-nowrap\">\n          <he-blank-node-value-delta\n            [value]=\"value.recalculated\"\n            [originalValue]=\"value.original\"\n          ></he-blank-node-value-delta>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<ng-template #termLink let-term>\n  <a [routerLink]=\"['/', 'term', term['@id']]\" target=\"_blank\">\n    <span class=\"is-nowrap has-text-ellipsis\">{{term.name}}</span>\n  </a>\n</ng-template>\n", styles: ["table.data-table th:first-child,table.data-table td:first-child{width:auto}\n"], components: [{ type: BlankNodeValueDeltaComponent, selector: "he-blank-node-value-delta", inputs: ["value", "originalValue", "displayType"] }], directives: [{ type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }] });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeDiffsComponent, decorators: [{
-                type: i0.Component,
-                args: [{
-                        selector: 'he-blank-node-diffs',
-                        templateUrl: './blank-node-diffs.component.html',
-                        styleUrls: ['./blank-node-diffs.component.scss']
-                    }]
-            }], propDecorators: { originalValues: [{
-                    type: i0.Input
-                }], recalculatedValues: [{
-                    type: i0.Input
-                }] } });
-
     var HE_API_BASE_URL = new i0.InjectionToken('HE_API_BASE_URL');
     var HeCommonService = /** @class */ (function () {
         function HeCommonService(_apiBaseUrl) {
@@ -1460,7 +1339,10 @@
             return this.models$.pipe(operators.take(1)).toPromise();
         };
         HeAggregationEngineService.prototype.model$ = function (model) {
-            return this.models$.pipe(operators.map(function (models) { return models.find(function (m) { return Object.keys(model).every(function (key) { return model[key] === m[key]; }); }); }));
+            return this.models$.pipe(operators.map(function (models) { return models.find(function (m) { return Object.entries(model).every(function (_b) {
+                var _c = __read(_b, 2), key = _c[0], value = _c[1];
+                return value === m[key];
+            }); }); }));
         };
         HeAggregationEngineService.prototype.model = function (model) {
             return this.model$(model).pipe(operators.take(1)).toPromise();
@@ -1576,7 +1458,10 @@
             return this.models$.pipe(operators.take(1)).toPromise();
         };
         HeEngineService.prototype.model$ = function (model) {
-            return this.models$.pipe(operators.map(function (models) { return models.find(function (m) { return Object.keys(model).every(function (key) { return model[key] === m[key]; }); }); }));
+            return this.models$.pipe(operators.map(function (models) { return models.find(function (m) { return Object.entries(model).every(function (_b) {
+                var _c = __read(_b, 2), key = _c[0], value = _c[1];
+                return value === m[key];
+            }); }); }));
         };
         HeEngineService.prototype.model = function (model) {
             return this.model$(model).pipe(operators.take(1)).toPromise();
@@ -1692,7 +1577,7 @@
         return BlankNodeStateComponent;
     }());
     BlankNodeStateComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeStateComponent, deps: [{ token: HeAggregationEngineService }, { token: HeEngineService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    BlankNodeStateComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: { nodeType: "nodeType", dataKey: "dataKey", key: "key", node: "node", state: "state" }, ngImport: i0__namespace, template: "<ng-container *bindOnce=\"node\">\n  <span *ngFor=\"let star of stars\">*</span>\n\n  <ng-container *ngIf=\"showLink\">\n    <!-- <span class=\"ml-2\" *ngIf=\"is(NodeKeyState.aggregated)\">\n      <ng-container *ngIf=\"aggregatedModel$ | async as model\">\n        <ng-container *ngTemplateOutlet=\"docsLink; context: {$implicit: model}\"></ng-container>\n      </ng-container>\n    </span> -->\n\n    <span class=\"ml-2\" *ngIf=\"is(NodeKeyState.added); else showUpdated\">\n      <ng-container *ngIf=\"engineModel$ | async as model\">\n        <ng-container *ngTemplateOutlet=\"docsLink; context: {$implicit: model}\"></ng-container>\n      </ng-container>\n    </span>\n  </ng-container>\n</ng-container>\n\n<ng-template #showUpdated>\n  <span class=\"ml-2\" *ngIf=\"is(NodeKeyState.updated)\">\n    <ng-container *ngIf=\"engineModel$ | async as model\">\n      <ng-container *ngTemplateOutlet=\"docsLink; context: {$implicit: model}\"></ng-container>\n    </ng-container>\n  </span>\n</ng-template>\n\n<ng-template #docsLink let-model>\n  <a [href]=\"model.apiDocsPath || model.docPath || model.path\" target=\"_blank\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <span>Docs</span>\n    <fa-icon class=\"ml-2\" icon=\"external-link-alt\" size=\"sm\"></fa-icon>\n  </a>\n</ng-template>\n", styles: [":host{display:inline-block}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i3__namespace.AsyncPipe } });
+    BlankNodeStateComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: { nodeType: "nodeType", dataKey: "dataKey", key: "key", node: "node", state: "state" }, ngImport: i0__namespace, template: "<ng-container *bindOnce=\"node\">\n  <span *ngFor=\"let star of stars\">*</span>\n\n  <ng-container *ngIf=\"showLink\">\n    <!-- <span class=\"ml-2\" *ngIf=\"is(NodeKeyState.aggregated)\">\n      <ng-container *ngIf=\"aggregatedModel$ | async as model\">\n        <ng-container *ngTemplateOutlet=\"docsLink; context: {$implicit: model}\"></ng-container>\n      </ng-container>\n    </span> -->\n\n    <span class=\"ml-2\" *ngIf=\"is(NodeKeyState.added); else showUpdated\">\n      <ng-container *ngIf=\"engineModel$ | async as model\">\n        <ng-container *ngTemplateOutlet=\"docsLink; context: {$implicit: model}\"></ng-container>\n      </ng-container>\n    </span>\n  </ng-container>\n</ng-container>\n\n<ng-template #showUpdated>\n  <span class=\"ml-2\" *ngIf=\"is(NodeKeyState.updated)\">\n    <ng-container *ngIf=\"engineModel$ | async as model\">\n      <ng-container *ngTemplateOutlet=\"docsLink; context: {$implicit: model}\"></ng-container>\n    </ng-container>\n  </span>\n</ng-template>\n\n<ng-template #docsLink let-model>\n  <a [href]=\"model.apiDocsPath || model.docPath || model.path\" target=\"_blank\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <span>Docs</span>\n    <fa-icon class=\"ml-2\" icon=\"external-link-alt\" size=\"sm\"></fa-icon>\n  </a>\n</ng-template>\n", styles: [":host{display:inline-block}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i6__namespace.AsyncPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeStateComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1726,7 +1611,7 @@
         return BlankNodeStateNoticeComponent;
     }());
     BlankNodeStateNoticeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeStateNoticeComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    BlankNodeStateNoticeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: { dataState: "dataState", showDeleted: "showDeleted" }, ngImport: i0__namespace, template: "<p class=\"is-size-7 is-italic\" *ngIf=\"show\">\n  <span>Recalculations: * Data Added ** Data Updated *** Data Aggregated</span>\n  <span *ngIf=\"showDeleted\" class=\"pl-1\">**** Data Deleted</span>\n</p>\n", styles: [""], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    BlankNodeStateNoticeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: { dataState: "dataState", showDeleted: "showDeleted" }, ngImport: i0__namespace, template: "<p class=\"is-size-7 is-italic\" *ngIf=\"show\">\n  <span>Recalculations: * Data Added ** Data Updated *** Data Aggregated</span>\n  <span *ngIf=\"showDeleted\" class=\"pl-1\">**** Data Deleted</span>\n</p>\n", styles: [""], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeStateNoticeComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1740,6 +1625,106 @@
                     type: i0.Input
                 }] } });
 
+    var _a$4, _b$1, _c$1, _d$2;
+    var SUCCESS_CRITERION_MAX_DELTA_PERCENT = 5;
+    var WARNING_CRITERION_MAX_DELTA_PERCENT = 20;
+    exports.DeltaColour = void 0;
+    (function (DeltaColour) {
+        DeltaColour["Success"] = "success";
+        DeltaColour["Warning"] = "warning";
+        DeltaColour["Danger"] = "danger";
+    })(exports.DeltaColour || (exports.DeltaColour = {}));
+    exports.DeltaDisplayType = void 0;
+    (function (DeltaDisplayType) {
+        DeltaDisplayType["absolute"] = "absolute";
+        DeltaDisplayType["percent"] = "percent";
+    })(exports.DeltaDisplayType || (exports.DeltaDisplayType = {}));
+    var deltaPerType = (_a$4 = {},
+        _a$4[exports.DeltaDisplayType.absolute] = function (value, original) { return value - original; },
+        _a$4[exports.DeltaDisplayType.percent] = function (value, original) { return ((value - original) / original) * 100; },
+        _a$4);
+    var roundValue = function (value) { return +("" + value).substring(0, 10); };
+    var delta = function (value, originalValue, displayType, mapping) {
+        if (displayType === void 0) { displayType = exports.DeltaDisplayType.percent; }
+        var vvalue = roundValue(propertyValue$1(value));
+        var voriginalValue = roundValue(propertyValue$1(originalValue));
+        var deltaFuncs = Object.assign(Object.assign({}, deltaPerType), mapping);
+        var diff = vvalue === voriginalValue ? 0 : deltaFuncs[displayType](vvalue, voriginalValue);
+        return Number.isFinite(diff) ? (diff === -0 ? 0 : diff) : 0;
+    };
+    var PercentDeltaConditions;
+    (function (PercentDeltaConditions) {
+        PercentDeltaConditions["recalculated0"] = "recalculated should be 0";
+        PercentDeltaConditions["original0"] = "original is 0";
+    })(PercentDeltaConditions || (PercentDeltaConditions = {}));
+    var calculatePercentDeltaConditions = (_b$1 = {},
+        _b$1[PercentDeltaConditions.recalculated0] = function (original, recalculated) { return original > 0 && recalculated === 0; },
+        _b$1[PercentDeltaConditions.original0] = function (original, recalculated) { return original === 0 && recalculated > 0; },
+        _b$1);
+    var calculatePercentDeltaResult = (_c$1 = {},
+        _c$1[PercentDeltaConditions.recalculated0] = function (original, recalculated) { return (recalculated - original) / (original + 1); },
+        // Always considered an error so deliberately exceed SUCCESS_CRITERION_MAX_DELTA_PERCENT
+        _c$1[PercentDeltaConditions.original0] = function (original, recalculated) { return Math.sign(recalculated - original); },
+        _c$1.default = function (original, recalculated) { return (recalculated - original) / original; },
+        _c$1);
+    var calculatePercentDelta = function (recalculated, original) {
+        var matchingCondition = Object.values(PercentDeltaConditions).find(function (value) { return calculatePercentDeltaConditions[value](original, recalculated); }) || 'default';
+        return calculatePercentDeltaResult[matchingCondition](original, recalculated) * 100;
+    };
+    var customDeltaFuncs = (_d$2 = {},
+        _d$2[exports.DeltaDisplayType.percent] = calculatePercentDelta,
+        _d$2);
+    var evaluateSuccess = function (deltaValue) { return Math.abs(deltaValue) < SUCCESS_CRITERION_MAX_DELTA_PERCENT
+        ? exports.DeltaColour.Success
+        : Math.abs(deltaValue) < WARNING_CRITERION_MAX_DELTA_PERCENT
+            ? exports.DeltaColour.Warning
+            : exports.DeltaColour.Danger; };
+
+    var BlankNodeValueDeltaComponent = /** @class */ (function () {
+        function BlankNodeValueDeltaComponent() {
+            this.displayType = exports.DeltaDisplayType.percent;
+            this.DeltaDisplayType = exports.DeltaDisplayType;
+        }
+        Object.defineProperty(BlankNodeValueDeltaComponent.prototype, "hide", {
+            get: function () {
+                return emptyValue(this.value) || emptyValue(this.originalValue);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BlankNodeValueDeltaComponent.prototype, "delta", {
+            get: function () {
+                return delta(this.value, this.originalValue, this.displayType, customDeltaFuncs);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BlankNodeValueDeltaComponent.prototype, "color", {
+            get: function () {
+                return this.displayType === exports.DeltaDisplayType.percent ? evaluateSuccess(this.delta) : '';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return BlankNodeValueDeltaComponent;
+    }());
+    BlankNodeValueDeltaComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeValueDeltaComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    BlankNodeValueDeltaComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BlankNodeValueDeltaComponent, selector: "he-blank-node-value-delta", inputs: { value: "value", originalValue: "originalValue", displayType: "displayType" }, ngImport: i0__namespace, template: "<small [class.is-hidden]=\"hide\">\n  <span class=\"has-text-{{color}}\">\n    <span *ngIf=\"delta > 0\">+</span>\n    <ng-container [ngSwitch]=\"displayType\">\n      <ng-container *ngSwitchCase=\"DeltaDisplayType.absolute\">\n        <span *bindOnce=\"delta\">{{delta | precision:3}}</span>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"DeltaDisplayType.percent\">\n        <span *bindOnce=\"delta\">{{delta | number:'1.0-2'}}</span>\n        <span>%</span>\n      </ng-container>\n    </ng-container>\n  </span>\n</small>\n", styles: [""], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i6__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }], pipes: { "precision": PrecisionPipe, "number": i6__namespace.DecimalPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BlankNodeValueDeltaComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'he-blank-node-value-delta',
+                        templateUrl: './blank-node-value-delta.component.html',
+                        styleUrls: ['./blank-node-value-delta.component.scss']
+                    }]
+            }], propDecorators: { value: [{
+                    type: i0.Input
+                }], originalValue: [{
+                    type: i0.Input
+                }], displayType: [{
+                    type: i0.Input
+                }] } });
+
     var ClipboardComponent = /** @class */ (function () {
         function ClipboardComponent() {
             this.disabled = false;
@@ -1863,7 +1848,7 @@
         return LinkKeyValueComponent;
     }());
     LinkKeyValueComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: LinkKeyValueComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    LinkKeyValueComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: LinkKeyValueComponent, selector: "he-link-key-value", inputs: { node: "node", nodeType: "nodeType", dataKey: "dataKey", key: "key" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!isUndefined\">\n  <ng-container *bindOnce=\"node\">\n    <a [href]=\"baseUrl + '/schema/' + type + '#' + key\" target=\"_blank\"><b>{{key}}</b></a>\n    <span class=\"pr-2\">:</span>\n    <a [href]=\"valueLink\" *ngIf=\"valueLink; else showString\">{{valueString}}</a>\n    <he-blank-node-state class=\"ml-1\"\n      [node]=\"node\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"\n    ></he-blank-node-state>\n  </ng-container>\n</ng-container>\n\n<ng-template #showString>\n  {{valueString | precision:3}}\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }], pipes: { "precision": PrecisionPipe } });
+    LinkKeyValueComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: LinkKeyValueComponent, selector: "he-link-key-value", inputs: { node: "node", nodeType: "nodeType", dataKey: "dataKey", key: "key" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!isUndefined\">\n  <ng-container *bindOnce=\"node\">\n    <a [href]=\"baseUrl + '/schema/' + type + '#' + key\" target=\"_blank\"><b>{{key}}</b></a>\n    <span class=\"pr-2\">:</span>\n    <a [href]=\"valueLink\" *ngIf=\"valueLink; else showString\">{{valueString}}</a>\n    <he-blank-node-state class=\"ml-1\"\n      [node]=\"node\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"\n    ></he-blank-node-state>\n  </ng-container>\n</ng-container>\n\n<ng-template #showString>\n  {{valueString | precision:3}}\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }], pipes: { "precision": PrecisionPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: LinkKeyValueComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2090,7 +2075,7 @@
         return PopoverComponent;
     }());
     PopoverComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: PopoverComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    PopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PopoverComponent, selector: "he-popover", inputs: { message: "message", content: "content", data: "data", position: "position" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0__namespace, template: "<div class=\"is-inline-block popover is-popover-{{position}}\" [class.is-popover-active]=\"active\">\n  <ng-content></ng-content>\n\n  <div class=\"popover-content\">\n\n    <ng-template\n      [ngTemplateOutlet]=\"content || ct\"\n      [ngTemplateOutletContext]=\"{message: message, data: data}\"\n    ></ng-template>\n\n    <footer>\n      <ng-content select=\"[actions]\"></ng-content>\n      <button class=\"button is-small\" (click)=\"$event.stopPropagation(); active = false\">\n        <span>Close</span>\n      </button>\n    </footer>\n  </div>\n</div>\n\n<ng-template #ct>\n  <p class=\"mb-2 is-pre-wrap\" [innerHtml]=\"message\"></p>\n</ng-template>\n", styles: [":host{cursor:pointer;display:block}.popover{position:relative;display:inline-block}.popover .popover-content{z-index:99999;position:absolute;display:none;font-size:.75rem;padding:.4rem .8rem;color:#4a4a4a;background-color:#fff;border-radius:4px;box-shadow:0 2px 3px #0a0a0a1a,0 0 0 1px #0a0a0a1a;width:max-content;max-width:24rem}.popover .popover-content:before{position:absolute;content:\"\";border-style:solid;pointer-events:none;height:0;width:0;top:100%;left:50%;border-color:transparent;border-bottom-color:#fff;border-left-color:#fff;border-width:.4rem;margin-left:-.4rem;margin-top:-.4rem;transform-origin:center;box-shadow:-1px 1px 2px #0a0a0a33}.popover .popover-content{top:auto!important;bottom:100%!important;left:50%!important;right:auto!important;transform:translate(-50%,-.7rem)!important}.popover .popover-content:before{top:100%!important;bottom:auto!important;left:50%!important;right:auto!important;transform:rotate(-45deg)}.popover.is-popover-right .popover-content{top:auto!important;bottom:50%!important;left:100%!important;right:auto!important;transform:translate(.7rem,50%)!important}.popover.is-popover-right .popover-content:before{top:50%!important;bottom:auto!important;left:0!important;right:auto!important;transform:rotate(45deg)}.popover.is-popover-bottom .popover-content{top:100%!important;bottom:auto!important;left:50%!important;right:auto!important;transform:translate(-50%,.7rem)!important}.popover.is-popover-bottom .popover-content:before{top:0!important;bottom:auto!important;left:50%!important;right:auto!important;transform:rotate(135deg)}.popover.is-popover-left .popover-content{top:auto!important;bottom:50%!important;left:auto!important;right:100%!important;transform:translate(-.7rem,50%)!important}.popover.is-popover-left .popover-content:before{top:50%!important;bottom:auto!important;left:100%!important;right:auto!important;transform:rotate(-135deg)}.popover.is-popover-active .popover-content,.popover.is-popover-hover:hover .popover-content,.popover .popover-trigger:focus~.popover-content{display:block}\n"], directives: [{ type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    PopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: PopoverComponent, selector: "he-popover", inputs: { message: "message", content: "content", data: "data", position: "position" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0__namespace, template: "<div class=\"is-inline-block popover is-popover-{{position}}\" [class.is-popover-active]=\"active\">\n  <ng-content></ng-content>\n\n  <div class=\"popover-content\">\n\n    <ng-template\n      [ngTemplateOutlet]=\"content || ct\"\n      [ngTemplateOutletContext]=\"{message: message, data: data}\"\n    ></ng-template>\n\n    <footer>\n      <ng-content select=\"[actions]\"></ng-content>\n      <button class=\"button is-small\" (click)=\"$event.stopPropagation(); active = false\">\n        <span>Close</span>\n      </button>\n    </footer>\n  </div>\n</div>\n\n<ng-template #ct>\n  <p class=\"mb-2 is-pre-wrap\" [innerHtml]=\"message\"></p>\n</ng-template>\n", styles: [":host{cursor:pointer;display:block}.popover{position:relative;display:inline-block}.popover .popover-content{z-index:99999;position:absolute;display:none;font-size:.75rem;padding:.4rem .8rem;color:#4a4a4a;background-color:#fff;border-radius:4px;box-shadow:0 2px 3px #0a0a0a1a,0 0 0 1px #0a0a0a1a;width:max-content;max-width:24rem}.popover .popover-content:before{position:absolute;content:\"\";border-style:solid;pointer-events:none;height:0;width:0;top:100%;left:50%;border-color:transparent;border-bottom-color:#fff;border-left-color:#fff;border-width:.4rem;margin-left:-.4rem;margin-top:-.4rem;transform-origin:center;box-shadow:-1px 1px 2px #0a0a0a33}.popover .popover-content{top:auto!important;bottom:100%!important;left:50%!important;right:auto!important;transform:translate(-50%,-.7rem)!important}.popover .popover-content:before{top:100%!important;bottom:auto!important;left:50%!important;right:auto!important;transform:rotate(-45deg)}.popover.is-popover-right .popover-content{top:auto!important;bottom:50%!important;left:100%!important;right:auto!important;transform:translate(.7rem,50%)!important}.popover.is-popover-right .popover-content:before{top:50%!important;bottom:auto!important;left:0!important;right:auto!important;transform:rotate(45deg)}.popover.is-popover-bottom .popover-content{top:100%!important;bottom:auto!important;left:50%!important;right:auto!important;transform:translate(-50%,.7rem)!important}.popover.is-popover-bottom .popover-content:before{top:0!important;bottom:auto!important;left:50%!important;right:auto!important;transform:rotate(135deg)}.popover.is-popover-left .popover-content{top:auto!important;bottom:50%!important;left:auto!important;right:100%!important;transform:translate(-.7rem,50%)!important}.popover.is-popover-left .popover-content:before{top:50%!important;bottom:auto!important;left:100%!important;right:auto!important;transform:rotate(-135deg)}.popover.is-popover-active .popover-content,.popover.is-popover-hover:hover .popover-content,.popover .popover-trigger:focus~.popover-content{display:block}\n"], directives: [{ type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: PopoverComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2166,7 +2151,7 @@
         return SchemaVersionLinkComponent;
     }());
     SchemaVersionLinkComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SchemaVersionLinkComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    SchemaVersionLinkComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SchemaVersionLinkComponent, selector: "he-schema-version-link", inputs: { node: "node", showExternalLink: "showExternalLink", linkClass: "linkClass", text: "text" }, ngImport: i0__namespace, template: "<ng-container *bindOnce=\"url\">\n  <a [href]=\"url\" target=\"_blank\" [class]=\"linkClass\" (click)=\"$event.stopPropagation()\">\n    <ng-content></ng-content>\n    <fa-icon class=\"ml-2\" icon=\"external-link-alt\" size=\"sm\" *ngIf=\"showExternalLink\"></fa-icon>\n  </a>\n</ng-container>\n", styles: ["a{color:inherit}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    SchemaVersionLinkComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SchemaVersionLinkComponent, selector: "he-schema-version-link", inputs: { node: "node", showExternalLink: "showExternalLink", linkClass: "linkClass", text: "text" }, ngImport: i0__namespace, template: "<ng-container *bindOnce=\"url\">\n  <a [href]=\"url\" target=\"_blank\" [class]=\"linkClass\" (click)=\"$event.stopPropagation()\">\n    <ng-content></ng-content>\n    <fa-icon class=\"ml-2\" icon=\"external-link-alt\" size=\"sm\" *ngIf=\"showExternalLink\"></fa-icon>\n  </a>\n</ng-container>\n", styles: ["a{color:inherit}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SchemaVersionLinkComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2302,7 +2287,7 @@
         return UnitConverterComponent;
     }());
     UnitConverterComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: UnitConverterComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    UnitConverterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: UnitConverterComponent, selector: "he-unit-converter", inputs: { term: "term", value: "value", fromUnits: "fromUnits", toUnits: "toUnits" }, ngImport: i0__namespace, template: "<div class=\"columns mb-0\">\n  <div class=\"column\">\n    <label class=\"label has-text-white\" for=\"value\">Value</label>\n  </div>\n  <div class=\"column\">\n    <label class=\"label has-text-white\" for=\"result\">Convert To</label>\n  </div>\n</div>\n\n<div class=\"columns\">\n  <div class=\"column\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <input type=\"number\" class=\"input\" [(ngModel)]=\"value\" name=\"value\" id=\"value\"\n          (input)=\"updateValue()\"\n        >\n      </div>\n      <div class=\"control is-expanded\">\n        <div class=\"select is-fullwidth\">\n          <select [(ngModel)]=\"fromUnits\" name=\"fromUnits\" id=\"fromUnits\"\n            (change)=\"updateUnits()\"\n          >\n            <option [value]=\"undefined\">Unit</option>\n            <option *ngFor=\"let unit of ConvertUnits | keys\" [value]=\"unit.value\">{{unit.key}}</option>\n          </select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"column\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <input type=\"string\" class=\"input\" [value]=\"result\" name=\"result\" id=\"result\" readonly>\n      </div>\n      <div class=\"control\">\n        <div class=\"select is-fullwidth\">\n          <select [(ngModel)]=\"toUnits\" name=\"toUnits\" id=\"toUnits\"\n            (change)=\"updateUnits()\"\n          >\n            <option [value]=\"undefined\">Unit</option>\n            <option *ngFor=\"let unit of units\" [value]=\"unit\">{{unit}}</option>\n          </select>\n        </div>\n      </div>\n      <div class=\"control\">\n        <he-clipboard clipboardClass=\"button is-white px-2\"\n          [value]=\"result\" [disabled]=\"!result\" [hideText]=\"true\"\n        ></he-clipboard>\n      </div>\n    </div>\n  </div>\n</div>\n\n<div class=\"field is-horizontal\" *ngFor=\"let arg of arguments\">\n  <div class=\"field-label is-normal\">\n    <label class=\"label has-text-white\" [for]=\"arg.key\">\n      <span class=\"is-capitalized\">{{arg.key}}</span>\n      <span class=\"has-text-danger pl-1\">*</span>\n    </label>\n  </div>\n  <div class=\"field-body\">\n    <div class=\"field\">\n      <div class=\"control\">\n        <input type=\"string\" class=\"input is-small\"\n          [(ngModel)]=\"arg.value\" [id]=\"arg.key\"\n          (input)=\"updateValue()\"\n          placeholder=\"Required for conversion\"\n        >\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".select{min-width:85px}\n"], components: [{ type: ClipboardComponent, selector: "he-clipboard", inputs: ["value", "disabled", "hideText", "icon", "size", "rotate", "clipboardClass"] }], directives: [{ type: i1__namespace$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "keys": KeysPipe } });
+    UnitConverterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: UnitConverterComponent, selector: "he-unit-converter", inputs: { term: "term", value: "value", fromUnits: "fromUnits", toUnits: "toUnits" }, ngImport: i0__namespace, template: "<div class=\"columns mb-0\">\n  <div class=\"column\">\n    <label class=\"label has-text-white\" for=\"value\">Value</label>\n  </div>\n  <div class=\"column\">\n    <label class=\"label has-text-white\" for=\"result\">Convert To</label>\n  </div>\n</div>\n\n<div class=\"columns\">\n  <div class=\"column\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <input type=\"number\" class=\"input\" [(ngModel)]=\"value\" name=\"value\" id=\"value\"\n          (input)=\"updateValue()\"\n        >\n      </div>\n      <div class=\"control is-expanded\">\n        <div class=\"select is-fullwidth\">\n          <select [(ngModel)]=\"fromUnits\" name=\"fromUnits\" id=\"fromUnits\"\n            (change)=\"updateUnits()\"\n          >\n            <option [value]=\"undefined\">Unit</option>\n            <option *ngFor=\"let unit of ConvertUnits | keys\" [value]=\"unit.value\">{{unit.key}}</option>\n          </select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"column\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <input type=\"string\" class=\"input\" [value]=\"result\" name=\"result\" id=\"result\" readonly>\n      </div>\n      <div class=\"control\">\n        <div class=\"select is-fullwidth\">\n          <select [(ngModel)]=\"toUnits\" name=\"toUnits\" id=\"toUnits\"\n            (change)=\"updateUnits()\"\n          >\n            <option [value]=\"undefined\">Unit</option>\n            <option *ngFor=\"let unit of units\" [value]=\"unit\">{{unit}}</option>\n          </select>\n        </div>\n      </div>\n      <div class=\"control\">\n        <he-clipboard clipboardClass=\"button is-white px-2\"\n          [value]=\"result\" [disabled]=\"!result\" [hideText]=\"true\"\n        ></he-clipboard>\n      </div>\n    </div>\n  </div>\n</div>\n\n<div class=\"field is-horizontal\" *ngFor=\"let arg of arguments\">\n  <div class=\"field-label is-normal\">\n    <label class=\"label has-text-white\" [for]=\"arg.key\">\n      <span class=\"is-capitalized\">{{arg.key}}</span>\n      <span class=\"has-text-danger pl-1\">*</span>\n    </label>\n  </div>\n  <div class=\"field-body\">\n    <div class=\"field\">\n      <div class=\"control\">\n        <input type=\"string\" class=\"input is-small\"\n          [(ngModel)]=\"arg.value\" [id]=\"arg.key\"\n          (input)=\"updateValue()\"\n          placeholder=\"Required for conversion\"\n        >\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".select{min-width:85px}\n"], components: [{ type: ClipboardComponent, selector: "he-clipboard", inputs: ["value", "disabled", "hideText", "icon", "size", "rotate", "clipboardClass"] }], directives: [{ type: i1__namespace$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "keys": KeysPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: UnitConverterComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -3987,7 +3972,6 @@
         BlankNodeValueDeltaComponent,
         SchemaVersionLinkComponent,
         UnitConverterComponent,
-        BlankNodeDiffsComponent,
         TimesPipe,
         ClickOutsideDirective,
         SkeletonTextComponent,
@@ -4010,11 +3994,10 @@
             BlankNodeValueDeltaComponent,
             SchemaVersionLinkComponent,
             UnitConverterComponent,
-            BlankNodeDiffsComponent,
             TimesPipe,
             ClickOutsideDirective,
             SkeletonTextComponent,
-            GetPipe], imports: [i3.CommonModule, i1$2.FormsModule, i4.RouterModule,
+            GetPipe], imports: [i6.CommonModule, i1$2.FormsModule, i5.RouterModule,
             i10.NgbTypeaheadModule, i10.NgbTooltipModule, i10.NgbPopoverModule,
             i1$4.GoogleMapsModule,
             HeCommonLightModule], exports: [i10.NgbTypeaheadModule, i10.NgbTooltipModule, i10.NgbPopoverModule,
@@ -4030,13 +4013,12 @@
             BlankNodeValueDeltaComponent,
             SchemaVersionLinkComponent,
             UnitConverterComponent,
-            BlankNodeDiffsComponent,
             TimesPipe,
             ClickOutsideDirective,
             SkeletonTextComponent,
             GetPipe] });
     HeCommonModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeCommonModule, imports: [[
-                i3.CommonModule, i1$2.FormsModule, i4.RouterModule,
+                i6.CommonModule, i1$2.FormsModule, i5.RouterModule,
                 i10.NgbTypeaheadModule, i10.NgbTooltipModule, i10.NgbPopoverModule,
                 i1$4.GoogleMapsModule,
                 HeCommonLightModule
@@ -4053,7 +4035,7 @@
                             HeCommonLightModule
                         ], __read(components$6)),
                         imports: [
-                            i3.CommonModule, i1$2.FormsModule, i4.RouterModule,
+                            i6.CommonModule, i1$2.FormsModule, i5.RouterModule,
                             i10.NgbTypeaheadModule, i10.NgbTooltipModule, i10.NgbPopoverModule,
                             i1$4.GoogleMapsModule,
                             HeCommonLightModule
@@ -4102,9 +4084,15 @@
         schema.NodeType.Cycle,
         schema.NodeType.Source
     ];
-    var serializeSearchFilters = function (filters) { return Object.keys(filters || {})
-        .filter(function (key) { return filters[key].length; })
-        .map(function (key) { return key + "=" + filters[key].filter(Boolean).join('|'); })
+    var serializeSearchFilters = function (filters) { return Object.entries(filters || {})
+        .filter(function (_a) {
+        var _b = __read(_a, 2), _key = _b[0], value = _b[1];
+        return value.length;
+    })
+        .map(function (_a) {
+        var _b = __read(_a, 2), key = _b[0], value = _b[1];
+        return key + "=" + value.filter(Boolean).join('|');
+    })
         .join(';'); };
     var deserializeSearchFilters = function (filters) { return (filters || '').split(';').reduce(function (prev, curr) {
         var _a = __read(curr.split('='), 2), key = _a[0], values = _a[1];
@@ -4530,7 +4518,7 @@
         return BibliographiesSearchConfirmComponent;
     }());
     BibliographiesSearchConfirmComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BibliographiesSearchConfirmComponent, deps: [{ token: i1__namespace$4.FormBuilder }, { token: HeMendeleyService }, { token: HeSearchService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    BibliographiesSearchConfirmComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BibliographiesSearchConfirmComponent, selector: "he-bibliographies-search-confirm", inputs: { search: "search", searchSources: "searchSources", searchBibliographies: "searchBibliographies", searchBy: "searchBy" }, outputs: { closed: "closed" }, ngImport: i0__namespace, template: "<div class=\"modal is-large is-active\">\n  <div class=\"modal-background\"></div>\n  <div class=\"modal-card\">\n    <header class=\"modal-card-head\">\n      <p class=\"modal-card-title\">Search Bibliographies</p>\n      <button class=\"delete\" aria-label=\"close\" (click)=\"cancel()\"></button>\n    </header>\n    <section class=\"modal-card-body\">\n      <form [formGroup]=\"formGroup\" novalidate>\n        <div class=\"field has-addons\">\n          <div class=\"control is-expanded has-icons-right\">\n            <input class=\"input search-input\"\n              [attr.placeholder]=\"'Search bibliography by ' + searchBy\"\n              formControlName=\"search\" name=\"randomname\" autocomplete=\"off\"\n              (focus)=\"searchFocus($event)\"\n            >\n            <a class=\"icon is-small is-right\" (click)=\"!loading && resetSearch()\" [ngSwitch]=\"loading\">\n              <fa-icon *ngSwitchCase=\"true\" icon=\"spinner\" [pulse]=\"true\"></fa-icon>\n              <fa-icon *ngSwitchCase=\"false\" icon=\"times\"></fa-icon>\n            </a>\n          </div>\n        </div>\n      </form>\n\n      <div class=\"mt-2\">\n        <span [class.is-hidden]=\"loading || !searchControl?.value || hasResults\">\n          No bibliographies found matching query.\n        </span>\n\n        <ul>\n          <li *ngFor=\"let result of results | async\">\n            <a class=\"is-block p-1 search-result\" (click)=\"selectResult(result)\"\n              [class.is-active]=\"selectedResult === result\"\n            >\n              <ngb-highlight\n                [result]=\"result.bibliography ? result.bibliography.title : result.title\"\n                [term]=\"searchControl?.value\"\n              ></ngb-highlight>\n\n              <span class=\"px-1\">-</span>\n\n              <span class=\"px-1\"><i>{{result.name}}</i></span>\n\n              <span class=\"px-1\"\n                *ngIf=\"result.bibliography?.documentDOI || result.documentDOI\"\n              >- <b>documentDOI:</b>\n              </span>\n              <ngb-highlight\n                [result]=\"result.bibliography ? result.bibliography.documentDOI : result.documentDOI\"\n                [term]=\"searchControl?.value\"\n              ></ngb-highlight>\n\n              <span class=\"px-1\"\n                *ngIf=\"result.bibliography?.scopus || result.scopus\"\n              >- <b>scopus:</b>\n              </span>\n              <ngb-highlight\n                [result]=\"result.bibliography?.scopus || result.scopus\"\n                [term]=\"searchControl?.value\"\n              ></ngb-highlight>\n\n              <span>\n                <ng-container *ngTemplateOutlet=\"mendeleyLink; context: {$implicit: result.bibliography ? result.bibliography.mendeleyID : result.mendeleyID}\"></ng-container>\n              </span>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </section>\n    <footer class=\"modal-card-foot\">\n      <button class=\"button is-primary\" (click)=\"confirm()\" [disabled]=\"!selectedResult\">\n        <span>Confirm</span>\n      </button>\n      <button class=\"button\" (click)=\"cancel()\">\n        <span>Close</span>\n      </button>\n    </footer>\n  </div>\n</div>\n\n<ng-template #mendeleyLink let-id>\n  <a *ngIf=\"id\" [href]=\"'https://www.mendeley.com/catalogue/' + id\" target=\"_blank\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <fa-icon class=\"ml-2\" icon=\"external-link-alt\" size=\"sm\"></fa-icon>\n  </a>\n</ng-template>\n", styles: ["ngb-highlight,span{vertical-align:middle;white-space:normal;width:auto}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i3__namespace.AsyncPipe } });
+    BibliographiesSearchConfirmComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: BibliographiesSearchConfirmComponent, selector: "he-bibliographies-search-confirm", inputs: { search: "search", searchSources: "searchSources", searchBibliographies: "searchBibliographies", searchBy: "searchBy" }, outputs: { closed: "closed" }, ngImport: i0__namespace, template: "<div class=\"modal is-large is-active\">\n  <div class=\"modal-background\"></div>\n  <div class=\"modal-card\">\n    <header class=\"modal-card-head\">\n      <p class=\"modal-card-title\">Search Bibliographies</p>\n      <button class=\"delete\" aria-label=\"close\" (click)=\"cancel()\"></button>\n    </header>\n    <section class=\"modal-card-body\">\n      <form [formGroup]=\"formGroup\" novalidate>\n        <div class=\"field has-addons\">\n          <div class=\"control is-expanded has-icons-right\">\n            <input class=\"input search-input\"\n              [attr.placeholder]=\"'Search bibliography by ' + searchBy\"\n              formControlName=\"search\" name=\"randomname\" autocomplete=\"off\"\n              (focus)=\"searchFocus($event)\"\n            >\n            <a class=\"icon is-small is-right\" (click)=\"!loading && resetSearch()\" [ngSwitch]=\"loading\">\n              <fa-icon *ngSwitchCase=\"true\" icon=\"spinner\" [pulse]=\"true\"></fa-icon>\n              <fa-icon *ngSwitchCase=\"false\" icon=\"times\"></fa-icon>\n            </a>\n          </div>\n        </div>\n      </form>\n\n      <div class=\"mt-2\">\n        <span [class.is-hidden]=\"loading || !searchControl?.value || hasResults\">\n          No bibliographies found matching query.\n        </span>\n\n        <ul>\n          <li *ngFor=\"let result of results | async\">\n            <a class=\"is-block p-1 search-result\" (click)=\"selectResult(result)\"\n              [class.is-active]=\"selectedResult === result\"\n            >\n              <ngb-highlight\n                [result]=\"result.bibliography ? result.bibliography.title : result.title\"\n                [term]=\"searchControl?.value\"\n              ></ngb-highlight>\n\n              <span class=\"px-1\">-</span>\n\n              <span class=\"px-1\"><i>{{result.name}}</i></span>\n\n              <span class=\"px-1\"\n                *ngIf=\"result.bibliography?.documentDOI || result.documentDOI\"\n              >- <b>documentDOI:</b>\n              </span>\n              <ngb-highlight\n                [result]=\"result.bibliography ? result.bibliography.documentDOI : result.documentDOI\"\n                [term]=\"searchControl?.value\"\n              ></ngb-highlight>\n\n              <span class=\"px-1\"\n                *ngIf=\"result.bibliography?.scopus || result.scopus\"\n              >- <b>scopus:</b>\n              </span>\n              <ngb-highlight\n                [result]=\"result.bibliography?.scopus || result.scopus\"\n                [term]=\"searchControl?.value\"\n              ></ngb-highlight>\n\n              <span>\n                <ng-container *ngTemplateOutlet=\"mendeleyLink; context: {$implicit: result.bibliography ? result.bibliography.mendeleyID : result.mendeleyID}\"></ng-container>\n              </span>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </section>\n    <footer class=\"modal-card-foot\">\n      <button class=\"button is-primary\" (click)=\"confirm()\" [disabled]=\"!selectedResult\">\n        <span>Confirm</span>\n      </button>\n      <button class=\"button\" (click)=\"cancel()\">\n        <span>Close</span>\n      </button>\n    </footer>\n  </div>\n</div>\n\n<ng-template #mendeleyLink let-id>\n  <a *ngIf=\"id\" [href]=\"'https://www.mendeley.com/catalogue/' + id\" target=\"_blank\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <fa-icon class=\"ml-2\" icon=\"external-link-alt\" size=\"sm\"></fa-icon>\n  </a>\n</ng-template>\n", styles: ["ngb-highlight,span{vertical-align:middle;white-space:normal;width:auto}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i6__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i6__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i6__namespace.AsyncPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: BibliographiesSearchConfirmComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -4559,10 +4547,10 @@
         return HeBibliographiesModule;
     }());
     HeBibliographiesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeBibliographiesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    HeBibliographiesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeBibliographiesModule, declarations: [BibliographiesSearchConfirmComponent], imports: [i3.CommonModule, i1$2.ReactiveFormsModule,
+    HeBibliographiesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeBibliographiesModule, declarations: [BibliographiesSearchConfirmComponent], imports: [i6.CommonModule, i1$2.ReactiveFormsModule,
             HeCommonModule], exports: [BibliographiesSearchConfirmComponent] });
     HeBibliographiesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeBibliographiesModule, imports: [[
-                i3.CommonModule, i1$2.ReactiveFormsModule,
+                i6.CommonModule, i1$2.ReactiveFormsModule,
                 HeCommonModule
             ]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeBibliographiesModule, decorators: [{
@@ -4571,7 +4559,7 @@
                         declarations: components$5,
                         exports: components$5,
                         imports: [
-                            i3.CommonModule, i1$2.ReactiveFormsModule,
+                            i6.CommonModule, i1$2.ReactiveFormsModule,
                             HeCommonModule
                         ]
                     }]
@@ -4902,7 +4890,7 @@
             });
         };
         NodeCsvSelectHeadersComponent.prototype.dropHeader = function (event, groupKey) {
-            i6.moveItemInArray(this.headers[groupKey].headers, event.previousIndex, event.currentIndex);
+            i6$1.moveItemInArray(this.headers[groupKey].headers, event.previousIndex, event.currentIndex);
             this.headersChanged.emit(this.selectedHeaders);
         };
         NodeCsvSelectHeadersComponent.prototype.updateAllSelected = function () {
@@ -4911,8 +4899,11 @@
         };
         NodeCsvSelectHeadersComponent.prototype.toggleAll = function () {
             var _this = this;
-            return Object.keys(this.headers).map(function (key) {
-                var group = _this.headers[key];
+            // select all term fields
+            Object.keys(this.termFieldSelected).map(function (key) { return (_this.termFieldSelected[key] = true); });
+            // select all keys
+            return Object.entries(this.headers).map(function (_b) {
+                var _c = __read(_b, 2), key = _c[0], group = _c[1];
                 group.selected = _this.allSelected;
                 return _this.updateGroup(key);
             });
@@ -4960,8 +4951,8 @@
         NodeCsvSelectHeadersComponent.prototype.toggleTermField = function (field) {
             var _this = this;
             var selected = this.termFieldSelected[field];
-            return Object.keys(this.headers).map(function (key) {
-                var group = _this.headers[key];
+            return Object.entries(this.headers).map(function (_b) {
+                var _c = __read(_b, 2), key = _c[0], group = _c[1];
                 group.headers.filter(isTermField(field)).map(function (header) { return header.selected = selected; });
                 return _this.updateGroupHeader(key);
             });
@@ -4969,7 +4960,7 @@
         return NodeCsvSelectHeadersComponent;
     }());
     NodeCsvSelectHeadersComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeCsvSelectHeadersComponent, deps: [{ token: HeSchemaService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeCsvSelectHeadersComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeCsvSelectHeadersComponent, selector: "he-node-csv-select-headers", inputs: { csv: "csv", keys: "keys", includeDefaultCSV: "includeDefaultCSV" }, outputs: { headersChanged: "headersChanged" }, ngImport: i0__namespace, template: "<p class=\"mb-2\">Please select which columns you would like to include:</p>\n\n<p class=\"my-2 is-size-7\"><i>You can drag and drop the headers to sort them as they would appear in the CSV file.</i></p>\n\n<div class=\"columns toggle-all mx-4 pb-1 mb-0\">\n  <div class=\"column\">\n    <label class=\"checkbox ml-1\">\n      <input type=\"checkbox\" class=\"selector\"\n        [(ngModel)]=\"allSelected\"\n        (change)=\"toggleAll(); reresh()\"\n      >\n      <span class=\"ml-2\">Toggle All</span>\n    </label>\n  </div>\n\n  <div class=\"column is-narrow has-text-right\">\n    <div class=\"dropdown is-right has-text-left\"\n      [class.is-active]=\"showSelectTermFields\"\n      (clickOutside)=\"showSelectTermFields = false\"\n    >\n      <div class=\"dropdown-trigger\" (click)=\"showSelectTermFields = !showSelectTermFields\">\n        <button class=\"button is-small\"\n          aria-haspopup=\"true\" aria-controls=\"select-menu\"\n        >\n          <span>Toggle Term Fields</span>\n          <span class=\"icon is-small\">\n            <fa-icon icon=\"filter\" aria-hidden=\"true\"></fa-icon>\n          </span>\n        </button>\n      </div>\n      <div class=\"dropdown-menu\" id=\"select-menu\" role=\"menu\">\n        <div class=\"dropdown-content\">\n          <a class=\"dropdown-item\"\n            *ngFor=\"let field of termFields\"\n          >\n            <label class=\"checkbox ml-1\">\n              <input type=\"checkbox\" class=\"selector\"\n                [(ngModel)]=\"termFieldSelected[field]\"\n                (change)=\"toggleTermField(field)\"\n              >\n              <span class=\"ml-2\">{{field}}</span>\n            </label>\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n\n<div class=\"drag-container\">\n  <div class=\"card\" *ngFor=\"let group of headers | keys\">\n    <header class=\"card-header\" *ngIf=\"group.key\">\n      <div class=\"card-header-title\">\n        <label class=\"checkbox ml-1\">\n          <input type=\"checkbox\" class=\"selector\"\n            [indeterminate]=\"group.value.partialSelected\"\n            [(ngModel)]=\"group.value.selected\"\n            (change)=\"updateGroup(group.key); reresh()\"\n          >\n          <span class=\"ml-2\">{{group.key}}</span>\n        </label>\n      </div>\n      <span class=\"card-header-icon has-text-link\" aria-label=\"open / close\"\n        (click)=\"group.value.open = !group.value.open\" pointer\n      >\n        <span class=\"icon\">\n          <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!group.value.open\"></fa-icon>\n          <fa-icon icon=\"angle-left\" [class.is-hidden]=\"group.value.open\"></fa-icon>\n        </span>\n      </span>\n    </header>\n\n    <div class=\"card-content p-3\" [class.is-hidden]=\"!group.value.open\">\n      <ul cdkDropList (cdkDropListDropped)=\"dropHeader($event, group.key)\">\n        <li *ngFor=\"let header of group.value.headers\" cdkDrag>\n          <label class=\"checkbox ml-2\">\n            <input type=\"checkbox\" class=\"selector\"\n              [(ngModel)]=\"header.selected\"\n              (change)=\"updateGroupHeader(group.key); reresh()\"\n            >\n            <span class=\"ml-2\">{{header.header}}</span>\n          </label>\n        </li>\n      </ul>\n    </div>\n  </div>\n</div>\n", styles: [".toggle-all{border-bottom:1px solid #7a7a7a}.drag-container,.table-container{max-height:45vh;overflow-y:auto}.cdk-drag-preview{border-radius:2px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;list-style:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i1__namespace$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i6__namespace.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], pipes: { "keys": KeysPipe } });
+    NodeCsvSelectHeadersComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeCsvSelectHeadersComponent, selector: "he-node-csv-select-headers", inputs: { csv: "csv", keys: "keys", includeDefaultCSV: "includeDefaultCSV" }, outputs: { headersChanged: "headersChanged" }, ngImport: i0__namespace, template: "<p class=\"mb-2\">Please select which columns you would like to include:</p>\n\n<p class=\"my-2 is-size-7\"><i>You can drag and drop the headers to sort them as they would appear in the CSV file.</i></p>\n\n<div class=\"columns toggle-all mx-4 pb-1 mb-0\">\n  <div class=\"column\">\n    <label class=\"checkbox ml-1\">\n      <input type=\"checkbox\" class=\"selector\"\n        [(ngModel)]=\"allSelected\"\n        (change)=\"toggleAll(); reresh()\"\n      >\n      <span class=\"ml-2\">Toggle All</span>\n    </label>\n  </div>\n\n  <div class=\"column is-narrow has-text-right\">\n    <div class=\"dropdown is-right has-text-left\"\n      [class.is-active]=\"showSelectTermFields\"\n      (clickOutside)=\"showSelectTermFields = false\"\n    >\n      <div class=\"dropdown-trigger\" (click)=\"showSelectTermFields = !showSelectTermFields\">\n        <button class=\"button is-small\"\n          aria-haspopup=\"true\" aria-controls=\"select-menu\"\n        >\n          <span>Toggle Term Fields</span>\n          <span class=\"icon is-small\">\n            <fa-icon icon=\"filter\" aria-hidden=\"true\"></fa-icon>\n          </span>\n        </button>\n      </div>\n      <div class=\"dropdown-menu\" id=\"select-menu\" role=\"menu\">\n        <div class=\"dropdown-content\">\n          <a class=\"dropdown-item\"\n            *ngFor=\"let field of termFields\"\n          >\n            <label class=\"checkbox ml-1\">\n              <input type=\"checkbox\" class=\"selector\"\n                [(ngModel)]=\"termFieldSelected[field]\"\n                (change)=\"toggleTermField(field)\"\n              >\n              <span class=\"ml-2\">{{field}}</span>\n            </label>\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n\n<div class=\"drag-container\">\n  <div class=\"card\" *ngFor=\"let group of headers | keys\">\n    <header class=\"card-header\" *ngIf=\"group.key\">\n      <div class=\"card-header-title\">\n        <label class=\"checkbox ml-1\">\n          <input type=\"checkbox\" class=\"selector\"\n            [indeterminate]=\"group.value.partialSelected\"\n            [(ngModel)]=\"group.value.selected\"\n            (change)=\"updateGroup(group.key); reresh()\"\n          >\n          <span class=\"ml-2\">{{group.key}}</span>\n        </label>\n      </div>\n      <span class=\"card-header-icon has-text-link\" aria-label=\"open / close\"\n        (click)=\"group.value.open = !group.value.open\" pointer\n      >\n        <span class=\"icon\">\n          <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!group.value.open\"></fa-icon>\n          <fa-icon icon=\"angle-left\" [class.is-hidden]=\"group.value.open\"></fa-icon>\n        </span>\n      </span>\n    </header>\n\n    <div class=\"card-content p-3\" [class.is-hidden]=\"!group.value.open\">\n      <ul cdkDropList (cdkDropListDropped)=\"dropHeader($event, group.key)\">\n        <li *ngFor=\"let header of group.value.headers\" cdkDrag>\n          <label class=\"checkbox ml-2\">\n            <input type=\"checkbox\" class=\"selector\"\n              [(ngModel)]=\"header.selected\"\n              (change)=\"updateGroupHeader(group.key); reresh()\"\n            >\n            <span class=\"ml-2\">{{header.header}}</span>\n          </label>\n        </li>\n      </ul>\n    </div>\n  </div>\n</div>\n", styles: [".toggle-all{border-bottom:1px solid #7a7a7a}.drag-container,.table-container{max-height:45vh;overflow-y:auto}.cdk-drag-preview{border-radius:2px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;list-style:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i1__namespace$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i6__namespace$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], pipes: { "keys": KeysPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeCsvSelectHeadersComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5035,7 +5026,7 @@
         return NodeCsvExportConfirmComponent;
     }());
     NodeCsvExportConfirmComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeCsvExportConfirmComponent, deps: [{ token: i1__namespace$1.DomSanitizer }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeCsvExportConfirmComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: { nodes: "nodes", filename: "filename", headerKeys: "headerKeys", extension: "extension", isUpload: "isUpload" }, outputs: { closed: "closed" }, ngImport: i0__namespace, template: "<div class=\"modal is-active\">\n  <div class=\"modal-background\"></div>\n  <div class=\"modal-card\">\n    <header class=\"modal-card-head\">\n      <p class=\"modal-card-title\">Export as CSV</p>\n      <button class=\"delete\" aria-label=\"close\" (click)=\"closed.next(true)\"></button>\n    </header>\n    <section class=\"modal-card-body\">\n      <div class=\"notification is-info\" role=\"alert\" *ngIf=\"isUpload\">\n        <span>After Download, you can edit and</span>\n        <a class=\"px-1\" routerLink=\"../\">upload the CSV file</a>\n        <span>to submit your content on the Hestia platform, and your draft will remain unchanged.</span>\n\n        <p>\n          <span>Alternatively, you can import the CSV file right back by clicking on the \"Import from CSV\" button and selecting the exported file.</span>\n        </p>\n      </div>\n\n      <ng-container *ngIf=\"!isUpload && includedNodes.length > 1\">\n        <p class=\"mb-2\">\n          <b>{{includedNodes.length}}</b>\n          <span class=\"px-1\">Nodes will be included in your download.</span>\n          <a (click)=\"showIncludeNodes = !showIncludeNodes\">\n            <ng-container *ngIf=\"!showIncludeNodes\">Show list</ng-container>\n            <ng-container *ngIf=\"showIncludeNodes\">Hide list</ng-container>\n          </a>\n        </p>\n\n        <div class=\"table-container\" *ngIf=\"showIncludeNodes\">\n          <table class=\"table is-fullwidth is-hoverable mb-0\">\n            <thead class=\"has-background-black\">\n              <tr>\n                <th>\n                  <span class=\"has-text-white\">@type</span>\n                </th>\n                <th>\n                  <span class=\"has-text-white\">@id</span>\n                </th>\n                <th>\n                  <span class=\"has-text-white\">Name</span>\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr *ngFor=\"let node of includedNodes\">\n                <td>\n                  <span *bindOnce=\"node\">{{node.node['@type']}}</span>\n                </td>\n                <td>\n                  <span *bindOnce=\"node\">{{node.node['@id']}}</span>\n                </td>\n                <td>\n                  <span *bindOnce=\"node\">{{node.node.name}}</span>\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n      </ng-container>\n\n      <he-node-csv-select-headers [class.is-hidden]=\"isUpload\"\n        [csv]=\"csvData\" [keys]=\"headerKeys\" [includeDefaultCSV]=\"isUpload\"\n        (headersChanged)=\"headersUpdated($event)\"\n      ></he-node-csv-select-headers>\n    </section>\n    <footer class=\"modal-card-foot\">\n      <a class=\"button is-success\" target=\"_blank\"\n        [attr.disabled]=\"csvContent ? null : true\"\n        [href]=\"csvContent\"\n        [attr.download]=\"csvContent ? downloadFilename : null\"\n        (click)=\"closed.next(true)\"\n      >\n        <fa-icon class=\"mr-2\" icon=\"download\"></fa-icon>\n        <span>Download CSV</span>\n      </a>\n      <button class=\"button\" (click)=\"closed.next(true)\">\n        <span>Cancel</span>\n      </button>\n    </footer>\n  </div>\n</div>\n", styles: [""], components: [{ type: NodeCsvSelectHeadersComponent, selector: "he-node-csv-select-headers", inputs: ["csv", "keys", "includeDefaultCSV"], outputs: ["headersChanged"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }] });
+    NodeCsvExportConfirmComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: { nodes: "nodes", filename: "filename", headerKeys: "headerKeys", extension: "extension", isUpload: "isUpload" }, outputs: { closed: "closed" }, ngImport: i0__namespace, template: "<div class=\"modal is-active\">\n  <div class=\"modal-background\"></div>\n  <div class=\"modal-card\">\n    <header class=\"modal-card-head\">\n      <p class=\"modal-card-title\">Export as CSV</p>\n      <button class=\"delete\" aria-label=\"close\" (click)=\"closed.next(true)\"></button>\n    </header>\n    <section class=\"modal-card-body\">\n      <div class=\"notification is-info\" role=\"alert\" *ngIf=\"isUpload\">\n        <span>After Download, you can edit and</span>\n        <a class=\"px-1\" routerLink=\"../\">upload the CSV file</a>\n        <span>to submit your content on the Hestia platform, and your draft will remain unchanged.</span>\n\n        <p>\n          <span>Alternatively, you can import the CSV file right back by clicking on the \"Import from CSV\" button and selecting the exported file.</span>\n        </p>\n      </div>\n\n      <ng-container *ngIf=\"!isUpload && includedNodes.length > 1\">\n        <p class=\"mb-2\">\n          <b>{{includedNodes.length}}</b>\n          <span class=\"px-1\">Nodes will be included in your download.</span>\n          <a (click)=\"showIncludeNodes = !showIncludeNodes\">\n            <ng-container *ngIf=\"!showIncludeNodes\">Show list</ng-container>\n            <ng-container *ngIf=\"showIncludeNodes\">Hide list</ng-container>\n          </a>\n        </p>\n\n        <div class=\"table-container\" *ngIf=\"showIncludeNodes\">\n          <table class=\"table is-fullwidth is-hoverable mb-0\">\n            <thead class=\"has-background-black\">\n              <tr>\n                <th>\n                  <span class=\"has-text-white\">@type</span>\n                </th>\n                <th>\n                  <span class=\"has-text-white\">@id</span>\n                </th>\n                <th>\n                  <span class=\"has-text-white\">Name</span>\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              <tr *ngFor=\"let node of includedNodes\">\n                <td>\n                  <span *bindOnce=\"node\">{{node.node['@type']}}</span>\n                </td>\n                <td>\n                  <span *bindOnce=\"node\">{{node.node['@id']}}</span>\n                </td>\n                <td>\n                  <span *bindOnce=\"node\">{{node.node.name}}</span>\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n      </ng-container>\n\n      <he-node-csv-select-headers [class.is-hidden]=\"isUpload\"\n        [csv]=\"csvData\" [keys]=\"headerKeys\" [includeDefaultCSV]=\"isUpload\"\n        (headersChanged)=\"headersUpdated($event)\"\n      ></he-node-csv-select-headers>\n    </section>\n    <footer class=\"modal-card-foot\">\n      <a class=\"button is-success\" target=\"_blank\"\n        [attr.disabled]=\"csvContent ? null : true\"\n        [href]=\"csvContent\"\n        [attr.download]=\"csvContent ? downloadFilename : null\"\n        (click)=\"closed.next(true)\"\n      >\n        <fa-icon class=\"mr-2\" icon=\"download\"></fa-icon>\n        <span>Download CSV</span>\n      </a>\n      <button class=\"button\" (click)=\"closed.next(true)\">\n        <span>Cancel</span>\n      </button>\n    </footer>\n  </div>\n</div>\n", styles: [""], components: [{ type: NodeCsvSelectHeadersComponent, selector: "he-node-csv-select-headers", inputs: ["csv", "keys", "includeDefaultCSV"], outputs: ["headersChanged"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeCsvExportConfirmComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5113,7 +5104,7 @@
         return NodeDiffsComponent;
     }());
     NodeDiffsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeDiffsComponent, deps: [{ token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeDiffsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeDiffsComponent, selector: "he-node-diffs", inputs: { data: "data", id: "id", type: "type", displayType: "displayType" }, outputs: { diffsLoaded: "diffsLoaded" }, ngImport: i0__namespace, template: "<div *ngIf=\"loading\" class=\"has-text-center py-3\">\n  <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n</div>\n\n<ng-container *ngIf=\"left && right\">\n  <ng-container [ngSwitch]=\"displayType\">\n    <div *ngSwitchCase=\"DiffsDisplayType.diffs\" [innerHTML]=\"diffHtml\"></div>\n\n    <div *ngSwitchCase=\"DiffsDisplayType.sideBySide\" class=\"columns\">\n      <div class=\"column is-6\">\n        <pre class=\"has-background-black has-text-white\"><code>{{left | json}}</code></pre>\n      </div>\n      <div class=\"column is-6\">\n        <pre class=\"has-background-black has-text-white\"><code>{{right | json}}</code></pre>\n      </div>\n    </div>\n  </ng-container>\n</ng-container>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], pipes: { "json": i3__namespace.JsonPipe } });
+    NodeDiffsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeDiffsComponent, selector: "he-node-diffs", inputs: { data: "data", id: "id", type: "type", displayType: "displayType" }, outputs: { diffsLoaded: "diffsLoaded" }, ngImport: i0__namespace, template: "<div *ngIf=\"loading\" class=\"has-text-center py-3\">\n  <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n</div>\n\n<ng-container *ngIf=\"left && right\">\n  <ng-container [ngSwitch]=\"displayType\">\n    <div *ngSwitchCase=\"DiffsDisplayType.diffs\" [innerHTML]=\"diffHtml\"></div>\n\n    <div *ngSwitchCase=\"DiffsDisplayType.sideBySide\" class=\"columns\">\n      <div class=\"column is-6\">\n        <pre class=\"has-background-black has-text-white\"><code>{{left | json}}</code></pre>\n      </div>\n      <div class=\"column is-6\">\n        <pre class=\"has-background-black has-text-white\"><code>{{right | json}}</code></pre>\n      </div>\n    </div>\n  </ng-container>\n</ng-container>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i6__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], pipes: { "json": i6__namespace.JsonPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeDiffsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5157,7 +5148,7 @@
         return NodeIconComponent;
     }());
     NodeIconComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeIconComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeIconComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeIconComponent, selector: "he-node-icon", inputs: { type: "type", size: "size" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"icon\">\n  <fa-icon [icon]=\"icon\" [size]=\"size\"></fa-icon>\n</ng-container>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    NodeIconComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeIconComponent, selector: "he-node-icon", inputs: { type: "type", size: "size" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"icon\">\n  <fa-icon [icon]=\"icon\" [size]=\"size\"></fa-icon>\n</ng-container>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeIconComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5193,7 +5184,7 @@
         return NodeLinkComponent;
     }());
     NodeLinkComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeLinkComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeLinkComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeLinkComponent, selector: "he-node-link", inputs: { node: "node", showExternalLink: "showExternalLink" }, ngImport: i0__namespace, template: "<a *ngIf=\"showLink; else content\"\n  [href]=\"baseUrl + '/' + node!['@type'].toLowerCase() + '/' + node!['@id']\"\n  [target]=\"target\"\n  (click)=\"$event.stopPropagation()\"\n  >\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  <fa-icon class=\"no-print ml-2 is-align-middle\" icon=\"external-link-alt\" size=\"sm\" *ngIf=\"showExternalLink\"></fa-icon>\n</a>\n\n<ng-template #content>\n  <span class=\"is-align-middle\" #placeholder><ng-content></ng-content></span>\n  <span class=\"is-align-middle\" *ngIf=\"placeholder.children.length === 0\">{{node!['@id']}}</span>\n</ng-template>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    NodeLinkComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeLinkComponent, selector: "he-node-link", inputs: { node: "node", showExternalLink: "showExternalLink" }, ngImport: i0__namespace, template: "<a *ngIf=\"showLink; else content\"\n  [href]=\"baseUrl + '/' + node!['@type'].toLowerCase() + '/' + node!['@id']\"\n  [target]=\"target\"\n  (click)=\"$event.stopPropagation()\"\n  >\n  <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  <fa-icon class=\"no-print ml-2 is-align-middle\" icon=\"external-link-alt\" size=\"sm\" *ngIf=\"showExternalLink\"></fa-icon>\n</a>\n\n<ng-template #content>\n  <span class=\"is-align-middle\" #placeholder><ng-content></ng-content></span>\n  <span class=\"is-align-middle\" *ngIf=\"placeholder.children.length === 0\">{{node!['@id']}}</span>\n</ng-template>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeLinkComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5266,7 +5257,7 @@
         return NodeLogsFileComponent;
     }());
     NodeLogsFileComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeLogsFileComponent, deps: [{ token: i1__namespace$1.DomSanitizer }, { token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeLogsFileComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeLogsFileComponent, selector: "he-node-logs-file", inputs: { node: "node", dataState: "dataState" }, ngImport: i0__namespace, template: "<div class=\"is-relative\">\n  <div class=\"copy-clipboard\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <he-clipboard clipboardClass=\"button is-link is-small\"\n          [value]=\"nodeLog | async\" [hideText]=\"true\" [icon]=\"['far', 'clone']\" size=\"lg\" rotate=\"180\"\n        ></he-clipboard>\n      </div>\n      <ng-container *ngIf=\"showFilters\">\n        <div class=\"control\">\n          <input class=\"input is-link is-small\"\n            [(ngModel)]=\"modelFilter\" id=\"modelFilter\"\n            (input)=\"applyFilters()\"\n            placeholder=\"Filter by Method / Model\"\n          >\n        </div>\n        <div class=\"control\">\n          <input class=\"input is-link is-small\"\n            [(ngModel)]=\"termFilter\" id=\"termFilter\"\n            (input)=\"applyFilters()\"\n            placeholder=\"Filter by Term\"\n          >\n        </div>\n        <div class=\"control\">\n          <div class=\"select is-link is-small\">\n            <select (change)=\"applyFilters()\"\n              [(ngModel)]=\"selectedLevel\" id=\"selectedLevel\"\n            >\n              <option *ngFor=\"let level of Level | keys\" [value]=\"level.value\">{{level.value}}</option>\n            </select>\n          </div>\n        </div>\n      </ng-container>\n      <div class=\"control\">\n        <button class=\"button is-small\" (click)=\"showFilters = !showFilters\"\n          [ngbTooltip]=\"showFilters ? 'Hide filters' : 'Show filters'\" placement=\"bottom\" container=\"body\"\n        >\n          <fa-icon icon=\"filter\"></fa-icon>\n        </button>\n      </div>\n      <div class=\"control pl-3\">\n        <a class=\"button is-dark is-outlined is-small\" target=\"_blank\"\n          [href]=\"csvContent\"\n          [download]=\"fileToExt(node!['@id'], 'csv')\"\n        >\n          <fa-icon class=\"mr-2\" icon=\"download\"></fa-icon>\n          <span>Download (CSV)</span>\n        </a>\n      </div>\n    </div>\n  </div>\n\n  <pre class=\"pl-3 pt-3 ml-3\"><code class=\"is-block {{line.class}}\" *ngFor=\"let line of nodeLogLines\">{{line.data.timestamp}} {{('[' + line.data.level + ']:').padEnd(9, ' ')}} {{line.data.message}}</code></pre>\n</div>\n", styles: [":host{display:block}pre{background-color:inherit;color:inherit;min-height:38px;max-height:500px}\n"], components: [{ type: ClipboardComponent, selector: "he-clipboard", inputs: ["value", "disabled", "hideText", "icon", "size", "rotate", "clipboardClass"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i10__namespace.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }], pipes: { "async": i3__namespace.AsyncPipe, "keys": KeysPipe } });
+    NodeLogsFileComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeLogsFileComponent, selector: "he-node-logs-file", inputs: { node: "node", dataState: "dataState" }, ngImport: i0__namespace, template: "<div class=\"is-relative\">\n  <div class=\"copy-clipboard\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <he-clipboard clipboardClass=\"button is-link is-small\"\n          [value]=\"nodeLog | async\" [hideText]=\"true\" [icon]=\"['far', 'clone']\" size=\"lg\" rotate=\"180\"\n        ></he-clipboard>\n      </div>\n      <ng-container *ngIf=\"showFilters\">\n        <div class=\"control\">\n          <input class=\"input is-link is-small\"\n            [(ngModel)]=\"modelFilter\" id=\"modelFilter\"\n            (input)=\"applyFilters()\"\n            placeholder=\"Filter by Method / Model\"\n          >\n        </div>\n        <div class=\"control\">\n          <input class=\"input is-link is-small\"\n            [(ngModel)]=\"termFilter\" id=\"termFilter\"\n            (input)=\"applyFilters()\"\n            placeholder=\"Filter by Term\"\n          >\n        </div>\n        <div class=\"control\">\n          <div class=\"select is-link is-small\">\n            <select (change)=\"applyFilters()\"\n              [(ngModel)]=\"selectedLevel\" id=\"selectedLevel\"\n            >\n              <option *ngFor=\"let level of Level | keys\" [value]=\"level.value\">{{level.value}}</option>\n            </select>\n          </div>\n        </div>\n      </ng-container>\n      <div class=\"control\">\n        <button class=\"button is-small\" (click)=\"showFilters = !showFilters\"\n          [ngbTooltip]=\"showFilters ? 'Hide filters' : 'Show filters'\" placement=\"bottom\" container=\"body\"\n        >\n          <fa-icon icon=\"filter\"></fa-icon>\n        </button>\n      </div>\n      <div class=\"control pl-3\">\n        <a class=\"button is-dark is-outlined is-small\" target=\"_blank\"\n          [href]=\"csvContent\"\n          [download]=\"fileToExt(node!['@id'], 'csv')\"\n        >\n          <fa-icon class=\"mr-2\" icon=\"download\"></fa-icon>\n          <span>Download (CSV)</span>\n        </a>\n      </div>\n    </div>\n  </div>\n\n  <pre class=\"pl-3 pt-3 ml-3\"><code class=\"is-block {{line.class}}\" *ngFor=\"let line of nodeLogLines\">{{line.data.timestamp}} {{('[' + line.data.level + ']:').padEnd(9, ' ')}} {{line.data.message}}</code></pre>\n</div>\n", styles: [":host{display:block}pre{background-color:inherit;color:inherit;min-height:38px;max-height:500px}\n"], components: [{ type: ClipboardComponent, selector: "he-clipboard", inputs: ["value", "disabled", "hideText", "icon", "size", "rotate", "clipboardClass"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i10__namespace.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }], pipes: { "async": i6__namespace.AsyncPipe, "keys": KeysPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeLogsFileComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5281,7 +5272,7 @@
                 }] } });
 
     var get$3 = require('lodash.get');
-    var orderBy$4 = require('lodash.orderby');
+    var orderBy$5 = require('lodash.orderby');
     var reduceValues = function (values) { return values.length ? values.reduce(function (p, v) { return p + propertyValue$1(v.value); }, 0) : null; };
     var logSubValue = function (logs, key, prop) { return logs[key][prop] ? {
         key: prop, value: logs[key][prop], configModels: [key]
@@ -5396,7 +5387,7 @@
                         }))), __read((this.recalculatedValues || []).map(function (_c) {
                             var term = _c.term;
                             return term;
-                        })))).pipe(operators.distinct(function (v) { return v['@id']; }), operators.toArray(), operators.map(function (v) { return orderBy$4(v, ['name'], ['asc']); })).toPromise()];
+                        })))).pipe(operators.distinct(function (v) { return v['@id']; }), operators.toArray(), operators.map(function (v) { return orderBy$5(v, ['name'], ['asc']); })).toPromise()];
                 });
             });
         };
@@ -5451,7 +5442,7 @@
         return NodeLogsModelsComponent;
     }());
     NodeLogsModelsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeLogsModelsComponent, deps: [{ token: HeSearchService }, { token: HeEngineService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeLogsModelsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: { nodeType: "nodeType", nodeKey: "nodeKey", logsUrl: "logsUrl", originalValues: "originalValues", recalculatedValues: "recalculatedValues", terms: "terms", logs: "logs", filteredType: "filteredType" }, ngImport: i0__namespace, template: "<div class=\"px-3 pb-3\">\n  <div class=\"has-text-right mb-2\" *ngIf=\"!isExternal\">\n    <a class=\"is-size-7\" *ngIf=\"logsUrl\" [href]=\"logsUrl\" target=\"_blank\">\n      <fa-icon icon=\"external-link-alt\"></fa-icon>\n      <span class=\"pl-2\">Open Full Logs</span>\n    </a>\n  </div>\n\n  <div class=\"table-container data-table-container mb-1\">\n    <table class=\"table is-narrow data-table\">\n      <thead>\n        <tr>\n          <th class=\"width-auto\">\n            <div class=\"field\">\n              <div class=\"control is-expanded has-icons-right\">\n                <input class=\"input search-input is-small\"\n                  [(ngModel)]=\"term\" name=\"term\"\n                  placeholder=\"Filter by name\"\n                  [editable]=\"false\"\n                  [ngbTypeahead]=\"suggestTerm\"\n                  (selectItem)=\"filterResults()\"\n                >\n                <a class=\"icon is-small is-right\"\n                  [class.is-hidden]=\"!term\"\n                  (click)=\"term = ''; filterResults();\"\n                >\n                  <fa-icon icon=\"times\"></fa-icon>\n                </a>\n              </div>\n            </div>\n          </th>\n          <th>Original</th>\n          <th>Recalculated</th>\n          <th *ngIf=\"originalValues?.length\">Difference</th>\n          <th *ngFor=\"let c of methodModelsCount | times; let i = index\">({{i + 1}})</th>\n        </tr>\n      </thead>\n      <tbody>\n        <tr *ngIf=\"loading\">\n          <td colspan=\"5\">\n            <div class=\"has-text-center py-3\">\n              <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n            </div>\n          </td>\n        </tr>\n        <ng-container *ngFor=\"let blankNode of blankNodes; trackBy: trackByBlankNode\">\n          <tr [class.has-sub-rows]=\"blankNode.canOpen\">\n            <td class=\"width-auto\" [attr.title]=\"blankNode.term.name\">\n              <a class=\"is-inline-block is-align-top pr-2 open-node\"\n                (click)=\"blankNode.isOpen = !blankNode.isOpen\"\n                *ngIf=\"blankNode.canOpen\"\n              >\n                <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!blankNode.isOpen\"></fa-icon>\n                <fa-icon icon=\"angle-right\" [class.is-hidden]=\"blankNode.isOpen\"></fa-icon>\n              </a>\n              <he-node-link class=\"is-inline-block\" [node]=\"blankNode.term\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{blankNode.term.name}}</span>\n              </he-node-link>\n            </td>\n            <td>\n              <span>{{blankNode.original | precision:3 | default:'-'}}</span>\n            </td>\n            <td>\n              <span *ngIf=\"blankNode.isRecalculated; else notUpdated\">\n                {{blankNode.recalculated | precision:3 | default:'-'}}\n              </span>\n            </td>\n            <td *ngIf=\"originalValues?.length\" class=\"is-nowrap\">\n              <he-blank-node-value-delta *ngIf=\"blankNode.isRecalculated\"\n                [value]=\"blankNode.recalculated\"\n                [originalValue]=\"blankNode.original\"\n              ></he-blank-node-value-delta>\n            </td>\n            <ng-container *ngTemplateOutlet=\"blankNodeModels; context: {blankNode: blankNode}\"></ng-container>\n          </tr>\n\n          <tr\n            *ngIf=\"blankNode.keys?.length\"\n            [class.is-hidden]=\"!blankNode.isOpen\"\n            [class.has-sub-rows]=\"blankNode.subValues?.length\"\n          >\n            <td class=\"width-auto\">\n              <div class=\"pl-3 has-text-left\">\n                <span>Fields</span>\n              </div>\n            </td>\n            <td [attr.colspan]=\"originalValues?.length ? 3 : 2\"></td>\n            <td *ngFor=\"let key of blankNode.keys\">\n              <ng-container *ngTemplateOutlet=\"blankNodeModel; context: {blankNode: blankNode, methodId: key}\"></ng-container>\n            </td>\n            <td *ngIf=\"methodModelsCount > blankNode.keys.length\" [attr.colspan]=\"methodModelsCount - blankNode.keys.length\"></td>\n          </tr>\n\n          <tr\n            *ngFor=\"let subValue of blankNode.subValues\"\n            [class.is-hidden]=\"!blankNode.isOpen\"\n          >\n            <td>\n              <div class=\"pl-3 has-text-left\">\n                <span class=\"is-inline-block is-nowrap has-text-ellipsis\">{{subValue.key | keyToLabel}}: {{subValue.value | keyToLabel}}</span>\n              </div>\n            </td>\n            <td [attr.colspan]=\"originalValues?.length ? 3 : 2\"></td>\n            <ng-container *ngTemplateOutlet=\"blankNodeModels; context: {blankNode: blankNode, subValue: subValue}\"></ng-container>\n          </tr>\n        </ng-container>\n      </tbody>\n    </table>\n  </div>\n\n  <div class=\"is-size-7 is-italic\">\n    <div class=\"columns is-variable is-1 my-0\">\n      <div class=\"column is-narrow\">\n        <span>Models:</span>\n      </div>\n      <div class=\"column is-narrow has-text-success\">\n        <fa-icon icon=\"check\"></fa-icon>\n        <span class=\"pl-1\">successful</span>\n      </div>\n      <div class=\"column is-narrow has-text-danger\">\n        <fa-icon icon=\"times\"></fa-icon>\n        <span class=\"pl-1\">failed</span>\n      </div>\n      <div class=\"column is-narrow has-text-dark\">\n        <fa-icon [icon]=\"['far', 'circle']\"></fa-icon>\n        <span class=\"pl-1\">not run (model higher up hierarchy run instead)</span>\n      </div>\n      <div class=\"column has-text-right\" *ngIf=\"filteredType\">\n        <label class=\"is-inline-block checkbox\">\n          <input type=\"checkbox\" class=\"selector\"\n            [(ngModel)]=\"onlyWithData\"\n            (change)=\"filterResults()\"\n          >\n          <span class=\"ml-2\">Show only recalculated {{filteredType | pluralize}}</span>\n        </label>\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #blankNodeModels let-blankNode=\"blankNode\" let-subValue=\"subValue\">\n  <td *ngFor=\"let c of methodModelsCount | times; let i = index\">\n    <ng-container *ngIf=\"validSubValue(blankNode, i, subValue)\">\n      <ng-container *ngIf=\"getMethodIdAt(blankNode, i, subValue); let methodId\">\n        <ng-container *ngTemplateOutlet=\"blankNodeModel; context: {blankNode: blankNode, methodId: methodId}\"></ng-container>\n      </ng-container>\n    </ng-container>\n  </td>\n</ng-template>\n\n<ng-template #blankNodeModel let-blankNode=\"blankNode\" let-methodId=\"methodId\">\n  <span\n    [class.trigger-popover]=\"hasLogDetails(blankNode, methodId)\"\n    [ngbPopover]=\"logDetails\" [autoClose]=\"'outside'\"\n    triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n    (click)=\"hasLogDetails(blankNode, methodId) ? togglePopover(p, { log: blankNode.logs[methodId] }) : null\"\n  >\n    <span class=\"is-capitalized\">{{methodName(blankNode, methodId)}}</span>\n    <span class=\"pl-1\" *ngIf=\"hasLog(blankNode, methodId) && blankNode.logs[methodId].methodTier\">[{{blankNode.logs[methodId].methodTier}}]</span>\n    <span class=\"pl-1 has-text-{{logColor(blankNode, methodId)}}\">\n      <fa-icon *ngIf=\"!hasLog(blankNode, methodId)\" [icon]=\"['far', 'circle']\"></fa-icon>\n      <fa-icon *ngIf=\"hasLog(blankNode, methodId)\" [icon]=\"blankNode.logs[methodId].shouldRun ? 'check' : 'times'\"></fa-icon>\n    </span>\n  </span>\n</ng-template>\n\n<ng-template #notUpdated>\n  <span>not updated</span>\n</ng-template>\n\n<ng-template #logDetails let-log=\"log\">\n  <ng-container *ngIf=\"log.requirements\">\n    <p *ngFor=\"let key of log.requirements | keys\" class=\"has-text-{{requirementColor(key.value)}}\">\n      {{key.key}}: {{key.value}}\n    </p>\n  </ng-container>\n  <ng-container *ngIf=\"log.logs\">\n    <p *ngFor=\"let key of log.logs | keys\">\n      {{key.key}}: {{key.value}}\n    </p>\n  </ng-container>\n  <ng-container *ngIf=\"log.missingLookups?.length\">\n    <p class=\"mt-2\">Missing lookups:</p>\n\n    <div class=\"table-container data-table-container\">\n      <table class=\"table is-fullwidth mb-0\">\n        <thead class=\"has-background-black\">\n          <tr>\n            <th>\n              <span class=\"has-text-white\">Filename</span>\n            </th>\n            <th>\n              <span class=\"has-text-white\">Column Title</span>\n            </th>\n            <th>\n              <span class=\"has-text-white\">Row (term.id)</span>\n            </th>\n          </tr>\n        </thead>\n        <tbody class=\"has-background-black has-text-white\">\n          <tr *ngFor=\"let data of log.missingLookups\">\n            <td>{{data.filename}}</td>\n            <td>{{data.column}}</td>\n            <td>{{data.termId}}</td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n  </ng-container>\n</ng-template>\n", styles: [":host{display:block}table.data-table th:nth-child(2),table.data-table td:nth-child(2){min-width:60px}table.data-table th:nth-child(3),table.data-table td:nth-child(3){min-width:100px}table.data-table tr.has-sub-rows td{border-bottom-style:dotted}table.data-table td he-node-link{width:190px}table.data-table td .open-node+he-node-link{width:170px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeValueDeltaComponent, selector: "he-blank-node-value-delta", inputs: ["value", "originalValue", "displayType"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1__namespace$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "times": TimesPipe, "default": DefaultPipe, "precision": PrecisionPipe, "keyToLabel": KeyToLabelPipe, "pluralize": PluralizePipe, "keys": KeysPipe } });
+    NodeLogsModelsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: { nodeType: "nodeType", nodeKey: "nodeKey", logsUrl: "logsUrl", originalValues: "originalValues", recalculatedValues: "recalculatedValues", terms: "terms", logs: "logs", filteredType: "filteredType" }, ngImport: i0__namespace, template: "<div class=\"px-3 pb-3\">\n  <div class=\"has-text-right mb-2\" *ngIf=\"!isExternal\">\n    <a class=\"is-size-7\" *ngIf=\"logsUrl\" [href]=\"logsUrl\" target=\"_blank\">\n      <fa-icon icon=\"external-link-alt\"></fa-icon>\n      <span class=\"pl-2\">Open Full Logs</span>\n    </a>\n  </div>\n\n  <div class=\"table-container data-table-container mb-1\">\n    <table class=\"table is-narrow data-table\">\n      <thead>\n        <tr>\n          <th class=\"width-auto\">\n            <div class=\"field\">\n              <div class=\"control is-expanded has-icons-right\">\n                <input class=\"input search-input is-small\"\n                  [(ngModel)]=\"term\" name=\"term\"\n                  placeholder=\"Filter by name\"\n                  [editable]=\"false\"\n                  [ngbTypeahead]=\"suggestTerm\"\n                  (selectItem)=\"filterResults()\"\n                >\n                <a class=\"icon is-small is-right\"\n                  [class.is-hidden]=\"!term\"\n                  (click)=\"term = ''; filterResults();\"\n                >\n                  <fa-icon icon=\"times\"></fa-icon>\n                </a>\n              </div>\n            </div>\n          </th>\n          <th>Original</th>\n          <th>Recalculated</th>\n          <th *ngIf=\"originalValues?.length\">Difference</th>\n          <th *ngFor=\"let c of methodModelsCount | times; let i = index\">({{i + 1}})</th>\n        </tr>\n      </thead>\n      <tbody>\n        <tr *ngIf=\"loading\">\n          <td colspan=\"5\">\n            <div class=\"has-text-center py-3\">\n              <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n            </div>\n          </td>\n        </tr>\n        <ng-container *ngFor=\"let blankNode of blankNodes; trackBy: trackByBlankNode\">\n          <tr [class.has-sub-rows]=\"blankNode.canOpen\">\n            <td class=\"width-auto\" [attr.title]=\"blankNode.term.name\">\n              <a class=\"is-inline-block is-align-top pr-2 open-node\"\n                (click)=\"blankNode.isOpen = !blankNode.isOpen\"\n                *ngIf=\"blankNode.canOpen\"\n              >\n                <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!blankNode.isOpen\"></fa-icon>\n                <fa-icon icon=\"angle-right\" [class.is-hidden]=\"blankNode.isOpen\"></fa-icon>\n              </a>\n              <he-node-link class=\"is-inline-block\" [node]=\"blankNode.term\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{blankNode.term.name}}</span>\n              </he-node-link>\n            </td>\n            <td>\n              <span>{{blankNode.original | precision:3 | default:'-'}}</span>\n            </td>\n            <td>\n              <span *ngIf=\"blankNode.isRecalculated; else notUpdated\">\n                {{blankNode.recalculated | precision:3 | default:'-'}}\n              </span>\n            </td>\n            <td *ngIf=\"originalValues?.length\" class=\"is-nowrap\">\n              <he-blank-node-value-delta *ngIf=\"blankNode.isRecalculated\"\n                [value]=\"blankNode.recalculated\"\n                [originalValue]=\"blankNode.original\"\n              ></he-blank-node-value-delta>\n            </td>\n            <ng-container *ngTemplateOutlet=\"blankNodeModels; context: {blankNode: blankNode}\"></ng-container>\n          </tr>\n\n          <tr\n            *ngIf=\"blankNode.keys?.length\"\n            [class.is-hidden]=\"!blankNode.isOpen\"\n            [class.has-sub-rows]=\"blankNode.subValues?.length\"\n          >\n            <td class=\"width-auto\">\n              <div class=\"pl-3 has-text-left\">\n                <span>Fields</span>\n              </div>\n            </td>\n            <td [attr.colspan]=\"originalValues?.length ? 3 : 2\"></td>\n            <td *ngFor=\"let key of blankNode.keys\">\n              <ng-container *ngTemplateOutlet=\"blankNodeModel; context: {blankNode: blankNode, methodId: key}\"></ng-container>\n            </td>\n            <td *ngIf=\"methodModelsCount > blankNode.keys.length\" [attr.colspan]=\"methodModelsCount - blankNode.keys.length\"></td>\n          </tr>\n\n          <tr\n            *ngFor=\"let subValue of blankNode.subValues\"\n            [class.is-hidden]=\"!blankNode.isOpen\"\n          >\n            <td>\n              <div class=\"pl-3 has-text-left\">\n                <span class=\"is-inline-block is-nowrap has-text-ellipsis\">{{subValue.key | keyToLabel}}: {{subValue.value | keyToLabel}}</span>\n              </div>\n            </td>\n            <td [attr.colspan]=\"originalValues?.length ? 3 : 2\"></td>\n            <ng-container *ngTemplateOutlet=\"blankNodeModels; context: {blankNode: blankNode, subValue: subValue}\"></ng-container>\n          </tr>\n        </ng-container>\n      </tbody>\n    </table>\n  </div>\n\n  <div class=\"is-size-7 is-italic\">\n    <div class=\"columns is-variable is-1 my-0\">\n      <div class=\"column is-narrow\">\n        <span>Models:</span>\n      </div>\n      <div class=\"column is-narrow has-text-success\">\n        <fa-icon icon=\"check\"></fa-icon>\n        <span class=\"pl-1\">successful</span>\n      </div>\n      <div class=\"column is-narrow has-text-danger\">\n        <fa-icon icon=\"times\"></fa-icon>\n        <span class=\"pl-1\">failed</span>\n      </div>\n      <div class=\"column is-narrow has-text-dark\">\n        <fa-icon [icon]=\"['far', 'circle']\"></fa-icon>\n        <span class=\"pl-1\">not run (model higher up hierarchy run instead)</span>\n      </div>\n      <div class=\"column has-text-right\" *ngIf=\"filteredType\">\n        <label class=\"is-inline-block checkbox\">\n          <input type=\"checkbox\" class=\"selector\"\n            [(ngModel)]=\"onlyWithData\"\n            (change)=\"filterResults()\"\n          >\n          <span class=\"ml-2\">Show only recalculated {{filteredType | pluralize}}</span>\n        </label>\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #blankNodeModels let-blankNode=\"blankNode\" let-subValue=\"subValue\">\n  <td *ngFor=\"let c of methodModelsCount | times; let i = index\">\n    <ng-container *ngIf=\"validSubValue(blankNode, i, subValue)\">\n      <ng-container *ngIf=\"getMethodIdAt(blankNode, i, subValue); let methodId\">\n        <ng-container *ngTemplateOutlet=\"blankNodeModel; context: {blankNode: blankNode, methodId: methodId}\"></ng-container>\n      </ng-container>\n    </ng-container>\n  </td>\n</ng-template>\n\n<ng-template #blankNodeModel let-blankNode=\"blankNode\" let-methodId=\"methodId\">\n  <span\n    [class.trigger-popover]=\"hasLogDetails(blankNode, methodId)\"\n    [ngbPopover]=\"logDetails\" [autoClose]=\"'outside'\"\n    triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n    (click)=\"hasLogDetails(blankNode, methodId) ? togglePopover(p, { log: blankNode.logs[methodId] }) : null\"\n  >\n    <span class=\"is-capitalized\">{{methodName(blankNode, methodId)}}</span>\n    <span class=\"pl-1\" *ngIf=\"hasLog(blankNode, methodId) && blankNode.logs[methodId].methodTier\">[{{blankNode.logs[methodId].methodTier}}]</span>\n    <span class=\"pl-1 has-text-{{logColor(blankNode, methodId)}}\">\n      <fa-icon *ngIf=\"!hasLog(blankNode, methodId)\" [icon]=\"['far', 'circle']\"></fa-icon>\n      <fa-icon *ngIf=\"hasLog(blankNode, methodId)\" [icon]=\"blankNode.logs[methodId].shouldRun ? 'check' : 'times'\"></fa-icon>\n    </span>\n  </span>\n</ng-template>\n\n<ng-template #notUpdated>\n  <span>not updated</span>\n</ng-template>\n\n<ng-template #logDetails let-log=\"log\">\n  <ng-container *ngIf=\"log.requirements\">\n    <p *ngFor=\"let key of log.requirements | keys\" class=\"has-text-{{requirementColor(key.value)}}\">\n      {{key.key}}: {{key.value}}\n    </p>\n  </ng-container>\n  <ng-container *ngIf=\"log.logs\">\n    <p *ngFor=\"let key of log.logs | keys\">\n      {{key.key}}: {{key.value}}\n    </p>\n  </ng-container>\n  <ng-container *ngIf=\"log.missingLookups?.length\">\n    <p class=\"mt-2\">Missing lookups:</p>\n\n    <div class=\"table-container data-table-container\">\n      <table class=\"table is-fullwidth mb-0\">\n        <thead class=\"has-background-black\">\n          <tr>\n            <th>\n              <span class=\"has-text-white\">Filename</span>\n            </th>\n            <th>\n              <span class=\"has-text-white\">Column Title</span>\n            </th>\n            <th>\n              <span class=\"has-text-white\">Row (term.id)</span>\n            </th>\n          </tr>\n        </thead>\n        <tbody class=\"has-background-black has-text-white\">\n          <tr *ngFor=\"let data of log.missingLookups\">\n            <td>{{data.filename}}</td>\n            <td>{{data.column}}</td>\n            <td>{{data.termId}}</td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n  </ng-container>\n</ng-template>\n", styles: [":host{display:block}table.data-table th:nth-child(2),table.data-table td:nth-child(2){min-width:60px}table.data-table th:nth-child(3),table.data-table td:nth-child(3){min-width:100px}table.data-table tr.has-sub-rows td{border-bottom-style:dotted}table.data-table td he-node-link{width:190px}table.data-table td .open-node+he-node-link{width:170px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeValueDeltaComponent, selector: "he-blank-node-value-delta", inputs: ["value", "originalValue", "displayType"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1__namespace$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "times": TimesPipe, "default": DefaultPipe, "precision": PrecisionPipe, "keyToLabel": KeyToLabelPipe, "pluralize": PluralizePipe, "keys": KeysPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeLogsModelsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5503,7 +5494,7 @@
         return NodeMissingLookupFactorsComponent;
     }());
     NodeMissingLookupFactorsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeMissingLookupFactorsComponent, deps: [{ token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeMissingLookupFactorsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeMissingLookupFactorsComponent, selector: "he-node-missing-lookup-factors", inputs: { node: "node" }, ngImport: i0__namespace, template: "<div *ngIf=\"!loading; else loader\" class=\"table-container data-table-container\">\n  <table class=\"table is-fullwidth is-hoverable mb-0\">\n    <thead class=\"has-background-black\">\n      <tr>\n        <th>\n          <span class=\"has-text-white\">Filename</span>\n        </th>\n        <th>\n          <span class=\"has-text-white\">Column Title</span>\n        </th>\n        <th>\n          <span class=\"has-text-white\">Row (term.id)</span>\n        </th>\n        <th>\n          <span class=\"has-text-white\">Model</span>\n        </th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngIf=\"!logs.length\">\n        <td colspan=\"3\">\n          <span>No missing lookup factors.</span>\n        </td>\n      </tr>\n      <tr *ngFor=\"let log of logs\">\n        <td>{{log.filename}}</td>\n        <td>\n          <span *ngIf=\"log.column; else na\">{{log.column}}</span>\n        </td>\n        <td>\n          <span *ngIf=\"log.termId; else na\">{{log.termId}}</span>\n        </td>\n        <td>\n          <ng-container *ngIf=\"log.model; else na\">\n            <span>{{log.model}}</span>\n            <span class=\"pl-1\" *ngIf=\"log.key\">/ {{log.key}}</span>\n            <span class=\"pl-1\" *ngIf=\"log.term && log.term !== log.termId\">/ {{log.term}}</span>\n          </ng-container>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n\n<ng-template #na>\n  <span>-</span>\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+    NodeMissingLookupFactorsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeMissingLookupFactorsComponent, selector: "he-node-missing-lookup-factors", inputs: { node: "node" }, ngImport: i0__namespace, template: "<div *ngIf=\"!loading; else loader\" class=\"table-container data-table-container\">\n  <table class=\"table is-fullwidth is-hoverable mb-0\">\n    <thead class=\"has-background-black\">\n      <tr>\n        <th>\n          <span class=\"has-text-white\">Filename</span>\n        </th>\n        <th>\n          <span class=\"has-text-white\">Column Title</span>\n        </th>\n        <th>\n          <span class=\"has-text-white\">Row (term.id)</span>\n        </th>\n        <th>\n          <span class=\"has-text-white\">Model</span>\n        </th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngIf=\"!logs.length\">\n        <td colspan=\"3\">\n          <span>No missing lookup factors.</span>\n        </td>\n      </tr>\n      <tr *ngFor=\"let log of logs\">\n        <td>{{log.filename}}</td>\n        <td>\n          <span *ngIf=\"log.column; else na\">{{log.column}}</span>\n        </td>\n        <td>\n          <span *ngIf=\"log.termId; else na\">{{log.termId}}</span>\n        </td>\n        <td>\n          <ng-container *ngIf=\"log.model; else na\">\n            <span>{{log.model}}</span>\n            <span class=\"pl-1\" *ngIf=\"log.key\">/ {{log.key}}</span>\n            <span class=\"pl-1\" *ngIf=\"log.term && log.term !== log.termId\">/ {{log.term}}</span>\n          </ng-container>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n\n<ng-template #na>\n  <span>-</span>\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeMissingLookupFactorsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5544,7 +5535,7 @@
         return NodeValueDetailsComponent;
     }());
     NodeValueDetailsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeValueDetailsComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    NodeValueDetailsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: { data: "data", nodeType: "nodeType", dataKey: "dataKey" }, ngImport: i0__namespace, template: "<ng-container *bindOnce=\"data\">\n  <ng-container *ngIf=\"data?.nodes?.length === 1; else showTable\">\n    <ng-container *ngFor=\"let key of keys\">\n      <he-link-key-value [node]=\"data!.nodes[0]\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"></he-link-key-value>\n    </ng-container>\n    <ng-container *ngFor=\"let key of additionalKeys\">\n      <he-link-key-value [node]=\"data!.nodes[0]\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"></he-link-key-value>\n    </ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #showTable>\n  <he-link-key-value [node]=\"data!.nodes[0]\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" key=\"term\"></he-link-key-value>\n\n  <div class=\"table-container mt-2\">\n    <table class=\"table is-narrow\">\n      <thead>\n        <th *ngFor=\"let key of tableKeys\">\n          <a [href]=\"baseUrl + '/schema/' + type + '#' + key\" target=\"_blank\"><b>{{key}}</b></a>\n        </th>\n      </thead>\n      <tbody>\n        <tr *ngFor=\"let node of data!.nodes\">\n          <td *ngFor=\"let key of tableKeys\">\n            <he-link-key-value [node]=\"node\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"></he-link-key-value>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</ng-template>\n", styles: ["table{background-color:transparent;color:#fff}table::ng-deep he-link-key-value a:first-child,table::ng-deep he-link-key-value a:first-child+span{display:none}\n"], components: [{ type: LinkKeyValueComponent, selector: "he-link-key-value", inputs: ["node", "nodeType", "dataKey", "key"] }], directives: [{ type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+    NodeValueDetailsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: { data: "data", nodeType: "nodeType", dataKey: "dataKey" }, ngImport: i0__namespace, template: "<ng-container *bindOnce=\"data\">\n  <ng-container *ngIf=\"data?.nodes?.length === 1; else showTable\">\n    <ng-container *ngFor=\"let key of keys\">\n      <he-link-key-value [node]=\"data!.nodes[0]\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"></he-link-key-value>\n    </ng-container>\n    <ng-container *ngFor=\"let key of additionalKeys\">\n      <he-link-key-value [node]=\"data!.nodes[0]\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"></he-link-key-value>\n    </ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #showTable>\n  <he-link-key-value [node]=\"data!.nodes[0]\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" key=\"term\"></he-link-key-value>\n\n  <div class=\"table-container mt-2\">\n    <table class=\"table is-narrow\">\n      <thead>\n        <th *ngFor=\"let key of tableKeys\">\n          <a [href]=\"baseUrl + '/schema/' + type + '#' + key\" target=\"_blank\"><b>{{key}}</b></a>\n        </th>\n      </thead>\n      <tbody>\n        <tr *ngFor=\"let node of data!.nodes\">\n          <td *ngFor=\"let key of tableKeys\">\n            <he-link-key-value [node]=\"node\" [nodeType]=\"nodeType\" [dataKey]=\"dataKey\" [key]=\"key\"></he-link-key-value>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</ng-template>\n", styles: ["table{background-color:transparent;color:#fff}table::ng-deep he-link-key-value a:first-child,table::ng-deep he-link-key-value a:first-child+span{display:none}\n"], components: [{ type: LinkKeyValueComponent, selector: "he-link-key-value", inputs: ["node", "nodeType", "dataKey", "key"] }], directives: [{ type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeValueDetailsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5585,8 +5576,8 @@
             NodeLogsFileComponent,
             NodeLogsModelsComponent,
             NodeMissingLookupFactorsComponent,
-            NodeValueDetailsComponent], imports: [i3.CommonModule, i4.RouterModule, i1$2.FormsModule,
-            i6.DragDropModule,
+            NodeValueDetailsComponent], imports: [i6.CommonModule, i5.RouterModule, i1$2.FormsModule,
+            i6$1.DragDropModule,
             HeCommonModule], exports: [NodeIconComponent,
             NodeLinkComponent,
             NodeCsvExportConfirmComponent,
@@ -5597,8 +5588,8 @@
             NodeMissingLookupFactorsComponent,
             NodeValueDetailsComponent] });
     HeNodeModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeNodeModule, imports: [[
-                i3.CommonModule, i4.RouterModule, i1$2.FormsModule,
-                i6.DragDropModule,
+                i6.CommonModule, i5.RouterModule, i1$2.FormsModule,
+                i6$1.DragDropModule,
                 HeCommonModule
             ]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeNodeModule, decorators: [{
@@ -5607,8 +5598,8 @@
                         declarations: components$4,
                         exports: components$4,
                         imports: [
-                            i3.CommonModule, i4.RouterModule, i1$2.FormsModule,
-                            i6.DragDropModule,
+                            i6.CommonModule, i5.RouterModule, i1$2.FormsModule,
+                            i6$1.DragDropModule,
                             HeCommonModule
                         ]
                     }]
@@ -5621,7 +5612,7 @@
         return CyclesFunctionalUnitMeasureComponent;
     }());
     CyclesFunctionalUnitMeasureComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesFunctionalUnitMeasureComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesFunctionalUnitMeasureComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesFunctionalUnitMeasureComponent, selector: "he-cycles-functional-unit-measure", inputs: { cycle: "cycle" }, ngImport: i0__namespace, template: "<span class=\"pl-1\" [ngSwitch]=\"cycle?.functionalUnit\">\n  <ng-container *ngSwitchCase=\"CycleFunctionalUnit['1 ha']\">1 hectare</ng-container>\n  <ng-container *ngSwitchDefault>relative</ng-container>\n</span>\n", styles: [""], directives: [{ type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
+    CyclesFunctionalUnitMeasureComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesFunctionalUnitMeasureComponent, selector: "he-cycles-functional-unit-measure", inputs: { cycle: "cycle" }, ngImport: i0__namespace, template: "<span class=\"pl-1\" [ngSwitch]=\"cycle?.functionalUnit\">\n  <ng-container *ngSwitchCase=\"CycleFunctionalUnit['1 ha']\">1 hectare</ng-container>\n  <ng-container *ngSwitchDefault>relative</ng-container>\n</span>\n", styles: [""], directives: [{ type: i6__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i6__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i6__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesFunctionalUnitMeasureComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5705,7 +5696,7 @@
         return CyclesSuggestFormComponent;
     }());
     CyclesSuggestFormComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesSuggestFormComponent, deps: [{ token: i1__namespace$4.FormBuilder }, { token: HeNodeService }, { token: HeSearchService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesSuggestFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesSuggestFormComponent, selector: "he-cycles-suggest-form", inputs: { cycles: "cycles" }, outputs: { cycleAdded: "cycleAdded" }, ngImport: i0__namespace, template: "<form class=\"mt-2\" [formGroup]=\"form\" (submit)=\"form.valid && submit()\">\n  <div class=\"field has-addons\">\n    <div class=\"control\">\n      <span class=\"button is-small is-static\">Compare with Aggregated Cycle</span>\n    </div>\n    <div class=\"control is-expanded\" [class.has-icons-right]=\"suggesting || loading\">\n      <input class=\"input is-small\"\n        placeholder=\"Search by name or id\"\n        formControlName=\"search\" name=\"search\"\n\n        [ngbTypeahead]=\"suggestCycle\"\n        [inputFormatter]=\"formatter\"\n        [resultTemplate]=\"suggestion\"\n        [focusFirst]=\"true\"\n      >\n      <span class=\"icon is-small is-right has-text-grey-dark\" [class.is-hidden]=\"!(suggesting || loading)\">\n        <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"sm\"></fa-icon>\n      </span>\n    </div>\n    <div class=\"control\">\n      <button class=\"button is-small\" type=\"submit\" [disabled]=\"suggesting || loading\">\n        <fa-icon icon=\"plus\"></fa-icon>\n      </button>\n    </div>\n  </div>\n</form>\n\n<ng-template #suggestion let-cycle=\"result\" let-t=\"term\">\n  <div class=\"is-block\">\n    <ngb-highlight [result]=\"cycle.name\" [term]=\"t\"></ngb-highlight>\n  </div>\n  <div class=\"columns is-flex\">\n    <div class=\"column\" *ngIf=\"cycle.site?.country?.name\">\n      <span class=\"pr-1 has-text-underline\">Country:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"cycle.site.country.name\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n    <!-- <div class=\"column\" *ngIf=\"impact.product\">\n      <span class=\"pr-1 has-text-underline\">Product:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.product.name\" [term]=\"t\"></ngb-highlight></span>\n    </div> -->\n    <div class=\"column\" *ngIf=\"cycle.endDate\">\n      <span class=\"pr-1 has-text-underline\">Date:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"cycle.endDate\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    CyclesSuggestFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesSuggestFormComponent, selector: "he-cycles-suggest-form", inputs: { cycles: "cycles" }, outputs: { cycleAdded: "cycleAdded" }, ngImport: i0__namespace, template: "<form class=\"mt-2\" [formGroup]=\"form\" (submit)=\"form.valid && submit()\">\n  <div class=\"field has-addons\">\n    <div class=\"control\">\n      <span class=\"button is-small is-static\">Compare with Aggregated Cycle</span>\n    </div>\n    <div class=\"control is-expanded\" [class.has-icons-right]=\"suggesting || loading\">\n      <input class=\"input is-small\"\n        placeholder=\"Search by name or id\"\n        formControlName=\"search\" name=\"search\"\n\n        [ngbTypeahead]=\"suggestCycle\"\n        [inputFormatter]=\"formatter\"\n        [resultTemplate]=\"suggestion\"\n        [focusFirst]=\"true\"\n      >\n      <span class=\"icon is-small is-right has-text-grey-dark\" [class.is-hidden]=\"!(suggesting || loading)\">\n        <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"sm\"></fa-icon>\n      </span>\n    </div>\n    <div class=\"control\">\n      <button class=\"button is-small\" type=\"submit\" [disabled]=\"suggesting || loading\">\n        <fa-icon icon=\"plus\"></fa-icon>\n      </button>\n    </div>\n  </div>\n</form>\n\n<ng-template #suggestion let-cycle=\"result\" let-t=\"term\">\n  <div class=\"is-block\">\n    <ngb-highlight [result]=\"cycle.name\" [term]=\"t\"></ngb-highlight>\n  </div>\n  <div class=\"columns is-flex\">\n    <div class=\"column\" *ngIf=\"cycle.site?.country?.name\">\n      <span class=\"pr-1 has-text-underline\">Country:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"cycle.site.country.name\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n    <!-- <div class=\"column\" *ngIf=\"impact.product\">\n      <span class=\"pr-1 has-text-underline\">Product:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.product.name\" [term]=\"t\"></ngb-highlight></span>\n    </div> -->\n    <div class=\"column\" *ngIf=\"cycle.endDate\">\n      <span class=\"pr-1 has-text-underline\">Date:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"cycle.endDate\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesSuggestFormComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5759,7 +5750,7 @@
         return CyclesActivityLogsComponent;
     }());
     CyclesActivityLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesActivityLogsComponent, deps: [{ token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesActivityLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesActivityLogsComponent, selector: "he-cycles-activity-logs", inputs: { original: "original", recalculated: "recalculated" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!loading; else loader\">\n  <div class=\"tabs mb-1\">\n    <ul>\n      <li [class.is-active]=\"selectedTab === Tab.inputs\">\n        <a (click)=\"selectedTab = Tab.inputs\">Inputs</a>\n      </li>\n      <li [class.is-active]=\"selectedTab === Tab.products\">\n        <a (click)=\"selectedTab = Tab.products\">Products</a>\n      </li>\n    </ul>\n  </div>\n\n  <he-node-logs-models [class.is-hidden]=\"selectedTab !== Tab.inputs\"\n    [logsUrl]=\"logsUrl\"\n    [nodeType]=\"NodeType.Cycle\"\n    [originalValues]=\"original?.inputs\"\n    [recalculatedValues]=\"recalculated?.inputs\"\n    [logs]=\"logs\"\n  ></he-node-logs-models>\n\n  <he-node-logs-models [class.is-hidden]=\"selectedTab !== Tab.products\"\n    [logsUrl]=\"logsUrl\"\n    [nodeType]=\"NodeType.Cycle\"\n    [originalValues]=\"original?.products\"\n    [recalculatedValues]=\"recalculated?.products\"\n    [logs]=\"logs\"\n  ></he-node-logs-models>\n</ng-container>\n\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    CyclesActivityLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesActivityLogsComponent, selector: "he-cycles-activity-logs", inputs: { original: "original", recalculated: "recalculated" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!loading; else loader\">\n  <div class=\"tabs mb-1\">\n    <ul>\n      <li [class.is-active]=\"selectedTab === Tab.inputs\">\n        <a (click)=\"selectedTab = Tab.inputs\">Inputs</a>\n      </li>\n      <li [class.is-active]=\"selectedTab === Tab.products\">\n        <a (click)=\"selectedTab = Tab.products\">Products</a>\n      </li>\n    </ul>\n  </div>\n\n  <he-node-logs-models [class.is-hidden]=\"selectedTab !== Tab.inputs\"\n    [logsUrl]=\"logsUrl\"\n    [nodeType]=\"NodeType.Cycle\"\n    [originalValues]=\"original?.inputs\"\n    [recalculatedValues]=\"recalculated?.inputs\"\n    [logs]=\"logs\"\n  ></he-node-logs-models>\n\n  <he-node-logs-models [class.is-hidden]=\"selectedTab !== Tab.products\"\n    [logsUrl]=\"logsUrl\"\n    [nodeType]=\"NodeType.Cycle\"\n    [originalValues]=\"original?.products\"\n    [recalculatedValues]=\"recalculated?.products\"\n    [logs]=\"logs\"\n  ></he-node-logs-models>\n</ng-container>\n\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesActivityLogsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5773,12 +5764,12 @@
                     type: i0.Input
                 }] } });
 
-    var orderBy$3 = require('lodash.orderby');
-    var View$3;
+    var orderBy$4 = require('lodash.orderby');
+    var View$4;
     (function (View) {
         View["table"] = "table";
         View["logs"] = "logs";
-    })(View$3 || (View$3 = {}));
+    })(View$4 || (View$4 = {}));
     var CyclesActivityComponent = /** @class */ (function () {
         function CyclesActivityComponent() {
             this.originalValues = [];
@@ -5787,8 +5778,8 @@
             this.baseUrl = baseUrl();
             this.propertyValue = propertyValue$1;
             this.showDownload = false;
-            this.View = View$3;
-            this.selectedView = View$3.table;
+            this.View = View$4;
+            this.selectedView = View$4.table;
             this.inputs = [];
             this.products = [];
         }
@@ -5797,7 +5788,7 @@
                 return this.update();
             }
             if ('dataState' in changes) {
-                this.selectedView = View$3.table;
+                this.selectedView = View$4.table;
             }
         };
         CyclesActivityComponent.prototype.trackById = function (_index, item) {
@@ -5812,9 +5803,9 @@
         });
         CyclesActivityComponent.prototype.update = function () {
             var inputsPerCycle = groupNodesByTerm(this.cycles, 'inputs', this.originalValues);
-            this.inputs = orderBy$3(grouppedKeys(inputsPerCycle), ['key'], ['asc']);
+            this.inputs = orderBy$4(grouppedKeys(inputsPerCycle), ['key'], ['asc']);
             var productsPerCycle = groupNodesByTerm(this.cycles, 'products', this.originalValues);
-            this.products = orderBy$3(grouppedKeys(productsPerCycle), ['key'], ['asc']);
+            this.products = orderBy$4(grouppedKeys(productsPerCycle), ['key'], ['asc']);
         };
         CyclesActivityComponent.prototype.togglePopover = function (popover, context) {
             return popover.isOpen() ? popover.close() : popover.open(context);
@@ -5833,7 +5824,7 @@
         return CyclesActivityComponent;
     }());
     CyclesActivityComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesActivityComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesActivityComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesActivityComponent, selector: "he-cycles-activity", inputs: { originalValues: "originalValues", cycles: "cycles", dataState: "dataState", enableCompare: "enableCompare" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"inputs.length || products.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && cycles.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"selectedView = View.logs\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\">\n      <table class=\"table is-narrow data-table has-children-{{inputs.length + products.length}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th></th>\n            <th *ngFor=\"let product of products\"\n              [attr.title]=\"product.value.term.name\"\n            >\n              <he-node-link [node]=\"product.value.term\">\n                <span>{{product.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n            <th *ngFor=\"let input of inputs\"\n              [attr.title]=\"input.value.term.name\"\n            >\n              <he-node-link [node]=\"input.value.term\">\n                <span>{{input.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th>\n              <a [href]=\"baseUrl + '/schema/Cycle#functionalUnit'\" target=\"_blank\">Functional unit</a>\n            </th>\n            <th *ngFor=\"let product of products\"\n              [attr.title]=\"product.value.term.units\"\n            >{{product.value.term.units}}</th>\n            <th *ngFor=\"let input of inputs\"\n              [attr.title]=\"input.value.term.units\"\n            >{{input.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let cycle of cycles; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"cycle.name\">\n              <he-node-link [node]=\"cycle\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{cycle.name || cycle.id}}</span>\n              </he-node-link>\n            </td>\n            <td>\n              <he-cycles-functional-unit-measure [cycle]=\"cycle\"></he-cycles-functional-unit-measure>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let product of products\">\n              <span *ngIf=\"product.value.values[cycle['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: product.value.values[cycle['@id']], cycle: cycle, key: 'products' })\"\n              >\n                <span pointer>{{propertyValue(product.value.values[cycle['@id']].value) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"product.value.values[cycle['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let input of inputs\">\n              <span *ngIf=\"input.value.values[cycle['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: input.value.values[cycle['@id']], cycle: cycle, key: 'inputs' })\"\n              >\n                <span pointer>{{propertyValue(input.value.values[cycle['@id']].value) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"input.value.values[cycle['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n\n    <he-cycles-suggest-form *ngIf=\"enableCompare\" [cycles]=\"cycles\" (cycleAdded)=\"addCycle($event)\"></he-cycles-suggest-form>\n  </div>\n\n  <he-cycles-activity-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [original]=\"originalValues[0]\"\n    [recalculated]=\"cycles[0]\"\n  ></he-cycles-activity-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"cycles\" filename=\"cycle-inputs-products.csv\" [isUpload]=\"false\"\n  [headerKeys]=\"['cycle.id', 'cycle.@id', 'cycle.inputs.', 'cycle.products.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No activity data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"cycle\" let-data=\"data\" let-key=\"key\">\n  <p><b>{{node.name}}</b></p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n", styles: ["fa-icon{display:inline-block;width:10px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: CyclesFunctionalUnitMeasureComponent, selector: "he-cycles-functional-unit-measure", inputs: ["cycle"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: CyclesSuggestFormComponent, selector: "he-cycles-suggest-form", inputs: ["cycles"], outputs: ["cycleAdded"] }, { type: CyclesActivityLogsComponent, selector: "he-cycles-activity-logs", inputs: ["original", "recalculated"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
+    CyclesActivityComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesActivityComponent, selector: "he-cycles-activity", inputs: { originalValues: "originalValues", cycles: "cycles", dataState: "dataState", enableCompare: "enableCompare" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"inputs.length || products.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && cycles.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"selectedView = View.logs\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\">\n      <table class=\"table is-narrow data-table has-children-{{inputs.length + products.length}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th></th>\n            <th *ngFor=\"let product of products\"\n              [attr.title]=\"product.value.term.name\"\n            >\n              <he-node-link [node]=\"product.value.term\">\n                <span>{{product.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n            <th *ngFor=\"let input of inputs\"\n              [attr.title]=\"input.value.term.name\"\n            >\n              <he-node-link [node]=\"input.value.term\">\n                <span>{{input.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th>\n              <a [href]=\"baseUrl + '/schema/Cycle#functionalUnit'\" target=\"_blank\">Functional unit</a>\n            </th>\n            <th *ngFor=\"let product of products\"\n              [attr.title]=\"product.value.term.units\"\n            >{{product.value.term.units}}</th>\n            <th *ngFor=\"let input of inputs\"\n              [attr.title]=\"input.value.term.units\"\n            >{{input.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let cycle of cycles; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"cycle.name\">\n              <he-node-link [node]=\"cycle\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{cycle.name || cycle.id}}</span>\n              </he-node-link>\n            </td>\n            <td>\n              <he-cycles-functional-unit-measure [cycle]=\"cycle\"></he-cycles-functional-unit-measure>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let product of products\">\n              <span *ngIf=\"product.value.values[cycle['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: product.value.values[cycle['@id']], cycle: cycle, key: 'products' })\"\n              >\n                <span pointer>{{propertyValue(product.value.values[cycle['@id']].value) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"product.value.values[cycle['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let input of inputs\">\n              <span *ngIf=\"input.value.values[cycle['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: input.value.values[cycle['@id']], cycle: cycle, key: 'inputs' })\"\n              >\n                <span pointer>{{propertyValue(input.value.values[cycle['@id']].value) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"input.value.values[cycle['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n\n    <he-cycles-suggest-form *ngIf=\"enableCompare\" [cycles]=\"cycles\" (cycleAdded)=\"addCycle($event)\"></he-cycles-suggest-form>\n  </div>\n\n  <he-cycles-activity-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [original]=\"originalValues[0]\"\n    [recalculated]=\"cycles[0]\"\n  ></he-cycles-activity-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"cycles\" filename=\"cycle-inputs-products.csv\" [isUpload]=\"false\"\n  [headerKeys]=\"['cycle.id', 'cycle.@id', 'cycle.inputs.', 'cycle.products.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No activity data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"cycle\" let-data=\"data\" let-key=\"key\">\n  <p><b>{{node.name}}</b></p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n", styles: ["fa-icon{display:inline-block;width:10px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: CyclesFunctionalUnitMeasureComponent, selector: "he-cycles-functional-unit-measure", inputs: ["cycle"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: CyclesSuggestFormComponent, selector: "he-cycles-suggest-form", inputs: ["cycles"], outputs: ["cycleAdded"] }, { type: CyclesActivityLogsComponent, selector: "he-cycles-activity-logs", inputs: ["original", "recalculated"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesActivityComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5875,7 +5866,7 @@
         return CyclesCompletenessComponent;
     }());
     CyclesCompletenessComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesCompletenessComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesCompletenessComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesCompletenessComponent, selector: "he-cycles-completeness", inputs: { cycles: "cycles", dataState: "dataState" }, ngImport: i0__namespace, template: "<div class=\"p-3\" *ngIf=\"cycles.length; else emptyTable\">\n  <div class=\"table-container data-table-container mb-1\">\n    <table class=\"table is-narrow data-table has-children-{{cycles.length}}\">\n      <thead>\n        <tr>\n          <th class=\"width-auto\"></th>\n          <th *ngFor=\"let completeness of completenessKeys\"\n            [attr.title]=\"completeness\"\n          ><a [href]=\"baseUrl + '/schema/Completeness#' + completeness\" target=\"_blank\">{{keyToLabel(completeness)}}</a></th>\n        </tr>\n      </thead>\n      <tbody>\n        <tr *ngFor=\"let cycle of cycles; trackBy: trackById; let i = index\">\n          <td class=\"width-auto\" [attr.title]=\"defaultLabel(cycle)\">\n            <he-node-link [node]=\"cycle\">\n              <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{defaultLabel(cycle)}}</span>\n            </he-node-link>\n          </td>\n          <td class=\"is-nowrap\" *ngFor=\"let completeness of completenessKeys\">\n            <span>{{cycle.dataCompleteness[completeness] ? 'Complete' : 'Incomplete'}}</span>\n            <he-blank-node-state class=\"ml-1\"\n              [node]=\"cycle.dataCompleteness\"\n              [key]=\"completeness\"\n            ></he-blank-node-state>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n  <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n</div>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No completeness data</span>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+    CyclesCompletenessComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesCompletenessComponent, selector: "he-cycles-completeness", inputs: { cycles: "cycles", dataState: "dataState" }, ngImport: i0__namespace, template: "<div class=\"p-3\" *ngIf=\"cycles.length; else emptyTable\">\n  <div class=\"table-container data-table-container mb-1\">\n    <table class=\"table is-narrow data-table has-children-{{cycles.length}}\">\n      <thead>\n        <tr>\n          <th class=\"width-auto\"></th>\n          <th *ngFor=\"let completeness of completenessKeys\"\n            [attr.title]=\"completeness\"\n          ><a [href]=\"baseUrl + '/schema/Completeness#' + completeness\" target=\"_blank\">{{keyToLabel(completeness)}}</a></th>\n        </tr>\n      </thead>\n      <tbody>\n        <tr *ngFor=\"let cycle of cycles; trackBy: trackById; let i = index\">\n          <td class=\"width-auto\" [attr.title]=\"defaultLabel(cycle)\">\n            <he-node-link [node]=\"cycle\">\n              <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{defaultLabel(cycle)}}</span>\n            </he-node-link>\n          </td>\n          <td class=\"is-nowrap\" *ngFor=\"let completeness of completenessKeys\">\n            <span>{{cycle.dataCompleteness[completeness] ? 'Complete' : 'Incomplete'}}</span>\n            <he-blank-node-state class=\"ml-1\"\n              [node]=\"cycle.dataCompleteness\"\n              [key]=\"completeness\"\n            ></he-blank-node-state>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n  <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n</div>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No completeness data</span>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesCompletenessComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5971,7 +5962,7 @@
         return CyclesEmissionsChartComponent;
     }());
     CyclesEmissionsChartComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesEmissionsChartComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesEmissionsChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesEmissionsChartComponent, selector: "he-cycles-emissions-chart", inputs: { cycles: "cycles" }, viewQueries: [{ propertyName: "chartRef", first: true, predicate: ["chart"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"p-3\" [class.is-hidden]=\"!terms?.length\">\n  <div class=\"field is-horizontal\">\n    <div class=\"field-label is-normal\">\n      <label class=\"label\" for=\"selectedTerm\">\n        <span>Select a column</span>\n      </label>\n    </div>\n    <div class=\"field-body\">\n      <div class=\"control\">\n        <div class=\"select is-small\">\n          <select (change)=\"updateChart()\" [(ngModel)]=\"selectedTerm\" id=\"selectedTerm\">\n            <option *ngFor=\"let term of terms\" [ngValue]=\"term\">{{term.name}}</option>\n          </select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"mt-1\">\n    <div class=\"chart-container\">\n      <canvas #chart></canvas>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:block;overflow:visible}.chart-container{height:400px;position:relative}\n"], directives: [{ type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
+    CyclesEmissionsChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesEmissionsChartComponent, selector: "he-cycles-emissions-chart", inputs: { cycles: "cycles" }, viewQueries: [{ propertyName: "chartRef", first: true, predicate: ["chart"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"p-3\" [class.is-hidden]=\"!terms?.length\">\n  <div class=\"field is-horizontal\">\n    <div class=\"field-label is-normal\">\n      <label class=\"label\" for=\"selectedTerm\">\n        <span>Select a column</span>\n      </label>\n    </div>\n    <div class=\"field-body\">\n      <div class=\"control\">\n        <div class=\"select is-small\">\n          <select (change)=\"updateChart()\" [(ngModel)]=\"selectedTerm\" id=\"selectedTerm\">\n            <option *ngFor=\"let term of terms\" [ngValue]=\"term\">{{term.name}}</option>\n          </select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"mt-1\">\n    <div class=\"chart-container\">\n      <canvas #chart></canvas>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:block;overflow:visible}.chart-container{height:400px;position:relative}\n"], directives: [{ type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesEmissionsChartComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5994,7 +5985,6 @@
             this.recalculatedValues = [];
             this.loading = true;
             this.NodeType = schema.NodeType;
-            this.models = [];
             this.emissions = [];
         }
         CyclesEmissionsLogsComponent.prototype.ngOnInit = function () {
@@ -6039,7 +6029,7 @@
         return CyclesEmissionsLogsComponent;
     }());
     CyclesEmissionsLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesEmissionsLogsComponent, deps: [{ token: HeSearchService }, { token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesEmissionsLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesEmissionsLogsComponent, selector: "he-cycles-emissions-logs", inputs: { cycle: "cycle", originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<he-node-logs-models *ngIf=\"!loading; else loader\"\n  [logsUrl]=\"logsUrl\"\n  [nodeType]=\"NodeType.Cycle\"\n  [originalValues]=\"originalValues\"\n  [recalculatedValues]=\"recalculatedValues\"\n  [terms]=\"emissions\"\n  [logs]=\"logs\"\n  filteredType=\"Emission\"\n></he-node-logs-models>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    CyclesEmissionsLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesEmissionsLogsComponent, selector: "he-cycles-emissions-logs", inputs: { cycle: "cycle", originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<he-node-logs-models *ngIf=\"!loading; else loader\"\n  [logsUrl]=\"logsUrl\"\n  [nodeType]=\"NodeType.Cycle\"\n  [originalValues]=\"originalValues\"\n  [recalculatedValues]=\"recalculatedValues\"\n  [terms]=\"emissions\"\n  [logs]=\"logs\"\n  filteredType=\"Emission\"\n></he-node-logs-models>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [":host{display:block}\n"], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesEmissionsLogsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -6055,13 +6045,13 @@
                     type: i0.Input
                 }] } });
 
-    var orderBy$2 = require('lodash.orderby');
-    var View$2;
+    var orderBy$3 = require('lodash.orderby');
+    var View$3;
     (function (View) {
         View["table"] = "table";
         View["chart"] = "chart";
         View["logs"] = "logs";
-    })(View$2 || (View$2 = {}));
+    })(View$3 || (View$3 = {}));
     var CyclesEmissionsComponent = /** @class */ (function () {
         function CyclesEmissionsComponent() {
             this.originalValues = [];
@@ -6071,8 +6061,8 @@
             this.propertyValue = propertyValue$1;
             this.itemColor = itemColor;
             this.showDownload = false;
-            this.View = View$2;
-            this.selectedView = View$2.table;
+            this.View = View$3;
+            this.selectedView = View$3.table;
             this.selectedCycles = [];
             this.emissions = [];
         }
@@ -6081,7 +6071,7 @@
                 return this.update();
             }
             if ('dataState' in changes) {
-                this.selectedView = View$2.table;
+                this.selectedView = View$3.table;
             }
         };
         CyclesEmissionsComponent.prototype.trackById = function (_index, item) {
@@ -6096,7 +6086,7 @@
         });
         CyclesEmissionsComponent.prototype.update = function () {
             var emissionsPerCycle = groupNodesByTerm(this.cycles, 'emissions', this.originalValues);
-            this.emissions = orderBy$2(grouppedKeys(emissionsPerCycle), ['value.methodTierOrder', 'key'], ['asc', 'asc']);
+            this.emissions = orderBy$3(grouppedKeys(emissionsPerCycle), ['value.methodTierOrder', 'key'], ['asc', 'asc']);
             this.selectAllCycles();
         };
         CyclesEmissionsComponent.prototype.togglePopover = function (popover, context) {
@@ -6142,7 +6132,7 @@
         return CyclesEmissionsComponent;
     }());
     CyclesEmissionsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesEmissionsComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CyclesEmissionsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesEmissionsComponent, selector: "he-cycles-emissions", inputs: { originalValues: "originalValues", cycles: "cycles", dataState: "dataState", enableCompare: "enableCompare" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"emissions.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"cycles.length > 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.chart\" (click)=\"selectedView = View.chart\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"chart-bar\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Chart view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && cycles.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"selectedView = View.logs\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\">\n      <table class=\"table is-narrow data-table has-children-{{emissions.length}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th></th>\n            <th *ngFor=\"let emission of emissions\"\n              [attr.title]=\"emission.value.term.name\"\n            >\n              <he-node-link [node]=\"emission.value.term\">\n                <span>{{emission.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th>\n              <a [href]=\"baseUrl + '/schema/Cycle#functionalUnit'\" target=\"_blank\">Functional unit</a>\n            </th>\n            <th *ngFor=\"let emission of emissions\"\n              [attr.title]=\"emission.value.term.units\"\n            >{{emission.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let cycle of cycles; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"cycle.name\" [style.border-left-color]=\"itemColor(i)\">\n              <label *ngIf=\"enableCompare\" class=\"is-inline-block checkbox\">\n                <input type=\"checkbox\" class=\"selector\"\n                  (change)=\"toggleCycle(cycle)\"\n                  [checked]=\"isSelected(cycle)\"\n                >\n              </label>\n              <he-node-link class=\"is-inline-block\" [node]=\"cycle\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{cycle.name || cycle.id}}</span>\n              </he-node-link>\n            </td>\n            <td>\n              <he-cycles-functional-unit-measure [cycle]=\"cycles[0]\"></he-cycles-functional-unit-measure>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let emission of emissions\">\n              <span *ngIf=\"emission.value.values[cycle['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: emission.value.values[cycle['@id']], cycle: cycle, key: 'emissions' })\"\n              >\n                <span pointer>{{propertyValue(emission.value.values[cycle['@id']].value) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"emission.value.values[cycle['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\" [showDeleted]=\"true\"></he-blank-node-state-notice>\n\n    <he-cycles-suggest-form *ngIf=\"enableCompare\" [cycles]=\"cycles\" (cycleAdded)=\"addCycle($event)\"></he-cycles-suggest-form>\n  </div>\n\n  <he-cycles-emissions-chart *ngIf=\"cycles.length > 1\" [class.is-hidden]=\"selectedView !== View.chart\"\n    [cycles]=\"selectedCycles\"\n  ></he-cycles-emissions-chart>\n\n  <he-cycles-emissions-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [cycle]=\"cycles[0]\"\n    [originalValues]=\"originalValues[0]?.emissions\"\n    [recalculatedValues]=\"cycles[0]?.emissions\"\n  ></he-cycles-emissions-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"cycles\" filename=\"cycle-emissions.csv\" [isUpload]=\"false\"\n  [headerKeys]=\"['cycle.id', 'cycle.@id', 'cycle.emissions.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"cycle\" let-data=\"data\" let-key=\"key\">\n  <p><b>{{node.name}}</b></p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n", styles: ["label.checkbox{width:20px}td he-node-link{width:160px}table.data-table td:first-child{border-left-width:8px}fa-icon{display:inline-block;width:10px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: CyclesFunctionalUnitMeasureComponent, selector: "he-cycles-functional-unit-measure", inputs: ["cycle"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: CyclesSuggestFormComponent, selector: "he-cycles-suggest-form", inputs: ["cycles"], outputs: ["cycleAdded"] }, { type: CyclesEmissionsChartComponent, selector: "he-cycles-emissions-chart", inputs: ["cycles"] }, { type: CyclesEmissionsLogsComponent, selector: "he-cycles-emissions-logs", inputs: ["cycle", "originalValues", "recalculatedValues"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
+    CyclesEmissionsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesEmissionsComponent, selector: "he-cycles-emissions", inputs: { originalValues: "originalValues", cycles: "cycles", dataState: "dataState", enableCompare: "enableCompare" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"emissions.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"cycles.length > 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.chart\" (click)=\"selectedView = View.chart\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"chart-bar\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Chart view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && cycles.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"selectedView = View.logs\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\">\n      <table class=\"table is-narrow data-table has-children-{{emissions.length}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th></th>\n            <th *ngFor=\"let emission of emissions\"\n              [attr.title]=\"emission.value.term.name\"\n            >\n              <he-node-link [node]=\"emission.value.term\">\n                <span>{{emission.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th>\n              <a [href]=\"baseUrl + '/schema/Cycle#functionalUnit'\" target=\"_blank\">Functional unit</a>\n            </th>\n            <th *ngFor=\"let emission of emissions\"\n              [attr.title]=\"emission.value.term.units\"\n            >{{emission.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let cycle of cycles; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"cycle.name\" [style.border-left-color]=\"itemColor(i)\">\n              <label *ngIf=\"enableCompare\" class=\"is-inline-block checkbox\">\n                <input type=\"checkbox\" class=\"selector\"\n                  (change)=\"toggleCycle(cycle)\"\n                  [checked]=\"isSelected(cycle)\"\n                >\n              </label>\n              <he-node-link [node]=\"cycle\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{cycle.name || cycle.id}}</span>\n              </he-node-link>\n            </td>\n            <td>\n              <he-cycles-functional-unit-measure [cycle]=\"cycles[0]\"></he-cycles-functional-unit-measure>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let emission of emissions\">\n              <span *ngIf=\"emission.value.values[cycle['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: emission.value.values[cycle['@id']], cycle: cycle, key: 'emissions' })\"\n              >\n                <span pointer>{{propertyValue(emission.value.values[cycle['@id']].value) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"emission.value.values[cycle['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\" [showDeleted]=\"true\"></he-blank-node-state-notice>\n\n    <he-cycles-suggest-form *ngIf=\"enableCompare\" [cycles]=\"cycles\" (cycleAdded)=\"addCycle($event)\"></he-cycles-suggest-form>\n  </div>\n\n  <he-cycles-emissions-chart *ngIf=\"cycles.length > 1\" [class.is-hidden]=\"selectedView !== View.chart\"\n    [cycles]=\"selectedCycles\"\n  ></he-cycles-emissions-chart>\n\n  <he-cycles-emissions-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [cycle]=\"cycles[0]\"\n    [originalValues]=\"originalValues[0]?.emissions\"\n    [recalculatedValues]=\"cycles[0]?.emissions\"\n  ></he-cycles-emissions-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"cycles\" filename=\"cycle-emissions.csv\" [isUpload]=\"false\"\n  [headerKeys]=\"['cycle.id', 'cycle.@id', 'cycle.emissions.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"cycle\" let-data=\"data\" let-key=\"key\">\n  <p><b>{{node.name}}</b></p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n", styles: ["label.checkbox{width:20px}td he-node-link{width:160px}table.data-table td:first-child{border-left-width:8px}fa-icon{display:inline-block;width:10px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: CyclesFunctionalUnitMeasureComponent, selector: "he-cycles-functional-unit-measure", inputs: ["cycle"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: CyclesSuggestFormComponent, selector: "he-cycles-suggest-form", inputs: ["cycles"], outputs: ["cycleAdded"] }, { type: CyclesEmissionsChartComponent, selector: "he-cycles-emissions-chart", inputs: ["cycles"] }, { type: CyclesEmissionsLogsComponent, selector: "he-cycles-emissions-logs", inputs: ["cycle", "originalValues", "recalculatedValues"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesEmissionsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -6160,6 +6150,162 @@
                     type: i0.Input
                 }] } });
 
+    var CyclesPracticesLogsComponent = /** @class */ (function () {
+        function CyclesPracticesLogsComponent(nodeService) {
+            this.nodeService = nodeService;
+            this.originalValues = [];
+            this.recalculatedValues = [];
+            this.loading = true;
+            this.NodeType = schema.NodeType;
+            this.models = [];
+        }
+        CyclesPracticesLogsComponent.prototype.ngOnInit = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var _a;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            this.logsUrl = this.nodeService.nodeLogsUrl(this.node);
+                            _a = this;
+                            return [4 /*yield*/, this.nodeService.getModelsLog(this.node)];
+                        case 1:
+                            _a.logs = _b.sent();
+                            this.loading = false;
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        Object.defineProperty(CyclesPracticesLogsComponent.prototype, "node", {
+            get: function () {
+                return Object.assign(Object.assign({}, this.cycle), { dataState: api.DataState.recalculated });
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return CyclesPracticesLogsComponent;
+    }());
+    CyclesPracticesLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesPracticesLogsComponent, deps: [{ token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    CyclesPracticesLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesPracticesLogsComponent, selector: "he-cycles-practices-logs", inputs: { cycle: "cycle", originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<he-node-logs-models *ngIf=\"!loading; else loader\"\n  [logsUrl]=\"logsUrl\"\n  [nodeType]=\"NodeType.Cycle\"\n  [originalValues]=\"originalValues\"\n  [recalculatedValues]=\"recalculatedValues\"\n  [logs]=\"logs\"\n></he-node-logs-models>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesPracticesLogsComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'he-cycles-practices-logs',
+                        templateUrl: './cycles-practices-logs.component.html',
+                        styleUrls: ['./cycles-practices-logs.component.scss']
+                    }]
+            }], ctorParameters: function () { return [{ type: HeNodeService }]; }, propDecorators: { cycle: [{
+                    type: i0.Input
+                }], originalValues: [{
+                    type: i0.Input
+                }], recalculatedValues: [{
+                    type: i0.Input
+                }] } });
+
+    var orderBy$2 = require('lodash.orderby');
+    var View$2;
+    (function (View) {
+        View["table"] = "table";
+        View["logs"] = "logs";
+    })(View$2 || (View$2 = {}));
+    var CyclesPracticesComponent = /** @class */ (function () {
+        function CyclesPracticesComponent() {
+            this.originalValues = [];
+            this.cycles = [];
+            this.enableCompare = true;
+            this.baseUrl = baseUrl();
+            this.propertyValue = propertyValue$1;
+            this.itemColor = itemColor;
+            this.showDownload = false;
+            this.View = View$2;
+            this.selectedView = View$2.table;
+            this.selectedCycles = [];
+            this.practices = [];
+        }
+        CyclesPracticesComponent.prototype.ngOnChanges = function (changes) {
+            if ('cycles' in changes) {
+                return this.update();
+            }
+            if ('dataState' in changes) {
+                this.selectedView = View$2.table;
+            }
+        };
+        CyclesPracticesComponent.prototype.trackById = function (_index, item) {
+            return item['@id'];
+        };
+        Object.defineProperty(CyclesPracticesComponent.prototype, "isOriginal", {
+            get: function () {
+                return this.dataState === api.DataState.original;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        CyclesPracticesComponent.prototype.update = function () {
+            var practicesPerCycle = groupNodesByTerm(this.cycles, 'practices', this.originalValues);
+            this.practices = orderBy$2(grouppedKeys(practicesPerCycle), ['key'], ['asc']);
+            this.selectAllCycles();
+        };
+        CyclesPracticesComponent.prototype.togglePopover = function (popover, context) {
+            return popover.isOpen() ? popover.close() : popover.open(context);
+        };
+        // Add from suggestion
+        CyclesPracticesComponent.prototype.addCycle = function (cycle) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    this.cycles = __spreadArray(__spreadArray([], __read(this.cycles)), [
+                        cycle
+                    ]);
+                    return [2 /*return*/, this.update()];
+                });
+            });
+        };
+        // Cycle selection
+        CyclesPracticesComponent.prototype.selectAllCycles = function () {
+            this.selectedCycles = this.cycles.slice();
+        };
+        CyclesPracticesComponent.prototype.unselectAllCycles = function () {
+            this.selectedCycles = [];
+        };
+        CyclesPracticesComponent.prototype.toggleAllCycles = function () {
+            return this.selectedCycles.length ? this.selectAllCycles() : this.unselectAllCycles();
+        };
+        CyclesPracticesComponent.prototype.selectCycle = function (cycle) {
+            this.selectedCycles = __spreadArray(__spreadArray([], __read(this.selectedCycles)), [
+                cycle
+            ]);
+        };
+        CyclesPracticesComponent.prototype.unselectCycle = function (index) {
+            this.selectedCycles.splice(index, 1);
+            this.selectedCycles = this.selectedCycles.slice();
+        };
+        CyclesPracticesComponent.prototype.toggleCycle = function (cycle) {
+            var index = this.selectedCycles.indexOf(cycle);
+            return index >= 0 ? this.unselectCycle(index) : this.selectCycle(cycle);
+        };
+        CyclesPracticesComponent.prototype.isSelected = function (cycle) {
+            return this.selectedCycles.includes(cycle);
+        };
+        return CyclesPracticesComponent;
+    }());
+    CyclesPracticesComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesPracticesComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    CyclesPracticesComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CyclesPracticesComponent, selector: "he-cycles-practices", inputs: { originalValues: "originalValues", cycles: "cycles", dataState: "dataState", enableCompare: "enableCompare" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"practices.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && cycles.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"selectedView = View.logs\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\">\n      <table class=\"table is-narrow data-table has-children-{{practices.length}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th></th>\n            <th *ngFor=\"let practice of practices\"\n              [attr.title]=\"practice.value.term.name\"\n            >\n              <he-node-link [node]=\"practice.value.term\">\n                <span>{{practice.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th>\n              <a [href]=\"baseUrl + '/schema/Cycle#functionalUnit'\" target=\"_blank\">Functional unit</a>\n            </th>\n            <th *ngFor=\"let practice of practices\"\n              [attr.title]=\"practice.value.term.units\"\n            >{{practice.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let cycle of cycles; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"cycle.name\" [style.border-left-color]=\"itemColor(i)\">\n              <label *ngIf=\"enableCompare\" class=\"is-inline-block checkbox\">\n                <input type=\"checkbox\" class=\"selector\"\n                  (change)=\"toggleCycle(cycle)\"\n                  [checked]=\"isSelected(cycle)\"\n                >\n              </label>\n              <he-node-link [node]=\"cycle\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{cycle.name || cycle.id}}</span>\n              </he-node-link>\n            </td>\n            <td>\n              <he-cycles-functional-unit-measure [cycle]=\"cycles[0]\"></he-cycles-functional-unit-measure>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let practice of practices\">\n              <span *ngIf=\"practice.value.values[cycle['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: practice.value.values[cycle['@id']], cycle: cycle, key: 'practices' })\"\n              >\n                <span pointer>{{propertyValue(practice.value.values[cycle['@id']].value) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"practice.value.values[cycle['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\" [showDeleted]=\"true\"></he-blank-node-state-notice>\n\n    <he-cycles-suggest-form *ngIf=\"enableCompare\" [cycles]=\"cycles\" (cycleAdded)=\"addCycle($event)\"></he-cycles-suggest-form>\n  </div>\n\n  <he-cycles-practices-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [cycle]=\"cycles[0]\"\n    [originalValues]=\"originalValues[0]?.practices\"\n    [recalculatedValues]=\"cycles[0]?.practices\"\n  ></he-cycles-practices-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"cycles\" filename=\"cycle-practices.csv\" [isUpload]=\"false\"\n  [headerKeys]=\"['cycle.id', 'cycle.@id', 'cycle.practices.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"cycle\" let-data=\"data\" let-key=\"key\">\n  <p><b>{{node.name}}</b></p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n", styles: [""], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: CyclesFunctionalUnitMeasureComponent, selector: "he-cycles-functional-unit-measure", inputs: ["cycle"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: CyclesSuggestFormComponent, selector: "he-cycles-suggest-form", inputs: ["cycles"], outputs: ["cycleAdded"] }, { type: CyclesPracticesLogsComponent, selector: "he-cycles-practices-logs", inputs: ["cycle", "originalValues", "recalculatedValues"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CyclesPracticesComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'he-cycles-practices',
+                        templateUrl: './cycles-practices.component.html',
+                        styleUrls: ['./cycles-practices.component.scss']
+                    }]
+            }], propDecorators: { originalValues: [{
+                    type: i0.Input
+                }], cycles: [{
+                    type: i0.Input
+                }], dataState: [{
+                    type: i0.Input
+                }], enableCompare: [{
+                    type: i0.Input
+                }] } });
+
     var CyclesResultComponent = /** @class */ (function () {
         function CyclesResultComponent() {
             this.cycles = [];
@@ -6267,6 +6413,8 @@
         CyclesEmissionsChartComponent,
         CyclesEmissionsLogsComponent,
         CyclesFunctionalUnitMeasureComponent,
+        CyclesPracticesComponent,
+        CyclesPracticesLogsComponent,
         CyclesResultComponent,
         CyclesSuggestFormComponent
     ];
@@ -6283,8 +6431,10 @@
             CyclesEmissionsChartComponent,
             CyclesEmissionsLogsComponent,
             CyclesFunctionalUnitMeasureComponent,
+            CyclesPracticesComponent,
+            CyclesPracticesLogsComponent,
             CyclesResultComponent,
-            CyclesSuggestFormComponent], imports: [i3.CommonModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
+            CyclesSuggestFormComponent], imports: [i6.CommonModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
             HeCommonModule,
             HeNodeModule], exports: [CyclesActivityComponent,
             CyclesActivityLogsComponent,
@@ -6293,10 +6443,12 @@
             CyclesEmissionsChartComponent,
             CyclesEmissionsLogsComponent,
             CyclesFunctionalUnitMeasureComponent,
+            CyclesPracticesComponent,
+            CyclesPracticesLogsComponent,
             CyclesResultComponent,
             CyclesSuggestFormComponent] });
     HeCyclesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeCyclesModule, imports: [[
-                i3.CommonModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
+                i6.CommonModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
                 HeCommonModule,
                 HeNodeModule
             ]] });
@@ -6306,7 +6458,7 @@
                         declarations: components$3,
                         exports: components$3,
                         imports: [
-                            i3.CommonModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
+                            i6.CommonModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
                             HeCommonModule,
                             HeNodeModule
                         ]
@@ -7160,16 +7312,17 @@
             prev[message].paths[label] = prev[message].paths[label] || [];
             prev[message].paths[label].push({ node: node, error: error, term: term });
             return prev;
-        }, {}), operators.mergeMap(function (data) { return rxjs.from(Object.keys(data)).pipe(operators.filter(function (message) { return !!message; }), operators.mergeMap(function (message) { return Object.keys(data[message].paths).map(function (path) {
+        }, {}), operators.mergeMap(function (data) { return rxjs.from(Object.keys(data)).pipe(operators.filter(function (message) { return !!message; }), operators.mergeMap(function (message) { return Object.entries(data[message].paths).map(function (_b) {
+            var _c = __read(_b, 2), path = _c[0], summaries = _c[1];
             var _a;
             return ({
                 level: data[message].level,
                 path: path,
                 message: message,
-                formattedMessage: (_a = formatError(data[message].paths[path][0].error, data[message].paths[path].length)) === null || _a === void 0 ? void 0 : _a.message,
-                terms: uniqueTerms(data[message].paths[path]).join(' ; '),
-                errors: data[message].paths[path],
-                count: data[message].paths[path].length,
+                formattedMessage: (_a = formatError(summaries[0].error, summaries.length)) === null || _a === void 0 ? void 0 : _a.message,
+                terms: uniqueTerms(summaries).join(' ; '),
+                errors: summaries,
+                count: summaries.length,
                 showErrors: summaryShowErrors(summaryData, { level: data[message].level, path: path, message: message })
             });
         }); }), operators.filter(function (_b) {
@@ -7395,7 +7548,7 @@
         return SitesMapsComponent;
     }());
     SitesMapsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SitesMapsComponent, deps: [{ token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    SitesMapsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SitesMapsComponent, selector: "he-sites-maps", inputs: { loadPolygons: "loadPolygons", sites: "sites", nodes: "nodes", center: "center", zoom: "zoom", showNotice: "showNotice" }, viewQueries: [{ propertyName: "map", first: true, predicate: i1$4.GoogleMap, descendants: true }], ngImport: i0__namespace, template: "<google-map *ngIf=\"googleLoaded\"\n  height=\"100%\"\n  width=\"100%\"\n  [zoom]=\"zoom\"\n  [center]=\"center\"\n></google-map>\n\n<p *ngIf=\"showNotice\" class=\"mt-2 is-italic is-size-7\">The information provided might not be complete</p>\n\n<div class=\"no-location has-text-center has-text-light\" *ngIf=\"showNoLocation\">\n  <span>No precise location data</span>\n</div>\n", styles: [":host{display:block;height:100%;position:relative;width:100%}.no-location{background-color:#0000004d;left:0;height:100%;position:absolute;top:0;width:100%;z-index:9}.no-location>span{display:inline-block;margin-top:12%}\n"], components: [{ type: i1__namespace$3.GoogleMap, selector: "google-map", inputs: ["height", "width", "center", "zoom", "options", "mapTypeId"], outputs: ["authFailure", "boundsChanged", "centerChanged", "mapClick", "mapDblclick", "mapDrag", "mapDragend", "mapDragstart", "headingChanged", "idle", "maptypeidChanged", "mapMousemove", "mapMouseout", "mapMouseover", "projectionChanged", "mapRightclick", "tilesloaded", "tiltChanged", "zoomChanged"], exportAs: ["googleMap"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    SitesMapsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SitesMapsComponent, selector: "he-sites-maps", inputs: { loadPolygons: "loadPolygons", sites: "sites", nodes: "nodes", center: "center", zoom: "zoom", showNotice: "showNotice" }, viewQueries: [{ propertyName: "map", first: true, predicate: i1$4.GoogleMap, descendants: true }], ngImport: i0__namespace, template: "<google-map *ngIf=\"googleLoaded\"\n  height=\"100%\"\n  width=\"100%\"\n  [zoom]=\"zoom\"\n  [center]=\"center\"\n></google-map>\n\n<p *ngIf=\"showNotice\" class=\"mt-2 is-italic is-size-7\">The information provided might not be complete</p>\n\n<div class=\"no-location has-text-center has-text-light\" *ngIf=\"showNoLocation\">\n  <span>No precise location data</span>\n</div>\n", styles: [":host{display:block;height:100%;position:relative;width:100%}.no-location{background-color:#0000004d;left:0;height:100%;position:absolute;top:0;width:100%;z-index:9}.no-location>span{display:inline-block;margin-top:12%}\n"], components: [{ type: i1__namespace$3.GoogleMap, selector: "google-map", inputs: ["height", "width", "center", "zoom", "options", "mapTypeId"], outputs: ["authFailure", "boundsChanged", "centerChanged", "mapClick", "mapDblclick", "mapDrag", "mapDragend", "mapDragstart", "headingChanged", "idle", "maptypeidChanged", "mapMousemove", "mapMouseout", "mapMouseover", "projectionChanged", "mapRightclick", "tilesloaded", "tiltChanged", "zoomChanged"], exportAs: ["googleMap"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SitesMapsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -7491,7 +7644,7 @@
         return SitesMeasurementsLogsComponent;
     }());
     SitesMeasurementsLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SitesMeasurementsLogsComponent, deps: [{ token: HeSearchService }, { token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    SitesMeasurementsLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SitesMeasurementsLogsComponent, selector: "he-sites-measurements-logs", inputs: { site: "site", originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<he-node-logs-models *ngIf=\"!loading; else loader\"\n  [logsUrl]=\"logsUrl\"\n  [nodeType]=\"NodeType.Site\"\n  [originalValues]=\"originalValues\"\n  [recalculatedValues]=\"recalculatedValues\"\n  [terms]=\"measurements\"\n  [logs]=\"logs\"\n  filteredType=\"Measurement\"\n></he-node-logs-models>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    SitesMeasurementsLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SitesMeasurementsLogsComponent, selector: "he-sites-measurements-logs", inputs: { site: "site", originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<he-node-logs-models *ngIf=\"!loading; else loader\"\n  [logsUrl]=\"logsUrl\"\n  [nodeType]=\"NodeType.Site\"\n  [originalValues]=\"originalValues\"\n  [recalculatedValues]=\"recalculatedValues\"\n  [terms]=\"measurements\"\n  [logs]=\"logs\"\n  filteredType=\"Measurement\"\n></he-node-logs-models>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SitesMeasurementsLogsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -7561,7 +7714,7 @@
         return SitesMeasurementsComponent;
     }());
     SitesMeasurementsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SitesMeasurementsComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    SitesMeasurementsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SitesMeasurementsComponent, selector: "he-sites-measurements", inputs: { originalValues: "originalValues", sites: "sites", dataState: "dataState" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"measurements.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && sites.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"selectedView = View.logs\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\">\n      <table class=\"table is-narrow data-table has-children-{{measurements.length}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th *ngFor=\"let measurement of measurements\"\n              [attr.title]=\"measurement.value.term.name\"\n            >\n              <he-node-link [node]=\"measurement.value.term\">\n                <span>{{measurement.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th *ngFor=\"let measurement of measurements\"\n              [attr.title]=\"measurement.value.term.units\"\n            >{{measurement.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let site of sites; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"defaultLabel(site)\">\n              <he-node-link [node]=\"site\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{defaultLabel(site)}}</span>\n              </he-node-link>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let measurement of measurements\">\n              <span *ngIf=\"measurement.value.values[site['@id']]\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: measurement.value.values[site['@id']], site: site, key: 'measurements' })\"\n              >\n                <span pointer>{{measurementValue(measurement.value.values[site['@id']]) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"measurement.value.values[site['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n              <span *ngIf=\"!measurement.value.values[site['@id']]\">\n                <span>-</span>\n                <sup class=\"pl-1\" *ngIf=\"siteTooBig(site)\">(1)</sup>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n\n    <p class=\"is-size-7 is-italic\" *ngIf=\"showAreaTooBig\">\n      (1) This region is >{{maxAreaSize}}km2 and is too large to reliably gap fill Measurements.\n    </p>\n  </div>\n\n  <he-sites-measurements-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [site]=\"sites[0]\"\n    [originalValues]=\"originalValues[0].measurements\"\n    [recalculatedValues]=\"sites[0].measurements\"\n  ></he-sites-measurements-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"sites\" filename=\"site-measurements.csv\" [isUpload]=\"false\"\n  [headerKeys]=\"['site.id', 'site.@id', 'site.measurements.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"site\" let-data=\"data\" let-key=\"key\">\n  <p><b>{{node.name}}</b></p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n", styles: ["fa-icon{display:inline-block;width:10px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: SitesMeasurementsLogsComponent, selector: "he-sites-measurements-logs", inputs: ["site", "originalValues", "recalculatedValues"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
+    SitesMeasurementsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SitesMeasurementsComponent, selector: "he-sites-measurements", inputs: { originalValues: "originalValues", sites: "sites", dataState: "dataState" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"measurements.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && sites.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"selectedView = View.logs\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\">\n      <table class=\"table is-narrow data-table has-children-{{measurements.length}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th *ngFor=\"let measurement of measurements\"\n              [attr.title]=\"measurement.value.term.name\"\n            >\n              <he-node-link [node]=\"measurement.value.term\">\n                <span>{{measurement.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\"></th>\n            <th *ngFor=\"let measurement of measurements\"\n              [attr.title]=\"measurement.value.term.units\"\n            >{{measurement.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let site of sites; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"defaultLabel(site)\">\n              <he-node-link [node]=\"site\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{defaultLabel(site)}}</span>\n              </he-node-link>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let measurement of measurements\">\n              <span *ngIf=\"measurement.value.values[site['@id']]\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: measurement.value.values[site['@id']], site: site, key: 'measurements' })\"\n              >\n                <span pointer>{{measurementValue(measurement.value.values[site['@id']]) | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"measurement.value.values[site['@id']].nodes[0]\"\n                  key=\"value\"\n                ></he-blank-node-state>\n              </span>\n              <span *ngIf=\"!measurement.value.values[site['@id']]\">\n                <span>-</span>\n                <sup class=\"pl-1\" *ngIf=\"siteTooBig(site)\">(1)</sup>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n\n    <p class=\"is-size-7 is-italic\" *ngIf=\"showAreaTooBig\">\n      (1) This region is >{{maxAreaSize}}km2 and is too large to reliably gap fill Measurements.\n    </p>\n  </div>\n\n  <he-sites-measurements-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [site]=\"sites[0]\"\n    [originalValues]=\"originalValues[0].measurements\"\n    [recalculatedValues]=\"sites[0].measurements\"\n  ></he-sites-measurements-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"sites\" filename=\"site-measurements.csv\" [isUpload]=\"false\"\n  [headerKeys]=\"['site.id', 'site.@id', 'site.measurements.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"site\" let-data=\"data\" let-key=\"key\">\n  <p><b>{{node.name}}</b></p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n", styles: ["fa-icon{display:inline-block;width:10px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: SitesMeasurementsLogsComponent, selector: "he-sites-measurements-logs", inputs: ["site", "originalValues", "recalculatedValues"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SitesMeasurementsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -7590,13 +7743,13 @@
     HeSitesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeSitesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
     HeSitesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeSitesModule, declarations: [SitesMapsComponent,
             SitesMeasurementsComponent,
-            SitesMeasurementsLogsComponent], imports: [i3.CommonModule, i1$2.ReactiveFormsModule,
+            SitesMeasurementsLogsComponent], imports: [i6.CommonModule, i1$2.ReactiveFormsModule,
             HeCommonModule,
             HeNodeModule], exports: [SitesMapsComponent,
             SitesMeasurementsComponent,
             SitesMeasurementsLogsComponent] });
     HeSitesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeSitesModule, imports: [[
-                i3.CommonModule, i1$2.ReactiveFormsModule,
+                i6.CommonModule, i1$2.ReactiveFormsModule,
                 HeCommonModule,
                 HeNodeModule
             ]] });
@@ -7606,7 +7759,7 @@
                         declarations: components$2,
                         exports: components$2,
                         imports: [
-                            i3.CommonModule, i1$2.ReactiveFormsModule,
+                            i6.CommonModule, i1$2.ReactiveFormsModule,
                             HeCommonModule,
                             HeNodeModule
                         ]
@@ -7889,8 +8042,8 @@
         };
         FilesFormComponent.prototype.moveArrayGroupToPosition = function (array, currentIndex, newIndex) {
             var value = __spreadArray([], __read(get(this.node, array.fullKey)));
-            i6.moveItemInArray(value, currentIndex, newIndex);
-            i6.moveItemInArray(array.properties, currentIndex, newIndex);
+            i6$1.moveItemInArray(value, currentIndex, newIndex);
+            i6$1.moveItemInArray(array.properties, currentIndex, newIndex);
             // need to change key on every properties recursively
             refreshPropertyKeys(array);
             this.nodeChange.emit({ key: array.fullKey, value: value });
@@ -8049,7 +8202,7 @@
         return FilesFormComponent;
     }());
     FilesFormComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FilesFormComponent, deps: [{ token: i0__namespace.ElementRef }, { token: HeSearchService }, { token: HeUsersService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FilesFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilesFormComponent, selector: "he-files-form", inputs: { schemas: "schemas", errors: "errors", node: "node", nodeMap: "nodeMap", editable: "editable", errorMode: "errorMode", deepEditable: "deepEditable", errorsEditable: "errorsEditable" }, outputs: { nodeChange: "nodeChange", nodeErorrResolved: "nodeErorrResolved", nodeErrorAdded: "nodeErrorAdded" }, ngImport: i0__namespace, template: "<div class=\"card\">\n  <div class=\"card-toggle p-4\" (click)=\"isOpen = !isOpen\" pointer>\n    <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!isOpen\"></fa-icon>\n    <fa-icon icon=\"angle-right\" [class.is-hidden]=\"isOpen\"></fa-icon>\n    <span *ngIf=\"nodeProperty\" class=\"is-px-2\"\n      [class.has-text-danger]=\"nodeProperty.hasError\"\n      [class.has-text-warning]=\"nodeProperty.hasWarning\"\n    >\n      <he-node-icon [type]=\"nodeProperty.schemaType\"></he-node-icon>\n    </span>\n  </div>\n\n  <ng-container *ngIf=\"editable && isOpen && nodeProperty\">\n    <ng-container *ngTemplateOutlet=\"showNewProperty; context: {$implicit: nodeProperty}\"></ng-container>\n  </ng-container>\n\n  <div class=\"card-content\">\n    <ng-container *ngIf=\"isOpen\">\n      <div class=\"pb-3 mb-2\" *ngIf=\"errorsEditable\">\n        <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: nodeProperty}\"></ng-container>\n      </div>\n\n      <div class=\"mb-4\" *ngIf=\"nodeProperty?.error\">\n        <ng-container *ngTemplateOutlet=\"propertyError; context: {property: nodeProperty, edit: true}\"></ng-container>\n      </div>\n    </ng-container>\n\n    <div class=\"columns is-multiline\">\n      <ng-container *ngFor=\"let property of properties; trackBy: trackByProperty\">\n        <ng-container *ngTemplateOutlet=\"showProperty; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n    </div>\n\n    <ng-container *ngIf=\"isOpen\">\n      <ng-container *ngTemplateOutlet=\"propertyMap; context: {$implicit: nodeProperty}\"></ng-container>\n    </ng-container>\n  </div>\n</div>\n\n<he-maps-drawing-confirm *ngIf=\"!!mapDrawingProperty\"\n  [value]=\"mapDrawingProperty.value\" [modes]=\"mapDrawingModes(mapDrawingProperty)\"\n  (closed)=\"onMapDrawingClosed($event)\"\n></he-maps-drawing-confirm>\n\n<he-bibliographies-search-confirm *ngIf=\"!!bibliographiesSearchProperty\"\n  [search]=\"bibliographiesSearchProperty.value\"\n  [searchBy]=\"bibliographiesSearchKey(bibliographiesSearchProperty)\"\n  [searchSources]=\"bibliographiesSearchSources\"\n  (closed)=\"onBibliographiesSearchClosed($event)\"\n></he-bibliographies-search-confirm>\n\n<ng-template #labelDescription let-property>\n  <span\n    class=\"trigger-popover\"\n    [ngbPopover]=\"property.schema?.description\" [autoClose]=\"'outside'\"\n    triggers=\"hover\" placement=\"right\" container=\"body\"\n  >\n    <span>{{property.key}}</span>\n  </span>\n</ng-template>\n\n<ng-template #labelDefault let-property>\n  <span>{{property.key}}</span>\n</ng-template>\n\n<ng-template #showProperty let-property>\n  <ng-container *ngIf=\"(isOpen || property.closedVisible) && !property.isHidden\">\n    <div class=\"column is-6\"\n      [id]=\"property.fullKey + '_' + property.id\"\n      [class.is-12]=\"property.properties.length || !property.key\"\n      [ngSwitch]=\"!!property.properties.length\"\n    >\n      <div class=\"columns is-multiline is-variable is-1\" *ngSwitchCase=\"false\">\n        <div class=\"column is-3 py-1\" *ngIf=\"property.key\">\n          <label class=\"label has-text-right-tablet has-text-ellipsis\"\n            *bindOnce=\"property\"\n            [for]=\"property.id\"\n          >\n            <ng-container\n              *ngTemplateOutlet=\"property.schema?.description && editable && property.editable ? labelDescription : labelDefault; context: {$implicit: property}\">\n            </ng-container>\n          </label>\n        </div>\n\n        <div class=\"column is-9 py-1\" [class.is-12]=\"!property.key\">\n          <div class=\"field\">\n            <ng-container *ngTemplateOutlet=\"inputForm; context: {$implicit: property}\"></ng-container>\n\n            <ng-container *ngIf=\"(editable || errorsEditable) && (property.hasError || property.hasWarning)\">\n              <ng-container *ngTemplateOutlet=\"propertyError; context: {property: property, edit: false}\"></ng-container>\n            </ng-container>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"panel\" *ngSwitchCase=\"true\"\n        [class.is-link]=\"errorMode && property.changed\"\n        [class.is-danger]=\"!property.changed && property.hasError\"\n        [class.is-warning]=\"!property.changed && property.hasWarning\"\n        [class.is-default]=\"!property.changed && !property.hasError && !property.hasWarning\"\n      >\n        <div class=\"open-group panel-heading py-0\"\n          (click)=\"property.isOpen = !property.isOpen\" pointer\n          [class.is-open]=\"property.isOpen\"\n          [class.has-text-white]=\"(errorMode && property.changed) || property.hasError || property.hasWarning\"\n        >\n          <div class=\"columns is-mobile is-vcentered\">\n            <span class=\"column is-narrow py-1 my-0\">\n              <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!property.isOpen\"></fa-icon>\n              <fa-icon icon=\"angle-right\" [class.is-hidden]=\"property.isOpen\"></fa-icon>\n            </span>\n            <span class=\"column py-1 my-0\">\n              <span class=\"is-size-6\">{{property.key}}</span>\n            </span>\n            <span *ngIf=\"property.schemaType\" class=\"column is-narrow py-1 my-0\">\n              <span class=\"tags mb-0 has-addons\">\n                <span class=\"tag mb-0 is-light\">Type</span>\n                <span class=\"tag mb-0 is-white\">\n                  <he-schema-version-link linkClass=\"is-small\" [node]=\"{'@type': property.schemaType}\">\n                    <span>{{property.schemaType}}</span>\n                  </he-schema-version-link>\n                </span>\n              </span>\n            </span>\n            <he-popover-confirm class=\"column is-narrow py-1 my-0 px-0\"\n              *ngIf=\"editable && !errorsEditable\"\n              ngbTooltip=\"Remove group\" placement=\"top\"\n              [message]=\"'<p>This will remove the group completely.</p>' + (property.isRequired ? '<p><u>Warning: this field is required.</u></p>' : '') + '<p>Do you confirm?</p>'\"\n              popoverClass=\"px-3\"\n              (confirmed)=\"propertyChanged(null, property)\"\n            >\n              <fa-icon icon=\"times\" size=\"sm\"></fa-icon>\n            </he-popover-confirm>\n          </div>\n        </div>\n        <div class=\"panel-block is-block p-0\" *ngIf=\"property.isOpen\">\n          <ng-container [ngSwitch]=\"property.isArray\">\n            <div class=\"px-3 pt-4\" *ngIf=\"property.error\">\n              <ng-container *ngTemplateOutlet=\"propertyError; context: {property: property, edit: true}\"></ng-container>\n            </div>\n\n            <div class=\"mt-3\" *ngSwitchCase=\"false\">\n              <p class=\"help py-1 px-2\" *ngIf=\"editable && !property.editable\">\n                To change the {{property.key}}, please delete it first, then add the field again\n              </p>\n              <ng-container *ngIf=\"editable && property.editable\">\n                <ng-container [ngSwitch]=\"property.schema?.title\">\n                  <p class=\"help py-1 px-2\" *ngSwitchCase=\"'Bibliography'\">\n                    Search by Title or Document DOI to auto-populate the fields using the Mendeley catalogue\n                  </p>\n                </ng-container>\n              </ng-container>\n\n              <ng-container *ngTemplateOutlet=\"showNewProperty; context: {$implicit: property}\"></ng-container>\n\n              <div class=\"px-3 mt-1\" *ngIf=\"errorsEditable\">\n                <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: property}\"></ng-container>\n              </div>\n\n              <div class=\"property-group py-2 px-3 mt-2\">\n                <div class=\"columns is-multiline mb-0\">\n                  <ng-container *ngFor=\"let prop2 of property.properties; trackBy: trackByProperty\">\n                    <ng-container *ngTemplateOutlet=\"showProperty; context: {$implicit: prop2}\"></ng-container>\n                  </ng-container>\n                </div>\n              </div>\n            </div>\n\n            <div class=\"py-2 px-3 mt-2\" *ngSwitchCase=\"true\">\n              <div class=\"mt-1\" *ngIf=\"errorsEditable\">\n                <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: property}\"></ng-container>\n              </div>\n\n              <ng-container *ngFor=\"let prop2 of property.properties; trackBy: trackByProperty\">\n                <div class=\"card p-0 my-4\" *ngIf=\"prop2.key\"\n                  [id]=\"prop2.fullKey + '_' + prop2.id\"\n                >\n                  <div class=\"property-array-number\">\n                    <div class=\"tags has-addons\">\n                      <span class=\"tag is-dark\">{{prop2.key}}</span>\n                      <ng-container *ngIf=\"editable && !errorsEditable && property.editable\">\n                        <span class=\"tag is-info\" pointer\n                          (click)=\"duplicateArrayGroup(property, prop2)\"\n                          [ngbTooltip]=\"'Duplicate ' + pluralize(property.key, 1)\" placement=\"top\"\n                        >\n                          <fa-icon icon=\"clone\" size=\"sm\"></fa-icon>\n                        </span>\n                        <span class=\"tag is-light\" pointer\n                          *ngIf=\"prop2.key !== '0'\"\n                          (click)=\"moveArrayGroupUp(property, prop2)\"\n                          ngbTooltip=\"Move Up\" placement=\"top\"\n                        >\n                          <fa-icon icon=\"long-arrow-alt-up\" size=\"sm\"></fa-icon>\n                        </span>\n                        <span class=\"tag is-light\" pointer\n                          *ngIf=\"prop2.key !== property.properties.length - 1\"\n                          (click)=\"moveArrayGroupDown(property, prop2)\"\n                          ngbTooltip=\"Move Down\" placement=\"top\"\n                        >\n                          <fa-icon icon=\"long-arrow-alt-down\" size=\"sm\"></fa-icon>\n                        </span>\n                        <he-popover-confirm class=\"tag is-delete\"\n                          [ngbTooltip]=\"'Remove ' + pluralize(property.key, 1)\" placement=\"top\"\n                          message=\"This will remove the group completely. Do you confirm?\" position=\"right\"\n                          (confirmed)=\"removeArrayGroup(property, prop2)\"\n                        ></he-popover-confirm>\n                      </ng-container>\n                    </div>\n                  </div>\n\n                  <ng-container *ngTemplateOutlet=\"showNewProperty; context: {$implicit: prop2}\"></ng-container>\n\n                  <div class=\"px-4 mt-2\" *ngIf=\"errorsEditable\">\n                    <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: prop2}\"></ng-container>\n                  </div>\n\n                  <div class=\"px-4 mt-2\" *ngIf=\"prop2.error\">\n                    <ng-container *ngTemplateOutlet=\"propertyError; context: {property: prop2, edit: true}\"></ng-container>\n                  </div>\n\n                  <div class=\"property-group card-content p-3\">\n                    <div class=\"columns is-multiline my-0\">\n                      <ng-container *ngFor=\"let prop3 of prop2.properties; trackBy: trackByProperty\">\n                        <ng-container *ngTemplateOutlet=\"showProperty; context: {$implicit: prop3}\"></ng-container>\n                      </ng-container>\n                    </div>\n                  </div>\n                </div>\n              </ng-container>\n\n              <button class=\"button is-dark is-outlined is-small\" type=\"button\"\n                *ngIf=\"editable && !errorsEditable\"\n                (click)=\"addArrayGroup(property)\"\n              >\n                <fa-icon icon=\"plus-circle\"></fa-icon>\n                <span class=\"pl-2\">Add</span>\n                <span class=\"pl-1\">{{property.key | pluralize:1}}</span>\n              </button>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #inputForm let-property>\n  <ng-container *ngIf=\"property.key\">\n    <ng-container [ngSwitch]=\"property.suggestions?.type\">\n      <ng-container *ngSwitchCase=\"'select'\">\n        <ng-container *ngTemplateOutlet=\"inputSelect; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n      <ng-container *ngSwitchDefault>\n        <ng-container *ngTemplateOutlet=\"inputInput; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template #inputInput let-property>\n  <div class=\"field mb-0\" [class.has-addons]=\"hasAddons(property)\">\n    <div class=\"control is-expanded\"\n      [class.has-icons-right]=\"property.loading\"\n    >\n      <input class=\"input is-small search-input\"\n        [class.is-dark]=\"property.key === 'type'\"\n        [class.is-link]=\"errorMode && property.changed\"\n        [class.is-danger]=\"(!property.changed && property.hasError) || isRequired(property)\"\n        [class.is-warning]=\"!property.changed && property.hasWarning\"\n\n        [(ngModel)]=\"property.value\" #propertyModel=\"ngModel\"\n        [type]=\"property.schema?.type === 'number' ? 'number' : 'string'\"\n        [id]=\"property.id\"\n        name=\"randomname\"\n        [readonly]=\"!editable || !property.editable || property.schema?.internal\"\n        [placeholder]=\"property.placeholder\"\n        [appTagsInput]=\"{enabled: editable && property.editable && property.schema?.type === 'array', items: property.schema?.items, delimiter: ';', allowDuplicates: true, placeholder: property.placeholder}\"\n        (change)=\"propertyChanged($event.target.value, property)\"\n\n        [pattern]=\"property.schema?.pattern\"\n        [required]=\"property.fullKey.endsWith('id') && property.fullKey !== 'id'\"\n        [min]=\"property.schema?.minimum\"\n        [max]=\"property.schema?.maximum\"\n\n        [ngbTypeahead]=\"propertySuggest(property.fullKey, property.suggestions?.type)\"\n        [resultTemplate]=\"suggestion\"\n        [inputFormatter]=\"formatter\"\n        [focusFirst]=\"true\"\n        (focus)=\"editable && property.editable && typeaheadFocus($event)\"\n        (selectItem)=\"suggestionSelected($event.item, property)\"\n      >\n\n      <span class=\"icon is-small is-right has-text-grey-dark\" [class.is-hidden]=\"!property.loading\">\n        <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"sm\"></fa-icon>\n      </span>\n    </div>\n    <ng-container *ngTemplateOutlet=\"inputAddons; context: {$implicit: property}\"></ng-container>\n  </div>\n  <p class=\"help is-danger-light\"\n    *ngIf=\"!property.hasError && propertyModel.invalid\"\n  >\n    <span *bindOnce=\"propertyModel.errors\" [innerHTML]=\"formatPropertyError(propertyModel.errors, property)\"></span>\n  </p>\n</ng-template>\n\n<ng-template #inputSelect let-property>\n  <div class=\"field mb-0\" [class.has-addons]=\"hasAddons(property)\">\n    <div class=\"control is-expanded\">\n      <div class=\"select is-small is-fullwidth\"\n        [class.is-link]=\"errorMode && property.changed\"\n        [class.is-danger]=\"(!property.changed && property.hasError) || isRequired(property)\"\n        [class.is-warning]=\"!property.changed && property.hasWarning\"\n      >\n        <select\n          [(ngModel)]=\"property.value\" #propertyModel=\"ngModel\"\n          [id]=\"property.id\"\n          name=\"randomname\"\n          [disabled]=\"!editable || !property.editable || property.schema?.internal\"\n          (change)=\"propertyChanged($event.target.value, property)\"\n        >\n          <option value=\"\">Select</option>\n          <ng-container *bindOnce=\"property.suggestions\">\n            <option *ngFor=\"let value of property.suggestions.values; trackBy: trackByIndex\" [value]=\"value\">{{value}}</option>\n          </ng-container>\n        </select>\n      </div>\n    </div>\n    <ng-container *ngTemplateOutlet=\"inputAddons; context: {$implicit: property}\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #removeFieldAddon let-property>\n  <div class=\"control\" *ngIf=\"!errorsEditable && !property.isRequired\">\n    <a class=\"button is-small\" title=\"Remove field\"\n      [class.is-outlined]=\"!property.changed && (property.hasError || property.hasWarning)\"\n      [class.is-danger]=\"!property.changed && property.hasError\"\n      [class.is-warning]=\"!property.changed && property.hasWarning\"\n      (click)=\"$event.stopPropagation(); propertyChanged(null, property)\"\n    >\n      <fa-icon icon=\"times\"></fa-icon>\n    </a>\n  </div>\n</ng-template>\n\n<ng-template #inputAddons let-property>\n  <he-popover-confirm class=\"control\"\n    *ngIf=\"enableAddError(property)\"\n    position=\"left\"\n    [content]=\"popupErrorForm\"\n    (confirmed)=\"addError(property, $event)\"\n  >\n    <span class=\"button is-small\">\n      <fa-icon icon=\"comments\"></fa-icon>\n    </span>\n  </he-popover-confirm>\n\n  <ng-container *ngIf=\"editable && property.editable\">\n    <ng-container [ngSwitch]=\"property.schemaType\">\n      <ng-container *ngSwitchCase=\"SchemaType.Actor\">\n        <ng-container *ngTemplateOutlet=\"actorAddons; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"SchemaType.Cycle\">\n        <ng-container *ngTemplateOutlet=\"cycleAddons; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n    </ng-container>\n    <ng-container *bindOnce=\"property\">\n      <div class=\"control\" *ngIf=\"mapDrawingModes(property).length\">\n        <button class=\"button is-small\" title=\"Pick on Map\"\n          (click)=\"mapDrawingProperty = property\"\n        >\n          <fa-icon icon=\"map-marked-alt\"></fa-icon>\n        </button>\n      </div>\n      <div class=\"control\" *ngIf=\"bibliographiesSearchKey(property)\">\n        <button class=\"button is-small\" title=\"Advanced Search\"\n          (click)=\"bibliographiesSearchProperty = property\"\n        >\n          <fa-icon icon=\"search\"></fa-icon>\n        </button>\n      </div>\n    </ng-container>\n\n    <ng-container *ngTemplateOutlet=\"removeFieldAddon; context: {$implicit: property}\"></ng-container>\n  </ng-container>\n  <div class=\"control\" *ngIf=\"addPropertyEnabled(property)\">\n    <a class=\"button is-small is-danger\" title=\"Add field\"\n      (click)=\"$event.stopPropagation(); addMissingProperty(property)\"\n    >\n      <fa-icon icon=\"plus-circle\"></fa-icon>\n      <span class=\"pl-2\">Add</span>\n    </a>\n  </div>\n  <div class=\"control\" *ngIf=\"isRequired(property)\">\n    <label class=\"button is-small is-danger\" [for]=\"property.id\"\n      ngbTooltip=\"This field is required\" placement=\"top\"\n    >\n      <fa-icon icon=\"exclamation-triangle\"></fa-icon>\n    </label>\n  </div>\n  <ng-container *ngIf=\"property.externalUrl?.url\">\n    <div class=\"control\">\n      <a class=\"button is-small\"\n        [href]=\"property.externalUrl.url + (property.externalUrl.urlParamValue ? property.value : '')\"\n        target=\"_blank\"\n        [title]=\"property.externalUrl.title\"\n        [ngClass]=\"{'is-dark is-outlined': property.key === 'type'}\"\n        [attr.disabled]=\"property.externalUrl.urlParamValue && !property.value ? true : null\"\n      >\n        <fa-icon [icon]=\"property.externalUrl.icon || 'external-link-alt'\"></fa-icon>\n      </a>\n    </div>\n  </ng-container>\n  <ng-container *ngIf=\"unitConverterEnabled(property)\">\n    <div class=\"control\">\n      <button class=\"button is-small\" title=\"Open calculator\"\n        [ngbPopover]=\"convertUnits\" autoClose=\"outside\"\n        triggers=\"manual\" #p=\"ngbPopover\" placement=\"bottom\" container=\"body\"\n        (click)=\"openUnitConverter(p, property)\"\n      >\n        <fa-icon icon=\"calculator\"></fa-icon>\n      </button>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #actorAddons let-property>\n  <div class=\"control\" *ngIf=\"property.key === '@id'\">\n    <button class=\"button is-small\" title=\"Add myself as Actor\"\n      (click)=\"setUserActorId(property)\"\n    >\n      <fa-icon [icon]=\"['far', 'id-badge']\"></fa-icon>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #cycleAddons let-property>\n  <div class=\"control\" *ngIf=\"property.key === 'cycleDuration'\">\n    <button class=\"button is-small\" title=\"Calculate value from startDate and endDate\"\n      (click)=\"calculateCycleDuration(property)\"\n      [disabled]=\"!calculateCycleDurationEnabled(property)\"\n    >\n      <fa-icon icon=\"calculator\"></fa-icon>\n    </button>\n  </div>\n  <div class=\"control\" *ngIf=\"property.key === 'startDate'\">\n    <button class=\"button is-small\" title=\"Calculate value from endDate and cycleDuration\"\n      (click)=\"calculateCycleStartDate(property)\"\n      [disabled]=\"!calculateCycleStartDateEnabled(property)\"\n    >\n      <fa-icon icon=\"calculator\"></fa-icon>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #showNewProperty let-property>\n  <header class=\"card-header\" *ngIf=\"editable && property.editable && (property.addPropertyEnabled || deepEditable); else padder\">\n    <form class=\"py-3 px-4 is-flex-grow-1\" (submit)=\"addProperty(property)\" novalidate>\n      <div class=\"field is-horizontal\">\n        <div class=\"field-label is-small\">\n          <label class=\"label\" [for]=\"property.id + '_new'\">\n            <span>Add new field</span>\n          </label>\n        </div>\n        <div class=\"field-body\">\n          <div class=\"field has-addons\">\n            <div class=\"control is-expanded\">\n              <input class=\"input is-small\"\n                [(ngModel)]=\"property.newProperty\"\n                [id]=\"property.id + '_new'\"\n                name=\"randomname\"\n                placeholder=\"Search and select field from results\"\n\n                [ngbTypeahead]=\"suggestNewProperty(property.fullKey)\"\n                [resultTemplate]=\"suggestion\"\n                [inputFormatter]=\"formatter\"\n                [focusFirst]=\"false\"\n                [editable]=\"false\"\n                (focus)=\"typeaheadFocus($event)\"\n              >\n            </div>\n            <div class=\"control\">\n              <button class=\"button is-small\" type=\"submit\"\n                [disabled]=\"!property.newProperty || !property.newProperty.name\"\n              >\n                <fa-icon icon=\"plus\"></fa-icon>\n                <span class=\"pl-2\">Add</span>\n              </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </form>\n  </header>\n</ng-template>\n\n<ng-template #propertyError let-property=\"property\" let-edit=\"edit\">\n  <p class=\"help\"\n    [class.is-danger]=\"property.hasError\"\n    [class.is-warning]=\"property.hasWarning\"\n    *ngIf=\"property.error\"\n  >\n    <span class=\"is-pre-wrap\" *bindOnce=\"property.error\" [innerHTML]=\"property.error.message\"></span>\n    <a class=\"pl-2\"\n      *ngIf=\"edit && errorsEditable && property.error.index >= 0\"\n      (click)=\"editError(property)\"\n    >\n      <fa-icon class=\"pr-2\" icon=\"edit\"></fa-icon>\n      <span>Edit</span>\n    </a>\n    <a class=\"pl-2\"\n      *ngIf=\"(property.hasWarning || errorsEditable) && property.error.index >= 0\"\n      (click)=\"resolveError(property)\"\n    >\n      <fa-icon class=\"pr-2\" icon=\"check\"></fa-icon>\n      <span>Resolved</span>\n    </a>\n  </p>\n</ng-template>\n\n<ng-template #propertyMap let-property>\n  <div class=\"panel is-default\" *ngIf=\"showMap\">\n    <div class=\"open-group panel-heading py-0\"\n      (click)=\"mapVisible = !mapVisible\" pointer\n      [class.is-open]=\"mapVisible\"\n    >\n      <div class=\"columns is-mobile is-vcentered mb-0\">\n        <span class=\"column is-narrow py-1 my-0\">\n          <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!mapVisible\"></fa-icon>\n          <fa-icon icon=\"angle-right\" [class.is-hidden]=\"mapVisible\"></fa-icon>\n        </span>\n        <span class=\"column py-1 my-0\">\n          <span class=\"is-size-6\">View on Map</span>\n        </span>\n      </div>\n    </div>\n    <div class=\"panel-block is-block p-0\" [class.is-hidden]=\"!mapVisible\">\n      <he-sites-maps [sites]=\"[node]\" [showNotice]=\"false\"></he-sites-maps>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #nodeErrorForm let-property>\n  <ng-container *ngIf=\"property.newError && property.editable\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <div class=\"select is-small\">\n          <select [(ngModel)]=\"property.newError.level\">\n            <option [value]=\"undefined\">Select Level</option>\n            <option value=\"error\">Error</option>\n            <option value=\"warning\">Warning</option>\n          </select>\n        </div>\n      </div>\n      <div class=\"control is-expanded\">\n        <textarea class=\"textarea is-small\"\n          [(ngModel)]=\"property.newError.message\"\n          placeholder=\"Enter your message here\"\n          rows=\"1\"\n        ></textarea>\n      </div>\n      <div class=\"control\">\n        <button class=\"button is-small\"\n          [disabled]=\"!property.newError.level || !property.newError.message\"\n          (click)=\"addError(property, property.newError)\"\n        >\n          <fa-icon icon=\"plus-circle\"></fa-icon>\n          <span class=\"pl-2\">Add</span>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #popupErrorForm let-data=\"data\">\n  <div class=\"field has-addons\">\n    <div class=\"control\">\n      <div class=\"select\">\n        <select [(ngModel)]=\"data.level\">\n          <option [value]=\"undefined\">Select Level</option>\n          <option value=\"error\">Error</option>\n          <option value=\"warning\">Warning</option>\n        </select>\n      </div>\n    </div>\n    <div class=\"control\">\n      <input class=\"input\"\n        [(ngModel)]=\"data.message\"\n        placeholder=\"Enter your message here\"\n      >\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #suggestion let-r=\"result\" let-t=\"term\">\n  <ngb-highlight\n    [title]=\"r.bibliography?.title || r.bibliography?.documentDOI || r.bibliography?.scopus || r.name\"\n    [result]=\"r.bibliography?.title || r.bibliography?.documentDOI || r.bibliography?.scopus || r.name\"\n    [term]=\"t\"\n  ></ngb-highlight>\n</ng-template>\n\n<ng-template #padder>\n  <div class=\"pt-1\"></div>\n</ng-template>\n\n<ng-template #convertUnits let-value=\"value\" let-term=\"term\" let-units=\"units\">\n  <he-unit-converter [value]=\"value\" [term]=\"term\" [toUnits]=\"units\"></he-unit-converter>\n</ng-template>\n", styles: [".panel.is-default .panel-heading{background-color:#ededed;color:#363636}.card-toggle{left:0;position:absolute;top:0}@media screen and (max-width: 768px){.card-toggle{position:relative}}.card-toggle>fa-icon{display:inline-block;width:10px}.card{overflow:visible}.card .card{box-shadow:2px 2px #36363652,0 0 0 1px #36363652}.card .card>.card-header{box-shadow:0 2px 1px #36363652}.property-array-number{left:-4px;position:absolute;top:-12px}.property-array-number .tag.is-delete{border:1px solid rgba(54,54,54,.32)}.control>.button{height:100%}.is-danger-light{color:#f5758f}he-sites-maps{height:200px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeIconComponent, selector: "he-node-icon", inputs: ["type", "size"] }, { type: MapsDrawingConfirmComponent, selector: "he-maps-drawing-confirm", inputs: ["value", "modes", "center", "zoom"], outputs: ["closed"] }, { type: BibliographiesSearchConfirmComponent, selector: "he-bibliographies-search-confirm", inputs: ["search", "searchSources", "searchBibliographies", "searchBy"], outputs: ["closed"] }, { type: SchemaVersionLinkComponent, selector: "he-schema-version-link", inputs: ["node", "showExternalLink", "linkClass", "text"] }, { type: PopoverConfirmComponent, selector: "he-popover-confirm", inputs: ["message", "content", "position", "popoverClass"], outputs: ["confirmed"] }, { type: SitesMapsComponent, selector: "he-sites-maps", inputs: ["loadPolygons", "sites", "nodes", "center", "zoom", "showNotice"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }, { type: UnitConverterComponent, selector: "he-unit-converter", inputs: ["term", "value", "fromUnits", "toUnits"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i10__namespace.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { type: i3__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: TagsInputDirective, selector: "[appTagsInput]", inputs: ["appTagsInput"] }, { type: i1__namespace$4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i1__namespace$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], pipes: { "pluralize": PluralizePipe } });
+    FilesFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FilesFormComponent, selector: "he-files-form", inputs: { schemas: "schemas", errors: "errors", node: "node", nodeMap: "nodeMap", editable: "editable", errorMode: "errorMode", deepEditable: "deepEditable", errorsEditable: "errorsEditable" }, outputs: { nodeChange: "nodeChange", nodeErorrResolved: "nodeErorrResolved", nodeErrorAdded: "nodeErrorAdded" }, ngImport: i0__namespace, template: "<div class=\"card\">\n  <div class=\"card-toggle p-4\" (click)=\"isOpen = !isOpen\" pointer>\n    <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!isOpen\"></fa-icon>\n    <fa-icon icon=\"angle-right\" [class.is-hidden]=\"isOpen\"></fa-icon>\n    <span *ngIf=\"nodeProperty\" class=\"is-px-2\"\n      [class.has-text-danger]=\"nodeProperty.hasError\"\n      [class.has-text-warning]=\"nodeProperty.hasWarning\"\n    >\n      <he-node-icon [type]=\"nodeProperty.schemaType\"></he-node-icon>\n    </span>\n  </div>\n\n  <ng-container *ngIf=\"editable && isOpen && nodeProperty\">\n    <ng-container *ngTemplateOutlet=\"showNewProperty; context: {$implicit: nodeProperty}\"></ng-container>\n  </ng-container>\n\n  <div class=\"card-content\">\n    <ng-container *ngIf=\"isOpen\">\n      <div class=\"pb-3 mb-2\" *ngIf=\"errorsEditable\">\n        <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: nodeProperty}\"></ng-container>\n      </div>\n\n      <div class=\"mb-4\" *ngIf=\"nodeProperty?.error\">\n        <ng-container *ngTemplateOutlet=\"propertyError; context: {property: nodeProperty, edit: true}\"></ng-container>\n      </div>\n    </ng-container>\n\n    <div class=\"columns is-multiline\">\n      <ng-container *ngFor=\"let property of properties; trackBy: trackByProperty\">\n        <ng-container *ngTemplateOutlet=\"showProperty; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n    </div>\n\n    <ng-container *ngIf=\"isOpen\">\n      <ng-container *ngTemplateOutlet=\"propertyMap; context: {$implicit: nodeProperty}\"></ng-container>\n    </ng-container>\n  </div>\n</div>\n\n<he-maps-drawing-confirm *ngIf=\"!!mapDrawingProperty\"\n  [value]=\"mapDrawingProperty.value\" [modes]=\"mapDrawingModes(mapDrawingProperty)\"\n  (closed)=\"onMapDrawingClosed($event)\"\n></he-maps-drawing-confirm>\n\n<he-bibliographies-search-confirm *ngIf=\"!!bibliographiesSearchProperty\"\n  [search]=\"bibliographiesSearchProperty.value\"\n  [searchBy]=\"bibliographiesSearchKey(bibliographiesSearchProperty)\"\n  [searchSources]=\"bibliographiesSearchSources\"\n  (closed)=\"onBibliographiesSearchClosed($event)\"\n></he-bibliographies-search-confirm>\n\n<ng-template #labelDescription let-property>\n  <span\n    class=\"trigger-popover\"\n    [ngbPopover]=\"property.schema?.description\" [autoClose]=\"'outside'\"\n    triggers=\"hover\" placement=\"right\" container=\"body\"\n  >\n    <span>{{property.key}}</span>\n  </span>\n</ng-template>\n\n<ng-template #labelDefault let-property>\n  <span>{{property.key}}</span>\n</ng-template>\n\n<ng-template #showProperty let-property>\n  <ng-container *ngIf=\"(isOpen || property.closedVisible) && !property.isHidden\">\n    <div class=\"column is-6\"\n      [id]=\"property.fullKey + '_' + property.id\"\n      [class.is-12]=\"property.properties.length || !property.key\"\n      [ngSwitch]=\"!!property.properties.length\"\n    >\n      <div class=\"columns is-multiline is-variable is-1\" *ngSwitchCase=\"false\">\n        <div class=\"column is-3 py-1\" *ngIf=\"property.key\">\n          <label class=\"label has-text-right-tablet has-text-ellipsis\"\n            *bindOnce=\"property\"\n            [for]=\"property.id\"\n          >\n            <ng-container\n              *ngTemplateOutlet=\"property.schema?.description && editable && property.editable ? labelDescription : labelDefault; context: {$implicit: property}\">\n            </ng-container>\n          </label>\n        </div>\n\n        <div class=\"column is-9 py-1\" [class.is-12]=\"!property.key\">\n          <div class=\"field\">\n            <ng-container *ngTemplateOutlet=\"inputForm; context: {$implicit: property}\"></ng-container>\n\n            <ng-container *ngIf=\"(editable || errorsEditable) && (property.hasError || property.hasWarning)\">\n              <ng-container *ngTemplateOutlet=\"propertyError; context: {property: property, edit: false}\"></ng-container>\n            </ng-container>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"panel\" *ngSwitchCase=\"true\"\n        [class.is-link]=\"errorMode && property.changed\"\n        [class.is-danger]=\"!property.changed && property.hasError\"\n        [class.is-warning]=\"!property.changed && property.hasWarning\"\n        [class.is-default]=\"!property.changed && !property.hasError && !property.hasWarning\"\n      >\n        <div class=\"open-group panel-heading py-0\"\n          (click)=\"property.isOpen = !property.isOpen\" pointer\n          [class.is-open]=\"property.isOpen\"\n          [class.has-text-white]=\"(errorMode && property.changed) || property.hasError || property.hasWarning\"\n        >\n          <div class=\"columns is-mobile is-vcentered\">\n            <span class=\"column is-narrow py-1 my-0\">\n              <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!property.isOpen\"></fa-icon>\n              <fa-icon icon=\"angle-right\" [class.is-hidden]=\"property.isOpen\"></fa-icon>\n            </span>\n            <span class=\"column py-1 my-0\">\n              <span class=\"is-size-6\">{{property.key}}</span>\n            </span>\n            <span *ngIf=\"property.schemaType\" class=\"column is-narrow py-1 my-0\">\n              <span class=\"tags mb-0 has-addons\">\n                <span class=\"tag mb-0 is-light\">Type</span>\n                <span class=\"tag mb-0 is-white\">\n                  <he-schema-version-link linkClass=\"is-small\" [node]=\"{'@type': property.schemaType}\">\n                    <span>{{property.schemaType}}</span>\n                  </he-schema-version-link>\n                </span>\n              </span>\n            </span>\n            <he-popover-confirm class=\"column is-narrow py-1 my-0 px-0\"\n              *ngIf=\"editable && !errorsEditable\"\n              ngbTooltip=\"Remove group\" placement=\"top\"\n              [message]=\"'<p>This will remove the group completely.</p>' + (property.isRequired ? '<p><u>Warning: this field is required.</u></p>' : '') + '<p>Do you confirm?</p>'\"\n              popoverClass=\"px-3\"\n              (confirmed)=\"propertyChanged(null, property)\"\n            >\n              <fa-icon icon=\"times\" size=\"sm\"></fa-icon>\n            </he-popover-confirm>\n          </div>\n        </div>\n        <div class=\"panel-block is-block p-0\" *ngIf=\"property.isOpen\">\n          <ng-container [ngSwitch]=\"property.isArray\">\n            <div class=\"px-3 pt-4\" *ngIf=\"property.error\">\n              <ng-container *ngTemplateOutlet=\"propertyError; context: {property: property, edit: true}\"></ng-container>\n            </div>\n\n            <div class=\"mt-3\" *ngSwitchCase=\"false\">\n              <p class=\"help py-1 px-2\" *ngIf=\"editable && !property.editable\">\n                To change the {{property.key}}, please delete it first, then add the field again\n              </p>\n              <ng-container *ngIf=\"editable && property.editable\">\n                <ng-container [ngSwitch]=\"property.schema?.title\">\n                  <p class=\"help py-1 px-2\" *ngSwitchCase=\"'Bibliography'\">\n                    Search by Title or Document DOI to auto-populate the fields using the Mendeley catalogue\n                  </p>\n                </ng-container>\n              </ng-container>\n\n              <ng-container *ngTemplateOutlet=\"showNewProperty; context: {$implicit: property}\"></ng-container>\n\n              <div class=\"px-3 mt-1\" *ngIf=\"errorsEditable\">\n                <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: property}\"></ng-container>\n              </div>\n\n              <div class=\"property-group py-2 px-3 mt-2\">\n                <div class=\"columns is-multiline mb-0\">\n                  <ng-container *ngFor=\"let prop2 of property.properties; trackBy: trackByProperty\">\n                    <ng-container *ngTemplateOutlet=\"showProperty; context: {$implicit: prop2}\"></ng-container>\n                  </ng-container>\n                </div>\n              </div>\n            </div>\n\n            <div class=\"py-2 px-3 mt-2\" *ngSwitchCase=\"true\">\n              <div class=\"mt-1\" *ngIf=\"errorsEditable\">\n                <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: property}\"></ng-container>\n              </div>\n\n              <ng-container *ngFor=\"let prop2 of property.properties; trackBy: trackByProperty\">\n                <div class=\"card p-0 my-4\" *ngIf=\"prop2.key\"\n                  [id]=\"prop2.fullKey + '_' + prop2.id\"\n                >\n                  <div class=\"property-array-number\">\n                    <div class=\"tags has-addons\">\n                      <span class=\"tag is-dark\">{{prop2.key}}</span>\n                      <ng-container *ngIf=\"editable && !errorsEditable && property.editable\">\n                        <span class=\"tag is-info\" pointer\n                          (click)=\"duplicateArrayGroup(property, prop2)\"\n                          [ngbTooltip]=\"'Duplicate ' + pluralize(property.key, 1)\" placement=\"top\"\n                        >\n                          <fa-icon icon=\"clone\" size=\"sm\"></fa-icon>\n                        </span>\n                        <span class=\"tag is-light\" pointer\n                          *ngIf=\"prop2.key !== '0'\"\n                          (click)=\"moveArrayGroupUp(property, prop2)\"\n                          ngbTooltip=\"Move Up\" placement=\"top\"\n                        >\n                          <fa-icon icon=\"long-arrow-alt-up\" size=\"sm\"></fa-icon>\n                        </span>\n                        <span class=\"tag is-light\" pointer\n                          *ngIf=\"prop2.key !== property.properties.length - 1\"\n                          (click)=\"moveArrayGroupDown(property, prop2)\"\n                          ngbTooltip=\"Move Down\" placement=\"top\"\n                        >\n                          <fa-icon icon=\"long-arrow-alt-down\" size=\"sm\"></fa-icon>\n                        </span>\n                        <he-popover-confirm class=\"tag is-delete\"\n                          [ngbTooltip]=\"'Remove ' + pluralize(property.key, 1)\" placement=\"top\"\n                          message=\"This will remove the group completely. Do you confirm?\" position=\"right\"\n                          (confirmed)=\"removeArrayGroup(property, prop2)\"\n                        ></he-popover-confirm>\n                      </ng-container>\n                    </div>\n                  </div>\n\n                  <ng-container *ngTemplateOutlet=\"showNewProperty; context: {$implicit: prop2}\"></ng-container>\n\n                  <div class=\"px-4 mt-2\" *ngIf=\"errorsEditable\">\n                    <ng-container *ngTemplateOutlet=\"nodeErrorForm; context: {$implicit: prop2}\"></ng-container>\n                  </div>\n\n                  <div class=\"px-4 mt-2\" *ngIf=\"prop2.error\">\n                    <ng-container *ngTemplateOutlet=\"propertyError; context: {property: prop2, edit: true}\"></ng-container>\n                  </div>\n\n                  <div class=\"property-group card-content p-3\">\n                    <div class=\"columns is-multiline my-0\">\n                      <ng-container *ngFor=\"let prop3 of prop2.properties; trackBy: trackByProperty\">\n                        <ng-container *ngTemplateOutlet=\"showProperty; context: {$implicit: prop3}\"></ng-container>\n                      </ng-container>\n                    </div>\n                  </div>\n                </div>\n              </ng-container>\n\n              <button class=\"button is-dark is-outlined is-small\" type=\"button\"\n                *ngIf=\"editable && !errorsEditable\"\n                (click)=\"addArrayGroup(property)\"\n              >\n                <fa-icon icon=\"plus-circle\"></fa-icon>\n                <span class=\"pl-2\">Add</span>\n                <span class=\"pl-1\">{{property.key | pluralize:1}}</span>\n              </button>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #inputForm let-property>\n  <ng-container *ngIf=\"property.key\">\n    <ng-container [ngSwitch]=\"property.suggestions?.type\">\n      <ng-container *ngSwitchCase=\"'select'\">\n        <ng-container *ngTemplateOutlet=\"inputSelect; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n      <ng-container *ngSwitchDefault>\n        <ng-container *ngTemplateOutlet=\"inputInput; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template #inputInput let-property>\n  <div class=\"field mb-0\" [class.has-addons]=\"hasAddons(property)\">\n    <div class=\"control is-expanded\"\n      [class.has-icons-right]=\"property.loading\"\n    >\n      <input class=\"input is-small search-input\"\n        [class.is-dark]=\"property.key === 'type'\"\n        [class.is-link]=\"errorMode && property.changed\"\n        [class.is-danger]=\"(!property.changed && property.hasError) || isRequired(property)\"\n        [class.is-warning]=\"!property.changed && property.hasWarning\"\n\n        [(ngModel)]=\"property.value\" #propertyModel=\"ngModel\"\n        [type]=\"property.schema?.type === 'number' ? 'number' : 'string'\"\n        [id]=\"property.id\"\n        name=\"randomname\"\n        [readonly]=\"!editable || !property.editable || property.schema?.internal\"\n        [placeholder]=\"property.placeholder\"\n        [appTagsInput]=\"{enabled: editable && property.editable && property.schema?.type === 'array', items: property.schema?.items, delimiter: ';', allowDuplicates: true, placeholder: property.placeholder}\"\n        (change)=\"propertyChanged($event.target.value, property)\"\n\n        [pattern]=\"property.schema?.pattern\"\n        [required]=\"property.fullKey.endsWith('id') && property.fullKey !== 'id'\"\n        [min]=\"property.schema?.minimum\"\n        [max]=\"property.schema?.maximum\"\n\n        [ngbTypeahead]=\"propertySuggest(property.fullKey, property.suggestions?.type)\"\n        [resultTemplate]=\"suggestion\"\n        [inputFormatter]=\"formatter\"\n        [focusFirst]=\"true\"\n        (focus)=\"editable && property.editable && typeaheadFocus($event)\"\n        (selectItem)=\"suggestionSelected($event.item, property)\"\n      >\n\n      <span class=\"icon is-small is-right has-text-grey-dark\" [class.is-hidden]=\"!property.loading\">\n        <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"sm\"></fa-icon>\n      </span>\n    </div>\n    <ng-container *ngTemplateOutlet=\"inputAddons; context: {$implicit: property}\"></ng-container>\n  </div>\n  <p class=\"help is-danger-light\"\n    *ngIf=\"!property.hasError && propertyModel.invalid\"\n  >\n    <span *bindOnce=\"propertyModel.errors\" [innerHTML]=\"formatPropertyError(propertyModel.errors, property)\"></span>\n  </p>\n</ng-template>\n\n<ng-template #inputSelect let-property>\n  <div class=\"field mb-0\" [class.has-addons]=\"hasAddons(property)\">\n    <div class=\"control is-expanded\">\n      <div class=\"select is-small is-fullwidth\"\n        [class.is-link]=\"errorMode && property.changed\"\n        [class.is-danger]=\"(!property.changed && property.hasError) || isRequired(property)\"\n        [class.is-warning]=\"!property.changed && property.hasWarning\"\n      >\n        <select\n          [(ngModel)]=\"property.value\" #propertyModel=\"ngModel\"\n          [id]=\"property.id\"\n          name=\"randomname\"\n          [disabled]=\"!editable || !property.editable || property.schema?.internal\"\n          (change)=\"propertyChanged($event.target.value, property)\"\n        >\n          <option value=\"\">Select</option>\n          <ng-container *bindOnce=\"property.suggestions\">\n            <option *ngFor=\"let value of property.suggestions.values; trackBy: trackByIndex\" [value]=\"value\">{{value}}</option>\n          </ng-container>\n        </select>\n      </div>\n    </div>\n    <ng-container *ngTemplateOutlet=\"inputAddons; context: {$implicit: property}\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #removeFieldAddon let-property>\n  <div class=\"control\" *ngIf=\"!errorsEditable && !property.isRequired\">\n    <a class=\"button is-small\" title=\"Remove field\"\n      [class.is-outlined]=\"!property.changed && (property.hasError || property.hasWarning)\"\n      [class.is-danger]=\"!property.changed && property.hasError\"\n      [class.is-warning]=\"!property.changed && property.hasWarning\"\n      (click)=\"$event.stopPropagation(); propertyChanged(null, property)\"\n    >\n      <fa-icon icon=\"times\"></fa-icon>\n    </a>\n  </div>\n</ng-template>\n\n<ng-template #inputAddons let-property>\n  <he-popover-confirm class=\"control\"\n    *ngIf=\"enableAddError(property)\"\n    position=\"left\"\n    [content]=\"popupErrorForm\"\n    (confirmed)=\"addError(property, $event)\"\n  >\n    <span class=\"button is-small\">\n      <fa-icon icon=\"comments\"></fa-icon>\n    </span>\n  </he-popover-confirm>\n\n  <ng-container *ngIf=\"editable && property.editable\">\n    <ng-container [ngSwitch]=\"property.schemaType\">\n      <ng-container *ngSwitchCase=\"SchemaType.Actor\">\n        <ng-container *ngTemplateOutlet=\"actorAddons; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n      <ng-container *ngSwitchCase=\"SchemaType.Cycle\">\n        <ng-container *ngTemplateOutlet=\"cycleAddons; context: {$implicit: property}\"></ng-container>\n      </ng-container>\n    </ng-container>\n    <ng-container *bindOnce=\"property\">\n      <div class=\"control\" *ngIf=\"mapDrawingModes(property).length\">\n        <button class=\"button is-small\" title=\"Pick on Map\"\n          (click)=\"mapDrawingProperty = property\"\n        >\n          <fa-icon icon=\"map-marked-alt\"></fa-icon>\n        </button>\n      </div>\n      <div class=\"control\" *ngIf=\"bibliographiesSearchKey(property)\">\n        <button class=\"button is-small\" title=\"Advanced Search\"\n          (click)=\"bibliographiesSearchProperty = property\"\n        >\n          <fa-icon icon=\"search\"></fa-icon>\n        </button>\n      </div>\n    </ng-container>\n\n    <ng-container *ngTemplateOutlet=\"removeFieldAddon; context: {$implicit: property}\"></ng-container>\n  </ng-container>\n  <div class=\"control\" *ngIf=\"addPropertyEnabled(property)\">\n    <a class=\"button is-small is-danger\" title=\"Add field\"\n      (click)=\"$event.stopPropagation(); addMissingProperty(property)\"\n    >\n      <fa-icon icon=\"plus-circle\"></fa-icon>\n      <span class=\"pl-2\">Add</span>\n    </a>\n  </div>\n  <div class=\"control\" *ngIf=\"isRequired(property)\">\n    <label class=\"button is-small is-danger\" [for]=\"property.id\"\n      ngbTooltip=\"This field is required\" placement=\"top\"\n    >\n      <fa-icon icon=\"exclamation-triangle\"></fa-icon>\n    </label>\n  </div>\n  <ng-container *ngIf=\"property.externalUrl?.url\">\n    <div class=\"control\">\n      <a class=\"button is-small\"\n        [href]=\"property.externalUrl.url + (property.externalUrl.urlParamValue ? property.value : '')\"\n        target=\"_blank\"\n        [title]=\"property.externalUrl.title\"\n        [ngClass]=\"{'is-dark is-outlined': property.key === 'type'}\"\n        [attr.disabled]=\"property.externalUrl.urlParamValue && !property.value ? true : null\"\n      >\n        <fa-icon [icon]=\"property.externalUrl.icon || 'external-link-alt'\"></fa-icon>\n      </a>\n    </div>\n  </ng-container>\n  <ng-container *ngIf=\"unitConverterEnabled(property)\">\n    <div class=\"control\">\n      <button class=\"button is-small\" title=\"Open calculator\"\n        [ngbPopover]=\"convertUnits\" autoClose=\"outside\"\n        triggers=\"manual\" #p=\"ngbPopover\" placement=\"bottom\" container=\"body\"\n        (click)=\"openUnitConverter(p, property)\"\n      >\n        <fa-icon icon=\"calculator\"></fa-icon>\n      </button>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #actorAddons let-property>\n  <div class=\"control\" *ngIf=\"property.key === '@id'\">\n    <button class=\"button is-small\" title=\"Add myself as Actor\"\n      (click)=\"setUserActorId(property)\"\n    >\n      <fa-icon [icon]=\"['far', 'id-badge']\"></fa-icon>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #cycleAddons let-property>\n  <div class=\"control\" *ngIf=\"property.key === 'cycleDuration'\">\n    <button class=\"button is-small\" title=\"Calculate value from startDate and endDate\"\n      (click)=\"calculateCycleDuration(property)\"\n      [disabled]=\"!calculateCycleDurationEnabled(property)\"\n    >\n      <fa-icon icon=\"calculator\"></fa-icon>\n    </button>\n  </div>\n  <div class=\"control\" *ngIf=\"property.key === 'startDate'\">\n    <button class=\"button is-small\" title=\"Calculate value from endDate and cycleDuration\"\n      (click)=\"calculateCycleStartDate(property)\"\n      [disabled]=\"!calculateCycleStartDateEnabled(property)\"\n    >\n      <fa-icon icon=\"calculator\"></fa-icon>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #showNewProperty let-property>\n  <header class=\"card-header\" *ngIf=\"editable && property.editable && (property.addPropertyEnabled || deepEditable); else padder\">\n    <form class=\"py-3 px-4 is-flex-grow-1\" (submit)=\"addProperty(property)\" novalidate>\n      <div class=\"field is-horizontal\">\n        <div class=\"field-label is-small\">\n          <label class=\"label\" [for]=\"property.id + '_new'\">\n            <span>Add new field</span>\n          </label>\n        </div>\n        <div class=\"field-body\">\n          <div class=\"field has-addons\">\n            <div class=\"control is-expanded\">\n              <input class=\"input is-small\"\n                [(ngModel)]=\"property.newProperty\"\n                [id]=\"property.id + '_new'\"\n                name=\"randomname\"\n                placeholder=\"Search and select field from results\"\n\n                [ngbTypeahead]=\"suggestNewProperty(property.fullKey)\"\n                [resultTemplate]=\"suggestion\"\n                [inputFormatter]=\"formatter\"\n                [focusFirst]=\"false\"\n                [editable]=\"false\"\n                (focus)=\"typeaheadFocus($event)\"\n              >\n            </div>\n            <div class=\"control\">\n              <button class=\"button is-small\" type=\"submit\"\n                [disabled]=\"!property.newProperty || !property.newProperty.name\"\n              >\n                <fa-icon icon=\"plus\"></fa-icon>\n                <span class=\"pl-2\">Add</span>\n              </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </form>\n  </header>\n</ng-template>\n\n<ng-template #propertyError let-property=\"property\" let-edit=\"edit\">\n  <p class=\"help\"\n    [class.is-danger]=\"property.hasError\"\n    [class.is-warning]=\"property.hasWarning\"\n    *ngIf=\"property.error\"\n  >\n    <span class=\"is-pre-wrap\" *bindOnce=\"property.error\" [innerHTML]=\"property.error.message\"></span>\n    <a class=\"pl-2\"\n      *ngIf=\"edit && errorsEditable && property.error.index >= 0\"\n      (click)=\"editError(property)\"\n    >\n      <fa-icon class=\"pr-2\" icon=\"edit\"></fa-icon>\n      <span>Edit</span>\n    </a>\n    <a class=\"pl-2\"\n      *ngIf=\"(property.hasWarning || errorsEditable) && property.error.index >= 0\"\n      (click)=\"resolveError(property)\"\n    >\n      <fa-icon class=\"pr-2\" icon=\"check\"></fa-icon>\n      <span>Resolved</span>\n    </a>\n  </p>\n</ng-template>\n\n<ng-template #propertyMap let-property>\n  <div class=\"panel is-default\" *ngIf=\"showMap\">\n    <div class=\"open-group panel-heading py-0\"\n      (click)=\"mapVisible = !mapVisible\" pointer\n      [class.is-open]=\"mapVisible\"\n    >\n      <div class=\"columns is-mobile is-vcentered mb-0\">\n        <span class=\"column is-narrow py-1 my-0\">\n          <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!mapVisible\"></fa-icon>\n          <fa-icon icon=\"angle-right\" [class.is-hidden]=\"mapVisible\"></fa-icon>\n        </span>\n        <span class=\"column py-1 my-0\">\n          <span class=\"is-size-6\">View on Map</span>\n        </span>\n      </div>\n    </div>\n    <div class=\"panel-block is-block p-0\" [class.is-hidden]=\"!mapVisible\">\n      <he-sites-maps [sites]=\"[node]\" [showNotice]=\"false\"></he-sites-maps>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #nodeErrorForm let-property>\n  <ng-container *ngIf=\"property.newError && property.editable\">\n    <div class=\"field has-addons\">\n      <div class=\"control\">\n        <div class=\"select is-small\">\n          <select [(ngModel)]=\"property.newError.level\">\n            <option [value]=\"undefined\">Select Level</option>\n            <option value=\"error\">Error</option>\n            <option value=\"warning\">Warning</option>\n          </select>\n        </div>\n      </div>\n      <div class=\"control is-expanded\">\n        <textarea class=\"textarea is-small\"\n          [(ngModel)]=\"property.newError.message\"\n          placeholder=\"Enter your message here\"\n          rows=\"1\"\n        ></textarea>\n      </div>\n      <div class=\"control\">\n        <button class=\"button is-small\"\n          [disabled]=\"!property.newError.level || !property.newError.message\"\n          (click)=\"addError(property, property.newError)\"\n        >\n          <fa-icon icon=\"plus-circle\"></fa-icon>\n          <span class=\"pl-2\">Add</span>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #popupErrorForm let-data=\"data\">\n  <div class=\"field has-addons\">\n    <div class=\"control\">\n      <div class=\"select\">\n        <select [(ngModel)]=\"data.level\">\n          <option [value]=\"undefined\">Select Level</option>\n          <option value=\"error\">Error</option>\n          <option value=\"warning\">Warning</option>\n        </select>\n      </div>\n    </div>\n    <div class=\"control\">\n      <input class=\"input\"\n        [(ngModel)]=\"data.message\"\n        placeholder=\"Enter your message here\"\n      >\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #suggestion let-r=\"result\" let-t=\"term\">\n  <ngb-highlight\n    [title]=\"r.bibliography?.title || r.bibliography?.documentDOI || r.bibliography?.scopus || r.name\"\n    [result]=\"r.bibliography?.title || r.bibliography?.documentDOI || r.bibliography?.scopus || r.name\"\n    [term]=\"t\"\n  ></ngb-highlight>\n</ng-template>\n\n<ng-template #padder>\n  <div class=\"pt-1\"></div>\n</ng-template>\n\n<ng-template #convertUnits let-value=\"value\" let-term=\"term\" let-units=\"units\">\n  <he-unit-converter [value]=\"value\" [term]=\"term\" [toUnits]=\"units\"></he-unit-converter>\n</ng-template>\n", styles: [".panel.is-default .panel-heading{background-color:#ededed;color:#363636}.card-toggle{left:0;position:absolute;top:0}@media screen and (max-width: 768px){.card-toggle{position:relative}}.card-toggle>fa-icon{display:inline-block;width:10px}.card{overflow:visible}.card .card{box-shadow:2px 2px #36363652,0 0 0 1px #36363652}.card .card>.card-header{box-shadow:0 2px 1px #36363652}.property-array-number{left:-4px;position:absolute;top:-12px}.property-array-number .tag.is-delete{border:1px solid rgba(54,54,54,.32)}.control>.button{height:100%}.is-danger-light{color:#f5758f}he-sites-maps{height:200px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeIconComponent, selector: "he-node-icon", inputs: ["type", "size"] }, { type: MapsDrawingConfirmComponent, selector: "he-maps-drawing-confirm", inputs: ["value", "modes", "center", "zoom"], outputs: ["closed"] }, { type: BibliographiesSearchConfirmComponent, selector: "he-bibliographies-search-confirm", inputs: ["search", "searchSources", "searchBibliographies", "searchBy"], outputs: ["closed"] }, { type: SchemaVersionLinkComponent, selector: "he-schema-version-link", inputs: ["node", "showExternalLink", "linkClass", "text"] }, { type: PopoverConfirmComponent, selector: "he-popover-confirm", inputs: ["message", "content", "position", "popoverClass"], outputs: ["confirmed"] }, { type: SitesMapsComponent, selector: "he-sites-maps", inputs: ["loadPolygons", "sites", "nodes", "center", "zoom", "showNotice"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }, { type: UnitConverterComponent, selector: "he-unit-converter", inputs: ["term", "value", "fromUnits", "toUnits"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { type: i6__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i6__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i10__namespace.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { type: i6__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: TagsInputDirective, selector: "[appTagsInput]", inputs: ["appTagsInput"] }, { type: i1__namespace$4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i1__namespace$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i6__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], pipes: { "pluralize": PluralizePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FilesFormComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8090,13 +8243,13 @@
         return HeFilesModule;
     }());
     HeFilesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFilesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    HeFilesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFilesModule, declarations: [FilesFormComponent], imports: [i3.CommonModule, i1$2.FormsModule,
+    HeFilesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFilesModule, declarations: [FilesFormComponent], imports: [i6.CommonModule, i1$2.FormsModule,
             HeCommonModule,
             HeNodeModule,
             HeBibliographiesModule,
             HeSitesModule], exports: [FilesFormComponent] });
     HeFilesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeFilesModule, imports: [[
-                i3.CommonModule, i1$2.FormsModule,
+                i6.CommonModule, i1$2.FormsModule,
                 HeCommonModule,
                 HeNodeModule,
                 HeBibliographiesModule,
@@ -8108,7 +8261,7 @@
                         declarations: components$1,
                         exports: components$1,
                         imports: [
-                            i3.CommonModule, i1$2.FormsModule,
+                            i6.CommonModule, i1$2.FormsModule,
                             HeCommonModule,
                             HeNodeModule,
                             HeBibliographiesModule,
@@ -8282,7 +8435,7 @@
         return ImpactAssessmentsIndicatorBreakdownChartComponent;
     }());
     ImpactAssessmentsIndicatorBreakdownChartComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsIndicatorBreakdownChartComponent, deps: [{ token: i1__namespace$1.DomSanitizer }, { token: HeSearchService }, { token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ImpactAssessmentsIndicatorBreakdownChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsIndicatorBreakdownChartComponent, selector: "he-impact-assessments-indicator-breakdown-chart", inputs: { impactAssessment: "impactAssessment", indicators: "indicators" }, viewQueries: [{ propertyName: "chartRef", first: true, predicate: ["chart"], descendants: true }], ngImport: i0__namespace, template: "<div class=\"p-3\" [class.is-hidden]=\"loading || !terms?.length\">\n  <div class=\"columns\">\n    <div class=\"column\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <span class=\"button is-small is-static\">Select an Indicator</span>\n        </div>\n        <div class=\"control is-expanded\">\n          <div class=\"select is-fullwidth is-small\">\n            <select (change)=\"updateChart()\" [(ngModel)]=\"selectedTerm\" id=\"selectedTerm\">\n              <option *ngFor=\"let term of terms\" [ngValue]=\"term\">{{term.name}} ({{term.units}})</option>\n            </select>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"column is-narrow\">\n      <a class=\"button is-dark is-outlined is-small\" [href]=\"csvContent\" [download]=\"id + '-logs.csv'\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download All (CSV)</span>\n      </a>\n    </div>\n  </div>\n\n  <div class=\"mt-1\">\n    <p *ngIf=\"noData\" class=\"has-text-centered\">No breakdown available for {{selectedTerm?.name}}.</p>\n    <div class=\"chart-container h-100\">\n      <canvas #chart></canvas>\n    </div>\n  </div>\n</div>\n\n<ng-container *ngIf=\"loading\">\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-container>\n", styles: [":host{display:block;overflow:visible}.chart-container{height:400px;position:relative}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    ImpactAssessmentsIndicatorBreakdownChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsIndicatorBreakdownChartComponent, selector: "he-impact-assessments-indicator-breakdown-chart", inputs: { impactAssessment: "impactAssessment", indicators: "indicators" }, viewQueries: [{ propertyName: "chartRef", first: true, predicate: ["chart"], descendants: true }], ngImport: i0__namespace, template: "<div class=\"p-3\" [class.is-hidden]=\"loading || !terms?.length\">\n  <div class=\"columns\">\n    <div class=\"column\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <span class=\"button is-small is-static\">Select an Indicator</span>\n        </div>\n        <div class=\"control is-expanded\">\n          <div class=\"select is-fullwidth is-small\">\n            <select (change)=\"updateChart()\" [(ngModel)]=\"selectedTerm\" id=\"selectedTerm\">\n              <option *ngFor=\"let term of terms\" [ngValue]=\"term\">{{term.name}} ({{term.units}})</option>\n            </select>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"column is-narrow\">\n      <a class=\"button is-dark is-outlined is-small\" [href]=\"csvContent\" [download]=\"id + '-logs.csv'\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download All (CSV)</span>\n      </a>\n    </div>\n  </div>\n\n  <div class=\"mt-1\">\n    <p *ngIf=\"noData\" class=\"has-text-centered\">No breakdown available for {{selectedTerm?.name}}.</p>\n    <div class=\"chart-container h-100\">\n      <canvas #chart></canvas>\n    </div>\n  </div>\n</div>\n\n<ng-container *ngIf=\"loading\">\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-container>\n", styles: [":host{display:block;overflow:visible}.chart-container{height:400px;position:relative}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsIndicatorBreakdownChartComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8424,7 +8577,7 @@
         return ImpactAssessmentsIndicatorsChartComponent;
     }());
     ImpactAssessmentsIndicatorsChartComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsIndicatorsChartComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ImpactAssessmentsIndicatorsChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsIndicatorsChartComponent, selector: "he-impact-assessments-indicators-chart", inputs: { impactAssessments: "impactAssessments", key: "key", filterTermTypes: "filterTermTypes" }, viewQueries: [{ propertyName: "barChartRef", first: true, predicate: ["barChart"], descendants: true }, { propertyName: "pieChartRef", first: true, predicate: ["pieChart"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"p-3\" [class.is-hidden]=\"!terms?.length\">\n  <div class=\"field is-horizontal\">\n    <div class=\"field-label is-normal\">\n      <label class=\"label\" for=\"selectedTerm\">\n        <span>Select a column</span>\n      </label>\n    </div>\n    <div class=\"field-body\">\n      <div class=\"control\">\n        <div class=\"select is-small\">\n          <select (change)=\"updateCharts()\" [(ngModel)]=\"selectedTerm\" id=\"selectedTerm\">\n            <option *ngFor=\"let term of terms\" [ngValue]=\"term\">{{term.name}}</option>\n          </select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"mt-1\">\n    <div class=\"columns h-100\">\n      <div class=\"column is-12 chart-container\">\n        <canvas #barChart></canvas>\n      </div>\n      <div class=\"column is-4 chart-container is-hidden\">\n        <canvas #pieChart></canvas>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:block;overflow:visible}.chart-container{height:400px;position:relative}\n"], directives: [{ type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
+    ImpactAssessmentsIndicatorsChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsIndicatorsChartComponent, selector: "he-impact-assessments-indicators-chart", inputs: { impactAssessments: "impactAssessments", key: "key", filterTermTypes: "filterTermTypes" }, viewQueries: [{ propertyName: "barChartRef", first: true, predicate: ["barChart"], descendants: true }, { propertyName: "pieChartRef", first: true, predicate: ["pieChart"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"p-3\" [class.is-hidden]=\"!terms?.length\">\n  <div class=\"field is-horizontal\">\n    <div class=\"field-label is-normal\">\n      <label class=\"label\" for=\"selectedTerm\">\n        <span>Select a column</span>\n      </label>\n    </div>\n    <div class=\"field-body\">\n      <div class=\"control\">\n        <div class=\"select is-small\">\n          <select (change)=\"updateCharts()\" [(ngModel)]=\"selectedTerm\" id=\"selectedTerm\">\n            <option *ngFor=\"let term of terms\" [ngValue]=\"term\">{{term.name}}</option>\n          </select>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"mt-1\">\n    <div class=\"columns h-100\">\n      <div class=\"column is-12 chart-container\">\n        <canvas #barChart></canvas>\n      </div>\n      <div class=\"column is-4 chart-container is-hidden\">\n        <canvas #pieChart></canvas>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:block;overflow:visible}.chart-container{height:400px;position:relative}\n"], directives: [{ type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsIndicatorsChartComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8500,7 +8653,7 @@
         return ImpactAssessmentsProductsLogsComponent;
     }());
     ImpactAssessmentsProductsLogsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsProductsLogsComponent, deps: [{ token: HeSearchService }, { token: HeNodeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ImpactAssessmentsProductsLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsProductsLogsComponent, selector: "he-impact-assessments-products-logs", inputs: { impactAssessment: "impactAssessment", key: "key", filterTermTypes: "filterTermTypes", originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<he-node-logs-models *ngIf=\"!loading; else loader\"\n  [logsUrl]=\"logsUrl\"\n  [nodeType]=\"NodeType.ImpactAssessment\"\n  [nodeKey]=\"key\"\n  [originalValues]=\"originalValues\"\n  [recalculatedValues]=\"recalculatedValues\"\n  [terms]=\"emissions\"\n  [logs]=\"logs\"\n  filteredType=\"Emission\"\n></he-node-logs-models>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    ImpactAssessmentsProductsLogsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsProductsLogsComponent, selector: "he-impact-assessments-products-logs", inputs: { impactAssessment: "impactAssessment", key: "key", filterTermTypes: "filterTermTypes", originalValues: "originalValues", recalculatedValues: "recalculatedValues" }, ngImport: i0__namespace, template: "<he-node-logs-models *ngIf=\"!loading; else loader\"\n  [logsUrl]=\"logsUrl\"\n  [nodeType]=\"NodeType.ImpactAssessment\"\n  [nodeKey]=\"key\"\n  [originalValues]=\"originalValues\"\n  [recalculatedValues]=\"recalculatedValues\"\n  [terms]=\"emissions\"\n  [logs]=\"logs\"\n  filteredType=\"Emission\"\n></he-node-logs-models>\n\n<ng-template #loader>\n  <div class=\"has-text-center py-3\">\n    <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n  </div>\n</ng-template>\n", styles: [""], components: [{ type: NodeLogsModelsComponent, selector: "he-node-logs-models", inputs: ["nodeType", "nodeKey", "logsUrl", "originalValues", "recalculatedValues", "terms", "logs", "filteredType"] }, { type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsProductsLogsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8801,7 +8954,7 @@
         return ImpactAssessmentsProductsComponent;
     }());
     ImpactAssessmentsProductsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsProductsComponent, deps: [{ token: i1__namespace$4.FormBuilder }, { token: HeNodeService }, { token: HeSearchService }, { token: HeToastService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ImpactAssessmentsProductsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsProductsComponent, selector: "he-impact-assessments-products", inputs: { cycles: "cycles", impactAssessments: "impactAssessments", key: "key", dataState: "dataState", enableCompare: "enableCompare", filterTermTypes: "filterTermTypes", enableFilterMethodModel: "enableFilterMethodModel" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"indicators.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"impactAssessments.length > 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.chart\" (click)=\"selectedView = View.chart\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"chart-bar\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Chart view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"enableBreakdown\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.breakdown\" (click)=\"selectedView = View.breakdown\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"chart-bar\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Breakdown view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && impactAssessments.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"showRecalculationLogs()\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\" *bindOnce=\"indicators\">\n      <table class=\"table is-narrow data-table has-children-{{indicators.length + 1}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\">\n              <div class=\"select is-small\" *ngIf=\"enableFilterMethodModel\">\n                <select name=\"selectedMethodModel\"\n                  (change)=\"updateImpacts()\" [(ngModel)]=\"selectedMethodModel\"\n                >\n                  <option [ngValue]=\"undefined\">Filter Model</option>\n                  <option *ngFor=\"let term of methodModels\" [ngValue]=\"term\">{{term.name}}</option>\n                </select>\n              </div>\n            </th>\n            <th></th>\n            <th *ngFor=\"let indicator of indicators\"\n              [attr.title]=\"indicator.value.term.name\"\n            >\n              <he-node-link [node]=\"indicator.value.term\">\n                <span>{{indicator.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\">\n              <a [href]=\"baseUrl + '/schema/ImpactAssessment#functionalUnit'\" target=\"_blank\">Functional unit:</a>\n              <span class=\"pl-1\">1 kg</span>\n            </th>\n            <th>Product</th>\n            <th *ngFor=\"let indicator of indicators\"\n              [attr.title]=\"indicator.value.term.units\"\n            >{{indicator.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let impactAssessment of impactAssessments; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"impactName(impactAssessment)\" [style.border-left-color]=\"itemColor(i)\">\n              <label *ngIf=\"enableCompare\" class=\"is-inline-block checkbox\">\n                <input type=\"checkbox\" class=\"selector\"\n                  (change)=\"toggleImpact(impactAssessment)\"\n                  [checked]=\"isSelected(impactAssessment)\"\n                >\n              </label>\n              <he-node-link class=\"is-inline-block\" [node]=\"impactAssessment\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{impactName(impactAssessment)}}</span>\n              </he-node-link>\n            </td>\n            <td [attr.title]=\"impactAssessment.product?.name\">\n              <he-node-link *ngIf=\"impactAssessment.product\" [node]=\"impactAssessment.product\">\n                <span>{{impactAssessment.product.name | ellipsis:30}}</span>\n              </he-node-link>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let indicator of indicators\">\n              <span *ngIf=\"indicator.value.values[impactAssessment['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: indicator.value.values[impactAssessment['@id']], impactAssessment: impactAssessment, key: key })\"\n              >\n                <span pointer>{{propertyValue(indicator.value.values[impactAssessment['@id']].value, key === 'impacts') | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"indicator.value.values[impactAssessment['@id']].nodes[0]\"\n                  key=\"value\"\n                  [state]=\"impactAssessment.aggregated ? 'aggregated' : null\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n\n    <form *ngIf=\"enableCompare\" class=\"mt-2\" [formGroup]=\"form\" (submit)=\"form.valid && addImpact()\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <span class=\"button is-small is-static\">Compare with Aggregated Impact Assessment</span>\n        </div>\n        <div class=\"control is-expanded\" [class.has-icons-right]=\"suggesting || loading\">\n          <input class=\"input is-small\"\n            placeholder=\"Search by name or id\"\n            formControlName=\"search\" name=\"search\"\n\n            [ngbTypeahead]=\"suggestImpactAssessment\"\n            [inputFormatter]=\"formatter\"\n            [resultTemplate]=\"suggestion\"\n            [focusFirst]=\"true\"\n          >\n          <span class=\"icon is-small is-right has-text-grey-dark\" [class.is-hidden]=\"!(suggesting || loading)\">\n            <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"sm\"></fa-icon>\n          </span>\n        </div>\n        <div class=\"control\">\n          <button class=\"button is-small\" type=\"submit\" [disabled]=\"suggesting || loading\">\n            <fa-icon icon=\"plus\"></fa-icon>\n          </button>\n        </div>\n      </div>\n    </form>\n  </div>\n\n  <he-impact-assessments-indicator-breakdown-chart *ngIf=\"selectedView === View.breakdown\"\n    [impactAssessment]=\"impactAssessments[0]\"\n    [indicators]=\"impactAssessments[0][key]\"\n  ></he-impact-assessments-indicator-breakdown-chart>\n\n  <he-impact-assessments-indicators-chart *ngIf=\"impactAssessments.length > 1\" [class.is-hidden]=\"selectedView !== View.chart\"\n    [key]=\"key\"\n    [impactAssessments]=\"selectedImpactAssessments\"\n    [filterTermTypes]=\"filterTermTypes\"\n  ></he-impact-assessments-indicators-chart>\n\n  <he-impact-assessments-products-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [key]=\"key\"\n    [impactAssessment]=\"impactAssessments[0]\"\n    [filterTermTypes]=\"filterTermTypes\"\n    [originalValues]=\"originalValues[0][key]\"\n    [recalculatedValues]=\"impactAssessments[0][key]\"\n  ></he-impact-assessments-products-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"impactAssessments\" [filename]=\"'impact-' + key + '.csv'\" [isUpload]=\"false\"\n  [headerKeys]=\"['impactAssessment.id', 'impactAssessment.@id', 'impactAssessment.' + key + '.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"impactAssessment\" let-data=\"data\" let-key=\"key\">\n  <p *bindOnce=\"node\">\n    <b>\n      <span *ngIf=\"data.cycle\">{{cycleLabel(node.cycle)}}</span>\n      <span *ngIf=\"!data.cycle\">{{data.name}}</span>\n    </b>\n  </p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n\n<ng-template #suggestion let-impact=\"result\" let-t=\"term\">\n  <div class=\"is-block\">\n    <ngb-highlight [result]=\"impact.name || impact.cycle.name\" [term]=\"t\"></ngb-highlight>\n  </div>\n  <div class=\"columns is-flex\">\n    <div class=\"column\" *ngIf=\"impact.country\">\n      <span class=\"pr-1 has-text-underline\">Country:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.country.name\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n    <div class=\"column\" *ngIf=\"impact.product\">\n      <span class=\"pr-1 has-text-underline\">Product:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.product.name\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n    <div class=\"column\" *ngIf=\"impact.endDate\">\n      <span class=\"pr-1 has-text-underline\">Date:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.endDate\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n  </div>\n</ng-template>\n", styles: ["label.checkbox{width:20px}td he-node-link{width:160px}table.data-table td:first-child{border-left-width:8px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: ImpactAssessmentsIndicatorBreakdownChartComponent, selector: "he-impact-assessments-indicator-breakdown-chart", inputs: ["impactAssessment", "indicators"] }, { type: ImpactAssessmentsIndicatorsChartComponent, selector: "he-impact-assessments-indicators-chart", inputs: ["impactAssessments", "key", "filterTermTypes"] }, { type: ImpactAssessmentsProductsLogsComponent, selector: "he-impact-assessments-products-logs", inputs: ["impactAssessment", "key", "filterTermTypes", "originalValues", "recalculatedValues"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
+    ImpactAssessmentsProductsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ImpactAssessmentsProductsComponent, selector: "he-impact-assessments-products", inputs: { cycles: "cycles", impactAssessments: "impactAssessments", key: "key", dataState: "dataState", enableCompare: "enableCompare", filterTermTypes: "filterTermTypes", enableFilterMethodModel: "enableFilterMethodModel" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"indicators.length; else emptyTable\">\n  <div class=\"columns is-variable is-2 m-0\">\n    <div class=\"column is-hidden-mobile\"></div>\n    <div class=\"column is-narrow\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.table\" (click)=\"selectedView = View.table\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"list\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Table view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"impactAssessments.length > 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.chart\" (click)=\"selectedView = View.chart\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"chart-bar\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Chart view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"enableBreakdown\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.breakdown\" (click)=\"selectedView = View.breakdown\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"chart-bar\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Breakdown view</span>\n          </button>\n        </div>\n        <div class=\"control\" *ngIf=\"!isOriginal && impactAssessments.length === 1\">\n          <button class=\"button is-small\" [class.is-active]=\"selectedView === View.logs\" (click)=\"showRecalculationLogs()\">\n            <span class=\"icon is-small\">\n              <fa-icon icon=\"calculator\" aria-hidden=\"true\"></fa-icon>\n            </span>\n            <span>Recalculations logs</span>\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"px-3 pb-3\" [class.is-hidden]=\"selectedView !== View.table\">\n    <div class=\"has-text-right mb-2\">\n      <button class=\"button is-dark is-outlined is-small\" (click)=\"showDownload = true\">\n        <fa-icon icon=\"download\"></fa-icon>\n        <span class=\"pl-2\">Download (CSV)</span>\n      </button>\n    </div>\n\n    <div class=\"table-container data-table-container mb-1\" *bindOnce=\"indicators\">\n      <table class=\"table is-narrow data-table has-children-{{indicators.length + 1}}\">\n        <thead>\n          <tr>\n            <th class=\"width-auto\">\n              <div class=\"select is-small\" *ngIf=\"enableFilterMethodModel\">\n                <select name=\"selectedMethodModel\"\n                  (change)=\"updateImpacts()\" [(ngModel)]=\"selectedMethodModel\"\n                >\n                  <option [ngValue]=\"undefined\">Filter Model</option>\n                  <option *ngFor=\"let term of methodModels\" [ngValue]=\"term\">{{term.name}}</option>\n                </select>\n              </div>\n            </th>\n            <th></th>\n            <th *ngFor=\"let indicator of indicators\"\n              [attr.title]=\"indicator.value.term.name\"\n            >\n              <he-node-link [node]=\"indicator.value.term\">\n                <span>{{indicator.value.term.name | ellipsis:30}}</span>\n              </he-node-link>\n            </th>\n          </tr>\n          <tr>\n            <th class=\"width-auto\">\n              <a [href]=\"baseUrl + '/schema/ImpactAssessment#functionalUnit'\" target=\"_blank\">Functional unit:</a>\n              <span class=\"pl-1\">1 kg</span>\n            </th>\n            <th>Product</th>\n            <th *ngFor=\"let indicator of indicators\"\n              [attr.title]=\"indicator.value.term.units\"\n            >{{indicator.value.term.units}}</th>\n          </tr>\n        </thead>\n        <tbody>\n          <tr *ngFor=\"let impactAssessment of impactAssessments; trackBy: trackById; let i = index\">\n            <td class=\"width-auto\" [attr.title]=\"impactName(impactAssessment)\" [style.border-left-color]=\"itemColor(i)\">\n              <label *ngIf=\"enableCompare\" class=\"is-inline-block checkbox\">\n                <input type=\"checkbox\" class=\"selector\"\n                  (change)=\"toggleImpact(impactAssessment)\"\n                  [checked]=\"isSelected(impactAssessment)\"\n                >\n              </label>\n              <he-node-link class=\"is-inline-block\" [node]=\"impactAssessment\">\n                <span class=\"is-nowrap has-text-ellipsis\">{{i + 1}}. {{impactName(impactAssessment)}}</span>\n              </he-node-link>\n            </td>\n            <td [attr.title]=\"impactAssessment.product?.name\">\n              <he-node-link *ngIf=\"impactAssessment.product\" [node]=\"impactAssessment.product\">\n                <span>{{impactAssessment.product.name | ellipsis:30}}</span>\n              </he-node-link>\n            </td>\n            <td class=\"is-nowrap\" *ngFor=\"let indicator of indicators\">\n              <span *ngIf=\"indicator.value.values[impactAssessment['@id']]; else emptyValue\"\n                class=\"trigger-popover\"\n                [ngbPopover]=\"details\" [autoClose]=\"'outside'\"\n                triggers=\"manual\" #p=\"ngbPopover\" placement=\"left\" container=\"body\"\n                (click)=\"togglePopover(p, { data: indicator.value.values[impactAssessment['@id']], impactAssessment: impactAssessment, key: key })\"\n              >\n                <span pointer>{{propertyValue(indicator.value.values[impactAssessment['@id']].value, key === 'impacts') | precision:3 | default:'-'}}</span>\n                <he-blank-node-state class=\"ml-1\"\n                  [node]=\"indicator.value.values[impactAssessment['@id']].nodes[0]\"\n                  key=\"value\"\n                  [state]=\"impactAssessment.aggregated ? 'aggregated' : null\"\n                ></he-blank-node-state>\n              </span>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    </div>\n\n    <he-blank-node-state-notice [dataState]=\"dataState\"></he-blank-node-state-notice>\n\n    <form *ngIf=\"enableCompare\" class=\"mt-2\" [formGroup]=\"form\" (submit)=\"form.valid && addImpact()\">\n      <div class=\"field has-addons\">\n        <div class=\"control\">\n          <span class=\"button is-small is-static\">Compare with Aggregated Impact Assessment</span>\n        </div>\n        <div class=\"control is-expanded\" [class.has-icons-right]=\"suggesting || loading\">\n          <input class=\"input is-small\"\n            placeholder=\"Search by name or id\"\n            formControlName=\"search\" name=\"search\"\n\n            [ngbTypeahead]=\"suggestImpactAssessment\"\n            [inputFormatter]=\"formatter\"\n            [resultTemplate]=\"suggestion\"\n            [focusFirst]=\"true\"\n          >\n          <span class=\"icon is-small is-right has-text-grey-dark\" [class.is-hidden]=\"!(suggesting || loading)\">\n            <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"sm\"></fa-icon>\n          </span>\n        </div>\n        <div class=\"control\">\n          <button class=\"button is-small\" type=\"submit\" [disabled]=\"suggesting || loading\">\n            <fa-icon icon=\"plus\"></fa-icon>\n          </button>\n        </div>\n      </div>\n    </form>\n  </div>\n\n  <he-impact-assessments-indicator-breakdown-chart *ngIf=\"selectedView === View.breakdown\"\n    [impactAssessment]=\"impactAssessments[0]\"\n    [indicators]=\"impactAssessments[0][key]\"\n  ></he-impact-assessments-indicator-breakdown-chart>\n\n  <he-impact-assessments-indicators-chart *ngIf=\"impactAssessments.length > 1\" [class.is-hidden]=\"selectedView !== View.chart\"\n    [key]=\"key\"\n    [impactAssessments]=\"selectedImpactAssessments\"\n    [filterTermTypes]=\"filterTermTypes\"\n  ></he-impact-assessments-indicators-chart>\n\n  <he-impact-assessments-products-logs *ngIf=\"selectedView === View.logs && !isOriginal\"\n    [key]=\"key\"\n    [impactAssessment]=\"impactAssessments[0]\"\n    [filterTermTypes]=\"filterTermTypes\"\n    [originalValues]=\"originalValues[0][key]\"\n    [recalculatedValues]=\"impactAssessments[0][key]\"\n  ></he-impact-assessments-products-logs>\n</ng-container>\n\n<he-node-csv-export-confirm *ngIf=\"showDownload\"\n  [nodes]=\"impactAssessments\" [filename]=\"'impact-' + key + '.csv'\" [isUpload]=\"false\"\n  [headerKeys]=\"['impactAssessment.id', 'impactAssessment.@id', 'impactAssessment.' + key + '.']\"\n  (closed)=\"showDownload = false\"\n></he-node-csv-export-confirm>\n\n<ng-template #emptyTable>\n  <div class=\"panel-block\">\n    <span>No data</span>\n  </div>\n</ng-template>\n\n<ng-template #emptyValue>\n  <span>-</span>\n</ng-template>\n\n<ng-template #details let-node=\"impactAssessment\" let-data=\"data\" let-key=\"key\">\n  <p *bindOnce=\"node\">\n    <b>\n      <span *ngIf=\"data.cycle\">{{cycleLabel(node.cycle)}}</span>\n      <span *ngIf=\"!data.cycle\">{{data.name}}</span>\n    </b>\n  </p>\n  <he-node-value-details\n    [data]=\"data\" [nodeType]=\"node['@type']\" [dataKey]=\"key\"\n  ></he-node-value-details>\n</ng-template>\n\n<ng-template #suggestion let-impact=\"result\" let-t=\"term\">\n  <div class=\"is-block\">\n    <ngb-highlight [result]=\"impact.name || impact.cycle.name\" [term]=\"t\"></ngb-highlight>\n  </div>\n  <div class=\"columns is-flex\">\n    <div class=\"column\" *ngIf=\"impact.country\">\n      <span class=\"pr-1 has-text-underline\">Country:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.country.name\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n    <div class=\"column\" *ngIf=\"impact.product\">\n      <span class=\"pr-1 has-text-underline\">Product:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.product.name\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n    <div class=\"column\" *ngIf=\"impact.endDate\">\n      <span class=\"pr-1 has-text-underline\">Date:</span>\n      <span class=\"is-inline-flex\"><ngb-highlight [result]=\"impact.endDate\" [term]=\"t\"></ngb-highlight></span>\n    </div>\n  </div>\n</ng-template>\n", styles: ["label.checkbox{width:20px}td he-node-link{width:160px}table.data-table td:first-child{border-left-width:8px}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { type: NodeLinkComponent, selector: "he-node-link", inputs: ["node", "showExternalLink"] }, { type: BlankNodeStateComponent, selector: "he-blank-node-state", inputs: ["nodeType", "dataKey", "key", "node", "state"] }, { type: BlankNodeStateNoticeComponent, selector: "he-blank-node-state-notice", inputs: ["dataState", "showDeleted"] }, { type: ImpactAssessmentsIndicatorBreakdownChartComponent, selector: "he-impact-assessments-indicator-breakdown-chart", inputs: ["impactAssessment", "indicators"] }, { type: ImpactAssessmentsIndicatorsChartComponent, selector: "he-impact-assessments-indicators-chart", inputs: ["impactAssessments", "key", "filterTermTypes"] }, { type: ImpactAssessmentsProductsLogsComponent, selector: "he-impact-assessments-products-logs", inputs: ["impactAssessment", "key", "filterTermTypes", "originalValues", "recalculatedValues"] }, { type: NodeCsvExportConfirmComponent, selector: "he-node-csv-export-confirm", inputs: ["nodes", "filename", "headerKeys", "extension", "isUpload"], outputs: ["closed"] }, { type: NodeValueDetailsComponent, selector: "he-node-value-details", inputs: ["data", "nodeType", "dataKey"] }, { type: i10__namespace.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i1__namespace$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { type: i1__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1__namespace$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10__namespace.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ImpactAssessmentsProductsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8840,14 +8993,14 @@
     HeImpactAssessmentsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeImpactAssessmentsModule, declarations: [ImpactAssessmentsProductsComponent,
             ImpactAssessmentsIndicatorsChartComponent,
             ImpactAssessmentsProductsLogsComponent,
-            ImpactAssessmentsIndicatorBreakdownChartComponent], imports: [i3.CommonModule, i4.RouterModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
+            ImpactAssessmentsIndicatorBreakdownChartComponent], imports: [i6.CommonModule, i5.RouterModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
             HeCommonModule,
             HeNodeModule], exports: [ImpactAssessmentsProductsComponent,
             ImpactAssessmentsIndicatorsChartComponent,
             ImpactAssessmentsProductsLogsComponent,
             ImpactAssessmentsIndicatorBreakdownChartComponent] });
     HeImpactAssessmentsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: HeImpactAssessmentsModule, imports: [[
-                i3.CommonModule, i4.RouterModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
+                i6.CommonModule, i5.RouterModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
                 HeCommonModule,
                 HeNodeModule
             ]] });
@@ -8857,7 +9010,7 @@
                         declarations: components,
                         exports: components,
                         imports: [
-                            i3.CommonModule, i4.RouterModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
+                            i6.CommonModule, i5.RouterModule, i1$2.FormsModule, i1$2.ReactiveFormsModule,
                             HeCommonModule,
                             HeNodeModule
                         ]
@@ -8912,7 +9065,6 @@
     exports.ARRAY_DELIMITER = ARRAY_DELIMITER;
     exports.BibliographiesSearchConfirmComponent = BibliographiesSearchConfirmComponent;
     exports.BindOnceDirective = BindOnceDirective;
-    exports.BlankNodeDiffsComponent = BlankNodeDiffsComponent;
     exports.BlankNodeStateComponent = BlankNodeStateComponent;
     exports.BlankNodeStateNoticeComponent = BlankNodeStateNoticeComponent;
     exports.BlankNodeValueDeltaComponent = BlankNodeValueDeltaComponent;
@@ -8925,6 +9077,8 @@
     exports.CyclesEmissionsComponent = CyclesEmissionsComponent;
     exports.CyclesEmissionsLogsComponent = CyclesEmissionsLogsComponent;
     exports.CyclesFunctionalUnitMeasureComponent = CyclesFunctionalUnitMeasureComponent;
+    exports.CyclesPracticesComponent = CyclesPracticesComponent;
+    exports.CyclesPracticesLogsComponent = CyclesPracticesLogsComponent;
     exports.CyclesResultComponent = CyclesResultComponent;
     exports.CyclesSuggestFormComponent = CyclesSuggestFormComponent;
     exports.DefaultPipe = DefaultPipe;