@dev-tcloud/tcloud-ui 6.19.3 → 6.20.0

package/docs/tcloud-ui-dialog.md

@@ -0,0 +1,167 @@
+# TCloud UI Dialog
+
+Componente standalone de diálogo de confirmação criado dinamicamente via `TCloudUiDialogService`, com suporte a mensagem HTML, estado de carregamento, confirmação por texto digitado e encadeamento fluente (`onConfirm` / `onCancel`).
+
+## Características
+
+- Abertura imperativa com `ComponentFactoryResolver` e `ViewContainerRef` raiz definido pelo consumidor
+- Título, mensagem (`innerHTML`), textos de botões e rótulos via `TCloudUiDialogModel` e i18n padrão
+- Modo de confirmação por palavra (`TCloudUiDialogTextConfirmationEnum`) com validação case-insensitive
+- Indicador de carregamento (`tc-rev-small-loading`) quando `data.loading` é verdadeiro
+- Tecla Escape e botão fechar disparam fluxo de cancelamento; animação de entrada/saída (`fade`)
+- `BehaviorSubject` `events` notifica ciclo de vida (`open` / `close`); após `close` o serviço destrói a instância do componente
+
+## Instalação
+
+O componente e o serviço estão no `TCloudUiModule` (o serviço também está em `providedIn: 'root'`).
+
+```typescript
+import { TCloudUiModule, TCloudUiDialogService } from 'projects/tcloud-ui/src/public-api';
+
+@NgModule({
+  imports: [TCloudUiModule],
+})
+export class AppModule {}
+```
+
+Uso standalone (apenas o componente, sem abrir via serviço — cenário raro, pois o fluxo previsto é via serviço):
+
+```typescript
+import { TCloudUiDialogComponent } from 'projects/tcloud-ui/src/public-api';
+
+@Component({
+  standalone: true,
+  imports: [TCloudUiDialogComponent],
+})
+export class ExampleComponent {}
+```
+
+## Propriedades (API)
+
+O seletor `tcloud-ui-dialog` não expõe `@Input()` nem `@Output()` para templates externos: a configuração ocorre pelo retorno de `TCloudUiDialogService.open()` e pela mutação de `data` na instância retornada.
+
+### Parâmetros de `TCloudUiDialogService.open(_data?)`
+
+Valores passados em `_data` são mesclados com padrões do serviço (incluindo chaves i18n). O serviço instancia `TCloudUiDialogModel` internamente.
+
+| Campo | Tipo | Descrição | Valor padrão (comportamento do serviço) |
+|-------|------|-----------|----------------------------------------|
+| `title` | `string` | Título do cabeçalho | Tradução de `dialogConfirmation.default_title` ou *Atenção* |
+| `message` | `string` | Corpo do diálogo (HTML) | Tradução de `dialogConfirmation.default_message` |
+| `loading` | `boolean` | Exibe loading e bloqueia ações enquanto verdadeiro | `undefined` / herdado do objeto |
+| `disable` | `boolean` | Desabilita botões, fechar e Escape | `undefined` / herdado |
+| `disableClickOutside` | `boolean` | Comportamento do clique no backdrop: quando **falso** ou indefinido, o clique é ignorado; quando **verdadeiro** e `disable` é falso, o clique chama `close(true)` (mesmo fluxo que cancelar) | `undefined` / herdado |
+| `inputConfirmationText` | `TCloudUiDialogTextConfirmationEnum` | Palavra esperada no campo de confirmação (mapeada para texto i18n) | `confirm` |
+| `buttonConfirmText` | `string` | Armazenado em `TCloudUiDialogModel`; o template atual do diálogo exibe no botão principal o valor de `textConfirmation` com `titlecase`, não este campo | Opcional |
+| `buttonCancelText` | `string` | Rótulo do botão cancelar | Tradução de `dialogConfirmation.cancel` se omitido |
+
+### `TCloudUiDialogTextConfirmationEnum`
+
+| Valor | Uso |
+|-------|-----|
+| `continue` | Palavra de confirmação associada à tradução `dialogConfirmation.continue` |
+| `remove` | Idem `dialogConfirmation.remove` |
+| `confirm` | Idem `dialogConfirmation.confirm` (padrão do serviço) |
+
+### `TCloudUiDialogEventsEnum`
+
+Emitido em `events` da instância do componente: `open` (valor inicial) e `close` ao finalizar animação de fechamento.
+
+### `TCloudUiDialogStatusEnum`
+
+Valores `success`, `error`, `info`, `warning` exportados no pacote para uso alinhado a fluxos de UI; o componente de diálogo atual não aplica esse enum no template.
+
+### API pública da instância (`TCloudUiDialogComponent`)
+
+| Membro | Tipo | Descrição |
+|--------|------|-----------|
+| `data` | `TCloudUiDialogModel` | Modelo exibido; pode ser mutado após abrir (ex.: `dialog.data.loading = true`) |
+| `textConfirmation` | `string` | Palavra efetiva de confirmação (definida pelo serviço com base no enum e i18n) |
+| `inputConfirmationControl` | `FormControl` | Controle do campo de confirmação; `Validators.required`; desabilitado quando `disable` ou `loading` |
+| `events` | `BehaviorSubject<TCloudUiDialogEventsEnum>` | Ciclo de vida; completa após `close` |
+| `animation` | `string` | Estado da animação (`visible` / `hide`) |
+| `close(emitCancel?)` | `void` | Inicia fechamento; `emitCancel === true` (padrão) invoca callback de `onCancel`; `false` apenas encerra sem disparar cancelamento |
+| `confirm()` | `void` | Valida texto de confirmação (se habilitado) e chama callback de `onConfirm` |
+| `onConfirm(fn)` | `TCloudUiDialogComponent` | Registra callback recebendo a instância do diálogo; encadeável |
+| `onCancel(fn)` | `TCloudUiDialogComponent` | Registra callback de cancelamento; encadeável |
+
+### Configuração obrigatória do serviço
+
+| Método | Descrição |
+|--------|-----------|
+| `setRootViewContainerRef(ref: ViewContainerRef)` | Define o container onde o host do diálogo será inserido (tipicamente `ViewChild` template em `#dialogRoot`) |
+
+## Exemplos de uso
+
+### Uso básico
+
+Template com âncora para o diálogo e botão para abrir:
+
+```html
+<ng-container #dialogRoot></ng-container>
+<button type="button" (click)="open()">Abrir diálogo</button>
+```
+
+```typescript
+import { AfterViewInit, Component, ViewChild, ViewContainerRef } from '@angular/core';
+import {
+  TCloudUiDialogService,
+  TCloudUiDialogTextConfirmationEnum,
+} from 'projects/tcloud-ui/src/public-api';
+
+@Component({
+  selector: 'app-example',
+  templateUrl: './example.component.html',
+})
+export class ExampleComponent implements AfterViewInit {
+  @ViewChild('dialogRoot', { read: ViewContainerRef }) dialogRoot!: ViewContainerRef;
+
+  constructor(private readonly dialog: TCloudUiDialogService) {}
+
+  ngAfterViewInit(): void {
+    this.dialog.setRootViewContainerRef(this.dialogRoot);
+  }
+
+  open(): void {
+    this.dialog
+      .open({
+        title: 'Confirmar operação',
+        message: '<p>Deseja prosseguir?</p>',
+        inputConfirmationText: TCloudUiDialogTextConfirmationEnum.confirm,
+      })
+      .onConfirm((d) => d.close(false))
+      .onCancel(() => {});
+  }
+}
+```
+
+### Uso avançado
+
+Padrão da página de demonstração: confirmação com palavra `remove`, bloqueio de clique externo até confirmar texto, fluxo assíncrono com `loading` e fechamento sem callback de cancelamento após sucesso.
+
+```typescript
+openDialogWarning(): void {
+  this.tCloudUiDialogService
+    .open({
+      title: 'Teste title',
+      message: 'Teste message',
+      disableClickOutside: true,
+      inputConfirmationText: TCloudUiDialogTextConfirmationEnum.remove,
+      buttonConfirmText: 'Teste confirm',
+      buttonCancelText: 'Teste cancel',
+    })
+    .onConfirm((dialog) => {
+      dialog.data.loading = true;
+      setTimeout(() => dialog.close(false), 3000);
+    })
+    .onCancel(() => {
+      alert('Cancelado');
+    });
+}
+```
+
+Notas de comportamento:
+
+- `dialog.close(false)` após operações bem-sucedidas evita executar o handler registrado em `onCancel`.
+- Enquanto `data.loading` ou `data.disable` é verdadeiro, Escape não fecha o diálogo e os botões permanecem desabilitados.
+- Com campo de confirmação ativo, o valor digitado deve coincidir com `textConfirmation` (comparação sem diferenciar maiúsculas/minúsculas).

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

@@ -1,11 +1,11 @@
 import * as i0 from '@angular/core';
-import { Injectable, Component, EventEmitter, Input, Output, InjectionToken, Optional, Inject, inject, signal, Pipe, forwardRef, ViewChild, input, effect, Directive, ViewEncapsulation, SkipSelf, ChangeDetectionStrategy, HostListener, ChangeDetectorRef, computed, ApplicationRef, output, model, ContentChildren, viewChild, NgModule, makeEnvironmentProviders } from '@angular/core';
+import { Injectable, Component, EventEmitter, Input, Output, InjectionToken, Optional, Inject, inject, signal, Pipe, forwardRef, ViewChild, input, effect, Directive, ViewEncapsulation, SkipSelf, ChangeDetectionStrategy, HostListener, ChangeDetectorRef, computed, ApplicationRef, output, model, ContentChildren, viewChild, ComponentFactoryResolver, NgModule, makeEnvironmentProviders } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, DatePipe, DOCUMENT } from '@angular/common';
 import { Subject, Subscription, BehaviorSubject, debounceTime, distinctUntilChanged, map } from 'rxjs';
 import { trigger, state, style, transition, animate, AnimationBuilder } from '@angular/animations';
 import * as i2 from '@angular/forms';
-import { NG_VALUE_ACCESSOR, FormsModule, FormControl, ReactiveFormsModule, NG_VALIDATORS, FormGroup, Validators } from '@angular/forms';
+import { NG_VALUE_ACCESSOR, FormsModule, FormControl, ReactiveFormsModule, NG_VALIDATORS, Validators, FormGroup } from '@angular/forms';
 import * as i1$1 from '@angular/router';
 import { Router, RouterModule } from '@angular/router';
 
@@ -282,6 +282,15 @@ var modal$1 = {
 	to_confirm: "to confirm",
 	textByConfirm: "confirm"
 };
+var dialogConfirmation$1 = {
+	default_title: "Attention",
+	default_message: "Do you really want to execute this action?",
+	cancel: "Cancel",
+	"continue": "Continue",
+	remove: "Remove",
+	confirm: "Confirm",
+	input_confirmation_error: "Type the word \"{{word}}\"."
+};
 var enUS = {
 	choiceIssues: choiceIssues$1,
 	inputPassword: inputPassword$1,
@@ -290,7 +299,8 @@ var enUS = {
 	notFound: notFound$1,
 	searchInObject: searchInObject$1,
 	uploadArea: uploadArea$1,
-	modal: modal$1
+	modal: modal$1,
+	dialogConfirmation: dialogConfirmation$1
 };
 
 var choiceIssues = {
@@ -327,6 +337,15 @@ var modal = {
 	to_confirm: "para confirmar",
 	textByConfirm: "confirmo"
 };
+var dialogConfirmation = {
+	default_title: "Atención",
+	default_message: "¿Desea realmente ejecutar esta acción?",
+	cancel: "Cancelar",
+	"continue": "Continuar",
+	remove: "Eliminar",
+	confirm: "Confirmar",
+	input_confirmation_error: "Escribe la palabra \"{{word}}\"."
+};
 var esES = {
 	choiceIssues: choiceIssues,
 	inputPassword: inputPassword,
@@ -335,7 +354,8 @@ var esES = {
 	notFound: notFound,
 	searchInObject: searchInObject,
 	uploadArea: uploadArea,
-	modal: modal
+	modal: modal,
+	dialogConfirmation: dialogConfirmation
 };
 
 const LOCALE_MESSAGES = {
@@ -9045,6 +9065,267 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }] });
 
+var TCloudUiDialogEventsEnum;
+(function (TCloudUiDialogEventsEnum) {
+    TCloudUiDialogEventsEnum[TCloudUiDialogEventsEnum["open"] = 0] = "open";
+    TCloudUiDialogEventsEnum[TCloudUiDialogEventsEnum["close"] = 1] = "close";
+})(TCloudUiDialogEventsEnum || (TCloudUiDialogEventsEnum = {}));
+
+class TcRevSmallLoadingComponent {
+    constructor() {
+        /** Width of the loading spinner accepts string with CSS units (px, rem, em) */
+        this.width = input('1.25rem');
+        /** Margin top in pixels */
+        this.marginTop = input(0);
+        /** Margin bottom in pixels */
+        this.marginBottom = input(0);
+        /** Margin right in pixels */
+        this.marginRight = input(0);
+        /** Margin left in pixels */
+        this.marginLeft = input(0);
+        this.style = new TcRevSmallLoadingComponentStyle();
+    }
+    ngOnInit() {
+        this.style.marginTop = `${this.marginTop()}px`;
+        this.style.marginRight = `${this.marginRight()}px`;
+        this.style.marginLeft = `${this.marginLeft()}px`;
+        this.style.marginBottom = `${this.marginBottom()}px`;
+        this.style.width = this.width();
+        this.style.height = this.width();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TcRevSmallLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.21", type: TcRevSmallLoadingComponent, isStandalone: true, selector: "tc-rev-small-loading", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, marginTop: { classPropertyName: "marginTop", publicName: "marginTop", isSignal: true, isRequired: false, transformFunction: null }, marginBottom: { classPropertyName: "marginBottom", publicName: "marginBottom", isSignal: true, isRequired: false, transformFunction: null }, marginRight: { classPropertyName: "marginRight", publicName: "marginRight", isSignal: true, isRequired: false, transformFunction: null }, marginLeft: { classPropertyName: "marginLeft", publicName: "marginLeft", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"tc-rev-small-loading\">\n  <span\n    class=\"tc-rev-small-loading__spinner\"\n    [ngStyle]=\"this.style\">\n  </span>\n</div>\n", styles: ["@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tc-rev-small-loading{display:flex;align-items:center;justify-content:center}.tc-rev-small-loading__spinner{animation:rotation 1s linear infinite;border:3px solid var(--c-neutral-200);border-bottom-color:var(--c-neutral-500);border-radius:50%;box-sizing:border-box;display:inline-block;height:var(--size-20);width:var(--size-20)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TcRevSmallLoadingComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tc-rev-small-loading', imports: [CommonModule], template: "<div class=\"tc-rev-small-loading\">\n  <span\n    class=\"tc-rev-small-loading__spinner\"\n    [ngStyle]=\"this.style\">\n  </span>\n</div>\n", styles: ["@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tc-rev-small-loading{display:flex;align-items:center;justify-content:center}.tc-rev-small-loading__spinner{animation:rotation 1s linear infinite;border:3px solid var(--c-neutral-200);border-bottom-color:var(--c-neutral-500);border-radius:50%;box-sizing:border-box;display:inline-block;height:var(--size-20);width:var(--size-20)}\n"] }]
+        }] });
+class TcRevSmallLoadingComponentStyle {
+}
+
+class TCloudUiDialogComponent {
+    constructor() {
+        this.animation = 'visible';
+        this.inputConfirmationControl = new FormControl('', [Validators.required]);
+        this.events = new BehaviorSubject(TCloudUiDialogEventsEnum.open);
+        this.isClosing = false;
+        // * [Injects]
+        this.i18n = inject(I18nService);
+    }
+    onKeydownHandler(event) {
+        if (this.data?.disable || this.data?.loading)
+            return;
+        event.preventDefault();
+        this.close(true);
+    }
+    ngDoCheck() {
+        this.syncInputConfirmationDisabledState();
+    }
+    /**
+     * `FormControl` ignora `[disabled]` no template; `data.loading` / `data.disable`
+     * podem mudar por mutação no modelo após abrir o dialog.
+     */
+    syncInputConfirmationDisabledState() {
+        if (!this.data?.inputConfirmationText)
+            return;
+        const shouldDisable = !!(this.data.disable || this.data.loading);
+        if (shouldDisable && this.inputConfirmationControl.enabled) {
+            this.inputConfirmationControl.disable({ emitEvent: false });
+        }
+        else if (!shouldDisable && this.inputConfirmationControl.disabled) {
+            this.inputConfirmationControl.enable({ emitEvent: false });
+        }
+    }
+    /**
+     * Método para validar o valor do input! A confirmação deve ser igual a 'DELTE'
+     */
+    checkInputConfirmation() {
+        const inputValue = this.inputConfirmationControl.value ?? '';
+        return inputValue.toUpperCase() === this.textConfirmation.toUpperCase();
+    }
+    /** Fecha com `onCancel` quando `data.disableClickOutside` está habilitado e o dialog não está bloqueado. */
+    onBackdropClick() {
+        if (!this.data?.disableClickOutside || this.data.disable)
+            return;
+        this.close(true);
+    }
+    /** Substitui `{{word}}` na mensagem vinda de `dialogConfirmation.input_confirmation_error`. */
+    inputConfirmationErrorMessage() {
+        const word = (this.textConfirmation ?? '').toLowerCase();
+        const template = this.i18n.i18nTranslate('dialogConfirmation.input_confirmation_error', 'Digite corretamente a palavra "{{word}}".');
+        return template.replace(/\{\{\s*word\s*\}\}/gi, word);
+    }
+    /**
+     * Fecha o dialog após a animação.
+     * @param emitCancel `true` (padrão): dispara `onCancel` — uso do X, Esc, botão Cancelar.
+     * `false`: só remove o modal — ex.: após fluxo concluído em `onConfirm` (`dialog.close(false)`).
+     */
+    close(emitCancel = true) {
+        if (this.isClosing)
+            return;
+        this.isClosing = true;
+        if (this.data) {
+            this.data.loading = false;
+            this.data.disable = false;
+        }
+        if (this.inputConfirmationControl.disabled) {
+            this.inputConfirmationControl.enable({ emitEvent: false });
+        }
+        this.animation = 'hide';
+        setTimeout(() => {
+            if (emitCancel) {
+                this.cancelFunction?.(this);
+            }
+            this.events.next(TCloudUiDialogEventsEnum.close);
+            this.events.complete();
+        }, 300);
+    }
+    /**
+     * Método usado no .html para solicitar o click no botão de confirmação
+     */
+    confirm() {
+        if (!this.data.loading) {
+            if (this.data.inputConfirmationText) {
+                if (this.checkInputConfirmation()) {
+                    this.confirmFunction(this);
+                }
+                else {
+                    this.inputConfirmationControl.markAsTouched({ onlySelf: true });
+                    this.inputConfirmationControl.setErrors({ incorrect: true });
+                }
+            }
+            else {
+                this.confirmFunction(this);
+            }
+        }
+    }
+    /**
+     * Méotodo usuário nos components pai, para receber o momento de fechamento do modal
+     * @param fn Obj component
+     */
+    onCancel(fn) {
+        this.cancelFunction = fn;
+        return this;
+    }
+    /**
+     * Méotodo usuário nos components pai, para receber o momento de confirmação do modal
+     * @param fn Obj component
+     */
+    onConfirm(fn) {
+        this.confirmFunction = fn;
+        return this;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TCloudUiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: TCloudUiDialogComponent, isStandalone: true, selector: "tcloud-ui-dialog", host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, ngImport: i0, template: "<div class=\"background-modal\" (click)=\"onBackdropClick()\"></div>\n\n@let disabled = data.disable || data.loading;\n<div class=\"container-dialog\" [@fade]=\"animation\">\n\n    <!-- Header -->\n    <div class=\"container-header\">\n\n        <!-- Title -->\n        <h4 class=\"tc-title tcloud-ui-modal-header tc-modal-header\">{{ data.title }}</h4>\n\n        <!-- Close button -->\n        <div class=\"container-close-button\" (click)=\" disabled ? null : close()\">\n            <i class=\"fas fa-times\"></i>\n        </div>\n    </div>\n\n    <!-- Message -->\n    <div [innerHTML]=\"data.message\"></div>\n\n    <!-- Input confirmation -->\n    @if (data?.inputConfirmationText)\n    {\n        <div class=\"container-input-confirmation\">\n            <input\n                tcloudForm\n                class=\"tc-form-confirm tc-form-control\"\n                [formControl]=\"inputConfirmationControl\"\n                [placeholder]=\"inputConfirmationErrorMessage()\"\n                (keyup.enter)=\"confirm()\"\n            />\n\n            @if (inputConfirmationControl.touched && inputConfirmationControl.invalid)\n            {\n                <p class=\"text-danger\">{{ inputConfirmationErrorMessage() }}</p>\n            }\n        </div>\n    }\n\n    <!-- Loading -->\n    @if (data.loading)\n    {\n        <tc-rev-small-loading />\n    }\n\n    <!-- Footer -->\n    <div class=\"container-footer\">\n\n        <!-- Cancelar -->\n        <button\n            class=\"tc-btn tc-btn-outline-primary\"\n            [disabled]=\"disabled\"\n            (click)=\"close()\">{{ data.buttonCancelText || ('dialogConfirmation.cancel' | i18nTranslate: 'Cancelar') }}\n        </button>\n\n        <!-- Confirmar -->\n        <button\n            class=\"tc-btn tc-btn-primary\"\n            [disabled]=\"disabled\"\n            (click)=\"confirm()\">{{ textConfirmation | titlecase }}\n        </button>\n    </div>\n</div>\n", styles: [".background-modal{position:fixed;z-index:2000;width:100%;height:100%;background-color:#00000080;top:0;left:0}.container-dialog{position:fixed;top:15%;left:calc(50% - 300px);width:500px;z-index:20001;border-radius:8px;padding:24px;box-sizing:border-box;display:grid;gap:24px;background-color:var(--white)}.container-dialog .container-header{display:flex;justify-content:space-between;align-items:center}.container-dialog .container-header .tc-title{font-size:18px;font-weight:700}.container-dialog .container-header .container-close-button{width:40px;height:40px;border-radius:100%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--tc-gray-600);border:1px solid var(--tc-gray-500)}.container-dialog .container-input-confirmation{display:grid;gap:8px}.container-dialog .container-footer{display:flex;justify-content:space-between;align-items:center;gap:16px}.container-dialog .container-footer button{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: I18nTranslatePipe, name: "i18nTranslate" }, { kind: "component", type: TcRevSmallLoadingComponent, selector: "tc-rev-small-loading", inputs: ["width", "marginTop", "marginBottom", "marginRight", "marginLeft"] }], 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: "19.2.21", ngImport: i0, type: TCloudUiDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-dialog', 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'))
+                        ])
+                    ], standalone: true, imports: [CommonModule, ReactiveFormsModule, I18nTranslatePipe, TCloudUiLoadingComponent, TcRevSmallLoadingComponent], template: "<div class=\"background-modal\" (click)=\"onBackdropClick()\"></div>\n\n@let disabled = data.disable || data.loading;\n<div class=\"container-dialog\" [@fade]=\"animation\">\n\n    <!-- Header -->\n    <div class=\"container-header\">\n\n        <!-- Title -->\n        <h4 class=\"tc-title tcloud-ui-modal-header tc-modal-header\">{{ data.title }}</h4>\n\n        <!-- Close button -->\n        <div class=\"container-close-button\" (click)=\" disabled ? null : close()\">\n            <i class=\"fas fa-times\"></i>\n        </div>\n    </div>\n\n    <!-- Message -->\n    <div [innerHTML]=\"data.message\"></div>\n\n    <!-- Input confirmation -->\n    @if (data?.inputConfirmationText)\n    {\n        <div class=\"container-input-confirmation\">\n            <input\n                tcloudForm\n                class=\"tc-form-confirm tc-form-control\"\n                [formControl]=\"inputConfirmationControl\"\n                [placeholder]=\"inputConfirmationErrorMessage()\"\n                (keyup.enter)=\"confirm()\"\n            />\n\n            @if (inputConfirmationControl.touched && inputConfirmationControl.invalid)\n            {\n                <p class=\"text-danger\">{{ inputConfirmationErrorMessage() }}</p>\n            }\n        </div>\n    }\n\n    <!-- Loading -->\n    @if (data.loading)\n    {\n        <tc-rev-small-loading />\n    }\n\n    <!-- Footer -->\n    <div class=\"container-footer\">\n\n        <!-- Cancelar -->\n        <button\n            class=\"tc-btn tc-btn-outline-primary\"\n            [disabled]=\"disabled\"\n            (click)=\"close()\">{{ data.buttonCancelText || ('dialogConfirmation.cancel' | i18nTranslate: 'Cancelar') }}\n        </button>\n\n        <!-- Confirmar -->\n        <button\n            class=\"tc-btn tc-btn-primary\"\n            [disabled]=\"disabled\"\n            (click)=\"confirm()\">{{ textConfirmation | titlecase }}\n        </button>\n    </div>\n</div>\n", styles: [".background-modal{position:fixed;z-index:2000;width:100%;height:100%;background-color:#00000080;top:0;left:0}.container-dialog{position:fixed;top:15%;left:calc(50% - 300px);width:500px;z-index:20001;border-radius:8px;padding:24px;box-sizing:border-box;display:grid;gap:24px;background-color:var(--white)}.container-dialog .container-header{display:flex;justify-content:space-between;align-items:center}.container-dialog .container-header .tc-title{font-size:18px;font-weight:700}.container-dialog .container-header .container-close-button{width:40px;height:40px;border-radius:100%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--tc-gray-600);border:1px solid var(--tc-gray-500)}.container-dialog .container-input-confirmation{display:grid;gap:8px}.container-dialog .container-footer{display:flex;justify-content:space-between;align-items:center;gap:16px}.container-dialog .container-footer button{width:100%}\n"] }]
+        }], propDecorators: { onKeydownHandler: [{
+                type: HostListener,
+                args: ['document:keydown.escape', ['$event']]
+            }] } });
+
+var TCloudUiDialogTextConfirmationEnum;
+(function (TCloudUiDialogTextConfirmationEnum) {
+    TCloudUiDialogTextConfirmationEnum["continue"] = "continue";
+    TCloudUiDialogTextConfirmationEnum["remove"] = "remove";
+    TCloudUiDialogTextConfirmationEnum["confirm"] = "confirm";
+})(TCloudUiDialogTextConfirmationEnum || (TCloudUiDialogTextConfirmationEnum = {}));
+
+class TCloudUiDialogModel {
+    constructor(_title, _description, _loading = false, _disable = false, _disableClickOutside = false, _inputConfirmationText, _buttonConfirmText, _buttonCancelText) {
+        this.title = _title;
+        this.message = _description;
+        this.loading = _loading;
+        this.disable = _disable;
+        this.disableClickOutside = _disableClickOutside;
+        this.inputConfirmationText = _inputConfirmationText;
+        this.buttonConfirmText = _buttonConfirmText;
+        this.buttonCancelText = _buttonCancelText;
+    }
+}
+
+class TCloudUiDialogService {
+    constructor() {
+        // * [Injects]
+        this.i18n = inject(I18nService);
+        this.factoryResolver = inject(ComponentFactoryResolver);
+    }
+    /**
+     * Método usado para realizar a configuração de 'ViewContainerRef'
+     * @param viewContainerRef Obj
+     */
+    setRootViewContainerRef(viewContainerRef) {
+        if (!this.rootViewContainer)
+            this.rootViewContainer = viewContainerRef;
+    }
+    /**
+     * Método usado para abrir o modal de dialog
+     * @param _data Info do dialog
+     */
+    open(_data = {}) {
+        const factory = this.factoryResolver.resolveComponentFactory(TCloudUiDialogComponent);
+        const component = factory.create(this.rootViewContainer.parentInjector);
+        this.rootViewContainer.insert(component.hostView);
+        component.instance.data = new TCloudUiDialogModel(_data.title || this.i18n.i18nTranslate('dialogConfirmation.default_title', 'Atenção'), _data.message || this.i18n.i18nTranslate('dialogConfirmation.default_message', 'Deseja realmente executar esta ação?'), _data.loading, _data.disable, _data.disableClickOutside, _data.inputConfirmationText || TCloudUiDialogTextConfirmationEnum.confirm, _data.buttonConfirmText, _data.buttonCancelText);
+        // * Configura o texto do input de confirmação
+        if (component.instance.data.inputConfirmationText)
+            this.setTextConfirmation(component.instance);
+        component.instance.events.subscribe(event => {
+            // * Fecha o dialogo
+            if (event === TCloudUiDialogEventsEnum.close)
+                component.destroy();
+        });
+        return component.instance;
+    }
+    /**
+     * Método usado para configurar o texto do input de confirmação
+     * @param component Componente do dialogo
+     */
+    setTextConfirmation(component) {
+        switch (component.data.inputConfirmationText) {
+            case TCloudUiDialogTextConfirmationEnum.continue:
+                component.textConfirmation = this.i18n.i18nTranslate('dialogConfirmation.continue', 'continuar');
+                break;
+            case TCloudUiDialogTextConfirmationEnum.remove:
+                component.textConfirmation = this.i18n.i18nTranslate('dialogConfirmation.remove', 'remover');
+                break;
+            case TCloudUiDialogTextConfirmationEnum.confirm:
+                component.textConfirmation = this.i18n.i18nTranslate('dialogConfirmation.confirm', 'confirmar');
+                break;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TCloudUiDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TCloudUiDialogService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TCloudUiDialogService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
 const COMPONENTS = [
     TCloudUiAccordionComponent,
     TCloudUiAccordionBodyComponent,
@@ -9096,6 +9377,7 @@ const COMPONENTS = [
     TCloudUiCalendarComponent,
     TCloudUiDropdownComponent,
     TCloudUiDropdownMultiComponent,
+    TCloudUiDialogComponent,
     TCloudUiEmptyContentComponent,
     TCloudUiFaqComponent,
     TCloudUiMessageComponent,
@@ -9146,6 +9428,9 @@ const PIPES = [
     StatusInfoPipe,
     TCloudUiPaginationPipe
 ];
+const SERVICES = [
+    TCloudUiDialogService,
+];
 class TCloudUiModule {
     static forRoot(config) {
         const providers = [
@@ -9223,6 +9508,7 @@ class TCloudUiModule {
             TCloudUiCalendarComponent,
             TCloudUiDropdownComponent,
             TCloudUiDropdownMultiComponent,
+            TCloudUiDialogComponent,
             TCloudUiEmptyContentComponent,
             TCloudUiFaqComponent,
             TCloudUiMessageComponent,
@@ -9315,6 +9601,7 @@ class TCloudUiModule {
             TCloudUiCalendarComponent,
             TCloudUiDropdownComponent,
             TCloudUiDropdownMultiComponent,
+            TCloudUiDialogComponent,
             TCloudUiEmptyContentComponent,
             TCloudUiFaqComponent,
             TCloudUiMessageComponent,
@@ -9361,7 +9648,8 @@ class TCloudUiModule {
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TCloudUiModule, providers: [
             DatePipe,
             StatusInfoPipe,
-            TCloudUiPaginationService
+            TCloudUiPaginationService,
+            ...SERVICES
         ], imports: [TCloudUiAccordionComponent,
             TCloudUiAccordionBodyComponent,
             TCloudUiAccordionTitleComponent,
@@ -9407,6 +9695,7 @@ class TCloudUiModule {
             TCloudUiCalendarComponent,
             TCloudUiDropdownComponent,
             TCloudUiDropdownMultiComponent,
+            TCloudUiDialogComponent,
             TCloudUiFaqComponent,
             TCloudUiMessageComponent,
             TCloudUiSkeletonLoadingComponent,
@@ -9441,7 +9730,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
                     providers: [
                         DatePipe,
                         StatusInfoPipe,
-                        TCloudUiPaginationService
+                        TCloudUiPaginationService,
+                        ...SERVICES
                     ]
                 }]
         }] });
@@ -9496,6 +9786,14 @@ function provideTCloudUi(config) {
     return makeEnvironmentProviders(providers);
 }
 
+var TCloudUiDialogStatusEnum;
+(function (TCloudUiDialogStatusEnum) {
+    TCloudUiDialogStatusEnum["success"] = "success";
+    TCloudUiDialogStatusEnum["error"] = "error";
+    TCloudUiDialogStatusEnum["info"] = "info";
+    TCloudUiDialogStatusEnum["warning"] = "warning";
+})(TCloudUiDialogStatusEnum || (TCloudUiDialogStatusEnum = {}));
+
 class TCloudUiLoadingTransitionsService {
     constructor() {
         this.ID = 'tcloud-ui-loading-transitions';
@@ -10870,38 +11168,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
                 }]
         }] });
 
-class TcRevSmallLoadingComponent {
-    constructor() {
-        /** Width of the loading spinner accepts string with CSS units (px, rem, em) */
-        this.width = input('1.25rem');
-        /** Margin top in pixels */
-        this.marginTop = input(0);
-        /** Margin bottom in pixels */
-        this.marginBottom = input(0);
-        /** Margin right in pixels */
-        this.marginRight = input(0);
-        /** Margin left in pixels */
-        this.marginLeft = input(0);
-        this.style = new TcRevSmallLoadingComponentStyle();
-    }
-    ngOnInit() {
-        this.style.marginTop = `${this.marginTop()}px`;
-        this.style.marginRight = `${this.marginRight()}px`;
-        this.style.marginLeft = `${this.marginLeft()}px`;
-        this.style.marginBottom = `${this.marginBottom()}px`;
-        this.style.width = this.width();
-        this.style.height = this.width();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TcRevSmallLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.21", type: TcRevSmallLoadingComponent, isStandalone: true, selector: "tc-rev-small-loading", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, marginTop: { classPropertyName: "marginTop", publicName: "marginTop", isSignal: true, isRequired: false, transformFunction: null }, marginBottom: { classPropertyName: "marginBottom", publicName: "marginBottom", isSignal: true, isRequired: false, transformFunction: null }, marginRight: { classPropertyName: "marginRight", publicName: "marginRight", isSignal: true, isRequired: false, transformFunction: null }, marginLeft: { classPropertyName: "marginLeft", publicName: "marginLeft", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"tc-rev-small-loading\">\n  <span\n    class=\"tc-rev-small-loading__spinner\"\n    [ngStyle]=\"this.style\">\n  </span>\n</div>\n", styles: ["@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tc-rev-small-loading{display:flex;align-items:center;justify-content:center}.tc-rev-small-loading__spinner{animation:rotation 1s linear infinite;border:3px solid var(--c-neutral-200);border-bottom-color:var(--c-neutral-500);border-radius:50%;box-sizing:border-box;display:inline-block;height:var(--size-20);width:var(--size-20)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TcRevSmallLoadingComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'tc-rev-small-loading', imports: [CommonModule], template: "<div class=\"tc-rev-small-loading\">\n  <span\n    class=\"tc-rev-small-loading__spinner\"\n    [ngStyle]=\"this.style\">\n  </span>\n</div>\n", styles: ["@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tc-rev-small-loading{display:flex;align-items:center;justify-content:center}.tc-rev-small-loading__spinner{animation:rotation 1s linear infinite;border:3px solid var(--c-neutral-200);border-bottom-color:var(--c-neutral-500);border-radius:50%;box-sizing:border-box;display:inline-block;height:var(--size-20);width:var(--size-20)}\n"] }]
-        }] });
-class TcRevSmallLoadingComponentStyle {
-}
-
 class TcRevTabGroupComponent {
     constructor() {
         this.isCarouselOverflowed = false;
@@ -11375,5 +11641,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AcceptedFileType, BytesPipe, CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2 as CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, DateBRPipe, DropdownGroupedSize, DropdownMultiSize$1 as DropdownMultiSize, DropdownSize$1 as DropdownSize, MonthNamePipe, MultiLevelDropdownSize, ProductActionPipe, ProgressStatusBarGradientStatus$1 as ProgressStatusBarGradientStatus, RespectivePipe, StatusInfoPipe, TCCondition, TCFiltersType, TCLOUD_UI_CONFIG, TCLOUD_UI_LAYOUT_SERVICE, TCLOUD_UI_LOCALE_SERVICE, TCLOUD_UI_USER_SERVICE, TCLOUD_UI_VIEWPORT_SERVICE, TCloudUiAccordionBodyComponent, TCloudUiAccordionComponent, TCloudUiAccordionTitleComponent, TCloudUiAlertBannerComponent, TCloudUiAlignDirective, TCloudUiBreadcrumbComponent, TCloudUiBreadcrumbService, TCloudUiButtonDirective, TCloudUiCalendarComponent, TCloudUiCardAccordionComponent, TCloudUiCardComponent, TCloudUiCardTitleComponent, TCloudUiCheckAccessDirective, TCloudUiCheckAccessService, TCloudUiCheckboxDirective, TCloudUiChoiceIssuesComponent, TCloudUiContainerColComponent, TCloudUiContainerComponent, TCloudUiContainerContentComponent, TCloudUiCubesComponent, TCloudUiCurrencyDirective, TCloudUiDataListComponent, TCloudUiDataListOptionComponent, TCloudUiDatepickerComponent, TCloudUiDatepickerTimeComponent, TCloudUiDigitOnlyDirective, TCloudUiDropdownComponent, TCloudUiDropdownMultiComponent, TCloudUiElCopyDirective, TCloudUiEmptyContentComponent, TCloudUiFaqComponent, TCloudUiFilterBarComponent, TCloudUiFiltersComponent, TCloudUiFormDirective, TCloudUiHighLightDirective, TCloudUiHoverParentDirective, TCloudUiIconButtonDirective, TCloudUiInputContainerComponent, TCloudUiInputDirective, TCloudUiInputPasswordComponent, TCloudUiInputSearchComponent, TCloudUiIpMaskDirective, TCloudUiLabelTokenComponent, TCloudUiLegendComponent, TCloudUiLineStepCircleComponent, TCloudUiLineStepTitleComponent, TCloudUiLinhaLogoComponent, TCloudUiLoadingComponent, TCloudUiLoadingTransitionsService, TCloudUiMessageComponent, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiSelectComponent, TCloudUiMultiplesValuesComponent, TCloudUiNgCheckAccessDirective, TCloudUiNgFeatureFlagsDirective, TCloudUiNotFoundComponent, TCloudUiNumberStepComponent, TCloudUiPaginationComponent, TCloudUiPaginationPipe, TCloudUiProgressBarComponent, TCloudUiProgressStatusBarComponent, TCloudUiRadioDirective, TCloudUiRangeDateComponent, TCloudUiReorderItemsComponent, TCloudUiScrollBoxComponent, TCloudUiSearchBarComponent, TCloudUiSearchInObjectService, TCloudUiSearchInputComponent, TCloudUiSkeletonLoadingComponent, TCloudUiSkeletonLoadingComponentStyle, TCloudUiSlideToggleDirective, TCloudUiSubNavbarComponent, TCloudUiSubNavbarGroupComponent, TCloudUiSubNavbarItemComponent, TCloudUiTabContentComponent, TCloudUiTabGroupComponent, TCloudUiTabHeadComponent, TCloudUiTabItemComponent, TCloudUiTabMenuComponent, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTagComponent, TCloudUiToastComponent, TCloudUiTooltipDirective, TCloudUiUploadAreaComponent, TCloudUiWelcomeComponent, TCloudUiWizardStepsComponent, TagColorsEnum, TcRevButtonDirective, TcRevCalendarComponent, TcRevCardAccordionComponent, TcRevCardComponent, TcRevCardTitleComponent, TcRevCheckboxDirective, TcRevComponentsLibModule, TcRevDropdownComponent, TcRevDropdownGroupedComponent, TcRevDropdownMultiComponent, TcRevDropdownMultiLevelComponent, TcRevEmptyContentComponent, TcRevFaqComponent, TcRevIconButtonDirective, TcRevInputContainerComponent, TcRevInputDirective, TcRevLoadingComponent, TcRevMessageComponent, TcRevMultiInputComponent, TcRevPaginationComponent, TcRevProgressStatusBarComponent, TcRevRadioDirective, TcRevSearchInputComponent, TcRevSideDrawerComponent, TcRevSkeletonLoadingComponent, TcRevSkeletonLoadingComponentStyle, TcRevSlideToggleDirective, TcRevSmallLoadingComponent, TcRevSmallLoadingComponentStyle, TcRevSubNavbarComponent, TcRevSubNavbarItemComponent, TcRevTabGroupComponent, TcRevTabItemComponent, TcRevTagComponent, TcRevToastComponent, TcRevTooltipDirective, TcRevWizardStepsComponent, ToTextPipe, TopologyEnvironmentPipe, TopologyProductPipe, TopologyRegionPipe, TopologyStatusPipe, echartBarConfig, isTextEllipsed, provideTCloudUi };
+export { AcceptedFileType, BytesPipe, CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2 as CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, DateBRPipe, DropdownGroupedSize, DropdownMultiSize$1 as DropdownMultiSize, DropdownSize$1 as DropdownSize, MonthNamePipe, MultiLevelDropdownSize, ProductActionPipe, ProgressStatusBarGradientStatus$1 as ProgressStatusBarGradientStatus, RespectivePipe, StatusInfoPipe, TCCondition, TCFiltersType, TCLOUD_UI_CONFIG, TCLOUD_UI_LAYOUT_SERVICE, TCLOUD_UI_LOCALE_SERVICE, TCLOUD_UI_USER_SERVICE, TCLOUD_UI_VIEWPORT_SERVICE, TCloudUiAccordionBodyComponent, TCloudUiAccordionComponent, TCloudUiAccordionTitleComponent, TCloudUiAlertBannerComponent, TCloudUiAlignDirective, TCloudUiBreadcrumbComponent, TCloudUiBreadcrumbService, TCloudUiButtonDirective, TCloudUiCalendarComponent, TCloudUiCardAccordionComponent, TCloudUiCardComponent, TCloudUiCardTitleComponent, TCloudUiCheckAccessDirective, TCloudUiCheckAccessService, TCloudUiCheckboxDirective, TCloudUiChoiceIssuesComponent, TCloudUiContainerColComponent, TCloudUiContainerComponent, TCloudUiContainerContentComponent, TCloudUiCubesComponent, TCloudUiCurrencyDirective, TCloudUiDataListComponent, TCloudUiDataListOptionComponent, TCloudUiDatepickerComponent, TCloudUiDatepickerTimeComponent, TCloudUiDialogComponent, TCloudUiDialogEventsEnum, TCloudUiDialogModel, TCloudUiDialogService, TCloudUiDialogStatusEnum, TCloudUiDialogTextConfirmationEnum, TCloudUiDigitOnlyDirective, TCloudUiDropdownComponent, TCloudUiDropdownMultiComponent, TCloudUiElCopyDirective, TCloudUiEmptyContentComponent, TCloudUiFaqComponent, TCloudUiFilterBarComponent, TCloudUiFiltersComponent, TCloudUiFormDirective, TCloudUiHighLightDirective, TCloudUiHoverParentDirective, TCloudUiIconButtonDirective, TCloudUiInputContainerComponent, TCloudUiInputDirective, TCloudUiInputPasswordComponent, TCloudUiInputSearchComponent, TCloudUiIpMaskDirective, TCloudUiLabelTokenComponent, TCloudUiLegendComponent, TCloudUiLineStepCircleComponent, TCloudUiLineStepTitleComponent, TCloudUiLinhaLogoComponent, TCloudUiLoadingComponent, TCloudUiLoadingTransitionsService, TCloudUiMessageComponent, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiSelectComponent, TCloudUiMultiplesValuesComponent, TCloudUiNgCheckAccessDirective, TCloudUiNgFeatureFlagsDirective, TCloudUiNotFoundComponent, TCloudUiNumberStepComponent, TCloudUiPaginationComponent, TCloudUiPaginationPipe, TCloudUiProgressBarComponent, TCloudUiProgressStatusBarComponent, TCloudUiRadioDirective, TCloudUiRangeDateComponent, TCloudUiReorderItemsComponent, TCloudUiScrollBoxComponent, TCloudUiSearchBarComponent, TCloudUiSearchInObjectService, TCloudUiSearchInputComponent, TCloudUiSkeletonLoadingComponent, TCloudUiSkeletonLoadingComponentStyle, TCloudUiSlideToggleDirective, TCloudUiSubNavbarComponent, TCloudUiSubNavbarGroupComponent, TCloudUiSubNavbarItemComponent, TCloudUiTabContentComponent, TCloudUiTabGroupComponent, TCloudUiTabHeadComponent, TCloudUiTabItemComponent, TCloudUiTabMenuComponent, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTagComponent, TCloudUiToastComponent, TCloudUiTooltipDirective, TCloudUiUploadAreaComponent, TCloudUiWelcomeComponent, TCloudUiWizardStepsComponent, TagColorsEnum, TcRevButtonDirective, TcRevCalendarComponent, TcRevCardAccordionComponent, TcRevCardComponent, TcRevCardTitleComponent, TcRevCheckboxDirective, TcRevComponentsLibModule, TcRevDropdownComponent, TcRevDropdownGroupedComponent, TcRevDropdownMultiComponent, TcRevDropdownMultiLevelComponent, TcRevEmptyContentComponent, TcRevFaqComponent, TcRevIconButtonDirective, TcRevInputContainerComponent, TcRevInputDirective, TcRevLoadingComponent, TcRevMessageComponent, TcRevMultiInputComponent, TcRevPaginationComponent, TcRevProgressStatusBarComponent, TcRevRadioDirective, TcRevSearchInputComponent, TcRevSideDrawerComponent, TcRevSkeletonLoadingComponent, TcRevSkeletonLoadingComponentStyle, TcRevSlideToggleDirective, TcRevSmallLoadingComponent, TcRevSmallLoadingComponentStyle, TcRevSubNavbarComponent, TcRevSubNavbarItemComponent, TcRevTabGroupComponent, TcRevTabItemComponent, TcRevTagComponent, TcRevToastComponent, TcRevTooltipDirective, TcRevWizardStepsComponent, ToTextPipe, TopologyEnvironmentPipe, TopologyProductPipe, TopologyRegionPipe, TopologyStatusPipe, echartBarConfig, isTextEllipsed, provideTCloudUi };
 //# sourceMappingURL=dev-tcloud-tcloud-ui.mjs.map