ng-tailwind 3.32.371 → 3.32.372
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/ng-tailwind.umd.js +40 -12
- package/bundles/ng-tailwind.umd.js.map +1 -1
- package/components/ngt-multi-select/ngt-multi-select.component.d.ts +4 -2
- package/esm2015/components/ngt-multi-select/ngt-multi-select.component.js +38 -13
- package/fesm2015/ng-tailwind.js +37 -12
- package/fesm2015/ng-tailwind.js.map +1 -1
- package/ng-tailwind.metadata.json +1 -1
- package/package.json +1 -1
|
@@ -6769,8 +6769,14 @@
|
|
|
6769
6769
|
var _this = this;
|
|
6770
6770
|
setTimeout(function () { return _this.inputSearch.setFocus(); });
|
|
6771
6771
|
};
|
|
6772
|
-
NgtMultiSelectComponent.prototype.refresh = function () {
|
|
6773
|
-
|
|
6772
|
+
NgtMultiSelectComponent.prototype.refresh = function (itemsPerPage, searchTerm) {
|
|
6773
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
6774
|
+
return __generator(this, function (_c) {
|
|
6775
|
+
this.itemsPerPage = itemsPerPage !== undefined ? itemsPerPage : this.itemsPerPage;
|
|
6776
|
+
this.searchTerm = searchTerm !== undefined ? searchTerm : this.searchTerm;
|
|
6777
|
+
return [2 /*return*/, this.loadData(this.itemsPerPage, this.searchTerm)];
|
|
6778
|
+
});
|
|
6779
|
+
});
|
|
6774
6780
|
};
|
|
6775
6781
|
NgtMultiSelectComponent.prototype.reset = function () {
|
|
6776
6782
|
this.value = [];
|
|
@@ -6796,6 +6802,28 @@
|
|
|
6796
6802
|
});
|
|
6797
6803
|
}
|
|
6798
6804
|
};
|
|
6805
|
+
NgtMultiSelectComponent.prototype.selectElements = function (elements) {
|
|
6806
|
+
var _this = this;
|
|
6807
|
+
if (!this.isDisabled) {
|
|
6808
|
+
var elementIds_1 = this.isColoquentResources() ? elements.map(function (element) { return element.getApiId(); }) : elements;
|
|
6809
|
+
this.selectableElements.forEach(function (selectableElement) {
|
|
6810
|
+
var value = selectableElement.value;
|
|
6811
|
+
if (!selectableElement.isSelected
|
|
6812
|
+
&& ((_this.isColoquentResources() && elementIds_1.includes(value.getApiId()))
|
|
6813
|
+
|| elementIds_1.includes(value))) {
|
|
6814
|
+
selectableElement.isSelected = true;
|
|
6815
|
+
_this.handleElementSelection(selectableElement);
|
|
6816
|
+
}
|
|
6817
|
+
});
|
|
6818
|
+
}
|
|
6819
|
+
};
|
|
6820
|
+
NgtMultiSelectComponent.prototype.toggleItem = function (selectableElement, event) {
|
|
6821
|
+
event === null || event === void 0 ? void 0 : event.stopImmediatePropagation();
|
|
6822
|
+
if (!this.isDisabled) {
|
|
6823
|
+
selectableElement.isSelected = !selectableElement.isSelected;
|
|
6824
|
+
this.handleElementSelection(selectableElement);
|
|
6825
|
+
}
|
|
6826
|
+
};
|
|
6799
6827
|
NgtMultiSelectComponent.prototype.onNativeChange = function (selectableElement) {
|
|
6800
6828
|
if (this.componentReady) {
|
|
6801
6829
|
this.handleElementSelection(selectableElement);
|
|
@@ -6824,16 +6852,9 @@
|
|
|
6824
6852
|
}
|
|
6825
6853
|
}
|
|
6826
6854
|
};
|
|
6827
|
-
NgtMultiSelectComponent.prototype.toggleItem = function (event, selectableElement) {
|
|
6828
|
-
event.stopImmediatePropagation();
|
|
6829
|
-
if (!this.isDisabled) {
|
|
6830
|
-
selectableElement.isSelected = !selectableElement.isSelected;
|
|
6831
|
-
this.handleElementSelection(selectableElement);
|
|
6832
|
-
}
|
|
6833
|
-
};
|
|
6834
6855
|
NgtMultiSelectComponent.prototype.search = function (term) {
|
|
6835
6856
|
var _this = this;
|
|
6836
|
-
if (!this.componentReady || term === undefined || term === null || term === this.previousSearchTerm) {
|
|
6857
|
+
if (!this.componentReady || term === undefined || term === null || term === this.previousSearchTerm || this.loading) {
|
|
6837
6858
|
return;
|
|
6838
6859
|
}
|
|
6839
6860
|
if (this.searchTimeout) {
|
|
@@ -6886,7 +6907,6 @@
|
|
|
6886
6907
|
}
|
|
6887
6908
|
else if (!selectableElement.isSelected && this.isSelectedElement(selectableElement)) {
|
|
6888
6909
|
this.selectedElements = this.selectedElements.filter(function (selectedElement) { return selectedElement.uuid !== selectableElement.uuid; });
|
|
6889
|
-
;
|
|
6890
6910
|
this.onNativeChange(selectableElement);
|
|
6891
6911
|
if (this.displayOnlySelected && !this.selectedElements.length) {
|
|
6892
6912
|
this.displayOnlySelected = false;
|
|
@@ -6902,11 +6922,15 @@
|
|
|
6902
6922
|
var _c;
|
|
6903
6923
|
var _a, _b;
|
|
6904
6924
|
if (_this.remoteResource) {
|
|
6925
|
+
if (_this.loading) {
|
|
6926
|
+
return resolve();
|
|
6927
|
+
}
|
|
6905
6928
|
if (perpage == _this.itemsPerPage) {
|
|
6906
6929
|
(_b = (_a = _this.containerRef) === null || _a === void 0 ? void 0 : _a.nativeElement) === null || _b === void 0 ? void 0 : _b.scrollTo({ top: 0 });
|
|
6907
6930
|
}
|
|
6908
6931
|
_this.selectableElements = [];
|
|
6909
6932
|
_this.loading = true;
|
|
6933
|
+
_this.itemsPerPage = perpage;
|
|
6910
6934
|
var pagination = Object.assign(Object.assign({}, _this.pagination), { per_page: perpage });
|
|
6911
6935
|
var filters = searchTerm ? (_c = {}, _c[_this.bindSearch] = searchTerm, _c) : null;
|
|
6912
6936
|
_this.subscriptions.push(_this.ngtHttpService.get(_this.remoteResource, filters, pagination).subscribe(function (response) {
|
|
@@ -7011,6 +7035,10 @@
|
|
|
7011
7035
|
var _a;
|
|
7012
7036
|
return !((_a = this.containerRef) === null || _a === void 0 ? void 0 : _a.nativeElement.offsetParent);
|
|
7013
7037
|
};
|
|
7038
|
+
NgtMultiSelectComponent.prototype.isColoquentResources = function () {
|
|
7039
|
+
var _a;
|
|
7040
|
+
return ((_a = this.selectableElements) === null || _a === void 0 ? void 0 : _a.length) && typeof this.selectableElements[0].value['getApiId'] === 'function';
|
|
7041
|
+
};
|
|
7014
7042
|
NgtMultiSelectComponent.prototype.destroySubscriptions = function () {
|
|
7015
7043
|
this.subscriptions.forEach(function (subscription) { return subscription.unsubscribe(); });
|
|
7016
7044
|
this.subscriptions = [];
|
|
@@ -7020,7 +7048,7 @@
|
|
|
7020
7048
|
NgtMultiSelectComponent.decorators = [
|
|
7021
7049
|
{ type: core.Component, args: [{
|
|
7022
7050
|
selector: 'ngt-multi-select',
|
|
7023
|
-
template: "<label *ngIf=\"label && !shining\" class=\"flex text-sm\" [class.mb-2]='!hasValidationErrors()'>\n {{ label }}:\n\n <span *ngIf=\"isRequired\" class=\"text-red-500 font-bold text-md ml-1\">*</span>\n\n <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n {{ helpText }}\n </ngt-helper>\n</label>\n\n<ngt-validation [hidden]='shining' class=\"block mb-1\" [control]='formControl' [container]='formContainer'>\n</ngt-validation>\n\n<div class=\"{{ shining ? 'hidden' : 'flex flex-col' }} border w-full rounded {{ ngtStyle.compile(['h']) }}\"\n style=\"min-height: 16rem;\" [class.border-red-500]='hasValidationErrors()' [class.disabled-background]='isDisabled'>\n <div class=\"flex items-center w-full p-2 border-b\">\n <ngt-checkbox class=\"flex\" title=\"Selecionar todos\" [label]=\"!searchable ? 'Selecionar todos' : ''\"\n [(ngModel)]=\"selectAllCheckbox\" [name]=\"selectAllCheckboxName\" [isClickDisabled]='true'\n [isDisabled]='loading || isDisabled' h='h-5' w='w-5' (click)='selectAll()' ngt-stylizable>\n </ngt-checkbox>\n\n <ngt-input *ngIf=\"searchable\" class=\"block w-full pl-2\" [name]='searchInputName' [(ngModel)]='searchTerm'\n placeholder='Buscar...' [allowClear]='true' [jit]='true' h='h-10' (ngModelChange)='search($event)'\n [loading]='loading' [isDisabled]='isDisabled' ngt-stylizable #inputSearch>\n </ngt-input>\n </div>\n\n <div *ngIf=\"loading\" class=\"flex justify-center items-center h-full w-full cursor-wait\">\n <div class=\"div-loader\"></div>\n </div>\n\n <div class=\"w-full overflow-y-auto text-sm {{ loading ? 'hidden' : 'flex flex-col' }}\" (scroll)='onScroll($event)'\n #containerRef>\n <ng-container *ngIf=\"customHeaderTemplate\" [ngTemplateOutlet]=\"customHeaderTemplate\">\n </ng-container>\n\n <ng-container *ngFor=\"let element of getSelectableElements(); let i = index\">\n <div class=\"flex w-full items-center hover:bg-gray-200 {{ isDisabled ? 'cursor-not-allowed' : 'cursor-pointer' }}\"\n [class.p-2]='!customOptionTemplate' (click)='toggleItem($event
|
|
7051
|
+
template: "<label *ngIf=\"label && !shining\" class=\"flex text-sm\" [class.mb-2]='!hasValidationErrors()'>\n {{ label }}:\n\n <span *ngIf=\"isRequired\" class=\"text-red-500 font-bold text-md ml-1\">*</span>\n\n <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n {{ helpText }}\n </ngt-helper>\n</label>\n\n<ngt-validation [hidden]='shining' class=\"block mb-1\" [control]='formControl' [container]='formContainer'>\n</ngt-validation>\n\n<div class=\"{{ shining ? 'hidden' : 'flex flex-col' }} border w-full rounded {{ ngtStyle.compile(['h']) }}\"\n style=\"min-height: 16rem;\" [class.border-red-500]='hasValidationErrors()' [class.disabled-background]='isDisabled'>\n <div class=\"flex items-center w-full p-2 border-b\">\n <ngt-checkbox class=\"flex\" title=\"Selecionar todos\" [label]=\"!searchable ? 'Selecionar todos' : ''\"\n [(ngModel)]=\"selectAllCheckbox\" [name]=\"selectAllCheckboxName\" [isClickDisabled]='true'\n [isDisabled]='loading || isDisabled' h='h-5' w='w-5' (click)='selectAll()' ngt-stylizable>\n </ngt-checkbox>\n\n <ngt-input *ngIf=\"searchable\" class=\"block w-full pl-2\" [name]='searchInputName' [(ngModel)]='searchTerm'\n placeholder='Buscar...' [allowClear]='true' [jit]='true' h='h-10' (ngModelChange)='search($event)'\n [loading]='loading' [isDisabled]='isDisabled' ngt-stylizable #inputSearch>\n </ngt-input>\n </div>\n\n <div *ngIf=\"loading\" class=\"flex justify-center items-center h-full w-full cursor-wait\">\n <div class=\"div-loader\"></div>\n </div>\n\n <div class=\"w-full overflow-y-auto text-sm {{ loading ? 'hidden' : 'flex flex-col' }}\" (scroll)='onScroll($event)'\n #containerRef>\n <ng-container *ngIf=\"customHeaderTemplate\" [ngTemplateOutlet]=\"customHeaderTemplate\">\n </ng-container>\n\n <ng-container *ngFor=\"let element of getSelectableElements(); let i = index\">\n <div class=\"flex w-full items-center hover:bg-gray-200 {{ isDisabled ? 'cursor-not-allowed' : 'cursor-pointer' }}\"\n [class.p-2]='!customOptionTemplate' (click)='toggleItem(element, $event)'>\n <ng-template let-element #elementCheckboxTemplate>\n <ngt-checkbox class=\"flex pr-2\" [name]='element.uuid' [(ngModel)]=\"element.isSelected\"\n (ngModelChange)='onNativeChange(element)' [isClickDisabled]='true' [isDisabled]='isDisabled'\n h='h-5' w='w-5' (click)='toggleItem(element, $event)' ngt-stylizable>\n </ngt-checkbox>\n </ng-template>\n\n <ng-template let-element #defaultOptionTemplate>\n {{ getSelectableElementValue(element) }}\n </ng-template>\n\n <ng-container *ngIf=\"!customOptionTemplate\" [ngTemplateOutlet]=\"elementCheckboxTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: element }\">\n </ng-container>\n\n <ng-container [ngTemplateOutlet]=\"customOptionTemplate || defaultOptionTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: element, index: i }\">\n </ng-container>\n </div>\n </ng-container>\n\n <p *ngIf=\"!getSelectableElements()?.length\" class=\"text-center mt-4\">\n {{ ngtTranslateService.ngtMultiSelectNoDataFound }}\n </p>\n </div>\n</div>\n\n<div class=\"{{ shining ? 'hidden' : 'flex' }} w-full items-center mt-2\">\n <span class=\"text-sm mr-4\">\n {{ selectedElements?.length || 0 }} / {{ itemsTotal || 0 }}\n </span>\n\n <ngt-checkbox class=\"flex\" label=\"Visualizar selecionados\" [name]='displayOnlySelectedName'\n [(ngModel)]=\"displayOnlySelected\" [isDisabled]='loading' h='h-5' w='w-5' ngt-stylizable>\n </ngt-checkbox>\n</div>\n\n<ngt-shining *ngIf='shining' class=\"block w-full {{ ngtStyle.compile(['h']) }}\" style=\"min-height: 16rem;\"\n rounded='rounded' ngt-stylizable>\n</ngt-shining>\n\n<input *ngIf='componentReady' type='hidden' [ngModel]='value' [name]='name' [value]='value'>",
|
|
7024
7052
|
encapsulation: core.ViewEncapsulation.None,
|
|
7025
7053
|
providers: [
|
|
7026
7054
|
NgtMakeProvider(NgtMultiSelectComponent)
|