ng-tailwind 4.0.0 → 4.0.1

package/bundles/ng-tailwind.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/forms'), require('@angular/animations'), require('@angular/router'), require('rxjs'), require('angular-svg-icon'), require('@angular/common/http'), require('@ng-select/ng-select'), require('ng2-flatpickr'), require('eloverde-doc-viewer'), require('ngx-dropzone'), require('ngx-viewer'), require('@angular/platform-browser'), require('rxjs/operators'), require('viewerjs')) :
-    typeof define === 'function' && define.amd ? define('ng-tailwind', ['exports', '@angular/common', '@angular/core', '@angular/forms', '@angular/animations', '@angular/router', 'rxjs', 'angular-svg-icon', '@angular/common/http', '@ng-select/ng-select', 'ng2-flatpickr', 'eloverde-doc-viewer', 'ngx-dropzone', 'ngx-viewer', '@angular/platform-browser', 'rxjs/operators', 'viewerjs'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["ng-tailwind"] = {}, global.ng.common, global.ng.core, global.ng.forms, global.ng.animations, global.ng.router, global.rxjs, global["angular-svg-icon"], global.ng.common.http, global["@ng-select/ng-select"], global["ng2-flatpickr"], global["eloverde-doc-viewer"], global["ngx-dropzone"], global["ngx-viewer"], global.ng.platformBrowser, global.rxjs.operators, global.viewerjs));
-})(this, (function (exports, common, core, forms, animations, router, rxjs, angularSvgIcon, http, ngSelect, ng2Flatpickr, eloverdeDocViewer, ngxDropzone, ngxViewer, platformBrowser, operators, Viewer) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/forms'), require('@angular/animations'), require('@angular/router'), require('rxjs'), require('@angular/common/http'), require('angular-svg-icon'), require('@ng-select/ng-select'), require('ng2-flatpickr'), require('eloverde-doc-viewer'), require('ngx-dropzone'), require('ngx-viewer'), require('@angular/platform-browser'), require('rxjs/operators'), require('viewerjs')) :
+    typeof define === 'function' && define.amd ? define('ng-tailwind', ['exports', '@angular/common', '@angular/core', '@angular/forms', '@angular/animations', '@angular/router', 'rxjs', '@angular/common/http', 'angular-svg-icon', '@ng-select/ng-select', 'ng2-flatpickr', 'eloverde-doc-viewer', 'ngx-dropzone', 'ngx-viewer', '@angular/platform-browser', 'rxjs/operators', 'viewerjs'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["ng-tailwind"] = {}, global.ng.common, global.ng.core, global.ng.forms, global.ng.animations, global.ng.router, global.rxjs, global.ng.common.http, global["angular-svg-icon"], global["@ng-select/ng-select"], global["ng2-flatpickr"], global["eloverde-doc-viewer"], global["ngx-dropzone"], global["ngx-viewer"], global.ng.platformBrowser, global.rxjs.operators, global.viewerjs));
+})(this, (function (exports, common, core, forms, animations, router, rxjs, http, angularSvgIcon, ngSelect, ng2Flatpickr, eloverdeDocViewer, ngxDropzone, ngxViewer, platformBrowser, operators, Viewer) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -923,64 +923,6 @@
     function __param(paramIndex, decorator) {
         return function (target, key) { decorator(target, key, paramIndex); };
     }
-    function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
-        function accept(f) { if (f !== void 0 && typeof f !== "function")
-            throw new TypeError("Function expected"); return f; }
-        var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
-        var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
-        var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
-        var _, done = false;
-        for (var i = decorators.length - 1; i >= 0; i--) {
-            var context = {};
-            for (var p in contextIn)
-                context[p] = p === "access" ? {} : contextIn[p];
-            for (var p in contextIn.access)
-                context.access[p] = contextIn.access[p];
-            context.addInitializer = function (f) { if (done)
-                throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
-            var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
-            if (kind === "accessor") {
-                if (result === void 0)
-                    continue;
-                if (result === null || typeof result !== "object")
-                    throw new TypeError("Object expected");
-                if (_ = accept(result.get))
-                    descriptor.get = _;
-                if (_ = accept(result.set))
-                    descriptor.set = _;
-                if (_ = accept(result.init))
-                    initializers.push(_);
-            }
-            else if (_ = accept(result)) {
-                if (kind === "field")
-                    initializers.push(_);
-                else
-                    descriptor[key] = _;
-            }
-        }
-        if (target)
-            Object.defineProperty(target, contextIn.name, descriptor);
-        done = true;
-    }
-    ;
-    function __runInitializers(thisArg, initializers, value) {
-        var useValue = arguments.length > 2;
-        for (var i = 0; i < initializers.length; i++) {
-            value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
-        }
-        return useValue ? value : void 0;
-    }
-    ;
-    function __propKey(x) {
-        return typeof x === "symbol" ? x : "".concat(x);
-    }
-    ;
-    function __setFunctionName(f, name, prefix) {
-        if (typeof name === "symbol")
-            name = name.description ? "[".concat(name.description, "]") : "";
-        return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
-    }
-    ;
     function __metadata(metadataKey, metadataValue) {
         if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
             return Reflect.metadata(metadataKey, metadataValue);
@@ -1180,7 +1122,7 @@
     function __asyncDelegator(o) {
         var i, p;
         return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
-        function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }
+        function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
     }
     function __asyncValues(o) {
         if (!Symbol.asyncIterator)
@@ -1617,6 +1559,9 @@
         NgtCheckboxComponent.prototype.isToggleMode = function () {
             return this.mode === exports.NgtCheckboxMode.TOGGLE;
         };
+        NgtCheckboxComponent.prototype.isSideToggleMode = function () {
+            return this.mode === exports.NgtCheckboxMode.SIDE_TOGGLE;
+        };
         NgtCheckboxComponent.prototype.isDefaultMode = function () {
             return this.mode === exports.NgtCheckboxMode.DEFAULT;
         };
@@ -1637,9 +1582,9 @@
     NgtCheckboxComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'ngt-checkbox',
-                    template: "<div class=\"inline-flex items-center {{ isDisabled ? 'cursor-not-allowed' : 'cursor-pointer' }}\"\n    [class.flex-col]='isToggleMode()'>\n    <label class=\"inline-flex items-center {{ isDisabled ? 'cursor-not-allowed' : 'cursor-pointer' }}\"\n        [class.flex-col]='isToggleMode()'>\n        <input type=\"checkbox\" [name]='name' class=\"hidden\" ([ngModel])='value'\n            [disabled]=\"isDisabled || isClickDisabled\" #element>\n\n        <span *ngIf=\"isToggleMode() && label\" class=\"flex\">\n            <span class=\"{{ ngtStyle.compile(['text', 'fontCase']) }} mb-2\">{{ label }}</span>\n\n            <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n                {{ helpText }}\n            </ngt-helper>\n        </span>\n\n        <ng-container *ngIf=\"isDefaultMode()\">\n            <div style=\"transition: background-color .2s ease-out\"\n                class=\"{{ value ? ngtStyle.compile(['color.bg']) : 'bg-white' }}  {{ ngtStyle.compile(['h', 'w']) }}\n                    shadow rounded border border-gray-400 {{ isDisabled ? 'opacity-50' : '' }} {{ !shining ? 'flex justify-center' : 'hidden' }}\">\n                <svg class=\"fill-current self-center text-white pointer-events-none\" xmlns=\"http://www.w3.org/2000/svg\"\n                    viewBox=\"0 0 20 20\">\n                    <path d=\"M0 11l2-2 5 5L18 3l2 2L7 18z\" />\n                </svg>\n            </div>\n        </ng-container>\n\n        <ng-container *ngIf=\"isRadioMode()\">\n            <div style=\"transition: background-color .2s ease-out\"\n                class=\"{{ value ? ngtStyle.compile(['color.border', 'color.text']) : 'border-gray-500' }} {{ isDisabled ? 'opacity-50' : '' }}\n                    shadow w-6 h-6 rounded-full border-2 border-gray-400 {{ !shining ? 'flex justify-center' : 'hidden' }}\">\n                <svg *ngIf=\"value\" class=\"fill-current self-center h-3\" xmlns=\"http://www.w3.org/2000/svg\"\n                    viewBox=\"0 0 29.107 29.107\">\n                    <path\n                        d=\"M14.554 0C6.561 0 0 6.562 0 14.552c0 7.996 6.561 14.555 14.554 14.555 7.996 0 14.553-6.559 14.553-14.555C29.106 6.562 22.55 0 14.554 0z\" />\n                </svg>\n            </div>\n        </ng-container>\n\n        <ng-container *ngIf=\"isToggleMode()\">\n            <div class=\"{{ value ? 'justify-end' : 'bg-white justify-start' }} {{ isDisabled ? 'opacity-50' : '' }}\n                    shadow w-16 h-8 rounded-full border border-gray-400 {{ !shining ? 'flex' : 'hidden' }}\"\n                style=\"padding: 1px;\">\n                <div *ngIf=\"value\"\n                    class=\"flex text-xs text-white {{ ngtStyle.compile(['color.bg']) }} pointer-events-none rounded-full px-2 py-3\"\n                    @slideLeftToRight>\n                    <svg class=\"fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                        <path d=\"M0 11l2-2 5 5L18 3l2 2L7 18z\" />\n                    </svg>\n                </div>\n\n                <div *ngIf=\"!value\"\n                    class=\"flex text-xl text-white bg-gray-300 pointer-events-none rounded-full px-1 py-3\"\n                    @slideRightToLeft>\n                    <svg class=\"fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                        <path class=\"heroicon-ui\"\n                            d=\"M16.24 14.83a1 1 0 0 1-1.41 1.41L12 13.41l-2.83 2.83a1 1 0 0 1-1.41-1.41L10.59 12 7.76 9.17a1 1 0 0 1 1.41-1.41L12 10.59l2.83-2.83a1 1 0 0 1 1.41 1.41L13.41 12l2.83 2.83z\" />\n                    </svg>\n                </div>\n            </div>\n        </ng-container>\n\n        <ng-container *ngIf='label && !shining && !isToggleMode()'>\n            <span class=\"{{ ngtStyle.compile(['text', 'fontCase']) }} ml-2\">{{ label }}</span>\n\n            <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n                {{ helpText }}\n            </ngt-helper>\n        </ng-container>\n    </label>\n</div>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"w-16 h-12\"></ngt-shining>\n    </div>\n</ng-container>\n",
+                    template: "<label class=\"flex items-center {{ isDisabled ? 'cursor-not-allowed' : 'cursor-pointer' }}\"\n    [class.flex-col]='isToggleMode()' style=\"max-width: max-content;\">\n    <input type=\"checkbox\" [name]='name' class=\"hidden\" ([ngModel])='value' [disabled]=\"isDisabled || isClickDisabled\"\n        #element>\n\n    <span *ngIf=\"isToggleMode() && label\" class=\"flex\">\n        <span class=\"{{ ngtStyle.compile(['text', 'fontCase']) }} mb-2\">{{ label }}</span>\n\n        <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n            {{ helpText }}\n        </ngt-helper>\n    </span>\n\n    <ng-container *ngIf=\"isDefaultMode()\">\n        <div style=\"transition: background-color .2s ease-out\"\n            class=\"{{ value ? ngtStyle.compile(['color.bg']) : 'bg-white' }}  {{ ngtStyle.compile(['h', 'w']) }}\n                    shadow rounded border border-gray-400 {{ isDisabled ? 'opacity-50' : '' }} {{ !shining ? 'flex justify-center' : 'hidden' }}\">\n            <svg class=\"fill-current self-center text-white pointer-events-none\" xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 20 20\">\n                <path d=\"M0 11l2-2 5 5L18 3l2 2L7 18z\" />\n            </svg>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isRadioMode()\">\n        <div style=\"transition: background-color .2s ease-out\"\n            class=\"{{ value ? ngtStyle.compile(['color.border', 'color.text']) : 'border-gray-500' }} {{ isDisabled ? 'opacity-50' : '' }}\n                    shadow w-6 h-6 rounded-full border-2 border-gray-400 {{ !shining ? 'flex justify-center' : 'hidden' }}\">\n            <svg *ngIf=\"value\" class=\"fill-current self-center h-3\" xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 29.107 29.107\">\n                <path\n                    d=\"M14.554 0C6.561 0 0 6.562 0 14.552c0 7.996 6.561 14.555 14.554 14.555 7.996 0 14.553-6.559 14.553-14.555C29.106 6.562 22.55 0 14.554 0z\" />\n            </svg>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isToggleMode() || isSideToggleMode()\">\n        <div class=\"shadow w-16 h-8 rounded-full border border-gray-400 {{ shining ? 'hidden' : 'flex' }}\"\n            [class.justify-end]=\"value\" [class.opacity-50]=\"isDisabled\" style=\"padding: 1px;\">\n            <div *ngIf=\"value\"\n                class=\"flex text-xs text-white {{ ngtStyle.compile(['color.bg']) }} pointer-events-none rounded-full px-2 py-3\"\n                @slideLeftToRight>\n                <svg class=\"fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">\n                    <path d=\"M0 11l2-2 5 5L18 3l2 2L7 18z\" />\n                </svg>\n            </div>\n\n            <div *ngIf=\"!value\" class=\"flex text-xl text-white bg-gray-300 pointer-events-none rounded-full px-1 py-3\"\n                @slideRightToLeft>\n                <svg class=\"fill-current self-center\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                    <path class=\"heroicon-ui\"\n                        d=\"M16.24 14.83a1 1 0 0 1-1.41 1.41L12 13.41l-2.83 2.83a1 1 0 0 1-1.41-1.41L10.59 12 7.76 9.17a1 1 0 0 1 1.41-1.41L12 10.59l2.83-2.83a1 1 0 0 1 1.41 1.41L13.41 12l2.83 2.83z\" />\n                </svg>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf='label && !shining && !isToggleMode()'>\n        <span class=\"{{ ngtStyle.compile(['text', 'fontCase']) }} ml-2\">{{ label }}</span>\n\n        <ngt-helper *ngIf=\"helpText\" [helpTitle]=\"helpTitle\" [iconColor]=\"helpTextColor\" class=\"ml-1\">\n            {{ helpText }}\n        </ngt-helper>\n    </ng-container>\n</label>\n\n<ng-container *ngIf='shining'>\n    <div class=\"flex\">\n        <ngt-shining class=\"w-16 h-12\"></ngt-shining>\n    </div>\n</ng-container>",
                     providers: [
-                        NgtMakeProvider(NgtCheckboxComponent),
+                        NgtMakeProvider(NgtCheckboxComponent)
                     ],
                     viewProviders: [
                         { provide: forms.ControlContainer, useExisting: forms.NgForm }
@@ -1656,7 +1601,7 @@
                             animations.transition(':enter', [
                                 animations.animate(200)
                             ])
-                        ]),
+                        ])
                     ],
                     styles: [""]
                 },] }
@@ -1684,6 +1629,7 @@
     (function (NgtCheckboxMode) {
         NgtCheckboxMode["DEFAULT"] = "DEFAULT";
         NgtCheckboxMode["TOGGLE"] = "TOGGLE";
+        NgtCheckboxMode["SIDE_TOGGLE"] = "SIDE_TOGGLE";
         NgtCheckboxMode["RADIO"] = "RADIO";
     })(exports.NgtCheckboxMode || (exports.NgtCheckboxMode = {}));
 
@@ -1750,7 +1696,7 @@
                     imports: [
                         common.CommonModule,
                         http.HttpClientModule,
-                        angularSvgIcon.AngularSvgIconModule
+                        angularSvgIcon.AngularSvgIconModule.forRoot()
                     ]
                 },] }
     ];
@@ -4065,29 +4011,40 @@
             this.filtersDescription[reference] = description;
         };
         NgtDatatableComponent.prototype.removeFilter = function (reference, refresh) {
-            var _this = this;
             if (refresh === void 0) { refresh = true; }
-            if (reference && !this.hasAppliedFilter(reference)) {
-                return;
-            }
-            this.cleaningFilter = true;
-            if (!reference) {
-                this.currentState.filters.defaultFilters = {};
-                this.currentState.filters.silentFilters = {};
-                this.filtersTranslated = [];
-            }
-            else {
-                delete this.currentState.filters.defaultFilters[reference];
-                delete this.currentState.filters.silentFilters[reference];
-                this.filtersTranslated = this.filtersTranslated.filter(function (element) { return element && element.reference !== reference; });
-            }
-            this.onClearFilter.emit(reference);
-            if (this.inputSearch && (reference === 'term' || !reference)) {
-                this.inputSearch.clearInput();
-            }
-            if (refresh) {
-                this.apply(this.ngtPagination.getCurrentPage(), false).then(function () { return _this.cleaningFilter = false; });
-            }
+            return __awaiter(this, void 0, void 0, function () {
+                var _this = this;
+                return __generator(this, function (_b) {
+                    return [2 /*return*/, new Promise(function (resolve) {
+                            if (reference && !_this.hasAppliedFilter(reference)) {
+                                return resolve();
+                            }
+                            _this.cleaningFilter = true;
+                            if (!reference) {
+                                _this.currentState.filters.defaultFilters = {};
+                                _this.currentState.filters.silentFilters = {};
+                                _this.filtersTranslated = [];
+                            }
+                            else {
+                                delete _this.currentState.filters.defaultFilters[reference];
+                                delete _this.currentState.filters.silentFilters[reference];
+                                _this.filtersTranslated = _this.filtersTranslated.filter(function (element) { return element && element.reference !== reference; });
+                            }
+                            _this.onClearFilter.emit(reference);
+                            if (_this.inputSearch && (reference === 'term' || !reference)) {
+                                _this.inputSearch.clearInput();
+                            }
+                            if (refresh) {
+                                return _this.apply(_this.ngtPagination.getCurrentPage(), false)
+                                    .then(function () {
+                                    _this.cleaningFilter = false;
+                                    resolve();
+                                });
+                            }
+                            resolve();
+                        })];
+                });
+            });
         };
         NgtDatatableComponent.prototype.hasAppliedFilter = function (filter) {
             var reference = typeof filter === 'string' ? filter : Object.keys(filter !== null && filter !== void 0 ? filter : {})[0];
@@ -7278,6 +7235,7 @@
             });
             return _this;
         }
+        ;
         NgtDropzoneComponent.prototype.ngOnChanges = function (changes) {
             if (changes.previewType) {
                 this.previewType = getEnumFromString(changes.previewType.currentValue, exports.NgtDropzonePreviewType);
@@ -7400,16 +7358,20 @@
         };
         NgtDropzoneComponent.prototype.uploadFiles = function (files) {
             return __awaiter(this, void 0, void 0, function () {
-                var temporaryFiles_1, temporaryAttachments_1, observables_1;
+                var temporaryFiles_1, temporaryAttachments_1, observables_1, unacceptedFiles_1;
                 var _this = this;
                 return __generator(this, function (_a) {
                     if (files && files.length) {
                         temporaryFiles_1 = [];
                         temporaryAttachments_1 = [];
                         observables_1 = [];
+                        unacceptedFiles_1 = [];
                         this.loading = true;
                         this.onFileUploadInit.emit();
                         files.forEach(function (file) {
+                            if (file.type.includes(_this.unacceptedFiles)) {
+                                return unacceptedFiles_1.push(file);
+                            }
                             observables_1.push(_this.ngtAttachmentHttpService.upload(_this.remoteResource, file).pipe(operators.map(function (response) {
                                 if (response && response.data) {
                                     if (response.data.attributes && response.data.attributes.data) {
@@ -7425,6 +7387,10 @@
                                 }
                             })));
                         });
+                        if (!observables_1.length && unacceptedFiles_1.length) {
+                            this.loading = false;
+                            return [2 /*return*/, this.onFileSelectError.emit(exports.NgtDropzoneErrorType.TYPE)];
+                        }
                         this.subscriptions.push(rxjs.forkJoin(observables_1).subscribe(function (response) {
                             var _a;
                             (_a = _this.uploadedResources).push.apply(_a, __spreadArray([], __read(temporaryFiles_1)));
@@ -7436,6 +7402,9 @@
                             }
                             _this.onFileUploaded.emit();
                             _this.loading = false;
+                            if (unacceptedFiles_1.length) {
+                                _this.onFileSelectError.emit(exports.NgtDropzoneErrorType.TYPE);
+                            }
                         }, function (error) {
                             _this.onFileUploadFail.emit(error);
                             _this.loading = false;
@@ -7637,6 +7606,7 @@
         canDownloadFile: [{ type: core.Input }],
         verticalExpandable: [{ type: core.Input }],
         acceptedFiles: [{ type: core.Input }],
+        unacceptedFiles: [{ type: core.Input }],
         maxFileSize: [{ type: core.Input }],
         previewType: [{ type: core.Input }],
         isRequired: [{ type: core.Input }],