@dev-tcloud/tcloud-ui 0.0.0

package/fesm2020/dev-tcloud-tcloud-ui.mjs

@@ -0,0 +1,792 @@
+import * as i0 from '@angular/core';
+import { Injectable, EventEmitter, Component, Input, Output, ViewChild, NgModule } from '@angular/core';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i3 from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { Subject } from 'rxjs';
+import { trigger, state, style, transition, animate } from '@angular/animations';
+import * as i1 from '@angular/router';
+import { RouterModule } from '@angular/router';
+
+class TcloudModalService {
+    constructor() {
+        this.param_confirm = {};
+        this._stateClose = new Subject();
+        this.stateClose$ = this._stateClose.asObservable();
+        this._stateConfirm = new Subject();
+        this.stateConfirm$ = this._stateConfirm.asObservable();
+        this._stateRespConfirm = new Subject();
+        this.stateRespConfirm$ = this._stateRespConfirm.asObservable();
+        this._stateLoading = new Subject();
+        this.stateLoading$ = this._stateLoading.asObservable();
+    }
+    toModal(action) {
+        this._stateClose.next((action === 'open'));
+    }
+    toRespConfirm(resp) {
+        this._stateRespConfirm.next(resp);
+    }
+    getParamConfirm() {
+        return this.param_confirm;
+    }
+    toConfirm(confirm) {
+        this.param_confirm = confirm;
+        this._stateConfirm.next(confirm);
+    }
+    getLoading() {
+        return this.loading;
+    }
+    setLoading(loading) {
+        this.loading = loading;
+        this._stateLoading.next(loading);
+    }
+}
+TcloudModalService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+TcloudModalService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudModalService, decorators: [{
+            type: Injectable
+        }] });
+
+class TcloudUiModalComponent {
+    constructor(tcloudModalService) {
+        this.tcloudModalService = tcloudModalService;
+        this.param_confirm = {};
+        /* BEGIN - Parametros para modo confirmacao */
+        this._confirm = false;
+        this._confirmText = 'Confirmo';
+        this.autoClose = true;
+        this.maxWidth = 500;
+        // psg
+        this._open = false;
+        this._loading = false;
+        this.openChange = new EventEmitter();
+        this.toConfirm = new EventEmitter();
+        this.toCancel = new EventEmitter();
+        this.toAction = new EventEmitter();
+    }
+    set confirm(v) {
+        this._confirm = v;
+        this.param_confirm.confirm = this._confirm;
+        this.param_confirm.confirmText = this._confirmText;
+    }
+    set confirmText(v) {
+        this._confirmText = v;
+        this.param_confirm.confirmText = this._confirmText;
+        this.param_confirm.confirm = this._confirm;
+    }
+    set window(size) {
+        switch (size) {
+            case 'small':
+                this.maxWidth = 300;
+                break;
+            case 'medium':
+                this.maxWidth = 500;
+                break;
+            case 'large':
+                this.maxWidth = 900;
+                break;
+            case 'big':
+                this.maxWidth = 1100;
+                break;
+            case 'full':
+                this.maxWidth = 1400;
+                break;
+        }
+    }
+    set open(open) {
+        this._open = open;
+        this.fixed_body((open) ? 'on' : 'off');
+    }
+    get open() { return this._open; }
+    set loading(loading) {
+        this._loading = loading;
+        this.tcloudModalService.setLoading(loading);
+    }
+    get loading() { return this._loading; }
+    ngOnInit() {
+        this.subscription = this.tcloudModalService.stateClose$.subscribe((open) => {
+            if (open) {
+                /* OPEN */
+            }
+            if (!open) {
+                /* CLOSE */
+                this.toClose();
+            }
+        });
+        this.subscriptionI = this.tcloudModalService.stateRespConfirm$.subscribe((resp) => {
+            if (resp) {
+                /* CONFIRMADO */
+                this.toConfirm.emit(resp);
+                this.toClose('confirmed');
+            }
+            if (!resp) {
+                /* CANCELADO */
+                this.toCancel.emit(resp);
+                this.toClose('cancel');
+            }
+        });
+        this.tcloudModalService.toConfirm(this.param_confirm);
+    }
+    toClose(action) {
+        if (this.autoClose) {
+            this.open = false;
+            this.openChange.emit(false);
+        }
+        action = (action) ? action : 'close';
+        this.toAction.emit(action);
+        this.fixed_body('off');
+    }
+    checkIsOpen() {
+        if (this.open) {
+            this.fixed_body('on');
+        }
+        else {
+            this.fixed_body('off');
+        }
+    }
+    fixed_body(fixed) {
+        let body = document.getElementsByTagName("BODY")[0];
+        if (body && body.style) {
+            if (fixed === 'on') {
+                body.style.overflowY = "hidden";
+            }
+            if (fixed === 'off') {
+                body.style.removeProperty('overflow-y');
+            }
+        }
+    }
+    ngOnDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+}
+TcloudUiModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
+TcloudUiModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalComponent, selector: "tcloud-ui-modal", inputs: { confirm: "confirm", confirmText: "confirmText", autoClose: "autoClose", title: "title", maxWidth: "maxWidth", window: "window", open: "open", loading: "loading" }, outputs: { openChange: "openChange", toConfirm: "toConfirm", toCancel: "toCancel", toAction: "toAction" }, providers: [
+        TcloudModalService
+    ], ngImport: i0, template: "<div class=\"tc-background-modal\" *ngIf=\"open\" >{{ checkIsOpen() }}</div>\r\n\r\n<div class=\"base-modal\" *ngIf=\"open\">\r\n  <div class=\"sub-modal\" [@fade]=\"'visible'\">\r\n    <div class=\"tc-modal tc-modal-shadow\" [attr.style]=\"'max-width: ' + maxWidth + 'px;'\">\r\n      <div class=\"area-top-actions\">\r\n        <button type=\"button\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\r\n          <i *ngIf=\"!loading\" class=\"fas fa-times\"></i>\r\n          <i *ngIf=\"loading\" class=\"fas fa-spinner fa-spin\"></i>\r\n        </button>\r\n      </div>\r\n\r\n      <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n\r\n      <ng-content></ng-content>\r\n\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- Ex: Modal -->\r\n<!-- \r\n  <tcloud-ui-modal [(open)]=\"open\">\r\n\r\n    <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\r\n\r\n    <tcloud-ui-modal-body>\r\n      Conte\u00FAdo do modal aqui\r\n    </tcloud-ui-modal-body>\r\n\r\n    <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n  </tcloud-ui-modal>\r\n\r\n  <button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\r\n-->\r\n\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n\r\n<!-- Ex: Confirm Modal -->\r\n<!-- \r\n  <tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\r\n\r\n    <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\r\n\r\n    <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n  </tcloud-ui-modal>\r\n\r\n  <button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\r\n-->", styles: [".tc-background-modal{border:1px solid #ccc;position:fixed;width:100%;left:0;top:0;background-color:#000;z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0}.sub-modal{padding:30px;position:absolute;width:100%}.tc-modal{position:relative;background-color:#fff;padding:12px;border-radius:8px;margin:auto;width:100%}.tc-modal-shadow{box-shadow:2px 2px 10px #0000005e}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions button{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:#999!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
+        trigger('fade', [
+            state('visible', style({ opacity: 1 })),
+            state('hide', style({ opacity: 0, top: '-38%' })),
+            transition('void => visible', [
+                style({ opacity: 0, top: '-38%' }),
+                animate('0.3s ease-out')
+            ]),
+            transition('visible => hide', animate('0.3s ease-out'))
+        ])
+    ] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-modal', providers: [
+                        TcloudModalService
+                    ], animations: [
+                        trigger('fade', [
+                            state('visible', style({ opacity: 1 })),
+                            state('hide', style({ opacity: 0, top: '-38%' })),
+                            transition('void => visible', [
+                                style({ opacity: 0, top: '-38%' }),
+                                animate('0.3s ease-out')
+                            ]),
+                            transition('visible => hide', animate('0.3s ease-out'))
+                        ])
+                    ], template: "<div class=\"tc-background-modal\" *ngIf=\"open\" >{{ checkIsOpen() }}</div>\r\n\r\n<div class=\"base-modal\" *ngIf=\"open\">\r\n  <div class=\"sub-modal\" [@fade]=\"'visible'\">\r\n    <div class=\"tc-modal tc-modal-shadow\" [attr.style]=\"'max-width: ' + maxWidth + 'px;'\">\r\n      <div class=\"area-top-actions\">\r\n        <button type=\"button\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\r\n          <i *ngIf=\"!loading\" class=\"fas fa-times\"></i>\r\n          <i *ngIf=\"loading\" class=\"fas fa-spinner fa-spin\"></i>\r\n        </button>\r\n      </div>\r\n\r\n      <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n\r\n      <ng-content></ng-content>\r\n\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- Ex: Modal -->\r\n<!-- \r\n  <tcloud-ui-modal [(open)]=\"open\">\r\n\r\n    <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\r\n\r\n    <tcloud-ui-modal-body>\r\n      Conte\u00FAdo do modal aqui\r\n    </tcloud-ui-modal-body>\r\n\r\n    <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n  </tcloud-ui-modal>\r\n\r\n  <button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\r\n-->\r\n\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n<!-- ****** -->\r\n\r\n<!-- Ex: Confirm Modal -->\r\n<!-- \r\n  <tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\r\n\r\n    <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\r\n\r\n    <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\r\n\r\n  </tcloud-ui-modal>\r\n\r\n  <button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\r\n-->", styles: [".tc-background-modal{border:1px solid #ccc;position:fixed;width:100%;left:0;top:0;background-color:#000;z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0}.sub-modal{padding:30px;position:absolute;width:100%}.tc-modal{position:relative;background-color:#fff;padding:12px;border-radius:8px;margin:auto;width:100%}.tc-modal-shadow{box-shadow:2px 2px 10px #0000005e}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions button{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:#999!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { confirm: [{
+                type: Input
+            }], confirmText: [{
+                type: Input
+            }], autoClose: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], maxWidth: [{
+                type: Input
+            }], window: [{
+                type: Input
+            }], open: [{
+                type: Input
+            }], loading: [{
+                type: Input
+            }], openChange: [{
+                type: Output
+            }], toConfirm: [{
+                type: Output
+            }], toCancel: [{
+                type: Output
+            }], toAction: [{
+                type: Output
+            }] } });
+
+class TcloudUiModalHeaderComponent {
+    constructor() {
+        this.mode = 'info';
+    }
+    ngOnInit() {
+    }
+}
+TcloudUiModalHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TcloudUiModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalHeaderComponent, selector: "tcloud-ui-modal-header", inputs: { mode: "mode", title: "title" }, ngImport: i0, template: "<div class=\"tc-modal-header tc-mode-{{ mode }}\" >\r\n  <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n  <ng-content></ng-content>\r\n\r\n  <hr>\r\n</div>\r\n", styles: ["h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.tc-modal-header{padding:12px;color:#fff;margin:-12px -12px 15px;border-radius:7px 7px 0 0}hr{display:none}.tc-mode-success{background:#62c46d}.tc-mode-info{background:var(--verde)}.tc-mode-danger{background:#f06868}.tc-mode-warning{background:#e8b02e}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-modal-header', template: "<div class=\"tc-modal-header tc-mode-{{ mode }}\" >\r\n  <h4 *ngIf=\"title\" [innerHTML]=\"title\"></h4>\r\n  <ng-content></ng-content>\r\n\r\n  <hr>\r\n</div>\r\n", styles: ["h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.tc-modal-header{padding:12px;color:#fff;margin:-12px -12px 15px;border-radius:7px 7px 0 0}hr{display:none}.tc-mode-success{background:#62c46d}.tc-mode-info{background:var(--verde)}.tc-mode-danger{background:#f06868}.tc-mode-warning{background:#e8b02e}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { mode: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }] } });
+
+class TcloudUiModalBodyComponent {
+    constructor() { }
+    ngOnInit() {
+    }
+}
+TcloudUiModalBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TcloudUiModalBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalBodyComponent, selector: "tcloud-ui-modal-body", ngImport: i0, template: "<div class=\"tc-modal-body\">\r\n  <ng-content></ng-content>\r\n</div>", styles: [".tc-modal-body{padding:13px}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalBodyComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-modal-body', template: "<div class=\"tc-modal-body\">\r\n  <ng-content></ng-content>\r\n</div>", styles: [".tc-modal-body{padding:13px}\n"] }]
+        }], ctorParameters: function () { return []; } });
+
+class TcloudUiModalFooterComponent {
+    constructor(tcloudModalService) {
+        this.tcloudModalService = tcloudModalService;
+        this.btnCloseText = 'Fechar';
+        this.btnCancelText = 'Cancelar';
+        this.btnConfirmText = 'Confirmar';
+        this.txt_value = '';
+        this.param_confirm = {};
+        this.loading = false;
+    }
+    ngOnInit() {
+        this.txt_value = '';
+        this.param_confirm = this.tcloudModalService.getParamConfirm();
+        this.toStateLoading();
+    }
+    toClose() {
+        this.tcloudModalService.toModal('close');
+    }
+    toConfirm(valid) {
+        if (typeof valid === 'boolean') {
+            if (valid && (this.txt_value).toLowerCase() === (this.param_confirm.confirmText).toLowerCase()) {
+                this.tcloudModalService.toRespConfirm(true);
+                this.txt_value = '';
+            }
+        }
+    }
+    toCancel() {
+        this.tcloudModalService.toRespConfirm(false);
+    }
+    toStateLoading() {
+        this.loading = this.tcloudModalService.getLoading();
+        this.subscription = this.tcloudModalService.stateLoading$.subscribe((loading) => { this.loading = loading; });
+    }
+    ngOnDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+}
+TcloudUiModalFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalFooterComponent, deps: [{ token: TcloudModalService }], target: i0.ɵɵFactoryTarget.Component });
+TcloudUiModalFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TcloudUiModalFooterComponent, selector: "tcloud-ui-modal-footer", inputs: { btnCloseText: "btnCloseText", btnCancelText: "btnCancelText", btnConfirmText: "btnConfirmText" }, viewQueries: [{ propertyName: "_formulario", first: true, predicate: ["_formulario"], descendants: true }], ngImport: i0, template: "<div class=\"tc-modal-footer\">\r\n\r\n  <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n    <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n    \r\n    <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n      <input \r\n        [disabled]=\"loading\"\r\n        placeholder=\"{{ param_confirm.confirmText }}\"\r\n        name=\"txt_value\" \r\n        [(ngModel)]=\"txt_value\" \r\n        type=\"text\" \r\n        class=\"form-control form-confirm\" \r\n        required \r\n        [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n    </form>\r\n\r\n  </div>\r\n\r\n  <hr>\r\n\r\n  <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n    <!-- {{ param_confirm | json }} -->\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n    <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"ml-3 btn-new-green\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n  </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalFooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-modal-footer', template: "<div class=\"tc-modal-footer\">\r\n\r\n  <div class=\"input-confirm\" *ngIf=\"param_confirm && param_confirm.confirmText\">\r\n    <p>Digite a palavra <strong>&quot;{{ param_confirm.confirmText }}&quot;</strong> para confirmar.</p>\r\n    \r\n    <form #_formulario=\"ngForm\" (ngSubmit)=\"toConfirm(_formulario.valid)\">\r\n      <input \r\n        [disabled]=\"loading\"\r\n        placeholder=\"{{ param_confirm.confirmText }}\"\r\n        name=\"txt_value\" \r\n        [(ngModel)]=\"txt_value\" \r\n        type=\"text\" \r\n        class=\"form-control form-confirm\" \r\n        required \r\n        [class.different-text]=\"(txt_value).length >= (param_confirm.confirmText).length && (txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase()\" >\r\n    </form>\r\n\r\n  </div>\r\n\r\n  <hr>\r\n\r\n  <div class=\"actions-footer {{ (loading) ? 'state-loading' : '' }}\">\r\n    <!-- {{ param_confirm | json }} -->\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && !param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toClose()\">{{ btnCloseText }}</button>\r\n\r\n    <button [disabled]=\"loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"btn-new-grey\" (click)=\"toCancel()\">{{ btnCancelText }}</button>\r\n    <button [disabled]=\"(txt_value).toLowerCase() !== (param_confirm.confirmText).toLowerCase() || loading\" *ngIf=\"param_confirm && param_confirm.confirm\" type=\"button\" class=\"ml-3 btn-new-green\" (click)=\"toConfirm(_formulario?.valid)\">{{ btnConfirmText }}</button>\r\n\r\n  </div>\r\n</div>\r\n", styles: [".actions-footer{text-align:right}.ng-valid.ng-touched.different-text{border-color:#fb9c23}.form-confirm{max-width:200px}button:disabled{opacity:.7!important;cursor:not-allowed}.input-confirm{padding:5px 14px}.state-loading button{cursor:progress!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: TcloudModalService }]; }, propDecorators: { btnCloseText: [{
+                type: Input
+            }], btnCancelText: [{
+                type: Input
+            }], btnConfirmText: [{
+                type: Input
+            }], _formulario: [{
+                type: ViewChild,
+                args: ['_formulario']
+            }] } });
+
+class TcloudUiModalModule {
+}
+TcloudUiModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TcloudUiModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, declarations: [TcloudUiModalComponent,
+        TcloudUiModalHeaderComponent,
+        TcloudUiModalBodyComponent,
+        TcloudUiModalFooterComponent], imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule], exports: [TcloudUiModalComponent,
+        TcloudUiModalHeaderComponent,
+        TcloudUiModalBodyComponent,
+        TcloudUiModalFooterComponent] });
+TcloudUiModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, imports: [CommonModule,
+        FormsModule,
+        ReactiveFormsModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TcloudUiModalModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        TcloudUiModalComponent,
+                        TcloudUiModalHeaderComponent,
+                        TcloudUiModalBodyComponent,
+                        TcloudUiModalFooterComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                        ReactiveFormsModule
+                    ],
+                    exports: [
+                        TcloudUiModalComponent,
+                        TcloudUiModalHeaderComponent,
+                        TcloudUiModalBodyComponent,
+                        TcloudUiModalFooterComponent
+                    ]
+                }]
+        }] });
+
+class TabMenuService {
+    constructor(_route, _router) {
+        this._route = _route;
+        this._router = _router;
+        this.info_tab = [];
+        this.tabSubject = new Subject();
+        this.tabState$ = this.tabSubject.asObservable();
+        this.loadingSubject = new Subject();
+        this.loadingState$ = this.loadingSubject.asObservable();
+    }
+    setTabLoading(loading) {
+        this._loading = loading;
+        this.loadingSubject.next(loading);
+    }
+    getTabLoading() {
+        return this._loading;
+    }
+    setTabState(tab, registerInUrl) {
+        this._tab = tab;
+        if (registerInUrl) {
+            this.set_to_param_url(tab);
+        }
+        this.tabSubject.next(tab);
+    }
+    getTabState() {
+        return this._tab;
+    }
+    setTabDisabled(id, disabled) {
+        let create = true;
+        if (this.info_tab && (this.info_tab).length > 0) {
+            for (let i = 0; i < (this.info_tab).length; i++) {
+                if (this.info_tab[i].id === id) {
+                    this.info_tab[i].disabled = disabled;
+                    create = false;
+                    break;
+                }
+            }
+        }
+        if (create) {
+            (this.info_tab).push({ id: id, disabled: disabled });
+        }
+    }
+    getIsDisabled(id) {
+        if (this.info_tab && (this.info_tab).length > 0) {
+            for (let i = 0; i < (this.info_tab).length; i++) {
+                if (this.info_tab[i].id === id) {
+                    return this.info_tab[i].disabled;
+                }
+            }
+        }
+        return false;
+    }
+    set_to_param_url(tab) {
+        // changes the route without moving from the current view or
+        // triggering a navigation event,
+        this._router.navigate([], {
+            relativeTo: this._route,
+            queryParams: {
+                tab: `${tab}`
+            },
+            queryParamsHandling: 'merge',
+            // preserve the existing query params in the route
+            skipLocationChange: false
+            // do not trigger navigation
+        });
+    }
+}
+TabMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService, deps: [{ token: i1.ActivatedRoute }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Injectable });
+TabMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TabMenuService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i1.Router }]; } });
+
+class TCloudUiTabMenuComponent {
+    constructor(tabMenuService) {
+        this.tabMenuService = tabMenuService;
+        this.registerInUrl = false;
+        this._loading = false;
+        this._active = '';
+        this.onChange = new EventEmitter();
+    }
+    set loading(loading) {
+        this._loading = loading;
+        this.tabMenuService.setTabLoading(this.loading);
+    }
+    get loading() { return this._loading; }
+    set active(active) {
+        this._active = active;
+        if (this.active !== '') {
+            setTimeout(() => {
+                this.tabMenuService.setTabState(this.active, this.registerInUrl);
+            });
+        }
+    }
+    get active() { return this._active; }
+    ngOnInit() {
+        const tab = this.tabMenuService.getTabState();
+        if (tab === this._active) {
+            this.onChange.emit(tab);
+        }
+        this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
+            this.onChange.emit(tab);
+        });
+    }
+    ngOnDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+}
+TCloudUiTabMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
+TCloudUiTabMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabMenuComponent, selector: "tcloud-ui-tab-menu", inputs: { registerInUrl: "registerInUrl", loading: "loading", active: "active" }, outputs: { onChange: "onChange" }, providers: [TabMenuService], ngImport: i0, template: "<div class=\"tc-tab-menu\" [class.loading]=\"loading\" >\r\n  <ng-content></ng-content>\r\n</div>", styles: [".tc-tab-menu{width:100%;overflow-x:hidden}.loading{opacity:.7;cursor:progress!important}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-tab-menu', providers: [TabMenuService], template: "<div class=\"tc-tab-menu\" [class.loading]=\"loading\" >\r\n  <ng-content></ng-content>\r\n</div>", styles: [".tc-tab-menu{width:100%;overflow-x:hidden}.loading{opacity:.7;cursor:progress!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { registerInUrl: [{
+                type: Input
+            }], loading: [{
+                type: Input
+            }], active: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+
+class TCloudUiTabContentComponent {
+    constructor(tabMenuService) {
+        this.tabMenuService = tabMenuService;
+        this.tab = '';
+        this.active = false;
+    }
+    ngOnInit() {
+        const disabled = this.tabMenuService.getIsDisabled(this.tab);
+        const tab = this.tabMenuService.getTabState();
+        this.active = (tab === this.tab && !disabled);
+        this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
+            this.active = (tab === this.tab);
+        });
+    }
+    ngOnDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+    }
+}
+TCloudUiTabContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabContentComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
+TCloudUiTabContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabContentComponent, selector: "tcloud-ui-tab-content", inputs: { tab: "tab" }, ngImport: i0, template: "<div class=\"tc-tabmenu-content\" *ngIf=\"active\">\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".tc-tabmenu-content{margin:20px 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-tab-content', template: "<div class=\"tc-tabmenu-content\" *ngIf=\"active\">\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n", styles: [".tc-tabmenu-content{margin:20px 0}\n"] }]
+        }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
+                type: Input
+            }] } });
+
+class TCloudUiTabTitleComponent {
+    constructor(tabMenuService) {
+        this.tabMenuService = tabMenuService;
+        this.tab = '';
+        this.active = false;
+        this.loading = false;
+        this._disabled = false;
+    }
+    set disabled(disabled) {
+        this._disabled = disabled;
+        this.tabMenuService.setTabDisabled(this.tab, this._disabled);
+    }
+    get disabled() { return this._disabled; }
+    ngOnInit() {
+        if (!this.disabled) {
+            const tab = this.tabMenuService.getTabState();
+            if (this.tab !== '') {
+                this.active = (tab === this.tab);
+            }
+        }
+        this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
+            if (this.tab !== '') {
+                this.active = (tab === this.tab);
+            }
+        });
+        this.loading = this.tabMenuService.getTabLoading();
+        this.subscription2 = this.tabMenuService.loadingState$.subscribe((loading) => {
+            this.loading = loading;
+        });
+    }
+    toTab() {
+        if (!this.disabled) {
+            if (this.tab && this.tab !== '') {
+                this.tabMenuService.setTabState(this.tab);
+            }
+        }
+    }
+    ngOnDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+        if (this.subscription2) {
+            this.subscription2.unsubscribe();
+        }
+    }
+}
+TCloudUiTabTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabTitleComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
+TCloudUiTabTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabTitleComponent, selector: "tcloud-ui-tab-title", inputs: { tab: "tab", title: "title", active: "active", disabled: "disabled" }, ngImport: i0, template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-title-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-title\" >\r\n  <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-title{color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title:hover,.tab-title-active{background:var(--verde);color:#fff}@media (max-width: 1580px){.tab-title{font-size:11px;padding:20px 14px}}@media (max-width: 1440px){.tab-title{font-size:10px;padding:20px 13px}}.loading{cursor:progress!important}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabTitleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-tab-title', template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-title-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-title\" >\r\n  <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-title{color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title:hover,.tab-title-active{background:var(--verde);color:#fff}@media (max-width: 1580px){.tab-title{font-size:11px;padding:20px 14px}}@media (max-width: 1440px){.tab-title{font-size:10px;padding:20px 13px}}.loading{cursor:progress!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], active: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }] } });
+
+class TCloudUiTabSubtitleComponent {
+    constructor(tabMenuService) {
+        this.tabMenuService = tabMenuService;
+        this.tab = '';
+        this.active = false;
+        this._disabled = false;
+        this.loading = false;
+    }
+    set disabled(disabled) {
+        this._disabled = disabled;
+        this.tabMenuService.setTabDisabled(this.tab, this._disabled);
+    }
+    get disabled() { return this._disabled; }
+    ngOnInit() {
+        if (!this.disabled) {
+            const tab = this.tabMenuService.getTabState();
+            if (this.tab !== '') {
+                this.active = (tab === this.tab);
+            }
+        }
+        this.subscription = this.tabMenuService.tabState$.subscribe((tab) => {
+            if (this.tab !== '') {
+                this.active = (tab === this.tab);
+            }
+        });
+        this.loading = this.tabMenuService.getTabLoading();
+        this.subscription2 = this.tabMenuService.loadingState$.subscribe((loading) => {
+            this.loading = loading;
+        });
+    }
+    toTab() {
+        if (!this.disabled) {
+            if (this.tab && this.tab !== '') {
+                this.tabMenuService.setTabState(this.tab);
+            }
+        }
+    }
+    ngOnDestroy() {
+        if (this.subscription) {
+            this.subscription.unsubscribe();
+        }
+        if (this.subscription2) {
+            this.subscription2.unsubscribe();
+        }
+    }
+}
+TCloudUiTabSubtitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabSubtitleComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component });
+TCloudUiTabSubtitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabSubtitleComponent, selector: "tcloud-ui-tab-subtitle", inputs: { tab: "tab", active: "active", disabled: "disabled" }, ngImport: i0, template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-subtitle-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-subtitle\" >\r\n  <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-subtitle{cursor:pointer;color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:0;margin:20px 10px}.tab-subtitle-active{color:var(--verde)}.loading{cursor:progress!important}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabSubtitleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-tab-subtitle', template: "<button [class.loading]=\"loading\" [attr.data-id]=\"tab\" [class.tab-subtitle-active]=\"active\" [disabled]=\"disabled || loading\" type=\"button\" (click)=\"toTab()\" class=\"tab-subtitle\" >\r\n  <ng-content></ng-content>\r\n</button>\r\n", styles: [".tab-subtitle{cursor:pointer;color:var(--cinza);border:none;background:none;text-transform:uppercase;font-size:11px;padding:0;margin:20px 10px}.tab-subtitle-active{color:var(--verde)}.loading{cursor:progress!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: TabMenuService }]; }, propDecorators: { tab: [{
+                type: Input
+            }], active: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }] } });
+
+class TCloudUiTabHeadComponent {
+    constructor() {
+        this.ID = '';
+        this.background = true;
+        this.background_color = 'transparent'; // var(--cinza4)
+    }
+    ngOnInit() {
+        if (this.background) {
+            this.background_color = 'var(--cinza4)';
+        }
+        this.ID = this.generateID();
+    }
+    generateID() {
+        return `tc-head-scroll-box-${Math.floor(Math.random() * Math.floor(Math.random() * Date.now()))}`;
+    }
+    to_scroll(action) {
+        this.moveScroll(action, this.width_scroll());
+    }
+    width_scroll() {
+        var ele = document.querySelectorAll(`.${this.ID}`);
+        return ele[0].querySelector("button").offsetWidth;
+    }
+    scrollSuave(old, des, atu, ele) {
+        const _this = this;
+        var easeOutCubic = (t) => { return (--t) * t * t + 1; };
+        atu += 5; // move de 5 em 5 pixel. Aumentando o valor da velocidade
+        var ease = easeOutCubic(atu / 100);
+        var del = des - old;
+        del *= ease;
+        del += old;
+        ele.scrollTo(del, 0);
+        if (atu < 100) {
+            window.requestAnimationFrame(() => {
+                _this.scrollSuave(old, des, atu, ele);
+            });
+        }
+    }
+    moveScroll(action, wid) {
+        var ele = document.querySelectorAll(`.${this.ID}`);
+        var ccs = ele[0];
+        var ccs_s = ccs.scrollLeft;
+        this.scrollSuave(ccs_s, action == 'next' ? wid + ccs_s : ccs_s - wid, 0, ccs);
+    }
+}
+TCloudUiTabHeadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabHeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TCloudUiTabHeadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiTabHeadComponent, selector: "tcloud-ui-tab-head", inputs: { background: "background" }, ngImport: i0, template: "\r\n\r\n<table class=\"area-navigation\">\r\n  <tr>\r\n    <td>\r\n      <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\r\n    </td>\r\n\r\n    <td>\r\n      \r\n    </td>\r\n\r\n    <td>\r\n      <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\r\n    </td>\r\n  </tr>\r\n</table>\r\n\r\n<div class=\"tc-menu {{ ID }}\" [attr.style]=\"'background: ' + background_color + ';'\" >\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;right:6px;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;left:6px;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;border-radius:10px;overflow:hidden;margin-bottom:5px;z-index:1;position:relative}@media (max-width: 1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabHeadComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-tab-head', template: "\r\n\r\n<table class=\"area-navigation\">\r\n  <tr>\r\n    <td>\r\n      <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\r\n    </td>\r\n\r\n    <td>\r\n      \r\n    </td>\r\n\r\n    <td>\r\n      <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\r\n    </td>\r\n  </tr>\r\n</table>\r\n\r\n<div class=\"tc-menu {{ ID }}\" [attr.style]=\"'background: ' + background_color + ';'\" >\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;right:6px;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--verde);cursor:pointer;position:relative;top:15px;left:6px;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;border-radius:10px;overflow:hidden;margin-bottom:5px;z-index:1;position:relative}@media (max-width: 1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { background: [{
+                type: Input
+            }] } });
+
+class TCloudUiTabMenuModule {
+}
+TCloudUiTabMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TCloudUiTabMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, declarations: [TCloudUiTabMenuComponent,
+        TCloudUiTabContentComponent,
+        TCloudUiTabTitleComponent,
+        TCloudUiTabSubtitleComponent,
+        TCloudUiTabHeadComponent], imports: [CommonModule, i1.RouterModule], exports: [TCloudUiTabMenuComponent,
+        TCloudUiTabContentComponent,
+        TCloudUiTabTitleComponent,
+        TCloudUiTabSubtitleComponent,
+        TCloudUiTabHeadComponent] });
+TCloudUiTabMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, imports: [CommonModule,
+        RouterModule.forRoot([])] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiTabMenuModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        TCloudUiTabMenuComponent,
+                        TCloudUiTabContentComponent,
+                        TCloudUiTabTitleComponent,
+                        TCloudUiTabSubtitleComponent,
+                        TCloudUiTabHeadComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        RouterModule.forRoot([]),
+                    ],
+                    exports: [
+                        TCloudUiTabMenuComponent,
+                        TCloudUiTabContentComponent,
+                        TCloudUiTabTitleComponent,
+                        TCloudUiTabSubtitleComponent,
+                        TCloudUiTabHeadComponent
+                    ],
+                }]
+        }] });
+
+class TCloudUiLinhaLogoComponent {
+    constructor() {
+        this.product = '';
+        this.logo_name = '';
+        this.product_name = '';
+        this.alt_product_name = '';
+        this.font_size = '';
+    }
+    ngOnInit() {
+        this.logo_name = this.getLogoName();
+        this.product_name = this.getProductName();
+        this.alt_product_name = (this.product_name).toUpperCase();
+        this.font_size = this.getWidthFontSize();
+    }
+    getProductName() {
+        if (this.product !== '') {
+            let name = this.product;
+            name = (name).replace('_', ' ');
+            name = (name).toLowerCase();
+            return name;
+        }
+        return '';
+    }
+    getLogoName() {
+        if (this.product !== '') {
+            let name = this.product;
+            name = (name).replace('_', '-');
+            name = (name).toLowerCase();
+            return 'logo-linha-' + name;
+        }
+        return '';
+    }
+    getWidthFontSize() {
+        let size = 28;
+        let new_size = size;
+        const count = (this.product_name).length;
+        if (count > 8) {
+            new_size = 28;
+        }
+        if (count > 12) {
+            const p = (size * (5 + (count * 2))) / 100;
+            new_size = (size - p);
+        }
+        if (count > 15) {
+            const p = (size * (10 + (count * 2))) / 100;
+            new_size = (size - p);
+        }
+        return `${new_size}px`;
+    }
+}
+TCloudUiLinhaLogoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TCloudUiLinhaLogoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiLinhaLogoComponent, selector: "tcloud-ui-linha-logo", inputs: { product: "product" }, ngImport: i0, template: "<!-- <div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n  <img class=\"img-logo\" src=\"/assets/img/logo-totvs.svg\" alt=\"{{ alt_product_name }}\">\r\n  <p class=\"text-small\">Linha</p>\r\n  <p class=\"text-product\" [style]=\"'font-size:'+font_size+';'\" >{{ product_name }}</p>\r\n</div> -->\r\n\r\n<div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n  <img class=\"img-logo\" [attr.data-name-image]=\"logo_name\" [attr.src]=\"'/assets/img/'+logo_name+'.svg'\" alt=\"{{ alt_product_name }}\">\r\n</div>", styles: [".logo-product{display:flex;color:var(--cinza);flex-flow:column;width:150px}.logo-product .img-logo{width:100%;margin-bottom:13px}.logo-product .text-small{font-size:13px;margin:0;padding:0;text-align:left}.logo-product .text-product{text-align:left;font-size:22px;font-weight:700;line-height:1;margin:0;padding:0;text-transform:uppercase;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-linha-logo', template: "<!-- <div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n  <img class=\"img-logo\" src=\"/assets/img/logo-totvs.svg\" alt=\"{{ alt_product_name }}\">\r\n  <p class=\"text-small\">Linha</p>\r\n  <p class=\"text-product\" [style]=\"'font-size:'+font_size+';'\" >{{ product_name }}</p>\r\n</div> -->\r\n\r\n<div class=\"logo-product\" *ngIf=\"product !== ''\">\r\n  <img class=\"img-logo\" [attr.data-name-image]=\"logo_name\" [attr.src]=\"'/assets/img/'+logo_name+'.svg'\" alt=\"{{ alt_product_name }}\">\r\n</div>", styles: [".logo-product{display:flex;color:var(--cinza);flex-flow:column;width:150px}.logo-product .img-logo{width:100%;margin-bottom:13px}.logo-product .text-small{font-size:13px;margin:0;padding:0;text-align:left}.logo-product .text-product{text-align:left;font-size:22px;font-weight:700;line-height:1;margin:0;padding:0;text-transform:uppercase;white-space:nowrap}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { product: [{
+                type: Input
+            }] } });
+
+class TCloudUiLinhaLogoModule {
+}
+TCloudUiLinhaLogoModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TCloudUiLinhaLogoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, declarations: [TCloudUiLinhaLogoComponent], imports: [CommonModule], exports: [TCloudUiLinhaLogoComponent] });
+TCloudUiLinhaLogoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLinhaLogoModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        TCloudUiLinhaLogoComponent
+                    ],
+                    imports: [
+                        CommonModule
+                    ],
+                    exports: [
+                        TCloudUiLinhaLogoComponent
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TCloudUiLinhaLogoComponent, TCloudUiLinhaLogoModule, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabMenuModule, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TcloudUiModalBodyComponent, TcloudUiModalComponent, TcloudUiModalFooterComponent, TcloudUiModalHeaderComponent, TcloudUiModalModule };
+//# sourceMappingURL=dev-tcloud-tcloud-ui.mjs.map