coer-elements 0.0.79 → 0.0.80

Sign up to get free protection for your applications and to get access to all the features.
@@ -19,7 +19,7 @@ export declare class CoerDateBox extends ControlValue implements OnInit {
19
19
  isLoading: import("@angular/core").InputSignal<boolean>;
20
20
  isInvalid: import("@angular/core").InputSignal<boolean>;
21
21
  isValid: import("@angular/core").InputSignal<boolean>;
22
- textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
22
+ textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
23
23
  width: import("@angular/core").InputSignal<string>;
24
24
  minWidth: import("@angular/core").InputSignal<string>;
25
25
  maxWidth: import("@angular/core").InputSignal<string>;
@@ -30,7 +30,7 @@ export declare class CoerNumberBox extends ControlValue implements OnInit {
30
30
  isReadonly: import("@angular/core").InputSignal<boolean>;
31
31
  isLoading: import("@angular/core").InputSignal<boolean>;
32
32
  selectOnFocus: import("@angular/core").InputSignal<boolean>;
33
- textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
33
+ textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
34
34
  onKeyupEnter: import("@angular/core").OutputEmitterRef<string | number>;
35
35
  onInput: import("@angular/core").OutputEmitterRef<string | number>;
36
36
  ngOnInit(): void;
@@ -6,14 +6,13 @@ export declare class CoerToolbar {
6
6
  protected _isLoading: WritableSignal<boolean>;
7
7
  appName: import("@angular/core").InputSignal<string>;
8
8
  user: import("@angular/core").InputSignal<any>;
9
- image: import("@angular/core").InputSignal<string>;
9
+ image: import("@angular/core").InputSignal<string | null>;
10
10
  onClickMenu: import("@angular/core").OutputEmitterRef<MouseEvent>;
11
11
  onClickUser: import("@angular/core").OutputEmitterRef<void>;
12
12
  /** */
13
13
  protected ToogleSideNave(event: MouseEvent): void;
14
14
  protected userName: import("@angular/core").Signal<string>;
15
15
  protected userTitle: import("@angular/core").Signal<string>;
16
- protected userImage: import("@angular/core").Signal<string>;
17
16
  protected get showUser(): boolean;
18
17
  protected get paddingLeft(): string;
19
18
  protected GetPadding: (container: "user-identity" | "user-container") => string;
@@ -28,7 +28,7 @@ export declare class CoerTextarea extends ControlValue implements OnInit {
28
28
  isLoading: import("@angular/core").InputSignal<boolean>;
29
29
  showFooter: import("@angular/core").InputSignal<boolean>;
30
30
  resize: import("@angular/core").InputSignal<boolean>;
31
- textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
31
+ textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
32
32
  onInput: import("@angular/core").OutputEmitterRef<string | number>;
33
33
  ngOnInit(): void;
34
34
  get value(): string | number | null | undefined;
@@ -32,7 +32,7 @@ export declare class CoerTextBox extends ControlValue implements OnInit {
32
32
  isReadonly: import("@angular/core").InputSignal<boolean>;
33
33
  isLoading: import("@angular/core").InputSignal<boolean>;
34
34
  selectOnFocus: import("@angular/core").InputSignal<boolean>;
35
- textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
35
+ textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
36
36
  onKeyupEnter: import("@angular/core").OutputEmitterRef<string | number>;
37
37
  onInput: import("@angular/core").OutputEmitterRef<string | number>;
38
38
  onClickClear: import("@angular/core").OutputEmitterRef<void>;
@@ -3445,7 +3445,7 @@ class CoerToolbar {
3445
3445
  //Inputs
3446
3446
  this.appName = input('');
3447
3447
  this.user = input(null);
3448
- this.image = input('');
3448
+ this.image = input(null);
3449
3449
  //Outputs
3450
3450
  this.onClickMenu = output();
3451
3451
  this.onClickUser = output();
@@ -3466,23 +3466,6 @@ class CoerToolbar {
3466
3466
  const title = Tools.IsNotNull(this.user()) && Tools.IsNotOnlyWhiteSpace(this.user()?.title) ? this.user().title : '';
3467
3467
  return `${position}${legend}${caption}${title}`.trim();
3468
3468
  });
3469
- //computed
3470
- this.userImage = computed(() => {
3471
- const NO_IMAGE = 'coer-elements/images/no-user.png';
3472
- if (Tools.IsNotNull(this.user()) && Tools.IsNotOnlyWhiteSpace(this.user()?.image)) {
3473
- return this.user().image;
3474
- }
3475
- if (Tools.IsNotNull(this.user()) && Tools.IsNotOnlyWhiteSpace(this.user()?.userImage)) {
3476
- return this.user().userImage;
3477
- }
3478
- if (Tools.IsNotNull(this.user()) && Tools.IsNotOnlyWhiteSpace(this.user()?.photo)) {
3479
- return this.user().photo;
3480
- }
3481
- if (Tools.IsNotNull(this.user()) && Tools.IsNotOnlyWhiteSpace(this.user()?.userPhoto)) {
3482
- return this.user().userPhoto;
3483
- }
3484
- return NO_IMAGE;
3485
- });
3486
3469
  //getter
3487
3470
  this.GetPadding = (container) => {
3488
3471
  if (this.userName().length > 0 || this.userTitle().length > 0) {
@@ -3519,11 +3502,11 @@ class CoerToolbar {
3519
3502
  this.onClickUser.emit();
3520
3503
  }
3521
3504
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerToolbar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3522
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerToolbar, isStandalone: false, selector: "coer-toolbar", inputs: { appName: { classPropertyName: "appName", publicName: "appName", isSignal: true, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickMenu: "onClickMenu", onClickUser: "onClickUser" }, ngImport: i0, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar>\r\n <coer-button\r\n type=\"icon\"\r\n icon=\"menu\"\r\n [isLoading]=\"isLoading\"\r\n (onClick)=\"ToogleSideNave($event)\"\r\n ></coer-button>\r\n\r\n <span class=\"app-name\"> {{ appName() }} </span>\r\n\r\n <span class=\"fill-space\"></span>\r\n\r\n @if(showUser) {\r\n <div class=\"user-container\" (click)=\"ClickUser()\" [ngStyle]=\"{ 'padding-right': GetPadding('user-container') }\">\r\n <div class=\"user-image\" [ngStyle]=\"{ 'background-image': 'url(' + userImage() + ')' }\"></div>\r\n <div class=\"user-identity\" [ngStyle]=\"{ 'padding-left': GetPadding('user-identity') }\">\r\n \r\n @if(userName().length > 0) {\r\n <p> {{ userName() }} </p>\r\n }\r\n \r\n @if(userTitle().length > 0) {\r\n <p> {{ userTitle() }} </p>\r\n }\r\n </div>\r\n </div> \r\n }\r\n </mat-toolbar>\r\n\r\n <div class=\"shadow\"></div>\r\n</div>\r\n", styles: ["div#coer-tool-bar{z-index:1}div#coer-tool-bar mat-toolbar{height:45px;position:relative;z-index:10;padding:0}div#coer-tool-bar mat-toolbar span.app-name{max-width:45%}div#coer-tool-bar mat-toolbar div.user-container{max-width:45%;display:flex;align-items:center;font-size:small!important;font-weight:700;height:40px!important;max-height:40px!important;padding-left:2px!important;margin-right:10px!important;border-radius:8px!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.user-container div.user-image{min-width:35px!important;max-width:35px!important;min-height:35px!important;max-height:35px!important;border-radius:25px;background:transparent;background-size:cover;background-repeat:no-repeat;background-position:top}div#coer-tool-bar mat-toolbar div.user-container div.user-identity{height:40px!important;max-height:40px!important;overflow:hidden!important;display:flex!important;flex-flow:column!important;justify-content:center!important}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p{line-height:normal!important;overflow:hidden;text-overflow:ellipsis}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p::selection{background-color:transparent!important}div#coer-tool-bar mat-toolbar div.user-container:hover{transform:scale(1.03);box-shadow:0 0 15px -5px #000!important}div#coer-tool-bar div.shadow{box-shadow:1px -10px 20px #000!important;width:100vw;height:45px;position:absolute;top:0;z-index:8}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$a.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "icon", "iconPosition", "animation", "isLoading", "isDisabled", "isInvisible", "width", "minWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "path", "tooltipPosition", "tooltip"], outputs: ["onClick"] }] }); }
3505
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerToolbar, isStandalone: false, selector: "coer-toolbar", inputs: { appName: { classPropertyName: "appName", publicName: "appName", isSignal: true, isRequired: false, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickMenu: "onClickMenu", onClickUser: "onClickUser" }, ngImport: i0, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar>\r\n <coer-button\r\n type=\"icon\"\r\n icon=\"menu\"\r\n [isLoading]=\"isLoading\"\r\n (onClick)=\"ToogleSideNave($event)\"\r\n ></coer-button>\r\n\r\n <span class=\"app-name\"> {{ appName() }} </span>\r\n\r\n <span class=\"fill-space\"></span>\r\n\r\n @if(showUser) {\r\n <div class=\"user-container\" (click)=\"ClickUser()\" [ngStyle]=\"{ 'padding-right': GetPadding('user-container') }\">\r\n <div class=\"user-image\" [ngStyle]=\"{ 'background-image': 'url(' + (image() | noImage) + ')' }\"></div>\r\n <div class=\"user-identity\" [ngStyle]=\"{ 'padding-left': GetPadding('user-identity') }\">\r\n \r\n @if(userName().length > 0) {\r\n <p> {{ userName() }} </p>\r\n }\r\n \r\n @if(userTitle().length > 0) {\r\n <p> {{ userTitle() }} </p>\r\n }\r\n </div>\r\n </div> \r\n }\r\n </mat-toolbar>\r\n\r\n <div class=\"shadow\"></div>\r\n</div>\r\n", styles: ["div#coer-tool-bar{z-index:1}div#coer-tool-bar mat-toolbar{height:45px;position:relative;z-index:10;padding:0}div#coer-tool-bar mat-toolbar span.app-name{max-width:45%}div#coer-tool-bar mat-toolbar div.user-container{max-width:45%;display:flex;align-items:center;font-size:small!important;font-weight:700;height:40px!important;max-height:40px!important;padding-left:2px!important;margin-right:10px!important;border-radius:8px!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.user-container div.user-image{min-width:35px!important;max-width:35px!important;min-height:35px!important;max-height:35px!important;border-radius:25px;background:transparent;background-size:cover;background-repeat:no-repeat;background-position:top}div#coer-tool-bar mat-toolbar div.user-container div.user-identity{height:40px!important;max-height:40px!important;overflow:hidden!important;display:flex!important;flex-flow:column!important;justify-content:center!important}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p{line-height:normal!important;overflow:hidden;text-overflow:ellipsis}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p::selection{background-color:transparent!important}div#coer-tool-bar mat-toolbar div.user-container:hover{transform:scale(1.03);box-shadow:0 0 15px -5px #000!important}div#coer-tool-bar div.shadow{box-shadow:1px -10px 20px #000!important;width:100vw;height:45px;position:absolute;top:0;z-index:8}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$a.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "icon", "iconPosition", "animation", "isLoading", "isDisabled", "isInvisible", "width", "minWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "path", "tooltipPosition", "tooltip"], outputs: ["onClick"] }, { kind: "pipe", type: i9.NoImagePipe, name: "noImage" }] }); }
3523
3506
  }
3524
3507
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerToolbar, decorators: [{
3525
3508
  type: Component,
3526
- args: [{ selector: 'coer-toolbar', standalone: false, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar>\r\n <coer-button\r\n type=\"icon\"\r\n icon=\"menu\"\r\n [isLoading]=\"isLoading\"\r\n (onClick)=\"ToogleSideNave($event)\"\r\n ></coer-button>\r\n\r\n <span class=\"app-name\"> {{ appName() }} </span>\r\n\r\n <span class=\"fill-space\"></span>\r\n\r\n @if(showUser) {\r\n <div class=\"user-container\" (click)=\"ClickUser()\" [ngStyle]=\"{ 'padding-right': GetPadding('user-container') }\">\r\n <div class=\"user-image\" [ngStyle]=\"{ 'background-image': 'url(' + userImage() + ')' }\"></div>\r\n <div class=\"user-identity\" [ngStyle]=\"{ 'padding-left': GetPadding('user-identity') }\">\r\n \r\n @if(userName().length > 0) {\r\n <p> {{ userName() }} </p>\r\n }\r\n \r\n @if(userTitle().length > 0) {\r\n <p> {{ userTitle() }} </p>\r\n }\r\n </div>\r\n </div> \r\n }\r\n </mat-toolbar>\r\n\r\n <div class=\"shadow\"></div>\r\n</div>\r\n", styles: ["div#coer-tool-bar{z-index:1}div#coer-tool-bar mat-toolbar{height:45px;position:relative;z-index:10;padding:0}div#coer-tool-bar mat-toolbar span.app-name{max-width:45%}div#coer-tool-bar mat-toolbar div.user-container{max-width:45%;display:flex;align-items:center;font-size:small!important;font-weight:700;height:40px!important;max-height:40px!important;padding-left:2px!important;margin-right:10px!important;border-radius:8px!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.user-container div.user-image{min-width:35px!important;max-width:35px!important;min-height:35px!important;max-height:35px!important;border-radius:25px;background:transparent;background-size:cover;background-repeat:no-repeat;background-position:top}div#coer-tool-bar mat-toolbar div.user-container div.user-identity{height:40px!important;max-height:40px!important;overflow:hidden!important;display:flex!important;flex-flow:column!important;justify-content:center!important}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p{line-height:normal!important;overflow:hidden;text-overflow:ellipsis}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p::selection{background-color:transparent!important}div#coer-tool-bar mat-toolbar div.user-container:hover{transform:scale(1.03);box-shadow:0 0 15px -5px #000!important}div#coer-tool-bar div.shadow{box-shadow:1px -10px 20px #000!important;width:100vw;height:45px;position:absolute;top:0;z-index:8}\n"] }]
3509
+ args: [{ selector: 'coer-toolbar', standalone: false, template: "<div id=\"coer-tool-bar\" [ngClass]=\"{ 'position-relative': _isModalOpen() }\">\r\n <mat-toolbar>\r\n <coer-button\r\n type=\"icon\"\r\n icon=\"menu\"\r\n [isLoading]=\"isLoading\"\r\n (onClick)=\"ToogleSideNave($event)\"\r\n ></coer-button>\r\n\r\n <span class=\"app-name\"> {{ appName() }} </span>\r\n\r\n <span class=\"fill-space\"></span>\r\n\r\n @if(showUser) {\r\n <div class=\"user-container\" (click)=\"ClickUser()\" [ngStyle]=\"{ 'padding-right': GetPadding('user-container') }\">\r\n <div class=\"user-image\" [ngStyle]=\"{ 'background-image': 'url(' + (image() | noImage) + ')' }\"></div>\r\n <div class=\"user-identity\" [ngStyle]=\"{ 'padding-left': GetPadding('user-identity') }\">\r\n \r\n @if(userName().length > 0) {\r\n <p> {{ userName() }} </p>\r\n }\r\n \r\n @if(userTitle().length > 0) {\r\n <p> {{ userTitle() }} </p>\r\n }\r\n </div>\r\n </div> \r\n }\r\n </mat-toolbar>\r\n\r\n <div class=\"shadow\"></div>\r\n</div>\r\n", styles: ["div#coer-tool-bar{z-index:1}div#coer-tool-bar mat-toolbar{height:45px;position:relative;z-index:10;padding:0}div#coer-tool-bar mat-toolbar span.app-name{max-width:45%}div#coer-tool-bar mat-toolbar div.user-container{max-width:45%;display:flex;align-items:center;font-size:small!important;font-weight:700;height:40px!important;max-height:40px!important;padding-left:2px!important;margin-right:10px!important;border-radius:8px!important;cursor:pointer!important}div#coer-tool-bar mat-toolbar div.user-container div.user-image{min-width:35px!important;max-width:35px!important;min-height:35px!important;max-height:35px!important;border-radius:25px;background:transparent;background-size:cover;background-repeat:no-repeat;background-position:top}div#coer-tool-bar mat-toolbar div.user-container div.user-identity{height:40px!important;max-height:40px!important;overflow:hidden!important;display:flex!important;flex-flow:column!important;justify-content:center!important}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p{line-height:normal!important;overflow:hidden;text-overflow:ellipsis}div#coer-tool-bar mat-toolbar div.user-container div.user-identity p::selection{background-color:transparent!important}div#coer-tool-bar mat-toolbar div.user-container:hover{transform:scale(1.03);box-shadow:0 0 15px -5px #000!important}div#coer-tool-bar div.shadow{box-shadow:1px -10px 20px #000!important;width:100vw;height:45px;position:absolute;top:0;z-index:8}\n"] }]
3527
3510
  }] });
3528
3511
 
3529
3512
  class ComponentsModule {