@hestia-earth/ui-components 0.13.2 → 0.14.0

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 (11) hide show
  1. package/common/link-key-value/link-key-value.component.d.ts +1 -1
  2. package/esm2020/common/data-table/data-table.component.mjs +2 -2
  3. package/esm2020/files/files-upload-errors/files-upload-errors.component.mjs +5 -4
  4. package/esm2020/node/node-logs-models/node-logs-models.model.mjs +3 -2
  5. package/esm2020/terms/terms.model.mjs +1 -2
  6. package/fesm2015/hestia-earth-ui-components.mjs +7 -6
  7. package/fesm2015/hestia-earth-ui-components.mjs.map +1 -1
  8. package/fesm2020/hestia-earth-ui-components.mjs +7 -6
  9. package/fesm2020/hestia-earth-ui-components.mjs.map +1 -1
  10. package/files/files-upload-errors/files-upload-errors.component.d.ts +3 -2
  11. package/package.json +4 -4
package/fesm2020/hestia-earth-ui-components.mjs CHANGED
@@ -576,7 +576,6 @@ const termTypeToLabel = {
576
576
  const termKeyToLabel = {
577
577
  pubchem: 'PubChem',
578
578
  casNumber: 'CAS Number',
579
- chemidplus: 'ChemIDplus',
580
579
  agrovoc: 'AGROVOC'
581
580
  };
582
581
  const termTypeLabel = (value = 'N/A') => termTypeToLabel[value] || termKeyToLabel[value] || keyToLabel(value);
@@ -1777,10 +1776,10 @@ class DataTableComponent {
1777
1776
  }
1778
1777
  }
1779
1778
  DataTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ElementRef }, { token: NavigationMenuService }], target: i0.ɵɵFactoryTarget.Component });
1780
- DataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: DataTableComponent, selector: "he-data-table", inputs: { minHeight: "minHeight", maxHeight: "maxHeight", nbRows: "nbRows", small: "small", height: "height", width: "width" }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class.is-small": "this.isSmall" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"data-table-holder\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n>\n <div class=\"data-table-content\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n >\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none;height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(even)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(even):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] });
1779
+ DataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: DataTableComponent, selector: "he-data-table", inputs: { minHeight: "minHeight", maxHeight: "maxHeight", nbRows: "nbRows", small: "small", height: "height", width: "width" }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class.is-small": "this.isSmall" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"data-table-holder\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n>\n <div class=\"data-table-content\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n >\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none;height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(even)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(even):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] });
1781
1780
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: DataTableComponent, decorators: [{
1782
1781
  type: Component$1,
1783
- args: [{ selector: 'he-data-table', template: "<div class=\"data-table-holder\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n>\n <div class=\"data-table-content\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n >\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none;height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(even)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(even):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] }]
1782
+ args: [{ selector: 'he-data-table', template: "<div class=\"data-table-holder\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n>\n <div class=\"data-table-content\"\n [style.height]=\"height\"\n [style.width]=\"width\"\n >\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none;height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(even)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(even):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.8rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] }]
1784
1783
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: NavigationMenuService }]; }, propDecorators: { minHeight: [{
1785
1784
  type: Input
1786
1785
  }], maxHeight: [{
@@ -5448,7 +5447,8 @@ const groupParallelModels = (config, termId, modelKey, models) => {
5448
5447
  .map(v => v.length === 1 ? v[0] : v);
5449
5448
  };
5450
5449
  const allParallel = (models) => models.length === 1 && Array.isArray(models[0]) && models[0].length > 1;
5451
- const valueByMethodId = (values, methodId, termId) => propertyValue$1(values.find(v => v.methodModel?.['@id'] === methodId)?.value, termId);
5450
+ const blankNodeModelId = (value) => value['@type'] === SchemaType.Measurement ? value.method?.['@id'] : value.methodModel?.['@id'];
5451
+ const valueByMethodId = (values, methodId, termId) => propertyValue$1(values.find(v => blankNodeModelId(v) === methodId)?.value, termId);
5452
5452
  const groupParallelValues = (values, models, termId) => Array.isArray(models)
5453
5453
  ? Object.fromEntries(models.map(model => [model.methodId, valueByMethodId(values, model.methodId, termId)]))
5454
5454
  : {};
@@ -8432,6 +8432,7 @@ var ErrorKeys;
8432
8432
  (function (ErrorKeys) {
8433
8433
  ErrorKeys["NoData"] = "no-data";
8434
8434
  ErrorKeys["NoHeaders"] = "no-headers";
8435
+ ErrorKeys["InvalidJSON"] = "invalid-json";
8435
8436
  ErrorKeys["InvalidSheetName"] = "invalid-sheet-name";
8436
8437
  ErrorKeys["InvalidFirstColumn"] = "invalid-first-column";
8437
8438
  ErrorKeys["DuplicatedHeaders"] = "duplicated-headers";
@@ -8525,10 +8526,10 @@ class FilesUploadErrorsComponent {
8525
8526
  }
8526
8527
  }
8527
8528
  FilesUploadErrorsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: FilesUploadErrorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8528
- FilesUploadErrorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: FilesUploadErrorsComponent, selector: "he-files-upload-errors", inputs: { file: "file", error: "error" }, ngImport: i0, template: "<ng-container *ngIf=\"!!error\">\n <div class=\"has-text-danger\" [ngSwitch]=\"error?.message\">\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoData\">\n <p>\n No Nodes could be found in your Submission.\n Please verify the column headers match the Hestia schema.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyNotFound\">\n <div class=\"notification is-danger\" role=\"alert\">\n <p>\n <fa-icon class=\"pr-2\" icon=\"exclamation-triangle\"></fa-icon>\n <span>You have column headers that do not match the Hestia schema.</span>\n <span class=\"px-1\">Please refer to the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">schema</a>\n <span class=\"pl-1\">and then correct the column headers indicated below.</span>\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\">\n <pre><code>{{error.key}}</code></pre>\n </div>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInvalidFormat\">\n <div class=\"is-mb-2\">\n <span>The following value in the column <i>{{error.key}}</i> is not in the correct format:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{stringify(error.value)}}</code></pre>\n </div>\n <ng-container [ngSwitch]=\"hasNumberWithCommasError\">\n <ng-container *ngSwitchCase=\"true\">\n <p class=\"is-mt-2\">\n Please format your numbers to remove commas and use a decimal point to separate the whole part of the number from the fractional part of the number.\n </p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>3,510.1</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>3510.1</code></pre>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"false\">\n <p>\n <span class=\"pr-1\">You can see the accepted field type and some examples</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">here</a>\n <span>.</span>\n </p>\n\n <p>The error could either be a value in the column, or an error with the column header.</p>\n <p>If you are trying to set no data, we accept either <code>-</code> or an empty cell.</p>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyRequired\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is required in the</span>\n <a class=\"pr-1\" *ngIf=\"error.schema\" [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">{{error.schema}}</a>\n <span>schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.property}}</code></pre>\n </div>\n <p [ngSwitch]=\"error.property\">\n <span *ngSwitchCase=\"'id'\">You must assign a unique <code>id</code> for every record in your data.</span>\n <span *ngSwitchCase=\"'type'\">Every record in your data must contain a <code>type</code>.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInternal\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is <code>internal</code> in the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">{{error.schema}} schema</a>\n <span>:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.schemaKey || error.key}}</code></pre>\n </div>\n <p>You cannot upload <code>internal</code> fields to Hestia.</p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.SchemaNotFound\">\n <div class=\"is-mb-2\">\n <span>The following Node does not exist in the schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.key}}</code></pre>\n </div>\n <p>\n <span>The list of accepted values is:</span>\n </p>\n <div class=\"content\">\n <ul>\n <li *ngFor=\"let type of nodeTypes\"><i>{{type}}</i></li>\n </ul>\n </div>\n </div>\n\n <ng-container *ngSwitchCase=\"ErrorKeys.UploadsLimit\">\n <div class=\"is-mb-2\">\n <span>You have reached the upload limit of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in a single submission (<b>{{error.value}}</b> have been found).</span>\n </div>\n\n <p>\n <span>Please re-upload the data in multiple submissions with a maximum of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in each submission.</span>\n </p>\n </ng-container>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidFirstColumn\">\n <span>\n No data in the Hestia format was detected on the first sheet.\n Either try selecting a different sheet in the upload screen, or check the sheet to ensure the headers follow the schema - see examples\n </span>\n <a class=\"pl-1\" routerLink=\"/upload\" fragment=\"example\">here</a>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoHeaders\">\n <p>\n No headers matching the Hestia schema were found on the first row.\n Please remove all empty rows at the begining of the file and try uploading again.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidSheetName\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The Excel sheet</span>\n <code>{{error.value}}</code>\n <span class=\"pl-1\">does not exist.</span>\n <span class=\"pl-1\">Your Excel file contains the following sheets:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let e of error.error.split(';')\">\n <code>{{e}}</code>\n </li>\n </ul>\n </div>\n\n <p>\n <span>Please re-upload selecting one of the sheets above.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedHeaders\">\n <span>Your submission contains duplicated column headers.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedIds\">\n <span class=\"pr-1\">You have multiple</span>\n <code>{{error.schema | pluralize}}</code>\n <span class=\"px-1\">with the same</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"px-1\">but different data. The</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"pl-1\">is:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.value}}</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NestedHeaders\">\n <p>\n To link nodes together, you first need to define the node (e.g., <code>source.id</code>, <code>source.bibliography.title</code>) and then create the link (e.g., <code>cycle.defaultSource.id</code>).\n We do not allow nesting (e.g., <code>cycle.defaultSource.bibliography.title</code>).\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.ReferenceExistingHeaders\">\n <p>You have used the internal <code>@id</code> field to upload a new Node.</p>\n <p>The <code>@id</code> field should only be used to reference existing Node or Terms. Example:</p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>cycle.@id,cycle.inputs.0.term.@id,source.id</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>cycle.id,cycle.inputs.0.term.@id,source.id</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxSize\">\n <span>The maximum file size limit is {{MAX_SIZE}}Mb (current file size: {{error.value}}Mb).</span>\n <span class=\"pl-1\">Please re-upload the data in multiple submissions.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxRows\">\n <span>Your file has {{error.value | number}} rows. This might be an error caused by adding some data at the bottom of a spreadsheet by accident: delete any unused rows and resubmit the file.</span>\n </div>\n\n <div class=\"my-3\" *ngIf=\"columns.length || (error.index && !isSchemaError)\">\n <b>Hint:</b>\n <span class=\"pl-1\">the error might be located</span>\n <span class=\"pl-1\" *ngIf=\"error.index && !isSchemaError\">on row {{error.index}}</span>\n <ng-container *ngIf=\"columns.length\">\n <span class=\"pl-1\">in {{'column' | pluralize:columns.length}}:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let column of columns\">\n <b class=\"pr-2\">{{column.column}}</b>\n <code>{{column.name}}</code>\n </li>\n </ul>\n </ng-container>\n </div>\n\n <div class=\"my-3\" *ngIf=\"error.suggestions?.length\">\n <b>Suggestions:</b>\n <span class=\"pl-1\">did you mean instead:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let suggestion of error.suggestions\">\n <code>{{suggestion}}</code>\n </li>\n </ul>\n </div>\n\n <div *ngIf=\"showCsvPreview\" class=\"is-my-2\">\n <b>Preview<sup>1</sup>:</b>\n <div class=\"table-container is-mt-2\">\n <table class=\"table is-bordered is-fullwidth is-hoverable is-narrow mb-0\">\n <thead>\n <th *ngIf=\"error.index\"></th>\n <th *ngFor=\"let header of headers\">{{header}}</th>\n </thead>\n <tbody>\n <ng-container *bindOnce=\"rows\">\n <tr *ngFor=\"let row of rows\">\n <td class=\"has-text-danger\" *ngIf=\"error.index\">\n <span class=\"is-nowrap\">Row {{error.index}}</span>\n </td>\n <td *ngFor=\"let col of row; let colIndex = index\">\n <span\n [class.has-text-danger]=\"error?.message === ErrorKeys.DuplicatedIds && hasDuplicatedError(col, colIndex)\"\n >{{col | ellipsis:50}}</span>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n <p class=\"is-size-7\"><i>1. The preview does not necessarily reflect the original Submission's order or content.</i></p>\n </div>\n\n <div *ngIf=\"showJsonPreview\" class=\"is-my-2\">\n <b>Preview:</b>\n <pre class=\"is-mt-2\"><code>{{stringify(error.node)}}</code></pre>\n </div>\n </div>\n</ng-container>\n\n<ng-template #defaultError>\n <p class=\"is-mt-2 has-text-black\">\n <span class=\"is-pr-1\">If you are still stuck, please see</span>\n <a [href]=\"baseUrl + '/upload#example'\" target=\"_blank\">the example submissions and videos</a>\n <span class=\"is-px-1\">or try using the Wizard to get the first few rows of data formatted correctly, or use the chat to ask for help.</span>\n </p>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: EllipsisPipe, name: "ellipsis" }, { kind: "pipe", type: PluralizePipe, name: "pluralize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
8529
+ FilesUploadErrorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.8", type: FilesUploadErrorsComponent, selector: "he-files-upload-errors", inputs: { file: "file", error: "error" }, ngImport: i0, template: "<ng-container *ngIf=\"!!error\">\n <div class=\"has-text-danger\" [ngSwitch]=\"error?.message\">\n <div *ngSwitchCase=\"ErrorKeys.InvalidJSON\">\n <p>The Submission does not appear to contain valid JSON data:</p>\n\n <div class=\"is-mt-2\">\n <pre><code>{{error.error}}</code></pre>\n </div>\n\n <p>Please validate your JSON content before uploading it using an <a href=\"https://jsoneditoronline.org\" target=\"_blank\">online tool</a> for example.</p>\n </div>\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoData\">\n <p>\n No Nodes could be found in your Submission.\n Please verify the column headers match the Hestia schema.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyNotFound\">\n <div class=\"notification is-danger\" role=\"alert\">\n <p>\n <fa-icon class=\"pr-2\" icon=\"exclamation-triangle\"></fa-icon>\n <span>You have column headers that do not match the Hestia schema.</span>\n <span class=\"px-1\">Please refer to the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">schema</a>\n <span class=\"pl-1\">and then correct the column headers indicated below.</span>\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\">\n <pre><code>{{error.key}}</code></pre>\n </div>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInvalidFormat\">\n <div class=\"is-mb-2\">\n <span>The following value in the column <i>{{error.key}}</i> is not in the correct format:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{stringify(error.value)}}</code></pre>\n </div>\n <ng-container [ngSwitch]=\"hasNumberWithCommasError\">\n <ng-container *ngSwitchCase=\"true\">\n <p class=\"is-mt-2\">\n Please format your numbers to remove commas and use a decimal point to separate the whole part of the number from the fractional part of the number.\n </p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>3,510.1</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>3510.1</code></pre>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"false\">\n <p>\n <span class=\"pr-1\">You can see the accepted field type and some examples</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">here</a>\n <span>.</span>\n </p>\n\n <p>The error could either be a value in the column, or an error with the column header.</p>\n <p>If you are trying to set no data, we accept either <code>-</code> or an empty cell.</p>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyRequired\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is required in the</span>\n <a class=\"pr-1\" *ngIf=\"error.schema\" [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">{{error.schema}}</a>\n <span>schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.property}}</code></pre>\n </div>\n <p [ngSwitch]=\"error.property\">\n <span *ngSwitchCase=\"'id'\">You must assign a unique <code>id</code> for every record in your data.</span>\n <span *ngSwitchCase=\"'type'\">Every record in your data must contain a <code>type</code>.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInternal\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is <code>internal</code> in the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">{{error.schema}} schema</a>\n <span>:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.schemaKey || error.key}}</code></pre>\n </div>\n <p>You cannot upload <code>internal</code> fields to Hestia.</p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.SchemaNotFound\">\n <div class=\"is-mb-2\">\n <span>The following Node does not exist in the schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.key}}</code></pre>\n </div>\n <p>\n <span>The list of accepted values is:</span>\n </p>\n <div class=\"content\">\n <ul>\n <li *ngFor=\"let type of nodeTypes\"><i>{{type}}</i></li>\n </ul>\n </div>\n </div>\n\n <ng-container *ngSwitchCase=\"ErrorKeys.UploadsLimit\">\n <div class=\"is-mb-2\">\n <span>You have reached the upload limit of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in a single submission (<b>{{error.value}}</b> have been found).</span>\n </div>\n\n <p>\n <span>Please re-upload the data in multiple submissions with a maximum of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in each submission.</span>\n </p>\n </ng-container>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidFirstColumn\">\n <span>\n No data in the Hestia format was detected on the first sheet.\n Either try selecting a different sheet in the upload screen, or check the sheet to ensure the headers follow the schema - see examples\n </span>\n <a class=\"pl-1\" routerLink=\"/upload\" fragment=\"example\">here</a>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoHeaders\">\n <p>\n No headers matching the Hestia schema were found on the first row.\n Please remove all empty rows at the begining of the file and try uploading again.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidSheetName\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The Excel sheet</span>\n <code>{{error.value}}</code>\n <span class=\"pl-1\">does not exist.</span>\n <span class=\"pl-1\">Your Excel file contains the following sheets:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let e of error.error.split(';')\">\n <code>{{e}}</code>\n </li>\n </ul>\n </div>\n\n <p>\n <span>Please re-upload selecting one of the sheets above.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedHeaders\">\n <span>Your submission contains duplicated column headers.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedIds\">\n <span class=\"pr-1\">You have multiple</span>\n <code>{{error.schema | pluralize}}</code>\n <span class=\"px-1\">with the same</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"px-1\">but different data. The</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"pl-1\">is:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.value}}</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NestedHeaders\">\n <p>\n To link nodes together, you first need to define the node (e.g., <code>source.id</code>, <code>source.bibliography.title</code>) and then create the link (e.g., <code>cycle.defaultSource.id</code>).\n We do not allow nesting (e.g., <code>cycle.defaultSource.bibliography.title</code>).\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.ReferenceExistingHeaders\">\n <p>You have used the internal <code>@id</code> field to upload a new Node.</p>\n <p>The <code>@id</code> field should only be used to reference existing Node or Terms. Example:</p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>cycle.@id,cycle.inputs.0.term.@id,source.id</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>cycle.id,cycle.inputs.0.term.@id,source.id</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxSize\">\n <span>The maximum file size limit is {{MAX_SIZE}}Mb (current file size: {{error.value}}Mb).</span>\n <span class=\"pl-1\">Please re-upload the data in multiple submissions.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxRows\">\n <span>Your file has {{error.value | number}} rows. This might be an error caused by adding some data at the bottom of a spreadsheet by accident: delete any unused rows and resubmit the file.</span>\n </div>\n\n <div class=\"my-3\" *ngIf=\"columns.length || (error.index && !isSchemaError)\">\n <b>Hint:</b>\n <span class=\"pl-1\">the error might be located</span>\n <span class=\"pl-1\" *ngIf=\"error.index && !isSchemaError\">on row {{error.index}}</span>\n <ng-container *ngIf=\"columns.length\">\n <span class=\"pl-1\">in {{'column' | pluralize:columns.length}}:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let column of columns\">\n <b class=\"pr-2\">{{column.column}}</b>\n <code>{{column.name}}</code>\n </li>\n </ul>\n </ng-container>\n </div>\n\n <div class=\"my-3\" *ngIf=\"error.suggestions?.length\">\n <b>Suggestions:</b>\n <span class=\"pl-1\">did you mean instead:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let suggestion of error.suggestions\">\n <code>{{suggestion}}</code>\n </li>\n </ul>\n </div>\n\n <div *ngIf=\"showCsvPreview\" class=\"is-my-2\">\n <b>Preview<sup>1</sup>:</b>\n <div class=\"table-container is-mt-2\">\n <table class=\"table is-bordered is-fullwidth is-hoverable is-narrow mb-0\">\n <thead>\n <th *ngIf=\"error.index\"></th>\n <th *ngFor=\"let header of headers\">{{header}}</th>\n </thead>\n <tbody>\n <ng-container *bindOnce=\"rows\">\n <tr *ngFor=\"let row of rows\">\n <td class=\"has-text-danger\" *ngIf=\"error.index\">\n <span class=\"is-nowrap\">Row {{error.index}}</span>\n </td>\n <td *ngFor=\"let col of row; let colIndex = index\">\n <span\n [class.has-text-danger]=\"error?.message === ErrorKeys.DuplicatedIds && hasDuplicatedError(col, colIndex)\"\n >{{col | ellipsis:50}}</span>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n <p class=\"is-size-7\"><i>1. The preview does not necessarily reflect the original Submission's order or content.</i></p>\n </div>\n\n <div *ngIf=\"showJsonPreview\" class=\"is-my-2\">\n <b>Preview:</b>\n <pre class=\"is-mt-2\"><code>{{stringify(error.node)}}</code></pre>\n </div>\n </div>\n</ng-container>\n\n<ng-template #defaultError>\n <p class=\"is-mt-2 has-text-black\">\n <span class=\"is-pr-1\">If you are still stuck, please see</span>\n <a [href]=\"baseUrl + '/upload#example'\" target=\"_blank\">the example submissions and videos</a>\n <span class=\"is-px-1\">or try using the Wizard to get the first few rows of data formatted correctly, or use the chat to ask for help.</span>\n </p>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: BindOnceDirective, selector: "[bindOnce]", inputs: ["bindOnce"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: EllipsisPipe, name: "ellipsis" }, { kind: "pipe", type: PluralizePipe, name: "pluralize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
8529
8530
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.8", ngImport: i0, type: FilesUploadErrorsComponent, decorators: [{
8530
8531
  type: Component$1,
8531
- args: [{ selector: 'he-files-upload-errors', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!!error\">\n <div class=\"has-text-danger\" [ngSwitch]=\"error?.message\">\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoData\">\n <p>\n No Nodes could be found in your Submission.\n Please verify the column headers match the Hestia schema.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyNotFound\">\n <div class=\"notification is-danger\" role=\"alert\">\n <p>\n <fa-icon class=\"pr-2\" icon=\"exclamation-triangle\"></fa-icon>\n <span>You have column headers that do not match the Hestia schema.</span>\n <span class=\"px-1\">Please refer to the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">schema</a>\n <span class=\"pl-1\">and then correct the column headers indicated below.</span>\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\">\n <pre><code>{{error.key}}</code></pre>\n </div>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInvalidFormat\">\n <div class=\"is-mb-2\">\n <span>The following value in the column <i>{{error.key}}</i> is not in the correct format:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{stringify(error.value)}}</code></pre>\n </div>\n <ng-container [ngSwitch]=\"hasNumberWithCommasError\">\n <ng-container *ngSwitchCase=\"true\">\n <p class=\"is-mt-2\">\n Please format your numbers to remove commas and use a decimal point to separate the whole part of the number from the fractional part of the number.\n </p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>3,510.1</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>3510.1</code></pre>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"false\">\n <p>\n <span class=\"pr-1\">You can see the accepted field type and some examples</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">here</a>\n <span>.</span>\n </p>\n\n <p>The error could either be a value in the column, or an error with the column header.</p>\n <p>If you are trying to set no data, we accept either <code>-</code> or an empty cell.</p>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyRequired\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is required in the</span>\n <a class=\"pr-1\" *ngIf=\"error.schema\" [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">{{error.schema}}</a>\n <span>schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.property}}</code></pre>\n </div>\n <p [ngSwitch]=\"error.property\">\n <span *ngSwitchCase=\"'id'\">You must assign a unique <code>id</code> for every record in your data.</span>\n <span *ngSwitchCase=\"'type'\">Every record in your data must contain a <code>type</code>.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInternal\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is <code>internal</code> in the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">{{error.schema}} schema</a>\n <span>:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.schemaKey || error.key}}</code></pre>\n </div>\n <p>You cannot upload <code>internal</code> fields to Hestia.</p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.SchemaNotFound\">\n <div class=\"is-mb-2\">\n <span>The following Node does not exist in the schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.key}}</code></pre>\n </div>\n <p>\n <span>The list of accepted values is:</span>\n </p>\n <div class=\"content\">\n <ul>\n <li *ngFor=\"let type of nodeTypes\"><i>{{type}}</i></li>\n </ul>\n </div>\n </div>\n\n <ng-container *ngSwitchCase=\"ErrorKeys.UploadsLimit\">\n <div class=\"is-mb-2\">\n <span>You have reached the upload limit of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in a single submission (<b>{{error.value}}</b> have been found).</span>\n </div>\n\n <p>\n <span>Please re-upload the data in multiple submissions with a maximum of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in each submission.</span>\n </p>\n </ng-container>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidFirstColumn\">\n <span>\n No data in the Hestia format was detected on the first sheet.\n Either try selecting a different sheet in the upload screen, or check the sheet to ensure the headers follow the schema - see examples\n </span>\n <a class=\"pl-1\" routerLink=\"/upload\" fragment=\"example\">here</a>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoHeaders\">\n <p>\n No headers matching the Hestia schema were found on the first row.\n Please remove all empty rows at the begining of the file and try uploading again.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidSheetName\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The Excel sheet</span>\n <code>{{error.value}}</code>\n <span class=\"pl-1\">does not exist.</span>\n <span class=\"pl-1\">Your Excel file contains the following sheets:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let e of error.error.split(';')\">\n <code>{{e}}</code>\n </li>\n </ul>\n </div>\n\n <p>\n <span>Please re-upload selecting one of the sheets above.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedHeaders\">\n <span>Your submission contains duplicated column headers.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedIds\">\n <span class=\"pr-1\">You have multiple</span>\n <code>{{error.schema | pluralize}}</code>\n <span class=\"px-1\">with the same</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"px-1\">but different data. The</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"pl-1\">is:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.value}}</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NestedHeaders\">\n <p>\n To link nodes together, you first need to define the node (e.g., <code>source.id</code>, <code>source.bibliography.title</code>) and then create the link (e.g., <code>cycle.defaultSource.id</code>).\n We do not allow nesting (e.g., <code>cycle.defaultSource.bibliography.title</code>).\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.ReferenceExistingHeaders\">\n <p>You have used the internal <code>@id</code> field to upload a new Node.</p>\n <p>The <code>@id</code> field should only be used to reference existing Node or Terms. Example:</p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>cycle.@id,cycle.inputs.0.term.@id,source.id</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>cycle.id,cycle.inputs.0.term.@id,source.id</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxSize\">\n <span>The maximum file size limit is {{MAX_SIZE}}Mb (current file size: {{error.value}}Mb).</span>\n <span class=\"pl-1\">Please re-upload the data in multiple submissions.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxRows\">\n <span>Your file has {{error.value | number}} rows. This might be an error caused by adding some data at the bottom of a spreadsheet by accident: delete any unused rows and resubmit the file.</span>\n </div>\n\n <div class=\"my-3\" *ngIf=\"columns.length || (error.index && !isSchemaError)\">\n <b>Hint:</b>\n <span class=\"pl-1\">the error might be located</span>\n <span class=\"pl-1\" *ngIf=\"error.index && !isSchemaError\">on row {{error.index}}</span>\n <ng-container *ngIf=\"columns.length\">\n <span class=\"pl-1\">in {{'column' | pluralize:columns.length}}:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let column of columns\">\n <b class=\"pr-2\">{{column.column}}</b>\n <code>{{column.name}}</code>\n </li>\n </ul>\n </ng-container>\n </div>\n\n <div class=\"my-3\" *ngIf=\"error.suggestions?.length\">\n <b>Suggestions:</b>\n <span class=\"pl-1\">did you mean instead:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let suggestion of error.suggestions\">\n <code>{{suggestion}}</code>\n </li>\n </ul>\n </div>\n\n <div *ngIf=\"showCsvPreview\" class=\"is-my-2\">\n <b>Preview<sup>1</sup>:</b>\n <div class=\"table-container is-mt-2\">\n <table class=\"table is-bordered is-fullwidth is-hoverable is-narrow mb-0\">\n <thead>\n <th *ngIf=\"error.index\"></th>\n <th *ngFor=\"let header of headers\">{{header}}</th>\n </thead>\n <tbody>\n <ng-container *bindOnce=\"rows\">\n <tr *ngFor=\"let row of rows\">\n <td class=\"has-text-danger\" *ngIf=\"error.index\">\n <span class=\"is-nowrap\">Row {{error.index}}</span>\n </td>\n <td *ngFor=\"let col of row; let colIndex = index\">\n <span\n [class.has-text-danger]=\"error?.message === ErrorKeys.DuplicatedIds && hasDuplicatedError(col, colIndex)\"\n >{{col | ellipsis:50}}</span>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n <p class=\"is-size-7\"><i>1. The preview does not necessarily reflect the original Submission's order or content.</i></p>\n </div>\n\n <div *ngIf=\"showJsonPreview\" class=\"is-my-2\">\n <b>Preview:</b>\n <pre class=\"is-mt-2\"><code>{{stringify(error.node)}}</code></pre>\n </div>\n </div>\n</ng-container>\n\n<ng-template #defaultError>\n <p class=\"is-mt-2 has-text-black\">\n <span class=\"is-pr-1\">If you are still stuck, please see</span>\n <a [href]=\"baseUrl + '/upload#example'\" target=\"_blank\">the example submissions and videos</a>\n <span class=\"is-px-1\">or try using the Wizard to get the first few rows of data formatted correctly, or use the chat to ask for help.</span>\n </p>\n</ng-template>\n", styles: [":host{display:block}\n"] }]
8532
+ args: [{ selector: 'he-files-upload-errors', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!!error\">\n <div class=\"has-text-danger\" [ngSwitch]=\"error?.message\">\n <div *ngSwitchCase=\"ErrorKeys.InvalidJSON\">\n <p>The Submission does not appear to contain valid JSON data:</p>\n\n <div class=\"is-mt-2\">\n <pre><code>{{error.error}}</code></pre>\n </div>\n\n <p>Please validate your JSON content before uploading it using an <a href=\"https://jsoneditoronline.org\" target=\"_blank\">online tool</a> for example.</p>\n </div>\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoData\">\n <p>\n No Nodes could be found in your Submission.\n Please verify the column headers match the Hestia schema.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyNotFound\">\n <div class=\"notification is-danger\" role=\"alert\">\n <p>\n <fa-icon class=\"pr-2\" icon=\"exclamation-triangle\"></fa-icon>\n <span>You have column headers that do not match the Hestia schema.</span>\n <span class=\"px-1\">Please refer to the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">schema</a>\n <span class=\"pl-1\">and then correct the column headers indicated below.</span>\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\">\n <pre><code>{{error.key}}</code></pre>\n </div>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInvalidFormat\">\n <div class=\"is-mb-2\">\n <span>The following value in the column <i>{{error.key}}</i> is not in the correct format:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{stringify(error.value)}}</code></pre>\n </div>\n <ng-container [ngSwitch]=\"hasNumberWithCommasError\">\n <ng-container *ngSwitchCase=\"true\">\n <p class=\"is-mt-2\">\n Please format your numbers to remove commas and use a decimal point to separate the whole part of the number from the fractional part of the number.\n </p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>3,510.1</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>3510.1</code></pre>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"false\">\n <p>\n <span class=\"pr-1\">You can see the accepted field type and some examples</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">here</a>\n <span>.</span>\n </p>\n\n <p>The error could either be a value in the column, or an error with the column header.</p>\n <p>If you are trying to set no data, we accept either <code>-</code> or an empty cell.</p>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyRequired\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is required in the</span>\n <a class=\"pr-1\" *ngIf=\"error.schema\" [href]=\"baseUrl + '/schema/' + error.schema\" target=\"_blank\">{{error.schema}}</a>\n <span>schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.property}}</code></pre>\n </div>\n <p [ngSwitch]=\"error.property\">\n <span *ngSwitchCase=\"'id'\">You must assign a unique <code>id</code> for every record in your data.</span>\n <span *ngSwitchCase=\"'type'\">Every record in your data must contain a <code>type</code>.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.PropertyInternal\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The following field is <code>internal</code> in the</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + (error.schemaKey || error.key)\" target=\"_blank\">{{error.schema}} schema</a>\n <span>:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.schemaKey || error.key}}</code></pre>\n </div>\n <p>You cannot upload <code>internal</code> fields to Hestia.</p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.SchemaNotFound\">\n <div class=\"is-mb-2\">\n <span>The following Node does not exist in the schema:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.key}}</code></pre>\n </div>\n <p>\n <span>The list of accepted values is:</span>\n </p>\n <div class=\"content\">\n <ul>\n <li *ngFor=\"let type of nodeTypes\"><i>{{type}}</i></li>\n </ul>\n </div>\n </div>\n\n <ng-container *ngSwitchCase=\"ErrorKeys.UploadsLimit\">\n <div class=\"is-mb-2\">\n <span>You have reached the upload limit of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in a single submission (<b>{{error.value}}</b> have been found).</span>\n </div>\n\n <p>\n <span>Please re-upload the data in multiple submissions with a maximum of</span>\n <code class=\"mx-1\">{{UploadLimit[error.schema]}}</code>\n <span>{{error.schema}} in each submission.</span>\n </p>\n </ng-container>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidFirstColumn\">\n <span>\n No data in the Hestia format was detected on the first sheet.\n Either try selecting a different sheet in the upload screen, or check the sheet to ensure the headers follow the schema - see examples\n </span>\n <a class=\"pl-1\" routerLink=\"/upload\" fragment=\"example\">here</a>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NoHeaders\">\n <p>\n No headers matching the Hestia schema were found on the first row.\n Please remove all empty rows at the begining of the file and try uploading again.\n </p>\n\n <ng-container *ngTemplateOutlet=\"defaultError\"></ng-container>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.InvalidSheetName\">\n <div class=\"is-mb-2\">\n <span class=\"pr-1\">The Excel sheet</span>\n <code>{{error.value}}</code>\n <span class=\"pl-1\">does not exist.</span>\n <span class=\"pl-1\">Your Excel file contains the following sheets:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let e of error.error.split(';')\">\n <code>{{e}}</code>\n </li>\n </ul>\n </div>\n\n <p>\n <span>Please re-upload selecting one of the sheets above.</span>\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedHeaders\">\n <span>Your submission contains duplicated column headers.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.DuplicatedIds\">\n <span class=\"pr-1\">You have multiple</span>\n <code>{{error.schema | pluralize}}</code>\n <span class=\"px-1\">with the same</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"px-1\">but different data. The</span>\n <a [href]=\"baseUrl + '/schema/' + error.schema + '#' + error.schemaKey\" target=\"_blank\">{{error.schemaKey}}</a>\n <span class=\"pl-1\">is:</span>\n <br>\n <pre class=\"is-mt-2\"><code>{{error.value}}</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.NestedHeaders\">\n <p>\n To link nodes together, you first need to define the node (e.g., <code>source.id</code>, <code>source.bibliography.title</code>) and then create the link (e.g., <code>cycle.defaultSource.id</code>).\n We do not allow nesting (e.g., <code>cycle.defaultSource.bibliography.title</code>).\n </p>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.ReferenceExistingHeaders\">\n <p>You have used the internal <code>@id</code> field to upload a new Node.</p>\n <p>The <code>@id</code> field should only be used to reference existing Node or Terms. Example:</p>\n\n <p class=\"is-mt-2 has-text-danger has-text-underline\">Incorrect:</p>\n <pre class=\"is-mt-2\"><code>cycle.@id,cycle.inputs.0.term.@id,source.id</code></pre>\n\n <p class=\"is-mt-2 has-text-success has-text-underline\">Correct:</p>\n <pre class=\"is-mt-2\"><code>cycle.id,cycle.inputs.0.term.@id,source.id</code></pre>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxSize\">\n <span>The maximum file size limit is {{MAX_SIZE}}Mb (current file size: {{error.value}}Mb).</span>\n <span class=\"pl-1\">Please re-upload the data in multiple submissions.</span>\n </div>\n\n <div class=\"is-mb-2\" *ngSwitchCase=\"ErrorKeys.MaxRows\">\n <span>Your file has {{error.value | number}} rows. This might be an error caused by adding some data at the bottom of a spreadsheet by accident: delete any unused rows and resubmit the file.</span>\n </div>\n\n <div class=\"my-3\" *ngIf=\"columns.length || (error.index && !isSchemaError)\">\n <b>Hint:</b>\n <span class=\"pl-1\">the error might be located</span>\n <span class=\"pl-1\" *ngIf=\"error.index && !isSchemaError\">on row {{error.index}}</span>\n <ng-container *ngIf=\"columns.length\">\n <span class=\"pl-1\">in {{'column' | pluralize:columns.length}}:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let column of columns\">\n <b class=\"pr-2\">{{column.column}}</b>\n <code>{{column.name}}</code>\n </li>\n </ul>\n </ng-container>\n </div>\n\n <div class=\"my-3\" *ngIf=\"error.suggestions?.length\">\n <b>Suggestions:</b>\n <span class=\"pl-1\">did you mean instead:</span>\n <ul class=\"mt-1 content is-list-style-disc pl-5\">\n <li *ngFor=\"let suggestion of error.suggestions\">\n <code>{{suggestion}}</code>\n </li>\n </ul>\n </div>\n\n <div *ngIf=\"showCsvPreview\" class=\"is-my-2\">\n <b>Preview<sup>1</sup>:</b>\n <div class=\"table-container is-mt-2\">\n <table class=\"table is-bordered is-fullwidth is-hoverable is-narrow mb-0\">\n <thead>\n <th *ngIf=\"error.index\"></th>\n <th *ngFor=\"let header of headers\">{{header}}</th>\n </thead>\n <tbody>\n <ng-container *bindOnce=\"rows\">\n <tr *ngFor=\"let row of rows\">\n <td class=\"has-text-danger\" *ngIf=\"error.index\">\n <span class=\"is-nowrap\">Row {{error.index}}</span>\n </td>\n <td *ngFor=\"let col of row; let colIndex = index\">\n <span\n [class.has-text-danger]=\"error?.message === ErrorKeys.DuplicatedIds && hasDuplicatedError(col, colIndex)\"\n >{{col | ellipsis:50}}</span>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n </div>\n <p class=\"is-size-7\"><i>1. The preview does not necessarily reflect the original Submission's order or content.</i></p>\n </div>\n\n <div *ngIf=\"showJsonPreview\" class=\"is-my-2\">\n <b>Preview:</b>\n <pre class=\"is-mt-2\"><code>{{stringify(error.node)}}</code></pre>\n </div>\n </div>\n</ng-container>\n\n<ng-template #defaultError>\n <p class=\"is-mt-2 has-text-black\">\n <span class=\"is-pr-1\">If you are still stuck, please see</span>\n <a [href]=\"baseUrl + '/upload#example'\" target=\"_blank\">the example submissions and videos</a>\n <span class=\"is-px-1\">or try using the Wizard to get the first few rows of data formatted correctly, or use the chat to ask for help.</span>\n </p>\n</ng-template>\n", styles: [":host{display:block}\n"] }]
8532
8533
  }], propDecorators: { file: [{
8533
8534
  type: Input
8534
8535
  }], error: [{