@hestia-earth/ui-components 0.0.21 → 0.0.22
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.
- package/bundles/hestia-earth-ui-components.umd.js +13 -8
- package/bundles/hestia-earth-ui-components.umd.js.map +1 -1
- package/esm2015/node/node-csv-select-headers/node-csv-select-headers.component.js +11 -7
- package/fesm2015/hestia-earth-ui-components.js +10 -6
- package/fesm2015/hestia-earth-ui-components.js.map +1 -1
- package/node/node-csv-select-headers/node-csv-select-headers.component.d.ts +9 -3
- package/package.json +1 -1
|
@@ -4825,15 +4825,17 @@
|
|
|
4825
4825
|
this.csv = '';
|
|
4826
4826
|
this.includeDefaultCSV = false;
|
|
4827
4827
|
this.headersChanged = new i0.EventEmitter();
|
|
4828
|
+
this.loading = true;
|
|
4828
4829
|
this.headers = {};
|
|
4829
4830
|
this.allSelected = false;
|
|
4830
4831
|
this.showSelectTermFields = false;
|
|
4831
4832
|
this.termFields = termFields;
|
|
4832
4833
|
this.termFieldSelected = {};
|
|
4834
|
+
this.showNonIncluded = false;
|
|
4833
4835
|
}
|
|
4834
4836
|
NodeCsvSelectHeadersComponent.prototype.ngOnInit = function () {
|
|
4835
4837
|
return __awaiter(this, void 0, void 0, function () {
|
|
4836
|
-
var schemas, isSelected, headers;
|
|
4838
|
+
var schemas, isSelected, isIncluded, headers;
|
|
4837
4839
|
var _this = this;
|
|
4838
4840
|
return __generator(this, function (_b) {
|
|
4839
4841
|
switch (_b.label) {
|
|
@@ -4843,13 +4845,14 @@
|
|
|
4843
4845
|
return [4 /*yield*/, this.isSelected(schemas)];
|
|
4844
4846
|
case 2:
|
|
4845
4847
|
isSelected = _b.sent();
|
|
4848
|
+
isIncluded = schemaUtils.isCSVIncluded(schemas);
|
|
4846
4849
|
return [4 /*yield*/, this.schemaService.parseHeaders(this.csv)];
|
|
4847
4850
|
case 3:
|
|
4848
4851
|
headers = _b.sent();
|
|
4849
|
-
this.headers = headers.
|
|
4852
|
+
this.headers = headers.reduce(function (prev, header) {
|
|
4850
4853
|
var group = headerGroup(header);
|
|
4851
4854
|
prev[group] = prev[group] || { headers: [], selected: false, partialSelected: false, open: true };
|
|
4852
|
-
prev[group].headers.push({ header: header, selected: isSelected(header) });
|
|
4855
|
+
prev[group].headers.push({ header: header, selected: isSelected(header), included: isIncluded(header) });
|
|
4853
4856
|
return prev;
|
|
4854
4857
|
}, {});
|
|
4855
4858
|
Object.keys(this.headers).map(function (groupKey) { return _this.updateGroupHeader(groupKey); });
|
|
@@ -4857,7 +4860,8 @@
|
|
|
4857
4860
|
var _b;
|
|
4858
4861
|
return (Object.assign(Object.assign({}, prev), (_b = {}, _b[curr] = curr === '@id', _b)));
|
|
4859
4862
|
}, {});
|
|
4860
|
-
this.
|
|
4863
|
+
this.refresh();
|
|
4864
|
+
this.loading = false;
|
|
4861
4865
|
return [2 /*return*/];
|
|
4862
4866
|
}
|
|
4863
4867
|
});
|
|
@@ -4910,14 +4914,15 @@
|
|
|
4910
4914
|
};
|
|
4911
4915
|
Object.defineProperty(NodeCsvSelectHeadersComponent.prototype, "selectedHeaders", {
|
|
4912
4916
|
get: function () {
|
|
4917
|
+
var _this = this;
|
|
4913
4918
|
return Object.values(this.headers)
|
|
4914
4919
|
.flatMap(function (_b) {
|
|
4915
4920
|
var headers = _b.headers;
|
|
4916
4921
|
return headers;
|
|
4917
4922
|
})
|
|
4918
4923
|
.filter(function (_b) {
|
|
4919
|
-
var selected = _b.selected;
|
|
4920
|
-
return selected;
|
|
4924
|
+
var selected = _b.selected, included = _b.included;
|
|
4925
|
+
return selected && (included || _this.showNonIncluded);
|
|
4921
4926
|
})
|
|
4922
4927
|
.map(function (_b) {
|
|
4923
4928
|
var header = _b.header;
|
|
@@ -4927,7 +4932,7 @@
|
|
|
4927
4932
|
enumerable: false,
|
|
4928
4933
|
configurable: true
|
|
4929
4934
|
});
|
|
4930
|
-
NodeCsvSelectHeadersComponent.prototype.
|
|
4935
|
+
NodeCsvSelectHeadersComponent.prototype.refresh = function () {
|
|
4931
4936
|
this.updateAllSelected();
|
|
4932
4937
|
this.headersChanged.emit(this.selectedHeaders);
|
|
4933
4938
|
};
|
|
@@ -4944,7 +4949,7 @@
|
|
|
4944
4949
|
return NodeCsvSelectHeadersComponent;
|
|
4945
4950
|
}());
|
|
4946
4951
|
NodeCsvSelectHeadersComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeCsvSelectHeadersComponent, deps: [{ token: HeSchemaService }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
4947
|
-
NodeCsvSelectHeadersComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeCsvSelectHeadersComponent, selector: "he-node-csv-select-headers", inputs: { csv: "csv", keys: "keys", includeDefaultCSV: "includeDefaultCSV" }, outputs: { headersChanged: "headersChanged" }, ngImport: i0__namespace, template: "<p class=\"mb-2\">Please select which columns you would like to include:</p>\n\n<p class=\"my-2 is-size-7\"><i>You can drag and drop the headers to sort them as they would appear in the CSV file.</i></p>\n\n<div class=\"columns toggle-all mx-4 pb-1 mb-0\">\n <div class=\"column\">\n <label class=\"checkbox ml-1\">\n <input type=\"checkbox\" class=\"selector\"\n [(ngModel)]=\"allSelected\"\n (change)=\"toggleAll();
|
|
4952
|
+
NodeCsvSelectHeadersComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: NodeCsvSelectHeadersComponent, selector: "he-node-csv-select-headers", inputs: { csv: "csv", keys: "keys", includeDefaultCSV: "includeDefaultCSV" }, outputs: { headersChanged: "headersChanged" }, ngImport: i0__namespace, template: "<p class=\"mb-2\">Please select which columns you would like to include:</p>\n\n<p class=\"my-2 is-size-7\"><i>You can drag and drop the headers to sort them as they would appear in the CSV file.</i></p>\n\n<div class=\"columns toggle-all mx-4 pb-1 mb-0\">\n <div class=\"column\">\n <label class=\"checkbox ml-1\">\n <input type=\"checkbox\" class=\"selector\"\n [(ngModel)]=\"allSelected\"\n (change)=\"toggleAll(); refresh()\"\n >\n <span class=\"ml-2\">Toggle All</span>\n </label>\n </div>\n\n <div class=\"column is-narrow has-text-right\">\n <div class=\"dropdown is-right has-text-left\"\n [class.is-active]=\"showSelectTermFields\"\n (clickOutside)=\"showSelectTermFields = false\"\n >\n <div class=\"dropdown-trigger\" (click)=\"showSelectTermFields = !showSelectTermFields\">\n <button class=\"button is-small\"\n aria-haspopup=\"true\" aria-controls=\"select-menu\"\n >\n <span>Advanced Filters</span>\n <span class=\"icon is-small\">\n <fa-icon icon=\"filter\" aria-hidden=\"true\"></fa-icon>\n </span>\n </button>\n </div>\n <div class=\"dropdown-menu\" id=\"select-menu\" role=\"menu\">\n <div class=\"dropdown-content\">\n <a class=\"dropdown-item\">\n <label class=\"checkbox ml-1\">\n <input type=\"checkbox\" class=\"selector\"\n [(ngModel)]=\"showNonIncluded\"\n (change)=\"refresh()\"\n >\n <span class=\"ml-2\">Include <code>internal</code> fields</span>\n </label>\n </a>\n <div class=\"dropdown-item\">\n <p>Toggle Term Fields</p>\n </div>\n <a class=\"dropdown-item\"\n *ngFor=\"let field of termFields\"\n >\n <label class=\"checkbox ml-1\">\n <input type=\"checkbox\" class=\"selector\"\n [(ngModel)]=\"termFieldSelected[field]\"\n (change)=\"toggleTermField(field)\"\n >\n <span class=\"ml-2\">{{field}}</span>\n </label>\n </a>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<div class=\"drag-container\" *ngIf=\"!loading; else loader\">\n <div class=\"card\" *ngFor=\"let group of headers | keys\">\n <header class=\"card-header\" *ngIf=\"group.key\">\n <div class=\"card-header-title\">\n <label class=\"checkbox ml-1\">\n <input type=\"checkbox\" class=\"selector\"\n [indeterminate]=\"group.value.partialSelected\"\n [(ngModel)]=\"group.value.selected\"\n (change)=\"updateGroup(group.key); refresh()\"\n >\n <span class=\"ml-2\">{{group.key}}</span>\n </label>\n </div>\n <span class=\"card-header-icon has-text-link\" aria-label=\"open / close\"\n (click)=\"group.value.open = !group.value.open\" pointer\n >\n <span class=\"icon\">\n <fa-icon icon=\"angle-down\" [class.is-hidden]=\"!group.value.open\"></fa-icon>\n <fa-icon icon=\"angle-left\" [class.is-hidden]=\"group.value.open\"></fa-icon>\n </span>\n </span>\n </header>\n\n <div class=\"card-content p-3\" [class.is-hidden]=\"!group.value.open\">\n <ul cdkDropList (cdkDropListDropped)=\"dropHeader($event, group.key)\">\n <ng-container *ngFor=\"let header of group.value.headers\">\n <ng-container *ngIf=\"header.included || showNonIncluded\">\n <li cdkDrag>\n <label class=\"checkbox ml-2\">\n <input type=\"checkbox\" class=\"selector\"\n [(ngModel)]=\"header.selected\"\n (change)=\"updateGroupHeader(group.key); refresh()\"\n >\n <span class=\"ml-2\">{{header.header}}</span>\n </label>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </div>\n </div>\n</div>\n\n<ng-template #loader>\n <div class=\"has-text-center py-3\">\n <fa-icon icon=\"spinner\" [pulse]=\"true\" size=\"lg\"></fa-icon>\n </div>\n</ng-template>\n", styles: [".toggle-all{border-bottom:1px solid #7a7a7a}.drag-container,.table-container{max-height:45vh;overflow-y:auto}.cdk-drag-preview{border-radius:2px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;list-style:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], components: [{ type: i1__namespace.FaIconComponent, selector: "fa-icon", inputs: ["classes", "icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }], directives: [{ type: i1__namespace$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i6__namespace$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], pipes: { "keys": KeysPipe } });
|
|
4948
4953
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: NodeCsvSelectHeadersComponent, decorators: [{
|
|
4949
4954
|
type: i0.Component,
|
|
4950
4955
|
args: [{
|