@dev-tcloud/tcloud-ui 0.0.13 → 0.0.15

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

@@ -809,7 +809,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 }]
         }] });
 
-class Step {
+class Step$1 {
     constructor() {
         this.status = '';
         this.index = 0;
@@ -2198,6 +2198,101 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 }]
         }] });
 
+class Step {
+    constructor() {
+        this.status = '';
+        this.index = 0;
+        this.class = '';
+        this.second_class = '';
+    }
+}
+class TCloudUiNumberStepComponent {
+    constructor() {
+        this.step = 7;
+        this.active = 0;
+        this.inactives = [];
+        this.complete = false;
+        this.useIconCheck = false;
+        this.trilha = new Array();
+    }
+    ngOnInit() {
+        setTimeout(() => { this.build_steps(); });
+    }
+    build_steps() {
+        let trilha = new Array();
+        if (this.step && this.step > 0) {
+            for (let i = 0; i < this.step; i++) {
+                (trilha).push({
+                    status: '',
+                    index: i + 1,
+                    class: 'step-default',
+                    second_class: '',
+                });
+            }
+        }
+        if (this.active > this.step) {
+            this.active = this.step;
+            this.complete = true;
+        }
+        if (this.complete) {
+            this.active = this.step;
+        }
+        if (this.active && this.active > 0) {
+            for (let i = 0; i < this.active; i++) {
+                trilha[i].class = "step-progress";
+                if ((i + 1) === this.active && !this.complete) {
+                    trilha[i].class = "step-active";
+                }
+            }
+        }
+        if (this.inactives && (this.inactives).length > 0) {
+            for (let i = 0; i < (this.inactives).length; i++) {
+                const icon = this.inactives[i];
+                if (icon && icon > 0) {
+                    trilha[(icon - 1)].second_class = "step-inactive";
+                }
+            }
+        }
+        this.trilha = trilha;
+    }
+}
+TCloudUiNumberStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+TCloudUiNumberStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiNumberStepComponent, selector: "tcloud-ui-number-step", inputs: { step: "step", active: "active", inactives: "inactives", complete: "complete", useIconCheck: "useIconCheck" }, ngImport: i0, template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\n  <tr>\n    <ng-container *ngFor=\"let fase of trilha; let i = index\" >\n      <td class=\"area-circle\">\n        <div class=\"circle icon-{{ fase.class }} {{ fase.second_class }} \">\n\n          <ng-container *ngIf=\"useIconCheck\">\n            <ng-container *ngIf=\"i < active && fase.second_class !== 'step-inactive'\">\n              <div class=\"area-index\"><i class=\"fas fa-check\"></i></div>\n            </ng-container>\n\n            <ng-container *ngIf=\"i < active && fase.second_class === 'step-inactive'\">\n              <div class=\"area-index\"><i class=\"far fa-circle\"></i></div>\n            </ng-container>\n\n            <ng-container *ngIf=\"i >= active\">\n              <div class=\"area-index\">{{ i + 1 }}</div>\n            </ng-container>\n          </ng-container>\n\n          <ng-container *ngIf=\"!useIconCheck\">\n            <div class=\"area-index\">{{ i + 1 }}</div>\n          </ng-container>\n          \n        </div>\n      </td>\n      <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\n        <div class=\"step-line {{ fase.class }}\"></div>        \n      </td>\n    </ng-container>\n  </tr>\n</table>", styles: [".table-trilha{width:100%;border-collapse:collapse;margin-top:3px;margin-bottom:2px}.table-trilha td{border:none}.table-trilha .area-circle{width:0px}.table-trilha .area-circle i{font-size:18px}.table-trilha .area-index{font-size:16px;position:relative;top:50%;transform:translateY(-50%)}.table-trilha .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:calc(100% + 2px)}table tr{background-color:transparent!important}.circle{display:block;border:1px solid #ccc;height:48px;width:48px;border-radius:50%;text-align:center;font-size:14px}.step-progress{background-color:var(--verde)!important}.icon-step-progress{border-color:var(--verde);background-color:var(--verde)!important}.icon-step-progress .area-index{color:#fff}.icon-step-active{border-color:var(--verde);background-color:var(--verde)!important;color:#fff!important}.step-inactive{background-color:#fbfbfb!important}.step-inactive .area-index{color:#ccc!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-number-step', template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\n  <tr>\n    <ng-container *ngFor=\"let fase of trilha; let i = index\" >\n      <td class=\"area-circle\">\n        <div class=\"circle icon-{{ fase.class }} {{ fase.second_class }} \">\n\n          <ng-container *ngIf=\"useIconCheck\">\n            <ng-container *ngIf=\"i < active && fase.second_class !== 'step-inactive'\">\n              <div class=\"area-index\"><i class=\"fas fa-check\"></i></div>\n            </ng-container>\n\n            <ng-container *ngIf=\"i < active && fase.second_class === 'step-inactive'\">\n              <div class=\"area-index\"><i class=\"far fa-circle\"></i></div>\n            </ng-container>\n\n            <ng-container *ngIf=\"i >= active\">\n              <div class=\"area-index\">{{ i + 1 }}</div>\n            </ng-container>\n          </ng-container>\n\n          <ng-container *ngIf=\"!useIconCheck\">\n            <div class=\"area-index\">{{ i + 1 }}</div>\n          </ng-container>\n          \n        </div>\n      </td>\n      <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\n        <div class=\"step-line {{ fase.class }}\"></div>        \n      </td>\n    </ng-container>\n  </tr>\n</table>", styles: [".table-trilha{width:100%;border-collapse:collapse;margin-top:3px;margin-bottom:2px}.table-trilha td{border:none}.table-trilha .area-circle{width:0px}.table-trilha .area-circle i{font-size:18px}.table-trilha .area-index{font-size:16px;position:relative;top:50%;transform:translateY(-50%)}.table-trilha .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:calc(100% + 2px)}table tr{background-color:transparent!important}.circle{display:block;border:1px solid #ccc;height:48px;width:48px;border-radius:50%;text-align:center;font-size:14px}.step-progress{background-color:var(--verde)!important}.icon-step-progress{border-color:var(--verde);background-color:var(--verde)!important}.icon-step-progress .area-index{color:#fff}.icon-step-active{border-color:var(--verde);background-color:var(--verde)!important;color:#fff!important}.step-inactive{background-color:#fbfbfb!important}.step-inactive .area-index{color:#ccc!important}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { step: [{
+                type: Input
+            }], active: [{
+                type: Input
+            }], inactives: [{
+                type: Input
+            }], complete: [{
+                type: Input
+            }], useIconCheck: [{
+                type: Input
+            }] } });
+
+class TCloudUiNumberStepModule {
+}
+TCloudUiNumberStepModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TCloudUiNumberStepModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepModule, declarations: [TCloudUiNumberStepComponent], imports: [CommonModule], exports: [TCloudUiNumberStepComponent] });
+TCloudUiNumberStepModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        TCloudUiNumberStepComponent
+                    ],
+                    exports: [
+                        TCloudUiNumberStepComponent
+                    ],
+                    imports: [
+                        CommonModule
+                    ]
+                }]
+        }] });
+
 class TCloudUiAlignDirective {
     constructor(el, renderer) {
         this.el = el;
@@ -2528,6 +2623,7 @@ TCloudUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
         TCloudUiInputSearchModule,
         TCloudUiNotFoundModule,
         TCloudUiTableModule,
+        TCloudUiNumberStepModule,
         // Directives
         TCloudUiDirectiveModule,
         // Pipes
@@ -2542,6 +2638,7 @@ TCloudUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
         TCloudUiInputSearchModule,
         TCloudUiNotFoundModule,
         TCloudUiTableModule,
+        TCloudUiNumberStepModule,
         // Directives
         TCloudUiDirectiveModule,
         // Pipes
@@ -2560,6 +2657,7 @@ TCloudUiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
         TCloudUiInputSearchModule,
         TCloudUiNotFoundModule,
         TCloudUiTableModule,
+        TCloudUiNumberStepModule,
         // Directives
         TCloudUiDirectiveModule,
         // Pipes
@@ -2574,6 +2672,7 @@ TCloudUiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
         TCloudUiInputSearchModule,
         TCloudUiNotFoundModule,
         TCloudUiTableModule,
+        TCloudUiNumberStepModule,
         // Directives
         TCloudUiDirectiveModule,
         // Pipes
@@ -2593,6 +2692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         TCloudUiInputSearchModule,
                         TCloudUiNotFoundModule,
                         TCloudUiTableModule,
+                        TCloudUiNumberStepModule,
                         // Directives
                         TCloudUiDirectiveModule,
                         // Pipes
@@ -2610,6 +2710,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                         TCloudUiInputSearchModule,
                         TCloudUiNotFoundModule,
                         TCloudUiTableModule,
+                        TCloudUiNumberStepModule,
                         // Directives
                         TCloudUiDirectiveModule,
                         // Pipes
@@ -2630,5 +2731,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2 as CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, MonthNamePipe, RespectivePipe, StatusInfoPipe, TCloudUiAlignDirective, TCloudUiChoiceIssuesComponent, TCloudUiChoiceIssuesModule, TCloudUiDataListComponent, TCloudUiDataListModule, TCloudUiDataListOptionComponent, TCloudUiDirectiveModule, TCloudUiInputSearchComponent, TCloudUiInputSearchModule, TCloudUiLineStepCircleComponent, TCloudUiLineStepCircleModule, TCloudUiLinhaLogoComponent, TCloudUiLinhaLogoModule, TCloudUiLoadingTransitionsService, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModalModule, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiInputModule, TCloudUiMultiSelectComponent, TCloudUiMultiSelectModule, TCloudUiNotFoundComponent, TCloudUiNotFoundModule, TCloudUiPipesModule, TCloudUiSearchInObjectService, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabMenuModule, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTableModule, TCloudUiTooltipDirective };
+export { CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$2 as CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, MonthNamePipe, RespectivePipe, StatusInfoPipe, TCloudUiAlignDirective, TCloudUiChoiceIssuesComponent, TCloudUiChoiceIssuesModule, TCloudUiDataListComponent, TCloudUiDataListModule, TCloudUiDataListOptionComponent, TCloudUiDirectiveModule, TCloudUiInputSearchComponent, TCloudUiInputSearchModule, TCloudUiLineStepCircleComponent, TCloudUiLineStepCircleModule, TCloudUiLinhaLogoComponent, TCloudUiLinhaLogoModule, TCloudUiLoadingTransitionsService, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModalModule, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiInputModule, TCloudUiMultiSelectComponent, TCloudUiMultiSelectModule, TCloudUiNotFoundComponent, TCloudUiNotFoundModule, TCloudUiNumberStepComponent, TCloudUiNumberStepModule, TCloudUiPipesModule, TCloudUiSearchInObjectService, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabMenuModule, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTableModule, TCloudUiTooltipDirective };
 //# sourceMappingURL=dev-tcloud-tcloud-ui.mjs.map