npm - @hestia-earth/ui-components - Versions diffs - 0.0.16 → 0.0.17 - Mend

@hestia-earth/ui-components 0.0.16 → 0.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (25) hide show

package/fesm2015/hestia-earth-ui-components.js CHANGED Viewed

@@ -20,6 +20,7 @@ import { getColor } from 'random-material-color';
 import { EmissionMethodTier, NodeType, isExpandable, TermTermType, nestedSearchableKeys, SchemaType, SCHEMA_VERSION, sortKeysByType, CycleFunctionalUnit, SiteSiteType, isTypeValid, isTypeNode, typeToSchemaType } from '@hestia-earth/schema';
 import { fileToExt, nodeTypeToParam, DataState, SupportedExtensions } from '@hestia-earth/api';
 import { isEmpty, isUndefined, isNumber, toPrecision, isBoolean, ConvertUnits, converters, convertValue, isEqual, unique, diffInDays } from '@hestia-earth/utils';
+import { getArrayTreatment } from '@hestia-earth/glossary';
 import * as pluralize from 'pluralize';
 import { catchError, map, take, mergeMap, debounceTime, distinctUntilChanged, tap, switchMap, reduce, filter, distinct, toArray, mergeAll, groupBy } from 'rxjs/operators';
 import { __rest, __awaiter } from 'tslib';
@@ -288,17 +289,11 @@ const safeJSONParse = (value, defaultValue) => {
 };
 const safeJSONStringify = (value) => typeof value === 'string' ? value : JSON.stringify(value);
 const arrayValue = (values, isAverage) => (values || []).reduce((prev, curr) => prev + parseFloat(`${curr}`), 0) / (isAverage ? values.length : 1);
-const propertyValue$1 = (value, isAverage = false) => typeof value === 'undefined' || value === null ?
+const propertyValue$1 = (value, termId) => typeof value === 'undefined' || value === null ?
     null :
-    (Array.isArray(value) ? arrayValue(value, isAverage) : parseFloat(`${value}`));
-const dataValue = (data, index, property) => {
-    try {
-        return propertyValue$1(data[property][index].value);
-    }
-    catch (err) {
-        return null;
-    }
-};
+    (Array.isArray(value) ?
+        arrayValue(value, (termId ? getArrayTreatment(termId) : null) === 'mean') :
+        parseFloat(`${value}`));
 ;
 ;
 const grouppedKeys = (values) => Object.entries(values).map(([key, value]) => ({ key, value }));
@@ -352,7 +347,7 @@ const groupNodesByTerm = (nodes = [], key, originalValues = [], filterMethod) =>
             const originalValue = get$5(originalValues, `[${index}].${key}`, []).filter((val) => val.term['@id'] === termId);
             if (originalValue.length > 0) {
                 const value = originalValue.reduce((array, curr) => concatBlankNodeValue(array, curr.value), []);
-                group.originalValues[nodeId] = { value: propertyValue$1(value) };
+                group.originalValues[nodeId] = { value: propertyValue$1(value, termId) };
             }
         });
     });
@@ -4317,7 +4312,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
 const get$3 = require('lodash.get');
 const orderBy$5 = require('lodash.orderby');
-const reduceValues = (values) => values.length ? values.reduce((p, v) => p + propertyValue$1(v.value), 0) : null;
+const reduceValues = (values, termId) => values.length ? values.reduce((p, v) => p + propertyValue$1(v.value, termId), 0) : null;
 const logSubValue = (logs, key, prop) => logs[key][prop] ? (Array.isArray(logs[key][prop]) ?
     logs[key][prop].map(value => ({ key: prop, value })) :
     { key: prop, value: logs[key][prop] }) : undefined;
@@ -4392,8 +4387,8 @@ class NodeLogsModelsComponent {
                     term,
                     type,
                     configModels,
-                    original: reduceValues(original),
-                    recalculated: reduceValues(recalculated),
+                    original: reduceValues(original, term['@id']),
+                    recalculated: reduceValues(recalculated, term['@id']),
                     isRecalculated: !recalculated.length || recalculated.some(v => ([
                         ...(v.added || []),
                         ...(v.updated || [])
@@ -4543,7 +4538,9 @@ const additionalKeys = [
     'term', 'source', 'variety', 'reliability', 'price', 'currency', 'cost', 'revenue', 'economicValueShare',
     'impactAssessment'
 ];
-const tableKeys = ['inputs', 'value', 'methodModel', 'methodTier', 'statsDefinition'];
+const tableKeys = [
+    'inputs', 'value', 'methodModel', 'methodTier', 'statsDefinition'
+];
 class NodeValueDetailsComponent {
     constructor() {
         this.baseUrl = baseUrl();
@@ -4807,7 +4804,7 @@ class CyclesActivityComponent {
     }
 }
 CyclesActivityComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CyclesActivityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CyclesActivityComponent.ɵcmp = i0.ɵɵ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, 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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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.ɵɵ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, 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, product.value.term['@id']) | 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, input.value.term['@id']) | 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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CyclesActivityComponent, decorators: [{
             type: Component$1,
             args: [{
@@ -4860,10 +4857,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
 const cycleValue = (cycle, values) => { var _a; return (((_a = values[cycle['@id']]) === null || _a === void 0 ? void 0 : _a.nodes[0]) || { value: [0] }).value; };
 const cycleName = (cycle, index) => `${index + 1}. ${cycle.name}`;
-const cycleDataset = (values) => (cycle, index) => {
+const cycleDataset = (values, termId) => (cycle, index) => {
     const label = cycleName(cycle, index);
     const color = itemColor(index);
-    const data = [propertyValue$1(cycleValue(cycle, values))];
+    const data = [propertyValue$1(cycleValue(cycle, values), termId)];
     return {
         label,
         axis: 'y',
@@ -4897,8 +4894,9 @@ class CyclesEmissionsChartComponent {
     updateChart() {
         var _a, _b, _c;
         const labels = [(_b = (_a = this.selectedTerm) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : ''];
-        const { values } = this.emissionPerCycle[this.selectedTerm['@id']];
-        const datasets = this.cycles.map(cycleDataset(values));
+        const termId = this.selectedTerm['@id'];
+        const { values } = this.emissionPerCycle[termId];
+        const datasets = this.cycles.map(cycleDataset(values, termId));
         if (this.chart) {
             this.chart.destroy();
         }
@@ -5078,7 +5076,7 @@ class CyclesEmissionsComponent {
     }
 }
 CyclesEmissionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CyclesEmissionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CyclesEmissionsComponent.ɵcmp = i0.ɵɵ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, 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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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.ɵɵ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, 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, emission.value.term['@id']) | 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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CyclesEmissionsComponent, decorators: [{
             type: Component$1,
             args: [{
@@ -5214,7 +5212,7 @@ class CyclesPracticesComponent {
     }
 }
 CyclesPracticesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CyclesPracticesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CyclesPracticesComponent.ɵcmp = i0.ɵɵ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, 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 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 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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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 } });
+CyclesPracticesComponent.ɵcmp = i0.ɵɵ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, 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 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 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, practice.value.term['@id']) | 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: ["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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: CyclesPracticesComponent, decorators: [{
             type: Component$1,
             args: [{
@@ -5252,14 +5250,14 @@ class CyclesResultComponent {
     init() {
         const labels = this.cycles.map(({ name }, index) => `${index + 1}. ${name}`);
         const productsPerCycle = groupNodesByTerm(this.cycles, 'products');
-        const datasets = Object.values(productsPerCycle).map(({ term: { name, units }, values }, index) => {
+        const datasets = Object.values(productsPerCycle).map(({ term: { name, units, '@id': termId }, values }, index) => {
             const color = itemColor(index);
             return {
                 label: `${name}${units ? ` (in ${units})` : ''}`,
                 backgroundColor: color,
                 borderColor: color,
                 barPercentage: 0.5,
-                data: this.cycles.map(({ '@id': id }) => values[id] ? propertyValue$1(values[id].value) : 0)
+                data: this.cycles.map(({ '@id': id }) => values[id] ? propertyValue$1(values[id].value, termId) : 0)
             };
         });
         this.updateChart(datasets, labels);
@@ -5420,6 +5418,7 @@ const customErrorMessage = {
     'should match pattern "^\\d{13}$"': () => `should be composed of 13 numbers`,
     'should match pattern "^[0-9]{4}(-[0-9]{2})?(-[0-9]{2})?$"': () => dateFormatMessage,
     'should match pattern "^([0-9]{4}|-)(-[0-9]{2})?(-[0-9]{2})?$"': () => dateFormatMessage,
+    'should match pattern "^([0-9]{4}|-)(-[0-9]{2})?(-[0-9]{2})?([T][0-2][0-9]\:[0-5][0-9]\:[0-5][0-9]((\+|\-)[0-1][0-9]:[0-5][0-9])?)?$"': () => dateFormatMessage,
     'must be within the country': () => `The country provided does not contain the region provided. Please check
   the country for errors or the region for errors, and reference the ${glossaryLink('Glossary of Terms')}.`,
     [mapErrorMessage]: ({ dataPath }) => dataPath === '.region' ? `The region provided does not contain the longitude and latitude provided. Please check the
@@ -6295,9 +6294,9 @@ const siteTooBig = ({ area }) => area && area / 100 > maxAreaSize;
 const hasMultipleValues = (values) => (values || []).length > 1;
 const weighedAverage = ({ value, depthLower, depthUpper }) => value.reduce((prev, curr, index) => prev + (curr * (depthLower[index] - depthUpper[index])), 0) /
     value.reduce((prev, _curr, index) => prev + (depthLower[index] - depthUpper[index]), 0);
-const measurementValue = ({ value, depthLower, depthUpper }) => hasMultipleValues(value) && hasMultipleValues(depthLower) && hasMultipleValues(depthUpper) ?
+const measurementValue = ({ value, depthLower, depthUpper }, termId) => hasMultipleValues(value) && hasMultipleValues(depthLower) && hasMultipleValues(depthUpper) ?
     weighedAverage({ value, depthLower, depthUpper }) :
-    propertyValue$1(value);
+    propertyValue$1(value, termId);
 class SitesMeasurementsLogsComponent {
     constructor(searchService, nodeService) {
@@ -6396,7 +6395,7 @@ class SitesMeasurementsComponent {
     }
 }
 SitesMeasurementsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SitesMeasurementsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SitesMeasurementsComponent.ɵcmp = i0.ɵɵ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, 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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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.ɵɵ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, 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']], measurement.value.term['@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.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", "showAggregated", "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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.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.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SitesMeasurementsComponent, decorators: [{
             type: Component$1,
             args: [{
@@ -7435,7 +7434,7 @@ class ImpactAssessmentsProductsComponent {
     }
 }
 ImpactAssessmentsProductsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ImpactAssessmentsProductsComponent, deps: [{ token: i1$4.FormBuilder }, { token: HeNodeService }, { token: HeSearchService }, { token: HeToastService }], target: i0.ɵɵFactoryTarget.Component });
-ImpactAssessmentsProductsComponent.ɵcmp = i0.ɵɵ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, 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.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", "showAggregated", "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.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i1$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$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.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
+ImpactAssessmentsProductsComponent.ɵcmp = i0.ɵɵ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, 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, indicator.value.term['@id']) | 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.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", "showAggregated", "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.NgbHighlight, selector: "ngb-highlight", inputs: ["highlightClass", "result", "term"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { type: i1$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disablePopover", "popoverClass", "openDelay", "closeDelay", "ngbPopover", "popoverTitle"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$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.NgbTypeahead, selector: "input[ngbTypeahead]", inputs: ["autocomplete", "placement", "container", "editable", "focusFirst", "showHint", "inputFormatter", "ngbTypeahead", "resultFormatter", "resultTemplate"], outputs: ["selectItem"], exportAs: ["ngbTypeahead"] }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "ellipsis": EllipsisPipe, "default": DefaultPipe, "precision": PrecisionPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ImpactAssessmentsProductsComponent, decorators: [{
             type: Component$1,
             args: [{
@@ -7528,5 +7527,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
  * Generated bundle index. Do not edit.
  */
-export { ARRAY_DELIMITER, BibliographiesSearchConfirmComponent, BindOnceDirective, BlankNodeStateComponent, BlankNodeStateNoticeComponent, BlankNodeValueDeltaComponent, ClickOutsideDirective, ClipboardComponent, CyclesActivityComponent, CyclesActivityLogsComponent, CyclesCompletenessComponent, CyclesEmissionsChartComponent, CyclesEmissionsComponent, CyclesEmissionsLogsComponent, CyclesFunctionalUnitMeasureComponent, CyclesPracticesComponent, CyclesPracticesLogsComponent, CyclesResultComponent, CyclesSuggestFormComponent, DefaultPipe, DeltaColour, DeltaDisplayType, DiffsDisplayType, EllipsisPipe, FilesFormComponent, GetPipe, HE_API_BASE_URL, HE_ORCHESTRATOR_BASE_URL, HeAggregationEngineService, HeAuthService, HeBibliographiesModule, HeCommonLightModule, HeCommonModule, HeCommonService, HeCyclesModule, HeEngineService, HeFilesModule, HeFontawesomeModule, HeImpactAssessmentsModule, HeMendeleyService, HeNodeCsvService, HeNodeModule, HeNodeService, HeSchemaService, HeSearchModule, HeSearchService, HeSitesModule, HeToastService, HeUsersService, ImpactAssessmentsIndicatorBreakdownChartComponent, ImpactAssessmentsIndicatorsChartComponent, ImpactAssessmentsProductsComponent, ImpactAssessmentsProductsLogsComponent, KeyToLabelPipe, KeysPipe, Level, LinkKeyValueComponent, MAX_RESULTS, MapsDrawingConfirmComponent, MendeleySearchResult, NodeCsvExportConfirmComponent, NodeCsvSelectHeadersComponent, NodeDiffsComponent, NodeIconComponent, NodeLinkComponent, NodeLogsFileComponent, NodeLogsModelsComponent, NodeMissingLookupFactorsComponent, NodeValueDetailsComponent, PluralizePipe, PopoverComponent, PopoverConfirmComponent, PrecisionPipe, SchemaVersionLinkComponent, SitesMapsComponent, SitesMeasurementsComponent, SitesMeasurementsLogsComponent, SkeletonTextComponent, SocialTagsComponent, TagsInputDirective, TimesPipe, ToastComponent, UnitConverterComponent, addPolygonToFeature, allCountriesQuery, arrayValue, availableProperties, baseUrl, bottom, buildSummary, calculateCycleDuration, calculateCycleDurationEnabled, calculateCycleStartDate, calculateCycleStartDateEnabled, calculatePercentDelta, clustererImage, code, coordinatesToPoint, countriesQuery, createMarker, cropsQuery, customDeltaFuncs, dataPathToKey, dataValue, defaultFeature, defaultLabel, defaultSuggestionType, definitionToSchemaType, delta, deserializeSearchFilters, ellipsis, emptyValue, errorHasError, errorHasWarning, errorText, evaluateSuccess, filenameWithoutExt, fillColor, fillStyle, filterError, filterParams, findConfigModels, findProperty, findPropertyById, formatCustomErrorMessage, formatError, formatLinkNodesSuggestions, formatPropertyError, formatSuggestion, gitBranch, gitHome, gitRawBaseUrl, groupChanged, groupNodesByTerm, grouppedKeys, grouppedValueKeys, handleAPIError, hasError, hasWarning, isAddPropertyEnabled, isChrome, isExternal, isMissingOneOfError, isMissingPropertyError, isSchemaIri, isScrolledBelow, itemColor, keyToDataPath, keyToLabel, levels, linkTypeEnabled, listColor, locationQuery, lookupUrl, lookups, mapsUrl, markerIcon, markerPie, matchAggregatedQuery, matchBoolPrefixQuery, matchCountry, matchExactQuery, matchGlobalRegion, matchNameNormalized, matchNestedKey, matchPhrasePrefixQuery, matchPhraseQuery, matchQuery, matchRegex, matchRegion, matchTermType, matchType, maxAreaSize, measurementValue, missingNodeErrorMessage, missingNodeErrors, multiMatchQuery, nestedProperty, nestingEnabled, nestingTypeEnabled, nodeAvailableProperties, nodeLink, nodeLogsUrl, nodeUrl, numberGte, parentKey, parentProperty, parseData, parseDataPath, parseLines, parseMessage, parseNewValue, pathToApiDocsPath, pointToCoordinates, polygonBounds, polygonToCoordinates, polygonsFromFeature, primaryProduct, propertyError, propertyId, propertyValue$1 as propertyValue, recursiveProperties, refToSchemaType, refreshPropertyKeys, regionsQuery, repeat, roundValue, safeJSONParse, safeJSONStringify, schemaRequiredProperties, schemaTypeToDefaultValue, scrollToEl, scrollTop, searchQuery, searchResultsFields, searchableTypes, serializeSearchFilters, siblingProperty, singleProperty, siteTooBig, sortOrder, sortProperties, strokeColor, strokeStyle, suggestMatchQuery, suggestQuery, termChildToParent, termLocation, termLocationName, termProperties, termTypeGroups, termTypeLabel, termTypeLookupUrl, toCsv$1 as toCsv, toDashCase, typeToNewProperty, updateProperties, valueTypeToDefault, waitFor, wildcardQuery, worldRegion };
+export { ARRAY_DELIMITER, BibliographiesSearchConfirmComponent, BindOnceDirective, BlankNodeStateComponent, BlankNodeStateNoticeComponent, BlankNodeValueDeltaComponent, ClickOutsideDirective, ClipboardComponent, CyclesActivityComponent, CyclesActivityLogsComponent, CyclesCompletenessComponent, CyclesEmissionsChartComponent, CyclesEmissionsComponent, CyclesEmissionsLogsComponent, CyclesFunctionalUnitMeasureComponent, CyclesPracticesComponent, CyclesPracticesLogsComponent, CyclesResultComponent, CyclesSuggestFormComponent, DefaultPipe, DeltaColour, DeltaDisplayType, DiffsDisplayType, EllipsisPipe, FilesFormComponent, GetPipe, HE_API_BASE_URL, HE_ORCHESTRATOR_BASE_URL, HeAggregationEngineService, HeAuthService, HeBibliographiesModule, HeCommonLightModule, HeCommonModule, HeCommonService, HeCyclesModule, HeEngineService, HeFilesModule, HeFontawesomeModule, HeImpactAssessmentsModule, HeMendeleyService, HeNodeCsvService, HeNodeModule, HeNodeService, HeSchemaService, HeSearchModule, HeSearchService, HeSitesModule, HeToastService, HeUsersService, ImpactAssessmentsIndicatorBreakdownChartComponent, ImpactAssessmentsIndicatorsChartComponent, ImpactAssessmentsProductsComponent, ImpactAssessmentsProductsLogsComponent, KeyToLabelPipe, KeysPipe, Level, LinkKeyValueComponent, MAX_RESULTS, MapsDrawingConfirmComponent, MendeleySearchResult, NodeCsvExportConfirmComponent, NodeCsvSelectHeadersComponent, NodeDiffsComponent, NodeIconComponent, NodeLinkComponent, NodeLogsFileComponent, NodeLogsModelsComponent, NodeMissingLookupFactorsComponent, NodeValueDetailsComponent, PluralizePipe, PopoverComponent, PopoverConfirmComponent, PrecisionPipe, SchemaVersionLinkComponent, SitesMapsComponent, SitesMeasurementsComponent, SitesMeasurementsLogsComponent, SkeletonTextComponent, SocialTagsComponent, TagsInputDirective, TimesPipe, ToastComponent, UnitConverterComponent, addPolygonToFeature, allCountriesQuery, arrayValue, availableProperties, baseUrl, bottom, buildSummary, calculateCycleDuration, calculateCycleDurationEnabled, calculateCycleStartDate, calculateCycleStartDateEnabled, calculatePercentDelta, clustererImage, code, coordinatesToPoint, countriesQuery, createMarker, cropsQuery, customDeltaFuncs, dataPathToKey, defaultFeature, defaultLabel, defaultSuggestionType, definitionToSchemaType, delta, deserializeSearchFilters, ellipsis, emptyValue, errorHasError, errorHasWarning, errorText, evaluateSuccess, filenameWithoutExt, fillColor, fillStyle, filterError, filterParams, findConfigModels, findProperty, findPropertyById, formatCustomErrorMessage, formatError, formatLinkNodesSuggestions, formatPropertyError, formatSuggestion, gitBranch, gitHome, gitRawBaseUrl, groupChanged, groupNodesByTerm, grouppedKeys, grouppedValueKeys, handleAPIError, hasError, hasWarning, isAddPropertyEnabled, isChrome, isExternal, isMissingOneOfError, isMissingPropertyError, isSchemaIri, isScrolledBelow, itemColor, keyToDataPath, keyToLabel, levels, linkTypeEnabled, listColor, locationQuery, lookupUrl, lookups, mapsUrl, markerIcon, markerPie, matchAggregatedQuery, matchBoolPrefixQuery, matchCountry, matchExactQuery, matchGlobalRegion, matchNameNormalized, matchNestedKey, matchPhrasePrefixQuery, matchPhraseQuery, matchQuery, matchRegex, matchRegion, matchTermType, matchType, maxAreaSize, measurementValue, missingNodeErrorMessage, missingNodeErrors, multiMatchQuery, nestedProperty, nestingEnabled, nestingTypeEnabled, nodeAvailableProperties, nodeLink, nodeLogsUrl, nodeUrl, numberGte, parentKey, parentProperty, parseData, parseDataPath, parseLines, parseMessage, parseNewValue, pathToApiDocsPath, pointToCoordinates, polygonBounds, polygonToCoordinates, polygonsFromFeature, primaryProduct, propertyError, propertyId, propertyValue$1 as propertyValue, recursiveProperties, refToSchemaType, refreshPropertyKeys, regionsQuery, repeat, roundValue, safeJSONParse, safeJSONStringify, schemaRequiredProperties, schemaTypeToDefaultValue, scrollToEl, scrollTop, searchQuery, searchResultsFields, searchableTypes, serializeSearchFilters, siblingProperty, singleProperty, siteTooBig, sortOrder, sortProperties, strokeColor, strokeStyle, suggestMatchQuery, suggestQuery, termChildToParent, termLocation, termLocationName, termProperties, termTypeGroups, termTypeLabel, termTypeLookupUrl, toCsv$1 as toCsv, toDashCase, typeToNewProperty, updateProperties, valueTypeToDefault, waitFor, wildcardQuery, worldRegion };
 //# sourceMappingURL=hestia-earth-ui-components.js.map