@gipisistemas/ng-core 1.1.3 → 1.1.5

package/bundles/gipisistemas-ng-core.umd.js

@@ -1,8 +1,10 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/cdk/stepper'), require('@angular/common'), require('@angular/flex-layout'), require('@angular/forms'), require('@angular/material'), require('@angular/router'), require('@material-extended/mde'), require('angular-mentions'), require('ngx-currency'), require('ngx-infinite-scroll'), require('ngx-mask'), require('ngx-material-timepicker'), require('@angular/cdk-experimental/popover-edit'), require('@angular/cdk/a11y'), require('@angular/cdk/drag-drop'), require('@angular/cdk/portal'), require('@angular/cdk/scrolling'), require('@angular/cdk/table'), require('@angular/cdk/tree'), require('@angular/material/autocomplete'), require('@angular/material/badge'), require('@angular/material/bottom-sheet'), require('@angular/material/button'), require('@angular/material/button-toggle'), require('@angular/material/card'), require('@angular/material/checkbox'), require('@angular/material/chips'), require('@angular/material/core'), require('@angular/material/dialog'), require('@angular/material/divider'), require('@angular/material/expansion'), require('@angular/material/form-field'), require('@angular/material/grid-list'), require('@angular/material/icon'), require('@angular/material/input'), require('@angular/material/list'), require('@angular/material/menu'), require('@angular/material/paginator'), require('@angular/material/progress-bar'), require('@angular/material/progress-spinner'), require('@angular/material/radio'), require('@angular/material/select'), require('@angular/material/sidenav'), require('@angular/material/slide-toggle'), require('@angular/material/slider'), require('@angular/material/snack-bar'), require('@angular/material/sort'), require('@angular/material/stepper'), require('@angular/material/table'), require('@angular/material/tabs'), require('@angular/material/toolbar'), require('@angular/material/tooltip'), require('@angular/material/tree'), require('@angular/common/http'), require('rxjs'), require('rxjs/operators'), require('@angular/animations'), require('@angular/cdk/keycodes'), require('@angular/cdk/coercion'), require('@angular/cdk/layout'), require('@angular/cdk/platform'), require('@angular/cdk/bidi'), require('@angular/cdk/overlay'), require('moment'), require('@angular/material/datepicker'), require('@angular/platform-browser/animations'), require('@angular/platform-browser'), require('@brazilian-utils/brazilian-utils'), require('libphonenumber-js')) :
-    typeof define === 'function' && define.amd ? define('@gipisistemas/ng-core', ['exports', '@angular/core', '@angular/cdk/stepper', '@angular/common', '@angular/flex-layout', '@angular/forms', '@angular/material', '@angular/router', '@material-extended/mde', 'angular-mentions', 'ngx-currency', 'ngx-infinite-scroll', 'ngx-mask', 'ngx-material-timepicker', '@angular/cdk-experimental/popover-edit', '@angular/cdk/a11y', '@angular/cdk/drag-drop', '@angular/cdk/portal', '@angular/cdk/scrolling', '@angular/cdk/table', '@angular/cdk/tree', '@angular/material/autocomplete', '@angular/material/badge', '@angular/material/bottom-sheet', '@angular/material/button', '@angular/material/button-toggle', '@angular/material/card', '@angular/material/checkbox', '@angular/material/chips', '@angular/material/core', '@angular/material/dialog', '@angular/material/divider', '@angular/material/expansion', '@angular/material/form-field', '@angular/material/grid-list', '@angular/material/icon', '@angular/material/input', '@angular/material/list', '@angular/material/menu', '@angular/material/paginator', '@angular/material/progress-bar', '@angular/material/progress-spinner', '@angular/material/radio', '@angular/material/select', '@angular/material/sidenav', '@angular/material/slide-toggle', '@angular/material/slider', '@angular/material/snack-bar', '@angular/material/sort', '@angular/material/stepper', '@angular/material/table', '@angular/material/tabs', '@angular/material/toolbar', '@angular/material/tooltip', '@angular/material/tree', '@angular/common/http', 'rxjs', 'rxjs/operators', '@angular/animations', '@angular/cdk/keycodes', '@angular/cdk/coercion', '@angular/cdk/layout', '@angular/cdk/platform', '@angular/cdk/bidi', '@angular/cdk/overlay', 'moment', '@angular/material/datepicker', '@angular/platform-browser/animations', '@angular/platform-browser', '@brazilian-utils/brazilian-utils', 'libphonenumber-js'], factory) :
-    (global = global || self, factory((global.gipisistemas = global.gipisistemas || {}, global.gipisistemas['ng-core'] = {}), global.ng.core, global.ng.cdk.stepper, global.ng.common, global.ng['flex-layout'], global.ng.forms, global.ng.material, global.ng.router, global.mde, global.angularMentions, global.ngxCurrency, global.ngxInfiniteScroll, global.ngxMask, global.ngxMaterialTimepicker, global.ng['cdk-experimental']['popover-edit'], global.ng.cdk.a11y, global.ng.cdk['drag-drop'], global.ng.cdk.portal, global.ng.cdk.scrolling, global.ng.cdk.table, global.ng.cdk.tree, global.ng.material.autocomplete, global.ng.material.badge, global.ng.material['bottom-sheet'], global.ng.material.button, global.ng.material['button-toggle'], global.ng.material.card, global.ng.material.checkbox, global.ng.material.chips, global.ng.material.core, global.ng.material.dialog, global.ng.material.divider, global.ng.material.expansion, global.ng.material['form-field'], global.ng.material['grid-list'], global.ng.material.icon, global.ng.material.input, global.ng.material.list, global.ng.material.menu, global.ng.material.paginator, global.ng.material['progress-bar'], global.ng.material['progress-spinner'], global.ng.material.radio, global.ng.material.select, global.ng.material.sidenav, global.ng.material['slide-toggle'], global.ng.material.slider, global.ng.material['snack-bar'], global.ng.material.sort, global.ng.material.stepper, global.ng.material.table, global.ng.material.tabs, global.ng.material.toolbar, global.ng.material.tooltip, global.ng.material.tree, global.ng.common.http, global.rxjs, global.rxjs.operators, global.ng.animations, global.ng.cdk.keycodes, global.ng.cdk.coercion, global.ng.cdk.layout, global.ng.cdk.platform, global.ng.cdk.bidi, global.ng.cdk.overlay, global.moment_, global.ng.material.datepicker, global.ng.platformBrowser.animations, global.ng.platformBrowser, global.brazilianUtils, global.libphonenumberJs));
-}(this, (function (exports, core, stepper, common, flexLayout, forms, material, router, mde, angularMentions, ngxCurrency, ngxInfiniteScroll, ngxMask, ngxMaterialTimepicker, popoverEdit, a11y, dragDrop, portal, scrolling, table, tree, autocomplete, badge, bottomSheet, button, buttonToggle, card, checkbox, chips, core$1, dialog, divider, expansion, formField, gridList, icon, input, list, menu, paginator, progressBar, progressSpinner, radio, select, sidenav, slideToggle, slider, snackBar, sort, stepper$1, table$1, tabs, toolbar, tooltip, tree$1, http, rxjs, operators, animations, keycodes, coercion, layout, platform, bidi, overlay, moment_, datepicker, animations$1, platformBrowser, brazilianUtils, libphonenumberJs) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/cdk/stepper'), require('@angular/common'), require('@angular/flex-layout'), require('@angular/forms'), require('@angular/material'), require('@angular/router'), require('@material-extended/mde'), require('angular-mentions'), require('ngx-currency'), require('ngx-infinite-scroll'), require('ngx-mask'), require('ngx-material-timepicker'), require('@angular/cdk-experimental/popover-edit'), require('@angular/cdk/a11y'), require('@angular/cdk/drag-drop'), require('@angular/cdk/portal'), require('@angular/cdk/scrolling'), require('@angular/cdk/table'), require('@angular/cdk/tree'), require('@angular/material/autocomplete'), require('@angular/material/badge'), require('@angular/material/bottom-sheet'), require('@angular/material/button'), require('@angular/material/button-toggle'), require('@angular/material/card'), require('@angular/material/checkbox'), require('@angular/material/chips'), require('@angular/material/core'), require('@angular/material/dialog'), require('@angular/material/divider'), require('@angular/material/expansion'), require('@angular/material/form-field'), require('@angular/material/grid-list'), require('@angular/material/icon'), require('@angular/material/input'), require('@angular/material/list'), require('@angular/material/menu'), require('@angular/material/paginator'), require('@angular/material/progress-bar'), require('@angular/material/progress-spinner'), require('@angular/material/radio'), require('@angular/material/select'), require('@angular/material/sidenav'), require('@angular/material/slide-toggle'), require('@angular/material/slider'), require('@angular/material/snack-bar'), require('@angular/material/sort'), require('@angular/material/stepper'), require('@angular/material/table'), require('@angular/material/tabs'), require('@angular/material/toolbar'), require('@angular/material/tooltip'), require('@angular/material/tree'), require('rfdc'), require('@angular/common/http'), require('rxjs'), require('rxjs/operators'), require('libphonenumber-js'), require('@angular/animations'), require('@angular/cdk/keycodes'), require('@angular/cdk/coercion'), require('@angular/cdk/layout'), require('@angular/cdk/platform'), require('@angular/cdk/bidi'), require('@angular/cdk/overlay'), require('moment'), require('@angular/material/datepicker'), require('@angular/platform-browser/animations'), require('@angular/platform-browser'), require('@brazilian-utils/brazilian-utils')) :
+    typeof define === 'function' && define.amd ? define('@gipisistemas/ng-core', ['exports', '@angular/core', '@angular/cdk/stepper', '@angular/common', '@angular/flex-layout', '@angular/forms', '@angular/material', '@angular/router', '@material-extended/mde', 'angular-mentions', 'ngx-currency', 'ngx-infinite-scroll', 'ngx-mask', 'ngx-material-timepicker', '@angular/cdk-experimental/popover-edit', '@angular/cdk/a11y', '@angular/cdk/drag-drop', '@angular/cdk/portal', '@angular/cdk/scrolling', '@angular/cdk/table', '@angular/cdk/tree', '@angular/material/autocomplete', '@angular/material/badge', '@angular/material/bottom-sheet', '@angular/material/button', '@angular/material/button-toggle', '@angular/material/card', '@angular/material/checkbox', '@angular/material/chips', '@angular/material/core', '@angular/material/dialog', '@angular/material/divider', '@angular/material/expansion', '@angular/material/form-field', '@angular/material/grid-list', '@angular/material/icon', '@angular/material/input', '@angular/material/list', '@angular/material/menu', '@angular/material/paginator', '@angular/material/progress-bar', '@angular/material/progress-spinner', '@angular/material/radio', '@angular/material/select', '@angular/material/sidenav', '@angular/material/slide-toggle', '@angular/material/slider', '@angular/material/snack-bar', '@angular/material/sort', '@angular/material/stepper', '@angular/material/table', '@angular/material/tabs', '@angular/material/toolbar', '@angular/material/tooltip', '@angular/material/tree', 'rfdc', '@angular/common/http', 'rxjs', 'rxjs/operators', 'libphonenumber-js', '@angular/animations', '@angular/cdk/keycodes', '@angular/cdk/coercion', '@angular/cdk/layout', '@angular/cdk/platform', '@angular/cdk/bidi', '@angular/cdk/overlay', 'moment', '@angular/material/datepicker', '@angular/platform-browser/animations', '@angular/platform-browser', '@brazilian-utils/brazilian-utils'], factory) :
+    (global = global || self, factory((global.gipisistemas = global.gipisistemas || {}, global.gipisistemas['ng-core'] = {}), global.ng.core, global.ng.cdk.stepper, global.ng.common, global.ng['flex-layout'], global.ng.forms, global.ng.material, global.ng.router, global.mde, global.angularMentions, global.ngxCurrency, global.ngxInfiniteScroll, global.ngxMask, global.ngxMaterialTimepicker, global.ng['cdk-experimental']['popover-edit'], global.ng.cdk.a11y, global.ng.cdk['drag-drop'], global.ng.cdk.portal, global.ng.cdk.scrolling, global.ng.cdk.table, global.ng.cdk.tree, global.ng.material.autocomplete, global.ng.material.badge, global.ng.material['bottom-sheet'], global.ng.material.button, global.ng.material['button-toggle'], global.ng.material.card, global.ng.material.checkbox, global.ng.material.chips, global.ng.material.core, global.ng.material.dialog, global.ng.material.divider, global.ng.material.expansion, global.ng.material['form-field'], global.ng.material['grid-list'], global.ng.material.icon, global.ng.material.input, global.ng.material.list, global.ng.material.menu, global.ng.material.paginator, global.ng.material['progress-bar'], global.ng.material['progress-spinner'], global.ng.material.radio, global.ng.material.select, global.ng.material.sidenav, global.ng.material['slide-toggle'], global.ng.material.slider, global.ng.material['snack-bar'], global.ng.material.sort, global.ng.material.stepper, global.ng.material.table, global.ng.material.tabs, global.ng.material.toolbar, global.ng.material.tooltip, global.ng.material.tree, global.rfdc_, global.ng.common.http, global.rxjs, global.rxjs.operators, global.libphonenumberJs, global.ng.animations, global.ng.cdk.keycodes, global.ng.cdk.coercion, global.ng.cdk.layout, global.ng.cdk.platform, global.ng.cdk.bidi, global.ng.cdk.overlay, global.moment_, global.ng.material.datepicker, global.ng.platformBrowser.animations, global.ng.platformBrowser, global.brazilianUtils));
+}(this, (function (exports, core, stepper, common, flexLayout, forms, material, router, mde, angularMentions, ngxCurrency, ngxInfiniteScroll, ngxMask, ngxMaterialTimepicker, popoverEdit, a11y, dragDrop, portal, scrolling, table, tree, autocomplete, badge, bottomSheet, button, buttonToggle, card, checkbox, chips, core$1, dialog, divider, expansion, formField, gridList, icon, input, list, menu, paginator, progressBar, progressSpinner, radio, select, sidenav, slideToggle, slider, snackBar, sort, stepper$1, table$1, tabs, toolbar, tooltip, tree$1, rfdc_, http, rxjs, operators, libphonenumberJs, animations, keycodes, coercion, layout, platform, bidi, overlay, moment_, datepicker, animations$1, platformBrowser, brazilianUtils) { 'use strict';
+
+    rfdc_ = rfdc_ && rfdc_.hasOwnProperty('default') ? rfdc_['default'] : rfdc_;
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -718,10 +720,37 @@
         StringUtil.truncateWithEllipses = function (text, max) {
             return text.trim().substring(0, max - 1) + (text.trim().length > max) ? '...' : '';
         };
+        /** Codifica a string em Base64 */
+        StringUtil.encodeBase64 = function (input) {
+            if (this.isEmpty(input)) {
+                return '';
+            }
+            var utf8Encoder = new TextEncoder();
+            var utf8Bytes = utf8Encoder.encode(input);
+            var binary = '';
+            utf8Bytes.forEach(function (byte) {
+                binary += String.fromCharCode(byte);
+            });
+            return btoa(binary);
+        };
+        /** Decodifica a string Base64 */
+        StringUtil.decodeBase64 = function (input) {
+            if (this.isEmpty(input)) {
+                return '';
+            }
+            var binary = atob(input);
+            var utf8Decoder = new TextDecoder();
+            var utf8Bytes = new Uint8Array(binary.length);
+            for (var i = 0; i < binary.length; i++) {
+                utf8Bytes[i] = binary.charCodeAt(i);
+            }
+            return utf8Decoder.decode(utf8Bytes);
+        };
         StringUtil.EMPTY = '';
         return StringUtil;
     }());
 
+    var cloneDeep = rfdc_();
     /** @dynamic */
     var ObjectUtil = /** @class */ (function () {
         function ObjectUtil() {
@@ -735,21 +764,15 @@
             }
             var id = null;
             if (typeof value === 'object') {
-                id = Reflect.get(value, 'id');
+                id = value['id'];
             }
             return !UUIDUtil.isValid(id);
         };
-        ObjectUtil.isNotNil = function (value) {
-            return typeof value !== 'undefined' && value !== null;
-        };
-        ObjectUtil.isNil = function (value) {
-            return typeof value === 'undefined' || value === null;
-        };
         ObjectUtil.clone = function (value) {
             if (ObjectUtil.isNull(value)) {
                 return new Object();
             }
-            return __assign({}, value);
+            return cloneDeep(value);
         };
         ObjectUtil.resolveFieldData = function (data, field) {
             if (data && field) {
@@ -1301,10 +1324,171 @@
         return InputFileComponent;
     }(AbstractComponent));
 
+    /** @dynamic */
+    var NumberUtil = /** @class */ (function () {
+        function NumberUtil() {
+        }
+        NumberUtil.isPositive = function (value) {
+            return !ObjectUtil.isNull(value) && value > 0;
+        };
+        NumberUtil.isNegative = function (value) {
+            return !ObjectUtil.isNull(value) && value < 0;
+        };
+        NumberUtil.format = function (value, digitsInfo, type) {
+            if (!ObjectUtil.isNull(value) && (!type || type === 'NUMBER')) {
+                return common.formatNumber(value, 'pt', digitsInfo);
+            }
+            else if (!ObjectUtil.isNull(value) && type === 'PERCENT') {
+                return common.formatPercent(value / 100, 'pt', digitsInfo);
+            }
+            return StringUtil.EMPTY;
+        };
+        NumberUtil.onlyNumbers = function (value) {
+            return String(value).replace(/[^\d]/g, '');
+        };
+        NumberUtil.isNumber = function (value) {
+            return value !== null && value !== undefined && !isNaN(value) && typeof value === 'number';
+        };
+        return NumberUtil;
+    }());
+
+    /** @dynamic */
+    var PhoneUtil = /** @class */ (function () {
+        function PhoneUtil() {
+        }
+        PhoneUtil.removeCharacters = function (value) {
+            if (StringUtil.isEmpty(value)) {
+                return '';
+            }
+            return value.replace(/\D/g, '');
+        };
+        PhoneUtil.maskLib = function (phoneNumber, state, country) {
+            if (country === void 0) { country = 'BR'; }
+            var exampleNumber;
+            if (!StringUtil.isEmpty(phoneNumber)) {
+                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
+                if (parsedNumber) {
+                    exampleNumber = parsedNumber;
+                }
+            }
+            else {
+                exampleNumber = libphonenumberJs.getExampleNumber(country, state);
+            }
+            if (exampleNumber) {
+                var formattedNumber = exampleNumber.formatNational();
+                return formattedNumber.replace(/\d/g, '0');
+            }
+            else {
+                throw new Error('Estado não suportado ou código de estado inválido.');
+            }
+        };
+        PhoneUtil.formatLib = function (phoneNumber, country) {
+            if (country === void 0) { country = 'BR'; }
+            try {
+                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
+                if (parsedNumber) {
+                    return parsedNumber.formatNational();
+                }
+                else {
+                    throw new Error('Número de telefone inválido.');
+                }
+            }
+            catch (error) {
+                throw new Error('Erro ao formatar o número de telefone: ' + error.message);
+            }
+        };
+        PhoneUtil.format = function (number, mask) {
+            var numberNotFormatted = NumberUtil.onlyNumbers(number);
+            var phoneFormatted = '';
+            if ((numberNotFormatted.length < 8) ||
+                (numberNotFormatted.length > 12) ||
+                (!this.isPossible(numberNotFormatted) && !this.isValid(numberNotFormatted))) {
+                return numberNotFormatted;
+            }
+            if (StringUtil.isEmpty(mask)) {
+                mask = this.mask(numberNotFormatted);
+            }
+            for (var i = 0, j = 0; i < mask.length && j < numberNotFormatted.length; i++) {
+                phoneFormatted += mask.charAt(i) === '0' ? numberNotFormatted.charAt(j++) : mask.charAt(i);
+            }
+            return phoneFormatted;
+        };
+        PhoneUtil.mask = function (phone) {
+            var specialPrefixes = ['0900', '0800', '0700', '0600', '0500', '0400', '0300', '0200', '0100'];
+            var phoneAux = this.removeCharacters(phone.replace(/\D/g, ''));
+            if ((phoneAux.length < 8) ||
+                (phoneAux.length > 12) ||
+                (!this.isPossible(phoneAux) && !this.isValid(phoneAux))) {
+                return '0*';
+            }
+            var existInArray = specialPrefixes.some(function (prefix) { return phoneAux.startsWith(prefix); });
+            if (existInArray) {
+                return '0000 000 0000'; // Para números especiais como 0800
+            }
+            switch (phoneAux.length) {
+                case 8: return '0000-0000';
+                case 9: return '0 0000-0000';
+                case 10: return '(00) 0000-0000';
+                case 11: return '(00) 0 0000-0000';
+                case 12: return '(000) 0 0000-0000';
+                default: return '0*';
+            }
+        };
+        PhoneUtil.isPossible = function (phoneNumber, country) {
+            if (country === void 0) { country = 'BR'; }
+            try {
+                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
+                return parsedNumber ? parsedNumber.isPossible() : false;
+            }
+            catch (error) {
+                return false;
+            }
+        };
+        PhoneUtil.isValid = function (phoneNumber, country) {
+            if (country === void 0) { country = 'BR'; }
+            try {
+                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
+                return parsedNumber ? parsedNumber.isValid() : false;
+            }
+            catch (error) {
+                return false;
+            }
+        };
+        PhoneUtil.getType = function (phoneNumber, country) {
+            if (country === void 0) { country = 'BR'; }
+            try {
+                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
+                return parsedNumber ? parsedNumber.getType() : null;
+            }
+            catch (error) {
+                return null;
+            }
+        };
+        PhoneUtil.isEqual = function (phoneNumber1, phoneNumber2, country) {
+            if (country === void 0) { country = 'BR'; }
+            try {
+                var parsedNumber1 = libphonenumberJs.parsePhoneNumberFromString(phoneNumber1, country);
+                var parsedNumber2 = libphonenumberJs.parsePhoneNumberFromString(phoneNumber2, country);
+                if (parsedNumber1 && parsedNumber2) {
+                    return parsedNumber1.isEqual(parsedNumber2);
+                }
+                else {
+                    return false;
+                }
+            }
+            catch (error) {
+                return false;
+            }
+        };
+        return PhoneUtil;
+    }());
+
     var InputComponent = /** @class */ (function () {
-        function InputComponent() {
-            this._inputSubject = new rxjs.BehaviorSubject('');
-            this._maskPhone = new rxjs.BehaviorSubject('');
+        function InputComponent(elementRef, _changeDetectorRef) {
+            this.elementRef = elementRef;
+            this._changeDetectorRef = _changeDetectorRef;
+            this._inputSubject$ = new rxjs.BehaviorSubject('');
+            this._maskPhone$ = new rxjs.BehaviorSubject('');
             this.tooltip = '';
             this.styleClassFormField = '';
             this.styleClassSuffix = '';
@@ -1327,16 +1511,21 @@
         InputComponent_1 = InputComponent;
         Object.defineProperty(InputComponent.prototype, "value", {
             get: function () {
-                return this.val;
+                return this._value;
             },
-            set: function (val) {
+            set: function (value) {
+                var valueAux = null;
                 if (this.lowerCase) {
-                    this.val = this.checkLowercase(this.checkSpaceDrop(val));
+                    valueAux = this.checkLowercase(this.checkSpaceDrop(value));
                 }
                 else {
-                    this.val = this.checkUppercase(this.checkSpaceDrop(val));
+                    valueAux = this.checkUppercase(this.checkSpaceDrop(value));
                 }
-                this.onChange(this.val);
+                this._value = valueAux;
+                if (this.value !== value) {
+                    this._changeDetectorRef.detectChanges();
+                }
+                this.onChange(this._value);
                 this.onTouch();
             },
             enumerable: false,
@@ -1345,12 +1534,13 @@
         InputComponent.prototype.ngOnInit = function () {
             var _this = this;
             if (this.phone) {
-                this._inputSubject.pipe(operators.debounceTime(300)).subscribe(function (value) {
-                    _this._maskPhone.next(PhoneUtil.mask(value));
+                this._inputSubject$.pipe(operators.debounceTime(300)).subscribe(function (value) {
+                    if (!StringUtil.isEmpty(value)) {
+                        _this._maskPhone$.next(PhoneUtil.mask(value));
+                    }
                 });
             }
         };
-        InputComponent.prototype.ngAfterViewInit = function () { };
         InputComponent.prototype.registerOnChange = function (fn) {
             this.onChange = fn;
         };
@@ -1358,8 +1548,16 @@
             this.onTouch = fn;
         };
         InputComponent.prototype.writeValue = function (value) {
+            if (this.phone && !StringUtil.isEmpty(value)) {
+                this._inputSubject$.next(value);
+                this._changeDetectorRef.detectChanges();
+            }
             this.value = value;
         };
+        InputComponent.prototype.setDisabledState = function (isDisabled) {
+            this.disabled = isDisabled;
+            this._changeDetectorRef.detectChanges();
+        };
         InputComponent.prototype.checkSpaceDrop = function (value) {
             if (this.spaceDrop && value) {
                 return value.replace(/\s/g, '');
@@ -1389,23 +1587,27 @@
                 this.onTouch();
             }
         };
-        InputComponent.prototype.onInputPhoneKeyup = function (event) {
+        InputComponent.prototype.onInputPhoneKeydown = function (event) {
             if (!this.phone) {
                 return;
             }
             var value = PhoneUtil.removeCharacters(event.target.value);
             var key = event.key;
-            if (/\d/.test(key) && value.length < 12) {
-                this._maskPhone.next('0*');
+            if (/\d/.test(key) && ((value.trim().length < 8) || (value.trim().length > 12))) {
+                this._maskPhone$.next('0*');
             }
         };
         InputComponent.prototype.onInputPhoneChange = function (value) {
             if (!this.phone) {
                 return;
             }
-            this._inputSubject.next(value);
+            this._inputSubject$.next(value);
         };
         var InputComponent_1;
+        InputComponent.ctorParameters = function () { return [
+            { type: core.ElementRef },
+            { type: core.ChangeDetectorRef }
+        ]; };
         __decorate([
             core.ViewChild('input', { static: false, read: core.ElementRef }),
             __metadata("design:type", core.ElementRef)
@@ -1475,9 +1677,10 @@
             __metadata("design:type", String)
         ], InputComponent.prototype, "appearance", void 0);
         __decorate([
-            core.Input('value'),
-            __metadata("design:type", Object)
-        ], InputComponent.prototype, "val", void 0);
+            core.Input(),
+            __metadata("design:type", Object),
+            __metadata("design:paramtypes", [Object])
+        ], InputComponent.prototype, "value", null);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
@@ -1521,7 +1724,7 @@
         InputComponent = InputComponent_1 = __decorate([
             core.Component({
                 selector: 'itss-input',
-                template: "<div fxLayout=\"column\">\n    <mat-label *ngIf=\"label\">\n        {{ label }}\n        <span *ngIf=\"required && label\"> * </span>\n        <gipi-helpful-tip *ngIf=\"tooltip && label\"\n                          [tooltip]=\"tooltip\">\n        </gipi-helpful-tip>\n    </mat-label>\n\n    <ng-container *ngIf=\"hidePasswordManager && (type === 'password')\">\n        <input style=\"opacity: 0;position: absolute;\">\n        <input type=\"password\"\n               style=\"opacity: 0;position: absolute;\">\n    </ng-container>\n\n    <mat-form-field [appearance]=\"appearance\"\n                    [class]=\"styleClassFormField\">\n        <input matInput\n               #input\n               *ngIf=\"mask\"\n               autocomplete=\"off\"\n               upperCase\n               lowerCase\n               spaceDrop\n               [enabledUpperCase]=\"upperCase\"\n               [enabledLowerCase]=\"lowerCase\"\n               [spaceDrop]=\"spaceDrop\"\n               [name]=\"name\"\n               [readonly]=\"readonly\"\n               [placeholder]=\"placeholder\"\n               [required]=\"required\"\n               [disabled]=\"disabled\"\n               [(ngModel)]=\"value\"\n               [type]=\"type\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [maxlength]=\"maxlength\"\n               [mask]=\"phone ? (_maskPhone | async) : mask\"\n               [dropSpecialCharacters]=\"dropSpecialCharacters\"\n               [patterns]=\"patterns\"\n               (focus)=\"onFocus($event)\"\n               (blur)=\"onBlur($event)\"\n               (keyup)=\"onInputPhoneKeyup($event)\"\n               (ngModelChange)=\"onInputPhoneChange($event)\">\n\n        <input matInput\n               #input\n               *ngIf=\"!mask\"\n               [name]=\"name\"\n               [readonly]=\"readonly\"\n               [placeholder]=\"placeholder\"\n               [required]=\"required\"\n               [disabled]=\"disabled\"\n               [(ngModel)]=\"value\"\n               autocomplete=\"off\"\n               upperCase\n               [enabledUpperCase]=\"upperCase\"\n               [type]=\"type\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [maxlength]=\"maxlength\"\n               [mask]=\"phone ? (_maskPhone | async) : ''\"\n               spaceDrop\n               [spaceDrop]=\"spaceDrop\"\n               (focus)=\"onFocus($event)\"\n               (blur)=\"onBlur($event)\"\n               (keyup)=\"onInputPhoneKeyup($event)\"\n               (ngModelChange)=\"onInputPhoneChange($event)\">\n\n        <mat-spinner matPrefix\n                     *ngIf=\"loading\"\n                     mode=\"indeterminate\"\n                     diameter=\"17\">\n        </mat-spinner>\n\n        <div *ngIf=\"suffixRef\"\n             matSuffix\n             [class]=\"styleClassSuffix\">\n            <ng-template [ngTemplateOutlet]=\"suffixRef\"> </ng-template>\n        </div>\n    </mat-form-field>\n</div>",
+                template: "<div fxLayout=\"column\">\n    <mat-label *ngIf=\"label\">\n        {{ label }}\n        <span *ngIf=\"required && label\"> * </span>\n        <gipi-helpful-tip *ngIf=\"tooltip && label\"\n                          [tooltip]=\"tooltip\">\n        </gipi-helpful-tip>\n    </mat-label>\n\n    <ng-container *ngIf=\"hidePasswordManager && (type === 'password')\">\n        <input style=\"opacity: 0;position: absolute;\">\n        <input type=\"password\"\n               style=\"opacity: 0;position: absolute;\">\n    </ng-container>\n\n    <mat-form-field [appearance]=\"appearance\"\n                    [class]=\"styleClassFormField\">\n        <input matInput\n               #input\n               *ngIf=\"mask || phone\"\n               autocomplete=\"off\"\n               upperCase\n               lowerCase\n               spaceDrop\n               [enabledUpperCase]=\"upperCase\"\n               [enabledLowerCase]=\"lowerCase\"\n               [spaceDrop]=\"spaceDrop\"\n               [name]=\"name\"\n               [readonly]=\"readonly\"\n               [placeholder]=\"placeholder\"\n               [required]=\"required\"\n               [disabled]=\"disabled\"\n               [(ngModel)]=\"value\"\n               [type]=\"type\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [maxlength]=\"maxlength\"\n               [mask]=\"phone ? (_maskPhone$ | async) : mask\"\n               [dropSpecialCharacters]=\"dropSpecialCharacters\"\n               [patterns]=\"patterns\"\n               (focus)=\"onFocus($event)\"\n               (blur)=\"onBlur($event)\"\n               (keydown)=\"onInputPhoneKeydown($event)\"\n               (ngModelChange)=\"onInputPhoneChange($event)\">\n\n        <input matInput\n               #input\n               *ngIf=\"!mask && !phone\"\n               [name]=\"name\"\n               [readonly]=\"readonly\"\n               [placeholder]=\"placeholder\"\n               [required]=\"required\"\n               [disabled]=\"disabled\"\n               [(ngModel)]=\"value\"\n               autocomplete=\"off\"\n               upperCase\n               [enabledUpperCase]=\"upperCase\"\n               [type]=\"type\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [maxlength]=\"maxlength\"\n               [mask]=\"''\"\n               spaceDrop\n               [spaceDrop]=\"spaceDrop\"\n               (focus)=\"onFocus($event)\"\n               (blur)=\"onBlur($event)\">\n\n        <mat-spinner matPrefix\n                     *ngIf=\"loading\"\n                     mode=\"indeterminate\"\n                     diameter=\"17\">\n        </mat-spinner>\n\n        <div *ngIf=\"suffixRef\"\n             matSuffix\n             [class]=\"styleClassSuffix\">\n            <ng-template [ngTemplateOutlet]=\"suffixRef\"> </ng-template>\n        </div>\n    </mat-form-field>\n</div>",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -1531,7 +1734,8 @@
                 ],
                 styles: ["mat-label span{color:#d14014!important}"]
             }),
-            __metadata("design:paramtypes", [])
+            __metadata("design:paramtypes", [core.ElementRef,
+                core.ChangeDetectorRef])
         ], InputComponent);
         return InputComponent;
     }());
@@ -2931,198 +3135,8 @@
         return RadioGroupEnumComponent;
     }());
 
-    var SelectButtonComponent = /** @class */ (function () {
-        function SelectButtonComponent(cd) {
-            this.cd = cd;
-            this.tabindex = 0;
-            this.onOptionClick = new core.EventEmitter();
-            this.onChange = new core.EventEmitter();
-            this.onModelChange = function () { };
-            this.onModelTouched = function () { };
-        }
-        SelectButtonComponent_1 = SelectButtonComponent;
-        SelectButtonComponent.prototype.ngOnInit = function () { };
-        SelectButtonComponent.prototype.getPropertyLabel = function (option) {
-            return this.property ? ObjectUtil.resolveFieldData(option, this.property) : (option.label !== undefined ? option.label : option);
-        };
-        SelectButtonComponent.prototype.getOptionValue = function (option) {
-            return this.optionValue ? ObjectUtil.resolveFieldData(option, this.optionValue) : (this.property || option.value === undefined ? option : option.value);
-        };
-        SelectButtonComponent.prototype.isOptionDisabled = function (option) {
-            return this.optionDisabled ? ObjectUtil.resolveFieldData(option, this.optionDisabled) : (option.disabled !== undefined ? option.disabled : false);
-        };
-        SelectButtonComponent.prototype.writeValue = function (value) {
-            this.value = value;
-            this.cd.markForCheck();
-        };
-        SelectButtonComponent.prototype.registerOnChange = function (fn) {
-            this.onModelChange = fn;
-        };
-        SelectButtonComponent.prototype.registerOnTouched = function (fn) {
-            this.onModelTouched = fn;
-        };
-        SelectButtonComponent.prototype.setDisabledState = function (val) {
-            this.disabled = val;
-            this.cd.markForCheck();
-        };
-        SelectButtonComponent.prototype.onItemClick = function (event, option, index) {
-            if (this.disabled || this.isOptionDisabled(option)) {
-                return;
-            }
-            if (this.multiple) {
-                if (this.isSelected(option)) {
-                    this.removeOption(option);
-                }
-                else {
-                    this.value = __spread((this.value || []), [this.getOptionValue(option)]);
-                }
-                this.onModelChange(this.value);
-                this.onChange.emit({
-                    originalEvent: event,
-                    value: this.value
-                });
-            }
-            else {
-                var value = this.getOptionValue(option);
-                if (this.value !== value) {
-                    this.value = this.getOptionValue(option);
-                    this.onModelChange(this.value);
-                    this.onChange.emit({
-                        originalEvent: event,
-                        value: this.value
-                    });
-                }
-            }
-            this.onOptionClick.emit({
-                originalEvent: event,
-                option: option,
-                index: index
-            });
-        };
-        SelectButtonComponent.prototype.onBlur = function () {
-            this.onModelTouched();
-        };
-        SelectButtonComponent.prototype.removeOption = function (option) {
-            var _this = this;
-            this.value = this.value.filter(function (val) { return !ObjectUtil.equals(val, _this.getOptionValue(option), _this.dataKey); });
-        };
-        SelectButtonComponent.prototype.isSelected = function (option) {
-            var e_1, _a;
-            var selected = false;
-            var optionValue = this.getOptionValue(option);
-            if (this.multiple) {
-                if (this.value) {
-                    try {
-                        for (var _b = __values(this.value), _c = _b.next(); !_c.done; _c = _b.next()) {
-                            var val = _c.value;
-                            if (ObjectUtil.equals(val, optionValue, this.dataKey)) {
-                                selected = true;
-                                break;
-                            }
-                        }
-                    }
-                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
-                    finally {
-                        try {
-                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-                        }
-                        finally { if (e_1) throw e_1.error; }
-                    }
-                }
-            }
-            else {
-                selected = ObjectUtil.equals(this.getOptionValue(option), this.value, this.dataKey);
-            }
-            return selected;
-        };
-        var SelectButtonComponent_1;
-        SelectButtonComponent.ctorParameters = function () { return [
-            { type: core.ChangeDetectorRef }
-        ]; };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Array)
-        ], SelectButtonComponent.prototype, "options", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], SelectButtonComponent.prototype, "property", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], SelectButtonComponent.prototype, "optionValue", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], SelectButtonComponent.prototype, "optionDisabled", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Number)
-        ], SelectButtonComponent.prototype, "tabindex", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Boolean)
-        ], SelectButtonComponent.prototype, "multiple", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], SelectButtonComponent.prototype, "label", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Boolean)
-        ], SelectButtonComponent.prototype, "required", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], SelectButtonComponent.prototype, "styleClass", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], SelectButtonComponent.prototype, "ariaLabelledBy", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Boolean)
-        ], SelectButtonComponent.prototype, "disabled", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], SelectButtonComponent.prototype, "dataKey", void 0);
-        __decorate([
-            core.Output(),
-            __metadata("design:type", core.EventEmitter)
-        ], SelectButtonComponent.prototype, "onOptionClick", void 0);
-        __decorate([
-            core.Output(),
-            __metadata("design:type", core.EventEmitter)
-        ], SelectButtonComponent.prototype, "onChange", void 0);
-        __decorate([
-            core.ContentChild(core.TemplateRef, { static: false }),
-            __metadata("design:type", Object)
-        ], SelectButtonComponent.prototype, "itemTemplate", void 0);
-        SelectButtonComponent = SelectButtonComponent_1 = __decorate([
-            core.Component({
-                selector: 'itss-select-button',
-                template: "<div fxLayout=\"column\">\n    <mat-label *ngIf=\"label\"\n               class=\"label\">\n        {{ label }}\n        <span *ngIf=\"required && label\">*</span>\n    </mat-label>\n\n    <div [ngClass]=\"'selectbutton component'\"\n         [class]=\"styleClass\"\n         role=\"group\">\n        <div *ngFor=\"let option of options; let i = index\"\n             #btn\n             class=\"button component\"\n             [class]=\"option.styleClass\"\n             role=\"button\"\n             [attr.aria-pressed]=\"isSelected(option)\"\n             [ngClass]=\"{'highlight': isSelected(option),\n                        'disabled': disabled || isOptionDisabled(option),\n                        'button-icon-only': (option.icon && !getPropertyLabel(option))}\"\n             (click)=\"onItemClick($event,option,i)\"\n             (keydown.enter)=\"onItemClick($event,option,i)\"\n             [attr.title]=\"option.title\"\n             [attr.aria-label]=\"option.label\"\n             (blur)=\"onBlur()\"\n             [attr.tabindex]=\"disabled ? null : tabindex\"\n             [attr.aria-labelledby]=\"this.getPropertyLabel(option)\"\n             [attr.id]=\"i\">\n\n            <ng-container *ngIf=\"!itemTemplate else customcontent\">\n                <span [ngClass]=\"'button-icon button-icon-left'\"\n                      [class]=\"option.icon\"\n                      *ngIf=\"option.icon\">\n                </span>\n                <span class=\"button-label\">\n                    {{ getPropertyLabel(option) }}\n                </span>\n            </ng-container>\n\n            <ng-template #customcontent>\n                <ng-container *ngTemplateOutlet=\"itemTemplate; context: {$implicit: option, index: i}\"></ng-container>\n            </ng-template>\n\n        </div>\n    </div>\n</div>",
-                providers: [
-                    {
-                        provide: forms.NG_VALUE_ACCESSOR,
-                        useExisting: core.forwardRef(function () { return SelectButtonComponent_1; }),
-                        multi: true
-                    }
-                ],
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                host: {
-                    'class': 'itss-element'
-                },
-                styles: [".label{color:#696969;font-size:1rem;margin-bottom:7px!important}.label>span{color:#f44336}.component{font-weight:400;display:flex;width:100%}.component:disabled,.disabled{cursor:not-allowed!important;background:#e0e0e0!important;border-color:#e0e0e0!important;color:#00000042!important}.selectbutton .button{background:#fff;border:1px solid #e1e5e4;color:#696969;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;padding:1rem;align-items:center;display:flex;justify-content:center;min-width:5rem;cursor:pointer}.selectbutton .button:first-of-type{border-top-left-radius:5px;border-bottom-left-radius:5px}.selectbutton .button:last-of-type{border-top-right-radius:5px;border-bottom-right-radius:5px}.selectbutton .button .button-icon-left,.selectbutton .button .button-icon-right{color:#696969}.selectbutton .button:not(.disabled):not(.highlight):hover{background:#f7f7f7;border-color:#e1e5e4;color:#696969}.selectbutton .button:not(.disabled):not(.highlight):hover .button-icon-left,.selectbutton .button:not(.disabled):not(.highlight):hover .button-icon-right{color:#696969}.selectbutton .button.highlight{background:#f3465c;border-color:#f3465c;color:#fff;cursor:default}.selectbutton .button.highlight .button-icon-left,.selectbutton .button.highlight .button-icon-right{color:#fff}.selectbutton .button.highlight:hover{background:#e6364e;border-color:#e6364e;color:#fff}.selectbutton .button.highlight:hover .button-icon-left,.selectbutton .button.highlight:hover .button-icon-right{color:#fff}itss-select-button.ng-dirty.ng-invalid>.selectbutton>.button{border-color:#f44336}.button.button-icon-only{width:3rem;padding:.75rem 0}.button.button-icon-only .button-icon-left,.button.button-icon-only .button-icon-right{margin:0}.button.button-icon-only.button-rounded{border-radius:50%;height:3rem}.button-label{font-weight:700}"]
-            }),
-            __metadata("design:paramtypes", [core.ChangeDetectorRef])
-        ], SelectButtonComponent);
-        return SelectButtonComponent;
-    }());
-
-    var SelectEntityPagedComponent = /** @class */ (function () {
-        function SelectEntityPagedComponent(_changeDetectorRef) {
+    var SelectEntityPagedComponent = /** @class */ (function () {
+        function SelectEntityPagedComponent(_changeDetectorRef) {
             var _this = this;
             this._changeDetectorRef = _changeDetectorRef;
             this.valueSearchCtrl = new forms.FormControl('');
@@ -4315,7 +4329,7 @@
         SelectSearchComponent = SelectSearchComponent_1 = __decorate([
             core.Component({
                 selector: 'itss-input-search',
-                template: "<!-- Espa\u00E7o reservado para ajustar o deslocamento vertical dos elementos mat-option -->\n<input matInput\n       class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: o mat-datepicker-content mat-tab-header \u00E9 necess\u00E1rio para herdar as cores do tema do material, consulte PR n\u00BA 22 -->\n<div #innerSelectSearch\n     class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\"\n     [ngClass]=\"{'mat-select-search-inner-multiple': matSelect.multiple, 'mat-select-search-inner-toggle-all': _isToggleAllCheckboxVisible() }\">\n\n    <mat-checkbox *ngIf=\"_isToggleAllCheckboxVisible()\"\n                  class=\"mat-select-search-toggle-all-checkbox\"\n                  color=\"primary\"\n                  [color]=\"matFormField?.color\"\n                  [disabled]=\"searching\"\n                  [matTooltip]=\"toggleAllCheckboxTooltipMessage\"\n                  matTooltipClass=\"ngx-mat-select-search-toggle-all-tooltip\"\n                  [matTooltipPosition]=\"toggleAllCheckboxTooltipPosition\"\n                  [(ngModel)]=\"toggleAllCheckboxChecked\"\n                  [(indeterminate)]=\"toggleAllCheckboxIndeterminate\">\n    </mat-checkbox>\n\n    <input class=\"mat-select-search-input mat-input-element\"\n           autocomplete=\"off\"\n           [type]=\"type\"\n           [formControl]=\"_formControl\"\n           #searchSelectInput\n           (keydown)=\"_handleKeydown($event)\"\n           (keyup)=\"_handleKeyup($event)\"\n           (blur)=\"onBlur()\"\n           [placeholder]=\"placeholderLabel\"\n           [attr.aria-label]=\"ariaLabel\">\n\n    <mat-spinner *ngIf=\"searching\"\n                 class=\"mat-select-search-spinner\"\n                 diameter=\"16\">\n    </mat-spinner>\n\n    <button *ngIf=\"!hideClearSearchButton && value && !searching\"\n            mat-icon-button\n            aria-label=\"Clear\"\n            (click)=\"_reset(true)\"\n            class=\"mat-select-search-clear\">\n        <ng-content *ngIf=\"clearIcon; else defaultIcon\"\n                    select=\"[itssSelectSearchClear]\">\n        </ng-content>\n\n        <ng-template #defaultIcon>\n            <mat-icon [svgIcon]=\"closeSvgIcon\">\n                {{ !closeSvgIcon ? closeIcon : null }}\n            </mat-icon>\n        </ng-template>\n    </button>\n\n    <ng-content select=\".mat-select-search-custom-header-content\"> </ng-content>\n\n    <mat-divider> </mat-divider>\n</div>\n\n<div *ngIf=\"(_showNoEntriesFound$ | async) && !searching\"\n     class=\"mat-select-search-no-entries-found\">\n    <ng-content *ngIf=\"noEntriesFound; else defaultNoEntriesFound\"\n                select=\"[itssSelectNoEntriesFound]\">\n    </ng-content>\n\n    <ng-template #defaultNoEntriesFound>\n        {{ noEntriesFoundLabel }}\n    </ng-template>\n</div>\n",
+                template: "<!-- Espa\u00E7o reservado para ajustar o deslocamento vertical dos elementos mat-option -->\n<input matInput\n       class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: o mat-datepicker-content mat-tab-header \u00E9 necess\u00E1rio para herdar as cores do tema do material, consulte PR n\u00BA 22 -->\n<div #innerSelectSearch\n     class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\"\n     [ngClass]=\"{'mat-select-search-inner-multiple': matSelect.multiple, 'mat-select-search-inner-toggle-all': _isToggleAllCheckboxVisible() }\">\n\n    <mat-checkbox *ngIf=\"_isToggleAllCheckboxVisible()\"\n                  class=\"mat-select-search-toggle-all-checkbox\"\n                  color=\"primary\"\n                  [color]=\"matFormField?.color\"\n                  [disabled]=\"searching\"\n                  [matTooltip]=\"toggleAllCheckboxTooltipMessage\"\n                  matTooltipClass=\"ngx-mat-select-search-toggle-all-tooltip\"\n                  [matTooltipPosition]=\"toggleAllCheckboxTooltipPosition\"\n                  [(ngModel)]=\"toggleAllCheckboxChecked\"\n                  [(indeterminate)]=\"toggleAllCheckboxIndeterminate\">\n    </mat-checkbox>\n\n    <input class=\"mat-select-search-input mat-input-element\"\n           autocomplete=\"off\"\n           [type]=\"type\"\n           [formControl]=\"_formControl\"\n           #searchSelectInput\n           (keydown)=\"_handleKeydown($event)\"\n           (keyup)=\"_handleKeyup($event)\"\n           (blur)=\"onBlur()\"\n           [placeholder]=\"placeholderLabel\"\n           [attr.aria-label]=\"ariaLabel\"\n           aria-hidden=\"false\">\n\n    <mat-spinner *ngIf=\"searching\"\n                 class=\"mat-select-search-spinner\"\n                 diameter=\"16\">\n    </mat-spinner>\n\n    <button *ngIf=\"!hideClearSearchButton && value && !searching\"\n            mat-icon-button\n            aria-label=\"Clear\"\n            (click)=\"_reset(true)\"\n            class=\"mat-select-search-clear\">\n        <ng-content *ngIf=\"clearIcon; else defaultIcon\"\n                    select=\"[itssSelectSearchClear]\">\n        </ng-content>\n\n        <ng-template #defaultIcon>\n            <mat-icon [svgIcon]=\"closeSvgIcon\">\n                {{ !closeSvgIcon ? closeIcon : null }}\n            </mat-icon>\n        </ng-template>\n    </button>\n\n    <ng-content select=\".mat-select-search-custom-header-content\"> </ng-content>\n\n    <mat-divider> </mat-divider>\n</div>\n\n<div *ngIf=\"(_showNoEntriesFound$ | async) && !searching\"\n     class=\"mat-select-search-no-entries-found\">\n    <ng-content *ngIf=\"noEntriesFound; else defaultNoEntriesFound\"\n                select=\"[itssSelectNoEntriesFound]\">\n    </ng-content>\n\n    <ng-template #defaultNoEntriesFound>\n        {{ noEntriesFoundLabel }}\n    </ng-template>\n</div>",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -4339,6 +4353,7 @@
         return SelectSearchComponent;
     }());
 
+    var cloneDeep$1 = rfdc_();
     /** @dynamic */
     var ArrayUtil = /** @class */ (function () {
         function ArrayUtil() {
@@ -4350,7 +4365,7 @@
             if (ObjectUtil.isNull(value)) {
                 return new Array();
             }
-            return __spread(value);
+            return cloneDeep$1(value);
         };
         /**
          * Função para realizar ordenação de Array de objetos
@@ -5032,208 +5047,6 @@
         return StepperComponent;
     }(stepper.CdkStepper));
 
-    var TabComponent = /** @class */ (function () {
-        function TabComponent() {
-            this.active = false;
-            this.closeable = false;
-            this.disabled = false;
-            this.selectionChange = new core.EventEmitter();
-        }
-        TabComponent.prototype.ngOnInit = function () {
-        };
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Number)
-        ], TabComponent.prototype, "index", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], TabComponent.prototype, "label", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], TabComponent.prototype, "active", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", core.TemplateRef)
-        ], TabComponent.prototype, "template", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], TabComponent.prototype, "closeable", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], TabComponent.prototype, "disabled", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", Object)
-        ], TabComponent.prototype, "data", void 0);
-        __decorate([
-            core.Input(),
-            __metadata("design:type", String)
-        ], TabComponent.prototype, "icon", void 0);
-        __decorate([
-            core.Output(),
-            __metadata("design:type", Object)
-        ], TabComponent.prototype, "selectionChange", void 0);
-        TabComponent = __decorate([
-            core.Component({
-                selector: 'itss-tab',
-                template: "<div *ngIf=\"active\">\n    <ng-content></ng-content>\n    <ng-container *ngIf=\"template\"\n                  [ngTemplateOutlet]=\"template\"\n                  [ngTemplateOutletContext]=\"{$implicit: data}\">\n    </ng-container>\n</div>\n",
-                styles: [""]
-            })
-        ], TabComponent);
-        return TabComponent;
-    }());
-
-    var DynamicTabDirective = /** @class */ (function () {
-        function DynamicTabDirective(viewContainer) {
-            this.viewContainer = viewContainer;
-        }
-        DynamicTabDirective.ctorParameters = function () { return [
-            { type: core.ViewContainerRef }
-        ]; };
-        DynamicTabDirective = __decorate([
-            core.Directive({
-                selector: '[dynamicTab]'
-            }),
-            __metadata("design:paramtypes", [core.ViewContainerRef])
-        ], DynamicTabDirective);
-        return DynamicTabDirective;
-    }());
-
-    var TabDTO = /** @class */ (function (_super) {
-        __extends(TabDTO, _super);
-        function TabDTO() {
-            var _this = _super !== null && _super.apply(this, arguments) || this;
-            _this.active = false;
-            _this.closeable = false;
-            _this.disabled = false;
-            return _this;
-        }
-        return TabDTO;
-    }(AbstractDTO));
-
-    var TabGroupComponent = /** @class */ (function () {
-        function TabGroupComponent(_componentFactoryResolver) {
-            this._componentFactoryResolver = _componentFactoryResolver;
-            this.dynamicTabs = [];
-        }
-        TabGroupComponent.prototype.ngOnInit = function () {
-        };
-        TabGroupComponent.prototype.ngAfterContentInit = function () {
-            var activeTabs = this.tabs.filter(function (tab) { return tab.active; });
-            if (activeTabs.length === 0 && this.tabs.length > 0) {
-                this.selectTab(this.tabs.first);
-            }
-        };
-        TabGroupComponent.prototype.openTab = function (label, template, data, closeable, disabled, action) {
-            if (closeable === void 0) { closeable = false; }
-            if (disabled === void 0) { disabled = false; }
-            var tab = new TabDTO();
-            tab.label = label;
-            tab.template = template;
-            tab.data = data;
-            tab.closeable = closeable;
-            tab.disabled = disabled;
-            tab.action = action;
-            this.openTabs(Array(tab));
-        };
-        TabGroupComponent.prototype.openTabs = function (tabs) {
-            var _a;
-            var _this = this;
-            var tabsComponent = tabs.map(function (tab) { return _this.getTabComponent(tab.label, tab.template, tab.data, tab.closeable, tab.disabled, tab.action); });
-            (_a = this.dynamicTabs).push.apply(_a, __spread(tabsComponent));
-            this.selectTab(this.dynamicTabs[0]);
-        };
-        TabGroupComponent.prototype.getTabComponent = function (label, template, data, closeable, disabled, action) {
-            if (closeable === void 0) { closeable = false; }
-            if (disabled === void 0) { disabled = false; }
-            var componentFactory = this._componentFactoryResolver.resolveComponentFactory(TabComponent);
-            var componentRef = this.dynamicTabPlaceholder.viewContainer.createComponent(componentFactory);
-            var instance = componentRef.instance;
-            instance.label = label;
-            instance.template = template;
-            instance.data = data;
-            instance.closeable = closeable;
-            instance.disabled = disabled;
-            instance.action = action;
-            return componentRef.instance;
-        };
-        TabGroupComponent.prototype.selectTab = function (tab) {
-            this.tabs.toArray().forEach(function (t) { return (t.active = false); });
-            this.dynamicTabs.forEach(function (t) { return (t.active = false); });
-            tab.active = true;
-            tab.selectionChange.emit();
-            if (tab.action) {
-                tab.action(tab.data);
-            }
-        };
-        TabGroupComponent.prototype.closeTab = function (tab) {
-            var index = this.dynamicTabs.indexOf(tab);
-            this.dynamicTabs.splice(index, 1);
-            var viewContainerRef = this.dynamicTabPlaceholder.viewContainer;
-            viewContainerRef.remove(index);
-            if (this.tabs.length > 0) {
-                this.selectTab(this.tabs.first);
-            }
-        };
-        TabGroupComponent.prototype.closeActiveTab = function () {
-            var activeTabs = this.dynamicTabs.filter(function (tab) { return tab.active; });
-            if (activeTabs.length > 0) {
-                this.closeTab(activeTabs[0]);
-            }
-        };
-        TabGroupComponent.prototype.closeAllTabs = function () {
-            var _this = this;
-            var tabs = Object.assign([], this.dynamicTabs);
-            if (tabs.length > 0) {
-                tabs.forEach(function (tab) { return _this.closeTab(tab); });
-            }
-        };
-        TabGroupComponent.prototype.nextTab = function () {
-            var currentTab = this.tabs.toArray().find(function (tab) { return tab.active; });
-            var nextTab = this.tabs.toArray()[this.tabs.toArray().indexOf(currentTab) + 1];
-            if (nextTab != null) {
-                this.tabs.toArray().forEach(function (t) { return (t.active = false); });
-                this.dynamicTabs.forEach(function (t) { return (t.active = false); });
-                nextTab.active = true;
-                nextTab.selectionChange.emit();
-            }
-        };
-        TabGroupComponent.prototype.previousTab = function () {
-            var currentTab = this.tabs.toArray().find(function (tab) { return tab.active; });
-            var previousTab = this.tabs.toArray()[this.tabs.toArray().indexOf(currentTab) - 1];
-            if (previousTab != null) {
-                this.tabs.toArray().forEach(function (t) { return (t.active = false); });
-                this.dynamicTabs.forEach(function (t) { return (t.active = false); });
-                previousTab.active = true;
-                previousTab.selectionChange.emit();
-            }
-        };
-        TabGroupComponent.ctorParameters = function () { return [
-            { type: core.ComponentFactoryResolver }
-        ]; };
-        __decorate([
-            core.ContentChildren(TabComponent),
-            __metadata("design:type", core.QueryList)
-        ], TabGroupComponent.prototype, "tabs", void 0);
-        __decorate([
-            core.ViewChild(DynamicTabDirective, { static: false }),
-            __metadata("design:type", DynamicTabDirective)
-        ], TabGroupComponent.prototype, "dynamicTabPlaceholder", void 0);
-        TabGroupComponent = __decorate([
-            core.Component({
-                selector: 'itss-tab-group',
-                template: "<nav mat-tab-nav-bar>\n    <a mat-tab-link\n       *ngFor=\"let tab of tabs\"\n       (click)=\"selectTab(tab)\"\n       [class.active]=\"tab.active\"\n       [disabled]=\"tab.disabled\">\n        <div mat-card-avatar\n             *ngIf=\"tab.icon\">\n            <mat-icon>{{ tab.icon }}</mat-icon>\n        </div>\n\n        {{ tab.label }}\n    </a>\n\n    <a mat-tab-link\n       *ngFor=\"let tab of dynamicTabs\"\n       (click)=\"selectTab(tab)\"\n       [class.active]=\"tab.active\"\n       [disabled]=\"tab.disabled\">\n        <div mat-card-avatar\n             *ngIf=\"tab.icon\">\n            <mat-icon>{{ tab.icon }}</mat-icon>\n        </div>\n\n        {{ tab.label }}\n    </a>\n</nav>\n\n<ng-content></ng-content>\n<ng-template dynamicTab\n             #container></ng-template>\n",
-                styles: [""]
-            }),
-            __metadata("design:paramtypes", [core.ComponentFactoryResolver])
-        ], TabGroupComponent);
-        return TabGroupComponent;
-    }());
-
     /**
      * Throttle a function
      */
@@ -7067,7 +6880,7 @@
         };
         GIPIColDirective.prototype._setHostClassMap = function () {
             var _a;
-            var hostClassMap = __assign((_a = {}, _a['grid-col'] = true, _a["grid-col-" + this.GIPISpan] = ObjectUtil.isNotNil(this.GIPISpan), _a["grid-col-order-" + this.GIPIOrder] = ObjectUtil.isNotNil(this.GIPIOrder), _a["grid-col-offset-" + this.GIPIOffset] = ObjectUtil.isNotNil(this.GIPIOffset), _a["grid-col-pull-" + this.GIPIPull] = ObjectUtil.isNotNil(this.GIPIPull), _a["grid-col-push-" + this.GIPIPush] = ObjectUtil.isNotNil(this.GIPIPush), _a), this._generateClass());
+            var hostClassMap = __assign((_a = {}, _a['grid-col'] = true, _a["grid-col-" + this.GIPISpan] = !ObjectUtil.isNull(this.GIPISpan), _a["grid-col-order-" + this.GIPIOrder] = !ObjectUtil.isNull(this.GIPIOrder), _a["grid-col-offset-" + this.GIPIOffset] = !ObjectUtil.isNull(this.GIPIOffset), _a["grid-col-pull-" + this.GIPIPull] = !ObjectUtil.isNull(this.GIPIPull), _a["grid-col-push-" + this.GIPIPush] = !ObjectUtil.isNull(this.GIPIPush), _a), this._generateClass());
             for (var i in this._classMap) {
                 if (this._classMap.hasOwnProperty(i)) {
                     this.renderer.removeClass(this.elementRef.nativeElement, i);
@@ -7100,7 +6913,7 @@
             var listClassMap = {};
             listOfSizeInputName.forEach(function (name) {
                 var sizeName = name.replace('GIPI', '').toLowerCase();
-                if (ObjectUtil.isNotNil(_this[name])) {
+                if (!ObjectUtil.isNull(_this[name])) {
                     if (typeof _this[name] === 'number' || typeof _this[name] === 'string') {
                         listClassMap["grid-col-" + sizeName + "-" + _this[name]] = true;
                     }
@@ -7109,7 +6922,7 @@
                         var prefixArray = ['span', 'pull', 'push', 'offset', 'order'];
                         prefixArray.forEach(function (prefix) {
                             var prefixClass = prefix === 'span' ? '-' : "-" + prefix + "-";
-                            listClassMap["grid-col-" + sizeName + prefixClass + embedded_1[prefix]] = embedded_1 && ObjectUtil.isNotNil(embedded_1[prefix]);
+                            listClassMap["grid-col-" + sizeName + prefixClass + embedded_1[prefix]] = embedded_1 && !ObjectUtil.isNull(embedded_1[prefix]);
                         });
                     }
                 }
@@ -7516,6 +7329,22 @@
         return GIPIPaginationControlsDirective;
     }());
 
+    var GIPIDynamicTabDirective = /** @class */ (function () {
+        function GIPIDynamicTabDirective(viewContainer) {
+            this.viewContainer = viewContainer;
+        }
+        GIPIDynamicTabDirective.ctorParameters = function () { return [
+            { type: core.ViewContainerRef }
+        ]; };
+        GIPIDynamicTabDirective = __decorate([
+            core.Directive({
+                selector: '[GIPIDynamicTab]'
+            }),
+            __metadata("design:paramtypes", [core.ViewContainerRef])
+        ], GIPIDynamicTabDirective);
+        return GIPIDynamicTabDirective;
+    }());
+
     var GIPITemplateDirective = /** @class */ (function () {
         function GIPITemplateDirective(template) {
             this.template = template;
@@ -7812,7 +7641,7 @@
             core.Component({
                 selector: "gipi-abstract-form",
                 exportAs: 'gipiAbstractForm',
-                template: "<div [style.flex-direction]=\"flexDirection\"\n     [style.align-items]=\"alignItems\"\n     [style.justify-content]=\"justifyContent\"\n     [style.gap]=\"getGap\"\n     [style.padding]=\"getPadding\"\n     class=\"form-content\"\n     [class.space-bottom]=\"!dialog\"\n     [class.form-dialog]=\"dialog\">\n    <ng-content> </ng-content>\n</div>\n<div class=\"form-footer\"\n     [style.margin-inline]=\"getPadding\"\n     *ngIf=\"GIPIActionRowComponent\">\n    <ng-content select=\"gipi-action-row\"> </ng-content>\n</div>",
+                template: "<div class=\"form-content\"\n     [class.form-dialog]=\"dialog\"\n     [class.space-bottom]=\"!dialog\"\n     [style.flex-direction]=\"flexDirection\"\n     [style.align-items]=\"alignItems\"\n     [style.justify-content]=\"justifyContent\"\n     [style.gap]=\"getGap\"\n     [style.padding]=\"getPadding\">\n    <ng-content> </ng-content>\n</div>\n<div class=\"form-footer\"\n     [style.margin-inline]=\"getPadding\"\n     *ngIf=\"GIPIActionRowComponent\">\n    <ng-content select=\"gipi-action-row\"> </ng-content>\n</div>",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -8750,7 +8579,7 @@
             var _this = this;
             if (this._overlayRef) {
                 /** Only subscribe to backdrop if trigger event is click */
-                if (this.triggerEvent === 'click' && this.backdropCloseOnClick === true) {
+                if (this.triggerEvent !== 'hover' && this.backdropCloseOnClick) {
                     this._overlayRef.backdropClick()
                         .pipe(operators.takeUntil(this.popoverClosed), operators.takeUntil(this._onDestroy))
                         .subscribe(function () {
@@ -8834,8 +8663,8 @@
         GIPIPopoverTrigger.prototype._getOverlayConfig = function () {
             var overlayState = new overlay.OverlayConfig();
             overlayState.positionStrategy = this._getPosition();
-            /** Display overlay backdrop if trigger event is click */
-            if (this.triggerEvent === 'click') {
+            /** Display overlay backdrop if trigger event is different of hover */
+            if (this.triggerEvent !== 'hover') {
                 overlayState.hasBackdrop = true;
                 overlayState.backdropClass = 'cdk-overlay-transparent-backdrop';
             }
@@ -9124,6 +8953,26 @@
             this.onBlur = new core.EventEmitter(true);
         }
         GIPIButtonComponent_1 = GIPIButtonComponent;
+        Object.defineProperty(GIPIButtonComponent.prototype, "internalButtonClass", {
+            get: function () {
+                return {
+                    'button-base': true,
+                    'button-primary': (this.isButtonPrimary || this.isButtonPrimaryIcon),
+                    'button-primary-icon': this.isButtonPrimaryIcon,
+                    'button-secondary': (this.isButtonSecondary || this.isButtonSecondaryIcon),
+                    'button-secondary-icon': this.isButtonSecondaryIcon,
+                    'button-tertiary': (this.isButtonTertiary || this.isButtonTertiaryIcon),
+                    'button-tertiary-icon': this.isButtonTertiaryIcon,
+                    'button-link': this.isButtonLink,
+                    'button-only-icon': this.isButtonIcon,
+                    'button-for-input': this.isForInput,
+                    'button-notification': this.notification,
+                    'button-action': this.isButtonAction
+                };
+            },
+            enumerable: false,
+            configurable: true
+        });
         GIPIButtonComponent.prototype.ngOnInit = function () { };
         GIPIButtonComponent.prototype.ngOnDestroy = function () {
             if (this.popoverTrigger) {
@@ -9323,7 +9172,7 @@
             core.Component({
                 selector: "gipi-button[gipi-primary], gipi-button[gipi-primary-icon], gipi-button[gipi-secondary], gipi-button[gipi-secondary-icon],\n               gipi-button[gipi-tertiary], gipi-button[gipi-link], gipi-button[gipi-icon], gipi-button[gipi-action]",
                 exportAs: 'gipiButton',
-                template: "<button [attr.id]=\"id\"\n        [attr.name]=\"name\"\n        [attr.type]=\"type\"\n        [attr.aria-label]=\"ariaLabel ? ariaLabel : label\"\n        [attr.title]=\"title ? title : label\"\n        [disabled]=\"disabled || loading\"\n        [matTooltip]=\"tooltip\"\n        role=\"button\"\n        [class]=\"buttonClass\"\n        [ngClass]=\"{'button-base': true,\n                    'button-primary': (isButtonPrimary || isButtonPrimaryIcon),\n                    'button-primary-icon': isButtonPrimaryIcon,\n                    'button-secondary': (isButtonSecondary || isButtonSecondaryIcon),\n                    'button-secondary-icon': isButtonSecondaryIcon,\n                    'button-tertiary': (isButtonTertiary || isButtonTertiaryIcon),\n                    'button-tertiary-icon': isButtonTertiaryIcon,\n                    'button-link': isButtonLink,\n                    'button-only-icon': isButtonIcon,\n                    'button-for-input': isForInput,\n                    'button-notification': notification,\n                    'button-action': isButtonAction}\"\n        [style.padding.px]=\"buttonPadding\"\n        #popoverTrigger=\"popoverTrigger\"\n        [popoverTriggerFor]=\"btnPopover\"\n        [popoverTriggerOn]=\"popover ? 'click' : 'none'\"\n        [popoverBackdropCloseOnClick]=\"true\"\n        (opened)=\"onOpenPopover.emit()\"\n        (closed)=\"onClosePopover.emit()\"\n        (click)=\"handleClick($event)\"\n        (focus)=\"handleFocus($event)\"\n        (blur)=\"handleBlur($event)\">\n\n    <span [ngClass]=\"{'button-content': true,\n                      'button-disabled': disabled,\n                      'button-icon-left': ((iconPos === 'left') && label),\n                      'button-icon-right': ((iconPos === 'right') && label),\n                      'button-icon-top': ((iconPos === 'top') && label),\n                      'button-icon-bottom': ((iconPos === 'bottom') && label),\n                      'button-icon-center': (iconPos === 'center')}\">\n\n        <mat-icon *ngIf=\"svgIcon || icon\"\n                  [svgIcon]=\"svgIcon\"\n                  [style.width.px]=\"iconWidth\"\n                  [style.height.px]=\"iconHeight\">\n            {{ (!svgIcon && icon) ? icon : '' }}\n        </mat-icon>\n\n        <span class=\"button-label\"\n              [attr.aria-hidden]=\"(icon || svgIcon) && !label\"\n              *ngIf=\"!isButtonIcon && label\">\n            {{ label }}\n        </span>\n    </span>\n\n</button>\n<gipi-overlay *ngIf=\"overlay && !popover\"\n              [(visible)]=\"_overlayVisible\"\n              [appendTo]=\"'body'\"\n              (onShow)=\"onShowOverlay.emit()\">\n    <ng-content> </ng-content>\n</gipi-overlay>\n\n<gipi-popover #btnPopover=\"gipiPopover\"\n              [popoverOverlapTrigger]=\"false\"\n              [popoverCloseOnClick]=\"false\"\n              [popoverArrowWidth]=\"0\"\n              [popoverOffsetY]=\"3\">\n    <div class=\"btn-popover-content\">\n        <ng-content> </ng-content>\n    </div>\n</gipi-popover>",
+                template: "<button [attr.id]=\"id\"\n        [attr.name]=\"name\"\n        [attr.type]=\"type\"\n        [attr.aria-label]=\"ariaLabel ? ariaLabel : label\"\n        [attr.title]=\"title ? title : label\"\n        [disabled]=\"disabled || loading\"\n        [matTooltip]=\"tooltip\"\n        role=\"button\"\n        [class]=\"buttonClass\"\n        [ngClass]=\"internalButtonClass\"\n        [style.padding.px]=\"buttonPadding\"\n        #popoverTrigger=\"popoverTrigger\"\n        [popoverTriggerFor]=\"btnPopover\"\n        [popoverTriggerOn]=\"popover ? 'click' : 'none'\"\n        [popoverBackdropCloseOnClick]=\"true\"\n        (opened)=\"onOpenPopover.emit()\"\n        (closed)=\"onClosePopover.emit()\"\n        (click)=\"handleClick($event)\"\n        (focus)=\"handleFocus($event)\"\n        (blur)=\"handleBlur($event)\">\n    <span [ngClass]=\"{'button-content': true,\n                      'button-disabled': disabled,\n                      'button-icon-left': ((iconPos === 'left') && label),\n                      'button-icon-right': ((iconPos === 'right') && label),\n                      'button-icon-top': ((iconPos === 'top') && label),\n                      'button-icon-bottom': ((iconPos === 'bottom') && label),\n                      'button-icon-center': (iconPos === 'center')}\">\n        <mat-icon *ngIf=\"svgIcon || icon\"\n                  [svgIcon]=\"svgIcon\"\n                  [style.width.px]=\"iconWidth\"\n                  [style.height.px]=\"iconHeight\"\n                  [style.font-size.px]=\"iconWidth || iconHeight\">\n            {{ (!svgIcon && icon) ? icon : '' }}\n        </mat-icon>\n\n        <span class=\"button-label\"\n              [attr.aria-hidden]=\"(icon || svgIcon) && !label\"\n              *ngIf=\"!isButtonIcon && label\">\n            {{ label }}\n        </span>\n    </span>\n</button>\n\n<gipi-overlay *ngIf=\"overlay && !popover\"\n              [(visible)]=\"_overlayVisible\"\n              [appendTo]=\"'body'\"\n              (onShow)=\"onShowOverlay.emit()\">\n    <ng-content> </ng-content>\n</gipi-overlay>\n\n<gipi-popover #btnPopover=\"gipiPopover\"\n              [popoverOverlapTrigger]=\"false\"\n              [popoverCloseOnClick]=\"false\"\n              [popoverArrowWidth]=\"0\"\n              [popoverOffsetY]=\"3\"\n              [fxHide]=\"!popover\">\n    <div class=\"btn-popover-content\">\n        <ng-content> </ng-content>\n    </div>\n</gipi-popover>",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -9341,21 +9190,152 @@
         return GIPIButtonComponent;
     }());
 
-    var RemoveChange = /** @class */ (function () {
-        function RemoveChange() {
-        }
-        return RemoveChange;
-    }());
     var nextUniqueId = 0;
-    var GIPIChipsComponent = /** @class */ (function () {
-        function GIPIChipsComponent(_changeDetectorRef, elementRef) {
-            this._changeDetectorRef = _changeDetectorRef;
+    var GIPICardComponent = /** @class */ (function () {
+        function GIPICardComponent(elementRef, _changeDetectorRef) {
             this.elementRef = elementRef;
-            this._name = "gipi-chips-" + nextUniqueId++;
-            this.id = this._name;
-            this.name = this._name;
-            this.label = 'Selecionados';
-            this.labelRemoveAll = 'Limpar';
+            this._changeDetectorRef = _changeDetectorRef;
+            this._uniqueId = "gipi-card-" + ++nextUniqueId;
+            this._id = '';
+            this._name = '';
+            this._loading = false;
+            this._shadow = true;
+            this._padding = true;
+        }
+        GIPICardComponent_1 = GIPICardComponent;
+        Object.defineProperty(GIPICardComponent.prototype, "id", {
+            get: function () {
+                return this._id;
+            },
+            set: function (value) {
+                this._id = value || this._uniqueId;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPICardComponent.prototype, "name", {
+            get: function () {
+                return this._name;
+            },
+            set: function (value) {
+                this._name = value || this._uniqueId;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPICardComponent.prototype, "loading", {
+            get: function () {
+                return this._loading;
+            },
+            set: function (value) {
+                if (value !== this.loading) {
+                    this._loading = value;
+                    this._changeDetectorRef.markForCheck();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPICardComponent.prototype, "shadow", {
+            get: function () {
+                return this._shadow;
+            },
+            set: function (value) {
+                if (value !== this.shadow) {
+                    this._shadow = value;
+                    this._changeDetectorRef.markForCheck();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPICardComponent.prototype, "padding", {
+            get: function () {
+                return this._padding;
+            },
+            set: function (value) {
+                if (value !== this.padding) {
+                    this._padding = value;
+                    this._changeDetectorRef.markForCheck();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        GIPICardComponent.prototype.ngOnInit = function () { };
+        var GIPICardComponent_1;
+        GIPICardComponent.ctorParameters = function () { return [
+            { type: core.ElementRef },
+            { type: core.ChangeDetectorRef }
+        ]; };
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String),
+            __metadata("design:paramtypes", [String])
+        ], GIPICardComponent.prototype, "id", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String),
+            __metadata("design:paramtypes", [String])
+        ], GIPICardComponent.prototype, "name", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPICardComponent.prototype, "loading", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPICardComponent.prototype, "shadow", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPICardComponent.prototype, "padding", null);
+        GIPICardComponent = GIPICardComponent_1 = __decorate([
+            core.Component({
+                selector: 'gipi-card',
+                exportAs: 'gipiCard',
+                template: "<ng-content></ng-content>",
+                providers: [
+                    {
+                        provide: forms.NG_VALUE_ACCESSOR,
+                        useExisting: core.forwardRef(function () { return GIPICardComponent_1; }),
+                        multi: true
+                    }
+                ],
+                host: {
+                    'class': 'gipi-card',
+                    '[attr.id]': 'id',
+                    '[attr.name]': 'name',
+                    '[class.shadow-none]': '!shadow',
+                    '[class.padding-none]': '!padding',
+                    '[class.loading]': 'loading',
+                },
+                styles: [":host{display:block;flex:1;border-radius:.2rem;box-shadow:0 3px 1px -2px rgba(0,0,0,.14),0 2px 2px 0 rgba(0,0,0,.098),0 1px 5px 0 rgba(0,0,0,.084);padding:1.6rem}.padding-none{padding:0!important}.shadow-none{box-shadow:none!important}"]
+            }),
+            __metadata("design:paramtypes", [core.ElementRef,
+                core.ChangeDetectorRef])
+        ], GIPICardComponent);
+        return GIPICardComponent;
+    }());
+
+    var RemoveChange = /** @class */ (function () {
+        function RemoveChange() {
+        }
+        return RemoveChange;
+    }());
+    var nextUniqueId$1 = 0;
+    var GIPIChipsComponent = /** @class */ (function () {
+        function GIPIChipsComponent(_changeDetectorRef, elementRef) {
+            this._changeDetectorRef = _changeDetectorRef;
+            this.elementRef = elementRef;
+            this._name = "gipi-chips-" + nextUniqueId$1++;
+            this.id = this._name;
+            this.name = this._name;
+            this.label = 'Selecionados';
+            this.labelRemoveAll = 'Limpar';
             this.disabled = false;
             this.showRemovableAll = false;
             this.showRemovable = false;
@@ -9544,12 +9524,12 @@
         return GIPIConfirmationDialogComponent;
     }());
 
-    var nextUniqueId$1 = 0;
+    var nextUniqueId$2 = 0;
     var GIPIDropdownMenuComponent = /** @class */ (function () {
         function GIPIDropdownMenuComponent(_changeDetectorRef, elementRef) {
             this._changeDetectorRef = _changeDetectorRef;
             this.elementRef = elementRef;
-            this._name = "gipi-dropdown-menu-" + nextUniqueId$1++;
+            this._name = "gipi-dropdown-menu-" + nextUniqueId$2++;
             this.id = this._name;
             this.name = this._name;
             this.label = '';
@@ -9730,6 +9710,35 @@
         return GIPIDropdownMenuComponent;
     }());
 
+    var GIPIEmptyStateComponent = /** @class */ (function () {
+        function GIPIEmptyStateComponent() {
+        }
+        GIPIEmptyStateComponent_1 = GIPIEmptyStateComponent;
+        GIPIEmptyStateComponent.prototype.ngOnInit = function () { };
+        var GIPIEmptyStateComponent_1;
+        GIPIEmptyStateComponent = GIPIEmptyStateComponent_1 = __decorate([
+            core.Component({
+                selector: 'gipi-empty-state',
+                exportAs: 'gipiEmptyState',
+                template: "<mat-icon>sentiment_very_dissatisfied</mat-icon>\nNenhum registro foi encontrado",
+                providers: [
+                    {
+                        provide: forms.NG_VALUE_ACCESSOR,
+                        useExisting: core.forwardRef(function () { return GIPIEmptyStateComponent_1; }),
+                        multi: true
+                    }
+                ],
+                host: {
+                    'class': 'gipi-empty-state',
+                },
+                changeDetection: core.ChangeDetectionStrategy.OnPush,
+                styles: [":host{display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:1.4rem;font-weight:600;color:#131313;padding:2.4rem 0}:host>mat-icon{font-size:3.2rem;height:3.2rem;width:3.2rem;margin-bottom:5px}"]
+            }),
+            __metadata("design:paramtypes", [])
+        ], GIPIEmptyStateComponent);
+        return GIPIEmptyStateComponent;
+    }());
+
     var GIPIExpansionPanelComponent = /** @class */ (function () {
         function GIPIExpansionPanelComponent(elementRef, _changeDetectorRef) {
             this.elementRef = elementRef;
@@ -10141,12 +10150,12 @@
         return GIPIFooterComponent;
     }());
 
-    var nextUniqueId$2 = 0;
+    var nextUniqueId$3 = 0;
     var GIPIFormFieldComponent = /** @class */ (function () {
         function GIPIFormFieldComponent(_changeDetectorRef, elementRef) {
             this._changeDetectorRef = _changeDetectorRef;
             this.elementRef = elementRef;
-            this._name = "gipi-form-field-" + nextUniqueId$2++;
+            this._name = "gipi-form-field-" + nextUniqueId$3++;
             this.id = this._name;
             this.name = this._name;
             this.label = '';
@@ -10412,12 +10421,12 @@
         return GIPIFormFieldComponent;
     }());
 
-    var nextUniqueId$3 = 0;
+    var nextUniqueId$4 = 0;
     var GIPIHelpfulTipComponent = /** @class */ (function () {
         function GIPIHelpfulTipComponent(_changeDetectorRef, elementRef) {
             this._changeDetectorRef = _changeDetectorRef;
             this.elementRef = elementRef;
-            this._name = "gipi-form-field-" + nextUniqueId$3++;
+            this._name = "gipi-form-field-" + nextUniqueId$4++;
             this.id = this._name;
             this.name = this._name;
             this._tooltip = '';
@@ -10476,11 +10485,11 @@
         return GIPIHelpfulTipComponent;
     }());
 
-    var nextUniqueId$4 = 0;
+    var nextUniqueId$5 = 0;
     var GIPIInputCheckboxComponent = /** @class */ (function () {
         function GIPIInputCheckboxComponent(_changeDetectorRef) {
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-input-checkbox-" + nextUniqueId$4++;
+            this._name = "gipi-input-checkbox-" + nextUniqueId$5++;
             this.id = this._name;
             this.name = this._name;
             this.disabled = false;
@@ -10590,12 +10599,12 @@
         return GIPIInputCheckboxComponent;
     }());
 
-    var nextUniqueId$5 = 0;
+    var nextUniqueId$6 = 0;
     var GIPIInputCurrencyComponent = /** @class */ (function () {
         function GIPIInputCurrencyComponent(_changeDetectorRef, elementRef) {
             this._changeDetectorRef = _changeDetectorRef;
             this.elementRef = elementRef;
-            this._name = "gipi-input-currency-" + nextUniqueId$5++;
+            this._name = "gipi-input-currency-" + nextUniqueId$6++;
             this.id = this._name;
             this.name = this._name;
             this.placeholder = '';
@@ -10793,12 +10802,12 @@
     }());
 
     var yearsPerPage = 24;
-    var nextUniqueId$6 = 0;
+    var nextUniqueId$7 = 0;
     var GIPIInputMonthPickerComponent = /** @class */ (function () {
         function GIPIInputMonthPickerComponent(_changeDetectorRef, _config) {
             this._changeDetectorRef = _changeDetectorRef;
             this._config = _config;
-            this._name = "gipi-input-monthpicker-" + nextUniqueId$6++;
+            this._name = "gipi-input-monthpicker-" + nextUniqueId$7++;
             this._yearArrays = [];
             this._now = new Date();
             this._currentMonth = this._now.getMonth();
@@ -11212,14 +11221,14 @@
         return GIPIInputMonthPickerComponent;
     }());
 
-    var nextUniqueId$7 = 0;
+    var nextUniqueId$8 = 0;
     /** A altura dos itens selecionados em unidades `px`. */
     var OPTION_HEIGHT_PX = 40;
     var GIPIInputSelectEnumComponent = /** @class */ (function () {
         function GIPIInputSelectEnumComponent(elementRef, _changeDetectorRef) {
             this.elementRef = elementRef;
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-input-select-enum-" + nextUniqueId$7++;
+            this._name = "gipi-input-select-enum-" + nextUniqueId$8++;
             this._enumList = [];
             this._itemSizeScrollViewport = 5;
             this._lastOptionSelected = null;
@@ -12241,12 +12250,12 @@
 
     /** A altura dos itens selecionados em unidades `px`. */
     var OPTION_HEIGHT_PX$1 = 44;
-    var nextUniqueId$8 = 0;
+    var nextUniqueId$9 = 0;
     var GIPIInputSelectComponent = /** @class */ (function () {
         function GIPIInputSelectComponent(_changeDetectorRef) {
             var _this = this;
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-input-select-" + nextUniqueId$8++;
+            this._name = "gipi-input-select-" + nextUniqueId$9++;
             this._onDestroy = new rxjs.Subject();
             this._itemSizeScrollViewport = 5;
             this._overlayVisible = false;
@@ -12933,14 +12942,14 @@
         return GIPIInputSelectComponent;
     }());
 
-    var nextUniqueId$9 = 0;
+    var nextUniqueId$a = 0;
     var GIPIInputSelectListboxComponent = /** @class */ (function () {
         function GIPIInputSelectListboxComponent(_changeDetectorRef, _elementRef, _renderer) {
             var _this = this;
             this._changeDetectorRef = _changeDetectorRef;
             this._elementRef = _elementRef;
             this._renderer = _renderer;
-            this._name = "gipi-input-select-listbox-" + nextUniqueId$9++;
+            this._name = "gipi-input-select-listbox-" + nextUniqueId$a++;
             this._isOverlayChildrenClicked = false;
             this._overlayVisible = false;
             this._selectEntityOpened = false;
@@ -13722,7 +13731,7 @@
             core.Component({
                 selector: "gipi-input-search",
                 exportAs: 'gipiInputSearch',
-                template: "<!-- Espa\u00E7o reservado para ajustar o deslocamento vertical dos elementos mat-option -->\n<input matInput\n       class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: o mat-datepicker-content mat-tab-header \u00E9 necess\u00E1rio para herdar as cores do tema do material, consulte PR n\u00BA 22 -->\n<div #innerSelectSearch\n     class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\">\n\n    <input class=\"mat-select-search-input mat-input-element\"\n           aria-label=\"Pesquisa suspensa\"\n           autocomplete=\"off\"\n           type=\"text\"\n           #searchSelectInput\n           [placeholder]=\"placeholderLabel\"\n           [formControl]=\"_formControl\"\n           (keydown)=\"_handleKeydown($event)\"\n           (keyup)=\"_handleKeyup($event)\"\n           (blur)=\"onBlur()\">\n\n    <mat-spinner *ngIf=\"searching\"\n                 class=\"mat-select-search-spinner\"\n                 diameter=\"16\">\n    </mat-spinner>\n\n    <button *ngIf=\"!hideClearSearchButton && value && !searching\"\n            class=\"mat-select-search-clear\"\n            aria-label=\"Limpar\"\n            mat-icon-button\n            (click)=\"_reset(true)\">\n        <mat-icon> close </mat-icon>\n    </button>\n\n    <mat-divider> </mat-divider>\n</div>\n\n<div *ngIf=\"(_showNoEntriesFound$ | async) && !searching\"\n     class=\"mat-select-search-no-entries-found\">\n    <mat-icon>sentiment_very_dissatisfied</mat-icon>\n    Nenhum registro foi encontrado\n</div>",
+                template: "<!-- Espa\u00E7o reservado para ajustar o deslocamento vertical dos elementos mat-option -->\n<input matInput\n       class=\"mat-select-search-input mat-select-search-hidden\" />\n\n<!-- Note: o mat-datepicker-content mat-tab-header \u00E9 necess\u00E1rio para herdar as cores do tema do material, consulte PR n\u00BA 22 -->\n<div #innerSelectSearch\n     class=\"mat-select-search-inner mat-typography mat-datepicker-content mat-tab-header\">\n\n    <input class=\"mat-select-search-input mat-input-element\"\n           aria-label=\"Pesquisa suspensa\"\n           aria-hidden=\"false\"\n           autocomplete=\"off\"\n           type=\"text\"\n           #searchSelectInput\n           [placeholder]=\"placeholderLabel\"\n           [formControl]=\"_formControl\"\n           (keydown)=\"_handleKeydown($event)\"\n           (keyup)=\"_handleKeyup($event)\"\n           (blur)=\"onBlur()\">\n\n    <mat-spinner *ngIf=\"searching\"\n                 class=\"mat-select-search-spinner\"\n                 diameter=\"16\">\n    </mat-spinner>\n\n    <button *ngIf=\"!hideClearSearchButton && value && !searching\"\n            class=\"mat-select-search-clear\"\n            aria-label=\"Limpar\"\n            mat-icon-button\n            (click)=\"_reset(true)\">\n        <mat-icon> close </mat-icon>\n    </button>\n\n    <mat-divider> </mat-divider>\n</div>\n\n<div *ngIf=\"(_showNoEntriesFound$ | async) && !searching\"\n     class=\"mat-select-search-no-entries-found\">\n    <mat-icon>sentiment_very_dissatisfied</mat-icon>\n    Nenhum registro foi encontrado\n</div>",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -13748,12 +13757,12 @@
         return GIPIInputSearchComponent;
     }());
 
-    var nextUniqueId$a = 0;
+    var nextUniqueId$b = 0;
     var GIPIInputSelectPagedComponent = /** @class */ (function () {
         function GIPIInputSelectPagedComponent(_changeDetectorRef) {
             var _this = this;
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-input-select-paged-" + nextUniqueId$a++;
+            this._name = "gipi-input-select-paged-" + nextUniqueId$b++;
             this.valueSearchCtrl = new forms.FormControl('');
             this.totalOptions = 0;
             this.subscriptions = [];
@@ -14124,12 +14133,12 @@
         return GIPIInputSelectPagedComponent;
     }());
 
-    var nextUniqueId$b = 0;
+    var nextUniqueId$c = 0;
     var GIPIInputSelectRadioComponent = /** @class */ (function () {
         function GIPIInputSelectRadioComponent(elementRef, _changeDetectorRef) {
             this.elementRef = elementRef;
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-input-select-radio-" + nextUniqueId$b++;
+            this._name = "gipi-input-select-radio-" + nextUniqueId$c++;
             this._enumList = [];
             this.id = this._name;
             this.name = this._name;
@@ -14409,6 +14418,7 @@
             this.iconHeight = 24;
             this.icon = null;
             this.svgIcon = null;
+            this.notification = false;
             this.onShowOverlay = new core.EventEmitter();
             this.onClick = new core.EventEmitter();
             this.onFocus = new core.EventEmitter();
@@ -14465,6 +14475,10 @@
             core.Input(),
             __metadata("design:type", String)
         ], GIPINotificationComponent.prototype, "tooltip", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPINotificationComponent.prototype, "notification", void 0);
         __decorate([
             core.Output(),
             __metadata("design:type", core.EventEmitter)
@@ -14485,7 +14499,7 @@
             core.Component({
                 selector: "gipi-notification",
                 exportAs: 'gipiNotification',
-                template: "<gipi-button gipi-icon\n             [id]=\"id\"\n             [name]=\"name\"\n             [ariaLabel]=\"ariaLabel\"\n             [buttonPadding]=\"buttonPadding\"\n             [iconWidth]=\"iconWidth\"\n             [iconHeight]=\"iconHeight\"\n             [icon]=\"icon\"\n             [svgIcon]=\"svgIcon\"\n             [disabled]=\"disabled\"\n             [loading]=\"loading\"\n             [tooltip]=\"tooltip\"\n             [popover]=\"true\"\n             [overlay]=\"false\"\n             (onShowOverlay)=\"onShowOverlay.emit()\"\n             (click)=\"onClick.emit($event)\"\n             (focus)=\"onFocus.emit($event)\"\n             (blur)=\"onBlur.emit($event)\">\n    <div role=\"menu\"\n         class=\"notification\">\n        <header>\n            <span role=\"text\">Notifica\u00E7\u00F5es</span>\n            <span role=\"button\">Apagar notifica\u00E7\u00F5es lidas</span>\n        </header>\n        <main>\n            Em breve\n        </main>\n        <footer>\n        </footer>\n    </div>\n</gipi-button>\n",
+                template: "<gipi-button gipi-icon\n             [id]=\"id\"\n             [name]=\"name\"\n             [ariaLabel]=\"ariaLabel\"\n             [buttonPadding]=\"buttonPadding\"\n             [iconWidth]=\"iconWidth\"\n             [iconHeight]=\"iconHeight\"\n             [icon]=\"icon\"\n             [svgIcon]=\"svgIcon\"\n             [disabled]=\"disabled\"\n             [loading]=\"loading\"\n             [tooltip]=\"tooltip\"\n             [popover]=\"true\"\n             [overlay]=\"false\"\n             [notification]=\"notification\"\n             (onShowOverlay)=\"onShowOverlay.emit()\"\n             (click)=\"onClick.emit($event)\"\n             (focus)=\"onFocus.emit($event)\"\n             (blur)=\"onBlur.emit($event)\">\n    <ng-content> </ng-content>\n</gipi-button>\n",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -14497,7 +14511,7 @@
                     'class': 'gipi-notification',
                 },
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [".button-only-icon{padding:4px!important}.button-only-icon .button-content>mat-icon{width:24px!important;height:24px!important}.notification{max-width:30rem}.notification>footer,.notification>header{display:none}.notification>main{width:20rem;text-align:center;font-size:1.6rem;font-weight:600;color:#262626}"]
+                styles: [".button-only-icon{padding:4px!important}.button-only-icon .button-content>mat-icon{width:24px!important;height:24px!important}"]
             }),
             __metadata("design:paramtypes", [])
         ], GIPINotificationComponent);
@@ -14651,11 +14665,11 @@
         return PasswordUtil;
     }());
 
-    var nextUniqueId$c = 0;
+    var nextUniqueId$d = 0;
     var GIPIPasswordRequerimentsComponent = /** @class */ (function () {
         function GIPIPasswordRequerimentsComponent(_changeDetectorRef) {
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-password-requeriments-" + nextUniqueId$c++;
+            this._name = "gipi-password-requeriments-" + nextUniqueId$d++;
             this.id = this._name;
             this.name = this._name;
             this.disabled = false;
@@ -15311,11 +15325,11 @@
         return GIPIPopoverTarget;
     }());
 
-    var nextUniqueId$d = 0;
+    var nextUniqueId$e = 0;
     var GIPIRadioGroupComponent = /** @class */ (function () {
         function GIPIRadioGroupComponent(_changeDetectorRef) {
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-radio-group-" + nextUniqueId$d++;
+            this._name = "gipi-radio-group-" + nextUniqueId$e++;
             this._enumList = [];
             this.id = this._name;
             this.name = this._name;
@@ -15461,114 +15475,748 @@
         return GIPIRadioGroupComponent;
     }());
 
-    var GIPISelectButtonComponent = /** @class */ (function () {
-        function GIPISelectButtonComponent(_elementRef, _changeDetectorRef) {
-            this._elementRef = _elementRef;
-            this._changeDetectorRef = _changeDetectorRef;
-            this.isButtonPrimary = this._hasHostAttributes('gipi-primary');
-            this.isButtonSecondary = this._hasHostAttributes('gipi-secondary');
-            this.required = false;
-            this.multiple = false;
-            this.disabled = false;
-            this.onOptionClick = new core.EventEmitter();
-            this.onChange = new core.EventEmitter();
-            this.onModelChange = function () { };
-            this.onModelTouched = function () { };
+    var nextUniqueId$f = 0;
+    var RangePage = /** @class */ (function () {
+        function RangePage(start, end) {
+            this.start = start;
+            this.end = end;
         }
-        GIPISelectButtonComponent_1 = GIPISelectButtonComponent;
-        GIPISelectButtonComponent.prototype.ngOnInit = function () { };
-        GIPISelectButtonComponent.prototype.writeValue = function (obj) {
-            this.value = obj;
-            this._changeDetectorRef.markForCheck();
-        };
-        GIPISelectButtonComponent.prototype.registerOnChange = function (fn) {
-            this.onModelChange = fn;
-        };
-        GIPISelectButtonComponent.prototype.registerOnTouched = function (fn) {
-            this.onModelTouched = fn;
-        };
-        GIPISelectButtonComponent.prototype.setDisabledState = function (isDisabled) {
-            this.disabled = isDisabled;
-            this._changeDetectorRef.markForCheck();
-        };
-        GIPISelectButtonComponent.prototype.getOptionLabel = function (option) {
-            return this.optionLabel ? ObjectUtil.resolveFieldData(option, this.optionLabel) : option.label != undefined ? option.label : option;
-        };
-        GIPISelectButtonComponent.prototype.getOptionValue = function (option) {
-            return this.optionValue ? ObjectUtil.resolveFieldData(option, this.optionValue) : this.optionLabel || option.value === undefined ? option : option.value;
-        };
-        GIPISelectButtonComponent.prototype.isOptionDisabled = function (option) {
-            return this.optionDisabled ? ObjectUtil.resolveFieldData(option, this.optionDisabled) : option.disabled !== undefined ? option.disabled : false;
-        };
-        GIPISelectButtonComponent.prototype.onItemClick = function (event, option, index) {
-            if (this.disabled || this.isOptionDisabled(option)) {
-                return;
-            }
-            if (this.multiple) {
-                if (this.isSelected(option)) {
-                    this.removeOption(option);
-                }
-                else {
-                    this.value = __spread((this.value || []), [this.getOptionValue(option)]);
-                }
-                this.onModelChange(this.value);
-                this.onChange.emit({
-                    originalEvent: event,
-                    value: this.value
-                });
-            }
-            else {
-                var value = this.getOptionValue(option);
-                if (this.value !== value) {
-                    this.value = this.getOptionValue(option);
-                    this.onModelChange(this.value);
-                    this.onChange.emit({
-                        originalEvent: event,
-                        value: this.value
-                    });
-                }
-            }
-            this.onOptionClick.emit({
-                originalEvent: event,
-                option: option,
-                index: index
-            });
-        };
-        GIPISelectButtonComponent.prototype.isSelected = function (option) {
-            var e_1, _a;
-            var selected = false;
-            var optionValue = this.getOptionValue(option);
-            if (this.multiple) {
-                if (this.value && Array.isArray(this.value)) {
-                    try {
-                        for (var _b = __values(this.value), _c = _b.next(); !_c.done; _c = _b.next()) {
-                            var val = _c.value;
-                            if (ObjectUtil.equals(val, optionValue, this.dataKey)) {
-                                selected = true;
-                                break;
-                            }
-                        }
-                    }
-                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
-                    finally {
-                        try {
-                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-                        }
-                        finally { if (e_1) throw e_1.error; }
-                    }
-                }
-            }
-            else {
-                selected = ObjectUtil.equals(this.getOptionValue(option), this.value, this.dataKey);
-            }
-            return selected;
+        RangePage.prototype.getTotalCount = function () {
+            return (this.end - this.start) + 1;
         };
-        GIPISelectButtonComponent.prototype.removeOption = function (option) {
+        RangePage.prototype.getRange = function () {
             var _this = this;
-            this.value = this.value.filter(function (val) { return !ObjectUtil.equals(val, _this.getOptionValue(option), _this.dataKey); });
+            return Array.from({ length: this.getTotalCount() }, function (_, i) { return _this.start - 1 + i; });
         };
-        GIPISelectButtonComponent.prototype.onBlur = function () {
-            this.onModelTouched();
+        return RangePage;
+    }());
+    var GIPIRangePageComponent = /** @class */ (function () {
+        function GIPIRangePageComponent(elementRef, _changeDetectorRef) {
+            this.elementRef = elementRef;
+            this._changeDetectorRef = _changeDetectorRef;
+            this._name = "gipi-range-page-" + nextUniqueId$f++;
+            this._startPage = 1;
+            this._endPage = 1;
+            this.id = this._name;
+            this.name = this._name;
+            this.label = '';
+            this.tooltip = '';
+            this.placeholderStart = '';
+            this.placeholderEnd = '';
+            this.help = '';
+            this._min = 1;
+            this._max = 100;
+            this._step = 1;
+            this._required = false;
+            this._disabled = false;
+            this.onChange = function (value) { };
+            this.onTouched = function () { };
+        }
+        GIPIRangePageComponent_1 = GIPIRangePageComponent;
+        Object.defineProperty(GIPIRangePageComponent.prototype, "min", {
+            get: function () {
+                return NumberUtil.isNumber(this._min) ? this._min : 1;
+            },
+            set: function (value) {
+                this._min = value;
+                this._initPage();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangePageComponent.prototype, "max", {
+            get: function () {
+                return NumberUtil.isNumber(this._max) ? this._max : 100;
+            },
+            set: function (value) {
+                this._max = value;
+                this._initPage();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangePageComponent.prototype, "step", {
+            get: function () {
+                return NumberUtil.isNumber(this._step) ? this._step : 1;
+            },
+            set: function (value) {
+                this._step = value;
+                this._initPage();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangePageComponent.prototype, "required", {
+            get: function () {
+                return this._required;
+            },
+            set: function (value) {
+                this._required = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangePageComponent.prototype, "disabled", {
+            get: function () {
+                return this._disabled;
+            },
+            set: function (value) {
+                this._disabled = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangePageComponent.prototype, "formattedValue", {
+            get: function () {
+                return '';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        GIPIRangePageComponent.prototype.ngOnInit = function () {
+            this._initPage();
+        };
+        GIPIRangePageComponent.prototype.ngOnDestroy = function () { };
+        GIPIRangePageComponent.prototype.writeValue = function (value) {
+            if (!ObjectUtil.isNull(value)) {
+                this._startPage = value.start || this._startPage;
+                this._endPage = value.end || this._endPage;
+            }
+            this._changeDetectorRef.detectChanges();
+        };
+        GIPIRangePageComponent.prototype.registerOnChange = function (fn) {
+            this.onChange = fn;
+        };
+        GIPIRangePageComponent.prototype.registerOnTouched = function (fn) {
+            this.onTouched = fn;
+        };
+        GIPIRangePageComponent.prototype.setDisabledState = function (isDisabled) {
+            this.disabled = isDisabled;
+            this._changeDetectorRef.markForCheck();
+        };
+        GIPIRangePageComponent.prototype._initPage = function () {
+            this._startPage = this.min;
+            this._endPage = Math.min(this._startPage + this.step - 1, this.max);
+        };
+        GIPIRangePageComponent.prototype.updateEndPage = function () {
+            if (this.disabled) {
+                return;
+            }
+            if (this._startPage < this.min) {
+                this._startPage = this.min;
+            }
+            else if (this._startPage > this.max) {
+                this._startPage = this.max;
+            }
+            if (this._endPage < this._startPage) {
+                this._endPage = this._startPage;
+            }
+            else if (this._endPage > (this._startPage + (this.step - 1))) {
+                this._endPage = Math.min(this._startPage + this.step - 1, this.max);
+            }
+            this._propagateChange();
+        };
+        GIPIRangePageComponent.prototype.updateStartPage = function () {
+            if (this.disabled) {
+                return;
+            }
+            if (this._endPage > this.max) {
+                this._endPage = this.max;
+            }
+            else if (this._endPage > this.max) {
+                this._endPage = this.max;
+            }
+            if (this._startPage > this._endPage) {
+                this._startPage = this._endPage;
+            }
+            else if (this._startPage < (this._endPage - (this.step + 1))) {
+                this._startPage = Math.max(this._endPage - this.step + 1, this.min);
+            }
+            this._propagateChange();
+        };
+        GIPIRangePageComponent.prototype.previous = function () {
+            if (this.disabled) {
+                return;
+            }
+            var newStartPage = Math.max(this._startPage - this.step + 1, this.min);
+            var newEndPage = Math.min(newStartPage + this.step - 1, this.max);
+            if (newEndPage >= this.min) {
+                this._startPage = newStartPage;
+                this._endPage = newEndPage;
+                this._propagateChange();
+            }
+        };
+        GIPIRangePageComponent.prototype.next = function () {
+            if (this.disabled) {
+                return;
+            }
+            // const newStartPage = Math.min(this._startPage + this.step, this.max - this.step + 1);
+            // let newEndPage = newStartPage + this.step - 1;
+            var newStartPage = Math.min(this._startPage + this.step, this.max);
+            var newEndPage = Math.min(newStartPage + this.step - 1, this.max);
+            if ((newStartPage === this.max) || (newEndPage > this.max)) {
+                newEndPage = newStartPage;
+            }
+            if (newEndPage <= this.max) {
+                this._startPage = newStartPage;
+                this._endPage = newEndPage;
+                this._propagateChange();
+            }
+        };
+        GIPIRangePageComponent.prototype.selectText = function (input) {
+            if (this.disabled || !input) {
+                return;
+            }
+            setTimeout(function () { return input.select(); }, 0);
+        };
+        GIPIRangePageComponent.prototype._propagateChange = function () {
+            this.onChange(new RangePage(this._startPage, this._endPage));
+            this.onTouched();
+        };
+        var GIPIRangePageComponent_1;
+        GIPIRangePageComponent.ctorParameters = function () { return [
+            { type: core.ElementRef },
+            { type: core.ChangeDetectorRef }
+        ]; };
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangePageComponent.prototype, "id", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangePageComponent.prototype, "name", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangePageComponent.prototype, "label", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangePageComponent.prototype, "tooltip", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangePageComponent.prototype, "placeholderStart", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangePageComponent.prototype, "placeholderEnd", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangePageComponent.prototype, "help", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number),
+            __metadata("design:paramtypes", [Number])
+        ], GIPIRangePageComponent.prototype, "min", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number),
+            __metadata("design:paramtypes", [Number])
+        ], GIPIRangePageComponent.prototype, "max", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number),
+            __metadata("design:paramtypes", [Number])
+        ], GIPIRangePageComponent.prototype, "step", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPIRangePageComponent.prototype, "required", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPIRangePageComponent.prototype, "disabled", null);
+        GIPIRangePageComponent = GIPIRangePageComponent_1 = __decorate([
+            core.Component({
+                selector: 'gipi-range-page',
+                template: "<label *ngIf=\"label\"\n       class=\"input-label\"\n       [attr.for]=\"id\">\n    {{ label }}\n    <span *ngIf=\"required\"> * </span>\n    <gipi-helpful-tip *ngIf=\"tooltip && label\"\n                      [tooltip]=\"tooltip\">\n    </gipi-helpful-tip>\n</label>\n\n<div class=\"input-content\">\n    <div class=\"prefix\"\n         [class.disabled]=\"disabled\"\n         (click)=\"previous()\">\n        <mat-icon>chevron_left</mat-icon>\n    </div>\n    <input #startInput\n           matInput\n           class=\"input-element\"\n           type=\"number\"\n           [attr.id]=\"id\"\n           [attr.name]=\"name\"\n           [min]=\"min\"\n           [max]=\"max\"\n           [maxlength]=\"10\"\n           [placeholder]=\"placeholderStart\"\n           [disabled]=\"disabled\"\n           [required]=\"required\"\n           [readOnly]=\"false\"\n           [autocomplete]=\"'off'\"\n           [autofocus]=\"false\"\n           [(ngModel)]=\"_startPage\"\n           (keyup)=\"updateEndPage()\"\n           (focus)=\"selectText(startInput)\"\n           (click)=\"selectText(startInput)\" />\n    <div class=\"infix\">\n        a\n    </div>\n    <input #endInput\n           matInput\n           class=\"input-element\"\n           type=\"number\"\n           [attr.id]=\"id\"\n           [attr.name]=\"name\"\n           [min]=\"_startPage\"\n           [max]=\"max\"\n           [maxlength]=\"10\"\n           [placeholder]=\"placeholderEnd\"\n           [disabled]=\"disabled\"\n           [required]=\"required\"\n           [readOnly]=\"false\"\n           [autocomplete]=\"'off'\"\n           [autofocus]=\"false\"\n           [(ngModel)]=\"_endPage\"\n           (keyup)=\"updateStartPage()\"\n           (focus)=\"selectText(endInput)\"\n           (click)=\"selectText(endInput)\" />\n    <div class=\"suffix\"\n         [class.disabled]=\"disabled\"\n         (click)=\"next()\">\n        <mat-icon>chevron_right</mat-icon>\n    </div>\n</div>\n\n<small *ngIf=\"help\"\n       class=\"input-help\">\n    {{ help }}\n</small>",
+                providers: [
+                    {
+                        provide: forms.NG_VALUE_ACCESSOR,
+                        useExisting: core.forwardRef(function () { return GIPIRangePageComponent_1; }),
+                        multi: true
+                    },
+                ],
+                styles: [":host{display:flex;flex-direction:column;gap:.8rem;font-size:1.4rem;color:#696969}:host .input-label{display:flex;align-items:center;gap:.4rem;color:#131313;line-height:1.6rem}:host .input-label>span{font-size:1.6rem;line-height:1.6rem;color:#d14014}:host .input-content{display:flex;font-family:inherit;font-size:inherit;color:inherit;height:4rem;background:#fff;border:1px solid rgba(0,0,0,.12);transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.6rem}:host .input-content .input-element{padding:.75rem .8rem;border:none;outline:0;background-color:transparent;flex:1;color:inherit;caret-color:#696969;min-width:0;text-align:center;margin:0!important}:host .input-content .input-element::-webkit-inner-spin-button,:host .input-content .input-element::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;opacity:0}:host .input-content:has(.input-element:disabled){color:#bbbdc1!important;border-color:#e0e1e2!important;background-color:#f5f5f6!important;cursor:not-allowed}:host .input-content:has(.input-element:disabled) .suffix>mat-icon{color:#bbbdc1!important}:host .input-content .input-element:disabled{cursor:not-allowed}:host .input-content .infix,:host .input-content .prefix,:host .input-content .suffix{display:flex;align-items:center;justify-content:center;padding-block:.75rem;padding-inline:.8rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:.2s;background-color:#e0313e}:host .input-content .infix>mat-icon,:host .input-content .prefix>mat-icon,:host .input-content .suffix>mat-icon{width:2rem;height:2rem;font-size:2rem;color:#fff}:host .input-content .infix:not(.infix):not(.disabled):hover,:host .input-content .prefix:not(.infix):not(.disabled):hover,:host .input-content .suffix:not(.infix):not(.disabled):hover{background-color:#cc2d38}:host .input-content .infix:not(.infix):not(.disabled):active,:host .input-content .prefix:not(.infix):not(.disabled):active,:host .input-content .suffix:not(.infix):not(.disabled):active{background-color:#9f232c}:host .input-content .prefix.disabled,:host .input-content .suffix.disabled{background-color:#d1d2d4}:host .input-content .prefix.disabled>mat-icon,:host .input-content .suffix.disabled>mat-icon{color:#9a9da2}:host .input-content .prefix{border-right:1px solid rgba(0,0,0,.12);border-radius:.6rem 0 0 .6rem;cursor:pointer}:host .input-content .infix{width:1rem;padding:0;background-color:transparent}:host .input-content .suffix{border-left:1px solid rgba(0,0,0,.12);border-radius:0 .6rem .6rem 0;cursor:pointer}:host .input-help{flex:1;font-size:1rem;font-weight:500;margin-top:-.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::-webkit-input-placeholder{color:#bbbdc1}:-moz-placeholder{color:#bbbdc1}::-moz-placeholder{color:#bbbdc1}:-ms-input-placeholder{color:#bbbdc1}"]
+            }),
+            __metadata("design:paramtypes", [core.ElementRef,
+                core.ChangeDetectorRef])
+        ], GIPIRangePageComponent);
+        return GIPIRangePageComponent;
+    }());
+
+    var nextUniqueId$g = 0;
+    var GIPIRangeSliderComponent = /** @class */ (function () {
+        function GIPIRangeSliderComponent(elementRef, _changeDetectorRef) {
+            this.elementRef = elementRef;
+            this._changeDetectorRef = _changeDetectorRef;
+            this._name = "gipi-range-slider-" + nextUniqueId$g++;
+            this.id = this._name;
+            this.name = this._name;
+            this.label = '';
+            this.help = '';
+            this.min = 1;
+            this.max = 100;
+            this._maxRange = 5;
+            this._fromValue = 1;
+            this._toValue = 1;
+            this._step = 1;
+            this._disabled = false;
+            this._required = false;
+            this.onChange = function () { };
+            this.onTouched = function () { };
+        }
+        GIPIRangeSliderComponent_1 = GIPIRangeSliderComponent;
+        Object.defineProperty(GIPIRangeSliderComponent.prototype, "maxRange", {
+            get: function () {
+                return this._maxRange || 5;
+            },
+            set: function (value) {
+                if (!value || (value <= 0)) {
+                    throw new Error('Minimum value for "maxRange" must be 1');
+                }
+                this._maxRange = value || 5;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangeSliderComponent.prototype, "fromValue", {
+            get: function () {
+                return this._fromValue || 1;
+            },
+            set: function (value) {
+                if (!value || (value <= 0)) {
+                    throw new Error('Minimum value for "from" must be 1');
+                }
+                this._fromValue = value || 1;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangeSliderComponent.prototype, "toValue", {
+            get: function () {
+                return this._toValue || 1;
+            },
+            set: function (value) {
+                if (!value || (value <= 0)) {
+                    throw new Error('Minimum value for "to" must be 1');
+                }
+                this._toValue = value || 1;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangeSliderComponent.prototype, "step", {
+            get: function () {
+                return this._step || 1;
+            },
+            set: function (value) {
+                if (!value || (value <= 0)) {
+                    throw new Error('Minimum value for "step" must be 1');
+                }
+                this._step = value || 1;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangeSliderComponent.prototype, "disabled", {
+            get: function () {
+                return this._disabled;
+            },
+            set: function (value) {
+                this._disabled = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPIRangeSliderComponent.prototype, "required", {
+            get: function () {
+                return this._required;
+            },
+            set: function (value) {
+                this._required = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        GIPIRangeSliderComponent.prototype.ngOnInit = function () { };
+        GIPIRangeSliderComponent.prototype.ngAfterViewInit = function () {
+            this._fillSlider();
+            this._setToggleAccessible();
+        };
+        GIPIRangeSliderComponent.prototype.ngOnDestroy = function () { };
+        GIPIRangeSliderComponent.prototype.writeValue = function (value) {
+            if (value) {
+                this.fromValue = value.from;
+                this.toValue = value.to;
+                if (this.fromSlider && this.toSlider) {
+                    this.fromSlider.nativeElement.value = this.fromValue.toString();
+                    this.toSlider.nativeElement.value = this.toValue.toString();
+                    this._fillSlider();
+                    this._setToggleAccessible();
+                }
+            }
+        };
+        GIPIRangeSliderComponent.prototype.registerOnChange = function (fn) {
+            this.onChange = fn;
+        };
+        GIPIRangeSliderComponent.prototype.registerOnTouched = function (fn) {
+            this.onTouched = fn;
+        };
+        GIPIRangeSliderComponent.prototype.setDisabledState = function (isDisabled) {
+            this.disabled = isDisabled;
+            this._changeDetectorRef.markForCheck();
+        };
+        GIPIRangeSliderComponent.prototype.controlFromInput = function (isByNgModel) {
+            var _a = __read(isByNgModel ? [this.fromValue, this.toValue] : this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
+            from = this._roundToStep(from);
+            to = this._roundToStep(to);
+            // if ((to - from) > this.maxRange) {
+            //     from = to - this.maxRange;
+            // }
+            this._fillSlider();
+            this._setToggleAccessible();
+            if (from > to) {
+                this.fromValue = to;
+            }
+            this.fromSlider.nativeElement.value = this.fromValue.toString();
+            this._notifyValueChange();
+        };
+        GIPIRangeSliderComponent.prototype.controlToInput = function (isByNgModel) {
+            var _a = __read(isByNgModel ? [this.fromValue, this.toValue] : this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
+            from = this._roundToStep(from);
+            to = this._roundToStep(to);
+            // if ((to - from) > this.maxRange) {
+            //     to = from + this.maxRange;
+            // }
+            this._fillSlider();
+            this._setToggleAccessible();
+            if (from <= to) {
+                this.toValue = to;
+            }
+            else {
+                this.toValue = from;
+            }
+            this.toSlider.nativeElement.value = this.toValue.toString();
+            this._notifyValueChange();
+        };
+        GIPIRangeSliderComponent.prototype.controlFromSlider = function () {
+            var _a = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
+            from = this._roundToStep(from);
+            to = this._roundToStep(to);
+            if ((to - from) > this.maxRange) {
+                from = to - this.maxRange;
+            }
+            this._fillSlider();
+            this._setToggleAccessible();
+            if ((to - from) === this.maxRange) {
+                var _b = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from_1 = _b[0], to_1 = _b[1];
+                from_1 = this._roundToStep(from_1);
+                to_1 = this._roundToStep(to_1);
+                if ((to_1 - from_1) > this.maxRange) {
+                    to_1 = from_1 + this.maxRange;
+                }
+                this._fillSlider();
+                if (from_1 <= to_1) {
+                    this.toValue = to_1;
+                }
+                else {
+                    this.toValue = from_1;
+                }
+                this.toSlider.nativeElement.value = this.toValue.toString();
+            }
+            if (from >= to) {
+                this.fromValue = to;
+            }
+            else {
+                this.fromValue = from;
+            }
+            this.fromSlider.nativeElement.value = this.fromValue.toString();
+            this._notifyValueChange();
+        };
+        GIPIRangeSliderComponent.prototype.controlToSlider = function () {
+            var _a = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
+            from = this._roundToStep(from);
+            to = this._roundToStep(to);
+            if ((to - from) > this.maxRange) {
+                to = from + this.maxRange;
+            }
+            this._fillSlider();
+            this._setToggleAccessible();
+            if ((to - from) === this.maxRange) {
+                var _b = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from_2 = _b[0], to_2 = _b[1];
+                from_2 = this._roundToStep(from_2);
+                to_2 = this._roundToStep(to_2);
+                if ((to_2 - from_2) > this.maxRange) {
+                    from_2 = to_2 - this.maxRange;
+                }
+                this._fillSlider();
+                if (from_2 >= to_2) {
+                    this.fromValue = to_2;
+                }
+                else {
+                    this.fromValue = from_2;
+                }
+                this.fromSlider.nativeElement.value = this.fromValue.toString();
+            }
+            if (from <= to) {
+                this.toValue = to;
+            }
+            else {
+                this.toValue = from;
+            }
+            this.toSlider.nativeElement.value = this.toValue.toString();
+            this._notifyValueChange();
+        };
+        GIPIRangeSliderComponent.prototype._getParsed = function (currentFrom, currentTo) {
+            var from = parseInt(currentFrom.value, 10);
+            var to = parseInt(currentTo.value, 10);
+            return [from, to];
+        };
+        GIPIRangeSliderComponent.prototype._fillSlider = function () {
+            var fromSliderEl = this.fromSlider.nativeElement;
+            var toSliderEl = this.toSlider.nativeElement;
+            var rangeDistance = Number(toSliderEl.max) - Number(toSliderEl.min);
+            var fromPosition = (this.fromValue - Number(fromSliderEl.min));
+            var toPosition = (this.toValue - Number(toSliderEl.min));
+            var sliderColor = '#e0e1e2';
+            var rangeColor = '#f1a0a6';
+            toSliderEl.style.background = "linear-gradient(\n            to right,\n            " + sliderColor + " 0%,\n            " + sliderColor + " " + (fromPosition) / (rangeDistance) * 100 + "%,\n            " + rangeColor + " " + ((fromPosition) / (rangeDistance)) * 100 + "%,\n            " + rangeColor + " " + (toPosition) / (rangeDistance) * 100 + "%,\n            " + sliderColor + " " + (toPosition) / (rangeDistance) * 100 + "%,\n            " + sliderColor + " 100%)";
+        };
+        GIPIRangeSliderComponent.prototype._setToggleAccessible = function () {
+            var fromInput = this.fromSlider.nativeElement;
+            var toInput = this.toSlider.nativeElement;
+            var fromValue = parseInt(fromInput.value, 10);
+            var toValue = parseInt(toInput.value, 10);
+            if (fromValue <= parseInt(fromInput.min, 10) && toValue <= parseInt(toInput.min, 10)) {
+                // Ambos estão no mínimo
+                fromInput.style.zIndex = '1';
+                toInput.style.zIndex = '2';
+            }
+            else if (fromValue >= parseInt(fromInput.max, 10) && toValue >= parseInt(toInput.max, 10)) {
+                // Ambos estão no máximo
+                fromInput.style.zIndex = '2';
+                toInput.style.zIndex = '1';
+            }
+            else {
+                // Caso geral
+                fromInput.style.zIndex = '2';
+                toInput.style.zIndex = '1';
+            }
+        };
+        GIPIRangeSliderComponent.prototype._roundToStep = function (value) {
+            return Math.round(value / this.step) * this.step;
+        };
+        GIPIRangeSliderComponent.prototype._notifyValueChange = function () {
+            this.onChange({ from: this.fromValue, to: this.toValue });
+        };
+        GIPIRangeSliderComponent.prototype.onBlur = function () {
+            this.onTouched();
+        };
+        var GIPIRangeSliderComponent_1;
+        GIPIRangeSliderComponent.ctorParameters = function () { return [
+            { type: core.ElementRef },
+            { type: core.ChangeDetectorRef }
+        ]; };
+        __decorate([
+            core.ViewChild('fromSlider', { static: false }),
+            __metadata("design:type", core.ElementRef)
+        ], GIPIRangeSliderComponent.prototype, "fromSlider", void 0);
+        __decorate([
+            core.ViewChild('toSlider', { static: false }),
+            __metadata("design:type", core.ElementRef)
+        ], GIPIRangeSliderComponent.prototype, "toSlider", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangeSliderComponent.prototype, "id", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangeSliderComponent.prototype, "name", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangeSliderComponent.prototype, "label", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPIRangeSliderComponent.prototype, "help", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number)
+        ], GIPIRangeSliderComponent.prototype, "min", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number)
+        ], GIPIRangeSliderComponent.prototype, "max", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number),
+            __metadata("design:paramtypes", [Number])
+        ], GIPIRangeSliderComponent.prototype, "maxRange", null);
+        __decorate([
+            core.Input('from'),
+            __metadata("design:type", Number),
+            __metadata("design:paramtypes", [Number])
+        ], GIPIRangeSliderComponent.prototype, "fromValue", null);
+        __decorate([
+            core.Input('to'),
+            __metadata("design:type", Number),
+            __metadata("design:paramtypes", [Number])
+        ], GIPIRangeSliderComponent.prototype, "toValue", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number),
+            __metadata("design:paramtypes", [Number])
+        ], GIPIRangeSliderComponent.prototype, "step", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPIRangeSliderComponent.prototype, "disabled", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPIRangeSliderComponent.prototype, "required", null);
+        GIPIRangeSliderComponent = GIPIRangeSliderComponent_1 = __decorate([
+            core.Component({
+                selector: 'gipi-range-slider',
+                exportAs: 'gipiRangeSlider',
+                template: "<label *ngIf=\"label\"\n       class=\"input-label\"\n       [attr.for]=\"id\">\n    {{ label }}\n    <span *ngIf=\"required\"> * </span>\n</label>\n\n<div class=\"slider-wrapper\">\n    <!-- <input type=\"number\"\n           [min]=\"min\"\n           [max]=\"max\"\n           [step]=\"step\"\n           [(ngModel)]=\"fromValue\"\n           (ngModelChange)=\"controlFromInput(true)\"\n           (input)=\"controlFromInput(false)\"\n           (blur)=\"onBlur()\" /> -->\n    <span class=\"value min\">\n        {{ min }}\n    </span>\n    <div class=\"sliders-control\">\n        <input #fromSlider\n               id=\"fromSlider\"\n               type=\"range\"\n               class=\"from-value\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [value]=\"fromValue\"\n               (input)=\"controlFromSlider()\"\n               (mouseup)=\"controlFromSlider()\"\n               (blur)=\"onBlur()\" />\n        <input #toSlider\n               id=\"toSlider\"\n               type=\"range\"\n               class=\"to-value\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [value]=\"toValue\"\n               (input)=\"controlToSlider()\"\n               (mouseup)=\"controlToSlider()\"\n               (blur)=\"onBlur()\" />\n    </div>\n    <span class=\"value max\">\n        {{ max }}\n    </span>\n    <!-- <input type=\"number\"\n           [min]=\"min\"\n           [max]=\"max\"\n           [step]=\"step\"\n           [(ngModel)]=\"toValue\"\n           (ngModelChange)=\"controlToInput(true)\"\n           (input)=\"controlToInput(false)\"\n           (blur)=\"onBlur()\" /> -->\n</div>\n<span class=\"value min\">\n    {{ fromValue }} - {{ toValue }}\n</span>\n<small *ngIf=\"help\"\n       class=\"input-help\">\n    {{ help }}\n</small>",
+                providers: [
+                    {
+                        provide: forms.NG_VALUE_ACCESSOR,
+                        useExisting: core.forwardRef(function () { return GIPIRangeSliderComponent_1; }),
+                        multi: true
+                    },
+                ],
+                host: {
+                    'class': 'gipi-range-slider',
+                },
+                changeDetection: core.ChangeDetectionStrategy.OnPush,
+                styles: [":host{display:flex;flex-direction:column;gap:.8rem;font-size:1.4rem;color:#696969}:host .input-label{display:flex;align-items:center;gap:.4rem;color:#131313;line-height:1.6rem}:host .input-label>span{font-size:1.6rem;line-height:1.6rem;color:#d14014}:host .slider-wrapper{display:flex;align-items:center;justify-content:space-between;gap:1.6rem}:host .slider-wrapper>input{display:flex;font-family:inherit;font-size:inherit;color:inherit;text-align:center;padding:.75rem .8rem;background:#fff;border:1px solid rgba(0,0,0,.12);transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.6rem;outline:0}:host .sliders-control{display:flex;align-items:center;justify-content:center;padding:2rem;position:relative;flex:1}:host .from-value,:host .to-value{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:.6rem;border-radius:.4rem;width:100%;position:absolute;background-color:#e0e1e2;pointer-events:none;outline:0}:host .from-value::-webkit-slider-thumb,:host .to-value::-webkit-slider-thumb{-webkit-appearance:none;display:block;width:1.4rem;height:1.4rem;border-radius:50%;background-color:#e0313e;pointer-events:all;box-shadow:0 .5px 0 0 rgba(0,0,0,.08),0 1px 1px 0 rgba(0,0,0,.14);cursor:-webkit-grab;cursor:grab;outline:0}:host .from-value::-webkit-slider-thumb:hover,:host .to-value::-webkit-slider-thumb:hover{background-color:#cc2d38}:host .from-value::-webkit-slider-thumb:active,:host .to-value::-webkit-slider-thumb:active{box-shadow:inset 0 0 3px #e0313e,0 0 9px #e0313e;-webkit-box-shadow:inset 0 0 3px #e0313e,0 0 9px #e0313e;cursor:-webkit-grabbing;cursor:grabbing}:host input[type=number]{border:1px solid rgba(0,0,0,.12);color:#131313;width:50px;height:30px;font-size:20px;outline:0}:host input[type=number]::-webkit-inner-spin-button,:host input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;opacity:0}:host #fromSlider{height:0;z-index:1}"]
+            }),
+            __metadata("design:paramtypes", [core.ElementRef,
+                core.ChangeDetectorRef])
+        ], GIPIRangeSliderComponent);
+        return GIPIRangeSliderComponent;
+    }());
+
+    var GIPISelectButtonComponent = /** @class */ (function () {
+        function GIPISelectButtonComponent(_elementRef, _changeDetectorRef) {
+            this._elementRef = _elementRef;
+            this._changeDetectorRef = _changeDetectorRef;
+            this.isButtonPrimary = this._hasHostAttributes('gipi-primary');
+            this.isButtonSecondary = this._hasHostAttributes('gipi-secondary');
+            this.required = false;
+            this.multiple = false;
+            this.disabled = false;
+            this.onOptionClick = new core.EventEmitter();
+            this.onChange = new core.EventEmitter();
+            this.onModelChange = function () { };
+            this.onModelTouched = function () { };
+        }
+        GIPISelectButtonComponent_1 = GIPISelectButtonComponent;
+        GIPISelectButtonComponent.prototype.ngOnInit = function () { };
+        GIPISelectButtonComponent.prototype.writeValue = function (obj) {
+            this.value = obj;
+            this._changeDetectorRef.markForCheck();
+        };
+        GIPISelectButtonComponent.prototype.registerOnChange = function (fn) {
+            this.onModelChange = fn;
+        };
+        GIPISelectButtonComponent.prototype.registerOnTouched = function (fn) {
+            this.onModelTouched = fn;
+        };
+        GIPISelectButtonComponent.prototype.setDisabledState = function (isDisabled) {
+            this.disabled = isDisabled;
+            this._changeDetectorRef.markForCheck();
+        };
+        GIPISelectButtonComponent.prototype.getOptionLabel = function (option) {
+            return this.optionLabel ? ObjectUtil.resolveFieldData(option, this.optionLabel) : option.label != undefined ? option.label : option;
+        };
+        GIPISelectButtonComponent.prototype.getOptionValue = function (option) {
+            return this.optionValue ? ObjectUtil.resolveFieldData(option, this.optionValue) : this.optionLabel || option.value === undefined ? option : option.value;
+        };
+        GIPISelectButtonComponent.prototype.isOptionDisabled = function (option) {
+            return this.optionDisabled ? ObjectUtil.resolveFieldData(option, this.optionDisabled) : option.disabled !== undefined ? option.disabled : false;
+        };
+        GIPISelectButtonComponent.prototype.onItemClick = function (event, option, index) {
+            if (this.disabled || this.isOptionDisabled(option)) {
+                return;
+            }
+            if (this.multiple) {
+                if (this.isSelected(option)) {
+                    this.removeOption(option);
+                }
+                else {
+                    this.value = __spread((this.value || []), [this.getOptionValue(option)]);
+                }
+                this.onModelChange(this.value);
+                this.onChange.emit({
+                    originalEvent: event,
+                    value: this.value
+                });
+            }
+            else {
+                var value = this.getOptionValue(option);
+                if (this.value !== value) {
+                    this.value = this.getOptionValue(option);
+                    this.onModelChange(this.value);
+                    this.onChange.emit({
+                        originalEvent: event,
+                        value: this.value
+                    });
+                }
+            }
+            this.onOptionClick.emit({
+                originalEvent: event,
+                option: option,
+                index: index
+            });
+        };
+        GIPISelectButtonComponent.prototype.isSelected = function (option) {
+            var e_1, _a;
+            var selected = false;
+            var optionValue = this.getOptionValue(option);
+            if (this.multiple) {
+                if (this.value && Array.isArray(this.value)) {
+                    try {
+                        for (var _b = __values(this.value), _c = _b.next(); !_c.done; _c = _b.next()) {
+                            var val = _c.value;
+                            if (ObjectUtil.equals(val, optionValue, this.dataKey)) {
+                                selected = true;
+                                break;
+                            }
+                        }
+                    }
+                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                    finally {
+                        try {
+                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                        }
+                        finally { if (e_1) throw e_1.error; }
+                    }
+                }
+            }
+            else {
+                selected = ObjectUtil.equals(this.getOptionValue(option), this.value, this.dataKey);
+            }
+            return selected;
+        };
+        GIPISelectButtonComponent.prototype.removeOption = function (option) {
+            var _this = this;
+            this.value = this.value.filter(function (val) { return !ObjectUtil.equals(val, _this.getOptionValue(option), _this.dataKey); });
+        };
+        GIPISelectButtonComponent.prototype.onBlur = function () {
+            this.onModelTouched();
         };
         GIPISelectButtonComponent.prototype._getHostElement = function () {
             return this._elementRef.nativeElement;
@@ -16064,8 +16712,12 @@
             this._mouseEnter = false;
             this.menuItems = [];
             this.labelToggle = 'Retrair menu';
+            this.showTagNewIntegration = false;
+            this.showIntegration = false;
             this.showConfiguration = false;
             this.onClickMenuItem = new core.EventEmitter();
+            this.onClickMenuIntegration = new core.EventEmitter();
+            this.onClickMenuConfiguration = new core.EventEmitter();
         }
         GIPISidenavComponent_1 = GIPISidenavComponent;
         GIPISidenavComponent.prototype.ngOnInit = function () { };
@@ -16255,6 +16907,26 @@
             core.Input(),
             __metadata("design:type", String)
         ], GIPISidenavComponent.prototype, "labelToggle", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPISidenavComponent.prototype, "showTagNewIntegration", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPISidenavComponent.prototype, "iconIntegration", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPISidenavComponent.prototype, "svgIconIntegration", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPISidenavComponent.prototype, "labelIntegration", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPISidenavComponent.prototype, "showIntegration", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
@@ -16275,11 +16947,19 @@
             core.Output(),
             __metadata("design:type", core.EventEmitter)
         ], GIPISidenavComponent.prototype, "onClickMenuItem", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPISidenavComponent.prototype, "onClickMenuIntegration", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPISidenavComponent.prototype, "onClickMenuConfiguration", void 0);
         GIPISidenavComponent = GIPISidenavComponent_1 = __decorate([
             core.Component({
                 selector: "gipi-sidenav",
                 exportAs: 'gipiSidenav',
-                template: "<mat-sidenav #sidenav\n             [mode]=\"(isScreenLarge | async) ? 'side' : 'over'\"\n             class=\"sidenav\"\n             [class.large-sidenav]=\"(isOpened | async)\"\n             [class.small-sidenav]=\"!(isOpened | async)\"\n             [disableClose]=\"(isScreenLarge | async)\"\n             opened=\"true\">\n\n    <div [ngClass]=\"{'sidenav-content-menu': true,\n                     'show-configuration': showConfiguration}\">\n\n        <!-- Bot\u00E3o expandir e retrair o menu -->\n        <button id=\"buttonToogleSidenav\"\n                name=\"toggleSidenav\"\n                class=\"toggle-sidenav\"\n                (click)=\"toggleSidenav(); _mouseEnter = false;\">\n            <mat-icon [@indicatorRotate]=\"(isOpened | async) ? 'opened': 'closed'\">\n                chevron_right\n            </mat-icon>\n\n            {{ ((labelToggle) && (isOpened | async)) ? labelToggle : '' }}\n        </button>\n\n        <!-- Bot\u00E3o voltar do submenu -->\n        <div class=\"sidenav-action-menu sidenav-menu-collapsable\">\n            <a *ngIf=\"(isOpened | async) && (_levelOneMenuCollapsableSelected || _levelTwoMenuCollapsableSelected)\"\n               (click)=\"onMenuCollapsableGoBack()\"\n               (mouseenter)=\"!_mouseEnter && onMouseEnter()\"\n               (mouseleave)=\"_mouseEnter && onMouseLeave()\">\n                <mat-icon>\n                    arrow_back\n                </mat-icon>\n                <span>\n                    {{ (submenuBackButtonName | async) }}\n                </span>\n            </a>\n        </div>\n\n        <!-- Se o menu item for do tipo submenu -->\n        <mat-nav-list class=\"sidenav-menu-list\"\n                      (mouseenter)=\"onMouseEnter()\"\n                      (mouseleave)=\"onMouseLeave()\">\n            <div *ngFor=\"let menu of (levelMenuCollapsableSelected | async)\"\n                 class=\"sidenav-action-menu\">\n\n                <a *ngIf=\"menu.type === 'ITEM'\"\n                   [routerLink]=\"menu.route\"\n                   [class.menu-active]=\"isMenuActive(menu)\"\n                   (click)=\"onMenuItemSelected(menu)\">\n                    <mat-icon *ngIf=\"menu.icon\">\n                        {{ menu.icon }}\n                    </mat-icon>\n                    <mat-icon *ngIf=\"menu.svgIcon\"\n                              [svgIcon]=\"menu.svgIcon\">\n                    </mat-icon>\n                    <span *ngIf=\"(isOpened | async)\">\n                        {{ getMenuName(menu.name) }}\n                    </span>\n                </a>\n\n                <a *ngIf=\"menu.type === 'COLLAPSABLE'\"\n                   [class.menu-active]=\"isMenuCollapsableActive(menu)\"\n                   (click)=\"onMenuCollapsableSelected(menu); onMenuItemSelected(menu, false)\">\n                    <mat-icon *ngIf=\"menu.icon\">\n                        {{ menu.icon }}\n                    </mat-icon>\n                    <mat-icon *ngIf=\"menu.svgIcon\"\n                              [svgIcon]=\"menu.svgIcon\">\n                    </mat-icon>\n                    <span *ngIf=\"(isOpened | async)\">\n                        {{ getMenuName(menu.name) }}\n                    </span>\n                    <mat-icon *ngIf=\"(isOpened | async)\">\n                        chevron_right\n                    </mat-icon>\n                </a>\n\n            </div>\n        </mat-nav-list>\n    </div>\n\n    <div *ngIf=\"showConfiguration\"\n         class=\"sidenav-action-menu sidenav-configuration-menu\">\n        <a (click)=\"onMenuItemSelected(null)\">\n            <mat-icon *ngIf=\"iconConfiguration\">\n                {{ iconConfiguration }}\n            </mat-icon>\n            <mat-icon *ngIf=\"svgIconConfiguration\"\n                      [svgIcon]=\"svgIconConfiguration\">\n            </mat-icon>\n            <span *ngIf=\"(labelConfiguration) && (isOpened | async)\">\n                {{ labelConfiguration }}\n            </span>\n        </a>\n    </div>\n</mat-sidenav>\n",
+                template: "<mat-sidenav #sidenav\n             [mode]=\"(isScreenLarge | async) ? 'side' : 'over'\"\n             class=\"sidenav\"\n             [class.large-sidenav]=\"(isOpened | async)\"\n             [class.small-sidenav]=\"!(isOpened | async)\"\n             [disableClose]=\"(isScreenLarge | async)\"\n             opened=\"true\">\n\n    <div [ngClass]=\"{'sidenav-content-menu': true,\n                     'show-bottom': (showConfiguration || showIntegration)}\">\n\n        <!-- Bot\u00E3o expandir e retrair o menu -->\n        <button id=\"buttonToogleSidenav\"\n                name=\"toggleSidenav\"\n                class=\"toggle-sidenav\"\n                (click)=\"toggleSidenav(); _mouseEnter = false;\">\n            <mat-icon [@indicatorRotate]=\"(isOpened | async) ? 'opened': 'closed'\">\n                chevron_right\n            </mat-icon>\n\n            {{ ((labelToggle) && (isOpened | async)) ? labelToggle : '' }}\n        </button>\n\n        <!-- Bot\u00E3o voltar do submenu -->\n        <div class=\"sidenav-action-menu sidenav-menu-collapsable\">\n            <a *ngIf=\"(isOpened | async) && (_levelOneMenuCollapsableSelected || _levelTwoMenuCollapsableSelected)\"\n               (click)=\"onMenuCollapsableGoBack()\"\n               (mouseenter)=\"!_mouseEnter && onMouseEnter()\"\n               (mouseleave)=\"_mouseEnter && onMouseLeave()\">\n                <mat-icon>\n                    arrow_back\n                </mat-icon>\n                <span>\n                    {{ (submenuBackButtonName | async) }}\n                </span>\n            </a>\n        </div>\n\n        <!-- Se o menu item for do tipo submenu -->\n        <mat-nav-list class=\"sidenav-menu-list\"\n                      (mouseenter)=\"onMouseEnter()\"\n                      (mouseleave)=\"onMouseLeave()\">\n            <div *ngFor=\"let menu of (levelMenuCollapsableSelected | async)\"\n                 class=\"sidenav-action-menu\">\n\n                <a *ngIf=\"menu.type === 'ITEM'\"\n                   [routerLink]=\"menu.route\"\n                   [class.menu-active]=\"isMenuActive(menu)\"\n                   (click)=\"onMenuItemSelected(menu)\">\n                    <mat-icon *ngIf=\"menu.icon\">\n                        {{ menu.icon }}\n                    </mat-icon>\n                    <mat-icon *ngIf=\"menu.svgIcon\"\n                              [svgIcon]=\"menu.svgIcon\">\n                    </mat-icon>\n                    <span *ngIf=\"(isOpened | async)\">\n                        {{ getMenuName(menu.name) }}\n                    </span>\n                </a>\n\n                <a *ngIf=\"menu.type === 'COLLAPSABLE'\"\n                   [class.menu-active]=\"isMenuCollapsableActive(menu)\"\n                   (click)=\"onMenuCollapsableSelected(menu); onMenuItemSelected(menu, false)\">\n                    <mat-icon *ngIf=\"menu.icon\">\n                        {{ menu.icon }}\n                    </mat-icon>\n                    <mat-icon *ngIf=\"menu.svgIcon\"\n                              [svgIcon]=\"menu.svgIcon\">\n                    </mat-icon>\n                    <span *ngIf=\"(isOpened | async)\">\n                        {{ getMenuName(menu.name) }}\n                    </span>\n                    <mat-icon *ngIf=\"(isOpened | async)\">\n                        chevron_right\n                    </mat-icon>\n                </a>\n\n            </div>\n        </mat-nav-list>\n    </div>\n\n    <div class=\"sidenav-action-menu sidenav-bottom-menu\">\n        <a *ngIf=\"showIntegration\"\n           (click)=\"onMenuItemSelected(null); onClickMenuIntegration.emit()\">\n            <mat-icon *ngIf=\"iconIntegration\">\n                {{ iconIntegration }}\n            </mat-icon>\n            <mat-icon *ngIf=\"svgIconIntegration\"\n                      [svgIcon]=\"svgIconIntegration\">\n            </mat-icon>\n            <span *ngIf=\"(labelIntegration) && (isOpened | async)\">\n                {{ labelIntegration }}\n            </span>\n            <div class=\"tag-new\"\n                 *ngIf=\"showTagNewIntegration\">\n                Novo\n            </div>\n        </a>\n\n        <a *ngIf=\"showConfiguration\"\n           (click)=\"onMenuItemSelected(null); onClickMenuConfiguration.emit()\">\n            <mat-icon *ngIf=\"iconConfiguration\">\n                {{ iconConfiguration }}\n            </mat-icon>\n            <mat-icon *ngIf=\"svgIconConfiguration\"\n                      [svgIcon]=\"svgIconConfiguration\">\n            </mat-icon>\n            <span *ngIf=\"(labelConfiguration) && (isOpened | async)\">\n                {{ labelConfiguration }}\n            </span>\n        </a>\n    </div>\n</mat-sidenav>\n",
                 encapsulation: core.ViewEncapsulation.None,
                 providers: [
                     {
@@ -16298,7 +16978,7 @@
                         animations.transition('expanded <=> collapsed', animations.animate('225ms cubic-bezier(0.4,0.0,0.2,1)')),
                     ])
                 ],
-                styles: [".sidenav{padding:.8rem 1.2rem;border-radius:5px;background-color:#fff;position:fixed!important;top:66px!important;bottom:8px!important;border:0!important}.sidenav.small-sidenav{overflow-y:auto;width:76px}.sidenav.small-sidenav .sidenav-configuration-menu,.sidenav.small-sidenav .sidenav-content-menu .sidenav-menu-list .action-sidenav,.sidenav.small-sidenav .sidenav-content-menu .toggle-sidenav{text-align:center!important}.sidenav.large-sidenav{overflow-y:auto;width:248px}.sidenav .sidenav-content-menu{width:100%;background-color:#f5f5f6;border-radius:4px;display:flex;flex-direction:column;align-items:stretch;height:100%}.sidenav .sidenav-content-menu.show-configuration{height:calc(100% - 18px - 52px)!important}.sidenav .sidenav-content-menu .toggle-sidenav{all:unset;border-radius:4px;border:none;text-align:left;cursor:pointer;background-color:#e0313e;color:#fff;display:flex;align-items:center;gap:8px;padding:10px 16px}.sidenav .sidenav-content-menu .toggle-sidenav>mat-icon{width:2rem;height:2rem;font-size:2rem}.sidenav .sidenav-content-menu .toggle-sidenav:hover{background-color:#cc2d38}.sidenav .sidenav-content-menu .sidenav-menu-list{overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.sidenav .sidenav-content-menu .sidenav-menu-list::-webkit-scrollbar{display:none}.menu-active{color:#e0313e!important;background-color:#e0e1e2!important}.menu-active>mat-icon,.menu-active>mat-icon svg,.menu-active>mat-icon svg path{color:#e0313e!important;fill:#e0313e!important}.sidenav-action-menu{cursor:pointer;display:flex}.sidenav-action-menu a{flex:1;padding:16px;background-color:#f5f5f6;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:1.4rem;font-weight:600}.sidenav-action-menu a:hover{background-color:#e0e1e2}.sidenav-action-menu a>span{flex:1;line-height:2rem}.sidenav-action-menu a>mat-icon{width:2rem;height:2rem;font-size:2rem;line-height:2rem;color:#595959;fill:#595959}.sidenav-action-menu a>mat-icon svg,.sidenav-action-menu a>mat-icon svg path{color:#595959;fill:#595959}.sidenav-configuration-menu a{border-radius:4px}.sidenav-menu-collapsable a{background-color:#e0e1e2}.sidenav-menu-collapsable a:hover{background-color:#d1d2d4}.mat-list-base{padding-top:0!important}.mat-drawer-inner-container{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;overflow:hidden!important}.mat-drawer:not(.mat-drawer-side){box-shadow:none!important}"]
+                styles: [".sidenav{padding:.8rem 1.2rem;border-radius:5px;background-color:#fff;position:fixed!important;top:66px!important;bottom:8px!important;border:0!important}.sidenav.small-sidenav{overflow-y:auto;width:76px}.sidenav.small-sidenav .sidenav-bottom-menu,.sidenav.small-sidenav .sidenav-content-menu .sidenav-menu-list .action-sidenav,.sidenav.small-sidenav .sidenav-content-menu .toggle-sidenav{text-align:center!important}.sidenav.large-sidenav{overflow-y:auto;width:248px}.sidenav .sidenav-content-menu{width:100%;background-color:#f5f5f6;border-radius:4px;display:flex;flex-direction:column;align-items:stretch;height:100%}.sidenav .sidenav-content-menu.show-bottom{height:calc(100% - 18px - 52px)!important}.sidenav .sidenav-content-menu .toggle-sidenav{all:unset;border-radius:4px;border:none;text-align:left;cursor:pointer;background-color:#e0313e;color:#fff;display:flex;align-items:center;gap:8px;padding:10px 16px}.sidenav .sidenav-content-menu .toggle-sidenav>mat-icon{width:2rem;height:2rem;font-size:2rem}.sidenav .sidenav-content-menu .toggle-sidenav:hover{background-color:#cc2d38}.sidenav .sidenav-content-menu .sidenav-menu-list{overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.sidenav .sidenav-content-menu .sidenav-menu-list::-webkit-scrollbar{display:none}.menu-active{color:#e0313e!important;background-color:#e0e1e2!important}.menu-active>mat-icon,.menu-active>mat-icon svg,.menu-active>mat-icon svg path{color:#e0313e!important;fill:#e0313e!important}.sidenav-action-menu{cursor:pointer;display:flex}.sidenav-action-menu.sidenav-bottom-menu{flex-direction:column;gap:1rem;margin-top:1rem}.sidenav-action-menu a{flex:1;padding:16px;background-color:#f5f5f6;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:1.4rem;font-weight:600}.sidenav-action-menu a:hover{background-color:#e0e1e2}.sidenav-action-menu a>span{flex:1;line-height:2rem}.sidenav-action-menu a>mat-icon{width:2rem;height:2rem;font-size:2rem;line-height:2rem;color:#595959;fill:#595959}.sidenav-action-menu a>mat-icon svg,.sidenav-action-menu a>mat-icon svg path{color:#595959;fill:#595959}.sidenav-bottom-menu a{border-radius:4px}.sidenav-menu-collapsable a{background-color:#e0e1e2}.sidenav-menu-collapsable a:hover{background-color:#d1d2d4}.mat-list-base{padding-top:0!important}.mat-drawer-inner-container{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;overflow:hidden!important}.mat-drawer:not(.mat-drawer-side){box-shadow:none!important}.tag-new{display:flex;align-items:center;justify-content:center;background-color:#e0313e;color:#fff;padding:.2rem .6rem;font-size:1rem;line-height:1.2rem;border-radius:.4rem}"]
             }),
             __metadata("design:paramtypes", [NavService,
                 BreakpointObserverService,
@@ -16307,6 +16987,128 @@
         return GIPISidenavComponent;
     }());
 
+    var nextUniqueId$h = 0;
+    var GIPISlideToggleComponent = /** @class */ (function () {
+        function GIPISlideToggleComponent(_changeDetectorRef) {
+            this._changeDetectorRef = _changeDetectorRef;
+            this._name = "gipi-slide-toggle-" + nextUniqueId$h++;
+            this._slideToggleValue = false;
+            this.id = this._name;
+            this.name = this._name;
+            this.label = '';
+            this.help = '';
+            this._required = false;
+            this._disabled = false;
+            this.onChange = function () { };
+            this.onTouched = function () { };
+        }
+        GIPISlideToggleComponent_1 = GIPISlideToggleComponent;
+        Object.defineProperty(GIPISlideToggleComponent.prototype, "slideToggleValue", {
+            get: function () {
+                return this._slideToggleValue;
+            },
+            set: function (value) {
+                this._slideToggleValue = value;
+                this.onChange(value);
+                this.onTouched();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPISlideToggleComponent.prototype, "required", {
+            get: function () {
+                return this._required;
+            },
+            set: function (value) {
+                if (this.required !== value) {
+                    this._required = coercion.coerceBooleanProperty(value);
+                    this._changeDetectorRef.markForCheck();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPISlideToggleComponent.prototype, "disabled", {
+            get: function () {
+                return this._disabled;
+            },
+            set: function (value) {
+                if (this.disabled !== value) {
+                    this._disabled = coercion.coerceBooleanProperty(value);
+                    this._changeDetectorRef.markForCheck();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        GIPISlideToggleComponent.prototype.ngOnInit = function () { };
+        GIPISlideToggleComponent.prototype.writeValue = function (value) {
+            this.slideToggleValue = value;
+            this._changeDetectorRef.markForCheck();
+        };
+        GIPISlideToggleComponent.prototype.registerOnChange = function (fn) {
+            this.onChange = fn;
+        };
+        GIPISlideToggleComponent.prototype.registerOnTouched = function (fn) {
+            this.onTouched = fn;
+        };
+        GIPISlideToggleComponent.prototype.setDisabledState = function (isDisabled) {
+            this.disabled = isDisabled;
+            this._changeDetectorRef.markForCheck();
+        };
+        var GIPISlideToggleComponent_1;
+        GIPISlideToggleComponent.ctorParameters = function () { return [
+            { type: core.ChangeDetectorRef }
+        ]; };
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPISlideToggleComponent.prototype, "id", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPISlideToggleComponent.prototype, "name", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPISlideToggleComponent.prototype, "label", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPISlideToggleComponent.prototype, "help", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPISlideToggleComponent.prototype, "required", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPISlideToggleComponent.prototype, "disabled", null);
+        GIPISlideToggleComponent = GIPISlideToggleComponent_1 = __decorate([
+            core.Component({
+                selector: 'gipi-slide-toggle',
+                exportAs: 'gipiSlideToggle',
+                template: "<input class=\"toggle toggle-light\"\n       type=\"checkbox\"\n       [attr.id]=\"id\"\n       [attr.name]=\"name\"\n       [(ngModel)]=\"slideToggleValue\" />\n<label class=\"toggle-btn\"\n       [attr.for]=\"id\">\n</label>\n<label class=\"toggle-label\"\n       *ngIf=\"label\"\n       [attr.for]=\"id\">\n    {{ label }}\n</label>",
+                providers: [
+                    {
+                        provide: forms.NG_VALUE_ACCESSOR,
+                        useExisting: core.forwardRef(function () { return GIPISlideToggleComponent_1; }),
+                        multi: true,
+                    },
+                ],
+                changeDetection: core.ChangeDetectionStrategy.OnPush,
+                host: {
+                    'class': 'gipi-slide-toggle',
+                },
+                styles: [":host{display:flex;align-items:center;cursor:pointer}.toggle-label{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-left:1rem;cursor:pointer}.toggle{display:none}.toggle ::-moz-selection,.toggle :after::-moz-selection,.toggle :before::-moz-selection,.toggle+.toggle-btn::-moz-selection,.toggle::-moz-selection,.toggle:after::-moz-selection,.toggle:before::-moz-selection{background:0 0}.toggle ::selection,.toggle :after::selection,.toggle :before::selection,.toggle+.toggle-btn::selection,.toggle::selection,.toggle:after::selection,.toggle:before::selection{background:0 0}.toggle+.toggle-btn{display:block;width:40px;height:24px;outline:0;background:#e0e1e2;border-radius:22px;padding:4px;transition:.4s;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.toggle+.toggle-btn:after,.toggle+.toggle-btn:before{content:\"\";display:block;width:16px;height:16px;position:relative}.toggle+.toggle-btn:after{left:0;background:#8c8f93;border-radius:50%;transition:.2s}.toggle+.toggle-btn:before{display:none}.toggle:checked+.toggle-btn:after{left:50%;background:#414244}"]
+            }),
+            __metadata("design:paramtypes", [core.ChangeDetectorRef])
+        ], GIPISlideToggleComponent);
+        return GIPISlideToggleComponent;
+    }());
+
     var GIPIStepperComponent = /** @class */ (function (_super) {
         __extends(GIPIStepperComponent, _super);
         function GIPIStepperComponent() {
@@ -17022,34 +17824,232 @@
             __metadata("design:type", Boolean)
         ], GIPITableComponent.prototype, "tableShowBorder", void 0);
         __decorate([
-            core.Input(),
-            __metadata("design:type", Boolean)
-        ], GIPITableComponent.prototype, "hideHeader", void 0);
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPITableComponent.prototype, "hideHeader", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPITableComponent.prototype, "hideFooter", void 0);
+        GIPITableComponent = GIPITableComponent_1 = __decorate([
+            core.Component({
+                selector: "gipi-table",
+                exportAs: 'gipiTable',
+                template: "<div role=\"table\"\n     class=\"table\">\n    <gipi-table-header [columns]=\"columns\"\n                       [loading]=\"loading\"\n                       [disabled]=\"disabled\"\n                       [sortActive]=\"sortActive\"\n                       [sortStart]=\"sortStart\"\n                       [sortLocked]=\"sortLocked\"\n                       [sortDisableClear]=\"sortDisableClear\"\n                       [sortAscendingIcon]=\"sortAscendingIcon\"\n                       [sortDescendingIcon]=\"sortDescendingIcon\"\n                       [sortUnsetIcon]=\"sortUnsetIcon\"\n                       (sortChange)=\"sortChange.emit($event)\">\n    </gipi-table-header>\n    <gipi-table-body [columns]=\"columns\"\n                     [loading]=\"loading\"\n                     [loadingDetail]=\"loadingDetail\"\n                     [disabled]=\"disabled\"\n                     [clickOnRow]=\"clickOnRow\"\n                     [expandable]=\"expandable\"\n                     [expandOnlyOneRow]=\"expandOnlyOneRow\"\n                     [rowExpandableFn]=\"rowExpandableFn\"\n                     [highlightRowFn]=\"highlightRowFn\"\n                     [trackBy]=\"trackBy\"\n                     [rowDetailRef]=\"rowDetailRef\"\n                     [rows]=\"rows\"\n                     (rowsExpandedChange)=\"rowsExpandedChange.emit($event)\"\n                     (rowDetailToggleChange)=\"rowDetailToggleChange.emit($event)\">\n    </gipi-table-body>\n</div>",
+                providers: [
+                    {
+                        provide: forms.NG_VALUE_ACCESSOR,
+                        useExisting: core.forwardRef(function () { return GIPITableComponent_1; }),
+                        multi: true
+                    }
+                ],
+                host: {
+                    'class': 'gipi-table',
+                },
+                changeDetection: core.ChangeDetectionStrategy.OnPush,
+                styles: [".table{border:1px solid #e0e1e2;border-radius:4px}"]
+            }),
+            __metadata("design:paramtypes", [])
+        ], GIPITableComponent);
+        return GIPITableComponent;
+    }());
+
+    var TabModel = /** @class */ (function () {
+        function TabModel() {
+            this.active = false;
+            this.closeable = false;
+            this.disabled = false;
+        }
+        return TabModel;
+    }());
+
+    var GIPITabComponent = /** @class */ (function () {
+        function GIPITabComponent() {
+            this.active = false;
+            this.closeable = false;
+            this.disabled = false;
+            this.selectionChange = new core.EventEmitter();
+        }
+        GIPITabComponent.prototype.ngOnInit = function () { };
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number)
+        ], GIPITabComponent.prototype, "index", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPITabComponent.prototype, "label", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPITabComponent.prototype, "active", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", core.TemplateRef)
+        ], GIPITabComponent.prototype, "template", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPITabComponent.prototype, "closeable", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], GIPITabComponent.prototype, "disabled", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], GIPITabComponent.prototype, "data", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPITabComponent.prototype, "icon", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPITabComponent.prototype, "svgIcon", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPITabComponent.prototype, "selectionChange", void 0);
+        GIPITabComponent = __decorate([
+            core.Component({
+                selector: 'gipi-tab',
+                exportAs: 'gipiTab',
+                template: "<ng-container *ngIf=\"active\">\n    <ng-content> </ng-content>\n    <ng-container *ngIf=\"template\"\n                  [ngTemplateOutlet]=\"template\"\n                  [ngTemplateOutletContext]=\"{$implicit: data}\">\n    </ng-container>\n</ng-container>",
+                host: {
+                    'class': 'gipi-tab',
+                    '[style.display]': '!active ? "none" : "block"',
+                },
+                styles: [":host{padding:1.6rem}"]
+            }),
+            __metadata("design:paramtypes", [])
+        ], GIPITabComponent);
+        return GIPITabComponent;
+    }());
+
+    var GIPITabGroupComponent = /** @class */ (function () {
+        function GIPITabGroupComponent(elementRef, _componentFactoryResolver) {
+            this.elementRef = elementRef;
+            this._componentFactoryResolver = _componentFactoryResolver;
+            this.dynamicTabs = [];
+        }
+        GIPITabGroupComponent.prototype.ngOnInit = function () { };
+        GIPITabGroupComponent.prototype.ngAfterContentInit = function () {
+            var activeTabs = this.tabQueryList.filter(function (tab) { return tab.active; });
+            if (activeTabs.length === 0 && this.tabQueryList.length > 0) {
+                this.selectTab(this.tabQueryList.first);
+            }
+        };
+        GIPITabGroupComponent.prototype.openTab = function (label, template, data, closeable, disabled, action) {
+            if (closeable === void 0) { closeable = false; }
+            if (disabled === void 0) { disabled = false; }
+            var tab = new TabModel();
+            tab.label = label;
+            tab.template = template;
+            tab.data = data;
+            tab.closeable = closeable;
+            tab.disabled = disabled;
+            tab.action = action;
+            this._openTabs(Array(tab));
+        };
+        GIPITabGroupComponent.prototype._openTabs = function (tabList) {
+            var _a;
+            var _this = this;
+            var tabsComponent = tabList.map(function (tab) { return _this._getTabComponent(tab.label, tab.template, tab.data, tab.closeable, tab.disabled, tab.action); });
+            (_a = this.dynamicTabs).push.apply(_a, __spread(tabsComponent));
+            this.selectTab(this.dynamicTabs[0]);
+        };
+        GIPITabGroupComponent.prototype._getTabComponent = function (label, template, data, closeable, disabled, action) {
+            if (closeable === void 0) { closeable = false; }
+            if (disabled === void 0) { disabled = false; }
+            var componentFactory = this._componentFactoryResolver.resolveComponentFactory(GIPITabComponent);
+            var componentRef = this.dynamicTabPlaceholder.viewContainer.createComponent(componentFactory);
+            var instance = componentRef.instance;
+            instance.label = label;
+            instance.template = template;
+            instance.data = data;
+            instance.closeable = closeable;
+            instance.disabled = disabled;
+            instance.action = action;
+            return componentRef.instance;
+        };
+        GIPITabGroupComponent.prototype.selectTab = function (tab) {
+            this.tabQueryList.toArray().forEach(function (t) { return (t.active = false); });
+            this.dynamicTabs.forEach(function (t) { return (t.active = false); });
+            tab.active = true;
+            tab.selectionChange.emit();
+            if (tab.action) {
+                tab.action(tab.data);
+            }
+        };
+        GIPITabGroupComponent.prototype.closeTab = function (tab) {
+            var index = this.dynamicTabs.indexOf(tab);
+            this.dynamicTabs.splice(index, 1);
+            var viewContainerRef = this.dynamicTabPlaceholder.viewContainer;
+            viewContainerRef.remove(index);
+            if (this.tabQueryList.length > 0) {
+                this.selectTab(this.tabQueryList.first);
+            }
+        };
+        GIPITabGroupComponent.prototype.closeActiveTab = function () {
+            var activeTabs = this.dynamicTabs.filter(function (tab) { return tab.active; });
+            if (activeTabs.length > 0) {
+                this.closeTab(activeTabs[0]);
+            }
+        };
+        GIPITabGroupComponent.prototype.closeAllTabs = function () {
+            var _this = this;
+            var tabs = Object.assign([], this.dynamicTabs);
+            if (tabs.length > 0) {
+                tabs.forEach(function (tab) { return _this.closeTab(tab); });
+            }
+        };
+        GIPITabGroupComponent.prototype.nextTab = function () {
+            var currentTab = this.tabQueryList.toArray().find(function (tab) { return tab.active; });
+            var nextTab = this.tabQueryList.toArray()[this.tabQueryList.toArray().indexOf(currentTab) + 1];
+            if (nextTab != null) {
+                this.tabQueryList.toArray().forEach(function (t) { return (t.active = false); });
+                this.dynamicTabs.forEach(function (t) { return (t.active = false); });
+                nextTab.active = true;
+                nextTab.selectionChange.emit();
+            }
+        };
+        GIPITabGroupComponent.prototype.previousTab = function () {
+            var currentTab = this.tabQueryList.toArray().find(function (tab) { return tab.active; });
+            var previousTab = this.tabQueryList.toArray()[this.tabQueryList.toArray().indexOf(currentTab) - 1];
+            if (previousTab != null) {
+                this.tabQueryList.toArray().forEach(function (t) { return (t.active = false); });
+                this.dynamicTabs.forEach(function (t) { return (t.active = false); });
+                previousTab.active = true;
+                previousTab.selectionChange.emit();
+            }
+        };
+        GIPITabGroupComponent.ctorParameters = function () { return [
+            { type: core.ElementRef },
+            { type: core.ComponentFactoryResolver }
+        ]; };
+        __decorate([
+            core.ContentChildren(GIPITabComponent),
+            __metadata("design:type", core.QueryList)
+        ], GIPITabGroupComponent.prototype, "tabQueryList", void 0);
         __decorate([
-            core.Input(),
-            __metadata("design:type", Boolean)
-        ], GIPITableComponent.prototype, "hideFooter", void 0);
-        GIPITableComponent = GIPITableComponent_1 = __decorate([
+            core.ViewChild(GIPIDynamicTabDirective, { static: false }),
+            __metadata("design:type", GIPIDynamicTabDirective)
+        ], GIPITabGroupComponent.prototype, "dynamicTabPlaceholder", void 0);
+        GIPITabGroupComponent = __decorate([
             core.Component({
-                selector: "gipi-table",
-                exportAs: 'gipiTable',
-                template: "<div role=\"table\"\n     class=\"table\">\n    <gipi-table-header [columns]=\"columns\"\n                       [loading]=\"loading\"\n                       [disabled]=\"disabled\"\n                       [sortActive]=\"sortActive\"\n                       [sortStart]=\"sortStart\"\n                       [sortLocked]=\"sortLocked\"\n                       [sortDisableClear]=\"sortDisableClear\"\n                       [sortAscendingIcon]=\"sortAscendingIcon\"\n                       [sortDescendingIcon]=\"sortDescendingIcon\"\n                       [sortUnsetIcon]=\"sortUnsetIcon\"\n                       (sortChange)=\"sortChange.emit($event)\">\n    </gipi-table-header>\n    <gipi-table-body [columns]=\"columns\"\n                     [loading]=\"loading\"\n                     [loadingDetail]=\"loadingDetail\"\n                     [disabled]=\"disabled\"\n                     [clickOnRow]=\"clickOnRow\"\n                     [expandable]=\"expandable\"\n                     [expandOnlyOneRow]=\"expandOnlyOneRow\"\n                     [rowExpandableFn]=\"rowExpandableFn\"\n                     [highlightRowFn]=\"highlightRowFn\"\n                     [trackBy]=\"trackBy\"\n                     [rowDetailRef]=\"rowDetailRef\"\n                     [rows]=\"rows\"\n                     (rowsExpandedChange)=\"rowsExpandedChange.emit($event)\"\n                     (rowDetailToggleChange)=\"rowDetailToggleChange.emit($event)\">\n    </gipi-table-body>\n</div>",
-                providers: [
-                    {
-                        provide: forms.NG_VALUE_ACCESSOR,
-                        useExisting: core.forwardRef(function () { return GIPITableComponent_1; }),
-                        multi: true
-                    }
-                ],
+                selector: 'gipi-tab-group',
+                exportAs: 'gipiTabGroup',
+                template: "<nav mat-tab-nav-bar>\n    <a mat-tab-link\n       *ngFor=\"let tab of tabQueryList\"\n       (click)=\"selectTab(tab)\"\n       [class.active]=\"tab.active\"\n       [disabled]=\"tab.disabled\">\n        <mat-icon *ngIf=\"tab.icon || tab.svgIcon\"\n                  [svgIcon]=\"tab.svgIcon ? tab.svgIcon : ''\">\n            {{ !tab.svgIcon && tab.icon ? tab.icon : '' }}\n        </mat-icon>\n\n        {{ tab.label }}\n    </a>\n\n    <a mat-tab-link\n       *ngFor=\"let tab of dynamicTabs\"\n       (click)=\"selectTab(tab)\"\n       [class.active]=\"tab.active\"\n       [disabled]=\"tab.disabled\">\n        <mat-icon *ngIf=\"tab.icon || tab.svgIcon\"\n                  [svgIcon]=\"tab.svgIcon ? tab.svgIcon : ''\">\n            {{ !tab.svgIcon && tab.icon ? tab.icon : '' }}\n        </mat-icon>\n\n        {{ tab.label }}\n    </a>\n</nav>\n\n<ng-content> </ng-content>\n<ng-template dynamicTab\n             #container>\n</ng-template>",
                 host: {
-                    'class': 'gipi-table',
+                    'class': 'gipi-tab-group',
                 },
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [".table{border:1px solid #e0e1e2;border-radius:4px}"]
+                styles: [":host{display:block;flex:1;width:100%;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1)}:host ::ng-deep .mat-tab-nav-bar{background:#f5f5f6;border:none;border-radius:.4rem;padding:.4rem;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1)}:host ::ng-deep .mat-tab-links{display:flex;gap:1rem}:host ::ng-deep .mat-tab-link{height:auto!important;padding:1rem!important;opacity:1!important;border:none!important;border-radius:4px!important;transition:.2s!important;color:#595959!important;gap:1rem}:host ::ng-deep .mat-tab-link>mat-icon{width:2rem!important;height:2rem!important;font-size:2rem!important;color:#595959!important}:host ::ng-deep .mat-tab-link>mat-icon svg,:host ::ng-deep .mat-tab-link>mat-icon svg g path,:host ::ng-deep .mat-tab-link>mat-icon svg path{color:#595959!important;fill:#595959!important}:host ::ng-deep .mat-tab-link:not(.active):hover{background:#e0e1e2!important}:host ::ng-deep .mat-tab-link.active{background:#e0313e!important;color:#fff!important}:host ::ng-deep .mat-tab-link.active>mat-icon{color:#fff!important}:host ::ng-deep .mat-tab-link.active>mat-icon svg,:host ::ng-deep .mat-tab-link.active>mat-icon svg g path,:host ::ng-deep .mat-tab-link.active>mat-icon svg path{color:#fff!important;fill:#fff!important}:host ::ng-deep .mat-tab-link:disabled,:host ::ng-deep .mat-tab-link:disabled>mat-icon{color:#9a9da2!important;fill:#9a9da2!important}:host ::ng-deep .mat-tab-link:disabled svg,:host ::ng-deep .mat-tab-link:disabled svg g path,:host ::ng-deep .mat-tab-link:disabled svg path,:host ::ng-deep .mat-tab-link:disabled>mat-icon svg,:host ::ng-deep .mat-tab-link:disabled>mat-icon svg g path,:host ::ng-deep .mat-tab-link:disabled>mat-icon svg path{color:#9a9da2!important;fill:#9a9da2!important}:host ::ng-deep .mat-ink-bar{display:none!important}"]
             }),
-            __metadata("design:paramtypes", [])
-        ], GIPITableComponent);
-        return GIPITableComponent;
+            __metadata("design:paramtypes", [core.ElementRef,
+                core.ComponentFactoryResolver])
+        ], GIPITabGroupComponent);
+        return GIPITabGroupComponent;
     }());
 
     var GIPIToolbarComponent = /** @class */ (function () {
@@ -17139,34 +18139,6 @@
         return GIPITopNavComponent;
     }());
 
-    /** @dynamic */
-    var NumberUtil = /** @class */ (function () {
-        function NumberUtil() {
-        }
-        NumberUtil.isPositive = function (value) {
-            return !ObjectUtil.isNull(value) && value > 0;
-        };
-        NumberUtil.isNegative = function (value) {
-            return !ObjectUtil.isNull(value) && value < 0;
-        };
-        NumberUtil.format = function (value, digitsInfo, type) {
-            if (!ObjectUtil.isNull(value) && (!type || type === 'NUMBER')) {
-                return common.formatNumber(value, 'pt', digitsInfo);
-            }
-            else if (!ObjectUtil.isNull(value) && type === 'PERCENT') {
-                return common.formatPercent(value / 100, 'pt', digitsInfo);
-            }
-            return StringUtil.EMPTY;
-        };
-        NumberUtil.onlyNumbers = function (value) {
-            return String(value).replace(/[^\d]/g, '');
-        };
-        NumberUtil.isNumber = function (value) {
-            return value !== null && value !== undefined && !isNaN(value) && typeof value === 'number';
-        };
-        return NumberUtil;
-    }());
-
     var moment = moment_;
     /** @dynamic */
     var DateUtil = /** @class */ (function () {
@@ -21192,7 +22164,7 @@
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
-    var nextUniqueId$e = 0;
+    var nextUniqueId$i = 0;
     var MatDateRangeInput = /** @class */ (function () {
         function MatDateRangeInput(_changeDetectorRef, _elementRef, control, _dateAdapter, _formField) {
             this._changeDetectorRef = _changeDetectorRef;
@@ -21200,7 +22172,7 @@
             this._dateAdapter = _dateAdapter;
             this._formField = _formField;
             /** Unique ID for the input. */
-            this.id = "mat-date-range-input-" + nextUniqueId$e++;
+            this.id = "mat-date-range-input-" + nextUniqueId$i++;
             /** Whether the control is focused. */
             this.focused = false;
             /** Name of the form control. */
@@ -22775,12 +23747,12 @@
     }());
 
     var moment$3 = moment_;
-    var nextUniqueId$g = 0;
+    var nextUniqueId$k = 0;
     var DatepickerComponent = /** @class */ (function () {
         function DatepickerComponent(elementRef, _changeDetectorRef) {
             this.elementRef = elementRef;
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-date-range-" + nextUniqueId$g++;
+            this._name = "gipi-date-range-" + nextUniqueId$k++;
             this.id = this._name + "-date";
             this.name = this._name + "-date";
             this.label = '';
@@ -22801,7 +23773,9 @@
             },
             set: function (value) {
                 this._minDate = value;
-                this._minDate.setHours(0, 0, 0, 0);
+                if (!ObjectUtil.isNull(value)) {
+                    this._minDate.setHours(0, 0, 0, 0);
+                }
             },
             enumerable: false,
             configurable: true
@@ -22812,7 +23786,9 @@
             },
             set: function (value) {
                 this._maxDate = value;
-                this._maxDate.setHours(0, 0, 0, 0);
+                if (!ObjectUtil.isNull(value)) {
+                    this._maxDate.setHours(0, 0, 0, 0);
+                }
             },
             enumerable: false,
             configurable: true
@@ -23355,7 +24331,7 @@
             this.selectedYearMoment = moment$5();
             this.updateYearText();
             this.selectedMonthMoment = moment$5();
-            this.months = moment$5.monthsShort().map(function (month) { return month + "."; });
+            this.months = ['Jan.', 'Fev.', 'Mar.', 'Abr.', 'Mai.', 'Jun.', 'Jul.', 'Ago.', 'Set.', 'Out.', 'Nov.', 'Dez.'];
             this.selectedMonthIndex = this.selectedMonthMoment.month();
             this.selectedMonthYear = this.selectedYearMoment.year();
         }
@@ -23377,7 +24353,7 @@
         };
         return MonthPickerModel;
     }());
-    var nextUniqueId$h = 0;
+    var nextUniqueId$l = 0;
     var MonthYearPickerComponent = /** @class */ (function () {
         function MonthYearPickerComponent(elementRef, _changeDetectorRef, _overlay, _ngZone, _viewContainerRef, scrollStrategy, _dir, _document) {
             this.elementRef = elementRef;
@@ -23387,7 +24363,7 @@
             this._viewContainerRef = _viewContainerRef;
             this._dir = _dir;
             this._document = _document;
-            this._name = "gipi-date-range-" + nextUniqueId$h++;
+            this._name = "gipi-date-range-" + nextUniqueId$l++;
             this._focusedElementBeforeOpen = null;
             this._backdropHarnessClass = this._name + "-backdrop";
             this._stateChanges = new rxjs.Subject();
@@ -23805,393 +24781,395 @@
                     common.CommonModule,
                     button.MatButtonModule,
                     dialog.MatDialogModule,
-                    overlay.OverlayModule,
-                    a11y.A11yModule,
-                    portal.PortalModule,
-                    icon.MatIconModule,
-                    forms.FormsModule,
-                    forms.ReactiveFormsModule,
-                ],
-                exports: [
-                    scrolling.ScrollingModule,
-                    CalendarMonthYearComponent,
-                    MonthYearPickerComponent,
-                ],
-                declarations: [
-                    CalendarMonthYearComponent,
-                    MonthYearPickerComponent,
-                ],
-                providers: [
-                    GIPI_MONTH_YEAR_SCROLL_STRATEGY_FACTORY_PROVIDER,
-                ],
-                entryComponents: [
-                    CalendarMonthYearComponent,
-                ],
-            })
-        ], MonthYearPickerModule);
-        return MonthYearPickerModule;
-    }());
-
-    var nextUniqueId$i = 0;
-    var RangePage = /** @class */ (function () {
-        function RangePage(start, end) {
-            this.start = start;
-            this.end = end;
-        }
-        RangePage.prototype.getTotalCount = function () {
-            return (this.end - this.start) + 1;
-        };
-        RangePage.prototype.getRange = function () {
-            var _this = this;
-            return Array.from({ length: this.getTotalCount() }, function (_, i) { return _this.start - 1 + i; });
-        };
-        return RangePage;
-    }());
-    var GIPIRangePageComponent = /** @class */ (function () {
-        function GIPIRangePageComponent(elementRef, _changeDetectorRef) {
-            this.elementRef = elementRef;
-            this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-range-page-" + nextUniqueId$i++;
-            this._startPage = 1;
-            this._endPage = 1;
-            this.id = this._name;
-            this.name = this._name;
-            this.label = '';
-            this.tooltip = '';
-            this.placeholderStart = '';
-            this.placeholderEnd = '';
-            this.help = '';
-            this._min = 1;
-            this._max = 100;
-            this._step = 1;
-            this._required = false;
-            this._disabled = false;
-            this.onChange = function (value) { };
-            this.onTouched = function () { };
-        }
-        GIPIRangePageComponent_1 = GIPIRangePageComponent;
-        Object.defineProperty(GIPIRangePageComponent.prototype, "min", {
-            get: function () {
-                return NumberUtil.isNumber(this._min) ? this._min : 1;
-            },
-            set: function (value) {
-                this._min = value;
-                this._initPage();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(GIPIRangePageComponent.prototype, "max", {
-            get: function () {
-                return NumberUtil.isNumber(this._max) ? this._max : 100;
-            },
-            set: function (value) {
-                this._max = value;
-                this._initPage();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(GIPIRangePageComponent.prototype, "step", {
-            get: function () {
-                return NumberUtil.isNumber(this._step) ? this._step : 1;
-            },
-            set: function (value) {
-                this._step = value;
-                this._initPage();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(GIPIRangePageComponent.prototype, "required", {
-            get: function () {
-                return this._required;
-            },
-            set: function (value) {
-                this._required = coercion.coerceBooleanProperty(value);
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(GIPIRangePageComponent.prototype, "disabled", {
-            get: function () {
-                return this._disabled;
-            },
-            set: function (value) {
-                this._disabled = coercion.coerceBooleanProperty(value);
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(GIPIRangePageComponent.prototype, "formattedValue", {
-            get: function () {
-                return '';
-            },
-            enumerable: false,
-            configurable: true
-        });
-        GIPIRangePageComponent.prototype.ngOnInit = function () {
-            this._initPage();
-        };
-        GIPIRangePageComponent.prototype.ngOnDestroy = function () { };
-        GIPIRangePageComponent.prototype.writeValue = function (value) {
-            if (!ObjectUtil.isNull(value)) {
-                this._startPage = value.start || this._startPage;
-                this._endPage = value.end || this._endPage;
+                    overlay.OverlayModule,
+                    a11y.A11yModule,
+                    portal.PortalModule,
+                    icon.MatIconModule,
+                    forms.FormsModule,
+                    forms.ReactiveFormsModule,
+                ],
+                exports: [
+                    scrolling.ScrollingModule,
+                    CalendarMonthYearComponent,
+                    MonthYearPickerComponent,
+                ],
+                declarations: [
+                    CalendarMonthYearComponent,
+                    MonthYearPickerComponent,
+                ],
+                providers: [
+                    GIPI_MONTH_YEAR_SCROLL_STRATEGY_FACTORY_PROVIDER,
+                ],
+                entryComponents: [
+                    CalendarMonthYearComponent,
+                ],
+            })
+        ], MonthYearPickerModule);
+        return MonthYearPickerModule;
+    }());
+
+    var nextUniqueId$m = 0;
+    var GIPISplitButtonComponent = /** @class */ (function () {
+        function GIPISplitButtonComponent(elementRef) {
+            this.elementRef = elementRef;
+            this._uniqueId = nextUniqueId$m++;
+            this._name = "gipi-split-button-" + this._uniqueId;
+            this.idBtnDefault = "gipi-split-button-default-" + this._uniqueId;
+            this.idBtnMenu = "gipi-split-button-menu-" + this._uniqueId;
+            this.isSplitButtonPrimary = this._hasHostAttributes('gipi-primary');
+            this.isSplitButtonSecondary = this._hasHostAttributes('gipi-secondary');
+            this.isSplitButtonTertiary = this._hasHostAttributes('gipi-tertiary');
+            this.isSplitButtonAction = this._hasHostAttributes('gipi-action');
+            this.id = this._name;
+            this.name = this._name;
+            this.type = 'button';
+            this.ariaLabel = '';
+            this.title = '';
+            this.label = '';
+            this.disabled = false;
+            this.loading = false;
+            this.tooltip = '';
+            this.splitOptions = [];
+            this.onOpenPopover = new core.EventEmitter();
+            this.onClosePopover = new core.EventEmitter();
+            this.onClick = new core.EventEmitter(true);
+            this.onFocus = new core.EventEmitter(true);
+            this.onBlur = new core.EventEmitter(true);
+        }
+        GIPISplitButtonComponent_1 = GIPISplitButtonComponent;
+        GIPISplitButtonComponent.prototype.ngOnInit = function () { };
+        GIPISplitButtonComponent.prototype.ngOnDestroy = function () {
+            if (this.popoverTrigger) {
+                this.popoverTrigger.destroyPopover();
             }
-            this._changeDetectorRef.detectChanges();
         };
-        GIPIRangePageComponent.prototype.registerOnChange = function (fn) {
-            this.onChange = fn;
+        GIPISplitButtonComponent.prototype.getHostElement = function () {
+            return this.elementRef.nativeElement;
         };
-        GIPIRangePageComponent.prototype.registerOnTouched = function (fn) {
-            this.onTouched = fn;
+        GIPISplitButtonComponent.prototype._hasHostAttributes = function () {
+            var _this = this;
+            var attributes = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                attributes[_i] = arguments[_i];
+            }
+            return attributes.some(function (attribute) { return _this.getHostElement().hasAttribute(attribute); });
         };
-        GIPIRangePageComponent.prototype.setDisabledState = function (isDisabled) {
-            this.disabled = isDisabled;
-            this._changeDetectorRef.markForCheck();
+        GIPISplitButtonComponent.prototype.btnIdAndName = function () {
+            var uniqueId = nextUniqueId$m++;
+            return {
+                btnDefault: "gipi-split-button-default-" + uniqueId,
+                btnMenu: "gipi-split-button-menu-" + uniqueId,
+            };
         };
-        GIPIRangePageComponent.prototype._initPage = function () {
-            this._startPage = this.min;
-            this._endPage = Math.min(this._startPage + this.step - 1, this.max);
+        GIPISplitButtonComponent.prototype.getInternalButtonClass = function (isBtnDefault) {
+            return {
+                'button-default': isBtnDefault,
+                'button-menu': !isBtnDefault,
+                'button-primary': this.isSplitButtonPrimary,
+                'button-secondary': this.isSplitButtonSecondary,
+                'button-tertiary': this.isSplitButtonTertiary,
+                'button-action': this.isSplitButtonAction,
+            };
         };
-        GIPIRangePageComponent.prototype.updateEndPage = function () {
-            if (this.disabled) {
+        GIPISplitButtonComponent.prototype.showPopover = function () {
+            if (this.disabled || this.loading) {
                 return;
             }
-            if (this._startPage < this.min) {
-                this._startPage = this.min;
-            }
-            else if (this._startPage > this.max) {
-                this._startPage = this.max;
+            else {
+                this.popoverTrigger.openPopover();
             }
-            if (this._endPage < this._startPage) {
-                this._endPage = this._startPage;
+        };
+        GIPISplitButtonComponent.prototype.closePopover = function () {
+            if (this.disabled || this.loading) {
+                return;
             }
-            else if (this._endPage > (this._startPage + (this.step - 1))) {
-                this._endPage = Math.min(this._startPage + this.step - 1, this.max);
+            else {
+                this.popoverTrigger.closePopover();
             }
-            this._propagateChange();
         };
-        GIPIRangePageComponent.prototype.updateStartPage = function () {
-            if (this.disabled) {
+        GIPISplitButtonComponent.prototype.handleClick = function (event) {
+            if (this.disabled || this.loading) {
                 return;
             }
-            if (this._endPage > this.max) {
-                this._endPage = this.max;
-            }
-            else if (this._endPage > this.max) {
-                this._endPage = this.max;
+            else {
+                this.onClick.emit(event);
+                this.closePopover();
+                event.stopPropagation();
             }
-            if (this._startPage > this._endPage) {
-                this._startPage = this._endPage;
+        };
+        GIPISplitButtonComponent.prototype.handleFocus = function (event) {
+            if (this.disabled || this.loading) {
+                return;
             }
-            else if (this._startPage < (this._endPage - (this.step + 1))) {
-                this._startPage = Math.max(this._endPage - this.step + 1, this.min);
+            else {
+                this.onFocus.emit(event);
+                event.stopPropagation();
             }
-            this._propagateChange();
         };
-        GIPIRangePageComponent.prototype.previous = function () {
-            if (this.disabled) {
+        GIPISplitButtonComponent.prototype.handleBlur = function (event) {
+            if (this.disabled || this.loading) {
                 return;
             }
-            var newStartPage = Math.max(this._startPage - this.step + 1, this.min);
-            var newEndPage = Math.min(newStartPage + this.step - 1, this.max);
-            if (newEndPage >= this.min) {
-                this._startPage = newStartPage;
-                this._endPage = newEndPage;
-                this._propagateChange();
+            else {
+                this.onBlur.emit(event);
+                event.stopPropagation();
             }
         };
-        GIPIRangePageComponent.prototype.next = function () {
-            if (this.disabled) {
+        GIPISplitButtonComponent.prototype.handleClickBtnMenu = function (event) {
+            if (this.disabled || this.loading) {
                 return;
             }
-            // const newStartPage = Math.min(this._startPage + this.step, this.max - this.step + 1);
-            // let newEndPage = newStartPage + this.step - 1;
-            var newStartPage = Math.min(this._startPage + this.step, this.max);
-            var newEndPage = Math.min(newStartPage + this.step - 1, this.max);
-            if ((newStartPage === this.max) || (newEndPage > this.max)) {
-                newEndPage = newStartPage;
-            }
-            if (newEndPage <= this.max) {
-                this._startPage = newStartPage;
-                this._endPage = newEndPage;
-                this._propagateChange();
+            else {
+                if (!ObjectUtil.isNull(this.popoverTrigger)) {
+                    this.popoverTrigger.togglePopover();
+                }
+                event.stopPropagation();
             }
         };
-        GIPIRangePageComponent.prototype.selectText = function (input) {
-            if (this.disabled || !input) {
+        GIPISplitButtonComponent.prototype.handleClickBtnSplitOption = function (option) {
+            if (this.disabled || this.loading || !option || option.disabled || !option.clickFn) {
                 return;
             }
-            setTimeout(function () { return input.select(); }, 0);
+            else {
+                option.clickFn();
+                this.closePopover();
+            }
         };
-        GIPIRangePageComponent.prototype._propagateChange = function () {
-            this.onChange(new RangePage(this._startPage, this._endPage));
-            this.onTouched();
+        GIPISplitButtonComponent.prototype.onResize = function (event) {
+            if (this.popoverTrigger) {
+                this.popoverTrigger.closePopover();
+                event.stopPropagation();
+            }
         };
-        var GIPIRangePageComponent_1;
-        GIPIRangePageComponent.ctorParameters = function () { return [
-            { type: core.ElementRef },
-            { type: core.ChangeDetectorRef }
+        var GIPISplitButtonComponent_1;
+        GIPISplitButtonComponent.ctorParameters = function () { return [
+            { type: core.ElementRef }
         ]; };
+        __decorate([
+            core.ViewChild(GIPIPopoverTrigger, { static: false }),
+            __metadata("design:type", GIPIPopoverTrigger)
+        ], GIPISplitButtonComponent.prototype, "popoverTrigger", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangePageComponent.prototype, "id", void 0);
+        ], GIPISplitButtonComponent.prototype, "id", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangePageComponent.prototype, "name", void 0);
+        ], GIPISplitButtonComponent.prototype, "name", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangePageComponent.prototype, "label", void 0);
+        ], GIPISplitButtonComponent.prototype, "type", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangePageComponent.prototype, "tooltip", void 0);
+        ], GIPISplitButtonComponent.prototype, "ariaLabel", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangePageComponent.prototype, "placeholderStart", void 0);
+        ], GIPISplitButtonComponent.prototype, "title", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangePageComponent.prototype, "placeholderEnd", void 0);
+        ], GIPISplitButtonComponent.prototype, "label", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangePageComponent.prototype, "help", void 0);
+        ], GIPISplitButtonComponent.prototype, "buttonClass", void 0);
         __decorate([
             core.Input(),
-            __metadata("design:type", Number),
-            __metadata("design:paramtypes", [Number])
-        ], GIPIRangePageComponent.prototype, "min", null);
+            __metadata("design:type", Boolean)
+        ], GIPISplitButtonComponent.prototype, "disabled", void 0);
         __decorate([
             core.Input(),
-            __metadata("design:type", Number),
-            __metadata("design:paramtypes", [Number])
-        ], GIPIRangePageComponent.prototype, "max", null);
+            __metadata("design:type", Boolean)
+        ], GIPISplitButtonComponent.prototype, "loading", void 0);
         __decorate([
             core.Input(),
-            __metadata("design:type", Number),
-            __metadata("design:paramtypes", [Number])
-        ], GIPIRangePageComponent.prototype, "step", null);
+            __metadata("design:type", String)
+        ], GIPISplitButtonComponent.prototype, "tooltip", void 0);
         __decorate([
-            core.Input(),
-            __metadata("design:type", Boolean),
-            __metadata("design:paramtypes", [Boolean])
-        ], GIPIRangePageComponent.prototype, "required", null);
+            core.Input('options'),
+            __metadata("design:type", Array)
+        ], GIPISplitButtonComponent.prototype, "splitOptions", void 0);
         __decorate([
-            core.Input(),
-            __metadata("design:type", Boolean),
-            __metadata("design:paramtypes", [Boolean])
-        ], GIPIRangePageComponent.prototype, "disabled", null);
-        GIPIRangePageComponent = GIPIRangePageComponent_1 = __decorate([
+            core.Output(),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPISplitButtonComponent.prototype, "onOpenPopover", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPISplitButtonComponent.prototype, "onClosePopover", void 0);
+        __decorate([
+            core.Output('click'),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPISplitButtonComponent.prototype, "onClick", void 0);
+        __decorate([
+            core.Output('focus'),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPISplitButtonComponent.prototype, "onFocus", void 0);
+        __decorate([
+            core.Output('blur'),
+            __metadata("design:type", core.EventEmitter)
+        ], GIPISplitButtonComponent.prototype, "onBlur", void 0);
+        __decorate([
+            core.HostListener('window:resize', ['$event']),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", [UIEvent]),
+            __metadata("design:returntype", void 0)
+        ], GIPISplitButtonComponent.prototype, "onResize", null);
+        GIPISplitButtonComponent = GIPISplitButtonComponent_1 = __decorate([
             core.Component({
-                selector: 'gipi-range-page',
-                template: "<label *ngIf=\"label\"\n       class=\"input-label\"\n       [attr.for]=\"id\">\n    {{ label }}\n    <span *ngIf=\"required\"> * </span>\n    <gipi-helpful-tip *ngIf=\"tooltip && label\"\n                      [tooltip]=\"tooltip\">\n    </gipi-helpful-tip>\n</label>\n\n<div class=\"input-content\">\n    <div class=\"prefix\"\n         [class.disabled]=\"disabled\"\n         (click)=\"previous()\">\n        <mat-icon>chevron_left</mat-icon>\n    </div>\n    <input #startInput\n           matInput\n           class=\"input-element\"\n           type=\"number\"\n           [attr.id]=\"id\"\n           [attr.name]=\"name\"\n           [min]=\"min\"\n           [max]=\"max\"\n           [maxlength]=\"10\"\n           [placeholder]=\"placeholderStart\"\n           [disabled]=\"disabled\"\n           [required]=\"required\"\n           [readOnly]=\"false\"\n           [autocomplete]=\"'off'\"\n           [autofocus]=\"false\"\n           [(ngModel)]=\"_startPage\"\n           (keyup)=\"updateEndPage()\"\n           (focus)=\"selectText(startInput)\"\n           (click)=\"selectText(startInput)\" />\n    <div class=\"infix\">\n        a\n    </div>\n    <input #endInput\n           matInput\n           class=\"input-element\"\n           type=\"number\"\n           [attr.id]=\"id\"\n           [attr.name]=\"name\"\n           [min]=\"_startPage\"\n           [max]=\"max\"\n           [maxlength]=\"10\"\n           [placeholder]=\"placeholderEnd\"\n           [disabled]=\"disabled\"\n           [required]=\"required\"\n           [readOnly]=\"false\"\n           [autocomplete]=\"'off'\"\n           [autofocus]=\"false\"\n           [(ngModel)]=\"_endPage\"\n           (keyup)=\"updateStartPage()\"\n           (focus)=\"selectText(endInput)\"\n           (click)=\"selectText(endInput)\" />\n    <div class=\"suffix\"\n         [class.disabled]=\"disabled\"\n         (click)=\"next()\">\n        <mat-icon>chevron_right</mat-icon>\n    </div>\n</div>\n\n<small *ngIf=\"help\"\n       class=\"input-help\">\n    {{ help }}\n</small>",
+                selector: "gipi-split-button[gipi-primary], gipi-split-button[gipi-secondary],\n               gipi-split-button[gipi-tertiary], gipi-split-button[gipi-action]",
+                exportAs: 'gipiSplitButton',
+                template: "<div [matTooltip]=\"tooltip\"\n     [class]=\"buttonClass || ''\"\n     [class.button-base]=\"true\"\n     [class.disabled]=\"disabled || loading\"\n     #popoverTrigger=\"popoverTrigger\"\n     [popoverTriggerFor]=\"btnPopover\"\n     [popoverTriggerOn]=\"'none'\"\n     [popoverBackdropCloseOnClick]=\"true\"\n     (opened)=\"onOpenPopover.emit()\"\n     (closed)=\"onClosePopover.emit()\">\n    <button [attr.id]=\"idBtnDefault\"\n            [attr.name]=\"idBtnDefault\"\n            [attr.type]=\"type\"\n            [attr.aria-label]=\"ariaLabel ? ariaLabel : label\"\n            [attr.title]=\"title ? title : label\"\n            [disabled]=\"disabled || loading\"\n            [ngClass]=\"getInternalButtonClass(true)\"\n            role=\"button\"\n            (click)=\"handleClick($event)\"\n            (focus)=\"handleFocus($event)\"\n            (blur)=\"handleBlur($event)\">\n        {{ label ? label : '' }}\n    </button>\n    <button [attr.id]=\"idBtnMenu\"\n            [attr.name]=\"idBtnMenu\"\n            [attr.type]=\"type\"\n            [attr.aria-label]=\"ariaLabel ? ariaLabel : label\"\n            [attr.title]=\"title ? title : label\"\n            [disabled]=\"disabled || loading\"\n            [ngClass]=\"getInternalButtonClass(false)\"\n            role=\"button\"\n            (click)=\"handleClickBtnMenu($event)\">\n        <mat-icon [@indicatorRotate]=\"popoverTrigger?.popoverOpen ? 'opened': 'closed'\"> expand_more </mat-icon>\n    </button>\n</div>\n\n<gipi-popover #btnPopover=\"gipiPopover\"\n              [popoverOverlapTrigger]=\"false\"\n              [popoverCloseOnClick]=\"false\"\n              [popoverArrowWidth]=\"0\"\n              [popoverOffsetY]=\"3\">\n    <div class=\"btn-popover-content\">\n        <button class=\"btn-split-option\"\n                *ngFor=\"let option of splitOptions\"\n                [disabled]=\"option?.disabled\"\n                (click)=\"handleClickBtnSplitOption(option)\">\n            {{ option.label }}\n        </button>\n    </div>\n</gipi-popover>",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
-                        useExisting: core.forwardRef(function () { return GIPIRangePageComponent_1; }),
+                        useExisting: core.forwardRef(function () { return GIPISplitButtonComponent_1; }),
                         multi: true
-                    },
+                    }
                 ],
-                styles: [":host{display:flex;flex-direction:column;gap:.8rem;font-size:1.4rem;color:#696969}:host .input-label{display:flex;align-items:center;gap:.4rem;color:#131313;line-height:1.6rem}:host .input-label>span{font-size:1.6rem;line-height:1.6rem;color:#d14014}:host .input-content{display:flex;font-family:inherit;font-size:inherit;color:inherit;height:4rem;background:#fff;border:1px solid rgba(0,0,0,.12);transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.6rem}:host .input-content .input-element{padding:.75rem .8rem;border:none;outline:0;background-color:transparent;flex:1;color:inherit;caret-color:#696969;min-width:0;text-align:center;margin:0!important}:host .input-content .input-element::-webkit-inner-spin-button,:host .input-content .input-element::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;opacity:0}:host .input-content:has(.input-element:disabled){color:#bbbdc1!important;border-color:#e0e1e2!important;background-color:#f5f5f6!important;cursor:not-allowed}:host .input-content:has(.input-element:disabled) .suffix>mat-icon{color:#bbbdc1!important}:host .input-content .input-element:disabled{cursor:not-allowed}:host .input-content .infix,:host .input-content .prefix,:host .input-content .suffix{display:flex;align-items:center;justify-content:center;padding-block:.75rem;padding-inline:.8rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:.2s;background-color:#e0313e}:host .input-content .infix>mat-icon,:host .input-content .prefix>mat-icon,:host .input-content .suffix>mat-icon{width:2rem;height:2rem;font-size:2rem;color:#fff}:host .input-content .infix:not(.infix):not(.disabled):hover,:host .input-content .prefix:not(.infix):not(.disabled):hover,:host .input-content .suffix:not(.infix):not(.disabled):hover{background-color:#cc2d38}:host .input-content .infix:not(.infix):not(.disabled):active,:host .input-content .prefix:not(.infix):not(.disabled):active,:host .input-content .suffix:not(.infix):not(.disabled):active{background-color:#9f232c}:host .input-content .prefix.disabled,:host .input-content .suffix.disabled{background-color:#d1d2d4}:host .input-content .prefix.disabled>mat-icon,:host .input-content .suffix.disabled>mat-icon{color:#9a9da2}:host .input-content .prefix{border-right:1px solid rgba(0,0,0,.12);border-radius:.6rem 0 0 .6rem;cursor:pointer}:host .input-content .infix{width:1rem;padding:0;background-color:transparent}:host .input-content .suffix{border-left:1px solid rgba(0,0,0,.12);border-radius:0 .6rem .6rem 0;cursor:pointer}:host .input-help{flex:1;font-size:1rem;font-weight:500;margin-top:-.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::-webkit-input-placeholder{color:#bbbdc1}:-moz-placeholder{color:#bbbdc1}::-moz-placeholder{color:#bbbdc1}:-ms-input-placeholder{color:#bbbdc1}"]
+                host: {
+                    'class': 'gipi-split-button',
+                    '[attr.id]': 'id',
+                    '[attr.name]': 'name',
+                },
+                animations: [
+                    animations.trigger('indicatorRotate', [
+                        animations.state('closed', animations.style({ transform: 'rotate(0deg)' })),
+                        animations.state('opened', animations.style({ transform: 'rotate(-180deg)' })),
+                        animations.transition('opened <=> closed', animations.animate('225ms cubic-bezier(0.4,0.0,0.2,1)')),
+                    ])
+                ],
+                styles: [".button-base{display:flex;flex-direction:row;justify-content:center;border-radius:4px;font-weight:600;font-size:1.4rem;line-height:1.6rem;cursor:pointer;outline:0;white-space:nowrap;text-decoration:none;vertical-align:middle;text-align:center;box-shadow:1px 1px 5px 0 rgba(0,0,0,.1);transition:.2s;width:100%;max-height:4rem;border:1px solid transparent;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.button-base.disabled{cursor:not-allowed!important;box-shadow:none}.button-base>button{display:flex;align-items:center;justify-content:center;border:none;outline:0;box-shadow:none;width:100%;height:40px;padding:12px 16px;overflow:hidden;border-radius:inherit;cursor:inherit;font-size:inherit;font-weight:inherit;white-space:nowrap;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative}.button-base>button:not(.disabled):active{opacity:.8}.button-base .button-default{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.button-base .button-menu{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;border-top-left-radius:0!important;border-bottom-left-radius:0!important}.button-primary:not(:disabled),.button-primary:not(:disabled)>mat-icon{background-color:#e0313e;color:#fff;fill:#fff}.button-primary:not(:disabled).button-default,.button-primary:not(:disabled)>mat-icon.button-default{border-right:1px solid #9f232c}.button-primary:not(:disabled) svg,.button-primary:not(:disabled) svg g path,.button-primary:not(:disabled) svg path,.button-primary:not(:disabled)>mat-icon svg,.button-primary:not(:disabled)>mat-icon svg g path,.button-primary:not(:disabled)>mat-icon svg path{color:#fff;fill:#fff}.button-primary:disabled,.button-primary:disabled>mat-icon{background-color:#d1d2d4;color:#9a9da2;fill:#9a9da2}.button-primary:disabled.button-default,.button-primary:disabled>mat-icon.button-default{border-right:1px solid #9a9da2}.button-primary:disabled svg,.button-primary:disabled svg g path,.button-primary:disabled svg path,.button-primary:disabled>mat-icon svg,.button-primary:disabled>mat-icon svg g path,.button-primary:disabled>mat-icon svg path{color:#9a9da2;fill:#9a9da2}.button-primary:not(:disabled):hover,.button-primary:not(:disabled):hover>mat-icon{background-color:#cc2d38;color:#fff;fill:#fff}.button-primary:not(:disabled):hover svg,.button-primary:not(:disabled):hover svg g path,.button-primary:not(:disabled):hover svg path,.button-primary:not(:disabled):hover>mat-icon svg,.button-primary:not(:disabled):hover>mat-icon svg g path,.button-primary:not(:disabled):hover>mat-icon svg path{color:#fff;fill:#fff}.button-secondary{background-color:transparent}.button-secondary:not(:disabled),.button-secondary:not(:disabled)>mat-icon{border-color:#595959;color:#595959;fill:#595959}.button-secondary:not(:disabled).button-default,.button-secondary:not(:disabled)>mat-icon.button-default{border-right:1px solid #595959}.button-secondary:not(:disabled) svg,.button-secondary:not(:disabled) svg g path,.button-secondary:not(:disabled) svg path,.button-secondary:not(:disabled)>mat-icon svg,.button-secondary:not(:disabled)>mat-icon svg g path,.button-secondary:not(:disabled)>mat-icon svg path{color:#595959;fill:#595959}.button-secondary:disabled,.button-secondary:disabled>mat-icon{border-color:#d1d2d4;background-color:#d1d2d4;color:#9a9da2;fill:#9a9da2}.button-secondary:disabled.button-default,.button-secondary:disabled>mat-icon.button-default{border-right:1px solid #9a9da2}.button-secondary:disabled svg,.button-secondary:disabled svg g path,.button-secondary:disabled svg path,.button-secondary:disabled>mat-icon svg,.button-secondary:disabled>mat-icon svg g path,.button-secondary:disabled>mat-icon svg path{color:#9a9da2;fill:#9a9da2}.button-secondary:not(:disabled):hover,.button-secondary:not(:disabled):hover>mat-icon{border-color:#595959;background-color:#e0e1e2;color:#595959;fill:#595959}.button-secondary:not(:disabled):hover svg,.button-secondary:not(:disabled):hover svg g path,.button-secondary:not(:disabled):hover svg path,.button-secondary:not(:disabled):hover>mat-icon svg,.button-secondary:not(:disabled):hover>mat-icon svg g path,.button-secondary:not(:disabled):hover>mat-icon svg path{color:#595959;fill:#595959}.button-tertiary{background-color:#e7ebee;box-shadow:none}.button-tertiary:not(:disabled),.button-tertiary:not(:disabled)>mat-icon{color:#595959;fill:#595959}.button-tertiary:not(:disabled).button-default,.button-tertiary:not(:disabled)>mat-icon.button-default{border-right:1px solid #595959}.button-tertiary:not(:disabled) svg,.button-tertiary:not(:disabled) svg g path,.button-tertiary:not(:disabled) svg path,.button-tertiary:not(:disabled)>mat-icon svg,.button-tertiary:not(:disabled)>mat-icon svg g path,.button-tertiary:not(:disabled)>mat-icon svg path{color:#595959;fill:#595959}.button-tertiary:disabled,.button-tertiary:disabled>mat-icon{background-color:#d1d2d4;color:#9a9da2;fill:#9a9da2}.button-tertiary:disabled.button-default,.button-tertiary:disabled>mat-icon.button-default{border-right:1px solid #9a9da2}.button-tertiary:disabled svg,.button-tertiary:disabled svg g path,.button-tertiary:disabled svg path,.button-tertiary:disabled>mat-icon svg,.button-tertiary:disabled>mat-icon svg g path,.button-tertiary:disabled>mat-icon svg path{color:#9a9da2;fill:#9a9da2}.button-tertiary:not(:disabled):hover,.button-tertiary:not(:disabled):hover>mat-icon{background-color:#e0e1e2;color:#595959;fill:#595959}.button-tertiary:not(:disabled):hover svg,.button-tertiary:not(:disabled):hover svg g path,.button-tertiary:not(:disabled):hover svg path,.button-tertiary:not(:disabled):hover>mat-icon svg,.button-tertiary:not(:disabled):hover>mat-icon svg g path,.button-tertiary:not(:disabled):hover>mat-icon svg path{color:#595959;fill:#595959}.button-action{background-color:transparent;box-shadow:none;display:flex;justify-content:flex-start!important}.button-action:not(:disabled),.button-action:not(:disabled)>mat-icon{color:#262626;fill:#262626}.button-action:not(:disabled).button-default,.button-action:not(:disabled)>mat-icon.button-default{border-right:1px solid #262626}.button-action:not(:disabled) svg,.button-action:not(:disabled) svg g path,.button-action:not(:disabled) svg path,.button-action:not(:disabled)>mat-icon svg,.button-action:not(:disabled)>mat-icon svg g path,.button-action:not(:disabled)>mat-icon svg path{color:#262626;fill:#262626}.button-action:disabled,.button-action:disabled>mat-icon{color:#9a9da2;fill:#9a9da2}.button-action:disabled.button-default,.button-action:disabled>mat-icon.button-default{border-right:1px solid #9a9da2}.button-action:disabled svg,.button-action:disabled svg g path,.button-action:disabled svg path,.button-action:disabled>mat-icon svg,.button-action:disabled>mat-icon svg g path,.button-action:disabled>mat-icon svg path{color:#9a9da2;fill:#9a9da2}.button-action:not(:disabled):hover,.button-action:not(:disabled):hover>mat-icon{background-color:#f5f5f6;color:#262626;fill:#262626}.button-action:not(:disabled):hover svg,.button-action:not(:disabled):hover svg g path,.button-action:not(:disabled):hover svg path,.button-action:not(:disabled):hover>mat-icon svg,.button-action:not(:disabled):hover>mat-icon svg g path,.button-action:not(:disabled):hover>mat-icon svg path{color:#262626;fill:#262626}.disabled,:disabled{pointer-events:none!important}.btn-popover-content{display:flex;flex-direction:column;gap:.8rem;background-color:#fff;border-radius:4px;box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12);padding:8px}.btn-split-option{width:100%;padding:.8rem;border-radius:.4rem;border:1px solid transparent;text-align:left;outline:0;background-color:transparent;cursor:pointer}.btn-split-option:not(:disabled){color:#595959}.btn-split-option:disabled{border-color:#d1d2d4;background-color:#d1d2d4;color:#9a9da2;cursor:not-allowed}.btn-split-option:not(:disabled):hover{border-color:#595959;background-color:#e0e1e2;color:#595959}"]
             }),
-            __metadata("design:paramtypes", [core.ElementRef,
-                core.ChangeDetectorRef])
-        ], GIPIRangePageComponent);
-        return GIPIRangePageComponent;
+            __metadata("design:paramtypes", [core.ElementRef])
+        ], GIPISplitButtonComponent);
+        return GIPISplitButtonComponent;
     }());
 
-    var nextUniqueId$j = 0;
-    var GIPIRangeSliderComponent = /** @class */ (function () {
-        function GIPIRangeSliderComponent(elementRef, _changeDetectorRef) {
+    var nextUniqueId$n = 0;
+    var GIPITextareaComponent = /** @class */ (function () {
+        function GIPITextareaComponent(elementRef, _changeDetectorRef) {
             this.elementRef = elementRef;
             this._changeDetectorRef = _changeDetectorRef;
-            this._name = "gipi-range-slider-" + nextUniqueId$j++;
+            this._name = "gipi-textarea-" + nextUniqueId$n++;
             this.id = this._name;
             this.name = this._name;
             this.label = '';
+            this.placeholder = '';
+            this.cols = 20;
+            this.rows = 4;
             this.help = '';
-            this.min = 1;
-            this.max = 100;
-            this._maxRange = 5;
-            this._fromValue = 1;
-            this._toValue = 1;
-            this._step = 1;
-            this._disabled = false;
+            this.maxlength = 254;
+            this.minlength = 0;
+            this._resize = 'horizontal';
+            this._minHeight = '60px';
+            this._height = '60px';
+            this._maxHeight = 'auto';
+            this._autocomplete = 'off';
+            this._autofocus = false;
+            this._readOnly = false;
             this._required = false;
+            this._disabled = false;
+            this._lowerCase = false;
+            this._upperCase = false;
+            this._spaceDrop = false;
             this.onChange = function () { };
             this.onTouched = function () { };
         }
-        GIPIRangeSliderComponent_1 = GIPIRangeSliderComponent;
-        Object.defineProperty(GIPIRangeSliderComponent.prototype, "maxRange", {
+        GIPITextareaComponent_1 = GIPITextareaComponent;
+        Object.defineProperty(GIPITextareaComponent.prototype, "resize", {
+            get: function () {
+                return this._resize;
+            },
+            set: function (value) {
+                if (value !== this.resize) {
+                    this._resize = value.toLowerCase();
+                    this._changeDetectorRef.detectChanges();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPITextareaComponent.prototype, "minHeight", {
+            get: function () {
+                return this._minHeight;
+            },
+            set: function (value) {
+                if (value.trim().toUpperCase() === 'AUTO') {
+                    this._minHeight = 'auto';
+                }
+                else {
+                    this._minHeight = coercion.coerceCssPixelValue(value);
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPITextareaComponent.prototype, "height", {
             get: function () {
-                return this._maxRange || 5;
+                return this._height;
             },
             set: function (value) {
-                if (!value || (value <= 0)) {
-                    throw new Error('Minimum value for "maxRange" must be 1');
+                if (value.trim().toUpperCase() === 'AUTO') {
+                    this._height = 'auto';
+                }
+                else {
+                    this._height = coercion.coerceCssPixelValue(value);
                 }
-                this._maxRange = value || 5;
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(GIPIRangeSliderComponent.prototype, "fromValue", {
+        Object.defineProperty(GIPITextareaComponent.prototype, "maxHeight", {
             get: function () {
-                return this._fromValue || 1;
+                return this._maxHeight;
             },
             set: function (value) {
-                if (!value || (value <= 0)) {
-                    throw new Error('Minimum value for "from" must be 1');
+                if (value.trim().toUpperCase() === 'AUTO') {
+                    this._maxHeight = 'auto';
+                }
+                else {
+                    this._maxHeight = coercion.coerceCssPixelValue(value);
                 }
-                this._fromValue = value || 1;
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(GIPIRangeSliderComponent.prototype, "toValue", {
+        Object.defineProperty(GIPITextareaComponent.prototype, "autocomplete", {
             get: function () {
-                return this._toValue || 1;
+                return this._autocomplete;
             },
             set: function (value) {
-                if (!value || (value <= 0)) {
-                    throw new Error('Minimum value for "to" must be 1');
-                }
-                this._toValue = value || 1;
+                this._autocomplete = value;
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(GIPIRangeSliderComponent.prototype, "step", {
+        Object.defineProperty(GIPITextareaComponent.prototype, "autofocus", {
             get: function () {
-                return this._step || 1;
+                return this._autofocus;
             },
             set: function (value) {
-                if (!value || (value <= 0)) {
-                    throw new Error('Minimum value for "step" must be 1');
-                }
-                this._step = value || 1;
+                this._autofocus = coercion.coerceBooleanProperty(value);
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(GIPIRangeSliderComponent.prototype, "disabled", {
+        Object.defineProperty(GIPITextareaComponent.prototype, "readOnly", {
             get: function () {
-                return this._disabled;
+                return this._readOnly;
             },
             set: function (value) {
-                this._disabled = coercion.coerceBooleanProperty(value);
+                this._readOnly = coercion.coerceBooleanProperty(value);
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(GIPIRangeSliderComponent.prototype, "required", {
+        Object.defineProperty(GIPITextareaComponent.prototype, "required", {
             get: function () {
                 return this._required;
             },
@@ -24201,269 +25179,222 @@
             enumerable: false,
             configurable: true
         });
-        GIPIRangeSliderComponent.prototype.ngOnInit = function () { };
-        GIPIRangeSliderComponent.prototype.ngAfterViewInit = function () {
-            this._fillSlider();
-            this._setToggleAccessible();
-        };
-        GIPIRangeSliderComponent.prototype.ngOnDestroy = function () { };
-        GIPIRangeSliderComponent.prototype.writeValue = function (value) {
-            if (value) {
-                this.fromValue = value.from;
-                this.toValue = value.to;
-                if (this.fromSlider && this.toSlider) {
-                    this.fromSlider.nativeElement.value = this.fromValue.toString();
-                    this.toSlider.nativeElement.value = this.toValue.toString();
-                    this._fillSlider();
-                    this._setToggleAccessible();
-                }
-            }
+        Object.defineProperty(GIPITextareaComponent.prototype, "disabled", {
+            get: function () {
+                return this._disabled;
+            },
+            set: function (value) {
+                this._disabled = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPITextareaComponent.prototype, "lowerCase", {
+            get: function () {
+                return this._lowerCase;
+            },
+            set: function (value) {
+                this._lowerCase = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPITextareaComponent.prototype, "upperCase", {
+            get: function () {
+                return this._upperCase;
+            },
+            set: function (value) {
+                this._upperCase = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPITextareaComponent.prototype, "spaceDrop", {
+            get: function () {
+                return this._spaceDrop;
+            },
+            set: function (value) {
+                this._spaceDrop = coercion.coerceBooleanProperty(value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(GIPITextareaComponent.prototype, "value", {
+            get: function () {
+                return this._value;
+            },
+            set: function (value) {
+                var valueAux = value;
+                valueAux = this._checkSpaceDrop(valueAux);
+                valueAux = this._checkLowercase(valueAux);
+                valueAux = this._checkUppercase(valueAux);
+                this._value = valueAux;
+                this.onChange(this._value);
+                this.onTouched(this._value);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        GIPITextareaComponent.prototype.ngOnInit = function () { };
+        GIPITextareaComponent.prototype.writeValue = function (value) {
+            this._value = value;
         };
-        GIPIRangeSliderComponent.prototype.registerOnChange = function (fn) {
+        GIPITextareaComponent.prototype.registerOnChange = function (fn) {
             this.onChange = fn;
         };
-        GIPIRangeSliderComponent.prototype.registerOnTouched = function (fn) {
+        GIPITextareaComponent.prototype.registerOnTouched = function (fn) {
             this.onTouched = fn;
         };
-        GIPIRangeSliderComponent.prototype.setDisabledState = function (isDisabled) {
+        GIPITextareaComponent.prototype.setDisabledState = function (isDisabled) {
             this.disabled = isDisabled;
             this._changeDetectorRef.markForCheck();
         };
-        GIPIRangeSliderComponent.prototype.controlFromInput = function (isByNgModel) {
-            var _a = __read(isByNgModel ? [this.fromValue, this.toValue] : this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
-            from = this._roundToStep(from);
-            to = this._roundToStep(to);
-            // if ((to - from) > this.maxRange) {
-            //     from = to - this.maxRange;
-            // }
-            this._fillSlider();
-            this._setToggleAccessible();
-            if (from > to) {
-                this.fromValue = to;
-            }
-            this.fromSlider.nativeElement.value = this.fromValue.toString();
-            this._notifyValueChange();
-        };
-        GIPIRangeSliderComponent.prototype.controlToInput = function (isByNgModel) {
-            var _a = __read(isByNgModel ? [this.fromValue, this.toValue] : this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
-            from = this._roundToStep(from);
-            to = this._roundToStep(to);
-            // if ((to - from) > this.maxRange) {
-            //     to = from + this.maxRange;
-            // }
-            this._fillSlider();
-            this._setToggleAccessible();
-            if (from <= to) {
-                this.toValue = to;
-            }
-            else {
-                this.toValue = from;
-            }
-            this.toSlider.nativeElement.value = this.toValue.toString();
-            this._notifyValueChange();
-        };
-        GIPIRangeSliderComponent.prototype.controlFromSlider = function () {
-            var _a = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
-            from = this._roundToStep(from);
-            to = this._roundToStep(to);
-            if ((to - from) > this.maxRange) {
-                from = to - this.maxRange;
-            }
-            this._fillSlider();
-            this._setToggleAccessible();
-            if ((to - from) === this.maxRange) {
-                var _b = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from_1 = _b[0], to_1 = _b[1];
-                from_1 = this._roundToStep(from_1);
-                to_1 = this._roundToStep(to_1);
-                if ((to_1 - from_1) > this.maxRange) {
-                    to_1 = from_1 + this.maxRange;
-                }
-                this._fillSlider();
-                if (from_1 <= to_1) {
-                    this.toValue = to_1;
-                }
-                else {
-                    this.toValue = from_1;
-                }
-                this.toSlider.nativeElement.value = this.toValue.toString();
-            }
-            if (from >= to) {
-                this.fromValue = to;
-            }
-            else {
-                this.fromValue = from;
-            }
-            this.fromSlider.nativeElement.value = this.fromValue.toString();
-            this._notifyValueChange();
-        };
-        GIPIRangeSliderComponent.prototype.controlToSlider = function () {
-            var _a = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from = _a[0], to = _a[1];
-            from = this._roundToStep(from);
-            to = this._roundToStep(to);
-            if ((to - from) > this.maxRange) {
-                to = from + this.maxRange;
-            }
-            this._fillSlider();
-            this._setToggleAccessible();
-            if ((to - from) === this.maxRange) {
-                var _b = __read(this._getParsed(this.fromSlider.nativeElement, this.toSlider.nativeElement), 2), from_2 = _b[0], to_2 = _b[1];
-                from_2 = this._roundToStep(from_2);
-                to_2 = this._roundToStep(to_2);
-                if ((to_2 - from_2) > this.maxRange) {
-                    from_2 = to_2 - this.maxRange;
-                }
-                this._fillSlider();
-                if (from_2 >= to_2) {
-                    this.fromValue = to_2;
-                }
-                else {
-                    this.fromValue = from_2;
-                }
-                this.fromSlider.nativeElement.value = this.fromValue.toString();
-            }
-            if (from <= to) {
-                this.toValue = to;
-            }
-            else {
-                this.toValue = from;
+        GIPITextareaComponent.prototype._checkSpaceDrop = function (value) {
+            if (this.spaceDrop && value) {
+                return value.replace(/\s/g, '');
             }
-            this.toSlider.nativeElement.value = this.toValue.toString();
-            this._notifyValueChange();
-        };
-        GIPIRangeSliderComponent.prototype._getParsed = function (currentFrom, currentTo) {
-            var from = parseInt(currentFrom.value, 10);
-            var to = parseInt(currentTo.value, 10);
-            return [from, to];
-        };
-        GIPIRangeSliderComponent.prototype._fillSlider = function () {
-            var fromSliderEl = this.fromSlider.nativeElement;
-            var toSliderEl = this.toSlider.nativeElement;
-            var rangeDistance = Number(toSliderEl.max) - Number(toSliderEl.min);
-            var fromPosition = (this.fromValue - Number(fromSliderEl.min));
-            var toPosition = (this.toValue - Number(toSliderEl.min));
-            var sliderColor = '#e0e1e2';
-            var rangeColor = '#f1a0a6';
-            toSliderEl.style.background = "linear-gradient(\n            to right,\n            " + sliderColor + " 0%,\n            " + sliderColor + " " + (fromPosition) / (rangeDistance) * 100 + "%,\n            " + rangeColor + " " + ((fromPosition) / (rangeDistance)) * 100 + "%,\n            " + rangeColor + " " + (toPosition) / (rangeDistance) * 100 + "%,\n            " + sliderColor + " " + (toPosition) / (rangeDistance) * 100 + "%,\n            " + sliderColor + " 100%)";
+            return value;
         };
-        GIPIRangeSliderComponent.prototype._setToggleAccessible = function () {
-            var fromInput = this.fromSlider.nativeElement;
-            var toInput = this.toSlider.nativeElement;
-            var fromValue = parseInt(fromInput.value, 10);
-            var toValue = parseInt(toInput.value, 10);
-            if (fromValue <= parseInt(fromInput.min, 10) && toValue <= parseInt(toInput.min, 10)) {
-                // Ambos estão no mínimo
-                fromInput.style.zIndex = '1';
-                toInput.style.zIndex = '2';
-            }
-            else if (fromValue >= parseInt(fromInput.max, 10) && toValue >= parseInt(toInput.max, 10)) {
-                // Ambos estão no máximo
-                fromInput.style.zIndex = '2';
-                toInput.style.zIndex = '1';
-            }
-            else {
-                // Caso geral
-                fromInput.style.zIndex = '2';
-                toInput.style.zIndex = '1';
+        GIPITextareaComponent.prototype._checkUppercase = function (value) {
+            if (this.upperCase && value) {
+                return value.toUpperCase();
             }
+            return value;
         };
-        GIPIRangeSliderComponent.prototype._roundToStep = function (value) {
-            return Math.round(value / this.step) * this.step;
-        };
-        GIPIRangeSliderComponent.prototype._notifyValueChange = function () {
-            this.onChange({ from: this.fromValue, to: this.toValue });
-        };
-        GIPIRangeSliderComponent.prototype.onBlur = function () {
-            this.onTouched();
-        };
-        var GIPIRangeSliderComponent_1;
-        GIPIRangeSliderComponent.ctorParameters = function () { return [
+        GIPITextareaComponent.prototype._checkLowercase = function (value) {
+            if (this.lowerCase && value) {
+                return value.toLowerCase();
+            }
+            return value;
+        };
+        var GIPITextareaComponent_1;
+        GIPITextareaComponent.ctorParameters = function () { return [
             { type: core.ElementRef },
             { type: core.ChangeDetectorRef }
         ]; };
         __decorate([
-            core.ViewChild('fromSlider', { static: false }),
-            __metadata("design:type", core.ElementRef)
-        ], GIPIRangeSliderComponent.prototype, "fromSlider", void 0);
-        __decorate([
-            core.ViewChild('toSlider', { static: false }),
-            __metadata("design:type", core.ElementRef)
-        ], GIPIRangeSliderComponent.prototype, "toSlider", void 0);
+            core.Input(),
+            __metadata("design:type", String)
+        ], GIPITextareaComponent.prototype, "id", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangeSliderComponent.prototype, "id", void 0);
+        ], GIPITextareaComponent.prototype, "name", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangeSliderComponent.prototype, "name", void 0);
+        ], GIPITextareaComponent.prototype, "label", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangeSliderComponent.prototype, "label", void 0);
+        ], GIPITextareaComponent.prototype, "placeholder", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number)
+        ], GIPITextareaComponent.prototype, "cols", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Number)
+        ], GIPITextareaComponent.prototype, "rows", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
-        ], GIPIRangeSliderComponent.prototype, "help", void 0);
+        ], GIPITextareaComponent.prototype, "help", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", Number)
-        ], GIPIRangeSliderComponent.prototype, "min", void 0);
+        ], GIPITextareaComponent.prototype, "maxlength", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", Number)
-        ], GIPIRangeSliderComponent.prototype, "max", void 0);
+        ], GIPITextareaComponent.prototype, "minlength", void 0);
         __decorate([
             core.Input(),
-            __metadata("design:type", Number),
-            __metadata("design:paramtypes", [Number])
-        ], GIPIRangeSliderComponent.prototype, "maxRange", null);
+            __metadata("design:type", String),
+            __metadata("design:paramtypes", [String])
+        ], GIPITextareaComponent.prototype, "resize", null);
         __decorate([
-            core.Input('from'),
-            __metadata("design:type", Number),
-            __metadata("design:paramtypes", [Number])
-        ], GIPIRangeSliderComponent.prototype, "fromValue", null);
+            core.Input(),
+            __metadata("design:type", String),
+            __metadata("design:paramtypes", [String])
+        ], GIPITextareaComponent.prototype, "minHeight", null);
         __decorate([
-            core.Input('to'),
-            __metadata("design:type", Number),
-            __metadata("design:paramtypes", [Number])
-        ], GIPIRangeSliderComponent.prototype, "toValue", null);
+            core.Input(),
+            __metadata("design:type", String),
+            __metadata("design:paramtypes", [String])
+        ], GIPITextareaComponent.prototype, "height", null);
         __decorate([
             core.Input(),
-            __metadata("design:type", Number),
-            __metadata("design:paramtypes", [Number])
-        ], GIPIRangeSliderComponent.prototype, "step", null);
+            __metadata("design:type", String),
+            __metadata("design:paramtypes", [String])
+        ], GIPITextareaComponent.prototype, "maxHeight", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String),
+            __metadata("design:paramtypes", [String])
+        ], GIPITextareaComponent.prototype, "autocomplete", null);
         __decorate([
             core.Input(),
             __metadata("design:type", Boolean),
             __metadata("design:paramtypes", [Boolean])
-        ], GIPIRangeSliderComponent.prototype, "disabled", null);
+        ], GIPITextareaComponent.prototype, "autofocus", null);
         __decorate([
             core.Input(),
             __metadata("design:type", Boolean),
             __metadata("design:paramtypes", [Boolean])
-        ], GIPIRangeSliderComponent.prototype, "required", null);
-        GIPIRangeSliderComponent = GIPIRangeSliderComponent_1 = __decorate([
+        ], GIPITextareaComponent.prototype, "readOnly", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPITextareaComponent.prototype, "required", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPITextareaComponent.prototype, "disabled", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPITextareaComponent.prototype, "lowerCase", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPITextareaComponent.prototype, "upperCase", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean),
+            __metadata("design:paramtypes", [Boolean])
+        ], GIPITextareaComponent.prototype, "spaceDrop", null);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object),
+            __metadata("design:paramtypes", [Object])
+        ], GIPITextareaComponent.prototype, "value", null);
+        GIPITextareaComponent = GIPITextareaComponent_1 = __decorate([
             core.Component({
-                selector: 'gipi-range-slider',
-                exportAs: 'gipiRangeSlider',
-                template: "<label *ngIf=\"label\"\n       class=\"input-label\"\n       [attr.for]=\"id\">\n    {{ label }}\n    <span *ngIf=\"required\"> * </span>\n</label>\n\n<div class=\"slider-wrapper\">\n    <!-- <input type=\"number\"\n           [min]=\"min\"\n           [max]=\"max\"\n           [step]=\"step\"\n           [(ngModel)]=\"fromValue\"\n           (ngModelChange)=\"controlFromInput(true)\"\n           (input)=\"controlFromInput(false)\"\n           (blur)=\"onBlur()\" /> -->\n    <span class=\"value min\">\n        {{ min }}\n    </span>\n    <div class=\"sliders-control\">\n        <input #fromSlider\n               id=\"fromSlider\"\n               type=\"range\"\n               class=\"from-value\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [value]=\"fromValue\"\n               (input)=\"controlFromSlider()\"\n               (mouseup)=\"controlFromSlider()\"\n               (blur)=\"onBlur()\" />\n        <input #toSlider\n               id=\"toSlider\"\n               type=\"range\"\n               class=\"to-value\"\n               [min]=\"min\"\n               [max]=\"max\"\n               [value]=\"toValue\"\n               (input)=\"controlToSlider()\"\n               (mouseup)=\"controlToSlider()\"\n               (blur)=\"onBlur()\" />\n    </div>\n    <span class=\"value max\">\n        {{ max }}\n    </span>\n    <!-- <input type=\"number\"\n           [min]=\"min\"\n           [max]=\"max\"\n           [step]=\"step\"\n           [(ngModel)]=\"toValue\"\n           (ngModelChange)=\"controlToInput(true)\"\n           (input)=\"controlToInput(false)\"\n           (blur)=\"onBlur()\" /> -->\n</div>\n<span class=\"value min\">\n    {{ fromValue }} - {{ toValue }}\n</span>\n<small *ngIf=\"help\"\n       class=\"input-help\">\n    {{ help }}\n</small>",
+                selector: 'gipi-textarea',
+                exportAs: 'gipiTextarea',
+                template: "<label class=\"textarea-label\"\n       *ngIf=\"label\"\n       [attr.for]=\"id\">\n    {{ label }}\n    <span *ngIf=\"required\"> * </span>\n</label>\n\n<textarea class=\"textarea-element\"\n          [attr.id]=\"id\"\n          [attr.name]=\"name\"\n          [placeholder]=\"placeholder\"\n          [cols]=\"cols\"\n          [rows]=\"rows\"\n          [class.resize-none]=\"resize === 'none'\"\n          [class.resize-both]=\"resize === 'both'\"\n          [class.resize-horizontal]=\"resize === 'horizontal'\"\n          [class.resize-vertical]=\"resize === 'vertical'\"\n          [style.min-height.px]=\"minHeight\"\n          [style.height.px]=\"height\"\n          [style.max-height.px]=\"maxHeight\"\n          [minlength]=\"minlength\"\n          [maxlength]=\"maxlength\"\n          [disabled]=\"disabled\"\n          [required]=\"required\"\n          [readOnly]=\"readOnly\"\n          [attr.autocomplete]=\"autocomplete\"\n          [autofocus]=\"autofocus\"\n          [(ngModel)]=\"value\"\n          [value]=\"value\">\n    </textarea>\n\n<small *ngIf=\"help\"\n       class=\"textarea-help\">\n    {{ help }}\n</small>",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
-                        useExisting: core.forwardRef(function () { return GIPIRangeSliderComponent_1; }),
+                        useExisting: core.forwardRef(function () { return GIPITextareaComponent_1; }),
                         multi: true
-                    },
+                    }
                 ],
                 host: {
-                    'class': 'gipi-range-slider',
+                    'class': 'gipi-textarea',
                 },
                 changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{display:flex;flex-direction:column;gap:.8rem;font-size:1.4rem;color:#696969}:host .input-label{display:flex;align-items:center;gap:.4rem;color:#131313;line-height:1.6rem}:host .input-label>span{font-size:1.6rem;line-height:1.6rem;color:#d14014}:host .slider-wrapper{display:flex;align-items:center;justify-content:space-between;gap:1.6rem}:host .slider-wrapper>input{display:flex;font-family:inherit;font-size:inherit;color:inherit;text-align:center;padding:.75rem .8rem;background:#fff;border:1px solid rgba(0,0,0,.12);transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.6rem;outline:0}:host .sliders-control{display:flex;align-items:center;justify-content:center;padding:2rem;position:relative;flex:1}:host .from-value,:host .to-value{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:.6rem;border-radius:.4rem;width:100%;position:absolute;background-color:#e0e1e2;pointer-events:none;outline:0}:host .from-value::-webkit-slider-thumb,:host .to-value::-webkit-slider-thumb{-webkit-appearance:none;display:block;width:1.4rem;height:1.4rem;border-radius:50%;background-color:#e0313e;pointer-events:all;box-shadow:0 .5px 0 0 rgba(0,0,0,.08),0 1px 1px 0 rgba(0,0,0,.14);cursor:-webkit-grab;cursor:grab;outline:0}:host .from-value::-webkit-slider-thumb:hover,:host .to-value::-webkit-slider-thumb:hover{background-color:#cc2d38}:host .from-value::-webkit-slider-thumb:active,:host .to-value::-webkit-slider-thumb:active{box-shadow:inset 0 0 3px #e0313e,0 0 9px #e0313e;-webkit-box-shadow:inset 0 0 3px #e0313e,0 0 9px #e0313e;cursor:-webkit-grabbing;cursor:grabbing}:host input[type=number]{border:1px solid rgba(0,0,0,.12);color:#131313;width:50px;height:30px;font-size:20px;outline:0}:host input[type=number]::-webkit-inner-spin-button,:host input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;opacity:0}:host #fromSlider{height:0;z-index:1}"]
+                styles: [":host{display:flex;flex-direction:column;gap:.8rem;font-size:1.4rem;color:#696969}:host .textarea-label{display:flex;align-items:center;gap:.4rem;color:#131313;line-height:1.6rem}:host .textarea-label>span{font-size:1.6rem;line-height:1.6rem;color:#d14014}:host .textarea-element{display:flex;font-family:inherit;font-size:inherit;color:inherit;padding:.75rem .8rem;background:#fff;border:1px solid rgba(0,0,0,.12);transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:6px;caret-color:#696969;max-height:12rem;min-height:6rem;resize:vertical;outline:0;overflow:auto}:host .textarea-element:not(:disabled):hover{border-color:#6d6f73}:host .textarea-element:not(:disabled).ng-dirty.ng-invalid:enabled:hover,:host .textarea-element:not(:disabled):invalid:enabled:hover{border-color:#e07f62}:host .textarea-element:not(:disabled):enabled:focus{outline:0;outline-offset:0;box-shadow:0 0 0 .2rem #e0e1e2;border-color:#6d6f73}:host .textarea-element:not(:disabled).ng-dirty.ng-invalid:enabled,:host .textarea-element:not(:disabled):invalid:enabled{border-color:#d14014}:host .textarea-element:not(:disabled).ng-dirty.ng-invalid:enabled:focus,:host .textarea-element:not(:disabled):invalid:enabled:focus{outline:0;outline-offset:0;box-shadow:0 0 0 .2rem #f1c4b6;border-color:#d14014}:host .textarea-element:disabled{color:#bbbdc1!important;border-color:#e0e1e2!important;background-color:#f5f5f6!important;cursor:not-allowed}:host .textarea-element.resize-none{resize:none}:host .textarea-element.resize-both{resize:both}:host .textarea-element.resize-horizontal{resize:horizontal}:host .textarea-element.resize-vertical{resize:vertical}:host .textarea-help{flex:1;font-size:1rem;font-weight:500;margin-top:-.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::-webkit-input-placeholder{color:#bbbdc1}:-moz-placeholder{color:#bbbdc1}::-moz-placeholder{color:#bbbdc1}:-ms-input-placeholder{color:#bbbdc1}"]
             }),
             __metadata("design:paramtypes", [core.ElementRef,
                 core.ChangeDetectorRef])
-        ], GIPIRangeSliderComponent);
-        return GIPIRangeSliderComponent;
+        ], GIPITextareaComponent);
+        return GIPITextareaComponent;
     }());
 
 
@@ -24507,6 +25438,14 @@
         GIPIBadgeComponent,
         GIPIRangeSliderComponent,
         GIPIRangePageComponent,
+        GIPISlideToggleComponent,
+        GIPIEmptyStateComponent,
+        GIPICardComponent,
+        GIPITextareaComponent,
+        GIPISplitButtonComponent,
+        // Tabs
+        GIPITabGroupComponent,
+        GIPITabComponent,
         // Table
         GIPITableHeaderComponent,
         GIPITableBodyComponent,
@@ -24522,6 +25461,7 @@
         GIPIFileDragAndDropDirective,
         GIPIInfiniteScrollDirective,
         GIPIPaginationControlsDirective,
+        GIPIDynamicTabDirective,
     ];
     var GIPIPipes = [
         GIPIPaginatePipe,
@@ -24569,9 +25509,6 @@
                     RadioGroupEntityComponent,
                     RadioGroupEnumComponent,
                     SlideToggleComponent,
-                    TabGroupComponent,
-                    TabComponent,
-                    DynamicTabDirective,
                     IconComponent,
                     StepperComponent,
                     TextareaComponent,
@@ -24584,7 +25521,6 @@
                     SpaceDropDirective,
                     OverlayPanelComponent,
                     ItssTemplate,
-                    SelectButtonComponent,
                     SelectMonthPeriodComponent,
                     InputSelectInfiniteScrollDirective,
                     TableScrolledComponent,
@@ -24636,8 +25572,6 @@
                     RadioGroupEntityComponent,
                     RadioGroupEnumComponent,
                     SlideToggleComponent,
-                    TabGroupComponent,
-                    TabComponent,
                     IconComponent,
                     StepperComponent,
                     TextareaComponent,
@@ -24647,7 +25581,6 @@
                     angularMentions.MentionModule,
                     OverlayPanelComponent,
                     ItssTemplate,
-                    SelectButtonComponent,
                     SelectMonthPeriodComponent,
                     InputSelectInfiniteScrollDirective,
                     TableScrolledComponent,
@@ -24662,8 +25595,8 @@
                 ],
                 entryComponents: [
                     GIPIConfirmationDialogComponent,
-                    TabGroupComponent,
-                    TabComponent,
+                    GIPITabGroupComponent,
+                    GIPITabComponent,
                     PopoverComponent,
                 ],
                 providers: [
@@ -25534,33 +26467,27 @@
             return this.baseService.httpClient.post(this.url('find-all', version), filter, this.options()).pipe(operators.map(this.handleMapper), operators.takeUntil(this.handleDestroy), operators.catchError(this.handleError));
         };
         GIPIAbstractCrudService.prototype.findAllEnabled = function (page, size, version) {
-            if ((!page) || (page && (page < 0))) {
-                page = 0;
-            }
-            if ((!size) || (size && (size <= 0))) {
-                size = 10;
-            }
-            return this.baseService.httpClient.get(this.url("find-all-enabled?page=" + page + "&size=" + size, version), this.options()).pipe(operators.map(this.handleMapper), operators.takeUntil(this.handleDestroy), operators.catchError(this.handleError));
+            var validatedPage = Math.max(page, 0);
+            var validatedSize = Math.max(size, 10);
+            var params = new URLSearchParams();
+            params.set('page', validatedPage.toString());
+            params.set('size', validatedSize.toString());
+            var queryString = !StringUtil.isEmpty(params.toString()) ? "?" + params.toString() : '';
+            return this.baseService.httpClient.get(this.url("find-all-enabled" + queryString, version), this.options()).pipe(operators.map(this.handleMapper), operators.takeUntil(this.handleDestroy), operators.catchError(this.handleError));
         };
         GIPIAbstractCrudService.prototype.findByValue = function (value, page, size, sort, version) {
-            var lValue = value;
-            if (value) {
-                lValue = StringUtil.removeAccents(value).trim();
-            }
-            else {
-                lValue = '';
-            }
-            if ((!page) || (page && (page < 0))) {
-                page = 0;
-            }
-            if ((!size) || (size && (size <= 0))) {
-                size = 10;
-            }
-            var lSort = '';
+            var formattedValue = !StringUtil.isEmpty(value) ? value.trim() : '';
+            var validatedPage = Math.max(page, 0);
+            var validatedSize = Math.max(size, 10);
+            var params = new URLSearchParams();
+            params.set('value', formattedValue);
+            params.set('page', validatedPage.toString());
+            params.set('size', validatedSize.toString());
             if (!ObjectUtil.isNull(sort) && !StringUtil.isEmpty(sort.field)) {
-                lSort = "&sort=" + sort.field + "," + sort.direction;
+                params.set('sort', sort.field + "," + sort.direction);
             }
-            return this.baseService.httpClient.get(this.url("find-by-value?page=" + page + "&size=" + size + lSort + "&value=" + lValue, version), this.options()).pipe(operators.map(this.handleMapper), operators.takeUntil(this.handleDestroy), operators.catchError(this.handleError));
+            var queryString = !StringUtil.isEmpty(params.toString()) ? "?" + params.toString() : '';
+            return this.baseService.httpClient.get(this.url("find-by-value" + queryString, version), this.options()).pipe(operators.map(this.handleMapper), operators.takeUntil(this.handleDestroy), operators.catchError(this.handleError));
         };
         /**
          * Refers to the enable-or-disable endpoint
@@ -26853,6 +27780,18 @@
         return MenuDTO;
     }(AbstractDTO));
 
+    var TabDTO = /** @class */ (function (_super) {
+        __extends(TabDTO, _super);
+        function TabDTO() {
+            var _this = _super !== null && _super.apply(this, arguments) || this;
+            _this.active = false;
+            _this.closeable = false;
+            _this.disabled = false;
+            return _this;
+        }
+        return TabDTO;
+    }(AbstractDTO));
+
     var TableColumnDTO = /** @class */ (function (_super) {
         __extends(TableColumnDTO, _super);
         function TableColumnDTO(name, property, value, sortable, hiddenSm, visible, width, marginLeft, marginRight, align, template, templateHeader, sliceLength, action) {
@@ -27285,137 +28224,6 @@
         return EmailUtil;
     }());
 
-    /** @dynamic */
-    var PhoneUtil = /** @class */ (function () {
-        function PhoneUtil() {
-        }
-        PhoneUtil.removeCharacters = function (value) {
-            if (StringUtil.isEmpty(value)) {
-                return '';
-            }
-            return value.replace(/\D/g, '');
-        };
-        PhoneUtil.maskLib = function (phoneNumber, state, country) {
-            if (country === void 0) { country = 'BR'; }
-            var exampleNumber;
-            if (!StringUtil.isEmpty(phoneNumber)) {
-                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
-                if (parsedNumber) {
-                    exampleNumber = parsedNumber;
-                }
-            }
-            else {
-                exampleNumber = libphonenumberJs.getExampleNumber(country, state);
-            }
-            if (exampleNumber) {
-                var formattedNumber = exampleNumber.formatNational();
-                return formattedNumber.replace(/\d/g, '0');
-            }
-            else {
-                throw new Error('Estado não suportado ou código de estado inválido.');
-            }
-        };
-        PhoneUtil.formatLib = function (phoneNumber, country) {
-            if (country === void 0) { country = 'BR'; }
-            try {
-                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
-                if (parsedNumber) {
-                    return parsedNumber.formatNational();
-                }
-                else {
-                    throw new Error('Número de telefone inválido.');
-                }
-            }
-            catch (error) {
-                throw new Error('Erro ao formatar o número de telefone: ' + error.message);
-            }
-        };
-        PhoneUtil.format = function (number, mask) {
-            var numberNotFormatted = NumberUtil.onlyNumbers(number);
-            var phoneFormatted = '';
-            if ((numberNotFormatted.length < 8) ||
-                (numberNotFormatted.length > 12) ||
-                (!this.isPossible(numberNotFormatted) && !this.isValid(numberNotFormatted))) {
-                return numberNotFormatted;
-            }
-            if (StringUtil.isEmpty(mask)) {
-                mask = this.mask(numberNotFormatted);
-            }
-            for (var i = 0, j = 0; i < mask.length && j < numberNotFormatted.length; i++) {
-                phoneFormatted += mask.charAt(i) === '0' ? numberNotFormatted.charAt(j++) : mask.charAt(i);
-            }
-            return phoneFormatted;
-        };
-        PhoneUtil.mask = function (phone) {
-            var specialPrefixes = ['0900', '0800', '0700', '0600', '0500', '0400', '0300', '0200', '0100'];
-            var phoneAux = this.removeCharacters(phone.replace(/\D/g, ''));
-            if ((phoneAux.length < 8) ||
-                (phoneAux.length > 12) ||
-                (!this.isPossible(phoneAux) && !this.isValid(phoneAux))) {
-                return '0*';
-            }
-            var existInArray = specialPrefixes.some(function (prefix) { return phoneAux.startsWith(prefix); });
-            if (existInArray) {
-                return '0000 000 0000'; // Para números especiais como 0800
-            }
-            switch (phoneAux.length) {
-                case 8: return '0000-0000';
-                case 9: return '0 0000-0000';
-                case 10: return '(00) 0000-0000';
-                case 11: return '(00) 0 0000-0000';
-                case 12: return '(000) 0 0000-0000';
-                default: return '0*';
-            }
-        };
-        PhoneUtil.isPossible = function (phoneNumber, country) {
-            if (country === void 0) { country = 'BR'; }
-            try {
-                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
-                return parsedNumber ? parsedNumber.isPossible() : false;
-            }
-            catch (error) {
-                return false;
-            }
-        };
-        PhoneUtil.isValid = function (phoneNumber, country) {
-            if (country === void 0) { country = 'BR'; }
-            try {
-                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
-                return parsedNumber ? parsedNumber.isValid() : false;
-            }
-            catch (error) {
-                return false;
-            }
-        };
-        PhoneUtil.getType = function (phoneNumber, country) {
-            if (country === void 0) { country = 'BR'; }
-            try {
-                var parsedNumber = libphonenumberJs.parsePhoneNumberFromString(phoneNumber, country);
-                return parsedNumber ? parsedNumber.getType() : null;
-            }
-            catch (error) {
-                return null;
-            }
-        };
-        PhoneUtil.isEqual = function (phoneNumber1, phoneNumber2, country) {
-            if (country === void 0) { country = 'BR'; }
-            try {
-                var parsedNumber1 = libphonenumberJs.parsePhoneNumberFromString(phoneNumber1, country);
-                var parsedNumber2 = libphonenumberJs.parsePhoneNumberFromString(phoneNumber2, country);
-                if (parsedNumber1 && parsedNumber2) {
-                    return parsedNumber1.isEqual(parsedNumber2);
-                }
-                else {
-                    return false;
-                }
-            }
-            catch (error) {
-                return false;
-            }
-        };
-        return PhoneUtil;
-    }());
-
     /** @dynamic */
     var TableColumnBuilder = /** @class */ (function () {
         function TableColumnBuilder(breakpointObserverService) {
@@ -28155,7 +28963,6 @@
     exports.DialogDTO = DialogDTO;
     exports.DialogService = DialogService;
     exports.DocumentUtil = DocumentUtil;
-    exports.DynamicTabDirective = DynamicTabDirective;
     exports.EmailUtil = EmailUtil;
     exports.ErrorInterceptor = ErrorInterceptor;
     exports.FilterDTO = FilterDTO;
@@ -28175,11 +28982,14 @@
     exports.GIPIBaseService = GIPIBaseService;
     exports.GIPIBreakpointService = GIPIBreakpointService;
     exports.GIPIButtonComponent = GIPIButtonComponent;
+    exports.GIPICardComponent = GIPICardComponent;
     exports.GIPIColDirective = GIPIColDirective;
     exports.GIPIConfirmationDialogComponent = GIPIConfirmationDialogComponent;
     exports.GIPIConnectedOverlayScrollHandler = GIPIConnectedOverlayScrollHandler;
     exports.GIPIDomHandler = GIPIDomHandler;
     exports.GIPIDropdownMenuComponent = GIPIDropdownMenuComponent;
+    exports.GIPIDynamicTabDirective = GIPIDynamicTabDirective;
+    exports.GIPIEmptyStateComponent = GIPIEmptyStateComponent;
     exports.GIPIExpansionPanelComponent = GIPIExpansionPanelComponent;
     exports.GIPIFileDragAndDropComponent = GIPIFileDragAndDropComponent;
     exports.GIPIFileService = GIPIFileService;
@@ -28219,8 +29029,12 @@
     exports.GIPISessionStorageService = GIPISessionStorageService;
     exports.GIPISidenavComponent = GIPISidenavComponent;
     exports.GIPISidenavContainerComponent = GIPISidenavContainerComponent;
+    exports.GIPISlideToggleComponent = GIPISlideToggleComponent;
     exports.GIPISortModel = GIPISortModel;
+    exports.GIPISplitButtonComponent = GIPISplitButtonComponent;
     exports.GIPIStepperComponent = GIPIStepperComponent;
+    exports.GIPITabComponent = GIPITabComponent;
+    exports.GIPITabGroupComponent = GIPITabGroupComponent;
     exports.GIPITableBodyComponent = GIPITableBodyComponent;
     exports.GIPITableComponent = GIPITableComponent;
     exports.GIPITableFooterComponent = GIPITableFooterComponent;
@@ -28228,6 +29042,7 @@
     exports.GIPITablePaginationComponent = GIPITablePaginationComponent;
     exports.GIPITableProgressBarComponent = GIPITableProgressBarComponent;
     exports.GIPITemplateDirective = GIPITemplateDirective;
+    exports.GIPITextareaComponent = GIPITextareaComponent;
     exports.GIPIToolbarComponent = GIPIToolbarComponent;
     exports.GIPITopNavComponent = GIPITopNavComponent;
     exports.GIPIUserProfileComponent = GIPIUserProfileComponent;
@@ -28314,7 +29129,6 @@
     exports.RangePage = RangePage;
     exports.Role = Role;
     exports.SelectButtonAddComponent = SelectButtonAddComponent;
-    exports.SelectButtonComponent = SelectButtonComponent;
     exports.SelectButtonNextBatchComponent = SelectButtonNextBatchComponent;
     exports.SelectEntityComponent = SelectEntityComponent;
     exports.SelectEntityPagedComponent = SelectEntityPagedComponent;
@@ -28330,9 +29144,8 @@
     exports.StepperComponent = StepperComponent;
     exports.StringUtil = StringUtil;
     exports.SvgRegisterService = SvgRegisterService;
-    exports.TabComponent = TabComponent;
     exports.TabDTO = TabDTO;
-    exports.TabGroupComponent = TabGroupComponent;
+    exports.TabModel = TabModel;
     exports.TableColumnBuilder = TableColumnBuilder;
     exports.TableColumnBuilderModel = TableColumnBuilderModel;
     exports.TableColumnDTO = TableColumnDTO;