@dev-tcloud/tcloud-ui 0.0.30 → 0.0.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -820,11 +820,32 @@ class Step$1 {
820
820
  class TCloudUiLineStepCircleComponent {
821
821
  constructor() {
822
822
  this.step = 7;
823
- this.active = 0;
824
- this.inactives = [];
825
- this.complete = false;
823
+ this._active = 0;
824
+ this._inactives = [];
825
+ this._complete = false;
826
826
  this.trilha = new Array();
827
827
  }
828
+ set active(active) {
829
+ if (active && active !== this._active) {
830
+ this._active = active;
831
+ this.build_steps();
832
+ }
833
+ }
834
+ get active() { return this._active; }
835
+ set inactives(inactives) {
836
+ if (inactives && inactives !== this._inactives) {
837
+ this._inactives = inactives;
838
+ this.build_steps();
839
+ }
840
+ }
841
+ get inactives() { return this._inactives; }
842
+ set complete(complete) {
843
+ if (complete && complete !== this._complete) {
844
+ this._complete = complete;
845
+ this.build_steps();
846
+ }
847
+ }
848
+ get complete() { return this._complete; }
828
849
  ngOnInit() {
829
850
  setTimeout(() => { this.build_steps(); });
830
851
  }
@@ -864,10 +885,10 @@ class TCloudUiLineStepCircleComponent {
864
885
  }
865
886
  }
866
887
  TCloudUiLineStepCircleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
867
- TCloudUiLineStepCircleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiLineStepCircleComponent, selector: "tcloud-ui-line-step-circle", inputs: { step: "step", active: "active", inactives: "inactives", complete: "complete" }, ngImport: i0, template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\r\n <tr>\r\n <ng-container *ngFor=\"let fase of trilha; let i = index\" >\r\n <td class=\"area-circle\">\r\n <!-- <i class=\"fas fa-circle icon-{{ fase.class }} {{ fase.second_class }} \"></i> -->\r\n\r\n <div class=\"tc-circle icon-{{ fase.class }} {{ fase.second_class }}\"></div>\r\n \r\n </td>\r\n <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\r\n <div class=\"step-line {{ fase.class }}\"></div>\r\n </td>\r\n </ng-container>\r\n </tr>\r\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 .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:calc(100% + 2px)}table tr{background-color:transparent!important}table th,table td{vertical-align:middle}.step-default{background-color:#d9d9d9}.step-progress{background-color:#039be5!important}.icon-step-default{background-color:#d9d9d9}.icon-step-progress{background-color:#039be5}.icon-step-active{background-color:#ea9b3e}.step-inactive{background-color:#d9d9d9!important}.tc-circle{height:15px;width:15px;border-radius:50%;position:relative;z-index:1}\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"] }] });
888
+ TCloudUiLineStepCircleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiLineStepCircleComponent, selector: "tcloud-ui-line-step-circle", inputs: { step: "step", active: "active", inactives: "inactives", complete: "complete" }, ngImport: i0, template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\r\n <tr>\r\n <ng-container *ngFor=\"let fase of trilha; let i = index\" >\r\n <td class=\"area-circle\">\r\n <!-- <i class=\"fas fa-circle icon-{{ fase.class }} {{ fase.second_class }} \"></i> -->\r\n\r\n <div class=\"tc-circle icon-{{ fase.class }} {{ fase.second_class }}\"></div>\r\n \r\n </td>\r\n <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\r\n <div class=\"step-line {{ fase.class }}\"></div>\r\n </td>\r\n </ng-container>\r\n </tr>\r\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 .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:calc(100% + 2px)}table tr{background-color:transparent!important}table th,table td{vertical-align:middle}.step-default{background-color:#d9d9d9}.step-progress{background-color:#039be5!important}.icon-step-default{background-color:#d9d9d9}.icon-step-progress{background-color:#039be5}.icon-step-active{background-color:#ea9b3e}.step-inactive{background-color:#d9d9d9!important}.tc-circle{height:13px;width:13px;border-radius:50%;position:relative;z-index:1;font-size:13px}\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"] }] });
868
889
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiLineStepCircleComponent, decorators: [{
869
890
  type: Component,
870
- args: [{ selector: 'tcloud-ui-line-step-circle', template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\r\n <tr>\r\n <ng-container *ngFor=\"let fase of trilha; let i = index\" >\r\n <td class=\"area-circle\">\r\n <!-- <i class=\"fas fa-circle icon-{{ fase.class }} {{ fase.second_class }} \"></i> -->\r\n\r\n <div class=\"tc-circle icon-{{ fase.class }} {{ fase.second_class }}\"></div>\r\n \r\n </td>\r\n <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\r\n <div class=\"step-line {{ fase.class }}\"></div>\r\n </td>\r\n </ng-container>\r\n </tr>\r\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 .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:calc(100% + 2px)}table tr{background-color:transparent!important}table th,table td{vertical-align:middle}.step-default{background-color:#d9d9d9}.step-progress{background-color:#039be5!important}.icon-step-default{background-color:#d9d9d9}.icon-step-progress{background-color:#039be5}.icon-step-active{background-color:#ea9b3e}.step-inactive{background-color:#d9d9d9!important}.tc-circle{height:15px;width:15px;border-radius:50%;position:relative;z-index:1}\n"] }]
891
+ args: [{ selector: 'tcloud-ui-line-step-circle', template: "<table class=\"table-trilha\" cellspacing=\"0\" cellpadding=\"0\">\r\n <tr>\r\n <ng-container *ngFor=\"let fase of trilha; let i = index\" >\r\n <td class=\"area-circle\">\r\n <!-- <i class=\"fas fa-circle icon-{{ fase.class }} {{ fase.second_class }} \"></i> -->\r\n\r\n <div class=\"tc-circle icon-{{ fase.class }} {{ fase.second_class }}\"></div>\r\n \r\n </td>\r\n <td class=\"area-line\" *ngIf=\"(i+1) < (trilha).length\">\r\n <div class=\"step-line {{ fase.class }}\"></div>\r\n </td>\r\n </ng-container>\r\n </tr>\r\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 .step-line{width:100%;height:2px;background-color:#ccc;padding:0;margin-left:-1px;width:calc(100% + 2px)}table tr{background-color:transparent!important}table th,table td{vertical-align:middle}.step-default{background-color:#d9d9d9}.step-progress{background-color:#039be5!important}.icon-step-default{background-color:#d9d9d9}.icon-step-progress{background-color:#039be5}.icon-step-active{background-color:#ea9b3e}.step-inactive{background-color:#d9d9d9!important}.tc-circle{height:13px;width:13px;border-radius:50%;position:relative;z-index:1;font-size:13px}\n"] }]
871
892
  }], ctorParameters: function () { return []; }, propDecorators: { step: [{
872
893
  type: Input
873
894
  }], active: [{
@@ -1245,6 +1266,7 @@ class TCloudUiDataListComponent {
1245
1266
  }
1246
1267
  }
1247
1268
  if (this.selected_item === undefined || this.selected_item === null || this.selected_item === '') {
1269
+ this.selected_description = '';
1248
1270
  this.toChange();
1249
1271
  }
1250
1272
  }
@@ -2253,12 +2275,33 @@ class Step {
2253
2275
  class TCloudUiNumberStepComponent {
2254
2276
  constructor() {
2255
2277
  this.step = 7;
2256
- this.active = 0;
2257
- this.inactives = [];
2258
- this.complete = false;
2259
2278
  this.useIconCheck = false;
2279
+ this._active = 0;
2280
+ this._inactives = [];
2281
+ this._complete = false;
2260
2282
  this.trilha = new Array();
2261
2283
  }
2284
+ set active(active) {
2285
+ if (active && active !== this._active) {
2286
+ this._active = active;
2287
+ this.build_steps();
2288
+ }
2289
+ }
2290
+ get active() { return this._active; }
2291
+ set inactives(inactives) {
2292
+ if (inactives && inactives !== this._inactives) {
2293
+ this._inactives = inactives;
2294
+ this.build_steps();
2295
+ }
2296
+ }
2297
+ get inactives() { return this._inactives; }
2298
+ set complete(complete) {
2299
+ if (complete && complete !== this._complete) {
2300
+ this._complete = complete;
2301
+ this.build_steps();
2302
+ }
2303
+ }
2304
+ get complete() { return this._complete; }
2262
2305
  ngOnInit() {
2263
2306
  setTimeout(() => { this.build_steps(); });
2264
2307
  }
@@ -2301,20 +2344,20 @@ class TCloudUiNumberStepComponent {
2301
2344
  }
2302
2345
  }
2303
2346
  TCloudUiNumberStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2304
- 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}table th,table td{vertical-align:middle}.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"] }] });
2347
+ TCloudUiNumberStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiNumberStepComponent, selector: "tcloud-ui-number-step", inputs: { step: "step", useIconCheck: "useIconCheck", active: "active", inactives: "inactives", complete: "complete" }, 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}table th,table td{vertical-align:middle}.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"] }] });
2305
2348
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiNumberStepComponent, decorators: [{
2306
2349
  type: Component,
2307
2350
  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}table th,table td{vertical-align:middle}.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"] }]
2308
2351
  }], ctorParameters: function () { return []; }, propDecorators: { step: [{
2309
2352
  type: Input
2353
+ }], useIconCheck: [{
2354
+ type: Input
2310
2355
  }], active: [{
2311
2356
  type: Input
2312
2357
  }], inactives: [{
2313
2358
  type: Input
2314
2359
  }], complete: [{
2315
2360
  type: Input
2316
- }], useIconCheck: [{
2317
- type: Input
2318
2361
  }] } });
2319
2362
 
2320
2363
  class TCloudUiNumberStepModule {